/* Jericko Security Services Inc. — "The confidence to move forward"
   charcoal #0A1018 · cold white #F0F2F2 · cobalt #2D5BFF · gold #C9A24A · silver #AEB6C0 */
:root{
  --ink:#0A1018; --ink-2:#121A26; --paper:#F0F2F2; --paper-2:#E4E7E9;
  --blue:#2D5BFF; --blue-deep:#1F45D6; --gold:#C9A24A; --silver:#AEB6C0;
  --on-dark:rgba(240,242,242,.78); --on-dark-strong:#F0F2F2; --on-light:#3A4250; --line-d:rgba(240,242,242,.16); --line-l:rgba(10,16,24,.14);
  --disp:"Barlow Condensed","Arial Narrow",Impact,sans-serif; --body:"IBM Plex Sans","Helvetica Neue",Arial,sans-serif;
  --gutter:clamp(20px,4.5vw,72px); --max:1440px; --hdr:80px; --ease:cubic-bezier(.22,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--ink);color:var(--paper);font:400 17px/1.6 var(--body);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--blue)}
h1,h2,h3,h4{margin:0;font-family:var(--disp);font-weight:700;line-height:.92;letter-spacing:-.01em;text-wrap:balance}
p{margin:0;text-wrap:pretty}
ul,ol{margin:0;padding:0;list-style:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.act--light :focus-visible{outline-color:var(--blue)}
.act--blue :focus-visible{outline-color:var(--paper)}
.wrap{width:min(100% - 2*var(--gutter),var(--max));margin-inline:auto}
.skip{position:absolute;left:12px;top:-100px;z-index:100;background:var(--blue);color:#fff;padding:12px 16px;font-weight:600}
.skip:focus{top:12px}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
section[id]{scroll-margin-top:var(--hdr)}

/* type utilities */
.eyebrow{display:flex;align-items:center;gap:12px;font:500 12.5px/1 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--silver)}
.eyebrow i{width:28px;height:1px;background:var(--gold);display:inline-block}
.act--light .eyebrow{color:var(--on-light)}
.act-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(20px,3vw,48px);align-items:end;margin-bottom:clamp(36px,5vw,80px)}
.act-head .eyebrow{margin-bottom:20px}
.h2{font-size:clamp(48px,7vw,120px);text-transform:uppercase;letter-spacing:-.015em;line-height:.9}
.h2 em{font-style:normal;color:var(--blue)}
.act--dark .h2 em{color:var(--blue)}
.act--blue .h2 em{color:var(--ink)}
.act-head .lede{font-size:clamp(17px,1.25vw,20px);max-width:52ch;color:var(--on-dark)}
.act--light .act-head .lede{color:var(--on-light)}
.act--blue .act-head .lede{color:rgba(240,242,242,.9)}
@media (max-width:860px){.act-head{grid-template-columns:1fr}}

