/*
Theme Name: dmitriy-real
Description: Тема собрана seo build из design.json проекта dmitriy-real.
Version: 2.0.0
Requires at least: 6.5
Text Domain: seo-dmitriy-real
*/
:root { --color-background: #FFFFFF; --color-surface: #F4F4F5; --color-band: #EDEDEF; --color-text: #141519; --color-text-muted: #555861; --color-accent: #C40D2B; --color-accent-dark: #9B0A22; --color-accent-soft: #FCEBEE; --color-on-accent: #FFFFFF; --color-on-accent-muted: #FBE3E7; --color-action: #141519; --color-action-hover: #2E3038; --color-on-action: #FFFFFF; --color-border: #DCDDE1; --color-border-strong: #8A8D96; --color-dark: #141519; --color-on-dark: #FFFFFF; --color-on-dark-muted: #C4C6CC; --color-focus: #141519; --color-focus-on-tone: #FFFFFF; --color-error: #B3261E; --color-error-bg: #FDECEA; --color-success: #1E7A46; --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px; --font-body: "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Noto Sans", "Helvetica Neue", Arial, sans-serif; --font-heading: Bahnschrift, "Segoe UI", -apple-system, "SF Pro Display", Roboto, "Helvetica Neue", Arial, sans-serif; --content-width: 1240px; --gap: clamp(16px, 4vw, 40px); --inline: max(var(--gap), calc((100% - var(--content-width)) / 2)); }
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: var(--color-background); color: var(--color-text); font-family: var(--font-body); }
img { max-width: 100%; height: auto; }
:where(.wp-block-group) > * { margin-block: 0; }
.skip { position: absolute; left: -9999px; }
.skip:focus { left: 8px; top: 8px; z-index: 30; background: var(--color-background); padding: 8px 12px; }
.site-header, .site-footer, .breadcrumbs, .page-head, .section { padding-inline: var(--inline); }
.menu-toggle[hidden] { display: none; }
/* The breadcrumb separator is span.crumb-sep in the markup; a separator drawn on li would end a wrapped line. */
nav.breadcrumbs > ol > li:nth-child(n)::before, nav.breadcrumbs > ol > li:nth-child(n)::after { content: none; }
/* What WordPress core block styles give, so that the copy looks like the theme: buttons in a row, the outline style. */
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.wp-block-button.is-style-outline > .wp-block-button__link { background: transparent; color: inherit; border: 2px solid currentColor; box-shadow: none; }
.calc-options { border: 0; padding: 0; margin: 0; }
.calc-option { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-height: 44px; cursor: pointer; }
.calc-quantity { min-height: 44px; }
.order-dialog { border: 0; max-width: calc(100vw - 32px); }
.order-dialog::backdrop { background: rgb(0 0 0 / 0.5); }
.dialog-close { position: absolute; top: 8px; right: 8px; width: 44px; height: 44px; cursor: pointer; }
.order-form textarea { box-sizing: border-box; width: 100%; min-height: 88px; padding: 12px 16px; border: 2px solid var(--color-border-strong, var(--color-border, #999)); border-radius: 8px; background: var(--color-background); color: var(--color-text); font: inherit; resize: vertical; }
.order-form textarea:focus-visible { border-color: var(--color-text); outline: 3px solid var(--color-focus, currentColor); outline-offset: 2px; }
.consent { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: flex-start; }
.consent input { width: 22px; height: 22px; margin: 0; flex: none; }

.slider { display: flex; gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain; scrollbar-width: none; }
.slider::-webkit-scrollbar { display: none; }
.slider > * { flex: 0 0 100%; min-width: 0; scroll-snap-align: start; }
.slider-nav { display: flex; align-items: center; gap: 12px; margin-top: 16px; }
.slider-nav button { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 2px solid currentColor; border-radius: 50%; background: none; color: inherit; font: inherit; font-size: 22px; line-height: 1; cursor: pointer; }
.slider-nav button:disabled { opacity: 0.3; cursor: default; }
.slider-count { min-width: 4ch; text-align: center; font-variant-numeric: tabular-nums; }
.bottom-bar { display: none; }
@media (min-width: 900px) { .menu-toggle { display: none; } }
@media (max-width: 899px) {
  .js .site-menu { display: none; }
  .js .site-menu.open { display: block; }
  .bottom-bar { display: flex; gap: 8px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); }
  .bottom-bar .button { flex: 1; min-height: 48px; }
  .bottom-bar details.bar-write { flex: 1; position: relative; display: flex; }
  .bottom-bar details.bar-write > summary { flex: 1; list-style: none; cursor: pointer; }
  .bottom-bar details.bar-write > summary::-webkit-details-marker { display: none; }
  .bar-write-menu { position: absolute; left: 0; right: 0; bottom: calc(100% + 8px); display: grid; gap: 4px; padding: 6px; background: var(--color-background, #fff); border: 1px solid rgb(0 0 0 / 0.15); border-radius: 8px; box-shadow: 0 4px 16px rgb(0 0 0 / 0.15); }
  .bar-write-menu a { display: flex; align-items: center; min-height: 44px; padding: 0 12px; color: inherit; text-decoration: none; font-weight: 600; }
  body { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
}

/* design.system: hero_c_red_blocks (proposed) */
/* Красный блок: общий слой сайта. Вид, не поведение: закрепление панели, сворачивание меню и логика формы - в базовом CSS и скрипте сборки. */
html { -webkit-text-size-adjust: 100%; }
body { font-size: 18px; line-height: 1.55; }
[hidden] { display: none !important; }
::selection { background: var(--color-accent); color: var(--color-on-accent); }

/* Типографика */
h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); font-weight: 700; line-height: 1.08; letter-spacing: -0.01em; color: inherit; overflow-wrap: break-word; text-wrap: balance; }
h1 { font-size: clamp(34px, 5.4vw, 76px); }
h2 { font-size: clamp(28px, 3.6vw, 52px); }
h3 { font-size: clamp(21px, 2vw, 27px); line-height: 1.18; }
h4 { font-size: 20px; line-height: 1.25; }
h5, h6 { font-size: 18px; line-height: 1.3; }
main :where(p, ul, ol) { max-width: 70ch; }
strong, b { font-weight: 700; }
a { color: var(--color-accent-dark); text-decoration-thickness: 2px; text-underline-offset: 3px; transition: color 0.15s; }
a:hover { color: var(--color-text); }
:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; }
.section { padding-block: clamp(56px, 8vw, 112px); }
.page-head { padding-block: 40px 8px; }
p.source-note { font-size: 14px; line-height: 1.45; color: var(--color-text-muted); }
.wp-block-list { padding-left: 1.25em; display: grid; gap: 8px; }
.wp-block-list li::marker { color: var(--color-accent); font-family: var(--font-numeric); font-weight: 700; }
.wp-block-image { margin: 0; }
.wp-block-image img { display: block; border-radius: 6px; }
.wp-block-image figcaption { margin-top: 8px; font-size: 14px; color: var(--color-text-muted); }

/* Кнопки: действие почти чёрное, контурная - цветом текста */
.button, .wp-block-button__link { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 56px; padding: 14px 32px; border: 2px solid var(--color-action); border-radius: 8px; background: var(--color-action); color: var(--color-on-action); font-family: var(--font-heading); font-size: 19px; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none; cursor: pointer; transition: background-color 0.15s, border-color 0.15s, color 0.15s; }
.button:hover, .wp-block-button__link:hover { background: var(--color-action-hover); border-color: var(--color-action-hover); color: var(--color-on-action); }
.button--ghost, .wp-block-button.is-style-outline > .wp-block-button__link { background: transparent; color: var(--color-text); border-color: currentColor; }
.button--ghost:hover, .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--color-action); border-color: var(--color-action); color: var(--color-on-action); }

