:root {
    --green: #2f9a45;
    --green-light: #61c878;
    --gold: #d9a451;
    --gold-soft: #e7b35d;
    --text: #ffffff;
    --muted: rgba(255, 255, 255, 0.68);
    --line: rgba(217, 164, 81, 0.45);
    --panel: rgba(8, 15, 19, 0.9);
}

* {
    box-sizing: border-box;
}

html {
    min-width: 320px;
    scroll-behavior: smooth;
    overflow-x: hidden;
}

body {
    min-width: 320px;
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    color: var(--text);
    background: #050a0d;
    overflow-x: hidden;
}

body.is-locked {
    overflow: hidden;
}

button,
input {
    font: inherit;
}

button {
    cursor: pointer;
}

img {
    display: block;
    max-width: 100%;
}

.site {
    overflow: hidden;
}

.hero {
    position: relative;
    min-height: 100vh;
    isolation: isolate;
    overflow: hidden;
    background:
        radial-gradient(circle at 74% 38%, rgba(66, 190, 86, 0.2), transparent 24%),
        radial-gradient(circle at 22% 64%, rgba(217, 164, 81, 0.12), transparent 26%),
        radial-gradient(ellipse at 54% 12%, rgba(45, 83, 103, 0.34), transparent 36%),
        linear-gradient(135deg, #020506 0%, #071114 34%, #0b1718 56%, #030607 100%);
}

.hero__shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, rgba(0, 0, 0, 0.44), rgba(0, 0, 0, 0.08) 54%, rgba(0, 0, 0, 0.24)),
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 36%, rgba(0, 0, 0, 0.48));
    pointer-events: none;
}

.hero__inner {
    width: min(100%, 1500px);
    min-height: 100vh;
    margin: 0 auto;
    padding: 38px 56px 34px;
    display: flex;
    flex-direction: column;
}

.hero__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 28px;
    position: relative;
    z-index: 3;
}

.brand,
.hero__phone {
    color: inherit;
    text-decoration: none;
}

.brand {
    display: flex;
    align-items: center;
    gap: 16px;
}

.brand__logo {
    width: 58px;
    height: 58px;
    object-fit: contain;
}

.brand__text {
    display: grid;
    gap: 5px;
}

.brand__name {
    font-size: 25px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0;
}

.brand__tagline {
    font-size: 14px;
    line-height: 1.25;
    color: var(--muted);
    text-transform: uppercase;
}

.hero__phone {
    display: grid;
    gap: 7px;
    justify-items: end;
}

.hero__phone-line {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 20px;
    line-height: 1.1;
    font-weight: 700;
}

.hero__phone-line img {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.hero__phone-time {
    font-size: 16px;
    line-height: 1.2;
    color: var(--muted);
}

.hero__content {
    position: relative;
    flex: 1;
    display: grid;
    grid-template-columns: minmax(520px, 650px) minmax(480px, 1fr);
    align-items: center;
    gap: 44px;
    padding-top: 34px;
}

.hero__copy {
    position: relative;
    z-index: 3;
    padding-bottom: 10px;
}

.hero h1 {
    max-width: 670px;
    margin: 0;
    font-size: 56px;
    line-height: 1.12;
    letter-spacing: 0;
    font-weight: 800;
    text-shadow: 0 3px 12px rgba(0, 0, 0, 0.45);
    overflow-wrap: break-word;
}

.hero-title__mobile {
    display: none;
}

.hero h1 .hero__accent {
    color: var(--gold);
}

.hero__lead {
    max-width: 620px;
    margin: 26px 0 0;
    color: rgba(255, 255, 255, 0.84);
    font-size: 21px;
    line-height: 1.42;
}

.hero__lead strong {
    color: #4ec85f;
    font-weight: 500;
}

.hero__note {
    max-width: 600px;
    margin: 22px 0 0;
    color: var(--muted);
    font-size: 20px;
    line-height: 1.42;
}

.hero__cta {
    position: relative;
    overflow: hidden;
    width: min(100%, 520px);
    min-height: 70px;
    margin-top: 34px;
    padding: 18px 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border: 1px solid rgba(112, 223, 128, 0.36);
    border-radius: 8px;
    color: #fff;
    background: linear-gradient(90deg, #25893c, #36a24b);
    box-shadow: 0 0 28px rgba(63, 198, 82, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    text-transform: uppercase;
    font-size: 19px;
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: 0;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
    animation: cta-pulse 2.6s ease-in-out infinite;
}

.hero__cta::before,
.problems__cta::before {
    content: "";
    position: absolute;
    inset: -2px;
    background: linear-gradient(110deg, transparent 0 34%, rgba(255, 255, 255, 0.32) 48%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-115%);
    animation: cta-shine 3.4s ease-in-out infinite;
    pointer-events: none;
}

.hero__cta > *,
.problems__cta > * {
    position: relative;
    z-index: 1;
}

.hero__cta:hover,
.hero__cta:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(164, 255, 174, 0.7);
    box-shadow: 0 0 34px rgba(73, 218, 91, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.24);
    outline: none;
}

.hero__cta-icon {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.hero__cta-arrow {
    width: 28px;
    height: auto;
    flex: 0 0 28px;
    filter: brightness(0) invert(1);
    animation: cta-arrow 1.35s ease-in-out infinite;
}

.hero__cta > span:not(.hero__cta-icon) {
    min-width: 0;
}

.hero__features {
    list-style: none;
    max-width: 610px;
    margin: 38px 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    align-items: end;
    gap: 28px;
}

.hero__features li {
    position: relative;
    min-width: 0;
    display: grid;
    justify-items: center;
    gap: 12px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 16px;
    line-height: 1.15;
    text-align: center;
}

.hero__features li + li::before {
    content: "";
    position: absolute;
    left: -16px;
    top: 39px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--gold);
    box-shadow: 0 0 10px rgba(217, 164, 81, 0.75);
}

.hero__features img {
    width: 46px;
    height: 46px;
    object-fit: contain;
}

.hero__visual {
    position: relative;
    z-index: 2;
    width: min(100%, 790px);
    margin-left: auto;
    display: block;
    pointer-events: none;
}

.hero__image {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
}

.hero__image img {
    width: 100%;
    height: auto;
    object-fit: contain;
    filter: drop-shadow(0 30px 55px rgba(0, 0, 0, 0.35));
}

.signal {
    --size: 94px;
    --core: clamp(16px, calc(var(--size) * 0.22), 23px);
    --phase: 0s;
    position: absolute;
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    filter: drop-shadow(0 0 18px rgba(71, 210, 82, 0.36));
    isolation: isolate;
    z-index: 2;
}

.signal::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(63, 184, 78, 0.16) 0 32%, rgba(63, 184, 78, 0.07) 33% 58%, transparent 59% 100%);
    box-shadow:
        0 0 0 1px rgba(96, 230, 102, 0.34),
        0 0 0 calc(var(--size) * 0.23) rgba(77, 199, 82, 0.12),
        0 0 0 calc(var(--size) * 0.45) rgba(77, 199, 82, 0.06);
    opacity: 0.9;
}

.signal__core,
.signal__wave {
    position: absolute;
    left: 50%;
    top: 50%;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

.signal__core {
    z-index: 3;
    width: var(--core);
    height: var(--core);
    background:
        radial-gradient(circle, #ffffff 0 50%, #41b84f 52% 100%);
    box-shadow:
        0 0 0 9px rgba(63, 184, 78, 0.36),
        0 0 22px rgba(255, 255, 255, 0.72),
        0 0 38px rgba(72, 220, 91, 0.58);
    animation: signal-core 1.9s ease-in-out infinite;
    animation-delay: var(--phase);
}

.signal__wave {
    z-index: 1;
    width: var(--core);
    height: var(--core);
    border: 1.5px solid rgba(111, 244, 116, 0.82);
    background: rgba(57, 165, 68, 0.18);
    box-shadow: inset 0 0 18px rgba(69, 216, 86, 0.24), 0 0 20px rgba(69, 216, 86, 0.16);
    animation: signal-wave 3s ease-out infinite;
    animation-delay: var(--phase);
}

.signal__wave--two {
    animation-delay: calc(var(--phase) - 2s);
}

.signal__wave--three {
    animation-delay: calc(var(--phase) - 1s);
}

.signal--one {
    --size: 84px;
    left: 49.4%;
    top: 23.8%;
}

.signal--two {
    --size: 96px;
    --phase: -0.35s;
    left: 83%;
    top: 22.1%;
}

.signal--three {
    --size: 88px;
    --phase: -0.15s;
    left: 36.9%;
    top: 41.2%;
}

.signal--four {
    --size: 82px;
    --phase: -0.7s;
    left: 73.8%;
    top: 45.2%;
}

.signal--five {
    --size: 86px;
    --phase: -0.45s;
    left: 32.5%;
    top: 59.6%;
}

.signal--six {
    --size: 86px;
    --phase: -0.9s;
    left: 81.5%;
    top: 69%;
}

.signal--seven {
    --size: 82px;
    --phase: -1.15s;
    left: 26.8%;
    top: 79.4%;
}

.problems {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 80px 0;
    background:
        radial-gradient(circle at 50% 45%, rgba(52, 174, 79, 0.12), transparent 30%),
        radial-gradient(circle at 15% 30%, rgba(217, 164, 81, 0.08), transparent 24%),
        radial-gradient(circle at 85% 36%, rgba(45, 83, 103, 0.2), transparent 26%),
        linear-gradient(145deg, #020506 0%, #071114 40%, #020506 100%);
}

.problems__shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 34%, rgba(0, 0, 0, 0.42)),
        linear-gradient(90deg, rgba(0, 0, 0, 0.28), transparent 48%, rgba(0, 0, 0, 0.28));
    pointer-events: none;
}

.problems__inner {
    width: min(100%, 1400px);
    margin: 0 auto;
    padding: 0 56px;
}

.section-kicker {
    width: min(100%, 780px);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 28px;
    color: var(--gold-soft);
    font-size: 22px;
    line-height: 1.2;
    font-weight: 800;
    text-align: center;
    text-transform: none;
}

.section-kicker span {
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(217, 164, 81, 0.66));
}

.section-kicker span:last-child {
    background: linear-gradient(90deg, rgba(217, 164, 81, 0.66), transparent);
}

.problems h2 {
    width: min(100%, 920px);
    margin: 28px auto 0;
    font-size: 42px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0;
    text-align: center;
    text-shadow: 0 3px 12px rgba(0, 0, 0, 0.42);
}

.problems h2 span {
    display: block;
    color: #fff;
}

.problems h2 em {
    color: var(--gold);
    font-style: normal;
}

.problems__layout {
    margin-top: 34px;
    display: grid;
    grid-template-columns: minmax(250px, 325px) minmax(420px, 1fr) minmax(250px, 325px);
    align-items: center;
    gap: 40px;
}

.problems__cards {
    display: grid;
    gap: 20px;
}

.problem-card {
    position: relative;
    overflow: hidden;
    min-height: 255px;
    padding: 28px 30px 26px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.015)),
        rgba(6, 14, 17, 0.72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 45px rgba(0, 0, 0, 0.28);
    backdrop-filter: blur(10px);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.problem-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 0 34%, rgba(255, 255, 255, 0.08) 48%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-120%);
    animation: card-shine 6s ease-in-out infinite;
    animation-delay: var(--delay, 0s);
    pointer-events: none;
}

.problem-card::after {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    background:
        radial-gradient(circle at 20% 20%, rgba(217, 164, 81, 0.18), transparent 32%),
        radial-gradient(circle at 90% 90%, rgba(63, 198, 82, 0.14), transparent 34%);
    opacity: 0.42;
    animation: card-glow 4.8s ease-in-out infinite;
    pointer-events: none;
}

.problem-card:hover {
    transform: translateY(-4px);
    border-color: rgba(217, 164, 81, 0.42);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 24px 58px rgba(0, 0, 0, 0.36), 0 0 28px rgba(217, 164, 81, 0.08);
}

.problem-card > * {
    position: relative;
    z-index: 1;
}

.problem-card img {
    width: 78px;
    height: 78px;
    object-fit: contain;
    animation: icon-float 3.8s ease-in-out infinite;
    animation-delay: var(--delay, 0s);
}

.problem-card h3 {
    margin: 22px 0 0;
    font-size: 23px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0;
}

.problem-card p {
    margin: 16px 0 0;
    color: rgba(255, 255, 255, 0.76);
    font-size: 17px;
    line-height: 1.45;
}

.problems__center {
    min-width: 0;
    display: grid;
    place-items: center;
}

.problems__map {
    position: relative;
    width: min(100%, 560px);
    margin: 0 auto;
    filter: drop-shadow(0 35px 55px rgba(0, 0, 0, 0.34));
}

.problems__map img {
    width: 100%;
    height: auto;
}

.bad-signal {
    --size: 72px;
    position: absolute;
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle, rgba(255, 255, 255, 0.92) 0 7%, rgba(247, 60, 47, 0.94) 8% 28%, rgba(247, 60, 47, 0.24) 29% 100%);
    box-shadow: 0 0 0 1px rgba(255, 82, 66, 0.36), 0 0 24px rgba(247, 60, 47, 0.35);
    animation: bad-signal 2.5s ease-in-out infinite;
}