/* buttons */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:54px;padding:0 26px;font:600 16px/1 var(--body);text-decoration:none;letter-spacing:.01em;transition:background-color .25s,color .25s,border-color .25s;white-space:nowrap;border:1.5px solid transparent;will-change:transform}
.btn .ar{transition:transform .3s var(--ease)}
.btn:hover .ar{transform:translateX(4px)}
.btn--blue{background:var(--blue);color:#fff}
.btn--blue:hover{background:var(--blue-deep);color:#fff}
.btn--white{background:var(--paper);color:var(--ink)}
.btn--white:hover{background:#fff;color:var(--ink)}
.btn--line{border-color:rgba(240,242,242,.4);color:var(--paper)}
.btn--line:hover{border-color:var(--paper);color:var(--paper)}
.btn--line-dark{border-color:rgba(10,16,24,.35);color:var(--ink)}
.btn--line-dark:hover{border-color:var(--ink);color:var(--ink)}
.btn--ink{background:var(--ink);color:var(--paper)}
.btn--ink:hover{background:#000;color:var(--paper)}
.btn[disabled]{opacity:.55;cursor:not-allowed}

/* header */
.hdr{position:fixed;top:0;left:0;right:0;z-index:60;background:linear-gradient(to bottom,rgba(10,16,24,.82),rgba(10,16,24,0));transition:background-color .3s,box-shadow .3s}
.hdr.is-solid{background:rgba(10,16,24,.96);box-shadow:0 1px 0 var(--line-d)}
.hdr .wrap{display:flex;align-items:center;gap:8px;min-height:var(--hdr)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--paper);margin-right:auto;min-height:44px}
.brand img{width:48px;height:48px;object-fit:contain}
.brand b{display:block;font:700 22px/1 var(--disp);letter-spacing:.06em;text-transform:uppercase}
.brand small{display:block;font:500 10.5px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--silver);margin-top:5px}
.nav{display:flex;gap:2px;margin-right:12px}
.nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;color:var(--paper);text-decoration:none;font:500 14.5px/1 var(--body);letter-spacing:.02em;position:relative}
.nav a::after{content:"";position:absolute;left:14px;right:14px;bottom:9px;height:1.5px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav a:hover{color:var(--paper)}.nav a:hover::after{transform:scaleX(1)}
.hdr .tel{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;color:var(--paper);text-decoration:none;font:500 14.5px/1 var(--body);font-variant-numeric:tabular-nums;white-space:nowrap}
.hdr .tel:hover{color:var(--gold)}
.hdr .btn{min-height:44px;padding:0 20px;font-size:14.5px}
.menu-btn{display:none;width:48px;height:48px;align-items:center;justify-content:center;color:var(--paper)}
.menu-btn svg{width:28px;height:28px}
@media (max-width:1180px){.hdr .tel{display:none}}
@media (max-width:920px){.nav,.hdr .btn{display:none}.menu-btn{display:inline-flex}.brand small{display:none}}

/* mobile menu (sibling of header, never inside a filtered element) */
.mnav{display:none;position:fixed;top:0;left:0;right:0;bottom:0;height:100vh;height:100dvh;background:var(--ink);z-index:70;flex-direction:column;padding:0 var(--gutter) 32px;overflow:auto}
.mnav.is-open{display:flex}
body.menu-open{overflow:hidden}
.mnav .bar{display:flex;align-items:center;justify-content:space-between;min-height:var(--hdr)}
.mnav .bar .brand{margin:0}
.mnav .close{width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;color:var(--paper)}
.mnav .close svg{width:28px;height:28px}
.mnav .links{display:grid;margin-top:8px;border-top:1px solid var(--line-d)}
.mnav .links a{display:flex;align-items:baseline;justify-content:space-between;gap:16px;min-height:72px;padding:18px 0;color:var(--paper);text-decoration:none;font:700 clamp(40px,10vw,56px)/1 var(--disp);text-transform:uppercase;letter-spacing:-.01em;border-bottom:1px solid var(--line-d)}
.mnav .links a span{font:500 12px/1 var(--body);letter-spacing:.18em;color:var(--gold)}
.mnav .foot{margin-top:auto;display:grid;gap:12px;padding-top:28px}
.mnav .foot .tel{display:flex;align-items:center;justify-content:center;min-height:54px;border:1.5px solid rgba(240,242,242,.4);color:var(--paper);text-decoration:none;font:600 16px/1 var(--body)}
.mnav .foot .mail{text-align:center;color:var(--silver);font-size:14.5px;overflow-wrap:anywhere}

/* acts */
.act{position:relative}
.act--dark{background:var(--ink);color:var(--paper)}
.act--light{background:var(--paper);color:var(--ink)}
.act--blue{background:var(--blue);color:var(--paper)}
.pad{padding:clamp(72px,9vw,150px) 0}

/* ACT 01 — the dimensional Jericko emblem */
.hero--emblem{position:relative;background:#070b12;min-height:100svh}
.js.motion .hero--emblem.has-shots{height:165svh}
.hero--emblem.is-static{height:auto!important}
.hero-stage{position:sticky;top:var(--hero-sticky-top,0px);min-height:100svh;overflow:hidden;isolation:isolate;background:#070b12}
.hero-atmosphere{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 81% 43%,rgba(38,69,165,.22),transparent 46%),linear-gradient(124deg,#070b12 32%,#101827 100%)}
.hero-atmosphere::after{content:"";position:absolute;width:50vw;height:100%;right:-9%;top:-15%;background:linear-gradient(115deg,transparent 35%,rgba(126,155,235,.065) 48%,transparent 60%);transform:rotate(-9deg)}
.hero-grid{position:relative;min-height:max(740px,100svh);display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr auto;align-items:center;gap:22px 0;padding-top:calc(var(--hdr) + 38px);padding-bottom:28px}
.hero-copy{position:relative;z-index:3;padding:12px 0 28px;max-width:650px}
.hero .eyebrow{font-size:11px;letter-spacing:.15em;color:var(--silver);margin-bottom:30px;line-height:1.5}
.h1{font-size:clamp(90px,10.8vw,184px);line-height:.83;letter-spacing:-.025em;text-transform:uppercase;color:var(--paper);max-width:none}
.h1 .l2{display:block;color:#4b65ff}
.hero-intro{margin-top:32px;font-size:clamp(20px,2vw,28px);line-height:1.2;letter-spacing:-.015em;color:var(--silver)}
.hero-intro strong{color:var(--paper);font-weight:500}
.hero-description{margin-top:16px;max-width:43ch;font-size:16px;line-height:1.55;color:#aeb8cb}
.hero-cta{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:26px}
.hero-services{display:inline-flex;gap:16px;align-items:center;min-height:48px;font-size:14px;font-weight:500;text-decoration:none;color:var(--paper)}
.hero-services:hover{color:#a9b6ff}
.hero-assurance{display:flex;align-items:center;gap:18px;margin-top:25px;text-decoration:none;color:#aeb8cb;font-size:11px;letter-spacing:.04em}
.hero-assurance span+span{border-left:1px solid #354052;padding-left:18px}
.hero-assurance span:last-child{border:0;padding:0;color:var(--gold);font-size:17px}
.hero-assurance b{font-weight:500;color:var(--paper)}
.hero-assurance:hover{color:var(--paper)}
.emblem-column{position:relative;align-self:stretch;display:flex;flex-direction:column;justify-content:center;margin-left:-36px;margin-right:-35px;min-width:0}
 .emblem-stage{position:relative;display:block;width:100%;height:min(680px,calc(100svh - 275px));aspect-ratio:1;outline-offset:-12px;touch-action:pan-y pinch-zoom;cursor:default;padding:0;border:0;background:none;color:inherit}
.emblem-stage.is-ready{cursor:crosshair}
.emblem-light{position:absolute;inset:13%;border-radius:50%;background:radial-gradient(ellipse,rgba(52,84,186,.28),transparent 68%);filter:blur(20px);pointer-events:none}
.emblem-object{position:absolute;left:50%;top:50%;width:var(--emblem-size,90%);aspect-ratio:1;translate:-50% -50%;transform-origin:19% 82%;pointer-events:none}
.emblem-original{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 28px 35px rgba(0,0,0,.6))}
.cylinder-spin{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}.cylinder-roll{will-change:transform}
.shot-flash,.shot-smoke{position:absolute;left:94.4%;top:27.5%;width:28%;height:auto;max-width:none;opacity:0;pointer-events:none;transform-origin:14% 53.5%}
.shot-flash{mix-blend-mode:screen;left:93.25%;top:23.14%;width:36%}
.shot-smoke{filter:grayscale(1) brightness(.85);mask-image:linear-gradient(90deg,transparent 12%,#000 45%);mix-blend-mode:screen}
.shot-glow{position:absolute;left:75%;top:24%;width:42%;height:37%;background:radial-gradient(ellipse,rgba(255,217,145,.4),transparent 64%);opacity:0;mix-blend-mode:screen;pointer-events:none}
.emblem-tools{position:relative;z-index:4;display:flex;justify-content:center;align-items:center;gap:22px;font-size:11px;color:#9ca8be;margin-top:-12px;min-height:44px}
.emblem-tools[hidden]{display:none}
.emblem-tools button{display:inline-flex;min-height:44px;align-items:center;justify-content:center;gap:8px;padding:0 6px;color:#d9e0ef;font-size:11px;transition:color .2s}
.emblem-tools button:hover{color:#fff}.effect-status{width:5px;height:5px;border-radius:50%;background:#c9a24a;box-shadow:0 0 10px #c9a24a66}.emblem-pause[aria-pressed=true] .effect-status{background:#758095;box-shadow:none}
.hero-bottom{grid-column:1/-1;display:flex;justify-content:space-between;gap:24px;align-items:end;border-top:1px solid rgba(169,184,215,.17);padding-top:20px}
.scroll-cue{display:flex;gap:12px;align-items:center;min-height:44px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:#aeb8cb}
.scroll-cue span{display:grid;place-items:center;width:32px;height:32px;border:1px solid #374057;border-radius:50%;font-size:18px}
.emblem-chapters{display:flex;gap:28px;color:#6b7993;font-size:11px;letter-spacing:.04em}
.emblem-chapters span{transition:color .35s;display:flex;gap:9px;align-items:center}
.emblem-chapters b{font-weight:400;font-variant-numeric:tabular-nums}
.emblem-chapters .is-current{color:#e8edf8}
.emblem-chapters .is-current b{color:var(--gold)}
.hero-progress{position:absolute;bottom:0;left:0;right:0;height:2px;background:#151e2f}
.hero-progress span{display:block;width:100%;height:100%;background:#5874ff;transform:scaleX(0);transform-origin:left}
@media (min-width:1500px){.emblem-column{margin-right:-80px}}
@media (max-width:1100px){.hero-grid{min-height:max(760px,100svh);grid-template-columns:1.08fr 1fr}.h1{font-size:clamp(90px,12vw,150px)}.emblem-column{margin-left:-20px;margin-right:-25px}.hero-description{max-width:35ch}.emblem-tools{flex-wrap:wrap;gap:6px}.emblem-tools p{flex-basis:100%;text-align:center;margin:0}.emblem-chapters{gap:18px}}
@media (max-width:700px){
  .js.motion .hero--emblem.has-shots{height:175svh;min-height:1090px}
  .hero-grid{min-height:100svh;grid-template-columns:1fr;grid-template-rows:auto auto auto;padding-top:calc(var(--hdr) + 5px);gap:0;padding-bottom:20px}
  .hero-copy{display:contents}
  .hero-copy>.eyebrow{grid-row:1;font-size:10px;margin-bottom:0;justify-content:center;text-align:center;letter-spacing:.12em}
  .emblem-column{grid-row:2;margin:-10px 0 -3px;align-self:auto;justify-self:center;width:min(100%,390px)}
  .emblem-stage{height:auto;aspect-ratio:1.22;margin-bottom:-10px}
  .emblem-tools{margin:0;flex-wrap:nowrap;gap:7px;font-size:10px;min-height:38px}
  .emblem-tools p{flex-basis:auto;font-size:10px}
  .emblem-tools button{min-height:44px;padding:0 6px;font-size:11px}
  .hero .h1{grid-row:3;font-size:clamp(80px,24vw,148px);line-height:.83;max-width:none;margin-top:20px}
  .hero-intro{font-size:20px;margin-top:23px}
  .hero-intro br{display:none}.hero-intro strong{margin-left:5px}
  .hero-description{max-width:none;font-size:14px;margin-top:11px;line-height:1.5}
  .hero-cta{gap:14px;margin-top:22px;flex-wrap:nowrap}.hero-cta .btn{padding:0 18px;font-size:14px;min-height:50px}
  .hero-services{font-size:12px;gap:8px;white-space:nowrap}
  .hero-assurance{margin:18px 0 24px;gap:12px;font-size:10px}.hero-assurance span+span{padding-left:12px}
  .hero-bottom{margin-top:0;padding-top:12px;gap:12px}.scroll-cue{font-size:9px;letter-spacing:.04em;gap:8px}.emblem-chapters{gap:12px;font-size:10px}.emblem-chapters span:not(.is-current){display:none}
}
@media (min-width:701px) and (max-height:820px){.js.motion .hero--emblem.has-shots{height:auto}.hero-stage{position:relative}}
@media (max-width:380px){.hero .h1{font-size:24vw}.emblem-column{margin-top:-12px}.hero-cta{gap:12px}.hero-cta .btn{padding:0 14px}.hero-intro{font-size:18px}.hero-assurance{font-size:9.5px}}
@media (prefers-reduced-motion:reduce){.js.motion .hero--emblem.has-shots{height:auto!important;min-height:0}.hero-stage{position:relative}.shot-flash,.shot-smoke,.shot-glow,.cylinder-spin{display:none}.emblem-tools{display:none!important}.hero-progress{display:none}}
.no-js .hero-stage{position:relative}

/* ACT 02 — statement + proof */
.stmt .big{font:700 clamp(40px,6.2vw,104px)/.98 var(--disp);text-transform:uppercase;letter-spacing:-.01em;max-width:18ch}
.stmt .big .w{display:inline-block;transition:color .35s var(--ease)}
.js .stmt .big .w{color:rgba(10,16,24,.16)}
.js .stmt .big .w.on{color:var(--ink)}
.js .stmt .big .w.on.blue{color:var(--blue)}
.stmt .big .blue{color:var(--blue)}
.stmt .grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,72px);align-items:start}
.stmt .side{font-size:clamp(17px,1.25vw,19.5px);color:var(--on-light);display:grid;gap:18px;padding-top:clamp(8px,1.5vw,28px)}
.stmt .side b{color:var(--ink);font-weight:600}
.proof{margin-top:clamp(48px,7vw,110px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.proof .p{padding:clamp(22px,2.5vw,40px) clamp(16px,2vw,32px) clamp(22px,2.5vw,40px) 0;border-left:1px solid var(--line-l);padding-left:clamp(16px,2vw,32px);min-width:0}
.proof .p:first-child{border-left:0;padding-left:0}
.proof .n{display:block;font:700 clamp(56px,7vw,124px)/.85 var(--disp);letter-spacing:-.02em}
.proof .n sup{font-size:.42em;vertical-align:top;position:relative;top:.1em;color:var(--blue)}
.proof .l{display:block;margin-top:14px;font:500 13px/1.4 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--on-light)}
.proof-note{margin-top:14px;font-size:13px;color:var(--on-light);letter-spacing:.02em}
@media (max-width:860px){.stmt .grid{grid-template-columns:1fr}.proof{grid-template-columns:repeat(2,minmax(0,1fr))}.proof .p:nth-child(3){border-left:0;padding-left:0}.proof .p:nth-child(-n+2){border-bottom:1px solid var(--line-l)}}

/* ACT 03 — service explorer */
.chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:24px}
.chips .k{font:500 12px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--silver);margin-right:8px}
.chip{min-height:44px;padding:0 16px;border:1px solid rgba(240,242,242,.28);color:var(--paper);font:500 14px/1 var(--body);display:inline-flex;align-items:center;gap:8px;transition:border-color .2s,background-color .2s,color .2s}
.chip:hover{border-color:var(--paper)}
.chip[aria-pressed="true"]{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.chips .clear{min-height:44px;padding:0 10px;color:var(--silver);font-size:14px;text-decoration:underline;text-underline-offset:3px;display:none}
.chips .clear.is-visible{display:inline-flex;align-items:center}
.svc-list{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:0 clamp(32px,5vw,96px);border-top:1px solid var(--line-d)}
.svc-item{display:contents}
.svc-tab{grid-column:1;display:grid;grid-template-columns:64px minmax(0,1fr) 40px;align-items:baseline;gap:16px;width:100%;text-align:left;padding:clamp(18px,2.2vw,30px) 0;border-bottom:1px solid var(--line-d);color:var(--paper);min-height:64px;transition:opacity .3s,color .3s}
.svc-tab .no{font:500 13px/1 var(--body);letter-spacing:.14em;color:var(--silver)}
.svc-tab .ttl{font:700 clamp(28px,3vw,48px)/.95 var(--disp);text-transform:uppercase;letter-spacing:-.01em;transition:transform .35s var(--ease),color .3s}
.svc-tab .ar{font:400 26px/1 var(--body);color:var(--silver);justify-self:end;transition:transform .35s var(--ease),color .3s;opacity:0}
.svc-tab:hover .ttl{color:#fff;transform:translateX(6px)}
.svc-tab:hover .ar{opacity:1;color:var(--paper)}
.svc-item.is-active .svc-tab .ttl{color:var(--blue)}
.svc-item.is-active .svc-tab .no{color:var(--gold)}
.svc-item.is-active .svc-tab .ar{opacity:1;color:var(--blue);transform:translateX(4px)}
.svc-item.is-dim .svc-tab{opacity:.32}
.svc-item.is-dim.is-active .svc-tab{opacity:1}
.svc-panel{grid-column:2;grid-row:1/span 6;display:none;grid-template-rows:auto 1fr;gap:clamp(22px,2.5vw,36px);align-self:start;position:sticky;top:calc(var(--hdr) + 16px);padding-top:clamp(18px,2.2vw,30px)}
.svc-item.is-active .svc-panel{display:grid}
.js.motion .svc-item.is-active .svc-panel{animation:panel .55s var(--ease) both}
@keyframes panel{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.svc-fig{margin:0;position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--ink-2)}
.svc-fig img{width:100%;height:100%;object-fit:cover}
.svc-fig figcaption{position:absolute;left:16px;bottom:14px;font:500 11.5px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:rgba(240,242,242,.85);background:rgba(10,16,24,.55);padding:8px 10px}
.gfx{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden}
.gfx--blue{background:var(--blue)}
.gfx--ink{background:var(--ink-2)}
.gfx .word{font:700 clamp(70px,11vw,190px)/.8 var(--disp);text-transform:uppercase;letter-spacing:-.03em;color:var(--paper);position:relative;z-index:1;text-align:center}
.gfx .word small{display:block;font:500 12px/1 var(--body);letter-spacing:.24em;margin-top:18px;color:rgba(240,242,242,.75)}
.gfx svg{position:absolute;inset:0;width:100%;height:100%}
.gfx svg circle,.gfx svg path,.gfx svg line{fill:none;stroke:rgba(240,242,242,.32);stroke-width:1.2;vector-effect:non-scaling-stroke}
.gfx--ink svg circle,.gfx--ink svg path,.gfx--ink svg line{stroke:rgba(45,91,255,.7)}
.gfx svg .gold{stroke:var(--gold)}
.svc-txt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,2.5vw,40px)}
.svc-txt .k{font:500 12px/1 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;display:flex;align-items:center;gap:10px}
.svc-txt .k::before{content:"";width:18px;height:1px;background:var(--gold)}
.svc-txt p{color:var(--on-dark);font-size:16.5px}
.svc-txt ul{display:grid;gap:8px;color:var(--on-dark);font-size:16px}
.svc-txt li{padding-left:18px;position:relative}
.svc-txt li::before{content:"";position:absolute;left:0;top:.7em;width:8px;height:1px;background:var(--silver)}
.svc-cta{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;padding-top:8px;border-top:1px solid var(--line-d);padding-top:22px}
.svc-cta a.lnk{color:var(--paper);text-decoration:none;font:600 16px/1 var(--body);display:inline-flex;align-items:center;gap:10px;min-height:44px}
.svc-cta a.lnk .ar{transition:transform .3s var(--ease)}
.svc-cta a.lnk:hover .ar{transform:translateX(4px)}
.svc-cta a.lnk:hover{color:var(--blue)}
.svc-cta .fine{font-size:13.5px;color:var(--silver)}
@media (max-width:960px){
  .svc-list{display:block}
  .svc-item{display:block}
  .svc-tab{grid-template-columns:48px minmax(0,1fr) 32px}
  .svc-panel{position:static;grid-row:auto;padding:8px 0 clamp(28px,4vw,40px);border-bottom:1px solid var(--line-d)}
  .svc-tab .ar{opacity:1;transform:rotate(90deg)}
  .svc-item.is-active .svc-tab .ar{transform:rotate(-90deg)}
  .svc-tab:hover .ttl{transform:none}
}
@media (max-width:640px){.svc-txt{grid-template-columns:1fr}.svc-fig{aspect-ratio:4/3}}
.no-js .svc-panel{display:grid;position:static;grid-row:auto;padding-bottom:32px}

/* ACT 04 — credentials */
.cred-spread{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,80px);align-items:start}
.cred-big{position:sticky;top:calc(var(--hdr) + 24px)}
.cred-big .row{padding:clamp(22px,3vw,44px) 0;border-top:1px solid var(--ink);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 24px;align-items:end}
.cred-big .row:last-child{border-bottom:1px solid var(--ink)}
.cred-big .k{grid-column:1/-1;font:500 12.5px/1 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--on-light);display:flex;gap:12px;align-items:center}
.cred-big .k i{width:28px;height:1px;background:var(--gold)}
.cred-big .t{font:700 clamp(54px,7.5vw,132px)/.86 var(--disp);text-transform:uppercase;letter-spacing:-.02em;color:var(--ink)}
.cred-big .t .g{color:var(--gold)}
.cred-big .t .b{color:var(--blue)}
.credential-mark{margin:0;width:clamp(100px,11vw,165px);aspect-ratio:1;background:transparent;display:grid;place-items:center;align-self:center;padding:8px;border:0}
.credential-mark img{width:100%;height:100%;object-fit:contain}
.credential-mark--iso{padding:12px}
.cred-big .s{grid-column:1/-1;font-size:16.5px;color:var(--on-light);max-width:56ch}
.cred-side{display:grid;gap:clamp(28px,3vw,44px);padding-top:clamp(0px,1vw,16px)}
.cred-side .regs{display:grid;gap:0;border-top:1px solid var(--ink)}
.cred-side .regs div{display:grid;grid-template-columns:72px minmax(0,1fr);gap:22px;padding:22px 0;border-bottom:1px solid var(--line-l);font-size:15.5px;color:var(--on-light);align-items:center}
.cred-side .regs b{display:block;margin-bottom:7px;font:700 22px/1 var(--disp);text-transform:uppercase;color:var(--ink);letter-spacing:.02em}
.cred-side h3{font:500 12.5px/1 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--on-light);margin-bottom:14px}
.vals{display:grid;gap:0;border-top:1px solid var(--ink)}
.vals div{padding:20px 0;border-bottom:1px solid var(--line-l)}
.vals h4{font:700 clamp(24px,2vw,30px)/1 var(--disp);text-transform:uppercase;margin-bottom:8px}
.vals p{font-size:16px;color:var(--on-light)}
@media (max-width:960px){.cred-spread{grid-template-columns:1fr}.cred-big{position:static}}
.cred-side .regs img{width:68px;height:68px;object-fit:contain}.cred-side .regs img[src$="sec.png"]{padding:0}.licence-note{font-size:13px;color:var(--on-light);margin-top:18px}.licence-note b{font-weight:600}
@media (max-width:420px){.cred-side .regs div{grid-template-columns:64px minmax(0,1fr);gap:18px}.cred-side .regs img{width:60px;height:60px}}

/* ACT 05 — operations rail */
.ops{overflow:hidden}
.ops .act-head{margin-bottom:clamp(28px,3.5vw,56px)}
.ops .ctrl{display:flex;gap:8px;justify-content:flex-end;align-items:center}
.ops .ctrl button{width:52px;height:52px;border:1.5px solid rgba(240,242,242,.5);color:var(--paper);display:inline-flex;align-items:center;justify-content:center;transition:background-color .2s,color .2s}
.ops .ctrl button:hover{background:var(--paper);color:var(--blue)}
.ops .ctrl svg{width:20px;height:20px}
.rail{display:flex;gap:clamp(14px,2vw,28px);overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--gutter) 8px;margin:0;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.rail::-webkit-scrollbar{display:none}
.rail figure{margin:0;flex:0 0 min(760px,84vw);scroll-snap-align:start;display:grid;gap:14px}
.rail .ph{aspect-ratio:3/2;overflow:hidden;background:var(--blue-deep)}
.rail .ph img{width:100%;height:100%;object-fit:cover}
.rail figcaption{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:baseline;font-size:15px;color:rgba(240,242,242,.9)}
.rail figcaption .no{font:500 12px/1 var(--body);letter-spacing:.16em}
.rail figcaption b{display:block;font:700 24px/1 var(--disp);text-transform:uppercase;margin-bottom:4px;color:#fff}
.rail .spacer{flex:0 0 calc(var(--gutter) - clamp(14px,2vw,28px))}
.clients{margin-top:clamp(40px,5vw,72px);padding-top:26px;border-top:1px solid rgba(240,242,242,.35)}
.clients>.k{font:500 12px/1 var(--body);letter-spacing:.18em;text-transform:uppercase;margin-bottom:24px;color:rgba(240,242,242,.9)}
.client-logos{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:#f7f8f7;padding:24px 12px;gap:12px}
.client-logos li{min-width:0;display:flex;align-items:center;justify-content:center;padding:8px 12px;height:106px;border:0}
.client-logos li:last-child{border:0}.client-logos img.client-monochrome{filter:brightness(0);max-width:150px}
.client-logos img{width:auto;max-width:100%;height:auto;max-height:78px;object-fit:contain;mix-blend-mode:multiply}
@media (max-width:1000px){.client-logos{grid-template-columns:repeat(5,minmax(0,1fr))}.client-logos li{border:0}.client-logos li:nth-child(n+5){border:0}}
@media (max-width:600px){.cred-big .t{font-size:clamp(54px,13vw,76px)}.credential-mark{width:106px}.client-logos{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px}.client-logos li{border:0!important}.client-logos li:last-child{border:0!important}.client-logos img{max-width:150px;max-height:80px}}

/* ACT 06 — journey */
.journey .steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--ink)}
.journey .st{padding:clamp(24px,2.5vw,40px) clamp(16px,2vw,32px) clamp(24px,2.5vw,40px) 0;border-left:1px solid var(--line-l);padding-left:clamp(16px,2vw,32px);min-width:0;display:grid;gap:14px;align-content:start}
.journey .st:first-child{border-left:0;padding-left:0}
.journey .n{font:700 clamp(64px,7vw,120px)/.8 var(--disp);letter-spacing:-.03em;color:transparent;-webkit-text-stroke:1.2px var(--ink)}
.journey .st:first-child .n{color:var(--blue);-webkit-text-stroke:0}
.journey h3{font:700 clamp(24px,2vw,32px)/1 var(--disp);text-transform:uppercase}
.journey p{font-size:16px;color:var(--on-light)}
.journey .fine{margin-top:28px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px 32px;align-items:center;font-size:15px;color:var(--on-light)}
@media (max-width:860px){.journey .steps{grid-template-columns:repeat(2,minmax(0,1fr))}.journey .st:nth-child(3){border-left:0;padding-left:0}.journey .st:nth-child(-n+2){border-bottom:1px solid var(--line-l)}}
@media (max-width:480px){.journey .steps{grid-template-columns:1fr}.journey .st{border-left:0;padding-left:0;grid-template-columns:80px minmax(0,1fr);column-gap:16px}.journey .n{grid-row:1/3;font-size:56px}.journey .st:nth-child(-n+3){border-bottom:1px solid var(--line-l)}}

/* ACT 07 — contact */
.contact .grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,96px);align-items:start}
.contact .h2{font-size:clamp(56px,8vw,140px)}
.direct{display:grid;gap:0;margin-top:clamp(28px,3vw,48px);border-top:1px solid var(--line-d)}
.direct div{padding:18px 0;border-bottom:1px solid var(--line-d);display:grid;gap:6px}
.direct .k{font:500 12px/1 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--silver)}
.direct a{color:var(--paper);text-decoration:none;font:700 clamp(24px,2.4vw,36px)/1.1 var(--disp);letter-spacing:.01em;display:inline-flex;align-items:center;min-height:44px;overflow-wrap:anywhere}
.direct a:hover{color:var(--blue)}
.direct address{font-style:normal;color:var(--on-dark);font-size:16px}
.direct .hrs{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 16px;color:var(--on-dark);font-size:16px}
.direct .hrs b{color:var(--paper);font-weight:600}
.form{border:1px solid var(--line-d);padding:clamp(22px,3vw,44px);background:var(--ink-2)}
.form .fs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 20px}
.form .f{display:grid;gap:8px;min-width:0}
.form .f--full{grid-column:1/-1}
.form label{font:500 14px/1.3 var(--body);letter-spacing:.02em;display:flex;justify-content:space-between;gap:12px}
.form label .opt{color:var(--silver);font-weight:400}
.form input,.form select,.form textarea{width:100%;font:inherit;font-size:16px;color:var(--paper);background:var(--ink);border:1px solid rgba(240,242,242,.28);padding:13px 14px;min-height:50px;border-radius:0;transition:border-color .2s,box-shadow .2s}
.form input::placeholder,.form textarea::placeholder{color:rgba(174,182,192,.6)}
.form textarea{min-height:132px;resize:vertical}
.form select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23F0F2F2' stroke-width='1.6'%3E%3Cpath d='M3 6l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:40px}
.form select option{color:var(--ink);background:#fff}
.form input:focus,.form select:focus,.form textarea:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 3px rgba(45,91,255,.3)}
.form .f.is-invalid input,.form .f.is-invalid select,.form .f.is-invalid textarea{border-color:#FF6B6B}
.form .err{font-size:13.5px;color:#FF8A8A;display:none}
.form .f.is-invalid .err{display:block}
.form .topline{display:none;margin-bottom:18px;font-size:14.5px;color:#FF8A8A;font-weight:500}
.form .topline.is-visible{display:block}
.form .actions{margin-top:26px;display:grid;gap:12px}
.form .actions .btn{width:100%;min-height:58px;font-size:17px}
.form .help{font-size:14px;color:var(--silver);text-align:center}
.form noscript p{font-size:14.5px;color:var(--gold);text-align:center;margin-top:8px}
.form .summary{display:none;margin-top:26px;padding-top:26px;border-top:1px solid var(--line-d);gap:12px}
.form .summary.is-visible{display:grid}
.form .summary h3{font:700 26px/1 var(--disp);text-transform:uppercase}
.form .summary p{font-size:15px;color:var(--on-dark)}
.form .summary p a{color:var(--paper)}
.form .summary textarea{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13.5px;min-height:160px}
.form .summary .row{display:flex;flex-wrap:wrap;gap:10px}
.form .summary .row .btn{flex:1 1 200px}
.form .summary .status{font-size:14px;color:var(--gold);font-weight:500}
.form .summary .status:empty{display:none}
@media (max-width:960px){.contact .grid{grid-template-columns:1fr}}
@media (max-width:600px){.form .fs{grid-template-columns:1fr}}

/* footer */
.foot{background:#06090E;color:var(--on-dark);padding-top:clamp(48px,6vw,88px);overflow:hidden}
.foot .top{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,3fr) minmax(0,4fr);gap:clamp(28px,4vw,64px);padding-bottom:clamp(32px,4vw,56px);border-bottom:1px solid var(--line-d)}
.foot .brand{align-items:flex-start}
.foot .brand img{width:64px;height:64px}
.foot .brand p{margin-top:12px;font-size:15px;max-width:34ch;color:var(--on-dark)}
.foot h4{font:500 12px/1 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--silver);margin-bottom:14px}
.foot ul{display:grid;gap:0;font-size:15.5px}
.foot ul a{color:var(--paper);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.foot ul a:hover{color:var(--gold)}
.foot address{font-style:normal;font-size:15.5px;line-height:1.55;color:var(--on-dark)}
.foot .meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;padding:22px 0;font-size:13px;color:var(--silver);letter-spacing:.02em}
.foot .giant{font:700 min(24vw,360px)/.78 var(--disp);text-transform:uppercase;letter-spacing:-.03em;color:transparent;-webkit-text-stroke:1px rgba(240,242,242,.22);text-align:center;margin:0;transform:translateY(.12em);user-select:none}
@media (max-width:860px){.foot .top{grid-template-columns:1fr 1fr}.foot .brand{grid-column:1/-1}}
@media (max-width:480px){.foot .top{grid-template-columns:1fr}}

/* motion discipline */
@media (prefers-reduced-motion:reduce){
  .js.motion .hero-media img{animation:none}
  .js.motion .svc-item.is-active .svc-panel{animation:none}
  .btn,.btn .ar,.svc-tab .ttl,.svc-tab .ar,.nav a::after,.stmt .big .w{transition:none}
}

/* Optical sizing retains the marks' original proportions. */
.client-logos img[alt="Metro Gaisano"]{width:140px;height:140px;max-width:140px;max-height:none}
.client-logos img[alt="South City Hospital"]{width:105px;height:105px;max-height:none}

/* Foreground smoke travels from the muzzle across the viewport. */
.hero-fx{position:fixed;inset:0;z-index:55;overflow:hidden;pointer-events:none;contain:strict}
.hero-smoke-volume{position:absolute;width:var(--smoke-size,140vw);height:auto;max-width:none;opacity:0;transform-origin:50% 50%;mix-blend-mode:screen;filter:saturate(.3);pointer-events:none}
.hero-shot-light{position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at var(--shot-x,85%) var(--shot-y,40%),#e9c29344,transparent 60%);mix-blend-mode:screen}
@media(max-width:700px){.emblem-stage.is-ready{cursor:pointer}.shot-flash{width:40%;left:92.7%;top:21%}}
@media(prefers-reduced-motion:reduce){.hero-fx{display:none}}