/* ==========================================================================
   ООО «СИР» — стилевая база (pixel-perfect rewrite)
   ========================================================================== */

/* ---------- 1. Tokens ---------- */
@font-face {
    font-family: 'Suisse Intl';
    src: url('../assets/fonts/SuisseIntl-Regular.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Suisse Intl';
    src: url('../assets/fonts/SuisseIntl-Book.otf') format('opentype');
    font-weight: 450;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Suisse Intl';
    src: url('../assets/fonts/SuisseIntl-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Suisse Intl';
    src: url('../assets/fonts/SuisseIntl-SemiBold.otf') format('opentype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Suisse Intl';
    src: url('../assets/fonts/SuisseIntl-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Suisse Intl';
    src: url('../assets/fonts/SuisseIntl-Black.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

:root {
    /* Colors */
    --color-bg:           #f2f2f2;
    --color-surface:      #ffffff;
    --color-card:         #e6e6e6;
    --color-line:         #d9d9d9;
    --color-mute:         #8c8c8c;
    --color-text-2:       #404040;
    --color-text:         #1a1a1a;
    --color-dark:         #201b26;
    --color-primary:      #6b3d99;
    --color-primary-hover:#582f80;
    --color-primary-soft: #d4c6e3;

    /* Typography */
    --font-sans: 'Suisse Intl', 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;

    --fs-meta:    13px;
    --fs-eyebrow: 14px;
    --fs-body:    16px;
    --fs-lg:      18px;
    --fs-xl:      20px;
    --fs-stat:    24px;
    --fs-h3:      24px;
    --fs-h2:      40px;
    --fs-h1:      48px;
    --fs-hero:    56px;

    --lh-tight:   1.05;
    --lh-snug:    1.15;
    --lh-base:    1.25;
    --lh-text:    1.5;

    /* Layout */
    --container:  1392px;
    --container-padding: 24px;

    /* Radius */
    --radius-sm:  4px;
    --radius:     6px;
    --radius-md:  8px;
    --radius-lg:  12px;
    --radius-pill: 1000px;

    /* Shadows */
    --shadow-card: 0 1px 2px rgba(0,0,0,0.06), 0 12px 32px rgba(0,0,0,0.08);
}

/* ---------- 2. Reset ---------- */
*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    margin: 0;
    background: var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-sans);
    font-size: var(--fs-body);
    line-height: var(--lh-text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; font-size: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
ul { list-style: none; padding: 0; margin: 0; }
h1, h2, h3, h4, p { margin: 0; }
input, textarea { font-family: inherit; font-size: inherit; color: inherit; }

/* ---------- 3. Container ---------- */
.container {
    width: 100%;
    max-width: calc(var(--container) + var(--container-padding) * 2);
    margin: 0 auto;
    padding: 0 var(--container-padding);
}

.section { padding: 80px 0; }
.section + .section { padding-top: 0; }

#services {
    background: #fff;
    padding: 29px 0 120px;
}

#services .section__head {
    margin-bottom: 81px;
}

#services .section__title {
    margin-bottom: 69px;
}

#about {
    padding: 29px 0 120px;
}

#about .section__head {
    margin-bottom: 75px;
}

#catalog {
    background: #fff;
    padding: 29px 0 95px;
}

#catalog .section__head {
    margin-bottom: 81px;
}

#catalog .section__title {
    margin-bottom: 69px;
}

#catalog .section__counter {
    position: relative;
    top: -13px;
}

#catalog .section__divider {
    margin-bottom: 28px;
}

.hl { color: var(--color-primary); }

/* ---------- 4. Buttons ---------- */
.btn {
    --btn-hover-fill: var(--color-primary);
    --btn-hover-color: #fff;
    --btn-hover-icon-bg: transparent;
    --btn-hover-icon-filter: brightness(0) invert(1);
    position: relative;
    isolation: isolate;
    display: inline-flex;
    align-items: stretch;
    gap: 0;
    height: 52px;
    border-radius: var(--radius-pill);
    font-weight: 400;
    font-size: var(--fs-body);
    line-height: 1;
    letter-spacing: -0.01em;
    overflow: hidden;
    transition: background-color .2s ease, color .2s ease;
    padding: 0;
}
.btn::after {
    content: "";
    position: absolute;
    z-index: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 0;
    border-radius: inherit;
    background: var(--btn-hover-fill);
    pointer-events: none;
    transition: width .42s cubic-bezier(0.22, 1, 0.36, 1);
}
.btn:has(.btn__icon):hover::after,
.btn:has(.btn__icon):focus-visible::after {
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    border-radius: inherit;
    opacity: 1;
}
.btn__text {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    padding: 0 18px 0 24px;
    white-space: nowrap;
    transition: color .2s ease-in-out;
}
.btn__icon {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    margin: 6px 6px 6px 0;
    border-radius: var(--radius-pill);
    flex-shrink: 0;
    overflow: hidden;
    transition: background-color .2s ease-in-out;
}
/* Ghost arrow: enters from bottom-left on hover */
.btn__icon::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url("../assets/icons/arrow-tr.svg") center / 12px 12px no-repeat;
    filter: var(--btn-hover-icon-filter);
    transform: translate(-10px, 10px);
    opacity: 0;
    pointer-events: none;
    transition:
        transform .42s cubic-bezier(0.22, 1, 0.36, 1),
        opacity .2s ease-in-out;
}
.btn__icon img {
    width: 12px;
    height: 12px;
    display: block;
    transition:
        filter .2s ease-in-out,
        transform .42s cubic-bezier(0.22, 1, 0.36, 1),
        opacity .2s ease-in-out;
}