.bad-signal::before,
.bad-signal::after {
    content: "";
    position: absolute;
    inset: 12%;
    border-radius: 50%;
    border: 1px solid rgba(255, 87, 71, 0.5);
    animation: bad-signal-ring 2.5s ease-out infinite;
}

.bad-signal::after {
    animation-delay: -1.25s;
}

.bad-signal--one {
    left: 29%;
    top: 58%;
}

.bad-signal--two {
    left: 53%;
    top: 47%;
    animation-delay: -0.2s;
}

.bad-signal--three {
    left: 53%;
    top: 19%;
    animation-delay: -0.4s;
}

.bad-signal--four {
    left: 76%;
    top: 36%;
    animation-delay: -0.6s;
}

.bad-signal--five {
    left: 61%;
    top: 83%;
    animation-delay: -0.8s;
}

.problems__bottom {
    width: min(100%, 620px);
    margin: 36px auto 0;
    display: grid;
    gap: 26px;
}

.problems__note {
    display: grid;
    grid-template-columns: 50px 1fr;
    align-items: center;
    gap: 22px;
    padding: 20px 26px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    background: rgba(6, 14, 17, 0.72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.problems__note img {
    width: 50px;
    height: 50px;
    object-fit: contain;
}

.problems__note p {
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 18px;
    line-height: 1.45;
}

.problems__note strong {
    color: var(--gold-soft);
    font-weight: 800;
}

.problems__cta {
    position: relative;
    overflow: hidden;
    min-height: 78px;
    padding: 18px 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 52px;
    border: 1px solid rgba(112, 223, 128, 0.38);
    border-radius: 8px;
    color: #fff;
    background: linear-gradient(90deg, #278f3f, #36a24b);
    box-shadow: 0 0 28px rgba(63, 198, 82, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    text-transform: uppercase;
    font-size: 25px;
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: 0;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
    animation: cta-pulse 2.6s ease-in-out infinite;
}

.problems__cta:hover,
.problems__cta:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(164, 255, 174, 0.7);
    box-shadow: 0 0 34px rgba(73, 218, 91, 0.52), inset 0 1px 0 rgba(255, 255, 255, 0.24);
    outline: none;
}

.problems__cta img {
    width: 28px;
    flex: 0 0 28px;
    filter: brightness(0) invert(1);
    animation: cta-arrow 1.35s ease-in-out infinite;
}

.result {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 80px 0;
    background:
        radial-gradient(circle at 50% 43%, rgba(63, 198, 82, 0.12), transparent 29%),
        radial-gradient(circle at 20% 64%, rgba(217, 164, 81, 0.08), transparent 24%),
        radial-gradient(circle at 84% 28%, rgba(45, 83, 103, 0.22), transparent 28%),
        linear-gradient(145deg, #020506 0%, #071114 46%, #020506 100%);
}

.result__shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.03), transparent 32%, rgba(0, 0, 0, 0.46)),
        linear-gradient(90deg, rgba(0, 0, 0, 0.28), transparent 48%, rgba(0, 0, 0, 0.28));
    pointer-events: none;
}

.result__inner {
    width: min(100%, 1450px);
    margin: 0 auto;
    padding: 0 40px;
}

.result .section-kicker {
    width: min(100%, 1040px);
}

.result h2 {
    width: min(100%, 1120px);
    margin: 28px auto 0;
    font-size: 42px;
    line-height: 1.18;
    font-weight: 800;
    letter-spacing: 0;
    text-align: center;
    text-shadow: 0 3px 12px rgba(0, 0, 0, 0.42);
}

.result h2 em {
    color: var(--gold);
    font-style: normal;
}

.result__lead {
    width: min(100%, 760px);
    margin: 18px auto 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 20px;
    line-height: 1.38;
    text-align: center;
}

.result__compare {
    margin-top: 34px;
    display: grid;
    grid-template-columns: 230px minmax(650px, 1fr) 240px;
    align-items: center;
    gap: 24px;
}

.result-list {
    align-self: stretch;
    display: grid;
    align-items: center;
    padding: 22px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.012)),
        rgba(6, 14, 17, 0.72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 45px rgba(0, 0, 0, 0.28);
    backdrop-filter: blur(10px);
}

.result-list ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.result-list li {
    --status-center: 14px;
    position: relative;
    min-height: 74px;
    padding: 0 0 20px 36px;
    color: rgba(255, 255, 255, 0.86);
    font-size: 17px;
    line-height: 1.45;
}

.result-list li + li {
    --status-center: 34px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.result-list li::before {
    content: "";
    position: absolute;
    left: 10px;
    top: var(--status-center);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid currentColor;
    box-shadow: 0 0 14px currentColor;
    transform: translate(-50%, -50%);
    animation: status-pulse 2.8s ease-in-out infinite;
}

.result-list li::after {
    position: absolute;
    left: 10px;
    top: var(--status-center);
    width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    font-size: 15px;
    line-height: 1;
    font-weight: 700;
    transform: translate(-50%, -50%);
}

.result-list--bad li::before,
.result-list--bad li::after {
    color: #ff3428;
}

.result-list--bad li::after {
    content: "";
    width: 10px;
    height: 10px;
    background:
        linear-gradient(45deg, transparent 0 41%, currentColor 42% 58%, transparent 59% 100%),
        linear-gradient(-45deg, transparent 0 41%, currentColor 42% 58%, transparent 59% 100%);
}

.result-list--good li::before,
.result-list--good li::after {
    color: #31df51;
}

.result-list--good li::after {
    content: "";
    width: 8px;
    height: 5px;
    display: block;
    border-left: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translate(-50%, -58%) rotate(-45deg);
}

.result__plans {
    min-width: 0;
}

.result__labels {
    width: min(100%, 510px);
    margin: 0 auto 18px;
    display: grid;
    grid-template-columns: 1fr 56px 1fr;
    align-items: center;
    gap: 12px;
}

.result__tag {
    justify-self: center;
    min-width: 84px;
    padding: 10px 22px;
    border-radius: 8px;
    color: #fff;
    font-size: 22px;
    line-height: 1;
    font-weight: 800;
    text-transform: uppercase;
    text-align: center;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.result__tag--bad {
    background: linear-gradient(145deg, #bd2a21, #7e1713);
}

.result__tag--good {
    background: linear-gradient(145deg, #32a74c, #1d6f32);
}

.result__arrow {
    position: relative;
    width: 56px;
    height: 56px;
    display: grid;
    place-items: center;
    border: 2px solid var(--gold-soft);
    border-radius: 50%;
    box-shadow: 0 0 22px rgba(217, 164, 81, 0.18);
    animation: compare-arrow-pulse 2.2s ease-in-out infinite;
}

.result__arrow::before,
.result__arrow::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 120px;
    border-top: 1px dashed rgba(217, 164, 81, 0.55);
}

.result__arrow::before {
    right: calc(100% + 8px);
    border-color: rgba(218, 47, 37, 0.55);
}

.result__arrow::after {
    left: calc(100% + 8px);
    border-color: rgba(63, 198, 82, 0.5);
}

.result__arrow img {
    width: 28px;
    height: auto;
    filter: drop-shadow(0 0 10px rgba(217, 164, 81, 0.35));
}

.result__images {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
    align-items: stretch;
    gap: 28px;
}

.result__divider {
    width: 1px;
    min-height: 100%;
    background: repeating-linear-gradient(to bottom, var(--gold-soft) 0 4px, transparent 4px 9px);
    opacity: 0.9;
    animation: divider-flow 1.8s linear infinite;
}

.result-plan {
    position: relative;
    overflow: hidden;
    margin: 0;
    border-radius: 8px;
    filter: drop-shadow(0 30px 45px rgba(0, 0, 0, 0.35));
    transition: transform 220ms ease, filter 220ms ease;
}

.result-plan:hover {
    transform: translateY(-4px);
    filter: drop-shadow(0 36px 58px rgba(0, 0, 0, 0.42));
}

.result-plan::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent 0 38%, rgba(255, 255, 255, 0.12) 50%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-120%);
    animation: plan-shine 5.8s ease-in-out infinite;
    pointer-events: none;
}

.result-plan--good::after {
    animation-delay: -1.8s;
}

.result-plan img {
    width: 100%;
    height: auto;
}

.result__bottom {
    width: min(100%, 660px);
    margin: 26px auto 0;
    display: grid;
    gap: 20px;
}

.result__note {
    display: grid;
    grid-template-columns: 54px 1fr;
    align-items: center;
    gap: 20px;
    padding: 18px 24px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    background: rgba(6, 14, 17, 0.72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 45px rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(10px);
}

.result__note img {
    width: 54px;
    height: 54px;
    object-fit: contain;
    animation: icon-float 3.8s ease-in-out infinite;
}

.result__note p {
    margin: 0;
    display: grid;
    gap: 6px;
    color: rgba(255, 255, 255, 0.72);
    font-size: 16px;
    line-height: 1.35;
}

.result__note strong {
    color: #fff;
    font-size: 21px;
    line-height: 1.2;
}

.result__cta {
    position: relative;
    overflow: hidden;
    min-height: 68px;
    padding: 18px 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 52px;
    border: 1px solid rgba(112, 223, 128, 0.38);
    border-radius: 8px;
    color: #fff;
    background: linear-gradient(90deg, #278f3f, #36a24b);
    box-shadow: 0 0 28px rgba(63, 198, 82, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    text-transform: uppercase;
    font-size: 23px;
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: 0;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
    animation: cta-pulse 2.6s ease-in-out infinite;
}

.result__cta:hover,
.result__cta:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(164, 255, 174, 0.7);
    box-shadow: 0 0 34px rgba(73, 218, 91, 0.52), inset 0 1px 0 rgba(255, 255, 255, 0.24);
    outline: none;
}

.result__cta::before {
    content: "";
    position: absolute;
    inset: -2px;
    background: linear-gradient(110deg, transparent 0 34%, rgba(255, 255, 255, 0.32) 48%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-115%);
    animation: cta-shine 3.4s ease-in-out infinite;
    pointer-events: none;
}

.result__cta > * {
    position: relative;
    z-index: 1;
}

.result__cta img {
    width: 28px;
    flex: 0 0 28px;
    filter: brightness(0) invert(1);
    animation: cta-arrow 1.35s ease-in-out infinite;
}

.workflow {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 80px 0;
    background:
        radial-gradient(circle at 58% 48%, rgba(63, 198, 82, 0.12), transparent 31%),
        radial-gradient(circle at 18% 42%, rgba(217, 164, 81, 0.09), transparent 25%),
        radial-gradient(circle at 83% 34%, rgba(45, 83, 103, 0.21), transparent 29%),
        linear-gradient(145deg, #020506 0%, #071114 45%, #020506 100%);
}

.workflow__shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.03), transparent 31%, rgba(0, 0, 0, 0.46)),
        linear-gradient(90deg, rgba(0, 0, 0, 0.3), transparent 48%, rgba(0, 0, 0, 0.3));
    pointer-events: none;
}

.workflow__inner {
    width: min(100%, 1450px);
    margin: 0 auto;
    padding: 0 56px;
}

.workflow .section-kicker {
    width: min(100%, 1080px);
}

.workflow h2 {
    width: min(100%, 980px);
    margin: 30px auto 0;
    font-size: 45px;
    line-height: 1.18;
    font-weight: 800;
    letter-spacing: 0;
    text-align: center;
    text-shadow: 0 3px 12px rgba(0, 0, 0, 0.42);
}

.workflow h2 span {
    display: block;
}

.workflow h2 em {
    color: var(--gold);
    font-style: normal;
}

.workflow__lead {
    width: min(100%, 760px);
    margin: 16px auto 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 21px;
    line-height: 1.42;
    text-align: center;
}

.workflow__lead span {
    display: block;
    margin-top: 3px;
}

.workflow__layout {
    margin-top: 34px;
    display: grid;
    grid-template-columns: minmax(410px, 470px) minmax(560px, 1fr);
    align-items: center;
    gap: 42px;
}

.workflow__steps {
    display: grid;
    gap: 24px;
}

.workflow-step {
    position: relative;
    display: grid;
    grid-template-columns: 108px 48px minmax(0, 1fr);
    align-items: center;
    gap: 24px;
}

.workflow-step:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 54px;
    top: calc(50% + 55px);
    width: 1px;
    height: 35px;
    background: repeating-linear-gradient(to bottom, rgba(255, 255, 255, 0.62) 0 4px, transparent 4px 9px);
    opacity: 0.72;
}

.workflow-step__icon {
    position: relative;
    overflow: hidden;
    width: 108px;
    height: 96px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.015)),
        rgba(6, 14, 17, 0.72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 45px rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(10px);
}

.workflow-step__icon::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 0 34%, rgba(255, 255, 255, 0.09) 48%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-120%);
    animation: card-shine 6s ease-in-out infinite;
    animation-delay: var(--delay, 0s);
}

.workflow-step__icon img {
    position: relative;
    z-index: 1;
    width: 58px;
    height: 58px;
    object-fit: contain;
    animation: icon-float 3.8s ease-in-out infinite;
    animation-delay: var(--delay, 0s);
}

