/* Header comun al paginilor secundare: despre-noi, contact, selleri, voluntari, sponsori, cele 4 pagini legale si
   cele 3 pagini de editie (editia-*.html, unde linkurile din dreapta sunt Edition 01/02/03).

   O bara discreta si statica, fara animatie de intrare: wordmark text mic in stanga si, pe ecrane late, linkurile de
   pagina in dreapta - ambele pe aceeasi linie si la aceeasi margine ca butonul fix al meniului global
   (css/site-navigation.css), exact ca pe homepage, unde butonul pluteste in colt. Fara fundal, blur sau bordura:
   titlul mare din hero ramane singurul element dominant. Headerul se deruleaza cu pagina; meniul global ramane
   navigarea permanenta. Pastreaza clasele .logo/.nav-toggle/.main-nav, deci fallback-ul fara JS din main.js
   functioneaza in continuare. */
:root {
  /* Aceeasi margine si aceeasi inaltime ca butonul meniului global (.home-menu-toggle). */
  --page-header-inset: clamp(16px, 2vw, 28px);
  --page-header-row: 56px;
  /* Inaltimea vechiului header: continutul fiecarei pagini incepe exact unde incepea si inainte. */
  --page-header-height: 69px;
}

.site-header.page-header {
  position: relative;
  height: var(--page-header-height);
  background: transparent;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border-bottom: 0;
}

/* Randul e centrat pe verticala cu butonul meniului (acelasi top + aceeasi inaltime de 56px). Poate depasi cei 69px
   ai headerului - nu are fundal, iar zona de sub el nu contine nimic interactiv. */
.site-header.page-header > .container {
  max-width: none;
  min-height: calc(env(safe-area-inset-top, 0px) + var(--page-header-inset) + var(--page-header-row));
  padding: calc(env(safe-area-inset-top, 0px) + var(--page-header-inset))
    calc(env(safe-area-inset-right, 0px) + var(--page-header-inset)) 0
    calc(env(safe-area-inset-left, 0px) + var(--page-header-inset));
  align-items: center;
  pointer-events: none;
}
.site-header.page-header > .container > * { pointer-events: auto; }
/* Spatiu pentru butonul fix al meniului si pentru comutatorul RO / EN de langa el (css/i18n.css), cu acelasi calcul
   ca in css/site-navigation.css. */
.site-navigation-ready .site-header.page-header > .container,
.lang-switch-ready .site-header.page-header > .container {
  padding-right: calc(env(safe-area-inset-right, 0px) + var(--page-header-inset) + var(--page-header-row) + 20px + var(--lang-switch-width, 0px));
}

/* Wordmark: acelasi tratament ca numele din meniul global (.home-menu__brand), deci bara si meniul arata ca un sistem. */
.site-header.page-header .logo {
  display: inline-flex;
  align-items: center;
  gap: 0;
  min-height: 44px;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--color-ink);
  transition: color 160ms ease;
}

@media (min-width: 721px) {
  .site-header.page-header .main-nav ul { gap: clamp(20px, 2.4vw, 36px); }
}

.site-header.page-header .main-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.12em;
  white-space: nowrap;
  color: var(--color-ink-soft);
  transition: color 160ms ease;
}
/* Fara linia animata de sub linkuri: pagina curenta e marcata static, cu un singur punct lime. */
.site-header.page-header .main-nav a::after { content: none; }
.site-header.page-header .main-nav a.active { color: var(--color-ink); }
.site-header.page-header .main-nav a.active::before {
  content: "";
  flex: none;
  width: 5px;
  height: 5px;
  margin-right: 10px;
  border-radius: 50%;
  background: var(--color-accent);
}

/* Hover/focus in lime, la fel ca butonul si linkurile meniului global. */
.site-header.page-header .logo:hover,
.site-header.page-header .logo:focus-visible,
.site-header.page-header .main-nav a:hover,
.site-header.page-header .main-nav a:focus-visible { color: var(--color-accent); }
.site-header.page-header .logo:focus-visible,
.site-header.page-header .main-nav a:focus-visible { outline: 1px solid var(--color-accent); outline-offset: 4px; }

/* Fallback-ul fara JS (vizibil doar daca meniul global nu porneste): acelasi limbaj, fara cutie cu bordura. */
.site-header.page-header .nav-toggle {
  border: 0;
  border-radius: 0;
  padding: 10px 12px;
  line-height: 1;
}

/* Pe latimi medii linkurile ar atinge wordmark-ul. Cand meniul global e activ, el ramane singura navigare (ca pe
   mobil); fara meniul global, linkurile raman vizibile ca fallback. */
@media (max-width: 900px) {
  .site-navigation-ready .site-header.page-header .main-nav { display: none; }
}

/* Sub 360px, css/site-navigation.css urca liniile butonului de meniu in partea de sus (centrul lor e la 16px);
   wordmark-ul le urmeaza, ca sa ramana pe aceeasi linie. */
@media (max-width: 360px) {
  .site-header.page-header > .container {
    min-height: calc(env(safe-area-inset-top, 0px) + 32px);
    padding-top: env(safe-area-inset-top, 0px);
  }
  .site-header.page-header .logo { min-height: 32px; }
}

/* Sponsor: singurul hero cu poza plina. Poza continua sub header (ca pe homepage); textul hero-ului ramane exact
   unde era, pentru ca inaltimea si padding-ul cresc cu aceeasi valoare cu care sectiunea urca. */
.page-header + main > .sponsor-hero {
  margin-top: calc(-1 * var(--page-header-height));
  min-height: calc(92vh + var(--page-header-height));
  padding-top: calc(14vh + var(--page-header-height));
}

@media (max-width: 720px) {
  .page-header + main > .sponsor-hero {
    min-height: calc(86vh + var(--page-header-height));
    padding-top: calc(12vh + var(--page-header-height));
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-header.page-header .logo,
  .site-header.page-header .main-nav a { transition: none; }
}
