/* ============================================================
   DVServices — 3D Animated Premium Website
   Font: Syne (headings) + DM Sans (body)
   Theme: Clean White + Crimson Red + Charcoal Black
   ============================================================ */

:root {
  --red: #e8001d;
  --red-deep: #b5001a;
  --red-light: #fff0f0;
  --red-glow: rgba(232, 0, 29, 0.18);

  --bg:      #ffffff;
  --bg-2:    #f7f8fa;
  --bg-3:    #f0f2f5;
  --bg-card: #ffffff;

  --text-h:    #0d0d0d;
  --text-main: #333333;
  --text-muted:#72727a;
  --text-soft: #b0b0b8;

  --border:     rgba(0,0,0,0.08);
  --border-red: rgba(232,0,29,0.18);

  --white: #ffffff;
  --black: #0d0d0d;

  --font-head: Arial, Helvetica, sans-serif;
  --font-body: Arial, Helvetica, sans-serif;

  --ease:     cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);

  --shadow-sm: 0 1px 4px rgba(0,0,0,0.05);
  --shadow:    0 4px 16px rgba(0,0,0,0.08);
  --shadow-md: 0 8px 32px rgba(0,0,0,0.10);
  --shadow-lg: 0 20px 60px rgba(0,0,0,0.11);
  --shadow-red:0 8px 30px rgba(232,0,29,0.25);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body {
  font-family: var(--font-body);
  background: var(--bg);
  color: var(--text-main);
  overflow-x: hidden;
  cursor: auto;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { text-decoration:none; color:inherit; }
ul { list-style:none; }
img { max-width:100%; }

/* CANVAS */
#bg-canvas {
  position: fixed; top:0; left:0;
  width:100%; height:100%;
  z-index:0; pointer-events:none; opacity:0.3;
}

/* CURSOR */
.cursor {
  position:fixed; width:10px; height:10px;
  background:var(--red); border-radius:50%;
  pointer-events:none; z-index:9999;
  transform:translate(-50%,-50%); transition:transform 0.05s;
}
.cursor-follower {
  position:fixed; width:36px; height:36px;
  border:1.5px solid var(--red); border-radius:50%;
  pointer-events:none; z-index:9998;
  transform:translate(-50%,-50%);
  transition:all 0.12s var(--ease); opacity:0.5;
}

.cursor,
.cursor-follower {
  display:none;
}

