/* September 2026 art direction: tactile paper, photographic cutouts and layered light. */
:root{--paper:#f1ede3}
body{background-color:var(--paper)}
body:before{background-image:url('./paper-v7.webp');background-size:760px 760px;opacity:.52;mix-blend-mode:multiply}
body[data-mood=winter]{--paper:#e9e4d8}
.hero{overflow:visible;isolation:isolate}
.hero-copy{z-index:4}
.hero-actions{justify-content:flex-start;gap:22px}
.hero-actions>.whatsapp-link{width:64px;height:64px;margin:0;padding:0;border:0;flex:0 0 64px}
.hero-actions>.whatsapp-link img{width:100%;height:100%;object-fit:contain}
.hero-play{padding-left:22px;border-left:1px solid #27282b25;gap:16px;flex-direction:row-reverse}
.hero-play .play-icon,.hero-play .pause-icon{width:64px;height:64px;flex:0 0 64px}
.hero-play .play-label{font-size:17px;white-space:nowrap}
.intro-active .record-sleeve{animation:none;opacity:1;will-change:transform;z-index:3}
.intro-pending .record-sleeve{opacity:1;will-change:transform}
.intro-active .vinyl{animation:none}
.record-sleeve{contain:layout style;backface-visibility:hidden}
/* Portraits share one image with their profile. The lower paper edge occludes the cutout. */
.onair-person{gap:22px;max-width:660px;align-items:center;border-top:0;padding-top:7px}
.onair-person .portrait{position:relative;isolation:isolate;width:208px;height:240px;flex:0 0 208px;background:transparent;overflow:visible;border-radius:0;box-shadow:none}
.portrait:not(.is-logo):before{content:'';position:absolute;inset:34% 6% 2%;background:#4a453d;border-radius:50%;box-shadow:inset 0 15px 18px #000b;z-index:-1}
.onair-person .portrait:not(.is-logo) img{width:100%;height:100%;object-fit:contain;object-position:center bottom;padding:0;border-radius:0;filter:drop-shadow(5px 5px 3px #332d252b);position:relative;z-index:1;clip-path:inset(0 0 10% 0)}
.portrait:not(.is-logo):after{content:'';position:absolute;z-index:2;left:-9%;right:-9%;bottom:-4%;height:83%;background:url('./portrait-tear-v7.webp') center bottom/100% 100% no-repeat;pointer-events:none}
.onair-person strong{font-size:clamp(22px,2.1vw,30px);line-height:1.15}
.onair-person [data-onair-name]{font-size:18px}
.person-image,.person-photo{background:transparent;isolation:isolate;box-shadow:none;border-radius:0;position:relative}
.person-image:before,.person-photo:before{content:'';position:absolute;inset:20% 0 0;background:#d9d0bd;border-radius:48% 48% 18px 18px;z-index:-1;box-shadow:inset 0 0 40px #8a7e6220}
.person-image img,.person-photo img{width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(9px 6px 8px #40382b25)}
.person-card .eyebrow{line-height:1.65}
.person-detail .person-photo{aspect-ratio:4/5;overflow:hidden}
/* Stop the former flat yellow glow. Light now belongs to the photographed assets. */
body[data-mood] .mood-atmosphere:before{display:none}
.paper-season-hero{filter:drop-shadow(0 13px 9px #3f342b30);z-index:5;animation:paperSeasonReveal .8s ease both}
body[data-mood=winter] .paper-season-hero{width:155%;max-width:none;right:-11%;top:-23%;bottom:auto;filter:drop-shadow(0 12px 10px #18241940);transform:none}
body[data-mood=winter] .paper-season-footer{width:360px;right:-15px;bottom:-16px;transform:rotate(180deg);filter:drop-shadow(0 7px 7px #17231935)}
body[data-mood=summer] .paper-season-hero{width:87%;right:-12%;bottom:-28%}
.paper-season-footer{filter:drop-shadow(0 7px 6px #3f342b20)}
.hero-weather{position:absolute;width:240px;height:240px;bottom:-94px;right:-35px;z-index:5;display:block;isolation:isolate;outline-offset:-25px}
.weather-scene{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.weather-scene img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 14px 8px #80705b25);animation:weatherDrift 7s ease-in-out infinite alternate}
.weather-city{position:absolute;bottom:15px;left:10%;right:10%;text-align:center;font:550 11px/1.5 Inter,Arial,sans-serif;letter-spacing:.06em;color:#655f54}
@keyframes weatherDrift{from{transform:translateY(0) rotate(-1deg)}to{transform:translateY(-6px) rotate(1deg)}}
@media(max-width:1100px) and (min-width:801px){.onair-person .portrait{width:166px;flex-basis:166px;height:202px}.onair-person{gap:16px}.hero-weather{width:190px;height:190px;bottom:-75px}.onair-person [data-onair-name]{font-size:16px}}
@media(max-width:800px){.hero-actions{justify-content:center;gap:19px}.hero-play{padding-left:19px}.hero-actions>.whatsapp-link,.hero-play .play-icon,.hero-play .pause-icon{width:58px;height:58px;flex-basis:58px}.hero h1{z-index:6}.hero-deck{margin-bottom:48px}.hero-weather{width:180px;height:180px;right:-23px;bottom:-84px}.weather-city{bottom:5px}.onair-person .portrait{width:170px;height:215px;flex-basis:170px}.onair-person{gap:19px;width:100%;max-width:470px}.onair-person strong{font-size:25px}.onair-person .eyebrow{font-size:10px}body[data-mood=winter] .paper-season-hero{width:147%;right:-8%;top:-21%}body[data-mood=summer] .paper-season-hero{width:84%;right:-9%;bottom:-26%}.hero{padding-bottom:45px}.hero-actions{position:relative;z-index:7}}
@media(max-width:430px){.onair-person .portrait{width:137px;flex-basis:137px;height:181px}.onair-person{gap:15px}.onair-person strong{font-size:22px}.onair-person [data-onair-name]{font-size:16px}.hero-play .play-label{font-size:15px}.onair-person .person-arrow{display:none}.hero-weather{width:160px;height:160px;right:-13px;bottom:-72px}}
@media(prefers-reduced-motion:reduce){.weather-scene img{animation:none}.record-sleeve{display:none!important}}
.onair-person .portrait:not(.is-logo){background:radial-gradient(ellipse 44% 33% at 50% 66%,#474038 95%,transparent 100%)}
.portrait:not(.is-logo):before{inset:auto -9% -4%;height:83%;border-radius:0;background:url('./portrait-tear-v7.webp') center bottom/100% 100% no-repeat;box-shadow:none;z-index:0}
.portrait:not(.is-logo):after{clip-path:inset(69% 0 0)}
body[data-mood=winter] .paper-season-hero{right:-23%;width:145%}
@media(max-width:800px){body[data-mood=winter] .hero-deck{margin-top:37px}body[data-mood=winter] .paper-season-hero{width:127%;right:-15%;top:-21%}}

/* v8: all cutout bases stay inside the tear, behind the front paper lip. */
.onair-person .portrait:not(.is-music) img{width:84%;left:8%;clip-path:polygon(0 0,100% 0,100% 52%,92% 66%,77% 75%,60% 79%,40% 79%,23% 75%,8% 66%,0 52%);object-fit:contain;object-position:center bottom}
.onair-person .portrait:not(.is-music):after{clip-path:inset(65% 0 0)}
.onair-person .portrait.is-music{background:none}
.onair-person .portrait.is-music:before,.onair-person .portrait.is-music:after{display:none}
.onair-person .portrait.is-music img{width:100%;height:100%;left:0;object-fit:contain;padding:0;clip-path:none;border-radius:0;filter:drop-shadow(0 5px 4px #453a291c)}
.weather-city{font-size:13px;font-weight:650;line-height:1.4;letter-spacing:.015em;color:#463e32;bottom:2px;text-shadow:0 1px 2px var(--paper),0 0 8px var(--paper)}
@media(max-width:800px){body[data-mood=normal] .hero-deck{margin-bottom:96px}.hero-weather{bottom:-84px}.weather-city{bottom:-2px;font-size:13px}.hero-actions{margin-top:9px}}
@media(max-width:430px){.hero-weather{bottom:-78px}.weather-city{bottom:-6px}.onair-person .portrait{width:150px;flex-basis:150px;height:190px}.onair-person strong{font-size:21px}}

/* Equal facial scale, square editorial crops. Source portraits remain uncropped in Media. */
.person-image,.person-detail .person-photo{aspect-ratio:1;overflow:hidden}
.person-image img,.person-detail .person-photo img{height:auto;min-height:100%;width:100%;aspect-ratio:4/5;object-fit:contain;object-position:center top;display:block}
.person-image:before,.person-photo:before{border-radius:46% 46% 20px 20px}