/*
Theme Name: kpsclaw
Theme URI: https://wordpress.org/themes/kplaw/
Description: The 2010 theme for WordPress is stylish, customizable, simple, and readable -- make it yours with a custom menu, header image, and background. Twenty Ten supports six widgetized areas (two in the sidebar, four in the footer) and featured images (thumbnails for gallery posts and custom header images for posts and pages). It includes stylesheets for print and the admin Visual Editor, special styles for posts in the "Asides" and "Gallery" categories, and has an optional one-column page template that removes the sidebar.
Author: the WordPress team
Author URI: https://wordpress.org/
Version: 4.0
Tested up to: 6.4
Requires at least: 3.0
Requires PHP: 5.2.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, two-columns, custom-header, custom-background, threaded-comments, sticky-post, translation-ready, microformats, rtl-language-support, editor-style, custom-menu, flexible-header, featured-images, footer-widgets, featured-image-header, block-patterns
Text Domain: twentyten
*/
/* =Reset default browser CSS. Based on work by Eric Meyer.
-------------------------------------------------------------- */ 
:root {
  --color-primary: 20 32 33; /* #142021 in decimal RGB*/
  --color-secondary: 26 91 96; /* #1a5b60 in decimal RGB*/
  --color-dark: 0 0 0; /* #000000 in decimal RGB*/
  --color-white: 255 255 255; /* #ffffff in decimal RGB*/
  --color-light: 140 160 160; /* #8c9f9f in decimal RGB*/
  --bg-light: 244 247 247; /* #f4f7f7 in decimal RGB*/
  --btn-rounded: 50px;
}
body {
  font-family: "Open Sans", sans-serif;
  background: rgb(var(--color-white));
  margin: 0;
  padding: 0;
  font-size: 16px;
  line-height: clamp(1.8em, 3.5vw, 2em);
  font-weight: normal;
  color: rgb(var(--color-dark));
  overflow-x: hidden;
}

/*----Heading------*/

h1, .h1, h2, .h2, h3, .h3, h4, .h4 {
  margin-bottom: .6em;
  font-family: "Cormorant Garamond", sans-serif;
  line-height: normal;
}
h1, .h1 {
  font-size: clamp(36px, 3.5vw, 48px) !important;
}
h2, .h2 {
  font-size: clamp(30px, 3vw, 36px) !important;
}
h3, .h3 {
  font-size: clamp(24px, 3vw, 30px) !important;
}
h4, .h4 {
  font-size: clamp(20px, 3vw, 24px) !important;
}
h5, .h5 {
  font-size: clamp(18px, 3vw, 20px) !important;
}
.fancy-heading1{
    border-left: 5px solid rgb(var(--color-secondary));;
    padding-left: 30px;
}

a {
  color: inherit;
}
a, img {
  text-decoration: none;
  box-shadow: inset 0 0 0 0;
  transition: all 0.3s ease-in-out;
}
a:hover {
  color: #5467aa;
}
dl, ol, ul {
    margin-bottom: inherit;
}
/*----Header------*/
header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 999;
transition: all 0.3s ease-in-out;
  background: rgba(var(--color-primary)/90%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  -o-backdrop-filter: blur(10px);
}
ul#menu-cta-button {
  display: flex;
  gap: 10px;
  margin: 0;
  padding: 0;
}
.navbar, .header.sticky {}
.navbar-brand img {
  max-width: 250px;
max-height: 50px;
  width: auto;
  z-index: 1;
}
/*----css condition------*/
.home .innerbanner {
  display: none;
}

/*----Top Nav------*/
.navbar-nav {
  gap: 10px;
}
.nav-link {
  color: #FFFFFF;
  text-transform: uppercase;
}
.nav-link:focus, .nav-link:hover {
  color: rgb(var(--color-secondary));
}
.dropdown .dropdown-menu {
  border-radius: 0;
  padding: 0;
  border: 0;
  border-top: 0.85rem solid transparent;
}
.dropdown .dropdown-menu li + li {
  border-top: 1px solid rgba(var(--color-secondary)/.3);
}
.dropdown .dropdown-menu li a:hover {
  color: rgb(var(--color-secondary));
  background-color: rgba(var(--color-secondary)/.05);
}

