/* Brand Design Tokens (International Look) */
:root {
  /* Refined palette (Cinnamon + Saffron + Neutral) */
  --brand-crimson: #7A1423;
  --brand-crimson-alt: #8F1E30;
  --brand-saffron: #F5B400;
  --brand-saffron-accent: #FFD877;
  --brand-deep: #271514;
  --brand-surface: #FFFFFF;
  --brand-surface-alt: #FBF9F6;
  --brand-border: #E6D9CC;
  --brand-border-strong: #C8B6A6;
  --brand-success: #2f8f4e;
  --brand-danger: #c0392b;
  --brand-focus: #1D74F5;
  /* Gradients */
  --grad-primary: linear-gradient(135deg,#7A1423,#B4452D);
  --grad-accent: linear-gradient(135deg,#F5B400,#FFDD55);
  --grad-crimson-gold: linear-gradient(120deg,#7A1423 0%,#B4452D 40%,#F5B400 100%);
  /* Typography scale */
  --font-sans: 'Lato', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-serif: 'Playfair Display', Georgia, serif;
  --font-size-xs: .75rem;
  --font-size-sm: .875rem;
  --font-size-base: 1rem;
  --font-size-md: 1.125rem;
  --font-size-lg: 1.375rem;
  --font-size-xl: 1.75rem;
  --font-size-2xl: 2.25rem;
  --font-size-3xl: clamp(2.5rem,5.5vw,3.25rem);
  /* Spacing scale (4-based) */
  --space-1: .25rem; --space-2: .5rem; --space-3: .75rem; --space-4: 1rem; --space-5: 1.25rem; --space-6:1.5rem; --space-7:2rem; --space-8:2.5rem; --space-9:3rem; --space-10:4rem;
  /* Radius & Elevation */
  --radius-sm:6px; --radius:12px; --radius-lg:20px; --radius-pill: 999px;
  --shadow-sm:0 1px 2px rgba(0,0,0,.06),0 0 0 1px rgba(0,0,0,.04);
  --shadow-md:0 4px 12px -2px rgba(0,0,0,.12),0 2px 4px rgba(0,0,0,.08);
  --shadow-lg:0 12px 32px -4px rgba(0,0,0,.18),0 4px 12px rgba(0,0,0,.10);
  --transition-base: .3s cubic-bezier(.4,.2,.2,1);
}

/* Global typography refinements */
body { font-family: var(--font-sans); font-size: var(--font-size-base); letter-spacing:.2px; }
.h1, h1 { font-family: var(--font-serif); font-size: var(--font-size-3xl); font-weight:600; letter-spacing:.5px; }
.h2, h2 { font-family: var(--font-serif); font-size: var(--font-size-2xl); font-weight:600; }
.h3, h3 { font-family: var(--font-serif); font-size: var(--font-size-xl); font-weight:600; }
small, .text-sm { font-size: var(--font-size-sm); }

/* Utility classes */
.text-accent { color: var(--brand-saffron); }
.text-crimson { color: var(--brand-crimson); }
.bg-surface { background: var(--brand-surface); }
.bg-alt { background: var(--brand-surface-alt); }
.rounded { border-radius: var(--radius); }
.shadow-md { box-shadow: var(--shadow-md); }
.btn-reset { background:none;border:none;padding:0;margin:0;font:inherit; }

/* Modern focus outline */
:focus-visible { outline: 3px solid var(--brand-focus); outline-offset: 2px; }

/* Subtle selection */
::selection { background: var(--brand-saffron); color: #271514; }
body, p, li, .feature p, .about-text p, .about-text .lead { color: var(--brand-deep); -webkit-text-fill-color: currentColor; }

/* Dark theme brand color overrides */
.theme-dark {
  --brand-crimson: #ff6b6b;
  --brand-crimson-alt: #ff7b7b;
  --brand-saffron: #ffd86b;
  --brand-saffron-accent: #ffe899;
  --brand-deep: #e6eef3;
  --brand-surface: #1b1e20;
  --brand-surface-alt: #151718;
  --brand-border: rgba(255, 255, 255, 0.08);
  --brand-border-strong: rgba(255, 255, 255, 0.12);
  --grad-primary: linear-gradient(135deg, #8b1a2a, #b4552f);
  --grad-accent: linear-gradient(135deg, #ffd86b, #ffe899);
  --grad-crimson-gold: linear-gradient(120deg, #8b1a2a 0%, #b4552f 40%, #ffd86b 100%);
  --shadow-sm: 0 1px 3px rgba(0,0,0,.3), 0 0 0 1px rgba(255,255,255,.05);
  --shadow-md: 0 4px 15px rgba(0,0,0,.4), 0 2px 6px rgba(0,0,0,.2);
  --shadow-lg: 0 12px 35px rgba(0,0,0,.5), 0 4px 15px rgba(0,0,0,.3);
}

.theme-dark body,
.theme-dark p,
.theme-dark li,
.theme-dark .feature p,
.theme-dark .about-text p,
.theme-dark .about-text .lead {
  color: var(--brand-deep);
}