@font-face{font-family:CG;src:url(/assets/fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:CG;src:url(/assets/fonts/cormorant-garamond-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Inter;src:url(/assets/fonts/inter-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url(/assets/fonts/inter-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Inter;src:url(/assets/fonts/inter-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
:root{--ink:#1F1F1F;--muted:#6B6B6B;--line:#E6E2DB;--soft:#F6F4F0;--gold:#B8863B;--serif:CG,Georgia,serif;--sans:Inter,Arial,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:#fff;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1120px;margin:0 auto;padding:0 28px}
.ov{font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--muted);font-weight:500}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.12}
h2{font-size:clamp(30px,4vw,42px);margin:12px 0 18px}
.lead{color:var(--muted);font-size:18px;max-width:680px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 26px;border:1px solid var(--ink);border-radius:999px;text-decoration:none;font-weight:500;font-size:15px;transition:.2s;background:#fff}
.btn:hover{background:var(--gold);border-color:var(--gold);color:#fff}
.btn.dark{background:var(--ink);color:#fff}.btn.dark:hover{background:var(--gold);border-color:var(--gold);color:#fff}
.btn svg{width:18px;height:18px;fill:currentColor}
/* nav */
header{position:sticky;top:0;z-index:20;background:rgba(31,31,31,.94);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.1)}
nav{display:flex;align-items:center;justify-content:space-between;height:72px}
nav .logo img{height:26px;width:auto}
nav ul{display:flex;gap:30px;list-style:none;align-items:center}
nav ul a{text-decoration:none;font-size:14px;letter-spacing:.3px;color:#fff}
nav ul a:hover{color:var(--gold)}
.lng{display:flex;gap:4px;font-size:12px;letter-spacing:2px;margin-left:10px}
.lng a{text-decoration:none;padding:6px 8px;color:#8F8F8F}
.lng a.on{color:#fff;border-bottom:1px solid var(--gold)}
.burger{display:none;background:none;border:0;width:40px;height:40px;cursor:pointer}
.burger span{display:block;height:1.5px;background:#fff;margin:6px 8px}
/* hero */
.hero{padding:110px 0 90px;background:var(--ink);color:#fff;position:relative;overflow:hidden}.hero .wrap{position:relative;z-index:1}
.hero h1{color:#fff}.hero .lead{color:#C9C4BC}.hero .meta{color:#9A9A9A}.hero .meta b{color:#fff}.hero .ov{color:#8F8F8F}
.hero .btn.dark{background:#fff;color:var(--ink);border-color:#fff}.hero .btn{color:#fff;background:transparent;border-color:rgba(255,255,255,.45)}.hero .btn:hover,.hero .btn.dark:hover{background:var(--gold);border-color:var(--gold);color:#fff}
.wm{position:absolute;right:-2%;top:50%;width:min(44vw,540px);transform:translateY(-50%);pointer-events:none;opacity:0;animation:wm 1.6s .3s ease-out forwards}.wm svg{width:100%;height:auto;display:block}
@keyframes wm{to{opacity:1}}
.hero h1{font-size:clamp(40px,6.2vw,72px);max-width:900px;letter-spacing:-.5px}
.hero h1 i{font-style:normal;color:var(--gold)}
.hero .lead{margin:26px 0 38px;font-size:19px}
.hero .cta{display:flex;gap:14px;flex-wrap:wrap}
.hero .meta{margin-top:56px;display:flex;gap:40px;flex-wrap:wrap;color:var(--muted);font-size:14px}
.hero .meta b{display:block;font-family:var(--serif);font-weight:500;font-size:26px;color:#fff}
/* sections */
section{padding:96px 0}
section.soft{background:var(--soft)}
.packs{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px}
.pk{background:#fff;border:1px solid var(--line);padding:34px 30px 30px;display:flex;flex-direction:column}
.pk.hi{border-color:var(--ink)}
.pk h3{font-size:30px;margin:6px 0 8px}
.pk .d{color:var(--muted);font-size:15.5px;min-height:72px}
.pk ul{list-style:none;margin:22px 0 26px;font-size:15px}
.pk li{padding:9px 0 9px 20px;position:relative;border-top:1px dotted var(--line)}
.pk li:before{content:'';position:absolute;left:0;top:17px;width:6px;height:6px;background:var(--gold);border-radius:50%}
.pk .pr{margin-top:auto;border-top:1px solid var(--line);padding-top:20px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.pk .amt{font-family:var(--serif);font-size:40px;line-height:1}
.pk .was{color:#9A9A9A;text-decoration:line-through;font-size:15px}
.pk .lbl{width:100%;font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
.pk .btn{margin-top:22px;align-self:flex-start}
.bundle{margin-top:22px;background:#fff;border:1px solid var(--line);padding:26px 30px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.bundle b{font-family:var(--serif);font-weight:500;font-size:24px;display:block}
.bundle span{color:var(--muted);font-size:15px}
.bundle .amt{font-family:var(--serif);font-size:34px}
.bundle .amt s{font-family:var(--sans);font-size:15px;color:#9A9A9A;margin-left:8px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:44px}
.steps .s{border-left:1px solid var(--ink);padding-left:22px}
.steps b{display:block;font-family:var(--serif);font-weight:500;font-size:26px;margin:8px 0 8px}
.steps p{color:var(--muted);font-size:15.5px}
.ex{display:grid;grid-template-columns:1.55fr 1fr;gap:26px;margin-top:44px;align-items:stretch}
.mock{background:var(--soft);border:1px solid var(--line);padding:28px;display:flex;align-items:center;justify-content:center}
.browser{width:100%;height:100%;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);box-shadow:0 20px 50px rgba(0,0,0,.08)}
.browser .bar{height:30px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:6px;padding:0 12px}
.browser .bar i{width:9px;height:9px;border-radius:50%;background:#E6E2DB;display:block}
.browser img{width:100%;display:block;flex:1 1 auto;height:0;min-height:0;object-fit:cover;object-position:top}
@media(max-width:900px){.browser img{height:auto;aspect-ratio:1100/1150}}
.side{display:grid;gap:26px}
.phone{width:62%;margin:0 auto;background:#111;border-radius:26px;padding:9px;box-shadow:0 20px 50px rgba(0,0,0,.14)}
.phone img{width:100%;display:block;border-radius:18px;aspect-ratio:1170/1560;object-fit:cover;object-position:top}
.card{width:100%;background:#fff;border:1px solid var(--line);box-shadow:0 16px 40px rgba(0,0,0,.08)}
.card img{width:100%;display:block}
.cap{margin-top:16px;color:var(--muted);font-size:14.5px}
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;margin-top:44px}
.why b{display:block;font-family:var(--serif);font-weight:500;font-size:26px;margin-bottom:8px}
.why p{color:var(--muted);font-size:15.5px}
.about{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.about .q{font-family:var(--serif);font-size:clamp(24px,2.6vw,32px);line-height:1.3}
.about .q i{font-style:normal;color:var(--gold)}
.about p{color:var(--muted);margin-top:18px}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:60px}
.contact .ways a{display:flex;align-items:center;gap:14px;text-decoration:none;padding:18px 0;border-bottom:1px solid var(--line);font-size:17px}
.contact .ways a:hover{color:var(--gold)}
.contact .ways svg{width:22px;height:22px;flex:none}
.contact .ways small{display:block;color:var(--muted);font-size:13px}
form{display:grid;gap:14px}
form label{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
form input,form textarea,form select{width:100%;font:inherit;font-size:16px;padding:14px 16px;border:1px solid var(--line);background:#fff;border-radius:0;color:var(--ink)}
form input:focus,form textarea:focus,form select:focus{outline:none;border-color:var(--ink)}
form textarea{min-height:130px;resize:vertical}
form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
form .hint{font-size:13px;color:var(--muted)}
footer{border-top:1px solid var(--ink);padding:40px 0;font-size:14px;color:var(--muted)}
footer .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
footer img{height:22px}
footer a{text-decoration:none}
footer a:hover{color:var(--gold)}
footer .legal a{margin-left:16px}
.wa{position:fixed;right:22px;bottom:22px;width:56px;height:56px;border-radius:50%;background:var(--ink);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(0,0,0,.18);z-index:30}
.wa svg{width:26px;height:26px;fill:#fff}
/* motion */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.1s}.reveal.d2{transition-delay:.2s}.reveal.d3{transition-delay:.3s}
.hero .ov,.hero h1,.hero .lead,.hero .cta,.hero .meta{opacity:0;animation:up .9s cubic-bezier(.2,.7,.2,1) forwards}
.hero h1{animation-delay:.1s}.hero .lead{animation-delay:.25s}.hero .cta{animation-delay:.4s}.hero .meta{animation-delay:.55s}
@keyframes up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.hero h1 i{background:linear-gradient(90deg,var(--gold),#d4a862,var(--gold));background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:up .9s .1s cubic-bezier(.2,.7,.2,1) forwards,shine 6s 1.2s linear infinite}
@keyframes shine{to{background-position:200% 0}}
.pk{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s}
.pk:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(0,0,0,.08);border-color:var(--ink)}
.steps .s,.why div{transition:transform .35s}
.steps .s:hover{transform:translateX(6px)}
.mock .browser,.mock .phone,.mock .card{transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.mock:hover .browser,.mock:hover .phone,.mock:hover .card{transform:translateY(-6px)}
header.scrolled{box-shadow:0 6px 24px rgba(0,0,0,.25)}
.wa{transition:transform .25s}.wa:hover{transform:scale(1.08)}
.ways a{transition:padding-left .25s}.ways a:hover{padding-left:6px}
h2{position:relative}
h2:after{content:'';display:block;width:0;height:1px;background:var(--gold);margin-top:14px;transition:width .9s cubic-bezier(.2,.7,.2,1)}
.in h2:after,h2.in:after{width:56px}
@media(prefers-reduced-motion:reduce){.reveal,.hero *{opacity:1!important;transform:none!important;animation:none!important;transition:none!important}}
/* chips */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.chips label{font:inherit;font-size:14px;letter-spacing:0;text-transform:none;color:var(--ink);border:1px solid var(--line);padding:10px 16px;border-radius:999px;cursor:pointer;transition:.2s;background:#fff}
.chips input{position:absolute;width:1px;height:1px;left:0;top:0;margin:0;padding:0;opacity:0;pointer-events:none;overflow:hidden}
.chips label:hover{border-color:var(--ink)}
.chips input:checked+label,.chips label.on{background:var(--ink);color:#fff;border-color:var(--ink)}
/* legal */
.doc{max-width:760px;margin:0 auto;padding:80px 28px 100px}
.doc h1{font-size:clamp(34px,4.5vw,48px);margin-bottom:10px}
.doc h2{font-size:26px;margin:44px 0 10px}
.doc p{margin:10px 0;color:#333}
.doc dl{display:grid;grid-template-columns:200px 1fr;gap:10px 24px;margin:20px 0}
.doc dt{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);padding-top:4px}
.doc a{color:var(--ink)}
@media(max-width:900px){
  .packs,.steps,.why{grid-template-columns:1fr}
  .about,.contact{grid-template-columns:1fr;gap:40px}
  .ex{grid-template-columns:1fr}.side{grid-template-columns:1fr 1fr}.phone{width:70%}
}
@media(max-width:720px){
  body{font-size:16px}
  .wrap{padding:0 20px}
  nav ul{display:none;position:absolute;top:72px;left:0;right:0;background:var(--ink);border-bottom:1px solid rgba(255,255,255,.1);flex-direction:column;gap:0;padding:10px 20px 20px}
  nav ul.open{display:flex}
  nav ul li{width:100%}nav ul a{display:block;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.1);font-size:16px}
  nav ul li:last-child a{border:0}
  .burger{display:block}
  .hero{padding:70px 0 60px}.wm{width:70vw;right:-18vw;top:38%}
  .hero .meta{gap:24px}
  section{padding:64px 0}
  .pk{padding:26px 22px}
  form .row{grid-template-columns:1fr}
  .side{grid-template-columns:1fr}.mock{padding:16px}.phone{width:60%}
  .doc{padding:50px 20px 70px}.doc dl{grid-template-columns:1fr;gap:2px}.doc dd{margin-bottom:12px}
  footer .wrap{flex-direction:column;align-items:flex-start}
}