/* SoBe Recordings v5 — SITE-SPEC-v5 "Miami sunshine". Warm white and sand grounds, deep ocean navy
   ink, sunshine #FFB627 for washes and highlights (never under white text), Sun Red for the one main
   action, turquoise/seafoam for secondary accents. Text accents use a deep sea teal so every word
   clears 4.5:1 on the light grounds. Native scrolling (founder law: no hijack). */
/* Self-hosted (SIL Open Font Licence), latin subsets: no third-party render-blocking request. */
@font-face{font-family:'Unbounded';src:url(/assets/fonts/unbounded-latin-var.woff2) format('woff2');font-weight:200 900;font-style:normal;font-display:swap}
@font-face{font-family:'Manrope';src:url(/assets/fonts/manrope-latin-var.woff2) format('woff2');font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url(/assets/fonts/ibm-plex-mono-latin-400.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
:root{
  /* Sun Red is #E8411C in the brand; the action fill is set a shade deeper (#D4381B, 4.8:1 with white text). */
  --ground:#FFFDF8;--surface:#FFF4E3;--sun:#D4381B;--sun-hi:#B92F16;--ray:#0A7482;--sunshine:#FFB627;--sea:#19B5C4;--seafoam:#8EE3D8;--coral:#FF7A6B;--dusk:#163E55;--sand:#FFF4E3;
  --text:#0E2A3B;--text-2:#34505F;--text-3:#556A76;--ink:#0E2A3B;--ink-2:#34505F;--line:rgba(14,42,59,.12);--line-2:rgba(14,42,59,.24);
  --display:'Unbounded',system-ui,sans-serif;--body:'Manrope',system-ui,sans-serif;--mono:'IBM Plex Mono',ui-monospace,monospace;
  --margin:clamp(24px,7vw,120px);--gap:clamp(16px,2vw,32px);--section:clamp(120px,14vw,200px);--ease:cubic-bezier(.2,.7,.1,1);--r:6px;
  --player-h:0px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
html.has-player{--player-h:84px}
body{margin:0;background:var(--ground);color:var(--text);font-family:var(--body);font-size:clamp(18px,1.15vw,20px);line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;padding-bottom:var(--player-h)}
img,video,canvas{display:block;max-width:100%}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:4px}
a:hover{color:var(--ray)}
button{font:inherit;color:inherit}
::selection{background:var(--sunshine);color:var(--ink)}
:focus-visible{outline:2px solid var(--ray);outline-offset:4px;border-radius:2px}
.manifesto :focus-visible,.book-panel :focus-visible{outline-color:var(--ink)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:8px;background:var(--sunshine);color:var(--ink);padding:10px 14px;z-index:200;font-weight:600}
.skip:focus{left:8px}
main{outline:none;display:block}
[hidden]{display:none !important}

/* grid */
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);padding-inline:var(--margin);max-width:1680px;margin-inline:auto}
.grid>*{grid-column:1/-1;min-width:0}

/* type */
h1,h2,h3{margin:0;font-family:var(--display);font-weight:400;letter-spacing:-.035em;line-height:1}
.display{font-size:clamp(3rem,8vw,8.5rem);font-weight:300;letter-spacing:-.05em;line-height:.95}
.display-md{font-size:clamp(2.4rem,5.4vw,5.4rem);font-weight:300;letter-spacing:-.045em;line-height:1}
.display-md a{text-decoration:none}
.display-sm{font-size:clamp(1.6rem,2.8vw,2.6rem);font-weight:400;letter-spacing:-.03em;line-height:1.08}
.eyebrow{font-family:var(--mono);font-size:12px;font-weight:400;letter-spacing:.24em;text-transform:uppercase;color:var(--text-3);margin:0 0 28px}
.eyebrow a{text-decoration:none}
.eyebrow-ray{color:var(--ray)}
.lede{font-size:clamp(1.15rem,1.5vw,1.4rem);line-height:1.55;color:var(--text-2);max-width:36ch;margin:28px 0 0}
.muted{color:var(--text-3)}
.mono{font-family:var(--mono);font-size:13px;letter-spacing:.02em}
.meta{margin:18px 0 6px;color:var(--text-3);text-transform:uppercase;letter-spacing:.18em;font-size:11px}
.arrow{display:inline-block;margin-left:.5em;transition:transform .5s var(--ease)}
a:hover .arrow{transform:translateX(6px)}

