/* Шрифты с нашего сервера, без Google Fonts: IP посетителей не уходит в Google. Лицензии — *_OFL.txt рядом. */
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/inter-normal-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;
}
/* Lora — полный файл без сабсета (OFL, Reserved Font Name) */
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(/assets/fonts/Lora-wght.ttf) format('truetype');
}
/* Lora — полный файл без сабсета (OFL, Reserved Font Name) */
@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url(/assets/fonts/Lora-Italic-wght.ttf) format('truetype');
}

body{margin:0;background:#FAF8F6}
a{color:#851D2D;text-decoration:none}a:hover{color:#5E1420}
.wrap{max-width:1180px;margin:0 auto;padding-left:24px;padding-right:24px;box-sizing:border-box}
.row{display:flex;flex-wrap:wrap;align-items:center;gap:56px}
.col{flex:1 1 460px;min-width:0}
.g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.navlinks{display:flex;gap:28px}
.phone{border-radius:44px;background:#1E1718;padding:9px;box-sizing:border-box;box-shadow:0 40px 80px -30px rgba(52,39,41,.45),0 12px 30px -12px rgba(52,39,41,.25)}
.phone img{display:block;width:100%;border-radius:36px}
@media (max-width:1040px){.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.g3,.g2,.g4{grid-template-columns:minmax(0,1fr)}.navlinks{display:none}.h1{font-size:42px !important;line-height:1.08 !important}.h2{font-size:31px !important}.backphone{display:none}}
input::placeholder{color:#8A7F80}

/* ===== демо «Первое открытие» — как шаг 6 онбординга (first-run-flow-mockup-v2.html), цикл 14 с ===== */
.dm{position:relative;width:370px;height:740px;border-radius:44px;background:#1E1718;padding:9px;box-sizing:border-box;box-shadow:0 40px 80px -30px rgba(52,39,41,.45),0 12px 30px -12px rgba(52,39,41,.25);flex:none;margin:0 auto}
.dm-scr{position:relative;width:100%;height:100%;border-radius:36px;overflow:hidden;background:#FDE9D5}
.dm-page{padding:54px 28px 0;display:flex;flex-direction:column;gap:16px}
.dm-eb{font:400 11px Inter,sans-serif;letter-spacing:.2em;color:#645B5C}
.dm-p{margin:0;font:400 21px/34px Lora,Georgia,serif;color:#38322D;text-align:left;word-spacing:.02em}
.dm-w{position:relative;border-radius:3px;animation:dmWord 14s infinite}
.dm-ph{position:relative;white-space:nowrap;border-radius:7px;background:linear-gradient(#EFC5A0,#EFC5A0) no-repeat left center/0% 90%;animation:dmSel 14s infinite}
.dm-f{position:absolute;z-index:8;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:rgba(153,74,0,.3);border:2px solid #994A00;box-sizing:border-box;opacity:0;pointer-events:none}
.dm-fa{left:50%;top:50%;animation:dmFA 14s infinite}
.dm-fb{left:0;top:50%;animation:dmFB 14s infinite}
.dm-scrim{position:absolute;inset:0;background:rgba(0,0,0,.28);opacity:0;z-index:4;animation:dmScrim 14s infinite}
.dm-sheet{position:absolute;left:0;right:0;bottom:0;z-index:5;height:55%;box-sizing:border-box;background:#FFF5E9;border:1px solid #D5D0CA;border-bottom:0;border-radius:28px 28px 0 0;transform:translateY(105%);animation:dmSheet 14s infinite;padding:0 18px}
.dm-pc{position:absolute;left:16px;right:16px;bottom:44px;z-index:6;background:#FFF5E9;border:1px solid #D5D0CA;border-radius:24px;padding:16px 18px 18px;box-shadow:0 14px 30px -14px rgba(0,0,0,.35);opacity:0;transform:translateY(16%);animation:dmPC 14s infinite}
@keyframes dmFA{0%{opacity:0;transform:translate(34px,46px)}6%{opacity:1;transform:none}10%{transform:none}12%{transform:scale(.7)}14%{opacity:1;transform:none}18%,100%{opacity:0;transform:none}}
@keyframes dmWord{0%,11%{background:transparent}12%,45%{background:#F3CCAD}48%,100%{background:transparent}}
@keyframes dmScrim{0%,12%{opacity:0}15%,44%{opacity:1}48%,100%{opacity:0}}
@keyframes dmSheet{0%,12%{transform:translateY(105%)}16%,44%{transform:none}48%,100%{transform:translateY(105%)}}
@keyframes dmFB{0%,49%{opacity:0;left:0;transform:translate(26px,40px)}54%{opacity:1;left:0;transform:none}56%{left:0;transform:scale(.7)}65%{left:100%;transform:scale(.7)}67%{left:100%;transform:none;opacity:1}71%,100%{opacity:0;left:100%;transform:none}}
@keyframes dmSel{0%,56%{background-size:0% 90%}65%,93%{background-size:100% 90%}96%,100%{background-size:0% 90%}}
@keyframes dmPC{0%,66%{opacity:0;transform:translateY(16%)}69%,92%{opacity:1;transform:none}95%,100%{opacity:0;transform:translateY(16%)}}
@media (prefers-reduced-motion:reduce){.dm-w,.dm-ph,.dm-f,.dm-scrim,.dm-sheet,.dm-pc{animation:none}}

/* ---- то, чего не было в макете холста: сегментные кнопки, форма обратной связи, доступность ---- */
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
:focus-visible{outline:2px solid #851D2D;outline-offset:2px}
.skip{position:absolute;left:-9999px;top:8px;z-index:20;background:#851D2D;color:#FFFAF5;padding:10px 16px;border-radius:999px}
.skip:focus{left:16px}

.seg{display:flex;gap:2px;padding:3px;border-radius:999px;background:#EFE8E3;flex-wrap:wrap}
.seg a,.seg button{border:0;height:36px;padding:0 14px;border-radius:999px;background:transparent;color:#645B5C;font:500 13.5px Inter,sans-serif;cursor:pointer;display:inline-flex;align-items:center;text-decoration:none}
.seg.sm a{height:32px;padding:0 11px}
.seg a[aria-current="page"],.seg button[aria-pressed="true"]{background:#FFFFFF;color:#342729;font-weight:600;box-shadow:0 1px 3px rgba(52,39,41,.18)}
.seg a:hover,.seg button:hover{color:#342729}

/* обратная связь */
.fb{display:flex;flex-wrap:wrap;gap:40px 56px;align-items:flex-start;background:#FFFFFF;border:1px solid #DEDBD9;border-radius:32px;padding:48px;box-shadow:0 1px 2px rgba(52,39,41,.05),0 18px 40px -26px rgba(52,39,41,.28)}
.fb-intro{flex:1 1 360px;min-width:0;display:flex;flex-direction:column;gap:16px}
.fb-points{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
.fb-points li{display:flex;align-items:center;gap:10px;font-size:15px;color:#584D4E}
.fb-card{flex:1 1 420px;min-width:0;background:#FAF8F6;border:1px solid #DEDBD9;border-radius:24px;padding:28px}
.fb-fields{display:flex;flex-direction:column;gap:10px}
.fb-label{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#584D4E;margin-top:6px}
.fb-opt{font-weight:500;letter-spacing:0;text-transform:none;color:#645B5C}
.fb-input{width:100%;box-sizing:border-box;border:1px solid #DEDBD9;border-radius:16px;background:#FFFFFF;padding:14px 16px;font:400 16px/1.5 Inter,sans-serif;color:#342729;transition:border-color .2s,box-shadow .2s}
.fb-input::placeholder{color:#8A7F80}
.fb-input:focus{outline:none;border-color:#851D2D;box-shadow:0 0 0 3px rgba(133,29,45,.12)}
.fb-input[aria-invalid="true"]{border-color:#B23A2A}
.fb-textarea{min-height:150px;resize:vertical}
.fb-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fb-error{margin:4px 0 0;font-size:14px;color:#B23A2A}
.fb-send{margin-top:10px;height:54px;border:0;border-radius:999px;background:#851D2D;color:#FFFAF5;font:600 16px Inter,sans-serif;cursor:pointer;transition:opacity .2s}
.fb-send:disabled{opacity:.6;cursor:default}
.fb-note{margin:2px 0 0;font-size:13px;line-height:1.5;color:#645B5C;text-align:center}
.fb-done{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:28px 8px}
.fb-done[hidden],.fb-fields[hidden]{display:none}
.fb-done-icon{width:56px;height:56px;border-radius:999px;background:#E6EFE8;display:flex;align-items:center;justify-content:center}
.fb-done-title{font:600 22px/1.3 Lora,Georgia,serif;color:#342729}
.fb-done-sub{font-size:15px;color:#584D4E}
.fb-again{margin-top:8px;height:44px;padding:0 20px;border:1px solid #DEDBD9;border-radius:999px;background:#FFFFFF;color:#342729;font:600 14px Inter,sans-serif;cursor:pointer}
@media (max-width:760px){.fb{padding:28px 20px;border-radius:24px}.fb-card{padding:20px}}

/* кнопки переключателей языков в демо */
.segb{border:0;height:36px;padding:0 14px;border-radius:999px;background:transparent;color:#645B5C;font:500 13.5px Inter,sans-serif;cursor:pointer}
.segb[aria-pressed="true"]{background:#FFFFFF;color:#342729;font-weight:600;box-shadow:0 1px 3px rgba(52,39,41,.18)}
.segb:hover{color:#342729}

/* телефон демо на узких экранах: во всю колонку, пропорции 370×740 сохраняются */
@media (max-width:440px){.dm{width:100%;height:auto;aspect-ratio:370/740}}

/* шапка на телефоне: переключатель языков в одну строку, кнопка магазина — только на первом экране */
.seg.sm{flex-wrap:nowrap}
@media (max-width:640px){header a[href^="https://play.google.com"]{display:none!important}}
@media (max-width:440px){.segb{padding:0 9px;font-size:12.5px;height:34px}}
/* ссылки внутри текста отличаются не только цветом (WCAG 1.4.1) */
.fb-note a,footer p a{text-decoration:underline;text-underline-offset:2px}
#main:focus{outline:none}