.btn__icon--purple { background: var(--color-primary); }
.btn__icon--purple img { filter: brightness(0) invert(1); }
.btn__icon--white  { background: #fff; }
.btn__icon--white  img { filter: none; }
.btn:hover .btn__text,
.btn:focus-visible .btn__text { color: var(--btn-hover-color); }
.btn:hover .btn__icon,
.btn:focus-visible .btn__icon { background: var(--btn-hover-icon-bg); }
.btn:hover .btn__icon img,
.btn:focus-visible .btn__icon img {
    filter: var(--btn-hover-icon-filter);
    transform: translate(10px, -10px);
    opacity: 0;
}
.btn:hover .btn__icon::before,
.btn:focus-visible .btn__icon::before {
    transform: translate(0, 0);
    opacity: 1;
}

.btn--white  { background: #fff; color: var(--color-text); }
.btn--white:not(:has(.btn__icon)):hover,
.btn--white:not(:has(.btn__icon)):focus-visible {
    background: var(--color-primary);
    color: #fff;
}

.btn--purple {
    --btn-hover-fill: #fff;
    --btn-hover-color: var(--color-primary);
    --btn-hover-icon-bg: transparent;
    --btn-hover-icon-filter: none;
    background: var(--color-primary);
    color: #fff;
}
.btn--dark {
    --btn-hover-fill: #322b3c;
    background: var(--color-dark);
    color: #fff;
}
.btn--dark:hover,
.btn--dark:focus-visible { background: var(--btn-hover-fill); }

.btn--sm { height: 34px; font-size: var(--fs-meta); }
.btn--sm .btn__text { padding: 0 12px 0 16px; }
.btn--sm .btn__icon { width: 24px; margin: 5px 5px 5px 0; }
.btn--sm .btn__icon img { width: 10px; height: 10px; }

@media (prefers-reduced-motion: reduce) {
    .btn,
    .btn::after,
    .btn__text,
    .btn__icon,
    .btn__icon img {
        transition: none;
        animation: none;
    }
}

/* ---------- 5. Header (overlay on hero) ---------- */
.header {
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 138px;
    z-index: 10;
    color: #fff;
}
.header__inner {
    position: relative;
    display: block;
    width: 100%;
    max-width: 1440px;
    height: 138px;
    padding: 0;
}
.logo {
    position: absolute;
    left: 24px;
    top: 24px;
    display: inline-flex;
    width: 145px;
    height: 60px;
    align-items: center;
}
.logo img { width: 145px; height: 60px; filter: none; }

.header__contacts {
    position: absolute;
    left: 826px;
    top: 37px;
    display: flex;
    width: 232px;
    height: 34px;
    align-items: center;
    gap: 24px;
    color: rgba(255,255,255,0.95);
}
.header__link {
    font-size: 14px;
    line-height: 1.25;
    letter-spacing: -0.02em;
    white-space: nowrap;
    transition: opacity .2s ease;
}
.header__link:hover { opacity: .75; }

.header__actions {
    position: absolute;
    left: 1136px;
    top: 37px;
    display: flex;
    width: 280px;
    height: 34px;
    align-items: center;
    gap: 12px;
}
.header__search {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: 86px;
    height: 34px;
    padding: 8px 12px;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 4px;
    color: #fff;
    font-size: 14px;
    line-height: 1.25;
    letter-spacing: -0.02em;
    background: transparent;
    transition: background-color .2s ease;
}
.header__search img { filter: brightness(0) invert(1); opacity: .9; }
.header__search:hover { background: rgba(255,255,255,0.16); }
.header .btn--sm {
    width: 182px;
    height: 34px;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    color: var(--color-primary);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.25;
    letter-spacing: -0.02em;
}
.header .btn--sm .btn__text { padding: 0 12px; }

.header__burger { display: none; }

/* Sticky header — appears on scroll-up after hero */
.header.is-sticky {
    position: fixed;
    background: #2B2433;
    height: 163px;
    transform: translateY(-100%);
    transition: transform .35s ease, background-color .35s ease;
    z-index: 100;
}
.header.is-sticky.is-visible {
    transform: translateY(0);
}
.header.is-sticky.is-dissolving {
    background-color: transparent;
}

.nav {
    position: absolute;
    left: 24px;
    top: 108px;
    width: 1392px;
    height: 30px;
    border-top: 0;
    padding-top: 0;
}
.nav__list {
    display: flex;
    gap: 12px;
}
.nav__item {
    position: relative;
    flex: 0 0 188.571px;
    height: 30px;
    padding-top: 12px;
}
.nav__item::before,
.nav__item::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    height: 1px;
    background: rgba(255,255,255,0.3);
}
.nav__item::before { width: 100%; }
.nav__item::after {
    width: 0;
    transition: width .25s ease, background-color .25s ease;
}
/* No item is active by default — the top bar lights up only on hover / focus */
.nav__item:hover::after,
.nav__item:focus-within::after {
    width: 100%;
    background: #fff;
}
.nav__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    height: 18px;
    padding: 0;
    font-size: 14px;
    line-height: 1.25;
    letter-spacing: -0.02em;
    color: #fff;
    transition: color .2s ease;
}
.nav__link:hover { color: #fff; }
.nav__arrow {
    width: 13px;
    height: 13px;
    background: url("../assets/icons/menu-arrow.svg") center / contain no-repeat;
    filter: brightness(0) invert(1);
    flex: 0 0 auto;
    transition: opacity .25s ease;
}
.nav__submenu { display: none; }
.nav__item:hover .nav__arrow,
.nav__item:focus-within .nav__arrow { opacity: 1; }

/* ---------- 6. Hero slider ---------- */
.hero {
    position: relative;
    height: 807px;
    overflow: hidden;
    color: #fff;
}
.hero__slider {
    position: absolute;
    inset: 0 0 auto;
    height: 810px;
}
.hero__slide {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 810px;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity .6s ease;
    display: block;
    overflow: hidden;
}
.hero__slide.is-active { opacity: 1; z-index: 1; }

.hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(240.642deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 100%);
    backdrop-filter: blur(5px);
}

