/*
  Puppy Gumbo visual review candidate — Aug. 31, 2026
  Purpose: non-destructive responsive guardrails + deliberate page-by-page presentation.
  This file loads AFTER site.css so the current approved content and Shopify wiring stay intact.
*/

:root{
  --pg-review-green:#235b3a;
  --pg-review-brown:#6d431f;
  --pg-review-gold:#c99635;
  --pg-review-cream:#fffaf0;
}

/* ---------- Production cleanup / compact room navigation ---------- */
body.standalone-page > nav.pg-image-menu{display:none!important}
body.standalone-page{padding-bottom:0}
body.home-page.pg-home-paged{padding-bottom:0}
.pg-room-rail{
  position:sticky;top:0;z-index:120;
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;
  gap:12px;align-items:center;
  min-height:54px;padding:7px clamp(10px,2vw,22px);
  border-bottom:2px solid #9a6a31;
  background:rgba(255,250,240,.97);
  box-shadow:0 5px 16px rgba(48,29,15,.12);
  backdrop-filter:blur(7px);
}
.pg-room-rail a,.pg-room-rail button{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:38px;padding:7px 12px;border:2px solid #7e5529;border-radius:999px;
  background:#fff;color:#4c311d;text-decoration:none;font:800 .88rem/1.1 Arial,sans-serif;cursor:pointer;
}
.pg-room-rail a:hover,.pg-room-rail a:focus-visible,.pg-room-rail button:hover,.pg-room-rail button:focus-visible{background:#f3e3c0;outline:3px solid rgba(35,91,58,.16)}
.pg-room-rail-title{min-width:0;text-align:center;color:#235b3a;font:900 clamp(.92rem,2vw,1.15rem)/1.1 Georgia,serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- Page-turn controls ---------- */
.pg-page-turnbar{
  position:relative;left:auto;bottom:auto;z-index:30;transform:none;
  display:grid;grid-template-columns:auto auto minmax(130px,1fr) auto auto;align-items:center;gap:7px;
  width:min(calc(100% - 28px),780px);margin:18px auto 30px;padding:8px 10px;
  border:3px solid #7f5527;border-radius:18px;
  background:#fff9eb;box-shadow:0 10px 24px rgba(39,24,13,.16)
}
.pg-page-turnbar button,.pg-page-turnbar a{
  min-height:40px;padding:7px 10px;border:2px solid #7e5529;border-radius:10px;background:#fffaf0;color:#51341f;
  font:900 .82rem/1.05 Arial,sans-serif;text-decoration:none;text-align:center;cursor:pointer
}
.pg-page-turnbar .pg-turn-primary{background:#235b3a;color:#fff;border-color:#16452c}
.pg-page-turnbar button:disabled{opacity:.38;cursor:default}
.pg-turn-status{min-width:0;text-align:center;color:#4f3724;font:800 .82rem/1.2 Arial,sans-serif}
.pg-turn-status strong{display:block;color:#235b3a;font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-turn-status span{display:block;margin-top:2px;color:#70563f;font-size:.72rem}

/* Hide only deck siblings; do not alter their internal approved content. */
.pg-deck-hidden{display:none!important}
.pg-deck-visible{display:block!important}

/* Prevent anchor jumps from creating half-shown neighboring pages. */
html{scroll-behavior:auto!important}

/* ---------- Home: three deliberate views ---------- */
body.home-page.pg-home-paged > .chef-puppy-welcome,
body.home-page.pg-home-paged > .topbar,
body.home-page.pg-home-paged > #home-menu,
body.home-page.pg-home-paged > main,
body.home-page.pg-home-paged > footer{display:none!important}
body.home-page.pg-home-paged[data-pg-home-view="welcome"] > .chef-puppy-welcome{display:grid!important}
body.home-page.pg-home-paged[data-pg-home-view="menu"] > .topbar{display:block!important}
body.home-page.pg-home-paged[data-pg-home-view="menu"] > #home-menu{display:block!important}
body.home-page.pg-home-paged[data-pg-home-view="kitchen"] > .topbar{display:block!important}
body.home-page.pg-home-paged[data-pg-home-view="kitchen"] > main{display:block!important}
body.home-page.pg-home-paged[data-pg-home-view="kitchen"] > footer{display:block!important}

/* Mobile landing: keep the call-to-action reachable without an enormous first image. */
@media(max-width:760px){
  body.home-page.pg-home-paged .chef-puppy-welcome{padding:10px 14px 90px;align-content:start}
  body.home-page.pg-home-paged .chef-puppy-welcome-inner{gap:10px}
  body.home-page.pg-home-paged .chef-puppy-welcome-portrait img{max-height:42svh;width:auto;max-width:100%}
  body.home-page.pg-home-paged .chef-puppy-welcome-copy h1{font-size:clamp(1.9rem,9vw,2.8rem)}
  body.home-page.pg-home-paged .chef-puppy-welcome-copy p{font-size:clamp(1rem,4.6vw,1.28rem);margin-top:7px}
  body.home-page.pg-home-paged .chef-puppy-welcome-song{margin-top:9px;padding:8px 10px 9px}
  body.home-page.pg-home-paged .chef-puppy-welcome-actions{margin-top:10px;gap:8px}
  body.home-page.pg-home-paged .chef-puppy-welcome-primary,
  body.home-page.pg-home-paged .chef-puppy-welcome-returning{min-height:46px;padding:9px 12px}
}

/* ---------- Experience: one meaningful stop at a time ---------- */
body.pg-experience-paged #experience-opening,
body.pg-experience-paged #experience-journey{padding-bottom:88px}
body.pg-experience-paged .experience-stop-map a{cursor:pointer}
body.pg-experience-paged .experience-stop{margin-bottom:0}
body.pg-experience-paged .experience-stop-placard{margin-top:0}
body.pg-experience-paged .experience-journey-section{min-height:calc(100svh - 120px)}
body.pg-experience-paged .experience-welcome-card-v6{margin-bottom:0}

/* ---------- Jingle card overlap correction ---------- */
.jg-feature-composite{min-height:0}
@media(max-width:920px){
  .jg-feature-composite{aspect-ratio:auto!important;grid-template-columns:1fr!important;overflow:visible!important}
  .jg-left-panel{height:auto!important;border-right:0!important;border-bottom:6px solid #8a5b28!important}
  .jg-left-panel audio{margin:6px 0 10px!important}
  .jg-art-panel{height:auto!important;aspect-ratio:3/2!important}
  .jg-art-panel img{height:100%!important;min-height:0!important;object-fit:cover!important}
}
@media(min-width:921px){
  .jg-left-panel{overflow:visible!important}
}

/* ---------- One card/page at a time ---------- */
.pg-single-card-deck{display:block!important}
.pg-single-card-deck > .pg-deck-hidden{display:none!important}
.pg-single-card-deck > .pg-deck-visible{display:block!important}

/* Cookbook: selected page gets book-like width, not a two-column gallery. */
body.pg-cookbook-paged .visual-tour-gallery{display:block!important;max-width:860px;margin:0 auto 90px}
body.pg-cookbook-paged .visual-tour-card{width:min(100%,760px);margin:0 auto!important}
body.pg-cookbook-paged .visual-tour-card .tour-image-button img{width:100%;height:auto;max-height:none;object-fit:contain}

/* Music Room: remove local-QC visual language and show one approved card. */
body.pg-music-paged .qc-gallery{display:block!important;max-width:1260px!important;margin:18px auto 95px!important}
body.pg-music-paged .qc-song-card{margin:0 auto!important}
body.pg-music-paged .qc-review-intro{padding-top:22px}

/* Jingles: only one feature card visible; card itself can grow naturally. */
body.pg-jingles-paged .jg-feature-grid{display:block!important;margin-bottom:95px}
body.pg-jingles-paged .jg-feature-card{margin:0 auto!important;max-width:1260px}

/* Purchase: one bowl choice at a time. */
body.pg-purchase-paged .purchase-option-preview-gallery{padding-bottom:90px}
body.pg-purchase-paged .pg-purchase-deck-page{display:none}
body.pg-purchase-paged .pg-purchase-deck-page.pg-deck-visible{display:block!important}
body.pg-purchase-paged .purchase-tier-image{margin-left:auto;margin-right:auto}

/* Multi-room hubs: selected section only. */
body.pg-section-paged main{min-height:calc(100svh - 110px)}
body.pg-section-paged main > section.pg-deck-visible{display:block!important;padding-bottom:90px}
body.pg-section-paged main > section.pg-deck-hidden{display:none!important}
body.pg-section-paged .launch-trust-strip.pg-deck-always{display:block!important}

/* Mission / Start Here inner-page decks. */
.pg-inner-deck-wrap > .pg-deck-hidden{display:none!important}
.pg-inner-deck-wrap > .pg-deck-visible{display:block!important}

/* Global responsive safety: images stay inside their own boxes; never overlap neighboring text. */
main img{max-width:100%}
@media(max-width:900px){
  .experience-stop,.experience-welcome-card-v6{overflow:visible!important}
  .experience-stop-media,.experience-welcome-image{min-width:0!important}
  .experience-stop-media img,.experience-welcome-image img{max-width:100%!important;height:auto!important;object-fit:contain!important}
}

/* Page controls now sit below the content rather than on top of it. */
main{scroll-margin-top:70px}
footer{margin-bottom:0}

@media(max-width:620px){
  body.standalone-page,body.home-page.pg-home-paged{padding-bottom:0}
  .pg-room-rail{grid-template-columns:auto minmax(0,1fr) auto;gap:5px;padding:6px 7px;min-height:50px}
  .pg-room-rail a,.pg-room-rail button{min-height:35px;padding:6px 8px;font-size:.75rem}
  .pg-room-rail-title{font-size:.82rem}
  .pg-page-turnbar{grid-template-columns:auto minmax(95px,1fr) auto;width:calc(100% - 12px);margin:12px auto 22px;padding:6px;gap:5px;border-width:2px;border-radius:13px}
  .pg-page-turnbar .pg-turn-menu,.pg-page-turnbar .pg-turn-home{display:none}
  .pg-page-turnbar button{min-height:40px;padding:6px 8px;font-size:.76rem}
  .pg-turn-status strong{font-size:.82rem}.pg-turn-status span{font-size:.68rem}
}

/* Mobile Menu Board: use the existing hotspot labels as readable tiles instead of shrinking the full board to illegibility. */
@media(max-width:620px){
  body.home-page.pg-home-paged[data-pg-home-view="menu"] > #home-menu{padding:6px!important;background:#23150d!important}
  body.home-page.pg-home-paged[data-pg-home-view="menu"] .pg-image-board-shell{
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important;
    max-width:none!important;padding:8px!important;background:#2f1c10!important;box-shadow:none!important;line-height:1.15!important
  }
  body.home-page.pg-home-paged[data-pg-home-view="menu"] .pg-image-board-art,
  body.home-page.pg-home-paged[data-pg-home-view="menu"] .pg-official-chef-cover{display:none!important}
  body.home-page.pg-home-paged[data-pg-home-view="menu"] .pg-board-hotspot{
    position:static!important;left:auto!important;top:auto!important;width:auto!important;height:auto!important;
    display:flex!important;align-items:center!important;justify-content:center!important;min-height:48px!important;padding:6px 7px!important;
    border:2px solid #9a6b31!important;border-radius:8px!important;background:linear-gradient(#f7e3ad,#e9c67e)!important;
    color:#2c1c12!important;text-decoration:none!important;text-align:center!important;line-height:1.08!important;box-shadow:inset 0 0 0 1px #fff0c1!important
  }
  body.home-page.pg-home-paged[data-pg-home-view="menu"] .pg-board-hotspot::after{content:attr(aria-label);font:900 .68rem/1.08 Arial,sans-serif;color:#2d1d12}
  body.home-page.pg-home-paged[data-pg-home-view="menu"] .pg-board-hotspot[data-number]::before{
    content:attr(data-number);display:grid;place-items:center;flex:0 0 23px;width:23px;height:23px;margin-right:5px;border-radius:50%;
    background:#235b3a;color:#fff;font:900 .67rem/1 Arial,sans-serif
  }
  body.home-page.pg-home-paged[data-pg-home-view="menu"] .pg-board-disabled{opacity:.6!important}
}