.workflow-step__number {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border: 2px solid var(--gold);
    border-radius: 50%;
    color: var(--gold-soft);
    background: rgba(2, 5, 6, 0.62);
    box-shadow: 0 0 18px rgba(217, 164, 81, 0.14);
    font-size: 19px;
    line-height: 1;
    font-weight: 800;
    animation: status-pulse 2.8s ease-in-out infinite;
    animation-delay: var(--delay, 0s);
}

.workflow-step__content h3 {
    margin: 0;
    font-size: 24px;
    line-height: 1.18;
    font-weight: 800;
}

.workflow-step__content p {
    margin: 12px 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 17px;
    line-height: 1.42;
}

.workflow__visual {
    min-width: 0;
}

.workflow-map {
    position: relative;
    overflow: hidden;
    width: min(100%, 760px);
    margin: 0 auto;
    filter: drop-shadow(0 34px 56px rgba(0, 0, 0, 0.36));
}

.workflow-map::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent 0 38%, rgba(255, 255, 255, 0.1) 50%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-120%);
    animation: plan-shine 6.4s ease-in-out infinite;
    pointer-events: none;
}

.workflow-map img {
    width: 100%;
    height: auto;
}

.workflow__bottom {
    width: min(100%, 920px);
    margin: 36px auto 0;
    display: grid;
    grid-template-columns: 64px 1fr;
    align-items: center;
    gap: 28px;
    padding: 24px 42px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.012)),
        rgba(6, 14, 17, 0.76);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 45px rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(10px);
}

.workflow__bottom img {
    width: 64px;
    height: 64px;
    object-fit: contain;
    animation: icon-float 3.8s ease-in-out infinite;
}

.workflow__bottom p {
    margin: 0;
    display: grid;
    gap: 4px;
    font-size: 23px;
    line-height: 1.25;
    font-weight: 800;
}

.workflow__bottom span {
    color: var(--gold);
}

.wifi-system {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 80px 0;
    background:
        radial-gradient(circle at 50% 45%, rgba(63, 198, 82, 0.13), transparent 31%),
        radial-gradient(circle at 16% 34%, rgba(217, 164, 81, 0.09), transparent 25%),
        radial-gradient(circle at 86% 32%, rgba(45, 83, 103, 0.22), transparent 29%),
        linear-gradient(145deg, #020506 0%, #071114 43%, #020506 100%);
}

.wifi-system__shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.032), transparent 30%, rgba(0, 0, 0, 0.48)),
        linear-gradient(90deg, rgba(0, 0, 0, 0.32), transparent 48%, rgba(0, 0, 0, 0.32));
    pointer-events: none;
}

.wifi-system__inner {
    width: min(100%, 1536px);
    margin: 0 auto;
    padding: 0 40px;
    min-width: 0;
}

.wifi-system .section-kicker {
    width: min(100%, 900px);
}

.wifi-system h2 {
    width: min(100%, 980px);
    margin: 24px auto 0;
    font-size: 48px;
    line-height: 1.14;
    font-weight: 800;
    letter-spacing: 0;
    text-align: center;
    text-shadow: 0 3px 12px rgba(0, 0, 0, 0.42);
    overflow-wrap: break-word;
}

.wifi-system h2 span {
    display: block;
    color: var(--gold);
}

.wifi-system__lead {
    width: min(100%, 760px);
    margin: 16px auto 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 20px;
    line-height: 1.45;
    text-align: center;
    overflow-wrap: break-word;
}

.wifi-system__layout {
    margin-top: 24px;
    display: grid;
    grid-template-columns: minmax(270px, 328px) minmax(560px, 1fr) minmax(270px, 328px);
    align-items: center;
    gap: 20px;
    min-width: 0;
}

.wifi-system__side {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 12px;
    min-width: 0;
}

.wifi-benefit {
    position: relative;
    overflow: hidden;
    min-height: 148px;
    padding: 22px 22px;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    align-items: start;
    gap: 18px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.014)),
        rgba(6, 14, 17, 0.76);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 45px rgba(0, 0, 0, 0.27);
    backdrop-filter: blur(10px);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
    min-width: 0;
}

.wifi-benefit::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 0 34%, rgba(255, 255, 255, 0.08) 48%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-120%);
    animation: card-shine 6s ease-in-out infinite;
    animation-delay: var(--delay, 0s);
    pointer-events: none;
}

.wifi-benefit::after {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    background:
        radial-gradient(circle at 20% 20%, rgba(217, 164, 81, 0.18), transparent 32%),
        radial-gradient(circle at 90% 90%, rgba(63, 198, 82, 0.14), transparent 34%);
    opacity: 0.42;
    animation: card-glow 4.8s ease-in-out infinite;
    pointer-events: none;
}

.wifi-benefit:hover {
    transform: translateY(-4px);
    border-color: rgba(217, 164, 81, 0.42);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 24px 58px rgba(0, 0, 0, 0.36), 0 0 28px rgba(217, 164, 81, 0.08);
}

.wifi-benefit > * {
    position: relative;
    z-index: 1;
}

.wifi-benefit img {
    width: 58px;
    height: 58px;
    object-fit: contain;
    animation: icon-float 3.8s ease-in-out infinite;
    animation-delay: var(--delay, 0s);
}

.wifi-benefit div {
    min-width: 0;
}

.wifi-benefit h3 {
    margin: 0;
    font-size: 20px;
    line-height: 1.22;
    font-weight: 800;
    letter-spacing: 0;
    overflow-wrap: break-word;
}

.wifi-benefit p {
    margin: 10px 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 16px;
    line-height: 1.45;
    overflow-wrap: break-word;
}

.wifi-system__visual {
    position: relative;
    z-index: 1;
    min-width: 0;
}

.wifi-system-map {
    position: relative;
    overflow: hidden;
    width: min(100%, 820px);
    max-width: 100%;
    margin: 0 auto;
    filter: drop-shadow(0 34px 56px rgba(0, 0, 0, 0.36));
}

.wifi-system-map::before {
    content: "";
    position: absolute;
    inset: 8% 10%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(71, 210, 82, 0.18), transparent 58%);
    opacity: 0.7;
    animation: card-glow 4.6s ease-in-out infinite;
    pointer-events: none;
}

.wifi-system-map::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent 0 38%, rgba(255, 255, 255, 0.09) 50%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-120%);
    animation: plan-shine 6.4s ease-in-out infinite;
    pointer-events: none;
}

.wifi-system-map img {
    position: relative;
    z-index: 1;
    width: 100%;
    height: auto;
}

.wifi-system__bottom {
    width: min(100%, 740px);
    margin: 10px auto 0;
    display: grid;
    gap: 14px;
    min-width: 0;
}

.wifi-system__note {
    display: grid;
    grid-template-columns: 64px 1fr;
    align-items: center;
    gap: 24px;
    padding: 20px 34px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.012)),
        rgba(6, 14, 17, 0.78);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 45px rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(10px);
}

.wifi-system__note img {
    width: 64px;
    height: 64px;
    object-fit: contain;
    animation: icon-float 3.8s ease-in-out infinite;
}

.wifi-system__note p {
    margin: 0;
    display: grid;
    gap: 6px;
    color: rgba(255, 255, 255, 0.76);
    font-size: 18px;
    line-height: 1.35;
    min-width: 0;
    overflow-wrap: break-word;
}

.wifi-system__note strong {
    color: #fff;
    font-size: 24px;
    line-height: 1.16;
    overflow-wrap: break-word;
}

.wifi-system__cta {
    position: relative;
    overflow: hidden;
    width: min(100%, 630px);
    min-height: 68px;
    margin: 0 auto;
    padding: 18px 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 52px;
    border: 1px solid rgba(112, 223, 128, 0.38);
    border-radius: 8px;
    color: #fff;
    background: linear-gradient(90deg, #278f3f, #36a24b);
    box-shadow: 0 0 28px rgba(63, 198, 82, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    text-transform: uppercase;
    font-size: 24px;
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: 0;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
    animation: cta-pulse 2.6s ease-in-out infinite;
}

.wifi-system__cta::before {
    content: "";
    position: absolute;
    inset: -2px;
    background: linear-gradient(110deg, transparent 0 34%, rgba(255, 255, 255, 0.32) 48%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-115%);
    animation: cta-shine 3.4s ease-in-out infinite;
    pointer-events: none;
}

.wifi-system__cta:hover,
.wifi-system__cta:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(164, 255, 174, 0.7);
    box-shadow: 0 0 34px rgba(73, 218, 91, 0.52), inset 0 1px 0 rgba(255, 255, 255, 0.24);
    outline: none;
}

.wifi-system__cta > * {
    position: relative;
    z-index: 1;
}

.wifi-system__cta span {
    min-width: 0;
    text-align: center;
    overflow-wrap: break-word;
}

.wifi-system__cta img {
    width: 28px;
    flex: 0 0 28px;
    filter: brightness(0) invert(1);
    animation: cta-arrow 1.35s ease-in-out infinite;
}

.renovation {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 80px 0;
    background:
        radial-gradient(circle at 40% 50%, rgba(63, 198, 82, 0.11), transparent 31%),
        radial-gradient(circle at 78% 28%, rgba(217, 164, 81, 0.08), transparent 24%),
        radial-gradient(circle at 20% 34%, rgba(45, 83, 103, 0.2), transparent 28%),
        linear-gradient(145deg, #020506 0%, #071114 44%, #020506 100%);
}

.renovation__shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.03), transparent 31%, rgba(0, 0, 0, 0.48)),
        linear-gradient(90deg, rgba(0, 0, 0, 0.3), transparent 48%, rgba(0, 0, 0, 0.3));
    pointer-events: none;
}

.renovation__inner {
    width: min(100%, 1420px);
    margin: 0 auto;
    padding: 0 56px;
    min-width: 0;
}

.renovation .section-kicker {
    width: min(100%, 920px);
}

.renovation h2 {
    width: min(100%, 920px);
    margin: 26px auto 0;
    font-size: 46px;
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: 0;
    text-align: center;
    text-shadow: 0 3px 12px rgba(0, 0, 0, 0.42);
    overflow-wrap: break-word;
}

.renovation h2 span {
    display: block;
    margin-top: 8px;
    color: var(--gold);
    font-size: 31px;
    line-height: 1.18;
}

.renovation__lead {
    width: min(100%, 790px);
    margin: 14px auto 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 20px;
    line-height: 1.4;
    text-align: center;
    overflow-wrap: break-word;
}

.renovation__lead span {
    display: block;
    margin-top: 3px;
}

.renovation__layout {
    margin-top: 34px;
    display: grid;
    grid-template-columns: minmax(480px, 1fr) minmax(430px, 620px);
    align-items: center;
    gap: 52px;
    min-width: 0;
}

.renovation__visual {
    min-width: 0;
}

.renovation-map {
    position: relative;
    overflow: hidden;
    width: min(100%, 720px);
    margin: 0 auto;
    filter: drop-shadow(0 34px 56px rgba(0, 0, 0, 0.36));
}

.renovation-map::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent 0 38%, rgba(255, 255, 255, 0.09) 50%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-120%);
    animation: plan-shine 6.4s ease-in-out infinite;
    pointer-events: none;
}

.renovation-map img {
    width: 100%;
    height: auto;
}

.renovation__cards {
    min-width: 0;
    display: grid;
    gap: 18px;
}

.renovation-card {
    position: relative;
    overflow: hidden;
    min-height: 130px;
    padding: 22px 28px 22px 26px;
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    align-items: center;
    gap: 24px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.014)),
        rgba(6, 14, 17, 0.76);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 45px rgba(0, 0, 0, 0.27);
    backdrop-filter: blur(10px);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.renovation-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 0 34%, rgba(255, 255, 255, 0.08) 48%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-120%);
    animation: card-shine 6s ease-in-out infinite;
    animation-delay: var(--delay, 0s);
    pointer-events: none;
}

.renovation-card::after {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    background:
        radial-gradient(circle at 18% 24%, rgba(217, 164, 81, 0.18), transparent 32%),
        radial-gradient(circle at 92% 88%, rgba(63, 198, 82, 0.12), transparent 34%);
    opacity: 0.4;
    animation: card-glow 4.8s ease-in-out infinite;
    pointer-events: none;
}

.renovation-card:hover {
    transform: translateY(-4px);
    border-color: rgba(217, 164, 81, 0.42);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 24px 58px rgba(0, 0, 0, 0.36), 0 0 28px rgba(217, 164, 81, 0.08);
}

.renovation-card > * {
    position: relative;
    z-index: 1;
}

