:root {
  --bg: #0f1115;
  --bg-alt: #181b21;
  --fg: #f5f7fa;
  --accent: #1e90ff;
  --accent-alt: #4dabf7;
  --accent-warm: #ffb347;
  --gradient-accent: linear-gradient(135deg,#1e90ff,#4dabf7 55%,#82d4ff);
  --gradient-surface: linear-gradient(145deg,#151b22,#101418 55%,#151b22);
  --gradient-border: linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,0));
  --radius: 14px;
  --font-stack: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
  --ease: cubic-bezier(.4,.08,.2,1);
  --max-w: 1040px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font-stack);
  background:
    radial-gradient(circle at 20% 18%, rgba(77,171,247,.18), transparent 60%),
    radial-gradient(circle at 85% 70%, rgba(30,144,255,.15), transparent 65%),
    #0f1115;
  color: var(--fg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
}

body, button { font-size: 16px; }

.site-header {
  position: sticky; top: 0; z-index: 50;
  backdrop-filter: blur(12px);
  background: rgba(15,17,21,0.72);
  display: flex; align-items: center; gap: 2rem;
  padding: .75rem 1.25rem; border-bottom: 1px solid #222831;
}
.brand { display: flex; align-items: center; gap:.5rem; font-weight:600; }
.brand-name { font-size: 1.1rem; letter-spacing:.5px; }
.logo { filter: drop-shadow(0 0 4px rgba(255,255,255,.25)); }
.brand { text-decoration:none; color:var(--fg); }
.brand:focus-visible { outline:2px solid var(--accent); outline-offset:4px; border-radius:8px; }
.logo-img { width:32px; height:32px; border-radius:6px; box-shadow:0 0 0 1px #223038, 0 2px 6px -2px rgba(0,0,0,.6); }

.main-nav ul { list-style: none; margin:0; padding:0; display:flex; gap:1.25rem; }
.main-nav a { text-decoration:none; color: var(--fg); font-weight:500; position:relative; padding:.35rem .15rem; }
.main-nav a:after { content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--accent); transform:scaleX(0); transform-origin:left; transition:transform .35s var(--ease); }
.main-nav a:hover:after, .main-nav a:focus-visible:after { transform:scaleX(1); }

