@charset "utf-8";

/*..............embedded fonts (Google Fonts enqueued in functions.php)..............*/
@font-face {
    font-family: 'Black Mango';
    src: url('../fonts/BlackMango-Black.eot');
    src: url('../fonts/BlackMango-Black.eot?#iefix') format('embedded-opentype'),
        url('../fonts/BlackMango-Black.woff2') format('woff2'),
        url('../fonts/BlackMango-Black.woff') format('woff'),
        url('../fonts/BlackMango-Black.ttf') format('truetype'),
        url('../fonts/BlackMango-Black.svg#BlackMango-Black') format('svg');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Black Mango';
    src: url('../fonts/BlackMango-Regular.eot');
    src: url('../fonts/BlackMango-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/BlackMango-Regular.woff2') format('woff2'),
        url('../fonts/BlackMango-Regular.woff') format('woff'),
        url('../fonts/BlackMango-Regular.ttf') format('truetype'),
        url('../fonts/BlackMango-Regular.svg#BlackMango-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Black Mango';
    src: url('../fonts/BlackMango-Bold.eot');
    src: url('../fonts/BlackMango-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/BlackMango-Bold.woff2') format('woff2'),
        url('../fonts/BlackMango-Bold.woff') format('woff'),
        url('../fonts/BlackMango-Bold.ttf') format('truetype'),
        url('../fonts/BlackMango-Bold.svg#BlackMango-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Black Mango';
    src: url('../fonts/BlackMango-ExtraBold.eot');
    src: url('../fonts/BlackMango-ExtraBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/BlackMango-ExtraBold.woff2') format('woff2'),
        url('../fonts/BlackMango-ExtraBold.woff') format('woff'),
        url('../fonts/BlackMango-ExtraBold.ttf') format('truetype'),
        url('../fonts/BlackMango-ExtraBold.svg#BlackMango-ExtraBold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Black Mango';
    src: url('../fonts/BlackMango-ExtraLight.eot');
    src: url('../fonts/BlackMango-ExtraLight.eot?#iefix') format('embedded-opentype'),
        url('../fonts/BlackMango-ExtraLight.woff2') format('woff2'),
        url('../fonts/BlackMango-ExtraLight.woff') format('woff'),
        url('../fonts/BlackMango-ExtraLight.ttf') format('truetype'),
        url('../fonts/BlackMango-ExtraLight.svg#BlackMango-ExtraLight') format('svg');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Black Mango';
    src: url('../fonts/BlackMango-Light.eot');
    src: url('../fonts/BlackMango-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/BlackMango-Light.woff2') format('woff2'),
        url('../fonts/BlackMango-Light.woff') format('woff'),
        url('../fonts/BlackMango-Light.ttf') format('truetype'),
        url('../fonts/BlackMango-Light.svg#BlackMango-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Black Mango';
    src: url('../fonts/BlackMango-Medium.eot');
    src: url('../fonts/BlackMango-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/BlackMango-Medium.woff2') format('woff2'),
        url('../fonts/BlackMango-Medium.woff') format('woff'),
        url('../fonts/BlackMango-Medium.ttf') format('truetype'),
        url('../fonts/BlackMango-Medium.svg#BlackMango-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Black Mango';
    src: url('../fonts/BlackMango-SemiBold.eot');
    src: url('../fonts/BlackMango-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/BlackMango-SemiBold.woff2') format('woff2'),
        url('../fonts/BlackMango-SemiBold.woff') format('woff'),
        url('../fonts/BlackMango-SemiBold.ttf') format('truetype'),
        url('../fonts/BlackMango-SemiBold.svg#BlackMango-SemiBold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Black Mango';
    src: url('../fonts/BlackMango-Thin.eot');
    src: url('../fonts/BlackMango-Thin.eot?#iefix') format('embedded-opentype'),
        url('../fonts/BlackMango-Thin.woff2') format('woff2'),
        url('../fonts/BlackMango-Thin.woff') format('woff'),
        url('../fonts/BlackMango-Thin.ttf') format('truetype'),
        url('../fonts/BlackMango-Thin.svg#BlackMango-Thin') format('svg');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}



:root {
  /* General Transitions */
  --transition-common: all 0.4s ease 0s;

  /* Colors */
  --color-primary: #0C162F;
  --color-secondary: #B99B69;
  --color-body: #3B3B3B;
  

  --color-white: #FFFFFF;
  --color-black: #000;
  --color-heading: #0C162F;
  /* Font Settings */
  --body-font: "Montserrat", sans-serif;;
  --heading-font: 'Black Mango';


  --font-xxl: clamp(2.375rem, 0.01rem + 6.308vw, 7.5rem);
  /*120 - 30*/
  --font-xl: clamp(1.625rem, 0.644rem + 2.615vw, 3.75rem);
  /*60 - 26*/
  --font-lg: clamp(1.5rem, 1.038rem + 1.231vw, 2.5rem);
  /*40 - 24*/
  --font-md: clamp(1.375rem, 1.087rem + 0.769vw, 2rem);
  /*32 - 22*/
  --font-sm: clamp(1.125rem, 0.837rem + 0.769vw, 1.75rem);
  /*28 - 20*/
  --font-xsm: clamp(1rem, 0.885rem + 0.308vw, 1.25rem);
  /*20 - 16*/


  --fz-body: clamp(0.938rem, 0.793rem + 0.385vw, 1.25rem);
  /*16 - 15*/

  /* Layout Adjustments */
  --gap-100: 100px;
  --gap-50: 50px;
  --gap-40: 40px;
  --gap-30: 30px;
  --gap-20: 20px;

  /* Form Styling */
  --form-height: 58px;
  --form-font-color: var(--color-heading);
  --form-placeholder-color: #ffffff;
  --form-holder-bg: #FDFDFF;
  --form-border-radius: 10px;
  --form-border-color: #0000001A;

  --container-width: 1423px;
  --c-calc: calc((100vw - var(--container-width))/2);
}


/*..............common styles..............*/
html { overflow-x: hidden; } 
body { margin: 0; padding: 0; font-family: var(--body-font); font-size: var(--fz-body); color: var(--color-body); overflow-x: hidden; font-weight: 400; }

/* --------- Global => Typography --------- */
h1, h2, h3, h4, h5, h6 { margin: 0 0 20px; font-family: var(--heading-font); color: var(--color-heading); font-weight: 400; }

:is(h1, h2, h3, h4, h5, h6):last-child { margin-bottom: 0; }
h1 , .h1{ font-size: var(--font-xxl); } 
h2 , .h2{ font-size: var(--font-xl); } 
h3 { font-size: var(--font-lg); } 
h4 { font-size: var(--font-md); }
h5 { font-size: var(--font-sm); } 
h6 { font-size: var(--font-xsm); font-family: var(--body-font); font-weight: 400; } 
p { margin: 0 0 var(--gap-20); } 
p:last-child { margin-bottom: 0; } 
p strong { font-weight: 600; }

.ff-body-all * { font-family: var(--body-font); }
.img-box { overflow: hidden; position: relative; border-radius: 30px;}
.img-box img { position: absolute; width: 100%; height: 100%; inset: 0; object-fit: cover; -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); }
.img-box:hover img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }
ul { margin: 0; padding: 0; list-style: none; }

/* --------- Global => Typography --------- */

img { max-width: 100%; user-select: none; -webkit-user-drag: none; height: auto;} 
figure { margin: 0; } 
a, img { border: 0; text-decoration: none; outline: none; } 
a, a:link, a:visited, a:focus, a:hover { color: var(--color-primary); } 
a:hover { text-decoration: none; } 
.form-group, .form-check { margin-bottom: 24px; } 
.form-check { display: flex; align-items: center; gap: 15px; padding: 0; } 
.form-check .form-check-input { float: none; margin: 0 !important; }

.form-control { height: var(--form-height); background-color: var(--form-holder-bg) !important; border: 0 !important; border-radius: var(--form-border-radius) !important; box-shadow: none !important; resize: none; padding: 5px 24px !important; font-weight: 300; } 
input, textarea, select, .form-control { font-family: var(--body-font); font-weight: 300; outline: none; font-size: clamp(1rem, 0.76rem + 0.308vw, 1.125rem) ; color: #ffffff ; } 
input[type="submit"] { font-family: var(--body-font); transition: all 0.3s ease 0s; outline: none; } 
input:not([type="submit"]) { height: var(--form-height); } 
select { appearance: none; -webkit-appearance: none; padding-right: 40px !important; background-image: url(../images/btm-arrow.svg) !important; background-repeat: no-repeat; background-position: 96% center; background-size: 12px; } 
input.form-control, textarea.form-control, select.form-select { border: 1px solid var(--form-border-color) !important; box-shadow: none !important; resize: none; background-color: var(--form-holder-bg) !important; padding: 15px 24px !important; color: var(--color-white) !important; } 
textarea.form-control { height: 140px !important; padding-top: 20px !important; } 
form label { transition: all 0.4s; } 
.form-floating>label { background-color: #fffaf1; padding: 0 10px; font-size: clamp(0.96875rem, 0.9327rem + 0.1603vw, 1.125rem); font-weight: 450; color: var(--form-placeholder-color); line-height: 1; height: auto; transform: scale(1) translateY(13px) translateX(14px); transition: all 0.4s; background: transparent; overflow: initial; top: 6px; } 
input[type="checkbox"] { width: 25px; height: 25px !important; border: 1px solid #923895 !important; border-radius: 3px !important; box-shadow: none !important; } 
label.form-check-label { font-size: clamp(0.875rem, 0.76rem + 0.308vw, 1.125rem); margin-bottom: 0 !important; } 
.form-check-input:checked[type=checkbox] { background-color: var(--color-primary) !important; } 
::placeholder { color: var(--form-placeholder-color) !important; opacity: 1; display: none; font-weight: 300; } 
::-ms-input-placeholder { color: var(--form-placeholder-color) !important; display: none; font-weight: 300; }

select::placeholder { color: #000 !important; opacity: 1; display: none; font-weight: 300; }

select::-ms-input-placeholder { color: #000 !important; display: none; font-weight: 300; }


textarea.form-control::placeholder { color: var(--form-placeholder-color) !important; display: none; font-weight: 300; }

.form-floating>.form-control-plaintext~label, .form-floating>.form-control:focus~label, .form-floating>.form-control:not(:placeholder-shown)~label, .form-floating>.form-select~label { transform: translateY(-16px) translateX(14px); height: auto; line-height: 1; font-size: 10px; color: var(--form-placeholder-color); padding: 5px 10px; background-color: #fff; border-radius: 20px; border: 1px solid var(--form-border-color); }

.form-floating>.form-control-plaintext~label::after, .form-floating>.form-control:focus~label::after, .form-floating>.form-control:not(:placeholder-shown)~label::after, .form-floating>.form-select~label::after { padding: 0 !important; display: none; }

.gfield_description{display: none !important;}


/* --------- Global => Button --------- */
.btn { min-width: 210px; font-family: "Outfit", sans-serif; font-weight: 500;  overflow: hidden; position: relative; z-index: 1; transition: all 0.6s ease; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; display: inline-flex; align-items: center; vertical-align: top; color: var(--color-primary) !important; padding: 9px 32px 9px 10px; font-size: clamp(1rem, 0.942rem + 0.154vw, 1.125rem); line-height: 1; border-radius: 60px; }

.btn::before { width: 100%; height: 100%; content: ""; position: absolute; left: 0; top: 0; background-color: var(--color-secondary); z-index: -1; transition: all 0.6s ease; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; transform: scale(1.2); }

.btn span { z-index: -1; display: inline-block; position: relative; top: 0px; width: 37px; height: 37px; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; transition: all 0.6s ease; display: flex; justify-content: center; align-items: center; margin-right: 11px; flex-shrink:0}

.btn span::before { content: ""; position: absolute; width: 100%; height: 100%; background-color: var(--color-primary); border-radius: 60px; z-index: 0; top: 0; left: 0; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transform: scale(0); }

.btn span::after { content: ""; position: absolute; width: 100%; height: 100%; background-color: #fff; border-radius: 0; z-index: -1; top: 0; left: 0; transition: all .6s ease; -webkit-transition: all .6s ease; -moz-transition: all .6s ease; -ms-transition: all .6s ease; -o-transition: all .6s ease; transform: scale(1); border-radius: 60px; }

.btn span img { width: 18px; height: 18px; transform: rotate(0deg); transition: all 0.6s ease; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; }

.btn:hover { transform: translate(0px, 0px); transition: all 0.6s ease; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; color: var(--color-primary) !important; }

.btn:hover span { transform: translate(0px, 0px); border-color: #10224B !important; }

.btn:hover span::before { background-color: var(--color-secondary); transition: all 0.6s ease; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; }

.btn:hover span::after { background-color: var(--color-white); width: 100%; height: 100%; left: 40px; transform: scale(12); transition: all 1s ease; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; }

.btn:hover span img { transform: translateX(0px); }
.btn-white { color: var(--color-primary) !important; }
.btn-white::before { background-color: var(--color-white); }
.btn-white span::after { background: linear-gradient(1.7deg, #B99B69 -58.39%, #FCE7BA 101.25%); }
.btn-white:hover span::before { background-color: var(--color-primary);scale: 1; transform: scale(1); }
.btn-white:hover span::after { background-color: var(--color-white); }
.btn-submit input[type="submit"] { position: absolute; inset: 0; z-index: 4; opacity: 0; }

.btn-blue:hover { color: var(--color-white) !important; }
.btn-blue::before { background-color: var(--color-white); } 
.btn-blue span::after { background: var(--color-primary); } 
.btn-blue:hover span::before { background-color: var(--color-primary);scale: 1; transform: scale(1); } 
.btn-blue:hover span::after { background-color: var(--color-secondary); }

.btn-wrapper { display: flex; flex-wrap: wrap; gap: 16px; }

/* --------- Global => Button --------- */


/* --------- Global => Checkbox and Radio --------- */
.builder_radiobox ul li label { font-weight: normal; }

.builder_radiobox ul li input[type="radio"] { opacity: 0; }

.builder_radiobox ul li input[type="radio"]:empty~label { position: relative; float: left; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; padding: 0 0 0 22px; }

.builder_radiobox ul li input[type="radio"]:empty~label:before { position: absolute; display: block; top: 2px; bottom: 0; left: 0; content: ""; width: 16px; height: 16px; background: url(../images/radiobutton.png) left top no-repeat; }

.builder_radiobox ul li input[type="radio"]:checked~label:before { background: url(../images/radiobutton.png) left bottom no-repeat; }

/* --------- Global => Checkbox and Radio --------- */


/* --------- Global => Misc --------- */
.grecaptcha-badge { visibility: hidden; }

.chip { background: linear-gradient(290.1deg, #0A95DB 13.4%, #5FC1F8 86.6%); color: var(--color-white); font-weight: 450; border: 1px solid #FFFFFF; box-shadow: 0px 4px 10px 0px #73A7EA80; border-radius: 50px; padding: 4px; padding-right: 16px; display: inline-flex; justify-content: center; align-items: center; margin-bottom: 16px; }

.chip .chip-icon { width: 34px; height: 34px; border-radius: 50%; background-color: var(--color-white); display: flex; justify-content: center; align-items: center; flex-shrink: 0; margin-right: 8px; }

.chip p { font-size: 16px; margin-bottom: 0; }

.fancy-ancore a, p>a { position: relative; background-image: linear-gradient(#cf303000 95%, currentColor 0, currentColor); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; }
.fancy-ancore a:hover, p>a:hover { background-position-x: right; background-size: 100% 100%; }
.footer-tel { display: flex; align-items: center; border: 1px solid rgba(10, 149, 219, 0.4); border-radius: 30px; padding: 16px; gap: 16px; max-width: 456px; margin-top: 30px; }
.footer-tel p { margin-bottom: 0px; }
.footer-tel h5 { font-family: var(--body-font); font-weight: 600; }

/* --------- Global => Misc --------- */



/* --------- Global => Spacing --------- */
.common-padd { padding-top: 120px; padding-bottom: 120px; }
.common-padd-sm { padding-top: 80px; padding-bottom: 80px; }
.common-padd-50 { padding-top: 50px; padding-bottom: 50px; }
.common-padd-bottom { padding-bottom: 100px; }
.common-padd-bottom-lg { padding-bottom: 150px; }
.common-padd-top-lg { padding-top: 150px; }
.common-padd-top { padding-top: 100px; }

.mb-24 { margin-bottom: 24px; }
.mb-30 { margin-bottom: 30px; }
.mb-40 { margin-bottom: 40px; }
.mb-50 { margin-bottom: 50px; }
.mb-60 { margin-bottom: 60px; }
.mt-10 { margin-top: 10px; }
.mt-30 { margin-top: 30px; }
.mt-40 { margin-top: 40px; }
.mt-50 { margin-top: 50px; }
.mt-80 { margin-top: 80px; }
hr { margin: 0; }

/* --------- Global => Spacing --------- */



/* --------- Global => Scrollbar --------- */
::-webkit-scrollbar { width: 6px; height: 4px; }

/* ::-webkit-scrollbar-track {box-shadow: inset 0 0 2px var(--color-secondary); }  */
::-webkit-scrollbar-thumb { background: var(--color-primary); border-radius: 5px; }

/* --------- Global => Scrollbar --------- */


/*-----Header design----------*/
.main-header { padding: 0; z-index: 999; width: 100%; left: 50%; transform: translateX(-50%); position: fixed; background: var(--color-primary); -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; top: 0; border-bottom: 1px solid #FFFFFF33; }
.main-header .main-menu ul li a {color: var(--color-white);padding: 43px 40px;font-weight: 500; }
.main-header.fixed .main-menu ul li a{padding: 32px 40px;}
.main-header  .main-menu > ul > li > a{border-right: 1px solid #FFFFFF33;}
.main-header .main-menu.hdr-rt > ul > li:first-child > a { border-left: 1px solid #FFFFFF33; }
.main-header .main-menu.hdr-rt > ul >li:last-child > a { border-right: 0; }

.main-header .header-row { display: flex; align-items: center; justify-content: space-between; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; border-bottom: 1px solid #FFFFFF1A; }

.main-menu ul {/* justify-content: center;*/ margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; align-items: center; }
.main-menu ul li a { display: block; color: #fff; position: relative; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; font-family: var(--body-font); }
.main-menu > ul >li >a { padding: 42px 40px; font-weight: 500; color: var(--color-white); }
.main-menu ul li.menu-item-has-children a { opacity: 1; content: ""; width: 100%; }
.main-menu ul li span { margin-left: 10px; }
.main-header.relative_header { background-color: #000000; }
/*------css for new dropdown sub-menu start--------*/
.main-menu ul li.menu-item-has-children>a:after { -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; content: ""; position: absolute; top: calc(50% - 6px); box-sizing: border-box; height: 12px; width: 12px; transition: border-width 150ms ease-in-out; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; right: 27px; margin: 0 auto; border-style: solid; border-color: var(--color-white); border-width: 0 2px 2px 0; transform: rotate(45deg) translate(0, -50%); }
.main-menu ul li.menu-item-has-children a:hover:after { -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; border-color: #ffffff; }
.main-header  .main-menu > ul > li.menu-item-has-children > a { padding-right: 46px; }
.main-menu>ul>li>a, .mobile-menu > ul > li > a, header .current-menu-item>a { background: linear-gradient(180deg, rgba(185, 155, 105, 0.2) 0%, rgba(185, 155, 105, 0.8) 76.71%, rgba(185, 155, 105, 0.8) 100%);
; background-repeat: no-repeat; background-position: bottom; background-size: 100% 0%; }
header .current-menu-item>a, .main-menu>ul>li.current-menu-item>a, .mobile-menu>ul>li.current-menu-item>a, .main-menu>ul>li>a:hover , .mobile-menu > ul > li > a:hover { color: var(--color-white) !important; background-size: 100% 100%; }
.main-menu ul { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
.main-menu ul li { display: flex; justify-content: center; align-items: center; position: relative; perspective: 1000px; z-index: 100; color: #FFFFFF; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; z-index: 0; }
.main-menu ul li.out .sub-menu { opacity: 0; transform: scaleY(0) translateZ(0); visibility: hidden; }
header .main-menu ul > li { position: relative; cursor: pointer; }
header .main-menu ul li:hover ul { box-shadow: 0px 4px 10px 0px #00000014; opacity: 1; transform: scaleY(1) translateZ(0); visibility: visible; display: unset; transition: transform 0.3s, opacity 0.3s ease-out; }


/* ---------- Submenu -------- */
header .main-menu ul .sub-menu { padding: 8px; position: absolute; left: 0; top: calc(100% + 10px); transform-origin: 50% 0; transform: scaleY(0) translateZ(0); transition: all .4s ease; width: 236px; overflow: hidden; box-shadow: none; opacity: 1 !important; visibility: hidden; display: block; background-color: #FFFFFF; box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.08); border-radius: 16px; }

header .main-menu ul .sub-menu li { position: relative; cursor: pointer; transition: all 600ms ease; padding: 12px 16px; background: rgba(250, 226, 197, 0); border: 1px solid #FFFFFF; border-radius: 8px; position: relative; justify-content: flex-start; }

header .main-menu ul .sub-menu li.menu-item-has-children { z-index: 1; }
header .main-menu ul .sub-menu li a { color: var(--color-heading) !important; display: inline-block; width: auto; padding: 0; position: static; text-transform: capitalize;}
/* header .main-menu ul .sub-menu li a:after { content: ""; background-image: url("../images/menu-line.svg"); height: 12px; display: block; width: 100%; z-index: -1; background-size: 100% 100%; transform: scaleX(0); transition: var(--transition-common); transform-origin: left center; margin-top: -14px; position: relative; }
header .main-menu ul .sub-menu li a::before { content: ""; position: absolute; inset: 0; } */
header .main-menu ul .sub-menu li:hover { background: var(--color-secondary); padding-left: 24px; }
header .main-menu ul .sub-menu li:hover a { color: var(--color-white) !important; }
header .main-menu ul .sub-menu li:hover a:after { transform: scaleX(1); }

/* ---------- Submenu -------- */

/*------css for new dropdown sub-menu end--------*/
.logo-wrap { position: relative; text-align: center; padding: 16px 0; z-index: 1; transition: all 0.4s ease;    -webkit-transition: all 0.4s ease;}
header.main-header.fixed .logo-wrap { padding: 0; }

.main-header .logo { transform: scale(1); transform-origin: center center;     -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; max-width: 160px; }
.main-header .logo a { display: inline-block; }
.lava-lamp { position: absolute; bottom: 0; height: 2px; background: var(--color-white); border-radius: 2px; opacity: 0; transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); pointer-events: none; }

.nav_btn { color: #FFFFFF; font-size: 22px; text-align: right; display: none; }
.nav_close { display: none; color: #FFFFFF; }
.main-header.fixed { background: var(--color-primary); position: fixed; width: 100%; transition: all 0.4s; -ms-transition: all 0.4s; -webkit-transition: all 0.4s; }
.main-header.fixed .logo { transform: scale(.9); }

.manu-left , .manu-right{flex:1}


/*==========mobile menu=========*/
.main-header .hdr-rt { display: flex; justify-content: end; }
.main-header .hdr-rt.hdr-lt { gap: 50px; justify-content: flex-end; }
.main-header .user-sec { margin-left: 100px; display: flex; align-items: center; }
.menu-has-children.menu-has-children-open span img { -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; }
.menu-has-children span img { transform: rotate(0deg); -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; }


/* ~~~~~~~~~~ mobile menu styling ~~~~~~~~~~ */
.mobile-menu-container { position: fixed; z-index: 1; top: -100vh; left: -6%; right: -6%; background: var(--color-heading); height: calc(100vh + 40px); opacity: 0; -webkit-transition: all .35s ease-in-out; -moz-transition: all .35s ease-in-out; -o-transition: all .35s ease-in-out; transition: all .35s ease-in-out; display: none; z-index: -1; }
.mobile-menu-open .mobile-menu-container { top: 0; transform: translateY(0); opacity: 1; }
.mobile-menu-container .inner-container { padding-top: 140px; height: 100dvh; position: relative; }
.mobile-menu-container .btn { width: 100%; }

.mobile-menu {  padding-bottom: 30px; }
.mobile-menu ul { margin: 0; margin-bottom: 20px; padding: 0; list-style: none; }
.mobile-menu ul li { display: block; margin: 10px 0; }

.mobile-menu ul li a { display: block; font-size: 30px; color: #273B7A; padding: 4px 0; transition: color 0.4s ease, background-size 0.4s ease; }
.mobile-menu>ul>li>a { border-bottom: 1px solid #FFFFFF1A; } 
.mobile-menu ul li.menu-item-has-children>a { padding-right: 15px; } 
/* ===== mobile menu animation ===== */ 
.mobile-menu ul li { opacity: 0; -webkit-transform: translateX(-150px); transform: translateX(-150px); -webkit-transition: -webkit-transform 0.4s, opacity 0.4s; transition: transform 0.4s, opacity 0.4s; } 
.mobile-menu-open .mobile-menu ul li { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 
.mobile-menu-open .mobile-menu ul li:nth-child(1) { -webkit-transition-delay: 0.16s; transition-delay: 0.16s; } 
.mobile-menu-open .mobile-menu ul li:nth-child(2) { -webkit-transition-delay: 0.24s; transition-delay: 0.24s; } 
.mobile-menu-open .mobile-menu ul li:nth-child(3) { -webkit-transition-delay: 0.32s; transition-delay: 0.32s; } 
.mobile-menu-open .mobile-menu ul li:nth-child(4) { -webkit-transition-delay: 0.40s; transition-delay: 0.40s; } 
.mobile-menu-open .mobile-menu ul li:nth-child(5) { -webkit-transition-delay: 0.48s; transition-delay: 0.48s; } 
.mobile-menu-open .mobile-menu ul li:nth-child(6) { -webkit-transition-delay: 0.54s; transition-delay: 0.54s; } 
/* ===== mobile menu animation ===== */ 
.mobile-menu-open .mobile-menu ul li.btn { margin: 0 auto; padding: 5px 5px; max-width: 150px; } 
.mobile-menu-open .mobile-menu ul li.btn a { color: #FFFFFF; } 
.mobile-menu-btn { display: none; }

/*=========mobile menu===========*/

/*for header css*/

/* ~~~~~~~~~~ hamburger menu styling ~~~~~~~~~~ */
.hamburger-nav { display: none; position: relative; } 
.hamburger-nav .ham { width: 62px; }

/*when turns close icon*/
.ham { cursor: pointer; -webkit-tap-highlight-color: transparent; transition: transform 400ms; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } 
.hamRotate.active { transform: rotate(45deg); } 
.hamRotate180.active { transform: rotate(180deg); } 
.line { fill: none; transition: stroke-dasharray 400ms, stroke-dashoffset 400ms; stroke: #fff; stroke-width: 6; stroke-linecap: round; }

.main-header.fixed .line { stroke: #fff; } 
.ham-menu { display: flex; align-items: center; } 
.ham-menu h6 { color: #fff; display: none;}
.ham6 .top { stroke-dasharray: 41 172; } 
.ham6 .middle { stroke-dasharray: 28 111; transform: translateX(1px); } 
.ham6 .bottom { stroke-dasharray: 41 172; transform: translateX(1px); } 
.ham6.active .top { stroke-dashoffset: -132px; } 
.ham6.active .middle { stroke-dashoffset: -71px; stroke-dasharray: 40 111;} 
.ham6.active .bottom { stroke-dashoffset: -132px; }

/*when turns close icon*/

.btns-wrap a{overflow: hidden; position: relative; z-index: 1; transition: all 0.4s ease; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease;  display: flex; align-items: center; padding: 35px 68px; color: var(--color-white); font-weight: 500;}
.main-header.fixed .btns-wrap a{padding: 24px 68px;}
.btns-wrap a:hover{color: var(--color-primary);}

.btns-wrap a span { z-index: -1; display: inline-block; position: relative; top: 0px; width: 46px; height: 46px; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.6s ease; display: flex; justify-content: center; align-items: center; margin-right: 12px; }
.btns-wrap a::before { width: 100%; height: 100%; content: ""; position: absolute; left: 0; top: 0; background-color: var(--color-secondary); z-index: -1; transition: all 0.4s ease; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transform: scale(1.2); }
.btns-wrap a::before { background-color: var(--color-secondary); }

.btns-wrap a span::after { content: ""; position: absolute; width: 100%; height: 100%; background-color: #fff; border-radius: 0; z-index: -1; top: 0; left: 0; transition: all .6s ease; -webkit-transition: all .6s ease; -moz-transition: all .6s ease; -ms-transition: all .6s ease; -o-transition: all .6s ease; transform: scale(1); border-radius: 60px; }
.btns-wrap a span::after { background: var(--color-white); }
.btns-wrap a:hover span::after { background-color: var(--color-white); width: 100%; height: 100%; left: 40px; transform: scale(12); transition: all 1s ease; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; }

.btns-wrap a span::before { content: ""; position: absolute; width: 100%; height: 100%; background-color: var(--color-primary); border-radius: 60px; z-index: 0; top: 0; left: 0; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transform: scale(0); }
.btns-wrap a:hover span::before { background-color: var(--color-primary); scale: 1; transform: scale(1); }

.btns-wrap a span img { width: 18px; height: 18px; transform: rotate(0deg); transition: all 0.6s ease; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; }
.btns-wrap a:hover span img{filter: brightness(0) invert(1);}


/*===================== Page => Homepage ==========================*/

/* Hero Banner */
.hero-banner {background: url(../images/banner-layer.svg); padding: 188px 0 0; min-height: 100vh; /*min-height: calc(100dvh - 100px);*/ position: relative; background-size: cover; background-repeat: no-repeat; background-position: top  center; display: flex; z-index: 1; }
.home-hero{padding-bottom: 109px;     align-items: flex-end;}
.home-hero:after{position: absolute; content: ''; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(17, 32, 70, 0) 0%, rgba(17, 32, 70, 0) 18.27%, rgba(17, 32, 70, 0.6) 45%, #112046 100%);
 inset:0; z-index: -1;}
.home-hero .banner-heading h2 { text-align: left; }
.home-hero .banner-content h5{text-align: right; color: #fff !important;}
.home-hero .banner-heading { margin-bottom: 60px; }

.home-banner-img, .home-banner-vid { position: absolute; left: 0 !important; bottom: 0; z-index: -1;}
.home-big-text { position: absolute; left: 0; right: 0; z-index: 0; bottom: 0}

.banner-heading { margin-bottom: 30px; }
.banner-heading * {position: relative; color: var(--color-white) !important; }
.banner-heading h6 { color: #FFDC8F !important; font-weight: 500; text-transform: uppercase; letter-spacing: 5px; font-size: clamp(1rem, 0.942rem + 0.154vw, 1.125rem); font-family: "Outfit", sans-serif;}
.banner-heading h2{text-align: right;}
.home-banner-img img { max-width: 69vw; }
.inner-banner .home-banner-img img { max-width: 50vw; }
.home-hero .home-banner-img, .home-hero .home-banner-vid { top: 0; right: 0; }
.home-hero .home-banner-img video, .home-hero .home-banner-vid video { width: 100%; height: 100%; object-fit: cover; display: block; }
.banner-content h5{font-size: clamp(1rem, 0.643rem + 0.952vw, 1.5rem); color: #FCE7BA; font-family: var(--body-font);}
.banner-content p{max-width: 456px; margin-left: auto; color:#DDD8CF}

.conversion-box { text-align: center; padding: 46px 56px 50px; border-radius: 30px; margin-top: 48px; margin-bottom: -101px; position: relative;  max-width: 456px; margin-left: auto; overflow: hidden; backdrop-filter: blur(36px); -webkit-backdrop-filter: blur(36px);    background: #ffffff3b;}
.conversion-box:after {position: absolute;content: ''; inset: 0;z-index: -1;background: linear-gradient(180deg, rgb(255 255 255 / 19%) 0%, rgba(0, 34, 118, 0.144) 100%);box-shadow: inset -1px 1px 6px #fff;}
.conversion-box h5 { color: var(--color-white); max-width: 300px; margin-left: auto; margin-right: auto; line-height: 1.44; }

/* Hero Banner */
.story-img { max-width: 456px; margin-left: auto; }
.story-img figure { position: relative; padding-bottom: 142%; }
.story-img figure img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 30px; }

.story-bg {position: relative;} 
.room-structure { position: absolute; bottom: -140px; left: 0; z-index: -1; } 
.room-structure img { max-width: 24vw; }
/* .story-section { padding: 39px 0 140px; } */

.app-sketch { position: absolute; bottom: 0; right: 0; z-index: -1;}
.app-sketch img { max-width: 37vw; }

.common-heading{margin-bottom: 50px;}
.common-heading-white *{color: var(--color-white);}

.drive-sec { background: var(--color-primary); }
.drive-sec .row { --bs-gutter-y: 24px; }
.drive-box { box-shadow: 0px 4px 26px 0px #00000014; background: #FFFFFF; border-radius: 30px; padding: 32px; transition: var(--transition-common); height: 100%; display: flex; flex-direction: column;} 
.drive-icon { text-align: center; padding: 80px 0; }
.drive-icon img{transition: var(--transition-common); height: 96px;}
.drive-box:hover{background: var(--color-secondary);}
.drive-box:hover .drive-icon img{filter: brightness(0) invert(1);}
.drive-box:hover *{color: var(--color-white);}
.drive-box p { margin-top: auto; }
.drive-box:hover .drive-hover {opacity: 1}
.drive-box:hover .drive-icon img:first-child{opacity: 0;}
.drive-hover {position: absolute;left:0;right:0;text-align: center; margin: 0 auto;opacity: 0;transition: var(--transition-common);}


.apart-heading {display: flex; align-items: center; justify-content: space-between;}
.apart-heading p { text-align: right; width: 41.4%; } 
.apart-heading h2 { max-width: 600px; }
.apart-grid { display: grid; grid-template-columns: repeat(3 , 1fr); gap: 24px;} 
.apart-grid .apart-box:first-child {grid-area: span 2 / auto} 
.apart-grid .apart-box:nth-child(2) {grid-area: span 2 / auto}
.apart-box { position: relative; } 
.apart-box-bg-one {  width: 100%; height: 100%;}
.apart-box-bg-one figure { position: relative;  height: 100%; } 
.apart-box-bg-one figure img {  width: 100%; height: 100%; object-fit: cover; border-radius: 30px; }

.apart-box-two { background: #24304E; border-radius: 30px; padding: 48px 0px 0; overflow: hidden; text-align: center; }
.apart-two-content { padding: 0 11px; } 
.apart-two-content p { max-width: 340px; margin: 0 auto 20px; }
.apart-icon span { width: 64px; height: 64px; background: var(--color-white); display: flex; align-items: center; justify-content: center; border-radius: 50%; margin: 0 auto 32px; } 
.apart-two-content * { color: var(--color-white); }

.apart-box-three{ background: #F2F2F2; border-radius: 30px; padding: 48px 48px 78px; }
.apart-box-four { background: var(--color-secondary); border-radius: 30px; padding: 48px 48px 78px; }

 
.apart-box-inner { position: absolute; inset: auto 24px 24px; background: #B99B6961; border-radius: 20px; padding: 24px; backdrop-filter: blur(36px);  -webkit-backdrop-filter: blur(36px); border: 1px solid #ffffff4a;     max-width: 100%;} 
.apart-box-inner *  , .apart-box-four *{ color: var(--color-white); } 
.apart-box-inner h5 { margin-bottom: 8px; }
.apart-box-two{display: flex; flex-direction: column; justify-content: space-between;}
/* .apart-building { position: absolute; bottom: 0; } */

.serv-wrapper { background: linear-gradient(92.52deg, #233E81 0%, #0C162F 100%); border-radius: 30px; position: relative; min-height: 360px; display: flex; align-items: center; padding-right: 106px; }
.serv-wrapper-img { position: absolute; left: 0; bottom: 0; }
.serv-wrapper-img img { max-width: 45vw; }
.serv-wrapper-cont * { color: var(--color-white); } 
.serv-wrapper-cont { max-width: 357px; margin-left: auto; }

.serving-owner-sec{background: #FFFAEE;}
.serving-owner-box { background: #FFFFFF; box-shadow: 0px 4px 26px 0px #00000014; border-radius: 30px; padding: 40px 32px 0; position: relative; min-height: 447px; margin-bottom: 117px; }
.serving-owner-img { max-width: 294px; aspect-ratio: 1; margin: 0px auto; position: absolute; bottom: -117px; left: 0; right: 0; }
.serving-owner-img img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }


.operator-img figure{ position: relative; padding-bottom: 114%; } 
.operator-img figure img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 30px; }
.operators-content { margin-right: 65px; }
.operators-content p br { display: none; }
.operator-team { background: #B99B694D; padding: 32px; border-radius: 20px; display: flex; justify-content: space-between; align-items: center; margin-top: -70px; position: relative; backdrop-filter: blur(26px); -webkit-backdrop-filter: blur(26px);}
.operator-team h4 { margin-bottom: 0;  max-width: calc(100% - 215px);}
.operator-team .btn{min-width: 192px;}
.page-template-page-for-owners .operator-team .btn{min-width: 175px;}
/* .manage-team .btn{min-width: 248px;} */

body:has(.portfolio-sec) footer{padding-top: 520px;}
.portfolio-sec { margin-bottom: -395px; position: relative; z-index: 3; }
.portfolio-form { background: #112046; border-radius: 30px; padding: 60px; } 
.portfolio-form h2 , .portfolio-form p { color: var(--color-white); } 
.portfolio-form h2 { max-width: 560px;    margin-bottom: 16px; } 
.portfolio-form form { margin-top: 32px; } 
form label { color: var(--color-white); font-weight: 500; margin-bottom: 8px; } 
form .form-control {background-color: rgb(255 255 255 / 0%) !important;backdrop-filter: blur(14.3px);-webkit-backdrop-filter: blur(14.3px);border: 1px solid #ffffff45 !important;box-shadow: 0 0 24px #ffffff0d inset !important;}
form label span { color: #FFDC8F; }
form .form-control option { color: #000; }

h2.gform_submission_error{max-width: 100%; margin-bottom: 0;}

.portfolio-img {position: relative; width: 100%;   height: 100%;}
.portfolio-img img { height: 100%; width: 100%; border-radius: 30px; } 

.problem-box { box-shadow: 0px 4px 26px 0px #00000014; background: #fff; border-radius: 30px; padding: 32px; height: 100%; transition: var(--transition-common);} 

.problem-head {--icon: 100px; display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; } 
.problem-icon { background: var(--color-primary); flex-shrink: 0; border-radius: 12px; width: var(--icon); height: var(--icon); display: flex; align-items: center; justify-content: center; transition: var(--transition-common);} 
.problem-box:hover .problem-icon{background: var(--color-secondary);}
.problem-head h5 { margin-bottom: 0; }

.error-page .banner-heading *{color: var(--color-heading) !important;}
.error-page .btn{color: #fff !important;}
.error-page .btn-blue::before {  background-color: var(--color-secondary)}
/*===================== Page => Homepage ==========================*/
/*===================== Page => About US ==========================*/
.inner-banner { background-image: url(../images/banner-layer.svg); padding: 188px 0 70px; margin-bottom: 0 !important; min-height: 94vh;}

.why-img { position: relative; padding-bottom: 88%; margin-right: 18px; } 
.why-small-img figure{position: relative; padding-bottom: 129.5%;}
.why-small-img { width: 14.1vw; margin-left: 5vw; margin-top: 7.8vw;} 
.why-small-img figure  { border-radius: 30px 0 0 30px; } 

/* .why-content p { max-width: 460px; } */


.bg-orange{background: #FFFAEE;}

.stand-wrapper { position: relative; } 
.stand-wrapper:before {position:absolute;content:'';border: 1.9px dashed #1120464D;border-radius:30px;top:0;width: 68%;height: 0;left: 0;right: 0;margin: 0 auto;border-bottom: 0;}
.stand-wrapper.aos-init:before { height: 34%; }

.stand-box { text-align: center; position: relative; padding-top: 97px;} 
.stand-wrapper .row .col-lg-4 .stand-box:before { position: absolute; content: ''; width: 1px; height: 97px; border: 1px dashed #1120464D; top: 0; border-width: 0 0px 0 1px; opacity:0}
.stand-wrapper .row .col-lg-4:nth-child(2) .stand-box:before { opacity: 1;}
.stand-box span { width: 120px; display: flex; justify-content: center; align-items: center; margin: 0 auto 24px; background: var(--color-primary); border-radius: 30px; aspect-ratio: 1; position: relative; z-index: 1; overflow: hidden;}
.stand-box span img { transition: var(--transition-common); } 
.stand-box:hover span img{ -webkit-animation: bouncing 0.5s 0.3s; animation: bouncing 0.5s 0.3s; }
@-webkit-keyframes bouncing {
    from, to {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    25% {
        -webkit-transform: scale(0.9, 1.1);
        transform: scale(0.9, 1.1);
    }
    50% {
        -webkit-transform: scale(1.1, 0.9);
        transform: scale(1.1, 0.9);
    }
    75% {
        -webkit-transform: scale(0.95, 1.05);
        transform: scale(0.95, 1.05);
    }
}

.stand-box span:before { content: ""; position: absolute; top: 100%; left: 0; width: 100%; height: 100%; background: var(--color-secondary); transition: .5s; z-index: -1; } 
.stand-box:hover span:before{top:0}
.stand-box h5 { margin-bottom: 8px; }
.stand-box p { max-width: 390px; margin: 0 auto; }

.leadership-box { text-align: center; position: relative; padding-bottom: 50px;}
.leadership-img figure { position: relative; padding-bottom: 112.5%; }
.leadership-img figure img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 20px; margin: 0 auto; }

.leadership-img { max-width: 400px; margin: 0 auto 30px; }
.leadership-box h6 { font-weight: 600; color: var(--color-secondary); }
.leadership-box h3 { margin-bottom: 16px; }
.leadership-box:before {position: absolute;content:'';background:#F2F2F2;width: 100%;bottom: 0;height: 70%;left: 0;z-index: -1;border-radius: 30px;}

.leader-btn { position: absolute; right: 0; bottom: 62%; } 
.leader-btn span { width: 80px; aspect-ratio: 1; background: var(--color-primary); display: flex; align-items: center; justify-content: center; border-radius: 50%; border: 6px solid #ffffff; transition: var(--transition-common); --webkit-transition: var(--transition-common); position: relative;}
.leader-btn span::before{position: absolute; content: ''; width: 100%; height: 100%; border-radius: 50%; background: var(--color-secondary); transition: var(--transition-common); transform: scale(0);} 
.leader-btn span:hover::before{transform: scale(1);}
.leader-btn span img{transition: var(--transition-common); --webkit-transition: var(--transition-common)}
.leader-btn span:hover img{transform: rotate(44deg);}

.operator-small-img{padding-bottom: 96.4%;}


.team-modal { --bs-modal-width: 1176px; background: #0C162FBF;}
.team-modal .modal-body { padding:  40px; }
.team-modal  .modal-content { border-radius: 50px; }

.modal-leadership-img { margin-top: -80px; }
.modal-leadership-img figure { position: relative; padding-bottom: 112%; border-radius: 20px; border: 2px solid #FFFFFF; overflow: hidden; } 
.modal-leadership-img figure img { position: absolute; width: 100%; height: 100%; inset: 0; object-fit: cover; }

.btn-close { width: 67px; height: 67px; aspect-ratio: 1; background: var(--color-primary); display: flex; align-items: center; justify-content: center; border-radius: 50%; border: 7px solid #ffffff; transition: var(--transition-common); --webkit-transition: var(--transition-common); position: absolute; opacity: 1; right: -20px; top: -20px; z-index: 1;}
.btn-close:hover { opacity: 1; }
.btn-close::before{position: absolute; content: ''; width: 100%; height: 100%; border-radius: 50%; background: var(--color-secondary); transition: var(--transition-common); transform: scale(0);} 
.btn-close:hover::before{transform: scale(1);}
.btn-close img{transition: var(--transition-common); --webkit-transition: var(--transition-common)}
.btn-close:hover img{transform: rotate(90deg);}
/*===================== Page => About US ==========================*/

/*===================== Page => Service ==========================*/
  .drive-box2 .drive-icon{padding: 50px 0;}
  .drive-box2 .drive-box p { margin-top: auto; }
  .drive-box2 h5 { height: 67px; }
  .drive-box2 p { margin-top: 0; }
/*===================== Page => Service ==========================*/

/*===================== Page => owner ==========================*/
.owner-image { margin-right: 61px; } 
.owner-image figure { position: relative; padding-bottom: 103.2%; } 
.owner-image figure img { position: absolute; width: 100%; height: 100%; object-fit: cover; inset: 0; border-radius: 20px; }
.oversight-sec .room-structure {left: inherit; right: 0; bottom: 0;}

.record-wrap{background: #24304E; padding: 70px 0 58px 50px; border-radius: 30px; position: relative; overflow: hidden;}
.record-text *{color: #fff}
.record-text { max-width: 431px; } 
.record-text p { color: #DDD8CF; } 
.track-structure { position: absolute; right: 0; bottom: 0; }
.track-structure img { max-width: 26vw; }

.record-bg { position: relative; z-index: 1; border-radius: 30px; overflow: hidden; padding: 30px; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center;} 
.record-bg:after {position: absolute;content:'';width: 100%;height: 100%;inset:0;background: #0000001A;z-index: -1;backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px);} 
.record-img { width: 100%; height: 100%; box-shadow: 0px 0px 64px 0px #00000073; border-radius: 20px;}
.record-img img { width: 100%; height: 100%; border-radius: 20px; object-fit: cover;}
.room-sketch { position: absolute; right: 0; bottom: 0; z-index: 0; }


.experience-content { margin-left: 52px; } 
.experience-img { width: calc(50vw - 12px); margin-left: calc((var(--container-width) - 100vw - 20px) / 2); }

/*===================== Page => owner ==========================*/
/*===================== Page => contact us ==========================*/
.contact-info { border: 1px solid #B99B69; border-radius: 20px; padding: 40px; width: calc(100% + 209px); position: relative; position: relative; z-index: 2;}
.contact-info h3 { border-bottom: 1.9px dashed #1120464D; padding-bottom: 30px; margin-bottom: 40px; } 
.contact-info-item { box-shadow: 0px 4px 26px 0px #00000014; background: #fff; padding: 20px 30px; border-radius: 16px; display: flex; transition: var(--transition-common);}
.contact-info-item:hover {transform: translateY(-6px)}
.contact-info-icon { --level: 76px; background: var(--color-primary); width: var(--level); height: var(--level); aspect-ratio: 1; border-radius: 10px; display: flex; align-items: center; justify-content: center; margin-right: 20px; position: relative; overflow: hidden; z-index: 1; flex-shrink: 0; }
.contact-info-icon:before , .contact-info-icon:after{position: absolute; content: ""; width: 0; background: var(--color-secondary); top: 0; bottom: 0; transition: all .35s; z-index: -1;}  
.contact-info-icon:before { left: 0%; border-radius: 10px 0 0 10px; }
.contact-info-icon:after {right: 0px; border-radius: 10px 10px 0 0px;}
.contact-info-item:hover .contact-info-icon:before , .contact-info-item:hover .contact-info-icon:after{width: 75%;}


.contact-info-content h5 { margin-bottom: 13px; }
.contact-info-content a {     background-image: linear-gradient(#cf303000 95%, var(--color-heading) 0, var(--color-heading)); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; }
.contact-info-content a:hover {  background-position-x: right; background-position-y: bottom; background-size: 100% 100%; } 
.contact-info .contact-info-item:not(:last-child) { margin-bottom: 22px; }

.contact-wrapper { background: #112046; padding: 60px 90px 60px 270px; border-radius: 20px; position: relative; z-index: -1;} 
.contact-wrapper h2 , .contact-wrapper p { color: #fff; }

.operate-section .serving-owner-box { background: #F2F2F2; box-shadow: none; min-height: auto; padding: 30px 27px 134px; margin-bottom: 96px; height: calc(100% - 96px);}
.operate-section  .serving-owner-img {max-width: 200px;bottom: -96px;}
.operate-note { border: 1px solid #B99B69; text-align: center; padding: 16px; border-radius: 10px; margin-top: 50px; }
/*===================== Page => contact us ==========================*/

/*===================== Page => community ==========================*/
.community-grid-wrap { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; } 
.community-grid-wrap .community-grid-img:nth-child(7n + 1) {grid-area: span 2 / auto;} 
.community-grid-wrap .community-grid-img:nth-child(7n + 7) { grid-column: span 2; padding-bottom: 41%; }
.community-grid-wrap .community-grid-img img{border-radius: 20px}
.community-grid-img { padding-bottom: 81.8%; border-radius: 20px;}

.community-heading {position: absolute;  bottom: -93px; padding: 30px; z-index: 2; transition: var(--transition-common)}
.community-heading h5 { color: #fff; }
.community-grid-img:before {position: absolute;content:'';background: linear-gradient(180deg, rgba(12, 22, 47, 0) 0%, rgba(7, 13, 28, 0.2) 46.48%, rgba(7, 13, 28, 0.5) 72.48%, rgba(7, 13, 28, 0.9) 100%);inset: 0;z-index: 1; transition: var(--transition-common); opacity: 0;}
.community-grid-img:hover:before{opacity: 1;}
.community-grid-img:hover .community-heading {bottom: 0;}
/*===================== Page => community ==========================*/






/* ------ Global => Footer ------- */
footer { background: url(../images/footer-bg.jpg) no-repeat top center;    background-size: cover; position: relative; padding-top: 120px;} 
.footer-logo { text-align: center; border-bottom: 1px solid #FFFFFF1A; padding-bottom: 100px; }

.footer-top{padding: 90px 0;}
.footer-col *, .footer-bottom * { color: var(--color-white); } 
.footer-col ul li { margin-bottom: 16px; }
.footer-col ul { display: flex; flex-wrap: wrap; justify-content: space-between; list-style: none; } 
.footer-col ul li { width: 50%; position: relative; padding-left: 16px; }

.footer-col ul li:before {position: absolute;content:'';width:8px;height:8px;background: linear-gradient(1.7deg, #B99B69 -58.39%, #FCE7BA 101.25%);border-radius: 50%;left: 0;top: calc(50% - 3px);} 
.footer-col ul li a { position: relative; color: var(--color-white); text-transform: capitalize; font-weight: 400; background-image: linear-gradient(#cf303000 95%, var(--color-secondary) 0, var(--color-secondary)); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; font-family: var(--heading-font); font-size: clamp(1.25rem, 1.019rem + 0.615vw, 1.75rem);} 

.footer-col ul li a:hover { color: var(--color-secondary); background-position-x: right; background-position-y: bottom; background-size: 100% 100%; } 
.footer-bottom { padding: 33px 0; border-top: 1px solid #FFFFFF1A; }

.footer-contact ul li { margin-bottom: 12px; text-align: right;}
.footer-contact ul li a { position: relative; color: var(--color-white);  font-weight: 400; background-image: linear-gradient(#cf303000 95%, var(--color-secondary) 0, var(--color-secondary)); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; font-family: var(--heading-font); font-size: clamp(1.125rem, 0.49rem + 1.692vw, 2.5rem); } 
.footer-contact ul li a:hover { color: var(--color-secondary); background-position-x: right; background-position-y: bottom; background-size: 100% 100%; } 

.footer-cat { margin-bottom: 40px; } 
.footer-cat ul { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; width: 260px; margin-left: auto; } 
.footer-cat ul li { width: 50%; margin-bottom: 15px; padding-left:11px; position: relative; } 
.footer-cat ul li p { color: var(--color-white); font-weight: 500; font-size: clamp(1rem, 0.942rem + 0.154vw, 1.125rem); position: relative;  background-image: linear-gradient(#cf303000 95%, var(--color-secondary) 0, var(--color-secondary)); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s;     display: inline-block;} 
/* .footer-cat ul li p:hover{color: var(--color-secondary); background-position-x: right; background-position-y: bottom; background-size: 100% 100%;}  */
.footer-cat ul li:before {position: absolute; content: ''; width: 6px; height: 6px; background: linear-gradient(1.7deg, #B99B69 -58.39%, #FCE7BA 101.25%); border-radius: 50%; left: 0; top: calc(50% - 3px);}

.footer-logo a svg { max-width: 290px; }


.lft-box h6 { font-size: clamp(1rem, 0.942rem + 0.154vw, 1.125rem); color: #A0A7B9; margin-bottom: 8px; } 
.lft-box p { font-size: 12px; color: #A0A7B9; } 
.right-box { text-align: right; }
.right-box p { font-size: clamp(1rem, 0.942rem + 0.154vw, 1.125rem); color: #A0A7B9; display: inline-flex; align-items: center; gap: 6px; }
.right-box p a { color: #A0A7B9; }
/* inline-flex (not flex) so text-align on .right-box still positions the credit line; gap also supplies the word space flex strips */
.right-box #webisserie-logo { width: 20px; height: 20px; }
/* block, else the injected svg baseline-aligns and slips below the 20px box */
.right-box #webisserie-logo svg { display: block; }

.lft-box p a { background-image: linear-gradient(#cf303000 95%, var(--color-secondary) 0, var(--color-secondary)); background-position-y: bottom; background-repeat: no-repeat; background-size: 100% 100%; color: #FCE7BA; } 
.lft-box p a:hover { background-position-x: right; background-position-y: bottom; background-size: 0 100%; }
/* ------ Global => Footer ------- */




/*Media Query css*/
.container {
  max-width: var(--container-width)
}
@media only screen and (min-width:2000px) {
  .contact-info{width: calc(100% + 250px);}
}
@media only screen and (max-width:1899px) {
  .contact-info{width: calc(100% + 240px);}

}

@media only screen and (max-width:1799px) {
  :root {
    --container-width: 1320px;
  }



.why-small-img { width: 15.1vw; }
  /*===================== Page => community ==========================*/

    .operate-section .serving-owner-box{padding: 30px 20px 134px;}
  /*===================== Page => community ==========================*/
  /*===================== Page => contact==========================*/
  .contact-wrapper{padding: 60px 90px 60px 230px;}
  .contact-info { width: calc(100% + 220px); }
  /*===================== Page => contact==========================*/
}
@media only screen and (max-width:1699px) {
    /*===================== Page => contact==========================*/

  /*===================== Page => contact==========================*/
}
@media only screen and (max-width:1599px) {
  :root {
    --container-width: 1280px;
  }
  /* ------ Global => Header ------- */
  .main-header .main-menu ul li a{padding: 43px 32px;}
  .btns-wrap a{    padding: 35px 49px;}
  .btn span{width: 32px; height: 32px;}
  .operator-team .btn { min-width: 200px; }
  .main-header.fixed .main-menu ul li a { padding: 32px 30px; }
  .main-header.fixed .btns-wrap a { padding: 22px 49px; }
  .serving-owner-img { max-width: 250px;}
  .problem-head { --icon: 80px;}
  .problem-icon img { max-width: 40px; }
  /* .manage-team .btn { min-width: 235px; } */
  /* ------ Global => Header ------- */
  /*===================== Page => About US ==========================*/
  .why-small-img{margin-left: 0;}
  /*===================== Page => About US ==========================*/
  /*===================== Page => contact US ==========================*/
  .contact-info{width: calc(100% + 230px);}
  .contact-wrapper{padding: 60px 90px 60px 240px;}
  /*===================== Page => contact US ==========================*/
  /*===================== Page => community ==========================*/

  /*===================== Page => community ==========================*/

}


@media only screen and (max-width:1399px) {
  :root {
    --container-width: 1140px;
  }
  input.form-control, textarea.form-control, select.form-select{padding: 15px 16px !important;}
  .portfolio-form{padding: 40px 30px;}
  /* ------ Global => Header ------- */
  .btns-wrap a{padding: 35px 35px;}
  .main-menu ul li.menu-item-has-children>a:after{height: 10px; width: 10px; right: 29px;}
  .main-header .main-menu ul li a{padding: 43px 22px;}
  .drive-icon{padding: 50px 0;}
  .home-banner-img img { max-width: 57vw; }
  .serv-wrapper{padding-right: 38px;}
  .serv-wrapper-cont { max-width: 305px;}
  .serving-owner-img{max-width: 246px; bottom: -107px;}
  .serving-owner-box{margin-bottom: 108px;}
  .main-header.fixed .btns-wrap a { padding: 22px 33px; }
  .btns-wrap a span{width: 40px; height: 40px;}
  .main-header .logo{max-width: 140px;}
  .main-header.fixed .main-menu ul li a { padding: 29px 22px; }
  .main-header .header-row{border-bottom:0 }                  
  /* ------ Global => Header ------- */
  /*===================== Page => About US ==========================*/
  .stand-box p { max-width: 320px;}
  .leadership-img { max-width: 350px;}
  .leadership-box{padding-bottom: 30px;}
  .record-text { max-width: 358px; }
  /*===================== Page => About US ==========================*/
  /*===================== Page => Service ==========================*/
  .serving-owner-img { max-width: 220px;}
  .serving-owner-box{ min-height: 400px;}
  .drive-box2 .drive-icon { padding: 20px 0; }
  
  /*===================== Page => Service ==========================*/
  /*===================== Page => community ==========================*/
  .serv-wrapper-img img { max-width: 54vw; }
  .operate-section .serving-owner-box p { font-size: 16px; }
  /*===================== Page => community ==========================*/
  /*===================== Page => contact ==========================*/
  .contact-wrapper{padding: 60px 40px 60px 210px;}
  .contact-info { width: calc(100% + 190px); }
  .contact-info-item{padding: 20px 16px;}
  .contact-info h3{   padding-bottom: 20px; margin-bottom: 20px;}
  .contact-info-icon { --level: 60px; margin-right: 12px;}
  .contact-info-icon img { max-width: 25px; }
  .contact-info-content h5 { margin-bottom: 0px; }
  .contact-info-content a{font-size: 16px;}
  /*===================== Page => contact ==========================*/
}
@media only screen and (max-width: 1280px) {

}
@media only screen and (max-width: 1199px) {

:root {
  --container-width: 960px;
}

h1, .h1 { font-size: 80px; }
.common-padd { padding-top: 100px; padding-bottom: 100px; }
html:has(.main-header.mobile-menu-open) { overflow: hidden; }
.body-scroll { overflow: hidden; }
body:has(.portfolio-sec) footer { padding-top: 460px; }

.problem-head { --icon: 68px; }
.problem-icon img { max-width: 30px; }
.problem-box{padding: 32px 20px;}
.main-header.fixed .btns-wrap a { padding:16px 35px; }
  /* ======= Global => Header ======== */
  
  .main-header.fixed { background: var(--color-primary); } 
  .main-header.fixed .logo { transform: scale(.85); margin-top: 0px; margin-bottom: 0px; } 
  
  .main-header .hdr-rt { align-items: center; } 
  .hamburger-nav { display: inline-block; } 
  .mobile-menu-container { display: block; } 
  .header-section .right-panel { -ms-flex-pack: end !important; justify-content: flex-end !important; } 
  .mobile-menu-logo { max-width: 50px; margin: 0 auto; text-align: center; display: none; } 
  .main-menu, .main-header .hdr-rt.mob-hide { display: none; } 
  .main-header .hdr-rt { justify-content: end; }
  
  .mobile-menu-container .inner-container { display: flex; flex-direction: column; }
  .mobile-menu-open .mobile-menu-container { top: 0px; transform: translateY(0); opacity: 1; left: 0; right: 0; }
  /* ==== Submenu Arrow ==== */
  header span.dropdown-icon-menu { margin-left: 10px; content: ""; position: absolute; top: 12px; box-sizing: border-box; width: 40px; height: 40px; transform: rotate(0deg); left: auto; right: 10px; z-index: 9999; display: flex; justify-content: center; align-items: center; }
  
  .hdr-rt.main-menu ul { display: none; }
  
  /* ==== Submenu Arrow ==== */
  
  
  /* ==== Mobile Main Menu ==== */
  .mobile-menu {margin: 0 auto; width: 100%; max-width: 100%; padding-left: 20px; padding-right: 20px; padding-top: 0; padding-bottom: 50px; height: calc(100vh - 120px); overflow-y: scroll;} 
  .mobile-menu ul{max-width: 323px; margin: 0 auto;}
  .mobile-menu ul li { padding: 0; margin: 0; display: block;} 
  .mobile-menu ul li:last-child { margin-bottom: 0; } 
  .mobile-menu ul li a { font-size: 20px; color: #ffffff; text-align: left;  padding: 20px 24px 20px 24px !important; text-transform: capitalize; } 
  .mobile-menu>ul>li>a:after { content: ""; position: absolute; top: 15px; left: 10px; width: 35px; height: 36px; /* background-image: url("../images/menu-active.svg");*/ background-repeat: no-repeat; background-size: contain; transform: scale(0) translateX(-50px); transition: var(--transition-common); } 
  .mobile-menu > ul > li >a:hover:after, .mobile-menu ul>li.current-menu-item>a:after { transform: scale(1) translateX(0px); } 
  .mobile-menu > ul > li> a:hover, .mobile-menu > ul>li.current-menu-item>a { color: #FFF;   border-color: #FFFFFF1A; }
  
  /* ==== Mobile Main Menu ==== */

  
  .mobile-menu ul li.menu-item-has-children.menu-open:after { transform: rotate(225deg); transition: all 0.4s ease; top: 17px; }

  /* ==== Mobile Sub Menu ==== */
  /* hidden by default; jQuery slideDown/Up (custom.js) animates open/close, so
     submenus expand to their real height with no max-height clipping. */
  .mobile-menu ul.sub-menu { position: relative; display: none; box-shadow: none; margin-top: 15px; border-radius: 6px; text-align: left; padding: 8px; background: #ffffff; }
  .mobile-menu ul.sub-menu li a { padding-top: 0 !important; padding-bottom: 0 !important; border-radius: 0; border: 0; background-color: transparent; display: block; padding: 12px 16px !important; color: #000; text-transform: capitalize; font-weight: 500; } 
  .mobile-menu ul.sub-menu li a:after { content: ""; /*background-image: url(../images/menu-line.svg);*/ height: 12px; display: block; width: calc(100% + 10px); z-index: -1; background-size: 100% 100%; transform: scaleX(0); transition: var(--transition-common); transform-origin: left center; margin-top: -14px; position: relative; margin-left: -5px; } 
  .mobile-menu ul.sub-menu li a:hover:after, .mobile-menu ul.sub-menu li.current-menu-item a:after { transform: scaleX(1); } 
  .mobile-menu ul.sub-menu li a:hover, .mobile-menu ul.sub-menu li.current-menu-item a {font-weight: 500; background: var(--color-secondary); color: #fff;}
  header span.dropdown-icon-menu::before { content: ""; position: absolute; top: 15px; right: calc(50% - 6px); box-sizing: border-box; height: 10px; width: 10px; border-style: solid; border-color: var(--color-white); border-width: 0 2px 2px 0; transform: rotate(45deg); transition: border-width 150ms ease-in-out; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; margin: 0 auto; }
  header span.dropdown-icon-menu.active::before { transform: rotate(225deg); top: 20px; }
  /* ==== Mobile Sub Menu ==== */
  
  /* ======= Global => Header ======== */
  .main-header{padding: 12px 20px;}
  .logo-wrap{padding: 4px 0;}
  .main-header .logo { max-width: 150px; }
  
  footer:before{top: -55px;  height: 70px;}
  .precision-section{padding-bottom: 150px;}
  .btns-wrap a { padding: 23px 35px; }
  .btns-wrap a span{width: 40px; height: 40px;}
  .ham-menu h6{display:block;}
  /*===================== Page => Homepage ==========================*/
.hero-banner{padding: 150px 0 0;     align-items: center;}
.home-hero .banner-content h5{text-align: center}
.home-hero .banner-heading { margin-bottom: 20px; }
.banner-heading { text-align: center; }
.banner-content , .banner-heading h2 , .home-hero .banner-heading h2  { text-align: center; }
.banner-content h5 { max-width: 560px; margin: 0 auto 20px; }
.banner-heading h1 { margin-bottom: 5px; }
.banner-content p { max-width: 600px;    margin-right: auto; color: #ffffff;}
.home-banner-img, .home-banner-vid{z-index: -1;}


.story-img { max-width: 366px;}
.story-img figure{padding-bottom: 122%;}
.story-section { padding: 39px 0 100px; }
.room-structure{bottom: -100px;}
.app-sketch img { max-width: 35vw; }
.drive-icon { padding: 30px 0; }
.drive-icon img{max-width: 70px;}
.apart-box-three , .apart-box-four{padding: 38px 28px;}
.apart-two-content p { max-width: 210px;}

.portfolio-form{padding: 40px 30px;}
/*===================== Page => Homepage ==========================*/
/*===================== Page => About US ==========================*/
.inner-banner { padding-bottom: 100px; position: relative; } 
.inner-banner:after { position: absolute; content: ''; width: 100%; height: 100%; background: #0f142ea8; inset:0; z-index:-1 }

.contact-info {width: 34.2vw; padding: 30px 10px;}
.why-content p { max-width: 360px; }
.leader-btn span { width: 60px;}
.leadership-img { max-width: 300px; }
.leader-btn span img{max-width: 30px;}

.team-modal { --bs-modal-width: 890px;}
.btn-close { width: 37px; height: 37px; right: -10px; top: -10px; }
.modal-leadership-img { margin-top: 0; }
.team-modal  .modal-content { border-radius: 30px; }
.why-small-img { margin-left: -6vw; width: 16.1vw; }
.operator-team .btn { min-width: auto; }
/*===================== Page => About US ==========================*/
/*===================== Page => Contact US ==========================*/
.contact-wrapper { padding: 60px 30px; }
.contact-info-icon {--level: 38px; margin-right: 10px;}
.contact-info-icon img { max-width: 17px; }
.contact-info { width: 100%; padding: 30px ; margin-bottom: 20px; }

.contact-info-grid { display: flex; justify-content: space-between; gap: 20px; }
.contact-info-item{width: 100%; height: 100%;}
.contact-info .contact-info-item:not(:last-child) { margin-bottom: 0; }

.contact-info-item{align-items: center; display:flex; flex-direction: column; padding: 17px 16px;}
.contact-info-icon { --level: 50px; margin: 0 auto 10px }
.contact-info-content { text-align: center; }

/*===================== Page => Contact US ==========================*/
/*===================== Page => Community ==========================*/
.operate-section .serving-owner-box{padding: 30px 20px 74px; border-radius: 10px;}
.operate-section .serving-owner-img { max-width: 160px;}
/*===================== Page => Community ==========================*/
/*===================== Page => Owner ==========================*/
.experience-img { width: 100%; margin-left: 0; }
.owner-experience{padding: 80px 0;}
.experience-content { margin-left: 0; }
.oversight-sec .row { --bs-gutter-y: 30px; }
.drive-box{padding: 32px 20px;}
/*===================== Page => Owner ==========================*/

}

@media only screen and (max-width: 991px) {
  :root {
    --container-width: 95%;
  }
  .common-padd { padding-top: 80px; padding-bottom: 80px; }
  .btns-wrap a , .main-header.fixed .btns-wrap a { padding: 16px 22px; }
  .btns-wrap a span { width: 35px; height: 35px; }
  .main-header { padding: 12px 20px; }
  .main-header .header-row{border-bottom:0}
  .btn { min-width: auto;}
/*===================== Page => Homepage ==========================*/
.home-hero{align-items: center; min-height: max-content;}
.hero-banner { padding: 160px 0 60px;}
.banner-heading h1 , .banner-heading h2{display: inline;}
.problem-head{flex-direction: column-reverse;}
.home-hero .banner-content h5 { text-align: center;}
.home-hero .banner-heading { margin-bottom: 30px; }
.inner-banner{min-height: 64vh;}

.problem-icon{margin-bottom: 20px}
.problem-head{margin-bottom: 15px; text-align: center;}
.problem-box p{text-align: center;}

.conversion-box{margin-right: auto; margin-top: 100px;}  
.banner-content p { max-width: 630px;}
.story-img{margin-right: auto;}
.room-structure img { opacity: .2; max-width: 25vw; }
/* .story-content { margin-top: 30px; } */
.common-heading { margin-bottom: 30px; }
.story-section .row { --bs-gutter-y: 24px; }
.story-section .row .col-xl-4 {order:2} 
.story-section .row .col-xl-7 { order: 3; } 
.story-bg { margin-top: 30px; }
.apart-grid{grid-template-columns: repeat(2, 1fr); gap: 14px;}
.apart-heading p { text-align: center; width: 100%; }
.apart-heading{flex-direction: column;}
.serv-wrapper { padding: 40px 20px 370px;  align-items: flex-start; overflow: hidden;}
.serv-wrapper-img img { max-width: 100%; }
.serv-wrapper-cont { max-width: 100%; text-align: center; margin-right: auto; }
.apart-two-content p { max-width: 100%; }

.serving-owner-sec .row { --bs-gutter-y: 60px; }
.serving-owner-box{min-height: 370px;  margin-bottom: 60px;}
.serving-owner-img { max-width: 176px; bottom: -57px; }

.operators-content { margin-right: 0; margin-bottom: 40px; }
.operator-img { max-width: 520px; margin: 0 auto; }

.lft-box { text-align: center; }
.right-box { text-align: center; margin-top: 10px; }

body:has(.portfolio-sec) footer { padding-top: 450px; }

footer{padding-top: 80px;}
.footer-top { padding: 50px 0; }
.footer-logo{padding-bottom: 80px;}
.footer-col ul{max-width: 550px; margin: 0 auto; justify-content: center;}
.footer-col ul li{width: auto; text-align: center; margin: 0 16px 16px; }

.footer-cat { margin-bottom: 20px; margin-top: 20px; }
.footer-cat ul { justify-content: center; width: 100%; margin-right: auto; margin-left: auto; }
.footer-cat ul li { width: auto; text-align: center; margin: 0 15px 15px; }
.footer-contact ul li { text-align: center; } 



.lft-box {text-align: center; }
.right-box {text-align: center; margin-top: 10px; }
.portfolio-img{height: calc(100% - 20px); margin: 0 auto 20px; max-width: 520px;}

/*===================== Page => Homepage ==========================*/  
/*===================== Page => About us ==========================*/
.why-col  {position: absolute; top: 48vw; right: 0; left: auto; width: auto;}
.why-small-img { width: 30vw; margin-left: 0; margin-right: -5vw; margin-top: 0;}
.why-content{ margin-top: 20px; }
.why-content p { max-width: 100%; }
.why-img{margin-right: 0; margin-bottom: 70px; }

.stand-wrapper .row .col-lg-4:first-child .stand-box{ padding-top: 0;}
.stand-box span { width: 100px;     border-radius: 20px;}
.stand-box span img { max-width: 60px; }
.stand-wrapper:before{display: none;}
.stand-wrapper .row .col-lg-4:not(:first-child) .stand-box:before { opacity: 1; top: -9px;}
.stand-box p{margin: 0 auto 20px;}

.leadership-box { padding-bottom: 40px; }
.leadership-box:before{border-radius: 14px;}
.leader-btn { position: absolute; right: 0; bottom: -30px; left: 0; }
.leader-btn span  { margin: 0 auto}

.operate-section .serving-owner-img { max-width: 182px;}
.contact-info { width: 100%;  margin-bottom: 30px; }
.contact-wrapper { padding: 40px 30px ; }
.contact-info-icon { --level: 46px;}


.team-modal { --bs-modal-width: 610px; }
.team-modal .modal-body { padding: 50px 30px 40px; }
.modal-leadership-img{margin-bottom: 30px;}

/*===================== Page => About us ==========================*/  
/*===================== Page => Service ==========================*/  
.operators-servc .row { flex-direction: column-reverse; }
/*===================== Page => Service ==========================*/  
/*===================== Page => Owner ==========================*/
.operators-content h2 br , .operators-content p br { display: none; } 
.owner-image { margin: 0 auto 30px; }
.record-text { max-width: 368px; }
.track-structure img { max-width: 46vw; }
.record-wrap{ margin-top: 30px; }

.experience-img { width: 100%; margin-left: 0; }
.experience-img figure img { width: 100%; height: 100%; } 
.owner-experience { padding: 80px 0; }
.experience-content { margin-left: 0; margin-top: 30px; }
.record-text { max-width: 100%; }
.record-wrap{padding: 40px 0 312px 30px;}
.operator-team .btn { min-width: auto; }


.record-text p{margin-right: 20px; margin-bottom: 40px;}
/*===================== Page => Owner ==========================*/  
/*===================== Page => Community ==========================*/
.operate-section .row { --bs-gutter-y: 40px; }  
.community-grid-wrap{gap:16px}
/*===================== Page => Community ==========================*/  

}

@media only screen and (max-width: 767px) {
.common-padd { padding-top: 60px; padding-bottom: 60px; }
footer{padding-top: 60px;} 
.desk-btn { display: none; }
.mobile-btn.btns-wrap { display: block; width: 88%; max-width: 100%; padding-left: 20px; padding-bottom: 30px; padding-right: 20px; margin-top: auto; margin-left: auto; margin-right: auto; padding-top: 50px; position: relative; text-align: center; }
.btns-wrap a { padding: 18px 35px; }
.main-header {padding: 12px;}
.main-header .header-row{border-bottom: 0;}
.main-header .logo { max-width: 120px; }
.serving-owner-box { min-height: 350px; text-align: center;}

h1, .h1 { font-size: 40px; }
.app-sketch img { max-width: 52vw; }
.hero-banner{margin-bottom: 10px;}

.drive-box h3 br { display: none; } 
.drive-box h3 { text-align: center; }
.drive-icon { padding: 30px 0; }

.apart-grid { grid-template-columns: repeat(1, 1fr);}

.apart-heading h2 { max-width: 100%; text-align: center; }
.operator-team{    justify-content: center;  flex-direction: column;  text-align: center;}
.operator-team h4{margin-bottom: 20px;     max-width: 100%;}

.portfolio-sec { padding-bottom: 60px; margin-bottom: 0;}
body:has(.portfolio-sec) footer { padding-top: 60px; }
.portfolio-form{padding: 30px; border-radius: 16px;}

.conversion-box{padding: 40px 26px; border-radius: 15px; margin-top: 86px;     backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);}
.room-structure  {display: none;}

.serv-wrapper{padding: 50px 20px 0;  overflow: hidden; }
.serv-wrapper-img img { max-width: 94vw; }

.banner-heading h6{letter-spacing: 3px; max-width: 210px; margin: 0 auto 20px; font-size: 14px;}

.portfolio-img img{border-radius: 16px;}
.drive-box{border-radius: 10px;}

.footer-logo { padding-bottom: 60px; }
.footer-logo img { max-width: 190px; }
.footer-col ul { max-width: 100%; flex-direction: column; }
.footer-col ul li { width: fit-content; text-align: left; margin: 0 auto 16px; }
.inner-banner{min-height: auto;}

/*===================== Page => About us ==========================*/ 
.inner-banner .home-banner-img img { max-width: 74vw; }
.leadership-sec .row:last-child { --bs-gutter-y: 60px; }
.home-banner-img img { max-width: 90vw; }
footer{padding-top: 60px;}
.stand-wrapper:before{display: none;}
.contact-info-item{flex-direction: column; justify-content: center;}

.btn { min-width: auto;}
.btn-close { width: 17px; height: 17px; right: 0; top: 0; }
.why-img{ margin-bottom: 35px; }
.operator-team .btn{min-width: auto;}
/*===================== Page => About us ==========================*/ 
/*===================== Page => Service ==========================*/ 
.drive-box2 h5 { height: auto; }
/*===================== Page => Service ==========================*/ 
/*===================== Page => Owner ==========================*/
.record-text { max-width: 90%; }
.track-structure { position: relative; text-align: right;}
.track-structure img { max-width: 57vw; } 

.record-wrap{border-radius: 20px;  padding: 40px 0px 0px 20px;}
.record-bg{border-radius: 20px; padding: 20px;}
.record-img img{border-radius: 10px;}
.operator-team .btn { min-width: auto; }
.manage-team .btn { min-width: auto; }
.record-text p { margin-right: 0; }
/*===================== Page => Owner ==========================*/ 
/*===================== Page => community ==========================*/
.community-grid-wrap .community-grid-img:nth-child(7n + 7) {  padding-bottom: 81.8%; }
.community-grid-wrap{grid-template-columns: repeat(1, 1fr); gap: 16px 0;}
.operate-section .serving-owner-img { max-width: 142px; }
/*===================== Page => community ==========================*/
/*===================== Page => contact ==========================*/
.contact-info-item{align-items: center; display:flex; flex-direction: column; padding: 17px 16px;}
.contact-info-icon { --level: 50px; margin: 0 auto 10px }
.gform_footer{justify-content: center !important;}
.contact-info-grid{flex-direction: column;}
/*===================== Page => contact ==========================*/
}

@media only screen and (max-width: 413px) {
  
}


@media only screen and (max-width: 359px) {
  :root { --font-xxl: 34px; }


  

}