/* Внутренние страницы «Рычага»: услуги, статьи, политика, 404.
   Главная живёт отдельно (index.html, стили внутри). Здесь — светлая «бумажная» манера из её глав
   «Как работаем» и «Условия», тёмный блок звонка и подвал. Правила — design-system/rychag/MASTER.md. */
@font-face{font-family:'Onest';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/onest-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Onest';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/onest-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:'Unbounded';font-style:normal;font-weight:600 800;font-display:swap;src:url(../fonts/unbounded-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Unbounded';font-style:normal;font-weight:600 800;font-display:swap;src:url(../fonts/unbounded-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;}

:root{
  color-scheme:light;
  --ink:#1C1E23;
  --paper:#F6F4EF;
  --orange:#EA5A2A;

  --bg:#F6F4EF;
  --bg-alt:#ECE9E1;
  --sheet:#FFFDF8;
  --text:#1C1E23;
  --text-muted:#5C5F66;
  --accent-text:#C9471B;
  --dark:#15171B;
  --on-dark:#F6F4EF;
  --on-dark-soft:#D9D7D0;
  --on-dark-muted:#A3A7AF;
  --footer:#101114;
  --btn-main-hover:#F06A3C;
  --btn-main-press:#D9501F;

  --font-display:'Unbounded','Arial Black',sans-serif;
  --font-body:'Onest','Segoe UI',system-ui,sans-serif;

  --fs-caps:.75rem;
  --fs-s:.9375rem;
  --fs-m:1.0625rem;
  --fs-lead:clamp(1.0625rem, .9rem + .6vw, 1.3125rem);
  --fs-l:1.25rem;
  --fs-h3:clamp(1.1875rem, 1rem + .6vw, 1.5rem);
  --fs-h2:clamp(1.5rem, 1rem + 2vw, 2.5rem);
  --fs-h1:clamp(1.875rem, 1rem + 3.4vw, 3.75rem);
  --fs-phone:clamp(1.5rem, .8rem + 3vw, 2.5rem);

  --space-05:.25rem; --space-1:.5rem; --space-15:.75rem; --space-2:1rem; --space-3:1.5rem;
  --space-4:2rem; --space-5:3rem; --space-6:4rem; --space-7:6rem;
  --radius:14px;
  --gutter:16px;
  --wrap:1120px;
  --text-w:44rem;
  --head:4.25rem;
  --tap:3.25rem;
  --tap-min:2.75rem;
  --ease-out:cubic-bezier(.23,1,.32,1);
}
@media (min-width:40em){ :root{ --gutter:32px; } }
@media (min-width:64em){ :root{ --gutter:48px; } }

@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#121316; --bg-alt:#1B1D21; --sheet:#202228;
    --text:#ECE9E1; --text-muted:#A9ACB3; --accent-text:#EA5A2A;
    --dark:#1E2025; --footer:#0B0C0E;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#121316; --bg-alt:#1B1D21; --sheet:#202228;
  --text:#ECE9E1; --text-muted:#A9ACB3; --accent-text:#EA5A2A;
  --dark:#1E2025; --footer:#0B0C0E;
}
@media (prefers-contrast:more){
  :root{ --text-muted:#3E4147; --on-dark-soft:#F6F4EF; --on-dark-muted:#D4D6DB; }
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-padding-top:calc(var(--head) + var(--space-2)); }
@media (prefers-reduced-motion:no-preference){ html{ scroll-behavior:smooth; } }
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--font-body); font-size:var(--fs-m); line-height:1.6;
  -webkit-font-smoothing:antialiased; -webkit-tap-highlight-color:transparent;
}
h1,h2,h3{ font-family:var(--font-display); font-weight:700; margin:0; text-wrap:balance; overflow-wrap:break-word; }
h1,h2{ hyphens:auto; -webkit-hyphens:auto; }
/* элементы сеток не растягивают колонку длинным словом */
.intro > *, .prose > *, .cards > *, .steps > *, .call-in > *, .foot > *, .faq > *, .posts > *{ min-width:0; }
h1{ font-size:var(--fs-h1); line-height:1.06; letter-spacing:-.03em; }
h2{ font-size:var(--fs-h2); line-height:1.1; letter-spacing:-.02em; }
h3{ font-size:var(--fs-h3); line-height:1.25; letter-spacing:-.005em; }
p{ margin:0; text-wrap:pretty; }
a{ color:inherit; }
:focus-visible{ outline:3px solid var(--orange); outline-offset:3px; border-radius:6px; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.wrap{ max-width:var(--wrap); margin-inline:auto; padding-left:max(var(--gutter), env(safe-area-inset-left, 0px)); padding-right:max(var(--gutter), env(safe-area-inset-right, 0px)); }
.skip{ position:absolute; left:-9999px; top:var(--space-1); background:var(--orange); color:var(--ink); padding:var(--space-15) var(--space-2); border-radius:10px; font-weight:600; z-index:40; }
.skip:focus{ left:var(--space-2); }

/* ---------- кнопки ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--space-1);
  min-height:var(--tap); padding:0 var(--space-3); border-radius:999px; border:0;
  font:600 var(--fs-m)/1 var(--font-body); text-decoration:none; white-space:nowrap;
  transition:background-color .18s var(--ease-out), color .18s var(--ease-out), transform .12s var(--ease-out);
  cursor:pointer; user-select:none; -webkit-user-select:none;
}
.btn svg{ width:1.2em; height:1.2em; flex:none; }
.btn-main{ background:var(--orange); color:var(--ink); }
.btn-ghost{ background:transparent; border:1.5px solid currentColor; color:inherit; }
.btn-s{ min-height:var(--tap-min); padding:0 var(--space-2); font-size:var(--fs-s); }
@media (hover:hover) and (pointer:fine){
  .btn-main:hover{ background:var(--btn-main-hover); }
  .btn-ghost:hover{ background:rgba(127,127,127,.12); }
}
.btn:active{ transform:scale(.97); transition-duration:0s,0s,.1s; }
.btn-main:active{ background:var(--btn-main-press); }
.link-press{ transition:opacity .2s var(--ease-out); }
.link-press:active{ opacity:.6; transition:none; }
.actions{ display:flex; flex-wrap:wrap; gap:var(--space-15); }

/* ---------- шапка ---------- */
.top{ position:sticky; top:0; z-index:30; background:color-mix(in srgb, var(--bg) 88%, transparent); -webkit-backdrop-filter:blur(16px) saturate(150%); backdrop-filter:blur(16px) saturate(150%); /* taste-skill-ignore: закреплённая шапка — стекло над текстом */ }
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){ .top{ background:var(--bg); } }
.top-in{ display:flex; align-items:center; gap:var(--space-3); min-height:var(--head); }
.brand{ display:inline-flex; align-items:center; gap:var(--space-15); text-decoration:none; min-height:var(--tap-min); margin-right:auto; }
.brand svg{ width:2.75rem; height:1.875rem; flex:none; }
.brand-name{ font:700 var(--fs-l)/.9 var(--font-display); letter-spacing:.02em; }
.brand-sub{ display:block; font:600 .6875rem/1 var(--font-body); letter-spacing:.12em; opacity:.72; margin-top:var(--space-05); }
@media (max-width:22.4em){ .brand-sub{ display:none; } }
.top-nav{ display:none; gap:var(--space-3); }
.top-nav a, .top-phone{ text-decoration:none; font-weight:500; min-height:var(--tap-min); display:inline-flex; align-items:center; white-space:nowrap; }
.top-nav a[aria-current="page"]{ text-decoration:underline; text-underline-offset:5px; text-decoration-thickness:1.5px; }
.top-phone{ display:none; gap:var(--space-1); font-weight:600; font-variant-numeric:tabular-nums; }
.top-phone svg{ width:1.1em; height:1.1em; color:var(--accent-text); }
@media (min-width:72em){ .top-nav{ display:flex; } }
@media (min-width:48em){ .top-phone{ display:inline-flex; } }
@media (hover:hover) and (pointer:fine){ .top-nav a:hover, .top-phone:hover{ text-decoration:underline; text-underline-offset:5px; text-decoration-thickness:1.5px; } }

