/* ═══════════════════════════════════════════════════════════════
   Jade Bistro & Patisserie — Design A (Albers Counsel)
   All selectors scoped under [data-design="a"]
   Keyframes prefixed ac-
   --design-a-primary exposed at :root level as required
   ═══════════════════════════════════════════════════════════════ */

/* ── Exposed primary token ───────────────────────────────────── */
:root {
  --design-a-primary: #B23A2A;
}

/* ── Design tokens (scoped) ──────────────────────────────────── */
[data-design="a"] {
  --ac-paper:           #F4EFE6;
  --ac-paper-2:         #EBE4D6;
  --ac-ink:             #1B1A17;
  --ac-ink-2:           #4A463E;
  --ac-rule:            #C8C0AE;
  --ac-plate-a:         #5E7F76;
  --ac-plate-b:         #C28A4B;
  --ac-plate-c:         #3A5670;
  --ac-plate-d:         #A14B3F;
  --ac-vermilion:       #B23A2A;
  --ac-vermilion-on:    #F4EFE6;
  --ac-success:         #5C7A4A;
  --ac-critical:        #8E2A1F;
  --ac-focus-ring:      0 0 0 2px var(--ac-paper), 0 0 0 4px var(--ac-vermilion);
  --font-display:       'Sectra', 'GT Sectra', 'Tiempos Headline', 'Georgia Pro', Georgia, serif;
  --font-body:          'Sectra', 'Tiempos Text', 'Charter', Georgia, serif;
  --font-caption:       'Söhne Breit', 'Inter', -apple-system, system-ui, sans-serif;
  --ac-tick:            4px;
  --ac-margin:          8px;
  --ac-bind:            12px;
  --ac-leaf:            20px;
  --ac-plate-gap:       32px;
  --ac-folio:           56px;
  --ac-gutter:          88px;
  --ac-spread:          144px;
  --ac-dur-touch:       120ms;
  --ac-dur-press:       180ms;
  --ac-dur-settle:      420ms;
  --ac-dur-study:       1200ms;
  --ac-cycle-breath:    4200ms;
  --ac-cycle-hue-a:     23s;
  --ac-cycle-hue-b:     31s;
  --ac-cycle-loom:      16s;
  --ac-cycle-plate:     20s;
  --ac-ease-study:      cubic-bezier(0.22, 0.61, 0.36, 1);
  --ac-ease-stamp:      cubic-bezier(0.83, 0, 0.17, 1);
  --ac-r-0:             0;
  --ac-r-1:             2px;
  --ac-r-2:             4px;
}

/* ── Base reset (scoped) ─────────────────────────────────────── */
[data-design="a"] *,
[data-design="a"] *::before,
[data-design="a"] *::after { box-sizing: border-box; }

[data-design="a"] {
  background: var(--ac-paper);
  color: var(--ac-ink);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.55;
}

/* ── Typography helpers ──────────────────────────────────────── */
[data-design="a"] .rf-rail {
  font-family: var(--font-caption);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--ac-ink-2);
  margin: 0 0 10px;
}
[data-design="a"] .rf-rail--micro { font-size: 11px; opacity: 0.85; }
[data-design="a"] .rf-rail--accent { color: var(--ac-vermilion); }

[data-design="a"] .rf-display {
  font-family: var(--font-display);
  font-size: clamp(32px, 5vw, 56px);
  line-height: 1.05;
  letter-spacing: -0.012em;
  margin: 0 0 16px;
  color: var(--ac-ink);
}
[data-design="a"] .rf-display--md { font-size: clamp(24px, 3.5vw, 38px); }

[data-design="a"] .rf-lead {
  font-family: var(--font-body);
  font-size: 19px;
  line-height: 1.55;
  color: var(--ac-ink-2);
  margin: 0;
}

/* ══════════════════════════════════════════════════════════════
   ELEMENT 1 — Animated minimalist header
   ══════════════════════════════════════════════════════════════ */
