:root{
  --ink:#10253f; --muted:#5b6b80;
  --brand:#0d47a1; --brand2:#5ab1c5;
  --glass-bg: rgba(255,255,255,.72);
  --line:#e4ecf7; --r:16px; --wrap:1100px;
}
*{box-sizing:border-box} html,body{height:100%}
body{margin:0; font-family:Montserrat,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; color:var(--ink); background:linear-gradient(180deg,#eaf3ff,#d9e8ff);}

/* --- Háttérdekor --- */
.splash-bg{
  position:fixed; inset:-20% -10% -10% -10%; z-index:-1;
  background:
    radial-gradient(900px 380px at 85% -10%, rgba(90,177,197,.20), transparent 60%),
    radial-gradient(900px 380px at 10% 110%, rgba(13,71,161,.15), transparent 60%),
    url("hero-med.jpg") center/cover no-repeat;   /* ha nincs kép, törölhető */
  filter:saturate(.96) contrast(.98) brightness(.98);
}

/* --- Felső rész --- */
.splash-top{ text-align:center; padding:26px 16px 8px }
.brand{ width:min(420px, 80vw); height:auto; filter:drop-shadow(0 10px 20px rgba(13,71,161,.12)); }
.chips{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top:10px }
.chip{ background:var(--glass-bg); border:1px solid var(--line); border-radius:999px; padding:6px 12px; text-decoration:none; color:var(--ink); backdrop-filter: blur(6px); }

/* --- Tartalom --- */
.splash-wrap{ max-width:var(--wrap); margin:18px auto 22px; padding:0 18px; display:grid; gap:18px }
.glass{ background:var(--glass-bg); border:1px solid var(--line); border-radius:var(--r); backdrop-filter: blur(8px); box-shadow:0 18px 38px rgba(16,37,63,.10); }

.hero-pane{ padding:18px; text-align:center }
.hero-pane h1{ margin:0 0 6px; font-size:clamp(22px,4.4vw,40px); font-weight:800; color:#10325a }
.lead{ margin:0 auto 12px; color:#2a446b; max-width:720px }
.cta{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center }

.btn{ display:inline-flex; align-items:center; justify-content:center; padding:10px 16px; border-radius:999px; text-decoration:none; border:1px solid transparent; font-weight:700; transition:.2s ease; }
.btn:hover{ transform:translateY(-1px) }
.btn.primary{ background:var(--brand); color:#fff; box-shadow:0 10px 24px rgba(13,71,161,.22) }
.btn.primary:hover{ background:#0b3f90 }
.btn.ghost{ background:#fff; color:var(--ink); border-color:var(--line) }
.btn.tiny{ padding:6px 10px; font-size:12px }

/* --- 3 kártya --- */
.grid3{ display:grid; gap:18px; grid-template-columns:repeat(3,1fr) }
.card{ padding:16px }
.card h2{ margin:0 0 6px; font-size:20px; color:#17324f }
.card p{ margin:0 0 8px; color:var(--muted) }
.link{ color:var(--brand); text-decoration:none; font-weight:700 }
.link:hover{ text-decoration:underline }

/* --- Ticker --- */
.ticker{ display:flex; align-items:center; gap:10px; padding:10px 12px }
.ticker .tag{ background:#eef5ff; border:1px solid #d8e6ff; color:#19406f; padding:4px 8px; border-radius:999px; font-weight:700; }
.ticker .text{ color:#17324f }

/* --- Irányító rész --- */
.route{ padding:14px 16px; text-align:center }
.route h3{ margin:0 0 4px; font-size:16px }
.muted{ color:var(--muted); margin:0 0 12px }
.route-cta{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-bottom:10px }
.bar{ position:relative; height:8px; background:#eaf1fb; border-radius:999px; overflow:hidden; }
.bar span{ position:absolute; left:0; top:0; bottom:0; width:0%; background:linear-gradient(90deg, var(--brand), var(--brand2)); }

/* --- Lábléc --- */
.splash-foot{ text-align:center; color:var(--muted); padding:10px 16px 18px }
.social{ display:flex; gap:14px; justify-content:center; margin-bottom:6px }
.social a{ color:var(--muted); text-decoration:none }
.social a:hover{ color:var(--brand) }
.social-links{
  display:flex; gap:14px; align-items:center; justify-content:center;
}
.social-links a{
  width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:999px; background:rgba(255,255,255,.9); border:1px solid var(--line, #e4ecf7);
  box-shadow:0 8px 18px rgba(16,42,77,.10);
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.social-links a:hover{ transform:translateY(-1px); box-shadow:0 14px 28px rgba(16,42,77,.14); }
.social-links a:focus-visible{ outline:3px solid rgba(13,71,161,.35); outline-offset:3px; }
.social-links img{ display:block; width:24px; height:24px; opacity:.95; filter:grayscale(.1) }
.social-links a:hover img{ opacity:1; filter:none }

/* --- Reszponzív --- */
@media (max-width: 980px){ .grid3{ grid-template-columns:1fr 1fr } }
@media (max-width: 640px){ .grid3{ grid-template-columns:1fr } .chips{ padding:0 8px } }