/* ── CSS Variables ── */
    :root {
      --orange:   #E8481A;
      --orange-h: #c93c10;
      --dark:     #1a1e25;
      --darker:   #111418;
      --white:    #ffffff;
      --muted:    rgba(255,255,255,0.72);
      --nav-bg:   rgba(255,255,255,0.10);
    }

    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    body {
      font-family: 'Poppins', sans-serif;
      background: transparent;
      color: var(--white);
      min-height: 100vh;
    }

    @font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-Thin.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-ThinItalic.ttf') format('truetype');
  font-weight: 100;
  font-style: italic;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-ExtraLight.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-ExtraLightItalic.ttf') format('truetype');
  font-weight: 200;
  font-style: italic;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-LightItalic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-MediumItalic.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-SemiBoldItalic.ttf') format('truetype');
  font-weight: 600;
  font-style: italic;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-BoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-ExtraBold.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-ExtraBoldItalic.ttf') format('truetype');
  font-weight: 800;
  font-style: italic;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-Black.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-BlackItalic.ttf') format('truetype');
  font-weight: 900;
  font-style: italic;
}

    /* ── NAVBAR ── */
    .navbar-wrap{
    position:fixed;          /* changed from absolute */
    top:0;
    left:0;
    right:0;
    z-index:9999;
    padding:20px 40px;
    transition:all .35s ease;
}

/* main bar */
.navbar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: rgb(255 255 255 / 54%);
    backdrop-filter: blur(69px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(255,255,255,0.10);
    padding: 0 36px;
    height: 80px;
    transition: all .35s ease;
}

/* on scroll shrink */
.navbar-wrap.scrolled{
    padding: 0px;
}
.navbar-wrap.scrolled .navbar-inner {
    height: 80px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(0,0,0,.18);
    color: #000;
}

.navbar-wrap.scrolled .nav-links a{
    color:#000 !important;
}

/* logo also black if text logo */
.navbar-wrap.scrolled .brand{
    color:#000 !important;
}

/* hover */
.navbar-wrap.scrolled .nav-links a:hover{
    color:#ff5a1f !important;
}
/* links */
.nav-links{
    display:flex;
    align-items:center;
    gap:36px;
    list-style:none;
    margin-bottom:0;
}

.nav-links a{
    color:#000;
    text-decoration:none;
    font-size:16px;
    font-weight:500;
    transition:.25s;
}

/* white links after scroll */
.navbar-wrap.scrolled .nav-links a{
    color:#fff;
}

.nav-links a:hover{
    color:#ff5a1f;
}

/* button */
.btn-consult{
    background:var(--orange);
    color:#fff !important;
    padding:10px 22px;
    border-radius:6px;
    font-size:.88rem;
    font-weight:500;
    text-decoration:none;
}
/* FIX BLUE ICON */
.navbar-toggler-icon{
    filter:none !important;
}

/* ===============================
   MOBILE HEADER FULL CSS
===============================*/
@media (max-width:991.98px){

/* wrapper */
.navbar-wrap{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:99999;
    padding:0 !important;
}

/* main navbar */
.navbar-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:100%;
    height:72px;
    padding:0 22px !important;
    background:#ffffff !important;
    box-shadow:0 6px 18px rgba(0,0,0,0.08);
    overflow:visible;
}

/* logo */
.brand{
    display:flex;
    align-items:center;
    text-decoration:none;
}

.brand img{
    width:165px;
    height:auto;
    display:block;
}

/* hide desktop menu */
.nav-links{
    display:none !important;
}

/* hamburger button */
.navbar-toggler{
    margin-left:auto !important;
    width:42px;
    height:42px;
    padding:0 !important;
    border:none !important;
    background:none !important;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:none !important;
}

/* remove blue outline */
.navbar-toggler:focus{
    box-shadow:none !important;
    outline:none !important;
}

/* icon container */
.navbar-toggler-icon{
    position:relative;
    width:28px;
    height:20px;
    background:none !important;
    display:block;
}

/* three orange lines */
.navbar-toggler-icon,
.navbar-toggler-icon::before,
.navbar-toggler-icon::after{
    content:"";
    position:absolute;
    left:0;
    width:28px;
    height:3px;
    background:#F05A28 !important;
    border-radius:3px;
}

.navbar-toggler-icon {
    top: 35px;
    left: 85%;
    right: 0;
}

.navbar-toggler-icon::before{
    top:-8px;
}

.navbar-toggler-icon::after{
    top:8px;
}

/* ===============================
   FULLSCREEN MOBILE MENU
===============================*/
#mobileMenu{
    position:fixed;
    top:0;
    right:-100%;
    width:100%;
    height:100vh;
    z-index:999999;
    transition:right .35s ease;
}

#mobileMenu.show{
    right:0;
}

#mobileMenu > div{
    position:relative;
    width:100%;
    height:100%;
    background:#ffffff !important;
    padding:95px 28px 30px !important;
    border-radius:0 !important;
}

#mobileMenu > div::before {
    content: "";
    position: absolute;
    top: -10px;
    left: 24px;
    width: 200px;
    height: 100px;
    background: url('../images/logo.png') left center / contain no-repeat;
}

/* close button */
#mobileMenu .menu-close{
    position:absolute;
    top:18px;
    right:24px;
    width:38px;
    height:38px;
    border:none;
    background:none;
    color:#F05A28;
    font-size:30px;
    font-weight:700;
    cursor:pointer;
    line-height:1;
    z-index:9999;
}

/* menu list */
#mobileMenu ul{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
}

/* each item */
#mobileMenu ul li{
    border-bottom:1px solid rgba(0,0,0,0.08);
    padding:18px 0;
}

#mobileMenu ul li:last-child{
    border-bottom:none;
}

/* links */
#mobileMenu ul li a{
    color:#111111 !important;
    text-decoration:none;
    font-size:18px !important;
    font-weight:600;
    display:block;
}

/* consultation button */
#mobileMenu .btn-consult{
    margin-top:18px;
    text-align:center;
    background:#F05A28;
    color:#fff !important;
    padding:14px 20px;
    border-radius:8px;
    display:block;
}

