:root {
  --black: #050505;
  --ink: #0a0a0b;
  --panel: #101011;
  --white: #f4f4f2;
  --silver: #aaa9a7;
  --muted: #777775;
  --line: rgba(255, 255, 255, 0.14);
  --pad: clamp(1.25rem, 4vw, 4.5rem);
  --chrome: linear-gradient(112deg, #555 0%, #fff 18%, #777 33%, #f7f7f7 48%, #666 63%, #fff 82%, #898989 100%);
  --site-max: 1280px;
  --content-max: 1180px;
  --content-gutter: max(var(--pad), calc((100vw - var(--content-max)) / 2));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; color-scheme: dark; }
body { margin: 0; overflow-x: hidden; background: var(--black); color: var(--white); font-family: "Inter Tight", Arial, sans-serif; -webkit-font-smoothing: antialiased; }
body > main { width: 100%; margin-inline: auto; overflow: clip; border-inline: 0; box-shadow: none; }
body::before { position: fixed; inset: 0; z-index: -2; background: radial-gradient(circle at 75% 8%, #252525 0, transparent 28%), radial-gradient(circle at 10% 54%, #171717 0, transparent 22%), #050505; content: ""; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
img { display: block; max-width: 100%; height: auto; }

.grain { position: fixed; inset: 0; z-index: 99; pointer-events: none; opacity: .055; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E"); mix-blend-mode: soft-light; }

.site-header { position: fixed; top: 16px; left: 50%; z-index: 50; display: grid; grid-template-columns: 1fr auto 1fr; width: min(calc(100% - 32px), calc(var(--site-max) - 32px)); height: 82px; padding: 0 clamp(1.4rem, 3.4vw, 3.2rem); transform: translateX(-50%); align-items: center; overflow: hidden; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; background: linear-gradient(180deg, rgba(31,31,34,.78), rgba(4,4,5,.7)); box-shadow: inset 0 1px 0 rgba(255,255,255,.24), inset 0 -1px 0 rgba(255,255,255,.06), 0 24px 70px rgba(0,0,0,.52), 0 3px 12px rgba(0,0,0,.65); -webkit-backdrop-filter: blur(34px) saturate(180%); backdrop-filter: blur(34px) saturate(180%); transition: top .4s cubic-bezier(.2,.75,.2,1), width .4s cubic-bezier(.2,.75,.2,1), height .4s cubic-bezier(.2,.75,.2,1), padding .4s cubic-bezier(.2,.75,.2,1), background .4s ease, box-shadow .4s ease; }
.site-header::before { position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(110deg, rgba(255,255,255,.13), transparent 22%, transparent 72%, rgba(255,255,255,.035)); content: ""; pointer-events: none; }
.site-header::after { position: absolute; top: 1px; right: 7%; left: 7%; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.46), transparent); content: ""; pointer-events: none; }
.site-header > * { position: relative; z-index: 1; }
.site-header.is-compact { top: 10px; width: min(calc(100% - 48px), calc(var(--site-max) - 120px)); height: 66px; padding-inline: clamp(1.25rem, 2.8vw, 2.5rem); background: linear-gradient(180deg, rgba(27,27,30,.86), rgba(3,3,4,.8)); box-shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 -1px 0 rgba(255,255,255,.05), 0 15px 44px rgba(0,0,0,.52), 0 2px 9px rgba(0,0,0,.7); }
.site-logo { display: inline-flex; justify-self: start; align-items: center; gap: .8rem; font-size: 1.4rem; font-weight: 650; letter-spacing: -.04em; }
.site-logo img { width: 44px; height: 58px; object-fit: contain; filter: drop-shadow(0 0 10px rgba(255,255,255,.3)); transition: width .4s cubic-bezier(.2,.75,.2,1), height .4s cubic-bezier(.2,.75,.2,1); }
.site-header.is-compact .site-logo img { width: 35px; height: 46px; }
.desktop-nav { display: flex; gap: 2.8rem; color: #c0c0bd; font-family: "DM Mono", monospace; font-size: .9rem; letter-spacing: .07em; text-transform: uppercase; }
.desktop-nav a, .site-footer a { transition: color .2s ease; }
.desktop-nav a:hover, .site-footer a:hover { color: #fff; }
.header-cta { justify-self: end; display: inline-flex; min-height: 50px; align-items: center; gap: 1.8rem; padding: .75rem 1.4rem; border: 1px solid var(--line); border-radius: 100px; font-family: "DM Mono", monospace; font-size: .86rem; letter-spacing: .05em; text-transform: uppercase; transition: background .2s, color .2s; }
.site-header.is-compact .header-cta { min-height: 42px; padding-block: .55rem; }
.header-cta:hover { background: #fff; color: #000; }
.menu-toggle { display: none; justify-self: end; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 50%; background: transparent; }
.menu-toggle span { display: block; width: 15px; height: 1px; margin: 4px auto; background: #fff; }

.hero { position: relative; display: grid; grid-template-columns: 1.08fr .92fr; min-height: 100svh; padding: 11rem var(--content-gutter) 4rem; isolation: isolate; }
.hero-aura { position: absolute; top: 12%; left: 44%; z-index: -1; width: 58vw; height: 58vw; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.12), rgba(140,140,140,.035) 34%, transparent 68%); filter: blur(24px); }
.hero-copy { z-index: 2; align-self: center; padding-bottom: 5vh; }
.kicker, .section-label { display: flex; align-items: center; gap: .9rem; margin: 0 0 2.4rem; color: #adadaa; font-family: "DM Mono", monospace; font-size: .85rem; letter-spacing: .1em; text-transform: uppercase; }
.kicker span { width: 28px; height: 1px; background: #aaa; }
.hero h1 { max-width: 980px; margin: 0; font-size: clamp(5.25rem, 9vw, 10.5rem); font-weight: 600; letter-spacing: -.078em; line-height: .78; text-transform: uppercase; }
.hero h1 em { padding-right: .08em; background: var(--chrome); background-clip: text; color: transparent; font-family: Georgia, serif; font-size: .88em; font-weight: 400; letter-spacing: -.09em; text-transform: none; filter: drop-shadow(0 0 18px rgba(255,255,255,.13)); }
.hero-intro { max-width: 600px; margin: 3rem 0 2.5rem; color: #b5b5b2; font-size: clamp(1.2rem, 1.5vw, 1.5rem); line-height: 1.55; }
.hero-actions { display: flex; align-items: center; gap: 1.7rem; }
.chrome-button { display: inline-flex; min-height: 62px; align-items: center; justify-content: center; gap: 2.4rem; padding: 0 1.65rem; border: 1px solid rgba(255,255,255,.62); border-radius: 100px; background: linear-gradient(105deg, #efefef, #838383 27%, #f8f8f8 49%, #777 73%, #f8f8f8); box-shadow: inset 0 1px 0 #fff, 0 0 30px rgba(255,255,255,.08); color: #080808; font-family: "DM Mono", monospace; font-size: .82rem; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; transition: transform .25s, box-shadow .25s; }
.chrome-button:hover { box-shadow: inset 0 1px 0 #fff, 0 0 35px rgba(255,255,255,.22); transform: translateY(-2px); }
.text-link { border-bottom: 1px solid #666; padding: .9rem 0 .55rem; color: #cececa; font-family: "DM Mono", monospace; font-size: .8rem; letter-spacing: .04em; text-transform: uppercase; }
.hero-visual { position: relative; align-self: center; min-width: 0; }
.image-frame { position: relative; overflow: hidden; aspect-ratio: 1.03; border: 0; background-image: linear-gradient(90deg, #050505 0%, rgba(5,5,5,.92) 7%, rgba(5,5,5,.52) 18%, transparent 34%, transparent 66%, rgba(5,5,5,.52) 82%, rgba(5,5,5,.92) 93%, #050505 100%), url("assets/site/beatpack-hero.png"); background-position: center; background-size: cover; filter: saturate(0) contrast(1.2) brightness(1.16); opacity: 1; -webkit-mask-image: radial-gradient(66% 66% at 55% 48%, #000 32%, rgba(0,0,0,.84) 56%, rgba(0,0,0,.25) 76%, transparent 100%); mask-image: radial-gradient(66% 66% at 55% 48%, #000 32%, rgba(0,0,0,.84) 56%, rgba(0,0,0,.25) 76%, transparent 100%); }
.visual-stamp { position: absolute; top: 5%; right: -2%; z-index: 2; padding: .7rem; border-left: 1px solid #aaa; color: #aaa; font-family: "DM Mono", monospace; font-size: .57rem; line-height: 1.6; letter-spacing: .09em; text-transform: uppercase; }
.visual-stamp span { display: block; margin-bottom: .2rem; color: #fff; font-size: 1.35rem; }
.hero-index { position: absolute; right: var(--content-gutter); bottom: 2rem; color: #555; font-family: "DM Mono", monospace; font-size: .6rem; letter-spacing: .1em; }

.ticker { overflow: hidden; padding: 1.15rem 0; border-block: 1px solid rgba(255,255,255,.13); background: #d7d7d4; color: #080808; transform: rotate(-1deg) scale(1.02); }
.ticker-track { display: flex; width: max-content; flex-wrap: nowrap; align-items: center; gap: 2.6rem; animation: ticker 25s linear infinite; font-family: "DM Mono", monospace; font-size: .82rem; line-height: 1; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.ticker-track span, .ticker-track i { flex: 0 0 auto; white-space: nowrap; }
.ticker i { font-size: .7rem; }
@keyframes ticker { from { transform: translateX(0) rotate(var(--ticker-angle)); } to { transform: translateX(-50%) rotate(var(--ticker-angle)); } }

.production-flow { position: relative; padding: clamp(6rem, 9vw, 9rem) var(--content-gutter); border-bottom: 1px solid var(--line); background: radial-gradient(circle at 50% 24%, #242426 0, #0d0d0e 29%, #050505 62%); }
.flow-heading { max-width: 1180px; margin: 0 auto clamp(4.5rem, 7vw, 7rem); text-align: center; }
.flow-heading .section-label { justify-content: center; }
.flow-heading h2 { margin: 0; font-size: clamp(3.25rem, 5.8vw, 6.7rem); font-weight: 550; letter-spacing: -.065em; line-height: .92; text-transform: uppercase; text-wrap: balance; }
.flow-heading > p:last-child { max-width: 680px; margin: 2rem auto 0; color: #aaa9a6; font-size: 1.15rem; line-height: 1.6; }
.flow-step { width: min(100%, 1120px); margin: 0 auto clamp(5rem, 8vw, 8rem); }
.step-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 1.4rem; }
.step-heading span { color: #777; font-family: "DM Mono", monospace; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.step-heading h3 { margin: 0; font-size: clamp(1.55rem, 2.4vw, 2.25rem); font-weight: 500; letter-spacing: -.035em; }
.video-placeholder { position: relative; overflow: hidden; display: grid; aspect-ratio: 16 / 8.3; place-items: center; border: 1px solid rgba(255,255,255,.24); background: radial-gradient(circle at 50% 40%, rgba(255,255,255,.12), transparent 28%), linear-gradient(135deg, #050505, #202022 50%, #080808); box-shadow: 0 25px 80px rgba(0,0,0,.45); }
.video-placeholder::before, .video-placeholder::after { position: absolute; width: 72%; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.65), transparent); content: ""; transform: rotate(-9deg); }
.video-placeholder::after { transform: rotate(9deg); }
.video-placeholder > img { position: absolute; width: min(36%, 350px); opacity: .18; filter: blur(.2px) drop-shadow(0 0 24px rgba(255,255,255,.25)); }
.video-placeholder button { position: relative; z-index: 2; display: grid; width: 86px; height: 86px; place-items: center; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; background: linear-gradient(135deg, #f4f4f2, #777, #fff); box-shadow: 0 0 45px rgba(255,255,255,.18); color: #050505; font-size: 1.15rem; opacity: 1; }
.video-placeholder p { position: absolute; right: 1.4rem; bottom: 1.2rem; margin: 0; color: #8e8e8b; font-family: "DM Mono", monospace; font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; }
.application-step { margin-bottom: 4rem; }
.quiz-embed-shell { overflow: hidden; height: min(92vh, 900px); min-height: 760px; border: 1px solid rgba(255,255,255,.24); border-radius: 4px; background: #000; box-shadow: 0 25px 80px rgba(0,0,0,.5); }
.quiz-embed-shell iframe { width: 100%; height: 100%; border: 0; background: #000; }
.benefit-rail { display: grid; grid-template-columns: repeat(4, 1fr); width: min(100%, 1320px); margin: 0 auto; border-block: 1px solid var(--line); }
.benefit-rail > div { min-height: 150px; padding: 1.5rem; border-right: 1px solid var(--line); }
.benefit-rail > div:last-child { border-right: 0; }
.benefit-rail span { display: block; margin-bottom: 1.6rem; color: #666; font-family: "DM Mono", monospace; font-size: .65rem; }
.benefit-rail strong { display: block; font-size: 1rem; font-weight: 500; }
.benefit-rail p { margin: .55rem 0 0; color: #81817e; font-size: .86rem; line-height: 1.45; }

.section { padding: clamp(5.5rem, 8.5vw, 8.5rem) var(--content-gutter); }
.section-head { display: grid; grid-template-columns: .65fr 1.35fr; gap: 2rem; align-items: start; margin-bottom: clamp(3.5rem, 6vw, 6rem); }
.section h2, .manifesto h2 { margin: 0; font-size: clamp(3.7rem, 6.7vw, 7.6rem); font-weight: 550; letter-spacing: -.07em; line-height: .85; text-transform: uppercase; }
.apply h2 { width: min(100%, 1320px); margin: 0 auto; padding-inline: .12em; font-size: clamp(3.4rem, 6.8vw, 7.6rem); font-weight: 550; letter-spacing: -.065em; line-height: .9; text-transform: uppercase; }
.apply h2 .chrome-text { display: inline-block; padding-right: .24em; margin-right: -.12em; }
.section-head > div > p { max-width: 540px; margin: 2.1rem 0 0; color: #a1a19e; font-size: 1.1rem; line-height: 1.6; }
.chrome-text { background: var(--chrome); background-clip: text; color: transparent; filter: drop-shadow(0 0 20px rgba(255,255,255,.13)); }

.track-list { border-top: 1px solid var(--line); }
.track { --progress: 0%; display: grid; grid-template-columns: 60px minmax(240px, 1fr) minmax(280px, 1.7fr) 60px 110px; gap: 1.3rem; align-items: center; min-height: 128px; border-bottom: 1px solid var(--line); transition: background .25s; }
.track:hover, .track.is-playing { background: rgba(255,255,255,.035); }
.play-button { display: grid; width: 46px; height: 46px; place-items: center; border: 1px solid #8b8b88; border-radius: 50%; cursor: pointer; background: transparent; font-size: .72rem; transition: background .2s, color .2s, transform .2s; }
.play-button:hover, .is-playing .play-button { background: #eee; color: #000; transform: scale(1.05); }
.track-meta { display: flex; align-items: center; gap: 1.2rem; }
.track-number { color: #777774; font-family: "DM Mono", monospace; font-size: .74rem; }
.track h3 { margin: 0 0 .4rem; font-size: 1.35rem; font-weight: 500; letter-spacing: -.02em; }
.track p { margin: 0; color: #9e9e9b; font-family: "DM Mono", monospace; font-size: .8rem; letter-spacing: .035em; text-transform: uppercase; }
.waveform { position: relative; display: flex; height: 58px; align-items: center; justify-content: space-between; overflow: hidden; border-block: 1px solid rgba(255,255,255,.035); }
.waveform::before { position: absolute; top: 50%; right: 0; left: 0; height: 1px; background: rgba(255,255,255,.09); content: ""; }
.waveform::after { position: absolute; inset: 0 auto 0 0; width: var(--progress); border-right: 1px solid rgba(255,255,255,.7); background: linear-gradient(90deg, rgba(255,255,255,.03), rgba(255,255,255,.14)); content: ""; pointer-events: none; }
.waveform i { position: relative; z-index: 1; flex: 0 0 1px; width: 1px; height: var(--height); border-radius: 1px; background: linear-gradient(to bottom, rgba(255,255,255,.9), rgba(150,150,150,.48) 48%, rgba(245,245,245,.78)); opacity: .62; transform-origin: center; transition: opacity .2s, filter .2s; }
.is-playing .waveform i { opacity: .92; filter: drop-shadow(0 0 2px rgba(255,255,255,.32)); animation: fine-wave 900ms cubic-bezier(.45,.05,.55,.95) infinite alternate; animation-delay: calc(var(--index) * -13ms); }
@keyframes fine-wave { from { transform: scaleY(.68); } to { transform: scaleY(1.04); } }
.track-time { color: #999; font-family: "DM Mono", monospace; font-size: .72rem; }
.track-buy { border: 1px solid #555; border-radius: 100px; padding: .7rem .85rem; background: transparent; color: #aaa; font-family: "DM Mono", monospace; font-size: .66rem; letter-spacing: .06em; text-align: center; text-decoration: none; text-transform: uppercase; transition: border-color .2s, background .2s, color .2s; }
.track-buy:hover { border-color: #eee; background: #eee; color: #080808; }
.beat-contact { display: flex; align-items: center; justify-content: space-between; gap: 2rem; margin-top: 2.5rem; padding: 2rem 0; border-bottom: 1px solid var(--line); }
.beat-contact > div > span { color: #e1e1de; font-family: "DM Mono", monospace; font-size: .76rem; letter-spacing: .06em; text-transform: uppercase; }
.beat-contact p { max-width: 560px; margin: .65rem 0 0; color: #8f8f8c; font-size: 1rem; line-height: 1.55; }

.manifesto { display: grid; grid-template-columns: .78fr 1.22fr; min-height: 88vh; padding: clamp(5.5rem, 8.5vw, 8.5rem) var(--content-gutter); border-block: 1px solid var(--line); background: radial-gradient(circle at 22% 48%, #202020 0, #0c0c0d 25%, #050505 55%); }
.manifesto-mark { display: grid; grid-row: span 3; place-items: center; }
.manifesto-mark img { width: min(34vw, 470px); filter: drop-shadow(0 0 35px rgba(255,255,255,.17)); }
.manifesto-copy h2 { font-size: clamp(3.6rem, 5.9vw, 6.8rem); }
.manifesto-copy > p:last-child { max-width: 700px; margin: 2.3rem 0 3.8rem; color: #aaa9a6; font-size: 1.12rem; line-height: 1.65; }
.service-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.service-grid article { display: flex; min-height: 235px; flex-direction: column; padding: 1.6rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); transition: background .25s; }
.service-grid article:hover { background: rgba(255,255,255,.035); }
.service-grid span { color: #777; font-family: "DM Mono", monospace; font-size: .72rem; }
.service-grid h3 { margin: 1.4rem 0 .75rem; font-size: 1.12rem; font-weight: 500; }
.service-grid p { margin: 0; color: #a7a7a4; font-size: .98rem; line-height: 1.6; }
.service-action { display: inline-flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: auto; padding-top: 1.4rem; border-top: 1px solid rgba(255,255,255,.1); color: #d0d0cd; font-family: "DM Mono", monospace; font-size: .72rem; letter-spacing: .04em; text-transform: uppercase; transition: color .2s; }
.service-action:hover { color: #fff; }
.service-action b { font-size: .9rem; font-weight: 400; }
.service-contact { grid-column: 2; display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding-top: 2.4rem; }
.service-contact > div > span { color: #d7d7d4; font-family: "DM Mono", monospace; font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; }
.service-contact p { max-width: 470px; margin: .65rem 0 0; color: #8f8f8c; font-size: .95rem; line-height: 1.5; }

.pack { display: grid; grid-template-columns: 1.08fr .92fr; gap: clamp(3rem, 7vw, 8rem); align-items: center; }
.pack-visual { position: relative; }
.pack-visual::before { position: absolute; inset: 7%; z-index: -1; border-radius: 50%; background: rgba(255,255,255,.2); filter: blur(90px); content: ""; }
.pack-visual img { aspect-ratio: 1.18; width: 100%; object-fit: cover; border: 1px solid var(--line); filter: grayscale(1) contrast(1.12); clip-path: polygon(8% 0, 100% 0, 100% 92%, 92% 100%, 0 100%, 0 8%); }
.pack-copy h2 { font-size: clamp(3rem, 4.9vw, 5.7rem); }
.pack-copy > p:not(.section-label) { max-width: 590px; margin: 2rem 0; color: #aaa9a6; font-size: 1.05rem; line-height: 1.65; }
.pack-copy ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; margin: 0 0 3rem; padding: 1.7rem 0; border-block: 1px solid var(--line); list-style: none; color: #cececa; font-family: "DM Mono", monospace; font-size: .78rem; text-transform: uppercase; }
.pack-copy li::before { margin-right: .6rem; color: #777; content: "✦"; }
.pack-selector { grid-column: 1 / -1; margin-top: clamp(4.5rem, 8vw, 8rem); padding-top: 2.2rem; }
.pack-selector-head { display: grid; grid-template-columns: 1.1fr .9fr; gap: 3rem; align-items: end; margin-bottom: 2rem; }
.pack-selector-head span { color: #aaa9a6; font-family: "DM Mono", monospace; font-size: .7rem; letter-spacing: .09em; text-transform: uppercase; }
.pack-selector-head h3 { max-width: 650px; margin: .8rem 0 0; font-size: clamp(2rem, 3.7vw, 4rem); font-weight: 520; letter-spacing: -.055em; line-height: .95; text-transform: uppercase; }
.pack-selector-head > p { max-width: 470px; justify-self: end; margin: 0; color: #858582; font-size: .95rem; line-height: 1.55; }
.pack-options { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pack-option { --option-accent: 210, 210, 210; position: relative; overflow: hidden; display: grid; min-width: 0; min-height: 465px; padding: 1rem; border: 0; outline: 0; background: transparent; box-shadow: none; isolation: isolate; transition: transform .35s ease; }
.pack-option::before, .pack-option::after { display: none; }
.pack-option:hover { border: 0; outline: 0; background: transparent; box-shadow: none; transform: translateY(-5px); }
.pack-option-red { --option-accent: 255, 38, 38; }
.pack-option-blue { --option-accent: 30, 132, 255; }
.pack-option-silver { --option-accent: 220, 220, 220; }
.pack-option-orange { --option-accent: 255, 126, 0; }
.pack-option-black { --option-accent: 235, 235, 235; background: transparent; }
.pack-option-image { position: relative; overflow: hidden; aspect-ratio: 1.03; height: auto; margin: -1rem -1rem .65rem; -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 72%, transparent 100%); mask-image: linear-gradient(to bottom, #000 0%, #000 72%, transparent 100%); }
.pack-option-image::after { position: absolute; inset: 0; z-index: 2; background: rgb(var(--option-accent)); content: ""; mix-blend-mode: color; opacity: .94; pointer-events: none; }
.pack-option-black .pack-option-image::after { display: none; }
.pack-option-image img { width: 100%; height: 100%; object-fit: cover; object-position: center 40%; filter: grayscale(1) contrast(1.08) brightness(1.04) drop-shadow(0 18px 26px rgba(0,0,0,.72)); transform: scale(.94); transition: transform .5s cubic-bezier(.2,.75,.2,1), filter .35s ease; }
.pack-option:hover .pack-option-image img { filter: grayscale(1) contrast(1.12) brightness(1.08) drop-shadow(0 20px 32px rgba(var(--option-accent), .18)); transform: scale(.98); }
.pack-option-copy { align-self: end; }
.pack-option-copy > span { color: rgba(var(--option-accent), .75); font-family: "DM Mono", monospace; font-size: .6rem; letter-spacing: .08em; text-transform: uppercase; }
.pack-option h4 { margin: .45rem 0 .35rem; font-size: clamp(1.25rem, 1.55vw, 1.65rem); font-weight: 520; letter-spacing: -.035em; }
.pack-option p { margin: 0; color: #858582; font-family: "DM Mono", monospace; font-size: .67rem; letter-spacing: .04em; text-transform: uppercase; }
.pack-option-price { display: flex; align-self: end; align-items: baseline; gap: .5rem; margin-top: 1.15rem; font-family: "DM Mono", monospace; }
.pack-option-price small { color: #646461; font-size: .48rem; letter-spacing: .06em; text-transform: uppercase; }
.pack-option-price del { color: #a4a4a0; font-size: 1rem; font-weight: 500; letter-spacing: -.025em; text-decoration-color: rgba(var(--option-accent), .9); text-decoration-thickness: 1.5px; }
.pack-option-price strong { color: rgb(var(--option-accent)); font-size: 1.25rem; font-weight: 500; }
.pack-option > b:not(.pack-badge) { position: absolute; right: 1.1rem; bottom: 1.05rem; color: rgba(var(--option-accent), .72); font-size: .85rem; font-weight: 400; }
.pack-badge { position: absolute; top: .8rem; right: .8rem; z-index: 3; padding: .45rem .6rem; border: 0; border-radius: 100px; background: rgba(5,5,5,.72); color: #eee; font-family: "DM Mono", monospace; font-size: .52rem; font-weight: 400; letter-spacing: .06em; text-transform: uppercase; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }

.apply { position: relative; overflow: hidden; display: grid; min-height: 88vh; place-items: center; align-content: center; padding: 8rem var(--content-gutter); border-top: 1px solid var(--line); text-align: center; isolation: isolate; }
.apply::before { position: absolute; inset: 8% 18%; z-index: -2; background: url("assets/brand/nxteamlab-flame-256.png") center / contain no-repeat; opacity: .075; filter: blur(1px); content: ""; }
.apply-shine { position: absolute; z-index: -1; width: 90vw; height: 35vw; border-radius: 50%; background: rgba(255,255,255,.09); filter: blur(100px); }
.apply .section-label { margin-bottom: 2.5rem; }
.apply > p:not(.section-label) { max-width: 650px; margin: 2.5rem auto; color: #aaa9a6; font-size: 1.25rem; line-height: 1.6; }

.site-footer { display: grid; grid-template-columns: 1.5fr 1fr 1fr auto; width: 100%; gap: 2rem; align-items: end; margin-inline: auto; padding: 4rem var(--content-gutter); border: 0; border-top: 1px solid var(--line); color: #9b9b98; font-family: "DM Mono", monospace; font-size: .82rem; line-height: 1.8; letter-spacing: .05em; text-transform: uppercase; }
.site-footer .site-logo { align-self: center; color: #eee; font-family: "Inter Tight", sans-serif; font-size: 1.25rem; text-transform: none; }
.site-footer p { margin: 0; }
.site-footer > div { display: flex; flex-direction: column; }

.reveal { opacity: 0; transform: translateY(28px); transition: opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1); }
.reveal.is-visible { opacity: 1; transform: none; }

/* Premium motion and finish */
::selection { background: #e8e8e5; color: #050505; }
body { background: #030303; }
body::before { background: radial-gradient(circle at 78% 10%, rgba(255,255,255,.11), transparent 24%), radial-gradient(circle at 14% 48%, rgba(255,255,255,.045), transparent 20%), linear-gradient(180deg, #030303, #070707 48%, #020202); }
.grain { opacity: .035; }
.scroll-progress { position: fixed; top: 0; left: 0; z-index: 120; width: 100%; height: 2px; contain: strict; pointer-events: none; }
.scroll-progress span { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, #4b4b4b, #fff 45%, #8c8c8c 74%, #fff); box-shadow: 0 0 12px rgba(255,255,255,.45); transform: scale3d(var(--scroll-progress, 0), 1, 1); transform-origin: left center; will-change: transform; backface-visibility: hidden; }

.site-header { top: 12px; width: min(calc(100% - 44px), 1210px); height: 58px; padding-inline: clamp(1.15rem, 2.5vw, 2.25rem); border-color: rgba(255,255,255,.14); background: linear-gradient(180deg, rgba(23,23,25,.72), rgba(2,2,3,.68)); box-shadow: inset 0 1px 0 rgba(255,255,255,.17), inset 0 -1px 0 rgba(255,255,255,.035), 0 16px 55px rgba(0,0,0,.58); -webkit-backdrop-filter: blur(28px) saturate(155%); backdrop-filter: blur(28px) saturate(155%); }
.site-header::before { background: linear-gradient(108deg, rgba(255,255,255,.09), transparent 19%, transparent 74%, rgba(255,255,255,.035)); background-size: 100% 100%; animation: none; }
.site-header.is-compact { top: 7px; width: min(calc(100% - 64px), 1120px); height: 48px; padding-inline: clamp(1.05rem, 2.1vw, 1.9rem); background: linear-gradient(180deg, rgba(20,20,22,.84), rgba(0,0,0,.79)); box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 12px 38px rgba(0,0,0,.65); }
.site-logo { gap: .65rem; font-size: 1.18rem; }
.site-logo img { width: 28px; height: 36px; }
.site-header.is-compact .site-logo img { width: 24px; height: 31px; }
.desktop-nav { gap: clamp(1.8rem, 3vw, 3rem); font-size: .7rem; letter-spacing: .13em; }
.desktop-nav a { position: relative; padding-block: .7rem; }
.desktop-nav a::after { position: absolute; right: 50%; bottom: .25rem; left: 50%; height: 1px; background: #fff; content: ""; transition: right .3s ease, left .3s ease; }
.desktop-nav a:hover::after, .desktop-nav a.is-active::after { right: 0; left: 0; }
.header-cta { min-height: 34px; gap: 1.15rem; padding: .45rem .9rem; border-color: rgba(255,255,255,.17); font-size: .64rem; letter-spacing: .1em; }
.site-header.is-compact .header-cta { min-height: 31px; }

/* Borderless rectangular glass header */
.site-header,
.site-header.is-compact {
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(5,5,6,.72) 7%, rgba(7,7,8,.88) 19%, rgba(5,5,6,.9) 50%, rgba(7,7,8,.88) 81%, rgba(5,5,6,.72) 93%, transparent 100%);
  box-shadow: 0 22px 54px -34px rgba(0,0,0,.95);
}
.site-header::before { background: linear-gradient(90deg, transparent 3%, rgba(255,255,255,.025) 18%, rgba(255,255,255,.055) 50%, rgba(255,255,255,.025) 82%, transparent 97%); }
.site-header::after { display: none; }
.header-cta { border-radius: 4px; }

.hero { min-height: 100svh; padding-top: 9.5rem; padding-bottom: 5.5rem; }
.hero::before { position: absolute; top: 20%; right: -10%; z-index: -2; width: 72vw; height: 72vw; border-radius: 50%; background: conic-gradient(from 220deg, transparent, rgba(255,255,255,.025), transparent 30%); filter: blur(20px); content: ""; animation: slow-orbit 24s linear infinite; }
.hero-aura { opacity: .65; animation: aura-breathe 8s ease-in-out infinite; }
.hero-copy { padding-bottom: 2vh; }
.kicker, .section-label { font-size: .68rem; letter-spacing: .16em; }
.hero h1 { font-size: clamp(4.9rem, 8.2vw, 9.4rem); line-height: .79; text-wrap: balance; }
.hero h1 em, .chrome-text { background-size: 240% 100%; animation: chrome-flow 8s ease-in-out infinite; }
.hero-intro { max-width: 560px; margin-top: 2.5rem; color: #aaa; font-size: clamp(1.08rem, 1.35vw, 1.32rem); }
.hero-actions { gap: 1rem; }
.chrome-button { position: relative; overflow: hidden; min-height: 54px; gap: 1.8rem; padding-inline: 1.45rem; border-color: rgba(255,255,255,.5); background: linear-gradient(105deg, #f3f3f1, #777 30%, #fff 51%, #676767 74%, #f4f4f2); background-size: 190% 100%; box-shadow: inset 0 1px 0 #fff, 0 10px 38px rgba(0,0,0,.35), 0 0 24px rgba(255,255,255,.06); font-size: .7rem; transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, background-position .5s ease; }
.chrome-button::after { position: absolute; top: -50%; bottom: -50%; left: -35%; width: 22%; background: rgba(255,255,255,.72); content: ""; filter: blur(14px); opacity: 0; transform: skewX(-20deg); transition: left .7s ease, opacity .25s ease; }
.chrome-button:hover { background-position: 100% 0; box-shadow: inset 0 1px 0 #fff, 0 14px 44px rgba(0,0,0,.42), 0 0 35px rgba(255,255,255,.16); transform: translateY(-3px); }
.chrome-button:hover::after { left: 120%; opacity: .55; }
.text-link { border-color: rgba(255,255,255,.24); font-size: .7rem; letter-spacing: .08em; transition: color .25s, border-color .25s; }
.text-link:hover { border-color: #fff; color: #fff; }
.hero-visual { transform: none; }
.hero-visual::before, .hero-visual::after { position: absolute; z-index: 1; width: 42%; height: 66%; border-radius: 50%; background: radial-gradient(ellipse, rgba(235,235,235,.14), rgba(135,135,135,.055) 36%, transparent 70%); content: ""; filter: blur(30px); mix-blend-mode: screen; pointer-events: none; }
.hero-visual::before { top: 13%; left: 3%; animation: smoke-drift-left 9s ease-in-out infinite alternate; }
.hero-visual::after { right: 2%; bottom: 9%; animation: smoke-drift-right 11s ease-in-out infinite alternate; }
.image-frame { z-index: 0; filter: saturate(0) contrast(1.28) brightness(1.12); transform: scale(1.025); animation: none; }
.image-frame::after { position: absolute; inset: 0; background: linear-gradient(115deg, transparent 36%, rgba(255,255,255,.12) 48%, transparent 58%); background-size: 230% 100%; content: ""; mix-blend-mode: screen; animation: media-specular 9s ease-in-out infinite; }
.visual-stamp { color: #7c7c79; }
.ticker { --ticker-angle: -1deg; position: relative; display: flex; height: 88px; align-items: center; padding: 0; border: 0; background: transparent; box-shadow: none; transform: none; isolation: isolate; }
.ticker::before { position: absolute; top: 50%; left: -3%; z-index: -1; width: 106%; height: 58px; background: linear-gradient(110deg, #eee, #8b8b88 24%, #fafafa 50%, #858582 72%, #eee); box-shadow: 0 0 40px rgba(255,255,255,.1); content: ""; transform: translateY(-50%) rotate(var(--ticker-angle)); transform-origin: center; }
.ticker-track { transform: rotate(var(--ticker-angle)); transform-origin: center; }

.production-flow { background: radial-gradient(circle at 50% 19%, rgba(255,255,255,.12), transparent 22%), linear-gradient(180deg, #080809, #030303 70%); }
.production-flow::before { position: absolute; inset: 0; background: linear-gradient(110deg, transparent 20%, rgba(255,255,255,.025) 50%, transparent 80%); content: ""; pointer-events: none; }
.flow-heading { position: relative; }
.flow-heading h2 { font-size: clamp(3rem, 5.35vw, 6rem); }
.flow-step { position: relative; }
.video-placeholder, .quiz-embed-shell { border-color: rgba(255,255,255,.14); border-radius: 18px; background-color: #050505; box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 30px 90px rgba(0,0,0,.5); }
.video-placeholder { background: radial-gradient(circle at 50% 42%, rgba(255,255,255,.13), transparent 25%), linear-gradient(135deg, #030303, #171719 48%, #030303); }
.video-placeholder button { width: 76px; height: 76px; border-color: rgba(255,255,255,.45); box-shadow: 0 0 55px rgba(255,255,255,.16); transition: transform .4s ease, box-shadow .4s ease; }
.video-placeholder:hover button { box-shadow: 0 0 75px rgba(255,255,255,.28); transform: scale(1.08); }
.benefit-rail { border-color: rgba(255,255,255,.09); }
.benefit-rail > div { position: relative; border-color: rgba(255,255,255,.09); transition: background .3s ease, transform .3s ease; }
.benefit-rail > div:hover { background: rgba(255,255,255,.025); transform: translateY(-4px); }

.section { position: relative; }
.section::before { position: absolute; top: 0; right: var(--content-gutter); left: var(--content-gutter); height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.16), transparent); content: ""; }
.section h2, .manifesto h2 { text-wrap: balance; }
.track-list { border-color: rgba(255,255,255,.09); }
.track { min-height: 146px; border-color: rgba(255,255,255,.09); transition: background .35s ease, transform .35s ease; }
.track:hover, .track.is-playing { background: linear-gradient(90deg, rgba(255,255,255,.045), transparent 76%); transform: translateX(5px); }
.play-button { width: 50px; height: 50px; border-color: rgba(255,255,255,.4); box-shadow: inset 0 0 0 0 #fff, 0 0 0 rgba(255,255,255,0); transition: box-shadow .3s ease, background .3s, color .3s, transform .3s; }
.play-button:hover, .is-playing .play-button { box-shadow: inset 0 0 0 25px #eee, 0 0 28px rgba(255,255,255,.12); }
.track h3 { font-size: clamp(1.35rem, 1.9vw, 1.9rem); }
.waveform { height: 64px; border: 0; }
.waveform i { opacity: .48; }
.track-buy { border-color: rgba(255,255,255,.18); transition: border-color .25s, background .25s, color .25s, transform .25s; }
.track-buy:hover { transform: translateY(-2px); }

.manifesto { background: radial-gradient(circle at 17% 45%, rgba(255,255,255,.1), transparent 22%), linear-gradient(150deg, #09090a, #030303 62%); }
.manifesto-mark img { animation: mark-float 8s ease-in-out infinite; }
.service-grid { border-color: rgba(255,255,255,.08); }
.service-grid article { position: relative; overflow: hidden; border-color: rgba(255,255,255,.08); transition: background .35s ease, transform .35s ease; }
.service-grid article::after { position: absolute; right: 0; bottom: 0; left: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent); content: ""; opacity: 0; transform: scaleX(.4); transition: opacity .35s, transform .35s; }
.service-grid article:hover { background: linear-gradient(145deg, rgba(255,255,255,.045), transparent); transform: translateY(-4px); }
.service-grid article:hover::after { opacity: 1; transform: scaleX(1); }

.pack-visual img { border: 0; filter: grayscale(1) contrast(1.18); -webkit-mask-image: radial-gradient(ellipse, #000 48%, transparent 100%); mask-image: radial-gradient(ellipse, #000 48%, transparent 100%); }
.pack-option { transition: transform .5s cubic-bezier(.2,.75,.2,1); perspective: 900px; }
.pack-option:hover { transform: translateY(-7px); }
.pack-option-image { background: #030303; }
.pack-option-image img { filter: grayscale(1) contrast(1.12) brightness(1.03); transform: scale(.97); }
.pack-option:hover .pack-option-image img { transform: scale(1.015); }
.pack-option-price strong { font-size: 1.45rem; }
.pack-badge { background: rgba(3,3,3,.76); box-shadow: 0 8px 28px rgba(0,0,0,.45); }

.apply { min-height: 92vh; background: radial-gradient(ellipse at center, rgba(255,255,255,.08), transparent 38%), #030303; }
.apply::before { opacity: .09; animation: watermark-breathe 7s ease-in-out infinite; }
.apply h2 { font-size: clamp(3.8rem, 7.3vw, 8rem); }
.site-footer { border-color: rgba(255,255,255,.09); background: #020202; }

.reveal { opacity: 0; transform: translateY(34px) scale(.988); filter: blur(5px); transition: opacity 1s cubic-bezier(.18,.8,.2,1), transform 1s cubic-bezier(.18,.8,.2,1), filter 1s ease; transition-delay: var(--reveal-delay, 0ms); }
.reveal.is-visible { opacity: 1; filter: blur(0); transform: none; }

@keyframes chrome-flow { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@keyframes header-specular { 0%, 100% { background-position: 0 0; } 50% { background-position: 100% 0; } }
@keyframes slow-orbit { to { transform: rotate(360deg); } }
@keyframes aura-breathe { 0%, 100% { opacity: .48; transform: scale(.94); } 50% { opacity: .78; transform: scale(1.05); } }
@keyframes product-float { 0%, 100% { transform: scale(1.025) translateY(0); } 50% { transform: scale(1.035) translateY(-10px); } }
@keyframes smoke-drift-left { from { opacity: .42; transform: translate3d(-5%, 5%, 0) scale(.92) rotate(-4deg); } to { opacity: .82; transform: translate3d(9%, -8%, 0) scale(1.12) rotate(7deg); } }
@keyframes smoke-drift-right { from { opacity: .34; transform: translate3d(6%, 8%, 0) scale(.9) rotate(5deg); } to { opacity: .74; transform: translate3d(-8%, -6%, 0) scale(1.15) rotate(-7deg); } }
@keyframes media-specular { 0%, 20% { background-position: 180% 0; } 65%, 100% { background-position: -80% 0; } }
@keyframes mark-float { 0%, 100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-14px) rotate(1deg); } }
@keyframes watermark-breathe { 0%, 100% { opacity: .055; transform: scale(.96); } 50% { opacity: .11; transform: scale(1.03); } }

@media (max-width: 980px) {
  .site-header { grid-template-columns: 1fr auto; }
  .desktop-nav { position: fixed; top: 108px; right: 14px; left: 14px; display: none; flex-direction: column; gap: 0; padding: 1rem var(--pad) 1.5rem; border: 1px solid rgba(255,255,255,.14); border-radius: 24px; background: rgba(7,7,8,.9); -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px); }
  .desktop-nav.is-open { display: flex; }
  .desktop-nav a { padding: 1rem 0; border-bottom: 1px solid var(--line); }
  .header-cta { display: none; }
  .menu-toggle { display: block; }
  .hero { grid-template-columns: 1fr; padding-top: 9rem; }
  .hero-copy { padding: 3rem 0 4rem; }
  .hero h1 { font-size: clamp(4rem, 15vw, 8rem); }
  .hero-visual { width: 88%; margin-left: auto; }
  .section-head { grid-template-columns: 1fr; }
  .track { grid-template-columns: 48px 1fr 112px; padding: 1.1rem 0; }
  .waveform { grid-column: 2 / 4; grid-row: 2; }
  .track-time { display: none; }
  .manifesto { grid-template-columns: 1fr; }
  .manifesto-mark { grid-row: auto; }
  .manifesto-mark img { width: min(65vw, 420px); }
  .pack { grid-template-columns: 1fr; }
  .pack-selector { grid-column: auto; }
  .pack-selector-head { grid-template-columns: 1fr; gap: 1.2rem; }
  .pack-selector-head > p { justify-self: start; }
  .pack-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-contact { grid-column: auto; }
  .site-footer { grid-template-columns: 1fr 1fr; }
  .benefit-rail { grid-template-columns: repeat(2, 1fr); }
  .benefit-rail > div:nth-child(2) { border-right: 0; }
  .benefit-rail > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
}

@media (max-width: 620px) {
  :root { --pad: 1rem; }
  body > main { border-inline: 0; }
  .site-header { top: 7px; width: calc(100% - 8px); height: 52px; padding-inline: .9rem; border-radius: 0; }
  .site-header.is-compact { top: 4px; width: calc(100% - 24px); height: 46px; padding-inline: .8rem; }
  .site-logo { font-size: 1.08rem; }
  .site-logo img { width: 24px; height: 31px; }
  .site-header.is-compact .site-logo img { width: 21px; height: 27px; }
  .desktop-nav { top: 74px; right: 8px; left: 8px; border-radius: 20px; }
  .hero { min-height: auto; padding: 7.5rem 1rem 3rem; }
  .hero-copy { padding: 1.5rem 0 3rem; }
  .hero h1 { font-size: clamp(3.5rem, 18vw, 5.4rem); line-height: .82; }
  .hero-intro { margin: 2rem 0; font-size: 1.08rem; }
  .hero-actions { align-items: flex-start; flex-direction: column; }
  .hero-visual { width: 100%; }
  .visual-stamp { display: none; }
  .production-flow, .section, .manifesto, .pack, .apply { padding-right: 1rem; padding-left: 1rem; }
  .production-flow { padding-top: 5rem; padding-bottom: 5rem; }
  .flow-step { margin-bottom: 4rem; }
  .section h2, .manifesto h2, .apply h2 { font-size: clamp(3rem, 15vw, 5rem); }
  .track { grid-template-columns: 42px minmax(0, 1fr) 92px; gap: .65rem; }
  .track-number { display: none; }
  .track-meta { gap: 0; }
  .track h3 { font-size: 1.18rem; }
  .waveform { grid-column: 1 / 4; }
  .track-buy { padding-inline: .45rem; font-size: .58rem; }
  .service-grid { grid-template-columns: 1fr; }
  .service-grid article { min-height: 220px; padding: 1.4rem; }
  .service-contact { align-items: flex-start; flex-direction: column; }
  .beat-contact { align-items: flex-start; flex-direction: column; }
  .flow-heading { text-align: left; }
  .flow-heading .section-label { justify-content: flex-start; }
  .flow-heading h2 { font-size: clamp(2.8rem, 13vw, 4.5rem); }
  .flow-heading > p:last-child { margin-left: 0; }
  .step-heading { align-items: flex-start; flex-direction: column; gap: .6rem; }
  .video-placeholder { aspect-ratio: 4 / 3; }
  .video-placeholder button { width: 68px; height: 68px; }
  .quiz-embed-shell { height: 800px; min-height: 0; }
  .benefit-rail { grid-template-columns: 1fr; }
  .benefit-rail > div, .benefit-rail > div:nth-child(2) { border-right: 0; border-bottom: 1px solid var(--line); }
  .benefit-rail > div:last-child { border-bottom: 0; }
  .pack-copy ul { grid-template-columns: 1fr; }
  .pack-selector { margin-top: 4rem; }
  .pack-selector-head h3 { font-size: clamp(2.2rem, 11vw, 3.4rem); }
  .pack-options { display: flex; overflow-x: auto; margin-right: -1rem; margin-left: -1rem; padding: 0 1rem 1rem; border: 0; scroll-padding-left: 1rem; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .pack-options::-webkit-scrollbar { display: none; }
  .pack-option { flex: 0 0 min(82vw, 330px); min-height: 485px; border: 0; scroll-snap-align: start; }
  .pack-option:hover { transform: none; }
  .site-footer { grid-template-columns: 1fr; }
  .apply { min-height: 76vh; padding-top: 6rem; padding-bottom: 6rem; }
  .apply h2 { padding-inline: 0; font-size: clamp(3.1rem, 14.5vw, 4.7rem); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

@media (hover: none), (pointer: coarse) {
  .pack-option:hover, .track:hover, .service-grid article:hover { transform: none; }
}