/* Each phone scene fits its small viewport, including visible browser chrome. */
@media (max-width: 760px) {
  .search input, .contact-form input, .contact-form select, .contact-form textarea { font-size: 16px; }
  .motion-ready:not(.motion-paused) .hero,
  .motion-ready:not(.motion-paused) .hero-sticky,
  .motion-ready:not(.motion-paused) .tasting-sticky,
  .motion-ready:not(.motion-paused) .meter-sticky,
  .motion-ready:not(.motion-paused) .room-sticky { min-height: 0; }
  .motion-ready:not(.motion-paused) .hero { height: 215svh; }
  .motion-ready:not(.motion-paused) .hero-sticky,
  .motion-ready:not(.motion-paused) .tasting-sticky,
  .motion-ready:not(.motion-paused) .meter-sticky,
  .motion-ready:not(.motion-paused) .room-sticky { height: 100svh; }
  .motion-ready:not(.motion-paused) .hero-meta { top: max(92px,19%); }
  .motion-ready:not(.motion-paused) .hero h1 { top: 41%; }
  .motion-ready:not(.motion-paused) .hero-finale h2 { font-size: clamp(40px,12.5vw,76px); margin: 20px 0 26px; letter-spacing: -.055em; }
  .motion-ready:not(.motion-paused) .hero-footer { bottom: 26px; }

  .motion-ready:not(.motion-paused) .tasting { height: 250svh; }
  .motion-ready:not(.motion-paused) .tasting-sticky { padding: 86px 0 20px; gap: 12px; justify-content: space-between; }
  .motion-ready:not(.motion-paused) .tasting-head { flex-shrink: 0; }
  .motion-ready:not(.motion-paused) .tasting-head h2 { font-size: clamp(31px,5.4svh,48px); line-height: 1.07; margin-top: 10px; letter-spacing: -.045em; }
  .motion-ready:not(.motion-paused) .tasting-head>div:nth-child(2) { margin: 10px 80px 0 0; padding: 0; }
  .motion-ready:not(.motion-paused) .tasting-counter { bottom: 4px; }
  .motion-ready:not(.motion-paused) .tasting-counter b { font-size: 34px; font-weight: 500; }
  .motion-ready:not(.motion-paused) .tasting-viewport { flex-shrink: 0; touch-action: pan-y pinch-zoom; }
  .motion-ready:not(.motion-paused) .taste-photo .taste-image { height: clamp(150px,30svh,280px); }
  .motion-ready:not(.motion-paused) .taste-photo .taste-title { margin: 12px 0 6px; }
  .motion-ready:not(.motion-paused) .taste-photo .taste-title h3 { font-size: clamp(21px,5.7vw,29px); line-height: 1.15; letter-spacing: -.035em; }
  .motion-ready:not(.motion-paused) .taste-card>p { font-size: 7px; letter-spacing: .04em; }
  .motion-ready:not(.motion-paused) .tasting-progress { flex-shrink: 0; margin-top: 0; }
  .motion-ready:not(.motion-paused) .tasting-foot { flex-shrink: 0; margin-top: 0; font-size: 7px; }

  /* Keep the platter and its caption together in normal flow on phones. */
  .meter-section,
  .motion-ready:not(.motion-paused) .meter-section { height: auto; }
  .meter-sticky,
  .motion-ready:not(.motion-paused) .meter-sticky { position: relative; top: auto; height: auto; min-height: 0; display: grid; grid-template-columns: minmax(0,1fr); grid-template-rows: clamp(230px,70vw,430px) auto; row-gap: 12px; padding: 36px var(--pad) 48px; }
  .meter-lines { top: 11%; }
  .meter-dish,
  .motion-ready:not(.motion-paused) .meter-dish { position: relative; grid-row: 1; width: calc(100% + 24px); max-width: 600px; left: auto; top: auto; margin: 0 -12px; justify-self: center; align-self: center; transform: rotate(-12deg); }
  .meter-orbit { top: 20px; right: var(--pad); width: 76px; height: 76px; }
  .meter-orbit>span { font-size: 29px; font-weight: 500; }
  .meter-caption,
  .motion-ready:not(.motion-paused) .meter-caption { position: relative; grid-row: 2; left: auto; right: auto; bottom: auto; margin: 0; padding: 0; text-align: center; }
  .meter-caption h2,
  .motion-ready:not(.motion-paused) .meter-caption h2 { font-size: clamp(30px,8.5vw,43px); line-height: 1.13; letter-spacing: -.045em; margin: 12px 0 14px; }
  .meter-caption p,
  .motion-ready:not(.motion-paused) .meter-caption p { font-size: 12px; line-height: 1.7; }
  .meter-caption .pill,
  .motion-ready:not(.motion-paused) .meter-caption .pill { margin-top: 8px; padding: 13px 21px; font-size: 11px; min-height: 44px; }

  .motion-ready:not(.motion-paused) .room-section { height: 240svh; }
  .motion-ready:not(.motion-paused) .room-sticky { display: grid; grid-template-columns: minmax(0,1fr); grid-template-rows: auto minmax(0,1fr); align-items: stretch; padding: 86px var(--pad) 26px; gap: 20px; }
  .motion-ready:not(.motion-paused) .room-copy h2 { font-size: clamp(29px,4.7svh,40px); line-height: 1.07; margin: 12px 0 14px; letter-spacing: -.045em; }
  .motion-ready:not(.motion-paused) .room-copy p { font-size: 11px; line-height: 1.7; max-width: 300px; margin-bottom: 14px; }
  .motion-ready:not(.motion-paused) .room-facts { top: 42px; gap: 12px; }
  .motion-ready:not(.motion-paused) .room-facts b { font-size: 24px; font-weight: 500; }
  .motion-ready:not(.motion-paused) .room-facts>span { font-size: 5px; }
  .motion-ready:not(.motion-paused) .room-stack { height: 100%; min-height: 0; max-height: 420px; margin: 0; }
  .motion-ready:not(.motion-paused) .room-card { height: 46%; padding: 6px 6px 8px; display: flex; flex-direction: column; }
  .motion-ready:not(.motion-paused) .room-card img { height: 0; min-height: 0; max-height: none; flex: 1 1 0; }
  .motion-ready:not(.motion-paused) .room-card>span { flex-shrink: 0; margin-top: 5px; font-size: 9px; line-height: 1.3; }
  .motion-ready:not(.motion-paused) .room-card-3,
  .motion-ready:not(.motion-paused) .room-card-4 { top: 49%; }
  .taste-card:active .taste-image img { transform: scale(1.035); }
  .gallery-item:active { opacity: .82; }
}
@media (max-width: 760px) and (max-height: 650px) {
  .motion-ready:not(.motion-paused) .tasting-sticky { padding-top: 80px; padding-bottom: 16px; gap: 10px; }
  .motion-ready:not(.motion-paused) .tasting-head h2 { font-size: 31px; }
  .motion-ready:not(.motion-paused) .taste-photo .taste-title h3 { font-size: 21px; }
  .motion-ready:not(.motion-paused) .room-sticky { padding-top: 80px; padding-bottom: 20px; gap: 14px; }
  .motion-ready:not(.motion-paused) .room-copy h2 { font-size: 27px; margin: 8px 0 10px; }
  .motion-ready:not(.motion-paused) .room-copy p { font-size: 10px; line-height: 1.65; margin-bottom: 10px; }
  .motion-ready:not(.motion-paused) .room-facts { top: 34px; }
  .motion-ready:not(.motion-paused) .room-facts b { font-size: 22px; }
}
@media (hover: none), (pointer: coarse) {
  .cursor-orbit { display: none; }
  .reading-word { transition: none; }
  .mobile-nav a, .category-tabs button, .pill, .header-cta { -webkit-tap-highlight-color: transparent; }
}