/* =====================================================
   HELIOTROPE × RESTAURANT — Design A
   All selectors scoped [data-design="a"].dq-design
   Heliotrope tokens remapped to --design-a-*
   ===================================================== */

/* ── Google Fonts ──────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&family=Lora:ital,wght@0,400;0,500;1,400&family=Manrope:wght@500;600&family=JetBrains+Mono:wght@400&display=swap');

/* ── Token system (heliotrope remapped to design-a) ── */
[data-design="a"] {
  --design-a-primary:       #8A6E94;   /* = --ht-mauve */
  --design-a-ivory:         #F5EDE0;
  --design-a-ivory-deep:    #EBE0CD;
  --design-a-ivory-edge:    #DDCFB6;
  --design-a-ink:           #2A2025;
  --design-a-ink-soft:      #4A3D44;
  --design-a-mute:          #7B6E6F;
  --design-a-mauve:         #8A6E94;
  --design-a-mauve-deep:    #634D6E;
  --design-a-sage:          #8FA083;
  --design-a-sage-deep:     #5D7152;
  --design-a-gilt:          #B89A4E;
  --design-a-dust:          #C4B3A0;
  --design-a-rule:          rgba(42,32,37,.22);
  --design-a-rule-faint:    rgba(42,32,37,.10);

  /* Spacing scale (4px base) */
  --design-a-hair:     1px;
  --design-a-tight:    4px;
  --design-a-snug:     8px;
  --design-a-margin:   16px;
  --design-a-gutter:   24px;
  --design-a-bay:      40px;
  --design-a-stanza:   64px;
  --design-a-chapter:  96px;
  --design-a-folio:    144px;

  /* Radius */
  --design-a-r-0:      0;
  --design-a-r-card:   2px;
  --design-a-r-petal:  12px;

  /* Easing */
  --design-a-ease-hush:   cubic-bezier(.32,.72,.32,1);
  --design-a-ease-bloom:  cubic-bezier(.16,.84,.44,1);
  --design-a-ease-petal:  cubic-bezier(.4,0,.2,1);

  /* Durations */
  --design-a-d-press:    180ms;
  --design-a-d-register: 280ms;
  --design-a-d-settle:   520ms;
  --design-a-d-bloom:    780ms;
}

/* ── Reset / base ─────────────────────────────────── */
[data-design="a"].dq-design {
  background: var(--design-a-ivory);
  color: var(--design-a-ink);
  font-family: "Lora", serif;
  line-height: 1.6;
  font-size: clamp(17px, 1.4vw, 20px);
  max-width: 100%;
  overflow-x: clip;
}

[data-design="a"].dq-design *,
[data-design="a"] .dq-design * {
  min-width: 0;
  box-sizing: border-box;
}

[data-design="a"].dq-design img,
[data-design="a"].dq-design svg:not([data-keep-size]) {
  max-width: 100%;
  height: auto;
}

/* ── Eyebrow ──────────────────────────────────────── */
[data-design="a"] .ht-eyebrow {
  font-family: "Manrope", sans-serif;
  font-size: 11px; font-weight: 600; letter-spacing: .22em;
  color: var(--design-a-mute); text-transform: uppercase;
  display: inline-flex; align-items: center; gap: 12px;
  margin-bottom: var(--design-a-bay);
}
[data-design="a"] .ht-eyebrow__mark {
  width: 6px; height: 6px;
  background: var(--design-a-mauve);
  display: inline-block; border-radius: 50%;
}

/* ================================================================
   ELEMENT 1 — Animated minimalist header
   Three things: wordmark + hairline-sprig atmospheric layer + hamburger
   H-3: slow 18s sway cycle
================================================================ */
[data-design="a"] .ht-header {
  position: sticky; top: 0; z-index: 40;
  background: var(--design-a-ivory);
  isolation: isolate;
}
[data-design="a"] .ht-header__bar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px clamp(20px, 4vw, 56px);
  max-width: 1480px; margin: 0 auto;
}
[data-design="a"] .ht-logo {
  text-decoration: none; color: var(--design-a-ink);
  display: inline-flex; align-items: baseline; gap: 16px; white-space: nowrap;
}
[data-design="a"] .ht-logo__mark {
  font-family: "Cormorant Garamond", serif;
  font-weight: 400; font-style: italic;
  font-size: clamp(24px, 2.4vw, 32px); letter-spacing: -.005em;
}
[data-design="a"] .ht-logo__est {
  font-family: "Manrope", sans-serif; font-size: 11px; font-weight: 500; letter-spacing: .22em;
  color: var(--design-a-mute); text-transform: uppercase;
  padding-left: 16px; border-left: 1px solid var(--design-a-rule);
}
@media (max-width: 640px) {
  [data-design="a"] .ht-logo__est { display: none; }
}

[data-design="a"] .ht-menu-btn {
  appearance: none; background: var(--design-a-ivory-deep); color: var(--design-a-ink);
  border: 1px solid var(--design-a-mauve);
  display: inline-flex; align-items: center; gap: 10px;
  padding: 0 18px; height: 44px; cursor: pointer;
  font-family: "Cormorant Garamond", serif; font-style: italic; font-size: 17px;
  transition: background var(--design-a-d-press) var(--design-a-ease-petal),
              color var(--design-a-d-press) var(--design-a-ease-petal);
}
[data-design="a"] .ht-menu-btn:focus-visible {
  outline: 2px solid var(--design-a-gilt); outline-offset: 3px;
}
[data-design="a"] .ht-menu-btn__sprig {
  display: inline-grid; place-items: center; width: 14px; height: 14px;
  color: var(--design-a-mauve);
  transition: transform var(--design-a-d-register) var(--design-a-ease-bloom),
              color var(--design-a-d-press) var(--design-a-ease-petal);
}