/* Hexagonal photo collage on the right side of hero */
.hero__hex {
    position: absolute;
    left: 50%;
    top: 0;
    width: 1440px;
    height: 810px;
    transform: translateX(-50%);
    pointer-events: none;
    z-index: 1;
}
.hero__hex-img {
    position: absolute;
    width: 416px;
    height: 480px;
    object-fit: cover;
    transform: rotate(-90deg);
    transform-origin: center center;
    filter: none;
}
.hero__hex-img--top { left: 1045px; top: 61px; z-index: 2; }
.hero__hex-img--mid { left: 672px;  top: 278px; z-index: 3; }
.hero__hex-img--bot { left: 1045px; top: 495px; z-index: 1; }

.hero__content {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    z-index: 2;
    width: 100%;
    max-width: 1440px;
    height: 810px;
    padding: 0;
    pointer-events: none;
}
.hero__eyebrow {
    position: absolute;
    left: 24px;
    top: 210px;
    width: max-content;
    max-width: 690px;
    font-size: 16px;
    line-height: 1.25;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.8);
    margin: 0;
    font-weight: 450;
}
.hero__title {
    position: absolute;
    left: 24px;
    top: 254px;
    width: 690px;
    font-size: 56px;
    line-height: 1.05;
    letter-spacing: -0.02em;
    font-weight: 600;
    max-width: none;
    margin: 0;
}
.hero__text {
    position: absolute;
    left: 24px;
    top: 574px;
    width: 456px;
    max-width: none;
    font-size: 16px;
    line-height: 1.25;
    letter-spacing: -0.02em;
    margin: 0;
    color: #fff;
}
.hero__content .btn {
    --btn-hover-start-width: 40px;
    --btn-hover-top: 6px;
    --btn-hover-right: 6px;
    --btn-hover-bottom: 6px;
    --btn-hover-radius: 2px;
    position: absolute;
    left: 24px;
    top: 678px;
    height: 52px;
    border-radius: 4px;
    background: #f2f2f2;
    color: var(--color-text);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.25;
    letter-spacing: -0.02em;
    pointer-events: auto;
}
.hero__content .btn__text { padding: 0 24px; }
.hero__content .btn__icon {
    width: 40px;
    height: 40px;
    margin: 6px 6px 6px 0;
    border-radius: 2px;
}
.hero__content .btn__icon img { width: 12px; height: 12px; }
.hero__slide[data-hex-set="1"] .hero__eyebrow { top: 240px; }
.hero__slide[data-hex-set="1"] .hero__title { top: 284px; }
.hero__slide[data-hex-set="2"] .hero__text {
    top: 594px;
    width: 366px;
}
.hero__slide[data-hex-set="3"] .hero__text { width: 386px; }
.hero__slide[data-hex-set="2"] .hero__content .btn { width: 245px; }
.hero__slide[data-hex-set="1"] .hero__content .btn,
.hero__slide[data-hex-set="3"] .hero__content .btn { width: 223px; }
.hero__content .btn.btn--white:hover,
.hero__content .btn.btn--white:focus-visible { background: var(--btn-hover-fill); }

.hero__slide[data-hex-set="2"] .hero__title,
.hero__slide[data-hex-set="3"] .hero__title { height: 177px; }
.hero__slide[data-hex-set="1"] .hero__title { height: 177px; }

.hero__slide[data-hex-set="2"] .hero__eyebrow,
.hero__slide[data-hex-set="3"] .hero__eyebrow { height: 20px; }
.hero__slide[data-hex-set="1"] .hero__eyebrow { height: 20px; }

.hero__slide[data-hex-set="1"] .hero__text,
.hero__slide[data-hex-set="3"] .hero__text { height: 80px; }
.hero__slide[data-hex-set="2"] .hero__text { height: 60px; }

.hero__slide[data-hex-set="1"] .hero__hex-img--top,
.hero__slide[data-hex-set="2"] .hero__hex-img--top,
.hero__slide[data-hex-set="3"] .hero__hex-img--top { left: 1045px; top: 61px; }

.hero__slide[data-hex-set="1"] .hero__hex-img--mid,
.hero__slide[data-hex-set="2"] .hero__hex-img--mid,
.hero__slide[data-hex-set="3"] .hero__hex-img--mid { left: 672px; top: 278px; }

.hero__slide[data-hex-set="1"] .hero__hex-img--bot,
.hero__slide[data-hex-set="2"] .hero__hex-img--bot,
.hero__slide[data-hex-set="3"] .hero__hex-img--bot { left: 1045px; top: 495px; }

.hero__progress {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: rgba(255,255,255,0.2);
    z-index: 3;
}
.hero__progress-bar {
    height: 6px;
    width: 0;
    background: #fff;
    transform: translateY(-1.5px);
}

/* ---------- 7. Section heading ---------- */
.section__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 56px;
    height: 16px;
}
.section__label {
    font-size: var(--fs-meta);
    color: var(--color-text-2);
    font-weight: 450;
    letter-spacing: 0;
    text-transform: uppercase;
    opacity: .6;
}
.section__arrow {
    width: 16px;
    height: 16px;
    display: grid;
    place-items: center;
    transition: opacity .2s ease;
    opacity: 1;
}
.section__arrow:hover { opacity: 1; }

.section__title {
    font-size: var(--fs-h2);
    line-height: var(--lh-snug);
    letter-spacing: -0.025em;
    font-weight: 500;
    color: var(--color-text);
    margin-bottom: 40px;
}
.section__title--lg { font-size: var(--fs-hero); line-height: var(--lh-tight); margin-bottom: 64px; }
.section__title--inline { margin-bottom: 0; max-width: 690px; }

