/* Borzone — borzone.velofy.co
   Light, warm, premium. Trydock-style structure (centered hero, pill CTAs,
   marquee, floating cards) on a warm off-white canvas, with Borzone's
   ember-red identity kept as the single accent.
   Primary accent: ember red #E5482F. Steel/ice tones live only inside the art.
   Type: Inter (display + wordmark + body), JetBrains Mono (labels/data),
   Instrument Serif (one italic word). */

:root{
  --bg:#F7F7F4;
  --surface:#FFFFFF;
  --surface-2:#FBFAF7;
  --line:rgba(27,31,43,.10);
  --line-2:rgba(27,31,43,.16);
  --ink:#1B1F2B;
  --text:#1B1F2B;
  --muted:#756D81;
  --muted-2:#9C96A6;

  --ember:#E5482F;
  --ember-soft:#FF7E5F;
  --ember-deep:#C23A24;
  --ember-dim:rgba(229,72,47,.10);
  --steel:#5B86C9;
  --ice:#A6C4EA;

  --shadow-sm:0 1px 2px rgba(27,31,43,.04), 0 3px 10px -4px rgba(27,31,43,.06);
  --shadow:0 10px 34px -16px rgba(27,31,43,.16), 0 2px 8px -2px rgba(27,31,43,.05);
  --shadow-lg:0 44px 100px -46px rgba(27,31,43,.30), 0 14px 36px -20px rgba(27,31,43,.14);

  --maxw:1160px;
  --gutter:24px;
  --radius:14px;

  --sans:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --display:"Inter",system-ui,sans-serif;
  --serif:"Instrument Serif",Georgia,serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --wordmark:"Inter",system-ui,sans-serif;
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ font-family:var(--display); font-weight:700; letter-spacing:-.025em; margin:0; }

.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }
.skip{
  position:absolute; left:-9999px; top:0; background:var(--ink); color:#fff;
  padding:10px 16px; border-radius:8px; z-index:200;
}
.skip:focus{ left:16px; top:16px; }

/* ---------- small building blocks ---------- */
.label{
  font-family:var(--mono); font-size:11px; font-weight:500; letter-spacing:.2em;
  text-transform:uppercase; color:var(--muted);
}
/* bracketed pixel eyebrow */
.eyebrow{ display:inline-flex; align-items:center; gap:10px; }
.eyebrow .pxdot{ display:inline-grid; grid-template-columns:repeat(2,3px); gap:1.5px; }
.eyebrow .pxdot i{ width:3px; height:3px; background:var(--muted-2); }
.eyebrow .pxdot i:first-child{ background:var(--ember); }
.eyebrow .brk{ color:var(--muted-2); }

.serif-em{ font-family:var(--serif); font-style:italic; font-weight:400; letter-spacing:.005em; }
.ember{ color:var(--ember); }
.steel{ color:var(--steel); }

/* ---------- pill buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--display); font-weight:600; font-size:15px; line-height:1;
  padding:13px 22px; border-radius:999px; border:1px solid transparent; cursor:pointer;
  transition:background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease, color .18s ease;
  white-space:nowrap;
}
.btn .arrow{ transition:transform .18s ease; }
.btn:hover .arrow{ transform:translateX(3px); }
.btn--primary{
  color:#fff;
  background:linear-gradient(180deg,#ED5C42,#E5482F);
  box-shadow:0 1px 1px rgba(255,255,255,.3) inset, 0 8px 22px -10px rgba(229,72,47,.6);
}
.btn--primary:hover{ transform:translateY(-1px); box-shadow:0 1px 1px rgba(255,255,255,.3) inset, 0 12px 28px -10px rgba(229,72,47,.7); }
.btn--primary:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(229,72,47,.4); }
.btn--dark{ background:var(--ink); color:#fff; }
.btn--dark:hover{ background:#2b303e; transform:translateY(-1px); box-shadow:0 10px 24px -12px rgba(27,31,43,.5); }
.btn--dark:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(229,72,47,.4); }
.btn--ghost{ background:var(--surface); color:var(--ink); border-color:var(--line-2); box-shadow:var(--shadow-sm); }
.btn--ghost:hover{ border-color:rgba(27,31,43,.28); transform:translateY(-1px); }
.btn--ghost:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(229,72,47,.35); }

.textlink{ color:var(--muted); transition:color .15s ease; }
.textlink:hover{ color:var(--ember); }

/* pixel-cluster card icon */
.pxicon{ width:30px; height:30px; color:var(--muted); }
.pxicon .mut{ fill:currentColor; opacity:.34; }
.pxicon .emb{ fill:var(--ember); }
.pxicon .stl{ fill:var(--steel); }

