@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400&family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --nido-bg:#0a1d1e; --nido-bg-deep:#061416; --nido-surface:#0f2728; --nido-surface-hi:#143031;
  --nido-accent:#d4717f; --nido-accent-dim:#b85a68;
  --nido-cream:#f5ede0; --nido-body:#d8d0c2; --nido-body-dim:#9a9388;
  --nido-forest:#3d6b3b; --nido-forest-dim:#2a4a29;
  --nido-line:#1a3537; --nido-line-strong:#2a4547;
  --nido-clay:#b96d52; --nido-sand:#e6d3b3; --nido-stone:#807468;
  --font-display:"Cormorant Garamond","Playfair Display",Georgia,serif;
  --font-body:"Inter",system-ui,sans-serif;
  --font-mono:"JetBrains Mono","Fira Code",ui-monospace,monospace;
}
* { box-sizing:border-box; }
html,body { margin:0; padding:0; background:#000; color:var(--nido-body); font-family:var(--font-body); -webkit-font-smoothing:antialiased; }
.spread { width:1920px; height:1080px; background:var(--nido-bg); color:var(--nido-body); position:relative; overflow:hidden; padding:80px 120px; display:flex; flex-direction:column; }
.spread.deep { background:var(--nido-bg-deep); }
.chrome { position:absolute; left:120px; right:120px; bottom:48px; display:flex; align-items:center; justify-content:space-between; font-family:var(--font-body); font-size:11px; letter-spacing:0.22em; text-transform:uppercase; color:var(--nido-body-dim); font-weight:500; }
.chrome .wm { display:flex; align-items:baseline; gap:14px; }
.chrome .wm .nido { font-family:var(--font-display); font-size:16px; letter-spacing:0; text-transform:lowercase; color:var(--nido-cream); font-weight:400; }
.chrome .wm .nido .n { color:var(--nido-accent); }
.section-marker { position:absolute; top:48px; right:120px; font-family:var(--font-body); font-size:11px; letter-spacing:0.22em; text-transform:uppercase; color:var(--nido-body-dim); font-weight:500; }
.label { display:inline-block; font-family:var(--font-body); font-size:12px; letter-spacing:0.24em; text-transform:uppercase; color:var(--nido-accent); border-bottom:1px solid var(--nido-accent); padding-bottom:10px; font-weight:600; }
.h1 { font-family:var(--font-display); font-weight:400; font-size:132px; line-height:0.94; letter-spacing:-0.015em; color:var(--nido-cream); margin:0; }
.h1 em { font-style:italic; font-weight:300; color:var(--nido-accent); }
.h2 { font-family:var(--font-display); font-weight:400; font-size:84px; line-height:1.08; letter-spacing:-0.01em; color:var(--nido-cream); margin:0; }
.h2 em { font-style:italic; color:var(--nido-accent); font-weight:300; }
.h3 { font-family:var(--font-display); font-weight:400; font-size:44px; line-height:1.1; color:var(--nido-cream); margin:0; }
.h4 { font-family:var(--font-display); font-weight:500; font-size:28px; line-height:1.2; color:var(--nido-cream); margin:0; }
.body { font-family:var(--font-body); font-weight:400; font-size:20px; line-height:1.6; color:var(--nido-body); margin:0; text-wrap:pretty; }
.body.lg { font-size:24px; line-height:1.55; }
.body.sm { font-size:16px; line-height:1.65; }
.body.xs { font-size:13px; line-height:1.6; color:var(--nido-body-dim); }
.caps { font-family:var(--font-body); font-size:11px; letter-spacing:0.22em; text-transform:uppercase; color:var(--nido-body-dim); font-weight:500; }
.caps.accent { color:var(--nido-accent); } .caps.cream { color:var(--nido-cream); }
.mono { font-family:var(--font-mono); font-size:13px; color:var(--nido-body); }
.accent { color:var(--nido-accent); } .cream { color:var(--nido-cream); } .dim { color:var(--nido-body-dim); } .italic { font-style:italic; } .serif { font-family:var(--font-display); }
.col { display:flex; flex-direction:column; } .row { display:flex; }
.gap-2{gap:8px} .gap-3{gap:12px} .gap-4{gap:16px} .gap-5{gap:24px} .gap-6{gap:32px} .gap-7{gap:48px} .gap-8{gap:64px} .gap-9{gap:96px}
.hairline { background:var(--nido-line); height:1px; width:100%; }
.hairline.strong { background:var(--nido-line-strong); }
.wordmark { font-family:var(--font-display); font-weight:400; text-transform:lowercase; line-height:1; color:var(--nido-cream); letter-spacing:-0.01em; }
.wordmark .n { color:var(--nido-accent); font-style:italic; font-weight:300; }
.wordmark-sub { font-family:var(--font-body); font-size:11px; letter-spacing:0.32em; text-transform:uppercase; color:var(--nido-body); font-weight:500; margin-top:14px; padding-top:14px; border-top:1px solid var(--nido-line-strong); }
.swatch { position:relative; display:flex; flex-direction:column; justify-content:flex-end; padding:24px; color:var(--nido-cream); font-family:var(--font-body); border:1px solid transparent; overflow:hidden; }
.swatch .name { font-family:var(--font-display); font-size:24px; font-weight:400; margin:0 0 12px 0; }
.swatch .hex { font-family:var(--font-mono); font-size:12px; opacity:0.85; margin:0; }
.swatch .token { font-family:var(--font-mono); font-size:10px; opacity:0.55; margin:6px 0 0 0; }
.swatch.on-light { color:#2a2520; }
.card { background:var(--nido-surface); border:1px solid var(--nido-line); padding:32px; }
.card .card-num { font-family:var(--font-display); font-size:14px; color:var(--nido-accent); letter-spacing:0.1em; margin-bottom:16px; }
.img { background-size:cover; background-position:center; background-color:var(--nido-forest-dim); }
.img.frame { border:1px solid var(--nido-line); }
.tag { display:inline-flex; align-items:center; gap:8px; padding:8px 14px; border:1px solid var(--nido-line-strong); color:var(--nido-body); font-size:11px; letter-spacing:0.18em; text-transform:uppercase; font-weight:500; }
.tag.accent { color:var(--nido-accent); border-color:var(--nido-accent); }
.btn { display:inline-flex; align-items:center; gap:12px; padding:14px 28px; font-family:var(--font-body); font-size:12px; letter-spacing:0.22em; text-transform:uppercase; font-weight:500; background:var(--nido-accent); color:var(--nido-bg-deep); border:1px solid var(--nido-accent); cursor:pointer; }
.btn.ghost { background:transparent; color:var(--nido-cream); border-color:var(--nido-line-strong); }
.btn.outline { background:transparent; color:var(--nido-accent); border-color:var(--nido-accent); }
pre.code,.code-block { font-family:var(--font-mono); font-size:13px; line-height:1.7; color:var(--nido-body); background:var(--nido-bg-deep); border:1px solid var(--nido-line); padding:22px 26px; overflow-y:auto; overflow-x:hidden; margin:0; white-space:pre; }
pre.code .k{color:var(--nido-accent);} pre.code .s{color:var(--nido-sand);} pre.code .c{color:var(--nido-body-dim);font-style:italic;} pre.code .v{color:var(--nido-cream);}
.dont { position:relative; }
.dont::before { content:""; position:absolute; inset:0; background:linear-gradient(135deg,transparent calc(50% - 1px),rgba(212,113,127,.7) 50%,transparent calc(50% + 1px)),rgba(0,0,0,0.45); pointer-events:none; }
.decree { border-left:1px solid var(--nido-accent); padding:8px 0 8px 28px; font-family:var(--font-display); font-style:italic; font-weight:400; color:var(--nido-cream); font-size:26px; line-height:1.4; }
.decree cite { display:block; margin-top:18px; font-family:var(--font-body); font-style:normal; font-size:11px; letter-spacing:0.22em; text-transform:uppercase; color:var(--nido-body-dim); font-weight:500; }
deck-stage { --deck-bg:#000; }
