/* ============================================================
   BASE — variables, reset, typography
   ============================================================ */

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

:root {
  --bg:           #060606;
  --bg-raised:    #0e0e0e;
  --surface:      rgba(255,255,255,0.032);
  --surface-alt:  rgba(255,255,255,0.055);

  /* Boosted fg values for readability */
  --fg:           #f0f0f0;
  --fg-mid:       #a8a8a8;
  --fg-dim:       #484848;

  --gold:         #c9a84c;
  --gold-bright:  #dfc06a;
  --gold-dim:     rgba(201,168,76,0.06);
  --gold-border:  rgba(201,168,76,0.22);
  --gold-line:    rgba(201,168,76,0.09);
  --gold-glow:    rgba(201,168,76,0.28);

  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-sc:      'Cormorant SC', serif;
  --font-body:    'EB Garamond', Georgia, serif;
  --font-mono:    'DM Mono', 'Courier New', monospace;

  --nav-h:   72px;
  --gutter:  clamp(20px, 7vw, 120px);
  --max-w:   1200px;
  --read-w:  680px;
  --ease:    cubic-bezier(0.19, 1, 0.22, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
}

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

html {
  background: var(--bg);
  color: var(--fg);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.65;
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body { min-height: 100vh; overflow-x: hidden; }

a      { color: inherit; text-decoration: none; transition: color 0.4s var(--ease), opacity 0.4s; }
img    { display: block; max-width: 100%; }
button { background: none; border: none; cursor: pointer; color: inherit; font-family: inherit; }

::selection { background: rgba(201,168,76,0.2); color: var(--fg); }
::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--gold-border); border-radius: 2px; }

#cc { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
body > *:not(#cc) { position: relative; z-index: 1; }