.dropdown-toggle::after {
	content: '\f078';
    font-family: "Font Awesome 7 Free";
    font-weight: 700;
    cursor: pointer;
    font-size: .8em;
    vertical-align: middle;
    border: 0;
    margin-left: 10px;
    pointer-events: none;
    display: inline-grid;
    place-content: center;
}
/*----Main middle Wraper------*/
.mainlayout {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
/*----Hero wraper------*/
.hero-wraper {
  position: relative;
	isolation:isolate;
}
.hero-wraper:before {
  position: absolute;
  content: '';
  inset: 0;
  background: rgba(var(--color-primary)/60%);
  z-index:-1;
}
.tpro-client-name {
    font-size: 16px !important;
  font-weight: 700;
}
.tpro-button-prev, .tpro-button-next {
  width: 44px !important;
  height: 44px !important;
}
.vc_section, .vc_column-inner {
  padding-top: 0 !important;
}
.wpb_row, footer, .section {
  padding-bottom: 5vw;
  padding-top: 5vw;
  box-sizing: border-box !important;
}
.wpb_row + .wpb_row:not([class*="bg-"]):not(.vc_row-has-fill), .wpb_row .wpb_row:first-child, .wpb_row .wpb_row + .wpb_row {
  padding-top: 0;
}
.wpb_row .wpb_row:first-child {
  padding-block: 0;
}
.wpb_row .wpb_row:last-child {
  padding-bottom: 0;
}
.innerbanner {
  background: rgb(var(--color-secondary));
  overflow: hidden;
  position: relative;
  isolation: isolate;
  padding-block: 3vw;
}
.innerbanner img {
  width: 100%;
  opacity: .3;
  object-fit: cover;
  padding: 0;
  position: absolute;
  inset: 0;
  height: 100%;
  z-index: -1;
}
.innerbanner .entry-title {
  margin: 0;
  color: rgb(var(--color-white));
}
/*----Bootstrap color element------*/
.bg-dark, .text-bg-dark {
  background-color: rgb(var(--color-primary)) !important;
}
.bg-light, .text-bg-light {
  background-color: rgb(var(--bg-light)) !important;
}
.bg-secondary, .text-bg-secondary {
  background-color: rgb(var(--color-secondary)) !important;
}
.text-success {
  color: rgb(var(--color-secondary)) !important;
}
.text-muted {
  color: rgb(var(--color-light)) !important;
}
/*----Bootstrap input element------*/
.btn {
  font-weight: 500;
  border-radius: var(--btn-rounded);
  text-decoration: none;
}
.btn-success {
  background: rgb(var(--color-secondary));
  border: 0;
}
.btn-success:hover {
  background: rgba(var(--color-secondary)/.5);
}
.btn-outline-success {
  color: rgb(var(--color-white));
  border: 2px solid;
  border-color: rgb(var(--color-secondary));
}
.btn-outline-success:hover {
  background: rgb(var(--color-secondary));
  color: rgb(var(--color-white));
  border-color: rgb(var(--color-secondary));
}
/*----ul, li listing------*/
.listicon {
  margin: 0;
  padding: 0;
}
.listicon li {
  margin-bottom: 10px;
  display: flex;
  column-gap: 20px;
  align-items: center;
}
.listicon li:before {
  font-family: bootstrap-icons;
  display: flex;
  content: '\f138';
  color: rgb(var(--color-secondary));
  font-size: 20px;
  font-weight: 700;
}

/*Infobox*/
.aio-icon-component {
  padding: clamp(15px, 3.5vw, 30px);
  margin: 0 !important;
  position: relative;
  background-color: rgb(var(--color-secondary));
  color: rgb(var(--color-white));
}
.aio-icon-component:before {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 5vw;
  background-color: transparent;
  opacity: .5;
  background-image: radial-gradient(rgb(var(--color-white)) 1px, transparent 1px);
  background-size: 10px 10px;
}
a.aio-icon-read {
  border: 2px solid;
  border-radius: var(--btn-rounded);
  margin-top: 30px;
  padding-inline: 20px;
}
a.aio-icon-read:hover {
  background: rgb(var(--color-white));
  border-color: rgb(var(--color-white));
    color:  rgb(var(--color-primary));
}
.square_box-icon .aio-icon, .square_box-icon .aio-icon-description, .square_box-icon .aio-icon-header, .square_box-icon .aio-icon-img {
  display: flex !important;
  flex-direction: column;
  align-items: baseline;
}
.text-start .square_box-icon .aio-icon, .text-start .square_box-icon .aio-icon-description, .text-start .square_box-icon .aio-icon-header, .text-start .square_box-icon .aio-icon-img {
  text-align: left;
}
/*Card*/
.card {
  border-radius: 0;
  padding: clamp(15px, 4vw, 30px);
}
/*Contact form 7*/
.wpcf7-form label {
  display: block;
}
.wpcf7-form-control-wrap {
  display: block;
  margin-bottom: 15px;
}
.wpcf7-form-control {
  width: 100%;
  border-radius: 0;
  border: 0;
  border-bottom: 1px solid #ccc;
}
.wpcf7-form-control:focus {
  outline: none;
}
.wpcf7-submit {
  border-radius: var(--btn-rounded);
  min-height: 40px;
  padding-inline: 10px;
  background: rgb(var(--color-secondary));
  border-color: rgb(var(--color-secondary));
  color: rgb(var(--color-white));
  transition: all 0.5s forwards;
  -o-transition: all 0.5s forwards;
  -webkit-transition: all 0.5s forwards;
}
.wpcf7-submit:hover {
  background: rgb(var(--color-primary));
  border-color: rgb(var(--color-primary));
}
.wpcf7-not-valid-tip {
  font-size: .8em !important;
}
.wpcf7 form .wpcf7-response-output {
  margin-bottom: 0 !important;
  margin-inline: 0 !important;
  font-size: .8em;
  padding: 0.5em !important;
  line-height: normal;
}
.wpcf7-textarea {
  line-height: normal;
}
/* Spinner styles */
/* Hide the default Contact Form 7 spinner below the button */
.wpcf7-spinner {
  display: none !important; /* Important to override CF7's default CSS */
}
/* Customt spinner for Contact Form 7 button */
.wpcf7-submit {
  position: relative;
  transition: color 0.3s ease;
}
.wpcf7-submit.loading {
  color: transparent; /* Hide the text */
  pointer-events: none; /* Disable button */
  position: relative;
}
.wpcf7-submit.loading::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 18px;
  border: 2px solid #fff; /* Spinner color */
  border-top-color: transparent;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  animation: spin 0.7s linear infinite;
}
/* Spinner animation */
@keyframes spin {
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
.uavc-list-content {
  margin-bottom: 15px !important;
}
/* Testimonial */
#sp-testimonial-pro-wrapper-45.sp-testimonial-pro-wrapper .sp-testimonial-pro-section.sp-tpCarousel {
  padding-bottom: 0 !important;
}
#sp-testimonial-pro-45.sp-testimonial-pro-section .swiper-slide.sp-testimonial-pro-item {
  padding-bottom: 0 !important;
}
/*Team page style1*/
.team-img {
  padding-right: clamp(15px, 3.5vw, 30px);
  padding-bottom: clamp(15px, 3.5vw, 30px);
  position: sticky;
  top: 0;
  isolation: isolate;
}
.team-img:before {
  content: "";
  position: absolute;
  background: rgba(var(--color-secondary)/.5);
  right: 0;
  bottom: 0;
  width: 60%;
  height: 60%;
  z-index: -1;
}
.contact-details {
  display: flex;
  flex-wrap: wrap;
  column-gap: 20px;
  align-items: center;
  padding-top: 20px;
  margin-top: 20px;
  border-top: 1px solid rgba(var(--color-white)/10%);;
}
.contact-details i{
    border: 1px solid;
    border-radius: 50%;
    padding: 10px;
    width: 40px;
    height: 40px;
    margin-right: 10px;
    display: inline-grid;
    place-content:center;
}
.contact-details a:hover{
    color: rgb(var(--color-light));
}

