@layer reset, base, components, utilities;

@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body, h1, h2, h3, p, ol, ul { margin: 0; }
  ol, ul { padding: 0; }
  img, picture { display: block; max-width: 100%; }
  button, input, select, textarea { font: inherit; }
}

/* Multi-page site experience */
@layer components {
  .container { width: min(calc(100% - 2rem), var(--max-width)); margin-inline: auto; }
  .narrow { max-width: 58rem; }
  .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
  .site-nav a[aria-current="page"] { color: var(--primary); }
  .site-nav a[aria-current="page"]::after { content: ""; position: absolute; right: 0; bottom: -.55rem; left: 0; height: 3px; background: var(--orange); border-radius: 999px; }
  .site-nav .button-small { min-height: 2.9rem; padding-inline: 1.2rem; color: var(--white); background: var(--primary); }
  .menu-toggle { flex-direction: column; width: 3rem; min-width: 3rem; gap: .25rem; }
  .menu-toggle > span:not(.sr-only) { width: 1.2rem; height: 2px; background: currentColor; }

  .home-hero::before, .page-hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(color-mix(in oklch, var(--white) 12%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in oklch, var(--white) 12%, transparent) 1px, transparent 1px); background-size: 3.2rem 3.2rem; mask-image: linear-gradient(90deg, transparent, #000 40%, #000); }
  .home-hero .hero-grid { position: relative; z-index: 1; inset: auto; min-height: min(47rem, calc(100vh - 7.25rem)); display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: clamp(3rem, 7vw, 7rem); padding-block: clamp(4.5rem, 8vw, 7rem); opacity: 1; background: none; mask-image: none; }
  .home-hero .hero-lead { max-width: 43rem; margin-top: 1.6rem; color: oklch(.93 .018 230); font-size: clamp(1.08rem, 1.7vw, 1.3rem); }
  .tagline i { width: .38rem; aspect-ratio: 1; background: var(--orange); }
  .button-row { display: flex; flex-wrap: wrap; align-items: center; gap: 1.2rem 1.7rem; margin-top: 2rem; }
  .home-hero .text-link { color: var(--white); }
  .text-link.dark { color: var(--primary); }
  .solution-orbit { position: relative; width: min(100%, 30rem); aspect-ratio: 1; margin-inline: auto; border: 1px solid color-mix(in oklch, var(--cyan) 50%, transparent); border-radius: 50%; }
  .solution-orbit::before { content: ""; position: absolute; inset: 22%; border: 1px solid color-mix(in oklch, var(--white) 28%, transparent); border-radius: 50%; }
  .orbit-core { position: absolute; z-index: 2; inset: 33%; display: grid; place-content: center; text-align: center; color: var(--primary-deep); background: var(--white); border-radius: 50%; box-shadow: 0 0 0 .55rem color-mix(in oklch, var(--cyan) 18%, transparent); }
  .orbit-core small, .orbit-core strong { display: block; }.orbit-core strong { font-family: var(--font); font-size: 1.35rem; }
  .orbit-item { position: absolute; z-index: 3; width: 5.5rem; aspect-ratio: 1; display: grid; place-content: center; text-align: center; color: var(--white); background: var(--primary-deep); border: 1px solid color-mix(in oklch, var(--cyan) 70%, var(--white)); border-radius: 50%; font-size: .68rem; }
  .orbit-item b { display: block; color: var(--cyan); font-family: var(--font); font-size: 1.1rem; }.orbit-ai{top:-3%;left:40%}.orbit-it{top:17%;right:-3%}.orbit-code{right:4%;bottom:5%}.orbit-people{bottom:-4%;left:34%}.orbit-web{left:-3%;bottom:18%}.orbit-media{top:18%;left:-5%}

  .section-kicker { margin-bottom: .75rem; color: var(--primary-light); font-family: var(--font); font-weight: 800; }
  .section-kicker.light { color: var(--cyan); }
  .section-lead, .large-copy { color: var(--ink-soft); font-size: clamp(1.12rem, 1.8vw, 1.35rem); }
  .section-tint { background: var(--surface); }
  .split-intro, .story-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(2rem, 7vw, 7rem); align-items: start; }
  .split-intro h2, .story-grid h2 { max-width: 13ch; }
  .split-intro .text-link { margin-top: 1.5rem; }
  .section-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 3rem; }
  .section-heading h2 { max-width: 15ch; }
  .project-showcase { display: grid; grid-template-columns: 1.15fr .85fr; gap: 1.2rem; }
  .project-panel { min-height: 28rem; display: grid; grid-template-rows: 12rem 1fr; overflow: hidden; color: var(--ink); background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); }
  .project-panel:first-child { grid-row: span 2; grid-template-rows: 1fr auto; }
  .project-panel.project-dark { color: var(--white); background: var(--primary-deep); border-color: var(--primary-deep); }
  .project-panel.project-orange { background: oklch(.96 .035 72); }
  .project-visual, .case-visual { position: relative; min-height: 13rem; overflow: hidden; }
  .project-body { padding: clamp(1.4rem, 3vw, 2.2rem); }.project-body h3 { margin-bottom: .8rem; }.project-body p:not(.project-type) { color: var(--ink-soft); }.project-dark .project-body p:not(.project-type) { color: oklch(.87 .02 230); }.project-body a { display: inline-block; margin-top: 1.2rem; font-weight: 750; text-underline-offset: .3rem; }
  .project-type { margin-bottom: .55rem; color: var(--primary-light); font-family: var(--font); font-size: .86rem; font-weight: 800; }.project-dark .project-type { color: var(--cyan); }
  .training-board { display: grid; grid-template-columns: repeat(3,1fr); place-content: center; gap: .5rem; padding: 2rem; background: linear-gradient(145deg, var(--primary), var(--primary-deep)); }.training-board span { display: grid; place-items: center; min-height: 4rem; color: var(--focus); background: color-mix(in oklch, var(--primary-deep) 82%, black); border: 1px solid var(--cyan); font-family: var(--font); font-size: 1.4rem; font-weight: 800; }.training-board strong { grid-column: 1/-1; padding: .7rem; color: var(--primary-deep); background: var(--cyan); text-align: center; }
  .policy-visual { display: grid; align-content: center; gap: .65rem; padding: 2rem; background: linear-gradient(135deg,var(--orange),oklch(.93 .1 80)); }.policy-visual span { color: var(--primary-deep); font-family: var(--font); font-size: 2.4rem; font-weight: 900; }.policy-visual i { height: .55rem; background: color-mix(in oklch,var(--primary-deep) 70%,transparent); }.policy-visual i:nth-of-type(2){width:80%}.policy-visual i:nth-of-type(3){width:60%}

  .capability-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(3rem, 8vw, 8rem); }.capability-copy { position: sticky; top: 8rem; align-self: start; }.capability-copy h2 { max-width: 12ch; }.capability-copy p:not(.section-kicker) { margin: 1.4rem 0 2rem; color: var(--ink-soft); font-size: 1.12rem; }.capability-list { border-top: 1px solid var(--line); }.capability-list a { display: grid; grid-template-columns: 3rem 1fr; column-gap: 1rem; padding-block: 1.55rem; border-bottom: 1px solid var(--line); text-decoration: none; }.capability-list a:hover strong { color: var(--primary-light); }.capability-list span { grid-row: span 2; color: var(--orange-dark); font-family: var(--font); font-weight: 800; }.capability-list strong { font-family: var(--font); font-size: 1.35rem; transition: color .2s; }.capability-list small { color: var(--ink-soft); }
  .why-band { color: var(--white); background: var(--primary-deep); }.why-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(3rem,8vw,8rem); }.why-grid h2 { max-width: 10ch; }.why-points p { display:grid; gap:.35rem; padding:1.5rem 0; border-top:1px solid color-mix(in oklch,var(--white) 20%,transparent); }.why-points strong { color:var(--cyan); font-family:var(--font); font-size:1.25rem; }.why-points span { color:oklch(.88 .02 230); }
  .cta-panel { display:grid; grid-template-columns:1fr .75fr; align-items:center; gap:clamp(2rem,7vw,7rem); padding:clamp(2rem,5vw,4rem); color:var(--white); background:var(--primary); border-radius:var(--radius); }.cta-panel h2{max-width:13ch}.cta-panel p:not(.section-kicker){margin-bottom:1.4rem;color:oklch(.91 .02 230)}

  .page-hero { position:relative; isolation:isolate; overflow:hidden; padding-block:clamp(5rem,10vw,9rem); color:var(--white); background:linear-gradient(135deg,var(--primary-deep),var(--primary) 58%,oklch(.35 .1 220)); }.page-hero .container{position:relative;z-index:1}.page-hero h1{max-width:12ch}.page-hero p:last-child{max-width:45rem;margin-top:1.5rem;color:oklch(.91 .025 230);font-size:clamp(1.12rem,2vw,1.35rem)}
  .service-index{padding-block:1.2rem;border-bottom:1px solid var(--line)}.service-index nav{display:flex;gap:.7rem;overflow:auto;padding-bottom:.2rem}.service-index a{flex:0 0 auto;padding:.55rem .9rem;color:var(--primary);background:var(--surface);border-radius:999px;font-weight:700;text-decoration:none}
  .service-detail{padding-block:clamp(4.5rem,8vw,7rem);scroll-margin-top:7rem}.service-detail.alternate{background:var(--surface)}.service-grid{display:grid;grid-template-columns:.18fr .9fr .8fr;gap:clamp(2rem,5vw,5rem);align-items:start}.service-number{color:var(--orange-dark);font-family:var(--font);font-size:1.35rem;font-weight:900}.service-grid h2{max-width:13ch}.service-grid>div:nth-child(2)>p:last-child{margin-top:1.4rem;color:var(--ink-soft);font-size:1.08rem}.deliverables{padding-top:.3rem;border-top:3px solid var(--cyan)}.deliverables h3{margin:1rem 0}.deliverables ul{padding-left:1.2rem;color:var(--ink-soft)}.deliverables li+li{margin-top:.55rem}
  .case-list{padding-top:3rem}.case-study{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,6vw,6rem);align-items:center;padding-block:clamp(3rem,7vw,6rem);border-bottom:1px solid var(--line)}.case-study.reverse .case-visual{order:2}.case-study .case-visual{min-height:25rem;border-radius:var(--radius)}.case-copy h2{max-width:15ch;margin:.8rem 0 1rem;font-size:clamp(2.1rem,4vw,3.8rem)}.case-meta{display:flex;flex-wrap:wrap;gap:.55rem}.case-meta span{padding:.35rem .65rem;color:var(--primary);background:var(--cyan-pale);border-radius:999px;font-size:.78rem;font-weight:750}.case-summary{color:var(--ink-soft);font-size:1.12rem}.case-copy dl{margin:1.8rem 0 0}.case-copy dl div{display:grid;grid-template-columns:6rem 1fr;gap:1rem;padding:1rem 0;border-top:1px solid var(--line)}.case-copy dt{font-family:var(--font);font-weight:800}.case-copy dd{margin:0;color:var(--ink-soft)}
  .product-visual{display:grid;place-content:center;background:radial-gradient(circle at 50% 45%,oklch(.46 .15 260),var(--primary-deep))}.product-visual>span{color:var(--white);font-family:var(--font);font-size:8rem;font-weight:900}.product-visual i{position:absolute;color:var(--orange);font-size:2.2rem;font-style:normal}.product-visual i:nth-of-type(1){top:15%;left:18%}.product-visual i:nth-of-type(2){right:18%;top:25%}.product-visual i:nth-of-type(3){right:25%;bottom:12%}
  .research-visual{display:grid;align-content:center;gap:1rem;padding:2.5rem;background:var(--surface)}.research-visual span{padding:1rem;border:2px solid var(--primary);font-family:var(--font);font-size:1.5rem;font-weight:800}.research-visual span:nth-child(2){margin-left:12%;color:var(--orange-dark);border-color:var(--orange)}.research-visual span:nth-child(3){margin-left:24%;color:var(--primary-light);border-color:var(--cyan)}
  .story-grid .large-copy{margin-bottom:1.5rem}.process-list{list-style:none;border-top:1px solid var(--line)}.process-list li{display:grid;grid-template-columns:5rem 1fr;gap:2rem;padding:2rem 0;border-bottom:1px solid var(--line)}.process-list li>span{color:var(--orange-dark);font-family:var(--font);font-size:1.3rem;font-weight:900}.process-list h3{margin-bottom:.4rem}.process-list p{color:var(--ink-soft)}.values-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:clamp(3rem,8vw,8rem)}.values-grid>div:last-child{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.values-grid article{padding-top:1.2rem;border-top:3px solid var(--cyan)}.values-grid article p{margin-top:.7rem;color:var(--ink-soft)}
  .contact-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(3rem,7vw,7rem);align-items:start}.contact-details{position:sticky;top:8rem}.contact-details h2{max-width:11ch;margin-bottom:2rem}.contact-method{display:grid;padding:1rem 0;border-top:1px solid var(--line);text-decoration:none}.contact-method span{color:var(--ink-soft);font-size:.82rem}.contact-method strong{overflow-wrap:anywhere;color:var(--primary)}.contact-note{margin-top:1.5rem;color:var(--ink-soft);font-size:.9rem}.consultation-form{padding:clamp(1.5rem,4vw,3rem);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}.form-heading{margin-bottom:2rem}.form-heading p:last-child{margin-top:.7rem;color:var(--ink-soft)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}.form-grid label{display:grid;gap:.4rem;font-weight:700}.form-grid .full{grid-column:1/-1}.form-grid input,.form-grid select,.form-grid textarea{width:100%;padding:.75rem .85rem;color:var(--ink);background:var(--white);border:1px solid oklch(.65 .04 245);border-radius:8px}.form-grid input,.form-grid select{min-height:3.1rem}.form-grid textarea{resize:vertical}.form-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.4rem}.button-outline{color:var(--primary);background:transparent;border:2px solid var(--primary)}.form-status{min-height:1.5rem;margin-top:.8rem;color:var(--primary);font-weight:700}.next-step{display:grid;grid-template-columns:.75fr 1.25fr;gap:clamp(3rem,8vw,8rem)}.next-step ol{list-style:none}.next-step li{display:grid;grid-template-columns:2.5rem 1fr;gap:1rem;padding:1.2rem 0;border-top:1px solid var(--line)}.next-step li>span{color:var(--orange-dark);font-family:var(--font);font-weight:900}.next-step strong{display:block}
  .site-footer{padding-block:4rem 1.5rem;color:var(--white);background:oklch(.2 .07 250)}.footer-grid{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:2.5rem;padding-bottom:3rem}.footer-grid>div{display:grid;align-content:start;gap:.45rem}.footer-grid img{width:12rem;padding:.35rem;background:var(--white)}.footer-grid p{color:var(--cyan);font-family:var(--font);font-size:.82rem;font-weight:800}.footer-grid strong{margin-bottom:.5rem;color:var(--cyan);font-family:var(--font)}.footer-grid a{color:oklch(.9 .02 230);text-decoration:none}.footer-grid a:hover{text-decoration:underline}.site-footer .footer-bottom{border-top:1px solid color-mix(in oklch,var(--white) 18%,transparent)}.back-to-top small{font-size:.65rem;text-transform:uppercase}
  .motion-ready .reveal{opacity:0;transform:translateY(1.6rem)}.motion-ready .reveal.is-revealed{opacity:1;transform:none;transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
}