.renovation-card__icon {
    width: 92px;
    height: 92px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(217, 164, 81, 0.46);
    border-radius: 50%;
    background:
        radial-gradient(circle, rgba(217, 164, 81, 0.1), transparent 62%),
        rgba(2, 5, 6, 0.36);
    box-shadow: 0 0 22px rgba(217, 164, 81, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.renovation-card__icon img {
    width: 54px;
    height: 54px;
    object-fit: contain;
    animation: icon-float 3.8s ease-in-out infinite;
    animation-delay: var(--delay, 0s);
}

.renovation-card__content {
    min-width: 0;
}

.renovation-card h3 {
    margin: 0;
    font-size: 23px;
    line-height: 1.18;
    font-weight: 800;
    letter-spacing: 0;
    overflow-wrap: break-word;
}

.renovation-card p {
    margin: 12px 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 17px;
    line-height: 1.42;
    overflow-wrap: break-word;
}

.renovation-card strong {
    color: var(--gold);
    font-weight: 800;
}

.renovation__cta {
    position: relative;
    overflow: hidden;
    width: min(100%, 600px);
    min-height: 72px;
    margin: 34px auto 0;
    padding: 18px 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 52px;
    border: 1px solid rgba(112, 223, 128, 0.38);
    border-radius: 8px;
    color: #fff;
    background: linear-gradient(90deg, #278f3f, #36a24b);
    box-shadow: 0 0 28px rgba(63, 198, 82, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    text-transform: uppercase;
    font-size: 24px;
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: 0;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
    animation: cta-pulse 2.6s ease-in-out infinite;
}

.renovation__cta::before {
    content: "";
    position: absolute;
    inset: -2px;
    background: linear-gradient(110deg, transparent 0 34%, rgba(255, 255, 255, 0.32) 48%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-115%);
    animation: cta-shine 3.4s ease-in-out infinite;
    pointer-events: none;
}

.renovation__cta:hover,
.renovation__cta:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(164, 255, 174, 0.7);
    box-shadow: 0 0 34px rgba(73, 218, 91, 0.52), inset 0 1px 0 rgba(255, 255, 255, 0.24);
    outline: none;
}

.renovation__cta > * {
    position: relative;
    z-index: 1;
}

.renovation__cta span {
    min-width: 0;
    text-align: center;
    overflow-wrap: break-word;
}

.renovation__cta img {
    width: 28px;
    flex: 0 0 28px;
    filter: brightness(0) invert(1);
    animation: cta-arrow 1.35s ease-in-out infinite;
}

.consultation {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 80px 0;
    background:
        linear-gradient(180deg, rgba(2, 5, 6, 0.35), rgba(2, 5, 6, 0.08) 48%, rgba(2, 5, 6, 0.42)),
        url("../img/bl 7/bl 7 fon.webp") center bottom / cover no-repeat,
        linear-gradient(145deg, #020506 0%, #071114 44%, #020506 100%);
}

.consultation__shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        radial-gradient(circle at 50% 47%, rgba(63, 198, 82, 0.1), transparent 32%),
        radial-gradient(circle at 72% 24%, rgba(217, 164, 81, 0.08), transparent 24%),
        linear-gradient(90deg, rgba(0, 0, 0, 0.28), transparent 50%, rgba(0, 0, 0, 0.28));
    pointer-events: none;
}

.consultation__inner {
    width: min(100%, 1220px);
    margin: 0 auto;
    padding: 0 40px;
    min-width: 0;
}

.consultation .section-kicker {
    width: min(100%, 960px);
}

.consultation h2 {
    width: min(100%, 920px);
    margin: 24px auto 0;
    font-size: 46px;
    line-height: 1.16;
    font-weight: 800;
    letter-spacing: 0;
    text-align: center;
    text-shadow: 0 3px 12px rgba(0, 0, 0, 0.42);
    overflow-wrap: break-word;
}

.consultation h2 span {
    display: block;
    color: var(--gold);
}

.consultation__lead {
    width: min(100%, 680px);
    margin: 18px auto 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 20px;
    line-height: 1.42;
    text-align: center;
    overflow-wrap: break-word;
}

.consultation__lead span {
    display: block;
    margin-top: 4px;
}

.consultation-form {
    margin: 28px auto 0;
    display: grid;
    justify-items: center;
    gap: 26px;
}

.consultation-form__grid {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

.consultation-form__card {
    position: relative;
    overflow: hidden;
    min-width: 0;
    min-height: 290px;
    margin: 0;
    padding: 26px 26px 24px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.014)),
        rgba(6, 14, 17, 0.76);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 45px rgba(0, 0, 0, 0.27);
    backdrop-filter: blur(10px);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.consultation-form__card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 0 34%, rgba(255, 255, 255, 0.08) 48%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-120%);
    animation: card-shine 6s ease-in-out infinite;
    animation-delay: var(--delay, 0s);
    pointer-events: none;
}

.consultation-form__card::after {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    background:
        radial-gradient(circle at 18% 20%, rgba(217, 164, 81, 0.18), transparent 32%),
        radial-gradient(circle at 90% 90%, rgba(63, 198, 82, 0.12), transparent 34%);
    opacity: 0.4;
    animation: card-glow 4.8s ease-in-out infinite;
    pointer-events: none;
}

.consultation-form__card:hover,
.consultation-form__phone:hover {
    transform: translateY(-4px);
    border-color: rgba(217, 164, 81, 0.42);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 24px 58px rgba(0, 0, 0, 0.36), 0 0 28px rgba(217, 164, 81, 0.08);
}

.consultation-form__card > * {
    position: relative;
    z-index: 1;
}

.consultation-form__card legend {
    float: left;
    width: 100%;
    margin: 0 0 24px;
    padding: 0;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    font-size: 18px;
    line-height: 1.22;
    font-weight: 800;
    letter-spacing: 0;
}

.consultation-form__card legend + .choice {
    clear: both;
}

.consultation-form__card legend img {
    width: 44px;
    height: 44px;
    object-fit: contain;
    animation: icon-float 3.8s ease-in-out infinite;
    animation-delay: var(--delay, 0s);
}

.choice {
    position: relative;
    z-index: 1;
    min-height: 40px;
    display: flex;
    align-items: center;
    gap: 14px;
    color: rgba(255, 255, 255, 0.82);
    font-size: 18px;
    line-height: 1.25;
    cursor: pointer;
}

.choice + .choice {
    margin-top: 6px;
}

.choice input {
    position: relative;
    flex: 0 0 23px;
    width: 23px;
    height: 23px;
    margin: 0;
    appearance: none;
    border: 1.5px solid rgba(255, 255, 255, 0.62);
    border-radius: 50%;
    background: rgba(2, 5, 6, 0.38);
    box-shadow: inset 0 0 0 4px rgba(2, 5, 6, 0.85);
    transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.choice--checkbox input {
    border-radius: 3px;
    box-shadow: none;
}

.choice input:checked {
    border-color: var(--gold);
    background: var(--gold);
    box-shadow: inset 0 0 0 5px rgba(2, 5, 6, 0.9), 0 0 14px rgba(217, 164, 81, 0.36);
}

.choice--checkbox input:checked {
    background:
        linear-gradient(135deg, transparent 0 42%, #081114 42% 55%, transparent 55% 100%),
        linear-gradient(45deg, transparent 0 44%, #081114 44% 58%, transparent 58% 100%),
        var(--gold);
    box-shadow: 0 0 14px rgba(217, 164, 81, 0.36);
}

.choice input:focus-visible,
.consultation-form__phone input:focus {
    outline: none;
    border-color: rgba(83, 220, 102, 0.78);
    box-shadow: 0 0 0 3px rgba(83, 220, 102, 0.14);
}

.choice span {
    min-width: 0;
    overflow-wrap: break-word;
}

.consultation-form__phone {
    position: relative;
    overflow: hidden;
    width: min(100%, 690px);
    min-height: 118px;
    padding: 28px 34px;
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    align-items: center;
    gap: 24px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.014)),
        rgba(6, 14, 17, 0.78);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 45px rgba(0, 0, 0, 0.27);
    backdrop-filter: blur(10px);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.consultation-form__phone::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 0 34%, rgba(255, 255, 255, 0.08) 48%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-120%);
    animation: card-shine 6s ease-in-out infinite;
    animation-delay: var(--delay, 0s);
    pointer-events: none;
}

.consultation-form__phone > img {
    position: relative;
    z-index: 1;
    width: 54px;
    height: 54px;
    object-fit: contain;
    animation: icon-float 3.8s ease-in-out infinite;
}

.consultation-form__phone-field {
    position: relative;
    z-index: 1;
    min-width: 0;
    display: grid;
    gap: 12px;
    color: #fff;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 800;
}

.consultation-form__phone input {
    width: min(100%, 280px);
    min-height: 52px;
    padding: 0 18px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 6px;
    color: #fff;
    background: rgba(2, 5, 6, 0.44);
    font-size: 18px;
    font-weight: 400;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.consultation-form__phone input::placeholder {
    color: rgba(255, 255, 255, 0.78);
}

.consultation-form__submit {
    position: relative;
    overflow: hidden;
    width: min(100%, 590px);
    min-height: 72px;
    padding: 18px 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 52px;
    border: 1px solid rgba(112, 223, 128, 0.38);
    border-radius: 8px;
    color: #fff;
    background: linear-gradient(90deg, #278f3f, #36a24b);
    box-shadow: 0 0 28px rgba(63, 198, 82, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    text-transform: uppercase;
    font-size: 24px;
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: 0;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
    animation: cta-pulse 2.6s ease-in-out infinite;
}

.consultation-form__submit::before {
    content: "";
    position: absolute;
    inset: -2px;
    background: linear-gradient(110deg, transparent 0 34%, rgba(255, 255, 255, 0.32) 48%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-115%);
    animation: cta-shine 3.4s ease-in-out infinite;
    pointer-events: none;
}

.consultation-form__submit:hover,
.consultation-form__submit:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(164, 255, 174, 0.7);
    box-shadow: 0 0 34px rgba(73, 218, 91, 0.52), inset 0 1px 0 rgba(255, 255, 255, 0.24);
    outline: none;
}

.consultation-form__submit > * {
    position: relative;
    z-index: 1;
}

.consultation-form__submit span {
    min-width: 0;
    text-align: center;
    overflow-wrap: break-word;
}

.consultation-form__submit img {
    width: 28px;
    flex: 0 0 28px;
    filter: brightness(0) invert(1);
    animation: cta-arrow 1.35s ease-in-out infinite;
}

.consultation-form__status {
    min-height: 22px;
    margin: -8px 0 0;
    color: var(--gold-soft);
    font-size: 15px;
    line-height: 1.35;
    text-align: center;
}

.consultation__note {
    margin-top: 14px;
    display: grid;
    justify-items: center;
    text-align: center;
}

.consultation__note p {
    width: min(100%, 720px);
    margin: 0;
    display: grid;
    gap: 22px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 18px;
    line-height: 1.42;
}

.consultation__note strong {
    position: relative;
    color: #fff;
    font-size: 20px;
    font-weight: 400;
}

.consultation__note strong::before {
    content: "";
    display: inline-block;
    width: 38px;
    height: 26px;
    margin-right: 14px;
    vertical-align: middle;
    background: url("../img/bl 7/bl 7 ic 5.png") center / contain no-repeat;
    filter: drop-shadow(0 0 10px rgba(217, 164, 81, 0.22));
}

.site-footer {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 80px 0;
    background:
        radial-gradient(circle at 50% 26%, rgba(45, 83, 103, 0.24), transparent 33%),
        radial-gradient(circle at 77% 55%, rgba(217, 164, 81, 0.08), transparent 24%),
        linear-gradient(145deg, #020506 0%, #071114 44%, #020506 100%);
}

.site-footer__shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.03), transparent 34%, rgba(0, 0, 0, 0.42)),
        linear-gradient(90deg, rgba(0, 0, 0, 0.3), transparent 48%, rgba(0, 0, 0, 0.3));
    pointer-events: none;
}

.site-footer__inner {
    width: min(100%, 1500px);
    margin: 0 auto;
    padding: 0 56px;
    min-width: 0;
}

.site-footer__main {
    display: grid;
    grid-template-columns: 1.15fr 0.9fr 1.25fr;
    align-items: center;
    gap: 52px;
}

.site-footer__brand,
.site-footer__area,
.site-footer__contacts {
    min-width: 0;
}

.site-footer__area,
.site-footer__contacts {
    position: relative;
}

.site-footer__area::before,
.site-footer__contacts::before {
    content: "";
    position: absolute;
    left: -26px;
    top: 50%;
    width: 1px;
    height: 420px;
    background: linear-gradient(180deg, transparent, rgba(217, 164, 81, 0.38), transparent);
    transform: translateY(-50%);
}

.site-footer__logo {
    display: flex;
    align-items: center;
    gap: 24px;
    color: inherit;
    text-decoration: none;
}

.site-footer__logo img {
    width: 108px;
    height: 108px;
    object-fit: contain;
    animation: icon-float 3.8s ease-in-out infinite;
}

.site-footer__logo span {
    min-width: 0;
    display: grid;
    gap: 14px;
}

.site-footer__logo strong {
    font-size: 42px;
    line-height: 1;
    font-weight: 500;
    letter-spacing: 0;
}

.site-footer__logo small {
    color: rgba(255, 255, 255, 0.72);
    font-size: 17px;
    line-height: 1.25;
    text-transform: uppercase;
}

.site-footer__area {
    display: grid;
    justify-items: center;
    text-align: center;
}

.site-footer__area > img {
    width: 205px;
    height: auto;
    filter: drop-shadow(0 0 22px rgba(217, 164, 81, 0.18));
    animation: icon-float 4.2s ease-in-out infinite;
}

.site-footer__area h2 {
    margin: 34px 0 0;
    font-size: 38px;
    line-height: 1.16;
    font-weight: 800;
    letter-spacing: 0;
}

.site-footer__area h2 span {
    display: block;
    color: var(--gold);
}

.site-footer__area p {
    margin: 32px 0 0;
    color: rgba(255, 255, 255, 0.72);
    font-size: 24px;
    line-height: 1.55;
}

.site-footer__contacts {
    display: grid;
    gap: 56px;
}

.site-footer__phone {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    align-items: center;
    gap: 34px;
    color: inherit;
    text-decoration: none;
}

.site-footer__phone-icon,
.site-footer__messenger span {
    position: relative;
    overflow: hidden;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background:
        radial-gradient(circle, rgba(217, 164, 81, 0.08), transparent 62%),
        rgba(2, 5, 6, 0.24);
}

.site-footer__phone-icon {
    width: 112px;
    height: 112px;
    border: 2px solid var(--gold);
    box-shadow: 0 0 26px rgba(217, 164, 81, 0.12);
}

.site-footer__phone-icon::before,
.site-footer__messenger span::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 0 34%, rgba(255, 255, 255, 0.12) 48%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-120%);
    animation: card-shine 6s ease-in-out infinite;
    pointer-events: none;
}