/* buttons */
.btn{--mx:0px;--my:0px;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:15px 28px;border-radius:999px;font-family:var(--body);font-weight:600;font-size:16px;letter-spacing:.01em;text-decoration:none;border:1px solid transparent;cursor:pointer;white-space:nowrap;transform:translate(var(--mx),var(--my));transition:transform .5s var(--ease),background-color .3s,color .3s,border-color .3s}
.btn svg{width:15px;height:15px;fill:currentColor}
.btn-sm{min-height:44px;padding:10px 20px;font-size:14.5px}
.btn-lg{min-height:60px;padding:18px 34px;font-size:17px}
.btn-block{width:100%}
.btn-sun{background:var(--sun);color:#fff}
.btn-sun:hover{background:var(--sun-hi);color:#fff}
.btn-ghost,.btn-line,.btn-line-light{background:rgba(255,253,248,.72);border-color:var(--text);color:var(--text);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.btn-ghost:hover,.btn-line:hover,.btn-line-light:hover{background:var(--text);color:#fff;border-color:var(--text)}
.btn-ink{background:var(--ink);color:#fff}
.btn-ink:hover{background:var(--dusk);color:#fff}
.btn:disabled{cursor:not-allowed;opacity:.55}
.actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:44px}
.icon-btn{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:999px;border:1px solid var(--line);background:transparent;cursor:pointer;color:var(--text);transition:background-color .3s,border-color .3s}
.icon-btn:hover{background:rgba(14,42,59,.06);border-color:var(--line-2)}
.icon-btn svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* loader */
.loader{position:fixed;inset:0;z-index:300;background:var(--sand);display:none;place-items:center;transition:opacity .6s var(--ease),visibility .6s}
.show-loader .loader{display:grid}
.loader.out{opacity:0;visibility:hidden}
.loader-film{width:min(42vw,280px);height:auto;aspect-ratio:1}
.loader-mark{position:absolute;width:min(42vw,280px);height:auto;opacity:0;transition:opacity .4s}
.loader.no-film .loader-mark{opacity:1}
.loader.no-film .loader-film{display:none}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:60;transition:background-color .5s var(--ease),border-color .5s;border-bottom:1px solid transparent}
.nav.scrolled,.nav:not(.nav-over){background:rgba(255,253,248,.9);backdrop-filter:saturate(1.2) blur(16px);-webkit-backdrop-filter:saturate(1.2) blur(16px);border-color:var(--line)}
.nav-row{display:flex;align-items:center;gap:28px;min-height:76px;padding-inline:var(--margin);max-width:1680px;margin:0 auto}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;flex:none}
.brand img{width:36px;height:36px}
.brand span{font-family:var(--display);font-weight:400;font-size:15px;letter-spacing:-.01em;white-space:nowrap}
.brand:hover{color:var(--text)}
.nav-links{display:flex;gap:6px;margin-left:auto}
.nav-links a{text-decoration:none;font-size:15px;font-weight:500;padding:10px 14px;color:var(--text-2);transition:color .3s;position:relative}
.nav-links a::after{content:"";position:absolute;left:14px;right:14px;bottom:4px;height:2px;border-radius:2px;background:var(--sunshine);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--text)}
.nav-links a:hover::after,.nav-links a[aria-current="page"]::after{transform:scaleX(1)}
.nav-actions{display:flex;align-items:center;gap:10px}
.menu-btn{display:none}
.cart-btn{position:relative}
.cart-count{position:absolute;top:-4px;right:-4px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:var(--sunshine);color:var(--ink);font-size:11px;font-weight:700;display:grid;place-items:center}
.cart-count[data-zero]{display:none}

/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;isolation:isolate}
.hero-media{position:absolute;inset:0;z-index:-1}
.hero-poster,.hero-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;max-width:none}
.hero-film{opacity:0;transition:opacity 1.4s var(--ease)}
.hero-film.is-live{opacity:1}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,253,248,.75) 0%,rgba(255,253,248,0) 20%,rgba(255,253,248,0) 46%,rgba(255,253,248,.8) 80%,var(--ground) 100%),linear-gradient(90deg,rgba(255,253,248,.9) 0%,rgba(255,253,248,.62) 36%,rgba(255,253,248,0) 64%)}
.grain{position:absolute;inset:-50%;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='.6'/></svg>");opacity:.05;mix-blend-mode:multiply;pointer-events:none}
.hero-inner{padding-block:180px clamp(64px,10vh,120px);width:100%}
.hero-inner>*{grid-column:1/span 10}
.hero-title{font-family:var(--display);font-weight:800;font-size:clamp(4rem,12.5vw,13rem);letter-spacing:-.06em;line-height:.84;margin:0}
.hero-title .line{display:inline-block;overflow:hidden;padding-bottom:.06em;vertical-align:top}
.hero-title .line>span{display:inline-block}
.line-ray{color:var(--sun)}
.hero-sub{font-size:clamp(1.15rem,1.6vw,1.5rem);line-height:1.5;color:var(--text);max-width:34ch;margin:36px 0 0}

/* sections */
.section{padding-block:var(--section);position:relative}
.section-tight{padding-block:clamp(72px,8vw,120px)}
.section-head{margin-bottom:clamp(56px,7vw,96px)}
.sub-head{margin:clamp(80px,9vw,140px) 0 36px}

/* page hero (inner pages) */
.page-hero{position:relative;padding:clamp(180px,22vw,280px) 0 clamp(80px,9vw,140px);overflow:hidden;isolation:isolate;border-bottom:1px solid var(--line)}
.page-hero-img{min-height:min(88svh,920px);display:flex;align-items:flex-end}
.page-hero-media{position:absolute;inset:0;z-index:-1}
.page-hero-media img{width:100%;height:100%;object-fit:cover;max-width:none}
.page-hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,253,248,.92) 0%,rgba(255,253,248,.7) 42%,rgba(255,253,248,.08) 76%),linear-gradient(180deg,rgba(255,253,248,.6) 0%,rgba(255,253,248,0) 22%,rgba(255,253,248,0) 72%,var(--ground) 100%)}
.page-hero:not(.page-hero-img){background:radial-gradient(60% 90% at 90% 0%,rgba(255,182,39,.32),transparent 70%),radial-gradient(40% 70% at 100% 45%,rgba(25,181,196,.16),transparent 70%),linear-gradient(180deg,var(--sand),var(--ground))}
.page-hero-inner{width:100%}
.page-hero-inner>*{grid-column:1/span 10}
.rate-note{color:var(--ray)}