@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .ht-menu-btn:hover {
    background: var(--design-a-mauve); color: var(--design-a-ivory);
  }
  [data-design="a"] .ht-menu-btn:hover .ht-menu-btn__sprig { color: var(--design-a-ivory); }
}

[data-design="a"] .ht-menu-btn[aria-expanded="true"] .ht-menu-btn__sprig { transform: rotate(90deg); }

/* Header atmospheric rule + sprig (H-3: 18s slow sway) */
[data-design="a"] .ht-header__rule {
  position: relative; padding: 0 clamp(20px, 4vw, 56px);
  max-width: 1480px; margin: 0 auto; height: 18px; pointer-events: none;
}
[data-design="a"] .ht-header__rule-line {
  position: absolute; left: 0; right: 0; top: 50%; height: 1px;
  background: var(--design-a-mauve); opacity: .7;
  transform: scaleX(0); transform-origin: left center;
  animation: a-rule-draw 1800ms 300ms var(--design-a-ease-hush) forwards;
}
[data-design="a"] .ht-header__sprig {
  position: absolute; left: 50%; top: -2px; transform: translateX(-50%);
  width: 36px; height: 18px; color: var(--design-a-sage-deep);
  background: var(--design-a-ivory); padding: 0 6px;
  opacity: 0;
  animation: a-sprig-in 600ms 1800ms var(--design-a-ease-bloom) forwards,
             a-sprig-sway 18s 2400ms var(--design-a-ease-hush) infinite;
  transform-origin: bottom center;
}
[data-design="a"] .ht-header__sprig svg { width: 100%; height: 100%; display: block; }

@keyframes a-rule-draw { to { transform: scaleX(1); } }
@keyframes a-sprig-in {
  from { opacity: 0; transform: translateX(-50%) translateY(-4px); }
  to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}
@keyframes a-sprig-sway {
  0%,100% { transform: translateX(-50%) rotate(0deg); }
  50%     { transform: translateX(-50%) rotate(2deg); }
}

/* Drawer (focus-trapped; display:none equivalent when closed) */
[data-design="a"] .ht-drawer {
  position: fixed; inset: 0; z-index: 35; background: var(--design-a-ivory-deep);
  transform: translateY(-100%);
  transition: transform var(--design-a-d-bloom) var(--design-a-ease-bloom);
  padding-top: 92px; overflow-y: auto;
  pointer-events: none;
}
[data-design="a"] .ht-drawer[data-open="true"] {
  transform: translateY(0);
  pointer-events: auto;
}
[data-design="a"] .ht-drawer__inner {
  max-width: 1080px; margin: 0 auto;
  padding: clamp(32px, 5vw, 72px) clamp(20px, 4vw, 56px);
  display: grid; gap: 4px;
  position: relative; z-index: 2;
}
[data-design="a"] .ht-drawer a {
  display: grid; grid-template-columns: 36px 1fr auto; gap: 16px; align-items: baseline;
  padding: 18px 0; color: var(--design-a-ink); text-decoration: none;
  border-bottom: 1px solid var(--design-a-rule-faint);
  font-family: "Cormorant Garamond", serif; font-weight: 300; font-style: italic;
  font-size: clamp(32px, 5vw, 64px); letter-spacing: -.005em; line-height: 1.05;
  transition: color var(--design-a-d-register) var(--design-a-ease-petal);
}
[data-design="a"] .ht-drawer a:hover { color: var(--design-a-mauve-deep); }

@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .ht-drawer a:hover { transform: translateX(24px); }
  [data-design="a"] .ht-drawer a {
    transition: transform var(--design-a-d-settle) var(--design-a-ease-hush),
                color var(--design-a-d-register) var(--design-a-ease-petal);
  }
}

[data-design="a"] .ht-drawer__sprig {
  color: var(--design-a-sage); font-size: 24px; opacity: 0;
  transition: opacity var(--design-a-d-register) var(--design-a-ease-bloom);
}
[data-design="a"] .ht-drawer a:hover .ht-drawer__sprig { opacity: 1; }
[data-design="a"] .ht-drawer a small {
  font-family: "Manrope", sans-serif; font-size: 11px; font-weight: 500; letter-spacing: .22em;
  color: var(--design-a-mute); text-transform: uppercase; font-style: normal;
}
[data-design="a"] .ht-drawer__backdrop {
  position: absolute; inset: 0; z-index: 1;
}

