/* ==========================================================
   Dash Renovation -- site stylesheet
   ========================================================== */

:root{
    color-scheme:light dark;
    --blue:#3D5DE8;
    --blue-2:#5C7BFF;
    --blue-deep:#1F3399;
    --ink:#191E33;
    --ink-soft:#4A5170;
    --sand:#FBF8F1;
    --sand-2:#F3EDE0;
    --sand-3:#EAE2CE;
    --gold:#DE9A3B;
    --gold-2:#F0B15A;
    --gold-text:#7A4409;
    --tint-blue:#EEF1FC;
    --line:rgba(25,30,51,0.14);
    --surface:#FFFFFF;
    --shadow:0 1px 2px rgba(25,30,51,0.04), 0 12px 32px -12px rgba(25,30,51,0.16);
    --radius-s:10px;
    --radius-m:20px;
    --radius-l:32px;
    --maxw:1200px;
    --ease:cubic-bezier(.22,.9,.32,1);
    /* fixed, theme-independent -- the footer band is always dark navy with
       a bright brand-blue accent, regardless of the site's light/dark theme */
    --footer-bg:#12162C;
    --footer-ink:#F4F6FC;
    --footer-blue:#5C7BFF;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --ink:#EEF0FA;
      --ink-soft:#B7BEDC;
      --sand:#11142A;
      --sand-2:#171B36;
      --sand-3:#232A4E;
      --line:rgba(238,240,250,0.12);
      --surface:#181C38;
      --blue:#5C7BFF;
      --blue-2:#7C97FF;
      --blue-deep:#B9C6FF;
      --gold:#F0B15A;
      --gold-2:#F7C381;
      --gold-text:#F7C381;
      --tint-blue:#1B2350;
      --shadow:0 1px 2px rgba(0,0,0,0.3), 0 20px 44px -16px rgba(0,0,0,0.55);
    }
  }
  :root[data-theme="dark"]{
    --ink:#EEF0FA;
    --ink-soft:#B7BEDC;
    --sand:#11142A;
    --sand-2:#171B36;
    --sand-3:#232A4E;
    --line:rgba(238,240,250,0.12);
    --surface:#181C38;
    --blue:#5C7BFF;
    --blue-2:#7C97FF;
    --blue-deep:#B9C6FF;
    --gold:#F0B15A;
    --gold-2:#F7C381;
    --gold-text:#F7C381;
    --tint-blue:#1B2350;
    --shadow:0 1px 2px rgba(0,0,0,0.3), 0 20px 44px -16px rgba(0,0,0,0.55);
  }

  *,*::before,*::after{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  @media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} }
  body{
    margin:0;
    background:var(--sand);
    color:var(--ink);
    font-family:'Work Sans',ui-sans-serif,system-ui,sans-serif;
    font-size:16px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}
  h1,h2,h3,h4{
    font-family:'Bricolage Grotesque',ui-sans-serif,system-ui,sans-serif;
    font-weight:700;
    line-height:1.05;
    margin:0;
    text-wrap:balance;
    letter-spacing:-0.01em;
  }
  p{margin:0;}
  ul,ol{margin:0;padding:0;list-style:none;}
  button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;}
  :focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px;}

  .eyebrow{
    font-family:'JetBrains Mono',ui-monospace,monospace;
    font-size:12.5px;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:var(--blue);
    font-weight:500;
    display:inline-flex;
    align-items:center;
    gap:8px;
  }
  .eyebrow::before{
    content:"";
    width:6px;height:6px;border-radius:50%;
    background:var(--gold);
    flex:none;
  }

  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,5vw,56px);}
  section{position:relative;}

  /* ---------- noise overlay ---------- */
  .noise{
    position:fixed;inset:0;pointer-events:none;z-index:1;
    opacity:0.035;mix-blend-mode:multiply;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  }
  @media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .noise{mix-blend-mode:overlay;opacity:0.05;} }
  :root[data-theme="dark"] .noise{mix-blend-mode:overlay;opacity:0.05;}

  /* ---------- nav ---------- */
  .nav{
    position:sticky;top:0;z-index:40;
    padding:16px clamp(20px,5vw,56px);
    display:flex;align-items:center;justify-content:space-between;gap:24px;
    transition:background-color .4s var(--ease),box-shadow .4s var(--ease),padding .3s var(--ease);
  }
  .nav.scrolled{
    background:color-mix(in srgb, var(--sand) 82%, transparent);
    backdrop-filter:blur(14px) saturate(140%);
    box-shadow:0 1px 0 var(--line);
    padding-top:11px;padding-bottom:11px;
  }
  .brand{display:flex;align-items:center;flex:none;}
  .brand img{height:19px;width:auto;}
  .nav-links{display:flex;align-items:center;gap:30px;}
  .nav-links a{
    font-size:14.5px;font-weight:500;color:var(--ink-soft);
    position:relative;padding:4px 0;
    transition:color .25s var(--ease);
  }
  .nav-links a::after{
    content:"";position:absolute;left:0;bottom:-2px;height:1.5px;width:0%;
    background:var(--blue);transition:width .3s var(--ease);
  }
  .nav-links a:hover, .nav-links a.active{color:var(--ink);}
  .nav-links a:hover::after, .nav-links a.active::after{width:100%;}
  .nav-cta{display:flex;align-items:center;gap:14px;}
  .nav-toggle{
    display:none;width:40px;height:40px;flex:none;position:relative;
    align-items:center;justify-content:center;border-radius:50%;
  }
  .nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{
    content:"";position:absolute;width:19px;height:1.6px;background:var(--ink);border-radius:2px;
    transition:transform .3s var(--ease),opacity .3s var(--ease),top .3s var(--ease);
  }
  .nav-toggle span{top:50%;transform:translateY(-50%);}
  .nav-toggle span::before{top:-6px;}
  .nav-toggle span::after{top:6px;}
  .nav-toggle.open span{background:transparent;}
  .nav-toggle.open span::before{top:0;transform:rotate(45deg);}
  .nav-toggle.open span::after{top:0;transform:rotate(-45deg);}

  .mobile-panel{
    display:none;position:absolute;top:100%;left:0;right:0;
    background:var(--sand);border-bottom:1px solid var(--line);
    box-shadow:var(--shadow);
    padding:8px clamp(20px,5vw,56px) 20px;
    flex-direction:column;gap:2px;
  }
  .mobile-panel a{
    padding:14px 2px;font-size:16px;font-weight:600;border-bottom:1px solid var(--line);
  }
  .mobile-panel a:last-of-type{border-bottom:0;}
  .nav.menu-open .mobile-panel{display:flex;}

  /* ---------- buttons ---------- */
  .btn{
    display:inline-flex;align-items:center;gap:9px;
    padding:13px 24px;border-radius:100px;
    font-size:14.5px;font-weight:600;white-space:nowrap;
    transition:transform .35s var(--ease), box-shadow .35s var(--ease), background-color .3s var(--ease), color .3s var(--ease);
  }
  .btn-small{padding:10px 19px;font-size:13.5px;}
  .btn-primary{
    background:var(--blue);color:#fff;
    box-shadow:0 1px 1px rgba(0,0,0,.05), 0 10px 24px -8px color-mix(in srgb, var(--blue) 65%, transparent);
  }
  .btn-primary:hover{transform:translateY(-2px);box-shadow:0 1px 1px rgba(0,0,0,.05), 0 16px 30px -8px color-mix(in srgb, var(--blue) 70%, transparent);}
  .btn-primary svg{transition:transform .35s var(--ease);}
  .btn-primary:hover svg{transform:translateX(3px);}
  .btn-ghost{
    color:var(--ink);border:1.5px solid var(--line);background:transparent;
  }
  .btn-ghost:hover{border-color:var(--blue);color:var(--blue);gap:13px;}
  .btn-ghost svg{transition:transform .3s var(--ease);}

  /* ================= HERO ================= */
  .hero{
    position:relative;
    overflow:hidden;
  }
  .hero-decor{position:absolute;inset:0;z-index:0;pointer-events:none;}
  .blob{
    position:absolute;border-radius:50%;filter:blur(60px);
    opacity:.55;
  }
  .blob-a{width:420px;height:420px;background:color-mix(in srgb, var(--blue) 55%, transparent);top:-140px;right:-80px;animation:drift-a 22s ease-in-out infinite;}
  .blob-b{width:280px;height:280px;background:color-mix(in srgb, var(--gold) 45%, transparent);bottom:-60px;left:8%;animation:drift-b 26s ease-in-out infinite;}
  @keyframes drift-a{0%,100%{transform:translate(0,0)}50%{transform:translate(-30px,40px)}}
  @keyframes drift-b{0%,100%{transform:translate(0,0)}50%{transform:translate(24px,-30px)}}
  @media (prefers-reduced-motion: reduce){ .blob{animation:none;} }

  .hero-stroke{position:absolute;inset:0;width:100%;height:100%;z-index:0;}
  .hero-stroke path{
    fill:none;stroke:url(#dashGrad);stroke-width:2.5;
    stroke-linecap:round;
    stroke-dasharray:1400;stroke-dashoffset:1400;
    animation:draw 2.4s var(--ease) .3s forwards;
  }
  @keyframes draw{to{stroke-dashoffset:0;}}
  @media (prefers-reduced-motion: reduce){ .hero-stroke path{animation:none;stroke-dashoffset:0;} }

  .hero-inner{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,5vw,56px);}
  .hero-inner .eyebrow{margin-bottom:22px;}
  .hero h1{
    font-size:clamp(30px,4.4vw,54px);
    max-width:23ch;
  }
  .hero h1 .accent{color:var(--blue);}
  .hero .lede{
    margin-top:24px;max-width:52ch;font-size:clamp(16px,1.6vw,19px);color:var(--ink-soft);
  }
  .hero-ctas{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:36px;}

  .marquee{
    margin-top:clamp(48px,8vw,84px);
    border-top:1px solid var(--line);border-bottom:1px solid var(--line);
    position:relative;z-index:2;
    padding:16px clamp(20px,5vw,56px);
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
    mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  }
  .marquee-track{display:flex;width:max-content;gap:40px;animation:scroll-x 32s linear infinite;}
  @media (prefers-reduced-motion: reduce){ .marquee-track{animation:none;overflow-x:auto;} }
  @keyframes scroll-x{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  .marquee:hover .marquee-track{animation-play-state:paused;}
  .marquee-item{
    display:flex;align-items:center;gap:10px;flex:none;
    font-family:'JetBrains Mono',monospace;font-size:13px;letter-spacing:.04em;
    color:var(--ink-soft);text-transform:uppercase;
  }
  .marquee-item svg{width:13px;height:13px;color:var(--gold-text);flex:none;}
  .marquee-item b{color:var(--ink);font-weight:600;}

  /* ================= REVEAL =================
     Content is ALWAYS fully opaque/readable at rest -- a full-page capture,
     shared link or fast skim must never show blank space. Only a small
     positional settle (transform) is deferred for below-the-fold sections;
     it is restored the instant the element enters the viewport. */
  .reveal{transition:transform .8s var(--ease);}
  .reveal.pre{transform:translateY(22px);}
  .reveal-stagger > *{transition:transform .7s var(--ease);}
  .reveal-stagger.pre > *{transform:translateY(18px);}
  .reveal-stagger > *:nth-child(1){transition-delay:.02s;}
  .reveal-stagger > *:nth-child(2){transition-delay:.1s;}
  .reveal-stagger > *:nth-child(3){transition-delay:.18s;}
  .reveal-stagger > *:nth-child(4){transition-delay:.26s;}
  .reveal-stagger > *:nth-child(5){transition-delay:.34s;}
  .reveal-stagger > *:nth-child(6){transition-delay:.42s;}
  @media (prefers-reduced-motion: reduce){
    .reveal,.reveal-stagger > *{transform:none !important;transition:none !important;}
  }

  /* ================= INTRO ================= */
  .intro{padding:clamp(64px,10vw,120px) 0;}
  .intro .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(32px,6vw,80px);align-items:start;}
  .intro h2{font-size:clamp(28px,4vw,42px);max-width:14ch;margin-top:18px;}
  .intro-body{margin-top:22px;color:var(--ink-soft);font-size:16.5px;max-width:46ch;}
  .intro-body + .intro-body{margin-top:14px;}
  .stat-row{display:flex;gap:clamp(20px,4vw,40px);margin-top:30px;flex-wrap:wrap;}
  .stat b{
    font-family:'Bricolage Grotesque';font-size:clamp(30px,3.4vw,42px);color:var(--blue);
    display:block;font-variant-numeric:tabular-nums;
  }
  .stat span{font-size:13px;color:var(--ink-soft);}
  .stat b.stat-text{font-size:clamp(16px,1.7vw,19px);line-height:1.3;max-width:13ch;}

  .trade-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius-m);overflow:hidden;}
  .trade-cell{
    background:var(--surface);padding:22px;display:flex;flex-direction:column;gap:10px;position:relative;z-index:0;
    transition:background-color .3s var(--ease), transform .35s var(--ease), box-shadow .35s var(--ease);
  }
  .trade-cell:hover{background:var(--sand-2);transform:translateY(-3px);box-shadow:var(--shadow);z-index:1;}
  .trade-cell svg{width:22px;height:22px;color:var(--blue);transition:transform .4s cubic-bezier(.22,1.6,.36,1), color .35s var(--ease);}
  .trade-cell:hover svg{transform:scale(1.18) rotate(-4deg);color:var(--gold);}
  .trade-cell b{font-size:14.5px;font-weight:600;}
  .trade-cell span{font-size:13px;color:var(--ink-soft);}

  /* ================= SERVICES ================= */
  .services{padding:clamp(64px,10vw,120px) 0;background:var(--sand-2);}
  .section-head{max-width:640px;margin-bottom:clamp(36px,6vw,56px);}
  .section-head h2{font-size:clamp(28px,4vw,44px);margin-top:16px;}
  .section-head p{margin-top:16px;color:var(--ink-soft);font-size:16.5px;max-width:56ch;}

  .service-explorer{display:grid;grid-template-columns:.85fr 1.15fr;gap:0;border:1px solid var(--line);border-radius:var(--radius-l);overflow:hidden;background:var(--surface);box-shadow:var(--shadow);}
  .service-tabs{border-right:1px solid var(--line);display:flex;flex-direction:column;}
  .service-tab{
    display:flex;align-items:center;gap:14px;padding:19px 22px;text-align:left;
    border-bottom:1px solid var(--line);position:relative;
    transition:background-color .25s var(--ease),color .25s var(--ease);
  }
  .service-tab:last-child{border-bottom:0;}
  .service-tab svg{width:19px;height:19px;flex:none;color:var(--ink-soft);transition:color .3s var(--ease), transform .4s cubic-bezier(.22,1.6,.36,1);}
  .service-tab span{font-size:14.5px;font-weight:600;color:var(--ink-soft);transition:color .25s var(--ease);}
  .service-tab::before{
    content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--blue);
    transform:scaleY(0);transition:transform .3s var(--ease);transform-origin:bottom;
  }
  .service-tab:hover span{color:var(--ink);}
  .service-tab:hover svg{transform:scale(1.1);}
  .service-tab.active{background:var(--sand);}
  .service-tab.active::before{transform:scaleY(1);transform-origin:top;}
  .service-tab.active svg,.service-tab.active span{color:var(--blue);}
  .service-tab.active svg{transform:scale(1.12);}

  .service-panels{position:relative;padding:clamp(28px,5vw,52px);min-height:380px;}
  .service-panel{display:none;}
  .service-panel.active{display:block;animation:panel-in .5s var(--ease);}
  @keyframes panel-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
  @media (prefers-reduced-motion: reduce){ .service-panel.active{animation:none;} }
  .service-panel-icon{
    width:56px;height:56px;border-radius:16px;background:color-mix(in srgb, var(--blue) 10%, transparent);
    display:flex;align-items:center;justify-content:center;margin-bottom:22px;
  }
  .service-panel-icon svg{width:28px;height:28px;color:var(--blue);}
  .service-panel h3{font-size:clamp(21px,2.4vw,27px);}
  .service-panel p{margin-top:14px;color:var(--ink-soft);font-size:15.5px;max-width:56ch;}
  .chip-row{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px;}
  .chip{
    font-size:12.5px;font-weight:500;padding:7px 13px;border-radius:100px;
    background:var(--sand-3);border:1px solid var(--line);color:var(--ink-soft);
  }
  .service-tabs-mobile{display:none;}
  .panel-more{
    display:inline-flex;align-items:center;gap:8px;margin-top:26px;
    font-size:14px;font-weight:600;color:var(--blue);
  }
  .panel-more svg{transition:transform .3s var(--ease);}
  .panel-more:hover svg{transform:translateX(3px);}

  /* ================= PROCESS ================= */
  .process{padding:clamp(64px,10vw,120px) 0;}
  .timeline{
    margin-top:clamp(40px,6vw,64px);
    display:grid;grid-template-columns:repeat(4,1fr);gap:28px;position:relative;
  }
  .timeline-line{position:absolute;top:27px;left:4%;width:92%;height:1px;z-index:0;}
  .timeline-line rect{fill:var(--line);}
  .timeline-line .fill{fill:var(--blue);}
  .step{position:relative;z-index:1;padding-top:0;}
  .step-num{
    width:54px;height:54px;border-radius:50%;background:var(--surface);border:1.5px solid var(--line);
    display:flex;align-items:center;justify-content:center;margin-bottom:22px;
    font-family:'JetBrains Mono';font-size:13px;color:var(--blue);font-weight:500;
    box-shadow:var(--shadow);
    transition:transform .5s cubic-bezier(.22,1.6,.36,1), border-color .5s var(--ease), background-color .5s var(--ease), box-shadow .5s var(--ease);
  }
  .step-num.lit{
    border-color:var(--blue);background:var(--tint-blue);transform:scale(1.1);
    box-shadow:var(--shadow), 0 0 0 5px color-mix(in srgb, var(--blue) 14%, transparent);
  }
  .step h4{font-size:17px;}
  .step p{margin-top:9px;color:var(--ink-soft);font-size:14.5px;}

  /* ================= ABOUT ================= */
  .about{padding:clamp(64px,10vw,120px) 0;background:var(--tint-blue);color:var(--ink);}
  .about .eyebrow{color:var(--blue);}
  .about .eyebrow::before{background:var(--gold);}
  .about .wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,80px);align-items:start;}
  .about h2{font-size:clamp(30px,4.4vw,46px);color:var(--ink);max-width:12ch;margin-top:18px;}
  .about-quote{font-size:clamp(19px,2.1vw,24px);line-height:1.45;color:var(--blue-deep);font-family:'Bricolage Grotesque';font-weight:500;margin-top:20px;max-width:22ch;}
  .about-list{margin-top:34px;display:flex;flex-direction:column;gap:22px;}
  .about-list li{display:flex;gap:16px;padding-bottom:22px;border-bottom:1px solid var(--line);}
  .about-list li:last-child{border-bottom:0;padding-bottom:0;}
  .about-list b{font-family:'JetBrains Mono';font-size:12.5px;color:var(--blue);flex:none;width:26px;padding-top:3px;}
  .about-list span{color:var(--ink-soft);font-size:15px;}
  .about-list strong{display:block;color:var(--ink);font-weight:600;font-size:15.5px;margin-bottom:4px;font-family:'Work Sans';}

  /* ================= AREAS ================= */
  .areas{padding:clamp(64px,10vw,120px) 0;}
  .areas .wrap{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(32px,6vw,72px);align-items:center;}
  .areas h2{font-size:clamp(28px,4vw,42px);margin-top:16px;max-width:13ch;}
  .areas-body{margin-top:20px;color:var(--ink-soft);font-size:16.5px;max-width:48ch;}
  .note-card{
    margin-top:28px;padding:18px 22px;border-radius:var(--radius-m);background:var(--surface);border:1px solid var(--line);
    box-shadow:var(--shadow);
    display:flex;flex-wrap:wrap;align-items:center;gap:16px;justify-content:space-between;
  }
  .note-card p{font-size:14px;color:var(--ink-soft);max-width:34ch;}
  .note-card a{font-size:13.5px;font-weight:600;color:var(--blue);display:inline-flex;align-items:center;gap:6px;}
  .note-card a svg{width:13px;height:13px;transition:transform .3s var(--ease);}
  .note-card a:hover svg{transform:translateX(3px);}

  .coast-wrap{position:relative;}
  .coast-svg{width:100%;height:auto;}
  .coast-svg .land{fill:var(--sand-3);stroke:var(--line);}
  .coast-svg .water-line{stroke:color-mix(in srgb, var(--blue) 30%, transparent);fill:none;stroke-width:1;}
  .pin{cursor:default;}
  .pin circle.ring{fill:none;stroke:var(--blue);stroke-width:1;opacity:.35;transform-origin:center;animation:ring 3s ease-out infinite;}
  .pin.hq circle.ring{stroke:var(--gold);}
  @keyframes ring{0%{transform:scale(.4);opacity:.5}100%{transform:scale(2.2);opacity:0}}
  @media (prefers-reduced-motion: reduce){ .pin circle.ring{animation:none;opacity:0;} }
  .pin circle.dot{fill:var(--blue);}
  .pin.hq circle.dot{fill:var(--gold);}
  .pin text{font-family:'JetBrains Mono';font-size:10.5px;fill:var(--ink);font-weight:500;}
  .pin .hq-tag{font-size:9.5px;fill:var(--gold-text);font-weight:700;}

  /* ================= FAQ ================= */
  .faq{padding:clamp(64px,10vw,120px) 0;background:var(--sand-2);}
  .faq .wrap{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(32px,6vw,72px);}
  .faq-list{display:flex;flex-direction:column;}
  .faq-item{border-bottom:1px solid var(--line);}
  .faq-item:first-child{border-top:1px solid var(--line);}
  .faq-q{
    width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;
    padding:22px 2px;text-align:left;font-size:16px;font-weight:600;
  }
  .faq-q .plus{
    flex:none;width:22px;height:22px;position:relative;
  }
  .faq-q .plus::before,.faq-q .plus::after{
    content:"";position:absolute;background:var(--ink);border-radius:2px;
    top:50%;left:50%;transform:translate(-50%,-50%);
  }
  .faq-q .plus::before{width:14px;height:1.6px;}
  .faq-q .plus::after{width:1.6px;height:14px;transition:transform .3s var(--ease), opacity .3s var(--ease);}
  .faq-item.open .plus::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0;}
  .faq-a{
    display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s var(--ease);
  }
  .faq-item.open .faq-a{grid-template-rows:1fr;}
  .faq-a-inner{overflow:hidden;}
  .faq-a-inner p{color:var(--ink-soft);font-size:15px;padding-bottom:24px;max-width:60ch;}

  /* ================= TESTIMONIALS ================= */
  .testimonials{padding:clamp(64px,10vw,120px) 0;}
  .testimonials .section-head{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:20px;max-width:none;}
  .placeholder-note{
    font-size:12.5px;font-weight:600;color:var(--gold-text);background:color-mix(in srgb, var(--gold) 16%, var(--surface));
    border:1px solid color-mix(in srgb, var(--gold) 45%, transparent);
    padding:8px 14px;border-radius:100px;font-family:'JetBrains Mono';
  }
  .t-row-wrap{position:relative;}
  .t-row{
    display:flex;align-items:flex-start;gap:20px;overflow-x:auto;padding:6px 6px 20px 6px;scroll-snap-type:x mandatory;
    margin:0 -6px;
  }
  .t-row::-webkit-scrollbar{height:6px;}
  .t-row::-webkit-scrollbar-thumb{background:var(--line);border-radius:10px;}
  .t-arrow{
    position:absolute;top:50%;transform:translateY(-50%);z-index:3;
    width:42px;height:42px;border-radius:50%;border:1px solid var(--line);
    background:var(--surface);color:var(--ink);display:flex;align-items:center;justify-content:center;
    cursor:pointer;box-shadow:var(--shadow);
    transition:background-color .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), opacity .2s var(--ease);
  }
  .t-arrow svg{width:18px;height:18px;}
  .t-arrow:hover{background:var(--blue);color:#fff;border-color:var(--blue);}
  .t-arrow[disabled]{opacity:.3;cursor:default;pointer-events:none;}
  .t-prev{left:-4px;}
  .t-next{right:-4px;}
  @media (max-width:760px){ .t-arrow{display:none;} }
  .t-card{
    flex:none;width:min(360px,80vw);scroll-snap-align:start;
    background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);
    padding:26px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:16px;
    transition:transform .35s var(--ease);
  }
  .t-card:hover{transform:translateY(-4px);}
  .t-card svg{width:22px;height:22px;color:var(--blue);opacity:.5;}
  .t-card p{font-size:15px;color:var(--ink);line-height:1.55;}
  .t-card footer{font-size:12.5px;color:var(--ink-soft);font-family:'JetBrains Mono';display:flex;flex-direction:column;gap:3px;}
  .t-card footer b{color:var(--ink);font-weight:600;font-family:'Work Sans',sans-serif;font-size:13.5px;}
  .t-stars{display:flex;gap:3px;}
  .t-stars svg{width:14px;height:14px;flex:none;}
  .t-stars svg.full{fill:var(--gold);}
  .t-stars svg.half{position:relative;}
  .t-stars .half-wrap{position:relative;width:14px;height:14px;flex:none;}
  .t-stars .half-wrap svg{position:absolute;top:0;left:0;width:14px;height:14px;}
  .t-stars .half-wrap svg.bg{fill:var(--line);}
  .t-stars .half-wrap svg.fg{fill:var(--gold);clip-path:inset(0 50% 0 0);}

  /* ================= CTA BAND ================= */
  .cta-band{padding:clamp(72px,11vw,132px) 0;text-align:center;position:relative;overflow:hidden;}
  .cta-band .blob-a{top:auto;bottom:-160px;right:10%;}
  .cta-band h2{font-size:clamp(30px,5.2vw,58px);max-width:16ch;margin:0 auto;position:relative;z-index:1;}
  .cta-band p{margin:20px auto 0;max-width:52ch;color:var(--ink-soft);font-size:16.5px;position:relative;z-index:1;}
  .cta-band .hero-ctas{justify-content:center;position:relative;z-index:1;margin-top:32px;}

  /* ================= QUOTE FORM ================= */
  .qf-wrap{
    position:relative;z-index:1;max-width:640px;margin:44px auto 0;text-align:left;
    background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-l);
    padding:clamp(24px,4vw,40px);box-shadow:var(--shadow);
  }
  .qf-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
  .qf-field{margin-top:18px;}
  .qf-row .qf-field{margin-top:0;}
  .qf-field:first-child{margin-top:0;}
  .qf-field label{display:block;font-size:13.5px;font-weight:600;color:var(--ink);margin-bottom:7px;}
  .qf-optional{font-weight:400;color:var(--ink-soft);}
  .qf-field input[type="text"],
  .qf-field input[type="tel"],
  .qf-field select,
  .qf-field textarea{
    width:100%;border:1px solid var(--line);border-radius:var(--radius-s);
    background:var(--sand);color:var(--ink);font:inherit;font-size:15px;
    padding:12px 14px;transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
  }
  .qf-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='%234A5170' stroke-width='2.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:40px;
  }
  .qf-field textarea{resize:vertical;min-height:96px;font-family:inherit;}
  .qf-field input:focus,.qf-field select:focus,.qf-field textarea:focus{
    outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(61,93,232,.16);
  }
  .qf-photo-picker{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
  .qf-photo-btn{
    display:inline-flex;align-items:center;gap:8px;
    border:1px dashed var(--line);border-radius:var(--radius-s);background:var(--sand);
    color:var(--ink);font:inherit;font-size:14px;font-weight:600;padding:11px 16px;cursor:pointer;
    transition:border-color .2s var(--ease), color .2s var(--ease), background-color .2s var(--ease);
  }
  .qf-photo-btn svg{width:17px;height:17px;flex:none;}
  .qf-photo-btn:hover{border-color:var(--blue);color:var(--blue);}
  .qf-photo-status{font-size:13px;color:var(--ink-soft);}
  .qf-photo-status.qf-warn{color:#C4432B;font-weight:600;}
  .qf-photo-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
  .qf-chip{
    display:inline-flex;align-items:center;gap:8px;
    background:var(--tint-blue);border:1px solid var(--line);border-radius:100px;
    padding:6px 8px 6px 14px;font-size:12.5px;color:var(--ink);max-width:100%;
  }
  .qf-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px;}
  .qf-chip button{
    flex:none;width:20px;height:20px;border-radius:50%;border:0;background:rgba(25,30,51,.1);
    color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:13px;line-height:1;
    transition:background-color .2s var(--ease), color .2s var(--ease);
  }
  .qf-chip button:hover{background:#C4432B;color:#fff;}
  .qf-submit{margin-top:26px;width:100%;justify-content:center;}
  .qf-submit[disabled]{opacity:.5;cursor:not-allowed;}
  .qf-note{margin:14px 0 0;font-size:12.5px;color:var(--ink-soft);text-align:center;max-width:none;}
  @media (max-width:600px){
    .qf-row{grid-template-columns:1fr;gap:0;}
    .qf-row .qf-field{margin-top:18px;}
    .qf-row .qf-field:first-child{margin-top:0;}
  }

  /* ================= FOOTER ================= */
  /* Fixed, theme-independent colors: the footer band is always a dark navy
     surface with light text and a bright brand-blue accent, whether the
     rest of the site is in light or dark mode -- it must never flip. */
  .site-footer{background:var(--footer-bg);color:var(--footer-ink);padding:clamp(48px,7vw,72px) 0 28px;}
  .footer-top{display:grid;grid-template-columns:1.15fr 1fr 1fr 1fr 1fr;gap:clamp(24px,5vw,40px);padding-bottom:44px;border-bottom:1px solid rgba(244,246,252,.14);}
  .footer-brand img{height:18px;transition:transform .35s var(--ease);}
  .footer-brand a:hover img{transform:translateY(-1px) scale(1.03);}
  .footer-brand p{margin-top:16px;color:rgba(244,246,252,.6);font-size:14px;max-width:32ch;}
  .footer-social{display:flex;gap:10px;margin-top:18px;}
  .footer-social a{
    width:34px;height:34px;border-radius:50%;flex:none;
    display:flex;align-items:center;justify-content:center;
    background:rgba(244,246,252,.08);color:rgba(244,246,252,.75);
    transition:background-color .25s var(--ease), color .25s var(--ease);
  }
  .footer-social a svg{width:17px;height:17px;}
  .footer-social a:hover{background:var(--footer-blue);color:#fff;}
  .footer-col b{
    display:flex;align-items:center;gap:8px;
    font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--footer-blue);margin-bottom:16px;font-weight:600;
  }
  .footer-col b::before{
    content:"";width:6px;height:6px;border-radius:50%;background:var(--footer-blue);flex:none;
    box-shadow:0 0 0 0 rgba(92,123,255,.5);animation:footer-dot-pulse 2.4s ease-in-out infinite;
  }
  @keyframes footer-dot-pulse{
    0%,100%{box-shadow:0 0 0 0 rgba(92,123,255,.45);}
    50%{box-shadow:0 0 0 5px rgba(92,123,255,0);}
  }
  @media (prefers-reduced-motion: reduce){ .footer-col b::before{animation:none;} }
  .footer-col ul{display:flex;flex-direction:column;gap:11px;}
  .footer-col a,.footer-col span{font-size:14px;color:rgba(244,246,252,.82);}
  .footer-col a{position:relative;display:inline-block;transition:color .3s var(--ease);}
  .footer-col a::after{
    content:"";position:absolute;left:0;right:100%;bottom:-2px;height:1px;
    background:var(--footer-blue);transition:right .35s var(--ease);
  }
  .footer-col a:hover{color:#fff;}
  .footer-col a:hover::after{right:0;}
  .footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:24px;}
  .footer-bottom p{font-size:12.5px;color:rgba(244,246,252,.62);}

  /* ================= PAGE HERO (Projects / Before-After) ================= */
  .page-hero{padding:clamp(64px,10vw,120px) 0 clamp(40px,6vw,64px);}
  .page-hero .eyebrow{margin-bottom:18px;}
  .page-hero h1{font-size:clamp(36px,6vw,64px);max-width:18ch;}
  .page-hero p{margin-top:20px;max-width:56ch;font-size:clamp(16px,1.6vw,18px);color:var(--ink-soft);}

  /* ================= GALLERY ================= */
  .gallery{padding:0 0 clamp(64px,10vw,120px);}
  .gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
  .gallery-card{
    position:relative;display:block;width:100%;padding:0;border:0;background:none;cursor:pointer;
    border-radius:var(--radius-m);overflow:hidden;aspect-ratio:4/3;box-shadow:var(--shadow);
    transition:transform .4s var(--ease), box-shadow .4s var(--ease);
  }
  .gallery-card:hover{transform:translateY(-4px);box-shadow:0 1px 1px rgba(0,0,0,.05), 0 20px 40px -14px rgba(25,30,51,.28);}
  .gallery-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease);}
  .gallery-card:hover img{transform:scale(1.06);}
  .gallery-card::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(to top, rgba(15,18,35,.78) 0%, rgba(15,18,35,.28) 38%, rgba(15,18,35,0) 62%);
    pointer-events:none;
  }
  .cat-chip{
    position:absolute;top:14px;left:14px;z-index:2;
    font-size:11.5px;font-weight:600;padding:6px 12px;border-radius:100px;
    background:rgba(251,248,241,.92);color:#1F3399;backdrop-filter:blur(6px);
    font-family:'JetBrains Mono';letter-spacing:.02em;
  }
  .gallery-info{
    position:absolute;left:18px;right:18px;bottom:16px;z-index:2;
    display:flex;flex-direction:column;gap:2px;color:#fff;text-align:left;
  }
  .gallery-info strong{font-size:17px;font-weight:600;font-family:'Work Sans';}
  .gallery-info span{font-size:13px;color:rgba(255,255,255,.78);}

  /* ================= LIGHTBOX ================= */
  .lightbox{
    position:fixed;inset:0;z-index:100;
    background:rgba(15,18,35,.92);
    display:flex;align-items:center;justify-content:center;
    padding:clamp(20px,5vw,56px);
    opacity:0;visibility:hidden;transition:opacity .3s var(--ease), visibility .3s;
  }
  .lightbox.open{opacity:1;visibility:visible;}
  .lightbox:not(.open){pointer-events:none;}
  .lightbox-figure{max-width:min(1000px,92vw);width:100%;margin:0;}
  .lightbox-figure img{width:100%;max-height:72vh;object-fit:contain;border-radius:var(--radius-m);display:block;background:#0d1020;}
  .lightbox-figure figcaption{margin-top:18px;display:flex;flex-direction:column;gap:6px;align-items:flex-start;color:#fff;}
  .lightbox-figure figcaption .cat-chip{position:static;background:rgba(255,255,255,.12);color:#fff;}
  .lightbox-figure figcaption strong{font-size:20px;font-family:'Bricolage Grotesque';font-weight:600;}
  .lightbox-figure figcaption span:last-child{font-size:14px;color:rgba(255,255,255,.65);}
  .lightbox-close,.lightbox-prev,.lightbox-next{
    position:fixed;width:46px;height:46px;border-radius:50%;
    background:rgba(255,255,255,.1);color:#fff;font-size:22px;line-height:1;
    display:flex;align-items:center;justify-content:center;
    transition:background-color .25s var(--ease);
  }
  .lightbox-close:hover,.lightbox-prev:hover,.lightbox-next:hover{background:rgba(255,255,255,.22);}
  .lightbox-close{top:24px;right:24px;}
  .lightbox-prev{left:24px;top:50%;transform:translateY(-50%);}
  .lightbox-next{right:24px;top:50%;transform:translateY(-50%);}

  /* ================= BEFORE / AFTER ================= */
  .ba-list{display:flex;flex-direction:column;gap:clamp(48px,7vw,72px);}
  .ba-caption{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px;margin:0 auto 16px;max-width:760px;}
  .ba-caption h3{font-size:clamp(19px,2.2vw,24px);}
  .ba-caption .cat-chip{position:static;background:var(--sand-3);color:var(--ink-soft);font-family:'JetBrains Mono';}
  .ba-slider{
    --pos:50%;
    position:relative;width:100%;max-width:760px;margin:0 auto;aspect-ratio:4/3;border-radius:var(--radius-l);overflow:hidden;
    box-shadow:var(--shadow);background:var(--sand-2);
    touch-action:pan-y;
  }
  .ba-frame{position:absolute;inset:0;}
  .ba-frame img{width:100%;height:100%;object-fit:cover;display:block;user-select:none;-webkit-user-drag:none;}
  .ba-frame-before{clip-path:inset(0 calc(100% - var(--pos)) 0 0);}
  .ba-divider{
    position:absolute;top:0;bottom:0;left:var(--pos);width:0;
    border-left:2px solid #fff;box-shadow:0 0 0 1px rgba(15,18,35,.25);
    transform:translateX(-1px);pointer-events:none;z-index:2;
  }
  .ba-divider::before{
    content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
    width:44px;height:44px;border-radius:50%;background:#fff;
    box-shadow:0 4px 14px rgba(15,18,35,.3);
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233D5DE8' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M8 7l-4 5 4 5M16 7l4 5-4 5'/></svg>");
    background-repeat:no-repeat;background-position:center;background-size:20px 20px;
  }
  .ba-tag{
    position:absolute;top:16px;z-index:2;
    font-family:'JetBrains Mono';font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
    padding:6px 12px;border-radius:100px;background:rgba(15,18,35,.55);color:#fff;backdrop-filter:blur(4px);
  }
  .ba-tag-before{left:16px;}
  .ba-tag-after{right:16px;}
  .ba-range{
    position:absolute;inset:0;width:100%;height:100%;margin:0;
    -webkit-appearance:none;appearance:none;background:transparent;cursor:ew-resize;z-index:3;
  }
  .ba-range::-webkit-slider-runnable-track{background:transparent;height:100%;}
  .ba-range::-webkit-slider-thumb{-webkit-appearance:none;width:44px;height:100%;background:transparent;cursor:ew-resize;}
  .ba-range::-moz-range-track{background:transparent;height:100%;border:0;}
  .ba-range::-moz-range-thumb{width:44px;height:100%;background:transparent;border:0;cursor:ew-resize;}
  .ba-range:focus-visible ~ .ba-divider::before{outline:2px solid var(--blue);outline-offset:2px;}

  /* ================= NAV DROPDOWN (Services submenu) ================= */
  .nav-item{position:relative;display:flex;align-items:center;}
  .nav-item-trigger{display:flex;align-items:center;gap:5px;}
  .nav-caret{width:16px;height:16px;flex:none;color:var(--ink-soft);transition:transform .3s var(--ease), color .25s var(--ease);}
  .nav-caret svg{width:100%;height:100%;}
  .nav-item:hover .nav-caret,.nav-item:focus-within .nav-caret{transform:rotate(180deg);color:var(--blue);}
  .nav-dropdown{
    position:absolute;top:100%;left:50%;transform:translate(-50%,6px);
    min-width:250px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);
    box-shadow:var(--shadow);padding:8px;margin-top:10px;
    display:flex;flex-direction:column;gap:1px;
    opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .25s var(--ease), transform .25s var(--ease), visibility .25s;
    z-index:50;
  }
  .nav-item:hover .nav-dropdown,.nav-item:focus-within .nav-dropdown{
    opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0);
  }
  .nav-dropdown a{
    display:block;padding:10px 14px;border-radius:var(--radius-s);
    font-size:13.5px;font-weight:500;color:var(--ink-soft);
    transition:background-color .2s var(--ease), color .2s var(--ease);
  }
  .nav-dropdown a::after{content:none;}
  .nav-dropdown a:hover{background:var(--sand-2);color:var(--blue);}
  .nav-dropdown a.view-all{
    margin-top:4px;padding-top:12px;border-top:1px solid var(--line);border-radius:0;
    font-weight:600;color:var(--blue);
  }

  /* mobile services submenu -- always expanded in the panel, no extra tap needed */
  .mobile-sub{display:flex;flex-direction:column;padding-left:14px;border-bottom:1px solid var(--line);}
  .mobile-sub a{font-size:14px;font-weight:500;padding:10px 2px;border-bottom:0;color:var(--ink-soft);}
  .mobile-sub a:last-child{padding-bottom:16px;}

  /* ================= HERO PHOTO (full-bleed background) ================= */
  .hero-top{position:relative;min-height:clamp(560px,86vh,780px);display:flex;align-items:center;overflow:hidden;}
  .hero-top .hero-inner{position:relative;z-index:2;width:100%;}
  .hero-text{min-width:0;max-width:600px;}
  .hero-photo{
    position:absolute;inset:0;width:100%;height:100%;
    overflow:hidden;background:var(--sand-2);z-index:0;
  }
  .hero-photo::before{
    content:"";position:absolute;inset:0;z-index:1;
    background:linear-gradient(100deg, rgba(9,11,24,.86) 0%, rgba(9,11,24,.66) 30%, rgba(9,11,24,.28) 58%, rgba(9,11,24,.05) 78%);
  }
  .hero-photo::after{
    content:"";position:absolute;inset:0;z-index:1;
    background:linear-gradient(to top, rgba(9,11,24,.4), transparent 40%);
  }
  .hero-photo picture{display:block;width:100%;height:100%;}
  .hero-photo img{width:100%;height:100%;object-fit:cover;display:block;}

  /* text sits directly on the photo now, so it always reads light regardless of theme */
  .hero-top .eyebrow{color:#fff;}
  .hero-top h1{color:#fff;}
  .hero-top h1 .accent{color:#9DB2FF;}
  .hero-top .lede{color:rgba(255,255,255,.85);}
  .hero-top .btn-ghost{color:#fff;border-color:rgba(255,255,255,.5);}
  .hero-top .btn-ghost:hover{border-color:#fff;color:#fff;}

  /* ================= IN ACTION (looping vertical clips) ================= */
  .in-action{padding:clamp(48px,7vw,80px) 0 clamp(56px,9vw,100px);}
  .in-action-grid{display:flex;gap:20px;margin-top:clamp(28px,4vw,40px);}
  .in-action-frame{
    position:relative;flex:1;aspect-ratio:9/16;max-width:360px;
    border-radius:var(--radius-l);overflow:hidden;box-shadow:var(--shadow);
    border:3px solid var(--surface);background:var(--sand-2);
  }
  .in-action-frame video,.in-action-frame img{width:100%;height:100%;object-fit:cover;display:block;}
  .in-action-frame::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(to top, rgba(15,18,35,.32), transparent 42%);
    pointer-events:none;
  }

  /* ================= WORK STRIP (homepage real-project photos) ================= */
  .work-strip{padding:clamp(56px,9vw,100px) 0;}
  .work-strip-foot{display:flex;justify-content:center;margin-top:clamp(28px,4vw,40px);}

  /* ================= SERVICE DETAIL PAGES ================= */
  .service-detail{padding:0 0 clamp(56px,9vw,100px);}
  .service-detail .wrap{display:grid;grid-template-columns:1.3fr .9fr;gap:clamp(32px,6vw,72px);align-items:start;}
  .service-detail-body p{color:var(--ink-soft);font-size:16px;line-height:1.7;max-width:60ch;}
  .service-detail-body .chip-row{margin-top:26px;}
  .included-list{margin-top:32px;display:flex;flex-direction:column;gap:16px;}
  .included-list li{display:flex;gap:14px;align-items:flex-start;}
  .included-list svg{width:20px;height:20px;flex:none;color:var(--blue);margin-top:1px;}
  .included-list span{font-size:15px;color:var(--ink-soft);}
  .service-detail-photo{
    border-radius:var(--radius-l);overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/5;position:sticky;top:110px;
  }
  .service-detail-photo img{width:100%;height:100%;object-fit:cover;display:block;}

  /* ---- photo carousel (service detail pages) ----
     Works with 1..N slides. A single-slide gallery gets the .carousel-single
     class from JS and simply hides the nav controls, so every service page
     can share this markup even before it has more than one photo. */
  .carousel-track{
    display:flex;width:100%;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;
    scroll-behavior:smooth;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;-ms-overflow-style:none;
  }
  .carousel-track::-webkit-scrollbar{display:none;}
  .carousel-slide{flex:0 0 100%;width:100%;height:100%;scroll-snap-align:start;}
  .carousel-slide img{width:100%;height:100%;object-fit:cover;display:block;}
  .carousel-arrow{
    position:absolute;top:50%;transform:translateY(-50%);z-index:3;
    width:38px;height:38px;border-radius:50%;border:none;padding:0;
    background:rgba(15,18,35,.55);color:#fff;display:flex;align-items:center;justify-content:center;
    cursor:pointer;transition:background-color .25s var(--ease), opacity .25s var(--ease);
    -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  }
  .carousel-arrow:hover{background:rgba(15,18,35,.8);}
  .carousel-arrow svg{width:18px;height:18px;}
  .carousel-prev{left:14px;}
  .carousel-next{right:14px;}
  .carousel-dots{
    position:absolute;left:0;right:0;bottom:16px;z-index:3;
    display:flex;align-items:center;justify-content:center;gap:8px;
  }
  .carousel-dot{
    width:7px;height:7px;border-radius:50%;border:none;padding:0;
    background:rgba(255,255,255,.55);cursor:pointer;
    transition:background-color .25s var(--ease), transform .25s var(--ease);
  }
  .carousel-dot.active{background:#fff;transform:scale(1.35);}
  .carousel-single .carousel-arrow,.carousel-single .carousel-dots{display:none;}
  .service-detail-icon{
    border-radius:var(--radius-l);box-shadow:var(--shadow);aspect-ratio:4/5;position:sticky;top:110px;
    display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;
    background:linear-gradient(155deg, var(--blue) 0%, #7B4FE0 52%, var(--gold) 100%);
  }
  .service-detail-icon::before{
    content:"";position:absolute;inset:0;opacity:.5;
    background-image:radial-gradient(circle at 20% 20%, rgba(255,255,255,.35), transparent 45%),
                      radial-gradient(circle at 82% 78%, rgba(255,255,255,.25), transparent 50%);
  }
  .service-detail-icon svg{position:relative;width:34%;height:34%;color:#fff;filter:drop-shadow(0 8px 24px rgba(15,18,35,.25));}
  .related-services{padding:clamp(48px,7vw,80px) 0;background:var(--sand-2);}
  .related-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:clamp(28px,4vw,40px);}
  .related-card{
    display:flex;flex-direction:column;gap:10px;padding:20px 18px;border-radius:var(--radius-m);
    background:var(--surface);border:1px solid var(--line);transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
  }
  .related-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--blue);}
  .related-card svg{width:20px;height:20px;color:var(--blue);}
  .related-card b{font-size:13.5px;font-weight:600;color:var(--ink);}

  /* ================= GLIMPSE (illustrative photo mosaic, not a project gallery) ================= */
  .glimpse{padding:clamp(56px,9vw,100px) 0;}
  .glimpse-grid{
    display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
    margin-top:clamp(32px,5vw,48px);
  }
  .glimpse-item{
    border-radius:var(--radius-l);overflow:hidden;aspect-ratio:3/4;box-shadow:var(--shadow);
    background:var(--sand-2);
  }
  .glimpse-item:nth-child(2){margin-top:28px;}
  .glimpse-item:nth-child(4){margin-top:-28px;}
  .glimpse-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease);}
  .glimpse-item:hover img{transform:scale(1.05);}
  @media (max-width:900px){
    .glimpse-grid{grid-template-columns:repeat(2,1fr);}
    .glimpse-item:nth-child(2),.glimpse-item:nth-child(4){margin-top:0;}
    .glimpse-item:nth-child(2n){margin-top:24px;}
  }
  @media (max-width:600px){
    .glimpse-grid{grid-template-columns:repeat(2,1fr);gap:10px;}
    .glimpse-item:nth-child(2n){margin-top:16px;}
  }

  /* ================= BACK TO TOP ================= */
  .back-to-top{
    position:fixed;right:24px;bottom:24px;z-index:60;
    width:48px;height:48px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    background:var(--blue);color:#fff;box-shadow:var(--shadow);
    opacity:0;visibility:hidden;transform:translateY(14px) scale(.9);
    transition:opacity .3s var(--ease), transform .3s var(--ease), visibility .3s, filter .2s var(--ease);
  }
  .back-to-top.show{opacity:1;visibility:visible;transform:translateY(0) scale(1);}
  .back-to-top:hover{filter:brightness(1.12);}
  .back-to-top:focus-visible{outline:2px solid var(--blue);outline-offset:3px;}
  .back-to-top svg{width:19px;height:19px;}
  @media (prefers-reduced-motion: reduce){ .back-to-top{transition:opacity .15s linear, visibility .15s;transform:none;} }
  @media (max-width:600px){ .back-to-top{right:16px;bottom:74px;width:44px;height:44px;} }

  /* ================= MOBILE STICKY CTA ================= */
  .mobile-cta-bar{display:none;}
  @media (max-width:900px){
    .mobile-cta-bar{
      display:flex;position:fixed;left:0;right:0;bottom:0;z-index:65;
      gap:10px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));
      background:var(--surface);border-top:1px solid var(--line);
      box-shadow:0 -6px 24px rgba(15,18,35,.12);
    }
    .mobile-cta-bar .btn{flex:1;justify-content:center;padding:12px 16px;font-size:14px;}
    body{padding-bottom:64px;}
    .back-to-top{bottom:80px;}
  }

  /* ================= RESPONSIVE ================= */
  @media (max-width:900px){
    .nav-links{display:none;}
    .nav-toggle{display:flex;}
    .intro .wrap,.about .wrap,.areas .wrap,.faq .wrap{grid-template-columns:1fr;}
    .service-explorer{grid-template-columns:1fr;}
    .service-tabs{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line);}
    .service-tab{border-bottom:0;border-right:1px solid var(--line);flex:none;}
    .service-tab::before{width:100%;height:3px;bottom:0;top:auto;transform:scaleX(0);}
    .service-tab.active::before{transform:scaleX(1);}
    .timeline{grid-template-columns:1fr 1fr;}
    .timeline-line{display:none;}
    .footer-top{grid-template-columns:1fr 1fr;}
    .coast-wrap{order:-1;}
    .gallery-grid{grid-template-columns:1fr 1fr;}
    .lightbox-prev{left:10px;}
    .lightbox-next{right:10px;}
    .lightbox-close{top:14px;right:14px;}

    .hero-top{min-height:92vh;align-items:flex-end;padding-bottom:44px;}
    .hero-photo::before{
      background:linear-gradient(180deg, rgba(9,11,24,.5) 0%, rgba(9,11,24,.15) 30%, rgba(9,11,24,.2) 55%, rgba(9,11,24,.88) 100%);
    }
    .in-action-grid{gap:14px;}
    .in-action-frame{max-width:none;}

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

    .service-detail .wrap{grid-template-columns:1fr;}
    .service-detail-photo,.service-detail-icon{position:static;aspect-ratio:16/10;order:-1;}
  }
  @media (max-width:600px){
    .timeline{grid-template-columns:1fr;}
    .footer-top{grid-template-columns:1fr;}
    .t-card{width:82vw;}
    .gallery-grid{grid-template-columns:1fr;}
    .lightbox-prev,.lightbox-next{width:38px;height:38px;font-size:18px;}
    .ba-slider{aspect-ratio:1/1;}

    .in-action-grid{gap:10px;flex-direction:column;align-items:center;}
    .in-action-frame{width:100%;max-width:280px;}

    .related-grid{grid-template-columns:1fr;}
  }