/*
 * Emna Hussein — design tokens.
 * Self-hosted variable fonts (latin subset) reused from the existing
 * Elementor google-fonts cache — no new font downloads.
 */

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/wp-content/uploads/elementor/google-fonts/fonts/roboto-kfo7cnqeu92fr1me7ksn66agldtyluama3yuba.woff2) format('woff2');
}

@font-face {
  font-family: 'Roboto Slab';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/wp-content/uploads/elementor/google-fonts/fonts/robotoslab-bngmuxzytxpivibgjjsb6ufn5qu.woff2) format('woff2');
}

@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/wp-content/uploads/elementor/google-fonts/fonts/jost-7353d4e7.woff2) format('woff2');
}

@font-face {
  font-family: 'Amiri';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/wp-content/uploads/elementor/google-fonts/fonts/amiri-j7afnpd8cgxbhpurhley6w.woff2) format('woff2');
}

:root {
  /* ---- Color ---- */
  --color-ink: #14110D;
  --color-ink-soft: #2A251E;
  --color-cream: #F7F2E9;
  --color-paper: #FCFAF5;
  --color-sand: #E7D8C3;
  --color-gold: #BD9426;
  --color-gold-deep: #8C6B1F;
  --color-bronze: #5E3A1E;
  --color-stone: #9C9284;
  --color-text-muted: #6B6153;
  --color-success: #5B6B4F;
  --color-error: #8C3B2E;

  /* ---- Fonts ---- */
  --font-display: 'Roboto Slab', serif;
  --font-body: 'Roboto', sans-serif;
  --font-label: 'Jost', sans-serif;
  --font-accent: 'Amiri', serif;

  /* ---- Type scale ---- */
  --text-display: clamp(3rem, 6vw, 6.5rem);
  --text-h1: clamp(2rem, 4vw, 3rem);
  --text-h2: clamp(1.625rem, 3vw, 2.25rem);
  --text-h3: clamp(1.375rem, 2vw, 1.625rem);
  --text-h4: clamp(1.125rem, 1.4vw, 1.25rem);
  --text-h5: 0.9375rem;
  --text-body-lg: 1.125rem;
  --text-body: 1rem;
  --text-caption: 0.8125rem;
  --text-eyebrow: 0.75rem;
  --text-button: 0.8125rem;
  --text-quote: clamp(1.5rem, 3vw, 2rem);

  /* ---- Spacing (4px base) ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 3rem;
  --space-7: 4rem;
  --space-8: 6rem;
  --space-9: 8rem;
  --space-10: 10rem;
  --space-11: 12.5rem;

  /* Section rhythm (overridden down at breakpoints in base.css) */
  --section-pad: var(--space-10);

  /* ---- Layout ---- */
  --container-max: 1440px;
  --container-gutter: clamp(20px, 5vw, 80px);

  /* ---- Motion ---- */
  --ease-out-soft: cubic-bezier(0.22, 1, 0.36, 1);
  --duration-fast: 200ms;
  --duration-base: 350ms;
  --duration-slow: 600ms;
  --duration-slower: 800ms;
}
