/* NetCat premium UI fixes. Loaded after style.css. */

.hero,
.premium-hero,
.section-account,
.section-plans {
    background:
        radial-gradient(760px 420px at 16% 10%, rgba(45, 212, 191, 0.14), transparent 64%),
        radial-gradient(860px 460px at 84% 18%, rgba(47, 128, 255, 0.14), transparent 66%),
        linear-gradient(180deg, #f7fbff 0%, #eef5ff 100%);
}

/* Conversion quick wins: keep trial first, downloads secondary, and trust visible near money. */
.hero-primary-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: min(100%, 620px);
    margin: 26px auto 12px;
}

.hero-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    min-width: min(100%, 230px);
    padding: 0 22px;
    border-radius: 18px;
    font-size: 0.98rem;
    font-weight: 800;
    line-height: 1.12;
    text-decoration: none;
    text-align: center;
    border: 1px solid transparent;
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.hero-cta--primary {
    color: #f8fffc;
    background: linear-gradient(135deg, #0e7a62 0%, #16b985 54%, #2fd394 100%);
    border-color: rgba(153, 255, 220, 0.54);
    box-shadow: 0 24px 48px -24px rgba(14, 122, 98, 0.72);
}

.hero-cta--secondary {
    color: #221b42;
    background: rgba(255, 255, 255, 0.72);
    border-color: rgba(34, 27, 66, 0.12);
    box-shadow: 0 16px 34px -26px rgba(46, 34, 92, 0.48);
}

.hero-cta:hover {
    transform: translateY(-1px);
}

.hero-cta:focus-visible,
.platform-guide-links a:focus-visible {
    outline: 3px solid rgba(31, 122, 235, 0.32);
    outline-offset: 3px;
}

.platform-download-label {
    margin: 18px auto 10px;
    color: rgba(43, 45, 72, 0.66);
    font-size: 0.92rem;
    font-weight: 700;
    text-align: center;
}

.conversion-path-strip {
    position: relative;
    padding: 22px 0 10px;
    background: linear-gradient(180deg, rgba(244, 248, 255, 0), rgba(232, 249, 242, 0.72));
}

.conversion-path-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.conversion-path-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 6px 12px;
    align-items: start;
    padding: 16px;
    border: 1px solid rgba(32, 52, 86, 0.10);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.76);
    box-shadow: 0 18px 42px -34px rgba(25, 43, 82, 0.34);
}

.conversion-path-item > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    grid-row: span 2;
    border-radius: 50%;
    color: #0f5d4f;
    background: #dff9ed;
    font-weight: 900;
}

.conversion-path-item strong {
    color: #1d2440;
    font-size: 0.98rem;
    line-height: 1.2;
}

.conversion-path-item p {
    margin: 0;
    color: rgba(44, 50, 78, 0.68);
    font-size: 0.9rem;
    line-height: 1.45;
}

.trust-before-payment {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(260px, 0.9fr);
    gap: 18px;
    align-items: center;
    margin: 22px auto 0;
    padding: 18px;
    border: 1px solid rgba(32, 52, 86, 0.11);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.84), rgba(235, 250, 245, 0.78)),
        linear-gradient(90deg, rgba(31, 122, 235, 0.06), rgba(22, 185, 133, 0.08));
    box-shadow: 0 22px 54px -42px rgba(20, 36, 72, 0.42);
}

.trust-before-payment strong {
    display: block;
    color: #1d2440;
    font-size: 1.05rem;
    margin-bottom: 6px;
}

.trust-before-payment p {
    margin: 0;
    color: rgba(44, 50, 78, 0.70);
    line-height: 1.48;
}

.trust-before-payment ul {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.trust-before-payment li {
    position: relative;
    padding-left: 22px;
    color: rgba(29, 36, 64, 0.82);
    font-size: 0.92rem;
    line-height: 1.38;
}

.trust-before-payment li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.42em;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #16b985;
    box-shadow: 0 0 0 4px rgba(22, 185, 133, 0.12);
}

.platform-guide-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.platform-guide-links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 14px;
    border-radius: 8px;
    color: #23305d;
    font-weight: 800;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(35, 48, 93, 0.12);
}

.account-password-hint {
    display: block;
    margin-top: 7px;
    color: rgba(44, 50, 78, 0.68);
    font-size: 0.84rem;
    font-weight: 700;
}

html[data-theme="dark"] .hero-cta--secondary,
html[data-theme="dark"] .conversion-path-item,
html[data-theme="dark"] .trust-before-payment,
html[data-theme="dark"] .platform-guide-links a {
    color: rgba(242, 246, 255, 0.92);
    background: rgba(19, 24, 41, 0.74);
    border-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .platform-download-label,
html[data-theme="dark"] .conversion-path-item p,
html[data-theme="dark"] .trust-before-payment p,
html[data-theme="dark"] .account-password-hint {
    color: rgba(218, 224, 246, 0.72);
}

html[data-theme="dark"] .conversion-path-strip {
    background: linear-gradient(180deg, rgba(16, 22, 37, 0), rgba(18, 47, 44, 0.36));
}

html[data-theme="dark"] .conversion-path-item strong,
html[data-theme="dark"] .trust-before-payment strong,
html[data-theme="dark"] .trust-before-payment li {
    color: rgba(248, 250, 255, 0.94);
}

html[dir="rtl"] .trust-before-payment li {
    padding-left: 0;
    padding-right: 22px;
}

html[dir="rtl"] .trust-before-payment li::before {
    left: auto;
    right: 0;
}

@media (max-width: 820px) {
    .conversion-path-grid,
    .trust-before-payment {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 560px) {
    .hero-primary-actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
        margin-top: 20px;
    }

    .hero-cta {
        width: 100%;
        min-width: 0;
        min-height: 52px;
        padding: 0 16px;
        font-size: 0.94rem;
    }

    .conversion-path-strip {
        padding-top: 14px;
    }

    .conversion-path-item,
    .trust-before-payment {
        padding: 14px;
    }

    .platform-guide-links {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }
}

.hero {
    padding: clamp(4.8rem, 7vw, 6.4rem) 0 clamp(3.5rem, 5.6vw, 5rem);
}

.hero h1 {
    max-width: 920px;
    font-size: clamp(2.2rem, 5.1vw, 4.45rem);
    line-height: 1.06;
}

.hero .badge {
    max-width: min(100%, 760px);
    color: #0f766e;
    border-color: rgba(45, 212, 191, 0.38);
    background: rgba(255, 255, 255, 0.76);
    box-shadow: 0 14px 34px rgba(51, 79, 126, 0.10);
}

.hero-subtitle {
    max-width: 760px;
    margin-top: 4px;
    color: #5f6f91;
}

.hero-proof-row {
    margin-top: 16px;
}

.hero-proof-row span {
    color: #17213b;
    border-color: rgba(126, 185, 255, 0.38);
    background: rgba(255, 255, 255, 0.82);
}

.netcat-hero-stage {
    width: min(100%, 500px);
    min-height: 310px;
    margin-top: 28px;
    margin-bottom: 18px;
    border-radius: 24px;
    border-color: rgba(126, 185, 255, 0.28);
    background:
        radial-gradient(circle at 50% 56%, rgba(78, 255, 225, 0.20), transparent 9rem),
        linear-gradient(160deg, rgba(255, 255, 255, 0.90), rgba(236, 243, 255, 0.92));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.92),
        0 24px 62px rgba(51, 79, 126, 0.14);
}

@media (min-width: 641px) {
    .hero-install {
        display: grid;
        grid-template-columns: repeat(2, minmax(220px, 286px));
        gap: 14px;
        justify-content: center;
        margin-top: 22px;
    }

    .hero-install .install-btn,
    .hero-install .install-btn--android,
    .hero-install .install-btn--windows {
        width: 100%;
        max-width: none;
        min-height: 60px;
        padding: 16px 20px;
        flex: none;
        font-size: 1rem;
    }

    .hero-install .install-btn--android {
        order: 1;
    }

    .hero-install .install-btn--windows {
        order: 2;
    }
}

.section-plans {
    padding-top: clamp(4rem, 7vw, 5.5rem);
    padding-bottom: clamp(4rem, 7vw, 5.5rem);
}

.section-plans h2,
.premium-copy h1,
.account-page-hero h1 {
    color: #17213b;
    text-shadow: none;
}

.section-plans h2 {
    font-size: clamp(2.25rem, 5vw, 4.2rem);
    line-height: 1.04;
}

.section-plans .section-subtitle,
.premium-copy p,
.account-page-hero .section-subtitle {
    color: #64708d;
}

.plans-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(16px, 2vw, 22px);
    align-items: stretch;
}

.plan-card,
html[data-theme="light"] .plan-card {
    min-height: 318px;
    padding: 28px 24px 24px;
    border-radius: 22px;
    border: 1px solid rgba(102, 119, 168, 0.22);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(249, 251, 255, 0.86)),
        #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.95),
        0 20px 54px rgba(51, 79, 126, 0.12);
    transform: none;
}

.plan-card:hover,
.featured-plan:hover,
html[data-theme="light"] .plan-card:hover {
    border-color: rgba(47, 128, 255, 0.30);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.95),
        0 24px 64px rgba(51, 79, 126, 0.16);
    transform: translateY(-2px);
}

.featured-plan,
html[data-theme="light"] .featured-plan {
    border: 1px solid rgba(47, 128, 255, 0.36);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 248, 255, 0.92)),
        #ffffff;
    box-shadow:
        inset 0 3px 0 rgba(47, 128, 255, 0.72),
        inset 0 1px 0 rgba(255, 255, 255, 0.96),
        0 24px 68px rgba(47, 128, 255, 0.16);
    transform: none;
}

.plan-trial-badge {
    display: none;
}

.plan-name {
    display: block;
    min-height: 1.35em;
    color: #263866;
    font-size: 1.15rem;
    line-height: 1.25;
    font-weight: 850;
}

.plan-price {
    margin: 12px 0 16px;
    color: #243272;
    font-size: clamp(2.5rem, 4.2vw, 3.3rem);
    line-height: 0.98;
    font-weight: 900;
}

.plan-price small {
    color: #687293;
    font-size: clamp(0.95rem, 1.5vw, 1.08rem);
    font-weight: 750;
}

.plan-key-feature {
    min-height: 3.1em;
    margin: 0 0 18px;
    color: #687293;
    font-size: 1rem;
    line-height: 1.42;
    font-weight: 850;
}

.plan-card ul {
    flex: 1;
    margin: 0 0 22px;
    padding-left: 0;
    list-style: none;
}

.plan-card ul li {
    position: relative;
    margin: 0 0 9px;
    padding-left: 20px;
    color: #687293;
    font-weight: 700;
}

.plan-card ul li::before {
    content: "";
    position: absolute;
    top: 0.72em;
    left: 2px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #21c6aa;
    box-shadow: 0 0 0 4px rgba(33, 198, 170, 0.10);
}

.plan-btn {
    width: 100%;
    min-height: 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: auto;
    border-radius: 16px;
    background: linear-gradient(135deg, #5b6bff 0%, #4f46e5 100%);
    box-shadow: 0 16px 34px rgba(79, 70, 229, 0.24);
    font-size: 1rem;
    font-weight: 900;
}

.premium-page .header,
.account-page .header,
html[data-theme="light"] .header {
    background: rgba(247, 251, 255, 0.92);
    border-bottom-color: rgba(102, 119, 168, 0.18);
    box-shadow: 0 16px 38px rgba(51, 79, 126, 0.10);
}

.premium-hero {
    padding: clamp(4.2rem, 7vw, 6rem) 0 clamp(2.8rem, 5vw, 4rem);
}

.premium-copy h1 {
    max-width: 820px;
    font-size: clamp(2.25rem, 4.8vw, 4rem);
    line-height: 1.06;
}

.premium-note {
    color: #176056;
    background: rgba(255, 255, 255, 0.76);
    border-color: rgba(45, 212, 191, 0.34);
    box-shadow: 0 12px 28px rgba(51, 79, 126, 0.10);
}

.premium-plans {
    padding-top: clamp(2.2rem, 4vw, 3.2rem);
}

.premium-plans .plan-card {
    min-height: 438px;
}

.premium-band {
    background: linear-gradient(180deg, #f7fbff 0%, #edf4ff 100%);
}

.account-page-section {
    padding-top: clamp(3.6rem, 6vw, 5rem);
    padding-bottom: clamp(3.5rem, 6vw, 5rem);
}

.account-page-hero {
    margin-bottom: 24px;
}

.account-page-hero h1 {
    font-size: clamp(2.25rem, 5.2vw, 4.35rem);
    line-height: 1.04;
}

.account-page-hero .section-subtitle {
    max-width: 720px;
    font-weight: 650;
}

.account-cabinet-grid {
    width: min(100%, 520px);
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
}

.account-card,
.account-tabs,
html[data-theme="light"] .account-card,
html[data-theme="light"] .account-tabs {
    border-color: rgba(102, 119, 168, 0.22);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(249, 251, 255, 0.84)),
        #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.95),
        0 20px 54px rgba(51, 79, 126, 0.12);
}

.account-card {
    border-radius: 22px;
}

.account-tabs {
    border-radius: 18px;
}

.account-tab,
.account-submit,
.account-login,
.account-link-inline {
    font-family: var(--font-body);
}

.account-tab.is-active,
.account-submit {
    color: #ffffff;
    border-color: rgba(33, 198, 170, 0.40);
    background: linear-gradient(135deg, #21c6aa 0%, #16a394 100%);
    box-shadow: 0 12px 28px rgba(33, 198, 170, 0.24);
}

.account-login {
    border-color: rgba(102, 119, 168, 0.24);
    background: rgba(255, 255, 255, 0.62);
}

.account-cabinet-grid {
    width: min(100%, 980px);
    max-width: 980px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.92fr);
    gap: 22px;
    align-items: start;
}

.account-guest {
    min-height: 100%;
    align-content: start;
}

.account-guest .account-status {
    padding: 16px 18px;
    color: #233257;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.74), rgba(245, 249, 255, 0.72));
    border-color: rgba(102, 119, 168, 0.18);
}

.account-intro-steps {
    display: grid;
    gap: 12px;
    margin-top: 4px;
}

.account-intro-steps > div {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 4px 12px;
    align-items: start;
    padding: 14px;
    border: 1px solid rgba(102, 119, 168, 0.18);
    border-radius: 16px;
    background: rgba(247, 251, 255, 0.78);
}

.account-intro-steps span {
    grid-row: span 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 12px;
    color: #0f766e;
    background: rgba(45, 212, 191, 0.14);
    border: 1px solid rgba(45, 212, 191, 0.28);
    font-weight: 900;
}

.account-intro-steps strong {
    color: #17213b;
    font-size: 0.98rem;
    line-height: 1.25;
}

.account-intro-steps p {
    margin: 0;
    color: #64708d;
    font-size: 0.92rem;
    line-height: 1.42;
    font-weight: 650;
}

.account-auth {
    width: 100%;
    min-width: 0;
}

.account-auth .account-card,
.account-auth .account-tabs,
.account-auth .account-auth-status {
    width: 100%;
}

.account-dashboard {
    grid-column: 1 / -1;
}

.section-why {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(700px 360px at 20% 12%, rgba(45, 212, 191, 0.12), transparent 64%),
        radial-gradient(700px 420px at 84% 22%, rgba(91, 107, 255, 0.10), transparent 68%),
        linear-gradient(180deg, #f4f8ff 0%, #eef5ff 100%);
}

.section-why .container {
    position: relative;
    z-index: 1;
}

.section-why h2 {
    color: #17213b;
    font-size: clamp(2.1rem, 4.4vw, 3.7rem);
    line-height: 1.04;
    text-shadow: none;
}

.section-why .section-subtitle {
    max-width: 620px;
    color: #64708d;
    font-size: 1.08rem;
    font-weight: 650;
}

.why-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 34px;
}

.why-card,
.why-card.why-card--wide {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    gap: 16px;
    min-height: 270px;
    padding: 26px;
    border: 1px solid rgba(102, 119, 168, 0.20);
    border-radius: 24px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(249, 251, 255, 0.84)),
        #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.94),
        0 22px 58px rgba(51, 79, 126, 0.12);
}

.why-card--wide {
    border-color: rgba(45, 212, 191, 0.30);
    background:
        radial-gradient(360px 220px at 18% 0%, rgba(45, 212, 191, 0.16), transparent 66%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(244, 250, 255, 0.88));
}

.why-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 16px;
    color: #0f766e;
    background: rgba(45, 212, 191, 0.14);
    border: 1px solid rgba(45, 212, 191, 0.26);
    font-size: 0.95rem;
    font-weight: 950;
    letter-spacing: 0;
}

.why-card:nth-child(2) .why-icon {
    color: #3451d1;
    background: rgba(91, 107, 255, 0.12);
    border-color: rgba(91, 107, 255, 0.22);
}

.why-card:nth-child(3) .why-icon {
    color: #7c4d00;
    background: rgba(255, 184, 77, 0.18);
    border-color: rgba(255, 184, 77, 0.30);
}

.why-card h3 {
    margin: 0;
    color: #17213b;
    font-size: clamp(1.14rem, 1.7vw, 1.35rem);
    line-height: 1.18;
    font-weight: 900;
}

.why-card p {
    margin: 0;
    color: #5f6f91;
    font-size: 1rem;
    line-height: 1.52;
    font-weight: 650;
}

@media (max-width: 900px) {
    .plans-grid {
        grid-template-columns: minmax(0, 1fr);
        max-width: 520px;
        margin-right: auto;
        margin-left: auto;
    }

    .plan-card,
    .premium-plans .plan-card {
        min-height: 0;
    }

    .plan-key-feature {
        min-height: 0;
    }

    .account-cabinet-grid {
        max-width: 620px;
        grid-template-columns: minmax(0, 1fr);
    }

    .why-grid {
        grid-template-columns: minmax(0, 1fr);
        max-width: 620px;
        margin-right: auto;
        margin-left: auto;
    }

    .why-card,
    .why-card.why-card--wide {
        min-height: 0;
    }
}

@media (max-width: 640px) {
    html,
    body {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    .container,
    .header .container.nav,
    .account-page-hero.container,
    .account-cabinet-grid.container {
        width: calc(100vw - 32px) !important;
        max-width: calc(100vw - 32px) !important;
        margin-right: auto !important;
        margin-left: auto !important;
        box-sizing: border-box !important;
    }

    .header .nav {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 10px !important;
        overflow: hidden !important;
    }

    .header .brand {
        max-width: 100% !important;
        justify-content: center !important;
    }

    .header .nav-right {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto auto;
        justify-items: center !important;
        align-items: center !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
    }

    .header .nav-links.nav-primary,
    .header .nav-links {
        grid-column: 1 / -1 !important;
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    .header .lang-switcher {
        grid-column: 1 !important;
        display: flex !important;
        justify-self: end !important;
        margin-top: 0 !important;
    }

    .header .header-tools {
        grid-column: 2 / 4 !important;
        display: inline-flex !important;
        justify-self: start !important;
        gap: 8px !important;
        margin-top: 0 !important;
    }

    .header .lang-toggle,
    .header .theme-toggle,
    .header .header-collapse {
        min-width: 40px !important;
        height: 40px !important;
        border-radius: 13px !important;
    }

    .header .header-collapse {
        display: inline-flex !important;
    }

    .header .nav-links a {
        width: 100% !important;
        min-width: 0 !important;
        padding: 8px 4px !important;
        box-sizing: border-box !important;
        font-size: clamp(0.72rem, 3vw, 0.8rem) !important;
        white-space: nowrap !important;
    }

    .account-page .account-page-hero h1,
    .premium-page .premium-copy h1,
    .hero h1 {
        max-width: 100% !important;
        font-size: clamp(1.72rem, 7.2vw, 2.08rem) !important;
        line-height: 1.1 !important;
        white-space: normal !important;
        overflow-wrap: normal !important;
    }

    .account-page .section-subtitle,
    .premium-page .premium-copy p,
    .hero-subtitle {
        max-width: 100% !important;
        white-space: normal !important;
        overflow-wrap: normal !important;
    }

    .hero {
        padding: 36px 0 48px;
    }

    .hero-install {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        justify-items: center;
    }

    .hero-install .install-btn,
    .hero-install .install-btn--android,
    .hero-install .install-btn--windows {
        width: 100% !important;
        max-width: 342px !important;
        min-height: 56px;
        padding: 15px 18px;
    }

    .hero-install .install-btn--android {
        order: 1;
    }

    .hero-install .install-btn--windows {
        order: 2;
    }

    .netcat-hero-stage {
        min-height: 210px;
        margin-top: 22px;
    }

    .section-plans,
    .account-page-section {
        padding-top: 42px;
        padding-bottom: 46px;
    }

    .section-plans h2 {
        font-size: clamp(2rem, 9vw, 2.55rem);
    }

    .plans-grid {
        gap: 14px;
        width: 100%;
        max-width: 100%;
    }

    .plan-card {
        padding: 22px 20px;
        border-radius: 20px;
    }

    .plan-price {
        font-size: clamp(2.35rem, 12vw, 3rem);
    }

    .account-tabs {
        width: 100%;
        overflow: hidden;
    }

    .account-tab {
        min-width: 0;
        white-space: normal;
    }

    .account-cabinet-grid {
        width: calc(100vw - 32px) !important;
        max-width: calc(100vw - 32px) !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .account-intro-steps > div {
        grid-template-columns: 34px minmax(0, 1fr);
        padding: 13px;
    }

    .section-why {
        padding-top: 54px;
        padding-bottom: 58px;
    }

    .section-why h2 {
        font-size: clamp(2rem, 9vw, 2.45rem);
    }

    .section-why .section-subtitle {
        font-size: 0.98rem;
    }

    .why-grid {
        gap: 14px;
        margin-top: 24px;
    }

    .why-card,
    .why-card.why-card--wide {
        padding: 20px;
        border-radius: 20px;
    }
}

.download-page .premium-hero--download {
    min-height: 0;
    display: block;
    padding: clamp(66px, 7vw, 92px) 0 clamp(58px, 7vw, 88px);
}

.download-page .premium-hero-grid {
    width: min(100%, 1120px);
    display: grid;
    grid-template-columns: minmax(0, 640px) minmax(340px, 430px);
    gap: clamp(32px, 5vw, 64px);
    align-items: center;
    justify-content: space-between;
}

.download-page .premium-copy {
    min-width: 0;
    max-width: 640px;
}

.download-page .premium-copy h1 {
    max-width: 640px;
    margin: 16px 0 14px;
    font-size: clamp(2.55rem, 4.15vw, 3.75rem);
    line-height: 1.06;
    letter-spacing: 0;
    text-wrap: balance;
}

.download-page .premium-copy > p {
    max-width: 610px;
    font-size: 1.05rem;
    line-height: 1.58;
}

.download-page .premium-note {
    min-height: 36px;
    padding: 8px 15px;
    border-color: rgba(45, 212, 191, 0.32);
    background: rgba(255, 255, 255, 0.80);
}

.download-page .premium-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    max-width: 640px;
    margin-top: 24px;
}

.download-page .premium-actions .install-btn {
    width: 100%;
    max-width: none;
    min-height: 62px;
    padding: 16px 18px;
    justify-content: center;
}

.download-page .premium-actions .install-btn-label {
    text-align: left;
}

.download-page .premium-proof-row {
    max-width: 640px;
    gap: 10px;
    margin-top: 16px;
}

.download-page .premium-device-card {
    width: 100%;
    padding: 24px;
    border-radius: 24px;
    border-color: rgba(102, 119, 168, 0.20);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 251, 255, 0.88)),
        #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.96),
        0 24px 66px rgba(51, 79, 126, 0.14);
}

