/* ===== IGDA Moldova — header, footer & section styles ===== */

/* ---------- Header ---------- */
.site-header{ position:sticky; top:0; z-index:50; background:color-mix(in srgb, var(--surface) 80%, transparent);
  backdrop-filter:saturate(1.6) blur(14px); border-bottom:1px solid transparent; transition:.25s var(--ease); }
.site-header.scrolled{ border-bottom-color:var(--line); box-shadow:0 6px 24px -16px rgba(34,24,80,.4); }
.header-inner{ height:var(--header-h); display:flex; align-items:center; justify-content:space-between; gap:18px; }
.logo{ flex:none; }

.main-nav{ display:flex; align-items:center; gap:4px; }
.nav-link{ font-size:14.5px; font-weight:600; color:var(--ink-2); padding:8px 13px; border-radius:var(--radius-pill);
  position:relative; white-space:nowrap; transition:.18s var(--ease); }
.nav-link:hover{ color:var(--primary); background:var(--primary-50); }
.nav-link.active{ color:var(--primary); }
.nav-link.active::after{ content:''; position:absolute; left:13px; right:13px; bottom:1px; height:2px; border-radius:2px; background:var(--primary); }

.header-actions{ display:flex; align-items:center; gap:10px; }
.icon-btn{ width:40px; height:40px; border-radius:12px; display:grid; place-items:center; color:var(--ink-2); transition:.18s var(--ease); }
.icon-btn:hover{ background:var(--primary-50); color:var(--primary); }
.burger{ display:none; }

.lang-switch{ position:relative; }
.lang-btn{ display:flex; align-items:center; gap:5px; font-size:13.5px; font-weight:700; color:var(--ink-2);
  padding:8px 12px; border-radius:var(--radius-pill); border:1px solid var(--line-2); background:var(--surface); transition:.18s var(--ease); }
.lang-btn:hover{ border-color:var(--primary); color:var(--primary); }
.lang-menu{ position:absolute; right:0; top:calc(100% + 8px); background:var(--surface); border:1px solid var(--line);
  border-radius:14px; box-shadow:var(--shadow-lg); padding:6px; min-width:190px; z-index:60; }
/* invisible bridge over the 8px gap — without it the wrapper's mouseleave closes the menu
   before the pointer can travel from the button down to the options */
.lang-menu::before{ content:''; position:absolute; left:0; right:0; top:-9px; height:9px; }
.lang-menu button{ display:block; width:100%; text-align:left; padding:9px 12px; border-radius:9px; font-size:14px; font-weight:600; color:var(--ink-2); }
.lang-menu button:hover{ background:var(--surface-2); }
.lang-menu button.active{ background:var(--primary-50); color:var(--primary-700); }
.submit-btn{ padding:11px 20px; }

.mobile-menu{ display:none; flex-direction:column; padding:12px 24px 18px; gap:2px; border-top:1px solid var(--line); background:var(--surface); }
.mobile-menu a{ padding:12px 10px; border-radius:10px; font-weight:600; color:var(--ink-2); }
.mobile-menu a.active, .mobile-menu a:hover{ background:var(--primary-50); color:var(--primary); }

/* ---------- generic section head ---------- */
.section-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:30px; flex-wrap:wrap; }
.section-head.center{ flex-direction:column; align-items:center; text-align:center; }
.section-title{ font-size:clamp(28px,3.4vw,38px); font-weight:700; }
.view-all{ display:inline-flex; align-items:center; gap:6px; font-size:14px; font-weight:600; color:var(--primary); white-space:nowrap; }
.view-all:hover{ gap:9px; }

/* ---------- pagination ---------- */
.pagination{ display:flex; align-items:center; justify-content:center; gap:8px; margin-top:36px; }
.pg{ min-width:40px; height:40px; padding:0 12px; border-radius:11px; border:1px solid var(--line-2); background:var(--surface);
  font-weight:600; font-size:14px; color:var(--ink-2); display:inline-flex; align-items:center; gap:6px; justify-content:center; transition:.16s var(--ease); }
