/*--------------------------------------------------------------
  Vazy Laundry — Custom Styles
  Extends the Qondri design system without overriding it.
--------------------------------------------------------------*/

/* ═══════════════════════════════════════════════════════════
   HEADER WRAPPER
═══════════════════════════════════════════════════════════ */

.vazy-header {
    position: relative;
    z-index: 200;
}

/* ═══════════════════════════════════════════════════════════
   TOPBAR — compact info strip
═══════════════════════════════════════════════════════════ */

.vazy-topbar {
    background: var(--qondri-black);
    width: 100%;
}

.vazy-topbar__inner {
    max-width: 1360px;
    margin: 0 auto;
    padding: 0 24px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

/* Left items */
.vazy-topbar__left {
    display: flex;
    align-items: center;
    gap: 0;
    flex-wrap: nowrap;
    overflow: hidden;
}

.vt-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.62);
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.2s;
    font-family: var(--qondri-font);
}

a.vt-item:hover { color: var(--qondri-base); }

.vt-item i {
    color: var(--qondri-base);
    font-size: 12px;
    flex-shrink: 0;
}

.vt-sep {
    display: inline-block;
    width: 1px;
    height: 14px;
    background: rgba(255, 255, 255, 0.15);
    margin: 0 18px;
    flex-shrink: 0;
}

/* Right */
.vazy-topbar__right {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

/* WhatsApp pill */
.vt-whatsapp {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(37, 211, 102, 0.12);
    border: 1px solid rgba(37, 211, 102, 0.3);
    color: #25d366;
    font-size: 12px;
    font-weight: 700;
    padding: 3px 11px 3px 9px;
    border-radius: 20px;
    text-decoration: none;
    transition: all 0.2s;
    font-family: var(--qondri-font);
}

.vt-whatsapp:hover {
    background: #25d366;
    border-color: #25d366;
    color: #fff;
}

.vt-whatsapp i { font-size: 13px; }

/* Social mini-icons */
.vt-socials {
    display: flex;
    align-items: center;
    gap: 6px;
}

.vt-socials a {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: rgba(255, 255, 255, 0.5);
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.2s;
}

.vt-socials a:hover {
    background: var(--qondri-base);
    border-color: var(--qondri-base);
    color: #fff;
    transform: translateY(-1px);
}

/* Hide topbar on small mobile */
@media (max-width: 767px) {
    .vazy-topbar { display: none; }
}

/* ═══════════════════════════════════════════════════════════
   MAIN NAV
═══════════════════════════════════════════════════════════ */

.vazy-nav {
    background: #fff;
    position: relative;
    z-index: 91;
    box-shadow: 0 1px 0 rgba(24, 56, 98, 0.08);
    transition: box-shadow 0.3s;
}

/* Scrolled state — deeper shadow */
.vazy-nav.is-sticky,
.stricky-header.stricked-menu.main-menu .vazy-nav {
    box-shadow: 0 4px 28px rgba(24, 56, 98, 0.12);
}

.vazy-nav__inner {
    max-width: 1360px;
    margin: 0 auto;
    padding: 0 24px;
    height: 68px;
    display: flex;
    align-items: center;
    gap: 0;
}

/* ── LOGO ────────────────────────────────────── */

.vazy-logo {
    display: flex;
    align-items: center;
    gap: 11px;
    text-decoration: none;
    flex-shrink: 0;
    margin-right: 40px;
}

.vazy-logo__mark {
    width: 42px;
    height: 42px;
    background: linear-gradient(135deg, var(--qondri-base) 0%, #6e9620 100%);
    border-radius: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 3px 12px rgba(137, 185, 46, 0.32);
    transition: transform 0.3s, box-shadow 0.3s;
}

.vazy-logo__mark i {
    font-size: 20px;
    color: #fff;
    display: flex;
}

.vazy-logo:hover .vazy-logo__mark {
    transform: rotate(-5deg) scale(1.06);
    box-shadow: 0 6px 18px rgba(137, 185, 46, 0.42);
}

.vazy-logo__text {
    display: flex;
    flex-direction: column;
    line-height: 1;
}

.vazy-logo__brand {
    font-size: 22px;
    font-weight: 800;
    color: var(--qondri-black);
    letter-spacing: -0.4px;
    line-height: 1.1;
    font-family: var(--qondri-font);
}

.vazy-logo__tag {
    font-size: 10px;
    font-weight: 700;
    color: var(--qondri-base);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-top: 3px;
    font-family: var(--qondri-font);
}

/* light variant (mobile nav / footer) */
.vazy-logo--light .vazy-logo__brand { color: #fff; }
.vazy-logo--light .vazy-logo__tag   { color: rgba(255,255,255,.55); }
/* legacy alias */
.vazy-logo__sub { font-family: var(--qondri-font); font-size: 10px; font-weight: 700; color: var(--qondri-base); letter-spacing: 3px; text-transform: uppercase; margin-top: 3px; }
.vazy-logo--light .vazy-logo__sub { color: rgba(255,255,255,.55); }

/* ── NAV LINKS ────────────────────────────────── */

.vazy-nav__links {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Qondri main-menu__list overrides */
.vazy-nav .main-menu__list,
.vazy-nav__links {
    display: flex;
    align-items: center;
}

.vazy-nav .main-menu__list > li,
.vazy-nav__links > li {
    padding: 0;
    margin: 0;
}

.vazy-nav .main-menu__list > li > a,
.vazy-nav__links > li > a {
    display: block;
    padding: 8px 18px;
    font-size: 14.5px;
    font-weight: 600;
    color: #5a6678;
    letter-spacing: 0.1px;
    text-decoration: none;
    border-radius: 8px;
    transition: color 0.2s, background 0.2s;
    position: relative;
    font-family: var(--qondri-font);
}

.vazy-nav .main-menu__list > li > a::after,
.vazy-nav__links > li > a::after {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 18px;
    right: 18px;
    height: 2px;
    background: var(--qondri-base);
    border-radius: 2px;
    transform: scaleX(0);
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    transform-origin: left;
}

.vazy-nav .main-menu__list > li:hover > a,
.vazy-nav .main-menu__list > li.current > a,
.vazy-nav__links > li:hover > a,
.vazy-nav__links > li.current > a {
    color: var(--qondri-black);
    background: rgba(24, 56, 98, 0.04);
}

.vazy-nav .main-menu__list > li:hover > a::after,
.vazy-nav .main-menu__list > li.current > a::after,
.vazy-nav__links > li:hover > a::after,
.vazy-nav__links > li.current > a::after {
    transform: scaleX(1);
}

/* ── RIGHT ACTIONS ────────────────────────────── */

.vazy-nav__actions {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    margin-left: auto;
}

/* Icon buttons (cart, bell) */
.vn-icon-btn {
    position: relative;
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    color: #5a6678;
    text-decoration: none;
    font-size: 16px;
    transition: background 0.2s, color 0.2s;
}

.vn-icon-btn:hover {
    background: rgba(24, 56, 98, 0.06);
    color: var(--qondri-black);
}

/* Badges */
.vn-badge {
    position: absolute;
    top: 4px;
    right: 4px;
    min-width: 16px;
    height: 16px;
    padding: 0 3px;
    border-radius: 8px;
    background: var(--qondri-base);
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    border: 1.5px solid #fff;
}

.vn-badge--red { background: #ef4444; }

/* User dropdown trigger */
.vn-user {
    position: relative;
}

.vn-user__btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(24, 56, 98, 0.05);
    border: 1px solid transparent;
    border-radius: 9px;
    padding: 7px 12px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--qondri-black);
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s;
    font-family: var(--qondri-font);
    margin-left: 4px;
}

.vn-user__btn i:first-child { font-size: 17px; color: var(--qondri-gray); }
.vn-chevron { font-size: 10px; color: var(--qondri-gray); transition: transform 0.2s; }

.vn-user__btn:hover,
.vn-user:hover .vn-user__btn {
    background: rgba(24, 56, 98, 0.09);
    border-color: var(--qondri-bdr-color);
}

.vn-user:hover .vn-chevron { transform: rotate(180deg); }

/* Dropdown */
.vn-dropdown {
    display: block !important; /* override old display:none from .vazy-nav__user-dropdown */
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    min-width: 220px;
    background: #fff;
    border: 1px solid rgba(24, 56, 98, 0.1);
    border-radius: 14px;
    box-shadow: 0 10px 40px rgba(24, 56, 98, 0.14);
    padding: 8px;
    list-style: none;
    margin: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(8px);
    transition: opacity 0.2s, transform 0.2s, visibility 0.2s;
    z-index: 300;
}

.vn-user:hover .vn-dropdown,
.vn-user:focus-within .vn-dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.vn-dropdown__head {
    padding: 10px 12px 10px;
    border-bottom: 1px solid #f0f2f5;
    margin-bottom: 6px;
}

.vn-dropdown__head strong {
    display: block;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--qondri-black);
    font-family: var(--qondri-font);
}

.vn-dropdown__head span {
    display: block;
    font-size: 12px;
    color: var(--qondri-gray);
    margin-top: 2px;
    font-family: var(--qondri-font);
}

.vn-dropdown li > a {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 8px 12px;
    font-size: 13.5px;
    font-weight: 500;
    color: #374151;
    text-decoration: none;
    border-radius: 8px;
    transition: background 0.15s, color 0.15s;
    font-family: var(--qondri-font);
}

.vn-dropdown li > a i {
    width: 16px;
    text-align: center;
    color: var(--qondri-gray);
    font-size: 13px;
    flex-shrink: 0;
}

.vn-dropdown li > a:hover {
    background: rgba(24, 56, 98, 0.05);
    color: var(--qondri-black);
}

.vn-dropdown li > a:hover i { color: var(--qondri-base); }

.vn-dropdown__divider {
    height: 1px;
    background: #f0f2f5;
    margin: 6px 8px;
}

.vn-dropdown__logout { color: #ef4444 !important; }
.vn-dropdown__logout:hover { background: rgba(239, 68, 68, 0.06) !important; }
.vn-dropdown__logout i { color: #ef4444 !important; }

/* Auth / login */
.vn-login-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: 9px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--qondri-black);
    text-decoration: none;
    background: rgba(24, 56, 98, 0.05);
    border: 1px solid transparent;
    transition: background 0.2s, border-color 0.2s;
    font-family: var(--qondri-font);
    margin-left: 4px;
}

.vn-login-btn:hover {
    background: rgba(24, 56, 98, 0.09);
    border-color: var(--qondri-bdr-color);
    color: var(--qondri-black);
}

/* Language switcher in nav */
.vazy-nav__lang {
    margin: 0 4px;
}

.vazy-nav__lang .lang-switcher__active {
    border-color: transparent;
    background: transparent;
    color: #5a6678;
    font-size: 13px;
    padding: 7px 10px;
    border-radius: 9px;
    transition: background 0.2s;
}

.vazy-nav__lang .lang-switcher__active:hover {
    background: rgba(24, 56, 98, 0.05);
    border-color: transparent;
    color: var(--qondri-black);
}

/* CTA Book Pickup */
.vn-cta {
    display: inline-flex !important;
    align-items: center;
    gap: 7px;
    background: var(--qondri-base) !important;
    color: #fff !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    padding: 10px 20px !important;
    border-radius: 10px !important;
    white-space: nowrap;
    margin-left: 8px;
    box-shadow: 0 3px 10px rgba(137, 185, 46, 0.35);
    transition: transform 0.2s, box-shadow 0.2s, background 0.2s !important;
    text-decoration: none;
    font-family: var(--qondri-font);
}

.vn-cta:hover {
    background: #6e9620 !important;
    color: #fff !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(137, 185, 46, 0.42) !important;
}

.vn-cta i { font-size: 13px; }

/* Hamburger — 3-line animated */
.vn-hamburger {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 38px;
    height: 38px;
    background: rgba(24, 56, 98, 0.05);
    border: 1px solid transparent;
    border-radius: 9px;
    cursor: pointer;
    padding: 0;
    margin-left: 8px;
    transition: background 0.2s;
}

.vn-hamburger:hover { background: rgba(24, 56, 98, 0.1); }

.vn-hamburger span {
    display: block;
    width: 20px;
    height: 2px;
    background: var(--qondri-black);
    border-radius: 2px;
    transition: all 0.25s;
}

/* ── STICKY (stricky-header via qondri.js) ────── */

.stricky-header.stricked-menu.main-menu {
    box-shadow: 0 4px 28px rgba(24, 56, 98, 0.12);
    border-top: none;
    border-bottom: none;
}

/* ── MOBILE NAV — logo in slide-in drawer ───────── */

.mobile-nav__content .logo-box {
    padding: 28px 24px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    margin-bottom: 8px;
}

.mobile-nav__content .vazy-logo__mark {
    width: 38px;
    height: 38px;
}

.mobile-nav__content .vazy-logo__brand {
    font-size: 20px;
}

/* Reset old dark-nav styles that clash with white nav */
.vazy-nav .vazy-nav__user-btn,
.vn-user .vazy-nav__user-btn {
    background: rgba(24, 56, 98, 0.05) !important;
    border-color: transparent !important;
    color: var(--qondri-black) !important;
    border-radius: 9px !important;
    padding: 7px 12px !important;
}

/* Responsive breakpoints are consolidated in the RESPONSIVE section below. */

/* ═══════════════════════════════════════════════════════════
   MOBILE NAV DRAWER — vmn
═══════════════════════════════════════════════════════════ */

/* Reset old close button */
.mobile-nav__close { display: none !important; }

/* Drawer wrapper (qondri base has its own z/transition) */
.mobile-nav__wrapper.expanded .mobile-nav__content { transform: translateX(0); }

/* Our content panel */
.vmn {
    display: flex;
    flex-direction: column;
    background: #111827;
    height: 100%;
    overflow-y: auto;
    padding: 0;
}

/* ── Header ── */
.vmn__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 22px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    flex-shrink: 0;
}

.vmn__close {
    width: 38px;
    height: 38px;
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.7);
    font-size: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
    flex-shrink: 0;
}

.vmn__close:hover {
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
}

/* ── Nav links (injected) ── */
.vmn__links {
    padding: 10px 10px 0;
    flex: 1;
}

.vmn__links .main-menu__list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.vmn__links .main-menu__list li a {
    display: flex;
    align-items: center;
    padding: 11px 14px;
    font-size: 15px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.75);
    text-decoration: none;
    border-radius: 9px;
    transition: background 0.18s, color 0.18s;
    font-family: var(--qondri-font);
}

.vmn__links .main-menu__list li a:hover,
.vmn__links .main-menu__list li.current a {
    background: rgba(137, 185, 46, 0.1);
    color: #fff;
}

.vmn__links .main-menu__list li.current > a {
    color: var(--qondri-base);
}

/* ── CTAs ── */
.vmn__ctas {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 18px 18px 14px;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    flex-shrink: 0;
}

.vmn__book,
.vmn__wa {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 13px 20px;
    border-radius: 11px;
    font-size: 14.5px;
    font-weight: 700;
    text-decoration: none;
    transition: opacity 0.2s, transform 0.2s;
    font-family: var(--qondri-font);
}

.vmn__book {
    background: var(--qondri-base);
    color: #fff;
}

.vmn__book:hover { opacity: 0.88; transform: translateY(-1px); color: #fff; }

.vmn__wa {
    background: rgba(37, 211, 102, 0.12);
    border: 1.5px solid rgba(37, 211, 102, 0.4);
    color: #25d366;
}

.vmn__wa:hover {
    background: #25d366;
    border-color: #25d366;
    color: #fff;
}

.vmn__wa i { font-size: 17px; }

/* ── Language ── */
.vmn__lang {
    padding: 12px 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    flex-shrink: 0;
}

.vmn__lang-label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.3);
    margin-bottom: 8px;
    font-family: var(--qondri-font);
}

.vmn__lang-btns {
    display: flex;
    gap: 8px;
}

.vmn__lang-btns button {
    flex: 1;
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.6);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.18s, color 0.18s, border-color 0.18s;
    font-family: var(--qondri-font);
}

.vmn__lang-btns button.active,
.vmn__lang-btns button:hover {
    background: rgba(137, 185, 46, 0.15);
    border-color: var(--qondri-base);
    color: #fff;
}

/* ── Contact ── */
.vmn__contact {
    list-style: none;
    padding: 12px 18px 18px;
    margin: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex-shrink: 0;
}

.vmn__contact li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.45);
    font-family: var(--qondri-font);
}

.vmn__contact li i {
    font-size: 12px;
    color: var(--qondri-base);
    width: 14px;
    flex-shrink: 0;
}

.vmn__contact li a {
    color: rgba(255, 255, 255, 0.55);
    text-decoration: none;
    transition: color 0.2s;
}

.vmn__contact li a:hover { color: var(--qondri-base); }

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE — comprehensive breakpoints
═══════════════════════════════════════════════════════════ */

/* ── 1280px: slightly compact desktop ── */
@media (max-width: 1280px) {
    .vazy-nav__inner { padding: 0 20px; }
    .vazy-topbar__inner { padding: 0 20px; }
    .vazy-logo { margin-right: 28px; }
    .vazy-nav .main-menu__list > li > a,
    .vazy-nav__links > li > a { padding: 8px 14px; }
}

/* ── 1100px: hide nav links, show hamburger ── */
@media (max-width: 1100px) {
    .vazy-nav__links { display: none !important; }
    .vazy-logo { margin-right: 0; }
    .vazy-nav__inner {
        justify-content: space-between;
        padding: 0 20px;
    }
    .vn-hamburger { display: inline-flex; }
}

/* ── 900px: compact action bar ── */
@media (max-width: 900px) {
    /* Hide login button text */
    .vn-login-btn span { display: none; }
    /* Tighten actions gap */
    .vazy-nav__actions { gap: 2px; }
    /* Hide notification icon (available in drawer) */
    .vn-icon-btn[aria-label="Notifications"] { display: none; }
}

/* ── 767px: tablet portrait / large phone ── */
@media (max-width: 767px) {
    .vazy-topbar { display: none; }
    .vazy-nav__inner { padding: 0 16px; height: 60px; }

    /* Compact logo */
    .vazy-logo__brand { font-size: 19px; }
    .vazy-logo__tag,
    .vazy-logo__sub { letter-spacing: 2.5px; }

    /* CTA — icon only */
    .vn-cta span { display: none; }
    .vn-cta {
        padding: 9px 12px !important;
        margin-left: 4px;
        border-radius: 9px !important;
    }

    /* Actions tighter */
    .vazy-nav__actions { gap: 1px; }
}