.download-page .premium-device-card .mini-cat {
    display: none;
}

.download-page .premium-steps {
    gap: 12px;
}

.download-page .premium-steps li {
    padding: 18px;
    border-radius: 16px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(246, 250, 255, 0.78));
    border-color: rgba(102, 119, 168, 0.20);
}

@media (max-width: 900px) {
    .download-page .premium-hero--download {
        min-height: 0;
        padding-top: 50px;
        padding-bottom: 56px;
    }

    .download-page .premium-hero-grid {
        grid-template-columns: minmax(0, 1fr);
        max-width: 640px;
        justify-content: center;
    }

    .download-page .premium-copy {
        max-width: 100%;
        text-align: center;
    }

    .download-page .premium-copy h1,
    .download-page .premium-copy > p,
    .download-page .premium-actions,
    .download-page .premium-proof-row {
        margin-right: auto;
        margin-left: auto;
    }
}

@media (max-width: 640px) {
    .download-page .premium-hero--download {
        padding-top: 42px;
        padding-bottom: 52px;
    }

    .download-page .premium-copy {
        text-align: left;
    }

    .download-page .premium-copy h1 {
        font-size: clamp(2rem, 8vw, 2.34rem) !important;
        line-height: 1.09 !important;
    }

    .download-page .premium-copy > p {
        font-size: 0.98rem;
    }

    .download-page .premium-actions {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        max-width: 100%;
    }

    .download-page .premium-actions .install-btn {
        max-width: 100% !important;
    }

    .download-page .premium-proof-row {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: 100%;
    }

    .download-page .premium-proof-row span {
        min-height: 44px;
        justify-content: center;
        padding: 9px 8px;
        text-align: center;
        white-space: normal;
        font-size: 0.78rem;
        line-height: 1.15;
    }

    .download-page .premium-device-card {
        padding: 20px;
        border-radius: 22px;
    }

    .download-page .premium-steps li {
        padding: 16px;
    }
}

/* Tariff cards polish: premium density, one-line period labels, no day counters. */
.section-plans .container {
    position: relative;
    z-index: 1;
}

.section-plans h2 {
    margin-bottom: 10px;
    color: #171b3e;
    letter-spacing: 0;
}

.section-plans .section-subtitle {
    max-width: 720px;
    margin-right: auto;
    margin-left: auto;
    font-weight: 600;
}

.plans-grid {
    width: min(100%, 1080px);
    margin: clamp(24px, 3vw, 34px) auto 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(16px, 2vw, 24px);
}

.plan-card,
html[data-theme="light"] .plan-card {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: flex;
    min-height: 314px;
    padding: 30px 24px 24px;
    border-radius: 24px;
    border: 1px solid rgba(90, 107, 160, 0.20);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(247, 250, 255, 0.92) 100%),
        #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.96),
        0 18px 48px rgba(28, 41, 86, 0.10);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.plan-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    z-index: -1;
    height: 5px;
    background: linear-gradient(90deg, rgba(33, 198, 170, 0.70), rgba(91, 107, 255, 0.78), rgba(122, 74, 255, 0.68));
    opacity: 0.34;
}

.plan-card:hover,
.featured-plan:hover,
html[data-theme="light"] .plan-card:hover {
    border-color: rgba(91, 107, 255, 0.36);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.98),
        0 24px 62px rgba(28, 41, 86, 0.15);
    transform: translateY(-2px);
}

.featured-plan,
html[data-theme="light"] .featured-plan {
    border-color: rgba(91, 107, 255, 0.46);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(245, 248, 255, 0.96) 100%),
        #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 1),
        0 0 0 1px rgba(91, 107, 255, 0.10),
        0 26px 68px rgba(79, 70, 229, 0.18);
}

.featured-plan::before {
    height: 6px;
    opacity: 0.82;
}

.plan-name {
    color: #26306b;
    font-size: 1.08rem;
    line-height: 1.2;
    letter-spacing: 0;
}

.plan-price {
    display: flex;
    align-items: baseline;
    flex-wrap: nowrap;
    gap: 10px;
    min-width: 0;
    margin: 14px 0 18px;
    color: #271f78;
    font-size: clamp(2.65rem, 4.4vw, 3.55rem);
    line-height: 0.95;
    letter-spacing: 0;
    white-space: nowrap;
}

.plan-price small {
    display: inline-flex;
    flex: 0 1 auto;
    align-items: baseline;
    min-width: 0;
    color: #626c92;
    font-size: clamp(0.98rem, 1.35vw, 1.12rem);
    line-height: 1.15;
    font-weight: 800;
    white-space: nowrap;
}

.plan-key-feature {
    min-height: 3.1em;
    margin-bottom: 20px;
    color: #5f698b;
    font-size: 0.98rem;
    line-height: 1.42;
}

.premium-plans .plan-card {
    min-height: 430px;
}

.plan-card ul {
    display: grid;
    gap: 10px;
    margin-bottom: 24px;
}

.plan-card ul li {
    margin: 0;
    color: #5f698b;
    line-height: 1.35;
}

.plan-btn {
    min-height: 52px;
    border-radius: 15px;
    background: linear-gradient(135deg, #6f58ff 0%, #5538e8 48%, #3f7cff 100%);
    box-shadow:
        0 15px 30px rgba(79, 70, 229, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.25);
    letter-spacing: 0;
}

.plan-btn:hover {
    box-shadow:
        0 18px 36px rgba(79, 70, 229, 0.30),
        inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

html[data-theme="dark"] .section-plans h2 {
    color: #f7f8ff;
}

html[data-theme="dark"] .plan-card {
    border-color: rgba(173, 185, 255, 0.18);
    background:
        linear-gradient(180deg, rgba(24, 30, 62, 0.94) 0%, rgba(16, 22, 48, 0.92) 100%),
        #121731;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 22px 56px rgba(0, 0, 0, 0.28);
}

html[data-theme="dark"] .featured-plan {
    border-color: rgba(133, 148, 255, 0.38);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.10),
        0 0 0 1px rgba(133, 148, 255, 0.10),
        0 26px 68px rgba(0, 0, 0, 0.34);
}

html[data-theme="dark"] .plan-name,
html[data-theme="dark"] .plan-price {
    color: #f4f6ff;
}

html[data-theme="dark"] .plan-price small,
html[data-theme="dark"] .plan-key-feature,
html[data-theme="dark"] .plan-card ul li {
    color: #b6c0e0;
}

@media (max-width: 900px) {
    .plans-grid {
        width: min(100%, 560px);
        grid-template-columns: minmax(0, 1fr);
    }

    .plan-card,
    .premium-plans .plan-card {
        min-height: 0;
    }
}

@media (max-width: 640px) {
    .section-plans h2 {
        font-size: clamp(2rem, 9vw, 2.55rem);
    }

    .plans-grid {
        gap: 14px;
        margin-top: 22px;
    }

    .plan-card {
        padding: 24px 20px 20px;
        border-radius: 22px;
    }

    .plan-price {
        gap: 8px;
        font-size: clamp(2.6rem, 13vw, 3.2rem);
    }

    .plan-price small {
        font-size: 1rem;
    }
}

/* Tariff conversion pass: clearer offer, richer surfaces, no day-based periods. */
.premium-hero--plans {
    padding: clamp(3.6rem, 6vw, 5.4rem) 0 clamp(2.6rem, 4.2vw, 3.8rem);
}

.premium-hero--plans .premium-copy h1 {
    max-width: 760px;
    font-size: clamp(3rem, 7vw, 5.7rem);
    line-height: 0.96;
}

.premium-hero--plans .premium-copy p {
    max-width: 680px;
    margin-top: 18px;
    color: #59668a;
    font-size: clamp(1.05rem, 1.55vw, 1.25rem);
    line-height: 1.5;
    font-weight: 700;
}

.premium-hero--plans .premium-note {
    max-width: min(100%, 640px);
    padding: 10px 16px;
    color: #075f56;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(243, 255, 252, 0.90)),
        #ffffff;
    border-color: rgba(45, 212, 191, 0.42);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.98),
        0 18px 46px rgba(15, 118, 110, 0.12);
}

.premium-plans {
    padding-top: clamp(3.4rem, 5vw, 4.6rem);
}

.plans-grid {
    width: min(100%, 1120px);
    gap: clamp(18px, 2.2vw, 28px);
}

.plan-card,
html[data-theme="light"] .plan-card {
    min-height: 332px;
    padding: 30px 26px 26px;
    border-radius: 26px;
    border-color: rgba(54, 65, 112, 0.16);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(250, 252, 255, 0.94) 54%, rgba(245, 248, 255, 0.92) 100%),
        #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 1),
        0 28px 72px rgba(26, 36, 82, 0.13);
}

.plan-card::before {
    height: 4px;
    background: linear-gradient(90deg, rgba(45, 212, 191, 0.66), rgba(139, 92, 246, 0.70), rgba(55, 125, 255, 0.72));
    opacity: 0.62;
}

.plan-card:hover,
.featured-plan:hover,
html[data-theme="light"] .plan-card:hover {
    border-color: rgba(81, 95, 166, 0.28);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 1),
        0 34px 86px rgba(26, 36, 82, 0.17);
    transform: translateY(-3px);
}

.featured-plan,
html[data-theme="light"] .featured-plan {
    border-color: rgba(101, 91, 255, 0.48);
    background:
        linear-gradient(180deg, #ffffff 0%, rgba(250, 252, 255, 0.98) 52%, rgba(244, 247, 255, 0.96) 100%),
        #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 1),
        0 0 0 1px rgba(101, 91, 255, 0.13),
        0 34px 90px rgba(79, 70, 229, 0.20);
}

.featured-plan::before {
    height: 5px;
    background: linear-gradient(90deg, #2dd4bf 0%, #8b5cf6 48%, #377dff 100%);
    opacity: 1;
}

.plan-choice-badge {
    align-self: flex-start;
    margin: -10px 0 14px;
    padding: 7px 11px;
    border-radius: 999px;
    color: #0f4f48;
    background: linear-gradient(180deg, rgba(236, 253, 245, 0.96), rgba(219, 250, 244, 0.92));
    border: 1px solid rgba(45, 212, 191, 0.36);
    box-shadow: 0 12px 28px rgba(15, 118, 110, 0.10);
    font-size: 0.78rem;
    line-height: 1;
    font-weight: 900;
    white-space: nowrap;
}

.plan-name {
    color: #20275f;
    font-size: 1.08rem;
    font-weight: 900;
}

.plan-price {
    gap: 8px;
    margin: 13px 0 18px;
    color: #21116f;
    font-size: clamp(2.75rem, 3.45vw, 3.35rem);
}

.plan-price small {
    color: #687294;
    font-size: clamp(0.92rem, 1.2vw, 1.04rem);
    font-weight: 850;
}

.plan-key-feature {
    min-height: 2.9em;
    color: #606a8d;
    font-size: 0.96rem;
}

.premium-plans .plan-card {
    min-height: 438px;
}

.account-payment-section .plan-card,
body:not(.premium-page) .section-plans .plan-card {
    min-height: 308px;
}

.plan-btn {
    min-height: 54px;
    border-radius: 16px;
    background: linear-gradient(135deg, #171b4f 0%, #5f35f2 52%, #2f7cff 100%);
    box-shadow:
        0 17px 38px rgba(53, 48, 160, 0.26),
        inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

@media (max-width: 900px) {
    .premium-hero--plans .premium-copy h1 {
        font-size: clamp(2.7rem, 9vw, 4.1rem);
    }

    .plans-grid {
        width: min(100%, 560px);
    }

    .plan-card,
    .premium-plans .plan-card,
    .account-payment-section .plan-card {
        min-height: 0;
    }
}

@media (max-width: 640px) {
    .premium-hero--plans {
        padding-top: 40px;
    }

    .premium-hero--plans .premium-note {
        white-space: normal;
        line-height: 1.25;
    }

    .premium-hero--plans .premium-copy h1 {
        font-size: clamp(2.45rem, 11vw, 3.25rem);
    }

    .plan-card {
        padding: 25px 22px 22px;
    }

    .plan-choice-badge {
        margin-top: -6px;
    }

    .plan-price {
        font-size: clamp(2.65rem, 12vw, 3.15rem);
    }
}

/* Readable dark theme across every tab. */
html[data-theme="dark"],
html[data-theme="dark"] body {
    background: #080d1d !important;
    color: #edf3ff !important;
}

html[data-theme="dark"] .header,
html[data-theme="dark"].header-collapsed .header {
    background: rgba(8, 13, 29, 0.90) !important;
    border-bottom-color: rgba(170, 185, 255, 0.16) !important;
    box-shadow: 0 18px 46px rgba(0, 0, 0, 0.34) !important;
}

html[data-theme="dark"] .brand,
html[data-theme="dark"] .brand-text,
html[data-theme="dark"] .nav-links a,
html[data-theme="dark"] .header-control {
    color: #edf3ff !important;
    opacity: 1 !important;
}

html[data-theme="dark"] .brand-text::after {
    color: #5cf1d3 !important;
    text-shadow: 0 0 12px rgba(92, 241, 211, 0.45) !important;
}

html[data-theme="dark"] .lang-toggle,
html[data-theme="dark"] .theme-toggle,
html[data-theme="dark"] .header-collapse {
    color: #edf3ff !important;
    background:
        linear-gradient(180deg, rgba(16, 28, 55, 0.94), rgba(10, 19, 39, 0.90)),
        #0d1730 !important;
    border-color: rgba(168, 184, 255, 0.24) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 14px 32px rgba(0, 0, 0, 0.22) !important;
}

html[data-theme="dark"] .lang-toggle:hover,
html[data-theme="dark"] .theme-toggle:hover,
html[data-theme="dark"] .header-collapse:hover {
    color: #ffffff !important;
    background:
        linear-gradient(180deg, rgba(24, 41, 78, 0.98), rgba(13, 25, 52, 0.95)),
        #111e3b !important;
    border-color: rgba(92, 131, 255, 0.46) !important;
}

html[data-theme="dark"] .nav-primary a {
    color: #dbe6ff !important;
    background: rgba(13, 24, 49, 0.76) !important;
    border-color: rgba(168, 184, 255, 0.18) !important;
}

html[data-theme="dark"] .nav-primary a:hover,
html[data-theme="dark"] .nav-primary a[aria-current="page"] {
    color: #ffffff !important;
    background: linear-gradient(180deg, rgba(23, 38, 74, 0.96), rgba(12, 24, 50, 0.92)) !important;
    border-color: rgba(80, 145, 255, 0.52) !important;
    box-shadow: inset 0 -2px 0 #4c83ff, 0 12px 28px rgba(0, 0, 0, 0.20) !important;
}

html[data-theme="dark"] .hero,
html[data-theme="dark"] .premium-hero,
html[data-theme="dark"] .section-account,
html[data-theme="dark"] .section-plans,
html[data-theme="dark"] .premium-band,
html[data-theme="dark"] .section-why,
html[data-theme="dark"] .section-faq,
html[data-theme="dark"] .section-support,
html[data-theme="dark"] .account-page-section,
html[data-theme="dark"] .legal,
html[data-theme="dark"] .not-found {
    background:
        radial-gradient(820px 460px at 14% 4%, rgba(45, 212, 191, 0.16), transparent 64%),
        radial-gradient(860px 520px at 88% 12%, rgba(96, 91, 255, 0.18), transparent 66%),
        linear-gradient(180deg, #0a1024 0%, #0d1630 58%, #091020 100%) !important;
    color: #edf3ff !important;
}

html[data-theme="dark"] .hero h1,
html[data-theme="dark"] .premium-copy h1,
html[data-theme="dark"] .account-page-hero h1,
html[data-theme="dark"] .section-plans h2,
html[data-theme="dark"] .section-why h2,
html[data-theme="dark"] .premium-band h2,
html[data-theme="dark"] .legal h1,
html[data-theme="dark"] .legal h2,
html[data-theme="dark"] .not-found h1 {
    color: #f7f9ff !important;
    text-shadow: 0 14px 44px rgba(0, 0, 0, 0.22);
}

html[data-theme="dark"] .hero-subtitle,
html[data-theme="dark"] .section-subtitle,
html[data-theme="dark"] .premium-copy p,
html[data-theme="dark"] .account-page-hero .section-subtitle,
html[data-theme="dark"] .legal p,
html[data-theme="dark"] .legal li,
html[data-theme="dark"] .footer-content {
    color: #c5d0ea !important;
}

html[data-theme="dark"] .badge,
html[data-theme="dark"] .premium-note,
html[data-theme="dark"] .hero-proof-row span,
html[data-theme="dark"] .premium-proof-row span,
html[data-theme="dark"] .plan-choice-badge {
    color: #9ff6e6 !important;
    background:
        linear-gradient(180deg, rgba(18, 35, 54, 0.92), rgba(13, 27, 46, 0.86)),
        #0d1b2e !important;
    border-color: rgba(45, 212, 191, 0.36) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 16px 42px rgba(0, 0, 0, 0.24) !important;
}

html[data-theme="dark"] .plan-card,
html[data-theme="dark"] .account-card,
html[data-theme="dark"] .account-tabs,
html[data-theme="dark"] .account-intro-steps > div,
html[data-theme="dark"] .account-info-card,
html[data-theme="dark"] .dashboard-summary,
html[data-theme="dark"] .dashboard-stat,
html[data-theme="dark"] .dashboard-block,
html[data-theme="dark"] .premium-device-card,
html[data-theme="dark"] .premium-steps li,
html[data-theme="dark"] .why-card,
html[data-theme="dark"] .faq-item,
html[data-theme="dark"] .not-found-card {
    color: #edf3ff !important;
    background:
        linear-gradient(180deg, rgba(20, 30, 58, 0.96), rgba(13, 21, 43, 0.94)),
        #10182f !important;
    border-color: rgba(168, 184, 255, 0.18) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 26px 68px rgba(0, 0, 0, 0.34) !important;
}

html[data-theme="dark"] .featured-plan {
    border-color: rgba(129, 140, 248, 0.48) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.10),
        0 0 0 1px rgba(129, 140, 248, 0.14),
        0 34px 90px rgba(0, 0, 0, 0.40) !important;
}

html[data-theme="dark"] .plan-name,
html[data-theme="dark"] .plan-price,
html[data-theme="dark"] .why-card h3,
html[data-theme="dark"] .premium-steps strong,
html[data-theme="dark"] .account-intro-steps strong,
html[data-theme="dark"] .account-card h2,
html[data-theme="dark"] .dashboard-block strong,
html[data-theme="dark"] .dashboard-server strong,
html[data-theme="dark"] .faq-question {
    color: #f8fbff !important;
}

html[data-theme="dark"] .plan-price small,
html[data-theme="dark"] .plan-key-feature,
html[data-theme="dark"] .plan-card ul li,
html[data-theme="dark"] .why-card p,
html[data-theme="dark"] .premium-steps span,
html[data-theme="dark"] .account-intro-steps p,
html[data-theme="dark"] .account-card p,
html[data-theme="dark"] .dashboard-block p,
html[data-theme="dark"] .dashboard-server code,
html[data-theme="dark"] .faq-answer {
    color: #c4cee8 !important;
}

html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
    color: #f8fbff !important;
    background: rgba(7, 13, 29, 0.72) !important;
    border-color: rgba(168, 184, 255, 0.22) !important;
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
    color: #8f9ab8 !important;
}

html[data-theme="dark"] .install-btn--android,
html[data-theme="dark"] .account-login,
html[data-theme="dark"] .support-btn--email {
    color: #f8fbff !important;
    background: rgba(18, 28, 54, 0.92) !important;
    border-color: rgba(168, 184, 255, 0.20) !important;
}

html[data-theme="dark"] .footer {
    background: #070c1a !important;
    border-top-color: rgba(168, 184, 255, 0.14) !important;
}

html[data-theme="dark"] .account-intro-steps span {
    color: #0d3a35 !important;
    background: linear-gradient(180deg, #94f5df, #5dd7c4) !important;
    border-color: rgba(148, 245, 223, 0.46) !important;
}

html[data-theme="dark"] .account-status {
    color: #dce6ff !important;
    background:
        linear-gradient(180deg, rgba(16, 29, 58, 0.94), rgba(10, 20, 42, 0.92)),
        #101a34 !important;
    border-color: rgba(111, 146, 255, 0.26) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
}

html[data-theme="dark"] .email-verification-status {
    border-color: rgba(121, 242, 209, 0.24);
    background:
        radial-gradient(circle at 12% 0%, rgba(121, 242, 209, 0.15), transparent 38%),
        linear-gradient(180deg, rgba(16, 29, 58, 0.94), rgba(10, 20, 42, 0.9));
}

html[data-theme="dark"] .email-verification-status strong {
    color: #f8fbff;
}

html[data-theme="dark"] .email-verification-status span {
    color: #c4cee8;
}

html[data-theme="dark"] .email-verification-status button {
    color: #f8fbff;
    border-color: rgba(121, 242, 209, 0.24);
    background: rgba(255, 255, 255, 0.08);
}

@media (max-width: 640px) {
    .header .nav-right {
        grid-template-columns: minmax(0, 1fr) !important;
        justify-items: center !important;
        overflow: visible !important;
    }

    .header .nav-links.nav-primary,
    .header .nav-links {
        grid-column: 1 !important;
        width: min(100%, 360px) !important;
        max-width: 360px !important;
        min-width: 0 !important;
    }

    .header .lang-switcher,
    .header .header-tools {
        grid-column: 1 !important;
        justify-self: center !important;
    }

    .download-page .premium-hero-grid,
    .download-page .premium-copy,
    .download-page .premium-actions,
    .download-page .premium-device-card,
    .download-page .premium-proof-row {
        width: 100% !important;
        max-width: min(100%, 360px) !important;
        min-width: 0 !important;
        margin-right: auto !important;
        margin-left: auto !important;
    }

    .download-page .premium-copy {
        text-align: center !important;
    }

    .download-page .premium-proof-row {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

@media (max-width: 640px) {
    .header,
    .header .nav,
    .header .nav-right,
    .header .lang-switcher {
        overflow: visible !important;
    }

    .header .lang-switcher {
        position: relative !important;
        z-index: 5000 !important;
    }

    .header .lang-menu {
        position: absolute !important;
        top: calc(100% + 8px) !important;
        right: auto !important;
        left: 50% !important;
        width: min(280px, calc(100vw - 32px)) !important;
        max-height: min(68vh, 360px) !important;
        overflow-y: auto !important;
        transform: translateX(-50%) !important;
        z-index: 6000 !important;
    }

    .account-page .account-page-section {
        padding-top: 18px !important;
    }

    .account-page .account-page-hero {
        display: none !important;
    }

    .account-page .account-cabinet-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 14px !important;
    }

    .account-page .account-auth,
    .account-page .account-dashboard {
        order: 1 !important;
    }

    .account-page .account-guest {
        order: 2 !important;
    }

    .account-page .account-card {
        padding: 18px 16px !important;
    }
}

/* Download CTA polish */
.header-collapse,
html[data-theme="light"] .header-collapse,
html[data-theme="dark"] .header-collapse {
    display: none !important;
}

.install-btn.install-btn--android,
.download-card--android .install-btn,
html[data-theme="light"] .install-btn.install-btn--android,
html[data-theme="dark"] .install-btn.install-btn--android {
    color: #ffffff !important;
    border-color: rgba(20, 184, 166, 0.58) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0) 38%),
        linear-gradient(135deg, #34d399 0%, #10b981 48%, #0f9f82 100%) !important;
    box-shadow:
        0 18px 42px rgba(16, 185, 129, 0.32),
        0 8px 20px rgba(15, 159, 130, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.46) !important;
}

html[data-theme="dark"] .install-btn.install-btn--android,
html[data-theme="dark"] .download-card--android .install-btn {
    border-color: rgba(104, 255, 213, 0.42) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0) 40%),
        linear-gradient(135deg, #2dd4bf 0%, #10b981 50%, #087a66 100%) !important;
    box-shadow:
        0 18px 44px rgba(16, 185, 129, 0.28),
        0 0 0 1px rgba(104, 255, 213, 0.16) inset !important;
}

.install-btn.install-btn--android:hover,
.download-card--android .install-btn:hover {
    transform: translateY(-2px);
    box-shadow:
        0 22px 48px rgba(16, 185, 129, 0.38),
        0 10px 24px rgba(15, 159, 130, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.5) !important;
}

.install-btn .install-btn-icon {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 10px !important;
}

.install-btn.install-btn--android .install-btn-icon,
.download-card--android .install-btn .install-btn-icon {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.18) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.34) !important;
}

.install-btn.install-btn--android .logo-android,
.download-card--android .install-btn .logo-android {
    color: #ffffff !important;
    filter: drop-shadow(0 1px 2px rgba(0, 65, 50, 0.24)) !important;
}

.install-btn.install-btn--windows .install-btn-icon,
html[data-theme="light"] .install-btn.install-btn--windows .install-btn-icon,
html[data-theme="dark"] .install-btn.install-btn--windows .install-btn-icon {
    color: #ffffff !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0) 36%),
        linear-gradient(135deg, #2f8bff 0%, #1459df 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.34) !important;
    box-shadow:
        0 8px 18px rgba(20, 89, 223, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.42) !important;
}

.install-btn.install-btn--windows .logo-windows {
    color: #ffffff !important;
    filter: drop-shadow(0 1px 2px rgba(0, 28, 90, 0.38)) !important;
}

.account-plan-picker[hidden] {
    display: none !important;
}

.account-dashboard .dashboard-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.email-verification-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 14px;
    padding: 14px 16px;
    border: 1px solid rgba(16, 185, 129, 0.24);
    border-radius: 16px;
    background:
        radial-gradient(circle at 12% 0%, rgba(45, 212, 191, 0.18), transparent 36%),
        linear-gradient(180deg, rgba(247, 255, 252, 0.96), rgba(241, 249, 255, 0.86));
}

.email-verification-status[hidden] {
    display: none !important;
}

.email-verification-status.is-verified {
    border-color: rgba(16, 185, 129, 0.3);
}

.email-verification-status.is-pending {
    border-color: rgba(129, 140, 248, 0.28);
}

.email-verification-status strong,
.email-verification-status span {
    display: block;
}

.email-verification-status strong {
    color: #101634;
    font-size: 0.98rem;
}

.email-verification-status span {
    margin-top: 3px;
    color: #667095;
    font-size: 0.9rem;
    line-height: 1.4;
}

.email-verification-status button {
    flex: 0 0 auto;
    min-height: 38px;
    padding: 9px 13px;
    border: 1px solid rgba(20, 89, 223, 0.22);
    border-radius: 12px;
    color: #17204a;
    background: rgba(255, 255, 255, 0.72);
    font-weight: 800;
    cursor: pointer;
}

.email-verification-status button:disabled {
    cursor: wait;
    opacity: 0.68;
}

.dashboard-referral {
    display: grid;
    gap: 14px;
    margin-top: 14px;
    padding: 16px;
    border: 1px solid rgba(34, 197, 160, 0.22);
    border-radius: 18px;
    background:
        radial-gradient(circle at 14% 0%, rgba(45, 212, 191, 0.18), transparent 38%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 251, 255, 0.86));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.dashboard-referral-head {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 14px;
    align-items: start;
}

.dashboard-referral-head span,
.referral-stats em {
    display: block;
    color: #667095;
    font-size: 0.82rem;
    font-style: normal;
    font-weight: 800;
}

.dashboard-referral-head strong {
    display: block;
    margin-top: 2px;
    color: #101634;
    font-size: clamp(1.4rem, 3vw, 2rem);
    line-height: 1;
}

.dashboard-referral-head p {
    margin: 0;
    color: #5d688b;
    font-size: 0.92rem;
    line-height: 1.45;
    font-weight: 650;
}

.referral-link-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
}

