/* Phone layouts share the same artwork, palette, and checkout flow. */
@media (max-width: 700px) {
  :root { --site-header-height: 112px; --gutter: 20px; }
  .site-header.store-header {
    height: var(--site-header-height);
    padding: 12px 16px 8px;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: 44px 44px;
    gap: 4px 12px;
  }
  .store-header .brand-lockup {
    width: min(201px, 100%);
    min-width: 0;
    min-height: 44px;
    padding: 0;
    gap: 6px;
  }
  .store-header .brand-lockup .brand-artwork--mascot { width: 38px; flex: 0 0 38px; }
  .store-header .brand-lockup .brand-artwork--wordmark { width: auto; min-width: 0; flex: 1; }
  .store-header .header-cta { min-height: 44px; padding: 8px 10px; gap: 8px; font-size: 12px; }
  .store-header nav { gap: 10px; font-size: 12px; }
  .store-header nav a { display: flex; align-items: center; min-height: 44px; padding: 6px 0; }
  .commerce-page { padding: calc(var(--site-header-height) + 32px) 20px 60px; }
  .hero { padding-top: calc(var(--site-header-height) + 40px); }
  .hero h1 { font-size: clamp(94px, 25vw, 160px); }
  .hero-copy > .eyebrow { font-size: 10px; line-height: 1.6; letter-spacing: .8px; max-width: 350px; }
  .hero-copy p, .manifesto p, .cravings-heading p, .flavor-description, .closing p { font-size: 14px; line-height: 1.8; }
  .hero-copy p br { display: none; }
  .pill-button, .save-pick, .shop-home-link { min-height: 48px; font-size: 13px; align-items: center; }
  .hero-bottom { font-size: 9px; }
  .hero-bottom > a { min-height: 44px; }
  .motion-toggle { min-height: 44px; font-size: 11px; padding: 10px 13px; right: 14px; bottom: max(14px, env(safe-area-inset-bottom)); }
  .manifesto > .eyebrow, .section-top .eyebrow, .closing > .eyebrow, .small-index { font-size: 10px; line-height: 1.6; letter-spacing: .8px; }
  .section-top { align-items: flex-start; gap: 20px; }
  .flavor-tabs { gap: 10px; }
  .flavor-tabs button { min-height: 44px; font-size: 12px; white-space: normal; }
  .flavor-kicker, .flavor-notes > span, .art-caption { font-size: 10px; letter-spacing: .8px; }
  .flavor-notes strong, .save-status { font-size: 12px; line-height: 1.6; }
  .store-footer .footer-top { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .store-footer .footer-links { justify-self: start; flex-direction: row; flex-wrap: wrap; gap: 4px 22px; font-size: 13px; }
  .footer-links a, .footer-bottom > a { display: inline-flex; align-items: center; min-height: 44px; }
  .store-footer .footer-bottom { align-items: center; font-size: 11px; gap: 10px; }
  .store-footer .footer-bottom > a { font-size: 10px; justify-content: flex-end; }
  .store-footer .footer-bottom > span:nth-child(2) { font-size: 11px; line-height: 1.6; }
  .miami-map > figcaption { flex-wrap: wrap; font-size: 12px; }
  .miami-map > figcaption > span { font-size: 11px; }

  .ca-shop-intro p, .ca-section-heading > p { font-size: 14px; }
  .ca-shop-intro .ca-label, .ca-section-heading .ca-label, .ca-pack-top { font-size: 10px; letter-spacing: .8px; }
  .ca-pack-grid, .ca-order-layout, .ca-review-grid, .ca-bag-lines { grid-template-columns: minmax(0, 1fr); }
  .ca-pack-copy > p { font-size: 13px; }
  .ca-pack-copy .ca-button, .ca-button { min-height: 48px; font-size: 13px !important; }
  .ca-shop-announcement { font-size: 12px; flex-wrap: wrap; }
  .ca-shop-announcement a { min-height: 44px; }
  .ca-checkout-wrap, .ca-review { scroll-margin-top: calc(var(--site-header-height) + 20px); }
  .ca-form-panel { padding: 22px 14px; }
  .ca-panel-title p, .ca-reward-panel > .ca-fine-print, .ca-reward-hint { font-size: 13px; }
  .ca-calendar { padding: 16px 8px; }
  .ca-calendar-heading .ca-label { font-size: 10px; }
  .ca-calendar-heading h3 > span { font-size: 13px; }
  .ca-calendar-nav { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; gap: 6px; }
  .ca-icon-button { width: 44px; height: 44px; }
  .ca-calendar-selects { min-width: 0; flex-wrap: wrap; gap: 0 8px; }
  .ca-calendar-selects select { max-width: 100%; min-width: 0; min-height: 44px; font-size: 16px; padding: 5px 0; }
  .ca-weekdays { font-size: 11px; }
  .ca-days button { min-height: 44px; font-size: 13px; border-radius: 16px; padding: 3px; }
  .ca-calendar-caption { font-size: 12px; }
  .ca-calendar > .ca-fine-print, .ca-shop .ca-fine-print, .ca-review > .ca-fine-print, .ca-time-field small { font-size: 12px; line-height: 1.7; }
  .ca-field { font-size: 13px; }
  .ca-field > input, .ca-field > select, .ca-field > textarea { font-size: 16px; min-height: 48px; }
  .ca-field > input::placeholder, .ca-field > textarea::placeholder { font-size: 13px; }
  .ca-notes > span { font-size: 11px; }
  .ca-text-button { min-height: 44px; font-size: 13px; }
  .ca-bag-panel { padding: 22px 16px; }
  .ca-bag-item { gap: 12px; }
  .ca-bag-item-main > div:first-child { flex-wrap: wrap; gap: 4px 10px; }
  .ca-bag-item h4 { margin: 0; }
  .ca-bag-item p { font-size: 12px; }
  .ca-bag-actions { flex-wrap: wrap; gap: 4px 12px; }
  .ca-quantity { min-width: 116px; height: 46px; border-radius: 24px; }
  .ca-quantity > button { width: 44px; height: 44px; font-size: 18px; }
  .ca-quantity > span { font-size: 14px; }
  .ca-remove { min-height: 44px; font-size: 12px !important; padding: 8px 0; }
  .ca-bag-totals > div { font-size: 13px; }
  .ca-bag-totals strong { text-align: right; }
  .ca-bag-panel > .ca-fine-print, .ca-bag-reward > p, .ca-payment-pending { font-size: 12px; }
  .ca-review-grid > div, .rewards-name-fields > *, .rewards-order-main, .rewards-join-copy { min-width: 0; }
  .ca-review-grid p, .ca-receipt, .rewards-join-copy p, .rewards-member-heading, .rewards-order-main { overflow-wrap: anywhere; }
  .rewards-hero { padding-top: 10px; }
  .rewards-ticket { width: min(260px, calc(100% - 24px)); }
  .rewards-account { scroll-margin-top: calc(var(--site-header-height) + 16px); }
  .rewards-button, .rewards-text-link { min-height: 48px; display: inline-flex; align-items: center; }
  .rewards-code-row { flex-wrap: wrap; }
  .rewards-code-row button { min-height: 44px; font-size: 13px; }
  .rewards-ticket-note { font-size: 12px; line-height: 1.6; }
}

/* A flowing story keeps every chapter readable on phones and short screens. */
@media (max-width: 700px), (max-height: 650px) {
  .obsession { height: auto; }
  .story-stage, .is-reduced .story-stage { position: relative; height: auto; min-height: 0; padding: 55px var(--gutter); background: #77c8e5 !important; color: var(--ink) !important; }
  .story-top, .story-chapters, .story-media, .chapter,
  .is-reduced .story-top, .is-reduced .story-chapters, .is-reduced .story-media, .is-reduced .chapter { position: relative; inset: auto; }
  .story-counter, .story-bottom, .story-scribble { display: none; }
  .story-top .eyebrow, .chapter-number { font-size: 10px; line-height: 1.6; letter-spacing: 1px; }
  .story-media, .is-reduced .story-media { width: min(100%, 460px); height: clamp(220px, 65vw, 350px); margin: 25px auto 40px; }
  .story-media img { width: 100%; max-height: 350px; object-fit: contain; transform: translateY(-50%) rotate(-10deg) !important; }
  .story-whole { opacity: 1 !important; }
  .story-broken { opacity: 0 !important; }
  .story-chapters, .is-reduced .story-chapters { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .chapter, .is-reduced .chapter { width: 100%; opacity: 1 !important; transform: none !important; transition: none; }
  .chapter + .chapter { border-top: 1px solid var(--line); padding-top: 35px; }
  .chapter h2, .is-reduced .chapter h2 { font-size: clamp(48px, 12vw, 70px); margin: 18px 0; }
  .chapter h2 em { color: var(--ink) !important; }
  .chapter p, .is-reduced .chapter p { font-size: 14px; line-height: 1.8; max-width: 520px; }
  .chapter-footnote, .is-reduced .chapter-footnote { font-size: 10px; letter-spacing: .6px; gap: 10px; line-height: 1.6; }
}

@media (max-width: 430px) {
  .rewards-name-fields { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .rewards-join-form, .rewards-join-copy { padding: 24px 20px; }
  .rewards-order-card { flex-direction: column; }
  .rewards-order-meta { text-align: left; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 12px; }
  .ca-review-grid > div:first-child p, .ca-receipt > div { flex-wrap: wrap; gap: 8px 16px; }
}

@media (max-width: 360px) {
  .ca-pack-card { grid-template-columns: minmax(0, 1fr); }
  .ca-pack-art { height: 210px; margin-top: 35px; }
  .ca-pack-art img { width: 95%; margin: 0; }
  .ca-pack-numeral { top: 15px; }
  .ca-pack-copy { padding: 12px 20px 24px; }
  .ca-pack-title { display: flex; }
  .ca-pack-title h3 { margin: 0; }
  .ca-pack-copy > p { max-width: none; }
  .ca-bag-thumb { width: 48px; height: 60px; }
  .ca-bag-title { gap: 8px; }
  .ca-bag-title > span { padding: 6px 8px; }
  .commerce-cart .ca-shop-intro.ca-brand-cart-intro { grid-template-columns: minmax(0, 1fr) 60px; gap: 8px; }
  .rewards-ticket { padding: 23px 20px; }
  .rewards-ticket-top { flex-wrap: wrap; }
  .rewards-hero h1 { font-size: 48px; }
}