/* covers */
.cover{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:var(--r);background:var(--surface)}
.cover-link{display:block;overflow:hidden;border-radius:var(--r);transition:transform .7s var(--ease),box-shadow .7s var(--ease)}
.cover-link:hover{transform:translateY(-6px);box-shadow:0 40px 80px -40px rgba(14,42,59,.45)}
.cover-play{position:absolute;top:16px;right:16px;width:52px;height:52px;border-radius:999px;border:0;background:rgba(255,253,248,.88);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:grid;place-items:center;cursor:pointer;opacity:0;transform:scale(.9);transition:opacity .4s var(--ease),transform .4s var(--ease),background-color .3s}
.cover-play svg{width:20px;height:20px;fill:var(--text)}
.cover-play:hover{background:var(--sun)}
.cover-play:hover svg,.cover-play-lg svg{fill:#fff}
.cover-play:focus-visible,.product:hover .cover-play,.release-card:hover .cover-play,.now-cover:hover .cover-play,.cover-play-lg{opacity:1;transform:none}
.cover-play-lg{width:84px;height:84px;top:auto;right:auto;left:28px;bottom:28px;background:var(--sun)}
.cover-play-lg svg{width:30px;height:30px}
.cover-play-lg:hover{background:var(--sun-hi)}

/* now playing */
.now-grid{align-items:center;row-gap:56px}
.now-cover{grid-column:1/span 6;position:relative}
.now-copy{grid-column:8/span 5}
.now-meta{margin-top:20px}
.streams{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.stream{padding:10px 18px;border:1px solid var(--line-2);border-radius:999px;text-decoration:none;font-size:15px}

/* manifesto */
.manifesto{background:var(--sand);color:var(--ink);padding-block:clamp(140px,16vw,240px)}
.manifesto-text{margin:0;grid-column:1/span 11;font-family:var(--display);font-weight:300;font-size:clamp(1.9rem,4.2vw,4.4rem);line-height:1.12;letter-spacing:-.035em}
.manifesto-text p{margin:0 0 .35em}
.manifesto .w{transition:color .6s var(--ease)}
/* Unrevealed words stay legible (3.4:1 on Sand, large text); revealed words go full ink. */
.js-motion .manifesto[data-manifesto] .w{color:#6B7F8A}
.js-motion .manifesto[data-manifesto] .w.on{color:var(--ink)}
.manifesto-sign{margin:clamp(56px,7vw,96px) 0 0;font-family:var(--display);font-weight:800;font-size:clamp(1.6rem,2.6vw,2.4rem);letter-spacing:-.04em}
.manifesto-sign span{color:var(--sun)}
.manifesto-short{padding-block:clamp(96px,10vw,160px);background:var(--ink);color:#FFFDF8}
.manifesto-short .manifesto-sign span{color:var(--sunshine)}

/* the house */
.house-list{border-top:1px solid var(--line)}
.house-row{position:relative;display:grid;grid-template-columns:80px minmax(0,1.2fr) minmax(0,1.3fr) auto 40px;gap:var(--gap);align-items:center;padding:clamp(28px,3.2vw,48px) 0;border-bottom:1px solid var(--line);text-decoration:none;transition:padding .6s var(--ease)}
.house-row:hover{color:var(--text);padding-left:12px}
.house-n{color:var(--text-3)}
.house-title{font-family:var(--display);font-weight:300;font-size:clamp(1.8rem,3.4vw,3.4rem);letter-spacing:-.04em;line-height:1}
.house-line{color:var(--text-2)}
.house-line em{font-style:normal;color:var(--text)}
.house-rate{color:var(--ray);white-space:nowrap}
.house-row .arrow{font-size:1.6rem;justify-self:end}
.house-row:hover .arrow{transform:translateX(8px);color:var(--ray)}
.house-media{position:absolute;right:120px;top:50%;width:min(22vw,340px);aspect-ratio:16/10;transform:translateY(-50%) scale(.94);opacity:0;pointer-events:none;overflow:hidden;border-radius:var(--r);transition:opacity .5s var(--ease),transform .7s var(--ease);z-index:2;box-shadow:0 40px 80px -30px rgba(14,42,59,.4)}
.house-media img{width:100%;height:100%;object-fit:cover}
@media (hover:hover) and (min-width:1100px){.house-row:hover .house-media{opacity:1;transform:translateY(-50%) scale(1)}}
@media not all and (hover:hover) and (min-width:1100px){.house-media{display:none}}

/* picture */
.picture{overflow:hidden;isolation:isolate}
.picture-band{position:absolute;inset:0;z-index:-1}
.picture-loop{width:100%;height:100%;object-fit:cover;max-width:none}
.picture-shade{position:absolute;inset:0;background:linear-gradient(180deg,var(--ground) 0%,rgba(255,253,248,.86) 25%,rgba(255,253,248,.92) 75%,var(--ground) 100%)}
.film{margin:0;display:flex;flex-direction:column;gap:16px}
.frame{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r);background:var(--surface)}
.film figcaption{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:baseline}
.yt{position:relative;display:block;overflow:hidden;border-radius:var(--r);background:var(--surface)}
.yt img{transition:transform 1.2s var(--ease),filter .6s}
.yt:hover img{transform:scale(1.02);filter:brightness(1.08)}
.yt-play{position:absolute;left:50%;top:50%;width:96px;height:96px;margin:-48px 0 0 -48px;border-radius:999px;background:var(--sun);display:grid;place-items:center;transition:transform .5s var(--ease),background-color .3s;box-shadow:0 20px 60px -20px rgba(14,42,59,.5)}
.yt-play svg{width:34px;height:34px;fill:#fff;margin-left:4px}
.yt:hover .yt-play{transform:scale(1.08);background:var(--sun-hi)}
.yt iframe,.yt-frame{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:var(--r)}
.picture-feature{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:clamp(48px,6vw,80px);align-items:end}
.picture-feature .film-big{grid-column:1/span 8}
.picture-feature .film:not(.film-big){grid-column:9/span 4}
.film-title{font-family:var(--display);font-weight:400;font-size:1.25rem;letter-spacing:-.02em}
.films-grid{row-gap:clamp(72px,8vw,120px)}
.films-grid .film{grid-column:span 6}
.films-grid .film-big{grid-column:1/-1}

/* store */
.product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(32px,4vw,56px) var(--gap)}
.product{position:relative}
.product-title{font-family:var(--display);font-weight:400;font-size:1.25rem;letter-spacing:-.02em;line-height:1.15}
.product-title a{text-decoration:none}
.product .muted{margin:8px 0 0;font-size:15px}
.product[hidden]{display:none}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:clamp(48px,5vw,72px)}
.filter{min-height:44px;padding:9px 20px;border-radius:999px;border:1px solid var(--line);background:transparent;cursor:pointer;font-weight:500;font-size:15px;color:var(--text-2);transition:all .3s}
.filter:hover{border-color:var(--line-2);color:var(--text)}
.filter[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}

/* label */
.label-grid{align-items:end;row-gap:64px}
.label-copy{grid-column:1/span 6}
.label-covers{grid-column:8/span 5;display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
.coming{margin:0}
.coming figcaption{margin-top:14px;font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.label-covers .coming:nth-child(2){transform:translateY(48px)}

/* newsletter */
.news{border-top:1px solid var(--line)}
.news-glow{background:radial-gradient(50% 120% at 85% 100%,rgba(255,182,39,.3),transparent 70%),radial-gradient(40% 80% at 100% 60%,rgba(25,181,196,.12),transparent 70%)}
.news-grid{align-items:end;row-gap:48px}
.news-copy{grid-column:1/span 6}
.news-form-wrap{grid-column:8/span 5}
.news-form fieldset{border:0;margin:0;padding:0;min-width:0;display:flex;flex-direction:column;gap:16px}
.field-inline{display:flex;gap:8px}
.field-inline input{flex:1;min-width:0;font:inherit;font-size:16px;padding:15px 22px;border-radius:999px;background:#fff;border:1px solid var(--line-2);color:var(--text)}
.field-inline input::placeholder{color:var(--text-3)}
.check{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.55;color:var(--text-3)}
.check input{margin-top:3px;width:18px;height:18px;flex:none;accent-color:var(--sun)}
.form-status{margin:14px 0 0;color:var(--ray);font-size:12.5px}
fieldset[disabled]{opacity:.7}

/* release */
.release-hero{position:relative;padding:clamp(160px,18vw,240px) 0 clamp(80px,9vw,140px);overflow:hidden;isolation:isolate}
.release-bg{position:absolute;inset:-10%;z-index:-1;filter:blur(80px) saturate(1.2);opacity:.45}
.release-bg img{width:100%;height:100%;object-fit:cover;max-width:none}
.release-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,253,248,.35),var(--ground))}
.release-hero-grid{align-items:end;row-gap:56px}
.release-cover{grid-column:1/span 5}
.release-cover .cover{box-shadow:0 60px 120px -50px rgba(14,42,59,.5)}
.release-info{grid-column:7/span 6}
.release-body{row-gap:72px}
.release-tracks{grid-column:1/span 7}
.release-side{grid-column:9/span 4}
.release-tracks .eyebrow,.release-side .eyebrow{margin-bottom:18px}
.release-side .eyebrow:not(:first-child){margin-top:56px}
.release-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(40px,5vw,72px) var(--gap)}
.release-card{position:relative;margin:0}
.release-title{font-family:var(--display);font-weight:400;font-size:1.5rem;letter-spacing:-.025em}
.release-title a{text-decoration:none}
.tracklist{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.track{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(80px,200px) auto;gap:20px;align-items:center;padding:14px 4px;border-bottom:1px solid var(--line);transition:background-color .3s}
.track:hover,.track.is-current{background:rgba(255,182,39,.12)}
.track-play{display:flex;align-items:center;justify-content:center;background:none;border:0;cursor:pointer;width:44px;height:44px;color:var(--text-3);position:relative}
.track-play svg{width:18px;height:18px;fill:var(--sun);position:absolute;opacity:0;transition:opacity .3s}
.track:hover .track-play svg,.track-play:focus-visible svg,.track.is-current .track-play svg{opacity:1}
.track:hover .track-n,.track.is-current .track-n{opacity:0}
.track-meta{display:flex;flex-direction:column;min-width:0}
.track-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.track-credit{font-size:13.5px;color:var(--text-3)}
.track-dur{color:var(--text-3)}
.wave-mini{width:100%;height:34px}
.credits{margin:0;border-top:1px solid var(--line)}
.credits div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--line);font-size:16px}
.credits dt{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-3);padding-top:4px}
.credits dd{margin:0}
.ai-note{margin:24px 0 0;font-size:15px;color:var(--text-3);line-height:1.6}