/* ---------- начало страницы ---------- */
.crumbs{ padding-top:var(--space-3); font-size:var(--fs-s); color:var(--text-muted); }
.crumbs ol{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:var(--space-05) var(--space-1); }
.crumbs li + li::before{ content:"/"; margin-right:var(--space-1); }
.crumbs a{ text-decoration:none; display:inline-block; padding-block:var(--space-1); }
@media (hover:hover) and (pointer:fine){ .crumbs a:hover{ text-decoration:underline; } }
.intro{ padding-block:var(--space-4) var(--space-6); display:grid; gap:var(--space-3); }
.intro .lead{ max-width:var(--text-w); }
.lead{ font-size:var(--fs-lead); line-height:1.5; color:var(--text-muted); }
.meta{ font-size:var(--fs-s); color:var(--text-muted); }

/* ---------- текст ---------- */
.sec{ padding-block:var(--space-6); }
@media (min-width:64em){ .sec{ padding-block:var(--space-7); } }
.alt{ background:var(--bg-alt); }
.sec.flush{ padding-top:0; }
.prose{ display:grid; gap:var(--space-2); }
.prose > *{ max-width:var(--text-w); }
.prose h2{ margin-top:var(--space-4); }
.prose h2:first-child{ margin-top:0; }
.prose h3{ margin-top:var(--space-2); }
.prose ul, .prose ol{ margin:0; padding-left:var(--space-3); display:grid; gap:var(--space-1); }
.prose li::marker{ color:var(--accent-text); }
.prose blockquote{ margin:0; padding:var(--space-2) var(--space-3); background:var(--bg-alt); border-radius:var(--radius); }
.prose strong{ font-weight:650; }
.prose a{ color:var(--accent-text); text-underline-offset:3px; }
.dots{ list-style:none; padding:0 !important; margin:0; display:grid; gap:var(--space-1); }
.dots li{ padding-left:var(--space-3); position:relative; }
.dots li::before{ content:""; position:absolute; left:0; top:.66em; width:7px; height:7px; border-radius:50%; background:var(--orange); }

