/* =============================================================================
   Enclave marketing site — shared stylesheet
   Deliberate single-theme design: server-room dark steel + status-LED amber.
   Matches the product UI (services/enclave-ui steel/amber brand) so product
   screenshots sit natively on the page.
   ========================================================================== */
:root{
  --bg:#0E141B; --bg2:#121A23; --panel:#18222E; --panel2:#1D2938;
  --line:#2A3846; --ink:#E8EDF1; --muted:#93A4B3; --dim:#6B7C8B;
  --amber:#F0A32E; --amber-deep:#C97F0A; --green:#5CBF8A;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"IBM Plex Sans","Helvetica Neue",Arial,sans-serif;line-height:1.65;font-size:1rem}
h1,h2,h3{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;line-height:1.12;text-wrap:balance;margin:0}
.mono{font-family:"IBM Plex Mono",ui-monospace,monospace}
a{color:var(--amber);text-decoration:none}
a:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.wrap{max-width:72rem;margin:0 auto;padding:0 1.5rem}
.eyebrow{font-family:"IBM Plex Mono",monospace;font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);display:flex;align-items:center;gap:.55rem}
.eyebrow::before{content:"";width:.5rem;height:.5rem;border-radius:50%;background:var(--amber);box-shadow:0 0 8px var(--amber);flex:none}
section{padding:4.5rem 0;border-top:1px solid var(--line)}
p{max-width:44rem}
.muted{color:var(--muted)}
h2{font-size:clamp(1.5rem,3.4vw,2.15rem);font-weight:700;margin:.9rem 0 1rem}
h2 em{font-style:normal;color:var(--amber)}

/* nav */
nav{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.25rem 0;flex-wrap:wrap}
.logo{font-family:"Archivo",sans-serif;font-weight:800;font-size:1.15rem;letter-spacing:.02em;color:var(--ink)}
.logo span{color:var(--amber)}
nav .links{display:flex;gap:1.4rem;font-size:.85rem;flex-wrap:wrap;align-items:center}
nav .links a{color:var(--muted)}
nav .links a:hover,nav .links a:focus-visible{color:var(--ink)}
nav .links a.active{color:var(--ink);border-bottom:2px solid var(--amber);padding-bottom:2px}
nav .links a.btn{color:#191205}

/* buttons */
.btn{display:inline-block;padding:.8rem 1.5rem;border-radius:4px;font-weight:600;font-size:.95rem;border:1px solid transparent}
.btn:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.btn.primary{background:var(--amber);color:#191205}
.btn.primary:hover{background:#F7B44A}
.btn.ghost{border-color:var(--line);color:var(--ink)}
.btn.ghost:hover{border-color:var(--muted)}
.btn.small{padding:.5rem 1rem;font-size:.85rem}

/* hero */
.hero{padding:5rem 0 4.5rem;background:
  radial-gradient(60rem 30rem at 80% -10%, rgba(240,163,46,.07), transparent 60%),
  repeating-linear-gradient(90deg, transparent 0 79px, rgba(42,56,70,.35) 79px 80px);}
.hero h1{font-size:clamp(2.1rem,5.6vw,3.4rem);font-weight:800;max-width:56rem;margin:1.1rem 0 1.2rem}
.hero h1 em{font-style:normal;color:var(--amber)}
.hero .sub{font-size:1.15rem;color:var(--muted);max-width:46rem}
.ctarow{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2rem}
.statline{display:flex;flex-wrap:wrap;gap:2.5rem;margin-top:3rem;font-family:"IBM Plex Mono",monospace}
.stat .n{font-size:1.45rem;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.stat .l{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);max-width:14rem}

/* product screenshot frame */
.shot{margin:3rem 0 0;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--panel);box-shadow:0 24px 60px rgba(0,0,0,.45)}
.shot .chrome{display:flex;align-items:center;gap:.45rem;padding:.55rem .9rem;background:var(--panel2);border-bottom:1px solid var(--line)}
.shot .chrome i{width:.6rem;height:.6rem;border-radius:50%;background:var(--line);display:block}
.shot .chrome .url{margin-left:.6rem;font-family:"IBM Plex Mono",monospace;font-size:.68rem;color:var(--dim);letter-spacing:.04em}
.shot img{display:block;width:100%;height:auto}
.shotcap{font-size:.8rem;color:var(--dim);margin-top:.7rem;font-family:"IBM Plex Mono",monospace}

/* card grids */
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1rem;margin-top:1.8rem}
.card{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:1.4rem 1.5rem}
.card h3{font-size:1.02rem;font-weight:700;margin-bottom:.5rem}
.card p{font-size:.92rem;color:var(--muted);margin:.4rem 0}
.card .k{font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);display:block;margin-bottom:.5rem}

/* platform feature grid */
.platgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(19rem,1fr));gap:1rem;margin-top:1.8rem}
.plat{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:1.4rem 1.5rem}
.plat h3{font-size:1.02rem;font-weight:700;margin-bottom:.2rem}
.plat .who{font-family:"IBM Plex Mono",monospace;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);display:block;margin-bottom:.7rem}
.plat ul{margin:.4rem 0 0;padding-left:1.05rem;font-size:.9rem;color:var(--muted)}
.plat ul li{margin:.5rem 0}
.plat ul li strong{color:var(--ink);font-weight:600}
.stackline{margin-top:1.8rem;font-family:"IBM Plex Mono",monospace;font-size:.8rem;color:var(--dim);max-width:none;line-height:1.9}
.stackline strong{color:var(--muted);font-weight:500}

