/**
 * for-business.css  — v3 PREMIUM
 * Design System: Cyber-Jungle / Neo-Brutalism + Tactile Digital Premium
 * B2B Landing Page — Places Thailand
 */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;700&display=swap');

/* ============================================
   DESIGN TOKENS
   ============================================ */
:root {
    --cj-bg-base:        #0A0E1A;
    --cj-bg-surface:     #111827;
    --cj-bg-card:        #161D2F;
    --cj-bg-overlay:     rgba(10, 14, 26, 0.95);
    --cj-green:          #10B981;
    --cj-green-bright:   #34D399;
    --cj-green-dim:      #065F46;
    --cj-green-glow:     rgba(16, 185, 129, 0.15);
    --cj-yellow:         #F59E0B;
    --cj-yellow-glow:    rgba(245, 158, 11, 0.15);
    --cj-red:            #EF4444;
    --cj-text-primary:   #F0FDF4;
    --cj-text-secondary: #9CA3AF;
    --cj-text-muted:     #6B7280;
    --cj-border:         #1F2937;
    --cj-border-bright:  #10B981;
    --cj-border-strong:  #374151;
    --cj-shadow:         3px 3px 0px #10B981;
    --cj-font-main:      'Space Grotesk', system-ui, sans-serif;
    --cj-font-mono:      'JetBrains Mono', 'Courier New', monospace;
    --cj-transition:     150ms ease;
}

.b2b-page {
    background: var(--cj-bg-base);
    min-height: 100vh;
    font-family: var(--cj-font-main);
    color: var(--cj-text-primary);
    line-height: 1.6;
}

.b2b-page *, .b2b-page *::before, .b2b-page *::after {
    box-sizing: border-box;
}

/* LAYOUT */
.b2b-container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.b2b-section { padding: 80px 0; border-bottom: 1px solid var(--cj-border); }
.b2b-section:last-child { border-bottom: none; }

/* ============================================
   HEADER
   ============================================ */
.b2b-header {
    position: fixed; top: 0; left: 0; right: 0; z-index: 100;
    background: var(--cj-bg-overlay);
    border-bottom: 1px solid var(--cj-border);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}
.b2b-header__inner {
    display: flex; align-items: center; justify-content: space-between;
    padding: 16px 24px; max-width: 1200px; margin: 0 auto;
}
.b2b-header__logo {
    font-family: var(--cj-font-mono); font-size: 18px; font-weight: 700;
    color: var(--cj-green); text-decoration: none; letter-spacing: -0.5px;
}
/* New styled badge with live dot */
.b2b-header__badge {
    font-family: var(--cj-font-mono); font-size: 11px; font-weight: 700;
    letter-spacing: 0.1em; color: var(--cj-green); text-transform: uppercase;
    border: 1px solid var(--cj-green-dim); padding: 5px 12px;
    background: var(--cj-green-glow);
    display: flex; align-items: center; gap: 8px;
}
.b2b-header__badge-dot {
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--cj-green);
    animation: pulse-dot 2s ease-in-out infinite;
    flex-shrink: 0;
}
.b2b-btn--header {
    font-size: 13px; padding: 10px 20px;
}

/* ============================================
   HERO
   ============================================ */
.b2b-hero { padding: 160px 0 80px; position: relative; overflow: hidden; }
.b2b-hero::before {
    content: ''; position: absolute; inset: 0;
    background-image: linear-gradient(var(--cj-border) 1px, transparent 1px),
                      linear-gradient(90deg, var(--cj-border) 1px, transparent 1px);
    background-size: 48px 48px; opacity: 0.4; z-index: 0;
    width: 100%;
}
.b2b-hero::after {
    content: ''; position: absolute; top: -100px; left: 50%;
    transform: translateX(-50%); width: 600px; max-width: 100vw; height: 400px;
    background: radial-gradient(ellipse, var(--cj-green-glow) 0%, transparent 70%);
    z-index: 0;
}
.b2b-hero__inner { position: relative; z-index: 1; max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.b2b-hero__tag {
    display: inline-block; font-family: var(--cj-font-mono); font-size: 11px; font-weight: 700;
    letter-spacing: 0.15em; text-transform: uppercase; color: var(--cj-yellow);
    border: 1px solid rgba(245, 158, 11, 0.3); padding: 6px 14px; margin-bottom: 24px;
    background: var(--cj-yellow-glow);
    white-space: normal;
    word-break: break-word;
    max-width: 100%;
}
.b2b-hero__headline {
    font-size: clamp(40px, 6vw, 72px); font-weight: 700; line-height: 1.05;
    letter-spacing: -2px; margin: 0 0 24px; color: var(--cj-text-primary);
}
.b2b-hero__headline em { color: var(--cj-green); font-style: normal; }
.b2b-hero__sub { font-size: 18px; color: var(--cj-text-secondary); max-width: 640px; margin: 0 0 40px; line-height: 1.7; }
.b2b-hero__cta-group { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; margin-bottom: 20px; }

/* Trust bar */
.b2b-hero__trust-bar { margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--cj-border); display: flex; gap: 40px; flex-wrap: wrap; }
.b2b-hero__trust-item { display: flex; flex-direction: column; gap: 4px; }
.b2b-hero__trust-number { font-family: var(--cj-font-mono); font-size: 28px; font-weight: 700; color: var(--cj-green); line-height: 1; }
.b2b-hero__trust-label { font-size: 13px; color: var(--cj-text-muted); text-transform: uppercase; letter-spacing: 0.05em; }

/* ============================================
   FOMO COUNTER
   ============================================ */