.site-footer__phone-icon img {
    position: relative;
    z-index: 1;
    width: 54px;
    height: 54px;
    object-fit: contain;
    animation: icon-float 3.8s ease-in-out infinite;
}

.site-footer__phone small {
    display: block;
    color: rgba(255, 255, 255, 0.7);
    font-size: 28px;
    line-height: 1.1;
}

.site-footer__phone strong {
    display: block;
    margin-top: 28px;
    font-size: 42px;
    line-height: 1.08;
    font-weight: 400;
    letter-spacing: 0;
    overflow-wrap: break-word;
}

.site-footer__divider {
    position: relative;
    height: 1px;
    background: linear-gradient(90deg, rgba(217, 164, 81, 0.22), rgba(217, 164, 81, 0.68), rgba(217, 164, 81, 0.22));
}

.site-footer__divider::after,
.site-footer__line::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 96px;
    height: 3px;
    border-radius: 999px;
    background: radial-gradient(circle, #ffd27b 0 10%, rgba(217, 164, 81, 0.82) 11% 32%, transparent 72%);
    transform: translate(-50%, -50%);
    filter: blur(0.2px);
    animation: status-pulse 2.8s ease-in-out infinite;
}

.site-footer__messengers {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 84px;
}

.site-footer__messenger {
    display: grid;
    justify-items: center;
    gap: 24px;
    color: inherit;
    text-decoration: none;
    transition: transform 180ms ease;
}

.site-footer__messenger:hover,
.site-footer__messenger:focus-visible {
    transform: translateY(-4px);
    outline: none;
}

.site-footer__messenger span {
    width: 112px;
    height: 112px;
    border: 2px solid var(--gold);
    box-shadow: 0 0 26px rgba(217, 164, 81, 0.12);
}

.site-footer__messenger--viber span {
    border-color: #a35cff;
    background:
        radial-gradient(circle, rgba(163, 92, 255, 0.1), transparent 62%),
        rgba(2, 5, 6, 0.24);
    box-shadow: 0 0 28px rgba(163, 92, 255, 0.18);
}

.site-footer__messenger img {
    position: relative;
    z-index: 1;
    width: 58px;
    height: 58px;
    object-fit: contain;
    animation: icon-float 3.8s ease-in-out infinite;
}

.site-footer__messenger strong {
    font-size: 28px;
    line-height: 1;
    font-weight: 800;
}

.site-footer__line {
    position: relative;
    height: 1px;
    margin-top: 86px;
    background: linear-gradient(90deg, rgba(217, 164, 81, 0.18), rgba(217, 164, 81, 0.68), rgba(217, 164, 81, 0.18));
}

.site-footer__bottom {
    margin-top: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 38px;
    color: rgba(255, 255, 255, 0.82);
    font-size: 27px;
    line-height: 1.25;
    text-align: center;
}

.site-footer__bottom p {
    margin: 0;
}

.site-footer__bottom a {
    color: inherit;
    text-decoration: none;
    transition: color 160ms ease;
}

.site-footer__bottom a:hover,
.site-footer__bottom a:focus-visible {
    color: var(--gold-soft);
    outline: none;
}

.site-footer__bottom span {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: var(--gold);
    box-shadow: 0 0 12px rgba(217, 164, 81, 0.75);
}

.mobile-contact-bar {
    display: none;
}

.legal-page {
    position: relative;
    min-height: 100vh;
    isolation: isolate;
    overflow: hidden;
    padding: 38px 0 80px;
    background:
        radial-gradient(circle at 22% 24%, rgba(217, 164, 81, 0.11), transparent 24%),
        radial-gradient(circle at 78% 38%, rgba(63, 198, 82, 0.11), transparent 29%),
        radial-gradient(ellipse at 50% 5%, rgba(45, 83, 103, 0.32), transparent 36%),
        linear-gradient(145deg, #020506 0%, #071114 44%, #020506 100%);
}

.legal-page__shade {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 34%, rgba(0, 0, 0, 0.48)),
        linear-gradient(90deg, rgba(0, 0, 0, 0.3), transparent 48%, rgba(0, 0, 0, 0.3));
    pointer-events: none;
}

.legal-page__inner {
    width: min(100%, 1180px);
    margin: 0 auto;
    padding: 0 40px;
    min-width: 0;
}

.legal-page__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.legal-page__back,
.legal-page__cta {
    position: relative;
    overflow: hidden;
    min-height: 58px;
    padding: 16px 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    border: 1px solid rgba(112, 223, 128, 0.38);
    border-radius: 8px;
    color: #fff;
    background: linear-gradient(90deg, #278f3f, #36a24b);
    box-shadow: 0 0 24px rgba(63, 198, 82, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    text-decoration: none;
    text-transform: uppercase;
    font-size: 15px;
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: 0;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
    animation: cta-pulse 2.6s ease-in-out infinite;
}

.legal-page__back::before,
.legal-page__cta::before {
    content: "";
    position: absolute;
    inset: -2px;
    background: linear-gradient(110deg, transparent 0 34%, rgba(255, 255, 255, 0.32) 48%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-115%);
    animation: cta-shine 3.4s ease-in-out infinite;
    pointer-events: none;
}

.legal-page__back:hover,
.legal-page__back:focus-visible,
.legal-page__cta:hover,
.legal-page__cta:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(164, 255, 174, 0.7);
    box-shadow: 0 0 34px rgba(73, 218, 91, 0.52), inset 0 1px 0 rgba(255, 255, 255, 0.24);
    outline: none;
}

.legal-page__back > *,
.legal-page__cta > * {
    position: relative;
    z-index: 1;
}

.legal-page__back img,
.legal-page__cta img {
    width: 24px;
    flex: 0 0 24px;
    filter: brightness(0) invert(1);
    animation: cta-arrow 1.35s ease-in-out infinite;
}

.legal-page__back img {
    transform: rotate(180deg);
    animation-name: legal-back-arrow;
}

.legal-page__hero {
    margin-top: 74px;
    text-align: center;
}

.legal-page h1 {
    width: min(100%, 820px);
    margin: 28px auto 0;
    font-size: 52px;
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: 0;
    text-shadow: 0 3px 12px rgba(0, 0, 0, 0.42);
    overflow-wrap: break-word;
}

.legal-page__hero p {
    width: min(100%, 760px);
    margin: 18px auto 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 20px;
    line-height: 1.48;
}

.legal-page__content {
    margin-top: 38px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.legal-card {
    position: relative;
    overflow: hidden;
    min-width: 0;
    padding: 26px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.014)),
        rgba(6, 14, 17, 0.76);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 45px rgba(0, 0, 0, 0.27);
    backdrop-filter: blur(10px);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.legal-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 0 34%, rgba(255, 255, 255, 0.08) 48%, transparent 62% 100%);
    opacity: 0;
    transform: translateX(-120%);
    animation: card-shine 6s ease-in-out infinite;
    animation-delay: var(--delay, 0s);
    pointer-events: none;
}

.legal-card::after {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    background:
        radial-gradient(circle at 18% 20%, rgba(217, 164, 81, 0.18), transparent 32%),
        radial-gradient(circle at 90% 90%, rgba(63, 198, 82, 0.12), transparent 34%);
    opacity: 0.4;
    animation: card-glow 4.8s ease-in-out infinite;
    pointer-events: none;
}

.legal-card:hover {
    transform: translateY(-4px);
    border-color: rgba(217, 164, 81, 0.42);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 24px 58px rgba(0, 0, 0, 0.36), 0 0 28px rgba(217, 164, 81, 0.08);
}

.legal-card > * {
    position: relative;
    z-index: 1;
}

.legal-card h2 {
    margin: 0;
    color: var(--gold-soft);
    font-size: 22px;
    line-height: 1.22;
    font-weight: 800;
    letter-spacing: 0;
}

.legal-card p {
    margin: 14px 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 17px;
    line-height: 1.48;
}

.legal-card a {
    color: var(--gold-soft);
    text-decoration: none;
}

.legal-card a:hover,
.legal-card a:focus-visible {
    color: #fff;
    outline: none;
}

.legal-page__cta {
    width: min(100%, 360px);
    margin: 36px auto 0;
}

@keyframes legal-back-arrow {
    0%,
    100% {
        transform: rotate(180deg) translateX(0);
    }
    50% {
        transform: rotate(180deg) translateX(8px);
    }
}

body.has-reveal-js .reveal-item {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 520ms ease, transform 520ms ease;
    transition-delay: var(--delay, 0s);
}

body.has-reveal-js .section-reveal.is-visible .reveal-item {
    opacity: 1;
    transform: translateY(0);
}

.popup {
    position: fixed;
    inset: 0;
    z-index: 20;
    display: grid;
    place-items: center;
    padding: 24px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 180ms ease, visibility 180ms ease;
}

.popup.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.popup__overlay {
    position: absolute;
    inset: 0;
    background: rgba(3, 7, 10, 0.78);
    backdrop-filter: blur(8px);
}

.popup__dialog {
    position: relative;
    width: min(100%, 460px);
    max-height: calc(100vh - 48px);
    overflow: auto;
    padding: 38px;
    border: 1px solid rgba(217, 164, 81, 0.42);
    border-radius: 8px;
    background: linear-gradient(145deg, rgba(11, 19, 23, 0.96), rgba(7, 13, 16, 0.98));
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.52), 0 0 38px rgba(55, 163, 75, 0.2);
    transform: translateY(18px) scale(0.98);
    transition: transform 180ms ease;
}

.popup.is-open .popup__dialog {
    transform: translateY(0) scale(1);
}

.popup__close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(217, 164, 81, 0.5);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.05);
}

.popup__close::before,
.popup__close::after {
    content: "";
    position: absolute;
    left: 9px;
    top: 16px;
    width: 14px;
    height: 2px;
    background: #fff;
}

.popup__close::before {
    transform: rotate(45deg);
}

.popup__close::after {
    transform: rotate(-45deg);
}

.popup__icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(217, 164, 81, 0.42);
    border-radius: 8px;
    background: rgba(217, 164, 81, 0.08);
}

.popup__icon img {
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.popup h2 {
    margin: 24px 0 0;
    font-size: 30px;
    line-height: 1.16;
    letter-spacing: 0;
}

.popup p {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 16px;
    line-height: 1.5;
}

.popup__form {
    margin-top: 26px;
    display: grid;
    gap: 16px;
}

.popup__form label {
    display: grid;
    gap: 8px;
    color: rgba(255, 255, 255, 0.8);
    font-size: 14px;
}

.popup__form input {
    width: 100%;
    min-height: 52px;
    padding: 0 16px;
    border: 1px solid rgba(217, 164, 81, 0.36);
    border-radius: 8px;
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
    outline: none;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.popup__form input::placeholder {
    color: rgba(255, 255, 255, 0.42);
}

.popup__form input:focus {
    border-color: rgba(83, 220, 102, 0.78);
    box-shadow: 0 0 0 3px rgba(83, 220, 102, 0.14);
}

.popup__submit {
    min-height: 56px;
    margin-top: 4px;
    border: 1px solid rgba(112, 223, 128, 0.42);
    border-radius: 8px;
    color: #fff;
    background: linear-gradient(90deg, #25893c, #36a24b);
    box-shadow: 0 0 22px rgba(63, 198, 82, 0.28);
    font-weight: 800;
    text-transform: uppercase;
}

.popup__submit:disabled,
.consultation-form__submit:disabled {
    cursor: wait;
    opacity: 0.72;
}

.popup__status {
    min-height: 20px;
    margin: -4px 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 13px;
    line-height: 1.35;
    text-align: center;
}

@keyframes bad-signal {
    0%,
    100% {
        transform: translate(-50%, -50%) scale(0.96);
        opacity: 0.86;
    }
    50% {
        transform: translate(-50%, -50%) scale(1.04);
        opacity: 1;
    }
}

@keyframes bad-signal-ring {
    0% {
        opacity: 0.72;
        transform: scale(0.72);
    }
    100% {
        opacity: 0;
        transform: scale(2.35);
    }
}

@keyframes card-shine {
    0%,
    58% {
        opacity: 0;
        transform: translateX(-120%);
    }
    70% {
        opacity: 0.85;
    }
    86%,
    100% {
        opacity: 0;
        transform: translateX(120%);
    }
}

@keyframes card-glow {
    0%,
    100% {
        opacity: 0.32;
    }
    50% {
        opacity: 0.62;
    }
}

@keyframes icon-float {
    0%,
    100% {
        transform: translateY(0);
        filter: drop-shadow(0 0 0 rgba(217, 164, 81, 0));
    }
    50% {
        transform: translateY(-5px);
        filter: drop-shadow(0 8px 16px rgba(217, 164, 81, 0.22));
    }
}

@keyframes cta-pulse {
    0%,
    100% {
        box-shadow: 0 0 24px rgba(63, 198, 82, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    }
    50% {
        box-shadow: 0 0 42px rgba(75, 224, 96, 0.62), 0 0 0 6px rgba(75, 224, 96, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.24);
    }
}

@keyframes cta-shine {
    0%,
    48% {
        opacity: 0;
        transform: translateX(-115%);
    }
    58% {
        opacity: 0.85;
    }
    72%,
    100% {
        opacity: 0;
        transform: translateX(115%);
    }
}

@keyframes cta-arrow {
    0%,
    100% {
        transform: translateX(0);
    }
    50% {
        transform: translateX(8px);
    }
}

@keyframes status-pulse {
    0%,
    100% {
        box-shadow: 0 0 8px currentColor;
        opacity: 0.82;
    }
    50% {
        box-shadow: 0 0 18px currentColor;
        opacity: 1;
    }
}

@keyframes compare-arrow-pulse {
    0%,
    100% {
        transform: scale(1);
        box-shadow: 0 0 18px rgba(217, 164, 81, 0.16);
    }
    50% {
        transform: scale(1.08);
        box-shadow: 0 0 30px rgba(217, 164, 81, 0.36);
    }
}

@keyframes divider-flow {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 0 18px;
    }
}

@keyframes plan-shine {
    0%,
    56% {
        opacity: 0;
        transform: translateX(-120%);
    }
    68% {
        opacity: 0.7;
    }
    84%,
    100% {
        opacity: 0;
        transform: translateX(120%);
    }
}

@keyframes signal-wave {
    0% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.85);
    }
    12% {
        opacity: 0.72;
    }
    72% {
        opacity: 0.2;
    }
    100% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(5.6);
    }
}

