:root {
    --lemesh-blue: #0057B8;
    --lemesh-blue-dark: #004494;
    --lemesh-blue-deep: #0A2540;
    --lemesh-blue-light: #E8F2FC;
    --lemesh-dark: #1A1A1A;
    --lemesh-gray: #6B7280;
    --lemesh-light-gray: #F7F9FC;
    --lemesh-border: #E5E7EB;
    --lemesh-white: #FFFFFF;
    --lemesh-radius: 10px;
    --lemesh-shadow: 0 3px 16px rgba(0, 0, 0, 0.05);
    --lemesh-shadow-lg: 0 8px 28px rgba(0, 0, 0, 0.08);
    --lemesh-transition: 0.2s ease;
    --header-height: 70px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body.lemesh-demo-body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.6;
    color: var(--lemesh-dark);
    background: var(--lemesh-white);
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

a {
    color: var(--lemesh-blue);
    text-decoration: none;
    transition: color var(--lemesh-transition);
}

a:hover {
    color: var(--lemesh-blue-dark);
}

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

.lemesh-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Buttons */
.lemesh-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 11px 18px;
    font-size: 13px;
    font-weight: 700;
    border-radius: 6px;
    border: 2px solid transparent;
    cursor: pointer;
    transition: all var(--lemesh-transition);
    text-decoration: none;
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.lemesh-btn--primary {
    background: var(--lemesh-blue);
    color: var(--lemesh-white);
    border-color: var(--lemesh-blue);
}

.lemesh-btn--primary:hover {
    background: var(--lemesh-blue-dark);
    border-color: var(--lemesh-blue-dark);
    color: var(--lemesh-white);
}

.lemesh-btn--outline {
    background: transparent;
    color: var(--lemesh-blue);
    border-color: var(--lemesh-blue);
}

.lemesh-btn--outline:hover {
    background: var(--lemesh-blue);
    color: var(--lemesh-white);
}

.lemesh-btn--small {
    padding: 7px 12px;
    font-size: 11px;
}

.lemesh-btn--wide {
    width: 100%;
}

/* Layout ordering helpers */
.lemesh-landing {
    display: flex;
    flex-direction: column;
}

/* Header */
.lemesh-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--lemesh-border);
}

@media (max-width: 767px) {
    /* TASK-001: backdrop-filter вызывает repaint на iOS при каждом скролле —
       на mobile только непрозрачный белый фон, высота/отступы не меняются */
    .lemesh-header {
        backdrop-filter: none;
        background: #fff;
    }
}

.lemesh-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: var(--header-height);
}

.lemesh-logo {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    flex-shrink: 0;
}

.lemesh-logo__img {
    width: 72px;
    height: auto;
    flex-shrink: 0;
}

.lemesh-logo__img--footer {
    width: 90px;
    height: auto;
}

.lemesh-logo__tagline {
    font-size: 10px;
    color: var(--lemesh-gray);
    line-height: 1.25;
    max-width: 140px;
    display: block;
}

.lemesh-nav--desktop {
    display: flex;
    align-items: center;
    gap: 18px;
}

.lemesh-nav--desktop a {
    font-size: 12px;
    font-weight: 500;
    color: var(--lemesh-dark);
}

.lemesh-nav--desktop a:hover {
    color: var(--lemesh-blue);
}

.lemesh-header__contacts {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.lemesh-header__contacts .lemesh-btn {
    text-transform: none;
    font-weight: 600;
    padding: 9px 14px;
    font-size: 12px;
}

.lemesh-phone {
    font-size: 14px;
    font-weight: 700;
    color: var(--lemesh-dark);
    white-space: nowrap;
}

.lemesh-phone:hover {
    color: var(--lemesh-blue);
}

.lemesh-burger {
    display: none;
    flex-direction: column;
    gap: 5px;
    background: none;
    border: none;
    padding: 8px;
    cursor: pointer;
}

.lemesh-burger span {
    display: block;
    width: 24px;
    height: 2px;
    background: var(--lemesh-dark);
    transition: all var(--lemesh-transition);
}

.lemesh-mobile-menu {
    display: none;
    position: absolute;
    top: var(--header-height);
    left: 0;
    right: 0;
    background: var(--lemesh-white);
    border-bottom: 1px solid var(--lemesh-border);
    padding: 16px 24px;
    box-shadow: var(--lemesh-shadow);
}

.lemesh-mobile-menu nav {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.lemesh-mobile-menu a {
    font-size: 16px;
    font-weight: 500;
    color: var(--lemesh-dark);
    padding: 8px 0;
}



/* Sections */
.lemesh-section {
    padding: 32px 0;
}

.lemesh-section__title {
    font-size: 24px;
    font-weight: 800;
    line-height: 1.15;
    margin: 0 0 12px;
    color: var(--lemesh-dark);
    text-transform: uppercase;
}

.lemesh-section__title--center {
    text-align: center;
}

.lemesh-section__title--light {
    color: var(--lemesh-white);
}

.lemesh-section__title--small {
    font-size: 22px;
}

.lemesh-section__subtitle {
    font-size: 14px;
    color: var(--lemesh-gray);
    margin: 0 0 18px;
    max-width: 640px;
}

.lemesh-section__subtitle--small {
    margin-bottom: 18px;
}

/* Hero */
.lemesh-hero {
    display: flex;
    align-items: stretch;
    padding: 0;
    overflow: hidden;
}

.lemesh-hero__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    align-items: stretch;
    width: 100%;
    min-height: 420px;
    max-height: 460px;
}

.lemesh-hero__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    padding: 0;
}

.lemesh-hero__content-inner {
    width: 100%;
    max-width: 520px;
    padding-left: 20px;
    padding-right: 20px;
}

.lemesh-hero__title {
    font-size: 32px;
    font-weight: 900;
    line-height: 1.05;
    text-transform: uppercase;
    margin: 0 0 10px;
    color: var(--lemesh-dark);
    letter-spacing: 0.01em;
}

.lemesh-hero__title span {
    display: block;
    white-space: nowrap;
}

.lemesh-hero__objects {
    font-size: 16px;
    color: var(--lemesh-gray);
    margin: 0 0 18px;
    line-height: 1.5;
    max-width: 480px;
}

.lemesh-hero__advantages {
    display: flex;
    flex-wrap: nowrap;
    gap: 12px;
    margin-bottom: 18px;
}

.lemesh-hero__advantage {
    display: inline-flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13px;
    font-weight: 500;
    color: var(--lemesh-dark);
    line-height: 1.3;
    flex: 1 1 0;
    min-width: 0;
}

.lemesh-hero__adv-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    color: var(--lemesh-blue);
    flex-shrink: 0;
}

.lemesh-hero__adv-icon svg {
    width: 20px;
    height: 20px;
}

.lemesh-hero__cta {
    display: flex;
    flex-wrap: nowrap;
    gap: 12px;
}

.lemesh-hero__cta .lemesh-btn {
    padding: 12px 18px;
    font-size: 13px;
}

.lemesh-hero__visual {
    position: relative;
    height: 100%;
    min-height: 420px;
    max-height: 460px;
}

.lemesh-hero__visual img {
    width: 100%;
    height: 100%;
    min-height: 420px;
    max-height: 460px;
    object-fit: cover;
    object-position: 50% 45%;
    border-radius: 0;
    box-shadow: none;
}

/* Quiz */
.lemesh-quiz {
    background: var(--lemesh-white);
    padding-top: 16px;
    padding-bottom: 16px;
}

.lemesh-quiz__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    align-items: stretch;
}

.lemesh-quiz__form {
    background: var(--lemesh-blue-light);
    border-radius: 12px;
    padding: 18px;
    display: flex;
    flex-direction: column;
}

.lemesh-quiz__progress {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
}

.lemesh-quiz__progress-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    flex: 1;
    text-align: center;
}

.lemesh-quiz__progress-step span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--lemesh-white);
    border: 2px solid var(--lemesh-blue);
    color: var(--lemesh-blue);
    font-size: 14px;
    font-weight: 700;
    transition: all var(--lemesh-transition);
}

.lemesh-quiz__progress-step small {
    font-size: 11px;
    color: var(--lemesh-gray);
    font-weight: 500;
    line-height: 1.2;
}

.lemesh-quiz__progress-step.is-active span,
.lemesh-quiz__progress-step.is-completed span {
    background: var(--lemesh-blue);
    color: var(--lemesh-white);
    border-color: var(--lemesh-blue);
}

.lemesh-quiz__progress-step.is-active span {
    box-shadow: 0 0 0 4px rgba(0, 87, 184, 0.2);
}

.lemesh-quiz__progress-step.is-completed span {
    background: var(--lemesh-blue-dark);
    border-color: var(--lemesh-blue-dark);
}

.lemesh-quiz__question {
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 12px;
}

.lemesh-quiz__options {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.lemesh-quiz__option {
    padding: 11px 16px;
    background: var(--lemesh-white);
    border: 1px solid var(--lemesh-border);
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    transition: all var(--lemesh-transition);
}

.lemesh-quiz__option:hover {
    background: var(--lemesh-blue-light);
    border-color: var(--lemesh-blue);
    color: var(--lemesh-blue);
}

.lemesh-quiz__option--selected {
    background: var(--lemesh-blue);
    color: var(--lemesh-white);
    border-color: var(--lemesh-blue);
    box-shadow: 0 0 0 3px rgba(0, 87, 184, 0.25);
}

.lemesh-quiz__back {
    display: inline-block;
    margin-top: 14px;
    padding: 0;
    background: none;
    border: none;
    color: var(--lemesh-gray);
    font-size: 13px;
    cursor: pointer;
    transition: color var(--lemesh-transition);
}

.lemesh-quiz__back:hover {
    color: var(--lemesh-blue);
}

.lemesh-quiz__step--final .lemesh-btn {
    padding: 14px 28px;
    font-size: 15px;
}

.lemesh-quiz__step {
    margin-bottom: 0;
}

.lemesh-quiz__step--final {
    padding-top: 6px;
}

.lemesh-quiz__visual {
    position: relative;
    border-radius: var(--lemesh-radius);
    overflow: hidden;
    min-height: 300px;
    max-height: 340px;
}

.lemesh-quiz__visual img {
    width: 100%;
    height: 100%;
    min-height: 300px;
    max-height: 340px;
    object-fit: cover;
}

.lemesh-quiz__result-card {
    position: absolute;
    bottom: 12px;
    left: 12px;
    right: 12px;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(6px);
    border-radius: var(--lemesh-radius);
    padding: 12px;
    box-shadow: var(--lemesh-shadow);
}

.lemesh-quiz__result-card h3 {
    margin: 0 0 8px;
    font-size: 14px;
}

.lemesh-quiz__result-card ul {
    margin: 0;
    padding-left: 16px;
    color: var(--lemesh-gray);
    font-size: 12px;
}

.lemesh-quiz__result-card li {
    margin-bottom: 3px;
}

/* Services */
.lemesh-services__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.lemesh-service-card {
    background: var(--lemesh-white);
    border: 1px solid var(--lemesh-border);
    border-radius: var(--lemesh-radius);
    overflow: hidden;
    transition: all var(--lemesh-transition);
}

.lemesh-service-card:hover {
    box-shadow: var(--lemesh-shadow);
    border-color: var(--lemesh-blue-light);
}

.lemesh-service-card__image {
    height: 180px;
    overflow: hidden;
}

.lemesh-service-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lemesh-service-card__body {
    padding: 18px;
    position: relative;
}

.lemesh-service-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: var(--lemesh-blue);
    color: var(--lemesh-white);
    border-radius: 50%;
    margin-bottom: 10px;
}

.lemesh-service-card__icon svg {
    width: 18px;
    height: 18px;
}

.lemesh-service-card h3 {
    font-size: 17px;
    font-weight: 700;
    margin: 0 0 6px;
    color: var(--lemesh-dark);
    line-height: 1.25;
}

.lemesh-service-card p {
    margin: 0;
    color: var(--lemesh-gray);
    font-size: 13px;
    line-height: 1.45;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Includes (turnkey price) */
.lemesh-includes {
    background: var(--lemesh-light-gray);
    padding-top: 36px;
    padding-bottom: 36px;
}

.lemesh-includes__note {
    margin: 18px 0 0;
    font-size: 14px;
    color: var(--lemesh-dark);
}

.lemesh-checklist {
    list-style: none;
    padding: 0;
    margin: 0;
}

.lemesh-checklist li {
    position: relative;
    padding-left: 26px;
    margin-bottom: 8px;
    font-size: 13px;
    color: var(--lemesh-dark);
    line-height: 1.45;
}

.lemesh-checklist li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 2px;
    width: 16px;
    height: 16px;
    background: var(--lemesh-blue);
    border-radius: 50%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}

.lemesh-checklist--light li {
    color: rgba(255, 255, 255, 0.9);
}

.lemesh-checklist--light li::before {
    background: rgba(255, 255, 255, 0.2);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}

/* Portfolio */
.lemesh-portfolio {
    background: var(--lemesh-light-gray);
    padding-top: 36px;
    padding-bottom: 36px;
}

.lemesh-portfolio__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.lemesh-portfolio-card {
    background: var(--lemesh-white);
    border-radius: var(--lemesh-radius);
    overflow: hidden;
    box-shadow: var(--lemesh-shadow);
}

.lemesh-portfolio-card__image {
    position: relative;
    height: 130px;
    overflow: hidden;
}

.lemesh-portfolio-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lemesh-portfolio-card__body {
    padding: 12px;
}

.lemesh-portfolio-card__body h3 {
    font-size: 13px;
    font-weight: 700;
    margin: 0 0 4px;
    line-height: 1.3;
}

.lemesh-portfolio-card__body p {
    margin: 0;
    font-size: 11px;
    color: var(--lemesh-gray);
    line-height: 1.4;
}

.lemesh-portfolio__footer {
    text-align: center;
    margin-top: 22px;
}

/* Trust */
.lemesh-trust {
    background: #1A2332;
    color: var(--lemesh-white);
    padding-top: 40px;
    padding-bottom: 40px;
}

/* Bottom */
.lemesh-bottom {
    background: var(--lemesh-white);
    padding-top: 40px;
    padding-bottom: 40px;
}

.lemesh-bottom__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    align-items: start;
}

.lemesh-bottom__photo {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    overflow: hidden;
    margin-bottom: 12px;
}

.lemesh-bottom__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lemesh-bottom__role {
    font-size: 13px;
    color: var(--lemesh-blue);
    font-weight: 600;
    margin: 0 0 8px;
}

.lemesh-review-card {
    background: var(--lemesh-light-gray);
    border: 1px solid var(--lemesh-border);
    border-radius: var(--lemesh-radius);
    padding: 16px;
    margin: 0;
}

.lemesh-review-card p {
    font-size: 13px;
    color: var(--lemesh-gray);
    margin: 0 0 10px;
    font-style: italic;
    line-height: 1.55;
}

.lemesh-review-card footer {
    font-size: 12px;
    font-weight: 700;
    color: var(--lemesh-dark);
    font-style: normal;
}

/* Callback */
.lemesh-callback {
    background: var(--lemesh-blue-deep);
    color: var(--lemesh-white);
    padding-top: 40px;
    padding-bottom: 40px;
}

.lemesh-callback__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 36px;
    align-items: center;
}

.lemesh-callback__form {
    background: var(--lemesh-white);
    border-radius: var(--lemesh-radius);
    padding: 26px;
    box-shadow: var(--lemesh-shadow-lg);
}

.lemesh-callback__features {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 18px;
}

.lemesh-callback__feature {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.85);
}

.lemesh-callback__feature svg {
    flex-shrink: 0;
}

/* Forms */
.lemesh-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.lemesh-form__label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 14px;
    font-weight: 500;
    color: var(--lemesh-dark);
}

.lemesh-input {
    padding: 13px 14px;
    font-size: 15px;
    border: 1px solid var(--lemesh-border);
    border-radius: 8px;
    background: var(--lemesh-white);
    color: var(--lemesh-dark);
    transition: border-color var(--lemesh-transition);
    width: 100%;
}

.lemesh-input:focus {
    outline: none;
    border-color: var(--lemesh-blue);
}

.lemesh-form__checkbox {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 12px;
    color: var(--lemesh-gray);
    line-height: 1.4;
}

.lemesh-form__checkbox input {
    margin-top: 2px;
    flex-shrink: 0;
}

/* Compact lower sections (services, includes, steps, portfolio, trust, bottom, callback) */
.lemesh-services,
.lemesh-includes,
.lemesh-steps,
.lemesh-portfolio,
.lemesh-trust,
.lemesh-bottom,
.lemesh-callback {
    padding-top: 22px;
    padding-bottom: 22px;
}.lemesh-services .lemesh-section__title,
.lemesh-includes .lemesh-section__title,
.lemesh-steps .lemesh-section__title,
.lemesh-portfolio .lemesh-section__title,
.lemesh-bottom__card h3
    {
    font-size: 18px;
    margin-bottom: 14px;
    text-transform: uppercase;
}

.lemesh-checklist--two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 22px;
}

/* Includes */
.lemesh-includes {
    background: var(--lemesh-light-gray);
}

.lemesh-includes__note {
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--lemesh-blue-light);
    border: 1px solid var(--lemesh-blue);
    border-radius: 10px;
    padding: 14px 18px;
    margin-top: 18px;
    font-size: 14px;
    font-weight: 600;
    color: var(--lemesh-dark);
    line-height: 1.45;
}

/* Steps (how we work) */
.lemesh-steps {
    background: var(--lemesh-white);
}

.lemesh-steps .lemesh-steps-line {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
    background: none;
    border: none;
    border-radius: 0;
    overflow: visible;
}

.lemesh-steps .lemesh-step-mini {
    flex: initial;
    padding: 28px 18px;
    text-align: center;
    background: var(--lemesh-white);
    border: 1px solid var(--lemesh-border);
    border-radius: 12px;
    position: relative;
    box-shadow: var(--lemesh-shadow);
}

.lemesh-steps .lemesh-step-mini:not(:last-child)::after {
    top: 54px;
    right: -11px;
}

.lemesh-steps .lemesh-step-mini__icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 14px;
}

.lemesh-steps .lemesh-step-mini__icon svg {
    width: 28px;
    height: 28px;
}

.lemesh-steps .lemesh-step-mini__icon span {
    bottom: -4px;
    right: -4px;
    width: 24px;
    height: 24px;
    font-size: 11px;
}

.lemesh-steps .lemesh-step-mini h3 {
    font-size: 17px;
    margin: 0 0 8px;
}

.lemesh-steps .lemesh-step-mini p {
    font-size: 13px;
    line-height: 1.5;
}

.lemesh-steps-line {
    display: flex;
    background: var(--lemesh-white);
    border: 1px solid var(--lemesh-border);
    border-radius: 10px;
    overflow: hidden;
}

.lemesh-step-mini {
    flex: 1 1 0;
    padding: 10px 6px;
    text-align: center;
    border-right: 1px solid var(--lemesh-border);
    position: relative;
}

.lemesh-step-mini:last-child {
    border-right: none;
}

.lemesh-step-mini:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 24px;
    right: -7px;
    width: 12px;
    height: 12px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239CA3AF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    z-index: 1;
}

.lemesh-step-mini__icon {
    position: relative;
    width: 36px;
    height: 36px;
    margin: 0 auto 6px;
    border-radius: 50%;
    background: var(--lemesh-blue-light);
    color: var(--lemesh-blue);
    display: flex;
    align-items: center;
    justify-content: center;
}

.lemesh-step-mini__icon svg {
    width: 16px;
    height: 16px;
}

.lemesh-step-mini__icon span {
    position: absolute;
    bottom: -3px;
    right: -3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--lemesh-blue);
    color: var(--lemesh-white);
    font-size: 8px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lemesh-step-mini h3 {
    font-size: 11px;
    font-weight: 700;
    margin: 0 0 3px;
    color: var(--lemesh-dark);
}

.lemesh-step-mini p {
    margin: 0;
    font-size: 9px;
    color: var(--lemesh-gray);
    line-height: 1.35;
}

/* Portfolio compact */
.lemesh-portfolio__grid {
    gap: 20px;
}

.lemesh-portfolio-card__image {
    height: 240px;
    cursor: zoom-in;
}

.lemesh-portfolio-card__body {
    padding: 16px 18px;
}

.lemesh-portfolio-card__body h3 {
    font-size: 17px;
    margin-bottom: 8px;
}

.lemesh-portfolio-card__meta {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 13px;
    color: var(--lemesh-gray);
    line-height: 1.45;
}

.lemesh-portfolio__footer {
    margin-top: 24px;
}

/* Trust dark block */
.lemesh-trust {
    background: #151D26;
    color: var(--lemesh-white);
}

/* Bottom cards */
.lemesh-bottom {
    background: #F7F9FC;
}

.lemesh-bottom__grid {
    grid-template-columns: 1.5fr 1fr;
    gap: 20px;
}

.lemesh-bottom__card {
    background: var(--lemesh-white);
    border: 1px solid var(--lemesh-border);
    border-radius: 12px;
    padding: 24px;
    height: 100%;
    box-shadow: var(--lemesh-shadow);
}

.lemesh-bottom__card h3 {
    font-size: 18px;
    margin-bottom: 16px;
    text-transform: uppercase;
}

.lemesh-bottom__card--manager {
    display: flex;
    gap: 22px;
    align-items: flex-start;
}

.lemesh-bottom__photo {
    width: 240px;
    height: 300px;
    border-radius: 12px;
    margin-bottom: 0;
    flex-shrink: 0;
}

.lemesh-bottom__manager-text {
    flex: 1;
}

.lemesh-bottom__manager-text h3 {
    font-size: 24px;
    margin-bottom: 4px;
    text-transform: none;
}

.lemesh-bottom__manager-text .lemesh-btn {
    margin-top: 4px;
}

.lemesh-bottom__role {
    font-size: 14px;
    margin: 0 0 12px;
}

.lemesh-bottom__quote {
    margin: 0 0 14px;
    font-size: 14px;
    color: var(--lemesh-gray);
    line-height: 1.55;
}

.lemesh-bottom__guarantees-accent {
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--lemesh-blue-light);
    border-left: 4px solid var(--lemesh-blue);
    border-radius: 8px;
    padding: 14px 16px;
    margin-bottom: 18px;
    font-size: 15px;
    font-weight: 700;
    color: var(--lemesh-dark);
    line-height: 1.35;
}

.lemesh-bottom__guarantees-accent svg {
    width: 26px;
    height: 26px;
    color: var(--lemesh-blue);
    flex-shrink: 0;
}

.lemesh-bottom__guarantees-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.lemesh-bottom__guarantees-list li {
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 14px;
    line-height: 1.45;
    color: var(--lemesh-dark);
}

.lemesh-bottom__guarantees-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--lemesh-blue-light);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--lemesh-blue);
}

.lemesh-bottom__guarantees-icon svg {
    width: 22px;
    height: 22px;
}

/* Materials section */
.lemesh-materials {
    background: var(--lemesh-white);
}

.lemesh-materials__gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 20px;
}

.lemesh-materials__gallery figure {
    position: relative;
    margin: 0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--lemesh-shadow);
}

.lemesh-materials__gallery img {
    width: 100%;
    height: 260px;
    object-fit: cover;
    display: block;
}

.lemesh-materials__gallery figcaption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 24px 16px 12px;
    font-size: 14px;
    font-weight: 600;
    color: var(--lemesh-white);
    background: linear-gradient(0deg, rgba(10, 20, 35, 0.75) 0%, rgba(10, 20, 35, 0) 100%);
}

.lemesh-materials__note {
    margin: 0 auto;
    max-width: 640px;
    text-align: center;
    font-size: 14px;
    color: var(--lemesh-gray);
    line-height: 1.55;
}

/* Lightbox */
.lemesh-lightbox {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(10, 16, 26, 0.92);
    cursor: zoom-out;
}

.lemesh-lightbox.is-open {
    display: flex;
}

.lemesh-lightbox img {
    max-width: 92vw;
    max-height: 88vh;
    border-radius: 8px;
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.5);
}

.lemesh-lightbox__close {
    position: absolute;
    top: 16px;
    right: 20px;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    color: var(--lemesh-white);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

.lemesh-lightbox__close:hover {
    background: var(--lemesh-blue);
}

/* Callback compact */
.lemesh-callback {
    background: var(--lemesh-blue-deep);
}

.lemesh-callback__grid {
    gap: 24px;
}

.lemesh-callback__content .lemesh-section__title {
    font-size: 26px;
    margin-bottom: 14px;
    line-height: 1.2;
}

.lemesh-callback__features {
    gap: 14px;
    margin-top: 14px;
}

.lemesh-callback__feature {
    font-size: 15px;
}

.lemesh-callback__form {
    padding: 32px;
}

.lemesh-callback__form .lemesh-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.lemesh-callback__form .lemesh-form__label {
    margin: 0;
}.lemesh-callback__form .lemesh-form__checkbox,
.lemesh-callback__form .lemesh-btn
    {
    grid-column: 1 / -1;
}

/* Footer compact */
.lemesh-footer {
    background: #111820;
    color: rgba(255, 255, 255, 0.85);
    padding: 48px 0 0;
}

.lemesh-footer__inner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    padding-bottom: 32px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.lemesh-footer a {
    color: rgba(255, 255, 255, 0.85);
}

.lemesh-footer a:hover {
    color: var(--lemesh-white);
}

.lemesh-footer__bottom {
    padding: 20px 0;
    text-align: center;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.5);
}

.lemesh-footer__bottom p {
    margin: 0;
}

.lemesh-footer__inner {
    grid-template-columns: 1fr auto 1fr;
    gap: 32px;
    align-items: center;
    padding-bottom: 32px;
}

.lemesh-logo__img--footer {
    width: 110px;
}

.lemesh-footer__nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}

.lemesh-footer__nav a {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.9);
}

.lemesh-footer__nav a:hover {
    color: var(--lemesh-white);
}

.lemesh-footer__contacts {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
}

.lemesh-footer__contacts .lemesh-phone {
    color: var(--lemesh-white);
    font-size: 18px;
}

.lemesh-footer__socials {
    display: flex;
    gap: 10px;
}

.lemesh-footer__socials a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    color: var(--lemesh-white);
}

.lemesh-footer__socials a svg {
    width: 16px;
    height: 16px;
}

.lemesh-footer__socials a:hover {
    background: var(--lemesh-blue);
}

.lemesh-footer__bottom {
    padding: 16px 0;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.65);
}

/* Responsive */
@media (max-width: 1100px) {
    .lemesh-hero__grid {
        gap: 20px;
    }

    .lemesh-hero__title {
        font-size: 34px;
    }

    .lemesh-services__grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .lemesh-portfolio__grid {
        grid-template-columns: repeat(3, 1fr);
    }

}

@media (max-width: 1024px) {
    .lemesh-hero__grid,
    .lemesh-quiz__grid,
    .lemesh-callback__grid {
        grid-template-columns: 1fr;
    }

    .lemesh-steps .lemesh-steps-line {
        grid-template-columns: repeat(3, 1fr);
    }

    .lemesh-steps .lemesh-step-mini:not(:last-child)::after {
        display: none;
    }

    .lemesh-step-mini p {
        display: block;
        margin-top: 8px;
    }

    .lemesh-hero__visual {
        order: 2;
        min-height: 320px;
        max-height: 380px;
    }

    .lemesh-hero__visual img {
        min-height: 320px;
        max-height: 380px;
    }

    .lemesh-hero__content {
        order: 1;
        align-items: stretch;
        padding: 18px 0 22px;
    }

    .lemesh-hero__content-inner {
        max-width: none;
        padding-left: 20px;
        padding-right: 20px;
    }

    .lemesh-hero {
        min-height: auto;
        max-height: none;
    }

    .lemesh-hero__grid {
        min-height: auto;
        max-height: none;
    }

    .lemesh-hero__advantages {
        flex-wrap: wrap;
    }

    .lemesh-hero__cta {
        flex-wrap: wrap;
    }

    .lemesh-quiz__visual {
        order: -1;
        min-height: 280px;
    }

    .lemesh-quiz__visual img {
        min-height: 280px;
    }

    .lemesh-quiz__result-card {
        position: static;
        margin-top: 14px;
    }

    .lemesh-bottom__grid {
        grid-template-columns: 1fr;
    }

    .lemesh-services__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .lemesh-bottom__grid {
        grid-template-columns: 1.5fr 1fr;
    }
}

@media (max-width: 768px) {
    .lemesh-section {
        padding: 36px 0;
    }

    .lemesh-header__contacts {
        display: none;
    }

    .lemesh-nav--desktop {
        display: none;
    }

    .lemesh-burger {
        display: flex;
    }

    .lemesh-mobile-menu.is-open {
        display: block;
    }

    .lemesh-hero__title {
        font-size: 26px;
        margin-bottom: 8px;
    }

    .lemesh-hero__visual {
        order: 2;
        min-height: 240px;
        max-height: 280px;
    }

    .lemesh-hero__visual img {
        min-height: 240px;
        max-height: 280px;
    }

    .lemesh-hero__content {
        order: 1;
        padding: 16px 0 18px;
    }

    .lemesh-hero__objects {
        display: none;
    }

    .lemesh-hero__advantages {
        flex-direction: column;
        gap: 8px;
        margin-bottom: 16px;
    }

    .lemesh-hero__cta {
        flex-direction: column;
        gap: 8px;
        margin-bottom: 0;
    }.lemesh-hero__cta .lemesh-btn
    {
        width: 100%;
        white-space: normal;
        text-align: center;
        line-height: 1.25;
    }

    .lemesh-section__title {
        font-size: 22px;
    }

    .lemesh-section__title--small {
        font-size: 20px;
    }

    .lemesh-section__subtitle {
        font-size: 14px;
        margin-bottom: 18px;
    }

    .lemesh-services__grid,
    .lemesh-portfolio__grid {
        grid-template-columns: 1fr;
    }

    .lemesh-service-card__image {
        height: 120px;
    }

    .lemesh-service-card h3 {
        font-size: 15px;
    }

    .lemesh-service-card p {
        font-size: 13px;
    }.lemesh-footer__inner
    {
        grid-template-columns: 1fr;
    }

    .lemesh-quiz__form,
    .lemesh-callback__form {
        padding: 20px;
    }

    .lemesh-footer__inner {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
        gap: 16px;
    }

    .lemesh-footer__contacts {
        align-items: center;
    }

    .lemesh-checklist--two-col {
        grid-template-columns: 1fr;
    }

    .lemesh-steps-line,
    .lemesh-steps .lemesh-steps-line {
        display: flex;
        flex-direction: column;
    }

    .lemesh-step-mini {
        display: flex;
        align-items: center;
        gap: 12px;
        text-align: left;
        padding: 10px 14px;
        border: none;
        border-bottom: 1px solid var(--lemesh-border);
    }

    .lemesh-steps .lemesh-step-mini {
        border: 1px solid var(--lemesh-border);
        border-bottom: none;
        border-radius: 0;
    }

    .lemesh-steps .lemesh-step-mini:first-child {
        border-radius: 12px 12px 0 0;
    }

    .lemesh-steps .lemesh-step-mini:last-child {
        border-bottom: 1px solid var(--lemesh-border);
        border-radius: 0 0 12px 12px;
    }

    .lemesh-step-mini:last-child {
        border-bottom: none;
    }

    .lemesh-step-mini__icon,
    .lemesh-steps .lemesh-step-mini__icon {
        margin: 0;
        flex-shrink: 0;
    }

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

    .lemesh-step-mini p {
        display: none;
    }

    .lemesh-callback__form .lemesh-form {
        grid-template-columns: 1fr;
    }

    .lemesh-bottom__grid {
        grid-template-columns: 1fr;
    }

    .lemesh-materials__gallery {
        grid-template-columns: 1fr;
    }

    .lemesh-materials__gallery img {
        height: 200px;
    }

    .lemesh-bottom__card--manager {
        gap: 16px;
    }

    .lemesh-bottom__photo {
        width: 110px;
        height: 140px;
    }

    .lemesh-services,
    .lemesh-includes,
    .lemesh-steps,
    .lemesh-portfolio,
    .lemesh-trust,
    .lemesh-bottom,
    .lemesh-callback {
        padding-top: 24px;
        padding-bottom: 24px;
    }

    .lemesh-logo {
        flex-direction: column;
        align-items: flex-start;
        gap: 3px;
    }

    .lemesh-logo__tagline {
        display: none;
    }

    .lemesh-logo__img {
        width: 64px;
    }
}

@media (max-width: 480px) {
    .lemesh-hero__title {
        font-size: 24px;
    }

    .lemesh-hero__advantages {
        flex-direction: column;
    }

    .lemesh-section__title {
        font-size: 20px;
    }

    .lemesh-hero__objects {
        font-size: 12px;
    }

    .lemesh-quiz__progress small {
        display: none;
    }

    .lemesh-quiz__progress {
        gap: 6px;
    }
}

/* Visual pass 2026-07-01: align closer to supplied LEMESH PRO mockup */
.lemesh-container {
    max-width: 1200px;
}

@media (min-width: 1025px) {
    .lemesh-hero__content-inner {
        width: min(100%, 540px);
        margin-left: max(20px, calc((100vw - 1200px) / 2));
        padding-right: 20px;
    }

    .lemesh-hero__visual img {
        object-position: 85% 70%;
    }
}

/* Mobile section order: DOM-driven since v1.5.0 (no CSS order rules). */
@media (max-width: 768px) {
    .lemesh-landing {
        display: flex;
        flex-direction: column;
    }

    .lemesh-services {
        padding-top: 24px;
        padding-bottom: 24px;
    }

    .lemesh-hero__content {
        padding: 14px 0 16px;
    }

    .lemesh-hero__visual {
        min-height: 220px;
        max-height: 260px;
    }

    .lemesh-hero__visual img {
        min-height: 220px;
        max-height: 260px;
    }
}

/* Final desktop mockup tightening: hero/quiz geometry */
@media (min-width: 1025px) {
    .lemesh-hero__grid {
        grid-template-columns: 49% 51%;
        min-height: 390px;
        max-height: 420px;
    }

    .lemesh-hero__content {
        align-items: flex-start;
    }

    .lemesh-hero__content-inner {
        max-width: 610px;
        margin-left: max(60px, calc((100vw - 1320px) / 2));
        padding-left: 0;
        padding-right: 18px;
    }

    .lemesh-hero__title {
        font-size: clamp(38px, 3vw, 46px);
        margin-bottom: 12px;
    }

    .lemesh-hero__objects {
        max-width: 520px;
        margin-bottom: 14px;
    }

    .lemesh-hero__advantages {
        gap: 16px;
        max-width: 560px;
    }

    .lemesh-hero__advantage {
        font-size: 11px;
    }

    .lemesh-hero__cta .lemesh-btn {
        min-width: 210px;
        padding: 10px 14px;
        font-size: 11px;
    }

    .lemesh-hero__visual,
    .lemesh-hero__visual img {
        min-height: 390px;
        max-height: 420px;
    }

    .lemesh-hero__visual img {
        object-position: 58% 55%;
    }

    .lemesh-quiz {
        padding-top: 22px;
        padding-bottom: 24px;
    }

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

    .lemesh-quiz__form {
        padding: 20px 22px;
    }

    .lemesh-quiz__visual,
    .lemesh-quiz__visual img {
        min-height: 300px;
        max-height: 340px;
    }

    .lemesh-services {
        padding-top: 26px;
    }

    .lemesh-section__title--center {
        margin-bottom: 24px;
    }
}

/* Final hero ratio polish: closer to supplied desktop composition */
@media (min-width: 1025px) {
    .lemesh-hero__grid {
        grid-template-columns: 44% 56%;
    }

    .lemesh-hero__content-inner {
        max-width: 560px;
        margin-left: max(54px, calc((100vw - 1320px) / 2));
    }

    .lemesh-hero__title {
        font-size: clamp(34px, 2.8vw, 42px);
    }

    .lemesh-hero__objects {
        max-width: 470px;
    }

    .lemesh-hero__advantages {
        max-width: 520px;
        gap: 12px;
    }

    .lemesh-hero__cta .lemesh-btn {
        min-width: 200px;
    }
}

/* v1.2.0 final polish: mobile services list, hero gradient, compact desktop header */