.referral-link-row code {
    display: block;
    min-width: 0;
    overflow: hidden;
    padding: 11px 12px;
    border: 1px solid rgba(112, 126, 178, 0.18);
    border-radius: 12px;
    color: #101634;
    background: rgba(255, 255, 255, 0.72);
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: "Cascadia Mono", "JetBrains Mono", Consolas, monospace;
    font-size: 0.88rem;
    font-weight: 800;
}

.referral-link-row button {
    min-height: 42px;
    padding: 10px 14px;
    border: 1px solid rgba(16, 185, 129, 0.26);
    border-radius: 12px;
    color: #073d34;
    background: rgba(96, 220, 187, 0.18);
    font-weight: 900;
    cursor: pointer;
}

.referral-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.referral-stats span {
    min-width: 0;
    padding: 12px;
    border: 1px solid rgba(112, 126, 178, 0.16);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.58);
}

.referral-stats strong {
    display: block;
    color: #101634;
    font-size: 1.1rem;
    line-height: 1.1;
}

.account-plan-picker {
    border-color: rgba(16, 185, 129, 0.24) !important;
    background:
        radial-gradient(circle at 18% 0%, rgba(45, 212, 191, 0.15), transparent 38%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(247, 250, 255, 0.78)) !important;
}

.account-plan-picker-head {
    display: grid;
    gap: 5px;
    margin-bottom: 14px;
}

.account-plan-picker-head strong {
    color: #101634;
    font-size: 1.05rem;
}

.account-plan-picker-head p {
    margin: 0;
    color: #667095;
    font-size: 0.95rem;
    line-height: 1.45;
}

.account-plan-options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.account-plan-option {
    position: relative;
    display: grid;
    gap: 8px;
    min-width: 0;
    padding: 15px 14px;
    text-align: left;
    color: #131938;
    border: 1px solid rgba(112, 126, 178, 0.22);
    border-radius: 16px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 255, 0.88));
    box-shadow: 0 12px 28px rgba(34, 44, 86, 0.08);
    cursor: pointer;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.account-plan-option:hover {
    transform: translateY(-2px);
    border-color: rgba(16, 185, 129, 0.42);
    box-shadow: 0 18px 34px rgba(16, 185, 129, 0.16);
}