@layer utilities {
  @media (max-width: 900px){.home-hero .hero-grid,.split-intro,.story-grid,.capability-layout,.why-grid,.cta-panel,.service-grid,.case-study,.values-grid,.contact-grid,.next-step{grid-template-columns:1fr}.solution-orbit{width:min(100%,25rem)}.project-showcase{grid-template-columns:1fr 1fr}.project-panel:first-child{grid-column:1/-1;grid-row:auto;min-height:32rem}.capability-copy,.contact-details{position:static}.service-number{display:none}.case-study.reverse .case-visual{order:0}.footer-grid{grid-template-columns:1.5fr 1fr 1fr}.footer-grid>div:last-child{grid-column:2}.home-hero .hero-grid{min-height:auto}.site-nav .button-small{justify-content:center}}
  @media (max-width:620px){.section{padding-block:4.5rem}.project-showcase{grid-template-columns:1fr}.project-panel:first-child{grid-column:auto}.section-heading{display:grid}.section-heading>a{justify-self:start}.case-study .case-visual{min-height:18rem}.case-copy dl div{grid-template-columns:1fr;gap:.25rem}.values-grid>div:last-child,.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}.footer-grid>div:last-child{grid-column:auto}.orbit-item{width:4.6rem}.home-hero .hero-grid{padding-block:4rem 5rem}.button-row .button{width:100%}.cta-panel{padding:2rem}.process-list li{grid-template-columns:3rem 1fr;gap:1rem}}
  @media (prefers-reduced-motion:no-preference){.solution-orbit::before{animation:orbitPulse 5s ease-in-out infinite}.orbit-item{animation:floatNode 5s ease-in-out infinite}.orbit-item:nth-of-type(even){animation-delay:-2.5s}@keyframes orbitPulse{50%{transform:scale(1.04);opacity:.75}}@keyframes floatNode{50%{transform:translateY(-5px)}}}
}