/* Desktop header: compact, logo readable, no excessive height */
@media (min-width: 1025px) {
    .lemesh-header {
        --header-height: 56px;
    }

    .lemesh-header__inner {
        gap: 12px;
        min-height: 56px;
    }

    .lemesh-logo__img {
        width: 54px;
    }

    .lemesh-logo__tagline {
        font-size: 9px;
        max-width: 150px;
        line-height: 1.2;
    }

    .lemesh-nav--desktop {
        gap: 14px;
    }

    .lemesh-nav--desktop a {
        font-size: 11px;
    }

    .lemesh-header__contacts {
        gap: 10px;
    }

    .lemesh-header__contacts .lemesh-phone {
        font-size: 13px;
    }

    .lemesh-header__contacts .lemesh-btn {
        padding: 7px 12px;
        font-size: 11px;
    }
}

/* Desktop hero: soft gradient blend from text side into photo */
@media (min-width: 1025px) {
    .lemesh-hero__visual::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 130px;
        background: linear-gradient(
            to right,
            rgba(255, 255, 255, 0.96) 0%,
            rgba(255, 255, 255, 0.75) 35%,
            rgba(255, 255, 255, 0.35) 65%,
            rgba(255, 255, 255, 0) 100%
        );
        pointer-events: none;
        z-index: 1;
    }

    .lemesh-hero__visual img {
        position: relative;
        z-index: 0;
    }
}

/* Mobile services: compact vertical list with blue round icons, no photo cards */
@media (max-width: 768px) {
    .lemesh-services {
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .lemesh-services .lemesh-section__title {
        margin-bottom: 10px;
    }

    .lemesh-services__grid {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }

    .lemesh-service-card {
        display: block;
        background: transparent;
        border: none;
        border-radius: 0;
        box-shadow: none;
        padding: 5px 0;
    }

    .lemesh-service-card:hover {
        box-shadow: none;
        border-color: transparent;
    }

    .lemesh-service-card__image {
        display: none;
    }

    .lemesh-service-card__body {
        display: grid;
        grid-template-columns: auto 1fr;
        align-items: start;
        gap: 0 12px;
        padding: 0;
    }

    .lemesh-service-card__icon {
        grid-row: 1 / 3;
        grid-column: 1;
        width: 36px;
        height: 36px;
        margin: 0;
        align-self: start;
    }

    .lemesh-service-card__icon svg {
        width: 17px;
        height: 17px;
    }

    .lemesh-service-card h3 {
        grid-row: 1;
        grid-column: 2;
        font-size: 14px;
        margin: 0 0 2px;
    }

    .lemesh-service-card p {
        grid-row: 2;
        grid-column: 2;
        font-size: 12px;
        line-height: 1.35;
        -webkit-line-clamp: 2;
        color: var(--lemesh-gray);
    }
}

/* Mobile quiz should follow services directly, as in the supplied mockup.
   v1.5.2: boundary 768px -> 767px — at exactly 768px this rule hid the
   visual while v1.4.59 (min-width:768) expects the tablet banner visible. */
@media (max-width: 767px) {
    .lemesh-quiz {
        padding-top: 10px;
    }

    .lemesh-quiz__visual {
        display: none;
    }
}

/* v1.2.2 manual polish: closer header/hero/mobile density to supplied mockup */
.lemesh-header__inner {
    min-height: 72px;
}

.lemesh-logo__img {
    width: 96px;
}

.lemesh-nav a,
.lemesh-phone {
    font-size: 12px;
}

.lemesh-header__contacts .lemesh-btn {
    padding: 9px 16px;
    font-size: 11px;
}

@media (min-width: 1025px) {
    .lemesh-hero__grid {
        min-height: 400px;
        max-height: 430px;
    }

    .lemesh-hero__visual,
    .lemesh-hero__visual img {
        min-height: 400px;
        max-height: 430px;
    }

    .lemesh-hero__visual::before {
        width: 210px;
        background: linear-gradient(90deg, #fff 0%, rgba(255,255,255,.88) 34%, rgba(255,255,255,.28) 72%, rgba(255,255,255,0) 100%);
    }

    .lemesh-hero__content-inner {
        padding-top: 8px;
    }

    .lemesh-hero__title {
        font-size: clamp(36px, 2.95vw, 44px);
        letter-spacing: .005em;
    }

    .lemesh-quiz {
        padding-top: 18px;
    }

    .lemesh-services {
        padding-top: 22px;
    }
}

@media (max-width: 768px) {
    .lemesh-header__inner {
        min-height: 58px;
    }

    .lemesh-logo__img {
        width: 72px;
    }

    .lemesh-hero__content {
        padding-top: 18px;
    }

    .lemesh-hero__title {
        font-size: 25px;
        line-height: 1.02;
        margin-bottom: 10px;
    }

    .lemesh-services {
        padding-top: 28px;
        padding-bottom: 14px;
    }

    .lemesh-services__grid {
        gap: 12px;
    }

    .lemesh-service-card__body {
        gap: 10px;
    }

    .lemesh-quiz__form {
        padding: 18px 20px;
        border-radius: 12px;
    }

    .lemesh-quiz__options {
        gap: 8px;
    }

    .lemesh-quiz__option {
        padding: 8px 10px;
    }
}

/* Form status messages & honeypot */
.lemesh-form__success {
    background: #e8f5e9;
    border: 1px solid #a5d6a7;
    border-radius: 8px;
    color: #1b5e20;
    padding: 20px 24px;
    font-size: 16px;
    line-height: 1.5;
}

.lemesh-form__error {
    background: #fdecea;
    border: 1px solid #f5c6c0;
    border-radius: 8px;
    color: #b71c1c;
    padding: 12px 16px;
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 12px;
}

.lemesh-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    opacity: 0;
}


/* ============================================================
   v1.4.0 — Global scale rebuild
   Appended last: overrides earlier rules by source order.
   Breakpoints: >=1440 desktop-large, 1200-1439 desktop,
   768-1199 tablet, <=767 mobile. No transform:scale/zoom.
   ============================================================ */

:root {
    --header-height: 80px;
}

/* --- Container & base typography --- */
.lemesh-container {
    max-width: 1280px;
    width: calc(100% - 64px);
    padding: 0;
}

.lemesh-section {
    padding: 88px 0;
}

.lemesh-hero {
    padding: 0;
}

.lemesh-section__title {
    font-size: clamp(34px, 2.5vw, 44px);
    line-height: 1.12;
    letter-spacing: -0.01em;
    margin-bottom: 16px;
}

.lemesh-section__title--small {
    font-size: clamp(28px, 2.2vw, 36px);
}

.lemesh-section__title--center {
    margin-bottom: 40px;
}

.lemesh-section__subtitle {
    font-size: 17px;
    line-height: 1.5;
}

/* --- Buttons: 15-17px, min-height 52 --- */
.lemesh-btn {
    min-height: 52px;
    padding: 0 26px;
    font-size: 16px;
    border-radius: 8px;
}

.lemesh-btn--small {
    min-height: 44px;
    padding: 0 20px;
    font-size: 15px;
}

/* --- Header: 80px --- */
.lemesh-header__inner {
    min-height: 80px;
    gap: 24px;
}

.lemesh-logo__img {
    width: 124px;
}

.lemesh-logo__tagline {
    font-size: 11px;
    max-width: 175px;
}

.lemesh-nav--desktop {
    gap: 30px;
}

.lemesh-nav--desktop a {
    font-size: 15px;
}

.lemesh-header__contacts {
    gap: 18px;
}

.lemesh-header__contacts .lemesh-phone {
    font-size: 17px;
    font-weight: 700;
}

.lemesh-header__contacts .lemesh-btn {
    min-height: 46px;
    padding: 0 22px;
    font-size: 14px;
    font-weight: 600;
}

.lemesh-mobile-menu {
    top: 80px;
}

/* --- Hero: 620px, 48/52 --- */
.lemesh-hero__grid {
    grid-template-columns: 48% 52%;
    min-height: 620px;
    max-height: none;
}

.lemesh-hero__content {
    align-items: flex-start;
    padding: 72px 0;
}

.lemesh-hero__content-inner {
    width: min(100%, 640px);
    max-width: 640px;
    margin-left: max(32px, calc((100vw - 1280px) / 2));
    padding-left: 0;
    padding-right: 48px;
}

.lemesh-hero__title {
    font-size: clamp(52px, 4.1vw, 72px);
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -0.03em;
    max-width: 680px;
    margin: 0 0 24px;
}

.lemesh-hero__objects {
    font-size: 18px;
    line-height: 1.5;
    max-width: 620px;
    margin: 0 0 28px;
}

.lemesh-hero__advantages {
    gap: 28px;
    max-width: none;
    margin-bottom: 32px;
}

.lemesh-hero__advantage {
    font-size: 15px;
    gap: 10px;
    line-height: 1.35;
}

.lemesh-hero__adv-icon {
    width: 30px;
    height: 30px;
}

.lemesh-hero__adv-icon svg {
    width: 28px;
    height: 28px;
}

.lemesh-hero__cta {
    gap: 14px;
}

.lemesh-hero__cta .lemesh-btn {
    min-height: 56px;
    padding: 6px 26px;
    font-size: 16px;
}

.lemesh-hero__cta .lemesh-btn--primary {
    min-width: 230px;
}

.lemesh-hero__cta .lemesh-btn--outline {
    min-width: 210px;
}

.lemesh-hero__visual,
.lemesh-hero__visual img {
    min-height: 620px;
    max-height: none;
}

.lemesh-hero__visual img {
    object-position: 58% 50%;
}

/* --- Quiz: 88px padding, 45/55, big cards --- */
.lemesh-quiz {
    padding: 88px 0;
}

.lemesh-quiz__grid {
    grid-template-columns: 9fr 11fr;
    gap: 36px;
}

.lemesh-quiz__form {
    padding: 40px;
    border-radius: 20px;
    min-height: 460px;
}

.lemesh-quiz__form .lemesh-section__subtitle--small {
    font-size: 16px;
    margin-top: 12px;
}

.lemesh-quiz__progress-step span {
    width: 42px;
    height: 42px;
}

.lemesh-quiz__progress-step span svg {
    width: 18px;
    height: 18px;
}

.lemesh-quiz__progress-step small {
    font-size: 13px;
}

.lemesh-quiz__counter {
    margin: 0 0 8px;
    font-size: 14px;
    font-weight: 600;
    color: var(--lemesh-gray);
}

/* v1.4.13 a11y: 4.5:1 contrast on light-blue quiz background */
.lemesh-quiz__form .lemesh-section__subtitle,
.lemesh-quiz__counter {
    color: #4B5563;
}

.lemesh-quiz__question {
    font-size: 19px;
    margin: 0 0 16px;
}

.lemesh-quiz__options {
    gap: 10px;
}

.lemesh-quiz__option {
    min-height: 48px;
    padding: 12px 18px;
    font-size: 15px;
    border-radius: 10px;
    text-align: left;
    border: 2px solid var(--lemesh-border);
}

.lemesh-quiz__option--selected {
    background: var(--lemesh-blue-light);
    border-color: var(--lemesh-blue);
    color: var(--lemesh-dark);
    box-shadow: 0 0 0 3px rgba(0, 87, 184, 0.18);
}

.lemesh-quiz__step--invalid .lemesh-quiz__options {
    animation: lemesh-shake 0.3s ease;
}

@keyframes lemesh-shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-6px); }
    75% { transform: translateX(6px); }
}

.lemesh-quiz__nav {
    display: flex;
    gap: 12px;
    margin-top: 20px;
    align-items: center;
}

.lemesh-quiz__next {
    min-height: 52px;
    padding: 0 36px;
    font-size: 16px;
    flex: 1;
}

.lemesh-quiz__back {
    min-height: 52px;
    padding: 0 22px;
    font-size: 15px;
    font-weight: 600;
    color: var(--lemesh-blue);
    background: var(--lemesh-white);
    border: 2px solid var(--lemesh-border);
    border-radius: 8px;
    cursor: pointer;
    margin-top: 0;
    transition: all var(--lemesh-transition);
}

.lemesh-quiz__back:hover {
    border-color: var(--lemesh-blue);
}

.lemesh-quiz__step--final > .lemesh-quiz__back {
    margin-top: 14px;
}

.lemesh-quiz__visual,
.lemesh-quiz__visual img {
    min-height: 460px;
    max-height: none;
    border-radius: 20px;
}

.lemesh-quiz__result-card {
    position: absolute;
    left: 28px;
    bottom: auto;
    top: 50%;
    transform: translateY(-50%);
    right: auto;
    width: min(75%, 340px);
    padding: 28px 30px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 12px 32px rgba(10, 30, 60, 0.14);
}

.lemesh-quiz__result-card h3 {
    font-size: 22px;
    margin: 0 0 14px;
}

.lemesh-quiz__result-card ul {
    font-size: 16px;
    line-height: 1.5;
    gap: 8px;
}

.lemesh-quiz__result-card li {
    margin-bottom: 8px;
}

/* --- Services: 3x2, big clickable cards --- */
.lemesh-services__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.lemesh-service-card {
    display: flex;
    flex-direction: column;
    min-height: 410px;
    border-radius: 16px;
    overflow: hidden;
    background: var(--lemesh-white);
    border: 1px solid var(--lemesh-border);
    box-shadow: 0 8px 24px rgba(15, 40, 70, 0.08);
    text-decoration: none;
    color: inherit;
    transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.lemesh-service-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 32px rgba(15, 40, 70, 0.14);
    color: inherit;
}

.lemesh-service-card__image {
    height: 230px;
    overflow: hidden;
}

.lemesh-service-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.25s ease;
}

.lemesh-service-card:hover .lemesh-service-card__image img {
    transform: scale(1.03);
}

.lemesh-service-card__body {
    padding: 24px;
    flex: 1;
}

.lemesh-service-card__head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 12px;
}

.lemesh-service-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    color: var(--lemesh-blue);
    background: var(--lemesh-blue-light);
    border-radius: 10px;
    margin: 0;
}

.lemesh-service-card__icon svg {
    width: 20px;
    height: 20px;
}

.lemesh-service-card h3 {
    font-size: 20px;
    line-height: 1.25;
    margin: 0;
    min-height: 50px;
    color: var(--lemesh-dark);
}

.lemesh-service-card p {
    font-size: 15px;
    line-height: 1.45;
    color: var(--lemesh-gray);
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* --- Includes: 80px, light bg --- */
.lemesh-includes {
    padding: 80px 0;
    background: #F5F8FC;
}

.lemesh-includes .lemesh-section__title {
    margin-bottom: 40px;
}

.lemesh-checklist--two-col {
    column-gap: 80px;
    row-gap: 18px;
}

.lemesh-checklist--two-col li {
    font-size: 17px;
    padding-left: 34px;
    margin-bottom: 0;
}

.lemesh-checklist--two-col li::before {
    width: 24px;
    height: 24px;
    background-size: 13px;
}

.lemesh-includes__note {
    margin-top: 40px;
    padding: 24px 30px;
    border-radius: 14px;
    font-size: 17px;
    line-height: 1.45;
    border: 1px solid var(--lemesh-blue);
    background: #EEF6FF;
    color: var(--lemesh-dark);
}

/* --- Steps: 5 in row >=1280 --- */
.lemesh-steps .lemesh-section__title {
    font-size: clamp(34px, 2.5vw, 40px);
    margin-bottom: 44px;
}

.lemesh-steps .lemesh-steps-line {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}

.lemesh-steps .lemesh-step-mini {
    position: relative;
    min-height: 240px;
    padding: 30px 22px;
    border-radius: 16px;
    background: var(--lemesh-white);
    border: 1px solid var(--lemesh-border);
    text-align: left;
}

.lemesh-step-mini__num {
    display: block;
    font-size: 28px;
    font-weight: 800;
    color: var(--lemesh-blue);
    line-height: 1;
    margin-bottom: 16px;
}

.lemesh-steps .lemesh-step-mini__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 14px;
    background: var(--lemesh-blue-light);
    color: var(--lemesh-blue);
    margin: 0 0 20px;
    position: static;
}

.lemesh-steps .lemesh-step-mini__icon span {
    display: none;
}

.lemesh-steps .lemesh-step-mini h3 {
    font-size: 20px;
    margin: 0 0 10px;
    color: var(--lemesh-dark);
}

.lemesh-steps .lemesh-step-mini p {
    font-size: 15px;
    line-height: 1.45;
    color: var(--lemesh-gray);
    margin: 0;
}

.lemesh-steps .lemesh-step-mini:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -14px;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230057B8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3Cpolyline points='12 5 19 12 12 19'/%3E%3C/svg%3E") center/contain no-repeat;
    z-index: 2;
}

/* --- Portfolio: 96px, big cards --- */
.lemesh-portfolio {
    padding: 96px 0;
    background: #F7F9FC;
}

.lemesh-portfolio .lemesh-section__title {
    font-size: clamp(34px, 2.6vw, 42px);
    margin-bottom: 42px;
}

.lemesh-portfolio__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.lemesh-portfolio-card {
    display: flex;
    flex-direction: column;
    min-height: 520px;
    border-radius: 18px;
    overflow: hidden;
    background: var(--lemesh-white);
    box-shadow: 0 10px 32px rgba(10, 30, 60, 0.09);
}

.lemesh-portfolio-card__image {
    height: 300px;
    overflow: hidden;
    cursor: zoom-in;
}

.lemesh-portfolio-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lemesh-portfolio-card__body {
    padding: 24px;
}

.lemesh-portfolio-card__body h3 {
    font-size: 21px;
    line-height: 1.25;
    margin: 0 0 14px;
}

.lemesh-portfolio-card__meta {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 15px;
    line-height: 1.45;
    color: var(--lemesh-gray);
    margin-top: 14px;
}

.lemesh-portfolio__footer {
    margin-top: 36px;
    text-align: center;
}

.lemesh-portfolio__footer .lemesh-btn {
    min-height: 52px;
    padding: 0 32px;
    font-size: 16px;
}

/* --- Lightbox pro --- */
.lemesh-lightbox__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
    z-index: 2;
    transition: background 0.2s ease;
}

.lemesh-lightbox__nav:hover {
    background: rgba(255, 255, 255, 0.3);
}

.lemesh-lightbox__nav--prev {
    left: 20px;
}

.lemesh-lightbox__nav--next {
    right: 20px;
}

.lemesh-lightbox__counter {
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    color: rgba(255, 255, 255, 0.85);
    font-size: 14px;
    font-weight: 600;
}

.lemesh-lightbox__caption {
    position: absolute;
    bottom: 22px;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    font-size: 15px;
    max-width: 80vw;
    text-align: center;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
}

/* --- Trust (dark): 40/60, stat cards 2x2 --- */
.lemesh-trust {
    padding: 80px 0;
    min-height: 360px;
}

/* --- Materials: 88px, big photos --- */
.lemesh-materials .lemesh-section__title {
    font-size: clamp(34px, 2.5vw, 40px);
    margin-bottom: 0;
}

.lemesh-materials__subtitle {
    font-size: 17px;
    line-height: 1.5;
    max-width: 760px;
    margin: 16px auto 36px;
    text-align: center;
    color: var(--lemesh-gray);
}

.lemesh-materials__gallery {
    gap: 24px;
}

.lemesh-materials__gallery figure {
    border-radius: 16px;
    overflow: hidden;
}

.lemesh-materials__gallery img {
    height: 320px;
}

.lemesh-materials__gallery figcaption {
    font-size: 18px;
    font-weight: 700;
    padding: 20px;
    background: linear-gradient(0deg, rgba(10, 25, 45, 0.88) 0%, rgba(10, 25, 45, 0.45) 55%, rgba(10, 25, 45, 0) 100%);
}

.lemesh-materials__note {
    font-size: 16px;
    margin-top: 28px;
}

/* --- Bottom: manager / guarantees / reviews --- */
.lemesh-bottom {
    padding: 88px 0;
}

.lemesh-bottom__grid {
    display: grid;
    grid-template-columns: 58fr 42fr;
    gap: 28px;
}

.lemesh-bottom__card {
    min-height: 420px;
    padding: 36px;
    border-radius: 18px;
}

.lemesh-bottom__card--manager {
    display: flex;
    gap: 30px;
    align-items: center;
}

.lemesh-bottom__photo {
    width: 260px;
    height: 330px;
    border-radius: 14px;
    overflow: hidden;
    flex-shrink: 0;
}

.lemesh-bottom__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lemesh-bottom__manager-text h3 {
    font-size: 28px;
    margin: 0 0 6px;
}

.lemesh-bottom__role {
    font-size: 17px;
    font-weight: 700;
    color: var(--lemesh-blue);
    margin: 0 0 14px;
}

.lemesh-bottom__quote {
    font-size: 16px;
    line-height: 1.55;
    max-width: 460px;
    color: var(--lemesh-dark);
    margin: 0 0 24px;
}

.lemesh-bottom__manager-text .lemesh-btn {
    min-height: 50px;
    font-size: 15px;
    padding: 0 24px;
    margin-top: 0;
}

.lemesh-bottom__card--guarantees h3 {
    font-size: 26px;
    margin: 0 0 18px;
}

.lemesh-bottom__guarantees-accent {
    padding: 20px;
    border-left: 4px solid var(--lemesh-blue);
    font-size: 17px;
    line-height: 1.45;
    gap: 12px;
    margin-bottom: 22px;
}

.lemesh-bottom__guarantees-accent svg {
    width: 26px;
    height: 26px;
}

.lemesh-bottom__guarantees-list {
    gap: 18px;
}

.lemesh-bottom__guarantees-list li {
    font-size: 16px;
    line-height: 1.45;
    gap: 14px;
}

.lemesh-bottom__guarantees-icon {
    width: 30px;
    height: 30px;
}

.lemesh-bottom__guarantees-icon svg {
    width: 18px;
    height: 18px;
}

/* --- Final CTA --- */
.lemesh-callback {
    padding: 88px 0;
    min-height: 520px;
    display: flex;
    align-items: center;
}

.lemesh-callback__grid {
    display: grid;
    grid-template-columns: 21fr 29fr;
    gap: 64px;
    align-items: center;
    width: 100%;
}

.lemesh-callback__content .lemesh-section__title {
    font-size: clamp(34px, 2.6vw, 44px);
    line-height: 1.12;
    max-width: 520px;
    margin-bottom: 0;
}

.lemesh-callback__subtitle {
    font-size: 17px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.82);
    margin: 18px 0 0;
    max-width: 480px;
}

.lemesh-callback__features {
    gap: 20px;
    margin-top: 28px;
    flex-wrap: wrap;
}

.lemesh-callback__feature {
    font-size: 16px;
    gap: 10px;
}

.lemesh-callback__feature svg {
    width: 22px;
    height: 22px;
}

.lemesh-callback__form {
    padding: 36px;
    border-radius: 18px;
    max-width: 680px;
    width: 100%;
    justify-self: end;
}

.lemesh-callback__form .lemesh-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.lemesh-callback__form .lemesh-form__label:has(textarea),
.lemesh-callback__form .lemesh-form__checkbox,
.lemesh-callback__form .lemesh-btn {
    grid-column: 1 / -1;
}

.lemesh-callback__form .lemesh-input {
    height: 54px;
    font-size: 16px;
    padding: 0 16px;
}

.lemesh-callback__form textarea.lemesh-input {
    height: auto;
    min-height: 120px;
    padding: 14px 16px;
    resize: vertical;
}

.lemesh-form__label span {
    font-size: 14px;
    margin-bottom: 6px;
}

.lemesh-form__checkbox {
    font-size: 14px;
    line-height: 1.4;
    gap: 10px;
}

.lemesh-form__checkbox input {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
}

.lemesh-callback__form .lemesh-btn {
    min-height: 56px;
    font-size: 17px;
}

/* --- Footer --- */
.lemesh-footer {
    padding: 52px 0 30px;
}

.lemesh-logo__img--footer {
    width: 120px;
}

.lemesh-footer__nav {
    gap: 24px;
}

.lemesh-footer__nav a {
    font-size: 14px;
}

.lemesh-footer__contacts .lemesh-phone {
    font-size: 19px;
}

.lemesh-footer__socials a {
    width: 40px;
    height: 40px;
}

.lemesh-footer__socials svg {
    width: 18px;
    height: 18px;
}

.lemesh-footer__bottom {
    margin-top: 30px;
}

.lemesh-footer__bottom a {
    color: rgba(255, 255, 255, 0.65);
    text-decoration: underline;
}

.lemesh-footer__bottom a:hover {
    color: #fff;
}

/* --- Hero photo: slim edge blend instead of wide white blur --- */
.lemesh-hero__visual::before {
    width: 80px;
    background: linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0.55) 45%, rgba(255, 255, 255, 0) 100%);
}

/* ============================================================
   v1.4.0 responsive: tablet 768-1199 / steps 1024-1279 / mobile <=767
   ============================================================ */

/* Steps: 3+2 below 1280 */
@media (max-width: 1279px) {
    .lemesh-steps .lemesh-steps-line {
        grid-template-columns: repeat(3, 1fr);
    }

    .lemesh-steps .lemesh-step-mini:nth-child(3)::after,
    .lemesh-steps .lemesh-step-mini:nth-child(5)::after {
        display: none;
    }
}

/* Tablet */
@media (max-width: 1199px) {
    :root {
        --header-height: 68px;
    }

    .lemesh-section {
        padding: 64px 0;
    }

    .lemesh-quiz,
    .lemesh-bottom,
    .lemesh-callback {
        padding: 64px 0;
    }

    .lemesh-includes,
    .lemesh-trust {
        padding: 56px 0;
    }

    .lemesh-portfolio {
        padding: 72px 0;
    }

    .lemesh-header__inner {
        min-height: 68px;
    }

    /* v1.4.9: tablet header — burger instead of crowded desktop nav */
    .lemesh-nav--desktop {
        display: none;
    }

    .lemesh-burger {
        display: flex;
    }

    .lemesh-logo__img {
        width: 105px;
    }

    .lemesh-nav--desktop {
        gap: 20px;
    }

    .lemesh-nav--desktop a {
        font-size: 14px;
    }

    .lemesh-hero__content {
        padding: 56px 0;
    }

    .lemesh-hero__grid,
    .lemesh-hero__visual,
    .lemesh-hero__visual img {
        min-height: 540px;
    }

    /* v1.4.6: tablet hero stacked — desktop 2-col geometry leaks otherwise */
    .lemesh-hero__grid {
        grid-template-columns: minmax(0, 1fr);
        min-height: 0;
    }

    .lemesh-hero__content-inner {
        width: 100%;
        max-width: 640px;
        margin-left: 0;
        padding: 0 32px;
    }

    .lemesh-hero__title {
        font-size: clamp(34px, 5.5vw, 48px);
    }

    .lemesh-hero__content-inner {
        padding-right: 32px;
    }

    .lemesh-hero__advantages {
        flex-wrap: wrap;
        gap: 14px 20px;
    }

    .lemesh-hero__advantage {
        flex: 1 1 45%;
    }

    .lemesh-portfolio__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .lemesh-callback__grid {
        gap: 40px;
    }

    .lemesh-mobile-menu {
        top: 68px;
    }
}

