/* Main CSS File for IT Courses Website */

/* CSS Variables */
:root {
  /* Colors */
  --primary-color: #121212;
  --secondary-color: #2a2a2a;
  --accent-color: #646464;
  --text-color: #f5f5f5;
  --text-secondary: #a1a1a1;
  --bg-color: #0a0a0a;
  --bg-secondary: #151515;
  --border-color: #323232;
  --success-color: #4CAF50;
  --error-color: #F44336;
  
  /* Typography */
  --font-primary: 'Montserrat', sans-serif;
  --font-secondary: 'Roboto', sans-serif;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-md: 1rem;
  --font-size-lg: 1.25rem;
  --font-size-xl: 1.5rem;
  --font-size-2xl: 2rem;
  --font-size-3xl: 3rem;
  
  /* Spacing */
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 2rem;
  --spacing-xl: 3rem;
  --spacing-2xl: 5rem;
  
  /* Borders */
  --border-radius-sm: 4px;
  --border-radius-md: 8px;
  --border-radius-lg: 16px;
  --border-radius-xl: 24px;
  
  /* Transitions */
  --transition-fast: 0.2s ease;
  --transition-normal: 0.3s ease;
  --transition-slow: 0.5s ease;
  
  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
  --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.1);
  
  /* Layout */
  --header-height: 80px;
  --container-max-width: 1440px;
  --sidebar-width: 280px;
  
  /* Z-indices */
  --z-negative: -1;
  --z-low: 10;
  --z-mid: 50;
  --z-high: 100;
  --z-modal: 1000;
}

/* Reset */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-primary);
  font-size: var(--font-size-md);
  color: var(--text-color);
  background-color: var(--bg-color);
  line-height: 1.6;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0 0 var(--spacing-md) 0;
  font-weight: 700;
  line-height: 1.2;
}

h1 {
  font-size: var(--font-size-3xl);
}

h2 {
  font-size: var(--font-size-2xl);
}

h3 {
  font-size: var(--font-size-xl);
}

h4 {
  font-size: var(--font-size-lg);
}

p {
  margin-bottom: var(--spacing-md);
}

a {
  color: var(--text-color);
  text-decoration: none;
  transition: color var(--transition-fast);
}

a:hover {
  color: var(--accent-color);
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

ul, ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Layout */
.container {
  width: 100%;
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--spacing-lg);
}

.section {
  padding: var(--spacing-xl) 0;
  position: relative;
}

.section-title {
  margin-bottom: var(--spacing-xl);
  position: relative;
  z-index: 1;
  text-align: center;
}

.section-title::after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 3px;
  background-color: var(--accent-color);
}

/* Navigation */
.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: var(--z-high);
  background-color: var(--bg-color);
  transition: var(--transition-normal);
}

.header-scrolled {
  box-shadow: var(--shadow-md);
  background-color: rgba(10, 10, 10, 0.95);
  backdrop-filter: blur(10px);
}

.navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: var(--header-height);
}

.logo {
  font-size: var(--font-size-xl);
  font-weight: 700;
  display: flex;
  align-items: center;
}

.logo-img {
  height: 40px;
  margin-right: var(--spacing-sm);
}

.nav-links {
  display: flex;
  gap: var(--spacing-lg);
}

.nav-link {
  position: relative;
  padding: var(--spacing-sm) 0;
  font-weight: 500;
}

.nav-link::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background-color: var(--accent-color);
  transition: width var(--transition-normal);
}

.nav-link:hover::after,
.nav-link.active::after {
  width: 100%;
}

.lang-switcher {
  display: flex;
  align-items: center;
  margin-left: var(--spacing-lg);
  position: relative;
  cursor: pointer;
}

.current-lang {
  display: flex;
  align-items: center;
}

.current-lang::after {
  content: "▼";
  font-size: 8px;
  margin-left: var(--spacing-xs);
  transition: var(--transition-fast);
}

.lang-options {
  position: absolute;
  top: 100%;
  right: 0;
  background-color: var(--bg-secondary);
  border-radius: var(--border-radius-sm);
  padding: var(--spacing-sm);
  box-shadow: var(--shadow-md);
  min-width: 120px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: var(--transition-fast);
}

.lang-switcher:hover .lang-options {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.lang-option {
  padding: var(--spacing-xs) var(--spacing-sm);
  transition: background-color var(--transition-fast);
  border-radius: var(--border-radius-sm);
  display: block;
}

.lang-option:hover {
  background-color: var(--secondary-color);
}

.mobile-menu-toggle {
  display: none;
  font-size: var(--font-size-xl);
  background: none;
  border: none;
  color: var(--text-color);
  cursor: pointer;
}

/* Hero Section */
.hero {
  height: 100vh;
  min-height: 600px;
  display: flex;
  align-items: center;
  background-color: var(--bg-color);
  padding-top: var(--header-height);
  position: relative;
  overflow: hidden;
}

.hero-content {
  position: relative;
  z-index: 2;
  max-width: 700px;
}

.hero-title {
  font-size: clamp(2.5rem, 5vw, 4rem);
  margin-bottom: var(--spacing-md);
  line-height: 1.1;
}

.hero-description {
  font-size: var(--font-size-lg);
  margin-bottom: var(--spacing-xl);
}

.hero-cta {
  display: inline-flex;
  align-items: center;
  padding: var(--spacing-md) var(--spacing-lg);
  background-color: var(--accent-color);
  color: var(--text-color);
  border-radius: var(--border-radius-md);
  font-weight: 600;
  transition: var(--transition-normal);
  border: none;
  cursor: pointer;
}

.hero-cta:hover {
  background-color: var(--primary-color);
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
}

.hero-cta .icon {
  margin-left: var(--spacing-sm);
}

.hero-image {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  z-index: 1;
  opacity: 0.7;
  mask-image: linear-gradient(to left, rgba(0,0,0,1), rgba(0,0,0,0));
}

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-sm) var(--spacing-lg);
  border-radius: var(--border-radius-md);
  font-weight: 600;
  transition: var(--transition-normal);
  cursor: pointer;
  border: none;
}

.btn-primary {
  background-color: var(--accent-color);
  color: var(--text-color);
}

.btn-primary:hover {
  background-color: var(--primary-color);
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
}

.btn-secondary {
  background-color: transparent;
  color: var(--text-color);
  border: 2px solid var(--accent-color);
}

.btn-secondary:hover {
  background-color: var(--accent-color);
  color: var(--text-color);
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
}

/* Footer */
.footer {
  background-color: var(--bg-secondary);
  padding: var(--spacing-xl) 0;
  margin-top: auto;
}

.footer-content {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: var(--spacing-xl);
}

.footer-column h4 {
  margin-bottom: var(--spacing-lg);
  position: relative;
  display: inline-block;
}

.footer-column h4::after {
  content: "";
  position: absolute;
  bottom: -5px;
  left: 0;
  width: 30px;
  height: 2px;
  background-color: var(--accent-color);
}

.footer-links a {
  display: block;
  margin-bottom: var(--spacing-sm);
  color: var(--text-secondary);
}

.footer-links a:hover {
  color: var(--text-color);
  padding-left: var(--spacing-sm);
}

.footer-bottom {
  margin-top: var(--spacing-xl);
  padding-top: var(--spacing-lg);
  border-top: 1px solid var(--border-color);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.copyright {
  color: var(--text-secondary);
}

.social-links {
  display: flex;
  gap: var(--spacing-md);
}

.social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: var(--secondary-color);
  transition: var(--transition-normal);
}

.social-link:hover {
  background-color: var(--accent-color);
  transform: translateY(-3px);
}

/* Responsive styles */
@media (max-width: 992px) {
  :root {
    --header-height: 70px;
  }

  .nav-links {
    position: fixed;
    top: var(--header-height);
    left: -100%;
    width: 100%;
    height: calc(100vh - var(--header-height));
    background-color: var(--bg-color);
    flex-direction: column;
    padding: var(--spacing-xl);
    transition: var(--transition-normal);
    z-index: var(--z-high);
  }

  .nav-links.active {
    left: 0;
  }

  .mobile-menu-toggle {
    display: block;
  }

  .hero-image {
    opacity: 0.4;
  }
}