@layer base {
  :root {
    --ink: oklch(0.22 0.045 250);
    --ink-soft: oklch(0.39 0.045 246);
    --primary-deep: oklch(0.27 0.105 250);
    --primary: oklch(0.34 0.13 248);
    --primary-light: oklch(0.49 0.15 240);
    --cyan: oklch(0.74 0.14 205);
    --cyan-pale: oklch(0.93 0.055 215);
    --orange: oklch(0.72 0.18 63);
    --orange-dark: oklch(0.54 0.16 55);
    --white: oklch(1 0 0);
    --surface: oklch(0.965 0.012 240);
    --line: oklch(0.87 0.023 240);
    --focus: oklch(0.79 0.17 82);
    --max-width: 75rem;
    --radius: 14px;
    --font: Bahnschrift, "Arial Narrow", "Roboto Condensed", Arial, sans-serif;
    --body-font: "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
    --scroll-ratio: 0;
    --z-sticky: 20;
    --z-floating: 30;
  }

  body {
    min-width: 20rem;
    color: var(--ink);
    background: var(--white);
    font-family: var(--body-font);
    font-size: 1rem;
    line-height: 1.65;
    text-rendering: optimizeLegibility;
  }

  body::selection { color: var(--primary-deep); background: var(--cyan); }
  h1, h2, h3 { font-family: var(--font); line-height: 1.05; text-wrap: balance; }
  h1 { font-size: clamp(3rem, 6.6vw, 5.75rem); letter-spacing: -0.035em; }
  h2 { font-size: clamp(2.35rem, 4.6vw, 4.5rem); letter-spacing: -0.03em; }
  h3 { font-size: clamp(1.25rem, 2vw, 1.7rem); letter-spacing: -0.015em; }
  p { text-wrap: pretty; }
  a { color: inherit; }
  :focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }

  .shell { width: min(calc(100% - 2rem), var(--max-width)); margin-inline: auto; }
  .section { padding-block: clamp(5rem, 10vw, 9rem); }
  section[id] { scroll-margin-top: 6.5rem; }
}

