@font-face{font-family:'DM Serif Display';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/dmserif-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'DM Serif Display';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/dmserif-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/figtree-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/figtree-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Vazirmatn';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/vazirmatn-arabic.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Vazirmatn';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/vazirmatn-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Vazirmatn';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/vazirmatn-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Türkçe Yanımda — landing. Same palette and type as the app, light and dark. */
:root{
  --bg:#F5F2EB; --surface:#FFFFFF; --ink:#14203A; --ink-2:#465170; --muted:#5E6680;
  --line:#E9E3D6; --edge:#E2DBCC; --field-line:#DCD4C4; --dash:#B9C6DE;
  --primary:#1E4C9A; --primary-soft:#E4EBF7;      /* text and soft fills */
  --fill:#1E4C9A; --fill-hover:#163B7A; --on-fill:#FFFFFF;   /* solid buttons */
  --band:#1E4C9A;                                 /* hero disc, try-it section */
  --solid:#14203A; --solid-hover:#0B1426; --on-solid:#FFFFFF; /* log-in button */
  --frame:#14203A; --frame-edge:#2A3654;          /* phone frames */
  --gold:#C47A1E; --gold-soft:#F6E7CF;
  --shadow:rgba(20,32,58,.45); --fill-shadow:rgba(30,76,154,.8);
  --shot-filter:none;
  --serif:'DM Serif Display',Georgia,serif;
  --sans:'Figtree','Vazirmatn',system-ui,-apple-system,'Segoe UI',sans-serif;
  --gutter:clamp(16px,5vw,120px);
  color-scheme:light;
}
/* Dark: the app's own dark tokens. Follows the system unless the visitor picked a theme. */
@media (prefers-color-scheme:dark){
  :root:not([data-theme=light]){
    --bg:#0F1626; --surface:#18223A; --ink:#EDF1F8; --ink-2:#B5BFD4; --muted:#8E99B3;
    --line:#26324D; --edge:#2A3654; --field-line:#334063; --dash:#3F5580;
    --primary:#8DB0F0; --primary-soft:#22345A;
    --fill:#3868BD; --fill-hover:#2F5AA6; --on-fill:#FFFFFF;
    --band:#1B315E;
    --solid:#EDF1F8; --solid-hover:#FFFFFF; --on-solid:#0F1626;
    --frame:#060A13; --frame-edge:#334063;
    --gold:#E0A04A; --gold-soft:#2E2517;
    --shadow:rgba(0,0,0,.55); --fill-shadow:rgba(0,0,0,.5);
    --shot-filter:brightness(.93);
    color-scheme:dark;
  }
}
:root[data-theme=dark]{
  --bg:#0F1626; --surface:#18223A; --ink:#EDF1F8; --ink-2:#B5BFD4; --muted:#8E99B3;
  --line:#26324D; --edge:#2A3654; --field-line:#334063; --dash:#3F5580;
  --primary:#8DB0F0; --primary-soft:#22345A;
  --fill:#3868BD; --fill-hover:#2F5AA6; --on-fill:#FFFFFF;
  --band:#1B315E;
  --solid:#EDF1F8; --solid-hover:#FFFFFF; --on-solid:#0F1626;
  --frame:#060A13; --frame-edge:#334063;
  --gold:#E0A04A; --gold-soft:#2E2517;
  --shadow:rgba(0,0,0,.55); --fill-shadow:rgba(0,0,0,.5);
  --shot-filter:brightness(.93);
  color-scheme:dark;
}
.logo-dark{ display:none; }
@media (prefers-color-scheme:dark){ :root:not([data-theme=light]) .logo-dark{ display:block; } :root:not([data-theme=light]) .logo-light{ display:none; } }
:root[data-theme=dark] .logo-dark{ display:block; }
:root[data-theme=dark] .logo-light{ display:none; }
:lang(fa){ --sans:'Vazirmatn','Figtree',system-ui,-apple-system,'Segoe UI',Tahoma,sans-serif; }
/* Neither Vazirmatn nor Figtree has Cyrillic, so Russian uses the system face. */
:lang(ru){ --sans:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif; }

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } *{ transition:none!important; } }
body{ margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); line-height:1.6; overflow-x:hidden; }
img{ max-width:100%; display:block; }
a{ color:var(--primary); text-decoration:none; }
a:hover{ color:var(--primary); text-decoration:underline; text-underline-offset:3px; }
.nav a:hover,.lang-menu a:hover,.brand:hover,.foot nav a:hover,[class^=btn-]:hover{ text-decoration:none; }
h1,h2,h3{ margin:0; line-height:1.3; }
p{ margin:0; }
:focus-visible{ outline:3px solid var(--primary); outline-offset:3px; border-radius:8px; }
[hidden]{ display:none!important; }
[dir=rtl] .arr{ transform:scaleX(-1); }

