/**
 * Premium Glass Directory ? Phase 2A shared chrome
 *
 * Scoped overrides for site shell, topbar, primary nav, and footer only.
 * Does not restyle page-body cards, forms, tables, Select2, DataTables, etc.
 * Brand accent continues to use --colorPrimary from settings.
 */

/* -------------------------------------------------------------------------- */
/* Site shell (light, calm marketplace canvas)                                 */
/* -------------------------------------------------------------------------- */

.ui-site-shell {
    /* Light marketplace tokens (do not apply to admin; admin uses .ui-admin-shell) */
    --ui-color-primary: var(--colorPrimary, #6366F1);
    --ui-color-text: #0f172a;
    --ui-color-muted: #6b7280;
    --ui-color-surface: #ffffff;
    --ui-color-border: rgba(15, 23, 42, 0.08);
    --ui-radius-sm: 10px;
    --ui-radius-md: 16px;
    --ui-shadow-soft: 0 14px 34px rgba(15, 23, 42, 0.06);
    --ui-content-max-width: 1320px;
    --ui-chrome-nav-offset: 96px;

    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background-color: #f5f7fb;
    background-image:
        radial-gradient(ellipse 70% 40% at 10% -5%, color-mix(in srgb, var(--ui-color-primary, #6366F1) 12%, transparent), transparent 60%),
        radial-gradient(ellipse 50% 35% at 95% 0%, rgba(34, 211, 238, 0.08), transparent 55%),
        linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
    color: var(--ui-color-text);
}

.ui-main-content {
    position: relative;
    z-index: 1;
    flex: 1 0 auto;
    width: 100%;
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell {
        background-image:
            radial-gradient(ellipse 70% 40% at 10% -5%, rgba(99, 102, 241, 0.1), transparent 60%),
            radial-gradient(ellipse 50% 35% at 95% 0%, rgba(34, 211, 238, 0.08), transparent 55%),
            linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
    }
}

/* -------------------------------------------------------------------------- */
/* Topbar — ink utility rail                                                   */
/* -------------------------------------------------------------------------- */

.ui-site-shell #wsus__topbar.ui-chrome-topbar {
    --ui-topbar-ink: #0c1524;
    --ui-topbar-ink-soft: #132033;
    --ui-topbar-mist: rgba(226, 232, 240, 0.72);
    --ui-topbar-line: rgba(255, 255, 255, 0.1);
    position: relative;
    height: auto;
    min-height: 44px;
    padding: 0.45rem 0;
    overflow: hidden;
    z-index: 1000;
    background:
        linear-gradient(105deg, var(--ui-topbar-ink) 0%, var(--ui-topbar-ink-soft) 52%, #101a2c 100%);
    border-bottom: 1px solid rgba(15, 23, 42, 0.35);
    color: var(--ui-topbar-mist);
}

.ui-site-shell #wsus__topbar.ui-chrome-topbar::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 45% 120% at 8% 50%, color-mix(in srgb, var(--colorPrimary, #6366F1) 22%, transparent), transparent 70%),
        radial-gradient(ellipse 35% 100% at 92% 40%, rgba(56, 189, 248, 0.1), transparent 65%);
    opacity: 0.9;
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell #wsus__topbar.ui-chrome-topbar::before {
        background:
            radial-gradient(ellipse 45% 120% at 8% 50%, rgba(246, 101, 66, 0.18), transparent 70%),
            radial-gradient(ellipse 35% 100% at 92% 40%, rgba(56, 189, 248, 0.1), transparent 65%);
    }
}

.ui-site-shell .ui-chrome-topbar__accent {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        color-mix(in srgb, var(--colorPrimary, #6366F1) 85%, #fff) 18%,
        rgba(56, 189, 248, 0.85) 55%,
        transparent 100%
    );
    background-size: 200% 100%;
    animation: ui-topbar-sheen 8s ease-in-out infinite;
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-chrome-topbar__accent {
        background: linear-gradient(90deg, transparent 0%, var(--colorPrimary, #6366F1) 18%, #38bdf8 55%, transparent 100%);
        background-size: 200% 100%;
    }
}

@keyframes ui-topbar-sheen {
    0%,
    100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

.ui-site-shell .ui-chrome-topbar .container {
    position: relative;
    z-index: 1;
}

.ui-site-shell .ui-chrome-topbar__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1.25rem;
    min-height: 2rem;
}

.ui-site-shell .ui-chrome-topbar__meta {
    display: flex;
    align-items: center;
    gap: 0.85rem 1.1rem;
    min-width: 0;
    flex: 1 1 auto;
}

.ui-site-shell .ui-chrome-topbar__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    flex-shrink: 0;
    padding: 0.2rem 0.55rem 0.2rem 0.4rem;
    border-radius: 8px;
    border: 1px solid var(--ui-topbar-line);
    background: rgba(255, 255, 255, 0.04);
    color: rgba(248, 250, 252, 0.88);
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.2;
}

.ui-site-shell .ui-chrome-topbar__pulse {
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50%;
    background: #34d399;
    box-shadow: 0 0 0 0 rgba(52, 211, 153, 0.45);
    animation: ui-topbar-pulse 2.4s ease-out infinite;
}

@keyframes ui-topbar-pulse {
    0% { box-shadow: 0 0 0 0 rgba(52, 211, 153, 0.45); }
    70% { box-shadow: 0 0 0 6px rgba(52, 211, 153, 0); }
    100% { box-shadow: 0 0 0 0 rgba(52, 211, 153, 0); }
}

.ui-site-shell .ui-chrome-topbar .wsus__topbar_left {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.35rem 0.15rem;
    margin: 0;
    padding: 0;
    list-style: none;
    line-height: 1.3;
    min-width: 0;
}

.ui-site-shell .ui-chrome-topbar .wsus__topbar_left li {
    margin: 0;
    display: flex;
    align-items: center;
}

.ui-site-shell .ui-chrome-topbar .wsus__topbar_left li:not(:last-child)::after {
    content: "";
    width: 1px;
    height: 0.9rem;
    margin: 0 0.35rem 0 0.45rem;
    background: var(--ui-topbar-line);
}

.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    max-width: 100%;
    padding: 0.28rem 0.45rem;
    border-radius: 8px;
    color: var(--ui-topbar-mist) !important;
    font-size: 0.8125rem;
    font-weight: 500;
    letter-spacing: 0.01em;
    text-decoration: none;
    transition: color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}

.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.55rem;
    height: 1.55rem;
    flex-shrink: 0;
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid var(--ui-topbar-line);
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 70%, #fff);
    font-size: 0.72rem;
    transition: transform 0.22s ease, background-color 0.22s ease, border-color 0.22s ease;
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__icon {
        color: #fda4a0;
    }
}

.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__link:hover,
.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__link:focus-visible {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.06);
}

.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__link:hover .ui-chrome-topbar__icon,
.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__link:focus-visible .ui-chrome-topbar__icon {
    transform: translateY(-1px);
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.22);
}

.ui-site-shell .ui-chrome-topbar .wsus__topbar_right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-shrink: 0;
    margin: 0;
}

.ui-site-shell .ui-chrome-topbar .wsus__topbar_right a,
.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__account {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    width: auto;
    min-width: 0;
    height: auto;
    margin: 0;
    padding: 0.38rem 0.8rem 0.38rem 0.4rem;
    line-height: 1.2;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.96);
    color: #0f172a !important;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    text-decoration: none;
    box-shadow: 0 6px 16px rgba(2, 8, 23, 0.22);
    transition: transform 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__account-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.55rem;
    height: 1.55rem;
    border-radius: 7px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 16%, #fff);
    color: var(--colorPrimary, #6366F1);
    font-size: 0.7rem;
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__account-icon {
        background: rgba(246, 101, 66, 0.14);
    }
}

.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__account-arrow {
    font-size: 0.68rem;
    opacity: 0.55;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.ui-site-shell .ui-chrome-topbar .wsus__topbar_right a:hover,
.ui-site-shell .ui-chrome-topbar .wsus__topbar_right a:focus-visible,
.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__account:hover,
.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__account:focus-visible {
    background: #fff;
    color: #020617 !important;
    border-color: rgba(255, 255, 255, 0.35);
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(2, 8, 23, 0.28);
}

.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__account:hover .ui-chrome-topbar__account-arrow,
.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__account:focus-visible .ui-chrome-topbar__account-arrow {
    transform: translateX(2px);
    opacity: 1;
}

.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__link:focus-visible,
.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__account:focus-visible,
.ui-site-shell .ui-chrome-topbar .wsus__topbar_right a:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.85);
    outline-offset: 2px;
}

@media (max-width: 767.98px) {
    .ui-site-shell #wsus__topbar.ui-chrome-topbar {
        padding: 0.4rem 0;
    }

    .ui-site-shell .ui-chrome-topbar__row {
        gap: 0.55rem;
    }

    .ui-site-shell .ui-chrome-topbar__eyebrow {
        display: none;
    }

    .ui-site-shell .ui-chrome-topbar .wsus__topbar_left {
        gap: 0.2rem;
    }

    .ui-site-shell .ui-chrome-topbar .wsus__topbar_left li:not(:last-child)::after {
        margin: 0 0.2rem 0 0.3rem;
    }

    .ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__label {
        display: none;
    }

    .ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__link {
        padding: 0.2rem;
    }

    .ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__account {
        padding: 0.32rem 0.65rem 0.32rem 0.35rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell .ui-chrome-topbar__accent,
    .ui-site-shell .ui-chrome-topbar__pulse,
    .ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__link,
    .ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__icon,
    .ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__account,
    .ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__account-arrow {
        animation: none !important;
        transition: none !important;
    }
}

/* -------------------------------------------------------------------------- */
/* Primary navigation (glass sticky bar)                                       */
/* -------------------------------------------------------------------------- */

.ui-site-shell .main_menu.ui-chrome-nav {
    height: auto;
    min-height: 72px;
    padding: 0.35rem 0;
    background-color: rgba(255, 255, 255, 0.86);
    border-bottom: 1px solid rgba(15, 23, 42, 0.08) !important;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
    z-index: 999;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell .main_menu.ui-chrome-nav {
        background-color: rgba(255, 255, 255, 0.72);
        -webkit-backdrop-filter: blur(16px) saturate(1.2);
        backdrop-filter: blur(16px) saturate(1.2);
    }
}

.ui-site-shell .main_menu.ui-chrome-nav.menu_fix {
    box-shadow: 0 12px 36px rgba(15, 23, 42, 0.12);
    border-bottom-color: rgba(15, 23, 42, 0.1) !important;
}

.ui-site-shell .main_menu .navbar-brand {
    max-width: 220px;
    padding: 0.35rem 0;
}

.ui-site-shell .main_menu .navbar-brand img {
    width: auto !important;
    height: 44px !important;
    max-height: 44px;
    object-fit: contain !important;
}

@media (max-width: 991px) {
    .ui-site-shell .main_menu .navbar-brand {
        max-width: 168px;
    }

    .ui-site-shell .main_menu .navbar-brand img {
        height: 36px !important;
        max-height: 36px;
    }
}

@media (max-width: 575px) {
    .ui-site-shell .main_menu .navbar-brand {
        max-width: 148px;
    }

    .ui-site-shell .main_menu .navbar-brand img {
        height: 32px !important;
        max-height: 32px;
    }
}

.ui-site-shell .main_menu .navbar-toggler {
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 10px;
    padding: 0.45rem 0.7rem;
    color: #0f172a;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: none;
}

.ui-site-shell .main_menu .navbar-toggler:focus,
.ui-site-shell .main_menu .navbar-toggler:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 55%, transparent);
    outline-offset: 2px;
    box-shadow: none;
}

.ui-site-shell .main_menu .nav-link {
    position: relative;
    font-size: 0.95rem;
    font-weight: 600;
    color: #334155 !important;
    line-height: 1.2;
    margin: 0 0.35rem;
    padding: 0.65rem 0.45rem !important;
    border-radius: 8px;
}