[data-design="a"] .rf-header {
  position: sticky; top: 0; z-index: 50;
  background: var(--ac-paper);
  border-bottom: 1px solid var(--ac-rule);
  isolation: isolate;
}
[data-design="a"] .rf-header__bar {
  position: relative;
  display: flex; align-items: center; justify-content: space-between;
  height: 76px;
  padding-inline: clamp(20px, 4vw, 56px);
}
[data-design="a"] .rf-logo { text-decoration: none; color: var(--ac-ink); }
[data-design="a"] .rf-logo__mark {
  font-family: var(--font-display);
  font-style: italic; font-weight: 500;
  font-size: clamp(16px, 1.8vw, 21px);
  letter-spacing: -0.01em;
}
[data-design="a"] .rf-header__swatches {
  position: absolute; inset: 0; pointer-events: none;
  overflow: hidden; opacity: 0.18;
}
[data-design="a"] .rf-header__swatch {
  position: absolute; top: 0; bottom: 0; width: 50%;
  filter: saturate(0.7);
}
[data-design="a"] .rf-header__swatch--a {
  left: 0; background: var(--ac-plate-a);
  animation: ac-hue-a var(--ac-cycle-hue-a) linear infinite;
}
[data-design="a"] .rf-header__swatch--b {
  right: 0; background: var(--ac-plate-b);
  animation: ac-hue-b var(--ac-cycle-hue-b) linear infinite;
}
[data-design="a"] .rf-header__seam {
  position: absolute; top: 0; bottom: 0; left: 50%;
  width: 1px; background: var(--ac-rule);
  transform: translateX(-50%);
}
@keyframes ac-hue-a {
  0%, 100% { background: var(--ac-plate-a); }
  50%      { background: var(--ac-plate-c); }
}
@keyframes ac-hue-b {
  0%, 100% { background: var(--ac-plate-b); }
  50%      { background: var(--ac-plate-d); }
}
[data-design="a"] .rf-burger {
  width: 44px; height: 44px;
  display: inline-flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px;
  background: transparent; border: 1px solid var(--ac-rule);
  border-radius: var(--ac-r-1);
  cursor: pointer;
}
[data-design="a"] .rf-burger__line {
  display: block; width: 18px; height: 1px; background: var(--ac-ink);
  transition: transform 220ms var(--ac-ease-study), opacity 220ms;
}
[data-design="a"] .rf-burger[aria-expanded="true"] .rf-burger__line:nth-child(1) {
  transform: translateY(3.5px) rotate(45deg);
}
[data-design="a"] .rf-burger[aria-expanded="true"] .rf-burger__line:nth-child(2) {
  transform: translateY(-3.5px) rotate(-45deg);
}
[data-design="a"] .rf-burger:focus-visible { outline: none; box-shadow: var(--ac-focus-ring); }
[data-design="a"] .rf-drawer {
  position: fixed; inset: 76px 0 0 0;
  background: var(--ac-paper);
  border-top: 1px solid var(--ac-rule);
  transform: translateY(-12px); opacity: 0;
  transition: transform 280ms var(--ac-ease-study), opacity 220ms;
  overflow-y: auto;
}
[data-design="a"] .rf-drawer:not([hidden]) {
  transform: translateY(0); opacity: 1;
}
[data-design="a"] .rf-drawer__inner {
  display: flex; flex-direction: column; gap: 24px;
  padding: 56px clamp(20px, 4vw, 56px);
  max-width: 720px;
}
[data-design="a"] .rf-drawer__link {
  font-family: var(--font-display);
  font-size: clamp(28px, 5vw, 56px);
  color: var(--ac-ink); text-decoration: none;
  border-bottom: 1px solid var(--ac-rule);
  padding-block: 12px;
  transition: border-bottom-color 200ms;
}
[data-design="a"] .rf-drawer__link:hover { border-bottom-color: var(--ac-vermilion); }
@media (max-width: 560px) {
  [data-design="a"] .rf-header__bar { height: 60px; padding-inline: 16px; }
  [data-design="a"] .rf-drawer { inset-block-start: 60px; }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .rf-header__swatch--a,
  [data-design="a"] .rf-header__swatch--b { animation: none; }
  [data-design="a"] .rf-drawer { transition: none; }
}

/* ══════════════════════════════════════════════════════════════
   HERO — Animated popular-items menu (Element 3) + layout
   ══════════════════════════════════════════════════════════════ */
[data-design="a"] .rf-hero {
  background: var(--ac-paper);
  padding: var(--ac-folio) clamp(20px, 4vw, 56px) var(--ac-spread);
  min-height: 70vh;
  display: flex; align-items: flex-start;
}
[data-design="a"] .rf-hero__inner {
  max-width: 960px;
  margin: 0 auto;
  width: 100%;
  display: grid;
  gap: var(--ac-plate-gap);
}
[data-design="a"] .rf-hero__frame { max-width: 640px; }
[data-design="a"] .rf-hero__headline {
  font-family: var(--font-display);
  font-size: clamp(28px, 4.5vw, 56px);
  line-height: 1.08;
  letter-spacing: -0.012em;
  margin: 10px 0 8px;
  color: var(--ac-ink);
  opacity: 1; /* hard guarantee: visible at first paint */
}
[data-design="a"] .rf-hero__subtitle {
  font-family: var(--font-caption);
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--ac-ink-2);
  margin: 0;
}

/* ── Menu container ──────────────────────────────────────────── */
[data-design="a"] .rf-menu {
  position: relative;
  border: 1px solid var(--ac-rule);
  background: var(--ac-paper);
  padding: 0;
  list-style: none;
  margin: 0;
  overflow: hidden;
}

