/* APEX ONE - apexone.app. Built to brand guidelines v6.0, not to taste.

   TYPE (locked): Raleway for headers, Semi-bold standard and BOLD for headers. Nothing heavier -
   the previous build reached for 800/900, which is off-guideline. Cabin Regular for body. Mono is
   a utility face and carries machine-generated values only.

   COLOUR (locked): APEX Red is the SINGLE striking accent, never modified, never gradiented. The
   ground is COOL WHITE, because the guideline reads "high contrast, typographically led ... red as
   the single striking accent on CLEAN BACKGROUNDS" - an all-dark page was off-brand. Charcoal and
   Dusty Blue are deliberate accent BANDS, not the world. Metal Blue stays subordinate to red.

   MOTIFS (locked, used sparingly as the guideline insists): hairline LINES that compose the frame
   and guide the eye; the four-DOT system carrying the palette in miniature; the cornerpiece SHAPE
   taken from the logo's angles. */

*{box-sizing:border-box;}
:root{
  --red:#DD2734; --charcoal:#0A090C; --dusty:#061826; --metal:#0F4761;
  --cool:#FBF9FF; --pure:#FFFFFF; --ink:#0A090C; --body-ink:#3A3644; --mute:#6E6879;
  --rule:#E4E0EA; --rule-2:#CFC9D8;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --disp:'Raleway',Segoe UI,sans-serif; --bodyf:'Cabin',-apple-system,Segoe UI,sans-serif;
}
html{scroll-behavior:smooth;}
body{background:var(--cool);color:var(--ink);font-family:var(--bodyf);font-size:17px;line-height:1.62;margin:0;-webkit-font-smoothing:antialiased;}
h1,h2,h3{font-family:var(--disp);text-wrap:balance;margin:0;letter-spacing:-.02em;}
p{margin:0;} a{color:inherit;}
.rail{display:none !important;}

/* MOTIF - the four-dot system */
.dots{display:flex;gap:7px;align-items:center;}
.dots i{width:7px;height:7px;border-radius:50%;display:block;}
.dots i:nth-child(1){background:var(--metal);}
.dots i:nth-child(2){background:var(--dusty);}
.dots i:nth-child(3){background:var(--charcoal);}
.dots i:nth-child(4){background:var(--red);}

/* MOTIF - cornerpiece, from the logo angles */
.corner{position:absolute;top:0;right:0;width:56px;height:56px;pointer-events:none;}
.corner::before,.corner::after{content:"";position:absolute;background:var(--red);}
.corner::before{top:0;right:0;width:56px;height:2px;}
.corner::after{top:0;right:0;width:2px;height:56px;}

.top{position:sticky;top:0;z-index:30;background:rgba(251,249,255,.93);backdrop-filter:blur(12px);border-bottom:1px solid var(--rule);}
.top-in{max-width:1180px;margin:0 auto;padding:12px clamp(20px,4vw,40px);display:flex;align-items:center;gap:16px;}
.brand{font-family:var(--disp);font-weight:700;font-size:17px;letter-spacing:.1em;color:var(--ink);text-decoration:none;white-space:nowrap;display:inline-flex;align-items:center;min-height:42px;}
.brand i{width:7px;height:7px;background:var(--red);border-radius:50%;margin-right:10px;}
.top nav{margin-left:auto;display:none;gap:6px;}
@media(min-width:880px){ .top nav{display:flex;} }
.top nav a{font-size:14.5px;color:var(--body-ink);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-height:42px;min-width:44px;padding:0 10px;transition:color .15s;}
.top nav a:hover,.top nav a:focus-visible{color:var(--red);}
.cta-sm{margin-left:auto;font-family:var(--disp);font-weight:600;font-size:14px;color:var(--pure);background:var(--red);padding:0 20px;min-height:42px;display:inline-flex;align-items:center;text-decoration:none;white-space:nowrap;transition:background .16s;}
@media(min-width:880px){ .cta-sm{margin-left:10px;} }
.cta-sm:hover{background:#c41f2b;}

.band{padding:clamp(62px,7.6vw,112px) clamp(20px,4vw,40px);position:relative;}
.in{max-width:1180px;margin:0 auto;} .narrow{max-width:740px;}
.eyebrow{font-family:var(--disp);font-weight:700;font-size:12.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--red);margin-bottom:18px;}
.lead{font-size:clamp(17.5px,1.6vw,19.5px);line-height:1.62;color:var(--body-ink);max-width:62ch;}