@keyframes signal-core {
    0%,
    100% {
        transform: translate(-50%, -50%) scale(0.96);
        box-shadow:
            0 0 0 8px rgba(63, 184, 78, 0.32),
            0 0 18px rgba(255, 255, 255, 0.6),
            0 0 30px rgba(72, 220, 91, 0.45);
    }
    50% {
        transform: translate(-50%, -50%) scale(1.08);
        box-shadow:
            0 0 0 11px rgba(63, 184, 78, 0.42),
            0 0 25px rgba(255, 255, 255, 0.78),
            0 0 44px rgba(72, 220, 91, 0.66);
    }
}

@media (max-width: 1220px) {
    .hero__inner {
        padding: 34px 34px 38px;
    }

    .hero__content {
        grid-template-columns: minmax(450px, 560px) minmax(390px, 1fr);
        gap: 30px;
        padding-top: 34px;
    }

    .hero h1 {
        font-size: 48px;
    }

    .hero__lead,
    .hero__note {
        font-size: 18px;
    }

    .hero__cta {
        min-height: 74px;
        font-size: 19px;
    }

    .hero__features {
        margin-top: 32px;
        gap: 18px;
    }

    .signal {
        --size: 76px;
    }

    .problems__inner {
        padding: 0 34px;
    }

    .problems h2 {
        font-size: 36px;
    }

    .problems__layout {
        grid-template-columns: minmax(220px, 300px) minmax(360px, 1fr) minmax(220px, 300px);
        gap: 24px;
    }

    .problem-card {
        min-height: 235px;
        padding: 24px;
    }

    .problem-card h3 {
        font-size: 21px;
    }

    .problem-card p {
        font-size: 16px;
    }

    .result__inner {
        padding: 0 34px;
    }

    .result h2 {
        font-size: 36px;
    }

    .result__compare {
        grid-template-columns: 210px minmax(560px, 1fr) 220px;
        gap: 18px;
    }

    .result-list {
        padding: 18px;
    }

    .result-list li {
        font-size: 15px;
    }

    .result__images {
        gap: 20px;
    }

    .result__arrow::before,
    .result__arrow::after {
        width: 88px;
    }

    .workflow__inner {
        padding: 0 34px;
    }

    .workflow h2 {
        font-size: 38px;
    }

    .workflow__lead {
        font-size: 19px;
    }

    .workflow__layout {
        grid-template-columns: minmax(360px, 430px) minmax(500px, 1fr);
        gap: 26px;
    }

    .workflow-step {
        grid-template-columns: 94px 44px minmax(0, 1fr);
        gap: 18px;
    }

    .workflow-step:not(:last-child)::after {
        left: 47px;
    }

    .workflow-step__icon {
        width: 94px;
        height: 88px;
    }

    .workflow-step__content h3 {
        font-size: 22px;
    }

    .workflow-step__content p {
        font-size: 16px;
    }

    .wifi-system__inner {
        padding: 0 34px;
    }

    .wifi-system h2 {
        font-size: 38px;
    }

    .wifi-system__lead {
        font-size: 18px;
    }

    .wifi-system__layout {
        grid-template-columns: minmax(240px, 290px) minmax(430px, 1fr) minmax(240px, 290px);
        gap: 16px;
    }

    .wifi-benefit {
        min-height: 142px;
        padding: 18px;
        grid-template-columns: 50px minmax(0, 1fr);
        gap: 14px;
    }

    .wifi-benefit img {
        width: 50px;
        height: 50px;
    }

    .wifi-benefit h3 {
        font-size: 18px;
    }

    .wifi-benefit p {
        font-size: 15px;
    }

    .wifi-system__note strong {
        font-size: 22px;
    }

    .wifi-system__cta {
        font-size: 22px;
    }

    .renovation__inner {
        padding: 0 34px;
    }

    .renovation h2 {
        font-size: 38px;
    }

    .renovation h2 span {
        font-size: 27px;
    }

    .renovation__lead {
        font-size: 18px;
    }

    .renovation__layout {
        grid-template-columns: minmax(420px, 1fr) minmax(380px, 520px);
        gap: 30px;
    }

    .renovation-card {
        min-height: 122px;
        padding: 18px 20px;
        grid-template-columns: 76px minmax(0, 1fr);
        gap: 18px;
    }

    .renovation-card__icon {
        width: 76px;
        height: 76px;
    }

    .renovation-card__icon img {
        width: 48px;
        height: 48px;
    }

    .renovation-card h3 {
        font-size: 20px;
    }

    .renovation-card p {
        font-size: 16px;
    }

    .renovation__cta {
        font-size: 22px;
    }

    .consultation__inner {
        padding: 0 34px;
    }

    .consultation h2 {
        font-size: 38px;
    }

    .consultation__lead {
        font-size: 18px;
    }

    .consultation-form__grid {
        gap: 14px;
    }

    .consultation-form__card {
        min-height: 274px;
        padding: 22px 18px;
    }

    .consultation-form__card legend {
        grid-template-columns: 38px minmax(0, 1fr);
        gap: 12px;
        font-size: 17px;
    }

    .consultation-form__card legend img {
        width: 38px;
        height: 38px;
    }

    .choice {
        gap: 12px;
        font-size: 16px;
    }

    .consultation-form__submit {
        font-size: 22px;
    }

    .site-footer__inner {
        padding: 0 34px;
    }

    .site-footer__main {
        grid-template-columns: 1fr 0.9fr 1.1fr;
        gap: 34px;
    }

    .site-footer__area::before,
    .site-footer__contacts::before {
        left: -17px;
        height: 360px;
    }

    .site-footer__logo {
        gap: 18px;
    }

    .site-footer__logo img {
        width: 86px;
        height: 86px;
    }

    .site-footer__logo strong {
        font-size: 34px;
    }

    .site-footer__logo small {
        font-size: 14px;
    }

    .site-footer__area > img {
        width: 170px;
    }

    .site-footer__area h2 {
        font-size: 32px;
    }

    .site-footer__area p {
        font-size: 20px;
    }

    .site-footer__phone {
        grid-template-columns: 88px minmax(0, 1fr);
        gap: 24px;
    }

    .site-footer__phone-icon,
    .site-footer__messenger span {
        width: 88px;
        height: 88px;
    }

    .site-footer__phone small {
        font-size: 22px;
    }

    .site-footer__phone strong {
        margin-top: 20px;
        font-size: 32px;
    }

    .site-footer__messengers {
        gap: 54px;
    }

    .site-footer__messenger strong {
        font-size: 23px;
    }

    .site-footer__bottom {
        font-size: 22px;
    }

    .legal-page__inner {
        padding: 0 34px;
    }

    .legal-page h1 {
        font-size: 44px;
    }

    .legal-page__hero p {
        font-size: 18px;
    }

    .legal-card h2 {
        font-size: 20px;
    }

    .legal-card p {
        font-size: 16px;
    }
}