/* Idle ambient border — living rule: a slow warm tint breathes around the menu */
[data-design="a"] .rf-menu__idle-border {
  position: absolute; inset: 0; pointer-events: none;
  border: 2.5px solid var(--ac-plate-b);
  border-radius: var(--ac-r-0);
  animation: ac-menu-border-breath 5s ease-in-out infinite;
}
@keyframes ac-menu-border-breath {
  0%,  100% { opacity: 0.15; transform: scale(0.996); }
  50%        { opacity: 0.9;  transform: scale(1); }
}

/* ── Menu items — reveal + ongoing idle ──────────────────────── */
[data-design="a"] .rf-menu__item {
  border-bottom: 1px solid var(--ac-rule);
  opacity: 0;
  transform: translateY(10px);
  /* reveal handled by JS adding .is-in; transition deliberately not present —
     the JS sets a staggered inline transition so each row reveals sequentially */
}
[data-design="a"] .rf-menu__item:last-of-type { border-bottom: 0; }
[data-design="a"] .rf-menu__item.is-in {
  opacity: 1;
  transform: none;
}

/* Per-item idle: slow ochre accent shimmer on the rule line */
[data-design="a"] .rf-menu__item.is-in .rf-menu__rule {
  animation: ac-menu-rule-shimmer 6s ease-in-out infinite;
}

[data-design="a"] .rf-menu__item-inner {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  column-gap: var(--ac-plate-gap);
  row-gap: 4px;
  align-items: baseline;
  padding: 20px 24px;
}
[data-design="a"] .rf-menu__name {
  font-family: var(--font-display);
  font-size: clamp(18px, 2.2vw, 22px);
  font-style: italic;
  color: var(--ac-ink);
  grid-column: 1; grid-row: 1;
}
[data-design="a"] .rf-menu__desc {
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--ac-ink-2);
  line-height: 1.5;
  grid-column: 1; grid-row: 2;
}
[data-design="a"] .rf-menu__rule {
  display: block;
  grid-column: 1; grid-row: 3;
  height: 1px;
  width: 100%;
  background: linear-gradient(to right, var(--ac-plate-b) 0%, transparent 80%);
  opacity: 0.35;
  transform: scaleX(1);
  transform-origin: left;
  margin-top: 8px;
}
[data-design="a"] .rf-menu__price {
  font-family: var(--font-caption);
  font-size: 13px;
  letter-spacing: 0.08em;
  color: var(--ac-plate-a);
  grid-column: 2; grid-row: 1;
  align-self: start;
}

@keyframes ac-menu-rule-shimmer {
  0%,  100% { opacity: 0.3; transform: scaleX(0.5); }
  50%        { opacity: 0.95; transform: scaleX(1.0); }
}

/* ── stagger: items not yet revealed are invisible but hold layout space */
[data-design="a"] .rf-menu__item[data-idx="0"] { transition: opacity 500ms var(--ac-ease-study) 200ms, transform 500ms var(--ac-ease-study) 200ms; }
[data-design="a"] .rf-menu__item[data-idx="1"] { transition: opacity 500ms var(--ac-ease-study) 500ms, transform 500ms var(--ac-ease-study) 500ms; }
[data-design="a"] .rf-menu__item[data-idx="2"] { transition: opacity 500ms var(--ac-ease-study) 800ms, transform 500ms var(--ac-ease-study) 800ms; }
[data-design="a"] .rf-menu__item[data-idx="3"] { transition: opacity 500ms var(--ac-ease-study) 1100ms, transform 500ms var(--ac-ease-study) 1100ms; }
[data-design="a"] .rf-menu__item[data-idx="4"] { transition: opacity 500ms var(--ac-ease-study) 1400ms, transform 500ms var(--ac-ease-study) 1400ms; }
[data-design="a"] .rf-menu__item[data-idx="5"] { transition: opacity 500ms var(--ac-ease-study) 1700ms, transform 500ms var(--ac-ease-study) 1700ms; }

@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .rf-menu__item { opacity: 1; transform: none; transition: none; }
  [data-design="a"] .rf-menu__item.is-in .rf-menu__rule { animation: none; }
  [data-design="a"] .rf-menu__idle-border { animation: none; }
}

@media (max-width: 560px) {
  [data-design="a"] .rf-menu__item-inner {
    grid-template-columns: 1fr;
    padding: 16px 16px;
  }
  [data-design="a"] .rf-menu__price {
    grid-column: 1; grid-row: 2;
    margin-top: 4px;
  }
  [data-design="a"] .rf-menu__rule { grid-row: 4; }
}

/* ══════════════════════════════════════════════════════════════
   ELEMENT 2 — Action cluster (low-weight, beneath menu)
   ══════════════════════════════════════════════════════════════ */
[data-design="a"] .rf-action-cluster {
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
  padding-top: var(--ac-bind);
}