/* HERO - charcoal, the single high-contrast opener */
.hero{background:var(--charcoal);color:var(--cool);overflow:hidden;position:relative;}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(251,249,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(251,249,255,.05) 1px,transparent 1px);
  background-size:56px 56px;mask-image:radial-gradient(76% 64% at 12% 8%,#000,transparent 74%);
  -webkit-mask-image:radial-gradient(76% 64% at 12% 8%,#000,transparent 74%);}
.hero .in{position:relative;z-index:1;}
.hgrid{display:grid;grid-template-columns:1fr;gap:clamp(38px,4.6vw,58px);align-items:start;}
@media(min-width:1000px){ .hgrid{grid-template-columns:1.04fr .96fr;} }
h1{font-weight:700;font-size:clamp(38px,5.8vw,68px);line-height:1.04;letter-spacing:-.034em;max-width:14ch;color:var(--cool);}
.claim{font-size:clamp(16.5px,1.5vw,18.5px);line-height:1.5;color:var(--cool);font-weight:600;margin-top:24px;padding-left:16px;border-left:3px solid var(--red);max-width:44ch;}
.hero .lead{color:rgba(251,249,255,.78);margin-top:24px;}
.status{font-family:var(--mono);font-size:12.5px;color:rgba(251,249,255,.5);margin-top:26px;display:flex;gap:15px;flex-wrap:wrap;align-items:center;}
.status b{color:#7FCF9E;font-weight:500;}
.status s{text-decoration:none;color:rgba(251,249,255,.22);}
.hero .dots{margin-top:28px;}
.hero .dots i:nth-child(3){background:rgba(251,249,255,.55);}

.ledger{background:rgba(251,249,255,.045);border:1px solid rgba(251,249,255,.14);}
.lhead{display:flex;align-items:center;gap:9px;padding:13px 18px;border-bottom:1px solid rgba(251,249,255,.14);position:relative;overflow:hidden;}
.dot{width:7px;height:7px;border-radius:50%;background:var(--red);flex:none;}
@media(prefers-reduced-motion:no-preference){
  .dot{animation:pulse 2.4s ease-in-out infinite;}
  @keyframes pulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.4;transform:scale(.8);}}
  .lhead::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:34%;background:linear-gradient(90deg,transparent,var(--red),transparent);animation:scan 5s linear infinite;}
  @keyframes scan{0%{transform:translateX(-100%)}100%{transform:translateX(320%)}}
}
.lhead span{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:rgba(251,249,255,.55);}
.row{display:grid;grid-template-columns:92px 1fr;gap:15px;padding:14px 18px;border-top:1px solid rgba(251,249,255,.1);}
.row:first-of-type{border-top:none;}
.ts{font-family:var(--mono);font-size:12px;color:#8FB6C4;white-space:nowrap;padding-top:2px;font-variant-numeric:tabular-nums;}
.ev{font-size:14.8px;line-height:1.5;color:rgba(251,249,255,.8);}
.ev b{color:var(--cool);font-weight:600;}
.lfoot{padding:12px 18px;border-top:1px solid rgba(251,249,255,.14);font-family:var(--mono);font-size:12px;color:rgba(251,249,255,.45);line-height:1.5;}

.statement{background:var(--pure);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);}
.statement h2{font-weight:700;font-size:clamp(29px,4.2vw,54px);line-height:1.1;letter-spacing:-.032em;max-width:19ch;}
.statement h2 em{font-style:normal;color:var(--red);}
.statement .lead{margin-top:22px;}
.statement .dots{margin-bottom:24px;}

