/**
 * ATMID — هيدر وفوتر فاخران (Premium Chrome)
 * يعتمد على variables.css ويجب تحميله بعد layout.css
 */

:root {
    --chrome-header-accent-a: rgba(168, 85, 247, 0.45);
    --chrome-header-accent-b: rgba(245, 199, 107, 0.28);
}

.site-header.site-header--premium {
    --chrome-mouse-x: 50%;
    --chrome-mouse-y: 38%;
    --chrome-parallax-scr: 0px;
}

/* ─── Header shell ───────────────────────────────────────── */

.site-header.site-header--premium {
    width: min(1240px, calc(100% - clamp(0.85rem, 3vw, 2.25rem)));
    border-radius: clamp(22px, 5vw, 30px);
    border: 1px solid color-mix(in srgb, var(--accent-glow) 34%, transparent);
    background:
        radial-gradient(
            ellipse 120% 100% at var(--chrome-mouse-x, 50%) calc(-28% + var(--chrome-parallax-scr, 0px)),
            color-mix(in srgb, var(--accent-glow) 44%, transparent) 0%,
            transparent 58%
        ),
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--bg-elevated) 88%, transparent) 0%,
            color-mix(in srgb, var(--bg-subtle) 82%, transparent) 100%
        );
    backdrop-filter: blur(22px) saturate(156%);
    -webkit-backdrop-filter: blur(22px) saturate(156%);
    box-shadow:
        0 4px 0 color-mix(in srgb, #fff 0.09, transparent),
        0 20px 64px rgba(15, 23, 42, 0.1),
        0 0 48px color-mix(in srgb, var(--accent-glow) 18%, transparent),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    transition:
        transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.38s ease,
        border-color 0.38s ease,
        background 0.6s ease;
}

