:root {
  --bg: #06101d;
  --panel: #0b1625;
  --line: #20334c;
  --purple: #9852ff;
  --blue: #2897ff;
}

body {
  background: linear-gradient(118deg, #06101d 0%, #07111f 54%, #0c1122 100%);
}

body::before {
  position: fixed;
  height: 900px;
  background: radial-gradient(ellipse at 82% 16%, #46179155, transparent 62%), linear-gradient(135deg, transparent 48%, #36147745 48% 60%, transparent 60%);
  pointer-events: none;
}

header {
  max-width: 100%;
  height: 84px;
  padding: 0 2.35%;
  border-color: #1c2c40;
  background: #07111ee8;
  backdrop-filter: blur(16px);
  position: relative;
  z-index: 20;
}

.brand { gap: 15px; font-size: 19px; white-space: nowrap; }
.brand img { width: 39px; height: 39px; }
.brand span { display: flex; align-items: center; gap: 9px; }
.brand b { display: inline; margin: 0; font-size: inherit; letter-spacing: 4px; color: var(--purple); }
nav { gap: 31px; font-size: 13px; font-weight: 700; }
nav a { color: #c5cddd; }
nav .active { padding-top: 31px; padding-bottom: 29px; }
.login { padding: 11px 20px; border-color: #344963; background: #0a1422; }
.header-cta { display: inline-flex; align-items: center; gap: 16px; padding: 13px 21px !important; border-radius: 8px; background: linear-gradient(120deg, #7d35f3, #a04cff); box-shadow: 0 12px 35px #7b2fff28; color: white !important; }
.header-cta:hover { filter: brightness(1.08); }

.hero { max-width: 100%; min-height: 730px; grid-template-columns: .76fr 1.24fr; gap: 62px; padding: 105px 2.35% 100px; }
.hero::before { width: 68%; height: 118%; right: -5%; top: -13%; background: linear-gradient(140deg, #44208e9c, #20113b00); clip-path: polygon(45% 0, 100% 0, 36% 100%, 0 100%); }
.hero h1 { font-size: clamp(52px, 5.15vw, 76px); line-height: 1.07; }
.lead { font-size: 18px; line-height: 1.65; max-width: 470px; }
.button { border-radius: 8px; padding: 15px 24px; }
.secondary { border-color: #425474; background: #071220; }
.micro { color: #7e8ea5; }
.hero-visual { transform: translateY(-2px); }
.window { border-color: #5a3a86; border-radius: 13px; background: #0c1420; }
.window-top, .window-bottom { padding: 13px 16px; }
.floating { border-color: #654090; background: #111421ed; }
.hero-signature { position: absolute; left: 2.35%; bottom: 28px; margin: 0; color: #a55eff; font-size: 9px; font-weight: 800; letter-spacing: 3px; }

.feature-strip { max-width: 100%; padding: 26px 3.2%; border-color: #1d3048; background: #07111b88; }
.feature-strip span { display: flex; align-items: center; gap: 12px; color: #d6ddec; font-size: 12px; }
.feature-strip i { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid #6d3ca7; border-radius: 9px; color: #b36dff; font-style: normal; font-size: 18px; background: #111426; }
.feature-strip b { font-weight: 600; }

.section { max-width: 1380px; }
.showcase, .plan { background: linear-gradient(145deg, #0b1724, #101421); border-color: #273a50; }
.showcase-image { background: #07111d; }
.download { background: radial-gradient(ellipse at 18% 38%, #5b20a23d, transparent 70%), #0b1624; border-color: #3d4b65; }
.recommended { background: linear-gradient(140deg, #0c2138, #25123d); border-color: #7750a9; }
.closing { background: radial-gradient(ellipse at bottom, #57208f42, transparent 68%); }

@media (max-width: 1100px) {
  header { padding: 0 3%; }
  nav { gap: 18px; }
  .header-cta { display: none; }
  .hero { grid-template-columns: 1fr; padding: 70px 5% 90px; }
  .hero-signature { left: 5%; }
}

@media (max-width: 650px) {
  header { height: 74px; padding: 0 6%; }
  .brand span { gap: 6px; }
  .brand, .brand b { font-size: 14px; letter-spacing: 3px; }
  nav { top: 74px; align-items: stretch; }
  .language-select { order: 0 !important; margin: 0 !important; width: 76px; }
  .hero { padding: 55px 6% 75px; }
  .hero-signature { display: none; }
  .feature-strip { display: grid; grid-template-columns: 1fr 1fr; padding: 24px 6%; gap: 16px; }
  .feature-strip span:last-child { grid-column: 1 / -1; }
  .feature-strip i { width: 36px; height: 36px; }
  .secondary { font-size: 11px; }
}

.footer-links{display:flex;flex-wrap:wrap;gap:14px;font-size:12px;color:#a8b5ca}.footer-links a:hover,.support-link:hover{color:#cba0ff}.support-link{display:block;margin-top:16px;color:#cba0ff}nav .language-select{min-height:40px}.hero img.editor{height:auto}h1{white-space:normal}@media(max-width:650px){.footer-links{width:100%;line-height:1.8}.hero h1{font-size:clamp(38px,10vw,60px)}}

/* Original Follow artwork; transparent PNG in every brand position. */
.brand img{width:58px;height:44px;object-fit:contain;background:transparent;flex-shrink:0}.window-brand{display:inline-flex;align-items:center;gap:8px}.window-brand img{object-fit:contain;background:transparent}@media(max-width:650px){.brand img{width:46px;height:36px}.brand{gap:9px}.window-brand{gap:5px}.window-brand img{width:26px;height:20px}}