.account-plan-option.is-recommended {
    border-color: rgba(16, 185, 129, 0.42);
    box-shadow:
        0 18px 34px rgba(16, 185, 129, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.account-plan-badge {
    width: fit-content;
    max-width: 100%;
    padding: 4px 8px;
    color: #065f46;
    border-radius: 999px;
    background: rgba(16, 185, 129, 0.12);
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1.2;
}

.account-plan-name {
    font-weight: 900;
    font-size: 1rem;
}

.account-plan-price {
    display: flex;
    align-items: baseline;
    gap: 5px;
    color: #24126d;
    font-size: 1.55rem;
    line-height: 1;
}

.account-plan-price small {
    color: #697199;
    font-size: 0.82rem;
    font-weight: 800;
}

.account-plan-option em {
    color: #667095;
    font-size: 0.82rem;
    font-style: normal;
    font-weight: 750;
    line-height: 1.35;
}

html[data-theme="dark"] .account-plan-picker {
    border-color: rgba(104, 255, 213, 0.18) !important;
    background:
        radial-gradient(circle at 18% 0%, rgba(45, 212, 191, 0.18), transparent 38%),
        linear-gradient(180deg, rgba(18, 22, 48, 0.94), rgba(13, 17, 38, 0.9)) !important;
}

html[data-theme="dark"] .account-plan-picker-head strong,
html[data-theme="dark"] .account-plan-option {
    color: #f7f9ff;
}

html[data-theme="dark"] .account-plan-picker-head p,
html[data-theme="dark"] .account-plan-option em,
html[data-theme="dark"] .account-plan-price small {
    color: #b9c3e6;
}

html[data-theme="dark"] .account-plan-option {
    border-color: rgba(148, 163, 255, 0.22);
    background: linear-gradient(180deg, rgba(25, 30, 63, 0.96), rgba(15, 20, 44, 0.9));
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.26);
}

html[data-theme="dark"] .account-plan-option:hover,
html[data-theme="dark"] .account-plan-option.is-recommended {
    border-color: rgba(104, 255, 213, 0.34);
    box-shadow: 0 20px 38px rgba(16, 185, 129, 0.14);
}

html[data-theme="dark"] .account-plan-badge {
    color: #bffff0;
    background: rgba(45, 212, 191, 0.16);
}

html[data-theme="dark"] .account-plan-price {
    color: #ffffff;
}

html[data-theme="dark"] .dashboard-referral {
    border-color: rgba(104, 255, 213, 0.20);
    background:
        radial-gradient(circle at 14% 0%, rgba(45, 212, 191, 0.12), transparent 40%),
        linear-gradient(180deg, rgba(25, 30, 63, 0.96), rgba(15, 20, 44, 0.9));
}

html[data-theme="dark"] .dashboard-referral-head strong,
html[data-theme="dark"] .referral-stats strong,
html[data-theme="dark"] .referral-link-row code {
    color: #ffffff;
}

html[data-theme="dark"] .dashboard-referral-head span,
html[data-theme="dark"] .dashboard-referral-head p,
html[data-theme="dark"] .referral-stats em {
    color: #b9c3e6;
}

html[data-theme="dark"] .referral-link-row code,
html[data-theme="dark"] .referral-stats span {
    border-color: rgba(148, 163, 255, 0.18);
    background: rgba(255, 255, 255, 0.045);
}

html[data-theme="dark"] .referral-link-row button {
    color: #06241f;
    border-color: rgba(104, 255, 213, 0.30);
    background: linear-gradient(135deg, #8cf4dd 0%, #16c7a1 100%);
}

@media (max-width: 760px) {
    .account-dashboard .dashboard-stats {
        grid-template-columns: 1fr !important;
    }

    .email-verification-status {
        align-items: stretch;
        flex-direction: column;
    }

    .email-verification-status button {
        width: 100%;
    }

    .dashboard-referral-head,
    .referral-link-row,
    .referral-stats {
        grid-template-columns: 1fr;
    }

    .referral-link-row button {
        width: 100%;
    }

    .account-plan-options {
        grid-template-columns: 1fr;
    }

    .account-plan-option {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
    }

    .account-plan-badge,
    .account-plan-option em {
        grid-column: 1 / -1;
    }
}

/* =============================================================================
 * Premium scale visual layer. Text and markup are intentionally untouched.
 * ========================================================================== */

:root {
    --nc-premium-font: "Inter", "Segoe UI", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
    --nc-premium-light-bg: #eef5ff;
    --nc-premium-light-bg-2: #f8fbff;
    --nc-premium-light-surface: rgba(255, 255, 255, 0.88);
    --nc-premium-light-surface-strong: rgba(255, 255, 255, 0.96);
    --nc-premium-light-ink: #0c1530;
    --nc-premium-light-muted: #627092;
    --nc-premium-light-line: rgba(82, 105, 152, 0.20);
    --nc-premium-dark-bg: #070a18;
    --nc-premium-dark-bg-2: #11172a;
    --nc-premium-dark-surface: rgba(20, 25, 46, 0.86);
    --nc-premium-dark-surface-strong: rgba(27, 32, 55, 0.94);
    --nc-premium-dark-ink: #f8fbff;
    --nc-premium-dark-muted: #b8c3dc;
    --nc-premium-dark-line: rgba(193, 209, 255, 0.16);
    --nc-premium-green: #16c7a1;
    --nc-premium-green-2: #0f9f82;
    --nc-premium-navy: #0d1424;
    --nc-premium-blue: #3268ff;
    --nc-premium-violet: #7657ff;
    --nc-premium-radius: 26px;
}

html[data-theme="light"] {
    color-scheme: light;
}

html[data-theme="dark"] {
    color-scheme: dark;
}

html[data-theme="light"] body,
html[data-theme="dark"] body {
    font-family: var(--nc-premium-font);
    letter-spacing: 0;
}

html[data-theme="light"] body {
    background:
        radial-gradient(920px 520px at 8% 0%, rgba(22, 199, 161, 0.13), transparent 62%),
        radial-gradient(980px 560px at 100% 4%, rgba(118, 87, 255, 0.14), transparent 60%),
        linear-gradient(180deg, var(--nc-premium-light-bg-2) 0%, var(--nc-premium-light-bg) 100%);
    color: var(--nc-premium-light-ink);
}

html[data-theme="dark"] body {
    background:
        radial-gradient(960px 520px at 8% 0%, rgba(22, 199, 161, 0.16), transparent 64%),
        radial-gradient(900px 560px at 100% 8%, rgba(118, 87, 255, 0.22), transparent 62%),
        linear-gradient(180deg, var(--nc-premium-dark-bg-2) 0%, var(--nc-premium-dark-bg) 58%, #080b16 100%);
    color: var(--nc-premium-dark-ink);
}

body::before,
.netcat-plexus {
    pointer-events: none;
}

.header,
.premium-page .header,
.account-page .header,
html[data-theme="light"] .header,
html[data-theme="dark"] .header {
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
}

html[data-theme="light"] .header,
html[data-theme="light"] .premium-page .header,
html[data-theme="light"] .account-page .header {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(246, 250, 255, 0.84));
    border-bottom: 1px solid rgba(90, 111, 158, 0.18);
    box-shadow: 0 18px 46px rgba(36, 54, 96, 0.10);
}

html[data-theme="dark"] .header,
html[data-theme="dark"] .premium-page .header,
html[data-theme="dark"] .account-page .header {
    background:
        linear-gradient(180deg, rgba(8, 11, 24, 0.88), rgba(10, 13, 28, 0.78));
    border-bottom: 1px solid rgba(193, 209, 255, 0.12);
    box-shadow: 0 18px 46px rgba(0, 0, 0, 0.32);
}

.brand,
.brand-text,
.nav-links a,
.lang-toggle,
.theme-toggle {
    font-family: var(--nc-premium-font);
}

html[data-theme="light"] .brand,
html[data-theme="light"] .brand-text,
html[data-theme="light"] .nav-links a {
    color: #1d2746;
}

html[data-theme="dark"] .brand,
html[data-theme="dark"] .brand-text,
html[data-theme="dark"] .nav-links a {
    color: rgba(248, 251, 255, 0.86);
}

.nav-links a {
    border-radius: 12px;
    font-weight: 850;
}

html[data-theme="light"] .nav-links a:hover,
html[data-theme="light"] .nav-links a[aria-current="page"] {
    color: #17204a;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: inset 0 -2px 0 rgba(118, 87, 255, 0.68);
}

html[data-theme="dark"] .nav-links a:hover,
html[data-theme="dark"] .nav-links a[aria-current="page"] {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 -2px 0 rgba(140, 244, 221, 0.82);
}

.lang-toggle,
.theme-toggle {
    border-radius: 12px;
}

html[data-theme="light"] .lang-toggle,
html[data-theme="light"] .theme-toggle {
    background: rgba(255, 255, 255, 0.76);
    border-color: rgba(90, 111, 158, 0.20);
    color: #17204a;
    box-shadow: 0 10px 24px rgba(36, 54, 96, 0.08);
}

html[data-theme="dark"] .lang-toggle,
html[data-theme="dark"] .theme-toggle {
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(193, 209, 255, 0.18);
    color: #f8fbff;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28);
}

.hero,
.premium-hero,
.section-plans,
.section-account,
.account-page-section,
.premium-band,
.section-download-prominent {
    position: relative;
    overflow: hidden;
}

.hero::after,
.premium-hero::after,
.section-plans::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: 0.56;
    background-image:
        linear-gradient(rgba(94, 115, 165, 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(94, 115, 165, 0.06) 1px, transparent 1px);
    background-size: 46px 46px;
    mask-image: radial-gradient(circle at 50% 28%, #000 0%, transparent 72%);
}

.hero > *,
.premium-hero > *,
.section-plans > *,
.section-account > *,
.account-page-section > *,
.premium-band > * {
    position: relative;
    z-index: 1;
}

html[data-theme="light"] .hero,
html[data-theme="light"] .premium-hero,
html[data-theme="light"] .section-plans,
html[data-theme="light"] .section-account,
html[data-theme="light"] .account-page-section,
html[data-theme="light"] .premium-band {
    background:
        radial-gradient(860px 440px at 18% 8%, rgba(22, 199, 161, 0.15), transparent 64%),
        radial-gradient(920px 480px at 88% 14%, rgba(118, 87, 255, 0.14), transparent 64%),
        linear-gradient(180deg, #f9fcff 0%, #edf4ff 100%);
}

html[data-theme="dark"] .hero,
html[data-theme="dark"] .premium-hero,
html[data-theme="dark"] .section-plans,
html[data-theme="dark"] .section-account,
html[data-theme="dark"] .account-page-section,
html[data-theme="dark"] .premium-band {
    background:
        radial-gradient(880px 460px at 16% 8%, rgba(22, 199, 161, 0.16), transparent 64%),
        radial-gradient(900px 500px at 88% 10%, rgba(118, 87, 255, 0.22), transparent 64%),
        linear-gradient(180deg, #11172b 0%, #080b17 100%);
}

.hero,
.premium-hero {
    padding-top: clamp(5.1rem, 7.5vw, 6.8rem);
    padding-bottom: clamp(3.4rem, 5.4vw, 5.2rem);
}

.premium-hero--plans {
    padding-top: clamp(4.1rem, 6vw, 5.2rem);
    padding-bottom: clamp(2rem, 3.3vw, 2.8rem);
}

.premium-hero--plans .premium-copy h1 {
    max-width: 980px;
    font-size: clamp(3.2rem, 6.1vw, 5rem);
    line-height: 0.98;
}

.premium-plans {
    padding-top: clamp(1.6rem, 3vw, 2.4rem);
}

.hero h1,
.premium-copy h1,
.account-page-hero h1,
.section-plans h2 {
    color: inherit;
    font-family: var(--nc-premium-font);
    font-weight: 900;
    letter-spacing: 0;
    text-shadow: none;
}

html[data-theme="light"] .hero h1,
html[data-theme="light"] .premium-copy h1,
html[data-theme="light"] .account-page-hero h1,
html[data-theme="light"] .section-plans h2 {
    color: var(--nc-premium-light-ink);
}

html[data-theme="dark"] .hero h1,
html[data-theme="dark"] .premium-copy h1,
html[data-theme="dark"] .account-page-hero h1,
html[data-theme="dark"] .section-plans h2 {
    color: var(--nc-premium-dark-ink);
}

.hero-subtitle,
.section-subtitle,
.premium-copy p,
.account-page-hero .section-subtitle,
.premium-split .section-subtitle {
    font-family: var(--nc-premium-font);
    letter-spacing: 0;
}

html[data-theme="light"] .hero-subtitle,
html[data-theme="light"] .section-subtitle,
html[data-theme="light"] .premium-copy p,
html[data-theme="light"] .account-page-hero .section-subtitle,
html[data-theme="light"] .premium-split .section-subtitle {
    color: var(--nc-premium-light-muted);
}

html[data-theme="dark"] .hero-subtitle,
html[data-theme="dark"] .section-subtitle,
html[data-theme="dark"] .premium-copy p,
html[data-theme="dark"] .account-page-hero .section-subtitle,
html[data-theme="dark"] .premium-split .section-subtitle {
    color: var(--nc-premium-dark-muted);
}

.badge,
.hero .badge,
.premium-note,
.hero-proof-row span {
    border-radius: 999px;
    font-family: var(--nc-premium-font);
    font-weight: 900;
    letter-spacing: 0;
}

html[data-theme="light"] .badge,
html[data-theme="light"] .hero .badge,
html[data-theme="light"] .premium-note,
html[data-theme="light"] .hero-proof-row span {
    color: #075f50;
    border-color: rgba(22, 199, 161, 0.28);
    background: rgba(236, 255, 250, 0.72);
    box-shadow: 0 14px 36px rgba(36, 54, 96, 0.09);
}

html[data-theme="dark"] .badge,
html[data-theme="dark"] .hero .badge,
html[data-theme="dark"] .premium-note,
html[data-theme="dark"] .hero-proof-row span {
    color: #9fffea;
    border-color: rgba(140, 244, 221, 0.26);
    background: rgba(22, 199, 161, 0.10);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
}

.plans-grid {
    width: min(100%, 980px);
    max-width: 980px;
    margin-right: auto;
    margin-left: auto;
    gap: clamp(18px, 2.2vw, 24px);
}

.plan-card,
.premium-plans .plan-card,
html[data-theme="light"] .plan-card,
html[data-theme="dark"] .plan-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 338px;
    padding: 26px 24px 24px;
    border-radius: var(--nc-premium-radius);
    overflow: hidden;
    transform: translateZ(0);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.premium-plans .plan-card {
    min-height: 456px;
}

.plan-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(90deg, rgba(22, 199, 161, 0.72), rgba(118, 87, 255, 0.74));
}

html[data-theme="light"] .plan-card,
html[data-theme="light"] .premium-plans .plan-card {
    border: 1px solid var(--nc-premium-light-line);
    background:
        radial-gradient(420px 220px at 78% -10%, rgba(118, 87, 255, 0.08), transparent 58%),
        linear-gradient(180deg, var(--nc-premium-light-surface-strong), rgba(250, 252, 255, 0.90));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.96),
        0 26px 70px rgba(36, 54, 96, 0.13);
}

html[data-theme="dark"] .plan-card,
html[data-theme="dark"] .premium-plans .plan-card {
    border: 1px solid var(--nc-premium-dark-line);
    background:
        radial-gradient(420px 220px at 78% -10%, rgba(118, 87, 255, 0.15), transparent 58%),
        linear-gradient(180deg, var(--nc-premium-dark-surface-strong), var(--nc-premium-dark-surface));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 28px 76px rgba(0, 0, 0, 0.36);
}

.featured-plan,
html[data-theme="light"] .featured-plan,
html[data-theme="dark"] .featured-plan {
    border-color: rgba(22, 199, 161, 0.42);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 30px 88px rgba(22, 199, 161, 0.18);
}

.featured-plan::before {
    height: 5px;
    background: linear-gradient(90deg, #8cf4dd, #16c7a1 42%, #7657ff);
}

.plan-card:hover,
.featured-plan:hover,
html[data-theme="light"] .plan-card:hover,
html[data-theme="dark"] .plan-card:hover {
    transform: translateY(-3px);
}

html[data-theme="light"] .plan-card:hover {
    border-color: rgba(22, 199, 161, 0.40);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.96),
        0 32px 84px rgba(36, 54, 96, 0.17);
}

html[data-theme="dark"] .plan-card:hover {
    border-color: rgba(140, 244, 221, 0.32);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.10),
        0 34px 90px rgba(0, 0, 0, 0.45),
        0 0 46px rgba(22, 199, 161, 0.08);
}

.plan-choice-badge {
    width: fit-content;
    max-width: 100%;
    padding: 7px 12px;
    border-radius: 999px;
    font-size: 0.78rem;
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0;
}

html[data-theme="light"] .plan-choice-badge {
    color: #075f50;
    border: 1px solid rgba(22, 199, 161, 0.24);
    background: rgba(222, 255, 246, 0.78);
}

html[data-theme="dark"] .plan-choice-badge {
    color: #aaffed;
    border: 1px solid rgba(140, 244, 221, 0.24);
    background: rgba(22, 199, 161, 0.14);
}

.plan-name {
    color: inherit;
    font-family: var(--nc-premium-font);
    font-size: 1.12rem;
    font-weight: 900;
}

.plan-price {
    display: flex;
    align-items: baseline;
    flex-wrap: nowrap;
    gap: 8px;
    margin: 15px 0 16px;
    color: inherit;
    font-family: var(--nc-premium-font);
    font-size: clamp(2.55rem, 4.4vw, 3.7rem);
    line-height: 0.92;
    font-weight: 950;
    white-space: nowrap;
}

.plan-price small {
    color: inherit;
    opacity: 0.62;
    font-size: clamp(0.9rem, 1.25vw, 1.05rem);
    font-weight: 850;
}

html[data-theme="light"] .plan-name,
html[data-theme="light"] .plan-price {
    color: #102044;
}

html[data-theme="dark"] .plan-name,
html[data-theme="dark"] .plan-price {
    color: #ffffff;
}

.plan-key-feature,
.plan-card ul li {
    font-family: var(--nc-premium-font);
    letter-spacing: 0;
}

html[data-theme="light"] .plan-key-feature,
html[data-theme="light"] .plan-card ul li {
    color: var(--nc-premium-light-muted);
}

html[data-theme="dark"] .plan-key-feature,
html[data-theme="dark"] .plan-card ul li {
    color: var(--nc-premium-dark-muted);
}

.plan-card ul li::before {
    top: 0.74em;
    width: 5px;
    height: 5px;
    background: var(--nc-premium-green);
    box-shadow: 0 0 0 5px rgba(22, 199, 161, 0.11);
}

.plan-btn {
    min-height: 54px;
    border-radius: 16px;
    font-family: var(--nc-premium-font);
    font-weight: 950;
    letter-spacing: 0;
    text-decoration: none;
}

html[data-theme="light"] .plan-btn,
html[data-theme="dark"] .plan-btn {
    color: #ffffff;
    background: linear-gradient(135deg, #131a2b 0%, #070d1a 100%);
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow:
        0 18px 38px rgba(9, 15, 30, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.featured-plan .plan-btn,
html[data-theme="light"] .featured-plan .plan-btn,
html[data-theme="dark"] .featured-plan .plan-btn {
    color: #ffffff;
    background: linear-gradient(135deg, var(--nc-premium-green) 0%, var(--nc-premium-green-2) 100%);
    box-shadow:
        0 18px 42px rgba(22, 199, 161, 0.26),
        inset 0 1px 0 rgba(255, 255, 255, 0.26);
}

.install-btn,
.premium-actions .install-btn,
.hero-install .install-btn,
.download-card .install-btn {
    min-height: 66px;
    border-radius: 18px;
    font-family: var(--nc-premium-font);
    font-weight: 950;
    letter-spacing: 0;
    text-decoration: none;
    transform: translateZ(0);
}

.install-btn-icon {
    border-radius: 12px;
}

.install-btn--android,
html[data-theme="light"] .install-btn--android,
html[data-theme="dark"] .install-btn--android,
.download-card--android .install-btn,
html[data-theme="light"] .download-card--android .install-btn,
html[data-theme="dark"] .download-card--android .install-btn {
    color: #ffffff !important;
    border-color: rgba(140, 244, 221, 0.54) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0) 42%),
        linear-gradient(135deg, #61ddb2 0%, var(--nc-premium-green) 42%, var(--nc-premium-green-2) 100%) !important;
    box-shadow:
        0 22px 48px rgba(22, 199, 161, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.34) !important;
}

.install-btn--windows,
html[data-theme="light"] .install-btn--windows,
html[data-theme="dark"] .install-btn--windows,
.download-card--windows .install-btn,
html[data-theme="light"] .download-card--windows .install-btn,
html[data-theme="dark"] .download-card--windows .install-btn {
    color: #ffffff !important;
    border-color: rgba(146, 165, 214, 0.34) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0) 44%),
        linear-gradient(135deg, #24304a 0%, #111827 58%, #090f1f 100%) !important;
    box-shadow:
        0 22px 48px rgba(11, 18, 34, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

.install-btn:hover {
    transform: translateY(-2px);
}

.install-btn .install-btn-label {
    color: inherit !important;
    line-height: 1.14;
    text-shadow: none;
}

.install-btn--android .install-btn-icon,
html[data-theme="light"] .install-btn--android .install-btn-icon,
html[data-theme="dark"] .install-btn--android .install-btn-icon {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.18) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
}

.install-btn--windows .install-btn-icon,
html[data-theme="light"] .install-btn--windows .install-btn-icon,
html[data-theme="dark"] .install-btn--windows .install-btn-icon {
    color: #ffffff !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.26), rgba(255, 255, 255, 0.04)),
        linear-gradient(135deg, #3b82ff 0%, #175de8 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.28) !important;
}

.logo-android,
.logo-windows {
    color: currentColor !important;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.22));
}

.premium-device-card,
.download-card,
.account-card,
.account-tabs,
.dashboard-block,
.account-login,
.email-verification-status,
.account-plan-picker,
.account-plan-option,
.netcat-hero-stage,
.hero-info {
    border-radius: var(--nc-premium-radius);
}

html[data-theme="light"] .premium-device-card,
html[data-theme="light"] .download-card,
html[data-theme="light"] .account-card,
html[data-theme="light"] .account-tabs,
html[data-theme="light"] .dashboard-block,
html[data-theme="light"] .account-login,
html[data-theme="light"] .email-verification-status,
html[data-theme="light"] .account-plan-picker,
html[data-theme="light"] .account-plan-option,
html[data-theme="light"] .netcat-hero-stage,
html[data-theme="light"] .hero-info {
    color: var(--nc-premium-light-ink);
    border-color: var(--nc-premium-light-line);
    background:
        radial-gradient(520px 260px at 84% -10%, rgba(118, 87, 255, 0.08), transparent 62%),
        linear-gradient(180deg, var(--nc-premium-light-surface-strong), rgba(250, 252, 255, 0.88));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.96),
        0 26px 70px rgba(36, 54, 96, 0.13);
}

html[data-theme="dark"] .premium-device-card,
html[data-theme="dark"] .download-card,
html[data-theme="dark"] .account-card,
html[data-theme="dark"] .account-tabs,
html[data-theme="dark"] .dashboard-block,
html[data-theme="dark"] .account-login,
html[data-theme="dark"] .email-verification-status,
html[data-theme="dark"] .account-plan-picker,
html[data-theme="dark"] .account-plan-option,
html[data-theme="dark"] .netcat-hero-stage,
html[data-theme="dark"] .hero-info {
    color: var(--nc-premium-dark-ink);
    border-color: var(--nc-premium-dark-line);
    background:
        radial-gradient(520px 260px at 84% -10%, rgba(118, 87, 255, 0.15), transparent 62%),
        linear-gradient(180deg, var(--nc-premium-dark-surface-strong), var(--nc-premium-dark-surface));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 28px 76px rgba(0, 0, 0, 0.36);
}

html[data-theme="dark"] .premium-device-card strong,
html[data-theme="dark"] .premium-steps strong,
html[data-theme="dark"] .account-card h2,
html[data-theme="dark"] .account-card strong,
html[data-theme="dark"] .dashboard-block strong,
html[data-theme="dark"] .download-card strong,
html[data-theme="dark"] .premium-split h2 {
    color: #ffffff;
}

html[data-theme="dark"] .premium-device-card span,
html[data-theme="dark"] .premium-steps span,
html[data-theme="dark"] .account-card p,
html[data-theme="dark"] .dashboard-block p,
html[data-theme="dark"] .download-card p,
html[data-theme="dark"] .account-login,
html[data-theme="dark"] .email-verification-status span {
    color: var(--nc-premium-dark-muted);
}

.premium-steps li {
    border-radius: 18px;
}

html[data-theme="light"] .premium-steps li {
    border-color: rgba(82, 105, 152, 0.18);
    background: rgba(255, 255, 255, 0.68);
}

html[data-theme="dark"] .premium-steps li {
    border-color: rgba(193, 209, 255, 0.14);
    background: rgba(255, 255, 255, 0.045);
}

.account-cabinet-grid {
    width: min(100%, 720px);
}

.account-dashboard {
    width: min(100%, 720px);
    margin-right: auto;
    margin-left: auto;
}

.dashboard-stat,
.account-field,
.subscription-row,
.account-plan-option {
    border-radius: 16px;
}

html[data-theme="dark"] .account-submit,
html[data-theme="dark"] .account-tab.is-active {
    color: #071313;
    background: linear-gradient(135deg, #8cf4dd 0%, var(--nc-premium-green) 100%);
}

html[data-theme="dark"] .account-tab,
html[data-theme="dark"] .account-link-inline {
    color: var(--nc-premium-dark-muted);
}

html[data-theme="dark"] .footer {
    border-top-color: rgba(193, 209, 255, 0.12);
    background: #080b16;
}

html[data-theme="light"] .footer {
    border-top-color: rgba(82, 105, 152, 0.14);
    background: #eef5ff;
}

.footer-content {
    padding-bottom: clamp(48px, 5vw, 76px);
}

.footer-links {
    margin-top: 14px;
    gap: 12px;
}

.footer-links a {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 8px 14px;
    border: 1px solid rgba(122, 97, 255, 0.24);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.10);
    color: #8cf4dd;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.10),
        0 10px 28px rgba(5, 7, 16, 0.18);
    text-decoration: none;
}

.footer-links a:hover {
    color: #ffffff;
    border-color: rgba(140, 244, 221, 0.48);
    background: rgba(140, 244, 221, 0.14);
}

html[data-theme="light"] .footer-links a {
    color: #21423f;
    border-color: rgba(33, 154, 126, 0.22);
    background: rgba(255, 255, 255, 0.72);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.72),
        0 12px 30px rgba(75, 93, 140, 0.12);
}

html[data-theme="light"] .footer-links a:hover {
    color: #13302e;
    border-color: rgba(33, 154, 126, 0.38);
    background: rgba(231, 255, 247, 0.92);
}

.support-legal-links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
    min-width: min(100%, 420px);
}

.support-legal-links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 18px;
    border: 1px solid rgba(33, 154, 126, 0.28);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.82);
    color: #173533;
    font-weight: 800;
    text-decoration: none;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.78),
        0 16px 36px rgba(73, 87, 140, 0.12);
}

.support-legal-links a:hover {
    color: #0e2c29;
    border-color: rgba(33, 154, 126, 0.46);
    background: rgba(232, 255, 247, 0.96);
}

html[data-theme="dark"] .support-legal-links a {
    color: #8cf4dd;
    border-color: rgba(140, 244, 221, 0.24);
    background: rgba(255, 255, 255, 0.08);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.10),
        0 16px 36px rgba(5, 7, 16, 0.24);
}

html[data-theme="dark"] .support-legal-links a:hover {
    color: #ffffff;
    border-color: rgba(140, 244, 221, 0.48);
    background: rgba(140, 244, 221, 0.14);
}

@media (max-width: 980px) {
    .plans-grid {
        width: min(100%, 560px);
        grid-template-columns: 1fr;
    }

    .plan-card,
    .premium-plans .plan-card {
        min-height: 0;
    }
}

@media (max-width: 640px) {
    .hero,
    .premium-hero {
        padding-top: 42px;
        padding-bottom: 42px;
    }

    .hero h1,
    .premium-copy h1,
    .account-page-hero h1,
    .section-plans h2 {
        font-size: clamp(2rem, 9.8vw, 2.85rem);
        line-height: 1.06;
    }

    .premium-copy p,
    .hero-subtitle,
    .section-subtitle {
        font-size: 1rem;
        line-height: 1.52;
    }

    .plans-grid {
        gap: 16px;
    }

    .plan-card,
    .premium-plans .plan-card {
        padding: 24px 20px 20px;
        border-radius: 22px;
    }

    .plan-price {
        font-size: clamp(2.55rem, 13vw, 3.15rem);
    }

    .plan-key-feature,
    .plan-card ul li {
        font-size: 0.95rem;
    }

    .install-btn,
    .premium-actions .install-btn,
    .hero-install .install-btn {
        width: 100% !important;
        max-width: 360px !important;
        min-height: 62px;
        margin-right: auto;
        margin-left: auto;
    }

    .premium-actions,
    .hero-install {
        gap: 12px;
    }

    .premium-device-card,
    .account-card,
    .dashboard-block {
        border-radius: 22px;
    }

    .account-cabinet-grid,
    .account-dashboard {
        width: min(100%, 100%);
    }
}

/* Stable tariff card layout: keep price periods readable and align actions. */
.section-plans .plans-grid,
.premium-plans.plans-grid,
.premium-plans .plans-grid {
    width: min(100%, 1080px);
    max-width: 1080px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
}

.section-plans .plan-card,
.premium-plans .plan-card {
    min-width: 0;
    min-height: 342px;
    height: 100%;
    gap: 0;
}

.section-plans .plan-name,
.premium-plans .plan-name {
    min-height: 1.35em;
}

.section-plans .plan-choice-badge,
.premium-plans .plan-choice-badge {
    margin-bottom: 12px;
}

.section-plans .plan-price,
.premium-plans .plan-price {
    display: block;
    width: 100%;
    max-width: 100%;
    margin: 14px 0 14px;
    font-size: clamp(3rem, 4.1vw, 3.55rem);
    line-height: 0.92;
    white-space: normal;
    overflow-wrap: normal;
}

.section-plans .plan-price small,
.premium-plans .plan-price small {
    display: block;
    width: 100%;
    margin-top: 9px;
    font-size: clamp(0.92rem, 1.1vw, 1.02rem);
    line-height: 1.18;
    white-space: normal;
}

.plan-price.price-promo,
.section-plans .plan-price.price-promo,
.premium-plans .plan-price.price-promo {
    display: flex;
    align-items: baseline;
    gap: 8px 12px;
    flex-wrap: wrap;
}

.plan-price.price-promo .old-price,
.account-plan-price.price-promo .old-price {
    color: #7b829f;
    text-decoration-line: line-through;
    text-decoration-thickness: 2px;
    text-decoration-color: rgba(31, 42, 90, 0.58);
}

.plan-price.price-promo .old-price {
    font-size: clamp(1.15rem, 1.8vw, 1.45rem);
    line-height: 1;
    font-weight: 850;
}

.plan-price.price-promo .new-price {
    color: inherit;
    line-height: 0.92;
}

.plan-price.price-promo small,
.section-plans .plan-price.price-promo small,
.premium-plans .plan-price.price-promo small {
    flex: 0 0 100%;
    margin-top: 0;
}

.account-plan-price.price-promo {
    flex-wrap: wrap;
    gap: 4px 8px;
}

.account-plan-price.price-promo .old-price {
    font-size: 0.68em;
    line-height: 1;
    font-weight: 850;
}

.account-plan-price.price-promo .new-price {
    color: inherit;
}

.account-plan-price.price-promo small {
    flex: 0 0 100%;
    margin-top: 1px;
}

html[data-theme="dark"] .plan-price.price-promo .old-price,
html[data-theme="dark"] .account-plan-price.price-promo .old-price {
    color: #aeb6d6;
    text-decoration-color: rgba(226, 232, 255, 0.64);
}

.section-plans .plan-key-feature,
.premium-plans .plan-key-feature {
    min-height: 3.15em;
    margin-bottom: 20px;
}

.section-plans .plan-btn,
.premium-plans .plan-btn {
    width: 100%;
    margin-top: auto;
}

@media (max-width: 980px) {
    .section-plans .plans-grid,
    .premium-plans.plans-grid,
    .premium-plans .plans-grid {
        width: min(100%, 560px);
        max-width: 560px;
        grid-template-columns: 1fr;
    }

    .section-plans .plan-card,
    .premium-plans .plan-card {
        min-height: 0;
    }

    .section-plans .plan-key-feature,
    .premium-plans .plan-key-feature {
        min-height: 0;
    }
}

/* Russia section polish: readable premium cards and no duplicated mobile CTA. */
.section-why {
    background:
        radial-gradient(620px 300px at 18% 8%, rgba(82, 211, 188, 0.10), transparent 66%),
        radial-gradient(680px 360px at 82% 12%, rgba(86, 105, 185, 0.09), transparent 68%),
        linear-gradient(180deg, #f7faff 0%, #edf3ff 100%);
}

.section-why .container {
    max-width: 1120px;
}

.section-why h2 {
    margin-bottom: 10px;
    letter-spacing: 0;
}

.section-why .section-subtitle {
    margin-right: auto;
    margin-left: auto;
}

.why-grid {
    width: min(100%, 980px);
    margin: 34px auto 0;
    align-items: stretch;
}

.why-card,
.why-card.why-card--wide {
    position: relative;
    min-height: 292px;
    padding: 30px 28px 28px;
    overflow: hidden;
    border-radius: 26px;
    border-color: rgba(102, 119, 168, 0.18);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 251, 255, 0.90)),
        #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.95),
        0 24px 64px rgba(44, 63, 105, 0.12);
}

.why-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    background: linear-gradient(90deg, rgba(82, 211, 188, 0.72), rgba(107, 123, 255, 0.46), rgba(245, 190, 87, 0.48));
    opacity: 0.72;
}

.why-icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    font-size: 0.92rem;
    line-height: 1;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.why-card:nth-child(2) .why-icon {
    font-size: 1.2rem;
    color: #2638a8;
    background: rgba(108, 122, 255, 0.13);
    border-color: rgba(108, 122, 255, 0.26);
}

.why-card h3 {
    max-width: 11em;
}

.why-card p {
    max-width: 18.5em;
}

.mobile-sticky-cta {
    display: none !important;
}