/* ── 480px: small phone ── */
@media (max-width: 480px) {
    /* Hide lang switcher from nav — it's in the drawer */
    .vazy-nav__lang { display: none; }
    /* Hide cart text / keep icon */
    .vn-icon-btn { width: 34px; height: 34px; font-size: 15px; }
    .vn-cta { padding: 8px 11px !important; }
    .vazy-logo__mark { width: 36px; height: 36px; }
    .vazy-logo__mark i { font-size: 17px; }
    .vazy-logo__brand { font-size: 17px; }
    .vazy-logo__tag,
    .vazy-logo__sub { display: none; }
    .vazy-nav__inner { padding: 0 12px; height: 56px; }
}

/* ── Sticky header — clean at all sizes ── */
.stricky-header.stricked-menu.main-menu {
    background: #fff;
    box-shadow: 0 4px 28px rgba(24, 56, 98, 0.12);
    border-top: none;
    border-bottom: none;
}

.stricky-header .vazy-nav__inner { height: 62px; }

@media (max-width: 767px) {
    .stricky-header .vazy-nav__inner { height: 56px; }
}

/* ═══════════════════════════════════════════════
   LANGUAGE SWITCHER (shared base)
═══════════════════════════════════════════════ */

.lang-switcher {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.lang-switcher__active {
    display: flex;
    align-items: center;
    gap: 6px;
    background: transparent;
    border: 1.5px solid var(--qondri-bdr-color);
    color: var(--qondri-black);
    padding: 7px 13px;
    border-radius: 30px;
    font-family: var(--qondri-font);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.25s ease;
    white-space: nowrap;
    line-height: 1;
}

.lang-switcher__active:hover {
    border-color: var(--qondri-base);
    background: rgba(137, 185, 46, 0.08);
}

.lang-switcher__active .lang-short {
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.lang-switcher__active .fa-angle-down {
    font-size: 11px;
    transition: transform 0.25s ease;
    opacity: 0.6;
}

.lang-switcher.open .lang-switcher__active .fa-angle-down {
    transform: rotate(180deg);
}

/* Dropdown */
.lang-switcher__dropdown {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    background: var(--qondri-white);
    border-radius: 14px;
    box-shadow: 0 12px 40px rgba(24, 56, 98, 0.14), 0 2px 8px rgba(24, 56, 98, 0.06);
    list-style: none;
    padding: 6px 0;
    margin: 0;
    min-width: 175px;
    z-index: 9999;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease;
    border: 1px solid rgba(24, 56, 98, 0.07);
}

.lang-switcher.open .lang-switcher__dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.lang-option {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 16px;
    background: transparent;
    border: none;
    font-family: var(--qondri-font);
    font-size: 14px;
    font-weight: 500;
    color: var(--qondri-black);
    cursor: pointer;
    text-align: left;
    transition: background 0.18s ease, color 0.18s ease;
    border-radius: 0;
}

.lang-option:hover {
    background: var(--qondri-primary);
    color: var(--qondri-base);
}

.lang-option.active {
    color: var(--qondri-base);
    font-weight: 700;
}

.lang-option.active::before {
    content: '✓';
    margin-left: auto;
    font-size: 12px;
    order: 99;
    opacity: 0.8;
}

/* Mobile language switcher */
.mobile-lang-switcher {
    padding: 18px 25px 5px;
}

.mobile-lang-switcher p {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: rgba(255, 255, 255, 0.4);
    margin-bottom: 10px;
}

.mobile-lang-switcher .mobile-lang-options {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.mobile-lang-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: 1.5px solid rgba(255, 255, 255, 0.18);
    border-radius: 30px;
    background: transparent;
    color: rgba(255, 255, 255, 0.75);
    font-family: var(--qondri-font);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.mobile-lang-btn:hover,
.mobile-lang-btn.active {
    border-color: var(--qondri-base);
    background: var(--qondri-base);
    color: var(--qondri-white);
}

/* ═══════════════════════════════════════════════
   SERVICES GRID — 6 CARDS (2 ROWS × 3)
═══════════════════════════════════════════════ */

.services-one .row {
    row-gap: 30px;
}

/* ═══════════════════════════════════════════════
   HOW WE WORK — 5 STEPS
═══════════════════════════════════════════════ */

.how-we-work__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 0;
}

.how-we-work__single {
    flex: 1 1 18%;
    min-width: 160px;
}

@media (max-width: 991px) {
    .how-we-work__single {
        flex: 1 1 45%;
    }
}

@media (max-width: 575px) {
    .how-we-work__single {
        flex: 1 1 100%;
    }
}

/* ═══════════════════════════════════════════════
   PRICING / SUBSCRIPTION SECTION
═══════════════════════════════════════════════ */

.pricing-plan {
    padding: 100px 0;
    background: var(--qondri-primary);
    position: relative;
}

.pricing-plan__card {
    background: var(--qondri-black);
    border-radius: 20px;
    padding: 50px 50px;
    color: var(--qondri-white);
    position: relative;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(24, 56, 98, 0.2);
}

.pricing-plan__card::before {
    content: '';
    position: absolute;
    top: -60px;
    right: -60px;
    width: 220px;
    height: 220px;
    background: var(--qondri-base);
    border-radius: 50%;
    opacity: 0.08;
    pointer-events: none;
}

.pricing-plan__card::after {
    content: '';
    position: absolute;
    bottom: -40px;
    left: -40px;
    width: 160px;
    height: 160px;
    background: var(--qondri-base);
    border-radius: 50%;
    opacity: 0.05;
    pointer-events: none;
}

.pricing-plan__left {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding-right: 30px;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.pricing-plan__badge {
    display: inline-block;
    background: var(--qondri-base);
    color: var(--qondri-black);
    padding: 5px 18px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
    width: fit-content;
}

.pricing-plan__price {
    display: flex;
    align-items: flex-end;
    gap: 4px;
    margin-bottom: 10px;
    line-height: 1;
}

.pricing-plan__amount {
    font-size: 72px;
    font-weight: 800;
    color: var(--qondri-white);
    line-height: 1;
    font-family: var(--qondri-font);
}

.pricing-plan__period {
    font-size: 18px;
    color: rgba(255, 255, 255, 0.55);
    font-weight: 500;
    margin-bottom: 12px;
}

.pricing-plan__subtitle {
    color: rgba(255, 255, 255, 0.65);
    font-size: 15px;
    margin-bottom: 30px;
    line-height: 1.6;
}

.pricing-plan__btn {
    display: block;
    text-align: center;
    margin-top: auto;
}

/* Feature list */
.pricing-plan__features {
    padding-left: 30px;
}

.pricing-plan__features ul {
    list-style: none;
    padding: 0;
    margin: 0 0 25px;
}

.pricing-plan__features ul li {
    color: rgba(255, 255, 255, 0.85);
    padding: 11px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 16px;
    line-height: 1.4;
}

.pricing-plan__features ul li:last-child {
    border-bottom: none;
}

.pricing-plan__features ul li .icon-check {
    color: var(--qondri-base);
    font-size: 13px;
    flex-shrink: 0;
}

.pricing-plan__note {
    background: rgba(255, 255, 255, 0.07);
    border-radius: 10px;
    padding: 16px 20px;
    margin: 0;
    border-left: 3px solid var(--qondri-base);
}

.pricing-plan__note-title {
    color: var(--qondri-white);
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 6px;
}

.pricing-plan__note p {
    color: rgba(255, 255, 255, 0.65);
    font-size: 14px;
    margin: 0 0 12px;
    line-height: 1.5;
}

.pricing-plan__note-cta {
    color: var(--qondri-base);
    font-size: 14px;
    font-weight: 700;
    text-decoration: underline;
}

.pricing-plan__note-cta:hover {
    color: var(--qondri-base);
    opacity: 0.8;
}

@media (max-width: 991px) {
    .pricing-plan__card {
        padding: 40px 30px;
    }

    .pricing-plan__left {
        padding-right: 0;
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        padding-bottom: 30px;
        margin-bottom: 30px;
    }

    .pricing-plan__features {
        padding-left: 0;
    }
}

@media (max-width: 575px) {
    .pricing-plan__card {
        padding: 30px 20px;
    }

    .pricing-plan__amount {
        font-size: 56px;
    }
}

/* ═══════════════════════════════════════════════
   CONTACT / LOCATION INFO SECTION
═══════════════════════════════════════════════ */

.contact-info {
    padding: 100px 0;
    background: var(--qondri-white);
    position: relative;
}

.contact-info__card {
    background: var(--qondri-primary);
    border-radius: 16px;
    padding: 40px 35px;
    height: 100%;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border-bottom: 4px solid transparent;
}

.contact-info__card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(24, 56, 98, 0.1);
    border-bottom-color: var(--qondri-base);
}

.contact-info__icon {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    background: var(--qondri-base);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
}

.contact-info__icon span,
.contact-info__icon i {
    font-size: 26px;
    color: var(--qondri-white);
    line-height: 1;
}

.contact-info__title {
    font-size: 20px;
    font-weight: 700;
    color: var(--qondri-black);
    margin-bottom: 14px;
}

.contact-info__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.contact-info__list li {
    display: flex;
    flex-direction: column;
    margin-bottom: 10px;
    color: var(--qondri-gray);
    font-size: 16px;
    line-height: 1.5;
}

.contact-info__list li strong {
    color: var(--qondri-black);
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 2px;
}

.contact-info__list a {
    color: var(--qondri-gray);
    transition: color 0.2s ease;
}

.contact-info__list a:hover {
    color: var(--qondri-base);
}

.contact-info__bottom {
    background: var(--qondri-black);
    border-radius: 16px;
    padding: 40px;
    margin-top: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
}

.contact-info__bottom-text h4 {
    color: var(--qondri-white);
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 6px;
}

.contact-info__bottom-text p {
    color: rgba(255, 255, 255, 0.6);
    font-size: 15px;
    margin: 0;
}

@media (max-width: 991px) {
    .contact-info__card {
        margin-bottom: 30px;
    }

    .contact-info__bottom {
        flex-direction: column;
        text-align: center;
    }
}

/* ═══════════════════════════════════════════════
   PAYMENT BADGE (MoMo Pay visual)
═══════════════════════════════════════════════ */

.momo-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #ffcc00;
    color: #1a1a1a;
    padding: 12px 24px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 16px;
    box-shadow: 0 4px 15px rgba(255, 204, 0, 0.35);
    margin-top: 16px;
}

.momo-badge .momo-icon {
    font-size: 22px;
}

/* ═══════════════════════════════════════════════
   LOCATION CHIP (hero area)
═══════════════════════════════════════════════ */

.location-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, 0.15);
    color: var(--qondri-white);
    padding: 5px 14px;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 12px;
    backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

/* ═══════════════════════════════════════════════
   WHY CHOOSE US — extra benefit blocks
═══════════════════════════════════════════════ */

.why-choose-one__content {
    margin-bottom: 25px;
}

.why-choose-one__content ul.why-choose-one__points {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

@media (max-width: 575px) {
    .why-choose-one__content ul.why-choose-one__points {
        grid-template-columns: 1fr;
    }
}

/* ═══════════════════════════════════════════════
   STICKY HEADER — lang switcher color fix
═══════════════════════════════════════════════ */

.stricky-header .lang-switcher__active {
    border-color: var(--qondri-bdr-color);
    color: var(--qondri-black);
}

/* ═══════════════════════════════════════════════
   BOOK-ONE CTA (pricing teaser)
═══════════════════════════════════════════════ */

.book-one__price-tag {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    background: var(--qondri-white);
    color: var(--qondri-black);
    border-radius: 16px;
    padding: 18px 30px;
    margin-left: 30px;
    min-width: 140px;
}

.book-one__price-tag .price-big {
    font-size: 46px;
    font-weight: 800;
    color: var(--qondri-black);
    line-height: 1;
}

.book-one__price-tag .price-label {
    font-size: 14px;
    color: var(--qondri-gray);
    font-weight: 500;
}

@media (max-width: 767px) {
    .book-one__price-tag {
        margin-left: 0;
        margin-top: 20px;
    }
}

/* ═══════════════════════════════════════════════
   SECTION SPACING CONSISTENCY
═══════════════════════════════════════════════ */

.contact-info,
.pricing-plan {
    overflow: hidden;
}

/* ═══════════════════════════════════════════════
   BEAUTIFUL FOOTER — vazy-footer
═══════════════════════════════════════════════ */

.vazy-footer {
    background: var(--qondri-black);
    position: relative;
    overflow: hidden;
}

/* Wave at top — color matches the CTA strip above */
.vazy-footer__wave {
    line-height: 0;
    display: block;
    background: transparent;
}

.vazy-footer__wave svg {
    display: block;
    width: 100%;
    height: 60px;
}

/* Main body */
.vazy-footer__main {
    padding: 70px 0 50px;
}

/* Brand column */
.vazy-footer__brand {
    padding-right: 40px;
}

.vazy-footer__brand .vazy-logo {
    margin-bottom: 22px;
}

.vazy-footer__desc {
    color: rgba(255, 255, 255, 0.55);
    font-size: 15px;
    line-height: 1.75;
    margin-bottom: 22px;
}

.vazy-footer__socials {
    display: flex;
    gap: 8px;
    margin-bottom: 24px;
}

.vazy-footer__socials a {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.65);
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.25s ease;
    text-decoration: none;
}

.vazy-footer__socials a:hover {
    background: var(--qondri-base);
    border-color: var(--qondri-base);
    color: #fff;
    transform: translateY(-2px);
}

/* MoMo badge */
.vazy-footer__momo-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255, 204, 0, 0.12);
    border: 1px solid rgba(255, 204, 0, 0.3);
    color: #ffd700;
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 700;
    font-family: var(--qondri-font);
}

.vazy-footer__momo-badge i {
    font-size: 18px;
}

.vazy-footer__momo-badge small {
    font-size: 10px;
    font-weight: 500;
    opacity: 0.7;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-left: -4px;
}

/* Column shared styles */
.vazy-footer__col {
    padding-left: 20px;
}

@media (max-width: 991px) {
    .vazy-footer__col {
        padding-left: 0;
        margin-top: 40px;
    }
    .vazy-footer__brand {
        padding-right: 0;
    }
}

.vazy-footer__col-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--qondri-white);
    margin-bottom: 20px;
    letter-spacing: 1px;
    text-transform: uppercase;
    position: relative;
    padding-bottom: 14px;
}

.vazy-footer__col-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 28px;
    height: 2px;
    background: var(--qondri-base);
    border-radius: 2px;
}

/* Footer nav links */
.vazy-footer__links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.vazy-footer__links li {
    margin-bottom: 10px;
}

.vazy-footer__links a {
    color: rgba(255, 255, 255, 0.55);
    font-size: 15px;
    font-weight: 500;
    transition: color 0.22s, padding-left 0.22s;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.vazy-footer__links a::before {
    content: '→';
    font-size: 12px;
    color: var(--qondri-base);
    opacity: 0;
    transition: opacity 0.2s, transform 0.2s;
    transform: translateX(-6px);
}

.vazy-footer__links a:hover {
    color: var(--qondri-white);
    padding-left: 8px;
}

.vazy-footer__links a:hover::before {
    opacity: 1;
    transform: translateX(0);
}

/* Contact list */
.vazy-footer__contact-list {
    list-style: none;
    padding: 0;
    margin: 0 0 22px;
}

.vazy-footer__contact-list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
    color: rgba(255, 255, 255, 0.55);
    font-size: 14px;
    line-height: 1.5;
}

.vazy-footer__contact-list li i {
    color: var(--qondri-base);
    font-size: 14px;
    margin-top: 2px;
    flex-shrink: 0;
}

.vazy-footer__contact-list a {
    color: rgba(255, 255, 255, 0.55);
    transition: color 0.22s;
}

.vazy-footer__contact-list a:hover {
    color: var(--qondri-base);
}

/* Footer CTA button */
.vazy-footer__cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--qondri-base);
    color: #fff;
    padding: 10px 22px;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 700;
    font-family: var(--qondri-font);
    transition: all 0.25s;
    text-decoration: none;
}

.vazy-footer__cta:hover {
    background: #7aa828;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(137, 185, 46, 0.35);
}

/* Newsletter strip */
.vazy-footer__newsletter-strip {
    background: rgba(255, 255, 255, 0.04);
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    padding: 36px 0;
}

.vazy-footer__newsletter-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    flex-wrap: wrap;
}

.vazy-footer__newsletter-text h5 {
    color: var(--qondri-white);
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 4px;
}

.vazy-footer__newsletter-text p {
    color: rgba(255, 255, 255, 0.5);
    font-size: 14px;
    margin: 0;
}

.vazy-footer__newsletter-form {
    display: flex;
    align-items: center;
    gap: 0;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 40px;
    padding: 4px 4px 4px 20px;
    min-width: 360px;
}

.vazy-footer__newsletter-form input {
    background: transparent;
    border: none;
    outline: none;
    color: rgba(255, 255, 255, 0.8);
    font-family: var(--qondri-font);
    font-size: 14px;
    flex: 1;
}

.vazy-footer__newsletter-form input::placeholder {
    color: rgba(255, 255, 255, 0.35);
}

.vazy-footer__newsletter-form button {
    background: var(--qondri-base);
    color: #fff;
    border: none;
    padding: 10px 24px;
    border-radius: 30px;
    font-family: var(--qondri-font);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.25s;
    white-space: nowrap;
}

.vazy-footer__newsletter-form button:hover {
    background: #7aa828;
}

@media (max-width: 767px) {
    .vazy-footer__newsletter-form {
        min-width: 0;
        width: 100%;
    }
}

/* Bottom bar */
.vazy-footer__bottom {
    padding: 20px 0;
}

.vazy-footer__bottom-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 14px;
}

.vazy-footer__bottom-inner p {
    color: rgba(255, 255, 255, 0.4);
    font-size: 13px;
    margin: 0;
}

.vazy-footer__bottom-links {
    display: flex;
    align-items: center;
    gap: 12px;
}

.vazy-footer__bottom-links a {
    color: rgba(255, 255, 255, 0.4);
    font-size: 13px;
    transition: color 0.2s;
}

.vazy-footer__bottom-links a:hover {
    color: var(--qondri-base);
}

.vazy-footer__bottom-links span {
    color: rgba(255, 255, 255, 0.2);
}

/* Footer language switcher */
.vazy-footer__lang .lang-switcher__active {
    border-color: rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.55);
    font-size: 12px;
    padding: 5px 10px;
}