/* ================================================================
   ELEMENT 3 — Animated popular-items menu hero (THE hero for restaurant)
   HERO-1: one animated layer (menu reveal + ambient idle)
   HERO-2: no directional primitive
   HERO-3: visual presence floor — menu content at first paint
   Hero text opacity:1 at FIRST PAINT — never reveal-gated
================================================================ */
[data-design="a"] .ht-hero {
  position: relative; isolation: isolate; overflow: hidden;
  padding: clamp(56px, 8vw, 100px) clamp(20px, 4vw, 56px) clamp(48px, 7vw, 80px);
  background:
    radial-gradient(60% 80% at 20% 0%, rgba(138,110,148,.08), transparent 60%),
    radial-gradient(60% 80% at 100% 100%, rgba(143,160,131,.06), transparent 60%),
    var(--design-a-ivory);
  min-height: 60vh;
}
[data-design="a"] .ht-hero__inner {
  position: relative; z-index: 1; max-width: 1280px; margin: 0 auto;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 460px);
  gap: clamp(40px, 6vw, 96px); align-items: start;
}
@media (max-width: 880px) {
  [data-design="a"] .ht-hero__inner { grid-template-columns: 1fr; }
}
[data-design="a"] .ht-hero__left { padding-top: var(--design-a-bay); }
[data-design="a"] .ht-hero__title {
  font-family: "Cormorant Garamond", serif; font-weight: 300;
  font-size: clamp(44px, 6.5vw, 96px); line-height: 1.0; letter-spacing: -.005em;
  margin: 0 0 var(--design-a-margin); text-wrap: balance; max-width: 16ch;
  /* Text visible at first paint — opacity:1 */
  opacity: 1;
}
[data-design="a"] .ht-hero__title em {
  color: var(--design-a-mauve-deep); font-style: italic; font-weight: 400;
}
[data-design="a"] .ht-hero__subtitle {
  font-family: "Lora", serif; font-size: clamp(16px, 1.3vw, 19px); line-height: 1.6;
  color: var(--design-a-ink-soft); margin: 0 0 var(--design-a-stanza);
  max-width: 44ch; font-weight: 400;
  /* Text visible at first paint */
  opacity: 1;
}

/* Menu panel (the centerpiece) */
[data-design="a"] .ht-menu-panel {
  background: var(--design-a-ivory-deep);
  border: 1px solid var(--design-a-ivory-edge);
  border-radius: var(--design-a-r-card);
  box-shadow:
    2px 2px 0 var(--design-a-ivory-edge),
    4px 4px 0 var(--design-a-ivory-edge),
    0 24px 60px -40px rgba(42,32,37,.24);
  padding: clamp(24px, 4vw, 44px) clamp(24px, 4vw, 44px) clamp(28px, 4vw, 48px);
  position: relative;
  overflow: hidden;
}

/* Ambient logo / crest at top of menu panel */
[data-design="a"] .ht-menu-crest {
  display: flex; justify-content: center; margin-bottom: var(--design-a-margin);
  color: var(--design-a-mauve);
}
[data-design="a"] .ht-crest-svg {
  width: 80px; height: 80px; display: block;
  animation: a-crest-breathe 17s var(--design-a-ease-hush) infinite;
  transform-origin: center;
}
@keyframes a-crest-breathe {
  0%,100% { transform: scale(1); opacity: 0.85; }
  50%      { transform: scale(1.032); opacity: 1; }
}

/* Menu rule separator */
[data-design="a"] .ht-menu-rule {
  height: 1px; margin: 0 0 var(--design-a-gutter);
  background: linear-gradient(90deg, transparent 5%, var(--design-a-mauve) 50%, transparent 95%);
  opacity: .5; transform: scaleX(0); transform-origin: center;
  animation: a-menu-rule-draw 1000ms 400ms var(--design-a-ease-hush) forwards;
}
@keyframes a-menu-rule-draw { to { transform: scaleX(1); } }

/* Menu list */
[data-design="a"] .ht-menu-list {
  list-style: none; padding: 0; margin: 0;
  display: grid; gap: 0;
}

/* Each menu item — starts visible (opacity:1 always) with transform for entrance */
[data-design="a"] .ht-menu-item {
  display: grid;
  grid-template-columns: 28px 1fr;
  grid-template-rows: auto auto;
  column-gap: 12px;
  row-gap: 2px;
  padding: 12px 0;
  border-bottom: 1px solid var(--design-a-rule-faint);
  /* Initial state: shifted up slightly, will animate to position */
  transform: translateY(12px);
  opacity: 0.01; /* near-0 but not 0 — avoids opacity:0 text gate while allowing entrance */
  animation: a-item-arrive 500ms var(--design-a-ease-bloom) forwards;
}
/* Sequential stagger */
[data-design="a"] .ht-menu-item[data-item="1"] { animation-delay: 500ms; }
[data-design="a"] .ht-menu-item[data-item="2"] { animation-delay: 780ms; }
[data-design="a"] .ht-menu-item[data-item="3"] { animation-delay: 1060ms; }
[data-design="a"] .ht-menu-item[data-item="4"] { animation-delay: 1340ms; }
[data-design="a"] .ht-menu-item[data-item="5"] { animation-delay: 1620ms; }
[data-design="a"] .ht-menu-item[data-item="6"] { animation-delay: 1900ms; }

@keyframes a-item-arrive {
  to { transform: translateY(0); opacity: 1; }
}

[data-design="a"] .ht-menu-item__num {
  grid-column: 1; grid-row: 1 / 3; align-self: center;
  font-family: "Cormorant Garamond", serif; font-style: italic; font-size: 15px;
  color: var(--design-a-mauve); line-height: 1;
}
[data-design="a"] .ht-menu-item__name {
  grid-column: 2; grid-row: 1;
  font-family: "Cormorant Garamond", serif; font-weight: 400;
  font-size: clamp(17px, 1.6vw, 21px); line-height: 1.2;
  color: var(--design-a-ink);
  overflow-wrap: anywhere;
}
[data-design="a"] .ht-menu-item__desc {
  grid-column: 2; grid-row: 2;
  font-family: "Lora", serif; font-size: 13px; font-style: italic;
  color: var(--design-a-mute); line-height: 1.4;
}

