/* Vetryx redesigned theme transferred from the HTML/CSS mockup to the PHP site. */
:root{
  --bg:#030508!important;
  --bg2:#070a12!important;
  --card:rgba(10,13,20,.58)!important;
  --card-soft:rgba(255,255,255,.045)!important;
  --card-border:rgba(255,255,255,.08)!important;
  --text:#e0e6ed!important;
  --muted:#8b9bb4!important;
  --accent:#ff2a7a!important;
  --accent2:#ff1744!important;
  --accent3:#b13bff!important;
  --green:#4ade80!important;
  --red:#ef4444!important;
  --yellow:#f59e0b!important;
  --glass-bg:rgba(10,13,20,.52)!important;
  --glass-border:rgba(255,255,255,.08)!important;
  --font-primary:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important;
  --font-display:'Space Grotesk','Inter',system-ui,sans-serif!important;
  --transition-base:.3s cubic-bezier(.4,0,.2,1)!important;
}
html{scroll-behavior:smooth;background:var(--bg)!important;}
*,*::before,*::after{box-sizing:border-box;}
body{
  margin:0!important;
  font-family:var(--font-primary)!important;
  color:var(--text)!important;
  background:
    radial-gradient(circle at 18% 18%,rgba(255,42,122,.13),transparent 34%),
    radial-gradient(circle at 82% 72%,rgba(177,59,255,.14),transparent 35%),
    linear-gradient(135deg,#030508 0%,#0a0014 100%)!important;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:""!important;
  position:fixed!important;
  inset:0!important;
  z-index:-1!important;
  pointer-events:none!important;
  background:
    radial-gradient(circle at 20% 30%,rgba(255,0,153,.10),transparent 50%),
    radial-gradient(circle at 80% 70%,rgba(255,0,255,.10),transparent 50%),
    repeating-radial-gradient(circle at center,rgba(255,255,255,.035) 0 1px,transparent 1px 86px)!important;
  mask-image:radial-gradient(circle at center,rgba(0,0,0,1),rgba(0,0,0,.1) 82%);
  -webkit-mask-image:radial-gradient(circle at center,rgba(0,0,0,1),rgba(0,0,0,.1) 82%);
}
.container{width:100%!important;max-width:1400px!important;margin:0 auto!important;padding:24px!important;position:relative;z-index:1;}
header{
  position:sticky!important;top:18px!important;z-index:100!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;
  padding:12px 24px!important;margin:0 0 52px!important;
  background:rgba(10,13,20,.55)!important;
  border:1px solid var(--glass-border)!important;
  border-radius:16px!important;
  backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important;
  box-shadow:0 18px 50px rgba(0,0,0,.28)!important;
}
.logo{
  font-family:var(--font-display)!important;font-size:24px!important;font-weight:800!important;letter-spacing:-.5px!important;
  background:linear-gradient(90deg,var(--accent),var(--accent3))!important;
  background-clip:text!important;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent!important;
  text-shadow:none!important;
}
.nav{display:flex!important;gap:12px!important;align-items:center!important;flex-wrap:wrap!important;}
.btn,
button.btn,
a.btn,
input[type="submit"],
button[type="submit"]{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  min-height:44px!important;padding:10px 24px!important;border-radius:8px!important;
  font-family:var(--font-display)!important;font-weight:700!important;font-size:15px!important;line-height:1!important;
  cursor:pointer!important;text-decoration:none!important;user-select:none!important;
  transition:transform var(--transition-base),box-shadow var(--transition-base),filter var(--transition-base),background var(--transition-base),border-color var(--transition-base)!important;
}
.btn:hover,input[type="submit"]:hover,button[type="submit"]:hover{transform:translateY(-2px)!important;}
.btn-primary,.btn--primary,input[type="submit"],button[type="submit"]{
  color:#fff!important;border:none!important;
  background:linear-gradient(90deg,var(--accent),var(--accent3))!important;
  box-shadow:0 4px 15px rgba(177,59,255,.22)!important;
}
.btn-primary:hover,.btn--primary:hover,input[type="submit"]:hover,button[type="submit"]:hover{
  filter:brightness(1.08)!important;
  box-shadow:0 0 20px rgba(255,42,122,.48),0 0 20px rgba(177,59,255,.42)!important;
}
.btn-secondary,.btn--outline,.btn-outline{
  color:#fff!important;background:rgba(255,255,255,.035)!important;border:1px solid var(--glass-border)!important;
  box-shadow:none!important;
}
.btn-secondary:hover,.btn--outline:hover,.btn-outline:hover{background:rgba(255,255,255,.10)!important;border-color:rgba(255,255,255,.22)!important;}
.hero{
  position:relative!important;overflow:hidden!important;text-align:center!important;
  min-height:clamp(460px,70vh,720px)!important;display:flex!important;align-items:center!important;justify-content:center!important;
  padding:110px 32px 92px!important;margin:0 0 70px!important;border-radius:28px!important;
  background:linear-gradient(180deg,rgba(255,42,122,.05),rgba(10,13,20,.50))!important;
  border:1px solid var(--glass-border)!important;
  box-shadow:0 30px 80px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.04)!important;
  backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important;
}
.hero::after{
  content:""!important;position:absolute!important;inset:auto -120px -140px auto!important;width:420px!important;height:420px!important;border-radius:50%!important;
  background:radial-gradient(circle,rgba(177,59,255,.22),transparent 68%)!important;border:0!important;box-shadow:none!important;
}
.hero::before{
  content:""!important;position:absolute!important;inset:-25% auto auto -15%!important;width:520px!important;height:520px!important;border-radius:50%!important;
  background:radial-gradient(circle,rgba(255,42,122,.16),transparent 66%)!important;pointer-events:none!important;
}
.hero-inner{position:relative!important;z-index:1!important;max-width:760px!important;margin:0 auto!important;}
.hero-kicker{
  display:inline-flex!important;margin:0 auto 18px!important;padding:7px 14px!important;border-radius:999px!important;
  color:#ffd7e7!important;background:rgba(255,42,122,.10)!important;border:1px solid rgba(255,42,122,.24)!important;
  font-family:var(--font-display)!important;font-weight:700!important;font-size:.82rem!important;
}
.hero h1{
  margin:0 0 24px!important;font-family:var(--font-display)!important;font-size:clamp(42px,7vw,76px)!important;line-height:1.05!important;letter-spacing:-2px!important;
  background:linear-gradient(90deg,var(--accent),var(--accent3))!important;background-clip:text!important;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent!important;
}
.hero p{font-size:18px!important;color:var(--muted)!important;max-width:640px!important;margin:0 auto 40px!important;line-height:1.65!important;white-space:normal!important;}
.hero-actions{display:flex!important;gap:14px!important;justify-content:center!important;flex-wrap:wrap!important;}
.section-title{font-family:var(--font-display)!important;font-size:clamp(32px,5vw,48px)!important;text-align:center!important;margin:0 0 12px!important;letter-spacing:-1px!important;}
.section-subtitle{margin:0 auto 50px!important;text-align:center!important;color:var(--muted)!important;max-width:760px!important;line-height:1.6!important;}
.server-type-section{margin:50px 0!important;}
.server-type-header{text-align:center!important;margin:0 0 24px!important;}
.server-type-title{font-family:var(--font-display)!important;font-size:24px!important;font-weight:800!important;}
.server-type-desc{color:var(--muted)!important;margin-top:6px!important;}
.plans-section{scroll-margin-top:120px!important;margin-bottom:70px!important;}
.plans-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:20px!important;align-items:stretch!important;}
.plan-card{
  position:relative!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;
  min-height:auto!important;padding:32px 24px!important;border-radius:16px!important;
  background:var(--glass-bg)!important;border:1px solid var(--glass-border)!important;
  box-shadow:none!important;backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important;
  transition:transform var(--transition-base),border-color var(--transition-base),box-shadow var(--transition-base)!important;
}
.plan-card::before{content:""!important;position:absolute!important;top:0!important;left:0!important;right:0!important;height:3px!important;background:linear-gradient(90deg,var(--accent),var(--accent3))!important;opacity:.85!important;}
.plan-card:hover{transform:translateY(-8px)!important;border-color:rgba(255,255,255,.2)!important;box-shadow:0 20px 40px rgba(0,0,0,.5)!important;}
.plan-card--best{background:linear-gradient(180deg,rgba(255,42,122,.075),rgba(10,13,20,.52))!important;border-color:rgba(255,42,122,.32)!important;}
.plan-badge,.plan-discount-badge{
  position:absolute!important;top:16px!important;border-radius:6px!important;padding:4px 10px!important;font-size:12px!important;font-weight:800!important;color:#fff!important;
  background:linear-gradient(90deg,var(--accent),var(--accent3))!important;
}
.plan-badge{right:16px!important}.plan-discount-badge{left:16px!important;background:rgba(255,255,255,.10)!important;}
.plan-duration{margin:26px 0 8px!important;font-family:var(--font-display)!important;font-size:20px!important;font-weight:700!important;color:#fff!important;}
.plan-hint{color:var(--muted)!important;font-size:14px!important;line-height:1.5!important;}
.plan-original-price{height:22px!important;margin-top:16px!important;color:#65738a!important;text-decoration:line-through!important;}
.plan-price{margin:12px 0 4px!important;font-family:var(--font-display)!important;font-size:42px!important;font-weight:800!important;color:#fff!important;text-shadow:none!important;}
.plan-price span,.plan-period{font-size:16px!important;color:var(--muted)!important;}
.plan-features{list-style:none!important;padding:0!important;margin:26px 0 32px!important;flex:1!important;}
.plan-features li{position:relative!important;padding-left:20px!important;margin:0 0 14px!important;color:#a0aec0!important;font-size:14px!important;line-height:1.5!important;}
.plan-features li::before{content:""!important;position:absolute!important;left:0!important;top:.75em!important;width:6px!important;height:6px!important;border-radius:50%!important;background:var(--accent3)!important;box-shadow:0 0 8px var(--accent3)!important;}
.plan-actions,.plan-card form{margin-top:auto!important;display:grid!important;gap:10px!important;}
.plan-actions .btn,.plan-card .btn{width:100%!important;}
.profile-section,.ref-block,.devices-block,.telegram-block,.subscription-block,.payment-help-card,.support-section,.site-footer,.balance-card,.operations-card,.ticket-form-card,.ticket-list-card,.ticket-item,.modal-content,.account-summary-card{
  background:var(--glass-bg)!important;border:1px solid var(--glass-border)!important;border-radius:16px!important;box-shadow:0 18px 45px rgba(0,0,0,.25)!important;backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important;
}
.profile-section h2,.support-section h3,.ticket-form-card h4,.ticket-list-card h4,.footer__brand{font-family:var(--font-display)!important;}
input,select,textarea{
  background:rgba(0,0,0,.30)!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:12px!important;color:var(--text)!important;outline:none!important;
}
input:focus,select:focus,textarea:focus{border-color:rgba(255,42,122,.45)!important;box-shadow:0 0 0 3px rgba(255,42,122,.12)!important;}
.site-footer{padding:40px 28px 24px!important;margin:70px 0 16px!important;background:rgba(6,8,14,.84)!important;}
.site-footer-grid{display:grid!important;grid-template-columns:2fr 1fr 1fr!important;gap:40px!important;}
.site-footer h4{font-family:var(--font-display)!important;margin:0 0 16px!important;}
.site-footer p,.footer-note{color:var(--muted)!important;}
.footer-links{display:flex!important;flex-direction:column!important;gap:12px!important;}
.footer-link{color:var(--muted)!important;text-decoration:none!important;font-weight:600!important;transition:color .2s ease!important;}
.footer-link:hover{color:#fff!important;text-decoration:none!important;}
.footer-note{margin-top:28px!important;padding-top:24px!important;border-top:1px solid rgba(255,255,255,.06)!important;font-size:14px!important;}
.support-btn{background:linear-gradient(90deg,var(--accent),var(--accent3))!important;box-shadow:0 12px 34px rgba(177,59,255,.28)!important;}
.message{border-radius:16px!important;border:1px solid var(--glass-border)!important;backdrop-filter:blur(12px)!important;}
@media (max-width:1024px){.plans-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.site-footer-grid{grid-template-columns:1fr 1fr!important}}
@media (max-width:768px){
  .container{padding:14px 12px 24px!important;}
  header{top:0!important;margin:0 0 22px!important;padding:10px 14px!important;border-radius:14px!important;align-items:center!important;}
  .nav{gap:8px!important;}
  .nav .btn{padding:8px 14px!important;font-size:14px!important;}
  .hero{min-height:auto!important;padding:72px 18px 58px!important;margin-bottom:42px!important;border-radius:20px!important;}
  .hero h1{font-size:clamp(38px,13vw,58px)!important;}
  .hero p{font-size:16px!important;margin-bottom:28px!important;}
  .hero-actions .btn{width:100%!important;min-height:52px!important;}
  .plans-grid,.site-footer-grid{grid-template-columns:1fr!important;}
  .plan-card{padding:24px 20px!important;}
  .plan-card:hover{transform:none!important;}
  .site-footer{margin-top:42px!important;}
}
@media (max-width:520px){
  header{flex-direction:column!important;align-items:stretch!important;}
  .logo{text-align:center!important;}
  .nav{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important;}
  .nav .btn{width:100%!important;}
}