/* Stacked layouts */
@media (max-width: 1024px) {
    .lemesh-quiz__grid {
        grid-template-columns: 1fr;
    }

    .lemesh-quiz__visual,
    .lemesh-quiz__visual img {
        min-height: 380px;
    }

    .lemesh-callback__grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .lemesh-callback__form {
        justify-self: stretch;
        max-width: none;
    }

    .lemesh-bottom__grid {
        grid-template-columns: 1fr;
    }

    .lemesh-materials__gallery {
        grid-template-columns: 1fr 1fr;
    }

    /* v1.5.0: figure is wrapped in an accordion item (display:contents);
       target the last item instead — every figure is :last-child of its
       panel now, so the old selector matched all three. */
    .lemesh-materials__gallery .lemesh-materials__item:last-child figure {
        grid-column: 1 / -1;
    }

    .lemesh-hero__grid {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .lemesh-hero__content-inner {
        margin-left: auto;
        margin-right: auto;
        padding: 0;
        max-width: 640px;
    }

    .lemesh-hero__content {
        padding: 48px 0 0;
    }

    .lemesh-hero__visual,
    .lemesh-hero__visual img {
        min-height: 400px;
        max-height: 460px;
    }

    .lemesh-hero__visual::before {
        width: 0;
        background: none;
    }

    .lemesh-hero__visual img {
        object-position: 58% 45%;
    }
}

/* v1.4.59 tablet-only: cap quiz banner — portrait 3:4 photo (v1.4.58) at
   height:auto rendered ~1280px tall; keep it a compact cover banner.
   Scoped 768–1024 so mobile (≤767) visual stays exactly as before. */
@media (min-width: 768px) and (max-width: 1024px) {
    .lemesh-quiz__visual {
        max-height: 480px;
    }

    .lemesh-quiz__visual img {
        height: 100%;
        max-height: 480px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    :root {
        --header-height: 60px;
    }

    .lemesh-container {
        width: calc(100% - 40px);
    }

    .lemesh-section {
        padding: 48px 0;
    }

    .lemesh-hero {
        padding: 0;
    }

    .lemesh-quiz,
    .lemesh-bottom,
    .lemesh-callback {
        padding: 48px 0;
    }

    .lemesh-includes,
    .lemesh-trust,
    .lemesh-portfolio {
        padding: 48px 0;
    }

    .lemesh-header__inner {
        min-height: 60px;
    }

    .lemesh-logo__img {
        width: 92px;
    }

    .lemesh-mobile-menu {
        top: 60px;
    }

    .lemesh-section__title {
        font-size: clamp(30px, 8vw, 34px);
        margin-bottom: 24px;
    }

    .lemesh-section__title--small {
        font-size: clamp(24px, 6.5vw, 28px);
    }

    /* Hero: text then photo, full-width CTAs */
    .lemesh-hero__grid {
        grid-template-columns: minmax(0, 1fr);
        min-height: 0;
    }

    .lemesh-hero__content-inner {
        padding: 0 20px;
    }

    .lemesh-hero__content {
        padding: 32px 0 0;
    }

    .lemesh-hero__title {
        font-size: clamp(38px, 10.5vw, 44px);
        line-height: 1.04;
        margin-bottom: 16px;
    }

    .lemesh-hero__title span {
        white-space: normal;
    }

    .lemesh-hero__objects {
        font-size: 16px;
        margin-bottom: 20px;
    }

    .lemesh-hero__advantages {
        flex-direction: column;
        gap: 12px;
        margin-bottom: 24px;
    }

    .lemesh-hero__advantage {
        font-size: 14px;
        flex: none;
    }

    .lemesh-hero__cta {
        flex-direction: column;
        gap: 10px;
    }

    .lemesh-hero__cta .lemesh-btn {
        width: 100%;
        min-height: 54px;
        font-size: 15px;
    }

    .lemesh-hero__visual,
    .lemesh-hero__visual img {
        min-height: 300px;
        max-height: 360px;
    }

    .lemesh-hero__visual img {
        object-position: 60% 40%;
    }

    /* Quiz */
    .lemesh-quiz__form {
        padding: 24px;
        min-height: 0;
        border-radius: 16px;
    }

    .lemesh-quiz__progress-step small {
        display: none;
    }

    .lemesh-quiz__question {
        font-size: 17px;
    }

    .lemesh-quiz__option {
        font-size: 14px;
        min-height: 46px;
    }

    .lemesh-quiz__nav {
        flex-direction: column-reverse;
        gap: 10px;
    }

    .lemesh-quiz__next,
    .lemesh-quiz__back {
        width: 100%;
    }

    .lemesh-quiz__visual {
        display: none;
    }

    /* Services: full cards, 1 per row, photo 220 */
    .lemesh-services {
        padding-top: 48px;
        padding-bottom: 48px;
    }

    .lemesh-services .lemesh-section__title {
        margin-bottom: 28px;
    }

    .lemesh-services__grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .lemesh-service-card {
        display: flex;
        flex-direction: column;
        min-height: 0;
        padding: 0;
        background: var(--lemesh-white);
        border: 1px solid var(--lemesh-border);
        border-radius: 16px;
        box-shadow: 0 8px 24px rgba(15, 40, 70, 0.08);
    }

    .lemesh-service-card:hover {
        transform: none;
        box-shadow: 0 8px 24px rgba(15, 40, 70, 0.08);
    }

    .lemesh-service-card__image {
        display: block;
        height: 220px;
    }

    .lemesh-service-card__body {
        display: block;
        padding: 20px;
    }

    .lemesh-service-card__icon {
        width: 34px;
        height: 34px;
    }

    .lemesh-service-card h3 {
        font-size: 18px;
        min-height: 0;
    }

    .lemesh-service-card p {
        font-size: 14px;
        -webkit-line-clamp: 3;
    }

    /* Includes */
    .lemesh-checklist--two-col {
        grid-template-columns: 1fr;
        row-gap: 14px;
    }

    .lemesh-checklist--two-col li {
        font-size: 15px;
    }

    .lemesh-includes__note {
        padding: 18px 20px;
        font-size: 15px;
    }

    /* Steps: 1 per row, no horizontal scroll */
    .lemesh-steps .lemesh-steps-line {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;
    }

    .lemesh-steps .lemesh-step-mini {
        flex-direction: column;
        align-items: flex-start;
        min-width: 0;
    }

    .lemesh-step-mini p {
        display: block;
        margin-top: 8px;
        font-size: 14px;
    }

    .lemesh-steps .lemesh-step-mini {
        min-height: 0;
        padding: 24px 20px;
    }

    .lemesh-steps .lemesh-step-mini:not(:last-child)::after {
        display: none;
    }

    .lemesh-step-mini__num {
        font-size: 24px;
        margin-bottom: 12px;
    }

    .lemesh-steps .lemesh-step-mini__icon {
        width: 56px;
        height: 56px;
        margin-bottom: 14px;
    }

    /* Portfolio: 1 per row, photo 260 */
    .lemesh-portfolio__grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .lemesh-portfolio-card {
        min-height: 0;
    }

    .lemesh-portfolio-card__image {
        height: 260px;
    }

    .lemesh-portfolio__footer .lemesh-btn {
        width: 100%;
    }

    .lemesh-lightbox__nav {
        width: 40px;
        height: 40px;
        font-size: 20px;
    }

    .lemesh-lightbox__nav--prev {
        left: 8px;
    }

    .lemesh-lightbox__nav--next {
        right: 8px;
    }

    /* Trust */
    .lemesh-trust {
        min-height: 0;
    }

    /* Materials: 1 per row, photo 280 */
    .lemesh-materials__gallery {
        grid-template-columns: 1fr;
    }

    .lemesh-materials__gallery img {
        height: 280px;
    }

    /* Manager: photo top, text below, full-width CTA */
    .lemesh-bottom__card {
        min-height: 0;
        padding: 24px;
    }

    .lemesh-bottom__card--manager {
        flex-direction: column;
        align-items: stretch;
        gap: 20px;
    }

    .lemesh-bottom__photo {
        width: 100%;
        height: 280px;
    }

    .lemesh-bottom__manager-text .lemesh-btn {
        width: 100%;
    }

    /* Callback form: 1 col, big fields */
    .lemesh-callback {
        min-height: 0;
    }

    .lemesh-callback__form {
        padding: 24px;
    }

    .lemesh-callback__form .lemesh-form {
        grid-template-columns: 1fr;
    }

    .lemesh-callback__form .lemesh-input {
        height: 56px;
    }

    .lemesh-callback__form .lemesh-btn {
        width: 100%;
    }

    .lemesh-callback__features {
        flex-direction: column;
        gap: 12px;
    }

    /* Footer */
    .lemesh-footer__inner {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 24px;
    }

    .lemesh-footer .lemesh-logo {
        justify-content: center;
    }

    .lemesh-footer__nav {
        flex-wrap: wrap;
        justify-content: center;
        gap: 14px 20px;
    }

    .lemesh-footer__contacts {
        align-items: center;
    }
}

/* Small mobile */
@media (max-width: 380px) {
    .lemesh-hero__title {
        font-size: 36px;
    }
}

/* --- v1.4.0 fix round 1: CTA two-line buttons, quiz option list (all widths) --- */
.lemesh-hero__cta .lemesh-btn {
    flex-direction: column;
    white-space: normal;
    line-height: 1.25;
    text-align: center;
    gap: 2px;
}

.lemesh-quiz__options {
    display: flex;
    flex-direction: column;
}

.lemesh-quiz__option {
    width: 100%;
}

/* --- v1.4.1-v1.4.3 desktop hero geometry: wide text column, big H1 (desktop only) --- */
@media (min-width: 1200px) {
    .lemesh-hero__grid {
        grid-template-columns: 27fr 23fr;
    }

    .lemesh-hero__content-inner {
        width: min(100%, 760px);
        max-width: 760px;
        margin-left: max(32px, calc((100vw - 1360px) / 2));
        padding-right: 24px;
    }

    .lemesh-hero__title {
        font-size: clamp(42px, 3.5vw, 64px);
    }
}

/* --- v1.4.5 fix: header fits calc(100% - 64px) container below 1440 --- */
@media (min-width: 768px) and (max-width: 1439px) {
    .lemesh-header__inner {
        gap: 12px;
    }

    .lemesh-logo__img {
        width: 104px;
    }

    .lemesh-logo__tagline {
        font-size: 10px;
        max-width: 140px;
    }

    .lemesh-nav--desktop {
        gap: 14px;
        min-width: 0;
    }

    .lemesh-nav--desktop a {
        font-size: 13px;
    }

    .lemesh-header__contacts {
        gap: 10px;
        flex-shrink: 0;
    }

    .lemesh-header__contacts .lemesh-phone {
        font-size: 15px;
    }

    .lemesh-header__contacts .lemesh-btn {
        padding: 0 14px;
        font-size: 13px;
    }
}

/* ============================================================
   v1.4.15: hero first-screen fit + header nowrap (client spec)
   ============================================================ */

/* Header: no menu wrapping, ~24px gaps on large desktop */
.lemesh-nav--desktop a {
    white-space: nowrap;
}

@media (min-width: 1440px) {
    .lemesh-nav--desktop {
        gap: 24px;
    }
}

/* Header trim near the 1440 breakpoint: nowrap items need a bit less */
@media (min-width: 1440px) and (max-width: 1499px) {
    .lemesh-nav--desktop {
        gap: 18px;
    }

    .lemesh-nav--desktop a {
        font-size: 14px;
    }

    .lemesh-header__contacts {
        gap: 12px;
    }

    .lemesh-header__contacts .lemesh-btn {
        padding: 0 16px;
    }
}

@media (min-width: 1200px) {
    /* Hero: exactly first screen minus header, clamped 620-700 */
    .lemesh-hero {
        height: calc(100vh - var(--header-height, 80px));
        min-height: 620px;
        max-height: 700px;
    }

    .lemesh-hero__grid {
        grid-template-columns: 52% 48%;
        height: 100%;
        min-height: 0;
        align-items: center;
    }

    .lemesh-hero__content {
        height: 100%;
        padding: 0;
        justify-content: center;
    }

    /* Text block: vertically centered, raised ~40px */
    .lemesh-hero__content-inner {
        position: relative;
        top: -40px;
        width: 100%;
        max-width: none;
        margin-left: max(24px, calc((100vw - 1600px) / 2));
        padding-right: 12px;
    }

    .lemesh-hero__title {
        font-size: clamp(44px, 3.4vw, 58px);
        line-height: 0.98;
        margin: 0;
    }

    .lemesh-hero__title span {
        white-space: nowrap;
    }

    .lemesh-hero__objects {
        font-size: 17px;
        max-width: 620px;
        margin: 22px 0 0;
    }

    .lemesh-hero__advantages {
        margin: 26px 0 0;
        gap: 12px 24px;
        flex-wrap: wrap;
    }

    .lemesh-hero__advantage {
        font-size: 15px;
        flex: 0 0 auto;
    }

    .lemesh-hero__cta {
        margin-top: 26px;
    }

    .lemesh-hero__cta .lemesh-btn {
        min-height: 54px;
    }

    /* Photo: fill hero height, focus on glazing, slim white blend */
    .lemesh-hero__visual,
    .lemesh-hero__visual img {
        height: 100%;
        min-height: 0;
        max-height: none;
    }

    .lemesh-hero__visual img {
        object-position: 50% 82%;
        transform: scale(1.05);
    }

    .lemesh-hero__visual::before {
        width: 120px;
    }
}

/* v1.4.18: mobile H1 must fit the word «фиксированной» on 320-430px screens */
@media (max-width: 767px) {
    .lemesh-hero__title {
        font-size: clamp(28px, 8.6vw, 40px);
    }
}

/* ===================================================================
   v1.4.18 — Quiz block redesign per client spec
   =================================================================== */

/* Grid 50/50, gap 30px; photo fills column height */
@media (min-width: 1025px) {
    .lemesh-quiz__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 30px;
    }

    .lemesh-quiz__visual img {
        height: 100%;
    }
}

/* H2: 3 lines, 34px on desktop (38px does not fit 50% column), tight leading */
.lemesh-quiz__form .lemesh-section__title {
    font-size: clamp(30px, 2.4vw, 34px);
    line-height: 1.05;
    margin: 0 0 12px;
}

/* Subtitle → progress: reduced gap */
.lemesh-quiz__form .lemesh-section__subtitle--small {
    margin: 0 0 10px;
}

/* Progress: connector line — gray track + blue progress */
.lemesh-quiz__progress {
    position: relative;
    margin-bottom: 20px;
}

.lemesh-quiz__progress::before,
.lemesh-quiz__progress::after {
    content: '';
    position: absolute;
    top: 21px;
    left: 12.5%;
    height: 2px;
    z-index: 0;
}

.lemesh-quiz__progress::before {
    width: 75%;
    background: #DCE4EC;
}

.lemesh-quiz__progress::after {
    width: var(--quiz-progress-w, 0%);
    background: var(--lemesh-blue);
    transition: width var(--lemesh-transition);
}

.lemesh-quiz__progress-step {
    position: relative;
    z-index: 1;
}

/* Future steps: light-gray circles */
.lemesh-quiz__progress-step span {
    border-color: #C9D4E0;
    color: #9AA7B5;
}

.lemesh-quiz__progress-step small {
    color: #6B7280;
}

.lemesh-quiz__progress-step.is-active span {
    background: var(--lemesh-blue);
    border-color: var(--lemesh-blue);
    color: var(--lemesh-white);
}

.lemesh-quiz__progress-step.is-completed span {
    background: var(--lemesh-blue-dark);
    border-color: var(--lemesh-blue-dark);
    color: var(--lemesh-white);
}

.lemesh-quiz__progress-step.is-active small {
    color: var(--lemesh-blue);
}

/* Options: 50px min, 15px type, 14/18 padding, 12px radius */
.lemesh-quiz__option {
    position: relative;
    min-height: 50px;
    padding: 14px 44px 14px 18px;
    font-size: 15px;
    border-radius: 12px;
    border: 2px solid var(--lemesh-border);
    box-shadow: none;
}

.lemesh-quiz__option:hover {
    background: var(--lemesh-white);
    border-color: var(--lemesh-blue);
    color: var(--lemesh-dark);
    box-shadow: 0 4px 14px rgba(0, 87, 184, 0.14);
}

/* Selected: light-blue bg, 2px brand border, check on the right */
.lemesh-quiz__option--selected {
    background: var(--lemesh-blue-light);
    border-color: var(--lemesh-blue);
    color: var(--lemesh-dark);
    box-shadow: none;
}

.lemesh-quiz__option--selected::after {
    content: '\2713';
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    font-weight: 700;
    color: var(--lemesh-blue);
}

/* Next button: 54–56px height */
.lemesh-quiz__next {
    min-height: 55px;
}

/* Result card: bottom-left corner of the photo */
.lemesh-quiz__result-card {
    top: auto;
    bottom: 34px;
    left: 34px;
    transform: none;
    width: 320px;
    padding: 24px;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 10px 30px rgba(10, 30, 60, 0.16);
}

.lemesh-quiz__result-card ul {
    font-size: 15px;
}

/* Mobile: quiz first, photo below, card as separate block under image */
@media (max-width: 767px) {
    .lemesh-quiz__visual {
        display: block;
        order: 0;
        min-height: 0;
        overflow: visible;
        border-radius: 0;
    }

    .lemesh-quiz__visual img {
        display: block;
        height: 260px;
        min-height: 0;
        max-height: none;
        border-radius: 16px;
    }

    .lemesh-quiz__result-card {
        position: static;
        width: 100%;
        margin-top: 16px;
        padding: 20px;
        background: var(--lemesh-white);
        box-shadow: 0 6px 20px rgba(10, 30, 60, 0.1);
    }

    .lemesh-quiz__next {
        min-height: 54px;
        width: 100%;
    }
}

/* ===================================================================
   v1.4.22 — Quiz fit & visual polish (client spec)
   - whole block fits 1440x900 and 1366x768 (no fixed excess heights)
   - progress line behind opaque circles, blue up to current step
   - explicit option states: empty circle / blue check / hover
   - form card: +8px top inner padding, trimmed elsewhere
   =================================================================== */

/* Section: trim vertical padding (was 88px) */
.lemesh-quiz {
    padding: 30px 0;
}

/* Unselected option: empty radio circle on the right */
.lemesh-quiz__option::after {
    content: '';
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    border: 2px solid #C9D4E0;
    border-radius: 50%;
    background: var(--lemesh-white);
    transition: border-color var(--lemesh-transition);
}

.lemesh-quiz__option:hover::after {
    border-color: var(--lemesh-blue);
}

/* Selected option: blue check replaces the circle */
.lemesh-quiz__option--selected::after {
    content: '\2713';
    width: auto;
    height: auto;
    border: none;
    border-radius: 0;
    background: none;
    font-size: 18px;
    font-weight: 700;
    color: var(--lemesh-blue);
}

/* Progress: circles stay opaque so the connector never shows through */
.lemesh-quiz__progress-step span {
    background: var(--lemesh-white);
}

.lemesh-quiz__progress-step.is-active span {
    background: var(--lemesh-blue);
}

.lemesh-quiz__progress-step.is-completed span {
    background: var(--lemesh-blue-dark);
}

/* Desktop: content-driven heights, columns end at the same level */
@media (min-width: 1025px) {
    .lemesh-quiz__form {
        min-height: 0;
        padding: 48px 32px 24px; /* top +8px vs before, rest trimmed */
    }

    .lemesh-quiz__visual,
    .lemesh-quiz__visual img {
        min-height: 420px; /* was 460px fixed */
    }

    .lemesh-quiz__form .lemesh-section__title {
        margin-bottom: 10px;
    }

    .lemesh-quiz__form .lemesh-section__subtitle--small {
        margin-bottom: 8px;
    }

    .lemesh-quiz__progress {
        margin-bottom: 12px;
    }

    .lemesh-quiz__question {
        margin-bottom: 12px;
    }

    .lemesh-quiz__options {
        gap: 8px;
    }

    .lemesh-quiz__option {
        min-height: 46px;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .lemesh-quiz__nav {
        margin-top: 14px;
    }

    .lemesh-quiz__next {
        min-height: 52px;
    }
}

/* 1025–1439 (e.g. 1366x768): tighter rhythm so the full block fits */
@media (min-width: 1025px) and (max-width: 1439px) {
    .lemesh-quiz {
        padding: 16px 0;
    }

    .lemesh-quiz__form {
        padding: 32px 26px 18px;
    }

    .lemesh-quiz__form .lemesh-section__title {
        margin-bottom: 8px;
        line-height: 1.02;
    }

    .lemesh-quiz__form .lemesh-section__subtitle--small {
        font-size: 15px;
        margin-top: 6px;
        margin-bottom: 4px;
    }

    .lemesh-quiz__progress {
        margin-bottom: 6px;
    }

    .lemesh-quiz__progress-step span {
        width: 36px;
        height: 36px;
    }

    .lemesh-quiz__progress::before,
    .lemesh-quiz__progress::after {
        top: 18px;
    }

    .lemesh-quiz__progress-step small {
        font-size: 12px;
    }

    .lemesh-quiz__counter {
        margin-bottom: 4px;
    }

    .lemesh-quiz__question {
        font-size: 18px;
        margin-bottom: 8px;
    }

    .lemesh-quiz__options {
        gap: 7px;
    }

    .lemesh-quiz__option {
        min-height: 42px;
        padding-top: 9px;
        padding-bottom: 9px;
        font-size: 14px;
    }

    .lemesh-quiz__nav {
        margin-top: 10px;
    }

    .lemesh-quiz__next {
        min-height: 48px;
    }

    .lemesh-quiz__back {
        min-height: 48px;
    }

    .lemesh-quiz__visual,
    .lemesh-quiz__visual img {
        min-height: 340px;
    }

    .lemesh-quiz__result-card {
        bottom: 40px; /* was 20px (< 32): raised per client spec */
        left: 20px;
        padding: 18px;
    }
}

/* ===================================================================
   v1.4.24 — Hero final visual polish (client spec)
   =================================================================== */

/* CTA buttons are single-line again (no second lines) */
.lemesh-hero__cta .lemesh-btn {
    flex-direction: row;
    white-space: nowrap;
}

.lemesh-hero__cta-note {
    margin: 12px 0 0;
    font-size: 13px;
    line-height: 1.4;
    color: var(--lemesh-gray);
}

@media (min-width: 1200px) {
    /* Columns: text 54 / photo 46 */
    .lemesh-hero__grid {
        grid-template-columns: 54% 46%;
    }

    /* Height: 620–720, still capped to the first screen */
    .lemesh-hero {
        min-height: 620px;
        max-height: 720px;
    }

    /* Title: same size, airier leading, blue lines slightly less heavy */
    .lemesh-hero__title {
        line-height: 1.02;
    }

    /* Subtitle: 18px / 1.5 / 620px, a bit darker */
    .lemesh-hero__objects {
        font-size: 18px;
        line-height: 1.5;
        max-width: 620px;
        color: #4B5563;
    }

    /* Advantages: one row, 3 columns, never under the photo */
    .lemesh-hero__advantages {
        flex-wrap: nowrap;
        gap: 20px;
        max-width: 720px;
    }

    .lemesh-hero__advantage {
        flex: 1 1 0;
    }

    /* Photo: crop off the construction bottom, keep fronton + windows */
    .lemesh-hero__visual img {
        object-position: 50% 40%;
        transform: scale(1.04);
    }

    /* White blend: slimmer and softer */
    .lemesh-hero__visual::before {
        width: 90px;
        background: linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0.55) 30%, rgba(255, 255, 255, 0.12) 65%, rgba(255, 255, 255, 0) 100%);
    }
}

@media (max-width: 767px) {
    .lemesh-hero__cta-note {
        text-align: center;
    }

    /* Mobile strip: frame the glazing, not the roof */
    .lemesh-hero__visual img {
        object-position: 50% 55%;
    }
}

/* 1025–1439: keep hero + real header within the first screen (e.g. 1366x768) */
@media (min-width: 1025px) and (max-width: 1439px) {
    .lemesh-hero {
        max-height: calc(100vh - 100px);
    }
}

/* CTA note: larger, higher contrast */
.lemesh-hero__cta-note {
    font-size: 14px;
    color: #4B5563;
}

/* Gradient blend removed: 50px still read as a white stripe on the sky */
@media (min-width: 1025px) {
    .lemesh-hero__visual::before {
        display: none;
    }
}

@media (max-width: 767px) {
    /* Subtitle must stay visible on mobile: shortened version */
    .lemesh-hero__objects {
        display: block;
        font-size: 16px;
        line-height: 1.45;
        margin: 18px 0 20px;
        max-width: 100%;
    }
}

/* ===================================================================
   v1.4.27 — Final TZ: anchors, hero gradient, forms, popup, goals
   =================================================================== */

/* Anchor offset: sticky header must not cover section titles */
.lemesh-landing section[id] {
    scroll-margin-top: 100px;
}

.lemesh-hero#hero {
    scroll-margin-top: 0;
}

/* Hero blend: minimal 50px soft gradient (no white stripe) */
@media (min-width: 1025px) {
    .lemesh-hero__visual::before {
        display: block;
        width: 50px;
        background: linear-gradient(90deg, rgba(255, 255, 255, 0.45) 0%, rgba(255, 255, 255, 0.12) 45%, rgba(255, 255, 255, 0) 100%);
    }
}

/* Callback advantages: vertical list */
.lemesh-callback__features {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}

.lemesh-callback__feature {
    font-size: 15px;
}

/* Final form: heading inside the card */
.lemesh-form__title {
    font-size: 22px;
    font-weight: 800;
    margin: 0 0 4px;
    color: var(--lemesh-dark);
}

.lemesh-form__subtitle {
    font-size: 14px;
    line-height: 1.45;
    color: #4B5563;
    margin: 0 0 16px;
}