html[data-theme="dark"] .section-why {
    background:
        radial-gradient(620px 300px at 18% 8%, rgba(82, 211, 188, 0.10), transparent 66%),
        radial-gradient(680px 360px at 82% 12%, rgba(108, 122, 255, 0.13), transparent 68%),
        linear-gradient(180deg, #0a0d19 0%, #11162a 100%);
}

html[data-theme="dark"] .why-card,
html[data-theme="dark"] .why-card.why-card--wide {
    background:
        linear-gradient(180deg, rgba(19, 27, 52, 0.96), rgba(13, 20, 40, 0.94)),
        #10182f !important;
    border-color: rgba(183, 198, 255, 0.15) !important;
}

@media (max-width: 900px) {
    .why-grid {
        width: min(100%, 620px);
    }

    .why-card,
    .why-card.why-card--wide {
        min-height: 0;
    }
}

@media (max-width: 640px) {
    .section-why {
        padding-top: 50px;
        padding-bottom: 54px;
    }

    .why-grid {
        gap: 12px;
        margin-top: 22px;
    }

    .why-card,
    .why-card.why-card--wide {
        padding: 22px 20px 20px;
        border-radius: 22px;
    }

    .why-card h3,
    .why-card p {
        max-width: none;
    }
}

/* Telegram trial guide on pricing page. */
.trial-guide {
    padding: 0 0 clamp(18px, 3.5vw, 34px);
    background:
        radial-gradient(620px 240px at 18% 0%, rgba(45, 212, 191, 0.10), transparent 68%),
        radial-gradient(680px 260px at 86% 0%, rgba(47, 128, 255, 0.08), transparent 70%),
        linear-gradient(180deg, #eef5ff 0%, #f7fbff 100%);
}

.trial-guide .container {
    max-width: 1080px;
}

.trial-guide + .section-plans {
    padding-top: clamp(1.8rem, 3.2vw, 2.7rem);
}

.trial-guide-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.06fr) minmax(320px, 0.94fr);
    gap: clamp(18px, 3vw, 34px);
    align-items: center;
    overflow: hidden;
    padding: clamp(22px, 3.4vw, 34px);
    border: 1px solid rgba(102, 119, 168, 0.20);
    border-radius: 24px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(249, 252, 255, 0.88)),
        #ffffff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.96),
        0 26px 68px rgba(44, 63, 105, 0.13);
}

.trial-guide-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    background: linear-gradient(90deg, rgba(33, 198, 170, 0.76), rgba(126, 185, 255, 0.54), rgba(33, 198, 170, 0.28));
}

.trial-guide-copy {
    min-width: 0;
}

.trial-guide-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    margin-bottom: 14px;
    padding: 6px 12px;
    border: 1px solid rgba(33, 198, 170, 0.28);
    border-radius: 999px;
    color: #176056;
    background: rgba(235, 255, 251, 0.78);
    font-size: 0.82rem;
    line-height: 1;
    font-weight: 900;
}

.trial-guide h2 {
    margin: 0;
    max-width: 620px;
    color: #17213b;
    font-size: clamp(1.85rem, 3.4vw, 3rem);
    line-height: 1.06;
    letter-spacing: 0;
}

.trial-guide p {
    margin: 14px 0 0;
    max-width: 650px;
    color: #596783;
    font-size: clamp(1rem, 1.6vw, 1.12rem);
    line-height: 1.55;
    font-weight: 650;
}

.trial-guide-note {
    max-width: 620px;
    color: #71809e !important;
    font-size: 0.94rem !important;
    font-weight: 650 !important;
}

.trial-guide-flow {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.trial-guide-steps {
    display: grid;
    gap: 10px;
}

.trial-guide-step {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    min-height: 58px;
    padding: 12px 14px;
    border: 1px solid rgba(102, 119, 168, 0.18);
    border-radius: 18px;
    color: #17213b;
    background: rgba(248, 251, 255, 0.78);
    font-weight: 850;
}

.trial-guide-step strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 12px;
    color: #176056;
    background: rgba(33, 198, 170, 0.12);
    box-shadow: inset 0 0 0 1px rgba(33, 198, 170, 0.22);
}

.trial-guide-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
}

.trial-guide-primary,
.trial-guide-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 14px 18px;
    border-radius: 16px;
    text-align: center;
    font-weight: 900;
    text-decoration: none;
}

.trial-guide-primary {
    color: #ffffff;
    border: 1px solid rgba(33, 198, 170, 0.38);
    background: linear-gradient(135deg, #5ddfbf 0%, #2cae87 100%);
    box-shadow: 0 18px 38px rgba(33, 198, 170, 0.25);
}

.trial-guide-secondary {
    color: #263866;
    border: 1px solid rgba(102, 119, 168, 0.22);
    background: rgba(255, 255, 255, 0.72);
}

.trial-guide-primary:hover,
.trial-guide-secondary:hover {
    transform: translateY(-1px);
}

html[data-theme="dark"] .trial-guide {
    background:
        radial-gradient(620px 240px at 18% 0%, rgba(45, 212, 191, 0.10), transparent 68%),
        radial-gradient(680px 260px at 86% 0%, rgba(110, 168, 255, 0.12), transparent 70%),
        linear-gradient(180deg, #11162a 0%, #0a0d19 100%);
}

html[data-theme="dark"] .trial-guide-card {
    border-color: rgba(183, 198, 255, 0.15);
    background:
        linear-gradient(180deg, rgba(19, 27, 52, 0.96), rgba(13, 20, 40, 0.94)),
        #10182f;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 28px 72px rgba(0, 0, 0, 0.28);
}

html[data-theme="dark"] .trial-guide-kicker {
    color: #9ef5de;
    border-color: rgba(94, 230, 194, 0.30);
    background: rgba(33, 198, 170, 0.10);
}

html[data-theme="dark"] .trial-guide h2,
html[data-theme="dark"] .trial-guide-step {
    color: #f2f6ff;
}

html[data-theme="dark"] .trial-guide p {
    color: #b7c6e6;
}

html[data-theme="dark"] .trial-guide-note {
    color: #9facce !important;
}

html[data-theme="dark"] .trial-guide-step {
    border-color: rgba(183, 198, 255, 0.16);
    background: rgba(255, 255, 255, 0.035);
}

html[data-theme="dark"] .trial-guide-step strong {
    color: #9ef5de;
    background: rgba(33, 198, 170, 0.12);
    box-shadow: inset 0 0 0 1px rgba(94, 230, 194, 0.24);
}

html[data-theme="dark"] .trial-guide-secondary {
    color: #eef4ff;
    border-color: rgba(183, 198, 255, 0.20);
    background: rgba(255, 255, 255, 0.055);
}

@media (max-width: 900px) {
    .trial-guide-card {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .trial-guide {
        padding-bottom: 20px;
    }

    .trial-guide + .section-plans {
        padding-top: 28px;
    }

    .trial-guide-card {
        padding: 20px;
        border-radius: 20px;
    }

    .trial-guide h2 {
        font-size: clamp(1.62rem, 7vw, 2.1rem);
    }

    .trial-guide-step {
        min-height: 54px;
        border-radius: 16px;
    }

    .trial-guide-primary,
    .trial-guide-secondary {
        width: 100%;
        min-height: 50px;
        padding-right: 14px;
        padding-left: 14px;
    }
}

/* iPhone / iOS on-demand access */
.install-btn--ios,
html[data-theme="light"] .install-btn--ios,
html[data-theme="dark"] .install-btn--ios {
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0) 34%),
        #121827;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        0 18px 40px rgba(13, 21, 38, 0.20);
}

.install-btn--ios:hover {
    transform: translateY(-1px);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0) 34%),
        #0d1322;
}

.install-btn--ios .install-btn-icon,
html[data-theme="light"] .install-btn--ios .install-btn-icon,
html[data-theme="dark"] .install-btn--ios .install-btn-icon {
    color: #101827;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.40);
}

.install-btn--ios .logo-ios {
    color: currentColor;
}

.ios-access-block {
    scroll-margin-top: 96px;
}

.ios-access-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.ios-access-head p {
    margin: 6px 0 0;
}

.ios-access-load {
    flex: 0 0 auto;
    min-width: 168px;
}

.ios-access-link {
    display: block;
    margin-top: 14px;
    padding: 14px 16px;
    overflow-wrap: anywhere;
    white-space: normal;
    border: 1px solid rgba(102, 119, 168, 0.20);
    border-radius: 16px;
    color: #0b1225;
    background: rgba(255, 255, 255, 0.74);
    font-size: 0.86rem;
    line-height: 1.45;
}

.ios-access-actions {
    display: grid;
    margin-top: 12px;
}

html[data-theme="dark"] .ios-access-link {
    color: #eef4ff;
    border-color: rgba(183, 198, 255, 0.18);
    background: rgba(255, 255, 255, 0.055);
}

@media (min-width: 760px) {
    .hero-install,
    .premium-actions {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .ios-access-head {
        align-items: stretch;
        flex-direction: column;
    }

    .ios-access-load {
        width: 100%;
    }

    .hero-install .install-btn--ios,
    .premium-actions .install-btn--ios {
        width: 100%;
    }
}

/* Premium product showcase: optimized 3D devices plus CSS app screenshots. */
.product-showcase {
    position: relative;
    overflow: hidden;
    padding: clamp(56px, 8vw, 96px) 0;
    background:
        radial-gradient(720px 380px at 16% 10%, rgba(45, 212, 191, 0.10), transparent 68%),
        radial-gradient(760px 420px at 88% 20%, rgba(66, 89, 185, 0.10), transparent 72%),
        linear-gradient(180deg, #f6faff 0%, #eef4ff 100%);
}

.product-showcase::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.35;
    background-image:
        linear-gradient(90deg, rgba(116, 131, 168, 0.08) 1px, transparent 1px),
        linear-gradient(rgba(116, 131, 168, 0.07) 1px, transparent 1px);
    background-size: 34px 34px;
}

.product-showcase > * {
    position: relative;
    z-index: 1;
}

.product-showcase-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(360px, 1.08fr);
    gap: clamp(28px, 5vw, 72px);
    align-items: center;
}

.product-showcase-copy {
    min-width: 0;
}

.product-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    margin-bottom: 16px;
    padding: 8px 14px;
    border: 1px solid rgba(33, 198, 170, 0.26);
    border-radius: 999px;
    color: #176056;
    background: rgba(240, 255, 252, 0.84);
    box-shadow: 0 14px 34px rgba(35, 75, 120, 0.08);
    font-size: 0.84rem;
    line-height: 1;
    font-weight: 900;
}

.product-showcase h2 {
    max-width: 720px;
    margin: 0;
    color: #17213b;
    font-size: clamp(2.15rem, 4.6vw, 4.65rem);
    line-height: 1.02;
    letter-spacing: 0;
}

.product-showcase .section-subtitle {
    max-width: 640px;
    margin: 20px 0 0;
    color: #596783;
    text-align: left;
    font-size: clamp(1.02rem, 1.6vw, 1.2rem);
    font-weight: 650;
}

.product-proof {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.product-proof span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 8px 13px;
    border: 1px solid rgba(102, 119, 168, 0.18);
    border-radius: 999px;
    color: #15213d;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
    font-size: 0.88rem;
    font-weight: 850;
}

.product-device-studio {
    position: relative;
    min-height: clamp(340px, 46vw, 560px);
    border: 1px solid rgba(102, 119, 168, 0.16);
    border-radius: 34px;
    background:
        radial-gradient(circle at 50% 54%, rgba(45, 212, 191, 0.16), transparent 26%),
        linear-gradient(150deg, rgba(255, 255, 255, 0.88), rgba(242, 247, 255, 0.70));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.92),
        0 30px 90px rgba(44, 63, 105, 0.15);
}

.product-device-studio::after {
    content: "";
    position: absolute;
    left: 14%;
    right: 12%;
    bottom: 10%;
    height: 16%;
    border-radius: 999px;
    background: rgba(16, 24, 43, 0.12);
    filter: blur(18px);
    transform: perspective(620px) rotateX(62deg);
}

.product-3d-shell {
    position: absolute;
    z-index: 2;
    overflow: hidden;
    border-radius: 28px;
    pointer-events: none;
}

.product-3d-shell--phone {
    inset: 5% 39% 8% 4%;
}

.product-3d-shell--thin {
    inset: 10% 3% 5% 43%;
}

.product-3d-viewer {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 260px;
    opacity: 0;
    transform: translateY(14px) scale(0.98);
    transition: opacity 360ms ease, transform 360ms ease;
}

.product-3d-viewer.is-loaded,
.product-3d-viewer.is-failed {
    opacity: 1;
    transform: none;
}

.product-3d-canvas {
    display: block;
    width: 100%;
    height: 100%;
}

.product-3d-fallback {
    position: absolute;
    inset: 10% 20%;
    display: block;
    border: 1px solid rgba(102, 119, 168, 0.20);
    border-radius: 30px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.90), rgba(227, 236, 251, 0.75)),
        #eef4ff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.84),
        0 28px 64px rgba(44, 63, 105, 0.14);
}

.product-3d-viewer.is-loaded .product-3d-fallback {
    display: none;
}

.product-screens {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(18px, 2.6vw, 28px);
    margin-top: clamp(28px, 5vw, 52px);
}

.product-screen-card {
    display: grid;
    grid-template-columns: minmax(220px, 0.82fr) minmax(0, 1fr);
    gap: clamp(18px, 2.6vw, 28px);
    align-items: center;
    min-width: 0;
    padding: clamp(18px, 2.6vw, 26px);
    border: 1px solid rgba(102, 119, 168, 0.16);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.78);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.92),
        0 26px 70px rgba(44, 63, 105, 0.12);
}

.product-screen-card h3 {
    margin: 0;
    color: #17213b;
    font-size: clamp(1.25rem, 2vw, 1.65rem);
    line-height: 1.12;
    letter-spacing: 0;
}

.product-screen-card p {
    margin: 10px 0 0;
    color: #64708d;
    font-size: 0.98rem;
    line-height: 1.5;
    font-weight: 650;
}

.app-shot {
    position: relative;
    overflow: hidden;
    min-width: 0;
    border: 1px solid rgba(102, 119, 168, 0.18);
    background: #f8fbff;
    box-shadow: 0 18px 46px rgba(44, 63, 105, 0.12);
}

.app-shot--android {
    width: min(100%, 260px);
    aspect-ratio: 0.58;
    margin: 0 auto;
    padding: 18px;
    border-radius: 30px;
}

.app-shot--android::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 50% 46%, rgba(45, 212, 191, 0.13), transparent 30%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.70), rgba(239, 245, 255, 0.88));
}

.app-shot-top,
.app-toggle-row,
.app-cat-window,
.app-server-card,
.win-titlebar,
.win-layout {
    position: relative;
    z-index: 1;
}

.app-shot-top {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #111a31;
    font-size: 0.88rem;
    font-weight: 900;
}

.app-shot-top .mini-cat,
.win-titlebar .mini-cat {
    width: 22px;
    height: 22px;
}

.app-shot-dot {
    width: 7px;
    height: 7px;
    margin-left: auto;
    border-radius: 50%;
    background: #0d9f5c;
    box-shadow: 0 0 0 5px rgba(13, 159, 92, 0.12);
}

.app-status-pill {
    display: flex;
    justify-content: center;
    width: max-content;
    min-width: 118px;
    margin: 24px auto 16px;
    padding: 8px 14px;
    border: 1px solid rgba(13, 159, 92, 0.22);
    border-radius: 999px;
    color: #087348;
    background: rgba(225, 255, 241, 0.76);
    font-size: 0.8rem;
    font-weight: 900;
}

.app-toggle-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 62px;
    padding: 12px 14px;
    border: 1px solid rgba(102, 119, 168, 0.14);
    border-radius: 18px;
    color: #17213b;
    background: rgba(255, 255, 255, 0.72);
    font-size: 0.78rem;
    font-weight: 850;
}

.app-toggle-row i {
    position: relative;
    flex: 0 0 42px;
    width: 42px;
    height: 24px;
    border-radius: 999px;
    background: #0d9f5c;
}

.app-toggle-row i::after {
    content: "";
    position: absolute;
    top: 4px;
    right: 4px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #ffffff;
}

.app-cat-window {
    display: grid;
    place-items: center;
    min-height: 156px;
    margin-top: 16px;
    border: 1px solid rgba(102, 119, 168, 0.12);
    border-radius: 24px;
    background:
        radial-gradient(circle at 50% 52%, rgba(45, 212, 191, 0.13), transparent 42%),
        rgba(255, 255, 255, 0.66);
}

.app-cat-window .mini-cat {
    width: 82px;
    height: 82px;
}

.app-server-card {
    margin-top: 16px;
    padding: 14px;
    border: 1px solid rgba(102, 119, 168, 0.14);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.80);
}

.app-server-card small,
.win-main-card small,
.win-stats small {
    display: block;
    color: #64708d;
    font-size: 0.74rem;
    line-height: 1.2;
    font-weight: 750;
}

.app-server-card strong,
.win-main-card strong {
    display: block;
    margin-top: 4px;
    color: #121b32;
    font-size: 1.08rem;
    line-height: 1.15;
    font-weight: 900;
}

.app-shot--windows {
    width: min(100%, 340px);
    aspect-ratio: 1.3;
    margin: 0 auto;
    border-radius: 24px;
    background:
        radial-gradient(260px 170px at 24% 20%, rgba(45, 212, 191, 0.13), transparent 64%),
        linear-gradient(135deg, #f9fbff, #edf4ff);
}

.win-titlebar {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 42px;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(102, 119, 168, 0.13);
    color: #111a31;
    font-size: 0.82rem;
    font-weight: 900;
}

.win-titlebar i {
    width: 8px;
    height: 8px;
    margin-left: auto;
    border-radius: 50%;
    background: rgba(100, 112, 141, 0.42);
}

.win-titlebar i + i {
    margin-left: 0;
}

.win-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    padding: 16px;
}

.win-main-card {
    padding: 18px;
    border: 1px solid rgba(102, 119, 168, 0.14);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.76);
}

.win-main-card button {
    width: 100%;
    min-height: 42px;
    margin-top: 14px;
    border: 0;
    border-radius: 14px;
    color: #ffffff;
    background: linear-gradient(135deg, #0d9f5c, #0a7c4a);
    font-weight: 900;
}

.win-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.win-stats span {
    min-width: 0;
    padding: 10px 8px;
    border: 1px solid rgba(102, 119, 168, 0.12);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.66);
    text-align: center;
}

.win-stats strong {
    display: block;
    color: #17213b;
    font-size: 0.9rem;
    line-height: 1.15;
    font-weight: 900;
}