.wrap{ padding-inline:var(--gutter); max-width:1440px; margin-inline:auto; }
.skip{ position:absolute; inset-inline-start:12px; top:-60px; padding:10px 16px; background:var(--solid); color:var(--on-solid); border-radius:12px; z-index:10; }
.skip:focus{ top:12px; color:var(--on-solid); }

/* ---------- header ---------- */
.top{ display:flex; align-items:center; justify-content:space-between; gap:16px; height:92px; }
.brand{ display:flex; align-items:center; gap:12px; color:var(--ink); }
.brand img{ width:24px; height:auto; }
.brand-name{ font-family:var(--serif); font-size:27px; white-space:nowrap; }
.nav{ display:flex; gap:clamp(18px,2.5vw,36px); font-size:16px; font-weight:600; }
.nav a{ color:var(--ink-2); }
.nav a:hover{ color:var(--primary); }
.top-end{ display:flex; align-items:center; gap:10px; }

.theme{ flex:none; display:flex; align-items:center; justify-content:center; width:46px; height:46px; padding:0; border-radius:23px; background:var(--surface); border:1px solid var(--field-line); color:var(--ink); cursor:pointer; }
.theme:hover{ color:var(--primary); }
.theme .i-sun{ display:none; }
.theme[aria-pressed=true] .i-sun{ display:block; }
.theme[aria-pressed=true] .i-moon{ display:none; }
.lang{ position:relative; }
.lang summary{ list-style:none; display:flex; align-items:center; gap:8px; height:46px; padding:0 14px; border-radius:23px; background:var(--surface); border:1px solid var(--field-line); font-size:15px; font-weight:600; color:var(--ink); cursor:pointer; user-select:none; }
.lang summary::-webkit-details-marker{ display:none; }
.lang summary svg:first-child{ color:var(--primary); }
.lang summary svg:last-child{ color:var(--muted); transition:transform .2s; }
.lang[open] summary svg:last-child{ transform:rotate(180deg); }
.lang-menu{ position:absolute; inset-inline-end:0; top:calc(100% + 8px); min-width:160px; padding:6px; background:var(--surface); border:1px solid var(--line); border-radius:16px; box-shadow:0 20px 40px -20px var(--shadow); z-index:20; display:flex; flex-direction:column; }
.lang-menu a{ padding:10px 14px; border-radius:10px; color:var(--ink); font-weight:600; }
.lang-menu a:hover{ background:var(--bg); }
.lang-menu a[aria-current]{ color:var(--primary); background:var(--primary-soft); }
.lang-menu a[lang=ru]{ font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif; }