.vazy-footer__lang .lang-switcher__active:hover {
    border-color: var(--qondri-base);
    background: transparent;
    color: var(--qondri-base);
}

.vazy-footer__lang .lang-switcher__dropdown {
    bottom: calc(100% + 8px);
    top: auto;
    transform: translateY(6px);
}

.vazy-footer__lang.open .lang-switcher__dropdown {
    transform: translateY(0);
}

/* ═══════════════════════════════════════════════
   BOOKING MODAL
═══════════════════════════════════════════════ */

/* Prevent body scroll */
body.vazy-modal-open {
    overflow: hidden;
}

/* Overlay */
.vazy-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(10, 20, 40, 0.72);
    backdrop-filter: blur(4px);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.vazy-modal-overlay.active {
    opacity: 1;
    visibility: visible;
}

/* Modal box */
.vazy-modal {
    background: var(--qondri-white);
    border-radius: 20px;
    width: 100%;
    max-width: 580px;
    max-height: 90vh;
    overflow-y: auto;
    position: relative;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.35);
    transform: translateY(20px) scale(0.97);
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    scrollbar-width: thin;
}

.vazy-modal-overlay.active .vazy-modal {
    transform: translateY(0) scale(1);
}

/* Close button */
.vazy-modal__close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--qondri-primary);
    border: none;
    color: var(--qondri-gray);
    font-size: 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    z-index: 2;
}

.vazy-modal__close:hover {
    background: var(--qondri-black);
    color: #fff;
}

/* Modal header */
.vazy-modal__header {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 28px 30px 0;
}

.vazy-modal__header-icon {
    width: 52px;
    height: 52px;
    background: linear-gradient(135deg, var(--qondri-base) 0%, #6e9620 100%);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.vazy-modal__header-icon i {
    font-size: 24px;
    color: #fff;
}

.vazy-modal__title {
    font-size: 22px;
    font-weight: 800;
    color: var(--qondri-black);
    margin: 0 0 3px;
}

.vazy-modal__subtitle {
    font-size: 13px;
    color: var(--qondri-gray);
    margin: 0;
}

/* Progress bar */
.vazy-modal__progress {
    display: flex;
    align-items: center;
    padding: 24px 30px 0;
    gap: 0;
}

.vazy-progress__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.vazy-progress__item span {
    font-size: 11px;
    font-weight: 600;
    color: var(--qondri-gray);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.vazy-progress__dot {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--qondri-primary);
    border: 2px solid var(--qondri-bdr-color);
    color: var(--qondri-gray);
    font-size: 13px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-family: var(--qondri-font);
}

.vazy-progress__dot.active {
    background: var(--qondri-base);
    border-color: var(--qondri-base);
    color: #fff;
    box-shadow: 0 0 0 4px rgba(137, 185, 46, 0.2);
}

.vazy-progress__dot.done {
    background: var(--qondri-base);
    border-color: var(--qondri-base);
    color: #fff;
}

.vazy-progress__dot.done::before {
    content: '✓';
}

.vazy-progress__dot.done > * { display: none; }

.vazy-progress__line {
    flex: 1;
    height: 2px;
    background: var(--qondri-bdr-color);
    margin: 0 8px;
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
}

/* Step body */
.vazy-step-body {
    padding: 24px 30px 30px;
}

.vazy-step__title {
    font-size: 18px;
    font-weight: 700;
    color: var(--qondri-black);
    margin-bottom: 22px;
}

/* Form fields */
.vazy-field {
    margin-bottom: 16px;
}

.vazy-field label {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: var(--qondri-black);
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.vazy-input {
    width: 100%;
    padding: 11px 16px;
    border: 1.5px solid var(--qondri-bdr-color);
    border-radius: 10px;
    font-family: var(--qondri-font);
    font-size: 15px;
    color: var(--qondri-black);
    background: var(--qondri-white);
    outline: none;
    transition: border-color 0.22s, box-shadow 0.22s;
    appearance: auto;
}

.vazy-input:focus {
    border-color: var(--qondri-base);
    box-shadow: 0 0 0 3px rgba(137, 185, 46, 0.15);
}

.vazy-input--error {
    border-color: #e74c3c !important;
    box-shadow: 0 0 0 3px rgba(231, 76, 60, 0.12) !important;
}

.vazy-field-error {
    display: block;
    font-size: 12px;
    color: #e74c3c;
    margin-top: 4px;
    font-weight: 500;
}

textarea.vazy-input {
    resize: vertical;
    min-height: 70px;
}

.vazy-field-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

@media (max-width: 480px) {
    .vazy-field-row { grid-template-columns: 1fr; }
}

/* Modal action buttons */
.vazy-modal__actions {
    margin-top: 22px;
    display: flex;
    justify-content: flex-end;
}

.vazy-modal__actions--split {
    justify-content: space-between;
    align-items: center;
}

.vazy-btn-ghost {
    background: transparent;
    border: 1.5px solid var(--qondri-bdr-color);
    color: var(--qondri-gray);
    padding: 11px 22px;
    border-radius: 30px;
    font-family: var(--qondri-font);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.22s;
}

.vazy-btn-ghost:hover {
    border-color: var(--qondri-black);
    color: var(--qondri-black);
}

/* ── PAYMENT CARDS ── */

.vazy-pay-options {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-bottom: 6px;
}

.vazy-pay-card {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
    border: 2px solid var(--qondri-bdr-color);
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.22s ease;
    background: var(--qondri-white);
}

.vazy-pay-card input { display: none; }

.vazy-pay-card:hover {
    border-color: var(--qondri-base);
    background: rgba(137, 185, 46, 0.04);
}

.vazy-pay-card.selected {
    border-color: var(--qondri-base);
    background: rgba(137, 185, 46, 0.06);
    box-shadow: 0 0 0 3px rgba(137, 185, 46, 0.15);
}

.vazy-pay-card__icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--qondri-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    color: var(--qondri-gray);
    flex-shrink: 0;
}

.vazy-pay-card__icon--momo {
    background: #ffcc00;
    color: #1a1a1a;
}

.vazy-pay-card__text {
    flex: 1;
}

.vazy-pay-card__text strong {
    display: block;
    font-size: 16px;
    color: var(--qondri-black);
    font-weight: 700;
    margin-bottom: 2px;
}

.vazy-pay-card__text span {
    font-size: 13px;
    color: var(--qondri-gray);
}

.vazy-pay-card__check {
    font-size: 20px;
    color: var(--qondri-bdr-color);
    transition: color 0.2s;
}

.vazy-pay-card.selected .vazy-pay-card__check {
    color: var(--qondri-base);
}

/* ── MoMo SCREEN ── */

.momo-screen {
    background: #ffcc00;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 30px rgba(0,0,0,0.15);
}

.momo-header {
    background: #1a1a1a;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.momo-header__logo {
    display: flex;
    align-items: baseline;
    gap: 6px;
}

.momo-header__mtn {
    font-size: 22px;
    font-weight: 900;
    color: #ffcc00;
    letter-spacing: -1px;
    font-family: var(--qondri-font);
}

.momo-header__label {
    font-size: 12px;
    color: rgba(255,255,255,0.7);
    font-weight: 500;
    font-family: var(--qondri-font);
}

.momo-header__rwanda {
    font-size: 13px;
    color: rgba(255,255,255,0.6);
    font-family: var(--qondri-font);
}

.momo-info {
    padding: 20px 20px 16px;
    background: rgba(255,255,255,0.4);
    margin: 0;
}

.momo-info__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid rgba(0,0,0,0.07);
}

.momo-info__row:last-child { border-bottom: none; }

.momo-info__label {
    font-size: 12px;
    font-weight: 600;
    color: #555;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: var(--qondri-font);
}

.momo-info__value {
    font-size: 15px;
    font-weight: 700;
    color: #1a1a1a;
    font-family: var(--qondri-font);
    text-align: right;
}

.momo-info__value--price {
    font-size: 20px;
    color: #cc6600;
}

/* PIN section */
.momo-pin-section {
    padding: 16px 20px 8px;
    text-align: center;
}

.momo-pin__label {
    font-size: 13px;
    font-weight: 700;
    color: #333;
    margin-bottom: 14px;
    font-family: var(--qondri-font);
}

.momo-pin__dots {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin-bottom: 10px;
}

.momo-pin__dot {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(0,0,0,0.15);
    border: 2px solid rgba(0,0,0,0.25);
    transition: all 0.15s ease;
}

.momo-pin__dot.filled {
    background: #1a1a1a;
    border-color: #1a1a1a;
    transform: scale(1.15);
}

.momo-error {
    background: rgba(231, 76, 60, 0.15);
    color: #c0392b;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 12px;
    border-radius: 6px;
    margin-bottom: 8px;
    font-family: var(--qondri-font);
}

/* Keypad */
.momo-keypad {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: rgba(0,0,0,0.1);
    padding: 0 0 1px;
}

.momo-key {
    background: rgba(255,255,255,0.7);
    border: none;
    padding: 18px 10px;
    font-size: 20px;
    font-weight: 700;
    font-family: var(--qondri-font);
    color: #1a1a1a;
    cursor: pointer;
    transition: background 0.12s;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}

.momo-key:hover,
.momo-key:active {
    background: rgba(255,255,255,0.95);
}

.momo-key--clear { color: #e74c3c; font-size: 18px; }
.momo-key--ok    { background: #1a1a1a; color: #ffcc00; font-size: 15px; font-weight: 800; }
.momo-key--ok:hover { background: #333; }

.momo-confirm-btn {
    display: block;
    width: 100%;
    padding: 18px;
    background: #1a1a1a;
    color: #ffcc00;
    border: none;
    font-family: var(--qondri-font);
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 1px;
    cursor: pointer;
    transition: background 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.momo-confirm-btn:hover:not(:disabled) {
    background: #333;
}

.momo-confirm-btn:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

/* ── SUCCESS SCREEN ── */

.vazy-success {
    text-align: center;
    padding: 10px 0 10px;
}

/* Animated SVG checkmark */
.vazy-success__check {
    width: 80px;
    height: 80px;
    margin: 0 auto 20px;
}

.vazy-check-svg {
    width: 80px;
    height: 80px;
}

.vazy-check-circle {
    stroke: var(--qondri-base);
    stroke-width: 2;
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    transition: stroke-dashoffset 0.8s cubic-bezier(0.65, 0, 0.45, 1);
}

.vazy-check-tick {
    stroke: var(--qondri-base);
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    transition: stroke-dashoffset 0.4s 0.7s cubic-bezier(0.65, 0, 0.45, 1);
}

.vazy-success__check.animated .vazy-check-circle {
    stroke-dashoffset: 0;
}

.vazy-success__check.animated .vazy-check-tick {
    stroke-dashoffset: 0;
}

.vazy-success__title {
    font-size: 24px;
    font-weight: 800;
    color: var(--qondri-black);
    margin-bottom: 6px;
}

.vazy-success__sub {
    font-size: 16px;
    color: var(--qondri-gray);
    margin-bottom: 24px;
}

.vazy-success__summary {
    background: var(--qondri-primary);
    border-radius: 12px;
    padding: 18px 22px;
    text-align: left;
    margin-bottom: 20px;
}

.vazy-success__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--qondri-bdr-color);
}

.vazy-success__row:last-child { border-bottom: none; }

.vazy-success__row span {
    font-size: 13px;
    color: var(--qondri-gray);
    display: flex;
    align-items: center;
    gap: 7px;
}

.vazy-success__row span i {
    color: var(--qondri-base);
}

.vazy-success__row strong {
    font-size: 14px;
    color: var(--qondri-black);
    font-weight: 700;
    text-align: right;
    max-width: 55%;
}

.vazy-success__note {
    font-size: 13px;
    color: var(--qondri-gray);
    margin-bottom: 24px;
    line-height: 1.5;
}

.vazy-success__actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}

.vazy-btn-whatsapp {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #25D366;
    color: #fff;
    padding: 12px 24px;
    border-radius: 30px;
    font-family: var(--qondri-font);
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.25s;
    box-shadow: 0 4px 14px rgba(37, 211, 102, 0.35);
}

.vazy-btn-whatsapp:hover {
    background: #1fb855;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(37, 211, 102, 0.45);
}

.vazy-btn-whatsapp i {
    font-size: 18px;
}

/* Modal responsive */
@media (max-width: 575px) {
    .vazy-modal {
        border-radius: 16px;
        max-height: 95vh;
    }
    .vazy-step-body,
    .vazy-modal__header {
        padding-left: 20px;
        padding-right: 20px;
    }
    .vazy-modal__progress {
        padding-left: 20px;
        padding-right: 20px;
    }
    .vazy-progress__item span { display: none; }
}

/* ═══════════════════════════════════════════════
   CONTACT PAGE — PAGE HERO HEADER
═══════════════════════════════════════════════ */

.vazy-page-hero {
    position: relative;
    padding: 120px 0 80px;
    overflow: hidden;
    min-height: 360px;
    display: flex;
    align-items: center;
}

.vazy-page-hero__bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
}

.vazy-page-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(24, 56, 98, 0.88) 0%, rgba(10, 25, 55, 0.75) 100%);
}

.vazy-page-hero__inner {
    position: relative;
    z-index: 2;
    text-align: center;
}

.vazy-page-hero__tag {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: rgba(137, 185, 46, 0.15);
    border: 1px solid rgba(137, 185, 46, 0.4);
    color: var(--qondri-base);
    font-size: 13px;
    font-weight: 700;
    font-family: var(--qondri-font);
    padding: 6px 16px;
    border-radius: 30px;
    letter-spacing: 0.5px;
    margin-bottom: 18px;
    text-transform: uppercase;
}

.vazy-page-hero__title {
    font-size: clamp(32px, 5vw, 50px);
    font-weight: 800;
    color: var(--qondri-white);
    line-height: 1.15;
    margin-bottom: 14px;
    font-family: var(--qondri-font);
}

.vazy-page-hero__sub {
    font-size: 17px;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 24px;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
}

.vazy-page-hero__breadcrumb {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 0;
    padding: 0;
}

.vazy-page-hero__breadcrumb li {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.5);
    font-family: var(--qondri-font);
}

.vazy-page-hero__breadcrumb li.active {
    color: var(--qondri-base);
    font-weight: 700;
}

.vazy-page-hero__breadcrumb a {
    color: rgba(255, 255, 255, 0.65);
    transition: color 0.2s;
}

.vazy-page-hero__breadcrumb a:hover {
    color: var(--qondri-base);
}

.vazy-page-hero__breadcrumb i {
    font-size: 11px;
    color: rgba(255, 255, 255, 0.35);
}

/* ═══════════════════════════════════════════════
   CONTACT PAGE — 3 QUICK ACTION CARDS
═══════════════════════════════════════════════ */

.vazy-contact-actions {
    background: var(--qondri-white);
    padding: 0;
    margin-top: -50px;
    position: relative;
    z-index: 10;
}

.vazy-action-card {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 26px 28px;
    border-radius: 16px;
    text-decoration: none;
    transition: all 0.28s ease;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
    margin-bottom: 30px;
    position: relative;
    overflow: hidden;
}

.vazy-action-card::before {
    content: '';
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.25s;
    background: rgba(255, 255, 255, 0.08);
}

.vazy-action-card:hover::before { opacity: 1; }
.vazy-action-card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18); text-decoration: none; }

.vazy-action-card--green  { background: var(--qondri-base); }
.vazy-action-card--whatsapp { background: #25D366; }
.vazy-action-card--navy   { background: var(--qondri-black); }

.vazy-action-card__icon {
    width: 54px;
    height: 54px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.18);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: #fff;
    flex-shrink: 0;
}

.vazy-action-card__text {
    flex: 1;
}

.vazy-action-card__text strong {
    display: block;
    font-size: 17px;
    font-weight: 800;
    color: #fff;
    font-family: var(--qondri-font);
    margin-bottom: 3px;
}

.vazy-action-card__text span {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.75);
    font-family: var(--qondri-font);
}

.vazy-action-card__arrow {
    font-size: 18px;
    color: rgba(255, 255, 255, 0.5);
    transition: transform 0.2s, color 0.2s;
}

.vazy-action-card:hover .vazy-action-card__arrow {
    color: rgba(255, 255, 255, 0.9);
    transform: translateX(4px);
}

/* ═══════════════════════════════════════════════
   CONTACT PAGE — MAIN SECTION
═══════════════════════════════════════════════ */

.vazy-contact-main {
    padding: 80px 0 90px;
    background: var(--qondri-primary);
}

/* Info column */
.vazy-contact-info__lead {
    color: var(--qondri-gray);
    font-size: 16px;
    line-height: 1.7;
    margin-bottom: 36px;
}

.vazy-contact-info__list {
    margin-bottom: 30px;
}

.vazy-contact-info__item {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    padding: 18px 0;
    border-bottom: 1px solid var(--qondri-bdr-color);
}

.vazy-contact-info__item:last-child { border-bottom: none; }

.vazy-contact-info__icon {
    width: 50px;
    height: 50px;
    border-radius: 14px;
    background: var(--qondri-white);
    border: 1.5px solid var(--qondri-bdr-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: var(--qondri-base);
    flex-shrink: 0;
    transition: all 0.25s;
}

.vazy-contact-info__item:hover .vazy-contact-info__icon {
    background: var(--qondri-base);
    border-color: var(--qondri-base);
    color: #fff;
}

.vazy-contact-info__icon--momo {
    background: #ffcc00;
    border-color: #ffcc00;
    color: #1a1a1a;
}

.vazy-contact-info__item:hover .vazy-contact-info__icon--momo {
    background: #e6b800;
    border-color: #e6b800;
    color: #1a1a1a;
}

.vazy-contact-info__body {
    flex: 1;
}

.vazy-contact-info__body strong {
    display: block;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--qondri-black);
    margin-bottom: 4px;
    font-family: var(--qondri-font);
}

.vazy-contact-info__body span,
.vazy-contact-info__body a {
    font-size: 15px;
    color: var(--qondri-gray);
    font-family: var(--qondri-font);
    line-height: 1.5;
    transition: color 0.2s;
}

.vazy-contact-info__body a:hover {
    color: var(--qondri-base);
}

.vazy-contact-info__socials {
    display: flex;
    gap: 10px;
    margin-top: 10px;
}

.vazy-contact-info__socials a {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--qondri-white);
    border: 1.5px solid var(--qondri-bdr-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: var(--qondri-gray);
    transition: all 0.22s;
    text-decoration: none;
}

.vazy-contact-info__socials a:hover {
    background: var(--qondri-base);
    border-color: var(--qondri-base);
    color: #fff;
    transform: translateY(-2px);
}

