/* Curious Factory — brand tokens
   Inferred from logo: deep navy + warm gold on ivory.
   Direction: "Lumière & Or" — éditorial premium, ivory canvas, navy ink, gold accents.
*/

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

:root {
  /* Core ink */
  --cf-navy: #1A2451;          /* logo navy */
  --cf-navy-deep: #0F1635;     /* deeper navy for backgrounds */
  --cf-navy-ink: #232E5C;
  --cf-gold: #B8893E;          /* logo gold */
  --cf-gold-bright: #D4A24A;
  --cf-gold-deep: #8E6829;
  --cf-gold-pale: #E9D7A8;

  /* Surfaces */
  --cf-ivory: #F4EFE3;         /* primary canvas */
  --cf-ivory-deep: #EBE3CF;
  --cf-paper: #FAF6EC;
  --cf-cream: #F8F2E3;

  /* Accents */
  --cf-rouge: #8E2A2A;         /* discreet velvet accent */
  --cf-line: rgba(26, 36, 81, 0.18);
  --cf-line-soft: rgba(26, 36, 81, 0.08);

  /* Type */
  --cf-display: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
  --cf-serif: 'Cormorant Garamond', Georgia, serif;
  --cf-sans: 'Inter', -apple-system, sans-serif;
  --cf-mono: 'DM Mono', 'IBM Plex Mono', monospace;
}

* { box-sizing: border-box; }

.cf-eyebrow {
  font-family: var(--cf-mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--cf-gold-deep);
  font-weight: 400;
}

.cf-display {
  font-family: var(--cf-display);
  font-weight: 400;
  font-style: normal;
  letter-spacing: -0.02em;
  line-height: 0.95;
  font-variation-settings: "opsz" 144;
}

.cf-display em {
  font-family: var(--cf-serif);
  font-style: italic;
  font-weight: 400;
}

.cf-body {
  font-family: var(--cf-sans);
  font-weight: 400;
  line-height: 1.55;
  font-size: 16px;
  color: var(--cf-navy);
}

.cf-rule {
  display: inline-flex; align-items: center; gap: 10px;
}
.cf-rule::before, .cf-rule::after {
  content: ""; width: 24px; height: 1px; background: currentColor; opacity: 0.6;
}