:root{--ink:#0b0a09;--base:#11100e;--surface:#171512;--hair:rgba(240,226,196,.12);--gold:#c9a24a;--gold-l:#e7c478;--gold-d:#a67f30;--cream:#f7f2e8;--paper:#2d2620;--on:#f5f0e6;--on2:#b0a594;--display:"Playfair Display",Georgia,serif;--caps:"Jost","Avenir Next",system-ui,sans-serif;--body:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",system-ui,sans-serif;--spring:cubic-bezier(.32,.72,0,1);color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--on);font:17px/1.6 var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
img{max-width:100%;display:block}
.caps{font:500 12px/1.4 var(--caps);letter-spacing:.32em;text-transform:uppercase;color:var(--on2);margin:0 0 14px}
.caps.gold{color:var(--gold-l)}.caps.dark{color:#8a7d68}
h1,h2,h3{font-family:var(--display);font-weight:400;letter-spacing:-.01em;text-wrap:balance;margin:0 0 18px}
h1{font-size:clamp(44px,6.4vw,86px);line-height:1.02}
h2{font-size:clamp(34px,4.2vw,56px);line-height:1.08}
h3{font-size:34px}
h4{font:500 18px var(--body);margin:0 0 8px}
em{font-style:italic;color:var(--gold-l)}
.lede{font-size:19px;color:var(--on2);max-width:56ch}
.fine{font-size:14px;color:var(--on2)}
.center{text-align:center;margin-left:auto;margin-right:auto}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right))}
.two{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.nav{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:14px max(20px,env(safe-area-inset-right)) 14px max(20px,env(safe-area-inset-left));background:rgba(11,10,9,.62);backdrop-filter:saturate(170%) blur(22px);-webkit-backdrop-filter:saturate(170%) blur(22px);border-bottom:1px solid var(--hair)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font:400 21px var(--display)}
.brand img{border-radius:9px}
.nav nav{display:flex;gap:26px;align-items:center;font-size:15px}
.nav nav a{text-decoration:none;color:var(--on2);transition:color .2s}
.nav nav a:hover{color:var(--on)}
.nav .pill{color:var(--ink)!important;background:var(--gold);padding:9px 18px;border-radius:999px;font-weight:500}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 28px;border-radius:999px;text-decoration:none;font:500 17px var(--body);transition:transform .25s var(--spring),box-shadow .25s}
.btn:active{transform:scale(.96)}
.btn.gold{background:linear-gradient(180deg,#ecca82,#c9a24a);color:#1a1408;box-shadow:0 10px 34px rgba(201,162,74,.28),inset 0 1px 0 rgba(255,255,255,.5)}
.btn.gold:hover{box-shadow:0 14px 44px rgba(201,162,74,.42),inset 0 1px 0 rgba(255,255,255,.5)}
.btn.line{box-shadow:inset 0 0 0 1px rgba(240,226,196,.28)}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0 14px}
.hero{max-width:1180px;margin:0 auto;padding:90px max(20px,env(safe-area-inset-right)) 110px max(20px,env(safe-area-inset-left));display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.wipe{position:relative;margin:0;aspect-ratio:3/4;border-radius:34px;overflow:hidden;cursor:ew-resize;touch-action:none;user-select:none;box-shadow:0 40px 100px rgba(0,0,0,.6),0 0 0 1px var(--hair);--x:50%}
.wipe img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.wipe .after{clip-path:inset(0 0 0 var(--x))}
.handle{position:absolute;top:0;bottom:0;left:var(--x);width:2px;background:#fff;transform:translateX(-1px)}
.handle::after{content:"";position:absolute;top:50%;left:50%;width:54px;height:54px;transform:translate(-50%,-50%);border-radius:50%;background:rgba(255,255,255,.92) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1408' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M9 6 3 12l6 6M15 6l6 6-6 6'/%3E%3C/svg%3E") center/22px no-repeat;box-shadow:0 6px 24px rgba(0,0,0,.35)}
.tag{position:absolute;top:18px;font:500 11px var(--caps);letter-spacing:.24em;text-transform:uppercase;padding:7px 12px;border-radius:999px;background:rgba(0,0,0,.5);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.tag.l{left:18px}.tag.r{right:18px;background:var(--gold);color:#1a1408}
.band{padding:120px 0}
.band.dark{background:var(--base)}
.list{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:14px}
.list li{position:relative;padding-left:34px;color:var(--on2)}
.list li::before{content:"";position:absolute;left:0;top:13px;width:18px;height:1px;background:var(--gold)}
.list b{color:var(--on);font-weight:500}
.angles{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:14px;align-items:center}
.angles figure{margin:0;border-radius:24px;overflow:hidden;position:relative;aspect-ratio:3/4;transition:transform .8s var(--spring)}
.angles figure:hover{transform:translateY(-6px)}
.angles img{width:100%;height:100%;object-fit:cover}
.angles figcaption{position:absolute;left:0;right:0;bottom:0;padding:30px 14px 12px;background:linear-gradient(transparent,rgba(0,0,0,.7));font:500 11px var(--caps);letter-spacing:.24em;text-transform:uppercase}
.angles .mid{box-shadow:0 0 0 2px var(--gold-l),0 20px 60px rgba(201,162,74,.25)}
.paper-band{padding:120px 0;background:linear-gradient(180deg,var(--ink),#15120e)}
.paper{position:relative;background:var(--cream);color:var(--paper);border-radius:30px;padding:46px 46px 40px;box-shadow:0 40px 100px rgba(0,0,0,.5)}
.paper h3{margin-bottom:10px}
.paper p{color:#5b5045}
.sig{margin-top:24px;border-bottom:1px solid #d9c9a3;padding-bottom:8px}
.sig svg{width:70%;height:70px;fill:none;stroke:#2d2620;stroke-width:2.4;stroke-linecap:round;stroke-dasharray:900;stroke-dashoffset:900}
.paper.in .sig svg{animation:draw 2.2s .3s ease-out forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.stamp{position:absolute;right:36px;top:36px;width:130px;height:130px;border-radius:50%;display:grid;place-content:center;text-align:center;color:var(--gold-d);box-shadow:inset 0 0 0 3px var(--gold-d),inset 0 0 0 9px var(--cream),inset 0 0 0 10px var(--gold-d);transform:rotate(-12deg) scale(1.8);opacity:0}
.stamp span{font:500 11px var(--caps);letter-spacing:.32em;text-transform:uppercase}
.stamp b{font:400 17px var(--display);margin-top:2px}
.paper.in .stamp{animation:stamp .7s 2.4s var(--spring) forwards}
@keyframes stamp{to{opacity:1;transform:rotate(-12deg) scale(1)}}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:56px;border-top:1px solid var(--hair)}
.grid3 article{padding:32px 30px 34px 0;border-bottom:1px solid var(--hair)}
.grid3 p{color:var(--on2);margin:0}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:46px 0 22px}
.plan{background:var(--surface);border-radius:28px;padding:32px;transition:transform .5s var(--spring)}
.plan:hover{transform:translateY(-5px)}
.plan.feat{background:linear-gradient(170deg,#262017,#171512 60%);box-shadow:inset 0 0 0 1px rgba(231,196,120,.35)}
.price{font:400 44px var(--display);margin:4px 0}
.price small{font:400 16px var(--body);color:var(--on2);margin-left:4px}
.get{padding:130px 0 140px;background:radial-gradient(ellipse 50% 60% at 50% 40%,rgba(201,162,74,.10),transparent 70%)}
.get .mark{margin:0 auto 26px;border-radius:24px;box-shadow:0 20px 60px rgba(201,162,74,.28);animation:breathe 4s ease-in-out infinite}
@keyframes breathe{50%{transform:scale(1.04)}}
.foot{border-top:1px solid var(--hair);padding:56px 0 40px;background:var(--base)}
.foot .cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px}
.foot .cols a{display:block;text-decoration:none;color:var(--on2);margin:6px 0;font-size:15px}
.foot .cols a:hover{color:var(--on)}
.foot .copy{margin-top:40px}
.reveal{opacity:1;transform:none}
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .9s ease-out,transform 1s var(--spring)}
.js .reveal.in{opacity:1;transform:none}
:focus-visible{outline:2px solid var(--gold-l);outline-offset:3px}
@media (max-width:900px){.hero,.two{grid-template-columns:1fr;gap:44px}.hero{padding-top:50px}.grid3,.plans{grid-template-columns:1fr}.foot .cols{grid-template-columns:1fr}.nav nav a:not(.pill){display:none}.band,.paper-band{padding:80px 0}.stamp{width:96px;height:96px;right:18px;top:auto;bottom:70px}.stamp b{font-size:14px}.paper{padding:34px 26px 30px}.angles figcaption{letter-spacing:.14em;font-size:10px;padding:24px 8px 10px;white-space:nowrap}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.js .reveal{opacity:1;transform:none}.sig svg{stroke-dashoffset:0}.stamp{opacity:1;transform:rotate(-12deg)}}