.b2b-fomo {
    display: inline-flex; align-items: center; gap: 10px;
    font-family: var(--cj-font-mono); font-size: 13px;
    color: var(--cj-text-secondary);
    background: rgba(16, 185, 129, 0.06);
    border: 1px solid rgba(16, 185, 129, 0.2);
    padding: 8px 16px;
    margin-top: 4px;
    letter-spacing: 0.02em;
}
.b2b-fomo strong {
    color: var(--cj-green-bright);
    font-weight: 700;
}
/* Pulsing dot for FOMO */
.b2b-fomo__dot {
    width: 8px; height: 8px; border-radius: 50%;
    background: var(--cj-green);
    flex-shrink: 0;
    animation: pulse-dot 1.8s ease-in-out infinite;
}
@keyframes pulse-dot {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%       { opacity: 0.4; transform: scale(0.7); }
}

/* ============================================
   BUTTONS — BASE
   ============================================ */
.b2b-btn {
    display: inline-block; font-family: var(--cj-font-main); font-size: 15px; font-weight: 700;
    padding: 14px 28px; text-decoration: none; cursor: pointer;
    transition: transform 120ms ease, box-shadow 120ms ease, background 120ms ease;
    border: none; letter-spacing: 0.05em;
    position: relative; overflow: hidden;
}
.b2b-btn:focus-visible { outline: 2px solid var(--cj-green); outline-offset: 2px; }
.b2b-btn--lg { font-size: 17px; padding: 18px 36px; }

/* ── TIER 1: Emerald "Safe Key" — Tactile Green ── */
.b2b-btn--tier1 {
    background: linear-gradient(to bottom, #10b981, #059669);
    color: #022c22;
    border: 1.5px solid #34d399;
    box-shadow:
        0 0 20px rgba(16, 185, 129, 0.4),
        4px 4px 0px #022c22;
    letter-spacing: 0.5px;
}
.b2b-btn--tier1:hover {
    transform: translate(2px, 2px);
    box-shadow:
        0 0 12px rgba(16, 185, 129, 0.3),
        2px 2px 0px #022c22;
    text-decoration: none; color: #022c22;
}
.b2b-btn--tier1:active {
    transform: translate(4px, 4px);
    box-shadow: 0 0 6px rgba(16, 185, 129, 0.2), 0px 0px 0px #022c22;
}

/* ── TIER 2: AI-Booster "VIP Pass" — Gold Glassmorphism ── */
.b2b-btn--tier2 {
    background: #111827;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    color: #F59E0B;
    border: 1px solid #F59E0B;
    box-shadow: inset 0 0 10px rgba(245, 158, 11, 0.1);
    width: 100%;
    letter-spacing: 0.05em;
}
.b2b-btn--tier2:hover {
    color: #ffffff;
    border-color: #FBBF24;
    box-shadow:
        inset 0 0 10px rgba(245, 158, 11, 0.1),
        0 0 0 2px rgba(245, 158, 11, 0.5);
    animation: pulse-border-gold 1s ease infinite;
    text-decoration: none;
}
@keyframes pulse-border-gold {
    0%, 100% { box-shadow: inset 0 0 10px rgba(245, 158, 11, 0.1), 0 0 0 2px rgba(245, 158, 11, 0.5); }
    50%       { box-shadow: inset 0 0 10px rgba(245, 158, 11, 0.2), 0 0 0 4px rgba(245, 158, 11, 0.25); }
}

/* Tier 2 wrapper for floating badge */
.b2b-btn-tier2-wrap {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    width: 100%;
}
.b2b-btn-tier2-badge {
    position: relative;
    z-index: 2;
    display: inline-block;
    font-family: var(--cj-font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #F59E0B;
    background: #000000;
    border: 1px solid #F59E0B;
    padding: 4px 12px;
    margin-bottom: -1px; /* overlap onto button top edge */
    align-self: center;
    white-space: nowrap;
}

/* ── TIER 3: Signature Partner "Elite Monolith" — Chrome Black ── */
.b2b-btn--tier3 {
    background: linear-gradient(45deg, rgba(255,255,255,0.05) 0%, #000000 40%, #000000 60%, rgba(255,255,255,0.03) 100%);
    color: #D1D5DB;
    border: 1px solid #4B5563;
    box-shadow: none;
    width: 100%;
    letter-spacing: 0.05em;
    overflow: hidden;
}
.b2b-btn--tier3::after {
    content: '';
    position: absolute;
    top: 0; left: -100%;
    width: 60%; height: 100%;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255, 255, 255, 0.12) 50%,
        transparent 100%
    );
    transform: skewX(-20deg);
    transition: none;
}
.b2b-btn--tier3:hover::after {
    animation: shimmer 600ms ease forwards;
}
.b2b-btn--tier3:hover {
    color: #F9FAFB;
    border-color: #6B7280;
    text-decoration: none;
}
@keyframes shimmer {
    0%   { left: -100%; }
    100% { left: 150%; }
}

/* Micro-copy under Tier 1 button */
.b2b-pricing__microcopy {
    font-size: 11px;
    color: #9ca3af;
    margin: 10px 0 0;
    text-align: center;
    letter-spacing: 0.02em;
}

/* Old outline button (legacy support) */
.b2b-btn--primary { background: var(--cj-green); color: #0A0E1A; box-shadow: var(--cj-shadow); }
.b2b-btn--primary:hover { transform: translate(-2px, -2px); box-shadow: 5px 5px 0px #10B981; color: #0A0E1A; text-decoration: none; }
.b2b-btn--primary:active { transform: translate(1px, 1px); box-shadow: 1px 1px 0px #10B981; }
.b2b-btn--outline { background: transparent; color: var(--cj-text-primary); border: 2px solid var(--cj-border-strong); }
.b2b-btn--outline:hover { border-color: var(--cj-green); color: var(--cj-green); text-decoration: none; }

/* ============================================
   PROBLEM / SOLUTION
   ============================================ */
.b2b-problem { background: var(--cj-bg-surface); }

/* Status marker — elite club notice */
.b2b-problem__status-marker {
    display: inline-flex; align-items: center; gap: 10px;
    background: var(--cj-yellow-glow);
    border: 1px solid rgba(245, 158, 11, 0.3);
    padding: 10px 18px;
    font-family: var(--cj-font-mono); font-size: 12px; font-weight: 700;
    letter-spacing: 0.1em; text-transform: uppercase; color: var(--cj-yellow);
    margin-bottom: 32px;
}
.b2b-problem__status-icon {
    font-size: 14px;
}

.b2b-problem__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: var(--cj-border); }
.b2b-problem__cell { background: var(--cj-bg-card); padding: 40px; }
.b2b-problem__cell--pain { border-left: 3px solid var(--cj-red); }
.b2b-problem__cell--solution { border-left: 3px solid var(--cj-green); }
.b2b-problem__cell-label { font-family: var(--cj-font-mono); font-size: 11px; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; margin-bottom: 20px; }
.b2b-problem__cell--pain .b2b-problem__cell-label { color: var(--cj-red); }
.b2b-problem__cell--solution .b2b-problem__cell-label { color: var(--cj-green); }
.b2b-problem__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 16px; }
.b2b-problem__list li { font-size: 15px; color: var(--cj-text-secondary); padding-left: 24px; position: relative; line-height: 1.5; }
.b2b-problem__cell--pain .b2b-problem__list li::before { content: '\2717'; position: absolute; left: 0; color: var(--cj-red); font-weight: 700; }
.b2b-problem__cell--solution .b2b-problem__list li::before { content: '\2713'; position: absolute; left: 0; color: var(--cj-green); font-weight: 700; }
.b2b-problem__ssot { font-size: 13px; color: var(--cj-text-muted); margin-top: 24px; }

/* ============================================
   SECTION HEADING
   ============================================ */
.b2b-section-heading { margin-bottom: 48px; }
.b2b-section-heading__tag { display: inline-block; font-family: var(--cj-font-mono); font-size: 11px; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: var(--cj-green); margin-bottom: 16px; }
.b2b-section-heading__tag::before { content: '// '; }
.b2b-section-heading__title { font-size: clamp(28px, 4vw, 44px); font-weight: 700; line-height: 1.1; letter-spacing: -1px; margin: 0 0 16px; }
.b2b-section-heading__sub { font-size: 17px; color: var(--cj-text-secondary); max-width: 560px; margin: 0; }

/* ============================================
   SCORE ENGINE
   ============================================ */
.b2b-score { background: var(--cj-bg-base); }
.b2b-score__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; background: var(--cj-border); }
.b2b-score__block { background: var(--cj-bg-card); padding: 32px; border-top: 3px solid transparent; transition: border-color var(--cj-transition); }
.b2b-score__block:hover { border-top-color: var(--cj-green); }
.b2b-score__block-number { font-family: var(--cj-font-mono); font-size: 40px; font-weight: 700; color: var(--cj-green-dim); line-height: 1; margin-bottom: 16px; }
.b2b-score__block-title { font-size: 17px; font-weight: 700; margin: 0 0 8px; color: var(--cj-text-primary); }
.b2b-score__block-text { font-size: 14px; color: var(--cj-text-secondary); line-height: 1.6; margin: 0; }
.b2b-score__block--featured { border-top-color: var(--cj-green); position: relative; }
.b2b-score__block--featured::after { content: 'CORE ENGINE'; position: absolute; top: 12px; right: 12px; font-family: var(--cj-font-mono); font-size: 9px; font-weight: 700; letter-spacing: 0.1em; color: var(--cj-green); border: 1px solid var(--cj-green-dim); padding: 3px 8px; }

/* ============================================
   PRICING GRID — GRANDFATHER + TACTILE
   ============================================ */
.b2b-pricing { background: var(--cj-bg-surface); }
.b2b-pricing__grid {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px;
    background: var(--cj-border); margin-bottom: 32px;
    width: 100%; max-width: 100%; box-sizing: border-box;
}
.b2b-pricing__card {
    background: var(--cj-bg-card);
    padding: 40px 32px;
    display: flex;
    flex-direction: column;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

/* Featured card (Tier 1) */
.b2b-pricing__card--featured {
    background: #0D2218;
    border: 2px solid var(--cj-green);
    position: relative; z-index: 1;
}
.b2b-pricing__card--featured::before {
    content: 'MOST POPULAR';
    position: absolute; top: -12px; left: 50%; transform: translateX(-50%);
    font-family: var(--cj-font-mono); font-size: 10px; font-weight: 700;
    letter-spacing: 0.12em; color: #0A0E1A; background: var(--cj-green);
    padding: 4px 16px; white-space: nowrap;
}

/* Elite card (Tier 3) */
.b2b-pricing__card--elite {
    background: #080B12;
}

.b2b-pricing__tier-name { font-family: var(--cj-font-mono); font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--cj-text-muted); margin-bottom: 12px; }

/* Price Row Container with Flex Alignment */
.b2b-pricing__price-row,
.pricing-card__price-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 6px;
}

.b2b-pricing__price { font-family: var(--cj-font-mono); font-size: 44px; font-weight: 700; color: var(--cj-text-primary); line-height: 1; margin-bottom: 0; }
.b2b-pricing__price sub { font-size: 18px; font-weight: 400; vertical-align: baseline; color: var(--cj-text-secondary); }
.b2b-pricing__price-note { font-size: 13px; color: var(--cj-text-muted); margin-bottom: 24px; }

/* ================================================================
   TASK-P2-B2B-PAGE-V4-BADGES: MODULAR VENUE BADGES (VALUE BRIDGE)
   Modular CSS Component Architecture for B2B Tariffs & B2C Cards
   ================================================================ */

.venue-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 6px;
    font-family: var(--cj-font-mono, 'JetBrains Mono', monospace);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    height: fit-content;
    line-height: 1;
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    user-select: none;
    transition: transform var(--cj-transition, 200ms ease), box-shadow var(--cj-transition, 200ms ease), border-color var(--cj-transition, 200ms ease);
    cursor: default;
}

.venue-badge:hover {
    transform: translateY(-1px);
}

.venue-badge .badge-icon {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    transition: transform 200ms ease;
}

.venue-badge:hover .badge-icon {
    transform: scale(1.1);
}

/* 3.1. Tier 1: Emerald Badge (Sales Engine / Trust Seal) */
.venue-badge--emerald {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.18) 0%, rgba(5, 150, 105, 0.08) 100%);
    color: #10B981;
    border: 1px solid rgba(16, 185, 129, 0.45);
    box-shadow: 0 0 14px rgba(16, 185, 129, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.15);
}

.venue-badge--emerald:hover {
    border-color: #10B981;
    box-shadow: 0 0 20px rgba(16, 185, 129, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.venue-badge--emerald::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #10B981;
    box-shadow: 0 0 8px #10B981;
    animation: emeraldPulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
    flex-shrink: 0;
}

@keyframes emeraldPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.35; transform: scale(0.8); }
}

/* 3.2. Tier 2: AI-Booster Badge (VIP Pass / Exclusive Priority) */
.venue-badge--ai-booster,
.venue-badge--priority {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.18) 0%, rgba(217, 119, 6, 0.08) 100%);
    color: #F59E0B;
    border: 1px solid rgba(245, 158, 11, 0.5);
    box-shadow: 0 0 16px rgba(245, 158, 11, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.15);
}

.venue-badge--ai-booster:hover,
.venue-badge--priority:hover {
    border-color: #F59E0B;
    box-shadow: 0 0 22px rgba(245, 158, 11, 0.48), inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

/* 3.3. Tier 3: Signature Badge (Elite Monolith / Ultra-Luxury Metal) */
.venue-badge--signature,
.venue-badge--elite {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.12) 0%, #0A0D14 50%, #05070B 100%);
    color: #E5E7EB;
    border: 1px solid #4B5563;
    box-shadow: 0 0 16px rgba(0, 0, 0, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.venue-badge--signature:hover,
.venue-badge--elite:hover {
    border-color: #9CA3AF;
    box-shadow: 0 0 22px rgba(209, 213, 219, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.venue-badge--signature,
.venue-badge--elite {
    overflow: hidden !important;
}

/* Shimmer ray animation for Signature badge */
.venue-badge--signature .venue-badge__shimmer,
.venue-badge--elite .venue-badge__shimmer {
    position: absolute;
    top: 0;
    left: -100%;
    width: 60%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.35), transparent);
    transform: skewX(-20deg);
    animation: badgeShimmer 4s infinite ease-in-out;
    pointer-events: none;
}

@keyframes badgeShimmer {
    0% { left: -100%; }
    25%, 100% { left: 200%; }
}

/* Value Bridge Callout (Connecting B2B price with 100x high-value B2C visibility) */
.venue-badge__value-bridge {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: var(--cj-text-secondary);
    background: rgba(255, 255, 255, 0.03);
    border: 1px dashed var(--cj-border);
    padding: 6px 10px;
    border-radius: 4px;
    margin-bottom: 16px;
    line-height: 1.35;
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
}
.venue-badge__value-bridge span {
    min-width: 0;
    overflow-wrap: break-word;
}

.venue-badge__value-bridge strong {
    color: var(--cj-text-primary);
}

.b2b-pricing__card--featured .venue-badge__value-bridge {
    background: rgba(16, 185, 129, 0.06);
    border-color: rgba(16, 185, 129, 0.28);
}

.value-bridge__icon {
    color: var(--cj-green);
    font-size: 11px;
    flex-shrink: 0;
}

.b2b-pricing__card:not(.b2b-pricing__card--featured) .value-bridge__icon {
    color: var(--cj-yellow);
}

.b2b-pricing__card--elite .value-bridge__icon {
    color: #E5E7EB;
}

/* Mobile-first wrap behavior */
@media (max-width: 440px) {
    .b2b-pricing__price-row,
    .pricing-card__price-row {
        flex-wrap: wrap;
    }
    .venue-badge {
        margin-top: 4px;
    }
}
.b2b-pricing__divider { height: 1px; background: var(--cj-border); margin-bottom: 24px; }
.b2b-pricing__feature-list { list-style: none; padding: 0; margin: 0 0 auto; display: flex; flex-direction: column; gap: 12px; }
.b2b-pricing__feature-list li { font-size: 14px; color: var(--cj-text-secondary); padding-left: 22px; position: relative; line-height: 1.4; }
.b2b-pricing__feature-list li::before { content: '\2192'; position: absolute; left: 0; color: var(--cj-green); font-size: 12px; }
.b2b-pricing__card--featured .b2b-pricing__feature-list li { color: var(--cj-text-primary); }
.b2b-pricing__cta { margin-top: 32px; width: 100%; text-align: center; }

/* Grandfather pricing — anchor price (crossed-out) */
.b2b-pricing__anchor {
    font-size: 24px; color: var(--cj-text-muted);
    vertical-align: top; margin-right: 6px;
    text-decoration: none; /* <s> handles the strikethrough */
}
.b2b-pricing__anchor s {
    color: var(--cj-text-muted);
}

/* Muted / waitlist cards */
.b2b-pricing__card--muted { background: var(--cj-bg-base); border: 1px solid var(--cj-border-strong); opacity: 0.9; transition: opacity var(--cj-transition); }
.b2b-pricing__card--muted:hover { opacity: 1; }
.b2b-pricing__badge-soon { font-family: var(--cj-font-mono); font-size: 10px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--cj-green); background: rgba(16, 185, 129, 0.1); border: 1px solid var(--cj-green-dim); padding: 4px 12px; margin-bottom: 16px; align-self: flex-start; }
.b2b-btn--waitlist { border-style: dashed; }

/* ============================================
   B2B MONOLITH GATED BUTTONS (TASK-P2-B2B-GATED-PRICING-01)
   ============================================ */
.b2b-gated-btn-wrap {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    box-sizing: border-box;
}

.b2b-btn--monolith {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    background: #0A0E1A;
    padding: 14px 16px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--cj-font-mono, 'JetBrains Mono', monospace);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    cursor: pointer;
    transition: all 200ms ease;
    user-select: none;
    text-decoration: none;
    position: relative;
    box-sizing: border-box;
}

.b2b-btn--monolith .b2b-btn__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    gap: 10px;
    box-sizing: border-box;
}

.b2b-btn--monolith .b2b-btn__text {
    flex: 1;
    min-width: 0;
    text-align: center;
    white-space: nowrap;
}

/* Tier 2: Amber Monolith (Dark background, Amber outline, Cube on Right) */
.b2b-btn--monolith-amber {
    border: 1.5px solid #D97706;
    color: #F59E0B;
    box-shadow: 0 0 12px rgba(245, 158, 11, 0.15), inset 0 0 10px rgba(10, 14, 26, 0.9);
}

.b2b-btn--monolith-amber:hover {
    border-color: #F59E0B;
    color: #FBBF24;
    box-shadow: 0 0 18px rgba(245, 158, 11, 0.35), inset 0 0 12px rgba(245, 158, 11, 0.1);
    transform: translateY(-1px);
}

/* Tier 3: Emerald Monolith (Dark background, Emerald outline, Cube on Left) */
.b2b-btn--monolith-emerald {
    border: 1.5px solid #059669;
    color: #10B981;
    box-shadow: 0 0 12px rgba(16, 185, 129, 0.15), inset 0 0 10px rgba(10, 14, 26, 0.9);
}

.b2b-btn--monolith-emerald:hover {
    border-color: #10B981;
    color: #34D399;
    box-shadow: 0 0 18px rgba(16, 185, 129, 0.35), inset 0 0 12px rgba(16, 185, 129, 0.1);
    transform: translateY(-1px);
}