/* pricing table */
.tablewrap{overflow-x:auto;margin-top:1.8rem;border:1px solid var(--line);border-radius:6px}
table{border-collapse:collapse;width:100%;min-width:44rem;font-size:.92rem;background:var(--panel)}
th{font-family:"IBM Plex Mono",monospace;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);text-align:left;padding:.8rem 1.1rem;border-bottom:1px solid var(--line);font-weight:600}
td{padding:.85rem 1.1rem;border-bottom:1px solid var(--line);vertical-align:top}
tr:last-child td{border-bottom:none}
td.price{font-family:"IBM Plex Mono",monospace;white-space:nowrap;color:var(--amber);font-weight:500}
td .pkg{font-weight:600;color:var(--ink)}
.twocol{display:grid;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:1rem;margin-top:1.8rem}

/* NVIDIA stack layer diagram */
.layers{margin-top:2rem;max-width:46rem;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.layer{padding:1rem 1.4rem;border-bottom:1px solid var(--line);background:var(--panel);display:flex;justify-content:space-between;gap:1rem;align-items:baseline;flex-wrap:wrap}
.layer:last-child{border-bottom:none}
.layer .name{font-family:"Archivo",sans-serif;font-weight:700;font-size:.98rem}
.layer .desc{font-size:.82rem;color:var(--muted);text-align:right;flex:1;min-width:14rem}
.layer.enclave{background:linear-gradient(90deg, rgba(240,163,46,.14), rgba(240,163,46,.04));border-left:3px solid var(--amber)}
.layer.enclave .name{color:var(--amber)}

/* architecture diagrams (pre-rendered inline SVG — no JS, CSP-clean) */
.diagram{background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:1.5rem;margin-top:1.6rem;overflow-x:auto}
.diagram svg{display:block;margin:0 auto;max-width:100%;height:auto}
.diagramcap{font-family:"IBM Plex Mono",monospace;font-size:.78rem;color:var(--dim);margin-top:.8rem;max-width:none}

/* SKU block (partner page) */
.sku{background:var(--panel2);border:1px solid var(--amber-deep);border-radius:6px;max-width:46rem;margin-top:1.8rem;overflow:hidden}
.sku .bar{display:flex;justify-content:space-between;gap:1rem;background:rgba(240,163,46,.1);border-bottom:1px solid var(--amber-deep);padding:.55rem 1.2rem;font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.08em;color:var(--amber)}
.sku .body{padding:1.2rem 1.4rem;font-family:"IBM Plex Mono",monospace;font-size:.92rem;line-height:1.7}
.sku .body strong{color:var(--amber);font-weight:600}
.caption{font-size:.85rem;color:var(--dim);margin-top:.7rem}

/* deal math (partner page) */
.math{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:1rem;margin-top:1.8rem}
.mathcard{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:1.3rem 1.4rem}
.mathcard .n{font-family:"IBM Plex Mono",monospace;font-size:1.6rem;font-weight:600;font-variant-numeric:tabular-nums}
.mathcard.before .n{color:var(--muted)}
.mathcard.after .n{color:var(--amber)}
.mathcard.rep .n{color:var(--green)}
.mathcard .l{font-size:.85rem;color:var(--muted);margin-top:.3rem}
.rules{margin-top:1.6rem;font-size:.92rem;color:var(--muted);max-width:46rem}
.rules li{margin:.45rem 0}
.rules li strong{color:var(--ink)}

blockquote{margin:1.6rem 0 0;padding:1rem 1.3rem;background:var(--panel);border-left:3px solid var(--amber);max-width:42rem;border-radius:0 6px 6px 0}
blockquote p{margin:0;font-size:.95rem}
blockquote .src{display:block;margin-top:.45rem;font-family:"IBM Plex Mono",monospace;font-size:.7rem;color:var(--dim)}

/* checklists */
.prooflist{margin-top:1.4rem;padding-left:1.2rem;max-width:46rem}
.prooflist li{margin:.55rem 0}
.alt{background:var(--bg2)}

/* Blueprint / Enclave split table */
.splittable td:first-child{color:var(--muted)}
.splittable td:last-child{color:var(--ink)}

/* final cta */
.final{text-align:center;padding:5.5rem 0}
.final h2{font-size:clamp(1.7rem,4vw,2.5rem);max-width:50rem;margin:0 auto 1rem}
.final p{margin:0 auto 2rem;color:var(--muted)}

footer{border-top:1px solid var(--line);padding:2rem 0 3rem;font-size:.82rem;color:var(--dim)}
footer .row{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between}
footer .legal{margin-top:1.4rem;font-size:.72rem;color:var(--dim);max-width:none;line-height:1.7}
footer nav.foot{padding:0;display:flex;gap:1.2rem}
footer nav.foot a{color:var(--dim)}
footer nav.foot a:hover{color:var(--muted)}

@media (prefers-reduced-motion: no-preference){
  .eyebrow::before{animation:pulse 2.4s ease-in-out infinite}
  @keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
}
