/*
Theme Name: ChistoBlesk
Description: Custom theme for cleaning company "ЧистоБлеск"
Author: Antigravity
Version: 1.0.1
*/

:root {
    --primary: #1BB2E6;
    --primary-hover: #00A0D6;
    --secondary: #FA7F00;
    --success: #34D74F;
    --text-dark: #031537;
    --text-muted: rgba(3, 21, 55, 0.6);
    --bg-soft: #F0F3F5;
    --border-soft: rgba(16, 3, 55, 0.2);
    --font-main: 'Montserrat', system-ui, sans-serif;
    /* UI kit buttons — Figma 1:180 */
    --btn-disabled-bg: #BECFD8;
    --btn-disabled-text: #F6F6F6;
    --btn-height-lg: 54px;
    --btn-height-md: 46px;
    --btn-height-sm: 42px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
    font-family: var(--font-main);
    color: var(--text-dark);
    line-height: 1.5;
    background: #fff;
    -webkit-font-smoothing: antialiased;
}

a { text-decoration: none; color: inherit; }
ul { list-style: none; }
img { max-width: 100%; height: auto; display: block; }
button { font: inherit; }

.container {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 60px;
}

/* ================
   КНОПКИ — UI kit Figma 1:180 (54 / 46 / 42, base / hover / disabled)
================ */
.btn {
    height: var(--btn-height-lg);
    min-width: 294px;
    padding: 18px 70px;
    border-radius: 0;
    font-family: var(--font-main);
    font-weight: 600;
    font-size: 16px;
    line-height: 1;
    border: none;
    cursor: pointer;
    transition: background-color 0.25s ease, color 0.25s ease, transform 0.2s ease;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    white-space: nowrap;
    text-align: center;
    box-shadow: none;
}
.btn__icon {
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
}

/* Size variants (kit: 54 desktop / 46 mid / 42 mobile) */
.btn--lg {
    height: var(--btn-height-lg);
    padding: 18px 70px;
    font-size: 16px;
}
.btn--md {
    height: var(--btn-height-md);
    min-width: 0;
    padding: 16px 50px;
    font-size: 16px;
}
.btn--sm {
    height: var(--btn-height-sm);
    min-width: 0;
    padding: 16px 50px;
    font-size: 14px;
}

