/* Pezzadox — handset refinements (loaded after each page's own styles) */
html{-webkit-text-size-adjust:100%}
img,video{max-width:100%}
@media (max-width:760px){
  .gwrap{grid-template-columns:minmax(0,1fr)!important}
  .gwrap>*{min-width:0;max-width:100%}
  .socrow{flex-wrap:wrap!important;white-space:normal!important;row-gap:10px;overflow:visible!important}
  html[data-page="partnerships"] .grid4{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
}
@media (max-width:620px){
  html[data-page="news"] .grid>*{grid-column:auto!important}
  html[data-page="episodes"] .grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  html[data-page="episodes"] .card>div:last-child{padding:12px 12px 14px!important;gap:6px!important}
  html[data-page="episodes"] .card h2{font-size:13px!important;line-height:1.3!important}
  html[data-page="episodes"] .card .eyebrow{font-size:10px!important}
  html[data-page="episodes"] .card .eyebrow+span{display:none}
  html[data-page="episodes"] .card .topic{font-size:9px!important;padding:3px 6px!important;bottom:8px!important;left:8px!important}
  html[data-page="episodes"] .card .play>span{width:40px!important;height:40px!important}
  html[data-page="episodes"] .card .thumb>span:not(.topic):not(.play){font-size:10px!important;bottom:8px!important;right:8px!important}
}
@media (hover:none){
  .ctab-sum{transform:none!important;opacity:1!important}
}
@media (max-width:760px){
  .ctab{bottom:14px!important}
  .ctab-btn{padding:11px 16px!important;font-size:12px!important;border-radius:14px 0 0 14px!important}
  .cpanel{position:fixed!important;left:12px!important;right:12px!important;bottom:70px!important;top:auto!important;width:auto!important;border-radius:22px!important;border-right:1px solid rgba(255,255,255,0.14)!important;max-height:calc(100vh - 90px);overflow:auto}
  html[data-page="episodes"] .card .thumb>span:not(.topic):not(.play){top:8px!important;bottom:auto!important}
}

/* ---- pass 2: spacing, hero, buttons, galleries ---- */
@media (max-width:620px){
  /* tighter section rhythm on phones */
  section[style*="padding: 96px 16px;"]{padding-top:52px!important;padding-bottom:52px!important}
  section[style*="padding: 96px 16px 24px"]{padding-top:52px!important}
  section[style*="16px 96px"]{padding-bottom:52px!important}
  section[style*="16px 112px"]{padding-bottom:64px!important}
  section[style*="16px 72px"]{padding-bottom:44px!important}
  section[style*="padding: 72px 16px"]{padding-top:40px!important}
  .grid,.grid3,.grid4{gap:14px!important}
  /* home hero: photo on top, copy below */
  html[data-page="index"] #top{padding-top:44vh!important;padding-bottom:40px!important}
  html[data-page="index"] #top .hero-bg img{width:100%!important;height:52vh!important;opacity:1!important;object-position:center 18%!important;-webkit-mask-image:linear-gradient(180deg,#000 55%,rgba(0,0,0,.6) 78%,transparent 100%);mask-image:linear-gradient(180deg,#000 55%,rgba(0,0,0,.6) 78%,transparent 100%)}
  html[data-page="index"] #top .hero-bg .fadeL{bottom:auto;height:52vh;background:linear-gradient(180deg,rgba(7,6,15,.55) 0%,rgba(7,6,15,0) 25%)!important}
  html[data-page="index"] #top .hero-bg .fadeB{display:none}
  html[data-page="index"] #top h1{font-size:46px!important}
  html[data-page="index"] #top .sigimg{height:62px!important}
  /* stats: three across */
  html[data-page="index"] #top div[style*="gap: 20px 28px"]{gap:10px!important;justify-content:space-between}
  html[data-page="index"] #top div[style*="gap: 20px 28px"]{row-gap:14px!important}
  html[data-page="index"] #top div[style*="gap: 20px 28px"]>div{flex:1 1 30%;min-width:0}
  html[data-page="index"] #top div[style*="gap: 20px 28px"] span[style*="26px"]{font-size:22px!important}
  html[data-page="index"] #top div[style*="gap: 20px 28px"] span[style*="0.14em"]{font-size:10px!important;letter-spacing:.08em!important}
  /* full-width tap targets for hero CTAs on every page */
  section:first-of-type .btn-primary,section:first-of-type .btn-ghost{width:100%;justify-content:center;box-sizing:border-box}
  section:first-of-type div[style*="gap: 14px"]{flex-direction:column}
  /* home: recent drops two-up like the episodes page */
  html[data-page="index"] .grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  html[data-page="index"] .card>div:last-child{padding:12px 12px 14px!important;gap:6px!important}
  html[data-page="index"] .card h2,html[data-page="index"] .card h3{font-size:13px!important;line-height:1.3!important}
  html[data-page="index"] .card .eyebrow{font-size:10px!important}
  html[data-page="index"] .card .eyebrow+span{display:none}
  html[data-page="index"] .card .play>span{width:40px!important;height:40px!important}
  /* book me: gallery two-up squares, hide empty upload slots */
  html[data-page="book-me"] .gal{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-auto-rows:150px!important;gap:10px!important}
  html[data-page="book-me"] .gi.slot{display:none!important}
  html[data-page="book-me"] .gi.wide,html[data-page="book-me"] .gi.big{grid-column:span 2!important}
  /* partnerships stat tiles */
  html[data-page="partnerships"] .grid4>div{padding:16px 14px!important}
  html[data-page="partnerships"] .grid4 p,html[data-page="partnerships"] .grid4 span[style*="font-size: 14px"]{font-size:12px!important;line-height:1.4!important}
  /* larger base copy for small screens */
  p[style*="font-size: 17px"],p[style*="font-size: 18px"]{font-size:16px!important;line-height:1.55!important}
}

/* ---- pass 3: header menus on handsets ---- */
@media (max-width:760px){
  /* Subscribe dropdown: full-width sheet under the header instead of a panel hanging off the button */
  .subpanel{position:fixed!important;left:12px!important;right:12px!important;top:74px!important;width:auto!important;max-width:none!important;padding:12px!important;border-radius:18px!important}
  .subpanel .hd{color:#FF4FB3!important;font-weight:800!important;letter-spacing:.2em!important}
  .subrow{height:48px!important}
  /* Burger menu: grouped tiles, bold pink section headers */
  .mob{position:fixed!important;left:12px!important;right:12px!important;top:74px!important;width:auto!important;display:grid!important;grid-template-columns:1fr 1fr;gap:6px 8px;padding:12px 12px 14px!important;border-radius:18px!important;max-height:calc(100vh - 90px);overflow:auto}
  .mob .grp{grid-column:1/-1;color:#FF4FB3!important;font-weight:800!important;font-size:11px!important;letter-spacing:.22em!important;padding:12px 6px 4px!important;border-top:1px solid rgba(255,255,255,.08);margin-top:4px}
  .mob .grp:first-child{border-top:0;margin-top:0;padding-top:2px!important}
  .mob a{padding:12px 12px!important;border-radius:12px!important;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07);font-size:14px!important;line-height:1.2}
  .mob a[href="shop.html"],.mob a[href^="mailto"]{grid-column:auto}
}
/* ---- pass 4: sticky header on handsets so the menu is always a tap away ---- */
@media (max-width:760px){
  header{position:fixed!important;top:0;left:0;right:0;z-index:200;padding:12px 16px!important;background:rgba(7,6,15,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.08)}
  header .logo{height:34px!important;width:auto}
  .mob,.subpanel{top:70px!important}
  body{padding-top:70px}
}