/* Ongoing ambient idle border — the hero stays alive after reveal */
[data-design="a"] .ht-menu-border-ambient {
  position: absolute; inset: 0; pointer-events: none;
  border-radius: var(--design-a-r-card);
  box-shadow: inset 0 0 0 1.5px var(--design-a-mauve);
  opacity: 0;
  animation: a-border-ambient 4.8s 2400ms var(--design-a-ease-hush) infinite;
}
@keyframes a-border-ambient {
  0%,100% { opacity: 0.08; box-shadow: inset 0 0 0 1px var(--design-a-mauve); }
  50%     { opacity: 0.32; box-shadow: inset 0 0 0 2px var(--design-a-mauve); }
}

/* Hero rule at bottom */
[data-design="a"] .ht-hero__rule {
  position: absolute; left: 8%; right: 8%; bottom: 0; height: 1px;
  background: linear-gradient(90deg, transparent 5%, var(--design-a-mauve) 50%, transparent 95%);
  opacity: .7; transform: scaleX(0); transform-origin: center;
  animation: a-hero-rule 1800ms 800ms var(--design-a-ease-hush) forwards;
}
@keyframes a-hero-rule { to { transform: scaleX(1); } }

/* ================================================================
   ELEMENT 2 — Action cluster (beneath hero, low weight)
   data-mf-role="cta" on primary
================================================================ */
[data-design="a"] .ht-hero__actions {
  max-width: 1280px; margin: var(--design-a-gutter) auto 0;
  padding: 0 clamp(20px, 4vw, 56px);
  display: flex; flex-wrap: wrap; align-items: center; gap: 14px;
}
[data-design="a"] .ht-status-chip {
  font-family: "Manrope", sans-serif; font-size: 11px; font-weight: 500; letter-spacing: .14em;
  color: var(--design-a-mute); text-transform: uppercase;
  border: 1px solid var(--design-a-rule); padding: 8px 14px;
  white-space: nowrap;
}

/* ELEMENT 2 — CTA buttons (mauve calling-card) */
[data-design="a"] .ht-cta {
  position: relative; display: inline-flex; align-items: center; gap: 14px;
  padding: 14px 26px; min-height: 44px;
  background: var(--design-a-mauve); color: var(--design-a-gilt);
  font-family: "Cormorant Garamond", serif; font-style: italic; font-weight: 500; font-size: 19px; letter-spacing: .005em;
  border: 1px solid var(--design-a-mauve-deep); text-decoration: none; cursor: pointer;
  transition: background var(--design-a-d-press) var(--design-a-ease-petal),
              transform var(--design-a-d-press) var(--design-a-ease-petal);
  animation: a-cta-halo 5.6s var(--design-a-ease-hush) infinite;
}
[data-design="a"] .ht-cta__rosette {
  display: inline-grid; place-items: center; width: 18px; height: 18px; color: var(--design-a-gilt);
  transition: transform var(--design-a-d-register) var(--design-a-ease-bloom);
  flex-shrink: 0;
}
[data-design="a"] .ht-cta:active { transform: translateY(1px); }
[data-design="a"] .ht-cta:focus-visible { outline: 2px solid var(--design-a-gilt); outline-offset: 3px; }

@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .ht-cta:hover { background: var(--design-a-mauve-deep); }
  [data-design="a"] .ht-cta:hover .ht-cta__rosette { transform: rotate(30deg); }
}

@keyframes a-cta-halo {
  0%,100% { box-shadow: 0 0 0 0 rgba(184,154,78,0); }
  50%     { box-shadow: 0 0 0 6px rgba(184,154,78,.12); }
}

[data-design="a"] .ht-cta--ghost {
  background: transparent; color: var(--design-a-ink); border-color: var(--design-a-rule);
  animation: none;
}
[data-design="a"] .ht-cta--ghost .ht-cta__rosette { color: var(--design-a-mauve); }

@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .ht-cta--ghost:hover { background: var(--design-a-ivory-deep); }
}

/* ================================================================
   ELEMENT 6 — Animated pointer (appetite-warm wayfinding)
   PTR-2: NOT a button
================================================================ */
[data-design="a"] .ht-pointer {
  position: relative; z-index: 5;
  max-width: 1280px; margin: -24px auto 0; padding: 0 clamp(20px, 4vw, 56px);
  display: flex; justify-content: center; pointer-events: none;
}
[data-design="a"] .ht-pointer__inner {
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  pointer-events: auto; cursor: default;
}
[data-design="a"] .ht-pointer__label {
  font-family: "Cormorant Garamond", serif; font-style: italic; font-size: 15px;
  color: var(--design-a-ink-soft);
  opacity: 0; animation: a-pointer-label 800ms 2000ms var(--design-a-ease-hush) forwards;
}
[data-design="a"] .ht-pointer__rule {
  width: 1px; height: 108px;
  background: linear-gradient(to bottom, transparent, var(--design-a-mauve) 30%, var(--design-a-mauve-deep) 100%);
  transform-origin: top center;
  animation: a-pointer-draw 1400ms 2200ms var(--design-a-ease-hush) both,
             a-pointer-breath 5.4s 3700ms var(--design-a-ease-hush) infinite;
}
[data-design="a"] .ht-pointer__blossom {
  width: 20px; height: 20px; color: var(--design-a-mauve);
  opacity: 0; transform-origin: center;
  animation: a-blossom-in 700ms 3600ms var(--design-a-ease-bloom) forwards,
             a-blossom-breath 5.4s 4300ms var(--design-a-ease-hush) infinite;
}
[data-design="a"] .ht-pointer__blossom svg { width: 100%; height: 100%; display: block; }