.pg:hover{ border-color:var(--primary); color:var(--primary); }
.pg.active{ background:var(--primary); color:#fff; border-color:var(--primary); }
.pg-dots{ color:var(--faint); padding:0 2px; }
.pg-next{ font-weight:600; }

/* ---------- filter bar ---------- */
.filter-bar{ display:flex; gap:12px; align-items:center; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius); padding:14px; box-shadow:var(--shadow-sm); flex-wrap:wrap; }
.filter-bar .input-wrap{ flex:1; min-width:200px; }
.filter-bar .select{ min-width:158px; flex:none; }
.filter-bar .btn{ flex:none; }
@media (max-width:780px){ .filter-bar .select{ flex:1; min-width:140px; } }

/* ---------- page hero strip (light, with skyline) ---------- */
.page-hero{ position:relative; overflow:hidden; border-bottom:1px solid var(--line);
  background:linear-gradient(180deg, var(--primary-tint), transparent); }
.page-hero .container{ position:relative; z-index:2; padding-block:46px 40px; }
.breadcrumb{ display:flex; gap:8px; align-items:center; font-size:13.5px; color:var(--muted); margin-bottom:14px; }
.breadcrumb a:hover{ color:var(--primary); }
.breadcrumb .sep{ color:var(--faint); }
.page-hero h1{ font-size:clamp(34px,5vw,54px); font-weight:700; }
.page-hero .lede{ margin-top:12px; }
.hero-skyline{ position:absolute; right:0; bottom:-2px; width:min(56%,640px); height:100%; z-index:1; pointer-events:none; }
@media (max-width:900px){ .hero-skyline{ opacity:.4; width:70%; } }

/* ---------- footer ---------- */
.site-footer{ margin-top:auto; background:linear-gradient(180deg,var(--footer-bg),var(--footer-bg-2)); color:var(--footer-ink); }
.site-footer .container{ padding-block:56px 28px; }
.footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr 1.5fr; gap:40px; }
.footer-brand .footer-tagline{ margin-top:16px; font-size:14px; color:var(--footer-faint); max-width:30ch; line-height:1.6; }
.footer-social{ display:flex; gap:10px; margin-top:18px; }
.footer-social a{ width:38px; height:38px; border-radius:10px; display:grid; place-items:center; color:var(--footer-ink);
  background:rgba(255,255,255,.06); transition:.18s var(--ease); }
.footer-social a:hover{ background:var(--primary); color:#fff; transform:translateY(-2px); }
.footer-col h5{ font-family:'Plus Jakarta Sans',sans-serif; font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#fff; margin-bottom:16px; }
.footer-col a{ display:block; font-size:14px; color:var(--footer-faint); padding:6px 0; transition:.15s var(--ease); }
.footer-col a:hover{ color:#fff; }
.footer-news p{ font-size:14px; color:var(--footer-faint); margin-bottom:14px; line-height:1.6; }
.news-form{ display:flex; gap:8px; }
.news-form .input{ background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.12); color:#fff; }
.news-form .input::placeholder{ color:var(--footer-faint); }
.news-form .btn{ flex:none; }
.news-done{ color:#9fe8c4; font-weight:600; font-size:14px; }
.footer-bottom{ display:flex; justify-content:space-between; align-items:center; gap:18px; flex-wrap:wrap;
  margin-top:40px; padding-top:22px; border-top:1px solid rgba(255,255,255,.08); font-size:13px; color:var(--footer-faint); }
.footer-legal{ display:flex; gap:22px; flex-wrap:wrap; }
.footer-legal a:hover{ color:#fff; }

@media (max-width:980px){
  .footer-grid{ grid-template-columns:1fr 1fr; gap:32px; }
  .footer-brand{ grid-column:1/-1; }
  .footer-news{ grid-column:1/-1; }
}

/* ---------- responsive header ---------- */
@media (max-width:1240px){
  .main-nav{ display:none; }
  .burger{ display:grid; }
  .mobile-menu{ display:flex; }
  .submit-btn span, .submit-btn{ }
}
@media (max-width:560px){
  .submit-btn{ display:none; }
  .container{ padding-inline:18px; }
}

/* premium polish: frosted-glass header once scrolled */
.site-header.scrolled{ background:color-mix(in srgb, var(--surface) 68%, transparent);
  -webkit-backdrop-filter:blur(14px) saturate(1.5); backdrop-filter:blur(14px) saturate(1.5); }