@media (max-width: 768px) {
  :root {
    --header-height: 60px;
  }

  .section {
    padding: var(--spacing-lg) 0;
  }

  .hero {
    text-align: center;
    padding-top: calc(var(--header-height) + var(--spacing-xl));
    height: auto;
  }

  .hero-content {
    margin: 0 auto;
  }

  .hero-title {
    font-size: clamp(2rem, 8vw, 3rem);
  }

  .footer-bottom {
    flex-direction: column;
    gap: var(--spacing-lg);
  }
}

@media (max-width: 576px) {
  .container {
    padding: 0 var(--spacing-md);
  }

  h1 {
    font-size: var(--font-size-2xl);
  }

  h2 {
    font-size: var(--font-size-xl);
  }

  h3 {
    font-size: var(--font-size-lg);
  }
}

/* Animation classes */
.fade-in {
  animation: fadeIn 1s ease forwards;
}

.slide-up {
  animation: slideUp 0.8s ease forwards;
}

.slide-in-left {
  animation: slideInLeft 0.8s ease forwards;
}

.slide-in-right {
  animation: slideInRight 0.8s ease forwards;
}

.zoom-in {
  animation: zoomIn 0.8s ease forwards;
}

/* Animations */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(50px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slideInLeft {
  from {
    opacity: 0;
    transform: translateX(-50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes zoomIn {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* Utility classes */
.text-center { text-align: center; }
.mt-1 { margin-top: var(--spacing-sm); }
.mt-2 { margin-top: var(--spacing-md); }
.mt-3 { margin-top: var(--spacing-lg); }
.mt-4 { margin-top: var(--spacing-xl); }
.mt-5 { margin-top: var(--spacing-2xl); }
.mb-1 { margin-bottom: var(--spacing-sm); }
.mb-2 { margin-bottom: var(--spacing-md); }
.mb-3 { margin-bottom: var(--spacing-lg); }
.mb-4 { margin-bottom: var(--spacing-xl); }
.mb-5 { margin-bottom: var(--spacing-2xl); }

/* Custom Sections */
.geometric-feature {
  position: relative;
  overflow: hidden;
  background-color: var(--bg-secondary);
  border-radius: var(--border-radius-lg);
  padding: var(--spacing-lg);
  transition: var(--transition-normal);
  z-index: 1;
}

.geometric-feature::before {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(
    to right,
    rgba(100, 100, 100, 0.1),
    rgba(100, 100, 100, 0.05),
    rgba(100, 100, 100, 0.02)
  );
  transform: rotate(45deg);
  z-index: -1;
  transition: var(--transition-slow);
}

.geometric-feature:hover::before {
  transform: rotate(55deg);
}

.geometric-feature:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-lg);
}

.split-section {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--spacing-xl);
  align-items: center;
}

@media (max-width: 768px) {
  .split-section {
    grid-template-columns: 1fr;
  }
}

.course-card {
  background-color: var(--bg-secondary);
  border-radius: var(--border-radius-md);
  overflow: hidden;
  transition: var(--transition-normal);
}

.course-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-md);
}

.course-image {
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.course-content {
  padding: var(--spacing-lg);
}

.course-tag {
  display: inline-block;
  padding: var(--spacing-xs) var(--spacing-sm);
  background-color: rgba(100, 100, 100, 0.2);
  border-radius: var(--border-radius-sm);
  font-size: var(--font-size-xs);
  margin-bottom: var(--spacing-sm);
}

.course-stats {
  display: flex;
  gap: var(--spacing-md);
  margin-top: var(--spacing-md);
  color: var(--text-secondary);
  font-size: var(--font-size-sm);
}

.course-stat {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
}

.timeline {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
}

.timeline::after {
  content: '';
  position: absolute;
  width: 2px;
  background-color: var(--border-color);
  top: 0;
  bottom: 0;
  left: 50%;
  margin-left: -1px;
}

.timeline-item {
  padding: var(--spacing-lg) 0;
  position: relative;
  width: 50%;
}

.timeline-item:nth-child(odd) {
  left: 0;
  padding-right: var(--spacing-xl);
}

.timeline-item:nth-child(even) {
  left: 50%;
  padding-left: var(--spacing-xl);
}

.timeline-item::after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  background-color: var(--accent-color);
  border-radius: 50%;
  top: 50%;
  right: -8px;
  transform: translateY(-50%);
  z-index: 1;
}

.timeline-item:nth-child(even)::after {
  left: -8px;
}

.timeline-content {
  background-color: var(--bg-secondary);
  padding: var(--spacing-lg);
  border-radius: var(--border-radius-md);
  box-shadow: var(--shadow-md);
}

@media (max-width: 768px) {
  .timeline::after {
    left: 31px;
  }
  
  .timeline-item {
    width: 100%;
    padding-left: var(--spacing-xl);
    padding-right: 0;
    left: 0 !important;
  }
  
  .timeline-item::after {
    left: 23px !important;
  }
}

/* 3D Transform Effects */
.transform-3d {
  perspective: 1000px;
  transform-style: preserve-3d;
}

.transform-3d-card {
  transition: transform 0.6s;
  transform: rotateY(0);
}

.transform-3d:hover .transform-3d-card {
  transform: rotateY(10deg);
}

/* Gradient text */
.gradient-text {
  background: linear-gradient(90deg, var(--accent-color), var(--text-color));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
}

/* Glassmorphism */
.glass-card {
  background: rgba(21, 21, 21, 0.7);
  backdrop-filter: blur(10px);
  border-radius: var(--border-radius-md);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

/* =======================
   Premium Accent for Sections
   ======================= */
.hero--premium,
.path--premium {
  --neo-1: #7c4dff;        /* фиолетовый неон */
  --neo-2: #00e5ff;        /* циан неон */
  --neo-3: #9c27b0;        /* глубокий фиолетовый */
  --neo-text-dim: rgba(245,245,245,0.7);
}

/* =======================
   HERO
   ======================= */
.hero--premium {
  position: relative;
  overflow: clip;
  padding-top: calc(var(--header-height) + var(--spacing-2xl));
  padding-bottom: var(--spacing-2xl);
}

.hero--premium .hero__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.hero--premium .hero__grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  align-items: center;
  gap: clamp(var(--spacing-xl), 6vw, var(--spacing-2xl));
}

@media (max-width: 992px) {
  .hero--premium .hero__grid {
    grid-template-columns: 1fr;
    text-align: left;
  }
}

.hero--premium .hero__orb {
  position: absolute;
  width: 40vmax;
  height: 40vmax;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.35;
  z-index: 0;
}

.hero--premium .hero__orb--1 {
  background: radial-gradient(closest-side, var(--neo-1), transparent 70%);
  top: -10%;
  left: -10%;
  animation: floatUp 8s ease-in-out infinite alternate;
}

.hero--premium .hero__orb--2 {
  background: radial-gradient(closest-side, var(--neo-2), transparent 70%);
  bottom: -15%;
  right: -10%;
  animation: floatUp 10s ease-in-out infinite alternate-reverse;
}

.hero--premium .hero__grid::before {
  /* мягкая линейная подсветка */
  content: "";
  position: absolute;
  inset: -20%;
  background: radial-gradient(60% 60% at 20% 30%, rgba(124,77,255,.25), transparent 60%),
              radial-gradient(50% 50% at 80% 70%, rgba(0,229,255,.2), transparent 60%);
  z-index: 0;
}

.hero--premium .hero__grid,
.hero--premium .hero-content,
.hero--premium .hero-visual {
  position: relative;
  z-index: 1;
}

.hero--premium .hero__grid .hero__grid { z-index: 1; } /* страховка для вложенности */

.hero--premium .hero__grid .hero__grid { z-index: 1; } /* duplicate-safe */

.hero--premium .hero__grid .hero__grid { z-index: 1; }

.hero--premium .hero__grid .hero__grid { z-index: 1; } /* (безопасно, не влияет) */

.hero--premium .hero__bg .hero__grid { z-index: 0; }



/* Контент */
.hero--premium .hero-title {
  letter-spacing: 0.2px;
}

.hero--premium .hero-description {
  color: var(--neo-text-dim);
  max-width: 56ch;
  margin-bottom: var(--spacing-xl);
}

.hero--premium .btn--lg {
  padding: calc(var(--spacing-md) + 2px) calc(var(--spacing-xl) + 6px);
  font-size: var(--font-size-lg);
}

.hero--premium .btn-primary {
  background: linear-gradient(90deg, var(--neo-1), var(--neo-2));
  border: none;
  box-shadow: 0 10px 30px rgba(124,77,255,.25), 0 6px 18px rgba(0,229,255,.15);
}