/* when menu open = hamburger hidden */
#mobileMenu.show ~ .navbar-inner .navbar-toggler{
    opacity:0;
}
}
    /* ── HERO ── */
    .hero {
      position: relative;
      width: 100%;
      min-height: 100vh;
      display: flex;
      align-items: flex-end;
      overflow: hidden;
    }

    /* Background image simulation – replace src with real photo */
    .hero-bg {
      position: absolute;
      inset: 0;
      background:
        url('../images/banner.jpg') center/cover no-repeat;
      z-index: 0;
    }

    /* dark vignette overlay */
    .hero-bg::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(10,13,18,0.72) 0%, transparent 55%);
    }

    /* FIX HERO CARD POSITION + ORANGE BORDER */
.hero-content {
    position: absolute;
    top: 315px;
    left: 100px;
    z-index: 10;
    width: 720px;
    padding: 38px 48px 42px 42px;
    background: rgba(17, 28, 48, 0.34);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 14px;
    overflow: hidden;
}

/* ORANGE LEFT BAR */
.hero-content::before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 6px;
    height: 100%;
    background: #ff5a1f;
    z-index: 3;
}

/* GLASS SHINE */
.hero-content::after{
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(26,90,40,0.14) 0%,
        rgba(255,255,255,0.03) 32%,
        rgba(255,255,255,0.01) 100%
    );
    pointer-events: none;
}

/* move text above pseudo layers */
.hero-content > *{
    position: relative;
    z-index: 5;
}


    .est-badge {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 20px;
    }

    .est-line {
      width: 3px;
      height: 32px;
      background: var(--orange);
      border-radius: 2px;
      flex-shrink: 0;
    }

    .est-text {
      font-family: Poppins;
font-weight: 600;
font-style: SemiBold;
font-size: 14px;
leading-trim: NONE;
line-height: 20px;
letter-spacing: 1.4px;
vertical-align: middle;
text-transform: uppercase;

    }

    .hero-title {
      font-family: Poppins;
font-weight: 700;
font-style: Bold;
font-size: 48px;
leading-trim: NONE;
line-height: 55px;
letter-spacing: 0px;
vertical-align: middle;

    }

    .hero-sub {
     font-family: Poppins;
font-weight: 400;
font-style: Regular;
font-size: 18px;
leading-trim: NONE;
line-height: 29.25px;
letter-spacing: 0px;
vertical-align: middle;

    }

    /* ── CTA BUTTONS ── */
    .cta-group{
    position: absolute;
    left: 95px;
    top: 750px;          /* place under card */
    z-index: 9999;       /* force on top */

    display: flex;
    gap: 18px;

    visibility: visible;
    opacity: 1;
    width: 700px;
    height: 80px;
    padding: 10px 22px;
}