/* 3D Laser-Cube Component */
.b2b-btn__cube {
    width: 28px;
    height: 28px;
    position: relative;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.b2b-btn__cube::before {
    content: '';
    position: absolute;
    width: 18px;
    height: 18px;
    background: #111827;
    border: 1px solid #374151;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.9);
    transform: rotate(45deg);
    border-radius: 2px;
}

.b2b-btn__cube::after {
    content: '';
    position: absolute;
    top: -2px;
    bottom: -2px;
    left: 50%;
    width: 2px;
    background: #00FF88;
    box-shadow: 0 0 8px #00FF88, 0 0 14px rgba(0, 255, 136, 0.7);
    transform: translateX(-50%);
    z-index: 2;
}

/* Unlocked State (Activated ONLY when server confirms eligible === true) */
.b2b-btn--unlocked {
    background: linear-gradient(90deg, #10B981 0%, #059669 100%) !important;
    border: 1.5px solid #34D399 !important;
    color: #0A0E1A !important;
    box-shadow: 0 0 24px rgba(16, 185, 129, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.4) !important;
}

.b2b-btn--unlocked .b2b-btn__text {
    font-weight: 800;
    color: #062218;
}

.b2b-btn--unlocked .b2b-btn__cube::after {
    background: #062218;
    box-shadow: 0 0 6px rgba(6, 34, 24, 0.5);
}

/* Needs-Audit State (Server returns status: NEEDS_AUDIT) */
.b2b-btn--needs-audit {
    background: rgba(245, 158, 11, 0.12) !important;
    border: 1.5px solid #F59E0B !important;
    color: #F59E0B !important;
    box-shadow: 0 0 16px rgba(245, 158, 11, 0.3) !important;
}

/* VAT Note & Condition Notes */
.b2b-pricing__vat-note {
    font-family: var(--cj-font-mono, monospace);
    font-size: 11px;
    font-weight: 600;
    color: var(--cj-green);
    margin: 4px 0 16px;
    line-height: 1.4;
}

.b2b-pricing__vat-note--small {
    font-size: 10px;
    margin: 2px 0 8px;
}

.b2b-pricing__descriptor {
    font-family: var(--cj-font-mono, monospace);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--cj-green);
    margin-bottom: 8px;
    display: inline-block;
}

.b2b-pricing__condition-note {
    font-family: var(--cj-font-mono, monospace);
    font-size: 11px;
    color: var(--cj-text-muted);
    margin: 8px 0 0;
    line-height: 1.35;
    text-align: center;
}

/* ============================================
   POWER-UP ADD-ONS
   ============================================ */
.b2b-pricing__addons { border: 1px solid var(--cj-border-strong); padding: 32px; background: var(--cj-bg-card); }
.b2b-pricing__addons-title { font-family: var(--cj-font-mono); font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--cj-text-muted); margin-bottom: 24px; }
.b2b-pricing__addons-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.b2b-pricing__addon { border: 2px solid var(--cj-border-strong); padding: 20px; display: flex; flex-direction: column; gap: 8px; background: var(--cj-bg-surface); transition: transform var(--cj-transition), box-shadow var(--cj-transition), border-color var(--cj-transition); position: relative; user-select: none; }
.b2b-pricing__addon:hover { transform: translateY(-3px); box-shadow: 6px 6px 0px var(--cj-border-strong); border-color: var(--cj-text-muted); }
.b2b-pricing__addon--featured { border-color: var(--cj-green-dim); }
.b2b-pricing__addon--featured:hover { border-color: var(--cj-green); }
.b2b-pricing__addon-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.b2b-pricing__addon-name { font-size: 15px; font-weight: 700; color: var(--cj-text-primary); line-height: 1.3; }
.b2b-pricing__addon-price { font-family: var(--cj-font-mono); font-size: 14px; color: var(--cj-green); white-space: nowrap; }
.b2b-pricing__addon-desc { font-size: 13px; color: var(--cj-text-secondary); line-height: 1.5; margin: 0; }
.b2b-badge-small { display: inline-block; font-family: var(--cj-font-mono); font-size: 10px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--cj-yellow); border: 1px solid var(--cj-yellow); padding: 2px 6px; border-radius: 2px; margin-bottom: 4px; width: max-content; }
.b2b-badge-small--dev { color: #60A5FA; border-color: #3B82F6; background: rgba(59, 130, 246, 0.1); }
.b2b-pricing__addon-eligibility { font-size: 11px; font-weight: 600; color: var(--cj-yellow); margin: 0 0 4px; }
.b2b-pricing__addon-features { list-style: none; padding: 0; margin: 6px 0 10px; display: flex; flex-direction: column; gap: 6px; }
.b2b-pricing__addon-features li { font-size: 12px; color: var(--cj-text-secondary); padding-left: 16px; position: relative; line-height: 1.4; }
.b2b-pricing__addon-features li::before { content: '•'; position: absolute; left: 0; color: var(--cj-green); }
.b2b-btn--addon-waitlist { width: 100%; padding: 10px 12px; font-family: var(--cj-font-mono, monospace); font-size: 12px; font-weight: 700; background: transparent; border: 1px dashed var(--cj-border-bright); color: var(--cj-text-primary); cursor: pointer; transition: all var(--cj-transition); margin-top: auto; }
.b2b-btn--addon-waitlist:hover { background: var(--cj-green-glow); border-color: var(--cj-green); color: var(--cj-green); }
.b2b-pricing__disclaimer-note { font-family: var(--cj-font-mono, monospace); font-size: 10px; color: var(--cj-text-muted); margin: 6px 0 0; text-align: center; }

/* Eligibility Modal & Results */
.b2b-modal--high-tech { border-color: var(--cj-green); box-shadow: 0 0 30px rgba(16, 185, 129, 0.25); }
.b2b-eligibility-result { padding: 16px; border-radius: 4px; border: 1px solid var(--cj-border); background: var(--cj-bg-surface); font-family: var(--cj-font-mono, monospace); font-size: 13px; line-height: 1.5; }
.b2b-eligibility-result--eligible { border-color: var(--cj-green); background: rgba(16, 185, 129, 0.08); color: var(--cj-green-bright); }
.b2b-eligibility-result--needs-audit { border-color: var(--cj-yellow); background: rgba(245, 158, 11, 0.08); color: var(--cj-yellow); }
.b2b-eligibility-result--not-eligible { border-color: var(--cj-red); background: rgba(239, 68, 68, 0.08); color: #FCA5A5; }

/* ============================================
   TRUST
   ============================================ */
.b2b-trust { background: var(--cj-bg-base); }
.b2b-trust__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; background: var(--cj-border); }
.b2b-trust__item { background: var(--cj-bg-card); padding: 28px 24px; text-align: center; }
.b2b-trust__item-icon { font-size: 28px; margin-bottom: 12px; display: block; }
.b2b-trust__item-title { font-size: 14px; font-weight: 700; color: var(--cj-text-primary); margin-bottom: 6px; }
.b2b-trust__item-text { font-size: 12px; color: var(--cj-text-muted); line-height: 1.5; }

/* ============================================
   FAQ ACCORDION
   ============================================ */
.b2b-faq { background: var(--cj-bg-surface); }
.b2b-faq__accordion { max-width: 800px; margin: 0 auto; display: flex; flex-direction: column; gap: 16px; }
.b2b-faq__item { background: var(--cj-bg-card); border: 1px solid var(--cj-border-strong); padding: 20px 24px; }
.b2b-faq__question { font-size: 16px; font-weight: 700; color: var(--cj-text-primary); cursor: pointer; list-style: none; position: relative; padding-right: 24px; }
.b2b-faq__question::-webkit-details-marker { display: none; }
.b2b-faq__question::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    width: 20px;
    height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2300F298'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 4v16m8-8H4'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    transition: transform 0.3s ease-out;
}
.b2b-faq__item[open] .b2b-faq__question::after {
    transform: translateY(-50%) rotate(135deg); /* turns '+' into 'x' */
}
.b2b-faq__answer {
    font-size: 15px; color: var(--cj-text-secondary); line-height: 1.6;
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    margin-top: 0;
    padding-top: 0;
    border-top: 1px dashed transparent;
    transition: max-height 0.3s ease-out, opacity 0.3s ease-out, margin-top 0.3s ease-out, padding-top 0.3s ease-out, border-color 0.3s ease-out;
}
.b2b-faq__item[open] .b2b-faq__answer {
    max-height: 800px; /* arbitrary large value */
    opacity: 1;
    margin-top: 16px;
    padding-top: 16px;
    border-top-color: var(--cj-border);
}

