/* Short, scannable paths into the existing menu. */
.first-order .section-head h2 { max-width: 25ch; }
.order-rows { border-top: 1px solid var(--line); }
.order-row { display: grid; grid-template-columns: 1fr 1.6fr auto; align-items: center; gap: 24px; padding: 24px 0; border-bottom: 1px solid var(--line); text-decoration: none; }
.order-row strong { font-size: 1.25rem; }
.order-row > span, .order-note { color: var(--muted); }
.order-row b { white-space: nowrap; }
.order-row:hover strong { text-decoration: underline; text-underline-offset: .22em; }
.order-note { margin-top: 16px; font-size: .88rem; }
@media (max-width: 560px) {
  .order-row { grid-template-columns: 1fr auto; gap: 8px 16px; padding: 20px 0; }
  .order-row > span { grid-column: 1 / -1; grid-row: 2; font-size: .94rem; }
  .order-row b { grid-column: 2; grid-row: 1; font-size: .94rem; }
}
/* A real named product is the first visual proof. */
.experience-hero { grid-template-columns: .95fr 1.05fr; gap: 38px; padding-top: 42px; }
.experience-hero h1 { font-size: clamp(3rem, 5.2vw, 4.6rem); }
.experience-hero .hero-title-line-primary { font-size: .48em; line-height: 1.25; }
.experience-hero .experience-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px 20px; margin-top: 22px; font-size: 1.08rem; }
.experience-price strong { color: var(--brand-red); font-size: 1.25rem; white-space: nowrap; }
.experience-hero .lead { margin-top: 16px; font-size: 1rem; line-height: 1.8; }
.experience-hero-photo { display: block; margin: 0; }
.experience-hero-photo img { width: 100%; height: auto; border-radius: 4px; }
.experience-hero .hero-facts { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.experience-hero .hero-facts li { background: none; border: 0; padding: 0; box-shadow: none; backdrop-filter: none; font-size: .82rem; }
.experience-hero .hero-facts li::before, .experience-hero .hero-facts li::after { display: none; }
.coffee-choice-layout { display: grid; grid-template-columns: minmax(220px,.7fr) minmax(0,1.3fr); align-items: center; gap: 40px; }
.magic-preview { margin: 0; }
.magic-preview img { width: 100%; max-width: 330px; height: auto; border-radius: 4px; }
.magic-preview figcaption { display: grid; gap: 5px; margin-top: 14px; }
.magic-preview figcaption span { color: var(--muted); font-size: .92rem; }
.coffee-choice-layout .order-row { grid-template-columns: 1fr auto; gap: 7px 16px; padding: 21px 0; }
.coffee-choice-layout .order-row > span { grid-column: 1 / -1; grid-row: 2; }
.coffee-choice-layout .order-row b { grid-column: 2; grid-row: 1; }
.companion-menu { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.companion-menu p:not(.eyebrow) { max-width: 60ch; margin: 18px 0; }
@media (max-width: 860px) {
  .experience-hero { grid-template-columns: 1fr; }
  .experience-hero-photo { max-width: 640px; }
  .coffee-choice-layout { gap: 24px; grid-template-columns: .65fr 1fr; }
}
@media (max-width: 560px) {
  .experience-hero { display: flex; flex-direction: column; align-items: stretch; gap: 13px; padding-top: 26px; }
  .experience-hero .hero-copy { display: contents; }
  .experience-hero .hero-copy > .eyebrow { order: 1; }
  .experience-hero .hero-copy > h1 { order: 2; margin: 0; }
  .experience-hero h1 { font-size: 2.85rem; }
  .experience-hero .hero-title-line-primary { font-size: .6em; margin-top: 8px; }
  .experience-hero .hero-copy > p.experience-price { order: 3; margin: 0; font-size: .98rem; }
  .experience-hero .experience-hero-photo { order: 4; height: auto; width: 100%; max-width: 306px; margin: 0 auto; }
  .experience-hero-photo img { height: auto; object-fit: contain; border-radius: 4px; }
  .experience-hero .hero-copy > .lead { order: 5; margin: 0; font-size: .94rem; line-height: 1.65; }
  .experience-hero .hero-copy > .hero-actions { order: 6; margin: 0; }
  .experience-hero .hero-copy > .hero-language { order: 7; margin: 0; font-size: .92rem; }
  .experience-hero .hero-facts { order: 8; margin-top: 8px; }
  .coffee-choice-layout { grid-template-columns: 1fr; gap: 24px; }
  .magic-preview { display: grid; grid-template-columns: 128px 1fr; gap: 18px; align-items: center; }
  .magic-preview figcaption { margin: 0; }
  .magic-preview img { border-radius: 4px; }
}
@media (max-width: 560px) {
  .experience-hero .experience-price strong { font-size: 1.12rem; }
}