@layer components {
  .skip-link {
    position: fixed;
    z-index: calc(var(--z-sticky) + 1);
    inset: 0 auto auto 1rem;
    padding: .75rem 1rem;
    color: var(--white);
    background: var(--primary-deep);
    transform: translateY(-120%);
  }
  .skip-link:focus { transform: translateY(1rem); }

  .site-header {
    position: sticky;
    z-index: var(--z-sticky);
    top: 0;
    background: color-mix(in oklch, var(--white) 94%, transparent);
    border-bottom: 1px solid var(--line);
    backdrop-filter: blur(12px);
    transition: box-shadow .25s var(--ease-out), background-color .25s var(--ease-out);
  }
  .site-header[data-scrolled="true"] { background: color-mix(in oklch, var(--white) 98%, transparent); box-shadow: 0 4px 8px color-mix(in oklch, var(--primary-deep) 12%, transparent); }
  .header-inner { min-height: 7.25rem; display: flex; align-items: center; justify-content: space-between; gap: 2rem; transition: min-height .3s var(--ease-out); }
  .brand { flex: 0 0 auto; width: clamp(12.5rem, 16vw, 15rem); transition: width .3s var(--ease-out); }
  .brand img { width: 100%; height: auto; display: block; object-fit: contain; }
  .site-header[data-scrolled="true"] .header-inner { min-height: 5.5rem; }
  .site-header[data-scrolled="true"] .brand { width: 11.5rem; }

  .site-nav { display: flex; align-items: center; gap: clamp(1.1rem, 2.6vw, 2.25rem); font-weight: 650; }
  .site-nav a { position: relative; text-decoration: none; text-underline-offset: .35rem; }
  .site-nav a:not(.nav-cta):not(.button):hover { color: var(--primary-light); text-decoration: underline; }
  .site-nav a:not(.nav-cta):not(.button)[aria-current="location"] { color: var(--primary); }
  .site-nav a:not(.nav-cta):not(.button)[aria-current="location"]::after { content: ""; position: absolute; right: 0; bottom: -.55rem; left: 0; height: 3px; background: var(--orange); border-radius: 999px; }
  .nav-cta { min-height: 2.9rem; display: inline-flex; align-items: center; padding-inline: 1.25rem; color: var(--white); background: var(--primary); border-radius: 999px; }
  .nav-cta:hover { background: var(--primary-deep); transform: translateY(-1px); }

  .menu-toggle { min-width: 5.6rem; min-height: 2.8rem; display: none; align-items: center; justify-content: center; gap: .7rem; color: var(--ink); background: transparent; border: 1px solid var(--primary); border-radius: 999px; cursor: pointer; }
  .menu-icon { width: 1.15rem; display: grid; gap: .3rem; }
  .menu-icon i { display: block; height: 2px; background: currentColor; transition: transform .25s var(--ease-out); }
  .menu-toggle[aria-expanded="true"] .menu-icon i:first-child { transform: translateY(3px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] .menu-icon i:last-child { transform: translateY(-3px) rotate(-45deg); }

  .scroll-progress { position: fixed; z-index: calc(var(--z-sticky) + 1); top: 7.25rem; right: 0; left: 0; height: 3px; pointer-events: none; transition: top .3s var(--ease-out); }
  .site-header[data-scrolled="true"] + .scroll-progress { top: 5.5rem; }
  .scroll-progress span { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, var(--cyan), var(--orange)); transform: scaleX(var(--scroll-ratio)); transform-origin: left center; }

  .hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    color: var(--white);
    background:
      radial-gradient(circle at 80% 18%, color-mix(in oklch, var(--cyan) 28%, transparent), transparent 27rem),
      linear-gradient(130deg, var(--primary-deep), var(--primary) 54%, oklch(0.29 0.095 229));
  }
  .hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    right: -10rem;
    bottom: -13rem;
    width: 34rem;
    aspect-ratio: 1;
    border: 1px solid color-mix(in oklch, var(--cyan) 42%, transparent);
    border-radius: 50%;
  }
  .hero-grid {
    position: absolute;
    z-index: -2;
    inset: 0;
    opacity: .12;
    background-image:
      linear-gradient(color-mix(in oklch, var(--white) 35%, transparent) 1px, transparent 1px),
      linear-gradient(90deg, color-mix(in oklch, var(--white) 35%, transparent) 1px, transparent 1px);
    background-size: 3.25rem 3.25rem;
    mask-image: linear-gradient(90deg, transparent, black 38%, black);
  }
  .hero-layout { min-height: min(48rem, calc(100vh - 5.2rem)); display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(22rem, .88fr); align-items: center; gap: clamp(3rem, 7vw, 7rem); padding-block: clamp(5rem, 9vw, 8rem); }
  .hero-copy { max-width: 47rem; }
  .tagline { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; margin-bottom: 1.5rem; color: var(--cyan); font-family: var(--font); font-size: .9rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
  .tagline b { color: var(--orange); font-size: 1.2rem; }
  .hero h1 { max-width: 12ch; }
  .hero-intro { max-width: 43rem; margin-top: 1.75rem; color: oklch(0.93 0.018 230); font-size: clamp(1.12rem, 1.7vw, 1.35rem); line-height: 1.65; }
  .hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.35rem 1.75rem; margin-top: 2.25rem; }
  .button { min-height: 3.25rem; display: inline-flex; align-items: center; justify-content: center; padding: .8rem 1.4rem; border: 0; border-radius: 999px; font-weight: 750; line-height: 1.2; text-decoration: none; cursor: pointer; transition: transform .25s var(--ease-out), background-color .25s var(--ease-out); }
  .button:hover { transform: translateY(-2px); }
  .button:active { transform: translateY(0) scale(.98); }
  .button-accent { color: var(--primary-deep); background: var(--orange); }
  .button-accent:hover { background: oklch(0.78 0.17 70); }
  .text-link { display: inline-flex; gap: .5rem; align-items: center; color: var(--primary); font-weight: 750; text-decoration-thickness: 2px; text-underline-offset: .35rem; }
  .text-link:hover span { transform: translate(.15rem, -.1rem); }
  .text-link span { transition: transform .25s var(--ease-out); }
  .text-link-light { color: var(--white); }

  .capability-map { position: relative; width: min(100%, 29rem); aspect-ratio: 1; margin-inline: auto; }
  .map-orbit { position: absolute; inset: 9%; border: 1px solid color-mix(in oklch, var(--cyan) 50%, transparent); border-radius: 50%; }
  .map-orbit::before, .map-orbit::after { content: ""; position: absolute; width: .55rem; aspect-ratio: 1; background: var(--orange); border-radius: 50%; }
  .map-orbit::before { top: 7%; left: 19%; }
  .map-orbit::after { right: -0.28rem; top: 48%; background: var(--cyan); }
  .map-orbit-two { inset: 24%; border-color: color-mix(in oklch, var(--white) 28%, transparent); }
  .map-core { position: absolute; z-index: 2; inset: 34%; display: grid; place-content: center; text-align: center; color: var(--primary-deep); background: var(--white); border-radius: 50%; box-shadow: 0 0 0 .6rem color-mix(in oklch, var(--cyan) 18%, transparent); }
  .map-core span { font-size: .72rem; }
  .map-core strong { font-family: var(--font); font-size: 1.35rem; }
  .capability-map ul { list-style: none; }
  .map-node { position: absolute; z-index: 3; width: 5.7rem; aspect-ratio: 1; display: grid; place-content: center; text-align: center; color: var(--white); background: var(--primary-deep); border: 1px solid color-mix(in oklch, var(--cyan) 70%, var(--white)); border-radius: 50%; }
  .map-node span { color: var(--cyan); font-family: var(--font); font-size: 1.15rem; font-weight: 800; line-height: 1; }
  .map-node small { margin-top: .3rem; font-size: .68rem; }
  .node-ai { top: 0; left: 38%; }
  .node-systems { top: 19%; right: 0; }
  .node-software { right: 8%; bottom: 9%; }
  .node-policy { bottom: 0; left: 28%; }
  .node-web { left: 0; bottom: 17%; }
  .node-creative { top: 15%; left: 3%; }

  .signal-strip { color: var(--white); background: var(--orange-dark); }
  .signal-list { min-height: 5rem; display: flex; align-items: center; justify-content: center; gap: clamp(.8rem, 3vw, 2.5rem); font-family: var(--font); font-weight: 750; }
  .signal-list span { color: var(--orange); font-size: 1.5rem; }

  .section-label { margin-bottom: 1rem; color: var(--primary-light); font-family: var(--font); font-size: .92rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
  .section-label-light { color: var(--cyan); }
  .section-heading h2 { max-width: 12ch; }
  .about-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(3rem, 8vw, 8rem); }
  .about-copy { max-width: 44rem; padding-top: .5rem; }
  .about-copy p + p { margin-top: 1.25rem; }
  .about-copy .lead { color: var(--ink); font-size: clamp(1.3rem, 2.2vw, 1.75rem); line-height: 1.5; }
  .about-copy .text-link { margin-top: 2rem; }

  .services { background: radial-gradient(circle at 88% 12%, var(--cyan-pale), transparent 23rem), var(--surface); }
  .services-intro { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(18rem, .6fr); align-items: end; gap: 3rem; margin-bottom: clamp(3.5rem, 7vw, 6rem); }
  .services-intro > p { max-width: 34rem; color: var(--ink-soft); font-size: 1.08rem; }
  .service-list { list-style: none; border-top: 1px solid var(--line); }
  .service-item { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr) minmax(15rem, .62fr); gap: clamp(1rem, 3vw, 3rem); padding-block: clamp(2rem, 4vw, 3rem); border-bottom: 1px solid var(--line); transition: background-color .25s var(--ease-out), transform .25s var(--ease-out); }
  .service-item:hover { background: color-mix(in oklch, var(--cyan-pale) 45%, transparent); transform: translateX(.35rem); }
  .service-number { color: var(--orange-dark); font-family: var(--font); font-size: 1rem; font-weight: 800; }
  .service-item h3 { color: var(--primary-deep); }
  .service-item div p { max-width: 45rem; margin-top: .75rem; color: var(--ink-soft); }
  .service-output { align-self: center; color: var(--primary); font-size: .9rem; font-weight: 650; }

  .why { position: relative; overflow: hidden; color: var(--white); background: var(--primary-deep); }
  .why::before { content: ""; position: absolute; top: -18rem; right: -14rem; width: 38rem; aspect-ratio: 1; border: 5rem solid color-mix(in oklch, var(--primary-light) 18%, transparent); border-radius: 50%; }
  .why-layout { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(22rem, .82fr); gap: clamp(4rem, 9vw, 9rem); }
  .why-statement h2 { max-width: 11ch; }
  .why-statement > p:last-child { max-width: 42rem; margin-top: 1.75rem; color: oklch(0.9 0.02 230); font-size: 1.08rem; }
  .why-points { display: grid; align-content: start; }
  .why-points article { display: grid; grid-template-columns: 2.2rem 1fr; gap: 1.25rem; padding-block: 1.7rem; border-bottom: 1px solid color-mix(in oklch, var(--white) 18%, transparent); }
  .why-points article:first-child { padding-top: 0; }
  .why-points article > span { color: var(--orange); font-size: 1.65rem; }
  .why-points h3 { font-size: 1.35rem; }
  .why-points p { margin-top: .5rem; color: oklch(0.86 0.023 230); }

  .process-layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(4rem, 9vw, 9rem); }
  .process-heading { position: sticky; top: 8rem; align-self: start; }
  .process-steps { list-style: none; counter-reset: process; }
  .process-steps li { display: grid; grid-template-columns: 4.5rem 1fr; gap: 1.5rem; padding-block: 2rem; border-bottom: 1px solid var(--line); }
  .process-steps li:first-child { padding-top: 0; }
  .process-steps span { width: 3.4rem; aspect-ratio: 1; display: grid; place-items: center; color: var(--white); background: var(--primary); border-radius: 50%; font-family: var(--font); font-weight: 800; }
  .process-steps p { max-width: 37rem; margin-top: .65rem; color: var(--ink-soft); }

  .section-media-shell { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); gap: 1.25rem; margin-top: clamp(2.5rem, 5vw, 4.5rem); }
  .section-media { margin: 0; }
  .section-media img { width: 100%; max-height: 36rem; object-fit: cover; border-radius: var(--radius); }
  .section-media figcaption { max-width: 65ch; margin-top: .7rem; color: var(--ink-soft); font-size: .9rem; }
  .hero .section-media img, .why .section-media img, .contact .section-media img { border: 1px solid color-mix(in oklch, var(--white) 35%, transparent); }
  .hero .section-media figcaption, .why .section-media figcaption, .contact .section-media figcaption { color: color-mix(in oklch, var(--white) 78%, var(--cyan)); }

  .custom-section:nth-of-type(even) { background: var(--surface); }
  .custom-section-layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(2.5rem, 7vw, 7rem); }
  .custom-section-copy { max-width: 44rem; color: var(--ink-soft); font-size: clamp(1.08rem, 1.7vw, 1.3rem); }

  .contact { color: var(--white); background: oklch(0.18 0.055 250); }
  .contact-layout { display: grid; grid-template-columns: minmax(0, .86fr) minmax(25rem, .74fr); gap: clamp(3rem, 8vw, 8rem); align-items: start; }
  .contact-copy h2 { max-width: 10ch; }
  .contact-copy > p:not(.section-label) { max-width: 38rem; margin-top: 1.5rem; color: oklch(0.86 0.025 230); font-size: 1.1rem; }
  .direct-contact { display: grid; gap: .75rem; margin-top: 2.5rem; }
  .direct-contact a { min-height: 4.5rem; display: flex; align-items: center; gap: 1rem; padding: .7rem 1rem; border: 1px solid color-mix(in oklch, var(--white) 22%, transparent); border-radius: var(--radius); text-decoration: none; }
  .direct-contact a:hover { border-color: var(--cyan); background: color-mix(in oklch, var(--primary) 24%, transparent); }
  .contact-icon { width: 2.75rem; aspect-ratio: 1; display: grid; place-items: center; color: var(--primary-deep); background: var(--cyan); border-radius: 50%; font-family: var(--font); font-weight: 900; }
  .direct-contact small, .direct-contact strong { display: block; }
  .direct-contact small { color: oklch(0.79 0.025 230); }
  .direct-contact strong { font-size: 1.1rem; }

  .consultation-form { padding: clamp(1.5rem, 4vw, 2.5rem); color: var(--ink); background: var(--white); border-radius: var(--radius); }
  .consultation-form > p { margin-top: .6rem; color: var(--ink-soft); font-size: .92rem; }
  .field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
  .field { margin-top: 1.25rem; }
  .field label { display: block; margin-bottom: .45rem; font-weight: 720; }
  .field label span { color: var(--ink-soft); font-weight: 450; }
  .field input, .field select, .field textarea { width: 100%; min-height: 3.1rem; padding: .75rem .85rem; color: var(--ink); background: var(--white); border: 1px solid oklch(0.67 0.04 245); border-radius: 8px; }
  .field textarea { min-height: 8rem; resize: vertical; }
  .field textarea::placeholder { color: oklch(0.42 0.03 245); opacity: 1; }
  .field input:hover, .field select:hover, .field textarea:hover { border-color: var(--primary-light); }
  .form-submit { width: 100%; margin-top: 1.5rem; }
  .form-status { min-height: 1.5rem; color: var(--primary) !important; font-weight: 700; }

  .site-footer { padding-block: 3.5rem 5.5rem; background: var(--white); }
  .footer-main { display: flex; justify-content: space-between; gap: 3rem; padding-bottom: 2.5rem; border-bottom: 1px solid var(--line); }
  .footer-main img { width: 13rem; height: auto; }
  .footer-main p { margin-top: .8rem; color: var(--primary); font-family: var(--font); font-size: .82rem; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; }
  .footer-main p span { color: var(--orange-dark); }
  .footer-main nav { display: flex; flex-wrap: wrap; align-content: start; gap: 1rem 2rem; font-weight: 700; }
  .footer-main a, .footer-bottom a { text-underline-offset: .3rem; }
  .footer-bottom { display: flex; justify-content: space-between; gap: 2rem; padding-top: 1.5rem; color: var(--ink-soft); font-size: .9rem; }
  .back-to-top { position: fixed; z-index: var(--z-floating); right: clamp(.8rem, 2vw, 1.5rem); bottom: clamp(.8rem, 2vw, 1.5rem); width: 4.25rem; aspect-ratio: 1; display: grid; place-content: center; justify-items: center; color: var(--white); background: conic-gradient(var(--orange) calc(var(--scroll-ratio) * 1turn), color-mix(in oklch, var(--white) 35%, transparent) 0); border-radius: 50%; font-family: var(--font); font-weight: 800; line-height: 1; text-decoration: none; filter: drop-shadow(0 4px 6px color-mix(in oklch, var(--primary-deep) 22%, transparent)); transition: transform .2s var(--ease-out-quart), filter .2s var(--ease-out-quart); }
  .back-to-top::before { content: ""; position: absolute; inset: 3px; z-index: -1; background: var(--primary-deep); border-radius: inherit; }
  .back-to-top:hover { transform: translateY(-4px); filter: drop-shadow(0 7px 8px color-mix(in oklch, var(--primary-deep) 30%, transparent)); }
  .back-to-top:active { transform: translateY(-1px) scale(.97); }
  .back-to-top-arrow { color: var(--cyan); font-size: 1.25rem; }
  .back-to-top-label { margin-top: .22rem; font-size: .68rem; letter-spacing: .04em; text-transform: uppercase; }
  .mobile-contact { display: none; }
}