.hero--premium .btn-primary:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 36px rgba(124,77,255,.35), 0 8px 22px rgba(0,229,255,.22);
}

.hero--premium .btn-secondary {
  border: 2px solid rgba(255,255,255,0.12);
}

.hero--premium .hero-buttons {
  display: flex;
  gap: var(--spacing-md);
  flex-wrap: wrap;
  margin-bottom: var(--spacing-lg);
}

.hero--premium .hero-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: var(--spacing-md);
  color: var(--neo-text-dim);
}

.hero--premium .hero-stats li {
  background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02));
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--border-radius-md);
  padding: var(--spacing-md);
}

.hero--premium .hero-stats strong {
  display: block;
  color: var(--text-color);
}

@media (max-width: 768px) {
  .hero--premium .hero-stats {
    grid-template-columns: 1fr;
  }
}

/* Визуал справа */
.hero--premium .hero-visual {
  display: grid;
  place-items: center;
}

.hero--premium .hero-visual__card {
  position: relative;
  width: clamp(280px, 40vw, 520px);
  aspect-ratio: 4 / 3;
  overflow: hidden;
}

.hero--premium .hero-visual__ring {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 120%;
  height: 120%;
  background: conic-gradient(from 0deg, var(--neo-1), var(--neo-2), var(--neo-1));
  mask: radial-gradient(closest-side, transparent 58%, #000 60%);
  animation: rotate 16s linear infinite;
  opacity: .45;
}

.hero--premium .hero-visual__mesh {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(120% 120% at 0% 0%, rgba(124,77,255,.18), transparent 60%),
    radial-gradient(120% 120% at 100% 100%, rgba(0,229,255,.18), transparent 60%),
    repeating-linear-gradient( to right, rgba(255,255,255,.06) 0 1px, transparent 1px 60px),
    repeating-linear-gradient( to bottom, rgba(255,255,255,.05) 0 1px, transparent 1px 60px);
  mix-blend-mode: screen;
}

.hero--premium .hero-visual__label {
  position: absolute;
  left: var(--spacing-lg);
  bottom: var(--spacing-lg);
  font-size: var(--font-size-sm);
  color: var(--neo-text-dim);
  background: rgba(10,10,10,.6);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  padding: 8px 14px;
  backdrop-filter: blur(6px);
}

/* =======================
   TIMELINE (Premium)
   ======================= */
.timeline--premium {
  position: relative;
  padding-top: var(--spacing-xl);
}

.timeline--premium .timeline__bar {
  position: relative;
  width: 100%;
  height: 4px;
  background: rgba(255,255,255,0.08);
  border-radius: 999px;
  overflow: hidden;
  margin: 0 auto var(--spacing-2xl);
}

.timeline--premium .timeline__progress {
  position: absolute;
  height: 100%;
  width: 0%;
  left: 0;
  top: 0;
  background: linear-gradient(90deg, var(--neo-1), var(--neo-2));
  transition: width 1.2s cubic-bezier(.2,.7,.2,1);
}

/* Используем твою структуру items, но делаем сетку с карточками */
.timeline--premium .timeline-item {
  width: auto;
  left: auto !important;
  padding: 0;
}

.timeline--premium .timeline-content {
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.03));
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--border-radius-lg);
  padding: var(--spacing-xl);
  box-shadow: var(--shadow-md);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow);
}

.timeline--premium .timeline-content:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
}

.timeline--premium .path-number {
  position: absolute;
  top: -14px;
  left: -14px;
  background: linear-gradient(90deg, var(--neo-1), var(--neo-2));
  color: #0a0a0a;
  font-weight: 700;
  border-radius: 12px;
  padding: 6px 10px;
  line-height: 1;
  font-size: var(--font-size-sm);
  box-shadow: 0 10px 20px rgba(124,77,255,.25);
}

.timeline--premium .timeline h3 {
  margin-bottom: var(--spacing-sm);
}

.timeline--premium .timeline p {
  color: var(--neo-text-dim);
}

/* Сетка для карточек таймлайна */
.timeline--premium .timeline {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--spacing-xl);
  position: relative;
}

@media (max-width: 1200px) {
  .timeline--premium .timeline {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .timeline--premium .timeline {
    grid-template-columns: 1fr;
  }
}

/* Активация прогресс-бара при появлении */
.timeline--premium.reveal.active .timeline__progress {
  width: 100%;
}
/* =======================
   Premium palette for these sections
   ======================= */
.courses--premium,
.features--premium {
  --neo-1: #7c4dff;
  --neo-2: #00e5ff;
  --neo-3: #9c27b0;
  --neo-dim: rgba(245,245,245,.7);
}

/* =======================
   COURSES GRID (Premium)
   ======================= */
.courses--premium .courses-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--spacing-xl);
}

@media (max-width: 1200px) {
  .courses--premium .courses-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 640px) {
  .courses--premium .courses-grid {
    grid-template-columns: 1fr;
  }
}

.category-card {
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--border-radius-lg);
  padding: calc(var(--spacing-lg) + 2px);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);
  box-shadow: var(--shadow-md);
  overflow: hidden;
}

.category-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
  border-color: rgba(124,77,255,.35);
}

.category-title {
  margin-bottom: var(--spacing-sm);
  letter-spacing: .2px;
}

.category-desc {
  color: var(--neo-dim);
  max-width: 56ch;
}

/* Неоновая тонкая лента в углу карточки */
.category-card .category-accent {
  position: absolute;
  right: -20px;
  top: -20px;
  width: 160px;
  height: 160px;
  background: conic-gradient(from 0deg, var(--neo-1), var(--neo-2), var(--neo-1));
  filter: blur(26px);
  opacity: .18;
  transform: rotate(25deg);
  pointer-events: none;
}

/* =======================
   FEATURES (Premium)
   ======================= */
.features--premium .feature-card {
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--border-radius-lg);
  padding: var(--spacing-xl);
  box-shadow: var(--shadow-md);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);
}

.features--premium .feature-card + .feature-card {
  margin-top: var(--spacing-xl);
}

.features--premium .feature-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
  border-color: rgba(0,229,255,.28);
}

.features--premium .feature-card h3 {
  margin-bottom: var(--spacing-xs);
}

.features--premium .feature-card p {
  color: var(--neo-dim);
  max-width: 60ch;
}

/* Иконка в кольце */
.features--premium .feature-icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  margin-bottom: var(--spacing-md);
  color: #e9e9e9;
}

.features--premium .feature-icon--ring {
  background:
    radial-gradient(closest-side, rgba(255,255,255,.08), rgba(255,255,255,.02)),
    conic-gradient(from 0deg, var(--neo-1), var(--neo-2), var(--neo-1));
  mask: radial-gradient(closest-side, transparent 60%, #000 63%);
  position: relative;
}

.features--premium .feature-icon--ring::after {
  content: "";
  position: absolute;
  inset: 7px;
  border-radius: 50%;
  background: rgba(21,21,21,.75);
  border: 1px solid rgba(255,255,255,.08);
}

/* Микро-акцент для заголовка при hover карточки */
.features--premium .feature-card:hover h3 {
  background: linear-gradient(90deg, var(--neo-1), var(--neo-2));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
}

/* =======================
   3D tilt (используем твою основу)
   ======================= */
.transform-3d { perspective: 1200px; }
.transform-3d-card { transition: transform .6s; transform: rotateY(0); }
.transform-3d:hover .transform-3d-card { transform: rotateY(10deg); }
/* =======================
   PREMIUM: Testimonials
   ======================= */
.testimonials--premium {
  --neo-1: #7c4dff;
  --neo-2: #00e5ff;
  --dim: rgba(245,245,245,.75);
}

.testimonials {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: var(--spacing-md);
}

.testimonials__viewport {
  overflow: hidden;
  border-radius: var(--border-radius-lg);
}

.testimonials__track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: min(100%, 760px);
  gap: var(--spacing-xl);
  padding: var(--spacing-lg);
  will-change: transform;
  transition: transform var(--transition-slow);
}

.testimonial-card {
  position: relative;
  padding: clamp(var(--spacing-lg), 4vw, var(--spacing-2xl));
  border-radius: var(--border-radius-xl);
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  box-shadow: var(--shadow-md);
  min-height: 240px;
}

.tcard__quote {
  position: absolute;
  top: 14px;
  left: 18px;
  font-size: 56px;
  line-height: .6;
  background: linear-gradient(90deg, var(--neo-1), var(--neo-2));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  opacity: .65;
  pointer-events: none;
}

