/* public/assets/css/pricing.css — loaded only on the pricing page via @push('styles') */

.vn-wrap{ max-width:1180px; margin:0 auto; padding:0 24px; }

/* ---------- HERO ---------- */
.vn-hero{
    padding:80px 0 60px;
    border-bottom:2px solid var(--vn-accent);
    position:relative;
    overflow:hidden;
    background:radial-gradient(ellipse 900px 600px at 50% 15%, #0a0a0c 0%, #000000 70%);
}
.vn-orbit-rings{
    position:absolute; top:-120px; left:50%; transform:translateX(-50%);
    width:1700px; height:1300px; pointer-events:none; z-index:0;
}
.vn-orbit-rings circle{ fill:none; stroke:rgba(255,255,255,0.13); stroke-width:1; stroke-dasharray:5 7; }
.vn-hero .vn-wrap{ position:relative; z-index:2; }

.vn-eyebrow{
    font-family:var(--vn-font-mono); font-size:12px; letter-spacing:.15em;
    color:var(--vn-accent); text-transform:uppercase; margin-bottom:18px;
    display:flex; align-items:center; gap:10px;
}
.vn-eyebrow::before{
    content:''; width:6px; height:6px; background:var(--vn-accent);
    border-radius:50%; box-shadow:0 0 8px 2px rgba(232,38,47,.15);
}
.vn-hero-title{
    font-family:var(--vn-font-display); font-weight:700;
    font-size:clamp(34px, 5vw, 60px); line-height:1.03; letter-spacing:-.01em;
    max-width:780px; text-transform:uppercase; color:var(--vn-text);
}
.vn-hero-title em{ font-style:normal; color:var(--vn-dim); }
.vn-hero-sub{ margin-top:22px; max-width:540px; font-size:16px; color:var(--vn-muted); line-height:1.6; }

.vn-billing-note{ margin-top:34px; font-family:var(--vn-font-mono); font-size:12px; color:var(--vn-dim); }

/* ---------- PLANS ---------- */
.vn-plans{ padding:64px 0 36px; }
.vn-plans-grid{
    display:grid; grid-template-columns:repeat(3, 1fr); gap:1px;
    background:var(--vn-border); border:1px solid var(--vn-border);
}
.vn-plan{ background:var(--vn-card); padding:32px 28px 28px; display:flex; flex-direction:column; position:relative; }
.vn-plan.vn-featured{ background:#1a1a1e; }
.vn-plan.vn-featured::before{
    content:'RECOMMENDED'; position:absolute; top:0; left:0; right:0;
    background:var(--vn-accent); color:#fff; font-family:var(--vn-font-mono);
    font-size:10px; letter-spacing:.14em; text-align:center; padding:6px 0;
}
.vn-plan.vn-featured .vn-plan-inner{ margin-top:20px; }

.vn-plan-name{ font-family:var(--vn-font-display); font-weight:700; font-size:20px; text-transform:uppercase; letter-spacing:.03em; color:var(--vn-text); }
.vn-plan-for{ margin-top:8px; font-size:13px; color:var(--vn-muted); min-height:38px; }
.vn-plan-price{ margin-top:24px; display:flex; align-items:baseline; gap:8px; }
.vn-plan-price .vn-num{ font-family:var(--vn-font-display); font-weight:700; font-size:40px; color:var(--vn-text); }
.vn-plan-price .vn-cur{ font-family:var(--vn-font-display); font-weight:600; font-size:18px; color:var(--vn-muted); }
.vn-plan-price .vn-per{ font-family:var(--vn-font-mono); font-size:12px; color:var(--vn-dim); text-transform:uppercase; }

.vn-telemetry{ margin-top:24px; display:flex; flex-direction:column; gap:11px; }
.vn-tele-label{ display:flex; justify-content:space-between; font-family:var(--vn-font-mono); font-size:11px; color:var(--vn-muted); letter-spacing:.04em; margin-bottom:5px; }
.vn-tele-label b{ color:var(--vn-text); font-weight:500; }
.vn-tele-track{ height:3px; background:var(--vn-border); overflow:hidden; }
.vn-tele-fill{ height:100%; background:var(--vn-accent); }

.vn-plan-features{ margin-top:26px; list-style:none; padding:0; display:flex; flex-direction:column; gap:10px; flex-grow:1; }
.vn-plan-features li{ font-size:13.5px; color:var(--vn-muted); display:flex; gap:10px; }
.vn-plan-features li::before{ content:'—'; color:var(--vn-accent); flex-shrink:0; }
.vn-plan-features li b{ color:var(--vn-text); font-weight:500; }

.vn-plan-cta{
    margin-top:28px; display:block; text-align:center; padding:12px 0;
    background:#0c0c0e; border:1px solid var(--vn-accent); border-radius:4px;
    font-family:var(--vn-font-display); font-weight:600; font-size:13px;
    letter-spacing:.06em; text-transform:uppercase; color:var(--vn-text);
    transition:all .2s;
}
.vn-plan-cta:hover{ background:rgba(232,38,47,.10); border-color:var(--vn-accent-bright); color:#fff; }

.vn-plans-note{ margin-top:22px; font-family:var(--vn-font-mono); font-size:12px; color:var(--vn-dim); text-align:center; }

/* ---------- COMPARE ---------- */
.vn-compare{ padding:70px 0; border-top:1px solid var(--vn-border); }
.vn-section-title{ font-family:var(--vn-font-display); font-weight:700; font-size:24px; text-transform:uppercase; color:var(--vn-text); }
.vn-section-desc{ max-width:420px; font-size:14px; color:var(--vn-muted); }

.vn-spec-table{ width:100%; border-collapse:collapse; font-size:14px; margin-top:30px; }
.vn-spec-table th, .vn-spec-table td{ text-align:left; padding:14px 18px; border-bottom:1px solid var(--vn-border); }
.vn-spec-table thead th{ font-family:var(--vn-font-mono); font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--vn-dim); font-weight:400; }
.vn-spec-table thead th:not(:first-child){ font-family:var(--vn-font-display); font-size:14px; color:var(--vn-text); }
.vn-spec-table tbody th{ font-weight:500; color:var(--vn-muted); }
.vn-spec-table td{ color:var(--vn-text); }
.vn-spec-table .vn-check{ color:var(--vn-accent); font-weight:600; }
.vn-spec-table .vn-dash{ color:var(--vn-dim); }

/* ---------- FAQ ---------- */
.vn-faq{ padding:64px 0 90px; border-top:1px solid var(--vn-border); }
.vn-faq-grid{ display:grid; grid-template-columns:1fr 1fr; gap:28px 56px; margin-top:32px; }
.vn-faq-item h3{ font-family:var(--vn-font-display); font-size:15px; font-weight:600; text-transform:uppercase; color:var(--vn-text); margin-bottom:8px; }
.vn-faq-item p{ font-size:14px; color:var(--vn-muted); line-height:1.6; }

@media (max-width:860px){
    .vn-plans-grid{ grid-template-columns:1fr; }
    .vn-faq-grid{ grid-template-columns:1fr; }
}