body{margin:0;background:#0A0A0A}
html{scroll-behavior:smooth}
a{color:#F4F2EE}a:hover{color:#FFFFFF}
.mx{--ink:#F4F2EE;--mute:#9A9792;--line:rgba(244,242,238,.14);--tile:#161616;--paper:#EEEBE5;font-family:Poppins,system-ui,sans-serif;color:var(--ink);background:#0A0A0A;overflow-x:clip;-webkit-font-smoothing:antialiased}
.mx *{box-sizing:border-box}
.mx img{display:block}
.serif{font-family:'Instrument Serif',Georgia,serif;font-weight:400;font-style:italic;letter-spacing:-.01em}
.mono{font-family:'JetBrains Mono',ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase}
.in{width:100%;max-width:1080px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}
.in-w{width:100%;max-width:1300px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}

/* NAV */
.nav{position:fixed;top:0;left:0;right:0;z-index:60;transition:background .4s,border-color .4s;border-bottom:1px solid transparent}
.nav.on{background:rgba(10,10,10,.72);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border-color:var(--line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:20px;height:60px}
.logo{font-weight:800;font-size:18px;text-decoration:none;color:var(--ink);white-space:nowrap}
.nav-r{display:flex;align-items:center;gap:26px}
.nav-r a.l{font-size:13px;color:var(--mute);text-decoration:none}
.nav-r a.l:hover{color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 26px;border-radius:999px;font-weight:600;font-size:15px;text-decoration:none;white-space:nowrap;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s,background .25s}
.btn-w{background:var(--ink);color:#0A0A0A}
.btn-w:hover{background:#fff;color:#0A0A0A;transform:translateY(-2px);box-shadow:0 14px 40px rgba(255,255,255,.16)}
.btn-k{background:#0E0E0E;color:#F6F4EF}
.btn-k:hover{color:#fff;transform:translateY(-2px);box-shadow:0 14px 34px -10px rgba(0,0,0,.45)}
.btn-sm{min-height:44px;padding:0 20px;font-size:14px}
.link{display:inline-flex;align-items:center;gap:6px;min-height:48px;font-size:16px;font-weight:500;text-decoration:none;color:var(--ink)}
.link:hover{text-decoration:underline;text-underline-offset:4px}

/* HERO */
.hero{position:relative;min-height:100vh;min-height:100svh;overflow:hidden;isolation:isolate;text-align:center;display:flex;flex-direction:column;justify-content:flex-start}
.hero-media{position:absolute;inset:0;z-index:-2;animation:heroOut linear both;animation-timeline:view();animation-range:exit 0% exit 100%}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:42% 60%;animation:drift 36s ease-in-out infinite alternate}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,10,10,.8) 0%,rgba(10,10,10,.3) 34%,rgba(10,10,10,0) 48%,rgba(10,10,10,0) 60%,rgba(10,10,10,.78) 82%,#0A0A0A 100%)}
.hero-copy{padding-top:clamp(110px,14vh,160px)}
.hero-bottom{margin-top:auto;padding-bottom:clamp(40px,7vh,72px)}
.eyebrow{font-size:clamp(17px,1.5vw,21px);font-weight:600;color:var(--mute);margin:0 0 12px;animation:up 1s .05s both}
.h1{font-weight:700;font-size:clamp(52px,8vw,118px);line-height:.98;letter-spacing:-.035em;margin:0;animation:up 1.1s .15s both}
.h1 .serif{font-size:1.06em}
.sub{font-size:clamp(17px,1.6vw,21px);line-height:1.45;color:rgba(244,242,238,.86);max-width:620px;margin:22px auto 0;animation:up 1s .3s both}
.cta{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 26px;margin-top:30px;animation:up 1s .45s both}
.fine{font-size:13px;color:var(--mute);margin-top:12px;animation:up 1s .55s both}

/* FLIP BOOK */
.flip{position:relative;height:600vh;view-timeline:--fb block}
.flip-stick{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:52px 0 92px}
.flip-stick::before{content:"";position:absolute;left:50%;top:52%;width:110vmax;height:70vmax;transform:translate(-50%,-50%);background:radial-gradient(ellipse at center,rgba(244,242,238,.13),rgba(244,242,238,0) 58%);pointer-events:none;animation:bloom linear both;animation-timeline:--fb;animation-range:contain 0% contain 100%}
.flip-head{text-align:center;position:relative}
.flip-head .k{font-size:12px;color:var(--mute)}
.flip-head h2{font-weight:700;font-size:clamp(30px,3.6vw,52px);letter-spacing:-.03em;line-height:1;margin:10px 0 0}
.book{--h:min(72vh,64vw);--h:min(72svh,64vw);--w:calc(var(--h) * .7234);position:relative;width:calc(var(--w) * 2);height:var(--h);animation:bookShift linear both;animation-timeline:--fb;animation-range:contain 0% contain 100%}
.book::after{content:"";position:absolute;left:6%;right:6%;bottom:-40px;height:46px;background:radial-gradient(ellipse at center,rgba(0,0,0,.75),rgba(0,0,0,0) 70%);filter:blur(8px);z-index:0}
.base{position:absolute;left:50%;top:0;width:50%;height:100%;z-index:1;overflow:hidden;border-radius:2px 6px 6px 2px;box-shadow:1px 0 0 #E9E6DF,2px 1px 0 #C9C4BA,3px 1px 0 #E9E6DF,4px 2px 0 #BDB8AE,5px 2px 0 #E2DED6,0 40px 70px -24px rgba(0,0,0,.9)}
.base img,.face img{width:100%;height:100%;object-fit:cover}
.leaf{position:absolute;left:50%;top:0;width:50%;height:100%;transform-origin:left center}
.face{position:absolute;inset:0;overflow:hidden;border-radius:2px 6px 6px 2px;box-shadow:0 40px 70px -24px rgba(0,0,0,.9);animation-timeline:--fb;animation-timing-function:linear;animation-fill-mode:both;animation-range:contain 0% contain 100%}
.face.back{transform:scaleX(-1);border-radius:6px 2px 2px 6px;opacity:0}
.l0 .face.front{animation-name:fv0}.l0 .face.back{animation-name:bv0}
.l1 .face.front{animation-name:fv1}.l1 .face.back{animation-name:bv1}
.l2 .face.front{animation-name:fv2}.l2 .face.back{animation-name:bv2}
.l3 .face.front{animation-name:fv3}.l3 .face.back{animation-name:bv3}
.face.front::after,.base::after{content:"";position:absolute;left:0;top:0;bottom:0;width:10%;background:linear-gradient(90deg,rgba(0,0,0,.32),rgba(0,0,0,0))}
.face.back::after{content:"";position:absolute;right:0;top:0;bottom:0;width:10%;background:linear-gradient(270deg,rgba(0,0,0,.32),rgba(0,0,0,0))}
.leaf.l0{z-index:10;animation:flip0 linear both;animation-timeline:--fb;animation-range:contain 0% contain 100%}
.leaf.l1{z-index:9;animation:flip1 linear both;animation-timeline:--fb;animation-range:contain 0% contain 100%}
.leaf.l2{z-index:8;animation:flip2 linear both;animation-timeline:--fb;animation-range:contain 0% contain 100%}
.leaf.l3{z-index:7;animation:flip3 linear both;animation-timeline:--fb;animation-range:contain 0% contain 100%}
.flip-bottom{position:absolute;left:0;right:0;bottom:max(16px,2.4vh);z-index:30;padding:0 16px}
.caps{display:grid;text-align:center;min-height:52px;position:relative}
.sh{position:absolute;inset:0;pointer-events:none;opacity:0;animation-timeline:--fb;animation-timing-function:linear;animation-fill-mode:both;animation-range:contain 0% contain 100%}
.face.front .sh{background:linear-gradient(90deg,rgba(0,0,0,.05),rgba(0,0,0,.55))}
.face.back .sh{background:linear-gradient(270deg,rgba(0,0,0,.05),rgba(0,0,0,.45))}
.l0 .sh{animation-name:sh0}.l1 .sh{animation-name:sh1}.l2 .sh{animation-name:sh2}.l3 .sh{animation-name:sh3}
.caps > div{grid-area:1/1;opacity:0}
.caps .t{font-weight:700;font-size:clamp(18px,1.8vw,24px);letter-spacing:-.015em;text-shadow:0 2px 20px rgba(0,0,0,.8)}
.caps .p{font-size:11px;color:var(--mute);margin-top:6px}
.c0{animation:cap0 linear both;animation-timeline:--fb;animation-range:contain 0% contain 100%}
.c1{animation:cap1 linear both;animation-timeline:--fb;animation-range:contain 0% contain 100%}
.c2{animation:cap2 linear both;animation-timeline:--fb;animation-range:contain 0% contain 100%}
.c3{animation:cap3 linear both;animation-timeline:--fb;animation-range:contain 0% contain 100%}
.c4{animation:cap4 linear both;animation-timeline:--fb;animation-range:contain 0% contain 100%}
.pips{display:flex;gap:8px;justify-content:center;margin-top:16px}
.pips i{display:block;width:26px;height:3px;border-radius:2px;background:var(--line);position:relative;overflow:hidden}
.pips i::after{content:"";position:absolute;inset:0;background:var(--ink);transform-origin:left;transform:scaleX(0);animation-timeline:--fb;animation-timing-function:linear;animation-fill-mode:both;animation-range:contain 0% contain 100%}
.pips i:nth-child(1)::after{animation-name:pip1}
.pips i:nth-child(2)::after{animation-name:pip2}
.pips i:nth-child(3)::after{animation-name:pip3}
.pips i:nth-child(4)::after{animation-name:pip4}

/* EARLY CTA STRIP */
.strip-sec{padding:clamp(40px,6vw,80px) 0 0}
.strip{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:28px;max-width:1100px;margin:0 auto;background:#F6F4EF;color:#0E0E0E;border-radius:20px;padding:26px 30px 26px 36px;box-shadow:0 40px 80px -40px rgba(0,0,0,.9);animation:tileIn linear both;animation-timeline:view();animation-range:entry 0% entry 70%}
.strip::before,.strip::after{content:"";position:absolute;top:50%;width:26px;height:26px;margin-top:-13px;border-radius:50%;background:#0A0A0A}
.strip::before{left:-13px}
.strip::after{right:-13px}
.strip .k{display:block;font-size:10px;color:#6A6761;margin-bottom:8px}
.strip b{display:block;font-weight:800;font-size:clamp(24px,2.6vw,34px);letter-spacing:-.03em;line-height:1.05}
.strip .note{display:block;font-size:12px;color:#6A6761;margin-top:8px}
.strip-r{display:flex;flex-wrap:wrap;gap:10px;padding-left:28px;border-left:2px dashed #CFCBC4}
.sbtn{display:inline-flex;align-items:center;gap:10px;min-height:54px;padding:0 22px;border-radius:14px;font-weight:700;font-size:15px;text-decoration:none;white-space:nowrap;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s}
.sbtn span{font-weight:500;opacity:.75}
.sbtn.dark{background:#0E0E0E;color:#F6F4EF}
.sbtn.dark:hover{color:#fff;transform:translateY(-2px);box-shadow:0 14px 30px -10px rgba(0,0,0,.5)}
.sbtn.line{border:1.5px solid #0E0E0E;color:#0E0E0E}
.sbtn.line:hover{color:#0E0E0E;background:#ECE8E0;transform:translateY(-2px)}
.inline-cta{text-align:center;padding-top:clamp(80px,10vw,130px)}
.inline-cta p{font-weight:800;font-size:clamp(32px,4vw,56px);letter-spacing:-.035em;line-height:1;margin:0 0 26px}
@media (max-width: 820px){
.strip{grid-template-columns:minmax(0,1fr);padding:26px 24px}
.strip::before,.strip::after{top:auto;bottom:96px}
.strip-r{padding-left:0;border-left:0;padding-top:20px;border-top:2px dashed #CFCBC4}
.sbtn{flex:1 1 200px;justify-content:center}
}

/* EDITOR */
.editor{padding:clamp(100px,12vw,170px) 0;text-align:center}
.label{font-size:12px;color:var(--mute)}
.quote{font-weight:700;font-size:clamp(32px,4.6vw,68px);line-height:1.06;letter-spacing:-.03em;margin:28px auto 0;max-width:1100px}
.quote .w{display:inline-block;margin-right:.24em;opacity:.15;animation:wIn linear both;animation-timeline:view();animation-range:entry 60% cover 42%}
.sig{margin-top:40px}
.sig .serif{font-size:32px}
.sig small{display:block;font-size:13px;color:var(--mute);margin-top:4px}

/* BENTO */
.sec{padding:clamp(90px,10vw,140px) 0}
.h-sec{font-weight:700;font-size:clamp(40px,5.2vw,72px);line-height:1;letter-spacing:-.035em;margin:0 0 48px;animation:up linear both;animation-timeline:view();animation-range:entry 0% cover 25%}
.h-sec.c{text-align:center}
.bento{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:280px;gap:18px}
.tile{position:relative;border-radius:26px;background:var(--tile);overflow:hidden;padding:32px;display:flex;flex-direction:column;justify-content:flex-end;border:1px solid rgba(244,242,238,.06);animation:tileIn linear both;animation-timeline:view();animation-range:entry 0% entry 80%}
.tile.photo{padding:0;border:0}
.tile.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.tile.photo:hover img{transform:scale(1.05)}
.tile.photo .cap{position:relative;z-index:2;padding:30px 32px;background:linear-gradient(transparent,rgba(0,0,0,.7))}
.tile.photo .cap b{display:block;font-size:clamp(22px,2.2vw,32px);font-weight:700;line-height:1.1;letter-spacing:-.02em}
.tile.photo .cap span{display:block;font-size:14px;color:rgba(244,242,238,.85);margin-top:6px}
.big{font-weight:800;font-size:clamp(54px,6vw,84px);line-height:1;letter-spacing:-.045em}
.tile p{font-size:16px;line-height:1.4;margin:14px 0 0;color:var(--mute)}
.tile p strong{color:var(--ink);font-weight:600}
.tile.lite{background:var(--paper);color:#0E0E0E;border:0}
.tile.lite p{color:#55524D}
.tile.lite p strong{color:#0E0E0E}
.s4r2{grid-column:span 4;grid-row:span 2}
.s2{grid-column:span 2}
.s4{grid-column:span 4}

/* CHAPTERS */
.story{position:relative;view-timeline:--st block}
.story-media{position:sticky;top:0;height:100vh;height:100svh;margin-bottom:-100vh;margin-bottom:-100svh;overflow:hidden;animation:mediaIn linear both;animation-timeline:--st;animation-range:entry 0% entry 100%}
.story-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:imgZoom linear both;animation-timeline:--st;animation-range:entry 0% exit 100%}
.story-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,0) 24%,rgba(0,0,0,0) 40%,rgba(0,0,0,.84) 100%)}
.story-meta{position:absolute;top:84px;left:clamp(16px,4vw,40px);right:clamp(16px,4vw,40px);display:flex;justify-content:space-between;font-size:12px;z-index:2}
.story-copy{position:relative;z-index:3;padding-top:60vh;padding-bottom:24vh}
.story-copy h3{font-weight:800;font-size:clamp(40px,6.2vw,104px);line-height:.94;letter-spacing:-.045em;margin:0 0 22px;max-width:1000px;text-wrap:balance;animation:up linear both;animation-timeline:view();animation-range:entry 10% cover 35%}
.story-copy p{font-size:clamp(16px,1.5vw,20px);line-height:1.55;color:rgba(244,242,238,.88);max-width:620px;margin:0;animation:up linear both;animation-timeline:view();animation-range:entry 20% cover 40%}
.story-copy .by{display:block;margin-top:22px;font-size:11px;color:rgba(244,242,238,.7)}

/* GRID */
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 24px}
.card{display:block;text-decoration:none;color:var(--ink);animation:tileIn linear both;animation-timeline:view();animation-range:entry 0% entry 70%}
.card .im{border-radius:18px;overflow:hidden;aspect-ratio:4/3;background:var(--tile)}
.card img{width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.card:hover img{transform:scale(1.05)}
.card .pg{font-size:11px;color:var(--mute);margin-top:18px}
.card h3{font-size:21px;font-weight:700;line-height:1.2;margin:8px 0 0;letter-spacing:-.02em}
.card .by{font-size:14px;color:var(--mute);margin-top:6px}

/* BOARDING PASS */
.bp{position:relative;padding:clamp(110px,13vw,180px) 0;overflow:hidden;isolation:isolate}
.bp-bg{position:absolute;inset:-10% 0;z-index:-2;animation:bpPar linear both;animation-timeline:view()}
.bp-bg img{width:100%;height:100%;object-fit:cover}
.bp::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 40%,rgba(10,10,10,.55),rgba(10,10,10,.92) 70%),linear-gradient(#0A0A0A,rgba(10,10,10,0) 18%,rgba(10,10,10,0) 82%,#0A0A0A)}
.bp-head{text-align:center;max-width:860px;margin:0 auto 48px}
.bp-head h2{font-weight:800;font-size:clamp(46px,6.4vw,104px);letter-spacing:-.045em;line-height:.92;margin:20px 0 20px}
.bp-head p{font-size:17px;line-height:1.6;color:rgba(244,242,238,.82);margin:0 auto;max-width:560px}
.toggle-wrap{display:flex;justify-content:center}
.toggle{display:inline-flex;gap:4px;padding:5px;border-radius:999px;background:rgba(10,10,10,.6);border:1px solid rgba(244,242,238,.2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);margin:0 auto 34px}
.toggle button{appearance:none;border:0;cursor:pointer;min-height:46px;padding:0 24px;border-radius:999px;background:transparent;color:var(--mute);font:600 14px Poppins,sans-serif;transition:background .3s,color .3s}
.toggle button:hover{color:var(--ink)}
.toggle button.on{background:var(--ink);color:#0A0A0A}
.pass{position:relative;max-width:1040px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) 300px;background:#F6F4EF;color:#0E0E0E;border-radius:22px;box-shadow:0 60px 120px -40px rgba(0,0,0,.9);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.pass:hover{transform:translateY(-6px) rotate(-.4deg)}
.pass-main{padding:clamp(26px,3.4vw,46px)}
.pass-top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-bottom:22px;border-bottom:1.5px dashed #CFCBC4}
.pass-top .brand{font-weight:800;font-size:18px}
.pass-top .cls{font-size:11px;padding:7px 12px;border-radius:999px;background:#0E0E0E;color:#F6F4EF}
.route{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:22px;align-items:center;padding:30px 0 26px}
.code{font-weight:800;font-size:clamp(48px,6vw,84px);letter-spacing:-.04em;line-height:.9}
.code small{display:block;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.12em;font-weight:500;color:#6A6761;margin-top:10px;text-transform:uppercase}
.flightline{position:relative;height:2px;background:repeating-linear-gradient(90deg,#0E0E0E 0 8px,transparent 8px 16px)}
.flightline svg{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(90deg);background:#F6F4EF;padding:0 8px;box-sizing:content-box;animation:fly 3.6s ease-in-out infinite}
.fields{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding:22px 0 26px;border-top:1px solid #E1DDD6;border-bottom:1px solid #E1DDD6}
.f span{display:block;font-size:10px;color:#6A6761}
.f b{display:block;font-size:17px;font-weight:700;margin-top:6px;letter-spacing:-.01em}
.incl{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 26px}
.incl li{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.45;color:#2A2825}
.incl svg{flex:none;margin-top:2px}
.stub{position:relative;border-left:2px dashed #CFCBC4;padding:clamp(26px,3vw,40px) 30px;display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.stub::before,.stub::after{content:"";position:absolute;left:-17px;width:32px;height:32px;border-radius:50%;background:#0A0A0A}
.stub::before{top:-16px}
.stub::after{bottom:-16px}
.fare{font-weight:800;font-size:72px;letter-spacing:-.05em;line-height:.9}
.fare sup{font-size:.4em;vertical-align:.95em;margin-right:2px;letter-spacing:0}
.per{font-size:11px;color:#6A6761;margin-top:10px}
.board-btn{display:flex;align-items:center;justify-content:center;gap:10px;min-height:58px;border-radius:14px;background:#0E0E0E;color:#F6F4EF;text-decoration:none;font-weight:700;font-size:16px;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s}
.board-btn:hover{color:#fff;transform:translateY(-2px);box-shadow:0 18px 40px -10px rgba(0,0,0,.5)}
.barcode{height:54px;background:repeating-linear-gradient(90deg,#0E0E0E 0 2px,transparent 2px 4px,#0E0E0E 4px 5px,transparent 5px 9px,#0E0E0E 9px 12px,transparent 12px 14px,#0E0E0E 14px 15px,transparent 15px 19px)}
.secure{display:flex;align-items:center;justify-content:center;gap:8px;font-size:10px;color:#6A6761;margin-top:12px}
.alt{text-align:center;margin-top:30px;font-size:14px;color:var(--mute)}
.alt button{appearance:none;background:none;border:0;color:var(--ink);font:600 14px Poppins,sans-serif;text-decoration:underline;text-underline-offset:4px;cursor:pointer;min-height:44px;padding:0 4px}
@keyframes bpPar{from{transform:translateY(-6%)} to{transform:translateY(6%)} }
@keyframes fly{0%,100%{margin-left:-30px} 50%{margin-left:30px} }
@media (max-width: 820px){
.pass{grid-template-columns:minmax(0,1fr)}
.stub{border-left:0;border-top:2px dashed #CFCBC4}
.stub::before{left:-16px;top:-17px}
.stub::after{left:auto;right:-16px;top:-17px;bottom:auto}
.fields{grid-template-columns:repeat(2,minmax(0,1fr))}
.incl{grid-template-columns:minmax(0,1fr)}
.route{gap:12px}
.toggle button{padding:0 16px;font-size:13px}
}

/* BACK ISSUES */
.bi-sec{padding:clamp(90px,10vw,140px) 0 clamp(40px,5vw,60px);text-align:center}
.bi-sec h2{font-weight:800;font-size:clamp(40px,5.4vw,80px);letter-spacing:-.04em;line-height:.95;margin:18px 0 16px}
.bi-sec .lead{font-size:16px;line-height:1.6;color:var(--mute);margin:0 auto 56px;max-width:520px}
.shelf{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,44px);max-width:1080px;margin:0 auto;perspective:1600px}
.vol{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--ink);animation:tileIn linear both;animation-timeline:view();animation-range:entry 0% entry 80%}
.vol-cover{position:relative;width:100%;max-width:280px;aspect-ratio:1275/1763;border-radius:3px 7px 7px 3px;overflow:hidden;box-shadow:0 40px 70px -28px rgba(0,0,0,.95),0 6px 18px rgba(0,0,0,.4);transition:transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .6s}
.vol-cover img{width:100%;height:100%;object-fit:cover}
.vol-cover::before{content:"";position:absolute;left:0;top:0;bottom:0;width:12px;z-index:2;background:linear-gradient(90deg,rgba(0,0,0,.35),rgba(255,255,255,.14) 45%,rgba(0,0,0,0))}
.vol:hover .vol-cover{transform:translateY(-12px) rotateY(-10deg) rotateX(4deg);box-shadow:0 60px 90px -30px rgba(0,0,0,1),0 10px 24px rgba(0,0,0,.45)}
.vol-tag{position:absolute;top:14px;right:-6px;z-index:3;background:var(--ink);color:#0A0A0A;font-size:10px;padding:7px 10px;border-radius:4px 0 0 4px;box-shadow:0 8px 20px rgba(0,0,0,.4)}
.vol h3{font-weight:700;font-size:21px;letter-spacing:-.02em;margin:28px 0 4px}
.vol .vmeta{font-size:13px;color:var(--mute)}
.vol .vbtn{display:inline-flex;align-items:center;gap:8px;margin-top:16px;min-height:46px;padding:0 20px;border-radius:999px;border:1px solid rgba(244,242,238,.3);font-weight:600;font-size:14px;transition:background .25s,color .25s,border-color .25s}
.vol:hover .vbtn{background:var(--ink);color:#0A0A0A;border-color:var(--ink)}
@media (max-width: 640px){
.shelf{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.vol h3{font-size:15px;margin-top:18px}
.vol .vmeta{font-size:11px}
.vol .vbtn{padding:0 12px;font-size:12px;min-height:44px}
.vol-tag{font-size:8px;padding:5px 6px}
}

/* QUOTES */
.vgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,44px)}
.voice blockquote{margin:0;font-family:'Instrument Serif',Georgia,serif;font-size:clamp(26px,2.4vw,34px);line-height:1.18}
.voice cite{display:block;margin-top:18px;font-style:normal;font-size:11px;color:var(--mute)}

/* FAQ */
.faq{max-width:860px;margin:0 auto;border-top:1px solid var(--line)}
.fq{border-bottom:1px solid var(--line)}
.fq button{appearance:none;width:100%;background:none;border:0;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:80px;padding:18px 0;text-align:left;font:600 20px/1.3 Poppins,sans-serif;color:var(--ink);letter-spacing:-.01em}
.fq .pl{flex:none;width:26px;height:26px;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.fq.on .pl{transform:rotate(45deg)}
.fq .ans{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s cubic-bezier(.2,.8,.2,1)}
.fq.on .ans{grid-template-rows:1fr}
.fq .ans > div{overflow:hidden}
.fq .ans p{margin:0;padding:0 48px 26px 0;font-size:16px;line-height:1.6;color:var(--mute)}

/* FINAL */
.final{position:relative;min-height:90vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;isolation:isolate}
.final-bg{position:absolute;inset:0;z-index:-2;animation:finalZoom linear both;animation-timeline:view();animation-range:entry 0% cover 60%}
.final-bg img{width:100%;height:100%;object-fit:cover}
.final::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(#0A0A0A,rgba(10,10,10,.25) 30%,rgba(10,10,10,.35) 70%,#0A0A0A)}
.final h2{font-weight:800;font-size:clamp(56px,10vw,170px);letter-spacing:-.055em;line-height:.88;margin:18px 0 32px}
.foot{border-top:1px solid var(--line);padding:30px 0 120px;font-size:13px;color:var(--mute)}
.foot-in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px}
.foot a{color:var(--mute);text-decoration:none;margin-left:20px}
.foot a:hover{color:var(--ink)}
.mbar{position:fixed;left:12px;right:12px;bottom:12px;z-index:70;display:none;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 18px;border-radius:999px;background:rgba(20,20,20,.86);border:1px solid var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transform:translateY(140%);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.mbar.on{transform:none}
.mbar small{display:block;font-size:10px;color:var(--mute)}
.mbar b{font-size:14px}

/* KEYFRAMES */
@keyframes up{from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:none} }
@keyframes tileIn{from{opacity:0;transform:translateY(50px) scale(.97)} to{opacity:1;transform:none} }
@keyframes drift{from{transform:scale(1.08) translateX(1.5%)} to{transform:scale(1.14) translateX(-2.5%)} }
@keyframes heroOut{to{transform:translateY(20%);opacity:.3} }
@keyframes wIn{to{opacity:1} }
@keyframes bookShift{0%{transform:translateX(calc(var(--w) * -.5)) translateY(6%) perspective(2400px) rotateX(24deg) rotateZ(-6deg) scale(.62)} 7%{transform:translateX(calc(var(--w) * -.5)) translateY(0) perspective(2400px) rotateX(0deg) rotateZ(0deg) scale(.94)} 22%,90%{transform:translateX(0) translateY(0) perspective(2400px) rotateX(0deg) rotateZ(0deg) scale(1)} 100%{transform:translateX(0) translateY(0) perspective(2400px) rotateX(0deg) rotateZ(0deg) scale(.96)} }
@keyframes bloom{0%{opacity:.4} 22%,100%{opacity:1} }
@keyframes sh0{0%,7%{opacity:0} 14%{opacity:1} 22%,100%{opacity:0} }
@keyframes sh1{0%,30%{opacity:0} 37%{opacity:1} 44%,100%{opacity:0} }
@keyframes sh2{0%,52%{opacity:0} 59%{opacity:1} 66%,100%{opacity:0} }
@keyframes sh3{0%,74%{opacity:0} 81%{opacity:1} 88%,100%{opacity:0} }
@keyframes flip0{0%,7%{transform:perspective(2800px) rotateY(0deg);z-index:10} 13.5%{z-index:10} 13.6%{z-index:21} 22%,100%{transform:perspective(2800px) rotateY(-180deg);z-index:21} }
@keyframes flip1{0%,30%{transform:perspective(2800px) rotateY(0deg);z-index:9} 37%{z-index:9} 37.1%{z-index:22} 44%,100%{transform:perspective(2800px) rotateY(-180deg);z-index:22} }
@keyframes flip2{0%,52%{transform:perspective(2800px) rotateY(0deg);z-index:8} 59%{z-index:8} 59.1%{z-index:23} 66%,100%{transform:perspective(2800px) rotateY(-180deg);z-index:23} }
@keyframes flip3{0%,74%{transform:perspective(2800px) rotateY(0deg);z-index:7} 81%{z-index:7} 81.1%{z-index:24} 88%,100%{transform:perspective(2800px) rotateY(-180deg);z-index:24} }
@keyframes fv0{0%,13.5%{opacity:1} 13.6%,100%{opacity:0} }
@keyframes bv0{0%,13.5%{opacity:0} 13.6%,100%{opacity:1} }
@keyframes fv1{0%,37%{opacity:1} 37.1%,100%{opacity:0} }
@keyframes bv1{0%,37%{opacity:0} 37.1%,100%{opacity:1} }
@keyframes fv2{0%,59%{opacity:1} 59.1%,100%{opacity:0} }
@keyframes bv2{0%,59%{opacity:0} 59.1%,100%{opacity:1} }
@keyframes fv3{0%,81%{opacity:1} 81.1%,100%{opacity:0} }
@keyframes bv3{0%,81%{opacity:0} 81.1%,100%{opacity:1} }
@keyframes cap0{0%,6%{opacity:1;transform:none} 11%,100%{opacity:0;transform:translateY(-10px)} }
@keyframes cap1{0%,18%{opacity:0;transform:translateY(10px)} 23%,31%{opacity:1;transform:none} 35%,100%{opacity:0;transform:translateY(-10px)} }
@keyframes cap2{0%,40%{opacity:0;transform:translateY(10px)} 45%,53%{opacity:1;transform:none} 57%,100%{opacity:0;transform:translateY(-10px)} }
@keyframes cap3{0%,62%{opacity:0;transform:translateY(10px)} 67%,75%{opacity:1;transform:none} 79%,100%{opacity:0;transform:translateY(-10px)} }
@keyframes cap4{0%,84%{opacity:0;transform:translateY(10px)} 89%,100%{opacity:1;transform:none} }
@keyframes pip1{0%,5%{transform:scaleX(0)} 22%,100%{transform:scaleX(1)} }
@keyframes pip2{0%,30%{transform:scaleX(0)} 44%,100%{transform:scaleX(1)} }
@keyframes pip3{0%,52%{transform:scaleX(0)} 66%,100%{transform:scaleX(1)} }
@keyframes pip4{0%,74%{transform:scaleX(0)} 88%,100%{transform:scaleX(1)} }
@keyframes mediaIn{from{clip-path:inset(12% 8% 0 8% round 28px)} to{clip-path:inset(0 0 0 0 round 0)} }
@keyframes imgZoom{from{transform:scale(1.1)} to{transform:scale(1)} }
@keyframes finalZoom{from{transform:scale(1.25)} to{transform:scale(1)} }

@supports not (animation-timeline: view()) {
.mx:not(.sdjs) .flip{height:auto;padding:80px 0}
.mx:not(.sdjs) .flip-stick{position:relative;height:auto}
.mx:not(.sdjs) .leaf.l0,.mx:not(.sdjs) .leaf.l1,.mx:not(.sdjs) .leaf.l2,.mx:not(.sdjs) .leaf.l3{transform:perspective(2800px) rotateY(-180deg)}
.mx:not(.sdjs) .leaf.l0{z-index:21}
.mx:not(.sdjs) .leaf.l1{z-index:22}
.mx:not(.sdjs) .leaf.l2{z-index:23}
.mx:not(.sdjs) .leaf.l3{z-index:24}
.mx:not(.sdjs) .c4{opacity:1}
.mx:not(.sdjs) .face.front{opacity:0}
.mx:not(.sdjs) .face.back{opacity:1}
.mx:not(.sdjs) .quote .w{opacity:1}
}
@media (max-width: 1068px){
.bento{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:240px}
.s4r2{grid-column:span 2;grid-row:span 2}
.s2{grid-column:span 1}
.s4{grid-column:span 2}
.grid3{grid-template-columns:repeat(2,minmax(0,1fr))}
.vgrid{grid-template-columns:minmax(0,1fr)}
}
@media (max-width: 820px){
.nav-r a.l{display:none}
.book{--h:min(64vh,65vw)}
.flip-bottom{bottom:104px}
.story-meta{top:76px}
.mbar{display:flex}
.foot a{margin:0 18px 0 0}
}
@media (max-width: 640px){
.eyebrow{font-size:13px}
.bento{grid-template-columns:minmax(0,1fr);grid-auto-rows:auto}
.s4r2,.s2,.s4{grid-column:span 1;grid-row:auto}
.tile{min-height:200px}
.tile.photo{min-height:340px}
.grid3{grid-template-columns:minmax(0,1fr)}
.cmp{grid-template-columns:minmax(0,1fr)}
.vis{height:240px}
}
@media (prefers-reduced-motion: reduce){
.mx *,.mx *::before,.mx *::after{animation:none!important;transition:none!important}
.flip{height:auto;padding:80px 0}
.flip-stick{position:relative;height:auto}
.leaf.l0,.leaf.l1,.leaf.l2,.leaf.l3{transform:scaleX(-1)}
.leaf.l3{z-index:24}
.caps .c4{opacity:1}
.face.front{opacity:0}
.face.back{opacity:1}
.quote .w{opacity:1}
}

[hidden]{display:none!important}
body{margin:0;background:#0A0A0A}
.mx{min-height:100vh}
.nav{background:rgba(10,10,10,.72);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom-color:var(--line)}
.nav .l[aria-current]{color:var(--ink)}
.crumbs{font-size:11px;color:var(--mute);display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:18px;animation:up 1s both}
.crumbs a{color:var(--mute);text-decoration:none}.crumbs a:hover{color:var(--ink)}
/* post hero */
.phero{position:relative;min-height:88vh;min-height:88svh;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-end;text-align:center}
.phero .hero-media img{width:100%;height:100%;object-fit:cover;animation:drift 36s ease-in-out infinite alternate}
.phero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,10,10,.75) 0%,rgba(10,10,10,.2) 30%,rgba(10,10,10,.35) 55%,rgba(10,10,10,.92) 85%,#0A0A0A 100%)}
.phero .in{padding-bottom:clamp(40px,7vh,72px);padding-top:120px}
.phero h1{font-weight:700;font-size:clamp(38px,5.6vw,84px);line-height:1;letter-spacing:-.035em;margin:0 auto;max-width:1000px;animation:up 1.1s .15s both;text-shadow:0 2px 24px rgba(0,0,0,.6)}
.phero .dek{font-size:clamp(17px,1.6vw,21px);line-height:1.5;color:rgba(244,242,238,.88);max-width:680px;margin:22px auto 0;animation:up 1s .3s both;text-shadow:0 2px 18px rgba(0,0,0,.8)}
.pmeta{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 22px;font-size:11px;color:#CFCBC4;margin-top:22px;animation:up 1s .45s both}
.pcta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:28px;animation:up 1s .6s both}
.btn-g{border:1px solid rgba(244,242,238,.35);color:var(--ink);background:rgba(10,10,10,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.btn-g:hover{background:rgba(244,242,238,.1)}
/* article */
.art{max-width:740px;margin:0 auto;padding:clamp(60px,8vw,110px) clamp(16px,4vw,40px) 40px}
.art p{font-size:clamp(18px,1.4vw,20px);line-height:1.7;color:rgba(244,242,238,.86);margin:0 0 24px}
.art p.lede{font-size:clamp(21px,1.9vw,26px);line-height:1.5;color:var(--ink)}
.art p.lede::first-letter{font-family:'Instrument Serif',Georgia,serif;font-style:italic;float:left;font-size:4.2em;line-height:.82;padding:6px 12px 0 0}
.art h2{font-weight:700;font-size:clamp(28px,3vw,40px);line-height:1.1;letter-spacing:-.03em;margin:64px 0 18px}
.art h2 .serif{font-weight:400}
.rv{animation:up linear both;animation-timeline:view();animation-range:entry 0% entry 60%}
.learn{border:1px solid var(--line);border-radius:22px;padding:clamp(24px,3vw,36px);margin:48px 0;background:linear-gradient(180deg,rgba(244,242,238,.05),rgba(244,242,238,0))}
.learn .label{display:block;margin-bottom:16px}
.learn ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.learn li{display:grid;grid-template-columns:28px 1fr;gap:10px;font-size:17px;line-height:1.5;color:var(--ink)}
.learn li span{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--mute);padding-top:4px}
.pull{margin:56px 0;padding:0;border:0;text-align:center}
.pull p{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-size:clamp(30px,3.6vw,46px)!important;line-height:1.15!important;color:var(--ink)!important;margin:0!important}
.pull cite{display:block;margin-top:14px;font-style:normal;font-size:11px;color:var(--mute)}
.listen-card{display:grid;grid-template-columns:1fr;gap:18px;border-radius:22px;padding:clamp(24px,3vw,36px);background:var(--ink);color:#0E0E0E;margin:56px 0}
.listen-card .k{font-size:11px;color:#6A6761}
.listen-card b{display:block;font-size:clamp(22px,2.2vw,28px);letter-spacing:-.02em;line-height:1.2;margin-top:6px}
.listen-card .row{display:flex;flex-wrap:wrap;gap:10px}
.listen-card .btn-k{min-height:48px}
.listen-card .btn-o{border:1.5px solid #0E0E0E;color:#0E0E0E;background:transparent}
.guest{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:start;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:30px 0;margin:56px 0}
.guest .av{width:64px;height:64px;border-radius:50%;background:#1A1A1A;border:1px solid var(--line);display:grid;place-items:center;font-weight:800;font-size:20px;letter-spacing:-.02em}
.guest p{font-size:16px!important;margin:6px 0 0!important;color:var(--mute)!important}
.guest b{font-size:18px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:20px 0;font-weight:600;font-size:18px;min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:400;font-size:26px;color:var(--mute);transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{font-size:17px!important;margin:0 0 22px!important;color:var(--mute)!important}
.magcall{display:grid;grid-template-columns:110px 1fr;gap:22px;align-items:center;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-radius:22px;padding:18px;margin:56px 0;transition:border-color .3s,background .3s}
.magcall:hover{border-color:rgba(244,242,238,.4);background:rgba(244,242,238,.04)}
.magcall img{width:110px;aspect-ratio:3/4;object-fit:cover;border-radius:6px;box-shadow:0 20px 40px -12px rgba(0,0,0,.8)}
.magcall .label{display:block;margin-bottom:6px}.magcall b{font-size:18px;line-height:1.35;display:block}.magcall span.go{display:block;margin-top:10px;font-size:14px;color:var(--mute)}
/* related & index cards */
.rel{padding:clamp(60px,8vw,110px) 0;border-top:1px solid var(--line)}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.card{display:block;text-decoration:none;color:var(--ink);animation:tileIn linear both;animation-timeline:view();animation-range:entry 0% entry 60%}
.card .ph{aspect-ratio:4/3;border-radius:18px;overflow:hidden;background:#141414}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.card:hover .ph img{transform:scale(1.06)}
.card .k{display:flex;gap:12px;font-size:11px;color:var(--mute);margin:16px 0 8px}
.card h3{font-weight:700;font-size:clamp(20px,1.8vw,24px);line-height:1.2;letter-spacing:-.02em;margin:0}
.card p{font-size:15px;line-height:1.5;color:var(--mute);margin:8px 0 0}
/* blog index */
.bhero{padding:clamp(130px,16vh,190px) 0 clamp(40px,6vw,70px);text-align:center}
.bhero h1{font-weight:700;font-size:clamp(52px,8vw,118px);line-height:.98;letter-spacing:-.035em;margin:0;animation:up 1.1s .15s both}
.bhero p{font-size:clamp(17px,1.6vw,21px);line-height:1.5;color:var(--mute);max-width:640px;margin:22px auto 0;animation:up 1s .3s both}
.feat{position:relative;display:block;border-radius:28px;overflow:hidden;min-height:min(78vh,720px);text-decoration:none;color:var(--ink);isolation:isolate;animation:mediaIn linear both;animation-timeline:view();animation-range:entry 0% cover 40%}
.feat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;animation:imgZoom linear both;animation-timeline:view();animation-range:entry 0% cover 60%}
.feat::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,10,10,0) 30%,rgba(10,10,10,.92) 100%)}
.feat .fc{position:absolute;left:0;right:0;bottom:0;padding:clamp(24px,4vw,56px)}
.feat h2{font-weight:700;font-size:clamp(32px,4.6vw,64px);line-height:1.02;letter-spacing:-.035em;margin:12px 0 0;max-width:900px}
.feat p{font-size:clamp(16px,1.4vw,19px);color:rgba(244,242,238,.85);max-width:640px;margin:14px 0 0;line-height:1.5}
.feat .k{font-size:11px;color:#CFCBC4}
.feat .btn{margin-top:22px}
.chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:40px 0 0}
.chip{min-height:44px;padding:0 18px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--mute);font:500 14px Poppins,sans-serif;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);color:#0A0A0A;border-color:var(--ink)}
.grid-sec{padding:50px 0 clamp(80px,10vw,130px)}
.cards.all{row-gap:56px}
.card[hidden]{display:none}
.nl{border-top:1px solid var(--line);padding:clamp(70px,9vw,120px) 0;text-align:center}
.nl h2{font-weight:700;font-size:clamp(36px,4.6vw,64px);letter-spacing:-.035em;line-height:1;margin:10px 0 16px}
.nl p{color:var(--mute);font-size:18px;max-width:560px;margin:0 auto 28px}
@media (max-width:900px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.cards{grid-template-columns:minmax(0,1fr)}.magcall{grid-template-columns:80px 1fr}.magcall img{width:80px}.nav-r .l{display:none}.nav-r .l.keep{display:inline}}

.dock{position:fixed;left:12px;right:12px;bottom:12px;z-index:90;max-width:760px;margin:0 auto;border-radius:20px;overflow:hidden;background:#141414;color:#F4F2EE;font-family:Poppins,sans-serif;visibility:hidden;border:1px solid rgba(244,242,238,.18);box-shadow:0 30px 80px -10px rgba(0,0,0,.9);transform:translateY(130%);transition:transform .5s cubic-bezier(.2,.8,.2,1),visibility 0s .5s}
.dock.on{transform:none;visibility:visible;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.dock-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 18px}
.dock-h b{font-size:14px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dock-o{flex:none;font-size:13px;color:#CFCBC4;text-decoration:none;white-space:nowrap}.dock-o:hover{color:#F4F2EE}
.dock-h b{flex:1;min-width:0}
.dock-x{flex:none;width:44px;height:44px;border-radius:50%;border:1px solid rgba(244,242,238,.25);background:transparent;color:#F4F2EE;font-size:20px;cursor:pointer}
.dock iframe{display:block;width:100%;height:175px;border:0;background:#141414}
body.playing .mbar{display:none!important}
.play{cursor:pointer;border:0;font-family:Poppins,sans-serif;display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.row .play,.pp-l .play{border:1px solid rgba(244,242,238,.3)}

.free{border-top:1px solid var(--line);padding:clamp(70px,9vw,120px) 0}
.free-g{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(30px,5vw,70px);align-items:center}
.free-img{border-radius:14px;overflow:hidden;box-shadow:0 40px 80px -20px rgba(0,0,0,.9);transform:rotate(-2deg);animation:tileIn linear both;animation-timeline:view();animation-range:entry 0% entry 60%}
.free-img img{display:block;width:100%;height:auto}
.free h2{font-weight:700;font-size:clamp(34px,4.2vw,58px);letter-spacing:-.035em;line-height:1.02;margin:12px 0 0}
.free p.l{font-size:18px;line-height:1.55;color:var(--mute);margin:16px 0 26px}
.free .free-go{min-height:56px;padding:0 34px;font-size:16px}
.free .fine{font-size:13px;color:var(--mute);margin-top:12px}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:820px){.free-g{grid-template-columns:minmax(0,1fr)}.free .free-go{width:100%}}

.rvs{padding:clamp(70px,9vw,120px) 0;border-top:1px solid var(--line)}
.rvs-h{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:36px}
.rvs-h p{color:var(--mute);font-size:16px;margin:0}
.rv-g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.rv-c{margin:0;padding:26px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(180deg,rgba(244,242,238,.05),rgba(244,242,238,0));animation:tileIn linear both;animation-timeline:view();animation-range:entry 0% entry 60%}
.rv-c .stars{color:#E9C987;letter-spacing:.15em;font-size:15px}
.rv-c b{display:block;font-size:18px;margin-top:12px;letter-spacing:-.01em}
.rv-c blockquote{margin:10px 0 0;font-size:16px;line-height:1.55;color:rgba(244,242,238,.85)}
.rv-c figcaption{font-size:11px;color:var(--mute);margin-top:16px}
@media (max-width:1000px){.rv-g{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.rv-g{grid-template-columns:minmax(0,1fr)}}
.list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.row{display:flex;align-items:center;gap:18px;border-bottom:1px solid var(--line)}
.row[hidden]{display:none}
.row-a{flex:1;min-width:0;display:grid;grid-template-columns:150px minmax(0,1fr);gap:24px;align-items:center;padding:20px 0;text-decoration:none;color:#F4F2EE}
.row-a img{width:150px;height:100px;border-radius:12px;object-fit:cover;transition:transform .6s}
.row-a:hover img{transform:scale(1.04)}
.row-k{display:block;font-size:11px;color:var(--mute)}
.row-t{display:block;font-weight:700;font-size:clamp(18px,1.7vw,22px);line-height:1.2;letter-spacing:-.02em;margin-top:6px}
.row-d{display:block;font-size:15px;line-height:1.5;color:var(--mute);margin-top:6px}
.row .play{flex:none;min-height:46px;padding:0 18px;border-radius:999px;border:1px solid rgba(244,242,238,.3);background:transparent;color:#F4F2EE;font:600 14px Poppins,sans-serif;transition:background .25s,color .25s}
.row .play:hover{background:#F4F2EE;color:#0A0A0A}
@media (max-width:640px){.row{flex-wrap:wrap;gap:0 12px;padding-bottom:16px}.row-a{flex-basis:100%}.row-a{grid-template-columns:96px minmax(0,1fr);gap:14px;padding-bottom:10px}.row-a img{width:96px;height:72px}.row-d{display:none}.row .play{margin-left:110px}}

.magstrip{display:grid;grid-template-columns:96px minmax(0,1fr);gap:20px;align-items:center;margin:40px 0;padding:20px;border-radius:20px;background:#F4F2EE;color:#0E0E0E}
.magstrip img{width:96px;aspect-ratio:3/4.15;object-fit:cover;border-radius:4px;box-shadow:0 14px 30px -10px rgba(0,0,0,.6)}
.magstrip .k{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#6A6761}
.magstrip b{display:block;font-size:19px;line-height:1.3;letter-spacing:-.01em;margin-top:6px}
.magstrip .row2{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.magstrip .btn-k{min-height:44px;padding:0 20px;font-size:14px}
.magstrip .btn-o{min-height:44px;padding:0 20px;font-size:14px;border:1.5px solid #0E0E0E;color:#0E0E0E;background:transparent}
.magfun{position:relative;overflow:hidden;padding:clamp(80px,10vw,140px) 0;border-top:1px solid var(--line);text-align:center;background:radial-gradient(900px 420px at 50% 100%,rgba(233,201,135,.12),transparent 70%)}
.magfun h2{font-weight:700;font-size:clamp(40px,5.4vw,80px);letter-spacing:-.04em;line-height:1;margin:12px 0 0}
.magfun p.l{font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:var(--mute);max-width:640px;margin:20px auto 0}
.fan{position:relative;height:clamp(240px,30vw,400px);max-width:900px;margin:50px auto 30px}
.fan a{position:absolute;bottom:0;display:block;width:clamp(120px,16vw,220px);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.fan img{display:block;width:100%;aspect-ratio:3/4.15;object-fit:cover;border-radius:4px;box-shadow:0 30px 60px -14px rgba(0,0,0,.9)}
.fan a:nth-child(1){left:8%;transform:rotate(-12deg)}.fan a:nth-child(2){left:28%;transform:rotate(-4deg) translateY(-18px)}
.fan a:nth-child(3){left:48%;transform:rotate(4deg) translateY(-18px)}.fan a:nth-child(4){left:66%;transform:rotate(11deg);z-index:2}
.fan a:hover{transform:translateY(-26px) rotate(0)!important;z-index:3}
.magfun .acts{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
@media (max-width:640px){.magstrip{grid-template-columns:72px minmax(0,1fr)}.magstrip img{width:72px}}

.series{border:1px solid rgba(233,201,135,.45);background:rgba(233,201,135,.06);border-radius:18px;padding:18px 22px;margin:28px 0}
.series ol{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.series li a{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:999px;border:1px solid rgba(244,242,238,.25);color:#F4F2EE;text-decoration:none;font-size:14px}
.series li a:hover{border-color:#E9C987;color:#E9C987}
.series li.on a{background:#F4F2EE;color:#0A0A0A;border-color:#F4F2EE;font-weight:600}
.series .sx{display:block;font-size:13px;color:var(--mute);margin-top:8px}
.snext{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;border:1px solid var(--line);border-radius:18px;padding:20px 22px;margin:40px 0;text-decoration:none;color:#F4F2EE}
.snext:hover{border-color:#E9C987}.snext b{font-size:20px;letter-spacing:-.01em}.snext span{font-size:12px;color:#E9C987}