/* Тона контейнеров */
.tone-red { background: var(--color-accent); color: var(--color-on-accent); }
.tone-dark { background: var(--color-dark); color: var(--color-on-dark); }
.tone-grey { background: var(--color-surface); color: var(--color-text); }
.tone-red a:not(.button):not(.wp-block-button__link), .tone-dark a:not(.button):not(.wp-block-button__link) { color: inherit; }
.tone-red :focus-visible, .tone-dark :focus-visible { outline-color: var(--color-focus-on-tone); }
.tone-red .wp-block-button.is-style-outline > .wp-block-button__link, .tone-red .button--ghost { color: var(--color-on-accent); border-color: var(--color-on-accent); }
.tone-red .wp-block-button.is-style-outline > .wp-block-button__link:hover, .tone-red .button--ghost:hover { background: var(--color-on-accent); border-color: var(--color-on-accent); color: var(--color-accent-dark); }
.tone-dark .wp-block-button__link, .tone-dark .button { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-on-accent); }
.tone-dark .wp-block-button__link:hover, .tone-dark .button:hover { background: var(--color-accent-dark); border-color: var(--color-accent-dark); }
.tone-dark .wp-block-button.is-style-outline > .wp-block-button__link, .tone-dark .button--ghost { background: transparent; color: var(--color-on-dark); border-color: var(--color-on-dark); }
.tone-dark .wp-block-button.is-style-outline > .wp-block-button__link:hover, .tone-dark .button--ghost:hover { background: var(--color-on-dark); border-color: var(--color-on-dark); color: var(--color-dark); }

/* Знак логотипа по контуру materials/logo-a6.png (856x1034) */
.hex-mark { display: block; width: 100%; aspect-ratio: 856 / 1034; background: var(--color-accent); clip-path: polygon(50.2% 0, 100% 27.1%, 100% 59.5%, 78.3% 70.8%, 78.3% 39.7%, 50.2% 25.3%, 11.1% 45.3%, 81.4% 85.5%, 50.2% 100%, 0 71.1%, 0 27.3%); }
.hex-mark--light { background: var(--color-on-accent); }
.hex-mark--dark { background: var(--color-dark); }

/* Шапка: красная полоса, белый негатив знака, не закрепляется */
.site-header { background: var(--color-accent); color: var(--color-on-accent); }
.site-header :focus-visible { outline-color: var(--color-focus-on-tone); }
.header-inner { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 32px; min-height: 88px; padding-block: 14px; }
.brand { flex: none; }
.site-name { margin: 0; }
.site-name a { position: relative; display: block; width: 46px; height: 56px; overflow: hidden; color: transparent; white-space: nowrap; text-indent: 120%; }
.site-name a::before { content: ""; position: absolute; inset: 0; background: var(--color-on-accent); clip-path: polygon(50.2% 0, 100% 27.1%, 100% 59.5%, 78.3% 70.8%, 78.3% 39.7%, 50.2% 25.3%, 11.1% 45.3%, 81.4% 85.5%, 50.2% 100%, 0 71.1%, 0 27.3%); }
.header-nav { flex: 1 1 auto; display: flex; justify-content: flex-end; min-width: 0; }
.site-menu ul { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0 28px; margin: 0; padding: 0; list-style: none; }
.site-menu a, .site-menu .wp-block-navigation-item__content { display: inline-flex; align-items: center; min-height: 44px; color: var(--color-on-accent); font-weight: 600; font-size: 17px; text-decoration: none; border-bottom: 2px solid transparent; }
.site-menu a:hover, .site-menu a[aria-current="page"] { color: var(--color-on-accent); border-bottom-color: var(--color-on-accent); }
.site-menu .wp-block-navigation__responsive-container-open, .site-menu .wp-block-navigation__responsive-container-close { color: var(--color-on-accent); min-width: 44px; min-height: 44px; }
.header-contact { flex: none; }
.header-phone { margin: 0; font-family: var(--font-numeric); font-size: 21px; font-weight: 700; font-variant-numeric: tabular-nums; }
.header-phone a { display: inline-flex; align-items: center; min-height: 44px; color: var(--color-on-accent); text-decoration: none; white-space: nowrap; }
.header-phone a:hover { text-decoration: underline; color: var(--color-on-accent); }
.header-order .wp-block-button__link { min-height: 48px; padding: 10px 22px; font-size: 17px; }
.menu-toggle { min-height: 44px; padding: 8px 16px; border: 2px solid var(--color-on-accent); border-radius: 8px; background: transparent; color: var(--color-on-accent); font-family: var(--font-heading); font-size: 16px; font-weight: 700; line-height: 1; cursor: pointer; }
.menu-toggle[aria-expanded="true"] { background: var(--color-on-accent); color: var(--color-accent-dark); }
@media (min-width: 900px) and (max-width: 1199px) {
  .header-inner { gap: 10px 24px; }
  .site-menu ul { gap: 0 18px; }
  .site-menu a, .site-menu .wp-block-navigation-item__content { font-size: 15px; }
  .header-phone { font-size: 18px; }
}
@media (max-width: 899px) {
  .header-inner { min-height: 72px; padding-block: 10px; gap: 8px 12px; }
  .site-name a { width: 38px; height: 46px; }
  .header-nav { display: contents; }
  .header-contact { order: 1; margin-left: auto; }
  .menu-toggle { order: 2; }
  .site-menu { order: 3; flex-basis: 100%; }
  .site-menu ul { flex-direction: column; justify-content: flex-start; gap: 0; padding-block: 4px 12px; }
  .site-menu li { border-top: 1px solid rgb(255 255 255 / 0.28); }
  .site-menu a { display: flex; min-height: 50px; font-size: 18px; border-bottom: 0; }
  .site-menu a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 5px; }
  .header-phone { font-size: 18px; }
}
@media (max-width: 359px) { .header-phone { font-size: 16px; } }

/* Хлебные крошки */
.breadcrumbs { padding-block: 12px 0; font-size: 15px; color: var(--color-text-muted); }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 0 8px; margin: 0; padding: 0; list-style: none; }
.breadcrumbs li { display: inline-flex; align-items: center; min-height: 44px; }
.breadcrumbs a { display: inline-flex; align-items: center; min-height: 44px; color: var(--color-text-muted); text-decoration: none; }
.breadcrumbs a:hover { color: var(--color-accent-dark); text-decoration: underline; }
.crumb-sep { color: var(--color-border-strong); }

