/* =============================================
   BASE.CSS — Design tokens & reset
   Palette: Deep space violet × warm amber
   ============================================= */

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

:root {
  /* Core palette */
  --ink:        #080810;
  --ink-2:      #0f0f1a;
  --ink-3:      #161625;
  --ink-4:      #1e1e30;
  --ink-5:      #26263c;

  /* Accents */
  --violet:     #7b61ff;
  --violet-dim: #7b61ff33;
  --violet-mid: #7b61ff88;
  --amber:      #ffb347;
  --amber-dim:  #ffb34722;
  --rose:       #ff6b8a;
  --rose-dim:   #ff6b8a22;
  --sage:       #4ecdc4;
  --sage-dim:   #4ecdc422;

  /* Text */
  --text-1:     #f0eeff;
  --text-2:     #a8a0cc;
  --text-3:     #5e5880;
  --text-4:     #2e2a48;

  /* Semantic */
  --success:    #4ecdc4;
  --danger:     #ff6b8a;
  --warning:    #ffb347;

  /* Spacing */
  --space-xs:   4px;
  --space-sm:   8px;
  --space-md:   16px;
  --space-lg:   24px;
  --space-xl:   36px;
  --space-2xl:  56px;

  /* Radius */
  --r-sm:       8px;
  --r-md:       14px;
  --r-lg:       20px;
  --r-xl:       28px;
  --r-full:     999px;

  /* Shadows */
  --shadow-card: 0 2px 20px #00000040;
  --shadow-float: 0 8px 40px #00000060;

  /* Safe areas */
  --safe-top:    env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);

  /* Nav height */
  --nav-h: 68px;
}

/* ---- RESET ---- */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-tap-highlight-color: transparent;
}

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
}

body {
  background: var(--ink);
  color: var(--text-1);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  min-height: 100dvh;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

button {
  font-family: inherit;
  cursor: pointer;
  border: none;
  background: none;
  color: inherit;
}

input, textarea {
  font-family: inherit;
  color: inherit;
}

img { display: block; max-width: 100%; }

/* ---- TYPOGRAPHY ---- */
.t-display {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.t-display-italic {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-weight: 400;
  line-height: 1.3;
}

.t-heading {
  font-weight: 700;
  font-size: 20px;
  letter-spacing: -0.01em;
}

.t-sub {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-3);
}

/* ---- UTIL CLASSES ---- */
.hidden  { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }