/* ==========================================================
   FRIENDLYVPN DESIGN SYSTEM
   Design-only stylesheet. Payment/account logic lives in the
   existing FriendlyVPN Store plugin and is not changed here.
   ========================================================== */

:root {
    --fvpn-bg-0: #05020a;
    --fvpn-bg-1: #090311;
    --fvpn-bg-2: #0d0618;
    --fvpn-panel: rgba(15, 7, 28, .88);
    --fvpn-panel-strong: #10071d;
    --fvpn-panel-soft: rgba(20, 10, 35, .72);
    --fvpn-purple: #7a00ff;
    --fvpn-purple-2: #9c45ff;
    --fvpn-purple-3: #c6a0ff;
    --fvpn-white: #ffffff;
    --fvpn-text: #e9e2f2;
    --fvpn-muted: #aea3bc;
    --fvpn-line: rgba(151, 74, 255, .25);
    --fvpn-line-strong: rgba(151, 74, 255, .52);
    --fvpn-success: #7ee2a8;
    --fvpn-danger: #ff8ca3;
    --fvpn-shadow: 0 28px 80px rgba(0,0,0,.38);
    --fvpn-radius-xl: 30px;
    --fvpn-radius-lg: 22px;
    --fvpn-radius-md: 14px;
    --fvpn-max: 1180px;
}

html { background: var(--fvpn-bg-0) !important; }

body,
#page,
#inner-wrap,
#wrapper,
.site,
.site-content,
.content-area,
.site-main,
#primary,
.content-wrap,
.content-container,
.site-container,
.entry,
.entry-content,
.entry-content-wrap,
.single-content,
.content-bg,
.entry.single-entry,
.entry.loop-entry,
.woocommerce,
.woocommerce-page {
    color: var(--fvpn-text) !important;
    background-color: var(--fvpn-bg-0) !important;
}

body {
    min-height: 100vh;
    overflow-x: clip;
    background-image:
        radial-gradient(circle at 50% -10%, rgba(122,0,255,.28), transparent 34%),
        radial-gradient(circle at 88% 26%, rgba(110,31,200,.11), transparent 28%),
        linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px),
        linear-gradient(180deg, #090311 0%, #05020a 58%, #05020a 100%) !important;
    background-size: auto, auto, 48px 48px, 48px 48px, auto !important;
    background-attachment: fixed !important;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

/* Lightweight animated network atmosphere. It never receives clicks. */
body::before,
body::after {
    position: fixed;
    inset: -12vh -8vw;
    pointer-events: none;
    z-index: 0;
}

body::before {
    content: "";
    background-image:
        radial-gradient(circle at 8% 16%, rgba(255,255,255,.9) 0 1px, transparent 1.8px),
        radial-gradient(circle at 72% 28%, rgba(170,91,255,.95) 0 1px, transparent 2px),
        radial-gradient(circle at 34% 76%, rgba(255,255,255,.7) 0 1px, transparent 1.8px),
        radial-gradient(circle at 91% 82%, rgba(142,45,255,.9) 0 1px, transparent 2px);
    background-size: 137px 149px, 191px 173px, 223px 211px, 281px 257px;
    opacity: .28;
    animation: fvpn-stars 8s ease-in-out infinite alternate;
}

body::after {
    content: "01001001 00110110 11001010 01100101 10110010 00101101 11010010 01010110 00110101 10100110 01001101 01101001 10010110 00110101 01011010 11001001 00101101 10100101 01011010 01100110 10010101 00110101 11001010 01010110 10110010 01101001 00101101 11010100 01001011 10100110 00110101 01101010 10010110 01001101 00110101 11001010 10100101 01011010 01100110 10010101 00110101 11001010 01010110";
    color: rgba(188,129,255,.34);
    font: 600 11px/4.8rem ui-monospace, SFMono-Regular, Consolas, monospace;
    letter-spacing: .38rem;
    word-spacing: 1.15rem;
    overflow: hidden;
    opacity: .18;
    transform: rotate(-7deg) scale(1.08);
    animation: fvpn-binary-drift 26s linear infinite alternate;
}

@keyframes fvpn-stars {
    from { opacity: .18; transform: translate3d(0,0,0); }
    to { opacity: .38; transform: translate3d(0,-12px,0); }
}

@keyframes fvpn-binary-drift {
    from { transform: rotate(-7deg) translate3d(-1.5%,2%,0) scale(1.08); }
    to { transform: rotate(-7deg) translate3d(1.5%,-2%,0) scale(1.08); }
}

body #page,
body #inner-wrap,
body .site,
body .site-content,
body .content-area,
body .site-main,
body #primary,
body .content-wrap,
body .content-container,
body .site-container,
body .entry,
body .entry-content,
body .entry-content-wrap,
body .single-content,
body .content-bg {
    position: relative;
    z-index: 1;
    background-color: transparent !important;
}

body.page .entry-header,
body.woocommerce-account .entry-header,
body.woocommerce-cart .entry-header,
body.woocommerce-checkout .entry-header,
body.page .page-header,
body.page .entry-hero {
    display: none !important;
}

.site-container,
.content-container {
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#main { padding-top: 0 !important; }

a { transition: color .16s ease, border-color .16s ease, background-color .16s ease, transform .16s ease, box-shadow .16s ease; }

/* Header */
#masthead,
.site-header,
.site-header-wrap,
.site-main-header-wrap,
.site-header-row-container,
.site-header-row-container-inner,
.site-top-header-wrap,
.site-bottom-header-wrap {
    color: #fff !important;
    background: rgba(5,2,10,.88) !important;
    border-color: rgba(151,74,255,.18) !important;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.site-header {
    border-bottom: 1px solid rgba(151,74,255,.18) !important;
    box-shadow: 0 10px 40px rgba(0,0,0,.22);
}

.site-header a,
.site-header .menu-item > a,
.main-navigation .primary-menu-container > ul > li.menu-item > a {
    color: #f7f2ff !important;
    font-weight: 650 !important;
    letter-spacing: -.01em;
}

.site-header a:hover,
.site-header .current-menu-item > a,
.site-header .current_page_item > a {
    color: var(--fvpn-purple-3) !important;
}

/* Footer */
.site-footer,
.site-footer-wrap,
.site-footer-row-container-inner,
.site-middle-footer-wrap,
.site-bottom-footer-wrap {
    color: #bdb2ca !important;
    background: #040107 !important;
    border-color: rgba(151,74,255,.16) !important;
}

.site-footer a { color: #d3b9ff !important; }

/* Shared layout */
.fvpn-shell {
    width: 100%;
    min-height: 70vh;
    padding: 46px 22px 78px;
    color: var(--fvpn-text);
}

.fvpn-wrap {
    width: min(var(--fvpn-max), calc(100% - 12px));
    margin: 0 auto;
}

.fvpn-hero {
    position: relative;
    overflow: hidden;
    width: min(var(--fvpn-max), calc(100% - 12px));
    margin: 0 auto;
    padding: 72px 58px;
    border: 1px solid rgba(151,74,255,.42);
    border-radius: var(--fvpn-radius-xl);
    background:
        radial-gradient(circle at 88% 15%, rgba(122,0,255,.25), transparent 32%),
        linear-gradient(135deg, rgba(25,10,45,.98), rgba(7,3,14,.98) 62%);
    box-shadow: var(--fvpn-shadow), 0 0 70px rgba(122,0,255,.08);
}

.fvpn-hero:after {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    right: -170px;
    bottom: -250px;
    border-radius: 50%;
    background: rgba(122,0,255,.15);
    filter: blur(72px);
    pointer-events: none;
}

.fvpn-hero-inner {
    position: relative;
    z-index: 2;
    max-width: 920px;
}

.fvpn-eyebrow,
.fvpn-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #d1b5ff;
    font-size: 12px;
    font-weight: 850;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.fvpn-eyebrow:before {
    content: "";
    width: 26px;
    height: 1px;
    background: linear-gradient(90deg, var(--fvpn-purple), var(--fvpn-purple-3));
}

.fvpn-h1 {
    max-width: 950px;
    margin: 18px 0 20px;
    color: #fff !important;
    font-size: clamp(42px, 6vw, 72px);
    line-height: .99;
    letter-spacing: -.045em;
    font-weight: 900;
}

.fvpn-h1 .fvpn-gradient {
    color: transparent;
    background: linear-gradient(90deg, #fff 0%, #e7d5ff 42%, #a75cff 100%);
    -webkit-background-clip: text;
    background-clip: text;
}

.fvpn-sub {
    max-width: 820px;
    margin: 0;
    color: #d9d0e5 !important;
    font-size: clamp(16px, 2vw, 19px);
    line-height: 1.72;
}

.fvpn-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.fvpn-btn,
.fvpn-button,
.woocommerce a.button.fvpn-button,
.woocommerce button.button.alt,
.woocommerce a.button.alt,
.woocommerce #place_order {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 13px 22px !important;
    color: #fff !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    border: 1px solid #9d45ff !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #6900e6, #8f20ff) !important;
    box-shadow: 0 12px 32px rgba(122,0,255,.25);
}

.fvpn-btn:hover,
.fvpn-button:hover,
.woocommerce a.button.fvpn-button:hover,
.woocommerce button.button.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce #place_order:hover {
    color: #fff !important;
    transform: translateY(-2px);
    filter: brightness(1.08);
    box-shadow: 0 16px 38px rgba(122,0,255,.37);
}

.fvpn-btn-ghost,
.fvpn-btn2 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 13px 22px;
    color: #f3eaff !important;
    font-weight: 760;
    text-decoration: none !important;
    border: 1px solid rgba(167,92,255,.55);
    border-radius: 999px;
    background: rgba(122,0,255,.07);
}

.fvpn-btn-ghost:hover,
.fvpn-btn2:hover {
    color: #fff !important;
    transform: translateY(-2px);
    border-color: rgba(189,134,255,.9);
    background: rgba(122,0,255,.13);
}

.fvpn-trust-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 10px;
    width: min(var(--fvpn-max), calc(100% - 12px));
    margin: 16px auto 0;
}

.fvpn-trust-item {
    padding: 13px 15px;
    color: #cfc3dc;
    font-size: 13px;
    text-align: center;
    border: 1px solid rgba(151,74,255,.18);
    border-radius: 13px;
    background: rgba(11,5,20,.7);
}

.fvpn-trust-item strong { color: #fff; font-weight: 800; }

.fvpn-section {
    width: min(var(--fvpn-max), calc(100% - 12px));
    margin: 58px auto 0;
}

.fvpn-section-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

.fvpn-section-copy { max-width: 720px; }

.fvpn-label {
    margin-bottom: 9px;
    color: #b88aff;
    font-size: 12px;
    font-weight: 850;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.fvpn-title {
    margin: 0;
    color: #fff !important;
    font-size: clamp(30px, 4vw, 43px);
    line-height: 1.08;
    letter-spacing: -.035em;
    font-weight: 890;
}

.fvpn-section-desc {
    margin: 12px 0 0;
    color: var(--fvpn-muted) !important;
    font-size: 16px;
    line-height: 1.7;
}

.fvpn-grid { display: grid; gap: 18px; }
.fvpn-grid-3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
.fvpn-grid-4 { grid-template-columns: repeat(4,minmax(0,1fr)); }
.fvpn-grid-2 { grid-template-columns: repeat(2,minmax(0,1fr)); }

.fvpn-card {
    position: relative;
    overflow: hidden;
    padding: 28px;
    color: var(--fvpn-text);
    border: 1px solid var(--fvpn-line);
    border-radius: var(--fvpn-radius-lg);
    background:
        linear-gradient(160deg, rgba(18,8,32,.96), rgba(7,3,14,.96));
    box-shadow: 0 18px 50px rgba(0,0,0,.23);
}

.fvpn-card:hover {
    transform: translateY(-3px);
    border-color: rgba(164,83,255,.55);
    box-shadow: 0 24px 62px rgba(0,0,0,.3), 0 0 30px rgba(122,0,255,.08);
}

.fvpn-card h3,
.fvpn-card h4 {
    margin: 10px 0 8px;
    color: #fff !important;
    letter-spacing: -.025em;
}

.fvpn-card h3 { font-size: 23px; }
.fvpn-card h4 { font-size: 18px; }

.fvpn-card p,
.fvpn-card li {
    color: #cec4d9 !important;
    line-height: 1.65;
}

.fvpn-iconbox {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    color: #d9c0ff;
    font-size: 20px;
    font-weight: 900;
    border: 1px solid rgba(161,80,255,.35);
    border-radius: 13px;
    background: rgba(122,0,255,.12);
}

.fvpn-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.fvpn-pill {
    display: inline-flex;
    padding: 8px 11px;
    color: #d9c9ef;
    font-size: 12px;
    font-weight: 720;
    border: 1px solid rgba(151,74,255,.2);
    border-radius: 999px;
    background: rgba(122,0,255,.06);
}

/* Locations */
.fvpn-location {
    min-height: 190px;
    padding: 24px;
}

.fvpn-location-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.fvpn-flag { font-size: 31px; line-height: 1; }

.fvpn-region {
    color: #a996bc;
    font-size: 12px;
    font-weight: 780;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.fvpn-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #bff0d0;
    font-size: 12px;
    font-weight: 750;
}

.fvpn-status:before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #61d991;
    box-shadow: 0 0 16px rgba(97,217,145,.55);
}

/* Steps */
.fvpn-steps { counter-reset: fvpn-step; }
.fvpn-step { padding-top: 26px; }

.fvpn-step:before {
    counter-increment: fvpn-step;
    content: "0" counter(fvpn-step);
    display: block;
    margin-bottom: 20px;
    color: #a765ff;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .16em;
}

/* Callouts */
.fvpn-callout {
    position: relative;
    overflow: hidden;
    padding: 34px;
    border: 1px solid rgba(151,74,255,.38);
    border-radius: var(--fvpn-radius-lg);
    background:
        radial-gradient(circle at 85% 10%, rgba(122,0,255,.17), transparent 32%),
        rgba(13,6,24,.88);
}

.fvpn-callout h3 {
    margin: 0 0 10px;
    color: #fff !important;
    font-size: 26px;
    letter-spacing: -.03em;
}

.fvpn-callout p { margin: 0; color: #cfc4da !important; line-height: 1.7; }

/* Plans */
.fvpn-plans-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 18px;
}

.fvpn-plan {
    display: flex;
    flex-direction: column;
    min-height: 390px;
    padding: 28px;
}

.fvpn-plan-best {
    border-color: rgba(172,92,255,.72);
    box-shadow: 0 22px 68px rgba(55,0,110,.28), inset 0 1px 0 rgba(255,255,255,.03);
}

.fvpn-best-badge {
    position: absolute;
    top: 18px;
    right: 18px;
    padding: 7px 10px;
    color: #fff;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    border: 1px solid rgba(195,147,255,.5);
    border-radius: 999px;
    background: rgba(122,0,255,.25);
}

.fvpn-plan-term {
    color: #ba91f5;
    font-size: 12px;
    font-weight: 850;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.fvpn-price {
    margin: 16px 0 4px;
    color: #fff;
    font-size: 43px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: -.045em;
}

.fvpn-price small {
    color: #9f91ad;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0;
}

.fvpn-plan-list {
    margin: 20px 0 24px;
    padding: 0;
    list-style: none;
}

.fvpn-plan-list li {
    position: relative;
    margin: 9px 0;
    padding-left: 21px;
    color: #d4cadf !important;
    font-size: 14px;
}

.fvpn-plan-list li:before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #ac6aff;
    font-weight: 900;
}

.fvpn-plan .fvpn-buy,
.fvpn-plan > .fvpn-button {
    width: 100%;
    box-sizing: border-box;
    margin-top: auto !important;
}

.fvpn-note {
    color: #a99daf !important;
    font-size: 13px;
    line-height: 1.65;
}

/* Legal / Terms */
.fvpn-legal {
    display: grid;
    grid-template-columns: 260px minmax(0,1fr);
    gap: 22px;
    align-items: start;
}

.fvpn-legal-nav {
    position: sticky;
    top: 110px;
    padding: 20px;
    border: 1px solid var(--fvpn-line);
    border-radius: 18px;
    background: rgba(12,5,22,.84);
}

.fvpn-legal-nav a {
    display: block;
    padding: 9px 10px;
    color: #c9bdd5 !important;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none !important;
    border-radius: 10px;
}

.fvpn-legal-nav a:hover { color: #fff !important; background: rgba(122,0,255,.12); }

.fvpn-legal-content {
    padding: 34px;
    border: 1px solid var(--fvpn-line);
    border-radius: var(--fvpn-radius-lg);
    background: rgba(12,5,22,.82);
}

.fvpn-legal-section {
    padding: 2px 0 30px;
    margin-bottom: 28px;
    border-bottom: 1px solid rgba(151,74,255,.16);
    scroll-margin-top: 110px;
}

.fvpn-legal-section:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }

.fvpn-legal-section h2,
.fvpn-legal-section h3 {
    color: #fff !important;
    letter-spacing: -.025em;
}

.fvpn-legal-section p,
.fvpn-legal-section li { color: #cdc2d7 !important; line-height: 1.75; }

/* Contact */
.fvpn-contact-grid {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 18px;
}

.fvpn-handle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 0;
    border-bottom: 1px solid rgba(151,74,255,.15);
}

.fvpn-handle:last-child { border-bottom: 0; }
.fvpn-handle-label { color: #9f92ac; font-size: 12px; font-weight: 780; text-transform: uppercase; letter-spacing: .08em; }
.fvpn-handle-value { color: #fff; font-weight: 800; }

/* WooCommerce / purchase flow - visual only */
.woocommerce,
.woocommerce-page { color: #fff !important; }

.woocommerce form.login,
.woocommerce form.register,
.woocommerce form.checkout,
.woocommerce form.edit-account,
.woocommerce .woocommerce-MyAccount-navigation,
.woocommerce .woocommerce-MyAccount-content,
.woocommerce table.shop_table,
.woocommerce-checkout-review-order,
.woocommerce-checkout-payment,
.woocommerce .cart-collaterals,
#payment {
    color: #fff !important;
    background: linear-gradient(150deg, rgba(17,8,30,.97), rgba(7,3,14,.97)) !important;
    border: 1px solid rgba(151,74,255,.3) !important;
    border-radius: 20px !important;
    box-shadow: 0 20px 60px rgba(0,0,0,.24) !important;
}

.woocommerce form.login,
.woocommerce form.register,
.woocommerce form.checkout,
.woocommerce form.edit-account,
.woocommerce .woocommerce-MyAccount-navigation,
.woocommerce .woocommerce-MyAccount-content,
.woocommerce table.shop_table,
.woocommerce-checkout-review-order,
#payment { padding: 23px !important; }

.woocommerce h1,
.woocommerce h2,
.woocommerce h3,
.woocommerce h4,
.woocommerce label,
.woocommerce legend,
.woocommerce strong,
.woocommerce p,
.woocommerce td,
.woocommerce th { color: #fff !important; }

.woocommerce a { color: #c9a2ff; }

.woocommerce input.input-text,
.woocommerce input[type="email"],
.woocommerce input[type="text"],
.woocommerce input[type="password"],
.woocommerce input[type="tel"],
.woocommerce textarea,
.woocommerce select,
.select2-container--default .select2-selection--single {
    min-height: 46px;
    color: #fff !important;
    background: #0f071a !important;
    border: 1px solid rgba(151,74,255,.42) !important;
    border-radius: 11px !important;
    box-shadow: none !important;
}

.woocommerce input.input-text,
.woocommerce input[type="email"],
.woocommerce input[type="text"],
.woocommerce input[type="password"],
.woocommerce input[type="tel"],
.woocommerce textarea { padding: 11px 13px !important; }

.woocommerce input:focus,
.woocommerce textarea:focus,
.woocommerce select:focus {
    border-color: #a95dff !important;
    box-shadow: 0 0 0 3px rgba(122,0,255,.12) !important;
    outline: none !important;
}

.select2-dropdown,
.select2-results,
.select2-results__options {
    color: #fff !important;
    background: #0f071a !important;
    border-color: rgba(151,74,255,.42) !important;
}

.select2-results__option--highlighted { background: #7a00ff !important; }

.woocommerce button.button,
.woocommerce a.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
    color: #fff !important;
    background: linear-gradient(135deg, #6900e6, #8f20ff) !important;
    border: 0 !important;
    border-radius: 999px !important;
    padding: 13px 20px !important;
    font-weight: 800 !important;
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    color: #fff !important;
    background: #0f071a !important;
    border: 1px solid rgba(151,74,255,.32) !important;
    border-top: 3px solid #7a00ff !important;
    border-radius: 14px !important;
}

.woocommerce-error { border-top-color: #d94b75 !important; }

.woocommerce-MyAccount-navigation ul { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.woocommerce-MyAccount-navigation li { margin: 5px 0; }
.woocommerce-MyAccount-navigation a {
    display: block;
    padding: 11px 13px;
    color: #d7c9e7 !important;
    text-decoration: none !important;
    border-radius: 10px;
}

.woocommerce-MyAccount-navigation a:hover,
.woocommerce-MyAccount-navigation .is-active a {
    color: #fff !important;
    background: rgba(122,0,255,.16);
}

.fvpn-account-status,
.fvpn-account-note {
    margin: 18px 0;
    padding: 19px;
    color: #ddd3ec;
    background: rgba(122,0,255,.07);
    border: 1px solid rgba(151,74,255,.3);
    border-radius: 16px;
}

.fvpn-account-note a { color: #d1adff !important; }
.fvpn-good { color: var(--fvpn-success); font-weight: 800; }
.fvpn-bad { color: var(--fvpn-danger); font-weight: 800; }

/* Payment area only gets outer visual treatment. Gateway behavior is untouched. */
#payment,
.payment_box,
.woocommerce-checkout-payment {
    color: #fff !important;
    background-color: #0c0516 !important;
}

#payment .payment_box:before { border-bottom-color: rgba(20,10,35,.96) !important; }
#payment .payment_box { background: rgba(20,10,35,.96) !important; }

/* Responsive */
@media (max-width: 980px) {
    .fvpn-grid-4,
    .fvpn-plans-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .fvpn-grid-3 { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .fvpn-trust-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .fvpn-contact-grid { grid-template-columns: 1fr; }
    .fvpn-legal { grid-template-columns: 1fr; }
    .fvpn-legal-nav { position: static; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 700px) {
    .fvpn-shell { padding: 24px 12px 54px; }
    .fvpn-hero { width: 100%; padding: 44px 24px; border-radius: 22px; }
    .fvpn-h1 { font-size: clamp(38px, 12vw, 54px); }
    .fvpn-section { width: 100%; margin-top: 42px; }
    .fvpn-section-head { display: block; }
    .fvpn-grid-4,
    .fvpn-grid-3,
    .fvpn-grid-2,
    .fvpn-plans-grid,
    .fvpn-trust-row { grid-template-columns: 1fr; }
    .fvpn-card { padding: 23px; }
    .fvpn-plan { min-height: 0; }
    .fvpn-legal-content { padding: 23px; }
    .fvpn-legal-nav { grid-template-columns: 1fr; }
    .fvpn-actions { align-items: stretch; }
    .fvpn-actions a { width: 100%; box-sizing: border-box; }

    .fvpn-shell,
    .fvpn-hero,
    .fvpn-section,
    .fvpn-card,
    .fvpn-plan,
    .woocommerce,
    .woocommerce-page {
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .fvpn-h1,
    .fvpn-title,
    .fvpn-card h2,
    .fvpn-card h3 { overflow-wrap: anywhere; }

    .woocommerce form,
    .woocommerce form.checkout,
    .woocommerce-checkout-review-order,
    .woocommerce-checkout-payment,
    .woocommerce table.shop_table {
        width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .woocommerce input.input-text,
    .woocommerce textarea,
    .woocommerce select,
    .woocommerce button,
    .woocommerce .button,
    #payment iframe,
    .paypal-buttons,
    .paypal-buttons-context-iframe {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    body::after {
        font-size: 9px;
        letter-spacing: .22rem;
        word-spacing: .7rem;
        opacity: .12;
    }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
    }
}