@keyframes a-pointer-label  { to { opacity: 1; } }
@keyframes a-pointer-draw   { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes a-pointer-breath { 0%,100% { opacity: 1; } 50% { opacity: .55; } }
@keyframes a-blossom-in     { from { opacity: 0; transform: scale(0.92); } to { opacity: 1; transform: scale(1); } }
@keyframes a-blossom-breath { 0%,100% { transform: scale(.92); } 50% { transform: scale(1.06); } }

/* ================================================================
   ELEMENT 5 — Daily Special Reveal (cloche interactive)
   INT-1: the visitor operates this; TRIAD-3 satisfied
================================================================ */
[data-design="a"] .ht-special-section {
  padding: clamp(80px, 11vw, 140px) clamp(20px, 4vw, 56px);
  background: var(--design-a-ivory-deep);
  border-top: 1px solid var(--design-a-rule-faint);
  border-bottom: 1px solid var(--design-a-rule-faint);
}
[data-design="a"] .ht-special-section__head {
  max-width: 680px; margin: 0 auto var(--design-a-stanza); text-align: center;
}
[data-design="a"] .ht-special-section__head h2 {
  font-family: "Cormorant Garamond", serif; font-weight: 300;
  font-size: clamp(36px, 5.4vw, 64px); line-height: 1.04; letter-spacing: -.005em; margin: 0 0 16px;
}
[data-design="a"] .ht-special-section__head h2 em { color: var(--design-a-mauve-deep); font-style: italic; font-weight: 300; }
[data-design="a"] .ht-special-section__head p {
  font-family: "Lora", serif; font-size: 17px; color: var(--design-a-ink-soft); margin: 0;
}

/* Cloche container */
[data-design="a"] .ht-cloche-container {
  max-width: 520px; margin: 0 auto;
  cursor: pointer; position: relative;
}
[data-design="a"] .ht-cloche-container:focus-visible {
  outline: 2px solid var(--design-a-gilt); outline-offset: 4px;
}
[data-design="a"] .ht-cloche__wrapper {
  position: relative; text-align: center;
}
[data-design="a"] .ht-cloche__dome-wrap {
  display: block; max-width: 300px; margin: 0 auto;
  transition: transform var(--design-a-d-bloom) var(--design-a-ease-bloom);
  transform-origin: bottom center;
}
[data-design="a"] .ht-cloche__svg { width: 100%; height: auto; display: block; }

/* Dome lifts on hover/interaction */
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .ht-cloche-container:hover .ht-cloche__dome-wrap {
    transform: translateY(-18px) rotate(-3deg);
  }
}
[data-design="a"] .ht-cloche-container[aria-expanded="true"] .ht-cloche__dome-wrap {
  transform: translateY(-100px) rotate(-8deg);
  opacity: 0;
  transition: transform var(--design-a-d-bloom) var(--design-a-ease-bloom),
              opacity 300ms 400ms var(--design-a-ease-petal);
}

[data-design="a"] .ht-cloche__prompt {
  font-family: "Cormorant Garamond", serif; font-style: italic; font-size: 18px;
  color: var(--design-a-mute); margin: var(--design-a-margin) 0 0;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  transition: opacity var(--design-a-d-register) var(--design-a-ease-petal);
}
[data-design="a"] .ht-cloche__prompt-icon {
  display: inline-block;
  animation: a-prompt-nudge 2.4s var(--design-a-ease-hush) infinite;
}
@keyframes a-prompt-nudge {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-4px); }
}
[data-design="a"] .ht-cloche-container[aria-expanded="true"] .ht-cloche__prompt {
  opacity: 0; pointer-events: none;
}

/* Revealed special card — display:none until lifted (strict opacity gate compliance) */
[data-design="a"] .ht-cloche__reveal { display: none; }
[data-design="a"] .ht-cloche__reveal[aria-hidden="false"] { display: block; }