@layer utilities {
  @media (max-width: 900px) {
    .js .menu-toggle { display: inline-flex; }
    .js .site-nav { position: absolute; top: calc(100% + 1px); right: 1rem; left: 1rem; display: none; padding: 1rem; background: var(--white); border-bottom: 3px solid var(--orange); }
    .js .site-nav[data-open="true"] { display: grid; }
    .js .site-nav a { min-height: 3rem; display: flex; align-items: center; padding-inline: .5rem; }
    .js .site-nav .nav-cta { justify-content: center; margin-top: .35rem; }
    .hero-layout { grid-template-columns: 1fr; min-height: auto; }
    .hero-copy { position: relative; z-index: 4; }
    .capability-map { width: min(100%, 27rem); }
    .about-layout, .why-layout, .process-layout, .contact-layout, .custom-section-layout { grid-template-columns: 1fr; }
    .services-intro { grid-template-columns: 1fr; align-items: start; }
    .services-intro > p { max-width: 48rem; }
    .service-item { grid-template-columns: 3.5rem 1fr; }
    .service-output { grid-column: 2; }
    .process-heading { position: static; }
    .contact-copy h2 { max-width: 12ch; }
  }

  @media (max-width: 620px) {
    body { padding-bottom: 4.2rem; }
    .shell { width: min(calc(100% - 1.3rem), var(--max-width)); }
    .header-inner, .site-header[data-scrolled="true"] .header-inner { min-height: 5.2rem; gap: 1rem; }
    .scroll-progress, .site-header[data-scrolled="true"] + .scroll-progress { top: 5.2rem; }
    .brand { width: 9.8rem; }
    .site-header[data-scrolled="true"] .brand { width: 9.2rem; }
    .menu-toggle { min-width: 4.8rem; }
    .hero-layout { padding-block: 4rem 4.8rem; }
    .hero-actions { align-items: stretch; }
    .hero-actions .button { width: 100%; }
    .hero-actions .text-link { justify-content: center; min-height: 2.75rem; }
    .capability-map { transform: scale(.95); }
    .map-node { width: 4.9rem; }
    .map-node span { font-size: 1rem; }
    .map-node small { font-size: .62rem; }
    .signal-list { min-height: 4.2rem; gap: .45rem; font-size: .8rem; }
    .signal-list span { font-size: 1rem; }
    .service-item { grid-template-columns: 2.7rem 1fr; }
    .service-output { font-size: .86rem; }
    .field-row { grid-template-columns: 1fr; gap: 0; }
    .footer-main, .footer-bottom { display: grid; }
    .footer-main nav { gap: .8rem 1.2rem; }
    .mobile-contact { position: fixed; z-index: var(--z-sticky); right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: .72fr 1.28fr; min-height: 4rem; padding: .5rem; background: var(--white); border-top: 1px solid var(--line); }
    .mobile-contact a { display: grid; place-items: center; min-height: 3rem; font-weight: 800; text-decoration: none; }
    .mobile-contact a:last-child { color: var(--white); background: var(--primary); border-radius: 999px; }
    .back-to-top { right: .75rem; bottom: 4.85rem; width: 3.65rem; }
    .back-to-top-label { display: none; }
    .back-to-top-arrow { font-size: 1.45rem; }
  }

  @media (prefers-reduced-motion: no-preference) {
    .is-revealed[data-reveal="hero-copy"] { animation: hero-in .8s var(--ease-out) both; }
    .is-revealed[data-reveal="hero-map"] { animation: map-in 1s .15s var(--ease-out) both; }
    .is-revealed[data-reveal="slide-left"] { animation: reveal-left .65s var(--ease-out) both; }
    .is-revealed[data-reveal="slide-right"] { animation: reveal-right .65s var(--ease-out) both; }
    .is-revealed[data-reveal="mask"] { animation: reveal-mask .7s var(--ease-out) both; }
    .is-revealed[data-reveal="focus"] { animation: reveal-focus .75s var(--ease-out) both; }
    .is-revealed[data-reveal="list-item"] { animation: reveal-list .55s calc(var(--reveal-order, 0) * 55ms) var(--ease-out) both; }
    .is-revealed[data-reveal="step"] { animation: reveal-step .55s calc(var(--reveal-order, 0) * 80ms) var(--ease-out) both; }
    .map-orbit-one { animation: orbit 45s linear infinite; }
    .map-orbit-two { animation: orbit 35s linear infinite reverse; }
    @keyframes hero-in { from { opacity: 0; transform: translateY(1.4rem); } }
    @keyframes map-in { from { opacity: 0; transform: scale(.94); } }
    @keyframes reveal-left { from { opacity: .55; transform: translateX(-2.5rem); } }
    @keyframes reveal-right { from { opacity: .55; transform: translateX(2.5rem); } }
    @keyframes reveal-mask { from { opacity: .65; clip-path: inset(0 18% 0 0); } }
    @keyframes reveal-focus { from { opacity: .55; filter: blur(5px); transform: scale(.985); } }
    @keyframes reveal-list { from { opacity: .45; transform: translateY(1.25rem); } }
    @keyframes reveal-step { from { opacity: .5; transform: translateX(1.5rem); } }
    @keyframes orbit { to { transform: rotate(360deg); } }
  }

  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  }

  @media (forced-colors: active) {
    .map-core, .map-node, .contact-icon, .process-steps span { border: 2px solid currentColor; }
  }
}