.btn-orange {
    min-width: 0;
    height: var(--btn-height-sm);
    padding: 0 24px;
    border-radius: 0;
    background: var(--secondary);
    font-size: 14px;
}
.btn-orange:hover:not(:disabled):not(.btn--disabled) { background: #e07000; }
.btn-blue { background: var(--primary); }
.btn-blue:hover:not(:disabled):not(.btn--disabled) { background: var(--primary-hover); }
.btn-green { background: var(--success); }
.btn-green:hover:not(:disabled):not(.btn--disabled) { background: #2bc043; }
.btn-telegram { background: #308CE2; }
.btn-telegram:hover:not(:disabled):not(.btn--disabled) { background: #2670b8; }

/* Disabled — kit gray #BECFD8 / text #F6F6F6 */
.btn:disabled,
.btn[disabled],
.btn.btn--disabled {
    background: var(--btn-disabled-bg);
    color: var(--btn-disabled-text);
    cursor: not-allowed;
    pointer-events: none;
    box-shadow: none;
    transform: none;
}
.btn-blue:disabled,
.btn-blue[disabled],
.btn-blue.btn--disabled,
.btn-orange:disabled,
.btn-orange[disabled],
.btn-orange.btn--disabled,
.btn-green:disabled,
.btn-green[disabled],
.btn-green.btn--disabled,
.btn-telegram:disabled,
.btn-telegram[disabled],
.btn-telegram.btn--disabled,
.btn-white:disabled,
.btn-white[disabled],
.btn-white.btn--disabled {
    background: var(--btn-disabled-bg);
    color: var(--btn-disabled-text);
}

/* ================
   HEADER
================ */
.site-header {
    border: none;
}

.header-top {
    padding: 16px 0 0;
}
.header-top .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.logo img {
    height: 64px;
    width: auto;
    display: block;
}

.rating {
    display: flex;
    flex-direction: column;
}
.rating-top {
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: 700;
    font-size: 17px;
}
.yandex-icon {
    background: #FF0000;
    color: white;
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 800;
    flex-shrink: 0;
}
.rating-stars { color: #FFB800; font-size: 16px; letter-spacing: 1px; }
.rating-text { font-size: 11px; color: #7B828A; margin-top: 3px; }

.contact-info {
    display: flex;
    align-items: center;
    gap: 0;
}
.contact-info .phone {
    font-weight: 700;
    font-size: 22px;
    letter-spacing: -0.3px;
    margin-right: 20px;
}
.contact-info .hours-wrap {
    border-left: 1px solid #D9D9D9;
    padding-left: 20px;
}
.contact-info .hours {
    font-size: 13px;
    color: var(--text-dark);
    line-height: 1.5;
    font-weight: 500;
}
.contact-info .hours .no-days,
.contact-info .hours span {
    color: #7B828A;
    font-size: 12px;
}

.socials { display: flex; gap: 8px; align-items: center; }
.social-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}
.social-icon img {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: block;
}

.header-bottom {
    padding: 0;
    margin-top: 16px;
}
.main-navigation ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 500;
    font-size: 15px;
    height: 58px;
    border: 1px solid rgba(3, 21, 55, 0.08);
}
.main-navigation ul li {
    flex: 1;
    height: 100%;
}
.main-navigation ul li a {
    transition: color 0.25s;
    color: var(--text-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 8px;
}
.main-navigation ul li a:hover { color: var(--primary); }
.arrow {
    font-size: 9px;
    color: #7B828A;
    margin-left: 4px;
    vertical-align: middle;
}

/* ================
   HERO: баннер + преимущества (Figma 41:182)
================ */
.hero-block {
    padding: 24px 0 0;
}
.hero-block .container {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.hero-banner {
    position: relative;
    height: 560px;
    padding: 42px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: #f4fcff;
}

.hero-banner__media {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.hero-banner__photo {
    position: absolute;
    left: 0;
    top: 2px;
    width: 100%;
    height: 558px;
}
.hero-banner__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.hero-banner__photo::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(244, 252, 255, 0.3);
}

.hero-banner__stroke {
    position: absolute;
    top: -69px;
    right: -234px;
    width: 700px;
    height: 760px;
    z-index: 1;
}
.hero-banner__stroke img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.hero-banner__product {
    position: absolute;
    top: 22px;
    right: -30px;
    width: 619px;
    height: 553px;
    z-index: 2;
    overflow: hidden;
    filter:
        drop-shadow(0 179px 121px rgba(3, 34, 67, 0.06))
        drop-shadow(0 105px 63px rgba(3, 34, 67, 0.04))
        drop-shadow(0 54px 30px rgba(3, 34, 67, 0.03))
        drop-shadow(0 22px 13px rgba(3, 34, 67, 0.03))
        drop-shadow(0 5px 6px rgba(3, 34, 67, 0.02));
}
.hero-banner__product img {
    position: absolute;
    width: 128.97%;
    height: 96.17%;
    left: -26.41%;
    top: 3.72%;
    max-width: none;
    object-fit: cover;
}

.hero-banner__content {
    position: relative;
    z-index: 3;
    width: min(720px, 100%);
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.hero-banner__titles {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.hero-banner__title {
    font-size: 42px;
    line-height: 52px;
    font-weight: 600;
    color: var(--text-dark);
    letter-spacing: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
}
.hero-banner__title-line {
    display: block;
}
.hero-banner__price {
    margin: 0;
    font-size: 42px;
    line-height: 52px;
    font-weight: 600;
    color: var(--text-dark);
    letter-spacing: 0;
}
.hero-banner__titles .hero-banner__price.hero-banner__title-line {
    display: block;
    /* Offset .hero-banner__titles gap so price sits flush under H1 lines */
    margin-top: -18px;
}
.hero-banner__title-accent {
    color: var(--primary);
}

.hero-banner__subtitle {
    display: inline-flex;
    align-items: center;
    background: #fff;
    padding: 10px 18px;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    color: var(--text-dark);
    width: fit-content;
    max-width: 100%;
}

.hero-banner__top {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.hero-banner__bullets {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.hero-banner__bullets li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;
}
.hero-banner__bullets strong {
    font-weight: 500;
}
.hero-banner__check {
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    margin-top: 0;
}

.hero-banner__cta {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.hero-banner__cta-text {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
}
.hero-banner__buttons {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}
.hero-banner__buttons .btn {
    width: 294px;
    min-width: 294px;
    max-width: 100%;
    flex: 0 0 294px;
    box-sizing: border-box;
}

/* Benefits row */
.hero-benefits {
    display: flex;
    gap: 20px;
    padding: 20px 0;
    margin-top: 0;
    border-top: 1px solid var(--border-soft);
    border-bottom: 1px solid var(--border-soft);
}
.hero-benefits__item {
    flex: 1;
    display: flex;
    gap: 10px;
    align-items: flex-start;
    min-width: 0;
}
.hero-benefits__icon {
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    border-radius: 64px;
    background: var(--bg-soft);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 9px;
}
.hero-benefits__icon img {
    width: 36px;
    height: 36px;
    object-fit: contain;
}
.hero-benefits__text {
    display: flex;
    flex-direction: column;
    gap: 8px;
    justify-content: center;
    min-width: 0;
}
.hero-benefits__text .hero-benefits__title {
    margin: 0;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    color: var(--text-dark);
}
.hero-benefits__text p:not(.hero-benefits__title) {
    margin: 0;
    font-size: 15px;
    font-weight: 400;
    line-height: 22px;
    color: var(--text-dark);
    opacity: 0.6;
}

/* ================
   RESPONSIVE
================ */
@media (max-width: 1200px) {
    .container { padding: 0 32px; }
    .hero-banner { height: auto; min-height: 520px; }
    .hero-banner__product {
        width: 48%;
        right: -20px;
        height: auto;
        aspect-ratio: 619 / 553;
    }
    .hero-banner__stroke {
        width: 55%;
        right: -15%;
    }
    .btn:not(.btn--sm):not(.btn--md):not(.btn-orange):not(.btn-white) {
        min-width: 240px;
        padding: 18px 40px;
    }
}

@media (max-width: 900px) {
    .header-top .container {
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 12px;
    }
    .contact-info,
    .btn-orange,
    .header-bottom {
        display: none;
    }
    .logo img { height: 48px; }
    .social-icon img { width: 32px; height: 32px; }

    /* Kit mobile: 54→46, keep 46/42; font 14 */
    .btn--lg {
        height: var(--btn-height-md);
        min-width: 0;
        padding: 16px 50px;
        font-size: 14px;
    }
    .btn--md {
        height: var(--btn-height-md);
        padding: 16px 50px;
        font-size: 14px;
    }
    .btn--sm {
        height: var(--btn-height-sm);
        padding: 16px 50px;
        font-size: 14px;
    }

    /* CLN-M03: mobile hero — Figma 120:1414 / trust 120:1416 */
    .hero-block { padding: 16px 0 0; }
    .hero-block .container { gap: 0; }
    .hero-banner {
        height: auto;
        min-height: 574px;
        max-height: none;
        padding: 14px;
        background: #f4fcff;
    }
    .hero-banner__photo {
        display: block;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
    }
    .hero-banner__photo::after {
        background: rgba(244, 252, 255, 0.3);
    }
    .hero-banner__stroke {
        top: 175px;
        right: -115px;
        left: auto;
        width: 493px;
        height: 481px;
        opacity: 1;
        z-index: 1;
    }
    .hero-banner__product {
        display: block;
        top: auto;
        bottom: -28px;
        right: -110px;
        width: 220px;
        height: 196px;
        z-index: 2;
        filter:
            drop-shadow(0 40px 28px rgba(3, 34, 67, 0.06))
            drop-shadow(0 16px 10px rgba(3, 34, 67, 0.04));
    }
    .hero-banner__product img {
        width: 145%;
        height: 112%;
        left: -30%;
        top: -2%;
    }
    .hero-banner__content {
        width: 100%;
        height: 100%;
        gap: 0;
        justify-content: space-between;
    }
    .hero-banner__top {
        gap: 18px;
    }
    .hero-banner__titles {
        gap: 12px;
    }
    .hero-banner__titles .hero-banner__price.hero-banner__title-line {
        margin-top: -12px;
    }
    .hero-banner__title {
        font-size: 26px;
        line-height: 36px;
        font-weight: 600;
    }
    .hero-banner__price {
        font-size: 26px;
        line-height: 36px;
        font-weight: 600;
    }
    .hero-banner__title-accent::after {
        content: '';
        display: block;
    }
    .hero-banner__subtitle {
        font-size: 14px;
        line-height: 20px;
        font-weight: 500;
        padding: 8px 12px;
        width: 100%;
        background: rgba(255, 255, 255, 0.6);
    }
    .hero-banner__bullets {
        gap: 12px;
    }
    .hero-banner__check {
        width: 18px;
        height: 18px;
        flex-basis: 18px;
    }
    .hero-banner__bullets li {
        gap: 8px;
        font-size: 13px;
        line-height: 18px;
    }
    .hero-banner__cta {
        gap: 16px;
        position: relative;
        z-index: 3;
    }
    .hero-banner__cta-text {
        font-size: 14px;
        line-height: 22px;
        font-weight: 500;
    }
    .hero-banner__buttons {
        flex-direction: column;
        gap: 8px;
        width: 100%;
    }
    .hero-banner__buttons .btn {
        width: 100%;
        min-width: 0;
        flex: none;
        height: 46px;
        padding: 0 16px;
        font-size: 14px;
        border-radius: 0;
    }
    .hero-banner__buttons .btn__icon {
        width: 20px;
        height: 20px;
        flex-basis: 20px;
    }
    .hero-benefits {
        flex-direction: column;
        gap: 14px;
        margin-top: 0;
        padding: 14px 0;
        border-top: 1px solid rgba(16, 3, 55, 0.2);
        border-bottom: 1px solid rgba(16, 3, 55, 0.2);
    }
    .hero-benefits__item {
        gap: 10px;
        padding-bottom: 14px;
        border-bottom: 1px solid rgba(16, 3, 55, 0.2);
    }
    .hero-benefits__item:last-child {
        padding-bottom: 0;
        border-bottom: none;
    }
    .hero-benefits__icon {
        width: 42px;
        height: 42px;
        flex-basis: 42px;
        padding: 8px;
    }
    .hero-benefits__icon img {
        width: 26px;
        height: 26px;
    }
    .hero-benefits__text {
        gap: 8px;
    }
    .hero-benefits__text .hero-benefits__title {
        font-size: 15px;
        line-height: 22px;
        font-weight: 500;
    }
    .hero-benefits__text p:not(.hero-benefits__title) {
        font-size: 13px;
        line-height: 18px;
    }
}

@media (max-width: 600px) {
    .container { padding: 0 15px; }
    .hero-banner {
        height: auto;
        min-height: 574px;
    }
    .hero-banner__title {
        font-size: 26px;
        line-height: 36px;
    }
    .hero-banner__price {
        font-size: 26px;
        line-height: 36px;
    }
    .hero-banner__product {
        right: -120px;
        bottom: -30px;
        width: 210px;
        height: 188px;
    }
}

/* ================
   SHARED SECTIONS
================ */
.section {
    padding: 80px 0;
}
.section-header {
    margin-bottom: 40px;
}
.section-header--row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 20px;
}
.section-eyebrow {
    display: block;
    font-size: 13px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    opacity: 0.7;
    margin-bottom: 10px;
}
.section-title {
    margin: 0;
    font-size: 32px;
    line-height: 42px;
    font-weight: 600;
    color: var(--text-dark);
}
.btn-white {
    background: #fff;
    color: var(--text-dark);
    min-width: 0;
    height: var(--btn-height-md);
    padding: 0 28px;
    font-size: 14px;
}
.btn-white:hover:not(:disabled):not(.btn--disabled) { background: var(--bg-soft); }

/* ADVANTAGES (Figma 11:195) */
.section-advantages .section-header {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 36px;
    max-width: 649px;
}
.section-advantages .section-eyebrow {
    text-transform: none;
    letter-spacing: 0;
    line-height: 20px;
    margin-bottom: 0;
}
.section-advantages .advantages-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.415fr);
    gap: 16px;
    align-items: stretch;
}
.section-advantages .advantages-card {
    background: #f1f4f6;
    border-radius: 0;
    overflow: hidden;
    position: relative;
}
.section-advantages .advantages-card--main {
    background: var(--primary);
    color: #fff;
    padding: 28px;
    height: 432px;
    min-height: 432px;
    display: flex;
    box-sizing: border-box;
}
.section-advantages .advantages-card__deco {
    position: absolute;
    left: -200px;
    top: 108px;
    width: 525px;
    height: 525px;
    background: #fff;
    -webkit-mask-image: url('assets/images/adv-main-deco.png');
    mask-image: url('assets/images/adv-main-deco.png');
    -webkit-mask-size: 525px 525px;
    mask-size: 525px 525px;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    pointer-events: none;
    z-index: 0;
}
.section-advantages .advantages-card__content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    position: relative;
    z-index: 1;
    flex: 1;
}
.section-advantages .advantages-card__copy {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.section-advantages .advantages-card--main .advantages-card__lead {
    font-size: 26px;
    line-height: 36px;
    font-weight: 600;
    margin: 0;
}
.section-advantages .advantages-card--main p:not(.advantages-card__lead) {
    font-size: 16px;
    line-height: 24px;
    opacity: 1;
    margin: 0;
}
.section-advantages .advantages-card--main .btn-white {
    width: 100%;
    min-width: 0;
    height: 54px;
    padding: 18px 70px;
    font-size: 16px;
    font-weight: 600;
    color: var(--primary);
    background: #fff;
}
.section-advantages .advantages-side {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 208px 208px;
    gap: 16px;
    width: 100%;
}
.section-advantages .advantages-card--small {
    padding: 18px;
    height: 208px;
    box-sizing: border-box;
}
.section-advantages .advantages-card--wide {
    grid-column: 1 / -1;
    padding: 18px;
    height: 208px;
    background: #f0f3f5;
    box-sizing: border-box;
}
.section-advantages .advantages-card__deco-wide {
    position: absolute;
    right: -82px;
    top: -123px;
    width: 368px;
    height: 356px;
    max-width: none;
    transform: rotate(21.93deg);
    pointer-events: none;
    z-index: 0;
}
.section-advantages .advantages-card__title {
    position: relative;
    z-index: 2;
    font-size: 20px;
    line-height: 28px;
    font-weight: 600;
    color: #031537;
    margin: 0;
    max-width: 92%;
}
.section-advantages .advantages-card__text {
    position: relative;
    z-index: 2;
    max-width: 426px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.section-advantages .advantages-card--wide .advantages-card__title {
    max-width: 360px;
}
.section-advantages .advantages-card__desc {
    margin: 0;
    font-size: 14px;
    line-height: 22px;
    opacity: 0.8;
    color: #031537;
}
.section-advantages .advantages-card__media {
    position: absolute;
    overflow: hidden;
    pointer-events: none;
    z-index: 1;
    filter:
        drop-shadow(-106px -36px 94px rgba(0, 24, 88, 0.05))
        drop-shadow(-54px -18px 41px rgba(0, 24, 88, 0.03))
        drop-shadow(-21px -7px 15px rgba(0, 24, 88, 0.03))
        drop-shadow(-5px -2px 5px rgba(0, 24, 88, 0.02));
}
.section-advantages .advantages-card__cutout {
    position: absolute;
    max-width: none;
    display: block;
}
.section-advantages .advantages-card__media--van {
    right: 0;
    top: 71px;
    width: 234px;
    height: 137px;
}
.section-advantages .advantages-card__media--van .advantages-card__cutout {
    left: -17.94%;
    top: -22.03%;
    width: 158.02%;
    height: 162.35%;
    object-fit: cover;
}
.section-advantages .advantages-card__media--chem {
    left: 28px;
    top: 95px;
    width: 317px;
    height: 113px;
    overflow: visible;
    filter: none;
}
.section-advantages .advantages-card__media-flip {
    width: 317px;
    height: 113px;
    overflow: hidden;
    transform: rotate(180deg) scaleY(-1);
    filter:
        drop-shadow(-106px -36px 94px rgba(0, 24, 88, 0.05))
        drop-shadow(-54px -18px 41px rgba(0, 24, 88, 0.03))
        drop-shadow(-21px -7px 15px rgba(0, 24, 88, 0.03))
        drop-shadow(-5px -2px 5px rgba(0, 24, 88, 0.02));
}
.section-advantages .advantages-card__media--chem .advantages-card__cutout {
    left: 0;
    top: -62.73%;
    width: 100%;
    height: 187.11%;
    object-fit: cover;
}
.section-advantages .advantages-card__media--sofa {
    left: 467px;
    top: 0;
    width: 295px;
    height: 208px;
}
.section-advantages .advantages-card__media--sofa .advantages-card__cutout {
    left: 0;
    top: -82.45%;
    width: 159.66%;
    height: 226.44%;
    object-fit: cover;
}

/* SERVICES — product cutouts on the right (Figma 25:70) */
.section-services .services-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}
.section-services .service-card {
    position: relative;
    background: #f1f4f6;
    border-radius: 0;
    overflow: hidden;
    height: 278px;
    padding: 18px;
}
.section-services .service-card__media {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}
.section-services .service-card__cutout-wrap {
    position: absolute;
    overflow: hidden;
    filter: drop-shadow(-4.6px -1.6px 5.4px rgba(0, 24, 88, 0.02))
        drop-shadow(-21.2px -7.2px 15.3px rgba(0, 24, 88, 0.03))
        drop-shadow(-53.7px -18.3px 41px rgba(0, 24, 88, 0.03))
        drop-shadow(-106px -36px 94px rgba(0, 24, 88, 0.05));
}
.section-services .service-card__cutout {
    display: block;
    max-width: none;
    pointer-events: none;
}
.section-services .service-card--general .service-card__cutout-wrap {
    right: 0;
    top: 0;
    width: 66.2%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.section-services .service-card--general .service-card__cutout {
    width: 278px;
    height: 284px;
    transform: rotate(-90deg);
    object-fit: cover;
}
.section-services .service-card--repair .service-card__cutout-wrap {
    right: 0;
    top: 0;
    width: 50.8%;
    height: 100%;
}
.section-services .service-card--repair .service-card__cutout {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}
.section-services .service-card--dry .service-card__cutout-wrap {
    right: 0;
    top: 0;
    width: 50.8%;
    height: 100%;
}
.section-services .service-card--dry .service-card__cutout {
    position: absolute;
    width: 143.12%;
    height: 112.23%;
    left: -13.76%;
    top: 1.08%;
    object-fit: cover;
}
.section-services .service-card--windows .service-card__cutout-wrap {
    right: 0;
    top: 19px;
    width: 46.6%;
    height: 259px;
}
.section-services .service-card--windows .service-card__cutout {
    position: absolute;
    width: 196%;
    height: 151.35%;
    left: -50%;
    top: -13.9%;
    object-fit: cover;
}
.section-services .service-card__inner {
    position: relative;
    z-index: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    max-width: 52%;
}
.section-services .service-card--featured {
    grid-column: span 2;
    background: #feca27;
}
.section-services .service-card--featured .service-card__deco {
    position: absolute;
    right: -3.2%;
    top: -22.7%;
    width: 48.5%;
    height: auto;
    max-width: 424px;
    object-fit: contain;
    pointer-events: none;
}
.section-services .service-card--featured .service-card__cutout-wrap {
    right: 0;
    top: 0;
    width: 47.1%;
    height: 100%;
    filter: none;
}
.section-services .service-card--featured .service-card__cutout--popular {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: right bottom;
}
.section-services .service-card--featured .service-card__inner {
    max-width: 47.1%;
}
.section-services .service-card__tags {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}
.section-services .service-card__tags-row {
    display: flex;
    flex-wrap: nowrap;
    gap: 6px;
}
.section-services .service-card__tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(2px);
    border-radius: 70px;
    padding: 7px 10px;
    font-size: 14px;
    line-height: 18px;
    white-space: nowrap;
    flex-shrink: 0;
}
.section-services .service-card__tag img {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
}
.section-services .service-card__tag strong { font-weight: 500; }
.section-services .service-card__badge {
    display: inline-flex;
    background: #f77a0c;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    line-height: 18px;
    padding: 11px 16px;
    border-radius: 70px;
    white-space: nowrap;
}
.section-services .service-card__footer h3,
.section-services .service-card__footer .service-card__title {
    font-size: 24px;
    line-height: 34px;
    font-weight: 600;
    margin: 0 0 14px;
    color: #031537;
}
.section-services .service-card__price-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
}
.section-services .service-card__price {
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    color: #031537;
    white-space: nowrap;
}
.section-services .service-card__btn {
    min-width: 0;
    width: auto;
    height: 46px;
    padding: 0 50px;
    font-size: 16px;
    flex-shrink: 0;
}
.section-services .service-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    align-items: baseline;
    margin-bottom: 14px;
}
.section-services .service-tabs__label {
    font-size: 24px;
    line-height: 34px;
    font-weight: 600;
    color: #031537;
}
.section-services .service-tabs__btn {
    background: transparent;
    border: none;
    border-bottom: 1px solid transparent;
    padding: 0 0 2px;
    font-size: 24px;
    line-height: 34px;
    font-weight: 600;
    color: #031537;
    opacity: 0.6;
    cursor: pointer;
}
.section-services .service-tabs__btn.is-active {
    opacity: 1;
    border-bottom-color: #031537;
}

/* CALCULATOR */
.calculator {
    background: var(--bg-soft);
    padding: 40px;
    border-radius: 0;
}
.calculator__form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}
.calculator__fields {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.calc-field label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 8px;
}
.calc-field select,
.calc-field input[type="range"] {
    width: 100%;
}
.calc-field select {
    height: 48px;
    padding: 0 14px;
    border: 1px solid var(--border-soft);
    background: #fff;
    font-family: var(--font-main);
    font-size: 14px;
    border-radius: 0;
}
.calc-field input[type="range"] {
    accent-color: var(--primary);
}
.calc-extras {
    border: none;
    padding: 0;
}
.calc-extras legend {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 10px;
}
.calc-checkbox {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    margin-bottom: 8px;
    cursor: pointer;
}
.calc-checkbox input { accent-color: var(--primary); }
.calculator__result {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 24px;
}
.calculator__price-label {
    font-size: 14px;
    opacity: 0.7;
}
.calculator__price {
    font-size: 42px;
    font-weight: 700;
    color: var(--primary);
    line-height: 1.1;
    margin: 8px 0;
}
.calculator__note {
    font-size: 13px;
    opacity: 0.6;
}
.calculator__lead {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.calculator__lead input {
    height: 48px;
    padding: 0 14px;
    border: 1px solid var(--border-soft);
    font-family: var(--font-main);
    font-size: 14px;
    border-radius: 0;
}
.calculator__lead .btn {
    min-width: 0;
    width: 100%;
    height: var(--btn-height-md);
    padding: 0 20px;
}

/* HOW WE CLEAN */
.how-clean__tabs {
    display: flex;
    gap: 0;
    border-bottom: 1px solid var(--border-soft);
    margin-bottom: 24px;
}
.how-clean__tab {
    background: none;
    border: none;
    padding: 14px 24px;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    color: var(--text-dark);
    opacity: 0.6;
}
.how-clean__tab.is-active {
    opacity: 1;
    border-bottom-color: var(--primary);
    color: var(--primary);
}
.how-clean__panel { display: none; }
.how-clean__panel.is-active { display: block; }
.how-clean__filters {
    display: flex;
    gap: 10px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}
.how-clean__filter {
    background: var(--bg-soft);
    border: none;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    border-radius: 0;
}
.how-clean__filter.is-active {
    background: var(--primary);
    color: #fff;
}
.how-clean__content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: start;
}
.how-clean__checklist { display: none; }
.how-clean__checklist.is-active { display: block; }
.how-clean__checklist ul {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.how-clean__checklist li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 15px;
    line-height: 22px;
}
.how-clean__checklist img {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    margin-top: 2px;
}
.how-clean__image img {
    width: 100%;
    height: 320px;
    object-fit: cover;
}
.how-clean__cta {
    margin-top: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 24px;
    background: var(--bg-soft);
}
.how-clean__cta p {
    font-size: 16px;
    font-weight: 500;
}
.how-clean__cta .btn {
    min-width: 0;
    height: var(--btn-height-md);
    padding: 0 28px;
    font-size: 14px;
    flex-shrink: 0;
}

/* MESSENGER CTA (Figma 164:1043) */
.section-messenger-cta {
    padding: 0 0 80px;
}
.messenger-cta {
    background: var(--primary);
    color: #fff;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 48px 56px;
    overflow: hidden;
    position: relative;
    min-height: 280px;
}
.messenger-cta__title {
    font-size: 32px;
    line-height: 42px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 16px;
    max-width: 560px;
}
.messenger-cta__text {
    font-size: 16px;
    line-height: 24px;
    opacity: 0.92;
    max-width: 520px;
    margin-bottom: 28px;
}
.messenger-cta__text strong {
    font-weight: 600;
}
.messenger-cta__buttons {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}
.messenger-cta__btn-wa,
.messenger-cta__btn-tg {
    min-width: 0;
    height: 52px;
    padding: 0 28px;
    font-size: 15px;
}
.messenger-cta__btn-tg .btn__icon {
    filter: brightness(0) invert(1);
}
.messenger-cta__media {
    position: relative;
    width: 280px;
    height: 260px;
    flex-shrink: 0;
}
.messenger-cta__stroke {
    position: absolute;
    top: -20px;
    right: -40px;
    width: 320px;
    height: auto;
    opacity: 0.5;
    pointer-events: none;
}
.messenger-cta__phone {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 220px;
    height: auto;
    object-fit: contain;
    filter: drop-shadow(0 20px 40px rgba(3, 21, 55, 0.15));
}

/* COMPARISON TABLE (Figma 58:354) */
.compare-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.compare-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 720px;
}
.compare-table thead th {
    padding: 24px 20px;
    text-align: center;
    vertical-align: top;
    background: var(--bg-soft);
    border: 1px solid rgba(3, 21, 55, 0.08);
}
.compare-table__label-col {
    width: 180px;
    background: transparent !important;
    border: none !important;
}
.compare-table__type {
    display: block;
    font-size: 17px;
    font-weight: 600;
    margin-bottom: 6px;
}
.compare-table__price {
    display: block;
    font-size: 15px;
    font-weight: 700;
    color: var(--primary);
}
.compare-table__col--popular {
    background: #fff !important;
    box-shadow: 0 4px 24px rgba(3, 21, 55, 0.1);
    position: relative;
    z-index: 1;
}
.compare-table__badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--secondary);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    margin-bottom: 10px;
    white-space: nowrap;
}
.compare-table tbody th,
.compare-table tbody td {
    padding: 16px 20px;
    font-size: 14px;
    line-height: 20px;
    border: 1px solid rgba(3, 21, 55, 0.08);
    vertical-align: top;
}
.compare-table__row-label {
    font-weight: 600;
    text-align: left;
    background: var(--bg-soft);
    white-space: nowrap;
}
.compare-table tbody td {
    text-align: center;
    opacity: 0.85;
}
.compare-table tbody .compare-table__col--popular {
    background: #fff;
    font-weight: 500;
    opacity: 1;
}

.lead-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.lead-form input {
    height: 52px;
    padding: 0 16px;
    border: 1px solid var(--border-soft);
    background: #fff;
    font-family: var(--font-main);
    font-size: 15px;
    border-radius: 0;
}
.lead-form .btn {
    min-width: 0;
    width: 100%;
    height: var(--btn-height-lg);
    padding: 18px 50px;
}

/* PORTFOLIO — before/after */
.portfolio-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.portfolio-card--ba {
    background: #fff;
    border: 1px solid rgba(3, 21, 55, 0.08);
}
.portfolio-card__ba {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.portfolio-card__half {
    position: relative;
    overflow: hidden;
}
.portfolio-card__half img {
    width: 100%;
    height: 220px;
    object-fit: cover;
}
.portfolio-card__label {
    position: absolute;
    top: 12px;
    left: 12px;
    font-size: 12px;
    font-weight: 700;
    padding: 4px 12px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.portfolio-card__label--before {
    background: rgba(3, 21, 55, 0.75);
    color: #fff;
}
.portfolio-card__label--after {
    background: var(--success);
    color: #fff;
}
.portfolio-card__body {
    padding: 16px 20px;
}
.portfolio-card__body h3 {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 4px;
}
.portfolio-card__meta {
    font-size: 13px;
    opacity: 0.6;
}

/* TEAM */
.team-layout {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 40px;
    align-items: start;
    margin-bottom: 32px;
}
.team-intro__lead {
    font-size: 16px;
    line-height: 24px;
    margin: 0 0 16px;
}
.team-intro__lead .text-accent,
.text-accent {
    font-weight: 700;
    color: var(--primary);
}
.team-intro__subtitle {
    font-size: 18px;
    line-height: 26px;
    font-weight: 600;
    margin-bottom: 16px;
}
.team-intro__note {
    margin-top: 16px;
    font-size: 16px;
    line-height: 24px;
}
.team-intro__list li {
    font-size: 15px;
    line-height: 22px;
    opacity: 0.8;
    padding-left: 32px;
    position: relative;
    margin-bottom: 12px;
}
.team-intro__list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 1px;
    width: 24px;
    height: 24px;
    background: url('assets/images/icon-check-circle.svg') center / 24px 24px no-repeat;
}
.team-specialists {
    display: flex;
    gap: 14px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.team-equipment {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    padding-top: 32px;
    border-top: 1px solid var(--border-soft);
}
.equip-card {
    position: relative;
    background: #f1f4f6;
    overflow: hidden;
    height: 202px;
    padding: 24px;
    border-radius: 0;
}
.equip-card__text {
    position: relative;
    z-index: 1;
    max-width: 254px;
}
.equip-card__text h3,
.equip-card__text .equip-card__title {
    font-size: 20px;
    line-height: 28px;
    font-weight: 600;
    margin: 0 0 10px;
}
.equip-card__text p:not(.equip-card__title) {
    font-size: 15px;
    line-height: 22px;
    opacity: 0.8;
}
.equip-card__cutout {
    position: absolute;
    right: 0;
    top: 6px;
    width: 140px;
    height: 190px;
    object-fit: contain;
    object-position: right center;
    pointer-events: none;
    z-index: 0;
}
.team-card {
    background: transparent;
    border-radius: 0;
    overflow: hidden;
    text-align: center;
    width: 274px;
}
.team-card__photo-wrap {
    position: relative;
    height: 296px;
    overflow: hidden;
}
.team-card__photo {
    width: 100%;
    height: 296px;
    object-fit: cover;
    object-position: center top;
}
.team-card__rating {
    position: absolute;
    left: 50%;
    bottom: 14px;
    transform: translateX(-50%);
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(2px);
    padding: 5px 12px;
    font-size: 14px;
    font-weight: 600;
    line-height: 24px;
    white-space: nowrap;
}
.team-card__body {
    background: #fff;
    padding: 14px;
}
.team-card__stats {
    display: flex;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 12px;
}
.team-card__stats span {
    border: 1px solid rgba(0, 12, 29, 0.1);
    padding: 8px 14px;
    font-size: 14px;
    font-weight: 500;
}
.team-card__body h3,
.team-card__body .team-card__name {
    font-size: 16px;
    font-weight: 600;
}
.team-card__body .team-card__name {
    margin: 0;
}
.team-card__role {
    font-size: 13px;
    color: var(--primary);
    font-weight: 500;
    margin: 4px 0;
}
.team-card__exp {
    font-size: 12px;
    opacity: 0.6;
}

/* REVIEWS */
.reviews-nav {
    display: flex;
    gap: 8px;
}
.reviews-nav__btn {
    width: 44px;
    height: 44px;
    border: 1px solid var(--border-soft);
    background: #fff;
    font-size: 18px;
    cursor: pointer;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.reviews-nav__btn:hover {
    background: var(--bg-soft);
}
.reviews-track {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 4px;
}
.reviews-track::-webkit-scrollbar { display: none; }
.review-card {
    flex: 0 0 calc(33.333% - 14px);
    min-width: 280px;
    background: var(--bg-soft);
    padding: 28px;
    border-radius: 0;
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.review-card__stars {
    color: #FFB800;
    font-size: 18px;
    letter-spacing: 2px;
}
.review-card__text {
    font-size: 14px;
    line-height: 22px;
    flex: 1;
}
.review-card__footer {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 12px;
    font-size: 13px;
}
.review-card__footer strong {
    display: block;
    font-size: 14px;
}
.review-card__footer span {
    opacity: 0.6;
    font-size: 12px;
}
.review-card__service {
    background: var(--primary);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    padding: 4px 8px;
    white-space: nowrap;
}
.reviews-ratings {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    margin-top: 40px;
    padding-top: 32px;
    border-top: 1px solid var(--border-soft);
}
.reviews-rating__header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}
.reviews-rating__logo {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 800;
    color: #fff;
    flex-shrink: 0;
}
.reviews-rating__logo--yandex { background: #FF0000; }
.reviews-rating__logo--2gis { background: #2BA027; }
.reviews-rating__name {
    font-size: 15px;
    font-weight: 600;
    flex: 1;
}
.reviews-rating__score {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary);
}
.reviews-rating__bar {
    height: 8px;
    background: var(--bg-soft);
    border-radius: 0;
    overflow: hidden;
}
.reviews-rating__fill {
    height: 100%;
    background: var(--primary);
    border-radius: 0;
}

/* VIDEO REVIEWS */
.video-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.video-card__thumb {
    position: relative;
    aspect-ratio: 16/10;
    background: var(--bg-soft);
    margin-bottom: 12px;
    overflow: hidden;
}
.video-card__placeholder {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #d0e8f2 0%, var(--bg-soft) 100%);
}
/* Legacy thumb-overlay play — only for old .video-card__thumb markup */
.video-card__thumb .video-card__play {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(3, 21, 55, 0.2);
    border: none;
    cursor: pointer;
    transition: background 0.2s;
}
.video-card__thumb .video-card__play span {
    width: 52px;
    height: 52px;
    background: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: var(--primary);
}
.video-card__thumb .video-card__play:hover { background: rgba(3, 21, 55, 0.35); }
.video-card__duration {
    position: absolute;
    bottom: 8px;
    right: 8px;
    background: rgba(3, 21, 55, 0.7);
    color: #fff;
    font-size: 12px;
    padding: 2px 8px;
}
.video-card h3 {
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}

/* STEPS — legacy unscoped rules removed; see .section-steps below / steps-faq-seo.css */

/* FAQ */
.faq-list {
    max-width: 800px;
}
.faq-item {
    border-bottom: 1px solid var(--border-soft);
}
.faq-item__question {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 20px 0;
    background: none;
    border: none;
    font-family: var(--font-main);
    font-size: 16px;
    font-weight: 500;
    text-align: left;
    cursor: pointer;
    color: var(--text-dark);
}
.faq-item__icon {
    flex-shrink: 0;
    transition: transform 0.25s;
}
.faq-item.is-open .faq-item__icon {
    transform: rotate(180deg);
}
.faq-item__answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}
.faq-item.is-open .faq-item__answer {
    max-height: 200px;
}
.faq-item__answer p {
    padding-bottom: 20px;
    font-size: 14px;
    line-height: 22px;
    opacity: 0.7;
}

/* SEO */
.section-seo {
    padding: 60px 0;
    background: var(--bg-soft);
}
.seo-block h2 {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 16px;
}
.seo-block p {
    font-size: 14px;
    line-height: 22px;
    opacity: 0.8;
    margin-bottom: 12px;
}
.seo-block a {
    color: var(--primary);
    font-weight: 500;
}

/* CTA BOTTOM — layout in assets/css/chrome.css (Figma 58:406) */

/* FOOTER */
.site-footer {
    background: var(--text-dark);
    color: #fff;
}
.footer-main {
    padding: 60px 0 40px;
}
.footer-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
    gap: 40px;
}
.footer-logo img {
    height: 56px;
    filter: brightness(0) invert(1);
    margin-bottom: 16px;
}
.footer-desc {
    font-size: 14px;
    line-height: 22px;
    opacity: 0.7;
    margin-bottom: 20px;
}
.footer-socials {
    display: flex;
    gap: 8px;
}
.footer-socials .social-icon img {
    width: 36px;
    height: 36px;
}
.footer-col h4 {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 16px;
}
.footer-col ul li {
    margin-bottom: 10px;
}
.footer-col ul a {
    font-size: 14px;
    opacity: 0.7;
    transition: opacity 0.2s;
}
.footer-col ul a:hover { opacity: 1; }
.footer-phone {
    display: block;
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 8px;
}
.footer-hours,
.footer-address {
    font-size: 14px;
    opacity: 0.7;
    margin-bottom: 6px;
}
.footer-wa {
    margin-top: 16px;
    min-width: 0;
    height: 44px;
    padding: 0 20px;
    font-size: 13px;
}
.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.1);
    padding: 20px 0;
}
.footer-bottom .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}
.footer-bottom p {
    font-size: 13px;
    opacity: 0.5;
}
.footer-bottom__links {
    display: flex;
    gap: 24px;
}
.footer-bottom__links a {
    font-size: 13px;
    opacity: 0.5;
}
.footer-bottom__links a:hover { opacity: 0.8; }

