/* Plotnova — futuristic streaming visual system */
:root {
  --primary: #7c5cff !important;
  --primary-dark: #6547ea !important;
  --accent: #35e7ff !important;
  --bg: #06070b !important;
  --bg-card: #10131b !important;
  --text: #f2f7ff !important;
  --text-muted: #96a1b5 !important;
  --border: rgba(134,158,205,.17) !important;
  --shadow: 0 28px 80px rgba(0,0,0,.48), 0 0 50px rgba(124,92,255,.08);
}

html { scroll-behavior: smooth; }
body {
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  background:
    radial-gradient(circle at 82% 8%, rgba(124,92,255,.18), transparent 31rem),
    radial-gradient(circle at 10% 42%, rgba(53,231,255,.08), transparent 29rem),
    var(--bg) !important;
}
body::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: -1; opacity: .42;
  background-image: linear-gradient(rgba(92,120,170,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(92,120,170,.08) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(to bottom, black, transparent 78%);
}

nav { background: rgba(6,7,11,.7) !important; border-color: var(--border) !important; box-shadow: 0 1px rgba(53,231,255,.04); }
.nav-inner { max-width: 1240px !important; }
.logo { font-weight: 850 !important; letter-spacing: -.04em; }
.logo span { color: var(--accent) !important; }
.nav-links { gap: 7px !important; flex-wrap: wrap; justify-content: flex-end; }
.nav-links a { display: block; padding: 7px 10px; border-radius: 999px; font-size: 13px !important; }
.nav-links a:hover { background: rgba(53,231,255,.08); color: var(--accent) !important; }
.lang-btn { border-radius: 999px !important; background: rgba(255,255,255,.06) !important; }
.lang-dropdown { border-radius: 16px !important; box-shadow: var(--shadow) !important; }

.hero { position: relative; overflow: hidden; min-height: 92vh !important; text-align: left !important; justify-content: flex-start !important; background: none !important; }
.hero::after { content: "01\A STREAM"; white-space: pre; position: absolute; right: max(5vw, 24px); bottom: 3vh; font-size: clamp(100px, 18vw, 250px); font-weight: 900; line-height: .7; letter-spacing: -.09em; color: transparent; -webkit-text-stroke: 1px rgba(53,231,255,.12); transform: none; pointer-events: none; }
.hero > div { width: min(1240px, 100%); margin: 0 auto; position: relative; z-index: 1; }
.hero > div::before { content: "●  PLOTNOVA  /  STORIES IN MOTION"; display: inline-block; margin-bottom: 24px; color: var(--accent); font-size: 12px; font-weight: 800; letter-spacing: .18em; text-shadow: 0 0 16px rgba(53,231,255,.55); }
.hero h1 { max-width: 820px; font-size: clamp(48px, 7.5vw, 96px) !important; line-height: .96 !important; letter-spacing: -.065em; }
.hero h1 .highlight { background: linear-gradient(100deg, var(--accent), #a993ff 60%, #7c5cff) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; filter: drop-shadow(0 0 28px rgba(53,231,255,.12)); }
.hero p { max-width: 590px !important; margin: 0 0 38px !important; font-size: clamp(17px, 2vw, 21px) !important; }
.btn { border-radius: 999px !important; font-weight: 750 !important; }
.btn-primary { background: linear-gradient(110deg, var(--accent), var(--primary)) !important; color: #05070c !important; box-shadow: 0 12px 36px rgba(91,118,255,.22); }
.btn-primary:hover { filter: brightness(1.12); box-shadow: 0 16px 50px rgba(53,231,255,.25) !important; }
.btn-outline { background: rgba(255,255,255,.035); }

section { padding-top: 112px !important; padding-bottom: 112px !important; }
.section-title { font-size: clamp(35px, 5vw, 58px) !important; letter-spacing: -.05em; line-height: 1; }
.section-sub { line-height: 1.7; }
.features-grid { gap: 16px !important; }
.feature-card, .download-card, .faq-item, .contact-box, .request-box, .info-card {
  background: linear-gradient(145deg, rgba(18,24,37,.92), rgba(8,11,18,.78)) !important;
  border-color: var(--border) !important; border-radius: 24px !important; box-shadow: inset 0 1px rgba(255,255,255,.04);
}
.feature-card { min-height: 250px; position: relative; overflow: hidden; }
.feature-card::after { content: ""; position: absolute; width: 130px; height: 130px; right: -70px; bottom: -70px; border: 1px solid rgba(53,231,255,.18); transform: rotate(45deg); }
.feature-card:hover { border-color: rgba(53,231,255,.52) !important; transform: translateY(-6px) !important; box-shadow: var(--shadow), inset 0 1px rgba(53,231,255,.08); }
.feature-icon { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 16px; background: linear-gradient(145deg, rgba(53,231,255,.12), rgba(124,92,255,.14)); border: 1px solid rgba(53,231,255,.12); font-size: 28px !important; }
.download-section { background: rgba(255,255,255,.018) !important; border-block: 1px solid var(--border); }
.download-card { padding: 38px !important; }
.platform-badge { border-radius: 14px !important; background: rgba(53,231,255,.1) !important; color: var(--accent) !important; border: 1px solid rgba(53,231,255,.16); }
.about-section { background: transparent !important; }
.about-visual { min-height: 420px; display: grid; place-items: center; border-radius: 28px; background: radial-gradient(circle at 50% 42%, rgba(53,231,255,.2), transparent 34%), repeating-radial-gradient(circle at 50% 50%, transparent 0 38px, rgba(124,92,255,.08) 39px 40px), linear-gradient(135deg, #111729, #070910); border: 1px solid var(--border); box-shadow: var(--shadow); }
.stat-num { color: var(--accent) !important; }
.contact-info { max-width: 680px; margin: 0 auto; padding: 36px; border: 1px solid var(--border); border-radius: 24px; background: rgba(255,255,255,.025); }
a { text-underline-offset: 4px; }
.content { max-width: 860px !important; }
.content > h1 { font-size: clamp(40px, 7vw, 64px) !important; letter-spacing: -.055em; line-height: 1.03; margin-top: 18px; }
.content h2 { padding-top: 8px; letter-spacing: -.025em; }
.content p, .content li { line-height: 1.8; }
.back { padding: 8px 14px; border: 1px solid var(--border); border-radius: 999px; }
.back:hover { background: rgba(255,255,255,.06); }
footer { background: rgba(0,0,0,.12); }

@media (max-width: 980px) { .nav-links li:nth-child(n+5) { display: none; } }
@media (max-width: 768px) {
  .hero { min-height: 82vh !important; padding-top: 140px !important; }
  .hero::after { opacity: .5; }
  .hero h1 { font-size: clamp(46px, 15vw, 72px) !important; }
  .hero .btn { display: block; width: 100%; text-align: center; margin: 10px 0 !important; }
  section { padding: 82px 20px !important; }
  .about-visual { min-height: 260px; }
  .footer-links { gap: 14px !important; flex-wrap: wrap; }
}
@media (max-width: 560px) {
  .nav-links { display: none !important; }
  .content { padding: 44px 20px 80px !important; }
  nav .nav-inner { flex-direction: row !important; align-items: center !important; }
  .logo { font-size: 18px !important; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; } }