/* ============================================
   FINAL CTA
   ============================================ */
.b2b-final-cta { background: var(--cj-bg-surface); border-top: 1px solid var(--cj-border-bright); text-align: center; }
.b2b-final-cta__headline { font-size: clamp(28px, 4vw, 48px); font-weight: 700; letter-spacing: -1px; margin-bottom: 16px; }
.b2b-final-cta__sub { font-size: 17px; color: var(--cj-text-secondary); margin-bottom: 40px; }

/* ============================================
   MODAL
   ============================================ */
.b2b-modal-backdrop { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.85); z-index: 1000; align-items: center; justify-content: center; padding: 16px; backdrop-filter: blur(4px); }
.b2b-modal-backdrop.is-open { display: flex; animation: fadeIn 200ms ease; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.b2b-modal { background: var(--cj-bg-card); border: 2px solid var(--cj-border-bright); box-shadow: 6px 6px 0px var(--cj-green); width: 100%; max-width: 560px; max-height: 90vh; overflow-y: auto; position: relative; animation: slideUp 250ms ease; }
@keyframes slideUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
.b2b-modal__header { padding: 28px 32px 20px; border-bottom: 1px solid var(--cj-border); position: relative; }
.b2b-modal__tag { font-family: var(--cj-font-mono); font-size: 10px; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: var(--cj-green); display: block; margin-bottom: 8px; }
.b2b-modal__title { font-size: 22px; font-weight: 700; margin: 0; color: var(--cj-text-primary); }
.b2b-modal__close { position: absolute; top: 20px; right: 24px; background: none; border: 1px solid var(--cj-border-strong); color: var(--cj-text-secondary); width: 36px; height: 36px; cursor: pointer; font-size: 18px; display: flex; align-items: center; justify-content: center; transition: border-color var(--cj-transition), color var(--cj-transition); }
.b2b-modal__close:hover { border-color: var(--cj-red); color: var(--cj-red); }
.b2b-modal__body { padding: 28px 32px; }

/* ============================================
   FORM
   ============================================ */
.b2b-form { display: flex; flex-direction: column; gap: 20px; }
.b2b-form__group { display: flex; flex-direction: column; gap: 8px; }
.b2b-form__label { font-size: 13px; font-weight: 700; color: var(--cj-text-secondary); text-transform: uppercase; letter-spacing: 0.05em; }
.b2b-form__label span.req { color: var(--cj-green); }
.b2b-form__input, .b2b-form__select { background: var(--cj-bg-surface); border: 1px solid var(--cj-border-strong); color: var(--cj-text-primary); padding: 12px 16px; font-size: 15px; font-family: var(--cj-font-main); width: 100%; transition: border-color var(--cj-transition); appearance: none; -webkit-appearance: none; }
.b2b-form__input:focus, .b2b-form__select:focus { outline: none; border-color: var(--cj-green); box-shadow: 0 0 0 2px var(--cj-green-glow); }
.b2b-form__input::placeholder { color: var(--cj-text-muted); }
.b2b-form__input--error { border-color: var(--cj-red); }
.b2b-form__error-msg { font-size: 12px; color: var(--cj-red); display: none; }
.b2b-form__error-msg.is-visible { display: block; }
.b2b-form__honeypot { position: absolute; left: -9999px; opacity: 0; pointer-events: none; height: 0; overflow: hidden; }
.b2b-form__consent-block { background: var(--cj-bg-surface); border: 1px solid var(--cj-border); padding: 20px; display: flex; flex-direction: column; gap: 14px; }
.b2b-form__consent-block-title { font-family: var(--cj-font-mono); font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--cj-yellow); margin-bottom: 4px; }
.b2b-form__checkbox-row { display: flex; align-items: flex-start; gap: 12px; }
.b2b-form__checkbox-row input[type="checkbox"] { flex-shrink: 0; width: 18px; height: 18px; margin-top: 2px; accent-color: var(--cj-green); cursor: pointer; }
.b2b-form__checkbox-label { font-size: 13px; color: var(--cj-text-secondary); line-height: 1.5; cursor: pointer; }
.b2b-form__checkbox-label a { color: var(--cj-green); text-decoration: underline; }
.b2b-form__submit-wrap { margin-top: 8px; }
.b2b-btn--submit { width: 100%; text-align: center; justify-content: center; position: relative; }
.b2b-btn--submit[disabled] { opacity: 0.5; cursor: not-allowed; pointer-events: none; }
.b2b-form__result { display: none; padding: 20px; text-align: center; }
.b2b-form__result.is-visible { display: block; }
.b2b-form__result--success { border: 1px solid var(--cj-green); background: var(--cj-green-glow); color: var(--cj-green-bright); }
.b2b-form__result--error { border: 1px solid var(--cj-red); background: rgba(239,68,68,0.1); color: var(--cj-red); }
.b2b-form__result-icon { font-size: 32px; display: block; margin-bottom: 12px; }
.b2b-form__result-title { font-size: 18px; font-weight: 700; margin-bottom: 8px; }
.b2b-form__result-text { font-size: 14px; opacity: 0.85; }
.b2b-spinner { display: none; width: 20px; height: 20px; border: 2px solid rgba(2,44,34,0.3); border-top-color: #022c22; border-radius: 50%; animation: spin 600ms linear infinite; margin: 0 auto; }
.b2b-btn--submit.is-loading .b2b-spinner { display: inline-block; }
.b2b-btn--submit.is-loading .b2b-btn__text { display: none; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ============================================
   CHANNEL SELECTOR
   ============================================ */
.b2b-channel-group { display: flex; gap: 10px; margin-top: 4px; }
.b2b-channel-btn { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 12px; background: var(--cj-bg-surface); border: 2px solid var(--cj-border-strong); cursor: pointer; transition: border-color var(--cj-transition), background var(--cj-transition); position: relative; user-select: none; font-size: 13px; font-weight: 600; color: var(--cj-text-primary); }
.b2b-channel-btn:hover { border-color: var(--cj-green); }
.b2b-channel-btn input[type="radio"] { position: absolute; opacity: 0; width: 0; height: 0; }
.b2b-channel-btn:has(input:checked) { border-color: var(--cj-green); background: var(--cj-green-glow); }
.b2b-channel-btn--line:has(input:checked) { border-color: #06C755; background: rgba(6, 199, 85, 0.16); color: #FFFFFF; }
.b2b-channel-btn__icon { font-size: 18px; line-height: 1; }
.b2b-channel-btn:focus-within { outline: 2px solid var(--cj-green); outline-offset: 2px; }

/* ============================================
   SCORE CAP ALERT
   ============================================ */
.b2b-score__cap-alert { background: rgba(239, 68, 68, 0.1); border-left: 3px solid var(--cj-red); padding: 12px 16px; font-size: 13px; color: var(--cj-text-secondary); margin-top: 24px; max-width: 600px; }
.b2b-score__cap-alert strong { color: var(--cj-red); }

/* ============================================
   FOOTER
   ============================================ */
.b2b-footer { padding: 40px 0; border-top: 1px solid var(--cj-border); background: var(--cj-bg-base); }
.b2b-footer__inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; }
.b2b-footer__copyright { font-size: 13px; color: var(--cj-text-muted); }
.b2b-footer__links { display: flex; gap: 24px; }
.b2b-footer__links a { font-size: 13px; color: var(--cj-text-muted); text-decoration: none; }
.b2b-footer__links a:hover { color: var(--cj-green); }

/* ============================================
   STICKY CTA — Mobile only
   ============================================ */
.b2b-sticky-cta {
    display: none; /* hidden on desktop */
    position: fixed;
    bottom: 0; left: 0; right: 0;
    z-index: 50;
    padding: 12px 16px;
    background: rgba(10, 14, 26, 0.92);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-top: 1px solid var(--cj-border);
}
.b2b-sticky-cta__btn {
    width: 100%;
    text-align: center;
    font-size: 16px;
    padding: 16px 24px;
}
/* Show sticky CTA only on mobile */
@media (max-width: 768px) {
    .b2b-sticky-cta {
        display: block;
    }
    /* Add bottom padding to page so content isn't hidden behind sticky bar */
    .b2b-page {
        padding-bottom: 80px;
    }
}

/* ============================================
   GLOBAL THEME OVERRIDES (ISOLATION)
   ============================================ */
body.page-template-page-for-business {
    background-color: var(--cj-bg-base) !important;
}
body.page-template-page-for-business .site-header .site-nav,
body.page-template-page-for-business .site-header .main-navigation {
    display: none !important;
}
body.page-template-page-for-business #page,
body.page-template-page-for-business .site-content {
    background-color: transparent !important;
}
body.page-template-page-for-business .site-header {
    background: transparent !important;
    border-bottom: none !important;
    box-shadow: none !important;
}
body.page-template-page-for-business .site-footer {
    background-color: var(--cj-bg-surface) !important;
    border-top: 1px solid var(--cj-border) !important;
    color: var(--cj-text-secondary) !important;
}

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width: 900px) {
    .b2b-hero { padding: 120px 0 60px; }
    .b2b-problem__grid,
    .b2b-score__grid,
    .b2b-pricing__grid { grid-template-columns: minmax(0, 1fr); }
    .b2b-trust__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .b2b-pricing__addons-grid { grid-template-columns: minmax(0, 1fr); }
    /* Tier 1 card always first (it already is in HTML order) */
    .b2b-pricing__card--featured { order: -1; }

    /* Mobile CTA wrap & flexible monolith buttons */
    .b2b-btn--monolith {
        padding: 12px 14px;
    }
    .b2b-btn--monolith .b2b-btn__inner {
        gap: 8px;
    }
    .b2b-btn--monolith .b2b-btn__text {
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: break-word;
        line-height: 1.35;
    }
}
@media (max-width: 480px) {
    .b2b-channel-group { flex-direction: column; }
}
@media (max-width: 600px) {
    .b2b-container { padding: 0 16px; }
    .b2b-section { padding: 56px 0; }
    .b2b-hero__cta-group { flex-direction: column; width: 100%; }
    .b2b-btn--lg { width: 100%; text-align: center; }
    .b2b-modal__header, .b2b-modal__body { padding: 20px; }
    .b2b-footer__inner { flex-direction: column; text-align: center; }
    .b2b-hero__trust-bar { gap: 24px; }
    .b2b-fomo { font-size: 12px; }
    .b2b-header__badge { display: none; }
    .b2b-btn--header { padding: 8px 12px; font-size: 12px; }

    /* Tactical pricing adjustments for mobile viewports */
    .b2b-pricing__card {
        padding: 32px 16px;
    }
    .b2b-pricing__price-row,
    .pricing-card__price-row {
        gap: 8px;
    }
}