/* ── Seal CTA (vermilion — appears max twice: hero + order section) ── */
[data-design="a"] .rf-cta {
  --m-x: 0px; --m-y: 0px;
  position: relative;
  display: inline-flex; align-items: baseline; gap: 14px;
  padding: 14px 22px;
  background: var(--ac-vermilion); color: var(--ac-vermilion-on);
  text-decoration: none;
  border: 1px solid var(--ac-vermilion);
  border-radius: var(--ac-r-1);
  transform: translate(var(--m-x), var(--m-y));
  transition: transform 320ms var(--ac-ease-study), background-color var(--ac-dur-press);
  animation: ac-cta-breath var(--ac-cycle-breath) ease-in-out infinite;
  will-change: transform;
}
[data-design="a"] .rf-cta__caption {
  font-family: var(--font-caption);
  font-size: 12px; text-transform: uppercase; letter-spacing: 0.18em;
  opacity: 0.78;
}
[data-design="a"] .rf-cta__label {
  font-family: var(--font-display);
  font-style: italic; font-size: 17px; letter-spacing: -0.005em;
}
[data-design="a"] .rf-cta__arrow {
  font-family: var(--font-display);
  font-size: 20px;
  transition: transform 240ms var(--ac-ease-study);
}
[data-design="a"] .rf-cta:hover { background: color-mix(in oklab, var(--ac-vermilion), black 6%); }
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .rf-cta:hover .rf-cta__arrow { transform: translateX(4px); }
}
[data-design="a"] .rf-cta:focus-visible { outline: none; box-shadow: var(--ac-focus-ring); }
[data-design="a"] .rf-cta:active {
  transform: translate(var(--m-x), calc(var(--m-y) + 1px));
  background: color-mix(in oklab, var(--ac-vermilion), black 12%);
}
[data-design="a"] .rf-cta.is-stamped::after {
  content: ""; position: absolute; inset: -1px;
  border: 1px solid var(--ac-vermilion); border-radius: inherit;
  pointer-events: none; opacity: 0.5;
  animation: ac-stamp-dry 600ms ease-out forwards;
}
@keyframes ac-cta-breath {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in oklab, var(--ac-vermilion), transparent 70%); }
  50%      { box-shadow: 0 0 0 6px color-mix(in oklab, var(--ac-vermilion), transparent 92%); }
}
@keyframes ac-stamp-dry {
  0%   { opacity: 0.55; transform: scale(1); }
  100% { opacity: 0;    transform: scale(1.04); }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .rf-cta { animation: none; transition: background-color 120ms; }
  [data-design="a"] .rf-cta.is-stamped::after { animation: none; }
}
@media (max-width: 560px) {
  [data-design="a"] .rf-cta { padding: 12px 18px; }
  [data-design="a"] .rf-cta__label { font-size: 15px; }
}

[data-design="a"] .rf-action-chip {
  display: inline-flex; flex-direction: column; gap: 2px;
  padding: 10px 16px;
  border: 1px solid var(--ac-rule);
  border-radius: var(--ac-r-1);
  text-decoration: none;
  color: var(--ac-ink);
  font-family: var(--font-body);
  font-size: 14px;
  transition: border-color 160ms;
  min-height: 44px; min-width: 44px;
  justify-content: center;
}
[data-design="a"] .rf-action-chip .rf-rail { margin: 0; font-size: 10px; }
[data-design="a"] .rf-action-chip:hover { border-color: var(--ac-ink-2); }
[data-design="a"] .rf-action-chip:focus-visible { outline: none; box-shadow: var(--ac-focus-ring); }

/* ══════════════════════════════════════════════════════════════
   ELEMENT 6 — Appetite-warm wayfinding pointer (steam wisps)
   Sits between hero and #daily-special
   ══════════════════════════════════════════════════════════════ */
[data-design="a"] .rf-pointer.ac-pointer {
  display: flex; flex-direction: column; align-items: center;
  gap: 12px;
  padding: var(--ac-folio) clamp(20px, 4vw, 56px) var(--ac-bind);
  background: var(--ac-paper);
  overflow: hidden;
}
[data-design="a"] .ac-pointer__steam {
  position: relative;
  display: flex; gap: 14px; align-items: flex-end;
  height: 48px;
}
[data-design="a"] .ac-pointer__wisp {
  display: block; width: 2px;
  background: linear-gradient(to top, var(--ac-plate-b), transparent);
  border-radius: 1px;
  transform-origin: bottom center;
  opacity: 0.55;
}
[data-design="a"] .ac-pointer__wisp--1 {
  height: 28px;
  animation: ac-steam-wisp1 4.5s ease-in-out infinite;
}
[data-design="a"] .ac-pointer__wisp--2 {
  height: 40px;
  animation: ac-steam-wisp2 5.2s ease-in-out infinite;
  animation-delay: -1.8s;
}
[data-design="a"] .ac-pointer__wisp--3 {
  height: 22px;
  animation: ac-steam-wisp1 4.8s ease-in-out infinite;
  animation-delay: -3.2s;
}
@keyframes ac-steam-wisp1 {
  0%,  100% { transform: translateY(0) scaleX(1);   opacity: 0.4; }
  40%        { transform: translateY(-8px) scaleX(1.4); opacity: 0.7; }
  70%        { transform: translateY(-14px) scaleX(0.7); opacity: 0.2; }
}
@keyframes ac-steam-wisp2 {
  0%,  100% { transform: translateY(0) scaleX(1);   opacity: 0.5; }
  50%        { transform: translateY(-12px) scaleX(1.2); opacity: 0.75; }
  80%        { transform: translateY(-20px) scaleX(0.6); opacity: 0.15; }
}
[data-design="a"] .ac-pointer__rule {
  width: 80px; height: 1px;
  background: linear-gradient(to right, transparent, var(--ac-plate-b), transparent);
  opacity: 0.6;
}
[data-design="a"] .ac-pointer__label { text-align: center; margin: 0; }
@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .ac-pointer__wisp { animation: none; }
}