.section__counter {
    font-size: var(--fs-meta);
    color: var(--color-mute);
    font-weight: 450;
    vertical-align: super;
    margin-left: 4px;
    letter-spacing: 0;
}

.section__divider {
    height: 1px;
    background: var(--color-line);
    margin-bottom: 24px;
    margin-top: 0;
}

.section__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 32px;
    margin-bottom: 40px;
}

/* ---------- 8. Services ---------- */
.services {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 12px;
}
.service {
    background: var(--color-bg);
    border-radius: var(--radius);
    padding: 24px;
    min-height: 199px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    text-align: center;
    transition: background-color .2s ease;
    color: var(--color-text);
}
.service:hover { background: #e9e9e9; }
.service__icon {
    width: 60px;
    height: 60px;
    border-radius: var(--radius);
    background: #fff;
    display: grid;
    place-items: center;
}
.service__title {
    font-size: var(--fs-xl);
    line-height: 1.2;
    font-weight: 450;
    letter-spacing: -0.01em;
    color: var(--color-text);
}

/* ---------- 9. About ---------- */
.about {
    display: grid;
    grid-template-columns: 573px 573px;
    gap: 130px;
    align-items: start;
}
.about__image {
    width: 573px;
    height: 573px;
    border-radius: 0;
    overflow: hidden;
    background: var(--color-card);
}
.about__image img { width: 100%; height: 100%; object-fit: cover; }

.about__content { padding-top: 25px; }
.about__title {
    font-size: var(--fs-h2);
    line-height: var(--lh-tight);
    letter-spacing: -0.025em;
    font-weight: 500;
    margin-bottom: 36px;
}
.about__text p {
    font-size: var(--fs-body);
    line-height: 1.25;
    letter-spacing: -0.02em;
    color: var(--color-text-2);
}
.about__text p:first-child {
    font-size: var(--fs-xl);
    line-height: var(--lh-snug);
    font-weight: 450;
    color: var(--color-text);
}
.about__text p + p { margin-top: 24px; }
.about__content .btn {
    --btn-hover-start-width: 40px;
    --btn-hover-top: 6px;
    --btn-hover-right: 6px;
    --btn-hover-bottom: 6px;
    --btn-hover-radius: 2px;
    margin-top: 36px;
    height: 52px;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.25;
    letter-spacing: -0.02em;
}
#about .btn__text { padding: 0 24px; }
#about .btn__icon {
    width: 40px;
    height: 40px;
    margin: 6px 6px 6px 0;
    border-radius: 2px;
}

/* ---------- 10. Stats (5-column honeycomb) ---------- */
.section--stats {
    padding: 0 0 120px;
}

.section--stats .container {
    position: relative;
    height: 753px;
}

.section--stats .section__title--lg {
    position: absolute;
    left: 24px;
    top: 0;
    width: 456px;
    margin: 0;
    font-size: var(--fs-h2);
    line-height: 1.15;
    letter-spacing: -0.025em;
}

.stats {
    --stat-w: 339px;
    --stat-h: 294px;
    --col-step: 263px;
    --row-step: 153px;

    position: absolute;
    left: 24px;
    top: 0;
    height: calc(var(--stat-h) + var(--row-step) * 3);
    max-width: calc(var(--col-step) * 4 + var(--stat-w));
    width: calc(var(--col-step) * 4 + var(--stat-w));
    margin: 0;
}
.stat {
    position: absolute;
    width: var(--stat-w);
    height: var(--stat-h);
    left: calc(var(--col-step) * var(--col, 0));
    top:  calc(var(--row-step) * var(--row, 0));
    clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 56px;
    text-align: center;
}

/* Эффект мягкого увеличения сот — только на устройствах с мышью (ПК).
   На мобильных и тач-устройствах не применяем — там нет осмысленного hover. */
@media (hover: hover) and (pointer: fine) {
    .stat {
        transform-origin: center center;
        transition:
            transform .35s cubic-bezier(.2,.7,.3,1),
            filter .35s ease,
            background-color .35s ease;
        will-change: transform, filter;
    }
    .stat:hover {
        transform: scale(1.035);
        filter: drop-shadow(0 12px 20px rgba(32, 27, 38, .14));
        z-index: 5;
    }
    .stat--dark:hover {
        filter: drop-shadow(0 14px 24px rgba(126, 47, 225, .28)) brightness(1.04);
    }
    .stat--light:hover {
        filter: drop-shadow(0 12px 20px rgba(32, 27, 38, .12)) brightness(1.018);
    }
    .stat--mute:hover {
        background: #e3e3e3;
        filter: drop-shadow(0 12px 20px rgba(32, 27, 38, .12));
    }
}

@media (prefers-reduced-motion: reduce) {
    .stat {
        transition: none;
        will-change: auto;
    }
    .stat:hover {
        transform: none;
    }
}

.stat--dark  { background: var(--color-primary);      color: #fff; }
.stat--light { background: var(--color-primary-soft); color: var(--color-text); }
.stat--mute  { background: var(--color-card);         color: var(--color-text); }

.stat__num {
    font-size: 40px;
    line-height: var(--lh-tight);
    font-weight: 450;
    letter-spacing: -0.025em;
    margin-bottom: 12px;
}
.stat__label {
    font-size: var(--fs-eyebrow);
    line-height: var(--lh-snug);
    max-width: 200px;
}

/* ---------- 11. Catalog ---------- */
.catalog {
    display: grid;
    grid-template-columns: 432px 432px 432px;
    column-gap: 48px;
    row-gap: 0;
    justify-content: space-between;
}
.catalog__group + .catalog__group { margin-top: 48px; }
.catalog__group-title {
    font-size: var(--fs-body);
    font-weight: 450;
    line-height: 1.25;
    letter-spacing: -0.02em;
    margin-bottom: 0;
    color: var(--color-text);
}
.catalog__list li { padding: 6px 0; }
.catalog__list a {
    font-size: var(--fs-body);
    line-height: var(--lh-base);
    color: var(--color-text-2);
    transition: color .2s ease;
}
.catalog__list a:hover { color: var(--color-primary); }

#catalog .catalog__group + .catalog__group { margin-top: 26px; }
#catalog .catalog__col:first-child .catalog__group:nth-child(3) { margin-top: 36px; }
#catalog .catalog__col:nth-child(2) .catalog__group:nth-child(3) { margin-top: 50px; }
#catalog .catalog__col:nth-child(3) .catalog__group:nth-child(2) { margin-top: 42px; }
#catalog .catalog__list a {
    letter-spacing: -0.025em;
    color: #666;
}

