:root { --charcoal:#0b0f14; --ink:#111827; --slate:#1e293b; --steel:#64748b; --cobalt:#2563eb; --cobalt-dark:#1d4ed8; --offwhite:#f8fafc; --surface:#ffffff; --line:#d9e1ea; --muted:#526174; --soft:#eef3f8; --gutter:clamp(1.25rem,4vw,4.75rem); --max:1440px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--charcoal); }
body { margin:0; background:var(--offwhite); color:var(--ink); font:1rem/1.65 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; }
button,input,textarea,select { font:inherit; }
button,a { touch-action:manipulation; }
a { color:inherit; text-decoration:none; }
a:hover { text-decoration:underline; text-underline-offset:.25em; }
::selection { background:#bfdbfe; color:var(--charcoal); }
:focus-visible { outline:3px solid #60a5fa; outline-offset:4px; }
.skip-link { position:fixed; z-index:10; left:1rem; top:1rem; padding:.75rem 1rem; background:var(--cobalt); color:#fff; transform:translateY(-200%); }
.skip-link:focus { transform:none; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.site-shell { max-width:var(--max); margin:0 auto; background:var(--surface); overflow:hidden; }
.site-header { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:1.1rem var(--gutter); background:var(--charcoal); color:#fff; border-bottom:1px solid #263241; position:relative; z-index:2; }
.brand { display:flex; align-items:center; gap:.75rem; min-width:max-content; }
.brand:hover { text-decoration:none; }
.brand-wordmark { font-size:1.45rem; font-weight:800; letter-spacing:-.06em; line-height:1; }
.brand-wordmark > span { color:#60a5fa; }.brand-wordmark small { display:block; margin-top:.4rem; color:#94a3b8; font-size:.5rem; font-weight:700; letter-spacing:.24em; line-height:1; }
.main-nav { display:flex; flex-wrap:wrap; justify-content:center; gap:.35rem 1.5rem; color:#cbd5e1; font-size:.9rem; }
.main-nav a { padding:.45rem 0; }.main-nav a:hover { color:#fff; text-decoration:none; }
.header-cta { display:inline-flex; align-items:center; gap:.65rem; padding:.7rem 1rem; border:1px solid #36506f; border-radius:999px; color:#fff; font-weight:700; font-size:.9rem; white-space:nowrap; }
.header-cta:hover { background:#162235; text-decoration:none; }
.section-pad { padding:clamp(3.75rem,7vw,7rem) var(--gutter); }
.hero { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr); gap:clamp(2.5rem,6vw,6rem); align-items:center; background:var(--charcoal); color:#fff; position:relative; }
.hero::before { content:""; position:absolute; inset:0; opacity:.22; pointer-events:none; background-image:linear-gradient(#334155 1px,transparent 1px),linear-gradient(90deg,#334155 1px,transparent 1px); background-size:64px 64px; mask-image:linear-gradient(90deg,#000 0%,transparent 75%); }
.hero-copy,.brand-panel { position:relative; z-index:1; }
.eyebrow,.section-kicker,.result-label,.brand-panel-topline,.brand-panel-footer,.system-state,.signature-meta { margin:0; color:#60a5fa; font-size:.76rem; font-weight:800; letter-spacing:.2em; line-height:1.55; text-transform:uppercase; }
.eyebrow { display:flex; align-items:center; gap:.8rem; color:#cbd5e1; letter-spacing:.14em; max-width:680px; }
.eyebrow-line { width:3.2rem; height:2px; background:var(--cobalt); flex:none; }
h1,h2,h3,p { overflow-wrap:break-word; }
h1,h2,h3 { margin:0; color:inherit; }
h1 { max-width:760px; margin-top:1.45rem; font-size:clamp(2.65rem,5.5vw,5.7rem); line-height:1.01; letter-spacing:-.065em; font-weight:800; }
h1 span { color:#3b82f6; }
h2 { font-size:clamp(2rem,3.2vw,3.3rem); line-height:1.08; letter-spacing:-.055em; font-weight:800; }
h3 { font-size:1.25rem; line-height:1.25; letter-spacing:-.025em; font-weight:800; }
.hero-intro { max-width:650px; margin:1.65rem 0 0; color:#cbd5e1; font-size:1.13rem; line-height:1.75; }
.router-form { max-width:700px; margin-top:2.3rem; padding:1.2rem; background:#111a27; border:1px solid #334155; border-radius:1rem; box-shadow:0 20px 60px #0006; }
.router-form > label { display:block; margin-bottom:.65rem; color:#fff; font-weight:800; font-size:.95rem; }
.router-input-row { display:flex; gap:.75rem; align-items:stretch; }
.router-input-row textarea { min-height:118px; flex:1; resize:vertical; background:#0b111b; color:#fff; border:1px solid #3a4b62; border-radius:.65rem; padding:.95rem; font-size:1rem; line-height:1.5; }
textarea::placeholder { color:#91a1b4; }.router-input-row textarea:focus { border-color:#60a5fa; outline:none; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:.8rem; min-height:50px; padding:.78rem 1.1rem; border:1px solid transparent; border-radius:.55rem; font-size:.95rem; line-height:1.35; font-weight:800; cursor:pointer; transition:background .18s,border-color .18s,transform .18s; }
.button:hover { text-decoration:none; transform:translateY(-1px); }.button-primary { background:var(--cobalt); color:#fff; }.button-primary:hover { background:var(--cobalt-dark); }
.router-input-row .button { align-self:flex-end; min-width:190px; }
.starter-prompts { display:flex; flex-wrap:wrap; gap:.45rem; margin-top:.8rem; }
.starter-prompts button { padding:.35rem .6rem; border:1px solid #334155; border-radius:999px; background:transparent; color:#bfdbfe; cursor:pointer; font-size:.8rem; }
.starter-prompts button:hover { border-color:#60a5fa; color:#fff; }
.hero-trust-row { display:flex; flex-wrap:wrap; gap:1rem 1.5rem; margin-top:1.25rem; color:#94a3b8; font-size:.82rem; }.hero-trust-row span { display:inline-flex; align-items:center; gap:.4rem; }.status-dot { width:.45rem; height:.45rem; display:inline-block; border-radius:50%; background:#60a5fa; box-shadow:0 0 0 4px #2563eb33; }
.brand-panel { padding:1rem; background:#111a27; border:1px solid #334155; border-radius:1rem; box-shadow:0 18px 50px #0005; }
.brand-panel-topline,.brand-panel-footer { display:flex; align-items:center; justify-content:space-between; gap:1rem; color:#94a3b8; font-size:.68rem; letter-spacing:.22em; }
.brand-board-frame { position:relative; margin:1rem 0; aspect-ratio:1731/909; overflow:hidden; border:1px solid #334155; border-radius:.55rem; background:#f8fafc; }
.brand-board-frame img { width:100%; height:100%; object-fit:contain; object-position:center; display:block; }.brand-board-overlay { position:absolute; inset:auto 0 0; display:flex; justify-content:space-between; gap:.75rem; padding:.75rem; background:linear-gradient(#0b0f14b3,#0b0f14f2); color:#fff; font-size:.65rem; font-weight:800; letter-spacing:.15em; }
.blue-rule { width:2.25rem; height:2px; background:#2563eb; }
.router-result { padding-block:3.25rem; background:#0f1723; color:#fff; }.result-shell { padding:clamp(1.5rem,4vw,3rem); border:1px solid #334155; background:linear-gradient(120deg,#15243a,#0f1723); border-radius:1rem; }.result-grid { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:3rem; margin-top:1.5rem; }.result-label { color:#93c5fd; font-size:.7rem; }.result-summary { max-width:520px; margin:1rem 0 0; color:#cbd5e1; font-size:1.1rem; }.result-detail { border-left:1px solid #334155; padding-left:2rem; }.result-detail ul { display:grid; gap:.65rem; margin:1rem 0 1.5rem; padding:0; list-style:none; color:#e2e8f0; }.result-detail li { position:relative; padding-left:1.4rem; }.result-detail li::before { content:""; position:absolute; left:0; top:.7em; width:.65rem; height:2px; background:#3b82f6; }.result-actions { display:flex; flex-wrap:wrap; align-items:center; gap:1.25rem; }.text-link { color:#bfdbfe; font-weight:800; text-decoration:underline; text-underline-offset:.25em; }
.outcomes { background:#fff; }.section-heading { max-width:850px; margin-bottom:2.5rem; }.split-heading { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(240px,.8fr); gap:3rem; align-items:end; max-width:none; }.section-kicker { margin-bottom:1rem; color:var(--cobalt); }.split-heading > p,.section-heading > p:last-child { margin:0; color:var(--muted); font-size:1.05rem; line-height:1.7; }
.outcome-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; border:1px solid var(--line); background:var(--line); }.outcome-card { min-width:0; padding:1.6rem; background:#fff; }.card-index { display:block; margin-bottom:1.8rem; color:var(--cobalt); font-size:.75rem; font-weight:800; letter-spacing:.16em; }.outcome-card p { margin:1rem 0 0; color:var(--muted); }.outcome-card-accent { background:var(--charcoal); color:#fff; }.outcome-card-accent p { color:#cbd5e1; }.outcome-card-accent .card-index { color:#60a5fa; }.card-link,.capability-meta,.system-link { display:flex; justify-content:space-between; gap:1rem; margin-top:1.5rem; padding-top:1rem; border-top:1px solid var(--line); color:var(--cobalt); font-weight:800; }.outcome-card-accent .card-link { color:#93c5fd; border-color:#334155; }
.capabilities { background:#f3f6fa; border-block:1px solid var(--line); }.capability-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; }.capability-card { display:flex; min-width:0; flex-direction:column; padding:1.4rem; border:1px solid var(--line); border-radius:.75rem; background:#fff; transition:border-color .18s,transform .18s,box-shadow .18s; }.capability-card:hover { border-color:#6b9bf3; box-shadow:0 12px 30px #1e293b12; text-decoration:none; transform:translateY(-2px); }.capability-icon,.system-mark { display:grid; place-items:center; width:2.6rem; height:2.6rem; margin-bottom:1.35rem; background:#dbeafe; color:var(--cobalt-dark); border-radius:.45rem; font-size:.8rem; font-weight:900; letter-spacing:.08em; }.capability-card p,.system-card p { margin:.8rem 0 0; color:var(--muted); font-size:.95rem; line-height:1.55; }.capability-meta { margin-top:auto; padding-top:1.2rem; font-size:.78rem; }.capability-meta b { font-size:1.1rem; }
.working-model { background:var(--offwhite); }.model-grid { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; align-items:stretch; gap:1rem; }.model-step { padding:1.5rem; border-top:3px solid var(--cobalt); background:#fff; }.model-step > span { color:var(--cobalt); font-size:.76rem; font-weight:900; letter-spacing:.15em; }.model-step h3 { margin-top:1.2rem; }.model-step p { margin:.75rem 0 0; color:var(--muted); }.model-connector { display:grid; place-items:center; color:var(--cobalt); font-size:2rem; font-weight:300; }
.systems { background:#fff; }.system-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; }.system-card { display:flex; min-width:0; flex-direction:column; padding:1.4rem; background:#f8fafc; border:1px solid var(--line); border-radius:.75rem; }.system-card:hover { border-color:#6b9bf3; text-decoration:none; }.system-card-featured { grid-column:span 2; background:var(--charcoal); color:#fff; }.system-card-featured p { color:#cbd5e1; }.system-card > div { display:flex; align-items:center; justify-content:space-between; gap:.75rem; }.system-mark { margin:0; background:#dbeafe; }.system-state { color:var(--steel); font-size:.64rem; letter-spacing:.14em; }.system-card-featured .system-state { color:#93c5fd; }.system-card h3 { margin-top:1.5rem; }.system-link { margin-top:auto; }.system-card-featured .system-link { color:#93c5fd; border-color:#334155; }.boundary-note { display:flex; gap:.8rem; align-items:flex-start; margin-top:1.5rem; padding:1rem 1.2rem; border:1px solid #bfdbfe; border-radius:.65rem; background:#eff6ff; color:#1e3a8a; }.boundary-note p { margin:0; }.boundary-icon { display:grid; place-items:center; flex:none; width:1.45rem; height:1.45rem; border-radius:50%; background:#2563eb; color:#fff; font-weight:900; font-size:.85rem; }
.build-section { display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:3rem; align-items:center; background:var(--charcoal); color:#fff; }.build-copy { max-width:620px; }.build-copy h2 { margin-top:0; }.build-copy > p:not(.section-kicker) { margin:1.2rem 0 1.8rem; color:#cbd5e1; font-size:1.08rem; }.build-steps { display:grid; gap:.8rem; }.build-steps > div { display:grid; grid-template-columns:7rem 1fr; gap:.75rem 1.25rem; padding:1.1rem 0; border-top:1px solid #334155; }.build-steps span { color:#60a5fa; font-size:.72rem; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }.build-steps strong { font-size:1.25rem; }.build-steps small { grid-column:2; color:#94a3b8; font-size:.9rem; margin-top:-.7rem; }
.about { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr); gap:4rem; align-items:center; background:#f3f6fa; }.about-copy { max-width:720px; }.about-copy > p:not(.section-kicker) { margin:1.2rem 0 0; color:var(--muted); font-size:1.1rem; }.about-links { display:flex; flex-wrap:wrap; gap:1.5rem; margin-top:1.6rem; color:var(--cobalt); font-weight:800; }.about-signature { padding:2rem; border-left:3px solid var(--cobalt); background:#fff; }.signature-rule { display:block; width:2.4rem; height:2px; margin-bottom:1.5rem; background:var(--cobalt); }.about-signature p { margin:0; color:var(--slate); font-size:1.55rem; line-height:1.35; letter-spacing:-.03em; }.about-signature strong { color:var(--cobalt); }.signature-meta { display:block; margin-top:2rem; color:var(--steel); font-size:.65rem; letter-spacing:.16em; }
.request-section { background:#fff; border-top:1px solid var(--line); }.request-heading { max-width:760px; margin-bottom:2.5rem; }.request-heading > p:last-child { margin:1rem 0 0; color:var(--muted); font-size:1.05rem; }.request-form { padding:clamp(1.2rem,3vw,2rem); background:#f3f6fa; border:1px solid var(--line); border-radius:.8rem; }.field-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.3rem; }.field { display:flex; min-width:0; flex-direction:column; gap:.5rem; font-weight:800; }.field > span { display:flex; flex-wrap:wrap; align-items:baseline; gap:.4rem; }.field b { color:#b91c1c; }.field em { color:var(--muted); font-size:.8rem; font-style:normal; font-weight:500; }.field input,.field select,.field textarea { width:100%; min-height:50px; padding:.75rem; color:var(--ink); background:#fff; border:1px solid #aebdcd; border-radius:.45rem; font-size:1rem; line-height:1.5; }.field input:focus,.field select:focus,.field textarea:focus { border-color:var(--cobalt); outline:2px solid #93c5fd; outline-offset:1px; }.field textarea { min-height:150px; resize:vertical; }.field-full { grid-column:1/-1; }.trap-field { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }.form-footer { display:flex; flex-wrap:wrap; align-items:center; gap:1rem; margin-top:1.4rem; }.form-note { margin:0; color:var(--muted); font-size:.9rem; }.form-submit:disabled { cursor:wait; opacity:.65; }.form-status { min-height:1.5em; margin:1rem 0 0; }.form-status[data-state="success"] { color:#166534; }.form-status[data-state="error"] { color:#b91c1c; }
.site-footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.75rem 1.5rem; padding:1.2rem var(--gutter); background:var(--charcoal); color:#94a3b8; font-size:.82rem; }.site-footer a { color:#bfdbfe; }
@media (max-width:1100px) { .main-nav { gap:.35rem .8rem; }.header-cta { display:none; }.hero { grid-template-columns:1fr; }.brand-panel { max-width:760px; }.brand-board-frame { aspect-ratio:1731/909; }.capability-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.system-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.system-card-featured { grid-column:span 2; } }
@media (max-width:760px) { .site-header { flex-wrap:wrap; }.main-nav { order:3; width:100%; justify-content:flex-start; }.hero { gap:2rem; }.router-input-row { flex-direction:column; }.router-input-row .button { width:100%; }.split-heading,.result-grid,.build-section,.about { grid-template-columns:1fr; gap:1.5rem; }.result-detail { padding:1.5rem 0 0; border-left:0; border-top:1px solid #334155; }.outcome-grid,.capability-grid,.system-grid { grid-template-columns:1fr; }.system-card-featured { grid-column:auto; }.model-grid { grid-template-columns:1fr; gap:0; }.model-connector { min-height:2.5rem; transform:rotate(90deg); }.field-grid { grid-template-columns:1fr; }.field-full { grid-column:auto; }.build-steps > div { grid-template-columns:6rem 1fr; }.build-steps small { grid-column:2; }.site-footer { flex-direction:column; } }
@media (max-width:480px) { .brand-wordmark { font-size:1.25rem; }.brand-wordmark small { font-size:.42rem; letter-spacing:.15em; }.hero { padding-top:3.5rem; }.eyebrow { align-items:flex-start; }.eyebrow-line { margin-top:.65rem; }.brand-board-frame { aspect-ratio:1731/909; }.brand-board-overlay { flex-direction:column; gap:.25rem; }.hero-trust-row { display:grid; gap:.55rem; }.form-submit { width:100%; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none !important; animation:none !important; } }

/* Light professional first impression: keep the darker control-plane moments below the fold. */
.site-header { background:#fff; color:var(--ink); border-bottom-color:#d9e1ea; }
.brand-wordmark { color:var(--ink); }
.brand-wordmark small { color:var(--steel); }
.main-nav { color:#475569; }
.main-nav a:hover { color:var(--ink); }
.header-cta { color:var(--ink); border-color:#b9c7d6; }
.header-cta:hover { background:#eff6ff; }
.hero { background:#f8fafc; color:var(--ink); border-bottom:1px solid #d9e1ea; }
.hero::before { opacity:.3; background-image:linear-gradient(#cbd5e1 1px,transparent 1px),linear-gradient(90deg,#cbd5e1 1px,transparent 1px); mask-image:linear-gradient(90deg,#000 0%,transparent 82%); }
.eyebrow { color:#475569; }
.hero-intro { color:#475569; }
.router-form { background:#fff; border-color:#d9e1ea; box-shadow:0 20px 50px #1e293b14; }
.router-form > label { color:var(--ink); }
.router-input-row textarea { background:#f8fafc; color:var(--ink); border-color:#aebdcd; }
.router-input-row textarea:focus { border-color:var(--cobalt); }
.starter-prompts button { background:#f8fafc; color:#334155; border-color:#cbd5e1; }
.starter-prompts button:hover { color:var(--cobalt-dark); border-color:#60a5fa; background:#eff6ff; }
.hero-trust-row { color:#526174; }
.status-dot { background:var(--cobalt); box-shadow:0 0 0 4px #2563eb22; }
.brand-panel { background:#fff; border-color:#d9e1ea; box-shadow:0 18px 50px #1e293b14; }
.brand-panel-topline,.brand-panel-footer { color:var(--steel); }
.brand-board-frame { border-color:#d9e1ea; }

.brand-icon { display:block; width:2.75rem; height:2.75rem; flex-shrink:0; }
.brand:focus-visible { outline:3px solid #0891b2; outline-offset:6px; border-radius:.4rem; }