/* Approved cinematic direction; original navigation styling is preserved. */
.reason-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-template-areas:'portrait heading' 'portrait body';gap:28px clamp(32px,5vw,76px);align-items:start;margin-top:30px}
.reason-portrait{grid-area:portrait;margin:0;overflow:hidden;border-radius:16px;border:1px solid #10b98144;background:#080b0a;align-self:start}
.reason-portrait img{display:block;width:100%;height:auto}
.reason-layout>h2{grid-area:heading;align-self:end;margin-top:20px}
.reason-layout .manifesto-body{grid-area:body;display:block;max-width:none;margin:0}
.reason-layout .manifesto-body>p{margin:0 0 28px}
@media(max-width:800px){.reason-layout{grid-template-columns:minmax(0,1fr);grid-template-areas:'heading' 'portrait' 'body';gap:28px;margin-top:24px}.reason-layout>h2{margin:0}.reason-portrait{width:100%;max-width:520px}.reason-layout .manifesto-body{margin:0}}
:root{--accent:#10b981;--paper:#f3f3ef;--bg:#080a09;--line:#244037;--muted:#b9c3be;--metal-sheet-height:1700px}
body{background:var(--bg);color:var(--paper)}
.approved-mobile-art,.approved-mobile-listen{display:none}
.cinematic-hero{position:relative;isolation:isolate;min-height:780px;height:min(920px,70vw);background:#080b0a;overflow:hidden}
.cinematic-photo{position:absolute;inset:0;z-index:-2;display:block}
.cinematic-photo img{width:100%;height:100%;object-fit:contain;object-position:left bottom;display:block}
.cinematic-hero::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,transparent 35%,#080b0a66 48%,#080b0af2 68%),linear-gradient(0deg,#080b0a,transparent 15%)}
.cinematic-hero::after{content:'';position:absolute;inset:0 0 0 auto;width:9px;background:#0da776 url('assets/metal-scratches.webp') center/cover;opacity:.8;pointer-events:none}
.cinematic-copy{position:relative;width:49%;margin-left:48%;padding:clamp(70px,7vw,115px) 3% 80px;text-align:center}
.cinematic-copy h1{margin:0 0 35px;display:flex;flex-direction:column;gap:3px;line-height:.96;font-family:Impact,'Archivo Black',sans-serif;font-size:clamp(88px,10vw,150px);font-weight:900;letter-spacing:-.035em}
.cinematic-wordmark{display:block;width:100%;height:auto;max-width:470px;margin:auto;font-family:'Archivo Black',sans-serif;font-weight:400;letter-spacing:0;overflow:visible}
.cinematic-name{display:block;background-image:linear-gradient(#fafaf8,#d8dfdb),url('assets/metal-scratches.webp');background-blend-mode:multiply;background-size:100% 100%;background-clip:text;-webkit-background-clip:text;color:transparent}
.name-green{background-image:linear-gradient(#1fcea2,#07996f),url('assets/metal-scratches.webp');font-size:1.4em;line-height:.85;letter-spacing:.015em}
.cinematic-signature{font-size:clamp(14px,1.5vw,19px);letter-spacing:.24em;line-height:1.7;margin:0}
.cinematic-rule{display:block;width:58px;height:1px;background:var(--accent);margin:25px auto}
.cinematic-genre{font-size:16px;line-height:1.6;color:#dae0dc;margin:0 0 36px}
.button{clip-path:none;border-radius:18px;border:1px solid #10b981b3;background:linear-gradient(#15b98620,#10b98108);color:var(--paper);text-shadow:none;box-shadow:none;padding:16px 24px;font-size:14px;letter-spacing:.08em;transition:background .2s,border-color .2s}
.button:hover{background:#10b9812b;border-color:#29dba7;filter:none}
.cinematic-cta{width:100%;max-width:390px;min-height:58px;font-size:17px;letter-spacing:.18em;border:2px solid var(--accent);border-radius:20px;background:#050b0880}
.ticker{background:#09100d!important;background-image:linear-gradient(90deg,#080b0af2,#101d18dc),url('assets/metal-scratches.webp')!important;color:var(--paper);padding:25px 5%;border-block:1px solid #10b98170;text-shadow:none!important;font-size:clamp(18px,3vw,34px);letter-spacing:.025em}
.ticker i{color:var(--accent)}
.section{padding:90px 7%;border-bottom:1px solid #10b98126;background:#0b0f0d}
.section::after{opacity:.035}
.music,.history{background:#090d0b}
.manifesto,.production,.merch{background:#0e1411;border-top:0}
.section h2{color:var(--paper);letter-spacing:-.045em;font-family:Impact,'Archivo Black',sans-serif;font-size:clamp(48px,6vw,82px);line-height:1.04}
.section-heading{gap:45px;margin:30px 0 48px}
.section-heading p,.manifesto-body>p,.milestones p,.production-services p{color:var(--muted);line-height:1.8;font-size:16px}
.eyebrow{color:var(--accent);font-size:14px;letter-spacing:.13em}
.section-top>span{font-size:12px}
.album{border-radius:20px;background:#101a15;border:1px solid #10b98144;padding:12px;overflow:hidden}
.album img{border-radius:12px;filter:none}
.album>div{padding:20px 6px 12px}
.track{border-bottom:1px solid #ffffff1c;gap:18px;padding:23px 10px;border-radius:8px}
.track:hover,.track[aria-pressed=true]{background:#10b9810d}
.track strong{font-size:24px}
.catalog-link{color:var(--paper)}
.manifesto h2 em{color:var(--accent);font-style:normal}
.manifesto blockquote{padding:25px 28px;border-left:2px solid var(--accent);background:#10b98108;border-radius:0 16px 16px 0;font-size:24px}
.milestones{gap:20px}
.milestones>div{padding:25px;border:1px solid #10b98133;border-radius:18px;background:#10b98106}
.milestones strong{color:var(--accent)}
.production-services{gap:24px}
.production-services article{padding:28px;border:1px solid #10b98144;border-radius:20px;background:linear-gradient(145deg,#10b9810d,transparent)}
.production-services h3{color:var(--paper)}
.production-bottom{border-color:#10b98133}
.merch-apparel,.merch-record{padding:20px;border:1px solid #10b98133;border-radius:20px;background:#080e0b}
.merch-apparel>img,.merch-record>a>img{border:0;border-radius:12px}
.merch-note{font-size:14px}
footer{background:#080b0a;border-top:1px solid #10b98155;padding:45px 7%}
.nav-drawer{background:#0b100e}
@media(max-width:800px){
 .cinematic-hero{height:auto;min-height:calc(100vw * 1.69);aspect-ratio:941 / 1596}
 .cinematic-photo img{object-fit:cover;object-position:center}
 .cinematic-hero::before{background:linear-gradient(90deg,transparent 40%,#050a0810 48%,#050a0840 100%),linear-gradient(0deg,#080b0a,transparent 12%)}
 .cinematic-copy{width:48%;margin-left:50%;padding:23vw 3% 24vw 0}
 .cinematic-copy h1{font-size:clamp(48px,14.6vw,116px);margin:0 0 18px;line-height:.98;gap:0}
 .name-green{font-size:1.38em;line-height:.85;letter-spacing:-.03em}
 .cinematic-signature{font-size:clamp(12px,2.7vw,19px);letter-spacing:.18em;line-height:1.6}
 .cinematic-rule{margin:18px auto;width:32px}
 .cinematic-genre{font-size:clamp(12px,2.65vw,17px);line-height:1.5;margin-bottom:25px}
 .cinematic-cta{min-height:44px;padding:12px 6px;font-size:clamp(12px,2.8vw,18px);letter-spacing:.1em;border-radius:14px}
 .cinematic-hero::after{width:5px}
 .section{padding:60px 6%}
 .section-top{align-items:flex-start}.section-top>span{max-width:46%;text-align:right;line-height:1.6}
 .section-heading{display:block;margin:24px 0 35px}.section-heading p{margin-top:25px}
 .section h2{font-size:clamp(40px,11vw,64px)}
 .music-grid,.manifesto-body{grid-template-columns:1fr;gap:30px}
 .manifesto-body{margin-top:30px}
 .milestones{grid-template-columns:1fr 1fr;gap:12px}.milestones>div{padding:20px 16px}
 .artists{font-size:19px;gap:8px 12px}
 .production-services{grid-template-columns:1fr;gap:18px}
 .production-services article{padding:25px}
 .merch-grid{grid-template-columns:1fr;gap:25px}.merch-apparel,.merch-record{padding:15px}
 .merch-record{display:block}.merch-record>a:first-child{display:block;max-width:300px;margin:auto}
 .merch-record .merch-caption{margin:20px 0 14px}
 .ticker{gap:12px;font-size:clamp(15px,4.1vw,27px);padding:23px 4%}
 footer{padding:35px 6%;gap:24px;flex-wrap:wrap}
}
@media(max-width:360px){.cinematic-signature{letter-spacing:.12em}.cinematic-genre{font-size:12px}.cinematic-copy{padding-top:19vw}.cinematic-copy h1{margin-bottom:15px}.cinematic-rule{margin:12px auto}.cinematic-genre{margin-bottom:18px}}
@media(prefers-reduced-motion:reduce){.button{transition:none}}
@media(forced-colors:active){.cinematic-name{background:none;color:CanvasText}.cinematic-hero::before,.cinematic-hero::after{display:none}.button{border:2px solid ButtonText}}

/* Fresh source portrait with independent hero lettering and a real CTA. */
@media(max-width:800px){
 .cinematic-hero{height:auto;min-height:0;aspect-ratio:941 / 1550;overflow:hidden}
 .cinematic-photo{display:block}
 .cinematic-photo img{object-fit:cover;object-position:center;transform:translateX(-8%)}
 .cinematic-hero::before{display:block;background:linear-gradient(90deg,transparent 43%,#080b0a20 54%,#080b0a88 100%),linear-gradient(0deg,#080b0a,transparent 10%)}
 .cinematic-copy{position:relative;width:46%;height:auto;margin-left:50%;padding:21vw 0 0;overflow:visible;clip-path:none;white-space:normal}
 .cinematic-copy h1{margin-bottom:3vw}
 .cinematic-wordmark{width:100%;height:auto}
 .cinematic-signature{font-size:2.6vw;letter-spacing:.22em;line-height:1.6}
 .cinematic-rule{margin:3vw auto;width:8vw}
 .cinematic-genre{font-size:2.2vw;line-height:1.5;margin-bottom:6vw;white-space:nowrap}
 .cinematic-copy .cinematic-cta{display:flex;align-items:center;justify-content:center;min-height:9vw;padding:2vw 1vw;font-size:2.6vw;letter-spacing:.18em;border-radius:3vw}
 .cinematic-hero::after{display:block}
}

/* Reuse the exact approved lettering through a CSS crop, preserving its texture. */
.approved-lettering{position:relative;aspect-ratio:435 / 505;overflow:hidden;line-height:0}
.approved-lettering img{position:absolute;width:216.321839%;height:auto;max-width:none;left:-108.045977%;top:-65.346535%;display:block}
@media(max-width:800px){
 .cinematic-copy{padding-top:22.5vw}
 .cinematic-copy h1{margin-bottom:3.4vw}
}

/* Restore the exact emerald border from the approved hero artwork. */
.cinematic-hero::after{display:block;content:'';position:absolute;inset:0 0 0 auto;width:3.1881%;background-image:url('assets/approved-mobile-hero.webp');background-color:transparent;background-size:3136.6667% 107.871%;background-position:right bottom;background-repeat:no-repeat;opacity:1;z-index:3;pointer-events:none}
@media(forced-colors:active){.cinematic-hero::after{display:none}}

/* Manual performance gallery: full compositions, no autoplay. */
.live-photos{margin:0 0 48px;border:1px solid #10b98166;border-radius:18px;overflow:hidden;background:#050706;box-shadow:0 20px 50px #0005}
.live-photos-stage{display:flex;aspect-ratio:1533/1026;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.live-photos-stage::-webkit-scrollbar{display:none}
.live-photos-stage img{flex:0 0 100%;min-width:0;width:100%;height:100%;object-fit:contain;scroll-snap-align:start;scroll-snap-stop:always}
.live-photos-stage:focus-visible{outline:2px solid #10b981;outline-offset:-3px}
.live-photos-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;border-top:1px solid #10b98133}
.live-photos-caption>span{font-size:12px;letter-spacing:.12em;color:#b9c3be}
.live-photo-pages{display:flex;gap:4px}
.live-photo-pages button{min-width:44px;min-height:44px;border:1px solid transparent;border-radius:8px;background:transparent;color:#b9c3be;font:inherit;font-size:14px;cursor:pointer}
.live-photo-pages button[aria-current]{border-color:#10b98188;background:#10b9811a;color:#f3f3ef}
.live-photo-pages button:hover{color:#10b981}
.live-photo-pages button:focus-visible{outline:2px solid #f3f3ef;outline-offset:2px}
@media(max-width:800px){.live-photos{margin-bottom:32px;border-radius:12px}.live-photos-caption{padding:6px 10px}}