/* make anchors visible */
.cta-group a{
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

/* button style */
.btn-primary-cta{
    width: 100%;
    height: auto;
    background: #ff5a1f;
    color: #fff;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
}

.btn-outline-cta{
    width: 100%;
    height: auto;
    border: 1px solid #fff;
    color: #fff;
    border-radius: 8px;
    text-decoration: none;
    background: rgba(255,255,255,0.04);
}

    /* ── FADE-IN ANIMATION ── */
    @keyframes fadeUp {
      from { opacity: 0; transform: translateY(28px); }
      to   { opacity: 1; transform: translateY(0); }
    }

    .est-badge  { animation: fadeUp 0.7s ease both; animation-delay: 0.1s; }
    .hero-title { animation: fadeUp 0.7s ease both; animation-delay: 0.25s; }
    .hero-sub   { animation: fadeUp 0.7s ease both; animation-delay: 0.4s; }
    .cta-group  { animation: fadeUp 0.7s ease both; animation-delay: 0.55s; }

    /* ── RESPONSIVE ── */
    @media (max-width: 768px) {
      .navbar-wrap { padding: 0 16px; }
      .nav-links { display: none; }

      .hero-content {
        padding: 0 24px 80px 24px;
        max-width: 100%;
      }

      .hero-bg {
        background:
          linear-gradient(to bottom, rgba(15,18,24,0.55) 0%, rgba(15,18,24,0.80) 100%),
          url('https://images.unsplash.com/photo-1618221195710-dd6b41faaea6?w=1000&q=80') center/cover no-repeat;
      }
    }

/* Sec2 */
.counter-box h3{
font-family: Poppins;
font-weight: 700;
font-style: Bold;
font-size: 18px;
leading-trim: NONE;
line-height: 28px;
letter-spacing: 0px;
text-align: center;
vertical-align: middle;
    color:#0F2E63;
    margin-top: 10px;
}

.counter-box p {
    font-family: Poppins;
    font-weight: 500;
    font-style: Regular;
    font-size: 14px;
    leading-trim: NONE;
    line-height: 20px;
    text-align: center;
    vertical-align: middle;
    text-transform: uppercase;
    color: #64748B;
}

.icon-circle{
    margin:0 auto;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
}

.icon-circle img{
     width:80px;
    height:80px;
    object-fit:cover;    
}

@media(max-width:768px){
    .counter-section{
        padding:35px 0;
    }

    .counter-box h3{
        font-size:16px;
    }

    .counter-box p{
        font-size:12px;
    }

    .icon-circle{
        width:50px;
        height:50px;
    }

    .icon-circle img{
        width:22px;
        height:22px;
    }
}
@media (min-width: 1600px) {
    .container {
        max-width: 1550px;
    }
}

/* Sec3 */
.estimate-section{
    margin-top:0;
    position:relative;
    z-index:5;
}

.estimate-wrap{
    background:#f55a22;
    padding:28px 56px 36px;
    box-shadow:0 22px 35px rgba(0,0,0,0.25);
}

.estimate-title{
   font-family: Poppins;
font-weight: 500;
font-style: Medium;
font-size: 32px;
line-height: 20px;
letter-spacing: 0px;
vertical-align: middle;
color: #fff;
margin-bottom: 30px;
}

.estimate-form label{
    display:block;
    font-family:'Poppins',sans-serif;
    font-size:14px;
    font-weight:600;
    letter-spacing:.6px;
    color:#ffffff;
    margin-bottom:6px;
    text-transform:uppercase;
}

.custom-input {
    height: 40px;
    border: 1px solid rgba(255,255,255,0.7);
    border-radius: 8px;
    background: rgba(255,255,255,0.10);
    color: #ffffff;
    font-family: 'Poppins',sans-serif;
    font-size: 14px;
    padding: 0 14px;
    box-shadow: none !important;
    width: 100%;
}

.custom-input::placeholder{
    color:rgba(255,255,255,0.65);
}

.custom-input:focus{
    background:rgba(255,255,255,0.15);
    border-color:#ffffff;
    color:#ffffff;
}

.form-select.custom-input{
    background-color:rgba(255,255,255,0.10);
}

.consult-btn{
    height:40px;
    padding:0 28px;
    border:none;
    border-radius:10px;
    background:#ffffff;
    color:#111111;
    font-family:'Poppins',sans-serif;
    font-size:14px;
    font-weight:600;
    white-space:nowrap;
    transition:.3s ease;
}

.consult-btn:hover{
    transform:translateY(-2px);
}

@media(max-width:991px){
    .estimate-wrap{
        padding:25px 20px 30px;
    }

    .estimate-title{
        font-size:24px;
    }

    .consult-btn{
        width:100%;
    }
}
/* Bootstrap select arrow spacing FIX */
.form-select.custom-input{
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;

    padding-right: 55px !important;   /* room for arrow */
    
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='white' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important;

    background-repeat: no-repeat !important;
    background-position: right 18px center !important; /* empty space at right */
    background-size: 12px 8px !important;
}
/* Dropdown options white background + dark text */
.form-select.custom-input option{
    background: #ffffff !important;
    color: #111111 !important;
}

/* Sec4 */
.section-heading{
    margin-bottom:55px;
}

.section-heading h2{
    font-family: Poppins;
font-weight: 700;
font-style: Bold;
font-size: 36px;
leading-trim: NONE;
line-height: 40px;
letter-spacing: 0px;
text-align: center;
vertical-align: middle;
color: #000;
}

.title-line{
    width:70px;
    height:4px;
    background:#F05A28;
    display:block;
    margin:18px auto 0;
    border-radius:20px;
}

.different-card{
    background:#ffffff;
    border:1px solid #ececec;
    border-radius:8px;
    padding:34px 28px 32px;
    min-height:350px;
    transition:.3s ease;
}

.different-card:hover{
    transform:translateY(-6px);
    box-shadow:0 12px 24px rgba(0,0,0,0.08);
}

.card-icon{
    margin-bottom:26px;
}

.card-icon img{
    width:26px;
    height:26px;
    object-fit:contain;
}

.different-card h3{
   font-family: Poppins;
font-weight: 700;
font-style: Bold;
font-size: 20px;
leading-trim: NONE;
line-height: 28px;
letter-spacing: 0px;
vertical-align: middle;
color: #000;
}

.different-card p {
    font-family: Poppins;
    font-weight: 400;
    font-style: Regular;
    font-size: 16px;
    text-align: left;
    leading-trim: NONE;
    line-height: 28px;
    letter-spacing: 0px;
    vertical-align: middle;
    color: #475569;
    margin-top: 30px;
    margin-bottom: 0;
}

@media(max-width:991px){
    .section-heading h2{
        font-size:34px;
    }

    .different-card{
        min-height:auto;
    }
}

@media(max-width:992px){
    .different-section{
        padding:55px 0;
    }

    .section-heading{
        margin-bottom:20px;
    }

    .section-heading h2{
        font-size:24px;
        line-height:1.3;
    }

    .different-card{
        padding:25px 20px;
    }

    .different-card h3{
        font-size:18px;
    }

    .different-card p {
    font-size: 14px;
    line-height: 1.7;
    margin-top: 20px;
}
}

/* Sec5 */
/* ===============================
   TRUSTED SECTION
=============================== */
.trusted-section{
    background:#ffffff;
    padding:0;
}

.trusted-wrap{
    position:relative;
    overflow:hidden;
}

/* ===============================
   TEXT CONTENT
=============================== */
.trusted-content{
    position:absolute;
    top:0;
    left:0;
    width:52%;
    height:100%;
    z-index:5;
    padding:52px 40px 40px 52px;
    display:flex;
    align-items:center;
}

.trusted-content h2{
    font-family:'Poppins',sans-serif;
    font-weight:700;
    font-size:36px;
    line-height:50px;
    color:#ffffff;
    margin:0;
    text-transform:capitalize;
}

/* ===============================
   DESKTOP IMAGE
=============================== */
.trusted-image{
    display:block;
    width:100%;
}

.trusted-image img{
    width:100%;
    height:auto;
    display:block;
}

/* ===============================
   MOBILE IMAGE HIDDEN
=============================== */
.trusted-image-mobile{
    display:none;
}

/* ===============================
   TABLET + MOBILE
=============================== */
@media(max-width:600px){

.trusted-image{
    display:none;
}

.trusted-image-mobile{
    display:block;
    position:relative;
}

.trusted-image-mobile img{
    width:100%;
    height:auto;
    display:block;
}

/* TEXT AT BOTTOM ORANGE AREA */
.trusted-content{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    top:auto;
    width:100%;
    height:auto;
    padding:28px 24px 32px;
    z-index:10;
    display:block;
}
.trusted-content h2 {
    font-size: 20px;
    line-height: 30px;
    color: #fff;
}

}
/* Sec6 */
.collection-section{
    background:#FFFAF3;
    padding:55px 0 70px;
    overflow:hidden;
}

.collection-top{
    padding:0 34px;
    margin-bottom:28px;
    display:flex;
    align-items:end;
    justify-content:space-between;
}

.collection-top h2{
font-family: Poppins;
font-weight: 700;
font-style: Bold;
font-size: 30px;
leading-trim: NONE;
line-height: 36px;
letter-spacing: 0px;
vertical-align: middle;
color: #000;
}

.collection-top p {
    font-family: Poppins;
    font-weight: 400;
    font-style: Regular;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 24px;
    letter-spacing: 0px;
    vertical-align: middle;
    color: #64748B;
    margin-bottom: 0;
}

.consult-link{
    font-family: Poppins;
font-weight: 700;
font-style: Bold;
font-size: 16px;
leading-trim: NONE;
line-height: 20px;
letter-spacing: 0px;
vertical-align: middle;
color: #F05A28;
}

.consult-link span{
    margin-left:6px;
}

.project-slider{
    padding-left:34px;
    overflow:hidden;
}

/* each slide */
.swiper-slide{
    width:350px !important;
}

/* card */
.project-item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    height: 380px;
}

/* image wrapper full height */
.project-item-image{
    height:100%;
}