/* product detail */
.pdp{padding-block:clamp(150px,16vw,220px) clamp(80px,9vw,140px)}
.pdp-grid{align-items:start;row-gap:56px}
.pdp-media{grid-column:1/span 6;position:sticky;top:110px;display:flex;flex-direction:column;gap:18px}
.pdp-info{grid-column:8/span 5}
.pdp-preview{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px;padding:14px 18px;border:1px solid var(--line);border-radius:var(--r)}
.credit-line{margin:20px 0 0;color:var(--ray)}
.tiers{border:0;margin:44px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;min-width:0}
.tiers legend{margin-bottom:18px}
.tier{display:block;cursor:pointer}
.tier input{position:absolute;opacity:0;pointer-events:none}
.tier-body{display:flex;flex-direction:column;gap:6px;padding:20px 22px;border:1px solid var(--line);border-radius:var(--r);transition:border-color .3s,background-color .3s}
.tier:hover .tier-body{border-color:var(--line-2)}
.tier input:checked+.tier-body{border-color:var(--ray);background:rgba(255,182,39,.12)}
.tier input:focus-visible+.tier-body{outline:2px solid var(--ray);outline-offset:4px}
.tier-top{display:flex;justify-content:space-between;gap:16px}
.tier-top b{font-weight:600}
.tier-top .mono{color:var(--ray)}
.tier-incl{font-size:15px;color:var(--text-3)}
.availability{margin:28px 0 0;font-family:var(--display);font-weight:400;font-size:1.25rem;letter-spacing:-.02em;color:var(--ray)}
.specs{margin:48px 0 0;border-top:1px solid var(--line)}
.specs div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--line);font-size:16px}
.specs dt{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-3);padding-top:4px}
.specs dd{margin:0}

/* studio */
.studio-body{row-gap:64px;align-items:start}
.studio-col:nth-child(1){grid-column:1/span 4}
.studio-col:nth-child(2){grid-column:5/span 4}
.studio-media{grid-column:9/span 4}
.studio-media img{border-radius:var(--r);aspect-ratio:4/5;object-fit:cover;width:100%;height:auto}
.included{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.included li{padding:16px 0;border-bottom:1px solid var(--line);color:var(--text-2)}
.steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:28px}
.steps li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px}
.steps .mono{color:var(--ray);padding-top:4px}
.steps p{margin:0;color:var(--text-2)}

/* artists */
.artist-grid{row-gap:clamp(80px,9vw,140px)}
.artist{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:40px;align-items:end}
.artist-photo{grid-column:1/span 5;display:block;overflow:hidden;border-radius:var(--r)}
.artist-photo img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.artist-copy{grid-column:7/span 6}
.session-artists{display:flex;flex-direction:column;gap:20px}
.session-artist{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:var(--gap);align-items:center;text-decoration:none}
.session-artist img{border-radius:var(--r);aspect-ratio:16/9;object-fit:cover;width:100%;height:auto}
.session-artist b{display:block;font-family:var(--display);font-weight:400;font-size:1.6rem;letter-spacing:-.025em}

/* story */
.chapters{row-gap:clamp(120px,14vw,200px)}
.chapter{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:40px;align-items:center}
.chapter-copy{grid-column:1/span 5}
.chapter-media{grid-column:7/span 6;margin:0}
.chapter:nth-child(odd) .chapter-copy{grid-column:8/span 5;order:2}
.chapter:nth-child(odd) .chapter-media{grid-column:1/span 6;order:1}
.chapter-text .chapter-copy,.chapter-text:nth-child(odd) .chapter-copy{grid-column:1/span 8;order:0}
.chapter-media img{width:100%;height:auto;border-radius:var(--r);object-fit:cover;aspect-ratio:4/3}
.chapter-media figcaption{margin-top:12px;font-size:12px}
.chapter-n{color:var(--ray);margin:0 0 20px}

/* v2.1 — what we make */
.make-list{border-top:1px solid var(--line)}
.make-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr) 40px;gap:clamp(24px,4vw,64px);align-items:center;padding:clamp(28px,3vw,44px) 0;border-bottom:1px solid var(--line);text-decoration:none}
.make-row:hover{color:var(--text)}
.make-media{display:block;overflow:hidden;border-radius:var(--r);aspect-ratio:16/10}
.make-media img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.make-row:hover .make-media img{transform:scale(1.04)}
.make-copy{display:flex;flex-direction:column;gap:12px}
.make-n{color:var(--text-3);text-transform:uppercase;letter-spacing:.18em;font-size:11px}
.make-title{font-family:var(--display);font-weight:300;font-size:clamp(2rem,4vw,3.8rem);letter-spacing:-.045em;line-height:1}
.make-line{color:var(--text-2);max-width:40ch}
.make-line em{font-style:normal;color:var(--text)}
.make-rate{color:var(--ray)}
.make-row .arrow{font-size:1.6rem;justify-self:end}
.make-row:hover .arrow{transform:translateX(8px);color:var(--ray)}

/* hear the difference */
.hear{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff;box-shadow:0 30px 80px -50px rgba(14,42,59,.35)}
.hear-tabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));border-bottom:1px solid var(--line)}
.hear-tab{display:flex;flex-direction:column;gap:4px;text-align:left;padding:22px 26px;background:transparent;border:0;border-right:1px solid var(--line);cursor:pointer;min-height:44px}
.hear-tab span:first-child{font-family:var(--display);font-weight:400;font-size:1.2rem;letter-spacing:-.02em}
.hear-tab[aria-selected="true"]{background:rgba(255,182,39,.16);box-shadow:inset 0 -3px 0 var(--sun)}
.hear-panel{padding:clamp(22px,3vw,40px)}
.hear-player{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:20px;align-items:center}
.hear-player .play-btn{width:64px;height:64px;background:var(--sun);color:#fff}
.hear-player .play-btn:hover{background:var(--sun-hi)}
.hear-player .play-btn .i-pause{display:none}
.hear-player.is-playing .play-btn>svg:first-child{display:none}
.hear-player.is-playing .play-btn .i-pause{display:block}
.hear-wave{width:100%;height:84px;cursor:pointer}
.hear-modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:28px}
.hear-mode{cursor:pointer;display:block}
.hear-mode input{position:absolute;opacity:0;pointer-events:none}
.hear-mode>span{display:flex;flex-direction:column;gap:4px;padding:16px 18px;border:1px solid var(--line);border-radius:var(--r);transition:border-color .3s,background-color .3s}
.hear-mode b{font-weight:600}
.hear-mode .muted{font-size:14px}
.hear-mode input:checked+span{border-color:var(--ray);background:rgba(142,227,216,.25)}
.hear-mode input:focus-visible+span{outline:2px solid var(--ray);outline-offset:4px}
.hear-note{margin:22px 0 0;font-size:12px}

/* the work */
.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(40px,5vw,72px) var(--gap)}
.case{display:flex;flex-direction:column;gap:10px;text-decoration:none}
.case:hover{color:var(--text)}
.case-lead{grid-column:span 2;grid-row:span 2}
.case-media{display:block;overflow:hidden;border-radius:var(--r);aspect-ratio:16/10}
.case-lead .case-media{aspect-ratio:auto;flex:1;min-height:320px}
.case-media img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.case:hover .case-media img{transform:scale(1.04)}
.case-roles{color:var(--ray);text-transform:uppercase;letter-spacing:.18em;font-size:11px;margin-top:8px}
.case-title{font-family:var(--display);font-weight:300;font-size:clamp(1.4rem,2.2vw,2rem);letter-spacing:-.03em;line-height:1.05}
.case-lead .case-title{font-size:clamp(2rem,4vw,3.6rem)}
.case-credit{font-size:14.5px}
.grid-inner{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}

/* process */
.process{position:relative}
.process-wave{width:100%;height:120px;display:block;margin-bottom:clamp(32px,4vw,56px)}
.process-wave path{fill:none;stroke:var(--sunshine);stroke-width:2.5;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:var(--draw,0)}
.js-motion .process-wave path{stroke-dashoffset:var(--draw,1)}
.process-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.process-steps li{border-top:1px solid var(--line);padding-top:24px}
.process-steps .mono{color:var(--ray)}
.process-steps h3{margin:14px 0 10px}
.process-steps p{margin:0;color:var(--text-2)}