.contact-info .phone {
    font-weight: 700;
    font-size: 22px;
    letter-spacing: -0.3px;
    margin-right: 20px;
    color: inherit;
}

/* ================
   SECTIONS RESPONSIVE
================ */
@media (max-width: 1200px) {
    .team-specialists { grid-template-columns: repeat(3, 1fr); }
    .team-layout { grid-template-columns: 1fr; }
    .video-grid { grid-template-columns: repeat(2, 1fr); }
    .footer-grid { grid-template-columns: repeat(2, 1fr); }
    .review-card { flex: 0 0 calc(50% - 10px); }
    .messenger-cta { grid-template-columns: 1fr; padding: 32px; }
    .messenger-cta__media { display: none; }
}

@media (max-width: 900px) {
    .section { padding: 56px 0; }
    .section-title { font-size: 26px; line-height: 34px; }
    .section-calculator__lead { font-size: 26px; line-height: 34px; }
    .section-header--row {
        flex-direction: column;
        align-items: flex-start;
    }

    /* CLN-M04: mobile advantages — Figma 120:1496 */
    .section-advantages .section-header {
        gap: 10px;
        margin-bottom: 26px;
        max-width: none;
    }
    .section-advantages .section-eyebrow {
        font-size: 13px;
        line-height: 20px;
        opacity: 0.7;
    }
    .section-advantages .section-title {
        font-size: 24px;
        line-height: 34px;
    }
    .section-advantages .advantages-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .section-advantages .advantages-side {
        grid-template-columns: 1fr;
        grid-template-rows: none;
        gap: 12px;
    }
    .section-advantages .advantages-card {
        overflow: hidden;
        width: 100%;
    }
    .section-advantages .advantages-card--main {
        height: 382px;
        min-height: 382px;
        padding: 16px;
    }
    .section-advantages .advantages-card__copy {
        gap: 12px;
    }
    .section-advantages .advantages-card--main .advantages-card__lead {
        font-size: 20px;
        line-height: 30px;
    }
    .section-advantages .advantages-card--main p:not(.advantages-card__lead) {
        font-size: 14px;
        line-height: 22px;
    }
    .section-advantages .advantages-card--main .btn-white {
        width: 100%;
        min-width: 0;
        height: 46px;
        padding: 0 16px;
        font-size: 14px;
    }
    .section-advantages .advantages-card--small {
        height: 178px;
        padding: 16px;
    }
    .section-advantages .advantages-card--wide {
        height: 278px;
        padding: 16px;
    }
    .section-advantages .advantages-card__title {
        font-size: 17px;
        line-height: 25px;
        max-width: 100%;
    }
    .section-advantages .advantages-card__text {
        max-width: 100%;
        gap: 10px;
        width: 100%;
    }
    .section-advantages .advantages-card--wide .advantages-card__title {
        max-width: 100%;
    }
    .section-advantages .advantages-card__desc {
        font-size: 13px;
        line-height: 20px;
    }
    .section-advantages .advantages-card__deco-wide { display: none; }
    .section-advantages .advantages-card__media--van {
        right: 0;
        top: auto;
        bottom: -4px;
        width: 207px;
        height: 121px;
    }
    .section-advantages .advantages-card__media--chem {
        left: calc(50% - 110px);
        top: 76px;
        width: 288px;
        height: 108px;
    }
    .section-advantages .advantages-card__media-flip {
        width: 288px;
        height: 108px;
    }
    .section-advantages .advantages-card__media--sofa {
        left: calc(50% - 144px);
        right: auto;
        top: 149px;
        width: 309px;
        height: 170px;
    }

    /* CLN-M04: mobile services — Figma 122:314 */
    .section-services .section-header {
        display: flex;
        flex-direction: column;
        gap: 10px;
        margin-bottom: 26px;
        max-width: none;
    }
    .section-services .section-eyebrow {
        font-size: 13px;
        line-height: 20px;
        opacity: 0.7;
        text-transform: none;
        letter-spacing: 0;
        margin-bottom: 0;
    }
    .section-services .section-title {
        font-size: 24px;
        line-height: 34px;
    }
    .section-services .services-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .section-services .service-card {
        height: 248px;
        min-height: 248px;
        padding: 14px;
        overflow: hidden;
        width: 100%;
    }
    .section-services .service-card--featured {
        grid-column: auto;
        height: 318px;
        min-height: 318px;
    }
    .section-services .service-card__inner,
    .section-services .service-card--featured .service-card__inner {
        max-width: 100%;
    }
    .section-services .service-card__tags {
        gap: 4px;
    }
    .section-services .service-card--featured .service-card__tags {
        gap: 8px;
    }
    .section-services .service-card__tags-row {
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: flex-start;
        gap: 4px;
    }
    .section-services .service-card__tag {
        font-size: 13px;
        line-height: 18px;
        white-space: nowrap;
        padding: 7px 10px;
    }
    .section-services .service-card__tag img {
        width: 16px;
        height: 16px;
        flex: 0 0 16px;
    }
    .section-services .service-card__badge {
        font-size: 13px;
        line-height: 16px;
        padding: 11px 16px;
    }
    .section-services .service-card__footer h3,
    .section-services .service-card__footer .service-card__title {
        font-size: 22px;
        line-height: 30px;
        margin-bottom: 14px;
    }
    .section-services .service-card__price {
        font-size: 18px;
        line-height: 24px;
    }
    .section-services .service-card__price-row {
        flex-wrap: nowrap;
        width: 100%;
    }
    .section-services .service-card__btn {
        min-width: 0;
        height: 42px;
        padding: 0 28px;
        font-size: 14px;
    }
    .section-services .service-tabs {
        max-width: 240px;
        gap: 8px;
        margin-bottom: 14px;
    }
    .section-services .service-tabs__label,
    .section-services .service-tabs__btn {
        font-size: 22px;
        line-height: 30px;
    }
    .section-services .service-card--general .service-card__cutout-wrap {
        right: 0;
        top: 0;
        width: 203px;
        height: 100%;
    }
    .section-services .service-card--general .service-card__cutout {
        width: 248px;
        height: 203px;
    }
    .section-services .service-card--repair .service-card__cutout-wrap {
        right: 0;
        top: 28px;
        width: 161px;
        height: 220px;
    }
    .section-services .service-card--repair .service-card__cutout {
        position: absolute;
        width: 205.02%;
        height: 100%;
        left: -49.09%;
        top: 0;
        object-fit: cover;
    }
    .section-services .service-card--dry .service-card__cutout-wrap {
        right: 0;
        top: 12px;
        width: 185px;
        height: 236px;
    }
    .section-services .service-card--windows .service-card__cutout-wrap {
        right: 0;
        top: 27px;
        width: 173px;
        height: 221px;
    }
    .section-services .service-card--windows .service-card__cutout {
        position: absolute;
        width: 218.66%;
        height: 171.18%;
        left: -55.78%;
        top: -15.72%;
        object-fit: cover;
    }
    .section-services .service-card--featured .service-card__deco {
        right: -60px;
        top: -40px;
        width: 220px;
        max-width: none;
        opacity: 0.9;
    }
    .section-services .service-card--featured .service-card__cutout-wrap {
        right: -40px;
        top: 0;
        width: 200px;
        height: 100%;
    }
    .section-services .service-card--featured .service-card__cutout--popular {
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: right bottom;
    }
    .team-card { width: 100%; }
    .equip-card__cutout { width: 120px; height: 160px; }

    .calculator__form { grid-template-columns: 1fr; }
    .calculator { padding: 24px; }

    .how-clean__content { grid-template-columns: 1fr; }
    .how-clean__cta { flex-direction: column; text-align: center; }

    .messenger-cta__title { font-size: 24px; line-height: 32px; }
    .messenger-cta__buttons { flex-direction: column; }
    .messenger-cta__btn-wa,
    .messenger-cta__btn-tg { width: 100%; }

    .portfolio-grid { grid-template-columns: 1fr; }
    .team-specialists { grid-template-columns: 1fr; }
    .team-equipment { grid-template-columns: 1fr; }
    .reviews-ratings { grid-template-columns: 1fr; }
    .video-grid { grid-template-columns: 1fr 1fr; }


    .footer-grid { grid-template-columns: 1fr; gap: 32px; }
    .footer-bottom .container { flex-direction: column; text-align: center; }
    .review-card { flex: 0 0 85%; }
}

