/* Палитра «Ягодный пар» */
:root{--bg:#f4efe8;--ink:#2e1a22;--mute:#4a3640;--acc:#6b1f33;--btn:#6b1f33;--onbtn:#fff;--hl:#a9bdd6;--mist:#e8ddd0;--card:#fffaf4;--line:#d3c3b3;--deep:#42202b;--ondeep:#f4ece4;--ondeepmute:#dcc8cc;--soft:#6b7f99}
:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.65 'Golos Text',system-ui,'Segoe UI',Arial,sans-serif}
h1,h2,h3{font-family:'Golos Text',system-ui,sans-serif;font-weight:500;line-height:1.15;margin:0}
a{color:inherit}
:focus-visible{outline:3px solid var(--acc);outline-offset:3px}
.w{max-width:1120px;margin:0 auto;padding:0 22px}
section{padding:84px 0}
h2{font-size:clamp(26px,3.6vw,40px);margin-bottom:34px}
.btn{display:inline-block;border:0;border-radius:10px;padding:14px 24px;font:700 16px 'Golos Text',sans-serif;text-decoration:none;cursor:pointer;background:var(--btn);color:var(--onbtn)}
.btn:hover{filter:brightness(1.07)}
.btn.line{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 2px var(--line)}
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;gap:26px;height:64px}
.logo{font:700 18px 'Golos Text',sans-serif;text-decoration:none;margin-right:auto}
.logo span{color:var(--acc)}
.logo img{display:block;height:44px;width:auto}
nav{display:flex;gap:24px;font-weight:500;font-size:15px}
nav a{text-decoration:none;color:var(--mute)}nav a:hover{color:var(--ink)}
.tel{font-weight:700;text-decoration:none}
.hero{padding:96px 0 90px;color:var(--ondeep);background:linear-gradient(90deg,color-mix(in srgb,var(--deep) 94%,transparent) 0%,color-mix(in srgb,var(--deep) 78%,transparent) 42%,color-mix(in srgb,var(--deep) 10%,transparent) 78%),var(--deep) url(/img/hero.jpg) 72% center/cover no-repeat}
.help{list-style:none;margin:0 0 22px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 22px}
.help li{position:relative;padding-left:26px;font-size:16px;line-height:1.45}
.help li::before{content:"";position:absolute;left:0;top:.5em;width:12px;height:7px;border-left:2.5px solid var(--hl);border-bottom:2.5px solid var(--hl);transform:rotate(-45deg)}
.lead{margin-bottom:22px}
.promise{margin:0 0 30px;font-weight:700;font-size:21px;line-height:1.4;color:var(--hl)}
.hero .w:first-child>div{max-width:720px}
.hero .btn{background:var(--ondeep);color:var(--deep)}
.hero .btn.line{background:transparent;color:var(--ondeep);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--ondeep) 60%,transparent)}
h1{font-size:clamp(30px,4.6vw,54px);margin-bottom:24px}
.lead{color:var(--ondeepmute);max-width:56ch;margin:0 0 30px}
.cta{display:flex;gap:12px;flex-wrap:wrap}
.pass{position:relative;background:var(--deep);color:var(--ondeep);border-radius:18px 18px 18px 18px;padding:34px 30px 30px;box-shadow:0 0 0 6px var(--mist)}
.pass h3{font-size:15px;color:var(--hl);margin-bottom:16px;font-weight:500}
.pass ul{list-style:none;margin:0;padding:0}
.pass li{padding:11px 0;border-top:1px dashed color-mix(in srgb,var(--ondeep) 30%,transparent);font-size:15px}
.pass li:first-child{border:0}
.stamp{position:absolute;right:-18px;top:-34px;width:118px;transform:rotate(-12deg);color:var(--hl)}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid color-mix(in srgb,var(--ondeep) 40%,transparent);margin-top:80px;padding-bottom:34px}
.facts div{padding:20px 22px 0 0;color:var(--ondeepmute);font-size:15px}
.facts b{display:block;font:500 28px 'Golos Text',sans-serif;color:var(--ondeep);margin-bottom:4px}
.how{background:#566c88;color:#fff;padding:48px 0 52px}
.how .w{max-width:960px}
.how h2{color:#fff;font-size:clamp(22px,3vw,30px);margin-bottom:28px}
.how ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:22px;position:relative}
.how ol::before{content:"";position:absolute;left:22px;right:10%;top:22px;height:2px;background:rgba(255,255,255,.35)}
.how li{position:relative}
.how i{position:relative;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#fff;color:#566c88;font:700 18px 'Golos Text',sans-serif;font-style:normal;margin-bottom:14px;box-shadow:0 0 0 6px #566c88}
.how h3{font-size:15px;line-height:1.3;margin-bottom:6px;color:#fff}
.how p{margin:0;font-size:14px;color:#eef3f8;line-height:1.5}
.services{background:var(--bg)}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.tile{display:flex;flex-direction:column;gap:12px;min-height:290px;padding:28px 26px 24px;border-radius:22px;background:var(--t);color:var(--tc);text-decoration:none;transition:transform .2s}
.tile:hover{transform:translateY(-4px)}
.tile h3{font-size:19px;line-height:1.25}
.tile p{margin:0;font-size:15px;line-height:1.55;opacity:.9}
.tile .go{margin-top:auto;font-weight:700;font-size:15px;border-bottom:2px solid currentColor;align-self:flex-start;padding-bottom:2px}
.tile svg{margin-bottom:8px}
.svc{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:12px 40px;padding:26px 0;border-top:1px solid var(--line)}
.svc:last-child{border-bottom:1px solid var(--line)}
.svc h3{font-size:20px}
.svc p{margin:0;color:var(--mute);max-width:60ch}
.why .w{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px}
.why .side{position:sticky;top:90px;align-self:start}.why .side h2{margin-bottom:26px}.why .side img{display:block;width:100%;border-radius:14px;aspect-ratio:4/3;object-fit:cover}
.why{background:#dde6ef}
.why .pt{border-left:3px solid #566c88;padding:2px 0 2px 24px;margin:36px 0 0}
.why .pt h3{font-size:18px;margin-bottom:10px}
.why .pt p{margin:0 0 12px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 14px}
.chip{background:#fff;color:var(--ink);border-radius:999px;padding:7px 15px;font-size:15px;line-height:1.35}
.why p{margin:0 0 22px;max-width:68ch}
.why p:first-child{font-size:20px;font-weight:500}
.faq{background:#6b1f33;color:var(--ondeep)}
details{border-top:1px solid color-mix(in srgb,var(--ondeep) 28%,transparent);max-width:860px}
details:last-of-type{border-bottom:1px solid color-mix(in srgb,var(--ondeep) 28%,transparent)}
summary{cursor:pointer;list-style:none;padding:22px 0;font:500 19px 'Golos Text',sans-serif;display:flex;justify-content:space-between;gap:20px}
summary::after{content:"+";color:var(--hl);font-size:28px;line-height:1;transition:transform .2s}
details[open] summary::after{transform:rotate(45deg)}
details p{margin:0 0 24px;color:var(--ondeepmute);max-width:64ch}
.order .w{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px}
.order{background:var(--mist)}
.order p{color:var(--mute)}
fieldset{border:0;margin:0 0 20px;padding:0}
.opt{display:flex;gap:14px;align-items:center;padding:14px 16px;border:2px solid var(--line);border-radius:10px;margin-bottom:10px;background:var(--card);cursor:pointer}
.opt:has(input:checked){border-color:#566c88;background:#dde6ef}
.opt input{accent-color:#566c88;width:18px;height:18px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}
input[type=text],input[type=tel]{width:100%;padding:14px 16px;border:2px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font:500 16px 'Golos Text',sans-serif}
footer{background:#566c88;color:#fff;padding:60px 0}
footer .w{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
footer h3{font-size:15px;color:#fff;margin-bottom:10px}
footer p{margin:0}
footer a{text-decoration:none}
/* усиление типографики и яркости */
body{font-weight:500;font-size:18px}
h1,h2,h3{font-weight:700;overflow-wrap:break-word}
h1{font-size:clamp(32px,6.2vw,76px);line-height:1.04;letter-spacing:-.015em;margin-bottom:26px}
h2{font-size:clamp(28px,4.6vw,54px);margin-bottom:42px}
.hero{padding:104px 0}
.hero h1,.hero .lead,.help li{text-shadow:0 2px 18px rgba(30,10,20,.55)}
.lead{color:#fff;font-size:21px;line-height:1.55;max-width:54ch;font-weight:500}
.help li{padding-left:38px;font-size:18px;font-weight:700;line-height:1.35}
.help li::before{content:"";position:absolute;left:0;top:.05em;width:24px;height:24px;border:0;transform:none;border-radius:50%;background:var(--hl) url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 12 12%27%3E%3Cpath d=%27M2 6.5l3 3 5-6%27 fill=%27none%27 stroke=%27%2342202b%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27/%3E%3C/svg%3E") center/13px no-repeat}
.promise{display:inline-block;max-width:660px;background:var(--hl);color:#2e1a22;border-radius:16px;padding:18px 26px;font-size:20px;font-weight:800;line-height:1.35;margin:6px 0 34px;text-shadow:none}
.btn{font-weight:800}
.hero .btn{font-size:18px;padding:17px 32px;border-radius:12px}
.hero .btn.line{color:#fff;box-shadow:inset 0 0 0 2.5px #fff}
.tile h3{font-size:22px}
.tile p{font-size:16px;opacity:1}
.how h2{font-size:clamp(28px,4vw,42px)}
.how h3{font-size:17px}
.how p{font-size:15px}
summary{font-size:21px}
details p{font-size:18px}
.why p{font-size:18px}
.why p:first-child{font-size:22px}
@media(max-width:820px){.how ol{grid-template-columns:1fr;gap:26px}.how ol::before{left:22px;right:auto;top:0;bottom:0;width:2px;height:auto}.how li{padding-left:66px}.how i{position:absolute;left:0;top:0;margin:0}.help{grid-template-columns:1fr}.tiles{grid-template-columns:1fr}.tile{min-height:0}.hero{background:linear-gradient(180deg,color-mix(in srgb,var(--deep) 88%,transparent),color-mix(in srgb,var(--deep) 72%,transparent)),var(--deep) url(/img/hero.jpg) 70% center/cover no-repeat;padding-top:64px}nav{display:none}.tel{display:none}.hero .w,.why .w,.order .w,footer .w{grid-template-columns:1fr}.svc{grid-template-columns:1fr}.why .side{position:static}.facts{grid-template-columns:1fr}.stamp{right:-6px}section{padding:60px 0}.row{grid-template-columns:1fr}}
.burger,.navtel{display:none}
.burger{width:46px;height:46px;padding:11px;border:0;background:transparent;cursor:pointer}
.burger span{display:block;height:3px;border-radius:2px;background:var(--ink);margin:5px 0}
@media(max-width:820px){.burger{display:block}nav.open{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:var(--bg);border-bottom:2px solid var(--line);padding:4px 22px 16px;box-shadow:0 14px 30px rgba(0,0,0,.18)}nav.open a{padding:15px 0;font-size:19px;font-weight:700;color:var(--ink);border-top:1px solid var(--line)}nav.open a:first-child{border-top:0}nav.open .navtel{display:block;color:var(--acc)}}
body{overflow-x:clip}
@media(max-width:520px){h1{font-size:clamp(26px,7.2vw,32px);line-height:1.1;letter-spacing:0}.lead{font-size:19px}.help li{font-size:17px}.promise{font-size:18px;padding:16px 20px}.cta{flex-direction:column}.hero .btn{width:100%;text-align:center}h2{font-size:clamp(24px,7vw,30px)}.tile h3{font-size:20px}summary{font-size:18px}}
.ph{display:grid;place-items:center;width:100%;max-width:100%;aspect-ratio:4/3;border-radius:14px;border:2px dashed #566c88;color:#566c88;font-weight:700;text-align:center;padding:20px}
html,body{background:var(--bg)}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* единая типографика: H2 / H3 / текст 18 / мелкий 15 / кнопки 700 */
html body{font-weight:500;font-size:18px;line-height:1.6}
html body h2,html body .how h2{font-family:'Golos Text',system-ui,sans-serif;font-weight:700;font-size:clamp(26px,4.2vw,42px);line-height:1.15;margin-bottom:36px}
html body h3,html body .tile h3,html body .how h3,html body .svc h3,html body .why .pt h3,html body footer h3,html body .pass h3,html body summary{font-family:'Golos Text',system-ui,sans-serif;font-weight:700;font-size:18px;line-height:1.3}
html body summary{padding:22px 0}
html body .lead,html body .help li,html body details p,html body .why p,html body .why p:first-child,html body .opt,html body footer p,html body input[type=text],html body input[type=tel]{font-family:'Golos Text',system-ui,sans-serif;font-weight:500;font-size:18px;line-height:1.55}
html body .tile p,html body .how p,html body nav,html body .tile .go{font-family:'Golos Text',system-ui,sans-serif;font-weight:500;font-size:15px;line-height:1.5}
html body .tile .go{font-weight:700}
html body .btn,html body .hero .btn,html body .tel,html body nav.open a{font-family:'Golos Text',system-ui,sans-serif;font-weight:700;font-size:17px}
html body .hero .btn{padding:16px 30px}
html body footer p{overflow-wrap:anywhere}
@media(max-width:520px){html body h2,html body .how h2{font-size:clamp(24px,7vw,30px)}}
/* как мы работаем: кто делает шаг */
html body .how .howsub{margin:-18px 0 34px;font-size:18px;font-weight:500;color:#fff;max-width:60ch}
html body .how ol::before{left:32px;right:calc((100% - 88px)/5);top:64px;height:2px;background:rgba(255,255,255,.35)}
html body .how li{padding-top:0}
html body .how .who{display:block;margin-bottom:12px;font:700 15px/1.3 'Golos Text',system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#a9bdd6}
html body .how i{width:64px;height:64px;font-size:26px;margin-bottom:18px;box-shadow:0 0 0 6px #566c88}
html body .how .you i{background:#fff;color:#566c88}
html body .how .we i{background:#566c88;color:#fff;border:3px solid #fff;box-shadow:0 0 0 6px #566c88}
@media(max-width:820px){html body .how ol::before{left:32px;top:0;bottom:0;width:2px;height:auto}html body .how li{padding-left:92px}html body .how i{position:absolute;left:0;top:0}html body .how .who{margin-bottom:4px}}
/* форма: две кнопки отправки */
html body .sendrow{display:flex;flex-wrap:wrap;gap:12px}
/* переключатель языков */
html body .lang{display:flex;gap:2px;padding:3px;border-radius:10px;background:var(--mist)}
html body .lang a{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;min-width:36px;height:32px;padding:0 8px;border:0;border-radius:8px;background:transparent;color:var(--mute);font:700 13px 'Golos Text',system-ui,sans-serif;cursor:pointer}
html body .lang a[aria-current="page"]{background:var(--acc);color:#fff}
html[lang="zh"] body,html[lang="zh"] body *{font-family:'Golos Text','Noto Sans SC','PingFang SC','Microsoft YaHei',system-ui,sans-serif}
html[lang="zh"] body h1,html[lang="zh"] body h2,html[lang="zh"] body h3,html[lang="zh"] body summary{font-family:'Golos Text','Noto Sans SC','PingFang SC','Microsoft YaHei',system-ui,sans-serif}
@media(max-width:820px){html body .bar{gap:10px}html body .lang a{min-width:32px;padding:0 6px;font-size:12px}}
html body .row.one{grid-template-columns:1fr}
html body input[type=email]{width:100%;padding:14px 16px;border:2px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font:500 18px/1.55 'Golos Text',system-ui,sans-serif}
/* почему выбирают нас: крупное фото */
html body .why .w{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px}
html body .why .side img{aspect-ratio:4/5;object-fit:cover;object-position:36% 50%;border-radius:18px}
@media(max-width:820px){html body .why .w{grid-template-columns:minmax(0,1fr)}html body .why .side img{aspect-ratio:4/3;object-position:36% 50%}}
/* почему выбирают нас: заголовок сверху, фото по высоте текста */
html body .why .w{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:0 56px;align-items:stretch}
html body .why .w>h2{grid-column:1/-1;margin:0 0 40px}
html body .why .side{position:relative;top:auto;min-height:440px;align-self:stretch;border-radius:18px;overflow:hidden}
html body .why .side img{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:36% 50%;border-radius:0}
html body .why .pt:last-child{margin-bottom:0}
@media(max-width:820px){html body .why .w{grid-template-columns:minmax(0,1fr);gap:28px}html body .why .w>h2{margin-bottom:0}html body .why .side{min-height:0;aspect-ratio:4/3}}
/* мобильная версия: меньше информации */
@media(max-width:820px){
html body section{padding:48px 0}
html body .hero{padding:48px 0 52px}
html body .how{padding:40px 0 44px}
html body .how li p{display:none}
html body .how ol{gap:20px}
html body .how .howsub{margin:14px 0 28px}html body .how li{min-height:64px}
html body .tile p{display:none}
html body .tiles{gap:10px}
html body .tile{flex-direction:row;align-items:center;gap:14px;min-height:0;padding:18px 20px;border-radius:16px}
html body .tile svg{margin:0;flex:none}
html body .tile h3{flex:1;margin:0;font-size:16px}
html body .tile .go{margin:0 0 0 auto;align-self:center;font-size:14px;white-space:nowrap}
html body .why .side{aspect-ratio:16/9}
html body .order .w>div:first-child p{display:none}
html body .opt{padding:11px 14px;margin-bottom:8px}
html body .opt input{flex:none;width:20px;height:20px;margin:0}
html body .sendrow .btn{flex:1 1 100%;text-align:center}
html body fieldset{margin-bottom:14px}
html body h2{margin-bottom:24px}
html body .why .w>h2,html body .how h2{margin-bottom:0}
}
@media(max-width:820px){
html body .help-lead{display:block;margin-top:22px;font:700 20px/1.3 'Golos Text',system-ui,sans-serif;color:#a9bdd6}
html body .hero .lead{margin-bottom:16px}
}
@media(min-width:821px){html body .hero h1{font-size:clamp(46px,6.2vw,66px);overflow-wrap:normal}}
html[lang="kk"] h1,html[lang="kk"] h2,html[lang="kk"] h3,html[lang="kk"] summary{font-weight:700}
html body .lang a{white-space:nowrap}
@media(max-width:820px){html body .lang a{padding-left:8px;padding-right:8px}}
@media(min-width:821px){html body .hero .help li{font-size:19px;line-height:1.45}}html body nav a,html body .tel{white-space:nowrap}html[lang="kk"] body nav{gap:12px;font-size:14px}html[lang="kk"] body .bar{gap:18px}html body nav{gap:18px}@media(min-width:821px) and (max-width:1199px){html body .bar>.tel{display:none}}
html body .why{background:#6b1f33;color:var(--ondeep)}html body .why h2,html body .why h3,html body .why p{color:var(--ondeep)}html body .why .pt{border-left-color:var(--hl)}