/* ══════════════════════════════════════════════════════════════
   ELEMENT 5 — Animated interactive: cloche / daily-special reveal
   ══════════════════════════════════════════════════════════════ */
[data-design="a"] .rf-interactive.rf-special {
  background: var(--ac-paper-2);
  border-block: 1px solid var(--ac-rule);
  padding: var(--ac-spread) clamp(20px, 4vw, 56px);
}
[data-design="a"] .rf-special__inner {
  max-width: 720px; margin: 0 auto;
  display: grid; gap: var(--ac-folio);
}
[data-design="a"] .rf-special__head { max-width: 560px; }
[data-design="a"] .rf-cloche-wrap {
  display: grid; gap: var(--ac-plate-gap);
  align-items: start;
}

/* The cloche button */
[data-design="a"] .rf-cloche {
  position: relative;
  background: transparent; border: 0;
  cursor: pointer;
  display: flex; flex-direction: column; align-items: center;
  gap: 0;
  padding: 0;
  width: min(240px, 80vw);
}
[data-design="a"] .rf-cloche:focus-visible { outline: none; }
[data-design="a"] .rf-cloche:focus-visible .rf-cloche__dome {
  box-shadow: var(--ac-focus-ring);
}

[data-design="a"] .rf-cloche__dome {
  position: relative;
  width: 100%;
  height: 100px;
  background: var(--ac-paper);
  border: 1px solid var(--ac-rule);
  border-bottom: 0;
  border-radius: 50% 50% 0 0 / 60% 60% 0 0;
  display: flex; align-items: flex-start; justify-content: center;
  padding-top: 12px;
  transform-origin: bottom center;
  transition: transform 600ms var(--ac-ease-study);
  overflow: hidden;
}
[data-design="a"] .rf-cloche[aria-expanded="true"] .rf-cloche__dome {
  transform: translateY(-80px) rotateX(-40deg) scale(0.9);
  opacity: 0.4;
}
[data-design="a"] .rf-cloche__knob {
  width: 12px; height: 12px;
  border-radius: 50%;
  background: var(--ac-plate-b);
  border: 1px solid var(--ac-rule);
  flex-shrink: 0;
  animation: ac-knob-glow 4s ease-in-out infinite;
}
@keyframes ac-knob-glow {
  0%, 100% { opacity: 0.7; }
  50%       { opacity: 1; transform: scale(1.12); }
}
[data-design="a"] .rf-cloche__plate {
  width: 100%;
  height: 8px;
  background: var(--ac-paper);
  border: 1px solid var(--ac-rule);
  border-radius: 2px 2px 0 0;
}
[data-design="a"] .rf-cloche__hint {
  margin-top: 12px;
  font-size: 11px;
  opacity: 0.7;
}
[data-design="a"] .rf-cloche[aria-expanded="true"] .rf-cloche__hint { opacity: 0; }

/* Steam wisps on the cloche */
[data-design="a"] .rf-cloche__steam.ac-cloche-steam {
  position: absolute; bottom: 8px; left: 50%;
  display: flex; gap: 6px;
  transform: translateX(-50%);
}
[data-design="a"] .rf-cloche__steam.ac-cloche-steam span {
  display: block; width: 1.5px; background: var(--ac-plate-b);
  border-radius: 1px; opacity: 0.4;
  transform-origin: bottom;
}
[data-design="a"] .rf-cloche__steam.ac-cloche-steam span:nth-child(1) {
  height: 16px; animation: ac-steam-wisp1 3.6s ease-in-out infinite;
}
[data-design="a"] .rf-cloche__steam.ac-cloche-steam span:nth-child(2) {
  height: 22px; animation: ac-steam-wisp2 4.4s ease-in-out infinite; animation-delay: -1.2s;
}
[data-design="a"] .rf-cloche__steam.ac-cloche-steam span:nth-child(3) {
  height: 14px; animation: ac-steam-wisp1 3.8s ease-in-out infinite; animation-delay: -2.6s;
}

