:root{--ink:#14210a;--lime:#d7f25c;--cream:#f6f1e7;--plum:#3d1a4f;--blue:#1d3fbb;--muted:#5d6457;--line:#e3e0d6;--r:18px}
*{box-sizing:border-box}
body{margin:0;font-family:'Inter',system-ui,sans-serif;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased;line-height:1.5}
h1,h2,h3{font-family:'Space Grotesk',sans-serif;letter-spacing:-.02em;line-height:1.05;margin:0 0 16px}
a{color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}.narrow{max-width:760px}
.center{text-align:center}.muted{color:var(--muted)}.small{font-size:13px}
.lead{font-size:19px;color:#3a4235;max-width:560px}
.center.lead{margin:0 auto 32px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border-radius:999px;font:600 15px/1 'Inter',sans-serif;text-decoration:none;border:0;cursor:pointer;transition:transform .12s, background .15s;white-space:nowrap}
.btn:hover{transform:translateY(-1px)}
.btn-dark{background:var(--ink);color:#fff}.btn-dark:hover{background:#000}
.btn-lime{background:var(--lime);color:var(--ink)}.btn-lime:hover{background:#c9e84a}
.btn-ghost{background:transparent;color:var(--ink)}.btn-ghost:hover{background:#0000000d}
.btn-lg{padding:16px 26px;font-size:16px}.btn-block{width:100%}

.nav{position:sticky;top:12px;z-index:50;margin:12px}
.nav-in{background:#fff;border-radius:999px;box-shadow:0 2px 18px #0000001a;display:flex;align-items:center;gap:24px;padding:10px 12px 10px 22px;max-width:1180px}
.brand{display:inline-flex;align-items:center;gap:9px;font:700 20px 'Space Grotesk',sans-serif;text-decoration:none;letter-spacing:-.02em}
.nav-links{display:flex;gap:6px;flex:1}.nav-links a{text-decoration:none;padding:8px 12px;border-radius:10px;font-weight:500;color:#333}.nav-links a:hover{background:#f2f2ee}
.nav-cta{display:flex;gap:6px}
@media(max-width:820px){.nav-links{display:none}.nav-in{justify-content:space-between}}

.hero{background:var(--lime);margin-top:-80px;padding:150px 0 90px}
.hero-in{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
.hero h1{font-size:clamp(42px,6vw,78px)}
.hero h1 em{font-style:normal;background:var(--ink);color:var(--lime);padding:0 .18em;border-radius:.18em}
.pill{display:inline-block;background:#ffffff99;border-radius:99px;padding:6px 14px;font-size:13px;font-weight:600;margin-bottom:22px}
.hero-art{position:relative;height:540px}
.hero-art .phone{position:absolute}.hero-art .phone:first-child{right:150px;top:20px;transform:rotate(-6deg)}.hero-art .phone:last-child{right:0;top:80px;transform:rotate(5deg)}
@media(max-width:900px){.hero-in{grid-template-columns:1fr}.hero-art{height:480px;max-width:420px;margin:0 auto;width:100%}.hero-art .phone:first-child{right:auto;left:0}}

.claim{display:flex;gap:10px;margin:28px 0 12px;max-width:600px;flex-wrap:wrap}
.claim-field{flex:1;min-width:250px;display:flex;align-items:center;background:#fff;border-radius:14px;padding:0 16px;border:2px solid transparent}
.claim-field:focus-within{border-color:var(--ink)}
.claim-host{color:var(--muted);font-weight:500;white-space:nowrap}
.claim input{border:0;outline:0;font:600 16px 'Inter',sans-serif;padding:17px 0;width:100%;min-width:60px;background:transparent}
.claim .btn{border-radius:14px}
.claim-dark{margin:28px auto 0;justify-content:center}

.phone{width:240px;height:480px;border-radius:38px;background:#111;padding:10px;box-shadow:0 30px 60px -20px #00000066}
.phone-screen{height:100%;border-radius:30px;background:var(--pbg);color:var(--ptext);padding:34px 16px 16px;display:flex;flex-direction:column;align-items:center;gap:9px;overflow:hidden;text-align:center}
.ph-av{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;color:#fff;font:700 20px 'Space Grotesk';margin-bottom:4px}
.ph-name{font-weight:700;font-size:15px}.ph-bio{font-size:11.5px;opacity:.8;margin-bottom:8px}
.ph-btn{width:100%;padding:11px 8px;font-size:12px;font-weight:600;background:var(--pbtn);color:var(--pbtext);border-radius:var(--prad);border:2px solid transparent}
.ph-outline{background:transparent;border-color:var(--pbtext)}.ph-shadow{box-shadow:0 4px 12px #0000001f}.ph-hard{border-color:var(--pbtext);box-shadow:3px 3px 0 var(--pbtext)}.ph-glass{border-color:#ffffff55}
.ph-hl{animation:wig 2.4s ease-in-out infinite}
@keyframes wig{0%,80%,100%{transform:rotate(0)}84%{transform:rotate(-2deg)}88%{transform:rotate(2deg)}92%{transform:rotate(-1deg)}96%{transform:rotate(1deg)}}

.strip{background:var(--ink);color:#fff;padding:20px 0;overflow:hidden}
.strip-in{display:flex;gap:28px;align-items:center;flex-wrap:wrap;justify-content:center;font-size:15px}
.strip-in span{opacity:.7}.strip-in b{font-family:'Space Grotesk';font-size:18px}

.feature{padding:110px 0}
.feat-in{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.feat-in.rev>div:first-child{order:2}
.feature h2{font-size:clamp(34px,4.5vw,56px)}
.feature p{font-size:18px;margin:0 0 28px;max-width:520px}
.f-lime{background:#eef9c6}.f-plum{background:var(--plum);color:#fff}.f-cream{background:var(--cream)}.f-blue{background:var(--blue);color:#fff}.f-ink{background:#0f140c;color:#fff}
.f-plum p,.f-blue p,.f-ink p{color:#ffffffd9}
@media(max-width:900px){.feat-in{grid-template-columns:1fr}.feat-in.rev>div:first-child{order:0}.feature{padding:72px 0}}

.theme-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.tchip{aspect-ratio:3/4.4;border-radius:16px;padding:16px 12px;display:flex;flex-direction:column;gap:8px;justify-content:center;box-shadow:0 8px 24px -10px #0000004d;transition:transform .2s}
.tchip:hover{transform:translateY(-6px) rotate(-2deg)}
.tchip span{height:18px;display:block}.tchip i{font-style:normal;font-weight:700;font-size:13px;text-align:center;margin-top:6px}

.share-card{background:#fff;color:var(--ink);border-radius:24px;padding:28px;display:flex;flex-direction:column;gap:18px;box-shadow:0 30px 60px -20px #0006;max-width:440px;justify-self:center;width:100%}
.sc-row{display:flex;align-items:center;gap:10px;background:#f4f4ef;padding:14px 16px;border-radius:14px;font-size:15px}
.sc-row code{font-family:'Inter';flex:1;overflow:hidden;text-overflow:ellipsis}.sc-row small{color:var(--muted);white-space:nowrap}
.sc-dot{width:10px;height:10px;border-radius:50%;background:var(--plum)}.sc-dot.g{background:#2e9c4a}
.sc-qr{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;width:170px;margin:0 auto}
.sc-qr i{aspect-ratio:1;background:var(--ink);border-radius:3px}
.sc-qr i:nth-child(3n+2),.sc-qr i:nth-child(5n+1){background:transparent}
.sc-qr i:nth-child(1),.sc-qr i:nth-child(2),.sc-qr i:nth-child(7),.sc-qr i:nth-child(8),.sc-qr i:nth-child(43),.sc-qr i:nth-child(44),.sc-qr i:nth-child(49){background:var(--ink)}

.shorten-demo{display:flex;flex-direction:column;align-items:center;gap:14px}
.sd-in{background:#fff;border:2px dashed #c9c2b2;border-radius:14px;padding:18px;font-size:13px;color:var(--muted);word-break:break-all;max-width:460px}
.sd-arrow{font-size:30px}
.sd-out{background:var(--ink);color:var(--lime);border-radius:14px;padding:18px 28px;font:600 22px 'Space Grotesk'}

.lead-card{background:#fff;color:var(--ink);border-radius:24px;padding:28px;display:flex;flex-direction:column;gap:12px;max-width:380px;justify-self:center;width:100%;box-shadow:0 30px 60px -20px #0008}
.lead-card b{font:700 20px 'Space Grotesk'}
.lc-in{border:1.5px solid var(--line);border-radius:12px;padding:13px;color:#999;font-size:14px}
.lc-btn{background:var(--blue);color:#fff;border-radius:12px;padding:14px;text-align:center;font-weight:700}
.lead-card small{color:#2e9c4a;font-weight:600}

.stats-card{background:#1b2216;border-radius:24px;padding:28px;display:flex;flex-direction:column;gap:20px}
.st-row{display:flex;gap:24px}.st-row div{flex:1}.st-row small{display:block;opacity:.6;font-size:13px}.st-row b{font:700 30px 'Space Grotesk'}
.st-bars{display:flex;gap:2px;align-items:flex-end;height:160px}
.st-bars i{flex:1;background:var(--lime);border-radius:4px 4px 0 0}

.examples{padding:110px 0;background:#fafaf7}
.examples h2,.pricing-prev h2,.faq h2,.final h2{font-size:clamp(32px,4vw,52px)}
.ex-row{display:flex;gap:22px;overflow-x:auto;padding:20px 4px 30px;scroll-snap-type:x mandatory}
.ex-row .phone{flex:0 0 auto;scroll-snap-align:center;transform:scale(.95)}
@media(min-width:1240px){.ex-row{justify-content:center}}

.pricing-prev,.pricing-page{padding:110px 0}
.pricing-page{padding-top:60px}.pricing-page h1{font-size:clamp(38px,5vw,64px)}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1040px;margin:0 auto}
.price{border:1.5px solid var(--line);border-radius:24px;padding:30px;position:relative;background:#fff;display:flex;flex-direction:column}
.price-hot{background:var(--ink);color:#fff;border-color:var(--ink);transform:translateY(-10px)}
.price-hot .muted{color:#ffffffaa}
.price h3{font-size:26px;margin-bottom:4px}
.badge{position:absolute;top:-13px;left:30px;background:var(--lime);color:var(--ink);padding:5px 12px;border-radius:99px;font-size:12px;font-weight:700}
.amount{font:700 44px 'Space Grotesk';margin:12px 0 20px;letter-spacing:-.03em}.amount small{font-size:16px;font-weight:500;opacity:.7}
.price ul{list-style:none;padding:0;margin:24px 0 0;display:flex;flex-direction:column;gap:10px;font-size:15px}
.price li:before{content:'✓';font-weight:700;margin-right:10px;color:#2e9c4a}.price-hot li:before{color:var(--lime)}
@media(max-width:900px){.price-grid{grid-template-columns:1fr;max-width:440px}.price-hot{transform:none}}
.table-wrap{overflow-x:auto;max-width:1040px;margin:24px auto 0}
.compare{width:100%;border-collapse:collapse;font-size:15px}
.compare th,.compare td{padding:14px 16px;border-bottom:1px solid var(--line);text-align:center}
.compare tbody th{text-align:left;font-weight:500}.compare thead th{font:700 18px 'Space Grotesk'}

.faq{padding:90px 0;background:var(--cream)}
.faq details{background:#fff;border-radius:16px;margin-bottom:12px;padding:0 22px}
.faq summary{cursor:pointer;padding:20px 0;font:600 18px 'Space Grotesk';list-style:none;display:flex;justify-content:space-between}
.faq summary:after{content:'+';font-size:24px;line-height:1}.faq details[open] summary:after{content:'–'}
.faq details p{margin:0 0 20px;color:#3a4235}

.final{background:var(--plum);color:#fff;padding:110px 0}
.final .lead{color:#ffffffcc}

.foot{background:#0f140c;color:#fff;padding:60px 0 30px}
.foot-in{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;margin-bottom:40px}
.foot .brand svg rect{fill:var(--lime)}.foot .brand svg path{stroke:var(--ink)}.foot .brand svg circle{fill:var(--ink)}
.foot-cols{display:flex;gap:60px}.foot-cols div{display:flex;flex-direction:column;gap:8px}.foot-cols a{text-decoration:none;opacity:.75}.foot-cols a:hover{opacity:1}
.foot .muted{color:#ffffff88}
.legal{padding:60px 24px 100px}.legal h1{font-size:44px}.legal h3{margin-top:28px;font-size:20px}

/* auth */
.auth{background:#fff}
.auth-wrap{display:grid;grid-template-columns:1fr 1fr;min-height:100vh}
.auth-card{padding:40px clamp(24px,6vw,90px);max-width:620px;width:100%;margin:0 auto;display:flex;flex-direction:column;justify-content:center}
.auth-card h1{font-size:38px;margin:40px 0 6px}
.auth-side{background:var(--lime);display:flex;align-items:center;padding:60px}
.auth-side h2{font-size:56px}.auth-side p{font-size:19px;max-width:420px}
@media(max-width:860px){.auth-wrap{grid-template-columns:1fr}.auth-side{display:none}}
.form{display:flex;flex-direction:column;gap:16px;margin:24px 0}
.form label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:14px}
.form input{font:16px 'Inter';padding:14px 16px;border:1.5px solid var(--line);border-radius:12px;background:#fafaf8;outline:0}
.form input:focus{border-color:var(--ink);background:#fff}
.prefix{display:flex;align-items:center;border:1.5px solid var(--line);border-radius:12px;background:#fafaf8;padding-left:14px}
.prefix:focus-within{border-color:var(--ink);background:#fff}
.prefix span{color:var(--muted);font-weight:500;white-space:nowrap;font-size:15px}
.prefix input{border:0;background:transparent;padding-left:2px;width:100%;min-width:0}
.hint{font-weight:500;color:var(--muted)}.hint.ok{color:#2e7d32}.hint.bad{color:#c62828}
.alert{background:#fde8e8;color:#9b1c1c;padding:12px 16px;border-radius:12px;font-size:14px;font-weight:500}
.nf{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:24px;background:var(--lime)}
.nf h1{font-size:120px;margin:20px 0 0}.nf p{font-size:19px;margin:0 0 20px}
@media(max-width:560px){.nav{margin:8px}.nav-in{padding:8px 8px 8px 14px}.nav-cta .btn-ghost{display:none}.brand{font-size:18px}
  .claim .btn{width:100%}.hero{padding-bottom:40px}.hero-art{height:430px}.hero-art .phone{transform:scale(.82) rotate(-5deg)!important}.hero-art .phone:last-child{transform:scale(.82) rotate(5deg)!important;right:-20px}
  .theme-grid{grid-template-columns:repeat(2,1fr)}.foot-cols{gap:30px;flex-wrap:wrap}.st-row b{font-size:22px}}
