/* ============================================================
   The Ivory Palace Casino & Hotel — ivorypalaceguide.com
   Direction: Editorial Luxury Bento (2026)
   Warm ivory ground, ink, muted gold, British racing green.
   Editorial magazine system. Quietly confident, never Vegas-loud.
   ============================================================ */

/* ---------- Design tokens ---------- */
:root {
  color-scheme: light;

  /* Surfaces — warm ivory */
  --bg:           #F6F1E8;  /* warm ivory ground */
  --bg-soft:      #F1EBDF;
  --surface:       #FFFFFF;  /* card surface */
  --surface-2:     #FBF7EF;  /* faintly tinted card */
  --surface-sunk:  #EFE7D8;  /* recessed card */
  --surface-raise: #FFFFFF;

  /* Ink / text — near-black on ivory (AA-checked) */
  --ink:           #171717;  /* headings */
  --text:          #2A2A2A;  /* body */
  --text-muted:    #5C544A;  /* AA on ivory */
  --text-faint:    #8A8174;  /* caption/meta only */
  --on-accent:     #FFFFFF;  /* text on gold fills */
  --on-green:      #F6F1E8;  /* text on racing green */

  /* Lines — low-alpha ink */
  --border:        rgba(23, 23, 23, 0.10);
  --border-strong: rgba(23, 23, 23, 0.18);
  --rule:          rgba(23, 23, 23, 0.08);

  /* Brand accent — muted gold */
  --accent:        #9B6A2F;  /* fills, borders, large display */
  --accent-soft:   #C2975A;
  --accent-tint:   rgba(155, 106, 47, 0.10);
  --accent-ink:    #8A5C24;  /* AA gold text on ivory */
  --accent-bright: #B07F3A;
  --accent-line:   rgba(155, 106, 47, 0.40);

  /* Trust accent — deep British racing green (18+ / responsible gambling) */
  --green:         #1F4D45;
  --green-soft:    #3A6B62;
  --green-tint:    rgba(31, 77, 69, 0.08);
  --green-ink:     #1F4D45;  /* AA green text on ivory */
  --green-line:    rgba(31, 77, 69, 0.40);

  /* Status (AA on ivory) */
  --good:    #2F6B4F;
  --good-tint: rgba(47, 107, 79, 0.10);
  --warn:    #9A4A2C;
  --warn-tint: rgba(154, 74, 44, 0.10);

  /* Type */
  --font-display: "Newsreader", Georgia, "Times New Roman", serif;
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Fluid type scale */
  --fs-h1: clamp(2.2rem, 1.6vw + 1.6rem, 3.8rem);
  --fs-h2: clamp(1.6rem, 0.9vw + 1.3rem, 2.5rem);
  --fs-h3: clamp(1.2rem, 0.5vw + 1.05rem, 1.6rem);
  --fs-body: 1.0625rem;
  --fs-sm: 0.9375rem;
  --fs-cap: 0.75rem;

  --lh-tight: 1.1;
  --lh-snug: 1.25;
  --lh-body: 1.65;

  --track-tight: -0.015em;
  --track-cap: 0.16em;

  /* Spacing (8px base) */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px;
  --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px;

  /* Layout */
  --maxw: min(1280px, 92vw);
  --maxw-narrow: min(760px, 92vw);
  --grid-cols: 12;
  --gap: 20px;
  --gap-tight: 14px;

  /* Radii — editorial: small, crisp */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 20px;
  --r-pill: 999px;

  /* Shadows — soft card elevation, no glitter */
  --shadow-1: 0 1px 2px rgba(60, 50, 30, 0.04), 0 6px 18px rgba(60, 50, 30, 0.06);
  --shadow-2: 0 14px 36px rgba(60, 50, 30, 0.10), 0 0 0 1px var(--border);
  --shadow-gold: 0 0 0 1px var(--accent-line), 0 8px 24px rgba(155, 106, 47, 0.10);
  --shadow-inset: inset 0 0 0 1px var(--border);

  /* Motion */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur: 240ms;

  /* Focus */
  --focus: 2px solid var(--accent);
  --focus-offset: 2px;
}