/* TYPOGRAPHY */
.section-label {
  display:inline-flex; align-items:center; gap:0.5rem;
  font-family:var(--font-body); font-size:0.72rem; font-weight:600;
  letter-spacing:0.14em; text-transform:uppercase;
  color:var(--red); padding:0.4rem 1rem;
  border:1px solid var(--border-red); border-radius:100px;
  background:var(--red-light); margin-bottom:1.25rem;
}
.section-label.light {
  color:rgba(255,255,255,0.85);
  border-color:rgba(255,255,255,0.25);
  background:rgba(255,255,255,0.1);
}
.section-headline {
  font-family:var(--font-head);
  font-size:clamp(2.2rem,4.5vw,3.5rem);
  font-weight:800; line-height:1.08;
  color:var(--text-h); margin-bottom:1rem;
}
.section-headline em {
  font-style:normal;
  background:linear-gradient(135deg,var(--red),#ff5050);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.section-headline.light { color:var(--white); }
.section-headline.light em {
  background:linear-gradient(135deg,#ffaaaa,#ff6060);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.section-desc { font-size:1.0625rem; color:var(--text-muted); max-width:580px; line-height:1.75; }
.section-desc.light { color:rgba(255,255,255,0.6); }
.section-wrap { text-align:center; margin-bottom:4rem; }
.section-wrap .section-desc { margin:0 auto; }
.section-label-wrap { display:flex; justify-content:center; }

/* NAVBAR */
.navbar {
  position:fixed; top:0; left:0; right:0;
  z-index:1000; padding:1.25rem 0;
  transition:all 0.4s var(--ease);
}
.navbar.scrolled {
  background:rgba(255,255,255,0.96);
  backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
  padding:0.875rem 0; box-shadow:var(--shadow-sm);
}
.nav-inner {
  max-width:1300px; margin:0 auto; padding:0 2rem;
  display:flex; align-items:center; gap:2rem;
}
.nav-logo {
  display:flex; align-items:center; gap:0.75rem;
  font-family:var(--font-head); font-size:1.35rem; font-weight:800;
  color:var(--text-h); margin-right:auto;
}
.logo-cube {
  width:36px; height:36px; position:relative;
  transform-style:preserve-3d;
  animation:cubeRotate 8s linear infinite;
}
@keyframes cubeRotate {
  from { transform:rotateY(0deg) rotateX(10deg); }
  to   { transform:rotateY(360deg) rotateX(10deg); }
}
.cube-face {
  position:absolute; width:36px; height:36px;
  background:var(--red);
  display:flex; align-items:center; justify-content:center;
  font-size:0.7rem; font-weight:800; color:white;
  border:1px solid rgba(255,255,255,0.2);
}
.cube-face.front  { transform:translateZ(18px); }
.cube-face.back   { transform:rotateY(180deg) translateZ(18px); }
.cube-face.left   { transform:rotateY(-90deg) translateZ(18px); }
.cube-face.right  { transform:rotateY(90deg) translateZ(18px); }
.cube-face.top    { transform:rotateX(90deg) translateZ(18px); }
.cube-face.bottom { transform:rotateX(-90deg) translateZ(18px); }

.nav-links { display:flex; align-items:center; gap:2rem; }
.nav-links a {
  font-size:0.9rem; font-weight:500; color:var(--text-muted);
  position:relative; transition:color 0.2s;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-4px; left:0;
  width:0; height:2px; background:var(--red);
  transition:width 0.3s var(--ease);
}
.nav-links a:hover,.nav-links a.active { color:var(--text-h); }
.nav-links a:hover::after,.nav-links a.active::after { width:100%; }
.nav-cta {
  padding:0.6rem 1.4rem; background:var(--red); color:var(--white);
  font-family:var(--font-head); font-weight:700; font-size:0.875rem;
  border-radius:6px; transition:all 0.3s var(--ease); white-space:nowrap;
}
.nav-cta:hover { background:var(--red-deep); transform:translateY(-2px); box-shadow:var(--shadow-red); }
.hamburger {
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer; padding:0.5rem;
}
.hamburger span { width:24px; height:2px; background:var(--text-h); transition:all 0.3s; }
.hamburger.active span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.hamburger.active span:nth-child(2) { opacity:0; }
.hamburger.active span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

/* HERO */
.hero {
  min-height:100vh;
  display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center;
  max-width:1300px; margin:0 auto; padding:9rem 2rem 5rem;
  position:relative; z-index:1; overflow:hidden;
}
.hero-scene { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.grid-overlay {
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(0,0,0,0.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(0,0,0,0.04) 1px,transparent 1px);
  background-size:60px 60px;
}
.floating-geometry { position:absolute; opacity:0.07; border-radius:4px; }
.geo-1 {
  width:200px; height:200px; background:var(--red);
  top:12%; right:5%; transform:rotate(30deg);
  animation:geoFloat 8s ease-in-out infinite;
}
.geo-2 {
  width:120px; height:120px; background:var(--red);
  top:65%; left:2%; border-radius:50%; opacity:0.05;
  animation:geoFloat 10s ease-in-out infinite 2s;
}
.geo-3 {
  width:70px; height:70px; background:var(--text-h);
  bottom:20%; right:28%; transform:rotate(45deg); opacity:0.04;
  animation:geoFloat 6s ease-in-out infinite 1s;
}
.geo-4 {
  width:320px; height:320px;
  border:1.5px solid rgba(232,0,29,0.12);
  top:50%; right:2%; transform:translate(0,-50%) rotate(45deg);
  animation:geoSpin 25s linear infinite;
  border-radius:0; background:transparent; opacity:0.6;
}
@keyframes geoFloat {
  0%,100% { transform:translateY(0) rotate(30deg); }
  50%      { transform:translateY(-30px) rotate(45deg); }
}
@keyframes geoSpin {
  from { transform:translate(0,-50%) rotate(45deg); }
  to   { transform:translate(0,-50%) rotate(405deg); }
}

.hero-eyebrow {
  display:flex; align-items:center; gap:0.75rem;
  font-size:0.78rem; color:var(--text-muted);
  letter-spacing:0.1em; text-transform:uppercase; margin-bottom:1.5rem;
}
.eyebrow-dot {
  width:8px; height:8px; background:var(--red); border-radius:50%;
  animation:dotPulse 2s infinite;
}
@keyframes dotPulse {
  0%,100% { box-shadow:0 0 0 0 rgba(232,0,29,0.5); }
  50%      { box-shadow:0 0 0 8px rgba(232,0,29,0); }
}
.hero-title {
  font-family:var(--font-head);
  font-size:clamp(3rem,5.5vw,5rem);
  font-weight:700; line-height:1.06;
  color:var(--text-h); margin-bottom:1.5rem;
  letter-spacing:-0.01em;
}
.hero-title .line { display:block; overflow:hidden; }
.hero-title .line-3 em {
  font-style:normal;
  background:linear-gradient(135deg,var(--red),#ff5050);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.hero-sub {
  font-size:1.125rem; color:#62626b;
  line-height:1.75; max-width:500px; margin-bottom:2.5rem;
}
.hero-actions {
  display:flex;
  gap:1rem;
  flex-wrap:wrap;
  margin-bottom:3rem;
  background:transparent;
  isolation:isolate;
}
.btn-hero-primary {
  display:inline-flex; align-items:center; gap:0.75rem;
  padding:0.9rem 2rem; background:var(--red); color:var(--white);
  font-family:var(--font-head); font-weight:700; font-size:1rem;
  border-radius:8px; transition:all 0.3s var(--ease);
  box-shadow:0 4px 16px var(--red-glow);
  position:relative;
  z-index:2;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.btn-hero-primary:hover { background:var(--red-deep); transform:translateY(-3px); box-shadow:var(--shadow-red); }
.btn-hero-primary i { transition:transform 0.3s; }
.btn-hero-primary:hover i { transform:translateX(4px); }
.btn-hero-ghost {
  display:inline-flex; align-items:center; gap:0.75rem;
  padding:0.9rem 2rem; background:transparent; color:var(--text-h);
  font-family:var(--font-head); font-weight:600; font-size:1rem;
  border-radius:8px; border:1.5px solid var(--border);
  transition:all 0.3s var(--ease);
  position:relative;
  z-index:2;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.btn-hero-ghost:hover {
  border-color:var(--red); color:var(--red);
  background:var(--red-light); transform:translateY(-3px);
}
.hero-metrics {
  display:flex; gap:2.5rem; align-items:center;
  padding-top:2rem; border-top:1px solid var(--border);
}
.metric-divider { width:1px; height:40px; background:var(--border); }
.metric-num {
  display:block; font-family:var(--font-head);
  font-size:2rem; font-weight:800; color:var(--text-h);
}
.metric-label { font-size:0.8rem; color:var(--text-muted); }

/* Dashboard */
.hero-visual { display:flex; justify-content:center; align-items:center; }
.dashboard-3d {
  position:relative; transform-style:preserve-3d;
  transform:perspective(1000px) rotateY(-8deg) rotateX(4deg);
  animation:dashFloat 6s ease-in-out infinite;
  transition:transform 0.4s var(--ease);
}
.dashboard-3d:hover { transform:perspective(1000px) rotateY(0deg) rotateX(0deg); }
@keyframes dashFloat {
  0%,100% { transform:perspective(1000px) rotateY(-8deg) rotateX(4deg) translateY(0); }
  50%      { transform:perspective(1000px) rotateY(-8deg) rotateX(4deg) translateY(-18px); }
}
.dash-panel {
  width:460px; background:var(--white);
  border-radius:18px; border:1px solid var(--border);
  overflow:hidden;
  box-shadow:var(--shadow-lg),0 0 60px rgba(232,0,29,0.05);
}
.dash-top-bar {
  display:flex; align-items:center; gap:1rem;
  padding:1rem 1.25rem; background:var(--bg-2);
  border-bottom:1px solid var(--border);
}
.traffic-lights { display:flex; gap:6px; }
.tl { width:12px; height:12px; border-radius:50%; }
.tl.red    { background:#ff5f57; }
.tl.yellow { background:#ffbd2e; }
.tl.green  { background:#28c840; }
.dash-name { font-size:0.8rem; color:var(--text-muted); }
.dash-body { padding:1.25rem; display:flex; flex-direction:column; gap:1rem; }
.dash-row { display:flex; gap:0.75rem; }
.dash-stat-card {
  flex:1; display:flex; align-items:center; gap:0.75rem;
  padding:1rem; background:var(--bg-2);
  border-radius:12px; border:1px solid var(--border);
}
.dash-stat-card.accent { border-color:var(--border-red); background:var(--red-light); }
.dash-stat-card i { font-size:1.25rem; color:var(--red); }
.dsc-val { display:block; font-family:var(--font-head); font-size:1.25rem; font-weight:800; color:var(--text-h); }
.dsc-lbl { font-size:0.7rem; color:var(--text-muted); }
.dash-eligibility {
  display:flex; align-items:center; gap:0.75rem;
  padding:1rem; background:var(--bg-2);
  border-radius:12px; border:1px solid var(--border);
}
.elig-label {
  font-size:0.8rem; color:var(--text-muted); white-space:nowrap;
  display:flex; align-items:center; gap:0.5rem;
}
.elig-label i { color:var(--red); }
.elig-bar { flex:1; height:6px; background:var(--bg-3); border-radius:100px; overflow:hidden; }
.elig-fill { height:100%; background:linear-gradient(90deg,var(--red),#ff5050); border-radius:100px; transition:width 1.5s var(--ease-out); }
.elig-pct { font-size:0.8rem; color:var(--red); font-weight:700; white-space:nowrap; }
.dash-alert {
  display:flex; align-items:center; gap:0.75rem;
  padding:0.875rem 1rem; background:var(--red-light);
  border-radius:12px; border:1px solid var(--border-red);
  animation:alertPulse 3s ease-in-out infinite;
}
@keyframes alertPulse {
  0%,100% { border-color:rgba(232,0,29,0.18); }
  50%      { border-color:rgba(232,0,29,0.45); }
}
.dash-alert i { color:var(--red); }
.dash-alert span { font-size:0.8rem; color:var(--text-h); flex:1; }
.alert-badge {
  padding:0.2rem 0.6rem; background:var(--red); border-radius:100px;
  font-size:0.65rem !important; font-weight:700; color:white;
}
.dash-mini-chart { padding:1rem; background:var(--bg-2); border-radius:12px; border:1px solid var(--border); }
.chart-bar-wrap { display:flex; align-items:flex-end; gap:4px; height:60px; margin-bottom:0.5rem; }
.cb { flex:1; height:var(--h); background:linear-gradient(180deg,var(--red) 0%,rgba(232,0,29,0.2) 100%); border-radius:3px 3px 0 0; }
.chart-label { font-size:0.7rem; color:var(--text-muted); }
.side-panel {
  position:absolute; display:flex; flex-direction:column; align-items:center; gap:0.4rem;
  padding:1rem 0.75rem; background:#ffffff; border-radius:12px;
  border:1px solid var(--border); font-size:0.7rem; color:var(--text-muted);
  box-shadow:var(--shadow-md);
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  transform:translateZ(0);
}
.side-panel i { color:var(--red); font-size:1rem; }
.sp-badge { color:#16a34a; font-weight:700; }
.panel-side-1 { top:20%; right:-70px; animation:sideFloat 5s ease-in-out infinite; }
.panel-side-2 { bottom:20%; left:-60px; animation:sideFloat 5s ease-in-out infinite 1.5s; }
@keyframes sideFloat {
  0%,100% { transform:translateY(0); }
  50%      { transform:translateY(-10px); }
}
.scroll-cue {
  position:absolute; bottom:2rem; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:0.5rem;
  color:var(--text-soft); font-size:0.7rem; letter-spacing:0.1em; text-transform:uppercase; z-index:10;
}
.scroll-line {
  width:1px; height:50px;
  background:linear-gradient(180deg,var(--red),transparent);
  animation:scrollDrop 2s ease-in-out infinite;
}
@keyframes scrollDrop {
  0%   { transform:scaleY(0); transform-origin:top; }
  50%  { transform:scaleY(1); transform-origin:top; }
  51%  { transform:scaleY(1); transform-origin:bottom; }
  100% { transform:scaleY(0); transform-origin:bottom; }
}

/* COMPARE BANNER */
.compare-banner {
  position:relative; z-index:2; background:var(--bg-2);
  border-top:1px solid var(--border); border-bottom:1px solid var(--border);
  overflow:hidden; padding:1rem 0;
}
.compare-inner {
  display:flex; align-items:center; gap:2rem;
  max-width:1300px; margin:0 auto; padding:0 2rem;
}
.compare-label { font-size:0.72rem; color:var(--text-muted); white-space:nowrap; letter-spacing:0.1em; text-transform:uppercase; }
.compare-track { flex:1; overflow:hidden; mask-image:linear-gradient(90deg,transparent,black 5%,black 95%,transparent); }
.compare-items { display:flex; gap:2.5rem; align-items:center; white-space:nowrap; animation:marquee 20s linear infinite; }
@keyframes marquee { from { transform:translateX(0); } to { transform:translateX(-50%); } }
.compare-items span { font-family:var(--font-head); font-size:0.85rem; color:var(--text-soft); }
.compare-items .sep { color:var(--border); }
.compare-tag {
  font-size:0.75rem; color:var(--red); white-space:nowrap; font-weight:600;
  padding:0.4rem 0.9rem; background:var(--red-light);
  border-radius:100px; border:1px solid var(--border-red);
}

/* SERVICES */
.services-section { position:relative; z-index:2; padding:7rem 2rem; max-width:1300px; margin:0 auto; }
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.services-grid .svc-card:nth-child(4) { grid-column:1; }
.services-grid .svc-card:nth-child(5) { grid-column:3; }
.svc-card {
  position:relative; padding:2.5rem 2rem;
  background:var(--bg-card); border:1px solid var(--border);
  border-radius:18px; transition:all 0.4s var(--ease);
  overflow:hidden; box-shadow:var(--shadow-sm);
}
.svc-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,transparent,var(--red),transparent);
  transform:scaleX(0); transition:transform 0.4s var(--ease);
}
.svc-card:hover { border-color:var(--border-red); transform:translateY(-8px); box-shadow:var(--shadow-lg),0 0 40px rgba(232,0,29,0.06); }
.svc-card:hover::before { transform:scaleX(1); }
.svc-card.featured { background:linear-gradient(145deg,#fff5f5,var(--white)); border-color:var(--border-red); }
.svc-number {
  font-family:var(--font-head); font-size:4rem; font-weight:800;
  color:rgba(0,0,0,0.04); position:absolute; top:1rem; right:1.25rem;
  line-height:1; user-select:none;
}
.svc-badge {
  display:inline-flex; align-items:center; gap:0.4rem;
  padding:0.3rem 0.75rem; background:var(--red); color:white;
  font-size:0.7rem; font-weight:700; border-radius:100px;
  margin-bottom:1rem; letter-spacing:0.05em;
}
.svc-icon-wrap { margin-bottom:1.5rem; perspective:400px; }
.svc-icon-3d {
  width:58px; height:58px;
  display:flex; align-items:center; justify-content:center;
  background:var(--red-light); border:1px solid var(--border-red);
  border-radius:14px; transition:all 0.4s var(--ease);
}
.svc-card:hover .svc-icon-3d { background:var(--red); transform:rotateY(15deg) rotateX(-10deg); box-shadow:6px 6px 20px rgba(232,0,29,0.25); }
.svc-icon-3d i { font-size:1.4rem; color:var(--red); transition:color 0.3s; }
.svc-card:hover .svc-icon-3d i { color:white; }
.svc-card h3 { font-family:var(--font-head); font-size:1.25rem; font-weight:700; color:var(--text-h); margin-bottom:0.75rem; }
.svc-card > p { font-size:0.9rem; color:var(--text-muted); margin-bottom:1.5rem; line-height:1.65; }
.svc-list { margin-bottom:1.5rem; display:flex; flex-direction:column; gap:0.5rem; }
.svc-list li { display:flex; align-items:center; gap:0.6rem; font-size:0.875rem; color:var(--text-main); }
.svc-list li i { color:var(--red); font-size:0.7rem; }
.svc-benefits { display:flex; flex-wrap:wrap; gap:0.5rem; margin-bottom:1.75rem; }
.svc-benefits span {
  display:flex; align-items:center; gap:0.4rem;
  font-size:0.75rem; color:var(--text-muted); padding:0.3rem 0.7rem;
  background:var(--bg-2); border-radius:100px; border:1px solid var(--border);
}
.svc-benefits span i { color:var(--red); }
.svc-cta { display:inline-flex; align-items:center; gap:0.5rem; font-size:0.875rem; font-weight:600; color:var(--red); transition:gap 0.2s; }
.svc-cta:hover { gap:0.75rem; }
.svc-cta i { font-size:0.75rem; }

/* PLATFORM */
.platform-section { position:relative; z-index:2; background:var(--text-h); padding:8rem 2rem; overflow:hidden; }
.platform-bg { position:absolute; inset:0; overflow:hidden; }
.pb-shape { position:absolute; border-radius:50%; filter:blur(100px); pointer-events:none; }
.pb-shape.s1 { width:500px; height:500px; background:rgba(232,0,29,0.12); top:-100px; right:-100px; }
.pb-shape.s2 { width:300px; height:300px; background:rgba(232,0,29,0.07); bottom:-50px; left:-50px; }
.platform-inner { max-width:1300px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; position:relative; z-index:1; }
.platform-features { display:grid; grid-template-columns:1fr 1fr; gap:0.75rem; margin:2rem 0 2.5rem; }
.pf-item { display:flex; align-items:center; gap:0.6rem; font-size:0.9rem; color:rgba(255,255,255,0.72); }
.pf-item i { color:#4ade80; font-size:0.85rem; }
.platform-ctas { display:flex; gap:1rem; flex-wrap:wrap; }
.btn-white {
  padding:0.8rem 1.8rem; background:var(--white); color:var(--black);
  font-family:var(--font-head); font-weight:700; border-radius:8px;
  transition:all 0.3s var(--ease); font-size:0.9rem;
}
.btn-white:hover { transform:translateY(-2px); box-shadow:0 8px 30px rgba(255,255,255,0.2); }
.btn-outline-white {
  padding:0.8rem 1.8rem; background:transparent; color:var(--white);
  font-family:var(--font-head); font-weight:600; border-radius:8px;
  border:1.5px solid rgba(255,255,255,0.25); transition:all 0.3s var(--ease); font-size:0.9rem;
}
.btn-outline-white:hover { border-color:rgba(255,255,255,0.6); background:rgba(255,255,255,0.06); }

.platform-visual { position:relative; }
.pv-screen {
  background:#1a1a1a; border-radius:18px; border:1px solid rgba(255,255,255,0.08);
  overflow:hidden; box-shadow:0 40px 80px rgba(0,0,0,0.5);
  animation:pvFloat 6s ease-in-out infinite;
}
@keyframes pvFloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-12px); } }
.pvs-header { padding:1rem 1.5rem; background:#111; border-bottom:1px solid rgba(255,255,255,0.06); }
.pvs-nav { display:flex; gap:1.5rem; }
.pvs-nav-item { font-size:0.8rem; color:#666; cursor:default; }
.pvs-nav-item.active { color:#fff; font-weight:600; }
.pvs-body { display:flex; min-height:320px; }
.pvs-sidebar { width:60px; background:#111; padding:1.25rem 0.75rem; border-right:1px solid rgba(255,255,255,0.06); display:flex; flex-direction:column; gap:0.75rem; }
.pvs-menu-item { width:40px; height:40px; display:flex; align-items:center; justify-content:center; border-radius:8px; color:#555; border:1px solid rgba(255,255,255,0.07); font-size:0.875rem; }
.pvs-menu-item.active { background:var(--red); color:white; border-color:var(--red); }
.pvs-main { flex:1; padding:1.25rem; }
.pvs-greeting { font-size:1rem; font-weight:600; color:#fff; margin-bottom:1.25rem; display:flex; align-items:center; gap:0.75rem; }
.notif-badge-w { padding:0.2rem 0.6rem; background:var(--red); border-radius:100px; font-size:0.7rem; color:white; }
.pvs-stats { display:flex; gap:0.75rem; margin-bottom:1.25rem; }
.pvs-stat { flex:1; padding:0.875rem; background:#1f1f1f; border-radius:10px; border:1px solid rgba(255,255,255,0.06); text-align:center; }
.psv { display:block; font-family:var(--font-head); font-size:1.4rem; font-weight:800; color:#fff; }
.psl { font-size:0.7rem; color:#666; }
.pvs-chart { height:100px; background:#1f1f1f; border-radius:10px; border:1px solid rgba(255,255,255,0.06); padding:0.75rem; display:flex; align-items:flex-end; }
.pvc-bars { display:flex; align-items:flex-end; gap:4px; width:100%; height:100%; }
.pvcb { flex:1; height:var(--bh); background:linear-gradient(180deg,var(--red) 0%,rgba(232,0,29,0.15) 100%); border-radius:3px 3px 0 0; }
.pv-launch-pill {
  position:absolute; bottom:-18px; right:30px;
  display:flex; align-items:center; gap:0.5rem;
  padding:0.6rem 1.25rem; background:var(--red); color:white;
  font-family:var(--font-head); font-weight:700; font-size:0.8rem;
  border-radius:100px; box-shadow:var(--shadow-red);
}

/* WHY US */
.why-section { position:relative; z-index:2; padding:7rem 2rem; max-width:1300px; margin:0 auto; }
.compare-table-wrap { overflow-x:auto; margin-bottom:4rem; }
.compare-table { min-width:600px; border-radius:18px; border:1px solid var(--border); overflow:hidden; box-shadow:var(--shadow-sm); }
.ct-header,.ct-row { display:grid; grid-template-columns:1fr 140px 200px; align-items:center; }
.ct-header { background:var(--bg-3); padding:1rem 1.5rem; border-bottom:1px solid var(--border); }
.ct-row { padding:0.875rem 1.5rem; border-bottom:1px solid var(--border); background:var(--white); transition:background 0.2s; }
.ct-row:last-child { border-bottom:none; }
.ct-row:hover { background:var(--bg-2); }
.ct-feature { font-size:0.9rem; color:var(--text-main); font-weight:500; }
.ct-col { text-align:center; font-family:var(--font-head); font-size:0.8rem; font-weight:600; }
.ct-col.other { color:var(--text-soft); }
.ct-col.dv { color:var(--red); }
.text-muted { color:var(--text-soft); }
.text-green { color:#16a34a; }
.text-red   { color:#dc2626; }
.advantages-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; }
.adv-card {
  padding:2rem; background:var(--white); border-radius:16px;
  border:1px solid var(--border); transition:all 0.4s var(--ease);
  text-align:center; box-shadow:var(--shadow-sm);
}
.adv-card:hover { border-color:var(--border-red); transform:translateY(-6px); box-shadow:var(--shadow-md); }
.adv-icon { width:56px; height:56px; display:flex; align-items:center; justify-content:center; background:var(--red-light); border-radius:14px; margin:0 auto 1.25rem; border:1px solid var(--border-red); transition:all 0.3s; }
.adv-card:hover .adv-icon { background:var(--red); }
.adv-icon i { font-size:1.3rem; color:var(--red); transition:color 0.3s; }
.adv-card:hover .adv-icon i { color:white; }
.adv-card h4 { font-family:var(--font-head); font-size:1.1rem; font-weight:700; color:var(--text-h); margin-bottom:0.5rem; }
.adv-card p { font-size:0.875rem; color:var(--text-muted); line-height:1.6; }

/* INDUSTRIES */
.industries-section { position:relative; z-index:2; background:var(--bg-2); padding:7rem 2rem; overflow:hidden; }
.industries-section .section-wrap { position:relative; z-index:1; }
.industries-orbit { position:relative; max-width:800px; margin:0 auto; height:500px; display:flex; align-items:center; justify-content:center; }
.orbit-center { width:140px; height:140px; border-radius:50%; background:linear-gradient(135deg,var(--red),var(--red-deep)); display:flex; align-items:center; justify-content:center; box-shadow:0 0 60px var(--red-glow); z-index:2; position:relative; animation:orbitCenterPulse 4s ease-in-out infinite; }
@keyframes orbitCenterPulse { 0%,100% { box-shadow:0 0 40px var(--red-glow); } 50% { box-shadow:0 0 80px rgba(232,0,29,0.35); } }
.oc-inner { text-align:center; }
.oc-inner i { display:block; font-size:2rem; color:white; margin-bottom:0.3rem; }
.oc-inner span { font-family:var(--font-head); font-size:0.8rem; font-weight:700; color:rgba(255,255,255,0.85); }
.ind-card { position:absolute; width:130px; padding:1.25rem 1rem; background:var(--white); border:1px solid var(--border); border-radius:16px; text-align:center; transition:all 0.4s var(--ease); cursor:default; box-shadow:var(--shadow); }
.ind-card:hover { border-color:var(--border-red); transform:scale(1.05); box-shadow:var(--shadow-md); }
.ind-icon { margin-bottom:0.75rem; }
.ind-icon i { font-size:1.5rem; color:var(--red); }
.ind-card h5 { font-size:0.75rem; color:var(--text-main); line-height:1.4; font-weight:600; }
.ic-1 { top:5%; left:50%; transform:translateX(-50%); }
.ic-2 { top:20%; right:2%; }
.ic-3 { bottom:20%; right:2%; }
.ic-4 { bottom:5%; left:50%; transform:translateX(-50%); }
.ic-5 { top:20%; left:2%; }
.industries-orbit::before { content:''; position:absolute; width:420px; height:420px; border:1px dashed rgba(232,0,29,0.12); border-radius:50%; animation:ringRotate 30s linear infinite; }
@keyframes ringRotate { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }

/* EARLY ACCESS */
.early-access-section { position:relative; z-index:2; padding:7rem 2rem; background:var(--white); }
.ea-inner { max-width:700px; margin:0 auto; text-align:center; position:relative; }
.ea-glow { position:absolute; width:400px; height:400px; background:radial-gradient(circle,rgba(232,0,29,0.06) 0%,transparent 70%); top:50%; left:50%; transform:translate(-50%,-50%); pointer-events:none; }
.ea-pill { display:inline-flex; align-items:center; gap:0.5rem; padding:0.5rem 1.25rem; background:var(--red-light); border:1px solid var(--border-red); border-radius:100px; font-size:0.8rem; color:var(--red); font-weight:600; margin-bottom:1.5rem; }
.ea-inner h2 { font-family:var(--font-head); font-size:clamp(2rem,4vw,3rem); font-weight:800; color:var(--text-h); margin-bottom:1rem; line-height:1.1; }
.ea-inner h2 em { font-style:normal; background:linear-gradient(135deg,var(--red),#ff5050); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.ea-inner > p { font-size:1rem; color:var(--text-muted); margin-bottom:2.5rem; }
.ea-form { display:flex; gap:0.75rem; max-width:520px; margin:0 auto 2rem; }
.ea-form input { flex:1; padding:0.9rem 1.25rem; background:var(--bg-2); border:1.5px solid var(--border); border-radius:8px; color:var(--text-h); font-size:0.9rem; font-family:var(--font-body); transition:border-color 0.2s; }
.ea-form input:focus { outline:none; border-color:var(--red); background:var(--white); }
.ea-form input::placeholder { color:var(--text-soft); }
.ea-form button { display:flex; align-items:center; gap:0.6rem; padding:0.9rem 1.75rem; background:var(--red); color:white; font-family:var(--font-head); font-weight:700; font-size:0.9rem; border:none; border-radius:8px; cursor:pointer; transition:all 0.3s var(--ease); white-space:nowrap; }
.ea-form button:hover { background:var(--red-deep); transform:translateY(-2px); box-shadow:var(--shadow-red); }
.ea-tags { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }
.ea-tags span { display:flex; align-items:center; gap:0.4rem; font-size:0.8rem; color:var(--text-muted); padding:0.35rem 0.9rem; background:var(--bg-2); border-radius:100px; border:1px solid var(--border); }
.ea-tags span i { color:var(--red); font-size:0.7rem; }

/* FAQ */
.faq-section { position:relative; z-index:2; background:var(--bg-2); padding:7rem 2rem; }
.faq-section .section-wrap { max-width:1300px; margin:0 auto 3rem; }
.faq-list { max-width:800px; margin:0 auto; display:flex; flex-direction:column; gap:0.75rem; }
.faq-item { background:var(--white); border-radius:14px; border:1px solid var(--border); overflow:hidden; transition:border-color 0.3s; box-shadow:var(--shadow-sm); }
.faq-item.open { border-color:var(--border-red); box-shadow:var(--shadow); }
.faq-q { display:flex; align-items:center; justify-content:space-between; gap:1rem; width:100%; padding:1.25rem 1.5rem; background:none; border:none; cursor:pointer; text-align:left; }
.faq-q span { font-family:var(--font-head); font-size:1rem; font-weight:600; color:var(--text-h); }
.faq-q i { color:var(--red); transition:transform 0.3s var(--ease); flex-shrink:0; }
.faq-item.open .faq-q i { transform:rotate(45deg); }
.faq-a { max-height:0; overflow:hidden; transition:max-height 0.4s var(--ease); }
.faq-a p { padding:0 1.5rem 1.25rem; font-size:0.9375rem; color:var(--text-muted); line-height:1.75; }

/* CONTACT */
.contact-section { position:relative; z-index:2; padding:7rem 2rem; background:var(--white); }
.contact-grid { max-width:1300px; margin:0 auto; display:grid; grid-template-columns:1fr 1.2fr; gap:5rem; align-items:start; }
.contact-sub { font-size:0.95rem; color:var(--text-muted); margin-bottom:2rem; line-height:1.7; }
.contact-cards { display:flex; flex-direction:column; gap:0.75rem; margin-bottom:2rem; }
.cc { display:flex; align-items:center; gap:1rem; padding:1.25rem; background:var(--bg-2); border-radius:14px; border:1px solid var(--border); transition:border-color 0.3s,box-shadow 0.3s; }
.cc:hover { border-color:var(--border-red); box-shadow:var(--shadow); }
.cc-icon { width:46px; height:46px; display:flex; align-items:center; justify-content:center; background:var(--red-light); border-radius:10px; }
.cc-icon i { color:var(--red); font-size:1.1rem; }
.cc-title { display:block; font-weight:600; font-size:0.9rem; color:var(--text-h); }
.cc-val { font-size:0.8rem; color:var(--text-muted); }
.contact-service-tags { display:flex; flex-wrap:wrap; gap:0.5rem; }
.contact-service-tags span { padding:0.4rem 0.9rem; background:var(--red-light); border:1px solid var(--border-red); border-radius:100px; font-size:0.8rem; color:var(--red); font-weight:500; }
.contact-form-wrap { background:var(--white); border:1px solid var(--border); border-radius:22px; padding:2.5rem; box-shadow:var(--shadow-md); }
.contact-form h3 { font-family:var(--font-head); font-size:1.5rem; font-weight:800; color:var(--text-h); margin-bottom:1.75rem; }
.cf-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:1rem; }
.cf-group { display:flex; flex-direction:column; gap:0.5rem; margin-bottom:1rem; }
.cf-group label { font-size:0.8rem; color:var(--text-muted); font-weight:600; letter-spacing:0.04em; }
.cf-group input,.cf-group select,.cf-group textarea { padding:0.875rem 1rem; background:var(--bg-2); border:1.5px solid var(--border); border-radius:10px; color:var(--text-h); font-size:0.9375rem; font-family:var(--font-body); transition:border-color 0.2s,background 0.2s; }
.cf-group input::placeholder,.cf-group textarea::placeholder { color:var(--text-soft); }
.cf-group input:focus,.cf-group select:focus,.cf-group textarea:focus { outline:none; border-color:var(--red); background:var(--white); box-shadow:0 0 0 3px rgba(232,0,29,0.07); }
.cf-group textarea { resize:vertical; min-height:100px; }
.cf-submit { display:flex; align-items:center; justify-content:center; gap:0.75rem; width:100%; padding:1rem; background:var(--red); color:white; font-family:var(--font-head); font-weight:700; font-size:1rem; border:none; border-radius:10px; cursor:pointer; transition:all 0.3s var(--ease); }
.cf-submit:hover { background:var(--red-deep); transform:translateY(-2px); box-shadow:var(--shadow-red); }

/* FOOTER */
.footer { position:relative; z-index:2; background:var(--text-h); padding:5rem 2rem 2rem; }
.footer-inner { max-width:1300px; margin:0 auto; }
.footer-top { display:grid; grid-template-columns:1.5fr 2fr; gap:4rem; margin-bottom:3rem; padding-bottom:3rem; border-bottom:1px solid rgba(255,255,255,0.08); }
.fb-logo { display:flex; align-items:center; gap:0.75rem; font-family:var(--font-head); font-size:1.4rem; font-weight:800; color:var(--white); margin-bottom:1rem; }
.fb-logo i { color:var(--red); }
.footer-brand > p { font-size:0.9rem; color:rgba(255,255,255,0.4); line-height:1.7; margin-bottom:1.5rem; }
.fb-socials { display:flex; gap:0.75rem; }
.fb-socials a { width:38px; height:38px; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); border-radius:8px; color:rgba(255,255,255,0.45); transition:all 0.3s; font-size:0.9rem; }
.fb-socials a:hover { background:var(--red); color:white; border-color:var(--red); }
.footer-links-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }
.fl-col h5 { font-family:var(--font-head); font-size:0.9rem; font-weight:700; color:var(--white); margin-bottom:1.25rem; }
.fl-col ul { display:flex; flex-direction:column; gap:0.7rem; }
.fl-col a { font-size:0.875rem; color:rgba(255,255,255,0.4); transition:color 0.2s; }
.fl-col a:hover { color:var(--red); }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.footer-bottom p { font-size:0.8rem; color:rgba(255,255,255,0.28); }
.fb-legal { display:flex; gap:1.5rem; }
.fb-legal a { font-size:0.8rem; color:rgba(255,255,255,0.28); transition:color 0.2s; }
.fb-legal a:hover { color:rgba(255,255,255,0.6); }

/* BACK TO TOP */
.back-to-top { position:fixed; bottom:2rem; right:2rem; width:46px; height:46px; display:flex; align-items:center; justify-content:center; background:var(--red); color:white; border-radius:50%; z-index:900; opacity:0; visibility:hidden; transform:translateY(10px); transition:all 0.3s var(--ease); box-shadow:var(--shadow-red); }
.back-to-top.visible { opacity:1; visibility:visible; transform:translateY(0); }
.back-to-top:hover { transform:translateY(-4px); }

/* REVEAL */
.reveal { opacity:0; transform:translateY(40px); transition:opacity 0.7s var(--ease-out),transform 0.7s var(--ease-out); }
.reveal.visible { opacity:1; transform:translateY(0); }
.reveal-delay-1 { transition-delay:0.1s; }
.reveal-delay-2 { transition-delay:0.2s; }

/* RESPONSIVE */
@media (max-width:1100px) {
  .hero { grid-template-columns:1fr; text-align:center; padding-top:8rem; }
  .hero-sub { margin:0 auto 2rem; }
  .hero-actions { justify-content:center; }
  .hero-metrics { justify-content:center; }
  .hero-visual { display:none; }
  .services-grid { grid-template-columns:repeat(2,1fr); }
  .services-grid .svc-card:nth-child(4),.services-grid .svc-card:nth-child(5) { grid-column:auto; }
  .platform-inner { grid-template-columns:1fr; }
  .platform-text { text-align:center; }
  .platform-text .section-desc { margin:0 auto; }
  .platform-features { max-width:400px; margin:2rem auto; }
  .platform-ctas { justify-content:center; }
  .advantages-grid { grid-template-columns:repeat(2,1fr); }
  .contact-grid { grid-template-columns:1fr; }
  .footer-top { grid-template-columns:1fr; }
}
@media (max-width:768px) {
  .nav-links { position:fixed; top:70px; left:0; right:0; background:rgba(255,255,255,0.98); backdrop-filter:blur(20px); flex-direction:column; padding:2rem; gap:1.5rem; border-bottom:1px solid var(--border); transform:translateY(-110%); opacity:0; visibility:hidden; transition:all 0.4s var(--ease); box-shadow:var(--shadow-md); }
  .nav-links.active { transform:translateY(0); opacity:1; visibility:visible; }
  .nav-cta { display:none; }
  .hamburger { display:flex; }
  .services-grid { grid-template-columns:1fr; }
  .compare-inner { flex-direction:column; gap:1rem; align-items:flex-start; }
  .compare-track { width:100%; }
  .advantages-grid { grid-template-columns:1fr 1fr; }
  .industries-orbit { height:auto; position:static; display:flex; flex-direction:column; align-items:center; gap:1.5rem; }
  .industries-orbit::before { display:none; }
  .orbit-center { position:static; margin-bottom:1rem; }
  .ind-card { position:static; width:100%; max-width:200px; transform:none !important; }
  .footer-links-grid { grid-template-columns:1fr 1fr; }
  .footer-bottom { flex-direction:column; text-align:center; }
  .ea-form { flex-direction:column; }
}
@media (max-width:480px) {
  .hero-title { font-size:2.75rem; }
  .advantages-grid { grid-template-columns:1fr; }
  .cf-row { grid-template-columns:1fr; }
  .contact-form-wrap { padding:1.5rem; }
  .footer-links-grid { grid-template-columns:1fr; }
  .fb-legal { flex-direction:column; gap:0.5rem; align-items:center; }
}