.tcard__text {
  color: var(--text-color);
  margin-left: 8px;
  margin-bottom: var(--spacing-xl);
}

.tcard__author {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: var(--spacing-md);
  align-items: center;
}

.tcard__avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background:
    radial-gradient(closest-side, rgba(124,77,255,.6), transparent 70%),
    radial-gradient(closest-side, rgba(0,229,255,.5), transparent 70%);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 8px 22px rgba(0,0,0,.35);
}

.author-name { font-weight: 700; }
.author-position { color: var(--dim); font-size: var(--font-size-sm); }

.tnav {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(21,21,21,.6);
  color: var(--text-color);
  transition: transform var(--transition-normal), background var(--transition-normal);
}
.tnav:hover { transform: translateY(-2px); background: rgba(21,21,21,.8); }

.tdots {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: var(--spacing-md);
}
.tdots::before, .tdots::after, .tdots span {
  content: "";
  width: 6px; height: 6px; border-radius: 999px;
  background: rgba(255,255,255,.25);
}
.tdots span.active, .tdots::before.active, .tdots::after.active {
  background: linear-gradient(90deg, var(--neo-1), var(--neo-2));
}

/* =======================
   PREMIUM: Tech Showcase
   ======================= */
.tech--premium {
  --neo-1: #7c4dff;
  --neo-2: #00e5ff;
  --dim: rgba(245,245,245,.75);
}

.tech-marquee {
  position: relative;
  overflow: hidden;
  border-radius: var(--border-radius-lg);
  background:
    radial-gradient(60% 60% at 15% 30%, rgba(124,77,255,.10), transparent 60%),
    radial-gradient(50% 50% at 85% 70%, rgba(0,229,255,.10), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.08);
  padding: var(--spacing-xl);
}

.tech-row {
  display: inline-flex;
  align-items: center;
  gap: clamp(var(--spacing-xl), 5vw, var(--spacing-2xl));
  padding: var(--spacing-md) 0;
  animation: marqueeScroll 28s linear infinite;
  will-change: transform;
}

.tech-row--clone {
  /* клонируется JS-ом, чтобы создать бесшовную ленту */
}

@keyframes marqueeScroll {
  to { transform: translateX(-50%); }
}

.tech-item {
  display: grid;
  justify-items: center;
  gap: var(--spacing-sm);
  min-width: 160px;
  padding: var(--spacing-md) var(--spacing-lg);
  border-radius: var(--border-radius-md);
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.08);
  transition: transform var(--transition-normal), box-shadow var(--transition-normal), border-color var(--transition-normal);
}

.tech-item:hover {
  transform: translateY(-4px) scale(1.02);
  border-color: rgba(124,77,255,.3);
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
}

.tech-item svg { filter: drop-shadow(0 6px 16px rgba(0,0,0,.25)); }
.tech-item span { color: var(--dim); font-weight: 600; }

/* На мобильных делаем сетку вместо бесконечной ленты: */
@media (max-width: 768px) {
  .tech-marquee { padding: var(--spacing-lg); }
  .tech-row { 
    animation: none; 
    display: grid; 
    grid-template-columns: repeat(2, 1fr); 
    gap: var(--spacing-lg);
  }
}
/* =======================
   FAQ (Premium)
   ======================= */
.faq--premium { --neo-1:#7c4dff; --neo-2:#00e5ff; --dim:rgba(245,245,245,.75); }

.faq--premium .accordion {
  display: grid;
  gap: var(--spacing-lg);
}

.faq--premium .accordion-item {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--border-radius-lg);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  overflow: hidden;
  transition: box-shadow var(--transition-slow), border-color var(--transition-slow);
}

.faq--premium .accordion-item:is(:hover, .open) {
  border-color: rgba(124,77,255,.35);
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
}

.faq--premium .accordion-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-lg);
  padding: var(--spacing-lg) var(--spacing-xl);
  cursor: pointer;
  user-select: none;
}

.faq--premium .accordion-title h3 { margin: 0; }

.faq--premium .accordion-icon {
  width: 28px; height: 28px;
  display: grid; place-items: center;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--neo-1), var(--neo-2));
  color: #0a0a0a; font-weight: 800;
  transition: transform var(--transition-fast);
}

.faq--premium .accordion-item.open .accordion-icon { transform: rotate(45deg); }

.faq--premium .accordion-content {
  max-height: 0;
  overflow: hidden;
  padding: 0 var(--spacing-xl);
  transition: max-height var(--transition-slow), padding var(--transition-slow);
  color: var(--dim);
}

.faq--premium .accordion-item.open .accordion-content {
  padding: 0 var(--spacing-xl) var(--spacing-xl);
}

/* =======================
   TOOLS (Premium)
   ======================= */
.tools--premium { --neo-1:#7c4dff; --neo-2:#00e5ff; --dim:rgba(245,245,245,.75); }

.tools--premium .tools-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: var(--spacing-xl);
}

@media (max-width: 1200px) {
  .tools--premium .tools-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 640px) {
  .tools--premium .tools-grid { grid-template-columns: 1fr; }
}

.tool-card {
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--border-radius-lg);
  box-shadow: var(--shadow-md);
  overflow: hidden;
  transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);
}

.tool-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
  border-color: rgba(0,229,255,.28);
}

.tool-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--spacing-md) var(--spacing-lg);
  border-bottom: 1px solid rgba(255,255,255,.06);
}

.tool-header h3 { margin: 0; }

