@font-face{font-family:Poppins;font-weight:600;font-display:swap;src:url(fonts/poppins-semibold.ttf) format("truetype")}
@font-face{font-family:Poppins;font-weight:700;font-display:swap;src:url(fonts/poppins-bold.ttf) format("truetype")}

:root{
  --screen:#F2F5F6; --card:#fff; --line:#DDE4E6; --ink:#0B1B20; --soft:#4F6068;
  --accent:#01869A; --accent-text:#04535F; --soft-fill:#DDF0F3; --hero:#017A8C; --on-hero:#fff;
  --plus:#016E7E; --on-plus:#fff; --mark:#FFF0C2; --mark-line:#8A5A00; --wrong:#C0392B;
  --shadow:0 1px 2px rgba(11,27,32,.06),0 8px 24px rgba(11,27,32,.07);
  --display:Poppins,-apple-system,system-ui,sans-serif;
  --body:-apple-system,"SF Pro Text",system-ui,"Helvetica Neue",Arial,sans-serif;
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){:root{
  --screen:#000; --card:#1C1C1E; --line:#2C2C2E; --ink:#fff; --soft:#A4B1B5;
  --accent:#35BCD0; --accent-text:#6FD3E3; --soft-fill:#12363C; --hero:#0B2E33; --on-hero:#fff;
  --plus:#35BCD0; --on-plus:#04252B; --mark:#3A2F0B; --mark-line:#F2C661; --wrong:#FF8A7A;
  --shadow:0 0 0 1px #2C2C2E;
}}