@media (max-width: 600px) {
    .portfolio-grid,
    .team-equipment,
    .video-grid { grid-template-columns: 1fr; }
    .calculator__price { font-size: 32px; }
    .portfolio-card__half img { height: 160px; }
    /* CLN-M04: keep Figma 122:314 card metrics from ≤900 block */
    .equip-card__text { max-width: 58%; }
}

/* ============================================================
   CALCULATOR POLISH (Figma 54:340) — scoped overrides
   ============================================================ */
.section-calculator .section-calculator__header {
    margin-bottom: 12px;
    max-width: 649px;
}
.section-calculator .section-eyebrow {
    text-transform: none;
    letter-spacing: 0;
    margin-bottom: 12px;
}
.section-calculator__lead {
    margin: 0 0 12px;
    font-size: 32px;
    line-height: 42px;
    font-weight: 600;
    color: var(--text-dark);
}
.section-calculator__desc {
    max-width: 875px;
    font-size: 16px;
    line-height: 24px;
    margin: 0 0 32px;
    color: var(--text-dark);
}
.section-calculator .calculator {
    background: transparent;
    padding: 0;
}
.section-calculator .calculator__form {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 32px;
}
.section-calculator .calculator__fields {
    flex: 1 1 858px;
    max-width: 858px;
    gap: 34px 18px;
    display: flex;
    flex-direction: column;
}
.section-calculator .calculator__row {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
}
.section-calculator .calculator__row--2 > .calc-field {
    flex: 1 1 calc(50% - 9px);
    min-width: 280px;
}
.section-calculator .calc-field label {
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    margin-bottom: 10px;
    color: var(--text-dark);
}
.section-calculator .calc-select select {
    width: 100%;
    height: 54px;
    padding: 0 44px 0 16px;
    border: 1px solid #e2e8f0;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%231BB2E6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center;
    background-size: 24px;
    appearance: none;
    font-family: var(--font-main);
    font-size: 16px;
    line-height: 24px;
    color: var(--text-dark);
    border-radius: 0;
    cursor: pointer;
}
.section-calculator .calc-slider__track-wrap {
    padding: 8px 0;
}
.section-calculator .calc-slider__range {
    width: 100%;
    height: 4px;
    margin: 0;
    appearance: none;
    background: linear-gradient(to right, var(--primary) 0%, var(--primary) var(--pct, 50%), #e2e8f0 var(--pct, 50%), #e2e8f0 100%);
    border-radius: 2px;
    cursor: pointer;
}
.section-calculator .calc-slider__range::-webkit-slider-thumb {
    appearance: none;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--primary);
    border: 3px solid #fff;
    box-shadow: 0 0 0 1px rgba(27, 178, 230, 0.3);
    cursor: pointer;
}
.section-calculator .calc-slider__range::-moz-range-thumb {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--primary);
    border: 3px solid #fff;
    box-shadow: 0 0 0 1px rgba(27, 178, 230, 0.3);
    cursor: pointer;
}
.section-calculator .calc-slider__labels {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 8px;
}
.section-calculator .calc-slider__edge {
    flex: 0 0 52px;
    font-size: 16px;
    line-height: 24px;
}
.section-calculator .calc-slider__edge--max {
    text-align: right;
}
.section-calculator .calc-slider__input {
    flex: 0 0 80px;
    width: 80px;
    height: 44px;
    padding: 0 8px;
    border: 1px solid #e2e8f0;
    background: #fff;
    font-family: var(--font-main);
    font-size: 15px;
    line-height: 22px;
    text-align: center;
    color: var(--text-dark);
    opacity: 0.85;
    border-radius: 0;
    -moz-appearance: textfield;
}
.section-calculator .calc-slider__input::-webkit-outer-spin-button,
.section-calculator .calc-slider__input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.section-calculator .calc-extras {
    width: 100%;
    border: none;
    padding: 0;
    margin: 0;
}
.section-calculator .calc-extras legend {
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    margin-bottom: 10px;
    padding: 0;
}
.section-calculator .calc-extras__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px 82px;
}
.section-calculator .calc-extras__col {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.section-calculator .calc-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    line-height: 24px;
    margin: 0;
    cursor: pointer;
    user-select: none;
}
.section-calculator .calc-checkbox input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}
.section-calculator .calc-checkbox__box {
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    border: 1px solid #e2e8f0;
    border-radius: 2px;
    background: #fff;
    position: relative;
}
.section-calculator .calc-checkbox input:checked + .calc-checkbox__box {
    background: var(--primary);
    border-color: var(--primary);
}
.section-calculator .calc-checkbox input:checked + .calc-checkbox__box::after {
    content: '';
    position: absolute;
    left: 5px;
    top: 2px;
    width: 6px;
    height: 10px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.section-calculator .calculator__result {
    flex: 0 0 430px;
    max-width: 430px;
    background: #dcf6ff;
    border: 1px solid var(--primary);
    padding: 28px;
    gap: 22px;
}
.section-calculator .calculator__price-block {
    padding-bottom: 22px;
    border-bottom: 1px solid rgba(3, 21, 55, 0.2);
    display: flex;
    flex-direction: column;
    gap: 22px;
}
.section-calculator .calculator__price-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.section-calculator .calculator__price-label {
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    opacity: 1;
    max-width: 192px;
}
.section-calculator .calculator__price {
    display: flex;
    align-items: baseline;
    gap: 4px;
    margin: 0;
    white-space: nowrap;
}
.section-calculator .calculator__price-num {
    font-size: 44px;
    font-weight: 700;
    line-height: 48px;
    color: var(--primary);
}
.section-calculator .calculator__price-cur {
    font-size: 18px;
    font-weight: 700;
    line-height: 36px;
    color: var(--primary);
}
.section-calculator .calculator__note {
    display: none;
}
.section-calculator .calculator__discount {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.section-calculator .calculator__discount-text {
    font-size: 15px;
    line-height: 22px;
    margin: 0;
}
.section-calculator .calculator__discount-badge {
    display: inline-block;
    padding: 0 6px;
    background: var(--primary);
    color: #fff;
    border-radius: 2px;
    line-height: 22px;
}
.section-calculator .calc-toggle {
    position: relative;
    display: inline-flex;
    cursor: pointer;
    flex-shrink: 0;
}
.section-calculator .calc-toggle input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}
.section-calculator .calc-toggle__track {
    display: block;
    width: 74px;
    height: 32px;
    background: #e2e8f0;
    border-radius: 16px;
    position: relative;
    transition: background 0.2s ease;
}
.section-calculator .calc-toggle__thumb {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 24px;
    height: 24px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
    transition: transform 0.2s ease;
}
.section-calculator .calc-toggle input:checked + .calc-toggle__track {
    background: var(--primary);
}
.section-calculator .calc-toggle input:checked + .calc-toggle__track .calc-toggle__thumb {
    transform: translateX(42px);
}
.section-calculator .calculator__lead-title {
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    margin: 0 0 16px;
}
.section-calculator .calculator__lead-fields {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.section-calculator .calculator__lead input {
    height: 54px;
    padding: 0 16px;
    border: none;
    background: #fff;
    font-family: var(--font-main);
    font-size: 16px;
    line-height: 24px;
    color: var(--text-dark);
    border-radius: 0;
}
.section-calculator .calculator__lead input::placeholder {
    color: var(--text-dark);
    opacity: 0.6;
}
.section-calculator .calculator__submit {
    min-width: 0;
    width: 100%;
    height: 54px;
    padding: 18px 70px;
}
.section-calculator .calculator__privacy {
    margin: 16px 0 0;
    font-size: 14px;
    line-height: 22px;
    opacity: 0.5;
}
.section-calculator .calculator__privacy a {
    text-decoration: underline;
}
.section-calculator .visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 1200px) {
    .section-calculator .calculator__form {
        flex-direction: column;
    }
    .section-calculator .calculator__fields,
    .section-calculator .calculator__result {
        flex: 1 1 auto;
        max-width: 100%;
        width: 100%;
    }
    .section-calculator .calc-extras__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px 24px;
    }
}

@media (max-width: 768px) {
    .section-calculator .calculator__row--2 > .calc-field {
        flex: 1 1 100%;
        min-width: 0;
    }
    .section-calculator .calc-extras__grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .section-calculator .calculator__price-row {
        flex-direction: column;
        align-items: flex-start;
    }
    .section-calculator .calculator__price-num {
        font-size: 36px;
        line-height: 42px;
    }
}

@media (max-width: 600px) {
    .section-calculator .calculator__result {
        padding: 20px;
    }
    .section-calculator .calculator__price-num {
        font-size: 32px;
        line-height: 38px;
    }
}

/* ============================================================
   CLN-004: How-we-clean (Figma 80:168) + Messenger CTA (164:1043)
   ============================================================ */