/* image */
.project-item-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center center; /* important */
    display:block;
}

.project-item-image::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(to top, rgba(0,0,0,.80), rgba(0,0,0,.10));
}

/* text over image */
.project-item-content {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 60px;
    z-index: 5;
}

.project-item-content h2{
    margin:0 0 8px;
    font-size:17px;
    font-weight:700;
    line-height:1.3;
}

.project-item-content h2 a{
    font-family: Poppins;
font-weight: 700;
font-style: Bold;
font-size: 24px;
leading-trim: NONE;
line-height: 32px;
letter-spacing: 0px;
vertical-align: middle;
color: #fff;
}

.project-item-content ul{
    margin:0;
    padding:0;
    list-style:none;
}

.project-item-content ul li{
   font-family: Poppins;
font-weight: 400;
font-style: Regular;
font-size: 14px;
leading-trim: NONE;
line-height: 20px;
letter-spacing: 0px;
vertical-align: middle;
color: #fff;
}

/* mobile */
@media(max-width:768px){

.collection-top{
    padding:0 18px;
    flex-direction:column;
    gap:12px;
}

.project-slider{
    padding-left:18px;
}

.swiper-slide{
    width:250px !important;
}

.project-item-image img{
    height:320px;
}

}

/* Sec7 */
.steps-section{
    overflow:hidden;
}

.steps-heading{
    margin-bottom:30px;
}

.steps-heading h2{
   font-family: Poppins;
font-weight: 700;
font-style: Bold;
font-size: 30px;
leading-trim: NONE;
line-height: 36px;
letter-spacing: 0px;
text-align: center;
vertical-align: middle;
color: #000;
}

.steps-heading p{
    margin:0 auto;
    max-width:620px;
    font-family:'Poppins',sans-serif;
    line-height:1.7;
    color:#7a8393;
font-weight: 400;
font-style: Regular;
font-size: 16px;
text-align: center;
color: #000;
}

/* wrapper */
.steps-wrapper{
    position:relative;
}

.steps-line {
    position: absolute;
    left: 5%;
    right: 4%;
    top: 65px;
    height: 2px;
    background: #d9dee7;
    z-index: 1;
}

/* step box */
.step-box{
    position:relative;
    z-index:2;
    text-align:center;
    padding:0 12px;
}

/* round icon circle */
.step-icon{
    border-radius:50%;
    margin:0 auto 18px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.step-icon img {
    width: 150px;
    height: 150px;
    object-fit: contain;
}

.step-box h3{
font-family: Poppins;
font-weight: 700;
font-style: Bold;
font-size: 18px;
leading-trim: NONE;
line-height: 28px;
letter-spacing: 0px;
text-align: center;
vertical-align: middle;
color: #000;
}

.step-box p {
    font-family: Poppins;
    font-weight: 400;
    font-style: Regular;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 20px;
    letter-spacing: 0px;
    text-align: center;
    vertical-align: middle;
    max-width: 220;
    color: #64748B;
}

/* responsive */
@media(max-width:991px){

    .steps-heading h2{
        font-size:34px;
    }

    .steps-line{
        display:none;
    }

    .step-box{
        margin-bottom:25px;
    }
}

@media(max-width:576px){

    .steps-section{
        padding:55px 0;
    }

    .steps-heading{
        margin-bottom:40px;
    }

    .steps-heading h2{
        font-size:24px;
        line-height:1.3;
    }

    .step-box h3{
        font-size:18px;
    }

    .step-box p{
        font-size:13px;
    }
}

/* Sec10 */
.personalized-section{
    background:#111111;
    padding:0;
}

.personalized-wrap{
    background:#f55a22;
    padding:26px 34px 18px;
}

/* heading */
.personalized-title{
    font-family: Poppins;
font-weight: 500;
font-style: Medium;
font-size: 32px;
leading-trim: NONE;
line-height: 20px;
letter-spacing: 0px;
vertical-align: middle;
color: #fff;
margin-bottom: 20px;
}

/* labels */
.personalized-form label{
    display:block;
    margin-bottom:6px;
    font-family:'Poppins',sans-serif;
    font-size:9px;
    font-weight:600;
    color:#ffffff;
    letter-spacing:.6px;
    text-transform:uppercase;
}

/* fields */
.custom-field{
    height:36px;
    border:1px solid rgba(255,255,255,0.7);
    border-radius:6px;
    background:rgba(255,255,255,0.08);
    color:#ffffff;
    font-size:13px;
    font-family:'Poppins',sans-serif;
    padding:0 12px;
    box-shadow:none !important;
}

.custom-field::placeholder{
    color:rgba(255,255,255,0.65);
}

.custom-field:focus{
    border-color:#ffffff;
    background:rgba(255,255,255,0.12);
    color:#ffffff;
}

/* select arrow spacing */
.form-select.custom-field{
    padding-right:42px;
    background-position:right 14px center;
}

/* button */
.estimate-btn{
    height:36px;
    padding:0 18px;
    border:none;
    border-radius:8px;
    background:#ffffff;
    color:#111111;
    font-family:'Poppins',sans-serif;
    font-size:13px;
    font-weight:600;
    white-space:nowrap;
    transition:.3s ease;
}

.estimate-btn:hover{
    transform:translateY(-2px);
}

/* bottom image section using 2 images */

.personalized-image{
    margin-top:22px;
    border-radius:10px;
    overflow:hidden;
    position:relative;
    height:auto;
}

/* base image */
.personalized-image .main-img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* overlay image on top */
.personalized-image .overlay-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}

/* keep rounded */
.personalized-image img{
    border-radius:10px;
}

/* responsive */
@media(max-width:991px){
    .personalized-image{
        height:260px;
    }
}

@media(max-width:576px){
    .personalized-image{
        height:220px;
    }
}

/* responsive */
@media(max-width:991px){

    .personalized-wrap{
        padding:25px 20px;
    }

    .personalized-title{
        font-size:22px;
    }

    .estimate-btn{
        width:100%;
    }

    .personalized-image img{
        height:260px;
    }
}

@media(max-width:576px){

    .personalized-title{
        font-size:18px;
        line-height:1.4;
    }

    .personalized-image img{
        height:220px;
    }
}
/* Sec9 */
.newcollect {
    background: transparent;
    padding: 0;
}

