.pac-container {
    border-radius: 16px !important;
    border: 1px solid rgba(20, 16, 0, 0.1) !important;
    box-shadow: 0 4px 24px rgba(20, 16, 0, 0.08), 0 2px 8px rgba(20, 16, 0, 0.04) !important;
    font-family: 'Sora', sans-serif !important;
    padding: 12px 0 8px 0 !important;
    margin-top: 4px !important;
    background: #ffffff !important;
    overflow: hidden !important;
}

.pac-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px 20px !important;
    font-size: 14px !important;
    line-height: 20px !important;
    color: rgba(20, 16, 0, 0.75) !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease, font-weight 0.2s ease !important;
    border: none !important;
    border-bottom: 1px solid rgba(20, 16, 0, 0.05) !important;
}

.pac-item:last-child {
    border-bottom: none !important;
}

.pac-item .pac-item-query {
    font-weight: 400 !important;
    color: #141000 !important;
    font-size: 14px !important;
    line-height: 20px !important;
    transition: font-weight 0.2s ease !important;
}

/* All child elements in pac-item-query inherit base styles */
.pac-item .pac-item-query > * {
    font-size: 14px !important;
    color: #141000 !important;
    line-height: 20px !important;
}

/* Matched text (b, strong tags or .pac-matched) - same size and color, only font-weight 500 (medium) */
.pac-item .pac-item-query b,
.pac-item .pac-item-query strong,
.pac-item .pac-item-query .pac-matched,
.pac-item .pac-item-query b.pac-matched,
.pac-item .pac-item-query strong.pac-matched,
.pac-item .pac-matched {
    color: #141000 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    background: transparent !important;
    background-color: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    text-decoration: none !important;
    line-height: 20px !important;
    display: inline !important;
}

.pac-item:hover .pac-item-query,
.pac-item-selected .pac-item-query {
    font-weight: 500 !important;
}

.pac-item:hover .pac-item-query .pac-matched,
.pac-item-selected .pac-item-query .pac-matched,
.pac-item:hover .pac-item-query b,
.pac-item-selected .pac-item-query b,
.pac-item:hover .pac-item-query strong,
.pac-item-selected .pac-item-query strong {
    font-weight: 500 !important;
}

.pac-item span:not(.pac-item-query) {
    color: rgba(20, 16, 0, 0.6) !important;
    font-size: 12px !important;
    line-height: 18px !important;
}

.pac-item::before {
    content: '' !important;
    width: 20px !important;
    height: 20px !important;
    background: url('assets/icon-location-pin.svg') no-repeat center / contain !important;
    flex-shrink: 0 !important;
}

/* All items hover state - same gray color */
.pac-item:hover,
.pac-item-selected {
    background: rgba(20, 16, 0, 0.03) !important;
}

.pac-icon {
    display: none !important;
}

/* Google logo styling at bottom */
.pac-logo {
    padding: 12px 0 8px !important;
    text-align: right !important;
    border-top: 1px solid rgba(20, 16, 0, 0.05) !important;
    margin-top: 0 !important;
    font-family: 'Sora', sans-serif !important;
}

.pac-logo img {
    height: 14px !important;
    width: auto !important;
    margin-right: 12px !important;
}
:root {
    --delivery-area-vw: clamp(1140px, 100vw, 1440px);
}

/* Ensure consistent 48px gaps around icons between 641px and 390px */
@media (max-width: 641px) and (min-width: 391px) {
    .contact-info { margin-top: 48px !important; margin-bottom: 48px !important; }
    .cta-section { margin-top: 0 !important; }
}
/* Set both gaps to 40px specifically for >393px up to 480px */
@media (max-width: 480px) and (min-width: 394px) {
    .contact-info { margin-top: 40px !important; margin-bottom: 40px !important; }
    .cta-section { margin-top: 0 !important; }
}
/* Reset and Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* width/height атрибути на <img> служать лише для резервування місця під час
   завантаження (анти-CLS): браузер бере з них пропорцію. Фактичну висоту завжди
   визначає CSS — інакше атрибутна висота ламає width:100% + aspect-ratio.
   Простий селектор img програє будь-якому іншому CSS-правилу, тож реальні
   розміри, задані стилями, лишаються недоторканими. */
img { height: auto; }

:root {
    --color-dark: #141000;
    --color-menu-bg: #edefec;
    --color-menu-active: #d1d6d2;
    --color-white: #ffffff;
}

body {
    font-family: 'Sora', sans-serif;
    background: #ffffff;
    margin: 0;
    padding: 0;
}

/* Header */
@keyframes slideDown {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.header {
    position: relative;
    width: 100%;
    padding: 32px 48px;
    animation: slideDown 0.6s ease-out;
}

.header-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    width: 100%;
    max-width: 1344px;
    margin: 0 auto;
}

/* Logo */
.logo {
    width: 184px;
    height: 28px;
    flex-shrink: 0;
}

.logo-img {
    width: 100%;
    height: 100%;
    display: block;
}

/* Menu */
.menu {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--color-menu-bg);
    border-radius: 12px;
    padding: 8px 10px;
    z-index: 9;
}

/* Keep logo and right header group above the blur overlay (no blur) - for all browsers */
.logo,
.header-right {
    position: relative;
    z-index: 10;
    filter: none !important;
    -webkit-filter: none !important;
}

/* Blur overlay with strong blur for all browsers */
.blur-overlay {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 0;
    background: rgba(237,239,236,0.4);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    pointer-events: none;
    opacity: 0;
    transition: height 300ms ease, opacity 220ms ease;
    z-index: 6;
    border-bottom-left-radius: 32px;
    border-bottom-right-radius: 32px;
    overflow: hidden; /* clip blur to rounded corners */
    border: 1px solid rgba(255, 255, 255, 0.3); /* glass border */
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5); /* glass effect with inner highlight only */
}

/* Safari fallback: blur only background, not logo and buttons */
/* Fallback only when backdrop-filter is NOT supported */
/* Logo and buttons should remain visible - blur only applies to background via blur-overlay */

/* Add the same tint as overlay so Safari fallback matches visuals */
/* remove header tint; overlay handles tint across browsers */
/* Mega Dropdown Curtain */
.mega-dropdown {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    pointer-events: none; /* enabled when open */
    opacity: 1; /* keep wrapper fully opaque to avoid Safari backdrop bug */
    transition: none;
    z-index: 7; /* above blur overlay (6), below menu (9) */
}

.mega-dropdown.open { pointer-events: auto; }

/* (removed body overlay to simplify and avoid stacking issues) */

/* (removed duplicate .mega-dropdown.open rule) */

.mega-backdrop { display: none; }

.mega-container {
    position: absolute; /* stack on top of backdrop */
    left: 50%;
    transform: translateX(-50%);
    top: 0; /* set from JS to header bottom */
    width: 100%;
    max-width: 1344px;
    margin: 0 auto;
    padding: 0 48px; /* align with layout gutters */
    opacity: 0;
    transform: translate(-50%, -8px);
    transition: opacity 220ms ease, transform 220ms ease;
    will-change: opacity, transform;
    z-index: 8; /* above blur overlay */
    border-radius: 0 0 32px 32px; /* rounded only at the bottom */
}
.mega-dropdown.open .mega-container { opacity: 1; transform: translate(-50%, 0); }

.mega-list {
    list-style: none;
    margin: 0;
    padding: 0 0 12px 0; /* top = 0, bottom = 12 */
    display: grid;
    grid-template-columns: repeat(3, max-content);
    grid-template-rows: repeat(3, max-content);
    grid-auto-flow: column; /* fill down each column first */
    column-gap: 64px; /* figma gap between columns */
    row-gap: 16px; /* figma vertical gap */
    text-align: left;
}

.mega-item {
    display: inline-block;
    padding: 0;
    border-radius: 0;
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 13px;
    line-height: 18px;
    color: #141000;
    white-space: nowrap;
    text-decoration: none;
    position: relative; /* for width reservation pseudo */
}

.mega-item:hover { text-decoration: none; font-weight: 500; }

/* Use Noto Sans for Ukrainian and Russian languages in mega dropdown */
body.lang-uk .mega-item[data-i18n],
body.lang-ru .mega-item[data-i18n] {
    font-family: 'Noto Sans', sans-serif;
    font-size: 13.5px;
    line-height: 18px;
}

/* Reserve width for bold state to avoid layout shift */
.mega-item::after {
    content: attr(data-text);
    font-weight: 500; /* bold state */
    visibility: hidden;
    display: block;
    height: 0;
    overflow: hidden;
}

@media (max-width: 1220px) {
    .mega-dropdown { display: none; }
}
/* Dropdown removed */

/* Header Right Group */
.header-right {
    display: flex;
    align-items: center;
    gap: 16px;
}

/* Mobile Call Button */
.mobile-call-button {
    display: none;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    background: #141000;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.3s ease;
    border: none;
    text-decoration: none;
    color: inherit;
}

.mobile-call-button:hover {
    background: #2a2a2a;
}

.call-icon {
    width: 23px;
    height: 23px;
    filter: brightness(0) invert(1);
}

/* Fixed Call Button (appears on scroll when header is hidden) */
.fixed-call-button {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 56px;
    height: 56px;
    background: #141000;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    color: inherit;
    z-index: 1000;
    box-shadow: 0 4px 12px rgba(20, 16, 0, 0.15);
}

.fixed-call-button:hover {
    background: #2a2a2a;
    box-shadow: 0 6px 16px rgba(20, 16, 0, 0.2);
}

.fixed-call-button:active {
    background: #141000;
    box-shadow: 0 4px 12px rgba(20, 16, 0, 0.15);
}

.fixed-call-button.visible {
    display: flex;
}

/* On touch devices, avoid sticky hover state */
@media (hover: none) and (pointer: coarse) {
    .fixed-call-button:hover {
        background: #141000;
        box-shadow: 0 4px 12px rgba(20, 16, 0, 0.15);
    }
    
    .fixed-call-button:active {
        background: #2a2a2a;
        box-shadow: 0 6px 16px rgba(20, 16, 0, 0.2);
    }
}

@media (max-width: 678px) {
    .fixed-call-button.visible {
        display: flex;
    }
}

/* Floating stack (index, articles, kontakt, naprawa hub): phone bottom, WhatsApp above (Figma 984-3605) */
.site-fixed-actions {
    position: fixed;
    right: 20px;
    bottom: max(20px, env(safe-area-inset-bottom, 0px));
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-end;
    gap: 12px;
    z-index: 1000;
    pointer-events: none;
}

.site-fixed-actions > a {
    pointer-events: auto;
}

.site-fixed-actions .fixed-call-button {
    position: static;
    bottom: auto;
    right: auto;
    z-index: auto;
}

.site-fixed-actions .fixed-whatsapp-button {
    display: flex;
    position: static;
    width: 56px;
    height: 56px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #25d366;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 4px 12px rgba(20, 16, 0, 0.15);
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.site-fixed-actions .fixed-whatsapp-button:hover {
    background: #20bd5a;
    color: #fff;
    box-shadow: 0 6px 16px rgba(20, 16, 0, 0.2);
    transform: scale(1.04);
}

.site-fixed-actions .fixed-whatsapp-button:active {
    transform: scale(0.98);
    box-shadow: 0 4px 12px rgba(20, 16, 0, 0.15);
}

.site-fixed-actions .fixed-whatsapp-button__icon {
    display: block;
    flex-shrink: 0;
}

/* Mobile: tighter inset; WhatsApp shadow matches desktop (neutral) */
@media (max-width: 678px) {
    .site-fixed-actions {
        right: 10px;
        bottom: max(10px, env(safe-area-inset-bottom, 0px));
    }
}

@media (hover: none) and (pointer: coarse) {
    .site-fixed-actions .fixed-whatsapp-button:hover {
        background: #25d366;
        box-shadow: 0 4px 12px rgba(20, 16, 0, 0.15);
        transform: none;
    }

    .site-fixed-actions .fixed-whatsapp-button:active {
        background: #20bd5a;
        box-shadow: 0 6px 16px rgba(20, 16, 0, 0.2);
        transform: scale(0.98);
    }
}

@media (min-width: 679px) {
    .site-fixed-actions {
        right: 24px;
        bottom: max(24px, env(safe-area-inset-bottom, 0px));
    }
}

/* Hamburger Menu */
.hamburger {
    display: none;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    background: #edefec;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative; /* for x-close pseudo elements */
}

.hamburger:hover {
    background: #d4d6d3;
}

.hamburger-icon {
    width: 24px;
    height: 24px;
}

/* Repair form header adjustments */
body.page-repair-form .menu,
body.page-repair-form .header .cta-button,
body.page-repair-form .hamburger {
    display: none !important;
}

body.page-repair-form .header-right {
    display: none;
}

body.page-repair-form .header {
    padding-bottom: 0;
}

body.page-repair-form .logo {
    width: 184px;
}

@media (max-width: 480px) {
    body.page-repair-form {
        overscroll-behavior-y: contain;
    }
}

@media (max-width: 768px) {
    body.page-repair-form .header-right {
        display: flex;
    }

    body.page-repair-form .header-right .mobile-call-button {
        display: flex;
    }

    body.page-repair-form .logo {
        width: 160px;
    }
}

/* CSS-driven X icon when menu is open */
.hamburger::before,
.hamburger::after {
    content: '';
    position: absolute;
    width: 22px;
    height: 2px;
    background: #141000;
    border-radius: 2px;
    opacity: 0;
    transform: rotate(0deg);
    transition: opacity 180ms ease, transform 180ms ease;
}
.hamburger::before { transform-origin: center; }
.hamburger::after { transform-origin: center; }

.hamburger.is-open .hamburger-icon { opacity: 0; }
.hamburger.is-open::before,
.hamburger.is-open::after { opacity: 1; }
.hamburger.is-open::before { transform: rotate(45deg); }
.hamburger.is-open::after { transform: rotate(-45deg); }

/* Ensure open state uses base background and doesn't stick to hover color */
.hamburger.is-open,
.hamburger.is-open:hover,
.hamburger.is-open:active,
.hamburger.is-open:focus {
    background: #edefec !important;
    outline: none;
}

@media (max-width: 1220px) {
    /* On touch devices, avoid sticky :hover; only show active feedback */
    .hamburger:hover { background: #edefec; }
    .hamburger:active { background: #d4d6d3; }
}

.menu-indicator {
    position: absolute;
    background: var(--color-menu-active);
    border-radius: 9999px;
    opacity: 0;
    transform: scale(0);
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
    pointer-events: none;
    z-index: 0;
}

.menu-indicator.first-hover {
    transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
    transform: scale(1) !important;
}

.menu-indicator.sliding {
    transition: left 0.5s cubic-bezier(0.25, 0.8, 0.25, 1), 
                top 0.5s cubic-bezier(0.25, 0.8, 0.25, 1), 
                width 0.5s cubic-bezier(0.25, 0.8, 0.25, 1), 
                height 0.5s cubic-bezier(0.25, 0.8, 0.25, 1),
                opacity 0.3s ease;
    transform: scale(1);
}

.menu-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 10px 24px;
    border-radius: 9999px;
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 13px;
    line-height: 18px;
    color: var(--color-dark);
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    position: relative;
    z-index: 1;
}

/* Use Noto Sans for Ukrainian and Russian languages in menu */
body.lang-uk .menu-item[data-i18n],
body.lang-ru .menu-item[data-i18n],
body.lang-uk .naprawa-menu-link[data-i18n],
body.lang-ru .naprawa-menu-link[data-i18n] {
    font-family: 'Noto Sans', sans-serif;
    font-size: 13.5px;
}

.menu-item.dropdown {
    padding-right: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.naprawa-menu-link {
    color: inherit;
    text-decoration: none;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    cursor: pointer;
    display: inline-block;
}

.naprawa-menu-link:hover,
.naprawa-menu-link:focus,
.naprawa-menu-link:active {
    color: inherit;
    text-decoration: none;
}

.language-menu-link {
    color: inherit;
    text-decoration: none;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    cursor: pointer;
    display: inline-block;
}

.language-menu-link:hover,
.language-menu-link:focus,
.language-menu-link:active {
    color: inherit;
    text-decoration: none;
}

/* Language Dropdown - vertical menu style */
.language-dropdown {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    background: var(--color-menu-bg);
    border-radius: 12px;
    padding: 8px 10px;
    z-index: 9;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-8px);
    transition: opacity 220ms ease, transform 220ms ease;
    will-change: opacity, transform;
    /* Position will be set via JavaScript relative to menu */
}

.language-dropdown.open {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.language-dropdown-indicator {
    position: absolute;
    background: var(--color-menu-active);
    border-radius: 9999px;
    opacity: 0;
    transform: scale(0);
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
    pointer-events: none;
    z-index: 0;
}

.language-dropdown-indicator.first-hover {
    transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
    transform: scale(1) !important;
}

.language-dropdown-indicator.sliding {
    transition: left 0.5s cubic-bezier(0.25, 0.8, 0.25, 1), 
                top 0.5s cubic-bezier(0.25, 0.8, 0.25, 1), 
                width 0.5s cubic-bezier(0.25, 0.8, 0.25, 1), 
                height 0.5s cubic-bezier(0.25, 0.8, 0.25, 1),
                opacity 0.3s ease;
    transform: scale(1);
}

.language-dropdown-item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 18px;
    border-radius: 9999px;
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 13px;
    line-height: 18px;
    color: #141000;
    text-decoration: none;
    white-space: nowrap;
    position: relative;
    z-index: 1;
    cursor: pointer;
}

.language-dropdown-item:hover {
    text-decoration: none;
}

.language-dropdown-item[data-lang="uk"],
.language-dropdown-item[data-lang="ru"] {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px;
    line-height: 18px;
}

/* Compact menu styles for language dropdown */
@media (max-width: 1340px) {
    .language-dropdown {
        padding: 6px 8px;
    }
    
    .language-dropdown-item {
        padding: 8px 16px;
        font-size: 12px;
        line-height: 18px;
    }
    
    .language-dropdown-item[data-lang="uk"],
    .language-dropdown-item[data-lang="ru"] {
        font-size: 13px;
        line-height: 18px;
    }
}

.chevron {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

/* Menu Divider */
.menu-divider {
    width: 0px;
    height: 12px;
    border-left: 1px solid rgba(20, 16, 0, 0.2);
    flex-shrink: 0;
}

/* CTA Button with Fill Effect */
.cta-button {
    position: relative;
    background: var(--color-dark);
    border: none;
    border-radius: 9999px;
    padding: 16px 32px;
    font-family: 'Unbounded', sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 14px;
    line-height: 22px;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: inherit;
}

a.cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: inherit;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

a.cta-button:hover {
    text-decoration: none;
}

a.cta-button:focus {
    outline: none;
}

a.cta-button:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px var(--color-dark);
}

a.cta-button:active {
    transform: none;
}

.cta-button::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 9999px;
    box-shadow: inset 0 0 0 2px #141000;
    opacity: 0;
    transition: opacity 0.5s ease;
    z-index: 3;
    pointer-events: none;
    background: transparent;
}

.cta-button:hover::before {
    opacity: 1;
}

.cta-button__text-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

.cta-button__text {
    display: block;
}

.cta-button__text--original {
    color: var(--color-white);
    transition: opacity 0.3s ease;
}

.cta-button__text--hover {
    position: absolute;
    top: 0;
    left: 0;
    color: #141000;
    font-weight: 400;
    transform: translateY(250%);
    opacity: 0;
    transition: transform 0.5s ease, opacity 0.3s ease;
}

.cta-button__fill {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0%;
    background: #F9944A;
    transition: height 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1;
    border-radius: 0;
}

.cta-button:hover .cta-button__fill {
    height: 100%;
}

.cta-button:hover .cta-button__text--original {
    opacity: 0;
}

.cta-button:hover .cta-button__text--hover {
    transform: translateY(0);
    opacity: 1;
}

/* Hero Section */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInScale {
    from {
        opacity: 0;
        transform: scale(0.8);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.hero-section {
    margin-top: 140px;
    padding: 0 48px;
}

.hero-container {
    max-width: 1344px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 48px;
}

.hero-subtitle {
    font-family: 'Unbounded', sans-serif;
    font-weight: 400;
    font-size: 24px;
    text-align: center;
}

/* Ukrainian and Russian versions: use Unbounded for hero subtitle and title (same as Polish version) */
body.lang-uk .hero-subtitle,
body.lang-ru .hero-subtitle {
    font-family: 'Unbounded', sans-serif;
}

/* All languages: hero-title rules (same as Polish version) */

/* All languages: font-size, max-width and height for ≤393px */
@media (max-width: 393px) {
    .hero-title {
        font-size: 40px !important;
        max-width: 308px !important;
        height: 96px !important; /* two lines * 48px line-height */
    }
}

/* English version: 361-393px range */
@media (max-width: 393px) and (min-width: 361px) {
    body.lang-en .hero-title {
        max-width: 286px !important;
    }
}

/* All languages: smaller font-size for 320-360px range */
@media (max-width: 360px) and (min-width: 320px) {
    .hero-title {
        font-size: 36px !important;
        line-height: 42px !important;
        max-width: 280px !important;
        height: 84px !important; /* two lines * 42px line-height */
    }
    
    /* English version: 286px for this range */
    body.lang-en .hero-title {
        max-width: 286px !important;
    }
}

/* All languages: font-size, line-height, max-width and height for ≤947px range */
@media (max-width: 947px) {
    .hero-title {
        font-size: 60px !important;
        line-height: 78px !important;
        max-width: 450px !important;
        height: 156px !important; /* two lines * 78px line-height */
    }
    
    /* English version: max-width 422px */
    body.lang-en .hero-title {
        max-width: 422px !important;
    }
    
    /* Prevent leading reserved space from indenting a new line */
    .hero-title__space {
        white-space: normal !important; /* collapse leading space at line start */
    }
    
    /* English version: wrapper for dynamic text and cursor to ignore container width */
    body.lang-en .hero-title__dynamic-wrapper {
        display: inline-flex !important;
        white-space: nowrap !important;
        min-width: max-content !important; /* Allow wrapper to extend beyond container */
    }
    
    /* English version: prevent "your fridge" and "your washer" with cursor from wrapping to second line */
    body.lang-en .hero-title__dynamic {
        white-space: nowrap !important;
    }
    
    /* English version: keep cursor on same line as dynamic text - prevent wrapping */
    body.lang-en .hero-title__cursor--dynamic {
        flex-shrink: 0 !important;
        white-space: nowrap !important;
    }
    
    /* Allow hero-title container to overflow if needed for English version */
    body.lang-en .hero-title {
        overflow: visible !important;
    }
    
    /* For other languages: hide wrapper (it's only visible structure for English) */
    body:not(.lang-en) .hero-title__dynamic-wrapper {
        display: contents !important; /* Make wrapper transparent for non-English */
    }
}

/* All languages: font-size, line-height, max-width and height for 394-768px range */
@media (max-width: 768px) and (min-width: 394px) {
    .hero-title {
        font-size: 46px !important;
        line-height: 56px !important;
        max-width: 350px !important;
        height: 114px !important; /* two lines * 56px line-height */
        text-align: center !important;
        justify-content: center !important;
    }
    
    /* English version: 326px for this range */
    body.lang-en .hero-title {
        max-width: 326px !important;
    }
    
    /* Cursor height matches font-size */
    .hero-title__cursor--question,
    .hero-title__cursor--dynamic {
        height: 46px !important; /* Match font-size */
    }
    
    /* Prevent leading reserved space from indenting a new line */
    .hero-title__space {
        white-space: normal !important; /* collapse leading space at line start */
    }
}

.hero-title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 600;
    font-size: 80px;
    line-height: 104px;
    color: #141000;
    animation: fadeInUp 0.8s ease-out 0.3s both;
    text-align: center;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: baseline;
    /* Disable transitions for font-size, line-height, max-width, height to prevent smooth resizing when language changes */
    transition: none !important;
}

/* Allow transition only for transform property on hero-title (if needed for animations) */
.hero-title__static {
    transition: transform 0.3s ease-in-out !important;
}

/* Ukrainian and Russian versions: font-size and line-height for 1321-1385px */
@media (min-width: 1321px) and (max-width: 1385px) {
    body.lang-uk .hero-title,
    body.lang-ru .hero-title {
        font-size: 60px;
        line-height: 80px;
    }
    
    /* Cursor height matches font-size for Ukrainian and Russian versions */
    body.lang-uk .hero-title__cursor--question,
    body.lang-uk .hero-title__cursor--dynamic,
    body.lang-ru .hero-title__cursor--question,
    body.lang-ru .hero-title__cursor--dynamic {
        height: 60px;
    }
}

/* Ukrainian and Russian versions: different font-size and line-height for desktop (>1385px) */
@media (min-width: 1386px) {
    body.lang-uk .hero-title,
    body.lang-ru .hero-title {
        font-size: 64px;
        line-height: 88px;
    }
    
    /* Cursor height matches font-size for Ukrainian and Russian versions */
    body.lang-uk .hero-title__cursor--question,
    body.lang-uk .hero-title__cursor--dynamic,
    body.lang-ru .hero-title__cursor--question,
    body.lang-ru .hero-title__cursor--dynamic {
        height: 64px;
    }
}

.hero-title__question {
    display: inline-block;
    width: fit-content;
}

.hero-title__space {
    display: inline-block;
    white-space: pre;
}

.hero-title__static {
    display: inline-block;
    transition: transform 0.3s ease-in-out !important;
    will-change: transform;
}

.hero-title__dynamic {
    display: inline-block;
    margin-left: 16px;
    transition: none !important; /* No transition to prevent smooth resizing when language changes */
}

.hero-title__space {
    transition: all 0.3s ease-in-out !important;
}

.hero-title__cursor {
    display: inline-block;
    width: 4px;
    height: 80px;
    background-color: #141000;
    margin-left: 4px;
    opacity: 0;
    vertical-align: bottom;
}

.hero-title__cursor.active {
    opacity: 1;
    animation: blink 1s step-end infinite;
}

.hero-title__cursor--question {
    margin-right: 4px;
}

.hero-title__cursor--dynamic {
    margin-left: 4px;
}

/* Wrapper for dynamic element and cursor - transparent for non-English languages */
.hero-title__dynamic-wrapper {
    display: contents; /* Make wrapper transparent by default */
}

@keyframes blink {
    0%, 50% {
        opacity: 1;
    }
    51%, 100% {
        opacity: 0;
    }
}

/* --- overrides for Features 560–719px — implementation of 719px design --- */

/* Contact Info Section */
.contact-info {
    margin-top: 48px;
    padding: 0 48px;
}

.contact-info-container {
    max-width: 1344px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    animation: fadeInUp 0.8s ease-out 0.6s both;
}

.contact-info__text {
    font-family: 'Sora', sans-serif;
    font-weight: 300;
    font-size: 18px;
    line-height: 28px;
    color: #858784;
    white-space: nowrap;
}

/* Use Noto Sans for Ukrainian and Russian languages in contact info text, but keep phone number in Sora */
body.lang-uk .contact-info__text,
body.lang-ru .contact-info__text {
    font-weight: 300 !important; /* Weight for Ukrainian and Russian versions */
}

body.lang-uk .contact-info__text [data-i18n],
body.lang-ru .contact-info__text [data-i18n],
body.lang-uk .contact-info__text[data-i18n],
body.lang-ru .contact-info__text[data-i18n] {
    font-family: 'Noto Sans', sans-serif !important;
    font-weight: 300 !important; /* Weight for Ukrainian and Russian versions */
}

/* Keep phone number in Sora with same size and weight as Polish version for all languages */
body.lang-uk .contact-info__text .contact-info__phone,
body.lang-ru .contact-info__text .contact-info__phone,
body.lang-uk .contact-info__phone,
body.lang-ru .contact-info__phone {
    font-family: 'Sora', sans-serif !important;
    font-weight: 400 !important; /* Same as Polish version */
    font-size: inherit !important; /* Inherit size from parent */
    line-height: inherit !important; /* Inherit line-height from parent */
}

body.lang-uk .phone-below-cta,
body.lang-ru .phone-below-cta {
    font-family: 'Noto Sans', sans-serif;
}

/* Keep phone number in Sora with same size and weight as Polish version in phone-below-cta */
body.lang-uk .phone-below-cta .contact-info__phone,
body.lang-ru .phone-below-cta .contact-info__phone {
    font-family: 'Sora', sans-serif !important;
    font-size: inherit !important; /* Inherit size from parent */
    line-height: inherit !important; /* Inherit line-height from parent */
}

.contact-info__icons {
    display: flex;
    align-items: center;
    padding-right: 14px;
    position: relative;
}

.contact-info__icon {
    width: 64px;
    height: 64px;
    margin-right: -14px;
    position: relative;
}

.contact-info__icon:nth-child(1) {
    z-index: 3;
}

.contact-info__icon:nth-child(2) {
    z-index: 2;
}

.contact-info__icon:nth-child(3) {
    z-index: 1;
}

.contact-info__phone {
    color: #141000;
    font-weight: 400;
}

/* CTA Section */
.cta-section {
    margin-top: 56px;
    padding: 0 48px;
}

/* Brands (logos) */
.brands {
    margin-top: 120px; /* distance below hero CTA per spec */
    padding: 0; /* full-bleed carousel */
}
.brands-container { max-width: none; width: 100%; margin: 0; }

.brands-marquee {
    position: relative;
    overflow: hidden; /* hide track overflow for fade edges */
    -webkit-mask-image: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,1) 48px, rgba(0,0,0,1) calc(100% - 48px), rgba(0,0,0,0));
    mask-image: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,1) 48px, rgba(0,0,0,1) calc(100% - 48px), rgba(0,0,0,0));
}

.brands-track {
    display: flex;
    align-items: center;
    /* Shrink-wrap the track to its real content width (~3 sets). Without this,
       the flex box width stays at the viewport width while the logos overflow,
       so translateX(-100%/3) — which is relative to the BOX width — only moved
       ~1/3 of the viewport (a few logos) before looping. With max-content the
       box equals the content, so -100%/3 equals exactly one full set. */
    width: max-content;
    /* Spacing is applied as margin-right on each .brand-item (not gap) so every
       logo carries its own trailing space. This makes each of the 3 identical
       sets exactly equal in width, so translateX(-100%/3) loops seamlessly. */
    animation: brands-scroll 100s linear infinite;
    will-change: transform;
}

/* Each logo sits inside a fixed-size box to match Figma exactly */
.brand-item { height: 32px; flex: 0 0 auto; position: relative; margin-right: 40px; /* Figma gap, as margin for seamless loop */ }
.brand-logo { width: 100%; height: 100%; display: block; object-fit: contain; opacity: 0.9; }

/* Per-brand exact widths from Figma (node 1:56) */
.brand-saeco { width: 86px; }
.brand-miele { width: 84px; }
.brand-krups { width: 86px; }
.brand-siemens { width: 96px; }
.brand-philips { width: 86.857px; }
.brand-bosch { width: 66.286px; }
.brand-nivona { width: 72.828px; }
.brand-samsung { width: 113.143px; }
.brand-beko { width: 83px; }
.brand-delonghi { width: 99px; }
.brand-aeg { width: 42px; }
.brand-lg { width: 29px; }
.brand-amica { width: 64px; }
.brand-jura { width: 70.857px; }
.brand-electrolux { width: 104px; }
.brand-whirlpool { width: 90px; }

@keyframes brands-scroll {
    from { transform: translateX(0); }
    to { transform: translateX(calc(-100% / 3)); }
}

@keyframes brands-scroll-mobile {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-100% / 3)); }
}

@media (min-width: 992px) and (max-width: 1320px) {
    .brands { margin-top: 96px; }
}

@media (max-width: 992px) {
    .brands { padding: 0; margin-top: 96px; }
    .brands-marquee { -webkit-mask-image: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,1) 24px, rgba(0,0,0,1) calc(100% - 24px), rgba(0,0,0,0)); mask-image: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,1) 24px, rgba(0,0,0,1) calc(100% - 24px), rgba(0,0,0,0)); }
    .brand-item { margin-right: 32px; }
}

@media (max-width: 480px) {
    .brands { padding: 0; margin-top: 72px; }
    .brands-track {
        animation: brands-scroll-mobile 100s linear infinite;
    }
    .brand-item { margin-right: 24px; }
    /* Make next-block CTA full-width on very small screens like the first block */
    .next-block__cta .cta-button { width: 100%; }
    /* CTA button font-weight on small screens - bolder on hover */
    .cta-button { font-weight: 300; }
    .cta-button__text--original { font-weight: 300; }
    .cta-button__text--hover { font-weight: 400; }
}

.cta-section-container {
    max-width: 1344px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    animation: fadeInUp 0.8s ease-out 0.6s both;
}

.phone-below-cta {
    display: none;
    text-align: center;
    font-family: 'Sora', sans-serif;
    font-weight: 300;
    font-size: 18px;
    line-height: 28px;
    color: #858784;
}

/* Normalize tel links appearance on mobile */
.phone-below-cta a,
a[href^="tel"] {
    color: inherit;
    text-decoration: none;
}

/* Ensure phone number is black across all sizes where styled as link */
.contact-info__text .contact-info__phone { color: #141000 !important; text-decoration: none; }

    .cta-section .cta-button {
        padding: 20px 36px;
        font-size: 17px;
        line-height: 28px;
        width: auto;
        max-width: none;
    }

/* Main Content Placeholder */
.main-content { padding: 0; max-width: none; margin: 0 auto; }

/* Generic section container model: 1440 outer with 48px gutters, 1344 inner */
.section { max-width: 1440px; margin: 0 auto; padding-left: clamp(40px, calc(40px + (100vw - 1140px) * 8 / 300), 48px); padding-right: clamp(40px, calc(40px + (100vw - 1140px) * 8 / 300), 48px); }
.section__inner { max-width: 1344px; margin: 0 auto; }

/* Benefit Section (node 31:425) - Fluid scaling 1440→1140 */
.benefit-section { padding-top: clamp(88px, calc(88px + (100vw - 1140px) * 32 / 300), 120px); padding-bottom: clamp(88px, calc(88px + (100vw - 1140px) * 32 / 300), 120px); }
.benefit-section__title { 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    gap: clamp(56px, calc(56px + (100vw - 1140px) * 16 / 300), 72px);
}
.benefit-section__stack { display: flex; flex-direction: column; align-items: flex-start; gap: 0; width: max-content; margin: 0 auto; }
.benefit-section__subtitle-row { display: flex; align-items: flex-end; gap: 4px; }
.benefit-section__subtitle { font-family: 'Sora', sans-serif; font-weight: 400; font-size: clamp(16px, calc(16px + (100vw - 1140px) * 4 / 300), 20px); line-height: clamp(24px, calc(24px + (100vw - 1140px) * 4 / 300), 28px); color: #141000; padding: 8px 0; }
/* Ukrainian and Russian versions: use Noto Sans for subtitle */
body.lang-uk .benefit-section__subtitle,
body.lang-ru .benefit-section__subtitle {
    font-family: 'Noto Sans', sans-serif !important;
}
.benefit-section__icon-ok { width: clamp(51.268px, calc(51.268px + (100vw - 1140px) * 13.732 / 300), 65px); height: clamp(56px, calc(56px + (100vw - 1140px) * 15 / 300), 71px); }
.benefit-section__icon-img { width: 100%; height: 100%; display: block; object-fit: contain; }
.benefit-section__heading { font-family: 'Unbounded', sans-serif; font-weight: 500; font-size: clamp(48px, calc(48px + (100vw - 1140px) * 8 / 300), 56px); line-height: clamp(56px, calc(56px + (100vw - 1140px) * 16 / 300), 72px); color: #141000; text-align: left; }
.benefit-section__cta { display: flex; justify-content: center; margin-top: clamp(32px, calc(32px + (100vw - 620px) * (56 - 32) / (1140 - 620)), 56px); }
.benefit-section__cta .cta-button,
.article-header__phone-btn.cta-button {
    padding: clamp(18px, calc(18px + (100vw - 1140px) * 2 / 300), 20px) clamp(32px, calc(32px + (100vw - 1140px) * 4 / 300), 36px);
    font-size: clamp(16px, calc(16px + (100vw - 1140px) * 1 / 300), 17px);
    line-height: clamp(26px, calc(26px + (100vw - 1140px) * 2 / 300), 28px);
}

.benefit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: clamp(34px, calc(34px + (100vw - 414px) * (64 - 34) / (1140 - 414)), 64px); }
.benefit-grid__row { display: contents; }
.benefit-card { 
    height: auto; 
    border-radius: clamp(19px, calc(19px + (100vw - 1140px) * 5 / 300), 24px); 
    padding: clamp(24px, calc(24px + (100vw - 1140px) * 8 / 300), 32px); 
    display: flex; 
    flex-direction: column; 
    align-items: flex-start; 
    justify-content: center; 
    gap: clamp(48px, calc(48px + (100vw - 1140px) * 14 / 300), 62px);
}
.benefit-card--blue { background: #c4dfff; }
.benefit-card--orange { background: #FFA25E; }
.benefit-card--green { background: #D5EE8E; }
.benefit-card__title { font-family: 'Unbounded', sans-serif; font-weight: 400; font-size: clamp(22px, calc(22px + (100vw - 1140px) * 6 / 300), 28px); line-height: clamp(32px, calc(32px + (100vw - 1140px) * 8 / 300), 40px); color: #141000; text-align: left; text-wrap: balance; }
.benefit-card__icon { 
    width: clamp(64px, calc(64px + (100vw - 1140px) * 16 / 300), 80px); 
    height: clamp(64px, calc(64px + (100vw - 1140px) * 16 / 300), 80px); 
    align-self: center;
    opacity: 0;
    transform: scale(0.8);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

/* Show icons if JavaScript is disabled (fallback) */
.no-js .benefit-card__icon {
    opacity: 1;
    transform: scale(1);
}

/* Animate icons when they become visible */
.benefit-card__icon.animate {
    opacity: 1;
    transform: scale(1);
}
.benefit-card__icon-img { width: 100%; height: 100%; display: block; object-fit: contain; }
.benefit-card__desc { font-family: 'Sora', sans-serif; font-weight: 400; font-size: clamp(14px, calc(14px + (100vw - 1140px) * 4 / 300), 18px); line-height: clamp(22px, calc(22px + (100vw - 1140px) * 6 / 300), 28px); color: #0d0f12; text-align: left; }
/* Ukrainian and Russian versions: use Noto Sans for description text */
body.lang-uk .benefit-card__desc,
body.lang-ru .benefit-card__desc,
body.lang-uk .benefit-card__desc-line,
body.lang-ru .benefit-card__desc-line {
    font-family: 'Noto Sans', sans-serif !important;
}
.benefit-card__desc-line { display: inline; }

@media (min-width: 993px) {
    .benefit-card__desc-line { display: block; }
    /* UK/RU diagnostics: no forced line break before "200 злотих…" on large screens */
    body.lang-uk .benefit-card--orange .benefit-card__desc-line,
    body.lang-ru .benefit-card--orange .benefit-card__desc-line {
        display: inline;
    }
}

/* PL only: force line break before " – " in diagnostics card between 420px and 460px */
@media (min-width: 420px) and (max-width: 460px) {
    body.lang-pl .benefit-card--orange .benefit-diagnostics-pl-dash-break::before {
        content: '\A';
        white-space: pre;
    }
}

/* EN only: line break before " — you" in diagnostics card, 470px–541px inclusive */
@media (min-width: 470px) and (max-width: 541px) {
    body.lang-en .benefit-card--orange .benefit-diagnostics-en-dash-break::before {
        content: '\A';
        white-space: pre;
    }
}

/* EN only: line break before "of 200 PLN gross." from 451px down to smallest */
@media (max-width: 451px) {
    body.lang-en .benefit-card--orange .benefit-diagnostics-en-of-break::before {
        content: '\A';
        white-space: pre;
    }
}

/* Experience Section */
.experience-section {
    margin-top: 72px;
    margin-bottom: 72px;
    padding-top: 0;
    padding-bottom: 0;
}

.experience-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    text-align: center;
}

.experience-line {
    font-family: 'Unbounded', sans-serif;
    font-weight: 400;
    font-size: 48px;
    line-height: 64px;
    margin: 0;
    padding: 0;
}

.experience-text--gray {
    color: #aaaaaa;
}

.experience-text--bold {
    color: #141000;
}

.experience-decoration {
    display: inline-block;
    vertical-align: middle;
    margin: 0 8px;
    position: relative;
    top: 4px;
}

.experience-decoration__line {
    width: 151px;
    height: 52px;
    display: block;
}

/* Hide Polish, English, and Ukrainian versions for Russian on all sizes */
body.lang-ru .experience-line--pl,
body.lang-ru .experience-decoration--pl,
body.lang-ru .experience-line--en,
body.lang-ru .experience-decoration--en,
body.lang-ru .experience-line--uk,
body.lang-ru .experience-decoration--uk {
    display: none !important;
}

/* Ukrainian version - Desktop layout (1441px+) - same approach as English and Polish */
@media (min-width: 1441px) {
    /* Hide Polish and English versions for Ukrainian */
    body.lang-uk .experience-line--pl,
    body.lang-uk .experience-decoration--pl,
    body.lang-uk .experience-line--en,
    body.lang-uk .experience-decoration--en {
        display: none !important;
    }
    
    /* Show Ukrainian desktop version */
    body.lang-uk .experience-line--desktop.experience-line--uk {
        display: block !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 400 !important; /* Regular */
        font-size: 48px !important;
        line-height: 64px !important;
    }
    
    /* Ukrainian version SVG decoration */
    body.lang-uk .experience-decoration--desktop.experience-decoration--uk {
        display: inline-block;
        vertical-align: middle;
        margin: 0;
        position: relative;
        top: 4px;
    }
    
    body.lang-uk .experience-decoration--desktop.experience-decoration--uk .experience-decoration__line {
        width: 151px;
        height: 52px;
        display: block;
    }
    
    /* Ukrainian content width */
    body.lang-uk .experience-content {
        max-width: 1320px !important;
    }
}

/* Ukrainian version - Desktop layout (1440px) - fixed values */
@media (min-width: 1440px) and (max-width: 1440px) {
    /* Hide Polish and English versions for Ukrainian */
    body.lang-uk .experience-line--pl,
    body.lang-uk .experience-decoration--pl,
    body.lang-uk .experience-line--en,
    body.lang-uk .experience-decoration--en {
        display: none !important;
    }
    
    /* Show Ukrainian desktop version */
    body.lang-uk .experience-line--desktop.experience-line--uk {
        display: block !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 400 !important; /* Regular */
        font-size: 48px !important;
        line-height: 64px !important;
    }
    
    /* Ukrainian version SVG decoration */
    body.lang-uk .experience-decoration--desktop.experience-decoration--uk {
        display: inline-block;
        vertical-align: middle;
        margin: 0;
        position: relative;
        top: 4px;
    }
    
    body.lang-uk .experience-decoration--desktop.experience-decoration--uk .experience-decoration__line {
        width: 151px;
        height: 52px;
        display: block;
    }
    
    /* Ukrainian content width */
    body.lang-uk .experience-content {
        max-width: 1320px !important;
    }
    
    /* Hide Russian version for non-Russian languages */
    body:not(.lang-ru) .experience-line--ru,
    body:not(.lang-ru) .experience-decoration--ru {
        display: none !important;
    }
    
    /* Show Russian desktop version */
    body.lang-ru .experience-line--desktop.experience-line--ru {
        display: block !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 400 !important; /* Regular */
        font-size: 48px !important;
        line-height: 64px !important;
    }
    
    /* Russian version SVG decoration */
    body.lang-ru .experience-decoration--desktop.experience-decoration--ru {
        display: inline-block;
        vertical-align: middle;
        margin: 0 -5px; /* tighten gap to the words */
        position: relative;
        top: 4px;
    }
    
    body.lang-ru .experience-decoration--desktop.experience-decoration--ru .experience-decoration__line {
        width: 151px;
        height: 52px;
        display: block;
    }
    
    /* Russian content width */
    body.lang-ru .experience-content {
        max-width: 1320px !important;
    }
}

/* English version - Desktop layout (1440px+) - same approach as Polish */
@media (min-width: 1440px) {
    /* Hide Polish version for English */
    body.lang-en .experience-line--pl,
    body.lang-en .experience-decoration--pl {
        display: none !important;
    }
    
    /* Show English desktop version */
    body.lang-en .experience-line--desktop.experience-line--en {
        display: block !important;
    }
    
    /* Hide English tablet version on desktop */
    body.lang-en .experience-line--tablet-en,
    body.lang-en .experience-decoration--tablet-en {
        display: none !important;
    }
    
    /* English version uses same styling as Polish, just different text */
    body.lang-en .experience-decoration--desktop.experience-decoration--en {
        display: inline-block;
        vertical-align: middle;
        margin: 0 0 0 -4px; /* pull icon left toward "Over" */
        position: relative;
        top: 0px; /* a bit higher */
    }
    
    body.lang-en .experience-decoration--desktop.experience-decoration--en .experience-decoration__line {
        width: 151px;
        height: 52px;
        display: block;
    }
}

/* Hide English version for non-English languages - all breakpoints */
body:not(.lang-en) .experience-line--en,
body:not(.lang-en) .experience-decoration--en,
body:not(.lang-en) .experience-line--tablet-en,
body:not(.lang-en) .experience-decoration--tablet-en,
body:not(.lang-en) .experience-line--mobile-en,
body:not(.lang-en) .experience-decoration--mobile-en {
    display: none !important;
}

/* Hide Ukrainian version for non-Ukrainian languages - all breakpoints */
body:not(.lang-uk) .experience-line--uk,
body:not(.lang-uk) .experience-decoration--uk,
body:not(.lang-uk) .experience-line--tablet-uk,
body:not(.lang-uk) .experience-decoration--tablet-uk,
body:not(.lang-uk) .experience-line--mobile-uk,
body:not(.lang-uk) .experience-decoration--mobile-uk {
    display: none !important;
}

/* Hide Russian version for non-Russian languages - all breakpoints */
body:not(.lang-ru) .experience-line--ru,
body:not(.lang-ru) .experience-decoration--ru {
    display: none !important;
}

/* Hide Spanish version for non-Spanish languages - all breakpoints */
body:not(.lang-es) .experience-line--es,
body:not(.lang-es) .experience-decoration--es,
body:not(.lang-es) .experience-line--mobile-es,
body:not(.lang-es) .experience-decoration--mobile-es {
    display: none !important;
}

/* Spanish: hide the Polish desktop variant so the ES desktop block shows
   instead (ES inherits the same 993-1440+ desktop scaling as PL). */
body.lang-es .experience-line--desktop.experience-line--pl,
body.lang-es .experience-decoration--pl {
    display: none !important;
}

/* Spanish desktop decoration: use the Figma icon size (134x47) instead of the
   shared 151x52, and tighten the gap to the surrounding text.
   Fixed px at >=1440, viewport-scaled between 993-1439 (values = size at 1440). */
@media (min-width: 1440px) {
    body.lang-es .experience-decoration--es .experience-decoration__line {
        width: 134px !important;
        height: 47px !important;
    }
    body.lang-es .experience-decoration--es {
        margin: 0 0 0 -4px !important;
    }
}
@media (min-width: 993px) and (max-width: 1439px) {
    body.lang-es .experience-decoration--es .experience-decoration__line {
        width: 9.31vw !important;  /* 134px at 1440px */
        height: 3.26vw !important; /* 47px at 1440px */
    }
    body.lang-es .experience-decoration--es {
        margin: 0 0 0 -0.28vw !important; /* -4px at 1440px */
    }
}

/* Spanish tablet (620-992px): reuse the same ES paragraphs as desktop, rendered
   at tablet size (32/40, centered, 540px) so they wrap like the Figma design.
   The default Polish tablet content is hidden for Spanish. Decoration: 93x33. */
@media (min-width: 620px) and (max-width: 992px) {
    body.lang-es .experience-line--desktop.experience-line--es {
        display: block !important;
        font-size: 32px !important;
        line-height: 40px !important;
        text-align: center !important;
        width: 540px !important;
        margin: 0 auto !important;
        padding: 0 !important;
    }
    body.lang-es .experience-decoration--desktop.experience-decoration--es {
        display: inline-block !important;
        vertical-align: middle !important;
        margin: 0 0 0 -4px !important;
        position: relative !important;
        top: 2px !important;
    }
    body.lang-es .experience-decoration--es .experience-decoration__line {
        width: 110px !important;
        height: 39px !important;
        display: block !important;
    }
    /* Hide the Polish (default) tablet content for Spanish */
    body.lang-es .experience-line--tablet,
    body.lang-es .experience-decoration--tablet-inline {
        display: none !important;
    }
}

/* Spanish mobile (<=619px): proportional vw scaling anchored at 414px, so the
   layout stays exactly like the Figma design and scales uniformly up (toward
   619px) and down (below 414px). All values = the Figma size at 414px. */
@media (max-width: 619px) {
    body.lang-es .experience-line--mobile:not(.experience-line--mobile-es) {
        display: none !important;
    }
    body.lang-es .experience-line--mobile.experience-line--mobile-es {
        display: block !important;
        font-size: 5.56vw !important;   /* 23px at 414px */
        line-height: 7.73vw !important; /* 32px at 414px */
        text-align: left !important;
        width: 100% !important;
    }
    body.lang-es .experience-decoration--mobile-inline:not(.experience-decoration--mobile-es) {
        display: none !important;
    }
    body.lang-es .experience-decoration--mobile-inline.experience-decoration--mobile-es {
        display: inline-block !important;
        vertical-align: middle !important;
        margin: 0 0.72vw 0 0 !important; /* flush left (Figma left:0), ~3px right at 414px, scales by vw */
        position: relative !important;
        top: 1.21vw !important; /* ~5px at 414px, scales by vw */
    }
    body.lang-es .experience-decoration--mobile-es .experience-decoration__line {
        width: 23.67vw !important;  /* 98px at 414px */
        height: 8.45vw !important;  /* 35px at 414px */
    }
}

/* Polish mobile (<=619px): proportional vw scaling anchored at 414px (resize
   like the Spanish version). Keeps the existing Polish squiggle icon. */
@media (max-width: 619px) {
    .experience-line--mobile.experience-line--mobile-pl {
        font-size: 5.56vw !important;   /* 23px at 414px */
        line-height: 7.73vw !important; /* 32px at 414px */
        text-align: left !important;
    }
    .experience-decoration--mobile-inline.experience-decoration--mobile-pl {
        display: inline-block !important;
        vertical-align: middle !important;
        margin: 0 0.97vw 0 0 !important; /* flush left, ~4px right at 414px, scales by vw */
        position: relative !important;
        top: 1.21vw !important; /* ~5px at 414px, scales by vw */
    }
    .experience-decoration--mobile-pl .experience-decoration__line {
        width: 28.5vw !important;  /* 118px at 414px */
        height: 9.66vw !important; /* 40px at 414px */
    }
}

/* Global rules: Hide English tablet version on desktop sizes (1440px+) */
@media (min-width: 1440px) {
    body.lang-en .experience-line--tablet-en,
    body.lang-en .experience-decoration--tablet-en {
        display: none !important;
    }
}

/* Global rules: Hide English desktop version on tablet sizes (620-992px) */
@media (min-width: 620px) and (max-width: 992px) {
    body.lang-en .experience-line--desktop.experience-line--en,
    body.lang-en .experience-decoration--desktop.experience-decoration--en {
        display: none !important;
    }
    
    /* Hide Ukrainian desktop version on tablet sizes */
    body.lang-uk .experience-line--desktop.experience-line--uk,
    body.lang-uk .experience-decoration--desktop.experience-decoration--uk {
        display: none !important;
    }
}

/* Global rules: Hide English desktop and tablet versions on mobile sizes (414-619px) */
@media (min-width: 414px) and (max-width: 619px) {
    body.lang-en .experience-line--desktop.experience-line--en,
    body.lang-en .experience-decoration--desktop.experience-decoration--en,
    body.lang-en .experience-line--tablet-en,
    body.lang-en .experience-decoration--tablet-en {
        display: none !important;
    }
}

/* Viewport-based scaling for screens from 993px to 1439px */
@media (min-width: 993px) and (max-width: 1439px) {
    .experience-section {
        margin-top: 5vw; /* 72px at 1440px */
        margin-bottom: 5vw; /* 72px at 1440px */
    }
    
    .experience-line {
        font-size: 3.33vw; /* 48px at 1440px */
        line-height: 4.44vw; /* 64px at 1440px */
    }
    
    .experience-decoration {
        margin: 0 0.56vw; /* 8px at 1440px */
        top: 0.28vw; /* 4px at 1440px */
    }
    
    .experience-decoration__line {
        width: 10.49vw; /* 151px at 1440px */
        height: 3.61vw; /* 52px at 1440px */
    }
    
    /* Show English desktop version with proportional scaling */
    body.lang-en .experience-line--desktop.experience-line--en {
        display: block !important;
    }
    
    body.lang-en .experience-decoration--desktop.experience-decoration--en {
        display: inline-block !important;
        vertical-align: middle;
        margin: 0 0 0 -0.28vw; /* pull icon left toward "Over" (~4px at 1440px) */
        position: relative;
        top: 0vw; /* a bit higher */
    }
    
    body.lang-en .experience-decoration--desktop.experience-decoration--en .experience-decoration__line {
        width: 10.49vw; /* 151px at 1440px */
        height: 3.61vw; /* 52px at 1440px */
    }
    
    /* Hide English tablet version on 993-1440px */
    body.lang-en .experience-line--tablet-en,
    body.lang-en .experience-decoration--tablet-en {
        display: none !important;
    }
    
    /* Hide Polish version for English */
    body.lang-en .experience-line--pl,
    body.lang-en .experience-decoration--pl,
    body.lang-en .experience-line--tablet:not(.experience-line--tablet-en),
    body.lang-en .experience-decoration--tablet-inline {
        display: none !important;
    }
    
    /* Hide Ukrainian version for English on 993-1440px */
    body.lang-en .experience-line--uk,
    body.lang-en .experience-decoration--uk {
        display: none !important;
    }
    
    /* Ukrainian version with proportional scaling */
    body.lang-uk .experience-line--desktop.experience-line--uk {
        display: block !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 400 !important; /* Regular */
        font-size: 3.33vw !important; /* 48px at 1440px */
        line-height: 4.44vw !important; /* 64px at 1440px */
    }
    
    body.lang-uk .experience-decoration--desktop.experience-decoration--uk {
        display: inline-block !important;
        vertical-align: middle;
        margin: 0;
        position: relative;
        top: 0.28vw; /* 4px at 1440px */
    }
    
    body.lang-uk .experience-decoration--desktop.experience-decoration--uk .experience-decoration__line {
        width: 10.49vw !important; /* 151px at 1440px */
        height: 3.61vw !important; /* 52px at 1440px */
    }
    
    body.lang-uk .experience-content {
        max-width: 91.67vw !important; /* 1320px at 1440px */
    }
    
    /* Hide Polish and English versions for Ukrainian */
    body.lang-uk .experience-line--pl,
    body.lang-uk .experience-decoration--pl,
    body.lang-uk .experience-line--en,
    body.lang-uk .experience-decoration--en {
        display: none !important;
    }
    
    /* Hide Russian version for non-Russian languages on 993-1440px */
    body:not(.lang-ru) .experience-line--ru,
    body:not(.lang-ru) .experience-decoration--ru {
        display: none !important;
    }
    
    /* Russian version with proportional scaling */
    body.lang-ru .experience-line--desktop.experience-line--ru {
        display: block !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 400 !important; /* Regular */
        font-size: 3.33vw !important; /* 48px at 1440px */
        line-height: 4.44vw !important; /* 64px at 1440px */
    }
    
    
    body.lang-ru .experience-decoration--desktop.experience-decoration--ru {
        display: inline-block !important;
        vertical-align: middle;
        margin: 0 -0.35vw; /* tighten gap to the words (~-5px at 1440px) */
        position: relative;
        top: 0.28vw; /* 4px at 1440px */
    }
    
    body.lang-ru .experience-decoration--desktop.experience-decoration--ru .experience-decoration__line {
        width: 10.49vw !important; /* 151px at 1440px */
        height: 3.61vw !important; /* 52px at 1440px */
    }
    
    body.lang-ru .experience-content {
        max-width: 91.67vw !important; /* 1320px at 1440px */
    }
    
    /* Hide Polish, English, and Ukrainian versions for Russian on 993-1440px */
    body.lang-ru .experience-line--pl,
    body.lang-ru .experience-decoration--pl,
    body.lang-ru .experience-line--en,
    body.lang-ru .experience-decoration--en,
    body.lang-ru .experience-line--uk,
    body.lang-ru .experience-decoration--uk {
        display: none !important;
    }
}

/* Experience Section for screens from 414px to 619px - proportional scaling via vw */
@media (min-width: 414px) and (max-width: 619px) {
    .experience-section {
        margin-top: calc(24px + (48px - 24px) * (100vw - 414px) / (619px - 414px));
        margin-bottom: calc(24px + (48px - 24px) * (100vw - 414px) / (619px - 414px));
    }
    
    .section.experience-section {
        padding-left: 20px;
        padding-right: 20px;
    }
    
    /* Hide desktop and tablet versions */
    .experience-line--desktop {
        display: none;
    }
    
    .experience-decoration--desktop {
        display: none;
    }
    
    .experience-line--tablet {
        display: none;
    }
    
    .experience-decoration--tablet-inline {
        display: none;
    }
    
    /* Show mobile version with proportional scaling via vw */
    .experience-content {
        width: 100%;
        margin: 0 auto;
        align-items: flex-start;
        position: relative;
    }
    
    .experience-line--mobile {
        display: block;
        font-size: calc(23px + (32px - 23px) * (100vw - 414px) / (619px - 414px));
        line-height: calc(32px + (40px - 32px) * (100vw - 414px) / (619px - 414px));
        text-align: left;
        width: 100%;
        margin: 0;
        padding: 0;
    }
    
    .experience-decoration--mobile-inline {
        display: inline-block;
        vertical-align: middle;
        margin: 0 4px;
        position: relative;
        top: 2px;
    }
    
    .experience-decoration__line--mobile-inline {
        width: calc(118px - (118px - 94px) * (100vw - 414px) / (619px - 414px));
        height: calc(40px - (40px - 32px) * (100vw - 414px) / (619px - 414px));
        display: block;
    }
    
    /* Hide English desktop and tablet versions on mobile */
    body.lang-en .experience-line--desktop.experience-line--en,
    body.lang-en .experience-decoration--desktop.experience-decoration--en,
    body.lang-en .experience-line--tablet-en,
    body.lang-en .experience-decoration--tablet-en {
        display: none !important;
    }
    
    /* Hide Ukrainian version for non-Ukrainian languages on mobile */
    body:not(.lang-uk) .experience-line--uk,
    body:not(.lang-uk) .experience-decoration--uk,
    body:not(.lang-uk) .experience-line--tablet-uk,
    body:not(.lang-uk) .experience-decoration--tablet-uk,
    body:not(.lang-uk) .experience-line--mobile-uk,
    body:not(.lang-uk) .experience-decoration--mobile-uk {
        display: none !important;
    }
    
    /* Hide Polish mobile version for English */
    body.lang-en .experience-line--mobile:not(.experience-line--mobile-en) {
        display: none !important;
    }
    
    /* Show English mobile version */
    body.lang-en .experience-line--mobile.experience-line--mobile-en {
        display: block !important;
    }
    
    /* Hide Polish mobile decoration for English */
    body.lang-en .experience-decoration--mobile-inline:not(.experience-decoration--mobile-en) {
        display: none !important;
    }
    
    /* Show English mobile decoration */
    body.lang-en .experience-decoration--mobile-inline.experience-decoration--mobile-en {
        display: inline-block !important;
        vertical-align: middle !important;
        margin: 0 4px !important;
        position: relative !important;
        top: 2px !important;
    }
    
    body.lang-en .experience-decoration--mobile-en .experience-decoration__line {
        width: calc(118px - (118px - 94px) * (100vw - 414px) / (619px - 414px)) !important;
        height: calc(40px - (40px - 32px) * (100vw - 414px) / (619px - 414px)) !important;
    }
    
    /* Hide Ukrainian desktop and tablet versions on mobile */
    body.lang-uk .experience-line--desktop.experience-line--uk,
    body.lang-uk .experience-decoration--desktop.experience-decoration--uk,
    body.lang-uk .experience-line--tablet.experience-line--tablet-uk,
    body.lang-uk .experience-decoration--tablet-inline.experience-decoration--tablet-uk {
        display: none !important;
    }
    
    /* Hide Polish, English, and Russian mobile versions for Ukrainian */
    body.lang-uk .experience-line--mobile:not(.experience-line--mobile-uk),
    body.lang-uk .experience-line--mobile-ru {
        display: none !important;
    }
    
    /* Show Ukrainian mobile version */
    body.lang-uk .experience-line--mobile.experience-line--mobile-uk {
        display: block !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 400 !important; /* Regular */
    }
    
    /* Hide Polish, English, and Russian mobile decoration for Ukrainian */
    body.lang-uk .experience-decoration--mobile-inline:not(.experience-decoration--mobile-uk),
    body.lang-uk .experience-decoration--mobile-ru {
        display: none !important;
    }
    
    /* Show Ukrainian mobile decoration - inline like Polish */
    body.lang-uk .experience-decoration--mobile-inline.experience-decoration--mobile-uk {
        display: inline-block !important;
        vertical-align: middle !important;
        margin: 0 4px !important;
        position: relative !important;
        top: 2px !important;
    }
    
    body.lang-uk .experience-decoration--mobile-uk .experience-decoration__line {
        width: calc(118px - (118px - 94px) * (100vw - 414px) / (619px - 414px)) !important;
        height: calc(40px - (40px - 32px) * (100vw - 414px) / (619px - 414px)) !important;
    }
    
    /* Hide Russian desktop and tablet versions on mobile */
    body.lang-ru .experience-line--desktop.experience-line--ru,
    body.lang-ru .experience-decoration--desktop.experience-decoration--ru,
    body.lang-ru .experience-line--tablet.experience-line--tablet-ru,
    body.lang-ru .experience-decoration--tablet-inline.experience-decoration--tablet-ru {
        display: none !important;
    }
    
    /* Hide Polish and English mobile versions for Russian */
    body.lang-ru .experience-line--mobile:not(.experience-line--mobile-ru) {
        display: none !important;
    }
    
    /* Show Russian mobile version */
    body.lang-ru .experience-line--mobile.experience-line--mobile-ru {
        display: block !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 400 !important; /* Regular */
    }
    
    /* Hide Polish and English mobile decoration for Russian */
    body.lang-ru .experience-decoration--mobile-inline:not(.experience-decoration--mobile-ru) {
        display: none !important;
    }
    
    /* Show Russian mobile decoration */
    body.lang-ru .experience-decoration--mobile-inline.experience-decoration--mobile-ru {
        display: inline-block !important;
        vertical-align: middle !important;
        margin: 0 4px !important;
        position: relative !important;
        top: 2px !important;
    }
    
    body.lang-ru .experience-decoration--mobile-ru .experience-decoration__line {
        width: calc(118px - (118px - 94px) * (100vw - 414px) / (619px - 414px)) !important;
        height: calc(40px - (40px - 32px) * (100vw - 414px) / (619px - 414px)) !important;
    }
    
    /* Hide Russian version for non-Russian languages on mobile */
    body:not(.lang-ru) .experience-line--ru,
    body:not(.lang-ru) .experience-decoration--ru,
    body:not(.lang-ru) .experience-line--tablet-ru,
    body:not(.lang-ru) .experience-decoration--tablet-ru,
    body:not(.lang-ru) .experience-line--mobile-ru,
    body:not(.lang-ru) .experience-decoration--mobile-ru {
        display: none !important;
    }
}

/* Experience Section for screens from 620px to 992px */
@media (min-width: 620px) and (max-width: 992px) {
    .experience-section {
        margin-top: 48px;
        margin-bottom: 48px;
    }
    
    /* Hide desktop version */
    .experience-line--desktop {
        display: none;
    }
    
    .experience-decoration--desktop {
        display: none;
    }
    
    /* Show tablet version */
    .experience-content {
        width: 540px;
        margin: 0 auto;
        align-items: center;
        position: relative;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
    }
    
    body.lang-en .experience-content {
        padding: 0 !important;
        margin: 0 auto !important;
    }
    
    body.lang-uk .experience-content {
        padding: 0 !important;
        margin: 0 auto !important;
        position: relative !important;
    }
    
    .experience-line--tablet {
        display: block;
        font-size: 32px;
        line-height: 40px;
        text-align: center;
        width: 540px;
        margin: 0;
        padding: 0;
    }
    
    .experience-decoration--tablet-inline {
        display: inline-block;
        vertical-align: middle;
        margin: 0 0 0 -4px;
        position: relative;
        top: 2px;
    }
    
    .experience-decoration__line--tablet-inline {
        width: 110px;
        height: 39px;
        display: block;
    }
    
    /* Hide English desktop version on tablet sizes */
    body.lang-en .experience-line--desktop.experience-line--en,
    body.lang-en .experience-decoration--desktop.experience-decoration--en {
        display: none !important;
    }
    
    /* English version for tablet - 5 separate paragraphs like desktop structure */
    body.lang-en .experience-line.experience-line--tablet.experience-line--tablet-en {
        display: block !important;
        font-size: 32px !important;
        line-height: 40px !important;
        text-align: center !important;
        width: 540px !important;
        margin: 0 auto !important;
        padding: 0 !important;
    }
    
    body.lang-en .experience-line--tablet:not(.experience-line--tablet-en) {
        display: none !important;
    }
    
    /* Hide Polish tablet version for English */
    body.lang-en .experience-decoration--tablet-inline:not(.experience-decoration--tablet-en) {
        display: none !important;
    }
    
    /* English tablet version uses same inline approach as Polish */
    body.lang-en .experience-decoration--tablet-inline.experience-decoration--tablet-en {
        display: inline-block !important;
        vertical-align: middle !important;
        margin: 0 0 0 -4px !important;
        position: relative !important;
        top: 2px !important;
    }
    
    body.lang-en .experience-decoration--tablet-en .experience-decoration__line {
        width: 110px !important;
        height: 39px !important;
        display: block !important;
    }
    
    /* Hide Polish desktop version for English on tablet */
    body.lang-en .experience-line--pl,
    body.lang-en .experience-decoration--pl {
        display: none !important;
    }
    
    /* Hide Ukrainian desktop version on tablet sizes */
    body.lang-uk .experience-line--desktop.experience-line--uk,
    body.lang-uk .experience-decoration--desktop.experience-decoration--uk {
        display: none !important;
    }
    
    /* Ukrainian version for tablet - one paragraph like in Figma */
    body.lang-uk .experience-line.experience-line--tablet.experience-line--tablet-uk {
        display: block !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 400 !important; /* Regular */
        font-size: 32px !important;
        line-height: 40px !important;
        text-align: center !important;
        width: 540px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        align-self: center !important;
    }
    
    body.lang-uk .experience-line--tablet:not(.experience-line--tablet-uk) {
        display: none !important;
    }
    
    /* Hide Polish and English tablet versions for Ukrainian */
    body.lang-uk .experience-decoration--tablet-inline:not(.experience-decoration--tablet-uk) {
        display: none !important;
    }
    
    /* Ukrainian tablet version - absolute positioning for decoration */
    body.lang-uk .experience-decoration--tablet-inline.experience-decoration--tablet-uk {
        display: inline-block !important;
        vertical-align: middle !important;
        margin: 0 0 0 -4px !important;
        position: relative !important;
        top: 2px !important;
    }
    
    body.lang-uk .experience-decoration--tablet-uk .experience-decoration__line {
        width: 110px !important;
        height: 39px !important;
        display: block !important;
    }
    
    /* Hide Polish and English desktop versions for Ukrainian on tablet */
    body.lang-uk .experience-line--pl,
    body.lang-uk .experience-decoration--pl,
    body.lang-uk .experience-line--en,
    body.lang-uk .experience-decoration--en {
        display: none !important;
    }
    
    /* Hide Ukrainian version for non-Ukrainian languages on tablet */
    body:not(.lang-uk) .experience-line--uk,
    body:not(.lang-uk) .experience-decoration--uk,
    body:not(.lang-uk) .experience-line--tablet-uk,
    body:not(.lang-uk) .experience-decoration--tablet-uk,
    body:not(.lang-uk) .experience-line--mobile-uk,
    body:not(.lang-uk) .experience-decoration--mobile-uk {
        display: none !important;
    }
    
    /* Hide Russian desktop version on tablet sizes */
    body.lang-ru .experience-line--desktop.experience-line--ru,
    body.lang-ru .experience-decoration--desktop.experience-decoration--ru {
        display: none !important;
    }
    
    /* Russian version for tablet */
    body.lang-ru .experience-line.experience-line--tablet.experience-line--tablet-ru {
        display: flex !important;
        flex-direction: column !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 400 !important; /* Regular */
        font-size: 32px !important;
        line-height: 40px !important;
        text-align: center !important;
        width: 540px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        position: relative !important;
    }
    
    body.lang-ru .experience-line--tablet-ru__paragraph {
        margin: 0 !important;
        padding: 0 !important;
        /* Override the generic `p` rule from negocios.css (Arial/16px)
           so the nested tablet paragraph keeps the experience font */
        font-family: 'Unbounded', sans-serif !important;
        font-size: 32px !important;
        line-height: 40px !important;
        font-weight: 400 !important;
        letter-spacing: normal !important;
    }
    
    body.lang-ru .experience-line--tablet-ru__paragraph:first-child {
        margin-bottom: 0 !important;
    }
    
    body.lang-ru .experience-line--tablet:not(.experience-line--tablet-ru) {
        display: none !important;
    }
    
    /* Hide Polish, English, and Ukrainian tablet versions for Russian */
    body.lang-ru .experience-decoration--tablet-inline:not(.experience-decoration--tablet-ru) {
        display: none !important;
    }
    
    /* Russian tablet version - inline decoration */
    body.lang-ru .experience-decoration--tablet-inline.experience-decoration--tablet-ru {
        display: inline-block !important;
        vertical-align: middle !important;
        margin: 0 0 0 -4px !important;
        position: relative !important;
        top: 2px !important;
    }
    
    body.lang-ru .experience-decoration--tablet-ru .experience-decoration__line {
        width: 110px !important;
        height: 39px !important;
        display: block !important;
    }
    
    body.lang-ru .experience-decoration--tablet-ru .experience-decoration__line {
        width: 110px !important;
        height: 39px !important;
        display: block !important;
    }
    
    /* Hide Polish, English, and Ukrainian desktop versions for Russian on tablet */
    body.lang-ru .experience-line--pl,
    body.lang-ru .experience-decoration--pl,
    body.lang-ru .experience-line--en,
    body.lang-ru .experience-decoration--en,
    body.lang-ru .experience-line--uk,
    body.lang-ru .experience-decoration--uk {
        display: none !important;
    }
    
    /* Hide Russian version for non-Russian languages on tablet */
    body:not(.lang-ru) .experience-line--ru,
    body:not(.lang-ru) .experience-decoration--ru,
    body:not(.lang-ru) .experience-line--tablet-ru,
    body:not(.lang-ru) .experience-decoration--tablet-ru {
        display: none !important;
    }
    
    body.lang-ru .experience-content {
        padding: 0 !important;
        margin: 0 auto !important;
    }
}

/* Experience Section for screens <= 414px - proportional scaling via vw */
@media (max-width: 414px) {
    .experience-section {
        margin-top: 5.8vw; /* 24px at 414px */
        margin-bottom: 5.8vw; /* 24px at 414px */
    }
    
    .section.experience-section {
        padding-left: 4.83vw; /* 20px at 414px */
        padding-right: 4.83vw; /* 20px at 414px */
    }
    
    /* Hide desktop and tablet versions */
    .experience-line--desktop {
        display: none;
    }
    
    .experience-decoration--desktop {
        display: none;
    }
    
    .experience-line--tablet {
        display: none;
    }
    
    .experience-decoration--tablet-inline {
        display: none;
    }
    
    /* Show mobile version with vw scaling */
    .experience-content {
        width: 100%;
        margin: 0 auto;
        align-items: flex-start;
        position: relative;
    }
    
    .experience-line--mobile {
        display: block;
        font-size: 5.56vw; /* 23px at 414px */
        line-height: 7.73vw; /* 32px at 414px */
        text-align: left;
        width: 100%;
        margin: 0;
        padding: 0;
    }
    
    .experience-decoration--mobile-inline {
        display: inline-block;
        vertical-align: middle;
        margin: 0 0.97vw; /* 4px at 414px */
        position: relative;
        top: 0.48vw; /* 2px at 414px */
    }
    
    .experience-decoration__line--mobile-inline {
        width: 28.5vw; /* 118px at 414px */
        height: 9.66vw; /* 40px at 414px */
        display: block;
    }
    
    /* Hide Polish mobile version for English */
    body.lang-en .experience-line--mobile:not(.experience-line--mobile-en) {
        display: none !important;
    }
    
    /* Show English mobile version */
    body.lang-en .experience-line--mobile.experience-line--mobile-en {
        display: block !important;
    }
    
    /* Hide Polish mobile decoration for English */
    body.lang-en .experience-decoration--mobile-inline:not(.experience-decoration--mobile-en) {
        display: none !important;
    }
    
    /* Show English mobile decoration */
    body.lang-en .experience-decoration--mobile-inline.experience-decoration--mobile-en {
        display: inline-block !important;
        vertical-align: middle !important;
        margin: 0 0.97vw !important; /* 4px at 414px */
        position: relative !important;
        top: 0.48vw !important; /* 2px at 414px */
    }
    
    body.lang-en .experience-decoration--mobile-en .experience-decoration__line {
        width: 28.5vw !important; /* 118px at 414px */
        height: 9.66vw !important; /* 40px at 414px */
    }
    
    /* Hide Ukrainian desktop and tablet versions on mobile */
    body.lang-uk .experience-line--desktop.experience-line--uk,
    body.lang-uk .experience-decoration--desktop.experience-decoration--uk,
    body.lang-uk .experience-line--tablet.experience-line--tablet-uk,
    body.lang-uk .experience-decoration--tablet-inline.experience-decoration--tablet-uk {
        display: none !important;
    }
    
    /* Hide Polish, English, and Russian mobile versions for Ukrainian */
    body.lang-uk .experience-line--mobile:not(.experience-line--mobile-uk),
    body.lang-uk .experience-line--mobile-ru {
        display: none !important;
    }
    
    /* Show Ukrainian mobile version */
    body.lang-uk .experience-line--mobile.experience-line--mobile-uk {
        display: block !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 400 !important; /* Regular */
    }
    
    /* Hide Polish, English, and Russian mobile decoration for Ukrainian */
    body.lang-uk .experience-decoration--mobile-inline:not(.experience-decoration--mobile-uk),
    body.lang-uk .experience-decoration--mobile-ru {
        display: none !important;
    }
    
    /* Show Ukrainian mobile decoration - inline like Polish */
    body.lang-uk .experience-decoration--mobile-inline.experience-decoration--mobile-uk {
        display: inline-block !important;
        vertical-align: middle !important;
        margin: 0 0.97vw !important; /* 4px at 414px */
        position: relative !important;
        top: 0.48vw !important; /* 2px at 414px */
    }
    
    body.lang-uk .experience-decoration--mobile-uk .experience-decoration__line {
        width: 28.5vw !important; /* 118px at 414px */
        height: 9.66vw !important; /* 40px at 414px */
    }
    
    /* Hide Ukrainian version for non-Ukrainian languages on mobile (≤414px) */
    body:not(.lang-uk) .experience-line--uk,
    body:not(.lang-uk) .experience-decoration--uk,
    body:not(.lang-uk) .experience-line--tablet-uk,
    body:not(.lang-uk) .experience-decoration--tablet-uk,
    body:not(.lang-uk) .experience-line--mobile-uk,
    body:not(.lang-uk) .experience-decoration--mobile-uk {
        display: none !important;
    }
    
    /* Hide Russian desktop and tablet versions on mobile */
    body.lang-ru .experience-line--desktop.experience-line--ru,
    body.lang-ru .experience-decoration--desktop.experience-decoration--ru,
    body.lang-ru .experience-line--tablet.experience-line--tablet-ru,
    body.lang-ru .experience-decoration--tablet-inline.experience-decoration--tablet-ru {
        display: none !important;
    }
    
    /* Hide Polish and English mobile versions for Russian */
    body.lang-ru .experience-line--mobile:not(.experience-line--mobile-ru) {
        display: none !important;
    }
    
    /* Show Russian mobile version */
    body.lang-ru .experience-line--mobile.experience-line--mobile-ru {
        display: block !important;
        font-family: 'Unbounded', sans-serif !important;
        font-weight: 400 !important; /* Regular */
    }
    
    /* Hide Polish and English mobile decoration for Russian */
    body.lang-ru .experience-decoration--mobile-inline:not(.experience-decoration--mobile-ru) {
        display: none !important;
    }
    
    /* Show Russian mobile decoration */
    body.lang-ru .experience-decoration--mobile-inline.experience-decoration--mobile-ru {
        display: inline-block !important;
        vertical-align: middle !important;
        margin: 0 0.97vw !important; /* 4px at 414px */
        position: relative !important;
        top: 0.48vw !important; /* 2px at 414px */
    }
    
    body.lang-ru .experience-decoration--mobile-ru .experience-decoration__line {
        width: 28.5vw !important; /* 118px at 414px */
        height: 9.66vw !important; /* 40px at 414px */
    }
    
    /* Hide Russian version for non-Russian languages on mobile (≤414px) */
    body:not(.lang-ru) .experience-line--ru,
    body:not(.lang-ru) .experience-decoration--ru,
    body:not(.lang-ru) .experience-line--tablet-ru,
    body:not(.lang-ru) .experience-decoration--tablet-ru,
    body:not(.lang-ru) .experience-line--mobile-ru,
    body:not(.lang-ru) .experience-decoration--mobile-ru {
        display: none !important;
    }
}

/* English mobile (<=619px): proportional vw scaling anchored at 414px (resize
   like the Spanish/Polish versions); icon flush-left at the start of the line. */
@media (max-width: 619px) {
    body.lang-en .experience-line--mobile.experience-line--mobile-en {
        font-size: 5.56vw !important;   /* 23px at 414px */
        line-height: 7.73vw !important; /* 32px at 414px */
        text-align: left !important;
    }
    body.lang-en .experience-decoration--mobile-inline.experience-decoration--mobile-en {
        margin: 0 0.97vw 0 0 !important; /* flush left, ~4px right at 414px, scales by vw */
        top: 1.21vw !important; /* ~5px at 414px */
    }
    body.lang-en .experience-decoration--mobile-en .experience-decoration__line {
        width: 28.5vw !important;  /* 118px at 414px */
        height: 9.66vw !important; /* 40px at 414px */
    }
}

/* Russian mobile (<=619px): proportional vw scaling anchored at 414px (resize
   like the other versions); icon flush-left at the start of the line. */
@media (max-width: 619px) {
    body.lang-ru .experience-line--mobile.experience-line--mobile-ru {
        font-size: 5.56vw !important;   /* 23px at 414px */
        line-height: 7.73vw !important; /* 32px at 414px */
        text-align: left !important;
    }
    body.lang-ru .experience-decoration--mobile-inline.experience-decoration--mobile-ru {
        margin: 0 0.97vw 0 0 !important; /* flush left, ~4px right at 414px, scales by vw */
        top: 1.21vw !important; /* ~5px at 414px */
    }
    body.lang-ru .experience-decoration--mobile-ru .experience-decoration__line {
        width: 28.5vw !important;  /* 118px at 414px */
        height: 9.66vw !important; /* 40px at 414px */
    }
}

/* Ukrainian mobile (<=619px): proportional vw scaling anchored at 414px (resize
   like the other versions); icon flush-left at the start of the line. */
@media (max-width: 619px) {
    body.lang-uk .experience-line--mobile.experience-line--mobile-uk {
        font-size: 5.56vw !important;   /* 23px at 414px */
        line-height: 7.73vw !important; /* 32px at 414px */
        text-align: left !important;
    }
    body.lang-uk .experience-decoration--mobile-inline.experience-decoration--mobile-uk {
        margin: 0 0.97vw 0 0 !important; /* flush left, ~4px right at 414px, scales by vw */
        top: 1.21vw !important; /* ~5px at 414px */
    }
    body.lang-uk .experience-decoration--mobile-uk .experience-decoration__line {
        width: 28.5vw !important;  /* 118px at 414px */
        height: 9.66vw !important; /* 40px at 414px */
    }
}

/* Ukrainian mobile: at 428px and below, shrink the icon a touch so line 5 text fits. */
@media (max-width: 428px) {
    body.lang-uk .experience-decoration--mobile-uk .experience-decoration__line {
        width: 25.5vw !important;  /* ~109px at 428px (was ~122px) */
        height: 8.64vw !important; /* keep ratio */
    }
}

/* Hide mobile version on sizes >= 620px */
@media (min-width: 620px) {
    .experience-line--mobile {
        display: none;
    }
    
    .experience-decoration--mobile-inline {
        display: none;
    }
}

/* Hide tablet version on other sizes */
/* Hide line breaks in benefit card titles on screens 1140px+ (keep visible on 1139-993px for both PL and EN) */
@media (min-width: 1140px) {
    .benefit-grid__row > .benefit-card .benefit-card__title br {
        display: none;
    }
}

/* Hide line breaks in full-width benefit card title (Warranty on completed service) on 1139-993px for both PL and EN */
@media (min-width: 993px) and (max-width: 1139px) {
    .benefit-card--full-width .benefit-card__title br {
        display: none;
    }
}

@media (min-width: 993px) {
    .experience-line--tablet {
        display: none;
    }
    
    .experience-decoration--tablet-inline {
        display: none;
    }
    
    .experience-line--desktop {
        display: block;
    }
    
    .experience-decoration--desktop {
        display: inline-block;
    }
}

/* Benefit Section for screens from 993px to 1139px inclusive */
@media (min-width: 993px) and (max-width: 1139px) {
    .benefit-section { 
        padding-top: 64px; 
        padding-bottom: 64px; 
    }
    .section.benefit-section {
        padding-left: 40px; 
        padding-right: 40px; 
    }
    .benefit-section__title { 
        gap: 56px; 
    }
    .benefit-section__heading { 
        font-size: clamp(40px, calc(40px + (100vw - 993px) * 8 / 146), 48px); 
        line-height: clamp(48px, calc(48px + (100vw - 993px) * 8 / 146), 56px); 
    }
    .benefit-grid { 
        display: flex; 
        flex-direction: column; 
        gap: 16px; 
        margin-top: 64px; 
    }
    .benefit-grid__row { 
        display: flex; 
        gap: 16px; 
        width: 100%; 
    }
    .benefit-grid__row > .benefit-card { 
        flex: 1 0 0; 
    }
    .benefit-card--full-width { 
        width: 100%; 
    }
    .benefit-grid__row > .benefit-card { 
        align-items: flex-start; 
        gap: 62px; 
        padding: 32px; 
    }
    .benefit-card--full-width { 
        gap: 40px; 
        align-items: center; 
        padding: 32px; 
    }
    .benefit-grid__row > .benefit-card .benefit-card__title { 
        font-size: 28px; 
        line-height: 40px; 
        text-align: left; 
        white-space: normal; 
    }
    .benefit-grid__row > .benefit-card .benefit-card__desc { 
        font-size: 18px; 
        line-height: 28px; 
        text-align: left; 
    }
    .benefit-card--full-width .benefit-card__title { 
        font-size: 28px; 
        line-height: 40px; 
        text-align: center; 
        text-wrap: normal; 
        white-space: pre-wrap; 
    }
    .benefit-card--full-width .benefit-card__desc { 
        font-size: 18px; 
        line-height: 28px; 
        text-align: center; 
    }
    .benefit-grid__row > .benefit-card .benefit-card__icon,
    .benefit-card--full-width .benefit-card__icon { 
        width: 80px; 
        height: 80px; 
    }
    .benefit-card--orange { 
        background: #ff9f59; 
    }
}

/* Benefit Section for screens from 620px to 992px */
@media (min-width: 620px) and (max-width: 992px) {
    .benefit-section { 
        padding-top: 64px; 
        padding-bottom: 64px; 
        padding-left: 40px; 
        padding-right: 40px; 
    }
    .section.benefit-section {
        padding-left: 40px; 
        padding-right: 40px; 
    }
    .benefit-section__title { 
        gap: 40px; 
        align-items: flex-start;
    }
    .benefit-section__stack {
        width: 100%;
    }
    .benefit-section__heading {
        font-size: 40px;
        line-height: 48px;
        text-align: left;
        white-space: normal;
        width: 100%;
    }
    .benefit-section__cta {
        align-self: center;
    }
    .benefit-grid { 
        display: flex; 
        flex-direction: column; 
        gap: 16px; 
    }
    .benefit-grid__row { 
        display: contents; 
    }
    .benefit-card { 
        width: 100%; 
        align-items: center; 
        gap: 40px; 
        padding: 32px; 
        height: auto; 
        min-height: auto; 
        justify-content: flex-start;
    }
    .benefit-card__title { 
        font-size: 28px; 
        line-height: 40px; 
        text-align: center; 
        white-space: normal; 
    }
    /* Hide line breaks in benefit card titles on medium screens (same as Polish version behavior) */
    .benefit-card__title br {
        display: none;
    }
    .benefit-card__icon { 
        width: 80px; 
        height: 80px; 
    }
    .benefit-card__desc { 
        font-size: 18px; 
        line-height: 28px; 
        text-align: center; 
    }
    .benefit-card--orange { 
        background: #ff9f59; 
    }
}

/* Benefit Section for screens from 649px to 923px - hug and center alignment */
@media (min-width: 649px) and (max-width: 923px) {
    .section.benefit-section {
        display: flex;
        justify-content: center;
    }
    
    .section.benefit-section .section__inner {
        width: auto;
        max-width: fit-content;
    }
    
    .benefit-section__title {
        width: fit-content;
    }
}

/* Benefit grid margin-top for screens from 414px to 619px */
@media (min-width: 414px) and (max-width: 619px) {
    .benefit-grid {
        margin-top: 34px;
    }
}

@media (max-width: 619px) {
    .benefit-section {
        padding-top: 40px;
        padding-bottom: 40px;
    }
    .section.benefit-section {
        padding-left: 20px;
        padding-right: 20px;
    }
    .main-content { padding: 0; }
    .benefit-section__title {
        gap: 24px;
        align-items: flex-start;
    }
    .benefit-section__stack {
        width: 100%;
    }
    .benefit-section__heading {
        font-size: 28px !important;
        line-height: 40px !important;
        width: 100%;
    }
    .benefit-grid {
        gap: 20px;
        margin-top: 34px;
    }
    .benefit-card {
        gap: 56px;
        padding: 24px;
        align-items: flex-start;
        border-radius: 19px;
    }
    .benefit-grid__row > .benefit-card,
    .benefit-card--full-width {
        align-items: flex-start;
    }
    .benefit-card__title {
        font-size: 24px;
        line-height: 32px;
        text-align: left;
    }
    .benefit-card__icon {
        width: 72px;
        height: 72px;
    }
    .benefit-card__desc {
        font-size: 16px;
        line-height: 24px;
        text-align: left;
    }
    .benefit-section__cta {
        margin-top: 32px;
        align-self: center;
    }
    .benefit-section__cta .cta-button,
    .article-header__phone-btn.cta-button {
        font-size: 16px;
        line-height: 28px;
        padding: 20px 36px;
    }
}

/* Fix values at 414px */
@media (max-width: 414px) {
    .benefit-section {
        padding-top: 40px;
        padding-bottom: 40px;
    }
    .section.benefit-section {
        padding-left: 20px;
        padding-right: 20px;
    }
    .main-content { 
        padding: 0; 
    }
    .benefit-section__title {
        gap: 24px;
    }
    .benefit-section__stack {
        gap: 0;
    }
    .benefit-section__subtitle-row {
        gap: 4px;
    }
    .benefit-section__subtitle {
        font-size: 16px;
        line-height: 24px;
        padding: 8px 0;
    }
    .benefit-section__icon-ok {
        width: 51.268px;
        height: 56px;
    }
    .benefit-section__heading {
        font-size: 28px !important;
        line-height: 40px !important;
    }
    .benefit-grid {
        gap: 20px;
        margin-top: 34px;
    }
    .benefit-card {
        gap: 56px;
        padding: 24px;
        border-radius: 19px;
    }
    .benefit-card__title {
        font-size: 24px;
        line-height: 32px;
    }
    .benefit-card__icon {
        width: 72px;
        height: 72px;
    }
    .benefit-card__desc {
        font-size: 16px;
        line-height: 24px;
    }
    .benefit-section__cta {
        margin-top: 32px;
    }
    .benefit-section__cta .cta-button,
    .article-header__phone-btn.cta-button {
        font-size: 16px;
        line-height: 28px;
        padding: 20px 36px;
        border-radius: 9999px;
    }
}

/* Viewport-based proportional scaling for screens ≤413px */
@media (max-width: 413px) {
    .benefit-section {
        padding-top: calc(40 / 414 * 100vw);
        padding-bottom: calc(40 / 414 * 100vw);
    }
    .section.benefit-section {
        padding-left: calc(20 / 414 * 100vw);
        padding-right: calc(20 / 414 * 100vw);
    }
    .main-content { 
        padding: 0; 
    }
    .benefit-section__title {
        gap: calc(24 / 414 * 100vw);
    }
    .benefit-section__stack {
        gap: 0;
    }
    .benefit-section__subtitle-row {
        gap: calc(4 / 414 * 100vw);
    }
    .benefit-section__subtitle {
        font-size: calc(16 / 414 * 100vw);
        line-height: calc(24 / 414 * 100vw);
        padding: calc(8 / 414 * 100vw) 0;
    }
    .benefit-section__icon-ok {
        width: calc(51.268 / 414 * 100vw);
        height: calc(56 / 414 * 100vw);
    }
    .benefit-section__heading {
        font-size: calc(28 / 414 * 100vw) !important;
        line-height: calc(40 / 414 * 100vw) !important;
    }
    .benefit-grid {
        gap: calc(20 / 414 * 100vw);
        margin-top: calc(34 / 414 * 100vw);
    }
    .benefit-card {
        gap: calc(56 / 414 * 100vw);
        padding: calc(24 / 414 * 100vw);
        border-radius: calc(19 / 414 * 100vw);
    }
    .benefit-card__title {
        font-size: calc(24 / 414 * 100vw);
        line-height: calc(32 / 414 * 100vw);
    }
    .benefit-card__icon {
        width: calc(72 / 414 * 100vw);
        height: calc(72 / 414 * 100vw);
    }
    .benefit-card__desc {
        font-size: calc(16 / 414 * 100vw);
        line-height: calc(24 / 414 * 100vw);
    }
    .benefit-section__cta {
        margin-top: calc(32 / 414 * 100vw);
    }
    .benefit-section__cta .cta-button,
    .article-header__phone-btn.cta-button {
        font-size: calc(16 / 414 * 100vw);
        line-height: calc(28 / 414 * 100vw);
        padding: calc(20 / 414 * 100vw) calc(36 / 414 * 100vw);
        border-radius: calc(9999 / 414 * 100vw);
    }

    .article-header__phone-btn {
        gap: calc(12 / 414 * 100vw);
    }

    .article-header__phone-btn__icon-wrap {
        width: calc(20 / 414 * 100vw);
        height: calc(20 / 414 * 100vw);
    }

    .article-header__phone-btn__icon-img {
        width: calc(20 / 414 * 100vw);
        height: calc(20 / 414 * 100vw);
    }
}

@media (max-width: 992px) {
    .benefit-grid { grid-template-columns: 1fr; }
    .benefit-grid__row { display: contents; }
    .benefit-card { height: auto; min-height: auto; justify-content: flex-start; }
}

/* Next Block Title (Figma node 21:284) */
.next-block { padding: 0; margin: 120px 0 80px 0; }
.next-block__container { display: flex; flex-direction: column; align-items: center; gap: 8px; width: max-content; max-width: 1344px; margin: 0 auto; }
.next-block__subtitle-row { display: flex; align-items: flex-end; justify-content: flex-start; gap: 4px; align-self: flex-start; }
.next-block__subtitle { font-family: 'Sora', sans-serif; font-weight: 400; font-size: 20px; line-height: 28px; color: #141000; padding: 8px 0; }
.next-block__icon { width: 65px; height: 71px; position: relative; flex-shrink: 0; }
.next-block__icon-img { width: 100%; height: 100%; display: block; object-fit: contain; }
.next-block__title { font-family: 'Unbounded', sans-serif; font-weight: 500; font-size: 56px; line-height: 72px; color: #141000; text-align: left; white-space: normal; word-break: normal; overflow-wrap: anywhere; max-width: 100%; }
.next-block__cta { margin-top: 72px; display: flex; justify-content: center; }
/* Match CTA sizing from the first block */
.next-block__cta .cta-button {
    padding: 20px 36px;
    font-size: 17px;
    line-height: 28px;
    width: auto;
    max-width: none;
}

@media (max-width: 992px) {
    .next-block__container { width: 100%; }
    .next-block__title { font-size: 48px; line-height: 64px; text-align: left; }
}
@media (max-width: 768px) {
    .next-block__title { font-size: 40px; line-height: 52px; }
}
@media (max-width: 480px) {
    .next-block__title { font-size: 36px; line-height: 46px; }
}

/* Benefits Cards (Figma node 21:297) - OLD, replaced by benefit-section above */

@media (max-width: 992px) {
    .benefits { padding: 0 32px; }
    .benefits__grid { grid-template-columns: 1fr; gap: 16px; }
    .benefit-card { height: auto; min-height: auto; }
}

@media (max-width: 480px) {
    .benefits { padding: 0 16px; }
}

/* Responsive Design */
@media (max-width: 1440px) {
    .hero-section {
        margin-top: 104px;
    }
}

/* 1320px down to 769px: set hero top margin to 88px */
@media (max-width: 1320px) and (min-width: 769px) {
    .hero-section {
        margin-top: 88px;
    }
}

/* All language-specific hero-title rules removed - now using unified Polish version rules for all languages */

@media (max-width: 1320px) {
    .hero-title {
        font-size: 72px;
        line-height: 94px;
    }
    
    /* Ukrainian and Russian versions: different font-size and line-height for ≤1320px */
    body.lang-uk .hero-title,
    body.lang-ru .hero-title {
        font-size: 56px;
        line-height: 66px;
    }
    
    /* Cursor height matches font-size for Ukrainian and Russian versions */
    body.lang-uk .hero-title__cursor--question,
    body.lang-uk .hero-title__cursor--dynamic,
    body.lang-ru .hero-title__cursor--question,
    body.lang-ru .hero-title__cursor--dynamic {
        height: 56px;
    }
}

@media (max-width: 1270px) {
    .hero-title {
        font-size: 72px;
        line-height: 94px;
    }
    
    /* Ukrainian and Russian versions: different font-size and line-height for ≤1270px */
    body.lang-uk .hero-title,
    body.lang-ru .hero-title {
        font-size: 52px;
        line-height: 64px;
    }
    
    /* Cursor height matches font-size for Ukrainian and Russian versions */
    body.lang-uk .hero-title__cursor--question,
    body.lang-uk .hero-title__cursor--dynamic,
    body.lang-ru .hero-title__cursor--question,
    body.lang-ru .hero-title__cursor--dynamic {
        height: 52px;
    }
}

/* Ukrainian and Russian versions: font-size and line-height for 948-1039px */
@media (min-width: 948px) and (max-width: 1039px) {
    body.lang-uk .hero-title,
    body.lang-ru .hero-title {
        font-size: 42px;
        line-height: 50px;
    }
    
    /* Cursor height matches font-size for Ukrainian and Russian versions */
    body.lang-uk .hero-title__cursor--question,
    body.lang-uk .hero-title__cursor--dynamic,
    body.lang-ru .hero-title__cursor--question,
    body.lang-ru .hero-title__cursor--dynamic {
        height: 42px;
    }
}

/* Ukrainian and Russian versions: font-size and line-height for 1040-1120px */
@media (min-width: 1040px) and (max-width: 1120px) {
    body.lang-uk .hero-title,
    body.lang-ru .hero-title {
        font-size: 48px;
        line-height: 56px;
    }
    
    /* Cursor height matches font-size for Ukrainian and Russian versions */
    body.lang-uk .hero-title__cursor--question,
    body.lang-uk .hero-title__cursor--dynamic,
    body.lang-ru .hero-title__cursor--question,
    body.lang-ru .hero-title__cursor--dynamic {
        height: 48px;
    }
}

@media (max-width: 1152px) {
    .hero-title {
        font-size: 64px;
        line-height: 83px;
    }
}

@media (max-width: 1340px) {
    .menu {
        gap: 6px;
        padding: 8px;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }
    
    /* Smaller font size for Ukrainian and Russian in compact menu */
    body.lang-uk .menu-item[data-i18n],
    body.lang-ru .menu-item[data-i18n],
    body.lang-uk .naprawa-menu-link[data-i18n],
    body.lang-ru .naprawa-menu-link[data-i18n] {
        font-size: 12.5px;
    }

    .menu-item {
        padding: 8px 20px;
        font-size: 12px;
    }
}

@media (max-width: 1220px) {
    .header {
        padding: 24px 32px;
    }
    
    /* Hide language dropdown on mobile - it's in hamburger menu */
    .language-dropdown {
        display: none !important;
    }

    .header-right {
        order: 2;
        margin-left: auto;
        gap: 12px;
    }

    .header .cta-button {
        display: none;
    }

    .mobile-call-button {
        display: flex;
    }

    .hamburger {
        display: flex;
    }

    .menu {
        position: fixed;
        left: 0; /* will be aligned to header-container via JS */
        top: 70px; /* overridden by JS to header bottom */
        flex-direction: column;
        align-items: flex-start;
        background: transparent; /* header+menu share one white panel behind */
        width: 100%;
        box-shadow: none; /* remove shadow */
        /* Щедрий відступ знизу: нижні панелі мобільних браузерів (Safari toolbar,
           home-індикатор) перекривають останні пункти при відкритих дропдаунах */
        padding: 16px 0 calc(120px + env(safe-area-inset-bottom, 0px)) 0; /* remove left padding; indent only submenu */
        border-radius: 0; /* radius is applied on the shared panel */
        z-index: 1000;
        text-align: left;
        gap: 32px; /* restore standard spacing between top-level items */
        opacity: 0;
        transform: translateY(-12px);
        pointer-events: none;
        transition: opacity 220ms ease, transform 220ms ease;
        /* Довге меню має скролитись, а не обрізатись висотою екрана */
        max-height: calc(100vh - 70px); /* фолбек; точне значення ставить JS */
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }

    .menu.active { opacity: 1; transform: translateY(0); pointer-events: auto; padding-left: 20px; }

    /* Remove margins; use gap for spacing */
    .menu > .menu-item { margin: 0; }

    /* Shared panel background for header+menu (white rounded container) */
    .mobile-menu-panel {
        position: fixed;
        left: 0; /* full-bleed panel */
        top: 0;  /* from top of viewport */
        width: 100%;
        height: 0; /* set via JS */
        background: #ffffff; /* pure white to match menu */
        border-radius: 0; /* no rounding */
        box-shadow: none; /* remove shadow */
        z-index: 1000; /* under header/menu (1001), over overlay */
        opacity: 0;
        transform: translateY(-12px);
        transition: opacity 220ms ease, transform 220ms ease;
        pointer-events: none; /* do not block header/menu interactions */
        overflow: visible; /* allow bottom blur feather to extend */
    }
    .mobile-menu-panel.visible { opacity: 1; transform: translateY(0); }

    /* Soft blur at the bottom edge to avoid sharp cut line */
    /* Remove feather from panel to avoid banding */
    .mobile-menu-panel::after { content: none; }

    /* Make header render above the white panel */
    .header { position: relative; z-index: 1001; }
    .menu { z-index: 1001; }
    /* Logo and buttons should be above blur overlay to remain visible (already set globally above) */

    /* Overlay behind the slide-down mobile menu */
    .mobile-menu-overlay {
        position: fixed;
        inset: 0;
        background: transparent;
        opacity: 0;
        pointer-events: none;
        transition: opacity 200ms ease;
        z-index: 999; /* just under menu (1000) */
        will-change: opacity;
    }
    .mobile-menu-overlay.visible { background: #ffffff; opacity: 1; pointer-events: auto; }

    /* Progressive blur only at the bottom edge of the white panel */
    /* Disable overlay feather; we'll use a dedicated gradient bar */
    .mobile-menu-overlay::before { content: none; }

    /* Add a soft white gradient to blend panel edge over the blur */
    .mobile-menu-overlay::after { content: none; }

    /* Dedicated gradient+blur bar under the white curtain */
    .mobile-menu-gradient { display: none; }

    /* Soft white feather on panel edge itself to ensure ultra-smooth transition */
    .mobile-menu-panel::after { content: none; }
    .mobile-menu-gradient.visible { opacity: 1; }

    /* Separate bottom fade bar above overlay, below menu */
    .mobile-menu-fade { display: none; }

    .header-container {
        flex-wrap: nowrap;
    }

    .logo {
        order: 1;
        width: 184px;
        height: 28px;
        flex-shrink: 0;
    }

    .logo-img {
        width: 184px;
        height: 28px;
    }

    .cta-button {
        padding: 16px 32px;
        font-size: 15px;
        line-height: 22px;
    }

    .hero-section {
        margin-top: 100px;
        padding: 0 32px;
    }

    .hero-subtitle {
        font-size: 20px;
        line-height: 28px;
    }

    .hero-title {
        font-size: 60px;
        line-height: 78px;
    }

    .hero-title__cursor--question,
    .hero-title__cursor--dynamic {
        height: 60px;
    }

    .contact-info-container {
        flex-wrap: wrap;
        justify-content: center;
    }

    .contact-info__text {
        font-size: 16px;
        line-height: 24px;
    }

    .contact-info__icon {
        width: 48px;
        height: 48px;
    }
}

/* Unify mobile menu typography for all hamburger sizes ≤992px */
@media (max-width: 1220px) {
    .menu-item {
        width: auto;
        padding: 0;
        border-radius: 0;
        font-family: 'Sora', sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
        color: var(--color-dark);
        text-decoration: none;
        white-space: nowrap;
        cursor: pointer;
        text-align: left;
        justify-content: flex-start; /* avoid centered content creating side space */
        -webkit-tap-highlight-color: transparent; /* no gray flash on iOS */
    }
    .menu-item:hover { text-decoration: none; font-weight: 500; background: transparent !important; }
    .menu-item:active { font-weight: 500; background: transparent !important; }
    
    /* Ukrainian and Russian font size for main menu items (non-dropdown) in mobile */
    body.lang-uk .menu-item[data-i18n]:not(.dropdown),
    body.lang-ru .menu-item[data-i18n]:not(.dropdown),
    body.lang-uk .naprawa-menu-link[data-i18n],
    body.lang-ru .naprawa-menu-link[data-i18n] {
        font-size: 16.5px;
        line-height: 24px;
    }
    /* Ensure dropdown label stays flush left on mobile */
    .menu-item.dropdown { padding: 0 !important; margin-left: 0 !important; }
    .menu > .menu-item { padding: 0 !important; margin-left: 0 !important; }
    .menu > .menu-item.dropdown { padding: 0 !important; margin-left: 0 !important; }
    .menu .mobile-group > .menu-item.dropdown { 
        padding-left: 0 !important; 
        margin-left: 0 !important; 
        position: relative;
    }
    
    /* Increase clickable area for dropdown triggers without affecting visual spacing */
    .menu .mobile-group > .menu-item.dropdown::before {
        content: '';
        position: absolute;
        top: -10px;
        left: -12px;
        right: -12px;
        bottom: -10px;
    }
    .menu .mobile-group > .menu-item.dropdown.chevron-rotated { 
        padding-left: 0 !important; 
        margin-left: 0 !important; 
    }
    .menu .mobile-group > .menu-item.dropdown.chevron-rotated * { margin-left: 0; }
    .menu .mobile-group > .menu-item.dropdown > span,
    .menu .mobile-group > .menu-item.dropdown > .naprawa-menu-link,
    .menu .mobile-group > .menu-item.dropdown > .language-menu-link { display: inline-block; padding: 0 !important; margin: 0 !important; }
    .menu .mobile-group > .menu-item.dropdown .chevron { margin-left: 8px; }
    .menu-divider { display: none; }
    /* Disable desktop hover pill/indicator on mobile */
    .menu-indicator { display: none !important; }

    /* Group Naprawa + submenu for custom internal gap */
    .menu .mobile-group { display: flex; flex-direction: column; gap: 0; margin-left: 0; padding-left: 0; }
    .menu .mobile-group.open { gap: 20px; }

    /* Mobile submenu under Naprawa */
    .mobile-submenu {
        display: none;
        list-style: none;
        margin: 0; /* gap controlled by .mobile-group */
        padding-left: 18px; /* default indent */
        gap: 16px;
    }
    .mobile-submenu.open { display: grid !important; grid-auto-rows: max-content; row-gap: 16px; padding-left: 12px; }

    .submenu-item {
        font-family: 'Sora', sans-serif;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        color: var(--color-dark);
        text-decoration: none;
        white-space: nowrap;
        position: relative;
    }
    
    .submenu-item[data-lang="uk"],
    .submenu-item[data-lang="ru"] {
        font-family: 'Noto Sans', sans-serif;
        font-size: 15px;
        line-height: 20px;
    }
    
    /* Use Noto Sans for Ukrainian and Russian languages in mobile submenu */
    body.lang-uk .submenu-item[data-i18n],
    body.lang-ru .submenu-item[data-i18n] {
        font-family: 'Noto Sans', sans-serif;
        font-size: 15px;
        line-height: 20px;
    }
    
    /* Increase clickable area without affecting visual spacing */
    .submenu-item::before {
        content: '';
        position: absolute;
        top: -10px;
        left: -12px;
        right: -12px;
        bottom: -10px;
    }
    .submenu-item:hover { font-weight: 500; text-decoration: none; }

    /* Chevron rotation when submenu is open */
    .dropdown.chevron-rotated .chevron { transform: rotate(180deg); transition: transform 200ms ease; }
    .chevron { transition: transform 200ms ease; }
}

/* Hide mobile submenu by default (desktop and larger) */
.mobile-submenu { display: none !important; list-style: none; margin: 0; padding: 0; }

/* Ukrainian version: apply mobile layout starting from 909px */
@media (max-width: 909px) {
    body.lang-uk .contact-info .contact-info__text:first-of-type { display: none; }
    body.lang-uk .contact-info .contact-info__text:last-of-type { display: none; }
    body.lang-uk .phone-below-cta { 
        display: block; 
        margin-top: 24px;
        animation: fadeInUp 0.8s ease-out 0.6s both;
    }
    body.lang-uk .contact-info-container {
        flex-direction: column;
        text-align: center;
        gap: 12px;
    }
}

/* Ukrainian version: phone-below-cta styling for 909-852px range (same as ≤851px) */
@media (max-width: 909px) and (min-width: 852px) {
    body.lang-uk .phone-below-cta {
        font-size: 16px !important;
        line-height: 24px !important;
        font-weight: 400 !important;
        color: #858784 !important;
    }
    body.lang-uk .phone-below-cta .contact-info__phone {
        font-weight: 500 !important;
        color: #141000 !important;
    }
    body.lang-uk .phone-below-cta [data-i18n="contact.or-call"] {
        font-size: 0 !important;
        line-height: 0 !important;
    }
    body.lang-uk .phone-below-cta [data-i18n="contact.or-call"]::after {
        content: 'або зателефонуй:' !important;
        font-size: 16px !important;
        font-family: 'Noto Sans', sans-serif !important;
        font-weight: 400 !important;
        line-height: 24px !important;
        display: inline !important;
    }
}

@media (max-width: 851px) {
    .contact-info__icon {
        width: 56px;
        height: 56px;
    }
    /* Hide only the first text ("Złóż zgłoszenie...") and keep icons visible */
    .contact-info .contact-info__text:first-of-type { display: none; }
    /* Hide the phone text next to icons to avoid duplication */
    .contact-info .contact-info__text:last-of-type { display: none; }
    .phone-below-cta { 
        display: block; 
        margin-top: 24px;
        animation: fadeInUp 0.8s ease-out 0.6s both;
    }
    /* Phone text size/weight at ≤851px */
    .phone-below-cta { font-size: 16px; line-height: 24px; font-weight: 400; color: #858784; }
    .phone-below-cta .contact-info__phone { font-weight: 500; color: #141000 !important; }
    
    /* Ensure Ukrainian and Russian versions also have font-weight 500 for phone number on mobile */
    body.lang-uk .phone-below-cta .contact-info__phone,
    body.lang-ru .phone-below-cta .contact-info__phone {
        font-weight: 500 !important; /* Same as Polish version on mobile */
    }
    
    /* Change text for Ukrainian and Russian versions: remove "за номером"/"по номеру" on ≤851px */
    body.lang-uk .contact-info__text [data-i18n="contact.or-call"],
    body.lang-uk .phone-below-cta [data-i18n="contact.or-call"] {
        font-size: 0 !important;
        line-height: 0 !important;
    }
    body.lang-uk .contact-info__text [data-i18n="contact.or-call"]::after {
        content: 'або зателефонуй:' !important;
        font-size: 16px !important;
        font-family: 'Noto Sans', sans-serif !important;
        font-weight: 300 !important;
        line-height: 24px !important;
        display: inline !important;
    }
    body.lang-uk .phone-below-cta [data-i18n="contact.or-call"]::after {
        content: 'або зателефонуй:' !important;
        font-size: 16px !important;
        font-family: 'Noto Sans', sans-serif !important;
        font-weight: 400 !important;
        line-height: 24px !important;
        display: inline !important;
    }
    
    body.lang-ru .contact-info__text [data-i18n="contact.or-call"],
    body.lang-ru .phone-below-cta [data-i18n="contact.or-call"] {
        font-size: 0 !important;
        line-height: 0 !important;
    }
    body.lang-ru .contact-info__text [data-i18n="contact.or-call"]::after {
        content: 'или позвони:' !important;
        font-size: 16px !important;
        font-family: 'Noto Sans', sans-serif !important;
        font-weight: 300 !important;
        line-height: 24px !important;
        display: inline !important;
    }
    body.lang-ru .phone-below-cta [data-i18n="contact.or-call"]::after {
        content: 'или позвони:' !important;
        font-size: 16px !important;
        font-family: 'Noto Sans', sans-serif !important;
        font-weight: 400 !important;
        line-height: 24px !important;
        display: inline !important;
    }
}

@media (max-width: 768px) {
    .header {
        padding: 20px 24px;
    }

    .logo {
        width: 140px;
        height: 22px;
    }

    /* Menu is hidden on mobile, shown via hamburger */
    /* nowrap + flex-start: довгий список має скролитись однією колонкою,
       а не загортатись у другу (wrap + обмежена висота = колонки) */
    .menu {
        flex-wrap: nowrap;
        justify-content: flex-start;
        gap: 32px;
    }

    /* Keep hamburger typography same as 480 across ≤768 */
    .menu-item { padding: 0; font-size: 16px; line-height: 24px; }

    .cta-button {
        padding: 10px 20px;
        font-size: 13px;
    }

    .hero-section {
        margin-top: 80px;
        padding: 0 24px;
    }

    .hero-subtitle {
        font-size: 18px;
        line-height: 24px;
        max-width: 280px;
    }
    
    /* Ukrainian and Russian versions: max-width for hero-subtitle */
    body.lang-uk .hero-subtitle,
    body.lang-ru .hero-subtitle {
        max-width: 320px;
    }

    .hero-title {
        font-size: 40px;
        line-height: 52px;
    }

    .hero-title__cursor--question,
    .hero-title__cursor--dynamic {
        height: 40px;
    }

    .contact-info {
        margin-top: 32px;
        padding: 0 24px;
    }

    .contact-info-container {
        flex-direction: column;
        text-align: center;
        gap: 12px;
    }

    .contact-info__text {
        font-size: 14px;
        line-height: 22px;
        white-space: normal;
    }

    .contact-info__icon {
        width: 56px;
        height: 56px;
        margin-right: -14px; /* keep consistent overlap */
    }

    .contact-info__icons {
        padding-right: 10px;
    }

    .cta-section {
        margin-top: 32px;
        padding: 0 24px;
    }
}

@media (max-width: 641px) {
    .hero-container { gap: 32px; }
    
    .hero-section {
        min-height: 200px;
    }
    
    /* Ukrainian and Russian versions: min-height 180px for 541-564px range */
    @media (max-width: 564px) and (min-width: 541px) {
        body.lang-uk .hero-section,
        body.lang-ru .hero-section {
            min-height: 180px !important;
        }
    }
    
    /* Russian version: min-height 180px for 481-540px range */
    @media (max-width: 540px) and (min-width: 481px) {
        body.lang-ru .hero-section {
            min-height: 180px !important;
        }
    }
    
    /* Ukrainian version: min-height 180px for 481-494px range */
    @media (max-width: 494px) and (min-width: 481px) {
        body.lang-uk .hero-section {
            min-height: 180px !important;
        }
    }

    .hero-title {
        font-size: 46px;
        line-height: 56px;
        max-width: 368px;
        margin: 0 auto;
        height: 114px;
    }
    

    /* Prevent leading reserved space from indenting a new line */
    .hero-title__space {
        white-space: normal; /* collapse leading space at line start */
    }

    .hero-title__cursor--question,
    .hero-title__cursor--dynamic {
        height: 46px; /* Match font-size */
    }

    /* Align behavior with ≤390px to avoid reflow on wrap */
    .hero-title__dynamic {
        margin-left: 0 !important;
        min-width: 1em; /* reserve space so dynamic+cursor don't fit on line 1 */
    }

    /* All languages now use global animation rules defined above */
}

/* Fixed width for 414px and viewport-based scaling for ≤413px - hero-subtitle for all languages */
@media (max-width: 414px) {
    .hero-subtitle {
        font-size: 18px !important;
        line-height: 24px !important;
        max-width: 280px !important; /* Fixed value for 414px */
    }
    
    body.lang-uk .hero-subtitle,
    body.lang-ru .hero-subtitle {
        max-width: 320px !important; /* Fixed value for 414px */
    }
}

@media (max-width: 413px) {
    .hero-subtitle {
        font-size: 4.35vw !important; /* 18/414 * 100 = 4.35vw for proportional scaling */
        line-height: 5.8vw !important; /* 24/414 * 100 = 5.8vw for proportional scaling */
        max-width: 67.63vw !important; /* 280/414 * 100 = 67.63vw for proportional scaling */
    }
    
    body.lang-uk .hero-subtitle,
    body.lang-ru .hero-subtitle {
        max-width: 77.29vw !important; /* 320/414 * 100 = 77.29vw for proportional scaling */
    }
}

/* (Removed special move logic between 641px and 391px to match ≤390px behavior) */
/* Transitions are now applied globally in base styles with !important */

/* All languages: font-size, max-width and height for ≤393px (same as Polish version) */
@media (max-width: 393px) {
    .hero-title {
        font-size: 40px !important;
        max-width: 308px !important;
        height: 96px !important; /* two lines * 48px line-height */
    }
}

/* English version: 361-393px range */
@media (max-width: 393px) and (min-width: 361px) {
    body.lang-en .hero-title {
        max-width: 286px !important;
    }
}

/* All languages: smaller font-size for 320-360px range (same as Polish version) */
@media (max-width: 360px) and (min-width: 320px) {
    .hero-title {
        font-size: 36px !important;
        line-height: 42px !important;
        max-width: 280px !important;
        height: 84px !important; /* two lines * 42px line-height */
    }
    
    /* English version: 286px for this range */
    body.lang-en .hero-title {
        max-width: 286px !important;
    }
}

/* All languages: font-size, line-height, max-width and height for ≤947px range (same as Polish version) */
@media (max-width: 947px) {
    .hero-title {
        font-size: 60px !important;
        line-height: 78px !important;
        max-width: 450px !important;
        height: 156px !important; /* two lines * 78px line-height */
    }
    
    /* English version: max-width 422px */
    body.lang-en .hero-title {
        max-width: 422px !important;
    }
    
    /* Prevent leading reserved space from indenting a new line */
    .hero-title__space {
        white-space: normal !important; /* collapse leading space at line start */
    }
    
    /* English version: wrapper for dynamic text and cursor to ignore container width */
    body.lang-en .hero-title__dynamic-wrapper {
        display: inline-flex !important;
        white-space: nowrap !important;
        min-width: max-content !important; /* Allow wrapper to extend beyond container */
    }
    
    /* English version: prevent "your fridge" and "your washer" with cursor from wrapping to second line */
    body.lang-en .hero-title__dynamic {
        white-space: nowrap !important;
    }
    
    /* English version: keep cursor on same line as dynamic text */
    body.lang-en .hero-title__cursor--dynamic {
        flex-shrink: 0 !important;
        white-space: nowrap !important;
    }
    
    /* Allow hero-title container to overflow if needed for English version */
    body.lang-en .hero-title {
        overflow: visible !important;
    }
}

/* Russian version: max-width for 769-947px range */
@media (max-width: 947px) and (min-width: 769px) {
    body.lang-ru .hero-title {
        max-width: 644px !important;
    }
    
    /* Ukrainian version: max-width for 769-947px range */
    body.lang-uk .hero-title {
        max-width: 626px !important;
    }
}

/* All languages: font-size, line-height, max-width and height for 394-768px range (same as Polish version) */
@media (max-width: 768px) and (min-width: 394px) {
    .hero-title {
        font-size: 46px !important;
        line-height: 56px !important;
        max-width: 350px !important;
        height: 114px !important; /* two lines * 56px line-height */
        text-align: center !important;
        justify-content: center !important;
    }
    
    /* English version: 326px for this range (overrides the 422px from ≤947px rule) */
    body.lang-en .hero-title {
        max-width: 326px !important;
    }
    
    /* Russian version: 494px for this range */
    body.lang-ru .hero-title {
        max-width: 494px !important;
    }
    
    /* Cursor height matches font-size */
    .hero-title__cursor--question,
    .hero-title__cursor--dynamic {
        height: 46px !important; /* Match font-size */
    }
    
    /* Prevent leading reserved space from indenting a new line */
    .hero-title__space {
        white-space: normal !important; /* collapse leading space at line start */
    }
}

/* Ukrainian version: max-width for 565-768px range */
@media (max-width: 768px) and (min-width: 565px) {
    body.lang-uk .hero-title {
        max-width: 480px !important;
    }
}

/* Ukrainian and Russian versions: font-size and line-height for 480-564px */
@media (min-width: 480px) and (max-width: 564px) {
    body.lang-uk .hero-title,
    body.lang-ru .hero-title {
        font-size: 40px !important;
        line-height: 48px !important;
        max-width: 430px !important;
        height: 96px !important; /* two lines * 48px line-height */
    }
    
    /* Ukrainian version: max-width 418px for this range */
    body.lang-uk .hero-title {
        max-width: 418px !important;
    }
    
    /* Cursor height matches font-size for Ukrainian and Russian versions */
    body.lang-uk .hero-title__cursor--question,
    body.lang-uk .hero-title__cursor--dynamic,
    body.lang-ru .hero-title__cursor--question,
    body.lang-ru .hero-title__cursor--dynamic {
        height: 40px !important;
    }
}

/* Ukrainian and Russian versions: font-size and line-height for 394-479px */
@media (min-width: 394px) and (max-width: 479px) {
    body.lang-uk .hero-title,
    body.lang-ru .hero-title {
        font-size: 32px !important;
        line-height: 42px !important;
        max-width: 346px !important;
        height: 84px !important; /* two lines * 42px line-height */
    }
    
    /* Ukrainian version: max-width 338px for this range */
    body.lang-uk .hero-title {
        max-width: 338px !important;
    }
    
    /* Cursor height matches font-size for Ukrainian and Russian versions */
    body.lang-uk .hero-title__cursor--question,
    body.lang-uk .hero-title__cursor--dynamic,
    body.lang-ru .hero-title__cursor--question,
    body.lang-ru .hero-title__cursor--dynamic {
        height: 32px !important;
    }
}

/* Ukrainian and Russian versions: font-size and line-height for 345-393px */
@media (min-width: 345px) and (max-width: 393px) {
    body.lang-uk .hero-title,
    body.lang-ru .hero-title {
        font-size: 28px !important;
        line-height: 38px !important;
        max-width: 304px !important;
        height: 76px !important; /* two lines * 38px line-height */
    }
    
    /* Ukrainian version: max-width 296px for this range */
    body.lang-uk .hero-title {
        max-width: 296px !important;
    }
    
    /* Cursor height matches font-size for Ukrainian and Russian versions */
    body.lang-uk .hero-title__cursor--question,
    body.lang-uk .hero-title__cursor--dynamic,
    body.lang-ru .hero-title__cursor--question,
    body.lang-ru .hero-title__cursor--dynamic {
        height: 28px !important;
    }
}

@media (max-width: 393px) {
    .hero-section {
        margin-top: 40px;
        min-height: auto !important;
    }

    /* Spacing: subtitle → icons = 40px; icons → button = 40px */
    .contact-info { margin-top: 40px !important; margin-bottom: 40px !important; }
    .cta-section { margin-top: 0 !important; }

    .hero-title {
        font-size: 40px !important;
        line-height: 48px !important;
        height: 96px !important; /* two lines * 48px */
        max-width: 308px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        transition: all 0.3s ease-in-out;
    }

    .hero-title__cursor--question,
    .hero-title__cursor--dynamic {
        height: 40px !important;
    }

    .hero-title__space {
        white-space: normal !important;
    }

    .hero-title__dynamic {
        margin-left: 0 !important;
    }

    /* All languages now use global animation rules defined above */

    /* All languages now use global animation rules defined above */
    
    /* English version: 320-360px range - override within this media query */
    @media (min-width: 320px) {
        body.lang-en .hero-title {
            max-width: 286px !important;
        }
    }
}

/* English version: 320-360px range - must come before 361-393px to ensure it applies */
@media (max-width: 360px) and (min-width: 320px) {
    body.lang-en .hero-title {
        max-width: 286px !important;
    }
}

/* English version: 361-393px range - additional rule after max-width: 393px */
@media (max-width: 393px) and (min-width: 361px) {
    body.lang-en .hero-title {
        max-width: 286px !important;
    }
}

@media (max-width: 345px) {
    .hero-section {
        margin-top: 20px;
    }

    .hero-title {
        font-size: 36px !important;
        line-height: 42px !important;
        height: 84px !important; /* two lines * 42px */
        max-width: 280px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding: 0 !important;
        transition: all 0.3s ease-in-out;
    }

    .hero-title__cursor--question,
    .hero-title__cursor--dynamic {
        height: 36px !important;
    }

    .hero-title__space {
        white-space: normal !important;
    }

    .hero-title__dynamic {
        margin-left: 0 !important;
    }

    /* Ukrainian and Russian versions: font-size and line-height for ≤345px */
    body.lang-uk .hero-title,
    body.lang-ru .hero-title {
        font-size: 26px !important;
        line-height: 36px !important;
        max-width: 284px !important;
        height: 72px !important; /* two lines * 36px line-height */
    }
    
    /* Cursor height matches font-size for Ukrainian and Russian versions */
    body.lang-uk .hero-title__cursor--question,
    body.lang-uk .hero-title__cursor--dynamic,
    body.lang-ru .hero-title__cursor--question,
    body.lang-ru .hero-title__cursor--dynamic {
        height: 26px !important;
    }

    /* All languages now use global animation rules defined above */

    /* Hide question cursor after text is erased for all languages (391-947px) */
    @media (max-width: 947px) and (min-width: 391px) {
        .hero-title__cursor--question.question-cursor-hidden {
            display: none !important;
            opacity: 0 !important;
            visibility: hidden !important;
            pointer-events: none !important;
            width: 0 !important;
            height: 0 !important;
            margin: 0 !important;
            background-color: transparent !important;
            animation: none !important;
        }
    }
}

@media (max-width: 480px) {
    .header {
        padding: 16px;
    }

    .header-container {
        flex-wrap: nowrap;
    }

    .logo {
        order: 1;
        width: 184px;
        height: 28px;
    }

    .cta-button {
        order: 2;
        width: auto !important;
        max-width: none !important;
    }

    .cta-section .cta-button {
        width: auto !important;
        max-width: none !important;
        display: inline-block !important;
        font-weight: 300; /* bolder on hover for small screens */
    }

    /* Ensure inner text reflects the bolder weight */
    .cta-section .cta-button .cta-button__text--original { font-weight: 300; }
    .cta-section .cta-button .cta-button__text--hover { font-weight: 400; }

    .menu { order: 3; width: 100%; flex-direction: column; }

    /* Mobile menu item typography/hover like in Figma */
    .menu-item {
        width: auto;
        padding: 0;
        border-radius: 0;
        font-family: 'Sora', sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
        color: var(--color-dark);
        text-decoration: none;
        white-space: nowrap;
        cursor: pointer;
        text-align: left;
    }
    .menu-item:hover { text-decoration: none; font-weight: 500; }

    .menu-divider {
        display: none;
    }

    .hero-section {
        margin-top: 60px;
        padding: 0 16px;
        min-height: auto !important; /* allow content to define height */
    }

    .hero-subtitle {
        font-size: 18px;
        line-height: 24px;
        max-width: 280px;
    }
    
    /* Ukrainian and Russian versions: max-width for hero-subtitle */
    body.lang-uk .hero-subtitle,
    body.lang-ru .hero-subtitle {
        max-width: 320px;
    }

    .hero-title {
        font-size: 46px;
        line-height: 56px;
        max-width: 368px;
        margin: 0 auto;
        height: 114px;
    }

    /* Prevent leading reserved space from indenting a new line */
    .hero-title__space {
        white-space: normal; /* collapse leading space at line start */
    }

    .hero-title__cursor--question,
    .hero-title__cursor--dynamic {
        height: 46px;
    }

    /* Smooth transition for text repositioning on small screens */
    .hero-title__static {
        transition: all 0.3s ease-in-out;
    }

    .hero-title__dynamic {
        transition: all 0.3s ease-in-out;
    }

    .hero-title__space {
        transition: all 0.3s ease-in-out;
    }

    .contact-info {
        margin-top: 24px;
        padding: 0 16px;
    }

    .cta-section {
        margin-top: 24px;
        padding: 0 16px;
    }

    .cta-section .cta-button {
        width: 100%;
    }
}

/* Updated Wed Oct 22 19:05:19 CEST 2025 */

/* Proportional scaling of button and text from 380px to 300px */
@media (max-width: 380px) and (min-width: 300px) {
    /* Target the duplicated CTA under hero */
    .cta-section .cta-button {
        /* Scale from 17px→15px font, 28px→26px line-height, 20/36px→16/30px padding across 380px→300px */
        font-size: calc(15px + (17 - 15) * ((100vw - 300px) / 80)) !important;
        line-height: calc(26px + (28 - 26) * ((100vw - 300px) / 80)) !important;
        padding: calc(16px + (20 - 16) * ((100vw - 300px) / 80))
                 calc(30px + (36 - 30) * ((100vw - 300px) / 80)) !important;
        max-width: 100%;
        box-sizing: border-box;
    }
    
    /* Ukrainian and Russian versions: Scale from 18px→15px font, 28px→26px line-height */
    
    .phone-below-cta {
        /* Scale from 16px→14px font, 24px→22px line-height across 380px→300px */
        font-size: calc(14px + (16 - 14) * ((100vw - 300px) / 80));
        line-height: calc(22px + (24 - 22) * ((100vw - 300px) / 80));
    }
    
    .cta-section { padding: 0 20px; }
}

/* Lock CTA size at the 300px endpoint for any smaller screens */
@media (max-width: 300px) {
    .cta-section .cta-button {
        font-size: 15px !important;
        line-height: 26px !important;
        padding: 16px 30px !important;
        max-width: 100%;
        box-sizing: border-box;
    }

    .phone-below-cta {
        font-size: 14px; 
        line-height: 22px; 
    }
    
    .cta-section { padding: 0 20px; }
}

@media (min-width: 620px) {
    .section.benefit-section .section__inner {
        display: grid;
        grid-template-areas:
            "title"
            "cta"
            "grid";
        row-gap: 0;
    }
    .section.benefit-section .benefit-section__title { grid-area: title; }
    .section.benefit-section .benefit-section__cta { grid-area: cta; justify-content: center; }
    .section.benefit-section .benefit-grid { grid-area: grid; }
}

/* Features Section */
.features-section {
    padding-top: clamp(88px, calc(88px + (100vw - 1140px) * 32 / 300), 120px);
    padding-bottom: clamp(88px, calc(88px + (100vw - 1140px) * 32 / 300), 120px);
}

.features-list {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.feature-card {
    border: 1px solid #141000;
    border-radius: 9999px;
    padding: 64px 64px 64px 88px;
    display: flex;
    gap: 88px;
    align-items: center;
    width: 100%;
}

.feature-card:not(:first-child) {
    margin-top: -1px;
}

.feature-card__icon-title {
    display: flex;
    gap: 80px;
    align-items: center;
    flex-shrink: 0;
}

.feature-card__icon {
    width: 64px;
    height: 64px;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    opacity: 0;
    transform: scale(0.8);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

/* Show icons if JavaScript is disabled (fallback) */
.no-js .feature-card__icon {
    opacity: 1;
    transform: scale(1);
}

/* Animate icons when they become visible */
.feature-card__icon.animate {
    opacity: 1;
    transform: scale(1);
}

.feature-card__icon--green {
    background: #d5ee8e;
}

.feature-card__icon--blue {
    background: #c4dfff;
}

.feature-card__icon--orange {
    background: #ffa25e;
}

.feature-card__icon-img {
    width: 32px;
    height: 32px;
    display: block;
}

.feature-card__icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

.feature-card__title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: 36px;
    line-height: 52px;
    color: #141000;
    margin: 0;
    width: 520px;
    flex-shrink: 0;
    white-space: normal;
}

.feature-card__desc {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #141000;
    margin: 0;
    width: 400px;
    flex-shrink: 0;
}

body.lang-uk .feature-card__desc,
body.lang-ru .feature-card__desc {
    font-family: 'Noto Sans', sans-serif;
}

/* Ukrainian version: line breaks for feature card titles */
/* Hide mobile line breaks on larger screens (shows 2 lines) */
body.lang-uk .feature-card__title-br-mobile-uk {
    display: none;
}

/* Show mobile line breaks for Ukrainian version on screens ≤430px (shows 3 lines) */
@media (max-width: 430px) {
    body.lang-uk .feature-card:first-child .feature-card__title-br-mobile-uk,
    body.lang-uk .feature-card:nth-child(3) .feature-card__title-br-mobile-uk {
        display: inline;
    }
}

/* Russian version: line breaks for feature card titles */
/* Hide mobile line breaks on larger screens (shows 2 lines) */
body.lang-ru .feature-card__title-br-mobile-ru {
    display: none;
}

/* Show mobile line breaks for Russian version on screens ≤430px (shows 3 lines) */
@media (max-width: 430px) {
    body.lang-ru .feature-card:first-child .feature-card__title-br-mobile-ru,
    body.lang-ru .feature-card:nth-child(2) .feature-card__title-br-mobile-ru,
    body.lang-ru .feature-card:nth-child(3) .feature-card__title-br-mobile-ru {
        display: inline;
    }
}

/* Hide <br> for sizes <1140px */
.feature-card__desc-br {
    display: none;
}

/* Show <br> for sizes >=1140px */
@media (min-width: 1140px) {
    .feature-card__desc-br {
        display: inline;
    }
}

/* Hide word "pełną" for sizes ≤443px */
@media (max-width: 443px) {
    .feature-card__desc-full {
        display: none;
    }
}

/* Viewport-based scaling for features-section from 1140px to 1440px */
@media (min-width: 1140px) and (max-width: 1440px) {
    .features-section {
        padding-top: 8.33vw; /* 120px at 1440px */
        padding-bottom: 8.33vw; /* 120px at 1440px */
    }
    
    .feature-card {
        padding: 4.44vw 4.44vw 4.44vw 6.11vw; /* 64px 64px 64px 88px at 1440px */
        gap: 6.11vw; /* 88px at 1440px */
        border-radius: 9999px;
    }
    
    .feature-card__icon-title {
        gap: 5.56vw; /* 80px at 1440px */
    }
    
    .feature-card__icon {
        width: 4.44vw; /* 64px at 1440px */
        height: 4.44vw; /* 64px at 1440px */
    }
    
    .feature-card__icon-img {
        width: 100%;
        height: 100%;
    }
    
    .feature-card__icon svg {
        width: 100%;
        height: 100%;
    }
    
    .feature-card__title {
        font-size: 2.5vw; /* 36px at 1440px */
        line-height: 3.61vw; /* 52px at 1440px */
        width: 36.11vw; /* 520px at 1440px */
    }
    
    .feature-card__desc {
        font-size: 1.25vw; /* 18px at 1440px */
        line-height: 1.94vw; /* 28px at 1440px */
        width: 27.78vw; /* 400px at 1440px */
    }
}

/* Responsive styles for Features Section */

@media (min-width: 940px) and (max-width: 1139px) {
    .features-section {
        padding-top: 64px;
        padding-bottom: 64px;
    }
    
    .section.features-section {
        padding-left: 40px;
        padding-right: 40px;
    }
    
    .feature-card {
        padding: 56px 0;
        gap: 32px;
        flex-direction: column;
        align-items: center;
    }
    
    .feature-card__icon-title {
        gap: 60px;
        width: 644px;
        justify-content: flex-start;
    }
    
    .feature-card__title {
        width: 520px;
    }
    
    .feature-card__desc {
        width: 644px;
        padding-left: 124px;
        text-align: left;
    }
    
}

@media (min-width: 840px) and (max-width: 939px) {
    .features-section {
        padding-top: 64px;
        padding-bottom: 64px;
    }
    
    .section.features-section {
        padding-left: 40px;
        padding-right: 40px;
    }
    
    .feature-card {
        padding: 56px 64px;
        gap: 32px;
        flex-direction: column;
        align-items: center;
    }
    
    .feature-card__icon-title {
        gap: 32px;
        width: 644px;
        justify-content: flex-start;
    }
    
    .feature-card__title {
        width: 520px;
    }
    
    .feature-card__desc {
        width: 644px;
        padding-left: 96px;
        text-align: left;
        align-self: flex-start;
        margin-left: auto;
        margin-right: auto;
    }
    
}

@media (min-width: 720px) and (max-width: 839px) {
    .features-section {
        padding-top: 64px;
        padding-bottom: 64px;
    }
    
    .section.features-section {
        padding-left: 40px;
        padding-right: 40px;
    }
    
    .feature-card {
        padding: 48px 64px;
        gap: 32px;
        flex-direction: column;
        align-items: center;
    }
    
    .feature-card__icon-title {
        gap: 32px;
        width: 500px;
        justify-content: flex-start;
    }
    
    .feature-card__title {
        font-size: 28px;
        line-height: 40px;
        width: 404px;
    }
    
    .feature-card__desc {
        width: 500px;
        padding-left: 92px;
        text-align: left;
        align-self: flex-start;
        margin-left: auto;
        margin-right: auto;
    }
}

@media (max-width: 992px) {
    .features-section {
        padding-top: 64px;
        padding-bottom: 64px;
    }
}

@media (max-width: 413px) {
    .features-section {
        padding-top: 40px;
        padding-bottom: 40px;
    }
    
    .feature-card {
        padding: 48px 40px;
        gap: 40px;
        flex-direction: column;
        align-items: flex-start;
    }
    
    .feature-card__icon-title {
        gap: 32px;
        width: 100%;
    }
    
    .feature-card__title {
        width: auto;
        flex: 1;
    }
    
    .feature-card__desc {
        width: 100%;
    }
}

@media (max-width: 413px) {
    .features-section {
        padding-top: 40px;
        padding-bottom: 40px;
    }
    
    .section.features-section {
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .feature-card {
        padding: 32px 24px;
        gap: 24px;
    }
    
    .feature-card__icon {
        width: 56px;
        height: 56px;
    }

    .feature-card__icon-img,
    .feature-card__icon svg {
        width: 32px;
        height: 32px;
    }
    
    .feature-card__icon-img,
    .feature-card__icon svg {
        width: 28px;
        height: 28px;
    }
    
    .feature-card__icon-title {
        gap: 24px;
    }
    
    .feature-card__title {
        font-size: 28px;
        line-height: 40px;
    }
    
    .feature-card__desc {
        font-size: 16px;
        line-height: 24px;
    }
}

/* Features Section: 414px–619px (structure as in 375px design, fixed px values) */
@media (min-width: 414px) and (max-width: 619px) {
    .features-section {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .section.features-section {
        padding-left: 20px;
        padding-right: 20px;
    }

    .features-list {
        gap: 36px; /* as in design */
    }

    .feature-card {
        margin: 0;
        padding: 0;
        border: none;
        border-radius: 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px; /* gap between title and description */
    }

    .feature-card__icon-title {
        gap: 24px;
        width: 100%;
        align-items: center;
    }

    .feature-card__icon {
        width: 56px;
        height: 56px;
    }

    .feature-card__title {
        font-size: 24px;
        line-height: 32px;
        width: auto;
        flex: 1 1 auto;
    }

    .feature-card__desc {
        width: 100%;
        padding: 24px 26px;
        border-radius: 40px;
        border: 1px solid #141000;
        font-size: 16px;
        line-height: 24px;
    }
}

/* Features Section: 375px–413px - fixed sizes, icons don't scale */
@media (min-width: 375px) and (max-width: 413px) {
    .features-section {
        padding-top: 9.66vw;   /* 40px at 414px */
        padding-bottom: 9.66vw;
    }

    .section.features-section {
        padding-left: 4.83vw;  /* 20px at 414px */
        padding-right: 4.83vw;
    }

    .features-list {
        gap: 8.7vw;            /* 36px at 414px */
    }

    .feature-card {
        margin: 0;
        padding: 0;
        border: none;
        border-radius: 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 4.83vw;           /* 20px at 414px */
    }

    .feature-card__icon-title {
        gap: 5.8vw;            /* 24px at 414px */
        width: 100%;
        align-items: center;
    }

    /* Fixed size icon, doesn't scale */
    .feature-card__icon {
        width: 56px;
        height: 56px;
    }

    /* Inner SVG/image fills the entire circle */
    .feature-card__icon-img,
    .feature-card__icon svg {
        width: 100%;
        height: 100%;
    }

    .feature-card__title {
        font-size: 5.8vw;      /* 24px at 414px */
        line-height: 7.73vw;   /* 32px at 414px */
        width: auto;
        flex: 1 1 auto;
    }

    .feature-card__desc {
        width: 100%;
        padding: 5.8vw 6.28vw;  /* 24px 26px at 414px */
        border-radius: 9.66vw; /* 40px at 414px */
        border: 1px solid #141000;
        font-size: 3.86vw;     /* 16px at 414px */
        line-height: 5.8vw;    /* 24px at 414px */
    }
}

/* Features Section: viewport-based scaling for 300px–374px */
@media (max-width: 374px) {
    .features-section {
        padding-top: 9.66vw;   /* 40px at 414px */
        padding-bottom: 9.66vw;
    }

    .section.features-section {
        padding-left: 4.83vw;  /* 20px at 414px */
        padding-right: 4.83vw;
    }

    .features-list {
        gap: 8.7vw;            /* 36px at 414px */
    }

    .feature-card {
        margin: 0;
        padding: 0;
        border: none;
        border-radius: 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 4.83vw;           /* 20px at 414px */
    }

    .feature-card__icon-title {
        gap: 5.8vw;            /* 24px at 414px */
        width: 100%;
        align-items: center;
    }

    /* Icon scales proportionally via vw */
    .feature-card__icon {
        width: 13.53vw;        /* 56px at 414px */
        height: 13.53vw;
    }

    /* Inner SVG/image fills the entire circle */
    .feature-card__icon-img,
    .feature-card__icon svg {
        width: 100%;
        height: 100%;
    }

    .feature-card__title {
        font-size: 5.8vw;      /* 24px at 414px */
        line-height: 7.73vw;   /* 32px at 414px */
        width: auto;
        flex: 1 1 auto;
    }

    .feature-card__desc {
        width: 100%;
        padding: 5.8vw 6.28vw; /* 24px 26px at 414px - continues from 375px */
        border-radius: 9.66vw; /* 40px at 414px */
        border: 1px solid #141000;
        font-size: 3.86vw;     /* 16px at 414px */
        line-height: 5.8vw;    /* 24px at 414px */
    }
}

/* Features Section: 620px–719px (719px design applied to this range) */
@media (min-width: 620px) and (max-width: 719px) {
    .features-section {
        padding-top: 64px;
        padding-bottom: 64px;
    }

    .features-list {
        gap: 40px; /* gap between cards */
    }

    .feature-card {
        max-width: 639px;
        margin: 0 auto;
        padding: 0;
        gap: 28px; /* gap between Icon-title and description */
        flex-direction: column;
        align-items: flex-start;
        border: none;           /* remove border from entire card */
        border-radius: 0;
    }

    .feature-card__icon-title {
        padding-left: 56px;
        padding-right: 0;
        gap: 24px; /* from design */
        width: 100%;
        align-items: center;
    }

    .feature-card__title {
        font-size: 28px;
        line-height: 40px;
        width: auto;           /* allow title to wrap */
        flex: 1 1 auto;        /* remove strict shrink:0 from base style */
    }

    .feature-card__title-br-second {
        display: inline;
    }

    .feature-card__desc {
        width: 100%;      /* border on full card width */
        padding: 32px 56px;
        border-radius: 9999px; /* full rounding as in design */
        border: 1px solid #141000; /* border only around description */
    }
}

/* Show line break in second card title for sizes ≤619px */
@media (max-width: 619px) {
    .feature-card__title-br-second {
        display: inline;
    }
}

/* Hide line break in second card title for sizes ≥720px, but keep it visible for English */
@media (min-width: 720px) {
    .feature-card__title-br-second {
        display: none;
    }
    
    /* Keep line break visible for English version */
    body.lang-en .feature-card__title-br-second {
        display: inline;
    }
}

/* Process Steps Section */
.process-steps-section {
    padding-top: 80px;
    padding-bottom: 80px;
}

.process-steps-container {
    max-width: 1344px;
    margin: 0 auto;
    padding-left: 0;
    padding-right: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 80px;
}

.process-steps__title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: 56px;
    line-height: 72px;
    color: #141000;
    text-align: center;
    white-space: pre-wrap;
    width: 100%;
}

.process-steps__title-br {
    display: none;
}

.process-steps__cards {
    display: flex;
    gap: 16px;
    align-items: center;
    position: relative;
    width: 100%;
}

.process-steps__cards::before {
    content: '';
    position: absolute;
    top: 72px;
    left: 50%;
    transform: translateX(-50%) translateY(0.5px); /* Adjust vertical position to center on dot */
    width: calc(66.67% + 16px); /* Width from center of first card to center of last card */
    height: 1px;
    background-color: #141000;
    z-index: 0;
}

.process-steps__line {
    display: none; /* Hide the old line element */
}

.process-step-card {
    flex: 1 0 0;
    display: flex;
    flex-direction: column;
    gap: 40px;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
}

.process-step-card__header {
    display: flex;
    flex-direction: column;
    gap: 28px;
    align-items: center;
}

.process-step-card__chip {
    border: 1px solid #141000;
    border-radius: 9999px;
    padding: 6px 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background-color: transparent;
    transition: background-color 0.3s ease;
}

.process-step-card:hover .process-step-card__chip {
    background-color: #D5EE8E;
}

.process-step-card__chip-text {
    font-family: 'Sora', sans-serif;
    font-weight: 300;
    font-size: 15px;
    line-height: 24px;
    color: #141000;
}

.process-step-card__dot {
    width: 16px;
    height: 16px;
    position: relative;
    flex-shrink: 0;
}

.process-step-card__dot-img {
    width: 100%;
    height: 100%;
    display: block;
}

.process-step-card__content {
    border: 1px solid #141000;
    border-radius: 24px;
    padding: 30px 32px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    align-items: flex-start;
    width: 100%;
}

.process-step-card__title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: 18px;
    line-height: 28px;
    color: #141000;
    white-space: pre-wrap;
    margin: 0;
}

.process-step-card__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: flex-start;
}

.process-step-card__item {
    display: flex;
    gap: 8px;
    align-items: center;
    width: 100%;
}

.process-step-card__check {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    display: block;
}

.process-step-card__text {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 28px;
    color: #3a403b;
}

.process-step-card__text-nowrap {
    white-space: nowrap;
}

.process-step-card__text strong {
    font-weight: 600;
}

/* Ukrainian version: Process Steps Section typography */

body.lang-uk .process-step-card__chip-text {
    font-family: 'Noto Sans', sans-serif;
    font-weight: 400;
}

body.lang-uk .process-step-card__text {
    font-family: 'Noto Sans', sans-serif;
}

/* Russian version: Process Steps Section typography */

body.lang-ru .process-step-card__chip-text {
    font-family: 'Noto Sans', sans-serif;
    font-weight: 400;
}

body.lang-ru .process-step-card__text {
    font-family: 'Noto Sans', sans-serif;
}

/* Process Steps Section: 620px-992px - vertical layout */
@media (min-width: 620px) and (max-width: 992px) {
    .process-steps-section {
        padding-top: 64px;
        padding-bottom: 64px;
    }

    .process-steps-container {
        padding-left: 40px;
        padding-right: 40px;
        gap: 80px;
        align-items: center;
    }

    .process-steps__title {
        font-size: 40px;
        line-height: 48px;
        width: 656px;
        padding-left: 56px;
        text-align: left;
    }

    .process-steps__title-br {
        display: inline;
    }

    .process-steps__cards {
        flex-direction: column;
        gap: 48px;
        align-items: flex-start;
        position: relative;
        width: auto;
        min-height: 660px; /* Ensure container has height for 648px line plus 12px top offset */
    }

    .process-steps__cards::before {
        content: '' !important;
        position: absolute !important;
        left: 8px !important; /* Center of dot (16px/2) */
        top: 12px !important;
        height: 648px !important;
        width: 1px !important;
        background-color: #141000 !important;
        z-index: 0 !important;
        transform: none !important;
    }

    .process-step-card {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start;
        width: 100%;
        position: relative;
        z-index: 1;
    }

    .process-step-card__header {
        flex-direction: row-reverse;
        gap: 40px;
        align-items: center;
        justify-content: flex-start;
        width: auto;
        flex-shrink: 0;
        position: relative;
    }

    .process-step-card__chip {
        padding: 6px 18px;
    }

    .process-step-card__dot {
        width: 16px;
        height: 16px;
    }

    .process-step-card__content {
        padding: 32px 40px;
        border-radius: 24px;
        width: 600px;
        max-width: 100%;
        gap: 22px;
        margin-left: 56px;
    }

    .process-step-card__title {
        font-size: 26px;
        line-height: 38px;
        font-weight: 400;
    }

    .process-step-card__text {
        font-size: 18px;
        line-height: 28px;
    }

    .process-step-card__list {
        gap: 4px;
    }
}

@media (min-width: 620px) and (max-width: 735px) {
    .process-steps__cards {
        min-height: 692px; /* Ensure container has height for 680px line plus 12px top offset */
    }

    .process-steps__cards::before {
        height: 680px !important;
    }

    .process-step-card__content {
        width: 496px;
    }
}

/* Process Steps Section: 520px-619px - vertical layout */
@media (min-width: 520px) and (max-width: 619px) {
    .process-steps-section {
        padding-top: 40px;
        padding-bottom: 40px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .process-steps-container {
        padding-left: 0;
        padding-right: 0;
        gap: 32px;
        align-items: flex-start;
        width: 100%;
    }

    .process-steps__title {
        font-size: 28px;
        line-height: 40px;
        width: 100%;
        padding-left: 0;
        text-align: left;
    }

    .process-steps__title-br {
        display: none;
    }

    .process-steps__cards {
        flex-direction: column;
        gap: 40px;
        align-items: flex-start;
        position: relative;
        width: 100%;
        min-height: 606px; /* Ensure container has height for 589px line plus 17px top offset */
    }

    .process-steps__cards::before {
        content: '' !important;
        position: absolute !important;
        left: 8px !important; /* Center of dot (16px/2) */
        top: 17px !important;
        height: 589px !important;
        width: 1px !important;
        background-color: #141000 !important;
        z-index: 0 !important;
        transform: none !important;
    }

    .process-step-card {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start;
        width: 100%;
        position: relative;
        z-index: 1;
    }

    .process-step-card__header {
        flex-direction: row-reverse;
        gap: 40px;
        align-items: center;
        justify-content: flex-start;
        width: auto;
        flex-shrink: 0;
        position: relative;
    }

    .process-step-card__chip {
        padding: 6px 18px;
    }

    .process-step-card__dot {
        width: 16px;
        height: 16px;
    }

    .process-step-card__content {
        padding: 30px 32px;
        border-radius: 24px;
        width: calc(100% - 56px);
        max-width: 100%;
        gap: 18px;
        margin-left: 56px;
    }

    .process-step-card__title {
        font-size: 18px;
        line-height: 28px;
        font-weight: 400;
    }

    .process-step-card__text {
        font-size: 16px;
        line-height: 28px;
    }

    .process-step-card__list {
        gap: 4px;
    }
}

/* Process Steps Section: 440px-519px - vertical layout */
@media (min-width: 440px) and (max-width: 519px) {
    .process-steps-section {
        padding-top: 40px;
        padding-bottom: 40px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .process-steps-container {
        padding-left: 0;
        padding-right: 0;
        gap: 32px;
        align-items: flex-start;
        width: 100%;
    }

    .process-steps__title {
        font-size: 28px;
        line-height: 40px;
        width: 100%;
        padding-left: 0;
        text-align: left;
    }
    
    .process-steps__title-br {
        display: none;
    }
    
    .process-steps__cards {
        flex-direction: column;
        gap: 36px;
        align-items: flex-start;
        position: relative;
        width: 100%;
        min-height: 516px; /* Ensure container has height for 499px line plus 17px top offset */
    }
    
    .process-steps__cards::before {
        content: '' !important;
        position: absolute !important;
        left: 8px !important; /* Center of dot (16px/2) */
        top: 17px !important;
        height: 499px !important;
        width: 1px !important;
        background-color: #141000 !important;
        z-index: 0 !important;
        transform: none !important;
    }
    
    .process-step-card {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start;
        width: 100%;
        position: relative;
        z-index: 1;
    }
    
    .process-step-card__header {
        flex-direction: row-reverse;
        gap: 16px;
        align-items: center;
        justify-content: flex-start;
        width: auto;
        flex-shrink: 0;
        position: relative;
    }
    
    .process-step-card:not(:first-child) .process-step-card__header {
        gap: 24px;
    }
    
    .process-step-card__chip {
        padding: 6px 18px;
    }
    
    .process-step-card__chip-text {
        font-size: 14px;
        line-height: 20px;
    }
    
    .process-step-card__dot {
        width: 16px;
        height: 16px;
    }
    
    .process-step-card__content {
        padding: 20px 24px;
        border-radius: 24px;
        width: calc(100% - 32px);
        max-width: 100%;
        gap: 18px;
        margin-left: 32px;
    }
    
    .process-step-card:not(:first-child) .process-step-card__content {
        width: calc(100% - 40px);
        margin-left: 40px;
    }
    
    .process-step-card__title {
        font-size: 18px;
        line-height: 28px;
        font-weight: 400;
    }
    
    .process-step-card__text {
        font-size: 15px;
        line-height: 20px;
    }

    .process-step-card__list {
        gap: 8px;
    }

    .process-step-card__check {
        width: 18px;
        height: 18px;
    }

    .process-step-card__title-fast {
        display: none;
    }

    .process-step-card__title-consultation {
        text-transform: capitalize;
    }
}

/* Process Steps Section: 414px-440px - vertical layout */
@media (min-width: 414px) and (max-width: 440px) {
    .process-steps-section {
        padding-top: 40px;
        padding-bottom: 40px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .process-steps-container {
        padding-left: 0;
        padding-right: 0;
        gap: 32px;
        align-items: flex-start;
        width: 100%;
    }

    .process-steps__title {
        font-size: 28px;
        line-height: 40px;
        width: 100%;
        padding-left: 0;
        text-align: left;
        color: #141000;
    }
    
    .process-steps__title-br {
        display: none;
    }
    
    .process-steps__cards {
        flex-direction: column;
        gap: 36px;
        align-items: flex-start;
        position: relative;
        width: 100%;
        min-height: 515px; /* Ensure container has height for 498px line plus 17px top offset */
    }
    
    .process-steps__cards::before {
        content: '' !important;
        position: absolute !important;
        left: 8px !important; /* Center of dot (16px/2) */
        top: 17px !important;
        height: 498px !important;
        width: 1px !important;
        background-color: #141000 !important;
        z-index: 0 !important;
        transform: none !important;
    }
    
    .process-step-card {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start;
        width: 100%;
        position: relative;
        z-index: 1;
    }
    
    .process-step-card__header {
        flex-direction: row-reverse;
        gap: 16px;
        align-items: center;
        justify-content: flex-start;
        width: auto;
        flex-shrink: 0;
        position: relative;
    }
    
    .process-step-card:not(:first-child) .process-step-card__header {
        gap: 16px;
    }
    
    .process-step-card__chip {
        padding: 6px 18px;
    }
    
    .process-step-card__chip-text {
        font-size: 14px;
        line-height: 20px;
        color: #141000;
    }
    
    .process-step-card__dot {
        width: 16px;
        height: 16px;
    }
    
    .process-step-card__content {
        padding: 20px 24px;
        border-radius: 24px;
        width: calc(100% - 32px);
        max-width: 100%;
        gap: 18px;
        margin-left: 32px;
    }
    
    .process-step-card:not(:first-child) .process-step-card__content {
        width: calc(100% - 32px);
        margin-left: 32px;
    }
    
    .process-step-card__title {
        font-size: 18px;
        line-height: 28px;
        font-weight: 400;
        color: #141000;
    }
    
    .process-step-card__text {
        font-size: 14px;
        color: #141000;
        line-height: 20px;
    }

    .process-step-card__list {
        gap: 8px;
    }

    .process-step-card__check {
        width: 18px;
        height: 18px;
    }

    .process-step-card__title-fast {
        display: none;
    }

    .process-step-card__title-consultation {
        text-transform: capitalize;
    }
}

/* Process Steps Section: ≤413px - viewport-based scaling */
@media (max-width: 413px) {
    .process-steps-section {
        padding-top: 9.66vw; /* 40px at 414px */
        padding-bottom: 9.66vw;
        padding-left: 4.83vw; /* 20px at 414px */
        padding-right: 4.83vw;
    }

    .process-steps-container {
        padding-left: 0;
        padding-right: 0;
        gap: 7.73vw; /* 32px at 414px */
        align-items: flex-start;
        width: 100%;
    }

    .process-steps__title {
        font-size: 6.76vw; /* 28px at 414px */
        line-height: 9.66vw; /* 40px at 414px */
        width: 100%;
        padding-left: 0;
        text-align: left;
        color: #141000;
    }
    
    .process-steps__title-br {
        display: none;
    }
    
    .process-steps__cards {
        flex-direction: column;
        gap: 8.70vw; /* 36px at 414px */
        align-items: flex-start;
        position: relative;
        width: 100%;
        min-height: 124.4vw; /* 515px at 414px */
    }
    
    .process-steps__cards::before {
        content: '' !important;
        position: absolute !important;
        left: 1.93vw !important; /* 8px at 414px */
        top: 4.11vw !important; /* 17px at 414px */
        height: 120.29vw !important; /* 498px at 414px */
        width: 1px !important;
        background-color: #141000 !important;
        z-index: 0 !important;
        transform: none !important;
    }
    
    .process-step-card {
        flex-direction: column;
        gap: 3.86vw; /* 16px at 414px */
        align-items: flex-start;
        width: 100%;
        position: relative;
        z-index: 1;
    }
    
    .process-step-card__header {
        flex-direction: row-reverse;
        gap: 3.86vw; /* 16px at 414px */
        align-items: center;
        justify-content: flex-start;
        width: auto;
        flex-shrink: 0;
        position: relative;
    }
    
    .process-step-card:not(:first-child) .process-step-card__header {
        gap: 3.86vw; /* 16px at 414px */
    }
    
    .process-step-card__chip {
        padding: 1.45vw 4.35vw; /* 6px 18px at 414px */
    }
    
    .process-step-card__chip-text {
        font-size: 3.38vw; /* 14px at 414px */
        line-height: 4.83vw; /* 20px at 414px */
        color: #141000;
    }
    
    .process-step-card__dot {
        width: 3.86vw; /* 16px at 414px */
        height: 3.86vw;
    }
    
    .process-step-card__content {
        padding: 4.83vw 5.80vw; /* 20px 24px at 414px */
        border-radius: 5.80vw; /* 24px at 414px */
        width: calc(100% - 7.73vw); /* 32px at 414px */
        max-width: 100%;
        gap: 4.35vw; /* 18px at 414px */
        margin-left: 7.73vw; /* 32px at 414px */
    }
    
    .process-step-card:not(:first-child) .process-step-card__content {
        width: calc(100% - 7.73vw); /* 32px at 414px */
        margin-left: 7.73vw; /* 32px at 414px */
    }
    
    .process-step-card__title {
        font-size: 4.35vw; /* 18px at 414px */
        line-height: 6.76vw; /* 28px at 414px */
        font-weight: 400;
        color: #141000;
    }
    
    .process-step-card__text {
        font-size: 3.38vw; /* 14px at 414px */
        line-height: 4.83vw; /* 20px at 414px */
        color: #141000;
    }

    .process-step-card__list {
        gap: 1.93vw; /* 8px at 414px */
    }

    .process-step-card__check {
        width: 4.35vw; /* 18px at 414px */
        height: 4.35vw;
    }

    .process-step-card__title-fast {
        display: none;
    }

    .process-step-card__title-consultation {
        text-transform: capitalize;
    }
}

/* Show line break in title for sizes 450px-550px */
@media (max-width: 550px) and (min-width: 450px) {
    .process-steps__title-br {
        display: inline;
    }
}

/* Hide line break in title for sizes ≤449px */
@media (max-width: 449px) {
    .process-steps__title-br {
        display: none;
    }
}

/* Hide "usługi" in text for sizes ≤527px */
@media (max-width: 527px) {
    .process-step-card__text-service {
        display: none;
    }
}

/* Prevent text wrapping for specific text on sizes 440-442px */
@media (min-width: 440px) and (max-width: 442px) {
    .process-step-card__text-nowrap {
        white-space: nowrap;
    }
}

/* Prevent text wrapping for specific text on sizes 414-415px */
@media (min-width: 414px) and (max-width: 415px) {
    .process-step-card__text-nowrap {
        white-space: nowrap;
    }
}

/* Process Steps Section: 993px-1139px - vertical layout */
@media (min-width: 993px) and (max-width: 1139px) {
    .process-steps-section {
        padding-top: 64px;
        padding-bottom: 64px;
    }

    .process-steps-container {
        padding-left: 40px;
        padding-right: 40px;
        gap: 80px;
    }

    .process-steps__title {
        font-size: clamp(40px, calc(40px + (100vw - 993px) * (48 - 40) / (1139 - 993)), 48px); /* 40px at 993px, 48px at 1139px */
        line-height: 56px;
    }

    .process-steps__cards {
        flex-direction: column;
        gap: 24px;
        align-items: flex-start;
        position: relative;
        width: 855px;
        max-width: 100%;
    }

    .process-steps__cards::before {
        content: '' !important;
        position: absolute !important;
        left: 184px !important; /* Position at center of dots (192px header width - 8px half dot) */
        top: 50% !important;
        transform: translateY(-50%) !important;
        width: 1px !important;
        height: 588px !important;
        background-color: #141000 !important;
        z-index: 1 !important;
    }

    .process-step-card {
        flex-direction: row;
        gap: 40px;
        align-items: center;
        width: 100%;
        position: relative;
    }

    .process-step-card__header {
        flex-direction: row;
        gap: 28px;
        align-items: center;
        justify-content: space-between;
        width: 192px;
        flex-shrink: 0;
        position: relative;
    }

    .process-step-card__chip {
        padding: 6px 18px;
    }

    .process-step-card__dot {
        width: 16px;
        height: 16px;
    }

    .process-step-card__content {
        padding: 48px 96px;
        border-radius: 9999px;
        flex: 1;
        min-width: 0;
        gap: 24px;
    }

    .process-step-card__title {
        font-size: 26px;
        line-height: 38px;
        font-weight: 400;
    }

    .process-step-card__text {
        font-size: 18px;
        line-height: 28px;
    }
}

/* Viewport-based scaling for process-steps section from 1140px to 1428px */
@media (min-width: 1140px) and (max-width: 1428px) {
    .process-steps-section {
        padding-top: clamp(63.87px, 5.6vw, 80px); /* 80px at 1428px, 63.87px at 1140px */
        padding-bottom: clamp(63.87px, 5.6vw, 80px);
    }

    .process-steps-container {
        gap: clamp(63.87px, 5.6vw, 80px); /* 80px at 1428px, 63.87px at 1140px */
    }

    .process-steps__title {
        font-size: clamp(44.71px, 3.92vw, 56px); /* 56px at 1428px, 44.71px at 1140px */
        line-height: clamp(57.48px, 5.04vw, 72px); /* 72px at 1428px, 57.48px at 1140px */
    }

    .process-steps__cards {
        gap: clamp(12.77px, 1.12vw, 16px); /* 16px at 1428px, 12.77px at 1140px */
    }

    .process-steps__cards::before {
        top: clamp(57.48px, 5.04vw, 72px); /* 72px at 1428px, 57.48px at 1140px */
    }

    .process-step-card {
        gap: clamp(31.93px, 2.8vw, 40px); /* 40px at 1428px, 31.93px at 1140px */
    }

    .process-step-card__header {
        gap: clamp(22.35px, 1.96vw, 28px); /* 28px at 1428px, 22.35px at 1140px */
    }

    .process-step-card__chip {
        padding: clamp(4.79px, 0.42vw, 6px) clamp(14.37px, 1.26vw, 18px); /* 6px 18px at 1428px, 4.79px 14.37px at 1140px */
    }

    .process-step-card__chip-text {
        font-size: clamp(11.97px, 1.05vw, 15px); /* 15px at 1428px, 11.97px at 1140px */
        line-height: clamp(19.16px, 1.68vw, 24px); /* 24px at 1428px, 19.16px at 1140px */
    }

    .process-step-card__dot {
        width: clamp(12.77px, 1.12vw, 16px); /* 16px at 1428px, 12.77px at 1140px */
        height: clamp(12.77px, 1.12vw, 16px);
    }

    .process-step-card__content {
        padding: clamp(23.94px, 2.1vw, 30px) clamp(25.54px, 2.24vw, 32px); /* 30px 32px at 1428px, 23.94px 25.54px at 1140px */
        border-radius: clamp(19.16px, 1.68vw, 24px); /* 24px at 1428px, 19.16px at 1140px */
        gap: clamp(14.37px, 1.26vw, 18px); /* 18px at 1428px, 14.37px at 1140px */
    }

    .process-step-card__title {
        font-size: clamp(14.37px, 1.26vw, 18px); /* 18px at 1428px, 14.37px at 1140px */
        line-height: clamp(22.35px, 1.96vw, 28px); /* 28px at 1428px, 22.35px at 1140px */
    }

    .process-step-card__list {
        gap: clamp(3.19px, 0.28vw, 4px); /* 4px at 1428px, 3.19px at 1140px */
    }

    .process-step-card__item {
        gap: clamp(6.39px, 0.56vw, 8px); /* 8px at 1428px, 6.39px at 1140px */
    }

    .process-step-card__check {
        width: clamp(15.97px, 1.4vw, 20px); /* 20px at 1428px, 15.97px at 1140px */
        height: clamp(15.97px, 1.4vw, 20px);
    }

    .process-step-card__text {
        font-size: clamp(12.77px, 1.12vw, 16px); /* 16px at 1428px, 12.77px at 1140px */
        line-height: clamp(22.35px, 1.96vw, 28px); /* 28px at 1428px, 22.35px at 1140px */
    }
}

/* Heart Section */
.heart-section {
    padding-top: clamp(64px, calc(64px + (100vw - 1140px) * 16 / 300), 80px);
    padding-bottom: clamp(64px, calc(64px + (100vw - 1140px) * 16 / 300), 80px);
    padding-left: clamp(40px, calc(40px + (100vw - 1140px) * 8 / 300), 48px);
    padding-right: clamp(40px, calc(40px + (100vw - 1140px) * 8 / 300), 48px);
}

.heart-section__container {
    display: flex;
    flex-direction: column;
    gap: clamp(40px, calc(40px + (100vw - 1140px) * 8 / 300), 48px);
    align-items: center;
    max-width: 1344px;
    margin: 0 auto;
}

.heart-section__title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: clamp(48px, calc(48px + (100vw - 1140px) * 8 / 300), 56px);
    line-height: clamp(60px, calc(60px + (100vw - 1140px) * 12 / 300), 72px);
    color: #141000;
    text-align: center;
    display: flex;
    align-items: center;
    gap: clamp(20px, calc(20px + (100vw - 1140px) * 4 / 300), 24px);
    margin: 0;
}

.heart-section__title-line1 {
    display: inline-flex;
    align-items: center;
    gap: clamp(20px, calc(20px + (100vw - 1140px) * 4 / 300), 24px);
}

.heart-section__title-line2 {
    display: inline;
}

.heart-section__icon {
    width: clamp(56px, calc(56px + (100vw - 1140px) * 8 / 300), 64px);
    height: clamp(56px, calc(56px + (100vw - 1140px) * 8 / 300), 64px);
    display: block;
    flex-shrink: 0;
}

.heart-section__text {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: clamp(16px, calc(16px + (100vw - 1140px) * 2 / 300), 18px);
    line-height: clamp(24px, calc(24px + (100vw - 1140px) * 4 / 300), 28px);
    color: #141000;
    text-align: center;
    margin: 0;
}

/* Ukrainian and Russian versions: use Noto Sans instead of Sora */
body.lang-uk .heart-section__text,
body.lang-ru .heart-section__text {
    font-family: 'Noto Sans', sans-serif !important;
}

/* Hide line break after "від" in Ukrainian CTA callout text on screens 498px and smaller */
@media (max-width: 498px) {
    body.lang-uk .cta-callout-section .cta-callout-text-br-uk-498 {
        display: none;
    }
}

/* Hide line break after "the" in English CTA callout text on screens 475px and smaller */
@media (max-width: 475px) {
    body.lang-en .cta-callout-section .cta-callout-text-br-en-475 {
        display: none;
    }
}

/* Left align "– замов зараз" for Ukrainian version on screens 480-574px */
@media (min-width: 480px) and (max-width: 574px) {
    body.lang-uk .cta-callout-section .heart-section__title-line2 {
        display: block !important;
        text-align: left !important;
        width: 100%;
    }
}
}

.heart-section__text-br-okolic {
    display: none;
}

.heart-section .cta-button {
    padding: clamp(18px, calc(18px + (100vw - 1140px) * 2 / 300), 20px) clamp(32px, calc(32px + (100vw - 1140px) * 0 / 300), 32px);
    font-size: clamp(16px, calc(16px + (100vw - 1140px) * 1 / 300), 17px);
    line-height: clamp(26px, calc(26px + (100vw - 1140px) * 2 / 300), 28px);
}

/* Heart Section for screens from 993px to 1139px inclusive */
@media (min-width: 993px) and (max-width: 1139px) {
    .heart-section__title {
        font-size: clamp(40px, calc(40px + (100vw - 993px) * 8 / 146), 48px);
        line-height: clamp(48px, calc(48px + (100vw - 993px) * 8 / 146), 56px);
    }
}

/* Heart Section button for screens from 620px to 1139px inclusive - padding 32px */
@media (min-width: 620px) and (max-width: 1139px) {
    .heart-section .cta-button {
        padding-left: 32px;
        padding-right: 32px;
    }
}

/* Heart Section for screens from 620px to 668px inclusive */
@media (min-width: 620px) and (max-width: 668px) {
    .heart-section__title {
        font-size: 32px;
        line-height: 40px;
        flex-direction: column;
        gap: 0;
        align-items: center;
        text-align: center;
    }
    
    .heart-section__title-line1 {
        gap: 16px;
    }
    
    .heart-section__title-line2 {
        display: block;
    }
    
    .heart-section__icon {
        width: 56px;
        height: 56px;
    }
    
    .heart-section__text {
        font-size: 18px;
        line-height: 28px;
        text-align: center;
    }
}

/* Russian version: same layout as 668px for 620-778px */
@media (min-width: 620px) and (max-width: 778px) {
    body.lang-ru .heart-section__title {
        font-size: 32px !important;
        line-height: 40px !important;
        flex-direction: column !important;
        gap: 0 !important;
        align-items: center !important;
        text-align: center !important;
    }
    
    body.lang-ru .heart-section__title-line1 {
        gap: 16px !important;
    }
    
    body.lang-ru .heart-section__title-line2 {
        display: block !important;
    }
    
    body.lang-ru .heart-section__icon {
        width: 56px !important;
        height: 56px !important;
    }
    
    body.lang-ru .heart-section__text {
        font-size: 18px !important;
        line-height: 28px !important;
        text-align: center !important;
    }
}

/* Polish version: same layout as 668px for 669-678px (but keep font-size 40px/48px) */
@media (min-width: 669px) and (max-width: 678px) {
    body:not(.lang-en):not(.lang-uk):not(.lang-ru) .heart-section__title {
        flex-direction: column !important;
        gap: 0 !important;
        align-items: center !important;
        text-align: center !important;
    }
    
    body:not(.lang-en):not(.lang-uk):not(.lang-ru) .heart-section__title-line1 {
        gap: 16px !important;
    }
    
    body:not(.lang-en):not(.lang-uk):not(.lang-ru) .heart-section__title-line2 {
        display: block !important;
    }
    
    body:not(.lang-en):not(.lang-uk):not(.lang-ru) .heart-section__icon {
        width: 56px !important;
        height: 56px !important;
    }
    
    body:not(.lang-en):not(.lang-uk):not(.lang-ru) .heart-section__text {
        text-align: center !important;
    }
}

/* Ukrainian version: same layout as 668px for 669-802px */
@media (min-width: 669px) and (max-width: 802px) {
    body.lang-uk .heart-section__title {
        font-size: 40px !important;
        line-height: 56px !important;
        flex-direction: column !important;
        gap: 0 !important;
        align-items: center !important;
        text-align: center !important;
    }
    
    body.lang-uk .heart-section__title-line1 {
        gap: 16px !important;
    }
    
    body.lang-uk .heart-section__title-line2 {
        display: block !important;
    }
    
    body.lang-uk .heart-section__icon {
        width: 56px !important;
        height: 56px !important;
    }
    
    body.lang-uk .heart-section__text {
        font-size: 18px !important;
        line-height: 28px !important;
        text-align: center !important;
    }
}

/* Heart Section for screens from 669px to 992px inclusive */
@media (min-width: 620px) and (max-width: 992px) {
    .heart-section__title {
        font-size: 40px;
        line-height: 48px;
    }
    
    .heart-section .cta-button {
        height: 62px;
    }
}

/* English version: same layout as 668px for 669-699px (but keep font-size 40px/48px) */
@media (min-width: 669px) and (max-width: 699px) {
    body.lang-en .heart-section__title {
        flex-direction: column !important;
        gap: 0 !important;
        align-items: center !important;
        text-align: center !important;
    }
    
    body.lang-en .heart-section__title-line1 {
        gap: 16px !important;
    }
    
    body.lang-en .heart-section__title-line2 {
        display: block !important;
    }
    
    body.lang-en .heart-section__icon {
        width: 56px !important;
        height: 56px !important;
    }
    
    body.lang-en .heart-section__text {
        text-align: center !important;
    }
}

/* English version: same layout as 699px for 700-710px */
@media (min-width: 700px) and (max-width: 710px) {
    body.lang-en .heart-section__title {
        flex-direction: column !important;
        gap: 0 !important;
        align-items: center !important;
        text-align: center !important;
    }
    
    body.lang-en .heart-section__title-line1 {
        gap: 16px !important;
    }
    
    body.lang-en .heart-section__title-line2 {
        display: block !important;
    }
    
    body.lang-en .heart-section__icon {
        width: 56px !important;
        height: 56px !important;
    }
    
    body.lang-en .heart-section__text {
        text-align: center !important;
    }
}

/* Heart Section text for screens from 668px to 1139px inclusive */
@media (min-width: 668px) and (max-width: 1139px) {
    .heart-section__text {
        font-size: 18px;
        line-height: 28px;
    }
}

/* Heart Section for screens from 414px to 479px inclusive */
@media (min-width: 414px) and (max-width: 479px) {
    .heart-section {
        padding-top: 40px;
        padding-bottom: 40px;
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .heart-section__container {
        gap: 32px;
        max-width: 100%;
        width: 100%;
        align-items: flex-start;
    }
    
    .heart-section__title {
        font-size: 28px;
        line-height: 40px;
        flex-direction: column;
        gap: 0;
        align-items: flex-start;
        text-align: left;
    }
    
    .heart-section__title-line1 {
        gap: 16px;
    }
    
    .heart-section__title-line2 {
        display: block;
    }
    
    .heart-section__icon {
        width: 56px;
        height: 56px;
    }
    
    .heart-section__text {
        font-size: 16px;
        line-height: 24px;
        width: 100%;
        text-align: left;
    }
    
    .heart-section .cta-button {
        align-self: center;
    }
    
    .heart-section__text-all {
        display: none;
    }
    
    .heart-section__text-br-414-473 {
        display: inline;
    }
    
    .heart-section__text-br-desktop {
        display: none;
    }
    
    .heart-section__text-br-mobile {
        display: none !important;
    }
    
    /* Hide Polish breaks for Ukrainian and Russian on ≤479px */
    body.lang-uk .heart-section__text-br-414-473,
    body.lang-ru .heart-section__text-br-414-473 {
        display: none;
    }
    
    /* English version: different line breaks for 414-479px */
    body.lang-en .heart-section__text-br-414-473 {
        display: none;
    }
    
    body.lang-en .heart-section__text-br-desktop {
        display: none;
    }
    
}

/* Polish version: same layout as 479px for 480-487px */
@media (min-width: 480px) and (max-width: 487px) {
    body:not(.lang-en):not(.lang-uk):not(.lang-ru) .heart-section {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    
    body:not(.lang-en):not(.lang-uk):not(.lang-ru) .heart-section__container {
        gap: 32px !important;
        max-width: 100% !important;
        width: 100% !important;
        align-items: flex-start !important;
    }
    
    body:not(.lang-en):not(.lang-uk):not(.lang-ru) .heart-section__title {
        font-size: 28px !important;
        line-height: 40px !important;
        flex-direction: column !important;
        gap: 0 !important;
        align-items: flex-start !important;
        text-align: left !important;
    }
    
    body:not(.lang-en):not(.lang-uk):not(.lang-ru) .heart-section__title-line1 {
        gap: 16px !important;
    }
    
    body:not(.lang-en):not(.lang-uk):not(.lang-ru) .heart-section__title-line2 {
        display: block !important;
    }
    
    body:not(.lang-en):not(.lang-uk):not(.lang-ru) .heart-section__icon {
        width: 56px !important;
        height: 56px !important;
    }
    
    body:not(.lang-en):not(.lang-uk):not(.lang-ru) .heart-section__text {
        font-size: 16px !important;
        line-height: 24px !important;
        width: 100% !important;
        text-align: left !important;
    }
    
    body:not(.lang-en):not(.lang-uk):not(.lang-ru) .heart-section .cta-button {
        align-self: center !important;
    }
}

/* English version: same layout as 414-479px for 414-502px */
@media (min-width: 414px) and (max-width: 502px) {
    body.lang-en .heart-section__container {
        align-items: flex-start !important;
    }
    
    body.lang-en .heart-section__title {
        font-size: 28px !important;
        line-height: 40px !important;
        flex-direction: column !important;
        gap: 0 !important;
        align-items: flex-start !important;
        text-align: left !important;
    }
    
    body.lang-en .heart-section__title-line1 {
        gap: 16px !important;
    }
    
    body.lang-en .heart-section__title-line2 {
        display: block !important;
    }
    
    body.lang-en .heart-section__icon {
        width: 56px !important;
        height: 56px !important;
    }
    
    body.lang-en .heart-section__text {
        font-size: 16px !important;
        line-height: 24px !important;
        width: 100% !important;
        text-align: left !important;
    }
    
    body.lang-en .heart-section .cta-button {
        align-self: center !important;
    }
}

/* English version: same layout as 502px for 503-510px */
@media (min-width: 503px) and (max-width: 510px) {
    body.lang-en .heart-section__container {
        align-items: flex-start !important;
    }
    
    body.lang-en .heart-section__title {
        font-size: 28px !important;
        line-height: 40px !important;
        flex-direction: column !important;
        gap: 0 !important;
        align-items: flex-start !important;
        text-align: left !important;
    }
    
    body.lang-en .heart-section__title-line1 {
        gap: 16px !important;
    }
    
    body.lang-en .heart-section__title-line2 {
        display: block !important;
    }
    
    body.lang-en .heart-section__icon {
        width: 56px !important;
        height: 56px !important;
    }
    
    body.lang-en .heart-section__text {
        font-size: 16px !important;
        line-height: 24px !important;
        width: 100% !important;
        text-align: left !important;
    }
    
    body.lang-en .heart-section .cta-button {
        align-self: center !important;
    }
}

/* CTA Callout Section layout for 951px down to 620px */
@media (max-width: 951px) and (min-width: 620px) {
    .cta-callout-section .heart-section__container {
        align-items: center;
    }

    .cta-callout-section .heart-section__title {
        flex-direction: column;
        align-items: center;
        gap: 0;
        text-align: center;
    }

    .cta-callout-section .heart-section__title-line1 {
        gap: 16px;
    }

    .cta-callout-section .heart-section__title-line2 {
        display: block;
    }

    .cta-callout-section .heart-section__text {
        text-align: center;
        width: 100%;
    }
    
    /* Ensure line breaks work in cta-callout-section */
    .cta-callout-section .heart-section__text-br-desktop {
        display: inline !important;
    }
    
    .cta-callout-section .heart-section__text-br-mobile {
        display: none !important;
    }
}

/* CTA Callout Section layout for Russian version on 952-1186px (same layout as 951px) */
@media (min-width: 952px) and (max-width: 1186px) {
    body.lang-ru .cta-callout-section .heart-section__container {
        align-items: center;
    }

    body.lang-ru .cta-callout-section .heart-section__title {
        flex-direction: column;
        align-items: center;
        gap: 0;
        text-align: center;
    }

    body.lang-ru .cta-callout-section .heart-section__title-line1 {
        gap: 16px;
    }

    body.lang-ru .cta-callout-section .heart-section__title-line2 {
        display: block;
    }

    body.lang-ru .cta-callout-section .heart-section__text {
        text-align: center;
        width: 100%;
    }
    
    /* Ensure line breaks work in cta-callout-section */
    body.lang-ru .cta-callout-section .heart-section__text-br-desktop {
        display: inline !important;
    }
    
    body.lang-ru .cta-callout-section .heart-section__text-br-mobile {
        display: none !important;
    }
}

/* CTA Callout Section layout for 619px and below */
@media (max-width: 619px) {
    .cta-callout-section .heart-section__container {
        align-items: flex-start;
    }

    .cta-callout-section .heart-section__title {
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
        text-align: left;
    }

    .cta-callout-section .heart-section__title-line1 {
        gap: 16px;
    }

    .cta-callout-section .heart-section__title-line2 {
        display: block;
    }

    .cta-callout-section .heart-section__text {
        text-align: left;
        width: 100%;
    }

    .cta-callout-section .cta-button {
        align-self: center;
    }
}

/* Heart Section for screens <414px - viewport-based scaling */
@media (max-width: 413px) {
    .heart-section {
        padding-top: 9.66vw; /* 40px at 414px */
        padding-bottom: 9.66vw;
        padding-left: 4.83vw; /* 20px at 414px */
        padding-right: 4.83vw;
    }
    
    .heart-section__container {
        gap: 7.73vw; /* 32px at 414px */
        max-width: 100%;
        width: 100%;
        align-items: flex-start;
    }
    
    .heart-section__title {
        font-size: 6.76vw; /* 28px at 414px */
        line-height: 9.66vw; /* 40px at 414px */
        flex-direction: column;
        gap: 0;
        align-items: flex-start;
        text-align: left;
    }
    
    .heart-section__title-line1 {
        gap: 3.86vw; /* 16px at 414px */
    }
    
    .heart-section__title-line2 {
        display: block;
    }
    
    .heart-section__icon {
        width: 13.53vw; /* 56px at 414px */
        height: 13.53vw;
    }
    
    .heart-section__text {
        font-size: 3.86vw; /* 16px at 414px */
        line-height: 5.8vw; /* 24px at 414px */
        width: 100%;
        text-align: left;
    }
    
    .heart-section .cta-button {
        align-self: center;
        font-size: 3.86vw; /* 16px at 414px */
        line-height: 6.76vw; /* 28px at 414px */
        padding: 4.83vw 8.7vw; /* 20px 36px at 414px */
    }
    
    /* English version: same line breaks as on 414px for <414px */
    body.lang-en .heart-section__text-br-414-473 {
        display: none !important;
    }
    
    body.lang-en .heart-section__text-br-desktop {
        display: none !important;
    }
    
    
    /* Hide suffix in button text for Polish, Ukrainian and Russian versions - only in heart-section, on sizes <414px */
    body:not(.lang-en) .heart-section .cta-button__text-suffix {
        display: none;
    }
    
    .heart-section__text-all {
        display: none;
    }
    
    .heart-section__text-br-414-473 {
        display: none;
    }
    
    .heart-section__text-br-okolic {
        display: inline;
    }
    
    .heart-section__text-br-desktop {
        display: none;
    }
    
    .heart-section__text-br-mobile {
        display: none !important;
    }
}

/* Heart Section text break for okolic on screens ≤480px */
@media (max-width: 480px) {
    .heart-section__text-br-okolic {
        display: inline;
    }
}

/* Heart Section for screens from 480px to 619px inclusive */
@media (min-width: 480px) and (max-width: 619px) {
    .heart-section {
        padding-top: 40px;
        padding-bottom: 40px;
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .heart-section__container {
        gap: 32px;
    }
    
    .heart-section__title {
        font-size: 28px;
        line-height: 40px;
    }
    
    .heart-section__icon {
        width: 56px;
        height: 56px;
    }
    
    .heart-section__text {
        font-size: 16px;
        line-height: 24px;
    }
    
    .heart-section__text-all {
        display: none;
    }
}

/* Ukrainian version: same title layout as 479px for 480-574px */
@media (min-width: 480px) and (max-width: 574px) {
    body.lang-uk .heart-section__title {
        font-size: 28px !important;
        line-height: 40px !important;
        flex-direction: column !important;
        gap: 0 !important;
        align-items: flex-start !important;
        text-align: left !important;
    }
    
    body.lang-uk .heart-section__title-line1 {
        gap: 16px !important;
    }
    
    body.lang-uk .heart-section__title-line2 {
        display: block !important;
        text-align: center !important;
        width: 100% !important;
        align-self: center !important;
    }
    
    body.lang-uk .heart-section__icon {
        width: 56px !important;
        height: 56px !important;
    }
}

/* Hide suffix for English in heart-section - always hidden for all screen sizes */
body.lang-en .heart-section .cta-button__text-suffix {
    display: none !important;
}

/* Heart Section button for screens 414px-619px - same as benefit-section */
@media (min-width: 414px) and (max-width: 619px) {
    .heart-section .cta-button {
        font-size: 16px;
        line-height: 28px;
        padding: 20px 36px;
        height: 68px;
    }
    
    /* Hide suffix in button text for Polish, Ukrainian and Russian versions - only in heart-section, on specific sizes */
    body:not(.lang-en) .heart-section .cta-button__text-suffix {
        display: none;
    }
    
    .heart-section__text-all {
        display: none;
    }
    
    .heart-section__text-br-desktop {
        display: none;
    }
    
    .heart-section__text-br-mobile {
        display: inline;
    }
}

/* Heart Section text line breaks for screens >619px */
@media (min-width: 620px) {
    .heart-section__text-br-desktop {
        display: inline;
    }
    
    .heart-section__text-br-mobile {
        display: none;
    }
    
    .heart-section__text-br-414-473 {
        display: none;
    }
    
    /* English version: different line breaks */
    body.lang-en .heart-section__text-br-desktop {
        display: none;
    }
    
    body.lang-en .heart-section__text-br-414-473 {
        display: none;
    }
    
    /* Hide line break after "предлагая" in Russian CTA callout text on 620-694px */
    @media (min-width: 620px) and (max-width: 694px) {
        body.lang-ru .cta-callout-section .heart-section__text-br-desktop {
            display: none !important;
        }
    }
}

/* Heart Section text line breaks for screens 480px-619px */
@media (min-width: 480px) and (max-width: 619px) {
    .heart-section__text-br-414-473 {
        display: none;
    }
    
    /* Russian version: line break after "модели" for 500-619px */
    
    
    /* Russian version: line breaks for 414-499px */
    
    
    /* Russian version: same title layout as 479px for 480-577px */
    @media (min-width: 480px) and (max-width: 577px) {
        body.lang-ru .heart-section__container {
            gap: 32px !important;
            max-width: 100% !important;
            width: 100% !important;
            align-items: flex-start !important;
        }
        
        body.lang-ru .heart-section__title {
            font-size: 28px !important;
            line-height: 40px !important;
            flex-direction: column !important;
            gap: 0 !important;
            align-items: flex-start !important;
            text-align: left !important;
        }
        
        body.lang-ru .heart-section__title-line1 {
            gap: 16px !important;
        }
        
        body.lang-ru .heart-section__title-line2 {
            display: block !important;
        }
        
        body.lang-ru .heart-section__icon {
            width: 56px !important;
            height: 56px !important;
        }
        
        body.lang-ru .heart-section__text {
            font-size: 16px !important;
            line-height: 24px !important;
            width: 100% !important;
            text-align: left !important;
        }
        
        body.lang-ru .heart-section .cta-button {
            align-self: center !important;
        }
    }
    
    /* Russian version: center alignment for 500-577px */
    @media (min-width: 500px) and (max-width: 577px) {
        body.lang-ru .heart-section__container {
            align-items: center !important;
        }
        
        body.lang-ru .heart-section__title {
            align-items: center !important;
            text-align: center !important;
        }
        
        body.lang-ru .heart-section__text {
            text-align: center !important;
        }
    }
}

/* Footer */
.footer {
    background: #ffffff;
    padding: 80px 48px 32px;
}

.footer__container {
    max-width: 1344px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
}

.footer__logo {
    display: block;
    text-decoration: none;
}

.footer__logo:hover {
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

.footer__logo-img {
    width: 210px;
    height: 32px;
    display: block;
}

.footer__menu {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 12px;
    background: transparent;
    flex-wrap: wrap;
    position: relative;
}

.footer__menu-link {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
    color: #141000;
    text-decoration: none;
    padding: 10px 24px;
    border-radius: 9999px;
    position: relative;
    z-index: 1;
}

/* Use Noto Sans for Ukrainian and Russian languages in footer menu */
body.lang-uk .footer__menu-link[data-i18n],
body.lang-ru .footer__menu-link[data-i18n] {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14.5px;
}

.footer__menu-divider {
    width: 0;
    height: 12px;
    border-left: 1px solid rgba(20, 16, 0, 0.2);
    display: block;
}

.footer__menu-indicator {
    position: absolute;
    background: var(--color-menu-active);
    border-radius: 9999px;
    opacity: 0;
    transform: scale(0);
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
    pointer-events: none;
    z-index: 0;
}

.footer__menu-indicator.first-hover {
    transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
    transform: scale(1) !important;
}

.footer__menu-indicator.sliding {
    transition: left 0.5s cubic-bezier(0.25, 0.8, 0.25, 1),
                top 0.5s cubic-bezier(0.25, 0.8, 0.25, 1),
                width 0.5s cubic-bezier(0.25, 0.8, 0.25, 1),
                height 0.5s cubic-bezier(0.25, 0.8, 0.25, 1),
                opacity 0.3s ease;
    transform: scale(1);
}

.footer__bottom {
    width: 100%;
    padding-top: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    position: relative;
}

.footer__copyright {
    margin: 0;
    font-family: 'Sora', sans-serif;
    font-size: 14px;
    line-height: 18px;
    color: #717680;
}

/* Ensure Ukrainian and Russian footer copyright and links use Sora font and same size as English */
body.lang-uk .footer__copyright,
body.lang-ru .footer__copyright,
body.lang-uk .footer__link,
body.lang-ru .footer__link {
    font-family: 'Sora', sans-serif;
    font-size: 14px;
}

.footer__links {
    display: flex;
    align-items: center;
    gap: 24px;
    font-family: 'Sora', sans-serif;
    font-size: 14px;
    line-height: 18px;
    color: #717680;
}

.footer__link {
    text-decoration: none;
    color: inherit;
    transition: color 0.2s ease;
}

.footer__link:hover {
    color: #141000;
}

.footer__links-divider {
    color: #C5C7CD;
}

.footer__bottom::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    width: 100vw;
    height: 1px;
    background: #E9EAEB;
    transform: translateX(-50%);
}

@media (max-width: 737px) {
    .footer {
        padding: 64px 40px 40px;
    }

    .footer__container {
        align-items: flex-start;
    }

    .footer__menu {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: center;
        justify-items: flex-start;
        gap: 16px 24px;
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }

    .footer__menu-link {
        padding-left: 0;
        padding-right: 0;
        font-size: 14px;
        line-height: 22px;
    }
    
    /* Ukrainian and Russian footer menu: font size +0.5px */
    body.lang-uk .footer__menu-link[data-i18n],
    body.lang-ru .footer__menu-link[data-i18n] {
        font-size: 14.5px;
    }

    .footer__menu-link::after {
        display: none;
    }

    .footer__menu-link:active {
        font-weight: 500;
    }

    .footer__menu-indicator,
    .footer__menu-indicator.first-hover,
    .footer__menu-indicator.sliding {
        display: none !important;
        opacity: 0 !important;
        transform: scale(0) !important;
        visibility: hidden !important;
    }

    .footer__menu-divider {
        display: none;
    }

    .footer__bottom {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* Disable hover effects on touch devices for footer menu */
@media (hover: none) and (pointer: coarse) {
    .footer__menu-indicator,
    .footer__menu-indicator.first-hover,
    .footer__menu-indicator.sliding {
        display: none !important;
        opacity: 0 !important;
        transform: scale(0) !important;
        visibility: hidden !important;
    }
}

@media (max-width: 619px) {
    .footer {
        padding: 64px 20px 40px;
    }
}

@media (max-width: 440px) {
    .footer__menu-link {
        padding-top: 4px;
        padding-bottom: 4px;
    }
}

@media (max-width: 414px) {
    .footer {
        padding: 64px 20px 40px;
    }

    .footer__container {
        gap: 32px;
    }

    .footer__logo-img {
        width: 210px;
        height: 32px;
    }

    .footer__menu {
        gap: 16px 24px;
        padding: 8px 0;
    }

    .footer__menu-link {
        padding-top: 4px;
        padding-bottom: 4px;
        font-size: 14px;
        line-height: 22px;
    }
    
    /* Ukrainian and Russian footer menu: font size +0.5px */
    body.lang-uk .footer__menu-link[data-i18n],
    body.lang-ru .footer__menu-link[data-i18n] {
        font-size: 14.5px;
    }

    .footer__bottom {
        padding-top: 32px;
        gap: 24px;
    }

    .footer__copyright {
        font-size: 14px;
        line-height: 18px;
    }
    
    /* Ukrainian and Russian footer copyright and links: same size as English */
    body.lang-uk .footer__copyright,
    body.lang-ru .footer__copyright,
    body.lang-uk .footer__link,
    body.lang-ru .footer__link {
        font-size: 14px;
    }

    .footer__links {
        gap: 24px;
        font-size: 14px;
        line-height: 18px;
    }
}

@media (max-width: 413px) {
    .footer {
        padding: 15.50vw 4.83vw 9.66vw; /* 64px 20px 40px at 414px */
    }

    .footer__container {
        gap: 7.73vw; /* 32px at 414px */
    }

    .footer__logo-img {
        width: 50.72vw; /* 210px at 414px */
        height: 7.73vw; /* 32px at 414px */
    }

    .footer__menu {
        gap: 3.86vw 5.80vw; /* 16px 24px at 414px */
        padding: 1.93vw 0; /* 8px 0 at 414px */
    }

    .footer__menu-link {
        padding-top: 0.97vw; /* 4px at 414px */
        padding-bottom: 0.97vw; /* 4px at 414px */
        font-size: 3.38vw; /* 14px at 414px */
        line-height: 5.31vw; /* 22px at 414px */
    }
    
    /* Ukrainian and Russian footer menu: font size +0.5px (3.62vw at 414px) */
    body.lang-uk .footer__menu-link[data-i18n],
    body.lang-ru .footer__menu-link[data-i18n] {
        font-size: 3.62vw; /* 14.5px at 414px */
    }

    .footer__bottom {
        padding-top: 7.73vw; /* 32px at 414px */
        gap: 5.80vw; /* 24px at 414px */
    }

    .footer__copyright {
        font-size: 3.38vw; /* 14px at 414px */
        line-height: 4.35vw; /* 18px at 414px */
    }
    
    /* Ukrainian and Russian footer copyright and links: same size as English (3.38vw at 414px) */
    body.lang-uk .footer__copyright,
    body.lang-ru .footer__copyright,
    body.lang-uk .footer__link,
    body.lang-ru .footer__link {
        font-size: 3.38vw; /* 14px at 414px */
    }

    .footer__links {
        gap: 5.80vw; /* 24px at 414px */
        font-size: 3.38vw; /* 14px at 414px */
        line-height: 4.35vw; /* 18px at 414px */
    }
}

/* Delivery Area Section */
.delivery-area-section {
    padding-top: clamp(64px, calc(64px + (100vw - 1140px) * 16 / 300), 80px);
    padding-bottom: clamp(64px, calc(64px + (100vw - 1140px) * 16 / 300), 80px);
    padding-left: clamp(40px, calc(40px + (100vw - 1140px) * 8 / 300), 48px);
    padding-right: clamp(40px, calc(40px + (100vw - 1140px) * 8 / 300), 48px);
}

.delivery-area-container {
    max-width: 1440px;
    margin: 0 auto;
}

.delivery-area {
    background-color: #f9fafa;
    border-radius: 24px;
    padding-top: calc(var(--delivery-area-vw) * 0.038889);
    padding-right: calc(var(--delivery-area-vw) * 0.063889);
    padding-bottom: calc(var(--delivery-area-vw) * 0.05);
    padding-left: calc(var(--delivery-area-vw) * 0.063889);
    display: flex;
    gap: calc(var(--delivery-area-vw) * 0.159028);
    align-items: center;
    position: relative;
}

.delivery-area__content {
    display: flex;
    flex-direction: column;
    gap: calc(var(--delivery-area-vw) * 0.027778);
    width: calc(var(--delivery-area-vw) * 0.324306);
}

.delivery-area__heading {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: calc(var(--delivery-area-vw) * 0.315972);
}

.delivery-area__location {
    display: flex;
    gap: calc(var(--delivery-area-vw) * 0.011111);
    align-items: center;
}

.delivery-area__title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: calc(var(--delivery-area-vw) * 0.038889);
    line-height: calc(var(--delivery-area-vw) * 0.05);
    color: #141000;
    margin: 0;
}

.delivery-area__icon {
    width: calc(var(--delivery-area-vw) * 0.044444);
    height: calc(var(--delivery-area-vw) * 0.044444);
    display: block;
    flex-shrink: 0;
}

.delivery-area__subtitle {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: calc(var(--delivery-area-vw) * 0.029167);
    line-height: calc(var(--delivery-area-vw) * 0.033333);
    color: #141000;
    margin: 0;
}

/* English version: prevent text wrapping for subtitle */
body.lang-en .delivery-area__subtitle {
    white-space: nowrap !important;
    min-width: max-content !important;
}

/* Ukrainian and Russian versions: prevent text wrapping for subtitle */
body.lang-uk .delivery-area__subtitle,
body.lang-ru .delivery-area__subtitle {
    white-space: nowrap !important;
    min-width: max-content !important;
}

/* Russian version: allow line break on ≤446px */
@media (max-width: 446px) {
    body.lang-ru .delivery-area__subtitle {
        white-space: normal !important;
    }
    
    body.lang-ru .delivery-area__subtitle-br-ru-446 {
        display: inline !important;
    }
}

/* Hide line break for Russian version on >446px */
@media (min-width: 447px) {
    body.lang-ru .delivery-area__subtitle-br-ru-446 {
        display: none !important;
    }
}

/* Russian version: line break after "город" for 415-1139px */
@media (min-width: 415px) and (max-width: 1139px) {
    body.lang-ru .delivery-area__description-br-ru-415-1139 {
        display: inline !important;
    }
    
    /* Remove space before break on these sizes */
    body.lang-ru .delivery-area__description-br-ru-415-1139::before {
        content: '';
    }
}

/* Hide line break for Russian version outside 415-1139px */
@media (max-width: 414px),
       (min-width: 1140px) {
    body.lang-ru .delivery-area__description-br-ru-415-1139 {
        display: none !important;
    }
}

/* Ukrainian version: line break after "місто" for ≤426px */
@media (max-width: 426px) {
    body.lang-uk .delivery-area__description-br-uk-426 {
        display: inline !important;
    }
    
    /* No space before "є" when break is active (≤426px) */
    body.lang-uk .delivery-area__description-space-uk-426::before {
        content: '' !important;
    }
}

/* Hide line break for Ukrainian version on >426px */
@media (min-width: 427px) {
    body.lang-uk .delivery-area__description-br-uk-426 {
        display: none !important;
    }
    
    /* Add space before "є" when break is hidden (>426px) */
    body.lang-uk .delivery-area__description-space-uk-426::before {
        content: ' ' !important;
    }
}

/* Ukrainian and Russian versions: replace Sora font with Noto Sans for delivery area */
body.lang-uk .delivery-area__description,
body.lang-ru .delivery-area__description,
body.lang-uk .delivery-area__city-label,
body.lang-ru .delivery-area__city-label,
body.lang-uk .delivery-area__radius-label,
body.lang-ru .delivery-area__radius-label {
    font-family: 'Noto Sans', sans-serif !important;
}

.delivery-area__description-search {
    display: flex;
    flex-direction: column;
    gap: calc(var(--delivery-area-vw) * 0.022222);
    width: 100%;
}

.delivery-area__description {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: calc(var(--delivery-area-vw) * 0.0125);
    line-height: calc(var(--delivery-area-vw) * 0.019444);
    color: #141000;
    margin: 0;
    white-space: pre-wrap;
}

.delivery-area__visual {
    position: relative;
    flex-shrink: 0;
    width: calc(var(--delivery-area-vw) * 0.291667);
    height: calc(var(--delivery-area-vw) * 0.291667);
}

.delivery-area__map {
    position: relative;
    width: 100%;
    height: 100%;
}

@keyframes mapPulse {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(0.92);
    }
}

.delivery-area__map-outer {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    transform-origin: center center;
    animation: mapPulse 3s ease-in-out infinite;
}

.delivery-area__map-inner {
    position: absolute;
    width: 101.42%;
    height: 101.42%;
    top: -0.71%;
    left: -0.71%;
    z-index: 2;
    transform-origin: center center;
    animation: mapPulse 3s ease-in-out infinite;
}

.delivery-area__city-label {
    position: absolute;
    background-color: white;
    border: 1px solid #141000;
    border-radius: 9999px;
    padding: calc(var(--delivery-area-vw) * 0.006944) calc(var(--delivery-area-vw) * 0.016667);
    font-family: 'Sora', sans-serif;
    font-weight: 500;
    font-size: calc(var(--delivery-area-vw) * 0.0125);
    line-height: calc(var(--delivery-area-vw) * 0.019444);
    color: #141000;
    left: calc(var(--delivery-area-vw) * 0.095139);
    top: calc(var(--delivery-area-vw) * 0.168056);
    width: calc(var(--delivery-area-vw) * 0.102778);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(var(--delivery-area-vw) * 0.005556);
    z-index: 3;
}

.delivery-area__radius-label {
    position: absolute;
    background-color: white;
    border: 1px solid #141000;
    border-radius: 9999px;
    padding: calc(var(--delivery-area-vw) * 0.00625) calc(var(--delivery-area-vw) * 0.0125) calc(var(--delivery-area-vw) * 0.004861);
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: calc(var(--delivery-area-vw) * 0.011111);
    line-height: calc(var(--delivery-area-vw) * 0.016667);
    color: #141000;
    left: calc(var(--delivery-area-vw) * 0.258333);
    top: calc(var(--delivery-area-vw) * 0.13125);
    width: calc(var(--delivery-area-vw) * 0.063889);
    height: calc(var(--delivery-area-vw) * 0.029167);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(var(--delivery-area-vw) * 0.005556);
    z-index: 3;
    transform-origin: calc(210px - 372px) calc(210px - 189px);
    animation: mapPulse 3s ease-in-out infinite;
}

.delivery-area__center-point {
    position: absolute;
    left: calc(var(--delivery-area-vw) * 0.116667);
    top: calc(var(--delivery-area-vw) * 0.101389);
    width: calc(var(--delivery-area-vw) * 0.058333);
    height: calc(var(--delivery-area-vw) * 0.058333);
    z-index: 4;
}

@keyframes pulseWave {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.16;
    }
    50% {
        opacity: 0.08;
    }
    100% {
        transform: translate(-50%, -50%) scale(2);
        opacity: 0;
    }
}

@keyframes pulseWaveMedium {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.5;
    }
    50% {
        opacity: 0.25;
    }
    100% {
        transform: translate(-50%, -50%) scale(2);
        opacity: 0;
    }
}

.delivery-area__center-circle {
    position: absolute;
    background-color: #c4dfff;
    border-radius: 50px;
}

.delivery-area__center-circle--low {
    width: calc(var(--delivery-area-vw) * 0.058333);
    height: calc(var(--delivery-area-vw) * 0.058333);
    opacity: 0.16;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    animation: pulseWave 2s ease-out infinite;
}

.delivery-area__center-circle--medium {
    width: calc(var(--delivery-area-vw) * 0.038889);
    height: calc(var(--delivery-area-vw) * 0.038889);
    opacity: 0.5;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    animation: pulseWaveMedium 2s ease-out infinite 0.3s;
}

.delivery-area__center-circle--high {
    width: calc(var(--delivery-area-vw) * 0.019444);
    height: calc(var(--delivery-area-vw) * 0.019444);
    border: 2px solid #141000;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
    position: relative;
}

@keyframes wavePulse {
    0% {
        transform: translate(-50%, -50%) scale(0.8);
        opacity: 0.6;
    }
    100% {
        transform: translate(-50%, -50%) scale(2.5);
        opacity: 0;
    }
}

.delivery-area__wave {
    position: absolute;
    left: 50%;
    top: 50%;
    width: calc(var(--delivery-area-vw) * 0.019444);
    height: calc(var(--delivery-area-vw) * 0.019444);
    border: 2px solid #c4dfff;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    animation: wavePulse 2s ease-out infinite;
}

.delivery-area__wave--1 {
    animation-delay: 0s;
}

.delivery-area__wave--2 {
    animation-delay: 0.7s;
}

.delivery-area__wave--3 {
    animation-delay: 1.4s;
}

@media (max-width: 1139px) and (min-width: 993px) {
    .delivery-area {
        padding-top: 56px;
        padding-bottom: clamp(56px, calc(56px + (100vw - 993px) * 8 / 146), 64px);
        padding-left: clamp(48px, calc(48px + (100vw - 993px) * 16 / 146), 64px);
        padding-right: clamp(24px, calc(24px + (100vw - 993px) * 8 / 146), 32px);
        gap: clamp(48px, calc(48px + (100vw - 993px) * 80 / 146), 128px);
    }

    .delivery-area__content {
        gap: clamp(32px, calc(32px + (100vw - 993px) * 8 / 146), 40px);
        width: clamp(374px, calc(374px + (100vw - 993px) * 46 / 146), 420px);
    }

    .delivery-area__heading {
        width: clamp(374px, calc(374px + (100vw - 993px) * 46 / 146), 420px);
        gap: clamp(8px, calc(8px + (100vw - 993px) * 8 / 146), 16px);
    }

    .delivery-area__description-search {
        gap: 32px;
        width: 100%;
    }

    .delivery-area__description {
        width: clamp(374px, calc(374px + (100vw - 993px) * 46 / 146), 420px);
    }

    .delivery-area__title {
        font-size: clamp(40px, calc(40px + (100vw - 993px) * 8 / 146), 48px);
        line-height: clamp(48px, calc(48px + (100vw - 993px) * 8 / 146), 56px);
    }

    .delivery-area__subtitle {
        font-size: clamp(32px, calc(32px + (100vw - 993px) * 4 / 146), 36px);
        line-height: clamp(40px, calc(40px + (100vw - 993px) * 4 / 146), 44px);
    }

    .delivery-area__description {
        font-size: clamp(16px, calc(16px + (100vw - 993px) * 2 / 146), 18px);
        line-height: clamp(24px, calc(24px + (100vw - 993px) * 4 / 146), 28px);
    }

    .delivery-area__visual {
        width: clamp(343.966px, calc(343.966px + (100vw - 993px) * 18.103 / 146), 362.069px);
        height: clamp(343.966px, calc(343.966px + (100vw - 993px) * 18.103 / 146), 362.069px);
    }

    .delivery-area__city-label {
        left: clamp(112.2px, calc(112.2px + (100vw - 993px) * 5.9 / 146), 118.1px);
        top: clamp(198.19px, calc(198.19px + (100vw - 993px) * 10.43 / 146), 208.62px);
        width: clamp(121.207px, calc(121.207px + (100vw - 993px) * 6.379 / 146), 127.586px);
        height: clamp(39.31px, calc(39.31px + (100vw - 993px) * 2.069 / 146), 41.379px);
        padding: clamp(8.19px, calc(8.19px + (100vw - 993px) * 0.431 / 146), 8.621px) clamp(19.655px, calc(19.655px + (100vw - 993px) * 1.035 / 146), 20.69px);
        font-size: clamp(14.741px, calc(14.741px + (100vw - 993px) * 0.776 / 146), 15.517px);
        line-height: clamp(22.931px, calc(22.931px + (100vw - 993px) * 1.207 / 146), 24.138px);
    }

    .delivery-area__radius-label {
        left: clamp(304.65px, calc(304.65px + (100vw - 993px) * 16.04 / 146), 320.69px);
        top: clamp(154.78px, calc(154.78px + (100vw - 993px) * 8.15 / 146), 162.93px);
        width: clamp(75.345px, calc(75.345px + (100vw - 993px) * 3.965 / 146), 79.31px);
        height: clamp(34.397px, calc(34.397px + (100vw - 993px) * 1.81 / 146), 36.207px);
        padding: clamp(7.371px, calc(7.371px + (100vw - 993px) * 0.388 / 146), 7.759px) clamp(14.741px, calc(14.741px + (100vw - 993px) * 0.776 / 146), 15.517px) clamp(5.733px, calc(5.733px + (100vw - 993px) * 0.301 / 146), 6.034px);
        font-size: clamp(13.103px, calc(13.103px + (100vw - 993px) * 0.69 / 146), 13.793px);
        line-height: clamp(19.655px, calc(19.655px + (100vw - 993px) * 1.035 / 146), 20.69px);
    }

    .delivery-area__center-point {
        left: clamp(137.59px, calc(137.59px + (100vw - 993px) * 7.24 / 146), 144.83px);
        top: clamp(119.57px, calc(119.57px + (100vw - 993px) * 6.29 / 146), 125.86px);
        width: clamp(68.793px, calc(68.793px + (100vw - 993px) * 3.621 / 146), 72.414px);
        height: clamp(68.793px, calc(68.793px + (100vw - 993px) * 3.621 / 146), 72.414px);
    }

    .delivery-area__center-circle--low {
        width: clamp(68.793px, calc(68.793px + (100vw - 993px) * 3.621 / 146), 72.414px);
        height: clamp(68.793px, calc(68.793px + (100vw - 993px) * 3.621 / 146), 72.414px);
    }

    .delivery-area__center-circle--medium {
        width: clamp(45.862px, calc(45.862px + (100vw - 993px) * 2.414 / 146), 48.276px);
        height: clamp(45.862px, calc(45.862px + (100vw - 993px) * 2.414 / 146), 48.276px);
    }

    .delivery-area__center-circle--high,
    .delivery-area__wave {
        width: clamp(22.931px, calc(22.931px + (100vw - 993px) * 1.207 / 146), 24.138px);
        height: clamp(22.931px, calc(22.931px + (100vw - 993px) * 1.207 / 146), 24.138px);
    }

    .delivery-area__toast {
        right: 28px;
        bottom: 28px;
        gap: 56px;
        padding: 20px 24px 20px 20px;
        min-width: 360px;
    }

    .delivery-area__toast-main {
        gap: 16px;
    }

    .delivery-area__toast-icon-bg,
    .delivery-area__toast-icon {
        width: 64px;
        height: 64px;
    }

    .delivery-area__toast-title {
        font-size: 18px;
        line-height: 24px;
    }

    .delivery-area__toast-subtitle {
        font-size: 14px;
        line-height: 18px;
    }
}

@media (max-width: 919px) {
    .delivery-area {
        flex-direction: column;
        align-items: center;
        gap: 56px;
    }
}

@media (max-width: 619px) {
    .delivery-area-section {
        padding: 40px 20px;
    }

    .delivery-area {
        padding: 48px;
        gap: 48px;
        background-color: #F4F8F8;
    }

    .delivery-area__content {
        gap: 24px;
        width: 100%;
    }

    .delivery-area__heading {
        gap: 4px;
        width: 100%;
    }

    .delivery-area__location {
        gap: 16px;
    }

    .delivery-area__title {
        font-size: 28px;
        line-height: 40px;
    }

    .delivery-area__icon {
        width: 56px;
        height: 56px;
    }

    .delivery-area__subtitle {
        font-size: 24px;
        line-height: 32px;
    }

    .delivery-area__description-search {
        gap: 32px;
        width: 100%;
    }

    .delivery-area__description {
        font-size: 16px;
        line-height: 24px;
        width: 374px;
    }

    .delivery-area__search-wrapper {
        width: 100%;
    }

    .delivery-area__search {
        padding: 14px 20px;
        border-width: 2px;
        width: 100%;
    }

    .delivery-area__search-input {
        font-size: 16px;
        line-height: 24px;
    }

    .delivery-area__search-icon-img svg path {
        stroke-width: 2;
    }

    .delivery-area__visual {
        width: 343.966px;
        height: 343.966px;
        margin: 0 auto;
    }

    .delivery-area {
        flex-direction: column;
        position: relative;
    }

    .delivery-area__toast {
        position: absolute;
        right: 12px;
        bottom: 12px;
        left: 12px;
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
        padding: 20px;
        width: auto;
        min-width: auto;
        max-width: none;
    }

    .delivery-area__toast-main {
        flex-direction: column;
        align-items: center;
        gap: 12px;
    }

    .delivery-area__toast-icon-bg,
    .delivery-area__toast-icon {
        width: 64px;
        height: 64px;
    }

    .delivery-area__toast-message {
        text-align: center;
    }

    .delivery-area__toast-actions {
        width: 100%;
    }

    .delivery-area__toast .cta-button {
        width: 100%;
    }
}

@media (max-width: 512px) {
    .delivery-area {
        padding: 24px;
        gap: 40px;
    }

    .delivery-area__content {
        gap: 16px;
    }

    .delivery-area__heading {
        gap: 2px;
    }

    .delivery-area__description-search {
        gap: 32px;
    }
}

@media (max-width: 460px) {
    .delivery-area__description {
        width: 100%;
    }
}

@media (min-width: 414px) and (max-width: 480px) {
    .delivery-area__visual {
        width: 326px;
        height: 326px;
        margin: 0 auto;
    }

    .delivery-area__city-label {
        left: 106.4px;
        top: 187.9px;
    }

    .delivery-area__radius-label {
        left: 288.8px;
        top: 146.7px;
    }

    .delivery-area__center-point {
        left: 130.4px;
        top: 113.4px;
    }

    .delivery-area__center-circle--low {
        width: 65px;
        height: 65px;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }

    .delivery-area__center-circle--medium {
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }

    .delivery-area__center-circle--high,
    .delivery-area__wave {
        left: 50%;
        top: 50%;
    }

    .delivery-area__toast-actions {
        width: 100%;
    }

    .delivery-area__toast .cta-button {
        display: block;
        width: 100% !important;
        box-sizing: border-box;
    }
}

@media (max-width: 992px) {
    .delivery-area {
        padding: 56px 48px;
        gap: 32px;
    }

    .delivery-area__content {
        gap: 32px;
        width: 374px;
    }

    .delivery-area__heading {
        width: 374px;
        gap: 8px;
    }

    .delivery-area__title {
        font-size: 40px;
        line-height: 48px;
    }

    .delivery-area__subtitle {
        font-size: 32px;
        line-height: 40px;
    }

    .delivery-area__description-search {
        gap: 32px;
    }

    .delivery-area__description,
    .delivery-area__search-wrapper {
        width: 374px;
    }

    .delivery-area__description {
        font-size: 16px;
        line-height: 24px;
    }

    .delivery-area__search {
        padding: 14px 20px;
    }

    .delivery-area__search-input {
        font-size: 16px;
        line-height: 24px;
    }

    .delivery-area__dropdown {
        padding: 14px 20px;
    }

    .delivery-area__dropdown-item {
        font-size: 16px;
        line-height: 24px;
    }

    .delivery-area__visual {
        width: 343.966px;
        height: 343.966px;
    }

    .delivery-area__city-label {
        left: 112.2px;
        top: 198.19px;
        width: 121.207px;
        height: 39.31px;
        padding: 8.19px 19.655px;
        font-size: 14.741px;
        line-height: 22.931px;
    }

    .delivery-area__radius-label {
        left: 304.65px;
        top: 154.78px;
        width: 75.345px;
        height: 34.397px;
        padding: 7.371px 14.741px 5.733px;
        font-size: 13.103px;
        line-height: 19.655px;
    }

    .delivery-area__center-point {
        left: 137.59px;
        top: 119.57px;
        width: 68.793px;
        height: 68.793px;
    }

    .delivery-area__center-circle--low {
        width: 68.793px;
        height: 68.793px;
    }

    .delivery-area__center-circle--medium {
        width: 45.862px;
        height: 45.862px;
    }

    .delivery-area__center-circle--high,
    .delivery-area__wave {
        width: 22.931px;
        height: 22.931px;
    }

    .delivery-area__toast {
        right: 28px;
        bottom: 28px;
        gap: 56px;
        padding: 20px 24px 20px 20px;
        min-width: 360px;
    }

    .delivery-area__toast-main {
        gap: 16px;
    }

    .delivery-area__toast-icon-bg,
    .delivery-area__toast-icon {
        width: 64px;
        height: 64px;
    }

    .delivery-area__toast-title {
        font-size: 18px;
        line-height: 24px;
    }

    .delivery-area__toast-subtitle {
        font-size: 14px;
        line-height: 18px;
    }
}

@media (max-width: 919px) {
    .delivery-area {
        flex-direction: column;
        align-items: center;
        gap: 56px;
    }
}

@media (max-width: 619px) {
    .delivery-area-section {
        padding: 40px 20px;
    }

    .delivery-area {
        padding: 48px;
        gap: 48px;
        background-color: #F4F8F8;
    }

    .delivery-area__content {
        gap: 24px;
        width: 100%;
    }

    .delivery-area__heading {
        gap: 4px;
        width: 100%;
    }

    .delivery-area__location {
        gap: 16px;
    }

    .delivery-area__title {
        font-size: 28px;
        line-height: 40px;
    }

    .delivery-area__icon {
        width: 56px;
        height: 56px;
    }

    .delivery-area__subtitle {
        font-size: 24px;
        line-height: 32px;
    }

    .delivery-area__description-search {
        gap: 32px;
        width: 100%;
    }

    .delivery-area__description {
        font-size: 16px;
        line-height: 24px;
        width: 374px;
    }

    .delivery-area__search-wrapper {
        width: 100%;
    }

    .delivery-area__search {
        padding: 14px 20px;
        border-width: 2px;
        width: 100%;
    }

    .delivery-area__search-input {
        font-size: 16px;
        line-height: 24px;
    }

    .delivery-area__search-icon-img svg path {
        stroke-width: 2;
    }

    .delivery-area__visual {
        width: 343.966px;
        height: 343.966px;
        margin: 0 auto;
    }

    .delivery-area {
        flex-direction: column;
        position: relative;
    }

    .delivery-area__toast {
        position: absolute;
        right: 12px;
        bottom: 12px;
        left: 12px;
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
        padding: 20px;
        width: auto;
        min-width: auto;
        max-width: none;
    }

    .delivery-area__toast-main {
        flex-direction: column;
        align-items: center;
        gap: 12px;
    }

    .delivery-area__toast-icon-bg,
    .delivery-area__toast-icon {
        width: 64px;
        height: 64px;
    }

    .delivery-area__toast-message {
        text-align: center;
    }

    .delivery-area__toast-actions {
        width: 100%;
    }

    .delivery-area__toast .cta-button {
        width: 100%;
    }
}

@media (max-width: 512px) {
    .delivery-area {
        padding: 24px;
        gap: 40px;
    }

    .delivery-area__content {
        gap: 16px;
    }

    .delivery-area__heading {
        gap: 2px;
    }

    .delivery-area__description-search {
        gap: 32px;
    }
}

@media (max-width: 460px) {
    .delivery-area__description {
        width: 100%;
    }
}

@media (max-width: 413px) {
    .delivery-area-section {
        padding: 9.66vw 4.83vw; /* 40px 20px at 414px */
    }

    .delivery-area {
        padding: 11.59vw; /* 48px at 414px */
        gap: 11.59vw; /* 48px at 414px */
        background-color: #F4F8F8;
    }

    .delivery-area__content {
        gap: 5.8vw; /* 24px at 414px */
        width: 100%;
    }

    .delivery-area__heading {
        gap: 0.97vw; /* 4px at 414px */
        width: 100%;
    }

    .delivery-area__location {
        gap: 3.86vw; /* 16px at 414px */
    }

    .delivery-area__title {
        font-size: 6.76vw; /* 28px at 414px */
        line-height: 9.66vw; /* 40px at 414px */
    }

    .delivery-area__icon {
        width: 13.53vw; /* 56px at 414px */
        height: 13.53vw;
    }

    .delivery-area__subtitle {
        font-size: 5.8vw; /* 24px at 414px */
        line-height: 7.73vw; /* 32px at 414px */
    }

    .delivery-area__description-search {
        gap: 7.73vw; /* 32px at 414px */
        width: 100%;
    }

    .delivery-area__description {
        font-size: 3.86vw; /* 16px at 414px */
        line-height: 5.8vw; /* 24px at 414px */
        width: 100%;
    }

    .delivery-area__search-wrapper {
        width: 100%;
    }

    .delivery-area__search {
        padding: 3.38vw 4.83vw; /* 14px 20px at 414px */
        border-width: 2px;
        width: 100%;
    }

    .delivery-area__search-input {
        font-size: 3.86vw; /* 16px at 414px */
        line-height: 5.8vw; /* 24px at 414px */
    }

    .delivery-area__search-icon-img svg path {
        stroke-width: 2;
    }

    .delivery-area__visual {
        width: 83.08vw; /* 343.966px at 414px */
        height: 83.08vw;
        margin: 0 auto;
    }

    .delivery-area__toast {
        position: absolute;
        right: 2.9vw; /* 12px at 414px */
        bottom: 2.9vw;
        left: 2.9vw;
        flex-direction: column;
        align-items: stretch;
        gap: 3.86vw; /* 16px at 414px */
        padding: 4.83vw; /* 20px at 414px */
        width: auto;
        min-width: auto;
        max-width: none;
    }

    .delivery-area__toast-main {
        flex-direction: column;
        align-items: center;
        gap: 2.9vw; /* 12px at 414px */
    }

    .delivery-area__toast-icon-bg,
    .delivery-area__toast-icon {
        width: 15.46vw; /* 64px at 414px */
        height: 15.46vw;
    }

    .delivery-area__toast-message {
        text-align: center;
    }

    .delivery-area__toast-actions {
        width: 100%;
    }

    .delivery-area__toast .cta-button {
        width: 100%;
    }
}

@media (min-width: 414px) and (max-width: 480px) {
    .delivery-area__visual {
        width: 326px;
        height: 326px;
        margin: 0 auto;
    }

    .delivery-area__city-label {
        left: 106.4px;
        top: 187.9px;
    }

    .delivery-area__radius-label {
        left: 288.8px;
        top: 146.7px;
    }

    .delivery-area__center-point {
        left: 130.4px;
        top: 113.4px;
    }

    .delivery-area__center-circle--low {
        width: 65px;
        height: 65px;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }

    .delivery-area__center-circle--medium {
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }

    .delivery-area__center-circle--high,
    .delivery-area__wave {
        left: 50%;
        top: 50%;
    }

    .delivery-area__toast .cta-button {
        width: 100%;
    }
}

@media (max-width: 413px) {
    .delivery-area-section {
        padding: 9.66vw 4.83vw; /* 40px 20px at 414px */
    }

    .delivery-area {
        padding: 5.8vw; /* 24px at 414px */
        gap: 9.66vw; /* 40px at 414px */
        background-color: #F4F8F8;
    }

    .delivery-area__content {
        gap: 3.86vw; /* 16px at 414px */
        width: 100%;
    }

    .delivery-area__heading {
        gap: 0.48vw; /* 2px at 414px */
        width: 100%;
    }

    .delivery-area__location {
        gap: 3.86vw; /* 16px at 414px */
    }

    .delivery-area__title {
        font-size: 6.76vw; /* 28px at 414px */
        line-height: 9.66vw; /* 40px at 414px */
    }

    .delivery-area__icon {
        width: 13.53vw; /* 56px at 414px */
        height: 13.53vw;
    }

    .delivery-area__subtitle {
        font-size: 5.8vw; /* 24px at 414px */
        line-height: 7.73vw; /* 32px at 414px */
    }

    .delivery-area__description-search {
        gap: 7.73vw; /* 32px at 414px */
        width: 100%;
    }

    .delivery-area__description {
        font-size: 3.86vw; /* 16px at 414px */
        line-height: 5.8vw; /* 24px at 414px */
        width: 100%;
    }

    .delivery-area__search-wrapper {
        width: 100%;
    }

    .delivery-area__search {
        padding: 3.38vw 4.83vw; /* 14px 20px at 414px */
        border-width: 0.48vw; /* 2px at 414px */
        width: 100%;
    }

    .delivery-area__search-input {
        font-size: 16px; /* Fixed size to prevent zoom on iOS Safari */
        line-height: 5.8vw; /* 24px at 414px */
    }

    .delivery-area__search-icon-img svg path {
        stroke-width: 2;
    }

    .delivery-area__visual {
        width: 78.74vw; /* 326px at 414px */
        height: 78.74vw;
        margin: 0 auto;
    }

    .delivery-area__city-label {
        left: 25.7vw; /* 106.4px at 414px */
        top: 45.39vw; /* 187.9px at 414px */
        width: 27.75vw; /* 114.9px at 414px - proportional to 326px map (121.207*326/343.966) */
        height: 9.01vw; /* 37.3px at 414px - proportional (39.31*326/343.966) */
        padding: 1.88vw 4.5vw; /* 7.76px 18.64px at 414px - proportional */
        font-size: 3.38vw; /* 14px at 414px - proportional */
        line-height: 5.25vw; /* 21.74px at 414px - proportional */
    }

    .delivery-area__radius-label {
        left: 69.76vw; /* 288.8px at 414px */
        top: 35.43vw; /* 146.7px at 414px */
        width: 17.25vw; /* 71.4px at 414px - proportional (75.345*326/343.966) */
        height: 7.87vw; /* 32.6px at 414px - proportional (34.397*326/343.966) */
        padding: 1.69vw 3.38vw 1.31vw; /* 7px 14px 5.43px at 414px - proportional */
        font-size: 3vw; /* 12.42px at 414px - proportional */
        line-height: 4.5vw; /* 18.64px at 414px - proportional */
    }

    .delivery-area__center-point {
        left: 31.5vw; /* 130.4px at 414px */
        top: 27.39vw; /* 113.4px at 414px */
        width: 15.7vw; /* 65px at 414px */
        height: 15.7vw;
    }

    .delivery-area__center-circle--low {
        width: 15.7vw; /* 65px at 414px */
        height: 15.7vw;
    }

    .delivery-area__center-circle--medium {
        width: 10.47vw; /* 43.33px at 414px - proportional to 65px (45.862/68.793*65) */
        height: 10.47vw;
    }

    .delivery-area__center-circle--high,
    .delivery-area__wave {
        width: 5.23vw; /* 21.67px at 414px - proportional to 65px (22.931/68.793*65) */
        height: 5.23vw;
    }

    .delivery-area__center-circle--high {
        border-width: 0.48vw; /* 2px at 414px */
    }

    .delivery-area__toast {
        position: absolute;
        right: 2.9vw; /* 12px at 414px */
        bottom: 2.9vw;
        left: 2.9vw;
        flex-direction: column;
        align-items: stretch;
        gap: 3.86vw; /* 16px at 414px */
        padding: 4.83vw; /* 20px at 414px */
        width: auto;
        min-width: auto;
        max-width: none;
    }

    .delivery-area__toast-main {
        flex-direction: column;
        align-items: center;
        gap: 2.9vw; /* 12px at 414px */
    }

    .delivery-area__toast-icon-bg,
    .delivery-area__toast-icon {
        width: 15.46vw; /* 64px at 414px */
        height: 15.46vw;
    }

    .delivery-area__toast-message {
        text-align: center;
    }

    .delivery-area__toast-actions {
        width: 100%;
    }

    .delivery-area__toast .cta-button {
        display: block;
        width: 100% !important;
        box-sizing: border-box;
    }
}

/* Cities Section */
.cities-section {
    padding-top: clamp(64px, calc(64px + (100vw - 1140px) * 16 / 300), 80px);
    padding-bottom: clamp(64px, calc(64px + (100vw - 1140px) * 16 / 300), 80px);
    padding-left: clamp(40px, calc(40px + (100vw - 1140px) * 8 / 300), 48px);
    padding-right: clamp(40px, calc(40px + (100vw - 1140px) * 8 / 300), 48px);
}

.cities-container {
    max-width: 1344px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 80px;
}

.cities-title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: 40px;
    line-height: 48px;
    color: #141000;
    text-align: center;
    margin: 0;
}

@media (min-width: 1140px) {
    .cities-title {
        font-size: clamp(48px, calc(48px + (100vw - 1139px) * 8 / 301), 56px);
        line-height: clamp(56px, calc(56px + (100vw - 1139px) * 16 / 301), 72px);
    }
}

@media (min-width: 994px) and (max-width: 1139px) {
    .cities-title {
        font-size: clamp(40px, calc(40px + (100vw - 993px) * 8 / 146), 48px);
        line-height: clamp(48px, calc(48px + (100vw - 993px) * 8 / 146), 56px);
    }
}

@media (min-width: 620px) and (max-width: 992px) {
    .cities-title {
        font-size: 40px;
        line-height: 48px;
    }
}

.cities-grid {
    display: flex;
    width: 100%;
    gap: 0;
}

.cities-column {
    display: flex;
    flex-direction: column;
    gap: 28px;
    flex: 1;
    padding-top: 16px;
    padding-bottom: 16px;
    align-items: stretch;
}

.cities-direction {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-left: 34px;
}

.cities-direction-icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.cities-direction-title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 400;
    font-size: 22px;
    line-height: 32px;
    color: #141000;
    margin: 0;
    white-space: nowrap;
}

.cities-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-left: 34px;
    flex: 1;
    min-height: 0;
    position: relative;
}

.cities-list::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 1px;
    background: #141000;
    border-radius: 1px;
}

.cities-column:last-child .cities-list::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 1px;
    background: #141000;
    border-radius: 1px;
}

.cities-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cities-item-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.cities-item-text {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 28px;
    color: #3a403b;
    white-space: nowrap;
}

/* Responsive styles for cities section */
@media (max-width: 1139px) {
    .cities-container {
        gap: 64px;
    }

    .cities-grid {
        flex-wrap: wrap;
    }

    .cities-column {
        flex: 0 0 calc(50% - 1px);
        border-right: 1px solid #141000;
        border-bottom: 1px solid #141000;
    }

    .cities-column:nth-child(1),
    .cities-column:nth-child(2) {
        border-top: none;
    }

    .cities-column:nth-child(3),
    .cities-column:nth-child(4) {
        border-top: 1px solid #141000;
    }
}

@media (min-width: 726px) and (max-width: 1139px) {
    .cities-column {
        border-right: none !important;
        border-bottom: none !important;
        border-top: none !important;
    }

    .cities-column:nth-child(3),
    .cities-column:nth-child(4) {
        margin-top: 16px;
    }

    .cities-column:nth-child(1),
    .cities-column:nth-child(2),
    .cities-column:nth-child(3),
    .cities-column:nth-child(4) {
        border-top: none !important;
        border-bottom: none !important;
    }

    .cities-column:nth-child(2) .cities-list::after,
    .cities-column:last-child .cities-list::after {
        content: '';
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        width: 1px;
        background: #141000;
        border-radius: 1px;
    }

    .cities-list {
        padding-left: 34px;
        position: relative;
    }

    .cities-list::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 1px;
        background: #141000;
        border-radius: 1px;
    }
}

@media (max-width: 725px) {
    .cities-section {
        padding-left: 32px;
        padding-right: 32px;
    }

    .cities-container {
        gap: 48px;
    }

    .cities-grid {
        flex-direction: column;
    }

    .cities-column {
        flex: 1;
        width: 100%;
        border-right: none !important;
        border-bottom: none !important;
        border-top: none !important;
        padding-left: 0;
        padding-right: 0;
    }

    .cities-direction {
        padding-left: 34px;
    }

    .cities-list {
        padding-left: 34px;
        position: relative;
    }

    .cities-list::before {
        display: none !important;
    }

    .cities-column .cities-list::after {
        display: none !important;
    }

}

@media (max-width: 619px) {
    .cities-section {
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .cities-container {
        gap: 32px;
    }

    .cities-title {
        font-size: 28px;
        line-height: 40px;
    }

    .cities-column {
        gap: 28px;
        padding-top: 16px;
        padding-bottom: 16px;
    }

    .cities-direction {
        gap: 12px;
        padding-left: 34px;
    }

    .cities-direction-icon {
        width: 16px;
        height: 16px;
    }

    .cities-direction-title {
        font-size: 20px;
        line-height: 30px;
    }

    .cities-list {
        gap: 4px;
        padding-left: 34px;
        position: relative;
    }
}

@media (max-width: 512px) {
    .cities-column {
        gap: 16px;
    }

    .cities-column:first-child {
        padding-top: 0;
    }

    .cities-direction {
        padding-left: 24px;
    }

    .cities-list {
        padding-left: 24px;
    }
}

@media (max-width: 479px) {
    .cities-container {
        align-items: flex-start;
    }

    .cities-title {
        text-align: left !important;
    }

    .cities-direction {
        padding-left: 24px;
    }

    .cities-list {
        padding-left: 24px;
    }

    .cities-list::before {
        display: none;
    }

    .cities-column:last-child .cities-list::after {
        display: none;
    }

    .cities-item {
        gap: 8px;
    }

    .cities-item-icon {
        width: 20px;
        height: 20px;
    }

    .cities-item-text {
        font-size: 16px;
        line-height: 28px;
    }
}

@media (max-width: 414px) {
    .cities-section {
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .cities-container {
        gap: 32px;
        align-items: flex-start;
    }

    .cities-title {
        font-size: 28px;
        line-height: 40px;
        text-align: left !important;
    }

    .cities-column {
        gap: 16px;
        padding-top: 16px;
        padding-bottom: 16px;
    }

    .cities-column:first-child {
        padding-top: 0;
    }

    .cities-direction {
        gap: 12px;
        padding-left: 24px;
    }

    .cities-direction-icon {
        width: 16px;
        height: 16px;
    }

    .cities-direction-title {
        font-size: 20px;
        line-height: 30px;
    }

    .cities-list {
        gap: 4px;
        padding-left: 24px;
        position: relative;
    }

    .cities-item {
        gap: 8px;
    }

    .cities-item-icon {
        width: 20px;
        height: 20px;
    }

    .cities-item-text {
        font-size: 16px;
        line-height: 28px;
    }
}

@media (max-width: 413px) {
    .cities-section {
        padding-left: calc(20 / 414 * 100vw);
        padding-right: calc(20 / 414 * 100vw);
        padding-top: calc(40 / 414 * 100vw);
        padding-bottom: calc(40 / 414 * 100vw);
    }

    .cities-container {
        gap: calc(32 / 414 * 100vw);
    }

    .cities-title {
        font-size: calc(28 / 414 * 100vw);
        line-height: calc(40 / 414 * 100vw);
    }

    .cities-column {
        gap: calc(16 / 414 * 100vw);
        padding-top: calc(16 / 414 * 100vw);
        padding-bottom: calc(16 / 414 * 100vw);
    }

    .cities-column:first-child {
        padding-top: 0;
    }

    .cities-direction {
        gap: calc(12 / 414 * 100vw);
        padding-left: calc(24 / 414 * 100vw);
    }

    .cities-direction-icon {
        width: calc(16 / 414 * 100vw);
        height: calc(16 / 414 * 100vw);
    }

    .cities-direction-title {
        font-size: calc(20 / 414 * 100vw);
        line-height: calc(30 / 414 * 100vw);
    }

    .cities-list {
        gap: calc(4 / 414 * 100vw);
        padding-left: calc(24 / 414 * 100vw);
    }

    .cities-item {
        gap: calc(8 / 414 * 100vw);
    }

    .cities-item-icon {
        width: calc(20 / 414 * 100vw);
        height: calc(20 / 414 * 100vw);
    }

    .cities-item-text {
        font-size: calc(16 / 414 * 100vw);
        line-height: calc(28 / 414 * 100vw);
    }
}

.not-on-list-right {
    display: flex;
    flex-direction: column;
    gap: clamp(31.67px, 2.7778vw, 40px);
    align-items: center;
    flex: 1 1 auto;
    min-width: 0;
}

@keyframes bounceUpDown {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-16px);
    }
}

/* Fixed size 56x56px for 414px-1139px */

.not-on-list-button {
    height: clamp(53.83px, 4.7222vw, 68px);
    padding: 0 clamp(32px, calc(32px + (100vw - 1140px) * 4 / 300), 36px);
    width: auto;
    max-width: none;
}

.not-on-list-button .cta-button__text {
    font-size: clamp(13.47px, 1.1806vw, 17px);
    line-height: clamp(22.19px, 1.9444vw, 28px);
    font-weight: 300;
}

.not-on-list-button .cta-button__text--hover {
    font-weight: 400;
}

/* Responsive styles for Not on List Section */

@media (max-width: 1139px) {

    .not-on-list-right {
        width: auto;
        align-items: center;
        gap: 40px;
        flex: 1 1 auto;
    }

    .not-on-list-button {
        height: 62px;
        padding: 0 32px;
        width: auto;
        max-width: none;
    }

    .not-on-list-button .cta-button__text {
        font-size: 16px;
        line-height: 26px;
    }
}

@media (max-width: 992px) {

    .not-on-list-right {
        width: 100%;
        align-items: center;
        gap: 40px;
    }

    .not-on-list-button {
        height: 62px;
        padding: 0 32px;
        width: auto;
        max-width: none;
    }

    .not-on-list-button .cta-button__text {
        font-size: 16px;
        line-height: 26px;
    }
}

@media (min-width: 620px) and (max-width: 1139px) {
    .not-on-list-button {
        padding-left: 32px;
        padding-right: 32px;
    }
}

@media (max-width: 619px) {

    .not-on-list-right {
        gap: 28px;
    }

    .not-on-list-button {
        height: 68px;
        padding: 0 36px;
    }

    .not-on-list-button .cta-button__text {
        font-size: 16px;
        line-height: 28px;
    }
}

@media (max-width: 484px) {

    .not-on-list-right {
        align-items: center;
        justify-content: center;
    }
}

@media (max-width: 438px) {
    .not-on-list-button-hide-text {
        display: none;
    }
}

@media (max-width: 414px) {

    .not-on-list-right {
        gap: 28px;
    }

    .not-on-list-button {
        height: 68px;
        padding: 0 36px;
    }

    .not-on-list-button .cta-button__text {
        font-size: 16px;
        line-height: 28px;
    }
}

@media (max-width: 413px) {

    .not-on-list-right {
        gap: calc(28 / 414 * 100vw);
        align-items: center;
        justify-content: center;
    }

    .not-on-list-button {
        height: calc(68 / 414 * 100vw);
        padding: 0 calc(36 / 414 * 100vw);
    }

    .not-on-list-button .cta-button__text {
        font-size: calc(16 / 414 * 100vw);
        line-height: calc(28 / 414 * 100vw);
    }
}

/* Testimonials Section */
.testimonials-section {
    padding: 80px 48px;
    background: #ffffff;
}

.testimonials-container {
    max-width: 1344px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 88px;
}

.testimonials-title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: 56px;
    line-height: 72px;
    color: #141000;
    text-align: center;
    width: 100%;
}

.testimonials-header-wrapper {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0;
    margin-bottom: -88px; /* Compensate entire gap (88px), so spacing is controlled by notice margin-bottom */
    position: relative;
    z-index: 10;
    min-height: 0;
}

body.lang-es .testimonials-header-wrapper {
    display: none;
    margin-bottom: 0;
}

/* Translation Notice - visible only for non-Polish languages */
.testimonials-translation-notice {
    display: none;
    background: #dbebff;
    border-radius: 9999px;
    padding: 6px 18px;
    gap: 8px;
    align-items: center;
    justify-content: center;
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    white-space: nowrap;
    margin-top: 0;
    margin-bottom: 20px; /* Final spacing between notice and grid */
    width: fit-content;
    position: relative;
    z-index: 10;
    flex-shrink: 0;
}

body.lang-pl .testimonials-translation-notice,
body.lang-en .testimonials-translation-notice,
body.lang-uk .testimonials-translation-notice,
body.lang-ru .testimonials-translation-notice {
    display: flex;
}

.testimonials-translation-notice-text {
    color: #4e5a6b;
    flex-shrink: 0;
}

.testimonials-translation-toggle {
    color: #141000;
    text-decoration: underline;
    text-decoration-skip-ink: none;
    text-underline-position: from-font;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    cursor: pointer;
    flex-shrink: 0;
}

.testimonials-translation-toggle:hover {
    text-decoration-thickness: 2px;
}

/* On mobile/touch devices, hover can stick after click, so limit thickness */
@media (hover: none) and (pointer: coarse) {
    .testimonials-translation-toggle:hover {
        text-decoration-thickness: 1px;
    }
    
    .testimonials-translation-toggle:active {
        text-decoration-thickness: 2px;
    }
}

/* When showing original, testimonials use Sora font */
body.testimonials-show-original .testimonial-text,
body.testimonials-show-original.lang-uk .testimonial-text,
body.testimonials-show-original.lang-ru .testimonial-text {
    font-family: 'Sora', sans-serif !important;
}

/* Viewport-based scaling from 1440px to 1140px */
@media (min-width: 1140px) and (max-width: 1440px) {
    .testimonials-section {
        padding: calc(80 / 1440 * 100vw) calc(48 / 1440 * 100vw);
    }

    .testimonials-container {
        max-width: calc(1344 / 1440 * 100vw);
        gap: calc(88 / 1440 * 100vw);
    }

    .testimonials-title {
        font-size: calc(56 / 1440 * 100vw);
        line-height: calc(72 / 1440 * 100vw);
    }
}

.testimonials-grid-wrapper {
    position: relative;
    width: 100%;
    margin-top: 0;
}

.testimonials-grid {
    column-count: 4;
    column-gap: 24px;
    width: 100%;
    column-fill: balance;
    -webkit-column-fill: balance;
}

.testimonial-card {
    background: #ffffff;
    border: 1px solid #d0d0d0;
    border-radius: 24px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    break-inside: avoid;
    margin-bottom: 24px;
    page-break-inside: avoid;
    align-items: flex-start;
    align-self: flex-start;
    vertical-align: top;
}

/* Viewport-based scaling from 1440px to 1140px */
@media (min-width: 1140px) and (max-width: 1440px) {
    .testimonials-grid {
        column-gap: calc(24 / 1440 * 100vw);
    }

    .testimonial-card {
        border-radius: calc(24 / 1440 * 100vw);
        padding: calc(24 / 1440 * 100vw);
        gap: calc(12 / 1440 * 100vw);
        margin-bottom: calc(24 / 1440 * 100vw);
    }
}

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

.testimonial-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.testimonial-user-info {
    display: flex;
    flex-direction: column;
    gap: 0;
    flex: 1;
    min-width: 0;
}

.testimonial-name {
    font-family: 'Sora', sans-serif;
    font-weight: 500;
    font-size: 15px;
    line-height: 24px;
    color: #141414;
    margin: 0;
}

.testimonial-date {
    font-family: 'Sora', sans-serif;
    font-weight: 300;
    font-size: 12px;
    line-height: 18px;
    color: #545454;
    margin: 0;
}

.testimonial-text {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #141000;
    margin: 0;
    white-space: pre-wrap;
}

/* Ukrainian and Russian versions: replace Sora font with Noto Sans for testimonials */
body.lang-uk .testimonial-date,
body.lang-ru .testimonial-date {
    font-family: 'Noto Sans', sans-serif !important;
    font-weight: 400 !important;
}

body.lang-uk .testimonial-text,
body.lang-ru .testimonial-text {
    font-family: 'Noto Sans', sans-serif !important;
}

/* Keep Sora font for names in all languages including Ukrainian and Russian */
body.lang-uk .testimonial-name,
body.lang-ru .testimonial-name {
    font-family: 'Sora', sans-serif !important;
}

/* Viewport-based scaling from 1440px to 1140px */
@media (min-width: 1140px) and (max-width: 1440px) {
    .testimonial-user {
        gap: calc(16 / 1440 * 100vw);
    }

    .testimonial-avatar {
        width: calc(48 / 1440 * 100vw);
        height: calc(48 / 1440 * 100vw);
    }

    .testimonial-name {
        font-size: calc(15 / 1440 * 100vw);
        line-height: calc(24 / 1440 * 100vw);
    }

    .testimonial-date {
        font-size: calc(12 / 1440 * 100vw);
        line-height: calc(18 / 1440 * 100vw);
    }

    .testimonial-text {
        font-size: calc(15 / 1440 * 100vw);
        line-height: calc(24 / 1440 * 100vw);
    }
}

.testimonials-fade {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 280px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #ffffff);
    pointer-events: none;
}

.testimonials-button {
    height: 68px;
    padding: 0 36px;
}

.testimonials-button .cta-button__text {
    font-family: 'Unbounded', sans-serif;
    font-weight: 300;
    font-size: 17px;
    line-height: 28px;
}

/* Viewport-based scaling from 1440px to 1140px */
@media (min-width: 1140px) and (max-width: 1440px) {
    .testimonials-fade {
        height: calc(280 / 1440 * 100vw);
    }

    .testimonials-button {
        height: calc(68 / 1440 * 100vw);
        padding: 0 calc(36 / 1440 * 100vw);
    }

    .testimonials-button .cta-button__text {
        font-size: calc(17 / 1440 * 100vw);
        line-height: calc(28 / 1440 * 100vw);
    }
}

.testimonials-button .cta-button__text--hover {
    font-weight: 400;
}

/* Responsive styles for Testimonials Section */
@media (min-width: 993px) and (max-width: 1139px) {
    .testimonials-grid {
        column-count: 3;
        column-fill: balance;
        -webkit-column-fill: balance;
    }

    .testimonials-title {
        font-size: clamp(40px, calc(40px + (100vw - 993px) * 8 / 146), 48px);
        line-height: clamp(48px, calc(48px + (100vw - 993px) * 8 / 146), 56px);
    }
}

@media (min-width: 620px) and (max-width: 1139px) {
    .testimonials-button {
        height: 62px;
        padding-left: 32px;
        padding-right: 32px;
    }
    
    .testimonials-button .cta-button__text {
        font-size: 16px;
        line-height: 26px;
    }
}

@media (max-width: 1200px) {
    .testimonials-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    /* Рядок 1: 3 колонки */
    .testimonial-card:nth-child(1) { grid-column: 1; }
    .testimonial-card:nth-child(2) { grid-column: 2; }
    .testimonial-card:nth-child(3) { grid-column: 3; }
    .testimonial-card:nth-child(4) { grid-column: 1; grid-row: 2; }
    
    /* Рядок 2: 2 колонки */
    .testimonial-card:nth-child(5) { grid-column: 2; grid-row: 2; }
    .testimonial-card:nth-child(6) { grid-column: 3; grid-row: 2; }
    
    /* Рядок 3: 3 колонки */
    .testimonial-card:nth-child(7) { grid-column: 1; grid-row: 3; }
    .testimonial-card:nth-child(8) { grid-column: 2; grid-row: 3; }
    .testimonial-card:nth-child(9) { grid-column: 3; grid-row: 3; }
    
    /* Рядок 4: 3 колонки */
    .testimonial-card:nth-child(10) { grid-column: 1; grid-row: 4; }
    .testimonial-card:nth-child(11) { grid-column: 2; grid-row: 4; }
    .testimonial-card:nth-child(12) { grid-column: 3; grid-row: 4; }
}

@media (max-width: 992px) {
    .testimonials-grid {
        column-count: 2;
        column-fill: balance;
        -webkit-column-fill: balance;
    }

    .testimonials-title {
        font-size: 40px;
        line-height: 48px;
    }
}

@media (min-width: 620px) and (max-width: 992px) {
    .testimonials-title {
        font-size: 40px;
        line-height: 48px;
    }
}

@media (max-width: 768px) {
    .testimonials-section {
        padding: 64px 32px;
    }

    .testimonials-container {
        gap: 64px;
    }
    
    .testimonials-header-wrapper {
        margin-bottom: -64px; /* Compensate gap on tablet */
        z-index: 10;
    }
    
    body.lang-es .testimonials-header-wrapper {
        display: none !important;
        margin-bottom: 0;
    }
    
    .testimonials-translation-notice {
        z-index: 10;
        position: relative;
    }

    .testimonials-grid {
        column-count: 1;
    }

    .testimonials-fade {
        height: 200px;
    }
}

@media (max-width: 620px) {
    .testimonials-title {
        font-size: 28px;
        line-height: 40px;
    }
}

@media (max-width: 484px) {
    .testimonials-title {
        text-align: left;
    }
}

@media (max-width: 619px) {
    .testimonials-section {
        padding: 40px 20px;
    }

    .testimonials-container {
        gap: 32px;
    }
    
    .testimonials-header-wrapper {
        margin-bottom: -32px; /* Compensate gap on mobile */
        z-index: 10;
    }
    
    body.lang-es .testimonials-header-wrapper {
        display: none !important;
        margin-bottom: 0;
    }
    
    .testimonials-translation-notice {
        z-index: 10;
        position: relative;
        margin-bottom: 16px;
        padding: 6px 16px;
        font-size: 14px;
        line-height: 20px;
        width: auto;
        max-width: 100%;
    }
}

/* Testimonials button for 415px-619px */
@media (min-width: 415px) and (max-width: 619px) {
    .testimonials-button .cta-button__text {
        font-size: 16px;
        line-height: 28px;
    }
}

/* Fix values at 414px */
@media (max-width: 414px) {
    .testimonials-section {
        padding: 40px 20px;
    }

    .testimonials-container {
        gap: 32px;
    }

    .testimonials-title {
        font-size: 28px;
        line-height: 40px;
        text-align: left;
    }

    .testimonials-grid {
        column-gap: 24px;
    }

    .testimonial-card {
        border-radius: 24px;
        padding: 20px;
        gap: 12px;
        margin-bottom: 24px;
    }

    .testimonial-user {
        gap: 16px;
    }

    .testimonial-avatar {
        width: 48px;
        height: 48px;
    }

    .testimonial-name {
        font-size: 15px;
        line-height: 24px;
    }

    .testimonial-date {
        font-size: 12px;
        line-height: 18px;
    }

    .testimonial-text {
        font-size: 15px;
        line-height: 24px;
    }

    .testimonials-fade {
        height: 200px;
    }

    .testimonials-button {
        height: 68px;
        padding: 0 36px;
    }

    .testimonials-button .cta-button__text {
        font-size: 16px;
        line-height: 28px;
    }
}

/* Viewport-based proportional scaling for screens ≤413px */
@media (max-width: 413px) {
    .testimonials-section {
        padding: calc(40 / 414 * 100vw) calc(20 / 414 * 100vw);
    }

    .testimonials-container {
        gap: calc(32 / 414 * 100vw);
    }

    .testimonials-title {
        font-size: calc(28 / 414 * 100vw);
        line-height: calc(40 / 414 * 100vw);
        text-align: left;
    }

    .testimonials-grid {
        column-gap: calc(24 / 414 * 100vw);
    }

    .testimonial-card {
        border-radius: calc(24 / 414 * 100vw);
        padding: calc(20 / 414 * 100vw);
        gap: calc(12 / 414 * 100vw);
        margin-bottom: calc(24 / 414 * 100vw);
    }

    .testimonial-user {
        gap: calc(16 / 414 * 100vw);
    }

    .testimonial-avatar {
        width: calc(48 / 414 * 100vw);
        height: calc(48 / 414 * 100vw);
    }

    .testimonial-name {
        font-size: calc(15 / 414 * 100vw);
        line-height: calc(24 / 414 * 100vw);
    }

    .testimonial-date {
        font-size: calc(12 / 414 * 100vw);
        line-height: calc(18 / 414 * 100vw);
    }

    .testimonial-text {
        font-size: calc(15 / 414 * 100vw);
        line-height: calc(24 / 414 * 100vw);
    }

    .testimonials-fade {
        height: calc(200 / 414 * 100vw);
    }

    .testimonials-button {
        height: calc(68 / 414 * 100vw);
        padding: 0 calc(36 / 414 * 100vw);
    }

    .testimonials-button .cta-button__text {
        font-size: calc(16 / 414 * 100vw);
        line-height: calc(28 / 414 * 100vw);
    }
    
    .testimonials-translation-notice {
        padding: calc(6 / 414 * 100vw) calc(18 / 414 * 100vw);
        gap: calc(8 / 414 * 100vw);
        font-size: calc(15 / 414 * 100vw);
        line-height: calc(24 / 414 * 100vw);
        margin-bottom: calc(20 / 414 * 100vw);
        border-radius: calc(9999 / 414 * 100vw);
    }
    
    .testimonials-translation-notice-text {
        font-size: calc(15 / 414 * 100vw);
        line-height: calc(24 / 414 * 100vw);
    }
    
    .testimonials-translation-toggle {
        font-size: calc(15 / 414 * 100vw);
        line-height: calc(24 / 414 * 100vw);
        text-decoration-thickness: 1px;
    }
    
    .testimonials-translation-toggle:hover {
        text-decoration-thickness: 1px;
    }
    
    .testimonials-translation-toggle:active {
        text-decoration-thickness: 1.5px;
    }
    
    .testimonials-header-wrapper {
        margin-bottom: calc(-32 / 414 * 100vw); /* Compensate gap on mobile */
    }
}

/* FAQ Section */
.faq-section {
    padding-top: clamp(64px, calc(64px + (100vw - 1140px) * 16 / 300), 80px);
    padding-bottom: clamp(64px, calc(64px + (100vw - 1140px) * 16 / 300), 80px);
    padding-left: clamp(40px, calc(40px + (100vw - 1140px) * 8 / 300), 48px);
    padding-right: clamp(40px, calc(40px + (100vw - 1140px) * 8 / 300), 48px);
}

.faq-container {
    max-width: 1344px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 80px;
}

.faq-title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: 56px;
    line-height: 72px;
    color: #141000;
    text-align: center;
    margin: 0;
}

.faq-list {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}

.faq-item {
    background: #F9FAFA;
    border: 1px solid #141000;
    border-radius: 24px;
    padding: 40px 48px;
    display: flex;
    flex-direction: column;
    cursor: pointer;
}

.faq-question {
    display: flex;
    align-items: center;
    gap: 24px;
    width: 100%;
    cursor: pointer;
}

.faq-item:hover .faq-toggle {
    transform: scale(1.05);
}

.faq-item:hover .faq-toggle .faq-icon img {
    filter: brightness(0) invert(1);
}

/* Disable hover effects on touch devices */
@media (hover: none) and (pointer: coarse) {
    .faq-item:hover .faq-toggle {
        transform: none;
    }

    .faq-item:hover .faq-toggle .faq-icon img {
        filter: none;
    }

    .faq-item:hover .faq-toggle__fill,
    .faq-toggle__fill {
        width: 0 !important;
        height: 0 !important;
    }
}

.faq-question-text {
    font-family: 'Unbounded', sans-serif;
    font-weight: 400;
    font-size: 24px;
    line-height: 32px;
    color: #141000;
    margin: 0;
    flex: 1;
}

.faq-toggle {
    border: 2px solid #141000;
    border-radius: 9999px;
    padding: 9px;
    background: transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.faq-toggle__fill {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background: #141000;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1), height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 0;
}

.faq-item:hover .faq-toggle__fill {
    width: 200%;
    height: 200%;
}

.faq-icon {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    z-index: 1;
}

.faq-toggle:active {
    transform: scale(0.95);
}

.faq-icon {
    position: relative;
    z-index: 1;
}

.faq-icon img {
    width: 100%;
    height: 100%;
    display: block;
    transition: opacity 0.2s ease, filter 0.3s ease;
}

.faq-question:hover .faq-icon img {
    filter: brightness(0) invert(1);
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1), margin-top 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease;
    margin-top: 0;
    opacity: 0;
}

.faq-answer--open {
    max-height: 1000px;
    margin-top: 24px;
    opacity: 1;
}

.faq-answer-text {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #141000;
    margin: 0;
    padding-right: 80px;
}

/* Use Noto Sans for Ukrainian and Russian languages in FAQ section - only for answers */
body.lang-uk .faq-answer-text,
body.lang-ru .faq-answer-text {
    font-family: 'Noto Sans', sans-serif;
}

/* Viewport-based scaling for FAQ from 1140px to 1440px */
@media (min-width: 1140px) and (max-width: 1440px) {
    .faq-container {
        max-width: 93.33vw; /* 1344px at 1440px */
        gap: 5.56vw; /* 80px at 1440px */
    }

    .faq-title {
        font-size: 3.89vw; /* 56px at 1440px */
        line-height: 5vw; /* 72px at 1440px */
    }

    .faq-list {
        gap: 2.22vw; /* 32px at 1440px */
    }

        .faq-item {
            border-radius: 1.67vw; /* 24px at 1440px */
            padding: 2.78vw 3.33vw; /* 40px 48px at 1440px */
        }

    .faq-question {
        gap: 1.67vw; /* 24px at 1440px */
    }

    .faq-question-text {
        font-size: 1.67vw; /* 24px at 1440px */
        line-height: 2.22vw; /* 32px at 1440px */
    }

    .faq-toggle {
        padding: 0.63vw; /* 9px at 1440px */
    }

    .faq-icon {
        width: 2.08vw; /* 30px at 1440px */
        height: 2.08vw; /* 30px at 1440px */
    }

    .faq-answer--open {
        margin-top: 1.67vw; /* 24px at 1440px */
    }

    .faq-answer-text {
        font-size: 1.25vw; /* 18px at 1440px */
        line-height: 1.94vw; /* 28px at 1440px */
        padding-right: 5.56vw; /* 80px at 1440px */
    }
}

/* Smooth scaling for FAQ title from 993px to 1139px */
@media (min-width: 993px) and (max-width: 1139px) {
    .faq-title {
        font-size: clamp(40px, calc(40px + (100vw - 993px) * 8 / 146), 48px);
        line-height: clamp(48px, calc(48px + (100vw - 993px) * 8 / 146), 56px);
    }
}

/* Fixed size for FAQ title from 993px and below */
@media (max-width: 993px) {
    .faq-title {
        font-size: 40px;
        line-height: 48px;
    }
}

/* Left align FAQ title from 724px and below */
@media (max-width: 724px) {
    .faq-title {
        text-align: left;
    }
}

/* Adjust spacing for FAQ from 723px and below */
@media (max-width: 723px) {
    .faq-container {
        gap: 56px;
    }

    .faq-item {
        padding: 32px;
    }
}

@media (max-width: 619px) {
    .faq-section {
        padding: 40px 20px;
    }

        .faq-container {
            gap: 32px;
        }

    .faq-title {
        font-size: 28px;
        line-height: 40px;
    }

    .faq-list {
        gap: 24px;
    }

    .faq-item {
        padding: 24px 28px;
    }

    .faq-answer--open {
        margin-top: 20px;
        opacity: 1;
    }

    .faq-question {
        gap: 16px;
    }

    .faq-question-text {
        font-size: 20px;
        line-height: 30px;
    }

    .faq-answer-text {
        font-size: 16px;
        line-height: 24px;
        padding-right: 0;
    }
}

@media (max-width: 480px) {
    .faq-question-text__hidden-mobile {
        display: none;
    }
}

@media (max-width: 414px) {
    .faq-section {
        padding: 40px 20px;
    }

    .faq-container {
        gap: 32px;
    }

    .faq-title {
        font-size: 28px;
        line-height: 40px;
    }

    .faq-list {
        gap: 24px;
    }

    .faq-item {
        padding: 24px 28px;
        border-radius: 24px;
    }

    .faq-answer--open {
        margin-top: 20px;
        opacity: 1;
    }

    .faq-question {
        gap: 16px;
    }

    .faq-question-text {
        font-size: 20px;
        line-height: 30px;
    }

    .faq-answer-text {
        font-size: 16px;
        line-height: 24px;
        padding-right: 0;
    }

    .faq-toggle {
        padding: 9px;
    }

    .faq-icon {
        width: 30px;
        height: 30px;
    }
}

@media (max-width: 413px) {
    .faq-section {
        padding: 9.66vw 4.83vw; /* 40px 20px at 414px */
    }

    .faq-container {
        gap: 7.73vw; /* 32px at 414px */
    }

    .faq-title {
        font-size: 6.76vw; /* 28px at 414px */
        line-height: 9.66vw; /* 40px at 414px */
    }

    .faq-list {
        gap: 5.80vw; /* 24px at 414px */
    }

    .faq-item {
        padding: 5.80vw 6.76vw; /* 24px 28px at 414px */
        border-radius: 5.80vw; /* 24px at 414px */
    }

    .faq-answer--open {
        margin-top: 4.83vw; /* 20px at 414px */
        opacity: 1;
    }

    .faq-question {
        gap: 3.86vw; /* 16px at 414px */
    }

    .faq-question-text {
        font-size: 4.83vw; /* 20px at 414px */
        line-height: 7.25vw; /* 30px at 414px */
    }

    .faq-answer-text {
        font-size: 3.86vw; /* 16px at 414px */
        line-height: 5.80vw; /* 24px at 414px */
        padding-right: 0;
    }

    .faq-toggle {
        padding: 2.17vw; /* 9px at 414px */
    }

    .faq-icon {
        width: 7.25vw; /* 30px at 414px */
        height: 7.25vw;
    }
}

/* Repair form page */
.repair-form-page {
    min-height: 100vh;
    min-height: 100dvh;
    background: #ffffff;
}

.repair-form-wrapper {
    max-width: 920px;
    margin: 0 auto;
    padding: 104px 24px 120px;
    display: flex;
    justify-content: center;
}

.repair-form {
    display: flex;
    flex-direction: column;
    gap: 48px;
    width: 100%;
    max-width: 848px;
}

.repair-form__stepper {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.repair-form__progress {
    display: flex;
    gap: 8px;
}

.repair-form__progress-track {
    flex: 1;
    height: 5px;
    border-radius: 9999px;
    background: #edefec;
    overflow: hidden;
}

.repair-form__progress-track--current {
    min-width: 140px;
}

.repair-form__progress-track--upcoming {
    position: relative;
}

.repair-form__progress-bar {
    width: 48px;
    height: 5px;
    background: #f9944a;
    border-radius: 9999px;
    transition: width 0.3s ease;
}

.repair-form__progress-track--upcoming .repair-form__progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
}

.repair-form__step-label {
    font-family: 'Sora', sans-serif;
    font-size: 14px;
    line-height: 20px;
    color: #141000;
}

/* Use Noto Sans for Ukrainian and Russian languages in repair form */
body.lang-uk .repair-form__step-label,
body.lang-ru .repair-form__step-label {
    font-family: 'Noto Sans', sans-serif;
}

.repair-form__content {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.repair-form__title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: 32px;
    line-height: 48px;
    color: #141000;
    margin: 0 0 32px 0;
}

.repair-form__items {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

/* English — equipment order (repair + testimonial forms share .repair-form) */
body.lang-en .repair-form .repair-form-item[data-equipment="oven"] {
    order: 1;
}

body.lang-en .repair-form .repair-form-item[data-equipment="induction"] {
    order: 2;
}

body.lang-en .repair-form .repair-form-item[data-equipment="microwave"] {
    order: 3;
}

body.lang-en .repair-form .repair-form-item[data-equipment="hood"] {
    order: 4;
}

body.lang-en .repair-form .repair-form-item[data-equipment="dishwasher"] {
    order: 5;
}

body.lang-en .repair-form .repair-form-item[data-equipment="dryer"] {
    order: 6;
}

body.lang-en .repair-form .repair-form-item[data-equipment="washer-dryer"] {
    order: 7;
}

body.lang-en .repair-form .repair-form-item[data-equipment="washing"] {
    order: 8;
}

body.lang-en .repair-form .repair-form-item[data-equipment="refrigerator"] {
    order: 9;
}

body.lang-en .repair-form .repair-form-item[data-equipment="air-conditioner"] {
    order: 10;
}

body.lang-en .repair-form .repair-form-item[data-equipment="thermomix"] {
    order: 11;
}

body.lang-en .repair-form .repair-form-item[data-equipment="coffee"] {
    order: 12;
}

body.lang-en .repair-form .repair-form-item[data-equipment="vacuum"] {
    order: 13;
}

body.lang-en .repair-form .repair-form-item[data-equipment="karcher-vacuum"] {
    order: 13;
}

body.lang-en .repair-form .repair-form-item[data-equipment="dyson-vacuum"] {
    order: 13;
}

body.lang-en .repair-form .repair-form-item[data-equipment="dyson-hairdryer"] {
    order: 14;
}


/* Polish — equipment order (repair + testimonial forms share .repair-form) */
body.lang-pl .repair-form .repair-form-item[data-equipment="oven"] {
    order: 1;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="induction"] {
    order: 2;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="hood"] {
    order: 3;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="refrigerator"] {
    order: 4;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="dishwasher"] {
    order: 5;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="thermomix"] {
    order: 6;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="microwave"] {
    order: 7;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="coffee"] {
    order: 8;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="dryer"] {
    order: 9;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="washing"] {
    order: 10;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="washer-dryer"] {
    order: 11;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="air-conditioner"] {
    order: 12;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="vacuum"] {
    order: 13;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="karcher-vacuum"] {
    order: 13;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="dyson-vacuum"] {
    order: 13;
}

body.lang-pl .repair-form .repair-form-item[data-equipment="dyson-hairdryer"] {
    order: 14;
}


/* Ukrainian — equipment order (repair + testimonial forms share .repair-form) */
body.lang-uk .repair-form .repair-form-item[data-equipment="refrigerator"] {
    order: 1;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="hood"] {
    order: 2;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="oven"] {
    order: 3;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="induction"] {
    order: 4;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="microwave"] {
    order: 5;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="coffee"] {
    order: 6;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="dishwasher"] {
    order: 7;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="washing"] {
    order: 8;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="dryer"] {
    order: 9;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="washer-dryer"] {
    order: 10;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="air-conditioner"] {
    order: 11;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="vacuum"] {
    order: 12;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="karcher-vacuum"] {
    order: 12;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="dyson-vacuum"] {
    order: 12;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="dyson-hairdryer"] {
    order: 13;
}

body.lang-uk .repair-form .repair-form-item[data-equipment="thermomix"] {
    order: 14;
}

/* Ukrainian: −2px horizontal gap so «Прально-сушильна» + «Фен Dyson» fit one row (~414px viewports) */
@media (max-width: 415px) {
    body.lang-uk .repair-form .repair-form__items {
        column-gap: 10px;
    }
}

/* Russian — equipment order (repair + testimonial forms share .repair-form) */
body.lang-ru .repair-form .repair-form-item[data-equipment="refrigerator"] {
    order: 1;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="hood"] {
    order: 2;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="oven"] {
    order: 3;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="induction"] {
    order: 4;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="microwave"] {
    order: 5;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="coffee"] {
    order: 6;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="dishwasher"] {
    order: 7;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="washing"] {
    order: 8;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="dryer"] {
    order: 9;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="washer-dryer"] {
    order: 10;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="air-conditioner"] {
    order: 11;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="vacuum"] {
    order: 12;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="karcher-vacuum"] {
    order: 12;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="dyson-vacuum"] {
    order: 12;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="dyson-hairdryer"] {
    order: 13;
}

body.lang-ru .repair-form .repair-form-item[data-equipment="thermomix"] {
    order: 14;
}


/* Spanish — equipment order (repair + testimonial forms share .repair-form) */
body.lang-es .repair-form .repair-form-item[data-equipment="oven"] {
    order: 1;
}

body.lang-es .repair-form .repair-form-item[data-equipment="induction"] {
    order: 2;
}

body.lang-es .repair-form .repair-form-item[data-equipment="hood"] {
    order: 3;
}

body.lang-es .repair-form .repair-form-item[data-equipment="dishwasher"] {
    order: 4;
}

body.lang-es .repair-form .repair-form-item[data-equipment="coffee"] {
    order: 5;
}

body.lang-es .repair-form .repair-form-item[data-equipment="dryer"] {
    order: 6;
}

body.lang-es .repair-form .repair-form-item[data-equipment="washing"] {
    order: 7;
}

body.lang-es .repair-form .repair-form-item[data-equipment="washer-dryer"] {
    order: 8;
}

body.lang-es .repair-form .repair-form-item[data-equipment="microwave"] {
    order: 9;
}

body.lang-es .repair-form .repair-form-item[data-equipment="refrigerator"] {
    order: 10;
}

body.lang-es .repair-form .repair-form-item[data-equipment="air-conditioner"] {
    order: 11;
}

body.lang-es .repair-form .repair-form-item[data-equipment="vacuum"] {
    order: 12;
}

body.lang-es .repair-form .repair-form-item[data-equipment="karcher-vacuum"] {
    order: 12;
}

body.lang-es .repair-form .repair-form-item[data-equipment="dyson-vacuum"] {
    order: 12;
}

body.lang-es .repair-form .repair-form-item[data-equipment="dyson-hairdryer"] {
    order: 13;
}

body.lang-es .repair-form .repair-form-item[data-equipment="thermomix"] {
    order: 14;
}

.repair-form-item {
    border: none;
    border-radius: 9999px;
    padding: 6px 18px;
    background: #f1f1f1;
    color: #141000;
    font-family: 'Sora', sans-serif;
    font-size: 16px;
    line-height: 24px;
    cursor: pointer;
    transition: background 0.3s ease, color 0.3s ease;
}

/* Use Noto Sans for Ukrainian and Russian languages in repair form items */
body.lang-uk .repair-form-item,
body.lang-ru .repair-form-item {
    font-family: 'Noto Sans', sans-serif;
}

.repair-form-item:hover,
.repair-form-item:focus-visible {
    background: #d1d6d2;
    outline: none;
}

/* Remove hover state on touch devices after interaction */
@media (hover: none) and (pointer: coarse) {
    .repair-form-item:not(.repair-form-item--selected):active {
        background: #d1d6d2;
    }
    
    .repair-form-item:not(:active):not(.repair-form-item--selected) {
        background: #f1f1f1;
    }
}

.repair-form-item--selected,
.repair-form-item--selected:hover,
.repair-form-item--selected:focus-visible {
    background: #141000;
    color: #ffffff;
}

.repair-form-item--no-hover {
    background: #f1f1f1 !important;
    color: #141000 !important;
}

.repair-form-item--no-hover.repair-form-item--selected {
    background: #141000 !important;
    color: #ffffff !important;
}

.repair-form__actions {
    display: flex;
    justify-content: flex-start;
}

.repair-form__cta {
    display: inline-flex;
    align-items: center;
    gap: 0;
    padding: 20px 26px 20px 36px;
    font-size: 17px;
    line-height: 28px;
    border-radius: 9999px;
    height: 68px;
    box-sizing: border-box;
}

.repair-form__cta:hover {
    transform: translateY(-1px);
}

.repair-form__cta-text-wrapper {
    display: inline-flex;
}

.repair-form__cta-text {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.repair-form__cta-icon {
    display: inline-flex;
    width: 24px;
    height: 24px;
    position: relative;
    z-index: 2;
}

.repair-form__cta-icon img {
    width: 100%;
    height: 100%;
    display: block;
    transition: filter 0.3s ease;
}

.cta-button__text--hover .repair-form__cta-icon img {
    filter: invert(1);
}

#repairFormSubmit.repair-form__cta {
    padding: 20px 36px;
    height: 68px;
}

#testimonialFormSubmit.repair-form__cta {
    padding: 20px 36px;
    height: 68px;
}

@media (min-width: 1320px) {
    .repair-form-wrapper {
        padding: 120px 24px 120px;
    }
}

@media (max-width: 920px) {
    .repair-form-wrapper {
        padding: 104px 40px 120px;
    }
}

@media (max-width: 768px) {
    .repair-form-wrapper {
        padding: 80px 40px 80px;
    }

    .repair-form-wrapper:has(#repairForm.repair-form--contact-active) {
        padding-bottom: 32px;
    }

    /* 32px between checkbox row and submit (in-flow on mobile repair form) */
    #repairForm.repair-form--contact-active .repair-form__contact-inline:not([hidden]) {
        gap: 32px;
    }

    #repairForm.repair-form--contact-active .repair-form__checkbox-wrapper {
        margin-bottom: 0;
    }

    .repair-form__title {
        font-size: 28px;
        line-height: 40px;
    }
}

@media (max-width: 668px) {
    .repair-form-wrapper {
        padding: 48px 40px 80px;
    }

    .repair-form-wrapper:has(#repairForm.repair-form--contact-active) {
        padding-bottom: 32px;
    }

    .repair-form {
        gap: 48px;
    }
}

@media (max-width: 619px) {
    .repair-form-wrapper {
        padding: 48px 20px 80px;
    }

    .repair-form-wrapper:has(#repairForm.repair-form--contact-active) {
        padding-bottom: 32px;
    }
}

@media (max-width: 480px) {
    .repair-form__success {
        padding: 96px 16px;
    }

    .repair-form__success-card {
        padding: 40px 24px;
    }

    .repair-form__success-title {
        font-size: 28px;
        line-height: 36px;
    }

    .repair-form__success-text {
        font-size: 15px;
        line-height: 24px;
    }

    .repair-form-wrapper {
        padding: 32px 16px 48px 16px;
    }

    .repair-form-wrapper:has(#repairForm.repair-form--contact-active) {
        padding-bottom: 32px;
    }

    /* Success page specific padding */
    .repair-form-wrapper:has(.repair-form__success:not([hidden])) {
        padding: 32px 20px 48px 20px;
    }

    .repair-form {
        gap: 48px;
    }

    .repair-form__title {
        font-size: 24px;
        line-height: 32px;
    }

    .repair-form__items {
        row-gap: 16px;
        column-gap: 12px;
    }

    .repair-form__contact-form .repair-form__title {
        margin-bottom: 32px;
    }

    /* Extra horizontal padding for inputs on step 2 (fields only, not title) */
    .repair-form__step[data-step="2"] .repair-form__fields {
        padding: 0 4px;
        box-sizing: border-box;
    }

    #repairForm .repair-form__contact-inline .repair-form__fields--phone-only {
        padding: 0 4px;
        box-sizing: border-box;
    }

    .repair-form__actions {
        position: fixed;
        bottom: 32px;
        left: 16px;
        right: 16px;
        width: auto;
        z-index: 100;
        align-items: stretch;
    }

    /* Repair form: full-width submit in flow (testimonial "Dalej" stays fixed above) */
    #repairForm.repair-form--contact-active .repair-form__actions--repair-submit {
        position: static !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        z-index: auto !important;
        box-shadow: none !important;
        margin-top: 0;
    }

    .repair-form__step[data-step="2"] .repair-form__actions {
        position: static !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        z-index: auto !important;
        box-shadow: none !important;
    }

    .repair-form__cta {
        display: flex;
        flex: 1;
        width: 100%;
        min-width: 0;
        justify-content: center;
        text-align: center;
        box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.1);
    }

    #repairForm.repair-form--contact-active .repair-form__actions--repair-submit .repair-form__cta {
        box-shadow: none;
    }

}

@media (max-width: 414px) {
    .repair-form-wrapper {
        padding: 32px 15px 48px 16px; /* Fixed values at 414px - top 32px, bottom 48px, left 16px, right 15px */
    }

    .repair-form-wrapper:has(#repairForm.repair-form--contact-active) {
        padding-bottom: 32px;
    }

    /* Success page specific padding */
    .repair-form-wrapper:has(.repair-form__success:not([hidden])) {
        padding: 32px 20px 48px 20px;
    }

    /* Align step 2 content to 32 / 16 / 48 / 16 relative to viewport */
    .repair-form__step[data-step="2"] {
        padding: 0 1px 0 0; /* add 1px on the right (15 + 1 = 16) */
        box-sizing: border-box;
    }

    .repair-form {
        gap: 11.59vw; /* 48px at 414px */
    }

    .repair-form__stepper {
        gap: 2.90vw; /* 12px at 414px */
    }

    .repair-form__progress {
        gap: 1.93vw; /* 8px at 414px */
    }

    .repair-form__progress-track {
        height: 1.21vw; /* 5px at 414px */
    }

    .repair-form__progress-track--current {
        min-width: 33.82vw; /* 140px at 414px */
    }

    .repair-form__progress-bar {
        width: 11.59vw; /* 48px at 414px */
        height: 1.21vw; /* 5px at 414px */
    }

    .repair-form__step-label {
        font-size: 3.38vw; /* 14px at 414px */
        line-height: 4.83vw; /* 20px at 414px */
    }

    .repair-form__content {
        gap: 9.66vw; /* 40px at 414px */
    }

    .repair-form__title {
        font-size: 5.80vw; /* 24px at 414px */
        line-height: 7.73vw; /* 32px at 414px */
        margin: 0 0 7.73vw 0; /* 0 0 32px 0 at 414px */
    }

    .repair-form__contact-form .repair-form__title {
        margin-bottom: 32px; /* Fixed value at 414px */
    }

    .repair-form__items {
        row-gap: 16px; /* Fixed value at 414px */
        column-gap: 12px; /* Fixed value at 414px */
    }

    .repair-form-item {
        padding: 6px 18px; /* Fixed values at 414px */
        font-size: 16px; /* Fixed value at 414px */
        line-height: 24px; /* Fixed value at 414px */
    }

    .repair-form__actions {
        position: fixed;
        bottom: 32px; /* Fixed value at 414px */
        left: 16px; /* Fixed value at 414px */
        right: 16px; /* Fixed value at 414px */
        width: auto;
        z-index: 100;
        align-items: stretch;
    }

    .repair-form__step[data-step="2"] .repair-form__actions {
        position: static !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        z-index: auto !important;
        box-shadow: none !important;
    }

    .repair-form__cta {
        display: flex;
        flex: 1;
        width: 100%;
        min-width: 0;
        justify-content: center;
        text-align: center;
        padding: 4.83vw 6.28vw 4.83vw 8.70vw; /* 20px 26px 20px 36px at 414px */
        height: 16.43vw; /* 68px at 414px */
        font-size: 4.11vw; /* 17px at 414px */
        line-height: 6.76vw; /* 28px at 414px */
        box-shadow: 0 -0.97vw 2.90vw rgba(0, 0, 0, 0.1); /* 0 -4px 12px at 414px */
    }

    .repair-form__cta-text {
        gap: 2.90vw; /* 12px at 414px */
    }

    .repair-form__cta-icon {
        width: 5.80vw; /* 24px at 414px */
        height: 5.80vw; /* 24px at 414px */
    }

    #repairFormSubmit.repair-form__cta {
        padding: 4.83vw 8.70vw;
        height: 16.43vw;
    }
}

@media (max-width: 413px) {
    .repair-form-wrapper {
        padding: 7.73vw 3.62vw 11.59vw 3.86vw; /* Proportional scaling from 414px base - top 32px, bottom 48px */
    }

    .repair-form-wrapper:has(#repairForm.repair-form--contact-active) {
        padding-bottom: 7.73vw; /* 32px at 414px */
    }

    /* Success page specific padding */
    .repair-form-wrapper:has(.repair-form__success:not([hidden])) {
        padding: 7.73vw 4.83vw 11.59vw 4.83vw; /* 20px on both sides at 414px */
    }

    /* Keep step 2 content symmetric when scaling below 414px */
    .repair-form__step[data-step="2"] {
        padding: 0 0.24vw 0 0; /* proportional to 1px at 414px (1 / 414 ≈ 0.24vw) */
        box-sizing: border-box;
    }

    .repair-form {
        gap: 11.59vw;
    }

    .repair-form__stepper {
        gap: 2.90vw;
    }

    .repair-form__progress {
        gap: 1.93vw;
    }

    .repair-form__progress-track {
        height: 1.21vw;
    }

    .repair-form__progress-track--current {
        min-width: 33.82vw;
    }

    .repair-form__progress-bar {
        width: 11.59vw;
        height: 1.21vw;
    }

    .repair-form__step-label {
        font-size: 3.38vw;
        line-height: 4.83vw;
    }

    .repair-form__content {
        gap: 9.66vw;
    }

    .repair-form__title {
        font-size: 5.80vw;
        line-height: 7.73vw;
        margin: 0 0 7.73vw 0;
    }

    .repair-form__contact-form .repair-form__title {
        margin-bottom: 7.73vw; /* 32px at 414px, proportional scaling from 413px */
    }

    .repair-form__items {
        row-gap: 3.86vw; /* 16px at 414px */
        column-gap: 2.90vw; /* 12px at 414px */
    }

    .repair-form-item {
        padding: 1.45vw 4.35vw; /* 6px 18px at 414px */
        font-size: 3.86vw; /* 16px at 414px */
        line-height: 5.80vw; /* 24px at 414px */
    }

    .repair-form__actions {
        position: fixed;
        bottom: 7.73vw; /* 32px at 414px */
        left: 3.86vw; /* 16px at 414px */
        right: 3.86vw; /* 16px at 414px */
        width: auto;
        z-index: 100;
        align-items: stretch;
    }

    .repair-form__step[data-step="2"] .repair-form__actions {
        position: static !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        z-index: auto !important;
        box-shadow: none !important;
    }

    .repair-form__cta {
        display: flex;
        flex: 1;
        width: 100%;
        min-width: 0;
        justify-content: center;
        text-align: center;
        padding: 4.83vw 6.28vw 4.83vw 8.70vw;
        font-size: 4.11vw;
        line-height: 6.76vw;
        box-shadow: 0 -0.97vw 2.90vw rgba(0, 0, 0, 0.1);
    }

    .repair-form__cta-text {
        gap: 2.90vw;
    }

    .repair-form__cta-icon {
        width: 5.80vw;
        height: 5.80vw;
    }
}

/* Step 2: Contact Details Form */
.repair-form__step {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
}

/* Repair form: phone + submit below equipment (single scrollable step).
   Use :not([hidden]) so #id specificity does not override the hidden attribute (otherwise title + phone stay visible). */
#repairForm .repair-form__contact-inline:not([hidden]) {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
}

#repairForm .repair-form__fields--phone-only {
    max-width: 848px;
}

#repairForm .repair-form__fields--phone-only .repair-form__fields-column {
    flex: none;
    width: 100%;
    max-width: 100%;
}

/* Desktop: larger space between equipment grid and contact heading; mobile keeps 40px / 9.66vw from .repair-form__content */
@media (min-width: 769px) {
    #repairForm .repair-form__content.repair-form__step[data-step="1"] {
        gap: 64px;
    }

    /* Same 420px column for label row + input so (wymagane) lines up with input right edge */
    #repairForm #repairFormPhoneSection.repair-form__field {
        max-width: 420px;
        width: 100%;
    }

    #repairForm #phone.repair-form__input {
        width: 100%;
        max-width: 100%;
    }

    #repairForm .repair-form__actions--repair-submit {
        justify-content: center;
        width: 100%;
    }
}

.repair-form__step[data-step="2"] {
    align-items: center;
}

.repair-form__contact-form {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
    max-width: 848px;
}

.repair-form__fields {
    display: flex;
    gap: 48px;
    width: 100%;
}

.repair-form__fields-column {
    display: flex;
    flex-direction: column;
    gap: 32px;
    flex: 1;
    min-width: 0;
}

/* Testimonial form: vertical layout for fields */
#testimonialForm .repair-form__fields {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}

/* Testimonial form: horizontal row for two fields */
.repair-form__fields-row {
    display: flex;
    gap: 16px;
    width: 100%;
}

.repair-form__fields-row .repair-form__field {
    flex: 1;
    min-width: 0;
}

/* Textarea styles */
.repair-form__textarea {
    resize: vertical;
    min-height: 120px;
    font-family: 'Sora', sans-serif;
}

.repair-form__field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}

/* Add margin-bottom for street input to create space for dropdown */
#street.repair-form__input {
    margin-bottom: 4px;
}

/* Fallback for browsers that don't support :has() */
.repair-form__field:has(#street) {
    margin-bottom: 4px;
}

.repair-form__field-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.repair-form__label {
    font-family: 'Sora', sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #141000;
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Use Noto Sans for Ukrainian and Russian languages in repair form labels */
body.lang-uk .repair-form__label,
body.lang-ru .repair-form__label {
    font-family: 'Noto Sans', sans-serif;
}

.repair-form__required {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 10px;
    line-height: 16px;
    color: rgba(20, 16, 0, 0.4);
    text-align: right;
    white-space: nowrap;
}

/* Use Noto Sans for Ukrainian and Russian languages in repair form required indicator */
body.lang-uk .repair-form__required,
body.lang-ru .repair-form__required {
    font-family: 'Noto Sans', sans-serif;
}

.repair-form__input {
    width: 100%;
    padding: 14px 16px;
    background: #ffffff;
    border: 1px solid rgba(20, 16, 0, 0.1);
    border-radius: 16px;
    font-family: 'Sora', sans-serif;
    font-size: 16px;
    line-height: 24px;
    color: rgba(20, 16, 0, 0.8);
    transition: border-color 0.3s ease;
    box-sizing: border-box;
    margin-bottom: 4px;
}

.repair-form__input:focus {
    outline: none;
    border-color: #141000;
}

.repair-form__input::placeholder {
    color: rgba(20, 16, 0, 0.8);
}

/* Remove Chrome/Safari/Edge pale autofill background; keep our white field look */
.repair-form__input:-webkit-autofill,
.repair-form__input:-webkit-autofill:hover,
.repair-form__input:-webkit-autofill:focus,
.repair-form__input:-webkit-autofill:active {
    -webkit-text-fill-color: rgba(20, 16, 0, 0.8);
    caret-color: #141000;
    box-shadow: 0 0 0 1000px #ffffff inset !important;
    border: 1px solid rgba(20, 16, 0, 0.1);
    transition: background-color 99999s ease-out 0s;
}

.repair-form__input:-webkit-autofill:focus {
    border-color: #141000;
}

.repair-form__input:autofill,
.repair-form__input:autofill:hover,
.repair-form__input:autofill:focus {
    box-shadow: 0 0 0 1000px #ffffff inset;
    -webkit-text-fill-color: rgba(20, 16, 0, 0.8);
    color: rgba(20, 16, 0, 0.8);
    border: 1px solid rgba(20, 16, 0, 0.1);
}

.repair-form__input:autofill:focus {
    border-color: #141000;
}

@media (max-width: 619px) {
    .repair-form__input {
        font-size: 16px;
        line-height: 24px;
        padding: 16px;
    }
}

.repair-form__checkbox-wrapper {
    display: flex;
    gap: 8px;
    align-items: center;
    width: 100%;
    margin-top: 32px;
}

@media (max-width: 768px) {
    #repairForm .repair-form__checkbox-wrapper {
        margin-bottom: 32px;
    }
}

.repair-form__success {
    display: none;
    width: 100%;
    padding: 0;
    margin-top: 48px;
}

.repair-form__success[hidden] {
    display: none !important;
}

.repair-form__success-card {
    max-width: 484px;
    width: 100%;
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
    text-align: center;
    box-shadow: none;
    margin: 0 auto;
}

.repair-form__success-icon {
    width: 96px;
    height: 96px;
    margin: 0 auto 40px;
    border-radius: 50%;
    background: rgba(67, 214, 153, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
}

.repair-form__success-icon img {
    width: 96px;
    height: 96px;
}

.repair-form__success-label {
    font-family: 'Sora', sans-serif;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: rgba(20, 16, 0, 0.6);
    margin: 0 0 8px;
}

/* Use Noto Sans for Ukrainian and Russian languages in repair form success label */
body.lang-uk .repair-form__success-label,
body.lang-ru .repair-form__success-label {
    font-family: 'Noto Sans', sans-serif;
}

.repair-form__success-title {
    margin: 0 0 24px;
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: 32px;
    line-height: 48px;
    color: #141000;
}

.repair-form__success-text {
    margin: 0 0 56px;
    font-family: 'Sora', sans-serif;
    font-size: 18px;
    line-height: 28px;
    color: #141000;
}

/* Use Noto Sans for Ukrainian and Russian languages in repair form success text */
body.lang-uk .repair-form__success-text,
body.lang-ru .repair-form__success-text {
    font-family: 'Noto Sans', sans-serif;
}
}

.repair-form__success-actions {
    display: block;
    text-align: center;
    margin: 0;
}

.repair-form__success-cta {
    font-size: 17px;
    line-height: 28px;
    padding: 36px;
}

/* On success screen keep CTA natural size (no full-width flex from step styles) */
.repair-form__success .repair-form__cta {
    display: inline-flex;
    flex: 0;
    width: auto;
    min-width: auto;
    justify-content: center;
    text-align: center;
}

.repair-form__success-secondary {
    font-family: 'Sora', sans-serif;
    font-size: 15px;
    line-height: 24px;
    color: #141000;
    background: transparent;
}

/* Use Noto Sans for Ukrainian and Russian languages in repair form success secondary */
body.lang-uk .repair-form__success-secondary,
body.lang-ru .repair-form__success-secondary {
    font-family: 'Noto Sans', sans-serif;
}
    border: none;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.repair-form__success-secondary:hover {
    color: rgba(20, 16, 0, 0.8);
}

.repair-form--hidden {
    display: none !important;
}

@media (max-width: 580px) {
    .repair-form__success-card {
        max-width: 848px;
        text-align: left;
        margin: 0 auto;
    }

    .repair-form__success-icon {
        width: 80px;
        height: 80px;
        margin: 0 0 32px;
        margin-left: 0; /* Ensure icon is left-aligned on mobile */
    }

    .repair-form__success-icon img {
        width: 80px;
        height: 80px;
    }

    .repair-form__success-title {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 24px;
        text-align: left; /* Ensure title is left-aligned on mobile */
    }

    .repair-form__success-text {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 56px;
        text-align: left; /* Ensure text is left-aligned on mobile */
    }

    .repair-form__success-actions {
        text-align: center; /* Center the button on mobile */
        justify-content: center;
    }
}

/* Success message: fixed values at 414px */
@media (max-width: 414px) {
    .repair-form__success {
        margin-top: 48px;
    }

    .repair-form__success-icon {
        width: 80px;
        height: 80px;
        margin: 0 0 32px;
        margin-left: 0; /* Ensure icon is left-aligned on mobile */
    }

    .repair-form__success-icon img {
        width: 80px;
        height: 80px;
    }

    .repair-form__success-title {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 24px;
        text-align: left; /* Ensure title is left-aligned on mobile */
    }

    .repair-form__success-text {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 56px;
        text-align: left; /* Ensure text is left-aligned on mobile */
    }

    .repair-form__success-cta {
        font-size: 17px;
        line-height: 28px;
        padding: 36px;
    }

    .repair-form__success-label {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 2px;
        margin: 0 0 8px;
        text-align: left; /* Ensure label is left-aligned on mobile */
    }

    .repair-form__success-actions {
        text-align: center; /* Center the button on mobile */
    }
}

/* Success message: proportional scaling from 413px */
@media (max-width: 413px) {
    .repair-form__success {
        margin-top: 11.59vw; /* 48px at 414px */
    }

    .repair-form__success-icon {
        width: 19.32vw; /* 80px at 414px */
        height: 19.32vw;
        margin: 0 0 7.73vw; /* 32px at 414px */
        margin-left: 0; /* Ensure icon is left-aligned on mobile */
    }

    .repair-form__success-icon img {
        width: 19.32vw;
        height: 19.32vw;
    }

    .repair-form__success-title {
        font-size: 5.80vw; /* 24px at 414px */
        line-height: 7.73vw; /* 32px at 414px */
        margin-bottom: 5.80vw; /* 24px at 414px */
        text-align: left; /* Ensure title is left-aligned on mobile */
    }

    .repair-form__success-text {
        font-size: 3.86vw; /* 16px at 414px */
        line-height: 5.80vw; /* 24px at 414px */
        margin-bottom: 13.53vw; /* 56px at 414px */
        text-align: left; /* Ensure text is left-aligned on mobile */
    }

    .repair-form__success-cta {
        font-size: 4.11vw; /* 17px at 414px */
        line-height: 6.76vw; /* 28px at 414px */
        padding: 8.70vw; /* 36px at 414px */
    }

    .repair-form__success-label {
        text-align: left; /* Ensure label is left-aligned on mobile */
    }

    .repair-form__success-actions {
        text-align: center; /* Center the button on mobile */
    }
}

/* Success label: proportional scaling from 380px */
@media (max-width: 380px) {
    .repair-form__success-label {
        font-size: 3.68vw; /* 14px at 380px */
        line-height: 5.26vw; /* 20px at 380px */
        letter-spacing: 0.53vw; /* 2px at 380px */
        margin: 0 0 2.11vw; /* 8px at 380px */
    }
}

.repair-form__checkbox {
    width: 20px;
    height: 20px;
    min-width: 20px;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 6px;
    background: #ffffff;
    cursor: pointer;
    appearance: none;
    position: relative;
    flex-shrink: 0;
}

.repair-form__checkbox:checked {
    background: #141000;
    border-color: #141000;
}

.repair-form__checkbox:checked::after {
    content: '';
    position: absolute;
    top: 10%;
    left: 10%;
    width: 80%;
    height: 80%;
    background-image: url('assets/icon-check.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    /* the check icon is dark — force it to white on the black fill */
    filter: brightness(0) invert(1);
}

.repair-form__checkbox-label {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 18px;
    color: rgba(22, 22, 22, 0.8);
    letter-spacing: 0.24px;
    cursor: pointer;
    flex: 1;
    min-width: 0;
}

/* Use Noto Sans for Ukrainian and Russian languages in repair form checkbox label */
body.lang-uk .repair-form__checkbox-label,
body.lang-ru .repair-form__checkbox-label {
    font-family: 'Noto Sans', sans-serif;
}

.repair-form__terms-link {
    color: inherit;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

.repair-form__terms-link:hover {
    color: #141000;
}

.repair-form__terms-link:focus-visible {
    outline: 2px solid #141000;
    outline-offset: 2px;
}

.repair-form__cta--back {
    background: transparent;
    border: 2px solid #141000;
}

.repair-form__cta--back .cta-button__text--original {
    color: #141000;
}

.repair-form__cta--back .cta-button__text--hover {
    color: #ffffff;
}

.repair-form__cta--back .cta-button__fill {
    background: #141000;
}

.repair-form__actions[data-step="2"] {
    display: flex;
    gap: 14px;
    justify-content: center;
    width: 100%;
}

@media (max-width: 768px) {
    .repair-form__fields {
        flex-direction: column;
        gap: 32px;
    }

    .repair-form__fields-column {
        width: 100%;
    }

    /* Testimonial form: stack fields vertically on mobile */
    #testimonialForm .repair-form__fields-row {
        flex-direction: column;
        gap: 32px;
    }

    #testimonialForm .repair-form__fields-row .repair-form__field {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .repair-form__contact-form {
        gap: 0;
    }

    .repair-form__fields {
        gap: 24px;
    }

    .repair-form__fields-column {
        gap: 24px;
    }

    .repair-form__actions[data-step="2"] {
        flex-direction: column;
        gap: 12px;
    }

    .repair-form__cta--back,
    .repair-form__cta[data-step="2"] {
        width: 100%;
    }
}

@media (max-width: 414px) {
    .repair-form__contact-form {
        gap: 0;
    }

    .repair-form__fields {
        gap: 24px;
        flex-direction: column;
    }

    .repair-form__fields-column {
        gap: 24px;
    }

    .repair-form__field {
        gap: 8px;
    }

    .repair-form__label {
        font-size: 3.38vw; /* 14px at 414px */
        line-height: 4.83vw; /* 20px at 414px */
    }

    .repair-form__required {
        font-size: 2.42vw; /* 10px at 414px */
        line-height: 3.86vw; /* 16px at 414px */
    }

    .repair-form__input {
        padding: 16px;
        font-size: 16px;
        line-height: 24px;
        border-radius: 16px;
    }

    .repair-form__checkbox-wrapper {
        gap: 1.93vw; /* 8px at 414px */
        margin-top: 32px;
    }

    .repair-form__checkbox {
        width: 20px;
        height: 20px;
        border-radius: 6px;
    }

    .repair-form__checkbox-label {
        font-size: 2.90vw; /* 12px at 414px */
        line-height: 4.35vw; /* 18px at 414px */
    }

    .repair-form__actions[data-step="2"] {
        gap: 3.38vw; /* 14px at 414px */
    }
}

@media (max-width: 413px) {
    .repair-form__contact-form {
        gap: 0;
    }

    .repair-form__fields {
        gap: 5.80vw;
        flex-direction: column;
    }

    .repair-form__fields-column {
        gap: 5.80vw;
    }

    .repair-form__field {
        gap: 1.93vw;
    }

    .repair-form__input {
        padding: 3.86vw;
        border-radius: 3.86vw;
    }

    .repair-form__label {
        font-size: 3.38vw;
        line-height: 4.83vw;
    }

    .repair-form__required {
        font-size: 2.42vw;
        line-height: 3.86vw;
    }

    .repair-form__checkbox-wrapper {
        gap: 8px;
        margin-top: 7.73vw;
    }

    .repair-form__checkbox {
        width: 20px;
        height: 20px;
        border-radius: 6px;
    }

    .repair-form__checkbox-label {
        font-size: 2.90vw;
        line-height: 4.35vw;
    }

    .repair-form__actions[data-step="2"] {
        gap: 3.38vw;
    }
}

@media (max-width: 390px) {
    .repair-form__input {
        font-size: calc(16px * 100vw / 390);
        line-height: calc(24px * 100vw / 390);
    }
}

/* Privacy Policy Page */
.privacy-policy-section {
    padding-top: clamp(80px, calc(80px + (100vw - 1140px) * 0 / 300), 80px);
    padding-bottom: clamp(80px, calc(80px + (100vw - 1140px) * 0 / 300), 80px);
}

.privacy-policy-container {
    max-width: 640px;
    margin: 0 auto;
}

.privacy-policy-heading {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 48px;
}

.privacy-policy-title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: 32px;
    line-height: 40px;
    color: #141000;
    margin: 0;
}

.privacy-policy-company {
    font-family: 'Unbounded', sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    color: #141000;
    margin: 0;
}

.privacy-policy-content {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.privacy-policy-paragraph {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.privacy-policy-paragraph .privacy-policy-paragraph {
    gap: 8px;
}

.privacy-policy-subtitle {
    font-family: 'Unbounded', sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    color: #141000;
    margin: 0;
}

.privacy-policy-subtitle-note {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #141000;
    margin: 0;
}

.privacy-policy-text {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #141000;
}

.privacy-policy-text p {
    margin: 0 0 12px 0;
}

.privacy-policy-text p:last-child {
    margin-bottom: 0;
}

.privacy-policy-list {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 0;
    color: #141000;
    list-style: decimal;
    margin: 0;
    padding-left: 24px;
}

.privacy-policy-list li {
    margin-bottom: 12px;
    line-height: 24px;
}

.privacy-policy-list li:last-child {
    margin-bottom: 0;
}

.privacy-policy-list li span {
    line-height: 24px;
}

.privacy-policy-list li strong {
    font-weight: 600;
}

.privacy-policy-link {
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

.privacy-policy-link:hover,
.privacy-policy-link:focus,
.privacy-policy-link:active {
    text-decoration: none;
    color: inherit;
}

/* Responsive styles for Privacy Policy */
@media (max-width: 1139px) {
    .privacy-policy-title {
        font-size: clamp(28px, calc(28px + (100vw - 414px) * 4 / 725), 32px);
        line-height: clamp(40px, calc(40px + (100vw - 414px) * 0 / 725), 40px);
    }

    .privacy-policy-company {
        font-size: clamp(18px, calc(18px + (100vw - 414px) * 2 / 725), 20px);
        line-height: clamp(28px, calc(28px + (100vw - 414px) * 2 / 725), 30px);
    }

    .privacy-policy-subtitle {
        font-size: clamp(18px, calc(18px + (100vw - 414px) * 2 / 725), 20px);
        line-height: clamp(28px, calc(28px + (100vw - 414px) * 2 / 725), 30px);
    }

    .privacy-policy-text,
    .privacy-policy-list,
    .privacy-policy-subtitle-note {
        font-size: clamp(14px, calc(14px + (100vw - 414px) * 2 / 725), 16px);
        line-height: clamp(22px, calc(22px + (100vw - 414px) * 2 / 725), 24px);
    }

    .privacy-policy-list li span {
        line-height: clamp(22px, calc(22px + (100vw - 414px) * 2 / 725), 24px);
    }
}

@media (max-width: 724px) {
    .privacy-policy-heading {
        text-align: left;
    }
}

@media (max-width: 619px) {
    .privacy-policy-section {
        padding-top: 32px;
        padding-bottom: 32px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .privacy-policy-container {
        padding-left: 0;
        padding-right: 0;
    }

    .privacy-policy-heading {
        margin-bottom: 32px;
    }

    .privacy-policy-title {
        font-size: 28px;
        line-height: 40px;
    }

    .privacy-policy-company {
        font-size: 18px;
        line-height: 28px;
    }

    .privacy-policy-content {
        gap: 32px;
    }

    .privacy-policy-paragraph {
        gap: 16px;
    }

    .privacy-policy-subtitle {
        font-size: 18px;
        line-height: 28px;
    }

    .privacy-policy-text,
    .privacy-policy-list,
    .privacy-policy-subtitle-note {
        font-size: 14px;
        line-height: 22px;
    }

    .privacy-policy-list li {
        margin-bottom: 8px;
    }

    .privacy-policy-list li span {
        line-height: 22px;
    }
}

/* Naprawa Page Styles */
.naprawa-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.naprawa-heading {
    display: flex;
    flex-direction: column;
    gap: 0;
    align-items: flex-start;
    justify-content: center;
    padding: 64px 48px 80px;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    box-sizing: border-box;
}

.naprawa-heading-title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: 48px;
    line-height: 56px;
    color: #141000;
    text-align: left;
    margin: 0;
}

.naprawa-heading-description {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #0D0F12;
    text-align: left;
    margin: 24px 0 0 0;
    width: 100%;
}

/* Use Noto Sans for Ukrainian and Russian versions in naprawa page description and cards */
body.lang-uk .naprawa-heading-description,
body.lang-uk .naprawa-card-text,
body.lang-ru .naprawa-heading-description,
body.lang-ru .naprawa-card-text {
    font-family: 'Noto Sans', sans-serif;
}

.naprawa-container {
    max-width: 1440px;
    margin: 0 auto;
    padding-left: 48px;
    padding-right: 48px;
    padding-bottom: 80px;
    width: 100%;
}

.naprawa-cards-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    width: 100%;
}

.naprawa-card {
    background: #f9fafa;
    border-radius: 24px;
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 64px;
    align-items: flex-start;
    justify-content: center;
    flex: 1 1 calc(33.333% - 11px);
    min-width: 340px;
    border: 1px solid transparent;
    transition: border-color 0.3s ease;
    text-decoration: none;
    color: inherit;
}

.naprawa-card:hover {
    border-color: #141000;
}

.naprawa-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
}

.naprawa-card-title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 400;
    font-size: 28px;
    line-height: 40px;
    color: #141000;
    margin: 0;
    padding: 0;
    height: 80px;
    overflow: hidden;
    white-space: normal;
}

.naprawa-card-arrow {
    width: 28px;
    height: 32px;
    flex-shrink: 0;
    padding-top: 4px;
    display: flex;
    align-items: flex-start;
}

.naprawa-card-arrow img {
    width: 28px;
    height: 28px;
    display: block;
}

.naprawa-card-icon-container {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    width: 100%;
    overflow: hidden;
    opacity: 0;
    transform: scale(0.8);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

/* Fallback: show icons by default on Safari mobile if JS doesn't work */
@supports (-webkit-touch-callout: none) {
    @media (max-width: 768px) {
        .naprawa-card-icon-container:not(.animate) {
            opacity: 1;
            transform: scale(1);
        }
    }
}

/* Show icons if JavaScript is disabled (fallback) */
.no-js .naprawa-card-icon-container {
    opacity: 1;
    transform: scale(1);
}

/* Animate icons when they become visible */
.naprawa-card-icon-container.animate {
    opacity: 1;
    transform: scale(1);
}

.naprawa-card-icon-img {
    width: 80px;
    height: 80px;
    display: block;
    flex-shrink: 0;
}

.naprawa-card-text {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #0d0f12;
    margin: 0;
    height: 84px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

/* Responsive styles for Naprawa Page */
@media (min-width: 725px) and (max-width: 1139px) {
    .naprawa-heading-title {
        font-size: 40px;
        line-height: 48px;
    }
}

@media (min-width: 620px) and (max-width: 724px) {
    .naprawa-heading {
        padding: 64px 40px;
    }

    .naprawa-heading-title {
        font-size: 40px;
        line-height: 48px;
    }

    .naprawa-heading-description {
        font-size: 18px;
        line-height: 28px;
    }

    .naprawa-container {
        padding-left: 40px;
        padding-right: 40px;
    }
}

@media (max-width: 619px) {
    .naprawa-heading {
        padding: 32px 20px;
    }

    .naprawa-heading-title {
        font-size: 28px;
        line-height: 40px;
    }

    .naprawa-heading-description {
        font-size: 16px;
        line-height: 24px;
    }

    .naprawa-container {
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 40px;
    }

    .naprawa-cards-grid {
        gap: 12px;
    }

    .naprawa-card {
        min-width: 100%;
        flex: 1 1 100%;
        padding: 24px;
        gap: 0;
        background-color: #F4F8F8;
    }

    .naprawa-card-title {
        font-size: 24px;
        line-height: 32px;
        height: 64px;
    }

    .naprawa-card-icon-container {
        margin-top: 56px;
    }

    .naprawa-card-icon-img {
        width: 72px;
        height: 72px;
    }

    .naprawa-card-text {
        font-size: 16px;
        line-height: 24px;
        height: 72px;
        margin-top: 56px;
        -webkit-line-clamp: 3;
        line-clamp: 3;
    }
}

/* Fixed values for 414px */
@media (min-width: 414px) and (max-width: 619px) {
    .naprawa-heading {
        padding: 32px 20px;
    }

    .naprawa-heading-title {
        font-size: 28px;
        line-height: 40px;
    }

    .naprawa-heading-description {
        font-size: 16px;
        line-height: 24px;
    }

    .naprawa-container {
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 40px;
    }

    .naprawa-cards-grid {
        gap: 12px;
    }

    .naprawa-card {
        min-width: 100%;
        flex: 1 1 100%;
        padding: 24px;
        gap: 0;
        background-color: #F4F8F8;
    }

    .naprawa-card-title {
        font-size: 24px;
        line-height: 32px;
        height: 64px;
    }

    .naprawa-card-icon-container {
        margin-top: 56px;
    }

    .naprawa-card-icon-img {
        width: 72px;
        height: 72px;
    }

    .naprawa-card-text {
        font-size: 16px;
        line-height: 24px;
        height: 72px;
        margin-top: 56px;
        -webkit-line-clamp: 3;
        line-clamp: 3;
    }
}

@media (min-width: 414px) and (max-width: 441px) {
    .naprawa-heading-title .naprawa-heading-agd {
        display: none;
    }
}

@media (max-width: 413px) {
    .naprawa-heading-title .naprawa-heading-agd {
        display: none;
    }
}

/* Viewport-based scaling for 413px and below - пропорційне масштабування від значень на 414px */
@media (max-width: 413px) {
    .naprawa-heading {
        padding-top: 7.73vw; /* 32px at 414px */
        padding-right: 4.83vw; /* 20px at 414px */
        padding-bottom: 7.73vw; /* 32px at 414px */
        padding-left: 4.83vw; /* 20px at 414px */
    }

    .naprawa-heading-title {
        font-size: 6.76vw; /* 28px at 414px */
        line-height: 9.66vw; /* 40px at 414px */
    }

    .naprawa-heading-description {
        font-size: 3.86vw; /* 16px at 414px */
        line-height: 5.80vw; /* 24px at 414px */
        margin-top: 5.80vw; /* 24px at 414px */
    }

    .naprawa-container {
        padding-left: 4.83vw; /* 20px at 414px */
        padding-right: 4.83vw; /* 20px at 414px */
        padding-bottom: 9.66vw; /* 40px at 414px */
    }

    .naprawa-cards-grid {
        gap: 2.90vw; /* 12px at 414px */
    }

    .naprawa-card {
        min-width: 100%;
        flex: 1 1 100%;
        padding: 5.80vw; /* 24px at 414px */
        gap: 0;
        border-radius: 5.80vw; /* 24px at 414px */
        background-color: #F4F8F8;
    }

    .naprawa-card-title {
        font-size: 5.80vw; /* 24px at 414px */
        line-height: 7.73vw; /* 32px at 414px */
        height: 15.46vw; /* 64px at 414px */
    }

    .naprawa-card-arrow {
        width: 6.76vw; /* 28px at 414px */
        height: 7.73vw; /* 32px at 414px */
        padding-top: 0.97vw; /* 4px at 414px */
    }

    .naprawa-card-arrow img {
        width: 6.76vw; /* 28px at 414px */
        height: 6.76vw; /* 28px at 414px */
    }

    .naprawa-card-icon-container {
        margin-top: 13.53vw; /* 56px at 414px */
    }

    .naprawa-card-icon-img {
        width: 17.39vw; /* 72px at 414px */
        height: 17.39vw; /* 72px at 414px */
    }

    .naprawa-card-text {
        font-size: 3.86vw; /* 16px at 414px */
        line-height: 5.80vw; /* 24px at 414px */
        height: 17.39vw; /* 72px at 414px */
        margin-top: 13.53vw; /* 56px at 414px */
        -webkit-line-clamp: 3;
        line-clamp: 3;
    }
}

/* Article Page Styles */
.article-content {
    display: flex;
    flex-direction: column;
    gap: 0;
    align-items: center;
    width: 100%;
    min-height: 100vh;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

/*
 * Homepage sections (.section) sit in .main-content without align-items:center.
 * Inside .article-content, align-items:center shrink-wraps flex items, so
 * benefit / experience / features lose full width and responsive rules break.
 */
.article-content > .section {
    align-self: stretch;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

/* Article Header */
.article-header {
    width: 100%;
    padding-top: 80px;
    padding-bottom: 0;
}

.article-header-container {
    max-width: 1280px;
    margin: 0 auto;
    padding-left: 32px;
    padding-right: 32px;
    box-sizing: border-box;
}

.article-header-content {
    display: flex;
    flex-direction: column;
    gap: 32px;
    align-items: center;
    width: 100%;
}

@media (max-width: 515px) {
    .article-header-content {
        gap: 24px;
    }
}

.article-icon-container {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    width: 768px;
    max-width: 100%;
}

.article-icon {
    background: #f9fafa;
    border: 2.55px solid #141000;
    border-radius: 9999px;
    padding: 26px;
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
}

.article-icon--blue {
    background: #C4DFFF;
}

.article-icon--orange {
    background: #FF9F59;
}

.article-icon-img {
    width: 52px;
    height: 52px;
    display: block;
}

.article-icon--tall {
    padding-top: 13px;
    padding-bottom: 13px;
    padding-left: 26px;
    padding-right: 26px;
}

.article-icon-img--tall {
    width: 52px;
    height: 78px;
}

/* Dyson vacuum hero: tall SVG, no top padding in circle; bottom 26px like standard */
.article-icon--dyson-vacuum {
    align-items: flex-start;
    padding-top: 0;
    padding-bottom: 26px;
    padding-left: 26px;
    padding-right: 26px;
    overflow: visible;
}

/* Shift artwork up — SVG stem starts below viewBox top, removes visible blue gap under circle rim */
.article-icon--dyson-vacuum .article-icon-img--tall {
    transform: translateY(-3px);
}

.article-heading-section {
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
    max-width: 814px;
    width: 100%;
    text-align: center;
}

.article-title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: 48px;
    line-height: 60px;
    color: #141000;
    margin: 0;
    width: 100%;
}

@media (min-width: 1201px) {
    .article-title {
        font-size: 56px;
        line-height: 72px;
    }
}

/* UK Thermomix: ≤418px — «Ремонт пристроїв» в один рядок, «Thermomix» в другий */
body.lang-uk .article-title__br-thermomix-uk-narrow {
    display: none;
}

@media (max-width: 418px) {
    body.lang-uk .article-title__br-thermomix-uk-desktop {
        display: none;
    }

    body.lang-uk .article-title__br-thermomix-uk-narrow {
        display: inline;
    }
}

.article-description {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    color: #141000;
    margin: 0;
    width: 100%;
}

.article-tags {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.article-tag {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #141000;
    padding: 6px 16px;
    border: 1px solid #141000;
    border-radius: 9999px;
    white-space: nowrap;
}

.article-tag-dot {
    width: 6px;
    height: 6px;
    background: #141000;
    border-radius: 50%;
    flex-shrink: 0;
}

.article-header__phone-btn {
    margin-top: 16px;
    flex-shrink: 0;
    gap: 12px;
}

.article-header__phone-btn__icon-wrap {
    position: relative;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    z-index: 2;
}

.article-header__phone-btn__icon-img {
    display: block;
    width: 20px;
    height: 20px;
}

.article-header__phone-btn__icon-img--original {
    transition: opacity 0.3s ease;
}

.article-header__phone-btn__icon-img--hover {
    position: absolute;
    top: 0;
    left: 0;
    filter: brightness(0);
    transform: translateY(250%);
    opacity: 0;
    transition: transform 0.5s ease, opacity 0.3s ease;
}

.article-header__phone-btn:hover .article-header__phone-btn__icon-img--original {
    opacity: 0;
}

.article-header__phone-btn:hover .article-header__phone-btn__icon-img--hover {
    transform: translateY(0);
    opacity: 1;
}

/* Article Section */
.article-section {
    width: 100%;
    padding-top: 0;
    padding-bottom: 96px;
}

.article-section-container {
    max-width: 1280px;
    margin: 0 auto;
    padding-left: 32px;
    padding-right: 32px;
    box-sizing: border-box;
}

.article-section-content {
    display: flex;
    flex-direction: column;
    gap: 48px;
    align-items: center;
    width: 100%;
}

.article-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    max-width: 720px;
    width: 100%;
}

.article-text-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
}

.article-text-heading {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: 28px;
    line-height: 40px;
    color: #141000;
    margin: 0;
    width: 100%;
}

/* Subsequent article headings (faults / why / tips): smaller than the first,
   with a bit of extra space above for clearer separation from the previous block */
.article-text .article-text-heading--sub {
    font-size: 22px;
    line-height: 30px;
    margin-top: 0.8em;
}

.article-text-subheading {
    font-family: 'Sora', sans-serif;
    font-weight: 500;
    font-size: 18px;
    line-height: 28px;
    color: #141000;
    margin: 0;
    margin-left: 27px;
    position: relative;
    width: 100%;
}

.article-text-subheading::before {
    content: '▪';
    position: absolute;
    left: -27px;
    color: #141000;
    font-size: 12px;
    line-height: 28px;
}

.article-text-spacing {
    height: 18px;
    width: 100%;
}

.article-text-paragraph {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #141000;
    width: 100%;
}

.article-text-paragraph p {
    margin: 0 0 18px 0;
}

.article-text-paragraph p:last-child {
    margin-bottom: 0;
}

.article-text-list {
    list-style: none;
    padding: 0;
    margin: 0;
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #141000;
    width: 100%;
}

.article-text-list li {
    margin-bottom: 12px;
    margin-left: 27px;
    position: relative;
}

.article-text-list li:last-child {
    margin-bottom: 0;
}

.article-text-list li::before {
    content: '▪';
    position: absolute;
    left: -27px;
    color: #141000;
}

/* Use Noto Sans for Ukrainian and Russian languages in articles */
body.lang-uk .article-description,
body.lang-uk .article-tag,
body.lang-uk .article-text-subheading,
body.lang-uk .article-text-paragraph,
body.lang-uk .article-text-list,
body.lang-ru .article-description,
body.lang-ru .article-tag,
body.lang-ru .article-text-subheading,
body.lang-ru .article-text-paragraph,
body.lang-ru .article-text-list {
    font-family: 'Noto Sans', sans-serif;
}

.article-cta {
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: center;
    margin-top: 64px;
}

.article-cta .cta-button {
    height: 68px;
    padding: 0 36px;
    font-size: 17px;
    line-height: 28px;
}

/* Responsive Styles for Article */
@media (max-width: 992px) {
    .article-header-container,
    .article-section-container {
        padding-left: 40px;
        padding-right: 40px;
    }
}

@media (max-width: 515px) {
    .article-icon-container {
        justify-content: flex-start;
        width: 100%;
    }

    .article-heading-section {
        text-align: left;
        align-items: flex-start;
    }

    .article-tags {
        justify-content: flex-start;
    }

    .article-cta {
        justify-content: center;
    }
}

@media (max-width: 724px) {
    .article-header {
        padding-top: 64px;
    }

    .article-header-container,
    .article-section-container {
        padding-left: 20px;
        padding-right: 20px;
    }

    .article-title {
        font-size: clamp(32px, calc(32px + (100vw - 619px) * (40 - 32) / (724 - 619)), 40px);
        line-height: clamp(40px, calc(40px + (100vw - 619px) * (48 - 40) / (724 - 619)), 48px);
    }

    .article-description {
        font-size: 18px;
        line-height: 28px;
    }

    .article-text-heading {
        font-size: 24px;
        line-height: 32px;
    }

    .article-text .article-text-heading--sub {
        font-size: 20px;
        line-height: 28px;
    }

    .article-text-paragraph,
    .article-text-list {
        font-size: 16px;
        line-height: 24px;
    }
}

@media (max-width: 619px) {
    .article-content {
        gap: 0;
    }

    .article-header {
        padding-top: 32px;
    }

    .article-header-content {
        gap: 24px;
    }

    .article-icon {
        padding: 20px;
    }

    .article-icon--tall {
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .article-icon--dyson-vacuum {
        padding-top: 0;
        padding-bottom: 20px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .article-icon--dyson-vacuum .article-icon-img--tall {
        transform: translateY(-2px);
    }

    .article-icon-img {
        width: 40px;
        height: 40px;
    }

    .article-icon-img--tall {
        width: 40px;
        height: 60px;
    }

    .article-heading-section {
        gap: 16px;
    }

    .article-title {
        font-size: 28px;
        line-height: 36px;
    }

    .article-description {
        font-size: 16px;
        line-height: 24px;
    }

    .article-tags {
        gap: 8px;
    }

    .article-tag {
        font-size: 16px;
        line-height: 24px;
        padding: 6px 16px;
    }

    .article-tag-dot {
        width: 6px;
        height: 6px;
    }

    .article-section {
        padding-bottom: 64px;
    }

    .article-section-content {
        gap: 32px;
    }

    .article-text-heading {
        font-size: 22px;
        line-height: 30px;
    }

    .article-text .article-text-heading--sub {
        font-size: 18px;
        line-height: 26px;
    }

    .article-text-subheading {
        font-size: 16px;
        line-height: 24px;
        margin-left: 27px;
    }

    .article-text-subheading::before {
        left: -27px;
        font-size: 10px;
        line-height: 24px;
    }

    .article-text-paragraph,
    .article-text-list {
        font-size: 16px;
        line-height: 24px;
    }

    .article-cta {
        margin-top: 48px;
    }

    .article-cta .cta-button {
        height: 68px;
        padding: 0 36px;
        font-size: 17px;
        line-height: 28px;
    }
}

/* Fixed values at 414px */
@media (max-width: 414px) {
    .article-header {
        padding-top: 32px;
    }

    .article-header-container,
    .article-section-container {
        padding-left: 20px;
        padding-right: 20px;
    }

    .article-header-content {
        gap: 24px;
    }

    .article-icon {
        padding: 20px;
        border-width: 2.55px;
    }

    .article-icon--tall {
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .article-icon--dyson-vacuum {
        padding-top: 0;
        padding-bottom: 20px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .article-icon--dyson-vacuum .article-icon-img--tall {
        transform: translateY(-2px);
    }

    .article-icon-img {
        width: 40px;
        height: 40px;
    }

    .article-icon-img--tall {
        width: 40px;
        height: 60px;
    }

    .article-heading-section {
        gap: 16px;
    }

    .article-title {
        font-size: 28px;
        line-height: 36px;
    }

    .article-description {
        font-size: 16px;
        line-height: 24px;
    }

    .article-section {
        padding-bottom: 64px;
    }

    .article-section-content {
        gap: 32px;
    }

    .article-text-heading {
        font-size: 22px;
        line-height: 30px;
    }

    .article-text .article-text-heading--sub {
        font-size: 18px;
        line-height: 26px;
    }

    .article-text-spacing {
        height: 18px;
    }

    .article-text-paragraph,
    .article-text-list {
        font-size: 16px;
        line-height: 24px;
    }

    .article-text-paragraph p {
        margin-bottom: 18px;
    }

    .article-text-list li {
        margin-bottom: 12px;
        margin-left: 27px;
    }

    .article-text-list li::before {
        left: -27px;
    }

    .article-cta {
        margin-top: 48px;
        gap: 14px;
    }

    .article-cta .cta-button {
        height: 68px;
        padding: 0 36px;
        font-size: 17px;
        line-height: 28px;
    }
}

/* Russian article tags (Быстро / Профессионально / Надёжно): fluid scale from 455px */
@media (max-width: 455px) {
    body.lang-ru .article-tags {
        gap: max(6px, calc(8 / 455 * 100vw));
    }

    body.lang-ru .article-tag {
        font-size: max(11.5px, calc(15 / 455 * 100vw));
        line-height: max(17px, calc(22 / 455 * 100vw));
        padding: max(4px, calc(5 / 455 * 100vw)) max(10px, calc(12 / 455 * 100vw));
        border-width: 1px;
    }

    body.lang-ru .article-tag-dot {
        width: max(5px, calc(5.5 / 455 * 100vw));
        height: max(5px, calc(5.5 / 455 * 100vw));
    }
}

/* Article tags: vw scale from 430px; ×0.95 — slightly smaller than pure 414 ref */
@media (max-width: 430px) {
    .article-tags {
        gap: calc(8 / 414 * 100vw * 0.95);
    }

    .article-tag {
        font-size: calc(16 / 414 * 100vw * 0.95);
        line-height: calc(24 / 414 * 100vw * 0.95);
        padding: calc(6 / 414 * 100vw * 0.95) calc(16 / 414 * 100vw * 0.95);
        border-width: 1px;
    }

    .article-tag-dot {
        width: calc(6 / 414 * 100vw * 0.95);
        height: calc(6 / 414 * 100vw * 0.95);
    }
}

/* Viewport-based scaling for 413px and below - vw-based scaling from 414px values */
/* Formula: value_in_px / 414 * 100 = value_in_vw */
@media (max-width: 413px) {
    .article-header {
        padding-top: 7.73vw; /* 32px / 414 * 100 = 7.73vw */
    }

    .article-header-container,
    .article-section-container {
        padding-left: 4.83vw; /* 20px / 414 * 100 = 4.83vw */
        padding-right: 4.83vw;
    }

    .article-header-content {
        gap: 5.80vw; /* 24px / 414 * 100 = 5.80vw */
    }

    .article-icon {
        padding: 4.83vw; /* 20px / 414 * 100 = 4.83vw */
        border-width: 0.62vw; /* 2.55px / 414 * 100 = 0.62vw */
    }

    .article-icon--tall {
        padding-top: 2.42vw; /* ~10px / 414 */
        padding-bottom: 2.42vw;
        padding-left: 4.83vw;
        padding-right: 4.83vw;
    }

    .article-icon--dyson-vacuum {
        padding-top: 0;
        padding-bottom: 4.83vw;
        padding-left: 4.83vw;
        padding-right: 4.83vw;
    }

    .article-icon--dyson-vacuum .article-icon-img--tall {
        transform: translateY(calc(-2 / 414 * 100vw));
    }

    .article-icon-img {
        width: 9.66vw; /* 40px / 414 * 100 = 9.66vw */
        height: 9.66vw;
    }

    .article-icon-img--tall {
        width: 9.66vw;
        height: 14.49vw; /* 9.66 * 78/52 */
    }

    .article-heading-section {
        gap: 3.86vw; /* 16px / 414 * 100 = 3.86vw */
    }

    .article-title {
        font-size: 6.76vw; /* 28px / 414 * 100 = 6.76vw */
        line-height: 8.70vw; /* 36px / 414 * 100 = 8.70vw */
    }

    .article-description {
        font-size: 3.86vw; /* 16px / 414 * 100 = 3.86vw */
        line-height: 5.80vw; /* 24px / 414 * 100 = 5.80vw */
    }

    .article-section {
        padding-bottom: 15.46vw; /* 64px / 414 * 100 = 15.46vw */
    }

    .article-section-content {
        gap: 7.73vw; /* 32px / 414 * 100 = 7.73vw */
    }

    .article-text-heading {
        font-size: 5.31vw; /* 22px / 414 * 100 = 5.31vw */
        line-height: 7.25vw; /* 30px / 414 * 100 = 7.25vw */
    }

    .article-text .article-text-heading--sub {
        font-size: 4.35vw; /* 18px / 414 * 100 = 4.35vw */
        line-height: 5.92vw; /* 24.5px / 414 * 100 = 5.92vw */
    }

    .article-text-subheading {
        font-size: 3.86vw; /* 16px / 414 * 100 = 3.86vw */
        line-height: 5.80vw; /* 24px / 414 * 100 = 5.80vw */
        margin-left: 6.52vw; /* 27px / 414 * 100 = 6.52vw */
    }

    .article-text-subheading::before {
        left: -6.52vw; /* -27px / 414 * 100 = -6.52vw */
        font-size: 2.42vw; /* 10px / 414 * 100 = 2.42vw */
        line-height: 5.80vw; /* 24px / 414 * 100 = 5.80vw */
    }

    .article-text-spacing {
        height: 4.35vw; /* 18px / 414 * 100 = 4.35vw */
    }

    .article-text-paragraph,
    .article-text-list {
        font-size: 3.86vw; /* 16px / 414 * 100 = 3.86vw */
        line-height: 5.80vw; /* 24px / 414 * 100 = 5.80vw */
    }

    .article-text-paragraph p {
        margin-bottom: 4.35vw; /* 18px / 414 * 100 = 4.35vw */
    }

    .article-text-list li {
        margin-bottom: 2.90vw; /* 12px / 414 * 100 = 2.90vw */
        margin-left: 6.52vw; /* 27px / 414 * 100 = 6.52vw */
    }

    .article-text-list li::before {
        left: -6.52vw; /* -27px / 414 * 100 = -6.52vw */
    }

    .article-cta {
        margin-top: 11.59vw; /* 48px / 414 * 100 = 11.59vw */
        gap: 3.38vw; /* 14px / 414 * 100 = 3.38vw */
    }

    .article-cta .cta-button {
        height: 16.43vw; /* 68px / 414 * 100 = 16.43vw */
        padding: 0 8.70vw; /* 36px / 414 * 100 = 8.70vw */
        font-size: 4.11vw; /* 17px / 414 * 100 = 4.11vw */
        line-height: 6.76vw; /* 28px / 414 * 100 = 6.76vw */
    }
}

/* Contact Page Styles */
.contact-page-header {
    padding-top: 64px;
    padding-bottom: 64px;
}

.contact-page-container {
    max-width: 1440px;
    margin: 0 auto;
    padding-left: 48px;
    padding-right: 48px;
}

.contact-page-content {
    display: flex;
    flex-direction: column;
    gap: 48px;
}

.contact-page-heading {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.contact-page-heading-group {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.contact-page-subtitle {
    font-family: 'Sora', sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #141000;
    margin: 0;
}

.contact-page-title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 500;
    font-size: 48px;
    line-height: 60px;
    color: #181d27;
    margin: 0;
    letter-spacing: -0.96px;
}

.contact-page-description {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    color: #141000;
    margin: 0;
}

/* Use Noto Sans for Ukrainian and Russian languages in contact page */
body.lang-uk .contact-page-description,
body.lang-ru .contact-page-description,
body.lang-uk .contact-card-description,
body.lang-ru .contact-card-description,
body.lang-uk .contact-card-link,
body.lang-ru .contact-card-link {
    font-family: 'Noto Sans', sans-serif;
}

.contact-cards-section {
    padding-bottom: 96px;
}

.contact-cards-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: flex-start;
}

.contact-card {
    flex: 1;
    min-width: 280px;
    background: #c4dfff;
    border-radius: 24px;
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 62px;
}

.contact-card--blue {
    background: #c4dfff;
}

.contact-card--orange {
    background: #ff9f59;
}

.contact-card--green {
    background: #ccea78;
}

.contact-card-icon {
    width: 64px;
    height: 64px;
    flex-shrink: 0;
}

.contact-card-icon-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.contact-card-content {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.contact-card-text-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.contact-card-title {
    font-family: 'Unbounded', sans-serif;
    font-weight: 400;
    font-size: 22px;
    line-height: 30px;
    color: #141000;
    margin: 0;
}

.contact-card-description {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: rgba(20, 16, 0, 0.8);
    margin: 0;
}

.contact-card-link {
    font-family: 'Sora', sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #141000;
    text-decoration: none;
    white-space: nowrap;
}

/* Contact Page Viewport-based scaling (1140px-1440px) */
@media (min-width: 1140px) and (max-width: 1440px) {
    .contact-page-header {
        padding-top: clamp(50.67px, calc(50.67px + (100vw - 1140px) * 13.33 / 300), 64px);
        padding-bottom: clamp(50.67px, calc(50.67px + (100vw - 1140px) * 13.33 / 300), 64px);
    }

    .contact-page-container {
        padding-left: clamp(38px, calc(38px + (100vw - 1140px) * 10 / 300), 48px);
        padding-right: clamp(38px, calc(38px + (100vw - 1140px) * 10 / 300), 48px);
    }

    .contact-page-content {
        gap: clamp(38px, calc(38px + (100vw - 1140px) * 10 / 300), 48px);
    }

    .contact-page-heading {
        gap: clamp(19px, calc(19px + (100vw - 1140px) * 5 / 300), 24px);
    }

    .contact-page-heading-group {
        gap: clamp(9.5px, calc(9.5px + (100vw - 1140px) * 2.5 / 300), 12px);
    }

    .contact-page-title {
        font-size: clamp(38px, calc(38px + (100vw - 1140px) * 10 / 300), 48px);
        line-height: clamp(47.5px, calc(47.5px + (100vw - 1140px) * 12.5 / 300), 60px);
        letter-spacing: clamp(-0.76px, calc(-0.76px + (100vw - 1140px) * -0.2 / 300), -0.96px);
    }

    .contact-page-description {
        font-size: clamp(15.83px, calc(15.83px + (100vw - 1140px) * 4.17 / 300), 20px);
        line-height: clamp(23.75px, calc(23.75px + (100vw - 1140px) * 6.25 / 300), 30px);
    }

    .contact-cards-section {
        padding-bottom: clamp(76px, calc(76px + (100vw - 1140px) * 20 / 300), 96px);
    }

    .contact-cards-grid {
        gap: clamp(12.67px, calc(12.67px + (100vw - 1140px) * 3.33 / 300), 16px);
    }

    .contact-card {
        padding: clamp(25.33px, calc(25.33px + (100vw - 1140px) * 6.67 / 300), 32px);
        gap: clamp(49.17px, calc(49.17px + (100vw - 1140px) * 12.83 / 300), 62px);
        border-radius: clamp(19px, calc(19px + (100vw - 1140px) * 5 / 300), 24px);
    }

    .contact-card-icon {
        width: clamp(50.67px, calc(50.67px + (100vw - 1140px) * 13.33 / 300), 64px);
        height: clamp(50.67px, calc(50.67px + (100vw - 1140px) * 13.33 / 300), 64px);
    }

    .contact-card-content {
        gap: clamp(15.83px, calc(15.83px + (100vw - 1140px) * 4.17 / 300), 20px);
    }

    .contact-card-text-group {
        gap: clamp(6.33px, calc(6.33px + (100vw - 1140px) * 1.67 / 300), 8px);
    }

    .contact-card-title {
        font-size: clamp(17.42px, calc(17.42px + (100vw - 1140px) * 4.58 / 300), 22px);
        line-height: clamp(23.75px, calc(23.75px + (100vw - 1140px) * 6.25 / 300), 30px);
    }

    .contact-card-description,
    .contact-card-link {
        font-size: clamp(12.67px, calc(12.67px + (100vw - 1140px) * 3.33 / 300), 16px);
        line-height: clamp(19px, calc(19px + (100vw - 1140px) * 5 / 300), 24px);
    }
}

/* Contact Page Responsive Styles */
@media (max-width: 992px) {
    .contact-page-header {
        padding-top: 48px;
        padding-bottom: 48px;
    }

    .contact-cards-section {
        padding-bottom: 64px;
    }
}

@media (min-width: 620px) and (max-width: 992px) {
    .contact-page-container {
        padding-left: 40px;
        padding-right: 40px;
    }
}

@media (max-width: 1139px) {
    .contact-page-title {
        font-size: 40px;
        line-height: 48px;
        letter-spacing: -0.8px;
    }

    .contact-page-description {
        font-size: 18px;
        line-height: 28px;
    }

    .contact-cards-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    .contact-card:nth-child(3) {
        grid-column: 1 / -1;
    }
}

@media (min-width: 725px) and (max-width: 810px) {
    .contact-card--orange .contact-card-description {
        min-height: 48px;
    }
}

@media (max-width: 724px) {
    .contact-cards-grid {
        display: flex;
        flex-direction: column;
    }

    .contact-card {
        min-width: 100%;
    }

    .contact-card:nth-child(3) {
        grid-column: auto;
    }
}

@media (max-width: 619px) {
    .contact-page-header {
        padding-top: 32px;
        padding-bottom: 32px;
    }

    .contact-page-container {
        padding-left: 20px;
        padding-right: 20px;
    }

    .contact-page-heading {
        gap: 16px;
    }

    .contact-page-heading-group {
        gap: 8px;
    }

    .contact-page-subtitle {
        font-size: 14px;
        line-height: 20px;
    }

    .contact-page-title {
        font-size: 28px;
        line-height: 40px;
        letter-spacing: -0.56px;
    }

    .contact-page-description {
        font-size: 16px;
        line-height: 24px;
    }

    .contact-cards-section {
        padding-bottom: 48px;
    }

    .contact-cards-grid {
        gap: 16px;
    }

    .contact-card {
        padding: 24px;
        gap: 56px;
    }

    .contact-card-icon {
        width: 56px;
        height: 56px;
    }

    .contact-card-title {
        font-size: 20px;
        line-height: 28px;
    }

    .contact-card-description {
        font-size: 14px;
        line-height: 20px;
    }

    .contact-card-link {
        font-size: 16px;
        line-height: 24px;
        font-weight: 500;
    }
}

@media (max-width: 446px) {
    /* Line breaks disabled for English and Ukrainian versions */
    body:not(.lang-en):not(.lang-uk) .contact-page-title .contact-title-break::before {
        content: '\A';
        white-space: pre;
    }
}

@media (max-width: 447px) {
    /* Line breaks disabled for English and Ukrainian versions */
    body:not(.lang-en):not(.lang-uk) .contact-page-description .contact-description-break::before {
        content: '\A';
        white-space: pre;
    }
}

/* Fixed values at 414px */
@media (max-width: 414px) {
    .contact-page-header {
        padding-top: 32px;
        padding-bottom: 32px;
    }

    .contact-page-container {
        padding-left: 20px;
        padding-right: 20px;
    }

    .contact-page-heading {
        gap: 16px;
    }

    .contact-page-heading-group {
        gap: 8px;
    }

    .contact-page-subtitle {
        font-size: 14px;
        line-height: 20px;
    }

    .contact-page-title {
        font-size: 28px;
        line-height: 40px;
        letter-spacing: -0.56px;
    }

    .contact-page-description {
        font-size: 16px;
        line-height: 24px;
    }

    .contact-cards-section {
        padding-bottom: 48px;
    }

    .contact-cards-grid {
        gap: 16px;
    }

    .contact-card {
        padding: 24px;
        gap: 56px;
        border-radius: 24px;
    }

    .contact-card-icon {
        width: 56px;
        height: 56px;
    }

    .contact-card-content {
        gap: 20px;
    }

    .contact-card-text-group {
        gap: 8px;
    }

    .contact-card-title {
        font-size: 20px;
        line-height: 28px;
    }

    .contact-card-description {
        font-size: 14px;
        line-height: 20px;
    }

    .contact-card-link {
        font-size: 16px;
        line-height: 24px;
        font-weight: 500;
    }
}

/* Viewport-based proportional scaling for 413px and below */
@media (max-width: 413px) {
    .contact-page-header {
        padding-top: calc(32px * 100vw / 414);
        padding-bottom: calc(32px * 100vw / 414);
    }

    .contact-page-container {
        padding-left: calc(20px * 100vw / 414);
        padding-right: calc(20px * 100vw / 414);
    }

    .contact-page-heading {
        gap: calc(16px * 100vw / 414);
    }

    .contact-page-heading-group {
        gap: calc(8px * 100vw / 414);
    }

    .contact-page-subtitle {
        font-size: calc(14px * 100vw / 414);
        line-height: calc(20px * 100vw / 414);
    }

    .contact-page-title {
        font-size: calc(28px * 100vw / 414);
        line-height: calc(40px * 100vw / 414);
        letter-spacing: calc(-0.56px * 100vw / 414);
    }

    .contact-page-description {
        font-size: calc(16px * 100vw / 414);
        line-height: calc(24px * 100vw / 414);
    }

    .contact-cards-section {
        padding-bottom: calc(48px * 100vw / 414);
    }

    .contact-cards-grid {
        gap: calc(16px * 100vw / 414);
    }

    .contact-card {
        padding: calc(24px * 100vw / 414);
        gap: calc(56px * 100vw / 414);
        border-radius: calc(24px * 100vw / 414);
    }

    .contact-card-icon {
        width: calc(56px * 100vw / 414);
        height: calc(56px * 100vw / 414);
    }

    .contact-card-content {
        gap: calc(20px * 100vw / 414);
    }

    .contact-card-text-group {
        gap: calc(8px * 100vw / 414);
    }

    .contact-card-title {
        font-size: calc(20px * 100vw / 414);
        line-height: calc(28px * 100vw / 414);
    }

    .contact-card-description {
        font-size: calc(14px * 100vw / 414);
        line-height: calc(20px * 100vw / 414);
    }

    .contact-card-link {
        font-size: calc(16px * 100vw / 414);
        line-height: calc(24px * 100vw / 414);
        font-weight: 500;
    }
}

/* Hide Google Maps error messages (autocomplete works without full map) */
[class*="gm-err"],
[id*="gm-err"],
.gm-style > div:first-child[style*="position: absolute"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

/* Spanish: hero subtitle text is longer than other languages, so let it
   ignore the container max-width restriction on smaller screens. */
body.lang-es .hero-subtitle {
    max-width: none !important;
}

/* English/Polish: use 72px instead of 80px on desktop (>=1321px), keeping the
   same line-height so the layout doesn't shift. Ukrainian and Russian keep
   their own desktop sizes (64/60px) untouched. */
@media (min-width: 1321px) {
    body.lang-en .hero-title,
    body.lang-pl .hero-title {
        font-size: 72px;
        line-height: 104px;
    }

    body.lang-en .hero-title__cursor--question,
    body.lang-en .hero-title__cursor--dynamic,
    body.lang-pl .hero-title__cursor--question,
    body.lang-pl .hero-title__cursor--dynamic {
        height: 72px;
    }
}

/* Spanish: 72px / 104px above the fluid zone (>1333px) */
@media (min-width: 1334px) {
    body.lang-es .hero-title {
        font-size: 72px;
        line-height: 104px;
    }

    body.lang-es .hero-title__cursor--question,
    body.lang-es .hero-title__cursor--dynamic {
        height: 72px;
    }
}

/* Spanish: gradual (linear) shrink from 72px/104px at 1333px down to
   60px/78px at 1221px. Derived from a linear fit of viewport width. */
@media (min-width: 1221px) and (max-width: 1333px) {
    body.lang-es .hero-title {
        font-size: calc(10.7143vw - 70.821px);
        line-height: calc(23.2143vw - 205.446px);
    }

    body.lang-es .hero-title__cursor--question,
    body.lang-es .hero-title__cursor--dynamic {
        height: calc(10.7143vw - 70.821px);
    }
}

/* Spanish: from 1118px down, constrain hero title to a 568px container width
   (Spanish-only; base stays 450px for other languages). */
@media (max-width: 1118px) {
    body.lang-es .hero-title {
        max-width: 568px !important;
    }
}

/* Spanish (<=1118px): the animated word (tu lavadora, etc.) is printed on its
   own line below "Reparamos" instead of next to it. The dynamic wrapper is
   forced onto a new flex line; "Reparamos" stays on the first line. */
@media (max-width: 1118px) {
    body.lang-es .hero-title__dynamic-wrapper {
        display: flex !important;        /* override display:contents so it's a flex item */
        flex-basis: 100% !important;     /* take full width -> wraps to next line */
        width: 100% !important;
        justify-content: center !important;
        white-space: nowrap !important;
    }

    body.lang-es .hero-title__dynamic {
        white-space: nowrap !important;
    }

    body.lang-es .hero-title__cursor--dynamic {
        flex-shrink: 0 !important;
    }

    /* While "¿No funciona?" still has any text, keep "Reparamos" on its own
       line so it doesn't jump up to share the line with the shrinking
       question ("Reparamos" is shorter than the equivalent word in other
       languages, which is why only Spanish has this issue). */
    body.lang-es .hero-title__static {
        flex-basis: 100% !important;
        width: 100% !important;
        text-align: center !important;
    }

    /* The moment the question is fully erased (:empty), remove it and its
       cursor from the flow, and let "Reparamos" flow up into its place. */
    body.lang-es .hero-title__question:empty,
    body.lang-es .hero-title__question:empty ~ .hero-title__cursor--question {
        display: none !important;
    }

    body.lang-es .hero-title__question:empty ~ .hero-title__static {
        flex-basis: auto !important;
        width: auto !important;
    }
}

/* Spanish: from 460px down, use the same 40px hero-title font-size as the
   <=393px breakpoint (Spanish-only). Scoped to 394-460px so the existing
   smaller steps (<=393px, <=360px) stay untouched. */
@media (max-width: 460px) and (min-width: 394px) {
    body.lang-es .hero-title {
        font-size: 40px !important;
    }
}

/* Spanish: from 414px down, scale the hero-title font-size smoothly with the
   viewport (40px at 414px -> proportionally smaller) instead of fixed steps.
   40 / 414 * 100 = 9.6618vw. Spanish-only. */
@media (max-width: 414px) {
    body.lang-es .hero-title {
        font-size: 9.6618vw !important;
    }
}

/* Spanish: break the warranty heading into two lines ("Obtén un servicio" /
   "con garantía") at <=566px. The <br> is off by default (one line / natural
   wrap on wider screens) and turns on only for Spanish on narrow screens. */
.benefit-warranty-br-es { display: none; }
@media (max-width: 566px) {
    body.lang-es .benefit-warranty-br-es { display: inline; }
}

/* Spanish line breaks that are active only at the edge widths: shown at the
   largest (>=993px) and smallest (<=463px), hidden in the middle (464-992px)
   where the text flows naturally. Used by the free-transport and diagnostics
   benefit texts. */
.br-edges { display: none; }
@media (min-width: 993px) { .br-edges { display: inline; } }
@media (max-width: 463px) { .br-edges { display: inline; } }

/* Spanish: the free-transport card titles (generic + per-device variants) are
   longer than the Polish ones, so keep their line break active at >=1140px
   (the generic rule hides title <br> there). ^= matches free-transport-oven,
   -coffee, -fridge, etc. as well as the plain free-transport key. */
@media (min-width: 1140px) {
    body.lang-es .benefit-card__title[data-i18n^="benefit.free-transport"] br {
        display: inline;
    }
}

/* English/Polish: keep selected per-device free-transport title breaks active at
   >=1140px (their text is long enough to need the break on wide cards too). */
@media (min-width: 1140px) {
    body.lang-en .benefit-card__title[data-i18n="benefit.free-transport-oven"] br,
    body.lang-pl .benefit-card__title[data-i18n="benefit.free-transport-oven"] br,
    body.lang-en .benefit-card__title[data-i18n="benefit.free-transport-dryer"] br {
        display: inline;
    }
}

/* Spanish hood: show the title break ONLY in 449-992px. One line at >=993px
   (from largest down to 993) and at <=448px (down to smallest). Placed after the
   broad ES rule so it wins at >=1140px. */
body.lang-es .benefit-card__title[data-i18n="benefit.free-transport-hood"] br {
    display: none;
}
@media (min-width: 449px) and (max-width: 992px) {
    body.lang-es .benefit-card__title[data-i18n="benefit.free-transport-hood"] br {
        display: inline;
    }
}

/* Polish Thermomix title: remove the break at 414px and below (one line there);
   all other widths keep their current behaviour. */
@media (max-width: 414px) {
    body.lang-pl .benefit-card__title[data-i18n="benefit.free-transport-thermomix"] br {
        display: none;
    }
}

/* EN induction-hob title: break after "Free" in 440-1139px, but at <=439px move
   the break after "induction" instead ("Free induction" / "hob transport"). */
.br-440-1139 { display: none; }
@media (min-width: 440px) and (max-width: 1139px) { .br-440-1139 { display: inline; } }
.br-max439 { display: none; }
@media (max-width: 439px) { .br-max439 { display: inline; } }

/* EN warranty-repair title: break after "Benefit from" only at <=537px. */
.br-max537 { display: none; }
@media (max-width: 537px) { .br-max537 { display: inline; } }

/* PL warranty-repair title: break after "Skorzystaj z naprawy" only at <=923px. */
.br-max923 { display: none; }
@media (max-width: 923px) { .br-max923 { display: inline; } }

/* ES aspiradora process-steps title: break after "3 pasos –" only at <=471px. */
.br-max471 { display: none; }
@media (max-width: 471px) { .br-max471 { display: inline; } }

/* Edge-only line break with a lower threshold of 436px: shown at >=993px and
   <=436px, hidden in the middle (437-992px). Used by the EN free-transport text
   to put "of Tenerife." on its own line. */
.br-edges-436 { display: none; }
@media (min-width: 993px) { .br-edges-436 { display: inline; } }
@media (max-width: 436px) { .br-edges-436 { display: inline; } }

/* Edge break shown only in the 993-1139px range: puts "appliances …" on a new
   line in the EN free-transport text where the card is narrower. */
.br-993-1139 { display: none; }
@media (min-width: 993px) and (max-width: 1139px) { .br-993-1139 { display: inline; } }

/* Edge break shown only in the 760-1139px range: breaks the EN warranty text
   before "ensuring …". */
.br-760-1139 { display: none; }
@media (min-width: 760px) and (max-width: 1139px) { .br-760-1139 { display: inline; } }

/* EN diagnostics, break before "you only pay a deposit.": shown at the edges
   (>=993px and <=463px, like br-edges) plus the extra 760-936px range. */
.br-diag-deposit { display: none; }
@media (min-width: 993px) { .br-diag-deposit { display: inline; } }
@media (min-width: 760px) and (max-width: 936px) { .br-diag-deposit { display: inline; } }
@media (max-width: 463px) { .br-diag-deposit { display: inline; } }

/* EN warranty text, break before "the highest …": shown at >=1140px and <=450px. */
.br-warr-the { display: none; }
@media (min-width: 1140px) { .br-warr-the { display: inline; } }
@media (max-width: 450px) { .br-warr-the { display: inline; } }

/* EN warranty text, break before "a full warranty …": shown at <=417px. */
.br-warr-afull { display: none; }
@media (max-width: 417px) { .br-warr-afull { display: inline; } }

/* Line break shown only at >=993px (largest screens down to 993). Used by the
   RU free-transport text. */
.br-min993 { display: none; }
@media (min-width: 993px) { .br-min993 { display: inline; } }

/* Line break shown at >=993px and <=453px (hidden in the middle). Used by the
   RU free-transport text before "в сервис". */
.br-min993-max453 { display: none; }
@media (min-width: 993px) { .br-min993-max453 { display: inline; } }
@media (max-width: 453px) { .br-min993-max453 { display: inline; } }

/* RU diagnostics card title: break after "Диагностика" only at >=1140px
   (!important overrides the generic title-<br> hide/show rules). */
.br-ru-diag-title { display: none !important; }
@media (min-width: 1140px) { .br-ru-diag-title { display: inline !important; } }
@media (max-width: 519px) { .br-ru-diag-title { display: inline !important; } }

/* RU warranty card title "Получите сервис / с гарантией": break after
   "сервис" only at <=567px (!important overrides the generic title-<br> rules). */
.br-ru-warr-title { display: none !important; }
@media (max-width: 567px) { .br-ru-warr-title { display: inline !important; } }

/* Line break shown only in the 1043-1092px range. Used by the UK free-transport text. */
.br-1043-1092 { display: none; }
@media (min-width: 1043px) and (max-width: 1092px) { .br-1043-1092 { display: inline; } }

/* Line break shown at >=1140px and in the 417-426px band (hidden elsewhere,
   including <=416px). Used by the RU warranty text. */
.br-min1140-417to426 { display: none; }
@media (min-width: 1140px) { .br-min1140-417to426 { display: inline; } }
@media (min-width: 417px) and (max-width: 426px) { .br-min1140-417to426 { display: inline; } }

/* Line break shown at >=1140px and <=426px (incl. <=416). Used by the RU
   warranty text before "в высоком". */
.br-min1140-max426 { display: none; }
@media (min-width: 1140px) { .br-min1140-max426 { display: inline; } }
@media (max-width: 426px) { .br-min1140-max426 { display: inline; } }

/* Line break shown at >=1140px and <=428px (hidden in the middle). Used by the
   UK free-transport text before "по всьому острові". */
.br-min1140-max428 { display: none; }
@media (min-width: 1140px) { .br-min1140-max428 { display: inline; } }
@media (max-width: 428px) { .br-min1140-max428 { display: inline; } }

/* UK warranty section heading "Отримайте сервіс / із гарантією": break after
   "сервіс" only at <=582px (!important overrides generic heading rules). */
.br-uk-warr-title { display: none !important; }
@media (max-width: 582px) { .br-uk-warr-title { display: inline !important; } }

/* Polish diagnostics: in 993-1139px keep the description flowing inline so
   "zadatek." doesn't drop onto its own line (desc-lines become block >=993px). */
@media (min-width: 993px) and (max-width: 1139px) {
    body.lang-pl .benefit-card__desc-line[data-i18n^="benefit.diagnostics-desc"] {
        display: inline;
    }
}

/* Line break shown at >=1140px and <=489px (hidden in the middle). Used by the
   PL free-transport text. */
.br-min1140-max489 { display: none; }
@media (min-width: 1140px) { .br-min1140-max489 { display: inline; } }
@media (max-width: 489px) { .br-min1140-max489 { display: inline; } }

/* Line break shown only at >=1140px. Used by the PL free-transport text before "Teneryfy". */
.br-min1140 { display: none; }
@media (min-width: 1140px) { .br-min1140 { display: inline; } }

/* Line break shown at >=472px; hidden below. Used by the ES feature title
   "Usamos / repuestos originales". */
.br-min472 { display: none; }
@media (min-width: 472px) { .br-min472 { display: inline; } }

/* Spanish step 2 title: drop "rápida" at <=463px -> "Consulta con un técnico". */
@media (max-width: 463px) { .es-step2-rapida { display: none; } }

/* Spanish: always stack the heart-section title into two lines (on wider
   screens it's a flex row by default). Only the column direction and gap are
   forced; horizontal alignment is left to the existing per-width rules
   (centered on desktop, left-aligned on small screens). */
body.lang-es .heart-section:not(.cta-callout-section) .heart-section__title {
    flex-direction: column !important;
    gap: 0 !important;
}

/* ES cta-callout text: remove the manual break in 620-666px (one line) */
@media (min-width: 620px) and (max-width: 666px) {
    body.lang-es .cta-callout-section .heart-section__text-br-desktop {
        display: none !important;
    }
}



/* Line break shown at >=480px; hidden below. Used by the ES heart description. */
.br-min480 { display: none; }
@media (min-width: 480px) { .br-min480 { display: inline; } }

/* Line break shown at <=470px; hidden above. Used by the ES heart description. */
.br-max470 { display: none; }
@media (max-width: 470px) { .br-max470 { display: inline; } }

/* ES heart description: break before "el modelo" at <=417px. */
.br-max417 { display: none; }
@media (max-width: 417px) { .br-max417 { display: inline; } }

/* ES heart description: break before "en toda" only in 418-470px (removed at <=417). */
.br-418-470 { display: none; }
@media (min-width: 418px) and (max-width: 470px) { .br-418-470 { display: inline; } }

/* Line break shown at >=577px; hidden below. Used by the EN heart description. */
.br-min577 { display: none; }
@media (min-width: 577px) { .br-min577 { display: inline; } }

/* Line break shown at <=418px; hidden above. Used by the RU heart description before "по". */
.br-max418 { display: none; }
@media (max-width: 418px) { .br-max418 { display: inline; } }

/* Line break shown at >=522px; hidden below. Used by the UK heart description. */
.br-min522 { display: none; }
@media (min-width: 522px) { .br-min522 { display: inline; } }

/* PL heart break after "AGD,": shown at >=577px but hidden in the 620-672px
   band (so visible at 577-619 and >=673). */
.br-pl-heart { display: none; }
@media (min-width: 577px) { .br-pl-heart { display: inline; } }
@media (min-width: 620px) and (max-width: 672px) { .br-pl-heart { display: none; } }

/* Delivery section CTA (moved from not-on-list): left-aligned by default,
   centered at <=919px (where the section content centers). */
.delivery-area .not-on-list-right {
    align-items: flex-start;
}
@media (max-width: 919px) {
    .delivery-area .not-on-list-right {
        align-items: center;
    }
}

/* Delivery CTA position: in the content (>919px) vs after the map (<=919px). */
.delivery-area__cta-after-map { display: none; }
@media (max-width: 919px) {
    .delivery-area__content .not-on-list-right { display: none; }
    .delivery-area__cta-after-map { display: flex; }
}

/* Cities coverage: by-direction columns on mobile (<=725px); the same grid
   layout with municipalities distributed alphabetically (no direction titles)
   on desktop (>725px). */
.cities-grid--alpha { display: none; }
@media (min-width: 726px) {
    .cities-grid--directions { display: none; }
    .cities-grid--alpha { display: flex; }
}

/* Mobile: header pinned to the top; hides on scroll down, reappears on scroll up. */
@media (max-width: 768px) {
    .header {
        position: sticky;
        top: 0;
        z-index: 1001;
        background: #ffffff;
        transition: transform 0.3s ease;
    }
    .header.header--hidden {
        transform: translateY(-100%);
    }
}

/* Line break shown at <=452px. Used by the RU delivery description before "к вам". */
.br-max452 { display: none; }
@media (max-width: 452px) { .br-max452 { display: inline; } }

/* Line break shown in the 434-1139px range. Used by the UK delivery description before "до вас". */
.br-434-1139 { display: none; }
@media (min-width: 434px) and (max-width: 1139px) { .br-434-1139 { display: inline; } }

/* Line break shown at >=460px. Used by the PL delivery description before "—". */
.br-min460 { display: none; }
@media (min-width: 460px) { .br-min460 { display: inline; } }

/* ES cta-callout on <=426px: hide the hourglass icon and break the title so
   "No pierdas tiempo" sits on its own line and "– pide ahora" wraps below it. */
@media (max-width: 426px) {
    body.lang-es .cta-callout-section .heart-section__title {
        display: block !important;
        flex-direction: row !important;
        gap: 0 !important;
    }
    body.lang-es .cta-callout-section .heart-section__title-line1 {
        display: block !important;
        gap: 0 !important;
    }
    body.lang-es .cta-callout-section .heart-section__title-line2 {
        display: block !important;
    }
    body.lang-es .cta-callout-section .heart-section__icon {
        display: none !important;
    }
}

/* Logo: from 580px up, make it slightly bigger than the default 184x28. */
@media (min-width: 580px) {
    .logo {
        width: 196px;
        height: 30px;
    }
}

/* Article (device) pages: remove the forced line break in the process-steps
   title at all sizes. The break stays only on the main page (which has no
   data-page-repair-device attribute). */
body[data-page-repair-device] .process-steps__title-br {
    display: none !important;
}

/* Dyson hair dryer page only: widen the article heading container to 876px at
   >=1200px (other pages and smaller widths keep the default 814px). */
@media (min-width: 1200px) {
    body[data-page-repair-device="Suszarkę do włosów Dyson"] .article-heading-section {
        max-width: 876px;
    }
}

/* Cooker hood page (okap), SPANISH only, all sizes: break after "Reparación"
   and widen only the heading so "de campanas extractoras" fits on the second
   line. The description keeps its normal 814px width (not affected). */
.br-okap { display: inline; }
body.lang-es[data-page-repair-device="Okap"] .article-heading-section {
    max-width: 1040px;
}
body.lang-es[data-page-repair-device="Okap"] .article-description {
    max-width: 814px;
}

/* Compact language switcher for form / success pages */
.form-lang{position:relative;margin-right:4px}
.form-lang>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:6px;font-family:'Sora',sans-serif;font-weight:500;font-size:14px;line-height:1;color:#141000;padding:9px 14px;border:1px solid rgba(20,16,0,.15);border-radius:999px;user-select:none}
.form-lang>summary::-webkit-details-marker{display:none}
.form-lang>summary .chevron{width:14px;height:14px;transition:transform .2s ease}
.form-lang[open]>summary .chevron{transform:rotate(180deg)}
.form-lang__menu{position:absolute;right:0;top:calc(100% + 8px);background:#fff;border:1px solid rgba(20,16,0,.12);border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.12);padding:6px;display:flex;flex-direction:column;min-width:170px;z-index:1200}
.form-lang__menu a{display:block;padding:10px 14px;border-radius:10px;color:#141000;text-decoration:none;font-family:'Sora',sans-serif;font-weight:400;font-size:15px;line-height:1.2;white-space:nowrap}
.form-lang__menu a:hover{background:rgba(20,16,0,.06)}
@media (max-width: 992px){.form-lang{display:none}}


/* ===== Negative letter-spacing for headings (як на negocios.html) ===== */
h1.hero-title { letter-spacing: -0.1rem; }
.benefit-section__heading,
.cities-title,
.delivery-area__title,
.faq-title,
.heart-section__title,
.process-steps__title,
.testimonials-title { letter-spacing: -0.075rem; }
.benefit-card__title,
.cities-direction-title,
.feature-card__title,
.process-step-card__title { letter-spacing: -0.05rem; }

/* ===================================================================
   Business form (business-form.html) — reuses the repair-form visual
   system; #businessForm mirrors the #repairForm-scoped layout rules.
   =================================================================== */

/* The shared display:flex rules (.repair-form__content, .repair-form__stepper,
   .repair-form__fields-column, ...) would override the hidden attribute, so
   force it for everything inside the business form + success page. */
#businessForm [hidden],
.page-business-success [hidden] {
    display: none !important;
}

#businessForm .repair-form__contact-inline:not([hidden]) {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
}

#businessForm .repair-form__fields--phone-only {
    max-width: 848px;
}

#businessForm .repair-form__fields--phone-only .repair-form__fields-column {
    flex: none;
    width: 100%;
    max-width: 100%;
}

@media (min-width: 769px) {
    #businessForm .repair-form__content.repair-form__step[data-step="1"] {
        gap: 64px;
    }

    /* Contact column: slightly wider than the consumer form's 420px so the
       longer business labels/checkboxes breathe */
    #businessForm .repair-form__fields--phone-only .business-form__contact-column {
        max-width: 480px;
        width: 100%;
    }

    #businessForm .repair-form__actions--repair-submit {
        justify-content: center;
        width: 100%;
    }
}

@media (max-width: 768px) {
    .repair-form-wrapper:has(#businessForm.repair-form--contact-active) {
        padding-bottom: 32px;
    }

    #businessForm.repair-form--contact-active .repair-form__contact-inline:not([hidden]) {
        gap: 32px;
    }

    #businessForm .repair-form__checkbox-wrapper {
        margin-bottom: 32px;
    }

    #businessForm.repair-form--contact-active .repair-form__checkbox-wrapper {
        margin-bottom: 0;
    }
}

@media (max-width: 668px) {
    .repair-form-wrapper:has(#businessForm.repair-form--contact-active) {
        padding-bottom: 32px;
    }
}

@media (max-width: 619px) {
    .repair-form-wrapper:has(#businessForm.repair-form--contact-active) {
        padding-bottom: 32px;
    }
}

@media (max-width: 480px) {
    .repair-form-wrapper:has(#businessForm.repair-form--contact-active) {
        padding-bottom: 32px;
    }

    #businessForm .repair-form__contact-inline .repair-form__fields--phone-only {
        padding: 0 4px;
        box-sizing: border-box;
    }

    /* Keep submit in flow (the generic .repair-form__actions rule makes it fixed) */
    #businessForm.repair-form--contact-active .repair-form__actions--repair-submit {
        position: static !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        z-index: auto !important;
        box-shadow: none !important;
        margin-top: 0;
    }
}

/* Symmetric side padding (base .repair-form__cta is 26px on the right for
   arrow buttons — same fix as #repairFormSubmit on the consumer form) */
#businessFormSubmit.repair-form__cta,
#businessFormDetailsSubmit.repair-form__cta,
.page-business-success .repair-form__cta {
    padding: 20px 36px;
    height: 68px;
}

/* --- Compact checkbox row (WhatsApp under phone, factura toggle) --- */
.business-form__checkbox-row {
    display: flex;
    gap: 10px;
    align-items: center;
    width: 100%;
}

/* These are functional choices (not legal fine print) — same size as inputs */
.business-form__checkbox-row .repair-form__checkbox-label {
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0;
    color: #141000;
}

/* --- Single-select chip groups (urgency, preferred visit time) --- */
.business-form__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    /* a touch more air below the field label (on top of the field's 8px gap) */
    margin-top: 4px;
}

/* --- Factura: conditional email block --- */
.business-form__factura-email:not([hidden]) {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 16px;
}

/* --- Post-submit details panel --- */
.business-form__details:not([hidden]) {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
    max-width: 848px;
}

.business-form__details-header {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.business-form__success-label {
    font-family: 'Sora', sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #0e7a52;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    width: fit-content;
    padding: 6px 14px;
    border-radius: 9999px;
    background: rgba(67, 214, 153, 0.16);
}

.business-form__success-label::before {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #43d699;
    flex-shrink: 0;
}

.business-form__details-title {
    margin: 0;
}

.business-form__details-desc {
    font-family: 'Sora', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: rgba(20, 16, 0, 0.8);
    margin: 0;
    max-width: 36em;
}

.business-form__details-column {
    max-width: 560px;
}

.business-form__details-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
}

/* Desktop: buttons centered within the form (same as the form page submit) */
@media (min-width: 769px) {
    .business-form__details-actions {
        justify-content: center;
        width: 100%;
    }

    .business-form__back-link {
        align-self: center;
    }
}

.business-form__wa-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: #25D366;
    color: #ffffff;
    border-radius: 9999px;
    padding: 20px 36px;
    font-family: 'Unbounded', sans-serif;
    font-weight: 300;
    font-size: 16px;
    line-height: 28px;
    text-decoration: none;
    transition: background-color 0.3s ease;
    -webkit-appearance: none;
    appearance: none;
}

.business-form__wa-btn:hover {
    background: #1DA851;
}

.business-form__wa-btn svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.business-form__back-link {
    font-family: 'Sora', sans-serif;
    font-size: 14px;
    line-height: 20px;
    color: rgba(20, 16, 0, 0.6);
    text-decoration: underline;
    width: fit-content;
}

.business-form__back-link:hover {
    color: #141000;
}

/* --- Photo upload --- */
.business-form__photo-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    /* a touch more air below the field label (on top of the field's 8px gap) */
    margin-top: 4px;
}

.business-form__photo-previews:not([hidden]) {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 8px;
}

.business-form__photo-preview {
    position: relative;
    width: 72px;
    height: 72px;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid rgba(20, 16, 0, 0.1);
}

.business-form__photo-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.business-form__photo-remove {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: none;
    background: rgba(20, 16, 0, 0.7);
    color: #ffffff;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.business-form__photos-hint {
    font-family: 'Sora', sans-serif;
    font-size: 12px;
    line-height: 16px;
    color: rgba(20, 16, 0, 0.4);
    margin: 4px 0 0;
}

.business-form__details-thanks:not([hidden]) {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Noto Sans for Ukrainian and Russian (same convention as the repair form) */
body.lang-uk .business-form__success-label,
body.lang-ru .business-form__success-label,
body.lang-uk .business-form__details-desc,
body.lang-ru .business-form__details-desc,
body.lang-uk .business-form__photos-hint,
body.lang-ru .business-form__photos-hint,
body.lang-uk .business-form__back-link,
body.lang-ru .business-form__back-link {
    font-family: 'Noto Sans', sans-serif;
}

@media (max-width: 619px) {
    .business-form__details-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .business-form__details-actions .repair-form__cta {
        justify-content: center;
    }
}

/* --- Business form: mobile-only equipment pill order per language ---
   Pills are reordered so that two short ones share a row where they fit
   (measured at 375px viewport, container 347px, 12px gap); the longest
   ones always stand alone. If a pair doesn't fit on a narrower screen,
   flex-wrap gracefully falls back to one per row. */
@media (max-width: 619px) {
    /* Spanish: [horno] [plancha...] [hielo+cámara] [armario] [lavavajillas]
       [lavadora ind.] [cafetera] [campana+otro] */
    body.lang-es #businessForm .repair-form-item[data-equipment="prof-oven"] { order: 1; }
    body.lang-es #businessForm .repair-form-item[data-equipment="cooking"] { order: 2; }
    body.lang-es #businessForm .repair-form-item[data-equipment="ice-machine"] { order: 3; }
    body.lang-es #businessForm .repair-form-item[data-equipment="cold-room"] { order: 4; }
    body.lang-es #businessForm .repair-form-item[data-equipment="commercial-fridge"] { order: 5; }
    body.lang-es #businessForm .repair-form-item[data-equipment="dishwasher-industrial"] { order: 6; }
    body.lang-es #businessForm .repair-form-item[data-equipment="laundry-industrial"] { order: 7; }
    body.lang-es #businessForm .repair-form-item[data-equipment="coffee-professional"] { order: 8; }
    body.lang-es #businessForm .repair-form-item[data-equipment="hood-extraction"] { order: 9; }
    body.lang-es #businessForm .repair-form-item[data-equipment="other"] { order: 10; }

    /* English: [griddle+hood] [cold room+dishwasher] [ice+washer/dryer]
       [coffee] [cabinet] [oven+other] */
    body.lang-en #businessForm .repair-form-item[data-equipment="cooking"] { order: 1; }
    body.lang-en #businessForm .repair-form-item[data-equipment="hood-extraction"] { order: 2; }
    body.lang-en #businessForm .repair-form-item[data-equipment="cold-room"] { order: 3; }
    body.lang-en #businessForm .repair-form-item[data-equipment="dishwasher-industrial"] { order: 4; }
    body.lang-en #businessForm .repair-form-item[data-equipment="ice-machine"] { order: 5; }
    body.lang-en #businessForm .repair-form-item[data-equipment="laundry-industrial"] { order: 6; }
    body.lang-en #businessForm .repair-form-item[data-equipment="coffee-professional"] { order: 7; }
    body.lang-en #businessForm .repair-form-item[data-equipment="commercial-fridge"] { order: 8; }
    body.lang-en #businessForm .repair-form-item[data-equipment="prof-oven"] { order: 9; }
    body.lang-en #businessForm .repair-form-item[data-equipment="other"] { order: 10; }

    /* Polish: [piec] [płyta...] [okap+kostkarka] [szafa] [zmywarka]
       [pralka przem.] [ekspres] [komora+inny] */
    body.lang-pl #businessForm .repair-form-item[data-equipment="prof-oven"] { order: 1; }
    body.lang-pl #businessForm .repair-form-item[data-equipment="cooking"] { order: 2; }
    body.lang-pl #businessForm .repair-form-item[data-equipment="hood-extraction"] { order: 3; }
    body.lang-pl #businessForm .repair-form-item[data-equipment="ice-machine"] { order: 4; }
    body.lang-pl #businessForm .repair-form-item[data-equipment="commercial-fridge"] { order: 5; }
    body.lang-pl #businessForm .repair-form-item[data-equipment="dishwasher-industrial"] { order: 6; }
    body.lang-pl #businessForm .repair-form-item[data-equipment="laundry-industrial"] { order: 7; }
    body.lang-pl #businessForm .repair-form-item[data-equipment="coffee-professional"] { order: 8; }
    body.lang-pl #businessForm .repair-form-item[data-equipment="cold-room"] { order: 9; }
    body.lang-pl #businessForm .repair-form-item[data-equipment="other"] { order: 10; }

    /* Ukrainian: [піч+камера] [плита...] [шафа] [посудомийна] [пральна]
       [кавомашина] [витяжка+льодогенератор] [інше] */
    body.lang-uk #businessForm .repair-form-item[data-equipment="prof-oven"] { order: 1; }
    body.lang-uk #businessForm .repair-form-item[data-equipment="cold-room"] { order: 2; }
    body.lang-uk #businessForm .repair-form-item[data-equipment="cooking"] { order: 3; }
    body.lang-uk #businessForm .repair-form-item[data-equipment="commercial-fridge"] { order: 4; }
    body.lang-uk #businessForm .repair-form-item[data-equipment="dishwasher-industrial"] { order: 5; }
    body.lang-uk #businessForm .repair-form-item[data-equipment="laundry-industrial"] { order: 6; }
    body.lang-uk #businessForm .repair-form-item[data-equipment="coffee-professional"] { order: 7; }
    body.lang-uk #businessForm .repair-form-item[data-equipment="hood-extraction"] { order: 8; }
    body.lang-uk #businessForm .repair-form-item[data-equipment="ice-machine"] { order: 9; }
    body.lang-uk #businessForm .repair-form-item[data-equipment="other"] { order: 10; }

    /* Russian: long labels — only [льдогенератор+камера] pairs up */
    body.lang-ru #businessForm .repair-form-item[data-equipment="prof-oven"] { order: 1; }
    body.lang-ru #businessForm .repair-form-item[data-equipment="cooking"] { order: 2; }
    body.lang-ru #businessForm .repair-form-item[data-equipment="ice-machine"] { order: 3; }
    body.lang-ru #businessForm .repair-form-item[data-equipment="cold-room"] { order: 4; }
    body.lang-ru #businessForm .repair-form-item[data-equipment="commercial-fridge"] { order: 5; }
    body.lang-ru #businessForm .repair-form-item[data-equipment="dishwasher-industrial"] { order: 6; }
    body.lang-ru #businessForm .repair-form-item[data-equipment="laundry-industrial"] { order: 7; }
    body.lang-ru #businessForm .repair-form-item[data-equipment="coffee-professional"] { order: 8; }
    body.lang-ru #businessForm .repair-form-item[data-equipment="hood-extraction"] { order: 9; }
    body.lang-ru #businessForm .repair-form-item[data-equipment="other"] { order: 10; }
}