/* --- How we clean --- */
.section-how-clean {
    padding: 80px 0;
}
.section-how-clean .section-header {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 36px;
    max-width: 649px;
}
.section-how-clean .section-eyebrow {
    text-transform: none;
    letter-spacing: 0;
    margin-bottom: 0;
}
.section-how-clean .how-clean {
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.section-how-clean .how-clean__intro {
    max-width: 875px;
    font-size: 16px;
    line-height: 24px;
    color: var(--text-dark);
}
.section-how-clean .how-clean__tabs-wrap {
    background: #f1f4f6;
    padding: 3px;
    width: 100%;
}
.section-how-clean .how-clean__tabs {
    display: flex;
    gap: 2px;
    border-bottom: none;
    margin-bottom: 0;
}
.section-how-clean .how-clean__tab {
    flex: 1 1 0;
    min-width: 0;
    height: 48px;
    padding: 12px 16px;
    background: transparent;
    border: none;
    border-bottom: none;
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: var(--text-dark);
    opacity: 0.5;
    cursor: pointer;
    white-space: nowrap;
    text-align: center;
}
.section-how-clean .how-clean__tab.is-active {
    background: var(--primary);
    color: #fff;
    opacity: 1;
    box-shadow: 0 3px 4px rgba(0, 0, 0, 0.12), 0 3px 0.5px rgba(0, 0, 0, 0.04);
}
.section-how-clean .how-clean__panel {
    display: none;
}
.section-how-clean .how-clean__panel.is-active {
    display: block;
}
.section-how-clean .how-clean__content {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    grid-template-columns: none;
}
.section-how-clean .how-clean__image {
    flex: 0 0 calc(50% - 8px);
    max-width: calc(50% - 8px);
    width: calc(50% - 8px);
    height: 530px;
    min-height: 530px;
    max-height: 530px;
    align-self: flex-start;
    overflow: hidden;
    background: #e8edf0;
}
.section-how-clean .how-clean__image img {
    width: 100%;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
.section-how-clean .how-clean__panel-inner {
    flex: 0 0 calc(50% - 8px);
    max-width: calc(50% - 8px);
    background: #f1f4f6;
    padding: 28px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 530px;
}
.section-how-clean .how-clean__panel-body {
    display: flex;
    flex-direction: column;
    gap: 28px;
    flex: 1 1 auto;
}
.section-how-clean .how-clean__filters {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 0;
    padding-bottom: 28px;
    border-bottom: 1px solid rgba(3, 21, 55, 0.14);
}
.section-how-clean .how-clean__filter {
    height: 48px;
    padding: 5px 18px;
    background: transparent;
    border: none;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: var(--text-dark);
    opacity: 0.7;
    cursor: pointer;
    white-space: nowrap;
}
.section-how-clean .how-clean__filter.is-active {
    background: #fff;
    opacity: 1;
    color: var(--text-dark);
}
.section-how-clean .how-clean__checklist {
    display: none;
}
.section-how-clean .how-clean__checklist.is-active {
    display: block;
}
.section-how-clean .how-clean__checklist ul {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.section-how-clean .how-clean__checklist li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 16px;
    line-height: 24px;
}
.section-how-clean .how-clean__checklist img {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    margin-top: 2px;
}
.section-how-clean .how-clean__order {
    min-width: 0;
    width: 100%;
    height: 54px;
    margin-top: 28px;
    flex-shrink: 0;
}

/* --- Messenger CTA (Figma 164:1043) --- */
.section-messenger-cta {
    padding: 74px 0 80px;
    overflow: visible;
}
.section-messenger-cta .container {
    overflow: visible;
}
.section-messenger-cta .messenger-cta {
    position: relative;
    background: var(--primary);
    color: #fff;
    padding: 36px;
    height: 348px;
    min-height: 348px;
    box-sizing: border-box;
    overflow: visible;
    display: block;
    grid-template-columns: none;
}
.section-messenger-cta .messenger-cta__bg {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
}
.section-messenger-cta .messenger-cta__stroke {
    position: absolute;
    top: 0;
    left: 705px;
    width: 615px;
    height: 418px;
    max-width: none;
    object-fit: fill;
    opacity: 1;
}
.section-messenger-cta .messenger-cta__phone-wrap {
    position: absolute;
    top: -74px;
    left: 775px;
    width: 545px;
    height: 422px;
    overflow: hidden;
    pointer-events: none;
    z-index: 2;
}
.section-messenger-cta .messenger-cta__phone-rotate {
    position: absolute;
    left: 0;
    top: -46.69px;
    width: 594.95px;
    height: 562.55px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.section-messenger-cta .messenger-cta__phone-frame {
    width: 507px;
    height: 464.47px;
    position: relative;
    overflow: hidden;
    flex: none;
    transform: rotate(-12.41deg);
}
.section-messenger-cta .messenger-cta__phone {
    position: absolute;
    left: -32.34%;
    top: -9.28%;
    width: 162.15%;
    height: 132.7%;
    max-width: none;
    object-fit: cover;
    filter: none;
    transform: none;
}
.section-messenger-cta .messenger-cta__content {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 658px;
    display: flex;
    flex-direction: column;
    gap: 72px;
}
.section-messenger-cta .messenger-cta__text-block {
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.section-messenger-cta .messenger-cta__title {
    font-size: 32px;
    line-height: 42px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 0;
    max-width: none;
    display: flex;
    flex-direction: column;
}
.section-messenger-cta .messenger-cta__text {
    font-size: 16px;
    line-height: 24px;
    opacity: 1;
    max-width: none;
    margin-bottom: 0;
}
.section-messenger-cta .messenger-cta__text strong {
    font-weight: 500;
}
.section-messenger-cta .messenger-cta__buttons {
    display: flex;
    gap: 14px;
    flex-wrap: nowrap;
    width: 100%;
}
.section-messenger-cta .messenger-cta__btn-wa,
.section-messenger-cta .messenger-cta__btn-tg {
    flex: 1 1 0;
    min-width: 0;
    height: 54px;
    padding: 18px 28px;
    font-size: 16px;
    font-weight: 600;
    gap: 10px;
    justify-content: center;
}
.section-messenger-cta .messenger-cta__btn-tg .btn__icon {
    filter: none;
}

@media (max-width: 1200px) {
    .section-how-clean .how-clean__tab {
        font-size: 14px;
        padding: 12px 10px;
        white-space: normal;
    }
    .section-messenger-cta {
        padding-top: 48px;
    }
    .section-messenger-cta .messenger-cta__phone-wrap {
        width: 420px;
        height: 340px;
        top: -48px;
        left: auto;
        right: 0;
    }
    .section-messenger-cta .messenger-cta__phone-rotate {
        width: 458px;
        height: 453px;
        top: -38px;
    }
    .section-messenger-cta .messenger-cta__phone-frame {
        width: 390px;
        height: 357px;
    }
    .section-messenger-cta .messenger-cta__stroke {
        left: auto;
        right: 0;
        width: 480px;
        height: 320px;
    }
}

@media (max-width: 992px) {
    .section-how-clean .how-clean__content {
        flex-direction: column;
        gap: 12px;
    }
    .section-how-clean .how-clean__image,
    .section-how-clean .how-clean__panel-inner {
        flex: 1 1 auto;
        max-width: 100%;
        width: 100%;
    }
    .section-how-clean .how-clean__image {
        height: 320px;
        min-height: 320px;
        max-height: 320px;
    }
    .section-how-clean .how-clean__image img {
        min-height: 0;
        max-height: 100%;
    }
    .section-how-clean .how-clean__panel-inner {
        min-height: 0;
    }
    /* Horizontal service chips (Figma 123:736) — scroll, don't wrap */
    .section-how-clean .how-clean__tabs-wrap {
        padding: 2px;
        overflow: hidden;
    }
    .section-how-clean .how-clean__tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .section-how-clean .how-clean__tabs::-webkit-scrollbar {
        display: none;
    }
    .section-how-clean .how-clean__tab {
        flex: 0 0 auto;
        white-space: nowrap;
        height: 42px;
        padding: 12px 18px;
        font-size: 14px;
        line-height: 22px;
    }
    .section-messenger-cta .messenger-cta__content {
        gap: 36px;
        max-width: 100%;
    }
    .section-messenger-cta {
        padding-top: 0;
    }
    .section-messenger-cta .messenger-cta__phone-wrap,
    .section-messenger-cta .messenger-cta__stroke {
        display: none;
    }
}

/* CLN-M05: mobile how-we-clean + messenger CTA — Figma 123:729 / 165:1366 */
@media (max-width: 768px) {
    .section-how-clean {
        padding: 40px 0;
    }
    .section-how-clean .section-header {
        gap: 10px;
        margin-bottom: 26px;
    }
    .section-how-clean .section-eyebrow {
        font-size: 13px;
        line-height: 20px;
        opacity: 0.7;
    }
    .section-how-clean .section-title {
        font-size: 24px;
        line-height: 34px;
    }
    .section-how-clean .how-clean {
        gap: 22px;
    }
    .section-how-clean .how-clean__intro {
        font-size: 14px;
        line-height: 22px;
    }
    .section-how-clean .how-clean__content {
        gap: 12px;
    }
    .section-how-clean .how-clean__image {
        height: 210px;
        min-height: 210px;
        max-height: 210px;
        width: 100%;
    }
    .section-how-clean .how-clean__image img {
        min-height: 0;
        max-height: 100%;
        object-fit: cover;
        object-position: center;
    }
    .section-how-clean .how-clean__panel-inner {
        padding: 16px;
        min-height: 0;
        height: auto;
    }
    .section-how-clean .how-clean__panel-body {
        gap: 18px;
    }
    .section-how-clean .how-clean__filters {
        gap: 4px;
        padding-bottom: 18px;
        flex-wrap: wrap;
        align-items: center;
    }
    .section-how-clean .how-clean__filter {
        font-size: 14px;
        line-height: 22px;
        padding: 5px 14px;
        height: 42px;
    }
    .section-how-clean .how-clean__checklist ul {
        gap: 10px;
    }
    .section-how-clean .how-clean__checklist li {
        align-items: flex-start;
        gap: 8px;
        font-size: 14px;
        line-height: 22px;
    }
    .section-how-clean .how-clean__checklist img {
        width: 18px;
        height: 18px;
        margin-top: 2px;
    }
    .section-how-clean .how-clean__order {
        height: 46px;
        min-height: 46px;
        margin-top: 18px;
        padding: 16px 50px;
        font-size: 14px;
    }

    .section-messenger-cta {
        padding: 0 0 40px;
        overflow: hidden;
    }
    .section-messenger-cta .container {
        overflow: hidden;
    }
    .section-messenger-cta .messenger-cta {
        padding: 16px;
        height: 624px;
        min-height: 624px;
        overflow: hidden;
    }
    .section-messenger-cta .messenger-cta__stroke {
        display: block;
        top: auto;
        left: auto;
        right: -80px;
        bottom: -40px;
        width: 420px;
        height: 400px;
        opacity: 0.95;
        transform: rotate(6.8deg);
    }
    .section-messenger-cta .messenger-cta__phone-wrap {
        display: block;
        top: auto;
        left: 50%;
        right: auto;
        bottom: 0;
        width: 100%;
        max-width: 330px;
        height: 279px;
        transform: translateX(-50%);
        overflow: hidden;
        z-index: 2;
    }
    .section-messenger-cta .messenger-cta__phone-rotate {
        left: -15px;
        top: -31px;
        width: 393px;
        height: 372px;
    }
    .section-messenger-cta .messenger-cta__phone-frame {
        width: 335px;
        height: 307px;
    }
    .section-messenger-cta .messenger-cta__content {
        gap: 16px;
        max-width: 100%;
        position: relative;
        z-index: 3;
    }
    .section-messenger-cta .messenger-cta__text-block {
        gap: 16px;
    }
    .section-messenger-cta .messenger-cta__title {
        font-size: 24px;
        line-height: 34px;
    }
    .section-messenger-cta .messenger-cta__text {
        font-size: 14px;
        line-height: 22px;
    }
    .section-messenger-cta .messenger-cta__buttons {
        flex-direction: column;
        gap: 10px;
        width: 100%;
    }
    .section-messenger-cta .messenger-cta__btn-wa,
    .section-messenger-cta .messenger-cta__btn-tg {
        width: 100%;
        flex: none;
        height: 46px;
        min-height: 46px;
        min-width: 0;
        padding: 18px 24px;
        font-size: 14px;
        gap: 10px;
    }
    .section-messenger-cta .messenger-cta__btn-wa .btn__icon,
    .section-messenger-cta .messenger-cta__btn-tg .btn__icon {
        width: 20px;
        height: 20px;
        flex: 0 0 20px;
    }
}

/* ================
   CLEANING TYPES COMPARISON (Figma 58:354)
================ */
.section-cleaning-types {
    padding: 80px 0;
}
.section-cleaning-types .section-header {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 36px;
    max-width: 649px;
}
.section-cleaning-types .section-eyebrow {
    text-transform: none;
    letter-spacing: 0;
    line-height: 20px;
    margin-bottom: 0;
}
.section-cleaning-types .section-title {
    margin: 0;
}
.section-cleaning-types .cleaning-types__tabs {
    display: none;
    gap: 2px;
    margin-bottom: 18px;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    background: #f1f4f6;
    padding: 2px;
    max-width: 100%;
}
.section-cleaning-types .cleaning-types__tabs::-webkit-scrollbar {
    display: none;
}
.section-cleaning-types .cleaning-types__tab {
    flex: 0 0 auto;
    min-width: 0;
    height: 42px;
    padding: 0 18px;
    border: none;
    background: transparent;
    font-family: var(--font-main);
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    color: var(--text-dark);
    opacity: 0.5;
    white-space: nowrap;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
}
.section-cleaning-types .cleaning-types__tab.is-active {
    background: var(--primary);
    color: #fff;
    opacity: 1;
    box-shadow:
        0 3px 4px rgba(0, 0, 0, 0.12),
        0 3px 0.5px rgba(0, 0, 0, 0.04);
}
.section-cleaning-types .cleaning-types__table {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 315px 315px 315px;
    gap: 16px;
    background: #f1f4f6;
    padding: 26px 0;
    align-items: start;
}
.section-cleaning-types .cleaning-types__labels {
    padding: 26px;
    border-radius: 10px;
}
.section-cleaning-types .cleaning-types__labels-head {
    display: flex;
    align-items: flex-end;
    min-height: 192px;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(0, 12, 29, 0.15);
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 18px;
}
.section-cleaning-types .cleaning-types__row-label {
    display: flex;
    align-items: flex-start;
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid rgba(0, 12, 29, 0.1);
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    white-space: nowrap;
}
.section-cleaning-types .cleaning-types__row-label:last-child {
    margin-bottom: 0;
}
.section-cleaning-types .cleaning-types__row-label:nth-child(4),
.section-cleaning-types .cleaning-types__row-label:nth-child(5),
.section-cleaning-types .cleaning-types__row-label:nth-child(7),
.section-cleaning-types .cleaning-types__row-label:nth-child(8) {
    min-height: 64px;
}
.section-cleaning-types .cleaning-types__row-label:nth-child(6) {
    min-height: 88px;
}
.section-cleaning-types .cleaning-types__col--popular {
    padding-top: 16px;
}
.section-cleaning-types .cleaning-types__col {
    position: relative;
    min-width: 0;
}
.section-cleaning-types .cleaning-types__col-inner {
    padding: 26px;
    height: 100%;
}
.section-cleaning-types .cleaning-types__col--popular .cleaning-types__col-inner {
    background: #fff;
    box-shadow:
        0 10px 10px -5px rgba(0, 0, 0, 0.05),
        0 20px 25px -5px rgba(0, 0, 0, 0.08);
}
.section-cleaning-types .cleaning-types__badge {
    position: absolute;
    top: -16px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 20px;
    border-radius: 50px;
    background: #f77a0c;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    line-height: 24px;
    white-space: nowrap;
}
.section-cleaning-types .cleaning-types__badge img {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
}
.section-cleaning-types .cleaning-types__col-head {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-bottom: 18px;
    margin-bottom: 18px;
    border-bottom: 1px solid rgba(0, 12, 29, 0.15);
    min-height: 192px;
    justify-content: flex-end;
}
.section-cleaning-types .cleaning-types__col-title-wrap {
    display: flex;
    flex-direction: column;
    gap: 10px;
    text-align: center;
}
.section-cleaning-types .cleaning-types__col-title {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
}
.section-cleaning-types .cleaning-types__col-desc {
    margin: 0;
    font-size: 14px;
    line-height: 18px;
    opacity: 0.6;
}
.section-cleaning-types .cleaning-types__col-cta-wrap {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
}
.section-cleaning-types .cleaning-types__col-price {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    text-align: center;
}
.section-cleaning-types .cleaning-types__cta {
    min-width: 0;
    width: 100%;
    height: 46px;
    padding: 16px 50px;
    font-size: 16px;
}
.section-cleaning-types .cleaning-types__col-body {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.section-cleaning-types .cleaning-types__cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(0, 12, 29, 0.1);
    min-height: 40px;
    text-align: center;
}
.section-cleaning-types .cleaning-types__cell-label {
    display: none;
}
.section-cleaning-types .cleaning-types__cell-value {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}
.section-cleaning-types .cleaning-types__cell[data-row="2"],
.section-cleaning-types .cleaning-types__cell[data-row="4"],
.section-cleaning-types .cleaning-types__cell[data-row="5"],
.section-cleaning-types .cleaning-types__cell[data-row="6"] {
    min-height: 64px;
    align-items: center;
    justify-content: flex-start;
}
.section-cleaning-types .cleaning-types__cell[data-row="3"] {
    min-height: 88px;
    align-items: center;
    justify-content: flex-start;
}
.section-cleaning-types .cleaning-types__col--popular .cleaning-types__cell {
    border-bottom-color: rgba(0, 12, 29, 0.15);
}
.section-cleaning-types .cleaning-types__col--popular .cleaning-types__col-head {
    border-bottom-color: rgba(0, 12, 29, 0.15);
}

@media (max-width: 1200px) {
    .section-cleaning-types .cleaning-types__table {
        grid-template-columns: minmax(180px, 1fr) repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 992px) {
    /* Mobile parity — Figma 131:2403 / 131:2342 / 131:2404 / 131:2504 */
    .section-cleaning-types {
        padding: 40px 0;
    }
    .section-cleaning-types .section-header {
        gap: 10px;
        margin-bottom: 26px;
        max-width: none;
    }
    .section-cleaning-types .section-eyebrow {
        font-size: 13px;
        line-height: 20px;
        opacity: 0.7;
    }
    .section-cleaning-types .section-title {
        font-size: 24px;
        line-height: 34px;
    }
    .section-cleaning-types .cleaning-types__tabs {
        display: flex;
    }
    .section-cleaning-types .cleaning-types__table {
        display: flex;
        align-items: stretch;
        gap: 0;
        padding: 16px 6px;
    }
    .section-cleaning-types .cleaning-types__labels {
        display: block;
        flex: 0 0 154px;
        width: 154px;
        padding: 6px 10px;
        border-radius: 10px;
    }
    .section-cleaning-types .cleaning-types__labels-head {
        min-height: 208px;
        padding-bottom: 16px;
        margin-bottom: 0;
        font-size: 14px;
        line-height: 22px;
        align-items: flex-end;
    }
    .section-cleaning-types .cleaning-types__row-label {
        padding-bottom: 14px;
        margin-bottom: 0;
        font-size: 14px;
        font-weight: 500;
        line-height: 22px;
        white-space: normal;
        min-height: 0;
    }
    .section-cleaning-types .cleaning-types__row-label + .cleaning-types__row-label {
        margin-top: 14px;
    }
    .section-cleaning-types .cleaning-types__row-label:nth-child(4) {
        min-height: 80px;
    }
    .section-cleaning-types .cleaning-types__row-label:nth-child(5) {
        min-height: 88px;
    }
    .section-cleaning-types .cleaning-types__row-label:nth-child(6),
    .section-cleaning-types .cleaning-types__row-label:nth-child(7),
    .section-cleaning-types .cleaning-types__row-label:nth-child(8) {
        min-height: 64px;
    }
    .section-cleaning-types .cleaning-types__col {
        display: none;
        flex: 1 1 0;
        min-width: 0;
        padding-top: 0;
    }
    .section-cleaning-types .cleaning-types__col.is-active {
        display: block;
    }
    .section-cleaning-types .cleaning-types__badge {
        display: none;
    }
    .section-cleaning-types .cleaning-types__col-inner {
        padding: 6px 10px;
    }
    .section-cleaning-types .cleaning-types__col--popular .cleaning-types__col-inner {
        box-shadow: none;
        background: transparent;
    }
    .section-cleaning-types .cleaning-types__col-head {
        min-height: 208px;
        gap: 14px;
        padding-bottom: 16px;
        margin-bottom: 0;
        justify-content: flex-start;
    }
    .section-cleaning-types .cleaning-types__col-title-wrap {
        gap: 8px;
    }
    .section-cleaning-types .cleaning-types__col-title {
        font-size: 16px;
        line-height: 24px;
    }
    .section-cleaning-types .cleaning-types__col-desc {
        font-size: 13px;
        line-height: 18px;
    }
    .section-cleaning-types .cleaning-types__col-cta-wrap {
        gap: 8px;
        width: 100%;
    }
    .section-cleaning-types .cleaning-types__col-price {
        font-size: 16px;
        line-height: 24px;
    }
    .section-cleaning-types .cleaning-types__cta {
        height: 42px;
        padding: 0 16px;
        font-size: 14px;
        font-weight: 600;
    }
    .section-cleaning-types .cleaning-types__col-body {
        gap: 14px;
        margin-top: 16px;
    }
    .section-cleaning-types .cleaning-types__cell {
        flex-direction: column;
        align-items: center;
        justify-content: flex-end;
        gap: 0;
        padding-bottom: 14px;
        min-height: 0 !important;
        text-align: center;
    }
    .section-cleaning-types .cleaning-types__cell-label {
        display: none;
    }
    .section-cleaning-types .cleaning-types__cell-value {
        flex: none;
        width: 100%;
        text-align: center;
        font-size: 14px;
        font-weight: 400;
        line-height: 22px;
    }
    .section-cleaning-types .cleaning-types__cell[data-row="2"] {
        min-height: 80px !important;
        justify-content: flex-end;
    }
    .section-cleaning-types .cleaning-types__cell[data-row="3"] {
        min-height: 88px !important;
        justify-content: flex-start;
    }
    .section-cleaning-types .cleaning-types__cell[data-row="4"],
    .section-cleaning-types .cleaning-types__cell[data-row="5"],
    .section-cleaning-types .cleaning-types__cell[data-row="6"] {
        min-height: 64px !important;
        justify-content: flex-start;
    }
}

@media (max-width: 768px) {
    .section-cleaning-types .section-title {
        font-size: 24px;
        line-height: 34px;
    }
}

/* Renovation / general tab row heights (Figma 131:2404 / 131:2504) */
@media (max-width: 992px) {
    .section-cleaning-types .cleaning-types__table:has(.cleaning-types__col[data-compare-col="renovation"].is-active) .cleaning-types__row-label:nth-child(5) {
        min-height: 124px;
    }
    .section-cleaning-types .cleaning-types__table:has(.cleaning-types__col[data-compare-col="renovation"].is-active) .cleaning-types__row-label:nth-child(4) {
        min-height: 58px;
    }
    .section-cleaning-types .cleaning-types__table:has(.cleaning-types__col[data-compare-col="renovation"].is-active) .cleaning-types__row-label:nth-child(6) {
        min-height: 58px;
    }
    .section-cleaning-types .cleaning-types__table:has(.cleaning-types__col[data-compare-col="renovation"].is-active) .cleaning-types__row-label:nth-child(7),
    .section-cleaning-types .cleaning-types__table:has(.cleaning-types__col[data-compare-col="renovation"].is-active) .cleaning-types__row-label:nth-child(8) {
        min-height: 80px;
    }
    .section-cleaning-types .cleaning-types__col[data-compare-col="renovation"] .cleaning-types__cell[data-row="2"] {
        min-height: 58px !important;
    }
    .section-cleaning-types .cleaning-types__col[data-compare-col="renovation"] .cleaning-types__cell[data-row="3"] {
        min-height: 124px !important;
    }
    .section-cleaning-types .cleaning-types__col[data-compare-col="renovation"] .cleaning-types__cell[data-row="4"] {
        min-height: 58px !important;
    }
    .section-cleaning-types .cleaning-types__col[data-compare-col="renovation"] .cleaning-types__cell[data-row="5"],
    .section-cleaning-types .cleaning-types__col[data-compare-col="renovation"] .cleaning-types__cell[data-row="6"] {
        min-height: 80px !important;
    }
    .section-cleaning-types .cleaning-types__col[data-compare-col="general"] .cleaning-types__col-head,
    .section-cleaning-types .cleaning-types__table:has(.cleaning-types__col[data-compare-col="general"].is-active) .cleaning-types__labels-head,
    .section-cleaning-types .cleaning-types__col[data-compare-col="renovation"] .cleaning-types__col-head,
    .section-cleaning-types .cleaning-types__table:has(.cleaning-types__col[data-compare-col="renovation"].is-active) .cleaning-types__labels-head {
        min-height: 214px;
    }
    .section-cleaning-types .cleaning-types__table:has(.cleaning-types__col[data-compare-col="general"].is-active) .cleaning-types__row-label:nth-child(5) {
        min-height: 58px;
    }
    .section-cleaning-types .cleaning-types__table:has(.cleaning-types__col[data-compare-col="general"].is-active) .cleaning-types__row-label:nth-child(6) {
        min-height: 80px;
    }
    .section-cleaning-types .cleaning-types__col[data-compare-col="general"] .cleaning-types__cell[data-row="3"] {
        min-height: 58px !important;
    }
    .section-cleaning-types .cleaning-types__col[data-compare-col="general"] .cleaning-types__cell[data-row="4"] {
        min-height: 80px !important;
    }
}

/* ================
   PORTFOLIO (Figma 76:313)
================ */
.section-portfolio {
    padding: 80px 0;
}
.section-portfolio .section-header {
    margin-bottom: 36px;
}
.section-portfolio .section-eyebrow {
    margin-bottom: 12px;
    text-transform: none;
    letter-spacing: 0;
}
.section-portfolio .portfolio-nav {
    display: flex;
    gap: 16px;
    flex-shrink: 0;
}
.section-portfolio .portfolio-nav__btn {
    width: 54px;
    height: 54px;
    padding: 12px;
    border: none;
    background: #f1f4f6;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.section-portfolio .portfolio-nav[hidden] {
    display: none !important;
}
.section-portfolio .portfolio-nav__btn:disabled {
    opacity: 1;
    cursor: default;
}
.section-portfolio .portfolio-nav__btn:disabled img {
    filter: grayscale(1) brightness(1.05);
    opacity: 0.75;
}
.section-portfolio .portfolio-nav__btn:not(:disabled):hover {
    background: #e8edf0;
}
.section-portfolio .portfolio-slider {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.section-portfolio .portfolio-track {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 2px;
}
.section-portfolio .portfolio-track::-webkit-scrollbar {
    display: none;
}
.section-portfolio .portfolio-card {
    flex: 0 0 429px;
    scroll-snap-align: start;
}
.section-portfolio .portfolio-card__inner {
    background: #f1f4f6;
    padding: 18px;
    height: 100%;
}
.section-portfolio .portfolio-gallery {
    position: relative;
}
.section-portfolio .portfolio-gallery__viewport {
    position: relative;
    height: 224px;
    overflow: hidden;
    border-radius: 4px;
    background: #e4e9ed;
}
.section-portfolio .portfolio-gallery__slide {
    position: absolute;
    inset: 0;
    margin: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.35s ease;
    pointer-events: none;
}
.section-portfolio .portfolio-gallery__slide.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.section-portfolio .portfolio-gallery__slide img {
    width: 100%;
    height: 224px;
    object-fit: cover;
    display: block;
    cursor: pointer;
}
.section-portfolio .portfolio-gallery__dots {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
}
.section-portfolio .portfolio-gallery__dot {
    width: 8px;
    height: 8px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: rgba(0, 12, 29, 0.2);
    cursor: pointer;
    transition: background 0.2s ease, transform 0.2s ease;
}
.section-portfolio .portfolio-gallery__dot.is-active {
    background: var(--primary);
    transform: scale(1.15);
}
.section-portfolio .portfolio-gallery__dot:hover {
    background: rgba(0, 12, 29, 0.45);
}
.section-portfolio .portfolio-gallery__dot.is-active:hover {
    background: var(--primary);
}
.section-portfolio .portfolio-card__body {
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.section-portfolio .portfolio-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.section-portfolio .portfolio-card__tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: 1px solid rgba(0, 12, 29, 0.1);
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    white-space: nowrap;
}
.section-portfolio .portfolio-card__tag img {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}
.section-portfolio .portfolio-card__title {
    font-size: 22px;
    line-height: 32px;
    font-weight: 600;
    color: var(--text-dark);
}
.section-portfolio .portfolio-card__list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.section-portfolio .portfolio-card__list li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 14px;
    line-height: 22px;
}
.section-portfolio .portfolio-card__list img {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    margin-top: 2px;
}
.section-portfolio .portfolio-cta {
    width: 100%;
    min-width: 0;
}

@media (max-width: 992px) {
    .section-portfolio .section-header--row {
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
    }
    .section-portfolio .portfolio-card {
        flex: 0 0 min(429px, calc(100vw - 90px));
    }
}

@media (max-width: 768px) {
    .section-portfolio {
        padding: 56px 0;
        overflow-x: hidden;
    }
    .section-portfolio .section-title {
        font-size: 26px;
        line-height: 34px;
    }
    .section-portfolio .portfolio-card {
        /* Peek next card; keep track as the only scrollport */
        flex: 0 0 min(300px, calc(100% - 48px));
    }
    .section-portfolio .portfolio-gallery__viewport {
        height: 200px;
    }
    .section-portfolio .portfolio-gallery__slide img {
        height: 200px;
    }
    .section-portfolio .portfolio-card__title {
        font-size: 20px;
        line-height: 28px;
    }
    .section-portfolio .portfolio-card__list li {
        white-space: normal;
    }
}

/* ================================
   TEAM + EQUIPMENT (Figma 85:417)
================================ */
.section-team .section-header {
    margin-bottom: 36px;
}
.section-team .section-team__heading {
    max-width: 649px;
}
.section-team .section-eyebrow {
    text-transform: none;
    letter-spacing: 0;
    line-height: 20px;
    margin-bottom: 12px;
}
.section-team .section-title {
    margin: 0;
}
.section-team .team-nav {
    display: flex;
    gap: 16px;
    flex-shrink: 0;
}
.section-team .team-nav[hidden] {
    display: none !important;
}
.section-team .team-nav__btn {
    width: 54px;
    height: 54px;
    padding: 12px;
    border: none;
    background: #f1f4f6;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.section-team .team-nav__btn:disabled {
    opacity: 1;
    cursor: default;
}
.section-team .team-nav__btn:disabled img {
    filter: grayscale(1) brightness(1.05);
    opacity: 0.75;
}
.section-team .team-nav__btn:not(:disabled):hover {
    background: #e8edf0;
}
.section-team .section-team__content {
    display: flex;
    flex-direction: column;
    gap: 30px;
}
.section-team .team-layout {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 0;
}
.section-team .team-intro {
    flex: 0 1 427px;
    max-width: 427px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.section-team .team-intro__lead {
    margin: 0;
}
.section-team .team-intro__block {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.section-team .team-intro__subtitle {
    margin-bottom: 0;
}
.section-team .team-intro__list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.section-team .team-intro__list li {
    margin-bottom: 0;
}
.section-team .team-intro__note {
    margin-top: 0;
}
.section-team .team-intro__note strong {
    font-weight: 500;
}
.section-team .team-specialists-block {
    flex: 0 1 850px;
    max-width: 850px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}
.section-team .team-specialists-block .team-nav {
    align-self: flex-end;
}
.section-team .team-specialists {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: 100%;
}
.section-team .team-specialists::-webkit-scrollbar {
    display: none;
}
.section-team .team-card {
    flex: 0 0 274px;
    width: 274px;
    scroll-snap-align: start;
}
.section-team .team-card__rating {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
}
.section-team .team-card__rating img {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}
.section-team .team-card__body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
}
.section-team .team-card__info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
}
.section-team .team-card__body h3,
.section-team .team-card__body .team-card__name {
    font-size: 20px;
    line-height: 28px;
    font-weight: 600;
    margin: 0;
}
.section-team .team-card__role {
    font-size: 14px;
    line-height: 22px;
    font-weight: 400;
    color: var(--text-dark);
    opacity: 0.7;
    margin: 0;
}
.section-team .team-card__stats {
    margin-top: 0;
}
.section-team .team-card__stat {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid rgba(0, 12, 29, 0.1);
    padding: 8px 14px;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    white-space: nowrap;
}
.section-team .team-card__stat img {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}
.section-team .team-equipment {
    display: flex;
    gap: 18px;
    padding-top: 0;
    border-top: none;
    grid-template-columns: none;
}
.section-team .equip-card {
    flex: 1 1 0;
    min-width: 0;
    max-width: 428px;
}
.section-team .equip-card__text h3,
.section-team .equip-card__text .equip-card__title {
    margin: 0 0 10px;
}

@media (max-width: 1200px) {
    .section-team .team-layout {
        flex-direction: column;
    }
    .section-team .team-intro,
    .section-team .team-specialists-block {
        flex: none;
        max-width: none;
        width: 100%;
    }
}

@media (max-width: 900px) {
    /* Figma 125:1494 — stack full-height equip cards (do NOT keep flex:1 1 0) */
    .section-team .team-equipment {
        flex-direction: column;
        gap: 10px;
        align-items: stretch;
    }
    .section-team .equip-card {
        flex: 0 0 auto;
        max-width: none;
        width: 100%;
        height: 202px;
        min-height: 202px;
        padding: 14px;
    }
    .section-team .equip-card__text {
        max-width: 212px;
    }
    .section-team .equip-card__text h3,
    .section-team .equip-card__text .equip-card__title {
        font-size: 17px;
        line-height: 24px;
        margin-bottom: 10px;
    }
    .section-team .equip-card__text p {
        font-size: 14px;
        line-height: 22px;
    }
    .section-team .equip-card__cutout {
        width: 117px;
        height: 160px;
        top: auto;
        bottom: 0;
        right: 0;
    }
    .section-team .team-card {
        flex: 0 0 min(224px, 85vw);
        width: min(224px, 85vw);
    }
    .section-team .team-card__photo-wrap,
    .section-team .team-card__photo {
        height: 256px;
    }
}

@media (max-width: 600px) {
    .section-team .team-specialists-block {
        gap: 12px;
    }
    .section-team .team-specialists-block .team-nav {
        align-self: flex-end;
    }
    .section-team .equip-card__text {
        max-width: 212px; /* override legacy .equip-card__text { max-width: 58% } */
    }
}

/* ================================
   REVIEWS (Figma 85:681)
================================ */
.section-reviews {
    padding: 80px 0;
}
.section-reviews .section-header {
    margin-bottom: 36px;
}
.section-reviews .section-reviews__heading {
    max-width: 649px;
}
.section-reviews .section-eyebrow {
    text-transform: none;
    letter-spacing: 0;
    line-height: 20px;
    margin-bottom: 12px;
}
.section-reviews .section-title {
    margin: 0;
}
.section-reviews .reviews-nav {
    display: flex;
    gap: 16px;
    flex-shrink: 0;
}
.section-reviews .reviews-nav__btn {
    width: 54px;
    height: 54px;
    padding: 12px;
    border: none;
    background: #f1f4f6;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.section-reviews .reviews-nav[hidden] {
    display: none !important;
}
.section-reviews .reviews-nav__btn:disabled {
    opacity: 1;
    cursor: default;
}
.section-reviews .reviews-nav__btn:disabled img {
    filter: grayscale(1) brightness(1.05);
    opacity: 0.75;
}
.section-reviews .reviews-nav__btn:not(:disabled):hover {
    background: #e8edf0;
}
.section-reviews .reviews-body {
    display: flex;
    flex-direction: column;
    gap: 26px;
}
.section-reviews .reviews-track {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 2px;
}
.section-reviews .reviews-track::-webkit-scrollbar {
    display: none;
}
.section-reviews .review-card {
    flex: 0 0 428px;
    scroll-snap-align: start;
}
.section-reviews .review-card__shell {
    position: relative;
    min-height: 516px;
}
.section-reviews .review-card__avatar {
    position: absolute;
    top: 4px;
    left: 24px;
    z-index: 2;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    overflow: hidden;
}
.section-reviews .review-card__avatar img {
    width: 76px;
    height: 76px;
    max-width: none;
    margin: -6px 0 0 -6px;
    object-fit: cover;
}
.section-reviews .review-card__panel {
    position: relative;
    margin-top: 36px;
    min-height: 480px;
    background: #fff;
    padding: 66px 24px 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.section-reviews .review-card__date {
    display: block;
    font-size: 14px;
    line-height: 22px;
    opacity: 0.7;
    text-align: right;
}
.section-reviews .review-card__content {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 20px;
    min-height: 0;
}
.section-reviews .review-card__intro {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.section-reviews .review-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.section-reviews .review-card__name {
    font-size: 18px;
    line-height: 26px;
    font-weight: 600;
}
.section-reviews .review-card__stars {
    display: flex;
    align-items: center;
    gap: 3px;
    flex-shrink: 0;
}
.section-reviews .review-card__stars img {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}
.section-reviews .review-card__text {
    font-size: 16px;
    line-height: 24px;
    margin: 0;
}
.section-reviews .review-card__source {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.section-reviews .review-card__source-label {
    font-family: Inter, sans-serif;
    font-size: 15px;
    line-height: 22px;
    font-weight: 300;
    opacity: 0.6;
}
.section-reviews .review-card__source-logo {
    display: block;
    width: auto;
    height: auto;
    max-height: 44px;
    max-width: 142px;
    object-fit: contain;
    object-position: left center;
}
.section-reviews .reviews-ratings {
    display: flex;
    gap: 16px;
    margin: 0;
    padding: 0;
    border: none;
}
.section-reviews .reviews-rating {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 24px;
    background: rgba(255, 255, 255, 0.8);
}
.section-reviews .reviews-rating__main {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 1 1 auto;
    min-width: 0;
}
.section-reviews .reviews-rating__score-wrap {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}
.section-reviews .reviews-rating__score {
    font-size: 24px;
    line-height: 34px;
    font-weight: 600;
    color: #272524;
}
.section-reviews .reviews-rating__platform {
    width: 34px;
    height: 34px;
    object-fit: cover;
    flex-shrink: 0;
}
.section-reviews .reviews-rating__stars {
    display: flex;
    align-items: center;
    gap: 3px;
    flex-shrink: 0;
}
.section-reviews .reviews-rating__stars img {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}
.section-reviews .reviews-rating__caption {
    flex: 0 1 auto;
    margin: 0;
    font-size: 16px;
    line-height: 24px;
    opacity: 0.6;
    color: #272524;
    text-align: right;
}

/* ================================
   VIDEO REVIEWS (Figma 113:320)
================================ */
.section-video-reviews {
    padding: 80px 0;
    background: #f1f4f6;
}
.section-video-reviews .section-header {
    margin-bottom: 36px;
    align-items: flex-end;
}
.section-video-reviews .section-video-reviews__heading {
    max-width: 649px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.section-video-reviews .section-eyebrow {
    text-transform: none;
    letter-spacing: 0;
    line-height: 20px;
    margin-bottom: 0;
}
.section-video-reviews .section-title {
    margin: 0;
}
.section-video-reviews .video-reviews-nav {
    display: flex;
    gap: 16px;
    flex-shrink: 0;
}
.section-video-reviews .video-reviews-nav__btn {
    width: 54px;
    height: 54px;
    padding: 12px;
    border: none;
    border-radius: 0;
    /* On section #f1f4f6 use white chips so arrows stay visible (Figma arrow chips) */
    background: #fff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.section-video-reviews .video-reviews-nav[hidden] {
    display: none !important;
}
.section-video-reviews .video-reviews-nav__btn:disabled {
    opacity: 1;
    cursor: default;
}
.section-video-reviews .video-reviews-nav__btn:disabled img {
    filter: grayscale(1) brightness(1.05);
    opacity: 0.75;
}
.section-video-reviews .video-reviews-nav__btn:not(:disabled):hover {
    background: #eef2f5;
}
.section-video-reviews .video-reviews-track {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    overflow-y: hidden; /* play shadow must not create a vertical scrollport */
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    /* room for play button drop-shadow below the 485px cover */
    padding-bottom: 36px;
    margin-bottom: -36px;
}
.section-video-reviews .video-reviews-track::-webkit-scrollbar {
    display: none;
}
.section-video-reviews .video-card {
    flex: 0 0 318px;
    scroll-snap-align: start;
    transition: none;
}
.section-video-reviews .video-card__frame {
    position: relative;
    height: 515px;
    overflow: visible;
}
.section-video-reviews .video-card__cover {
    position: relative;
    height: 485px;
    padding: 10px;
    background: #fff;
    overflow: hidden;
}
.section-video-reviews .video-card__bg,
.section-video-reviews .video-card__img {
    position: absolute;
    top: 10px;
    left: 10px;
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    max-width: none;
    object-fit: cover;
}
.section-video-reviews .video-card__img--pos-a {
    width: 234.03%;
    height: 100%;
    left: calc(10px - 80.44%);
    top: 10px;
}
.section-video-reviews .video-card__img--pos-b {
    width: 234.03%;
    height: 100%;
    left: calc(10px - 63.66%);
    top: 10px;
}
.section-video-reviews .video-card__img--pos-c {
    width: 234.03%;
    height: 100%;
    left: calc(10px - 53.59%);
    top: 10px;
}
.section-video-reviews .video-card__play {
    /* Reset legacy .video-card__play { inset: 0; overlay bg } */
    position: absolute;
    inset: auto;
    left: 50%;
    top: 445px;
    right: auto;
    bottom: auto;
    transform: translateX(-50%);
    width: 70px;
    height: 70px;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    cursor: pointer;
    z-index: 2;
    overflow: visible;
    display: block;
    transition: none;
}
.section-video-reviews .video-card__play:hover,
.section-video-reviews .video-card__play:focus,
.section-video-reviews .video-card__play:focus-visible {
    background: transparent;
    outline: none;
    box-shadow: none;
}
.section-video-reviews .video-card__play img {
    /* Figma play asset includes drop-shadow; box is 70, graphic ~105 */
    position: absolute;
    left: -25.33%;
    top: 0;
    width: 150.66%;
    height: 150.66%;
    max-width: none;
    display: block;
    pointer-events: none;
}

@media (max-width: 992px) {
    .section-reviews .section-header--row,
    .section-video-reviews .section-header--row {
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
    }
    .section-reviews .reviews-ratings {
        flex-direction: column;
    }
    .section-reviews .review-card {
        flex: 0 0 min(428px, calc(100vw - 90px));
    }
    .section-video-reviews .video-card {
        flex: 0 0 min(318px, calc(100vw - 90px));
    }
}

/* CLN-M06: kill page H-scroll from mid-page carousels; video → Figma 125:1869 */
@media (max-width: 768px) {
    .section-portfolio,
    .section-reviews,
    .section-video-reviews {
        overflow-x: hidden;
        max-width: 100%;
    }
    .section-portfolio .container,
    .section-reviews .container,
    .section-video-reviews .container,
    .section-portfolio .portfolio-slider,
    .section-reviews .reviews-body {
        max-width: 100%;
        min-width: 0;
    }
    .section-portfolio .portfolio-track,
    .section-reviews .reviews-track,
    .section-video-reviews .video-reviews-track {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overscroll-behavior-x: contain;
    }

    .section-reviews,
    .section-video-reviews {
        padding: 56px 0;
    }
    .section-reviews .section-title {
        font-size: 26px;
        line-height: 34px;
    }
    /* Mobile: wider review cards (~one per screen + small peek) */
    .section-reviews .reviews-track {
        gap: 12px;
    }
    .section-reviews .review-card {
        flex: 0 0 calc(100% - 28px);
        width: calc(100% - 28px);
        max-width: none;
    }
    .section-reviews .review-card__shell {
        min-height: auto;
    }
    .section-reviews .review-card__panel {
        min-height: 0;
        padding: 52px 16px 16px;
    }
    .section-reviews .review-card__avatar {
        left: 16px;
        width: 54px;
        height: 54px;
    }
    .section-reviews .review-card__avatar img {
        width: 62px;
        height: 62px;
        margin: -4px 0 0 -4px;
    }
    .section-reviews .review-card__text {
        font-size: 14px;
        line-height: 22px;
    }
    .section-reviews .reviews-rating {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
    .section-reviews .reviews-rating__caption {
        text-align: left;
        width: 100%;
    }

    /* Video reviews — Figma 125:1869 (226×342 cards, 12px gap, 46px play, no nav) */
    .section-video-reviews .section-header {
        margin-bottom: 26px;
        align-items: flex-start;
    }
    .section-video-reviews .section-video-reviews__heading {
        max-width: 100%;
        gap: 10px;
    }
    .section-video-reviews .section-eyebrow {
        font-size: 13px;
        line-height: 20px;
        opacity: 0.7;
    }
    .section-video-reviews .section-title {
        font-size: 24px;
        line-height: 34px;
    }
    .section-video-reviews .video-reviews-nav {
        display: none;
    }
    .section-video-reviews .video-reviews-track {
        gap: 12px;
        padding-bottom: 30px;
        margin-bottom: -10px;
    }
    .section-video-reviews .video-card {
        flex: 0 0 226px;
        width: 226px;
        max-width: 226px;
    }
    .section-video-reviews .video-card__frame {
        height: 368px;
        overflow: visible;
    }
    .section-video-reviews .video-card__cover {
        height: 342px;
        padding: 8px;
    }
    .section-video-reviews .video-card__bg,
    .section-video-reviews .video-card__img {
        top: 8px;
        left: 8px;
        width: calc(100% - 16px);
        height: calc(100% - 16px);
    }
    .section-video-reviews .video-card__img--pos-a {
        width: 234.03%;
        height: calc(100% - 16px);
        left: calc(8px - 80.44%);
        top: 8px;
    }
    .section-video-reviews .video-card__img--pos-b {
        width: 234.03%;
        height: calc(100% - 16px);
        left: calc(8px - 63.66%);
        top: 8px;
    }
    .section-video-reviews .video-card__img--pos-c {
        width: 234.03%;
        height: calc(100% - 16px);
        left: calc(8px - 53.59%);
        top: 8px;
    }
    .section-video-reviews .video-card__play {
        width: 46px;
        height: 46px;
        top: 322px;
        bottom: auto;
    }
    .section-video-reviews .video-card__play img {
        left: -27.39%;
        top: 0;
        width: 154.78%;
        height: 154.78%;
    }
}

/* ============================================================
   STEPS (Figma 87:219)
   ============================================================ */
.section-steps .section-header {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 36px;
    max-width: 649px;
}
.section-steps .section-eyebrow {
    text-transform: none;
    letter-spacing: 0;
    line-height: 20px;
    margin-bottom: 0;
}
.section-steps .steps-board {
    border-top: 2px solid rgba(0, 0, 0, 0.25);
    border-bottom: 1px solid rgba(0, 0, 0, 0.25);
    min-height: 376px;
}
.section-steps .steps-grid {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 26px;
    width: 100%;
}
.section-steps .step-card {
    display: flex;
    flex-direction: column;
    gap: 20px;
    flex: 1 1 0;
    min-width: 0;
    padding: 26px;
    border-right: 1px solid rgba(0, 0, 0, 0.25);
    background: transparent;
    border-top: none;
    border-radius: 0;
    box-sizing: border-box;
}
.section-steps .step-card:last-child {
    border-right: none;
}
.section-steps .step-card__num {
    font-size: 40px;
    font-weight: 700;
    line-height: 46px;
    color: var(--primary);
    opacity: 1;
    text-transform: uppercase;
    margin-bottom: 0;
}
.section-steps .step-card__body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1 1 auto;
    min-width: 0;
}
.section-steps .step-card__title {
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    opacity: 0.8;
    margin-bottom: 0;
}
.section-steps .step-card__rule {
    display: none;
}
.section-steps .step-card__desc {
    font-size: 16px;
    line-height: 24px;
    opacity: 0.8;
    margin-bottom: 0;
}
.section-steps .step-card__phone {
    display: inline;
    margin-top: 0;
    font-weight: 600;
    color: var(--primary);
    white-space: nowrap;
}
.section-steps .step-card__phone:hover {
    opacity: 0.85;
}
.section-steps .step-card__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
    height: 54px;
    margin-top: auto;
    padding: 18px 24px;
    box-sizing: border-box;
    white-space: nowrap;
}

@media (max-width: 1200px) {
    .section-steps .steps-board {
        min-height: 0;
    }
    .section-steps .steps-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;
    }
    .section-steps .step-card {
        padding: 26px;
    }
    .section-steps .step-card:nth-child(2) {
        border-right: none;
    }
    .section-steps .step-card:nth-child(-n+2) {
        border-bottom: 1px solid rgba(0, 0, 0, 0.25);
    }
}

/* CLN-M06 P0 + CLN-M07: bordered step cards (Figma 125:1984) */
@media (max-width: 768px) {
    .section-steps {
        overflow-x: hidden;
    }
    .section-steps .section-header {
        gap: 10px;
        margin-bottom: 26px;
    }
    .section-steps .section-eyebrow {
        font-size: 13px;
        line-height: 20px;
        opacity: 0.7;
    }
    .section-steps .section-title {
        font-size: 24px;
        line-height: 34px;
    }
    .section-steps .steps-board {
        overflow-x: hidden;
        max-width: 100%;
        border-top: none;
        border-bottom: none;
        min-height: 0;
    }
    .section-steps .steps-grid {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }
    .section-steps .step-card {
        gap: 14px;
        border: 1px solid rgba(51, 55, 66, 0.2);
        padding: 16px;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }
    .section-steps .step-card:nth-child(2),
    .section-steps .step-card:nth-child(-n+2),
    .section-steps .step-card:last-child {
        border: 1px solid rgba(51, 55, 66, 0.2);
        padding: 16px;
    }
    .section-steps .step-card__num {
        font-size: 28px;
        line-height: 34px;
    }
    .section-steps .step-card__body {
        gap: 14px;
    }
    .section-steps .step-card__title {
        font-size: 17px;
        line-height: 24px;
    }
    .section-steps .step-card__rule {
        display: block;
        width: 100%;
        height: 0;
        border: none;
        border-top: 1px solid rgba(51, 55, 66, 0.2);
        margin: 0;
        padding: 0;
    }
    .section-steps .step-card__desc {
        font-size: 14px;
        line-height: 22px;
    }
    .section-steps .step-card__btn {
        min-width: 0;
        max-width: 100%;
        height: 46px;
        padding: 16px 50px;
        font-size: 14px;
    }
}

/* ============================================================
   FAQ (Figma 89:441)
   ============================================================ */
.section-faq .section-header {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 36px;
    max-width: 649px;
}
.section-faq .section-eyebrow {
    text-transform: none;
    letter-spacing: 0;
    line-height: 20px;
    margin-bottom: 0;
}
.section-faq .section-title__accent {
    color: var(--text-dark);
}
.section-faq .faq-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    max-width: none;
    align-items: start;
}
.section-faq .faq-item {
    background: #f1f4f6;
    border-bottom: none;
    padding: 24px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    height: auto;
    align-self: start;
}
.section-faq .faq-item__question {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0;
    background: none;
    border: none;
    font-family: var(--font-main);
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    text-align: left;
    cursor: pointer;
    color: var(--text-dark);
}
.section-faq .faq-item__q-text {
    flex: 1 1 auto;
    min-width: 0;
}
.section-faq .faq-item__toggle {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: 49px;
    background: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.section-faq .faq-item__icon {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    transition: transform 0.25s ease;
}
.section-faq .faq-item__icon--close {
    display: none;
    transform: rotate(-45deg);
}
.section-faq .faq-item.is-open .faq-item__icon--plus {
    display: none;
}
.section-faq .faq-item.is-open .faq-item__icon--close {
    display: block;
}
.section-faq .faq-item__answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
}
.section-faq .faq-item.is-open .faq-item__answer {
    max-height: 600px;
}
.section-faq .faq-item__answer-inner {
    padding-top: 16px;
    font-size: 16px;
    line-height: 24px;
    opacity: 0.9;
    color: var(--text-dark);
}
.section-faq .faq-item__answer-inner p {
    margin: 0 0 10px;
    padding-bottom: 0;
    font-size: inherit;
    line-height: inherit;
    opacity: 1;
}
.section-faq .faq-item__answer-inner ol {
    margin: 0;
    padding: 0;
    list-style: decimal;
}
.section-faq .faq-item__answer-inner li {
    margin: 0 0 6px 24px;
    list-style: decimal;
}

@media (max-width: 900px) {
    .section-faq .faq-grid {
        grid-template-columns: 1fr;
    }
    .section-faq .faq-item__question {
        font-size: 18px;
        line-height: 26px;
    }
}

/* CLN-M07: FAQ mobile parity (Figma 125:1985) */
@media (max-width: 768px) {
    .section-faq .section-header {
        gap: 10px;
        margin-bottom: 26px;
    }
    .section-faq .section-eyebrow {
        font-size: 13px;
        line-height: 20px;
        opacity: 0.7;
    }
    .section-faq .section-title {
        font-size: 24px;
        line-height: 34px;
    }
    .section-faq .faq-grid {
        gap: 10px;
    }
    .section-faq .faq-item {
        padding: 16px;
    }
    .section-faq .faq-item__question {
        align-items: flex-start;
        font-size: 16px;
        line-height: 24px;
    }
    .section-faq .faq-item__toggle {
        flex: 0 0 34px;
        width: 34px;
        height: 34px;
    }
    .section-faq .faq-item__icon {
        width: 14px;
        height: 14px;
        flex: 0 0 14px;
    }
    .section-faq .faq-item__answer-inner {
        padding-top: 12px;
        font-size: 14px;
        line-height: 22px;
    }
    .section-faq .faq-item__answer-inner p {
        margin: 0 0 8px;
    }
    .section-faq .faq-item__answer-inner li {
        margin: 0 0 4px 21px;
    }
}

/* ============================================================
   SEO (Figma 89:470)
   ============================================================ */
.section-seo {
    padding: 80px 0;
    background: #fff;
}
.section-seo .section-header {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 36px;
    max-width: 649px;
}
.section-seo .section-eyebrow {
    text-transform: none;
    letter-spacing: 0;
    line-height: 20px;
    margin-bottom: 0;
}
.section-seo .seo-layout {
    display: flex;
    gap: 24px;
    align-items: flex-start;
}
.section-seo .seo-layout__content {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.section-seo .seo-layout__lead {
    font-size: 16px;
    line-height: 24px;
    color: var(--text-dark);
    max-width: 874px;
    margin: 0;
    opacity: 1;
}
.section-seo .seo-layout__blocks {
    display: flex;
    flex-direction: column;
    gap: 22px;
}
.section-seo .seo-layout__more {
    display: flex;
    flex-direction: column;
    gap: 22px;
}
.section-seo .seo-layout__more[hidden] {
    display: none;
}
.section-seo .seo-block-item {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.section-seo .seo-block-item__h3 {
    font-size: 24px;
    font-weight: 600;
    line-height: 34px;
    margin: 0;
    color: var(--text-dark);
}
.section-seo .seo-block-item__h4 {
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    margin: 0;
    color: var(--text-dark);
}
.section-seo .seo-block-item__text p {
    font-size: 16px;
    line-height: 24px;
    margin: 0 0 0;
    opacity: 1;
    color: var(--text-dark);
}
.section-seo .seo-block-item__text p + p {
    margin-top: 0;
}
.section-seo .seo-block-item__list-title {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    margin: 0;
    color: var(--text-dark);
}
.section-seo .seo-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
    padding: 0;
}
.section-seo .seo-list__item {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin: 0;
    list-style: none;
}
.section-seo .seo-list__bullet {
    flex: 0 0 8px;
    width: 8px;
    height: 24px;
    margin: 0;
}
.section-seo .seo-list__item span {
    flex: 1 1 auto;
    font-size: 16px;
    line-height: 24px;
    color: var(--text-dark);
}
.section-seo .seo-layout__toggle {
    align-self: flex-start;
    min-width: 0;
}
.section-seo .seo-layout__media {
    flex: 0 0 428px;
    width: 428px;
    max-width: 100%;
    align-self: stretch;
    position: relative;
    overflow: hidden;
}
.section-seo .seo-layout__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

@media (max-width: 1200px) {
    .section-seo .seo-layout {
        flex-direction: column;
    }
    .section-seo .seo-layout__media {
        flex: none;
        width: 100%;
        max-height: 480px;
    }
}

@media (max-width: 600px) {
    .section-seo {
        padding: 56px 0;
    }
    .section-seo .seo-block-item__h3 {
        font-size: 22px;
        line-height: 30px;
    }
    .section-seo .seo-layout__toggle {
        width: 100%;
    }
    .section-seo .seo-layout__media {
        max-height: 360px;
    }
}

/* 404 */
.section-404 {
    padding: 96px 0 120px;
    background: linear-gradient(180deg, #f7fafc 0%, #eef3f6 100%);
}
.section-404__inner {
    max-width: 720px;
    text-align: center;
    position: relative;
}
.section-404__code {
    margin: 0 0 8px;
    font-size: 96px;
    line-height: 1;
    font-weight: 700;
    color: #1bb2e6;
    opacity: 0.25;
}
.section-404__title {
    margin-bottom: 16px;
}
.section-404__text {
    margin: 0 auto 28px;
    max-width: 520px;
    color: #031537;
    opacity: 0.8;
    font-size: 16px;
    line-height: 26px;
}
.section-404__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    align-items: center;
}
.section-404__phone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 24px;
    color: #031537;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid rgba(3, 21, 55, 0.12);
    background: #fff;
}
.section-404__phone:hover {
    border-color: #1bb2e6;
    color: #1bb2e6;
}
@media (max-width: 768px) {
    .section-404 {
        padding: 64px 0 80px;
    }
    .section-404__code {
        font-size: 72px;
    }
    .section-404__actions {
        flex-direction: column;
    }
    .section-404__actions .btn {
        width: 100%;
    }
}