:root{--ink:#112b39;--ink-soft:#35505e;--blue:#6d9eb6;--sky:#d9eaf0;--sand:#f5ede2;--warm:#dcab7c;--white:#fffdf9;--green:#b6f1c7;--line:rgba(17,43,57,.17)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--sand);color:var(--ink);font-family:"DM Sans",Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{display:block;max-width:100%}
svg{display:block;width:100%;height:100%}
.wrap{width:min(100% - 88px,1390px);margin-inline:auto}
.skip-link{position:absolute;z-index:20;top:8px;left:8px;padding:12px 16px;background:#fff;color:#111;transform:translateY(-160%)}
.skip-link:focus{transform:none}
:focus-visible{outline:3px solid #e88549;outline-offset:4px}
.hero{position:relative;display:flex;flex-direction:column;min-height:100svh;overflow:hidden;isolation:isolate;background:linear-gradient(180deg,#dcecf0 0%,#c3dee6 42%,#b8d1d6 68%,#e2d1ba 100%)}
.hero::before{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(ellipse 30% 28% at 73% 32%,rgba(255,239,205,.82),transparent 72%),radial-gradient(ellipse 25% 21% at 18% 72%,rgba(255,248,222,.54),transparent 80%),linear-gradient(110deg,transparent 42%,rgba(255,255,255,.16) 52%,transparent 64%);pointer-events:none}
.hero::after{content:"";position:absolute;z-index:-1;bottom:0;left:0;right:0;height:22%;background:linear-gradient(180deg,transparent,rgba(40,68,68,.12));pointer-events:none}
.hero-sky{position:absolute;z-index:-1;inset:-12%;background:radial-gradient(ellipse 24% 7% at 27% 23%,rgba(255,255,255,.63),transparent 75%),radial-gradient(ellipse 31% 8% at 70% 18%,rgba(255,255,255,.57),transparent 72%),radial-gradient(ellipse 26% 5% at 55% 55%,rgba(255,255,255,.27),transparent 75%);filter:blur(12px);animation:cloud-drift 21s ease-in-out infinite alternate;pointer-events:none}
.hero-sun{position:absolute;z-index:-1;width:43vw;height:43vw;max-width:650px;max-height:650px;right:-6%;top:-5%;border-radius:50%;background:radial-gradient(circle,rgba(255,227,174,.7),rgba(255,219,166,.16) 42%,transparent 70%);filter:blur(15px);animation:sun-breathe 8s ease-in-out infinite alternate;pointer-events:none}
.hero-road{position:absolute;z-index:-1;bottom:-20%;right:-14%;width:68%;height:32%;background:linear-gradient(120deg,transparent 0 35%,rgba(46,72,77,.11) 35.4% 35.7%,transparent 36%),linear-gradient(65deg,transparent 0 64%,rgba(46,72,77,.1) 64.4% 64.7%,transparent 65%);transform:perspective(500px) rotateX(51deg);opacity:.6;pointer-events:none}
.site-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:29px;position:relative;z-index:3}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-size:.67rem;font-weight:800;letter-spacing:.19em;white-space:nowrap}
.brand-mark{width:32px;height:32px;display:grid;place-items:center;border:1.5px solid currentColor;border-radius:50%;font-size:.62rem;letter-spacing:-.08em}
.header-note{font-size:.58rem;font-weight:800;letter-spacing:.2em;color:rgba(17,43,57,.65)}
.header-note span{padding-inline:9px;color:#d1875e}
.hero-shell{position:relative;z-index:2;flex:1;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);grid-template-areas:"copy visual" "actions visual";align-items:center;align-content:center;column-gap:clamp(36px,6vw,110px);row-gap:19px;padding-block:10px 18px}
.hero-copy{grid-area:copy;align-self:end;padding-top:10px}
.eyebrow,.section-kicker{font-size:.66rem;letter-spacing:.22em;font-weight:800;text-transform:uppercase}
.eyebrow{display:flex;align-items:center;gap:13px;color:#395f70;margin:0 0 22px}
.eyebrow-rule{height:1px;width:34px;background:#a76342}
.eyebrow-dot{color:#bf6e44}
h1,h2,p,figure{margin-top:0}
h1,h2{font-family:"Fraunces",Georgia,serif;font-weight:600;letter-spacing:-.065em}
.hero h1{font-family:"DM Sans",Arial,sans-serif;font-weight:800;letter-spacing:-.075em;font-size:clamp(4.65rem,8.4vw,9.5rem);line-height:.92;margin:0 0 27px;max-width:9ch}
.hero h1 em,.story h2 em,.video-copy h2 em,.artist-copy h2 em,.closing h2 em{font-weight:500;color:#a75f42}
.hero h1 em{font-style:normal;font-weight:800}
.hero-lead{font-size:clamp(1.12rem,1.5vw,1.42rem);line-height:1.55;color:#2f4b55;max-width:490px;margin-bottom:24px;font-weight:500}
.hero-micro{font-size:.61rem;font-weight:800;letter-spacing:.19em;color:#608091;margin-bottom:0}
.hero-micro span{padding-inline:10px;color:#bd7c54}
.hero-visual{grid-area:visual;position:relative;display:grid;place-items:center;align-self:center;min-height:0;padding:12px}
.cover-orbit{position:absolute;left:50%;top:50%;width:min(44vw,690px);aspect-ratio:1;border:1px solid rgba(17,43,57,.13);border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}
.orbit-two{width:min(53vw,800px);border-color:rgba(17,43,57,.075)}
.cover-frame{position:relative;width:min(100%,440px);margin:0;filter:drop-shadow(0 30px 40px rgba(20,50,59,.24));animation:cover-rise 1.2s cubic-bezier(.2,.8,.2,1) both}
.cover-frame::before{content:"";position:absolute;inset:-11px;border:1px solid rgba(255,255,255,.68);pointer-events:none}
.cover-frame img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;box-shadow:0 0 0 8px rgba(255,255,255,.15)}
.cover-frame figcaption{position:absolute;top:calc(100% + 21px);left:0;right:0;text-align:center;font-size:.55rem;font-weight:800;letter-spacing:.25em;color:#496876}
.hero-actions{grid-area:actions;align-self:start;max-width:490px}
.spotify-cta{position:relative;display:flex;align-items:center;gap:15px;min-height:96px;padding:17px 19px 17px 22px;overflow:hidden;border:1px solid rgba(255,255,255,.22);border-radius:21px;background:linear-gradient(110deg,#173b35,#163e37 42%,#206650 100%);box-shadow:0 16px 35px rgba(20,72,64,.25),inset 0 1px 0 rgba(255,255,255,.13);color:#fff;text-decoration:none;transform:translateZ(0);transition:transform .35s ease,box-shadow .35s ease,background .35s ease}
.spotify-cta:hover{transform:translateY(-5px);box-shadow:0 24px 46px rgba(20,72,64,.32),0 0 0 5px rgba(27,131,80,.1)}
.spotify-cta:active{transform:translateY(-1px) scale(.99)}
.cta-shine{position:absolute;inset:-70% auto -70% -55%;width:40%;transform:rotate(22deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.19),transparent);animation:shine 5.4s ease-in-out infinite;pointer-events:none}
.spotify-glyph{position:relative;flex:0 0 34px;width:34px;height:34px;color:var(--green)}
.cta-text{position:relative;display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.cta-text small{font-size:.59rem;font-weight:800;letter-spacing:.18em;color:rgba(229,255,235,.76)}
.cta-text strong{font-size:clamp(1.15rem,1.6vw,1.45rem);letter-spacing:-.035em}
.cta-arrow{position:relative;display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;border-radius:50%;background:rgba(255,255,255,.16);font-size:1.25rem;transition:transform .35s ease,background .35s ease}
.spotify-cta:hover .cta-arrow{transform:translate(2px,-2px);background:rgba(255,255,255,.25)}
.other-platforms{display:flex;align-items:center;flex-wrap:wrap;gap:11px 19px;margin-top:19px;color:#486371}
.other-platforms span{font-size:.55rem;font-weight:800;letter-spacing:.2em}
.other-platforms a{font-size:.76rem;font-weight:700;text-underline-offset:4px;text-decoration-color:rgba(17,43,57,.33);transition:color .2s ease}
.other-platforms a:hover{color:#a75f42}
.hero-release{font-size:.58rem;font-weight:800;letter-spacing:.17em;color:#64808c;margin:22px 0 0}
.hero-release span{padding-inline:8px;color:#b67c5c}
.hero-bottom{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:63px;border-top:1px solid rgba(17,43,57,.19);font-size:.54rem;font-weight:800;letter-spacing:.18em;color:#54737f}
.hero-bottom a{text-decoration:none;color:#214757;transition:transform .25s ease}
.hero-bottom a:hover{transform:translateY(3px)}
.hero-bottom a span{margin-left:8px;font-size:1rem}
.story{padding-block:clamp(90px,10vw,158px) clamp(100px,10vw,170px);background:#f8f4ed}
.story-layout{display:grid;grid-template-columns:180px minmax(0,800px);gap:clamp(35px,7vw,135px);justify-content:center}
.story-rail{padding-top:12px;color:#896a57;font-size:.58rem;letter-spacing:.19em;font-weight:800;line-height:1.9}
.story-rail span{white-space:nowrap}
.rail-line{height:160px;width:1px;margin:37px 0 33px 2px;background:linear-gradient(#b3a495,transparent)}
.story-rail p{font-size:.57rem;line-height:2;letter-spacing:.18em}
.section-kicker{color:#a66242;margin:0 0 22px}
.story h2,.video-copy h2,.artist-copy h2,.closing h2{font-size:clamp(3.2rem,5.2vw,6rem);line-height:.98;margin:0 0 38px}
.story-body>p:not(.section-kicker){max-width:720px;font-size:1.02rem;line-height:1.9;color:#344c51;margin-bottom:23px}
.story-body>p.intro{font-size:1.22rem;line-height:1.72;color:#1b3943;margin-bottom:31px}
.story-body strong{font-weight:800;color:#173947}
blockquote{position:relative;margin:45px 0 43px;padding:25px 0 25px 31px;border-left:3px solid #b36c49;color:#234554}
blockquote p{font-family:"Fraunces",Georgia,serif;font-size:clamp(1.55rem,2.5vw,2.3rem);line-height:1.42;letter-spacing:-.035em;margin-bottom:14px}
blockquote cite{font-size:.65rem;font-weight:800;letter-spacing:.15em;font-style:normal;color:#a66242;text-transform:uppercase}
.story-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:45px 0 30px;padding-block:24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.story-facts div{display:flex;flex-direction:column;gap:8px}
.story-facts span{font-size:.55rem;letter-spacing:.17em;font-weight:800;color:#9e6d55}
.story-facts strong{font-size:.84rem}
.source-link{font-size:.73rem;font-weight:800;letter-spacing:.03em;text-underline-offset:5px;color:#456a77}
.video-section{background:#132f3c;color:#f8f7f1;padding-block:clamp(75px,9vw,135px);position:relative;overflow:hidden}
.video-section::before{content:"";position:absolute;width:65%;height:130%;right:-15%;top:-40%;background:radial-gradient(ellipse,rgba(110,167,176,.19),transparent 70%);pointer-events:none}
.video-layout{position:relative;display:grid;grid-template-columns:.7fr 1.3fr;align-items:center;gap:clamp(45px,7vw,115px)}
.video-copy h2{font-size:clamp(2.85rem,4.6vw,5.4rem);margin-bottom:23px}
.video-copy h2 em{color:#e6ae7d}
.video-copy p:not(.section-kicker){font-size:1rem;line-height:1.75;color:#cfdee0;max-width:330px}
.video-copy a{display:inline-block;margin-top:22px;padding-bottom:9px;border-bottom:1px solid #b9dace;color:#d2f0e5;text-decoration:none;font-size:.64rem;font-weight:800;letter-spacing:.13em}
.video-copy a span{margin-left:8px}
.video-frame{aspect-ratio:16/9;background:#081820;border:1px solid rgba(255,255,255,.24);padding:8px;box-shadow:0 30px 55px rgba(0,0,0,.25)}
.video-frame iframe{display:block;width:100%;height:100%;border:0}
.artist-section{padding-block:clamp(90px,10vw,160px);background:#dce9e7}
.artist-layout{display:grid;grid-template-columns:.88fr 1.12fr;align-items:center;gap:clamp(45px,8vw,145px);max-width:1190px}
.artist-photo{position:relative;max-width:490px}
.artist-photo::before{content:"";position:absolute;inset:23px -23px -23px 23px;border:1px solid rgba(17,43,57,.32);pointer-events:none}
.artist-photo img{position:relative;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:center 44%;filter:saturate(.8) contrast(1.04)}
.artist-copy h2{margin-bottom:30px}
.artist-copy>p:not(.section-kicker){max-width:520px;font-size:1.02rem;line-height:1.85;color:#34525b}
.artist-copy a{display:inline-block;margin-top:21px;padding-bottom:11px;border-bottom:1px solid #446e7a;text-decoration:none;font-size:.65rem;font-weight:800;letter-spacing:.11em}
.artist-copy a span{margin-left:8px}
.closing{padding-block:clamp(100px,11vw,170px);background:linear-gradient(150deg,#d8e7e8,#f5eadb 70%);text-align:center}
.closing-inner{display:flex;flex-direction:column;align-items:center}
.closing h2{margin-bottom:25px}
.closing>div>p:not(.section-kicker){max-width:540px;font-size:1rem;line-height:1.75;color:#42606a;margin-bottom:34px}
.closing-cta{width:min(100%,490px);text-align:left}
.site-footer{background:#102a37;color:#d0e2e0}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:22px;min-height:95px}
.footer-inner>span,.footer-inner>a:not(.brand){font-size:.57rem;font-weight:800;letter-spacing:.14em;text-decoration:none}
@keyframes cloud-drift{from{transform:translate3d(-2%,0,0) scale(1)}to{transform:translate3d(3%,1%,0) scale(1.06)}}
@keyframes sun-breathe{from{transform:scale(.96);opacity:.72}to{transform:scale(1.08);opacity:1}}
@keyframes cover-rise{from{opacity:0;transform:translateY(28px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes shine{0%,47%{left:-55%}72%,100%{left:130%}}
@media(max-width:1000px){.wrap{width:min(100% - 52px,850px)}.hero-shell{column-gap:38px}.hero h1{font-size:clamp(4.5rem,9vw,7rem)}.hero-visual{padding:20px}.cover-orbit{width:50vw}.orbit-two{width:60vw}.video-layout{grid-template-columns:1fr;gap:35px}.video-copy p:not(.section-kicker){max-width:600px}.video-frame{max-width:820px;width:100%}}
@media(max-width:720px){.wrap{width:min(100% - 36px,560px)}.hero{min-height:100svh}.site-header{padding-block:21px}.brand{font-size:.58rem}.brand-mark{width:29px;height:29px}.header-note{display:none}.hero-shell{grid-template-columns:1fr;grid-template-areas:"copy" "visual" "actions";justify-items:center;gap:0;padding-block:19px 35px}.hero-copy{text-align:center;align-self:auto;padding-top:0}.eyebrow{justify-content:center;margin-bottom:17px;font-size:.58rem}.eyebrow-rule{width:18px}.hero h1{font-size:clamp(3.4rem,13.5vw,5.8rem);margin-bottom:17px;max-width:none;line-height:.91}.hero-lead{font-size:.99rem;line-height:1.48;max-width:460px;margin:0 auto 0}.hero-micro{display:none}.hero-visual{width:100%;padding:28px 21px 34px}.cover-frame{width:min(66vw,380px);filter:drop-shadow(0 18px 25px rgba(20,50,59,.2));animation:none}.cover-frame::before{inset:-7px}.cover-frame figcaption{display:none}.cover-orbit{width:min(76vw,450px)}.orbit-two{width:min(91vw,540px)}.hero-actions{width:min(100%,490px);text-align:center}.spotify-cta{min-height:78px;border-radius:18px;text-align:left;padding:12px 14px 12px 18px}.spotify-glyph{flex-basis:29px;width:29px;height:29px}.cta-text strong{font-size:1.2rem}.cta-arrow{width:36px;height:36px;flex-basis:36px}.other-platforms{justify-content:center;margin-top:15px}.hero-release{margin:17px 0 0;font-size:.51rem;line-height:1.5}.hero-bottom{min-height:54px;justify-content:center}.hero-bottom>span{display:none}.story{padding-block:77px 91px}.story-layout{display:block}.story-rail{display:none}.story h2,.artist-copy h2,.closing h2{font-size:clamp(2.9rem,9vw,4.6rem);margin-bottom:26px}.story-body>p.intro{font-size:1.08rem}.story-body>p:not(.section-kicker){line-height:1.8}.video-section{padding-block:77px}.video-copy h2{font-size:clamp(2.8rem,9vw,4.4rem)}.artist-section{padding-block:90px}.artist-layout{grid-template-columns:1fr;gap:55px}.artist-photo{width:min(88%,420px);margin-inline:auto}.artist-copy{text-align:left}.closing{padding-block:90px}.footer-inner{flex-wrap:wrap;justify-content:center;padding-block:25px;text-align:center}.footer-inner>span{display:none}}
@media(max-width:430px){.wrap{width:min(100% - 30px,400px)}.hero-shell{padding-top:10px}.hero h1{font-size:clamp(3.25rem,14vw,4.1rem)}.hero-lead{font-size:.91rem}.hero-visual{padding:22px 10px 28px}.cover-frame{width:min(65vw,285px)}.spotify-cta{min-height:74px}.cta-text small{font-size:.51rem}.cta-text strong{font-size:1.12rem}.other-platforms{gap:7px 13px}.other-platforms a{font-size:.69rem}.hero-release{font-size:.47rem;letter-spacing:.11em}.story-facts{grid-template-columns:1fr;gap:17px}.story-facts div{gap:3px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-sky,.hero-sun,.cover-frame,.cta-shine{animation:none!important}.spotify-cta,.cta-arrow,.other-platforms a,.hero-bottom a{transition:none!important}}
