/* Digidutter shared site CSS */
:root {
  --bg: #F4EFE6;
  --ink: #1A1815;
  --red: #D84A3A;
  --yellow: #F5C542;
  --blue: #1E4FA8;
  --accent: #2A6E4E;
  --paper: #FAF6EC;
  --muted: rgba(26,24,21,.55);
  --display: 'Space Grotesk', system-ui, sans-serif;
  --body: 'Space Grotesk', system-ui, sans-serif;
  --mono: 'JetBrains Mono', monospace;
  --display-weight: 700;
}

html, body { margin:0; padding:0; background:var(--bg); color:var(--ink); font-family:var(--body); }
* { box-sizing:border-box; }

a { color: inherit; }

.grain {
  background-image:
    radial-gradient(rgba(0,0,0,.04) 1px, transparent 1px),
    radial-gradient(rgba(0,0,0,.025) 1px, transparent 1px);
  background-size: 3px 3px, 7px 7px;
  background-position: 0 0, 1px 2px;
}

.stamp {
  display:inline-block; font-family:var(--mono); font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; padding:4px 8px;
  border:1.5px solid currentColor; border-radius:2px; font-size:10px;
}

/* ── page shell ── */
.dd-page { min-height:100vh; position:relative; }
.dd-page > .grain { position:absolute; inset:0; opacity:.5; pointer-events:none; z-index:0; }
.dd-page > * { position:relative; z-index:1; }

.dd-nav {
  display:flex; justify-content:space-between; align-items:center;
  padding: 22px 40px; border-bottom:1.5px solid var(--ink);
  font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase;
  background:var(--bg);
  position:sticky; top:0; z-index:50;
}
.dd-nav a { text-decoration:none; color:var(--ink); padding:6px 10px; border:1.5px solid transparent; }
.dd-nav a:hover { border-color: var(--ink); }
.dd-nav a.active { background: var(--yellow); border-color: var(--ink); }
.dd-nav-links { display:flex; gap:2px; align-items:center; }

.dd-brand { display:flex; align-items:baseline; gap:10px; font-family:var(--display); font-weight:var(--display-weight); letter-spacing:-.02em; text-transform:none; font-size:22px; }
.dd-brand .dot { color: var(--red); }
.dd-brand .sub { font-family:var(--mono); font-size:10px; opacity:.55; font-weight:400; }

.dd-footer {
  padding: 14px 40px; border-top: 1px dashed var(--muted);
  display:flex; justify-content:space-between; align-items:center;
  font-family:var(--mono); font-size:10.5px; opacity:.6; letter-spacing:.08em; text-transform:uppercase;
}

/* ── small helpers ── */
.hover-lift { transition: transform .25s cubic-bezier(.2,.8,.3,1), box-shadow .25s; }
.hover-lift:hover { transform: translateY(-4px) rotate(0) !important; box-shadow: 4px 6px 0 rgba(0,0,0,.12); }

/* palette variants */
body.pal-bone  { --bg:#EDE7DA; --ink:#1B1B1B; --red:#C7633A; --yellow:#D9A441; --blue:#2A4E3E; --accent:#1B1B1B; --paper:#F5EFE2; --muted: rgba(27,27,27,.55); }
body.pal-dusk  { --bg:#15141A; --ink:#E8E4DB; --red:#FF5B2E; --yellow:#F5C542; --blue:#7AA7FF; --accent:#3AE1B0; --paper:#1D1C24; --muted: rgba(232,228,219,.55); }
body.pal-fjord { --bg:#E6E2D6; --ink:#0E2233; --red:#B8412C; --yellow:#E0A83D; --blue:#1B3A5A; --accent:#2F6E5C; --paper:#F0EBDC; --muted: rgba(14,34,51,.55); }

/* typography variants */
body.typ-serif-mono   { --display: 'Instrument Serif', 'DM Serif Display', serif; --display-weight: 400; }
body.typ-archivo-mono { --display: 'Archivo Black', 'Space Grotesk', sans-serif; --display-weight: 400; }