#partners {
    background: var(--color-bg);
    padding: 29px 0 120px;
}

#partners .section__head {
    margin-bottom: 81px;
}

#partners .section__row {
    align-items: flex-start;
    margin-bottom: 65px;
}

#partners .section__row .btn {
    --btn-hover-start-width: 40px;
    --btn-hover-top: 6px;
    --btn-hover-right: 6px;
    --btn-hover-bottom: 6px;
    --btn-hover-radius: 2px;
    margin-top: 26px;
    height: 52px;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.25;
    letter-spacing: -0.02em;
}

#partners .btn__text { padding: 0 24px; }
#partners .btn__icon {
    width: 40px;
    height: 40px;
    margin: 6px 6px 6px 0;
    border-radius: 2px;
}

#partners .section__divider {
    margin-bottom: 24px;
}

/* ---------- 12. Partners ---------- */
.partners {
    overflow: hidden;
    padding: 0;
    height: 222px;
}
.partners__track {
    display: flex;
    gap: 12px;
    margin-left: -210px;
    width: max-content;
}
.partners__track.is-marquee {
    animation: partners-marquee var(--partners-marquee-duration, 60s) linear infinite;
    will-change: transform;
}
.partners:hover .partners__track.is-marquee {
    animation-play-state: paused;
}
.partner {
    flex: 0 0 222px;
    height: 222px;
    background: var(--color-card);
    border-radius: var(--radius);
    overflow: hidden;
    display: grid;
    place-items: center;
    padding: 24px;
}
.partner img {
    max-width: 174px;
    max-height: 58px;
    width: auto;
    height: auto;
    object-fit: contain;
    transition: filter .3s ease;
}
.partners__track:hover .partner img {
    filter: grayscale(1) opacity(0.5);
}
.partners__track .partner:hover img {
    filter: none;
}
@keyframes marquee {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}
@keyframes partners-marquee {
    from { transform: translate3d(0, 0, 0); }
    to { transform: translate3d(calc(-1 * var(--partners-marquee-distance, 6552px)), 0, 0); }
}

@media (prefers-reduced-motion: reduce) {
    .partners__track.is-marquee {
        animation: none;
        transform: none;
        will-change: auto;
    }
}

/* ---------- 13. Projects ---------- */
#projects {
    background: #fff;
    padding: 29px 0 120px;
}

#projects .section__head {
    margin-bottom: 81px;
}

#projects .section__title {
    width: 690px;
    margin-bottom: 26px;
}

#projects .projects__cta {
    --btn-hover-start-width: 40px;
    --btn-hover-top: 6px;
    --btn-hover-right: 6px;
    --btn-hover-bottom: 6px;
    --btn-hover-radius: 2px;
    width: 266px;
    height: 52px;
    margin-bottom: 78px;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.25;
    letter-spacing: -0.02em;
}

#projects .btn__text { padding: 0 24px; }
#projects .btn__icon {
    width: 40px;
    height: 40px;
    margin: 6px 6px 6px 0;
    border-radius: 2px;
}

#projects .section__divider {
    margin-bottom: 25px;
}

#projects .section__label {
    color: rgba(26,26,26,0.3);
    letter-spacing: -0.02em;
    opacity: 1;
}

#projects .slider-nav {
    gap: 6px;
}

#projects .slider-nav__btn {
    border-radius: 2px;
    background: transparent;
    overflow: hidden;
}

#projects .slider-nav__btn img {
    width: 40px;
    height: 40px;
    max-width: none;
}

#projects .slider-nav__btn--purple img {
    filter: none;
}