.sec-head{ display:grid; gap:var(--space-2); max-width:var(--text-w); margin-bottom:var(--space-5); }

/* что делаю — карточки тоном, без рамок и теней */
.cards{ list-style:none; margin:0; padding:0; display:grid; gap:var(--space-2); }
@media (min-width:48em){ .cards{ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (min-width:72em){ .cards.three{ grid-template-columns:repeat(3, minmax(0, 1fr)); } }
.card{ background:var(--sheet); border-radius:var(--radius); padding:var(--space-4) var(--space-3); display:grid; gap:var(--space-15); align-content:start; }
.alt .card{ background:var(--bg); }
.card p{ color:var(--text-muted); }
.card .get{ color:var(--text); font-weight:600; }

/* шаги */
.steps{ list-style:none; padding:0; margin:0; display:grid; gap:var(--space-5); counter-reset:st; }
@media (min-width:55em){ .steps{ grid-template-columns:repeat(4, minmax(0, 1fr)); gap:var(--space-4); } }
.steps li{ display:grid; gap:var(--space-1); align-content:start; counter-increment:st; }
.steps li::before{ content:counter(st, decimal-leading-zero); font:800 2.5rem/1 var(--font-display); letter-spacing:-.03em; color:var(--accent-text); font-variant-numeric:tabular-nums; } /* taste-skill-ignore: настоящий порядок шагов */
.steps p{ color:var(--text-muted); }

/* цена */
.price{ background:var(--sheet); border-radius:var(--radius); padding:var(--space-4) var(--space-3); display:grid; gap:var(--space-2); max-width:var(--text-w); }
@media (min-width:40em){ .price{ padding:var(--space-5); } }
.price-n{ font:700 var(--fs-h2)/1.05 var(--font-display); letter-spacing:-.02em; }
.price p{ color:var(--text-muted); }

/* вопросы и ответы */
.faq{ display:grid; gap:var(--space-1); max-width:var(--text-w); }
.qa{ background:var(--sheet); border-radius:var(--radius); }
.alt .qa{ background:var(--bg); }
.qa summary{ cursor:pointer; list-style:none; display:flex; justify-content:space-between; gap:var(--space-2); align-items:center; min-height:var(--tap); padding:var(--space-2) var(--space-3); font-weight:600; font-size:var(--fs-m); }
.qa summary::-webkit-details-marker{ display:none; }
.qa summary::after{ content:""; flex:none; width:.7em; height:.7em; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:translateY(-25%) rotate(45deg); transition:transform .2s var(--ease-out); }
.qa[open] summary::after{ transform:translateY(25%) rotate(-135deg); }
.qa .ans{ padding:0 var(--space-3) var(--space-3); display:grid; gap:var(--space-15); color:var(--text-muted); }

/* звонок — тёмный блок, как финал главной */
.call{ background:var(--dark); color:var(--on-dark); }
.call-in{ padding-block:var(--space-6); display:grid; gap:var(--space-4); }
@media (min-width:64em){ .call-in{ padding-block:var(--space-7); grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); align-items:end; gap:var(--space-6); } }
.call h2{ max-width:20ch; }
.call .lead{ color:var(--on-dark-soft); margin-top:var(--space-2); max-width:30em; }
.call-side{ display:grid; gap:var(--space-2); }
.call-phone{ display:inline-flex; align-items:center; min-height:3rem; font:700 var(--fs-phone)/1.1 var(--font-display); letter-spacing:-.01em; font-variant-numeric:tabular-nums; text-decoration:none; white-space:nowrap; }
@media (hover:hover) and (pointer:fine){ .call-phone:hover{ color:var(--orange); } }

/* статьи: список */
.posts{ list-style:none; margin:0; padding:0; display:grid; gap:var(--space-2); }
@media (min-width:55em){ .posts{ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
.post{ background:var(--sheet); border-radius:var(--radius); padding:var(--space-4) var(--space-3); display:grid; gap:var(--space-15); align-content:start; }
.post a{ text-decoration:none; }
.post a::after{ content:""; position:absolute; inset:0; border-radius:var(--radius); }
.post{ position:relative; }
.post h2{ font-size:var(--fs-h3); line-height:1.25; letter-spacing:-.005em; }
.post p{ color:var(--text-muted); }
@media (hover:hover) and (pointer:fine){ .post:hover h2, .post:hover h3{ text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:2px; } }

/* подвал */
footer{ background:var(--footer); color:var(--on-dark-muted); font-size:var(--fs-s); }
.foot{ padding-block:var(--space-5) var(--space-4); display:grid; gap:var(--space-4); }
@media (min-width:55em){ .foot{ grid-template-columns:2fr 1fr 1fr; } }
.foot h2{ font:600 var(--fs-caps)/1 var(--font-body); letter-spacing:.12em; text-transform:uppercase; color:var(--on-dark); margin-bottom:var(--space-15); }
.foot .foot-next{ margin-top:var(--space-3); }
.foot ul{ list-style:none; margin:0; padding:0; display:grid; gap:var(--space-05); }
.foot a{ text-decoration:none; display:inline-block; padding-block:var(--space-05); color:var(--on-dark-soft); }
@media (hover:hover) and (pointer:fine){ .foot a:hover{ text-decoration:underline; text-underline-offset:4px; } }
.foot-who{ display:grid; gap:var(--space-1); }
.foot-who b{ color:var(--on-dark); font-weight:600; }
.foot-low{ padding-block:var(--space-3); display:flex; flex-wrap:wrap; gap:var(--space-1) var(--space-3); justify-content:space-between; color:var(--on-dark-muted); }
@media (max-width:54.99em){ footer{ padding-bottom:calc(var(--tap) + 2 * var(--space-15) + env(safe-area-inset-bottom, 0px)); } }

/* нижняя панель на телефоне */
.dock{
  position:fixed; left:0; right:0; bottom:0; z-index:30; display:flex; gap:var(--space-15);
  padding:var(--space-15) max(var(--space-2), env(safe-area-inset-right, 0px)) calc(var(--space-15) + env(safe-area-inset-bottom, 0px)) max(var(--space-2), env(safe-area-inset-left, 0px));
  background:rgba(21,23,27,.82); color:var(--on-dark);
  -webkit-backdrop-filter:blur(20px) saturate(160%); backdrop-filter:blur(20px) saturate(160%); /* taste-skill-ignore: единственная закреплённая панель */
  box-shadow:inset 0 1px 0 rgba(246,244,239,.1); /* taste-skill-ignore: блик на кромке стекла вместо линии-разделителя */
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){ .dock{ background:rgba(21,23,27,.96); } }
.dock .btn{ flex:1; padding:0 var(--space-15); }
@media (min-width:55em){ .dock{ display:none; } }

/* плашка о cookie (только когда на сайте стоит Метрика) */
.cookie{ position:fixed; z-index:35; left:var(--space-2); right:var(--space-2); bottom:calc(var(--tap) + 2 * var(--space-15) + env(safe-area-inset-bottom, 0px) + var(--space-1)); max-width:30rem; margin-inline:auto; background:var(--sheet); color:var(--text); border-radius:var(--radius); padding:var(--space-2) var(--space-3); display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-15); font-size:var(--fs-s); box-shadow:0 8px 30px rgba(0,0,0,.18); /* taste-skill-ignore: всплывающая плашка должна отделяться от текста */ }
@media (min-width:55em){ .cookie{ bottom:var(--space-3); } }
.cookie p{ flex:1 1 14rem; }
.cookie a{ color:var(--accent-text); }
.cookie[hidden]{ display:none; }

@media (prefers-reduced-transparency:reduce){
  .dock{ background:var(--dark); -webkit-backdrop-filter:none; backdrop-filter:none; }
  .top{ background:var(--bg); -webkit-backdrop-filter:none; backdrop-filter:none; }
}
@media (prefers-contrast:more){
  .dock{ background:#15171B; -webkit-backdrop-filter:none; backdrop-filter:none; box-shadow:inset 0 2px 0 var(--paper); }
  .btn-ghost{ border-width:2px; }
}
@media (prefers-reduced-motion:reduce){
  .btn:active{ transform:none; }
  .qa summary::after{ transition:none; }
}