.ui-site-shell .main_menu .nav-link:hover,
.ui-site-shell .main_menu .nav-item:hover > .nav-link {
    color: var(--colorPrimary, #6366F1) !important;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 8%, transparent);
}

.ui-site-shell .main_menu .nav-link.active,
.ui-site-shell .main_menu .nav-link[aria-current="page"] {
    color: var(--colorPrimary, #6366F1) !important;
}

.ui-site-shell .main_menu .nav-link.active::after,
.ui-site-shell .main_menu .nav-link[aria-current="page"]::after {
    content: "";
    position: absolute;
    left: 0.45rem;
    right: 0.45rem;
    bottom: 0.2rem;
    height: 2px;
    border-radius: 999px;
    background: var(--colorPrimary, #6366F1);
}

.ui-site-shell .main_menu .nav-link:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 55%, transparent);
    outline-offset: 2px;
    color: var(--colorPrimary, #6366F1) !important;
}

.ui-site-shell .main_menu .menu_droapdown {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12);
    overflow: hidden;
    background: #fff;
}

.ui-site-shell .main_menu .menu_droapdown a {
    line-height: 1.3;
    margin: 0;
    padding: 0.7rem 1rem;
    color: #334155 !important;
    font-size: 0.9rem;
}

.ui-site-shell .main_menu .menu_droapdown a:hover,
.ui-site-shell .main_menu .menu_droapdown a:focus-visible {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 10%, #fff);
    color: var(--colorPrimary, #6366F1) !important;
}

.ui-site-shell .main_menu .user_btn {
    border-radius: 999px;
    padding: 0.7rem 1.15rem;
    font-weight: 600;
    font-size: 0.9rem;
    border: 1px solid transparent;
    background: var(--colorPrimary, #6366F1);
    color: #fff !important;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent);
    line-height: 1.2;
    height: auto;
}

.ui-site-shell .main_menu .user_btn:hover,
.ui-site-shell .main_menu .user_btn:focus-visible {
    filter: brightness(1.05);
    color: #fff !important;
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .main_menu .nav-link:hover,
    .ui-site-shell .main_menu .nav-item:hover > .nav-link,
    .ui-site-shell .main_menu .menu_droapdown a:hover {
        background: rgba(99, 102, 241, 0.08);
    }

    .ui-site-shell .main_menu .user_btn {
        box-shadow: 0 10px 24px rgba(15, 23, 42, 0.15);
    }
}

/* Mobile collapse panel */
@media (max-width: 991.98px) {
    .ui-site-shell .main_menu.ui-chrome-nav {
        min-height: 64px;
    }

    .ui-site-shell .main_menu #navbarSupportedContent {
        margin-top: 0.75rem;
        padding: 0.75rem;
        border-radius: 16px;
        border: 1px solid rgba(15, 23, 42, 0.08);
        background: rgba(255, 255, 255, 0.96);
        box-shadow: 0 16px 40px rgba(15, 23, 42, 0.1);
    }

    .ui-site-shell .main_menu .nav-link {
        margin: 0.15rem 0;
        padding: 0.75rem 0.85rem !important;
        line-height: 1.3;
    }

    .ui-site-shell .main_menu .nav-link.active::after,
    .ui-site-shell .main_menu .nav-link[aria-current="page"]::after {
        display: none;
    }

    .ui-site-shell .main_menu .nav-link.active,
    .ui-site-shell .main_menu .nav-link[aria-current="page"] {
        background: color-mix(in srgb, var(--colorPrimary, #6366F1) 10%, transparent);
    }

    .ui-site-shell .main_menu .user_btn {
        width: 100%;
        margin-top: 0.5rem;
        text-align: center;
        justify-content: center;
    }
}

/* -------------------------------------------------------------------------- */
/* Footer                                                                      */
/* -------------------------------------------------------------------------- */

.ui-site-shell footer.ui-chrome-footer {
    position: relative;
    z-index: 1;
    margin-top: auto;
    padding-top: 0;
    overflow: hidden;
    background: #0b1220 !important;
    background-image: none !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__atmosphere {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 55% 45% at 8% 0%, color-mix(in srgb, var(--colorPrimary, #6366F1) 22%, transparent), transparent 65%),
        radial-gradient(ellipse 40% 35% at 95% 30%, rgba(56, 189, 248, 0.12), transparent 60%),
        linear-gradient(165deg, #0f172a 0%, #0b1220 55%, #080f1c 100%);
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__inner {
    position: relative;
    z-index: 1;
    padding-top: 3.5rem;
    padding-bottom: 0.5rem;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__grid {
    position: relative;
    z-index: 1;
}

.ui-site-shell footer.ui-chrome-footer .footer_text {
    margin-bottom: 0.5rem;
}

.ui-site-shell footer.ui-chrome-footer h3 {
    position: relative;
    margin-bottom: 1.15rem;
    padding-bottom: 0.65rem;
    color: #fff;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.ui-site-shell footer.ui-chrome-footer h3::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 2rem;
    height: 2px;
    border-radius: 999px;
    background: var(--colorPrimary, #6366F1);
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__logo {
    display: inline-flex;
    align-items: center;
    margin-bottom: 1rem;
    max-width: 220px;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__logo img {
    width: auto;
    max-width: 100%;
    height: 46px;
    object-fit: contain;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__about,
.ui-site-shell footer.ui-chrome-footer .footer_text p {
    margin: 0 0 1.15rem;
    color: rgba(248, 250, 252, 0.76);
    font-size: 0.95rem;
    line-height: 1.65;
    opacity: 1;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__about p {
    margin: 0;
}

.ui-site-shell footer.ui-chrome-footer .footer_icon.ui-chrome-footer__social {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ui-site-shell footer.ui-chrome-footer .footer_icon li {
    float: none;
    margin: 0;
}

.ui-site-shell footer.ui-chrome-footer .footer_icon li a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    line-height: 1;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
    opacity: 1;
    transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell footer.ui-chrome-footer .footer_icon li a {
        -webkit-backdrop-filter: blur(8px);
        backdrop-filter: blur(8px);
    }
}

.ui-site-shell footer.ui-chrome-footer .footer_icon li a:hover,
.ui-site-shell footer.ui-chrome-footer .footer_icon li a:focus-visible {
    transform: translateY(-2px);
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 90%, #fff);
    border-color: transparent;
    color: #fff;
    outline: 2px solid rgba(255, 255, 255, 0.4);
    outline-offset: 2px;
}

.ui-site-shell footer.ui-chrome-footer .footer_link {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ui-site-shell footer.ui-chrome-footer .footer_link li {
    margin-bottom: 0.55rem;
}

.ui-site-shell footer.ui-chrome-footer .footer_link li a {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-left: 0;
    width: auto;
    max-width: 100%;
    color: rgba(248, 250, 252, 0.78);
    font-size: 0.92rem;
    opacity: 1;
    border-radius: 8px;
    transition: color 160ms ease, transform 160ms ease;
}

.ui-site-shell footer.ui-chrome-footer .footer_link li a i {
    font-size: 0.65rem;
    opacity: 0.55;
    margin-left: 0;
    transition: opacity 160ms ease, transform 160ms ease;
}

.ui-site-shell footer.ui-chrome-footer .footer_link li a:hover,
.ui-site-shell footer.ui-chrome-footer .footer_link li a:focus-visible {
    color: #fff;
    transform: translateX(3px);
    outline: none;
}

.ui-site-shell footer.ui-chrome-footer .footer_link li a:hover i,
.ui-site-shell footer.ui-chrome-footer .footer_link li a:focus-visible i {
    opacity: 1;
    color: var(--colorPrimary, #6366F1);
}

.ui-site-shell footer.ui-chrome-footer .footer_link li a:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.4);
    outline-offset: 2px;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__muted {
    color: rgba(248, 250, 252, 0.45);
    font-size: 0.88rem;
}

.ui-site-shell footer.ui-chrome-footer .footer_contact.ui-chrome-footer__contact {
    padding: 1.1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.05);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell footer.ui-chrome-footer .footer_contact.ui-chrome-footer__contact {
        -webkit-backdrop-filter: blur(12px) saturate(1.15);
        backdrop-filter: blur(12px) saturate(1.15);
    }
}

.ui-site-shell footer.ui-chrome-footer .footer_contact ul li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding-bottom: 0.7rem;
    margin-bottom: 0.7rem;
}

.ui-site-shell footer.ui-chrome-footer .footer_contact ul li:last-child {
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 0;
}

.ui-site-shell footer.ui-chrome-footer .footer_contact ul li p,
.ui-site-shell footer.ui-chrome-footer .footer_contact ul li a {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    margin: 0;
    color: rgba(248, 250, 252, 0.82);
    font-size: 0.9rem;
    line-height: 1.45;
}

.ui-site-shell footer.ui-chrome-footer .footer_contact ul li i {
    margin-top: 0.15rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 80%, #fff);
    opacity: 1;
}

.ui-site-shell footer.ui-chrome-footer .footer_contact ul li a:hover,
.ui-site-shell footer.ui-chrome-footer .footer_contact ul li a:focus-visible {
    color: #fff;
    transform: none;
}

.ui-site-shell footer.ui-chrome-footer .footer_bottom.ui-chrome-footer__bottom {
    position: relative;
    z-index: 1;
    margin-top: 2.5rem;
    padding: 1.15rem 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(0, 0, 0, 0.18);
}

.ui-site-shell footer.ui-chrome-footer .footer_bottom p {
    margin: 0;
    color: rgba(248, 250, 252, 0.68);
    font-size: 0.88rem;
    opacity: 1;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__bottom-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.35rem 1rem;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__bottom-links a {
    color: rgba(248, 250, 252, 0.72);
    font-size: 0.86rem;
    font-weight: 600;
    text-decoration: none;
    transition: color 160ms ease;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__bottom-links a:hover,
.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__bottom-links a:focus-visible {
    color: #fff;
    outline: none;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter {
    position: relative;
    z-index: 1;
    margin-top: 2.25rem;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-panel {
    padding: 1.5rem 1.4rem;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background:
        radial-gradient(ellipse 55% 80% at 100% 0%, color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent), transparent 60%),
        rgba(255, 255, 255, 0.05);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-panel {
        -webkit-backdrop-filter: blur(12px) saturate(1.15);
        backdrop-filter: blur(12px) saturate(1.15);
    }
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-eyebrow {
    margin: 0 0 0.4rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 70%, #fff);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-panel h3 {
    margin: 0 0 0.45rem;
    color: #fff;
    font-size: 1.25rem;
    font-weight: 750;
    line-height: 1.25;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-panel h3::after {
    display: none;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-copy {
    margin: 0;
    color: rgba(248, 250, 252, 0.72);
    font-size: 0.92rem;
    line-height: 1.5;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-controls input[type="email"] {
    flex: 1 1 14rem;
    min-height: 2.85rem;
    padding: 0.7rem 1rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(15, 23, 42, 0.45);
    color: #f8fafc;
    font-size: 0.95rem;
    outline: none;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-controls input[type="email"]::placeholder {
    color: rgba(248, 250, 252, 0.45);
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-controls input[type="email"]:focus {
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 70%, #fff);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent);
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 2.85rem;
    padding: 0.7rem 1.25rem;
    border: 0;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 94%, #fff);
    color: #fff;
    font-size: 0.94rem;
    font-weight: 700;
    cursor: pointer;
    transition: transform 160ms ease, filter 160ms ease;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-submit i {
    font-size: 0.72rem;
    transition: transform 160ms ease;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-submit:hover,
.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-submit:focus-visible {
    filter: brightness(1.05);
    outline: none;
    transform: translateY(-1px);
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-submit:hover i,
.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-submit:focus-visible i {
    transform: translateX(3px);
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-submit:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent);
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-help,
.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-error {
    margin: 0.55rem 0 0;
    font-size: 0.82rem;
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-help {
    color: rgba(248, 250, 252, 0.5);
}

.ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-error {
    color: #fda4af;
}

@media (max-width: 991.98px) {
    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-panel {
        text-align: center;
    }

    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-controls {
        justify-content: center;
    }
}

@media (max-width: 767.98px) {
    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__inner {
        padding-top: 2.75rem;
    }

    .ui-site-shell footer.ui-chrome-footer .footer_text {
        margin-bottom: 0.75rem;
    }

    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__bottom-links {
        justify-content: flex-start;
    }

    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter {
        margin-top: 1.75rem;
    }

    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-controls input[type="email"],
    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-submit {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-submit,
    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-submit i {
        transition: none !important;
    }

    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-submit:hover,
    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-submit:focus-visible {
        transform: none;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__atmosphere {
        background: linear-gradient(165deg, #0f172a 0%, #0b1220 55%, #080f1c 100%);
    }

    .ui-site-shell footer.ui-chrome-footer .footer_icon li a:hover,
    .ui-site-shell footer.ui-chrome-footer .footer_icon li a:focus-visible {
        background: #f66542;
    }

    .ui-site-shell footer.ui-chrome-footer .footer_contact ul li i,
    .ui-site-shell footer.ui-chrome-footer .footer_link li a:hover i {
        color: #f66542;
    }

    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-eyebrow {
        color: #fda4af;
    }

    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-submit {
        background: #f66542;
    }

    .ui-site-shell footer.ui-chrome-footer .ui-chrome-footer__newsletter-controls input[type="email"]:focus {
        border-color: #f66542;
        box-shadow: 0 0 0 3px rgba(246, 101, 66, 0.28);
    }
}

/* -------------------------------------------------------------------------- */
/* Scroll button                                                               */
/* -------------------------------------------------------------------------- */

.ui-site-shell .scroll_btn {
    border-radius: 14px;
    background: var(--colorPrimary, #6366F1);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.2);
}

.ui-site-shell .scroll_btn:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 3px;
}

/* -------------------------------------------------------------------------- */
/* Motion preferences                                                          */
/* -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell .main_menu,
    .ui-site-shell .main_menu .nav-link,
    .ui-site-shell .main_menu .user_btn,
    .ui-site-shell .ui-chrome-topbar a,
    .ui-site-shell footer.ui-chrome-footer a {
        transition: none !important;
        animation: none !important;
    }

    .ui-site-shell .main_menu.menu_fix {
        animation: none !important;
    }

    .ui-site-shell .ui-listing-card,
    .ui-site-shell .ui-home-search-panel,
    .ui-site-shell .wsus__category_single,
    .ui-site-shell .wsus__category_single_slider,
    .ui-site-shell .wsus__feature_single,
    .ui-site-shell .listing_grid_sidbar .read_btn,
    .ui-site-shell .listing_details_sidebar .read_btn {
        transition: none !important;
    }
}

/* ========================================================================== */
/* Phase 2B ? public page bodies (homepage + listings discovery/detail)         */
/* Scoped under .ui-site-shell only. Admin/auth dashboards untouched.           */
/* ========================================================================== */

/* Page hero / breadcrumb */
.ui-site-shell #breadcrumb_part.ui-page-hero {
    position: relative;
    overflow: hidden;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--photo .bread_overlay {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.55), rgba(15, 23, 42, 0.72));
}

.ui-site-shell #breadcrumb_part.ui-page-hero .bread_overlay {
    position: relative;
    z-index: 2;
}

.ui-site-shell #breadcrumb_part.ui-page-hero h1,
.ui-site-shell #breadcrumb_part.ui-page-hero .ui-page-hero__title {
    margin: 0;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.ui-site-shell #breadcrumb_part.ui-page-hero .breadcrumb-item a:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}

/* -------------------------------------------------------------------------- */
/* Shared motion header (inner pages; not home hero / listing photo)           */
/* Brand-led animated stage using --colorPrimary (site logo / theme color).    */
/* -------------------------------------------------------------------------- */

.ui-site-shell #breadcrumb_part.ui-page-hero--motion {
    background-image: none !important;
    background-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 14%, var(--ui-color-surface, #ffffff));
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .bread_overlay {
    background:
        linear-gradient(
            180deg,
            color-mix(in srgb, var(--colorPrimary, #6366F1) 10%, rgba(255, 255, 255, 0.55)) 0%,
            color-mix(in srgb, var(--colorPrimary, #6366F1) 6%, rgba(255, 255, 255, 0.35)) 100%
        );
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion h1,
.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__title,
.ui-site-shell #breadcrumb_part.ui-page-hero--motion .breadcrumb-item,
.ui-site-shell #breadcrumb_part.ui-page-hero--motion .breadcrumb-item.active,
.ui-site-shell #breadcrumb_part.ui-page-hero--motion .breadcrumb-item a {
    color: var(--ui-color-text, #0f172a) !important;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .breadcrumb-item + .breadcrumb-item::before {
    color: color-mix(in srgb, var(--ui-color-text, #0f172a) 55%, var(--colorPrimary, #6366F1)) !important;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .breadcrumb-item a:hover,
.ui-site-shell #breadcrumb_part.ui-page-hero--motion .breadcrumb-item a:focus-visible {
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 75%, #000) !important;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__stage {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
    background:
        radial-gradient(
            ellipse 80% 90% at 0% 0%,
            color-mix(in srgb, var(--colorPrimary, #6366F1) 42%, #fff),
            transparent 62%
        ),
        radial-gradient(
            ellipse 70% 80% at 100% 100%,
            color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, #fff),
            transparent 58%
        ),
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--colorPrimary, #6366F1) 18%, #fff) 0%,
            #fff 42%,
            color-mix(in srgb, var(--colorPrimary, #6366F1) 12%, #fff8f5) 100%
        );
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__mesh {
    position: absolute;
    inset: -30%;
    background:
        radial-gradient(
            circle at 20% 30%,
            color-mix(in srgb, var(--colorPrimary, #6366F1) 55%, transparent),
            transparent 42%
        ),
        radial-gradient(
            circle at 75% 20%,
            color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, #fb923c),
            transparent 38%
        ),
        radial-gradient(
            circle at 60% 80%,
            color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent),
            transparent 45%
        );
    opacity: 0.7;
    filter: blur(8px);
    animation: ui-page-hero-mesh 10s ease-in-out infinite alternate;
    will-change: transform;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(0.5px);
    will-change: transform, opacity;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__blob--a {
    width: min(48vw, 22rem);
    height: min(48vw, 22rem);
    top: -18%;
    left: -6%;
    background: radial-gradient(
        circle,
        color-mix(in srgb, var(--colorPrimary, #6366F1) 75%, #fff) 0%,
        color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent) 55%,
        transparent 72%
    );
    opacity: 0.9;
    animation: ui-page-hero-float-a 7s ease-in-out infinite;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__blob--b {
    width: min(40vw, 18rem);
    height: min(40vw, 18rem);
    right: -4%;
    bottom: -22%;
    background: radial-gradient(
        circle,
        color-mix(in srgb, var(--colorPrimary, #6366F1) 65%, #fdba74) 0%,
        color-mix(in srgb, var(--colorPrimary, #6366F1) 25%, transparent) 58%,
        transparent 74%
    );
    opacity: 0.85;
    animation: ui-page-hero-float-b 8.5s ease-in-out infinite;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__blob--c {
    width: min(28vw, 12rem);
    height: min(28vw, 12rem);
    top: 28%;
    left: 48%;
    background: radial-gradient(
        circle,
        color-mix(in srgb, var(--colorPrimary, #6366F1) 80%, #fff) 0%,
        transparent 70%
    );
    opacity: 0.55;
    animation: ui-page-hero-float-c 6s ease-in-out infinite;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__ring {
    position: absolute;
    border-radius: 50%;
    border: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 55%, transparent);
    box-shadow:
        0 0 0 8px color-mix(in srgb, var(--colorPrimary, #6366F1) 10%, transparent),
        inset 0 0 24px color-mix(in srgb, var(--colorPrimary, #6366F1) 18%, transparent);
    will-change: transform, opacity;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__ring--a {
    width: min(34vw, 15rem);
    height: min(34vw, 15rem);
    top: 8%;
    right: 12%;
    animation: ui-page-hero-ring 9s linear infinite;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__ring--b {
    width: min(22vw, 9rem);
    height: min(22vw, 9rem);
    bottom: 12%;
    left: 18%;
    border-width: 1.5px;
    animation: ui-page-hero-ring 7s linear infinite reverse;
    animation-delay: -2s;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__sheen {
    position: absolute;
    inset: -40% -60%;
    background: linear-gradient(
        105deg,
        transparent 35%,
        color-mix(in srgb, var(--colorPrimary, #6366F1) 22%, #fff) 48%,
        rgba(255, 255, 255, 0.65) 50%,
        color-mix(in srgb, var(--colorPrimary, #6366F1) 18%, #fff) 52%,
        transparent 65%
    );
    mix-blend-mode: soft-light;
    opacity: 0.85;
    animation: ui-page-hero-sheen 5.5s ease-in-out infinite;
    will-change: transform;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__spark {
    position: absolute;
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    background: var(--colorPrimary, #6366F1);
    box-shadow: 0 0 12px color-mix(in srgb, var(--colorPrimary, #6366F1) 70%, transparent);
    animation: ui-page-hero-spark 3.2s ease-in-out infinite;
    will-change: transform, opacity;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__spark--1 {
    top: 22%;
    left: 14%;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__spark--2 {
    top: 36%;
    right: 22%;
    width: 0.4rem;
    height: 0.4rem;
    animation-delay: -0.8s;
    animation-duration: 3.8s;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__spark--3 {
    bottom: 28%;
    left: 38%;
    width: 0.7rem;
    height: 0.7rem;
    animation-delay: -1.4s;
    animation-duration: 4.2s;
}

.ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__spark--4 {
    top: 18%;
    left: 62%;
    width: 0.35rem;
    height: 0.35rem;
    animation-delay: -2.1s;
    animation-duration: 2.9s;
}

@keyframes ui-page-hero-mesh {
    0% {
        transform: translate3d(-3%, -2%, 0) scale(1) rotate(0deg);
    }
    100% {
        transform: translate3d(4%, 3%, 0) scale(1.12) rotate(6deg);
    }
}

@keyframes ui-page-hero-float-a {
    0%,
    100% {
        transform: translate3d(0, 0, 0) scale(1);
    }
    33% {
        transform: translate3d(12%, 10%, 0) scale(1.12);
    }
    66% {
        transform: translate3d(4%, 18%, 0) scale(0.92);
    }
}

@keyframes ui-page-hero-float-b {
    0%,
    100% {
        transform: translate3d(0, 0, 0) scale(1);
    }
    40% {
        transform: translate3d(-14%, -12%, 0) scale(1.15);
    }
    70% {
        transform: translate3d(-6%, -20%, 0) scale(0.9);
    }
}

@keyframes ui-page-hero-float-c {
    0%,
    100% {
        transform: translate3d(0, 0, 0) scale(1);
        opacity: 0.45;
    }
    50% {
        transform: translate3d(-10%, 8%, 0) scale(1.25);
        opacity: 0.8;
    }
}

@keyframes ui-page-hero-ring {
    0% {
        transform: scale(0.88) rotate(0deg);
        opacity: 0.35;
    }
    50% {
        transform: scale(1.08) rotate(180deg);
        opacity: 0.85;
    }
    100% {
        transform: scale(0.88) rotate(360deg);
        opacity: 0.35;
    }
}

@keyframes ui-page-hero-sheen {
    0% {
        transform: translate3d(-35%, 0, 0) skewX(-12deg);
    }
    100% {
        transform: translate3d(35%, 0, 0) skewX(-12deg);
    }
}

@keyframes ui-page-hero-spark {
    0%,
    100% {
        transform: translate3d(0, 0, 0) scale(0.7);
        opacity: 0.35;
    }
    50% {
        transform: translate3d(0, -14px, 0) scale(1.35);
        opacity: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__mesh,
    .ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__blob,
    .ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__ring,
    .ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__sheen,
    .ui-site-shell #breadcrumb_part.ui-page-hero--motion .ui-page-hero__spark {
        animation: none !important;
    }
}

/* -------------------------------------------------------------------------- */
/* AJAX listing modal (presentation only; JS hooks unchanged)                  */
/* -------------------------------------------------------------------------- */

.ui-site-shell #wsus__map_popup .ui-listing-modal__card.map_popup_content {
    border: 1px solid var(--ui-color-border, rgba(15, 23, 42, 0.08));
    border-radius: var(--ui-radius-md, 16px);
    background: color-mix(in srgb, var(--ui-color-surface, #ffffff) 92%, transparent);
    box-shadow: var(--ui-shadow-soft, 0 14px 34px rgba(15, 23, 42, 0.06));
    overflow: hidden;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell #wsus__map_popup .ui-listing-modal__card.map_popup_content {
        background: color-mix(in srgb, var(--ui-color-surface, #ffffff) 82%, transparent);
        -webkit-backdrop-filter: blur(14px) saturate(1.15);
        backdrop-filter: blur(14px) saturate(1.15);
    }
}

.ui-site-shell #wsus__map_popup .ui-listing-modal__body.map_popup_text {
    color: var(--ui-color-text, #0f172a);
}

.ui-site-shell #wsus__map_popup .ui-listing-modal__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin: 0 0.35rem 0.5rem 0;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.2;
    color: #fff;
    background: var(--colorPrimary, #6366F1);
}

.ui-site-shell #wsus__map_popup .ui-listing-modal__badge--verified {
    background: #00af3c;
}

.ui-site-shell #wsus__map_popup .ui-listing-modal__map.map_popup_content_map {
    margin-top: 0.85rem;
    border: 1px solid var(--ui-color-border, rgba(15, 23, 42, 0.08));
    border-radius: var(--ui-radius-md, 16px);
    overflow: hidden;
}

/* -------------------------------------------------------------------------- */
/* Homepage                                                                    */
/* -------------------------------------------------------------------------- */

.ui-site-shell .ui-home #wsus__banner.ui-home-hero {
    position: relative;
    min-height: 520px;
    background-size: cover !important;
    background-position: center !important;
}

.ui-site-shell .ui-home #wsus__banner .wsus__banner_overlay {
    background: linear-gradient(110deg, rgba(15, 23, 42, 0.78) 0%, rgba(15, 23, 42, 0.45) 55%, rgba(15, 23, 42, 0.35) 100%);
    padding: 4.5rem 0 4rem;
}

.ui-site-shell .ui-home #wsus__banner .wsus__banner_text h1 {
    color: #fff;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.15;
    text-shadow: 0 8px 30px rgba(0, 0, 0, 0.25);
}

.ui-site-shell .ui-home #wsus__banner .wsus__banner_text p {
    color: rgba(248, 250, 252, 0.88);
    font-size: 1.05rem;
    max-width: 34rem;
}

.ui-site-shell .ui-home-search-panel {
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 20px;
    padding: 1.35rem 1.35rem 1.15rem;
    box-shadow: 0 22px 50px rgba(15, 23, 42, 0.22);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell .ui-home-search-panel {
        background: rgba(255, 255, 255, 0.78);
        -webkit-backdrop-filter: blur(16px) saturate(1.15);
        backdrop-filter: blur(16px) saturate(1.15);
    }
}

.ui-site-shell .ui-home-search-panel h3 {
    color: #0f172a;
    font-size: 1.15rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.ui-site-shell .ui-home-search-panel .wsus__search_area {
    margin-bottom: 0.75rem;
}

.ui-site-shell .ui-home-search-panel .wsus__search_area .select2-container {
    width: 100% !important;
}

.ui-site-shell .ui-home-search-panel input[type="text"],
.ui-site-shell .ui-home-search-panel .select2-container--default .select2-selection--single {
    border-radius: 12px !important;
    border-color: rgba(15, 23, 42, 0.12) !important;
    min-height: 46px;
}

.ui-site-shell .ui-home-search-panel .read_btn,
.ui-site-shell .ui-listings-filters .read_btn {
    width: 100%;
    border-radius: 999px;
    padding: 0.85rem 1.25rem;
    background: var(--colorPrimary, #6366F1);
    border: 1px solid transparent;
    color: #fff;
    font-weight: 600;
    box-shadow: 0 12px 28px color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent);
}

.ui-site-shell .ui-home-search-panel .read_btn:hover,
.ui-site-shell .ui-home-search-panel .read_btn:focus-visible,
.ui-site-shell .ui-listings-filters .read_btn:hover,
.ui-site-shell .ui-listings-filters .read_btn:focus-visible {
    filter: brightness(1.05);
    color: #fff;
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-home #wsus__category_slider.ui-category-marquee {
    margin-top: -2.5rem;
    position: relative;
    z-index: 2;
    padding: 0 0 1.25rem;
}

.ui-site-shell .ui-home .wsus__category_slider_area.ui-category-marquee__shell {
    position: relative;
    overflow: hidden;
    border-radius: 28px;
    padding: 1.5rem 0 1.35rem;
    border: 1px solid rgba(255, 255, 255, 0.55);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.42)),
        radial-gradient(ellipse 70% 80% at 10% 20%, color-mix(in srgb, var(--colorPrimary, #6366F1) 16%, transparent), transparent 60%),
        radial-gradient(ellipse 55% 60% at 95% 80%, rgba(34, 211, 238, 0.12), transparent 55%);
    box-shadow: 0 22px 50px rgba(15, 23, 42, 0.1);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell .ui-home .wsus__category_slider_area.ui-category-marquee__shell {
        -webkit-backdrop-filter: blur(18px) saturate(1.25);
        backdrop-filter: blur(18px) saturate(1.25);
    }
}

.ui-site-shell .ui-home .ui-category-marquee__shell::before,
.ui-site-shell .ui-home .ui-category-marquee__shell::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 72px;
    z-index: 3;
    pointer-events: none;
}

.ui-site-shell .ui-home .ui-category-marquee__shell::before {
    left: 0;
    background: linear-gradient(90deg, rgba(248, 250, 252, 0.95), transparent);
}

.ui-site-shell .ui-home .ui-category-marquee__shell::after {
    right: 0;
    background: linear-gradient(270deg, rgba(248, 250, 252, 0.95), transparent);
}

.ui-site-shell .ui-home .ui-category-marquee__header {
    position: relative;
    z-index: 2;
    padding: 0 1.5rem 1rem;
    text-align: center;
}

.ui-site-shell .ui-home .ui-category-marquee__eyebrow {
    margin: 0 0 0.35rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--colorPrimary, #6366F1);
}

.ui-site-shell .ui-home .ui-category-marquee__title {
    margin: 0;
    color: #0f172a;
    font-size: clamp(1.2rem, 1rem + 0.8vw, 1.55rem);
    font-weight: 700;
    letter-spacing: -0.02em;
}

.ui-site-shell .ui-home .ui-category-marquee__tracks {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.ui-site-shell .ui-home .ui-category-marquee__track {
    overflow: hidden;
    width: 100%;
}

.ui-site-shell .ui-home .ui-category-marquee__rail {
    display: flex;
    width: max-content;
    gap: 0.75rem;
    will-change: transform;
}

.ui-site-shell .ui-home .ui-category-marquee__track--left .ui-category-marquee__rail {
    animation: uiCategoryMarqueeLeft 42s linear infinite;
}

.ui-site-shell .ui-home .ui-category-marquee__track--right .ui-category-marquee__rail {
    animation: uiCategoryMarqueeRight 48s linear infinite;
}

.ui-site-shell .ui-home .ui-category-marquee__track:hover .ui-category-marquee__rail {
    animation-play-state: paused;
}

.ui-site-shell .ui-home .wsus__category_single_slider.ui-category-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    flex: 0 0 auto;
    margin: 0;
    min-width: 168px;
    padding: 0.7rem 1rem 0.7rem 0.7rem;
    text-align: left;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    background: rgba(255, 255, 255, 0.55);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
    transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell .ui-home .wsus__category_single_slider.ui-category-chip {
        -webkit-backdrop-filter: blur(10px) saturate(1.15);
        backdrop-filter: blur(10px) saturate(1.15);
    }
}

.ui-site-shell .ui-home .ui-category-chip__icon,
.ui-site-shell .ui-home .wsus__category_single_slider.ui-category-chip span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0.45rem;
    border-radius: 999px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.92);
    overflow: hidden;
    flex-shrink: 0;
}

.ui-site-shell .ui-home .wsus__category_single_slider.ui-category-chip img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.ui-site-shell .ui-home .wsus__category_single_slider.ui-category-chip p {
    margin: 0;
    color: #0f172a;
    font-size: 0.92rem;
    font-weight: 600;
    text-transform: capitalize;
    white-space: nowrap;
    line-height: 1.2;
}

.ui-site-shell .ui-home .wsus__category_single_slider.ui-category-chip:hover,
.ui-site-shell .ui-home .wsus__category_single_slider.ui-category-chip:focus-visible {
    transform: translateY(-2px) scale(1.02);
    background: rgba(255, 255, 255, 0.92);
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent);
    box-shadow: 0 14px 32px color-mix(in srgb, var(--colorPrimary, #6366F1) 18%, rgba(15, 23, 42, 0.12));
    outline: none;
    color: inherit;
}

.ui-site-shell .ui-home .wsus__category_single_slider.ui-category-chip:hover p,
.ui-site-shell .ui-home .wsus__category_single_slider.ui-category-chip:focus-visible p {
    color: var(--colorPrimary, #6366F1);
}

.ui-site-shell .ui-home .wsus__category_single_slider.ui-category-chip:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent);
}

.ui-site-shell .ui-home .ui-category-marquee__empty {
    margin: 0;
    padding: 0.5rem 1.5rem 0;
    text-align: center;
    color: #64748b;
}

@keyframes uiCategoryMarqueeLeft {
    from { transform: translateX(0); }
    to { transform: translateX(-33.333%); }
}

@keyframes uiCategoryMarqueeRight {
    from { transform: translateX(-33.333%); }
    to { transform: translateX(0); }
}

.ui-site-shell .ui-home .wsus__heading_area h2 {
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #0f172a;
}

.ui-site-shell .ui-home .wsus__heading_area p {
    color: #64748b;
}

/* Features ? glass step cards (home + about via .ui-features) */
.ui-site-shell #wsus__features.ui-features {
    position: relative;
    overflow: hidden;
    padding: 4.5rem 0 4.75rem;
    background: transparent;
}

.ui-site-shell #wsus__features.ui-features .ui-features__atmosphere {
    position: absolute;
    inset: 8% 6% auto;
    height: 70%;
    border-radius: 40px;
    background:
        radial-gradient(ellipse 55% 70% at 15% 30%, color-mix(in srgb, var(--colorPrimary, #6366F1) 18%, transparent), transparent 70%),
        radial-gradient(ellipse 45% 55% at 90% 70%, rgba(34, 211, 238, 0.12), transparent 65%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.55), rgba(248, 250, 252, 0.2));
    border: 1px solid rgba(255, 255, 255, 0.45);
    pointer-events: none;
    z-index: 0;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell #wsus__features.ui-features .ui-features__atmosphere {
        -webkit-backdrop-filter: blur(20px) saturate(1.15);
        backdrop-filter: blur(20px) saturate(1.15);
    }
}

.ui-site-shell #wsus__features.ui-features .container {
    position: relative;
    z-index: 1;
}

.ui-site-shell #wsus__features.ui-features .ui-features__heading {
    margin-bottom: 2rem;
}

.ui-site-shell #wsus__features.ui-features .ui-features__eyebrow {
    margin: 0 0 0.45rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--colorPrimary, #6366F1);
}

.ui-site-shell #wsus__features.ui-features .ui-features__heading h2 {
    margin-bottom: 0.5rem;
}

.ui-site-shell #wsus__features.ui-features .ui-features__heading h2::before,
.ui-site-shell #wsus__features.ui-features .ui-features__heading h2::after {
    display: none;
}

.ui-site-shell #wsus__features.ui-features .ui-features__heading p {
    color: #64748b;
    max-width: 36rem;
    margin-left: auto;
    margin-right: auto;
}

.ui-site-shell #wsus__features.ui-features .ui-features__grid {
    position: relative;
}

@media (min-width: 1200px) {
    .ui-site-shell #wsus__features.ui-features .ui-features__grid::before {
        content: "";
        position: absolute;
        top: 4.25rem;
        left: 12%;
        right: 12%;
        height: 1px;
        background: linear-gradient(
            90deg,
            transparent,
            color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent),
            color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent),
            transparent
        );
        z-index: 0;
        pointer-events: none;
    }

    .ui-site-shell #wsus__features.ui-features .ui-feature-card--accent {
        transform: translateY(-12px);
    }
}

.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card {
    position: relative;
    overflow: hidden;
    height: 100%;
    margin: 0;
    padding: 1.75rem 1.5rem 1.6rem;
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    background: rgba(255, 255, 255, 0.52);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.08);
    transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease, background-color 220ms ease;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card {
        -webkit-backdrop-filter: blur(16px) saturate(1.2);
        backdrop-filter: blur(16px) saturate(1.2);
    }
}

.ui-site-shell #wsus__features.ui-features .ui-feature-card__glow {
    position: absolute;
    inset: auto -20% -35% auto;
    width: 180px;
    height: 180px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 22%, transparent);
    filter: blur(28px);
    opacity: 0.55;
    pointer-events: none;
    transition: opacity 220ms ease;
}

.ui-site-shell #wsus__features.ui-features .ui-feature-card__index {
    position: absolute;
    top: 1rem;
    right: 1.15rem;
    font-family: inherit;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.04em;
    color: transparent;
    -webkit-text-stroke: 1px color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, rgba(15, 23, 42, 0.18));
    -webkit-text-fill-color: transparent;
    opacity: 0.85;
}

.ui-site-shell #wsus__features.ui-features .ui-feature-card__icon.icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    margin-bottom: 1.1rem;
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.72);
    color: var(--colorPrimary, #6366F1);
    font-size: 1.2rem;
    line-height: 1;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.ui-site-shell #wsus__features.ui-features .ui-feature-card__body {
    position: relative;
    z-index: 1;
}

.ui-site-shell #wsus__features.ui-features .ui-feature-card h5 {
    margin: 0 0 0.65rem;
    color: #0f172a;
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: -0.015em;
    text-transform: none;
}

.ui-site-shell #wsus__features.ui-features .ui-feature-card p {
    margin: 0;
    color: #64748b;
    font-size: 0.95rem;
    line-height: 1.65;
}

.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:hover,
.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:focus-within {
    background: rgba(255, 255, 255, 0.82);
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent);
    box-shadow: 0 24px 48px color-mix(in srgb, var(--colorPrimary, #6366F1) 14%, rgba(15, 23, 42, 0.12));
    transform: translateY(-6px);
    color: inherit;
}

.ui-site-shell #wsus__features.ui-features .ui-feature-card--accent:hover,
.ui-site-shell #wsus__features.ui-features .ui-feature-card--accent:focus-within {
    transform: translateY(-18px);
}

.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:hover .ui-feature-card__glow,
.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:focus-within .ui-feature-card__glow {
    opacity: 0.9;
}

.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:hover .icon,
.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:focus-within .icon {
    color: #fff;
    background: var(--colorPrimary, #6366F1);
    border-color: var(--colorPrimary, #6366F1);
}

.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:hover h5,
.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:hover p,
.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:focus-within h5,
.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:focus-within p {
    color: inherit;
}

.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:hover h5,
.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:focus-within h5 {
    color: #0f172a;
}

.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:hover p,
.ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:focus-within p {
    color: #475569;
}

.ui-site-shell #wsus__features.ui-features .ui-features__empty {
    margin: 0;
    text-align: center;
    color: #64748b;
}

@media (max-width: 991.98px) {
    .ui-site-shell #wsus__features.ui-features {
        padding: 3.25rem 0 3.5rem;
    }

    .ui-site-shell #wsus__features.ui-features .ui-features__atmosphere {
        inset: 4% 3% auto;
        height: 78%;
        border-radius: 28px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card,
    .ui-site-shell #wsus__features.ui-features .ui-feature-card__glow {
        transition: none !important;
    }

    .ui-site-shell #wsus__features.ui-features .ui-feature-card--accent,
    .ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:hover,
    .ui-site-shell #wsus__features.ui-features .wsus__feature_single.ui-feature-card:focus-within,
    .ui-site-shell #wsus__features.ui-features .ui-feature-card--accent:hover,
    .ui-site-shell #wsus__features.ui-features .ui-feature-card--accent:focus-within {
        transform: none;
    }
}


/* Featured locations ? glass filter band + listing grid */
.ui-site-shell #wsus__location.ui-featured-locations {
    position: relative;
    overflow: hidden;
    background: transparent;
}

.ui-site-shell #wsus__location.ui-featured-locations .wsus__location_overlay.ui-featured-locations__overlay {
    position: relative;
    padding: 3.25rem 0 3.75rem;
}

.ui-site-shell #wsus__location.ui-featured-locations .ui-featured-locations__atmosphere {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(ellipse 50% 40% at 90% 8%, color-mix(in srgb, var(--colorPrimary, #6366F1) 12%, transparent), transparent 70%),
        radial-gradient(ellipse 45% 35% at 6% 92%, rgba(14, 165, 233, 0.1), transparent 65%),
        linear-gradient(165deg, #0f172a 0%, #1e293b 42%, #334155 100%);
}

.ui-site-shell #wsus__location.ui-featured-locations .container {
    position: relative;
    z-index: 1;
}

.ui-site-shell #wsus__location.ui-featured-locations .ui-featured-locations__heading {
    margin-bottom: 1.75rem;
    text-align: center;
}

.ui-site-shell #wsus__location.ui-featured-locations .ui-featured-locations__eyebrow {
    margin: 0 0 0.45rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 75%, #fff);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ui-site-shell #wsus__location.ui-featured-locations .ui-featured-locations__heading h2 {
    margin-bottom: 0.55rem;
    color: #fff;
}

.ui-site-shell #wsus__location.ui-featured-locations .ui-featured-locations__heading h2::before,
.ui-site-shell #wsus__location.ui-featured-locations .ui-featured-locations__heading h2::after {
    display: none;
}

.ui-site-shell #wsus__location.ui-featured-locations .ui-featured-locations__heading p {
    margin: 0 auto;
    max-width: 36rem;
    color: rgba(248, 250, 252, 0.72);
}

.ui-site-shell #wsus__location.ui-featured-locations .wsus__location_filter.ui-featured-locations__filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.55rem;
    margin: 0 auto 1.75rem;
    max-width: 52rem;
    padding: 0.7rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell #wsus__location.ui-featured-locations .wsus__location_filter.ui-featured-locations__filters {
        -webkit-backdrop-filter: blur(14px) saturate(1.2);
        backdrop-filter: blur(14px) saturate(1.2);
    }
}

.ui-site-shell #wsus__location.ui-featured-locations .wsus__location_filter button {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0;
    padding: 0.55rem 1rem;
    border-radius: 999px;
    border: 1px solid transparent;
    background: transparent;
    color: rgba(248, 250, 252, 0.86);
    font-size: 0.92rem;
    font-weight: 600;
    text-transform: capitalize;
    transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, transform 180ms ease;
}

.ui-site-shell #wsus__location.ui-featured-locations .wsus__location_filter button i {
    font-size: 0.72rem;
    opacity: 0.8;
}

.ui-site-shell #wsus__location.ui-featured-locations .wsus__location_filter button:hover,
.ui-site-shell #wsus__location.ui-featured-locations .wsus__location_filter button:focus-visible {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.18);
    color: #fff;
    outline: none;
}

.ui-site-shell #wsus__location.ui-featured-locations .wsus__location_filter button:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent);
}

.ui-site-shell #wsus__location.ui-featured-locations .wsus__location_filter button.active {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 90%, #fff);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 8px 20px color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent);
}

.ui-site-shell #wsus__location.ui-featured-locations .ui-featured-locations__grid {
    margin-top: 0.25rem;
}

.ui-site-shell #wsus__location.ui-featured-locations .ui-listing-card {
    background: rgba(255, 255, 255, 0.96);
    border-color: rgba(255, 255, 255, 0.2);
}

.ui-site-shell #wsus__location.ui-featured-locations .ui-featured-locations__empty {
    margin: 0.25rem auto 0;
    max-width: 30rem;
    padding: 1.25rem 1.1rem;
    border-radius: 16px;
    border: 1px dashed rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.08);
    color: rgba(248, 250, 252, 0.78);
    text-align: center;
}

@media (max-width: 767.98px) {
    .ui-site-shell #wsus__location.ui-featured-locations .wsus__location_overlay.ui-featured-locations__overlay {
        padding: 2.25rem 0 2.75rem;
    }

    .ui-site-shell #wsus__location.ui-featured-locations .wsus__location_filter.ui-featured-locations__filters {
        border-radius: 20px;
        justify-content: flex-start;
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .ui-site-shell #wsus__location.ui-featured-locations .wsus__location_filter.ui-featured-locations__filters::-webkit-scrollbar {
        display: none;
    }

    .ui-site-shell #wsus__location.ui-featured-locations .wsus__location_filter button {
        flex: 0 0 auto;
        white-space: nowrap;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell #wsus__location.ui-featured-locations .wsus__location_filter button {
        transition: none !important;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell #wsus__location.ui-featured-locations .ui-featured-locations__atmosphere {
        background: linear-gradient(165deg, #0f172a 0%, #1e293b 42%, #334155 100%);
    }

    .ui-site-shell #wsus__location.ui-featured-locations .ui-featured-locations__eyebrow {
        color: #f66542;
    }

    .ui-site-shell #wsus__location.ui-featured-locations .wsus__location_filter button.active {
        background: #f66542;
        box-shadow: 0 8px 20px rgba(246, 101, 66, 0.35);
    }

    .ui-site-shell #wsus__location.ui-featured-locations .wsus__location_filter button:focus-visible {
        box-shadow: 0 0 0 3px rgba(246, 101, 66, 0.35);
    }
}

/* Featured listings ? light glass carousel (no background image) */
.ui-site-shell #wsus__featured_listing.ui-featured-listings {
    position: relative;
    overflow: hidden;
    padding: 3.25rem 0 4.25rem;
    background: none !important;
    background-image: none !important;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__atmosphere {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(ellipse 55% 45% at 12% 10%, color-mix(in srgb, var(--colorPrimary, #6366F1) 12%, transparent), transparent 70%),
        radial-gradient(ellipse 45% 40% at 94% 85%, rgba(14, 165, 233, 0.1), transparent 65%),
        linear-gradient(180deg, #f8fafc 0%, #eef2f7 50%, #f8fafc 100%);
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .container {
    position: relative;
    z-index: 1;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__header {
    margin-bottom: 1.5rem;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__heading {
    margin-bottom: 0;
    text-align: left;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__eyebrow {
    margin: 0 0 0.45rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 85%, #0f172a);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__heading h2 {
    margin-bottom: 0.5rem;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__heading h2::before,
.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__heading h2::after {
    display: none;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__heading p {
    margin: 0;
    max-width: 36rem;
    color: #64748b;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__actions {
    display: flex;
    justify-content: flex-end;
    padding-bottom: 0.35rem;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.7rem 1.15rem;
    border-radius: 999px;
    border: 1px solid rgba(15, 23, 42, 0.1);
    background: rgba(255, 255, 255, 0.72);
    color: #0f172a;
    font-size: 0.92rem;
    font-weight: 650;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
    transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__cta {
        -webkit-backdrop-filter: blur(10px) saturate(1.15);
        backdrop-filter: blur(10px) saturate(1.15);
    }
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__cta i {
    font-size: 0.75rem;
    transition: transform 180ms ease;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__cta:hover,
.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__cta:focus-visible {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 92%, #fff);
    border-color: transparent;
    color: #fff;
    outline: none;
    transform: translateY(-2px);
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__cta:hover i,
.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__cta:focus-visible i {
    transform: translateX(3px);
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__cta:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 30%, transparent);
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .listing_slider.ui-featured-listings__slider {
    margin: 0 -0.35rem;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .listing_slider .wsus__featured_single {
    margin: 0.5rem 0.65rem 1.1rem;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .slick-dots {
    position: relative;
    bottom: auto;
    display: flex !important;
    justify-content: center;
    gap: 0.35rem;
    margin: 0.85rem 0 0;
    padding: 0;
    list-style: none;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .slick-dots li {
    margin: 0;
    width: auto;
    height: auto;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .slick-dots li button {
    width: 1.65rem;
    height: 0.35rem;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, #cbd5e1);
    opacity: 1;
    font-size: 0;
    transition: width 180ms ease, background-color 180ms ease;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .slick-dots li.slick-active button {
    width: 2.4rem;
    background: var(--colorPrimary, #6366F1);
    opacity: 1;
}

.ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__empty {
    margin: 0.5rem auto 0;
    max-width: 30rem;
    padding: 1.25rem 1.1rem;
    border-radius: 16px;
    border: 1px dashed rgba(15, 23, 42, 0.14);
    background: rgba(255, 255, 255, 0.72);
    color: #64748b;
    text-align: center;
}

@media (max-width: 991.98px) {
    .ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__heading {
        text-align: center;
        margin-bottom: 1rem;
    }

    .ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__heading p {
        margin-left: auto;
        margin-right: auto;
    }

    .ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__actions {
        justify-content: center;
        padding-bottom: 0;
        margin-bottom: 0.5rem;
    }
}

@media (max-width: 767.98px) {
    .ui-site-shell #wsus__featured_listing.ui-featured-listings {
        padding: 2.25rem 0 3rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__cta,
    .ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__cta i,
    .ui-site-shell #wsus__featured_listing.ui-featured-listings .slick-dots li button {
        transition: none !important;
    }

    .ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__cta:hover,
    .ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__cta:focus-visible {
        transform: none;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__atmosphere {
        background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 50%, #f8fafc 100%);
    }

    .ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__eyebrow {
        color: #f66542;
    }

    .ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__cta:hover,
    .ui-site-shell #wsus__featured_listing.ui-featured-listings .ui-featured-listings__cta:focus-visible {
        background: #f66542;
    }

    .ui-site-shell #wsus__featured_listing.ui-featured-listings .slick-dots li button {
        background: #cbd5e1;
    }

    .ui-site-shell #wsus__featured_listing.ui-featured-listings .slick-dots li.slick-active button {
        background: #f66542;
    }
}

/* Packages ? glass pricing theater (homepage only via .ui-packages) */
.ui-site-shell #wsus__package.ui-packages {
    position: relative;
    overflow: hidden;
    background: transparent;
}

.ui-site-shell #wsus__package.ui-packages .wsus__package_overlay.ui-packages__overlay {
    position: relative;
    padding: 3.5rem 0 4rem;
    background: transparent;
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__atmosphere {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 70% 55% at 50% -10%, color-mix(in srgb, var(--colorPrimary, #6366F1) 34%, transparent), transparent 60%),
        radial-gradient(ellipse 40% 40% at 8% 80%, rgba(34, 211, 238, 0.14), transparent 55%),
        radial-gradient(ellipse 45% 35% at 95% 70%, rgba(251, 146, 60, 0.12), transparent 55%),
        linear-gradient(160deg, #0b1220 0%, #111827 45%, #1a2333 100%);
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(2px);
    opacity: 0.55;
    animation: ui-packages-float 12s ease-in-out infinite;
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__orb--one {
    width: 18rem;
    height: 18rem;
    top: -4rem;
    left: -3rem;
    background: radial-gradient(circle, color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent), transparent 70%);
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__orb--two {
    width: 14rem;
    height: 14rem;
    right: -2rem;
    top: 35%;
    background: radial-gradient(circle, rgba(56, 189, 248, 0.35), transparent 70%);
    animation-delay: -4s;
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__orb--three {
    width: 12rem;
    height: 12rem;
    left: 40%;
    bottom: -3rem;
    background: radial-gradient(circle, rgba(251, 191, 36, 0.22), transparent 70%);
    animation-delay: -7s;
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__gridline {
    position: absolute;
    inset: 0;
    opacity: 0.12;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, #000 20%, transparent 75%);
}

@keyframes ui-packages-float {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    50% { transform: translate3d(12px, -18px, 0) scale(1.05); }
}

.ui-site-shell #wsus__package.ui-packages .container {
    position: relative;
    z-index: 1;
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__heading {
    margin-bottom: 2.25rem;
    text-align: center;
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__eyebrow {
    margin: 0 0 0.5rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 70%, #fff);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__heading h2 {
    margin-bottom: 0.55rem;
    color: #fff;
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__heading h2::before,
.ui-site-shell #wsus__package.ui-packages .ui-packages__heading h2::after {
    display: none;
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__heading p {
    margin: 0 auto;
    max-width: 38rem;
    color: rgba(248, 250, 252, 0.72);
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__stage {
    position: relative;
}

.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    margin-top: 0.75rem;
    padding: 1.6rem 1.4rem 1.45rem;
    text-align: left;
    border-radius: 26px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.07);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 22px 50px rgba(0, 0, 0, 0.28);
    overflow: hidden;
    transition: transform 240ms ease, border-color 240ms ease, background-color 240ms ease, box-shadow 240ms ease;
}

.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card::before {
    display: none;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card {
        -webkit-backdrop-filter: blur(16px) saturate(1.25);
        backdrop-filter: blur(16px) saturate(1.25);
        background: rgba(255, 255, 255, 0.08);
    }
}

.ui-site-shell #wsus__package.ui-packages .ui-package-card__shine {
    position: absolute;
    inset: auto -20% 45% -20%;
    height: 55%;
    background: linear-gradient(120deg, transparent 20%, rgba(255, 255, 255, 0.12) 45%, transparent 70%);
    transform: rotate(-8deg);
    pointer-events: none;
}

.ui-site-shell #wsus__package.ui-packages .ui-package-card__top {
    position: relative;
    z-index: 1;
    margin-bottom: 1.1rem;
}

.ui-site-shell #wsus__package.ui-packages .ui-package-card__tier {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.75rem;
    padding: 0.28rem 0.7rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.08);
    color: rgba(248, 250, 252, 0.88);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ui-site-shell #wsus__package.ui-packages .ui-package-card__tier--hot {
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 55%, rgba(255, 255, 255, 0.2));
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent);
    color: #fff;
}

.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card h3.ui-package-card__name,
.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card h4 {
    margin: 0 !important;
    color: #fff !important;
    font-size: 1.45rem !important;
    font-weight: 750 !important;
    letter-spacing: -0.02em;
    text-transform: capitalize !important;
    background: none !important;
    border: none !important;
}

.ui-site-shell #wsus__package.ui-packages .ui-package-card__price {
    position: relative;
    z-index: 1;
    margin-bottom: 1.25rem;
    padding: 1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(15, 23, 42, 0.35);
}

.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card h5 {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    margin: 0;
    color: #fff;
    font-size: clamp(1.85rem, 1.4rem + 1.2vw, 2.35rem);
    font-weight: 750;
    letter-spacing: -0.03em;
    line-height: 1.1;
    z-index: 1;
}

.ui-site-shell #wsus__package.ui-packages .ui-package-card__amount {
    display: inline-block;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card h5::after {
    display: none;
}

.ui-site-shell #wsus__package.ui-packages .ui-package-card__period,
.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card h5 span.ui-package-card__period {
    color: rgba(248, 250, 252, 0.68);
    font-size: 0.9rem;
    font-weight: 550;
    letter-spacing: 0;
    text-transform: none;
}

.ui-site-shell #wsus__package.ui-packages .ui-package-card__features {
    position: relative;
    z-index: 1;
    list-style: none;
    margin: 0 0 1.35rem;
    padding: 0;
    flex: 1 1 auto;
}

.ui-site-shell #wsus__package.ui-packages .ui-package-card__features li {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    margin: 0 0 0.7rem;
    color: rgba(248, 250, 252, 0.88);
    font-size: 0.92rem;
    line-height: 1.4;
}

.ui-site-shell #wsus__package.ui-packages .ui-package-card__features li:last-child {
    margin-bottom: 0;
}

.ui-site-shell #wsus__package.ui-packages .ui-package-card__check {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.85rem;
    height: 1.85rem;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    font-size: 0.72rem;
}

.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card > a.ui-package-card__cta,
.ui-site-shell #wsus__package.ui-packages .ui-package-card__cta {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    width: 100%;
    margin-top: auto;
    padding: 0.85rem 1.1rem;
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-size: 0.95rem;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0.01em;
    transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.ui-site-shell #wsus__package.ui-packages .ui-package-card__cta i {
    font-size: 0.75rem;
    transition: transform 180ms ease;
}

.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card:hover {
    transform: translateY(-8px);
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.12);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        0 28px 60px rgba(0, 0, 0, 0.35);
}

.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card:hover > a.ui-package-card__cta,
.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card:hover .ui-package-card__cta {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 90%, #fff);
    border-color: transparent;
    color: #fff;
}

.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card:hover .ui-package-card__cta i {
    transform: translateX(3px);
}

.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card--popular {
    margin-top: 0;
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 55%, rgba(255, 255, 255, 0.2));
    background:
        linear-gradient(165deg, color-mix(in srgb, var(--colorPrimary, #6366F1) 22%, rgba(255, 255, 255, 0.08)), rgba(255, 255, 255, 0.08));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        0 0 0 1px color-mix(in srgb, var(--colorPrimary, #6366F1) 25%, transparent),
        0 30px 70px rgba(0, 0, 0, 0.4);
    transform: translateY(-12px) scale(1.02);
}

.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card--popular .ui-package-card__cta {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 92%, #fff);
    border-color: transparent;
    box-shadow: 0 12px 28px color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent);
}

.ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card--popular:hover {
    transform: translateY(-16px) scale(1.02);
}

.ui-site-shell #wsus__package.ui-packages .ui-package-card__cta:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 3px;
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__footer {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__compare {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: rgba(248, 250, 252, 0.82);
    font-size: 0.95rem;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.22);
    padding-bottom: 0.15rem;
    transition: color 180ms ease, border-color 180ms ease;
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__compare:hover,
.ui-site-shell #wsus__package.ui-packages .ui-packages__compare:focus-visible {
    color: #fff;
    border-bottom-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 70%, #fff);
    outline: none;
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__compare i {
    font-size: 0.72rem;
}

.ui-site-shell #wsus__package.ui-packages .ui-packages__empty {
    margin: 0.5rem auto 0;
    max-width: 30rem;
    padding: 1.25rem 1.1rem;
    border-radius: 16px;
    border: 1px dashed rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.06);
    color: rgba(248, 250, 252, 0.78);
    text-align: center;
}

@media (max-width: 1199.98px) {
    .ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card--popular {
        transform: none;
    }

    .ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card--popular:hover {
        transform: translateY(-8px);
    }
}

@media (max-width: 767.98px) {
    .ui-site-shell #wsus__package.ui-packages .wsus__package_overlay.ui-packages__overlay {
        padding: 2.5rem 0 3rem;
    }

    .ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card {
        padding: 1.35rem 1.2rem 1.25rem;
    }
}

@media (max-width: 479.98px) {
    .ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card h5 {
        font-size: clamp(1.55rem, 1.2rem + 2.2vw, 1.95rem);
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell #wsus__package.ui-packages .ui-packages__orb,
    .ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card,
    .ui-site-shell #wsus__package.ui-packages .ui-package-card__cta,
    .ui-site-shell #wsus__package.ui-packages .ui-package-card__cta i,
    .ui-site-shell #wsus__package.ui-packages .ui-packages__compare {
        animation: none !important;
        transition: none !important;
    }

    .ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card:hover,
    .ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card--popular,
    .ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card--popular:hover {
        transform: none;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell #wsus__package.ui-packages .ui-packages__atmosphere {
        background: linear-gradient(160deg, #0b1220 0%, #111827 45%, #1a2333 100%);
    }

    .ui-site-shell #wsus__package.ui-packages .ui-packages__eyebrow {
        color: #6366F1;
    }

    .ui-site-shell #wsus__package.ui-packages .ui-package-card__tier--hot {
        background: rgba(99, 102, 241, 0.28);
        border-color: rgba(99, 102, 241, 0.55);
    }

    .ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card:hover > a.ui-package-card__cta,
    .ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card--popular .ui-package-card__cta {
        background: #6366F1;
    }

    .ui-site-shell #wsus__package.ui-packages .member_price.ui-package-card--popular {
        border-color: rgba(99, 102, 241, 0.55);
        background: linear-gradient(165deg, rgba(99, 102, 241, 0.22), rgba(255, 255, 255, 0.08));
    }
}

/* Testimonials ? glass quote cards */
.ui-site-shell #wsus__testimonial.ui-testimonials {
    position: relative;
    overflow: hidden;
    background: transparent;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .wsus__test_overlay.ui-testimonials__overlay {
    position: relative;
    padding: 3.25rem 0 4.25rem;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonials__atmosphere {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 50% 40% at 10% 20%, color-mix(in srgb, var(--colorPrimary, #6366F1) 12%, transparent), transparent 70%),
        radial-gradient(ellipse 45% 35% at 90% 80%, rgba(14, 165, 233, 0.1), transparent 65%),
        linear-gradient(180deg, #f8fafc 0%, #eef2f7 48%, #f8fafc 100%);
}

.ui-site-shell #wsus__testimonial.ui-testimonials .container {
    position: relative;
    z-index: 1;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonials__heading {
    margin-bottom: 1.75rem;
    text-align: center;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonials__eyebrow {
    margin: 0 0 0.45rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 85%, #0f172a);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonials__heading h2 {
    margin-bottom: 0.55rem;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonials__heading h2::before,
.ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonials__heading h2::after {
    display: none;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonials__heading p {
    margin: 0 auto;
    max-width: 36rem;
    color: #64748b;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .wsus__single_clients.ui-testimonial-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 280px;
    margin: 0.65rem 0.7rem 1.1rem;
    padding: 1.55rem 1.45rem 1.4rem;
    border-radius: 24px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.78);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.85),
        0 18px 40px rgba(15, 23, 42, 0.08);
    overflow: hidden;
    transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell #wsus__testimonial.ui-testimonials .wsus__single_clients.ui-testimonial-card {
        -webkit-backdrop-filter: blur(14px) saturate(1.2);
        backdrop-filter: blur(14px) saturate(1.2);
        background: rgba(255, 255, 255, 0.68);
    }
}

.ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonial-card__quote {
    position: absolute;
    top: 1.15rem;
    right: 1.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 14px;
    border: 1px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 22%, transparent);
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 10%, #fff);
    color: var(--colorPrimary, #6366F1);
    font-size: 0.95rem;
    z-index: 1;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .rating.ui-testimonial-card__rating {
    position: relative;
    top: auto;
    right: auto;
    display: flex;
    gap: 0.2rem;
    margin: 0 0 1rem;
    color: #f59e0b;
    font-size: 0.9rem;
    z-index: 1;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .rating.ui-testimonial-card__rating .far {
    color: #cbd5e1;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .descrption.ui-testimonial-card__body {
    position: relative;
    z-index: 1;
    flex: 1 1 auto;
    margin: 0 0 1.35rem;
    color: #334155;
    font-size: 1.05rem;
    font-weight: 500;
    line-height: 1.65;
    letter-spacing: -0.01em;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .descrption.ui-testimonial-card__body::after {
    display: none;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .text.ui-testimonial-card__author {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 0.85rem;
    margin-top: auto;
    padding-top: 1.1rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonial-card__avatar {
    flex: 0 0 auto;
    display: inline-flex;
    width: 3.35rem;
    height: 3.35rem;
    padding: 3px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--colorPrimary, #6366F1), rgba(14, 165, 233, 0.75));
    box-shadow: 0 8px 18px color-mix(in srgb, var(--colorPrimary, #6366F1) 25%, transparent);
}

.ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonial-card__avatar img,
.ui-site-shell #wsus__testimonial.ui-testimonials .wsus__single_clients img {
    width: 100% !important;
    height: 100% !important;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #fff;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .wsus__single_clients .c_name {
    margin: 0;
    color: #0f172a;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.25;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .wsus__single_clients .c_det {
    margin-top: 0.2rem;
    color: #64748b;
    font-size: 0.88rem;
    font-weight: 500;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .wsus__single_clients.ui-testimonial-card:hover {
    transform: translateY(-4px);
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, rgba(15, 23, 42, 0.08));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.9),
        0 24px 48px rgba(15, 23, 42, 0.12);
}

.ui-site-shell #wsus__testimonial.ui-testimonials .slick-dots {
    position: relative;
    bottom: auto;
    display: flex !important;
    justify-content: center;
    gap: 0.35rem;
    margin: 0.85rem 0 0;
    padding: 0;
    list-style: none;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .slick-dots li {
    margin: 0;
    width: auto;
    height: auto;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .slick-dots li button {
    width: 1.65rem;
    height: 0.35rem;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, #cbd5e1);
    opacity: 1;
    font-size: 0;
    transition: width 180ms ease, background-color 180ms ease;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .slick-dots li.slick-active button {
    width: 2.4rem;
    background: var(--colorPrimary, #6366F1);
    opacity: 1;
}

.ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonials__empty {
    margin: 0.5rem auto 0;
    max-width: 30rem;
    padding: 1.25rem 1.1rem;
    border-radius: 16px;
    border: 1px dashed rgba(15, 23, 42, 0.14);
    background: rgba(255, 255, 255, 0.72);
    color: #64748b;
    text-align: center;
}

@media (max-width: 767.98px) {
    .ui-site-shell #wsus__testimonial.ui-testimonials .wsus__test_overlay.ui-testimonials__overlay {
        padding: 2.25rem 0 3rem;
    }

    .ui-site-shell #wsus__testimonial.ui-testimonials .wsus__single_clients.ui-testimonial-card {
        min-height: 0;
        margin-left: 0.25rem;
        margin-right: 0.25rem;
        padding: 1.3rem 1.15rem 1.2rem;
    }

    .ui-site-shell #wsus__testimonial.ui-testimonials .descrption.ui-testimonial-card__body {
        font-size: 0.98rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell #wsus__testimonial.ui-testimonials .wsus__single_clients.ui-testimonial-card,
    .ui-site-shell #wsus__testimonial.ui-testimonials .slick-dots li button {
        transition: none !important;
    }

    .ui-site-shell #wsus__testimonial.ui-testimonials .wsus__single_clients.ui-testimonial-card:hover {
        transform: none;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonials__atmosphere {
        background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 48%, #f8fafc 100%);
    }

    .ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonials__eyebrow {
        color: #f66542;
    }

    .ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonial-card__quote {
        background: rgba(246, 101, 66, 0.1);
        border-color: rgba(246, 101, 66, 0.22);
        color: #f66542;
    }

    .ui-site-shell #wsus__testimonial.ui-testimonials .ui-testimonial-card__avatar {
        background: linear-gradient(135deg, #f66542, #38bdf8);
        box-shadow: 0 8px 18px rgba(246, 101, 66, 0.25);
    }

    .ui-site-shell #wsus__testimonial.ui-testimonials .wsus__single_clients.ui-testimonial-card:hover {
        border-color: rgba(246, 101, 66, 0.28);
    }

    .ui-site-shell #wsus__testimonial.ui-testimonials .slick-dots li button {
        background: #cbd5e1;
    }

    .ui-site-shell #wsus__testimonial.ui-testimonials .slick-dots li.slick-active button {
        background: #f66542;
    }
}

/* Home blog ? editorial glass magazine (homepage only via .ui-home-blog) */
.ui-site-shell #blog_part.ui-home-blog {
    position: relative;
    overflow: hidden;
}

.ui-site-shell #blog_part.ui-home-blog .blog_part_overlay.ui-home-blog__overlay {
    position: relative;
    padding: 3.5rem 0 4.25rem;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__atmosphere {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 55% 45% at 8% 15%, color-mix(in srgb, var(--colorPrimary, #6366F1) 18%, transparent), transparent 68%),
        radial-gradient(ellipse 45% 40% at 92% 85%, rgba(56, 189, 248, 0.14), transparent 62%),
        linear-gradient(165deg, #0f172a 0%, #1e293b 48%, #0b1220 100%);
}

.ui-site-shell #blog_part.ui-home-blog .container {
    position: relative;
    z-index: 1;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__header {
    margin-bottom: 1.85rem;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__heading {
    margin-bottom: 0;
    text-align: left;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__eyebrow {
    margin: 0 0 0.45rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 72%, #fff);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__heading h2 {
    margin-bottom: 0.5rem;
    color: #fff;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__heading h2::before,
.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__heading h2::after {
    display: none;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__heading p {
    margin: 0;
    max-width: 36rem;
    color: rgba(248, 250, 252, 0.72);
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__actions {
    display: flex;
    justify-content: flex-end;
    padding-bottom: 0.25rem;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.7rem 1.15rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    font-size: 0.92rem;
    font-weight: 650;
    transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog__cta {
        -webkit-backdrop-filter: blur(10px) saturate(1.15);
        backdrop-filter: blur(10px) saturate(1.15);
    }
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__cta i {
    font-size: 0.75rem;
    transition: transform 180ms ease;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__cta:hover,
.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__cta:focus-visible {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 90%, #fff);
    border-color: transparent;
    color: #fff;
    outline: none;
    transform: translateY(-2px);
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__cta:hover i,
.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__cta:focus-visible i {
    transform: translateX(3px);
}

/* Featured story */
.ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-feature {
    position: relative;
    height: 100%;
    min-height: 520px;
    margin-top: 0;
    border-radius: 28px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: #111827;
    box-shadow: 0 28px 60px rgba(0, 0, 0, 0.35);
    transition: transform 240ms ease, box-shadow 240ms ease;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature__media {
    position: absolute;
    inset: 0;
    display: block;
    max-height: none;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.03);
    transition: transform 500ms ease;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature__veil {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(15, 23, 42, 0.1) 0%, rgba(15, 23, 42, 0.25) 35%, rgba(15, 23, 42, 0.88) 100%);
    pointer-events: none;
}

.ui-site-shell #blog_part.ui-home-blog .text.ui-home-blog-feature__glass {
    position: absolute;
    left: 1.1rem;
    right: 1.1rem;
    bottom: 1.1rem;
    z-index: 2;
    padding: 1.25rem 1.3rem 1.2rem;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(15, 23, 42, 0.42);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.28);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell #blog_part.ui-home-blog .text.ui-home-blog-feature__glass {
        -webkit-backdrop-filter: blur(16px) saturate(1.25);
        backdrop-filter: blur(16px) saturate(1.25);
        background: rgba(15, 23, 42, 0.38);
    }
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature__category {
    display: inline-flex;
    margin-bottom: 0.65rem;
    padding: 0.28rem 0.7rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 78%, #fff);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature__category:hover,
.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature__category:focus-visible {
    filter: brightness(1.08);
    color: #fff;
    outline: none;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem 1rem;
    margin-bottom: 0.55rem;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature__meta span,
.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card__meta span {
    margin: 0;
    color: rgba(248, 250, 252, 0.78);
    font-size: 0.82rem;
    font-weight: 500;
    text-transform: none;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature__meta span i,
.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card__meta span i {
    margin-right: 0.3rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 75%, #fff);
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature .title {
    margin: 0 0 0.45rem;
    color: #fff;
    font-size: clamp(1.35rem, 1.1rem + 1vw, 1.85rem);
    font-weight: 750;
    letter-spacing: -0.02em;
    line-height: 1.25;
    -webkit-line-clamp: 3;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature .title:hover,
.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature .title:focus-visible {
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 55%, #fff);
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature p {
    margin: 0 0 1rem;
    color: rgba(248, 250, 252, 0.78);
    font-size: 0.95rem;
    line-height: 1.55;
    -webkit-line-clamp: 2;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature .read_btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    width: auto;
    padding: 0.65rem 1rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    font-size: 0.88rem;
    font-weight: 700;
    text-transform: none;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature .read_btn::after {
    display: none;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature .read_btn i {
    font-size: 0.72rem;
    transition: transform 180ms ease;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature .read_btn:hover,
.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature .read_btn:focus-visible {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 90%, #fff);
    border-color: transparent;
    color: #fff;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature .read_btn:hover i,
.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature .read_btn:focus-visible i {
    transform: translateX(3px);
}

.ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-feature:hover {
    transform: translateY(-4px);
    box-shadow: 0 34px 70px rgba(0, 0, 0, 0.42);
}

.ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-feature:hover .ui-home-blog-feature__media img {
    transform: scale(1.08);
}

/* Side rail cards */
.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__rail {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    height: 100%;
}

.ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-card {
    display: grid;
    grid-template-columns: 132px 1fr;
    gap: 0;
    flex: 1 1 0;
    min-height: 0;
    margin-top: 0;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.08);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 18px 40px rgba(0, 0, 0, 0.22);
    transition: transform 220ms ease, border-color 220ms ease, background-color 220ms ease;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-card {
        -webkit-backdrop-filter: blur(14px) saturate(1.2);
        backdrop-filter: blur(14px) saturate(1.2);
    }
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card__media {
    display: block;
    max-height: none;
    height: 100%;
    min-height: 168px;
    overflow: hidden;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 420ms ease;
}

.ui-site-shell #blog_part.ui-home-blog .text.ui-home-blog-card__body {
    display: flex;
    flex-direction: column;
    padding: 1rem 1.05rem 1rem;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card__category {
    align-self: flex-start;
    margin-bottom: 0.45rem;
    padding: 0.18rem 0.55rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.1);
    color: rgba(248, 250, 252, 0.92);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card__category:hover,
.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card__category:focus-visible {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 85%, #fff);
    border-color: transparent;
    color: #fff;
    outline: none;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 0.75rem;
    margin-bottom: 0.35rem;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card .title {
    margin: 0 0 0.35rem;
    color: #fff;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.3;
    -webkit-line-clamp: 2;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card .title:hover,
.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card .title:focus-visible {
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 55%, #fff);
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card p {
    margin: 0 0 0.75rem;
    color: rgba(248, 250, 252, 0.7);
    font-size: 0.88rem;
    line-height: 1.45;
    -webkit-line-clamp: 2;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card .read_btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: auto;
    width: auto;
    padding: 0;
    border: 0;
    background: transparent;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 65%, #fff);
    font-size: 0.86rem;
    font-weight: 700;
    text-transform: none;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card .read_btn::after {
    display: none;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card .read_btn i {
    font-size: 0.7rem;
    transition: transform 180ms ease;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card .read_btn:hover,
.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card .read_btn:focus-visible {
    color: #fff;
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card .read_btn:hover i,
.ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card .read_btn:focus-visible i {
    transform: translateX(3px);
}

.ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-card:hover {
    transform: translateY(-3px);
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.12);
}

.ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-card:hover .ui-home-blog-card__media img {
    transform: scale(1.06);
}

.ui-site-shell #blog_part.ui-home-blog .ui-home-blog__empty {
    margin: 0.5rem auto 0;
    max-width: 30rem;
    padding: 1.25rem 1.1rem;
    border-radius: 16px;
    border: 1px dashed rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.06);
    color: rgba(248, 250, 252, 0.78);
    text-align: center;
}

@media (max-width: 991.98px) {
    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog__heading {
        text-align: center;
        margin-bottom: 1rem;
    }

    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog__heading p {
        margin-left: auto;
        margin-right: auto;
    }

    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog__actions {
        justify-content: center;
        margin-bottom: 0.35rem;
    }

    .ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-feature {
        min-height: 460px;
    }
}

@media (max-width: 767.98px) {
    .ui-site-shell #blog_part.ui-home-blog .blog_part_overlay.ui-home-blog__overlay {
        padding: 2.5rem 0 3rem;
    }

    .ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-feature {
        min-height: 420px;
    }

    .ui-site-shell #blog_part.ui-home-blog .text.ui-home-blog-feature__glass {
        left: 0.75rem;
        right: 0.75rem;
        bottom: 0.75rem;
        padding: 1.05rem 1rem;
    }

    .ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-card {
        grid-template-columns: 1fr;
    }

    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card__media {
        min-height: 180px;
        max-height: 200px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog__cta,
    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog__cta i,
    .ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-feature,
    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature__media img,
    .ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-card,
    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card__media img,
    .ui-site-shell #blog_part.ui-home-blog .read_btn i {
        transition: none !important;
    }

    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog__cta:hover,
    .ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-feature:hover,
    .ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-card:hover {
        transform: none;
    }

    .ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-feature:hover .ui-home-blog-feature__media img,
    .ui-site-shell #blog_part.ui-home-blog .single_blog.ui-home-blog-card:hover .ui-home-blog-card__media img {
        transform: none;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog__atmosphere {
        background: linear-gradient(165deg, #0f172a 0%, #1e293b 48%, #0b1220 100%);
    }

    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog__eyebrow {
        color: #f66542;
    }

    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog__cta:hover,
    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog__cta:focus-visible,
    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature__category,
    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature .read_btn:hover,
    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature .read_btn:focus-visible,
    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card__category:hover {
        background: #f66542;
    }

    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog-feature__meta span i,
    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card__meta span i,
    .ui-site-shell #blog_part.ui-home-blog .ui-home-blog-card .read_btn {
        color: #f66542;
    }
}

/* Listing cards (home + listings index) */
.ui-site-shell .ui-listing-card,
.ui-site-shell .wsus__featured_single.ui-listing-card {
    background: var(--ui-color-surface, #ffffff);
    border: 1px solid var(--ui-color-border, rgba(15, 23, 42, 0.08));
    border-radius: var(--ui-radius-md, 16px);
    overflow: hidden;
    box-shadow: var(--ui-shadow-soft, 0 14px 34px rgba(15, 23, 42, 0.06));
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.ui-site-shell .ui-listing-card:hover {
    transform: translateY(-3px);
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 25%, transparent);
    box-shadow: 0 20px 44px rgba(15, 23, 42, 0.12);
}

/* Media frame: ratio + cover only on listing card photos */
.ui-site-shell .ui-listing-card .wsus__featured_single_img {
    aspect-ratio: 16 / 11;
    overflow: hidden;
    background: color-mix(in srgb, var(--ui-color-muted, #6b7280) 18%, var(--ui-color-surface, #ffffff));
}

.ui-site-shell .ui-listing-card .wsus__featured_single_img > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ui-site-shell .ui-listing-card .wsus__featured_single_text {
    padding: 1rem 1.05rem 1.15rem;
}

.ui-site-shell .ui-listing-card .wsus__featured_single_text > a {
    color: var(--ui-color-text, #0f172a);
    font-weight: 700;
    font-size: 1.05rem;
    line-height: 1.35;
}

.ui-site-shell .ui-listing-card .wsus__featured_single_text > a:hover,
.ui-site-shell .ui-listing-card .wsus__featured_single_text > a:focus-visible {
    color: var(--colorPrimary, #6366F1);
}

.ui-site-shell .ui-listing-card .wsus__featured_single_text > a:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-listing-card .address {
    color: var(--ui-color-muted, #6b7280);
    font-size: 0.9rem;
}

.ui-site-shell .ui-listing-card .list_rating {
    color: #f59e0b; /* semantic rating accent */
    margin-bottom: 0.35rem;
}

.ui-site-shell .ui-listing-card .list_rating > span:not([aria-hidden="true"]) {
    color: var(--ui-color-muted, #6b7280);
}

.ui-site-shell .ui-listing-card .map:focus-visible,
.ui-site-shell .ui-listing-card .love:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}

/* -------------------------------------------------------------------------- */
/* Listings index ? discovery glass layout                                     */
/* -------------------------------------------------------------------------- */

.ui-site-shell .ui-listings-shell #breadcrumb_part.ui-page-hero {
    margin-bottom: 0;
}

.ui-site-shell .ui-listings-page {
    position: relative;
    overflow: hidden;
    padding-top: 0;
    padding-bottom: 3.75rem;
}

.ui-site-shell .ui-listings-page__atmosphere {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 50% 40% at 10% 8%, color-mix(in srgb, var(--colorPrimary, #6366F1) 12%, transparent), transparent 70%),
        radial-gradient(ellipse 40% 35% at 94% 90%, rgba(14, 165, 233, 0.1), transparent 65%),
        linear-gradient(180deg, #f8fafc 0%, #eef2f7 50%, #f8fafc 100%);
}

.ui-site-shell .ui-listings-page > .container {
    position: relative;
    z-index: 1;
    padding-top: 2.75rem;
}

.ui-site-shell .ui-listings-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem 1.25rem;
    margin-bottom: 1.5rem;
    padding: 1.25rem 1.35rem;
    border-radius: 22px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.06);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell .ui-listings-toolbar {
        -webkit-backdrop-filter: blur(12px) saturate(1.15);
        backdrop-filter: blur(12px) saturate(1.15);
    }
}

.ui-site-shell .ui-listings-toolbar__eyebrow {
    margin: 0 0 0.35rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 85%, #0f172a);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ui-site-shell .ui-listings-toolbar__title {
    margin: 0 0 0.35rem;
    color: #0f172a;
    font-size: clamp(1.45rem, 1.2rem + 1vw, 1.9rem);
    font-weight: 800;
    letter-spacing: -0.025em;
    line-height: 1.15;
}

.ui-site-shell .ui-listings-toolbar__subtitle {
    margin: 0;
    color: #64748b;
    font-size: 0.95rem;
}

.ui-site-shell .ui-listings-toolbar__count {
    display: inline-block;
    margin-right: 0.25rem;
    padding: 0.12rem 0.55rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 10%, #fff);
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 85%, #0f172a);
    font-size: 0.78rem;
    font-weight: 700;
}

.ui-site-shell .ui-listings-toolbar__clear {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.65rem 1rem;
    border-radius: 999px;
    border: 1px solid rgba(15, 23, 42, 0.12);
    background: #fff;
    color: #0f172a;
    font-size: 0.88rem;
    font-weight: 650;
    text-decoration: none;
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

.ui-site-shell .ui-listings-toolbar__clear:hover,
.ui-site-shell .ui-listings-toolbar__clear:focus-visible {
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent);
    color: var(--colorPrimary, #6366F1);
    outline: none;
}

.ui-site-shell .ui-listings-filters {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 22px;
    padding: 1.35rem 1.2rem 1.25rem;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.07);
    position: sticky;
    top: var(--ui-chrome-nav-offset, 96px);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell .ui-listings-filters {
        background: rgba(255, 255, 255, 0.78);
        -webkit-backdrop-filter: blur(14px) saturate(1.15);
        backdrop-filter: blur(14px) saturate(1.15);
    }
}

.ui-site-shell .ui-listings-filters__head {
    margin-bottom: 1.15rem;
    padding-bottom: 0.95rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.ui-site-shell .ui-listings-filters__head h3 {
    margin: 0 0 0.25rem;
    color: #0f172a;
    font-size: 1.05rem;
    font-weight: 750;
}

.ui-site-shell .ui-listings-filters__head p {
    margin: 0;
    color: #64748b;
    font-size: 0.88rem;
    line-height: 1.45;
}

.ui-site-shell .ui-listings-filters__field {
    margin-bottom: 0.95rem;
}

.ui-site-shell .ui-listings-filters__label {
    display: block;
    margin-bottom: 0.4rem;
    color: #334155;
    font-size: 0.82rem;
    font-weight: 700;
}

.ui-site-shell .ui-listings-filters .sidebar_line input,
.ui-site-shell .ui-listings-filters .sidebar_line_select .select2-container--default .select2-selection--single {
    border-radius: 14px !important;
    border-color: rgba(15, 23, 42, 0.12) !important;
    min-height: 46px !important;
}

.ui-site-shell .ui-listings-filters .sidebar_line input {
    width: 100%;
    padding: 0.75rem 0.95rem;
    color: #0f172a;
    background: #fff;
}

.ui-site-shell .ui-listings-filters .sidebar_line input:focus {
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 50%, #cbd5e1) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 16%, transparent);
    outline: none;
}

.ui-site-shell .ui-listings-filters__amenities {
    margin: 0.35rem 0 1.15rem;
}

.ui-site-shell .ui-listings-filters__checks {
    max-height: 220px;
    overflow: auto;
    padding: 0.55rem 0.35rem 0.55rem 0.15rem;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(248, 250, 252, 0.8);
}

.ui-site-shell .ui-listings-filters .form-check {
    margin: 0.15rem 0;
    padding-left: 1.75rem;
}

.ui-site-shell .ui-listings-filters .form-check-label {
    color: #334155;
    font-size: 0.9rem;
    font-weight: 500;
}

.ui-site-shell .ui-listings-filters input:focus-visible,
.ui-site-shell .ui-listings-filters .form-check-input:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-listings-filters .read_btn.ui-listings-filters__submit,
.ui-site-shell .ui-listings-filters .ui-listings-filters__submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    min-height: 48px;
    margin-top: 0.25rem;
    padding: 0.8rem 1.1rem;
    border: 0;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 92%, #fff);
    color: #fff;
    font-size: 0.92rem;
    font-weight: 700;
    text-transform: none;
    box-shadow: 0 12px 28px color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent);
    transition: transform 160ms ease, filter 160ms ease;
}

.ui-site-shell .ui-listings-filters .ui-listings-filters__submit:hover,
.ui-site-shell .ui-listings-filters .ui-listings-filters__submit:focus-visible {
    filter: brightness(1.04);
    transform: translateY(-2px);
    color: #fff;
    outline: none;
}

.ui-site-shell .ui-listings-page .ui-listing-card {
    margin: 0;
}

.ui-site-shell .ui-listings-empty {
    text-align: center;
    padding: 3rem 1.5rem;
    border-radius: 22px;
    border: 1px dashed rgba(15, 23, 42, 0.18);
    background: rgba(255, 255, 255, 0.78);
    color: #64748b;
}

.ui-site-shell .ui-listings-empty__title {
    margin: 0 0 0.5rem;
    color: #0f172a;
    font-size: 1.25rem;
    font-weight: 750;
}

.ui-site-shell .ui-listings-empty__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 1rem;
    padding: 0.7rem 1.2rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 92%, #fff);
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}

.ui-site-shell .ui-listings-empty__cta:hover,
.ui-site-shell .ui-listings-empty__cta:focus-visible {
    filter: brightness(1.05);
    color: #fff;
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-listings-page #pagination.ui-listings-pagination,
.ui-site-shell .ui-listings-page #pagination {
    margin-top: 1.75rem;
}

.ui-site-shell .ui-listings-page #pagination .pagination {
    justify-content: center;
    gap: 0.35rem;
    flex-wrap: wrap;
}

.ui-site-shell .ui-listings-page #pagination .page-link {
    border-radius: 12px;
    border-color: rgba(15, 23, 42, 0.1);
    color: #334155;
    font-weight: 650;
    background: rgba(255, 255, 255, 0.9);
}

.ui-site-shell .ui-listings-page #pagination .page-item.active .page-link {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 92%, #fff);
    border-color: transparent;
    color: #fff;
}

.ui-site-shell .ui-listings-page #pagination .page-link:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

@media (max-width: 991.98px) {
    .ui-site-shell .ui-listings-filters {
        position: static;
        margin-bottom: 0.5rem;
    }

    .ui-site-shell .ui-listings-toolbar {
        align-items: stretch;
    }

    .ui-site-shell .ui-home #wsus__banner.ui-home-hero {
        min-height: 0;
    }

    .ui-site-shell .ui-home #wsus__banner .wsus__banner_overlay {
        padding: 3rem 0 2.5rem;
    }

    .ui-site-shell .ui-home #wsus__category_slider.ui-category-marquee {
        margin-top: 1rem;
    }

    .ui-site-shell .ui-home .ui-category-marquee__shell::before,
    .ui-site-shell .ui-home .ui-category-marquee__shell::after {
        width: 40px;
    }

    .ui-site-shell .ui-home .wsus__category_single_slider.ui-category-chip {
        min-width: 148px;
        padding: 0.6rem 0.85rem 0.6rem 0.6rem;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-listings-page__atmosphere {
        background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 50%, #f8fafc 100%);
    }

    .ui-site-shell .ui-listings-toolbar__eyebrow,
    .ui-site-shell .ui-listings-toolbar__clear:hover {
        color: #f66542;
    }

    .ui-site-shell .ui-listings-filters .ui-listings-filters__submit,
    .ui-site-shell .ui-listings-empty__cta,
    .ui-site-shell .ui-listings-page #pagination .page-item.active .page-link {
        background: #f66542;
    }
}

/* -------------------------------------------------------------------------- */
/* Listing detail                                                              */
/* -------------------------------------------------------------------------- */

.ui-site-shell .ui-listing-detail {
    padding-top: 2.25rem;
    padding-bottom: 3.5rem;
}

.ui-site-shell .ui-listing-detail__main,
.ui-site-shell .ui-listing-detail__sidebar > .row > [class*="col-"] > div {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.07);
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

.ui-site-shell .ui-listing-detail__main {
    padding: 1.5rem;
}

.ui-site-shell .ui-listing-detail .listing_det_header {
    padding-bottom: 1.25rem;
    margin-bottom: 1.25rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.ui-site-shell .ui-listing-detail .listing_det_header_text .listing_det_header_title {
    margin: 0;
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    text-transform: capitalize;
    color: var(--ui-color-text, #0f172a);
}

.ui-site-shell .ui-listing-detail .listing_det_text {
    color: #334155;
    line-height: 1.7;
}

.ui-site-shell .ui-listing-detail .listing_det_feature_single,
.ui-site-shell .ui-listing-detail .listing_det_Photo a,
.ui-site-shell .ui-listing-detail .listing_det_video_img {
    border-radius: 14px;
    overflow: hidden;
}

/* Listing detail — photo mosaic */
.ui-site-shell .ui-listing-detail .listing_det_Photo.ui-listing-photos {
    margin-bottom: 1.85rem;
}

.ui-site-shell .ui-listing-detail .ui-listing-photos__head,
.ui-site-shell .ui-listing-detail .ui-listing-amenities__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.ui-site-shell .ui-listing-detail .ui-listing-photos__eyebrow,
.ui-site-shell .ui-listing-detail .ui-listing-amenities__eyebrow,
.ui-site-shell .ui-listing-detail .ui-listing-videos__eyebrow {
    margin: 0 0 0.2rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
}

.ui-site-shell .ui-listing-detail .ui-listing-photos__title,
.ui-site-shell .ui-listing-detail .ui-listing-amenities__title {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #0f172a;
}

.ui-site-shell .ui-listing-detail .ui-listing-photos__count,
.ui-site-shell .ui-listing-detail .ui-listing-amenities__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.65rem;
    height: 1.65rem;
    padding: 0 0.45rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 12%, #fff);
    color: var(--colorPrimary, #6366F1);
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1;
}

.ui-site-shell .ui-listing-detail .ui-listing-photos__mosaic {
    display: grid;
    gap: 0.75rem;
}

.ui-site-shell .ui-listing-detail .ui-listing-photos__mosaic.is-single {
    grid-template-columns: 1fr;
}

.ui-site-shell .ui-listing-detail .ui-listing-photos__mosaic.is-duo {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ui-site-shell .ui-listing-detail .ui-listing-photos__mosaic.is-bento {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-auto-rows: 118px;
}

.ui-site-shell .ui-listing-detail .ui-listing-photos__mosaic.is-bento .ui-listing-photo-tile.is-hero {
    grid-column: span 2;
    grid-row: span 2;
}

.ui-site-shell .ui-listing-detail .ui-listing-photo-tile {
    position: relative;
    display: block;
    margin-bottom: 0 !important;
    border-radius: 18px !important;
    overflow: hidden;
    background: #0f172a;
    min-height: 118px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.07);
    isolation: isolate;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.ui-site-shell .ui-listing-detail .ui-listing-photos__mosaic.is-single .ui-listing-photo-tile,
.ui-site-shell .ui-listing-detail .ui-listing-photos__mosaic.is-duo .ui-listing-photo-tile {
    aspect-ratio: 16 / 10;
    min-height: 0;
}

.ui-site-shell .ui-listing-detail .ui-listing-photos__mosaic.is-bento .ui-listing-photo-tile:not(.is-hero) {
    min-height: 0;
    height: 100%;
}

.ui-site-shell .ui-listing-detail .ui-listing-photo-tile__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.02);
    transition: transform 0.5s ease;
}

.ui-site-shell .ui-listing-detail .ui-listing-photo-tile .photo_overlay,
.ui-site-shell .ui-listing-detail .ui-listing-photo-tile__shade {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(160deg, rgba(15, 23, 42, 0.08) 0%, transparent 42%, rgba(15, 23, 42, 0.55) 100%);
    opacity: 0.85;
    transition: opacity 0.3s ease, background 0.3s ease;
    pointer-events: none;
}

.ui-site-shell .ui-listing-detail .ui-listing-photo-tile__action {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.55rem 0.85rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.96);
    color: #0f172a;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.22);
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.92;
    transition:
        opacity 0.28s ease,
        transform 0.28s ease;
    pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {
    .ui-site-shell .ui-listing-detail .ui-listing-photo-tile__action {
        transform: translate(-50%, -46%) scale(0.92);
        opacity: 0;
    }
}

.ui-site-shell .ui-listing-detail .ui-listing-photo-tile__action i {
    position: static !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
    border: 0 !important;
    opacity: 1 !important;
    transform: none !important;
    font-size: 0.9rem;
    color: inherit;
}

.ui-site-shell .ui-listing-detail .ui-listing-photo-tile__badge {
    position: absolute;
    top: 0.75rem;
    left: 0.75rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.5);
    color: #f8fafc;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    backdrop-filter: blur(8px);
    pointer-events: none;
}

.ui-site-shell .ui-listing-detail .ui-listing-photo-tile:hover,
.ui-site-shell .ui-listing-detail .ui-listing-photo-tile:focus-visible {
    transform: translateY(-3px);
    box-shadow: 0 18px 36px rgba(15, 23, 42, 0.16);
}

.ui-site-shell .ui-listing-detail .ui-listing-photo-tile:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 55%, transparent);
    outline-offset: 3px;
}

.ui-site-shell .ui-listing-detail .ui-listing-photo-tile:hover .ui-listing-photo-tile__img,
.ui-site-shell .ui-listing-detail .ui-listing-photo-tile:focus-visible .ui-listing-photo-tile__img {
    transform: scale(1.07);
}

.ui-site-shell .ui-listing-detail .ui-listing-photo-tile:hover .ui-listing-photo-tile__shade,
.ui-site-shell .ui-listing-detail .ui-listing-photo-tile:focus-visible .ui-listing-photo-tile__shade {
    opacity: 1;
    background:
        linear-gradient(160deg, rgba(15, 23, 42, 0.18) 0%, rgba(15, 23, 42, 0.2) 40%, rgba(15, 23, 42, 0.7) 100%);
}

.ui-site-shell .ui-listing-detail .ui-listing-photo-tile:hover .ui-listing-photo-tile__action,
.ui-site-shell .ui-listing-detail .ui-listing-photo-tile:focus-visible .ui-listing-photo-tile__action {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}

/* Listing detail — amenities */
.ui-site-shell .ui-listing-detail .listing_det_feature.ui-listing-amenities {
    margin-bottom: 1.85rem;
    padding: 1.15rem 1.15rem 1.25rem;
    border-radius: 20px;
    background:
        radial-gradient(circle at top right, color-mix(in srgb, var(--colorPrimary, #6366F1) 10%, transparent), transparent 45%),
        linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
    border: 1px solid rgba(15, 23, 42, 0.06);
}

.ui-site-shell .ui-listing-detail .ui-listing-amenities__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.ui-site-shell .ui-listing-detail .ui-listing-amenity.listing_det_feature_single {
    margin-bottom: 0;
    padding: 0.85rem 0.95rem;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.03);
    text-align: left;
    gap: 0.75rem;
    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}

.ui-site-shell .ui-listing-detail .ui-listing-amenity__icon {
    flex: 0 0 auto;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 12%, #fff);
    color: var(--colorPrimary, #6366F1);
}

.ui-site-shell .ui-listing-detail .ui-listing-amenity__icon i {
    width: auto;
    height: auto;
    line-height: 1;
    margin: 0;
    padding: 0;
    border: 0;
    color: inherit;
    font-size: 0.95rem;
}

.ui-site-shell .ui-listing-detail .ui-listing-amenity__label,
.ui-site-shell .ui-listing-detail .ui-listing-amenity.listing_det_feature_single span.ui-listing-amenity__label {
    color: #0f172a;
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 1.3;
}

.ui-site-shell .ui-listing-detail .ui-listing-amenity:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, rgba(15, 23, 42, 0.08));
    box-shadow: 0 14px 28px rgba(15, 23, 42, 0.08);
}

@media (max-width: 991.98px) {
    .ui-site-shell .ui-listing-detail .ui-listing-photos__mosaic.is-bento {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: 140px;
    }

    .ui-site-shell .ui-listing-detail .ui-listing-amenities__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .ui-site-shell .ui-listing-detail .ui-listing-photos__mosaic.is-duo,
    .ui-site-shell .ui-listing-detail .ui-listing-photos__mosaic.is-bento {
        grid-template-columns: 1fr 1fr;
        grid-auto-rows: 110px;
    }

    .ui-site-shell .ui-listing-detail .ui-listing-photos__mosaic.is-bento .ui-listing-photo-tile.is-hero {
        grid-column: span 2;
        grid-row: span 1;
        min-height: 180px;
    }

    .ui-site-shell .ui-listing-detail .ui-listing-amenities {
        padding: 1rem;
    }

    .ui-site-shell .ui-listing-detail .ui-listing-amenities__grid {
        grid-template-columns: 1fr;
    }

    .ui-site-shell .ui-listing-detail .ui-listing-photo-tile__action span {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell .ui-listing-detail .ui-listing-photo-tile,
    .ui-site-shell .ui-listing-detail .ui-listing-photo-tile__img,
    .ui-site-shell .ui-listing-detail .ui-listing-photo-tile__action,
    .ui-site-shell .ui-listing-detail .ui-listing-photo-tile__shade,
    .ui-site-shell .ui-listing-detail .ui-listing-amenity {
        transition: none !important;
    }

    .ui-site-shell .ui-listing-detail .ui-listing-photo-tile:hover,
    .ui-site-shell .ui-listing-detail .ui-listing-amenity:hover {
        transform: none;
    }

    .ui-site-shell .ui-listing-detail .ui-listing-photo-tile:hover .ui-listing-photo-tile__img {
        transform: none;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-listing-detail .ui-listing-photos__count,
    .ui-site-shell .ui-listing-detail .ui-listing-amenities__count,
    .ui-site-shell .ui-listing-detail .ui-listing-amenity__icon {
        background: rgba(99, 102, 241, 0.12);
    }

    .ui-site-shell .ui-listing-detail .listing_det_feature.ui-listing-amenities {
        background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
    }

    .ui-site-shell .ui-listing-detail .ui-listing-amenity:hover {
        border-color: rgba(99, 102, 241, 0.28);
    }
}

/* Listing detail — video gallery */
.ui-site-shell .ui-listing-detail .listing_det_video.ui-listing-videos {
    margin-bottom: 1.75rem;
    padding-top: 0.25rem;
}

.ui-site-shell .ui-listing-detail .ui-listing-videos__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.ui-site-shell .ui-listing-detail .ui-listing-videos__title {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #0f172a;
}

.ui-site-shell .ui-listing-detail .ui-listing-videos__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.65rem;
    height: 1.65rem;
    padding: 0 0.45rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 12%, #fff);
    color: var(--colorPrimary, #6366F1);
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1;
}

.ui-site-shell .ui-listing-detail .ui-listing-videos__grid {
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 1rem;
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card {
    position: relative;
    margin-bottom: 0;
    border-radius: 16px;
    overflow: hidden;
    background: #0f172a;
    aspect-ratio: 16 / 9;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
    transition:
        transform 0.28s ease,
        box-shadow 0.28s ease;
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card__link {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    background: transparent;
    text-decoration: none;
    color: inherit;
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card__link:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 55%, transparent);
    outline-offset: 3px;
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card__thumb {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.01);
    transition: transform 0.45s ease;
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card__overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(15, 23, 42, 0.05) 0%, rgba(15, 23, 42, 0.2) 45%, rgba(15, 23, 42, 0.72) 100%);
    transition: background 0.3s ease;
    pointer-events: none;
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card__play {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.96);
    color: var(--colorPrimary, #6366F1);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.28);
    transform: translate(-50%, -50%) scale(1);
    transition:
        transform 0.28s ease,
        box-shadow 0.28s ease,
        background 0.28s ease,
        color 0.28s ease;
    pointer-events: none;
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card__play i {
    position: static;
    width: auto;
    height: auto;
    line-height: 1;
    margin-left: 0.12rem;
    font-size: 0.95rem;
    background: transparent;
    color: inherit;
    transform: none;
    border-radius: 0;
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card__play i::after {
    display: none;
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card__meta {
    position: absolute;
    left: 0.85rem;
    right: 0.85rem;
    bottom: 0.8rem;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    pointer-events: none;
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card__badge,
.ui-site-shell .ui-listing-detail .ui-listing-video-card__cta {
    display: inline-flex;
    align-items: center;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1;
    border-radius: 999px;
    padding: 0.4rem 0.65rem;
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card__badge {
    color: #e2e8f0;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(6px);
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card__cta {
    color: #fff;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 88%, #0f172a);
    opacity: 1;
    transform: none;
    transition:
        opacity 0.28s ease,
        transform 0.28s ease,
        background 0.28s ease;
}

@media (hover: hover) and (pointer: fine) {
    .ui-site-shell .ui-listing-detail .ui-listing-video-card__cta {
        opacity: 0;
        transform: translateY(6px);
    }
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card:hover,
.ui-site-shell .ui-listing-detail .ui-listing-video-card:focus-within {
    transform: translateY(-3px);
    box-shadow: 0 18px 36px rgba(15, 23, 42, 0.16);
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card:hover .ui-listing-video-card__thumb,
.ui-site-shell .ui-listing-detail .ui-listing-video-card:focus-within .ui-listing-video-card__thumb {
    transform: scale(1.06);
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card:hover .ui-listing-video-card__overlay,
.ui-site-shell .ui-listing-detail .ui-listing-video-card:focus-within .ui-listing-video-card__overlay {
    background:
        linear-gradient(180deg, rgba(15, 23, 42, 0.12) 0%, rgba(15, 23, 42, 0.35) 40%, rgba(15, 23, 42, 0.82) 100%);
}

.ui-site-shell .ui-listing-detail .ui-listing-video-card:hover .ui-listing-video-card__play,
.ui-site-shell .ui-listing-detail .ui-listing-video-card:focus-within .ui-listing-video-card__play {
    transform: translate(-50%, -50%) scale(1.08);
    background: var(--colorPrimary, #6366F1);
    color: #fff;
    box-shadow: 0 14px 32px color-mix(in srgb, var(--colorPrimary, #6366F1) 40%, transparent);
}

@media (hover: hover) and (pointer: fine) {
    .ui-site-shell .ui-listing-detail .ui-listing-video-card:hover .ui-listing-video-card__cta,
    .ui-site-shell .ui-listing-detail .ui-listing-video-card:focus-within .ui-listing-video-card__cta {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 575.98px) {
    .ui-site-shell .ui-listing-detail .ui-listing-video-card__play {
        width: 2.85rem;
        height: 2.85rem;
    }

    .ui-site-shell .ui-listing-detail .ui-listing-video-card__meta {
        left: 0.7rem;
        right: 0.7rem;
        bottom: 0.65rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell .ui-listing-detail .ui-listing-video-card,
    .ui-site-shell .ui-listing-detail .ui-listing-video-card__thumb,
    .ui-site-shell .ui-listing-detail .ui-listing-video-card__play,
    .ui-site-shell .ui-listing-detail .ui-listing-video-card__cta,
    .ui-site-shell .ui-listing-detail .ui-listing-video-card__overlay {
        transition: none !important;
    }

    .ui-site-shell .ui-listing-detail .ui-listing-video-card:hover,
    .ui-site-shell .ui-listing-detail .ui-listing-video-card:focus-within {
        transform: none;
    }

    .ui-site-shell .ui-listing-detail .ui-listing-video-card:hover .ui-listing-video-card__thumb,
    .ui-site-shell .ui-listing-detail .ui-listing-video-card:focus-within .ui-listing-video-card__thumb {
        transform: none;
    }

    .ui-site-shell .ui-listing-detail .ui-listing-video-card:hover .ui-listing-video-card__play,
    .ui-site-shell .ui-listing-detail .ui-listing-video-card:focus-within .ui-listing-video-card__play {
        transform: translate(-50%, -50%);
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-listing-detail .ui-listing-videos__count {
        background: rgba(99, 102, 241, 0.12);
    }

    .ui-site-shell .ui-listing-detail .ui-listing-video-card__cta {
        background: var(--colorPrimary, #6366F1);
    }

    .ui-site-shell .ui-listing-detail .ui-listing-video-card:hover .ui-listing-video-card__play,
    .ui-site-shell .ui-listing-detail .ui-listing-video-card:focus-within .ui-listing-video-card__play {
        box-shadow: 0 14px 32px rgba(99, 102, 241, 0.35);
    }
}

.ui-site-shell .ui-listing-detail__sidebar > .row > [class*="col-"] > div {
    padding: 1.25rem;
    margin-bottom: 1rem;
}

.ui-site-shell .ui-listing-detail .listing_det_side_address a,
.ui-site-shell .ui-listing-detail .listing_det_side_address p {
    color: #334155;
}

.ui-site-shell .ui-listing-detail .listing_det_side_address a:hover,
.ui-site-shell .ui-listing-detail .listing_det_side_address a:focus-visible {
    color: var(--colorPrimary, #6366F1);
}

.ui-site-shell .ui-listing-detail .listing_details_sidebar .read_btn,
.ui-site-shell .ui-listing-detail .input_comment .read_btn {
    border-radius: 999px;
    background: var(--colorPrimary, #6366F1);
    color: #fff;
    font-weight: 600;
    border: none;
    padding: 0.75rem 1.25rem;
}

.ui-site-shell .ui-listing-detail .listing_details_sidebar .read_btn:focus-visible,
.ui-site-shell .ui-listing-detail .input_comment .read_btn:focus-visible,
.ui-site-shell .ui-listing-detail .favorite-toggle:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-listing-detail .wsus__single_comment {
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    padding: 1rem;
    background: #f8fafc;
}

.ui-site-shell .ui-listing-detail .alert {
    border-radius: 12px;
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-home-search-panel .read_btn,
    .ui-site-shell .ui-listings-filters .read_btn {
        box-shadow: 0 12px 28px rgba(15, 23, 42, 0.15);
    }

    .ui-site-shell .ui-home .wsus__category_single_slider.ui-category-chip:hover,
    .ui-site-shell .ui-listing-card:hover {
        background: #fff;
        border-color: rgba(246, 101, 66, 0.35);
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell .ui-home .ui-category-marquee__track--left .ui-category-marquee__rail,
    .ui-site-shell .ui-home .ui-category-marquee__track--right .ui-category-marquee__rail {
        animation: none !important;
        transform: none !important;
        flex-wrap: wrap;
        width: 100%;
        justify-content: center;
        padding: 0 1rem;
    }

    .ui-site-shell .ui-home .ui-category-marquee__shell::before,
    .ui-site-shell .ui-home .ui-category-marquee__shell::after {
        display: none;
    }
}

/* ========================================================================== */
/* Phase 2C ? authenticated user dashboard (presentation only)                 */
/* Scope: .ui-site-shell + #dashboard / .ui-user-*                              */
/* Does not alter public homepage/listings chrome beyond shared #dashboard.    */
/* ========================================================================== */

.ui-site-shell #dashboard.ui-user-dashboard {
    --ui-dashboard-sidebar-width: 16.5rem;
    --ui-dashboard-header-height: var(--ui-chrome-nav-offset, 96px);
    padding: 2rem 0 3.5rem;
}

.ui-site-shell .ui-user-dashboard__workspace,
.ui-site-shell #dashboard .dashboard_content.ui-user-dashboard__workspace {
    background: transparent;
}

/* Sidebar */
.ui-site-shell .dashboard_sidebar.ui-user-sidebar {
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
    padding: 1.25rem 1rem 1.5rem;
    overflow: hidden;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell .dashboard_sidebar.ui-user-sidebar {
        background: rgba(255, 255, 255, 0.82);
        -webkit-backdrop-filter: blur(12px);
        backdrop-filter: blur(12px);
    }
}

.ui-site-shell .ui-user-sidebar .dash_logo {
    display: block;
    width: 72px;
    height: 72px;
    margin: 0.25rem auto 1.25rem;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 25%, #fff);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
}

.ui-site-shell .ui-user-sidebar .dash_logo img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.ui-site-shell .ui-user-sidebar .close_icon {
    border-radius: 10px;
}

.ui-site-shell .ui-user-sidebar .close_icon:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-user-sidebar .dashboard_link {
    padding: 0;
    margin: 0;
}

.ui-site-shell .ui-user-sidebar .dashboard_link li {
    margin: 0.2rem 0;
}

.ui-site-shell .ui-user-sidebar .dashboard_link a.ui-sidebar-link,
.ui-site-shell .ui-user-sidebar .dashboard_link a {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    width: 100%;
    padding: 0.7rem 0.85rem;
    margin: 0;
    border-radius: 12px;
    border: 1px solid transparent;
    color: #334155;
    font-weight: 600;
    font-size: 0.92rem;
    background: transparent;
    line-height: 1.3;
    text-decoration: none;
    transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease;
}

.ui-site-shell .ui-user-sidebar .dashboard_link a i {
    width: 1.15rem;
    text-align: center;
    color: #64748b;
}

.ui-site-shell .ui-user-sidebar .dashboard_link a:hover,
.ui-site-shell .ui-user-sidebar .dashboard_link a:focus-visible {
    color: var(--colorPrimary, #6366F1);
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 8%, #fff);
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 18%, transparent);
    outline: none;
}

.ui-site-shell .ui-user-sidebar .dashboard_link a:focus-visible {
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--colorPrimary, #6366F1) 30%, transparent);
}

.ui-site-shell .ui-user-sidebar .dashboard_link a.active,
.ui-site-shell .ui-user-sidebar .dashboard_link a.ui-sidebar-link.active {
    color: var(--colorPrimary, #6366F1);
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 12%, #fff);
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 22%, transparent);
}

.ui-site-shell .ui-user-sidebar .dashboard_link a.active i,
.ui-site-shell .ui-user-sidebar .dashboard_link a:hover i {
    color: var(--colorPrimary, #6366F1);
}

/* Workspace panels / stats */
.ui-site-shell .ui-user-dashboard__panel,
.ui-site-shell #dashboard.ui-user-dashboard .subscription-overview-card,
.ui-site-shell #dashboard.ui-user-dashboard .active_package {
    background: #fff !important;
    border: 1px solid rgba(15, 23, 42, 0.07) !important;
    border-radius: 18px !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
    overflow: hidden;
}

.ui-site-shell #dashboard.ui-user-dashboard .subscription-overview-card .card-body {
    padding: 1.5rem !important;
}

.ui-site-shell #dashboard.ui-user-dashboard .subscription-overview-card h4,
.ui-site-shell #dashboard.ui-user-dashboard .active_package h4,
.ui-site-shell #dashboard.ui-user-dashboard .my_listing > h4 {
    color: #0f172a;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-dashboard__badge {
    border-radius: 999px;
    font-weight: 600;
}

.ui-site-shell #dashboard.ui-user-dashboard .manage_dashboard_single.ui-user-stat-card {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.07);
    border-radius: 18px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
    padding: 1.35rem 1.15rem;
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.ui-site-shell #dashboard.ui-user-dashboard .manage_dashboard_single.ui-user-stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.09);
}

.ui-site-shell #dashboard.ui-user-dashboard .manage_dashboard_single.ui-user-stat-card h3 {
    color: #0f172a;
    font-weight: 700;
}

.ui-site-shell #dashboard.ui-user-dashboard .manage_dashboard_single.ui-user-stat-card p {
    color: #64748b;
    text-transform: capitalize;
}

.ui-site-shell #dashboard.ui-user-dashboard .manage_dashboard_single.ui-user-stat-card i {
    color: var(--colorPrimary, #6366F1);
}

.ui-site-shell #dashboard.ui-user-dashboard .manage_dashboard_single.green.ui-user-stat-card i {
    color: #10b981;
}

.ui-site-shell #dashboard.ui-user-dashboard .manage_dashboard_single.orange.ui-user-stat-card i {
    color: #f59e0b;
}

.ui-site-shell #dashboard.ui-user-dashboard .manage_dashboard_single.red.ui-user-stat-card i {
    color: #f43f5e;
}

.ui-site-shell #dashboard.ui-user-dashboard .dashboard_table {
    margin-bottom: 0;
}

.ui-site-shell #dashboard.ui-user-dashboard .dashboard_table td {
    border-color: rgba(15, 23, 42, 0.06);
    color: #334155;
    padding: 0.85rem 0.75rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .btn-primary {
    background: var(--colorPrimary, #6366F1);
    border-color: var(--colorPrimary, #6366F1);
    border-radius: 999px;
    font-weight: 600;
    padding: 0.55rem 1.15rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .btn-outline-secondary {
    border-radius: 999px;
    font-weight: 600;
    padding: 0.55rem 1.15rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .btn-primary:focus-visible,
.ui-site-shell #dashboard.ui-user-dashboard .btn-outline-secondary:focus-visible,
.ui-site-shell #dashboard.ui-user-dashboard .btn-success:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

/* Listings index / DataTables shell */
.ui-site-shell #dashboard.ui-user-dashboard .my_listing.ui-user-listings,
.ui-site-shell #dashboard.ui-user-dashboard .my_listing.ui-user-form {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.07);
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
    padding: 1.35rem 1.35rem 1.5rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .my_listing > h4 {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.ui-site-shell #dashboard.ui-user-dashboard .my_listing .btn-success {
    border-radius: 999px;
    font-weight: 600;
    background: #10b981;
    border-color: #10b981;
}

.ui-site-shell #dashboard.ui-user-dashboard .my_listing .table,
.ui-site-shell #dashboard.ui-user-dashboard .dataTables_wrapper {
    width: 100% !important;
}

.ui-site-shell #dashboard.ui-user-dashboard .my_listing .table thead,
.ui-site-shell #dashboard.ui-user-dashboard .dataTables_wrapper table.dataTable thead {
    background: #f8fafc;
}

.ui-site-shell #dashboard.ui-user-dashboard .my_listing .table thead th,
.ui-site-shell #dashboard.ui-user-dashboard .dataTables_wrapper table.dataTable thead th {
    color: #475569;
    font-weight: 700;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08) !important;
}

.ui-site-shell #dashboard.ui-user-dashboard .my_listing .table td,
.ui-site-shell #dashboard.ui-user-dashboard .dataTables_wrapper table.dataTable td {
    color: #334155;
    vertical-align: middle;
    border-color: rgba(15, 23, 42, 0.06) !important;
}

.ui-site-shell #dashboard.ui-user-dashboard .my_listing .table-responsive,
.ui-site-shell #dashboard.ui-user-dashboard .dataTables_wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -webkit-overflow-scrolling: touch;
}

.ui-site-shell #dashboard.ui-user-dashboard .badge,
.ui-site-shell #dashboard.ui-user-dashboard .dataTables_wrapper .badge {
    border-radius: 999px;
    font-weight: 600;
}

.ui-site-shell #dashboard.ui-user-dashboard .delete-item:focus-visible,
.ui-site-shell #dashboard.ui-user-dashboard .dataTables_wrapper a:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

/* My Listings — Actions toolbar + dropdown */
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions-col {
    white-space: nowrap;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.35rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.1rem;
    height: 2.1rem;
    padding: 0 0.55rem;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 9px;
    background: #fff;
    color: #334155;
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__btn:hover,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__btn:focus-visible {
    color: #0f172a;
    background: #f8fafc;
    border-color: rgba(15, 23, 42, 0.16);
    outline: none;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__btn:focus-visible {
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--colorPrimary, #0f766e) 28%, transparent);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__btn.is-danger {
    color: #b91c1c;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__btn.is-danger:hover,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__btn.is-danger:focus-visible {
    color: #991b1b;
    background: #fef2f2;
    border-color: rgba(185, 28, 28, 0.28);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__toggle {
    gap: 0.35rem;
    min-width: auto;
    padding: 0 0.7rem;
    color: #134e4a;
    background: #f0fdfa;
    border-color: rgba(15, 118, 110, 0.22);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__toggle::after {
    margin-left: 0.15rem;
    vertical-align: 0.12em;
    opacity: 0.7;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__toggle:hover,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__toggle:focus-visible,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__toggle.show {
    color: #115e59;
    background: #ccfbf1;
    border-color: rgba(15, 118, 110, 0.35);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__toggle-label {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__menu {
    min-width: 16.5rem;
    padding: 0.4rem 0;
    margin-top: 0.35rem !important;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.12);
    z-index: 1080;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__heading {
    margin: 0;
    padding: 0.45rem 0.95rem 0.35rem;
    color: #64748b;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__menu .dropdown-divider {
    margin: 0.35rem 0;
    border-color: rgba(15, 23, 42, 0.08);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__item {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    padding: 0.55rem 0.95rem;
    color: #0f172a;
    white-space: normal;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__item:hover,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__item:focus {
    color: #0f172a;
    background: #f8fafc;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__item-icon {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 1.85rem;
    height: 1.85rem;
    margin-top: 0.05rem;
    border-radius: 8px;
    color: #0f766e;
    background: rgba(15, 118, 110, 0.1);
    font-size: 0.78rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__item-copy {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    text-align: left;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__item-label {
    font-size: 0.84rem;
    font-weight: 600;
    line-height: 1.25;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__item-hint {
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 500;
    line-height: 1.3;
}

/* Keep Actions menus from being clipped by the table scroll shell */
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .dataTables_wrapper {
    overflow: visible;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings table.dataTable {
    overflow: visible;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .dataTables_wrapper .row:has(.dataTables_paginate) {
    overflow: visible;
}

@media (max-width: 767.98px) {
    .ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__toggle-label {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__toggle {
        min-width: 2.1rem;
        padding: 0 0.55rem;
    }

    .ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__toggle::after {
        margin-left: 0;
    }

    .ui-site-shell #dashboard.ui-user-dashboard .ui-user-listings .ui-listing-actions__menu {
        min-width: 15rem;
    }
}

/* Create listing — plan entitlement summary */
.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary {
    margin: 0 0 1.35rem;
    padding: 1rem 1.1rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px;
    background: #f8fafc;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.85rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__eyebrow {
    margin: 0;
    color: #64748b;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__title {
    margin: 0.15rem 0 0;
    color: #0f172a;
    font-size: 1.05rem;
    font-weight: 700;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__link {
    color: #475569;
    font-size: 0.85rem;
    font-weight: 600;
    white-space: nowrap;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__grid {
    list-style: none;
    margin: 0 0 0.9rem;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem 1rem;
}

@media (min-width: 768px) {
    .ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__label {
    display: block;
    color: #64748b;
    font-size: 0.75rem;
    font-weight: 600;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__grid strong {
    color: #1e293b;
    font-size: 0.9rem;
    font-weight: 700;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__chip {
    display: inline-flex;
    align-items: center;
    padding: 0.28rem 0.6rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    border: 1px solid transparent;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__chip.is-on {
    color: #065f46;
    background: #ecfdf5;
    border-color: #a7f3d0;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__chip.is-off {
    color: #64748b;
    background: #fff;
    border-color: rgba(15, 23, 42, 0.1);
    text-decoration: line-through;
    opacity: 0.75;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__next {
    display: flex;
    gap: 0.85rem;
    margin-top: 1rem;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-left: 3px solid #0f766e;
    border-radius: 12px;
    background: linear-gradient(180deg, #f0fdfa 0%, #f8fafc 100%);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__next-icon {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 2.15rem;
    height: 2.15rem;
    border-radius: 10px;
    color: #0f766e;
    background: rgba(15, 118, 110, 0.1);
    font-size: 0.95rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__next-body {
    min-width: 0;
    flex: 1 1 auto;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__next-title {
    margin: 0 0 0.25rem;
    color: #134e4a;
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1.3;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__next-text {
    margin: 0 0 0.55rem;
    color: #475569;
    font-size: 0.8rem;
    line-height: 1.45;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__next-tools {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    list-style: none;
    margin: 0 0 0.65rem;
    padding: 0;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__next-tools li {
    display: inline-flex;
    align-items: center;
    padding: 0.22rem 0.55rem;
    border-radius: 6px;
    border: 1px solid rgba(15, 118, 110, 0.18);
    background: #fff;
    color: #115e59;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.01em;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__next-path {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem 0.65rem;
    margin: 0;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__next-path-label {
    color: #64748b;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__next-path-steps {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.2rem 0.55rem;
    border-radius: 6px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    color: #0f172a;
    font-size: 0.78rem;
    font-weight: 600;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__next-path-sep {
    color: #94a3b8;
    font-weight: 500;
}

@media (max-width: 575.98px) {
    .ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__next {
        gap: 0.7rem;
        padding: 0.8rem 0.85rem;
    }

    .ui-site-shell #dashboard.ui-user-dashboard .ui-plan-summary__next-icon {
        width: 1.9rem;
        height: 1.9rem;
        font-size: 0.85rem;
    }
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-form-section-title {
    margin: 1.25rem 0 0.75rem;
    padding-top: 0.85rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    color: #0f172a;
    font-size: 0.92rem;
    font-weight: 700;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-form-section-title:first-of-type {
    margin-top: 0.35rem;
}

/* Create / edit / profile forms */
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form .form-group,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form .my_listing_single {
    margin-bottom: 1rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form label {
    color: #334155;
    font-weight: 600;
    font-size: 0.9rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form .form-control,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form .my_listing_single input,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form .my_listing_single textarea {
    border-radius: 12px;
    border-color: rgba(15, 23, 42, 0.12);
    color: #0f172a;
    min-height: 44px;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form .form-control:focus,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form .my_listing_single input:focus,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form .my_listing_single textarea:focus {
    border-color: var(--colorPrimary, #6366F1);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 20%, transparent);
    outline: none;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form .image-preview {
    border-radius: 16px;
    border: 1px dashed rgba(15, 23, 42, 0.18);
    background: #f8fafc;
    overflow: hidden;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form .text-danger {
    font-weight: 700;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form .invalid-feedback {
    color: #e11d48;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form .read_btn,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form button[type="submit"] {
    border-radius: 999px;
    font-weight: 600;
    background: var(--colorPrimary, #6366F1);
    border: none;
    color: #fff;
    padding: 0.75rem 1.35rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form .read_btn:focus-visible,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form button[type="submit"]:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

/* Soften Summernote frame inside dashboard forms without changing plugin hooks */
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-form .note-editor.note-frame {
    border-radius: 12px;
    border-color: rgba(15, 23, 42, 0.12);
    overflow: hidden;
}

@media (max-width: 991.98px) {
    .ui-site-shell #dashboard.ui-user-dashboard {
        padding-top: 1.25rem;
    }

    .ui-site-shell .dashboard_sidebar.ui-user-sidebar {
        border-radius: 0;
    }

    .ui-site-shell #dashboard.ui-user-dashboard .my_listing.ui-user-listings,
    .ui-site-shell #dashboard.ui-user-dashboard .my_listing.ui-user-form {
        padding: 1.1rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell .ui-user-sidebar .dashboard_link a,
    .ui-site-shell #dashboard.ui-user-dashboard .manage_dashboard_single.ui-user-stat-card {
        transition: none !important;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-user-sidebar .dashboard_link a:hover,
    .ui-site-shell .ui-user-sidebar .dashboard_link a.active {
        background: rgba(99, 102, 241, 0.1);
        border-color: rgba(99, 102, 241, 0.2);
    }
}

/* ========================================================================== */
/* Phase 2D ? authentication entry / recovery / verification (presentation)    */
/* Scope: .ui-site-shell .ui-auth-page only                                     */
/* Dual Login / Sign up panel lives under .ui-auth-gate                        */
/* ========================================================================== */

.ui-site-shell .ui-auth-page[x-cloak] {
    display: none !important;
}

.ui-site-shell .ui-auth-page {
    padding-bottom: 3rem;
}

.ui-site-shell .ui-auth-page #breadcrumb_part.ui-page-hero {
    margin-bottom: 0;
}

.ui-site-shell .ui-auth-page .wsus__login_page,
.ui-site-shell .ui-auth-page .ui-auth-stage {
    padding: 2.5rem 0 1rem;
}

.ui-site-shell .ui-auth-gate .ui-auth-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: 0;
    overflow: hidden;
    border-radius: calc(var(--ui-radius-md, 16px) + 12px);
    border: 1px solid var(--ui-color-border, rgba(15, 23, 42, 0.08));
    background: var(--ui-color-surface, #ffffff);
    box-shadow: var(--ui-shadow-soft, 0 14px 34px rgba(15, 23, 42, 0.06));
    min-height: 620px;
}

.ui-site-shell .ui-auth-gate .ui-auth-brand {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 2.75rem 2.5rem;
    color: #f8fafc;
    background:
        radial-gradient(ellipse 80% 60% at 20% 10%, color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent), transparent 60%),
        radial-gradient(ellipse 55% 45% at 90% 90%, rgba(255, 255, 255, 0.12), transparent 55%),
        linear-gradient(160deg, #111827 0%, #1f2937 48%, color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, #0f172a) 100%);
    overflow: hidden;
}

.ui-site-shell .ui-auth-gate .ui-auth-brand__glow {
    position: absolute;
    inset: auto -20% -25% auto;
    width: 280px;
    height: 280px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent);
    filter: blur(40px);
    pointer-events: none;
}

.ui-site-shell .ui-auth-gate .ui-auth-brand__logo {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    max-width: 240px;
    margin-bottom: 2rem;
    color: #fff;
    text-decoration: none;
    font-weight: 700;
    font-size: 1.25rem;
}

.ui-site-shell .ui-auth-gate .ui-auth-brand__logo img {
    max-height: 52px;
    width: auto;
    object-fit: contain;
}

.ui-site-shell .ui-auth-gate .ui-auth-brand__eyebrow {
    position: relative;
    z-index: 1;
    margin: 0 0 0.65rem;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(248, 250, 252, 0.72);
}

.ui-site-shell .ui-auth-gate .ui-auth-brand__title {
    position: relative;
    z-index: 1;
    margin: 0 0 0.85rem;
    color: #fff;
    font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.35rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.15;
    max-width: 16ch;
}

.ui-site-shell .ui-auth-gate .ui-auth-brand__copy {
    position: relative;
    z-index: 1;
    margin: 0 0 1.5rem;
    max-width: 30ch;
    color: rgba(248, 250, 252, 0.82);
    font-size: 1rem;
    line-height: 1.6;
}

.ui-site-shell .ui-auth-gate .ui-auth-brand__points {
    position: relative;
    z-index: 1;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ui-site-shell .ui-auth-gate .ui-auth-brand__points li {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-top: 0.7rem;
    color: rgba(248, 250, 252, 0.9);
    font-size: 0.92rem;
    font-weight: 500;
}

.ui-site-shell .ui-auth-gate .ui-auth-brand__points i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.35rem;
    height: 1.35rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    font-size: 0.65rem;
}

.ui-site-shell .ui-auth-page .wsus__login_area.ui-auth-card {
    background: color-mix(in srgb, var(--ui-color-surface, #ffffff) 96%, transparent);
    border: 1px solid var(--ui-color-border, rgba(15, 23, 42, 0.08));
    border-radius: calc(var(--ui-radius-md, 16px) + 4px);
    box-shadow: var(--ui-shadow-soft, 0 14px 34px rgba(15, 23, 42, 0.06));
    padding: 2rem 1.75rem 1.75rem;
    position: relative;
    color: var(--ui-color-text, #0f172a);
}

.ui-site-shell .ui-auth-recovery .wsus__login_page {
    padding-top: 2.75rem;
}

.ui-site-shell .ui-auth-recovery .ui-auth-card .ui-auth-card__subtitle {
    margin-bottom: 0.65rem;
}

.ui-site-shell .ui-auth-gate .ui-auth-panel.ui-auth-card {
    background: rgba(255, 255, 255, 0.98);
    border: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 2.25rem 2rem 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell .ui-auth-page .wsus__login_area.ui-auth-card {
        background: rgba(255, 255, 255, 0.88);
        -webkit-backdrop-filter: blur(14px) saturate(1.1);
        backdrop-filter: blur(14px) saturate(1.1);
    }

    .ui-site-shell .ui-auth-gate .ui-auth-panel.ui-auth-card {
        background: rgba(255, 255, 255, 0.98);
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }
}

.ui-site-shell .ui-auth-gate .ui-auth-switch {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.25rem;
    margin-bottom: 1.5rem;
    padding: 0.3rem;
    border-radius: 999px;
    background: #f1f5f9;
    border: 1px solid rgba(15, 23, 42, 0.06);
}

.ui-site-shell .ui-auth-gate .ui-auth-switch__thumb {
    position: absolute;
    top: 0.3rem;
    bottom: 0.3rem;
    left: 0.3rem;
    width: calc(50% - 0.425rem);
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.1);
    transition: left 220ms ease;
    z-index: 0;
}

.ui-site-shell .ui-auth-gate .ui-auth-switch__thumb.is-register {
    left: calc(50% + 0.125rem);
}

.ui-site-shell .ui-auth-gate .ui-auth-switch__btn {
    position: relative;
    z-index: 1;
    border: 0;
    background: transparent;
    border-radius: 999px;
    padding: 0.7rem 0.85rem;
    color: #64748b;
    font-size: 0.92rem;
    font-weight: 700;
    line-height: 1.2;
    transition: color 160ms ease;
}

.ui-site-shell .ui-auth-gate .ui-auth-switch__btn.is-active {
    color: #0f172a;
}

.ui-site-shell .ui-auth-gate .ui-auth-switch__btn:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-auth-gate .ui-auth-panel__pane .ui-auth-panel__title,
.ui-site-shell .ui-auth-gate .ui-auth-panel__pane h1,
.ui-site-shell .ui-auth-page .ui-auth-card h2,
.ui-site-shell .ui-auth-page .ui-auth-card .ui-auth-card__subtitle {
    color: var(--ui-color-text, #0f172a);
    font-weight: 700;
    letter-spacing: -0.02em;
    font-size: clamp(1.35rem, 1.15rem + 0.8vw, 1.7rem);
    margin-bottom: 0.35rem;
}

.ui-site-shell .ui-auth-gate .ui-auth-panel__pane > p,
.ui-site-shell .ui-auth-page .ui-auth-card > p {
    color: var(--ui-color-muted, #6b7280);
    margin-bottom: 1.25rem;
    line-height: 1.55;
}

.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput {
    margin-bottom: 0.95rem;
}

.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput label {
    display: block;
    color: var(--ui-color-text, #0f172a);
    font-weight: 600;
    font-size: 0.9rem;
    text-transform: none;
    margin-bottom: 0.4rem;
}

.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput input[type="email"],
.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput input[type="text"],
.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput input[type="password"],
.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput input[type="search"] {
    width: 100%;
    border-radius: 12px;
    border: 1px solid rgba(15, 23, 42, 0.12);
    background: #fff;
    color: #0f172a;
    padding: 0.8rem 1rem;
    min-height: 46px;
    transition: border-color 180ms ease, box-shadow 180ms ease;
}

.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput input:focus,
.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput input:focus-visible {
    border-color: var(--colorPrimary, #6366F1);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 22%, transparent);
    outline: none;
}

.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_check_area {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_check_area a {
    color: var(--colorPrimary, #6366F1);
    font-weight: 600;
    font-size: 0.9rem;
}

.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_check_area a:focus-visible,
.ui-site-shell .ui-auth-page .ui-auth-card .create_account a:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
    border-radius: 4px;
}

.ui-site-shell .ui-auth-page .ui-auth-card .form-check-label {
    color: #475569;
    font-weight: 500;
}

.ui-site-shell .ui-auth-page .ui-auth-card .form-check-input:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput button[type="submit"],
.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput .common_btn {
    width: 100%;
    border: none;
    border-radius: 999px;
    background: var(--colorPrimary, #6366F1);
    color: #fff;
    font-weight: 700;
    font-size: 0.95rem;
    padding: 0.85rem 1.25rem;
    box-shadow: 0 12px 28px color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent);
    transition: filter 180ms ease;
}

.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput button[type="submit"]:hover,
.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput .common_btn:hover,
.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput button[type="submit"]:focus-visible,
.ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput .common_btn:focus-visible {
    filter: brightness(1.05);
    color: #fff;
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 40%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-auth-page .ui-auth-card .or {
    position: relative;
    text-align: center;
    color: #94a3b8;
    margin: 1.15rem 0;
}

.ui-site-shell .ui-auth-page .ui-auth-card .or::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.ui-site-shell .ui-auth-page .ui-auth-card .or span {
    position: relative;
    z-index: 1;
    background: #fff;
    padding: 0 0.75rem;
    font-weight: 600;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.ui-site-shell .ui-auth-page .ui-auth-card .btn-danger,
.ui-site-shell .ui-auth-page .ui-auth-card .ui-auth-google {
    border-radius: 999px;
    font-weight: 600;
    padding: 0.8rem 1rem;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.12);
    color: #0f172a !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.05);
}

.ui-site-shell .ui-auth-page .ui-auth-card .btn-danger:hover,
.ui-site-shell .ui-auth-page .ui-auth-card .ui-auth-google:hover,
.ui-site-shell .ui-auth-page .ui-auth-card .btn-danger:focus-visible,
.ui-site-shell .ui-auth-page .ui-auth-card .ui-auth-google:focus-visible {
    background: #f8fafc;
    border-color: rgba(15, 23, 42, 0.18);
    color: #0f172a !important;
}

.ui-site-shell .ui-auth-page .ui-auth-card .btn-danger:focus-visible,
.ui-site-shell .ui-auth-page .ui-auth-card .ui-auth-google:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 40%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-auth-page .ui-auth-card .ui-auth-google .fa-google {
    color: #ea4335;
}

.ui-site-shell .ui-auth-page .ui-auth-card .create_account {
    text-align: center;
    color: #64748b;
    margin-top: 1rem;
    margin-bottom: 0;
}

.ui-site-shell .ui-auth-page .ui-auth-card .create_account a,
.ui-site-shell .ui-auth-page .ui-auth-card .create_account .btn-link {
    color: var(--colorPrimary, #6366F1);
    font-weight: 700;
    text-decoration: none;
}

.ui-site-shell .ui-auth-page .ui-auth-card .create_account .btn-link:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-auth-page .ui-auth-card .alert {
    border-radius: 12px;
    font-size: 0.92rem;
    margin-bottom: 1rem;
}

.ui-site-shell .ui-auth-page .ui-auth-card .text-danger {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.85rem;
}

.ui-site-shell .ui-auth-gate .ui-auth-fade-enter {
    transition: opacity 180ms ease, transform 180ms ease;
}

.ui-site-shell .ui-auth-gate .ui-auth-fade-enter-start {
    opacity: 0;
    transform: translateY(6px);
}

.ui-site-shell .ui-auth-gate .ui-auth-fade-enter-end {
    opacity: 1;
    transform: translateY(0);
}

@media (max-width: 991.98px) {
    .ui-site-shell .ui-auth-gate .ui-auth-shell {
        grid-template-columns: 1fr;
        min-height: 0;
        border-radius: 22px;
    }

    .ui-site-shell .ui-auth-gate .ui-auth-brand {
        padding: 1.75rem 1.5rem 1.5rem;
        min-height: 0;
    }

    .ui-site-shell .ui-auth-gate .ui-auth-brand__logo {
        margin-bottom: 1.15rem;
    }

    .ui-site-shell .ui-auth-gate .ui-auth-brand__title {
        max-width: none;
        font-size: 1.55rem;
    }

    .ui-site-shell .ui-auth-gate .ui-auth-brand__copy {
        max-width: none;
        margin-bottom: 1rem;
    }

    .ui-site-shell .ui-auth-gate .ui-auth-brand__points {
        display: none;
    }

    .ui-site-shell .ui-auth-gate .ui-auth-panel.ui-auth-card {
        padding: 1.5rem 1.25rem 1.4rem;
    }
}

@media (max-width: 575.98px) {
    .ui-site-shell .ui-auth-page .wsus__login_area.ui-auth-card {
        padding: 1.35rem 1.05rem 1.25rem;
    }

    .ui-site-shell .ui-auth-page .wsus__login_page,
    .ui-site-shell .ui-auth-page .ui-auth-stage {
        padding-top: 1.35rem;
    }

    .ui-site-shell .ui-auth-gate .ui-auth-switch__btn {
        padding: 0.65rem 0.5rem;
        font-size: 0.875rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell .ui-auth-page .ui-auth-card input,
    .ui-site-shell .ui-auth-page .ui-auth-card button,
    .ui-site-shell .ui-auth-page .ui-auth-card .common_btn,
    .ui-site-shell .ui-auth-gate .ui-auth-switch__thumb,
    .ui-site-shell .ui-auth-gate .ui-auth-fade-enter {
        transition: none !important;
    }

    .ui-site-shell .ui-auth-gate .ui-auth-fade-enter-start,
    .ui-site-shell .ui-auth-gate .ui-auth-fade-enter-end {
        transform: none;
        opacity: 1;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput button[type="submit"],
    .ui-site-shell .ui-auth-page .ui-auth-card .wsus__login_imput .common_btn {
        box-shadow: 0 12px 28px rgba(15, 23, 42, 0.15);
    }

    .ui-site-shell .ui-auth-gate .ui-auth-brand {
        background: linear-gradient(160deg, #111827 0%, #1f2937 50%, #3b1d18 100%);
    }
}

/* ========================================================================== */
/* Phase 2E ? remaining user workspace screens (presentation only)             */
/* Scope: #dashboard.ui-user-dashboard + domain wrappers                        */
/* ========================================================================== */

.ui-site-shell #dashboard.ui-user-dashboard .my_listing.ui-user-orders,
.ui-site-shell #dashboard.ui-user-dashboard .my_listing.ui-user-reviews,
.ui-site-shell #dashboard.ui-user-dashboard .my_listing.ui-user-favorites,
.ui-site-shell #dashboard.ui-user-dashboard .my_listing.ui-user-gallery,
.ui-site-shell #dashboard.ui-user-dashboard .my_listing.ui-user-schedules,
.ui-site-shell #dashboard.ui-user-dashboard .dashboard_message_area.ui-user-messages {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.05);
    padding: 1.35rem 1.25rem 1.5rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-empty {
    color: #64748b;
    font-size: 0.95rem;
    line-height: 1.5;
    margin-top: 0.35rem;
}

.ui-site-shell #dashboard.ui-user-dashboard #pagination {
    margin-top: 1.25rem;
}

.ui-site-shell #dashboard.ui-user-dashboard #pagination .page-link:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

/* ----- Messages ----- */
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf__message_list {
    background: #f8fafc;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 16px;
    padding: 0.65rem;
    max-height: 620px;
    overflow-y: auto;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .profile_card {
    border-radius: 14px !important;
    border: 1px solid transparent !important;
    margin-bottom: 0.4rem;
    background: #fff !important;
    color: #0f172a !important;
    text-align: left;
    cursor: pointer;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .profile_card:hover,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .profile_card.active,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .profile_card:focus-visible {
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent) !important;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 8%, #fff) !important;
    outline: none;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--colorPrimary, #6366F1) 18%, transparent);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .profile_name {
    color: #0f172a;
    font-size: 0.95rem;
    font-weight: 700;
    margin-bottom: 0.15rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf__single_massage_text p {
    color: #64748b;
    font-size: 0.85rem;
    margin: 0;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .profile_img {
    border-radius: 12px;
    object-fit: cover;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .profile_img.new_message {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 55%, #fff);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf___single_chat {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    overflow: hidden;
    min-height: 520px;
    display: flex;
    flex-direction: column;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf__single_chat_top {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.9rem 1rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    background: #f8fafc;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf__single_chat_top .img {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    overflow: hidden;
    flex-shrink: 0;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf__single_chat_top h4 {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .main_chat_inbox {
    flex: 1 1 auto;
    padding: 1rem;
    max-height: 420px;
    overflow-y: auto;
    background: linear-gradient(180deg, #f8fafc 0%, #fff 40%);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf__chating {
    display: flex;
    align-items: flex-end;
    gap: 0.65rem;
    margin-bottom: 0.85rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf__chating_img {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf__chating_img img {
    border-radius: 50%;
    object-fit: cover;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf__chating_text {
    max-width: min(78%, 420px);
    background: #eef2ff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 16px 16px 16px 4px;
    padding: 0.7rem 0.85rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf__chating_text p {
    margin: 0;
    color: #0f172a;
    font-size: 0.92rem;
    line-height: 1.45;
    word-break: break-word;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf__chating_text span {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.72rem;
    color: #64748b;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf_chat_right {
    flex-direction: row-reverse;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf_chat_right .tf__chating_text {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 14%, #fff);
    border-radius: 16px 16px 4px 16px;
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 22%, transparent);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .message-form.tf__single_chat_bottom {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.85rem 1rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    background: #fff;
    margin: 0;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .message-form #message {
    flex: 1 1 auto;
    min-height: 44px;
    border-radius: 999px;
    border: 1px solid rgba(15, 23, 42, 0.12);
    padding: 0.55rem 1rem;
    color: #0f172a;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .message-form #message:focus,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .message-form #message:focus-visible {
    border-color: var(--colorPrimary, #6366F1);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 20%, transparent);
    outline: none;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf__massage_btn {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: none;
    background: var(--colorPrimary, #6366F1);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf__massage_btn:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

/* ----- Orders / invoice ----- */
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-orders .invoice {
    background: #f8fafc;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 16px;
    padding: 1.25rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-orders .invoice-title {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-orders .invoice-title h2 {
    margin: 0;
    font-size: 1.35rem;
    color: #0f172a;
    font-weight: 700;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-orders .invoice-number {
    font-weight: 700;
    color: var(--colorPrimary, #6366F1);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-orders address {
    color: #334155;
    font-size: 0.92rem;
    line-height: 1.55;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-orders .section-title {
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 0.35rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-orders .section-lead {
    color: #64748b;
    font-size: 0.88rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-orders .invoice-detail-name {
    color: #64748b;
    font-size: 0.85rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-orders .invoice-detail-value-lg {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0f172a;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-orders .btn-warning {
    border-radius: 999px;
    font-weight: 600;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-orders .btn-warning:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

/* ----- Reviews ----- */
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-reviews .visitor_rev_area > h4 {
    margin-bottom: 1rem;
    color: #0f172a;
    font-weight: 700;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-reviews .visitor_rev_single {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 1rem;
    margin-bottom: 0.85rem;
    background: #f8fafc;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 16px;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-reviews .visitor_rev_img {
    width: 96px;
    flex-shrink: 0;
    border-radius: 12px;
    overflow: hidden;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-reviews .visitor_rev_img img {
    border-radius: 12px;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-reviews .visitor_rev_text .title {
    color: #0f172a;
    font-weight: 700;
    text-decoration: none;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-reviews .visitor_rev_text .title span {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: #64748b;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-reviews .visitor_rev_text .fas.fa-star {
    color: #f59e0b;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-reviews .visitor_rev_text .fa-star-alt {
    color: #cbd5e1;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-reviews .visitor_rev_text .small_text {
    display: block;
    margin-top: 0.35rem;
    color: #334155;
    line-height: 1.5;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-reviews .visitor_rev_text ul {
    list-style: none;
    padding: 0;
    margin: 0.65rem 0 0;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-reviews .btn-link.text-danger:focus-visible {
    outline: 2px solid color-mix(in srgb, #e11d48 45%, transparent);
    outline-offset: 2px;
}

/* ----- Favorites ----- */
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-favorites .wsus__featured_single {
    height: 100%;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-favorites .wsus__featured_single_img {
    position: relative;
    overflow: hidden;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-favorites .wsus__featured_single_img img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-favorites .wsus__featured_single_text {
    padding: 0.95rem 1rem 1.1rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-favorites .wsus__featured_single_text .title {
    color: #0f172a;
    font-weight: 700;
    text-decoration: none;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-favorites .wsus__featured_single_text p {
    color: #64748b;
    margin: 0.35rem 0 0;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-favorites .btn-outline-danger {
    border-radius: 999px;
    font-weight: 600;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-favorites .btn-outline-danger:focus-visible,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-favorites .btn-primary:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

/* ----- Galleries ----- */
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-gallery .table {
    margin-bottom: 0;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-gallery .table img {
    border-radius: 10px;
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-gallery .delete-item {
    border-radius: 10px;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-gallery code {
    color: #64748b;
    font-size: 0.82em;
}

/* ----- Video manager (agent) ----- */
.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.85rem 1rem;
    margin-bottom: 1.25rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__back {
    flex: 0 0 auto;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__heading {
    flex: 1 1 12rem;
    min-width: 0;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__heading h4 {
    margin: 0;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__eyebrow {
    margin: 0 0 0.2rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__subtitle {
    margin: 0.25rem 0 0;
    color: #64748b;
    font-size: 0.92rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__quota,
.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__count {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-left: auto;
    padding: 0.45rem 0.75rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 10%, #fff);
    color: var(--colorPrimary, #6366F1);
    font-size: 0.78rem;
    font-weight: 700;
    white-space: nowrap;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__quota.is-limit {
    background: #fff7ed;
    color: #c2410c;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__list-head {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 1rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__list-head h4 {
    margin: 0;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__form-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 168px;
    gap: 1rem;
    align-items: start;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__field label {
    margin-top: 0;
    font-weight: 600;
    color: #334155;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__field .form-control {
    min-height: 44px;
    border-radius: 12px;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__preview {
    position: relative;
    aspect-ratio: 16 / 9;
    border-radius: 14px;
    overflow: hidden;
    background: #0f172a;
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__preview-placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    color: #94a3b8;
    font-size: 0.78rem;
    font-weight: 600;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__submit {
    margin-top: 0.75rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__card {
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__thumb {
    position: relative;
    aspect-ratio: 16 / 9;
    background: #0f172a;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__thumb img,
.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__thumb-fallback {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__thumb-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 1.75rem;
    background:
        linear-gradient(145deg, #1e293b 0%, #0f172a 100%);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__index {
    position: absolute;
    top: 0.65rem;
    left: 0.65rem;
    min-width: 1.5rem;
    height: 1.5rem;
    padding: 0 0.4rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, 0.55);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    backdrop-filter: blur(6px);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__body {
    padding: 0.9rem 1rem 1rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__label {
    margin: 0 0 0.35rem;
    font-size: 0.78rem;
    font-weight: 700;
    color: #0f172a;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__url {
    display: block;
    margin-bottom: 0.85rem;
    color: #64748b;
    font-size: 0.82rem;
    line-height: 1.4;
    word-break: break-all;
    text-decoration: none;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__url:hover,
.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__url:focus-visible {
    color: var(--colorPrimary, #6366F1);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.75rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    text-decoration: none;
    border: 1px solid transparent;
    line-height: 1;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__btn--ghost {
    color: #334155;
    background: #f8fafc;
    border-color: rgba(15, 23, 42, 0.08);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__btn--danger,
.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__btn--danger.delete-item {
    color: #fff;
    background: #dc2626;
    border-color: #dc2626;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__btn:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__empty {
    text-align: center;
    padding: 2.25rem 1.25rem;
    border: 1px dashed rgba(15, 23, 42, 0.14);
    border-radius: 16px;
    background: #f8fafc;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__empty-icon {
    width: 3rem;
    height: 3rem;
    margin: 0 auto 0.85rem;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 12%, #fff);
    color: var(--colorPrimary, #6366F1);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__empty-title {
    margin: 0 0 0.35rem;
    font-size: 1.05rem;
    font-weight: 700;
    color: #0f172a;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__empty-text {
    margin: 0;
    color: #64748b;
    font-size: 0.92rem;
}

@media (max-width: 767.98px) {
    .ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__form-grid,
    .ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__grid {
        grid-template-columns: 1fr;
    }

    .ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__quota,
    .ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__count {
        margin-left: 0;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__quota,
    .ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__count,
    .ui-site-shell #dashboard.ui-user-dashboard .ui-video-manager__empty-icon {
        background: rgba(99, 102, 241, 0.12);
    }
}

/* ----- Schedules ----- */
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-schedules .select2-container .select2-selection--single {
    min-height: 44px;
    border-radius: 12px;
    border-color: rgba(15, 23, 42, 0.12);
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-schedules .ui-jquery-timepicker,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-schedules .timepicker,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-schedules .timepicker-1,
.ui-site-shell #dashboard.ui-user-dashboard .ui-user-schedules .timepicker-2 {
    min-height: 44px;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-schedules .form-control {
    border-radius: 12px;
    border-color: rgba(15, 23, 42, 0.12);
    min-height: 44px;
}

.ui-site-shell #dashboard.ui-user-dashboard .ui-user-schedules .form-control:focus {
    border-color: var(--colorPrimary, #6366F1);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 20%, transparent);
    outline: none;
}

@media (max-width: 991.98px) {
    .ui-site-shell #dashboard.ui-user-dashboard .my_listing.ui-user-orders,
    .ui-site-shell #dashboard.ui-user-dashboard .my_listing.ui-user-reviews,
    .ui-site-shell #dashboard.ui-user-dashboard .my_listing.ui-user-favorites,
    .ui-site-shell #dashboard.ui-user-dashboard .my_listing.ui-user-gallery,
    .ui-site-shell #dashboard.ui-user-dashboard .my_listing.ui-user-schedules,
    .ui-site-shell #dashboard.ui-user-dashboard .dashboard_message_area.ui-user-messages {
        padding: 1.1rem;
    }

    .ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf___single_chat {
        min-height: 420px;
        margin-top: 1rem;
    }

    .ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .main_chat_inbox {
        max-height: 320px;
    }

    .ui-site-shell #dashboard.ui-user-dashboard .ui-user-reviews .visitor_rev_single {
        flex-direction: column;
    }

    .ui-site-shell #dashboard.ui-user-dashboard .ui-user-reviews .visitor_rev_img {
        width: 100%;
        max-width: 180px;
    }

    .ui-site-shell #dashboard.ui-user-dashboard .ui-user-orders .invoice {
        padding: 1rem;
        overflow-x: auto;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .profile_card,
    .ui-site-shell #dashboard.ui-user-dashboard .ui-user-favorites .wsus__featured_single {
        transition: none !important;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .tf_chat_right .tf__chating_text {
        background: #e0e7ff;
    }

    .ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .profile_card:hover,
    .ui-site-shell #dashboard.ui-user-dashboard .ui-user-messages .profile_card:focus-visible {
        background: #eef2ff !important;
        border-color: #c7d2fe !important;
    }
}

/* ========================================================================== */
/* Phase 2F ? packages / checkout / payment results (presentation only)        */
/* Scope: .ui-site-shell .ui-billing-page (+ domain modifiers)                 */
/* Does NOT target homepage #wsus__package without .ui-billing-page            */
/* ========================================================================== */

.ui-site-shell .ui-billing-page {
    padding-bottom: 3rem;
}

.ui-site-shell .ui-billing-page #breadcrumb_part.ui-page-hero {
    margin-bottom: 0;
}

.ui-site-shell .ui-billing-page .wsus__heading_area {
    text-align: center;
    margin-bottom: 1.75rem;
}

.ui-site-shell .ui-billing-page .wsus__heading_area h2 {
    color: #0f172a;
    font-weight: 700;
    font-size: clamp(1.5rem, 2.4vw, 2rem);
    margin-bottom: 0.5rem;
}

.ui-site-shell .ui-billing-page .wsus__heading_area p {
    color: #64748b;
    margin: 0 auto;
    max-width: 36rem;
    line-height: 1.55;
}

/* Package cards (legacy billing/checkout cards only ? not glass .ui-packages) */
.ui-site-shell .ui-billing-page.ui-package-grid #wsus__package:not(.ui-packages),
.ui-site-shell .ui-billing-page.ui-payment-result #wsus__package:not(.ui-packages) {
    background: transparent;
}

.ui-site-shell .ui-billing-page.ui-package-grid .wsus__package_overlay:not(.ui-packages__overlay),
.ui-site-shell .ui-billing-page.ui-payment-result .wsus__package_overlay:not(.ui-packages__overlay) {
    padding: 2.5rem 0 1rem;
    background: transparent;
}

.ui-site-shell .ui-billing-page .member_price:not(.ui-package-card) {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.05);
    padding: 1.5rem 1.35rem 1.4rem;
    margin-bottom: 1.5rem;
    text-align: left;
    transition: border-color 180ms ease, box-shadow 180ms ease;
}

.ui-site-shell .ui-billing-page .member_price:not(.ui-package-card):hover {
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.08);
}

.ui-site-shell .ui-billing-page .member_price:not(.ui-package-card) h4 {
    color: #0f172a;
    font-weight: 700;
    font-size: 1.15rem;
    margin-bottom: 0.65rem;
}

.ui-site-shell .ui-billing-page .member_price:not(.ui-package-card) h5 {
    color: var(--colorPrimary, #6366F1);
    font-weight: 700;
    font-size: 1.65rem;
    margin-bottom: 1rem;
    line-height: 1.2;
}

.ui-site-shell .ui-billing-page .member_price:not(.ui-package-card) h5 span {
    display: inline-block;
    margin-left: 0.15rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: #64748b;
    vertical-align: middle;
}

.ui-site-shell .ui-billing-page .member_price:not(.ui-package-card) p {
    color: #334155;
    font-size: 0.92rem;
    line-height: 1.45;
    margin: 0 0 0.55rem;
    padding-left: 0;
    border: 0;
}

.ui-site-shell .ui-billing-page .member_price:not(.ui-package-card) > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: auto;
    align-self: stretch;
    min-height: 44px;
    padding: 0.7rem 1.1rem;
    border-radius: 999px;
    background: var(--colorPrimary, #6366F1);
    color: #fff !important;
    font-weight: 600;
    text-decoration: none;
    border: none;
    text-align: center;
}

.ui-site-shell .ui-billing-page .member_price:not(.ui-package-card) > a:hover,
.ui-site-shell .ui-billing-page .member_price:not(.ui-package-card) > a:focus-visible {
    filter: brightness(0.95);
    color: #fff !important;
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

/* Packages page: let glass theater sit flush under breadcrumb */
.ui-site-shell .ui-billing-page.ui-package-grid #wsus__package.ui-packages {
    margin-top: 0;
}

.ui-site-shell .ui-billing-page.ui-package-grid #wsus__package.ui-packages .wsus__package_overlay.ui-packages__overlay {
    padding-top: 2.75rem;
}

/* Checkout */
.ui-site-shell .ui-billing-page.ui-checkout-page #wsus__custom_page {
    padding: 2.25rem 0 1rem;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .wsus__payment_area {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.05);
    padding: 1.35rem 1.25rem 1.1rem;
    margin-bottom: 1.5rem;
}


.ui-site-shell .ui-billing-page.ui-checkout-page .wsus__single_payment {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 88px;
    margin-bottom: 1rem;
    padding: 0.85rem;
    background: #f8fafc;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px;
    transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
    text-decoration: none;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .wsus__single_payment:hover,
.ui-site-shell .ui-billing-page.ui-checkout-page .wsus__single_payment:focus-visible {
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 30%, transparent);
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 6%, #fff);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--colorPrimary, #6366F1) 18%, transparent);
    outline: none;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .wsus__single_payment img {
    max-height: 42px;
    width: auto !important;
    object-fit: contain;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .member_price > a {
    /* Summary CTA retained; muted so payment methods remain primary actions */
    background: #fff;
    color: var(--colorPrimary, #6366F1) !important;
    border: 1px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent);
}

.ui-site-shell .ui-billing-page.ui-checkout-page .member_price > a:hover,
.ui-site-shell .ui-billing-page.ui-checkout-page .member_price > a:focus-visible {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 8%, #fff);
    color: var(--colorPrimary, #6366F1) !important;
    filter: none;
}

/* Payment result panels */
.ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__panel {
    max-width: 32rem;
    margin: 0 auto;
    background: var(--ui-color-surface, #ffffff);
    border: 1px solid var(--ui-color-border, rgba(15, 23, 42, 0.08));
    border-radius: var(--ui-radius-md, 16px);
    box-shadow: var(--ui-shadow-soft, 0 14px 34px rgba(15, 23, 42, 0.06));
    padding: 2.25rem 1.5rem;
}

.ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__title,
.ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__panel h5 {
    color: var(--ui-color-text, #0f172a);
    font-weight: 700;
    font-size: clamp(1.15rem, 1rem + 0.8vw, 1.35rem);
    margin-top: 0.85rem;
    margin-bottom: 0;
}

.ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__icon {
    display: inline-flex;
    font-size: clamp(3rem, 8vw, 4.5rem);
    line-height: 1;
}

.ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__icon--success,
.ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__panel .fa-check-circle {
    color: #16a34a;
}

.ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__icon--cancel,
.ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__panel .fa-times-circle {
    color: #dc2626;
}

.ui-site-shell .ui-billing-page.ui-payment-result .alert {
    text-align: left;
    border-radius: var(--ui-radius-sm, 10px);
}

.ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0.65rem 1.35rem;
    border-radius: var(--ui-radius-sm, 10px);
    border: 0;
    background: var(--colorPrimary, #6366F1);
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    transition: background-color 160ms ease, transform 160ms ease;
}

.ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__cta:hover,
.ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__cta:focus-visible {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 82%, #000);
    color: #fff;
}

.ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__cta:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

@media (max-width: 575.98px) {
    .ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__cta {
        width: 100%;
    }
}

@media (max-width: 991.98px) {
    .ui-site-shell .ui-billing-page.ui-checkout-page .wsus__payment_area {
        order: 2;
    }

    .ui-site-shell .ui-billing-page .member_price:not(.ui-package-card) {
        padding: 1.25rem 1.1rem;
    }

    .ui-site-shell .ui-billing-page.ui-checkout-page .wsus__single_payment {
        min-height: 76px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell .ui-billing-page .member_price:not(.ui-package-card),
    .ui-site-shell .ui-billing-page.ui-checkout-page .wsus__single_payment,
    .ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__cta {
        transition: none !important;
    }

    .ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__cta:hover,
    .ui-site-shell .ui-billing-page.ui-payment-result .ui-payment-result__cta:focus-visible {
        transform: none;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-billing-page .member_price:not(.ui-package-card):hover {
        border-color: #c7d2fe;
    }

    .ui-site-shell .ui-billing-page.ui-checkout-page .wsus__single_payment:hover,
    .ui-site-shell .ui-billing-page.ui-checkout-page .wsus__single_payment:focus-visible {
        background: #eef2ff;
        border-color: #c7d2fe;
    }
}

/* ========================================================================== */
/* About page                                                                  */
/* Scope: .ui-site-shell .ui-about-page                                        */
/* Keeps #about_page / .about_text / .about_img hooks for legacy CSS.          */
/* ========================================================================== */

.ui-site-shell .ui-about-page #breadcrumb_part.ui-page-hero {
    margin-bottom: 0;
}

.ui-site-shell .ui-about-page #about_page.ui-about-story {
    position: relative;
    overflow: hidden;
    padding: 4.25rem 0 4rem;
}

.ui-site-shell .ui-about-page .ui-about-story__atmosphere {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 48% 42% at 88% 12%, color-mix(in srgb, var(--colorPrimary, #6366F1) 18%, transparent), transparent 70%),
        radial-gradient(ellipse 36% 30% at 10% 88%, rgba(15, 23, 42, 0.06), transparent 65%),
        linear-gradient(165deg, #f7f4ef 0%, #eef1f4 48%, #f8fafc 100%);
}

.ui-site-shell .ui-about-page .ui-about-story__ink {
    position: absolute;
    border-radius: 50%;
    filter: blur(2px);
    opacity: 0.55;
    animation: ui-about-ink 14s ease-in-out infinite;
}

.ui-site-shell .ui-about-page .ui-about-story__ink--a {
    width: 22rem;
    height: 22rem;
    top: -6rem;
    right: -4rem;
    background: radial-gradient(circle, color-mix(in srgb, var(--colorPrimary, #6366F1) 40%, transparent), transparent 70%);
}

.ui-site-shell .ui-about-page .ui-about-story__ink--b {
    width: 16rem;
    height: 16rem;
    left: -3rem;
    bottom: 8%;
    background: radial-gradient(circle, rgba(30, 41, 59, 0.14), transparent 70%);
    animation-delay: -5s;
}

.ui-site-shell .ui-about-page .ui-about-story__grain {
    position: absolute;
    inset: 0;
    opacity: 0.18;
    background-image:
        radial-gradient(rgba(15, 23, 42, 0.08) 0.6px, transparent 0.7px);
    background-size: 3px 3px;
    mix-blend-mode: multiply;
}

.ui-site-shell .ui-about-page .ui-about-story__watermark {
    position: absolute;
    left: -2%;
    bottom: 4%;
    font-size: clamp(5rem, 12vw, 11rem);
    font-weight: 800;
    letter-spacing: -0.06em;
    line-height: 0.85;
    color: transparent;
    -webkit-text-stroke: 1px rgba(15, 23, 42, 0.08);
    text-transform: uppercase;
    user-select: none;
    transform: rotate(-6deg);
    opacity: 0.85;
}

@keyframes ui-about-ink {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    50% { transform: translate3d(-14px, 18px, 0) scale(1.06); }
}

.ui-site-shell .ui-about-page #about_page.ui-about-story > .container {
    position: relative;
    z-index: 1;
}

.ui-site-shell .ui-about-page .ui-about-story__row {
    position: relative;
}

.ui-site-shell .ui-about-page .ui-about-story__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.15rem;
}

.ui-site-shell .ui-about-page .ui-about-story__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    border-radius: 0;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #0f172a;
}

.ui-site-shell .ui-about-page .ui-about-story__eyebrow-mark {
    width: 2.25rem;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--colorPrimary, #6366F1), transparent);
    animation: ui-about-stroke 2.8s ease-in-out infinite;
}

@keyframes ui-about-stroke {
    0%, 100% { width: 2.25rem; opacity: 1; }
    50% { width: 3.1rem; opacity: 0.7; }
}

.ui-site-shell .ui-about-page .ui-about-story__signature {
    font-family: Georgia, "Times New Roman", serif;
    font-style: italic;
    font-size: 1.05rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 75%, #0f172a);
    opacity: 0.85;
    white-space: nowrap;
}

.ui-site-shell .ui-about-page .ui-about-story__content.about_text,
.ui-site-shell .ui-about-page .ui-about-story__panel {
    position: relative;
    max-width: none;
    height: 100%;
    padding: 0 0 0 1.35rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.ui-site-shell .ui-about-page .ui-about-story__panel::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.35rem;
    bottom: 0.35rem;
    width: 3px;
    border-radius: 999px;
    background: linear-gradient(
        180deg,
        var(--colorPrimary, #6366F1) 0%,
        color-mix(in srgb, var(--colorPrimary, #6366F1) 20%, transparent) 100%
    );
}

.ui-site-shell .ui-about-page .ui-about-story__copy > *:first-child {
    margin-top: 0;
}

.ui-site-shell .ui-about-page .ui-about-story__content h1,
.ui-site-shell .ui-about-page .ui-about-story__content h2,
.ui-site-shell .ui-about-page .ui-about-story__content h3,
.ui-site-shell .ui-about-page .ui-about-story__content h4,
.ui-site-shell .ui-about-page .ui-about-story__content h5,
.ui-site-shell .ui-about-page .ui-about-story__content h6 {
    margin: 0 0 1rem;
    color: #0f172a;
    font-weight: 800;
    letter-spacing: -0.035em;
    line-height: 1.12;
    background: transparent !important;
}

.ui-site-shell .ui-about-page .ui-about-story__content h4 {
    font-size: clamp(2rem, 1.45rem + 1.8vw, 2.85rem);
    margin-bottom: 1.15rem;
    max-width: 14ch;
}

.ui-site-shell .ui-about-page .ui-about-story__content p {
    margin: 0 0 1rem;
    color: #475569;
    font-size: 1.06rem;
    line-height: 1.78;
    background: transparent !important;
}

.ui-site-shell .ui-about-page .ui-about-story__content ul {
    margin: 1.25rem 0 0.35rem;
    padding: 0;
    list-style: none;
    background: transparent !important;
    display: grid;
    gap: 0.55rem;
}

.ui-site-shell .ui-about-page .ui-about-story__content ul li {
    position: relative;
    margin: 0;
    padding: 0.7rem 0.9rem 0.7rem 2.35rem;
    color: #334155;
    font-size: 0.96rem;
    line-height: 1.5;
    list-style: none;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.55) !important;
    border: 1px solid rgba(15, 23, 42, 0.06);
}

.ui-site-shell .ui-about-page .ui-about-story__content ul li::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0.75rem;
    width: 0.85rem;
    height: 0.85rem;
    transform: translateY(-50%);
    border-radius: 999px;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23fff' d='M6.2 11.2 2.9 7.9l1.1-1.1 2.2 2.2 5-5 1.1 1.1z'/%3E%3C/svg%3E")
        center / 0.65rem no-repeat,
        var(--colorPrimary, #6366F1);
    font-family: none;
    color: transparent;
}

.ui-site-shell .ui-about-page .ui-about-story__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1.75rem;
}

.ui-site-shell .ui-about-page .ui-about-story__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    margin-top: 0;
    padding: 0.9rem 1.45rem;
    border-radius: 999px;
    background: #0f172a;
    border: 1px solid transparent;
    color: #fff !important;
    font-size: 0.92rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    text-transform: none;
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.18);
    transition: transform 200ms ease, background-color 180ms ease, color 180ms ease, box-shadow 180ms ease;
}

.ui-site-shell .ui-about-page .ui-about-story__cta i {
    font-size: 0.72rem;
    transition: transform 180ms ease;
}

.ui-site-shell .ui-about-page .ui-about-story__cta:hover,
.ui-site-shell .ui-about-page .ui-about-story__cta:focus-visible {
    background: var(--colorPrimary, #6366F1);
    transform: translateY(-3px);
    color: #fff !important;
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
    box-shadow: 0 18px 40px color-mix(in srgb, var(--colorPrimary, #6366F1) 30%, transparent);
}

.ui-site-shell .ui-about-page .ui-about-story__cta:hover i,
.ui-site-shell .ui-about-page .ui-about-story__cta:focus-visible i {
    transform: translateX(4px);
}

.ui-site-shell .ui-about-page .ui-about-story__cta--ghost {
    background: transparent;
    border-color: rgba(15, 23, 42, 0.18);
    color: #0f172a !important;
    box-shadow: none;
}

.ui-site-shell .ui-about-page .ui-about-story__cta--ghost:hover,
.ui-site-shell .ui-about-page .ui-about-story__cta--ghost:focus-visible {
    background: rgba(255, 255, 255, 0.7);
    border-color: var(--colorPrimary, #6366F1);
    color: var(--colorPrimary, #6366F1) !important;
}

/* Artistic media collage */
.ui-site-shell .ui-about-page .ui-about-media.about_img {
    position: relative;
    max-height: none;
    max-width: 520px;
    width: 100%;
    padding: 1.75rem 0.75rem 2.25rem 1.5rem;
    margin-inline: auto;
}

.ui-site-shell .ui-about-page .ui-about-media.about_img::before,
.ui-site-shell .ui-about-page .ui-about-media.about_img::after {
    display: none;
}

.ui-site-shell .ui-about-page .ui-about-media__orbit {
    position: absolute;
    width: 78%;
    aspect-ratio: 1;
    right: -6%;
    top: 4%;
    border: 1px dashed color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    border-radius: 50%;
    z-index: 0;
    animation: ui-about-orbit 18s linear infinite;
    pointer-events: none;
}

.ui-site-shell .ui-about-page .ui-about-media__slash {
    position: absolute;
    left: 0.35rem;
    top: 12%;
    bottom: 18%;
    width: 10px;
    border-radius: 999px;
    background: linear-gradient(180deg, transparent, var(--colorPrimary, #6366F1), transparent);
    opacity: 0.55;
    z-index: 0;
    transform: rotate(8deg);
}

.ui-site-shell .ui-about-page .ui-about-media__corner {
    position: absolute;
    width: 2.4rem;
    height: 2.4rem;
    z-index: 3;
    border: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 70%, #0f172a);
    pointer-events: none;
}

.ui-site-shell .ui-about-page .ui-about-media__corner--tl {
    top: 0.55rem;
    left: 0.85rem;
    border-right: 0;
    border-bottom: 0;
}

.ui-site-shell .ui-about-page .ui-about-media__corner--br {
    right: 0.2rem;
    bottom: 1.1rem;
    border-left: 0;
    border-top: 0;
}

@keyframes ui-about-orbit {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.ui-site-shell .ui-about-page .ui-about-media__frame,
.ui-site-shell .ui-about-page .ui-about-media__placeholder {
    position: relative;
    z-index: 1;
    overflow: hidden;
    border-radius: 36% 64% 48% 52% / 42% 38% 62% 58%;
    background: #1e293b;
    border: 6px solid rgba(255, 255, 255, 0.88);
    box-shadow:
        0 30px 70px rgba(15, 23, 42, 0.22),
        0 0 0 1px rgba(15, 23, 42, 0.06);
    aspect-ratio: 4 / 5;
    transition: border-radius 700ms ease;
}

.ui-site-shell .ui-about-page .ui-about-media:hover .ui-about-media__frame {
    border-radius: 48% 52% 40% 60% / 50% 45% 55% 50%;
}

.ui-site-shell .ui-about-page .ui-about-media__placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 2rem;
    background: linear-gradient(145deg, #334155, #1e293b);
}

.ui-site-shell .ui-about-page .ui-about-media__primary {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0;
    display: block;
    transform: scale(1.08);
    transition: transform 700ms ease;
    filter: saturate(1.05) contrast(1.04);
}

.ui-site-shell .ui-about-page .ui-about-media__frame::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(160deg, rgba(15, 23, 42, 0.05) 20%, rgba(15, 23, 42, 0.45) 100%),
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.18), transparent 40%);
    pointer-events: none;
}

.ui-site-shell .ui-about-page .ui-about-media:hover .ui-about-media__primary {
    transform: scale(1.14);
}

.ui-site-shell .ui-about-page .ui-about-media__caption {
    position: absolute;
    left: 1.1rem;
    bottom: 1.1rem;
    z-index: 2;
    margin: 0;
    color: rgba(255, 255, 255, 0.88);
    font-family: Georgia, "Times New Roman", serif;
    font-style: italic;
    font-size: 1rem;
    letter-spacing: 0.02em;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}

.ui-site-shell .ui-about-page .ui-about-media__play.venobox {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 4.6rem;
    height: 4.6rem;
    transform: translate(-50%, -50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    background: rgba(15, 23, 42, 0.45);
    color: #fff;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.35);
    z-index: 2;
    transition: transform 200ms ease, background-color 180ms ease, box-shadow 180ms ease;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell .ui-about-page .ui-about-media__play.venobox {
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
    }
}

.ui-site-shell .ui-about-page .ui-about-media__play.venobox i {
    position: static;
    width: auto;
    height: auto;
    line-height: 1;
    background: transparent;
    font-size: 1.05rem;
    margin-left: 0.15rem;
    border-radius: 0;
    transform: none;
    color: inherit;
}

.ui-site-shell .ui-about-page .ui-about-media__play.venobox:hover,
.ui-site-shell .ui-about-page .ui-about-media__play.venobox:focus-visible {
    transform: translate(-50%, -50%) scale(1.08);
    background: var(--colorPrimary, #6366F1);
    box-shadow: 0 20px 48px color-mix(in srgb, var(--colorPrimary, #6366F1) 40%, transparent);
    outline: 2px solid #fff;
    outline-offset: 3px;
}

.ui-site-shell .ui-about-page .ui-about-media__secondary.img_2 {
    width: min(46%, 200px);
    height: auto;
    position: absolute;
    left: 0;
    bottom: 0.15rem;
    z-index: 2;
    padding: 0.45rem 0.45rem 1.4rem;
    border: 0;
    border-radius: 4px;
    overflow: visible;
    background: #fff;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.2);
    transform: rotate(-6deg);
    transition: transform 280ms ease;
}

.ui-site-shell .ui-about-page .ui-about-media:hover .ui-about-media__secondary.img_2 {
    transform: rotate(-3deg) translateY(-4px);
}

.ui-site-shell .ui-about-page .ui-about-media__secondary img {
    display: block;
    width: 100%;
    height: 140px;
    object-fit: cover;
    border-radius: 2px;
}

.ui-site-shell .ui-about-page .ui-about-media__polaroid-tape {
    position: absolute;
    top: -0.45rem;
    left: 50%;
    width: 3.2rem;
    height: 1rem;
    transform: translateX(-50%) rotate(-2deg);
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, rgba(255, 255, 255, 0.75));
    opacity: 0.85;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
}

/* Empty state */
.ui-site-shell .ui-about-page .ui-about-empty {
    text-align: center;
    max-width: 36rem;
    margin: 0 auto;
    padding: 2.5rem 1.25rem;
    border-radius: 20px;
    border: 1px dashed rgba(15, 23, 42, 0.16);
    background: rgba(255, 255, 255, 0.78);
}

.ui-site-shell .ui-about-page .ui-about-empty__title {
    margin: 0 0 0.55rem;
    color: #0f172a;
    font-size: 1.35rem;
    font-weight: 700;
}

.ui-site-shell .ui-about-page .ui-about-empty__text {
    margin: 0 0 1.25rem;
    color: #64748b;
}

.ui-site-shell .ui-about-page .ui-about-empty__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    justify-content: center;
}

.ui-site-shell .ui-about-page .ui-about-empty__actions .ui-about-story__cta {
    margin-top: 0;
}

/* Shared section polish on about page */
.ui-site-shell .ui-about-page .wsus__heading_area h2 {
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #0f172a;
}

.ui-site-shell .ui-about-page .wsus__heading_area p {
    color: #64748b;
}

.ui-site-shell .ui-about-page #wsus__features.ui-features {
    padding-top: 2.5rem;
    padding-bottom: 3.25rem;
}

/* Counter ? glass metrics band (home + about); no background image */
.ui-site-shell #wsus__counter.ui-counter {
    background: none !important;
    background-image: none !important;
    overflow: visible;
}

.ui-site-shell #wsus__counter.ui-counter .wsus__counter_overlay.ui-counter__overlay {
    position: relative;
    overflow: hidden;
    padding: 2.75rem 0 3rem;
    background: transparent;
}

.ui-site-shell #wsus__counter.ui-counter .ui-counter__atmosphere {
    position: absolute;
    inset: 0 4%;
    border-radius: 32px;
    background:
        radial-gradient(ellipse 60% 80% at 12% 20%, color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent), transparent 65%),
        radial-gradient(ellipse 50% 70% at 92% 80%, rgba(34, 211, 238, 0.16), transparent 60%),
        linear-gradient(135deg, rgba(15, 23, 42, 0.92) 0%, rgba(30, 41, 59, 0.88) 55%, color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, #0f172a) 100%);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
    pointer-events: none;
    z-index: 0;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell #wsus__counter.ui-counter .ui-counter__atmosphere {
        -webkit-backdrop-filter: blur(18px) saturate(1.15);
        backdrop-filter: blur(18px) saturate(1.15);
    }
}

.ui-site-shell #wsus__counter.ui-counter .container {
    position: relative;
    z-index: 1;
}

.ui-site-shell #wsus__counter.ui-counter .ui-counter__panel {
    padding: 0.35rem 0;
}

.ui-site-shell #wsus__counter.ui-counter .wsus__counter_single.ui-counter-card {
    position: relative;
    height: 100%;
    text-align: left;
    padding: 1.35rem 1.25rem 1.25rem;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
    transition: transform 200ms ease, background-color 200ms ease, border-color 200ms ease;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell #wsus__counter.ui-counter .wsus__counter_single.ui-counter-card {
        -webkit-backdrop-filter: blur(12px) saturate(1.2);
        backdrop-filter: blur(12px) saturate(1.2);
    }
}

.ui-site-shell #wsus__counter.ui-counter .ui-counter-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    margin-bottom: 0.85rem;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-size: 0.9rem;
}

.ui-site-shell #wsus__counter.ui-counter .wsus__counter_single span.counter {
    display: block;
    width: auto;
    text-align: left;
    margin: 0 0 0.35rem;
    color: #fff;
    font-size: clamp(2rem, 1.5rem + 1.4vw, 2.75rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.05;
}

.ui-site-shell #wsus__counter.ui-counter .wsus__counter_single p {
    margin: 0;
    color: rgba(248, 250, 252, 0.78);
    font-size: 0.95rem;
    font-weight: 500;
    text-align: left;
    text-transform: none;
    line-height: 1.35;
}

.ui-site-shell #wsus__counter.ui-counter .wsus__counter_single.ui-counter-card:hover {
    transform: translateY(-4px);
    background: rgba(255, 255, 255, 0.14);
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, rgba(255, 255, 255, 0.2));
}

@media (max-width: 767.98px) {
    .ui-site-shell #wsus__counter.ui-counter .wsus__counter_overlay.ui-counter__overlay {
        padding: 1.75rem 0 2rem;
    }

    .ui-site-shell #wsus__counter.ui-counter .ui-counter__atmosphere {
        inset: 0 0.75rem;
        border-radius: 24px;
    }

    .ui-site-shell #wsus__counter.ui-counter .wsus__counter_single.ui-counter-card {
        padding: 1.1rem 1rem;
    }

    .ui-site-shell #wsus__counter.ui-counter .wsus__counter_single span.counter {
        font-size: 1.75rem;
    }

    .ui-site-shell #wsus__counter.ui-counter .wsus__counter_single p {
        font-size: 0.85rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell #wsus__counter.ui-counter .wsus__counter_single.ui-counter-card {
        transition: none !important;
    }

    .ui-site-shell #wsus__counter.ui-counter .wsus__counter_single.ui-counter-card:hover {
        transform: none;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell #wsus__counter.ui-counter .ui-counter__atmosphere {
        background: linear-gradient(135deg, #111827 0%, #1e293b 55%, #3b1d18 100%);
    }

    .ui-site-shell #wsus__counter.ui-counter .wsus__counter_single.ui-counter-card:hover {
        border-color: rgba(246, 101, 66, 0.45);
    }
}

/* Featured categories ? glass image tiles (home + about) */
.ui-site-shell #wsus__categoryes.ui-featured-categories {
    position: relative;
    overflow: hidden;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__categorye_overlay.ui-featured-categories__overlay {
    position: relative;
    padding: 3.25rem 0 3.75rem;
    background: transparent;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-categories__atmosphere {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(ellipse 55% 45% at 8% 12%, color-mix(in srgb, var(--colorPrimary, #6366F1) 14%, transparent), transparent 70%),
        radial-gradient(ellipse 45% 40% at 96% 88%, rgba(14, 165, 233, 0.1), transparent 65%),
        linear-gradient(180deg, #f8fafc 0%, #eef2f7 48%, #f8fafc 100%);
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .container {
    position: relative;
    z-index: 1;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-categories__heading {
    margin-bottom: 2rem;
    text-align: center;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-categories__eyebrow {
    margin: 0 0 0.45rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 85%, #0f172a);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-categories__heading h2 {
    margin-bottom: 0.55rem;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-categories__heading h2::before,
.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-categories__heading h2::after {
    display: none;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-categories__heading p {
    margin: 0 auto;
    max-width: 36rem;
    color: #64748b;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card {
    display: block;
    position: relative;
    width: 100%;
    height: 300px;
    margin-top: 0;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.1);
    isolation: isolate;
    transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-category-card__media {
    width: 100%;
    height: 100%;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-category-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.02);
    transition: transform 420ms ease;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_text.ui-featured-category-card__glass {
    position: absolute;
    left: 0.75rem;
    right: 0.75rem;
    bottom: 0.75rem;
    width: auto;
    height: auto;
    z-index: 2;
    padding: 0;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.35);
    background: rgba(15, 23, 42, 0.42);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.18);
    overflow: hidden;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_text.ui-featured-category-card__glass {
        -webkit-backdrop-filter: blur(14px) saturate(1.25);
        backdrop-filter: blur(14px) saturate(1.25);
        background: rgba(15, 23, 42, 0.38);
    }
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_text_center.ui-featured-category-card__content {
    position: relative;
    bottom: auto;
    left: auto;
    display: flex;
    align-items: center;
    gap: 0.8rem;
    width: 100%;
    height: auto;
    padding: 0.85rem 0.95rem;
    color: #fff;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-category-card__icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.55rem;
    height: 2.55rem;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.16);
    overflow: hidden;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-category-card__icon img {
    width: 1.35rem;
    height: 1.35rem;
    object-fit: contain;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-category-card__meta {
    flex: 1 1 auto;
    min-width: 0;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-category-card__meta p {
    margin: 0 0 0.2rem;
    color: #fff;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.2;
    text-transform: capitalize;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-category-card__meta span.green,
.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-category-card__meta span {
    display: inline-block;
    margin: 0;
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.14) !important;
    color: rgba(248, 250, 252, 0.92) !important;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: none;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-category-card__arrow {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.24);
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 88%, #fff);
    color: #fff;
    font-size: 0.75rem;
    transform: translateX(0);
    transition: transform 200ms ease, background-color 200ms ease;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card:hover,
.ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card:focus-visible {
    transform: translateY(-5px);
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, rgba(15, 23, 42, 0.08));
    box-shadow: 0 24px 48px rgba(15, 23, 42, 0.16);
    outline: none;
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card:hover .ui-featured-category-card__media img,
.ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card:focus-visible .ui-featured-category-card__media img {
    transform: scale(1.08);
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card:hover .ui-featured-category-card__arrow,
.ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card:focus-visible .ui-featured-category-card__arrow {
    transform: translateX(3px);
}

.ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-categories__empty {
    margin: 0.5rem auto 0;
    max-width: 28rem;
    padding: 1.25rem 1rem;
    border-radius: 16px;
    border: 1px dashed rgba(15, 23, 42, 0.14);
    background: rgba(255, 255, 255, 0.7);
    color: #64748b;
    text-align: center;
}

@media (max-width: 767.98px) {
    .ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__categorye_overlay.ui-featured-categories__overlay {
        padding: 2.25rem 0 2.75rem;
    }

    .ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card {
        height: 250px;
    }

    .ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-category-card__meta p {
        font-size: 0.98rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card,
    .ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-category-card__media img,
    .ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-category-card__arrow {
        transition: none !important;
    }

    .ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card:hover,
    .ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card:focus-visible {
        transform: none;
    }

    .ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card:hover .ui-featured-category-card__media img,
    .ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card:focus-visible .ui-featured-category-card__media img {
        transform: scale(1.02);
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-categories__atmosphere {
        background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 48%, #f8fafc 100%);
    }

    .ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-categories__eyebrow {
        color: #f66542;
    }

    .ui-site-shell #wsus__categoryes.ui-featured-categories .ui-featured-category-card__arrow {
        background: #f66542;
    }

    .ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card:hover,
    .ui-site-shell #wsus__categoryes.ui-featured-categories .wsus__category_single.ui-featured-category-card:focus-visible {
        border-color: rgba(246, 101, 66, 0.35);
    }
}

@media (max-width: 991.98px) {
    .ui-site-shell .ui-about-page #about_page.ui-about-story {
        padding: 2.75rem 0 2.5rem;
    }

    .ui-site-shell .ui-about-page .ui-about-story__panel {
        padding-left: 1.15rem;
    }

    .ui-site-shell .ui-about-page .ui-about-story__content h4 {
        max-width: none;
    }

    .ui-site-shell .ui-about-page .ui-about-story__watermark {
        font-size: 5.5rem;
        bottom: 1%;
        opacity: 0.55;
    }

    .ui-site-shell .ui-about-page .ui-about-media.about_img {
        max-width: 400px;
        padding: 1.25rem 0.5rem 1.75rem 1.15rem;
    }

    .ui-site-shell .ui-about-page .ui-about-media__frame,
    .ui-site-shell .ui-about-page .ui-about-media__placeholder {
        aspect-ratio: 1 / 1;
        border-radius: 42% 58% 48% 52% / 46% 42% 58% 54%;
    }
}

@media (max-width: 575.98px) {
    .ui-site-shell .ui-about-page .ui-about-story__meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.45rem;
    }

    .ui-site-shell .ui-about-page .ui-about-story__signature {
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .ui-site-shell .ui-about-page .ui-about-story__actions {
        flex-direction: column;
    }

    .ui-site-shell .ui-about-page .ui-about-story__actions .ui-about-story__cta {
        width: 100%;
    }

    .ui-site-shell .ui-about-page .ui-about-media__secondary.img_2 {
        width: min(52%, 170px);
    }

    .ui-site-shell .ui-about-page .ui-about-media__secondary img {
        height: 110px;
    }

    .ui-site-shell .ui-about-page .ui-about-media__play.venobox {
        width: 3.6rem;
        height: 3.6rem;
    }

    .ui-site-shell .ui-about-page .ui-about-media__orbit {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell .ui-about-page .ui-about-story__ink,
    .ui-site-shell .ui-about-page .ui-about-story__eyebrow-mark,
    .ui-site-shell .ui-about-page .ui-about-media__orbit {
        animation: none !important;
    }

    .ui-site-shell .ui-about-page .ui-about-story__cta,
    .ui-site-shell .ui-about-page .ui-about-story__cta i,
    .ui-site-shell .ui-about-page .ui-about-media__frame,
    .ui-site-shell .ui-about-page .ui-about-media__primary,
    .ui-site-shell .ui-about-page .ui-about-media__secondary.img_2,
    .ui-site-shell .ui-about-page .ui-about-media__play.venobox {
        transition: none !important;
    }

    .ui-site-shell .ui-about-page .ui-about-story__cta:hover,
    .ui-site-shell .ui-about-page .ui-about-story__cta:focus-visible,
    .ui-site-shell .ui-about-page .ui-about-media__play.venobox:hover,
    .ui-site-shell .ui-about-page .ui-about-media__play.venobox:focus-visible,
    .ui-site-shell .ui-about-page .ui-about-media:hover .ui-about-media__secondary.img_2 {
        transform: none;
    }

    .ui-site-shell .ui-about-page .ui-about-media:hover .ui-about-media__primary {
        transform: none;
    }

    .ui-site-shell .ui-about-page .ui-about-media:hover .ui-about-media__frame {
        border-radius: inherit;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-about-page .ui-about-story__atmosphere {
        background: linear-gradient(165deg, #f7f4ef 0%, #eef1f4 48%, #f8fafc 100%);
    }

    .ui-site-shell .ui-about-page .ui-about-story__signature {
        color: #6366F1;
    }

    .ui-site-shell .ui-about-page .ui-about-story__eyebrow-mark {
        color: #6366F1;
        background: #6366F1;
    }

    .ui-site-shell .ui-about-page .ui-about-story__cta:hover,
    .ui-site-shell .ui-about-page .ui-about-story__cta:focus-visible,
    .ui-site-shell .ui-about-page .ui-about-media__play.venobox:hover,
    .ui-site-shell .ui-about-page .ui-about-media__play.venobox:focus-visible {
        background: #6366F1;
    }

    .ui-site-shell .ui-about-page .ui-about-story__cta--ghost:hover,
    .ui-site-shell .ui-about-page .ui-about-story__cta--ghost:focus-visible {
        border-color: #6366F1;
        color: #6366F1 !important;
    }
}

/* ========================================================================== */
/* Blog index ? magazine journal                                               */
/* Scope: .ui-site-shell .ui-blog-page (index via .ui-blog-index)               */
/* Keeps #blog_part / .single_blog hooks for legacy CSS.                       */
/* ========================================================================== */

.ui-site-shell .ui-blog-page #breadcrumb_part.ui-page-hero {
    margin-bottom: 0;
}

.ui-site-shell .ui-blog-page #blog_part.ui-blog-index {
    position: relative;
    overflow: hidden;
}

.ui-site-shell .ui-blog-page #blog_part.ui-blog-index .blog_part_overlay.ui-blog-index__overlay {
    position: relative;
    padding: 3rem 0 3.75rem;
}

.ui-site-shell .ui-blog-page .ui-blog-index__atmosphere {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 50% 40% at 8% 10%, color-mix(in srgb, var(--colorPrimary, #6366F1) 14%, transparent), transparent 70%),
        radial-gradient(ellipse 40% 35% at 95% 85%, rgba(14, 165, 233, 0.1), transparent 65%),
        linear-gradient(180deg, #f8fafc 0%, #eef2f7 50%, #f8fafc 100%);
}

.ui-site-shell .ui-blog-page .ui-blog-index__orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(2px);
    opacity: 0.45;
}

.ui-site-shell .ui-blog-page .ui-blog-index__orb--one {
    width: 18rem;
    height: 18rem;
    top: -4rem;
    right: -2rem;
    background: radial-gradient(circle, color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent), transparent 70%);
}

.ui-site-shell .ui-blog-page .ui-blog-index__orb--two {
    width: 14rem;
    height: 14rem;
    left: -3rem;
    bottom: 12%;
    background: radial-gradient(circle, rgba(15, 23, 42, 0.1), transparent 70%);
}

.ui-site-shell .ui-blog-page #blog_part.ui-blog-index .container {
    position: relative;
    z-index: 1;
}

.ui-site-shell .ui-blog-page .ui-blog-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
    padding: 1.35rem 1.4rem;
    border-radius: 24px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.06);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell .ui-blog-page .ui-blog-toolbar {
        -webkit-backdrop-filter: blur(14px) saturate(1.15);
        backdrop-filter: blur(14px) saturate(1.15);
    }
}

.ui-site-shell .ui-blog-page .ui-blog-toolbar__eyebrow {
    margin: 0 0 0.4rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 85%, #0f172a);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ui-site-shell .ui-blog-page .ui-blog-toolbar__title {
    margin: 0 0 0.4rem;
    color: #0f172a;
    font-size: clamp(1.65rem, 1.3rem + 1.2vw, 2.2rem);
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.15;
}

.ui-site-shell .ui-blog-page .ui-blog-toolbar__subtitle {
    margin: 0;
    color: #64748b;
    font-size: 0.98rem;
    line-height: 1.5;
}

.ui-site-shell .ui-blog-page .ui-blog-toolbar__count {
    display: inline-block;
    margin-left: 0.35rem;
    padding: 0.12rem 0.55rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 10%, #fff);
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 85%, #0f172a);
    font-size: 0.78rem;
    font-weight: 700;
}

.ui-site-shell .ui-blog-page .ui-blog-search {
    display: flex;
    align-items: stretch;
    gap: 0.5rem;
    width: min(100%, 360px);
    padding: 0.35rem;
    border-radius: 999px;
    border: 1px solid rgba(15, 23, 42, 0.1);
    background: #fff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}

.ui-site-shell .ui-blog-page .ui-blog-search input[type="search"] {
    flex: 1 1 auto;
    min-width: 0;
    border: 0;
    background: transparent;
    padding: 0.55rem 0.9rem;
    color: #0f172a;
    font-size: 0.95rem;
    outline: none;
}

.ui-site-shell .ui-blog-page .ui-blog-search input[type="search"]::placeholder {
    color: #94a3b8;
}

.ui-site-shell .ui-blog-page .ui-blog-search__submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    border: 0;
    border-radius: 999px;
    padding: 0.55rem 1rem;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 92%, #fff);
    color: #fff;
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1.2;
    box-shadow: 0 8px 20px color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent);
    transition: filter 160ms ease, transform 160ms ease;
}

.ui-site-shell .ui-blog-page .ui-blog-search__submit:hover,
.ui-site-shell .ui-blog-page .ui-blog-search__submit:focus-visible {
    filter: brightness(1.05);
    transform: translateY(-1px);
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-blog-page .ui-blog-categories {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin: 0 0 1.85rem;
    padding: 0.65rem;
    border-radius: 999px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.55);
}

.ui-site-shell .ui-blog-page .ui-blog-categories__chip {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 0.9rem;
    border-radius: 999px;
    border: 1px solid transparent;
    background: transparent;
    color: #334155;
    font-size: 0.875rem;
    font-weight: 650;
    text-decoration: none;
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.ui-site-shell .ui-blog-page .ui-blog-categories__chip span {
    min-width: 1.35rem;
    padding: 0.1rem 0.4rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.06);
    color: #64748b;
    font-size: 0.75rem;
    text-align: center;
}

.ui-site-shell .ui-blog-page .ui-blog-categories__chip:hover,
.ui-site-shell .ui-blog-page .ui-blog-categories__chip:focus-visible {
    background: #fff;
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 30%, transparent);
    color: var(--colorPrimary, #6366F1);
    outline: none;
}

.ui-site-shell .ui-blog-page .ui-blog-categories__chip:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 25%, transparent);
}

.ui-site-shell .ui-blog-page .ui-blog-categories__chip.is-active {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 92%, #fff);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 8px 20px color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent);
}

.ui-site-shell .ui-blog-page .ui-blog-categories__chip.is-active span {
    background: rgba(255, 255, 255, 0.22);
    color: #fff;
}

/* Featured magazine lead */
.ui-site-shell .ui-blog-page .single_blog.ui-blog-feature {
    position: relative;
    display: block;
    min-height: 420px;
    margin: 0 0 1.75rem;
    border-radius: 28px;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: #0f172a;
    box-shadow: 0 28px 60px rgba(15, 23, 42, 0.16);
}

.ui-site-shell .ui-blog-page .ui-blog-feature__media {
    position: absolute;
    inset: 0;
    display: block;
    max-height: none;
}

.ui-site-shell .ui-blog-page .ui-blog-feature__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.02);
    transition: transform 600ms ease;
}

.ui-site-shell .ui-blog-page .ui-blog-feature__veil {
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg, rgba(15, 23, 42, 0.88) 0%, rgba(15, 23, 42, 0.55) 48%, rgba(15, 23, 42, 0.2) 100%);
    pointer-events: none;
}

.ui-site-shell .ui-blog-page .text.ui-blog-feature__glass {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: 420px;
    max-width: 36rem;
    padding: 2rem 1.75rem;
}

.ui-site-shell .ui-blog-page .ui-blog-feature__badge {
    align-self: flex-start;
    margin-bottom: 0.75rem;
    padding: 0.28rem 0.7rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.24);
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.ui-site-shell .ui-blog-page .ui-blog-feature__category {
    align-self: flex-start;
    margin-bottom: 0.7rem;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 88%, #fff);
    color: #fff;
}

.ui-site-shell .ui-blog-page .ui-blog-feature__meta span {
    color: rgba(248, 250, 252, 0.78);
}

.ui-site-shell .ui-blog-page .ui-blog-feature__meta span i {
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 70%, #fff);
}

.ui-site-shell .ui-blog-page .ui-blog-feature .ui-blog-card__heading {
    margin: 0 0 0.55rem;
}

.ui-site-shell .ui-blog-page .ui-blog-feature .title {
    display: inline;
    margin: 0;
    color: #fff;
    font-size: clamp(1.55rem, 1.2rem + 1.3vw, 2.25rem);
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.2;
    text-transform: none;
    -webkit-line-clamp: 3;
}

.ui-site-shell .ui-blog-page .ui-blog-feature .title:hover,
.ui-site-shell .ui-blog-page .ui-blog-feature .title:focus-visible {
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, #fff);
}

.ui-site-shell .ui-blog-page .ui-blog-feature .title:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.85);
    outline-offset: 3px;
}

.ui-site-shell .ui-blog-page .ui-blog-feature p {
    margin: 0 0 1.15rem;
    color: rgba(248, 250, 252, 0.78);
    font-size: 1rem;
    line-height: 1.6;
    -webkit-line-clamp: 3;
}

.ui-site-shell .ui-blog-page .ui-blog-feature .read_btn {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.7rem 1.1rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    font-size: 0.9rem;
    font-weight: 700;
    text-decoration: none;
}

.ui-site-shell .ui-blog-page .ui-blog-feature .read_btn::after {
    display: none;
}

.ui-site-shell .ui-blog-page .ui-blog-feature .read_btn i {
    font-size: 0.72rem;
    transition: transform 180ms ease;
}

.ui-site-shell .ui-blog-page .ui-blog-feature .read_btn:hover,
.ui-site-shell .ui-blog-page .ui-blog-feature .read_btn:focus-visible {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 90%, #fff);
    border-color: transparent;
    color: #fff;
}

.ui-site-shell .ui-blog-page .ui-blog-feature .read_btn:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.9);
    outline-offset: 3px;
}

.ui-site-shell .ui-blog-page .ui-blog-feature .read_btn:hover i,
.ui-site-shell .ui-blog-page .ui-blog-feature .read_btn:focus-visible i {
    transform: translateX(3px);
}

.ui-site-shell .ui-blog-page .single_blog.ui-blog-feature:hover .ui-blog-feature__media img {
    transform: scale(1.06);
}

/* Grid cards */
.ui-site-shell .ui-blog-page .ui-blog-grid {
    margin-top: 0.25rem;
}

.ui-site-shell .ui-blog-page .single_blog.ui-blog-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    margin-top: 0;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 16px 36px rgba(15, 23, 42, 0.07);
    overflow: hidden;
    transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell .ui-blog-page .single_blog.ui-blog-card {
        -webkit-backdrop-filter: blur(8px);
        backdrop-filter: blur(8px);
    }
}

.ui-site-shell .ui-blog-page .single_blog.ui-blog-card:hover {
    transform: translateY(-5px);
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent);
    box-shadow: 0 24px 48px rgba(15, 23, 42, 0.12);
}

.ui-site-shell .ui-blog-page .ui-blog-card__media.img {
    position: relative;
    display: block;
    max-height: none;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #e2e8f0;
}

.ui-site-shell .ui-blog-page .ui-blog-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 420ms ease;
}

.ui-site-shell .ui-blog-page .ui-blog-card__shade {
    position: absolute;
    inset: auto 0 0;
    height: 42%;
    background: linear-gradient(180deg, transparent, rgba(15, 23, 42, 0.28));
    pointer-events: none;
}

.ui-site-shell .ui-blog-page .single_blog.ui-blog-card:hover .ui-blog-card__media img {
    transform: scale(1.06);
}

.ui-site-shell .ui-blog-page .ui-blog-card__body.text {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    padding: 1.2rem 1.2rem 1.3rem;
}

.ui-site-shell .ui-blog-page .ui-blog-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.9rem;
    margin-bottom: 0.55rem;
}

.ui-site-shell .ui-blog-page .ui-blog-card__meta span {
    margin: 0;
    color: #64748b;
    font-size: 0.8125rem;
    font-weight: 500;
    text-transform: none;
}

.ui-site-shell .ui-blog-page .ui-blog-card__meta span i {
    color: #94a3b8;
    margin-right: 0.3rem;
}

.ui-site-shell .ui-blog-page .ui-blog-card__category {
    align-self: flex-start;
    margin-bottom: 0.55rem;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 10%, #fff);
    color: var(--colorPrimary, #6366F1);
    font-size: 0.75rem;
    font-weight: 700;
    text-decoration: none;
    line-height: 1.3;
}

.ui-site-shell .ui-blog-page .ui-blog-card__category:hover,
.ui-site-shell .ui-blog-page .ui-blog-card__category:focus-visible {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 16%, #fff);
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-blog-page .ui-blog-card__heading,
.ui-site-shell .ui-blog-page .ui-blog-feature .ui-blog-card__heading {
    margin: 0 0 0.55rem;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}

.ui-site-shell .ui-blog-page .ui-blog-card .title {
    display: inline;
    margin: 0;
    color: var(--ui-color-text, #0f172a);
    font-size: 1.12rem;
    font-weight: 750;
    letter-spacing: -0.02em;
    line-height: 1.35;
    text-transform: none;
    -webkit-line-clamp: 2;
}

.ui-site-shell .ui-blog-page .ui-blog-card .title:hover,
.ui-site-shell .ui-blog-page .ui-blog-card .title:focus-visible {
    color: var(--colorPrimary, #6366F1);
}

.ui-site-shell .ui-blog-page .ui-blog-card .title:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-blog-page .ui-blog-card p {
    margin: 0 0 1.1rem;
    color: #64748b;
    font-size: 0.95rem;
    line-height: 1.55;
    -webkit-line-clamp: 3;
}

.ui-site-shell .ui-blog-page .ui-blog-card .read_btn {
    margin-top: auto;
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0;
    background: transparent;
    border: 0;
    color: var(--colorPrimary, #6366F1);
    font-size: 0.9rem;
    font-weight: 700;
    text-decoration: none;
    box-shadow: none;
}

.ui-site-shell .ui-blog-page .ui-blog-card .read_btn::after {
    display: none;
}

.ui-site-shell .ui-blog-page .ui-blog-card .read_btn i {
    font-size: 0.75rem;
    margin: 0;
    transition: transform 160ms ease;
}

.ui-site-shell .ui-blog-page .ui-blog-card .read_btn:hover,
.ui-site-shell .ui-blog-page .ui-blog-card .read_btn:focus-visible {
    color: #0f172a;
    background: transparent;
}

.ui-site-shell .ui-blog-page .ui-blog-card .read_btn:hover i,
.ui-site-shell .ui-blog-page .ui-blog-card .read_btn:focus-visible i {
    transform: translateX(3px);
}

.ui-site-shell .ui-blog-page .ui-blog-card .read_btn:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 3px;
}

.ui-site-shell .ui-blog-page .ui-blog-pagination {
    margin-top: 2.25rem;
}

.ui-site-shell .ui-blog-page #pagination .pagination {
    justify-content: center;
    gap: 0.35rem;
    flex-wrap: wrap;
}

.ui-site-shell .ui-blog-page #pagination .page-link {
    border-radius: 12px;
    border-color: rgba(15, 23, 42, 0.1);
    color: #334155;
    font-weight: 650;
    background: rgba(255, 255, 255, 0.85);
}

.ui-site-shell .ui-blog-page #pagination .page-item.active .page-link {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 92%, #fff);
    border-color: transparent;
    color: #fff;
}

.ui-site-shell .ui-blog-page #pagination .page-link:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-blog-page .ui-blog-empty {
    text-align: center;
    max-width: 34rem;
    margin: 1rem auto 0;
    padding: 2.75rem 1.5rem;
    border-radius: 22px;
    border: 1px dashed rgba(15, 23, 42, 0.16);
    background: rgba(255, 255, 255, 0.78);
}

.ui-site-shell .ui-blog-page .ui-blog-empty__title {
    margin: 0 0 0.45rem;
    color: #0f172a;
    font-size: 1.25rem;
    font-weight: 750;
}

.ui-site-shell .ui-blog-page .ui-blog-empty__text {
    margin: 0 0 1.15rem;
    color: #64748b;
}

.ui-site-shell .ui-blog-page .ui-blog-empty__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.7rem 1.2rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 92%, #fff);
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}

.ui-site-shell .ui-blog-page .ui-blog-empty__cta:hover,
.ui-site-shell .ui-blog-page .ui-blog-empty__cta:focus-visible {
    filter: brightness(1.05);
    color: #fff;
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

@media (max-width: 767.98px) {
    .ui-site-shell .ui-blog-page .ui-blog-toolbar {
        align-items: stretch;
        border-radius: 20px;
        padding: 1.15rem 1.1rem;
    }

    .ui-site-shell .ui-blog-page .ui-blog-search {
        width: 100%;
    }

    .ui-site-shell .ui-blog-page .ui-blog-search__submit span {
        display: none;
    }

    .ui-site-shell .ui-blog-page .ui-blog-categories {
        margin-bottom: 1.35rem;
        flex-wrap: nowrap;
        overflow-x: auto;
        border-radius: 18px;
        padding-bottom: 0.55rem;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    .ui-site-shell .ui-blog-page .ui-blog-categories__chip {
        flex: 0 0 auto;
    }

    .ui-site-shell .ui-blog-page .single_blog.ui-blog-feature,
    .ui-site-shell .ui-blog-page .text.ui-blog-feature__glass {
        min-height: 360px;
    }

    .ui-site-shell .ui-blog-page .ui-blog-feature__veil {
        background: linear-gradient(180deg, rgba(15, 23, 42, 0.2) 10%, rgba(15, 23, 42, 0.88) 100%);
    }

    .ui-site-shell .ui-blog-page .text.ui-blog-feature__glass {
        max-width: none;
        padding: 1.35rem 1.15rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell .ui-blog-page .single_blog.ui-blog-card,
    .ui-site-shell .ui-blog-page .single_blog.ui-blog-feature,
    .ui-site-shell .ui-blog-page .ui-blog-card__media img,
    .ui-site-shell .ui-blog-page .ui-blog-feature__media img,
    .ui-site-shell .ui-blog-page .ui-blog-card .read_btn i,
    .ui-site-shell .ui-blog-page .ui-blog-feature .read_btn i,
    .ui-site-shell .ui-blog-page .ui-blog-search__submit {
        transition: none !important;
    }

    .ui-site-shell .ui-blog-page .single_blog.ui-blog-card:hover,
    .ui-site-shell .ui-blog-page .ui-blog-search__submit:hover {
        transform: none;
    }

    .ui-site-shell .ui-blog-page .single_blog.ui-blog-card:hover .ui-blog-card__media img,
    .ui-site-shell .ui-blog-page .single_blog.ui-blog-feature:hover .ui-blog-feature__media img,
    .ui-site-shell .ui-blog-page .ui-blog-card .read_btn:hover i,
    .ui-site-shell .ui-blog-page .ui-blog-card .read_btn:focus-visible i {
        transform: none;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-blog-page .ui-blog-index__atmosphere {
        background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 50%, #f8fafc 100%);
    }

    .ui-site-shell .ui-blog-page .ui-blog-toolbar__eyebrow,
    .ui-site-shell .ui-blog-page .ui-blog-card .read_btn,
    .ui-site-shell .ui-blog-page .ui-blog-card .title:hover {
        color: #6366F1;
    }

    .ui-site-shell .ui-blog-page .ui-blog-search__submit,
    .ui-site-shell .ui-blog-page .ui-blog-categories__chip.is-active,
    .ui-site-shell .ui-blog-page .ui-blog-empty__cta,
    .ui-site-shell .ui-blog-page #pagination .page-item.active .page-link,
    .ui-site-shell .ui-blog-page .ui-blog-feature__category,
    .ui-site-shell .ui-blog-page .ui-blog-feature .read_btn:hover {
        background: #6366F1;
    }

    .ui-site-shell .ui-blog-page .ui-blog-card__category {
        background: #ffffff;
        color: #6366F1;
    }
}

/* ========================================================================== */
/* Blog detail                                                                 */
/* Scope: .ui-site-shell .ui-blog-page.ui-blog-show                            */
/* Keeps #blog_details / .main_blog / .blog_sidebar hooks.                     */
/* ========================================================================== */

.ui-site-shell .ui-blog-page.ui-blog-show #blog_details.ui-blog-details {
    padding: 2.75rem 0 3.5rem;
}

.ui-site-shell .ui-blog-show .ui-blog-article {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.07);
    border-radius: 22px;
    padding: 1.25rem;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.06);
}

.ui-site-shell .ui-blog-show .ui-blog-article__media.main_blog_img {
    max-height: none;
    aspect-ratio: 16 / 9;
    border-radius: 16px;
    overflow: hidden;
    background: #e2e8f0;
}

.ui-site-shell .ui-blog-show .ui-blog-article__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.ui-site-shell .ui-blog-show .ui-blog-article__meta.main_blog_header {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem 0.35rem;
    align-items: center;
    padding: 1.15rem 0.15rem 0;
    margin: 0;
    list-style: none;
}

.ui-site-shell .ui-blog-show .ui-blog-article__meta li {
    margin: 0;
}

.ui-site-shell .ui-blog-show .ui-blog-article__meta li a,
.ui-site-shell .ui-blog-show .ui-blog-article__meta li span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin: 0;
    padding: 0.3rem 0.75rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.04);
    border: 1px solid rgba(15, 23, 42, 0.06);
    color: #64748b;
    font-size: 0.8125rem;
    font-weight: 600;
    text-decoration: none;
    text-transform: none;
}

.ui-site-shell .ui-blog-show .ui-blog-article__meta li a::after {
    display: none;
}

.ui-site-shell .ui-blog-show .ui-blog-article__meta li a i,
.ui-site-shell .ui-blog-show .ui-blog-article__meta li span i {
    margin: 0;
    color: #94a3b8;
}

.ui-site-shell .ui-blog-show .ui-blog-article__meta li a:hover,
.ui-site-shell .ui-blog-show .ui-blog-article__meta li a:focus-visible {
    color: var(--colorPrimary, #6366F1);
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 30%, transparent);
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 8%, #fff);
    outline: none;
}

.ui-site-shell .ui-blog-show .ui-blog-article__meta li a:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 22%, transparent);
}

.ui-site-shell .ui-blog-show .ui-blog-article__title,
.ui-site-shell .ui-blog-show .main_blog h1.ui-blog-article__title {
    margin: 1.15rem 0 1rem;
    color: #0f172a;
    font-size: clamp(1.55rem, 2.6vw, 2.15rem);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.25;
    text-transform: none;
}

.ui-site-shell .ui-blog-show .ui-blog-article__content {
    max-width: min(100%, 72ch);
    color: var(--ui-color-text, #0f172a);
    font-size: 1.02rem;
    line-height: 1.75;
}

.ui-site-shell .ui-blog-show .ui-blog-article__content > *:first-child {
    margin-top: 0;
}

.ui-site-shell .ui-blog-show .ui-blog-article__content h1,
.ui-site-shell .ui-blog-show .ui-blog-article__content h2,
.ui-site-shell .ui-blog-show .ui-blog-article__content h3,
.ui-site-shell .ui-blog-show .ui-blog-article__content h4,
.ui-site-shell .ui-blog-show .ui-blog-article__content h5,
.ui-site-shell .ui-blog-show .ui-blog-article__content h6 {
    margin: 1.5rem 0 0.75rem;
    color: #0f172a;
    font-weight: 700;
    letter-spacing: -0.015em;
    line-height: 1.3;
    background: transparent !important;
}

.ui-site-shell .ui-blog-show .ui-blog-article__content p {
    margin: 0 0 1rem;
    color: #475569;
    font-size: 1.02rem;
    line-height: 1.75;
    background: transparent !important;
}

.ui-site-shell .ui-blog-show .ui-blog-article__content ul,
.ui-site-shell .ui-blog-show .ui-blog-article__content ol {
    margin: 0 0 1.15rem;
    padding-left: 1.25rem;
    color: #475569;
}

.ui-site-shell .ui-blog-show .ui-blog-article__content li {
    margin: 0.35rem 0;
}

.ui-site-shell .ui-blog-show .ui-blog-article__content img {
    max-width: 100%;
    height: auto;
    border-radius: 14px;
    margin: 0.75rem 0 1.15rem;
}

.ui-site-shell .ui-blog-show .ui-blog-article__content pre,
.ui-site-shell .ui-blog-show .ui-blog-article__content table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.ui-site-shell .ui-blog-show .ui-blog-article__content a {
    color: var(--colorPrimary, #6366F1);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.ui-site-shell .ui-blog-show .ui-blog-article__content a:hover,
.ui-site-shell .ui-blog-show .ui-blog-article__content a:focus-visible {
    color: #0f172a;
}

.ui-site-shell .ui-blog-show .ui-blog-comments.blog_comment_area {
    margin-top: 2.5rem;
    padding-top: 1.75rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.ui-site-shell .ui-blog-show .ui-blog-comments__heading {
    margin: 0 0 1.15rem;
    color: #0f172a;
    font-size: 1.2rem;
    font-weight: 700;
    text-transform: none;
}

.ui-site-shell .ui-blog-show .ui-blog-comments__empty {
    margin: 0 0 1.25rem;
    color: #64748b;
}

.ui-site-shell .ui-blog-show .ui-blog-comment.wsus__single_comment {
    display: flex;
    gap: 0.9rem;
    align-items: flex-start;
    margin: 0 0 1rem;
    padding: 1rem 0 1.1rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    overflow: visible;
}

.ui-site-shell .ui-blog-show .ui-blog-comment:last-of-type {
    margin-bottom: 1.35rem;
}

.ui-site-shell .ui-blog-show .ui-blog-comment__avatar.wsus__single_comment_img,
.ui-site-shell .ui-blog-show .ui-blog-comment__body.wsus__single_comment_text {
    float: none;
    width: auto;
    padding: 0;
}

.ui-site-shell .ui-blog-show .ui-blog-comment__avatar {
    flex: 0 0 auto;
}

.ui-site-shell .ui-blog-show .ui-blog-comment__avatar img {
    width: 56px !important;
    height: 56px !important;
    border-radius: 999px;
    object-fit: cover;
    border: 2px solid #fff;
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.08);
}

.ui-site-shell .ui-blog-show .ui-blog-comment__body {
    flex: 1 1 auto;
    min-width: 0;
}

.ui-site-shell .ui-blog-show .ui-blog-comment__body h5 {
    margin: 0 0 0.2rem !important;
    color: #0f172a;
    font-size: 0.98rem;
    font-weight: 700;
    text-transform: none;
    justify-content: flex-start;
}

.ui-site-shell .ui-blog-show .ui-blog-comment__body > span {
    display: inline-block;
    margin-bottom: 0.45rem;
    color: #94a3b8;
    font-size: 0.8rem;
    font-weight: 500;
    text-transform: none;
}

.ui-site-shell .ui-blog-show .ui-blog-comment__body p {
    margin: 0;
    color: #475569;
    font-size: 0.95rem;
    line-height: 1.55;
}

.ui-site-shell .ui-blog-show #blog_details .input_comment.ui-blog-comment-form {
    margin-top: 0.5rem;
    padding: 1.25rem;
    border-radius: 16px;
    border: 1px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 18%, transparent);
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 6%, #fff);
}

.ui-site-shell .ui-blog-show #blog_details .input_comment h5 {
    margin: 0 0 0.9rem;
    color: #0f172a;
    font-size: 1.05rem;
    font-weight: 700;
    text-transform: none;
}

.ui-site-shell .ui-blog-show .blog_single_input textarea {
    margin-bottom: 0.85rem;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 12px;
    background: #fff;
    min-height: 120px;
}

.ui-site-shell .ui-blog-show .blog_single_input textarea:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 18%, transparent);
}

.ui-site-shell .ui-blog-show .ui-blog-comment-form__error {
    margin: -0.35rem 0 0.75rem;
    color: #b91c1c;
    font-size: 0.875rem;
}

.ui-site-shell .ui-blog-show .blog_single_input button.read_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1.25rem;
    border-radius: 999px;
    background: var(--colorPrimary, #6366F1);
    border: 0;
    color: #fff;
    font-weight: 650;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--colorPrimary, #6366F1) 26%, transparent);
    transition: filter 160ms ease;
}

.ui-site-shell .ui-blog-show .blog_single_input button.read_btn:hover,
.ui-site-shell .ui-blog-show .blog_single_input button.read_btn:focus-visible {
    filter: brightness(1.05);
    background: var(--colorPrimary, #6366F1);
    color: #fff;
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-blog-show .ui-blog-comments__login {
    margin-top: 0.5rem;
    border-radius: 14px;
    border: 1px solid rgba(245, 158, 11, 0.28);
    background: rgba(255, 251, 235, 0.95);
    color: #92400e;
}

.ui-site-shell .ui-blog-show .ui-blog-comments__login a {
    color: var(--colorPrimary, #6366F1);
    font-weight: 650;
}

/* Sidebar */
.ui-site-shell .ui-blog-show .ui-blog-sidebar {
    position: sticky;
    top: var(--ui-chrome-nav-offset, 96px);
}

.ui-site-shell .ui-blog-show .ui-blog-sidebar__card {
    margin-bottom: 1rem;
    padding: 1.2rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.07);
    background: #fff;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.05);
}

.ui-site-shell .ui-blog-show .ui-blog-sidebar__card:last-child {
    margin-bottom: 0;
    padding-bottom: 1.2rem;
}

.ui-site-shell .ui-blog-show .blog_sidebar h4 {
    margin: 0 0 0.95rem;
    color: #0f172a;
    font-size: 1.05rem;
    font-weight: 700;
    text-transform: none;
}

.ui-site-shell .ui-blog-show .ui-blog-sidebar__empty {
    margin: 0;
    color: #94a3b8;
    font-size: 0.9rem;
}

.ui-site-shell .ui-blog-show .blog_search form {
    display: flex;
    align-items: stretch;
    gap: 0;
}

.ui-site-shell .ui-blog-show .blog_search input {
    flex: 1 1 auto;
    min-width: 0;
    padding: 0.7rem 0.9rem;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-right: 0;
    border-radius: 12px 0 0 12px;
    font-size: 0.92rem;
    color: #0f172a;
}

.ui-site-shell .ui-blog-show .blog_search input:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 16%, transparent);
}

.ui-site-shell .ui-blog-show .blog_search button {
    position: static;
    top: auto;
    right: auto;
    padding: 0.7rem 0.95rem;
    border-radius: 0 12px 12px 0;
    background: var(--colorPrimary, #6366F1);
    font-size: 0.95rem;
}

.ui-site-shell .ui-blog-show .blog_search button:hover,
.ui-site-shell .ui-blog-show .blog_search button:focus-visible {
    background: var(--colorPrimary, #6366F1);
    filter: brightness(1.05);
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 40%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-blog-show .blog_category ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ui-site-shell .ui-blog-show .blog_category ul li a {
    align-items: center;
    margin-bottom: 0.35rem;
    padding: 0.55rem 0.35rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 8px;
    color: #334155;
    font-weight: 600;
    transition: background-color 150ms ease, color 150ms ease;
}

.ui-site-shell .ui-blog-show .blog_category ul li a span {
    min-width: 1.5rem;
    padding: 0.1rem 0.4rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.06);
    color: #64748b;
    font-size: 0.75rem;
    text-align: center;
}

.ui-site-shell .ui-blog-show .blog_category ul li a:hover,
.ui-site-shell .ui-blog-show .blog_category ul li a:focus-visible {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 8%, #fff);
    color: var(--colorPrimary, #6366F1);
    outline: none;
}

.ui-site-shell .ui-blog-show .blog_category ul li a:hover span,
.ui-site-shell .ui-blog-show .blog_category ul li a:focus-visible span {
    color: var(--colorPrimary, #6366F1);
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 14%, #fff);
}

.ui-site-shell .ui-blog-show .ui-blog-popular.sidebar_blog_single {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    margin: 0 0 0.85rem;
    padding: 0.35rem;
    border-radius: 12px;
    text-decoration: none;
    transition: background-color 150ms ease;
}

.ui-site-shell .ui-blog-show .ui-blog-popular:last-child {
    margin-bottom: 0;
}

.ui-site-shell .ui-blog-show .ui-blog-popular:hover,
.ui-site-shell .ui-blog-show .ui-blog-popular:focus-visible {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 7%, #fff);
    outline: none;
}

.ui-site-shell .ui-blog-show .ui-blog-popular__media.sidebar_blog_img,
.ui-site-shell .ui-blog-show .ui-blog-popular__body.sidebar_blog_text {
    float: none;
    width: auto;
    padding: 0;
}

.ui-site-shell .ui-blog-show .ui-blog-popular__media {
    flex: 0 0 72px;
    width: 72px;
    height: 72px;
    border-radius: 12px;
    overflow: hidden;
    background: #e2e8f0;
}

.ui-site-shell .ui-blog-show .ui-blog-popular__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.ui-site-shell .ui-blog-show .ui-blog-popular__body {
    flex: 1 1 auto;
    min-width: 0;
}

.ui-site-shell .ui-blog-show .ui-blog-popular__body h5 {
    margin: 0;
    color: #0f172a;
    font-size: 0.92rem;
    font-weight: 650;
    line-height: 1.35;
    text-transform: none;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ui-site-shell .ui-blog-show .ui-blog-popular:hover .ui-blog-popular__body h5,
.ui-site-shell .ui-blog-show .ui-blog-popular:focus-visible .ui-blog-popular__body h5 {
    color: var(--colorPrimary, #6366F1);
}

.ui-site-shell .ui-blog-show .ui-blog-popular__body p {
    margin: 0.35rem 0 0;
    color: #94a3b8;
    font-size: 0.78rem;
    text-transform: none;
}

.ui-site-shell .ui-blog-show .ui-blog-popular__body p span {
    margin-right: 0.55rem;
    padding-right: 0.55rem;
    border-right: 1px solid rgba(15, 23, 42, 0.12);
}

@media (max-width: 991.98px) {
    .ui-site-shell .ui-blog-show .ui-blog-sidebar {
        position: static;
    }

    .ui-site-shell .ui-blog-show .ui-blog-article {
        padding: 1rem;
    }

    .ui-site-shell .ui-blog-show .ui-blog-article__title,
    .ui-site-shell .ui-blog-show .main_blog h1.ui-blog-article__title {
        font-size: 1.45rem;
    }
}

@media (max-width: 575.98px) {
    .ui-site-shell .ui-blog-show .ui-blog-comment.wsus__single_comment {
        gap: 0.7rem;
    }

    .ui-site-shell .ui-blog-show .ui-blog-comment__avatar img {
        width: 44px !important;
        height: 44px !important;
    }

    .ui-site-shell .ui-blog-show .ui-blog-popular__media {
        flex-basis: 64px;
        width: 64px;
        height: 64px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell .ui-blog-show .blog_category ul li a,
    .ui-site-shell .ui-blog-show .ui-blog-popular,
    .ui-site-shell .ui-blog-show .blog_single_input button.read_btn,
    .ui-site-shell .ui-blog-show .blog_search button {
        transition: none !important;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-blog-show #blog_details .input_comment.ui-blog-comment-form {
        background: #ffffff;
        border-color: #c7d2fe;
    }

    .ui-site-shell .ui-blog-show .blog_category ul li a:hover,
    .ui-site-shell .ui-blog-show .blog_category ul li a:focus-visible,
    .ui-site-shell .ui-blog-show .ui-blog-popular:hover,
    .ui-site-shell .ui-blog-show .ui-blog-popular:focus-visible {
        background: #eef2ff;
    }
}

/* ========================================================================== */
/* Contact page ? modern glass layout                                          */
/* Scope: .ui-site-shell .ui-contact-page                                      */
/* Keeps #get_in_touch / .contact_box / .contact_input / .contact_map hooks.    */
/* ========================================================================== */

.ui-site-shell .ui-contact-page {
    padding-bottom: 0;
}

.ui-site-shell .ui-contact-page #breadcrumb_part.ui-page-hero {
    margin-bottom: 0;
}

.ui-site-shell .ui-contact-page #get_in_touch.ui-contact {
    position: relative;
    overflow: hidden;
    padding: 0;
}

.ui-site-shell .ui-contact-page .ui-contact__atmosphere {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 50% 40% at 8% 12%, color-mix(in srgb, var(--colorPrimary, #6366F1) 12%, transparent), transparent 70%),
        radial-gradient(ellipse 45% 35% at 95% 80%, rgba(14, 165, 233, 0.1), transparent 65%),
        linear-gradient(180deg, #f8fafc 0%, #eef2f7 50%, #f8fafc 100%);
}

.ui-site-shell .ui-contact-page #get_in_touch.ui-contact > .container {
    position: relative;
    z-index: 1;
    padding-top: 3rem;
    padding-bottom: 3.5rem;
}

.ui-site-shell .ui-contact-page .ui-contact__intro {
    margin-bottom: 1.5rem;
}

.ui-site-shell .ui-contact-page .ui-contact__eyebrow {
    margin: 0 0 0.45rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 85%, #0f172a);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ui-site-shell .ui-contact-page .ui-contact__intro h2 {
    margin: 0 0 0.65rem;
    color: #0f172a;
    font-size: clamp(1.65rem, 1.3rem + 1.2vw, 2.15rem);
    font-weight: 750;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.ui-site-shell .ui-contact-page .ui-contact__lead {
    margin: 0;
    max-width: 32rem;
    color: #64748b;
    font-size: 1rem;
    line-height: 1.65;
}

.ui-site-shell .ui-contact-page .ui-contact__channels {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.ui-site-shell .ui-contact-page .contact_box.ui-contact-channel {
    display: flex;
    align-items: center;
    gap: 0;
    margin: 0;
    text-align: left;
    text-decoration: none;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
    overflow: hidden;
    transition: transform 200ms ease, border-color 200ms ease, box-shadow 200ms ease;
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell .ui-contact-page .contact_box.ui-contact-channel {
        -webkit-backdrop-filter: blur(12px) saturate(1.15);
        backdrop-filter: blur(12px) saturate(1.15);
        background: rgba(255, 255, 255, 0.72);
    }
}

.ui-site-shell .ui-contact-page .contact_box.ui-contact-channel:hover,
.ui-site-shell .ui-contact-page .contact_box.ui-contact-channel:focus-visible {
    transform: translateY(-3px);
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 30%, rgba(15, 23, 42, 0.08));
    box-shadow: 0 20px 44px rgba(15, 23, 42, 0.1);
    outline: none;
}

.ui-site-shell .ui-contact-page .ui-contact-channel--static:hover {
    transform: none;
}

.ui-site-shell .ui-contact-page .contact_box_icon.ui-contact-channel__icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4.5rem;
    min-height: 5rem;
    padding: 0;
    border-right: 1px solid rgba(15, 23, 42, 0.06);
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 8%, #fff);
}

.ui-site-shell .ui-contact-page .contact_box_icon.ui-contact-channel__icon i {
    font-size: 1.35rem;
    color: var(--colorPrimary, #6366F1);
}

.ui-site-shell .ui-contact-page .contact_box_text.ui-contact-channel__body {
    flex: 1 1 auto;
    width: auto;
    padding: 1rem 1.15rem;
}

.ui-site-shell .ui-contact-page .ui-contact-channel__label {
    display: block;
    margin-bottom: 0.2rem;
    color: #94a3b8;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.ui-site-shell .ui-contact-page .ui-contact-channel__value,
.ui-site-shell .ui-contact-page .contact_box_text.ui-contact-channel__body a,
.ui-site-shell .ui-contact-page .contact_box_text.ui-contact-channel__body p {
    display: block;
    margin: 0;
    color: #0f172a;
    font-size: 1rem;
    font-weight: 650;
    line-height: 1.4;
    word-break: break-word;
}

.ui-site-shell .ui-contact-page .ui-contact__panel {
    height: 100%;
    padding: 1.75rem 1.6rem 1.6rem;
    border-radius: calc(var(--ui-radius-md, 16px) + 8px);
    border: 1px solid var(--ui-color-border, rgba(15, 23, 42, 0.08));
    background: color-mix(in srgb, var(--ui-color-surface, #ffffff) 88%, transparent);
    box-shadow: var(--ui-shadow-soft, 0 14px 34px rgba(15, 23, 42, 0.06));
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell .ui-contact-page .ui-contact__panel {
        -webkit-backdrop-filter: blur(16px) saturate(1.2);
        backdrop-filter: blur(16px) saturate(1.2);
        background: color-mix(in srgb, var(--ui-color-surface, #ffffff) 78%, transparent);
    }
}

.ui-site-shell .ui-contact-page .ui-contact__panel-head {
    margin-bottom: 1.35rem;
}

.ui-site-shell .ui-contact-page .ui-contact__panel-head h3,
.ui-site-shell .ui-contact-page .ui-contact__panel-title {
    margin: 0 0 0.35rem;
    color: var(--ui-color-text, #0f172a);
    font-size: 1.35rem;
    font-weight: 750;
    letter-spacing: -0.01em;
}

.ui-site-shell .ui-contact-page .ui-contact__panel-head p {
    margin: 0;
    color: var(--ui-color-muted, #6b7280);
    font-size: 0.95rem;
    line-height: 1.5;
}

.ui-site-shell .ui-contact-page .contact_input.ui-contact__field {
    margin: 0;
}

.ui-site-shell .ui-contact-page .contact_input.ui-contact__field label {
    display: block;
    margin-bottom: 0.4rem;
    color: var(--ui-color-text, #0f172a);
    font-size: 0.88rem;
    font-weight: 650;
}

.ui-site-shell .ui-contact-page .contact_input.ui-contact__field input,
.ui-site-shell .ui-contact-page .contact_input.ui-contact__field textarea {
    width: 100%;
    margin: 0;
    padding: 0.85rem 1rem;
    border: 1px solid var(--ui-color-border, rgba(15, 23, 42, 0.12));
    border-radius: var(--ui-radius-sm, 10px);
    background: var(--ui-color-surface, #ffffff);
    color: var(--ui-color-text, #0f172a);
    font-size: 0.95rem;
    font-weight: 500;
    resize: vertical;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.ui-site-shell .ui-contact-page .contact_input.ui-contact__field input::placeholder,
.ui-site-shell .ui-contact-page .contact_input.ui-contact__field textarea::placeholder {
    color: #94a3b8;
}

.ui-site-shell .ui-contact-page .contact_input.ui-contact__field input:focus,
.ui-site-shell .ui-contact-page .contact_input.ui-contact__field textarea:focus {
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 55%, #cbd5e1);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 18%, transparent);
    outline: none;
}

.ui-site-shell .ui-contact-page .contact_input.ui-contact__field input.is-invalid,
.ui-site-shell .ui-contact-page .contact_input.ui-contact__field textarea.is-invalid {
    border-color: #e11d48;
}

.ui-site-shell .ui-contact-page .ui-contact__error {
    display: block;
    margin-top: 0.35rem;
    color: #e11d48;
    font-size: 0.82rem;
    font-weight: 600;
}

.ui-site-shell .ui-contact-page .read_btn.ui-contact__submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-height: 48px;
    margin-top: 0.35rem;
    padding: 0.8rem 1.4rem;
    border: 0;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 92%, #fff);
    color: #fff;
    font-size: 0.95rem;
    font-weight: 700;
    text-transform: none;
    box-shadow: 0 12px 28px color-mix(in srgb, var(--colorPrimary, #6366F1) 28%, transparent);
    transition: transform 180ms ease, filter 180ms ease, box-shadow 180ms ease;
}

.ui-site-shell .ui-contact-page .read_btn.ui-contact__submit i {
    font-size: 0.85rem;
}

.ui-site-shell .ui-contact-page .read_btn.ui-contact__submit:hover,
.ui-site-shell .ui-contact-page .read_btn.ui-contact__submit:focus-visible {
    filter: brightness(1.04);
    transform: translateY(-2px);
    color: #fff;
    outline: none;
    box-shadow: 0 16px 34px color-mix(in srgb, var(--colorPrimary, #6366F1) 34%, transparent);
}

.ui-site-shell .ui-contact-page .read_btn.ui-contact__submit:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 3px;
}

.ui-site-shell .ui-contact-page .ui-contact__map-wrap {
    margin-top: 2.5rem;
}

.ui-site-shell .ui-contact-page .contact_map.ui-contact__map {
    margin: 0;
    border: 1px solid var(--ui-color-border, rgba(15, 23, 42, 0.08));
    border-radius: calc(var(--ui-radius-md, 16px) + 6px);
    overflow: hidden;
    background: var(--ui-color-surface, #ffffff);
    box-shadow: var(--ui-shadow-soft, 0 14px 34px rgba(15, 23, 42, 0.06));
}

.ui-site-shell .ui-contact-page .contact_map.ui-contact__map iframe,
.ui-site-shell .ui-contact-page .contact_map.ui-contact__map > * {
    display: block;
    width: 100% !important;
    min-height: 360px;
    border: 0 !important;
}

@media (max-width: 991.98px) {
    .ui-site-shell .ui-contact-page #get_in_touch.ui-contact > .container {
        padding-top: 2.25rem;
        padding-bottom: 2.75rem;
    }

    .ui-site-shell .ui-contact-page .ui-contact__panel {
        padding: 1.4rem 1.2rem 1.25rem;
    }
}

@media (max-width: 575.98px) {
    .ui-site-shell .ui-contact-page .contact_box_icon.ui-contact-channel__icon {
        width: 3.75rem;
        min-height: 4.5rem;
    }

    .ui-site-shell .ui-contact-page .read_btn.ui-contact__submit {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell .ui-contact-page .contact_box.ui-contact-channel,
    .ui-site-shell .ui-contact-page .read_btn.ui-contact__submit {
        transition: none !important;
    }

    .ui-site-shell .ui-contact-page .contact_box.ui-contact-channel:hover,
    .ui-site-shell .ui-contact-page .contact_box.ui-contact-channel:focus-visible,
    .ui-site-shell .ui-contact-page .read_btn.ui-contact__submit:hover,
    .ui-site-shell .ui-contact-page .read_btn.ui-contact__submit:focus-visible {
        transform: none;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-contact-page .ui-contact__atmosphere {
        background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 50%, #f8fafc 100%);
    }

    .ui-site-shell .ui-contact-page .ui-contact__eyebrow {
        color: #6366F1;
    }

    .ui-site-shell .ui-contact-page .contact_box_icon.ui-contact-channel__icon {
        background: #ffffff;
    }

    .ui-site-shell .ui-contact-page .contact_box.ui-contact-channel:hover,
    .ui-site-shell .ui-contact-page .contact_box.ui-contact-channel:focus-visible {
        border-color: rgba(99, 102, 241, 0.3);
    }

    .ui-site-shell .ui-contact-page .contact_input.ui-contact__field input:focus,
    .ui-site-shell .ui-contact-page .contact_input.ui-contact__field textarea:focus {
        border-color: #6366F1;
        box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.18);
    }

    .ui-site-shell .ui-contact-page .read_btn.ui-contact__submit {
        background: #6366F1;
        box-shadow: 0 12px 28px rgba(99, 102, 241, 0.28);
    }
}

/* ==========================================================================
   Public typography system (Plus Jakarta Sans)
   ==========================================================================
   Scoped entirely to .ui-site-shell (public <body> class); never loaded by
   the admin layout. Base rules use :where() so they carry (0,1,0)
   specificity: intentional legacy component styles (e.g. white hero text,
   white counter headings) keep winning without needing !important.
   ========================================================================== */

.ui-site-shell {
    /* Single public UI font */
    --font-sans: "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

    /* Repoint legacy theme + ui-system font tokens to the same stack */
    --headingFont: var(--font-sans);
    --paraFont: var(--font-sans);
    --ui-font-heading: var(--font-sans);
    --ui-font-body: var(--font-sans);

    /* Text color hierarchy (WCAG AA on the light shell background) */
    --text-primary: #1f2937;
    --text-body: #4b5563;
    --text-muted: #6b7280;

    --font-size-body: 1rem;
    --line-height-body: 1.65;

    font-family: var(--font-sans);
    font-size: var(--font-size-body);
    line-height: var(--line-height-body);
}

/* Form controls do not inherit font-family by default */
.ui-site-shell :where(input, textarea, select, button) {
    font-family: inherit;
}

/* --------------------------------------------------------------------------
   Heading scale ? responsive, restrained. :where() keeps specificity low so
   audited component headings (overridden further below) and legacy
   white-on-dark headings are unaffected.
   -------------------------------------------------------------------------- */

.ui-site-shell :where(h1, h2, h3, h4, h5, h6) {
    font-family: var(--headingFont);
    color: var(--text-primary);
    line-height: 1.25;
}

.ui-site-shell :where(h1) {
    font-size: clamp(1.875rem, 1.35rem + 1.9vw, 2.375rem); /* 30-38px */
    font-weight: 700;
}

.ui-site-shell :where(h2) {
    font-size: clamp(1.5rem, 1.2rem + 1.2vw, 1.875rem); /* 24-30px */
    font-weight: 700;
}

.ui-site-shell :where(h3) {
    font-size: clamp(1.25rem, 1.08rem + 0.7vw, 1.5rem); /* 20-24px */
    font-weight: 600;
}

.ui-site-shell :where(h4) {
    font-size: clamp(1.125rem, 1.04rem + 0.35vw, 1.25rem); /* 18-20px */
    font-weight: 600;
}

.ui-site-shell :where(h5) {
    font-size: clamp(1rem, 0.95rem + 0.3vw, 1.125rem); /* 16-18px */
    font-weight: 600;
}

.ui-site-shell :where(h6) {
    font-size: 0.9375rem; /* 15px */
    font-weight: 600;
}

/* --------------------------------------------------------------------------
   Body copy ? overrides the legacy global p flattening (p, span { 16px })
   at low specificity; component-specific paragraph styles still win.
   span is intentionally left alone (icons, badges, prices, counters).
   -------------------------------------------------------------------------- */

.ui-site-shell :where(p) {
    font-size: var(--font-size-body);
    font-weight: 400;
    line-height: var(--line-height-body);
    color: var(--text-body);
}

.ui-site-shell :where(input, textarea)::placeholder {
    color: var(--text-muted);
}

/* --------------------------------------------------------------------------
   Hero (home banner only ? not applied to every h1)
   -------------------------------------------------------------------------- */

.ui-site-shell .wsus__banner_text h1 {
    font-size: clamp(2.125rem, 1.1rem + 4.4vw, 3.5rem); /* ~34px mobile - 56px desktop */
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.01em;
}

/* --------------------------------------------------------------------------
   Page + section titles (audited legacy selectors, normalized sizes)
   -------------------------------------------------------------------------- */

/* Breadcrumb page title (was fixed 48px) */
.ui-site-shell #breadcrumb_part h1,
.ui-site-shell #breadcrumb_part .ui-page-hero__title {
    font-size: clamp(1.875rem, 1.35rem + 1.9vw, 2.375rem); /* 30-38px */
    font-weight: 700;
    line-height: 1.2;
}

/* Section headings (was fixed 35px / weight 600) */
.ui-site-shell .wsus__heading_area h2 {
    font-size: clamp(1.5rem, 1.2rem + 1.2vw, 1.875rem); /* 24-30px */
    font-weight: 700;
}

/* Login / register titles (was fixed 42px) */
.ui-site-shell .wsus__login_area h2 {
    font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.25rem); /* 28-36px */
    line-height: 1.2;
}

/* Listing detail body title (visual metadata; page H1 is page-hero) */
.ui-site-shell .listing_det_header_text .listing_det_header_title {
    font-size: clamp(1.5rem, 1.2rem + 1.2vw, 1.875rem); /* 24-30px */
    font-weight: 700;
    line-height: 1.25;
}

/* --------------------------------------------------------------------------
   Navigation and header chrome (typography only; layout, sticky behavior,
   dropdown logic, and promo/topbar behavior untouched)
   -------------------------------------------------------------------------- */

.ui-site-shell .main_menu .nav-link {
    font-size: 0.875rem; /* 14px */
    font-weight: 600;
    letter-spacing: 0.01em;
}

.ui-site-shell .main_menu .menu_droapdown a {
    font-size: 0.875rem;
    font-weight: 500;
}

/* Add Listing CTA ? also neutralizes the legacy unloaded 'Poppins' rule */
.ui-site-shell .main_menu .user_btn {
    font-family: var(--font-sans);
    font-size: 0.9375rem; /* 15px */
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: 0.01em;
}

/* Topbar typography (aligned with ink utility rail) */
.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__link {
    font-size: 0.8125rem;
    font-weight: 500;
}

.ui-site-shell .ui-chrome-topbar .ui-chrome-topbar__account,
.ui-site-shell .ui-chrome-topbar .wsus__topbar_right a {
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}

/* --------------------------------------------------------------------------
   Buttons and forms
   -------------------------------------------------------------------------- */

.ui-site-shell .common_btn {
    font-size: 0.9375rem; /* 15px */
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: 0.01em;
}

.ui-site-shell form label {
    font-size: 0.875rem; /* 14px */
    font-weight: 600;
}

/* Checkbox/option labels stay lighter than field labels */
.ui-site-shell form .form-check label,
.ui-site-shell .amenities_check_area label {
    font-size: 0.9375rem;
    font-weight: 500;
}

/* --------------------------------------------------------------------------
   Cards (grid-card titles already 20px/600 via .wsus__featured_single_text a)
   -------------------------------------------------------------------------- */

/* List-view card title (was fixed 30px on an h6) */
.ui-site-shell .list_view .wsus__featured_single_text h6 {
    font-size: 1.25rem; /* 20px */
    font-weight: 700;
    line-height: 1.3;
}

/* List-view card metadata (size set by theme at 13px; align weight) */
.ui-site-shell .list_view .wsus__featured_single_text .list_details {
    font-weight: 500;
}

/* Blog card titles (was fixed 30px) */
.ui-site-shell .main_blog h4 {
    font-size: clamp(1.25rem, 1.08rem + 0.7vw, 1.5rem); /* 20-24px */
    font-weight: 700;
    line-height: 1.3;
}

/* ========================================================================== */
/* Checkout v2 - single payment panel (package card removed from checkout)    */
/* Scope: .ui-site-shell .ui-billing-page.ui-checkout-page                    */
/* ========================================================================== */

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 20px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.08);
    padding: 2.25rem 2rem 1.75rem;
    overflow: hidden;
    position: relative;
}

/* Brand accent ribbon along the top edge */
.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 5px;
    background: linear-gradient(90deg,
        var(--colorPrimary, #6366F1),
        color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, #22d3ee));
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__head {
    text-align: center;
    margin-bottom: 1.5rem;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.3rem 0.85rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 10%, #fff);
    color: var(--colorPrimary, #6366F1);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    margin-bottom: 0.9rem;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__head h2.ui-checkout-panel__title,
.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__head h3 {
    color: var(--ui-color-text, #0f172a);
    font-weight: 700;
    font-size: clamp(1.35rem, 2.2vw, 1.7rem);
    margin-bottom: 0.4rem;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__head p {
    color: var(--ui-color-muted, #6b7280);
    font-size: 0.95rem;
    margin: 0;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__head p strong {
    color: var(--ui-color-text, #0f172a);
}

/* Slim total strip (replaces the removed package card) */
.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    padding: 0.9rem 1.15rem;
    border-radius: var(--ui-radius-md, 16px);
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 6%, var(--ui-color-surface, #ffffff));
    border: 1px dashed color-mix(in srgb, var(--colorPrimary, #6366F1) 30%, transparent);
    margin-bottom: 1.6rem;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__summary-label {
    color: var(--ui-color-muted, #6b7280);
    font-size: 0.88rem;
    font-weight: 600;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__summary-amount {
    color: var(--ui-color-text, #0f172a);
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.1;
    white-space: normal;
    text-align: right;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__summary-amount small {
    color: #64748b;
    font-size: 0.8rem;
    font-weight: 600;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__hint {
    color: #94a3b8;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 0.75rem;
}

/* Payment method rows */
.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-methods {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.95rem 1.1rem;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 14px;
    background: #fff;
    text-decoration: none;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method:hover,
.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method:focus-visible {
    border-color: color-mix(in srgb, var(--brandColor, var(--colorPrimary, #6366F1)) 45%, transparent);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.1);
    transform: translateY(-2px);
    outline: none;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brandColor, var(--colorPrimary, #6366F1)) 30%, transparent);
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method__logo {
    flex: 0 0 auto;
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    font-size: 1.35rem;
    background: color-mix(in srgb, var(--brandColor, #6366F1) 10%, #fff);
    color: var(--brandColor, #6366F1);
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method__logo--monogram {
    font-weight: 800;
    font-size: 1.25rem;
    font-family: inherit;
}

/* Brand accents per provider */
.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method--paypal { --brandColor: #0070ba; }
.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method--stripe { --brandColor: #635bff; }
.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method--razorpay { --brandColor: #0f68e0; }
.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method--chapa { --brandColor: #0f9d58; }
.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method--offline { --brandColor: #b45309; }

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method__info {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method__name {
    color: #0f172a;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method__name small {
    color: #94a3b8;
    font-size: 0.78rem;
    font-weight: 600;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method__desc {
    color: #64748b;
    font-size: 0.85rem;
    line-height: 1.4;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method__arrow {
    flex: 0 0 auto;
    color: #cbd5e1;
    font-size: 1rem;
    transition: color 160ms ease, transform 160ms ease;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method:hover .ui-checkout-method__arrow,
.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method:focus-visible .ui-checkout-method__arrow {
    color: var(--brandColor, var(--colorPrimary, #6366F1));
    transform: translateX(4px);
}

/* Empty state when no gateway is active */
.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-empty {
    text-align: center;
    padding: 2rem 1rem;
    border: 1px dashed rgba(15, 23, 42, 0.15);
    border-radius: 14px;
    background: #f8fafc;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-empty i {
    font-size: 2rem;
    color: #94a3b8;
    margin-bottom: 0.75rem;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-empty h5 {
    color: #0f172a;
    font-weight: 700;
    font-size: 1.05rem;
    margin-bottom: 0.35rem;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-empty p {
    color: #64748b;
    font-size: 0.9rem;
    margin: 0 auto;
    max-width: 24rem;
}

/* Trust footer */
.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__trust {
    margin-top: 1.6rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(15, 23, 42, 0.07);
    text-align: center;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__trust p {
    color: #64748b;
    font-size: 0.83rem;
    line-height: 1.5;
    margin: 0 auto 0.75rem;
    max-width: 28rem;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__trust p i {
    color: #16a34a;
    margin-right: 0.3rem;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__back {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--colorPrimary, #6366F1);
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
}

.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__back:hover,
.ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__back:focus-visible {
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 80%, #0f172a);
    text-decoration: underline;
    outline: none;
}

@media (max-width: 575.98px) {
    .ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel {
        padding: 1.75rem 1.15rem 1.4rem;
    }

    .ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__summary {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }

    .ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method__logo {
        width: 42px;
        height: 42px;
        font-size: 1.15rem;
    }

    .ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method__desc {
        font-size: 0.8rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method,
    .ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method__arrow {
        transition: none !important;
        transform: none !important;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel::before {
        background: var(--colorPrimary, #6366F1);
    }

    .ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__badge {
        background: #eef2ff;
    }

    .ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-panel__summary {
        background: #f8fafc;
        border-color: #c7d2fe;
    }

    .ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method:hover,
    .ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method:focus-visible {
        border-color: #c7d2fe;
    }

    .ui-site-shell .ui-billing-page.ui-checkout-page .ui-checkout-method__logo {
        background: #eef2ff;
    }
}

/* -------------------------------------------------------------------------- */
/* Legal documents: privacy-policy / terms-and-condition                      */
/* Scope: .ui-site-shell .ui-legal-page                                       */
/* Keeps #breadcrumb_part / #wsus__custom_page hooks.                         */
/* -------------------------------------------------------------------------- */

.ui-site-shell .ui-legal-page #breadcrumb_part.ui-page-hero {
    margin-bottom: 0;
}

.ui-site-shell .ui-legal-page #wsus__custom_page.ui-legal {
    position: relative;
    overflow: hidden;
    padding: 0;
}

.ui-site-shell .ui-legal-page .ui-legal__atmosphere {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 48% 40% at 8% 10%, color-mix(in srgb, var(--colorPrimary, #6366F1) 14%, transparent), transparent 70%),
        radial-gradient(ellipse 42% 34% at 96% 78%, rgba(15, 23, 42, 0.06), transparent 68%),
        linear-gradient(180deg, #f8fafc 0%, #eef2f7 48%, #f8fafc 100%);
}

.ui-site-shell .ui-legal-page .ui-legal__ink {
    position: absolute;
    border-radius: 50%;
    filter: blur(2px);
    opacity: 0.5;
}

.ui-site-shell .ui-legal-page .ui-legal__ink--a {
    width: 18rem;
    height: 18rem;
    top: -5rem;
    right: -3rem;
    background: radial-gradient(circle, color-mix(in srgb, var(--colorPrimary, #6366F1) 36%, transparent), transparent 70%);
}

.ui-site-shell .ui-legal-page .ui-legal__ink--b {
    width: 14rem;
    height: 14rem;
    left: -2.5rem;
    bottom: 12%;
    background: radial-gradient(circle, rgba(30, 41, 59, 0.12), transparent 70%);
}

.ui-site-shell .ui-legal-page #wsus__custom_page.ui-legal > .container {
    position: relative;
    z-index: 1;
    padding-top: 3rem;
    padding-bottom: 3.75rem;
}

.ui-site-shell .ui-legal-page .ui-legal__intro {
    margin-bottom: 1.35rem;
}

.ui-site-shell .ui-legal-page .ui-legal__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin: 0 0 0.55rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 88%, #0f172a);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ui-site-shell .ui-legal-page .ui-legal__eyebrow-mark {
    width: 1.35rem;
    height: 2px;
    border-radius: 999px;
    background: var(--colorPrimary, #6366F1);
}

.ui-site-shell .ui-legal-page .ui-legal__title {
    margin: 0 0 0.7rem;
    color: #0f172a;
    font-size: clamp(1.7rem, 1.35rem + 1.3vw, 2.25rem);
    font-weight: 750;
    letter-spacing: -0.025em;
    line-height: 1.18;
}

.ui-site-shell .ui-legal-page .ui-legal__lead {
    margin: 0 0 0.85rem;
    max-width: 40rem;
    color: #64748b;
    font-size: 1.02rem;
    line-height: 1.65;
}

.ui-site-shell .ui-legal-page .ui-legal__meta {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0;
    color: #94a3b8;
    font-size: 0.88rem;
    font-weight: 500;
}

.ui-site-shell .ui-legal-page .ui-legal__meta i {
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 70%, #94a3b8);
}

.ui-site-shell .ui-legal-page .ui-legal__panel {
    border-radius: 22px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.06);
    padding: clamp(1.35rem, 1rem + 1.2vw, 2.15rem);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ui-site-shell .ui-legal-page .ui-legal__panel {
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
    }
}

.ui-site-shell .ui-legal-page .ui-legal__content {
    max-width: min(100%, 72ch);
    color: var(--ui-color-text, #0f172a);
    font-size: 1.02rem;
    line-height: 1.75;
}

.ui-site-shell .ui-legal-page .ui-legal__content > *:first-child {
    margin-top: 0;
}

.ui-site-shell .ui-legal-page .ui-legal__content > *:last-child {
    margin-bottom: 0;
}

.ui-site-shell .ui-legal-page .ui-legal__content h1,
.ui-site-shell .ui-legal-page .ui-legal__content h2,
.ui-site-shell .ui-legal-page .ui-legal__content h3,
.ui-site-shell .ui-legal-page .ui-legal__content h4,
.ui-site-shell .ui-legal-page .ui-legal__content h5,
.ui-site-shell .ui-legal-page .ui-legal__content h6 {
    margin: 1.55rem 0 0.7rem;
    color: #0f172a;
    font-weight: 700;
    letter-spacing: -0.015em;
    line-height: 1.3;
    background: transparent !important;
}

.ui-site-shell .ui-legal-page .ui-legal__content h2 {
    font-size: 1.28rem;
    padding-bottom: 0.45rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.ui-site-shell .ui-legal-page .ui-legal__content h3 {
    font-size: 1.12rem;
}

.ui-site-shell .ui-legal-page .ui-legal__content p {
    margin: 0 0 1rem;
    color: #475569;
    font-size: 1.02rem;
    line-height: 1.75;
    background: transparent !important;
}

.ui-site-shell .ui-legal-page .ui-legal__content ul,
.ui-site-shell .ui-legal-page .ui-legal__content ol {
    margin: 0 0 1.15rem;
    padding-left: 1.25rem;
    color: #475569;
}

.ui-site-shell .ui-legal-page .ui-legal__content li {
    margin: 0.4rem 0;
}

.ui-site-shell .ui-legal-page .ui-legal__content a {
    color: var(--colorPrimary, #6366F1);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.ui-site-shell .ui-legal-page .ui-legal__content a:hover,
.ui-site-shell .ui-legal-page .ui-legal__content a:focus-visible {
    color: #0f172a;
}

.ui-site-shell .ui-legal-page .ui-legal__content img {
    max-width: 100%;
    height: auto;
    border-radius: 14px;
    margin: 0.75rem 0 1.15rem;
}

.ui-site-shell .ui-legal-page .ui-legal__content pre,
.ui-site-shell .ui-legal-page .ui-legal__content table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.ui-site-shell .ui-legal-page .ui-legal__content table {
    width: 100%;
    margin: 0 0 1.25rem;
    border-collapse: collapse;
    font-size: 0.95rem;
}

.ui-site-shell .ui-legal-page .ui-legal__content th,
.ui-site-shell .ui-legal-page .ui-legal__content td {
    padding: 0.65rem 0.75rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    text-align: left;
    vertical-align: top;
}

.ui-site-shell .ui-legal-page .ui-legal__content th {
    background: #f8fafc;
    color: #0f172a;
    font-weight: 650;
}

.ui-site-shell .ui-legal-page .ui-legal__empty {
    text-align: center;
    padding: 2.25rem 1rem;
}

.ui-site-shell .ui-legal-page .ui-legal__empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    margin-bottom: 1rem;
    border-radius: 16px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 12%, #fff);
    color: var(--colorPrimary, #6366F1);
    font-size: 1.35rem;
}

.ui-site-shell .ui-legal-page .ui-legal__empty h2 {
    margin: 0 0 0.5rem;
    color: #0f172a;
    font-size: 1.25rem;
    font-weight: 700;
}

.ui-site-shell .ui-legal-page .ui-legal__empty p {
    margin: 0 auto 1.25rem;
    max-width: 28rem;
    color: #64748b;
    line-height: 1.6;
}

.ui-site-shell .ui-legal-page .ui-legal__empty-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.65rem;
    padding: 0.65rem 1.15rem;
    border-radius: 12px;
    background: var(--colorPrimary, #6366F1);
    color: #fff !important;
    font-weight: 650;
    text-decoration: none !important;
    transition: transform 180ms ease, filter 180ms ease;
}

.ui-site-shell .ui-legal-page .ui-legal__empty-cta:hover,
.ui-site-shell .ui-legal-page .ui-legal__empty-cta:focus-visible {
    filter: brightness(1.05);
    transform: translateY(-1px);
}

.ui-site-shell .ui-legal-page .ui-legal__empty-cta:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-legal-page .ui-legal__aside {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    position: sticky;
    top: 6.5rem;
}

.ui-site-shell .ui-legal-page .ui-legal__card {
    border-radius: 20px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.05);
    padding: 1.25rem 1.2rem;
}

.ui-site-shell .ui-legal-page .ui-legal__card--accent {
    background:
        linear-gradient(165deg, color-mix(in srgb, var(--colorPrimary, #6366F1) 10%, #fff) 0%, #fff 55%);
}

.ui-site-shell .ui-legal-page .ui-legal__card-title {
    margin: 0 0 0.9rem;
    color: #0f172a;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.ui-site-shell .ui-legal-page .ui-legal__card-text {
    margin: 0 0 1rem;
    color: #64748b;
    font-size: 0.95rem;
    line-height: 1.6;
}

.ui-site-shell .ui-legal-page .ui-legal__nav {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.ui-site-shell .ui-legal-page .ui-legal__nav-link {
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
    padding: 0.8rem 0.85rem;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.07);
    background: #f8fafc;
    text-decoration: none;
    color: inherit;
    transition: border-color 180ms ease, background 180ms ease, transform 180ms ease;
}

.ui-site-shell .ui-legal-page .ui-legal__nav-link:hover,
.ui-site-shell .ui-legal-page .ui-legal__nav-link:focus-visible {
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, rgba(15, 23, 42, 0.12));
    background: #fff;
    transform: translateY(-1px);
}

.ui-site-shell .ui-legal-page .ui-legal__nav-link.is-active {
    border-color: color-mix(in srgb, var(--colorPrimary, #6366F1) 55%, rgba(15, 23, 42, 0.1));
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 8%, #fff);
    box-shadow: inset 3px 0 0 var(--colorPrimary, #6366F1);
}

.ui-site-shell .ui-legal-page .ui-legal__nav-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 2.35rem;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 12px;
    background: #fff;
    color: var(--colorPrimary, #6366F1);
    border: 1px solid rgba(15, 23, 42, 0.06);
}

.ui-site-shell .ui-legal-page .ui-legal__nav-copy {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.ui-site-shell .ui-legal-page .ui-legal__nav-copy strong {
    color: #0f172a;
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.3;
}

.ui-site-shell .ui-legal-page .ui-legal__nav-copy small {
    color: #94a3b8;
    font-size: 0.8rem;
    line-height: 1.35;
}

.ui-site-shell .ui-legal-page .ui-legal__aside-cta {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 2.6rem;
    padding: 0.6rem 1rem;
    border-radius: 12px;
    background: var(--colorPrimary, #6366F1);
    color: #fff !important;
    font-weight: 650;
    font-size: 0.92rem;
    text-decoration: none !important;
    transition: transform 180ms ease, filter 180ms ease;
}

.ui-site-shell .ui-legal-page .ui-legal__aside-cta:hover,
.ui-site-shell .ui-legal-page .ui-legal__aside-cta:focus-visible {
    filter: brightness(1.05);
    transform: translateY(-1px);
}

.ui-site-shell .ui-legal-page .ui-legal__aside-cta:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--colorPrimary, #6366F1) 45%, transparent);
    outline-offset: 2px;
}

.ui-site-shell .ui-legal-page .ui-legal__aside-cta i {
    font-size: 0.78rem;
}

@media (max-width: 991.98px) {
    .ui-site-shell .ui-legal-page .ui-legal__aside {
        position: static;
    }

    .ui-site-shell .ui-legal-page #wsus__custom_page.ui-legal > .container {
        padding-top: 2.25rem;
        padding-bottom: 2.75rem;
    }
}

@media (max-width: 575.98px) {
    .ui-site-shell .ui-legal-page .ui-legal__panel {
        border-radius: 18px;
        padding: 1.15rem;
    }

    .ui-site-shell .ui-legal-page .ui-legal__title {
        font-size: 1.55rem;
    }

    .ui-site-shell .ui-legal-page .ui-legal__empty-cta,
    .ui-site-shell .ui-legal-page .ui-legal__aside-cta {
        width: 100%;
        justify-content: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell .ui-legal-page .ui-legal__nav-link,
    .ui-site-shell .ui-legal-page .ui-legal__aside-cta,
    .ui-site-shell .ui-legal-page .ui-legal__empty-cta {
        transition: none;
    }

    .ui-site-shell .ui-legal-page .ui-legal__nav-link:hover,
    .ui-site-shell .ui-legal-page .ui-legal__nav-link:focus-visible,
    .ui-site-shell .ui-legal-page .ui-legal__aside-cta:hover,
    .ui-site-shell .ui-legal-page .ui-legal__aside-cta:focus-visible,
    .ui-site-shell .ui-legal-page .ui-legal__empty-cta:hover,
    .ui-site-shell .ui-legal-page .ui-legal__empty-cta:focus-visible {
        transform: none;
    }
}

/* -------------------------------------------------------------------------- */
/* Home: latest listings                                                       */
/* -------------------------------------------------------------------------- */

.ui-site-shell #ui_latest_listing.ui-latest-listings {
    position: relative;
    overflow: hidden;
    padding: 3.25rem 0 4rem;
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__atmosphere {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(ellipse 50% 40% at 88% 8%, color-mix(in srgb, var(--colorPrimary, #6366F1) 10%, transparent), transparent 70%),
        linear-gradient(180deg, #ffffff 0%, #f8fafc 55%, #ffffff 100%);
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .container {
    position: relative;
    z-index: 1;
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__header {
    margin-bottom: 1.5rem;
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__heading {
    margin-bottom: 0;
    text-align: left;
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__eyebrow {
    margin: 0 0 0.45rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 85%, #0f172a);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__heading h2 {
    margin-bottom: 0.5rem;
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__heading h2::before,
.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__heading h2::after {
    display: none;
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__heading p {
    margin: 0;
    max-width: 36rem;
    color: #64748b;
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__actions {
    display: flex;
    justify-content: flex-end;
    padding-bottom: 0.35rem;
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.7rem 1.15rem;
    border-radius: 999px;
    border: 1px solid rgba(15, 23, 42, 0.1);
    background: rgba(255, 255, 255, 0.85);
    color: #0f172a;
    font-size: 0.92rem;
    font-weight: 650;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
    transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__cta i {
    font-size: 0.75rem;
    transition: transform 180ms ease;
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__cta:hover,
.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__cta:focus-visible {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 92%, #fff);
    border-color: transparent;
    color: #fff;
    outline: none;
    transform: translateY(-2px);
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__cta:hover i,
.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__cta:focus-visible i {
    transform: translateX(3px);
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__badge {
    position: absolute;
    top: 0.85rem;
    right: 0.85rem;
    z-index: 2;
    padding: 0.28rem 0.65rem;
    border-radius: 999px;
    background: #0f172a;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    pointer-events: none;
}

.ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__empty {
    margin: 0.5rem auto 0;
    max-width: 30rem;
    padding: 1.25rem 1.1rem;
    border-radius: 16px;
    border: 1px dashed rgba(15, 23, 42, 0.14);
    background: rgba(255, 255, 255, 0.72);
    color: #64748b;
    text-align: center;
}

@media (max-width: 991.98px) {
    .ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__heading {
        text-align: center;
        margin-bottom: 1rem;
    }

    .ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__heading p {
        margin-left: auto;
        margin-right: auto;
    }

    .ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__actions {
        justify-content: center;
        padding-bottom: 0;
    }
}

@media (max-width: 767.98px) {
    .ui-site-shell #ui_latest_listing.ui-latest-listings {
        padding: 2.25rem 0 3rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__cta,
    .ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__cta i {
        transition: none !important;
    }

    .ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__cta:hover,
    .ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__cta:focus-visible {
        transform: none;
    }
}

/* -------------------------------------------------------------------------- */
/* Home: active offers                                                         */
/* -------------------------------------------------------------------------- */

.ui-site-shell #ui_active_offers.ui-home-offers {
    position: relative;
    overflow: hidden;
    padding: 3.25rem 0 4rem;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__atmosphere {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(ellipse 45% 40% at 10% 85%, rgba(14, 165, 233, 0.1), transparent 65%),
        radial-gradient(ellipse 40% 35% at 92% 15%, color-mix(in srgb, var(--colorPrimary, #6366F1) 12%, transparent), transparent 70%),
        linear-gradient(180deg, #f1f5f9 0%, #eef2f7 45%, #f8fafc 100%);
}

.ui-site-shell #ui_active_offers.ui-home-offers .container {
    position: relative;
    z-index: 1;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__header {
    margin-bottom: 1.5rem;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__heading {
    margin-bottom: 0;
    text-align: left;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__eyebrow {
    margin: 0 0 0.45rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 85%, #0f172a);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__heading h2 {
    margin-bottom: 0.5rem;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__heading h2::before,
.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__heading h2::after {
    display: none;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__heading p {
    margin: 0;
    max-width: 36rem;
    color: #64748b;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__actions {
    display: flex;
    justify-content: flex-end;
    padding-bottom: 0.35rem;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.7rem 1.15rem;
    border-radius: 999px;
    border: 1px solid rgba(15, 23, 42, 0.1);
    background: rgba(255, 255, 255, 0.78);
    color: #0f172a;
    font-size: 0.92rem;
    font-weight: 650;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
    transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__cta i {
    font-size: 0.75rem;
    transition: transform 180ms ease;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__cta:hover,
.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__cta:focus-visible {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 92%, #fff);
    border-color: transparent;
    color: #fff;
    outline: none;
    transform: translateY(-2px);
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__cta:hover i,
.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__cta:focus-visible i {
    transform: translateX(3px);
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 14px 36px rgba(15, 23, 42, 0.07);
    overflow: hidden;
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 20px 44px rgba(15, 23, 42, 0.12);
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__media {
    position: relative;
    display: block;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #e2e8f0;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 280ms ease;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card:hover .ui-offer-card__media img {
    transform: scale(1.04);
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__deal {
    position: absolute;
    top: 0.75rem;
    left: 0.75rem;
    padding: 0.28rem 0.65rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 94%, #fff);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 1rem 1.05rem 1.1rem;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__category {
    align-self: flex-start;
    margin-bottom: 0.45rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 88%, #0f172a);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-decoration: none;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__category:hover,
.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__category:focus-visible {
    text-decoration: underline;
    outline: none;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__title {
    margin: 0 0 0.4rem;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.35;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__title a {
    color: #0f172a;
    text-decoration: none;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__title a:hover,
.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__title a:focus-visible {
    color: var(--colorPrimary, #6366F1);
    outline: none;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__copy {
    margin: 0 0 0.65rem;
    color: #64748b;
    font-size: 0.9rem;
    line-height: 1.45;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__listing,
.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__place {
    margin: 0 0 0.25rem;
    color: #475569;
    font-size: 0.86rem;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__listing i,
.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__place i {
    margin-right: 0.35rem;
    color: #94a3b8;
    font-size: 0.75rem;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: auto;
    padding-top: 0.85rem;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__expiry {
    color: #64748b;
    font-size: 0.78rem;
    font-weight: 600;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__expiry--open {
    color: #0f766e;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__link {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--colorPrimary, #6366F1);
    font-size: 0.88rem;
    font-weight: 700;
    text-decoration: none;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__link i {
    font-size: 0.7rem;
    transition: transform 180ms ease;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__link:hover i,
.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__link:focus-visible i {
    transform: translateX(3px);
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__link:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 30%, transparent);
    border-radius: 6px;
}

.ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__empty {
    margin: 0.5rem auto 0;
    max-width: 30rem;
    padding: 1.25rem 1.1rem;
    border-radius: 16px;
    border: 1px dashed rgba(15, 23, 42, 0.14);
    background: rgba(255, 255, 255, 0.72);
    color: #64748b;
    text-align: center;
}

@media (max-width: 991.98px) {
    .ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__heading {
        text-align: center;
        margin-bottom: 1rem;
    }

    .ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__heading p {
        margin-left: auto;
        margin-right: auto;
    }

    .ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__actions {
        justify-content: center;
        padding-bottom: 0;
    }
}

@media (max-width: 767.98px) {
    .ui-site-shell #ui_active_offers.ui-home-offers {
        padding: 2.25rem 0 3rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__cta,
    .ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__cta i,
    .ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card,
    .ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__media img,
    .ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__link i {
        transition: none !important;
    }

    .ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__cta:hover,
    .ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__cta:focus-visible,
    .ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card:hover {
        transform: none;
    }

    .ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card:hover .ui-offer-card__media img {
        transform: none;
    }
}

/* -------------------------------------------------------------------------- */
/* Home: list-your-business CTA                                                */
/* -------------------------------------------------------------------------- */

.ui-site-shell #ui_business_cta.ui-business-cta {
    position: relative;
    overflow: hidden;
    padding: 2.5rem 0 3.25rem;
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__atmosphere {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(40px);
    opacity: 0.45;
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__orb--one {
    width: min(36vw, 280px);
    height: min(36vw, 280px);
    top: -20%;
    left: 8%;
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent);
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__orb--two {
    width: min(30vw, 220px);
    height: min(30vw, 220px);
    right: 10%;
    bottom: -25%;
    background: rgba(14, 165, 233, 0.28);
}

.ui-site-shell #ui_business_cta.ui-business-cta .container {
    position: relative;
    z-index: 1;
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__panel {
    position: relative;
    padding: 2rem 2.15rem;
    border-radius: 22px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background:
        linear-gradient(135deg, rgba(15, 23, 42, 0.96) 0%, #15233a 55%, #0f172a 100%);
    color: #f8fafc;
    box-shadow: 0 22px 50px rgba(15, 23, 42, 0.18);
    overflow: hidden;
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__panel::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 50% 70% at 100% 0%, color-mix(in srgb, var(--colorPrimary, #6366F1) 35%, transparent), transparent 60%);
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__panel > .row {
    position: relative;
    z-index: 1;
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__eyebrow {
    margin: 0 0 0.5rem;
    color: color-mix(in srgb, var(--colorPrimary, #6366F1) 70%, #fff);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__panel h2 {
    margin: 0 0 0.65rem;
    color: #fff;
    font-size: clamp(1.55rem, 2.4vw, 2.1rem);
    font-weight: 750;
    line-height: 1.2;
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__copy {
    margin: 0;
    max-width: 34rem;
    color: #cbd5e1;
    font-size: 1rem;
    line-height: 1.55;
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.75rem;
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-height: 2.85rem;
    padding: 0.7rem 1.25rem;
    border-radius: 999px;
    font-size: 0.95rem;
    font-weight: 700;
    text-decoration: none;
    transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn--primary {
    background: color-mix(in srgb, var(--colorPrimary, #6366F1) 94%, #fff);
    color: #fff;
    border: 1px solid transparent;
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn--primary i {
    font-size: 0.75rem;
    transition: transform 180ms ease;
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn--primary:hover,
.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn--primary:focus-visible {
    filter: brightness(1.05);
    color: #fff;
    outline: none;
    transform: translateY(-2px);
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn--primary:hover i,
.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn--primary:focus-visible i {
    transform: translateX(3px);
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn--ghost {
    border: 1px solid rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.06);
    color: #f8fafc;
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn--ghost:hover,
.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn--ghost:focus-visible {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.45);
    color: #fff;
    outline: none;
    transform: translateY(-2px);
}

.ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--colorPrimary, #6366F1) 40%, transparent);
}

@media (max-width: 991.98px) {
    .ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__panel {
        text-align: center;
        padding: 1.75rem 1.35rem;
    }

    .ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__copy {
        margin-left: auto;
        margin-right: auto;
    }

    .ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__actions {
        justify-content: center;
    }
}

@media (max-width: 575.98px) {
    .ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn,
    .ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn--primary i {
        transition: none !important;
    }

    .ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn:hover,
    .ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn:focus-visible {
        transform: none;
    }
}

@supports not (color: color-mix(in srgb, #000 50%, transparent)) {
    .ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__eyebrow,
    .ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__eyebrow,
    .ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__category {
        color: #f66542;
    }

    .ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__cta:hover,
    .ui-site-shell #ui_latest_listing.ui-latest-listings .ui-latest-listings__cta:focus-visible,
    .ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__cta:hover,
    .ui-site-shell #ui_active_offers.ui-home-offers .ui-home-offers__cta:focus-visible,
    .ui-site-shell #ui_active_offers.ui-home-offers .ui-offer-card__deal,
    .ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__btn--primary {
        background: #f66542;
    }

    .ui-site-shell #ui_business_cta.ui-business-cta .ui-business-cta__eyebrow {
        color: #fda4af;
    }
}

/* ========================================================================== */
/* Razorpay wait shell (bare page; no .ui-site-shell wrapper)                  */
/* ========================================================================== */

body.ui-razorpay-redirect {
    margin: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 1.5rem;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    color: #0f172a;
    background:
        radial-gradient(ellipse 60% 40% at 20% 0%, rgba(99, 102, 241, 0.14), transparent 60%),
        linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
}

body.ui-razorpay-redirect .ui-razorpay-redirect__shell {
    width: min(100%, 28rem);
    text-align: center;
    padding: 2rem 1.5rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

body.ui-razorpay-redirect .ui-razorpay-redirect__eyebrow {
    margin: 0 0 0.5rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #6b7280;
}

body.ui-razorpay-redirect .ui-razorpay-redirect__title {
    margin: 0 0 0.65rem;
    font-size: clamp(1.35rem, 1.1rem + 1vw, 1.7rem);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #0f172a;
}

body.ui-razorpay-redirect .ui-razorpay-redirect__message {
    margin: 0 0 0.85rem;
    color: #6b7280;
    line-height: 1.55;
}

body.ui-razorpay-redirect .ui-razorpay-redirect__warning {
    margin: 0 0 1.25rem;
    display: inline-block;
    padding: 0.45rem 0.8rem;
    border-radius: 10px;
    background: #fef2f2;
    color: #b91c1c;
    font-size: 0.85rem;
    font-weight: 700;
}

body.ui-razorpay-redirect .ui-razorpay-redirect__spinner {
    width: 2rem;
    height: 2rem;
    margin: 0 auto;
    border-radius: 999px;
    border: 3px solid rgba(99, 102, 241, 0.2);
    border-top-color: #6366f1;
    animation: ui-razorpay-spin 0.8s linear infinite;
}

body.ui-razorpay-redirect .ui-razorpay-redirect__noscript {
    width: min(100%, 28rem);
    margin: 0;
    padding: 0.85rem 1rem;
    border-radius: 12px;
    background: #fff7ed;
    color: #9a3412;
    text-align: center;
    line-height: 1.5;
}

@keyframes ui-razorpay-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    body.ui-razorpay-redirect .ui-razorpay-redirect__spinner {
        animation: none;
        border-top-color: rgba(99, 102, 241, 0.2);
        background: #6366f1;
    }
}
