/* ══ VPS Hosting pages ══ */

/* Hero */
.vps-hero{padding:5.5rem 0 3.5rem;background:linear-gradient(135deg,#f8fafc 0%,#eef2ff 60%,#fff 100%);position:relative;overflow:hidden;}
.vps-hero h1{font-size:clamp(2rem,4vw,3.4rem);font-weight:800;line-height:1.15;margin-bottom:1rem;}
.vps-hero p.lead{font-size:1.05rem;color:var(--text-muted);max-width:640px;line-height:1.8;margin-bottom:1.8rem;}
.vps-hero-actions{display:flex;gap:.9rem;flex-wrap:wrap;margin-bottom:2.4rem;}
.vps-stats{display:flex;gap:2.5rem;flex-wrap:wrap;}
.vps-stat span{font-size:1.9rem;font-weight:800;color:var(--accent);display:block;line-height:1.2;}
.vps-stat small{font-size:.72rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;}
.vx-crumbs{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;font-size:.8rem;color:var(--text-muted);margin-bottom:1.3rem;}
.vx-crumbs a{color:var(--text-muted);text-decoration:none;}
.vx-crumbs a:hover{color:var(--accent);}
.vx-crumbs i{font-size:.55rem;opacity:.6;}
.vx-flag{display:inline-block;width:22px;height:16px;border-radius:3px;background-size:cover;vertical-align:middle;box-shadow:0 0 0 1px rgba(15,23,42,.08);}

/* Sections */
.vx-section{padding:5rem 0;background:#fff;}
.vx-section.alt{background:#f8fafc;}
.vx-head{text-align:center;max-width:780px;margin:0 auto 2.8rem;}
.vx-head .badge{margin-bottom:1rem;}
.vx-head .section-subtitle{margin-left:auto;margin-right:auto;}
.vx-prose{max-width:840px;margin:0 auto;}
.vx-prose p{font-size:.98rem;color:var(--text-muted);line-height:1.85;margin:0 0 1.15rem;}
.vx-prose p:last-child{margin-bottom:0;}
.vx-prose h3{font-size:1.15rem;font-weight:700;color:var(--text);margin:1.8rem 0 .6rem;}
.vx-prose strong{color:var(--text);font-weight:600;}
.vx-prose a{color:var(--accent);font-weight:600;}
.vx-prose ul{margin:0 0 1.15rem 1.2rem;color:var(--text-muted);line-height:1.85;font-size:.96rem;}
.vx-split{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:center;}
.vx-split .vx-prose{margin:0;}
.vx-split .badge{margin-bottom:1rem;}

/* Cards */
.vf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
.vf-card{background:#fff;border:1.5px solid var(--border);border-radius:var(--radius-xl);padding:1.8rem;transition:var(--transition-fast);}
.vf-card:hover{box-shadow:var(--shadow-lg);border-color:rgba(99,102,241,.25);transform:translateY(-4px);}
.vf-icon{width:50px;height:50px;border-radius:var(--radius-md);background:var(--accent-glow);border:1.5px solid rgba(99,102,241,.15);display:flex;align-items:center;justify-content:center;color:var(--accent);font-size:1.2rem;margin-bottom:1rem;}
.vf-card h3,.vf-card h4{font-size:.98rem;font-weight:700;color:var(--text);margin:0 0 .5rem;}
.vf-card p{font-size:.86rem;color:var(--text-muted);line-height:1.75;margin:0;}

/* Plans */
.vp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem;}
.vp-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1.5px solid var(--border);border-radius:var(--radius-xl);padding:1.6rem 1.35rem 1.4rem;transition:var(--transition-fast);}
.vp-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:rgba(99,102,241,.3);}
.vp-card.popular{border-color:var(--accent);box-shadow:0 0 0 3px rgba(99,102,241,.12),var(--shadow-lg);}
.vp-badge{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--grad-primary);color:#fff;font-size:.64rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:.28rem .9rem;border-radius:var(--radius-full);white-space:nowrap;box-shadow:0 4px 12px rgba(99,102,241,.3);}
.vp-name{font-size:1rem;font-weight:700;color:var(--text);margin:0 0 .25rem;}
.vp-tag{font-size:.78rem;color:var(--text-muted);line-height:1.5;min-height:2.35rem;margin:0 0 .9rem;}
.vp-price{display:flex;align-items:flex-start;line-height:1;}
.vp-price sup{font-size:.95rem;font-weight:700;color:var(--accent);margin:.35rem .1rem 0 0;top:0;}
.vp-price .amt{font-size:2.15rem;font-weight:800;color:var(--text);letter-spacing:-.02em;}
.vp-price .per{font-size:.8rem;color:var(--text-muted);align-self:flex-end;margin:0 0 .3rem .2rem;}
.vp-renew{display:flex;align-items:center;gap:.35rem;font-size:.72rem;color:var(--text-muted);margin:.5rem 0 1rem;}
.vp-renew i{color:var(--accent);font-size:.65rem;}
.vp-specs{list-style:none;margin:0 0 1rem;padding:0;border-top:1px solid var(--border-light);}
.vp-specs li{display:flex;justify-content:space-between;align-items:center;gap:.5rem;padding:.55rem 0;border-bottom:1px solid var(--border-light);font-size:.8rem;}
.vp-specs li span{display:inline-flex;align-items:center;gap:.35rem;color:var(--text-muted);}
.vp-specs li span i{font-size:.7rem;color:var(--accent);opacity:.7;cursor:help;}
.vp-specs li strong{color:var(--text);font-weight:700;white-space:nowrap;}
.vp-perks{list-style:none;margin:0 0 1.3rem;padding:0;flex:1;}
.vp-perks li{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--text-muted);padding:.22rem 0;}
.vp-perks li i{color:var(--success,#10b981);font-size:.72rem;}
.vp-deploy{width:100%;justify-content:center;}
.vp-note{display:flex;justify-content:center;flex-wrap:wrap;gap:.6rem 1.8rem;margin-top:2.2rem;font-size:.85rem;color:var(--text-muted);}
.vp-note span{display:inline-flex;align-items:center;gap:.45rem;}
.vp-note i{color:var(--accent);}

/* Plan guide & steps */
.vx-tiers,.vx-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;}
.vx-tier,.vx-step{background:#fff;border:1.5px solid var(--border);border-radius:var(--radius-lg);padding:1.5rem;transition:var(--transition-fast);}
.vx-tier:hover,.vx-step:hover{border-color:rgba(99,102,241,.25);box-shadow:var(--shadow-md);}
.vx-tier .range{font-size:.7rem;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.07em;margin-bottom:.45rem;}
.vx-tier h3,.vx-step h3{font-size:1rem;font-weight:700;color:var(--text);margin:0 0 .5rem;}
.vx-tier p,.vx-step p{font-size:.85rem;color:var(--text-muted);line-height:1.75;margin:0;}
.vx-steps{counter-reset:vxstep;}
.vx-step::before{counter-increment:vxstep;content:counter(vxstep);width:36px;height:36px;border-radius:50%;background:var(--grad-primary);color:#fff;font-weight:800;font-size:.9rem;display:flex;align-items:center;justify-content:center;margin-bottom:.9rem;}
.vx-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem;margin-top:2.2rem;}
.vx-chip{display:inline-flex;align-items:center;gap:.5rem;background:#fff;border:1.5px solid var(--border);border-radius:var(--radius-full);padding:.5rem 1.05rem;font-size:.84rem;font-weight:600;color:var(--text);}
.vx-chip i{color:var(--accent);}

/* Tables */
.vx-table-wrap{overflow-x:auto;}
.vx-table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1.5px solid var(--border);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-md);}
.vx-table th{background:var(--grad-primary);color:#fff;font-size:.76rem;font-weight:600;text-align:left;padding:.9rem 1.1rem;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;}
.vx-table td{padding:.8rem 1.1rem;font-size:.88rem;color:var(--text-muted);border-top:1px solid var(--border-light);vertical-align:middle;}
.vx-table td:first-child{color:var(--text);font-weight:600;}
.vx-table tr:hover td{background:var(--accent-glow2);}
.vx-table.latency th:last-child,.vx-table.latency td:last-child{text-align:right;white-space:nowrap;}
.vx-table.latency td:last-child{font-weight:700;color:var(--accent);}
.vx-table.compare{min-width:640px;}
.vx-table.compare th:not(:first-child),.vx-table.compare td:not(:first-child){text-align:center;}
.vx-table .yes{color:var(--success,#10b981);}
.vx-table .no{color:var(--text-dim,#94a3b8);}
.vx-note{font-size:.75rem;color:var(--text-dim,#94a3b8);margin-top:.75rem;line-height:1.6;}

/* Location links */
.vl-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem;}
.vl-card{display:flex;align-items:center;gap:.75rem;padding:.8rem 1rem;background:#fff;border:1.5px solid var(--border);border-radius:12px;text-decoration:none;transition:var(--transition-fast);}
.vl-card:hover{border-color:var(--accent);background:#f5f3ff;transform:translateY(-2px);box-shadow:0 4px 14px rgba(99,102,241,.12);}
.vl-card .fi{width:28px;height:21px;border-radius:4px;flex-shrink:0;background-size:cover;box-shadow:0 0 0 1px rgba(15,23,42,.06);}
.vl-info{flex:1;min-width:0;}
.vl-info strong{display:block;font-size:.85rem;font-weight:700;color:var(--text);}
.vl-info small{font-size:.74rem;color:var(--text-muted);}
.vl-card>i{font-size:.7rem;color:var(--accent);opacity:0;transition:.2s;}
.vl-card:hover>i{opacity:1;}

/* Region browser (main VPS page) */
.loc-browser{display:grid;grid-template-columns:220px 1fr;border:1.5px solid var(--border);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-lg);background:#fff;}
.loc-sidebar{background:#f8fafc;border-right:1.5px solid var(--border);padding:.75rem;}
.loc-tab{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.75rem 1rem;border-radius:10px;cursor:pointer;font-size:.88rem;font-weight:600;color:#475569;transition:.2s;margin-bottom:.2rem;border:1px solid transparent;background:none;font-family:var(--font-body);text-align:left;}
.loc-tab:hover{background:#fff;color:var(--accent);}
.loc-tab.active{background:var(--accent);color:#fff;box-shadow:0 4px 14px rgba(99,102,241,.35);}
.loc-tab .cnt{font-size:.75rem;font-weight:700;background:rgba(255,255,255,.25);padding:.15rem .55rem;border-radius:20px;min-width:26px;text-align:center;}
.loc-tab:not(.active) .cnt{background:rgba(99,102,241,.1);color:var(--accent);}
.loc-content{padding:1.8rem;}
.loc-region-desc{font-size:.84rem;color:var(--text-muted);margin:0 0 1.4rem;padding-bottom:1rem;border-bottom:1px solid var(--border-light);}
.loc-region-desc i{color:var(--accent);margin-right:.35rem;}
.loc-panel{display:none;}
.loc-panel.active{display:block;}
.loc-panel .vl-grid{grid-template-columns:repeat(3,1fr);}

/* Specs */
.specs-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;}
.spec-card{background:#fff;border:1.5px solid var(--border);border-radius:var(--radius-lg);padding:1.4rem;text-align:center;transition:var(--transition-fast);}
.spec-card:hover{box-shadow:var(--shadow-md);border-color:rgba(99,102,241,.2);}
.spec-card>i{font-size:1.4rem;color:var(--accent);margin-bottom:.4rem;}
.spec-val{font-size:1.5rem;font-weight:800;color:var(--accent);margin:.3rem 0;}
.spec-lbl{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;}

/* FAQ */
.faq-list{max-width:860px;margin:0 auto;}
.faq-item{background:#fff;border:1.5px solid var(--border);border-radius:var(--radius-lg);margin-bottom:.85rem;overflow:hidden;transition:border-color .2s,box-shadow .2s;}
.faq-item.open{border-color:rgba(99,102,241,.35);box-shadow:0 6px 20px rgba(99,102,241,.08);}
.faq-q{width:100%;background:none;border:none;text-align:left;padding:1.1rem 1.4rem;font-size:.95rem;font-weight:600;color:var(--text);cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;font-family:var(--font-body);}
.faq-q i{color:var(--accent);transition:transform .4s cubic-bezier(.22,1,.36,1);flex-shrink:0;}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s cubic-bezier(.22,1,.36,1);}
.faq-a-inner{min-height:0;overflow:hidden;padding:0 1.4rem;font-size:.9rem;color:var(--text-muted);line-height:1.8;opacity:0;transform:translateY(-6px);transition:opacity .3s ease,transform .4s cubic-bezier(.22,1,.36,1),padding-bottom .4s cubic-bezier(.22,1,.36,1);}
.faq-a a{color:var(--accent);font-weight:600;}
.faq-item.open .faq-q i{transform:rotate(180deg);}
.faq-item.open .faq-a{grid-template-rows:1fr;}
.faq-item.open .faq-a-inner{opacity:1;transform:none;padding-bottom:1.2rem;}
@media(prefers-reduced-motion:reduce){.faq-a,.faq-a-inner,.faq-q i{transition:none;}}

/* CTA */
.vps-cta{padding:5rem 0;}
.cta-box{background:#fff;border:1.5px solid var(--border);border-radius:var(--radius-2xl);padding:4rem 3rem;text-align:center;color:var(--text);position:relative;overflow:hidden;box-shadow:var(--shadow-lg);}
.cta-box::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 12% 0%,rgba(99,102,241,.12) 0,transparent 42%),radial-gradient(circle at 88% 100%,rgba(129,140,248,.12) 0,transparent 42%);pointer-events:none;}
.cta-box h2{font-size:clamp(1.8rem,3vw,2.5rem);font-weight:800;margin-bottom:1rem;color:var(--text);}
.cta-box p{color:var(--text-muted);max-width:660px;margin:0 auto 2rem;}
.cta-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;}
.cta-trust{margin-top:1.8rem!important;margin-bottom:0!important;font-size:.84rem;color:var(--text-muted);}
.cta-trust i{color:var(--accent);}

/* Home page */
.hm-link{display:flex;flex-direction:column;text-decoration:none;}
.hm-link:hover{transform:translateY(-4px);}
.hm-link h3 i{color:var(--accent);margin-right:.45rem;}
.hm-more{margin-top:auto;padding-top:1rem;font-size:.84rem;font-weight:600;color:var(--accent);}
.hm-more i{font-size:.72rem;margin-left:.2rem;}
.hm-actions{display:flex;gap:.9rem;justify-content:center;flex-wrap:wrap;margin-top:2rem;}
.hm-vps .vl-grid{margin-top:3rem;}
.hm-tlds{display:grid;grid-template-columns:repeat(6,1fr);gap:.9rem;}
.hm-tld{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:1.3rem .8rem;background:#fff;border:1.5px solid var(--border);border-radius:var(--radius-lg);text-decoration:none;text-align:center;transition:var(--transition-fast);}
.hm-tld:hover{border-color:var(--accent);transform:translateY(-3px);box-shadow:var(--shadow-md);}
.hm-tld strong{font-size:1.35rem;font-weight:800;color:var(--accent);}
.hm-tld span{font-size:1.05rem;font-weight:700;color:var(--text);}
.hm-tld small{font-size:.68rem;color:var(--text-dim,#94a3b8);}
@media(max-width:900px){.hm-tlds{grid-template-columns:repeat(3,1fr);}}
@media(max-width:480px){.hm-tlds{grid-template-columns:repeat(2,1fr);}}

/* Hosting plans */
.hp-buy{margin:1.1rem 0 1.25rem;}
.hp-features{list-style:none;margin:0;padding:1.15rem 0 0;border-top:1px solid var(--border-light);display:flex;flex-direction:column;gap:.62rem;flex:1;}
.hp-features li{display:flex;align-items:center;gap:.5rem;font-size:.84rem;color:var(--text);line-height:1.4;}
.hp-features li>.fa-check{color:var(--success,#10b981);font-size:.74rem;flex-shrink:0;}
.hp-tip{font-size:.7rem;color:var(--text-dim,#94a3b8);cursor:help;}
.vx-art.hp-art{container-type:inline-size;}
.vx-art .hp-wp-icon{position:absolute;transform:translate(-50%,-50%);color:#4f46e5;font-size:3rem;font-size:11cqw;line-height:1;}

/* Hero illustration */
.vx-hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:3rem;align-items:center;}
.vx-hero-grid h1{font-size:clamp(2rem,3.6vw,3.1rem);}
.vx-art{position:relative;width:100%;max-width:520px;aspect-ratio:520/460;margin-left:auto;}
.vx-art::before{content:'';position:absolute;left:1.92%;right:1.92%;top:4.35%;bottom:4.35%;border-radius:5.6%/6.7%;box-shadow:0 24px 40px rgba(79,70,229,.14);}
.vx-art svg{position:absolute;inset:0;width:100%;height:100%;display:block;}
.vx-art .vx-pin-flag.fi{position:absolute;width:5%;height:0;padding-bottom:5%;font-size:0;line-height:0;border-radius:50%;background-size:cover;transform:translate(-50%,-50%);}
.vx-art .vx-chip{position:absolute;display:inline-flex;align-items:center;gap:.35rem;padding:.34rem .7rem;background:#fff;border:1px solid rgba(99,102,241,.18);border-radius:999px;font-size:.72rem;font-weight:600;color:var(--text);white-space:nowrap;box-shadow:0 8px 20px rgba(79,70,229,.12);transform:translateY(-50%);animation:vxFloat 4s ease-in-out infinite;}
.vx-art .vx-chip i{color:var(--accent);font-size:.62rem;}
.vx-art .vx-chip b{color:var(--accent);font-weight:700;}
.vx-dc-card{position:absolute;left:5%;bottom:5.5%;display:flex;align-items:center;gap:.6rem;padding:.5rem .85rem .5rem .5rem;background:rgba(255,255,255,.94);border:1px solid rgba(99,102,241,.18);border-radius:14px;box-shadow:0 10px 28px rgba(79,70,229,.16);}
.vx-dc-ico{width:34px;height:34px;border-radius:10px;background:var(--grad-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.85rem;flex-shrink:0;}
.vx-dc-txt strong{display:block;font-size:.78rem;color:var(--text);line-height:1.25;}
.vx-dc-txt small{font-size:.68rem;color:var(--text-muted);}
.vx-dc-live{width:8px;height:8px;border-radius:50%;background:var(--success,#10b981);box-shadow:0 0 0 4px rgba(16,185,129,.18);margin-left:.2rem;}
.vx-art .vx-map-flag.fi{position:absolute;width:4.2%;height:0;padding-bottom:4.2%;font-size:0;line-height:0;border-radius:50%;background-size:cover;transform:translate(-50%,-50%);box-shadow:0 0 0 2px #fff,0 4px 10px rgba(79,70,229,.25);}
@keyframes vxFloat{0%,100%{transform:translateY(-50%)}50%{transform:translateY(calc(-50% - 5px))}}
@media(prefers-reduced-motion:reduce){.vx-chip{animation:none;}}

@media(max-width:1100px){
  .vp-grid,.vx-tiers,.vx-steps{grid-template-columns:repeat(2,1fr);}
  .vl-grid{grid-template-columns:repeat(3,1fr);}
}
@media(max-width:1024px){
  .vf-grid{grid-template-columns:repeat(2,1fr);}
  .specs-grid{grid-template-columns:repeat(2,1fr);}
  .loc-panel .vl-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:960px){
  .vx-hero-grid{grid-template-columns:1fr;gap:2.2rem;}
  .vx-art{margin:0 auto;max-width:460px;}
}
@media(max-width:860px){
  .vx-split{grid-template-columns:1fr;gap:2rem;}
}
@media(max-width:768px){
  .vx-section,.vps-cta{padding:3.5rem 0;}
  .vf-grid{grid-template-columns:1fr;}
  .vl-grid{grid-template-columns:repeat(2,1fr);}
  .loc-browser{grid-template-columns:1fr;}
  .loc-sidebar{display:flex;flex-wrap:wrap;gap:.4rem;border-right:none;border-bottom:1.5px solid var(--border);}
  .loc-tab{flex:1;min-width:120px;justify-content:center;gap:.5rem;margin:0;}
}
@media(max-width:560px){
  .vp-grid,.vx-tiers,.vx-steps,.vl-grid,.loc-panel .vl-grid{grid-template-columns:1fr;}
  .vx-art .vx-chip{font-size:.6rem;padding:.22rem .5rem;gap:.25rem;}
  .vx-dc-card{padding:.35rem .6rem .35rem .35rem;gap:.4rem;border-radius:10px;}
  .vx-dc-ico{width:26px;height:26px;font-size:.7rem;border-radius:8px;}
  .vx-dc-txt strong{font-size:.66rem;}
  .vx-dc-txt small{display:none;}
  .vps-stats{gap:1.5rem;}
  .cta-box{padding:2.5rem 1.2rem;}
  .vx-table th,.vx-table td{padding:.7rem .8rem;}
}