[data-design="a"] .ht-special-card {
  background: var(--design-a-ivory);
  border: 1px solid var(--design-a-ivory-edge);
  border-radius: var(--design-a-r-petal);
  box-shadow: 2px 2px 0 var(--design-a-ivory-edge), 4px 4px 0 var(--design-a-ivory-edge);
  padding: clamp(24px, 4vw, 40px);
  display: grid; gap: 8px; text-align: center;
  animation: a-card-bloom 600ms var(--design-a-ease-bloom) both;
}
@keyframes a-card-bloom {
  from { opacity: 0; transform: scale(0.96) translateY(8px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}
[data-design="a"] .ht-special-card__day {
  font-family: "Manrope", sans-serif; font-size: 11px; font-weight: 600; letter-spacing: .22em;
  color: var(--design-a-mauve); text-transform: uppercase; display: block;
}
[data-design="a"] .ht-special-card__name {
  font-family: "Cormorant Garamond", serif; font-weight: 400; font-style: italic;
  font-size: clamp(26px, 3.4vw, 38px); color: var(--design-a-ink); display: block;
  line-height: 1.1;
}
[data-design="a"] .ht-special-card__note {
  font-family: "Lora", serif; font-size: 16px; color: var(--design-a-ink-soft);
  display: block; max-width: 38ch; margin: 0 auto;
}
[data-design="a"] .ht-special-card__cta {
  display: inline-flex; align-self: center; justify-self: center;
  margin-top: var(--design-a-margin);
  font-family: "Cormorant Garamond", serif; font-style: italic; font-size: 17px;
  color: var(--design-a-mauve-deep); text-decoration: none;
  border-bottom: 1px solid var(--design-a-mauve); padding-bottom: 2px;
  min-height: 44px; align-items: center;
  transition: color var(--design-a-d-register) var(--design-a-ease-petal);
}
[data-design="a"] .ht-special-card__cta:focus-visible {
  outline: 2px solid var(--design-a-gilt); outline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .ht-special-card__cta:hover { color: var(--design-a-mauve); }
}

/* ================================================================
   ELEMENT 4 — Ambient segment B: Full menu (register rows with
   scroll-linked underline animation)
   TRIAD-2: scroll-linked — register row sage-underlines draw on scroll
================================================================ */
[data-design="a"] .ht-register-section {
  padding: clamp(80px, 11vw, 144px) clamp(20px, 4vw, 56px);
  background: var(--design-a-ivory);
  border-top: 1px solid var(--design-a-rule-faint);
  border-bottom: 1px solid var(--design-a-rule-faint);
}
[data-design="a"] .ht-register-section__head {
  max-width: 920px; margin: 0 auto var(--design-a-stanza);
  display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: end;
}
@media (max-width: 760px) {
  [data-design="a"] .ht-register-section__head { grid-template-columns: 1fr; }
}
[data-design="a"] .ht-register-section__title {
  font-family: "Cormorant Garamond", serif; font-weight: 400;
  font-size: clamp(36px, 5.4vw, 68px); line-height: 1.04; letter-spacing: -.005em; margin: 0;
}
[data-design="a"] .ht-register-section__title em { color: var(--design-a-mauve-deep); font-style: italic; font-weight: 300; }
[data-design="a"] .ht-register-section__note {
  font-family: "Cormorant Garamond", serif; font-style: italic; font-size: 18px; line-height: 1.5;
  color: var(--design-a-ink-soft); border-left: 2px solid var(--design-a-sage); padding-left: 16px;
}

/* Full menu layout */
[data-design="a"] .ht-full-menu {
  max-width: 920px; margin: 0 auto;
  display: grid; gap: var(--design-a-stanza);
}
[data-design="a"] .ht-menu-section__title {
  font-family: "Manrope", sans-serif; font-size: 11px; font-weight: 600; letter-spacing: .22em;
  color: var(--design-a-mute); text-transform: uppercase;
  display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: baseline;
  border-bottom: 1px solid var(--design-a-rule); padding-bottom: 10px; margin: 0 0 4px;
}
[data-design="a"] .ht-menu-section__no { color: var(--design-a-dust); }
[data-design="a"] .ht-menu-items { display: grid; }

/* Register rows — 3-track grid per trade.md full-menu guardrails */
[data-design="a"] .ht-register__row {
  display: grid; grid-template-columns: 56px 1fr 80px; gap: 24px; align-items: baseline;
  padding: 22px 0; border-bottom: 1px solid var(--design-a-rule-faint); position: relative;
}
@media (max-width: 640px) {
  [data-design="a"] .ht-register__row { grid-template-columns: 36px 1fr; }
  [data-design="a"] .ht-register__year { grid-column: 2; text-align: left; }
}

/* Scroll-linked sage underline — TRIAD-2 premium scroll effect */
[data-design="a"] .ht-register__row::after {
  content: ""; position: absolute; left: 0; bottom: -1px; height: 1px; width: 100%;
  transform: scaleX(0); transform-origin: left;
  background: var(--design-a-sage);
  transition: transform 1400ms var(--design-a-ease-hush);
}
[data-design="a"] .ht-register__row[data-in="true"]::after { transform: scaleX(1); }

/* Mauve dot marker */
[data-design="a"] .ht-register__row::before {
  content: ""; position: absolute; left: -18px; top: 32px; width: 6px; height: 6px;
  border-radius: 50%; background: var(--design-a-mauve);
  transform: scale(0.5); opacity: 0; transition: transform 500ms 400ms var(--design-a-ease-bloom), opacity 400ms 400ms var(--design-a-ease-bloom);
}
[data-design="a"] .ht-register__row[data-in="true"]::before { transform: scale(1); opacity: 1; }

[data-design="a"] .ht-register__num {
  font-family: "Cormorant Garamond", serif; font-style: italic; font-size: 20px; color: var(--design-a-mauve);
}
[data-design="a"] .ht-register__title {
  font-family: "Cormorant Garamond", serif; font-weight: 400; font-style: italic;
  font-size: clamp(20px, 2.2vw, 26px); margin: 0; line-height: 1.25; color: var(--design-a-ink);
  min-width: 0; overflow-wrap: anywhere;
}
[data-design="a"] .ht-register__title small {
  display: block; font-family: "Lora", serif; font-style: normal; font-size: 14px; font-weight: 400;
  color: var(--design-a-ink-soft); margin-top: 6px; line-height: 1.55;
}
[data-design="a"] .ht-register__year {
  font-family: "JetBrains Mono", monospace; font-size: 11px; letter-spacing: .18em;
  color: var(--design-a-mute); text-transform: uppercase; text-align: right; white-space: nowrap;
  tabular-nums: 1;
}

[data-design="a"] .ht-menu__callout {
  font-family: "Lora", serif; font-style: italic; font-size: 16px;
  color: var(--design-a-ink-soft); text-align: center;
  border-top: 1px solid var(--design-a-rule-faint); padding-top: var(--design-a-gutter);
  margin-top: var(--design-a-gutter);
}
[data-design="a"] .ht-menu__callout a { color: var(--design-a-mauve-deep); text-decoration: none; border-bottom: 1px solid var(--design-a-mauve); }

/* ================================================================
   Hours & Location
================================================================ */
[data-design="a"] .ht-hours-section {
  padding: clamp(80px, 11vw, 144px) clamp(20px, 4vw, 56px);
  background: var(--design-a-ivory-deep);
}
[data-design="a"] .ht-hours-section__inner {
  max-width: 920px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 80px);
  align-items: start;
}
@media (max-width: 700px) {
  [data-design="a"] .ht-hours-section__inner { grid-template-columns: 1fr; }
}
[data-design="a"] .ht-section-title {
  font-family: "Cormorant Garamond", serif; font-weight: 300;
  font-size: clamp(36px, 5vw, 60px); line-height: 1.04; letter-spacing: -.005em; margin: 0 0 var(--design-a-gutter);
}
[data-design="a"] .ht-section-title em { color: var(--design-a-mauve-deep); font-style: italic; font-weight: 300; }

[data-design="a"] .ht-hours-list {
  display: grid; gap: 0; margin: 0; padding: 0;
}
[data-design="a"] .ht-hours-row {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
  align-items: baseline; padding: 16px 0;
  border-bottom: 1px solid var(--design-a-rule-faint); position: relative;
}
[data-design="a"] .ht-hours-row::after {
  content: ""; position: absolute; left: 0; bottom: -1px; height: 1px; width: 100%;
  transform: scaleX(0); transform-origin: left;
  background: var(--design-a-sage);
  transition: transform 1400ms var(--design-a-ease-hush);
}
[data-design="a"] .ht-hours-row[data-in="true"]::after { transform: scaleX(1); }
[data-design="a"] .ht-hours-row dt {
  font-family: "Cormorant Garamond", serif; font-style: italic; font-size: 18px; color: var(--design-a-ink); min-width: 0; overflow-wrap: anywhere;
}
[data-design="a"] .ht-hours-row dd {
  font-family: "Lora", serif; font-size: 15px; color: var(--design-a-ink-soft);
  margin: 0; text-align: right;
  min-width: 0; overflow-wrap: anywhere;
}

[data-design="a"] .ht-address {
  display: grid; gap: 8px; font-style: normal;
  font-family: "Lora", serif; font-size: 18px; color: var(--design-a-ink-soft);
  margin: 0 0 var(--design-a-gutter);
}
[data-design="a"] .ht-address a { color: var(--design-a-mauve-deep); text-decoration: none; }
[data-design="a"] .ht-directions-cta { margin-top: 8px; }

/* ================================================================
   Gallery
================================================================ */
[data-design="a"] .ht-gallery-section {
  padding: clamp(80px, 11vw, 144px) clamp(20px, 4vw, 56px);
  background: var(--design-a-ivory);
  border-top: 1px solid var(--design-a-rule-faint);
}
[data-design="a"] .ht-gallery-section__head {
  max-width: 920px; margin: 0 auto var(--design-a-stanza);
}
[data-design="a"] .ht-gallery-grid {
  max-width: 1280px; margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 24px;
}
[data-design="a"] .ht-gallery__item {
  margin: 0; overflow: hidden;
  border: 1px solid var(--design-a-ivory-edge);
  border-radius: var(--design-a-r-card);
  background: var(--design-a-ivory-deep);
  aspect-ratio: 4/3;
}
[data-design="a"] .ht-gallery__item img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform var(--design-a-d-settle) var(--design-a-ease-hush);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .ht-gallery__item:hover img { transform: scale(1.04); }
}