/*Team page style2*/
.team-banner{
    display: grid;
    place-content: center;
    background: rgb(var(--color-primary));
}
.team-banner>img{
    height: clamp(250px, 30vw, 400px);
    object-fit: cover;
	object-position: 0 30%;
    opacity: .3;
}
.team-banner>*{
    grid-area: 1/1
}
.team-banner .team-caption{
        padding: 5vw;
    text-align: center;
    display: grid;
    place-content: center;
    position: relative;
    color: rgb(var(--color-white));
}
.img-desc-wraper{
    position: relative;
    background: rgb(var(--color-secondary));
    color: rgb(var(--color-white));
}
.short-desc{
    padding: 5vw;
    position: relative;
}
.short-desc:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    aspect-ratio:1;
    width: 200px;
    background-color: transparent;
    opacity: .3;
    background-image: radial-gradient(rgb(var(--color-white)) 1px, transparent 1px);
    background-size: 10px 10px;
}
.short-desc>*:first-of-type::first-letter {font-size:3em; float: left; line-height: 1; margin-right: 10px;}

/*----Footer section------*/
footer {
  position: relative;
  background-size: cover;
  background-position: center;
  isolation: isolate;
  margin-top: auto;
  padding-bottom: 0;
}
footer h5 hr {
  max-width: 30px;
  opacity: 1;
  border-color: rgb(var(--color-secondary));
}
footer:before {
  background: rgb(var(--bg-light));
  position: absolute;
  inset: 0;
  content: '';
  opacity: .85;
  z-index: -1;
}
footer a {
  text-decoration: none;
  color: rgb(var(--color-dark));
  font-weight: 400;
}
footer a:hover {
  text-decoration: none;
  color: rgb(var(--color-secondary));
  box-shadow: none;
}
footer img {
  max-width: 275px;
}
footer ul, footer div {
  list-style: none;
  padding: 0;
}
footer ul li {
  line-height: 30px;
}
/*----Social icon styling------*/
.social {
  display: flex;
  gap: 15px;
}
.social a {
  color: rgb(var(--color-secondary));
  transition: 0.2s;
  font-size: 18px;
  border: 1px solid rgb(var(--color-secondary));
  padding: 8px;
  border-radius: 50%;
  aspect-ratio: 1;
  display: grid;
  place-content: center;
}
.social a:hover {
  background: rgb(var(--color-secondary));
  color: rgb(var(--color-white));
}