/* Reveal panel */
[data-design="a"] .rf-cloche__reveal {
  border: 1px solid var(--ac-rule);
  background: var(--ac-paper);
  padding: clamp(24px, 4vw, 40px);
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity var(--ac-dur-settle) var(--ac-ease-study),
              transform var(--ac-dur-settle) var(--ac-ease-study);
}
[data-design="a"] .rf-cloche__reveal:not([hidden]) {
  opacity: 1; transform: none;
}
[data-design="a"] .rf-special__note {
  margin-top: 20px;
  font-size: 11px; opacity: 0.65;
}

@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .rf-cloche__dome { transition: none; }
  [data-design="a"] .rf-cloche__steam.ac-cloche-steam span { animation: none; }
  [data-design="a"] .rf-cloche__knob { animation: none; }
  [data-design="a"] .rf-cloche__reveal { transition: none; }
}
@media (max-width: 560px) {
  [data-design="a"] .rf-cloche { width: 100%; max-width: 200px; }
}

/* ══════════════════════════════════════════════════════════════
   ELEMENT 3 (Ambient A) — Full menu plates
   ══════════════════════════════════════════════════════════════ */
[data-design="a"] .rf-ambient-a {
  padding: var(--ac-spread) clamp(20px, 4vw, 56px);
  background: var(--ac-paper);
}
[data-design="a"] .rf-ambient-a__head {
  max-width: 720px; margin: 0 auto var(--ac-folio);
}
[data-design="a"] .rf-plates {
  list-style: none; padding: 0; margin: 0;
  display: grid; gap: var(--ac-folio);
  max-width: 1200px; margin-inline: auto;
}
[data-design="a"] .rf-plate {
  --sq-l: var(--ac-plate-a); --sq-r: var(--ac-plate-b);
  border: 1px solid var(--ac-rule);
  background: var(--ac-paper);
  padding: 28px 28px 0;
  opacity: 0; transform: translateY(12px);
  transition: opacity 600ms var(--ac-ease-study), transform 600ms var(--ac-ease-study);
}
[data-design="a"] .rf-plate[data-pair="cd"] { --sq-l: var(--ac-plate-c); --sq-r: var(--ac-plate-d); }
[data-design="a"] .rf-plate.is-in { opacity: 1; transform: none; }
[data-design="a"] .rf-plate__pair {
  position: relative; display: grid; grid-template-columns: 1fr 1fr;
  min-height: 180px; margin-top: 24px;
}
[data-design="a"] .rf-plate__pair::after {
  content: ""; position: absolute; inset-block: 0; left: 50%;
  width: 1px; background: var(--ac-rule);
  transform: translateX(-50%) scaleY(0); transform-origin: center;
  transition: transform 1200ms var(--ac-ease-study) 200ms;
}
[data-design="a"] .rf-plate.is-in .rf-plate__pair::after { transform: translateX(-50%) scaleY(1); }
[data-design="a"] .rf-plate__square {
  padding: 20px 20px 28px;
  color: var(--ac-paper);
}
[data-design="a"] .rf-plate__square--l {
  background: var(--sq-l);
  animation: ac-plate-drift-l var(--ac-cycle-plate) ease-in-out infinite;
}
[data-design="a"] .rf-plate__square--r {
  background: var(--sq-r);
  animation: ac-plate-drift-r var(--ac-cycle-plate) ease-in-out infinite;
  animation-delay: -10s;
}
[data-design="a"] .rf-plate__square p { margin: 0; }
[data-design="a"] .rf-plate__square p:last-child {
  font-family: var(--font-body);
  font-size: 15px; line-height: 1.55; margin-top: 10px;
}
[data-design="a"] .rf-plate.is-paused .rf-plate__square--l,
[data-design="a"] .rf-plate.is-paused .rf-plate__square--r { animation-play-state: paused; }
@keyframes ac-plate-drift-l {
  0%, 100% { background: var(--sq-l); }
  50%      { background: color-mix(in oklab, var(--sq-l), var(--sq-r) 14%); }
}
@keyframes ac-plate-drift-r {
  0%, 100% { background: var(--sq-r); }
  50%      { background: color-mix(in oklab, var(--sq-r), var(--sq-l) 14%); }
}
@media (max-width: 560px) {
  [data-design="a"] .rf-plate__pair { grid-template-columns: 1fr; min-height: 0; }
  [data-design="a"] .rf-plate__pair::after {
    inset: auto 0; left: 0; top: 50%; width: auto; height: 1px;
    transform: translateY(-50%) scaleX(0);
  }
  [data-design="a"] .rf-plate.is-in .rf-plate__pair::after { transform: translateY(-50%) scaleX(1); }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .rf-plate__square--l,
  [data-design="a"] .rf-plate__square--r { animation: none; }
  [data-design="a"] .rf-plate { opacity: 1; transform: none; transition: none; }
  [data-design="a"] .rf-plate__pair::after {
    transform: translateX(-50%) scaleY(1); transition: none;
  }
}
[data-design="a"] .rf-menu-footer {
  text-align: center;
  margin-top: var(--ac-folio);
}

