/* unykorn.ai — site v2 (2026-09-29). Gate Mark palette from _brand-pdf/brand.css: graphite, steel ring, orange chevron. */
:root{
  --graphite:#0b0f14; --graphite-2:#141b24; --graphite-3:#1c2531;
  --steel:#8b97a5; --steel-2:#c9d1da; --steel-3:#e7ecf1;
  --orange:#e8731c; --orange-2:#ff9a3d; --orange-soft:#fff4ea; --orange-ink:#b4520c;
  --ink:#0f141a; --ink-2:#2a333d; --muted:#5f6b78; --line:#dfe3e8; --soft:#f5f7f9; --paper:#ffffff;
  --ok:#157a46; --ok-soft:#eaf6ef; --ok-line:#bfe3cf;
  --warn:#a86a09; --warn-soft:#fdf5e6; --warn-line:#f0d9a8;
  --na:#6b7785; --na-soft:#eef1f4; --na-line:#d8dde3;
  --h:'Outfit',system-ui,sans-serif; --b:'Inter',system-ui,sans-serif; --m:'JetBrains Mono',ui-monospace,Menlo,monospace;
  --gutter:16px; --max:1120px; --text:72ch;
}
@media (min-width:720px){:root{--gutter:32px}}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--b);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--orange-2);text-underline-offset:3px;text-decoration-thickness:1.5px}
a:hover{text-decoration-color:var(--orange)}
h1,h2,h3,h4{font-family:var(--h);color:var(--ink);line-height:1.15;margin:0 0 .5em;letter-spacing:-.01em;text-wrap:balance}
h1{font-size:clamp(34px,5.4vw,58px);font-weight:800;letter-spacing:-.02em}
h2{font-size:clamp(26px,3.4vw,36px);font-weight:700}
h3{font-size:clamp(19px,2.2vw,22px);font-weight:700}
h4{font-size:17px;font-weight:700;margin-bottom:.3em}
p{margin:0 0 1em}
ul,ol{margin:0 0 1em;padding-left:22px}
li{margin:0 0 .4em}
li::marker{color:var(--orange)}
b,strong{font-weight:600}
code,.mono{font-family:var(--m);font-size:.86em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.narrow{max-width:var(--text)}
.muted{color:var(--muted)}
.small{font-size:14.5px;color:var(--muted)}
.k{font-family:var(--m);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--orange-ink);font-weight:700;margin:0 0 10px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--orange-2);outline-offset:2px}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:40;background:var(--graphite);color:#fff;border-bottom:1px solid rgba(201,209,218,.14)}
.hdr .bar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:#fff}
.brand img{width:36px;height:36px}
.brand .w{font-family:var(--h);font-weight:800;letter-spacing:.28em;font-size:14px;line-height:1}
.brand .w small{display:block;font-family:var(--b);font-weight:500;letter-spacing:.12em;font-size:9.5px;color:var(--steel-2);margin-top:3px;text-transform:uppercase}
.nav{display:none;align-items:center;gap:4px}
.nav a{color:#e7ecf1;text-decoration:none;font-size:14.5px;font-weight:500;padding:8px 11px;border-radius:8px}
.nav a:hover{background:rgba(255,255,255,.07)}
.nav a[aria-current="page"]{color:var(--orange-2)}
.nav .cta{margin-left:6px;background:var(--orange);color:#fff;font-weight:600;border-radius:999px;padding:9px 16px}
.nav .cta:hover{background:var(--orange-2);color:var(--graphite)}
.navbtn{display:inline-flex;align-items:center;gap:8px;background:transparent;color:#fff;border:1px solid rgba(201,209,218,.35);border-radius:8px;padding:8px 12px;font:600 13px var(--b);cursor:pointer}
.navbtn span.i{display:inline-block;width:16px;height:2px;background:#fff;position:relative}
.navbtn span.i::before,.navbtn span.i::after{content:"";position:absolute;left:0;width:16px;height:2px;background:#fff}
.navbtn span.i::before{top:-5px}.navbtn span.i::after{top:5px}
.mnav{display:none;background:var(--graphite-2);border-top:1px solid rgba(201,209,218,.14)}
.mnav.open{display:block}
.mnav a{display:block;color:#e7ecf1;text-decoration:none;padding:13px var(--gutter);border-bottom:1px solid rgba(201,209,218,.1);font-weight:500}
.mnav a[aria-current="page"]{color:var(--orange-2)}
.mnav a.cta{color:var(--orange-2);font-weight:700}
@media (min-width:900px){.nav{display:flex}.navbtn{display:none}.mnav{display:none!important}}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;background:var(--graphite);color:#fff;
  background-image:radial-gradient(900px 600px at 105% -5%,rgba(232,115,28,.26),transparent 60%),
    radial-gradient(700px 520px at -10% 108%,rgba(139,151,165,.2),transparent 60%),
    linear-gradient(160deg,#0b0f14 0%,#111923 55%,#0b0f14 100%)}
.hero .grid{position:absolute;inset:0;opacity:.06;pointer-events:none;background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);background-size:36px 36px}
.hero .ring{position:absolute;right:-18vw;top:-10vw;width:60vw;height:60vw;max-width:760px;max-height:760px;border-radius:50%;border:2px solid rgba(201,209,218,.14);box-shadow:inset 0 0 0 28px rgba(201,209,218,.035);pointer-events:none}
.hero .ring2{position:absolute;right:-6vw;top:2vw;width:44vw;height:44vw;max-width:560px;max-height:560px;border-radius:50%;border:1px solid rgba(232,115,28,.35);pointer-events:none}
.hero .in{position:relative;display:grid;gap:28px;padding:56px 0 52px}
.hero .k{color:var(--orange-2)}
.hero h1{color:#fff;max-width:18ch}
.hero h1 em{font-style:normal;color:var(--orange-2)}
.hero .lede{font-size:clamp(17px,1.6vw,20px);color:var(--steel-2);max-width:60ch;margin:0 0 22px}
.hero .mark{width:min(46vw,300px);justify-self:center;filter:drop-shadow(0 18px 40px rgba(0,0,0,.55))}
.hero .rule{width:64px;height:4px;background:linear-gradient(90deg,var(--orange),var(--orange-2));border-radius:2px;margin:0 0 22px}
.hero.sub .in{padding:44px 0 40px}
.hero.sub h1{font-size:clamp(30px,4.2vw,46px)}
.hero.sub .mark{width:min(34vw,180px)}
@media (min-width:860px){.hero .in{grid-template-columns:1.25fr .75fr;align-items:center;padding:80px 0 72px}.hero .mark{justify-self:end}}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-family:var(--h);font-weight:700;font-size:15.5px;border-radius:999px;padding:12px 22px;border:1.5px solid transparent;line-height:1.1}
.btn.primary{background:var(--orange);color:#fff}
.btn.primary:hover{background:var(--orange-2);color:var(--graphite)}
.btn.ghost{background:transparent;color:#fff;border-color:rgba(201,209,218,.45)}
.btn.ghost:hover{border-color:#fff}
.btn.dark{background:var(--graphite);color:#fff}
.btn.dark:hover{background:var(--graphite-3)}
.btn.line{background:#fff;color:var(--ink);border-color:var(--line)}
.btn.line:hover{border-color:var(--steel)}

/* ---------- sections ---------- */
.sec{padding:56px 0}
.sec+.sec{border-top:1px solid var(--line)}
.sec.soft{background:var(--soft)}
.sec.dark{background:var(--graphite);color:#fff}
.sec.dark h2,.sec.dark h3,.sec.dark p{color:#fff}
.sec.dark .k{color:var(--orange-2)}
.sec.dark .muted,.sec.dark .small{color:var(--steel-2)}
.sec.dark a{color:#fff}
@media (min-width:860px){.sec{padding:76px 0}}
.head{max-width:var(--text);margin-bottom:28px}
.head p{color:var(--ink-2);font-size:18px}

.cards{display:grid;gap:16px;margin:0 0 8px}
@media (min-width:700px){.cards{grid-template-columns:repeat(3,1fr)}.cards.two{grid-template-columns:repeat(2,1fr)}.cards.four{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.cards.four{grid-template-columns:repeat(4,1fr)}}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px 22px 18px;box-shadow:0 1px 0 rgba(15,20,26,.03);display:flex;flex-direction:column;gap:8px}
.card .k{margin-bottom:2px}
.card h3{margin:0}
.card p{margin:0;color:var(--ink-2);font-size:15.5px}
.card .more{margin-top:auto;padding-top:10px;font-weight:600;font-size:15px}
.card ul{margin:4px 0 0;padding-left:18px;font-size:15px;color:var(--ink-2)}
.door{border-top:4px solid var(--orange)}
.sec.dark .card{background:var(--graphite-2);border-color:rgba(201,209,218,.16)}
.sec.dark .card p,.sec.dark .card ul{color:var(--steel-2)}

/* steps strip */
.steps{display:grid;gap:12px;counter-reset:s;margin:0}
@media (min-width:760px){.steps{grid-template-columns:repeat(5,1fr)}.steps.six{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1000px){.steps.six{grid-template-columns:repeat(6,1fr)}}
.step{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 16px 14px;position:relative}
.step .n{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;background:var(--graphite);color:var(--orange-2);font:800 15px var(--h);margin-bottom:10px}
.step b{display:block;font-family:var(--h);font-size:16.5px;margin-bottom:4px}
.step p{margin:0;font-size:14.5px;color:var(--ink-2)}

/* stages (vertical) */
.stage{display:flex;gap:14px;align-items:stretch;margin-bottom:12px}
.stage .n{flex:0 0 40px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:var(--graphite);color:var(--orange-2);font:800 18px var(--h)}
.stage .b{flex:1;border:1px solid var(--line);border-radius:10px;padding:12px 16px;background:#fff}
.stage .b b{display:block;font-family:var(--h);font-size:17px;margin-bottom:3px}
.stage .b p{margin:0;font-size:15.5px;color:var(--ink-2)}

/* tables */
.tw{margin:0 0 18px}
table{width:100%;border-collapse:separate;border-spacing:0;font-size:15px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
th{background:var(--graphite-2);color:#fff;font-family:var(--h);font-weight:600;font-size:13.5px;letter-spacing:.02em;text-align:left;padding:11px 14px;vertical-align:bottom}
td{padding:12px 14px;vertical-align:top;border-top:1px solid var(--line);color:var(--ink-2)}
td:first-child{color:var(--ink)}
tr:nth-child(even) td{background:#fafbfc}
td.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;font-family:var(--m);font-size:14px}
.sec.dark table{background:var(--graphite-2);border-color:rgba(201,209,218,.18)}
.sec.dark th{background:#0b0f14}
.sec.dark td{color:var(--steel-2);border-color:rgba(201,209,218,.14)}
.sec.dark td:first-child{color:#fff}
.sec.dark tr:nth-child(even) td{background:rgba(255,255,255,.025)}
@media (max-width:640px){
  table.stack,table.stack tbody,table.stack tr,table.stack td{display:block;width:100%}
  table.stack thead{display:none}
  table.stack tr{border-top:1px solid var(--line);padding:6px 0}
  table.stack tr:first-child{border-top:0}
  table.stack td{border-top:0;padding:6px 14px;background:transparent!important}
  table.stack td::before{content:attr(data-l);display:block;font-family:var(--m);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
  table.stack td.num{text-align:left}
  .tw{overflow-x:auto}
}

/* status tags */
.tag{display:inline-block;font-family:var(--m);font-size:10.5px;font-weight:700;letter-spacing:.1em;padding:3px 9px;border-radius:999px;text-transform:uppercase;white-space:nowrap;vertical-align:middle}
.tag.ok{background:var(--ok-soft);color:var(--ok);border:1px solid var(--ok-line)}
.tag.warn{background:var(--warn-soft);color:var(--warn);border:1px solid var(--warn-line)}
.tag.na{background:var(--na-soft);color:var(--na);border:1px solid var(--na-line)}
.sec.dark .tag.ok{background:rgba(21,122,70,.22);border-color:rgba(21,122,70,.5);color:#8fd8ae}
.sec.dark .tag.warn{background:rgba(168,106,9,.22);border-color:rgba(168,106,9,.5);color:#f2c46e}
.sec.dark .tag.na{background:rgba(107,119,133,.22);border-color:rgba(107,119,133,.5);color:#c9d1da}

/* blocks */
.callout{border:1px solid #f3d2b3;background:var(--orange-soft);border-left:4px solid var(--orange);border-radius:10px;padding:14px 18px;margin:0 0 20px;color:var(--ink-2)}
.callout b:first-child{color:var(--orange-ink)}
.box{border:1px solid var(--line);border-radius:12px;padding:16px 18px;background:#fff;margin-bottom:12px}
.box h4{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.box h4 .n{font-family:var(--m);font-size:11px;color:#fff;background:var(--orange);border-radius:4px;padding:2px 7px}
.box p{margin:0;font-size:15.5px;color:var(--ink-2)}
.cols{display:grid;gap:16px}
@media (min-width:760px){.cols{grid-template-columns:1fr 1fr}}
.say,.dont{border-radius:12px;padding:16px 18px}
.say{background:var(--ok-soft);border:1px solid var(--ok-line)}
.dont{background:#fdf0ef;border:1px solid #f0cdc9}
.say>b:first-child,.dont>b:first-child{display:block;font-family:var(--h);font-size:17px;margin-bottom:6px}
.say>b:first-child{color:var(--ok)}.dont>b:first-child{color:#b3261e}
.say ul,.dont ul{margin:0;padding-left:18px;font-size:15.5px;color:var(--ink-2)}
ul.check{list-style:none;padding-left:0}
ul.check li{position:relative;padding-left:28px}
ul.check li::before{content:"";position:absolute;left:0;top:5px;width:14px;height:14px;border:1.5px solid var(--steel);border-radius:3px;background:#fff}
.kpis{display:grid;gap:12px;grid-template-columns:repeat(2,1fr);margin:0 0 20px}
@media (min-width:760px){.kpis{grid-template-columns:repeat(4,1fr)}}
.kpi{background:var(--graphite);color:#fff;border-radius:12px;padding:16px 16px 14px}
.kpi .v{font:800 30px var(--h);color:var(--orange-2);line-height:1.05}
.kpi .l{font-size:13.5px;color:var(--steel-2);margin-top:4px;line-height:1.35}
.hash{font-family:var(--m);font-size:12.5px;word-break:break-all;background:var(--soft);border:1px solid var(--line);border-radius:8px;padding:8px 10px;display:block;color:var(--ink-2)}
.trust{display:grid;gap:14px}
@media (min-width:700px){.trust{grid-template-columns:repeat(4,1fr)}}
.trust div{border-left:3px solid var(--orange);padding:2px 0 2px 14px}
.trust b{display:block;font-family:var(--h);font-size:15.5px}
.trust span{font-size:14px;color:var(--steel-2)}
.perimeter{border:1px solid var(--line);border-radius:12px;background:var(--soft);padding:14px 18px;font-size:15px;color:var(--ink-2);margin:0 0 18px}

/* forms */
form.intake{display:grid;gap:16px;max-width:760px}
.f2{display:grid;gap:16px}
@media (min-width:640px){.f2{grid-template-columns:1fr 1fr}}
label.f{display:block;font-weight:600;font-size:14.5px}
label.f span.req{color:var(--orange-ink)}
label.f input,label.f select,label.f textarea{display:block;width:100%;margin-top:6px;font:400 16px var(--b);color:var(--ink);background:#fff;border:1px solid var(--steel-2);border-radius:8px;padding:11px 12px}
label.f textarea{min-height:130px;resize:vertical}
label.f input:focus,label.f select:focus,label.f textarea:focus{border-color:var(--orange);outline:3px solid rgba(232,115,28,.25)}
fieldset{border:1px solid var(--line);border-radius:10px;padding:12px 16px 6px;margin:0}
legend{font-weight:600;font-size:14.5px;padding:0 6px}
.checks{display:grid;gap:6px}
@media (min-width:640px){.checks{grid-template-columns:1fr 1fr}}
.checks label{display:flex;align-items:flex-start;gap:9px;font-size:15px;color:var(--ink-2)}
.checks input{margin-top:4px;accent-color:var(--orange)}
.fallback{display:none;border:1px solid var(--line);border-radius:10px;background:var(--soft);padding:14px 16px}
.fallback.show{display:block}
.fallback textarea{width:100%;min-height:200px;font:13px/1.45 var(--m);border:1px solid var(--steel-2);border-radius:8px;padding:10px;background:#fff;color:var(--ink)}
.err{color:#b3261e;font-weight:600;font-size:14.5px;display:none}
.err.show{display:block}

/* footer */
.ftr{background:var(--graphite);color:var(--steel-2);padding:48px 0 36px;margin-top:0}
.ftr a{color:#fff}
.ftr .cols3{display:grid;gap:24px;margin-bottom:28px}
@media (min-width:760px){.ftr .cols3{grid-template-columns:1.2fr 1fr 1fr}}
.ftr h4{color:#fff;font-size:14px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px}
.ftr ul{list-style:none;padding:0;margin:0}
.ftr li{margin:0 0 7px;font-size:15px}
.ftr .per{border-top:1px solid rgba(201,209,218,.18);padding-top:18px;font-size:13.5px;color:var(--steel);line-height:1.55}
.ftr .per b{color:var(--steel-2);font-weight:600}
.ftr .brand{margin-bottom:10px}
.ftr .fine{font-size:12.5px;color:var(--steel);margin-top:10px}

/* CTA band */
.cta-band{background:var(--graphite-2);color:#fff;border-top:1px solid rgba(201,209,218,.14)}
.cta-band .in{display:grid;gap:18px;padding:44px 0;align-items:center}
@media (min-width:860px){.cta-band .in{grid-template-columns:1fr auto;padding:56px 0}}
.cta-band h2{color:#fff;margin-bottom:6px}
.cta-band p{color:var(--steel-2);margin:0;max-width:60ch}

@media print{.hdr,.mnav,.navbtn,.cta-band{display:none}.hero{background:#fff;color:#000}.hero h1{color:#000}}