.projects {
    position: relative;
}
.projects__track {
    display: flex;
    gap: 12px;
    width: 1294px;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
}
.projects__track::-webkit-scrollbar { display: none; }
.project {
    position: relative;
    flex: 0 0 641px;
    height: 480px;
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--color-text);
    color: #fff;
}
.project__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.project__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0.09) 0%, rgba(0,0,0,0.18) 100%);
}
.project__body {
    position: absolute;
    left: 36px;
    right: 36px;
    bottom: 36px;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.project__title {
    font-size: var(--fs-stat);
    font-weight: 450;
    line-height: var(--lh-snug);
    letter-spacing: -0.02em;
    margin-bottom: 0;
}
.project__meta {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: var(--fs-body);
    line-height: var(--lh-base);
    margin-top: 0;
    letter-spacing: -0.02em;
    color: var(--color-line);
}
.project__meta img { filter: brightness(0) invert(1); }

/* Slider nav (round buttons) */
.slider-nav {
    display: inline-flex;
    gap: 8px;
}
.slider-nav__btn {
    --slider-arrow-icon: var(--slider-arrow-muted);
    width: 40px;
    height: 40px;
    border-radius: 2px;
    position: relative;
    overflow: hidden;
    display: grid;
    place-items: center;
    transition: background-color .2s ease, color .2s ease;
}
.slider-nav__btn::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 40px;
    height: 40px;
    background-image: var(--slider-arrow-icon);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 40px 40px;
    pointer-events: none;
}
.slider-nav__btn[data-dir="prev"] {
    --slider-arrow-muted: url("data:image/svg+xml,%3Csvg%20width='40'%20height='40'%20viewBox='0%200%2040%2040'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cpath%20d='M17.3056%2023.0729L19.2707%2025L20.4563%2023.8373L17.3832%2020.8235H25V19.1792H17.409L20.4849%2016.1627L19.2993%2015L15.0379%2019.1792H15V20.7699H17.3056V23.0729Z'%20fill='%23999999'/%3E%3C/svg%3E");
    --slider-arrow-white: url("data:image/svg+xml,%3Csvg%20width='40'%20height='40'%20viewBox='0%200%2040%2040'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cpath%20d='M17.3056%2023.0729L19.2707%2025L20.4563%2023.8373L17.3832%2020.8235H25V19.1792H17.409L20.4849%2016.1627L19.2993%2015L15.0379%2019.1792H15V20.7699H17.3056V23.0729Z'%20fill='white'/%3E%3C/svg%3E");
    --slider-arrow-disabled: url("data:image/svg+xml,%3Csvg%20width='40'%20height='40'%20viewBox='0%200%2040%2040'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cpath%20d='M17.3056%2023.0729L19.2707%2025L20.4563%2023.8373L17.3832%2020.8235H25V19.1792H17.409L20.4849%2016.1627L19.2993%2015L15.0379%2019.1792H15V20.7699H17.3056V23.0729Z'%20fill='%23c4c4c4'/%3E%3C/svg%3E");
}
.slider-nav__btn[data-dir="next"] {
    --slider-arrow-muted: url("data:image/svg+xml,%3Csvg%20width='40'%20height='40'%20viewBox='0%200%2040%2040'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cpath%20d='M22.6944%2016.9271L20.7293%2015L19.5437%2016.1627L22.6168%2019.1765H15V20.8208H22.591L19.5151%2023.8373L20.7007%2025L24.9621%2020.8208H25V19.2301H22.6944V16.9271Z'%20fill='%23999999'/%3E%3C/svg%3E");
    --slider-arrow-white: url("data:image/svg+xml,%3Csvg%20width='40'%20height='40'%20viewBox='0%200%2040%2040'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cpath%20d='M22.6944%2016.9271L20.7293%2015L19.5437%2016.1627L22.6168%2019.1765H15V20.8208H22.591L19.5151%2023.8373L20.7007%2025L24.9621%2020.8208H25V19.2301H22.6944V16.9271Z'%20fill='white'/%3E%3C/svg%3E");
    --slider-arrow-disabled: url("data:image/svg+xml,%3Csvg%20width='40'%20height='40'%20viewBox='0%200%2040%2040'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cpath%20d='M22.6944%2016.9271L20.7293%2015L19.5437%2016.1627L22.6168%2019.1765H15V20.8208H22.591L19.5151%2023.8373L20.7007%2025L24.9621%2020.8208H25V19.2301H22.6944V16.9271Z'%20fill='%23c4c4c4'/%3E%3C/svg%3E");
}
.slider-nav__btn img {
    position: relative;
    z-index: 0;
    width: 40px;
    height: 40px;
    opacity: 0;
}
.slider-nav__btn--light {
    background: #e6e6e6;
    color: #999;
}
.slider-nav__btn--light:hover,
.slider-nav__btn--light:focus-visible,
.slider-nav__btn--light:active {
    --slider-arrow-icon: var(--slider-arrow-white);
    background: var(--color-primary);
    color: #fff;
}
.slider-nav__btn--light:disabled,
.slider-nav__btn--light.is-disabled {
    --slider-arrow-icon: var(--slider-arrow-disabled);
    background: transparent;
    color: #c4c4c4;
    cursor: default;
    pointer-events: none;
}
.slider-nav__btn--purple {
    --slider-arrow-icon: var(--slider-arrow-white);
    background: var(--color-primary);
    color: #fff;
}
.slider-nav__btn--purple img { filter: none; }
.slider-nav__btn--purple:hover,
.slider-nav__btn--purple:focus-visible { background: var(--color-primary-hover); }

#projects .slider-nav__btn,
#news .slider-nav__btn { background: transparent; }
#projects .slider-nav__btn--light:not(.is-disabled),
#news .slider-nav__btn--light:not(.is-disabled) { background: #e6e6e6; }
#projects .slider-nav__btn--light:hover,
#projects .slider-nav__btn--light:focus-visible,
#projects .slider-nav__btn--light:active,
#news .slider-nav__btn--light:hover,
#news .slider-nav__btn--light:focus-visible,
#news .slider-nav__btn--light:active {
    background: var(--color-primary);
    color: #fff;
}
#projects .slider-nav__btn--light.is-disabled,
#news .slider-nav__btn--light.is-disabled {
    --slider-arrow-icon: var(--slider-arrow-disabled);
    background: transparent;
    color: #c4c4c4;
    pointer-events: none;
}
#projects .slider-nav__btn--purple,
#news .slider-nav__btn--purple {
    background: var(--color-primary);
    color: #fff;
}
#projects .slider-nav__btn--purple:hover,
#projects .slider-nav__btn--purple:focus-visible,
#news .slider-nav__btn--purple:hover,
#news .slider-nav__btn--purple:focus-visible {
    background: var(--color-primary-hover);
}

.projects .slider-nav {
    position: absolute;
    right: 0;
    bottom: 0;
}

/* ---------- 14. News ---------- */
#news {
    background: var(--color-bg);
    padding: 29px 0 120px;
}

#news .section__head {
    margin-bottom: 81px;
}

#news .section__label {
    color: rgba(26,26,26,0.3);
    letter-spacing: -0.02em;
    opacity: 1;
}

#news .section__row {
    position: relative;
    align-items: flex-start;
    margin-bottom: 70px;
}

#news .section__title {
    width: 690px;
}

#news .slider-nav {
    position: absolute;
    right: 0;
    top: -4px;
    gap: 8px;
}