/* Contact form wrapper */
.vazy-contact-form-wrap {
    background: var(--qondri-white);
    border-radius: 20px;
    padding: 44px 44px 40px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.07);
}

@media (max-width: 575px) {
    .vazy-contact-form-wrap {
        padding: 30px 24px 28px;
    }
}

.vazy-contact-form-wrap__header {
    margin-bottom: 30px;
}

.vazy-contact-form-wrap__header h3 {
    font-size: 26px;
    font-weight: 800;
    color: var(--qondri-black);
    margin-bottom: 6px;
    font-family: var(--qondri-font);
}

.vazy-contact-form-wrap__header p {
    font-size: 15px;
    color: var(--qondri-gray);
    margin: 0;
}

/* Form fields */
.vazy-cf__field {
    margin-bottom: 18px;
}

.vazy-cf__field label {
    display: block;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: var(--qondri-black);
    margin-bottom: 7px;
    font-family: var(--qondri-font);
}

.vazy-cf__input {
    width: 100%;
    padding: 13px 18px;
    border: 1.5px solid var(--qondri-bdr-color);
    border-radius: 12px;
    font-family: var(--qondri-font);
    font-size: 15px;
    color: var(--qondri-black);
    background: var(--qondri-primary);
    outline: none;
    transition: border-color 0.22s, box-shadow 0.22s, background 0.22s;
    appearance: auto;
}

.vazy-cf__input:focus {
    border-color: var(--qondri-base);
    background: var(--qondri-white);
    box-shadow: 0 0 0 3px rgba(137, 185, 46, 0.12);
}

.vazy-cf__input::placeholder {
    color: rgba(100, 100, 120, 0.45);
}

textarea.vazy-cf__input {
    resize: vertical;
    min-height: 130px;
}

/* Error alert */
.vazy-cf__alert {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 16px;
    font-family: var(--qondri-font);
}

.vazy-cf__alert--error {
    background: rgba(231, 76, 60, 0.08);
    border: 1px solid rgba(231, 76, 60, 0.25);
    color: #c0392b;
}

.vazy-cf__alert--error i { font-size: 16px; }

/* Submit actions */
.vazy-cf__actions {
    margin-top: 6px;
}

.vazy-cf__submit {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    padding: 14px 34px;
    margin-bottom: 14px;
}

.vazy-cf__submit i { font-size: 18px; }

.vazy-cf__note {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--qondri-gray);
    margin: 0;
    font-family: var(--qondri-font);
}

.vazy-cf__note i {
    color: var(--qondri-base);
    font-size: 14px;
}

/* ═══════════════════════════════════════════════════════════
   CONTACT PAGE — ACTION CARDS v2  (.vac-*)
═══════════════════════════════════════════════════════════ */

.vac-strip {
    padding: 0;
    margin-top: -60px;
    position: relative;
    z-index: 10;
}

/* Card base */
.vac-card {
    display: flex;
    flex-direction: column;
    gap: 0;
    border-radius: 20px;
    padding: 28px 28px 22px;
    text-decoration: none;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s cubic-bezier(.22,.68,0,1.2), box-shadow 0.3s ease;
    height: 100%;
    box-shadow: 0 8px 30px rgba(0,0,0,0.14);
}

.vac-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 50px rgba(0,0,0,0.22);
    text-decoration: none;
}

/* Radial glow effect on hover */
.vac-card__glow {
    position: absolute;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: rgba(255,255,255,0.08);
    top: -60px;
    right: -60px;
    pointer-events: none;
    transition: transform 0.4s ease;
}
.vac-card:hover .vac-card__glow { transform: scale(1.5); }

/* Color variants */
.vac-card--navy {
    background: linear-gradient(135deg, #183862 0%, #0f2547 100%);
}
.vac-card--wa {
    background: linear-gradient(135deg, #128C7E 0%, #075E54 100%);
}
.vac-card--green {
    background: linear-gradient(135deg, #89b92e 0%, #6a9120 100%);
}

/* Top row: icon + badge */
.vac-card__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 20px;
}

/* Icon */
.vac-card__icon-wrap {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: rgba(255,255,255,0.15);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: #fff;
    flex-shrink: 0;
    transition: background 0.2s;
}
.vac-card:hover .vac-card__icon-wrap { background: rgba(255,255,255,0.25); }

/* Badge */
.vac-card__badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .7px;
    color: rgba(255,255,255,0.9);
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: 20px;
    padding: 4px 10px;
    font-family: var(--qondri-font);
}

/* Pulsing green dot for "Online" badge */
.vac-card__badge--pulse::before {
    content: '';
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #4ade80;
    animation: vac-pulse 1.6s infinite;
}
@keyframes vac-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%       { opacity: .5; transform: scale(1.3); }
}

/* Body */
.vac-card__body {
    flex: 1;
    margin-bottom: 18px;
}

.vac-card__label {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .9px;
    color: rgba(255,255,255,0.6);
    margin: 0 0 6px;
    font-family: var(--qondri-font);
}

.vac-card__value {
    display: block;
    font-size: 20px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -.3px;
    line-height: 1.2;
    margin-bottom: 6px;
    font-family: var(--qondri-font);
}

.vac-card__hint {
    font-size: 13px;
    color: rgba(255,255,255,0.55);
    margin: 0;
    font-family: var(--qondri-font);
}

/* CTA row at bottom */
.vac-card__cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 16px;
    border-top: 1px solid rgba(255,255,255,0.15);
}

.vac-card__cta span {
    font-size: 13px;
    font-weight: 700;
    color: rgba(255,255,255,0.85);
    text-transform: uppercase;
    letter-spacing: .8px;
    font-family: var(--qondri-font);
}

.vac-card__cta i {
    font-size: 14px;
    color: rgba(255,255,255,0.6);
    transition: transform 0.2s, color 0.2s;
}

.vac-card:hover .vac-card__cta i {
    transform: translateX(5px);
    color: #fff;
}

/* Responsive */
@media (max-width: 767px) {
    .vac-strip { margin-top: -30px; }
    .vac-card { padding: 22px 22px 18px; border-radius: 16px; }
    .vac-card__value { font-size: 18px; }
}

@media (max-width: 575px) {
    .vac-strip { margin-top: 0; padding: 24px 0 0; }
    .vac-card { flex-direction: row; align-items: center; gap: 16px; padding: 18px 20px; }
    .vac-card__top { flex-direction: column; align-items: flex-start; margin-bottom: 0; gap: 8px; }
    .vac-card__body { margin-bottom: 0; }
    .vac-card__cta { display: none; }
    .vac-card__glow { display: none; }
    .vac-card__icon-wrap { width: 48px; height: 48px; font-size: 20px; border-radius: 12px; }
    .vac-card__value { font-size: 16px; }
    .vac-card__hint { font-size: 12px; }
}

/* ═══════════════════════════════════════════════════════════
   CONTACT PAGE — CTA BANNER v2  (.vcta)
═══════════════════════════════════════════════════════════ */

.vcta {
    position: relative;
    background: linear-gradient(125deg, #0f2547 0%, #183862 40%, #1e4d80 70%, #0f2547 100%);
    padding: 70px 0;
    overflow: hidden;
    margin-top: 0;
}

/* Decorative blobs */
.vcta__blob {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}
.vcta__blob--1 {
    width: 420px;
    height: 420px;
    background: radial-gradient(circle, rgba(137,185,46,0.18) 0%, transparent 70%);
    top: -120px;
    right: -80px;
}
.vcta__blob--2 {
    width: 280px;
    height: 280px;
    background: radial-gradient(circle, rgba(255,255,255,0.05) 0%, transparent 70%);
    bottom: -80px;
    left: 10%;
}
.vcta__blob--3 {
    width: 160px;
    height: 160px;
    background: radial-gradient(circle, rgba(137,185,46,0.12) 0%, transparent 70%);
    top: 50%;
    left: 42%;
    transform: translateY(-50%);
}

/* Inner layout */
.vcta__inner {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

/* Left side */
.vcta__left {
    display: flex;
    align-items: center;
    gap: 24px;
    flex: 1;
}

.vcta__icon-ring {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: rgba(255,255,255,0.08);
    border: 2px solid rgba(137,185,46,0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    color: #89b92e;
}

.vcta__eyebrow {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: #89b92e;
    margin: 0 0 8px;
    font-family: var(--qondri-font);
}
.vcta__eyebrow i { font-size: 10px; }

.vcta__title {
    font-size: clamp(1.55rem, 2.5vw, 2.1rem);
    font-weight: 900;
    color: #fff;
    line-height: 1.2;
    letter-spacing: -.5px;
    margin: 0 0 8px;
    font-family: var(--qondri-font);
}

.vcta__sub {
    font-size: 14px;
    color: rgba(255,255,255,0.55);
    margin: 0;
    font-family: var(--qondri-font);
    max-width: 340px;
}

/* Right side */
.vcta__right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 18px;
    flex-shrink: 0;
}

/* Phone block */
.vcta__phone {
    display: flex;
    align-items: center;
    gap: 14px;
    text-decoration: none;
    background: rgba(255,255,255,0.07);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 14px;
    padding: 12px 20px;
    transition: background 0.2s, border-color 0.2s;
    width: 100%;
}
.vcta__phone:hover {
    background: rgba(255,255,255,0.13);
    border-color: rgba(137,185,46,0.5);
    text-decoration: none;
}

.vcta__phone-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: #89b92e;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #fff;
    flex-shrink: 0;
}

.vcta__phone-text {
    display: flex;
    flex-direction: column;
}
.vcta__phone-text small {
    font-size: 11px;
    color: rgba(255,255,255,0.5);
    font-family: var(--qondri-font);
    text-transform: uppercase;
    letter-spacing: .6px;
    line-height: 1;
    margin-bottom: 3px;
}
.vcta__phone-text {
    font-size: 18px;
    font-weight: 800;
    color: #fff;
    font-family: var(--qondri-font);
    letter-spacing: -.2px;
}

/* Buttons row */
.vcta__btns {
    display: flex;
    gap: 12px;
    width: 100%;
}

.vcta__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 13px 22px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 700;
    font-family: var(--qondri-font);
    text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s, background 0.2s;
    flex: 1;
    white-space: nowrap;
}
.vcta__btn:hover { transform: translateY(-2px); text-decoration: none; }

.vcta__btn--primary {
    background: #89b92e;
    color: #fff;
    box-shadow: 0 4px 18px rgba(137,185,46,0.35);
}
.vcta__btn--primary:hover {
    background: #7aaa22;
    color: #fff;
    box-shadow: 0 8px 28px rgba(137,185,46,0.45);
}

.vcta__btn--wa {
    background: #25D366;
    color: #fff;
    box-shadow: 0 4px 18px rgba(37,211,102,0.3);
}
.vcta__btn--wa:hover {
    background: #1ebe5d;
    color: #fff;
    box-shadow: 0 8px 28px rgba(37,211,102,0.4);
}

/* Responsive */
@media (max-width: 991px) {
    .vcta__inner {
        flex-direction: column;
        align-items: stretch;
        gap: 28px;
        text-align: center;
    }
    .vcta__left { flex-direction: column; align-items: center; text-align: center; }
    .vcta__right { align-items: center; }
    .vcta__sub { max-width: 100%; }
    .vcta__icon-ring { display: none; }
    .vcta__phone { max-width: 340px; }
}

@media (max-width: 575px) {
    .vcta { padding: 50px 0; }
    .vcta__title { font-size: 1.5rem; }
    .vcta__phone { max-width: 100%; }
    .vcta__btns { flex-direction: column; }
    .vcta__btn { padding: 14px; font-size: 15px; }
}

/* ── Unified alert (replaces old .vazy-cf__alert) ── */
.vcf-alert {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 13px 16px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 18px;
    font-family: var(--qondri-font);
    line-height: 1.5;
}

.vcf-alert i { font-size: 16px; flex-shrink: 0; margin-top: 1px; }

.vcf-alert--error {
    background: rgba(239, 68, 68, 0.07);
    border: 1px solid rgba(239, 68, 68, 0.25);
    color: #c0392b;
}

.vcf-alert--success {
    background: rgba(22, 163, 74, 0.07);
    border: 1px solid rgba(22, 163, 74, 0.3);
    color: #15803d;
}

/* ── Address label hint ── */
.vcf-label-hint {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 500;
    color: var(--qondri-gray);
    margin-left: 8px;
    text-transform: none;
    letter-spacing: 0;
    font-style: italic;
}

/* ── Google Maps embed inside form ── */
.vcf-map-wrap {
    border-radius: 12px;
    overflow: hidden;
    border: 1.5px solid var(--qondri-bdr-color);
    margin-bottom: 18px;
    position: relative;
    box-shadow: 0 2px 12px rgba(24, 56, 98, 0.08);
    transition: border-color 0.2s;
}

.vcf-map-wrap:focus-within {
    border-color: var(--qondri-base);
}

.vcf-map {
    width: 100%;
    height: 260px;
    display: block;
}

.vcf-map-hint {
    padding: 8px 14px;
    font-size: 12px;
    color: var(--qondri-gray);
    background: #f8fafc;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    font-family: var(--qondri-font);
    border-top: 1px solid var(--qondri-bdr-color);
}

.vcf-map-hint i { color: var(--qondri-base); font-size: 12px; }

/* ── Character counter ── */
.vcf-char-count {
    display: block;
    text-align: right;
    font-size: 11px;
    color: var(--qondri-gray);
    margin-top: 4px;
    font-family: var(--qondri-font);
}

/* ── Responsive ── */
@media (max-width: 575px) {
    .vcf-map { height: 220px; }
}

/* ═══════════════════════════════════════════════
   CONTACT PAGE — MAP
═══════════════════════════════════════════════ */

.vazy-contact-map {
    position: relative;
}

.vazy-contact-map__inner {
    position: relative;
    line-height: 0;
}

.vazy-contact-map__inner iframe {
    display: block;
    width: 100%;
    height: 480px;
    border: none;
    filter: grayscale(15%);
}

.vazy-contact-map__badge {
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--qondri-black);
    color: var(--qondri-white);
    padding: 10px 24px;
    border-radius: 30px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 700;
    font-family: var(--qondri-font);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
    white-space: nowrap;
}

.vazy-contact-map__badge i {
    color: var(--qondri-base);
    font-size: 16px;
}

@media (max-width: 575px) {
    .vazy-contact-map__inner iframe { height: 320px; }
    .vazy-contact-map__badge { font-size: 12px; padding: 8px 16px; }
}

/* ── Contact info column wrapper ── */
.vazy-contact-info-col {
    height: 100%;
}

.vazy-contact-info__lead {
    font-size: 16px;
    color: var(--qondri-gray);
    line-height: 1.75;
    margin-top: 14px;
    margin-bottom: 32px;
    font-family: var(--qondri-font);
}

/* ── Mini trust badges below socials ── */
.vazy-contact-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px solid var(--qondri-bdr-color);
}

.vazy-contact-trust__item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: rgba(137, 185, 46, 0.07);
    border: 1px solid rgba(137, 185, 46, 0.2);
    border-radius: 20px;
    padding: 5px 14px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--qondri-black);
    font-family: var(--qondri-font);
}

.vazy-contact-trust__item i {
    color: var(--qondri-base);
    font-size: 12px;
}

/* ── Quick action cards grid fix ── */
.vazy-contact-actions .vazy-action-card {
    height: 100%;
    margin-bottom: 0;
}

/* ── Page hero — overlay added via HTML ── */
.vazy-page-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(24, 56, 98, 0.88) 0%, rgba(10, 25, 55, 0.78) 100%);
    z-index: 1;
}

.vazy-page-hero .container { position: relative; z-index: 2; }

/* ── Responsive for contact page ── */
@media (max-width: 991px) {
    .vazy-contact-main { padding: 60px 0 70px; }
    .vazy-contact-info-col { margin-bottom: 0; }
}

@media (max-width: 767px) {
    .vazy-contact-actions { margin-top: -30px; }
    .vazy-contact-actions .row { gap: 14px 0; }
    .vazy-page-hero { padding: 90px 0 60px; min-height: 280px; }
    .vazy-page-hero__title { font-size: clamp(1.5rem, 6vw, 2.2rem); }
    .vazy-page-hero__sub { font-size: 14px; }
    .vazy-contact-main { padding: 50px 0 60px; }
    .vazy-contact-trust { gap: 8px; }
    .vazy-cf__submit { width: 100%; justify-content: center; }
}

@media (max-width: 480px) {
    .vazy-contact-form-wrap { padding: 24px 16px 22px; }
    .vazy-contact-info__socials a { width: 34px; height: 34px; font-size: 13px; }
}

/* ═══════════════════════════════════════════════════════════
   NAVBAR — Cart / Notification / Auth Icons
═══════════════════════════════════════════════════════════ */

