/* glp1radio.com homepage, from the approved "GLP-1 Radio Redesign" artifact (2026-11-05).
   Loaded with pw.css only (the homepage does not load site.css). home.js drives it. */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:400 16px/1.6 var(--display);-webkit-font-smoothing:antialiased;overflow-x:clip}
button{font-family:inherit;cursor:pointer;color:inherit}
h1,h2,h3{margin:0;text-wrap:balance}
p{margin:0}
[hidden]{display:none!important}
.ico-pause{display:none}.is-playing .ico-play{display:none}.is-playing .ico-pause{display:block}

/* hero */
.hero{padding-block:clamp(36px,5vw,64px) clamp(48px,6vw,80px);text-align:center;overflow-x:clip}
html{overflow-x:clip}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--leaf);display:inline-flex;align-items:center;gap:8px}
.live{width:8px;height:8px;border-radius:50%;background:var(--pink);animation:pulse 1.4s infinite}
@keyframes pulse{50%{opacity:.3}}
.hero h1{font-family:var(--title);font-weight:800;font-size:clamp(30px,4vw,54px);line-height:1.02;letter-spacing:-.03em;max-width:900px;margin:14px auto 0}
.hero h1 mark{background:var(--yellow);color:var(--ink);padding:0 .12em;border-radius:6px}
.deck{position:relative;height:clamp(230px,30vw,380px);margin-top:clamp(28px,4vw,44px)}
.showcard{position:absolute;top:0;left:50%;width:clamp(230px,30vw,380px);max-width:100%;aspect-ratio:1;border:0;padding:0;border-radius:20px;overflow:hidden;background:var(--grey);transition:transform .55s cubic-bezier(.22,.8,.2,1),opacity .4s}
.showcard img{width:100%;height:100%;object-fit:cover;display:block}
.showcard.on{box-shadow:0 0 0 4px var(--paper),0 0 0 6px var(--ink),0 30px 60px -24px rgba(0,0,0,.45)}
.np{margin-top:30px;display:flex;flex-direction:column;align-items:center;gap:8px}
.np h2{font-family:var(--title);font-weight:700;font-size:clamp(26px,3vw,38px);letter-spacing:-.02em;line-height:1.1}
.np .host{font-weight:700;color:var(--leaf)}
.np .np-ep{color:var(--muted);max-width:560px;text-decoration:none}
.np a.np-ep[href]:hover{text-decoration:underline}
.live-pill{display:none;align-items:center;gap:8px;margin-top:6px}
.is-od .live-pill{display:inline-flex}
.bar{width:min(520px,100%);margin:18px auto 0}
.track{height:8px;border-radius:999px;background:var(--grey);overflow:hidden}
.track i{display:block;height:100%;width:0;background:var(--ink);border-radius:999px;transition:width .4s linear}
.times{display:flex;justify-content:space-between;gap:12px;font-size:12px;font-weight:600;color:var(--muted);margin-top:8px;font-variant-numeric:tabular-nums;text-align:left}
.times span:last-child{text-align:right}
.controls{display:flex;justify-content:center;align-items:center;gap:18px;margin-top:20px}
.round{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--ink);background:var(--paper);display:flex;align-items:center;justify-content:center;transition:background .2s;padding:0}
.round:hover{background:var(--yellow)}
.play{width:72px;height:72px;border-radius:50%;border:0;background:var(--yellow);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 2px var(--ink);transition:transform .15s;padding:0}
.play:active{transform:scale(.96)}
.desc{max-width:600px;margin:26px auto 0;font-size:18px;color:var(--muted)}