.newcollect .collection-top {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* play button bottom left inside image */
.newcollect .project-item{
    position:relative;
    height: auto;
}

.video-play-btn{
    position:absolute;
    left:18px;
    bottom:18px;
    z-index:8;
    width:56px;
    height:56px;
    border:none;
    border-radius:50%;
    background:#f55a22;
    color:#fff;
    font-size:22px;
    cursor:pointer;
    box-shadow:0 10px 22px rgba(0,0,0,.18);
}

/* modal */
.video-modal{
    position:fixed;
    inset:0;
    z-index:99999;
    display:none;
    align-items:center;
    justify-content:center;
}

.video-modal.active{
    display:flex;
}

.video-backdrop{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.75);
}

/* video box */
.video-box{
    position:relative;
    width:85%;
    max-width:1100px;
    z-index:2;
}

.video-box video{
    width:100%;
    max-height:85vh;
    border-radius:12px;
    background:#000;
}

/* right top black volume button */
.video-volume-btn{
    position:absolute;
    top:14px;
    right:64px;
    z-index:5;
    width:44px;
    height:44px;
    border:none;
    border-radius:50%;
    background:#000;
    color:#fff;
    font-size:18px;
    cursor:pointer;
}

/* close button */
.video-close-btn{
    position:absolute;
    top:14px;
    right:14px;
    z-index:5;
    width:44px;
    height:44px;
    border:none;
    border-radius:50%;
    background:#000;
    color:#fff;
    font-size:18px;
    cursor:pointer;
}

/* Footer */
.uniwood-footer{
    background:#071633;
    padding:60px 0 28px;
    color:#fff;
    font-family:'Poppins',sans-serif;
}

/* top area */
.footer-top{
    padding-bottom:38px;
    border-bottom:1px solid rgba(255,255,255,0.08);
}

/* logo */
.footer-logo{
    font-size:34px;
    font-weight:800;
    letter-spacing:-1px;
    margin-bottom:18px;
    color:#ffffff;
}

/* description */
.footer-desc {
    font-size: 15px;
    line-height: 1.8;
    color: #fff;
    max-width: 250px;
    margin-bottom: 22px;
    text-align: justify;
}

/* titles */
.footer-title{
    font-size:20px;
    font-weight:700;
    margin-bottom:22px;
    color:#ffffff;
}

/* links */
.footer-links{
    list-style:none;
    padding:0;
    margin:0;
}

/* EACH ROW */
.footer-links li{
    position:relative;
    padding-left:18px;
    margin-bottom:14px;
    overflow:hidden;
}

/* ICON */
.footer-links li::before{
    content:"◆";
    position:absolute;
    left:0;
    top:50%;
    transform:translateY(-50%);
    font-size:11px;
    color:#fff;
    transition:all .35s ease;
}

/* LINK */
.footer-links li a{
    display:inline-block;
    color:#fff;
    text-decoration:none;
    font-size:15px;
    line-height:1.4;
    transition:all .35s ease;
}

/* BOTH MOVE ON HOVER */
.footer-links li:hover::before{
    color:#ff5a1f;
    transform:translateY(-50%) translateX(6px) scale(1.2);
}

.footer-links li:hover a{
    color:#ff5a1f;
    transform:translateX(6px);
}

/* social */
.footer-social{
    display:flex;
    gap:12px;
}

.social-btn{
    width:42px;
    height:42px;
    border:1px solid rgba(255,255,255,0.14);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    transition:0.3s ease;
}

.social-btn img{
    width:20px;
    height:20px;
    object-fit:contain;
    display:block;
    filter:brightness(0) invert(1);
}

/* hover */
.social-btn:hover{
    background:#ff5a1f;
    border-color:#ff5a1f;
    transform:translateY(-2px);
}

/* locations */
.footer-location{
    margin-bottom:20px;
}

.footer-location strong{
    display:block;
    font-size:16px;
    font-weight:700;
    color:#fff;
    margin-bottom:5px;
}

.footer-location span{
    display:block;
    font-size:14px;
    color:#fff;
    line-height:1.6;
}

/* bottom */
.footer-bottom{
    padding-top:24px;
}

.footer-bottom p {
    margin: 0 0 10px;
    font-size: 14px;
    color: #fff;
}

.footer-bottom-links{
    display:flex;
    justify-content:center;
    gap:22px;
    flex-wrap:wrap;
}

.footer-bottom-links a{
    font-size:14px;
    color:#fff;
    text-decoration:none;
}

.footer-bottom-links a:hover{
    color:#ff5a1f;
}

/* responsive */
@media(max-width:991px){

    .uniwood-footer{
        padding:50px 0 24px;
    }

    .footer-logo{
        font-size:30px;
    }

    .footer-title {
    margin-top: 10px;
    margin-bottom: 20px;
}
.footer-links li a {
    margin-bottom: 10px !important;
}
}

@media(max-width:576px){

    .footer-logo{
        font-size:28px;
    }

    .footer-title{
        font-size:18px;
    }

    .footer-desc,
    .footer-links a,
    .footer-location span{
        font-size:14px;
    }

    .footer-bottom-links{
        gap:14px;
    }
}