@media (max-width: 900px) {
    .hero {
        min-height: auto;
        background:
            radial-gradient(circle at 50% 78%, rgba(66, 190, 86, 0.26), transparent 32%),
            radial-gradient(circle at 78% 48%, rgba(44, 122, 86, 0.22), transparent 28%),
            radial-gradient(circle at 23% 42%, rgba(217, 164, 81, 0.16), transparent 31%),
            radial-gradient(ellipse at 50% 4%, rgba(58, 95, 118, 0.38), transparent 38%),
            linear-gradient(160deg, #020506 0%, #081316 36%, #0b1714 62%, #020405 100%);
    }

    .hero__inner {
        min-height: 100svh;
        padding: 24px 20px 32px;
    }

    .hero__shade {
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.055), transparent 28%, rgba(0, 0, 0, 0.42)),
            linear-gradient(115deg, rgba(0, 0, 0, 0.22), transparent 48%, rgba(0, 0, 0, 0.28));
    }

    .hero__header {
        align-items: start;
    }

    .brand__logo {
        width: 48px;
        height: 48px;
    }

    .brand__name {
        font-size: 22px;
    }

    .brand__tagline {
        display: none;
    }

    .hero__phone {
        gap: 3px;
    }

    .hero__phone-line {
        font-size: 16px;
    }

    .hero__phone-line img {
        width: 20px;
        height: 20px;
    }

    .hero__phone-time {
        font-size: 13px;
    }

    .hero__content {
        display: grid;
        grid-template-columns: 1fr;
        gap: 38px;
        padding-top: 56px;
    }

    .hero__copy {
        width: min(100%, 620px);
        max-width: 620px;
        margin: 0 auto;
        display: grid;
        justify-items: center;
        text-align: center;
    }

    .hero h1 {
        width: 100%;
        font-size: 39px;
    }

    .hero__lead {
        width: 100%;
        margin-top: 28px;
        font-size: 19px;
    }

    .hero__note {
        width: 100%;
        margin-top: 20px;
        font-size: 18px;
    }

    .hero__cta {
        width: auto;
        max-width: min(100%, 520px);
    }

    .hero__features {
        width: 100%;
    }

    .hero__visual {
        width: min(100%, 720px);
        min-height: 0;
        margin: 0 auto;
        opacity: 1;
    }

    .hero__image {
        margin: 0;
    }

    .problems__inner {
        padding: 0 20px;
    }

    .section-kicker {
        gap: 18px;
        font-size: 19px;
    }

    .problems h2 {
        max-width: 700px;
        font-size: 31px;
    }

    .problems__layout {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .problems__center {
        order: -1;
    }

    .problems__cards {
        width: min(100%, 680px);
        margin: 0 auto;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .problems__map {
        width: min(100%, 560px);
    }

    .problems__bottom {
        margin-top: 28px;
    }

    .result__inner {
        padding: 0 20px;
    }

    .result h2 {
        max-width: 760px;
        font-size: 31px;
    }

    .result__lead {
        font-size: 18px;
    }

    .result__compare {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .result__plans {
        order: -1;
        width: min(100%, 760px);
        margin: 0 auto;
    }

    .result-list {
        width: min(100%, 760px);
        margin: 0 auto;
    }

    .result-list ul {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 24px;
    }

    .result-list li:nth-child(2) {
        --status-center: 14px;
        border-top: 0;
        padding-top: 0;
    }

    .result__bottom {
        width: min(100%, 660px);
    }

    .workflow__inner {
        padding: 0 20px;
    }

    .workflow h2 {
        max-width: 760px;
        font-size: 31px;
    }

    .workflow__lead {
        font-size: 18px;
    }

    .workflow__layout {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .workflow__visual {
        order: -1;
    }

    .workflow-map {
        width: min(100%, 720px);
    }

    .workflow__steps {
        width: min(100%, 720px);
        margin: 0 auto;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }

    .workflow-step {
        min-height: 214px;
        padding: 22px;
        grid-template-columns: 64px 1fr 44px;
        grid-template-areas:
            "icon . number"
            "content content content";
        align-content: start;
        gap: 16px;
        border: 1px solid rgba(255, 255, 255, 0.14);
        border-radius: 8px;
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.015)),
            rgba(6, 14, 17, 0.72);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 45px rgba(0, 0, 0, 0.25);
    }

    .workflow-step:not(:last-child)::after {
        display: none;
    }

    .workflow-step__icon {
        grid-area: icon;
        width: 64px;
        height: 64px;
        border: 0;
        background: transparent;
        box-shadow: none;
        backdrop-filter: none;
    }

    .workflow-step__icon img {
        width: 54px;
        height: 54px;
    }

    .workflow-step__number {
        grid-area: number;
        justify-self: end;
    }

    .workflow-step__content {
        grid-area: content;
    }

    .workflow__bottom {
        width: min(100%, 720px);
    }

    .wifi-system__inner {
        padding: 0 20px;
    }

    .wifi-system h2 {
        max-width: 760px;
        font-size: 31px;
    }

    .wifi-system__lead {
        font-size: 18px;
    }

    .wifi-system__layout {
        grid-template-columns: 1fr;
        gap: 18px;
        margin-top: 28px;
    }

    .wifi-system__visual {
        order: -1;
    }

    .wifi-system-map {
        width: min(100%, 760px);
    }

    .wifi-system__side {
        width: min(100%, 760px);
        margin: 0 auto;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

    .wifi-benefit {
        min-height: 214px;
        padding: 22px;
        grid-template-columns: 58px 1fr;
        grid-template-areas:
            "icon ."
            "content content";
        align-content: start;
        gap: 16px;
        overflow: hidden;
    }

    .wifi-benefit img {
        grid-area: icon;
    }

    .wifi-benefit div {
        grid-area: content;
    }

    .wifi-system__bottom {
        width: min(100%, 720px);
        margin-top: 22px;
    }

    .renovation__inner {
        padding: 0 20px;
    }

    .renovation h2 {
        max-width: 760px;
        font-size: 31px;
    }

    .renovation h2 span {
        font-size: 24px;
    }

    .renovation__lead {
        font-size: 18px;
    }

    .renovation__layout {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .renovation-map {
        width: min(100%, 720px);
    }

    .renovation__cards {
        width: min(100%, 760px);
        margin: 0 auto;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

    .renovation-card {
        min-height: 230px;
        padding: 22px;
        grid-template-columns: 68px 1fr;
        grid-template-areas:
            "icon ."
            "content content";
        align-content: start;
        gap: 16px;
    }

    .renovation-card__icon {
        grid-area: icon;
        width: 68px;
        height: 68px;
    }

    .renovation-card__icon img {
        width: 44px;
        height: 44px;
    }

    .renovation-card__content {
        grid-area: content;
    }

    .renovation__cta {
        margin-top: 28px;
    }

    .consultation {
        background-position: center bottom;
    }

    .consultation__inner {
        padding: 0 20px;
    }

    .consultation h2 {
        max-width: 760px;
        font-size: 31px;
    }

    .consultation__lead {
        font-size: 18px;
    }

    .consultation-form__grid {
        width: min(100%, 760px);
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

    .consultation-form__card {
        min-height: 258px;
        padding: 22px;
    }

    .consultation-form__phone {
        width: min(100%, 660px);
    }

    .site-footer__inner {
        padding: 0 20px;
    }

    .site-footer__main {
        width: min(100%, 760px);
        margin: 0 auto;
        grid-template-columns: 1fr;
        gap: 42px;
        text-align: center;
    }

    .site-footer__area {
        order: -1;
    }

    .site-footer__area::before,
    .site-footer__contacts::before {
        display: none;
    }

    .site-footer__brand {
        display: grid;
        justify-items: center;
    }

    .site-footer__logo {
        justify-content: center;
    }

    .site-footer__area p {
        max-width: 520px;
        font-size: 19px;
    }

    .site-footer__contacts {
        width: min(100%, 620px);
        margin: 0 auto;
        gap: 36px;
    }

    .site-footer__phone {
        justify-content: center;
        text-align: left;
    }

    .site-footer__line {
        margin-top: 56px;
    }

    .site-footer__bottom {
        margin-top: 44px;
        flex-wrap: wrap;
        gap: 18px 28px;
        font-size: 19px;
    }

    .legal-page__header {
        align-items: flex-start;
    }

    .legal-page__content {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .hero__inner {
        width: min(100%, 390px);
        padding: 18px 16px 28px;
        overflow: hidden;
    }

    .hero__header {
        display: grid;
        gap: 14px;
        justify-content: center;
        justify-items: center;
        text-align: center;
    }

    .brand {
        gap: 10px;
        justify-content: center;
    }

    .brand__logo {
        width: 42px;
        height: 42px;
    }

    .brand__name {
        font-size: 19px;
    }

    .hero__phone {
        justify-items: center;
        text-align: center;
    }

    .hero__phone-line {
        gap: 8px;
        font-size: 14px;
        justify-content: center;
    }

    .hero__phone-time {
        font-size: 12px;
    }

    .hero__content {
        padding-top: 44px;
        gap: 26px;
        width: 100%;
        max-width: 340px;
        margin: 0 auto;
        justify-items: center;
    }

    .hero__copy {
        width: 100%;
        max-width: 340px;
        min-width: 0;
        overflow: hidden;
        display: grid;
        justify-items: center;
        text-align: center;
    }

    .hero h1 {
        width: 100%;
        max-width: 340px;
        font-size: clamp(17px, 4.4vw, 28px);
        line-height: 1.16;
    }

    .hero-title__desktop {
        display: block;
    }

    .hero-title__mobile {
        display: none;
    }

    .hero__lead {
        width: 100%;
        max-width: 330px;
        margin-top: 24px;
        font-size: 15px;
        overflow-wrap: anywhere;
    }

    .hero__note {
        width: 100%;
        max-width: 330px;
        font-size: 15px;
    }

    .hero__cta {
        width: auto;
        max-width: min(100%, 340px);
        min-height: 68px;
        margin-top: 30px;
        padding: 16px 24px;
        gap: 10px;
        justify-content: center;
        font-size: 12px;
    }

    .hero__cta-icon {
        width: 28px;
        height: 28px;
        flex-basis: 28px;
    }

    .hero__cta-arrow {
        display: none;
    }

    .hero__features {
        width: 100%;
        max-width: 340px;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 6px;
        margin-top: 34px;
    }

    .hero__features li {
        gap: 7px;
        font-size: 10px;
    }

    .hero__features li + li::before {
        display: none;
    }

    .hero__features img {
        width: 32px;
        height: 32px;
    }

    .signal {
        --size: 58px;
    }

    .hero__visual {
        width: 100%;
        max-width: 340px;
        min-height: 0;
        overflow: hidden;
    }

    .hero__image {
        width: 100%;
    }

    .signal--one {
        left: 49.4%;
        top: 23.8%;
    }

    .signal--two {
        left: 83%;
        top: 22.1%;
    }

    .signal--three {
        left: 36.9%;
        top: 45.6%;
    }

    .signal--four {
        left: 73.8%;
        top: 50.2%;
    }

    .signal--five {
        left: 32.5%;
        top: 67.8%;
    }

    .signal--six {
        left: 81.5%;
        top: 78.5%;
    }

    .signal--seven {
        left: 26.8%;
        top: 91.1%;
    }

    .problems {
        padding: 80px 0;
    }

    .problems__inner {
        padding: 0 16px;
    }

    .section-kicker {
        grid-template-columns: 44px auto 44px;
        gap: 12px;
        font-size: 16px;
    }

    .problems h2 {
        margin-top: 20px;
        font-size: 24px;
        line-height: 1.22;
    }

    .problems__layout {
        margin-top: 28px;
        gap: 18px;
    }

    .problems__cards {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .problem-card {
        min-height: 0;
        padding: 22px 20px;
    }

    .problem-card img {
        width: 64px;
        height: 64px;
    }

    .problem-card h3 {
        margin-top: 16px;
        font-size: 20px;
    }

    .problem-card p {
        margin-top: 12px;
        font-size: 15px;
    }

    .bad-signal {
        --size: 52px;
    }

    .problems__bottom {
        width: 100%;
        gap: 20px;
    }

    .problems__note {
        grid-template-columns: 42px 1fr;
        gap: 14px;
        padding: 18px;
    }

    .problems__note img {
        width: 42px;
        height: 42px;
    }

    .problems__note p {
        font-size: 15px;
    }

    .problems__cta {
        min-height: 68px;
        padding: 16px 20px;
        gap: 18px;
        font-size: 16px;
    }

    .result {
        padding: 80px 0;
    }

    .result__inner {
        padding: 0 16px;
    }

    .result h2 {
        margin-top: 20px;
        font-size: 24px;
        line-height: 1.22;
    }

    .result__lead {
        margin-top: 14px;
        font-size: 16px;
    }

    .result__compare {
        margin-top: 28px;
        gap: 18px;
    }

    .result__labels {
        width: 100%;
        grid-template-columns: 1fr 48px 1fr;
        gap: 10px;
        margin-bottom: 14px;
    }

    .result__tag {
        min-width: 72px;
        padding: 9px 14px;
        font-size: 18px;
    }

    .result__arrow {
        width: 48px;
        height: 48px;
    }

    .result__arrow::before,
    .result__arrow::after {
        width: 48px;
    }

    .result__arrow img {
        width: 24px;
    }

    .result__images {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .result__divider {
        width: 100%;
        min-height: 1px;
        height: 1px;
        background: repeating-linear-gradient(to right, var(--gold-soft) 0 4px, transparent 4px 9px);
    }

    .result-list {
        padding: 18px;
    }

    .result-list ul {
        grid-template-columns: 1fr;
    }

    .result-list li,
    .result-list li:nth-child(2) {
        --status-center: 13px;
        min-height: 0;
        padding: 0 0 16px 34px;
        border-top: 0;
        font-size: 15px;
    }

    .result-list li + li {
        --status-center: 29px;
        padding-top: 16px;
        border-top: 1px solid rgba(255, 255, 255, 0.12);
    }

    .result__bottom {
        width: 100%;
        gap: 18px;
        margin-top: 22px;
    }

    .result__note {
        grid-template-columns: 46px 1fr;
        gap: 14px;
        padding: 16px;
    }

    .result__note img {
        width: 46px;
        height: 46px;
    }

    .result__note p {
        font-size: 14px;
    }

    .result__note strong {
        font-size: 18px;
    }

    .result__cta {
        min-height: 68px;
        padding: 16px 20px;
        gap: 18px;
        font-size: 16px;
    }

    .workflow {
        padding: 80px 0;
    }

    .workflow__inner {
        padding: 0 16px;
    }

    .workflow h2 {
        margin-top: 20px;
        font-size: 24px;
        line-height: 1.22;
    }

    .workflow__lead {
        margin-top: 14px;
        font-size: 16px;
    }

    .workflow__layout {
        margin-top: 28px;
        gap: 18px;
    }

    .workflow-map {
        width: 100%;
    }

    .workflow__steps {
        width: 100%;
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .workflow-step {
        min-height: 0;
        padding: 18px;
    }

    .workflow-step__content h3 {
        font-size: 20px;
    }

    .workflow-step__content p {
        margin-top: 10px;
        font-size: 15px;
    }

    .workflow__bottom {
        width: 100%;
        margin-top: 22px;
        grid-template-columns: 48px 1fr;
        gap: 14px;
        padding: 18px;
    }

    .workflow__bottom img {
        width: 48px;
        height: 48px;
    }

    .workflow__bottom p {
        font-size: 17px;
    }

    .wifi-system {
        padding: 80px 0;
    }

    .wifi-system__inner {
        width: min(100%, 390px);
        padding: 0 16px;
    }

    .wifi-system h2 {
        width: 100%;
        max-width: 340px;
        margin-top: 20px;
        font-size: 24px;
        line-height: 1.22;
    }

    .wifi-system__lead {
        width: 100%;
        max-width: 340px;
        margin-top: 14px;
        font-size: 16px;
    }

    .wifi-system__layout {
        margin-top: 28px;
        gap: 14px;
    }

    .wifi-system-map {
        max-width: 358px;
        width: 100%;
    }

    .wifi-system__side {
        width: 100%;
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .wifi-benefit {
        min-height: 0;
        padding: 18px;
        grid-template-columns: 52px 1fr;
        grid-template-areas: "icon content";
        align-items: start;
    }

    .wifi-benefit img {
        width: 52px;
        height: 52px;
    }

    .wifi-benefit h3 {
        font-size: 20px;
    }

    .wifi-benefit p {
        margin-top: 10px;
        font-size: 15px;
    }

    .wifi-system__bottom {
        width: 100%;
        margin-top: 18px;
    }

    .wifi-system__note {
        grid-template-columns: 48px 1fr;
        gap: 14px;
        padding: 18px;
    }

    .wifi-system__note img {
        width: 48px;
        height: 48px;
    }

    .wifi-system__note p {
        font-size: 15px;
    }

    .wifi-system__note strong {
        font-size: 18px;
    }

    .wifi-system__cta {
        min-height: 68px;
        padding: 16px 20px;
        gap: 18px;
        font-size: 16px;
    }

    .renovation {
        padding: 80px 0;
    }

    .renovation__inner {
        width: min(100%, 390px);
        padding: 0 16px;
    }

    .renovation h2 {
        width: 100%;
        max-width: 340px;
        margin-top: 20px;
        font-size: 24px;
        line-height: 1.22;
    }

    .renovation h2 span {
        margin-top: 8px;
        font-size: 20px;
    }

    .renovation__lead {
        width: 100%;
        max-width: 340px;
        margin-top: 14px;
        font-size: 16px;
    }

    .renovation__layout {
        margin-top: 28px;
        gap: 18px;
    }

    .renovation-map {
        width: 100%;
        max-width: 358px;
    }

    .renovation__cards {
        width: 100%;
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .renovation-card {
        min-height: 0;
        padding: 18px;
        grid-template-columns: 58px 1fr;
        grid-template-areas: "icon content";
        align-items: start;
        gap: 16px;
    }

    .renovation-card__icon {
        width: 58px;
        height: 58px;
    }

    .renovation-card__icon img {
        width: 38px;
        height: 38px;
    }

    .renovation-card h3 {
        font-size: 19px;
    }

    .renovation-card p {
        margin-top: 10px;
        font-size: 15px;
    }

    .renovation__cta {
        min-height: 68px;
        margin-top: 22px;
        padding: 16px 20px;
        gap: 18px;
        font-size: 16px;
    }

    .consultation {
        padding: 80px 0;
        background-position: center bottom;
    }

    .consultation__inner {
        width: min(100%, 390px);
        padding: 0 16px;
    }

    .consultation h2 {
        width: 100%;
        max-width: 340px;
        margin-top: 20px;
        font-size: 24px;
        line-height: 1.22;
    }

    .consultation__lead {
        width: 100%;
        max-width: 340px;
        margin-top: 14px;
        font-size: 16px;
    }

    .consultation-form {
        margin-top: 26px;
        gap: 18px;
    }

    .consultation-form__grid {
        width: 100%;
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .consultation-form__card {
        min-height: 0;
        padding: 18px;
    }

    .consultation-form__card legend {
        margin-bottom: 18px;
        grid-template-columns: 38px minmax(0, 1fr);
        gap: 12px;
        font-size: 18px;
    }

    .consultation-form__card legend img {
        width: 38px;
        height: 38px;
    }

    .choice {
        min-height: 38px;
        font-size: 17px;
    }

    .consultation-form__phone {
        width: 100%;
        min-height: 0;
        padding: 18px;
        grid-template-columns: 46px minmax(0, 1fr);
        gap: 14px;
    }

    .consultation-form__phone > img {
        width: 46px;
        height: 46px;
    }

    .consultation-form__phone-field {
        font-size: 18px;
    }

    .consultation-form__phone input {
        width: 100%;
        min-height: 50px;
        font-size: 16px;
    }

    .consultation-form__submit {
        width: 100%;
        min-height: 68px;
        padding: 16px 20px;
        gap: 18px;
        font-size: 16px;
    }

    .consultation__note {
        margin-top: 4px;
    }

    .consultation__note p {
        width: 100%;
        gap: 16px;
        font-size: 16px;
    }

    .consultation__note strong {
        font-size: 17px;
    }

    .consultation__note strong::before {
        width: 30px;
        height: 22px;
        margin-right: 10px;
    }

    .site-footer {
        padding: 80px 0;
    }

    .site-footer__inner {
        width: min(100%, 390px);
        padding: 0 16px;
    }

    .site-footer__main {
        width: 100%;
        gap: 34px;
    }

    .site-footer__logo {
        display: grid;
        justify-items: center;
        gap: 14px;
        text-align: center;
    }

    .site-footer__logo img {
        width: 76px;
        height: 76px;
    }

    .site-footer__logo strong {
        font-size: 30px;
    }

    .site-footer__logo small {
        font-size: 13px;
    }

    .site-footer__area > img {
        width: 150px;
    }

    .site-footer__area h2 {
        margin-top: 24px;
        font-size: 29px;
    }

    .site-footer__area p {
        margin-top: 22px;
        font-size: 17px;
        line-height: 1.5;
    }

    .site-footer__contacts {
        width: 100%;
        gap: 28px;
    }

    .site-footer__phone {
        grid-template-columns: 74px minmax(0, 1fr);
        gap: 16px;
        text-align: left;
    }

    .site-footer__phone-icon,
    .site-footer__messenger span {
        width: 74px;
        height: 74px;
    }

    .site-footer__phone-icon img {
        width: 38px;
        height: 38px;
    }

    .site-footer__phone small {
        font-size: 18px;
    }

    .site-footer__phone strong {
        margin-top: 12px;
        font-size: 25px;
    }

    .site-footer__messengers {
        gap: 42px;
    }

    .site-footer__messenger {
        gap: 16px;
    }

    .site-footer__messenger img {
        width: 42px;
        height: 42px;
    }

    .site-footer__messenger strong {
        font-size: 20px;
    }

    .site-footer__line {
        margin-top: 42px;
    }

    .site-footer__bottom {
        margin-top: 34px;
        display: grid;
        justify-items: center;
        gap: 14px;
        font-size: 16px;
    }

    .site-footer__bottom span {
        width: 5px;
        height: 5px;
        flex-basis: 5px;
    }

    .legal-page {
        padding: 18px 0 80px;
    }

    .legal-page__inner {
        width: min(100%, 390px);
        padding: 0 16px;
    }

    .legal-page__header {
        display: grid;
        justify-items: center;
        gap: 18px;
        text-align: center;
    }

    .legal-page__back {
        min-height: 52px;
        padding: 14px 18px;
        font-size: 13px;
    }

    .legal-page__hero {
        margin-top: 48px;
    }

    .legal-page h1 {
        max-width: 340px;
        margin-top: 20px;
        font-size: 30px;
        line-height: 1.16;
    }

    .legal-page__hero p {
        max-width: 340px;
        margin-top: 14px;
        font-size: 16px;
    }

    .legal-page__content {
        margin-top: 28px;
        gap: 14px;
    }

    .legal-card {
        padding: 18px;
    }

    .legal-card h2 {
        font-size: 18px;
    }

    .legal-card p {
        font-size: 15px;
    }

    .legal-page__cta {
        min-height: 58px;
        margin-top: 24px;
        padding: 16px 20px;
        gap: 18px;
        font-size: 14px;
    }

    body.has-mobile-contact-bar {
        padding-bottom: 118px;
    }

    .mobile-contact-bar {
        position: fixed;
        left: 10px;
        right: 10px;
        bottom: 0;
        z-index: 14;
        display: grid;
        gap: 10px;
        padding: 12px 12px calc(12px + env(safe-area-inset-bottom));
        border: 1px solid rgba(217, 164, 81, 0.34);
        border-radius: 8px;
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.018)),
            rgba(6, 14, 17, 0.92);
        box-shadow: 0 16px 42px rgba(0, 0, 0, 0.48), 0 0 24px rgba(63, 198, 82, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.06);
        backdrop-filter: blur(14px);
        opacity: 0;
        visibility: hidden;
        transform: translateY(calc(100% + 18px));
        transition: opacity 220ms ease, visibility 220ms ease, transform 220ms ease;
    }

    .mobile-contact-bar::before {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: inherit;
        background: linear-gradient(115deg, transparent 0 34%, rgba(255, 255, 255, 0.08) 48%, transparent 62% 100%);
        opacity: 0;
        transform: translateX(-120%);
        animation: card-shine 6s ease-in-out infinite;
        pointer-events: none;
    }

    .mobile-contact-bar.is-visible {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .mobile-contact-bar p {
        position: relative;
        z-index: 1;
        margin: 0;
        color: #fff;
        font-size: 14px;
        line-height: 1.2;
        font-weight: 800;
        text-align: center;
    }

    .mobile-contact-bar__actions {
        position: relative;
        z-index: 1;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
    }

    .mobile-contact-bar__btn {
        min-width: 0;
        min-height: 44px;
        padding: 8px 7px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        border: 1px solid rgba(255, 255, 255, 0.14);
        border-radius: 8px;
        color: #fff;
        background: rgba(255, 255, 255, 0.06);
        text-decoration: none;
        font-size: 12px;
        line-height: 1;
        font-weight: 800;
        transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
    }

    .mobile-contact-bar__btn:hover,
    .mobile-contact-bar__btn:focus-visible {
        transform: translateY(-2px);
        border-color: rgba(217, 164, 81, 0.46);
        box-shadow: 0 0 18px rgba(217, 164, 81, 0.16);
        outline: none;
    }

    .mobile-contact-bar__btn img {
        width: 19px;
        height: 19px;
        flex: 0 0 19px;
        object-fit: contain;
    }

    .mobile-contact-bar__btn--telegram {
        border-color: rgba(217, 164, 81, 0.34);
    }

    .mobile-contact-bar__btn--viber {
        border-color: rgba(163, 92, 255, 0.42);
    }

    .mobile-contact-bar__btn--phone {
        border-color: rgba(112, 223, 128, 0.38);
        background: linear-gradient(90deg, rgba(39, 143, 63, 0.72), rgba(54, 162, 75, 0.78));
    }

    .popup {
        padding: 16px;
    }

    .popup__dialog {
        padding: 30px 20px 24px;
    }

    .popup h2 {
        font-size: 25px;
    }
}

@media (max-width: 420px) {
    .hero__content {
        padding-top: 42px;
    }

    .hero h1 {
        font-size: 17px;
    }

    .hero__cta {
        font-size: 11px;
        padding-right: 10px;
        padding-left: 10px;
    }

    .hero__features li {
        font-size: 9px;
    }

    .hero__features img {
        width: 28px;
        height: 28px;
    }

    .problems h2 {
        font-size: 22px;
    }

    .problems__cta {
        font-size: 14px;
        padding-right: 14px;
        padding-left: 14px;
    }

    .section-kicker {
        grid-template-columns: 28px auto 28px;
    }

    .result h2 {
        font-size: 22px;
    }

    .result__lead {
        font-size: 15px;
    }

    .result__cta {
        font-size: 14px;
        padding-right: 14px;
        padding-left: 14px;
    }

    .result__tag {
        min-width: 64px;
        font-size: 16px;
    }

    .result__arrow::before,
    .result__arrow::after {
        width: 34px;
    }

    .workflow h2 {
        font-size: 22px;
    }

    .workflow__lead {
        font-size: 15px;
    }

    .workflow-step {
        grid-template-columns: 56px 1fr 42px;
        padding: 16px;
    }

    .workflow-step__icon {
        width: 56px;
        height: 56px;
    }

    .workflow-step__icon img {
        width: 48px;
        height: 48px;
    }

    .workflow-step__number {
        width: 42px;
        height: 42px;
        font-size: 17px;
    }

    .workflow__bottom {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }

    .workflow__bottom p {
        font-size: 16px;
    }

    .wifi-system h2 {
        font-size: 22px;
    }

    .wifi-system__lead {
        font-size: 15px;
    }

    .wifi-benefit {
        grid-template-columns: 48px 1fr;
        padding: 16px;
        gap: 12px;
    }

    .wifi-benefit img {
        width: 48px;
        height: 48px;
    }

    .wifi-benefit h3 {
        font-size: 18px;
    }

    .wifi-system__note {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }

    .wifi-system__cta {
        font-size: 14px;
        padding-right: 14px;
        padding-left: 14px;
    }

    .renovation h2 {
        font-size: 22px;
    }

    .renovation h2 span {
        font-size: 18px;
    }

    .renovation__lead {
        font-size: 15px;
    }

    .renovation-card {
        grid-template-columns: 52px 1fr;
        padding: 16px;
        gap: 12px;
    }

    .renovation-card__icon {
        width: 52px;
        height: 52px;
    }

    .renovation-card__icon img {
        width: 34px;
        height: 34px;
    }

    .renovation-card h3 {
        font-size: 18px;
    }

    .renovation__cta {
        font-size: 14px;
        padding-right: 14px;
        padding-left: 14px;
    }

    .consultation h2 {
        font-size: 22px;
    }

    .consultation__lead {
        font-size: 15px;
    }

    .consultation-form__card {
        padding: 16px;
    }

    .consultation-form__card legend {
        font-size: 17px;
    }

    .choice {
        font-size: 16px;
    }

    .consultation-form__phone {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }

    .consultation-form__submit {
        font-size: 14px;
        padding-right: 14px;
        padding-left: 14px;
    }

    .site-footer__logo strong {
        font-size: 28px;
    }

    .site-footer__phone {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }

    .site-footer__phone strong {
        font-size: 24px;
    }

    .site-footer__messengers {
        gap: 28px;
    }

    .site-footer__messenger span {
        width: 68px;
        height: 68px;
    }

    .site-footer__messenger strong {
        font-size: 18px;
    }

    .legal-page h1 {
        font-size: 27px;
    }

    .legal-page__back,
    .legal-page__cta {
        font-size: 12px;
        padding-right: 14px;
        padding-left: 14px;
    }

    body.has-mobile-contact-bar {
        padding-bottom: 112px;
    }

    .mobile-contact-bar {
        left: 8px;
        right: 8px;
        padding: 10px 10px calc(10px + env(safe-area-inset-bottom));
    }

    .mobile-contact-bar__actions {
        gap: 6px;
    }

    .mobile-contact-bar__btn {
        min-height: 42px;
        padding: 7px 5px;
        gap: 4px;
        font-size: 11px;
    }

    .mobile-contact-bar__btn img {
        width: 17px;
        height: 17px;
        flex-basis: 17px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}