/* room */
.room-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.room-item{margin:0;overflow:hidden;border-radius:var(--r)}
.room-item img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/2}
.room-item:first-child{grid-column:span 2;grid-row:span 2}
.room-item:first-child img{aspect-ratio:auto;height:100%}

/* field */
.field-wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(24px,4vw,56px);align-items:start}
.field-map{position:relative;aspect-ratio:6/6.5;border:1px solid var(--line);border-radius:var(--r);background:radial-gradient(60% 50% at 20% 15%,rgba(255,182,39,.22),transparent 70%),radial-gradient(50% 40% at 80% 85%,rgba(25,181,196,.22),transparent 70%),#EAF8F5;overflow:hidden}
.field-grid{position:absolute;inset:0;width:100%;height:100%}
.field-route{fill:none;stroke:rgba(10,116,130,.55);stroke-width:1;stroke-dasharray:4 6;vector-effect:non-scaling-stroke}
.field-grid line{stroke:rgba(14,42,59,.08);stroke-width:.2;vector-effect:non-scaling-stroke}
.field-home,.field-pin{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:10px;background:none;border:0;padding:6px;cursor:pointer;color:var(--text);min-height:44px}
.field-home{cursor:default;color:var(--text-2)}
.field-pin .dot,.field-home .dot{width:14px;height:14px;border-radius:50%;background:var(--sun);box-shadow:0 0 0 6px rgba(212,56,27,.18)}
.field-home .dot{background:var(--ink);box-shadow:0 0 0 6px rgba(14,42,59,.12)}
.field-pin.is-playing .dot{animation:ping 1.4s var(--ease) infinite}
.field-pin[aria-pressed="true"] .dot{background:var(--sun)}
.field-pin .mono,.field-home .mono{font-size:12px;white-space:nowrap}
.field-axis{position:absolute;left:16px;bottom:12px;font-size:11px;color:var(--text-3)}
.field-card{margin:0;display:flex;flex-direction:column;gap:16px}
.field-card img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;border-radius:var(--r)}
.field-card figcaption{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.field-place{font-family:var(--display);font-weight:400;font-size:1.5rem;letter-spacing:-.025em}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(212,56,27,.5)}100%{box-shadow:0 0 0 18px rgba(212,56,27,0)}}
.label-small{padding-block:clamp(80px,9vw,140px)}
.hear-section,.field-section,.process-section{background:linear-gradient(180deg,var(--sand),var(--ground))}
/* v5: real room photos are small, in a light frame — never a background */
.room-photos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap);max-width:980px}
.room-photo{margin:0;padding:12px 12px 16px;background:#fff;border-radius:var(--r);box-shadow:0 30px 70px -45px rgba(14,42,59,.4)}
.room-photo img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:4px}
.room-photo figcaption{margin-top:12px;font-size:12px}

/* editorial strip */
.strip{row-gap:var(--gap)}
.strip-item{grid-column:span 4;overflow:hidden;border-radius:var(--r)}
.strip-item img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.strip-item:nth-child(2){transform:translateY(64px)}