/* ---------- nav ---------- */
.nav{
  position:sticky; top:0; z-index:100;
  background:rgba(247,247,244,.78);
  backdrop-filter:saturate(150%) blur(14px);
  -webkit-backdrop-filter:saturate(150%) blur(14px);
  border-bottom:1px solid var(--line);
}
.nav-inner{ display:flex; align-items:center; gap:22px; height:66px; }
.brand{ display:inline-flex; align-items:center; gap:11px; color:var(--ink); }
.brand .mark{ width:26px; height:26px; color:var(--ink); flex:0 0 auto; }
.wordmark{
  font-family:var(--wordmark); font-weight:700; font-size:16.5px;
  letter-spacing:.14em; text-transform:uppercase; padding-left:1px;
}
.nav-links{ display:flex; align-items:center; gap:28px; margin-left:16px; }
.nav-links a{ font-family:var(--display); font-weight:500; font-size:14.5px; color:var(--muted); transition:color .15s ease; }
.nav-links a:hover{ color:var(--ink); }
.nav-actions{ display:flex; align-items:center; gap:18px; margin-left:auto; }
.nav-actions .signin{ font-family:var(--display); font-weight:500; font-size:14.5px; color:var(--ink); }
.nav-actions .signin:hover{ color:var(--ember); }
.nav-actions .btn{ padding:10px 18px; font-size:14px; }
.nav-toggle{
  display:none; margin-left:auto; width:42px; height:42px; align-items:center; justify-content:center;
  background:var(--surface); border:1px solid var(--line-2); border-radius:12px; cursor:pointer; color:var(--ink);
  box-shadow:var(--shadow-sm);
}
.nav-toggle svg{ width:20px; height:20px; }
.nav-toggle .ic-close{ display:none; }
.nav[data-open="true"] .nav-toggle .ic-open{ display:none; }
.nav[data-open="true"] .nav-toggle .ic-close{ display:block; }

.nav-mobile{ display:none; border-top:1px solid var(--line); background:rgba(247,247,244,.98); }
.nav-mobile .wrap{ display:flex; flex-direction:column; padding-block:14px 22px; gap:4px; }
.nav-mobile a{ font-family:var(--display); font-weight:500; padding:12px 2px; font-size:16px; color:var(--ink); border-bottom:1px solid var(--line); }
.nav-mobile a:last-child{ border-bottom:0; }
.nav-mobile .btn{ margin-top:14px; justify-content:center; border-bottom:0; }

