:root{
    --lime:#CAFF42;
    --cobalt:#2F5FED;
    --ink:#0B0B0C;
    --white:#FFFFFF;
    --mist:#F7F8FB;
    --line:#D9DAE1;
    --slate:#62626B;
    --r-lg:22px;
    --r-md:16px;
    --r-sm:10px;
    --max:1240px;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth; overflow-x:hidden; max-width:100%;}
  body{
    background:var(--white);
    color:var(--ink);
    font-family:'Inter',sans-serif;
    font-size:16px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  h1,h2,h3,.display{font-family:'Bricolage Grotesque',sans-serif; font-weight:800; letter-spacing:-0.03em; line-height:1.02;}
  em,.accent-line{font-family:'Instrument Serif',serif; font-style:italic; font-weight:400; letter-spacing:0;}
  a{color:inherit; text-decoration:none;}
  ul{list-style:none;}
  button{font-family:inherit; cursor:pointer; border:none; background:none;}
  img{max-width:100%; display:block;}
  .wrap{max-width:var(--max); margin:0 auto; padding:0 40px;}
  .sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}

  /* ---------- focus states ---------- */
  a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
    outline:2.5px solid var(--cobalt); outline-offset:3px; border-radius:4px;
  }
  .mode-cobalt a:focus-visible, .mode-cobalt button:focus-visible, .mode-ink a:focus-visible, .mode-ink button:focus-visible{
    outline-color:var(--lime);
  }

  /* ---------- diamond mark ---------- */
  .diamond{width:12px; height:12px; background:currentColor; border-radius:2px; transform:rotate(45deg) scaleY(0.62); flex-shrink:0;}

  /* ---------- progressive enhancement: reveal only hides once JS confirms it can restore it ---------- */
  .js .reveal{opacity:0; transform:translateY(24px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);}
  .js .reveal.in{opacity:1; transform:translateY(0);}
  @media (prefers-reduced-motion: reduce){
    *{transition-duration:0.001ms !important; animation-duration:0.001ms !important; scroll-behavior:auto !important;}
    .js .reveal{opacity:1 !important; transform:none !important;}
  }

  /* ---------- top nav ---------- */
  .topnav{position:fixed; top:0; left:0; right:0; z-index:300; background:var(--ink); padding:16px 0; transition:padding .25s ease;}
  .topnav.scrolled{padding:11px 0; box-shadow:0 8px 26px rgba(0,0,0,0.25);}
  .topnav .wrap{display:flex; align-items:center; justify-content:space-between; gap:20px;}
  .brand{display:flex; align-items:center; gap:9px; color:var(--white); font-family:'Inter',sans-serif; font-weight:700; font-size:13.5px; letter-spacing:0.05em; text-transform:uppercase;}
  .brand .diamond{color:var(--lime); transition:transform .4s cubic-bezier(.2,.8,.2,1);}
  .brand:hover .diamond{transform:rotate(135deg) scaleY(0.62);}
  .topnav nav ul{display:flex; gap:28px;}
  .topnav nav a{position:relative; font-size:13.5px; font-weight:500; color:rgba(255,255,255,0.72); transition:color .2s ease; padding-bottom:3px;}
  .topnav nav a::after{content:''; position:absolute; left:0; bottom:0; width:0; height:1.5px; background:var(--lime); transition:width .3s cubic-bezier(.2,.8,.2,1);}
  .topnav nav a:hover{color:#fff;}
  .topnav nav a:hover::after{width:100%;}
  .navcta{display:inline-flex; align-items:center; gap:8px; background:var(--lime); color:var(--ink); font-size:13px; font-weight:700; padding:10px 18px; border-radius:100px; white-space:nowrap; transition:background .25s ease, color .25s ease, transform .25s ease;}
  .navcta::after{content:'\2192'; transition:transform .3s cubic-bezier(.2,.8,.2,1);}
  .navcta:hover{background:var(--ink); color:var(--lime); transform:translateY(-2px);}
  .navcta:hover::after{transform:translateX(4px);}
  .desktop-only{display:flex;}
  .nav-toggle{display:none; align-items:center; justify-content:center; width:42px; height:42px; border-radius:100px; border:1.3px solid rgba(255,255,255,0.3); color:#fff;}
  .nav-toggle svg{width:19px; height:19px; stroke:currentColor; fill:none; stroke-width:2;}

  /* mobile menu overlay */
  .mobile-menu{position:fixed; inset:0; z-index:400; background:var(--ink); transform:translateY(-100%); transition:transform .35s cubic-bezier(.2,.8,.2,1), visibility 0s linear .35s; visibility:hidden; pointer-events:none; display:flex; flex-direction:column; padding:24px; overflow-y:auto;}
  .mobile-menu.open{transform:translateY(0); visibility:visible; pointer-events:auto; transition:transform .35s cubic-bezier(.2,.8,.2,1), visibility 0s linear 0s;}
  .mobile-menu-top{display:flex; justify-content:space-between; align-items:center; margin-bottom:50px;}
  .mobile-menu-close{width:42px; height:42px; border-radius:100px; border:1.3px solid rgba(255,255,255,0.3); color:#fff; display:flex; align-items:center; justify-content:center;}
  .mobile-menu-close svg{width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2;}
  .mobile-menu ul{display:flex; flex-direction:column; gap:6px;}
  .mobile-menu a{display:block; padding:16px 4px; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:26px; color:#fff; border-bottom:1px solid rgba(255,255,255,0.12);}
  .mobile-menu .navcta{margin-top:32px; display:inline-flex; justify-content:center; padding:16px; font-family:'Inter',sans-serif; font-size:16px; font-weight:700; color:var(--ink); border-bottom:none;}
  body.menu-open{overflow:hidden;}

  /* ---------- shared page anatomy ---------- */
  .page{position:relative; padding:112px 0 76px; scroll-margin-top:88px;}
  .page-top{display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:52px;}
  .page-brand{display:flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase;}
  .rule{width:44px; height:3px; margin-bottom:16px;}
  .kicker{font-size:15px; font-weight:600; margin-bottom:20px; max-width:46ch;}
  .page-headline{font-size:clamp(38px, 5.4vw, 74px); letter-spacing:-0.045em; max-width:15ch;}
  .page-sub{margin-top:20px; font-size:clamp(17px,1.4vw,19px); max-width:56ch; line-height:1.55; font-family:'Inter',sans-serif; font-style:normal;}
  .accent-callout{font-family:'Instrument Serif',serif; font-style:italic; font-size:clamp(20px,2vw,26px); margin-top:24px; max-width:32ch; line-height:1.35;}

  /* color modes */
  .mode-cobalt{background:var(--cobalt); color:#fff;}
  .mode-cobalt .rule{background:var(--lime);}
  .mode-cobalt .accent-callout{color:var(--lime);}
  .mode-cobalt .page-headline em{color:var(--lime);}
  .mode-cobalt .kicker{color:rgba(255,255,255,0.85);}

  .mode-lime{background:var(--lime); color:var(--ink);}
  .mode-lime .rule{background:var(--cobalt);}
  .mode-lime .accent-callout{color:var(--cobalt);}
  .mode-lime .page-headline em{color:var(--cobalt);}
  .mode-lime .kicker{color:rgba(11,11,12,0.72);}

  .mode-ink{background:var(--ink); color:#fff;}
  .mode-ink .rule{background:var(--lime);}
  .mode-ink .accent-callout{color:var(--lime);}
  .mode-ink .page-headline em{color:var(--lime);}
  .mode-ink .kicker{color:rgba(255,255,255,0.68);}

  .mode-white{background:var(--mist); color:var(--ink);}
  .mode-white .rule{background:var(--cobalt);}
  .mode-white .accent-callout{color:var(--cobalt);}
  .mode-white .page-headline em{color:var(--cobalt);}
  .mode-white .kicker{color:var(--slate);}

  /* ---------- buttons ---------- */
  .btn{position:relative; display:inline-flex; align-items:center; gap:10px; font-size:15px; font-weight:700; letter-spacing:0.01em; padding:16px 28px; border-radius:100px; transition:transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s ease, background .25s ease, color .25s ease; border:1.5px solid transparent;}
  .btn::after{content:'\2192'; display:inline-block; transition:transform .3s cubic-bezier(.2,.8,.2,1);}
  .btn:hover{transform:translateY(-3px);}
  .btn:hover::after{transform:translateX(5px);}
  .btn-lime{background:var(--lime); color:var(--ink); box-shadow:0 10px 24px -10px rgba(202,255,66,0.5);}
  .btn-lime:hover{background:var(--ink); color:var(--lime); box-shadow:0 16px 34px -10px rgba(0,0,0,0.4);}
  .btn-ink{background:var(--ink); color:#fff;}
  .btn-ink:hover{background:var(--lime); color:var(--ink);}
  .btn-outline{border-color:currentColor;}
  .btn-outline:hover{background:#fff; color:var(--ink) !important; box-shadow:0 16px 34px -12px rgba(0,0,0,0.35);}
  .btn-block{width:100%; justify-content:center;}
  .link-arrow{display:inline-flex; align-items:center; gap:6px; font-weight:700; font-size:14px; transition:gap .25s ease;}
  .link-arrow:hover{gap:11px;}

  /* ---------- hero ---------- */
  .hero-page{overflow:hidden;}
  .hero-glow{position:absolute; width:620px; height:620px; border-radius:50%; background:radial-gradient(circle, rgba(202,255,66,0.28), rgba(202,255,66,0) 68%); filter:blur(30px); top:-220px; right:-120px; pointer-events:none;}
  .hero-glow-2{position:absolute; width:520px; height:520px; border-radius:50%; background:radial-gradient(circle, rgba(255,255,255,0.14), rgba(255,255,255,0) 68%); filter:blur(20px); bottom:-180px; left:-140px; pointer-events:none;}
  .hero-grid{display:grid; grid-template-columns:1.15fr 0.85fr; align-items:end; gap:24px; position:relative;}
  .hero-copy{position:relative; z-index:2; padding-bottom:20px;}
  .hero-headline{font-size:clamp(46px,7.2vw,94px); letter-spacing:-0.05em; max-width:13ch; color:#fff;}
  .hero-headline em{color:var(--lime);}
  .hero-actions{display:flex; gap:16px; margin-top:36px; flex-wrap:wrap;}
  .hero-photo-wrap{position:relative; z-index:1; align-self:end; justify-self:center; width:100%; max-width:400px;}
  .hero-photo{width:100%; height:auto; filter:drop-shadow(0 30px 50px rgba(0,0,0,0.35)); transition:transform .4s cubic-bezier(.2,.8,.2,1);}
  .hero-photo-wrap:hover .hero-photo{transform:rotate(-1.5deg) scale(1.02);}

  /* ---------- tools trust bar ---------- */
  .toolsbar{background:var(--white); padding:52px 0; border-bottom:1px solid var(--line);}
  .toolsbar-label{text-align:center; font-size:11.5px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--slate); margin-bottom:32px;}
  .logo-row{display:flex; align-items:center; justify-content:center; gap:52px; flex-wrap:wrap;}
  .logo-row img{height:38px; width:auto; max-width:150px; object-fit:contain; opacity:0.85; transition:opacity .25s ease, transform .25s ease;}
  .logo-row img:hover{opacity:1; transform:translateY(-3px) scale(1.05);}

  /* ---------- 3-card allocation (positioning) ---------- */
  .alloc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:36px;}
  .alloc-card{border-radius:var(--r-md); padding:26px 24px; transition:transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease;}
  .alloc-card:hover{transform:translateY(-6px); box-shadow:0 20px 40px -18px rgba(11,11,12,0.35);}
  .alloc-card h3{font-size:19px; margin-bottom:10px;}
  .alloc-card p{font-size:14px; line-height:1.55;}
  .alloc-cobalt{background:var(--cobalt); color:#fff;}
  .alloc-cobalt p{opacity:0.88;}
  .alloc-white{background:var(--white); color:var(--ink); border:2.5px solid var(--ink);}
  .alloc-white p{opacity:0.72;}
  .alloc-ink{background:var(--lime); color:var(--ink);}
  .alloc-ink p{opacity:0.72;}

  /* ---------- services grid ---------- */
  .svc-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:8px;}
  .svc-card{background:var(--white); border:2.5px solid var(--ink); border-radius:var(--r-lg); padding:34px 32px; transition:transform .3s cubic-bezier(.2,.8,.2,1), border-color .3s ease, box-shadow .3s ease;}
  .svc-card:hover{transform:translateY(-6px); border-color:var(--cobalt); box-shadow:0 22px 44px -20px rgba(47,95,237,0.28);}
  .svc-icon{width:36px; height:36px; border-radius:50%; background:var(--cobalt); display:flex; align-items:center; justify-content:center; margin-bottom:18px; transition:transform .35s cubic-bezier(.34,1.56,.64,1), background .3s ease;}
  .svc-card:hover .svc-icon{transform:rotate(-12deg) scale(1.12); background:var(--lime);}
  .svc-card:hover .svc-icon svg{stroke:var(--ink);}
  .svc-icon svg{width:17px; height:17px; stroke:#fff; fill:none; stroke-width:1.8; transition:stroke .3s ease;}
  .svc-card h3{font-size:25px; margin-bottom:12px;}
  .svc-card .svc-value{font-size:16.5px; color:var(--slate); font-weight:400; line-height:1.6; max-width:48ch;}

  /* ---------- metric cards (proof) ---------- */
  .metric-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:40px;}
  .metric-card{border-radius:var(--r-lg); padding:32px 28px; background:var(--white); border:2.5px solid var(--ink); color:var(--ink); transition:transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease;}
  .metric-card:hover{transform:translateY(-6px) rotate(-1deg); box-shadow:0 20px 40px -18px rgba(11,11,12,0.3);}
  .metric-card:nth-child(1){background:var(--cobalt); color:#fff; border:none;}
  .metric-card:nth-child(3){background:var(--ink); color:#fff; border:none;}
  .metric-card .m-lab{font-size:12.5px; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; opacity:0.75; margin-bottom:8px;}
  .metric-card .m-val{font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(30px,3vw,42px); transition:transform .3s cubic-bezier(.34,1.56,.64,1);}
  .metric-card:hover .m-val{transform:scale(1.08); display:inline-block;}
  .metric-card .m-ctx{margin-top:12px; padding-top:12px; border-top:1px solid currentColor; border-color:rgba(127,127,127,.28); font-size:13px; line-height:1.5; opacity:.8; font-weight:500;}
  .proof-note{margin-top:28px; max-width:64ch; font-size:16px; font-weight:600; color:var(--ink); background:var(--white); border:1.5px solid var(--ink); border-radius:24px; padding:16px 24px; display:inline-block;}

  /* ---------- case studies (horizontal image carousel) ---------- */
  .case-carousel{position:relative; display:flex; align-items:center; gap:12px; margin-top:44px; padding:0 40px;}
  .case-track{display:flex; gap:22px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; -ms-overflow-style:none; scrollbar-width:none; padding:4px 0 12px;}
  .case-track::-webkit-scrollbar{display:none;}
  .case-track-item{flex:0 0 auto; width:min(72vw,520px); border:1.5px solid rgba(255,255,255,0.18); padding:0; background:none; cursor:pointer; border-radius:var(--r-lg); overflow:hidden; scroll-snap-align:start; box-shadow:0 12px 30px -16px rgba(0,0,0,0.6); transition:transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease, border-color .3s ease;}
  .case-track-item:hover{transform:translateY(-6px); border-color:var(--lime); box-shadow:0 26px 50px -20px rgba(0,0,0,0.6);}
  .case-track-item img{width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; display:block; transition:transform .5s cubic-bezier(.2,.8,.2,1);}
  .case-track-item:hover img{transform:scale(1.05);}
  .case-arrow{flex-shrink:0; width:52px; height:52px; border-radius:50%; background:var(--lime); color:var(--ink); display:flex; align-items:center; justify-content:center; transition:transform .25s ease, background .25s ease;}
  .case-arrow svg{width:22px; height:22px; stroke:currentColor; fill:none; stroke-width:2;}
  .case-arrow:hover{transform:scale(1.1); background:#fff;}
  .case-arrow:disabled{opacity:0.3; pointer-events:none;}

  /* lightbox */
  .lightbox{position:fixed; inset:0; z-index:500; background:rgba(11,11,12,0.92); display:none; align-items:center; justify-content:center; padding:40px 20px;}
  .lightbox.open{display:flex;}
  .lightbox img{max-width:min(900px,100%); max-height:88vh; width:auto; border-radius:12px;}
  .lightbox-close{position:absolute; top:24px; right:24px; width:44px; height:44px; border-radius:100px; background:rgba(255,255,255,0.12); color:#fff; display:flex; align-items:center; justify-content:center;}
  .lightbox-close svg{width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:2;}

  /* ---------- ways to work ---------- */
  .work-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:8px;}
  .work-card{background:var(--white); border:2.5px solid var(--ink); border-radius:var(--r-lg); padding:28px 26px; display:flex; flex-direction:column; transition:transform .3s cubic-bezier(.2,.8,.2,1), border-color .3s ease, box-shadow .3s ease;}
  .work-card:hover{transform:translateY(-6px); border-color:var(--cobalt); box-shadow:0 22px 44px -20px rgba(47,95,237,0.25);}
  .work-card .w-best{font-size:12.5px; color:var(--cobalt); font-weight:700; margin-bottom:10px;}
  .work-card h3{font-size:22px; margin-bottom:14px;}
  .work-card ul{margin-bottom:20px; flex-grow:1;}
  .work-card li{font-size:13.5px; color:var(--slate); line-height:1.7; padding-left:16px; position:relative; transition:color .2s ease;}
  .work-card li::before{content:'\2013'; position:absolute; left:0; color:var(--cobalt); font-weight:700;}
  .work-card:hover li{color:var(--ink);}

  /* ---------- about ---------- */
  .about-grid{display:grid; grid-template-columns:0.8fr 1.2fr; gap:56px; align-items:start;}
  .about-photo-wrap{border-radius:var(--r-lg); overflow:hidden; background:linear-gradient(155deg, var(--lime) 0%, #9FCB2E 45%, var(--ink) 130%); padding:28px 28px 0; display:flex; align-items:flex-end; justify-content:center;}
  .about-photo-wrap img{width:100%; height:auto; display:block; margin:0 auto; max-width:320px;}
  .about-copy{margin-top:24px;}
  .about-copy p{margin-top:14px; font-size:16px; max-width:56ch;}
  .about-copy p:first-child{margin-top:0;}
  .cap-grid{display:flex; gap:12px; margin-top:28px; flex-wrap:wrap;}
  .cap-chip{background:var(--mist); border:1.5px solid var(--ink); border-radius:100px; padding:10px 16px; font-size:13px; font-weight:600; transition:background .25s ease, color .25s ease, transform .25s ease;}
  .cap-chip:hover{background:var(--ink); color:var(--lime); transform:translateY(-2px);}

  /* ---------- faq ---------- */
  .faq-wrap{max-width:780px;}
  .faq-item{border-bottom:1px solid var(--line);}
  .faq-q{width:100%; text-align:left; display:flex; justify-content:space-between; align-items:center; gap:20px; padding:22px 4px; color:inherit; transition:padding-left .25s ease, color .25s ease;}
  .faq-q:hover{padding-left:10px; color:var(--cobalt);}
  .faq-q h3{font-size:17px; font-weight:700; font-family:'Bricolage Grotesque',sans-serif;}
  .faq-toggle{width:30px; height:30px; border-radius:50%; border:1.3px solid var(--line); flex-shrink:0; position:relative; transition:all .3s ease;}
  .faq-toggle::before,.faq-toggle::after{content:""; position:absolute; top:50%; left:50%; background:var(--ink); transition:transform .3s ease;}
  .faq-toggle::before{width:11px; height:1.4px; transform:translate(-50%,-50%);}
  .faq-toggle::after{width:1.4px; height:11px; transform:translate(-50%,-50%);}
  .faq-item[data-open="true"] .faq-toggle{background:var(--cobalt); border-color:var(--cobalt);}
  .faq-item[data-open="true"] .faq-toggle::before,.faq-item[data-open="true"] .faq-toggle::after{background:#fff;}
  .faq-item[data-open="true"] .faq-toggle::after{transform:translate(-50%,-50%) scaleY(0);}
  .faq-a{max-height:0; overflow:hidden; transition:max-height .35s ease;}
  .faq-a-inner{padding-bottom:22px; font-size:15px; color:var(--slate); max-width:60ch; line-height:1.65;}

  /* ---------- contact ---------- */
  .contact-grid{display:grid; grid-template-columns:0.85fr 1.15fr; gap:56px;}
  .contact-info{margin-top:32px; display:flex; flex-direction:column; gap:15px;}
  .contact-info div{font-size:14px; color:rgba(255,255,255,0.65);}
  .contact-info b{display:block; color:#fff; font-size:15px; margin-bottom:2px;}
  .card-form{background:var(--white); border-radius:var(--r-lg); padding:32px; color:var(--ink);}
  form{display:grid; gap:15px;}
  .form-row{display:grid; grid-template-columns:1fr 1fr; gap:15px;}
  .field label{font-size:12.5px; font-weight:700; color:var(--slate); display:block; margin-bottom:7px;}
  .field input,.field textarea,.field select{width:100%; padding:13px 14px; border-radius:var(--r-sm); border:1px solid var(--line); font-family:'Inter',sans-serif; font-size:14.5px; color:var(--ink); background:#fff; transition:border-color .2s ease, box-shadow .2s ease;}
  .field input:focus,.field textarea:focus,.field select:focus{outline:none; border-color:var(--cobalt); box-shadow:0 0 0 3px #E8EDFE;}
  .field textarea{resize:vertical; min-height:100px;}
  .hp-field{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}
  .form-note{font-size:12.5px; color:var(--slate); line-height:1.5;}
  .form-status{font-size:14px; font-weight:600; padding:12px 14px; border-radius:var(--r-sm); display:none;}
  .form-status.success{display:block; background:#E8FBE0; color:#1E7A34;}
  .form-status.error{display:block; background:#FDECEC; color:#B3261E;}

  /* ---------- footer ---------- */
  .sitefoot{background:var(--ink); color:rgba(255,255,255,0.8); padding:64px 0 30px;}
  .foot-top{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:40px; padding-bottom:44px; border-bottom:1px solid rgba(255,255,255,0.14);}
  .foot-brand .brand{color:#fff; margin-bottom:14px;}
  .foot-brand p{font-size:14px; max-width:34ch; line-height:1.6;}
  .foot-col h4{font-size:12px; text-transform:uppercase; letter-spacing:0.06em; color:rgba(255,255,255,0.5); margin-bottom:14px; font-weight:700;}
  .foot-col a{display:block; font-size:14px; margin-bottom:10px; color:rgba(255,255,255,0.78);}
  .foot-col a:hover{color:var(--lime);}
  .foot-bottom{margin-top:26px; display:flex; justify-content:space-between; font-size:12.5px; color:rgba(255,255,255,0.5); flex-wrap:wrap; gap:10px;}

  /* ---------- responsive ---------- */
  @media (max-width:980px){
    .wrap{padding:0 24px;}
    .desktop-only{display:none;}
    .nav-toggle{display:flex;}
    .hero-grid{grid-template-columns:1fr; align-items:center;}
    .hero-photo-wrap{max-width:260px; margin:28px auto 0; order:-1;}
    .alloc-grid,.metric-grid,.work-grid{grid-template-columns:1fr 1fr;}
    .case-carousel{padding:0 24px;}
    .svc-grid{grid-template-columns:repeat(2,1fr);}
    .about-grid,.contact-grid{grid-template-columns:1fr; gap:36px;}
    .about-photo-wrap img{max-width:240px;}
    .foot-top{grid-template-columns:1fr 1fr;}
    .page{padding-top:96px;}
  }
  @media (max-width:640px){
    .svc-grid,.alloc-grid,.metric-grid,.work-grid{grid-template-columns:1fr;}
    .case-carousel{padding:0 8px; gap:8px;}
    .case-arrow{width:40px; height:40px;}
    .case-arrow svg{width:18px; height:18px;}
    .case-track-item{width:80vw;}
    .form-row{grid-template-columns:1fr;}
    .page-top{flex-direction:column; gap:12px;}
    .hero-actions{flex-direction:column; align-items:flex-start;}
    .logo-row{gap:28px 32px;}
    .logo-row img{height:28px;}
    .foot-top{grid-template-columns:1fr;}
  }

  /* ---------- pricing cards ---------- */
  .price-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:8px;}
  .price-card{background:var(--white); border:2.5px solid var(--ink); border-radius:var(--r-lg); padding:28px 26px; display:flex; flex-direction:column; transition:transform .3s cubic-bezier(.2,.8,.2,1), border-color .3s ease, box-shadow .3s ease;}
  .price-card:hover{transform:translateY(-6px); border-color:var(--cobalt); box-shadow:0 22px 44px -20px rgba(47,95,237,0.25);}
  .price-card .p-label{font-size:12.5px; color:var(--cobalt); font-weight:700; margin-bottom:10px; text-transform:uppercase; letter-spacing:0.05em;}
  .price-card h3{font-size:21px; margin-bottom:8px;}
  .price-card .p-amount{font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:32px; margin-bottom:14px;}
  .price-card .p-summary{font-size:14.5px; color:var(--slate); line-height:1.55; margin-bottom:16px;}
  .price-card ul{margin-bottom:16px; flex-grow:1;}
  .price-card li{font-size:13.5px; color:var(--slate); line-height:1.7; padding-left:16px; position:relative;}
  .price-card li::before{content:'\2013'; position:absolute; left:0; color:var(--cobalt); font-weight:700;}
  .price-card .p-note{font-size:12.5px; color:var(--slate); margin-bottom:16px; font-style:italic;}
  .price-card .p-pill{display:inline-block; background:var(--lime); color:var(--ink); font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; padding:5px 12px; border-radius:100px; margin-bottom:14px;}
  .price-card .p-details{font-size:13px; font-weight:600; color:var(--slate); margin-bottom:14px;}
  .price-card.price-featured{border-color:var(--cobalt);}
  .price-card.price-quiet{background:var(--white); border-color:var(--ink);}
  .price-card.price-cobalt{background:var(--cobalt); border-color:var(--cobalt); color:#fff;}
  .price-card.price-cobalt .p-label{color:var(--lime);}
  .price-card.price-cobalt h3{color:#fff;}
  .price-card.price-cobalt .p-amount{color:#fff;}
  .price-card.price-cobalt .p-summary{color:rgba(255,255,255,0.82);}
  .price-card.price-cobalt li{color:rgba(255,255,255,0.82);}
  .price-card.price-cobalt li::before{color:var(--lime);}
  .price-card.price-cobalt .p-note{color:rgba(255,255,255,0.65);}
  .price-card.price-cobalt:hover{border-color:var(--lime); box-shadow:0 22px 44px -20px rgba(0,0,0,0.35);}
  .custom-panel{margin-top:22px; background:var(--ink); color:#fff; border-radius:var(--r-lg); padding:34px 32px; display:grid; grid-template-columns:1.1fr 0.9fr; gap:32px; align-items:center;}
  .custom-panel h3{font-size:24px; margin-bottom:10px; color:#fff;}
  .custom-panel .p-amount{color:var(--lime); font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:20px; margin-bottom:14px;}
  .custom-panel p{font-size:14.5px; opacity:0.85; line-height:1.6; margin-bottom:14px;}
  .custom-panel ul{margin-bottom:16px;}
  .custom-panel li{font-size:13.5px; opacity:0.85; line-height:1.7; padding-left:16px; position:relative;}
  .custom-panel li::before{content:'\2013'; position:absolute; left:0; color:var(--lime); font-weight:700;}
  .pricing-note{margin-top:24px; font-size:14px; color:var(--slate); max-width:64ch;}

  /* ---------- best fit ---------- */
  .fit-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:8px;}
  .fit-card{border-radius:var(--r-lg); padding:30px 28px;}
  .fit-card.fit-yes{background:var(--white); border:2.5px solid var(--ink);}
  .fit-card.fit-no{background:var(--mist); border:2.5px solid var(--line);}
  .fit-card{color:var(--ink);}
  .fit-card h3{font-size:20px; margin-bottom:16px; color:var(--ink);}
  .fit-card li{font-size:15.5px; color:var(--slate); line-height:1.8; padding-left:18px; position:relative; margin-bottom:6px;}
  .fit-card li::before{content:'\2013'; position:absolute; left:0; color:var(--cobalt); font-weight:700;}

  /* ---------- services intro ---------- */
  .svc-intro{margin-top:14px; max-width:60ch; font-size:16px; color:var(--slate); line-height:1.6;}
  .svc-card .svc-examples{margin-top:18px; list-style:none;}
  .svc-card .svc-examples li{font-size:15px; color:var(--slate); line-height:1.7; padding-left:16px; position:relative; margin-bottom:2px;}
  .svc-card .svc-examples li::before{content:'\2013'; position:absolute; left:0; color:var(--cobalt); font-weight:700;}

  @media (max-width:900px){
    .price-grid{grid-template-columns:1fr;}
    .custom-panel{grid-template-columns:1fr;}
    .fit-grid{grid-template-columns:1fr;}
  }


  /* ---------- overflow safety net ---------- */
  .hero-grid > *, .svc-grid > *, .price-grid > *, .alloc-grid > *, .metric-grid > *,
  .work-grid > *, .about-grid > *, .fit-grid > *, .contact-grid > *, .foot-top > *,
  .custom-panel > * { min-width: 0; }

  /* ================= multi-page additions ================= */
  /* dropdown in desktop nav */
  .topnav nav li.has-sub{position:relative;}
  .topnav nav .subnav{position:absolute; top:100%; left:-16px; min-width:250px; padding:10px; margin-top:10px; background:#fff; border:1px solid var(--line); border-radius:var(--r-md); box-shadow:0 24px 50px rgba(11,11,12,.14); display:flex; flex-direction:column; gap:2px; opacity:0; visibility:hidden; transform:translateY(6px); transition:all .22s ease; z-index:60;}
  .topnav nav li.has-sub:hover .subnav,.topnav nav li.has-sub:focus-within .subnav{opacity:1; visibility:visible; transform:translateY(0);}
  .topnav nav .subnav li{display:block;}
  .topnav nav .subnav a{display:block; padding:10px 12px; border-radius:var(--r-sm); font-size:14px; color:var(--ink);}
  .topnav nav .subnav a:hover{background:var(--mist); color:var(--cobalt);}

  /* breadcrumb */
  .breadcrumb{background:var(--ink); padding:96px 0 0;}
  .breadcrumb .wrap{display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:13px; color:rgba(255,255,255,.6);}
  .breadcrumb a{color:rgba(255,255,255,.72);}
  .breadcrumb a:hover{color:var(--lime);}
  .breadcrumb .crumb-sep{opacity:.4;}
  .subhero{padding-top:44px; position:relative; overflow:hidden;}
  .subhero .hero-headline{max-width:16ch;}

  /* generic content bits */
  .col-2{display:grid; grid-template-columns:1fr 1fr; gap:32px; margin-top:38px;}
  .tick-list,.cross-list{list-style:none; display:flex; flex-direction:column; gap:14px; max-width:60ch;}
  .tick-list li,.cross-list li{position:relative; padding-left:30px; font-size:15.5px; line-height:1.6; color:inherit;}
  .tick-list li::before{content:""; position:absolute; left:0; top:6px; width:16px; height:16px; border-radius:50%; background:var(--cobalt);}
  .tick-list li::after{content:""; position:absolute; left:5px; top:10px; width:6px; height:3px; border-left:1.6px solid #fff; border-bottom:1.6px solid #fff; transform:rotate(-45deg);}
  .mode-ink .tick-list li::before,.mode-cobalt .tick-list li::before{background:var(--lime);}
  .mode-ink .tick-list li::after,.mode-cobalt .tick-list li::after{border-color:var(--ink);}
  .cross-list li::before{content:"\00d7"; position:absolute; left:0; top:-1px; width:18px; height:18px; font-size:18px; line-height:1; font-weight:700; color:var(--cobalt);}
  .step-list{counter-reset:step; list-style:none; display:flex; flex-direction:column; gap:20px; margin-top:38px; max-width:70ch;}
  .step-list li{counter-increment:step; position:relative; padding-left:52px; font-size:15.5px; line-height:1.65;}
  .step-list li::before{content:counter(step); position:absolute; left:0; top:0; width:34px; height:34px; border-radius:50%; display:grid; place-items:center; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:14px; background:var(--lime); color:var(--ink);}
  .step-list b{display:block; font-family:'Bricolage Grotesque',sans-serif; margin-bottom:4px;}
  .fit-block h3{font-family:'Bricolage Grotesque',sans-serif; font-size:19px; margin-bottom:18px;}
  .source-note{margin-top:22px; font-size:13px; opacity:.7; max-width:60ch;}
  .kv-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:40px; max-width:820px;}
  .kv-grid dt{font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--lime); margin-bottom:6px;}
  .kv-grid dd{color:#fff; font-size:15.5px; line-height:1.5;}
  .case-figure{margin-top:44px; border-radius:var(--r-lg); overflow:hidden; border:1px solid rgba(11,11,12,.12);}
  .case-figure img{display:block; width:100%; height:auto;}
  .draft-note{display:flex; flex-direction:column; gap:6px; padding:18px 22px; margin-bottom:34px; border-radius:var(--r-md); background:#FFF6DA; border:1px solid #E9CE7A; font-size:14px; line-height:1.55; color:#5C4708;}

  /* links out to services / case studies */
  .svc-link{color:inherit; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px;}
  .svc-link:hover{color:var(--cobalt);}
  .case-links{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:34px;}
  .case-link-card{display:flex; flex-direction:column; gap:4px; padding:20px 22px; border-radius:var(--r-md); background:var(--ink); color:#fff; transition:transform .22s ease;}
  .case-link-card b{font-family:'Bricolage Grotesque',sans-serif; font-size:17px;}
  .case-link-card span{font-size:13.5px; opacity:.72;}
  .case-link-card:hover{transform:translateY(-3px);}
  .case-track-meta{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 4px 0;}
  .case-track-meta span{font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:15px;}
  .case-track-link{font-size:13.5px; font-weight:600; color:var(--lime); white-space:nowrap;}
  .case-track-link:hover{text-decoration:underline;}

  /* single featured testimonial quote (homepage) */
  .testimonial-figure{max-width:900px; margin-top:44px;}
  .testimonial-quote{font-family:'Instrument Serif',serif; font-style:italic; font-weight:400;
    font-size:clamp(26px,3.4vw,40px); line-height:1.4; color:var(--ink);}
  .testimonial-attribution{margin-top:28px; display:flex; flex-direction:column; font-style:normal;}
  .testimonial-attribution b{font-family:'Bricolage Grotesque',sans-serif; font-size:16px; font-weight:700;}
  .testimonial-attribution span{color:var(--slate); font-size:14px; margin-top:2px;}

  /* testimonials (used when the block is switched on) */
  .quote-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:40px;}
  .quote-card{padding:26px; border:1px solid var(--line); border-radius:var(--r-md); background:#fff; display:flex; flex-direction:column; gap:18px;}
  .quote-card blockquote{font-family:'Inter',sans-serif; font-style:normal; font-size:16.5px; line-height:1.6; color:var(--ink);}
  .quote-card figcaption{display:flex; flex-direction:column; font-size:13.5px;}
  .quote-card figcaption b{font-family:'Bricolage Grotesque',sans-serif;}
  .quote-card figcaption span{color:var(--slate);}

  /* closing CTA band */
  .cta-band-inner{display:flex; align-items:center; justify-content:space-between; gap:40px; flex-wrap:wrap;}
  .cta-band .page-headline{max-width:18ch;}
  .cta-band-actions{display:flex; flex-direction:column; gap:12px; min-width:260px;}

  @media (max-width:860px){
    .col-2,.case-links,.kv-grid,.quote-grid{grid-template-columns:1fr;}
    .cta-band-inner{flex-direction:column; align-items:flex-start;}
    .cta-band-actions{width:100%;}
  }

  /* skills chips on dark case-study sections */
  .mode-ink .cap-chip{background:transparent; border:1.5px solid rgba(255,255,255,0.28); color:#fff;}
  .mode-ink .cap-chip:hover{background:var(--lime); border-color:var(--lime); color:var(--ink);}

  /* testimonial placeholder state */
  .quote-card .q-tag{display:inline-block; align-self:flex-start; font-size:11px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; padding:5px 11px; border-radius:100px; background:var(--mist); color:var(--slate); border:1px solid var(--line);}
  .quote-card.is-placeholder{border-style:dashed; background:transparent;}
  .quote-card.is-placeholder blockquote{color:var(--slate);}
  .quote-card.is-placeholder figcaption b,.quote-card.is-placeholder figcaption span{color:var(--slate); opacity:.75;}

  /* --- clickable case cards on the homepage carousel --- */
  a.case-track-card{display:block; text-decoration:none; color:inherit; position:relative;}
  a.case-track-card .case-track-meta{padding:14px 16px 16px;}
  a.case-track-card .case-track-name{font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:15px;}
  a.case-track-card .case-track-link{display:inline-flex; align-items:center; gap:7px; font-size:13.5px; font-weight:600; color:var(--lime);}
  a.case-track-card .ctl-arrow{transition:transform .3s ease; display:inline-block;}
  a.case-track-card:hover .ctl-arrow,a.case-track-card:focus-visible .ctl-arrow{transform:translateX(4px);}
  a.case-track-card:hover .case-track-link{text-decoration:underline;}
  a.case-track-card:focus-visible{outline:3px solid var(--lime); outline-offset:3px;}

  /* --- company badge on testimonial cards --- */
  .quote-card figcaption{flex-direction:row; align-items:center; gap:12px;}
  .quote-card .q-meta{display:flex; flex-direction:column;}
  .q-logo{flex:0 0 auto; width:46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center;
          font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:13px; letter-spacing:0.02em; color:#fff;}
  .badge-taas,.badge-air-ambulance{background:#C8102E;}
  .badge-rg,.badge-red-gorilla{background:#B5121B;}
  .badge-jx,.badge-jirox{background:var(--cobalt);}
  .badge-mx,.badge-moverx{background:#0B0B0C; color:var(--lime);}
  .badge-taas,.badge-air-ambulance{font-size:11px;}
  .quote-card figcaption .q-logo{color:#fff;}
  .quote-card figcaption .badge-mx,.quote-card figcaption .badge-moverx{color:var(--lime);}