/* BBQ Lord design tokens — generated from the design system's tokens/ folder. */
/* ---- fonts ---- */
1,400..900&family=Montserrat:ital,wght@0,300..800;1,300..800&display=swap");
:root{--font-display:"Playfair Display",Georgia,"Times New Roman",serif;--font-body:"Montserrat","Helvetica Neue",Arial,sans-serif;--font-mono:ui-monospace,"SFMono-Regular",Menlo,monospace}

/* ---- colors ---- */
:root{
/* base ramps */
--brown-900:#170F0B;--brown-800:#1F1610;--brown-700:#2B1E17;--brown-600:#3B2A20;--brown-500:#543D2F;--brown-400:#7A5B48;--brown-300:#A98A73;--brown-200:#D3BFAE;--brown-100:#EADFD3;
--flame-700:#8E2F14;--flame-600:#B8451F;--flame-500:#D3542C;--flame-400:#E2764F;--flame-300:#EFA283;--flame-200:#F7CDBB;--flame-100:#FBE7DF;
--cream-500:#EDE3D2;--cream-400:#F2EADC;--cream-300:#F7F1E6;--cream-200:#FAF6EE;--cream-100:#FFFDF8;
--ink-900:#111111;--ink-700:#3A3A3A;--ink-500:#6B6B6B;--ink-300:#A5A5A5;
--white:#FFFFFF;
/* semantic */
--success-500:#4E7A38;--success-100:#E6EFDF;
--warning-500:#E0A32B;--warning-100:#FBF0D8;
--danger-500:#C22E1E;--danger-100:#FAE1DD;
--info-500:#3D6B78;--info-100:#E1EDF0;
/* surfaces */
--surface-page:var(--cream-300);--surface-card:var(--cream-100);--surface-raised:var(--white);--surface-sunken:var(--cream-400);
--surface-inverse:var(--brown-700);--surface-inverse-alt:var(--brown-600);--surface-accent:var(--flame-500);--surface-accent-soft:var(--flame-100);
/* text */
--text-body:var(--ink-900);--text-muted:var(--ink-500);--text-heading:var(--brown-700);--text-on-inverse:var(--cream-300);--text-on-inverse-muted:var(--brown-200);--text-on-accent:var(--cream-100);--text-accent:var(--flame-600);--text-link:var(--flame-600);--text-link-hover:var(--flame-700);
/* borders */
--border-hairline:rgba(43,30,23,.12);--border-strong:var(--brown-700);--border-soft:var(--brown-100);--border-accent:var(--flame-500);--border-on-inverse:rgba(247,241,230,.18);
/* interaction */
--accent-hover:var(--flame-600);--accent-press:var(--flame-700);--inverse-hover:var(--brown-600);--focus-ring:var(--flame-500)
}

/* ---- typography ---- */
:root{
--fs-display-xl:clamp(3rem,6vw,5rem); /* @kind font */
--fs-display-lg:clamp(2.5rem,4.5vw,3.75rem); /* @kind font */
--fs-display-md:2.5rem; /* @kind font */
--fs-h1:2rem; /* @kind font */
--fs-h2:1.5rem; /* @kind font */
--fs-h3:1.25rem; /* @kind font */
--fs-body-lg:1.125rem; /* @kind font */
--fs-body:1rem; /* @kind font */
--fs-body-sm:.875rem; /* @kind font */
--fs-caption:.75rem; /* @kind font */
--fs-micro:.6875rem; /* @kind font */
--lh-tight:1; /* @kind font */
--lh-display:1.06; /* @kind font */
--lh-heading:1.2; /* @kind font */
--lh-body:1.6; /* @kind font */
--lh-relaxed:1.75; /* @kind font */
--fw-regular:400; /* @kind font */
--fw-medium:500; /* @kind font */
--fw-semibold:600; /* @kind font */
--fw-bold:700; /* @kind font */
--fw-black:900; /* @kind font */
--ls-display:-.01em; /* @kind font */
--ls-heading:0; /* @kind font */
--ls-body:0; /* @kind font */
--ls-eyebrow:.18em; /* @kind font */
--ls-button:.06em; /* @kind font */
--type-display:var(--fw-bold) var(--fs-display-lg)/var(--lh-display) var(--font-display); /* @kind font */
--type-h1:var(--fw-bold) var(--fs-h1)/var(--lh-heading) var(--font-display); /* @kind font */
--type-h2:var(--fw-bold) var(--fs-h2)/var(--lh-heading) var(--font-display); /* @kind font */
--type-h3:var(--fw-semibold) var(--fs-h3)/var(--lh-heading) var(--font-body); /* @kind font */
--type-body:var(--fw-regular) var(--fs-body)/var(--lh-body) var(--font-body); /* @kind font */
--type-body-strong:var(--fw-semibold) var(--fs-body)/var(--lh-body) var(--font-body); /* @kind font */
--type-eyebrow:var(--fw-bold) var(--fs-caption)/1.2 var(--font-body); /* @kind font */
--type-button:var(--fw-bold) var(--fs-body-sm)/1 var(--font-body) /* @kind font */
}

/* ---- spacing ---- */
:root{
--space-0:0;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;--space-32:128px;
--gutter-mobile:20px;--gutter-desktop:40px;--container-max:1200px;--container-narrow:720px;
--section-y-compact:48px;--section-y:80px;--section-y-loose:120px;
--control-h-sm:36px;--control-h-md:44px;--control-h-lg:56px;
--tap-min:44px
}

/* ---- effects ---- */
:root{
--radius-xs:4px;--radius-sm:8px;--radius-md:12px;--radius-lg:20px;--radius-xl:28px;--radius-pill:999px;--radius-circle:50%;
--border-w-hair:1px;--border-w-1:1.5px;--border-w-2:2px;--border-w-heavy:3px; /* @kind other */
--shadow-xs:0 1px 2px rgba(43,30,23,.08);
--shadow-sm:0 2px 6px rgba(43,30,23,.10);
--shadow-md:0 6px 18px rgba(43,30,23,.12);
--shadow-lg:0 16px 40px rgba(43,30,23,.16);
--shadow-accent:0 8px 20px rgba(211,84,44,.28);
--shadow-inset-top:inset 0 1px 0 rgba(255,253,248,.35);
--ring-focus:0 0 0 3px rgba(211,84,44,.35);
--overlay-scrim:rgba(23,15,11,.62); /* @kind color */
--protection-bottom:linear-gradient(to top,rgba(23,15,11,.85) 0%,rgba(23,15,11,.55) 45%,rgba(23,15,11,0) 100%); /* @kind color */
--ember-wash:linear-gradient(135deg,#2B1E17 0%,#543D2F 55%,#8E2F14 100%); /* @kind color */
--blur-glass:saturate(140%) blur(12px); /* @kind other */
--ease-standard:cubic-bezier(.2,.8,.2,1); /* @kind other */
--ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */
--ease-in-out:cubic-bezier(.4,0,.2,1); /* @kind other */
--dur-fast:120ms; /* @kind other */
--dur-base:200ms; /* @kind other */
--dur-slow:320ms; /* @kind other */
--pattern-tile:url("../img/pattern-tile-cream.png") /* @kind other */
}