/* Подвал: почти чёрный, знак красный */
.site-footer { background: var(--color-dark); color: var(--color-on-dark); padding-block: 56px 28px; }
.site-footer :focus-visible { outline-color: var(--color-focus-on-tone); }
.footer-inner { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 2fr) auto; gap: 32px 48px; align-items: start; }
.footer-brand { display: grid; gap: 16px; }
.footer-name { display: flex; align-items: center; gap: 14px; margin: 0; font-family: var(--font-heading); font-size: 20px; font-weight: 700; line-height: 1.25; }
.footer-name::before { content: ""; flex: none; width: 34px; height: 41px; background: var(--color-accent); clip-path: polygon(50.2% 0, 100% 27.1%, 100% 59.5%, 78.3% 70.8%, 78.3% 39.7%, 50.2% 25.3%, 11.1% 45.3%, 81.4% 85.5%, 50.2% 100%, 0 71.1%, 0 27.3%); }
.footer-name a { color: inherit; text-decoration: none; }
.footer-phone { margin: 0; font-family: var(--font-numeric); font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums; }
.footer-phone a { display: inline-flex; align-items: center; min-height: 44px; color: var(--color-on-dark); text-decoration: none; white-space: nowrap; }
.footer-phone a:hover { text-decoration: underline; color: var(--color-on-dark); }
.footer-menu ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; margin: 0; padding: 0; list-style: none; }
.footer-menu a, .footer-menu .wp-block-navigation-item__content { display: inline-flex; align-items: center; min-height: 44px; color: var(--color-on-dark); text-decoration: none; }
.footer-menu a:hover, .footer-menu a[aria-current="page"] { color: var(--color-on-dark); text-decoration: underline; }
.site-footer .wp-block-button__link { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-on-accent); }
.site-footer .wp-block-button__link:hover { background: var(--color-accent-dark); border-color: var(--color-accent-dark); }
.footer-base { grid-column: 1 / -1; padding-top: 20px; border-top: 1px solid rgb(255 255 255 / 0.16); }
.footer-bottom { margin: 0; font-size: 15px; color: var(--color-on-dark-muted); }
@media (max-width: 899px) {
  .site-footer { padding-block: 44px 24px; }
  .footer-inner { grid-template-columns: minmax(0, 1fr); gap: 24px; }
}
@media (max-width: 479px) { .footer-menu ul { grid-template-columns: minmax(0, 1fr); } }

/* Окно заказа */
.order-dialog { width: min(480px, calc(100vw - 32px)); padding: 0; border-radius: 10px; background: var(--color-background); color: var(--color-text); overflow: hidden; }
.order-dialog::backdrop { background: rgb(20 21 25 / 0.72); }
.dialog-inner { display: grid; }
.dialog-head { background: var(--color-accent); color: var(--color-on-accent); padding: 28px 72px 24px 28px; }
.dialog-head :focus-visible { outline-color: var(--color-focus-on-tone); }
.dialog-title { margin: 0; font-family: var(--font-heading); font-size: 28px; font-weight: 700; line-height: 1.15; }
.dialog-close { display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 8px; background: transparent; color: var(--color-on-accent); font-size: 32px; line-height: 1; }
.dialog-close:hover { background: rgb(255 255 255 / 0.18); }
.dialog-body { padding: 24px 28px 28px; }

/* Форма */
.order-form { display: grid; gap: 18px; }
.order-form .field { display: grid; gap: 8px; margin: 0; }
.order-form .field label { font-weight: 600; }
.order-form input[type="tel"], .order-form textarea { width: 100%; min-height: 56px; padding: 12px 16px; border: 2px solid var(--color-border-strong); border-radius: 8px; background: var(--color-background); color: var(--color-text); font-family: var(--font-body); font-size: 20px; font-variant-numeric: tabular-nums; }
.order-form input[type="tel"]:focus-visible, .order-form textarea:focus-visible { border-color: var(--color-text); outline: 3px solid var(--color-focus); outline-offset: 2px; }
.order-form input[type="tel"][aria-invalid="true"], .order-form textarea[aria-invalid="true"] { border-color: var(--color-error); }
.consent { margin: 0; font-size: 15px; line-height: 1.45; color: var(--color-text-muted); }
.consent label { flex: 1 1 200px; min-height: 22px; cursor: pointer; }
.consent input { accent-color: var(--color-accent); cursor: pointer; }
.consent-doc { color: var(--color-accent-dark); }
.form-error { margin: 0; padding: 10px 14px; border-left: 4px solid var(--color-error); background: var(--color-error-bg); color: var(--color-error); font-size: 16px; font-weight: 600; }
.form-result { margin: 0; padding: 12px 14px; border-left: 4px solid var(--color-text); background: var(--color-surface); font-size: 16px; }
.form-result a { color: var(--color-text); font-weight: 700; white-space: nowrap; }
.order-form button[type="submit"] { width: 100%; }
.section.request-form { padding-block: 8px clamp(56px, 7vw, 96px); }
.request-form .order-form { max-width: 560px; padding: clamp(20px, 4vw, 32px); border-top: 6px solid var(--color-accent); border-radius: 8px; background: var(--color-surface); }

/* Нижняя панель на телефоне */
.bottom-bar { background: var(--color-background); border-top: 1px solid var(--color-border); }
.bottom-bar .button { min-height: 52px; padding: 10px 12px; font-size: 18px; }

/* Карточки дочерних страниц */
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; }
.card { position: relative; display: grid; grid-template-rows: auto 1fr; gap: 12px; align-content: start; padding: 28px 24px 32px; border-top: 6px solid var(--color-accent); border-radius: 4px; background: var(--color-surface); transition: background-color 0.15s, color 0.15s; }
.card-title { margin: 0; font-size: clamp(21px, 1.9vw, 26px); }
.card-title a { color: var(--color-text); text-decoration: none; }
.card-title a::before { content: ""; position: absolute; inset: 0; }
.card-title a::after { content: ""; display: inline-block; width: 10px; height: 10px; margin-left: 10px; border-top: 3px solid var(--color-accent); border-right: 3px solid var(--color-accent); transform: translateY(-2px) rotate(45deg); }
.card p { margin: 0; color: var(--color-text-muted); }
.card:hover { background: var(--color-accent); color: var(--color-on-accent); }
.card:hover .card-title a, .card:hover p { color: var(--color-on-accent); }
.card:hover .card-title a::after { border-color: var(--color-on-accent); }
.card:focus-within { outline: 3px solid var(--color-focus); outline-offset: 3px; }
.card-title a:focus-visible { outline: none; }

/* Отзывы */
.reviews-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px; }
.review { display: grid; gap: 16px; align-content: start; margin: 0; padding: 28px 28px 26px; border: 0; border-left: 6px solid var(--color-accent); border-radius: 4px; background: var(--color-surface); color: var(--color-text); }
.review p { margin: 0; font-size: 19px; line-height: 1.5; }
.review cite { display: block; font-style: normal; font-size: 15px; color: var(--color-text-muted); }
.review cite strong { display: inline; font-family: var(--font-heading); font-size: 17px; color: var(--color-text); }
@media (max-width: 599px) { .reviews-list { grid-template-columns: minmax(0, 1fr); } .review p { font-size: 18px; } }

/* Полоса фактов */
.stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px 32px; }
.stat { display: grid; gap: 8px; align-content: start; padding: 4px 0 4px 20px; border-left: 4px solid var(--color-accent); }
.stat-value { margin: 0; font-family: var(--font-numeric); font-size: clamp(30px, 3.4vw, 46px); font-weight: 700; line-height: 1.05; font-variant-numeric: tabular-nums; }
.stat-label { margin: 0; font-size: 16px; line-height: 1.4; color: var(--color-text-muted); }
.tone-red .stat { border-left-color: var(--color-on-accent); }
.tone-red .stat-label { color: var(--color-on-accent-muted); }
@media (max-width: 999px) { .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 379px) { .stats { grid-template-columns: minmax(0, 1fr); } }

