html,body{margin:0;background:#fbf3e2}
:root{--gold:#d6a136;--gold-l:#f6db97;--gold-d:#8e6420;--navy:#0c1424;--navy2:#14203a;--ink:#1d2540;--soft:#5d5a66;--paper:#fff9ec;
--serif:"Iowan Old Style","Palatino Linotype",Palatino,"Noto Serif",Georgia,serif;--sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--p:0}
*{box-sizing:border-box}
body{font-family:var(--sans);color:var(--ink);line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.04;margin:0;letter-spacing:-.02em}
.eyebrow{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-d);font-weight:600}
/* nav */
nav{position:fixed;z-index:20;top:14px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:18px;padding:8px 10px 8px 18px;border-radius:999px;background:rgba(255,249,236,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 0 0 1px rgba(142,100,32,.18),0 8px 30px rgba(142,100,32,.12);max-width:calc(100% - 20px)}
nav b{font-family:var(--serif);font-size:21px;font-weight:600;letter-spacing:-.01em;white-space:nowrap}nav b i{font-style:normal;color:var(--gold-d)}
nav a.l{font-size:14px;text-decoration:none;color:var(--soft)}nav a.l:hover{color:var(--ink)}
.lang{position:relative}.lang summary{list-style:none;cursor:pointer;min-width:44px;min-height:44px;display:grid;place-items:center;font:600 13px var(--sans);color:var(--soft);text-transform:uppercase}.lang summary::-webkit-details-marker{display:none}
.lang ul{position:absolute;right:0;top:calc(100% + 10px);margin:0;padding:8px;list-style:none;background:#fff9ec;border-radius:16px;box-shadow:0 0 0 1px rgba(142,100,32,.2),0 16px 40px rgba(142,100,32,.2);columns:2;column-gap:6px;min-width:260px}
.lang li a{display:block;padding:10px 12px;border-radius:10px;font-size:14px;text-decoration:none;white-space:nowrap}.lang li a:hover,.lang li a[aria-current]{background:rgba(214,161,54,.18)}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:999px;background:linear-gradient(180deg,#e9b84a,#c98f22);color:#2a1c05;font-weight:650;font-size:16px;text-decoration:none;box-shadow:0 10px 30px rgba(201,143,34,.35),inset 0 1px 0 rgba(255,255,255,.5);transition:transform .25s,box-shadow .25s;border:0;cursor:pointer}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 38px rgba(201,143,34,.45),inset 0 1px 0 rgba(255,255,255,.5)}
.btn.s{padding:9px 18px;font-size:14px;white-space:nowrap;min-height:44px}
.ghost{display:inline-flex;padding:14px 22px;border-radius:999px;text-decoration:none;font-weight:600;box-shadow:inset 0 0 0 1.5px rgba(29,37,64,.35)}
/* hero */
.lp-hero{position:relative;min-height:100svh;display:grid;align-items:center;overflow:hidden;isolation:isolate;background:#fbe9bd}
.lp-hero .sky{position:absolute;inset:-4% 0 0;background:url(hero-clean-v2.webp) center 70%/cover no-repeat;z-index:-3;transform:translateY(calc(var(--p)*60px)) scale(1.06)}
.lp-hero .sun{position:absolute;left:50%;top:85%;width:min(52vw,620px);aspect-ratio:1;z-index:-2;transform:translate(-50%,calc(-50% + (1 - var(--rise,1))*38vh - var(--p)*90px));background:radial-gradient(circle,#fff6cf 0 14%,rgba(255,226,140,.85) 28%,rgba(255,200,90,.35) 52%,transparent 70%);filter:blur(2px);animation:rise 2.4s cubic-bezier(.16,.8,.2,1) both}
.lp-hero .mark{position:absolute;left:50%;top:85%;width:min(15vw,170px);z-index:-1;transform:translate(-50%,-50%) rotate(calc(var(--p)*50deg));opacity:.92;animation:fade 2s .6s both}
.lp-hero .veil{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(255,249,236,.55),rgba(255,249,236,0) 30%,rgba(255,249,236,0) 62%,#fbf3e2)}
@keyframes rise{from{--rise:0;transform:translate(-50%,calc(-50% + 42vh));opacity:.2}to{opacity:1}}
@keyframes fade{from{opacity:0;transform:translate(-50%,-30%) rotate(-30deg)}}
.lp-hero .in{text-align:center;padding:100px 0 190px;position:relative}
.lp-hero h1{font-size:clamp(46px,8.6vw,124px)}
.lp-hero h1 em{font-style:italic;color:var(--gold-d)}
.lp-hero p.sub{max-width:560px;margin:22px auto 30px;font-size:clamp(16px,2vw,19px);color:#3b3a4a}
.lp-hero .cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.lp-hero small{display:block;margin-top:18px;color:#5b4a2a;font-size:14px}
.rv{animation:up 1s both}.rv:nth-child(2){animation-delay:.15s}.rv:nth-child(3){animation-delay:.3s}.rv:nth-child(4){animation-delay:.45s}
@keyframes up{from{opacity:0;transform:translateY(26px)}}
/* questions */
.q{padding:90px 0 40px;text-align:center}
.q h2{font-size:clamp(30px,5vw,60px);max-width:900px;margin:14px auto 0}
.q h2 em{color:var(--gold-d)}
.chips{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:38px}
.chips span{padding:12px 20px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px rgba(142,100,32,.2),0 6px 20px rgba(142,100,32,.08);font-family:var(--serif);font-size:19px}
/* dial: four clarities */
.dial{position:relative;height:330vh;margin-top:60px}
.dial .stick{position:sticky;top:0;height:100svh;display:grid;align-items:center;overflow:hidden}
.dial .grid{display:grid;grid-template-columns:1fr 1.1fr;gap:40px;align-items:center}
.disc{position:relative;width:min(80vw,520px);aspect-ratio:1;margin:auto}
.disc svg{position:absolute;inset:0;width:100%;height:100%}
.disc img{position:absolute;inset:27%;width:46%;transform:rotate(calc(var(--d,0)*360deg))}
.ring{transition:opacity .5s,stroke-width .5s}
.dial h2{font-size:clamp(34px,5vw,64px);margin:12px 0 16px}
.dial .k{font-size:12px;letter-spacing:.2em;color:var(--gold-d);font-weight:700}
.slides{display:grid}
.slide{grid-area:1/1;opacity:0;transform:translateY(18px);transition:.6s}
.slide.on{opacity:1;transform:none}
.slide p{font-size:18px;color:#3f3d4c;max-width:460px}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.tags span{font-size:13px;padding:6px 12px;border-radius:999px;background:rgba(214,161,54,.16);color:var(--gold-d);font-weight:600}
.dots{display:flex;gap:8px;margin-top:22px}.dots i{width:34px;height:4px;border-radius:4px;background:rgba(29,37,64,.15)}.dots i.on{background:var(--gold)}
/* night: PDF */
.night{position:relative;background:radial-gradient(120% 80% at 50% 0,#1b2c52,var(--navy) 60%);color:#f7f1e7;padding:120px 0 170px;overflow:hidden}
.night:before{content:"";position:absolute;inset:0;background-image:radial-gradient(1.5px 1.5px at 12% 20%,#fff9,transparent),radial-gradient(1px 1px at 70% 12%,#fff8,transparent),radial-gradient(1.5px 1.5px at 85% 60%,#fff9,transparent),radial-gradient(1px 1px at 30% 75%,#fff7,transparent),radial-gradient(1px 1px at 55% 40%,#fff6,transparent),radial-gradient(1.5px 1.5px at 6% 88%,#fff8,transparent);opacity:.8}
.night .eyebrow{color:var(--gold-l)}
.night h2{font-size:clamp(36px,6vw,78px);margin:14px 0 18px}
.night h2 em{color:var(--gold-l)}
.night .lead{max-width:560px;color:#cfc8ba;font-size:18px}
.pdf{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;position:relative}
.book{position:relative;aspect-ratio:1/.98}
.book img{position:absolute;width:46%;border-radius:6px;box-shadow:0 30px 70px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.08)}
.book .b1{left:2%;top:8%;transform:rotate(-7deg)}.book .b2{left:26%;top:0;transform:rotate(2deg);z-index:2}.book .b3{left:48%;top:12%;transform:rotate(9deg)}
.prices{display:grid;gap:12px;margin:30px 0}
.pr{display:flex;justify-content:space-between;gap:16px;padding:18px 22px;border-radius:18px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(246,219,151,.22)}
.pr b{font-family:var(--serif);font-weight:500;font-size:22px;display:block}.pr span{font-size:14px;color:#bdb6aa}
.pr strong{font-family:var(--serif);font-size:32px;color:var(--gold-l);font-weight:500;white-space:nowrap}
.note{font-size:13px;color:#a9a396;margin-top:16px}
/* bot */
.bot{padding:110px 0}
.bot h2{font-size:clamp(34px,5.4vw,70px);max-width:760px;margin:14px 0 46px}
.feats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.f{padding:28px;border-radius:26px;background:#fff;box-shadow:0 0 0 1px rgba(142,100,32,.16),0 18px 40px rgba(142,100,32,.08)}
.f svg{width:34px;height:34px;color:var(--gold-d)}.f h3{font-size:24px;margin:16px 0 8px}.f p{margin:0;color:var(--soft);font-size:15.5px}
.plus{margin-top:22px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding:30px 34px;border-radius:28px;background:linear-gradient(120deg,#fff0c8,#fbe0a0)}
.plus h3{font-size:clamp(24px,3vw,36px)}.plus p{margin:8px 0 0;color:#4d3d1a}
.final{position:relative;text-align:center;padding:130px 0 110px;overflow:hidden;background:linear-gradient(180deg,#fbf3e2,#f6dfa6)}
.final img{width:120px;margin:0 auto 18px;display:block}
.final h2{font-size:clamp(38px,7vw,96px)}
.final p{margin:18px auto 30px;max-width:480px;color:#4d3d1a}
footer{padding:26px 24px;text-align:center;font-size:13px;color:#6c5a36;background:#f6dfa6}
.rev{opacity:0;transform:translateY(34px);transition:opacity .9s,transform .9s}.rev.in{opacity:1;transform:none}
@media(max-width:860px){
 nav a.l{display:none}nav .btn{white-space:nowrap}
 .dial{height:300vh}.dial .grid,.pdf{grid-template-columns:1fr}.dial .grid{gap:0}
 .disc{width:min(56vw,280px)}
 .book{order:2;margin-top:10px}.feats{grid-template-columns:1fr}
 .lp-hero .in{padding:96px 0 90px}.lp-hero .sun{width:100vw;top:86%}.lp-hero .mark{width:30vw;top:86%}.lp-hero .in{padding-bottom:170px}
 .night{padding:80px 0}.bot{padding:70px 0}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rev{opacity:1;transform:none}.lp-hero .sun{transform:translate(-50%,-50%)}}
footer a{color:inherit;margin:0 8px;white-space:nowrap}footer p{margin:0 auto 8px;max-width:760px}

@media(prefers-reduced-motion:reduce){.dial{height:auto}.dial .stick{position:static;height:auto;padding:60px 0}.slides{display:block}.slide{opacity:1;transform:none;margin-bottom:34px}.dots{display:none}}
html:lang(ja) .lp-hero h1,html:lang(zh) .lp-hero h1,html:lang(ko) .lp-hero h1,html:lang(hi) .lp-hero h1{font-size:clamp(32px,5.6vw,80px);line-height:1.18;letter-spacing:0}
html:lang(ja) h2,html:lang(zh) h2,html:lang(ko) h2,html:lang(hi) h2{letter-spacing:0;line-height:1.2}
h1,h2{text-wrap:balance}