/* Quiz final step: compact stacked form (name, phone, comment, consent) */
.lemesh-form--quiz-final {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.lemesh-form--quiz-final .lemesh-input {
    min-height: 48px;
}

.lemesh-form--quiz-final textarea.lemesh-input {
    min-height: 56px;
    resize: vertical;
}

.lemesh-form--quiz-final .lemesh-form__checkbox {
    margin: 2px 0 4px;
}

.lemesh-form--quiz-final .lemesh-btn {
    min-height: 52px;
}

/* Checklist popup */
.lemesh-popup {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.lemesh-popup[hidden] {
    display: none;
}

.lemesh-popup__overlay {
    position: absolute;
    inset: 0;
    background: rgba(17, 24, 39, 0.55);
}

.lemesh-popup__dialog {
    position: relative;
    background: var(--lemesh-white);
    border-radius: 14px;
    padding: 28px 30px;
    max-width: 460px;
    width: 100%;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
}

.lemesh-popup__dialog h3 {
    margin: 0 0 16px;
    font-size: 20px;
    font-weight: 800;
    color: var(--lemesh-dark);
}

.lemesh-popup__close {
    position: absolute;
    top: 8px;
    right: 12px;
    width: 44px;
    height: 44px;
    border: none;
    background: none;
    font-size: 26px;
    line-height: 1;
    color: #6B7280;
    cursor: pointer;
}

.lemesh-popup__close:hover {
    color: var(--lemesh-dark);
}

/* Quiz fit after final TZ: step 4 has 6 options, final step has 4 fields */
@media (min-width: 1025px) {
    .lemesh-quiz__step[data-step="4"] .lemesh-quiz__option {
        min-height: 40px;
        padding-top: 9px;
        padding-bottom: 9px;
    }

    .lemesh-quiz__step[data-step="4"] .lemesh-quiz__options {
        gap: 6px;
    }

    .lemesh-quiz__step[data-step="4"] .lemesh-quiz__nav {
        margin-top: 10px;
    }

    .lemesh-quiz__step--final .lemesh-quiz__question {
        margin-bottom: 8px;
    }

    .lemesh-quiz__step--final .lemesh-form--quiz-final {
        gap: 6px;
    }

    .lemesh-quiz__step--final textarea.lemesh-input {
        min-height: 50px;
    }

    .lemesh-quiz__step--final .lemesh-quiz__back {
        margin-top: 8px;
    }
}

@media (min-width: 1025px) and (max-width: 1439px) {
    .lemesh-quiz__step[data-step="4"] .lemesh-quiz__option {
        min-height: 36px;
        padding-top: 7px;
        padding-bottom: 7px;
        font-size: 14px;
    }

    .lemesh-quiz__step[data-step="4"] .lemesh-quiz__options {
        gap: 5px;
    }

    .lemesh-form--quiz-final {
        gap: 4px;
    }

    .lemesh-form--quiz-final .lemesh-input {
        min-height: 40px;
    }

    .lemesh-form--quiz-final textarea.lemesh-input {
        min-height: 40px;
    }

    .lemesh-form--quiz-final .lemesh-btn {
        min-height: 44px;
    }

    .lemesh-quiz__step--final .lemesh-quiz__question {
        margin-bottom: 6px;
    }
}

/* 1366 band: final-step micro-fit */
@media (min-width: 1025px) and (max-width: 1439px) {
    .lemesh-form--quiz-final .lemesh-input {
        min-height: 38px;
    }

    .lemesh-form--quiz-final textarea.lemesh-input {
        min-height: 36px;
    }

    .lemesh-form--quiz-final .lemesh-btn {
        min-height: 42px;
    }

    .lemesh-quiz__step--final .lemesh-form__checkbox span {
        font-size: 11px;
        line-height: 1.3;
    }

    .lemesh-quiz__step--final .lemesh-quiz__back {
        margin-top: 4px;
    }
}

/* Portfolio: meta removed per final TZ — drop the fixed card height */
.lemesh-portfolio-card {
    min-height: 0;
}

.lemesh-portfolio-card__body h3 {
    margin-bottom: 0;
}

/* Popup sits on a light dialog: force dark checklist styling */
.lemesh-popup__dialog .lemesh-checklist--light li {
    color: var(--lemesh-dark);
}

.lemesh-popup__dialog .lemesh-checklist--light li::before {
    background: var(--lemesh-blue-light);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%230057B8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}

/* Mobile tap targets: burger, mobile menu, footer links */
@media (max-width: 767px) {
    .lemesh-burger {
        width: 44px;
        height: 44px;
    }

    .lemesh-mobile-menu nav a {
        min-height: 48px;
        display: flex;
        align-items: center;
        padding: 12px 0;
    }

    .lemesh-mobile-menu nav a.lemesh-btn {
        justify-content: center;
        margin-top: 8px;
    }

    .lemesh-footer__nav a {
        display: inline-block;
        padding: 10px 0;
    }
}

/* Tablet 768–991: single column for services / steps / portfolio (TZ §18) */
@media (min-width: 768px) and (max-width: 991px) {
    .lemesh-services__grid,
    .lemesh-portfolio__grid {
        grid-template-columns: 1fr;
    }

    .lemesh-steps-line,
    .lemesh-steps .lemesh-steps-line {
        grid-template-columns: 1fr;
    }

    .lemesh-portfolio-card {
        min-height: 0;
    }
}

/* A11y: footer tagline contrast on dark background */
.lemesh-footer .lemesh-logo__tagline {
    color: rgba(255, 255, 255, 0.75);
}

/* ===================================================================
   v1.4.28 — Final refinement TZ (msg 390)
   Containers 1240/1440, typography floor 13px, header 88px +
   burger <=1150, hero gradient 48px, section metrics, reviews
   section, materials text blocks, mobile <=767 pass.
   =================================================================== */

:root {
    --container-main: 1240px;
    --container-wide: 1440px;
    --section-x: 32px;
}

/* ---------- 1. Containers ---------- */
.lemesh-container {
    width: calc(100% - 64px);
    max-width: var(--container-main);
}

.lemesh-header .lemesh-container {
    width: calc(100% - 48px);
    max-width: var(--container-wide);
}

/* ---------- 2. Typography base ---------- */
body {
    font-size: 16px;
    line-height: 1.5;
}

.lemesh-section__title {
    font-size: clamp(32px, 2.6vw, 42px);
    line-height: 1.1;
}

/* Desktop: no text below 13px (footer legal excluded) */
@media (min-width: 768px) {.lemesh-quiz__progress-step small,
.lemesh-quiz__counter,
.lemesh-quiz__back,
.lemesh-form__checkbox,
.lemesh-form__checkbox span,
.lemesh-step-mini p
    {
        font-size: 13px;
    }
}

/* ---------- 3. Header (desktop >=1151) ---------- */
@media (min-width: 1151px) {
    :root {
        --header-height: 88px;
    }

    .lemesh-header__inner {
        min-height: 88px;
    }

    .lemesh-logo__img {
        width: 118px;
        height: 84px;
        object-fit: contain;
    }

    .lemesh-logo__tagline {
        font-size: 13px;
        line-height: 1.25;
        max-width: 190px;
    }

    .lemesh-nav--desktop {
        gap: 26px;
        flex-wrap: nowrap;
    }

    .lemesh-nav--desktop a {
        font-size: 15px;
        white-space: nowrap;
    }

    .lemesh-header__contacts .lemesh-phone {
        font-size: 18px;
        font-weight: 700;
        white-space: nowrap;
    }

    .lemesh-header__contacts .lemesh-btn {
        min-height: 48px;
        height: 48px;
        padding: 0 24px;
        font-size: 15px;
        box-sizing: border-box;
    }
}

/* Burger switch moves to <=1150 (was <=1199) */
@media (min-width: 1151px) and (max-width: 1199px) {
    .lemesh-nav--desktop {
        display: flex;
    }

    .lemesh-header__contacts {
        display: flex;
    }

    .lemesh-burger {
        display: none;
    }
}

/* ---------- 4. Hero ---------- */
@media (min-width: 1025px) {
    .lemesh-hero {
        min-height: 620px;
        max-height: 700px;
    }

    .lemesh-hero__grid {
        grid-template-columns: 54fr 46fr;
        min-height: 620px;
        max-height: 700px;
    }

    .lemesh-hero__content-inner {
        width: min(100%, 640px);
        max-width: 640px;
        margin-left: max(24px, calc((100vw - var(--container-wide)) / 2));
        padding-right: 44px;
    }

    .lemesh-hero__title {
        font-size: clamp(44px, 4vw, 64px);
        line-height: 1.02;
        letter-spacing: -0.02em;
        margin: 0;
    }

    .lemesh-hero__objects {
        font-size: 18px;
        line-height: 1.5;
        max-width: 620px;
        margin: 24px 0 0;
    }

    .lemesh-hero__advantages {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
        margin: 28px 0 0;
        max-width: 620px;
    }

    .lemesh-hero__advantage {
        font-size: 15px;
    }

    .lemesh-hero__cta {
        margin-top: 28px;
    }

    .lemesh-hero__cta .lemesh-btn {
        min-height: 54px;
        height: 54px;
        font-size: 16px;
        padding: 0 28px;
        box-sizing: border-box;
    }

    /* Gradient blend restored: 48px */
    .lemesh-hero__visual::before {
        display: block;
        width: 48px;
        background: linear-gradient(90deg, rgba(255, 255, 255, 0.45) 0%, rgba(255, 255, 255, 0.12) 45%, rgba(255, 255, 255, 0) 100%);
    }

    .lemesh-hero__visual,
    .lemesh-hero__visual img {
        min-height: 620px;
        max-height: 700px;
    }
}

/* ---------- 5. Quiz ---------- */
@media (min-width: 1025px) {
    .lemesh-quiz {
        padding: 80px 0;
    }

    .lemesh-quiz__grid {
        grid-template-columns: 1fr 1fr;
        gap: 30px;
        align-items: stretch;
    }

    .lemesh-quiz__form,
    .lemesh-quiz__visual {
        min-height: 660px;
    }

    .lemesh-quiz__form {
        padding: 38px;
        border-radius: 20px;
    }

    .lemesh-quiz__form .lemesh-section__title {
        font-size: 34px;
        line-height: 1.05;
    }

    .lemesh-quiz__option {
        min-height: 52px;
        padding: 12px 44px 12px 18px;
        font-size: 15px;
        border-radius: 11px;
        background: #fff;
        border: 1px solid #d8dee8;
    }

    .lemesh-quiz__option--selected {
        background: #eaf4ff;
        border: 2px solid #0865c7;
        color: var(--lemesh-dark);
        box-shadow: none;
        padding: 11px 43px 11px 17px;
    }

    .lemesh-quiz__option--selected::after {
        color: #0865c7;
    }

    .lemesh-quiz__result-card {
        top: auto;
        transform: none;
        left: 32px;
        bottom: 32px;
        width: 330px;
        padding: 24px;
    }
}

/* ---------- 6. Services ---------- */
@media (min-width: 1025px) {
    .lemesh-services__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

    .lemesh-service-card {
        min-height: 390px;
        border-radius: 16px;
    }

    .lemesh-service-card__image img {
        height: 220px;
    }

    .lemesh-service-card__body {
        padding: 22px;
    }

    .lemesh-service-card h3 {
        font-size: 19px;
        line-height: 1.25;
        min-height: 48px;
    }

    .lemesh-service-card p {
        font-size: 15px;
        line-height: 1.4;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

/* ---------- 7. Includes ---------- */
@media (min-width: 1025px) {
    .lemesh-includes {
        padding: 64px 0;
    }

    .lemesh-includes .lemesh-section__title {
        font-size: 36px;
        margin-bottom: 34px;
    }

    .lemesh-includes .lemesh-checklist--two-col {
        column-gap: 90px;
        row-gap: 18px;
    }

    .lemesh-includes .lemesh-checklist li {
        font-size: 16px;
    }

    .lemesh-includes__note {
        max-width: 1040px;
        margin: 32px auto 0;
        padding: 20px 26px;
        font-size: 16px;
    }
}

/* ---------- 8. Steps ---------- */
@media (min-width: 1025px) {
    .lemesh-steps {
        padding: 76px 0;
    }

    .lemesh-steps .lemesh-steps-line {
        grid-template-columns: repeat(5, 1fr);
        gap: 18px;
    }

    .lemesh-step-mini {
        min-height: 220px;
        padding: 26px 20px;
    }

    .lemesh-step-mini__num {
        font-size: 27px;
    }

    /* Arrow strictly inside the 18px gap: 14px wide, offset 16px */
    .lemesh-steps .lemesh-step-mini:not(:last-child)::after {
        right: -16px;
        width: 14px;
    }

    .lemesh-steps .lemesh-step-mini__icon {
        width: 58px;
        height: 58px;
    }

    .lemesh-step-mini h3 {
        font-size: 18px;
    }

    .lemesh-step-mini p {
        font-size: 14px;
        line-height: 1.4;
    }
}

/* ---------- 9. Portfolio ---------- */
@media (min-width: 1025px) {
    .lemesh-portfolio {
        padding: 88px 0;
    }

    .lemesh-portfolio__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 26px;
    }

    .lemesh-portfolio-card {
        min-height: 500px;
        border-radius: 17px;
    }

    .lemesh-portfolio-card__image img {
        height: 290px;
    }

    .lemesh-portfolio-card__body {
        padding: 24px;
    }

    .lemesh-portfolio-card__body h3 {
        font-size: 20px;
    }

    .lemesh-portfolio-card__body p {
        font-size: 15px;
        line-height: 1.5;
    }

    .lemesh-portfolio__footer .lemesh-btn {
        min-height: 50px;
        font-size: 15px;
        margin-top: 32px;
    }
}

/* ---------- 10. Trust ---------- */
@media (min-width: 1025px) {
    .lemesh-trust {
        padding: 72px 0;
    }

    .lemesh-trust .lemesh-checklist li {
        font-size: 15px;
    }

    .lemesh-trust .lemesh-checklist {
        row-gap: 18px;
    }
}

/* ---------- 11. Materials ---------- */
@media (min-width: 1025px) {
    .lemesh-materials {
        padding: 78px 0;
    }

    .lemesh-materials .lemesh-section__title {
        text-transform: uppercase;
    }

    .lemesh-materials__gallery {
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

    .lemesh-materials__gallery img {
        height: 300px;
    }

    .lemesh-materials__gallery figcaption {
        position: static;
        background: none;
        padding: 16px 4px 0;
        display: flex;
        flex-direction: column;
        gap: 6px;
        text-align: left;
    }

    .lemesh-materials__card-title {
        font-size: 18px;
        font-weight: 700;
        color: var(--lemesh-dark);
    }

    .lemesh-materials__card-desc {
        font-size: 14px;
        line-height: 1.4;
        color: var(--lemesh-gray);
    }
}

/* ---------- 12. Manager + guarantees ---------- */
@media (min-width: 1025px) {
    .lemesh-bottom {
        padding: 76px 0;
    }

    .lemesh-bottom__grid {
        grid-template-columns: 56fr 44fr;
        gap: 26px;
    }

    .lemesh-bottom__card {
        min-height: 400px;
        padding: 30px;
    }

    .lemesh-bottom__photo {
        width: 230px;
        height: 310px;
    }

    .lemesh-bottom__manager-text h3 {
        font-size: 25px;
    }

    .lemesh-bottom__quote {
        font-size: 16px;
        line-height: 1.5;
    }

    .lemesh-bottom__card--guarantees {
        padding: 30px;
    }

    .lemesh-bottom__guarantees-list {
        gap: 17px;
    }

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

/* ---------- 13. Reviews (draft block) ---------- */
.lemesh-reviews {
    padding: 76px 0;
    background: #F7F9FC;
}

.lemesh-reviews__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.lemesh-reviews .lemesh-review-card {
    min-height: 300px;
    padding: 26px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid var(--lemesh-border);
    box-shadow: 0 6px 20px rgba(10, 30, 60, 0.06);
}

.lemesh-review-card__quote {
    display: block;
    color: var(--lemesh-blue);
    opacity: 0.3;
}

.lemesh-review-card__quote svg {
    width: 34px;
    height: 34px;
}

.lemesh-review-card__object {
    font-size: 14px;
    font-weight: 700;
    color: #0865c7;
    margin: 14px 0 10px;
    line-height: 1.3;
}

.lemesh-reviews .lemesh-review-card__text {
    font-size: 15px;
    line-height: 1.55;
    color: var(--lemesh-dark);
    margin: 0;
}

/* ---------- 14. Final form ---------- */
@media (min-width: 1025px) {
    .lemesh-callback {
        padding: 88px 0;
    }

    .lemesh-callback__grid {
        grid-template-columns: 42fr 58fr;
        gap: 48px;
        align-items: center;
    }

    .lemesh-callback .lemesh-section__title {
        font-size: 44px;
        line-height: 1.05;
    }

    .lemesh-callback__form {
        padding: 34px;
        max-width: 680px;
    }

    .lemesh-callback .lemesh-form input {
        height: 54px;
    }

    .lemesh-callback .lemesh-form textarea {
        min-height: 110px;
    }

    .lemesh-callback .lemesh-form .lemesh-btn {
        min-height: 56px;
        font-size: 16px;
    }
}

/* ---------- 15. Mobile <=767 ---------- */
@media (max-width: 767px) {
    .lemesh-container {
        width: calc(100% - 40px);
    }

    body {
        font-size: 16px;
    }

    .lemesh-hero__title {
        font-size: 39px;
    }

    .lemesh-section__title {
        font-size: 31px;
    }

    .lemesh-section,
    .lemesh-quiz,
    .lemesh-includes,
    .lemesh-steps,
    .lemesh-portfolio,
    .lemesh-trust,
    .lemesh-materials,
    .lemesh-bottom,
    .lemesh-reviews,
    .lemesh-callback {
        padding: 52px 0;
    }.lemesh-services__grid,
.lemesh-portfolio__grid,
.lemesh-reviews__grid,
.lemesh-materials__gallery,
.lemesh-bottom__grid,
.lemesh-callback__grid,
.lemesh-quiz__grid
    {
        grid-template-columns: 1fr;
    }

    .lemesh-hero__advantages {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .lemesh-quiz__form,
    .lemesh-quiz__visual {
        min-height: 0;
    }

    .lemesh-reviews {
        padding: 52px 0;
    }
}

/* v1.4.28 header fit bands: no text shrink — tagline hides, gaps flex */
@media (min-width: 1151px) and (max-width: 1439px) {
    .lemesh-logo__tagline {
        display: none;
    }

    .lemesh-header__inner {
        gap: 12px;
    }
}

@media (min-width: 1440px) {
    .lemesh-header__inner {
        gap: 10px;
    }
}

@media (min-width: 1151px) and (max-width: 1279px) {
    .lemesh-nav--desktop {
        gap: 14px;
    }

    .lemesh-header__inner {
        gap: 8px;
    }
}/* v1.4.28 title leak fix: legacy global rule forced 18px/uppercase on
   section titles. TZ: h2 clamp(32,2.6vw,42)/1.1, uppercase only materials. */
.lemesh-services .lemesh-section__title,
.lemesh-includes .lemesh-section__title,
.lemesh-steps .lemesh-section__title,
.lemesh-portfolio .lemesh-section__title
    {
    text-transform: none;
}

.lemesh-services .lemesh-section__title {
    font-size: clamp(32px, 2.6vw, 42px);
    line-height: 1.1;
}

@media (max-width: 767px) {
    .lemesh-services .lemesh-section__title,
    .lemesh-includes .lemesh-section__title,
    .lemesh-steps .lemesh-section__title,
    .lemesh-portfolio .lemesh-section__title,
    .lemesh-materials .lemesh-section__title,
    .lemesh-reviews .lemesh-section__title {
        font-size: 31px;
    }
}

/* ===================================================================
   v1.4.29 — Post-review fixes (client msg: 12 пунктов)
   Logo fit, quiz reset/disabled-next, title case, includes/steps/
   portfolio/bottom/callback tweaks, reviews draft plaque + hide flag.
   =================================================================== */

/* ---------- 2. Header logo: height-driven, never exceeds header ---------- */
.lemesh-logo__img {
    width: auto;
    height: 48px;
    max-width: 118px;
    object-fit: contain;
}

@media (min-width: 1151px) {
    .lemesh-logo__img {
        height: 72px;
    }
}

/* ---------- 3. Quiz: «Далее» inactive until an answer is chosen ---------- */
.lemesh-quiz__next:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    box-shadow: none;
}

/* ---------- 4. Section titles: normal case; caps only hero + final CTA ---------- */
.lemesh-section__title,
.lemesh-materials .lemesh-section__title,
.lemesh-bottom__card h3 {
    text-transform: none;
}

.lemesh-callback__content .lemesh-section__title {
    text-transform: uppercase;
}

/* ---------- 5. Includes: slightly larger, exact client values ---------- */
.lemesh-includes .lemesh-section__title {
    font-size: 34px;
}

.lemesh-includes .lemesh-checklist li {
    font-size: 15px;
    line-height: 1.45;
}

.lemesh-includes .lemesh-checklist--two-col {
    row-gap: 14px;
}

.lemesh-includes__note {
    font-size: 15px;
}

/* ---------- 6. Steps: exact card metrics ---------- */
@media (min-width: 1025px) {
    .lemesh-steps .lemesh-step-mini {
        min-height: 240px;
        padding: 24px 18px;
    }

    .lemesh-steps .lemesh-step-mini__num {
        font-size: 24px;
    }

    .lemesh-steps .lemesh-step-mini h3 {
        font-size: 17px;
    }

    .lemesh-steps .lemesh-step-mini p {
        font-size: 14px;
        line-height: 1.45;
    }
}

/* <=1200px: 3 cards on row 1, 2 centered on row 2 (6-col span trick) */
@media (min-width: 1025px) and (max-width: 1200px) {
    .lemesh-steps .lemesh-steps-line {
        grid-template-columns: repeat(6, 1fr);
    }

    .lemesh-steps .lemesh-step-mini {
        grid-column: span 2;
    }

    .lemesh-steps .lemesh-step-mini:nth-child(4) {
        grid-column: 2 / 4;
    }

    .lemesh-steps .lemesh-step-mini:nth-child(5) {
        grid-column: 4 / 6;
    }

    .lemesh-steps .lemesh-step-mini:nth-child(3)::after,
    .lemesh-steps .lemesh-step-mini:nth-child(5)::after {
        display: none;
    }
}

/* 1201–1279: 5 in a row — restore card-3 arrow hidden by legacy <=1279 rule */
@media (min-width: 1201px) and (max-width: 1279px) {
    .lemesh-steps .lemesh-step-mini:nth-child(3)::after {
        display: block;
    }
}

/* ---------- 7. Portfolio: content-height cards + confirmed meta ---------- */
.lemesh-portfolio-card {
    min-height: 0;
}

.lemesh-portfolio-card__meta {
    list-style: none;
    margin: 12px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.lemesh-portfolio-card__meta li {
    font-size: 15px;
    line-height: 1.45;
    color: var(--lemesh-gray);
}

.lemesh-portfolio-card__meta strong {
    color: var(--lemesh-dark);
    font-weight: 600;
}

/* ---------- 8. Manager + guarantees: 58/42 ---------- */
@media (min-width: 1025px) {
    .lemesh-bottom__grid {
        grid-template-columns: 58fr 42fr;
    }

    .lemesh-bottom__photo {
        width: 245px;
        height: 320px;
    }

    .lemesh-bottom__quote {
        font-size: 16px;
        line-height: 1.5;
    }

    .lemesh-bottom__manager-text .lemesh-btn {
        min-height: 48px;
    }
}

/* ---------- 10. Final CTA: stronger form ---------- */
@media (min-width: 1025px) {
    .lemesh-callback__form {
        width: 100%;
        max-width: 700px;
        padding: 36px;
    }

    .lemesh-callback__form h3 {
        font-size: 26px;
    }

    .lemesh-callback .lemesh-form input,
    .lemesh-callback .lemesh-form select {
        height: 54px;
        font-size: 15px;
    }

    .lemesh-callback .lemesh-form textarea {
        min-height: 120px;
        font-size: 15px;
    }

    .lemesh-callback .lemesh-section__title {
        font-size: clamp(40px, 3vw, 44px);
        line-height: 1.05;
    }
}

/* ==========================================================================
   v1.4.30 — marketing pass: trust strip, cost section, FAQ accordion,
   manager facts, form note, mobile section order for new sections.
   No changes to existing section sizes.
   ========================================================================== */

/* Trust strip before quiz */
.lemesh-assurance {
    padding: 40px 0;
    background: #f4f8fd;
}

/* Cost section */
.lemesh-cost__factors {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    margin: 0 0 28px;
    padding: 0;
    list-style: none;
}

.lemesh-cost__factors li {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 22px 20px;
    background: #fff;
    border: 1px solid var(--lemesh-border, #e5e7eb);
    border-radius: 14px;
    font-size: 15px;
    line-height: 1.45;
    font-weight: 600;
    color: var(--lemesh-text, #1a2733);
}

.lemesh-cost__factor-icon {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: #eaf4ff;
    color: var(--lemesh-blue, #0865c7);
}

.lemesh-cost__levels {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-bottom: 22px;
}

.lemesh-cost__level {
    padding: 24px 22px;
    background: #fff;
    border: 1px solid var(--lemesh-border, #e5e7eb);
    border-radius: 14px;
}

.lemesh-cost__level h3 {
    margin: 0 0 8px;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 700;
    color: var(--lemesh-text, #1a2733);
}

.lemesh-cost__level p {
    margin: 0;
    font-size: 14px;
    line-height: 1.55;
    color: #5a6b7d;
}

.lemesh-cost__note {
    margin: 0;
    padding: 16px 20px;
    background: #fff8ec;
    border: 1px solid #fde68a;
    border-radius: 12px;
    font-size: 15px;
    line-height: 1.5;
    color: #7c5a10;
    text-align: center;
}

/* Manager facts list */
.lemesh-bottom__facts {
    margin: 0 0 18px;
    padding: 0;
    list-style: none;
}

.lemesh-bottom__facts li {
    position: relative;
    padding-left: 24px;
    margin-bottom: 8px;
    font-size: 14px;
    line-height: 1.45;
    color: var(--lemesh-text, #1a2733);
}

.lemesh-bottom__facts li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 5px;
    width: 14px;
    height: 14px;
    background: var(--lemesh-blue, #0865c7);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* FAQ accordion (native details, all closed by default) */
.lemesh-faq__list {
    max-width: 860px;
    margin: 0 auto;
}

.lemesh-faq__item {
    background: #fff;
    border: 1px solid var(--lemesh-border, #e5e7eb);
    border-radius: 12px;
    margin-bottom: 12px;
    overflow: hidden;
}

.lemesh-faq__item[open] {
    border-color: var(--lemesh-blue, #0865c7);
}

.lemesh-faq__question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 22px;
    font-size: 16px;
    line-height: 1.4;
    font-weight: 600;
    color: var(--lemesh-text, #1a2733);
    cursor: pointer;
    list-style: none;
}

.lemesh-faq__question::-webkit-details-marker {
    display: none;
}

.lemesh-faq__question::after {
    content: "";
    flex: 0 0 12px;
    width: 12px;
    height: 12px;
    border-right: 2px solid var(--lemesh-blue, #0865c7);
    border-bottom: 2px solid var(--lemesh-blue, #0865c7);
    transform: rotate(45deg);
    transition: transform 0.2s ease;
}

.lemesh-faq__item[open] .lemesh-faq__question::after {
    transform: rotate(-135deg);
}

.lemesh-faq__answer {
    padding: 0 22px 20px;
    font-size: 15px;
    line-height: 1.6;
    color: #5a6b7d;
}

/* Form note under submit */
.lemesh-form__note {
    margin: 12px 0 0;
    font-size: 12px;
    line-height: 1.5;
    color: #8a97a6;
    text-align: center;
}

.lemesh-form__note a {
    color: inherit;
    text-decoration: underline;
}

/* v1.4.30 responsive: new sections */
@media (max-width: 1024px) {.lemesh-cost__factors
    {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {.lemesh-cost__factors,
.lemesh-cost__levels
    {
        grid-template-columns: 1fr;
    }

    .lemesh-cost__factors li {
        flex-direction: row;
        align-items: center;
    }

    .lemesh-faq__question {
        font-size: 16px;
    }
}

/* v1.4.30 fix: long TZ button texts must not overflow narrow viewports */
@media (max-width: 480px) {
    .lemesh-bottom__card,
    .lemesh-callback__content,
    .lemesh-callback__form {
        min-width: 0;
    }

    .lemesh-btn {
        white-space: normal;
        text-align: center;
    }
}

/* ==========================================================================
   v1.4.31 — marketing/visual polish pass per approved TZ (no block reorder).
   Metrics: trust strip, cost cards, steps, Evgeny card, reviews label,
   FAQ sizing, service-card CTA link.
   ========================================================================== */

/* 2. Trust strip readability */
.lemesh-assurance {
    min-height: 130px;
    padding: 30px 0;
}

/* 4. Service card CTA link */
.lemesh-service-card__link {
    display: inline-block;
    margin-top: 12px;
    font-size: 15px;
    font-weight: 600;
    color: var(--lemesh-blue, #0865c7);
}

.lemesh-service-card:hover .lemesh-service-card__link {
    text-decoration: underline;
}

/* 5. Cost level cards */
.lemesh-cost__level {
    min-height: 150px;
}

.lemesh-cost__level h3 {
    font-size: 18px;
}

.lemesh-cost__level p {
    font-size: 15px;
}

/* 7. Steps typography floor */
.lemesh-steps .lemesh-step-mini h3 {
    font-size: 18px;
}

.lemesh-steps .lemesh-step-mini p {
    font-size: 15px;
}

/* 10. Evgeny card visual weight */
.lemesh-bottom__photo {
    width: 260px;
    height: 340px;
}

.lemesh-bottom__manager-text h3 {
    font-size: 28px;
    line-height: 1.25;
}

.lemesh-bottom__role {
    font-size: 17px;
}

.lemesh-bottom__quote {
    font-size: 17px;
    line-height: 1.5;
}

.lemesh-bottom__facts li {
    font-size: 15px;
}

.lemesh-bottom__manager-text .lemesh-btn {
    min-height: 50px;
    display: inline-flex;
    align-items: center;
}

@media (max-width: 768px) {
    .lemesh-bottom__card--manager {
        flex-direction: column;
        align-items: stretch;
    }

    .lemesh-bottom__photo {
        width: 100%;
        height: auto;
        aspect-ratio: 260 / 340;
        max-height: 340px;
    }
}

/* 12. FAQ sizing */
.lemesh-faq__list {
    max-width: 1040px;
}

.lemesh-faq__question {
    font-size: 18px;
    padding: 22px 24px;
}

.lemesh-faq__answer {
    font-size: 16px;
    padding: 0 24px 22px;
}

@media (max-width: 768px) {
    .lemesh-faq__question {
        font-size: 17px;
        padding: 20px;
    }

    .lemesh-faq__answer {
        font-size: 15px;
        padding: 0 20px 20px;
    }
}

/* v1.4.31 fix: long trust-stat words must fit 2-col grid on narrow screens */
/* v1.4.31 fix: quiz title long word must not overflow at 375px */
@media (max-width: 480px) {
    .lemesh-quiz__form .lemesh-section__title {
        overflow-wrap: break-word;
        word-break: break-word;
        hyphens: auto;
    }
}

/* ==========================================================================
   v1.4.33 — marketing text edits per approved TZ.
   Only new-element styles: cost levels subtitle + CTA button placement.
   ========================================================================== */

.lemesh-cost__levels-subtitle {
    margin: 0 0 18px;
    font-size: 20px;
    line-height: 1.3;
    font-weight: 700;
    text-align: center;
    color: var(--lemesh-text, #1a2733);
}

.lemesh-cost__cta {
    margin: 24px 0 22px;
    text-align: center;
}

/* ==========================================================================
   v1.4.34 — final visual polish pass per approved TZ.
   Metrics only; no text/order/architecture changes.
   ========================================================================== */

/* 1. Hero typography + rhythm */
.lemesh-hero__objects {
    font-size: 17px;
    line-height: 1.55;
    margin-bottom: 26px;
}

.lemesh-hero__advantage span {
    font-size: 15px;
}

.lemesh-hero__advantages {
    margin-bottom: 28px;
}

.lemesh-hero__cta .lemesh-btn {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
}

.lemesh-hero__cta .lemesh-btn--primary {
    min-width: 210px;
    justify-content: center;
}

/* 3. Quiz metrics + step-1 hint */
.lemesh-quiz__question {
    font-size: 18px;
    line-height: 1.4;
}

.lemesh-quiz__hint {
    margin: -4px 0 14px;
    font-size: 14px;
    line-height: 1.5;
    color: #5a6b7d;
}

.lemesh-quiz__option {
    font-size: 15px;
}

.lemesh-quiz__nav .lemesh-btn,
.lemesh-quiz__step--final .lemesh-btn {
    min-height: 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* 4. Services: 2-line descriptions, equal card heights */
.lemesh-service-card {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.lemesh-service-card__body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}

.lemesh-service-card__body p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.lemesh-service-card__link {
    margin-top: auto;
    padding-top: 12px;
    font-size: 15px;
}

/* 5. Cost: visual split + bigger level cards + badge + bigger CTA */
.lemesh-cost__factors {
    padding-bottom: 32px;
    margin-bottom: 32px;
    border-bottom: 1px solid var(--lemesh-border, #e5e7eb);
}

.lemesh-cost__level {
    position: relative;
    min-height: 170px;
    padding: 30px 26px;
}

.lemesh-cost__cta .lemesh-btn {
    min-height: 56px;
    padding: 0 36px;
    font-size: 16px;
    display: inline-flex;
    align-items: center;
}

/* 6. Steps metrics */
.lemesh-steps .lemesh-step-mini {
    min-height: 200px;
}

.lemesh-steps .lemesh-step-mini__icon {
    width: 52px;
    height: 52px;
}

.lemesh-steps .lemesh-step-mini h3 {
    font-size: 18px;
}

.lemesh-steps .lemesh-step-mini p {
    font-size: 15px;
}

/* 9. Evgeny: grid 62/38, larger photo, fact rows, taller CTA */
@media (min-width: 1025px) {
    .lemesh-bottom__grid {
        grid-template-columns: 62fr 38fr;
    }
}

.lemesh-bottom__photo {
    width: 270px;
    height: 350px;
}

.lemesh-bottom__manager-text h3 {
    font-size: 28px;
}

.lemesh-bottom__facts li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px 10px 12px;
    margin-bottom: 8px;
    background: #f4f8fd;
    border-radius: 10px;
    font-size: 15px;
}

.lemesh-bottom__facts li::before {
    position: static;
    flex: 0 0 16px;
    width: 16px;
    height: 16px;
    top: auto;
}

.lemesh-bottom__manager-text .lemesh-btn {
    min-height: 52px;
}

/* 10. FAQ: distinct background + typography */
.lemesh-faq {
    background: #f4f8fd;
}

.lemesh-faq .lemesh-section__title {
    font-size: clamp(30px, 3vw, 34px);
}

.lemesh-faq__question {
    font-size: 17px;
    padding: 22px 24px;
}

.lemesh-faq__answer {
    font-size: 15px;
    padding: 0 24px 22px;
}

/* 11. Final CTA: wider form, more padding, assurance note */
.lemesh-callback__form {
    max-width: 780px;
    padding: 40px;
}

.lemesh-callback__form .lemesh-form__title {
    font-size: 26px;
}

.lemesh-callback__form .lemesh-form__subtitle {
    font-size: 15px;
}

.lemesh-callback__form .lemesh-input {
    min-height: 54px;
}

.lemesh-callback__form textarea.lemesh-input {
    min-height: 120px;
}

@media (max-width: 768px) {
    .lemesh-callback__form {
        padding: 26px 22px;
    }

    .lemesh-hero__cta .lemesh-btn--primary {
        min-width: 0;
    }
}

/* v1.4.34 fix: keep trust stats inside 2-col grid on narrow screens */
/* ==========================================================================
   v1.4.35 — 3 marketing micro-edits per approved TZ (no grid/size changes).
   ========================================================================== */

/* 1. Hero subline under subtitle */
.lemesh-hero__objects {
    margin-bottom: 0;
}

/* 2. Portfolio meta labels */
.lemesh-portfolio-card__meta strong {
    font-weight: 700;
    font-size: 15px;
    color: var(--lemesh-blue, #0865c7);
}

/* 3. Evgeny lead accent (text, not a block) */
.lemesh-bottom__lead {
    margin: 0 0 12px;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 600;
    color: var(--lemesh-blue, #0865c7);
}

/* ==========================================================================
   v1.4.36 — Hero H1 column containment + strict 3-line split (client spec).
   No nowrap, no fixed oversize width, no scale(), no negative margins.
   Font tuned so all 3 lines fit the 54% column on 1025-1920px (client-approved
   reduction; measured line-2 width = ~15.64px per 1px of font-size).
   ========================================================================== */
@media (min-width: 1025px) {
    .lemesh-hero__grid {
        grid-template-columns: minmax(0, 54%) minmax(0, 46%);
    }

    .lemesh-hero__content {
        min-width: 0;
        max-width: 100%;
        overflow: hidden;
    }

    .lemesh-hero__content-inner {
        width: 100%;
        max-width: none;
        margin-left: max(32px, calc((100vw - 1440px) / 2));
        padding-right: 24px;
    }

    .lemesh-hero__title {
        max-width: 760px;
        width: 100%;
        font-size: clamp(38px, 3vw, 47px);
        line-height: 1.02;
        letter-spacing: -0.03em;
        overflow-wrap: normal;
        word-break: normal;
    }

    .lemesh-hero__title span {
        display: block;
        white-space: normal;
    }
}

@media (min-width: 1025px) and (max-width: 1279px) {
    .lemesh-hero__title {
        font-size: clamp(30px, 3vw, 38px);
    }
}

/* v1.4.36 fix: bottom grid min-content flooring caused 37px page overflow at 1025px */
@media (min-width: 1025px) {
    .lemesh-bottom__grid {
        grid-template-columns: minmax(0, 62fr) minmax(0, 38fr);
    }
}

/* v1.4.36: hero CTA note — client-specified styling */
.lemesh-hero__cta-note {
    font-size: 15px;
    color: #5f6875;
    margin-top: 15px;
}

/* ==========================================================================
   v1.4.38 — Hero expertise subline containment (client spec).
   Root cause: content-inner width:100% + margin-left overhung the left column;
   full-width subline was clipped / went under the photo.
   Fix: margin-left -> content padding-left (same left offset, box stays inside
   the column); subline capped at 720px, hard 2-line split, wrap-safe.
   No nowrap, no fixed oversize width, no negative margins, no transform.
   ========================================================================== */
@media (min-width: 1025px) {
    .lemesh-hero__content {
        min-width: 0;
        max-width: 100%;
        padding-left: max(32px, calc((100vw - 1440px) / 2));
    }

    .lemesh-hero__content-inner {
        width: 100%;
        margin-left: 0;
    }
}

/* ==========================================================================
   v1.4.40 — Cost section rebuild per approved TZ.
   New: subtitle, factor cards with title+desc, variant cards (equal height,
   check lists, blue-bordered accent), plate, plain note. Old level cards
   (Практичный/Оптимальный/Премиальный) removed from markup.
   ========================================================================== */

.lemesh-cost__subtitle {
    margin: 0 auto 28px;
    max-width: 820px;
    font-size: 17px;
    line-height: 1.5;
    text-align: center;
    color: #5a6b7d;
}

.lemesh-cost__variants {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    align-items: stretch;
    margin-bottom: 22px;
}

.lemesh-cost__variant {
    display: flex;
    flex-direction: column;
    padding: 30px 26px;
    background: #fff;
    border: 1px solid var(--lemesh-border, #e5e7eb);
    border-radius: 14px;
}

.lemesh-cost__variant--accent {
    border: 2px solid var(--lemesh-blue, #0865c7);
}

.lemesh-cost__variant-label {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--lemesh-blue, #0865c7);
}

.lemesh-cost__variant-badge {
    display: inline-block;
    align-self: flex-start;
    margin-bottom: 10px;
    padding: 5px 12px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
    color: #fff;
    background: var(--lemesh-blue, #0865c7);
    border-radius: 20px;
}

.lemesh-cost__variant h3 {
    margin: 0 0 8px;
    font-size: 19px;
    line-height: 1.3;
    font-weight: 700;
    color: var(--lemesh-text, #1a2733);
}

.lemesh-cost__variant p {
    margin: 0 0 14px;
    font-size: 15px;
    line-height: 1.55;
    color: #5a6b7d;
}

.lemesh-cost__variant ul {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: auto 0 0;
    padding: 0;
    list-style: none;
}

.lemesh-cost__variant li {
    position: relative;
    padding-left: 26px;
    font-size: 15px;
    line-height: 1.45;
    color: var(--lemesh-text, #1a2733);
}

.lemesh-cost__variant li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 16px;
    height: 16px;
    background: no-repeat center / 16px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230057B8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
}

.lemesh-cost__plate {
    margin: 0;
    padding: 16px 20px;
    background: #fff8ec;
    border: 1px solid #fde68a;
    border-radius: 12px;
    font-size: 15px;
    line-height: 1.5;
    color: #7c5a10;
    text-align: center;
}

.lemesh-cost__note {
    padding: 0;
    background: none;
    border: none;
    text-decoration: none;
    font-size: 15px;
    line-height: 1.5;
    color: #5a6b7d;
    text-align: center;
}

@media (max-width: 768px) {
    .lemesh-cost__variants {
        grid-template-columns: 1fr;
    }

    .lemesh-cost__factors li {
        flex-direction: column;
        align-items: flex-start;
    }

    .lemesh-cost__subtitle {
        font-size: 16px;
    }
}

/* ==========================================================================
   v1.4.43 — Includes block visual rebuild per approved TZ.
   ALL rules scoped to .lemesh-includes (checklist classes are reused in the
   trust block — do not leak). No palette/font-system changes.
   ========================================================================== */

.lemesh-includes {
    padding-top: 64px;
    padding-bottom: 64px;
}

.lemesh-includes .lemesh-section__title {
    margin-bottom: 12px;
    font-size: 36px;
    line-height: 1.15;
    font-weight: 700;
    text-align: center;
}

.lemesh-includes__subtitle {
    max-width: 720px;
    margin: 0 auto 36px;
    font-size: 17px;
    line-height: 1.5;
    text-align: center;
    color: #657386;
}

.lemesh-includes .lemesh-checklist--two-col {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 64px;
    row-gap: 20px;
    max-width: 980px;
    margin: 0 auto;
    padding: 0;
    list-style: none;
}

.lemesh-includes .lemesh-checklist li {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 34px;
    padding: 0;
    font-size: 17px;
    line-height: 1.35;
    font-weight: 500;
    color: #1f2a37;
}

.lemesh-includes .lemesh-checklist li::before {
    content: "";
    position: static;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    border-radius: 50%;
    background: #0865c7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 14px no-repeat;
}

.lemesh-includes__note {
    display: block;
    max-width: 980px;
    margin: 32px auto 0;
    padding: 16px 22px;
    border: 1px solid #d7a943;
    border-radius: 10px;
    background: #fff9ec;
    font-size: 15px;
    line-height: 1.45;
    color: #7a5713;
    text-align: center;
}

@media (max-width: 767px) {
    .lemesh-includes {
        padding: 48px 0;
    }

    .lemesh-includes .lemesh-container {
        width: calc(100% - 40px);
        margin-inline: auto;
    }

    .lemesh-includes .lemesh-section__title {
        font-size: 30px;
        line-height: 1.15;
    }

    .lemesh-includes__subtitle {
        margin-bottom: 28px;
        padding-inline: 10px;
        font-size: 16px;
    }

    .lemesh-includes .lemesh-checklist--two-col {
        grid-template-columns: 1fr;
        column-gap: 0;
        row-gap: 16px;
    }

    .lemesh-includes .lemesh-checklist li {
        min-height: 32px;
        font-size: 16px;
    }

    .lemesh-includes__note {
        margin-top: 28px;
        padding: 14px 16px;
        font-size: 14px;
        text-align: left;
    }
}

/* v1.4.44 — portfolio intro line (real-projects disclaimer, client TZ) */
.lemesh-portfolio__intro {
    margin: 0 0 10px;
    font-size: 15px;
    line-height: 1.5;
    text-align: center;
    color: #657386;
}

/* Desktop: brand name 22–24px, descriptor 12–13px, one line */
/* Mobile: logo + «ЛЕМЕШ ПРО» in one row, descriptor hidden.
   Legacy rule stacked logo children vertically — restore the row. */
@media (max-width: 768px) {
    .lemesh-header .lemesh-logo {
        flex-direction: row;
        align-items: center;
        gap: 8px;
    }
}

/* Narrow phones: keep brand + burger inside the header row */
@media (max-width: 380px) {
    .lemesh-header__inner {
        gap: 12px;
    }

    .lemesh-logo {
        gap: 6px;
    }
}

/* ---------- 2. Desktop hero UTP: shorter line, max 620px, <= 2 lines ---------- */
@media (max-width: 767px) {
    .lemesh-hero__content {
        padding: 22px 0 0;
    }

    .lemesh-hero__title {
        /* 8.4vw guarantees the longest word («ФИКСИРОВАННОЙ», 13 caps glyphs)
           never exceeds the container at 360-430px viewports (v1.4.18 precedent) */
        font-size: clamp(28px, 8.4vw, 36px);
        line-height: 1.04;
        letter-spacing: -0.02em;
        margin-bottom: 14px;
    }

    .lemesh-hero__objects {
        font-size: 15px;
        line-height: 1.4;
        margin: 0 0 12px;
    }

    .lemesh-hero__advantages {
        gap: 8px;
        margin-bottom: 16px;
    }

    .lemesh-hero__advantage,
    .lemesh-hero__advantage span {
        font-size: 14px;
    }

    .lemesh-hero__adv-icon {
        width: 22px;
        height: 22px;
    }

    .lemesh-hero__adv-icon svg {
        width: 20px;
        height: 20px;
    }

    /* Primary CTA: full width, 52px, 16px type */
    .lemesh-hero__cta .lemesh-btn--primary {
        width: 100%;
        min-height: 52px;
        font-size: 16px;
    }

    /* Secondary CTA moves below the hero photo on mobile */
    .lemesh-hero__cta .lemesh-btn--outline {
        display: none;
    }

    /* Keep the first screen clean: note would be half-covered by the fixed bar */
    .lemesh-hero__cta-note {
        display: none;
    }
}

/* ---------- 4. Trust strip: compact continuation of hero on mobile ---------- */
@media (max-width: 767px) {
    .lemesh-assurance {
        min-height: 0;
        padding: 24px 0;
    }
}

/* ---------- 5. Evgeniy block: mobile body text 16px / 1.5 ---------- */
@media (max-width: 767px) {
    .lemesh-bottom__quote {
        font-size: 16px;
        line-height: 1.5;
    }
}


/* ==========================================================================
   v1.4.46 — First screen rebuild (client TZ): new approved hero visual
   (hero-modern-house), desktop grid 46/54, single subtitle, bold subline
   removed, mobile image-first order, light entrance animations.
   Only header + hero are touched; everything below hero is unchanged.
   ========================================================================== */

/* ---------- Header: logo a bit more present, brand more readable ---------- */
/* Scoped to >=1440: at 1151-1439 the extra ~13px collides nav with phone */
@media (min-width: 1440px) {
    .lemesh-logo__img {
        height: 76px;
    }
}

/* ---------- Desktop hero: text 46% / image 54% ---------- */
@media (min-width: 1025px) {
    .lemesh-hero__grid {
        grid-template-columns: minmax(0, 46%) minmax(0, 54%);
    }

    .lemesh-hero__content-inner {
        padding-right: 32px;
    }

    .lemesh-hero__title {
        /* 2.55vw keeps the longest line («С ФИКСИРОВАННОЙ ЦЕНОЙ», ~15.84px per
           1px font-size incl. -0.02em tracking) inside the 46% column 1025-1920 */
        font-size: clamp(30px, 2.55vw, 38px);
        letter-spacing: -0.02em;
    }

    /* New landscape visual: bias the crop to the glass facade, no scale hack */
    .lemesh-hero__visual img {
        object-position: 88% 50%;
        transform: none;
    }
}

@media (min-width: 1025px) and (max-width: 1279px) {
    .lemesh-hero__title {
        font-size: clamp(24px, 2.5vw, 32px);
    }
}

/* ---------- Advantages: one row of 3 cells (labels wrap inside their cell) ---------- */
@media (min-width: 1025px) {
    .lemesh-hero__advantages {
        gap: 10px 24px;
        max-width: 620px;
    }

    .lemesh-hero__advantage {
        align-items: center;
        font-size: 15px;
    }
}

/* ---------- Mobile hero: image first, then text (client TZ 7.2) ---------- */
@media (max-width: 767px) {
    .lemesh-hero__visual {
        order: 0;
        min-height: 0;
        max-height: none;
        height: clamp(220px, 56vw, 260px);
    }

    .lemesh-hero__visual img {
        min-height: 0;
        max-height: none;
        height: 100%;
        object-position: 55% 55%;
    }

    .lemesh-hero__content {
        order: 1;
        padding: 8px 0 24px;
    }

    /* TZ 7.4: compact H1 on mobile (wraps by whole words, no overlap) */
    .lemesh-hero__title {
        font-size: clamp(26px, 7.4vw, 32px);
        line-height: 1.02;
        margin-bottom: 8px;
    }

    .lemesh-hero__objects {
        font-size: 14px;
        margin: 0 0 8px;
    }

    .lemesh-hero__advantages {
        gap: 5px;
        margin-bottom: 8px;
    }

    /* Both CTAs: full width, stacked */
    .lemesh-hero__cta {
        flex-direction: column;
        gap: 8px;
    }

    .lemesh-hero__cta .lemesh-btn--primary,
    .lemesh-hero__cta .lemesh-btn--outline {
        display: inline-flex;
        width: 100%;
        min-height: 52px;
        font-size: 16px;
    }

    /* Explanatory line is back on mobile: quiet, small, secondary */
    .lemesh-hero__cta-note {
        display: block;
        font-size: 13px;
        line-height: 1.45;
        color: #5f6875;
        margin-top: 12px;
        text-align: left;
    }
}

/* ---------- Entrance animations: light fade-up stagger + image zoom-out ---------- */
@keyframes lemesh-hero-fade-up {
    from {
        opacity: 0;
        transform: translateY(12px); /* TASK-001: вход мягче (было 18px) */
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes lemesh-hero-visual-in {
    from {
        opacity: 0.35;
        transform: scale(1.03);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}.lemesh-hero__title,
.lemesh-hero__objects,
.lemesh-hero__advantages,
.lemesh-hero__cta,
.lemesh-hero__cta-note
    {
    animation: lemesh-hero-fade-up 0.7s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}

.lemesh-hero__title {
    animation-delay: 0.08s;
}

.lemesh-hero__objects {
    animation-delay: 0.16s;
}

.lemesh-hero__advantages {
    animation-delay: 0.24s;
}

.lemesh-hero__cta {
    animation-delay: 0.32s;
}

.lemesh-hero__cta-note {
    animation-delay: 0.4s;
}

.lemesh-hero__visual img {
    animation: lemesh-hero-visual-in 0.85s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}

@media (prefers-reduced-motion: reduce) {.lemesh-hero__title,
.lemesh-hero__objects,
.lemesh-hero__advantages,
.lemesh-hero__cta,
.lemesh-hero__cta-note,
.lemesh-hero__visual img
    {
        animation: none;
    }
}

/* ---------- CTA hover: subtle lift + soft shadow (pointer devices only) ---------- */
@media (hover: hover) and (pointer: fine) {
    .lemesh-hero__cta .lemesh-btn {
        transition: transform 0.25s ease, box-shadow 0.25s ease,
            background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
    }

    .lemesh-hero__cta .lemesh-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 22px rgba(0, 87, 184, 0.18);
    }
}


/* ==========================================================================
   v1.4.47 — Hero composition correction (client): remove the hard 46/54
   split. One panoramic section: full-bleed background visual + soft white
   gradient on the left, content floating above inside the site container.
   Texts, CTAs, header functionality and entrance text animation unchanged.
   ========================================================================== */

@media (min-width: 1025px) {
    /* Single panoramic hero section */
    .lemesh-hero {
        position: relative;
        height: auto;
        min-height: 650px;
        max-height: none;
    }

    .lemesh-hero__grid {
        display: block;
        position: relative;
        height: auto;
        min-height: 650px;
        max-height: none;
    }

    /* Background visual covers the whole hero area */
    .lemesh-hero__visual {
        position: absolute;
        inset: 0;
        z-index: 0;
        min-height: 0;
        max-height: none;
        overflow: hidden;
    }

    .lemesh-hero__visual img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        min-height: 0;
        max-height: none;
        object-fit: cover;
        /* Key glass facade stays on the right; sky/lawn on the left */
        object-position: var(--lemesh-hero-pos-mob, 68% 50%);
    }

    /* Soft white blend over the photo: readable text, no hard edge */
    .lemesh-hero__visual::before {
        content: "";
        display: block;
        position: absolute;
        inset: 0;
        width: auto;
        height: auto;
        z-index: 1;
        background: linear-gradient(
            90deg,
            rgba(255, 255, 255, 1) 0%,
            rgba(255, 255, 255, 0.98) 30%,
            rgba(255, 255, 255, 0.88) 43%,
            rgba(255, 255, 255, 0.38) 56%,
            rgba(255, 255, 255, 0) 70%
        );
    }

    /* Content floats above visual + gradient, aligned to the site container */
    .lemesh-hero__content {
        position: relative;
        z-index: 2;
        width: 46%;
        max-width: none;
        min-width: 0;
        min-height: 650px;
        overflow: visible;
        padding-top: 0;
        padding-bottom: 0;
    }

    .lemesh-hero__content-inner {
        width: 100%;
        max-width: 700px;
    }
}

/* Image entrance: animate the shared background visual (client spec) */
@keyframes lemesh-hero-visual-in {
    from {
        opacity: 0.85;
        transform: scale(1.025);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.lemesh-hero__visual img {
    animation: lemesh-hero-visual-in 0.9s cubic-bezier(0.22, 0.61, 0.36, 1) both;
    transform-origin: 100% 50%;
}

/* Mobile: keep the stacked composition (no background-overlay), tune frame */
@media (max-width: 767px) {
    .lemesh-hero__visual {
        height: clamp(230px, 56vw, 280px);
        border-radius: 0 0 18px 18px;
        overflow: hidden;
    }

    .lemesh-hero__visual img {
        object-position: 70% 50%;
    }
}


/* ---------- Header mid-width fix: nav links must fit between brand and contacts ---------- */
@media (min-width: 1151px) and (max-width: 1439px) {
    .lemesh-nav--desktop {
        gap: 14px;
    }

    .lemesh-nav--desktop a {
        font-size: 14px;
    }

    .lemesh-header__contacts .lemesh-phone {
        font-size: 16px;
    }

    .lemesh-header__contacts .lemesh-btn {
        padding: 0 12px;
    }
}

/* Header 1151-1279: everything stays, just compact (links would overlap phone) */
@media (min-width: 1151px) and (max-width: 1279px) {
    .lemesh-logo__img {
        height: 60px;
    }

    .lemesh-nav--desktop {
        gap: 10px;
    }

    .lemesh-nav--desktop a {
        font-size: 13px;
    }

    .lemesh-header__contacts .lemesh-phone {
        font-size: 15px;
    }

    .lemesh-header__contacts .lemesh-btn {
        height: 44px;
        min-height: 44px;
        padding: 0 10px;
        font-size: 13px;
    }
}


/* ============================================================
   v1.4.48: Assurance section rebuild — 4 process cards
   (grid, cards, connector segments, one-shot entrance +
   per-icon animations, hover, mobile, reduced-motion)
   ============================================================ */
.lemesh-assurance {
    --amp: 1;
    --t0: 280ms;
    padding: 72px 0;
    background: linear-gradient(180deg, #f5f9fe 0%, #edf5fc 100%);
}

.lemesh-assurance__card {
    position: relative;
    min-height: 225px;
    padding: 22px 24px;
    text-align: center;
    border: 1px solid #d9e5f1;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 10px 28px rgba(24, 55, 90, 0.07);
    overflow: hidden;
    transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.lemesh-ic {
    width: 68px;
    height: 68px;
    display: block;
    transition: transform 0.25s ease;
}

.lemesh-ic g,
.lemesh-ic path {
    transform-box: fill-box;
    transform-origin: center;
}

.ic2-line1,
.ic2-line2,
.ic2-line3 {
    transform-origin: left center;
}

.ic2-house {
    transform-origin: center bottom;
}

/* Tablet: 2 columns, centered layout */
@media (min-width: 768px) and (max-width: 1023px) {

    .lemesh-assurance__card {
        min-height: 210px;
    }
}

.lemesh-assurance--js .lemesh-assurance__card {
    opacity: 0;
    transform: translateY(calc(18px * var(--amp, 1)));
}

.lemesh-assurance--js .lemesh-assurance__card.is-inview {
    animation: lemesh-a-card-in 0.65s cubic-bezier(0.22, 0.61, 0.36, 1) both;
    animation-delay: calc(var(--t0, 0ms) + var(--cd, 0ms));
}

.lemesh-assurance--js .lemesh-assurance__card.is-done {
    animation: none;
    opacity: 1;
    transform: none;
}

/* Per-icon initial states (armed only) */
.lemesh-assurance--js .ic1-board { opacity: 0; transform: scale(0.92); }
.lemesh-assurance--js .ic1-check1,
.lemesh-assurance--js .ic1-check2 { opacity: 0; transform: scale(0.4); }
.lemesh-assurance--js .ic1-lens { opacity: 0; }

.lemesh-assurance--js .ic2-doc { opacity: 0; transform: translateY(calc(12px * var(--amp, 1))); }
.lemesh-assurance--js .ic2-line1,
.lemesh-assurance--js .ic2-line2,
.lemesh-assurance--js .ic2-line3 { opacity: 0; transform: scaleX(0); }
.lemesh-assurance--js .ic2-house { opacity: 0; transform: scale(0.85); }
.lemesh-assurance--js .ic2-glow { opacity: 0; }

.lemesh-assurance--js .ic3-q { opacity: 0; }
.lemesh-assurance--js .ic3-q1 { transform: translate(calc(-14px * var(--amp, 1)), calc(-14px * var(--amp, 1))); }
.lemesh-assurance--js .ic3-q2 { transform: translate(calc(14px * var(--amp, 1)), calc(-14px * var(--amp, 1))); }
.lemesh-assurance--js .ic3-q3 { transform: translate(calc(-14px * var(--amp, 1)), calc(14px * var(--amp, 1))); }
.lemesh-assurance--js .ic3-q4 { transform: translate(calc(14px * var(--amp, 1)), calc(14px * var(--amp, 1))); }
.lemesh-assurance--js .ic3-sparks { opacity: 0; transform: scale(0.6); }
.lemesh-assurance--js .ic3-shine { opacity: 0; }

.lemesh-assurance--js .ic4-doc { opacity: 0; transform: scale(0.92); }
.lemesh-assurance--js .ic4-pen { opacity: 0; transform: translate(calc(-42px * var(--amp, 1)), 10px); }
.lemesh-assurance--js .ic4-sign { stroke-dasharray: 40; stroke-dashoffset: 40; }
.lemesh-assurance--js .ic4-check { opacity: 0; transform: scale(0.4); }

/* Per-icon animations (fire once when card gets .is-inview)
   v1.4.49 retime: slow sequential scenario, total ~3.35s */
.is-inview .ic1-board { animation: lemesh-a-fade-scale 0.55s ease-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib)); }
.is-inview .ic1-lens { animation: lemesh-a-lens-scan 0.85s ease-in-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 220ms); }
.is-inview .ic1-check1 { animation: lemesh-a-pop 0.33s ease-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 570ms); }
.is-inview .ic1-check2 { animation: lemesh-a-pop 0.33s ease-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 770ms); }

.is-inview .ic2-doc { animation: lemesh-a-rise 0.6s ease-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib)); }
.is-inview .ic2-line1 { animation: lemesh-a-line 0.28s ease-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 400ms); }
.is-inview .ic2-line2 { animation: lemesh-a-line 0.28s ease-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 510ms); }
.is-inview .ic2-line3 { animation: lemesh-a-line 0.28s ease-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 620ms); }
.is-inview .ic2-house { animation: lemesh-a-house 0.6s ease-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 250ms); }
.is-inview .ic2-glow { animation: lemesh-a-glow 0.4s ease-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 900ms); }

.is-inview .ic3-q { animation: lemesh-a-q-in 0.75s ease-out both; }
.is-inview .ic3-q1 { animation-delay: calc(var(--t0) + var(--cd) + var(--ib)); }
.is-inview .ic3-q2 { animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 90ms); }
.is-inview .ic3-q3 { animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 160ms); }
.is-inview .ic3-q4 { animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 250ms); }
.is-inview .ic3-sparks { animation: lemesh-a-pop 0.45s ease-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 800ms); }
.is-inview .ic3-shine { animation: lemesh-a-shine 0.65s ease-in-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 900ms); }

.is-inview .ic4-doc { animation: lemesh-a-fade-scale 0.54s ease-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib)); }
.is-inview .ic4-pen { animation: lemesh-a-pen 0.78s ease-in-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 250ms); }
.is-inview .ic4-sign { animation: lemesh-a-sign 0.8s ease-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 290ms); }
.is-inview .ic4-check { animation: lemesh-a-pop 0.3s ease-out both; animation-delay: calc(var(--t0) + var(--cd) + var(--ib) + 1100ms); }

/* Keyframes */
@keyframes lemesh-a-card-in {
    from { opacity: 0; transform: translateY(calc(18px * var(--amp, 1))); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes lemesh-a-fade-scale {
    from { opacity: 0; transform: scale(0.92); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes lemesh-a-pop {
    0% { opacity: 0; transform: scale(0.4); }
    70% { opacity: 1; transform: scale(1.12); }
    100% { opacity: 1; transform: scale(1); }
}

@keyframes lemesh-a-lens-scan {
    0% { opacity: 0; transform: translateX(calc(-6px * var(--amp, 1))) rotate(-5deg); }
    25% { opacity: 1; }
    55% { transform: translateX(calc(6px * var(--amp, 1))) rotate(4deg); }
    100% { opacity: 1; transform: translateX(0) rotate(0); }
}

@keyframes lemesh-a-rise {
    from { opacity: 0; transform: translateY(calc(12px * var(--amp, 1))); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes lemesh-a-line {
    from { opacity: 0; transform: scaleX(0); }
    to { opacity: 1; transform: scaleX(1); }
}

@keyframes lemesh-a-house {
    0% { opacity: 0; transform: scale(0.85); }
    70% { opacity: 1; transform: scale(1.03); }
    100% { opacity: 1; transform: scale(1); }
}

@keyframes lemesh-a-glow {
    0% { opacity: 0; }
    35% { opacity: 0.32; }
    100% { opacity: 0.16; }
}

@keyframes lemesh-a-q-in {
    from { opacity: 0; }
    to { opacity: 1; transform: translate(0, 0); }
}

@keyframes lemesh-a-shine {
    0% { opacity: 0; transform: rotate(12deg) translateX(-28px); }
    30% { opacity: 0.5; }
    100% { opacity: 0; transform: rotate(12deg) translateX(46px); }
}

@keyframes lemesh-a-pen {
    0% { opacity: 0; transform: translate(calc(-42px * var(--amp, 1)), 10px); }
    20% { opacity: 1; }
    65% { transform: translate(calc(-18px * var(--amp, 1)), 4px); }
    100% { opacity: 1; transform: translate(0, 0); }
}

@keyframes lemesh-a-sign {
    to { stroke-dashoffset: 0; }
}

/* Hover (desktop pointers only) */
@media (hover: hover) and (pointer: fine) {
    .lemesh-assurance .lemesh-assurance__card:hover {
        transform: translateY(-4px);
        border-color: #0b6fd3;
        box-shadow: 0 18px 38px rgba(8, 101, 199, 0.14);
    }

    .lemesh-assurance__card:hover .lemesh-ic {
        transform: scale(1.04);
    }
}

/* Mobile */
@media (max-width: 767px) {
    .lemesh-assurance {
        --amp: 0.7;
        --t0: 0ms;
        padding: 52px 0;
    }

    /* v1.4.49: mobile — each card animates on its own (per-card IO trigger) */
    .lemesh-assurance__card {
        --cd: 0ms;
        --ib: 150ms;
    }

    .lemesh-assurance--js .lemesh-assurance__card.is-inview {
        animation-duration: 0.6s;
    }

    /* v1.4.51: mobile — horizontal card layout (icon left, content right) */
    .lemesh-assurance__card {
        display: grid;
        grid-template-columns: 76px minmax(0, 1fr);
        column-gap: 18px;
        align-items: center;
        min-height: 160px;
        padding: 20px;
        text-align: left;
    }

    .lemesh-ic {
        width: 68px;
        height: 68px;
    }
}

/* Reduced motion: everything visible, no transforms, line drawn */
@media (prefers-reduced-motion: reduce) {
    .lemesh-assurance--js .lemesh-assurance__card,
    .lemesh-assurance--js .lemesh-ic g,
    .lemesh-assurance--js .lemesh-ic path,
    .lemesh-assurance--js .lemesh-ic rect,
    .lemesh-assurance--js .lemesh-ic ellipse {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }

    .lemesh-assurance--js .ic4-sign {
        stroke-dashoffset: 0 !important;
    }.lemesh-assurance__card,
.lemesh-ic
    {
        transition: none !important;
    }

    .lemesh-assurance__card:hover {
        transform: none !important;
    }
}


/* ============================================================
   v1.4.50: Mobile hero fix (<=767px only, desktop untouched)
   - remove white void between header and hero image
   - framed image with 4 rounded corners
   - tighter image -> eyebrow gap
   - fixed CTA bar clearance at page bottom
   ============================================================ */
@media (max-width: 767px) {
    /* 1. No empty zone between header and hero image */
    .lemesh-hero {
        min-height: 0;
        height: auto;
        padding-top: 0;
        margin-top: 0;
    }

    .lemesh-hero__grid {
        row-gap: 0;
    }

    /* 2. Framed image: off the screen edges, 4 rounded corners */
    .lemesh-hero__visual {
        width: calc(100% - 32px);
        margin: 12px auto 0;
        height: clamp(240px, 60vw, 270px);
        min-height: 0;
        max-height: none;
        border-radius: 18px;
        overflow: hidden;
    }

    .lemesh-hero__visual img {
        display: block;
        width: 100%;
        height: 100%;
        min-height: 0;
        max-height: none;
        object-fit: cover;
        object-position: var(--lemesh-hero-pos-mob, 68% 50%);
        border-radius: inherit;
    }

    /* 3. Image -> eyebrow lands at 24px (row-gap 0 + content padding 24) */
    .lemesh-hero__content {
        padding-top: 24px;
        margin-top: 0;
    }

}


/* ============================================================
   v1.4.52 — Desktop hero bottom edge fix (client TZ).
   Problem: a wide white band read between the hero content and
   the next light-blue block. Cause: the white readability
   overlay (::before, 90deg) washed the photo out to pure white
   at the bottom-left, so the hero did not have a solid bottom
   edge even though the img itself reached it.
   Fix (Variant A per TZ): one solid hero height (680px), image
   still reaches the very bottom edge, and the overlay — still
   inset:0 / full height — fades out over the last 16% via a
   mask, so the photo forms a solid bottom edge full-width and
   the light-blue section starts immediately after.
   Texts, hero image, object-position, entrance animation,
   header, mobile (<=767) and the next section are unchanged.
   ============================================================ */

@media (min-width: 1025px) {
    /* 1. Single solid hero height */
    .lemesh-hero {
        min-height: 680px;
        padding-bottom: 0;
        margin-bottom: 0;
        overflow: hidden;
    }

    .lemesh-hero__grid {
        min-height: 680px;
    }

    .lemesh-hero__content {
        min-height: 680px;
    }

    /* 2. Overlay keeps inset:0 / 100% height, but fades to
       transparent over the bottom 16% — the photo (not a white
       wash) forms the hero's bottom edge across the full width */
    .lemesh-hero__visual::before {
        -webkit-mask-image: linear-gradient(180deg, #000 84%, transparent 100%);
        mask-image: linear-gradient(180deg, #000 84%, transparent 100%);
    }
}


/* ============================================================
   v1.4.53 — Desktop hero bottom edge, round 2 (client feedback:
   white band still visible at the bottom of the first screen).
   Root cause this time: at ~820px-tall viewports only ~50px of
   the next (assurance) section is visible below the hero, and
   its background gradient starts at #F5F9FE — near-white, so
   that sliver reads as a white band under the photo.
   Fix (Variant B per TZ): replace the v1.4.52 mask approach
   with a light bottom fade INSIDE the hero toward the next
   section's color (rgba(239,246,253,.9)) via __visual::after.
   Overlay ::before returns to plain inset:0 (no mask), so the
   hero's bottom edge blends seamlessly into the light-blue
   section. Hero height stays 680px; image still inset:0/cover;
   texts, object-position, animation, header, mobile and the
   next section unchanged.
   ============================================================ */

@media (min-width: 1025px) {
    /* Undo v1.4.52 mask — overlay is full-height plain again */
    .lemesh-hero__visual::before {
        -webkit-mask-image: none;
        mask-image: none;
    }

    /* Light bottom fade into the next section's background color */
    .lemesh-hero__visual::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 1;
        pointer-events: none;
        background: linear-gradient(
            180deg,
            rgba(255, 255, 255, 0) 82%,
            rgba(239, 246, 253, 0.9) 100%
        );
    }
}

/* v1.4.54: Trust section redesign (Figma node 7:2) — dark premium block, moved right after hero.
   Only .lemesh-trust--v2 markup is affected; other sections unchanged. */
.lemesh-trust.lemesh-trust--v2 {
    position: relative;
    overflow: hidden;
    padding: 72px 0;
    background: linear-gradient(135deg, #061424 0%, #0a1d33 50%, #071728 100%);
    color: #fff;
}

.lemesh-trust--v2::before,
.lemesh-trust--v2::after {
    content: "";
    position: absolute;
    width: 341px;
    height: 248px;
    pointer-events: none;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='341' height='248' viewBox='0 0 341 248'%3E%3Cg stroke='%231E7CE8' stroke-width='1.5' fill='none'%3E%3Cpath d='M18 230V70L118 26v190z'/%3E%3Cpath d='M18 130h100M18 180h100M52 58v172M85 44v186'/%3E%3Cpath d='M165 236V44l158 34v158z'/%3E%3Cpath d='M165 104l158 30M165 162l158 28M205 52v184M258 62v174'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain;
    opacity: 0.18;
}

.lemesh-trust--v2::before {
    top: -40px;
    right: -60px;
    transform: rotate(8deg);
}

.lemesh-trust--v2::after {
    left: -80px;
    bottom: -60px;
    transform: rotate(-6deg);
    opacity: 0.12;
}

.lemesh-trust__inner {
    position: relative;
    z-index: 1;
    max-width: 1240px;
    width: calc(100% - 64px);
    margin-inline: auto;
}

.lemesh-trust__layout {
    display: grid;
    grid-template-columns: 46% 54%;
    gap: 52px;
    align-items: stretch;
}

.lemesh-trust__left {
    min-width: 0;
}

.lemesh-trust__title {
    margin: 0;
    font-size: 44px;
    line-height: 1.08;
    font-weight: 800;
    color: #fff;
    max-width: 620px;
    letter-spacing: -0.01em;
}

.lemesh-trust__intro {
    margin-top: 18px;
    padding-left: 18px;
    border-left: 4px solid #1E7CE8;
    border-radius: 2px;
}

.lemesh-trust__subtitle {
    margin: 0;
    font-size: 17px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.72);
    max-width: 600px;
}

/* Main highlight card */
.lemesh-trust__main-card {
    display: flex;
    align-items: center;
    gap: 24px;
    min-height: 190px;
    margin-top: 34px;
    padding: 28px 30px;
    border-radius: 20px;
    border: 1px solid rgba(40, 135, 255, 0.8);
    background: linear-gradient(135deg, rgba(13, 42, 77, 0.92), rgba(6, 28, 54, 0.96));
    box-shadow: 0 0 0 1px rgba(40, 135, 255, 0.12), 0 18px 42px rgba(0, 86, 190, 0.16);
    transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.lemesh-trust__main-badge {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 74px;
    height: 74px;
    border-radius: 18px;
    background: linear-gradient(145deg, #0b2f5f, #143f70);
    border: 1px solid #1b75d0;
    box-shadow: inset 0 0 18px rgba(30, 124, 232, 0.25);
}

.lemesh-trust__main-text {
    min-width: 0;
}

.lemesh-trust__main-title {
    margin: 0;
    font-size: 30px;
    line-height: 1.15;
    font-weight: 800;
    color: #fff;
}

.lemesh-trust__main-desc {
    margin: 10px 0 0;
    font-size: 16px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.75);
}

/* Small cards row */
.lemesh-trust__cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 18px;
}

.lemesh-trust__card {
    display: flex;
    flex-direction: column;
    min-height: 260px;
    padding: 22px 20px;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: linear-gradient(145deg, rgba(20, 35, 53, 0.96), rgba(11, 25, 42, 0.98));
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.16);
    transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.lemesh-trust__card-badge {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: linear-gradient(145deg, #0b2f5f, #143f70);
    border: 1px solid rgba(27, 117, 208, 0.9);
    box-shadow: inset 0 0 14px rgba(30, 124, 232, 0.22);
}

.lemesh-trust__card-title {
    margin: 18px 0 0;
    font-size: 20px;
    line-height: 1.25;
    font-weight: 700;
    color: #fff;
}

.lemesh-trust__card-desc {
    margin: 10px 0 0;
    font-size: 14.5px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.68);
}

/* Right white checklist panel */
.lemesh-trust__right {
    min-width: 0;
    display: flex;
}

.lemesh-trust__panel {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100%;
    padding: 42px 46px;
    border-radius: 24px;
    background: #fff;
    color: #101b2c;
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.22), 0 0 0 1px rgba(255, 255, 255, 0.5);
}

.lemesh-trust__panel-title {
    margin: 0;
    font-size: 32px;
    line-height: 1.15;
    font-weight: 800;
    color: #101b2c;
    letter-spacing: -0.01em;
}

.lemesh-trust__panel-subtitle {
    margin: 16px 0 0;
    font-size: 16px;
    line-height: 1.5;
    color: #64748b;
}

.lemesh-trust__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 34px;
    margin: 30px 0 0;
    padding: 0;
    list-style: none;
}

.lemesh-trust__list li {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 72px;
    padding: 10px 0;
    border-bottom: 1px solid #e4e9f0;
    font-size: 16px;
    line-height: 1.4;
    color: #172235;
}

.lemesh-trust__check {
    flex: 0 0 auto;
    display: inline-flex;
    width: 26px;
    height: 26px;
}

.lemesh-trust__note {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: auto;
    padding: 18px 20px;
    border-radius: 14px;
    background: linear-gradient(90deg, #eef6ff, #e8f1ff);
}

.lemesh-trust__note-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid #dbe7f5;
}

.lemesh-trust__note p {
    margin: 0;
    font-size: 15px;
    line-height: 1.45;
    font-weight: 600;
    color: #143a66;
}

.lemesh-trust__cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    height: 64px;
    margin-top: 24px;
    padding: 0 24px;
    border: 0;
    border-radius: 14px;
    cursor: pointer;
    background: linear-gradient(90deg, #0865d8, #024bb5);
    color: #fff;
    font: inherit;
    font-size: 17px;
    font-weight: 700;
    box-shadow: 0 10px 26px rgba(0, 91, 220, 0.28), 0 0 14px rgba(0, 190, 255, 0.18);
    transition: transform 0.22s ease, box-shadow 0.22s ease, background 0.22s ease;
}

.lemesh-trust__cta-icon,
.lemesh-trust__cta-arrow {
    display: inline-flex;
    flex: 0 0 auto;
}

.lemesh-trust__cta-arrow {
    margin-left: auto;
}

/* Hover states (devices with real hover only) */
@media (hover: hover) and (pointer: fine) {
    .lemesh-trust__main-card:hover {
        transform: translateY(-3px);
        border-color: rgba(80, 160, 255, 1);
        box-shadow: 0 0 0 1px rgba(40, 135, 255, 0.22), 0 22px 52px rgba(0, 86, 190, 0.26);
    }

    .lemesh-trust__card:hover {
        transform: translateY(-3px);
        border-color: rgba(80, 160, 255, 0.55);
        box-shadow: 0 16px 34px rgba(0, 0, 0, 0.24), 0 0 18px rgba(30, 124, 232, 0.12);
    }

    .lemesh-trust__cta:hover {
        transform: translateY(-2px);
        box-shadow: 0 14px 32px rgba(0, 91, 220, 0.36), 0 0 18px rgba(0, 190, 255, 0.26);
    }
}

.lemesh-trust__cta:focus-visible {
    outline: 3px solid rgba(120, 190, 255, 0.9);
    outline-offset: 3px;
}

/* Entrance animation (armed only when JS adds .lemesh-trust--js; runs once via .lemesh-trust--in) */
@keyframes lemeshTrustFadeUp {
    from { opacity: 0; transform: translateY(26px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes lemeshTrustGlowIn {
    0% { opacity: 0; transform: translateY(26px); box-shadow: 0 0 0 1px rgba(40, 135, 255, 0.12), 0 0 0 rgba(0, 86, 190, 0); }
    60% { opacity: 1; box-shadow: 0 0 0 1px rgba(40, 135, 255, 0.28), 0 22px 56px rgba(0, 110, 240, 0.34); }
    100% { opacity: 1; transform: translateY(0); box-shadow: 0 0 0 1px rgba(40, 135, 255, 0.12), 0 18px 42px rgba(0, 86, 190, 0.16); }
}

@keyframes lemeshTrustSlideRight {
    from { opacity: 0; transform: translateX(32px); }
    to { opacity: 1; transform: translateX(0); }
}

.lemesh-trust--js .lemesh-trust__title,
.lemesh-trust--js .lemesh-trust__intro,
.lemesh-trust--js .lemesh-trust__main-card,
.lemesh-trust--js .lemesh-trust__card,
.lemesh-trust--js .lemesh-trust__panel,
.lemesh-trust--js .lemesh-trust__list li,
.lemesh-trust--js .lemesh-trust__note,
.lemesh-trust--js .lemesh-trust__cta {
    opacity: 0;
}

.lemesh-trust--js.lemesh-trust--in .lemesh-trust__title {
    animation: lemeshTrustFadeUp 0.65s ease-out 0s both;
}

.lemesh-trust--js.lemesh-trust--in .lemesh-trust__intro {
    animation: lemeshTrustFadeUp 0.65s ease-out 0.08s both;
}

.lemesh-trust--js.lemesh-trust--in .lemesh-trust__main-card {
    animation: lemeshTrustGlowIn 0.8s ease-out 0.15s both;
}

.lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(1) {
    animation: lemeshTrustFadeUp 0.6s ease-out 0.3s both;
}

.lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(2) {
    animation: lemeshTrustFadeUp 0.6s ease-out 0.42s both;
}

.lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(3) {
    animation: lemeshTrustFadeUp 0.6s ease-out 0.54s both;
}

.lemesh-trust--js.lemesh-trust--in .lemesh-trust__panel {
    animation: lemeshTrustSlideRight 0.8s cubic-bezier(0.22, 0.61, 0.36, 1) 0.25s both;
}

.lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(1) { animation: lemeshTrustFadeUp 0.5s ease-out 0.6s both; }
.lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(2) { animation: lemeshTrustFadeUp 0.5s ease-out 0.69s both; }
.lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(3) { animation: lemeshTrustFadeUp 0.5s ease-out 0.78s both; }
.lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(4) { animation: lemeshTrustFadeUp 0.5s ease-out 0.87s both; }
.lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(5) { animation: lemeshTrustFadeUp 0.5s ease-out 0.96s both; }
.lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(6) { animation: lemeshTrustFadeUp 0.5s ease-out 1.05s both; }

.lemesh-trust--js.lemesh-trust--in .lemesh-trust__note {
    animation: lemeshTrustFadeUp 0.55s ease-out 1.12s both;
}

.lemesh-trust--js.lemesh-trust--in .lemesh-trust__cta {
    animation: lemeshTrustFadeUp 0.55s ease-out 1.22s both;
}

@media (prefers-reduced-motion: reduce) {
    .lemesh-trust--js .lemesh-trust__title,
    .lemesh-trust--js .lemesh-trust__intro,
    .lemesh-trust--js .lemesh-trust__main-card,
    .lemesh-trust--js .lemesh-trust__card,
    .lemesh-trust--js .lemesh-trust__panel,
    .lemesh-trust--js .lemesh-trust__list li,
    .lemesh-trust--js .lemesh-trust__note,
    .lemesh-trust--js .lemesh-trust__cta {
        opacity: 1 !important;
        animation: none !important;
        transform: none !important;
    }
}

/* Tablet: single column */
@media (max-width: 1024px) {
    .lemesh-trust.lemesh-trust--v2 {
        padding: 60px 0;
    }

    .lemesh-trust__layout {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .lemesh-trust__title {
        font-size: 38px;
        max-width: none;
    }

    .lemesh-trust__cards {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .lemesh-trust__card {
        min-height: 220px;
    }

    .lemesh-trust__panel {
        padding: 34px 32px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .lemesh-trust.lemesh-trust--v2 {
        padding: 52px 0;
    }

    .lemesh-trust--v2::before {
        width: 220px;
        height: 160px;
        top: -30px;
        right: -70px;
        opacity: 0.12;
    }

    .lemesh-trust--v2::after {
        display: none;
    }

    .lemesh-trust__inner {
        width: calc(100% - 32px);
    }

    .lemesh-trust__layout {
        gap: 30px;
    }

    .lemesh-trust__title {
        font-size: 31px;
        line-height: 1.12;
    }

    .lemesh-trust__intro {
        margin-top: 14px;
        padding-left: 14px;
        border-left-width: 3px;
    }

    .lemesh-trust__subtitle {
        font-size: 15px;
    }

    .lemesh-trust__main-card {
        min-height: auto;
        margin-top: 24px;
        padding: 22px;
        gap: 18px;
    }

    .lemesh-trust__main-badge {
        width: 62px;
        height: 62px;
        border-radius: 15px;
    }

    .lemesh-trust__main-badge svg {
        width: 38px;
        height: 38px;
    }

    .lemesh-trust__main-title {
        font-size: 23px;
    }

    .lemesh-trust__main-desc {
        font-size: 14px;
        margin-top: 8px;
    }

    .lemesh-trust__cards {
        grid-template-columns: 1fr;
        gap: 12px;
        margin-top: 14px;
    }

    .lemesh-trust__card {
        min-height: auto;
        padding: 20px;
        flex-direction: row;
        align-items: flex-start;
        gap: 16px;
    }

    .lemesh-trust__card-badge {
        width: 50px;
        height: 50px;
        border-radius: 12px;
    }

    .lemesh-trust__card-badge svg {
        width: 30px;
        height: 30px;
    }

    .lemesh-trust__card-title {
        margin-top: 0;
        font-size: 17px;
    }

    .lemesh-trust__card-desc {
        font-size: 13.5px;
        margin-top: 6px;
    }

    .lemesh-trust__card-text {
        min-width: 0;
    }

    .lemesh-trust__panel {
        padding: 24px 20px;
        border-radius: 18px;
    }

    .lemesh-trust__panel-title {
        font-size: 24px;
    }

    .lemesh-trust__panel-subtitle {
        font-size: 14px;
        margin-top: 12px;
    }

    .lemesh-trust__list {
        grid-template-columns: 1fr;
        margin-top: 18px;
    }

    .lemesh-trust__list li {
        min-height: 52px;
        font-size: 15px;
    }

    .lemesh-trust__note {
        margin-top: 20px;
        padding: 14px 16px;
    }

    .lemesh-trust__note-icon {
        width: 46px;
        height: 46px;
        border-radius: 12px;
    }

    .lemesh-trust__note p {
        font-size: 13.5px;
    }

    .lemesh-trust__cta {
        height: 56px;
        margin-top: 18px;
        padding: 0 12px;
        gap: 8px;
        font-size: 14px;
        white-space: nowrap;
    }
}

/* After the one-shot entrance finishes, release elements so hover transforms work again */
.lemesh-trust--js .is-done {
    animation: none !important;
    opacity: 1 !important;
}

/* v1.4.55: hero texts dedup + advantages normalized to identical geometry (TZ: no repeated phrases, 3 equal advantage cells).
   Only hero content/advantages; photo, bg, H1, buttons, animation, header, sections below unchanged. */
.lemesh-hero__advantage {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    column-gap: 14px;
    align-items: center;
    font-size: 16px;
    line-height: 1.35;
    font-weight: 500;
}

.lemesh-hero__adv-icon {
    width: 28px;
    height: 28px;
    flex-shrink: 0;
}

.lemesh-hero__adv-icon svg {
    width: 28px;
    height: 28px;
}.lemesh-hero__advantage .lemesh-hero__adv-label,
.lemesh-hero__advantage .lemesh-hero__adv-title
    {
    display: block;
    font-size: 16px;
    line-height: 1.35;
}

.lemesh-hero__adv-title {
    font-weight: 600;
}

@media (min-width: 1025px) {
    .lemesh-hero__advantages {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 28px;
        max-width: none;
    }.lemesh-hero__advantage,
.lemesh-hero__advantage .lemesh-hero__adv-label,
.lemesh-hero__advantage .lemesh-hero__adv-title
    {
        font-size: 15px;
    }
}

/* Narrow/mid desktop: smaller type so subs stay on one line everywhere */
@media (min-width: 1025px) and (max-width: 1439px) {.lemesh-hero__advantage,
.lemesh-hero__advantage .lemesh-hero__adv-label,
.lemesh-hero__advantage .lemesh-hero__adv-title
    {
        font-size: 14px;
    }
}

/* Tight desktop band: slimmer type/icon/gaps keep every sub on one line */
@media (min-width: 1025px) and (max-width: 1280px) {
    .lemesh-hero__advantages {
        gap: 12px;
    }

    .lemesh-hero__advantage {
        grid-template-columns: 26px minmax(0, 1fr);
        column-gap: 12px;
    }.lemesh-hero__advantage,
.lemesh-hero__advantage .lemesh-hero__adv-label,
.lemesh-hero__advantage .lemesh-hero__adv-title
    {
        font-size: 13.5px;
    }

    .lemesh-hero__adv-icon {
        width: 26px;
        height: 26px;
    }

    .lemesh-hero__adv-icon svg {
        width: 26px;
        height: 26px;
    }
}

/* Tablet + mobile: vertical stack, identical item structure/height */
@media (max-width: 1024px) {
    .lemesh-hero__advantages {
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
        max-width: 420px;
    }
}

@media (max-width: 767px) {
    .lemesh-hero__advantage {
        grid-template-columns: 22px minmax(0, 1fr);
        column-gap: 10px;
        font-size: 14px;
    }

    .lemesh-hero__adv-icon {
        width: 22px;
        height: 22px;
    }

    .lemesh-hero__adv-icon svg {
        width: 20px;
        height: 20px;
    }.lemesh-hero__advantage .lemesh-hero__adv-label,
.lemesh-hero__advantage .lemesh-hero__adv-title
    {
        font-size: 14px;
    }
}

/* v1.4.56: trust section — vertical compaction for laptop viewports (TZ: fit 1366x768…1600x900).
   Desktop-only (≥1025); texts, order, colors, icons, animation, popup, mobile, neighbors unchanged. */
@media (min-width: 1025px) {
    .lemesh-trust.lemesh-trust--v2 {
        padding: 48px 0;
    }

    .lemesh-trust__layout {
        grid-template-columns: minmax(0, 47%) minmax(0, 53%);
        gap: 42px;
    }

    .lemesh-trust__title {
        font-size: clamp(36px, 3vw, 44px);
        line-height: 1.06;
    }

    .lemesh-trust__intro {
        margin-top: 12px;
    }

    .lemesh-trust__subtitle {
        font-size: 15.5px;
        line-height: 1.45;
    }

    .lemesh-trust__main-card {
        min-height: 158px;
        margin-top: 24px;
        padding: 22px 24px;
        gap: 20px;
    }

    .lemesh-trust__main-badge {
        width: 64px;
        height: 64px;
    }

    .lemesh-trust__main-badge svg {
        width: 42px;
        height: 42px;
    }

    .lemesh-trust__main-title {
        font-size: 28px;
    }

    .lemesh-trust__main-desc {
        font-size: 15px;
        line-height: 1.4;
        margin-top: 8px;
    }

    .lemesh-trust__cards {
        gap: 13px;
        margin-top: 16px;
    }

    .lemesh-trust__card {
        min-height: 212px;
        padding: 18px 16px;
    }

    .lemesh-trust__card-badge {
        width: 50px;
        height: 50px;
    }

    .lemesh-trust__card-badge svg {
        width: 32px;
        height: 32px;
    }

    .lemesh-trust__card-title {
        font-size: 17.5px;
        line-height: 1.22;
        margin-top: 14px;
    }

    .lemesh-trust__card-desc {
        font-size: 13.5px;
        line-height: 1.42;
        margin-top: 8px;
    }

    .lemesh-trust__panel {
        padding: 30px 34px;
    }

    .lemesh-trust__panel-title {
        font-size: 28px;
    }

    .lemesh-trust__panel-subtitle {
        font-size: 14.5px;
        margin-top: 8px;
        margin-bottom: 22px;
    }

    .lemesh-trust__list {
        margin-top: 0;
        column-gap: 26px;
    }

    .lemesh-trust__list li {
        min-height: 60px;
        font-size: 15px;
    }

    .lemesh-trust__note {
        padding: 14px 16px;
    }

    .lemesh-trust__note-icon {
        width: 44px;
        height: 44px;
        border-radius: 12px;
    }

    .lemesh-trust__note-icon svg {
        width: 26px;
        height: 26px;
    }

    .lemesh-trust__note p {
        font-size: 14px;
    }

    .lemesh-trust__cta {
        height: 55px;
        margin-top: 18px;
        font-size: 16px;
        border-radius: 12px;
    }
}

/* Low-height laptops: extra compact mode (1366x768, 1536x864 class viewports) */
@media (min-width: 1280px) and (max-height: 850px) {
    .lemesh-trust.lemesh-trust--v2 {
        padding: 36px 0;
    }

    .lemesh-trust__title {
        font-size: 36px;
    }

    .lemesh-trust__main-card {
        min-height: 138px;
    }

    .lemesh-trust__card {
        min-height: 190px;
    }

    .lemesh-trust__panel {
        padding: 26px 30px;
    }

    .lemesh-trust__list li {
        min-height: 54px;
    }
}

/* v1.4.57: trust section — entrance choreography + interactivity (TZ A).
   Motion/interaction only: grid, sizes, texts, colors, popup mechanics, section position unchanged. */

/* ---------- Inline architectural decor (replaces ::before/::after data-uri) ---------- */
.lemesh-trust--v2::before,
.lemesh-trust--v2::after {
    content: none;
}

.lemesh-trust__decor {
    position: absolute;
    width: 341px;
    height: 248px;
    pointer-events: none;
    opacity: 0.18;
}

.lemesh-trust__decor--tr {
    top: -40px;
    right: -60px;
    transform: rotate(8deg);
}

.lemesh-trust__decor--bl {
    left: -80px;
    bottom: -60px;
    transform: rotate(-6deg);
    opacity: 0.12;
}

.lemesh-trust__decor svg {
    display: block;
    width: 100%;
    height: 100%;
    transform: translate3d(var(--tpx, 0px), var(--tpy, 0px), 0);
    transition: transform 0.35s ease-out;
}

/* ---------- Entrance keyframes ---------- */
@keyframes lemeshTrustUp20 {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: none; }
}

@keyframes lemeshTrustUp14 {
    from { opacity: 0; transform: translateY(14px); }
    to { opacity: 1; transform: none; }
}

@keyframes lemeshTrustUp12 {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: none; }
}

@keyframes lemeshTrustUp8 {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: none; }
}

@keyframes lemeshTrustMainIn {
    from { opacity: 0; transform: translateY(24px) scale(0.985); }
    to { opacity: 1; transform: none; }
}

@keyframes lemeshTrustPanelIn2 {
    from { opacity: 0; transform: translateX(34px) scale(0.99); }
    to { opacity: 1; transform: none; }
}

@keyframes lemeshTrustDraw {
    to { stroke-dashoffset: 0; }
}

@keyframes lemeshTrustPop {
    from { opacity: 0; transform: scale(0.6); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes lemeshTrustPop8 {
    from { opacity: 0; transform: scale(0.8); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes lemeshTrustPop9 {
    from { opacity: 0; transform: scale(0.9); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes lemeshTrustIconFade {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: none; }
}

@keyframes lemeshTrustLineY {
    from { transform: scaleY(0); }
    to { transform: scaleY(1); }
}

@keyframes lemeshTrustLineX {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}

@keyframes lemeshTrustDecorInTR {
    from { opacity: 0; transform: rotate(8deg) translateX(20px); }
    to { opacity: 0.08; transform: rotate(8deg) translateX(0); }
}

@keyframes lemeshTrustDecorInBL {
    from { opacity: 0; transform: rotate(-6deg) translateX(20px); }
    to { opacity: 0.08; transform: rotate(-6deg) translateX(0); }
}

@keyframes lemeshTrustMainGlow {
    0% { box-shadow: 0 0 0 1px rgba(40, 135, 255, 0.12), 0 18px 42px rgba(0, 86, 190, 0.16); }
    45% { box-shadow: 0 0 0 1px rgba(40, 135, 255, 0.2), 0 0 28px rgba(0, 116, 255, 0.22), 0 18px 42px rgba(0, 86, 190, 0.16); }
    100% { box-shadow: 0 0 0 1px rgba(40, 135, 255, 0.12), 0 18px 42px rgba(0, 86, 190, 0.16); }
}

@keyframes lemeshTrustBadgeGlow {
    0% { box-shadow: inset 0 0 18px rgba(30, 124, 232, 0.25); }
    50% { box-shadow: inset 0 0 24px rgba(60, 150, 255, 0.45), 0 0 14px rgba(30, 124, 232, 0.3); }
    100% { box-shadow: inset 0 0 18px rgba(30, 124, 232, 0.25); }
}

@keyframes lemeshTrustPanelShadow {
    0% { box-shadow: 0 22px 60px rgba(0, 0, 0, 0.22), 0 0 0 1px rgba(255, 255, 255, 0.5); }
    50% { box-shadow: 0 26px 66px rgba(0, 0, 0, 0.28), 0 0 0 1px rgba(255, 255, 255, 0.5); }
    100% { box-shadow: 0 22px 60px rgba(0, 0, 0, 0.22), 0 0 0 1px rgba(255, 255, 255, 0.5); }
}

@keyframes lemeshTrustShine {
    from { transform: translateX(-120%) skewX(-18deg); }
    to { transform: translateX(220%) skewX(-18deg); }
}

/* ---------- Initial (hidden) states, armed only with JS ---------- */
.lemesh-trust--js .lemesh-trust__decor-line,
.lemesh-trust--js .lemesh-trust__stroke,
.lemesh-trust--js .lemesh-trust__tick {
    stroke-dasharray: 100;
    stroke-dashoffset: 100;
}

.lemesh-trust--js .lemesh-trust__pop,
.lemesh-trust--js .lemesh-trust__icon-fade,
.lemesh-trust--js .lemesh-trust__circle,
.lemesh-trust--js .lemesh-trust__note-icon svg {
    opacity: 0;
}

.lemesh-trust__pop,
.lemesh-trust__circle,
.lemesh-trust__note-icon svg {
    transform-box: fill-box;
    transform-origin: center;
}

/* Intro accent line: border replaced by a pseudo-element so it can scale in */
.lemesh-trust--js .lemesh-trust__intro {
    position: relative;
    border-left-color: transparent;
}

.lemesh-trust--js .lemesh-trust__intro::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    border-radius: 2px;
    background: #1E7CE8;
    transform: scaleY(0);
    transform-origin: top;
}

/* Checklist dividers: border replaced by a pseudo-element so it can scaleX in */
.lemesh-trust--js .lemesh-trust__list li {
    position: relative;
    border-bottom-color: transparent;
}

.lemesh-trust--js .lemesh-trust__list li::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 1px;
    background: #e4e9f0;
    transform: scaleX(0);
    transform-origin: left;
}

/* Count-up span: fixed width so 0→15 never shifts the layout */
.lemesh-trust__count {
    display: inline-block;
    min-width: 3ch;
    font-variant-numeric: tabular-nums;
}

/* CTA one-time shine strip */
.lemesh-trust__cta {
    position: relative;
    overflow: hidden;
}

.lemesh-trust__cta::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 45%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.35), transparent);
    transform: translateX(-120%) skewX(-18deg);
    pointer-events: none;
}

/* ---------- Desktop/tablet entrance timeline (>=768px), runs once via .lemesh-trust--in ---------- */
@media (min-width: 768px) {
    /* 1) background architectural drawing */
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__decor--tr { animation: lemeshTrustDecorInTR 1.2s ease-out 0s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__decor--bl { animation: lemeshTrustDecorInBL 1.2s ease-out 0s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__decor-line { animation: lemeshTrustDraw 1.5s ease-out 0.15s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__decor-line:nth-of-type(2) { animation-delay: 0.3s; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__decor-line:nth-of-type(3) { animation-delay: 0.45s; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__decor-line:nth-of-type(4) { animation-delay: 0.6s; }

    /* 2) title + subtitle + accent line */
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__title { animation: lemeshTrustUp20 0.65s cubic-bezier(0.22, 0.61, 0.36, 1) 0.1s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__intro { animation: lemeshTrustUp14 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) 0.24s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__intro::before { animation: lemeshTrustLineY 0.5s ease-out 0.24s both; }

    /* 3) main card + one-time contour glow + icon draw */
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__main-card {
        animation: lemeshTrustMainIn 0.75s cubic-bezier(0.22, 0.61, 0.36, 1) 0.35s both,
                   lemeshTrustMainGlow 0.9s ease-in-out 1.15s both;
    }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__main-badge { animation: lemeshTrustBadgeGlow 0.3s ease-out 1.5s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__stroke--frame { animation: lemeshTrustDraw 0.7s ease-out 0.55s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__stroke--vert { animation: lemeshTrustDraw 0.6s ease-out 0.7s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__stroke--horz { animation: lemeshTrustDraw 0.6s ease-out 0.85s both; }

    /* 4) three small cards */
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(1) { animation: lemeshTrustUp20 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) 0.7s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(2) { animation: lemeshTrustUp20 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) 0.83s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(3) { animation: lemeshTrustUp20 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) 0.96s both; }

    /* 5) small-card icon micro-animations (start 150ms after the card appears) */
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(1) .lemesh-trust__icon-fade { animation: lemeshTrustIconFade 0.5s ease-out 0.85s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(1) .lemesh-trust__stroke--l1 { animation: lemeshTrustDraw 0.3s ease-out 1s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(1) .lemesh-trust__stroke--l2 { animation: lemeshTrustDraw 0.3s ease-out 1.12s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(1) .lemesh-trust__stroke--l3 { animation: lemeshTrustDraw 0.3s ease-out 1.24s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(1) .lemesh-trust__pop { animation: lemeshTrustPop 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) 1.3s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(1) .lemesh-trust__tick { animation: lemeshTrustDraw 0.3s ease-out 1.45s both; }

    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(2) .lemesh-trust__stroke--head { animation: lemeshTrustDraw 0.5s ease-out 0.98s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(2) .lemesh-trust__stroke--body { animation: lemeshTrustDraw 0.5s ease-out 1.18s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(2) .lemesh-trust__pop { animation: lemeshTrustPop 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) 1.5s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(2) .lemesh-trust__tick { animation: lemeshTrustDraw 0.3s ease-out 1.62s both; }

    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(3) .lemesh-trust__stroke--shield { animation: lemeshTrustDraw 0.6s ease-out 1.11s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__card:nth-child(3) .lemesh-trust__tick { animation: lemeshTrustDraw 0.35s ease-out 1.55s both; }

    /* 6) white panel + soft shadow settle */
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__panel {
        animation: lemeshTrustPanelIn2 0.85s cubic-bezier(0.22, 0.61, 0.36, 1) 0.5s both,
                   lemeshTrustPanelShadow 0.8s ease-in-out 1.4s both;
    }

    /* 7) checklist rows: row fade + divider scaleX + circle pop + tick draw (90ms stagger) */
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(1) { animation: lemeshTrustUp8 0.42s ease-out 0.9s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(2) { animation: lemeshTrustUp8 0.42s ease-out 0.99s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(3) { animation: lemeshTrustUp8 0.42s ease-out 1.08s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(4) { animation: lemeshTrustUp8 0.42s ease-out 1.17s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(5) { animation: lemeshTrustUp8 0.42s ease-out 1.26s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(6) { animation: lemeshTrustUp8 0.42s ease-out 1.35s both; }

    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(1)::after { animation: lemeshTrustLineX 0.5s ease-out 0.95s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(2)::after { animation: lemeshTrustLineX 0.5s ease-out 1.04s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(3)::after { animation: lemeshTrustLineX 0.5s ease-out 1.13s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(4)::after { animation: lemeshTrustLineX 0.5s ease-out 1.22s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(5)::after { animation: lemeshTrustLineX 0.5s ease-out 1.31s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(6)::after { animation: lemeshTrustLineX 0.5s ease-out 1.4s both; }

    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(1) .lemesh-trust__circle { animation: lemeshTrustPop8 0.4s ease-out 0.98s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(2) .lemesh-trust__circle { animation: lemeshTrustPop8 0.4s ease-out 1.07s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(3) .lemesh-trust__circle { animation: lemeshTrustPop8 0.4s ease-out 1.16s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(4) .lemesh-trust__circle { animation: lemeshTrustPop8 0.4s ease-out 1.25s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(5) .lemesh-trust__circle { animation: lemeshTrustPop8 0.4s ease-out 1.34s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(6) .lemesh-trust__circle { animation: lemeshTrustPop8 0.4s ease-out 1.43s both; }

    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(1) .lemesh-trust__tick { animation: lemeshTrustDraw 0.38s ease-out 1.05s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(2) .lemesh-trust__tick { animation: lemeshTrustDraw 0.38s ease-out 1.14s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(3) .lemesh-trust__tick { animation: lemeshTrustDraw 0.38s ease-out 1.23s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(4) .lemesh-trust__tick { animation: lemeshTrustDraw 0.38s ease-out 1.32s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(5) .lemesh-trust__tick { animation: lemeshTrustDraw 0.38s ease-out 1.41s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__list li:nth-child(6) .lemesh-trust__tick { animation: lemeshTrustDraw 0.38s ease-out 1.5s both; }

    /* 8) info note + shield pop */
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__note { animation: lemeshTrustUp12 0.55s cubic-bezier(0.22, 0.61, 0.36, 1) 1.45s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__note-icon svg { animation: lemeshTrustPop9 0.35s ease-out 1.6s both; }

    /* 9) CTA last + one-time shine sweep */
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__cta { animation: lemeshTrustUp14 0.55s cubic-bezier(0.22, 0.61, 0.36, 1) 1.5s both; }
    .lemesh-trust--js.lemesh-trust--in .lemesh-trust__cta::after { animation: lemeshTrustShine 0.9s ease-in-out 2.35s both; }
}

/* ---------- Hover transitions (base) ---------- */
.lemesh-trust__card-badge,
.lemesh-trust__main-badge {
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.lemesh-trust__card-badge svg,
.lemesh-trust__main-badge svg {
    transition: transform 0.25s ease, filter 0.25s ease;
}

.lemesh-trust__panel {
    transition: box-shadow 0.25s ease;
}

.lemesh-trust__note {
    transition: background 0.25s ease, box-shadow 0.25s ease;
}

.lemesh-trust__list li {
    position: relative;
}

.lemesh-trust__list li::before {
    content: "";
    position: absolute;
    left: -8px;
    right: -8px;
    top: 2px;
    bottom: 3px;
    border-radius: 8px;
    background: #f3f8ff;
    opacity: 0;
    transition: opacity 0.2s ease;
    pointer-events: none;
}

.lemesh-trust__list li > * {
    position: relative;
}

.lemesh-trust__list li > span:last-child {
    transition: transform 0.2s ease;
}

.lemesh-trust__check circle,
.lemesh-trust__check path {
    transition: stroke 0.2s ease;
}

.lemesh-trust__cta-arrow {
    transition: transform 0.22s ease;
}

/* ---------- Hover states (real hover devices only, 250ms) ---------- */
@media (hover: hover) and (pointer: fine) {
    .lemesh-trust__main-card:hover {
        transform: translateY(-4px);
        border-color: rgba(96, 170, 255, 1);
        box-shadow: 0 0 0 1px rgba(40, 135, 255, 0.22), 0 24px 54px rgba(0, 86, 190, 0.28);
    }

    .lemesh-trust__main-card:hover .lemesh-trust__main-badge {
        border-color: #3a90e8;
        box-shadow: inset 0 0 20px rgba(50, 140, 255, 0.4);
    }

    .lemesh-trust__main-card:hover .lemesh-trust__main-badge svg {
        filter: drop-shadow(0 0 5px rgba(140, 200, 255, 0.6));
    }

    .lemesh-trust__card:hover {
        transform: translateY(-4px);
        border-color: rgba(70, 150, 255, 0.6);
        box-shadow: 0 16px 34px rgba(0, 0, 0, 0.24), 0 0 18px rgba(30, 124, 232, 0.14);
    }

    .lemesh-trust__card:hover .lemesh-trust__card-badge {
        border-color: rgba(70, 150, 255, 0.95);
        box-shadow: inset 0 0 16px rgba(30, 124, 232, 0.35);
    }

    .lemesh-trust__card:hover .lemesh-trust__card-badge svg {
        transform: scale(1.04);
    }

    .lemesh-trust__panel:hover {
        box-shadow: 0 24px 62px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(255, 255, 255, 0.5);
    }

    .lemesh-trust__list li:hover::before {
        opacity: 1;
    }

    .lemesh-trust__list li:hover > span:last-child {
        transform: translateX(2px);
    }

    .lemesh-trust__list li:hover .lemesh-trust__check circle,
    .lemesh-trust__list li:hover .lemesh-trust__check path {
        stroke: #0a5ce0;
    }

    .lemesh-trust__cta:hover .lemesh-trust__cta-arrow {
        transform: translateX(4px);
    }

    .lemesh-trust__cta:active {
        transform: translateY(0) scale(0.99);
    }
}

/* ---------- Cross-highlight: left cards -> checklist / CTA (JS toggles classes) ---------- */
.lemesh-trust--v2.lemesh-trust--link-check .lemesh-trust__check circle,
.lemesh-trust--v2.lemesh-trust--link-check .lemesh-trust__check path {
    stroke: #0a5ce0;
}

.lemesh-trust--v2.lemesh-trust--link-check .lemesh-trust__note {
    background: linear-gradient(90deg, #e1efff, #d7e9ff);
    box-shadow: 0 0 0 1px rgba(30, 124, 232, 0.28), 0 10px 24px rgba(0, 91, 220, 0.14);
}

.lemesh-trust--v2.lemesh-trust--link-cta .lemesh-trust__cta {
    box-shadow: 0 14px 32px rgba(0, 91, 220, 0.4), 0 0 20px rgba(0, 190, 255, 0.3);
}

/* ---------- Checklist popup: animated open/close + focus ---------- */
.lemesh-popup__overlay {
    opacity: 0;
    transition: opacity 0.25s ease;
}

.lemesh-popup__dialog {
    opacity: 0;
    transform: translateY(20px) scale(0.98);
    transition: opacity 0.35s ease, transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.lemesh-popup.is-open .lemesh-popup__overlay {
    opacity: 1;
}

.lemesh-popup.is-open .lemesh-popup__dialog {
    opacity: 1;
    transform: none;
}

.lemesh-popup__dialog:focus {
    outline: none;
}

/* ---------- Mobile (<=767px): simplified per-card reveal ---------- */
@media (max-width: 767px) {
    .lemesh-trust__decor--tr {
        width: 220px;
        height: 160px;
        top: -30px;
        right: -70px;
        opacity: 0.12;
    }

    .lemesh-trust__decor--bl {
        display: none;
    }

    /* neutralize desktop gating; title/intro/list stay visible, cards reveal on scroll */
    .lemesh-trust--js .lemesh-trust__title,
    .lemesh-trust--js .lemesh-trust__intro,
    .lemesh-trust--js .lemesh-trust__main-card,
    .lemesh-trust--js .lemesh-trust__card,
    .lemesh-trust--js .lemesh-trust__panel,
    .lemesh-trust--js .lemesh-trust__list li,
    .lemesh-trust--js .lemesh-trust__note,
    .lemesh-trust--js .lemesh-trust__cta {
        opacity: 1;
    }

    .lemesh-trust--js .lemesh-trust__decor-line {
        stroke-dashoffset: 0;
    }

    .lemesh-trust--js .lemesh-trust__intro {
        border-left-color: #1E7CE8;
    }

    .lemesh-trust--js .lemesh-trust__intro::before {
        display: none;
    }

    .lemesh-trust--js .lemesh-trust__list li {
        border-bottom-color: #e4e9f0;
    }

    .lemesh-trust--js .lemesh-trust__list li::after {
        display: none;
    }

    .lemesh-trust--js .lemesh-trust__reveal {
        opacity: 0;
        transform: translateY(16px);
        transition: opacity 0.55s ease, transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
    }

    .lemesh-trust--js .lemesh-trust__reveal.is-inview {
        opacity: 1;
        transform: none;
    }

    /* icon micro-animations, 20% shorter than desktop */
    .lemesh-trust--js .is-inview .lemesh-trust__stroke { animation: lemeshTrustDraw 0.48s ease-out 0.1s both; }
    .lemesh-trust--js .is-inview .lemesh-trust__stroke--l2 { animation-delay: 0.18s; }
    .lemesh-trust--js .is-inview .lemesh-trust__stroke--l3 { animation-delay: 0.26s; }
    .lemesh-trust--js .is-inview .lemesh-trust__stroke--body { animation-delay: 0.2s; }
    .lemesh-trust--js .is-inview .lemesh-trust__icon-fade { animation: lemeshTrustIconFade 0.4s ease-out 0.05s both; }
    .lemesh-trust--js .is-inview .lemesh-trust__pop { animation: lemeshTrustPop 0.32s cubic-bezier(0.34, 1.56, 0.64, 1) 0.34s both; }
    .lemesh-trust--js .is-inview .lemesh-trust__tick { animation: lemeshTrustDraw 0.28s ease-out 0.42s both; }
    .lemesh-trust--js .is-inview .lemesh-trust__circle { animation: lemeshTrustPop8 0.32s ease-out 0.1s both; }
    .lemesh-trust--js .is-inview .lemesh-trust__note-icon svg { animation: lemeshTrustPop9 0.28s ease-out 0.3s both; }

    /* CTA: tap feedback only */
    .lemesh-trust__cta:active {
        transform: scale(0.99);
    }

    /* popup fits small screens */
    .lemesh-popup__dialog {
        max-height: calc(100dvh - 32px);
        overflow-y: auto;
    }
}

/* ---------- Reduced motion: everything final & static ---------- */
@media (prefers-reduced-motion: reduce) {
    .lemesh-trust__decor svg {
        transition: none;
        transform: none;
    }

    .lemesh-trust__main-card:hover,
    .lemesh-trust__card:hover,
    .lemesh-trust__cta:hover,
    .lemesh-trust__cta:active,
    .lemesh-trust__cta:hover .lemesh-trust__cta-arrow,
    .lemesh-trust__card:hover .lemesh-trust__card-badge svg,
    .lemesh-trust__list li:hover > span:last-child {
        transform: none !important;
    }

    .lemesh-trust__cta::after {
        display: none;
    }

    .lemesh-popup__overlay {
        transition: opacity 0.2s ease;
    }

    .lemesh-popup__dialog {
        transform: none;
        transition: opacity 0.2s ease;
    }
}

/* v1.4.59: quiz section — vertical compaction for laptop viewports (TZ: fit 1366x768…1600x900).
   Desktop only (>=1025); questions/options/mechanics/JS/photo/result texts/mobile (<=767) unchanged. */
@media (min-width: 1025px) {
    /* Section: smaller vertical rhythm */
    .lemesh-quiz {
        padding: 44px 0;
    }

    .lemesh-quiz__grid {
        grid-template-columns: minmax(0, 50%) minmax(0, 50%);
        gap: 26px;
        align-items: stretch;
    }

    /* Left card: content-defined height */
    .lemesh-quiz__form {
        padding: 30px 34px;
        min-height: 0;
    }

    .lemesh-quiz__form .lemesh-section__title {
        font-size: 30px; /* TZ 2-line rule: "Рассчитайте предварительную" is 599px at 33px > 543px column; 30px is the max that keeps 2 lines */
        line-height: 1.05;
        margin: 0 0 12px;
    }

    .lemesh-quiz__form .lemesh-section__subtitle--small {
        font-size: 16px;
        line-height: 1.4;
        margin: 0 0 16px;
    }

    /* Progress: compact icons + tighter gaps (clickable area stays >= 44px) */
    .lemesh-quiz__progress {
        margin-bottom: 16px;
    }

    .lemesh-quiz__progress-step span {
        width: 46px;
        height: 46px;
    }

    .lemesh-quiz__progress-step span svg {
        width: 20px;
        height: 20px;
    }

    .lemesh-quiz__progress-step small {
        font-size: 13px;
    }

    .lemesh-quiz__progress::before,
    .lemesh-quiz__progress::after {
        top: 23px;
    }

    /* Step texts */
    .lemesh-quiz__counter {
        font-size: 14px;
        margin: 0 0 8px;
    }

    .lemesh-quiz__question {
        font-size: 20px;
        margin: 0 0 6px;
    }

    .lemesh-quiz__hint {
        font-size: 14px;
        line-height: 1.35;
        margin: 0 0 14px;
    }

    /* Options: 52px rows, 9px gap */
    .lemesh-quiz__options {
        gap: 9px;
    }

    .lemesh-quiz__option {
        min-height: 52px;
        padding: 13px 44px 13px 18px;
        font-size: 15px;
    }

    .lemesh-quiz__option::after {
        width: 26px;
        height: 26px;
    }

    /* Nav button */
    .lemesh-quiz__nav {
        margin-top: 13px;
    }

    .lemesh-quiz__next,
    .lemesh-quiz__back {
        min-height: 52px;
        font-size: 16px;
    }

    /* Right photo: follows the left card height, no fixed heights.
       img is absolute so its intrinsic 3:4 aspect does not force the grid row height. */
    .lemesh-quiz__visual {
        position: relative;
        min-height: 0;
        border-radius: 20px;
    }

    .lemesh-quiz__visual img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        min-height: 0;
        object-fit: cover;
        object-position: center;
        border-radius: 20px;
    }

    /* Result card: compact, anchored bottom-left */
    .lemesh-quiz__result-card {
        top: auto;
        bottom: 24px;
        left: 24px;
        transform: none;
        width: 340px;
        max-width: calc(100% - 48px);
        padding: 24px;
    }

    .lemesh-quiz__result-card h3 {
        font-size: 22px;
        margin: 0 0 12px;
    }

    .lemesh-quiz__result-card ul {
        font-size: 15px;
        line-height: 1.4;
        gap: 8px;
    }

    .lemesh-quiz__result-card li {
        margin-bottom: 8px;
    }
}

/* Compact desktop mode for viewport heights up to 900px */
@media (min-width: 1025px) and (max-height: 900px) {
    .lemesh-quiz {
        padding: 38px 0;
    }

    .lemesh-quiz__form {
        padding: 27px 32px;
    }

    .lemesh-quiz__form .lemesh-section__subtitle--small {
        font-size: 15px;
        margin-bottom: 14px;
    }

    .lemesh-quiz__progress {
        margin-bottom: 14px;
    }

    .lemesh-quiz__progress-step span {
        width: 44px;
        height: 44px;
    }

    .lemesh-quiz__progress::before,
    .lemesh-quiz__progress::after {
        top: 22px;
    }

    .lemesh-quiz__options {
        gap: 8px;
    }

    .lemesh-quiz__option {
        min-height: 50px;
    }

    .lemesh-quiz__nav {
        margin-top: 12px;
    }

    .lemesh-quiz__next,
    .lemesh-quiz__back {
        min-height: 50px;
    }

    .lemesh-quiz__result-card {
        padding: 22px;
    }
}

/* Extra-compact mode for viewport heights up to 800px (1366x768 class) */
@media (min-width: 1025px) and (max-height: 800px) {
    .lemesh-quiz {
        padding: 26px 0;
    }

    .lemesh-quiz__form {
        padding: 24px 26px;
    }

    .lemesh-quiz__form .lemesh-section__title {
        font-size: 30px;
    }

    .lemesh-quiz__form .lemesh-section__subtitle--small {
        font-size: 15px;
        margin-bottom: 14px;
    }

    .lemesh-quiz__question {
        font-size: 19px;
    }

    .lemesh-quiz__progress {
        margin-bottom: 14px;
    }

    .lemesh-quiz__progress-step span {
        width: 41px;
        height: 41px;
    }

    .lemesh-quiz__progress::before,
    .lemesh-quiz__progress::after {
        top: 20.5px;
    }

    .lemesh-quiz__options {
        gap: 8px;
    }

    .lemesh-quiz__option {
        min-height: 47px;
        padding-top: 11px;
        padding-bottom: 11px;
    }

    .lemesh-quiz__nav {
        margin-top: 12px;
    }

    .lemesh-quiz__next,
    .lemesh-quiz__back {
        min-height: 50px;
    }

    .lemesh-quiz__result-card {
        padding: 19px;
    }
}


/* ===================================================================
   v1.4.60 — Final CTA block rebuild (premium dark gradient + light form card)
   Texts/markup updated in page-landing.php; form handler, fields, phone
   mask, consent checkbox and submit flow are unchanged.
   =================================================================== */

/* Honeypot must never occupy a grid/flex cell (base rule was <=768-only) */
.lemesh-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    opacity: 0;
}

/* --- Desktop >=1025 --- */
@media (min-width: 1025px) {
    .lemesh-callback {
        background: linear-gradient(135deg, #082541 0%, #0c3156 100%);
        padding: 72px 0;
        min-height: 0;
        display: block;
    }

    .lemesh-callback__grid {
        max-width: 1240px;
        width: calc(100% - 64px);
        margin-inline: auto;
        padding-left: 0;
        padding-right: 0;
        grid-template-columns: minmax(0, 42%) minmax(0, 58%);
        gap: 48px;
        align-items: center;
    }

    .lemesh-callback__content .lemesh-section__title {
        font-size: clamp(42px, 3.2vw, 46px);
        line-height: 1.08;
        font-weight: 800;
        color: #fff;
        max-width: 520px;
        text-transform: none;
        margin-bottom: 0;
    }

    .lemesh-callback__subtitle {
        font-size: 17px;
        line-height: 1.5;
        color: rgba(255, 255, 255, 0.72);
        max-width: 520px;
        margin: 20px 0 0;
    }

    .lemesh-callback__features {
        flex-direction: column;
        align-items: flex-start;
        flex-wrap: nowrap;
        gap: 14px;
        margin-top: 28px;
    }

    .lemesh-callback__feature {
        display: flex;
        align-items: center;
        gap: 12px;
        font-size: 16px;
        line-height: 1.4;
        color: rgba(255, 255, 255, 0.88);
    }

    .lemesh-callback__feature svg {
        width: 24px;
        height: 24px;
        color: #8fc1ff;
        flex-shrink: 0;
    }

    /* Form: standalone light card, height by content (grid center) */
    .lemesh-callback__form {
        width: 100%;
        max-width: none;
        justify-self: stretch;
        align-self: center;
        background: #fff;
        border-radius: 22px;
        padding: 36px;
        box-shadow: 0 22px 60px rgba(0, 0, 0, 0.22);
    }

    .lemesh-callback__form .lemesh-form__title {
        grid-column: 1 / -1;
        font-size: 29px;
        line-height: 1.15;
        font-weight: 800;
        color: #152033;
        margin: 0;
    }

    .lemesh-callback__form .lemesh-form__subtitle {
        grid-column: 1 / -1;
        font-size: 15px;
        line-height: 1.45;
        color: #64748b;
        margin: 10px 0 28px;
    }

    .lemesh-callback__form .lemesh-form {
        gap: 16px;
    }

    .lemesh-callback__form .lemesh-form__label span {
        font-size: 14px;
        font-weight: 600;
        color: #1f2937;
        margin-bottom: 0;
    }

    .lemesh-callback__form .lemesh-form__checkbox {
        margin: 0;
    }

    /* Old ≥1025 rule set height:54px on ALL form inputs — restore checkbox size */
    .lemesh-callback__form .lemesh-form__checkbox input {
        width: 22px;
        height: 22px;
        min-height: 0;
        margin-top: 1px;
    }

    .lemesh-callback__form .lemesh-input {
        height: 54px;
        min-height: 0;
        border-radius: 10px;
        font-size: 15px;
        padding: 0 16px;
    }

    .lemesh-callback__form textarea.lemesh-input {
        height: auto;
        min-height: 110px;
        padding: 14px 16px;
    }

    .lemesh-callback__form .lemesh-btn {
        width: 100%;
        height: 56px;
        min-height: 0;
        font-size: 16px;
        font-weight: 700;
        border-radius: 10px;
        background: #0865c7;
        border-color: #0865c7;
        transition: transform 200ms ease, box-shadow 200ms ease, background-color 200ms ease;
    }

    .lemesh-callback__form .lemesh-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 24px rgba(8, 101, 199, 0.25);
        background: #0865c7;
        border-color: #0865c7;
    }

    .lemesh-callback__form .lemesh-form__note {
        font-size: 12.5px;
        line-height: 1.4;
        color: #8a94a3;
        text-align: center;
        margin: 14px 0 0;
    }
}

/* --- Tablet 768-1024: keep stacked layout, apply new skin --- */
@media (min-width: 768px) and (max-width: 1024px) {
    .lemesh-callback {
        background: linear-gradient(135deg, #082541 0%, #0c3156 100%);
        min-height: 0;
        display: block;
        padding: 64px 0;
    }

    .lemesh-callback__content .lemesh-section__title {
        text-transform: none;
    }

    .lemesh-callback__features {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .lemesh-callback__feature svg {
        width: 24px;
        height: 24px;
        color: #8fc1ff;
    }

    .lemesh-callback__form {
        border-radius: 22px;
        box-shadow: 0 22px 60px rgba(0, 0, 0, 0.22);
    }
}

/* --- Mobile <=767 --- */
@media (max-width: 767px) {
    .lemesh-callback {
        background: linear-gradient(135deg, #082541 0%, #0c3156 100%);
        padding: 52px 0;
        min-height: 0;
        display: block;
    }

    .lemesh-callback__grid {
        width: calc(100% - 32px);
        padding-left: 0;
        padding-right: 0;
        gap: 28px;
    }

    .lemesh-callback__content .lemesh-section__title {
        font-size: 33px;
        line-height: 1.1;
        font-weight: 800;
        color: #fff;
        text-transform: none;
        margin-bottom: 0;
    }

    .lemesh-callback__subtitle {
        font-size: 15px;
        line-height: 1.5;
        color: rgba(255, 255, 255, 0.72);
        margin: 14px 0 0;
    }

    .lemesh-callback__features {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        margin-top: 22px;
    }

    .lemesh-callback__feature {
        display: flex;
        align-items: center;
        gap: 12px;
        font-size: 15px;
        line-height: 1.4;
        color: rgba(255, 255, 255, 0.88);
    }

    .lemesh-callback__feature svg {
        width: 24px;
        height: 24px;
        color: #8fc1ff;
        flex-shrink: 0;
    }

    .lemesh-callback__form {
        padding: 22px 18px;
        border-radius: 18px;
        box-shadow: 0 18px 44px rgba(0, 0, 0, 0.22);
    }

    .lemesh-callback__form .lemesh-form {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .lemesh-callback__form .lemesh-form__title {
        font-size: 24px;
        line-height: 1.15;
        font-weight: 800;
        color: #152033;
        margin: 0;
    }

    .lemesh-callback__form .lemesh-form__subtitle {
        font-size: 14px;
        line-height: 1.45;
        color: #64748b;
        margin: 8px 0 20px;
    }

    .lemesh-callback__form .lemesh-form__label span {
        font-size: 14px;
        font-weight: 600;
        color: #1f2937;
        margin-bottom: 0;
    }

    .lemesh-callback__form .lemesh-form__checkbox {
        margin: 0;
    }

    .lemesh-callback__form .lemesh-input {
        border-radius: 10px;
        font-size: 15px;
    }

    .lemesh-callback__form .lemesh-btn {
        width: 100%;
        height: 56px;
        min-height: 0;
        font-size: 16px;
        font-weight: 700;
        border-radius: 10px;
        background: #0865c7;
        border-color: #0865c7;
    }

    .lemesh-callback__form .lemesh-form__note {
        font-size: 12px;
        line-height: 1.4;
        color: #8a94a3;
        text-align: center;
        margin: 12px 0 0;
    }
}

/* --- Entrance (JS-gated; skipped entirely under prefers-reduced-motion) ---
   Left column: fade-up 650ms. Form card: opacity + translateX(24px) 750ms,
   delay 180ms. Fields are NOT animated individually. Once-only via IO 0.25. */
.lemesh-callback--js .lemesh-callback__content,
.lemesh-callback--js .lemesh-callback__form {
    opacity: 0;
}

/* v1.4.63 fix: pre-animation form card is translated +24px; on mobile that
   extended document scrollWidth by 8px until IO fired. Clip horizontally. */
.lemesh-callback {
    overflow-x: clip;
}

.lemesh-callback--js .lemesh-callback__content {
    transform: translateY(20px);
    transition: opacity 650ms ease, transform 650ms ease;
}

.lemesh-callback--js .lemesh-callback__form {
    transform: translateX(24px);
    transition: opacity 750ms ease 180ms, transform 750ms ease 180ms;
}

.lemesh-callback--js.is-inview .lemesh-callback__content,
.lemesh-callback--js.is-inview .lemesh-callback__form {
    opacity: 1;
    transform: none;
}


/* ===================================================================
   v1.4.61 — hero advantages: identical geometry for all 3 items.
   Item 2 sub «под ваш бюджет» removed in markup (page-landing.php).
   No per-item overrides: same width/height/icon/line-height/gap for
   all three; no translate/absolute/individual margins for item 2.
   =================================================================== */
@media (min-width: 1025px) {
    .lemesh-hero__advantages {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 28px;
        align-items: start;
    }

    .lemesh-hero__advantage {
        display: grid;
        grid-template-columns: 30px minmax(0, 1fr);
        column-gap: 14px;
        align-items: start;
        min-width: 0;
        font-size: 16px;
        line-height: 1.35;
        font-weight: 500;
    }

    .lemesh-hero__adv-icon {
        width: 30px;
        height: 30px;
        flex-shrink: 0;
    }

    .lemesh-hero__adv-icon svg {
        width: 30px;
        height: 30px;
    }.lemesh-hero__advantage .lemesh-hero__adv-label,
.lemesh-hero__advantage .lemesh-hero__adv-title
    {
        font-size: 16px;
        line-height: 1.35;
    }
}

/* Narrow desktop: 16px physically wraps subs to extra lines (col ~125px),
   breaking the uniform row — 14px keeps every sub on one line.
   Same size for all three items; icons/gaps unchanged (30px / 28 / 14). */
@media (min-width: 1025px) and (max-width: 1439px) {.lemesh-hero__advantage,
.lemesh-hero__advantage .lemesh-hero__adv-label,
.lemesh-hero__advantage .lemesh-hero__adv-title
    {
        font-size: 14px;
    }
}

/* Tightest band (col ~112px): 13px so the longest sub still fits one line */
@media (min-width: 1025px) and (max-width: 1280px) {.lemesh-hero__advantage,
.lemesh-hero__advantage .lemesh-hero__adv-label,
.lemesh-hero__advantage .lemesh-hero__adv-title
    {
        font-size: 13px;
    }
}


/* ===================================================================
   v1.4.62 — new logo lockup (client-supplied), larger and readable.
   Full lockup image (icon + «ЛЕМЕШ ПРО» wordmark) replaces the old
   square icon + HTML brand text in header; footer gets the same image
   on a white plate (wordmark is black, footer bg is dark).
   =================================================================== */

.lemesh-logo__img {
    width: auto;
    max-width: none;
    height: 42px;
    flex-shrink: 0;
}

@media (min-width: 768px) {
    .lemesh-logo__img {
        height: 50px;
    }
}

@media (min-width: 1025px) {
    .lemesh-logo__img {
        height: 64px;
    }
}

/* Tight header band: nav + phone + CTA all stay — slightly smaller lockup */
@media (min-width: 1151px) and (max-width: 1439px) {
    .lemesh-logo__img {
        height: 56px;
    }
}

/* Footer: dark bg (#111820) — white rounded plate keeps the black
   wordmark readable */
.lemesh-logo__img--footer {
    width: auto;
    height: 60px;
    background: #ffffff;
    border-radius: 12px;
    padding: 10px 14px;
    box-sizing: border-box;
}


/* ===================================================================
   v1.4.69 — final marketing/responsive round (client feedback).

   1) Mobile hero (<=767px ONLY): single ad screen — the approved hero
      photo becomes the full-bleed background, dark gradient overlay,
      offer + real advantages + one CTA sit on top of the photo.
      Replaces the old "framed photo -> separate white text block"
      scheme. Image file, srcset, desktop composition untouched.
   2) Hero advantages (all viewports): pseudo-USPs replaced by real
      ones (markup); desktop keeps v1.4.61 uniform grid geometry.
   3) Reviews: draft label turned into a visible notice plate.
   4) Fixed mobile bar: safe-area-inset-bottom respected.
   Desktop hero composition, trust block, quiz, services, portfolio,
   forms, handlers, analytics and header are NOT changed here.
   =================================================================== */

/* ---------- 1. Mobile hero: single background screen (<=767px) ---------- */
@media (max-width: 767px) {
    .lemesh-hero {
        position: relative;
        display: block;
        height: auto;
        min-height: calc(100vh - 61px);
        min-height: calc(100svh - 61px);
        padding: 0;
        overflow: hidden;
    }

    .lemesh-hero__grid {
        display: block;
        position: relative;
        min-height: 0;
        max-height: none;
    }

    /* Approved photo as the full-bleed background */
    .lemesh-hero__visual {
        position: absolute;
        inset: 0;
        z-index: 0;
        width: 100%;
        height: 100%;
        min-height: 0;
        max-height: none;
        margin: 0;
        border-radius: 0;
        overflow: hidden;
    }

    .lemesh-hero__visual img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        min-height: 0;
        max-height: none;
        object-fit: cover;
        /* House + panoramic glazing stay in frame; calmer sky/lawn on
           the left carries the text block */
        object-position: var(--lemesh-hero-pos-mob, 68% 50%);
        border-radius: 0;
    }

    /* Dark overlay: vertical ramp + light horizontal aid for text side */
    .lemesh-hero__visual::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 1;
        width: auto;
        height: auto;
        background:
            linear-gradient(90deg, rgba(3, 18, 34, 0.34) 0%, rgba(3, 18, 34, 0) 58%),
            linear-gradient(180deg, rgba(3, 18, 34, 0.22) 0%, rgba(3, 18, 34, 0.46) 42%, rgba(3, 18, 34, 0.90) 100%);
        -webkit-mask-image: none;
        mask-image: none;
    }

    .lemesh-hero__visual::after {
        content: none;
    }

    /* Offer, advantages and CTA on top of the photo, bottom-anchored */
    .lemesh-hero__content {
        position: relative;
        z-index: 2;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        width: 100%;
        max-width: none;
        min-height: calc(100vh - 61px);
        min-height: calc(100svh - 61px);
        padding: 24px 20px 32px;
        overflow: visible;
    }

    .lemesh-hero__content-inner {
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;
    }

    .lemesh-hero__title {
        /* 32px/9vw (TZ asked 34/9.2): at 34px the string «с фиксированной»
           (343px ink) overflows the 320px container at 360px and balance
           drops a 1-letter «с» orphan line; -2px keeps wraps clean on
           360-430px, visually identical */
        font-size: clamp(32px, 9vw, 42px);
        line-height: 1.02;
        font-weight: 800;
        letter-spacing: -0.025em;
        color: #fff;
        text-shadow: 0 2px 16px rgba(0, 0, 0, 0.28);
        margin: 0;
        /* Sentence case + balanced wraps: uppercase at this size breaks
           «С ФИКСИРОВАННОЙ» into a 1-letter orphan line on 360-430px */
        text-transform: none;
        text-wrap: balance;
    }

    .lemesh-hero__title span {
        white-space: normal;
    }

    .lemesh-hero__objects {
        display: block;
        font-size: 16px;
        line-height: 1.4;
        color: rgba(255, 255, 255, 0.86);
        margin: 14px 0 0;
        max-width: 340px;
    }

    /* Second sentence is desktop-only (mobile keeps one short line) */
    .lemesh-hero__objects-tail {
        display: none;
    }

    .lemesh-hero__advantages {
        display: flex;
        flex-direction: column;
        gap: 9px;
        margin: 18px 0 0;
        max-width: none;
    }

    .lemesh-hero__advantage {
        display: grid;
        grid-template-columns: 24px minmax(0, 1fr);
        column-gap: 10px;
        align-items: start;
        color: #fff;
        font-size: 14px;
        line-height: 1.35;
    }

    .lemesh-hero__adv-icon {
        width: 24px;
        height: 24px;
        flex-shrink: 0;
        color: #9BCBFF;
    }

    .lemesh-hero__adv-icon svg {
        width: 22px;
        height: 22px;
    }

    .lemesh-hero__advantage .lemesh-hero__adv-label,
    .lemesh-hero__advantage .lemesh-hero__adv-title {
        display: block;
        font-size: 14px;
        line-height: 1.35;
        color: #fff;
        text-shadow: 0 1px 10px rgba(0, 0, 0, 0.3);
    }

    /* Single full-width primary CTA inside the first viewport */
    .lemesh-hero__cta {
        margin-top: 20px;
    }

    .lemesh-hero__cta .lemesh-btn--primary {
        width: 100%;
        height: 54px;
        min-height: 54px;
        border-radius: 12px;
        background: #0865c7;
        border-color: #0865c7;
        color: #fff;
        font-size: 16px;
        font-weight: 700;
    }

    /* Secondary CTA stays out of the first mobile viewport (fixed bar
       and the callback section cover it) */
    .lemesh-hero__cta .lemesh-btn--outline {
        display: none;
    }

    /* Note duplicates advantage #1 and would not fit the first screen */
    .lemesh-hero__cta-note {
        display: none;
    }
}

/* ---------- 2. Mobile hero entrance: one quick fade, no long stagger ---------- */
@keyframes lemesh-hero-mob-content-in {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes lemesh-hero-mob-img-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@media (max-width: 767px) {
    /* Per-element stagger from v1.4.46 is off; one shared content fade */
    .lemesh-hero__title,
    .lemesh-hero__objects,
    .lemesh-hero__advantages,
    .lemesh-hero__cta,
    .lemesh-hero__cta-note {
        animation: none;
    }

    .lemesh-hero__content-inner {
        animation: lemesh-hero-mob-content-in 0.5s cubic-bezier(0.22, 0.61, 0.36, 1) both;
    }

    .lemesh-hero__visual img {
        animation: lemesh-hero-mob-img-in 0.6s ease-out both;
    }
}

@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
    .lemesh-hero__content-inner,
    .lemesh-hero__visual img {
        animation: none;
    }
}

/* ---------- 5. Services cards: image fills its frame (display fix) ----------
   Desktop (>=1025): the image box is 230px but an old rule pinned the img
   to 220px, leaving a 10px white band at the bottom of every card.
   img now fills the frame; object-fit: cover keeps the approved crop.
   Mobile (220px frame, img 100%) was already correct — untouched. */
@media (min-width: 1025px) {
    .lemesh-service-card__image img {
        height: 100%;
    }
}


/* ===================================================================
   v1.5.0 — Mobile final pass (pre-handover, client TZ 2026-07-16).

   Mobile-only (<=767px) unless stated otherwise:
   1) Section order now comes from the DOM (page-landing.php reordered);
      all legacy mobile `order` rules and the fixed bottom CTA bar
      (markup + styles + body padding reservations) are removed.
   2) Header: larger logo, phone icon (tel:), 44px burger, 66px bar.
   3) Hero: single full-screen photo, offer + one CTA on the photo,
      no advantage list, no fixed-bar bottom clearance. svh-based.
   4) Reusable mobile slider (CSS scroll-snap + JS "1 / N" counter):
      trust cards, assurance (4), services (6), portfolio (3), reviews (3).
      No autoplay, no external libs. Desktop grids untouched.
   5) Reusable mobile accordion (real <button>, aria-expanded/controls):
      cost factors, includes groups, materials. First item open by
      default, single-open mode. Desktop: heads hidden/static, panels
      always visible (display:contents keeps the original grids).
   6) Steps section hidden on mobile only (kept on desktop).
   7) Reviews visible, draft amber label removed.
   =================================================================== */

/* ---------- Shared: header phone icon is mobile-only ---------- */
.lemesh-header__phone-icon {
    display: none;
}

/* ---------- Shared: slider counter (injected by JS, mobile only) ---------- */
.lemesh-mslider__counter {
    display: none;
}

/* ---------- Shared: accordion chevron ---------- */
.lemesh-macc__chev {
    position: relative;
    flex: 0 0 26px;
    width: 26px;
    height: 26px;
    margin-left: auto;
    border-radius: 50%;
    background: var(--lemesh-blue-light);
}

.lemesh-macc__chev::before,
.lemesh-macc__chev::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 2px;
    background: var(--lemesh-blue);
    border-radius: 2px;
    transform: translate(-50%, -50%);
    transition: transform 0.25s ease;
}

.lemesh-macc__chev::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.lemesh-macc__item.is-open > .lemesh-macc__head .lemesh-macc__chev::after {
    transform: translate(-50%, -50%) rotate(0deg);
}

/* ---------- Desktop: accordion markup is transparent (original grids) ---------- */
@media (min-width: 768px) {
    .lemesh-macc__chev {
        display: none;
    }

    /* Includes: groups/panels/inner/ul melt into the two-col checklist grid */
    .lemesh-includes__group,
    .lemesh-includes__group .lemesh-macc__panel,
    .lemesh-includes__group .lemesh-macc__panel-inner,
    .lemesh-includes__group ul {
        display: contents;
    }

    .lemesh-includes__group .lemesh-macc__head {
        display: none;
    }

    /* Materials: items/panels/inner melt into the 3-col gallery grid */
    .lemesh-materials__item,
    .lemesh-materials__item .lemesh-macc__panel,
    .lemesh-materials__item .lemesh-macc__panel-inner {
        display: contents;
    }

    .lemesh-materials__item .lemesh-macc__head {
        display: none;
    }

    /* Cost: head is the static card content (icon + title), body always open */
    .lemesh-cost__factor-head {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        width: 100%;
        padding: 0;
        background: none;
        border: 0;
        font: inherit;
        color: inherit;
        text-align: left;
        cursor: default;
    }

    .lemesh-cost__factor-body p {
        margin: 0;
        font-size: 15px;
        font-weight: 400;
        line-height: 1.45;
        color: #5a6b7d;
    }

    /* Hero subtitle: full version on desktop */
    .lemesh-hero__objects-short {
        display: none;
    }
}

/* ===================================================================
   MOBILE (max-width: 767px)
   =================================================================== */
@media (max-width: 767px) {

    /* ---------- 0. Frame ---------- */
    :root {
        --header-height: 66px;
    }

    body.lemesh-demo-body {
        padding-bottom: 0;
    }

    /* ---------- 1. Header: bigger logo + phone icon + 44px burger ---------- */
    .lemesh-header__inner {
        min-height: 66px;
        gap: 8px;
    }

    .lemesh-logo__img {
        width: auto;
        height: 46px;
        max-width: 152px;
        object-fit: contain;
    }

    .lemesh-header__phone-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 44px;
        width: 44px;
        height: 44px;
        margin-left: auto;
        border-radius: 12px;
        color: var(--lemesh-blue);
        transition: background-color 0.2s ease, color 0.2s ease;
    }

    .lemesh-header__phone-icon:active {
        background: var(--lemesh-blue-light);
        color: var(--lemesh-blue-dark);
    }

    .lemesh-burger {
        width: 44px;
        height: 44px;
        align-items: center;
        justify-content: center;
        gap: 5px;
        padding: 0;
        flex: 0 0 44px;
    }

    .lemesh-mobile-menu {
        top: 66px;
    }

    /* ---------- 2. Hero: single photo screen, offer + one CTA ---------- */
    .lemesh-hero {
        min-height: calc(100vh - 66px);
        min-height: calc(100svh - 66px);
    }

    .lemesh-hero__content {
        min-height: calc(100vh - 66px);
        min-height: calc(100svh - 66px);
        /* v1.5.2: text block lifted 16px off the bottom edge (44-52px spec) */
        padding: 24px 20px 48px;
    }

    .lemesh-hero__title {
        /* v1.5.2: clamp(40px,11vw,48px) из ТЗ физически не влезает:
           неразрывное слово «фиксированной» = 8.72 × font-size чернилом
           (800 weight, ls -0.035em), край секции = vw. Предел:
           20px + 8.72·fs ≤ vw → 38px@360, 39.4@375, 41@390, 43.5@414, 44@430.
           Берём максимум без клипа/сироты — большее слово просто обрезает. */
        font-size: clamp(38px, 10.5vw, 44px);
        line-height: 0.98;
        font-weight: 800;
        letter-spacing: -0.035em;
        max-width: 350px;
        margin: 0;
        text-wrap: balance;
    }

    /* One balanced flow — no 1-letter orphan lines on 360-430px */
    .lemesh-hero__title span {
        display: inline;
    }

    .lemesh-hero__objects {
        margin: 14px 0 0;
        max-width: 300px;
        font-size: 16px;
        line-height: 1.4;
        color: rgba(255, 255, 255, 0.88);
    }

    .lemesh-hero__objects-full {
        display: none;
    }

    .lemesh-hero__objects-short {
        display: block;
    }

    /* No mini-USP list, no second button, no cta-note inside mobile hero */
    .lemesh-hero__advantages {
        display: none;
    }

    .lemesh-hero__cta {
        margin-top: 20px;
    }

    .lemesh-hero__cta .lemesh-btn--primary {
        width: 100%;
        height: 56px;
        min-height: 56px;
        border-radius: 12px;
        font-size: 16px;
        font-weight: 700;
    }

    /* ---------- 3. Reusable mobile slider (swipe, snap, no autoplay) ---------- */
    /* TASK-001: axis-lock без борьбы осей — pan-x+pan-y (нативная блокировка оси
       после slop), proximity вместо mandatory (нет snap-back дёрганья при
       вертикальном свайпе), overscroll contain по X, цепочка по Y к странице. */
    .lemesh-mslider {
        --mslider-w: 82%;
        --mslider-bleed: 20px;
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: var(--mslider-w);
        grid-template-columns: none;
        gap: 14px;
        touch-action: pan-x pan-y pinch-zoom;
        overflow-x: auto;
        overflow-y: visible;
        overscroll-behavior-x: contain;
        overscroll-behavior-y: auto;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
        margin: -6px calc(-1 * var(--mslider-bleed)) 0;
        padding: 6px var(--mslider-bleed) 10px;
        scroll-padding-inline: var(--mslider-bleed);
        -webkit-overflow-scrolling: touch;
    }

    .lemesh-mslider::-webkit-scrollbar {
        display: none;
    }

    .lemesh-mslider > * {
        scroll-snap-align: start;
        scroll-snap-stop: normal;
        min-width: 0;
    }

    .lemesh-mslider:focus-visible {
        outline: 2px solid var(--lemesh-blue);
        outline-offset: 2px;
        border-radius: 8px;
    }

    .lemesh-mslider__counter {
        display: block;
        margin-top: 12px;
        text-align: center;
        font-size: 13px;
        font-weight: 700;
        letter-spacing: 0.06em;
        color: #45647f;
        font-variant-numeric: tabular-nums;
    }

    /* ---------- 4. Trust: compact, cards -> slider, right after hero ---------- */
    .lemesh-trust.lemesh-trust--v2 {
        padding: 48px 0;
    }

    .lemesh-trust__title {
        font-size: 31px;
        line-height: 1.08;
    }

    .lemesh-trust__intro {
        margin-top: 12px;
    }

    .lemesh-trust__subtitle {
        font-size: 15px;
        line-height: 1.45;
        color: rgba(255, 255, 255, 0.72);
    }

    .lemesh-trust__main-card {
        margin-top: 20px;
        padding: 20px;
    }

    .lemesh-trust__main-desc {
        font-size: 14px;
        line-height: 1.45;
    }

    .lemesh-trust__cards.lemesh-mslider {
        --mslider-w: 84%;
        --mslider-bleed: 16px;
        margin-top: 14px;
        gap: 12px;
    }

    .lemesh-trust__cards .lemesh-trust__card {
        min-height: 140px;
        padding: 18px;
        gap: 14px;
        align-content: flex-start;
        border-radius: 16px;
    }

    .lemesh-trust__cards .lemesh-trust__card-title {
        font-size: 16px;
        line-height: 1.25;
    }

    .lemesh-trust__cards .lemesh-trust__card-desc {
        font-size: 14px;
        line-height: 1.45;
    }

    .lemesh-trust__cards .lemesh-mslider__counter {
        color: rgba(255, 255, 255, 0.8);
    }

    .lemesh-trust__panel {
        padding: 20px 18px;
    }

    .lemesh-trust__panel-title {
        font-size: 21px;
        line-height: 1.2;
    }

    .lemesh-trust__panel-subtitle {
        margin: 8px 0 14px;
    }

    .lemesh-trust__list {
        row-gap: 6px;
    }

    .lemesh-trust__list li {
        min-height: 44px;
        font-size: 14px;
        line-height: 1.35;
    }

    .lemesh-trust__cta {
        height: 54px;
        font-size: 15px;
    }

    /* ---------- 5. Assurance: 4 process cards -> slider ---------- */
    .lemesh-assurance {
        padding: 44px 0;
        background: linear-gradient(180deg, #f2f7fd 0%, #eaf3fc 100%);
    }

    /* ---------- 6. Services: 6 cards -> slider ---------- */
    .lemesh-services {
        padding: 48px 0;
    }

    .lemesh-services .lemesh-section__title {
        margin-bottom: 24px;
    }

    .lemesh-services__grid.lemesh-mslider {
        --mslider-w: 88%;
    }

    .lemesh-services__grid.lemesh-mslider .lemesh-service-card {
        display: flex;
        flex-direction: column;
        border-radius: 18px;
        overflow: hidden;
    }

    .lemesh-services__grid.lemesh-mslider .lemesh-service-card__image {
        height: 220px;
        flex: 0 0 auto;
    }

    .lemesh-services__grid.lemesh-mslider .lemesh-service-card__body {
        padding: 18px;
    }

    .lemesh-services__grid.lemesh-mslider .lemesh-service-card h3 {
        font-size: 20px;
        line-height: 1.2;
    }

    .lemesh-services__grid.lemesh-mslider .lemesh-service-card p {
        font-size: 14px;
        line-height: 1.45;
        color: #5b6d7e;
        -webkit-line-clamp: 3;
    }

    .lemesh-services__grid.lemesh-mslider .lemesh-service-card__link {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
        margin-top: 10px;
        padding-top: 0;
        font-size: 14px;
        font-weight: 700;
    }

    /* ---------- 7. Quiz: compaction + no big photo on mobile ---------- */
    .lemesh-quiz {
        padding: 48px 0;
    }

    .lemesh-quiz .lemesh-section__title--small {
        font-size: 30px;
        line-height: 1.05;
        overflow-wrap: normal;
        word-break: normal;
        hyphens: none;
    }

    .lemesh-quiz .lemesh-section__subtitle--small {
        font-size: 14px;
        line-height: 1.45;
    }

    .lemesh-quiz__form {
        padding: 22px 18px;
    }

    .lemesh-quiz__progress-step span {
        width: 38px;
        height: 38px;
    }

    .lemesh-quiz__progress::before,
    .lemesh-quiz__progress::after {
        top: 19px;
    }

    .lemesh-quiz__progress-step small {
        display: block;
        font-size: 11.5px;
    }

    .lemesh-quiz__question {
        font-size: 20px;
        line-height: 1.3;
    }

    .lemesh-quiz__hint {
        font-size: 14px;
    }

    .lemesh-quiz__options {
        gap: 10px;
    }

    .lemesh-quiz__option {
        min-height: 52px;
        font-size: 14px;
        line-height: 1.35;
    }

    .lemesh-quiz__next,
    .lemesh-quiz__back {
        min-height: 54px;
        font-size: 15px;
    }

    /* Big veranda photo leaves the mobile flow (file kept; desktop/tablet
       still show it). The result card stays, static, right after the form. */
    .lemesh-quiz__grid {
        row-gap: 0;
    }

    .lemesh-quiz__visual {
        margin-top: 0;
    }

    .lemesh-quiz__visual > img {
        display: none;
    }

    .lemesh-quiz__result-card {
        position: static;
        width: 100%;
        margin-top: 16px;
        padding: 18px;
        border-radius: 14px;
        background: #fff;
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
        transform: none;
    }

    .lemesh-quiz__result-card h3 {
        font-size: 20px;
        line-height: 1.2;
        margin: 0 0 10px;
    }

    .lemesh-quiz__result-card ul {
        display: grid;
        gap: 6px;
    }

    .lemesh-quiz__result-card li {
        font-size: 14px;
        line-height: 1.45;
    }

    /* ---------- 8. Cost: factors -> accordion, variants compact ---------- */
    .lemesh-cost {
        padding: 48px 0;
    }

    .lemesh-cost__subtitle {
        margin: 12px auto 24px;
        font-size: 15px;
    }

    .lemesh-cost__factors {
        display: block;
        margin: 0 0 24px;
        padding-bottom: 24px;
        border-bottom: 1px solid var(--lemesh-border);
    }

    .lemesh-cost__factors li {
        display: block;
        padding: 0;
        margin-bottom: 10px;
    }

    .lemesh-cost__factor-head {
        display: flex;
        align-items: center;
        gap: 12px;
        width: 100%;
        min-height: 58px;
        padding: 12px 14px;
        background: none;
        border: 0;
        font: inherit;
        color: inherit;
        text-align: left;
        cursor: pointer;
    }

    .lemesh-cost__factor-icon {
        width: 38px;
        height: 38px;
        flex: 0 0 38px;
    }

    .lemesh-cost__factor-title {
        flex: 1 1 auto;
        font-size: 14px;
        line-height: 1.35;
        font-weight: 700;
    }

    .lemesh-cost__factor-body p {
        margin: 0;
        padding: 0 16px 16px;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.5;
        color: #5a6b7d;
    }

    .lemesh-cost__levels-subtitle {
        margin: 0 0 18px;
    }

    .lemesh-cost__variants {
        gap: 14px;
    }

    .lemesh-cost__variant {
        min-height: 0;
        padding: 20px 18px;
    }

    .lemesh-cost__plate {
        padding: 14px 16px;
        font-size: 14px;
    }

    .lemesh-cost__cta .lemesh-btn {
        width: 100%;
        min-height: 54px;
    }

    /* ---------- 9. Portfolio: real projects -> slider ---------- */
    .lemesh-portfolio {
        padding: 48px 0;
    }

    .lemesh-portfolio__intro {
        margin-bottom: 8px;
    }

    .lemesh-portfolio__grid.lemesh-mslider {
        --mslider-w: 89%;
    }

    .lemesh-portfolio__grid.lemesh-mslider .lemesh-portfolio-card {
        border-radius: 18px;
        overflow: hidden;
    }

    .lemesh-portfolio__grid.lemesh-mslider .lemesh-portfolio-card__image {
        height: auto;
        aspect-ratio: 4 / 3;
    }

    .lemesh-portfolio__grid.lemesh-mslider .lemesh-portfolio-card__image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .lemesh-portfolio__grid.lemesh-mslider .lemesh-portfolio-card__body {
        padding: 16px 18px 18px;
    }

    .lemesh-portfolio__grid.lemesh-mslider .lemesh-portfolio-card__body h3 {
        font-size: 19px;
        line-height: 1.2;
        margin: 0 0 8px;
    }

    .lemesh-portfolio__grid.lemesh-mslider .lemesh-portfolio-card__meta li {
        font-size: 14px;
        line-height: 1.45;
    }

    /* ---------- 10. Steps: desktop-only (content covered by includes/quiz) ---------- */
    .lemesh-steps {
        display: none;
    }

    /* ---------- 11. Includes: groups -> accordion ---------- */
    .lemesh-includes {
        padding: 44px 0;
    }

    .lemesh-includes__subtitle {
        margin: 10px auto 22px;
        font-size: 15px;
    }

    .lemesh-includes__groups {
        display: block;
    }

    .lemesh-includes__group {
        margin-bottom: 10px;
        background: #fff;
        border: 1px solid var(--lemesh-border);
        border-radius: 12px;
        overflow: hidden;
    }

    .lemesh-includes__group.is-open {
        border-color: var(--lemesh-blue);
    }

    .lemesh-includes__group-head {
        display: flex;
        align-items: center;
        gap: 12px;
        width: 100%;
        min-height: 58px;
        padding: 14px 16px;
        background: none;
        border: 0;
        font: inherit;
        color: inherit;
        text-align: left;
        cursor: pointer;
    }

    .lemesh-includes__group-title {
        font-size: 16px;
        font-weight: 700;
        line-height: 1.3;
    }

    .lemesh-includes__group ul {
        list-style: none;
        margin: 0;
        padding: 2px 16px 16px;
    }

    .lemesh-includes__group li {
        font-size: 15px;
        margin-bottom: 10px;
    }

    .lemesh-includes__group li:last-child {
        margin-bottom: 0;
    }

    .lemesh-includes__note {
        margin-top: 18px;
        padding: 14px 16px;
        font-size: 14px;
    }

    /* ---------- 12. Materials: photo cards -> accordion ---------- */
    .lemesh-materials {
        padding: 44px 0;
    }

    .lemesh-materials__subtitle {
        margin: 10px auto 22px;
        font-size: 15px;
    }

    .lemesh-materials__gallery {
        display: block;
        margin-bottom: 16px;
    }

    .lemesh-materials__item {
        margin-bottom: 10px;
        background: #fff;
        border: 1px solid var(--lemesh-border);
        border-radius: 14px;
        overflow: hidden;
    }

    .lemesh-materials__item.is-open {
        border-color: var(--lemesh-blue);
    }

    .lemesh-materials__head {
        display: flex;
        align-items: center;
        gap: 12px;
        width: 100%;
        min-height: 58px;
        padding: 14px 16px;
        background: none;
        border: 0;
        font: inherit;
        color: inherit;
        text-align: left;
        cursor: pointer;
    }

    .lemesh-materials__head-title {
        font-size: 16px;
        font-weight: 700;
        line-height: 1.3;
    }

    .lemesh-materials__body figure {
        margin: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .lemesh-materials__body .lemesh-materials__gallery img,
    .lemesh-materials__body img {
        width: 100%;
        height: 210px;
        object-fit: cover;
    }

    .lemesh-materials__item:nth-child(1) .lemesh-materials__body img {
        object-position: 50% 50%;
    }

    .lemesh-materials__item:nth-child(2) .lemesh-materials__body img {
        object-position: 50% 38%;
    }

    .lemesh-materials__item:nth-child(3) .lemesh-materials__body img {
        object-position: 50% 30%;
    }

    .lemesh-materials__body figcaption {
        position: static;
        padding: 12px 16px 16px;
        background: none;
        color: var(--lemesh-dark);
    }

    /* Title already lives in the accordion head — no duplication inside */
    .lemesh-materials__body .lemesh-materials__card-title {
        display: none;
    }

    .lemesh-materials__body .lemesh-materials__card-desc {
        display: block;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.5;
        color: #5a6b7d;
    }

    .lemesh-materials__note {
        font-size: 14px;
    }

    /* ---------- 13. Bottom (Evgeniy + guarantees): compact ---------- */
    .lemesh-bottom {
        padding: 48px 0;
    }

    .lemesh-bottom__card {
        padding: 22px 18px;
    }

    .lemesh-bottom__card--manager {
        gap: 18px;
    }

    .lemesh-bottom__photo {
        height: 240px;
    }

    .lemesh-bottom__photo img {
        object-position: 50% 18%;
    }

    .lemesh-bottom__manager-text h3 {
        margin-bottom: 4px;
    }

    .lemesh-bottom__facts li {
        margin-bottom: 6px;
    }

    .lemesh-bottom__card--guarantees {
        padding: 22px 18px;
    }

    .lemesh-bottom__guarantees-list {
        gap: 12px;
    }

    /* ---------- 14. Reviews: visible, cards -> slider ---------- */
    .lemesh-reviews {
        padding: 48px 0;
    }

    .lemesh-reviews__grid.lemesh-mslider {
        --mslider-w: 86%;
    }

    .lemesh-reviews__grid.lemesh-mslider .lemesh-review-card {
        min-height: 280px;
        padding: 24px;
    }

    .lemesh-reviews__grid.lemesh-mslider .lemesh-review-card__text {
        font-size: 15px;
        line-height: 1.55;
    }

    /* ---------- 15. FAQ: tap targets + smooth open ---------- */
    .lemesh-faq__question {
        min-height: 56px;
        padding: 14px 16px;
        font-size: 16px;
        line-height: 1.35;
    }

    .lemesh-faq__answer {
        padding: 0 16px 16px;
        font-size: 15px;
    }

    .lemesh-faq__item[open] .lemesh-faq__answer {
        animation: lemesh-faq-answer-in 0.25s ease both;
    }

    /* ---------- 16. Final form: compact, no duplicated legal note ---------- */
    .lemesh-callback {
        padding: 48px 0;
    }

    .lemesh-callback__form .lemesh-input {
        height: 52px;
    }

    .lemesh-callback__form textarea.lemesh-input {
        height: auto;
        min-height: 100px;
    }

    .lemesh-callback__form .lemesh-btn {
        height: 54px;
    }

    /* Checkbox carries the consent — the note under the button duplicates it */
    .lemesh-callback__form .lemesh-form__note {
        display: none;
    }
}

/* FAQ open animation (shared, desktop harmless) */
@keyframes lemesh-faq-answer-in {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

/* ===================================================================
   Reusable mobile accordion engine (<=767px).
   Panels collapse via grid-template-rows 0fr -> 1fr (no JS measuring,
   no layout jumps). visibility keeps closed content out of the a11y
   tree and tab order. Desktop renders panels plainly (see above).
   =================================================================== */
@media (max-width: 767px) {
    .lemesh-macc__head {
        -webkit-tap-highlight-color: transparent;
        touch-action: manipulation;
    }

    .lemesh-macc__head:focus-visible {
        outline: 2px solid var(--lemesh-blue);
        outline-offset: -2px;
    }

    .lemesh-macc__panel {
        display: grid;
        grid-template-rows: 0fr;
        visibility: hidden;
        transition: grid-template-rows 0.28s ease, visibility 0s linear 0.28s;
    }

    .lemesh-macc__panel-inner {
        min-height: 0;
        overflow: hidden;
    }

    .lemesh-macc__item.is-open > .lemesh-macc__panel {
        grid-template-rows: 1fr;
        visibility: visible;
        transition: grid-template-rows 0.28s ease, visibility 0s;
    }
}

/* ---------- Reduced motion: instant accordions, static sliders ---------- */
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
    .lemesh-macc__panel,
    .lemesh-macc__item.is-open > .lemesh-macc__panel {
        transition: none;
    }

    .lemesh-macc__chev::before,
    .lemesh-macc__chev::after {
        transition: none;
    }

    .lemesh-faq__item[open] .lemesh-faq__answer {
        animation: none;
    }

    .lemesh-mslider {
        scroll-behavior: auto;
    }
}


/* ===================== v1.5.5: portfolio — gazebo replaces fronton (3 cards) ===================== */
/* Desktop ≥992: one row of 3 (grid is repeat(3, 1fr) by default — no override needed).
   Image slots keep the v1.5.4 aspect-ratio 4/3 behaviour (was fixed px height) so every
   object stays fully readable — no side/top cropping; uniform slots for all cards. */
@media (min-width: 992px) {
    .lemesh-portfolio-card__image {
        height: auto;
        aspect-ratio: 4 / 3;
    }

    .lemesh-portfolio-card__image img {
        height: 100%;
    }

    /* Cards share one grid row — content height is enough */
    .lemesh-portfolio-card {
        min-height: 0;
    }
}


/* ===================== v1.6.0: admin-driven bits ===================== */
/* Квиз: изображение на mobile — опция из админки (по умолчанию скрыто, как в v1.5.2) */
@media (max-width: 767px) {
    .lemesh-quiz__visual--show-mobile > img {
        display: block;
    }
}

/* Hero: варианты затемнения (medium — текущее, без класса) */
/* v1.6.1b: селект типа объекта — на всю ширину (визуальная симметрия компактной формы) */
@media (min-width: 1025px) {
    .lemesh-callback__form .lemesh-form__label:has(select) {
        grid-column: 1 / -1;
    }
}

/* ===================== v1.6.1: compact callback form on desktop ===================== */
/* Форма финальной секции была избыточно крупной: уже карточка, плотнее поля,
   аккуратнее заголовок. Mobile (<1025px) не меняется. */
@media (min-width: 1025px) {
    .lemesh-callback__form {
        max-width: 560px;
        padding: 24px 26px;
        border-radius: 14px;
    }

    .lemesh-callback__form .lemesh-form {
        gap: 12px;
    }

    .lemesh-callback__form .lemesh-form__title {
        font-size: 20px;
        margin: 0;
    }

    .lemesh-callback__form .lemesh-form__subtitle {
        font-size: 13px;
        margin: 0 0 10px;
    }

    .lemesh-callback__form .lemesh-form__label {
        gap: 4px;
    }

    .lemesh-callback__form .lemesh-form__label span {
        font-size: 13px;
        margin-bottom: 0;
    }

    /* Селекторы с той же специфичностью, что исходные (.lemesh-callback .lemesh-form input),
       но позже в файле — побеждают по порядку следования. */
    .lemesh-callback .lemesh-form input,
    .lemesh-callback .lemesh-form select {
        height: 46px;
        min-height: 0; /* сброс старого min-height: 54px (used height = max(height, min-height)) */
        font-size: 15px;
        padding-left: 14px;
        padding-right: 14px;
    }

    .lemesh-callback .lemesh-form textarea {
        height: auto;
        min-height: 84px;
        padding-left: 14px;
        padding-right: 14px;
    }

    .lemesh-callback__form .lemesh-form__checkbox {
        font-size: 13px;
        gap: 8px;
    }

    .lemesh-callback__form .lemesh-form__checkbox input {
        width: 18px;
        height: 18px;
    }

    .lemesh-callback .lemesh-form .lemesh-btn {
        height: 48px;
        min-height: 48px;
        font-size: 16px;
    }

    .lemesh-callback__form .lemesh-form__note {
        font-size: 12px;
        margin: 0;
    }
}


/* ===================== TASK-001 §1: мобильные reveal-анимации в пределах 10–14px ===================== */
/* trust reveal 16→12px; callback content 20→12px; form slide-X 24px → мягкий slide-Y 12px.
   Desktop не меняется. will-change не используется; слушатели passive; once-only. */
@media (max-width: 767px) {
    .lemesh-trust--js .lemesh-trust__reveal {
        transform: translateY(12px);
    }

    .lemesh-callback--js .lemesh-callback__content,
    .lemesh-callback--js .lemesh-callback__form {
        transform: translateY(12px);
    }
}


/* ===================== TASK-001 §2: multiple-select опции квиза ===================== */
/* Выбранное состояние: галочка + синяя граница + светло-синий фон.
   Толщина границы не меняется (1px как у обычной опции) — текст не двигается.
   Tap target: опции ≥48px (min-height 52px уже задан базовыми стилями). */
.lemesh-quiz__option--check {
    position: relative;
    padding-left: 42px;
    text-align: left;
}

.lemesh-quiz__option--check::before {
    content: '';
    position: absolute;
    left: 14px;
    top: 50%;
    width: 18px;
    height: 18px;
    margin-top: -9px;
    border: 1.5px solid var(--lemesh-border);
    border-radius: 5px;
    background: var(--lemesh-white);
    transition: background var(--lemesh-transition), border-color var(--lemesh-transition);
}

.lemesh-quiz__option--check::after {
    content: '';
    position: absolute;
    left: 19px;
    top: 50%;
    width: 9px;
    height: 5px;
    margin-top: -4px;
    border-left: 2.2px solid #fff;
    border-bottom: 2.2px solid #fff;
    transform: rotate(-45deg) scale(0);
    transform-origin: center;
    transition: transform 0.15s ease;
}

.lemesh-quiz__option--check.lemesh-quiz__option--selected {
    background: var(--lemesh-blue-light);
    color: var(--lemesh-blue);
    border-color: var(--lemesh-blue);
    box-shadow: none;
}

.lemesh-quiz__option--check.lemesh-quiz__option--selected::before {
    background: var(--lemesh-blue);
    border-color: var(--lemesh-blue);
}

.lemesh-quiz__option--check.lemesh-quiz__option--selected::after {
    transform: rotate(-45deg) scale(1);
}


/* ===================== TASK-001 §3: лёгкая hero-анимация ===================== */
/* Дрейф изображения — только transform (GPU), alternate, без layout и белых краёв.
   Контент появляется один раз. Один блик CTA после загрузки, без pulse. */

@keyframes lemesh-hero-drift {
    from { transform: scale(1.01) translate(0, 0); }
    to   { transform: scale(1.035) translate(-0.5%, -0.3%); }
}

@keyframes lemesh-hero-drift-mob {
    from { transform: scale(1) translate(0, 0); }
    to   { transform: scale(1.025) translate(-0.4%, -0.2%); }
}

@keyframes lemesh-cta-shine {
    from { transform: translateX(-130%) skewX(-18deg); }
    to   { transform: translateX(230%) skewX(-18deg); }
}

/* --- Desktop: дрейф 16s, scale 1.01→1.035, translate ≤ −0.5%/−0.3% --- */
@media (min-width: 768px) {
    .lemesh-hero__visual {
        overflow: hidden; /* дрейф не вылезает за рамку колонки */
    }

    .lemesh-hero__visual img {
        animation:
            lemesh-hero-visual-in 0.9s cubic-bezier(0.22, 0.61, 0.36, 1) both,
            lemesh-hero-drift 16s ease-in-out 1.2s infinite alternate;
        transform-origin: 100% 50%;
    }
}

/* --- Mobile: дрейф 20s, scale ≤1.025, translate ≤0.4% --- */
@media (max-width: 767px) {
    .lemesh-hero__visual img {
        animation:
            lemesh-hero-mob-img-in 0.6s ease-out both,
            lemesh-hero-drift-mob 20s ease-in-out 1s infinite alternate;
        transform-origin: 50% 50%;
    }
}

/* --- Появление контента один раз: H1 600ms/12px, subtitle +90ms, CTA +170ms --- */
@media (min-width: 768px) {
    .lemesh-hero__title {
        animation-duration: 0.6s;
        animation-delay: 0s;
    }

    .lemesh-hero__objects {
        animation-delay: 0.09s;
    }

    .lemesh-hero__cta {
        animation-delay: 0.17s;
    }
}

/* --- Один мягкий блик CTA после загрузки (1s, один раз) --- */
.lemesh-hero__cta .lemesh-btn--primary {
    position: relative;
    overflow: hidden;
}

.lemesh-hero__cta .lemesh-btn--primary::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 45%;
    background: linear-gradient(100deg, transparent 0%, rgba(255, 255, 255, 0.32) 50%, transparent 100%);
    transform: translateX(-130%) skewX(-18deg);
    animation: lemesh-cta-shine 1s ease 1.6s 1 both;
    pointer-events: none;
}

/* --- Reduced motion: без дрейфа, входа и блика; остальная механика intact --- */
@media (prefers-reduced-motion: reduce) {
    .lemesh-hero__visual img {
        animation: none !important;
    }

    .lemesh-hero__cta .lemesh-btn--primary::after {
        display: none;
    }
}


/* ===================== TASK-001 §1b: overflow-x = 0 на 360px ===================== */
/* Прогресс-бар квиза держал min-content ~312px и раздувал форму до 348px
   при 320px контейнере → 8px горизонтальный скролл страницы.
   min-width: 0 позволяет сжаться; подписи шагов помещаются. */
@media (max-width: 767px) {
    .lemesh-quiz__grid,
    .lemesh-quiz__form,
    .lemesh-quiz__progress,
    .lemesh-quiz__progress-step {
        min-width: 0;
    }
}


/* ===================== TASK-002/TASK-006: снятие scroll-snap на время вертикального жеста ===================== */
/* Класс ставит JS после определения оси жеста; убирает snap-back iOS Safari при
   вертикальном свайпе по карточке. Горизонтальный свайп не затронут.
   TASK-006 (touch axis-lock): правило глобальное, а не только mobile — на >=768px
   оно покрывает и desktop-трек отзывов (второй селектор с specificity выше
   .lemesh-reviews__slider--js .lemesh-reviews__grid). */
.lemesh-mslider--no-snap,
.lemesh-reviews__slider--js .lemesh-reviews__grid.lemesh-mslider--no-snap {
    scroll-snap-type: none;
}


/* ===================== TASK-002 (итерация 2): статичные карточки двух слайдеров на mobile ===================== */
/* Замечание проверки на реальном iPhone: в слайдере trust (карточка «Цена и состав
   работ в договоре») и в слайдере assurance (карточка «Проверяем объект») карточки
   вертикально «плавают» при обычной вертикальной прокрутке — это вертикальный
   reveal transform (translateY) + transition, а не scrollLeft/snap-back.
   Фикс ТОЛЬКО для этих двух треков и только на mobile: transform убран из reveal
   полностью (transform: none до и после появления), оставлен лёгкий opacity-fade.
   После первого появления карточки статичны; смещения при касании нет, т.к.
   transform исключён и из transition. Остальные слайдеры и desktop не затронуты. */
@media (max-width: 767px) {
    /* Trust: карточки первого слайдера (.lemesh-trust__cards.lemesh-mslider) */
    .lemesh-trust--js .lemesh-trust__cards.lemesh-mslider .lemesh-trust__card.lemesh-trust__reveal,
    .lemesh-trust--js .lemesh-trust__cards.lemesh-mslider .lemesh-trust__card.lemesh-trust__reveal.is-inview {
        transform: none;
        transition: opacity 0.45s ease;
    }
}


/* ===================================================================
   v1.7.0 — TASK-003: кейсы с историями, «Сложные ситуации»,
   «Гарантия и обслуживание», премиальная визуальная полировка.
   Hover/reveal-эффекты — только точные указатели (iPhone не затронут).
   =================================================================== */

/* ---------- Кейсы (portfolio): бейдж типа, краткий результат, CTA ---------- */
.lemesh-case-card__image {
    position: relative;
}

.lemesh-case-card__type {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 2;
    padding: 6px 13px;
    border-radius: 999px;
    background: rgba(10, 37, 64, 0.78);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.03em;
    line-height: 1.3;
    pointer-events: none;
}

.lemesh-portfolio-card__body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}

.lemesh-case-card__result {
    margin: 0 0 16px;
    font-size: 14.5px;
    line-height: 1.5;
    color: #5b6d7e;
}

.lemesh-case-card__open {
    margin-top: auto;
    align-self: flex-start;
}

/* Премиальная динамика карточек кейсов — только desktop-указатели */
@media (hover: hover) and (pointer: fine) {
    .lemesh-portfolio-card {
        transition: transform 0.28s ease, box-shadow 0.28s ease;
    }

    .lemesh-portfolio-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 16px 38px rgba(10, 37, 64, 0.13);
    }

    .lemesh-portfolio-card__image img {
        transition: transform 0.5s ease;
    }

    .lemesh-portfolio-card:hover .lemesh-portfolio-card__image img {
        transform: scale(1.03);
    }
}

/* ---------- Модальное окно кейса ---------- */
.lemesh-case-modal__dialog {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
    max-width: 1040px;
    max-height: min(86vh, 740px);
    padding: 0;
    overflow: hidden;
    border-radius: 18px;
}

.lemesh-case-modal__media {
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: #0A2540;
}

.lemesh-case-modal__stage {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.lemesh-case-modal__stage img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lemesh-case-modal__thumbs {
    display: flex;
    flex: 0 0 auto;
    gap: 8px;
    padding: 12px 14px;
    overflow-x: auto;
}

.lemesh-case-modal__thumb {
    flex: 0 0 auto;
    width: 74px;
    height: 56px;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 8px;
    overflow: hidden;
    background: none;
    cursor: pointer;
    opacity: 0.65;
    transition: opacity 0.2s ease, border-color 0.2s ease;
}

.lemesh-case-modal__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lemesh-case-modal__thumb.is-active {
    border-color: #7FB7F2;
    opacity: 1;
}

.lemesh-case-modal__video {
    flex: 0 0 auto;
    align-self: flex-start;
    margin: 0 14px 14px;
    color: #fff;
    border-color: rgba(255, 255, 255, 0.6);
}

.lemesh-case-modal__video:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: #fff;
    color: #fff;
}

.lemesh-case-modal__content {
    min-width: 0;
    padding: 30px 32px;
    overflow-y: auto;
}

.lemesh-case-modal__type {
    display: inline-block;
    padding: 5px 12px;
    border-radius: 999px;
    background: var(--lemesh-blue-light);
    color: var(--lemesh-blue);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.03em;
}

.lemesh-case-modal__content h3 {
    margin: 12px 0 18px;
    font-size: 24px;
    line-height: 1.2;
    font-weight: 800;
    color: var(--lemesh-dark);
}

.lemesh-case-modal__facts {
    margin: 0 0 22px;
}

.lemesh-case-modal__fact {
    display: grid;
    grid-template-columns: 106px minmax(0, 1fr);
    gap: 12px;
    padding: 10px 0;
    border-top: 1px solid var(--lemesh-border);
}

.lemesh-case-modal__fact dt {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.5;
    color: #45647f;
}

.lemesh-case-modal__fact dd {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.5;
    color: var(--lemesh-dark);
}

.lemesh-case-modal__more {
    margin: -8px 0 18px;
    font-size: 14px;
}

.lemesh-case-modal__cta {
    min-height: 48px;
    padding: 0 24px;
    font-size: 15px;
}

@media (max-width: 900px) {
    .lemesh-case-modal__dialog {
        grid-template-columns: minmax(0, 1fr);
        max-height: 92vh;
        overflow-y: auto;
    }

    .lemesh-case-modal__stage {
        aspect-ratio: 16 / 10;
        flex: 0 0 auto;
    }

    .lemesh-case-modal__content {
        overflow-y: visible;
    }
}

@media (max-width: 767px) {
    .lemesh-case-modal {
        padding: 12px;
    }

    .lemesh-case-modal__content {
        padding: 22px 20px 24px;
    }

    .lemesh-case-modal__content h3 {
        font-size: 21px;
        margin: 10px 0 14px;
    }

    .lemesh-case-modal__fact {
        grid-template-columns: minmax(0, 1fr);
        gap: 2px;
        padding: 9px 0;
    }

    .lemesh-case-modal__cta {
        width: 100%;
    }
}

/* ---------- Сложные ситуации (ex-assurance) ---------- */
.lemesh-situations {
    padding: 88px 0;
    background: linear-gradient(180deg, #F2F7FD 0%, #FFFFFF 100%);
}

.lemesh-situations__subtitle {
    margin: -14px auto 36px;
    max-width: 720px;
    text-align: center;
    font-size: 16px;
    line-height: 1.5;
    color: #5b6d7e;
}

.lemesh-situations__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.lemesh-situation {
    display: flex;
    flex-direction: column;
    background: var(--lemesh-white);
    border: 1px solid #E3EBF4;
    border-radius: 14px;
    box-shadow: 0 6px 22px rgba(10, 37, 64, 0.06);
    overflow: hidden;
}

.lemesh-situation__head {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    padding: 18px 18px 0;
    background: none;
    border: 0;
    font: inherit;
    color: inherit;
    text-align: left;
    cursor: default;
}

.lemesh-situation__icon {
    display: flex;
    flex: 0 0 44px;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: var(--lemesh-blue-light);
    color: var(--lemesh-blue);
}

.lemesh-situation__icon svg {
    width: 24px;
    height: 24px;
}

.lemesh-situation__title {
    font-size: 16.5px;
    font-weight: 800;
    line-height: 1.25;
    color: var(--lemesh-dark);
}

.lemesh-situation__text {
    padding: 14px 18px 18px;
}

.lemesh-situation__problem {
    margin: 0 0 10px;
    font-size: 14.5px;
    line-height: 1.5;
    color: #5b6d7e;
}

.lemesh-situation__solution {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.5;
    color: var(--lemesh-dark);
}

.lemesh-situation__solution-label {
    font-weight: 700;
    color: var(--lemesh-blue);
}

@media (hover: hover) and (pointer: fine) {
    .lemesh-situation {
        transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
    }

    .lemesh-situation:hover {
        transform: translateY(-3px);
        border-color: #BCD5EF;
        box-shadow: 0 12px 30px rgba(10, 37, 64, 0.1);
    }
}

@media (max-width: 1024px) and (min-width: 768px) {
    .lemesh-situations__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .lemesh-situations {
        padding: 56px 0;
    }

    .lemesh-situations__subtitle {
        margin: -6px auto 24px;
        font-size: 14.5px;
    }

    .lemesh-situations__grid {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .lemesh-situation__head {
        padding: 14px 14px;
        cursor: pointer;
    }

    .lemesh-situation__icon {
        flex-basis: 38px;
        width: 38px;
        height: 38px;
        border-radius: 10px;
    }

    .lemesh-situation__icon svg {
        width: 21px;
        height: 21px;
    }

    .lemesh-situation__title {
        font-size: 15.5px;
    }

    .lemesh-situation__text {
        padding: 2px 16px 16px 16px;
    }
}

/* ---------- Гарантия и обслуживание (тёмная компактная панель) ---------- */
.lemesh-warranty {
    padding: 8px 0 88px;
    background: var(--lemesh-white);
}

.lemesh-warranty__panel {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    gap: 44px;
    padding: 46px 48px;
    border-radius: 20px;
    background: linear-gradient(135deg, #0A2540 0%, #123A63 58%, #164A7C 100%);
    color: #fff;
    box-shadow: 0 18px 44px rgba(10, 37, 64, 0.2);
    overflow: hidden;
}

.lemesh-warranty__panel::after {
    content: "";
    position: absolute;
    right: -120px;
    top: -120px;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(30, 124, 232, 0.28) 0%, rgba(30, 124, 232, 0) 68%);
    pointer-events: none;
}

.lemesh-warranty__title {
    margin: 0 0 14px;
    font-size: clamp(24px, 2.2vw, 32px);
    line-height: 1.15;
    font-weight: 800;
    color: #fff;
}

.lemesh-warranty__desc {
    margin: 0 0 18px;
    max-width: 540px;
    font-size: 16px;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.82);
}

.lemesh-warranty__term {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 22px;
    padding: 8px 15px;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.09);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
}

.lemesh-warranty__term-icon {
    display: flex;
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    color: #9BCBFF;
}

.lemesh-warranty__term-icon svg {
    width: 18px;
    height: 18px;
}

.lemesh-warranty__cta {
    min-height: 50px;
    padding: 0 26px;
    font-size: 15px;
}

.lemesh-warranty__list {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    align-content: center;
    margin: 0;
    padding: 0;
    list-style: none;
}

.lemesh-warranty__list li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 15px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.07);
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.35;
}

.lemesh-warranty__icon {
    display: flex;
    flex: 0 0 36px;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: rgba(30, 124, 232, 0.28);
    color: #9BCBFF;
}

.lemesh-warranty__icon svg {
    width: 20px;
    height: 20px;
}

@media (max-width: 1024px) {
    .lemesh-warranty__panel {
        grid-template-columns: minmax(0, 1fr);
        gap: 26px;
        padding: 36px 32px;
    }
}

@media (max-width: 767px) {
    .lemesh-warranty {
        padding: 4px 0 56px;
    }

    .lemesh-warranty__panel {
        gap: 22px;
        padding: 28px 20px;
        border-radius: 16px;
    }

    .lemesh-warranty__desc {
        font-size: 14.5px;
    }

    .lemesh-warranty__list {
        grid-template-columns: minmax(0, 1fr);
    }

    .lemesh-warranty__cta {
        width: 100%;
    }
}

/* ---------- Reduced motion: статика без анимаций ---------- */
@media (prefers-reduced-motion: reduce) {
    .lemesh-portfolio-card,
    .lemesh-portfolio-card__image img,
    .lemesh-situation,
    .lemesh-case-modal__thumb {
        transition: none;
    }

    .lemesh-portfolio-card:hover,
    .lemesh-situation:hover {
        transform: none;
    }

    .lemesh-portfolio-card:hover .lemesh-portfolio-card__image img {
        transform: none;
    }
}


/* ---------- География объектов (TASK-004): карта, карточка точки, сводка ---------- */
.lemesh-map__head {
    max-width: 760px;
    margin: 0 auto 28px;
    text-align: center;
}

.lemesh-map__subtitle {
    margin: 14px auto 0;
    color: var(--lemesh-gray);
    font-size: 17px;
    line-height: 1.55;
}

.lemesh-map__panel {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
    gap: 36px;
    align-items: start;
    padding: 40px 42px;
    border-radius: 20px;
    background: linear-gradient(135deg, #0A2540 0%, #123A63 58%, #164A7C 100%);
    box-shadow: 0 18px 44px rgba(10, 37, 64, .2);
}

.lemesh-map__mapcol {
    min-width: 0;
}

.lemesh-map__stage {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background:
        radial-gradient(120% 100% at 30% 20%, #14467E 0%, #0E3057 55%, #0A2540 100%);
    border: 1px solid rgba(255, 255, 255, .1);
}

.lemesh-map__scheme {
    position: absolute;
    inset: 0;
    transition: opacity .3s ease;
}

.lemesh-map__scheme.is-hidden {
    opacity: 0;
    pointer-events: none;
}

.lemesh-map__scheme-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.lemesh-map__yandex {
    position: absolute;
    inset: 0;
}

.lemesh-map__yandex[hidden] {
    display: none;
}

.lemesh-map__marker {
    position: absolute;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    padding: 0;
    border-radius: 50%;
    border: 2px solid #fff;
    background: #1E7CE8;
    box-shadow: 0 2px 10px rgba(4, 24, 48, .55);
    cursor: pointer;
    transform: translate(-50%, -50%);
    transition: transform var(--lemesh-transition), box-shadow var(--lemesh-transition), background var(--lemesh-transition);
}

.lemesh-map__marker-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
    pointer-events: none;
}

.lemesh-map__marker--accent {
    width: 32px;
    height: 32px;
    background: #FFB84D;
    border-color: #fff;
}

.lemesh-map__marker:hover {
    transform: translate(-50%, -50%) scale(1.12);
}

.lemesh-map__marker:focus-visible {
    outline: 2px solid #9BCBFF;
    outline-offset: 2px;
}

.lemesh-map__marker.is-active {
    background: #fff;
    border-color: #1E7CE8;
    box-shadow: 0 0 0 5px rgba(30, 124, 232, .35), 0 2px 10px rgba(4, 24, 48, .55);
    transform: translate(-50%, -50%) scale(1.14);
}

.lemesh-map__marker.is-active .lemesh-map__marker-dot {
    background: #1E7CE8;
}

.lemesh-map__marker--accent.is-active {
    border-color: #FFB84D;
    box-shadow: 0 0 0 5px rgba(255, 184, 77, .4), 0 2px 10px rgba(4, 24, 48, .55);
}

.lemesh-map__marker--accent.is-active .lemesh-map__marker-dot {
    background: #FFB84D;
}

.lemesh-map__note {
    margin: 14px 2px 0;
    color: rgba(255, 255, 255, .72);
    font-size: 13.5px;
    line-height: 1.5;
}

.lemesh-map__list {
    display: none;
}

.lemesh-map__side {
    display: flex;
    flex-direction: column;
    gap: 22px;
    min-width: 0;
}

.lemesh-map__card {
    background: #fff;
    color: var(--lemesh-dark);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 14px 34px rgba(4, 24, 48, .35);
}

.lemesh-map__card-media {
    position: relative;
    aspect-ratio: 16 / 8;
    background:
        linear-gradient(0deg, rgba(10, 37, 64, .35), rgba(10, 37, 64, .35)),
        repeating-linear-gradient(45deg, #164A7C 0 14px, #123A63 14px 28px);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.lemesh-map__card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.lemesh-map__card-mono {
    font-size: 54px;
    font-weight: 700;
    color: rgba(255, 255, 255, .9);
    letter-spacing: 2px;
}

.lemesh-map__card-body {
    padding: 20px 22px 22px;
}

.lemesh-map__card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin: 0 0 10px;
}

.lemesh-map__card-badge {
    display: inline-flex;
    align-items: center;
    padding: 5px 11px;
    border-radius: 999px;
    background: var(--lemesh-blue-light);
    color: var(--lemesh-blue-dark);
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.2;
}

.lemesh-map__card-dir {
    color: var(--lemesh-gray);
    font-size: 13px;
}

.lemesh-map__card-title {
    margin: 0 0 6px;
    font-size: 19px;
    line-height: 1.3;
    color: var(--lemesh-dark);
}

.lemesh-map__card-loc {
    margin: 0 0 10px;
    color: var(--lemesh-blue);
    font-size: 14px;
    font-weight: 600;
}

.lemesh-map__card-desc {
    margin: 0;
    color: var(--lemesh-gray);
    font-size: 14.5px;
    line-height: 1.55;
}

.lemesh-map__card-approx {
    margin: 10px 0 0;
    color: var(--lemesh-gray);
    font-size: 12.5px;
}

.lemesh-map__card-case {
    display: inline-flex;
    margin-top: 12px;
    color: var(--lemesh-blue);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid rgba(0, 87, 184, .35);
}

.lemesh-map__card-case:hover {
    color: var(--lemesh-blue-dark);
    border-bottom-color: var(--lemesh-blue-dark);
}

.lemesh-map__card-case[hidden],
.lemesh-map__card-desc[hidden] {
    display: none;
}

.lemesh-map__summary {
    padding: 20px 22px;
    border-radius: 16px;
    background: rgba(255, 255, 255, .07);
    border: 1px solid rgba(255, 255, 255, .12);
    color: #fff;
}

.lemesh-map__summary-title {
    margin: 0 0 4px;
    font-size: 16px;
    font-weight: 700;
}

.lemesh-map__summary-total {
    margin: 0 0 12px;
    color: rgba(255, 255, 255, .75);
    font-size: 13.5px;
}

.lemesh-map__summary-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
}

.lemesh-map__summary-list li {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 14px;
    line-height: 1.35;
}

.lemesh-map__summary-icon {
    display: inline-flex;
    color: #9BCBFF;
    flex: 0 0 auto;
}

.lemesh-map__summary-dir {
    flex: 1 1 auto;
    min-width: 0;
}

.lemesh-map__summary-count {
    flex: 0 0 auto;
    min-width: 24px;
    height: 24px;
    padding: 0 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(155, 203, 255, .18);
    color: #CFE5FD;
    font-size: 12.5px;
    font-weight: 700;
}

.lemesh-map__cta {
    align-self: flex-start;
}

@media (max-width: 1024px) {
    .lemesh-map__panel {
        grid-template-columns: minmax(0, 1fr);
        padding: 28px 24px;
        gap: 26px;
    }

    .lemesh-map__stage {
        aspect-ratio: 16 / 10;
    }

    .lemesh-map__cta {
        align-self: stretch;
        text-align: center;
    }
}

@media (max-width: 767px) {
    .lemesh-map__head {
        margin-bottom: 20px;
    }

    .lemesh-map__subtitle {
        font-size: 15px;
    }

    .lemesh-map__panel {
        padding: 18px 14px;
        border-radius: 16px;
        gap: 18px;
    }

    .lemesh-map__stage {
        aspect-ratio: auto;
        height: 280px;
    }

    .lemesh-map__marker {
        width: 24px;
        height: 24px;
    }

    .lemesh-map__marker--accent {
        width: 28px;
        height: 28px;
    }

    .lemesh-map__list {
        display: flex;
        gap: 10px;
        margin-top: 14px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 6px;
    }

    .lemesh-map__list-item {
        flex: 0 0 78%;
        scroll-snap-align: start;
        display: flex;
        flex-direction: column;
        gap: 3px;
        padding: 12px 14px;
        border-radius: 12px;
        border: 1px solid rgba(255, 255, 255, .16);
        background: rgba(255, 255, 255, .06);
        color: #fff;
        text-align: left;
        cursor: pointer;
        transition: background var(--lemesh-transition), border-color var(--lemesh-transition);
    }

    .lemesh-map__list-item:focus-visible {
        outline: 2px solid #9BCBFF;
        outline-offset: 2px;
    }

    .lemesh-map__list-item.is-active {
        background: rgba(30, 124, 232, .32);
        border-color: rgba(155, 203, 255, .55);
    }

    .lemesh-map__list-work {
        font-size: 13.5px;
        font-weight: 600;
        line-height: 1.3;
    }

    .lemesh-map__list-loc {
        font-size: 12px;
        color: rgba(255, 255, 255, .72);
        line-height: 1.3;
    }

    .lemesh-map__card-body {
        padding: 16px 16px 18px;
    }

    .lemesh-map__card-title {
        font-size: 17px;
    }
}

@media (max-width: 380px) {
    .lemesh-map__stage {
        height: 240px;
    }

    .lemesh-map__list-item {
        flex-basis: 86%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .lemesh-map__marker,
    .lemesh-map__scheme,
    .lemesh-map__list-item {
        transition: none;
    }
}

/* ============================================================
   v1.8.4 (TASK-005): реквизиты в нижней строке футера
   Компактное раскрытие <details>: в закрытом состоянии — одна строка.
   ============================================================ */
.lemesh-requisites {
    margin: 0 auto 14px;
    max-width: 620px;
    text-align: left;
    font-size: 12px;
}

.lemesh-requisites__toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    min-height: 32px;
    padding: 4px 8px;
    box-sizing: border-box;
    cursor: pointer;
    list-style: none;
    color: rgba(255, 255, 255, 0.65);
    font-size: 12px;
    line-height: 1.3;
    border-radius: 6px;
    transition: color var(--lemesh-transition);
}

.lemesh-requisites__toggle::-webkit-details-marker {
    display: none;
}

.lemesh-requisites__toggle::marker {
    content: none;
}

.lemesh-requisites__toggle:hover {
    color: var(--lemesh-white);
}

.lemesh-requisites__toggle:focus-visible {
    outline: 2px solid var(--lemesh-blue);
    outline-offset: 2px;
}

.lemesh-requisites__chevron {
    flex: 0 0 auto;
    transition: transform var(--lemesh-transition);
}

.lemesh-requisites[open] .lemesh-requisites__chevron {
    transform: rotate(180deg);
}

.lemesh-requisites__panel {
    margin-top: 8px;
    padding: 14px 18px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.04);
}

.lemesh-requisites__list {
    margin: 0;
    display: grid;
    gap: 8px;
}

.lemesh-requisites__row {
    display: grid;
    grid-template-columns: minmax(150px, max-content) 1fr;
    gap: 2px 16px;
    align-items: baseline;
}

.lemesh-requisites__row dt {
    color: rgba(255, 255, 255, 0.5);
    font-size: 12px;
}

.lemesh-requisites__row dd {
    margin: 0;
    color: rgba(255, 255, 255, 0.85);
    font-size: 13px;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

@media (max-width: 480px) {
    .lemesh-requisites__row {
        grid-template-columns: 1fr;
        gap: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .lemesh-requisites__toggle,
    .lemesh-requisites__chevron {
        transition: none;
    }
}


/* ============================================================
   v1.8.5 (TASK-006): заметная кнопка «Реквизиты» в футере,
   блок оператора в политике, географическая схема карты,
   маркировка черновых отзывов.
   ============================================================ */

/* --- Footer: компактная заметная кнопка «Реквизиты» --- */
.lemesh-requisites__toggle {
    width: fit-content;
    min-width: 160px;
    min-height: 40px;
    margin: 0 auto;
    padding: 8px 22px;
    display: flex;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.07);
    color: rgba(255, 255, 255, 0.88);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.2px;
    transition: color var(--lemesh-transition), background var(--lemesh-transition), border-color var(--lemesh-transition);
}

.lemesh-requisites__toggle:hover {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.5);
    color: var(--lemesh-white);
}

.lemesh-requisites[open] .lemesh-requisites__toggle {
    background: rgba(30, 124, 232, 0.3);
    border-color: rgba(155, 203, 255, 0.55);
    color: var(--lemesh-white);
}

.lemesh-requisites__row dd a {
    color: inherit;
}

/* --- Политика: блок «Оператор персональных данных» --- */
.lemesh-operator {
    margin: 26px 0;
    padding: 24px 26px;
    border: 1px solid var(--lemesh-border);
    border-radius: 14px;
    background: #F7F9FC;
}

.lemesh-operator__title {
    margin: 0 0 14px;
    font-size: 20px;
    line-height: 1.3;
}

.lemesh-operator__subtitle {
    margin: 20px 0 10px;
    font-size: 16px;
    line-height: 1.3;
}

.lemesh-operator__list {
    margin: 0;
    display: grid;
    gap: 8px;
}

.lemesh-operator__row {
    display: grid;
    grid-template-columns: minmax(180px, max-content) 1fr;
    gap: 2px 18px;
    align-items: baseline;
}

.lemesh-operator__row dt {
    color: var(--lemesh-gray);
    font-size: 14px;
}

.lemesh-operator__row dd {
    margin: 0;
    font-size: 15px;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

@media (max-width: 480px) {
    .lemesh-operator {
        padding: 18px;
    }

    .lemesh-operator__row {
        grid-template-columns: 1fr;
        gap: 0;
    }
}

/* --- Карта: тултип маркера --- */
.lemesh-map__marker-tip {
    position: absolute;
    bottom: calc(100% + 9px);
    left: 50%;
    padding: 5px 11px;
    border-radius: 8px;
    background: #fff;
    color: #0A2540;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
    box-shadow: 0 6px 18px rgba(4, 24, 48, 0.4);
    opacity: 0;
    pointer-events: none;
    transform: translateX(-50%) translateY(3px);
    transition: opacity var(--lemesh-transition), transform var(--lemesh-transition);
}

.lemesh-map__marker-tip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border: 5px solid transparent;
    border-top-color: #fff;
}

.lemesh-map__marker:hover,
.lemesh-map__marker:focus-visible,
.lemesh-map__marker.is-active {
    z-index: 4;
}

.lemesh-map__marker:hover .lemesh-map__marker-tip,
.lemesh-map__marker:focus-visible .lemesh-map__marker-tip,
.lemesh-map__marker.is-active .lemesh-map__marker-tip {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* --- Карта: аккуратная монограмма без фото --- */
.lemesh-map__card-media {
    aspect-ratio: 16 / 7;
    background:
        radial-gradient(120% 150% at 28% 18%, #1B5288 0%, #123A63 55%, #0E3057 100%);
}

.lemesh-map__card-mono {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 74px;
    height: 74px;
    border-radius: 50%;
    border: 1.5px solid rgba(155, 203, 255, 0.5);
    background: rgba(255, 255, 255, 0.08);
    color: #CFE5FD;
    font-size: 34px;
    font-weight: 700;
    letter-spacing: 1px;
}

@media (max-width: 767px) {
    /* На mobile подписи шоссе/городов нечитаемы — оставляем чистую схему. */
    .lemesh-map__svg-label,
    .lemesh-map__svg-city {
        display: none;
    }

    .lemesh-map__marker-tip {
        font-size: 11px;
        padding: 4px 9px;
    }
}

/* --- Отзывы: карточка --- */
.lemesh-reviews .lemesh-review-card {
    position: relative;
}

@media (prefers-reduced-motion: reduce) {
    .lemesh-requisites__toggle,
    .lemesh-map__marker-tip {
        transition: none;
    }
}

/* ===================================================================
   v1.8.6 — TASK-006 (итерация 2): отзывы — управляемый слайдер (desktop).
   Движок — тот же CSS scroll-snap, что и mobile mslider (без autoplay).
   Карусель включается только JS-классом .lemesh-reviews__slider--js:
   без JS остаётся прежняя сетка 3 колонки со всеми карточками.
   Mobile (<=767px) не меняется: горизонтальный свайп + счётчик mslider.
   =================================================================== */
.lemesh-reviews__controls {
    display: none;
}

@media (min-width: 768px) {
    .lemesh-reviews__slider--js .lemesh-reviews__grid {
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: calc((100% - 44px) / 3);
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scroll-snap-type: x proximity;
        touch-action: pan-x pan-y pinch-zoom;
        scrollbar-width: none;
        margin: -6px -2px 0;
        padding: 6px 2px 24px;
        -webkit-overflow-scrolling: touch;
    }

    .lemesh-reviews__slider--js .lemesh-reviews__grid::-webkit-scrollbar {
        display: none;
    }

    .lemesh-reviews__slider--js .lemesh-reviews__grid > * {
        scroll-snap-align: start;
        scroll-snap-stop: normal;
        min-width: 0;
    }

    .lemesh-reviews__slider--js .lemesh-reviews__grid:focus-visible {
        outline: 2px solid var(--lemesh-blue);
        outline-offset: 2px;
        border-radius: 8px;
    }

    .lemesh-reviews__slider--js .lemesh-reviews__controls {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 18px;
        margin-top: 8px;
    }

    .lemesh-reviews__arrow {
        flex: 0 0 46px;
        width: 46px;
        height: 46px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        border: 1px solid var(--lemesh-border);
        background: #fff;
        color: var(--lemesh-blue);
        box-shadow: 0 4px 14px rgba(10, 30, 60, 0.08);
        cursor: pointer;
        transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
    }

    .lemesh-reviews__arrow svg {
        width: 20px;
        height: 20px;
    }

    .lemesh-reviews__arrow:disabled {
        opacity: 0.35;
        cursor: default;
        box-shadow: none;
    }

    .lemesh-reviews__dots {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .lemesh-reviews__dot {
        position: relative;
        width: 10px;
        height: 10px;
        padding: 0;
        border: 0;
        border-radius: 50%;
        background: #c4d3e3;
        cursor: pointer;
        transition: background 0.2s ease, transform 0.2s ease;
    }

    /* увеличенная зона нажатия точки (~24px) */
    .lemesh-reviews__dot::after {
        content: "";
        position: absolute;
        inset: -7px;
        border-radius: 50%;
    }

    .lemesh-reviews__dot[aria-current="true"] {
        background: var(--lemesh-blue);
        transform: scale(1.3);
    }

    .lemesh-reviews__arrow:focus-visible,
    .lemesh-reviews__dot:focus-visible {
        outline: 2px solid var(--lemesh-blue);
        outline-offset: 2px;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .lemesh-reviews__slider--js .lemesh-reviews__grid {
        grid-auto-columns: calc((100% - 22px) / 2);
    }
}

@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
    .lemesh-reviews__arrow:not(:disabled):hover {
        border-color: var(--lemesh-blue);
        transform: translateY(-1px);
        box-shadow: 0 8px 20px rgba(8, 101, 199, 0.16);
    }

    .lemesh-reviews__dot:hover {
        background: #8fb6dd;
    }

    .lemesh-reviews__dot[aria-current="true"]:hover {
        background: var(--lemesh-blue);
    }
}

@media (prefers-reduced-motion: reduce) {
    .lemesh-reviews__arrow,
    .lemesh-reviews__dot {
        transition: none;
    }
}