*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--screen);color:var(--ink);font:400 17px/1.55 var(--body);-webkit-text-size-adjust:100%}
a{color:var(--accent-text);font-weight:600;text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
img{max-width:100%;display:block}
.wrap{max-width:1120px;margin:0 auto;padding-left:24px;padding-right:24px}

/* Header */
.top{display:flex;justify-content:space-between;align-items:center;min-height:84px;gap:16px}
.brand{display:flex;align-items:center;gap:10px;font:700 22px var(--display);color:inherit}
.brand img{width:36px;height:36px;border-radius:9px}
.top nav{display:flex;gap:28px}
.top nav a{min-height:44px;display:inline-flex;align-items:center}
.hero .top a{color:var(--on-hero)}
.plain .top{border-bottom:1px solid var(--line)}

/* Hero */
.hero{background:var(--hero);color:var(--on-hero);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:end}
.hero-copy{padding:40px 0 88px}
.app-icon{width:96px;height:96px;border-radius:22%;box-shadow:0 8px 24px rgba(0,0,0,.25)}
h1{font:700 clamp(38px,5vw,60px)/1.08 var(--display);margin:28px 0 0;letter-spacing:-.01em}
.lead{font-weight:600;font-size:21px;line-height:1.45;margin:16px 0 0;max-width:520px}
.badge{display:inline-block;margin-top:32px}
.badge img{height:58px;width:auto}
.phones{position:relative;height:600px;align-self:end}
.phone{position:absolute;bottom:-40px;width:290px;border-radius:44px;border:9px solid #0D0D0F;background:#0D0D0F;
  box-shadow:0 24px 50px rgba(5,48,58,.3);overflow:hidden}
.phone img{border-radius:35px;width:100%;height:auto}
.phone.a{left:0}
.phone.b{left:230px;bottom:-110px}

/* Sections */
section{padding:96px 0 0}
.split{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.eyebrow{font:700 13px var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--accent-text);margin:0}
h2{font:700 clamp(30px,3.4vw,40px)/1.15 var(--display);margin:8px 0 0}
.copy p{color:var(--soft);font-size:18px;margin:16px 0 0;max-width:470px}
.card{background:var(--card);border-radius:20px;box-shadow:var(--shadow);padding:28px}
.card .label{font-size:14px;color:var(--soft);margin:0}
.big-line{font:600 clamp(22px,2.4vw,28px)/1.35 var(--display);margin:8px 0 0}
.heard{background:var(--mark);border-bottom:2px dashed var(--mark-line);border-radius:6px;padding:0 4px}
.fix-field{display:flex;align-items:center;gap:12px;margin-top:20px;flex-wrap:wrap}
.fix-field .box{flex:1;min-width:160px;border:2px solid var(--accent);border-radius:12px;padding:10px 14px;font-weight:600}
.fix-field .box small{display:block;font-weight:400;color:var(--soft);font-size:13px}
.pill{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:99px;font-weight:600;font-size:15px}
.pill.on{background:var(--plus);color:var(--on-plus)}
.pill.soft{background:var(--soft-fill);color:var(--accent-text)}
.fix .tag{font:700 12px var(--body);letter-spacing:.1em;color:var(--accent-text);margin:0}
.del{color:var(--wrong);text-decoration:line-through;text-decoration-thickness:2px}
.ins{color:var(--accent-text)}
.tip{display:flex;gap:12px;margin:12px 0 0;color:var(--ink);font-size:16px}
.tip b{flex:none;font-size:11px;background:var(--soft-fill);color:var(--accent-text);border-radius:6px;padding:2px 7px;height:fit-content;margin-top:3px}
.langs{display:flex;flex-wrap:wrap;gap:8px;border-top:1px solid var(--line);margin-top:20px;padding-top:20px}
.langs span{padding:6px 14px;border-radius:99px;background:var(--soft-fill);color:var(--accent-text);font-weight:600;font-size:15px}
.langs span.on{background:var(--plus);color:var(--on-plus)}

.pricing{text-align:center}
.plans{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:40px;text-align:left}
.plan{border-radius:20px;padding:32px;background:var(--card);box-shadow:var(--shadow)}
.plan.plus{background:var(--plus);color:var(--on-plus);box-shadow:none}
.plan .name{font-weight:600;margin:0}
.plan .num{font:700 72px/1 var(--display);margin:12px 0 8px}
.plan .what{font-size:19px;font-weight:600;margin:0}
.promises{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 36px;list-style:none;margin:20px 0 0;padding:18px 24px;background:var(--card);border-radius:20px;box-shadow:var(--shadow);text-align:left}
.promises li::before{content:"✓";color:var(--accent-text);font-weight:700;margin-right:10px}

/* Text pages */
.page{max-width:720px;padding-top:56px;padding-bottom:24px}
.page h1{font-size:clamp(36px,5vw,48px);margin:0}
.page .meta{color:var(--soft);margin:8px 0 0}
.page h2{font-size:24px;margin:40px 0 0}
.page p{margin:10px 0 0}
.summary{list-style:none;margin:28px 0 0;padding:20px 24px;background:var(--card);border-radius:20px;box-shadow:var(--shadow)}
.summary li{padding:6px 0 6px 28px;position:relative}
.summary li::before{content:"✓";position:absolute;left:0;color:var(--accent-text);font-weight:700}
.mail-btn{display:inline-flex;align-items:center;min-height:50px;padding:0 24px;margin-top:20px;border-radius:99px;background:var(--plus);color:var(--on-plus);word-break:break-all}
.faq{margin-top:16px;display:grid;gap:12px}
.faq details{background:var(--card);border-radius:16px;box-shadow:var(--shadow);padding:0 20px}
.faq summary{cursor:pointer;font-weight:600;min-height:56px;display:flex;align-items:center;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";margin-left:auto;padding-left:16px;font-size:22px;color:var(--accent-text)}
.faq details[open] summary::after{content:"−"}
.faq details p{margin:0 0 18px;color:var(--soft)}

.lost{text-align:center;padding:48px 24px 24px}
.lost img{width:260px;margin:0 auto}
.lost .code{font:700 15px var(--display);color:var(--accent-text);margin:16px 0 0}
.lost h1{font-size:clamp(30px,4vw,40px);margin:4px 0 0}
.lost p{color:var(--soft);margin:8px 0 0}

/* Footer */
footer{border-top:1px solid var(--line);margin-top:96px}
footer .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px 32px;min-height:100px;flex-wrap:wrap;padding-top:16px;padding-bottom:16px}
footer nav{display:flex;gap:24px}
footer nav a{min-height:44px;display:inline-flex;align-items:center}
footer .by{color:var(--soft);font-size:15px;margin:0}

@media (max-width:860px){
  .hero-grid,.split{grid-template-columns:1fr;gap:32px}
  .hero-copy{padding:24px 0 0}
  .lead{font-size:18px}
  .phones{height:300px;margin:0 -8px}
  .phone{width:220px;border-width:7px;border-radius:36px;bottom:-230px}
  .phone img{border-radius:29px}
  .phone.a{left:0}.phone.b{left:auto;right:-20px;bottom:-270px}
  .app-icon{width:72px;height:72px}
  section{padding-top:64px}
  .split.flip .card{order:2}
  .plans{grid-template-columns:1fr}
  .promises{flex-direction:column;align-items:flex-start}
  .top nav{gap:16px}
  footer .wrap{flex-direction:column;align-items:flex-start}
  footer{margin-top:64px}
}
.page p.still{margin-top:28px}