html[data-theme="dark"] .product-showcase {
    background:
        radial-gradient(760px 380px at 14% 8%, rgba(45, 212, 191, 0.13), transparent 68%),
        radial-gradient(820px 430px at 88% 16%, rgba(108, 122, 255, 0.16), transparent 72%),
        linear-gradient(180deg, #0a0d19 0%, #11162a 100%);
}

html[data-theme="dark"] .product-showcase::before {
    opacity: 0.25;
    background-image:
        linear-gradient(90deg, rgba(216, 226, 255, 0.06) 1px, transparent 1px),
        linear-gradient(rgba(216, 226, 255, 0.05) 1px, transparent 1px);
}

html[data-theme="dark"] .product-kicker,
html[data-theme="dark"] .product-proof span {
    color: #b9fff3;
    border-color: rgba(78, 255, 225, 0.20);
    background: rgba(78, 255, 225, 0.08);
}

html[data-theme="dark"] .product-showcase h2,
html[data-theme="dark"] .product-screen-card h3 {
    color: #f6f8ff;
}

html[data-theme="dark"] .product-showcase .section-subtitle,
html[data-theme="dark"] .product-screen-card p {
    color: #b7c3df;
}

html[data-theme="dark"] .product-device-studio,
html[data-theme="dark"] .product-screen-card {
    border-color: rgba(183, 198, 255, 0.14);
    background:
        linear-gradient(150deg, rgba(23, 31, 58, 0.92), rgba(12, 17, 34, 0.86)),
        #0f162d;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 30px 90px rgba(0, 0, 0, 0.30);
}

html[data-theme="dark"] .app-shot {
    border-color: rgba(183, 198, 255, 0.14);
    background: #111832;
}

html[data-theme="dark"] .app-shot-top,
html[data-theme="dark"] .app-toggle-row,
html[data-theme="dark"] .app-server-card strong,
html[data-theme="dark"] .win-titlebar,
html[data-theme="dark"] .win-main-card strong,
html[data-theme="dark"] .win-stats strong {
    color: #f6f8ff;
}

html[data-theme="dark"] .app-toggle-row,
html[data-theme="dark"] .app-cat-window,
html[data-theme="dark"] .app-server-card,
html[data-theme="dark"] .win-main-card,
html[data-theme="dark"] .win-stats span {
    border-color: rgba(183, 198, 255, 0.12);
    background: rgba(255, 255, 255, 0.055);
}

html[data-theme="dark"] .app-shot--android::before,
html[data-theme="dark"] .app-shot--windows {
    background:
        radial-gradient(circle at 48% 46%, rgba(45, 212, 191, 0.10), transparent 34%),
        linear-gradient(180deg, rgba(16, 23, 44, 0.78), rgba(11, 16, 32, 0.90));
}

@media (max-width: 1040px) {
    .product-showcase-grid,
    .product-screens {
        grid-template-columns: 1fr;
    }

    .product-device-studio {
        min-height: 440px;
    }

    .product-screen-card {
        grid-template-columns: minmax(220px, 0.72fr) minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .product-showcase {
        padding: 46px 0 54px;
    }

    .product-showcase-copy,
    .product-showcase .section-subtitle {
        text-align: center;
    }

    .product-kicker,
    .product-proof {
        justify-content: center;
    }

    .product-device-studio {
        min-height: 360px;
        border-radius: 26px;
    }

    .product-3d-shell--phone {
        inset: 4% 34% 12% 0;
    }

    .product-3d-shell--thin {
        inset: 14% 0 4% 38%;
    }

    .product-screen-card {
        grid-template-columns: 1fr;
        border-radius: 24px;
    }

    .app-shot--android,
    .app-shot--windows {
        max-width: 100%;
    }

    .product-screen-card h3,
    .product-screen-card p {
        text-align: center;
    }
}

/* Product 3D final mobile guardrails */
html,
body {
    overflow-x: hidden;
}

.product-showcase,
.product-screens,
.product-device-studio,
.product-screen-card,
.product-3d-shell,
.app-shot {
    max-width: 100%;
}

@media (max-width: 640px) {
    .header .container.nav {
        max-width: 100%;
        padding-inline: 14px;
    }

    .nav-right,
    .nav-primary {
        width: 100%;
        max-width: 100%;
    }

    .nav-primary {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
    }

    .nav-primary a {
        min-width: 0;
        padding-inline: 6px;
        text-align: center;
        white-space: nowrap;
    }

    .hero,
    .product-showcase {
        overflow: hidden;
    }

    .hero-content,
    .hero-content > *,
    .product-showcase-grid,
    .product-screens,
    .product-showcase-copy,
    .product-showcase-copy > * {
        max-width: calc(100vw - 24px);
    }

    .hero .badge {
        width: fit-content;
        max-width: calc(100vw - 28px);
        white-space: normal;
        line-height: 1.25;
    }

    .hero h1,
    .product-showcase h2 {
        max-width: calc(100vw - 28px);
        overflow-wrap: break-word;
        word-break: normal;
    }

    .hero-subtitle,
    .product-showcase .section-subtitle {
        max-width: calc(100vw - 32px);
        margin-inline: auto;
        overflow-wrap: break-word;
    }

    .hero-proof-row,
    .product-proof {
        width: 100%;
        max-width: calc(100vw - 28px);
        justify-content: center;
    }

    .hero-install {
        width: min(100%, 335px);
        max-width: calc(100vw - 32px);
        grid-template-columns: 1fr;
        justify-items: stretch;
        margin-inline: auto;
    }

    .hero-install .install-btn,
    .hero-install .install-btn--ios,
    .hero-install .install-btn--android,
    .hero-install .install-btn--windows {
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }

    .install-btn .install-btn-label {
        white-space: normal;
    }

    .product-showcase h2 {
        font-size: clamp(2.35rem, 12vw, 3.55rem);
        line-height: 0.98;
    }

    .product-device-studio,
    .product-screen-card,
    .app-shot {
        width: min(100%, 360px);
        margin-inline: auto;
    }

    .product-device-studio {
        min-height: 330px;
    }

    .product-3d-shell--phone {
        inset: 5% 31% 13% 0;
    }

    .product-3d-shell--thin {
        inset: 15% 0 5% 36%;
    }
}

@media (max-width: 640px) {
    .container,
    .hero-content,
    .product-showcase-grid,
    .product-screens {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .nav-right {
        align-items: center;
        min-width: 0 !important;
    }

    .nav-primary {
        width: min(100%, 360px) !important;
        max-width: calc(100vw - 28px) !important;
        margin-inline: auto !important;
    }

    .nav-primary a {
        min-width: 0 !important;
        font-size: 14px !important;
    }

    .hero-content,
    .product-showcase-copy {
        width: min(100%, 356px) !important;
        max-width: calc(100vw - 32px) !important;
        margin-inline: auto !important;
        padding-inline: 0 !important;
    }

    .hero-content > *,
    .product-showcase-copy > * {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .hero .badge,
    .hero-subtitle,
    .product-kicker,
    .product-showcase .section-subtitle {
        width: 100% !important;
        max-width: 100% !important;
    }

    .hero .badge,
    .product-kicker {
        display: inline-flex;
        width: auto !important;
        max-width: 100% !important;
        margin-inline: auto !important;
    }

    .hero h1 {
        width: 100% !important;
        max-width: 100% !important;
        font-size: clamp(2.12rem, 9vw, 2.55rem) !important;
        line-height: 1.02 !important;
        overflow-wrap: anywhere;
    }

    .product-showcase h2 {
        width: 100% !important;
        max-width: 100% !important;
        font-size: clamp(2rem, 8.4vw, 2.48rem) !important;
        line-height: 1.04 !important;
        overflow-wrap: anywhere;
    }

    .hero-subtitle,
    .product-showcase .section-subtitle {
        font-size: 1.02rem !important;
        line-height: 1.48 !important;
    }

    .hero-proof-row,
    .product-proof {
        display: flex !important;
        flex-wrap: wrap !important;
        width: min(100%, 350px) !important;
        max-width: 100% !important;
        margin-inline: auto !important;
    }

    .hero-proof-row span,
    .product-proof span {
        min-width: 0 !important;
        max-width: 100% !important;
        white-space: normal !important;
        text-align: center;
    }

    .hero-install {
        width: min(100%, 330px) !important;
        max-width: 100% !important;
    }

    .product-device-studio,
    .product-screen-card,
    .app-shot {
        width: min(100%, 342px) !important;
        max-width: calc(100vw - 32px) !important;
    }
}

/* Product devices v2: real app screenshots placed on the 3D devices. */
.product-showcase-grid {
    grid-template-columns: minmax(320px, 0.88fr) minmax(440px, 1.12fr);
}

.product-showcase h2 {
    max-width: 640px;
    font-size: clamp(2.3rem, 4.15vw, 4.2rem);
}

.product-device-studio {
    overflow: hidden;
    min-height: clamp(430px, 42vw, 580px);
}

.product-3d-shell {
    overflow: visible;
}

.product-3d-shell--phone {
    inset: 7% 59% 9% 7%;
    z-index: 4;
}

.product-3d-shell--thin {
    inset: 9% 4% 8% 32%;
    z-index: 3;
}

.product-3d-screen {
    position: absolute;
    z-index: 5;
    display: block;
    object-fit: cover;
    opacity: 0;
    pointer-events: none;
    transform-origin: center;
    transition: opacity 240ms ease;
    filter: saturate(1.02) contrast(1.02);
}

.product-3d-viewer.is-screen-ready .product-3d-screen {
    opacity: 1;
}

.product-3d-screen--phone {
    left: 30.2%;
    top: 10.6%;
    width: 39.8%;
    height: 78.2%;
    border-radius: 18px;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.18),
        0 10px 28px rgba(9, 15, 32, 0.20);
}

.product-3d-screen--laptop {
    left: 18.4%;
    top: 24.8%;
    width: 65.6%;
    height: 40.8%;
    border-radius: 6px;
    transform: perspective(680px) rotateX(1deg);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.16),
        0 10px 24px rgba(9, 15, 32, 0.16);
}

html[data-theme="dark"] .product-3d-screen--phone,
html[data-theme="dark"] .product-3d-screen--laptop {
    filter: saturate(1.04) contrast(1.06) brightness(0.96);
}

@media (max-width: 1040px) {
    .product-showcase-grid {
        grid-template-columns: 1fr;
    }

    .product-device-studio {
        width: min(100%, 720px);
        margin-inline: auto;
    }

    .product-showcase-copy {
        text-align: center;
    }

    .product-showcase h2,
    .product-showcase .section-subtitle {
        margin-inline: auto;
        text-align: center;
    }
}

@media (max-width: 640px) {
    .product-device-studio {
        width: min(100%, 356px) !important;
        min-height: 430px;
        border-radius: 28px;
    }

    .product-3d-shell--phone {
        inset: 4% 45% 34% 5%;
    }

    .product-3d-shell--thin {
        inset: 37% 3% 3% 9%;
    }

    .product-3d-screen--phone {
        left: 30.4%;
        top: 10.4%;
        width: 39.2%;
        height: 78.6%;
        border-radius: 14px;
    }

    .product-3d-screen--laptop {
        left: 18.8%;
        top: 25%;
        width: 64.8%;
        height: 40.6%;
        border-radius: 5px;
    }
}

/* Safe production fallback: hide the rejected 3D product collage until a reviewed layout replaces it. */
.product-showcase {
    display: none !important;
}

/* Local preview: static premium device showcase, replacing the rejected 3D collage. */
.product-showcase.product-showcase--static {
    display: block !important;
    padding: clamp(62px, 8vw, 112px) 0 clamp(66px, 8vw, 116px);
}

.product-showcase--static .product-showcase-grid {
    display: grid;
    grid-template-columns: minmax(330px, 0.86fr) minmax(440px, 1.14fr);
    gap: clamp(42px, 7vw, 92px);
    align-items: center;
}

.product-showcase--static .product-showcase-copy {
    align-self: center;
}

.product-showcase--static .product-showcase h2,
.product-showcase--static h2 {
    max-width: 620px;
    font-size: clamp(2.5rem, 4.4vw, 4.4rem);
    line-height: 1.02;
}

.product-showcase--static .section-subtitle {
    max-width: 560px;
}

.product-device-studio--static {
    display: grid;
    place-items: center;
    min-height: clamp(430px, 41vw, 560px);
    padding: clamp(22px, 3vw, 36px);
    border-radius: 36px;
    background:
        radial-gradient(circle at 50% 30%, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.20) 38%, transparent 64%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(237, 245, 255, 0.70));
}

.product-device-studio--static::after {
    left: 12%;
    right: 10%;
    bottom: 11%;
    height: 12%;
    opacity: 0.75;
}

.product-device-art {
    position: relative;
    width: min(100%, 640px);
    aspect-ratio: 1.32;
    isolation: isolate;
}

.product-device-window,
.product-device-phone {
    position: absolute;
    overflow: hidden;
    border: 1px solid rgba(89, 106, 150, 0.18);
    background: #ffffff;
    box-shadow:
        0 34px 90px rgba(34, 48, 84, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.product-device-window--desktop {
    z-index: 1;
    right: 0;
    top: 15%;
    width: 78%;
    height: 63%;
    border-radius: 24px;
    transform: perspective(1200px) rotateY(-5deg) rotateX(1deg);
}

.product-device-window-bar {
    display: flex;
    align-items: center;
    gap: 9px;
    height: 42px;
    padding: 0 16px;
    border-bottom: 1px solid rgba(89, 106, 150, 0.12);
    color: #12203a;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 247, 255, 0.90));
    font-size: 0.82rem;
    font-weight: 900;
}

.product-device-window-bar .mini-cat {
    width: 20px;
    height: 20px;
}

.product-device-window-bar i {
    width: 8px;
    height: 8px;
    margin-left: auto;
    border-radius: 50%;
    background: #b9c3d6;
}

.product-device-window-bar i + i {
    margin-left: 4px;
}

.product-device-window img {
    display: block;
    width: 100%;
    height: calc(100% - 42px);
    object-fit: cover;
    object-position: center top;
}

.product-device-phone {
    z-index: 2;
    left: 0;
    top: 4%;
    width: 30%;
    height: 86%;
    border: 8px solid #111827;
    border-radius: 32px;
    transform: perspective(1000px) rotateY(9deg) rotateX(-1deg);
    background: #f7fbff;
}

.product-device-phone-speaker {
    position: absolute;
    z-index: 3;
    left: 50%;
    top: 8px;
    width: 42%;
    height: 10px;
    border-radius: 999px;
    background: rgba(17, 24, 39, 0.88);
    transform: translateX(-50%);
}

.product-device-phone img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}

html[data-theme="dark"] .product-device-studio--static {
    border-color: rgba(183, 198, 255, 0.16);
    background:
        radial-gradient(circle at 50% 30%, rgba(49, 62, 102, 0.76), rgba(21, 30, 58, 0.34) 44%, transparent 68%),
        linear-gradient(145deg, rgba(18, 27, 52, 0.92), rgba(10, 14, 30, 0.80));
}

html[data-theme="dark"] .product-device-window,
html[data-theme="dark"] .product-device-phone {
    border-color: rgba(183, 198, 255, 0.18);
    box-shadow:
        0 34px 90px rgba(0, 0, 0, 0.36),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .product-device-window-bar {
    color: #f7f9ff;
    border-color: rgba(183, 198, 255, 0.12);
    background: linear-gradient(180deg, rgba(22, 31, 59, 0.98), rgba(14, 20, 41, 0.94));
}

@media (max-width: 1040px) {
    .product-showcase--static .product-showcase-grid {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .product-showcase--static .product-showcase-copy,
    .product-showcase--static h2,
    .product-showcase--static .section-subtitle {
        text-align: center;
        margin-inline: auto;
    }

    .product-showcase--static .product-proof {
        justify-content: center;
    }

    .product-device-studio--static {
        width: min(100%, 720px);
        margin-inline: auto;
    }
}

@media (max-width: 640px) {
    .product-showcase.product-showcase--static {
        padding: 52px 0 62px;
    }

    .product-showcase--static .product-showcase-copy {
        width: min(100%, 340px) !important;
    }

    .product-showcase--static h2 {
        font-size: clamp(2.05rem, 8.8vw, 2.55rem) !important;
        line-height: 1.06 !important;
    }

    .product-device-studio--static {
        width: min(100%, 352px) !important;
        min-height: 380px;
        padding: 16px;
        border-radius: 28px;
    }

    .product-device-art {
        width: 100%;
        aspect-ratio: 0.86;
    }

    .product-device-window--desktop {
        right: 0;
        top: 35%;
        width: 82%;
        height: 48%;
        border-radius: 18px;
        transform: none;
    }

    .product-device-window-bar {
        height: 32px;
        padding: 0 11px;
        font-size: 0.68rem;
    }

    .product-device-window img {
        height: calc(100% - 32px);
    }

    .product-device-phone {
        left: 7%;
        top: 3%;
        width: 36%;
        height: 70%;
        border-width: 6px;
        border-radius: 24px;
        transform: none;
    }

    .product-device-phone-speaker {
        top: 7px;
        height: 8px;
    }
}

/* Local preview mobile polish: keep the main hero readable before the product block. */
@media (max-width: 640px) {
    .hero-content {
        width: min(100%, 342px) !important;
        max-width: calc(100vw - 32px) !important;
    }

    .hero h1 {
        max-width: 100% !important;
        font-size: clamp(2rem, 8.2vw, 2.38rem) !important;
        line-height: 1.08 !important;
        text-wrap: balance;
    }

    .hero-subtitle {
        max-width: 100% !important;
        font-size: 1rem !important;
        line-height: 1.48 !important;
    }
}

/* Local preview v2: 3D laptop + 3D guardian cat, with app screenshots kept as controlled UI layers. */
.product-device-studio--hybrid {
    display: grid;
    place-items: center;
    overflow: hidden;
    min-height: clamp(450px, 43vw, 590px);
    padding: clamp(18px, 3vw, 34px);
    border-radius: 36px;
    background:
        radial-gradient(circle at 30% 28%, rgba(45, 212, 191, 0.14), transparent 34%),
        radial-gradient(circle at 74% 22%, rgba(105, 92, 255, 0.10), transparent 36%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.92), rgba(239, 246, 255, 0.74));
}

.product-device-studio--hybrid::after {
    left: 11%;
    right: 9%;
    bottom: 10%;
    height: 12%;
    opacity: 0.72;
}

.product-device-art--hybrid {
    position: relative;
    width: min(100%, 660px);
    aspect-ratio: 1.34;
    isolation: isolate;
}

.product-device-art--hybrid .product-3d-shell {
    position: absolute;
    overflow: visible;
    pointer-events: none;
}

.product-3d-shell--laptop-main {
    z-index: 2;
    inset: 5% 0 3% 18%;
}

.product-3d-shell--guardian-cat {
    z-index: 4;
    inset: 30% 60% 2% 0;
    filter: drop-shadow(0 28px 36px rgba(15, 23, 42, 0.18));
}

.product-device-phone--hybrid {
    z-index: 5;
    left: 7%;
    top: 9%;
    width: 22%;
    height: 72%;
    border-width: 7px;
    border-radius: 28px;
    transform: perspective(1000px) rotateY(8deg) rotateX(-1deg);
    box-shadow:
        0 24px 58px rgba(15, 23, 42, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

.product-3d-shell--laptop-main .product-3d-screen--laptop {
    left: 18.8%;
    top: 24.6%;
    width: 64.5%;
    height: 40.2%;
    border-radius: 5px;
}

.product-3d-shell--guardian-cat .product-3d-fallback {
    inset: 16% 18%;
    border-radius: 50%;
    background:
        radial-gradient(circle at 50% 42%, rgba(45, 212, 191, 0.16), transparent 36%),
        rgba(255, 255, 255, 0.72);
}

html[data-theme="dark"] .product-device-studio--hybrid {
    border-color: rgba(183, 198, 255, 0.16);
    background:
        radial-gradient(circle at 28% 28%, rgba(45, 212, 191, 0.12), transparent 36%),
        radial-gradient(circle at 74% 22%, rgba(105, 92, 255, 0.13), transparent 38%),
        linear-gradient(145deg, rgba(18, 27, 52, 0.94), rgba(10, 14, 30, 0.84));
}

@media (max-width: 1040px) {
    .product-device-studio--hybrid {
        width: min(100%, 720px);
        margin-inline: auto;
    }
}

@media (max-width: 640px) {
    .product-device-studio--hybrid {
        width: min(100%, 352px) !important;
        min-height: 420px;
        padding: 14px;
        border-radius: 28px;
    }

    .product-device-art--hybrid {
        width: 100%;
        aspect-ratio: 0.86;
    }

    .product-3d-shell--laptop-main {
        inset: 34% 0 2% 8%;
    }

    .product-3d-shell--guardian-cat {
        inset: 55% 57% 0 1%;
    }

    .product-device-phone--hybrid {
        left: 7%;
        top: 4%;
        width: 34%;
        height: 66%;
        border-width: 6px;
        border-radius: 24px;
        transform: none;
    }

    .product-3d-shell--laptop-main .product-3d-screen--laptop {
        left: 18.8%;
        top: 24.8%;
        width: 64.6%;
        height: 40.4%;
    }
}

/* Approved product render: premium framed media, switched by theme. */
.product-showcase {
    display: block !important;
}

.product-showcase.product-showcase--static {
    scroll-margin-top: clamp(94px, 9vw, 128px);
    padding: clamp(52px, 5.4vw, 78px) 0 clamp(60px, 6vw, 92px);
}

.product-showcase--static .product-showcase-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(20px, 2.6vw, 30px);
    align-items: center;
    justify-items: center;
}

.product-showcase--static .product-showcase-copy {
    max-width: 1040px;
    min-width: 0;
    text-align: center;
    margin-inline: auto;
}

.product-showcase--static h2,
.product-showcase--static .section-subtitle {
    text-align: center;
    margin-inline: auto;
}

.product-showcase--static h2 {
    max-width: 1040px;
    font-size: clamp(3.1rem, 4.5vw, 5.05rem);
    line-height: 1;
    text-wrap: balance;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
}

.product-showcase--static .section-subtitle {
    max-width: 760px;
}

.product-showcase--static .product-proof {
    justify-content: center;
}

.product-showcase--static .product-device-studio--hybrid.product-render-frame {
    position: relative;
    justify-self: center;
    align-self: center;
    width: min(100%, 680px);
    min-height: 0;
    aspect-ratio: 3 / 2;
    margin: 0;
    padding: 0;
    overflow: visible;
    isolation: isolate;
    transform: none;
    border: 0;
    border-radius: clamp(24px, 2.8vw, 36px);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: transparent;
    box-shadow: none;
}

.product-showcase--static .product-device-studio--hybrid.product-render-frame::before {
    content: "";
    position: absolute;
    inset: clamp(-22px, -2.4vw, -14px) clamp(-30px, -3vw, -18px) clamp(-32px, -3.4vw, -20px);
    z-index: 0;
    pointer-events: none;
    opacity: 1;
    border: 1px solid rgba(255, 255, 255, 0.62);
    border-radius: clamp(30px, 3.2vw, 44px);
    backdrop-filter: blur(24px) saturate(1.22);
    -webkit-backdrop-filter: blur(24px) saturate(1.22);
    background:
        radial-gradient(circle at 18% 9%, rgba(255, 255, 255, 0.54), transparent 32%),
        radial-gradient(circle at 86% 18%, rgba(116, 239, 214, 0.16), transparent 34%),
        linear-gradient(146deg, rgba(255, 255, 255, 0.32), rgba(255, 255, 255, 0.11) 45%, rgba(219, 232, 255, 0.08)),
        rgba(255, 255, 255, 0.06);
    box-shadow:
        0 48px 76px -50px rgba(29, 42, 78, 0.46),
        0 20px 34px -30px rgba(46, 64, 105, 0.26),
        inset 0 1px 0 rgba(255, 255, 255, 0.72),
        inset 1px 0 0 rgba(255, 255, 255, 0.30),
        inset -1px 0 0 rgba(92, 116, 168, 0.12),
        inset 0 -1px 0 rgba(68, 86, 130, 0.16);
    transform: translateY(5px);
}

.product-showcase--static .product-device-studio--hybrid.product-render-frame::after {
    content: "";
    position: absolute;
    inset: clamp(-18px, -2vw, -12px) clamp(-25px, -2.5vw, -15px) clamp(-28px, -3vw, -18px);
    z-index: 2;
    display: block !important;
    pointer-events: none;
    border-radius: clamp(28px, 3vw, 42px);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.44), transparent 15%),
        linear-gradient(0deg, rgba(61, 79, 124, 0.14), transparent 12%),
        linear-gradient(132deg, rgba(255, 255, 255, 0.24), transparent 18%, transparent 80%, rgba(255, 255, 255, 0.12));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.40),
        inset 0 12px 24px -22px rgba(255, 255, 255, 0.84),
        inset 0 -12px 22px -20px rgba(45, 60, 96, 0.28);
}

.product-render {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    border: 1px solid rgba(255, 255, 255, 0.46);
    border-radius: clamp(18px, 2.2vw, 30px);
    background:
        radial-gradient(circle at 50% 16%, rgba(255, 255, 255, 0.80), transparent 48%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.86), rgba(235, 244, 255, 0.68));
    box-shadow:
        0 28px 52px -38px rgba(25, 39, 75, 0.38),
        0 1px 0 rgba(255, 255, 255, 0.72),
        inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.product-render--dark {
    display: none;
}

html[data-theme="dark"] .product-showcase--static .product-device-studio--hybrid.product-render-frame {
    background: transparent;
    box-shadow: none;
}

html[data-theme="dark"] .product-render {
    background:
        radial-gradient(circle at 50% 16%, rgba(73, 90, 148, 0.30), transparent 48%),
        linear-gradient(145deg, rgba(22, 31, 59, 0.92), rgba(8, 10, 28, 0.76));
}

html[data-theme="dark"] .product-showcase--static .product-device-studio--hybrid.product-render-frame::before {
    border-color: rgba(184, 204, 255, 0.22);
    background:
        radial-gradient(circle at 18% 9%, rgba(255, 255, 255, 0.12), transparent 32%),
        radial-gradient(circle at 86% 18%, rgba(116, 239, 214, 0.12), transparent 34%),
        linear-gradient(146deg, rgba(67, 82, 124, 0.30), rgba(13, 17, 43, 0.16) 50%, rgba(55, 50, 105, 0.12)),
        rgba(11, 15, 37, 0.12);
    box-shadow:
        0 48px 78px -44px rgba(0, 0, 0, 0.68),
        0 0 58px -28px rgba(82, 232, 202, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.15),
        inset 1px 0 0 rgba(255, 255, 255, 0.06),
        inset 0 -1px 0 rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .product-showcase--static .product-device-studio--hybrid.product-render-frame::after {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.10), transparent 16%),
        linear-gradient(0deg, rgba(0, 0, 0, 0.16), transparent 12%),
        linear-gradient(132deg, rgba(255, 255, 255, 0.08), transparent 22%, transparent 76%, rgba(116, 239, 214, 0.08));
    box-shadow:
        inset 0 0 0 1px rgba(156, 178, 255, 0.14),
        inset 0 12px 24px -22px rgba(255, 255, 255, 0.18),
        inset 0 -12px 22px -20px rgba(0, 0, 0, 0.48);
}