/* Калькулятор */
.calc { display: grid; gap: 20px; padding: clamp(20px, 4vw, 40px); border-top: 6px solid var(--color-accent); border-radius: 8px; background: var(--color-surface); }
.calc-title { margin: 0; font-family: var(--font-heading); font-size: 24px; font-weight: 700; line-height: 1.2; }
.calc .field { display: grid; gap: 8px; margin: 0; }
.calc-quantity { width: 100%; max-width: 260px; padding: 10px 14px; border: 2px solid var(--color-border-strong); border-radius: 8px; background: var(--color-background); color: var(--color-text); font-family: var(--font-numeric); font-size: 20px; font-variant-numeric: tabular-nums; }
.calc-options { display: grid; gap: 8px; }
.calc-option { padding: 10px 14px; border: 2px solid var(--color-border); border-radius: 8px; background: var(--color-background); }
.calc-option:has(input:checked) { border-color: var(--color-accent); }
.calc-option input { accent-color: var(--color-accent); }
.calc-price { margin-left: auto; font-family: var(--font-numeric); font-weight: 700; font-variant-numeric: tabular-nums; }
.calc-result { margin: 0; font-family: var(--font-heading); font-size: clamp(28px, 3vw, 40px); font-weight: 700; line-height: 1.1; }
.calc-result output { color: var(--color-accent-dark); font-variant-numeric: tabular-nums; }
.calc-note { margin: 0; font-size: 15px; color: var(--color-text-muted); }

/* Таблицы */
.wp-block-table { margin: 0; overflow-x: auto; }
.wp-block-table table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.wp-block-table th, .wp-block-table td { padding: 12px 16px 12px 0; border-bottom: 1px solid var(--color-border); text-align: left; vertical-align: top; }
.wp-block-table thead th { border-bottom: 2px solid var(--color-text); font-family: var(--font-heading); font-weight: 700; }

/* Переходы */
.related-links, .page-links { display: grid; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--color-border); max-width: none; }
.related-links li, .page-links li { border-bottom: 1px solid var(--color-border); }
.related-links a, .page-links a { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 56px; padding-block: 12px; color: var(--color-text); font-weight: 600; font-size: 19px; text-decoration: none; }
.related-links a::after, .page-links a::after { content: ""; flex: none; width: 10px; height: 10px; margin-right: 6px; border-top: 3px solid var(--color-accent); border-right: 3px solid var(--color-accent); transform: rotate(45deg); }
.related-links a:hover, .page-links a:hover { color: var(--color-accent-dark); }
.tone-red .related-links, .tone-red .page-links, .tone-red .related-links li, .tone-red .page-links li { border-color: rgb(255 255 255 / 0.32); }
.tone-red .related-links a::after, .tone-red .page-links a::after { border-color: var(--color-on-accent); }

