/* Phone and tablet art direction. Keep the original desktop composition. */
.product-detail { row-gap:20px; }
.product-detail-image { grid-column:1; grid-row:1 / 3; }
.product-detail-heading { grid-column:2; padding-top:15px; min-width:0; }
.product-detail-heading h1 { font-size:clamp(55px,5.6vw,86px); margin-bottom:4px; }
.product-detail-heading .eyebrow { font-size:9px; }
.product-detail-copy { grid-column:2; padding-top:0; }
@media (max-width:1024px) {
  :root { --gutter:32px; }
  html { scroll-padding-top:104px; }
  html.menu-open { overflow:hidden; }
  .site-header,.site-header.is-scrolled { top:max(12px,env(safe-area-inset-top)); left:20px; right:20px; height:72px; padding:10px 18px; gap:16px; border-radius:18px; }
  .site-header .brand { flex:1 1 auto; max-width:210px; }
  .site-header .brand img { width:100%; max-width:210px; }
  .site-header .nav-actions { gap:10px; }
  .site-header .bag-link { min-height:44px; min-width:72px; padding:8px 14px; justify-content:center; gap:10px; font-size:13px; }
  .bag-link span { font-size:12px; }
  .site-header .menu-toggle { display:flex; flex:0 0 44px; width:44px; height:44px; padding:0; border:0; flex-direction:column; align-items:center; justify-content:center; gap:6px; }
  .menu-toggle span { display:block; width:22px; height:1.5px; background:var(--red); transition:transform .2s; }
  .menu-toggle[aria-expanded=true] span:first-child { transform:translateY(3.75px) rotate(45deg); }
  .menu-toggle[aria-expanded=true] span:last-child { transform:translateY(-3.75px) rotate(-45deg); }
  .site-header nav { display:none; position:absolute; inset:auto 0 auto; top:calc(100% + 10px); height:auto; max-height:calc(100dvh - 118px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); padding:24px; border:1px solid var(--line); border-radius:18px; background:#fffcf6; box-shadow:0 20px 55px #38231e25; overflow-y:auto; overscroll-behavior:contain; flex-direction:column; align-items:stretch; justify-content:flex-start; gap:0; counter-reset:nav; }
  .site-header nav.is-open { display:flex; }
  .site-header nav:before { content:'Explore All Saints'; color:var(--muted); font:500 11px/1.5 var(--sans); letter-spacing:.14em; text-transform:uppercase; padding-bottom:18px; }
  .site-header nav a { display:flex; align-items:center; gap:18px; min-height:64px; padding:12px 0; border-bottom:1px solid var(--line); color:var(--ink); font:400 25px/1.25 var(--sans); letter-spacing:-.04em; }
  .site-header nav a:before { counter-increment:nav; content:'0' counter(nav); font:400 11px/1 var(--sans); color:var(--red); letter-spacing:0; }
  .site-header nav a:after { display:none; }
  .site-header nav a:last-child { border:0; }
  .site-header nav a[aria-current] { color:var(--red); font-weight:500; }
  .section { padding:72px var(--gutter); }
  .section-heading { align-items:start; gap:32px; }
  .section-heading h2 { font-size:clamp(44px,6vw,66px); line-height:1; }
  .section-aside { font-size:15px; line-height:1.7; }
  .button { min-height:48px; font-size:14px; }
  .text-link { min-height:44px; display:inline-flex; align-items:center; font-size:13px; }
  .eyebrow,.kicker { font-size:11px; line-height:1.6; letter-spacing:.13em; margin-bottom:18px; }
  .fineprint,.small-note,.shop-preview-note { font-size:12px; line-height:1.6; }
  label { font-size:13px; }
  input,select,textarea { font-size:16px; min-height:48px; }
  summary { min-height:54px; }
  .home-story-peek { padding-block:72px; }
  .home-story-peek p:not(.eyebrow) { font-size:15px; line-height:1.8; }
  .home-story-peek h2 { font-size:clamp(34px,4.6vw,48px); letter-spacing:-.05em; }
  .counter-card>span { font-size:34px; }
  .site-footer { padding:64px var(--gutter) 28px; }
  .footer-top .eyebrow,.footer-grid .eyebrow { font-size:10px; letter-spacing:.1em; }
  .footer-grid a,.footer-grid button { display:flex; align-items:center; min-height:44px; margin:0; font-size:13px; line-height:1.5; }
  .footer-grid p:not(.eyebrow) { font-size:13px; line-height:1.8; }
  .footer-bottom { font-size:10px; line-height:1.6; flex-wrap:wrap; }
  .footer-bottom a { display:inline-flex; align-items:center; min-height:44px; }
  #toast { font-size:13px; line-height:1.5; }
}

@media (max-width:600px) {
  :root { --gutter:20px; }
  body { font-size:15px; line-height:1.65; }
  .site-header,.site-header.is-scrolled { left:12px; right:12px; height:64px; padding:8px 10px 8px 14px; gap:8px; border-radius:16px; }
  .site-header .brand { max-width:178px; }
  .site-header .brand img { max-width:178px; }
  .site-header .nav-actions { gap:4px; }
  .site-header .bag-link { min-width:64px; padding:8px 10px; font-size:12px; gap:8px; }
  .site-header nav { padding:22px; max-height:calc(100dvh - 104px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
  .site-header nav a { font-size:23px; min-height:62px; }
  .section { padding:56px var(--gutter); }
  h1,.page-intro h1 { font-size:clamp(44px,12vw,56px); line-height:1.02; }
  h2,.section-heading h2 { font-size:clamp(36px,10vw,46px); line-height:1.05; letter-spacing:-.04em; }
  .section-heading { display:block; margin-bottom:28px; }
  .section-aside { max-width:none; margin-top:22px; }
  .section-aside p { margin-bottom:10px; }
  .eyebrow { font-size:10px; margin-bottom:16px; }
  .button { min-height:48px; padding:13px 20px; font-size:14px; gap:20px; }
  .text-link { font-size:13px; }
  .home-story-peek { gap:28px; padding-block:56px; }
  .home-story-peek h2 { font-size:35px; margin:16px 0; }
  .home-story-peek .eyebrow { font-size:10px; }
  .home-story-peek p:not(.eyebrow) { margin-bottom:10px; }
  .home-story-peek .text-link { margin-top:0; font-size:13px; }
  .counter-grid { gap:16px; margin-right:calc(-1 * var(--gutter)); padding-right:var(--gutter); }
  .counter-card { flex-basis:74%; aspect-ratio:4/4.5; }
  .counter-card>span { font-size:32px; left:22px; right:22px; bottom:24px; }
  .platform-actions { align-items:stretch; display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:0; }
  .platform-actions .button { font-size:12px; justify-content:center; padding:12px; }
  .platform-actions>.text-link { grid-column:1/-1; justify-self:start; }
  .site-footer { padding:48px var(--gutter) max(24px,env(safe-area-inset-bottom)); }
  .footer-top { margin-bottom:32px; }
  .footer-top .eyebrow { font-size:9px; margin-bottom:24px; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:28px 18px; padding-top:28px; }
  .footer-grid .eyebrow { font-size:9px; margin-bottom:12px; }
  .footer-grid>div:nth-child(2) { grid-column:1/-1; grid-row:2; }
  .footer-bottom { align-items:flex-start; gap:8px; margin-top:28px; font-size:9px; }
  #toast { max-width:calc(100vw - 32px); width:max-content; border-radius:12px; padding:12px 16px; }

  /* Keep the original long baking sequence, with a phone-sized stage. */
  .bake-opening { top:max(112px,15svh); width:calc(100% - 40px); }
  .bake-opening .eyebrow { font-size:10px; line-height:1.5; letter-spacing:.13em; margin-bottom:18px; }
  .bake-opening h2 { font-size:clamp(38px,10.8vw,50px); line-height:1.02; }
  .bake-brand { top:max(126px,17svh); width:calc(100% - 40px); max-width:calc(100vw - 40px); }
  .bake-brand>span { font-size:11px; line-height:1.5; letter-spacing:.08em; margin-top:16px; }
  .bake-skip { top:max(20px,env(safe-area-inset-top)); right:20px; min-height:44px; display:flex; align-items:center; padding:9px 14px; font-size:11px; background:#fffaf2d9; border:1px solid #bc202626; border-radius:30px; }
  .bake-hero.is-finished .bake-skip { visibility:hidden; }
  .bake-cta { width:calc(100% - 40px); max-width:none; bottom:max(72px,calc(env(safe-area-inset-bottom) + 52px)); display:grid; grid-template-columns:1fr; gap:4px; white-space:normal; }
  .bake-cta .button { width:100%; font-size:14px; min-height:48px; padding:13px 20px; justify-content:center; gap:24px; }
  .bake-cta>.text-link { display:flex; justify-content:center; font-size:12px; min-height:44px; border:0; background:#fffaf2c9; border-radius:30px; text-shadow:none; }
  .bake-chapter { left:20px; bottom:max(18px,env(safe-area-inset-bottom)); max-width:165px; gap:8px; }
  .bake-step { font-size:20px; }
  .bake-chapter-name { font-size:9px; letter-spacing:.04em; max-width:112px; line-height:1.4; }
  .bake-scroll { right:20px; bottom:max(20px,env(safe-area-inset-bottom)); font-size:9px; letter-spacing:.02em; gap:8px; }
  .bake-scroll-line { width:24px; }

  /* A flowing album on phones avoids trapping longer copy in a short screen. */
  .memory-chapter.is-flow { height:auto; }
  .is-flow .memory-stage { position:relative; display:flex; height:auto; overflow:visible; padding:120px var(--gutter) 56px; gap:32px; }
  .is-flow .memory-rule { top:99px; left:20px; right:20px; }
  .is-flow .memory-intro { width:100%; }
  .is-flow .memory-heading { font-size:clamp(49px,13vw,72px); }
  .is-flow .memory-kicker { font-size:10px; margin-bottom:18px; }
  .is-flow .memory-since { margin-top:22px; }
  .is-flow .heritage-type { font-size:10px; letter-spacing:.06em; }
  .is-flow .memory-frame { width:100%; max-width:none; padding:8px 8px 0; }
  .is-flow .memory-frame>img { width:100%; height:auto; max-height:none; }
  .is-flow .memory-photo-caption { padding:16px 10px; }
  .is-flow .memory-photo-caption>span { font-size:9px; }
  .is-flow .memory-photo-caption>p { font-size:14px; }
  .is-flow .memory-notes { width:100%; max-width:none; }
  .is-flow .memory-note+.memory-note { margin-top:32px; padding-top:28px; border-top:1px solid var(--line); }
  .is-flow .memory-note h2 { font-size:34px; margin-bottom:18px; }
  .is-flow .memory-note>p:not(.memory-kicker) { font-size:15px; line-height:1.8; max-width:none; margin-bottom:12px; }
  .is-flow .memory-note .text-link { font-size:13px; }
  .is-flow .memory-footer { display:none; }
  .heritage-album .archive-heading h2,.heritage-after>h2 { font-size:36px; }
  .archive-heading>p:last-child,.heritage-after .intro-foot>p,.history-notes p { font-size:15px; line-height:1.8; }
  .archive-caption p { font-size:17px; }
  .archive-caption span,.history-notes span { font-size:10px; }
}

@media (max-width:900px) {
  .product-detail-heading { grid-row:1; }
  .product-detail-image { grid-column:1; grid-row:2; }
  .product-detail-copy { grid-column:2; grid-row:2; }
  .dialog-close { width:44px; height:44px; font-size:28px; }
}
@media (max-width:700px) {
  .product-detail-copy { grid-column:1; grid-row:3; }
  .product-detail-image { grid-column:1; grid-row:2; }
}

@media (min-width:601px) and (max-width:1024px) and (max-aspect-ratio:1/1) {
  .bake-brand { top:12%; width:78%; }
  .bake-brand>span { width:max-content; max-width:100%; margin:18px auto 0; padding:8px 16px; border-radius:30px; background:#fffaf2d9; font-size:12px; letter-spacing:.1em; }
  .bake-opening .eyebrow { font-size:11px; }
  .bake-skip { top:104px; min-height:44px; padding:10px 0; font-size:12px; }
  .bake-hero.is-finished .bake-skip { visibility:hidden; }
  .bake-cta { bottom:8%; }
  .bake-cta .button { font-size:14px; min-height:48px; padding:13px 22px; }
  .bake-cta>.text-link { font-size:13px; min-height:44px; display:flex; align-items:center; }
  .bake-chapter-name,.bake-scroll { font-size:10px; }
  .memory-chapter.is-enhanced .memory-frame { left:12%; width:76%; top:15%; }
  .memory-chapter.is-enhanced .memory-frame>img { max-height:32svh; object-fit:contain; }
  .memory-chapter.is-enhanced .memory-notes { top:60%; left:12%; width:76%; }
  .memory-note h2 { font-size:40px; margin-bottom:18px; }
  .memory-note>p:not(.memory-kicker) { font-size:15px; line-height:1.7; }
  .memory-note .memory-kicker { font-size:10px; margin-bottom:16px; }
  .memory-note .text-link { font-size:13px; }
}

@media (max-width:1024px) and (max-height:600px) and (min-aspect-ratio:1/1) {
  .site-header nav { padding:16px 24px; }
  .site-header nav:before { display:none; }
  .site-header nav a { min-height:48px; font-size:20px; padding:10px 0; }
  .bake-brand { top:22%; width:48%; }
  .bake-brand>span { font-size:10px; margin-top:12px; }
  .bake-cta .button { font-size:12px; min-height:44px; padding:10px 18px; }
  .bake-cta>.text-link { font-size:12px; min-height:44px; display:flex; align-items:center; }
  .bake-chapter { display:none; }
  .bake-scroll { font-size:9px; }
}