.tool-buttons { display: flex; gap: 8px; }
.tool-btn { width: 12px; height: 12px; border-radius: 50%; display: inline-block; opacity: .9; }
.tool-btn--red { background:#ff5f56; }
.tool-btn--yellow { background:#ffbd2e; }
.tool-btn--green { background:#27c93f; }

.tool-content { padding: var(--spacing-xl); }

.code-display, .terminal-display, .design-display {
  background: rgba(10,10,10,.45);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--border-radius-md);
  padding: var(--spacing-lg);
  position: relative;
}

.code-display code, .terminal-display code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

.code-keyword { color:#79b8ff; }
.code-fn { color:#c792ea; }
.code-param { color:#f78c6c; }
.code-str { color:#ecc48d; }

.terminal-display code { color:#c8e6c9; }

.design-display {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--spacing-md);
  height: 160px;
}

.design-display .design-element {
  border-radius: var(--border-radius-md);
  background:
    radial-gradient(closest-side, rgba(124,77,255,.28), transparent 60%),
    radial-gradient(closest-side, rgba(0,229,255,.22), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.08);
  animation: floatUp 6s ease-in-out infinite alternate;
}
.design-display .design-element:nth-child(2) { animation-duration: 7.5s; }
.design-display .design-element:nth-child(3) { animation-duration: 9s; }

/* =======================
   CTA (Premium)
   ======================= */
.cta--premium {
  position: relative;
  overflow: clip;
  padding: calc(var(--spacing-2xl)) 0;
}

.cta--premium .cta-bg {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(60% 60% at 15% 30%, rgba(124,77,255,.16), transparent 60%),
    radial-gradient(60% 60% at 85% 70%, rgba(0,229,255,.14), transparent 60%);
}

.cta--premium .cta-orb {
  position: absolute; width: 40vmax; height: 40vmax; border-radius: 50%;
  filter: blur(80px); opacity: .35;
}
.cta--premium .cta-orb--1 { top:-20%; left:-10%; background: radial-gradient(closest-side, #7c4dff, transparent 70%); animation: floatUp 10s ease-in-out infinite alternate; }
.cta--premium .cta-orb--2 { bottom:-20%; right:-10%; background: radial-gradient(closest-side, #00e5ff, transparent 70%); animation: floatUp 12s ease-in-out infinite alternate-reverse; }

.cta--premium .cta-content {
  position: relative;
  z-index: 1;
  text-align: center;
  padding: clamp(var(--spacing-xl), 4vw, var(--spacing-2xl));
  border: 1px solid rgba(255,255,255,.1);
}

.cta--premium .btn--lg { padding: calc(var(--spacing-md) + 2px) calc(var(--spacing-xl) + 6px); font-size: var(--font-size-lg); }
.cta--premium .btn-primary {
  background: linear-gradient(90deg, #7c4dff, #00e5ff);
  border: none;
  box-shadow: 0 10px 30px rgba(124,77,255,.25), 0 6px 18px rgba(0,229,255,.15);
}
.cta--premium .btn-primary:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 36px rgba(124,77,255,.35), 0 8px 22px rgba(0,229,255,.22);
}
/* =======================
   ABOUT — Premium
   ======================= */
.page-hero--premium,
.about-story--premium,
.about-mission--premium {
  --neo-1: #7c4dff;
  --neo-2: #00e5ff;
  --neo-dim: rgba(245,245,245,.75);
}

/* Page Hero */
.page-hero--premium {
  position: relative;
  overflow: clip;
  padding-top: calc(var(--header-height) + var(--spacing-2xl));
  padding-bottom: var(--spacing-2xl);
}

.page-hero--premium .page-hero__bg {
  position: absolute; inset: 0; pointer-events: none;
}

.page-hero--premium .page-hero__orb {
  position: absolute;
  width: 40vmax; height: 40vmax; border-radius: 50%;
  filter: blur(80px); opacity: .35;
}
.page-hero--premium .page-hero__orb--1 {
  top:-15%; left:-10%;
  background: radial-gradient(closest-side, var(--neo-1), transparent 70%);
  animation: floatUp 10s ease-in-out infinite alternate;
}
.page-hero--premium .page-hero__orb--2 {
  bottom:-20%; right:-10%;
  background: radial-gradient(closest-side, var(--neo-2), transparent 70%);
  animation: floatUp 12s ease-in-out infinite alternate-reverse;
}

/* декоративная сетка (тонкая) */
.page-hero--premium .page-hero__grid {
  position: absolute; inset: 0; opacity: .08;
  background:
    repeating-linear-gradient( to right, rgba(255,255,255,.8) 0 1px, transparent 1px 48px),
    repeating-linear-gradient( to bottom, rgba(255,255,255,.8) 0 1px, transparent 1px 48px);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.6), transparent 80%);
}

.page-hero-stats {
  margin-top: var(--spacing-xl);
  display: grid;
  grid-template-columns: repeat(3, minmax(160px,1fr));
  gap: var(--spacing-lg);
  justify-content: center;
}
.page-hero-stats li {
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--border-radius-md);
  padding: var(--spacing-md) var(--spacing-lg);
}
.page-hero-stats strong {
  display:block; font-size: var(--font-size-xl); color: var(--text-color);
}
.page-hero-stats span {
  color: var(--neo-dim); font-size: var(--font-size-sm);
}

@media (max-width: 768px) {
  .page-hero-stats { grid-template-columns: 1fr; }
}

/* Our Story */
.about-story--premium .about-visual {
  position: relative;
  overflow: hidden;
}
.about-story--premium .about-image {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  aspect-ratio: 4/3;
  border-radius: var(--border-radius-md);
}
.about-story--premium .about-visual__ring {
  position: absolute; inset: -10%;
  background: conic-gradient(from 0deg, var(--neo-1), var(--neo-2), var(--neo-1));
  mask: radial-gradient(closest-side, transparent 58%, #000 60%);
  opacity: .3;
  animation: rotate 18s linear infinite;
  pointer-events: none;
}

.about-milestones {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: var(--spacing-md);
  margin-top: var(--spacing-lg);
}
.about-milestones .milestone {
  display: grid; grid-template-columns: auto 1fr; gap: var(--spacing-sm); align-items: center;
  padding: var(--spacing-sm) var(--spacing-md);
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
}
.milestone-year {
  background: linear-gradient(90deg, var(--neo-1), var(--neo-2));
  color: #0a0a0a; font-weight: 700; font-size: var(--font-size-sm);
  border-radius: 999px; padding: 6px 10px; line-height: 1;
}
.milestone-text { color: var(--neo-dim); font-size: var(--font-size-sm); }

@media (max-width: 992px) {
  .about-milestones { grid-template-columns: 1fr; }
}

/* Mission */
.about-mission--premium {
  position: relative; overflow: clip;
}
.about-mission--premium .about-mission__bg {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(60% 60% at 20% 30%, rgba(124,77,255,.16), transparent 60%),
    radial-gradient(60% 60% at 80% 70%, rgba(0,229,255,.14), transparent 60%);
}
.about-mission--premium .about-mission__orb {
  position: absolute; width: 36vmax; height: 36vmax; border-radius: 50%;
  filter: blur(80px); opacity: .3;
}
.about-mission--premium .about-mission__orb--1 { top:-25%; left:-10%; background: radial-gradient(closest-side, var(--neo-1), transparent 70%); animation: floatUp 11s ease-in-out infinite alternate; }
.about-mission--premium .about-mission__orb--2 { bottom:-25%; right:-10%; background: radial-gradient(closest-side, var(--neo-2), transparent 70%); animation: floatUp 13s ease-in-out infinite alternate-reverse; }

.about-mission--premium .mission-content.glass-card,
.about-mission--premium .mission-content {
  border: 1px solid rgba(255,255,255,.1);
  padding: clamp(var(--spacing-xl), 4vw, var(--spacing-2xl));
}
.about-mission--premium .mission-statement .large-text {
  font-size: clamp(1.125rem, 1rem + 1vw, 1.5rem);
  color: var(--text-color);
}
.about-mission--premium .mission-sub {
  margin-top: var(--spacing-md);
  color: var(--neo-dim);
  font-size: var(--font-size-sm);
}
/* =======================
   VALUES (Premium)
   ======================= */
.values--premium { --neo-1:#7c4dff; --neo-2:#00e5ff; --dim:rgba(245,245,245,.75); }

.values--premium .values-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: var(--spacing-xl);
}
@media (max-width: 1200px) { .values--premium .values-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 640px) { .values--premium .values-grid { grid-template-columns: 1fr; } }

.values--premium .value-card {
  padding: var(--spacing-xl);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--border-radius-lg);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);
  box-shadow: var(--shadow-md);
}
.values--premium .value-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
  border-color: rgba(124,77,255,.35);
}

.values--premium .value-icon {
  width: 54px; height: 54px; border-radius: 50%;
  display: grid; place-items: center;
  margin-bottom: var(--spacing-md);
  color: #eaeaea;
}
.values--premium .value-icon--ring {
  background:
    radial-gradient(closest-side, rgba(255,255,255,.08), rgba(255,255,255,.02)),
    conic-gradient(from 0deg, var(--neo-1), var(--neo-2), var(--neo-1));
  mask: radial-gradient(closest-side, transparent 60%, #000 63%);
  position: relative;
}
.values--premium .value-icon--ring::after {
  content:""; position:absolute; inset:7px; border-radius:50%;
  background: rgba(21,21,21,.75); border: 1px solid rgba(255,255,255,.08);
}

.values--premium .value-card h3 { margin-bottom: var(--spacing-xs); }
.values--premium .value-card p { color: var(--dim); }

/* =======================
   TEAM (Premium)
   ======================= */
.team--premium { --neo-1:#7c4dff; --neo-2:#00e5ff; --dim:rgba(245,245,245,.75); }

.team--premium .team-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: var(--spacing-xl);
}
@media (max-width: 1200px) { .team--premium .team-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 640px) { .team--premium .team-grid { grid-template-columns: 1fr; } }

.team--premium .team-member {
  text-align: center;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--border-radius-lg);
  padding: var(--spacing-xl) var(--spacing-lg);
  box-shadow: var(--shadow-md);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);
}
.team--premium .team-member:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
  border-color: rgba(0,229,255,.28);
}

.team--premium .member-photo {
  width: 112px; height: 112px; margin: 0 auto var(--spacing-md);
  border-radius: 50%;
  overflow: hidden; position: relative;
  border: 2px solid rgba(255,255,255,.12);
  box-shadow: 0 8px 24px rgba(0,0,0,.35);
}
.team--premium .member-photo img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.team--premium h3 { margin-bottom: var(--spacing-xs); }
.team--premium .member-position { color: var(--dim); font-size: var(--font-size-sm); }

/* =======================
   STATS (Premium)
   ======================= */
.stats--premium { --neo-1:#7c4dff; --neo-2:#00e5ff; --dim:rgba(245,245,245,.8); }

.stats--premium .stats-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: var(--spacing-xl);
}
@media (max-width: 1200px) { .stats--premium .stats-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 640px) { .stats--premium .stats-grid { grid-template-columns: 1fr; } }

.stats--premium .stat-card {
  text-align: center;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--border-radius-lg);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  padding: var(--spacing-xl);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);
}
.stats--premium .stat-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
  border-color: rgba(124,77,255,.35);
}

