/* NOCTURNE III — tighter composition, color portrait, meaningful story and useful navigation */
:root{--accent:#bb677c}
/* The mobile popover is a small panel, never a frozen full-screen overlay. */
.nav-panel-label,.nav-panel-bottom,.nav-scrim{display:none}
.nav-scrim[hidden]{display:none!important}
@media(max-width:760px){
  .nav-scrim:not([hidden]){display:block;position:fixed;inset:0;z-index:38;background:rgba(5,4,7,.48);border:0;cursor:default}
  .site-header{z-index:50}
  .site-nav{display:none;position:fixed;top:73px;left:auto;right:12px;bottom:auto;width:min(390px,calc(100vw - 24px));height:auto;max-height:calc(100dvh - 88px);overflow-y:auto;z-index:52;background:rgba(18,13,20,.985);border:1px solid #e7cdd05e;box-shadow:0 20px 65px #000d;padding:26px 25px 19px;flex-direction:column;align-items:stretch;gap:0;overscroll-behavior:contain}
  .site-nav.is-open{display:flex}
  .site-nav a{display:block;font-family:Cinzel,Georgia,serif;font-size:clamp(20px,5.4vw,25px);line-height:1.4;font-weight:500;letter-spacing:.035em;padding:12px 0;border-bottom:1px solid #eed2da24}
  .site-nav a:hover{color:#f6bfd0}
  .site-nav .nav-panel-label{display:block;font:700 9px Outfit,Arial,sans-serif;letter-spacing:.22em;color:#c993a4;margin:0 0 8px}
  .site-nav .nav-panel-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:22px;font-size:8px;letter-spacing:.12em;color:#bd97a3}
  .site-nav .nav-panel-bottom a{border:0;font:700 9px Outfit,Arial,sans-serif;letter-spacing:.09em;padding:10px;background:#ecdadb;color:#1b1319;text-align:center}
  .menu-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .menu-toggle.is-open span:nth-child(2){opacity:0}
  .menu-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .menu-toggle span{transition:transform .22s,opacity .15s}
  body.menu-open{overflow-y:auto!important}
}
/* The hero is a composition rather than an empty full-screen wallpaper. */
.hero-nocturne{height:min(790px,86svh);min-height:655px;max-height:790px}
.hero-center{inset:107px 24px 86px}
.hero-kicker{margin-bottom:17px}
.hero-emblem{width:clamp(95px,10vw,137px)!important;height:clamp(95px,10vw,137px)!important}
.hero-center h1{font-size:clamp(50px,6.25vw,96px);margin:15px 0 8px}
.streaming-label{margin:22px 0 13px}
.hero-explore{margin-top:22px}
.hero-bottom{bottom:22px}
.statement-bar{padding:22px 15px}
.next-era{min-height:0;padding-top:clamp(55px,6vw,96px);padding-bottom:clamp(55px,6vw,96px)}
.next-art{min-height:0;aspect-ratio:1.16;max-height:510px}
.section{padding-top:clamp(64px,6.5vw,100px);padding-bottom:clamp(64px,6.5vw,100px)}
.screen-feature{height:480px}
/* Merge portrait photography and artist story into one intentional section. */
.world-section{position:relative;overflow:hidden;background:linear-gradient(155deg,#140b13,#0c090e 55%,#1d1018);padding:clamp(65px,7vw,115px) clamp(20px,5vw,94px) clamp(75px,7vw,115px);border-top:1px solid #d9acbd21}
.world-intro{max-width:980px;margin:0 auto 46px;text-align:center}
.tiny-heading{color:#e0aab7;font:700 10px Outfit,Arial,sans-serif;letter-spacing:.24em}
.world-intro h2{font:500 clamp(48px,6.5vw,94px)/1.1 Cinzel,Georgia,serif;letter-spacing:-.055em;margin:19px 0 19px}
.world-intro h2 em{font-style:normal;color:#d38a9e}
.world-intro p{font-size:clamp(15px,1.3vw,18px);line-height:1.7;color:#cfb8c0;max-width:590px;margin:0 auto}
.world-line{display:flex;align-items:center;justify-content:center;gap:15px;margin-top:24px;letter-spacing:.25em;font:600 9px Outfit,Arial,sans-serif;color:#a77b88}
.world-line span{height:1px;background:#d4a3b43b;width:50px}
.world-photographs{max-width:1350px;margin:auto;display:grid;grid-template-columns:1.16fr .84fr;align-items:stretch;gap:22px}
.world-photo{margin:0;min-width:0;position:relative;background:#181316;overflow:hidden;border:1px solid #edd7d819;aspect-ratio:1.32}
.world-photo-secondary{aspect-ratio:1.32}
.world-photo img{width:100%;height:100%;object-fit:cover;object-position:center;filter:none;transform:scale(1);transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.world-photo:hover img{transform:scale(1.025)}
.world-photo-secondary img{object-position:50% 50%}
.world-photo figcaption{position:absolute;inset:auto 0 0;display:flex;justify-content:space-between;gap:14px;background:linear-gradient(transparent,#080609cc);padding:30px 22px 20px;letter-spacing:.16em;font:700 9px Outfit,Arial,sans-serif;color:#f4dfe4;text-shadow:0 1px 5px #000}
.world-outro{max-width:1020px;margin:55px auto 0;display:grid;grid-template-columns:1fr 1.05fr;gap:35px 65px;align-items:center}
.world-manifesto{font:500 clamp(27px,3vw,45px)/1.25 Cinzel,Georgia,serif;color:#f5e5e3;margin:0!important}
.world-outro>p:not(.world-manifesto){color:#c6b3bf;font-size:16px;line-height:1.8;margin:0}
.world-discover{grid-column:2;display:inline-flex;align-items:center;justify-content:space-between;width:max-content;gap:35px;font:700 10px Outfit,Arial,sans-serif;letter-spacing:.14em;padding-bottom:11px;border-bottom:1px solid #eab9c68a;color:#f4ccd3}
/* Footer, separated by what a visitor wants to do. */
footer#connect{padding:clamp(65px,6vw,110px) clamp(18px,5vw,90px) 29px;text-align:center;background:radial-gradient(ellipse at 50% 0%,#3d1a2f55,#08070a 68%)}
.footer-heading .foot-kicker{font-size:10px;letter-spacing:.26em;font-weight:700;color:#dca4b2;margin:0}
footer#connect h2{max-width:1000px;font-size:clamp(39px,5.45vw,83px);line-height:1.17;margin:22px auto 18px;letter-spacing:-.038em}
footer#connect h2 em{font-style:normal;color:#ca7890}
.foot-sub{color:#c5b2ba;font-size:15px;line-height:1.65;margin:0 auto 42px;max-width:500px}
.footer-columns{max-width:900px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;text-align:left;gap:20px}
.foot-group{border-top:1px solid #eed9dc55;padding:20px 0 0;display:flex;flex-direction:column}
.foot-group h3{font:700 12px Outfit,Arial,sans-serif;letter-spacing:.23em;margin:0 0 16px;color:#f1dce3}
.foot-group h3 span{font-size:10px;color:#c78096;margin-right:14px}
.foot-group a{font-size:clamp(16px,1.6vw,21px);font-family:Cinzel,Georgia,serif;border-bottom:1px solid #eedee01e;padding:14px 1px;display:flex;justify-content:space-between;align-items:center;gap:12px;transition:color .2s,padding-left .2s}
.foot-group a span{font-family:Outfit,Arial,sans-serif;color:#c994a3;font-size:18px}
.foot-group a:hover{padding-left:8px;color:#d9a1af}
.foot-group a[data-pending]{color:#b2a3ad}
.footline{max-width:900px;margin:49px auto 0;padding-top:17px;border-top:1px solid #eeddd922}
@media(max-width:1000px){
 .world-photographs{gap:13px}
 .world-photo,.world-photo-secondary{aspect-ratio:1.1}
 .world-outro{gap:28px}
}
@media(max-width:760px){
 .hero-nocturne{height:680px;min-height:680px;max-height:none}
 .hero-center{inset:99px 14px 91px}
 .hero-kicker{margin-bottom:14px}
 .hero-emblem{height:105px!important;width:105px!important}
 .hero-center h1{font-size:clamp(33px,8.8vw,47px);letter-spacing:.028em;margin:16px auto 6px}
 .hero-center .hero-tagline{font-size:8px;letter-spacing:.13em}
 .streaming-label{margin:20px 0 10px;font-size:9px}
 .hero-services{gap:6px}
 .platform-link{padding:9px 5px;min-height:70px;font-size:10px}
 .hero-explore{margin-top:18px}
 .hero-bottom{bottom:16px}
 .screen-feature{height:360px}
 .screen-caption h2{font-size:clamp(35px,8.8vw,62px)}
 .next-era{padding-top:58px;padding-bottom:65px}
 .section{padding-top:65px;padding-bottom:70px}
 .world-section{padding:66px 18px 76px}
 .world-intro{margin-bottom:30px;text-align:left}
 .world-intro h2{font-size:clamp(40px,9.5vw,67px);margin:14px 0}
 .world-intro p{font-size:14px;margin:0}
 .world-line{justify-content:flex-start;margin-top:16px}
 .world-photographs{grid-template-columns:1fr;gap:14px}
 .world-photo,.world-photo-secondary{aspect-ratio:1.45}
 .world-photo figcaption{font-size:8px;padding:25px 12px 13px}
 .world-outro{margin-top:35px;display:flex;flex-direction:column;align-items:flex-start;gap:20px}
 .world-manifesto{font-size:clamp(25px,6.3vw,34px)}
 .world-outro>p:not(.world-manifesto){font-size:15px}
 .world-discover{width:auto;gap:24px}
 footer#connect{padding-top:68px}
 footer#connect h2{font-size:clamp(35px,8.2vw,57px)}
 .foot-sub{margin-bottom:32px;font-size:14px}
 .footer-columns{grid-template-columns:1fr;gap:26px}
 .foot-group{padding-top:19px}
 .foot-group a{font-size:20px;padding:13px 0}
 .footline{margin-top:39px}
}
@media(max-width:360px){
 .hero-nocturne{height:650px;min-height:650px}
 .hero-center{top:96px}
 .hero-emblem{height:94px!important;width:94px!important}
 .hero-center h1{font-size:31px}
 .platform-link{min-height:67px;font-size:9px}
 .hero-bottom{gap:9px}
 .hero-bottom strong{font-size:14px}
 .world-photo,.world-photo-secondary{aspect-ratio:1.27}
 .foot-group a{font-size:18px}
}

/* Final vertical rhythm adjustment */
@media(min-width:761px){.hero-nocturne{height:min(700px,83svh);min-height:650px;max-height:700px}}
@media(max-width:760px){.hero-nocturne{height:595px;min-height:595px}.hero-bottom{bottom:15px}}
@media(max-width:360px){.hero-nocturne{height:585px;min-height:585px}}

/* NOCTURNE IV — release-page usability */
.release-image:focus-visible,.release-actions a:focus-visible{outline:2px solid #ffcad8;outline-offset:4px}
/* Hide inactive interface elements consistently across browsers. */
.player-dock[hidden],.preview-trigger[hidden],.nav-scrim[hidden]{display:none!important}