/* ══════════════════════════════════════════════════════════════
   ELEMENT 4 — Ambient B (loom) — Hours & Location
   ══════════════════════════════════════════════════════════════ */
[data-design="a"] .rf-ambient-b {
  background: var(--ac-paper-2);
  border-block: 1px solid var(--ac-rule);
  padding: var(--ac-spread) clamp(20px, 4vw, 56px);
}
[data-design="a"] .rf-ambient-b__inner {
  display: grid; grid-template-columns: 1fr 1.4fr; gap: var(--ac-folio);
  max-width: 1200px; margin: 0 auto; align-items: start;
}
[data-design="a"] .rf-ambient-b__head { grid-column: 1; }
[data-design="a"] .rf-loom {
  position: relative; grid-column: 1; grid-row: 2;
  height: 180px; margin-top: var(--ac-leaf);
  border: 1px solid var(--ac-rule); background: var(--ac-paper);
  overflow: hidden;
}
[data-design="a"] .rf-loom__warp {
  position: absolute; inset: 0;
  background-image: repeating-linear-gradient(
    to right, transparent 0, transparent 11px,
    var(--ac-rule) 11px, var(--ac-rule) 11.5px
  );
}
[data-design="a"] .rf-loom__weft {
  position: absolute; top: 50%; left: -8%;
  width: 116%; height: 1px;
  background: linear-gradient(
    to right, transparent 0%, var(--ac-ink-2) 8%, var(--ac-ink-2) 92%, transparent 100%
  );
  transform-origin: left center;
  animation: ac-loom-weave var(--ac-cycle-loom) linear infinite;
}
[data-design="a"] .rf-loom.is-paused .rf-loom__weft { animation-play-state: paused; }
[data-design="a"] .rf-ambient-b__body {
  grid-column: 2; grid-row: 1 / span 2;
  font-family: var(--font-body);
  font-size: 17px; line-height: 1.6; color: var(--ac-ink);
  display: grid; gap: 24px;
}
/* motion-exception: top% travel replaces translateY for the weft sweep (container-relative) */
@keyframes ac-loom-weave {
  0%   { top: 22%; transform: rotate(0deg); }
  25%  { top: 50%; transform: rotate(0.6deg); }
  50%  { top: 78%; transform: rotate(0deg); }
  75%  { top: 50%; transform: rotate(-0.6deg); }
  100% { top: 22%; transform: rotate(0deg); }
}
@media (max-width: 768px) {
  [data-design="a"] .rf-ambient-b__inner { grid-template-columns: 1fr; gap: 32px; }
  [data-design="a"] .rf-loom { grid-column: 1; grid-row: auto; height: 140px; }
  [data-design="a"] .rf-ambient-b__body { grid-column: 1; grid-row: auto; font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .rf-loom__weft { animation: none; top: 50%; transform: rotate(0deg); }
}

[data-design="a"] .rf-hours-grid {
  display: grid; gap: 14px;
}
[data-design="a"] .rf-hours-row {
  display: flex; gap: 20px; align-items: baseline;
  border-bottom: 1px solid var(--ac-rule); padding-bottom: 10px;
}
[data-design="a"] .rf-hours-row .rf-rail { flex-shrink: 0; min-width: 100px; margin: 0; }
[data-design="a"] .rf-hours-row--note { opacity: 0.75; }
[data-design="a"] .rf-location-block { display: grid; gap: 12px; }
[data-design="a"] .rf-location-link { margin-top: 8px; }

/* ── Shared buttons ───────────────────────────────────────────── */
[data-design="a"] .rf-btn {
  font-family: var(--font-display);
  font-size: 16px; font-style: italic;
  padding: 12px 18px;
  background: transparent; color: var(--ac-ink);
  border: 1px solid var(--ac-rule); border-radius: var(--ac-r-1);
  cursor: pointer; text-decoration: none; display: inline-block;
  transition: border-color 160ms, background-color 160ms;
  min-height: 44px;
}
[data-design="a"] .rf-btn--secondary { }
[data-design="a"] .rf-btn:hover,
[data-design="a"] .rf-btn--secondary:hover {
  border-color: var(--ac-ink-2); background: var(--ac-paper-2);
}
[data-design="a"] .rf-btn:focus-visible { outline: none; box-shadow: var(--ac-focus-ring); }

/* ══════════════════════════════════════════════════════════════
   Gallery
   ══════════════════════════════════════════════════════════════ */
[data-design="a"] .rf-gallery {
  padding: var(--ac-spread) clamp(20px, 4vw, 56px);
  background: var(--ac-paper);
}
[data-design="a"] .rf-gallery__head {
  max-width: 720px; margin: 0 auto var(--ac-folio);
}
[data-design="a"] .rf-gallery__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
  gap: 24px;
  max-width: 1200px; margin: 0 auto;
}
[data-design="a"] .rf-gallery__item {
  border: 1px solid var(--ac-rule);
  overflow: hidden;
  aspect-ratio: 3 / 2;
}
[data-design="a"] .rf-gallery__item img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}

