/* ==============================================================================
   BAAWARAY FILMS — OFFICIAL BRAND DESIGN SYSTEM
   Authentic Fine-Art Luxury Light Theme
   (Paper / Ivory #FBFAF7, Ink #1A1814, Sindoor #9B2226, Marigold #E8A317)
   Fonts: Editor's Note, TAN Meringue, Satoshi
   ============================================================================== */

/* --- 1. Authentic Brand Fonts --- */

/* TAN Meringue (Signature Display Wordmark) */
@font-face {
  font-family: 'TAN Meringue';
  src: url('./fonts/tan-meringue/TAN-Meringue.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Editor's Note (Luxury Editorial Serif - Regular) */
@font-face {
  font-family: 'Editors Note';
  src: url('./fonts/editors-note/EditorsNote-Regular-iF664322be6e849.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Editor's Note";
  src: url('./fonts/editors-note/EditorsNote-Regular-iF664322be6e849.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Editor's Note (Luxury Editorial Serif - Italic) */
@font-face {
  font-family: 'Editors Note';
  src: url('./fonts/editors-note/EditorsNote-Italic-iF664322be57316.otf') format('opentype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Editor's Note";
  src: url('./fonts/editors-note/EditorsNote-Italic-iF664322be57316.otf') format('opentype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

/* Editor's Note (Luxury Editorial Serif - Medium) */
@font-face {
  font-family: 'Editors Note';
  src: url('./fonts/editors-note/EditorsNote-Medium-iF664322be6500a.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Editor's Note";
  src: url('./fonts/editors-note/EditorsNote-Medium-iF664322be6500a.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* Editor's Note (Luxury Editorial Serif - Bold) */
@font-face {
  font-family: 'Editors Note';
  src: url('./fonts/editors-note/EditorsNote-Bold-iF664322be38357.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Editor's Note";
  src: url('./fonts/editors-note/EditorsNote-Bold-iF664322be38357.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Editor's Note (Luxury Editorial Serif - Bold Italic) */
@font-face {
  font-family: 'Editors Note';
  src: url('./fonts/editors-note/EditorsNote-BoldItalic-iF664322be3e863.otf') format('opentype');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Editor's Note";
  src: url('./fonts/editors-note/EditorsNote-BoldItalic-iF664322be3e863.otf') format('opentype');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

/* Editor's Note (Luxury Editorial Serif - Light) */
@font-face {
  font-family: 'Editors Note';
  src: url('./fonts/editors-note/EditorsNote-Light-iF664322be5b734.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Editor's Note";
  src: url('./fonts/editors-note/EditorsNote-Light-iF664322be5b734.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

/* Satoshi (UI & Sans) */
@font-face {
  font-family: 'Satoshi';
  src: url('./fonts/satoshi/Satoshi-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Satoshi';
  src: url('./fonts/satoshi/Satoshi-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Satoshi';
  src: url('./fonts/satoshi/Satoshi-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* --- 2. Master Brand Color Tokens (Light Theme First) --- */

:root {
  /* Primary Ground & Surfaces (Fine-art Luxury Light Palette) */
  --color-paper: #FBFAF7;         /* Warm fine-art ivory canvas */
  --color-cream: #F3EFEA;         /* Elevated container background */
  --color-surface-white: #FFFFFF;  /* Crisp card & modal background */
  --color-surface-elevated: #EDE7DF;
  --color-rule: #D6D0C6;          /* Hairline border divider */
  --color-border-subtle: #E2DDD5;
  --color-border-gold: rgba(232, 163, 23, 0.45);

  /* Studio Text & Typography */
  --color-ink: #1A1814;           /* Primary editorial text (Warm Studio Ink) */
  --color-muted: #6B655C;         /* Secondary labels, metadata, captions */
  --color-text-secondary: #8C857B;/* Subtle timestamps and helper text */

  /* Ceremonial Crimson (Primary Brand Color) */
  --color-sindoor: #9B2226;
  --color-sindoor-light: #B82B30;
  --color-sindoor-dark: #7A191D;
  --color-sindoor-glow: rgba(155, 34, 38, 0.25);

  /* Warm Marigold (Radiant Gold Accent) */
  --color-marigold: #E8A317;
  --color-marigold-light: #F4B942;
  --color-marigold-dark: #C8860B;
  --color-marigold-glow: rgba(232, 163, 23, 0.25);

  /* Earthy Green (Organic Accent & Badges) */
  --color-mehendi: #4A6741;
  --color-mehendi-light: #5D8052;

  /* Typography Stacks (Strictly Editor's Note, TAN Meringue, Satoshi) */
  --font-serif: "Editors Note", "Editor's Note", Georgia, serif;
  --font-display: "TAN Meringue", "Editors Note", "Editor's Note", Georgia, serif;
  --font-sans: "Satoshi", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-editorial: "Editors Note", "Editor's Note", Georgia, serif;
}

/* --- 3. Brand Utilities & Components --- */

.font-serif {
  font-family: var(--font-serif);
}

.font-display {
  font-family: var(--font-display);
}

.font-sans {
  font-family: var(--font-sans);
}

.font-editorial {
  font-family: var(--font-editorial);
}

/* Primary Sindoor Button */
.btn-sindoor {
  background: linear-gradient(135deg, var(--color-sindoor), var(--color-sindoor-light));
  color: #FFFFFF;
  border: 1px solid rgba(155, 34, 38, 0.3);
  box-shadow: 0 4px 14px var(--color-sindoor-glow);
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.btn-sindoor:hover {
  background: linear-gradient(135deg, var(--color-sindoor-light), #C73439);
  box-shadow: 0 6px 20px rgba(184, 43, 48, 0.35);
  transform: translateY(-1px);
}

/* Radiant Marigold Button */
.btn-marigold {
  background: linear-gradient(135deg, var(--color-marigold), var(--color-marigold-dark));
  color: #1A1814;
  border: 1px solid rgba(232, 163, 23, 0.4);
  box-shadow: 0 4px 14px var(--color-marigold-glow);
  font-weight: 600;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.btn-marigold:hover {
  background: linear-gradient(135deg, var(--color-marigold-light), var(--color-marigold));
  box-shadow: 0 6px 20px rgba(244, 185, 66, 0.35);
  transform: translateY(-1px);
}

/* Elegant Marigold Pill Badge */
.badge-gold {
  background: rgba(232, 163, 23, 0.12);
  color: #9E6B08;
  border: 1px solid var(--color-border-gold);
  border-radius: 9999px;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* Light Theme Porcelain Card */
.card-glass {
  background: #FFFFFF;
  border: 1px solid var(--color-rule);
  border-radius: 16px;
  box-shadow: 0 4px 20px rgba(26, 24, 20, 0.04);
}