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

/* ── Reset ─────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
img, video { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }

/* ── Tokens ─────────────────────────────────────────────────── */
:root {
  /* Brand colours */
  --turmeric:   #F5A623;
  --saffron:    #E8500A;
  --rose:       #D64045;
  --teal:       #1B7F6E;
  --teal-light: #E8F5F2;

  /* Neutrals */
  --ink:        #1A1208;
  --warm-white: #FDF8F0;
  --cream:      #FAF3E4;
  --muted:      #6B5B3E;
  --border:     rgba(26,18,8,0.12);

  /* Semantic */
  --accent:       var(--saffron);
  --accent-hover: #C7430A;
  --border-focus: var(--saffron);
  --success:      var(--teal);
  --success-bg:   var(--teal-light);
  --error:        var(--rose);
  --error-bg:     #FEF1F1;

  /* Type scale */
  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem;
  --text-4xl:  2.25rem;
  --text-5xl:  3rem;
  --text-6xl:  3.75rem;

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* Layout */
  --max-w: 1200px;
  --nav-h: 76px;

  /* Radius */
  --r-sm:  6px;
  --r-md:  12px;
  --r-lg:  20px;
  --r-xl:  32px;
  --r-full: 9999px;

  /* Shadow */
  --shadow-sm: 0 1px 3px rgba(26,18,8,0.08);
  --shadow-md: 0 4px 16px rgba(26,18,8,0.10);
  --shadow-lg: 0 12px 40px rgba(26,18,8,0.14);

  /* Transition */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 160ms;
  --dur-base: 260ms;
  --dur-slow: 420ms;
}

/* ── Base ─────────────────────────────────────────────────── */
body {
  font-family: 'Outfit', system-ui, sans-serif;
  font-size: var(--text-base);
  line-height: 1.65;
  color: var(--ink);
  background: var(--warm-white);
  -webkit-font-smoothing: antialiased;
}

.serif { font-family: 'Playfair Display', Georgia, serif; }

h1, h2, h3, h4 {
  font-family: 'Playfair Display', Georgia, serif;
  line-height: 1.2;
  font-weight: 700;
}

p { color: var(--muted); }

strong { color: var(--ink); font-weight: 600; }

/* ── Scroll reveal ─────────────────────────────────────────── */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
}
.reveal.visible {
  opacity: 1;
  transform: none;
}
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }

/* ── Marquee animation ─────────────────────────────────────── */
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ── Utility ───────────────────────────────────────────────── */
.visually-hidden {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
}