.stats--premium .stat-number {
  font-size: clamp(2rem, 1.3rem + 2.5vw, 3rem);
  font-weight: 800;
  line-height: 1;
  margin-bottom: var(--spacing-sm);
  background: linear-gradient(90deg, var(--neo-1), var(--neo-2));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
}
.stats--premium .stat-label { color: var(--dim); font-size: var(--font-size-sm); }
.member-emoji {
  font-size: 3rem;
  margin-bottom: var(--spacing-md);
  display: inline-block;
}
/* =======================
   WHY US — Premium
   ======================= */
.whyus-hero--premium,
.whyus-overview--premium,
.methodology--premium {
  --neo-1:#7c4dff;
  --neo-2:#00e5ff;
  --neo-dim:rgba(245,245,245,.75);
}

/* Hero */
.whyus-hero--premium { position: relative; overflow: clip; padding-top: calc(var(--header-height) + var(--spacing-2xl)); padding-bottom: var(--spacing-2xl); }
.whyus-hero--premium .whyus-hero__bg { position:absolute; inset:0; pointer-events:none; }
.whyus-hero--premium .whyus-hero__orb { position:absolute; width:40vmax; height:40vmax; border-radius:50%; filter: blur(80px); opacity:.35; }
.whyus-hero--premium .whyus-hero__orb--1 { top:-20%; left:-10%; background: radial-gradient(closest-side, var(--neo-1), transparent 70%); animation: floatUp 10s ease-in-out infinite alternate; }
.whyus-hero--premium .whyus-hero__orb--2 { bottom:-20%; right:-10%; background: radial-gradient(closest-side, var(--neo-2), transparent 70%); animation: floatUp 12s ease-in-out infinite alternate-reverse; }
.whyus-hero--premium .whyus-hero__grid {
  position:absolute; inset:0; opacity:.08;
  background:
    repeating-linear-gradient(to right, rgba(255,255,255,.8) 0 1px, transparent 1px 48px),
    repeating-linear-gradient(to bottom, rgba(255,255,255,.8) 0 1px, transparent 1px 48px);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.6), transparent 80%);
}

/* Overview split */
.whyus-overview--premium .whyus-visual { position: relative; overflow: hidden; }
.whyus-overview--premium .whyus-image {
  width: 100%; display: block; object-fit: cover; aspect-ratio: 4/3; border-radius: var(--border-radius-md);
}
.whyus-overview--premium .whyus-visual__ring {
  position:absolute; inset:-12%;
  background: conic-gradient(from 0deg, var(--neo-1), var(--neo-2), var(--neo-1));
  mask: radial-gradient(closest-side, transparent 58%, #000 60%);
  opacity:.30; animation: rotate 18s linear infinite; pointer-events:none;
}
.whyus-overview--premium .whyus-visual__label {
  position:absolute; left: var(--spacing-lg); bottom: var(--spacing-lg);
  background: rgba(10,10,10,.55); border:1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(8px); color: var(--neo-dim);
  border-radius: 999px; padding: 8px 14px; font-size: var(--font-size-sm);
}

.whyus-overview--premium .whyus-points {
  display:grid; gap: var(--spacing-sm); margin-top: var(--spacing-lg);
}
.whyus-overview--premium .whyus-points li {
  display:flex; align-items:center; gap:10px; color: var(--neo-dim); font-size: var(--font-size-sm);
}
.whyus-overview--premium .whyus-points li::before {
  content:""; width:10px; height:10px; border-radius:50%;
  background: linear-gradient(135deg, var(--neo-1), var(--neo-2));
  box-shadow: 0 0 0 3px rgba(124,77,255,.15);
}

/* Methodology stepper */
.methodology--premium { position: relative; }
.methodology--premium .methodology-steps {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-xl);
  margin-top: var(--spacing-xl);
}
@media (min-width: 992px) {
  .methodology--premium .methodology-steps {
    grid-template-columns: repeat(5, 1fr);
    align-items: start;
  }
}

/* Track + progress (горизонтально на десктопе, вертикально на мобиле) */
.methodology--premium .methodology__track {
  position: absolute; left: 0; right: 0; top: calc(-1 * var(--spacing-md) + 2px);
  height: 4px; border-radius: 999px;
  background: rgba(255,255,255,.08);
  overflow: hidden;
}
.methodology--premium .methodology__progress {
  position: absolute; left: 0; top: 0; height: 100%; width: 0%;
  background: linear-gradient(90deg, var(--neo-1), var(--neo-2));
  transition: width 1.2s cubic-bezier(.2,.7,.2,1);
}

/* Переключение в вертикаль на мобиле */
@media (max-width: 991.98px) {
  .methodology--premium .methodology__track {
    left: 10px; right: auto; width: 4px; height: calc(100% - 10px); top: 6px;
    background: rgba(255,255,255,.08);
  }
  .methodology--premium .methodology__progress {
    width: 100%; height: 0%; transition: height 1.2s cubic-bezier(.2,.7,.2,1);
  }
}

.methodology--premium .methodology-step {
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--border-radius-lg);
  padding: var(--spacing-lg);
  box-shadow: var(--shadow-md);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);
}
.methodology--premium .methodology-step:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
  border-color: rgba(0,229,255,.28);
}

.methodology--premium .step-number {
  position: relative;
  display: inline-block;
  background: linear-gradient(90deg, var(--neo-1), var(--neo-2));
  color: #0a0a0a; font-weight: 800;
  border-radius: 10px; line-height: 1; padding: 6px 10px;
  margin-bottom: var(--spacing-sm); font-size: var(--font-size-sm);
  box-shadow: 0 10px 20px rgba(124,77,255,.25);
}
.methodology--premium .step-content h3 { margin-bottom: var(--spacing-xs); }
.methodology--premium .step-content p { color: var(--neo-dim); }

/* Активируем прогресс при появлении блока (использует .reveal.active) */
.methodology--premium .methodology-steps.reveal.active .methodology__progress {
  width: 100%;
}
@media (max-width: 991.98px) {
  .methodology--premium .methodology-steps.reveal.active .methodology__progress {
    height: 100%;
  }
}
/* =======================
   ADVANTAGES (Premium)
   ======================= */
.advantages--premium { --neo-1:#7c4dff; --neo-2:#00e5ff; --dim:rgba(245,245,245,.75); }

.advantages--premium .advantages-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: var(--spacing-xl);
}
@media (max-width: 1200px) { .advantages--premium .advantages-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 640px) { .advantages--premium .advantages-grid { grid-template-columns: 1fr; } }

.advantages--premium .advantage-card {
  position: relative;
  border-radius: var(--border-radius-lg);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.08);
  padding: var(--spacing-xl);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);
  box-shadow: var(--shadow-md);
}
.advantages--premium .advantage-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
  border-color: rgba(0,229,255,.28);
}

.advantages--premium .advantage-icon {
  width: 56px; height: 56px; border-radius: 50%;
  display: grid; place-items: center; margin-bottom: var(--spacing-md);
  background:
    radial-gradient(closest-side, rgba(255,255,255,.08), rgba(255,255,255,.02)),
    conic-gradient(from 0deg, var(--neo-1), var(--neo-2), var(--neo-1));
  mask: radial-gradient(closest-side, transparent 60%, #000 63%);
  position: relative;
}
.advantages--premium .advantage-icon::after {
  content: ""; position: absolute; inset: 7px; border-radius: 50%;
  background: rgba(21,21,21,.75); border: 1px solid rgba(255,255,255,.08);
}
.advantages--premium .advantage-card h3 { margin-bottom: var(--spacing-xs); }
.advantages--premium .advantage-card p { color: var(--dim); }

/* =======================
   SUCCESS (Premium Grid)
   ======================= */
.success--premium { --neo-1:#7c4dff; --neo-2:#00e5ff; --dim:rgba(245,245,245,.75); }

.success--premium .testimonials-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: var(--spacing-xl);
}
@media (max-width: 1200px) { .success--premium .testimonials-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 640px) { .success--premium .testimonials-grid { grid-template-columns: 1fr; } }

.success--premium .testimonial-content {
  padding: var(--spacing-xl);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);
}
.success--premium .testimonial-content:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
  border-color: rgba(124,77,255,.28);
}
.success--premium .testimonial-author {
  display: flex; align-items: center; gap: var(--spacing-md); margin-top: var(--spacing-md);
}
.success--premium .author-avatar {
  width: 48px; height: 48px; border-radius: 50%;
  display: grid; place-items: center; font-weight: 800; color: #0a0a0a;
  background: linear-gradient(135deg, var(--neo-1), var(--neo-2));
}
.success--premium .author-name { font-weight: 600; }
.success--premium .author-position { color: var(--dim); font-size: var(--font-size-sm); }

