/* ===== System Magic — shared brand styles ===== */

/* Brand tokens (rgb triples; used as rgb(var(--x)) and in Tailwind config) */
:root {
  --cream: 255 248 243;   /* #FFF8F3 background */
  --peach: 255 232 214;   /* #FFE8D6 card backgrounds */
  --ink:   45 26 14;      /* #2D1A0E text / dark sections */
  --orange:224 112 64;    /* #E07040 accent / CTA */
  --accent:224 112 64;
}

body {
  font-family: Inter, system-ui, sans-serif;
  background: rgb(var(--cream));
  color: rgb(var(--ink));
  margin: 0;
}

/* Type roles */
.font-display        { font-family: 'Archivo Black', Inter, sans-serif; letter-spacing: -.03em; line-height: .88; }
.font-condensed      { font-family: 'Bebas Neue', Inter, sans-serif; letter-spacing: .01em; }
.font-serif-editorial{ font-family: 'Fraunces', Georgia, serif; }
.text-balance        { text-wrap: balance; }

/* Marquee */
@keyframes marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
.animate-marquee { animation: marquee 35s linear infinite; }

/* Spinning stars */
@keyframes slow-spin { to { transform: rotate(360deg); } }
.spin-slow { display: inline-block; animation: slow-spin 18s linear infinite; }

/* Agenda tick pulse */
@keyframes tick-pulse { 0%,100% { opacity: .55; transform: scale(1); } 50% { opacity: 1; transform: scale(1.35); } }
.tick-pulse { animation: tick-pulse 2.8s ease-in-out infinite; }

/* Vertical rules */
@keyframes draw-y { 0% { transform: scaleY(0); } 100% { transform: scaleY(1); } }
.rule-y { transform-origin: top center; animation: draw-y 1.4s cubic-bezier(.2,.7,.2,1) .2s both; }

/* Reveal (kept visible; no JS observer needed) */
.reveal { opacity: 1; transform: none; }

/* Eyebrow underline */
.eyebrow-rule { position: relative; display: inline-flex; align-items: center; gap: .875rem; }
.eyebrow-rule:after { content: ""; display: inline-block; height: 1px; width: 3.5rem; background: currentColor; opacity: .55; }

/* Film grain overlay */
.grain { position: relative; }
.grain:after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .18; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.35 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Agenda hover */
.agenda-row { position: relative; transition: background-color .5s ease; }
.agenda-row:before { content: ""; position: absolute; left: 0; top: 50%; width: 0; height: 1px; background: rgb(var(--accent)); transform: translateY(-50%); transition: width .6s cubic-bezier(.2,.7,.2,1); }
.agenda-row:hover:before { width: 1.5rem; }
.agenda-title { transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.agenda-row:hover .agenda-title { transform: translateX(1.75rem); }

/* Card hover lift (home page) */
.lift { transition: transform .4s cubic-bezier(.2,.7,.2,1), border-color .4s ease; }
.lift:hover { transform: translateY(-4px); }

/* Smooth anchor scrolling */
html { scroll-behavior: smooth; }