.btn-dark,.btn-primary,.btn-ghost,.btn-light{ display:inline-flex; align-items:center; justify-content:center; gap:10px; font-weight:700; white-space:nowrap; transition:transform .15s, box-shadow .15s, background .15s; }
.btn-dark{ height:46px; padding:0 22px; border-radius:23px; background:var(--solid); color:var(--on-solid); font-size:15px; }
.btn-dark:hover{ color:var(--on-solid); background:var(--solid-hover); }
.btn-primary{ height:60px; padding:0 30px; border-radius:18px; background:var(--fill); color:var(--on-fill); font-size:18px; box-shadow:0 16px 30px -16px var(--fill-shadow); }
.btn-primary:hover{ color:var(--on-fill); background:var(--fill-hover); transform:translateY(-1px); }
.btn-ghost{ height:60px; padding:0 26px; border-radius:18px; background:var(--surface); border:1px solid var(--field-line); color:var(--ink); font-size:18px; }
.btn-ghost:hover{ color:var(--primary); }
.btn-light{ align-self:flex-start; height:58px; padding:0 28px; margin-top:8px; border-radius:18px; background:#fff; color:#1E4C9A; font-size:18px; }
.btn-light:hover{ transform:translateY(-1px); }

/* ---------- hero ---------- */
.hero{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:40px; align-items:center; padding-block:40px 96px; }
.hero-text{ display:flex; flex-direction:column; gap:28px; }
.badge{ align-self:flex-start; display:flex; align-items:center; gap:8px; padding:8px 14px; border-radius:999px; background:var(--primary-soft); color:var(--primary); font-size:14px; font-weight:700; }
.badge i{ width:8px; height:8px; border-radius:4px; background:currentColor; }
.hero h1{ font-size:clamp(40px,5.2vw,68px); font-weight:900; letter-spacing:-.5px; }
.hero h1 span{ color:var(--primary); }
.lead{ max-width:560px; font-size:clamp(17px,1.5vw,20px); line-height:2; color:var(--ink-2); text-wrap:pretty; }
.ctas{ display:flex; flex-wrap:wrap; gap:12px; padding-top:6px; }
.stats{ list-style:none; margin:0; padding:22px 0 0; display:flex; flex-wrap:wrap; gap:14px 36px; border-top:1px solid var(--edge); }
.stats li{ display:flex; flex-direction:column; }
.stats b{ font-size:24px; font-weight:900; color:var(--ink); font-family:'Figtree',var(--sans); unicode-bidi:isolate; }
:lang(fa) .stats b{ font-family:var(--sans); }
.stats span{ font-size:14px; color:var(--muted); }

.hero-art{ position:relative; display:flex; justify-content:center; align-items:center; min-height:760px; }
.disc{ position:absolute; width:min(560px,100%); aspect-ratio:1; border-radius:50%; background:var(--band); overflow:hidden; }
.tile{ position:absolute; inset:0; width:100%; height:100%; opacity:.14; }
.try .tile{ opacity:.1; }
.phone{ position:relative; width:330px; padding:11px; border-radius:54px; background:var(--frame); box-shadow:0 40px 80px -30px var(--shadow), inset 0 0 0 2px var(--frame-edge); }
.phone img{ width:100%; height:auto; aspect-ratio:1170/2532; border-radius:44px; filter:var(--shot-filter); }
.float{ position:absolute; bottom:90px; inset-inline-end:0; display:flex; align-items:center; gap:12px; padding:14px 18px; border-radius:18px; background:var(--surface); border:1px solid var(--line); box-shadow:0 20px 40px -20px var(--shadow); max-width:300px; }
.float-ic{ flex:none; display:flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:12px; background:var(--gold-soft); color:var(--gold); }
.float b{ display:block; font-size:15px; font-weight:800; }
.float small{ display:block; font-size:13px; color:var(--muted); line-height:1.5; }

/* ---------- sections ---------- */
.sec-head{ display:flex; flex-direction:column; gap:10px; align-items:center; text-align:center; }
.kicker{ font-size:15px; font-weight:700; color:var(--primary); }
.sec-head h2,.faq h2{ font-size:clamp(30px,3.2vw,44px); font-weight:900; }

.how{ position:relative; background:var(--surface); padding-block:96px; overflow:hidden; }
.how-bg{ position:absolute; inset:0; width:100%; height:100%; color:var(--primary); opacity:.045; }
.how .wrap{ position:relative; display:flex; flex-direction:column; gap:48px; }
.sec-sub{ font-size:17px; color:var(--ink-2); }
.steps-wrap{ position:relative; }
.steps-line{ position:absolute; top:14px; inset-inline:12.5%; width:75%; height:40px; overflow:visible; }
.steps-line path{ fill:none; stroke:var(--primary); stroke-width:2.2; stroke-dasharray:.1 7; stroke-linecap:round; opacity:.55; vector-effect:non-scaling-stroke; }
.steps{ position:relative; list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; align-items:start; }
.step{ display:flex; flex-direction:column; align-items:center; gap:28px; }
.num{ display:flex; align-items:center; justify-content:center; width:68px; height:68px; border-radius:50%; background:var(--surface); border:2px solid var(--primary); color:var(--primary); font-size:26px; font-weight:900; }
.step.hl .num{ background:var(--fill); border-color:var(--fill); color:var(--on-fill); box-shadow:0 12px 24px -12px var(--fill-shadow); }
.step-card{ align-self:stretch; display:flex; flex-direction:column; gap:12px; padding:16px 16px 28px; border-radius:28px; background:var(--bg); }
.step-card h3{ font-size:21px; font-weight:800; padding-inline:8px; margin-top:12px; }
.step-card p{ padding-inline:8px; }
.step.hl .step-card{ background:var(--fill); color:var(--on-fill); box-shadow:0 30px 50px -28px var(--fill-shadow); }
.step.hl .step-card p{ color:rgba(255,255,255,.86); }

/* step pictures */
.ill{ height:clamp(176px,15vw,200px); padding:14px; border-radius:20px; background:var(--surface); display:flex; align-items:center; justify-content:center; overflow:hidden; font-size:12px; line-height:1.4; color:var(--ink); box-shadow:0 14px 28px -24px var(--shadow); }
.step.hl .ill{ background:rgba(255,255,255,.12); box-shadow:none; }
.ill .pill{ padding:3px 9px; font-size:11px; }
.ill-top{ display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; }
.ill-say{ flex:none; display:flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%; background:var(--fill); color:var(--on-fill); }
.ill-say svg{ width:14px; height:14px; }
.ill-say.sm{ width:22px; height:22px; background:var(--primary-soft); color:var(--primary); }
.ill-say.sm svg{ width:11px; height:11px; }
[dir=rtl] .ill-say svg{ transform:scaleX(-1); }

.ill-chips{ display:flex; flex-wrap:wrap; justify-content:center; gap:7px; }
.chip{ display:inline-flex; align-items:center; gap:5px; padding:6px 11px; border-radius:999px; background:var(--bg); color:var(--ink-2); font-weight:600; white-space:nowrap; }
.chip.on{ background:var(--fill); color:var(--on-fill); box-shadow:0 8px 16px -10px var(--fill-shadow); }
.chip.soft{ background:var(--primary-soft); color:var(--primary); }

.ill-word{ display:flex; flex-direction:column; align-items:center; gap:4px; width:100%; }
.ill-word .ill-top{ margin-bottom:6px; }
.ill-word .w{ font-family:var(--serif); font-size:36px; line-height:1.1; }
.ill-word .m{ font-size:15px; font-weight:800; color:var(--primary); }
.ill-word .x{ font-family:var(--serif); font-style:italic; font-size:12px; color:var(--ink-2); margin-top:4px; }

.ill-gram{ display:flex; flex-direction:column; gap:7px; width:100%; align-self:stretch; justify-content:center; }
.ill-gram .ill-top > span:first-child{ display:flex; flex-direction:column; }
.ill-gram .ill-top b{ font-size:12.5px; }
.ill-gram .ill-top i{ font-size:10.5px; color:var(--muted); font-family:var(--serif); }
.g-ex{ display:flex; align-items:center; gap:8px; padding:8px 10px; border-radius:12px; background:var(--bg); }
.g-ex > span:last-child{ display:flex; flex-direction:column; min-width:0; }
.g-ex b{ font-family:var(--serif); font-weight:400; font-size:14px; text-align:start; }
.g-ex small{ font-size:10.5px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.ill-bars{ display:flex; align-items:stretch; justify-content:center; gap:8px; width:100%; height:100%; }
.bar{ flex:1; max-width:34px; display:flex; flex-direction:column; align-items:center; gap:6px; min-width:0; }
.bar .track{ position:relative; flex:1; width:100%; border-radius:10px; background:rgba(255,255,255,.16); overflow:hidden; }
.bar .track i{ position:absolute; inset-inline:0; bottom:0; border-radius:10px; background:#fff; }
.bar.b1 .track i{ height:88%; } .bar.b2 .track i{ height:64%; opacity:.9; } .bar.b3 .track i{ height:44%; opacity:.82; }
.bar.b4 .track i{ height:28%; opacity:.75; } .bar.b5 .track i{ height:16%; opacity:.7; }
.bar.done .track{ background:transparent; border:1.5px dashed #E8B061; }
.bar.done .track i{ height:26%; background:#E8B061; inset:auto 3px 3px; border-radius:7px; }
.bar small{ font-size:10.5px; font-weight:700; color:rgba(255,255,255,.8); white-space:nowrap; }
.bar.done small{ color:#F2C27E; font-size:9.5px; }
.steps p,.feat p{ font-size:17px; line-height:1.9; color:var(--ink-2); }

.features{ display:flex; flex-direction:column; gap:56px; padding-block:110px; }
.feats{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; }
.feat{ display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center; }
.phone-top{ width:260px; height:440px; padding:9px 9px 0; border-radius:44px 44px 0 0; background:var(--frame); overflow:hidden; margin-bottom:10px; -webkit-mask-image:linear-gradient(#000 80%,transparent); mask-image:linear-gradient(#000 80%,transparent); }
.phone-top img{ width:100%; height:auto; border-radius:36px 36px 0 0; filter:var(--shot-filter); }
.feat h3{ font-size:24px; font-weight:800; }
.feat p{ max-width:360px; }

/* ---------- try it ---------- */
.try{ position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; align-items:center; margin-inline:clamp(0px,4vw,60px); padding:90px clamp(20px,4vw,60px); border-radius:40px; background:var(--band); color:#fff; overflow:hidden; max-width:1320px; }
@media (min-width:1441px){ .try{ margin-inline:auto; } }
.try-text{ position:relative; display:flex; flex-direction:column; gap:20px; padding-inline-start:clamp(0px,3vw,40px); }
.kicker-light{ font-size:15px; font-weight:700; color:rgba(255,255,255,.8); }
.try h2{ font-size:clamp(30px,3.3vw,46px); font-weight:900; line-height:1.4; }
.try-text p{ font-size:19px; line-height:1.9; color:rgba(255,255,255,.88); }

.card{ position:relative; justify-self:center; display:flex; flex-direction:column; gap:10px; width:min(440px,100%); height:520px; padding:24px; border-radius:32px; background:var(--surface); color:var(--ink); box-shadow:0 40px 70px -30px rgba(0,0,0,.5); }
.card-top{ display:flex; justify-content:flex-start; align-items:center; gap:8px; }
.pill{ padding:6px 12px; border-radius:999px; background:var(--primary-soft); color:var(--primary); font-size:13px; font-weight:700; }
.card-count{ font-size:13px; font-weight:600; color:var(--muted); }
.say{ margin-inline-start:auto; flex:none; width:44px; height:44px; border:0; border-radius:50%; background:var(--fill); color:var(--on-fill); display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 10px 20px -10px var(--fill-shadow); }
[dir=rtl] .say svg{ transform:scaleX(-1); }
.card-body{ flex-grow:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; padding:20px 0; text-align:center; }
.word{ font-family:var(--serif); font-size:clamp(44px,6vw,64px); line-height:1.1; }
.word.long{ font-size:clamp(34px,4.2vw,46px); }
.is-hidden{ visibility:hidden; }
.back.is-hidden{ animation:none; }
.ex-slot{ display:grid; justify-items:center; align-items:center; min-height:36px; }
.ex-slot > *{ grid-area:1/1; }
.back{ display:flex; flex-direction:column; align-items:center; gap:16px; width:100%; animation:rise .25s ease-out; }
.card-body{ min-height:0; }
@keyframes rise{ from{ opacity:0; transform:translateY(6px); } }
.rule{ width:48px; height:2px; border-radius:1px; background:var(--edge); }
.mean{ font-size:clamp(24px,3vw,32px); font-weight:800; color:var(--primary); }
.ex{ display:flex; flex-direction:column; align-items:center; gap:10px; width:100%; padding:16px; border-radius:18px; background:var(--bg); }
.ex [lang=tr]{ font-family:var(--serif); font-style:italic; font-size:22px; }
.ex-tr{ font-size:16px; color:var(--ink-2); }
.show-tr{ display:flex; align-items:center; gap:6px; height:36px; padding:0 14px; border:1px dashed var(--dash); border-radius:18px; background:transparent; color:var(--primary); font:inherit; font-size:13px; font-weight:600; cursor:pointer; }
.card-btn{ flex:none; height:56px; border:0; border-radius:18px; background:var(--fill); color:var(--on-fill); font:inherit; font-size:17px; font-weight:700; cursor:pointer; }
.card-btn:hover{ background:var(--fill-hover); }
.card-btn.alt{ border:1px solid var(--field-line); background:transparent; color:var(--ink-2); }
.card-btn.alt:hover{ background:var(--bg); }

/* ---------- FAQ ---------- */
.faq{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:64px; padding-block:110px; }
.faq-head{ display:flex; flex-direction:column; gap:14px; }
.faq h2{ line-height:1.4; }
.faq-head p{ font-size:17px; line-height:1.9; color:var(--ink-2); }
.faq-head a{ font-weight:700; }
.faq-list{ display:flex; flex-direction:column; gap:12px; }
.faq details{ border-radius:22px; background:var(--surface); border:1px solid var(--line); }
.faq summary{ list-style:none; color:var(--ink); display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:76px; padding:14px 26px; font-size:19px; font-weight:800; cursor:pointer; }
.faq summary::-webkit-details-marker{ display:none; }
.pm{ flex:none; display:flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:18px; background:var(--bg); color:var(--primary); }
.faq details[open] .pm .v{ display:none; }
.faq details p{ padding:0 26px 24px; font-size:17px; line-height:2; color:var(--ink-2); }

/* ---------- closing + footer ---------- */
.end{ display:flex; flex-direction:column; align-items:center; gap:24px; margin-bottom:64px; padding-block:72px; text-align:center; }
.end{ background:var(--surface); border:1px solid var(--line); border-radius:36px; margin-inline:var(--gutter); padding-inline:24px; max-width:1200px; }
@media (min-width:1441px){ .end{ margin-inline:auto; } }
.end img{ width:40px; height:auto; }
.end h2{ font-size:clamp(28px,3vw,40px); font-weight:900; }

.foot{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px; padding-block:40px; border-top:1px solid var(--edge); }
.foot .brand img{ width:18px; }
.foot .brand-name{ font-size:20px; }
.foot nav{ display:flex; flex-wrap:wrap; gap:12px 28px; font-size:15px; font-weight:600; }
.foot nav a{ color:var(--ink-2); }
.copy{ font-family:'Figtree',sans-serif; font-size:14px; color:var(--muted); }

/* ---------- privacy / terms ---------- */
.doc{ max-width:820px; padding-block:40px 96px; }
.doc h1{ font-size:clamp(32px,4vw,44px); font-weight:900; margin-bottom:8px; }
.doc-date{ color:var(--muted); font-size:15px; margin-bottom:32px; }
.doc h2{ font-size:22px; font-weight:800; margin:32px 0 10px; }
.doc p,.doc li{ font-size:17px; line-height:2; color:var(--ink-2); }
.doc ul{ padding-inline-start:22px; margin:8px 0; }

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .nav{ display:none; }
  .hero{ grid-template-columns:1fr; gap:24px; padding-block:24px 72px; }
  .hero-art{ min-height:0; padding-block:40px; }
  .disc{ width:min(460px,92vw); }
  .phone{ width:290px; border-radius:48px; padding:10px; }
  .phone img{ border-radius:39px; }
  .float{ bottom:60px; }
  .try{ grid-template-columns:minmax(0,1fr); gap:40px; padding-block:64px; }
  .faq{ grid-template-columns:1fr; gap:32px; padding-block:80px; }
}
@media (max-width:1180px){
  .steps{ grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:40px; }
  .steps-line{ display:none; }
}
@media (max-width:640px){
  .steps{ grid-template-columns:minmax(0,1fr); }
  .step{ gap:16px; }
  .num{ width:56px; height:56px; font-size:22px; }
}
@media (max-width:860px){
  .feats{ grid-template-columns:1fr; gap:56px; }
  .how{ padding-block:72px; }
  .features{ padding-block:80px; gap:40px; }
}
@media (max-width:560px){
  .top{ height:72px; }
  .brand-name{ font-size:21px; }
  .brand img{ width:20px; }
  .top-end{ gap:6px; }
  .theme{ width:42px; height:42px; }
  .lang summary{ height:42px; padding:0 10px; gap:4px; }
  .lang summary span{ display:none; }
  .btn-dark{ height:42px; padding:0 16px; }
  .ctas a{ flex:1 1 100%; }
  .btn-primary,.btn-ghost,.btn-light{ white-space:normal; text-align:center; height:auto; min-height:56px; padding-block:10px; line-height:1.4; }
  .btn-primary,.btn-ghost{ height:56px; font-size:17px; }
  .phone{ width:250px; border-radius:42px; padding:9px; }
  .phone img{ border-radius:34px; }
  .float{ inset-inline-end:auto; bottom:12px; padding:10px 14px; }
  .try{ border-radius:0; margin-inline:0; padding-inline:16px; }
  .card{ padding:18px; height:490px; }
  .faq summary{ padding:14px 18px; font-size:17px; }
  .faq details p{ padding:0 18px 20px; font-size:16px; }
  .end{ margin-inline:16px; padding-block:48px; }
  .foot{ flex-direction:column; align-items:flex-start; }
}
@media (max-width:400px){
  .brand{ gap:8px; }
  .brand-name{ font-size:18px; }
  .brand img{ width:17px; }
  .lang summary svg:last-child{ display:none; }
  .theme,.lang summary{ width:40px; height:40px; padding:0; justify-content:center; }
  .btn-dark{ height:40px; padding:0 14px; font-size:14px; }
  .hero h1{ font-size:36px; }
  .phone{ width:230px; }
  .card{ height:480px; }
  .word{ font-size:40px; }
}