/* press / contact / licences / book */
.epk{row-gap:72px}
.epk-copy{grid-column:1/span 6}
.epk-assets{grid-column:8/span 5}
.epk-copy .credits{margin-top:44px}
.epk-assets .eyebrow:not(:first-child){margin-top:56px}
.downloads{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.downloads a{display:flex;justify-content:space-between;padding:16px 0;border-bottom:1px solid var(--line);text-decoration:none}
.press-photos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.press-photos img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:var(--r)}
.contact-grid{row-gap:48px}
.contact-grid>div{grid-column:span 4}
.contact-grid .lede{margin-top:0;max-width:none;word-break:break-word}
.licence-grid{row-gap:0;border-top:1px solid var(--line)}
.licence{grid-column:1/-1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);padding:44px 0;border-bottom:1px solid var(--line);align-items:baseline}
.licence h2{grid-column:1/span 5}
.licence .lede{grid-column:7/span 6;margin:0}
.book-grid{row-gap:56px;align-items:start}
.book-side{grid-column:1/span 4}
.book-panel{grid-column:6/span 7;background:var(--sand);color:var(--ink);border-radius:var(--r);padding:clamp(24px,3vw,44px)}
.book-list{list-style:none;margin:0 0 32px;padding:0;border-top:1px solid var(--line)}
.book-list li{display:flex;flex-direction:column;padding:16px 0;border-bottom:1px solid var(--line)}
.book-list a{font-family:var(--display);font-weight:400;font-size:1.3rem;letter-spacing:-.02em;text-decoration:none}
.notice{margin:0 0 24px;padding:16px 18px;border-radius:var(--r);background:#fff;border-left:3px solid var(--ray);font-size:15px;line-height:1.55}
.notice a{color:var(--sun);font-weight:600}
.book-form fieldset{border:0;margin:0;padding:0;min-width:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:18px}
.field{display:flex;flex-direction:column;gap:8px;font-size:14px;font-weight:600}
.field input,.field select,.field textarea{font:inherit;font-weight:400;font-size:16px;padding:14px;border:1px solid #CDBBA9;border-radius:var(--r);background:#fff;color:var(--ink);width:100%}
.field-wide,.book-form .check,.book-form .btn{grid-column:1/-1}
.book-form .check{color:var(--ink-2)}
.book-form .btn{justify-self:start}
.ghl-embed{display:block;width:100%;min-height:880px;border:0;background:var(--sand)}
.ghl-embed-sm{min-height:240px;background:transparent}

/* footer */
.foot{border-top:1px solid var(--line);padding-block:clamp(80px,9vw,140px) 40px;background:var(--sand)}
.foot-grid{row-gap:56px;align-items:start}
.foot-sign{grid-column:1/span 4}
.foot-sign img{width:96px;height:auto;margin-bottom:24px}
.sign{font-family:var(--display);font-weight:800;font-size:1.6rem;letter-spacing:-.04em;margin:0}
.sign span{color:var(--sun)}
.foot-sign .muted{margin:8px 0 0;font-size:15px}
.foot-nav{grid-column:5/span 5;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px var(--gap)}
.foot-nav a,.foot-contact a{text-decoration:none;color:var(--text-2);font-size:16px;width:fit-content;min-height:24px}
.foot-nav a:hover,.foot-contact a:hover{color:var(--sun)}
.foot-contact{grid-column:10/span 3;display:flex;flex-direction:column;gap:10px}
.foot-email{color:var(--text) !important;word-break:break-all}
.foot-legal{margin:72px auto 0;padding-top:24px;border-top:1px solid var(--line);font-size:13px;color:var(--text-3);display:block}

/* player */
.player{position:fixed;left:0;right:0;bottom:0;z-index:70;background:rgba(255,253,248,.95);box-shadow:0 -20px 50px -40px rgba(14,42,59,.5);backdrop-filter:saturate(1.3) blur(18px);-webkit-backdrop-filter:saturate(1.3) blur(18px);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
.player-row{max-width:1680px;margin:0 auto;padding:12px var(--margin);display:grid;grid-template-columns:minmax(0,280px) auto minmax(0,1fr) auto;gap:24px;align-items:center;min-height:84px}
.player-meta{display:flex;align-items:center;gap:14px;min-width:0}
.player-cover{width:52px;height:52px;border-radius:4px;object-fit:cover;flex:none}
.player-text{display:flex;flex-direction:column;min-width:0}
.player-title{font-weight:600;font-size:15.5px;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.player-credit{font-size:12.5px;color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.player-controls{display:flex;align-items:center;gap:8px}
.play-btn{width:52px;height:52px;border-radius:999px;border:0;background:var(--ink);color:#fff;display:grid;place-items:center;cursor:pointer;flex:none;transition:transform .4s var(--ease),background-color .3s}
.play-btn:hover{transform:scale(1.06);background:var(--sun)}
.play-btn svg{width:20px;height:20px;fill:currentColor}
.play-btn .i-pause,.is-playing .play-btn .i-play{display:none}
.is-playing .play-btn .i-pause{display:block}
.player-wave{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;min-width:0}
.wave-canvas{width:100%;height:40px;cursor:pointer}
.player-time{font-size:12px;color:var(--text-3);min-width:34px}
.player-tools{display:flex;gap:8px}
.queue{max-width:1680px;margin:0 auto;padding:0 var(--margin) 16px}
.queue-head{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--text-3);margin:0 0 8px}
.queue ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:6px}
.queue button{width:100%;text-align:left;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:10px 14px;cursor:pointer;font-size:14px;min-height:44px}
.queue button[aria-current="true"]{border-color:var(--ray);color:var(--ray)}

/* cart (live commerce only) */
.cart{position:fixed;inset:0;z-index:90}
.cart-scrim{position:absolute;inset:0;background:rgba(14,42,59,.4);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.cart-panel{position:absolute;top:0;right:0;bottom:0;width:min(460px,100%);background:var(--surface);border-left:1px solid var(--line);display:flex;flex-direction:column;padding:28px;gap:16px;overflow:auto}
.cart-head{display:flex;justify-content:space-between;align-items:center}
.cart-head h2{font-size:1.6rem;font-weight:300}
.cart-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.cart-item{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:var(--r)}
.cart-item img{width:64px;height:64px;border-radius:4px;object-fit:cover}
.cart-item b{display:block}
.cart-item span{font-size:13.5px;color:var(--text-3)}
.cart-item button{background:none;border:0;color:var(--text-3);cursor:pointer;text-decoration:underline;font-size:13px;min-height:44px}
.cart-empty,.cart-note{color:var(--text-3);font-size:14px;margin:0}
.cart-foot{margin-top:auto;display:flex;flex-direction:column;gap:14px}
.handoff{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.handoff a{display:flex;justify-content:space-between;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);text-decoration:none}
.family-grid{row-gap:48px}
.family-tile{grid-column:span 4;margin:0}

/* motion (all of it respects reduced motion) */
@keyframes drift{from{transform:scale(1.08)}to{transform:scale(1.01)}}
@keyframes rise{from{transform:translateY(108%)}to{transform:none}}
@keyframes fade{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){
  .hero-poster{animation:drift 24s var(--ease) both}
}
/* The headline is the LCP on phones: it rises on desktop only, and paints at once elsewhere. */
@media (prefers-reduced-motion:no-preference) and (min-width:900px){
  .hero-title .line>span{animation:rise 1.2s var(--ease) .15s both}
  .hero-title .line-ray>span{animation-delay:.3s}
}
@media (prefers-reduced-motion:no-preference){
  .js-motion .reveal{opacity:0;transform:translateY(36px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i,0) * 70ms)}
  .js-motion .reveal.in{opacity:1;transform:none}
  .js-motion .reveal .settle{transform:scale(1.04);transition:transform 1.6s var(--ease)}
  .js-motion .reveal.in .settle{transform:none}
  /* v6 sun wipe: the next page opens as a circle of light from where you pressed */
  ::view-transition-old(root){animation:none}
  ::view-transition-new(root){animation:sunwipe .42s cubic-bezier(.16,1,.3,1) both}
  /* mask reveals: pictures wipe up into place as they arrive */
  .js-motion .reveal .settle{clip-path:inset(18% 0 0 0);transition:transform 1.6s var(--ease),clip-path .7s cubic-bezier(.16,1,.3,1)}
  .js-motion .reveal.in .settle{clip-path:inset(0)}
}
@media (prefers-reduced-motion:reduce){
  .loader{display:none !important}
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important}
}

/* responsive */
@media (max-width:1100px){
  .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .release-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .house-row{grid-template-columns:56px minmax(0,1fr) auto 32px;row-gap:10px}
  .house-line{grid-column:2/-1;grid-row:2}
  .house-rate{grid-column:3;grid-row:1}
  .player-row{grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"meta controls tools" "wave wave wave";gap:8px 16px}
  .player-meta{grid-area:meta}.player-controls{grid-area:controls}.player-tools{grid-area:tools}.player-wave{grid-area:wave}
  html.has-player{--player-h:132px}
}
@media (max-width:900px){
  .menu-btn{display:inline-grid}
  .nav-links{position:fixed;top:76px;left:0;right:0;flex-direction:column;gap:0;padding:8px var(--margin) 28px;background:rgba(255,253,248,.98);border-bottom:1px solid var(--line);display:none;margin:0}
  .nav-open .nav-links{display:flex}
  .nav-open .nav{background:rgba(255,253,248,.98)}
  .nav-links a{font-family:var(--display);font-weight:300;font-size:1.8rem;padding:16px 0;border-bottom:1px solid var(--line)}
  .nav-links a::after{display:none}
  .nav-actions{margin-left:auto}
  .now-cover,.now-copy,.label-copy,.label-covers,.news-copy,.news-form-wrap,.release-cover,.release-info,.release-tracks,.release-side,.pdp-media,.pdp-info,.studio-col:nth-child(1),.studio-col:nth-child(2),.studio-media,.epk-copy,.epk-assets,.book-side,.book-panel,.foot-sign,.foot-nav,.foot-contact,.artist-photo,.artist-copy,.chapter-copy,.chapter-media,.chapter:nth-child(odd) .chapter-copy,.chapter:nth-child(odd) .chapter-media,.chapter-text .chapter-copy{grid-column:1/-1;order:0}
  .pdp-media{position:static}
  .release-cover{max-width:460px}
  .films-grid .film,.picture-feature .film-big,.picture-feature .film:not(.film-big){grid-column:1/-1}
  .contact-grid>div{grid-column:1/-1}
  .licence h2,.licence .lede{grid-column:1/-1}
  .licence .lede{margin-top:14px}
  .label-covers .coming:nth-child(2){transform:none}
  .family-tile{grid-column:1/-1}
  .strip-item{grid-column:span 6}
  .make-row{grid-template-columns:minmax(0,1fr) 32px}
  .make-media{grid-column:1/-1}
  .case-grid{grid-template-columns:minmax(0,1fr)}
  .case-lead{grid-column:auto;grid-row:auto}
  .case-lead .case-media{aspect-ratio:16/10;min-height:0}
  .process-steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px}
  .room-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .room-item:first-child{grid-column:1/-1;grid-row:auto}
  .field-wrap{grid-template-columns:minmax(0,1fr)}
  .hear-modes{grid-template-columns:minmax(0,1fr)}
  .strip-item:nth-child(2){transform:none}
  .strip-item:nth-child(3){display:none}
  .hero-inner>*,.page-hero-inner>*{grid-column:1/-1}
}
@media (max-width:640px){
  :root{--margin:20px}
  .nav-row{min-height:64px;gap:12px}
  .nav-links{top:64px}
  .brand span{display:none}
  .nav-actions .btn-sm{padding:9px 16px;font-size:14px}
  .hero-inner{padding-block:140px 56px}
  .hero-shade{background:linear-gradient(180deg,rgba(255,253,248,.7) 0%,rgba(255,253,248,0) 14%,rgba(255,253,248,0) 24%,rgba(255,253,248,.84) 38%,rgba(255,253,248,.92) 62%,var(--ground) 100%)}
  .page-hero-media::after{background:linear-gradient(180deg,rgba(255,253,248,.55) 0%,rgba(255,253,248,.78) 40%,rgba(255,253,248,.9) 75%,var(--ground) 100%)}
  .room-photos{grid-template-columns:minmax(0,1fr)}
  .hero-sub{margin-top:24px}
  .actions{margin-top:32px;gap:10px}
  .btn-lg{min-height:54px;padding:15px 26px;font-size:16px}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 14px}
  .product-title{font-size:1.05rem}
  .cover-play{width:44px;height:44px;top:10px;right:10px;opacity:1;transform:none}
  .cover-play-lg{width:64px;height:64px;left:18px;bottom:18px}
  .yt-play{width:68px;height:68px;margin:-34px 0 0 -34px}
  .release-grid{grid-template-columns:minmax(0,1fr)}
  .track{grid-template-columns:auto minmax(0,1fr) auto;gap:10px}
  .track .wave-mini{display:none}
  .house-row{grid-template-columns:40px minmax(0,1fr) 24px}
  .house-rate{grid-column:2;grid-row:3}
  .house-line{grid-column:2/-1}
  .credits div,.specs div{grid-template-columns:minmax(0,1fr);gap:4px}
  .session-artist{grid-template-columns:minmax(0,1fr)}
  .player-cover{width:44px;height:44px}
  .player-tools .icon-btn,.player-controls .icon-btn{width:40px;height:40px}
  .play-btn{width:46px;height:46px}
  .field-inline{flex-direction:column}
  .process-steps{grid-template-columns:minmax(0,1fr)}
  .hear-player .play-btn{width:52px;height:52px}
  .hear-wave{height:60px}
  .field-pin .mono,.field-home .mono{font-size:11px}
}
@media (max-width:380px){
  .product-grid{grid-template-columns:minmax(0,1fr)}
  .nav-actions{gap:6px}
}

/* ---------------- v6: the signature layer (SITE-SPEC-v6). Everything here is additive: with
   reduced motion, no WebGL or a coarse pointer the page is exactly v5. ---------------- */
@keyframes sunwipe{from{clip-path:circle(0% at var(--wipe-x,50%) var(--wipe-y,30%))}to{clip-path:circle(150% at var(--wipe-x,50%) var(--wipe-y,30%))}}

/* the hero holds (native sticky, nothing hijacked) while the sun sets; reduced motion keeps v5 */
@media (prefers-reduced-motion:no-preference){
  .hero-pin{height:140svh;margin-bottom:-34svh}.hero-pin>.hero{position:sticky;top:0}
  /* the next section slides up over the setting sun: no dead sand between them */
  .hero-pin+*{position:relative;z-index:2;background:var(--ground);border-radius:32px 32px 0 0;box-shadow:0 -40px 80px -50px rgba(14,42,59,.35);padding-top:clamp(40px,5vw,72px)}
}
.make{padding-top:clamp(72px,8vw,120px)}
.hero-inner{transition:opacity .2s linear}
/* the SoBe Sun: canvas and depth layers fade in over the poster, under the warm wash */
.sun-canvas,.sun-layers{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1.2s var(--ease);pointer-events:none}
.sun-canvas.is-live,.sun-layers.is-live{opacity:1}
.sun-live .hero-poster{animation:none}
.sun-layer{position:absolute;bottom:0;will-change:transform}
.sun-layer svg{display:block;width:100%;height:100%}
.sun-palm svg{fill:#0E2A3B;filter:drop-shadow(0 18px 30px rgba(14,42,59,.12))}
.sun-palm-r{right:2%;width:min(30vw,420px);height:92%;opacity:.92}
.sun-palm-b{right:21%;width:min(20vw,280px);height:62%;opacity:.7;filter:blur(.6px)}
.sun-tower{right:7%;width:min(15vw,210px);height:58%}
.sun-tower{filter:blur(.3px)}
.sun-sand{left:-4%;right:-4%;height:20%}
.sun-sand svg{fill:#FFF4E3}
/* with the live scene the wash only guards the type: the right half shows the full colour */
.sun-live .hero-shade{background:linear-gradient(180deg,rgba(255,253,248,.55) 0%,rgba(255,253,248,0) 16%,rgba(255,253,248,0) 70%,var(--ground) 100%),linear-gradient(90deg,rgba(255,253,248,.86) 0%,rgba(255,253,248,.55) 32%,rgba(255,253,248,0) 56%)}
.sun-badge{position:fixed;left:0;top:0;z-index:61;width:36px;height:36px;opacity:0;pointer-events:none;will-change:transform,opacity}
@media (max-width:900px){.sun-palm-r{width:46vw;right:-10%}.sun-palm-b{display:none}.sun-tower{right:30%;width:24vw;height:40%}
  .sun-live .hero-shade{background:linear-gradient(180deg,rgba(255,253,248,.6) 0%,rgba(255,253,248,0) 14%,rgba(255,253,248,0) 26%,rgba(255,253,248,.84) 40%,rgba(255,253,248,.92) 62%,var(--ground) 100%)}}

/* 2.5D cards */
[data-tilt]{position:relative;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.16,1,.3,1);will-change:transform}
[data-tilt].is-tilting{transition:transform .12s linear}
[data-tilt] img{transition:transform .6s cubic-bezier(.16,1,.3,1)}
[data-tilt].is-tilting img{transition:transform .12s linear}
.sheen{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(40% 55% at var(--sx,50%) var(--sy,50%),rgba(255,253,248,.55),rgba(255,182,39,.12) 45%,transparent 70%);mix-blend-mode:soft-light}
[data-tilt].is-tilting .sheen{opacity:1}
.make-row:hover .make-media img{transform:none}

/* the work: muted loops in place, a Play disc riding with the pointer (the system cursor stays) */
.case-media{position:relative}
.case-loop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .4s;z-index:1;border-radius:inherit}
.case.is-playing .case-loop{opacity:1}
.case-play{position:absolute;left:0;top:0;z-index:2;display:none;align-items:center;gap:6px;margin:-26px 0 0 -46px;padding:12px 18px;border-radius:999px;background:var(--sunshine);color:var(--ink);font-weight:600;font-size:14px;pointer-events:none;opacity:0;transition:opacity .25s}
.case-play svg{width:12px;height:12px;fill:currentColor}
@media (hover:hover) and (pointer:fine){.case-play{display:inline-flex}.case:hover .case-play{opacity:1}}

/* the marquee: the one navy band on the home page, leaning with the scroll speed */
.marquee{background:var(--ink);color:#FFFDF8;overflow:hidden;padding:clamp(22px,3vw,36px) 0;transform:skewY(-2deg);margin:clamp(40px,5vw,80px) 0}
.marquee-track{display:flex;width:max-content;gap:3vw;font-family:var(--display);font-weight:800;font-size:clamp(2.4rem,6vw,5.6rem);letter-spacing:-.05em;line-height:1;white-space:nowrap;transform:skewX(var(--lean,0deg));animation:marquee 28s linear infinite}
.marquee-track b{color:var(--sunshine);font-weight:800}
@keyframes marquee{to{translate:-50% 0}}

/* the process lights in sunshine as each step passes */
.process-steps li{transition:border-color .6s var(--ease)}
.process-steps li .mono{display:inline-block;padding:2px 10px;border-radius:999px;transition:background-color .6s var(--ease),color .6s}
.process-steps li.lit{border-top-color:var(--sunshine);border-top-width:2px}
.process-steps li.lit .mono{background:var(--sunshine);color:var(--ink)}

@media (prefers-reduced-motion:reduce){
  .marquee-track{animation:none}
  .sun-canvas,.sun-layers,.sun-badge,.case-loop,.case-play,.sheen{display:none !important}
}

/* v6 pictures (founder 2026-10-17): real work sits in a white frame with generous padding, never as a
   dark full-bleed; the room is the sunlit stills plus an optional mono gear list */
.case-framed{background:#fff;padding:clamp(10px,1.4vw,18px);border:1px solid var(--line);box-shadow:0 30px 70px -48px rgba(14,42,59,.45)}
.case-framed img,.case-framed .case-loop{border-radius:4px}
.case-framed .case-loop{inset:clamp(10px,1.4vw,18px);width:calc(100% - 2*clamp(10px,1.4vw,18px));height:calc(100% - 2*clamp(10px,1.4vw,18px))}
.film .frame,.film .yt{background:#fff}
.gear{list-style:none;margin:clamp(40px,5vw,72px) 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px 32px;border-top:1px solid var(--line);padding-top:24px}
.gear li{color:var(--text-2)}

/* v6 releases: the spotlight band, follow links, sharing, lyrics */
.spotlight{background:linear-gradient(90deg,var(--sand),var(--ground));border-block:1px solid var(--line);padding-block:clamp(28px,3vw,44px)}
.spotlight-grid{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;column-gap:clamp(20px,3vw,48px);row-gap:20px}
.spotlight-grid>*{grid-column:auto}
.spotlight-cover{display:block;width:clamp(110px,14vw,200px);border-radius:var(--r);overflow:hidden;box-shadow:0 30px 70px -40px rgba(14,42,59,.5)}
.spotlight-copy .eyebrow{margin-bottom:12px}
.spotlight-copy h2 a{text-decoration:none}
.spotlight-actions{margin-top:0}
@media (max-width:900px){.spotlight-grid{grid-template-columns:auto minmax(0,1fr)}.spotlight-actions{grid-column:1/-1}}
.streams{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.stream{display:inline-flex;align-items:center;gap:8px;min-height:44px}
.stream svg,.btn svg rect,.btn svg circle{flex:none}
.stream svg{width:18px;height:18px;fill:currentColor}
.stream-ig{background:var(--ink);color:#fff;border-color:var(--ink)}
.stream-ig:hover{background:var(--sun);color:#fff;border-color:var(--sun)}
.share-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:20px}
.share-to{font-size:15px;color:var(--text-2);min-height:44px;display:inline-flex;align-items:center}
.lyrics{white-space:pre-line;color:var(--text-2);line-height:1.75;margin:0}
.frame-cover{object-fit:contain;background:var(--sand)}
.hero-follow{margin:22px 0 0;font-size:15px}
.hero-follow a{display:inline-flex;align-items:center;gap:10px;min-height:44px;text-decoration:none;font-weight:600;color:var(--text)}
.hero-follow svg{width:20px;height:20px;fill:currentColor}
.hero-follow .mono{color:var(--ray);font-weight:400}
.follow{background:linear-gradient(180deg,var(--ground),var(--sand))}
.follow-grid{align-items:end;row-gap:28px}
.follow .actions{margin-top:0}
.foot-follow{width:fit-content;margin-bottom:6px;color:#fff !important}
.foot-follow svg{width:16px;height:16px;fill:currentColor}

/* v6 soundscapes: big sound cards, a 3 s hover preview and a ripple from the pointer */
.sound-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,440px),1fr));gap:clamp(28px,3vw,48px) var(--gap)}
.sound-card{display:flex;flex-direction:column;gap:18px;margin:0}
.sound-media{position:relative;display:block;overflow:hidden;border-radius:var(--r);aspect-ratio:16/10;background:var(--sand)}
.sound-media img{width:100%;height:100%;object-fit:cover}
.sound-ripple{position:absolute;left:var(--rx,50%);top:var(--ry,50%);width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;border:2px solid rgba(255,253,248,.95);box-shadow:0 0 0 2px rgba(25,181,196,.35);opacity:0;pointer-events:none}
.is-rippling .sound-ripple{animation:ripple 1.1s cubic-bezier(.16,1,.3,1) both}
@keyframes ripple{0%{opacity:.95;transform:scale(1)}100%{opacity:0;transform:scale(22)}}
.sound-card.is-previewing .sound-media::after{content:"";position:absolute;inset:auto 14px 14px auto;width:12px;height:12px;border-radius:50%;background:var(--sun);box-shadow:0 0 0 6px rgba(212,56,27,.2)}
.sound-copy{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.sound-copy .mono{margin:0}
.sound-title{font-family:var(--display);font-weight:300;font-size:clamp(1.6rem,2.6vw,2.4rem);letter-spacing:-.035em}
.sound-story{margin:0;color:var(--text-2);max-width:44ch}
@media (prefers-reduced-motion:reduce){.sound-ripple{display:none}}
.case-lead .case-media img{object-position:50% 22%}
.case-media img.case-square{object-fit:contain;background:var(--sand)}
.room-stills .room-item img,.room-stills .room-item:first-child img{aspect-ratio:16/10;height:auto}
.room-stills .room-item:first-child{grid-row:auto}

/* v6 phone hero: the scene owns the top third (sun and palms clear of the wash); the headline, the
   line and "Hear the work" sit above the fold at 375×812 */
@media (max-width:640px){
  .hero-inner{padding-block:120px 24px}
  .hero .eyebrow{font-size:10.5px;letter-spacing:.14em;margin-bottom:16px}
  .hero-title{font-size:clamp(3.4rem,15.5vw,4.4rem)}
  .hero-sub{margin-top:16px;font-size:1.05rem}
  .hero .actions{margin-top:20px;gap:8px}
  .hero .btn-lg{min-height:50px;padding:12px 22px;font-size:15.5px}
  .hero-follow{margin-top:12px}
  .hero-shade,.sun-live .hero-shade{background:linear-gradient(180deg,rgba(255,253,248,.55) 0%,rgba(255,253,248,0) 12%,rgba(255,253,248,0) 30%,rgba(255,253,248,.82) 42%,rgba(255,253,248,.94) 58%,var(--ground) 100%)}
}
@media (max-width:640px){
  .sun-palm-r{width:100vw;right:-50%;height:100%;opacity:.95}
  .sun-tower{display:none}
}

/* Hero copy reveal: hidden only from the first paint until the DOM is ready (a class the head script
   sets), then a short transition; all of it is in by 1.2 s. It never waits for the 3D, fonts or images,
   and with reduced motion (or no JS) nothing is hidden at all. */
.hero-in{transition:opacity .4s cubic-bezier(.16,1,.3,1),transform .4s cubic-bezier(.16,1,.3,1)}
.hero-sub.hero-in{transition-delay:.05s}.hero .actions.hero-in{transition-delay:.1s}.hero-follow.hero-in{transition-delay:.15s}
.hero-wait .hero-in{opacity:0;transform:translateY(14px)}