h2.sec{font-weight:700;font-size:clamp(27px,3.3vw,42px);letter-spacing:-.028em;max-width:20ch;}
.disc{display:grid;grid-template-columns:repeat(auto-fit,minmax(196px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:42px;}
.disc>div{background:var(--pure);padding:26px 22px;transition:background .18s;}
.disc>div:hover{background:#F4F1F8;}
.disc .n{font-family:var(--mono);font-size:12px;color:var(--red);letter-spacing:.14em;}
.disc h3{font-weight:600;font-size:17.5px;margin:10px 0 8px;}
.disc p{color:var(--mute);font-size:14.6px;line-height:1.5;}
.sectors{margin-top:38px;display:flex;flex-wrap:wrap;gap:9px;}
.sectors span{font-family:var(--mono);font-size:12.5px;color:var(--body-ink);border:1px solid var(--rule-2);background:var(--pure);padding:8px 13px;}
.stat{margin-top:50px;padding-top:34px;border-top:2px solid var(--red);display:grid;grid-template-columns:1fr;gap:8px;align-items:end;}
@media(min-width:720px){ .stat{grid-template-columns:auto 1fr;gap:32px;} }
.stat b{font-family:var(--disp);font-weight:700;font-size:clamp(66px,10vw,120px);color:var(--ink);line-height:.88;letter-spacing:-.05em;font-variant-numeric:tabular-nums;}
.stat span{color:var(--body-ink);font-size:16.5px;max-width:46ch;padding-bottom:10px;}

.arch{margin-top:38px;border:1px solid var(--rule);background:var(--pure);position:relative;}
.arch-top{padding:26px 24px;border-bottom:2px solid var(--red);}
.arch-top b{display:block;font-family:var(--disp);font-weight:700;font-size:23px;letter-spacing:.02em;}
.arch-top span{display:block;color:var(--body-ink);font-size:15px;margin-top:7px;max-width:68ch;}
.arms{display:grid;grid-template-columns:1fr;gap:1px;background:var(--rule);}
@media(min-width:760px){ .arms{grid-template-columns:1fr 1fr;} }
.arm{background:var(--pure);padding:28px 24px;}
.arm .tag{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--red);}
.arm h3{font-weight:700;font-size:21px;margin:11px 0 10px;}
.arm p{color:var(--body-ink);font-size:15.4px;line-height:1.56;}
.entity{background:#F4F1F8;border-top:1px solid var(--rule);padding:16px 24px;font-family:var(--mono);font-size:12.5px;color:var(--mute);line-height:1.6;}

/* PRINCIPLE - Dusty Blue, the one other dark moment */
.principle{background:var(--dusty);color:var(--cool);}
.principle .eyebrow{color:var(--red);}
.principle h2{color:var(--cool);}
.principle h2 em{font-style:normal;color:var(--red);}
.principle .lead{color:rgba(251,249,255,.78);}
.principle .dots i:nth-child(3){background:rgba(251,249,255,.55);}

.gov{display:grid;grid-template-columns:repeat(auto-fit,minmax(238px,1fr));gap:32px;margin-top:42px;}
.gov h3{font-weight:600;font-size:18px;margin-bottom:10px;}
.gov h3::before{content:"";display:block;width:24px;height:2px;background:var(--red);margin-bottom:13px;}
.gov p{color:var(--body-ink);font-size:15.4px;line-height:1.56;}
.limits{list-style:none;padding:0;margin:40px 0 0;max-width:64ch;}
.limits li{position:relative;padding-left:26px;margin-bottom:13px;color:var(--body-ink);font-size:16px;}
.limits li::before{content:"";position:absolute;left:0;top:.68em;width:12px;height:1px;background:var(--rule-2);}

.close{background:var(--pure);border-top:1px solid var(--rule);}
.cta{display:inline-flex;align-items:center;min-height:54px;margin-top:30px;padding:0 34px;background:var(--red);color:var(--pure);font-family:var(--disp);font-weight:700;font-size:16px;text-decoration:none;transition:background .16s,transform .16s;}
.cta:hover{background:#c41f2b;transform:translateY(-1px);}
.cta:focus-visible{outline:2px solid var(--ink);outline-offset:3px;}

footer{background:var(--charcoal);color:rgba(251,249,255,.62);padding:40px clamp(20px,4vw,40px) 52px;}
footer .in{display:grid;gap:18px;}
@media(min-width:820px){ footer .in{grid-template-columns:1.4fr 1fr;gap:44px;} }
footer p{font-size:14px;line-height:1.66;}
footer b{color:var(--cool);font-weight:600;}
footer a{color:rgba(251,249,255,.82);display:inline-flex;align-items:center;min-height:40px;}
footer .dots{margin-bottom:20px;}
footer .dots i:nth-child(3){background:rgba(251,249,255,.55);}