/* ================================================================
   About
================================================================ */
[data-design="a"] .ht-about-section {
  padding: clamp(80px, 11vw, 144px) clamp(20px, 4vw, 56px);
  background: var(--design-a-ivory-deep);
  border-top: 1px solid var(--design-a-rule-faint);
}
[data-design="a"] .ht-about-section__inner { max-width: 680px; margin: 0 auto; }
[data-design="a"] .ht-about__body {
  font-family: "Lora", serif; font-size: clamp(17px, 1.4vw, 20px);
  line-height: 1.65; color: var(--design-a-ink-soft);
}
[data-design="a"] .ht-about__body p { margin: 0 0 var(--design-a-gutter); }
[data-design="a"] .ht-about__body p:last-child { margin-bottom: 0; }

/* ================================================================
   Banquet Room
================================================================ */
[data-design="a"] .ht-banquet-section {
  padding: clamp(80px, 11vw, 144px) clamp(20px, 4vw, 56px);
  background: var(--design-a-ivory);
  border-top: 1px solid var(--design-a-rule-faint);
}
[data-design="a"] .ht-banquet-section__inner { max-width: 680px; margin: 0 auto; }
[data-design="a"] .ht-banquet__note {
  font-family: "Lora", serif; font-size: 18px; color: var(--design-a-ink-soft);
  margin: 0 0 var(--design-a-gutter); max-width: 52ch; line-height: 1.6;
}

