/* ════════════════════════════════════════════
   HEADER v2 — OASI OMG
   Scope: .oasi-c-header
   ════════════════════════════════════════════ */

.oasi-c-header *,
.oasi-c-header *::before,
.oasi-c-header *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ── VARIABILI ── */
.oasi-c-header {
  --_topbar-h:   34px;
  --_logo-h:     var(--oasi-logo-h, 150px);
  --_nav-h:      calc(var(--_logo-h) + 16px);
  --_total-h:    calc(var(--_topbar-h) + var(--_nav-h));
  --_ease:       var(--oasi-ease, cubic-bezier(0.25, 0.1, 0.25, 1));
  --_dur:        var(--oasi-dur, 220ms);
  --_container:  var(--oasi-container, 1200px);
  --_font:       var(--oasi-font-body, 'Mulish', sans-serif);
  --_blu:        var(--oasi-blu, #1a3a5c);
  --_text:       var(--oasi-text, #1a1a2e);
  --_cta:        var(--oasi-cta, #c62828);
  --_cta-hover:  #a31f1f;
  --_pill:       var(--oasi-radius-pill, 999px);
}

/* ══ HEADER WRAPPER ══ */
.oasi-c-header .oasi-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
}

/* ══ TOPBAR ══ */
.oasi-c-header .oasi-topbar {
  background: var(--_blu);
  height: var(--_topbar-h);
  display: flex;
  align-items: center;
}
.oasi-c-header .oasi-topbar__wrap {
  max-width: var(--_container);
  width: 100%;
  margin-inline: auto;
  padding-inline: clamp(1rem, 4vw, 2.5rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.oasi-c-header .oasi-topbar__left {
  display: flex;
  align-items: center;
  gap: clamp(0.6rem, 1.5vw, 1.2rem);
}

.oasi-c-header .oasi-topbar__link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--_font);
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255,255,255,0.78);
  text-decoration: none;
  transition: color var(--_dur) var(--_ease);
  white-space: nowrap;
}
.oasi-c-header .oasi-topbar__link svg {
  flex-shrink: 0;
  opacity: 0.7;
}
.oasi-c-header .oasi-topbar__link:hover,
.oasi-c-header .oasi-topbar__link:focus-visible {
  color: #fff;
}
.oasi-c-header .oasi-topbar__link:focus-visible {
  outline: 1px solid rgba(255,255,255,0.5);
  outline-offset: 2px;
  border-radius: 2px;
}

.oasi-c-header .oasi-topbar__divider {
  width: 1px;
  height: 14px;
  background: rgba(255,255,255,0.2);
  flex-shrink: 0;
}

.oasi-c-header .oasi-topbar__5xmille {
  font-family: var(--_font);
  font-size: 0.76rem;
  font-weight: 600;
  color: var(--oasi-sez-educazione, #f5c400);
  text-decoration: none;
  white-space: nowrap;
  transition: opacity var(--_dur);
}
.oasi-c-header .oasi-topbar__5xmille:hover { opacity: 0.78; }
.oasi-c-header .oasi-topbar__5xmille strong {
  color: #fff;
  font-weight: 700;
}

/* ══ NAVBAR ══ */
.oasi-c-header .oasi-nav {
  height: var(--_nav-h);
  background: #fff;
  transition:
    background var(--_dur) var(--_ease),
    box-shadow var(--_dur) var(--_ease);
}
.oasi-c-header .oasi-nav__wrap {
  max-width: var(--_container);
  width: 100%;
  margin-inline: auto;
  padding-inline: clamp(1rem, 4vw, 2.5rem);
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(0.75rem, 2vw, 1.5rem);
}

/* ══ LOGO ══ */
.oasi-c-header .oasi-logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  position: relative;
  text-decoration: none;
  height: 100%;
  padding-block: 8px;
}
.oasi-c-header .oasi-logo__img {
  height: var(--_logo-h);
  width: auto;
  display: block;
  object-fit: contain;
  transition: opacity var(--_dur) var(--_ease);
}
.oasi-c-header .oasi-logo__img--white {
  position: absolute;
  inset: 0;
  height: var(--_logo-h);
  width: auto;
  padding-block: 0;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0;
  pointer-events: none;
}
.oasi-c-header .oasi-logo__img--color {
  opacity: 1;
}

/* ── Stato trasparente ── */
.oasi-c-header .oasi-header--transparent .oasi-topbar { display: none; }
.oasi-c-header .oasi-header--transparent .oasi-nav {
  background: transparent;
  box-shadow: none;
}
.oasi-c-header .oasi-header--transparent .oasi-logo__img--color { opacity: 0; pointer-events: none; }
.oasi-c-header .oasi-header--transparent .oasi-logo__img--white { opacity: 1; pointer-events: auto; }
.oasi-c-header .oasi-header--transparent .oasi-menu__link { color: rgba(255,255,255,0.9); }
.oasi-c-header .oasi-header--transparent .oasi-menu__link:hover { color: #fff; }
.oasi-c-header .oasi-header--transparent .oasi-hamburger__bar { background: #fff; }
.oasi-c-header .oasi-header--transparent .oasi-nav-cta {
  background: transparent;
  border: 1.5px solid rgba(255,255,255,0.6);
  color: #fff;
}
.oasi-c-header .oasi-header--transparent .oasi-nav-cta:hover {
  background: rgba(255,255,255,0.12);
  border-color: #fff;
  transform: translateY(-1px);
  box-shadow: none;
}

/* ── Stato scrolled ── */
.oasi-c-header .oasi-header--scrolled .oasi-nav {
  background: #fff;
  box-shadow: 0 1px 16px rgba(0,0,0,0.08);
}
.oasi-c-header .oasi-header--scrolled .oasi-logo__img--color { opacity: 1; pointer-events: auto; }
.oasi-c-header .oasi-header--scrolled .oasi-logo__img--white { opacity: 0; pointer-events: none; }

/* ══ MENU DESKTOP ══ */
.oasi-c-header .oasi-menu {
  display: flex;
  align-items: center;
  list-style: none;
  margin: 0; padding: 0;
  gap: 0;
  flex: 1;
  justify-content: center;
}

.oasi-c-header .oasi-menu__item {
  position: relative;
}

/* Link / bottone menu */
.oasi-c-header .oasi-menu__link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  height: var(--_nav-h);
  padding-inline: clamp(0.65rem, 1.1vw, 0.9rem);
  font-family: var(--_font);
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--_text);
  text-decoration: none;
  background: none;
  border: none;
  cursor: pointer;
  white-space: nowrap;
  position: relative;
  transition: color var(--_dur) var(--_ease);
  letter-spacing: 0.01em;
}
.oasi-c-header .oasi-menu__link:hover { color: var(--_blu); }
.oasi-c-header .oasi-menu__link:focus-visible {
  outline: 2px solid var(--_blu);
  outline-offset: -4px;
  border-radius: 4px;
}

/* Striscia colorata sotto */
.oasi-c-header .oasi-menu__link::after {
  content: '';
  position: absolute;
  bottom: 0; left: 50%; right: 50%;
  height: 3px;
  border-radius: 3px 3px 0 0;
  transition: left var(--_dur) var(--_ease), right var(--_dur) var(--_ease);
}
.oasi-c-header [data-section="chisiamo"]   .oasi-menu__link::after { background: var(--oasi-sez-chisiamo, #1565c0); }
.oasi-c-header [data-section="opere"]      .oasi-menu__link::after { background: var(--oasi-sez-opere, #2e7d32); }
.oasi-c-header [data-section="educazione"] .oasi-menu__link::after { background: var(--oasi-sez-educazione, #f9a825); }
.oasi-c-header [data-section="sostieni"]   .oasi-menu__link::after { background: var(--oasi-sez-sostieni, #c62828); }

.oasi-c-header .oasi-menu__item:hover .oasi-menu__link::after,
.oasi-c-header .oasi-menu__item--active .oasi-menu__link::after {
  left: 15%; right: 15%;
}

/* Chevron */
.oasi-c-header .oasi-menu__chevron {
  transition: transform var(--_dur) var(--_ease);
  flex-shrink: 0;
  margin-left: 2px;
}
.oasi-c-header .oasi-menu__item--has-sub:hover .oasi-menu__chevron,
.oasi-c-header .oasi-menu__item--has-sub:focus-within .oasi-menu__chevron,
.oasi-c-header .oasi-menu__item--open .oasi-menu__chevron {
  transform: rotate(180deg);
}

/* ══ DROPDOWN ══ */
.oasi-c-header .oasi-dropdown {
  position: absolute;
  top: calc(var(--_nav-h) - 2px);
  left: 50%;
  transform: translateX(-50%) translateY(8px);
  min-width: 260px;
  background: #fff;
  border-radius: var(--oasi-radius-lg, 12px);
  box-shadow:
    0 4px 6px rgba(0,0,0,0.04),
    0 12px 40px rgba(0,0,0,0.12);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity    var(--_dur) var(--_ease),
    transform  var(--_dur) var(--_ease),
    visibility var(--_dur) var(--_ease);
  z-index: 200;
  overflow: hidden;
}
/* Bordo top colorato */
.oasi-c-header .oasi-dropdown::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
}
.oasi-c-header [data-section="chisiamo"]   .oasi-dropdown::before { background: var(--oasi-sez-chisiamo, #1565c0); }
.oasi-c-header [data-section="opere"]      .oasi-dropdown::before { background: var(--oasi-sez-opere, #2e7d32); }
.oasi-c-header [data-section="educazione"] .oasi-dropdown::before { background: var(--oasi-sez-educazione, #f9a825); }
.oasi-c-header [data-section="sostieni"]   .oasi-dropdown::before { background: var(--oasi-sez-sostieni, #c62828); }

.oasi-c-header .oasi-menu__item--has-sub:hover .oasi-dropdown,
.oasi-c-header .oasi-menu__item--has-sub:focus-within .oasi-dropdown,
.oasi-c-header .oasi-menu__item--open .oasi-dropdown {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

.oasi-c-header .oasi-dropdown__inner {
  padding: 0.5rem;
}

.oasi-c-header .oasi-dropdown__link {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  padding: 0.7rem 0.85rem;
  border-radius: var(--oasi-radius-md, 8px);
  text-decoration: none;
  transition: background var(--_dur) var(--_ease);
}
.oasi-c-header .oasi-dropdown__link:hover,
.oasi-c-header .oasi-dropdown__link:focus-visible {
  background: #f5f5f7;
}
.oasi-c-header .oasi-dropdown__link:focus-visible {
  outline: 2px solid var(--_blu);
  outline-offset: -2px;
}
.oasi-c-header .oasi-dropdown__link strong {
  font-family: var(--_font);
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--_text);
  line-height: 1.35;
}
.oasi-c-header .oasi-dropdown__link small {
  font-family: var(--_font);
  font-size: 0.78rem;
  font-weight: 400;
  color: var(--oasi-text-muted, #6b6b80);
  line-height: 1.3;
}

/* ══ CTA DONA ORA ══ */
.oasi-c-header .oasi-nav-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 0.6em 1.35em;
  background: var(--_cta);
  color: #fff;
  font-family: var(--_font);
  font-size: 0.84rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-decoration: none;
  border: 2px solid transparent;
  border-radius: var(--_pill);
  white-space: nowrap;
  transition:
    background   var(--_dur) var(--_ease),
    border-color var(--_dur) var(--_ease),
    transform    var(--_dur) var(--_ease),
    box-shadow   var(--_dur) var(--_ease);
}
.oasi-c-header .oasi-nav-cta:hover {
  background: var(--_cta-hover);
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(198,40,40,0.3);
}
.oasi-c-header .oasi-nav-cta:focus-visible {
  outline: 3px solid var(--_cta);
  outline-offset: 3px;
}

/* ══ HAMBURGER ══ */
.oasi-c-header .oasi-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 42px; height: 42px;
  background: none;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  padding: 8px;
  transition: background var(--_dur);
}
.oasi-c-header .oasi-hamburger:hover { background: rgba(0,0,0,0.04); }
.oasi-c-header .oasi-hamburger:focus-visible {
  outline: 2px solid var(--_blu);
  outline-offset: 2px;
}
.oasi-c-header .oasi-hamburger__bar {
  display: block;
  width: 100%; height: 2px;
  background: var(--_text);
  border-radius: 2px;
  transform-origin: center;
  transition: transform var(--_dur) var(--_ease), opacity var(--_dur);
}
/* X state */
.oasi-c-header .oasi-hamburger[aria-expanded="true"] .oasi-hamburger__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.oasi-c-header .oasi-hamburger[aria-expanded="true"] .oasi-hamburger__bar:nth-child(2) { opacity: 0; transform: scaleX(0); }
.oasi-c-header .oasi-hamburger[aria-expanded="true"] .oasi-hamburger__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.oasi-c-header .oasi-nav__actions {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-shrink: 0;
}

/* ══ MOBILE PANEL ══ */
.oasi-c-header .oasi-mobile {
  position: fixed;
  top: 0; right: 0;
  width: min(380px, 94vw);
  height: 100dvh;
  background: var(--_blu);
  z-index: 1100;
  transform: translateX(100%);
  transition: transform 340ms cubic-bezier(0.32, 0, 0.15, 1);
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.oasi-c-header .oasi-mobile[aria-hidden="false"] { transform: translateX(0); }

.oasi-c-header .oasi-mobile__inner {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: 1.5rem;
}

.oasi-c-header .oasi-mobile__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2.25rem;
}
.oasi-c-header .oasi-mobile__head img { height: 44px; width: auto; }

.oasi-c-header .oasi-mobile__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px; height: 42px;
  background: rgba(255,255,255,0.08);
  border: none;
  border-radius: 8px;
  cursor: pointer;
  color: #fff;
  transition: background var(--_dur);
}
.oasi-c-header .oasi-mobile__close:hover { background: rgba(255,255,255,0.15); }
.oasi-c-header .oasi-mobile__close:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

/* Accordion section */
.oasi-c-header .oasi-mobile__nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
}

.oasi-c-header .oasi-mobile__section {
  border-left: 3px solid transparent;
  padding-left: 0.75rem;
}
.oasi-c-header .oasi-mobile__section[data-color="chisiamo"]   { border-color: var(--oasi-sez-chisiamo, #1565c0); }
.oasi-c-header .oasi-mobile__section[data-color="opere"]      { border-color: var(--oasi-sez-opere, #2e7d32); }
.oasi-c-header .oasi-mobile__section[data-color="educazione"] { border-color: var(--oasi-sez-educazione, #f9a825); }
.oasi-c-header .oasi-mobile__section[data-color="sostieni"]   { border-color: var(--oasi-sez-sostieni, #c62828); }

.oasi-c-header .oasi-mobile__toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0.85rem 0.6rem;
  background: none;
  border: none;
  border-radius: 6px;
  color: #fff;
  font-family: var(--_font);
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  text-align: left;
  transition: background var(--_dur);
}
.oasi-c-header .oasi-mobile__toggle:hover,
.oasi-c-header .oasi-mobile__toggle[aria-expanded="true"] { background: rgba(255,255,255,0.06); }
.oasi-c-header .oasi-mobile__toggle:focus-visible { outline: 2px solid rgba(255,255,255,0.5); outline-offset: 1px; }
.oasi-c-header .oasi-mobile__toggle svg {
  transition: transform var(--_dur);
  flex-shrink: 0;
}
.oasi-c-header .oasi-mobile__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }

.oasi-c-header .oasi-mobile__sub {
  list-style: none;
  margin: 0;
  padding: 0.15rem 0 0.65rem 0.75rem;
}
.oasi-c-header .oasi-mobile__sub a {
  display: block;
  padding: 0.55rem 0.5rem;
  color: rgba(255,255,255,0.78);
  font-family: var(--_font);
  font-size: 0.94rem;
  text-decoration: none;
  border-radius: 4px;
  transition: color var(--_dur), background var(--_dur);
}
.oasi-c-header .oasi-mobile__sub a:hover { color: #fff; background: rgba(255,255,255,0.05); }
.oasi-c-header .oasi-mobile__sub a:focus-visible { outline: 1px solid rgba(255,255,255,0.4); outline-offset: 1px; }

/* Link singolo mobile */
.oasi-c-header .oasi-mobile__single {
  display: block;
  padding: 0.85rem 0.6rem;
  margin-left: calc(3px + 0.75rem);
  color: #fff;
  font-family: var(--_font);
  font-size: 1rem;
  font-weight: 700;
  text-decoration: none;
  border-radius: 6px;
  transition: background var(--_dur);
}
.oasi-c-header .oasi-mobile__single:hover { background: rgba(255,255,255,0.06); }

/* Footer mobile */
.oasi-c-header .oasi-mobile__foot {
  margin-top: auto;
  padding-top: 2rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  align-items: center;
}
.oasi-c-header .oasi-mobile__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 0.9em 1.5em;
  background: var(--_cta);
  color: #fff;
  font-family: var(--_font);
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: var(--_pill);
  transition: background var(--_dur), transform var(--_dur);
}
.oasi-c-header .oasi-mobile__cta:hover { background: var(--_cta-hover); transform: translateY(-1px); }
.oasi-c-header .oasi-mobile__cf {
  font-family: var(--_font);
  font-size: 0.8rem;
  color: rgba(255,255,255,0.55);
  text-align: center;
}
.oasi-c-header .oasi-mobile__cf strong { color: rgba(255,255,255,0.85); }

/* Overlay */
.oasi-c-header .oasi-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 1050;
  opacity: 0;
  pointer-events: none;
  transition: opacity 300ms ease;
}
.oasi-c-header .oasi-overlay--active { opacity: 1; pointer-events: auto; }

/* ══ RESPONSIVE ══ */
@media (max-width: 960px) {
  .oasi-c-header .oasi-menu { display: none; }
  .oasi-c-header .oasi-hamburger { display: flex; }
  .oasi-c-header .oasi-topbar { display: none; }
  .oasi-c-header { --_logo-h: 64px; --_nav-h: 86px; --_total-h: 86px; }
  .oasi-c-header .oasi-logo__img { height: var(--_logo-h); }
  .oasi-c-header .oasi-logo__img--white { height: var(--_logo-h); }
  .oasi-c-header .oasi-nav-cta { font-size: 0.78rem; padding: 0.5em 1em; }
}

/* ══ REDUCED MOTION ══ */
@media (prefers-reduced-motion: reduce) {
  .oasi-c-header .oasi-dropdown,
  .oasi-c-header .oasi-menu__link::after,
  .oasi-c-header .oasi-menu__chevron,
  .oasi-c-header .oasi-mobile,
  .oasi-c-header .oasi-overlay,
  .oasi-c-header .oasi-hamburger__bar,
  .oasi-c-header .oasi-nav,
  .oasi-c-header .oasi-nav-cta,
  .oasi-c-header .oasi-mobile__toggle svg { transition: none !important; }
}

/* ══ RIGA MOBILE: link hub + chevron toggle ══ */
.oasi-c-header .oasi-mobile__row {
  display: flex;
  align-items: stretch;
  gap: 0.25rem;
}
.oasi-c-header .oasi-mobile__link {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  padding: 0.85rem 0.6rem;
  color: #fff;
  font-family: var(--_font);
  font-size: 1rem;
  font-weight: 700;
  text-decoration: none;
  border-radius: 6px;
  transition: background var(--_dur);
}
.oasi-c-header .oasi-mobile__link:hover { background: rgba(255,255,255,0.06); }
.oasi-c-header .oasi-mobile__link:focus-visible { outline: 2px solid rgba(255,255,255,0.5); outline-offset: 1px; }
.oasi-c-header .oasi-mobile__row .oasi-mobile__toggle {
  width: auto;
  flex: 0 0 auto;
  justify-content: center;
  padding: 0.85rem 0.9rem;
}

/* ──────────────────────────────────────────────
   SKIP LINK (accessibilità) — primo elemento focalizzabile.
   Visibile solo quando riceve focus da tastiera.
─────────────────────────────────────────────── */
.oasi-c-header .oasi-skip{
  position:fixed; top:.5rem; left:.5rem; z-index:2000;
  background:var(--oasi-cta,#c62828); color:#fff;
  padding:.65rem 1.1rem; border-radius:var(--oasi-radius-md,10px);
  font-family:var(--oasi-font-body,system-ui,sans-serif);
  font-weight:700; font-size:.95rem; line-height:1; text-decoration:none;
  transform:translateY(-200%); transition:transform .15s ease;
}
.oasi-c-header .oasi-skip:focus{
  transform:translateY(0); outline:3px solid #fff; outline-offset:2px;
}