/* =======================
   COMPARISON (Premium Table)
   ======================= */
.compare--premium { --neo-1:#7c4dff; --neo-2:#00e5ff; --dim:rgba(245,245,245,.8); }

.compare--premium .table-responsive {
  width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch;
  border-radius: var(--border-radius-lg);
  border: 1px solid rgba(255,255,255,.08);
}
.compare--premium table {
  width: 100%; border-collapse: collapse; min-width: 720px;
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
}
.compare--premium thead th {
  text-align: left; padding: var(--spacing-md) var(--spacing-lg);
  font-weight: 700; position: relative;
  background: rgba(255,255,255,.04);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.compare--premium thead th.is-brand {
  background: linear-gradient(90deg, rgba(124,77,255,.25), rgba(0,229,255,.15));
}
.compare--premium tbody td {
  padding: var(--spacing-md) var(--spacing-lg);
  border-top: 1px solid rgba(255,255,255,.06);
  color: var(--dim);
}
.compare--premium tbody tr:hover td {
  background: rgba(255,255,255,.03);
}

/* badges */
.compare--premium .badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 28px; height: 28px; border-radius: 999px; font-weight: 700;
  padding: 0 10px;
}
.compare--premium .badge--ok {
  background: linear-gradient(135deg, var(--neo-1), var(--neo-2));
  color: #0a0a0a;
}
.compare--premium .badge--no {
  background: rgba(244,67,54,.2); color: #ff8a80; border: 1px solid rgba(244,67,54,.35);
}
.compare--premium .badge--mid {
  background: rgba(255,255,255,.08); color: var(--text-color);
  border: 1px solid rgba(255,255,255,.12);
}
/* =======================
   CONTACTS — Premium
   ======================= */
.contacts-hero--premium,
.contacts--premium,
.map--premium {
  --neo-1:#7c4dff; --neo-2:#00e5ff; --dim:rgba(245,245,245,.78);
}

/* Hero */
.contacts-hero--premium { position:relative; overflow:clip; padding-top:calc(var(--header-height) + var(--spacing-2xl)); padding-bottom:var(--spacing-2xl); }
.contacts-hero--premium .contacts-hero__bg { position:absolute; inset:0; pointer-events:none; }
.contacts-hero--premium .contacts-hero__orb { position:absolute; width:40vmax; height:40vmax; border-radius:50%; filter:blur(80px); opacity:.35; }
.contacts-hero--premium .contacts-hero__orb--1 { top:-20%; left:-10%; background:radial-gradient(closest-side, var(--neo-1), transparent 70%); animation: floatUp 10s ease-in-out infinite alternate; }
.contacts-hero--premium .contacts-hero__orb--2 { bottom:-20%; right:-10%; background:radial-gradient(closest-side, var(--neo-2), transparent 70%); animation: floatUp 12s ease-in-out infinite alternate-reverse; }
.contacts-hero--premium .contacts-hero__grid {
  position:absolute; inset:0; opacity:.08;
  background:
    repeating-linear-gradient(to right, rgba(255,255,255,.8) 0 1px, transparent 1px 48px),
    repeating-linear-gradient(to bottom, rgba(255,255,255,.8) 0 1px, transparent 1px 48px);
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.6), transparent 80%);
}

/* Layout */
.contacts--premium .contact-container {
  display:grid; gap:var(--spacing-xl);
  grid-template-columns: 1.2fr .8fr;
}
@media (max-width: 992px) {
  .contacts--premium .contact-container { grid-template-columns: 1fr; }
}

/* Form Card */
.contact-card { padding:clamp(var(--spacing-lg), 3vw, var(--spacing-2xl)); }
.contact-form .form-row {
  display:grid; gap:var(--spacing-lg); grid-template-columns: repeat(2,1fr);
}
@media (max-width: 640px) { .contact-form .form-row { grid-template-columns: 1fr; } }

.contact-form .form-group { display:flex; flex-direction:column; gap:8px; }
.contact-form label { font-weight:600; }
.contact-form input,
.contact-form select,
.contact-form textarea {
  width:100%;
  background:rgba(10,10,10,.45);
  border:1px solid rgba(255,255,255,.12);
  border-radius: var(--border-radius-md);
  color:var(--text-color);
  padding:12px 14px;
  transition:border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.contact-form textarea { resize:vertical; }

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus {
  outline:none;
  border-color:rgba(0,229,255,.45);
  box-shadow:0 0 0 3px rgba(0,229,255,.18);
}

.checkbox-label { display:flex; align-items:flex-start; gap:10px; }
.checkbox-label input[type="checkbox"] { margin-top:3px; }

.field-hint { color:var(--dim); font-size:var(--font-size-xs); }
.field-error { color:#ff8a80; font-size:var(--font-size-xs); min-height: 16px; }

/* Submit */
.btn--full { width:100%; margin-top: var(--spacing-md); }

/* Info Cards */
.contact-info {
  display:grid; gap:var(--spacing-lg);
}
.contact-info .info-card {
  padding: var(--spacing-xl);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);
}
.contact-info .info-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
  border-color: rgba(124,77,255,.28);
}
.info-icon {
  font-size: 1.8rem; line-height:1; margin-bottom: var(--spacing-sm);
}
.social-links--row { display:flex; gap:10px; flex-wrap:wrap; }
.social-links--row .social-link {
  width:40px; height:40px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.social-links--row .social-link:hover {
  transform: translateY(-3px);
  border-color: rgba(0,229,255,.4);
  box-shadow: 0 10px 24px rgba(0,0,0,.25);
}

/* Form status */
.form-status {
  margin-bottom: 10px;
  min-height: 22px;
  font-size: var(--font-size-sm);
}
.form-status--ok {
  color:#0bdbb6;
}
.form-status--err {
  color:#ff8a80;
}

/* Map */
.map--premium .map-container {
  display:grid; gap: var(--spacing-xl);
  grid-template-columns: 1.2fr .8fr;
  align-items:start;
}
@media (max-width: 992px) { .map--premium .map-container { grid-template-columns: 1fr; } }

.map--premium .map-placeholder {
  position:relative; border-radius: var(--border-radius-lg);
  border:1px solid rgba(255,255,255,.08);
  overflow:hidden; min-height: 360px;
}
.map--premium .map-bg {
  position:absolute; inset:0;
  background:
    radial-gradient(60% 60% at 15% 30%, rgba(124,77,255,.16), transparent 60%),
    radial-gradient(60% 60% at 85% 70%, rgba(0,229,255,.14), transparent 60%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.06) 0 1px, transparent 1px 40px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.06) 0 1px, transparent 1px 40px);
  filter: saturate(1.1);
}
.map--premium .map-overlay { position:absolute; inset:0; pointer-events:none; }
.map--premium .map-pin {
  position:absolute; left:50%; top:45%; transform: translate(-50%, -50%);
  width: 26px; height: 26px; border-radius: 50%;
  background: linear-gradient(135deg, var(--neo-1), var(--neo-2));
  box-shadow: 0 10px 30px rgba(124,77,255,.35);
  animation: bounce 2.2s infinite;
}
.map--premium .map-pin::after {
  content:""; position:absolute; left:50%; top:100%; transform:translateX(-50%);
  width: 34px; height: 10px; border-radius: 50%;
  background: rgba(0,0,0,.35); filter: blur(6px);
}
.map--premium .map-info {
  position:absolute; right: 16px; bottom: 16px;
  padding: var(--spacing-lg);
  border:1px solid rgba(255,255,255,.12);
}

/* Directions */
.map--premium .directions-info { display:grid; gap: var(--spacing-lg); }
.direction-item { display:flex; gap:12px; align-items:flex-start; }
.direction-icon { font-size:1.25rem; line-height:1; margin-top:4px; }
.direction-content h4 { margin-bottom: 2px; }
.direction-content p { color: var(--dim); }
/* =======================
   FAQ — Premium
   ======================= */
