/* =========================
   K-Check — site.css (Unified dark top block + sticky blur)
   ========================= */

:root {
  --bg:#0B1F38;
  --text:#112B45;
  --muted:#5e6a7a;
  --white:#fff;
  --brand:#00D4FF;
  --brand2:#20C997;
  --border:#e6e9ee;
  --shadow:0 8px 24px rgba(0,0,0,.08);

  /* Blocul superior (utilbar + nav + search) */
  --top-base:#123B63;                  /* teal deschis */
  --top-grad-1:rgba(0,212,255,.10);    /* cyan subtil */
  --top-grad-2:rgba(18,58,103,.12);    /* teal subtil */
  --top-border:#0C223F;

  /* Suprafețe interne */
  --top-card:#164675;
  --top-card-hi:#1B538B;
  --top-card-border:#1E5A91;

  /* Text pe dark */
  --top-text:#eaf7ff;
  --top-placeholder:#cfe8ff;

  /* layout heights (update din JS) */
  --utilbar-h:40px;
  --nav-h:72px;
  --header-h:calc(var(--utilbar-h) + var(--nav-h));

  /* hero */
  --hero-bg:var(--bg);
  --hero-text:#00D4FF;
  --hero-text-2:#48E1FF;
}

/* ====== Base ====== */
* { box-sizing:border-box; }
body {
  margin:0;
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,Arial,sans-serif;
  color:var(--text);
  background:#fff;
}
a { color:inherit; text-decoration:none; }
.container { max-width:1200px; margin:0 auto; padding:0 20px; }

/* ====== Utility bar (dark unified) ====== */
.utilbar {
  background:
    linear-gradient(180deg, var(--top-grad-1), var(--top-grad-2)),
    var(--top-base);
  color:var(--top-text);
  border-bottom:1px solid var(--top-border);
  font-size:14px;
}
.utilbar .row {
  display:flex; align-items:center; justify-content:flex-end;
  gap:18px; height:var(--utilbar-h);
}
.utilbar a {
  color:var(--top-text); padding:6px 10px; border-radius:10px;
}
.utilbar a:hover {
  background:rgba(255,255,255,.08);
}

/* ====== Header / Nav (dark unified + blur on scroll) ====== */
header {
  position:sticky; top:0; z-index:50;
  background:
    linear-gradient(180deg, var(--top-grad-1), var(--top-grad-2)),
    var(--top-base);
  border-bottom:1px solid var(--top-border);
  transition:background .2s ease, backdrop-filter .2s ease, box-shadow .2s ease;
  overflow:visible;
}
body.scrolled header {
  background:
    linear-gradient(180deg, rgba(0,212,255,.12), rgba(18,58,103,.18)),
    rgba(14,42,75,.92);
  backdrop-filter:blur(10px) saturate(140%);
  box-shadow:var(--shadow);
}

/* ====== Nav layout ====== */
.nav {
  display:flex; align-items:center; gap:18px;
  height:var(--nav-h); overflow:visible;
}
.brand {
  display:flex; align-items:center; gap:12px; font-weight:700;
  margin-right:auto;
}
.brand .logo {
  width:34px; height:34px; border-radius:10px;
  background:linear-gradient(135deg,var(--brand),#48E1FF);
  display:inline-block; box-shadow:var(--shadow);
}
.brand span { font-size:18px; letter-spacing:.3px; color:#fff; }

/* ====== Menu ====== */
.menu { display:flex; align-items:center; gap:14px; }
.menu > li { list-style:none; position:relative; }
.menu > li > a {
  color:#e6f7ff; border:none; background:transparent;
  padding:10px 12px; border-radius:10px; display:inline-block;
}
.menu > li > a:hover,
.menu > li > a:focus {
  background:rgba(255,255,255,.08); outline:0;
}

/* ====== Dropdowns (dark translucent) ====== */
.has-dd .dd {
  position:absolute; top:100%; left:0; display:none;
  min-width:260px; white-space:nowrap;
  background:rgba(14,42,75,.96);
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.35);
  padding:8px; z-index:1000;
  backdrop-filter:blur(8px) saturate(140%);
}
.has-dd:hover .dd, .has-dd:focus-within .dd { display:block; }
.dd a {
  display:block; padding:10px 14px; border-radius:8px; color:var(--top-text);
  transition:background .15s ease, color .15s ease;
}
.dd a:hover, .dd a:focus {
  background:rgba(255,255,255,.08);
  color:#00D4FF; outline:0;
}
.menu > li:nth-last-child(-n+2) .dd { right:0; left:auto; }

/* ====== Search strip (unified with top block) ====== */
.search-strip {
  position:sticky; top:var(--header-h); z-index:49;
  margin:0; padding:10px 0;
  background:
    linear-gradient(180deg, var(--top-grad-1), var(--top-grad-2)),
    var(--top-base);
  border-top:1px solid var(--top-border);
  border-bottom:1px solid var(--top-border);
  backdrop-filter:blur(8px) saturate(130%);
}
body.scrolled .search-strip {
  background:
    linear-gradient(180deg, rgba(0,212,255,.12), rgba(18,58,103,.18)),
    rgba(14,42,75,.92);
}

/* ====== Search box ====== */
.search {
  display:flex; align-items:center; gap:8px;
  border:1px solid var(--top-card-border);
  border-radius:999px; padding:10px 12px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,.06)),
    linear-gradient(180deg, rgba(0,212,255,.12), transparent 60%),
    var(--top-card);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  transition:background .2s ease, box-shadow .2s ease;
}
.search:hover {
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(0,0,0,.05)),
    linear-gradient(180deg, rgba(0,212,255,.16), transparent 60%),
    var(--top-card-hi);
}
.search:has(input:focus, select:focus) {
  box-shadow:inset 0 0 0 2px rgba(0,212,255,.35);
}