html[data-theme="dark"] .product-render--light {
    display: none;
}

html[data-theme="dark"] .product-render--dark {
    display: block;
}

.product-showcase--static .product-screens {
    display: none !important;
}

@media (max-width: 1240px) {
    .product-showcase.product-showcase--static {
        padding: clamp(38px, 5vw, 58px) 0 clamp(54px, 6vw, 84px);
    }

    .product-showcase--static .product-showcase-grid {
        gap: clamp(22px, 4vw, 34px);
    }

    .product-showcase--static .product-showcase-copy {
        max-width: min(100%, 920px);
    }

    .product-showcase--static h2 {
        max-width: 920px;
        font-size: clamp(2.9rem, 6vw, 4.55rem);
    }

    .product-showcase--static .section-subtitle {
        max-width: 720px;
    }

    .product-showcase--static .product-proof {
        justify-content: center;
    }

    .product-showcase--static .product-device-studio--hybrid.product-render-frame {
        width: min(100%, 680px);
        transform: none;
    }
}

@media (max-width: 720px) {
    .product-showcase.product-showcase--static {
        scroll-margin-top: 118px;
        padding: 44px 0 54px;
    }

    .product-showcase--static .product-showcase-grid {
        gap: 26px;
    }

    .product-showcase--static h2 {
        max-width: 360px;
        font-size: clamp(2.55rem, 12vw, 4.1rem);
        line-height: 1.02;
    }

    .product-showcase--static .section-subtitle {
        max-width: 340px;
    }

    .product-showcase--static .product-device-studio--hybrid.product-render-frame {
        width: min(100%, 352px);
        aspect-ratio: 3 / 2;
        padding: 0;
        border-radius: 28px;
        box-shadow: none;
    }

    .product-showcase--static .product-device-studio--hybrid.product-render-frame::before {
        inset: -10px -12px -14px;
        border-radius: 30px;
        transform: none;
    }

    .product-render,
    .product-showcase--static .product-device-studio--hybrid.product-render-frame::after {
        border-radius: 22px;
    }
}

/* Hero install buttons: unified NetCat brand palette. */
.hero-install {
    gap: 14px 18px;
}

.hero-install .install-btn {
    position: relative;
    overflow: hidden;
    min-height: 62px;
    border: 1px solid rgba(141, 244, 221, 0.18) !important;
    border-radius: 16px !important;
    padding: 0 24px !important;
    font-weight: 950;
    letter-spacing: 0;
    box-shadow:
        0 20px 42px -26px rgba(9, 15, 31, 0.58),
        inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

.hero-install .install-btn::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 48%;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0));
}

.hero-install .install-btn-icon,
html[data-theme="light"] .hero-install .install-btn-icon,
html[data-theme="dark"] .hero-install .install-btn-icon {
    position: relative;
    z-index: 1;
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    border-radius: 11px !important;
}

.hero-install .install-btn-label {
    position: relative;
    z-index: 1;
}

.hero-install .install-btn--ios,
html[data-theme="light"] .hero-install .install-btn--ios,
html[data-theme="dark"] .hero-install .install-btn--ios {
    order: 1;
    color: #f7fffc !important;
    border-color: rgba(141, 244, 221, 0.24) !important;
    background:
        radial-gradient(circle at 18% 18%, rgba(141, 244, 221, 0.16), transparent 36%),
        linear-gradient(135deg, #182238 0%, var(--nc-premium-navy) 56%, #080d1a 100%) !important;
}

.hero-install .install-btn--android,
html[data-theme="light"] .hero-install .install-btn--android,
html[data-theme="dark"] .hero-install .install-btn--android {
    order: 2;
    border-color: rgba(160, 255, 232, 0.56) !important;
    background:
        radial-gradient(circle at 20% 12%, rgba(255, 255, 255, 0.24), transparent 34%),
        linear-gradient(135deg, #5ee6c3 0%, var(--nc-premium-green) 48%, var(--nc-premium-green-2) 100%) !important;
    box-shadow:
        0 24px 48px -24px rgba(22, 199, 161, 0.58),
        inset 0 1px 0 rgba(255, 255, 255, 0.38) !important;
}

.hero-install .install-btn--windows,
html[data-theme="light"] .hero-install .install-btn--windows,
html[data-theme="dark"] .hero-install .install-btn--windows {
    order: 3;
    color: #f7fffc !important;
    border-color: rgba(118, 87, 255, 0.34) !important;
    background:
        radial-gradient(circle at 18% 18%, rgba(118, 87, 255, 0.22), transparent 38%),
        linear-gradient(135deg, #1a2440 0%, #111827 54%, #080d1a 100%) !important;
}

.hero-install .install-btn--ios .install-btn-icon,
html[data-theme="light"] .hero-install .install-btn--ios .install-btn-icon,
html[data-theme="dark"] .hero-install .install-btn--ios .install-btn-icon {
    color: var(--nc-premium-navy) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(222, 255, 247, 0.90)) !important;
    border: 1px solid rgba(141, 244, 221, 0.30) !important;
    box-shadow:
        0 8px 18px -10px rgba(141, 244, 221, 0.56),
        inset 0 1px 0 rgba(255, 255, 255, 0.74) !important;
}

.hero-install .install-btn--android .install-btn-icon,
html[data-theme="light"] .hero-install .install-btn--android .install-btn-icon,
html[data-theme="dark"] .hero-install .install-btn--android .install-btn-icon {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.18) !important;
    border: 1px solid rgba(255, 255, 255, 0.24) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.34) !important;
}

.hero-install .install-btn--windows .install-btn-icon,
html[data-theme="light"] .hero-install .install-btn--windows .install-btn-icon,
html[data-theme="dark"] .hero-install .install-btn--windows .install-btn-icon {
    color: #ffffff !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.04)),
        linear-gradient(135deg, var(--nc-premium-violet) 0%, var(--nc-premium-blue) 100%) !important;
    border: 1px solid rgba(210, 221, 255, 0.30) !important;
    box-shadow:
        0 10px 18px -10px rgba(118, 87, 255, 0.58),
        inset 0 1px 0 rgba(255, 255, 255, 0.36) !important;
}

.hero-install .install-btn:hover {
    filter: brightness(1.04);
}

@media (max-width: 640px) {
    .hero-install .install-btn--android {
        order: 1 !important;
    }

    .hero-install .install-btn--windows {
        order: 2 !important;
    }

    .hero-install .install-btn--ios {
        order: 3 !important;
    }
}

/* Premium download trust banner */
.download-trust-banner {
    position: relative;
    z-index: 2;
    width: min(1120px, calc(100% - 32px));
    margin: 22px auto 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    overflow: hidden;
    text-align: left;
    border: 1px solid rgba(255, 255, 255, 0.76);
    border-radius: 22px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.90), rgba(255, 255, 255, 0.62)),
        radial-gradient(circle at 12% 0%, rgba(112, 232, 196, 0.20), transparent 34%),
        radial-gradient(circle at 92% 100%, rgba(118, 87, 255, 0.16), transparent 38%);
    box-shadow:
        0 24px 70px -36px rgba(26, 22, 66, 0.44),
        0 12px 30px -26px rgba(39, 196, 144, 0.54),
        inset 0 1px 0 rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(24px) saturate(165%);
    -webkit-backdrop-filter: blur(24px) saturate(165%);
}

.download-trust-banner::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 48%;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.40), rgba(255, 255, 255, 0));
}

.download-trust-banner::after {
    content: "";
    position: absolute;
    inset: auto 18px 0;
    height: 1px;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(112, 232, 196, 0.62), rgba(118, 87, 255, 0.42), transparent);
}

.hero .download-trust-banner {
    order: 5;
    width: 100%;
    max-width: 920px;
    margin: 18px auto 16px;
}

.download-page .download-trust-banner {
    margin-top: 22px;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    width: 100%;
    max-width: 640px;
    box-sizing: border-box;
}

.download-page .download-trust-copy {
    min-width: 0;
    max-width: 100%;
}

.download-page .download-trust-copy strong,
.download-page .download-trust-copy p {
    max-width: none;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
}

.download-page .download-trust-copy strong {
    font-size: clamp(0.98rem, 1.25vw, 1.12rem);
    line-height: 1.14;
}

.download-page .download-trust-copy p {
    font-size: 0.94rem;
    line-height: 1.42;
}

.download-page .download-trust-actions {
    grid-column: 2;
    justify-content: flex-start;
    flex-wrap: wrap;
    white-space: normal;
}

.download-trust-mark,
.download-trust-copy,
.download-trust-actions {
    position: relative;
    z-index: 1;
}

.download-trust-mark {
    width: 48px;
    height: 48px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 16px;
    color: #189b66;
    background:
        linear-gradient(135deg, rgba(236, 255, 248, 0.96), rgba(238, 231, 255, 0.82)),
        radial-gradient(circle at 30% 16%, rgba(255, 255, 255, 0.90), transparent 48%);
    border: 1px solid rgba(129, 232, 204, 0.46);
    box-shadow:
        0 18px 28px -20px rgba(25, 156, 106, 0.60),
        inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

.download-trust-mark svg {
    width: 24px;
    height: 24px;
}

.download-trust-copy {
    min-width: 0;
}

.download-trust-copy strong {
    display: block;
    color: #17133a;
    font-size: clamp(0.98rem, 1.25vw, 1.12rem);
    line-height: 1.14;
    font-weight: 900;
    letter-spacing: 0;
}

.download-trust-copy p {
    margin: 5px 0 0;
    max-width: 760px;
    color: rgba(31, 30, 70, 0.70);
    font-size: 0.94rem;
    line-height: 1.42;
    font-weight: 650;
}

.download-trust-copy .download-build-meta {
    color: rgba(31, 30, 70, 0.58);
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.45;
    word-break: break-word;
}

.download-hash-list {
    display: grid;
    gap: 8px;
    margin-top: 10px;
}

.download-hash-row {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.download-hash-row span {
    color: rgba(31, 30, 70, 0.68);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.download-hash-row input {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    border: 1px solid rgba(31, 30, 70, 0.10);
    border-radius: 8px;
    padding: 8px 10px;
    color: #17133a;
    background: rgba(255, 255, 255, 0.72);
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: 0;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.76);
}

.download-hash-row input:focus {
    outline: 3px solid rgba(31, 122, 235, 0.20);
    border-color: rgba(31, 122, 235, 0.36);
}

.download-trust-copy .download-integrity-note {
    color: rgba(25, 24, 58, 0.72);
    font-size: 0.82rem;
    font-weight: 720;
    line-height: 1.42;
    overflow-wrap: anywhere;
}

.download-trust-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
    white-space: nowrap;
}

.download-trust-chip,
.download-trust-link {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 0 13px;
    font-size: 0.86rem;
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0;
}

.download-trust-chip {
    color: #20634c;
    background: rgba(235, 255, 248, 0.76);
    border: 1px solid rgba(109, 219, 187, 0.44);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.download-trust-link {
    color: #f8fffd;
    text-decoration: none;
    background:
        radial-gradient(circle at 16% 18%, rgba(255, 255, 255, 0.22), transparent 40%),
        linear-gradient(135deg, #261653 0%, #33205f 44%, #47b47d 100%);
    border: 1px solid rgba(255, 255, 255, 0.30);
    box-shadow:
        0 16px 28px -18px rgba(37, 23, 88, 0.72),
        inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

.download-trust-link:hover {
    transform: translateY(-1px);
    filter: brightness(1.04);
}

html[data-theme="dark"] .download-trust-banner {
    border-color: rgba(171, 244, 221, 0.18);
    background:
        linear-gradient(135deg, rgba(19, 24, 41, 0.86), rgba(22, 20, 46, 0.70)),
        radial-gradient(circle at 10% 0%, rgba(112, 232, 196, 0.14), transparent 36%),
        radial-gradient(circle at 94% 100%, rgba(118, 87, 255, 0.18), transparent 40%);
    box-shadow:
        0 26px 80px -38px rgba(0, 0, 0, 0.70),
        0 12px 34px -28px rgba(100, 255, 213, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .download-trust-banner::before {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0));
}

html[data-theme="dark"] .download-trust-mark {
    color: #7af0c4;
    background:
        linear-gradient(135deg, rgba(38, 52, 65, 0.96), rgba(45, 31, 76, 0.84)),
        radial-gradient(circle at 30% 12%, rgba(255, 255, 255, 0.16), transparent 48%);
    border-color: rgba(128, 236, 204, 0.24);
    box-shadow:
        0 18px 30px -22px rgba(54, 228, 174, 0.46),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .download-trust-copy strong {
    color: rgba(248, 250, 255, 0.96);
}

html[data-theme="dark"] .download-trust-copy p {
    color: rgba(218, 224, 246, 0.72);
}

html[data-theme="dark"] .download-trust-copy .download-build-meta {
    color: rgba(218, 224, 246, 0.60);
}

html[data-theme="dark"] .download-hash-row span {
    color: rgba(218, 224, 246, 0.70);
}

html[data-theme="dark"] .download-hash-row input {
    color: rgba(248, 250, 255, 0.96);
    border-color: rgba(255, 255, 255, 0.12);
    background: rgba(12, 16, 28, 0.66);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .download-trust-chip {
    color: #b9f7df;
    background: rgba(29, 66, 55, 0.52);
    border-color: rgba(118, 232, 194, 0.24);
}

.telegram-login-panel {
    margin: 12px 0 14px;
    display: grid;
    gap: 8px;
}

.account-telegram-login {
    width: 100%;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid rgba(82, 162, 255, 0.28);
    border-radius: 16px;
    color: #f8fbff;
    background: linear-gradient(135deg, #1b88d1, #2aa8ea 54%, #38c4f0);
    box-shadow: 0 18px 38px -24px rgba(30, 136, 210, 0.70), inset 0 1px 0 rgba(255, 255, 255, 0.22);
    cursor: pointer;
}

.account-telegram-login span {
    width: 26px;
    height: 26px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18);
    font-size: 0.9rem;
    line-height: 1;
}

.account-telegram-login strong {
    font-size: 0.98rem;
    line-height: 1;
    letter-spacing: 0;
}

.account-telegram-login:disabled {
    cursor: wait;
    opacity: 0.72;
}

.telegram-login-panel small {
    color: rgba(31, 30, 70, 0.62);
    font-size: 0.82rem;
    line-height: 1.35;
    font-weight: 650;
}

html[data-theme="dark"] .telegram-login-panel small {
    color: rgba(220, 226, 248, 0.68);
}

html[dir="rtl"] .download-trust-banner {
    text-align: right;
}

.download-trust-toast {
    --download-trust-toast-top: 88px;
    position: fixed;
    top: var(--download-trust-toast-top);
    left: 50%;
    z-index: 120;
    width: min(940px, calc(100vw - 28px));
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 14px;
    padding: 13px 14px;
    color: #17133a;
    border: 1px solid rgba(255, 255, 255, 0.78);
    border-radius: 20px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.64)),
        radial-gradient(circle at 12% 0%, rgba(112, 232, 196, 0.22), transparent 36%),
        radial-gradient(circle at 96% 100%, rgba(118, 87, 255, 0.18), transparent 42%);
    box-shadow:
        0 26px 76px -34px rgba(26, 22, 66, 0.50),
        0 10px 26px -22px rgba(39, 196, 144, 0.52),
        inset 0 1px 0 rgba(255, 255, 255, 0.90);
    backdrop-filter: blur(24px) saturate(170%);
    -webkit-backdrop-filter: blur(24px) saturate(170%);
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -14px) scale(0.985);
    transition:
        opacity 0.28s ease,
        transform 0.34s cubic-bezier(0.2, 0.8, 0.2, 1);
}

body > .download-trust-toast {
    position: fixed !important;
    z-index: 120 !important;
}

.download-trust-toast.is-visible {
    opacity: 1;
    pointer-events: auto;
    transform: translate(-50%, 0) scale(1);
}

.download-trust-toast.is-leaving {
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -10px) scale(0.985);
}

.download-trust-toast-mark {
    width: 42px;
    height: 42px;
    display: inline-grid;
    place-items: center;
    border-radius: 14px;
    color: #179b66;
    background: linear-gradient(135deg, rgba(236, 255, 248, 0.96), rgba(238, 231, 255, 0.82));
    border: 1px solid rgba(129, 232, 204, 0.46);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84);
}

.download-trust-toast-mark svg {
    width: 22px;
    height: 22px;
}

.download-trust-toast-copy {
    min-width: 0;
}

.download-trust-toast-copy strong {
    display: block;
    color: #17133a;
    font-size: 0.98rem;
    line-height: 1.15;
    font-weight: 950;
    letter-spacing: 0;
}

.download-trust-toast-copy p {
    margin: 4px 0 0;
    max-width: 640px;
    color: rgba(31, 30, 70, 0.72);
    font-size: 0.86rem;
    line-height: 1.34;
    font-weight: 650;
}

.download-trust-toast-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.download-trust-toast-chip,
.download-trust-toast-link {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 0 12px;
    font-size: 0.82rem;
    line-height: 1;
    font-weight: 900;
}

.download-trust-toast-chip {
    color: #20634c;
    background: rgba(235, 255, 248, 0.78);
    border: 1px solid rgba(109, 219, 187, 0.44);
}

.download-trust-toast-link {
    color: #f8fffd;
    text-decoration: none;
    background: linear-gradient(135deg, #261653 0%, #33205f 46%, #47b47d 100%);
    border: 1px solid rgba(255, 255, 255, 0.30);
    box-shadow: 0 14px 26px -18px rgba(37, 23, 88, 0.72);
}

.download-trust-toast-close {
    width: 32px;
    height: 32px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(31, 30, 70, 0.10);
    border-radius: 999px;
    color: rgba(31, 30, 70, 0.72);
    background: rgba(255, 255, 255, 0.64);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.76);
    cursor: pointer;
    font-size: 1.22rem;
    line-height: 1;
}

.download-trust-toast-close:hover {
    color: #17133a;
    background: rgba(255, 255, 255, 0.86);
}

html[data-theme="dark"] .download-trust-toast {
    color: rgba(248, 250, 255, 0.96);
    border-color: rgba(171, 244, 221, 0.18);
    background:
        linear-gradient(135deg, rgba(19, 24, 41, 0.88), rgba(22, 20, 46, 0.74)),
        radial-gradient(circle at 12% 0%, rgba(112, 232, 196, 0.16), transparent 38%),
        radial-gradient(circle at 96% 100%, rgba(118, 87, 255, 0.20), transparent 44%);
    box-shadow:
        0 28px 82px -36px rgba(0, 0, 0, 0.70),
        0 12px 34px -28px rgba(100, 255, 213, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .download-trust-toast-copy strong {
    color: rgba(248, 250, 255, 0.96);
}

html[data-theme="dark"] .download-trust-toast-copy p {
    color: rgba(218, 224, 246, 0.74);
}

html[data-theme="dark"] .download-trust-toast-mark {
    color: #7af0c4;
    background: linear-gradient(135deg, rgba(38, 52, 65, 0.96), rgba(45, 31, 76, 0.84));
    border-color: rgba(128, 236, 204, 0.24);
}

html[data-theme="dark"] .download-trust-toast-chip {
    color: #b9f7df;
    background: rgba(29, 66, 55, 0.54);
    border-color: rgba(118, 232, 194, 0.24);
}

html[data-theme="dark"] .download-trust-toast-close {
    color: rgba(236, 241, 255, 0.78);
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.12);
}

html[dir="rtl"] .download-trust-toast {
    text-align: right;
}

@media (max-width: 760px) {
    .download-trust-toast {
        width: calc(100vw - 24px);
        grid-template-columns: auto minmax(0, 1fr) auto;
        gap: 9px;
        padding: 11px 12px;
        border-radius: 18px;
    }

    .download-trust-toast-mark {
        width: 36px;
        height: 36px;
        border-radius: 12px;
    }

    .download-trust-toast-copy {
        display: contents;
    }

    .download-trust-toast-copy strong {
        grid-column: 2;
        align-self: center;
        font-size: 0.88rem;
        line-height: 1.12;
    }

    .download-trust-toast-copy p {
        grid-column: 1 / -1;
        max-width: none;
        display: -webkit-box;
        overflow: hidden;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        font-size: 0.78rem;
        line-height: 1.28;
    }

    .download-trust-toast-actions {
        grid-column: 1 / -1;
        width: 100%;
        gap: 8px;
    }

    .download-trust-toast-chip,
    .download-trust-toast-link {
        flex: 1 1 130px;
        min-height: 30px;
        padding: 0 9px;
        font-size: 0.76rem;
    }

    .download-trust-toast-close {
        grid-column: 3;
        grid-row: 1;
        align-self: center;
        width: 30px;
        height: 30px;
        font-size: 1.12rem;
    }
}

@media (prefers-reduced-motion: no-preference) {
    .download-trust-banner {
        animation: downloadTrustEnter 0.7s cubic-bezier(0.2, 0.8, 0.2, 1) both;
    }

    @keyframes downloadTrustEnter {
        from {
            opacity: 0;
            transform: translateY(10px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
}

@media (max-width: 900px) {
    .download-trust-banner {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .download-trust-actions {
        grid-column: 2;
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}

@media (max-width: 640px) {
    .download-trust-banner,
    .hero .download-trust-banner {
        width: calc(100% - 24px);
        max-width: none;
        margin: 10px auto 10px;
        grid-template-columns: auto minmax(0, 1fr);
        gap: 9px;
        padding: 11px 12px;
        border-radius: 18px;
    }

    .hero .download-trust-banner {
        width: min(100%, 342px);
    }

    .download-trust-mark {
        width: 36px;
        height: 36px;
        border-radius: 12px;
    }

    .download-trust-mark svg {
        width: 20px;
        height: 20px;
    }

    .download-trust-copy {
        display: contents;
    }

    .download-trust-copy strong {
        grid-column: 2;
        align-self: center;
        font-size: 0.88rem;
        line-height: 1.12;
        text-align: left;
    }

    .download-trust-copy p {
        grid-column: 1 / -1;
        margin-top: 2px;
        max-width: none;
        display: -webkit-box;
        overflow: hidden;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        font-size: 0.78rem;
        line-height: 1.28;
        text-align: left;
    }

    .download-trust-copy .download-build-meta {
        display: block;
        overflow: visible;
        -webkit-line-clamp: unset;
        -webkit-box-orient: initial;
        font-size: 0.68rem;
        line-height: 1.35;
    }

    .download-hash-list {
        grid-column: 1 / -1;
        width: 100%;
    }

    .download-hash-row input {
        font-size: 0.66rem;
    }

    .download-trust-actions {
        grid-column: 1 / -1;
        width: 100%;
        justify-content: stretch;
        gap: 8px;
        white-space: normal;
    }

    .download-page .download-trust-banner {
        width: 100%;
        margin: 12px 0 10px;
    }

    .download-page .download-trust-copy p {
        display: block;
        overflow: visible;
        -webkit-line-clamp: unset;
        -webkit-box-orient: initial;
        font-size: 0.78rem;
        line-height: 1.34;
    }

    .download-trust-chip,
    .download-trust-link {
        min-height: 30px;
        flex: 1 1 130px;
        padding: 0 9px;
        font-size: 0.76rem;
        white-space: nowrap;
    }

    html[dir="rtl"] .download-trust-copy strong,
    html[dir="rtl"] .download-trust-copy p {
        text-align: right;
    }
}

/* Download click confirmation */
.download-confirm-popover {
    --download-confirm-top: 86px;
    position: fixed;
    top: var(--download-confirm-top);
    right: max(18px, env(safe-area-inset-right, 18px));
    z-index: 180;
    width: min(464px, calc(100vw - 28px));
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: start;
    gap: 12px 13px;
    padding: 15px;
    color: #17133a;
    text-align: left;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.78);
    border-radius: 22px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.66)),
        radial-gradient(circle at 12% 0%, rgba(112, 232, 196, 0.23), transparent 36%),
        radial-gradient(circle at 92% 100%, rgba(118, 87, 255, 0.18), transparent 42%);
    box-shadow:
        0 28px 80px -34px rgba(26, 22, 66, 0.48),
        0 12px 28px -24px rgba(39, 196, 144, 0.54),
        inset 0 1px 0 rgba(255, 255, 255, 0.90);
    backdrop-filter: blur(24px) saturate(170%);
    -webkit-backdrop-filter: blur(24px) saturate(170%);
    opacity: 0;
    pointer-events: none;
    transform: translate(10px, -12px) scale(0.982);
    transition:
        opacity 0.22s ease,
        transform 0.32s cubic-bezier(0.2, 0.8, 0.2, 1);
}

body > .download-confirm-popover {
    position: fixed !important;
    z-index: 180 !important;
}

.download-confirm-popover::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 48%;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.46), rgba(255, 255, 255, 0));
}

.download-confirm-popover::after {
    content: "";
    position: absolute;
    inset: auto 18px 0;
    height: 1px;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(112, 232, 196, 0.64), rgba(118, 87, 255, 0.44), transparent);
}