@layer components {
  .site-footer { padding-block: 4rem 1.5rem; color: var(--white); background: oklch(.2 .07 250); }
  .site-footer .footer-bottom { color: oklch(.82 .02 230); border-top: 1px solid color-mix(in oklch, var(--white) 18%, transparent); }
  .site-footer .footer-bottom a { color: var(--white); }
  body .container { width: calc(100% - 2rem); max-width: var(--max-width); margin-inline: auto; }
  .footer-grid { grid-template-columns: minmax(13rem, 1.5fr) 1fr minmax(15rem, 1.25fr); }
  .footer-grid img { width: 12rem; height: auto; object-fit: contain; }
  .form-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .form-privacy { margin-top: 1rem !important; font-size: .84rem !important; }
  .form-actions .button:disabled { cursor: wait; opacity: .72; transform: none; }
  .site-nav .button-small:hover { color: var(--white); background: var(--primary-deep); text-decoration: none; }
  .form-status[data-state="success"] { color: oklch(.41 .12 150) !important; }
  .form-status[data-state="error"] { color: oklch(.46 .18 28) !important; }
}

@layer utilities {
  @media (max-width: 900px) {
    .home-hero .hero-grid > * { min-width: 0; }
    .footer-grid { grid-template-columns: 1.3fr 1fr 1.4fr; }
    .footer-grid > div:last-child { grid-column: auto; }
  }
  @media (max-width: 620px) {
    .header-inner { width: calc(100% - 1.3rem); }
    .brand, .site-header[data-scrolled="true"] .brand { width: 8.8rem; }
    .menu-toggle { flex: 0 0 3rem; min-width: 3rem; width: 3rem; margin-left: auto; }
    .home-hero .hero-copy, .home-hero .hero-lead { width: 100%; max-width: 100%; overflow-wrap: anywhere; }
    .solution-orbit { width: min(calc(100% - 2rem), 22rem); }
    .footer-grid { grid-template-columns: 1fr 1fr; }
    .footer-grid > div:first-child { grid-column: 1 / -1; }
  }
}