.faq--premium { --neo-1:#7c4dff; --neo-2:#00e5ff; --dim:rgba(245,245,245,.78); }

.faq--premium .accordion {
  display: grid; gap: var(--spacing-lg);
  margin-top: var(--spacing-lg);
}
.faq--premium .accordion-item {
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--border-radius-lg);
  overflow: hidden;
  transition: border-color var(--transition-slow), box-shadow var(--transition-slow), transform var(--transition-slow);
}
.faq--premium .accordion-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(0,0,0,.25);
  border-color: rgba(0,229,255,.28);
}

.faq--premium .accordion-title {
  width: 100%;
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--spacing-md);
  padding: var(--spacing-lg) var(--spacing-xl);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 0; color: var(--text-color);
  cursor: pointer;
  text-align: left;
}
.faq--premium .accordion-title h3 { margin: 0; font-size: var(--font-size-lg); }
.faq--premium .accordion-icon {
  width: 28px; height: 28px; border-radius: 8px;
  display: grid; place-items: center;
  background: linear-gradient(135deg, var(--neo-1), var(--neo-2));
  color: #0a0a0a; font-weight: 800;
  transition: transform .3s ease;
}
.faq--premium .accordion-title[aria-expanded="true"] .accordion-icon { transform: rotate(45deg); }

.faq--premium .accordion-content {
  padding: 0 var(--spacing-xl);
  background: rgba(255,255,255,.03);
  border-top: 1px solid rgba(255,255,255,.06);
  color: var(--dim);
}
.faq--premium .accordion-content-inner {
  padding: var(--spacing-lg) 0;
}

/* плавное раскрытие */
.faq--premium .accordion-content {
  grid-template-rows: 0fr;
  display: grid;
  transition: grid-template-rows .35s ease, padding .35s ease;
}
.faq--premium .accordion-content > * { overflow: hidden; }
.faq--premium .accordion-item.is-open .accordion-content {
  grid-template-rows: 1fr;
}

/* =======================
   Newsletter — Premium
   ======================= */
.newsletter--premium { --neo-1:#7c4dff; --neo-2:#00e5ff; --dim:rgba(245,245,245,.78); }

.newsletter--premium .newsletter-content {
  padding: clamp(var(--spacing-lg), 3vw, var(--spacing-2xl));
}
.newsletter--premium .newsletter-form {
  margin-top: var(--spacing-lg);
}
.newsletter--premium .newsletter-form__row {
  display: grid; grid-template-columns: 1fr auto; gap: var(--spacing-md);
  max-width: 720px; margin: 0 auto;
}
@media (max-width: 576px) {
  .newsletter--premium .newsletter-form__row { grid-template-columns: 1fr; }
}
.newsletter--premium .newsletter-form input[type="email"] {
  width: 100%;
  background: rgba(10,10,10,.45);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--border-radius-md);
  color: var(--text-color);
  padding: 12px 14px;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.newsletter--premium .newsletter-form input[type="email"]:focus {
  outline: none; border-color: rgba(0,229,255,.45);
  box-shadow: 0 0 0 3px rgba(0,229,255,.18);
}
.newsletter--premium .newsletter-error {
  display: block; min-height: 16px; margin-top: 6px;
  color: #ff8a80; font-size: var(--font-size-xs);
}
.newsletter--premium .newsletter-status {
  min-height: 20px; margin-bottom: 6px; font-size: var(--font-size-sm);
}
.newsletter--premium .newsletter-status--ok { color: #0bdbb6; }
.newsletter--premium .newsletter-status--err { color: #ff8a80; }
/* =======================
   PRIVACY — Premium
   ======================= */
.privacy--premium { --neo-1:#7c4dff; --neo-2:#00e5ff; --dim:rgba(245,245,245,.78); }

.privacy--premium .privacy-layout {
  display: grid; gap: var(--spacing-xl);
  grid-template-columns: 300px 1fr;
}
@media (max-width: 992px) {
  .privacy--premium .privacy-layout { grid-template-columns: 1fr; }
}

/* TOC */
.privacy-toc { position: sticky; top: calc(var(--header-height) + 20px); align-self: start; }
.privacy-toc__card { padding: var(--spacing-lg); }
.privacy-toc__title { margin-bottom: var(--spacing-md); }
.privacy-toc__list { display: grid; gap: 8px; counter-reset: p; }
.privacy-toc__list li { display: flex; align-items: center; gap: 10px; }
.privacy-toc__list a {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 10px; border-radius: 8px; color: var(--text-secondary);
  transition: color var(--transition-fast), background var(--transition-fast);
}
.privacy-toc__list a::before {
  counter-increment: p; content: counter(p, decimal-leading-zero);
  font-size: .8rem; opacity: .7;
}
.privacy-toc__list a:hover { color: var(--text-color); background: rgba(255,255,255,.06); }
.privacy-toc__list a.is-active {
  color: #0a0a0a; background: linear-gradient(135deg, var(--neo-1), var(--neo-2));
}

/* Updated badge */
.privacy-updated {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 12px; border-radius: 999px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  margin-bottom: var(--spacing-lg);
}
.privacy-updated .dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: linear-gradient(135deg, var(--neo-1), var(--neo-2));
  box-shadow: 0 0 0 4px rgba(124,77,255,.15);
}

/* Sections */
.privacy-content .privacy-section {
  padding: clamp(var(--spacing-lg), 3vw, var(--spacing-2xl));
  border: 1px solid rgba(255,255,255,.1);
  margin-bottom: var(--spacing-xl);
  transition: border-color var(--transition-slow), box-shadow var(--transition-slow), transform var(--transition-slow);
}
.privacy-content .privacy-section:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(0,0,0,.25);
  border-color: rgba(0,229,255,.28);
}
.privacy-content h2 { margin-bottom: var(--spacing-md); }
.privacy-content h3 { margin: var(--spacing-md) 0 var(--spacing-sm); }
.privacy-content p { color: var(--dim); }
.privacy-content ul { display: grid; gap: 6px; margin-left: 1rem; }
.privacy-content ul li {
  position: relative; padding-left: 14px; color: var(--dim);
}
.privacy-content ul li::before {
  content:""; position:absolute; left:0; top:.6em; width:8px; height:8px; border-radius:50%;
  background: linear-gradient(135deg, var(--neo-1), var(--neo-2));
}

/* Anchor highlight on active section */
.privacy-content .privacy-section.is-visible {
  border-color: rgba(124,77,255,.35);
  box-shadow: 0 18px 40px rgba(0,0,0,.28);
}
/* =======================
   PRIVACY HERO — Premium
   ======================= */
.privacy-hero--premium {
  --neo-1:#7c4dff; --neo-2:#00e5ff; --dim:rgba(245,245,245,.78);
  position: relative; overflow: clip;
  padding-top: calc(var(--header-height) + var(--spacing-2xl));
  padding-bottom: var(--spacing-2xl);
}
.privacy-hero--premium .privacy-hero__bg { position:absolute; inset:0; pointer-events:none; }
.privacy-hero--premium .privacy-hero__orb {
  position:absolute; width:44vmax; height:44vmax; border-radius:50%;
  filter: blur(90px); opacity:.35;
}
.privacy-hero--premium .privacy-hero__orb--1 {
  top:-22%; left:-12%;
  background: radial-gradient(closest-side, var(--neo-1), transparent 70%);
  animation: floatUp 12s ease-in-out infinite alternate;
}
.privacy-hero--premium .privacy-hero__orb--2 {
  bottom:-22%; right:-12%;
  background: radial-gradient(closest-side, var(--neo-2), transparent 70%);
  animation: floatUp 14s ease-in-out infinite alternate-reverse;
}
.privacy-hero--premium .privacy-hero__grid {
  position:absolute; inset:0; opacity:.08;
  background:
    repeating-linear-gradient(to right, rgba(255,255,255,.8) 0 1px, transparent 1px 48px),
    repeating-linear-gradient(to bottom, rgba(255,255,255,.8) 0 1px, transparent 1px 48px);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.6), transparent 80%);
}

/* badge + meta */
.hero-badge {
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:999px;
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  margin-bottom: var(--spacing-md);
  font-size: var(--font-size-sm);
}
.hero-badge .dot {
  width:8px; height:8px; border-radius:50%;
  background: linear-gradient(135deg, var(--neo-1), var(--neo-2));
  box-shadow: 0 0 0 4px rgba(124,77,255,.15);
}

.hero-meta {
  display:flex; gap:10px; justify-content:center;
  color: var(--dim); font-size: var(--font-size-sm);
}
.hero-meta .meta-sep { opacity:.6; }
@media (max-width:576px) {
  .hero-meta { flex-direction:column; gap:6px; }
}