/* ---------- hero (centered, trydock-style) ---------- */
.hero{ position:relative; isolation:isolate; overflow:hidden; }
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(60% 50% at 50% 6%, rgba(229,72,47,.08), transparent 60%),
    radial-gradient(50% 44% at 76% 34%, rgba(91,134,201,.07), transparent 65%);
}
.hero-inner{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding-block:84px 0; min-height:calc(92svh - 66px);
}
.hero-copy{ max-width:860px; display:flex; flex-direction:column; align-items:center; }
.hero .eyebrow{
  margin-bottom:30px; padding:7px 14px; border:1px solid var(--line-2);
  background:var(--surface); border-radius:999px; box-shadow:var(--shadow-sm);
}
.hero .eyebrow .dot{ width:7px; height:7px; border-radius:50%; background:var(--ember); box-shadow:0 0 0 4px rgba(229,72,47,.14); flex:0 0 auto; }
.hero .eyebrow .txt{ font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
h1.hero-title{
  font-size:clamp(40px,7vw,78px); line-height:1.02; letter-spacing:-.04em; font-weight:800;
  margin-bottom:26px; max-width:16ch;
}
h1.hero-title .serif-em{ font-weight:400; letter-spacing:0; }
.hero-lede{ font-size:clamp(17px,2vw,20px); color:var(--muted); max-width:60ch; margin:0 auto 34px; }
.hero-lede strong{ color:var(--ink); font-weight:600; }
.hero-ctas{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:center; }
.hero-ctas .btn{ padding:15px 28px; font-size:16px; }
.hero-note{ margin-top:26px; font-family:var(--mono); font-size:12px; letter-spacing:.02em; color:var(--muted-2); }
.hero-note .ember{ color:var(--ember); }

/* hero visual stage + floating product card */
.hero-stage{ position:relative; width:100%; max-width:720px; margin:44px auto 0; }
.hero-art{ position:relative; width:100%; filter:drop-shadow(0 30px 60px rgba(27,31,43,.12)); }
.hero-art .iso{ width:100%; }
.float-card{
  position:absolute; right:-8px; bottom:14px; width:252px; z-index:3;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow-lg); padding:16px 16px 14px; text-align:left;
}
.float-card .fc-k{ display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:#3F7A2E; }
.float-card .pulse{ width:7px; height:7px; border-radius:50%; background:#5BA83E; box-shadow:0 0 0 0 rgba(91,168,62,.5); animation:runpulse 2.4s ease-out infinite; }
.float-card .fc-title{ font-family:var(--display); font-weight:700; font-size:15px; margin:11px 0 2px; letter-spacing:-.01em; }
.float-card .fc-sub{ font-family:var(--mono); font-size:11px; color:var(--muted); margin:0; }
.float-card .fc-tag{
  display:inline-flex; align-items:center; gap:6px; margin-top:12px;
  font-family:var(--mono); font-size:9.5px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--muted-2); border:1px solid var(--line-2); border-radius:999px; padding:4px 9px;
}
.float-card .fc-tag::before{ content:""; width:7px; height:7px; border-radius:2px; background:var(--ember); }

/* ---------- isometric voxel art (recolored for light bg) ---------- */
.iso{ width:100%; height:auto; display:block; overflow:visible; }
.iso polygon.face{ stroke:#F7F7F4; stroke-width:.9; stroke-linejoin:round; }
.iso .core-cube{ filter:drop-shadow(0 0 16px rgba(229,72,47,.45)); }
.iso .spark{ opacity:0; }
.iso-coreglow{ transform-box:fill-box; transform-origin:center; }
.iso:not(.paused) .spark{
  animation:isoSpark 3.4s ease-in-out infinite;
  animation-delay:calc(var(--i) * .18s);
}
.iso:not(.paused) .iso-coreglow{ animation:coreBreathe 4.2s ease-in-out infinite; }
@keyframes isoSpark{ 0%,100%{ opacity:0; } 14%{ opacity:.95; } 32%{ opacity:0; } }
@keyframes coreBreathe{ 0%,100%{ opacity:.7; } 50%{ opacity:1; } }

/* ---------- design-property band ---------- */
.proofband{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--surface-2); }
.proofband .wrap{ display:grid; grid-template-columns:repeat(3,1fr); }
.proofband .cell{ padding:30px 30px; border-left:1px solid var(--line); }
.proofband .cell:first-child{ border-left:0; padding-left:var(--gutter); }
.proofband .pfhead{ display:inline-flex; align-items:center; gap:9px; margin-bottom:14px; }
.proofband .pxmini{ display:inline-grid; grid-template-columns:repeat(3,3.5px); gap:1.5px; }
.proofband .pxmini i{ width:3.5px; height:3.5px; background:var(--muted-2); }
.proofband .cell:nth-child(1) .pxmini i:first-child{ background:var(--ember); }
.proofband .cell:nth-child(2) .pxmini i:nth-child(2){ background:var(--steel); }
.proofband .cell:nth-child(3) .pxmini i:last-child{ background:var(--ember); }
.proofband .big{ font-family:var(--display); font-weight:700; font-size:clamp(18px,2.2vw,22px); letter-spacing:-.02em; line-height:1.18; }
.proofband .sub{ margin:9px 0 0; font-family:var(--mono); font-size:11.5px; letter-spacing:.02em; color:var(--muted); line-height:1.5; }

/* ---------- generic section ---------- */
.section{ padding-block:96px; border-top:1px solid var(--line); }
.section:first-child{ border-top:0; }
.section-head{ max-width:64ch; margin-bottom:52px; }
.section-head .eyebrow{ margin-bottom:18px; }
.section-head h2{ font-size:clamp(28px,4vw,46px); line-height:1.05; letter-spacing:-.035em; font-weight:700; }
.section-head p{ margin:18px 0 0; color:var(--muted); font-size:17px; max-width:58ch; }

/* ---------- built-for marquee ---------- */
.builtfor{ padding-block:30px; border-top:1px solid var(--line); background:var(--surface-2); overflow:hidden; }
.builtfor .bf-head{ max-width:var(--maxw); margin:0 auto 16px; padding-inline:var(--gutter); }
.marquee{ position:relative; width:100%; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.marquee-track{ display:flex; width:max-content; gap:0; animation:marquee 34s linear infinite; }
.marquee:hover .marquee-track{ animation-play-state:paused; }
.marquee-row{ list-style:none; margin:0; padding:0 0 0 0; display:flex; align-items:center; gap:12px 14px; flex:0 0 auto; }
.marquee-row li{
  font-family:var(--display); font-weight:600; font-size:15px; color:var(--ink);
  letter-spacing:-.01em; display:flex; align-items:center; gap:14px; padding-left:14px;
}
.marquee-row li::after{ content:""; width:4px; height:4px; background:var(--ember); border-radius:50%; opacity:.5; }
@keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ---------- why now ---------- */
.cols3{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.wcard{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:30px; box-shadow:var(--shadow-sm); transition:box-shadow .18s ease, transform .18s ease, border-color .18s ease; }
.wcard:hover{ box-shadow:var(--shadow); transform:translateY(-2px); border-color:var(--line-2); }
.wcard .n{ font-family:var(--mono); font-size:12px; letter-spacing:.14em; color:var(--ember); }
.wcard h3{ font-size:20px; margin:16px 0 10px; letter-spacing:-.02em; }
.wcard p{ margin:0; color:var(--muted); font-size:15px; }

/* ---------- product console mock (light) ---------- */
.mock-wrap{ position:relative; }
.mock-note{
  display:inline-flex; align-items:center; gap:8px; margin-bottom:18px;
  font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted); border:1px solid var(--line-2); border-radius:999px; padding:6px 12px; background:var(--surface);
}
.mock-note .sq{ width:8px; height:8px; border-radius:2px; background:var(--ember); }
.console{
  background:var(--surface);
  border:1px solid var(--line); border-radius:18px; overflow:hidden;
  box-shadow:var(--shadow-lg);
}
.console-bar{
  display:flex; align-items:center; gap:14px; padding:14px 18px; border-bottom:1px solid var(--line);
  background:var(--surface-2);
}
.console-bar .dots{ display:flex; gap:7px; }
.console-bar .dots i{ width:11px; height:11px; border-radius:50%; background:rgba(27,31,43,.12); }
.console-bar .path{ font-family:var(--mono); font-size:12.5px; color:var(--muted); }
.console-bar .path b{ color:var(--ink); font-weight:500; }
.console-grid{ display:grid; grid-template-columns:1.35fr 1fr; }
.console-main{ padding:22px; border-right:1px solid var(--line); min-width:0; }
.console-side{ padding:22px; display:flex; flex-direction:column; gap:18px; background:var(--surface-2); min-width:0; }

.eng-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:20px; }
.eng-head .org{ font-family:var(--display); font-weight:700; font-size:17px; }
.eng-head .scope{ font-family:var(--mono); font-size:12px; color:var(--muted); margin-top:5px; }
.running{
  display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:11.5px;
  letter-spacing:.04em; color:#3F7A2E; background:rgba(91,168,62,.12); border:1px solid rgba(91,168,62,.3);
  padding:6px 11px; border-radius:999px; white-space:nowrap;
}
.running .pulse{ width:7px; height:7px; border-radius:50%; background:#5BA83E; box-shadow:0 0 0 0 rgba(91,168,62,.6); animation:runpulse 2.4s ease-out infinite; }
@keyframes runpulse{ 0%{ box-shadow:0 0 0 0 rgba(91,168,62,.5);} 70%{ box-shadow:0 0 0 7px rgba(91,168,62,0);} 100%{ box-shadow:0 0 0 0 rgba(91,168,62,0);} }

.graph-card{ border:1px solid var(--line); border-radius:12px; background:var(--surface-2); padding:4px; margin-bottom:20px; }
.graph-card svg{ width:100%; height:auto; display:block; }
.graph-cap{ display:flex; justify-content:space-between; padding:9px 12px 4px; font-family:var(--mono); font-size:11px; color:var(--muted); letter-spacing:.06em; }

.findings{ border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.findings .fhead,.findings .frow{ display:grid; grid-template-columns:86px 1fr 74px; gap:12px; align-items:center; }
.findings .fhead{ padding:11px 14px; background:var(--surface-2); border-bottom:1px solid var(--line);
  font-family:var(--mono); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
.findings .frow{ padding:13px 14px; border-bottom:1px solid var(--line); }
.findings .frow:last-child{ border-bottom:0; }
.findings .title{ font-size:14px; color:var(--ink); min-width:0; }
.findings .st{ justify-self:end; font-family:var(--mono); font-size:11px; color:var(--muted); }

.sev{
  display:inline-flex; align-items:center; gap:7px; font-family:var(--mono); font-size:10.5px;
  letter-spacing:.06em; text-transform:uppercase; padding:4px 9px; border-radius:6px; white-space:nowrap;
}
.sev i{ width:7px; height:7px; border-radius:2px; }
.sev--critical{ color:var(--ember-deep); background:var(--ember-dim); border:1px solid rgba(229,72,47,.3); }
.sev--critical i{ background:var(--ember); }
.sev--high{ color:#9A6318; background:rgba(214,150,60,.13); border:1px solid rgba(214,150,60,.32); }
.sev--high i{ background:#D6963C; }
.sev--medium{ color:#73701F; background:rgba(176,166,96,.16); border:1px solid rgba(176,166,96,.32); }
.sev--medium i{ background:#B0A660; }
.sev--low{ color:var(--muted); background:rgba(27,31,43,.05); border:1px solid var(--line-2); }
.sev--low i{ background:var(--muted); }

.sidecard{ border:1px solid var(--line); border-radius:12px; padding:18px; background:var(--surface); box-shadow:var(--shadow-sm); }
.sidecard .k{ font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ember); }
.sidecard h4{ font-size:15.5px; margin:10px 0 6px; letter-spacing:-.01em; }
.sidecard p{ margin:0; font-size:13.5px; color:var(--muted); }
.sidecard .scopeline{ font-family:var(--mono); font-size:12px; color:var(--muted); margin:12px 0 16px; }
.approve-btns{ display:flex; gap:10px; }
.approve-btns button{
  flex:1; font-family:var(--display); font-weight:600; font-size:13.5px; padding:10px; border-radius:999px; cursor:pointer;
  border:1px solid var(--line-2); background:var(--surface); color:var(--ink); transition:all .15s ease;
}
.approve-btns .approve{ background:var(--ink); color:#fff; border-color:var(--ink); }
.approve-btns .approve:hover{ box-shadow:0 0 0 3px rgba(229,72,47,.25); }
.approve-btns .deny:hover{ border-color:rgba(27,31,43,.28); }
.evidence h4{ display:flex; align-items:center; gap:9px; }
.evidence .chk{ width:18px; height:18px; color:#3F7A2E; flex:0 0 auto; }
.evidence ul{ margin:12px 0 0; padding:0; list-style:none; display:grid; gap:9px; }
.evidence li{ font-family:var(--mono); font-size:12px; color:var(--muted); display:flex; gap:9px; }
.evidence li::before{ content:""; width:5px; height:5px; margin-top:7px; border-radius:1px; background:var(--ember); flex:0 0 auto; opacity:.7; }

/* ---------- steps (how it works) ---------- */
.how-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,420px); gap:48px; align-items:start; }
.how-art{ position:sticky; top:100px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:22px; }
.how-art .iso{ width:100%; }
.how-cap{ margin-top:12px; text-align:center; font-family:var(--mono); font-size:11px; letter-spacing:.08em; color:var(--muted); }
.steps{ list-style:none; margin:0; padding:0; display:grid; gap:0; border-top:1px solid var(--line); }
.steps li{ display:grid; grid-template-columns:52px 1fr; gap:20px; padding:24px 0; border-bottom:1px solid var(--line); align-items:baseline; }
.steps .sno{ font-family:var(--mono); font-size:13px; color:var(--ember); letter-spacing:.08em; }
.steps h3{ font-size:20px; letter-spacing:-.02em; margin-bottom:7px; }
.steps p{ margin:0; color:var(--muted); font-size:15px; max-width:60ch; }

/* ---------- coverage / deployment / lab card grids ---------- */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.cards--2{ grid-template-columns:repeat(2,1fr); }
.card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:28px;
  box-shadow:var(--shadow-sm);
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.card:hover{ border-color:var(--line-2); box-shadow:var(--shadow); transform:translateY(-2px); }
.card .pxicon,.card .cicon{ margin-bottom:18px; }
.card h3{ font-size:18px; letter-spacing:-.02em; margin-bottom:9px; }
.card p{ margin:0; color:var(--muted); font-size:14.5px; }
.card .tag{ display:block; margin-top:14px; font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted-2); }
.card a.tag:hover{ color:var(--ember); }
.card--dark{ background:var(--surface-2); }
.card--dark .pxicon{ color:var(--steel); }
.deploy-note{ margin-top:24px; font-size:14.5px; color:var(--muted); font-family:var(--mono); letter-spacing:.01em; line-height:1.6; }
.deploy-note .ember{ color:var(--ember); }

/* ---------- lab (from velofy) ---------- */
.lab-head .wordmark-v{ font-family:var(--wordmark); font-weight:700; letter-spacing:.08em; }

/* ---------- principles (accountability) ---------- */
.principles{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.pr{ display:flex; gap:16px; padding:24px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow-sm); }
.pr .prmark{ width:24px; height:24px; flex:0 0 auto; color:var(--ember); margin-top:2px; }
.pr h3{ font-size:16px; letter-spacing:-.01em; margin-bottom:6px; }
.pr p{ margin:0; color:var(--muted); font-size:14px; }

/* ---------- final cta band ---------- */
.cta-band{ border-top:1px solid var(--line); position:relative; overflow:hidden; background:var(--surface-2); }
.cta-band .wrap{ position:relative; z-index:1; display:grid; grid-template-columns:1.1fr .9fr; gap:40px; align-items:center; padding-block:88px; }
.cta-band::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:radial-gradient(60% 120% at 74% 50%, rgba(229,72,47,.09), transparent 60%);
}
.cta-copy h2{ font-size:clamp(30px,4.8vw,50px); line-height:1.04; letter-spacing:-.04em; margin-bottom:16px; font-weight:800; }
.cta-copy p{ color:var(--muted); font-size:17px; margin:0 0 30px; max-width:46ch; }
.cta-copy .btn{ padding:16px 28px; font-size:16px; }
.cta-art{ justify-self:center; width:100%; max-width:420px; filter:drop-shadow(0 24px 50px rgba(27,31,43,.12)); }

/* ---------- footer ---------- */
.footer{ border-top:1px solid var(--line); padding-block:48px 56px; background:var(--surface-2); }
.footer .top{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:28px; align-items:flex-start; }
.footer .brand{ margin-bottom:12px; }
.footer .tagline{ color:var(--muted); font-size:14px; max-width:40ch; }
.footer nav{ display:flex; flex-wrap:wrap; gap:14px 28px; }
.footer nav a{ font-family:var(--display); font-weight:500; color:var(--muted); font-size:14px; }
.footer nav a:hover{ color:var(--ember); }
.footer .rule{ height:1px; background:var(--line); margin:36px 0 20px; }
.footer .legal{ font-family:var(--mono); font-size:12px; color:var(--muted-2); letter-spacing:.02em; }

/* ---------- sign-in page ---------- */
.auth{ min-height:100svh; display:grid; grid-template-columns:1.05fr 1fr; background:var(--bg); }
.auth-aside{ position:relative; overflow:hidden; border-right:1px solid var(--line); display:flex; flex-direction:column; justify-content:space-between; padding:44px; background:var(--surface-2); }
.auth-aside::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(90% 70% at 24% 10%, rgba(229,72,47,.08), transparent 55%),
    radial-gradient(80% 60% at 70% 82%, rgba(91,134,201,.07), transparent 60%);
}
.auth-aside > *{ position:relative; z-index:2; }
.auth-aside .brand{ color:var(--ink); }
.auth-aside .brand .mark{ width:34px; height:34px; color:var(--ink); }
.auth-aside .wordmark{ font-size:18px; }
.auth-aside .aside-line{ font-family:var(--display); font-weight:700; font-size:clamp(24px,3.2vw,34px); letter-spacing:-.03em; line-height:1.14; max-width:18ch; }
.auth-aside .aside-foot{ font-family:var(--mono); font-size:12px; color:var(--muted); letter-spacing:.03em; }
.auth-zones{ position:absolute; right:-40px; bottom:-24px; width:430px; z-index:1; opacity:.9; pointer-events:none; }
.auth-zones .iso{ width:100%; }

.auth-main{ display:flex; flex-direction:column; min-height:100svh; }
.auth-main .auth-top{ display:flex; justify-content:flex-end; padding:24px 28px; }
.auth-main .auth-top a{ font-family:var(--display); font-weight:500; font-size:14px; color:var(--muted); }
.auth-main .auth-top a:hover{ color:var(--ember); }
.auth-card{ margin:auto; width:100%; max-width:400px; padding:0 28px 60px; }
.auth-card h1{ font-size:30px; letter-spacing:-.03em; margin-bottom:8px; font-weight:800; }
.auth-card .sub{ color:var(--muted); font-size:15px; margin:0 0 30px; }
.field label{ display:block; font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-bottom:8px; }
.field input{
  width:100%; padding:13px 14px; border-radius:12px; border:1px solid var(--line-2);
  background:var(--surface); color:var(--ink); font-size:15px; font-family:inherit;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.field input::placeholder{ color:var(--muted-2); }
.field input:focus{ outline:none; border-color:rgba(229,72,47,.55); box-shadow:0 0 0 3px rgba(229,72,47,.16); }
.auth-card .btn--primary{ width:100%; justify-content:center; margin-top:18px; padding:14px; }
.auth-msg{ margin-top:16px; font-size:13.5px; line-height:1.55; color:var(--muted); min-height:20px; }
.auth-msg.show{ color:var(--ink); border:1px solid rgba(229,72,47,.28); background:var(--ember-dim); padding:14px 16px; border-radius:12px; }
.auth-msg.show a{ color:var(--ember); font-weight:600; }
.auth-msg.err{ color:var(--ember-deep); }
.auth-alt{ display:flex; justify-content:space-between; align-items:center; margin-top:22px; padding-top:22px; border-top:1px solid var(--line); flex-wrap:wrap; gap:10px; }
.auth-alt .sso{ background:none; border:0; padding:0; font-family:var(--display); font-weight:500; font-size:14px; color:var(--muted); cursor:pointer; }
.auth-alt .sso:hover{ color:var(--ink); }
.auth-alt .book{ font-family:var(--display); font-weight:500; font-size:14px; color:var(--ink); }
.auth-alt .book:hover{ color:var(--ember); }

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .hero-inner{ padding-block:60px 0; min-height:0; }
  .hero-stage{ max-width:560px; margin-top:36px; }
  .float-card{ width:216px; right:-4px; }
  .how-grid{ grid-template-columns:1fr; gap:28px; }
  .how-art{ position:static; max-width:440px; margin-inline:auto; order:-1; }
  .cta-band .wrap{ grid-template-columns:1fr; gap:28px; }
  .cta-art{ order:-1; max-width:360px; }
  .console-grid{ grid-template-columns:1fr; }
  .console-main{ border-right:0; border-bottom:1px solid var(--line); }
  .auth{ grid-template-columns:1fr; }
  .auth-aside{ border-right:0; border-bottom:1px solid var(--line); min-height:240px; padding:28px 24px; gap:30px; }
  .auth-zones{ width:250px; right:-46px; bottom:-74px; opacity:.5; }
}
@media (max-width:860px){
  .nav-links{ display:none; }
  .nav-actions{ display:none; }
  .nav-toggle{ display:inline-flex; }
  .cols3{ grid-template-columns:1fr; }
  .cards{ grid-template-columns:1fr; }
  .cards--2{ grid-template-columns:1fr; }
  .principles{ grid-template-columns:1fr; }
  .proofband .wrap{ grid-template-columns:1fr; }
  .proofband .cell{ border-left:0; border-top:1px solid var(--line); padding-inline:var(--gutter); }
  .proofband .cell:first-child{ border-top:0; }
}
@media (max-width:560px){
  :root{ --gutter:16px; }
  .section{ padding-block:64px; }
  .hero-ctas{ width:100%; }
  .float-card{ width:190px; right:0; bottom:6px; padding:13px; }
  .float-card .fc-title{ font-size:14px; }
  .steps li{ grid-template-columns:40px 1fr; gap:14px; }
  .findings .fhead,.findings .frow{ grid-template-columns:76px 1fr; }
  .findings .st{ display:none; }
  .footer .top{ flex-direction:column; }
  .cta-band .wrap{ padding-block:60px; }
}

@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .running .pulse,.float-card .pulse{ animation:none; }
  .iso .spark{ opacity:.42 !important; animation:none !important; }
  .iso-coreglow{ opacity:.9 !important; animation:none !important; }
  .marquee-track{ animation:none !important; transform:none !important; justify-content:center; width:100%; flex-wrap:wrap; }
  .marquee-row:nth-child(2){ display:none; }
  .marquee{ -webkit-mask-image:none; mask-image:none; }
}