@media (max-width: 599px) { body { font-size: 17px; } .button, .wp-block-button__link { width: 100%; padding-inline: 20px; } .wp-block-buttons > .wp-block-button { flex: 1 1 100%; } .bottom-bar .button { width: auto; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; } }
/* template: hero */
.t-hero { position: relative; overflow: hidden; display: grid; align-items: center; min-height: min(78vh, 720px); padding-block: clamp(56px, 8vw, 104px); background: var(--color-accent); color: var(--color-on-accent); }
.t-hero .copy { position: relative; z-index: 1; display: grid; gap: 24px; max-width: 640px; background: transparent; }
.t-hero .copy h1 { font-size: clamp(38px, 5vw, 68px); }
.t-hero .copy p { margin: 0; font-size: clamp(19px, 1.6vw, 23px); line-height: 1.4; }
.t-hero .copy p + p { font-family: var(--font-heading); font-size: clamp(30px, 3.4vw, 48px); font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; }
.t-hero .copy .wp-block-buttons { margin-top: 8px; }
.t-hero .copy .wp-block-button__link { min-width: 280px; min-height: 64px; font-size: 21px; }
.t-hero .hero-art { position: absolute; top: 0; right: 0; bottom: 0; width: 44%; background: var(--color-background); clip-path: polygon(30% 0, 100% 0, 100% 100%, 0 100%); }
.t-hero .hero-art .hex-mark { position: absolute; top: 50%; left: 26%; width: 88%; transform: translateY(-50%); }
@media (max-width: 1199px) { .t-hero .copy { max-width: 54%; } }
@media (max-width: 899px) { .t-hero { min-height: 0; } .t-hero .copy { max-width: none; } .t-hero .hero-art { display: none; } }
@media (max-width: 599px) { .t-hero .copy .wp-block-button__link { min-width: 0; } }
/* 1440: красное поле с текстом слева, белое диагональное поле с крупным обрезанным знаком справа. 768: только красное поле, текст во всю ширину. 390: то же, кнопка во всю ширину. */
/* p_home / home-services */
#home-services .head h2 { margin: 0; }
#home-services .group { display: grid; gap: 20px; margin-top: 40px; }
#home-services .build { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#home-services .grow { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 56px; }
#home-services .group > p { grid-column: 1 / -1; margin: 0; font-family: var(--font-heading); font-size: clamp(22px, 2.2vw, 28px); font-weight: 700; line-height: 1.2; color: var(--color-accent-dark); }
#home-services .svc { display: grid; grid-template-rows: subgrid; grid-row: span 5; row-gap: 12px; padding: 28px 24px; border-top: 6px solid var(--color-accent); border-radius: 4px; background: var(--color-surface); }
#home-services .svc h3 { margin: 0; }
#home-services .svc p { margin: 0; }
#home-services .svc p:first-of-type { font-family: var(--font-numeric); font-size: 26px; font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; }
#home-services .svc p:nth-of-type(2) { color: var(--color-text-muted); }
#home-services .svc .wp-block-list { margin: 4px 0 0; max-width: none; gap: 6px; font-size: 17px; line-height: 1.4; }
#home-services .svc .wp-block-buttons { grid-row: -2 / -1; align-self: end; margin: 8px 0 0; }
@media (max-width: 1099px) { #home-services .grow { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { #home-services .build, #home-services .grow { grid-template-columns: minmax(0, 1fr); } #home-services .grow { margin-top: 44px; } }
/* 1440: сайты двумя карточками, продвижение тремя; 768: по две в ряд; 390: одной колонкой. Цены, сроки, состав и кнопки в ряду стоят на одних линиях. */
/* p_home / home-cases */
#home-cases { background: var(--color-surface); }
#home-cases .head h2 { margin: 0; }
#home-cases .list { display: grid; gap: 56px; margin-top: 40px; }
#home-cases .case { display: grid; gap: 14px; align-items: start; min-width: 0; padding-top: 28px; border-top: 4px solid var(--color-accent); }
#home-cases .case h3 { margin: 0; }
#home-cases .case p { margin: 0; font-family: var(--font-numeric); font-size: clamp(24px, 2.4vw, 32px); font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; }
#home-cases .case figure { justify-self: start; max-width: 100%; margin: 10px 0 0; overflow-x: auto; border: 1px solid var(--color-border); border-radius: 6px; background: var(--color-background); }
#home-cases .case img { display: block; width: auto; max-width: none; height: auto; border-radius: 0; }
#home-cases .act { margin-top: 40px; }
#home-cases .act .wp-block-buttons { margin: 0; }
/* Скриншоты Метрики в исходном размере на всех ширинах; шире экрана - прокрутка внутри рамки. */
/* p_home / home-works */
#home-works .head h2 { margin: 0; }
#home-works .list { margin-top: 40px; }
#home-works .work { display: grid; gap: 16px; align-content: start; min-width: 0; }
#home-works .work h3 { margin: 0; }
#home-works .work figure { width: 100%; max-width: 1440px; margin: 0; overflow: hidden; border: 1px solid var(--color-border); border-radius: 6px; background: var(--color-background); }
#home-works .work figure + figure { display: none; max-width: 390px; }
#home-works .work img { display: block; width: 100%; height: auto; border-radius: 0; }
#home-works .act { margin-top: 40px; }
#home-works .act .wp-block-buttons { margin: 0; }
@media (max-width: 1099px) { #home-works .work figure { display: none; } #home-works .work figure + figure { display: block; } }
/* Слайдер (класс slider): один лендинг за раз. 1440: десктопный первый экран по ширине слайда. До 1099: мобильный первый экран того же лендинга (390 px), текст на нём читается без прокрутки внутри слайда. */
/* p_home / home-why */
#home-why .head h2 { margin: 0; }
#home-why .grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 32px; margin-top: 40px; }
#home-why .pt { display: grid; gap: 10px; align-content: start; padding: 4px 0 4px 22px; border-left: 6px solid var(--color-accent); }
#home-why .pt h3 { margin: 0; }
#home-why .pt p { margin: 0; color: var(--color-text-muted); }
@media (max-width: 599px) { #home-why .grid { grid-template-columns: minmax(0, 1fr); gap: 28px; } }
/* 1440 и 768: четыре пункта сеткой два на два; 390: одной колонкой. Под каждым пунктом - услуга, к которой он относится. */
/* p_home / home-process */
#home-process .wrap { display: grid; gap: 32px; }
#home-process .wrap h2 { margin: 0; }
#home-process .wp-block-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; max-width: none; counter-reset: step; }
#home-process .wp-block-list li { counter-increment: step; position: relative; padding-top: 76px; border-top: 4px solid var(--color-text); font-family: var(--font-heading); font-size: 22px; font-weight: 700; line-height: 1.25; }
#home-process .wp-block-list li::before { content: counter(step, decimal-leading-zero); position: absolute; top: 16px; left: 0; font-family: var(--font-numeric); font-size: 40px; line-height: 1; color: var(--color-accent); font-variant-numeric: tabular-nums; }
@media (max-width: 767px) { #home-process .wp-block-list { grid-template-columns: minmax(0, 1fr); } #home-process .wp-block-list li { padding-top: 64px; font-size: 20px; } }
/* p_home / home-faq */
#home-faq .grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 32px 64px; align-items: start; }
#home-faq .side h2 { margin: 0; }
#home-faq .list { display: grid; border-top: 4px solid var(--color-text); }
#home-faq .qa { display: grid; gap: 12px; padding: 28px 0; border-bottom: 1px solid var(--color-border); }
#home-faq .qa h3 { margin: 0; }
#home-faq .qa p { margin: 0; font-size: 19px; }
@media (max-width: 899px) { #home-faq .grid { grid-template-columns: minmax(0, 1fr); gap: 28px; } #home-faq .qa { padding: 24px 0; } #home-faq .qa p { font-size: 18px; } }
/* 1440: заголовок слева, вопросы справа между линиями; 768 и 390: заголовок над вопросами. */
/* p_home / home-contact */
#home-contact { background: var(--color-accent); color: var(--color-on-accent); overflow: hidden; }
#home-contact .inner { display: grid; grid-template-columns: minmax(0, 1fr) 180px; grid-template-areas: "text mark" "actions mark"; gap: 28px 48px; align-items: start; }
#home-contact .text { grid-area: text; display: grid; gap: 12px; }
#home-contact .text h2 { margin: 0; }
#home-contact .text p { margin: 0; font-size: 20px; color: var(--color-on-accent-muted); }
#home-contact .actions { grid-area: actions; }
#home-contact .actions .wp-block-buttons { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }
#home-contact .mark { grid-area: mark; align-self: center; width: 180px; }
@media (max-width: 767px) { #home-contact .inner { grid-template-columns: minmax(0, 1fr); grid-template-areas: "text" "actions"; } #home-contact .mark { display: none; } }
/* p_landing / landing-price */
#landing-price .head h2 { margin: 0; }
#landing-price .body .wp-block-list { list-style: none; margin: 40px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; max-width: none; counter-reset: item; }
#landing-price .body li { counter-increment: item; display: grid; gap: 12px; align-content: start; min-height: 128px; padding: 22px 20px; border-top: 6px solid var(--color-accent); border-radius: 4px; background: var(--color-surface); font-family: var(--font-heading); font-size: 21px; font-weight: 700; line-height: 1.2; }
#landing-price .body li::before { content: counter(item, decimal-leading-zero); font-family: var(--font-numeric); font-size: 16px; color: var(--color-accent-dark); font-variant-numeric: tabular-nums; }
@media (max-width: 599px) { #landing-price .body .wp-block-list { grid-template-columns: minmax(0, 1fr); } #landing-price .body li { min-height: 0; } }
/* p_landing / landing-why */
#landing-why { background: var(--color-surface); }
#landing-why .head h2 { margin: 0; }
#landing-why .grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 40px; }
#landing-why .pt { display: grid; gap: 12px; align-content: start; padding: 28px 24px 32px; border-top: 6px solid var(--color-accent); border-radius: 4px; background: var(--color-background); }
#landing-why .pt h3 { margin: 0; }
#landing-why .pt p { margin: 0; color: var(--color-text-muted); }
@media (max-width: 999px) { #landing-why .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { #landing-why .grid { grid-template-columns: minmax(0, 1fr); gap: 16px; } }
/* 1440: пять пунктов белыми карточками на сером, три и два в ряд; 768: по два; 390: одной колонкой. */
/* p_landing / landing-works */
#landing-works .head h2 { margin: 0; }
#landing-works .list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 390px)); justify-content: start; gap: 48px 32px; margin-top: 40px; }
#landing-works .work { display: grid; grid-row: span 2; grid-template-rows: subgrid; row-gap: 16px; min-width: 0; }
#landing-works .work h3 { align-self: end; margin: 0; }
#landing-works .work figure { margin: 0; width: 100%; max-width: 390px; aspect-ratio: 390 / 640; overflow: hidden; border: 1px solid var(--color-border); border-radius: 6px; }
#landing-works .work img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; border-radius: 0; }
/* p_landing / landing-when */
#landing-when { background: var(--color-accent); color: var(--color-on-accent); }
#landing-when .wrap { display: grid; gap: 40px; }
#landing-when .wrap h2 { margin: 0; }
#landing-when .wp-block-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; max-width: none; }
#landing-when li { padding-top: 20px; border-top: 4px solid var(--color-on-accent); font-family: var(--font-heading); font-size: clamp(22px, 2.2vw, 28px); font-weight: 700; line-height: 1.2; }
@media (max-width: 899px) { #landing-when .wp-block-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 479px) { #landing-when .wp-block-list { grid-template-columns: minmax(0, 1fr); gap: 16px; } }
/* 1440: красная полоса, четыре случая в ряд под белыми линиями; 768: два в ряд; 390: столбиком. */
/* p_landing / landing-process */
#landing-process .head h2 { margin: 0; }
#landing-process .days { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 40px; }
#landing-process .day { display: grid; gap: 16px; align-content: start; padding: 28px 28px 32px; border-top: 6px solid var(--color-accent); border-radius: 4px; background: var(--color-surface); }
#landing-process .day h3 { margin: 0; color: var(--color-accent-dark); }
#landing-process .day .wp-block-list { margin: 0; padding-left: 1.25em; font-size: 20px; font-weight: 600; line-height: 1.35; }
#landing-process .note { margin-top: 28px; }
#landing-process .note p { margin: 0; font-size: 20px; }
@media (max-width: 767px) { #landing-process .days { grid-template-columns: minmax(0, 1fr); } #landing-process .day .wp-block-list { font-size: 18px; } }
/* p_landing / landing-next */
#landing-next .head { display: grid; gap: 16px; }
#landing-next .head h2 { margin: 0; }
#landing-next .head p { margin: 0; font-size: 20px; }
#landing-next .grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 40px; }
#landing-next .opt { display: grid; grid-template-rows: subgrid; grid-row: span 3; row-gap: 14px; padding: 28px 28px 32px; border: 2px solid var(--color-border); border-top: 6px solid var(--color-accent); border-radius: 6px; background: var(--color-background); }
#landing-next .opt h3 { margin: 0; }
#landing-next .opt p { margin: 0; }
#landing-next .opt .wp-block-buttons { align-self: end; margin: 8px 0 0; }
@media (max-width: 767px) { #landing-next .grid { grid-template-columns: minmax(0, 1fr); } }
/* 1440 и 768: две карточки в ряд, тексты и кнопки на одних линиях; 390: одной колонкой. */
/* p_landing / landing-faq */
#landing-faq .grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 32px 64px; align-items: start; }
#landing-faq .side h2 { margin: 0; }
#landing-faq .list { display: grid; border-top: 4px solid var(--color-text); }
#landing-faq .qa { display: grid; gap: 12px; padding: 28px 0; border-bottom: 1px solid var(--color-border); }
#landing-faq .qa h3 { margin: 0; }
#landing-faq .qa p { margin: 0; font-size: 19px; }
@media (max-width: 899px) { #landing-faq .grid { grid-template-columns: minmax(0, 1fr); gap: 28px; } #landing-faq .qa { padding: 24px 0; } #landing-faq .qa p { font-size: 18px; } }
/* 1440: заголовок слева, вопросы справа между линиями; 768 и 390: заголовок над вопросами. */
/* p_landing / landing-contact */
#landing-contact { background: var(--color-accent); color: var(--color-on-accent); }
#landing-contact .inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 28px 48px; }
#landing-contact .text h2 { margin: 0; }
#landing-contact .actions .wp-block-buttons { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }
@media (max-width: 767px) { #landing-contact .inner { display: grid; justify-content: stretch; } }
/* p_seo_site / seosite-price */
#seosite-price { background: var(--color-accent); color: var(--color-on-accent); }
#seosite-price .grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 32px 64px; align-items: start; }
#seosite-price .side { display: grid; gap: 20px; }
#seosite-price .side h2 { margin: 0; }
#seosite-price .side p { margin: 0; font-family: var(--font-numeric); font-size: clamp(40px, 5vw, 64px); font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
#seosite-price .main .wp-block-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; max-width: none; }
#seosite-price .main li { position: relative; padding: 16px 0 16px 30px; border-bottom: 1px solid rgb(255 255 255 / 0.32); font-size: 20px; font-weight: 600; line-height: 1.35; }
#seosite-price .main li:first-child { border-top: 1px solid rgb(255 255 255 / 0.32); }
#seosite-price .main li::before { content: ""; position: absolute; left: 2px; top: 50%; width: 11px; height: 11px; background: var(--color-on-accent); transform: translateY(-50%) rotate(45deg); }
@media (max-width: 899px) { #seosite-price .grid { grid-template-columns: minmax(0, 1fr); } #seosite-price .main li { font-size: 18px; } }
/* p_seo_site / seosite-why */
#seosite-why .grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: 32px 64px; align-items: start; }
#seosite-why .side h2 { margin: 0; }
#seosite-why .list { display: grid; border-top: 4px solid var(--color-accent); }
#seosite-why .pt { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 32px; align-items: start; padding: 24px 0; border-bottom: 1px solid var(--color-border); }
#seosite-why .pt h3 { margin: 0; }
#seosite-why .pt p { margin: 0; color: var(--color-text-muted); }
@media (max-width: 899px) { #seosite-why .grid { grid-template-columns: minmax(0, 1fr); gap: 28px; } #seosite-why .pt { grid-template-columns: minmax(0, 1fr); } }
/* 1440: заголовок слева, пункты справа строками между линиями, пояснение рядом с пунктом; 768 и 390: заголовок сверху, пояснение под пунктом. */
/* p_seo_site / seosite-choice */
#seosite-choice .head h2 { margin: 0; }
#seosite-choice .grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 40px; }
#seosite-choice .col { display: grid; grid-template-rows: subgrid; grid-row: span 3; row-gap: 14px; padding: 32px 28px; border: 2px solid var(--color-border); border-radius: 6px; background: var(--color-background); }
#seosite-choice .col:last-child { border-color: var(--color-accent); border-top-width: 6px; }
#seosite-choice .col h3 { margin: 0; }
#seosite-choice .col p { margin: 0; }
#seosite-choice .col .wp-block-buttons { align-self: end; margin: 8px 0 0; }
@media (max-width: 767px) { #seosite-choice .grid { grid-template-columns: minmax(0, 1fr); } }
/* p_seo_site / seosite-process */
#seosite-process { background: var(--color-surface); }
#seosite-process .head h2 { margin: 0; }
#seosite-process .days { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 40px; }
#seosite-process .day { display: grid; gap: 16px; align-content: start; padding: 24px 24px 28px; border-top: 6px solid var(--color-accent); border-radius: 4px; background: var(--color-background); }
#seosite-process .day h3 { margin: 0; color: var(--color-accent-dark); }
#seosite-process .day .wp-block-list { margin: 0; padding-left: 1.25em; font-size: 19px; font-weight: 600; line-height: 1.35; }
#seosite-process .note { display: grid; gap: 12px; margin-top: 32px; }
#seosite-process .note p { margin: 0; font-size: 20px; }
@media (max-width: 899px) { #seosite-process .days { grid-template-columns: minmax(0, 1fr); } #seosite-process .day .wp-block-list { font-size: 18px; } }
/* p_seo_site / seosite-result */
#seosite-result .head h2 { margin: 0; }
#seosite-result .grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 48px; margin-top: 40px; }
#seosite-result .res { display: grid; gap: 12px; align-content: start; padding: 4px 0 4px 24px; border-left: 6px solid var(--color-accent); }
#seosite-result .res h3 { margin: 0; }
#seosite-result .res p { margin: 0; font-size: 20px; }
@media (max-width: 767px) { #seosite-result .grid { grid-template-columns: minmax(0, 1fr); gap: 28px; } #seosite-result .res p { font-size: 18px; } }
/* 1440 и 768: два пункта в ряд с красной левой кромкой; 390: столбиком. */
/* p_seo_site / seosite-faq */
#seosite-faq .head h2 { margin: 0; }
#seosite-faq .grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; margin-top: 32px; }
#seosite-faq .qa { display: grid; gap: 12px; align-content: start; padding: 28px 0; border-top: 2px solid var(--color-text); }
#seosite-faq .qa h3 { margin: 0; }
#seosite-faq .qa p { margin: 0; font-size: 19px; }
@media (max-width: 767px) { #seosite-faq .grid { grid-template-columns: minmax(0, 1fr); } #seosite-faq .qa { padding: 24px 0; } #seosite-faq .qa p { font-size: 18px; } }
/* 1440 и 768+: вопросы в две колонки под линиями; 390: одной колонкой. */
/* p_seo_site / seosite-next */
#seosite-next .row { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 24px 48px; padding-top: 32px; border-top: 4px solid var(--color-text); }
#seosite-next .text { display: grid; gap: 14px; flex: 1 1 480px; }
#seosite-next .text h2 { margin: 0; }
#seosite-next .text p { margin: 0; font-size: 20px; }
#seosite-next .act .wp-block-buttons { margin: 0; }
@media (max-width: 599px) { #seosite-next .act { width: 100%; } }
/* p_seo_site / seosite-contact */
#seosite-contact { background: var(--color-dark); color: var(--color-on-dark); }
#seosite-contact .inner { display: grid; gap: 28px; }
#seosite-contact .text h2 { margin: 0; }
#seosite-contact .actions .wp-block-buttons { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }
/* p_seo / seo-price */
#seo-price { background: var(--color-accent); color: var(--color-on-accent); }
#seo-price .wrap { display: grid; gap: 40px; }
#seo-price .top { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 16px 48px; }
#seo-price .top h2 { margin: 0; max-width: 18ch; }
#seo-price .top p { margin: 0; font-family: var(--font-numeric); font-size: clamp(34px, 4.6vw, 60px); font-weight: 700; line-height: 1.05; font-variant-numeric: tabular-nums; }
#seo-price .items .wp-block-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; max-width: none; counter-reset: i; }
#seo-price .items li { counter-increment: i; display: grid; gap: 12px; align-content: start; padding-top: 20px; border-top: 4px solid var(--color-on-accent); font-family: var(--font-heading); font-size: 22px; font-weight: 700; line-height: 1.25; }
#seo-price .items li::before { content: counter(i, decimal-leading-zero); font-family: var(--font-numeric); font-size: 16px; color: var(--color-on-accent-muted); font-variant-numeric: tabular-nums; }
#seo-price .terms { padding-top: 24px; border-top: 1px solid rgb(255 255 255 / 0.32); }
#seo-price .terms p { margin: 0; font-size: 20px; color: var(--color-on-accent-muted); }
@media (max-width: 1099px) { #seo-price .items .wp-block-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { #seo-price .items .wp-block-list { grid-template-columns: minmax(0, 1fr); } #seo-price .items li { font-size: 20px; } #seo-price .terms p { font-size: 18px; } }
/* 1440: четыре группы работ в ряд под белыми линиями; 768: по две; 390: столбиком. */
/* p_seo / seo-cases */
#seo-cases .head h2 { margin: 0; }
#seo-cases .list { display: grid; gap: 56px; margin-top: 40px; }
#seo-cases .case { display: grid; gap: 14px; align-items: start; min-width: 0; padding-top: 28px; border-top: 4px solid var(--color-accent); }
#seo-cases .case h3 { margin: 0; }
#seo-cases .case p { margin: 0; font-family: var(--font-numeric); font-size: clamp(24px, 2.4vw, 32px); font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; }
#seo-cases .case figure { justify-self: start; max-width: 100%; margin: 10px 0 0; overflow-x: auto; border: 1px solid var(--color-border); border-radius: 6px; }
#seo-cases .case img { display: block; width: auto; max-width: none; height: auto; border-radius: 0; }
/* p_seo / seo-why */
#seo-why { background: var(--color-surface); }
#seo-why .head h2 { margin: 0; }
#seo-why .grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 32px 24px; margin-top: 40px; }
#seo-why .pt { display: grid; gap: 10px; align-content: start; padding-top: 20px; border-top: 4px solid var(--color-accent); }
#seo-why .pt h3 { margin: 0; }
#seo-why .pt p { margin: 0; color: var(--color-text-muted); }
@media (max-width: 1099px) { #seo-why .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { #seo-why .grid { grid-template-columns: minmax(0, 1fr); gap: 24px; } }
/* 1440: пять пунктов в ряд под красными линиями на сером; 768: по два; 390: столбиком. */
/* p_seo / seo-start */
#seo-start .head h2 { margin: 0; }
#seo-start .steps { margin-top: 40px; }
#seo-start .steps .wp-block-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; max-width: none; counter-reset: step; }
#seo-start .steps li { counter-increment: step; position: relative; padding-top: 72px; border-top: 4px solid var(--color-text); font-family: var(--font-heading); font-size: 22px; font-weight: 700; line-height: 1.25; }
#seo-start .steps li::before { content: counter(step, decimal-leading-zero); position: absolute; top: 16px; left: 0; font-family: var(--font-numeric); font-size: 40px; line-height: 1; color: var(--color-accent); font-variant-numeric: tabular-nums; }
#seo-start .grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 48px; }
#seo-start .tile { display: grid; gap: 14px; align-content: start; padding: 32px 28px; border-top: 6px solid var(--color-accent); border-radius: 4px; background: var(--color-surface); }
#seo-start .tile h3 { margin: 0; }
#seo-start .tile p { margin: 0; font-family: var(--font-heading); font-size: clamp(22px, 2.2vw, 28px); font-weight: 700; line-height: 1.25; }
@media (max-width: 767px) { #seo-start .steps .wp-block-list { grid-template-columns: minmax(0, 1fr); } #seo-start .steps li { padding-top: 64px; font-size: 20px; } #seo-start .grid { grid-template-columns: minmax(0, 1fr); } }
/* p_seo / seo-audit */
#seo-audit .row { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 24px 48px; padding-top: 32px; border-top: 4px solid var(--color-accent); }
#seo-audit .text { display: grid; gap: 14px; flex: 1 1 480px; }
#seo-audit .text h2 { margin: 0; }
#seo-audit .text p { margin: 0; font-size: 20px; }
#seo-audit .price p { margin: 0; font-family: var(--font-numeric); font-size: clamp(34px, 4.6vw, 60px); font-weight: 700; line-height: 1.05; font-variant-numeric: tabular-nums; white-space: nowrap; }
/* p_seo / seo-no-site */
#seo-no-site { background: var(--color-surface); }
#seo-no-site .row { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 24px 48px; }
#seo-no-site .text { display: grid; gap: 14px; flex: 1 1 480px; }
#seo-no-site .text h2 { margin: 0; }
#seo-no-site .text p { margin: 0; font-size: 20px; }
#seo-no-site .act .wp-block-buttons { margin: 0; }
@media (max-width: 599px) { #seo-no-site .act { width: 100%; } }
/* p_seo / seo-faq */
#seo-faq .grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 32px 64px; align-items: start; }
#seo-faq .side h2 { margin: 0; }
#seo-faq .list { display: grid; gap: 16px; }
#seo-faq .qa { display: grid; gap: 12px; padding: 24px 28px; border-left: 6px solid var(--color-accent); border-radius: 4px; background: var(--color-surface); }
#seo-faq .qa h3 { margin: 0; }
#seo-faq .qa p { margin: 0; font-size: 19px; }
@media (max-width: 899px) { #seo-faq .grid { grid-template-columns: minmax(0, 1fr); gap: 28px; } #seo-faq .qa { padding: 20px; } #seo-faq .qa p { font-size: 18px; } }
/* 1440: заголовок слева, вопросы справа серыми плашками с красной кромкой; 768 и 390: заголовок над плашками. */
/* p_seo / seo-contact */
#seo-contact { background: var(--color-dark); color: var(--color-on-dark); }
#seo-contact .inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 28px 48px; }
#seo-contact .text h2 { margin: 0; }
#seo-contact .actions .wp-block-buttons { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }
@media (max-width: 767px) { #seo-contact .inner { display: grid; justify-content: stretch; } }
/* p_direct / direct-formats */
#direct-formats { overflow-x: clip; }
#direct-formats .plans { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto auto 1fr; column-gap: 24px; row-gap: 0; margin-top: 40px; }
#direct-formats .plan { display: grid; grid-row: span 3; grid-template-rows: subgrid; row-gap: 16px; min-width: 0; padding: 32px 28px 36px; border-top: 6px solid var(--color-accent); border-radius: 4px; background: var(--color-surface); }
#direct-formats .plan h3 { margin: 0; }
#direct-formats .plan > p { margin: 0; font-family: var(--font-numeric); font-size: clamp(32px, 3.4vw, 46px); font-weight: 700; line-height: 1.05; font-variant-numeric: tabular-nums; }
#direct-formats .plan ul { margin: 0; align-self: start; }
@media (max-width: 767px) {
  #direct-formats .plans { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; row-gap: 20px; margin-top: 28px; }
  #direct-formats .plan { grid-row: auto; grid-template-rows: none; padding: 24px 20px 28px; }
}
/* 1440: две карточки в ряд, цены и списки на одной линии; 768: так же, уже; 390: карточки друг под другом, ничего не выходит за экран. */
/* p_direct / direct-why */
#direct-why { overflow-x: clip; }
#direct-why .head h2 { margin: 0; }
#direct-why .grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 24px; margin-top: 40px; }
#direct-why .pt { display: grid; gap: 10px; align-content: start; min-width: 0; padding: 4px 0 4px 20px; border-left: 6px solid var(--color-accent); }
#direct-why .pt h3 { margin: 0; }
#direct-why .pt p { margin: 0; color: var(--color-text-muted); }
@media (max-width: 1099px) { #direct-why .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { #direct-why .grid { grid-template-columns: minmax(0, 1fr); gap: 24px; margin-top: 28px; } }
/* 1440: четыре пункта в ряд; 768: два на два; 390: одной колонкой, ничего не выходит за экран. */
/* p_direct / direct-process */
#direct-process { overflow-x: clip; }
#direct-process .steps ol { counter-reset: step; list-style: none; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 24px; max-width: 100%; margin: 40px 0 0; padding: 0; }
#direct-process .steps li { counter-increment: step; display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; align-content: start; min-width: 0; padding-top: 20px; border-top: 4px solid var(--color-text); font-size: 19px; line-height: 1.45; }
#direct-process .steps li::before { content: counter(step, decimal-leading-zero); font-family: var(--font-numeric); font-size: 44px; font-weight: 700; line-height: 1; color: var(--color-accent); font-variant-numeric: tabular-nums; }
@media (max-width: 1199px) { #direct-process .steps ol { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 24px; } }
@media (max-width: 599px) { #direct-process .steps ol { grid-template-columns: minmax(0, 1fr); gap: 20px; margin-top: 28px; } #direct-process .steps li { font-size: 18px; } #direct-process .steps li::before { font-size: 36px; } }
/* 1440: пять шагов в ряд; 768: три и два; 390: столбик, ничего не выходит за экран. */
/* p_direct / direct-landing */
#direct-landing { background: var(--color-surface); overflow-x: clip; }
#direct-landing .wrap { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 48px; align-items: center; }
#direct-landing .mark { width: 140px; }
#direct-landing .text { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; min-width: 0; }
#direct-landing .text p { margin: 0; font-size: 21px; }
@media (max-width: 599px) {
  #direct-landing .wrap { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  #direct-landing .mark { width: 64px; }
  #direct-landing .text p { font-size: 19px; }
}
/* 1440 и 768: знак слева, текст справа; 390: маленький знак над текстом, ничего не выходит за экран. */
/* p_direct / direct-faq */
#direct-faq .head h2 { margin: 0; }
#direct-faq .grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 40px; }
#direct-faq .qa { display: grid; gap: 14px; align-content: start; padding: 28px 24px 32px; border-top: 6px solid var(--color-accent); border-radius: 4px; background: var(--color-surface); }
#direct-faq .qa h3 { margin: 0; }
#direct-faq .qa p { margin: 0; font-size: 19px; }
@media (max-width: 899px) { #direct-faq .grid { grid-template-columns: minmax(0, 1fr); gap: 16px; margin-top: 28px; } #direct-faq .qa { padding: 22px 20px 24px; } #direct-faq .qa p { font-size: 18px; } }
/* 1440: три вопроса в ряд карточками; 768 и 390: столбиком. */
/* p_direct / direct-contact */
#direct-contact { background: var(--color-accent); color: var(--color-on-accent); overflow-x: clip; }
#direct-contact .wrap { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; justify-items: start; }
#direct-contact .wrap > * { min-width: 0; max-width: 100%; }
#direct-contact .wrap > p { margin: 0; font-size: 21px; }
#direct-contact .wp-block-buttons { display: flex; flex-wrap: wrap; gap: 16px; }
@media (max-width: 767px) {
  #direct-contact .wrap { justify-items: stretch; gap: 24px; }
  #direct-contact .wrap > p { font-size: 19px; }
  #direct-contact .wp-block-buttons { flex-direction: column; flex-wrap: nowrap; gap: 12px; width: 100%; }
  #direct-contact .wp-block-button { width: 100%; min-width: 0; }
  #direct-contact .wp-block-button__link { width: 100%; min-height: 56px; padding-inline: 20px; }
}
/* 1440: строка и кнопки в строку; 768 и 390: кнопки столбиком во всю ширину, ничего не выходит за экран. */
/* p_privacy / privacy-text */
#privacy-text { padding-block: 16px 20px; }
#privacy-text .doc { display: grid; gap: 14px; max-width: 760px; }
#privacy-text h2 { font-size: clamp(22px, 2.4vw, 30px); }
#privacy-text p { margin: 0; }
/* Узкая колонка текста на всех ширинах. */
/* p_privacy / privacy-data */
#privacy-data { padding-block: 20px; }
#privacy-data .doc { display: grid; gap: 14px; max-width: 760px; }
#privacy-data h2 { font-size: clamp(22px, 2.4vw, 30px); }
#privacy-data p, #privacy-data ul { margin: 0; }
/* p_privacy / privacy-purposes */
#privacy-purposes { padding-block: 20px; }
#privacy-purposes .doc { display: grid; gap: 14px; max-width: 760px; }
#privacy-purposes h2 { font-size: clamp(22px, 2.4vw, 30px); }
#privacy-purposes ul { margin: 0; }
/* p_privacy / privacy-grounds */
#privacy-grounds { padding-block: 20px; }
#privacy-grounds .doc { display: grid; gap: 14px; max-width: 760px; }
#privacy-grounds h2 { font-size: clamp(22px, 2.4vw, 30px); }
#privacy-grounds ul { margin: 0; }
/* p_privacy / privacy-processing */
#privacy-processing { padding-block: 20px; }
#privacy-processing .doc { display: grid; gap: 14px; max-width: 760px; }
#privacy-processing h2 { font-size: clamp(22px, 2.4vw, 30px); }
#privacy-processing p { margin: 0; }
/* p_privacy / privacy-retention */
#privacy-retention { padding-block: 20px; }
#privacy-retention .doc { display: grid; gap: 14px; max-width: 760px; }
#privacy-retention h2 { font-size: clamp(22px, 2.4vw, 30px); }
#privacy-retention ul { margin: 0; }
/* p_privacy / privacy-rights */
#privacy-rights { padding-block: 20px; }
#privacy-rights .doc { display: grid; gap: 14px; max-width: 760px; }
#privacy-rights h2 { font-size: clamp(22px, 2.4vw, 30px); }
#privacy-rights p, #privacy-rights ul { margin: 0; }
/* p_privacy / privacy-cookie */
#privacy-cookie { padding-block: 20px; }
#privacy-cookie .doc { display: grid; gap: 14px; max-width: 760px; }
#privacy-cookie h2 { font-size: clamp(22px, 2.4vw, 30px); }
#privacy-cookie p { margin: 0; }
/* p_privacy / privacy-changes */
#privacy-changes { padding-block: 20px clamp(56px, 7vw, 96px); }
#privacy-changes .doc { display: grid; gap: 14px; max-width: 760px; }
#privacy-changes h2 { font-size: clamp(22px, 2.4vw, 30px); }
#privacy-changes p { margin: 0; }
/* p_consent / consent-text */
#consent-text { padding-block: 16px clamp(56px, 7vw, 96px); }
#consent-text .doc { display: grid; gap: 16px; max-width: 760px; }
#consent-text p, #consent-text ul { margin: 0; }
/* Узкая колонка текста на всех ширинах. */