html.dark .site-header.site-header--premium {
    background:
        radial-gradient(
            ellipse 110% 90% at var(--chrome-mouse-x, 50%) -10%,
            color-mix(in srgb, var(--accent-glow) 52%, transparent) 0%,
            transparent 55%
        ),
        linear-gradient(
            160deg,
            color-mix(in srgb, #0f172a 70%, transparent) 0%,
            color-mix(in srgb, var(--bg-elevated) 58%, transparent) 45%,
            color-mix(in srgb, #050816 86%, transparent) 100%
        );
    border-color: color-mix(in srgb, var(--accent-glow) 38%, transparent);
    box-shadow:
        0 0 72px rgba(168, 85, 247, 0.18),
        0 24px 60px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

.site-header.site-header--premium.is-scrolled {
    transform: translateY(-0.06rem);
    border-color: color-mix(in srgb, var(--accent-glow) 48%, transparent);
    box-shadow:
        0 12px 48px rgba(15, 23, 42, 0.12),
        0 0 40px color-mix(in srgb, var(--accent-glow) 22%, transparent),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

html.dark .site-header.site-header--premium.is-scrolled {
    box-shadow:
        0 0 60px rgba(168, 85, 247, 0.24),
        0 20px 52px rgba(0, 0, 0, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.site-header__premium-fx {
    pointer-events: none;
    position: absolute;
    inset: 0;
    border-radius: inherit;
    overflow: hidden;
    z-index: 0;
}

.site-header__premium-fx::before {
    content: "";
    position: absolute;
    inset: -40%;
    background:
        radial-gradient(circle at 20% 20%, var(--chrome-header-accent-a), transparent 38%),
        radial-gradient(circle at 82% 8%, var(--chrome-header-accent-b), transparent 36%);
    opacity: 0.55;
    animation: chromeHeaderFloat 14s ease-in-out infinite alternate;
}

.site-header__premium-fx::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(
            rgba(255, 255, 255, 0.035) 1px,
            transparent 1px
        ),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size: 44px 44px;
    mask-image: radial-gradient(ellipse 90% 80% at 50% -10%, black, transparent);
    opacity: 0.45;
}

@keyframes chromeHeaderFloat {
    0% {
        transform: translate(0, 0) rotate(0deg);
    }
    50% {
        transform: translate(2%, 1%) rotate(1deg);
    }
    100% {
        transform: translate(-2%, -1%) rotate(-0.8deg);
    }
}

.site-header.site-header--premium .site-header__inner {
    position: relative;
    z-index: 1;
    padding: clamp(0.55rem, 1vw, 0.92rem) clamp(0.7rem, 2vw, 1.35rem);
}

.site-header.site-header--premium .site-header__top {
    gap: clamp(0.5rem, 1.2vw, 1rem);
}

/* ─── Logo ───────────────────────────────────────────────── */

.site-header.site-header--premium .site-logo {
    gap: clamp(0.42rem, 1vw, 0.72rem);
    border-radius: 18px;
    padding: 0.12rem 0.45rem 0.12rem 0;
    transition: transform 0.28s cubic-bezier(0.34, 1.35, 0.64, 1), filter 0.28s ease;
}

.site-header.site-header--premium .site-logo:hover {
    transform: translateY(-1px);
    filter: brightness(1.05);
}

.site-header.site-header--premium .site-logo__img {
    height: clamp(34px, 4.2vw, 44px);
    max-width: min(164px, 28vw);
    filter: drop-shadow(0 0 18px rgba(168, 85, 247, 0.35))
        drop-shadow(0 0 28px rgba(245, 199, 107, 0.12));
    transition: filter 0.3s ease, transform 0.3s ease;
}

.site-header.site-header--premium .site-logo:hover .site-logo__img {
    filter: drop-shadow(0 0 26px rgba(168, 85, 247, 0.55))
        drop-shadow(0 4px 20px rgba(245, 199, 107, 0.2));
}

.site-header.site-header--premium .site-logo__tagline {
    display: inline;
    opacity: 0.85;
}

@media (min-width: 900px) {
    .site-header.site-header--premium .site-logo__tagline {
        display: none;
    }
}

/* ─── Desktop nav links — animated underline ─────────────── */

.site-header.site-header--premium .site-nav__link {
    position: relative;
    overflow: visible;
    color: var(--text-muted);
    border-radius: 999px;
    padding: 0.48rem clamp(0.65rem, 1vw, 0.92rem);
    transition: color 0.26s ease, box-shadow 0.28s ease, transform 0.22s ease;
}

.site-header.site-header--premium .site-nav__link::after {
    content: "";
    position: absolute;
    inset-inline-start: 12%;
    inset-inline-end: 12%;
    bottom: 0.2rem;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(90deg, transparent, var(--accent-glow), var(--gold), transparent);
    transform: scaleX(0);
    transform-origin: center;
    opacity: 0;
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.25s ease;
}

.site-header.site-header--premium .site-nav__link:hover {
    color: var(--text);
    transform: translateY(-1px);
}

.site-header.site-header--premium .site-nav__link:hover::after,
.site-header.site-header--premium .site-nav__link.is-active::after {
    transform: scaleX(1);
    opacity: 1;
}

.site-header.site-header--premium .site-nav__link.is-active {
    color: #fff;
    background: var(--premium-gradient);
    box-shadow: var(--glow-accent-strong);
}

/* ─── Search ─────────────────────────────────────────────── */

.site-header.site-header--premium .site-search {
    border-radius: clamp(999px, 999px, var(--radius-pill));
    border: 1px solid color-mix(in srgb, var(--accent-glow) 30%, transparent);
    background: color-mix(in srgb, var(--bg-subtle) 42%, transparent);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 6px 24px rgba(15, 23, 42, 0.06);
    transition:
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        transform 0.25s ease;
}

html.dark .site-header.site-header--premium .site-search {
    background: color-mix(in srgb, var(--bg-elevated) 55%, transparent);
}

.site-header.site-header--premium .site-search:focus-within {
    border-color: var(--accent-glow);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 0 0 3px color-mix(in srgb, var(--accent-glow) 22%, transparent),
        0 12px 40px rgba(168, 85, 247, 0.12);
}

/* ─── CTA ────────────────────────────────────────────────── */

.site-header__cta-wrap {
    display: none;
    flex: 0 0 auto;
    align-items: center;
}

@media (min-width: 1181px) {
    .site-header__cta-wrap {
        display: flex;
    }
}

.site-header__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.42rem;
    padding: 0.48rem 1rem;
    min-height: 44px;
    border-radius: 999px;
    font-weight: 900;
    font-size: var(--fluid-text-xs);
    color: #fff;
    white-space: nowrap;
    border: 1px solid color-mix(in srgb, var(--accent-glow) 55%, transparent);
    background: linear-gradient(
        132deg,
        color-mix(in srgb, var(--accent-dark) 80%, transparent),
        var(--accent) 52%,
        var(--accent-glow)
    );
    box-shadow:
        var(--glow-accent),
        0 12px 32px rgba(124, 58, 237, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    transition: transform 0.22s cubic-bezier(0.34, 1.35, 0.64, 1), box-shadow 0.3s ease, filter 0.25s ease;
}

.site-header__cta:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow:
        var(--glow-accent-strong),
        0 16px 48px rgba(124, 58, 237, 0.32),
        inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.site-header__cta:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 2px;
}

/* ─── Icon buttons — per-icon flare ─────────────────────── */

.site-header.site-header--premium .icon-btn {
    border-radius: 15px;
    border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
    background: color-mix(in srgb, var(--bg-glass) 82%, transparent);
    box-shadow: 0 2px 0 rgba(255, 255, 255, 0.04);
    overflow: visible;
}

.site-header.site-header--premium .icon-btn svg {
    filter: drop-shadow(0 0 8px rgba(168, 85, 247, 0.22));
    transition:
        transform 0.28s cubic-bezier(0.34, 1.35, 0.64, 1),
        filter 0.28s ease;
}

.site-header.site-header--premium .icon-btn:hover svg {
    filter: drop-shadow(0 0 14px rgba(168, 85, 247, 0.45));
}

.site-header.site-header--premium .icon-btn.theme-toggle:hover {
    border-color: color-mix(in srgb, var(--gold) 55%, transparent);
    box-shadow: 0 0 22px rgba(245, 199, 107, 0.22);
}

.site-header.site-header--premium .icon-btn[data-nav-toggle]:hover {
    border-color: color-mix(in srgb, var(--accent-glow) 62%, transparent);
    box-shadow: 0 0 26px rgba(168, 85, 247, 0.35);
}

.site-header.site-header--premium .site-header__cart:hover {
    border-color: color-mix(in srgb, var(--accent) 72%, transparent);
}

.site-header.site-header--premium .site-header__settings-btn:hover svg {
    transform: rotate(35deg);
}

.site-header.site-header--premium .icon-btn:active {
    transform: scale(0.95);
}

/* Hamburger shimmer */
.site-header.site-header--premium .nav-toggle__bars {
    border-color: currentColor;
}

.site-header.site-header--premium .nav-toggle__bars,
.site-header.site-header--premium .nav-toggle__bars::after {
    transition: opacity 0.25s ease, transform 0.32s cubic-bezier(0.34, 1.35, 0.64, 1);
}

.site-header.site-header--premium [data-nav-toggle][aria-expanded="true"] .nav-toggle__bars {
    border-inline-color: transparent;
    opacity: 0.85;
}

.site-header.site-header--premium .avatar-btn {
    border-radius: 15px;
    border-color: color-mix(in srgb, var(--accent-glow) 42%, transparent);
    box-shadow: 0 0 18px color-mix(in srgb, var(--accent-glow) 18%, transparent);
}

.site-header.site-header--premium .avatar-btn:hover {
    box-shadow:
        var(--glow-accent),
        0 0 20px rgba(245, 199, 107, 0.12);
}

/* خلفية الدرج: نُبقي عنصر الغطاء موجوداً للانتقالات دون وميض العناصر المركّزة عند وجودها */
.site-header.site-header--premium > .site-mobile-nav-backdrop[hidden] {
    display: block !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.38s cubic-bezier(0.22, 1, 0.36, 1), visibility 0.38s;
}

.site-header.site-header--premium.chrome-drawer-open > .site-mobile-nav-backdrop {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

/* ─── Mobile nav — blur + slide (.is-drawer-open يُدار من home.js) ─ */

.site-header.site-header--premium > .site-mobile-nav-backdrop {
    background: rgba(6, 8, 20, 0.42);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    transition: opacity 0.42s cubic-bezier(0.22, 1, 0.36, 1), visibility 0.42s;
}

html:not(.dark) .site-header.site-header--premium > .site-mobile-nav-backdrop {
    background: rgba(15, 23, 42, 0.32);
}

.site-header.site-header--premium .site-mobile-nav.site-mobile-nav--drawer[data-mobile-nav] {
    justify-content: flex-start;
    width: min(22rem, 92vw);
    border-inline-start: 1px solid color-mix(in srgb, var(--accent-glow) 42%, transparent);
    background:
        radial-gradient(circle at 100% -10%, rgba(168, 85, 247, 0.2), transparent 48%),
        color-mix(in srgb, var(--bg-elevated) 86%, transparent);
    backdrop-filter: blur(26px);
    -webkit-backdrop-filter: blur(26px);
    box-shadow:
        var(--shadow-md),
        0 0 60px rgba(168, 85, 247, 0.2);
}

.site-header.site-header--premium .site-mobile-nav.site-mobile-nav--drawer[data-mobile-nav][hidden] {
    display: none !important;
}

.site-header.site-header--premium
    .site-mobile-nav.site-mobile-nav--drawer[data-mobile-nav][data-drawer-enhanced="1"]:not([hidden]):not(.is-drawer-open) {
    visibility: hidden;
    opacity: 0;
    transform: translate3d(-106%, 0, 0);
    pointer-events: none;
}

[dir="rtl"]
    .site-header.site-header--premium
    .site-mobile-nav.site-mobile-nav--drawer[data-mobile-nav][data-drawer-enhanced="1"]:not([hidden]):not(.is-drawer-open) {
    transform: translate3d(106%, 0, 0);
}

.site-header.site-header--premium
    .site-mobile-nav.site-mobile-nav--drawer[data-mobile-nav][data-drawer-enhanced="1"]:not([hidden]):not(.is-drawer-open),
.site-header.site-header--premium
    .site-mobile-nav.site-mobile-nav--drawer[data-mobile-nav][data-drawer-enhanced="1"]:not([hidden]).is-drawer-open {
    display: flex !important;
    transition:
        opacity 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        visibility 0.42s,
        transform 0.48s cubic-bezier(0.34, 1.2, 0.52, 1);
}

.site-header.site-header--premium
    .site-mobile-nav.site-mobile-nav--drawer[data-mobile-nav][data-drawer-enhanced="1"].is-drawer-open {
    visibility: visible;
    opacity: 1;
    transform: translate3d(0, 0, 0);
    pointer-events: auto;
}

.site-header.site-header--premium
    .site-mobile-nav.site-mobile-nav--drawer[data-mobile-nav][data-drawer-enhanced="0"]:not([hidden]) {
    display: flex !important;
}

.site-header.site-header--premium .site-mobile-nav__head {
    flex-shrink: 0;
    background: color-mix(in srgb, var(--bg-subtle) 82%, transparent);
}

.site-header.site-header--premium .site-mobile-nav__body {
    flex: 1 1 auto;
    min-height: 0;
}

.site-header.site-header--premium .site-mobile-nav__foot {
    flex-shrink: 0;
    padding: 0.95rem max(1rem, env(safe-area-inset-start, 0px)) max(1.05rem, env(safe-area-inset-bottom, 0px))
        max(1rem, env(safe-area-inset-end, 0px));
    border-top: 1px solid color-mix(in srgb, var(--accent-glow) 28%, transparent);
    background: color-mix(in srgb, var(--bg-subtle) 92%, transparent);
}

.site-header__cta--block {
    display: flex;
    width: 100%;
    justify-content: center;
    text-align: center;
    padding: 0.58rem 1rem;
}

.site-mobile-nav-link {
    flex: 1;
    gap: 0.65rem;
    display: flex;
    align-items: center;
}

.site-mobile-nav-link__ico {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 14px;
    flex-shrink: 0;
    background: color-mix(in srgb, var(--accent) 14%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent-glow) 35%, transparent);
    color: var(--accent-glow);
    transition:
        transform 0.26s cubic-bezier(0.34, 1.35, 0.64, 1),
        box-shadow 0.26s ease;
}

.site-mobile-nav-link__ico svg {
    width: 20px;
    height: 20px;
    filter: drop-shadow(0 0 8px rgba(168, 85, 247, 0.35));
}

.site-header.site-header--premium .site-mobile-nav__link:hover .site-mobile-nav-link__ico,
.site-header.site-header--premium .site-mobile-nav__link:focus-visible .site-mobile-nav-link__ico {
    transform: scale(1.05);
    box-shadow: var(--glow-accent);
}

.site-mobile-nav-link__text {
    flex: 1;
    font-weight: 780;
}

.site-header.site-header--premium .site-mobile-nav.site-mobile-nav--drawer[data-mobile-nav] .site-mobile-nav__body {
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

.site-header.site-header--premium .site-mobile-nav.site-mobile-nav--drawer[data-mobile-nav] .site-mobile-nav__list {
    padding: 0.95rem max(1rem, env(safe-area-inset-start, 0px))
        max(1rem, env(safe-area-inset-bottom, 0px)) max(1rem, env(safe-area-inset-end, 0px));
}

.site-header.site-header--premium .site-mobile-nav__link {
    align-items: center;
}

/* ─── Responsive: متوسطات الهاتف ───────────────────────── */

@media (max-width: 899px) {
    /* أيقونة قائمة جانبية مُستبعدة — يبقى الثيم والإعدادات فقط بالهيدر الزجاجي */
    .site-header.site-header--premium .site-header__actions > .nav-toggle.site-header__nav-toggle-mobile {
        display: none !important;
    }

    .site-header.site-header--premium .site-header__actions > .site-header__mobile-toolbar-btn {
        display: inline-flex !important;
    }
}

/* ─── Footer Premium ─────────────────────────────────────── */

.site-footer.site-footer--premium {
    --footer-muted: color-mix(in srgb, var(--text-muted) 92%, #fff);
    position: relative;
    margin-top: var(--space-section-y-lg);
    border-top: 1px solid color-mix(in srgb, var(--accent-glow) 42%, transparent);
    background:
        radial-gradient(circle at 12% -8%, rgba(168, 85, 247, 0.32), transparent 40%),
        radial-gradient(circle at 94% 8%, rgba(245, 199, 107, 0.18), transparent 34%),
        linear-gradient(
            180deg,
            color-mix(in srgb, var(--bg-subtle) 88%, transparent) 0%,
            color-mix(in srgb, var(--bg-elevated) 92%, transparent) 100%
        );
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    overflow: clip;
}

html.dark .site-footer.site-footer--premium {
    --footer-muted: var(--color-text-secondary);
    background:
        radial-gradient(circle at 12% -8%, rgba(168, 85, 247, 0.32), transparent 42%),
        radial-gradient(circle at 94% 4%, rgba(245, 199, 107, 0.12), transparent 36%),
        linear-gradient(
            180deg,
            #090f24 0%,
            color-mix(in srgb, #050816 88%, transparent) 88%
        );
}

.site-footer__premium-noise {
    pointer-events: none;
    position: absolute;
    inset: 0;
    opacity: 0.035;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.35'/%3E%3C/svg%3E");
    mix-blend-mode: overlay;
}

.site-footer.site-footer--premium .store-container {
    position: relative;
    z-index: 1;
}

.site-footer.site-footer--premium .site-footer__brand-row {
    display: grid;
    gap: 1rem;
    padding-block: clamp(2.25rem, 5vw, 3rem) 2rem;
    border-bottom: 1px solid color-mix(in srgb, var(--accent-glow) 22%, transparent);
    justify-items: center;
    text-align: center;
}

@media (min-width: 720px) {
    .site-footer.site-footer--premium .site-footer__brand-row {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: center;
        justify-items: start;
        text-align: start;
    }
}

.site-footer.site-footer--premium .site-logo--footer {
    border-radius: 18px;
    padding: 0.2rem;
    gap: clamp(0.45rem, 1.2vw, 0.75rem);
}

.site-footer.site-footer--premium .site-logo__img {
    height: clamp(36px, 4.5vw, 48px);
    filter: drop-shadow(0 0 22px rgba(168, 85, 247, 0.35));
}

.site-footer.site-footer--premium .site-logo__text {
    font-weight: 950;
    background: linear-gradient(95deg, var(--text), var(--accent-glow), var(--gold));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

html.dark .site-footer.site-footer--premium .site-logo__text {
    background: linear-gradient(95deg, #fff 20%, var(--accent-glow) 72%, var(--gold));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.site-footer.site-footer--premium .site-footer__desc-brand {
    margin: 0;
    max-width: 42ch;
    font-size: var(--fluid-text-sm);
    line-height: 1.74;
    color: var(--footer-muted);
    font-weight: 650;
}

.site-footer.site-footer--premium .site-footer__columns {
    display: grid;
    gap: clamp(1.65rem, 4vw, 2.75rem);
    padding-block: 2rem 2.5rem;
}

@media (min-width: 900px) {
    .site-footer.site-footer--premium .site-footer__columns {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 2rem;
    }
}

.site-footer.site-footer--premium .site-footer__pillar {
    position: relative;
    padding: clamp(1.1rem, 2vw, 1.5rem);
    border-radius: var(--radius-lg);
    border: 1px solid color-mix(in srgb, var(--accent-glow) 18%, transparent);
    background: color-mix(in srgb, var(--bg-elevated) 58%, transparent);
    box-shadow: 0 10px 40px rgba(15, 23, 42, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    transition:
        transform 0.32s cubic-bezier(0.22, 1, 0.36, 1),
        border-color 0.28s ease,
        box-shadow 0.35s ease;
}

html.dark .site-footer.site-footer--premium .site-footer__pillar {
    background: color-mix(in srgb, var(--bg-elevated) 72%, transparent);
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.site-footer.site-footer--premium .site-footer__pillar:hover {
    transform: translateY(-3px);
    border-color: color-mix(in srgb, var(--accent-glow) 48%, transparent);
    box-shadow:
        var(--glow-accent),
        0 18px 50px rgba(124, 58, 237, 0.12);
}

.site-footer.site-footer--premium .site-footer__pillar-title {
    margin: 0 0 1rem;
    font-size: clamp(1rem, 2.2vw, 1.1rem);
    font-weight: 950;
    color: var(--text);
}

.site-footer.site-footer--premium .site-footer__pillar-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.55rem;
}

.site-footer.site-footer--premium .site-footer__flink {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 44px;
    padding: 0.35rem 0.72rem;
    border-radius: 14px;
    font-weight: 750;
    font-size: var(--fluid-text-xs);
    color: var(--footer-muted);
    border: 1px solid transparent;
    transition:
        border-color 0.28s ease,
        box-shadow 0.3s ease,
        color 0.22s ease,
        transform 0.26s cubic-bezier(0.34, 1.35, 0.64, 1),
        background 0.26s ease;
}

.site-footer.site-footer--premium .site-footer__flink:hover {
    border-color: color-mix(in srgb, var(--accent-glow) 52%, transparent);
    color: var(--accent-glow);
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    box-shadow:
        inset 0 -2px 0 color-mix(in srgb, var(--accent-glow) 72%, transparent),
        inset 0 0 28px rgba(168, 85, 247, 0.08),
        0 0 22px rgba(168, 85, 247, 0.12);
}


.site-footer.site-footer--premium .site-footer__flink:active {
    transform: scale(0.98);
}

.site-footer.site-footer--premium .site-footer__link-ico {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    flex-shrink: 0;
    background: color-mix(in srgb, var(--accent) 14%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent-glow) 28%, transparent);
    color: var(--accent-glow);
    transition: box-shadow 0.28s ease, transform 0.22s ease;
}

.site-footer.site-footer--premium .site-footer__flink:hover .site-footer__link-ico {
    box-shadow: 0 0 18px rgba(168, 85, 247, 0.35);
}

.site-footer.site-footer--premium .site-footer__flink.site-footer__flink--crown:hover {
    color: var(--accent-glow);
    border-color: color-mix(in srgb, var(--gold) 48%, transparent);
    box-shadow:
        0 0 34px rgba(245, 199, 107, 0.22),
        0 0 42px rgba(168, 85, 247, 0.2);
}

.site-footer.site-footer--premium .site-footer__pillar-divider {
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent,
        color-mix(in srgb, var(--accent-glow) 45%, transparent) 42%,
        color-mix(in srgb, var(--gold) 28%, transparent) 58%,
        transparent
    );
    opacity: 0.75;
}

.site-footer.site-footer--premium .site-footer__social-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: clamp(0.85rem, 2vw, 1.75rem);
    padding-block: 1.5rem;
}

.site-footer.site-footer--premium .site-footer__social-note {
    text-align: center;
    margin: 0;
    padding: 1rem max(1rem, 6vw);
    font-size: 0.82rem;
    color: var(--footer-muted);
    line-height: 1.62;
}

.site-footer.site-footer--premium .site-footer__social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    padding: 0.45rem 0.75rem;
    border-radius: 14px;
    border: 1px solid color-mix(in srgb, var(--accent-glow) 38%, transparent);
    background: color-mix(in srgb, var(--bg-glass) 86%, transparent);
    color: var(--accent-glow);
    font-weight: 900;
    text-decoration: none;
    transition:
        transform 0.26s cubic-bezier(0.34, 1.35, 0.64, 1),
        border-color 0.26s ease,
        box-shadow 0.3s ease,
        color 0.22s ease;
}

.site-footer.site-footer--premium .site-footer__social a:hover {
    transform: translateY(-3px);
    border-color: var(--gold);
    color: var(--gold);
    box-shadow:
        var(--glow-gold),
        0 0 28px rgba(168, 85, 247, 0.25);
}

.site-footer.site-footer--premium .site-footer__social a:focus-visible {
    outline: 2px solid var(--accent-glow);
    outline-offset: 3px;
}

.site-footer.site-footer--premium .site-footer__bottom {
    border-top: 1px solid color-mix(in srgb, var(--accent-glow) 26%, transparent);
    background: transparent;
}

.site-footer.site-footer--premium .site-footer__bottom-inner p:not(.site-footer__payments) {
    color: var(--footer-muted);
}

@media (prefers-reduced-motion: reduce) {
    .site-header.site-header--premium,
    .site-header.site-header--premium *,
    .site-footer.site-footer--premium *,
    .site-header__premium-fx::before {
        animation: none !important;
        transition: none !important;
    }

    .site-header.site-header--premium .site-mobile-nav.site-mobile-nav--drawer[data-mobile-nav] {
        transition-duration: 0.01ms !important;
    }
}