#news .slider-nav__btn {
    border-radius: 2px;
    background: transparent;
    overflow: hidden;
}

#news .slider-nav__btn img {
    width: 40px;
    height: 40px;
    max-width: none;
}

#news .slider-nav__btn--purple img {
    filter: none;
}

#news .slider-nav__btn--light:not(.is-disabled) {
    background: #e6e6e6;
    color: #999;
}
#news .slider-nav__btn--light:not(.is-disabled):hover,
#news .slider-nav__btn--light:not(.is-disabled):focus-visible,
#news .slider-nav__btn--light:not(.is-disabled):active {
    background: var(--color-primary);
    color: #fff;
}
#news .slider-nav__btn--purple {
    background: var(--color-primary);
    color: #fff;
}
#news .slider-nav__btn--purple:hover,
#news .slider-nav__btn--purple:focus-visible,
#news .slider-nav__btn--purple:active {
    background: var(--color-primary-hover);
    color: #fff;
}

#news .section__divider {
    margin-bottom: 23px;
}

.news__track {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
}
.news__track::-webkit-scrollbar { display: none; }
.article {
    flex: 0 0 calc((100% - 36px) / 4);
    height: 339px;
    overflow: hidden;
}
.article__link {
    display: block;
    color: var(--color-text);
    transition: opacity .2s ease;
}
.article__link:hover { opacity: .8; }
.article__image {
    aspect-ratio: 339 / 276;
    border-radius: var(--radius-md);
    overflow: hidden;
    background: var(--color-card);
    margin-bottom: 12px;
}
.article__image img { width: 100%; height: 100%; object-fit: cover; }
.article__title {
    font-size: var(--fs-xl);
    font-weight: 500;
    line-height: var(--lh-base);
    letter-spacing: -0.02em;
    margin-bottom: 6px;
    color: var(--color-text-2);
}
.article__date {
    display: block;
    font-size: var(--fs-body);
    line-height: var(--lh-base);
    letter-spacing: -0.02em;
    color: var(--color-mute);
}

/* ---------- 15. Contacts ---------- */
.section--contacts {
    position: relative;
    background: #fff;
    height: 770px;
    padding: 29px 0 0;
    overflow: hidden;
}

#contacts {
    padding: 29px 0 0;
}
.contacts__bg {
    position: absolute;
    left: 0;
    top: -159px;
    width: 1397px;
    height: 906px;
    background: url("../assets/img/contacts/hex-bg.svg") 0 0 / 100% 100% no-repeat;
    pointer-events: none;
}
/* Decorative hex outline pattern */
.section--contacts::before {
    content: none;
}

#contacts .section__head {
    margin-bottom: 75px;
}

#contacts .section__label {
    color: rgba(26,26,26,0.3);
    letter-spacing: -0.02em;
    opacity: 1;
}

.contacts {
    position: relative;
    display: grid;
    grid-template-columns: 456px 573px;
    justify-content: start;
    gap: 130px;
    margin-top: 0;
    margin-left: 117px;
    height: 530px;
    align-items: start;
}

.contacts__info {
    width: 456px;
}
.contacts__block {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.contacts__block + .contacts__block { margin-top: 60px; }
.contacts__label {
    font-size: var(--fs-body);
    line-height: var(--lh-base);
    letter-spacing: -0.02em;
    color: #999;
    margin-bottom: 0;
}
.contacts__phone {
    display: block;
    font-size: var(--fs-h2);
    font-weight: 500;
    line-height: var(--lh-tight);
    letter-spacing: -0.02em;
    margin-bottom: 0;
    color: var(--color-text);
}
.contacts__phone:hover { color: var(--color-primary); }
.contacts__email {
    font-size: var(--fs-xl);
    line-height: var(--lh-base);
    letter-spacing: -0.02em;
    color: var(--color-text);
}
.contacts__email:hover { color: var(--color-primary); }
.contacts__address {
    font-size: var(--fs-xl);
    line-height: var(--lh-base);
    letter-spacing: -0.02em;
    color: var(--color-text);
}
.contacts__messengers {
    display: flex;
    gap: 6px;
}
.messenger {
    width: 52px;
    height: 52px;
    border: 1px solid rgba(26,26,26,0.15);
    border-radius: 2px;
    background: transparent;
    display: grid;
    place-items: center;
    transition: background-color .2s ease;
}
.messenger:hover { background: var(--color-card); }
.messenger img { width: 24px; height: 24px; }

.contacts__form {
    width: 573px;
    height: 530px;
    background: var(--color-bg);
    color: var(--color-text);
    border-radius: var(--radius-lg);
    padding: 36px;
    box-shadow: none;
    align-self: start;
}
.form__title {
    font-size: var(--fs-stat);
    font-weight: 500;
    letter-spacing: -0.02em;
    margin-bottom: 16px;
    line-height: var(--lh-tight);
}
.form__subtitle {
    font-size: var(--fs-body);
    color: var(--color-text-2);
    letter-spacing: -0.02em;
    margin-bottom: 24px;
    line-height: var(--lh-base);
}
.form__inputs {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 12px;
}
.form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.form__field input,
.form__field textarea {
    width: 100%;
    background: var(--color-card);
    border: 0;
    border-radius: var(--radius-sm);
    padding: 16px;
    font-size: var(--fs-body);
    line-height: var(--lh-base);
    letter-spacing: -0.02em;
    transition: border-color .2s ease, background-color .2s ease;
}
.form__field textarea { resize: none; min-height: 92px; height: 92px; display: block; }
.form__field input::placeholder,
.form__field textarea::placeholder { color: rgba(26,26,26,0.6); opacity: 1; }
.form__field input:focus,
.form__field textarea:focus {
    outline: none;
    border-color: var(--color-primary);
    background: #fff;
}

.form__check {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    font-size: var(--fs-meta);
    letter-spacing: -0.02em;
    color: var(--color-text-2);
    line-height: var(--lh-base);
    margin-bottom: 12px;
    cursor: pointer;
}
.form__check input {
    appearance: none;
    width: 16px;
    height: 16px;
    margin: 0;
    border: 1px solid rgba(26,26,26,0.45);
    border-radius: 4px;
    background: transparent;
    accent-color: var(--color-primary);
    flex-shrink: 0;
}
.form__link { color: var(--color-text-2); text-decoration: underline; text-underline-offset: 2px; }
.form__link:hover { color: var(--color-primary); }

#contacts .contacts__form .btn {
    --btn-hover-start-width: 40px;
    --btn-hover-top: 6px;
    --btn-hover-right: 6px;
    --btn-hover-bottom: 6px;
    --btn-hover-radius: 2px;
    width: 176px;
    height: 52px;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 400;
    line-height: var(--lh-base);
    letter-spacing: -0.02em;
}

