:root{
    --navy-900:#0A2536;
    --blue-700:#12688A;
    --blue-600:#1C8AB8;
    --blue-500:#2DA5D7;
    --blue-100:#DBF0FA;
    --blue-50:#F1FAFD;
    --bg-wash:#EAF6FA;
    --ink:#10262E;
    --muted:#55707A;
    --line:#DCEAEE;
    --white:#FFFFFF;
    --radius-lg:20px;
    --radius-md:14px;
    --radius-sm:10px;
  }

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

  html{scroll-behavior:smooth;}

  body{
    font-family:'Inter', sans-serif;
    color:var(--ink);
    background:var(--white);
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }

  h1,h2,h3, .display{
    font-family:'Plus Jakarta Sans', sans-serif;
  }

  a{text-decoration:none; color:inherit;}
  ul{list-style:none; margin:0; padding:0;}
  button{font-family:inherit; cursor:pointer; border:none;}
  img{max-width:100%; display:block;}

  .wrap{
    max-width:1320px;
    margin:0 auto;
    padding:0 40px;
  }

  /* ---------- NAV ---------- */
  header{
    position:sticky;
    top:0;
    z-index:100;
    padding:0;
    background:transparent;
  }

  .header-card{
    width:100%;
    margin:0;
    background:rgba(255,255,255,0.92);
    backdrop-filter:blur(10px);
    border:none;
    border-bottom:1px solid var(--line);
    border-radius:0;
    box-shadow:0 8px 24px -18px rgba(10,37,54,0.16);
    overflow:visible;
    transition:box-shadow .3s ease, transform .3s ease;
  }
  header.scrolled .header-card{
    box-shadow:0 16px 36px -14px rgba(10,37,54,0.24);
  }

  nav{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:14px 0;
    position:relative;
  }

  .logo{
    display:flex;
    align-items:center;
    gap:10px;
    flex-shrink:0;
  }
  .logo .mark{
    width:38px; height:38px;
    border-radius:11px;
    background:linear-gradient(145deg, var(--blue-500), var(--blue-700));
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 6px 14px rgba(28,138,184,0.35);
    flex-shrink:0;
  }
  .logo .mark svg{width:20px; height:20px;}
  .logo img{
    height:44px;
    width:auto;
    display:block;
  }

  .nav-links{
    display:flex;
    align-items:center;
    gap:30px;
  }
  .nav-links a{
    font-size:14px;
    font-weight:500;
    color:#374151;
    position:relative;
    padding:6px 0;
    transition:color .2s ease;
    white-space:nowrap;
  }
  .nav-links a:hover{color:var(--blue-600);}
  .nav-links a.active{color:var(--blue-600); font-weight:600;}
  .nav-links a.active::after{
    content:'';
    position:absolute;
    left:0; right:0; bottom:-4px;
    height:2px;
    background:var(--blue-600);
    border-radius:2px;
  }

  /* ---------- Nav mega-menu dropdowns ---------- */
  .nav-item{
    position:static;
  }
  .nav-item > a{
    display:inline-flex;
    align-items:center;
    gap:5px;
    position:relative;
  }
  .nav-item > a::before{
    content:'';
    position:absolute;
    top:100%;
    left:-24px;
    right:-24px;
    height:36px;
    background:transparent;
    pointer-events:none;
  }
  .nav-item:hover > a::before,
  .nav-item.menu-open > a::before{
    pointer-events:auto;
  }
  .nav-item > a .caret{
    width:9px; height:9px;
    transition:transform .2s ease;
  }
  .nav-item:hover > a .caret,
  .nav-item.menu-open > a .caret{transform:rotate(180deg);}

  .mega-panel{
    position:absolute;
    top:100%;
    left:50%;
    transform:translateX(-50%) translateY(10px) scale(.98);
    transform-origin:top center;
    background:var(--white);
    border:1px solid var(--line);
    border-radius:var(--radius-md);
    box-shadow:0 24px 48px -18px rgba(10,37,54,0.28);
    padding:22px 26px;
    display:flex;
    flex-wrap:wrap;
    gap:28px;
    max-width:min(1100px, calc(100vw - 48px));
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .3s cubic-bezier(0.16,1,0.3,1), transform .3s cubic-bezier(0.16,1,0.3,1), visibility .3s;
    z-index:50;
  }
  .nav-item:hover .mega-panel,
  .nav-item.menu-open .mega-panel{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateX(-50%) translateY(0) scale(1);
    transition:opacity .22s cubic-bezier(0.16,1,0.3,1), transform .22s cubic-bezier(0.16,1,0.3,1), visibility .22s;
  }
  .mega-panel.cols-2 .mega-group{flex:0 0 auto; min-width:200px;}
  .mega-panel.cols-6{
    width:100%;
    max-width:none;
    justify-content:space-between;
  }
  .mega-panel.cols-6 .mega-group{flex:1 1 0; min-width:150px;}
  .mega-panel.cols-6 .mega-heading{white-space:normal;}
  .mega-panel.cols-6 .mega-group ul li a{white-space:normal;}

  .mega-group{
    min-width:170px;
  }
  .mega-group .mega-heading{
    display:block;
    font-family:'Plus Jakarta Sans', sans-serif;
    font-size:12.5px;
    font-weight:700;
    color:var(--navy-900);
    text-transform:uppercase;
    letter-spacing:0.4px;
    padding-bottom:8px;
    margin-bottom:8px;
    border-bottom:1px solid var(--line);
    white-space:nowrap;
  }
  .mega-group ul{
    display:flex;
    flex-direction:column;
    gap:2px;
  }
  .mega-group ul li a{
    display:block;
    padding:7px 8px;
    margin:0 -8px;
    border-radius:8px;
    font-size:13.5px;
    font-weight:500;
    color:var(--muted);
    white-space:nowrap;
    transition:background .15s ease, color .15s ease;
  }
  .mega-group ul li a:hover{
    background:var(--blue-50);
    color:var(--blue-700);
  }
  .mega-group.single .mega-heading{
    border-bottom:none;
    padding-bottom:0;
    margin-bottom:0;
  }
  a.mega-heading{transition:color .15s ease;}
  a.mega-heading:hover{color:var(--blue-600);}

  /* ---------- Nested submenu (e.g. Nose procedures) inside a mega-group ---------- */
  .mega-group li.has-submenu{position:relative;}
  .mega-group li.has-submenu > a{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:6px;
  }
  .mega-group li.has-submenu > a .submenu-caret{
    width:8px; height:8px;
    flex-shrink:0;
    stroke:var(--muted);
    transition:transform .2s ease, stroke .2s ease;
  }
  .mega-group li.has-submenu.open > a .submenu-caret{
    transform:rotate(180deg);
    stroke:var(--blue-600);
  }
  .submenu-list{
    list-style:none;
    display:flex;
    flex-direction:column;
    gap:2px;
    max-height:0;
    overflow:hidden;
    margin:0 0 0 8px;
    padding-left:12px;
    border-left:2px solid var(--blue-100);
    transition:max-height .3s cubic-bezier(0.16,1,0.3,1);
  }
  .mega-group li.has-submenu.open .submenu-list{max-height:480px;}
  .mega-group ul.submenu-list li a{font-size:12.5px; padding:6px 8px; white-space:normal; line-height:1.35;}

  .nav-right{
    display:flex;
    align-items:center;
    gap:18px;
    flex-shrink:0;
  }

  .nav-phone{
    display:flex;
    align-items:center;
    gap:10px;
    padding-right:18px;
    border-right:1px solid var(--line);
  }
  .nav-phone .ic{
    width:36px; height:36px;
    border-radius:50%;
    background:var(--blue-100);
    display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
  }
  .nav-phone .ic svg{width:16px; height:16px; stroke:var(--blue-700);}
  .nav-phone .txt{line-height:1.3;}
  .nav-phone .num{
    font-size:13.5px;
    font-weight:700;
    color:var(--navy-900);
    white-space:nowrap;
  }
  .nav-phone .sub{
    font-size:11px;
    color:var(--muted);
    white-space:nowrap;
  }

  .nav-cta{
    display:flex;
    align-items:center;
    gap:8px;
    background:linear-gradient(135deg, var(--blue-600), var(--blue-700));
    color:#fff;
    padding:12px 22px;
    border-radius:999px;
    font-size:14px;
    font-weight:600;
    box-shadow:0 8px 20px rgba(18,104,138,0.32);
    transition:transform .2s ease, box-shadow .2s ease;
    white-space:nowrap;
  }
  .nav-cta:hover{transform:translateY(-2px); box-shadow:0 12px 26px rgba(18,104,138,0.4);}
  .nav-cta svg{width:15px; height:15px;}

  .burger{display:none; flex-direction:column; gap:5px; background:none; padding:4px;}
  .burger span{width:24px; height:2px; background:var(--ink); border-radius:2px; transition:.25s;}

  /* ---------- HERO ---------- */
  .hero{
    position:relative;
    padding:64px 0 96px;
    overflow:hidden;
    background:var(--navy-900);
    isolation:isolate;
  }

  /* cinematic video background */
  .hero-media{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    overflow:hidden;
    z-index:0;
  }
  .hero-video{
    position:absolute;
    top:50%;
    left:50%;
    min-width:100%;
    min-height:100%;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center 42%;
    transform:translate(-50%,-50%);
    opacity:0;
    transition:opacity 1.4s ease;
  }
  .hero-video.is-ready{
    opacity:1;
  }
  .hero-overlay{
    position:absolute;
    inset:0;
    background:
      linear-gradient(100deg, rgba(6,20,32,0.72) 0%, rgba(6,20,32,0.5) 32%, rgba(6,20,32,0.28) 58%, rgba(6,20,32,0.16) 100%),
      linear-gradient(0deg, rgba(6,20,32,0.35) 0%, rgba(6,20,32,0) 30%);
  }

  .hero-grid{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    min-height:552px;
    padding-bottom:0;
  }

  .eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:var(--blue-100);
    color:var(--blue-700);
    font-size:13px;
    font-weight:600;
    padding:9px 16px 9px 12px;
    border-radius:999px;
    margin-bottom:22px;
  }
  .eyebrow svg{width:16px; height:16px;}

  .hero-copy{
    max-width:600px;
    opacity:0;
    transform:translateY(16px);
    animation:heroFadeIn 1s ease 0.15s forwards;
  }

  @keyframes heroFadeIn{
    to{ opacity:1; transform:translateY(0); }
  }

  .hero-copy h1{
    font-size:47px;
    line-height:1.14;
    font-weight:800;
    letter-spacing:-0.5px;
    color:#ffffff;
    margin-bottom:20px;
    text-shadow:0 4px 24px rgba(0,0,0,0.35);
  }
  .hero-copy h1 .accent{
    color:#6FD6F2;
  }

  .hero-copy p.lead{
    font-size:16px;
    line-height:1.7;
    color:rgba(255,255,255,0.86);
    max-width:460px;
    margin-bottom:32px;
    text-shadow:0 2px 12px rgba(0,0,0,0.3);
  }

  .hero-actions{
    display:flex;
    align-items:center;
    gap:14px;
    margin-bottom:56px;
  }

  .btn{
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:15px 26px;
    border-radius:12px;
    font-size:14.5px;
    font-weight:600;
    white-space:nowrap;
    transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
  }
  .btn svg{width:16px; height:16px; transition:transform .2s ease;}
  .btn-primary{
    background:linear-gradient(135deg, var(--blue-600), var(--blue-700));
    color:#fff;
    box-shadow:0 10px 24px rgba(18,104,138,0.3);
  }
  .btn-primary:hover{transform:translateY(-2px); box-shadow:0 14px 30px rgba(18,104,138,0.4);}
  .btn-primary:hover svg{transform:translateX(3px);}
  .btn-outline{
    background:#fff;
    color:var(--blue-700);
    border:1.5px solid var(--blue-100);
  }
  .btn-outline:hover{border-color:var(--blue-500); background:var(--blue-50);}

  /* ---------- STATS BAR ---------- */
  .stats-wrap{
    position:relative;
    margin-top:-46px;
    margin-bottom:0;
    z-index:5;
  }
  .stats-bar{
    background:#fff;
    border:1px solid var(--line);
    border-radius:20px;
    box-shadow:0 24px 50px -18px rgba(10,37,54,0.18);
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    padding:30px 10px;
  }
  .stat{
    display:flex;
    align-items:center;
    gap:16px;
    padding:0 26px;
    border-right:1px solid var(--line);
    transition:transform .2s ease;
  }
  .stat > span:last-child{min-width:0;}
  .stat:hover{transform:translateY(-2px);}
  .stat:last-child{border-right:none;}
  .stat .ic{
    width:48px; height:48px;
    border-radius:14px;
    background:linear-gradient(150deg, var(--blue-500), var(--blue-700));
    display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
    box-shadow:0 12px 22px -10px rgba(18,104,138,0.48);
  }
  .stat .ic svg{width:22px; height:22px; stroke:#fff;}
  .stat .num{
    font-size:23px;
    font-weight:800;
    color:var(--navy-900);
    font-family:'Plus Jakarta Sans', sans-serif;
    line-height:1.1;
    letter-spacing:-.3px;
  }
  .stat .lbl{
    font-size:12.5px;
    color:var(--muted);
    font-weight:600;
    margin-top:3px;
  }

  /* ---------- RESPONSIVE ---------- */
  @media (max-width: 1080px){
    .hero-copy p.lead{max-width:100%;}
    .nav-links{display:none;}
    .burger{display:flex;}
    .nav-phone{display:none;}
  }

  @media (max-width: 900px){
    .hero-grid{min-height:460px;}
    .hero-video{object-position:center 38%;}
  }

  @media (max-width: 720px){
    .wrap{padding:0 22px;}
    header{padding:12px 14px 0;}
    nav{padding:9px 9px 9px 16px;}
    .hero{padding-top:34px;}
    .hero-grid{min-height:420px;}
    .hero-video{object-position:38% center;}
    .hero-copy h1{font-size:33px;}
    .eyebrow{font-size:12px;}
    .hero-actions{flex-direction:column; align-items:stretch; gap:12px;}
    .btn{justify-content:center;}
    .stats-bar{grid-template-columns:repeat(2, 1fr); gap:22px 0; border-radius:18px;}
    .stat{border-right:none; padding:0 14px; gap:10px; min-width:0;}
    .stat .ic{width:38px; height:38px; border-radius:11px;}
    .stat .ic svg{width:18px; height:18px;}
    .stat .num{font-size:18px;}
    .stat .lbl{font-size:11.5px;}
    .stats-wrap{margin-top:36px;}
    .nav-cta span{display:none;}
    .nav-cta{padding:11px 14px;}
  }


  /* ---------- SERVICES SECTION ---------- */
  :root{
    --teal-600:#1C5F68;
    --teal-500:#2B7680;
    --teal-100:#DCEEEE;
  }
  .services{
    background:#FFFFFF;
    padding:70px 0 80px;
  }
  .services-head{
    text-align:center;
    max-width:640px;
    margin:0 auto 48px;
  }
  .services-head h2{
    font-size:32px;
    font-weight:800;
    color:var(--navy-900);
    letter-spacing:-0.3px;
    margin-bottom:12px;
  }
  .services-head h2 .accent-teal{color:var(--teal-600);}
  .services-head p{
    font-size:15px;
    color:var(--muted);
  }

  .services-carousel-wrap{
    position:relative;
  }

  .services-grid{
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:calc((100% - 4*22px)/5);
    gap:22px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    padding-bottom:4px;
  }
  .services-grid::-webkit-scrollbar{display:none;}

  .service-card{
    scroll-snap-align:start;
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    overflow:hidden;
    box-shadow:0 10px 26px -16px rgba(10,37,54,0.18);
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .service-card:hover{
    transform:translateY(-6px);
    box-shadow:0 20px 36px -16px rgba(10,37,54,0.26);
  }
  .service-card .thumb{
    aspect-ratio:5/4;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .service-card .thumb svg{width:100%; height:100%; display:block;}
  .service-card .thumb svg.svc-icon{width:34%; height:34%; min-width:44px; min-height:44px;}
  .service-card .thumb img{width:100%; height:100%; object-fit:cover; display:block;}

  .service-card .body{
    padding:16px 16px 20px;
    position:relative;
  }
  .service-card h3{
    font-size:15.5px;
    font-weight:700;
    color:var(--navy-900);
    margin-bottom:6px;
  }
  .service-card p{
    font-size:12.5px;
    line-height:1.55;
    color:var(--muted);
    max-width:80%;
  }
  .service-card .arrow{
    position:absolute;
    right:16px;
    bottom:18px;
    width:34px; height:34px;
    border-radius:50%;
    background:var(--teal-600);
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 8px 16px rgba(28,95,104,0.35);
    transition:transform .2s ease, background .2s ease;
  }
  .service-card .arrow svg{width:15px; height:15px;}
  .service-card:hover .arrow{background:var(--teal-500); transform:scale(1.08);}

  .services-carousel-wrap .carousel-btn.prev{left:-19px;}
  .services-carousel-wrap .carousel-btn.next{right:-19px;}

  @media (max-width: 1080px){
    .services-grid{grid-auto-columns:calc((100% - 2*22px)/3);}
    .services-carousel-wrap .carousel-btn.prev{left:2px;}
    .services-carousel-wrap .carousel-btn.next{right:2px;}
  }
  @media (max-width: 720px){
    .services{padding:50px 0 60px;}
    .services-head h2{font-size:24px;}
    .services-grid{grid-auto-columns:calc((100% - 16px)/2); gap:16px;}
    .service-card p{max-width:100%; padding-right:44px;}
  }
  @media (max-width: 460px){
    .services-grid{grid-auto-columns:100%;}
  }

  /* ---------- DOCTORS SECTION ---------- */
  .doctors{
    padding:0;
  }
  .doctors-panel{
    position:relative;
    background:linear-gradient(120deg, #EAF6FA 0%, #E0F1F7 55%, #EAF6FA 100%);
    border-radius:28px;
    padding:56px 60px;
    overflow:hidden;
  }
  .doctors-panel::before{
    content:'';
    position:absolute;
    top:-100px; right:-100px;
    width:320px; height:320px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(45,165,215,0.14), transparent 70%);
  }

  .doctors-grid{
    display:grid;
    /* Side-by-side on desktop: narrow copy column, carousel takes the
       rest. The carousel itself switches to a static 4-column grid at
       this width (see .doctors-track below) so all 4 cards always fit
       exactly, however wide that remaining space is — no more relying
       on a minimum pixel width for the old auto-scroll math. */
    grid-template-columns:minmax(240px, 300px) 1fr;
    gap:40px;
    align-items:start;
    position:relative;
    z-index:2;
  }
  /* Prevent the horizontally-scrolling doctor carousel's intrinsic content
     width from forcing its grid track (and the sibling copy column, once
     they share a single 1fr column on narrow screens) to overflow. */
  .doctors-grid > *{
    min-width:0;
  }

  .doctors-copy h2{
    font-size:29px;
    font-weight:800;
    line-height:1.25;
    color:var(--navy-900);
    letter-spacing:-0.2px;
    margin:18px 0 14px;
  }
  .doctors-copy p{
    font-size:14.5px;
    line-height:1.7;
    color:var(--muted);
    max-width:320px;
    margin-bottom:26px;
  }

  .doctors-carousel-wrap{
    position:relative;
  }

  /* Same horizontally-scrolling carousel pattern as .services-grid.
     On desktop the 4 columns exactly fill the row (no overflow), so the
     JS auto-hides the prev/next arrows and the result is pixel-identical
     to the old static 4-column grid. At the tablet/mobile breakpoints
     below, grid-auto-columns is narrowed so only 2 (tablet) or 1
     (mobile) card fits per view — the rest becomes swipeable/scrollable,
     with the same reusable initCarousel() JS driving the arrows. */
  .doctors-track{
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:calc((100% - 3*20px)/4);
    gap:20px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    padding-bottom:4px;
  }
  .doctors-track::-webkit-scrollbar{display:none;}

  .doctors-carousel-wrap .carousel-btn.prev{left:-19px;}
  .doctors-carousel-wrap .carousel-btn.next{right:-19px;}

  .doctor-card{
    scroll-snap-align:start;
    background:#fff;
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 16px 34px -18px rgba(10,37,54,0.28);
  }
  .doctor-card .photo{
    aspect-ratio:1/1;
    background:#EAF6F9;
  }
  .doctor-card .photo svg{width:100%; height:100%; display:block;}
  .doctor-card .photo img{width:100%; height:100%; display:block; object-fit:cover;}
  .doctor-card .info{
    padding:16px 14px 18px;
    text-align:center;
  }
  .doctor-card .info h4{
    font-size:14px;
    font-weight:700;
    color:var(--navy-900);
    margin-bottom:3px;
  }
  .doctor-card .info .spec{
    font-size:12px;
    color:var(--muted);
    margin-bottom:8px;
  }
  .doctor-card .info .qual{
    font-size:10.5px;
    line-height:1.5;
    color:var(--muted);
    font-weight:500;
    display:block;
    margin-top:6px;
    text-align:left;
  }
  .doctor-card .info .rating{
    display:inline-flex;
    align-items:center;
    gap:5px;
    font-size:12.5px;
    font-weight:700;
    color:var(--navy-900);
  }
  .doctor-card .info .rating svg{width:14px; height:14px;}

  .carousel-btn{
    position:absolute;
    top:50%;
    translate:0 -50%;
    width:38px; height:38px;
    border-radius:50%;
    background:#fff;
    border:1px solid var(--line);
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 10px 22px rgba(10,37,54,0.16);
    z-index:5;
    cursor:pointer;
    transition:background .2s ease, transform .2s ease;
  }
  .carousel-btn:hover{background:var(--blue-50); transform:scale(1.06);}
  .carousel-btn svg{width:16px; height:16px; stroke:var(--blue-700);}
  .carousel-btn[hidden]{display:none;}
  .carousel-btn.prev{left:-19px;}
  .carousel-btn.next{right:-19px;}

  @media (max-width: 1080px){
    .doctors-grid{grid-template-columns:1fr; gap:32px;}
    .doctors-copy p{max-width:100%;}
    .doctors-panel{padding:44px 26px;}
    /* Tablet: exactly 2 doctor cards per view, same spacing between
       them; the other 2 become reachable via swipe or the arrows. */
    .doctors-track{grid-auto-columns:calc((100% - 20px)/2);}
    .doctors-carousel-wrap .carousel-btn.prev{left:2px;}
    .doctors-carousel-wrap .carousel-btn.next{right:2px;}
  }
  @media (max-width: 720px){
    .doctors{padding:0;}
    .doctors-panel{border-radius:22px; padding:36px 18px;}
    .doctors-copy h2{font-size:23px;}
  }
  @media (max-width: 480px){
    /* Mobile: exactly 1 doctor card per view, full-width, swipeable —
       same pattern as .services-grid's single-card breakpoint. */
    .doctors-track{grid-auto-columns:100%;}
  }

  /* ---------- APPOINTMENT SECTION ---------- */
  .appointment{
    position:relative;
    padding:70px 0 80px;
    background:linear-gradient(180deg, #ffffff 0%, var(--bg-wash) 100%);
    overflow:hidden;
  }
  .appointment-decor{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
  }
  .appointment-decor.one{
    top:-160px; left:-140px;
    width:460px; height:460px;
    background:radial-gradient(circle, rgba(45,165,215,0.13), transparent 70%);
  }
  .appointment-decor.two{
    bottom:-140px; right:-120px;
    width:400px; height:400px;
    background:radial-gradient(circle, rgba(43,118,128,0.12), transparent 70%);
  }

  .appointment-grid{
    display:grid;
    grid-template-columns:1fr 0.92fr;
    gap:76px;
    align-items:start;
    position:relative;
    z-index:2;
  }

  /* --- left: copy --- */
  .appointment-copy{position:relative;}

  .appointment-copy .eyebrow{
    margin-bottom:26px;
    box-shadow:0 8px 20px -10px rgba(18,104,138,0.45);
  }

  .appointment-copy h2{
    font-size:42px;
    line-height:1.18;
    font-weight:800;
    letter-spacing:-0.6px;
    color:var(--navy-900);
    margin-bottom:22px;
    max-width:480px;
  }
  .appointment-copy h2 .accent{
    background:linear-gradient(100deg, var(--blue-700) 0%, var(--blue-500) 55%, var(--blue-600) 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }

  .appointment-copy p.lead{
    position:relative;
    font-size:16px;
    line-height:1.8;
    color:var(--muted);
    max-width:460px;
    margin-bottom:40px;
    padding-left:22px;
    border-left:3px solid transparent;
    border-image:linear-gradient(180deg, var(--blue-500), var(--blue-100)) 1;
  }

  .appointment-points{
    position:relative;
    display:flex;
    flex-direction:column;
    gap:26px;
    margin-bottom:42px;
    counter-reset:apStep;
  }
  .appointment-points::before{
    content:'';
    position:absolute;
    left:21px; top:8px; bottom:8px;
    width:2px;
    background:linear-gradient(180deg, var(--blue-500) 0%, var(--blue-100) 75%, transparent 100%);
    opacity:.55;
  }
  .appointment-points li{
    position:relative;
    display:flex;
    gap:18px;
    align-items:flex-start;
  }
  .appointment-points li:not(:last-child){padding-bottom:2px;}
  .appointment-points .ic{
    position:relative;
    width:44px; height:44px;
    border-radius:13px;
    background:linear-gradient(150deg, var(--blue-500), var(--blue-700));
    display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
    box-shadow:0 12px 22px -10px rgba(18,104,138,0.5);
    transition:transform .25s ease, box-shadow .25s ease;
    z-index:1;
  }
  .appointment-points li:hover .ic{
    transform:translateY(-3px) scale(1.04);
    box-shadow:0 16px 28px -10px rgba(18,104,138,0.58);
  }
  .appointment-points .ic svg{width:19px; height:19px; stroke:#fff;}
  .appointment-points h4{
    font-size:15px;
    font-weight:700;
    letter-spacing:-0.1px;
    color:var(--navy-900);
    margin-bottom:4px;
    padding-top:4px;
  }
  .appointment-points p{
    font-size:13.5px;
    line-height:1.65;
    color:var(--muted);
    max-width:340px;
  }

  /* --- right: form card --- */
  .appointment-form-card{
    position:relative;
    background:#fff;
    border-radius:var(--radius-lg);
    padding:46px 42px 42px;
    border:1px solid var(--line);
    box-shadow:0 46px 90px -32px rgba(10,37,54,0.38);
  }
  .appointment-form-card::before{
    content:'';
    position:absolute;
    inset:0;
    border-radius:inherit;
    padding:1.5px;
    background:linear-gradient(135deg, rgba(45,165,215,0.4), rgba(43,118,128,0.28) 55%, rgba(45,165,215,0.1));
    -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite:xor;
    mask-composite:exclude;
    pointer-events:none;
  }

  .form-badge{
    display:inline-flex;
    align-items:center;
    gap:7px;
    background:var(--teal-100);
    color:var(--teal-600);
    font-size:12px;
    font-weight:700;
    padding:8px 14px;
    border-radius:999px;
    margin-bottom:22px;
  }
  .form-badge svg{width:13px; height:13px; animation:pulseTick 2.4s ease-in-out infinite;}
  @keyframes pulseTick{
    0%,100%{transform:scale(1);}
    50%{transform:scale(1.15);}
  }

  .appointment-form-card h3{
    font-size:23px;
    font-weight:800;
    letter-spacing:-0.2px;
    color:var(--navy-900);
    margin-bottom:8px;
  }
  .appointment-form-card > p{
    font-size:13.5px;
    line-height:1.6;
    color:var(--muted);
    margin-bottom:30px;
    max-width:400px;
  }

  .appt-form{
    display:flex;
    flex-direction:column;
    gap:18px;
    position:relative;
    z-index:2;
  }
  .form-row.two{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
  }
  .field{
    display:flex;
    flex-direction:column;
    gap:7px;
  }
  .field label{
    font-size:12.5px;
    font-weight:600;
    color:var(--navy-900);
  }
  .field input,
  .field select,
  .field textarea{
    font-family:'Inter', sans-serif;
    font-size:13.5px;
    color:var(--ink);
    padding:13px 15px;
    border-radius:11px;
    border:1.5px solid var(--line);
    background:var(--blue-50);
    outline:none;
    width:100%;
    transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
  }
  .field select{
    appearance:none;
    -webkit-appearance:none;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235B6478' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>");
    background-repeat:no-repeat;
    background-position:right 14px center;
    background-size:16px 16px;
    padding-right:38px;
  }
  .field textarea{
    resize:vertical;
    min-height:90px;
    font-family:inherit;
  }
  .field input::placeholder,
  .field textarea::placeholder{color:#9AA2B5;}
  .field input:focus,
  .field select:focus,
  .field textarea:focus{
    border-color:var(--blue-500);
    background:#fff;
    box-shadow:0 0 0 4px rgba(45,165,215,0.14);
  }

  .btn-block{
    width:100%;
    justify-content:center;
    margin-top:6px;
    padding:16px 26px;
  }

  .form-note{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    font-size:11.5px;
    color:var(--muted);
    margin-top:2px;
  }
  .form-note svg{width:13px; height:13px; stroke:var(--muted); flex-shrink:0;}

  @media (max-width:1080px){
    .appointment-grid{grid-template-columns:1fr; gap:52px;}
    .appointment-copy p.lead{max-width:100%;}
    .appointment-form-card{max-width:560px; margin:0 auto;}
  }
  @media (max-width:720px){
    .appointment{padding:50px 0 60px;}
    .appointment-copy h2{font-size:29px; max-width:100%;}
    .appointment-form-card{padding:32px 22px 28px;}
    .form-row.two{grid-template-columns:1fr;}
    .appointment-points{gap:20px;}
    .appointment-points p{max-width:100%;}
  }

  /* ---------- FOOTER ---------- */
  .site-footer{
    position:relative;
    background:linear-gradient(180deg, var(--navy-900) 0%, #051620 100%);
    padding:1px 0 34px;
  }
  .site-footer::before{
    content:'';
    position:absolute;
    top:0; left:0; right:0;
    height:280px;
    background:radial-gradient(900px 280px at 50% 0%, rgba(45,165,215,0.16), transparent 70%);
    pointer-events:none;
  }

  .footer-top{
    padding:80px 0 60px;
    display:grid;
    grid-template-columns:1.3fr 0.85fr 0.85fr 1.1fr;
    gap:40px;
    position:relative;
    z-index:2;
  }

  .footer-brand .logo{margin-bottom:20px;}
  .footer-brand .logo img{height:40px;}
  .footer-brand .logo .footer-logo-img{height:46px; width:auto; display:block;}

  .footer-tagline{
    font-size:14px;
    line-height:1.75;
    color:rgba(255,255,255,0.56);
    max-width:300px;
    margin-bottom:26px;
  }

  .footer-trust{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:28px;
  }
  .footer-trust span{
    display:inline-flex;
    align-items:center;
    gap:7px;
    font-size:11.5px;
    font-weight:600;
    color:rgba(255,255,255,0.75);
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.1);
    padding:7px 13px;
    border-radius:999px;
  }
  .footer-trust span svg{width:13px; height:13px; stroke:var(--blue-500); flex-shrink:0;}

  .footer-social{
    display:flex;
    gap:10px;
  }
  .footer-social a{
    width:38px; height:38px;
    border-radius:50%;
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.12);
    display:flex; align-items:center; justify-content:center;
    transition:background .25s ease, transform .25s ease, border-color .25s ease;
  }
  .footer-social a svg{width:16px; height:16px; stroke:rgba(255,255,255,0.8); transition:stroke .25s ease;}
  .footer-social a:hover{
    background:linear-gradient(135deg, var(--blue-500), var(--teal-500));
    border-color:transparent;
    transform:translateY(-3px);
  }
  .footer-social a:hover svg{stroke:#fff;}

  .footer-col h4{
    font-size:13px;
    font-weight:700;
    letter-spacing:.4px;
    text-transform:uppercase;
    color:#fff;
    margin-bottom:22px;
  }
  .footer-col ul{
    display:flex;
    flex-direction:column;
    gap:14px;
  }
  .footer-col ul a{
    font-size:14px;
    color:rgba(255,255,255,0.56);
    position:relative;
    transition:color .2s ease, padding-left .2s ease;
  }
  .footer-col ul a::before{
    content:'';
    position:absolute;
    left:-16px; top:50%;
    translate:0 -50%;
    width:0;
    height:1.5px;
    background:var(--blue-500);
    transition:width .2s ease;
  }
  .footer-col ul a:hover{color:#fff; padding-left:16px;}
  .footer-col ul a:hover::before{width:10px;}

  .footer-contact-list li{
    display:flex;
    align-items:flex-start;
    gap:12px;
  }
  .footer-contact-list .ic{
    width:34px; height:34px;
    border-radius:10px;
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.1);
    display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
  }
  .footer-contact-list .ic svg{width:15px; height:15px; stroke:var(--blue-500);}
  .footer-contact-list .txt{
    font-size:13.5px;
    line-height:1.55;
    color:rgba(255,255,255,0.7);
    padding-top:6px;
  }
  .footer-contact-list .txt strong{
    display:block;
    font-size:11px;
    font-weight:600;
    letter-spacing:.3px;
    text-transform:uppercase;
    color:rgba(255,255,255,0.4);
    margin-bottom:3px;
  }

  /* Light-background variant, for use outside the dark footer (e.g. Contact page).
     Also supplies its own flex layout, since .footer-col ul normally provides
     that but this list isn't nested inside .footer-col here. */
  .contact-list-light{
    display:flex;
    flex-direction:column;
    gap:26px;
  }
  .contact-list-light li{gap:16px;}
  .contact-list-light .ic{
    width:44px; height:44px;
    border-radius:12px;
    background:var(--blue-50);
    border:1px solid var(--line);
  }
  .contact-list-light .ic svg{width:19px; height:19px;}
  .contact-list-light .txt{
    color:var(--ink);
    font-size:15px;
    line-height:1.6;
    padding-top:2px;
  }
  .contact-list-light .txt strong{
    color:var(--muted);
    font-size:11.5px;
    margin-bottom:5px;
  }

  /* ---------- VISIT US PANEL (Sitemap page) ---------- */
  .visit-us-panel{
    position:relative;
    background:linear-gradient(180deg, #ffffff 0%, var(--bg-wash) 100%);
    border:1px solid var(--line);
    border-radius:28px;
    padding:52px;
    overflow:hidden;
    box-shadow:0 30px 70px -40px rgba(10,37,54,0.35);
  }
  .visit-us-decor{position:absolute; border-radius:50%; pointer-events:none;}
  .visit-us-decor.one{top:-160px; left:-140px; width:420px; height:420px; background:radial-gradient(circle, rgba(45,165,215,0.14), transparent 70%);}
  .visit-us-decor.two{bottom:-140px; right:-120px; width:380px; height:380px; background:radial-gradient(circle, rgba(43,118,128,0.12), transparent 70%);}

  .visit-us-inner{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:1fr 1.05fr;
    gap:56px;
    align-items:stretch;
  }
  .visit-us-copy{display:flex; flex-direction:column;}
  .visit-us-copy h2{
    font-size:32px;
    font-weight:800;
    color:var(--navy-900);
    letter-spacing:-0.01em;
    margin-bottom:10px;
  }
  .visit-us-copy > p{
    font-size:14.5px;
    color:var(--muted);
    line-height:1.7;
    margin-bottom:30px;
    max-width:420px;
  }

  .visit-us-contact{
    position:relative;
    display:flex;
    flex-direction:column;
    gap:24px;
    margin-bottom:34px;
  }
  .visit-us-contact::before{
    content:'';
    position:absolute;
    left:23px; top:8px; bottom:8px;
    width:2px;
    background:linear-gradient(180deg, var(--blue-500) 0%, var(--blue-100) 75%, transparent 100%);
    opacity:.55;
  }
  .visit-us-contact li{
    position:relative;
    display:flex;
    gap:18px;
    align-items:flex-start;
  }
  .visit-us-contact .ic{
    position:relative;
    width:48px; height:48px;
    border-radius:14px;
    background:linear-gradient(150deg, var(--blue-500), var(--blue-700));
    display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
    box-shadow:0 12px 22px -10px rgba(18,104,138,0.5);
    transition:transform .25s ease, box-shadow .25s ease;
    z-index:1;
  }
  .visit-us-contact li:hover .ic{
    transform:translateY(-3px) scale(1.04);
    box-shadow:0 16px 28px -10px rgba(18,104,138,0.58);
  }
  .visit-us-contact .ic svg{width:20px; height:20px; stroke:#fff;}
  .visit-us-contact .txt{padding-top:8px;}
  .visit-us-contact .txt strong{
    display:block;
    font-size:11px;
    font-weight:700;
    letter-spacing:.4px;
    text-transform:uppercase;
    color:var(--blue-600);
    margin-bottom:4px;
  }
  .visit-us-contact .txt span{
    font-size:14.5px;
    font-weight:600;
    color:var(--navy-900);
    line-height:1.55;
    display:block;
  }

  .visit-us-map{
    position:relative;
    border-radius:20px;
    overflow:hidden;
    border:1px solid var(--line);
    box-shadow:0 20px 44px -20px rgba(10,37,54,0.32);
    min-height:320px;
  }
  .visit-us-map iframe{
    width:100%; height:100%;
    min-height:320px;
    border:0;
    display:block;
  }
  .visit-us-map-tag{
    position:absolute;
    top:16px; left:16px;
    z-index:2;
    display:inline-flex;
    align-items:center;
    gap:6px;
    background:rgba(255,255,255,0.94);
    backdrop-filter:blur(6px);
    padding:8px 14px 8px 10px;
    border-radius:999px;
    font-size:12.5px;
    font-weight:700;
    color:var(--navy-900);
    box-shadow:0 8px 20px -8px rgba(10,37,54,0.35);
  }
  .visit-us-map-tag svg{width:15px; height:15px; stroke:var(--blue-600);}

  @media (max-width:860px){
    .visit-us-panel{padding:34px 22px;}
    .visit-us-inner{grid-template-columns:1fr; gap:36px;}
    .visit-us-map{min-height:280px;}
    .visit-us-map iframe{min-height:280px;}
  }

  /* ---------- RESOURCE CARDS (Blog & Resources page) ---------- */
  .resource-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    padding:26px 22px 24px;
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  }
  .resource-card:hover{
    transform:translateY(-4px);
    box-shadow:0 22px 44px -24px rgba(10,37,54,0.3);
    border-color:transparent;
  }
  .resource-card .ic{
    width:48px; height:48px;
    border-radius:14px;
    display:flex; align-items:center; justify-content:center;
    margin-bottom:18px;
  }
  .resource-card .ic svg{width:22px; height:22px;}
  .resource-card h3{
    font-size:16px;
    font-weight:800;
    color:var(--navy-900);
    margin-bottom:8px;
    letter-spacing:-0.01em;
  }
  .resource-card p{
    font-size:13.5px;
    color:var(--muted);
    line-height:1.65;
  }

  /* ---------- RESOURCE CTA PANEL (Blog & Resources page) ---------- */
  .resource-cta-panel{
    position:relative;
    background:linear-gradient(180deg, #ffffff 0%, var(--bg-wash) 100%);
    border:1px solid var(--line);
    border-radius:28px;
    padding:56px 40px;
    overflow:hidden;
    text-align:center;
    box-shadow:0 30px 70px -40px rgba(10,37,54,0.35);
  }
  .resource-cta-panel .visit-us-decor{position:absolute; border-radius:50%; pointer-events:none;}
  .resource-cta-panel .visit-us-decor.one{top:-140px; left:-120px; width:360px; height:360px; background:radial-gradient(circle, rgba(45,165,215,0.14), transparent 70%);}
  .resource-cta-panel .visit-us-decor.two{bottom:-140px; right:-120px; width:340px; height:340px; background:radial-gradient(circle, rgba(43,118,128,0.12), transparent 70%);}
  .resource-cta-panel > *{position:relative; z-index:2;}
  .resource-cta-panel .ic-badge{
    width:56px; height:56px;
    border-radius:16px;
    background:linear-gradient(150deg, var(--blue-500), var(--blue-700));
    display:flex; align-items:center; justify-content:center;
    margin:0 auto 20px;
    box-shadow:0 14px 26px -10px rgba(18,104,138,0.5);
  }
  .resource-cta-panel .ic-badge svg{width:24px; height:24px; stroke:#fff;}
  .resource-cta-panel h3{
    font-size:23px;
    font-weight:800;
    color:var(--navy-900);
    margin-bottom:12px;
    letter-spacing:-0.01em;
  }
  .resource-cta-panel p{
    color:var(--muted);
    font-size:14.5px;
    line-height:1.75;
    max-width:520px;
    margin:0 auto 28px;
  }
  .resource-cta-panel .cta-actions{
    display:flex;
    gap:14px;
    justify-content:center;
    flex-wrap:wrap;
  }
  @media (max-width:640px){
    .resource-cta-panel{padding:40px 24px;}
  }

  .footer-divider{
    height:1px;
    background:rgba(255,255,255,0.08);
  }

  .footer-bottom{
    padding-top:26px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:16px;
    position:relative;
    z-index:2;
  }
  .footer-bottom .copyright{
    font-size:12.5px;
    color:rgba(255,255,255,0.4);
  }
  .footer-bottom .copyright a{
    color:rgba(255,255,255,0.6);
    font-weight:700;
    text-decoration:none;
    transition:color .2s ease;
  }
  .footer-bottom .copyright a:hover{color:#fff;}
  .footer-legal{
    display:flex;
    gap:26px;
  }
  .footer-legal a{
    font-size:12.5px;
    color:rgba(255,255,255,0.5);
    transition:color .2s ease;
  }
  .footer-legal a:hover{color:#fff;}

  @media (max-width:1080px){
    .footer-top{grid-template-columns:1fr 1fr; gap:44px 32px;}
    .footer-brand{grid-column:1 / -1;}
  }
  @media (max-width:720px){
    .footer-top{grid-template-columns:1fr; padding:56px 0 44px; gap:38px;}
    .footer-bottom{flex-direction:column; align-items:flex-start;}
    .footer-bottom .copyright{align-self:center; text-align:center; width:100%;}
    .footer-legal{gap:18px; flex-wrap:wrap;}
  }

  /* ---------- BLOG / INSIGHTS ---------- */
  .insights{
    padding:70px 0 80px;
    background:#fff;
    position:relative;
  }

  .insights-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:32px;
    margin-bottom:56px;
  }
  .insights-head .copy{max-width:620px;}
  .insights-head .eyebrow{margin-bottom:18px;}
  .insights-head h2{
    font-size:38px;
    line-height:1.2;
    font-weight:800;
    letter-spacing:-0.4px;
    color:var(--navy-900);
    margin-bottom:14px;
  }
  .insights-head h2 .accent{color:var(--blue-600);}
  .insights-head p{
    font-size:15.5px;
    line-height:1.7;
    color:var(--muted);
  }
  .insights-viewall{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-size:14px;
    font-weight:700;
    color:var(--blue-700);
    white-space:nowrap;
    padding-bottom:4px;
    flex-shrink:0;
    position:relative;
  }
  .insights-viewall::after{
    content:'';
    position:absolute;
    left:0; bottom:0;
    width:100%;
    height:1.5px;
    background:var(--blue-700);
    transform:scaleX(0);
    transform-origin:right;
    transition:transform .3s ease;
  }
  .insights-viewall:hover::after{transform:scaleX(1); transform-origin:left;}
  .insights-viewall svg{width:15px; height:15px; transition:transform .25s ease;}
  .insights-viewall:hover svg{transform:translateX(4px);}

  .insights-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:24px;
  }

  .insight-card{
    display:flex;
    flex-direction:column;
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius-lg);
    overflow:hidden;
    transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  }
  .insight-card:hover{
    transform:translateY(-6px);
    box-shadow:0 30px 54px -24px rgba(10,37,54,0.22);
    border-color:transparent;
  }

  .insight-thumb{
    position:relative;
    height:188px;
    overflow:hidden;
  }
  .insight-thumb img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .5s ease;
  }
  .insight-card:hover .insight-thumb img{transform:scale(1.08);}
  .insight-thumb .art{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:transform .5s ease;
  }
  .insight-card:hover .insight-thumb .art{transform:scale(1.08);}
  .insight-thumb .art svg{width:60px; height:60px;}
  .insight-thumb::after{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(10,37,54,0.05) 0%, rgba(10,37,54,0.18) 100%);
    pointer-events:none;
  }

  .insight-tag{
    position:absolute;
    top:16px; left:16px;
    background:rgba(255,255,255,0.92);
    backdrop-filter:blur(6px);
    color:var(--navy-900);
    font-size:11px;
    font-weight:700;
    letter-spacing:.3px;
    text-transform:uppercase;
    padding:7px 13px;
    border-radius:999px;
    z-index:2;
  }

  .insight-body{
    padding:26px 26px 24px;
    display:flex;
    flex-direction:column;
    flex:1;
  }
  .insight-meta{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:12px;
    color:var(--muted);
    margin-bottom:14px;
  }
  .insight-meta .dot{width:3px; height:3px; border-radius:50%; background:var(--muted); flex-shrink:0;}
  .insight-meta svg{width:13px; height:13px; stroke:var(--muted); flex-shrink:0;}

  .insight-body h3{
    font-size:18.5px;
    line-height:1.35;
    font-weight:800;
    color:var(--navy-900);
    letter-spacing:-0.1px;
    margin-bottom:10px;
  }
  .insight-body p{
    font-size:13.5px;
    line-height:1.65;
    color:var(--muted);
    margin-bottom:22px;
    flex:1;
  }

  .insight-link{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-size:13.5px;
    font-weight:700;
    color:var(--blue-700);
    padding-top:16px;
    border-top:1px solid var(--line);
  }
  .insight-link svg{width:15px; height:15px; transition:transform .25s ease;}
  .insight-card:hover .insight-link svg{transform:translateX(4px);}

  @media (max-width:1080px){
    .insights-grid{grid-template-columns:1fr 1fr; gap:24px;}
    .insights-head{flex-direction:column; align-items:flex-start;}
  }
  @media (max-width:720px){
    .insights{padding:50px 0 60px;}
    .insights-head h2{font-size:27px;}
    .insights-grid{grid-template-columns:1fr;}
  }

  /* ---------- BEFORE & AFTER GALLERY ---------- */
  .gallery{
    position:relative;
    padding:70px 0 80px;
    background:#ffffff;
    overflow:hidden;
  }
  .gallery-decor{
    display:none;
  }

  .gallery-head{
    max-width:720px;
    margin:0 auto 20px;
    text-align:center;
    position:relative;
    z-index:2;
  }
  .gallery-head .eyebrow{margin-bottom:20px;}
  .gallery-head h2{
    font-size:39px;
    line-height:1.2;
    font-weight:800;
    letter-spacing:-0.4px;
    color:var(--navy-900);
    margin-bottom:16px;
  }
  .gallery-head h2 .accent{color:var(--blue-600);}
  .gallery-head p{
    font-size:15.5px;
    line-height:1.7;
    color:var(--muted);
  }

  .gallery-filters{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:10px;
    margin:36px 0 48px;
    position:relative;
    z-index:2;
  }
  .gallery-filter{
    font-size:13px;
    font-weight:700;
    color:var(--navy-900);
    background:#fff;
    border:1.5px solid var(--line);
    padding:10px 20px;
    border-radius:999px;
    cursor:pointer;
    transition:all .2s ease;
    white-space:nowrap;
  }
  .gallery-filter:hover{
    border-color:var(--blue-500);
    color:var(--blue-700);
    transform:translateY(-1px);
  }
  .gallery-filter.active{
    background:linear-gradient(135deg, var(--blue-600), var(--blue-700));
    border-color:transparent;
    color:#fff;
    box-shadow:0 10px 22px -12px rgba(18,104,138,0.45);
  }

  .gallery-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:24px;
    position:relative;
    z-index:2;
  }
  .gallery-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:22px;
    overflow:hidden;
    transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
  }
  .gallery-card:hover{
    transform:translateY(-7px);
    box-shadow:0 34px 60px -26px rgba(10,37,54,0.24);
    border-color:transparent;
  }
  .gallery-card.is-hidden{display:none;}

  /* Before / After comparison slider */
  .ba-slider{
    position:relative;
    height:210px;
    user-select:none;
    -webkit-user-select:none;
    overflow:hidden;
  }
  .ba-media{position:absolute; inset:0;}
  .ba-layer{
    position:absolute; inset:0;
    display:flex; align-items:center; justify-content:center;
    flex-direction:column;
    gap:6px;
  }
  .ba-layer svg{width:56px; height:56px;}
  .ba-layer img{width:100%; height:100%; object-fit:cover; display:block;}
  .ba-layer span{
    font-size:11px;
    font-weight:700;
    letter-spacing:.5px;
    text-transform:uppercase;
    opacity:.75;
  }
  .ba-after{z-index:1;}
  .ba-before{
    z-index:2;
    clip-path:inset(0 50% 0 0);
    border-right:2px solid rgba(255,255,255,0.85);
  }
  .ba-divider{
    position:absolute;
    top:0; bottom:0;
    left:50%;
    width:0;
    z-index:3;
    pointer-events:none;
    transform:translateX(-50%);
  }
  .ba-grip{
    position:absolute;
    top:50%; left:50%;
    transform:translate(-50%,-50%);
    width:38px; height:38px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 6px 16px -4px rgba(10,37,54,0.35);
    display:flex; align-items:center; justify-content:center;
    color:var(--navy-900);
  }
  .ba-grip svg{width:16px; height:16px;}
  .ba-range{
    position:absolute;
    inset:0;
    width:100%; height:100%;
    margin:0;
    opacity:0;
    cursor:ew-resize;
    z-index:4;
    -webkit-appearance:none;
    appearance:none;
    background:transparent;
  }
  .ba-range::-webkit-slider-thumb{
    -webkit-appearance:none;
    width:260px; height:260px;
    background:transparent;
  }
  .ba-tag{
    position:absolute;
    top:14px;
    font-size:10.5px;
    font-weight:800;
    letter-spacing:.6px;
    color:#fff;
    background:rgba(10,37,54,0.55);
    backdrop-filter:blur(4px);
    padding:6px 12px;
    border-radius:999px;
    z-index:5;
    pointer-events:none;
  }
  .ba-tag.before-tag{left:14px;}
  .ba-tag.after-tag{right:14px;}

  .gallery-body{
    padding:22px 24px 26px;
  }
  .gallery-tag{
    display:inline-block;
    font-size:10.5px;
    font-weight:700;
    letter-spacing:.4px;
    text-transform:uppercase;
    color:var(--teal-500);
    background:var(--teal-100);
    padding:5px 12px;
    border-radius:999px;
    margin-bottom:12px;
  }
  .gallery-body h3{
    font-size:17.5px;
    font-weight:800;
    color:var(--navy-900);
    letter-spacing:-0.1px;
    margin-bottom:8px;
  }
  .gallery-meta{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:12.5px;
    color:var(--muted);
  }
  .gallery-meta svg{width:14px; height:14px; stroke:var(--muted); flex-shrink:0;}
  .gallery-meta .sep{width:3px; height:3px; border-radius:50%; background:var(--muted); flex-shrink:0;}

  .gallery-more{
    text-align:center;
    margin-top:48px;
    position:relative;
    z-index:2;
  }
  .gallery-more button{
    font-size:14px;
    font-weight:700;
    color:#fff;
    background:linear-gradient(135deg, var(--blue-600), var(--blue-700));
    border:1.5px solid transparent;
    padding:15px 34px;
    border-radius:999px;
    cursor:pointer;
    transition:all .2s ease;
    display:inline-flex;
    align-items:center;
    gap:9px;
    box-shadow:0 10px 24px rgba(18,104,138,0.3);
  }
  .gallery-more button:hover{
    box-shadow:0 14px 30px rgba(18,104,138,0.4);
    transform:translateY(-2px);
  }
  .gallery-more button svg{width:15px; height:15px; transition:transform .25s ease;}
  .gallery-more button.expanded svg{transform:rotate(180deg);}

  @media (max-width:1080px){
    .gallery-grid{grid-template-columns:1fr 1fr; gap:22px;}
  }
  @media (max-width:720px){
    .gallery{padding:50px 0 60px;}
    .gallery-head h2{font-size:27px;}
    .gallery-grid{grid-template-columns:1fr;}
    .gallery-filters{
      flex-wrap:nowrap;
      justify-content:flex-start;
      overflow-x:auto;
      -webkit-overflow-scrolling:touch;
      scrollbar-width:none;
      gap:8px;
      margin-left:-22px;
      margin-right:-22px;
      padding:0 22px 6px;
    }
    .gallery-filters::-webkit-scrollbar{display:none;}
    .gallery-filter{padding:9px 16px; font-size:12.5px; flex:0 0 auto;}
  }

  /* ---------- VIDEO TESTIMONIALS ---------- */
  .testimonials{
    padding:0;
    background:#fff;
    position:relative;
  }

  .testi-head{
    max-width:680px;
    margin:0 auto 20px;
    text-align:center;
  }
  .testi-head .eyebrow{margin-bottom:20px;}
  .testi-head h2{
    font-size:39px;
    line-height:1.2;
    font-weight:800;
    letter-spacing:-0.4px;
    color:var(--navy-900);
    margin-bottom:16px;
  }
  .testi-head h2 .accent{color:var(--blue-600);}
  .testi-head p{
    font-size:15.5px;
    line-height:1.7;
    color:var(--muted);
  }

  .testi-filters{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:10px;
    margin:36px 0 48px;
  }
  .testi-filter{
    font-size:13px;
    font-weight:700;
    color:var(--navy-900);
    background:#fff;
    border:1.5px solid var(--line);
    padding:10px 20px;
    border-radius:999px;
    cursor:pointer;
    transition:all .2s ease;
    white-space:nowrap;
  }
  .testi-filter:hover{
    border-color:var(--blue-500);
    color:var(--blue-700);
    transform:translateY(-1px);
  }
  .testi-filter.active{
    background:linear-gradient(135deg, var(--blue-600), var(--blue-700));
    border-color:transparent;
    color:#fff;
    box-shadow:0 10px 22px -12px rgba(18,104,138,0.45);
  }

  .testi-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:24px;
  }
  .testi-card{
    display:flex;
    flex-direction:column;
    background:#fff;
    border:1px solid var(--line);
    border-radius:20px;
    overflow:hidden;
    transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
  }
  .testi-card:hover{
    transform:translateY(-7px);
    box-shadow:0 32px 56px -26px rgba(10,37,54,0.24);
    border-color:transparent;
  }
  .testi-card.is-hidden{display:none;}

  .testi-video{
    position:relative;
    height:190px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    cursor:pointer;
  }
  .testi-video .testi-cover{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    z-index:1;
  }
  .testi-video::after{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(10,37,54,0.05), rgba(10,37,54,0.35));
    z-index:1;
    pointer-events:none;
  }
  .testi-video .avatar-big{
    width:78px; height:78px;
    border-radius:50%;
    background:rgba(255,255,255,0.35);
    display:flex; align-items:center; justify-content:center;
    font-size:24px;
    font-weight:800;
    color:#fff;
    letter-spacing:.5px;
  }
  .testi-tag{
    position:absolute;
    top:14px; left:14px;
    background:rgba(255,255,255,0.92);
    backdrop-filter:blur(6px);
    color:var(--navy-900);
    font-size:10.5px;
    font-weight:700;
    letter-spacing:.3px;
    text-transform:uppercase;
    padding:6px 12px;
    border-radius:999px;
    z-index:2;
  }
  .testi-duration{
    position:absolute;
    bottom:14px; right:14px;
    background:rgba(10,37,54,0.6);
    backdrop-filter:blur(4px);
    color:#fff;
    font-size:11px;
    font-weight:700;
    padding:4px 10px;
    border-radius:999px;
    z-index:2;
  }
  .testi-play{
    position:relative;
    z-index:3;
    width:54px; height:54px;
    border-radius:50%;
    background:#fff;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 10px 26px -6px rgba(10,37,54,0.4);
    transition:transform .25s ease;
  }
  .testi-play svg{width:18px; height:18px; margin-left:2px;}
  .testi-video::before{
    content:'';
    position:absolute;
    top:50%; left:50%;
    width:54px; height:54px;
    border-radius:50%;
    border:1.5px solid rgba(255,255,255,0.8);
    transform:translate(-50%,-50%) scale(1);
    animation:testiPulse 2.6s ease-out infinite;
    z-index:2;
    pointer-events:none;
  }
  @keyframes testiPulse{
    0%{transform:translate(-50%,-50%) scale(1); opacity:.7;}
    100%{transform:translate(-50%,-50%) scale(1.9); opacity:0;}
  }
  .testi-card:hover .testi-play{transform:scale(1.1);}

  .testi-body{
    padding:20px 22px 24px;
    display:flex;
    flex-direction:column;
    flex:1;
  }
  .testi-person{
    display:flex;
    align-items:center;
    gap:11px;
    margin-bottom:12px;
  }
  .testi-avatar{
    width:38px; height:38px;
    border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-size:12.5px;
    font-weight:800;
    color:#fff;
    flex-shrink:0;
  }
  .testi-person h4{
    font-size:14px;
    font-weight:800;
    color:var(--navy-900);
    line-height:1.3;
  }
  .testi-person .proc{
    font-size:11.5px;
    color:var(--muted);
  }
  .testi-stars{
    display:flex;
    gap:2px;
    margin-bottom:10px;
  }
  .testi-stars svg{width:13px; height:13px; fill:#E8A93A; stroke:none;}
  .testi-quote{
    font-size:13px;
    line-height:1.6;
    color:var(--muted);
    font-style:italic;
    flex:1;
  }

  @media (max-width:1080px){
    .testi-grid{grid-template-columns:1fr 1fr; gap:22px;}
  }
  @media (max-width:720px){
    .testimonials{padding:0;}
    .testi-head h2{font-size:27px;}
    .testi-filters{gap:8px;}
    .testi-filter{padding:9px 16px; font-size:12.5px;}

    .testi-grid{
      display:flex;
      grid-template-columns:none;
      overflow-x:auto;
      scroll-snap-type:x mandatory;
      gap:16px;
      margin:0 -24px;
      padding:4px 24px 10px;
      -webkit-overflow-scrolling:touch;
    }
    .testi-grid::-webkit-scrollbar{display:none;}
    .testi-card{
      flex:0 0 78%;
      scroll-snap-align:start;
    }
    .testi-card.is-hidden{display:flex;}
  }

  /* Testimonial video modal */
  .testi-modal{
    position:fixed;
    inset:0;
    background:rgba(10,37,54,0.7);
    backdrop-filter:blur(4px);
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:1000;
    opacity:0;
    pointer-events:none;
    transition:opacity .25s ease;
    padding:24px;
  }
  .testi-modal.is-open{opacity:1; pointer-events:auto;}
  .testi-modal-box{
    background:#fff;
    border-radius:20px;
    padding:40px 36px;
    max-width:400px;
    width:100%;
    text-align:center;
    transform:scale(.94);
    transition:transform .25s ease;
    position:relative;
  }
  .testi-modal.is-open .testi-modal-box{transform:scale(1);}
  .testi-modal-close{
    position:absolute;
    top:14px; right:14px;
    width:32px; height:32px;
    border-radius:50%;
    background:var(--blue-50);
    display:flex; align-items:center; justify-content:center;
    cursor:pointer;
    border:none;
  }
  .testi-modal-close svg{width:15px; height:15px; stroke:var(--navy-900);}
  .testi-modal-icon{
    width:56px; height:56px;
    border-radius:50%;
    background:var(--blue-100);
    display:flex; align-items:center; justify-content:center;
    margin:0 auto 18px;
  }
  .testi-modal-icon svg{width:24px; height:24px; stroke:var(--blue-600);}
  .testi-modal-box h4{
    font-size:17px;
    font-weight:800;
    color:var(--navy-900);
    margin-bottom:8px;
  }
  .testi-modal-box p{
    font-size:13.5px;
    line-height:1.6;
    color:var(--muted);
  }


  /* ---------- FAQ (redesigned) ---------- */
  .faq{
    position:relative;
    padding:96px 0 110px;
    overflow:hidden;
    background:linear-gradient(180deg, #ffffff 0%, var(--bg-wash) 55%, #ffffff 100%);
  }
  .faq-blob{
    position:absolute;
    border-radius:50%;
    filter:blur(10px);
    pointer-events:none;
    z-index:0;
  }
  .faq-blob.a{ top:-180px; left:-160px; width:480px; height:480px; background:radial-gradient(circle, rgba(45,165,215,0.16), transparent 70%); }
  .faq-blob.b{ bottom:-220px; right:-180px; width:520px; height:520px; background:radial-gradient(circle, rgba(43,118,128,0.14), transparent 70%); }

  /* title above the two columns */
  .faq-title{
    position:relative;
    z-index:2;
    text-align:center;
    max-width:640px;
    margin:0 auto 56px;
  }
  .faq-title h2{
    font-size:37px; line-height:1.14; font-weight:800;
    letter-spacing:-0.5px; color:var(--navy-900); margin-bottom:16px;
  }
  .faq-title h2 .accent{
    background:linear-gradient(120deg, var(--blue-600), var(--teal-500));
    -webkit-background-clip:text; background-clip:text; color:transparent;
  }
  .faq-title .faq-lead{
    font-size:15px; line-height:1.75; color:var(--muted);
    max-width:520px; margin:0 auto;
  }

  .faq-grid{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:0.86fr 1.14fr;
    gap:56px;
    align-items:start;
  }

  /* left column */
  .faq-left{ position:sticky; top:32px; min-width:0; }

  .faq-categories{
    display:flex; flex-direction:column; gap:6px;
    position:relative; padding-left:22px;
  }
  .faq-rail{
    position:absolute; left:0; top:6px; bottom:6px; width:2px;
    background:var(--line); border-radius:2px;
  }
  .faq-rail-fill{
    position:absolute; left:0; top:0; width:2px;
    background:linear-gradient(180deg, var(--blue-500), var(--teal-500));
    border-radius:2px;
    transition:transform .45s cubic-bezier(.65,0,.35,1), height .45s cubic-bezier(.65,0,.35,1);
  }
  .cat-btn{
    display:flex; align-items:center; gap:13px; width:100%;
    text-align:left; background:transparent; border:none; cursor:pointer;
    padding:12px 14px; border-radius:var(--radius-sm);
    transition:background .22s ease, transform .22s ease;
    font-family:inherit;
  }
  .cat-btn:hover{ background:rgba(255,255,255,0.6); transform:translateX(3px); }
  .cat-btn .cat-ic{
    width:38px; height:38px; border-radius:11px; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    background:var(--white); border:1px solid var(--line);
    box-shadow:0 6px 14px -10px rgba(10,37,54,0.3);
    transition:background .22s ease, border-color .22s ease, transform .22s ease;
  }
  .cat-btn .cat-ic svg{ width:17px; height:17px; stroke:var(--blue-600); transition:stroke .22s ease; }
  .cat-btn .cat-txt{ line-height:1.3; }
  .cat-btn .cat-name{ font-size:14.5px; font-weight:700; color:var(--navy-900); }
  .cat-btn .cat-count{ font-size:11.5px; color:var(--muted); font-weight:500; }
  .cat-btn.active{ background:var(--white); box-shadow:0 14px 30px -18px rgba(10,37,54,0.3); }
  .cat-btn.active .cat-ic{
    background:linear-gradient(135deg, var(--blue-600), var(--teal-500));
    border-color:transparent; transform:scale(1.04);
  }
  .cat-btn.active .cat-ic svg{ stroke:#fff; }
  .cat-btn.active .cat-name{ color:var(--blue-700); }

  .faq-step{
    margin-top:24px; padding-left:14px;
    font-size:12px; font-weight:600; color:var(--muted); letter-spacing:.2px;
  }
  .faq-step span{ color:var(--blue-700); font-weight:800; }

  /* right column */
  .faq-right{ min-width:0; }
  .faq-panel-head{ display:flex; align-items:center; gap:14px; margin-bottom:20px; }
  .faq-panel-head .ic{
    width:46px; height:46px; border-radius:13px;
    background:linear-gradient(135deg, var(--blue-600), var(--teal-500));
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 12px 24px -12px rgba(28,138,184,0.5);
    flex-shrink:0;
  }
  .faq-panel-head .ic svg{ width:21px; height:21px; stroke:#fff; }
  .faq-panel-head h3{ font-size:20px; font-weight:800; color:var(--navy-900); }
  .faq-panel-head p{ font-size:12.5px; color:var(--muted); margin-top:2px; }

  .faq-cards{ display:flex; flex-direction:column; gap:14px; min-height:120px; }
  .faq-cards.is-animating{ animation:faqSwap .38s cubic-bezier(.4,0,.2,1); }
  @keyframes faqSwap{
    0%{ opacity:0; transform:translateY(10px); }
    100%{ opacity:1; transform:translateY(0); }
  }

  .faq-card{
    background:rgba(255,255,255,0.62);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border:1px solid rgba(255,255,255,0.55);
    border-radius:var(--radius-md);
    box-shadow:0 18px 40px -28px rgba(10,37,54,0.35);
    overflow:hidden;
    transition:border-color .25s ease, box-shadow .25s ease, transform .25s ease;
  }
  .faq-card:hover{ transform:translateY(-2px); box-shadow:0 24px 48px -26px rgba(10,37,54,0.32); }
  .faq-card.open{ border-color:rgba(45,165,215,0.5); background:rgba(255,255,255,0.86); }

  .faq-card .faq-q{
    width:100%; display:flex; align-items:center; justify-content:space-between;
    gap:18px; padding:19px 22px; background:none; border:none; text-align:left;
    font-family:inherit; font-size:14.5px; font-weight:700; color:var(--navy-900); cursor:pointer;
  }
  .faq-card.open .faq-q{ color:var(--blue-700); }
  .faq-card .faq-q .q-txt{ display:flex; align-items:baseline; gap:11px; }
  .faq-card .faq-q .q-mark{
    flex-shrink:0; width:6px; height:6px; border-radius:50%;
    background:var(--blue-500); margin-top:3px;
  }
  .faq-plus{
    position:relative; width:30px; height:30px; border-radius:50%;
    background:var(--blue-50); flex-shrink:0; transition:background .25s ease, transform .25s ease;
  }
  .faq-card.open .faq-plus{ background:linear-gradient(135deg, var(--blue-600), var(--teal-500)); transform:rotate(135deg); }
  .faq-plus .bar{ position:absolute; background:var(--blue-600); border-radius:2px; top:50%; left:50%; }
  .faq-plus .bar.h{ width:11px; height:2px; translate:-50% -50%; }
  .faq-plus .bar.v{ width:2px; height:11px; translate:-50% -50%; }
  .faq-card.open .faq-plus .bar{ background:#fff; }

  .faq-a-wrap{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .35s ease; }
  .faq-card.open .faq-a-wrap{ grid-template-rows:1fr; }
  .faq-a-inner{ overflow:hidden; }
  .faq-a-inner p{ padding:0 22px 21px 39px; font-size:13.5px; line-height:1.75; color:var(--muted); }

  .faq-cards mark{ background:rgba(45,165,215,0.28); color:inherit; border-radius:3px; padding:0 1px; }

  .cta-banner{
    padding:64px 0;
  }
  .cta-banner-inner{
    position:relative; overflow:hidden; z-index:2;
    display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap;
    background:linear-gradient(125deg, var(--navy-900) 0%, #0d3b52 55%, var(--teal-600) 100%);
    border-radius:var(--radius-lg);
    padding:48px 56px;
  }
  .cta-banner-inner::before{
    content:''; position:absolute; top:-140px; right:-100px; width:420px; height:420px;
    border-radius:50%; background:radial-gradient(circle, rgba(45,165,215,0.35), transparent 70%);
  }
  .cta-banner-inner::after{
    content:''; position:absolute; bottom:-160px; left:-80px; width:360px; height:360px;
    border-radius:50%; background:radial-gradient(circle, rgba(45,165,215,0.18), transparent 70%);
  }
  .cta-banner-text{position:relative; z-index:2;}
  .cta-banner-text .tag{
    display:inline-block; font-size:11.5px; font-weight:700; letter-spacing:.6px; text-transform:uppercase;
    color:#9FE0F5; margin-bottom:11px;
  }
  .cta-banner-text h3{ font-size:29px; font-weight:800; color:#fff; margin-bottom:10px; letter-spacing:-.4px; }
  .cta-banner-text p{ font-size:15px; color:rgba(255,255,255,0.72); max-width:460px; line-height:1.7; }
  .cta-banner-btn{
    position:relative; z-index:2; flex-shrink:0;
    display:inline-flex; align-items:center; gap:9px;
    background:#fff; color:var(--navy-900); font-size:15px; font-weight:700;
    padding:17px 30px; border-radius:999px; white-space:nowrap;
    transition:transform .2s ease, box-shadow .2s ease;
    box-shadow:0 10px 26px -10px rgba(0,0,0,0.4);
  }
  .cta-banner-btn:hover{ transform:translateY(-2px); }
  .cta-banner-btn svg{ width:16px; height:16px; transition:transform .2s ease; }
  .cta-banner-btn:hover svg{ transform:translateX(3px); }
  @media (max-width:720px){
    .cta-banner{ padding:44px 0; }
    .cta-banner-inner{ flex-direction:column; align-items:flex-start; padding:36px 28px; }
    .cta-banner-text h3{ font-size:23px; }
  }


  .faq-float{
    position:fixed; right:30px; bottom:30px; z-index:60;
    display:flex; align-items:center; gap:10px;
    background:linear-gradient(135deg, var(--blue-600), var(--teal-500));
    color:#fff; font-size:14px; font-weight:700;
    padding:16px 22px; border-radius:999px; border:none; cursor:pointer;
    box-shadow:0 16px 34px -12px rgba(18,104,138,0.55);
    transition:transform .25s ease, box-shadow .25s ease, opacity .25s ease;
  }
  .faq-float:hover{ transform:translateY(-3px) scale(1.02); box-shadow:0 22px 42px -12px rgba(18,104,138,0.62); }
  .faq-float .ic{
    width:22px; height:22px; border-radius:50%; background:rgba(255,255,255,0.22);
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
  }
  .faq-float .ic svg{ width:11px; height:11px; stroke:#fff; }

  .faq-modal{
    position:fixed; inset:0; z-index:100; display:flex; align-items:center; justify-content:center;
    background:rgba(10,37,54,0.55); backdrop-filter:blur(4px);
    opacity:0; pointer-events:none; transition:opacity .25s ease; padding:24px;
  }
  .faq-modal.open{ opacity:1; pointer-events:auto; }
  .faq-modal-box{
    background:#fff; border-radius:22px; padding:34px 32px; max-width:420px; width:100%;
    position:relative; transform:scale(.94); transition:transform .25s ease;
    box-shadow:0 40px 80px -20px rgba(10,37,54,0.5);
  }
  .faq-modal.open .faq-modal-box{ transform:scale(1); }
  .faq-modal-close{
    position:absolute; top:16px; right:16px; width:32px; height:32px; border-radius:50%;
    background:var(--blue-50); border:none; display:flex; align-items:center; justify-content:center; cursor:pointer;
  }
  .faq-modal-close svg{ width:14px; height:14px; stroke:var(--navy-900); }
  .faq-modal-box h4{ font-size:19px; font-weight:800; color:var(--navy-900); margin-bottom:6px; }
  .faq-modal-box > p{ font-size:13px; color:var(--muted); margin-bottom:22px; line-height:1.6; }
  .faq-modal-box .field{ margin-bottom:14px; }
  .faq-modal-box label{ display:block; font-size:12px; font-weight:600; color:var(--navy-900); margin-bottom:6px; }
  .faq-modal-box input, .faq-modal-box textarea{
    width:100%; font-family:inherit; font-size:13.5px; padding:12px 14px; border-radius:11px;
    border:1.5px solid var(--line); background:var(--blue-50); outline:none;
    transition:border-color .2s ease, background .2s ease;
  }
  .faq-modal-box textarea{ resize:vertical; min-height:80px; }
  .faq-modal-box input:focus, .faq-modal-box textarea:focus{ border-color:var(--blue-500); background:#fff; }
  .faq-modal-submit{
    width:100%; background:linear-gradient(135deg, var(--blue-600), var(--blue-700)); color:#fff;
    font-weight:700; font-size:14px; padding:14px; border:none; border-radius:12px; margin-top:4px; cursor:pointer;
  }
  .faq-modal-success{ display:none; text-align:center; padding:14px 0 6px; }
  .faq-modal-success.show{ display:block; }
  .faq-modal-success .tick{
    width:52px; height:52px; border-radius:50%; background:var(--teal-100); margin:0 auto 14px;
    display:flex; align-items:center; justify-content:center;
  }
  .faq-modal-success .tick svg{ width:22px; height:22px; stroke:var(--teal-600); }
  .faq-modal-success h4{ margin-bottom:6px; }

  @media (max-width:1080px){
    .faq-grid{ grid-template-columns:1fr; gap:40px; }
    .faq-left{ position:static; }
    .faq-title .faq-lead{ max-width:100%; }
    .faq-categories{
      flex-direction:row; flex-wrap:nowrap; overflow-x:auto; padding-left:0; gap:10px;
      scrollbar-width:none; padding-bottom:4px;
    }
    .faq-categories::-webkit-scrollbar{ display:none; }
    .faq-rail, .faq-rail-fill{ display:none; }
    .cat-btn{ flex:0 0 auto; flex-direction:column; align-items:flex-start; width:150px; background:var(--white); border:1px solid var(--line); }
    .cat-btn:hover{ transform:translateY(-2px); }
    .faq-step{ padding-left:0; margin-top:16px; }
  }
  @media (max-width:720px){
    .faq{ padding:64px 0 80px; }
    .faq-title h2{ font-size:28px; }
    .faq-float{ right:16px; bottom:16px; padding:14px 18px; }
    .faq-float span{ display:none; }
    .faq-float .ic{ width:20px; height:20px; }
    /* Hidden until the user scrolls past the hero (see main.js), so it
       doesn't sit on top of the stats bar on first paint. */
    .faq-float{ opacity:0; transform:translateY(12px); pointer-events:none; }
    .faq-float.is-visible{ opacity:1; transform:translateY(0); pointer-events:auto; }
  }
  @media (prefers-reduced-motion:reduce){
    .faq *{ animation:none !important; transition:none !important; }
  }

  /* mobile menu */
  .mobile-menu{
    display:none;
    flex-direction:column;
    gap:2px;
    background:#fff;
    border-top:1px solid var(--line);
    padding:10px 22px 18px;
  }
  .mobile-menu.open{display:flex;}

  .mobile-acc{
    border-bottom:1px solid #EEF8FB;
  }
  .mobile-acc-head{
    display:flex;
    align-items:stretch;
  }
  .mobile-acc-link{
    flex:1;
    padding:14px 4px;
    font-size:15px;
    font-weight:600;
    color:var(--navy-900);
  }
  .mobile-acc-link:hover{color:var(--blue-600);}
  .mobile-acc-link.active{color:var(--blue-600);}
  .mobile-acc-trigger{
    display:flex;
    align-items:center;
    justify-content:center;
    background:none;
    padding:14px 6px 14px 14px;
    color:var(--navy-900);
  }
  .mobile-acc-trigger .caret{
    width:14px; height:14px;
    flex-shrink:0;
    transition:transform .2s ease;
  }
  .mobile-acc.open .mobile-acc-trigger .caret{transform:rotate(180deg);}
  .mobile-acc.open .mobile-acc-link{color:var(--blue-600);}

  .mobile-acc-panel{
    display:none;
    flex-direction:column;
    padding:0 4px 12px 12px;
  }
  .mobile-acc.open .mobile-acc-panel{display:flex;}
  .mobile-acc-panel a{
    padding:9px 0;
    font-size:14px;
    font-weight:500;
    color:var(--muted);
  }
  .mobile-acc-panel a:hover{color:var(--blue-600);}
  .mobile-acc-panel .mobile-acc-heading{
    padding:10px 0 4px;
    font-size:11.5px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.4px;
    color:var(--blue-700);
  }
  .mobile-acc-panel .mobile-acc-heading:first-child{padding-top:2px;}

  /* ---------- Nested mobile submenu (e.g. Nose procedures) ---------- */
  .mobile-subacc{margin:0 0 2px;}
  .mobile-subacc-head{display:flex; align-items:stretch;}
  .mobile-subacc-head .mobile-acc-link{
    flex:1;
    padding:9px 0;
    font-size:14px;
    font-weight:500;
    color:var(--muted);
  }
  .mobile-subacc.open .mobile-subacc-head .mobile-acc-link{color:var(--blue-600);}
  .mobile-subacc-trigger{
    display:flex;
    align-items:center;
    justify-content:center;
    background:none;
    padding:9px 4px 9px 10px;
    color:var(--muted);
  }
  .mobile-subacc-trigger .caret{
    width:12px; height:12px;
    flex-shrink:0;
    transition:transform .2s ease;
  }
  .mobile-subacc.open .mobile-subacc-trigger .caret{transform:rotate(180deg);}
  .mobile-subacc-panel{
    display:none;
    flex-direction:column;
    padding:0 0 6px 14px;
    margin-left:2px;
    border-left:2px solid var(--blue-100);
  }
  .mobile-subacc.open .mobile-subacc-panel{display:flex;}
  .mobile-subacc-panel a{
    padding:7px 0;
    font-size:13px;
    font-weight:500;
    color:var(--muted);
  }
  .mobile-subacc-panel a:hover{color:var(--blue-600);}

  /* ---------- Legal page prose (Privacy Policy, Terms of Service) ---------- */
  .legal-content{max-width:760px; margin:0 auto;}
  .legal-content p{
    font-size:14.5px;
    line-height:1.8;
    color:var(--muted);
    margin-bottom:16px;
  }
  .legal-content h2{
    font-size:19px;
    font-weight:800;
    color:var(--navy-900);
    margin:34px 0 12px;
  }
  .legal-content h2:first-child{margin-top:0;}
  .legal-content ul{
    list-style:disc;
    padding-left:20px;
    margin-bottom:16px;
  }
  .legal-content li{
    font-size:14.5px;
    line-height:1.8;
    color:var(--muted);
    margin-bottom:6px;
  }
  .legal-content .updated{
    font-size:12.5px;
    font-weight:600;
    color:var(--blue-600);
    margin-bottom:28px;
    display:block;
  }
  .legal-content a{color:var(--blue-600); text-decoration:underline;}

  /* Modifier: let the prose run the full width of the page container
     (.wrap, capped at 1320px) instead of being capped/centered at 760px
     like the shared legal-content default. Used by Privacy Policy and
     Terms of Service. */
  .legal-content--full{max-width:none;}
