/* A product-led listening room: one sculptural object, then an editorial journey. */
:root{--stage:#100c1e;--stage-raised:#211a34;--stage-ink:#fbf6e9;--bronze:#d7b36d;--paper:#faf5ea;--paper-deep:#ede3d4;--text:#21182b;--quiet:#5a4b60}
html{scroll-padding-top:84px}body{background:var(--paper);color:var(--text);overflow-x:clip;font-size:16px}header{position:sticky;top:0;z-index:30;background:#120e20ee;border-bottom:1px solid #dcc28b30;backdrop-filter:blur(18px)}.nav{max-width:1200px;min-height:72px;padding:9px 28px;border:0}.brand{font-size:1.2rem;letter-spacing:.02em;color:#f3dfa8}.nav-links{align-items:center;gap:30px}.nav-links a{color:#f9f4e9;font-size:.85rem;font-weight:600}.nav-links a:hover{color:#f3d18d}.wrap{max-width:1200px}.eyebrow{font-size:.76rem;letter-spacing:.18em;color:#674822}.muted{color:var(--quiet)}h1,h2,h3{text-wrap:balance}h1{letter-spacing:-.045em}.btn{min-height:50px;padding:13px 24px;border-radius:999px;background:#e1bc75;color:#17101f;box-shadow:0 8px 28px #100a2040;transition:transform .25s,box-shadow .25s,background .25s}.btn:hover{transform:translateY(-3px);box-shadow:0 13px 32px #100a2055}.btn:active{transform:translateY(1px)}.btn.outline{border-color:#ddc797;background:#ffffff0a;color:#f7e8c9;box-shadow:none}.btn.outline:hover{background:#ffffff1e}.btn:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #f2c977;outline-offset:4px}
/* The image retains its real aspect ratio; the former HTML height attribute must not stretch it. */
.hero{color:#f8f3e8;background:#100c1e;isolation:isolate}
/* Cosmic number field sits behind the copy and the artwork, never over them. */
.cosmos{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.hero-art{z-index:2}.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 75% 43%,#433159 0%,#21172e 37%,#100c1e 76%);pointer-events:none}.hero:after{content:"";position:absolute;inset:0;opacity:.35;background-image:radial-gradient(#e0bf8d 0.5px,transparent 0.5px);background-size:33px 33px;mask-image:linear-gradient(to left,#000,transparent 62%);pointer-events:none}.hero .wrap{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);min-height:750px;padding-top:78px;padding-bottom:84px;gap:44px}.hero-copy{position:relative;z-index:2}.hero .eyebrow{color:#f2cf8b;font-size:.78rem}.hero h1{color:#fff9ed;font-size:clamp(3.4rem,5.8vw,6rem);line-height:1.04;max-width:640px;margin:.36em 0 .32em}.hero h1 em{color:#efd095}.hero p.lede{color:#f2e9e9;font-size:1.12rem;line-height:1.72;max-width:540px}.hero-actions{margin-top:35px}.hero-actions .btn{min-width:218px}.stat-line{border-color:#ebd6af46;color:#e9dfeb;margin-top:44px;gap:16px 30px}.stat-line strong{color:#f6d797}.hero-art{margin:0;max-width:none;width:100%;min-width:0;justify-self:stretch;display:grid;place-items:center;position:relative}.hero-art:before{content:none}.hero-stage{width:min(100%,525px);height:600px;position:relative;display:grid;place-items:center;perspective:1100px;--rx:0deg;--ry:0deg}.stage-glow{position:absolute;width:78%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#bb94616b 0%,#a56f8630 33%,transparent 72%);filter:blur(22px);animation:breathe 9s ease-in-out infinite}.orbit{position:absolute;width:94%;aspect-ratio:1;border:1px solid #dec49154;border-radius:50%;transform:rotate(-22deg) scaleY(.59);box-shadow:0 0 55px #b99a5140,inset 0 0 45px #b99a511c}.orbit:after{content:"";position:absolute;left:10%;top:16%;width:8px;height:8px;border-radius:50%;background:#f2d08c;box-shadow:0 0 22px 6px #deb36e}.orbit.outer{width:110%;border-color:#f5dfae23;transform:rotate(24deg) scaleY(.72)}.book-float{position:relative;width:min(66%,320px);animation:float 7s ease-in-out infinite;filter:drop-shadow(36px 46px 35px #06030e9c)}.book-cover{position:relative;width:100%;transform:rotateY(calc(-11deg + var(--ry))) rotateX(var(--rx)) rotateZ(2deg);transform-style:preserve-3d;transition:transform .55s cubic-bezier(.2,.75,.2,1);border:1px solid #e2c99491;background:#191226;box-shadow:-7px 8px 0 #4b385e,-11px 12px 0 #1e162d,0 0 35px #f9d18e25}.book-cover:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,#ffffff22 0%,transparent 24%,transparent 68%,#fff2bd15 100%)}.hero-art img{display:block;width:100%;height:auto;max-width:100%;aspect-ratio:1600 / 2071;object-fit:contain;border:0;box-shadow:none}.stage-label{position:absolute;right:0;bottom:40px;display:flex;align-items:center;gap:12px;padding:11px 17px;border:1px solid #e7c99872;background:#211a32;color:#f7e6c8;box-shadow:0 14px 35px #0905126b;font-size:.74rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase}.stage-label:before{content:"";width:9px;height:9px;border:1px solid #edca8a;border-radius:50%;box-shadow:0 0 0 4px #e1be7823}.edition{position:absolute;left:8%;bottom:10px;color:#eadabb;font-size:.72rem;letter-spacing:.18em}
/* Editorial scene: the human application, not another feature grid. */
.story{position:relative;min-height:520px;padding:108px 28px 102px;grid-template-columns:.87fr 1.13fr;gap:8vw}.story:after{content:"318798";position:absolute;bottom:-.18em;left:2%;font:9rem/1 Georgia,serif;color:#b1996a10;pointer-events:none}.story h2{max-width:430px}.story .pull{color:#533664;font-size:clamp(1.7rem,3vw,2.65rem);max-width:440px}.storybody{color:#382e3d}.storybody p{line-height:1.7}.micro{color:#64566a}
/* Interactive journal: the quiz is an object on an open, warm field. */
.quiz-section{background:#ede2d2;padding:104px 0 110px}.quiz-section .wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:60px;align-items:start}.quiz-top{text-align:left;max-width:380px;margin:25px 0 0}.quiz-top h2{font-size:clamp(2.5rem,4vw,3.9rem);line-height:1.07}.quiz-top .muted{font-size:1.04rem;line-height:1.75;color:#514254}.quiz-shell{width:100%;max-width:none;margin:0;padding:clamp(28px,4vw,50px);background:#21192f;color:#faf5e9;border:1px solid #d2b88570;box-shadow:20px 25px 0 #c4b19469,0 30px 62px #3524424d}.progress{background:#685b71;height:6px}.progress span{background:#e4be76}.question-number{color:#f3d393;font-size:.77rem}.question h3{font-size:clamp(1.65rem,2.5vw,2.35rem);margin:13px 0 26px;color:#fffaf0}.options{gap:12px}.option span{min-height:88px;border:1px solid #a99aaa79;background:#30253d;color:#faf5ef;padding:19px;transition:border-color .25s,transform .25s,background .25s,box-shadow .25s}.option:hover span{border-color:#e4c18a;transform:translateY(-2px);background:#3b2b4e}.option input:checked+span{border-color:#e9c783;background:#554061;box-shadow:inset 0 0 0 1px #efd399,0 6px 18px #0b061b6b}.option input:focus-visible+span{outline:3px solid #f5cd77}.quiz-controls{margin-top:30px}.quiz-controls button.secondary{color:#f5d595;font-size:1rem;min-height:48px;padding:12px}.quiz-error{color:#ffc3cb}.results{grid-column:1/-1;margin:45px 0 0;width:100%;max-width:none}.results-head h2{max-width:550px}.result-grid{gap:16px}.result-card{position:relative;padding:29px 27px 32px;background:#21192f;border-top:2px solid #e5c384;box-shadow:9px 12px 0 #c5b29977;transition:transform .28s,box-shadow .28s}.result-card:hover{transform:translateY(-5px);box-shadow:9px 17px 0 #c5b29977}.result-card h3{color:#fff7e9;font-size:1.65rem}.result-card p{font-size:.93rem;color:#f0e6eb}.results-note{color:#4e3e54;font-size:.95rem;line-height:1.7}
.method{padding-top:110px;padding-bottom:110px}.method-head{max-width:680px}.method-step{grid-template-columns:80px 260px minmax(0,1fr);padding:31px 6px;transition:padding .3s,background .3s}.method-step:hover{background:#f1e9da;padding-left:18px;padding-right:18px}.method-step .index{font-size:2.7rem;color:#755127}.method-step h3{font-size:1.55rem}.method-step p{font-size:1rem;color:#55475c;line-height:1.7}
.offers{background:#130f21;padding:110px 0 120px}.offer-head{margin-bottom:46px}.offer-head h2{max-width:800px}.offer-head p{font-size:1.08rem}.pricing{gap:24px}.price-card{position:relative;padding:clamp(30px,4vw,48px);border:1px solid #c8ac805a;background:#281f3b;box-shadow:0 28px 60px #0904135b}.price-card.featured{background:#f5e9d2;color:#22192c;box-shadow:13px 15px 0 #b79a6666,0 32px 70px #05020d66}.price-card .flag{color:#f4d190;font-size:.76rem}.price-card.featured .flag{color:#62451e}.price-card h3{font-size:clamp(2rem,3vw,2.7rem);margin:18px 0}.price-card .price{font-size:clamp(4.5rem,6vw,5.8rem);letter-spacing:-.04em}.price-card .was{opacity:1;color:#d8c9d7;font-size:1rem;letter-spacing:0}.price-card.featured .was{color:#514454}.price-card ul{padding-left:21px;line-height:2;color:#f6eef5}.price-card.featured ul{color:#322538}.price-card li{padding-left:4px}.price-card .btn{margin-top:20px;min-height:54px}.price-card.featured .btn{background:#21192e;color:#fff9ef}.price-card.featured .btn:hover{background:#48315a}.price-note{color:#e5d7e3;font-size:.88rem}.price-card.featured .price-note{color:#4e4050}
.checkout{padding:110px 0;background:#f7f0e5}.checkout-wrap{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:85px}.checkout-wrap>div{padding-top:20px}.checkout-wrap h2{max-width:500px}.checkout-form{padding:clamp(28px,4vw,50px);border:1px solid #c9b7a3;background:#fffdf7;box-shadow:14px 16px 0 #e5d7c4,0 30px 65px #47344919}.field input{border-color:#aa9ba5;background:#fff;color:#24192f;border-radius:4px}.field input:focus{border-color:#795d92;outline:3px solid #ccb2df66}.checkout-form h3{font-size:2.25rem}.checkout-form .btn.outline{color:#3a2b47;border-color:#795d92;background:#f5ecf4}.checkout-form .btn.outline:hover{background:#e9dbee}.checkout-error{color:#a22b38}.disclosure{font-size:.89rem;color:#534758;line-height:1.68}
.faq{background:#f7f0e5;padding:75px 0 105px}.faq h2{max-width:630px}.faq details{padding:21px 0}.faq summary{font-size:1.06rem;color:#2e2037;min-height:44px;display:list-item;align-content:center}.faq p{color:#52465a;line-height:1.68}footer{background:#130f21;color:#e8dce4;font-size:.86rem}footer a{color:#f2ce8b}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-13px)}}@keyframes breathe{0%,100%{opacity:.62;transform:scale(.96)}50%{opacity:1;transform:scale(1.08)}}
.reveal{transition:transform .7s ease,opacity .7s ease}.motion-ready .reveal{opacity:.88;transform:translateY(16px)}.motion-ready .reveal.is-visible{opacity:1;transform:translateY(0)}
@media(max-width:900px){.hero .wrap{gap:14px}.hero-stage{height:530px}.quiz-section .wrap{gap:30px}.story{gap:35px}.checkout-wrap{gap:30px}}
@media(max-width:760px){html{scroll-padding-top:70px}.hero .wrap{grid-template-columns:minmax(0,1fr)}.nav{min-height:64px;padding:8px 20px}.brand{font-size:1.02rem;max-width:128px;line-height:1.15}.nav-links{gap:14px}.nav-links a{font-size:.76rem;white-space:nowrap}.nav-links a:nth-child(2){display:none}.hero .wrap{padding-top:60px;padding-bottom:70px;gap:10px}.hero h1{font-size:clamp(3.1rem,12vw,4.5rem);max-width:550px}.hero p.lede{font-size:1.04rem;line-height:1.68}.hero-actions{margin-top:28px}.hero-actions .btn{min-width:0}.stat-line{margin-top:35px;font-size:.81rem;gap:10px 17px}.hero-stage{height:440px;width:min(100%,410px)}.book-float{width:min(58%,240px)}.stage-label{bottom:16px;right:0;font-size:.65rem;padding:9px 12px}.edition{bottom:2px;left:1%;font-size:.62rem}.story{min-height:0;padding:78px 20px 86px;grid-template-columns:minmax(0,1fr);gap:30px}.edition{display:none}.story:after{font-size:5rem}.quiz-section{padding:76px 0 85px}.quiz-section .wrap{display:block}.quiz-top{margin:0 0 28px;max-width:590px}.quiz-top h2{font-size:2.6rem}.quiz-shell{box-shadow:9px 12px 0 #c4b19469,0 18px 45px #3524423d}.question h3{font-size:1.85rem}.options{grid-template-columns:1fr}.option span{min-height:66px}.results{margin-top:46px}.result-grid{grid-template-columns:1fr}.results-head{display:block}.method{padding-top:80px;padding-bottom:80px}.method-step{grid-template-columns:52px 1fr}.offers{padding:80px 0 92px}.pricing{gap:20px}.price-card{padding:30px}.price-card ul{min-height:0}.price-card.featured{box-shadow:8px 10px 0 #b79a6666}.checkout{padding:80px 0}.checkout-wrap{display:block}.checkout-form{margin-top:30px;box-shadow:8px 10px 0 #e5d7c4}.faq{padding:65px 0 80px}}
@media(max-width:380px){.nav-links a:first-child{display:none}.hero-actions{display:grid}.hero-actions .btn{width:100%}.hero-stage{height:390px}.book-float{width:58%}.stage-label{right:0;bottom:2px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.motion-ready .reveal{opacity:1;transform:none}.hero-stage{--rx:0deg!important;--ry:0deg!important}}