/* Input & placeholder */
.search input {
  border:none; outline:none; width:100%; font-size:14px;
  color:#fff; background:transparent;
}
.search input::placeholder { color:var(--top-placeholder); opacity:.9; }

/* Lang dropdown & select (identic) */
.lang-dd,
.search select {
  border:none; outline:none;
  background:color-mix(in srgb, var(--top-card) 70%, #2a6fb0 30%);
  color:var(--top-text);
  border-radius:999px;
  padding:6px 10px;
  font-size:13px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}
.lang-dd:focus,
.search select:focus {
  box-shadow:inset 0 0 0 2px rgba(0,212,255,.35);
}

/* ====== Search button (cyan) ====== */
.btn-search {
  background:#00D4FF; border-color:#00D4FF; color:#072a1f;
  font-weight:600; padding:10px 18px; border-radius:999px;
  transition:filter .15s ease, transform .15s ease;
}
.btn-search:hover {
  filter:brightness(1.08); transform:translateY(-1px);
}

/* ====== Remove header CTA ====== */
.cta { display:none !important; }

/* ====== General buttons (for content/HERO) ====== */
.btn {
  border:1px solid var(--border);
  padding:10px 14px; border-radius:999px;
  background:#fff; cursor:pointer; font-weight:600;
}
.btn:hover { background:#f4f7fb; }
.btn-primary {
  background:var(--brand2); border-color:transparent; color:#072a1f;
}
.btn-primary:hover { filter:brightness(.95); }

/* ====== Banner (optional) ====== */
.banner {
  background:#0e2a4b; border-bottom:1px solid #0C223F; color:#eaf7ff;
}
.banner .row {
  display:flex; align-items:center; gap:12px;
  justify-content:space-between; padding:10px 0;
}

/* ====== Main + Footer ====== */
main { padding:32px 20px 80px; }
footer { border-top:1px solid var(--border); margin-top:32px; }
.footer-grid {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:24px; padding:28px 20px;
}
.footer-legal {
  border-top:1px solid var(--border);
  font-size:14px; color:#516072;
}
.footer-legal .row {
  display:flex; gap:12px; justify-content:space-between;
  flex-wrap:wrap; padding:14px 20px;
}

/* ====== HERO ====== */
.hero {
  position:relative; overflow:hidden;
  padding:64px 0 80px; color:var(--hero-text);
}
.hero__bg {
  position:absolute; inset:0;
  background:
    radial-gradient(1200px 600px at 20% -10%, rgba(72,225,255,.25), transparent 60%),
    radial-gradient(1000px 500px at 80% 0%, rgba(0,212,255,.18), transparent 55%),
    var(--hero-bg);
  z-index:0; transition:filter .25s ease;
}
body.scrolled .hero__bg { filter:blur(2px) saturate(110%); }
.hero__content { position:relative; z-index:1; text-align:left; }
.hero h1 {
  margin:0 0 10px 0; font-size:clamp(32px,4vw,48px);
  color:var(--hero-text); letter-spacing:.3px;
}
.hero p {
  margin:0 0 22px 0; font-size:clamp(16px,2vw,20px);
  color:var(--hero-text-2); max-width:760px;
}
.hero .btn.btn-primary {
  background:var(--brand2); color:#072a1f;
  padding:12px 22px;
}

/* ====== Responsive ====== */
@media (max-width:980px) {
  .menu { display:none; }
}
