@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');
/* Smile Groups Premium v3 — final visual overrides */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@500;600;700;800&display=swap');
:root{--font-display:'Plus Jakarta Sans',Inter,Arial,sans-serif;--font-body:Inter,Arial,sans-serif;--bg:#f6f8fb;--surface:#fff;--text:#172033;--text2:#4b586d;--muted:#718096;--border:#dfe5ee;--navy:#061321;--gold:#f59e0b}
html,body{overflow-x:hidden}body{background:var(--bg);color:var(--text2);font-family:var(--font-body);line-height:1.7}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);color:var(--text);font-weight:700;line-height:1.16;letter-spacing:-.035em}p,li,td,th,label{color:var(--text2)}.wrap{width:min(1320px,100%);margin-inline:auto;padding-inline:clamp(20px,4.5vw,64px)}
/* Header */
.site-header{background:rgba(255,255,255,.98);border-bottom:1px solid #e8ecf2;box-shadow:0 6px 26px rgba(15,23,42,.06);backdrop-filter:blur(16px)}.header-bar{height:82px;min-height:82px;gap:28px}.brand{width:auto;height:auto;display:inline-flex;align-items:center}.brand-logo{height:52px;width:auto;max-width:58px;object-fit:contain;filter:none}.main-nav{margin-left:auto}.main-nav>ul{gap:3px}.main-nav a.nav-link{font-family:var(--font-display);font-size:14px;font-weight:600;color:#4c596d;padding:12px 15px;border-radius:10px}.main-nav a.nav-link:hover,.main-nav a.nav-link.active{background:#f3f6fa;color:#172033}.main-nav a.nav-link.active::after{display:none}.header-cta{gap:14px}.header-cta .tel{font-family:var(--font-body);font-size:14px;color:#667085}.header-cta .tel strong{color:#172033;font-weight:700}.btn{font-family:var(--font-display);font-size:14px;font-weight:700;letter-spacing:0;text-transform:none;border-radius:12px;padding:14px 21px;min-height:48px;line-height:1.2}.btn-primary{background:linear-gradient(135deg,#ffb21c,#f59e0b);color:#211705!important;border:1px solid #f59e0b;box-shadow:0 10px 24px rgba(245,158,11,.22)}.btn-primary:hover{background:linear-gradient(135deg,#ffc044,#f59e0b);color:#211705!important}.btn-ghost{border:1px solid rgba(255,255,255,.42);background:rgba(4,12,22,.18);color:#fff!important}.btn-ghost:hover{border-color:#f59e0b;background:rgba(245,158,11,.08);color:#fff!important}.nav-toggle{border:1px solid #d7dee8;background:#fff;color:#172033;border-radius:10px}
/* Hero background image fix */
.hero,.page-hero{position:relative;isolation:isolate;background:#061321;overflow:hidden}.hero{min-height:min(86vh,820px)}.hero-slides{position:absolute;inset:0;z-index:0}.hero-slide{position:absolute!important;inset:0!important;display:block!important;opacity:0;visibility:hidden;transition:opacity .75s ease;background-color:#061321;background-repeat:no-repeat;background-size:cover;background-position:center}.hero-slide.is-active{opacity:1;visibility:visible;z-index:1}.hero-slide img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;opacity:0!important;visibility:hidden!important;pointer-events:none}.hero-slide::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,10,19,.96) 0%,rgba(3,10,19,.86) 29%,rgba(3,10,19,.55) 55%,rgba(3,10,19,.15) 80%,rgba(3,10,19,.08));z-index:1}.hero-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(3,10,19,.76),rgba(3,10,19,.12) 42%,transparent 68%);z-index:1}.hero-content{position:relative;z-index:3;width:100%;min-height:min(86vh,820px);display:flex;flex-direction:column;justify-content:center;padding-block:110px 100px}.hero-content h1{font-size:clamp(38px,5.2vw,50px);max-width:840px;color:#fff;margin:0 0 22px}.hero-content h1 .accent{color:#f5ad31}.hero-content p.lead{font-size:clamp(16px,1.35vw,19px);line-height:1.75;max-width:650px;color:#edf3fb;margin:0}.hero-tag{font-family:var(--font-display);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#ffd477;background:rgba(245,158,11,.10);border:1px solid rgba(245,158,11,.45);padding:10px 16px;border-radius:999px;margin-bottom:22px;width:max-content}.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.hero-nav{position:absolute;z-index:5;left:50%;transform:translateX(-50%);bottom:34px;width:min(1320px,100%);padding-inline:clamp(20px,4.5vw,64px);display:flex;align-items:center;justify-content:flex-end;gap:14px}.hero-count{font-family:var(--font-body);font-size:12px;font-weight:600;color:#aab7c9}.hero-dots{display:flex;gap:8px}.hero-dots button{width:36px;height:3px;background:rgba(255,255,255,.3);border:0;padding:0}.hero-dots button.is-active{background:#f59e0b}
/* Page banners */
.page-hero{min-height:390px;background-position:center;background-size:cover;background-repeat:no-repeat;display:flex;align-items:stretch}.page-hero img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;opacity:0!important;visibility:hidden!important;pointer-events:none}.page-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,10,19,.94),rgba(3,10,19,.77) 34%,rgba(3,10,19,.42) 63%,rgba(3,10,19,.10));z-index:1}.page-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(3,10,19,.78),rgba(3,10,19,0) 60%);z-index:1}.page-hero-content{position:relative;z-index:3;width:100%;display:flex;flex-direction:column;justify-content:flex-end;padding-block:92px 58px}.page-hero h1{font-size:clamp(34px,4.4vw,46px);color:#fff;max-width:820px;margin-bottom:15px}.page-hero p{max-width:680px;color:#e9f0f8;font-size:17px;margin:0}.breadcrumb{color:#aeb9c8;font-family:var(--font-body);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;margin-bottom:15px}
/* Light sections */
.section,.grid-glow{background:var(--bg)}.section:nth-of-type(even){background:#fff}.section{padding-block:clamp(60px,8vw,104px)}.section--tight{padding-block:clamp(44px,6vw,70px)}.section-head{max-width:780px;margin-bottom:44px}.section-head h2{font-size:clamp(30px,3.5vw,48px);margin-bottom:14px}.section-head p{font-size:17px;color:var(--text2);max-width:720px}.panel,.insight-card,.testimonial-card,.office-card,.careers-banner,.legal-toc{background:#fff!important;border:1px solid var(--border)!important;box-shadow:0 12px 34px rgba(15,23,42,.055);border-radius:18px}.panel{padding:30px}.panel h3,.insight-card h3,.office-card h3{color:#172033}.panel p,.insight-card p,.office-card p,.testimonial-card p{color:#536176}.panel .p-icon{background:#fff7e8;border:1px solid #f7d89b;color:#d97706}.services-grid,.card-grid{gap:22px}.services-grid .panel:hover,.card-grid .panel:hover,.insight-card:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(15,23,42,.09);transition:transform .22s ease,box-shadow .22s ease}.stat-strip{background:#fff;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.stat-grid{grid-template-columns:repeat(4,1fr)}.stat{min-height:180px;padding:34px clamp(22px,3vw,48px);border-right:1px solid var(--border);display:flex;flex-direction:column;justify-content:center}.stat:last-child{border-right:0}.stat .num{font-family:var(--font-display);font-size:clamp(30px,3vw,24px);font-weight:800;line-height:1.1;color:#d97706;display:block}.stat .label{font-size:14px;line-height:1.5;color:#7a879a;margin-top:12px;max-width:190px}.split{gap:clamp(40px,6vw,90px);align-items:center}.split img,.split .media{width:100%;border-radius:18px;border:1px solid var(--border);background:#fff;object-fit:cover}.check-list li,.process-step{border-color:var(--border)}.process-step h4{color:#172033}.process-step p,.check-list li{color:#536176}.tech-cloud span,.industry-grid span{background:#fff;color:#536176;border-color:var(--border)}.faq-list,.faq-item{border-color:var(--border)}.faq-item summary{color:#172033;font-family:var(--font-display);font-weight:700}.faq-item .faq-a{color:#536176}.testimonial-card{padding:30px}.testimonial-meta strong{color:#172033}.testimonial-meta span{color:#7b8799}.avatar{background:#fff7e8;color:#c76d00;border-color:#f1bd58}.cta-band{background:linear-gradient(135deg,#fff8eb,#f8fafc);border:1px solid var(--border);border-radius:20px}.cta-inner h2{color:#172033}.cta-inner p{color:#536176}
/* Form contrast */
.field label{display:block;color:#334155;font-weight:700;margin-bottom:7px}.field input,.field select,.field textarea{background:#fff!important;color:#172033!important;border:1px solid #cfd7e3!important;border-radius:11px;padding:13px 14px}.field input:focus,.field select:focus,.field textarea:focus{border-color:#f59e0b!important;box-shadow:0 0 0 3px rgba(245,158,11,.12)}.field input::placeholder,.field textarea::placeholder{color:#9aa5b5;opacity:1}.form-note{color:#7b8799}
/* Footer */
.site-footer{background:linear-gradient(180deg,#07111f,#050b14);color:#aab7c9;border-top:0;padding-top:74px}.site-footer h5,.footer-col h5{color:#e7edf5}.footer-brand p,.footer-office,.footer-col a,.footer-bottom .copyright,.footer-bottom .legal-links a{color:#9aa8ba}.footer-col a:hover,.footer-bottom .legal-links a:hover{color:#ffd17a}
@media (max-width:1180px){.header-bar{gap:16px}.main-nav a.nav-link{padding-inline:11px}.header-cta .tel{display:none}}
@media (max-width:980px){.header-bar{height:72px;min-height:72px}.main-nav{display:none}.header-cta .btn{display:none}.nav-toggle{display:flex;margin-left:auto;align-items:center;justify-content:center}.hero,.hero-content{min-height:720px}.hero-slide::before{background:linear-gradient(90deg,rgba(3,10,19,.94),rgba(3,10,19,.78) 58%,rgba(3,10,19,.36))}.hero-content{justify-content:center;padding-block:90px}.stat-grid{grid-template-columns:repeat(2,1fr)}.stat:nth-child(2){border-right:0}.stat:nth-child(n+3){border-top:1px solid var(--border)}}
@media (max-width:640px){.wrap{padding-inline:18px}.brand-logo{height:46px;max-width:52px}.hero,.hero-content{min-height:680px}.hero-slide{background-position:65% center}.hero-slide::before{background:linear-gradient(90deg,rgba(3,10,19,.95),rgba(3,10,19,.80) 60%,rgba(3,10,19,.45))}.hero-content{padding-block:76px 104px}.hero-tag{font-size:10.5px;letter-spacing:.11em;padding:9px 13px}.hero-content h1{font-size:clamp(34px,10vw,46px);line-height:1.06}.hero-content p.lead{font-size:15.5px}.hero-cta{width:100%;margin-top:24px}.hero-cta .btn{width:100%}.hero-nav{left:0;transform:none;width:100%;padding-inline:18px;bottom:24px;justify-content:space-between}.hero-dots button{width:24px}.page-hero{min-height:330px}.page-hero-content{padding-block:72px 40px}.page-hero h1{font-size:clamp(32px,9vw,44px)}.page-hero p{font-size:15px}.section{padding-block:58px}.section-head{margin-bottom:30px}.section-head h2{font-size:clamp(28px,8vw,38px)}.services-grid,.card-grid,.process,.industry-grid{grid-template-columns:1fr!important}.stat-grid{grid-template-columns:1fr 1fr}.stat{min-height:145px;padding:24px 16px}.stat:nth-child(odd){border-right:1px solid var(--border)}.stat:nth-child(even){border-right:0}.stat:nth-child(n+3){border-top:1px solid var(--border)}.stat .num{font-size:26px}.stat .label{font-size:12px}.panel,.insight-card,.testimonial-card,.office-card,.careers-banner{padding:23px;border-radius:15px}.mobile-nav{background:#07111f;border-left:1px solid rgba(255,255,255,.12)}.mobile-nav a{color:#f0f4f9}.mobile-nav .sub a{color:#aab7c8}}

/* ===== Smile Groups V4 Enterprise Override ===== */
:root{
  --font-display:'Manrope',Inter,Arial,sans-serif;
  --font-body:'Inter',Arial,sans-serif;
  --ink:#0d1728;
  --ink-soft:#526174;
  --gold:#f5a900;
  --gold-dark:#d98200;
  --navy:#06101e;
  --line:#e3e8ef;
}

/* Full corporate logo */
.brand{display:inline-flex!important;align-items:center!important;min-width:210px}
.brand-logo{display:block!important;width:210px!important;height:auto!important;max-width:none!important;max-height:58px!important;object-fit:contain!important}

/* Enterprise dark glass header */
.site-header{
  position:sticky!important;top:0!important;z-index:1000!important;
  background:rgba(4,12,24,.92)!important;
  border-bottom:1px solid rgba(255,255,255,.10)!important;
  box-shadow:0 12px 35px rgba(0,0,0,.16)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}
.header-bar{height:86px!important;min-height:86px!important;align-items:center!important}
.main-nav{margin-left:auto!important}
.main-nav a.nav-link{color:#d7dfeb!important;font-family:var(--font-display)!important;font-size:14px!important;font-weight:700!important}
.main-nav a.nav-link:hover,.main-nav a.nav-link.active{background:rgba(255,255,255,.09)!important;color:#fff!important}
.header-cta .tel{color:#9eacbf!important}.header-cta .tel strong{color:#fff!important}
.nav-toggle{background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.20)!important;color:#fff!important}

/* Force all normal content sections into the requested light mode. */
main > .section,
main section.section,
main .section.grid-glow,
main .section[style*="navy"],
main .section[style*="--navy"]{
  background:#f7f9fc!important;
  color:var(--ink-soft)!important;
  border-top-color:#e3e8ef!important;
}
main > .section:nth-of-type(even), main section.section:nth-of-type(even){background:#fff!important}
.section h1,.section h2,.section h3,.section h4,.section h5,.section h6,
.section .section-head h2,.section .section-head h3{color:var(--ink)!important}
.section p,.section li,.section td,.section th,.section .faq-a{color:var(--ink-soft)!important}
.section .eyebrow{color:#bd7300!important}

/* Fix inline dark text variables inherited from the old theme. */
.section [style*="--ink-300"],.section [style*="--ink-200"],.section [style*="var(--ink-300)"],.section [style*="var(--ink-200)"]{color:var(--ink-soft)!important}
.section [style*="color:var(--ink-300)"],.section [style*="color:var(--ink-200)"]{color:var(--ink-soft)!important}

/* FAQ: readable, premium light accordion */
.faq-list{border-top:1px solid #d8e0ea!important}
.faq-item{border-bottom:1px solid #d8e0ea!important}
.faq-item summary{color:var(--ink)!important;font-size:18px!important;padding:25px 4px!important}
.faq-item summary::after{color:#d88900!important}
.faq-item .faq-a{color:#526174!important;line-height:1.75!important;padding:0 4px 24px!important}

/* Light-section secondary buttons */
.section .btn-ghost,
.careers-banner .btn-ghost,
.cta-band .btn-ghost{color:#152238!important;background:#fff!important;border:1px solid #cbd5e1!important}
.section .btn-ghost:hover,.careers-banner .btn-ghost:hover,.cta-band .btn-ghost:hover{color:#111b2d!important;border-color:#f5a900!important;background:#fffaf0!important}
.btn-primary{color:#1e1605!important;background:linear-gradient(135deg,#ffb51b,#f29a00)!important;border-color:#f29a00!important}

/* Consistent content alignment */
.section .wrap,.section--tight .wrap{max-width:1320px!important;margin-inline:auto!important}
.section-head{max-width:820px!important}
.section-head h2{max-width:820px!important}
.panel,.insight-card,.testimonial-card,.office-card,.careers-banner,.legal-toc{overflow:hidden}

/* Make content cards look intentional after light-mode conversion */
.insight-card,.panel,.testimonial-card,.office-card{background:#fff!important;border:1px solid #e1e7ef!important;color:var(--ink-soft)!important;box-shadow:0 12px 34px rgba(15,23,42,.055)!important}
.insight-card h3,.panel h3,.testimonial-card h3,.office-card h3{color:var(--ink)!important}
.insight-card p,.panel p,.testimonial-card p,.office-card p{color:#526174!important}

/* Hero remains dark/cinematic */
.hero,.page-hero{background:#06101e!important}
.hero-content h1,.page-hero h1{font-family:var(--font-display)!important;font-weight:800!important;letter-spacing:-.045em!important}
.hero-content p.lead,.page-hero p{color:#eef3f9!important}

/* Footer remains dark */
.site-footer{background:linear-gradient(180deg,#06101e,#030913)!important;color:#aab7c9!important}
.site-footer h5,.footer-col h5{color:#fff!important}

/* Mobile full logo and navigation */
@media(max-width:980px){
  .brand{min-width:170px!important}
  .brand-logo{width:170px!important;max-height:50px!important}
  .header-bar{height:76px!important;min-height:76px!important}
  .mobile-nav{background:#07111f!important;color:#fff!important}
  .mobile-nav .brand-logo{width:180px!important}
  .mobile-nav a{color:#e8eef6!important}
  .mobile-nav .sub a{color:#b9c6d7!important}
}
@media(max-width:640px){
  .brand{min-width:150px!important}
  .brand-logo{width:150px!important;max-height:46px!important}
  .hero-content h1{font-size:clamp(34px,10vw,50px)!important}
  .hero-content p.lead{font-size:16px!important;line-height:1.65!important}
  .section{padding-block:58px!important}
  .faq-item summary{font-size:16px!important;line-height:1.45!important}
}


/* =========================================================
   FINAL MOBILE MENU FIX
   Overrides the previous dark mobile drawer and improves
   spacing, hierarchy, contrast and the Quote CTA.
   ========================================================= */

@media (max-width: 980px) {

  /* Prevent the page from scrolling horizontally when drawer opens */
  html, body {
    overflow-x: hidden !important;
  }

  /* Mobile drawer */
  .mobile-nav {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;

    width: min(390px, 92vw) !important;
    max-width: 100% !important;

    height: 100dvh !important;
    min-height: 100vh !important;

    padding: 22px 22px 28px !important;

    display: flex !important;
    flex-direction: column !important;

    background: #ffffff !important;
    color: #172033 !important;

    border-left: 1px solid #e3e8ef !important;
    box-shadow: -18px 0 50px rgba(15, 23, 42, .16) !important;

    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;

    z-index: 9999 !important;

    transform: translateX(100%) !important;
    visibility: hidden !important;
    opacity: 0 !important;

    transition:
      transform .32s cubic-bezier(.22,.61,.36,1),
      opacity .22s ease,
      visibility .22s ease !important;
  }

  .mobile-nav.open,
  .mobile-nav.is-open,
  body.menu-open .mobile-nav {
    transform: translateX(0) !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* If the existing site uses a generic active class */
  .mobile-nav.active {
    transform: translateX(0) !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* Drawer header */
  .mobile-nav-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 54px !important;
    padding: 0 0 18px !important;
    margin: 0 !important;
    border-bottom: 1px solid #e9edf3 !important;
  }

  /* Full logo inside drawer, when a brand is present */
  .mobile-nav .brand,
  .mobile-nav-header .brand {
    display: inline-flex !important;
    align-items: center !important;
    min-width: 0 !important;
    width: auto !important;
    height: auto !important;
  }

  .mobile-nav .brand-logo,
  .mobile-nav-header .brand-logo {
    display: block !important;
    width: 180px !important;
    max-width: 180px !important;
    height: auto !important;
    max-height: 50px !important;
    object-fit: contain !important;
  }

  /* Close button */
  .mobile-nav-close {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    padding: 0 !important;
    margin: 0 0 0 auto !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border: 1px solid #d9e1eb !important;
    border-radius: 12px !important;
    background: #f8fafc !important;
    color: #172033 !important;

    font-size: 23px !important;
    line-height: 1 !important;
  }

  .mobile-nav-close:hover,
  .mobile-nav-close:focus {
    background: #fff8eb !important;
    border-color: #f5a900 !important;
    color: #c97700 !important;
    outline: none !important;
  }

  /* Main navigation list */
  .mobile-nav > ul {
    margin: 16px 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  .mobile-nav li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid #edf0f4 !important;
  }

  .mobile-nav > ul > li > a,
  .mobile-nav > ul > li > button {
    width: 100% !important;
    min-height: 56px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    padding: 16px 2px !important;
    margin: 0 !important;

    background: transparent !important;
    border: 0 !important;

    color: #172033 !important;

    font-family: var(--font-display) !important;
    font-size: 16px !important;
    font-weight: 650 !important;
    line-height: 1.3 !important;

    text-align: left !important;
    text-decoration: none !important;
  }

  .mobile-nav > ul > li > a:hover,
  .mobile-nav > ul > li > a:focus,
  .mobile-nav > ul > li > button:hover,
  .mobile-nav > ul > li > button:focus {
    color: #d27c00 !important;
    outline: none !important;
  }

  /* Services submenu */
  .mobile-nav .sub {
    margin: 0 !important;
    padding: 2px 0 10px 14px !important;
    list-style: none !important;
  }

  .mobile-nav .sub li {
    border: 0 !important;
  }

  .mobile-nav .sub a {
    display: block !important;

    padding: 9px 4px !important;

    color: #667085 !important;

    font-family: var(--font-body) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.45 !important;

    border-left: 2px solid transparent !important;
    text-decoration: none !important;
  }

  .mobile-nav .sub a:hover,
  .mobile-nav .sub a:focus {
    color: #d27c00 !important;
    border-left-color: #f5a900 !important;
    padding-left: 10px !important;
    outline: none !important;
  }

  /* Premium Quote button */
  .mobile-nav > .btn-primary,
  .mobile-nav .btn-primary {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 54px !important;

    margin: 20px 0 0 !important;
    padding: 14px 18px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;

    box-sizing: border-box !important;

    border: 1px solid #ed9800 !important;
    border-radius: 12px !important;

    background: linear-gradient(135deg, #ffb51b 0%, #f29a00 100%) !important;

    color: #17120a !important;

    font-family: var(--font-display) !important;
    font-size: 15px !important;
    font-weight: 750 !important;
    line-height: 1 !important;

    text-decoration: none !important;

    box-shadow: 0 10px 24px rgba(245, 158, 11, .22) !important;

    transition:
      transform .2s ease,
      box-shadow .2s ease,
      filter .2s ease !important;
  }

  .mobile-nav > .btn-primary:hover,
  .mobile-nav .btn-primary:hover,
  .mobile-nav > .btn-primary:focus,
  .mobile-nav .btn-primary:focus {
    color: #17120a !important;
    filter: brightness(1.04) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 14px 28px rgba(245, 158, 11, .28) !important;
    outline: none !important;
  }

  .mobile-nav .btn-primary .btn-arrow,
  .mobile-nav .btn-primary svg {
    flex: 0 0 auto !important;
  }

  /* Override the old V3 dark mobile rules */
  .mobile-nav,
  .mobile-nav a,
  .mobile-nav .sub a {
    text-shadow: none !important;
  }
}


/* =========================================================
   MOBILE OVERLAY
   ========================================================= */

@media (max-width: 980px) {

  .mobile-nav-overlay {
    position: fixed !important;
    inset: 0 !important;

    background: rgba(6, 16, 30, .48) !important;

    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;

    z-index: 9998 !important;

    opacity: 0 !important;
    visibility: hidden !important;

    transition:
      opacity .25s ease,
      visibility .25s ease !important;
  }

  .mobile-nav-overlay.open,
  .mobile-nav-overlay.is-open,
  body.menu-open .mobile-nav-overlay {
    opacity: 1 !important;
    visibility: visible !important;
  }
}


/* =========================================================
   SMALL PHONES
   ========================================================= */

@media (max-width: 480px) {

  .mobile-nav {
    width: 100% !important;
    padding: 20px 18px 24px !important;
  }

  .mobile-nav .brand-logo,
  .mobile-nav-header .brand-logo {
    width: 165px !important;
    max-width: 165px !important;
    max-height: 46px !important;
  }

  .mobile-nav > ul {
    margin-top: 12px !important;
  }

  .mobile-nav > ul > li > a,
  .mobile-nav > ul > li > button {
    min-height: 54px !important;
    font-size: 16px !important;
  }

  .mobile-nav .sub {
    padding-left: 12px !important;
  }

  .mobile-nav .sub a {
    font-size: 13.5px !important;
  }

  .mobile-nav > .btn-primary,
  .mobile-nav .btn-primary {
    min-height: 52px !important;
    margin-top: 18px !important;
    border-radius: 11px !important;
  }
}


/* =========================================================
   MOBILE MENU — MATCH DESKTOP HEADER
   The mobile drawer intentionally uses the same visual
   language as the desktop enterprise header.
   ========================================================= */

@media (max-width: 980px) {

  .mobile-nav {
    width: min(390px, 92vw) !important;
    max-width: 100% !important;
    height: 100dvh !important;
    min-height: 100vh !important;

    padding: 0 22px 28px !important;

    background:
      linear-gradient(180deg, #06101e 0%, #071525 100%) !important;

    color: #fff !important;

    border-left: 1px solid rgba(255,255,255,.10) !important;

    box-shadow:
      -20px 0 55px rgba(0,0,0,.30) !important;

    overflow-y: auto !important;
  }

  /* Same header height and treatment as desktop */
  .mobile-nav-header {
    min-height: 86px !important;
    height: 86px !important;

    margin: 0 -22px !important;
    padding: 0 22px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    background: rgba(4,12,24,.96) !important;

    border-bottom:
      1px solid rgba(255,255,255,.10) !important;

    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
  }

  /* Use the SAME logo sizing as the desktop brand.
     This must point to the full Smile Groups logo asset. */
  .mobile-nav .brand,
  .mobile-nav-header .brand {
    min-width: 0 !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  .mobile-nav .brand-logo,
  .mobile-nav-header .brand-logo {
    width: 210px !important;
    max-width: 210px !important;
    height: auto !important;
    max-height: 58px !important;
    object-fit: contain !important;
    display: block !important;
  }

  /* Desktop-style close button */
  .mobile-nav-close {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;

    margin-left: auto !important;
    padding: 0 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: rgba(255,255,255,.07) !important;
    border: 1px solid rgba(255,255,255,.20) !important;
    border-radius: 12px !important;

    color: #fff !important;
    font-size: 23px !important;
  }

  .mobile-nav-close:hover,
  .mobile-nav-close:focus {
    background: rgba(245,169,0,.14) !important;
    border-color: #f5a900 !important;
    color: #ffd477 !important;
    outline: none !important;
  }

  /* Navigation begins below the header exactly like a
     separate navigation area, rather than a white drawer. */
  .mobile-nav > ul {
    margin: 18px 0 0 !important;
    padding: 0 !important;
  }

  .mobile-nav li {
    border-bottom:
      1px solid rgba(255,255,255,.10) !important;
  }

  .mobile-nav > ul > li > a,
  .mobile-nav > ul > li > button {
    min-height: 58px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    padding: 17px 2px !important;

    background: transparent !important;
    border: 0 !important;

    color: #e7edf5 !important;

    font-family: var(--font-display) !important;
    font-size: 16px !important;
    font-weight: 700 !important;

    line-height: 1.3 !important;
    text-decoration: none !important;
  }

  .mobile-nav > ul > li > a:hover,
  .mobile-nav > ul > li > a:focus,
  .mobile-nav > ul > li > button:hover,
  .mobile-nav > ul > li > button:focus {
    color: #ffd477 !important;
    outline: none !important;
  }

  /* Active page = same gold accent as desktop */
  .mobile-nav > ul > li > a.active,
  .mobile-nav > ul > li > button.active,
  .mobile-nav > ul > li.active > a {
    color: #f5a900 !important;
  }

  /* Services */
  .mobile-nav .sub {
    margin: 0 !important;
    padding: 2px 0 12px 14px !important;
  }

  .mobile-nav .sub li {
    border: 0 !important;
  }

  .mobile-nav .sub a {
    display: block !important;

    padding: 9px 4px !important;

    color: #aebbcf !important;

    font-family: var(--font-body) !important;
    font-size: 14px !important;
    font-weight: 500 !important;

    line-height: 1.45 !important;

    border-left: 2px solid transparent !important;
    text-decoration: none !important;
  }

  .mobile-nav .sub a:hover,
  .mobile-nav .sub a:focus {
    color: #ffd477 !important;
    border-left-color: #f5a900 !important;
    padding-left: 10px !important;
    outline: none !important;
  }

  /* Same primary CTA language as desktop */
  .mobile-nav > .btn-primary,
  .mobile-nav .btn-primary {
    width: 100% !important;
    min-height: 52px !important;

    margin: 22px 0 0 !important;
    padding: 14px 20px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;

    background:
      linear-gradient(135deg, #ffb51b 0%, #f29a00 100%) !important;

    border: 1px solid #f29a00 !important;
    border-radius: 12px !important;

    color: #1e1605 !important;

    font-family: var(--font-display) !important;
    font-size: 15px !important;
    font-weight: 750 !important;

    box-shadow:
      0 10px 24px rgba(245,158,11,.22) !important;
  }

  .mobile-nav > .btn-primary:hover,
  .mobile-nav .btn-primary:hover {
    color: #1e1605 !important;
    transform: translateY(-1px) !important;
    box-shadow:
      0 14px 28px rgba(245,158,11,.28) !important;
  }
}

/* Full-width phones */
@media (max-width: 480px) {

  .mobile-nav {
    width: 100% !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .mobile-nav-header {
    height: 76px !important;
    min-height: 76px !important;

    margin-left: -18px !important;
    margin-right: -18px !important;

    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .mobile-nav .brand-logo,
  .mobile-nav-header .brand-logo {
    width: 180px !important;
    max-width: 180px !important;
    max-height: 50px !important;
  }

  .mobile-nav > ul > li > a,
  .mobile-nav > ul > li > button {
    min-height: 55px !important;
  }
}