/* ══════════════════════════════════════════════════════════════
   About
   ══════════════════════════════════════════════════════════════ */
[data-design="a"] .rf-about {
  background: var(--ac-paper-2);
  border-block: 1px solid var(--ac-rule);
  padding: var(--ac-spread) clamp(20px, 4vw, 56px);
}
[data-design="a"] .rf-about__inner {
  max-width: 840px; margin: 0 auto;
  display: grid; gap: var(--ac-folio);
}
[data-design="a"] .rf-about__body {
  font-family: var(--font-body);
  font-size: 19px; line-height: 1.65;
  display: grid; gap: 20px;
}
[data-design="a"] .rf-about__body p { margin: 0; }

/* ══════════════════════════════════════════════════════════════
   Order + Social
   ══════════════════════════════════════════════════════════════ */
[data-design="a"] .rf-order-social {
  padding: var(--ac-spread) clamp(20px, 4vw, 56px);
  background: var(--ac-paper);
  border-top: 1px solid var(--ac-rule);
}
[data-design="a"] .rf-order-social__inner {
  max-width: 1200px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--ac-gutter);
  align-items: start;
}
[data-design="a"] .rf-order-block { display: grid; gap: var(--ac-bind); }
[data-design="a"] .rf-order-block .rf-display { margin-bottom: 8px; }
[data-design="a"] .rf-social-block { display: grid; gap: 16px; }
[data-design="a"] .rf-social-link {
  font-family: var(--font-body);
  font-size: 17px;
  color: var(--ac-ink);
  text-decoration: none;
  border-bottom: 1px solid var(--ac-rule);
  padding-block: 8px;
  transition: border-bottom-color 200ms;
}
[data-design="a"] .rf-social-link:hover { border-bottom-color: var(--ac-vermilion); }
@media (max-width: 768px) {
  [data-design="a"] .rf-order-social__inner { grid-template-columns: 1fr; gap: var(--ac-folio); }
}

/* ══════════════════════════════════════════════════════════════
   Footer
   ══════════════════════════════════════════════════════════════ */
[data-design="a"] .rf-footer {
  background: var(--ac-paper-2);
  border-top: 1px solid var(--ac-rule);
  padding: var(--ac-gutter) clamp(20px, 4vw, 56px) var(--ac-folio);
}
[data-design="a"] .rf-footer__inner {
  max-width: 1200px; margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(200px, 100%), 1fr));
  gap: var(--ac-folio);
  padding-bottom: var(--ac-folio);
  border-bottom: 1px solid var(--ac-rule);
}
[data-design="a"] .rf-footer__col { display: grid; gap: 10px; align-content: start; }
[data-design="a"] .rf-footer__col .rf-rail { margin: 0; }
[data-design="a"] .rf-footer__col .rf-logo__mark { font-size: 18px; }
[data-design="a"] .rf-footer__link {
  font-family: var(--font-body);
  font-size: 15px; color: var(--ac-ink-2);
  text-decoration: none;
  display: block;
  transition: color 160ms;
}
[data-design="a"] .rf-footer__link:hover { color: var(--ac-ink); }
[data-design="a"] .rf-footer__bottom {
  max-width: 1200px; margin: var(--ac-bind) auto 0;
}
[data-design="a"] .rf-footer__bottom .rf-rail { font-size: 11px; opacity: 0.6; margin: 0; }

/* ══════════════════════════════════════════════════════════════
   DEFENSIVE OVERFLOW — no horizontal scroll at any width
   ══════════════════════════════════════════════════════════════ */
[data-design="a"],
[data-design="a"] .rf-hero,
[data-design="a"] .rf-menu,
[data-design="a"] .rf-ambient-a,
[data-design="a"] .rf-ambient-b,
[data-design="a"] .rf-interactive,
[data-design="a"] .rf-gallery,
[data-design="a"] .rf-about,
[data-design="a"] .rf-order-social,
[data-design="a"] .rf-footer {
  max-width: 100%;
  overflow-x: hidden;
}
[data-design="a"] .rf-drawer {
  max-width: 100vw;
}
[data-design="a"] img {
  max-width: 100%;
  height: auto;
}
@media (max-width: 390px) {
  [data-design="a"] .rf-menu__item-inner {
    grid-template-columns: 1fr;
  }
  [data-design="a"] .rf-action-cluster {
    flex-direction: column; align-items: flex-start;
  }
  [data-design="a"] .rf-plate__pair { grid-template-columns: 1fr; }
}

/* Phase-3.4 hero visibility floor (forge_assemble) */
[data-design="a"] [data-mf-role="hero"] :is(h1,h2,p,.headline,.subtitle,.proof,[class*="headline"],[class*="subtitle"],[class*="proof"]),
[data-design="a"] [data-mf-role="cta"] { opacity: 1 !important; }