/* Whatsapp */
.whatsapp-name {
font-size: 16px;
font-weight: 600;
padding-bottom: 0;
margin-bottom: 0;
line-height: 0.5;
color: #fff;
}
#whatsapp-chat {
box-sizing: border-box !important;
outline: none !important;
position: fixed;
width: 350px;
border-radius: 10px;
box-shadow: 0 1px 15px rgba(32, 33, 36, 0.28);
bottom: 230px;
right: 32px;
overflow: hidden;
z-index: 99;
animation-name: showchat;
animation-duration: 1s;
transform: scale(1);
}
a.blantershow-chat {
background: none !important;
color: #404040;
position: fixed;
display: flex;
font-weight: 400;
justify-content: space-between;
z-index: 1002;
bottom: 180px;
right: 20px;
font-size: 18px;
height: 45px;
width: 45px;
padding: 4px;
border-radius: 30px;
/box-shadow: 0 1px 15px rgb(32 33 36 / 61%);/
}
a.blantershow-chat svg {
transform: scale(1.2);
}
.header-chat {
    background: #1e4080;
    color: #fff;
    padding: 20px;
}
.header-chat h3 {
margin: 0 0 10px;
}
.header-chat p {
font-size: 14px;
line-height: 1.7;
margin: 0;
}
.info-avatar {
position: relative;
}
.info-avatar img {
    width: 100px;
    float: left;
    margin: 0 10px 0 0;
    padding: 5px;
    background: #fff;
}
a.informasi {
padding: 20px;
display: block;
overflow: hidden;
animation-name: showhide;
animation-duration: 0.5s;
}
a.informasi:hover {
background: #f1f1f1;
}
.info-chat span {
display: block;
}
#get-label,
span.chat-label {
font-size: 12px;
color: #888;
}
#get-nama,
span.chat-nama {
margin: 5px 0 0;
font-size: 15px;
font-weight: 700;
color: #222;
}
#get-label,
#get-nama {
color: #fff;
}
span.my-number {
display: none;
}
textarea#chat-input {
border: none;
width: 100%;
height: 46px;
outline: none;
resize: none;
padding: 9px;
font-size: 14px;
border-radius: 0px;
min-height: 50px;
}
a#send-it {
font-weight: 700;
padding: 10px 10px 0;
background: #eee;
}
a#send-it svg {
fill: #a6a6a6;
height: 24px;
width: 24px;
}
.first-msg {
background: transparent;
padding: 30px;
text-align: center;
}
.first-msg span {
background: #e2e2e2;
color: #333;
font-size: 14.2px;
line-height: 1.7;
border-radius: 10px;
padding: 15px 20px;
display: inline-block;
}
.start-chat .blanter-msg {
display: flex;
}
#get-number {
display: none;
}
a.close-chat {
position: absolute;
top: 5px;
right: 15px;
color: #fff;
font-size: 30px;
}
@keyframes ZpjSY {
0% {
background-color: #b6b5ba;
}
15% {
background-color: #111111;
}
25% {
background-color: #b6b5ba;
}
}
@keyframes hPhMsj {
15% {
background-color: #b6b5ba;
}
25% {
background-color: #111111;
}
35% {
background-color: #b6b5ba;
}
}
@keyframes iUMejp {
25% {
background-color: #b6b5ba;
}
35% {
background-color: #111111;
}
45% {
background-color: #b6b5ba;
}
}
@keyframes showhide {
from {
transform: scale(0.5);
opacity: 0;
}
}
@keyframes showchat {
from {
transform: scale(0);
opacity: 0;
}
}
@media screen and (max-width: 480px) {
#whatsapp-chat {
width: auto;
left: 5%;
right: 5%;
font-size: 80%;
}
}
@media screen and (max-width: 1200px) {
.index-page.show{
display: none !important;
}
}
#whatsapp-chat.hide {
display: none;
animation-name: showhide;
animation-duration: 0.5s;
transform: scale(1);
opacity: 1;
}
#whatsapp-chat.show {
display: block;
animation-name: showhide;
animation-duration: 0.5s;
transform: scale(1);
opacity: 1;
}
.whatsapp-message-container {
display: flex;
z-index: 1;
}
.whatsapp-message {
padding: 7px 14px 6px;
background-color: white;
border-radius: 0px 8px 8px;
position: relative;
transition: all 0.3s ease 0s;
opacity: 0;
transform-origin: center top 0px;
z-index: 2;
box-shadow: rgba(0, 0, 0, 0.13) 0px 1px 0.5px;
margin-top: 4px;
margin-left: -54px;
max-width: calc(100% - 66px);
}
.whatsapp-chat-body {
padding: 4px 0px 0px 2px;
background-color: #e6ddd4;
position: relative;
}.whatsapp-chat-body::before {
display: block;
position: absolute;
content: "";
left: 0px;
top: 0px;
height: 100%;
width: 100%;
z-index: 0;
opacity: 0.08;
background-image: url("../../senthaa/image-senthaa/whatsapp-bg.webp");
}
.dAbFpq {
display: flex;
z-index: 1;
}
.eJJEeC {
background-color: white;
width: 52.5px;
height: 32px;
border-radius: 16px;
display: flex;
-moz-box-pack: center;
justify-content: center;
-moz-box-align: center;
align-items: center;
margin-left: 10px;
opacity: 0;
transition: all 0.1s ease 0s;
z-index: 1;
box-shadow: rgba(0, 0, 0, 0.13) 0px 1px 0.5px;
}
.hFENyl {
position: relative;
display: flex;
}
.ixsrax {
height: 5px;
width: 5px;
margin: 0px 2px;
border-radius: 50%;
display: inline-block;
position: relative;
animation-duration: 1.2s;
animation-iteration-count: infinite;
animation-timing-function: linear;
top: 0px;
background-color: #9e9da2;
animation-name: ZpjSY;
}
.dRvxoz {
height: 5px;
width: 5px;
margin: 0px 2px;
background-color: #b6b5ba;
border-radius: 50%;
display: inline-block;
position: relative;
animation-duration: 1.2s;
animation-iteration-count: infinite;
animation-timing-function: linear;
top: 0px;
animation-name: hPhMsj;
}
.kAZgZq {
/*  padding: 7px 14px 6px;*/
/* background-color: white;
border-radius: 0px 8px 8px;*/
position: relative;
transition: all 0.3s ease 0s;
opacity: 0;
transform-origin: center top 0px;
z-index: 2;
/*  box-shadow: rgba(0, 0, 0, 0.13) 0px 1px 0.5px;*/
margin-top: 4px;
margin-left: -54px;
max-width: calc(100% - 66px);
}
/*.kAZgZq::before {
position: absolute;
background-image: url("../../solar-image/images/whatsapp/side-extend.webp");
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: contain;
content: "";
top: 0px;
left: -12px;
width: 12px;
height: 19px;
}*/
.bMIBDo {
font-size: 13px;
font-weight: 700;
line-height: 18px;
color: #000;
}
.iSpIQi {
font-size: 14px;
line-height: 19px;
margin-top: 4px;
color: #111111;
}
.iSpIQi {
font-size: 14px;
line-height: 19px;
margin-top: 4px;
color: #111111;
}
.cqCDVm {
text-align: right;
margin-top: 4px;
font-size: 12px;
line-height: 16px;
color: rgba(17, 17, 17, 0.5);
margin-right: -8px;
margin-bottom: -4px;
}
.phone .phon1 {
position: fixed;
bottom: 135px;
right: 44px;
z-index: 9;
width: 35px;
}