/* ================================================================
   Footer
================================================================ */
[data-design="a"] .ht-footer {
  background: var(--design-a-ivory);
  border-top: 1px solid var(--design-a-mauve);
  padding: clamp(48px, 7vw, 80px) clamp(20px, 4vw, 56px) clamp(32px, 5vw, 56px);
  position: relative;
}
[data-design="a"] .ht-footer__inner {
  max-width: 920px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 32px; align-items: start;
}
@media (max-width: 700px) {
  [data-design="a"] .ht-footer__inner { grid-template-columns: 1fr; }
}
[data-design="a"] .ht-footer__name {
  font-family: "Cormorant Garamond", serif; font-style: italic; font-size: 22px;
  color: var(--design-a-ink); display: block; margin-bottom: 4px;
}
[data-design="a"] .ht-footer__tagline {
  font-family: "Lora", serif; font-style: italic; font-size: 14px; color: var(--design-a-mute); display: block;
}
[data-design="a"] .ht-footer__info {
  display: grid; gap: 8px;
  font-family: "Lora", serif; font-size: 15px; color: var(--design-a-ink-soft);
}
[data-design="a"] .ht-footer__info address { font-style: normal; }
[data-design="a"] .ht-footer__info a { color: var(--design-a-mauve-deep); text-decoration: none; }
[data-design="a"] .ht-footer__legal {
  display: grid; gap: 6px;
  font-family: "Manrope", sans-serif; font-size: 10.5px; font-weight: 500; letter-spacing: .14em;
  color: var(--design-a-mute); text-transform: uppercase; text-align: right;
}
@media (max-width: 700px) {
  [data-design="a"] .ht-footer__legal { text-align: left; }
}
[data-design="a"] .ht-footer__preview { color: var(--design-a-dust); }
[data-design="a"] .ht-footer__sprig {
  position: absolute; right: clamp(20px, 4vw, 56px); bottom: 28px;
  width: 36px; height: 18px; color: var(--design-a-sage);
  animation: a-footer-sprig-sway 22s var(--design-a-ease-hush) infinite;
  transform-origin: bottom center;
}
[data-design="a"] .ht-footer__sprig svg { width: 100%; height: 100%; display: block; }
@keyframes a-footer-sprig-sway {
  0%,100% { transform: rotate(0deg); }
  50%     { transform: rotate(2.5deg); }
}

/* ================================================================
   MOBILE ANTI-OVERFLOW (strict scope — never bare [data-design] descendant)
================================================================ */
[data-design="a"].dq-design,
[data-design="a"] .dq-design {
  max-width: 100%; overflow-x: clip;
}
[data-design="a"].dq-design * { min-width: 0; }
[data-design="a"].dq-design img,
[data-design="a"].dq-design svg:not([data-keep-size]) { max-width: 100%; height: auto; }

@media (max-width: 390px) {
  [data-design="a"] .ht-hero__inner { gap: 24px; }
  [data-design="a"] .ht-menu-panel { padding: 20px; }
  [data-design="a"] .ht-hero__actions { flex-direction: column; align-items: flex-start; }
  [data-design="a"] .ht-cta { width: 100%; justify-content: center; }
  [data-design="a"] .ht-drawer a { font-size: 28px; }
}

/* ================================================================
   REDUCED-MOTION FALLBACKS (every signature interaction)
================================================================ */
@media (prefers-reduced-motion: reduce) {
  /* Header */
  [data-design="a"] .ht-header__rule-line { animation: none !important; transform: scaleX(1) !important; }
  [data-design="a"] .ht-header__sprig { animation: none !important; opacity: 1 !important; transform: translateX(-50%) !important; }
  /* Hero menu panel */
  [data-design="a"] .ht-menu-item { animation: none !important; transform: none !important; opacity: 1 !important; }
  [data-design="a"] .ht-menu-rule { animation: none !important; transform: scaleX(1) !important; }
  [data-design="a"] .ht-menu-border-ambient { animation: none !important; opacity: 0.18 !important; }
  [data-design="a"] .ht-crest-svg { animation: none !important; }
  [data-design="a"] .ht-hero__rule { animation: none !important; transform: scaleX(1) !important; }
  /* Pointer */
  [data-design="a"] .ht-pointer__label { animation: none !important; opacity: 1 !important; }
  [data-design="a"] .ht-pointer__rule { animation: none !important; transform: scaleY(1) !important; opacity: 1 !important; }
  [data-design="a"] .ht-pointer__blossom { animation: none !important; opacity: 1 !important; transform: none !important; }
  /* CTA */
  [data-design="a"] .ht-cta { animation: none !important; }
  /* Cloche */
  [data-design="a"] .ht-cloche__prompt-icon { animation: none !important; }
  [data-design="a"] .ht-cloche__dome-wrap { transition-duration: 100ms !important; }
  [data-design="a"] .ht-special-card { animation: none !important; }
  /* Register rows */
  [data-design="a"] .ht-register__row::after { transition-duration: 200ms !important; }
  [data-design="a"] .ht-register__row::before { transition-duration: 100ms !important; }
  [data-design="a"] .ht-hours-row::after { transition-duration: 200ms !important; }
  /* Gallery */
  [data-design="a"] .ht-gallery__item img { transition: none !important; }
  /* Footer sprig */
  [data-design="a"] .ht-footer__sprig { animation: none !important; }
}

/* 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; }