/* where it plays */
.ticker{background:var(--ink);color:#FFFFFF;overflow:hidden;border-block:1px solid var(--ink)}
.ticker .row{display:flex;width:max-content;animation:run 45s linear infinite;padding-block:14px}
.ticker:hover .row{animation-play-state:paused}
.ticker .row>*{display:inline-flex;align-items:center;gap:18px;padding-right:18px;font-weight:600;font-size:15px;white-space:nowrap;color:#FFFFFF;text-decoration:none}
.ticker .row>*::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--yellow)}
.ticker .row a:hover{text-decoration:underline}
.ticker .row i{font-style:normal;font-weight:500;color:#BDBDBD;margin-left:-12px}
.ticker .lead{font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:12px;color:var(--yellow)}
.ticker .lead::after{display:none}
@keyframes run{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ticker .row{animation:none;flex-wrap:wrap;width:auto}.live{animation:none}}

/* sections */
section.block{padding-block:clamp(64px,8vw,104px)}
.head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 40px;margin-bottom:32px}
.head h2,.faq-h{font-family:var(--title);font-weight:700;font-size:clamp(30px,3.6vw,46px);letter-spacing:-.02em;line-height:1.05}
.head p{max-width:440px;color:var(--muted)}
.ep-tools{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.sorts{display:flex;gap:6px}
.sorts button{border:1.5px solid var(--ink);background:var(--paper);border-radius:999px;padding:6px 14px;font-weight:700;font-size:13px}
.sorts button.on{background:var(--ink);color:#FFFFFF}
.arrows{display:flex;gap:6px}.arrows .round{width:38px;height:38px}
.tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px}
.tab{display:flex;align-items:center;gap:10px;border:1.5px solid var(--ink);background:var(--paper);border-radius:999px;padding:5px 16px 5px 5px;font-weight:700;font-size:14px}
.tab img{width:32px;height:32px;border-radius:50%;object-fit:cover}
.tab[aria-selected="true"]{background:var(--ink);color:#FFFFFF}
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(240px,280px);gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;scrollbar-width:thin}
.ep{scroll-snap-align:start;display:flex;flex-direction:column;gap:10px;text-align:left;border:0;background:none;padding:0;min-width:0}
.thumb{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:var(--grey);max-width:100%;display:block}
.thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.thumb.sq img.fg{object-fit:contain}.thumb img.bg{filter:blur(16px);transform:scale(1.3);opacity:.8}
.thumb .go{position:absolute;left:12px;bottom:12px;width:38px;height:38px;border-radius:50%;background:var(--yellow);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1.5px var(--ink)}
.thumb .new{position:absolute;left:12px;top:12px;background:var(--paper);border:1.5px solid var(--ink);border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:2px 9px}
.ep.on .thumb{box-shadow:0 0 0 3px var(--yellow)}
.ep b{font-weight:700;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ep small{color:var(--muted);font-variant-numeric:tabular-nums}

.shows{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:28px}
.show{border:1.5px solid var(--ink);border-radius:20px;overflow:hidden;display:flex;flex-direction:column;background:var(--paper)}
.show .art{display:block;border-bottom:1.5px solid var(--ink)}
.show .art img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
.show .body{padding:20px;display:flex;flex-direction:column;gap:8px;flex:1}
.show h3{font-family:var(--title);font-weight:700;font-size:24px;letter-spacing:-.01em}
.show .host{color:var(--leaf);font-weight:700;font-size:15px}
.show p{color:var(--muted);font-size:15px}
.show .row{margin-top:auto;padding-top:10px;display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.show .pill{padding:8px 14px;font-size:14px}

.about-txt{display:flex;flex-direction:column;gap:14px;max-width:720px;color:var(--muted);font-size:17px}
.about-txt a{color:var(--ink);font-weight:700;text-decoration:none;box-shadow:inset 0 -6px 0 var(--yellow)}

.band{background:var(--ink);color:#FFFFFF}
.band .pw-wrap{display:flex;flex-wrap:wrap;gap:28px 48px;align-items:center;justify-content:space-between;padding-block:clamp(48px,6vw,72px)}
.band h2{font-family:var(--title);font-weight:700;font-size:clamp(28px,3.4vw,42px);line-height:1.1;max-width:620px}
.band h2 em{font-style:italic;color:var(--yellow)}
.band p{color:#D6D6D6;margin-top:12px;max-width:560px}
.band .pill{background:var(--yellow);border-color:var(--yellow);color:var(--ink)}.band .pill:hover{background:#FFFFFF;border-color:#FFFFFF;color:var(--ink)}

.duo{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:24px}
.tile{border-radius:20px;padding:clamp(24px,3vw,36px);display:flex;flex-direction:column;gap:14px;align-items:flex-start;border:1.5px solid var(--ink)}
.tile.a{background:var(--paper)}
.tile.b{background:var(--yellow)}
.tile h3{font-family:var(--title);font-weight:700;font-size:clamp(24px,2.6vw,32px);line-height:1.1}
.tile p{color:var(--muted)}.tile.b p{color:#2A2A2A}
.price{display:flex;gap:10px;flex-wrap:wrap}
.price span{border:1.5px solid var(--ink);border-radius:999px;padding:6px 14px;font-weight:700;font-variant-numeric:tabular-nums}
.price span.best{background:var(--yellow)}

.faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:24px 64px}
@media (max-width:760px){.faq{grid-template-columns:1fr}}
.faq details{border-bottom:1.5px solid var(--ink)}
.faq details:first-child{border-top:1.5px solid var(--ink)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:18px}
.faq summary h3{font-family:var(--title);font-weight:700;font-size:clamp(17px,1.6vw,20px);line-height:1.3}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";width:30px;height:30px;flex-shrink:0;border-radius:50%;background:var(--yellow);display:flex;align-items:center;justify-content:center;font-weight:800;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding-bottom:20px;color:var(--muted);max-width:640px}

/* mini player: ink, short and fat, yellow play, always on screen */
.mini{position:fixed;left:50%;bottom:calc(16px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:30;width:min(400px,calc(100% - 32px));background:var(--ink);color:#FFFFFF;border-radius:18px;padding:12px 12px 12px 14px;display:flex;align-items:center;gap:12px;box-shadow:0 18px 40px -12px rgba(0,0,0,.55)}
.mini img{width:48px;height:48px;border-radius:10px;object-fit:cover;background:#333;flex-shrink:0}
.mini .t{flex:1;min-width:0}
.mini small{display:block;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--yellow)}
.mini b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini .play{width:48px;height:48px;box-shadow:none;flex-shrink:0}