.call-phone {
height: 40px;
z-index: 1003;
position: fixed;
right: 24px;
bottom: 120px;
border: 3px solid #fff;   /* White border */
border-radius: 50%;       /* Make it a circle */
}

.navbar-wrap.scrolled .nav-links .btn-consult:hover {
    color: #fff !important;
}
.navbar-wrap.scrolled .nav-links .btn-consult{
    color: #fff !important;
}

#kitchen,
#wardrobe,
#live,
#contact2,
#about,
#factory,
#contact1
 {
    scroll-margin-top: 120px;
}

a:hover {
    text-decoration: none;
}

/* BACK TO TOP */
.back-to-top{
    position:fixed;
    right:25px;
    bottom:55px;    
    border:none;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    z-index:9999;
    box-shadow:0 10px 25px rgba(0,0,0,.18);
    opacity:0;
    visibility:hidden;
    transform:translateY(20px);
    transition:all .35s ease;
}

/* IMAGE */
.back-to-top img{
   width:40px;
    height:40px;
    object-fit:contain;
    display:block;
}

/* SHOW */
.back-to-top.show{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

/* HOVER */
.back-to-top:hover{
    background:#d94d1f;
    transform:translateY(-4px);
}

@media (max-width: 991.98px){


.trusted-content h2 {
    font-size: 16px;
    line-height: 28px;
}

    .footer-links li::before {
    content: "➤";
    position: absolute;
    left: -20px;
    top: 13px;
    right: 144px;
    font-size: 16px;
    line-height: 1;
    color: #ffffff;
    transition: 0.3s ease;
}

.uniwood-footer .mb-4 {
    margin-bottom: 5px !important;
}
.footer-links li {
    margin-bottom: 10px;
}
.footer-bottom {
    padding-top: 20px;
}
.footer-location {
    margin-bottom: 0;
}

.hero{
    min-height:100vh;
    display:block;
    position:relative;
    overflow:hidden;
}

/* MOBILE BANNER IMAGE */
.hero-bg{
    position:absolute;
    inset:0;
    background:url('../images/mobilebanner.jpg') center center/cover no-repeat !important;
    z-index:0;
}

/* dark overlay */
.hero-bg::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        to bottom,
        rgba(8,10,18,.20) 0%,
        rgba(8,10,18,.32) 30%,
        rgba(8,10,18,.68) 75%,
        rgba(8,10,18,.92) 100%
    );
}

/* GLASS CARD */
.hero-content{
    position:absolute;
    top:120px;
    left:18px;
    right:18px;
    width:auto;
    padding:26px 22px 28px 22px;
    border-radius:14px;
    background:rgba(17,28,48,.36);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border:1px solid rgba(255,255,255,.08);
    z-index:5;
    overflow:hidden;
}

/* orange side bar */
.hero-content::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:5px;
    height:100%;
    background:#F05A28;
}

/* shine */
.hero-content::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        90deg,
        rgba(255,255,255,.02) 0%,
        rgba(255,255,255,.06) 38%,
        rgba(255,255,255,.01) 100%
    );
}

/* keep text above layers */
.hero-content > *{
    position:relative;
    z-index:3;
}

/* est text */
.est-badge{
    margin-bottom:14px;
    gap:8px;
}

.est-line{
    display:none;
}

.est-text{
    font-size:12px;
    line-height:1;
    letter-spacing:2px;
    color:#F05A28;
    font-weight:700;
}

/* title */
.hero-title {
    font-size: 20px;
    line-height: 1.08;
    font-weight: 700;
    color: #fff;
    margin: 0 0 14px;
}

/* sub */
.hero-sub{
    font-size:14px;
    line-height:1.45;
    color:rgba(255,255,255,.92);
    margin:0;
}

/* BUTTON AREA */
.cta-group{
    position:absolute;
    left:18px;
    right:18px;
    bottom:26px;
    top:auto;
    width:auto;
    height:auto;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:14px;
    z-index:8;
}

/* buttons */
.cta-group a{
    width:100%;
    height:52px;
    display:flex !important;
    align-items:center;
    justify-content:center;
    font-size:14px;
    font-weight:700;
    border-radius:10px;
    text-decoration:none;
}

.btn-primary-cta{
    background:#F05A28;
    color:#fff;
}

.btn-outline-cta{
    background:transparent;
    border:2px solid rgba(255,255,255,.95);
    color:#fff;
}
.counter-section {
    padding: 0;
}
.mt-5 {
    margin-top: 10px !important;
}
.collection-top h2 {
    font-size: 24px;
    margin-bottom: 10px;
}
.icon-circle img {
    width: 80px;
    height: 80px;
    margin-bottom: 10px;
}
.estimate-title {
    font-size: 24px;
    text-align: left;
    line-height: 30px;
    margin-bottom: 20px;
}
.custom-input {
    margin-bottom: 20px;
}
.different-section {
    padding: 0;
}
.different-card {
    margin-bottom: 20px !important;
}

.collection-section {
    padding: 30px 0;
}
.collection-top {
    padding: 0 18px;
    flex-direction: column;
    gap: 12px;
    align-items: flex-start;
}
.project-slider{
    padding-left:14px;
    padding-right:14px;
    overflow:hidden;
}

/* FULL ONE CARD VISIBLE */
.swiper-slide{
    width:100% !important;
    max-width:100% !important;
}

/* card */
.project-item{
    width:100%;
    height:355px;
    border-radius:14px;
    overflow:hidden;
    position:relative;
}

/* image */
.project-item-image,
.project-item-image figure,
.project-item-image img{
    width:100%;
    height:100%;
}

.project-item-image img{
    object-fit:cover;
    object-position:center center;
    display:block;
}

/* gradient */
.project-item-image::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        to top,
        rgba(0,0,0,.82) 0%,
        rgba(0,0,0,.35) 35%,
        rgba(0,0,0,.05) 70%
    );
    z-index:2;
}

/* content */
.project-item-content{
    position:absolute;
    left:26px;
    right:26px;
    bottom:28px;
    z-index:5;
}

.project-item-content h2{
    margin:0 0 10px;
}

.project-item-content h2 a{
    font-size:22px;
    line-height:28px;
    color:#fff;
}

