/* A clearer editorial hierarchy for the artist's first impression. */
.hero-entry{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:24px;color:var(--ink);font-family:var(--font-display);text-align:center;pointer-events:auto}
.hero-entry-line{display:block;width:42px;height:2px;background:#ad7548}
.hero-entry p{margin:0;color:rgba(17,18,22,.58);font-size:.68rem;font-weight:700;letter-spacing:.18em}
.hero-entry a{display:inline-flex;align-items:center;gap:16px;min-height:44px;padding:0 0 4px;border-bottom:1px solid currentColor;color:inherit;font-size:.92rem;font-weight:700;letter-spacing:.1em;text-decoration:none;text-transform:uppercase;transition:gap .2s ease,color .2s ease}
.hero-entry a svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.hero-entry a:hover,.hero-entry a:focus-visible{gap:23px;color:#815531}
.hero-entry a:focus-visible{outline:2px solid #815531;outline-offset:5px}
.hero .desktop-stream-icons{position:absolute!important}
.hero .desktop-stream-icons a{display:grid!important;place-items:center!important}
.hero .desktop-stream-icons a img{display:block;width:22px!important;height:22px!important;max-width:22px!important;max-height:22px!important;object-fit:contain!important}
.hero .desktop-stream-icons img[alt="Instagram"]{width:24px!important;height:24px!important;max-width:24px!important;max-height:24px!important}
.hero .desktop-stream-icons img[alt="Spotify"]{width:21px!important;height:21px!important;max-width:21px!important;max-height:21px!important}
.hero .desktop-stream-icons img[alt="Apple Music"]{width:22px!important;height:22px!important;max-width:22px!important;max-height:22px!important;transform:translateY(-2px)!important}
.hero .desktop-stream-icons img[alt="Deezer"]{width:23px!important;height:23px!important;max-width:23px!important;max-height:23px!important}
.hero .desktop-stream-icons img[alt="TIDAL"]{width:33px!important;height:33px!important;max-width:33px!important;max-height:33px!important}
.hero .desktop-stream-icons img[alt="Amazon Music"]{width:29px!important;height:18px!important;max-width:29px!important;max-height:18px!important}
.hero,.releases-section,.about-section{overflow:hidden}
.site-background-video,.upcoming-headphones-video{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;object-position:left center;opacity:.48;mix-blend-mode:multiply;filter:blur(1px) brightness(1.08) contrast(1.14);pointer-events:none;background:transparent}
.upcoming-headphones-video{object-position:center}
.site-video-wash,.upcoming-text-wash{position:absolute;inset:0;z-index:1;pointer-events:none}
.hero-video-wash{background:linear-gradient(90deg,rgba(242,232,214,.58) 0%,rgba(242,232,214,.28) 18%,rgba(242,232,214,.08) 38%,transparent 56%)}
.releases-section,.about-section:not(.hopmax-presave-section){isolation:isolate}
.releases-section>.section-inner,.about-section:not(.hopmax-presave-section)>.section-inner{position:relative;z-index:2}
.hero-copy,.releases-section>.section-inner,.about-section:not(.hopmax-presave-section)>.section-inner,.contact-section>.section-inner{text-shadow:0 1px 2px rgba(255,255,255,.65),0 5px 18px rgba(47,37,27,.14)}
.releases-video-wash,.about-video-wash,.upcoming-text-wash{background:linear-gradient(90deg,transparent 24%,rgba(242,232,214,.4) 40%,rgba(242,232,214,.88) 56%,rgba(242,232,214,.97) 72%)}
.hopmax-presave-section,.contact-section{position:relative;isolation:isolate;overflow:hidden}
.contact-section{min-height:520px}
.contact-section>.section-inner{position:relative;z-index:2;display:flex;min-height:520px;flex-direction:column;align-items:center;justify-content:center}
.contact-vinyl{position:absolute;top:50%;left:-4%;z-index:0;height:168%;width:auto;max-width:none;transform:translateY(-50%);object-fit:cover;object-position:left center;opacity:.48;mix-blend-mode:multiply;filter:blur(1px) brightness(1.08) contrast(1.14);pointer-events:none}
.contact-video-wash{background:linear-gradient(90deg,transparent 0%,rgba(242,232,214,.4) 14%,rgba(242,232,214,.9) 28%,rgba(242,232,214,.98) 40%)}
.hopmax-presave-section>.section-inner{position:relative;z-index:2}
.headphone-cable-extension{position:absolute;left:41%;top:71%;z-index:1;width:57%;height:22%;overflow:visible;fill:none;stroke:rgba(71,65,56,.42);stroke-width:2;vector-effect:non-scaling-stroke;pointer-events:none}
body.stream-icons-away .hero .desktop-stream-icons{opacity:1!important;transform:none!important;pointer-events:auto!important}
.release-editorial-kicker{margin:0 0 14px;color:rgba(17,18,22,.6);font-family:var(--font-display);font-size:.7rem;font-weight:700;letter-spacing:.22em;text-align:center}
.releases-section .section-title{margin-bottom:30px!important}
.release-card.is-flow-side{--flow-opacity:.56}
.release-cover-frame::after{background:rgba(242,232,214,.14);opacity:1}
.hopmax-presave-section .hopmax-presave-cover::after{content:""!important;display:block!important;position:absolute;inset:0;z-index:2;background:rgba(242,232,214,.14);pointer-events:none}
#about .about-photo-wrap::before{content:"";position:absolute;inset:0;z-index:1;background:rgba(242,232,214,.14);pointer-events:none}
.release-card.is-flow-active .release-title{font-size:clamp(1rem,1.45vw,1.28rem);line-height:1.12;letter-spacing:.045em!important}
.release-card.is-flow-active .release-meta{margin-top:2px;font-size:.78rem;font-weight:500;color:rgba(17,18,22,.64)}
.release-card{transition:opacity .45s ease,transform .72s cubic-bezier(.25,.75,.25,1)}
.release-title-text{display:inline-block;max-width:100%;vertical-align:top}
.release-card.is-flow-active .release-title{transition:none;transform:none}
.release-card:not(.is-flow-active) .release-title{transition:none}
.release-title.is-title-typing .release-title-text{animation:release-title-type var(--title-duration,280ms) steps(var(--title-steps,16),end) 80ms both}
@keyframes release-title-type{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@media (prefers-reduced-motion:reduce){.release-card{transition:none}.release-title.is-title-typing .release-title-text{animation:none}}

@media (min-width:901px){
  .hero{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(280px,.8fr);align-items:center;justify-content:center;column-gap:clamp(42px,6vw,110px);min-height:100svh;padding:80px clamp(48px,8vw,160px) 64px!important;overflow:hidden}
  .hero::before{content:"";position:absolute;right:5%;top:13%;width:min(50vw,660px);aspect-ratio:1;border:1px solid rgba(72,92,60,.16);border-radius:50%;background:radial-gradient(circle,rgba(168,177,128,.18),rgba(168,177,128,0) 66%);pointer-events:none}
  .hero-copy{position:relative!important;inset:auto!important;top:auto!important;left:12px!important;z-index:4;display:flex!important;flex-direction:column;align-items:flex-start;justify-content:center;gap:0;transform:none!important;text-align:left;pointer-events:auto!important}
  #hopmax-title{position:relative!important;top:auto!important;left:auto!important;z-index:4;margin:0!important;max-width:none;font-size:clamp(5rem,8vw,9rem)!important;line-height:.88!important;letter-spacing:-.025em!important;text-align:left}
  #hopmax-title-text{position:relative;left:-.055em}
  #hopmax-title.is-title-long{font-size:clamp(3.5rem,7vw,7rem)!important}
  .hero-tagline{display:block!important;margin:22px 0 0!important;max-width:none;text-align:left;font-size:clamp(.9rem,1.12vw,1.14rem)!important;letter-spacing:.14em!important}
  .hero-entry{align-items:flex-start;margin-top:24px;text-align:left}
  .hero-entry-line{display:none}
  .hopmax-figure-wrap{grid-column:2;grid-row:1;width:min(100%,32vw,calc((100svh - 170px)*.5625),360px)!important;justify-self:center;transform:none!important}
  .hero .desktop-stream-icons{top:26px!important;bottom:auto!important;left:calc(clamp(48px,8vw,160px) + 12px)!important;gap:16px!important}
  .desktop-stream-icons a{width:34px!important;height:34px!important}
  .desktop-stream-icons a img{object-fit:contain!important}
  .releases-section .section-title{font-size:clamp(2.8rem,5vw,5.5rem);letter-spacing:-.015em!important}
  .release-flow{width:min(900px,100%);padding:0 50px}
  .release-grid{--flow-step:clamp(165px,17vw,210px);height:350px!important}
  .release-card{width:clamp(180px,18vw,240px)}
  .release-flow-button{top:104px}
  .release-card.is-flow-active .release-cover-frame{box-shadow:0 30px 65px rgba(45,37,27,.16),0 2px 0 rgba(17,18,22,.07)}
  .hero-vinyl-video{left:0;width:86%;object-position:left center;-webkit-mask-image:linear-gradient(90deg,#000 54%,transparent 86%);mask-image:linear-gradient(90deg,#000 54%,transparent 86%)}
  .hero-video-wash{background:linear-gradient(90deg,rgba(242,232,214,.46) 0%,rgba(242,232,214,.18) 24%,transparent 46%)}
  .drum-machine-video{width:105%;-webkit-mask-image:linear-gradient(90deg,#000 8%,transparent 33%);mask-image:linear-gradient(90deg,#000 8%,transparent 33%)}
  .releases-video-wash{background:linear-gradient(90deg,transparent 0%,rgba(242,232,214,.42) 18%,rgba(242,232,214,.88) 31%,rgba(242,232,214,.98) 43%)}
  .audio-interface-video{top:50%;left:-16%;width:46%;height:auto;max-width:none;transform:translateY(-50%);object-fit:contain;-webkit-mask-image:linear-gradient(90deg,#000 70%,transparent 96%);mask-image:linear-gradient(90deg,#000 70%,transparent 96%)}
  .about-video-wash{background:linear-gradient(90deg,transparent 0%,rgba(242,232,214,.18) 34%,rgba(242,232,214,.9) 46%,rgba(242,232,214,.98) 56%)}
  .upcoming-headphones-video{top:-4%;left:-9%;width:57%;height:108%;object-fit:cover;object-position:left center;-webkit-mask-image:linear-gradient(90deg,#000 76%,transparent 100%);mask-image:linear-gradient(90deg,#000 76%,transparent 100%)}
  .upcoming-text-wash{background:linear-gradient(90deg,transparent 24%,rgba(242,232,214,.5) 38%,rgba(242,232,214,.94) 50%,rgba(242,232,214,.98) 62%)}
}

@media (max-width:900px){
  .iab .hero{isolation:isolate}
  .site-background-video,.upcoming-headphones-video,.contact-vinyl{filter:none;mix-blend-mode:normal;opacity:.38}
  .headphone-cable-extension{display:none}
  .site-header .menu-toggle{width:42px;height:42px;margin-top:-7px;right:max(8px,calc(var(--mobile-header-x) - 10px))!important;border:0;border-radius:0;background:transparent;box-shadow:none}
  .hero{min-height:92svh!important;padding-bottom:122px!important}
  .contact-section,.contact-section>.section-inner{min-height:420px}
  .contact-vinyl{left:-6%;height:175%}
  .contact-video-wash{background:linear-gradient(180deg,transparent 8%,rgba(239,227,208,.35) 42%,rgba(239,227,208,.88) 68%)}
  .site-background-video,.upcoming-headphones-video{width:100%;height:100%;object-position:32% center;opacity:.4}
  .upcoming-headphones-video{object-position:25% center}
  .hero-video-wash{background:linear-gradient(180deg,rgba(239,227,208,.78),rgba(239,227,208,.42) 24%,rgba(239,227,208,.22) 58%,rgba(239,227,208,.72))}
  .releases-video-wash,.about-video-wash,.upcoming-text-wash{background:linear-gradient(180deg,transparent 16%,rgba(239,227,208,.28) 36%,rgba(239,227,208,.84) 58%,rgba(239,227,208,.94) 82%)}
  .releases-video-wash{background:linear-gradient(180deg,rgba(239,227,208,.62) 0%,rgba(239,227,208,.72) 30%,rgba(239,227,208,.46) 65%,rgba(239,227,208,.8) 100%)}
  .hero-copy{position:absolute!important;inset:0!important;top:0!important;left:0!important;width:100%;height:100%;transform:none!important;pointer-events:none!important}
  #hopmax-title{position:absolute!important;top:var(--mobile-header-y)!important;left:var(--mobile-header-x)!important}
  .hero-tagline{position:absolute!important;top:calc(var(--mobile-header-y) + 34px)!important;left:var(--mobile-header-x)!important;z-index:88;display:block!important;width:auto;max-width:calc(100vw - 80px);min-height:0;margin:0!important;font-size:.65rem!important;letter-spacing:.12em!important;line-height:1.2;text-align:left;white-space:nowrap;opacity:1!important;transform:none!important;animation:none!important}
  .hero-tagline::after{display:none!important}
  .hero-entry{position:absolute;top:calc(var(--mobile-header-y) + 58px);left:var(--mobile-header-x);z-index:88;align-items:flex-start;width:auto;margin:0;gap:0;transform:none;text-align:left;pointer-events:auto}
  .hero-entry-line,.hero-entry p{display:none}
  .hero-entry a{min-height:30px;font-size:.7rem;letter-spacing:.1em}
  .hero .desktop-stream-icons{position:fixed!important;top:auto!important;bottom:0!important;left:0!important;right:0!important;width:100%!important;gap:3px!important}
  body.stream-icons-away .hero .desktop-stream-icons{opacity:0!important;transform:translate3d(0,110%,0)!important;pointer-events:none!important}
  #hopmax-title-text{position:relative;left:-.03em}
  body.logo-away .hero-tagline,body.logo-away .hero-entry,body.menu-open .hero-tagline,body.menu-open .hero-entry{opacity:0!important;transform:translate3d(0,-18px,0)!important;pointer-events:none!important}
  .releases-section .section-title{margin-bottom:22px!important}
  .release-editorial-kicker{font-size:.63rem;margin-bottom:10px}
  .release-flow{width:min(480px,100%);padding:0 26px}
  .release-grid{--flow-step:clamp(100px,29vw,128px);height:clamp(265px,73vw,322px)!important}
  .release-card{width:clamp(146px,42vw,190px)}
  .release-flow-button{top:clamp(78px,24vw,112px)}
  .release-card.is-flow-active .release-title{font-size:1.02rem}
}

@media (max-width:600px){
  .hero-entry{top:calc(var(--mobile-header-y) + 58px)}
}

@media (prefers-reduced-motion:reduce){.hero-entry a{transition:none}}

/* Keep mobile scrolling independent of full-screen blend and backdrop passes. */
@media (max-width:900px),(pointer:coarse){
  .grain-overlay{display:none}
  .hopmax-presave-section .hopmax-presave-button.release-action-button{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  #preloader.hidden .preloader-vinyl{animation:none}
}

/* Mobile panel appearance restored from the 2026-11-07 deployment. */
@media (max-width:900px){
  .desktop-stream-icons.mobile-stream-dock{position:fixed!important;inset:auto 0 0!important;z-index:88;width:100%!important;gap:3px!important;opacity:1;transform:none;pointer-events:auto}
.mobile-stream-dock a{display:grid!important;place-items:center!important}
.mobile-stream-dock a img{display:block;width:22px!important;height:22px!important;max-width:22px!important;max-height:22px!important;object-fit:contain!important}
.mobile-stream-dock img[alt="Instagram"]{width:24px!important;height:24px!important;max-width:24px!important;max-height:24px!important}
.mobile-stream-dock img[alt="Spotify"]{width:21px!important;height:21px!important;max-width:21px!important;max-height:21px!important}
.mobile-stream-dock img[alt="Apple Music"]{width:22px!important;height:22px!important;max-width:22px!important;max-height:22px!important;transform:translateY(-2px)!important}
.mobile-stream-dock img[alt="Deezer"]{width:23px!important;height:23px!important;max-width:23px!important;max-height:23px!important}
.mobile-stream-dock img[alt="TIDAL"]{width:33px!important;height:33px!important;max-width:33px!important;max-height:33px!important}
.mobile-stream-dock img[alt="Amazon Music"]{width:29px!important;height:18px!important;max-width:29px!important;max-height:18px!important}
  body.stream-icons-away .mobile-stream-dock,body.menu-open .mobile-stream-dock,body.menu-closing .mobile-stream-dock{opacity:0!important;transform:translateY(110%)!important;pointer-events:none!important}
}

/* Compensate for the desktop multiply treatment with a static paper tint. */
@media (max-width:900px){
  body{background-image:linear-gradient(rgba(239,227,208,.78),rgba(239,227,208,.78)),url(../assets/background/hopmax-vintage-paper.jpg)!important}
}

.hero-tagline::after{display:none!important}
@media (max-width:900px){
  /* The disc extends beyond the coverflow's padded inner grid. The section
     still clips cards at the screen edge while preserving the full record. */
  .releases-section .release-grid{overflow:visible}
}


/* Mobile parity: same editorial identity, adapted to a narrow viewport. */
@media (max-width:900px){
  .hero{display:flex!important;flex-direction:column!important;justify-content:flex-start!important;align-items:center!important;min-height:100svh!important;padding:calc(clamp(54px, 8svh, 76px) + env(safe-area-inset-top)) 20px calc(70px + env(safe-area-inset-bottom))!important;gap:clamp(8px,1.5svh,14px)!important}
  .hero-copy{position:relative!important;inset:auto!important;top:auto!important;left:auto!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;width:100%!important;height:auto!important;transform:none!important;text-align:center!important;pointer-events:auto!important;z-index:4!important;order:0}
  #hopmax-title{position:relative!important;top:auto!important;left:auto!important;margin:0!important;max-width:100%!important;transform:none!important;text-align:center!important;font-size:clamp(2.85rem,13vw,5.2rem)!important;line-height:.94!important;letter-spacing:-.025em!important;white-space:nowrap}
  #hopmax-title.is-title-long{font-size:clamp(2rem,9vw,4.3rem)!important}
  .hero-tagline{position:static!important;top:auto!important;left:auto!important;display:block!important;margin:9px auto 0!important;width:auto!important;max-width:100%!important;min-height:0!important;font-size:clamp(.7rem,2.8vw,.95rem)!important;letter-spacing:.1em!important;text-align:center!important;white-space:normal!important;line-height:1.4!important}
  .hero-entry{position:static!important;top:auto!important;left:auto!important;display:flex!important;align-items:center!important;margin:10px auto 0!important;gap:10px!important;width:auto!important;transform:none!important;text-align:center!important;pointer-events:auto!important}
  .hero-entry-line{display:block!important;width:32px}
  .hero-entry p{display:block!important;max-width:calc(100vw - 48px);font-size:clamp(.54rem,2.3vw,.72rem)!important;letter-spacing:.12em!important;line-height:1.5!important}
  .hero-entry a{min-height:44px!important;font-size:.85rem!important;letter-spacing:.1em!important}
  .hopmax-figure-wrap{position:relative!important;grid-column:auto!important;grid-row:auto!important;order:1;width:min(62vw,280px,calc((100svh - 355px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*.5625))!important;min-width:112px;max-width:100%;margin:0 auto!important;transform:none!important}
  .site-header{z-index:90}
  .site-header .menu-toggle{position:fixed!important;top:calc(env(safe-area-inset-top) + 14px)!important;right:12px!important;left:auto!important;z-index:92!important}
  .hero .desktop-stream-icons,.desktop-stream-icons.mobile-stream-dock{display:flex!important;justify-content:center!important;align-items:center!important;flex-wrap:nowrap!important;overflow-x:auto!important;overscroll-behavior-x:contain!important;max-width:100vw!important;padding:10px max(8px,env(safe-area-inset-left)) calc(10px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-right))!important;min-height:calc(64px + env(safe-area-inset-bottom))}
  .desktop-stream-icons.mobile-stream-dock a{flex:0 0 clamp(38px,12.5vw,44px)!important;min-width:38px!important;min-height:44px!important;display:grid!important;place-items:center!important}
  .releases-section .section-title,.contact-section .section-title{font-size:clamp(2.45rem,10vw,4rem)!important;line-height:1!important}
  .releases-section .section-inner,.about-section .section-inner,.contact-section .section-inner{width:100%!important;max-width:640px!important;margin-inline:auto!important}
  .releases-section .release-filter{flex-wrap:wrap!important;gap:10px!important}
  .releases-section .release-filter-button{min-height:44px!important}
  .release-flow{width:min(520px,100%)!important;padding-inline:clamp(20px,6vw,40px)!important}
  .release-grid{--flow-step:clamp(92px,25vw,135px)!important;height:clamp(252px,70vw,322px)!important}
  .release-card{width:clamp(135px,39vw,188px)!important}
  .release-flow-button{top:clamp(75px,23vw,112px)!important}
  .about-section:not(.hopmax-presave-section) .about-grid{display:grid!important;grid-template-columns:1fr!important;justify-items:center!important;gap:26px!important}
  .about-section:not(.hopmax-presave-section) .about-copy{display:contents!important}
  .about-section:not(.hopmax-presave-section) .about-copy .section-title{order:1!important;margin:0 auto 8px!important;text-align:center!important;font-size:clamp(2.45rem,10vw,4rem)!important}
  .about-section:not(.hopmax-presave-section) .about-photo-wrap{order:2!important;width:min(340px,100%)!important}
  .about-section:not(.hopmax-presave-section) .about-text{order:3!important;width:min(100%,44ch)!important;max-width:44ch!important;text-align:left!important}
  .contact-section .contact-text{text-align:center!important}
  .site-footer{padding-bottom:calc(84px + env(safe-area-inset-bottom))!important}
}
@media (max-width:380px){
  .hero{padding-inline:16px!important;gap:10px!important}
  .hero-entry p{letter-spacing:.075em!important}
  .hopmax-figure-wrap{width:min(58vw,245px,calc((100svh - 355px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*.5625))!important}
  .release-flow{padding-inline:22px!important}
}
@media (max-height:700px) and (max-width:900px){.hero{padding-top:calc(50px + env(safe-area-inset-top))!important;padding-bottom:calc(66px + env(safe-area-inset-bottom))!important;gap:8px!important}.hopmax-figure-wrap{width:min(55vw,220px,calc((100svh - 318px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*.5625))!important}}
@media (prefers-reduced-motion:reduce){.hero-entry a{transition:none!important}}