.vazy-nav__icon-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255,255,255,0.08);
    color: #fff;
    font-size: 16px;
    text-decoration: none;
    transition: background .2s;
    margin: 0 3px;
}
.vazy-nav__icon-btn:hover { background: rgba(255,255,255,0.18); color: #fff; }

.vazy-badge {
    position: absolute;
    top: -4px; right: -4px;
    min-width: 18px; height: 18px;
    background: #89b92e;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    border-radius: 20px;
    display: flex; align-items: center; justify-content: center;
    padding: 0 4px;
    line-height: 1;
    border: 2px solid #183862;
}
.vazy-badge--red { background: #e74c3c; }
.vazy-badge-small {
    background: #89b92e; color: #fff;
    font-size: 10px; font-weight: 700;
    padding: 2px 8px; border-radius: 20px;
    vertical-align: middle; margin-left: 6px;
}

/* ── User Dropdown ── */
.vazy-nav__user { position: relative; display: inline-block; }
.vazy-nav__user-btn {
    display: flex; align-items: center; gap: 6px;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 30px;
    padding: 6px 14px;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background .2s;
}
.vazy-nav__user-btn:hover { background: rgba(255,255,255,0.18); }
.vazy-nav__user-btn i.fa-user-circle { font-size: 18px; }

.vazy-nav__user-dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    min-width: 220px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.14);
    padding: 8px 0;
    list-style: none;
    margin: 0;
    z-index: 9999;
}
.vazy-nav__user:hover .vazy-nav__user-dropdown,
.vazy-nav__user-btn:focus + .vazy-nav__user-dropdown { display: block; }
.vazy-nav__user-dropdown li a {
    display: flex; align-items: center; gap: 10px;
    padding: 9px 18px;
    color: #183862;
    font-size: 14px;
    text-decoration: none;
    transition: background .15s;
}
.vazy-nav__user-dropdown li a:hover { background: #f4f6f8; color: #89b92e; }
.vazy-nav__user-dropdown li a i { width: 16px; color: #89b92e; }
.vazy-nav__user-dropdown-header {
    padding: 12px 18px 10px;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 4px;
}
.vazy-nav__user-dropdown-header strong {
    display: block; font-size: 14px; color: #183862; font-weight: 700;
}
.vazy-nav__user-dropdown-header span {
    font-size: 12px; color: #888;
}
.vazy-dropdown-divider { height: 1px; background: #f0f0f0; margin: 4px 0; }

/* ── Auth Buttons ── */
.vazy-nav__auth-btns { display: flex; align-items: center; gap: 8px; }
.vazy-nav__login-btn {
    display: flex; align-items: center; gap: 6px;
    padding: 7px 16px;
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: 30px;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: background .2s, border-color .2s;
}
.vazy-nav__login-btn:hover {
    background: rgba(255,255,255,0.12);
    border-color: rgba(255,255,255,0.5);
    color: #fff;
}
.vazy-nav__register-btn {
    padding: 7px 16px !important;
    font-size: 13px !important;
}

/* ── Modal login notice ── */
.vazy-modal__login-notice {
    background: #eaf3ff;
    border: 1px solid #c3daf9;
    border-radius: 8px;
    padding: 10px 14px;
    display: flex; align-items: center; gap: 10px;
    font-size: 13px; color: #183862;
    margin-bottom: 16px;
}
.vazy-modal__login-notice a { color: #89b92e; font-weight: 700; }

/* ═══════════════════════════════════════════════
   BOOKING MODAL — LOGIN GATE (.vbm-*)
═══════════════════════════════════════════════ */

.vbm-login-gate {
    text-align: center;
    padding: 10px 0 4px;
}

.vbm-login-gate__icon {
    width: 68px; height: 68px; border-radius: 50%;
    background: linear-gradient(135deg, #183862, #0f2547);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 28px; color: #89b92e;
    margin: 0 auto 16px;
    box-shadow: 0 8px 24px rgba(24,56,98,0.25);
}

.vbm-login-gate__title {
    font-size: 1.25rem; font-weight: 800; color: #183862;
    margin: 0 0 8px; font-family: var(--qondri-font);
}

.vbm-login-gate__sub {
    font-size: 14px; color: #64748b; line-height: 1.65;
    max-width: 320px; margin: 0 auto 20px;
    font-family: var(--qondri-font);
}

.vbm-login-gate__perks {
    display: flex; justify-content: center;
    gap: 8px; flex-wrap: wrap; margin-bottom: 24px;
}

.vbm-perk {
    display: inline-flex; align-items: center; gap: 6px;
    background: #f0f6ff; border: 1px solid #dbeafe;
    border-radius: 20px; padding: 5px 12px;
    font-size: 12px; color: #183862; font-weight: 600;
    font-family: var(--qondri-font);
}
.vbm-perk i { font-size: 11px; color: #89b92e; }

.vbm-login-gate__actions {
    display: flex; flex-direction: column; gap: 10px;
    max-width: 320px; margin: 0 auto 16px;
}

.vbm-btn {
    display: flex; align-items: center; justify-content: center;
    gap: 9px; padding: 13px 20px; border-radius: 10px;
    font-size: 14px; font-weight: 700; text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s;
    font-family: var(--qondri-font);
}
.vbm-btn:hover { transform: translateY(-2px); text-decoration: none; }

.vbm-btn--primary {
    background: #89b92e; color: #fff;
    box-shadow: 0 4px 16px rgba(137,185,46,0.3);
}
.vbm-btn--primary:hover { background: #7aaa22; color: #fff; }

.vbm-btn--outline {
    background: transparent; color: #183862;
    border: 2px solid #e2e8f0;
}
.vbm-btn--outline:hover { border-color: #183862; background: #f8fafc; color: #183862; }

.vbm-login-gate__note {
    font-size: 11px; color: #94a3b8;
    display: flex; align-items: center; justify-content: center; gap: 5px;
    margin: 0; font-family: var(--qondri-font);
}
.vbm-login-gate__note i { color: #89b92e; }

/* ═══════════════════════════════════════════════
   BOOKING MODAL — ADDRESS FIELD (.vbm-addr-*)
═══════════════════════════════════════════════ */

.vbm-addr-hint {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 11px; font-weight: 500; color: #94a3b8;
    margin-left: 6px; font-style: italic;
}

.vbm-addr-wrap {
    position: relative; display: flex; align-items: center;
}

.vbm-addr-wrap__icon {
    position: absolute; left: 13px; font-size: 14px;
    color: #94a3b8; pointer-events: none; z-index: 1;
}

.vbm-addr-input { padding-left: 38px !important; padding-right: 44px !important; }

.vbm-locate-btn {
    position: absolute; right: 8px;
    width: 30px; height: 30px; border-radius: 7px;
    border: 1.5px solid #e2e8f0; background: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 13px; color: #183862; cursor: pointer;
    transition: border-color 0.2s, color 0.2s; flex-shrink: 0;
}
.vbm-locate-btn:hover { border-color: #89b92e; color: #89b92e; }

.vbm-addr-badge {
    display: none; align-items: center; gap: 7px;
    margin-top: 6px; padding: 7px 12px;
    background: #f0fdf4; border: 1px solid #bbf7d0;
    border-radius: 8px; font-size: 12px; color: #166534;
    font-family: var(--qondri-font); font-weight: 500;
}
.vbm-addr-badge i { color: #16a34a; font-size: 12px; flex-shrink: 0; }
.vbm-addr-badge span { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vbm-addr-badge button {
    border: none; background: none; color: #94a3b8;
    cursor: pointer; padding: 0; font-size: 11px; flex-shrink: 0;
}
.vbm-addr-badge button:hover { color: #e74c3c; }

/* ─ MoMo processing notice ─ */
.vazy-momo-push-notice {
    background: #fff7e6;
    border: 1px solid #f9c74f;
    border-radius: 10px;
    padding: 14px 18px;
    display: flex; align-items: flex-start; gap: 12px;
    font-size: 13px; color: #7c5c00;
    margin: 16px 0;
    text-align: left;
}
.vazy-momo-push-notice i { font-size: 22px; color: #f9c74f; flex-shrink: 0; margin-top: 2px; }

/* ═══════════════════════════════════════════════════════════
   AUTH PAGES
═══════════════════════════════════════════════════════════ */

.vazy-auth-section {
    min-height: 100vh;
    display: flex;
    align-items: center;
    position: relative;
    padding: 80px 0;
    background: #f4f6f8;
}
.vazy-auth-bg {
    position: absolute; inset: 0;
    background: linear-gradient(135deg, #183862 0%, #0d2040 100%);
    opacity: .06;
    pointer-events: none;
}
.vazy-auth-card {
    background: #fff;
    border-radius: 20px;
    padding: 40px;
    box-shadow: 0 8px 48px rgba(24,56,98,.10);
    position: relative;
}
.vazy-auth-card__header { text-align: center; margin-bottom: 28px; }
.vazy-auth-card__header h2 { font-size: 26px; font-weight: 800; color: #183862; margin: 0 0 6px; }
.vazy-auth-card__header p  { color: #666; font-size: 14px; margin: 0; }
.vazy-auth__field { margin-bottom: 18px; }
.vazy-auth__field label { display: block; font-size: 13px; font-weight: 600; color: #444; margin-bottom: 6px; }
.vazy-auth__input-wrap { position: relative; }
.vazy-auth__input-wrap > i:first-child {
    position: absolute; left: 14px; top: 50%;
    transform: translateY(-50%);
    color: #aaa; font-size: 15px;
    pointer-events: none;
}
.vazy-auth__input-wrap textarea + i,
.vazy-auth__input-wrap select { padding-left: 42px !important; }
.vazy-auth__input {
    width: 100%;
    padding: 11px 14px 11px 42px;
    border: 1.5px solid #e2e8f0;
    border-radius: 10px;
    font-size: 14px;
    color: #183862;
    background: #fafbfc;
    transition: border-color .2s, box-shadow .2s;
    outline: none;
    font-family: inherit;
}
.vazy-auth__input:focus {
    border-color: #89b92e;
    box-shadow: 0 0 0 3px rgba(137,185,46,.12);
    background: #fff;
}
.vazy-auth__input--error { border-color: #e74c3c !important; }
textarea.vazy-auth__input { resize: vertical; min-height: 80px; padding-top: 12px; }
select.vazy-auth__input { appearance: none; }
.vazy-auth__toggle-pw {
    position: absolute; right: 12px; top: 50%;
    transform: translateY(-50%);
    background: none; border: none; cursor: pointer;
    color: #aaa; padding: 4px;
}
.vazy-auth__meta { display: flex; justify-content: space-between; align-items: center; font-size: 13px; }
.vazy-auth__remember { display: flex; align-items: center; gap: 6px; cursor: pointer; color: #555; }
.vazy-auth__forgot { color: #89b92e; font-weight: 600; text-decoration: none; }
.vazy-auth__forgot:hover { text-decoration: underline; }
.vazy-auth__switch {
    text-align: center;
    margin: 20px 0 0;
    font-size: 14px; color: #666;
}
.vazy-auth__switch a { color: #89b92e; font-weight: 700; }
.vazy-field-error { display: block; color: #e74c3c; font-size: 12px; margin-top: 4px; }

/* ═══════════════════════════════════════════════════════════
   ACCOUNT PAGES
═══════════════════════════════════════════════════════════ */

.vazy-account-section {
    background: #f4f6f8;
    padding: 60px 0 80px;
    min-height: 70vh;
}

/* Sidebar */
.vazy-account-sidebar {
    background: #183862;
    border-radius: 16px;
    overflow: hidden;
    position: sticky;
    top: 100px;
}
.vazy-account-sidebar__user {
    display: flex; align-items: center; gap: 12px;
    padding: 20px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}
.vazy-account-sidebar__avatar {
    font-size: 36px;
    color: rgba(255,255,255,0.5);
    line-height: 1;
}
.vazy-account-sidebar__user strong { display: block; color: #fff; font-size: 14px; font-weight: 700; }
.vazy-account-sidebar__user span   { font-size: 11px; color: rgba(255,255,255,0.5); }
.vazy-account-sidebar__nav { padding: 10px 0; }
.vazy-account-sidebar__nav a {
    display: flex; align-items: center; gap: 10px;
    padding: 11px 20px;
    color: rgba(255,255,255,0.7);
    font-size: 14px; font-weight: 500;
    text-decoration: none;
    transition: background .15s, color .15s;
}
.vazy-account-sidebar__nav a i { width: 16px; color: rgba(255,255,255,0.4); font-size: 14px; }
.vazy-account-sidebar__nav a:hover,
.vazy-account-sidebar__nav a.active {
    background: rgba(255,255,255,0.08);
    color: #89b92e;
}
.vazy-account-sidebar__nav a.active i,
.vazy-account-sidebar__nav a:hover i { color: #89b92e; }
.vazy-account-sidebar__divider { height: 1px; background: rgba(255,255,255,.1); margin: 6px 20px; }
.vazy-account-sidebar__logout { color: rgba(255,100,100,.7) !important; }
.vazy-account-sidebar__logout i { color: rgba(255,100,100,.5) !important; }
.vazy-account-sidebar__logout:hover { color: #ff6b6b !important; background: rgba(255,100,100,.08) !important; }

/* Content area */
.vazy-account-content {
    background: #fff;
    border-radius: 16px;
    padding: 32px;
    min-height: 400px;
    box-shadow: 0 2px 20px rgba(24,56,98,.06);
}
.vazy-account-content__header {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 28px;
    flex-wrap: wrap; gap: 12px;
}
.vazy-account-content__header h3 { font-size: 22px; font-weight: 800; color: #183862; margin: 0; }
.vazy-account-content__filters { display: flex; flex-wrap: wrap; gap: 8px; }
.vazy-filter-tag {
    padding: 4px 14px;
    border-radius: 20px;
    font-size: 12px; font-weight: 600;
    background: #f4f6f8; color: #555;
    text-decoration: none;
    transition: background .15s, color .15s;
}
.vazy-filter-tag.active,
.vazy-filter-tag:hover { background: #183862; color: #fff; }

/* Stats */
.vazy-stat-card {
    background: #fff;
    border-radius: 12px;
    padding: 20px;
    display: flex; align-items: center; gap: 14px;
    box-shadow: 0 2px 16px rgba(24,56,98,.07);
    border: 1px solid #f0f4f8;
}
.vazy-stat-card__icon {
    width: 48px; height: 48px;
    border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    font-size: 20px;
    flex-shrink: 0;
}
.vazy-stat-card__icon--blue  { background: #eef2ff; color: #183862; }
.vazy-stat-card__icon--green { background: #f0fdf4; color: #27ae60; }
.vazy-stat-card__icon--gold  { background: #fffbeb; color: #d97706; }
.vazy-stat-card__info strong { display: block; font-size: 22px; font-weight: 800; color: #183862; line-height: 1; }
.vazy-stat-card__info span   { font-size: 12px; color: #888; }

/* Tables */
.vazy-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.vazy-table thead tr { background: #f4f6f8; }
.vazy-table thead th { padding: 12px 14px; text-align: left; font-weight: 700; color: #183862; font-size: 12px; text-transform: uppercase; letter-spacing: .5px; }
.vazy-table tbody td { padding: 12px 14px; border-bottom: 1px solid #f4f6f8; color: #444; vertical-align: middle; }
.vazy-table tbody tr:last-child td { border-bottom: none; }
.vazy-table tfoot td { padding: 10px 14px; border-top: 2px solid #eee; font-size: 14px; }

/* Order badges */
.vazy-order-badge {
    display: inline-block;
    padding: 3px 10px; border-radius: 20px;
    font-size: 11px; font-weight: 700;
    text-transform: capitalize;
}
.vazy-order-badge--pending      { background: #fff7e6; color: #d97706; }
.vazy-order-badge--confirmed    { background: #f0fdf4; color: #27ae60; }
.vazy-order-badge--processing   { background: #eef2ff; color: #183862; }
.vazy-order-badge--ready        { background: #f0fdf4; color: #16a34a; }
.vazy-order-badge--out_for_delivery { background: #e0f2fe; color: #0369a1; }
.vazy-order-badge--delivered    { background: #dcfce7; color: #15803d; }
.vazy-order-badge--cancelled    { background: #fef2f2; color: #dc2626; }

.vazy-pay-badge {
    display: inline-block;
    padding: 3px 10px; border-radius: 20px;
    font-size: 11px; font-weight: 700;
}
.vazy-pay-badge--unpaid  { background: #fef2f2; color: #dc2626; }
.vazy-pay-badge--pending { background: #fff7e6; color: #d97706; }
.vazy-pay-badge--paid    { background: #f0fdf4; color: #27ae60; }
.vazy-pay-badge--failed  { background: #fef2f2; color: #dc2626; }
.vazy-pay-badge--refunded{ background: #eef2ff; color: #7c3aed; }

/* Panels */
.vazy-account-panel { background: #fff; border: 1px solid #eee; border-radius: 12px; overflow: hidden; }
.vazy-account-panel__header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid #f0f4f8;
    background: #fafbfc;
}
.vazy-account-panel__header h5 { margin: 0; font-size: 15px; font-weight: 700; color: #183862; }

/* Empty state */
.vazy-empty-state { text-align: center; padding: 48px 24px; color: #999; }
.vazy-empty-state i { font-size: 48px; display: block; margin-bottom: 16px; color: #dde3e8; }
.vazy-empty-state p { margin: 0; font-size: 15px; }

/* Notifications list */
.vazy-notif-list { list-style: none; margin: 0; padding: 0; }
.vazy-notif-list li {
    display: flex; gap: 12px;
    padding: 14px 20px;
    border-bottom: 1px solid #f4f6f8;
}
.vazy-notif-list li:last-child { border-bottom: none; }
.vazy-notif-list li.unread { background: #f7faff; }
.vazy-notif-list__icon {
    width: 32px; height: 32px;
    border-radius: 50%;
    background: #eef2ff;
    color: #183862;
    display: flex; align-items: center; justify-content: center;
    font-size: 14px; flex-shrink: 0; margin-top: 2px;
}
.vazy-notif-list__body strong { display: block; font-size: 14px; color: #183862; font-weight: 600; }
.vazy-notif-list__body p  { margin: 2px 0; font-size: 13px; color: #666; }
.vazy-notif-list__body small { font-size: 11px; color: #aaa; }

/* Pagination */
.vazy-pagination { display: flex; align-items: center; gap: 12px; justify-content: center; }
.vazy-pagination__btn {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: #183862; color: #fff;
    display: flex; align-items: center; justify-content: center;
    text-decoration: none;
    transition: background .2s;
}
.vazy-pagination__btn:hover { background: #89b92e; color: #fff; }
.vazy-pagination__info { font-size: 14px; color: #666; }

/* Links */
.vazy-link { color: #89b92e; text-decoration: none; font-weight: 600; font-size: 13px; }
.vazy-link:hover { text-decoration: underline; color: #6d9b22; }

/* Buttons */
.vazy-btn-outline {
    display: inline-flex; align-items: center;
    padding: 11px 24px;
    border: 2px solid #183862;
    border-radius: 30px;
    color: #183862;
    font-size: 14px; font-weight: 700;
    text-decoration: none;
    transition: all .2s;
}
.vazy-btn-outline:hover { background: #183862; color: #fff; }
.vazy-btn-ghost {
    display: inline-flex; align-items: center;
    padding: 11px 24px;
    border: 1.5px solid #dde3e8;
    border-radius: 30px;
    color: #555;
    font-size: 14px; font-weight: 600;
    text-decoration: none;
    background: #fff;
    transition: all .2s;
    cursor: pointer;
}
.vazy-btn-ghost:hover { border-color: #183862; color: #183862; }

/* Address cards */
.vazy-address-card {
    background: #fafbfc;
    border: 2px solid #eee;
    border-radius: 12px;
    padding: 18px;
    height: 100%;
}
.vazy-address-card--default { border-color: #89b92e; }
.vazy-address-card__label { font-size: 13px; font-weight: 700; color: #183862; margin-bottom: 8px; }
.vazy-address-card p { font-size: 13px; color: #555; line-height: 1.7; margin: 0 0 10px; }
.vazy-address-card__actions { font-size: 13px; }

/* Detail label */
.vazy-detail-label { font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: #aaa; font-weight: 700; display: block; margin-bottom: 4px; }

/* Cart */
.vazy-cart-item {
    display: flex; align-items: center; gap: 14px;
    padding: 16px 20px;
    border-bottom: 1px solid #f4f6f8;
}
.vazy-cart-item:last-child { border-bottom: none; }
.vazy-cart-item__icon {
    width: 44px; height: 44px;
    border-radius: 10px;
    background: #eef2ff;
    color: #183862;
    display: flex; align-items: center; justify-content: center;
    font-size: 20px; flex-shrink: 0;
}
.vazy-cart-item__info { flex: 1; min-width: 0; }
.vazy-cart-item__info strong { display: block; font-size: 14px; font-weight: 700; color: #183862; }
.vazy-cart-item__info span   { font-size: 12px; color: #888; }
.vazy-cart-item__info small  { display: block; font-size: 11px; color: #aaa; margin-top: 2px; }
.vazy-cart-item__qty .vazy-qty-input { width: 70px; text-align: center; }
.vazy-cart-item__subtotal { font-weight: 700; color: #183862; font-size: 15px; white-space: nowrap; }
.vazy-cart-item__remove button { background: none; border: none; color: #ccc; cursor: pointer; font-size: 16px; padding: 4px; transition: color .2s; }
.vazy-cart-item__remove button:hover { color: #e74c3c; }

.vazy-qty-input {
    padding: 6px 10px;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    font-size: 14px; text-align: center;
    width: 80px;
}

.vazy-cart-summary__row {
    display: flex; justify-content: space-between;
    padding: 8px 0;
    font-size: 14px; color: #555;
    border-bottom: 1px dashed #f0f0f0;
}
.vazy-cart-summary__row:last-child { border-bottom: none; }
.vazy-cart-summary__total {
    font-size: 17px !important;
    font-weight: 800 !important;
    color: #183862 !important;
    border-top: 2px solid #eee !important;
    padding-top: 12px !important;
    margin-top: 4px;
}

.vazy-cart-product {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 12px;
    padding: 20px;
    text-align: center;
    transition: box-shadow .2s;
}
.vazy-cart-product:hover { box-shadow: 0 4px 20px rgba(24,56,98,.1); }
.vazy-cart-product__icon { font-size: 32px; color: #89b92e; margin-bottom: 10px; }
.vazy-cart-product h6 { font-size: 14px; font-weight: 700; color: #183862; margin-bottom: 4px; }
.vazy-cart-product p { font-size: 13px; color: #888; margin-bottom: 12px; }

/* Payment status page */
.vazy-momo-steps { margin: 20px 0; }
.vazy-momo-step {
    display: flex; align-items: flex-start; gap: 12px;
    text-align: left; padding: 10px 0;
    border-bottom: 1px dashed #f0f0f0;
    font-size: 13px; color: #555;
}
.vazy-momo-step:last-child { border-bottom: none; }
.vazy-momo-step i { font-size: 20px; color: #89b92e; flex-shrink: 0; margin-top: 1px; }
.vazy-payment-amount {
    background: #f4f6f8;
    border-radius: 10px;
    padding: 14px;
    margin: 16px 0;
    display: flex; align-items: center; justify-content: space-between;
}
.vazy-payment-amount span  { font-size: 13px; color: #888; }
.vazy-payment-amount strong { font-size: 22px; font-weight: 800; color: #183862; }
.vazy-polling-indicator {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    color: #888; font-size: 13px; margin-top: 16px;
}
@keyframes pulseIcon {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.08); opacity: .8; }
}
.pulse-icon { animation: pulseIcon 1.8s ease-in-out infinite; display: inline-block; }

/* Order status row */
.vazy-order-status-row {
    display: flex; flex-wrap: wrap; gap: 24px;
}
.vazy-order-status-row > div {
    display: flex; flex-direction: column; gap: 6px;
}
.vazy-order-status-row label {
    font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: #aaa; font-weight: 700;
}

/* Invoice preview wrapper */
.vazy-invoice-preview {
    border: 1px solid #eee;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
}
.vazy-invoice-preview iframe { border: none; width: 100%; min-height: 800px; }

/* Toggle password */
.vazy-auth__input-wrap .vazy-auth__toggle-pw { top: 50%; transform: translateY(-50%); }

@media (max-width: 991px) {
    .vazy-account-sidebar { position: static; margin-bottom: 24px; }
    .vazy-account-content { padding: 24px; }
}
@media (max-width: 767px) {
    .vazy-auth-card { padding: 24px; }
    .vazy-account-content { padding: 16px; }
    .vazy-cart-item { flex-wrap: wrap; }
    .vazy-order-status-row { flex-direction: column; gap: 12px; }
}


/* ╔══════════════════════════════════════════════════════════════
   ║  VAZY DESIGN SYSTEM EXTENSION
   ║  Global font override, design tokens, component upgrades,
   ║  homepage new elements, responsive polish
   ╚══════════════════════════════════════════════════════════════ */

/* ── MARIANNE GLOBAL FONT OVERRIDE ───────────────────────────── */
html, body,
h1, h2, h3, h4, h5, h6,
p, span, a, li,
.main-header, .main-menu, .vazy-nav,
.vazy-topbar, .vazy-footer,
.thm-btn, .donate-btn,
input, textarea, select, button,
.feature-one__title, .feature-one__text,
.section-title__tagline, .section-title__title,
.services-one__title, .services-one__text,
.how-we-work__title, .how-we-work__text,
.why-choose-one__title, .why-choose-one__text,
.testimonial-one__text, .testimonial-one__client-name,
.pricing-plan, .contact-info,
.cta-one__title, .welcome-one__text-1, .welcome-one__text-2 {
    font-family: "Marianne", Arial, Helvetica, sans-serif;
}

/* ── DESIGN TOKENS ────────────────────────────────────────────── */
:root {
    --vazy-radius:         8px;
    --vazy-radius-lg:      14px;
    --vazy-radius-xl:      20px;
    --vazy-shadow-sm:      0 2px 8px rgba(24, 56, 98, .07);
    --vazy-shadow-md:      0 6px 24px rgba(24, 56, 98, .12);
    --vazy-shadow-lg:      0 16px 48px rgba(24, 56, 98, .16);
    --vazy-section-gap:    80px;
    --vazy-green:          #25d366;   /* WhatsApp green */
    --vazy-transition:     all 0.28s cubic-bezier(.4, 0, .2, 1);
}

/* ── SECTION SPACING ─────────────────────────────────────────── */
/* NOTE: .welcome-one and .pricing-plan intentionally excluded —
   they use complex absolute-positioned layouts from qondri.css
   that depend on their original padding values.                  */
.feature-one,
.services-one,
.how-we-work,
.why-choose-one,
.testimonial-one {
    padding-top: var(--vazy-section-gap);
    padding-bottom: var(--vazy-section-gap);
}

/* ── HEADING RHYTHM ──────────────────────────────────────────── */
.section-title__tagline {
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    font-size: 13px;
}

.section-title__title {
    font-weight: 800;
    line-height: 1.18;
    letter-spacing: -0.3px;
}

/* ── BUTTON HARMONIZATION ────────────────────────────────────── */
.thm-btn {
    border-radius: var(--vazy-radius);
    font-family: "Marianne", Arial, Helvetica, sans-serif;
    font-weight: 700;
    letter-spacing: 0.2px;
    transition: var(--vazy-transition);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.thm-btn:hover {
    transform: translateY(-2px);
    box-shadow: var(--vazy-shadow-md);
}

/* ── CARD IMPROVEMENTS ───────────────────────────────────────── */
.services-one__single {
    border-radius: var(--vazy-radius-lg);
    overflow: hidden;
    transition: var(--vazy-transition);
    box-shadow: var(--vazy-shadow-sm);
}

.services-one__single:hover {
    box-shadow: var(--vazy-shadow-lg);
    transform: translateY(-6px);
}

.services-one__img {
    position: relative;
    overflow: hidden;
}

.services-one__img img {
    transition: transform 0.5s ease;
}

.services-one__single:hover .services-one__img img {
    transform: scale(1.06);
}

/* Service price display */
.services-one__price {
    display: flex;
    align-items: baseline;
    gap: 4px;
    margin: 4px 0 8px;
}

.services-one__price-amount {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--qondri-black);
    font-family: "Marianne", Arial, Helvetica, sans-serif;
}

.services-one__price-unit {
    font-size: 12px;
    color: var(--qondri-gray);
    font-weight: 500;
}

/* Service category badge */
.services-one__category-badge {
    position: absolute;
    top: 14px;
    left: 14px;
    background: rgba(24, 56, 98, 0.82);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    backdrop-filter: blur(4px);
    font-family: "Marianne", Arial, Helvetica, sans-serif;
}

/* Feature boxes */
.feature-one__single {
    border-radius: var(--vazy-radius-lg);
    transition: var(--vazy-transition);
}

.feature-one__single:hover {
    transform: translateY(-4px);
    box-shadow: var(--vazy-shadow-md);
}

/* Why choose us items */
.why-choose-one__points li {
    transition: var(--vazy-transition);
}

/* ── HERO ENHANCEMENTS ───────────────────────────────────────── */
.main-slider__btns {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 36px;
}

.main-slider__whatsapp-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--vazy-green);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    padding: 13px 30px;
    border-radius: var(--vazy-radius);
    font-family: "Marianne", Arial, Helvetica, sans-serif;
    text-decoration: none;
    transition: var(--vazy-transition);
    border: 2px solid transparent;
}

.main-slider__whatsapp-btn:hover {
    background: transparent;
    border-color: #fff;
    color: #fff;
    transform: translateY(-2px);
}

.main-slider__whatsapp-btn i {
    font-size: 18px;
}

/* Remove old margin-top from single .thm-btn in hero */
.main-slider__content > .thm-btn {
    margin-top: 0;
}

/* ── TRUST STRIP ─────────────────────────────────────────────── */
.vazy-trust-strip {
    background: var(--qondri-black);
    padding: 16px 0;
    position: relative;
    z-index: 5;
}

.vazy-trust-strip__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px 0;
}

.vazy-trust-item {
    display: flex;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, 0.85);
    font-size: 13px;
    font-weight: 600;
    font-family: "Marianne", Arial, Helvetica, sans-serif;
    padding: 0 24px;
    white-space: nowrap;
}

.vazy-trust-item i {
    color: var(--qondri-base);
    font-size: 16px;
    flex-shrink: 0;
}

.vazy-trust-sep {
    width: 1px;
    height: 20px;
    background: rgba(255, 255, 255, 0.15);
    flex-shrink: 0;
}

/* ── NAVBAR WHATSAPP BUTTON ───────────────────────────────────── */
.vazy-nav__whatsapp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: var(--vazy-green);
    color: #fff;
    border-radius: 50%;
    font-size: 18px;
    text-decoration: none;
    transition: var(--vazy-transition);
    flex-shrink: 0;
}

.vazy-nav__whatsapp-btn:hover {
    background: #1ebe5d;
    color: #fff;
    transform: scale(1.1);
}

/* ── FOOTER EXTENSIONS ───────────────────────────────────────── */

/* Payment methods strip */
.vazy-footer__payment {
    margin-top: 20px;
}

.vazy-footer__payment-label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.4);
    margin-bottom: 8px;
    font-weight: 600;
    font-family: "Marianne", Arial, Helvetica, sans-serif;
}

.vazy-footer__payment-methods {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.vazy-footer__pay-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    font-family: "Marianne", Arial, Helvetica, sans-serif;
}

.vazy-footer__pay-badge--momo {
    background: rgba(137, 185, 46, 0.15);
    color: var(--qondri-base);
    border: 1px solid rgba(137, 185, 46, 0.3);
}

.vazy-footer__pay-badge--cash {
    background: rgba(255, 255, 255, 0.07);
    color: rgba(255, 255, 255, 0.65);
    border: 1px solid rgba(255, 255, 255, 0.15);
}

/* Service area block */
.vazy-footer__service-area {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.vazy-footer__service-area-title {
    font-size: 12px;
    font-weight: 700;
    color: var(--qondri-base);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 6px;
    font-family: "Marianne", Arial, Helvetica, sans-serif;
    display: flex;
    align-items: center;
    gap: 6px;
}

.vazy-footer__service-area p {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
    line-height: 1.7;
    margin: 0;
}

/* Footer contact actions */
.vazy-footer__contact-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 16px;
}

.vazy-footer__whatsapp {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: var(--vazy-green);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    padding: 9px 18px;
    border-radius: var(--vazy-radius);
    text-decoration: none;
    transition: var(--vazy-transition);
    font-family: "Marianne", Arial, Helvetica, sans-serif;
    text-align: center;
}

.vazy-footer__whatsapp:hover {
    background: #1ebe5d;
    color: #fff;
}

/* Footer column title underline */
.vazy-footer__col-title {
    position: relative;
    padding-bottom: 12px;
    margin-bottom: 20px;
}

.vazy-footer__col-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 28px;
    height: 2px;
    background: var(--qondri-base);
    border-radius: 2px;
}

/* Footer links hover with arrow */
.vazy-footer__links li a {
    transition: var(--vazy-transition);
}

.vazy-footer__links li a:hover {
    padding-left: 6px;
    color: var(--qondri-base);
}

/* ── PRICING PLAN REDESIGN ───────────────────────────────────── */
.pricing-plan__card {
    border-radius: var(--vazy-radius-xl);
    padding: 40px 36px;
    height: 100%;
    position: relative;
    transition: var(--vazy-transition);
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.pricing-plan__card--popular {
    background: var(--qondri-black);
    color: #fff;
    box-shadow: var(--vazy-shadow-lg);
    border: 2px solid var(--qondri-base);
}

.pricing-plan__card--basic {
    background: #fff;
    border: 2px solid var(--qondri-bdr-color);
    box-shadow: var(--vazy-shadow-sm);
}

.pricing-plan__card--popular:hover,
.pricing-plan__card--basic:hover {
    transform: translateY(-6px);
    box-shadow: var(--vazy-shadow-lg);
}

.pricing-plan__popular-badge {
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--qondri-base);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    padding: 4px 18px;
    border-radius: 20px;
    white-space: nowrap;
    font-family: "Marianne", Arial, Helvetica, sans-serif;
    letter-spacing: 0.3px;
}

.pricing-plan__popular-badge i {
    margin-right: 4px;
}

.pricing-plan__card--popular .pricing-plan__badge {
    color: rgba(255, 255, 255, 0.65);
}

.pricing-plan__card--popular .pricing-plan__amount,
.pricing-plan__card--popular .pricing-plan__subtitle {
    color: #fff;
}

.pricing-plan__card--popular .pricing-plan__period {
    color: rgba(255, 255, 255, 0.6);
}

.pricing-plan__badge--alt {
    color: var(--qondri-gray);
    background: var(--qondri-primary);
    font-size: 12px;
    font-weight: 700;
    padding: 4px 14px;
    border-radius: 20px;
    display: inline-block;
    font-family: "Marianne", Arial, Helvetica, sans-serif;
    letter-spacing: 0.5px;
}

.pricing-plan__features-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
}

.pricing-plan__features-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    line-height: 1.5;
    font-family: "Marianne", Arial, Helvetica, sans-serif;
}

.pricing-plan__card--popular .pricing-plan__features-list li {
    color: rgba(255, 255, 255, 0.85);
}

.pricing-plan__features-list li i.fa-check-circle {
    color: var(--qondri-base);
    font-size: 15px;
    margin-top: 1px;
    flex-shrink: 0;
}

.pricing-plan__btn--alt {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--qondri-primary);
    color: var(--qondri-black);
    font-size: 15px;
    font-weight: 700;
    padding: 13px 32px;
    border-radius: var(--vazy-radius);
    text-decoration: none;
    transition: var(--vazy-transition);
    font-family: "Marianne", Arial, Helvetica, sans-serif;
    border: 2px solid var(--qondri-bdr-color);
    text-align: center;
}

.pricing-plan__btn--alt:hover {
    background: var(--qondri-black);
    color: #fff;
    border-color: var(--qondri-black);
    transform: translateY(-2px);
}

/* ── CONTACT INFO IMPROVEMENTS ───────────────────────────────── */
.contact-info__card {
    border-radius: var(--vazy-radius-lg);
    transition: var(--vazy-transition);
}

.contact-info__card:hover {
    transform: translateY(-4px);
    box-shadow: var(--vazy-shadow-md);
}

.contact-info__bottom-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.contact-info__whatsapp-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--vazy-green);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    padding: 13px 28px;
    border-radius: var(--vazy-radius);
    text-decoration: none;
    transition: var(--vazy-transition);
    font-family: "Marianne", Arial, Helvetica, sans-serif;
}

.contact-info__whatsapp-btn:hover {
    background: #1ebe5d;
    color: #fff;
    transform: translateY(-2px);
}

.contact-info__whatsapp-btn i {
    font-size: 18px;
}

/* ── CTA STRIP WHATSAPP BUTTON ───────────────────────────────── */
.cta-one__whatsapp-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--vazy-green);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    padding: 11px 22px;
    border-radius: var(--vazy-radius);
    text-decoration: none;
    transition: var(--vazy-transition);
    font-family: "Marianne", Arial, Helvetica, sans-serif;
    margin-top: 10px;
}

.cta-one__whatsapp-btn:hover {
    background: #1ebe5d;
    color: #fff;
}

.cta-one__btn-box {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
}

/* ── HOW IT WORKS — STEP COUNTER POLISH ──────────────────────── */
.how-we-work__count {
    background: var(--qondri-base);
    color: #fff;
    font-weight: 800;
    font-family: "Marianne", Arial, Helvetica, sans-serif;
    border-radius: 50%;
}

.how-we-work__single-box {
    transition: var(--vazy-transition);
}

.how-we-work__single-box:hover {
    transform: translateY(-4px);
}

/* ── TOPBAR ENHANCEMENT ──────────────────────────────────────── */
.vazy-topbar__inner {
    height: 46px;
}

.vazy-topbar__info li {
    letter-spacing: 0.1px;
}

/* ── SCROLL-TO-TOP ───────────────────────────────────────────── */
.scroll-to-top {
    border-radius: var(--vazy-radius);
    transition: var(--vazy-transition);
}

/* ── RESPONSIVE POLISH ───────────────────────────────────────── */
@media (max-width: 1199px) {
    .vazy-trust-strip__inner {
        gap: 6px 0;
    }
    .vazy-trust-item {
        padding: 0 14px;
        font-size: 12px;
    }
}

@media (max-width: 991px) {
    :root {
        --vazy-section-gap: 60px;
    }

    .vazy-trust-sep:nth-child(6),
    .vazy-trust-sep:nth-child(8) {
        display: none;
    }

    .vazy-trust-item:nth-child(7),
    .vazy-trust-item:nth-child(9) {
        display: none;
    }

    .main-slider__btns {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .pricing-plan__card {
        padding: 32px 24px;
    }

    .contact-info__bottom-actions {
        flex-direction: column;
        align-items: stretch;
    }
}

@media (max-width: 767px) {
    :root {
        --vazy-section-gap: 60px;
    }

    .vazy-trust-strip {
        padding: 12px 0;
    }

    .vazy-trust-strip__inner {
        justify-content: flex-start;
        overflow-x: auto;
        flex-wrap: nowrap;
        padding: 0 4px;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }

    .vazy-trust-strip__inner::-webkit-scrollbar {
        display: none;
    }

    .vazy-trust-sep {
        display: none;
    }

    .main-slider__btns {
        margin-top: 24px;
    }

    .main-slider__whatsapp-btn {
        font-size: 14px;
        padding: 11px 22px;
    }

    .pricing-plan__card {
        padding: 28px 20px;
        margin-bottom: 20px;
    }

    .vazy-footer__payment-methods {
        flex-direction: row;
    }

    .vazy-footer__contact-actions {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .cta-one__btn-box {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 10px;
        align-items: center;
    }
}

@media (max-width: 480px) {
    .vazy-trust-item {
        padding: 0 16px;
        font-size: 12px;
    }

    .section-title__title {
        font-size: 1.75rem;
    }

    .services-one__price-amount {
        font-size: 0.95rem;
    }
}

/* ════════════════════════════════════════════════════════════════
   COMPREHENSIVE MOBILE RESPONSIVE
   — Mobile nav · Homepage · Cards · Booking modal
════════════════════════════════════════════════════════════════ */

/* ──────────────────────────────────────────────────────────────
   1. MOBILE NAV DRAWER — override qondri base styles
─────────────────────────────────────────────────────────────── */

/* Increase drawer width */
.mobile-nav__content {
    width: min(88vw, 360px) !important;
    background: #111827 !important;
    padding: 0 !important;
    overflow-y: auto !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Hide the old close span qondri renders */
.mobile-nav__close:not(.vmn__close) {
    display: none !important;
}

/* Overlay is dark enough from qondri, just ensure z is right */
.mobile-nav__overlay {
    background: rgba(0, 0, 0, 0.55) !important;
    backdrop-filter: blur(3px);
}

/* Prevent all the default qondri padding on mobile-nav__top / bottom */
.mobile-nav__top,
.mobile-nav__social,
.mobile-nav__contact:not(.vmn__contact) {
    display: none !important;
}

/* Force our vmn__links to display nicely regardless of qondri injection */
.mobile-nav__container {
    padding: 8px 12px 4px !important;
}

.mobile-nav__container .main-menu__list {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.mobile-nav__container .main-menu__list > li {
    padding: 0 !important;
    margin: 0 !important;
}

.mobile-nav__container .main-menu__list > li > a {
    display: flex !important;
    align-items: center !important;
    padding: 12px 14px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: rgba(255, 255, 255, 0.78) !important;
    text-decoration: none !important;
    border-radius: 10px !important;
    transition: background 0.18s, color 0.18s !important;
    font-family: var(--qondri-font) !important;
    background: none !important;
    border: none !important;
}

.mobile-nav__container .main-menu__list > li > a:hover,
.mobile-nav__container .main-menu__list > li.current > a {
    background: rgba(137, 185, 46, 0.1) !important;
    color: #fff !important;
}

.mobile-nav__container .main-menu__list > li.current > a {
    color: var(--qondri-base) !important;
    font-weight: 700 !important;
}

/* Remove the expand arrows injected by qondri for simple links */
.mobile-nav__container .main-menu__list > li > a button {
    display: none !important;
}

/* ──────────────────────────────────────────────────────────────
   2. HERO SECTION
─────────────────────────────────────────────────────────────── */

@media (max-width: 991px) {
    .main-slider .col-xl-7 { max-width: 100%; flex: 0 0 100%; }
    .main-slider__content { padding-top: 80px; padding-bottom: 80px; }
    .main-slider__content h2 { font-size: clamp(1.8rem, 6vw, 3rem); line-height: 1.2; }
    .main-slider__content p { font-size: 1rem; }
}

@media (max-width: 767px) {
    .main-slider__content { padding: 60px 0 60px; }
    .main-slider__content h2 { font-size: clamp(1.5rem, 7vw, 2.2rem); }
    .main-slider__btns {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    .main-slider__btns .thm-btn,
    .main-slider__btns .main-slider__whatsapp-btn {
        width: 100%;
        justify-content: center;
        text-align: center;
    }
    .main-slider__whatsapp-btn {
        padding: 13px 20px !important;
    }
    .location-chip { font-size: 12px; padding: 5px 12px; }
}

@media (max-width: 480px) {
    .main-slider__content { padding: 50px 0 50px; }
    .main-slider__content h2 { font-size: 1.5rem; }
    .main-slider__content p { font-size: 0.9rem; margin-bottom: 16px; }
}

/* ──────────────────────────────────────────────────────────────
   3. TRUST STRIP
─────────────────────────────────────────────────────────────── */

@media (max-width: 767px) {
    .vazy-trust-strip__inner {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: 0;
        overflow: visible;
    }
    .vazy-trust-sep { display: none !important; }
    .vazy-trust-item {
        border-bottom: 1px solid rgba(24, 56, 98, 0.08);
        padding: 14px 16px;
        justify-content: flex-start;
    }
    .vazy-trust-item:nth-child(odd) {
        border-right: 1px solid rgba(24, 56, 98, 0.08);
    }
    /* last item full-width if 5 items (odd count) */
    .vazy-trust-item:last-child:nth-child(odd) {
        grid-column: 1 / -1;
        justify-content: center;
        border-right: none;
    }
}

@media (max-width: 480px) {
    .vazy-trust-item { font-size: 12.5px; padding: 12px 12px; gap: 8px; }
    .vazy-trust-item i { font-size: 15px; }
}

/* ──────────────────────────────────────────────────────────────
   4. FEATURE BOXES
─────────────────────────────────────────────────────────────── */

@media (max-width: 991px) {
    .feature-one .row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
    .feature-one .row > [class*="col-"] { max-width: 100% !important; flex: none !important; width: 100% !important; }
}

@media (max-width: 575px) {
    .feature-one .row { grid-template-columns: 1fr; }
    .feature-one__single { flex-direction: row; align-items: flex-start; gap: 16px; }
    .feature-one__icon { flex-shrink: 0; }
}

/* ──────────────────────────────────────────────────────────────
   5. ABOUT / WELCOME SECTION
─────────────────────────────────────────────────────────────── */

@media (max-width: 1199px) {
    /* The welcome section has complex absolute-positioned images — simplify */
    .welcome-one__small-img { display: none; }
    .welcome-one { padding-bottom: 80px !important; }
}

@media (max-width: 991px) {
    .welcome-one { padding-top: 60px !important; padding-bottom: 60px !important; }
    .welcome-one__left { margin-bottom: 40px; }
    .welcome-one__img-box { max-width: 480px; margin: 0 auto; }
    .welcome-one__img img { border-radius: 16px; width: 100%; }
    .welcome-one__experience {
        bottom: 16px; right: 16px;
        padding: 12px 18px;
    }
    .welcome-one__shape-1,
    .welcome-one__shape-2,
    .welcome-one-foam-shape { display: none; }
}

@media (max-width: 767px) {
    .welcome-one { padding-top: 50px !important; padding-bottom: 50px !important; }
    .welcome-one__button-call {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
    .welcome-one__btn { width: 100%; justify-content: center; text-align: center; }
    .welcome-one__points li { align-items: flex-start; }
    .welcome-one__points li .text p { font-size: 14px; }
}

/* ──────────────────────────────────────────────────────────────
   6. SERVICES CARDS
─────────────────────────────────────────────────────────────── */

@media (max-width: 991px) {
    .services-one .row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
    .services-one .row > [class*="col-"] { max-width: 100% !important; flex: none !important; width: 100% !important; }
}

@media (max-width: 575px) {
    .services-one .row { grid-template-columns: 1fr; }
    .services-one__single { max-width: 420px; margin: 0 auto; }
}

/* ──────────────────────────────────────────────────────────────
   7. HOW IT WORKS
─────────────────────────────────────────────────────────────── */

@media (max-width: 991px) {
    .how-we-work__list {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }
    .how-we-work__single { width: 100% !important; }
    /* 5th item centered in last row */
    .how-we-work__list > li:last-child:nth-child(odd) {
        grid-column: 1 / -1;
        max-width: 360px;
        margin: 0 auto;
    }
    .how-we-work-shape { display: none !important; }
}

@media (max-width: 575px) {
    .how-we-work__list { grid-template-columns: 1fr; }
    .how-we-work__list > li:last-child:nth-child(odd) { grid-column: auto; max-width: 100%; }
    .how-we-work__single-box { padding: 24px 20px; }
    .how-we-work__icon { width: 60px; height: 60px; font-size: 28px; }
    .how-we-work__title { font-size: 1rem; }
    .how-we-work__text { font-size: 0.875rem; }
    .how-we-work__btn { width: 100%; text-align: center; justify-content: center; }
}

/* ──────────────────────────────────────────────────────────────
   8. WHY CHOOSE US
─────────────────────────────────────────────────────────────── */

@media (max-width: 1199px) {
    .why-choose-one__left { margin-bottom: 40px; }
}

@media (max-width: 767px) {
    .why-choose-one__points > li {
        flex-direction: row;
        align-items: flex-start;
        gap: 14px;
    }
    .why-choose-one-shape-1 { display: none !important; }
}

/* ──────────────────────────────────────────────────────────────
   9. TESTIMONIALS
─────────────────────────────────────────────────────────────── */

@media (max-width: 991px) {
    .testimonial-one__thumb-box { display: none; }
    #testimonials-one__carousel__image { display: none; }
    .testimonials-one__main-content .col-xl-6:first-child { display: none; }
    .testimonials-one__main-content .col-xl-6:last-child {
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
}

/* ──────────────────────────────────────────────────────────────
   10. PRICING SECTION
─────────────────────────────────────────────────────────────── */

@media (max-width: 991px) {
    .pricing-plan .row { flex-direction: column; align-items: center; }
    .pricing-plan .col-xl-5,
    .pricing-plan .col-lg-6 { max-width: 520px; width: 100%; flex: none; }
}

@media (max-width: 575px) {
    .pricing-plan .col-xl-5,
    .pricing-plan .col-lg-6 { max-width: 100%; }
    .pricing-plan__card { padding: 24px 20px; }
    .pricing-plan__features-list li { font-size: 14px; gap: 10px; }
    .pricing-plan__btn,
    .pricing-plan__btn--alt {
        width: 100%;
        text-align: center;
        justify-content: center;
    }
}

/* ──────────────────────────────────────────────────────────────
   11. CONTACT INFO SECTION
─────────────────────────────────────────────────────────────── */

@media (max-width: 767px) {
    .contact-info__bottom {
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }
    .contact-info__bottom-text { text-align: center; }
    .contact-info__bottom-actions {
        flex-direction: column;
        width: 100%;
        gap: 12px;
    }
    .contact-info__bottom-actions .thm-btn,
    .contact-info__whatsapp-btn {
        width: 100%;
        text-align: center;
        justify-content: center;
    }
}

@media (max-width: 575px) {
    .contact-info__card { padding: 24px 20px; }
    .contact-info .row { gap: 20px 0; }
}

/* ──────────────────────────────────────────────────────────────
   12. CTA STRIP
─────────────────────────────────────────────────────────────── */

@media (max-width: 767px) {
    .cta-one__inner {
        flex-direction: column;
        text-align: center;
        gap: 20px;
        padding: 36px 24px;
    }
    .cta-one__car { display: none !important; }
    .cta-one__btn-box {
        flex-direction: column;
        width: 100%;
        gap: 12px;
    }
    .cta-one__btn-box .thm-btn,
    .cta-one__whatsapp-btn {
        width: 100%;
        text-align: center;
        justify-content: center;
    }
    .cta-one__title { font-size: 1.3rem; }
    .cta-one__number a { font-size: 1.1rem; }
}

/* ──────────────────────────────────────────────────────────────
   13. BOOKING MODAL — Bottom sheet on mobile
─────────────────────────────────────────────────────────────── */

@media (max-width: 600px) {
    /* Overlay sticks to bottom */
    .vazy-modal-overlay {
        align-items: flex-end !important;
        padding: 0 !important;
    }

    /* Modal becomes a bottom sheet */
    .vazy-modal {
        max-width: 100% !important;
        width: 100% !important;
        border-radius: 22px 22px 0 0 !important;
        max-height: 93vh !important;
        transform: translateY(100%) !important;
        transition: transform 0.4s cubic-bezier(0.32, 0.72, 0, 1) !important;
    }

    .vazy-modal-overlay.active .vazy-modal {
        transform: translateY(0) !important;
    }

    /* Drag handle visual cue */
    .vazy-modal::before {
        content: '';
        display: block;
        width: 40px;
        height: 4px;
        background: rgba(0, 0, 0, 0.12);
        border-radius: 4px;
        margin: 12px auto 0;
        flex-shrink: 0;
    }

    /* Tighter padding on mobile */
    .vazy-modal__header { padding: 12px 18px 0; }
    .vazy-modal__header-icon { width: 40px; height: 40px; border-radius: 10px; }
    .vazy-modal__header-icon i { font-size: 18px; }
    .vazy-modal__title { font-size: 18px; }
    .vazy-modal__subtitle { font-size: 12px; }

    /* Progress bar — smaller */
    .vazy-modal__progress { padding: 16px 18px 0; }
    .vazy-progress__dot { width: 28px; height: 28px; font-size: 12px; }
    .vazy-progress__item span { font-size: 10px; letter-spacing: 0; }

    /* Step body */
    .vazy-step-body { padding: 16px 18px 24px; }
    .vazy-step__title { font-size: 1rem; margin-bottom: 14px; }

    /* Stack name + phone fields */
    .vazy-field-row {
        flex-direction: column !important;
        gap: 0 !important;
    }

    /* Inputs feel native */
    .vazy-input {
        font-size: 16px !important; /* prevent iOS zoom */
        padding: 11px 14px !important;
        border-radius: 10px !important;
    }

    /* Action buttons full width */
    .vazy-modal__actions { flex-direction: column; gap: 10px; }
    .vazy-modal__actions .thm-btn,
    .vazy-modal__actions .vazy-btn-ghost { width: 100%; text-align: center; justify-content: center; }

    /* Stacked split actions */
    .vazy-modal__actions--split { flex-direction: row; }
    .vazy-modal__actions--split .vazy-btn-ghost { flex: 0 0 auto; }
    .vazy-modal__actions--split .thm-btn { flex: 1; }

    /* Payment cards — compact */
    .vazy-pay-card {
        padding: 12px 14px;
        gap: 12px;
    }
    .vazy-pay-card__icon { width: 38px; height: 38px; }

    /* Close button */
    .vazy-modal__close { top: 12px; right: 14px; width: 30px; height: 30px; font-size: 13px; }
}

/* ──────────────────────────────────────────────────────────────
   14. GENERAL SECTION SPACING ON MOBILE
─────────────────────────────────────────────────────────────── */

@media (max-width: 767px) {
    .feature-one,
    .services-one,
    .how-we-work,
    .why-choose-one,
    .testimonial-one,
    .contact-info,
    .cta-one {
        padding-top: 60px !important;
        padding-bottom: 60px !important;
    }
    .section-title { margin-bottom: 30px !important; }
    .section-title__title { font-size: clamp(1.5rem, 5.5vw, 2.2rem) !important; }
    .section-title__tagline { font-size: 12px !important; }
}

@media (max-width: 480px) {
    .feature-one,
    .services-one,
    .how-we-work,
    .why-choose-one,
    .testimonial-one,
    .contact-info,
    .cta-one {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
}

/* ──────────────────────────────────────────────────────────────
   15. FOOTER MOBILE
─────────────────────────────────────────────────────────────── */

@media (max-width: 767px) {
    .vazy-footer__main { padding: 50px 0 30px; }
    .vazy-footer__brand { text-align: center; align-items: center; }
    .vazy-footer__socials { justify-content: center; }
    .vazy-footer__payment { align-items: center; }
    .vazy-footer__newsletter-inner {
        flex-direction: column;
        gap: 16px;
        text-align: center;
    }
    .vazy-footer__newsletter-form { width: 100%; }
    .vazy-footer__newsletter-form input { flex: 1; min-width: 0; }
    .vazy-footer__bottom-inner {
        flex-direction: column;
        text-align: center;
        gap: 14px;
    }
    .vazy-footer__bottom-links { justify-content: center; }
    .vazy-footer__lang { margin: 0 auto; }
}

@media (max-width: 480px) {
    .vazy-footer__col-title { font-size: 1rem; }
    .vazy-footer__contact-actions { flex-direction: column; }
    .vazy-footer__cta,
    .vazy-footer__whatsapp { width: 100%; justify-content: center; text-align: center; }
}

/* ═══════════════════════════════════════════════════════════
   GOOGLE MAPS — PLACES AUTOCOMPLETE DROPDOWN
   Must sit above all UI layers (modals, sticky header, etc.)
═══════════════════════════════════════════════════════════ */

/* The floating autocomplete suggestions box */
.pac-container {
    z-index: 99999 !important;
    font-family: var(--qondri-font, 'Marianne', Arial, sans-serif) !important;
    border-radius: 10px !important;
    border: 1.5px solid #e2e8f0 !important;
    box-shadow: 0 8px 32px rgba(24, 56, 98, 0.13) !important;
    padding: 4px 0 !important;
    margin-top: 4px !important;
    overflow: hidden;
}

.pac-item {
    padding: 9px 14px !important;
    font-size: 14px !important;
    cursor: pointer;
    border-top: 1px solid #f0f2f5 !important;
    line-height: 1.5 !important;
}

.pac-item:first-child { border-top: none !important; }

.pac-item:hover,
.pac-item-selected {
    background: #f0f6ff !important;
}

.pac-item-query {
    font-size: 14px !important;
    color: #183862 !important;
    font-weight: 600;
}

.pac-matched {
    color: #89b92e !important;
    font-weight: 700;
}

.pac-icon {
    margin-right: 8px !important;
}

/* Hide Google logo in the dropdown — cosmetic only */
.pac-logo::after { display: none !important; }

/* ═══════════════════════════════════════════════════════════
   SERVICES GRID — vi-services (index.php premium redesign)
═══════════════════════════════════════════════════════════ */

.vi-services {
    padding: 100px 0 110px;
    background: #f7f9ff;
}

.vi-services__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    margin-top: 50px;
}

/* Card */
.vi-svc-card {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(24,56,98,.07);
    transition: transform .3s ease, box-shadow .3s ease;
    display: flex;
    flex-direction: column;
}
.vi-svc-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 48px rgba(24,56,98,.14);
}

/* Image area */
.vi-svc-card__img-wrap {
    position: relative;
    height: 210px;
    overflow: hidden;
}
.vi-svc-card__img-wrap img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}
.vi-svc-card:hover .vi-svc-card__img-wrap img {
    transform: scale(1.05);
}
.vi-svc-card__overlay {
    position: absolute; inset: 0;
    background: linear-gradient(to bottom, transparent 40%, rgba(15,25,50,.55) 100%);
}

/* Service icon pill */
.vi-svc-card__icon-pill {
    position: absolute;
    top: 14px; left: 14px;
    width: 44px; height: 44px;
    background: var(--svc-color, #183862);
    border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: 1.05rem;
    box-shadow: 0 4px 12px rgba(0,0,0,.25);
}

/* Price tag */
.vi-svc-card__price-tag {
    position: absolute;
    bottom: 14px; right: 14px;
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(6px);
    border-radius: 100px;
    padding: 4px 12px;
    font-size: .78rem; font-weight: 800;
    color: #183862;
    line-height: 1.4;
}
.vi-svc-card__price-tag span {
    font-weight: 500; color: #666;
    margin-left: 2px;
}

/* Card body */
.vi-svc-card__body {
    padding: 22px 22px 24px;
    display: flex; flex-direction: column; gap: 10px;
    flex: 1;
}
.vi-svc-card__title {
    font-size: 1.05rem; font-weight: 800;
    color: #1a1a2e; margin: 0;
    line-height: 1.3;
}
.vi-svc-card__text {
    font-size: .86rem; color: #667;
    line-height: 1.6; margin: 0;
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.vi-svc-card__btn {
    display: inline-flex; align-items: center; gap: 6px;
    margin-top: auto;
    background: none;
    color: #183862; font-weight: 700; font-size: .84rem;
    text-decoration: none;
    padding: 0;
    border: none;
    transition: gap .2s, color .2s;
}
.vi-svc-card__btn:hover {
    color: var(--qondri-base, #89b92e);
    gap: 10px;
}

/* Responsive */
@media (max-width: 1199px) {
    .vi-services__grid { grid-template-columns: repeat(2, 1fr); gap: 22px; }
}
@media (max-width: 767px) {
    .vi-services__grid { grid-template-columns: 1fr; gap: 18px; }
    .vi-svc-card__img-wrap { height: 180px; }
    .vi-services { padding: 70px 0 80px; }
}

/* ═══════════════════════════════════════════════════════════
   PRICING CARDS — vi-pricing (index.php premium redesign)
═══════════════════════════════════════════════════════════ */

.vi-pricing {
    padding: 100px 0 110px;
    background: #fff;
}

.vi-pricing__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
    max-width: 860px;
    margin: 50px auto 0;
}

/* Plan card base */
.vi-plan {
    position: relative;
    background: #fff;
    border-radius: 22px;
    border: 1.5px solid #e8ecf5;
    padding: 36px 32px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    overflow: hidden;
    transition: box-shadow .3s, transform .3s;
}
.vi-plan:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 56px rgba(24,56,98,.12);
}

/* Popular glow */
.vi-plan--popular {
    border-color: #183862;
    background: linear-gradient(160deg, #0e2444 0%, #183862 60%, #1e4d8c 100%);
    color: #fff;
}
.vi-plan__glow {
    position: absolute;
    top: -80px; right: -80px;
    width: 240px; height: 240px;
    background: radial-gradient(circle, rgba(232,160,32,.35) 0%, transparent 70%);
    pointer-events: none;
}

/* Badge */
.vi-plan__badge {
    display: inline-flex; align-items: center; gap: 5px;
    background: #e8a020; color: #fff;
    font-size: .72rem; font-weight: 800;
    letter-spacing: .06em; text-transform: uppercase;
    border-radius: 100px; padding: 4px 14px;
    width: fit-content;
    box-shadow: 0 4px 12px rgba(232,160,32,.4);
}

/* Plan head */
.vi-plan__head { display: flex; flex-direction: column; gap: 8px; }
.vi-plan__name {
    font-size: .8rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: .1em; opacity: .65;
}
.vi-plan--popular .vi-plan__name { opacity: .75; color: #e8c87a; }
.vi-plan__price-row { display: flex; align-items: baseline; gap: 6px; }
.vi-plan__amount {
    font-size: 2.8rem; font-weight: 900; line-height: 1;
    letter-spacing: -.03em; color: #183862;
}
.vi-plan--popular .vi-plan__amount { color: #fff; }
.vi-plan__period { font-size: .85rem; color: #aaa; font-weight: 500; }
.vi-plan--popular .vi-plan__period { color: rgba(255,255,255,.55); }
.vi-plan__sub { font-size: .85rem; color: #888; margin: 0; line-height: 1.5; }
.vi-plan--popular .vi-plan__sub { color: rgba(255,255,255,.6); }

/* Features list */
.vi-plan__feats {
    list-style: none; padding: 0; margin: 0;
    display: flex; flex-direction: column; gap: 11px;
    flex: 1;
}
.vi-plan__feats li {
    display: flex; align-items: flex-start; gap: 10px;
    font-size: .87rem; color: #444; line-height: 1.5;
}
.vi-plan--popular .vi-plan__feats li { color: rgba(255,255,255,.85); }
.vi-plan__feats li i.fa-check-circle { color: #16a34a; flex-shrink: 0; margin-top: 2px; }
.vi-plan--popular .vi-plan__feats li i.fa-check-circle { color: #6ee7b7; }
.vi-plan__feat--muted { color: #bbb !important; }
.vi-plan__feats li i.fa-minus-circle { color: #d0d5dd; flex-shrink: 0; margin-top: 2px; }

/* CTA button */
.vi-plan__btn {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    padding: 14px 24px;
    border-radius: 12px;
    font-size: .9rem; font-weight: 800;
    text-decoration: none; border: none; cursor: pointer;
    transition: filter .2s, transform .15s;
    width: 100%; text-align: center;
}
.vi-plan__btn:hover { filter: brightness(1.08); transform: translateY(-2px); }
.vi-plan__btn--primary {
    background: #e8a020; color: #fff;
    box-shadow: 0 6px 20px rgba(232,160,32,.4);
}
.vi-plan__btn--alt {
    background: #183862; color: #fff;
    box-shadow: 0 4px 14px rgba(24,56,98,.2);
}

/* Responsive */
@media (max-width: 767px) {
    .vi-pricing__grid { grid-template-columns: 1fr; }
    .vi-pricing { padding: 70px 0 80px; }
    .vi-plan { padding: 28px 22px; }
    .vi-plan__amount { font-size: 2.2rem; }
}

/* ── CONTACT BAR ─────────────────────────────────────────────── */
.vi-contact-bar {
    background: #0f1f3d;
    padding: 0;
}
.vi-contact-bar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0;
    padding: 0 12px;
    flex-wrap: wrap;
}
.vi-contact-bar__items {
    display: flex;
    align-items: center;
    flex: 1;
    flex-wrap: wrap;
    gap: 0;
}
.vi-contact-bar__item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 22px 28px;
    transition: background .2s;
}
.vi-contact-bar__item:hover { background: rgba(255,255,255,.04); }
.vi-contact-bar__icon {
    width: 42px; height: 42px;
    border-radius: 50%;
    background: rgba(255,255,255,.08);
    display: flex; align-items: center; justify-content: center;
    color: #e8a020;
    font-size: 1rem;
    flex-shrink: 0;
}
.vi-contact-bar__info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.vi-contact-bar__label {
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: rgba(255,255,255,.45);
}
.vi-contact-bar__value {
    font-size: .9rem;
    font-weight: 500;
    color: #fff;
    line-height: 1.25;
}
.vi-contact-bar__link { color: #e8a020 !important; text-decoration: none; }
.vi-contact-bar__link:hover { color: #f5c060 !important; }
.vi-contact-bar__divider {
    width: 1px; height: 44px;
    background: rgba(255,255,255,.08);
    flex-shrink: 0;
}
.vi-contact-bar__actions {
    display: flex; align-items: center; gap: 10px;
    padding: 16px 0 16px 20px;
    flex-shrink: 0;
}
.vi-contact-bar__btn {
    white-space: nowrap;
    font-size: .82rem !important;
    padding: 12px 22px !important;
}
.vi-contact-bar__wa {
    width: 42px; height: 42px;
    border-radius: 50%;
    background: #25d366;
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.15rem;
    text-decoration: none;
    transition: background .2s, transform .15s;
    flex-shrink: 0;
}
.vi-contact-bar__wa:hover { background: #1ebe5c; transform: scale(1.08); color: #fff; }

/* Responsive contact bar */
@media (max-width: 1199px) {
    .vi-contact-bar__item { padding: 18px 18px; gap: 10px; }
    .vi-contact-bar__divider { height: 36px; }
}
@media (max-width: 991px) {
    .vi-contact-bar__inner { flex-direction: column; align-items: stretch; padding: 0; }
    .vi-contact-bar__items { flex-direction: column; align-items: stretch; gap: 0; }
    .vi-contact-bar__item { padding: 14px 20px; border-bottom: 1px solid rgba(255,255,255,.06); }
    .vi-contact-bar__divider { display: none; }
    .vi-contact-bar__actions { padding: 18px 20px; justify-content: flex-start; border-top: 1px solid rgba(255,255,255,.08); }
}
@media (max-width: 575px) {
    .vi-contact-bar__actions { flex-direction: column; align-items: stretch; }
    .vi-contact-bar__btn { width: 100%; text-align: center; }
    .vi-contact-bar__wa { width: 100%; border-radius: 8px; height: 42px; }
}

/* ═══════════════════════════════════════════════════════════
   VI-HOME — Complete homepage redesign
═══════════════════════════════════════════════════════════ */

.vi-home { --vi-gap: 64px; }
@media (max-width: 991px) { .vi-home { --vi-gap: 48px; } }
@media (max-width: 575px) { .vi-home { --vi-gap: 40px; } }

/* Trust strip */
.vi-home__trust {
    background: #183862;
    padding: 14px 0;
}
.vi-home__trust-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(24px, 5vw, 48px);
    flex-wrap: wrap;
}
.vi-home__trust-inner span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: .9rem;
    font-weight: 500;
    color: rgba(255,255,255,.9);
}
.vi-home__trust-inner i { color: #e8a020; }

/* Section head */
.vi-home__section-head {
    text-align: center;
    margin-bottom: 36px;
}
.vi-home__section-head > span {
    display: block;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--qondri-base);
    margin-bottom: 6px;
}
.vi-home__section-head > h2 {
    font-size: clamp(1.5rem, 3.5vw, 2rem);
    font-weight: 700;
    color: #183862;
    margin: 0;
}
.vi-home__section-head--light > span { color: rgba(255,255,255,.8); }
.vi-home__section-head--light > h2 { color: #fff; }

/* Intro */
.vi-home__intro {
    padding: var(--vi-gap) 0;
}
.vi-home__intro-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
    max-width: 1100px;
    margin: 0 auto;
}
.vi-home__intro-img {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 12px 40px rgba(24,56,98,.15);
}
.vi-home__intro-img img { width: 100%; display: block; }
.vi-home__intro-title {
    font-size: clamp(1.4rem, 2.5vw, 1.75rem);
    font-weight: 700;
    color: #183862;
    margin: 0 0 12px;
}
.vi-home__intro-text {
    font-size: 1rem;
    color: #5a6a7e;
    line-height: 1.6;
    margin: 0 0 20px;
}
.vi-home__intro-list {
    list-style: none;
    padding: 0;
    margin: 0 0 24px;
}
.vi-home__intro-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: .95rem;
    color: #183862;
    margin-bottom: 8px;
}
.vi-home__intro-list i { color: var(--qondri-base); }

/* Services wrapper */
.vi-home__services { padding: var(--vi-gap) 0; }

/* Steps — premium timeline */
.vi-home__steps {
    padding: var(--vi-gap) 0;
    position: relative;
    overflow: hidden;
    background: linear-gradient(165deg, #0f1f3d 0%, #183862 50%, #1e4a7c 100%);
}
.vi-home__steps-bg {
    position: absolute;
    inset: 0;
    background: 
        radial-gradient(ellipse 80% 50% at 50% -20%, rgba(232,160,32,.12) 0%, transparent 50%),
        radial-gradient(circle at 90% 80%, rgba(255,255,255,.04) 0%, transparent 40%);
    pointer-events: none;
}
.vi-home__steps .vi-home__section-head { margin-bottom: 48px; }
.vi-home__steps-timeline {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 0;
    margin-bottom: 40px;
    flex-wrap: wrap;
}
.vi-home__step {
    flex: 1;
    min-width: 140px;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}
.vi-home__step-num {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(232,160,32,.25);
    border: 2px solid #e8a020;
    color: #fff;
    font-weight: 700;
    font-size: .95rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    flex-shrink: 0;
}
.vi-home__step-card {
    text-align: center;
    padding: 28px 20px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 16px;
    transition: all .3s ease;
    width: 100%;
    max-width: 200px;
}
.vi-home__step-card:hover {
    background: rgba(255,255,255,.1);
    border-color: rgba(232,160,32,.4);
    transform: translateY(-6px);
    box-shadow: 0 12px 32px rgba(0,0,0,.2);
}
.vi-home__step-icon {
    width: 52px;
    height: 52px;
    margin: 0 auto 14px;
    border-radius: 14px;
    background: linear-gradient(135deg, #e8a020 0%, #c48518 100%);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    box-shadow: 0 4px 16px rgba(232,160,32,.35);
}
.vi-home__step-card h4 {
    font-size: 1.05rem;
    font-weight: 600;
    color: #fff;
    margin: 0 0 6px;
}
.vi-home__step-card p {
    font-size: .8rem;
    color: rgba(255,255,255,.7);
    margin: 0;
    line-height: 1.4;
}
.vi-home__step-connector {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    color: rgba(232,160,32,.5);
    font-size: .75rem;
    flex-shrink: 0;
    margin-top: 52px;
}
.vi-home__steps-cta {
    text-align: center;
    margin-top: 8px;
}
.vi-home__steps-cta .thm-btn {
    background: #e8a020 !important;
    color: #fff !important;
    border: none !important;
    box-shadow: 0 4px 20px rgba(232,160,32,.4);
}
.vi-home__steps-cta .thm-btn:hover {
    background: #f0b030 !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(232,160,32,.5);
}

/* Why */
.vi-home__why {
    padding: var(--vi-gap) 0;
    background: linear-gradient(160deg, #183862 0%, #0f2847 100%);
}
.vi-home__why-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}
.vi-home__why-item {
    text-align: center;
    padding: 28px 20px;
    background: rgba(255,255,255,.06);
    border-radius: 12px;
    transition: background .2s;
}
.vi-home__why-item:hover { background: rgba(255,255,255,.1); }
.vi-home__why-icon {
    width: 52px;
    height: 52px;
    margin: 0 auto 14px;
    border-radius: 50%;
    background: rgba(232,160,32,.2);
    color: #e8a020;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
}
.vi-home__why-item h4 {
    font-size: 1rem;
    font-weight: 600;
    color: #fff;
    margin: 0 0 6px;
}
.vi-home__why-item p {
    font-size: .85rem;
    color: rgba(255,255,255,.7);
    margin: 0;
}

/* Testimonials */
.vi-home__testimonials {
    padding: var(--vi-gap) 0;
}
#vi-home-testimonial-swiper { overflow: hidden; }
.vi-home__testimonial-card {
    background: #fff;
    padding: 32px 36px;
    border-radius: 14px;
    box-shadow: 0 4px 24px rgba(24,56,98,.08);
    text-align: center;
}
.vi-home__testimonial-card p {
    font-size: 1.05rem;
    color: #183862;
    line-height: 1.7;
    margin: 0 0 16px;
    font-style: italic;
}
.vi-home__testimonial-author {
    font-size: .9rem;
    color: #5a6a7e;
    font-weight: 500;
}
#vi-home-testimonial-pagination { margin-top: 24px; }
#vi-home-testimonial-pagination .swiper-pagination-bullet {
    width: 10px; height: 10px;
    background: rgba(24,56,98,.3);
    opacity: 1;
}
#vi-home-testimonial-pagination .swiper-pagination-bullet-active {
    background: var(--qondri-base);
}

/* Pricing wrapper */
.vi-home__pricing { padding: var(--vi-gap) 0; }

/* Responsive vi-home */
@media (max-width: 1199px) {
    .vi-home__steps-timeline {
        justify-content: center;
        gap: 20px;
    }
    .vi-home__step {
        flex: 0 0 calc(20% - 16px);
        min-width: 150px;
    }
    .vi-home__step-connector { padding: 0 4px; font-size: .65rem; margin-top: 48px; }
}
@media (max-width: 991px) {
    .vi-home__intro-inner { grid-template-columns: 1fr; }
    .vi-home__intro-img { order: -1; max-width: 480px; margin: 0 auto; }
    .vi-home__steps-timeline { gap: 24px; }
    .vi-home__step {
        flex: 0 0 calc(33.333% - 20px);
        min-width: 140px;
    }
    .vi-home__step-connector { display: none; }
    .vi-home__why-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
    .vi-home__step { flex: 0 0 calc(50% - 12px); min-width: 130px; }
    .vi-home__trust-inner { gap: 16px; }
    .vi-home__trust-inner span { font-size: .8rem; }
    .vi-home__step-card { max-width: 100%; padding: 22px 16px; }
}
@media (max-width: 575px) {
    .vi-home__steps-timeline { flex-direction: column; align-items: center; gap: 20px; }
    .vi-home__step { flex: none; width: 100%; max-width: 280px; min-width: 0; }
    .vi-home__step-connector {
        display: flex;
        transform: rotate(90deg);
        margin: -8px 0;
        color: rgba(232,160,32,.4);
    }
    .vi-home__why-grid { grid-template-columns: 1fr; }
    .vi-home__testimonial-card { padding: 24px 20px; }
}