.project-item-content ul li{
    font-size:14px;
    line-height:22px;
    color:rgba(255,255,255,.90);
    max-width:240px;
}
.steps-section {
    padding: 0;
}
.uniwood-footer {
    padding: 30px 0 10px 0;
    text-align: center;
}
.footer-top {
    padding-bottom: 10px;
}
.footer-desc, .footer-links a, .footer-location span {
    font-size: 14px;
    margin: auto;
    margin-bottom: 10px;
}
.footer-social {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
}
}
@media (min-width: 992px) and (max-width: 1400px) { 
    .navbar-inner {
        padding: 0 8px;
    }
    .nav-links {
        gap: 20px;
    }
    .different-card h3 {
        font-size: 16px;
    }
    .hero{
    min-height:100vh;
    display:block;
    position:relative;
    overflow:hidden;
}

/* MOBILE BANNER IMAGE */
.hero-bg{
    position:absolute;
    inset:0;
    background:url('../images/mobilebanner.jpg') center center/cover no-repeat !important;
    z-index:0;
}

/* dark overlay */
.hero-bg::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        to bottom,
        rgba(8,10,18,.20) 0%,
        rgba(8,10,18,.32) 30%,
        rgba(8,10,18,.68) 75%,
        rgba(8,10,18,.92) 100%
    );
}

.hero-content {
    position: absolute;
    top: 145px;
    left: 40px;
    right: 18px;
    width: 57%;
    padding: 26px 22px 28px 22px;
    border-radius: 14px;
    background: rgba(17,28,48,.36);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(255,255,255,.08);
    z-index: 5;
    overflow: hidden;
}

/* orange side bar */
.hero-content::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:5px;
    height:100%;
    background:#F05A28;
}

/* shine */
.hero-content::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        90deg,
        rgba(255,255,255,.02) 0%,
        rgba(255,255,255,.06) 38%,
        rgba(255,255,255,.01) 100%
    );
}

/* keep text above layers */
.hero-content > *{
    position:relative;
    z-index:3;
}

/* est text */
.est-badge{
    margin-bottom:14px;
    gap:8px;
}

.est-line{
    display:none;
}

.est-text{
    font-size:12px;
    line-height:1;
    letter-spacing:2px;
    color:#F05A28;
    font-weight:700;
}

/* title */
.hero-title {
    font-size: 20px;
    line-height: 1.08;
    font-weight: 700;
    color: #fff;
    margin: 0 0 14px;
}

/* sub */
.hero-sub{
    font-size:14px;
    line-height:1.45;
    color:rgba(255,255,255,.92);
    margin:0;
}

/* BUTTON AREA */
.cta-group {
    position: absolute;
    left: 40px;
    right: 18px;
    bottom: 26px;
    top: auto;
    width: 60%;
    height: auto;
    padding: 0;
    display: flex;
    flex-direction: row;
    gap: 14px;
    z-index: 8;
}

/* buttons */
.cta-group a{
    width:100%;
    height:52px;
    display:flex !important;
    align-items:center;
    justify-content:center;
    font-size:14px;
    font-weight:700;
    border-radius:10px;
    text-decoration:none;
}

.btn-primary-cta{
    background:#F05A28;
    color:#fff;
}

.btn-outline-cta{
    background:transparent;
    border:2px solid rgba(255,255,255,.95);
    color:#fff;
}
.mt-5 {
    margin-top: 30px !important;
}
.counter-box p {
    margin-bottom: 0;
}
.estimate-title {
    font-size: 24px;
    margin-bottom: 20px;
}
.estimate-form label {
    font-size: 12px;
}
.trusted-content h2 {
    font-size: 28px;
}
.trusted-content {
    padding: 50px;
}
.steps-line {
    right: 5%;
}
.different-card {
    min-height: 401px;
}
}
@media (min-width: 1401px) and (max-width: 1600px) { 
        .hero{
    min-height:100vh;
    display:block;
    position:relative;
    overflow:hidden;
}

/* MOBILE BANNER IMAGE */
.hero-bg{
    position:absolute;
    inset:0;
    background:url('../images/mobilebanner.jpg') center center/cover no-repeat !important;
    z-index:0;
}

/* dark overlay */
.hero-bg::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        to bottom,
        rgba(8,10,18,.20) 0%,
        rgba(8,10,18,.32) 30%,
        rgba(8,10,18,.68) 75%,
        rgba(8,10,18,.92) 100%
    );
}

.hero-content {
    position: absolute;
    top: 145px;
    left: 40px;
    right: 18px;
    width: 57%;
    padding: 26px 22px 28px 22px;
    border-radius: 14px;
    background: rgba(17,28,48,.36);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(255,255,255,.08);
    z-index: 5;
    overflow: hidden;
}

/* orange side bar */
.hero-content::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:5px;
    height:100%;
    background:#F05A28;
}

/* shine */
.hero-content::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        90deg,
        rgba(255,255,255,.02) 0%,
        rgba(255,255,255,.06) 38%,
        rgba(255,255,255,.01) 100%
    );
}

/* keep text above layers */
.hero-content > *{
    position:relative;
    z-index:3;
}

/* est text */
.est-badge{
    margin-bottom:14px;
    gap:8px;
}

.est-line{
    display:none;
}

.est-text{
    font-size:12px;
    line-height:1;
    letter-spacing:2px;
    color:#F05A28;
    font-weight:700;
}

/* title */
.hero-title {
    font-size: 20px;
    line-height: 1.08;
    font-weight: 700;
    color: #fff;
    margin: 0 0 14px;
}

/* sub */
.hero-sub{
    font-size:14px;
    line-height:1.45;
    color:rgba(255,255,255,.92);
    margin:0;
}

/* BUTTON AREA */
.cta-group {
    position: absolute;
    left: 40px;
    right: 18px;
    bottom: 26px;
    top: auto;
    width: 60%;
    height: auto;
    padding: 0;
    display: flex;
    flex-direction: row;
    gap: 14px;
    z-index: 8;
}

/* buttons */
.cta-group a{
    width:100%;
    height:52px;
    display:flex !important;
    align-items:center;
    justify-content:center;
    font-size:14px;
    font-weight:700;
    border-radius:10px;
    text-decoration:none;
}

.btn-primary-cta{
    background:#F05A28;
    color:#fff;
}

.btn-outline-cta{
    background:transparent;
    border:2px solid rgba(255,255,255,.95);
    color:#fff;
}
.different-card {
    min-height: 401px;
}
}