.nav-toggle { background:none; border:1px solid #303841; color:var(--fg); padding:.45rem .65rem; border-radius:8px; display:none; cursor:pointer; }

.lang-switch { margin-left:auto; display:flex; gap:.5rem; }
.lang-switch button { background:#1f242c; color:var(--fg); border:1px solid #303841; padding:.4rem .9rem; border-radius:999px; cursor:pointer; font-weight:500; letter-spacing:.5px; }
.lang-switch button.active { background:var(--accent); color:#fff; box-shadow:0 0 0 3px rgba(30,144,255,.35); }
.lang-switch button:focus-visible { outline:2px solid var(--accent-alt); outline-offset:2px; }

/* Hero */
.hero { position:relative; padding:clamp(4.5rem, 12vh, 9rem) 1.5rem 3.5rem; text-align:center; overflow:hidden; }
.hero:before, .hero:after { content:""; position:absolute; inset:0; pointer-events:none; }
.hero:before { background:
  radial-gradient(circle at 65% 35%, rgba(130,212,255,.25), transparent 60%),
  radial-gradient(circle at 30% 75%, rgba(30,144,255,.20), transparent 70%);
  filter:blur(40px);
  opacity:.7;
}
.hero:after { background:
  repeating-linear-gradient(110deg, rgba(255,255,255,.04) 0 2px, transparent 2px 6px),
  linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,0));
  mix-blend-mode:overlay;
  mask:linear-gradient(#000,#000,transparent 90%);
  opacity:.6;
}
.hero-inner { position:relative; max-width:820px; margin:0 auto; }
.hero h1 { font-size:clamp(2.4rem, 4.2vw + 1rem, 3.75rem); line-height:1.05; margin:0 0 1.15rem; background:linear-gradient(90deg,#ffffff,#b4e4ff 45%,#ffffff); -webkit-background-clip:text; background-clip:text; color:transparent; letter-spacing:.5px; }
.lead { font-size:clamp(1.05rem, .9rem + .6vw, 1.35rem); font-weight:400; opacity:.9; margin:0 0 1.75rem; }
.btn { display:inline-flex; align-items:center; gap:.5rem; background:var(--accent); color:#fff; text-decoration:none; padding:.85rem 1.35rem; border-radius:10px; font-weight:600; letter-spacing:.5px; box-shadow:0 4px 18px -4px rgba(30,144,255,.55); transition:.35s var(--ease); }
.btn:hover, .btn:focus-visible { background:var(--accent-alt); transform:translateY(-2px); box-shadow:0 6px 24px -6px rgba(77,171,247,.6); }

.content { max-width: var(--max-w); margin:0 auto; padding:0 1.25rem 4rem; }
.section { margin-top:4rem; background:var(--gradient-surface); padding:2.65rem clamp(1rem,2vw,2.3rem) 2.85rem; border:1px solid rgba(255,255,255,.07); border-radius:calc(var(--radius) + 2px); position:relative; overflow:hidden; }
.section:before { content:""; position:absolute; inset:0; background:
  radial-gradient(circle at 88% 18%,rgba(77,171,247,.22),transparent 60%),
  linear-gradient(115deg,rgba(255,255,255,.06),rgba(255,255,255,0) 65%);
  pointer-events:none; mix-blend-mode:screen; }
.section:after { content:""; position:absolute; inset:0; padding:1px; border-radius:inherit; background:linear-gradient(120deg,rgba(130,212,255,.35),rgba(255,255,255,0) 55%); mask:linear-gradient(#000,#000) content-box, linear-gradient(#000,#000); mask-composite:exclude; -webkit-mask-composite:xor; pointer-events:none; opacity:.55; }
.section.alt { background:linear-gradient(150deg,#12181e,#101317 60%,#12181e); }
.section h2 { margin-top:0; font-size:1.9rem; letter-spacing:.5px; }
.section p { line-height:1.55; }
/* Feature lists as responsive cards */
.feature-list { list-style:none; padding:0; margin:1.4rem 0 0; display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }
.feature-list.cards-tight { gap:.75rem; }
.feature-list li { position:relative; padding:1rem .95rem 1.05rem; background:linear-gradient(160deg,#182128,#14191e); border:1px solid rgba(255,255,255,.06); border-radius:12px; box-shadow:0 4px 14px -6px rgba(0,0,0,.55); line-height:1.45; font-size:.93rem; display:flex; flex-direction:column; gap:.35rem; }
.feature-list li strong { font-size:.9rem; font-weight:600; letter-spacing:.3px; display:block; background:linear-gradient(90deg,#fff,#d5efff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.feature-list li strong { position:relative; padding-right:.4rem; }
.feature-list li strong:after { content:""; position:absolute; left:0; bottom:-2px; height:2px; width:42%; background:linear-gradient(90deg,var(--accent),transparent); opacity:.75; border-radius:2px; }
.feature-list li .desc { display:block; font-size:.78rem; line-height:1.4; opacity:.85; }
.feature-list li:before { content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; background:linear-gradient(140deg,rgba(130,212,255,.55),rgba(255,255,255,0) 70%); mask:linear-gradient(#000,#000) content-box, linear-gradient(#000,#000); mask-composite: exclude; -webkit-mask-composite:xor; opacity:.55; pointer-events:none; }
/* Top accent bar removed per request */
/*.feature-list li:after { content:""; position:absolute; top:0; left:0; height:4px; width:100%; background:linear-gradient(90deg,var(--accent),var(--accent-alt)); border-top-left-radius:inherit; border-top-right-radius:inherit; opacity:.8; }*/
/* Keep pseudo-element disabled */
.feature-list li:after { content:none; }

/* Intro (first solutions) emphasis */
.section.intro { border:1px solid rgba(255,255,255,.09); background:linear-gradient(145deg,#18242e,#121a21 65%,#18242e); box-shadow:0 18px 48px -22px rgba(0,0,0,.8), 0 6px 16px -8px rgba(0,0,0,.55); position:relative; }
.section.intro:after { content:""; position:absolute; inset:0; background:
  radial-gradient(circle at 70% 25%,rgba(130,212,255,.25),transparent 60%),
  radial-gradient(circle at 25% 75%,rgba(77,171,247,.22),transparent 65%);
  pointer-events:none; mix-blend-mode:screen; }
.kicker { font-size:.7rem; letter-spacing:2px; text-transform:uppercase; font-weight:600; margin:0 0 .75rem; color:#7bbef8; background:linear-gradient(90deg,#1e90ff,#4dabf7); -webkit-background-clip:text; background-clip:text; color:transparent; }

.contact-list { list-style:none; margin:1rem 0 0; padding:0; display:grid; gap:.4rem; }
.contact-list a { color:var(--accent); text-decoration:none; }
.contact-list a:hover, .contact-list a:focus-visible { text-decoration:underline; }

/* Inline language switch */
.lang-switch-inline { display:flex; align-items:center; gap:.35rem; margin-left:.75rem; }
.lang-switch-inline .lang { font-size:.75rem; text-transform:uppercase; letter-spacing:.9px; font-weight:600; padding:.35rem .6rem; border:1px solid #2a323b; border-radius:999px; background:#1b2229; text-decoration:none; color:#cfd6dc; transition:.3s var(--ease); }
.lang-switch-inline .lang:hover, .lang-switch-inline .lang:focus-visible { background:#25303a; color:#fff; }
.lang-switch-inline .lang.current { background:var(--accent); color:#fff; border-color:var(--accent); box-shadow:0 0 0 3px rgba(30,144,255,.35); }
.lang-switch-inline .sep { opacity:.5; font-size:.75rem; }


.site-footer { margin-top:auto; text-align:center; padding:2.5rem 1rem 3rem; opacity:.75; font-size:.85rem; }
.site-footer p { margin:0; }

@media (max-width: 860px) {
  /* Full-screen mobile nav panel */
  .main-nav ul { position:fixed; inset:0; width:100vw; height:100dvh; background:#101419; flex-direction:column; padding:6rem 1.75rem 2.5rem; gap:1.1rem; transform:translateX(105%); transition:transform .45s var(--ease); box-shadow:none; overflow-y:auto; }
  .main-nav ul[data-open="true"] { transform:translateX(0); }
  .main-nav ul li a { display:block; font-size:1.05rem; }
  .nav-toggle { display:inline-flex; }
  body.nav-open { overflow:hidden; }
}

@media (prefers-reduced-motion: reduce) { *, *:before, *:after { animation:none!important; transition:none!important; } }