.social.phone-icon a{color:#ffffff8c; border-color:#ffffff8c;}

/*----Hide default sidebar------*/
#primary.widget-area, #search, #archives, #meta {
    display: none !important;
}

.hero-wraper{height:100vh; position:relative;}
.hero-wraper .vc_row{position:absolute; bottom:0;}

/*----Responsive layout------*/
@media (min-width: 1400px) {
  h1, .h1 {
    font-size: 60px;
  }
}
@media (max-width: 992px) {
	.navbar-nav {
  gap: 0px;
}
  .nav-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid rgba(var(--color-light)/30%);
  }
.dropdown.menu-item-has-children .dropdown-toggle {
  padding-right: 40px;
}
.dropdown-toggle::after {
	position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 40px;
	height: 45px;
}
}
@media (max-width: 767.98px) {
		.hero-wraper:before {
	  backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
	}
  .nav-link:focus, .nav-link:hover {
    color: rgb(var(--color-white));
  }
  .dropdown .dropdown-menu {
    border-top: 1px solid rgba(var(--color-light)/30%);
    background: transparent;
  }
  .dropdown .dropdown-menu li a {
    color: rgb(var(--color-light));
  }
	.navbar-brand img {
		max-width: 180px;}
}
@media (min-width: 768px) {
    .img-desc-wraper{margin-top: -100px;}
  .list-col-2 ul {
    column-count: 2;
  }
}
@media (min-width:991px) {
	.home header:not(header.sticky) {
  background:transparent;
backdrop-filter: none;
}
  .dropdown .dropdown-menu {
    display: block;
    visibility: hidden;
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
    -webkit-transition: all .3s ease-in;
    -o-transition: all .3s ease-in;
    transition: all .3s ease-in;
    box-shadow: 0 10px 10px rgb(0 0 0 / 10%);
  }
  .dropdown:hover > .dropdown-menu {
    visibility: visible;
    opacity: 1;
    -webkit-transform: scaleY(1);
    -ms-transform: scaleY(1);
    transform: scaleY(1);
  }

}
@media (max-width: 575.98px) {
	.hero-wraper{height:620px;}

}