/* ============================================ */
/*  OBR VOPROS - Clean Modern Theme             */
/* ============================================ */

/* --- Root Variables --- */
:root {
  --c-bg: #0B1120;
  --c-bg-alt: #0F172A;
  --c-card: #151E32;
  --c-card-hover: #1E293B;
  
  --c-accent: #818CF8;
  --c-accent-hover: #A5B4FC;
  --c-accent-light: rgba(129, 140, 248, 0.15);
  --c-accent-glow: rgba(129, 140, 248, 0.3);
  
  --c-purple: #C084FC;
  --c-purple-light: rgba(192, 132, 252, 0.15);
  
  --c-text: #F1F5F9;
  --c-text-2: #CBD5E1;
  --c-text-3: #64748B;
  
  --c-border: #1E293B;
  --c-border-hover: #334155;
  
  --max-w: 1200px;
  --pad-x: 24px;
  --section-p: 80px;
  --radius: 16px;
  --radius-sm: 12px;
  --radius-pill: 100px;
  
  --font: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --t-fast: 0.2s ease;
  --t-norm: 0.3s ease;
}

/* --- Reset --- */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body { font-family:var(--font); background:linear-gradient(180deg, #050810 0%, #070D18 30%, #0A1220 60%, #070D18 100%); background-size:100% 400%; animation:bg-pulse 15s ease-in-out infinite; color:var(--c-text); line-height:1.6; }
@keyframes bg-pulse {
  0%, 100% { background-position:0% 0%; }
  50% { background-position:0% 100%; }
}
@keyframes shimmer {
  0% { background-position: 0% center; }
  100% { background-position: 200% center; }
}
a { color:inherit; text-decoration:none; }
img { max-width:100%; height:auto; display:block; }

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

/* --- Header --- */
.header { position:fixed; top:0; left:0; right:0; z-index:1000; background:rgba(11, 17, 32, 0.9); backdrop-filter:blur(12px); border-bottom:1px solid var(--c-border); }
.nav { display:flex; align-items:center; justify-content:space-between; height:70px; }
/* Gradient Brand Text */
.gradient-brand, .logo, .footer-name {
  background: linear-gradient(135deg, #818CF8, #C084FC, #F472B6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.nav-links { display:flex; align-items:center; gap:28px; list-style:none; }
.nav-links a { font-size:14px; font-weight:500; color:var(--c-text-2); transition:color var(--t-fast); }
.nav-links a:hover { color:var(--c-accent); }
.nav-cta { background:linear-gradient(135deg, var(--c-accent), var(--c-purple)); color:#fff !important; padding:12px 28px; border-radius:var(--radius-pill); font-weight:600 !important; font-size:15px !important; transition:all var(--t-fast) !important; }
.nav-cta:hover { transform:scale(1.03); box-shadow:0 4px 16px var(--c-accent-glow); }

.menu-toggle { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px; }
.menu-toggle span { display:block; width:24px; height:2px; background:var(--c-accent); transition:all var(--t-norm); }

/* --- Hero --- */
/* Global Stars Canvas */
.stars-canvas-global { position:fixed; top:0; left:0; width:100%; height:100%; z-index:0; pointer-events:none; }

/* Section backgrounds transparent so stars show through */
.section { padding:var(--section-p) 0; background:transparent; position:relative; }
.section::before {
  content:''; position:absolute; top:0; left:50%; transform:translateX(-50%);
  width:50%; max-width:600px; height:1px;
  background:linear-gradient(90deg, transparent, rgba(129,140,248,0.12), transparent);
}
.section:first-child::before { display:none; }
.hero { position:relative; min-height:100vh; display:flex; align-items:center; padding-top:100px; padding-bottom:60px; overflow:hidden; background:transparent; }

.hero-content { display:flex; flex-direction:column; align-items:center; text-align:center; gap:30px; position:relative; z-index:1; }

.hero-title { font-size:clamp(36px, 5vw, 56px); font-weight:800; line-height:1.1; margin-bottom:16px; background: linear-gradient(90deg, #c084fc, #a78bfa, #db2777, #c084fc); background-size: 200% auto; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; animation: shimmer 5s linear infinite; }
.hero-subtitle--main { font-size:clamp(16px, 2vw, 20px); color:var(--c-text-2); margin-bottom:10px; line-height:1.5; }
.hero-subtitle--desc { font-size:15px; color:var(--c-text-3); margin-bottom:36px; line-height:1.7; max-width:520px; }
.hero-buttons { display:flex; gap:14px; flex-wrap:wrap; }

/* .hero-photo-wrapper { position:relative; display:inline-block; width:320px; height:320px; background:none !important; }
.hero-photo { width:320px; height:320px; object-fit:contain; border-radius:50%; border:none; background:transparent !important; box-shadow:none; mix-blend-mode:screen; }
.hero-badge { position:absolute; bottom:-10px; right:-10px; background:linear-gradient(135deg, var(--c-accent), var(--c-purple)); color:#fff; padding:8px 16px; border-radius:var(--radius-pill); font-weight:700; font-size:12px; box-shadow:0 4px 12px rgba(99,102,241,0.3); white-space:nowrap; } */

/* --- Buttons --- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:14px 32px; font-family:var(--font); font-size:15px; font-weight:600; border-radius:var(--radius-sm); border:2px solid transparent; cursor:pointer; transition:all var(--t-norm); }
.btn-primary { background:linear-gradient(135deg, var(--c-accent), var(--c-purple)); color:#fff; border:none; box-shadow:0 4px 16px rgba(99,102,241,0.25); }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(99,102,241,0.35); }
.btn-secondary { background:transparent; color:var(--c-accent); border-color:var(--c-accent); }
.btn-secondary:hover { background:var(--c-accent); color:#fff; }
.btn-large { padding:16px 36px; font-size:16px; border-radius:var(--radius); }

/* --- Stats --- */
.stats-section { padding:60px 0; background:transparent; position:relative; }
.stats-section .stats-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:24px; }
.stat-card { background:linear-gradient(135deg, rgba(30, 27, 75, 0.6), rgba(15, 23, 42, 0.8)); backdrop-filter:blur(12px); border:1px solid rgba(129, 140, 248, 0.15); border-radius:var(--radius); padding:32px 24px; text-align:center; transition:all var(--t-norm); }
.stat-card:hover { transform:translateY(-6px); border-color:rgba(129, 140, 248, 0.35); box-shadow:0 8px 32px rgba(99, 102, 241, 0.15); }
.stat-icon { width:48px; height:48px; margin:0 auto 16px; color:var(--c-accent); }
.stat-icon svg { width:100%; height:100%; stroke:var(--c-accent); }
.stat-card .stat-number { font-size:clamp(28px, 3.5vw, 42px); font-weight:800; line-height:1; margin-bottom:8px; color: #ffffff; }
.stat-card .stat-number .stat-suffix { color: #ffffff; }
.stat-card .stat-label { font-size:14px; color:var(--c-text-2); font-weight:500; line-height:1.5; }

/* --- Sections --- */
.section { padding:var(--section-p) 0; background:var(--c-bg); position:relative; }
.section::before {
  content:''; position:absolute; top:0; left:50%; transform:translateX(-50%);
  width:50%; max-width:600px; height:1px;
  background:linear-gradient(90deg, transparent, rgba(129,140,248,0.12), transparent);
}
.section:first-child::before { display:none; }
.section-title { font-size:clamp(26px, 3.5vw, 38px); font-weight:700; text-align:center; margin-bottom:50px; color:var(--c-text); position:relative; }
.section-title::after { content:''; display:block; width:50px; height:3px; background:linear-gradient(90deg, var(--c-accent), var(--c-purple)); margin:14px auto 0; border-radius:2px; }
.section-subtitle { text-align:center; max-width:600px; margin:-30px auto 50px; font-size:16px; color:var(--c-text-2); line-height:1.6; }

/* --- Problems --- */
.problems-layout { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.problem-big { background:var(--c-card); border-radius:var(--radius); padding:32px; border:1px solid var(--c-border); box-shadow:0 2px 12px rgba(0,0,0,0.04); transition:all var(--t-norm); }
.problem-big:hover { box-shadow:0 8px 24px rgba(99,102,241,0.1); border-color:var(--c-border-hover); }
.problem-big-header { display:flex; align-items:center; gap:14px; margin-bottom:18px; }
.problem-big-icon { font-size:36px; }
.problem-big h3 { font-size:20px; font-weight:700; }
.problem-lead { font-size:14px; color:var(--c-text-2); margin-bottom:18px; line-height:1.6; }
.sub-problems-list { display:flex; flex-direction:column; gap:6px; }
.sub-problem-item { border-bottom:1px solid var(--c-border); }
.sub-problem-toggle { width:100%; display:flex; justify-content:space-between; align-items:center; padding:14px 0; background:none; border:none; font-family:var(--font); font-size:14px; font-weight:500; color:var(--c-text); cursor:pointer; text-align:left; transition:color var(--t-fast); }
.sub-problem-toggle:hover { color:var(--c-accent); }
.sub-problem-icon { font-size:18px; font-weight:300; color:var(--c-accent); transition:transform var(--t-norm); flex-shrink:0; margin-left:12px; }
.sub-problem-item.active .sub-problem-icon { transform:rotate(45deg); }
.sub-problem-answer { max-height:0; overflow:hidden; transition:max-height 0.4s ease, padding 0.3s ease; }
.sub-problem-item.active .sub-problem-answer { max-height:200px; padding-bottom:14px; }
.sub-problem-answer p { font-size:13px; color:var(--c-text-2); line-height:1.7; margin:0; }

/* --- Services --- */
.services-grid-v3 { display:grid; grid-template-columns:repeat(3, 1fr); gap:18px; }
.service-card { background:var(--c-card); border:1px solid var(--c-border); border-radius:var(--radius-sm); padding:24px; transition:transform 0.3s, border-color 0.3s, box-shadow 0.3s; cursor:pointer; position:relative; overflow:hidden; }
.service-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, var(--c-accent), var(--c-purple)); transform:scaleX(0); transition:transform var(--t-norm); }
.service-card:hover::before, .service-card.active::before { transform:scaleX(1); }
.service-card:hover, .service-card.active { transform:translateY(-6px); border-color:var(--c-accent); box-shadow:0 8px 24px rgba(99,102,241,0.12); }
.service-card-icon { width:48px; height:48px; border-radius:50%; background:var(--c-accent-light); display:flex; align-items:center; justify-content:center; font-size:22px; margin-bottom:14px; color:var(--c-accent); }
.service-card h4 { font-size:16px; font-weight:700; color:var(--c-text); margin-bottom:0; }
.service-card .service-desc { max-height:0; opacity:0; overflow:hidden; transition:max-height 0.4s, opacity 0.3s, margin 0.3s; font-size:13px; color:var(--c-text-2); line-height:1.6; }
.service-card:hover .service-desc, .service-card.active .service-desc { max-height:200px; opacity:1; margin-top:10px; }

.tutoring-block { background:var(--c-card); border-left:4px solid var(--c-accent); border-radius:var(--radius-sm); padding:32px; margin-top:40px; box-shadow:0 2px 12px rgba(0,0,0,0.04); }
.tutoring-block h3 { font-size:22px; font-weight:700; margin-bottom:10px; }
.tutoring-block p { font-size:14px; color:var(--c-text-2); margin-bottom:20px; line-height:1.6; }

/* --- Process Timeline --- */
/* Horizontal Process Timeline */
.process-timeline {
  display:flex;
  justify-content:space-between;
  align-items:stretch;
  gap:16px;
  max-width:100%;
  position:relative;
  padding:0;
}
.process-timeline::before {
  display:none;
}
.process-step {
  flex:1;
  position:relative;
  padding:0;
  margin:0;
  opacity:1;
  transform:none;
}
.process-step.visible {
  opacity:1;
  transform:none;
}
.process-step-card {
  background:var(--c-card);
  border:2px solid var(--c-border);
  border-radius:var(--radius);
  padding:24px 20px;
  text-align:center;
  height:100%;
  transition:all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  position:relative;
  overflow:hidden;
}
.process-step-card::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0; bottom:0;
  border-radius:var(--radius);
  border:2px solid transparent;
  transition:all 0.6s;
  pointer-events:none;
}
.process-step:hover .process-step-card {
  border-color:rgba(255,255,255,0.3);
  transform:translateY(-4px);
}
.process-step:hover .process-step-number {
  background:linear-gradient(135deg, #818CF8, #C084FC);
  box-shadow:0 0 12px rgba(129,140,248,0.4);
}
.process-step.active .process-step-card {
  transform:translateY(-8px);
  border-color:rgba(255,255,255,0.4);
}
.process-step-number {
  width:40px; height:40px;
  border-radius:50%;
  background:var(--c-accent);
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:16px;
  margin:0 auto 14px;
  transition:all 0.6s;
  box-shadow:0 0 0 rgba(129,140,248,0);
}
.process-step.active .process-step-number {
  background:linear-gradient(135deg, #818CF8, #C084FC);
  box-shadow:0 0 15px rgba(129,140,248,0.5);
  transform:scale(1.1);
}
.process-step h3 {
  font-size:16px; font-weight:700; margin-bottom:8px; color:var(--c-text);
}
.process-step p {
  font-size:13px; color:var(--c-text-2); line-height:1.6;
}
.process-step::after {
  content:'\2192';
  position:absolute;
  top:20px;
  right:-14px;
  font-size:16px;
  font-weight:700;
  color:var(--c-border);
  transition:all 0.6s;
  z-index:2;
  opacity:0.4;
}
.process-step.active::after {
  color:#818CF8;
  opacity:1;
  text-shadow:0 0 12px rgba(129,140,248,0.6);
}
.process-step:last-child::after {
  display:none;
}

@media (max-width:768px) {
  .process-timeline {
    flex-direction:column;
    gap:16px;
  }
  .process-step::after {
    display:none;
  }
  .process-step::before {
    display:none;
  }
}

/* --- Cases --- */
.cases-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; }
.case-card { background:var(--c-card); border-radius:var(--radius); padding:26px; border:1px solid var(--c-border); transition:all var(--t-norm); }
.case-card:hover { transform:translateY(-4px); border-color:var(--c-border-hover); box-shadow:0 8px 24px rgba(99,102,241,0.08); }
.case-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; gap:8px; flex-wrap:wrap; }
.case-name { font-weight:700; font-size:15px; }
.case-tag { padding:3px 10px; background:linear-gradient(135deg, var(--c-accent), var(--c-purple)); color:#fff; font-size:11px; font-weight:600; border-radius:var(--radius-pill); }
.case-text { font-size:13px; color:var(--c-text-2); margin-bottom:14px; line-height:1.6; }
.case-result { display:flex; align-items:baseline; gap:6px; margin-bottom:3px; }
.case-number { font-size:26px; font-weight:800; color:var(--c-accent); line-height:1; }
.case-label { font-size:13px; color:var(--c-text-2); }
.case-note { font-size:13px; color:var(--c-text); font-style:italic; margin-top:12px; padding-top:12px; border-top:1px solid var(--c-border); }

/* --- Reviews --- */
.reviews-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; }
.review-card { background:var(--c-card); border-radius:var(--radius); padding:26px; border:1px solid var(--c-border); transition:all var(--t-norm); }
.review-card:hover { transform:translateY(-4px); box-shadow:0 8px 24px rgba(99,102,241,0.08); }
.review-stars { color:#FBBF24; font-size:18px; margin-bottom:12px; letter-spacing:2px; }
.review-text { font-size:14px; line-height:1.7; color:var(--c-text); margin-bottom:16px; font-style:italic; }
.review-author { display:flex; flex-direction:column; gap:2px; }
.review-name { font-weight:700; font-size:15px; }
.review-role { font-size:13px; color:var(--c-text-2); }

/* --- Subjects --- */
.subjects-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; }
.subject-card { background:var(--c-card); border-radius:var(--radius); padding:28px; border:1px solid var(--c-border); transition:all var(--t-norm); position:relative; overflow:hidden; cursor:pointer; }
.subject-card:hover { transform:translateY(-6px); border-color:var(--subject-color, var(--c-accent)); box-shadow:0 0 30px var(--subject-glow, var(--c-accent-glow)); }
.subject-top-line { position:absolute; top:0; left:0; right:0; height:4px; background:var(--subject-color, var(--c-accent)); opacity:0.7; transition:opacity var(--t-norm); }
.subject-card:hover .subject-top-line { opacity:1; }
.subject-icon { font-size:36px; margin-bottom:10px; transition:transform var(--t-norm); }
.subject-card:hover .subject-icon { transform:scale(1.15); }
.subject-card h3 { font-size:18px; font-weight:700; margin-bottom:4px; color:var(--c-text); }
.subject-meta { font-size:12px; color:var(--c-text-3); margin-bottom:8px; }
.subject-desc { font-size:13px; color:var(--c-text-2); line-height:1.6; }
.hover-elements { position:absolute; inset:0; pointer-events:none; opacity:0; transition:opacity 0.4s; overflow:hidden; }
.subject-card:hover .hover-elements { opacity:1; }
.hover-formula { position:absolute; font-size:16px; font-weight:700; color:var(--subject-color, var(--c-accent)); opacity:0.5; animation:float 3s ease-in-out infinite; }
.hover-elements svg { position:absolute; width:45px; height:45px; stroke:var(--subject-color, var(--c-accent)); stroke-width:1.5; fill:none; opacity:0.25; }
.hover-book { bottom:10%; right:10%; animation:float 4s ease-in-out infinite; }
.hover-einstein { top:10%; right:10%; animation:float 3.5s ease-in-out infinite 0.5s; }
.hover-laptop { bottom:10%; right:10%; animation:float 4.5s ease-in-out infinite 1s; }
.hover-globe { bottom:10%; right:10%; animation:float 3.8s ease-in-out infinite 0.3s; }
.hover-scroll { bottom:10%; right:10%; animation:float 4.2s ease-in-out infinite 0.7s; }
.hover-pen { bottom:10%; right:10%; animation:float 3.6s ease-in-out infinite 0.2s; }
@keyframes float { 0%,100%{transform:translateY(0) rotate(0deg);} 50%{transform:translateY(-12px) rotate(4deg);} }

/* Subject colors */
.subject-math { --subject-color:#FB7185; --subject-glow:rgba(251,113,133,0.25); }
.subject-physics { --subject-color:#FBBF24; --subject-glow:rgba(251,191,36,0.25); }
.subject-it { --subject-color:#38BDF8; --subject-glow:rgba(56,189,248,0.25); }
.subject-social { --subject-color:#FB923C; --subject-glow:rgba(251,146,60,0.25); }
.subject-history { --subject-color:#A78BFA; --subject-glow:rgba(167,139,250,0.25); }
.subject-english { --subject-color:#818CF8; --subject-glow:rgba(129,140,248,0.25); }

/* --- FAQ --- */
.faq-list { max-width:800px; margin:0 auto; }
.faq-item { border-bottom:1px solid var(--c-border); }
.faq-question { width:100%; display:flex; justify-content:space-between; align-items:center; padding:20px 0; background:none; border:none; font-family:var(--font); font-size:16px; font-weight:600; color:var(--c-text); cursor:pointer; text-align:left; transition:color var(--t-fast); }
.faq-question:hover { color:var(--c-accent); }
.faq-icon { font-size:20px; font-weight:300; color:var(--c-accent); transition:transform var(--t-norm); flex-shrink:0; margin-left:16px; }
.faq-item.active .faq-icon { transform:rotate(45deg); }
.faq-answer { max-height:0; overflow:hidden; transition:max-height var(--t-norm), padding var(--t-norm); }
.faq-item.active .faq-answer { max-height:1200px; padding-bottom:20px; }
.faq-answer p { font-size:14px; color:var(--c-text-2); line-height:1.7; }

/* --- Final CTA --- */
.final-cta { text-align:center; position:relative; overflow:hidden; padding:var(--section-p) 0; background:linear-gradient(135deg, #1E1B4B, #0F172A, #1E1B4B); }
.final-cta-content { max-width:520px; margin:0 auto; position:relative; z-index:1; }
.final-cta-icon { width:72px; height:72px; margin:0 auto 20px; position:relative; display:flex; align-items:center; justify-content:center; }
.final-cta-icon .moon {
  width:56px; height:56px; border-radius:50%;
  background:linear-gradient(135deg, #FDE68A, #FEF3C7, #E0E7FF);
  box-shadow:0 0 20px rgba(253, 230, 138, 0.4), 0 0 40px rgba(253, 230, 138, 0.15), inset -6px -6px 12px rgba(0,0,0,0.2);
  position:relative;
  overflow:hidden;
}
.final-cta-icon .moon::before {
  content:''; position:absolute; top:8px; left:12px; width:10px; height:10px; border-radius:50%; background:rgba(255,255,255,0.6); filter:blur(2px);
}
.final-cta-icon .moon::after {
  content:''; position:absolute; bottom:10px; right:10px; width:16px; height:16px; border-radius:50%; background:rgba(0,0,0,0.08); filter:blur(3px);
}
.final-cta-icon .moon-craters {
  position:absolute; top:18px; left:22px; width:6px; height:6px; border-radius:50%; background:rgba(0,0,0,0.06);
}
.final-cta-icon .moon-craters::before {
  content:''; position:absolute; top:14px; left:-8px; width:4px; height:4px; border-radius:50%; background:rgba(0,0,0,0.05);
}
.final-cta-icon .moon-craters::after {
  content:''; position:absolute; top:8px; left:10px; width:5px; height:5px; border-radius:50%; background:rgba(0,0,0,0.06);
}
@keyframes moon-glow {
  0%, 100% { box-shadow:0 0 20px rgba(253, 230, 138, 0.4), 0 0 40px rgba(253, 230, 138, 0.15); }
  50% { box-shadow:0 0 30px rgba(253, 230, 138, 0.6), 0 0 60px rgba(253, 230, 138, 0.25); }
}
.final-cta-icon .moon { animation:moon-glow 3s ease-in-out infinite; }
.final-cta h2 { font-size:clamp(22px, 3vw, 30px); font-weight:700; margin-bottom:10px; color:#F1F5F9; }
.final-cta p { font-size:15px; color:rgba(255,255,255,0.9); margin-bottom:28px; line-height:1.6; }

/* Moon Divider */
.moon-divider { display:flex; justify-content:center; padding:20px 0; position:relative; z-index:1; }
.moon-mini {
  width:48px; height:48px; border-radius:50%;
  background:linear-gradient(135deg, #9CA3AF, #D1D5DB, #E5E7EB);
  box-shadow:0 0 15px rgba(156,163,175,0.3), inset -3px -3px 6px rgba(0,0,0,0.2);
  position:relative;
  overflow:hidden;
}
.moon-crater-1 {
  position:absolute; top:10px; left:12px; width:8px; height:8px; border-radius:50%; background:rgba(0,0,0,0.08);
}
.moon-crater-2 {
  position:absolute; bottom:12px; right:10px; width:6px; height:6px; border-radius:50%; background:rgba(0,0,0,0.06);
}
.footer { background:var(--c-bg); color:var(--c-text); padding:40px 0 20px; border-top:1px solid var(--c-border); }
.footer-content { display:flex; justify-content:space-between; align-items:center; margin-bottom:24px; flex-wrap:wrap; gap:16px; }
.footer-name { font-size:18px; font-weight:700; color:var(--c-accent); }
.footer-role { font-size:13px; color:var(--c-text-2); }
.footer-ip { font-size:12px; color:var(--c-text-3); margin-top:6px; line-height:1.6; }
.footer-links { display:flex; gap:14px 20px; flex-wrap:wrap; }
.footer-links a { font-size:13px; color:var(--c-text-2); transition:color var(--t-fast); white-space:nowrap; }
.footer-links a:hover { color:var(--c-accent); }
.footer-bottom { text-align:center; padding-top:20px; border-top:1px solid var(--c-border); }
.footer-bottom p { font-size:12px; color:var(--c-text-3); }

/* --- Telegram Float --- */
.telegram-float { position:fixed; bottom:24px; right:24px; z-index:1000; width:52px; height:52px; border-radius:50%; background:#0088cc; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 16px rgba(0,136,204,0.35); transition:transform 0.3s, box-shadow 0.3s; }
.telegram-float:hover { transform:scale(1.1); box-shadow:0 6px 24px rgba(0,136,204,0.5); }
.telegram-float svg { width:26px; height:26px; }
.telegram-float::before { content:''; position:absolute; inset:-4px; border-radius:50%; border:2px solid #0088cc; animation:pulse-ring 2s ease-out infinite; opacity:0; }
@keyframes pulse-ring { 0%{transform:scale(1); opacity:0.6;} 100%{transform:scale(1.5); opacity:0;} }

/* --- Animations --- */
.fade-in, .fade-in-item { opacity:1; transform:translateY(30px); transition:opacity 0.6s, transform 0.6s; }
.fade-in.visible, .fade-in-item.visible { opacity:1; transform:translateY(0); }
.stagger-1 { transition-delay:0.1s; } .stagger-2 { transition-delay:0.2s; } .stagger-3 { transition-delay:0.3s; } .stagger-4 { transition-delay:0.4s; } .stagger-5 { transition-delay:0.5s; } .stagger-6 { transition-delay:0.6s; }

/* --- Responsive --- */
@media (max-width:1024px) {
  .problems-layout, .subjects-grid, .cases-grid, .reviews-grid { grid-template-columns:repeat(2, 1fr); }
  .services-grid-v3 { grid-template-columns:repeat(2, 1fr); }
  .stats-section .stats-grid { grid-template-columns:repeat(2, 1fr); }
  .hero-content { gap:30px; }
}

@media (max-width:768px) {
  :root { --section-p:60px; }
  .nav-links { display:none; }
  .menu-toggle { display:flex; }
  .hero-content { flex-direction:column; align-items:center; text-align:center; gap:24px; }
  .hero-subtitle--desc { margin:0 auto 32px; }
  .hero-buttons { justify-content:center; }
  .hero-image { order:-1; margin-bottom:28px; }
  .hero-photo-wrapper { width:280px; height:280px; }
  .hero-photo { width:280px; height:280px; }
  .hero-badge { font-size:11px; padding:6px 12px; }
  .problems-layout, .services-grid-v3, .subjects-grid, .cases-grid, .reviews-grid { grid-template-columns:1fr; }
  .problem-big { padding:24px; }
  .sub-problem-toggle { font-size:13px; padding:12px 0; }
  .sub-problem-answer p { font-size:12px; }
  .section-subtitle { font-size:14px; padding:0 16px; }
  .process-timeline { flex-direction:column; gap:16px; }
  .process-step { padding-left:0; }
  .process-step::after, .process-step::before { display:none; }
  .process-step-card { padding:20px 16px; }
  .process-step-number { width:36px; height:36px; font-size:14px; margin-bottom:10px; }
  .stats-section .stats-grid { grid-template-columns:1fr; }
  .section-title { margin-bottom:36px; font-size:26px; }
  .footer-content { flex-direction:column; text-align:center; }
  .service-card .service-desc { max-height:0; opacity:0; }
  .service-card.active .service-desc { max-height:200px; opacity:1; margin-top:10px; }
}

@media (max-width:480px) {
  :root { --pad-x:16px; }
  .btn { width:100%; }
  .hero-buttons { flex-direction:column; }
  .contact-buttons { width:100%; }
  .contact-buttons .btn { width:100%; }
  .subject-card:hover { transform:translateY(-4px); }
  .nav-links--open { display:flex; position:fixed; top:70px; left:0; right:0; background:var(--c-bg); flex-direction:column; align-items:center; gap:20px; padding:32px 0; box-shadow:0 8px 32px rgba(0,0,0,0.15); z-index:999; border-radius:0 0 16px 16px; max-height:400px; overflow-y:auto; }
  .nav-links--open a { font-size:18px; font-weight:600; }
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation-duration:0.01ms !important; transition-duration:0.01ms !important; }
  .sky-cloud { animation:none; }
  .fade-in, .fade-in-item, .process-step { opacity:1 !important; transform:none !important; }
}

/* --- Planet Dividers --- */
.planet-divider { display:flex; justify-content:center; padding:20px 0; position:relative; }
.planet { width:32px; height:32px; border-radius:50%; position:relative; animation:planet-pulse 3s ease-in-out infinite; }
@keyframes planet-pulse { 0%,100%{transform:scale(1);} 50%{transform:scale(1.1);} }

/* Sun */
.planet-sun {
 width: 44px;
 height: 44px;
 border-radius: 50%;
 background: radial-gradient(circle at 30% 30%, #FEF3C7, #FBBF24, #F59E0B);
 box-shadow: 0 0 20px rgba(251, 191, 36, 0.4), 0 0 40px rgba(251, 191, 36, 0.2), inset -4px -4px 8px rgba(180, 83, 9, 0.3);
 animation: planet-pulse 3s ease-in-out infinite;
}

/* Mercury - small gray */
.planet-mercury { width:24px; height:24px; background:radial-gradient(circle at 35% 35%, #B8B8B8, #7A7A7A 60%, #555 100%); box-shadow:0 0 8px rgba(161,161,161,0.3); }

/* Venus - pale yellow */
.planet-venus { width:30px; height:30px; background:radial-gradient(circle at 35% 35%, #F0E68C, #D4A843 60%, #B8860B 100%); box-shadow:0 0 10px rgba(212,168,67,0.3); }

/* Earth - blue with green */
.planet-earth { width:32px; height:32px; background:radial-gradient(circle at 35% 35%, #4A90D9, #2E5C8A 60%, #1A3A5C 100%); box-shadow:0 0 12px rgba(74,144,217,0.35); }
.planet-earth::before { content:''; position:absolute; top:8px; left:10px; width:12px; height:8px; background:#4CAF50; border-radius:40%; opacity:0.6; filter:blur(1px); }

/* Mars - red */
.planet-mars { width:28px; height:28px; background:radial-gradient(circle at 35% 35%, #E85D3F, #C1440E 60%, #8B2500 100%); box-shadow:0 0 10px rgba(193,68,14,0.3); }

/* Jupiter - large striped */
.planet-jupiter { width:40px; height:40px; background:linear-gradient(180deg, #D4A574 0%, #C8956C 20%, #D4A574 40%, #B87850 60%, #D4A574 80%, #B87850 100%); box-shadow:0 0 14px rgba(212,165,116,0.25); overflow:hidden; }
.planet-jupiter::before { content:''; position:absolute; top:55%; left:20%; width:8px; height:5px; background:#A0522D; border-radius:50%; opacity:0.5; }

/* Saturn - yellow with ring */
.planet-saturn { width:34px; height:34px; background:radial-gradient(circle at 35% 35%, #F4D03F, #D4AC0D 60%, #B7950B 100%); box-shadow:0 0 12px rgba(244,208,63,0.3); }
.planet-saturn::before { content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%) rotate(-15deg); width:50px; height:8px; border:2px solid rgba(200,180,140,0.5); border-radius:50%; }

/* Uranus - cyan */
.planet-uranus { width:30px; height:30px; background:radial-gradient(circle at 35% 35%, #AED6F1, #7FB3D5 60%, #5D8AA8 100%); box-shadow:0 0 10px rgba(127,179,213,0.3); }

/* Neptune - deep blue */
.planet-neptune { width:30px; height:30px; background:radial-gradient(circle at 35% 35%, #5B7CFF, #3B5BDB 60%, #1E3A8A 100%); box-shadow:0 0 10px rgba(59,91,219,0.35); }

/* Moon */
.planet-moon {
 width: 36px;
 height: 36px;
 border-radius: 50%;
 background: linear-gradient(135deg, #F3F4F6, #E5E7EB, #D1D5DB);
 box-shadow: 0 0 15px rgba(209, 213, 219, 0.3), inset -3px -3px 6px rgba(0, 0, 0, 0.2);
 animation: planet-pulse 3s ease-in-out infinite;
}

/* Earth & Moon Orbit in Final CTA */
.earth-moon-orbit {
 position: relative;
 width: 100px;
 height: 100px;
 display: flex;
 align-items: center;
 justify-content: center;
}

.earth {
 width: 56px;
 height: 56px;
 border-radius: 50%;
 background: 
 radial-gradient(circle at 35% 35%, rgba(255,255,255,0.3) 0%, transparent 25%),
 radial-gradient(circle at 70% 60%, #22C55E 0%, #22C55E 8%, transparent 10%),
 radial-gradient(circle at 25% 55%, #22C55E 0%, #22C55E 6%, transparent 8%),
 radial-gradient(circle at 55% 25%, #22C55E 0%, #22C55E 5%, transparent 7%),
 radial-gradient(circle at 80% 30%, #22C55E 0%, #22C55E 4%, transparent 6%),
 radial-gradient(circle at 45% 70%, #22C55E 0%, #22C55E 7%, transparent 9%),
 radial-gradient(circle at 15% 30%, #22C55E 0%, #22C55E 5%, transparent 7%),
 linear-gradient(135deg, #1E40AF 0%, #2563EB 40%, #1D4ED8 100%);
 box-shadow: 
 0 0 25px rgba(37, 99, 235, 0.5), 
 0 0 50px rgba(37, 99, 235, 0.2),
 inset -6px -6px 12px rgba(0, 0, 0, 0.4),
 inset 4px 4px 8px rgba(255, 255, 255, 0.1);
 position: relative;
 z-index: 2;
}

.earth::before {
 content: '';
 position: absolute;
 top: 15%;
 left: 20%;
 width: 40%;
 height: 30%;
 background: rgba(34, 197, 94, 0.7);
 border-radius: 60% 40% 50% 70%;
 transform: rotate(-15deg);
 filter: blur(0.5px);
}

.earth::after {
 content: '';
 position: absolute;
 bottom: 20%;
 right: 15%;
 width: 30%;
 height: 25%;
 background: rgba(34, 197, 94, 0.6);
 border-radius: 50% 60% 40% 50%;
 transform: rotate(10deg);
 filter: blur(0.5px);
}

.moon-orbit {
 position: absolute;
 width: 100%;
 height: 100%;
 animation: orbit 4s linear infinite;
}

.moon-small {
 width: 18px;
 height: 18px;
 border-radius: 50%;
 background: linear-gradient(135deg, #F3F4F6, #E5E7EB, #D1D5DB);
 box-shadow: 0 0 10px rgba(209, 213, 219, 0.6);
 position: absolute;
 top: 0;
 left: 50%;
 transform: translateX(-50%);
}

@keyframes orbit {
 from { transform: rotate(0deg); }
 to { transform: rotate(360deg); }
}