#contacts .contacts__form .btn__text { padding: 0 24px; }
#contacts .contacts__form .btn__icon {
    width: 40px;
    height: 40px;
    margin: 6px 6px 6px 0;
    border-radius: 2px;
}

.scroll-top {
    position: static;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-pill);
    background: var(--color-primary);
    margin: 48px 24px 72px auto;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
}
.scroll-top.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
}
.scroll-top img { filter: brightness(0) invert(1); }
.scroll-top:hover { background: var(--color-primary-hover); }

/* ---------- 16. Footer ---------- */
.footer {
    background: #201b26;
    color: #fff;
    padding: 60px 0;
}
.footer__menu {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 24px;
    text-align: center;
    align-items: center;
}
.footer__menu li {
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
}
.footer__menu a {
    display: block;
    font-size: var(--fs-meta);
    line-height: var(--lh-base);
    letter-spacing: -0.02em;
    color: #fff;
    transition: color .2s ease;
}
.footer__menu a:hover { color: #fff; }

/* ==========================================================================
   Внутренние страницы (page.php, single.php, 404.php)
   ========================================================================== */
.page-content {
    padding-top: 120px;
    padding-bottom: 80px;
    min-height: 60vh;
}
.entry__title {
    font-size: var(--fs-h2);
    font-weight: 700;
    letter-spacing: -0.03em;
    color: var(--color-text);
    margin-bottom: 24px;
    line-height: var(--lh-tight);
}
.entry__lead {
    font-size: var(--fs-xl);
    font-weight: 500;
    color: var(--color-mute);
    margin-bottom: 16px;
}
.entry__cover {
    margin-bottom: 32px;
    border-radius: var(--radius-lg);
    overflow: hidden;
}
.entry__cover img {
    width: 100%;
    height: auto;
    display: block;
}
.entry__date {
    display: block;
    font-size: var(--fs-meta);
    color: var(--color-mute);
    margin-bottom: 12px;
}
.entry__content {
    font-size: var(--fs-body);
    line-height: var(--lh-base);
    color: var(--color-text);
}
.entry__content p  { margin-bottom: 16px; }
.entry__content h2 { font-size: var(--fs-h2); font-weight: 700; margin: 32px 0 16px; }
.entry__content h3 { font-size: var(--fs-h3); font-weight: 600; margin: 24px 0 12px; }
.entry__content ul { list-style: disc; padding-left: 24px; margin-bottom: 16px; }
.entry__content a  { color: var(--color-primary); }
.entry__content a:hover { color: var(--color-primary-hover); }
.entry__gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
    margin-top: 32px;
}
.entry__gallery img { border-radius: var(--radius-md); width: 100%; height: auto; }
.entry--404 { text-align: center; padding: 60px 0; }
.entry--404 .entry__title { font-size: 120px; color: var(--color-primary); margin-bottom: 0; }
.entry__icon { margin-bottom: 24px; }

/* Sticky-logo: тёмный логотип видим только в sticky-режиме */
.logo__img--sticky { display: none; }
.header.is-sticky .logo__img        { display: none; }
.header.is-sticky .logo__img--sticky { display: block; }

/* Форма — сообщения */
.form__success {
    margin-top: 16px;
    padding: 14px 20px;
    border-radius: var(--radius-md);
    background: #e6f9f0;
    color: #1a7f4b;
    font-size: var(--fs-body);
}
.form__error {
    margin-top: 16px;
    padding: 14px 20px;
    border-radius: var(--radius-md);
    background: #fdecea;
    color: #c0392b;
    font-size: var(--fs-body);
}

/* Чекбокс — галочка при checked */
.form__check input[type="checkbox"]:checked {
    background-color: var(--color-primary);
    border-color:     var(--color-primary);
    background-image: url("data:image/svg+xml,%3Csvg width='10' height='8' viewBox='0 0 10 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 3.5L3.5 6L9 1' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}
.form__check input[type="checkbox"]:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

/* Валидация — ошибки полей */
.form__field.is-error input,
.form__field.is-error textarea {
    border-color: #c0392b;
    background-color: rgba(192,57,43,0.04);
}
.form__field.is-error input:focus,
.form__field.is-error textarea:focus {
    border-color: #c0392b;
}
.form__check.is-error input[type="checkbox"] {
    border-color: #c0392b;
    box-shadow: 0 0 0 3px rgba(192,57,43,0.15);
}
.form__error-msg {
    display: block;
    font-size: 11px;
    line-height: 1.4;
    color: #c0392b;
    margin-top: 4px;
    padding-left: 2px;
    letter-spacing: 0;
}

/* Pagination */
.pagination { margin-top: 48px; text-align: center; }
.pagination .page-numbers { padding: 8px 14px; color: var(--color-primary); }
.pagination .current { background: var(--color-primary); color: #fff; border-radius: 6px; }