.download-confirm-popover.is-visible {
    opacity: 1;
    pointer-events: auto;
    transform: translate(0, 0) scale(1);
}

.download-confirm-popover.is-leaving {
    opacity: 0;
    pointer-events: none;
    transform: translate(10px, -10px) scale(0.982);
}

.download-confirm-popover-mark,
.download-confirm-popover-copy,
.download-confirm-popover-close,
.download-confirm-popover-meta,
.download-confirm-popover-controls {
    position: relative;
    z-index: 1;
}

.download-confirm-popover-mark {
    width: 42px;
    height: 42px;
    display: inline-grid;
    place-items: center;
    border-radius: 15px;
    color: #179b66;
    background:
        linear-gradient(135deg, rgba(236, 255, 248, 0.98), rgba(238, 231, 255, 0.84)),
        radial-gradient(circle at 30% 16%, rgba(255, 255, 255, 0.92), transparent 48%);
    border: 1px solid rgba(129, 232, 204, 0.48);
    box-shadow:
        0 18px 28px -20px rgba(25, 156, 106, 0.58),
        inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

.download-confirm-popover-mark svg {
    width: 22px;
    height: 22px;
}

.download-confirm-popover-copy {
    min-width: 0;
}

.download-confirm-popover-title {
    display: block;
    color: #17133a;
    font-size: 0.98rem;
    line-height: 1.12;
    font-weight: 950;
    letter-spacing: 0;
}

.download-confirm-popover-text {
    margin: 5px 0 0;
    color: rgba(31, 30, 70, 0.72);
    font-size: 0.84rem;
    line-height: 1.36;
    font-weight: 650;
}

.download-confirm-popover-close {
    width: 32px;
    height: 32px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(31, 30, 70, 0.10);
    border-radius: 999px;
    color: rgba(31, 30, 70, 0.68);
    background: rgba(255, 255, 255, 0.66);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.76);
    cursor: pointer;
    font-size: 1.18rem;
    line-height: 1;
}

.download-confirm-popover-close:hover {
    color: #17133a;
    background: rgba(255, 255, 255, 0.88);
}

.download-confirm-popover-meta,
.download-confirm-popover-controls {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 8px;
}

.download-confirm-popover-meta {
    flex-wrap: wrap;
}

.download-confirm-popover-chip,
.download-confirm-popover-link,
.download-confirm-popover-primary,
.download-confirm-popover-secondary {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 0 13px;
    font-size: 0.82rem;
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0;
}

.download-confirm-popover-chip {
    color: #20634c;
    background: rgba(235, 255, 248, 0.78);
    border: 1px solid rgba(109, 219, 187, 0.44);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.download-confirm-popover-link {
    color: #342561;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.58);
    border: 1px solid rgba(118, 87, 255, 0.18);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.76);
}

.download-confirm-popover-controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    align-items: stretch;
    justify-content: stretch;
    gap: 9px;
    margin-top: 2px;
}

.download-confirm-popover-primary,
.download-confirm-popover-secondary {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    cursor: pointer;
}

.download-confirm-popover-primary {
    min-height: 64px;
    padding: 0 24px;
    color: #f8fffd;
    font-size: 1.08rem;
    line-height: 1.12;
    text-align: center;
    white-space: normal;
    overflow-wrap: normal;
    border-radius: 20px;
    background:
        radial-gradient(circle at 18% 14%, rgba(255, 255, 255, 0.38), transparent 42%),
        radial-gradient(circle at 92% 86%, rgba(126, 255, 205, 0.34), transparent 38%),
        linear-gradient(135deg, #0f6f5c 0%, #17b87f 48%, #2fd394 100%);
    border: 1px solid rgba(180, 255, 231, 0.42);
    box-shadow:
        0 26px 44px -22px rgba(15, 111, 92, 0.76),
        0 16px 32px -20px rgba(47, 211, 148, 0.76),
        inset 0 1px 0 rgba(255, 255, 255, 0.34);
    text-shadow: 0 1px 1px rgba(5, 54, 42, 0.26);
}

.download-confirm-popover-primary:hover {
    transform: translateY(-1px);
    filter: brightness(1.04);
}

.download-confirm-popover-secondary {
    min-height: 44px;
    padding: 0 18px;
    color: rgba(31, 30, 70, 0.76);
    background: rgba(255, 255, 255, 0.60);
    border: 1px solid rgba(31, 30, 70, 0.10);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.76);
}

html[data-theme="dark"] .download-confirm-popover {
    color: rgba(248, 250, 255, 0.96);
    border-color: rgba(171, 244, 221, 0.18);
    background:
        linear-gradient(135deg, rgba(19, 24, 41, 0.88), rgba(22, 20, 46, 0.74)),
        radial-gradient(circle at 12% 0%, rgba(112, 232, 196, 0.16), transparent 38%),
        radial-gradient(circle at 96% 100%, rgba(118, 87, 255, 0.20), transparent 44%);
    box-shadow:
        0 28px 82px -36px rgba(0, 0, 0, 0.70),
        0 12px 34px -28px rgba(100, 255, 213, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .download-confirm-popover::before {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0));
}

html[data-theme="dark"] .download-confirm-popover-title {
    color: rgba(248, 250, 255, 0.96);
}

html[data-theme="dark"] .download-confirm-popover-text {
    color: rgba(218, 224, 246, 0.74);
}

html[data-theme="dark"] .download-confirm-popover-mark {
    color: #7af0c4;
    background: linear-gradient(135deg, rgba(38, 52, 65, 0.96), rgba(45, 31, 76, 0.84));
    border-color: rgba(128, 236, 204, 0.24);
}

html[data-theme="dark"] .download-confirm-popover-chip {
    color: #b9f7df;
    background: rgba(29, 66, 55, 0.54);
    border-color: rgba(118, 232, 194, 0.24);
}

html[data-theme="dark"] .download-confirm-popover-link,
html[data-theme="dark"] .download-confirm-popover-secondary,
html[data-theme="dark"] .download-confirm-popover-close {
    color: rgba(236, 241, 255, 0.82);
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.12);
}

html[dir="rtl"] .download-confirm-popover {
    right: auto;
    left: max(18px, env(safe-area-inset-left, 18px));
    text-align: right;
}

@media (max-width: 640px) {
    .download-confirm-popover,
    html[dir="rtl"] .download-confirm-popover {
        top: max(12px, env(safe-area-inset-top, 12px));
        left: 12px;
        right: 12px;
        width: auto;
        grid-template-columns: auto minmax(0, 1fr) auto;
        gap: 9px;
        padding: 12px;
        border-radius: 19px;
        transform: translateY(-12px) scale(0.985);
    }

    .download-confirm-popover.is-visible {
        transform: translateY(0) scale(1);
    }

    .download-confirm-popover.is-leaving {
        transform: translateY(-10px) scale(0.985);
    }

    .download-confirm-popover-mark {
        width: 36px;
        height: 36px;
        border-radius: 12px;
    }

    .download-confirm-popover-copy {
        display: contents;
    }

    .download-confirm-popover-title {
        grid-column: 2;
        align-self: center;
        font-size: 0.88rem;
        line-height: 1.12;
    }

    .download-confirm-popover-text {
        grid-column: 1 / -1;
        margin: 2px 0 1px;
        display: block;
        overflow: visible;
        font-size: 0.78rem;
        line-height: 1.28;
    }

    .download-confirm-popover-close {
        grid-column: 3;
        grid-row: 1;
        width: 30px;
        height: 30px;
        font-size: 1.1rem;
    }

    .download-confirm-popover-chip,
    .download-confirm-popover-link,
    .download-confirm-popover-primary,
    .download-confirm-popover-secondary {
        min-height: 32px;
        padding: 0 10px;
        font-size: 0.76rem;
    }

    .download-confirm-popover-primary {
        min-height: 64px;
        width: 100%;
        padding: 0 18px;
        border-radius: 18px;
        font-size: 1.03rem;
        line-height: 1.12;
        box-shadow:
            0 22px 36px -20px rgba(15, 111, 92, 0.82),
            0 12px 24px -18px rgba(47, 211, 148, 0.78),
            inset 0 1px 0 rgba(255, 255, 255, 0.34);
    }

    .download-confirm-popover-secondary {
        min-height: 38px;
        width: 100%;
        font-size: 0.82rem;
    }

    .download-confirm-popover-meta {
        gap: 7px;
    }

    .download-confirm-popover-chip,
    .download-confirm-popover-link {
        flex: 1 1 130px;
    }

    .download-confirm-popover-controls {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
    }
}

/* Keep the conversion hero in the intended reading order after legacy order rules. */
.hero-primary-actions {
    order: 5;
}

.platform-download-label {
    order: 6;
}

.hero-install {
    order: 7;
}

.netcat-hero-stage {
    order: 8;
    pointer-events: none;
}

.netcat-cat-kennel {
    order: 9;
    pointer-events: none;
    user-select: none;
}

/* Visual cat system: lightweight SVG mascots layered around existing conversion blocks. */
.cat-ambient-layer {
    position: absolute;
    inset: 74px 0 auto;
    z-index: 0;
    height: min(620px, 72vw);
    pointer-events: none;
    overflow: hidden;
    contain: layout paint;
}

.hero > .container {
    position: relative;
    z-index: 2;
}

.cat-float,
.cat-companion-card img,
.product-cat-squad img,
.cat-trust-mascot,
.cat-feature-mascot,
.cat-support-mascot img {
    image-rendering: pixelated;
    shape-rendering: crispEdges;
    pointer-events: none;
    user-select: none;
}

.cat-float {
    position: absolute;
    width: clamp(34px, 4.2vw, 54px);
    height: auto;
    opacity: 0.74;
    filter:
        drop-shadow(3px 3px 0 rgba(16, 20, 40, 0.20))
        drop-shadow(0 14px 22px rgba(24, 42, 86, 0.16));
    animation: catFloatDrift var(--cat-speed, 8s) ease-in-out infinite;
    will-change: transform;
}

.cat-float--premium {
    width: clamp(72px, 8.5vw, 116px);
    opacity: 0.88;
    filter:
        drop-shadow(4px 4px 0 rgba(16, 20, 40, 0.18))
        drop-shadow(0 18px 30px rgba(24, 42, 86, 0.18))
        drop-shadow(0 0 18px rgba(45, 212, 191, 0.12));
}

.cat-float--one {
    left: clamp(24px, 5vw, 90px);
    top: 35%;
    --cat-speed: 8.5s;
    --cat-x: 18px;
    --cat-y: -16px;
    --cat-r1: -6deg;
    --cat-r2: 5deg;
}

.cat-float--two {
    right: clamp(24px, 5.4vw, 96px);
    top: 34%;
    --cat-speed: 9.8s;
    --cat-x: -16px;
    --cat-y: -12px;
    --cat-r1: 8deg;
    --cat-r2: -4deg;
}

.cat-companion-strip {
    position: relative;
    padding: 18px 0 34px;
    background:
        linear-gradient(180deg, rgba(232, 249, 242, 0.72), rgba(246, 250, 255, 0.94));
}

.cat-companion-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.cat-companion-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    min-width: 0;
    padding: 16px;
    border: 1px solid rgba(32, 52, 86, 0.10);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 18px 42px -34px rgba(25, 43, 82, 0.34);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.cat-companion-card img {
    width: 70px;
    height: 70px;
    filter: drop-shadow(2px 2px 0 rgba(16, 20, 40, 0.20));
    transition: transform 180ms ease, filter 180ms ease;
}

.cat-companion-card:hover {
    transform: translateY(-2px);
    border-color: rgba(22, 185, 133, 0.22);
    box-shadow: 0 24px 54px -36px rgba(25, 43, 82, 0.44);
}

.cat-companion-card:hover img {
    transform: translateY(-3px);
    filter:
        drop-shadow(2px 2px 0 rgba(16, 20, 40, 0.20))
        drop-shadow(0 12px 20px rgba(45, 212, 191, 0.18));
}

.cat-companion-card:nth-child(2) img {
    animation-delay: 360ms;
}

.cat-companion-card:nth-child(3) img {
    animation-delay: 720ms;
}

.cat-companion-card strong {
    display: block;
    color: #17213b;
    font-size: 0.98rem;
    line-height: 1.18;
}

.cat-companion-card p {
    margin: 5px 0 0;
    color: rgba(44, 50, 78, 0.68);
    font-size: 0.9rem;
    line-height: 1.42;
}

.product-device-studio {
    overflow: visible;
}

.product-cat-squad {
    position: absolute;
    inset: 0;
    z-index: 6;
    pointer-events: none;
}

.product-cat-squad img {
    position: absolute;
    width: clamp(58px, 7vw, 82px);
    height: auto;
    filter:
        drop-shadow(3px 3px 0 rgba(16, 20, 40, 0.24))
        drop-shadow(0 14px 24px rgba(24, 42, 86, 0.18));
}

.product-cat-squad img:first-child {
    left: -6%;
    top: 20%;
    width: clamp(52px, 6vw, 72px);
    opacity: 0.86;
}

.product-cat-squad img:last-child {
    right: -3%;
    bottom: 14%;
    width: clamp(46px, 5.4vw, 62px);
    opacity: 0.64;
    animation-delay: 620ms;
}

.trust-before-payment {
    grid-template-columns: minmax(0, 1.1fr) minmax(260px, 0.9fr);
}

.trust-before-payment--with-mascot {
    grid-template-columns: auto minmax(0, 1.05fr) minmax(260px, 0.9fr);
}

.cat-trust-mascot {
    width: clamp(70px, 9vw, 92px);
    height: auto;
    justify-self: center;
    filter:
        drop-shadow(3px 3px 0 rgba(16, 20, 40, 0.20))
        drop-shadow(0 14px 22px rgba(22, 185, 133, 0.18));
    animation:
        catCompanionBob 7.2s ease-in-out infinite,
        catPremiumGlow 8.4s ease-in-out infinite;
}

.why-card {
    position: relative;
}

.why-card:not(.why-card--wide) {
    padding-right: max(20px, 92px);
}

.cat-feature-mascot {
    position: absolute;
    right: 18px;
    top: 18px;
    width: 62px;
    height: 62px;
    opacity: 0.92;
    filter: drop-shadow(2px 2px 0 rgba(16, 20, 40, 0.18));
}

.cat-support-mascot {
    order: 2;
    display: inline-flex;
    align-items: flex-end;
    justify-content: center;
    gap: 8px;
    flex: 0 0 auto;
    margin-inline: auto;
    padding: 10px 12px;
    border: 1px solid rgba(32, 52, 86, 0.10);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.56);
    box-shadow: 0 18px 42px -34px rgba(25, 43, 82, 0.34);
}

.section-support .support-grid {
    justify-content: center;
}

.section-support .support-copy {
    flex: 1 1 100%;
    text-align: center;
}

.section-support .support-copy .section-subtitle {
    margin-right: auto;
    margin-left: auto;
}

.section-support .support-legal-links {
    order: 3;
}

.section-support .support-actions {
    order: 4;
}

.cat-support-mascot img {
    width: 74px;
    height: 74px;
    filter: drop-shadow(2px 2px 0 rgba(16, 20, 40, 0.20));
}

.cat-support-mascot img + img {
    width: 38px;
    height: 38px;
    opacity: 0.30;
}

.cat-support-mascot img:nth-child(2) {
    transform: translateY(-4px);
    animation-delay: 580ms;
}

html[data-theme="dark"] .cat-companion-strip {
    background:
        linear-gradient(180deg, rgba(15, 29, 42, 0.72), rgba(13, 18, 34, 0.96));
}

html[data-theme="dark"] .cat-companion-card,
html[data-theme="dark"] .cat-support-mascot {
    background: rgba(19, 24, 41, 0.74);
    border-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .cat-companion-card strong {
    color: rgba(242, 246, 255, 0.94);
}

html[data-theme="dark"] .cat-companion-card p {
    color: rgba(214, 224, 246, 0.72);
}

@keyframes catFloatDrift {
    0%,
    100% {
        transform: translate3d(0, 0, 0) rotate(var(--cat-r1, 0deg));
    }

    50% {
        transform: translate3d(var(--cat-x, 12px), var(--cat-y, -12px), 0) rotate(var(--cat-r2, 4deg));
    }
}

@keyframes catCompanionBob {
    0%,
    100% {
        transform: translateY(0) rotate(-1deg);
    }

    50% {
        transform: translateY(-6px) rotate(1deg);
    }
}

@keyframes catPremiumGlow {
    0%,
    100% {
        filter:
            drop-shadow(3px 3px 0 rgba(16, 20, 40, 0.20))
            drop-shadow(0 14px 22px rgba(22, 185, 133, 0.12));
    }

    50% {
        filter:
            drop-shadow(3px 3px 0 rgba(16, 20, 40, 0.20))
            drop-shadow(0 20px 30px rgba(45, 212, 191, 0.24))
            drop-shadow(0 0 18px rgba(45, 212, 191, 0.18));
    }
}

@keyframes catTinyTilt {
    0% {
        transform: translateY(0) rotate(0);
    }

    45% {
        transform: translateY(-7px) rotate(-3deg);
    }

    100% {
        transform: translateY(-2px) rotate(1deg);
    }
}

@media (max-width: 820px) {
    .trust-before-payment {
        grid-template-columns: minmax(0, 1fr);
    }

    .cat-trust-mascot {
        justify-self: start;
    }

    .cat-support-mascot {
        align-self: stretch;
    }
}

@media (max-width: 900px) {
    .cat-companion-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .product-cat-squad img:first-child {
        left: 4%;
        top: 12%;
        width: 58px;
    }

    .product-cat-squad img:last-child {
        display: none;
    }

    .why-card:not(.why-card--wide) {
        padding-right: 20px;
    }

    .cat-feature-mascot {
        position: static;
        display: block;
        margin: -2px 0 8px auto;
    }
}

@media (max-width: 1080px) {
    .cat-ambient-layer {
        height: 540px;
    }

    .cat-float--one,
    .cat-float--two {
        display: block;
        width: clamp(58px, 8vw, 74px);
        top: 48%;
        opacity: 0.76;
    }

    .cat-float--one {
        left: max(18px, 3vw);
    }

    .cat-float--two {
        right: max(18px, 3vw);
    }

}

@media (max-width: 640px) {
    .cat-ambient-layer,
    .product-cat-squad {
        display: none;
    }

    .cat-companion-strip {
        padding: 14px 0 26px;
    }

    .cat-companion-card {
        grid-template-columns: 48px minmax(0, 1fr);
        padding: 14px;
    }

    .cat-companion-card img,
    .cat-support-mascot img {
        width: 48px;
        height: 48px;
    }

    .cat-feature-mascot {
        position: static;
        display: block;
        margin: -2px 0 8px auto;
    }

    .cat-support-mascot {
        width: 100%;
        box-sizing: border-box;
    }

    .cat-support-mascot img + img {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cat-float,
    .cat-companion-card,
    .cat-companion-card img,
    .product-cat-squad img,
    .cat-trust-mascot,
    .cat-feature-mascot,
    .cat-support-mascot img,
    .pixel-cat,
    .pixel-cat *,
    .netcat-orbit,
    .netcat-world-map,
    .netcat-web-cat,
    .netcat-web-cat .web-cat-tail,
    .netcat-web-cat .web-cat-eye {
        animation: none !important;
        transform: none !important;
        transition: none !important;
    }
}
