/* Baker's Plaza design tokens (B-03). Values from docs/design-direction.md.
   Colours and fonts are UNCONFIRMED by the client; no logo file exists yet.
   Change values here only. No Graceland colours or marks. */
:root {
  /* brand palette */
  --bp-maroon: #83191C;
  --bp-red: #A91F23;
  --bp-red-dark: #8E1519;
  --bp-wheat: #FFD584;
  --bp-cream: #FFF8EA;
  --bp-wheat-tint: #FFEFC8;
  --bp-cocoa: #2A1412;

  /* semantic colours (base.css uses only these) */
  --color-bg: var(--bp-cream);
  --color-surface: #FFFFFF;
  --color-surface-2: var(--bp-wheat-tint);
  --color-text: var(--bp-cocoa);           /* 16.46 on cream */
  --color-text-muted: #6E4A44;             /* 7.29 on cream */
  --color-heading: var(--bp-maroon);       /* 9.37 */
  --color-primary: var(--bp-red);          /* white on it 7.22 */
  --color-primary-hover: var(--bp-red-dark); /* white on it 9.25 */
  --color-on-primary: #FFFFFF;
  --color-accent: var(--bp-wheat);         /* panels only, maroon text on it 7.12 */
  --color-border: rgb(131 25 28 / .16);
  --color-focus: #1F5FBF;
  --color-error: #B3261E;

  /* type: two families only. Jost stands in for Avant Garde Demi (licence unconfirmed) */
  --font-heading: "Jost", "Questrial", "Century Gothic", "Futura", system-ui, sans-serif;
  --font-body: "Jost", "Questrial", "Century Gothic", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-label: "Cormorant Garamond", Georgia, "Times New Roman", serif; /* small caps labels only */
  --heading-weight: 600;
  --heading-transform: none;
  --heading-tracking: -.01em;
  --heading-leading: 1.12;

  /* fluid type scale (390 px to 1280 px) */
  --step--1: clamp(.8125rem, .79rem + .1vw, .875rem);
  --step-0:  clamp(1rem, .96rem + .2vw, 1.125rem);
  --step-1:  clamp(1.25rem, 1.15rem + .5vw, 1.5rem);
  --step-2:  clamp(1.5rem, 1.3rem + 1vw, 2rem);
  --step-3:  clamp(1.875rem, 1.5rem + 1.9vw, 2.75rem);
  --step-4:  clamp(2.25rem, 1.6rem + 3.2vw, 4rem);

  /* spacing (4 px base) */
  --space-1: .25rem; --space-2: .5rem; --space-3: .75rem; --space-4: 1rem;
  --space-5: 1.5rem; --space-6: 2rem; --space-7: 3rem; --space-8: 4.5rem; --space-9: 6rem;

  /* shape (iOS-like) */
  --radius-sm: 12px; --radius-md: 20px; --radius-lg: 28px; --radius-pill: 999px;
  --shadow-1: 0 1px 2px rgb(42 20 18 / .08), 0 4px 12px rgb(42 20 18 / .06);
  --shadow-2: 0 2px 4px rgb(42 20 18 / .08), 0 12px 32px rgb(42 20 18 / .14);

  /* glass (macOS vibrancy) */
  --glass-bg: rgb(255 248 234 / .74);
  --glass-border: rgb(255 255 255 / .6);
  --glass-blur: saturate(160%) blur(18px);

  /* motion */
  --ease-spring: cubic-bezier(.2, .9, .25, 1.15);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --dur-1: 160ms; --dur-2: 280ms; --dur-3: 520ms;

  /* layout */
  --container: 72rem; --gutter: clamp(1rem, 4vw, 2rem); --tap: 44px;
  --z-nav: 50; --z-sheet: 80; --z-toast: 90;
}

/* dark band (footer, feature bands) */
.band-dark {
  --color-bg: var(--bp-cocoa);
  --color-surface: #3A201D;
  --color-surface-2: #482925;
  --color-text: var(--bp-cream);
  --color-text-muted: #E6D2B0;             /* 11.77 */
  --color-heading: var(--bp-wheat);        /* 12.51 */
  --color-accent: var(--bp-wheat);
  --color-border: rgb(255 248 234 / .2);
  --color-focus: #F2C14E;
  --glass-bg: rgb(42 20 18 / .62);
  --glass-border: rgb(255 255 255 / .12);
}
