/**
 * Lengvos header versijos stiliai — žr. header-lite.php.
 * Sąmoningai atskirtas failas nuo styles/sections/header.css, kad nesusidurtų
 * su pilno header'io dropdown/nav taisyklėmis (skirtingi klasių vardai).
 */

.header-lite {
  width: 100%;
  padding: clamp(0.75rem, 2vw, 1.1rem) clamp(1rem, 4vw, 2rem);
  background: var(--color-bg-secondary, #1a1a2e);
  border-bottom: 1px solid var(--color-border-subtle, #252538);
}

/* Nuo 2026-09-02 antraštėje liko tik logotipas (žr. header-lite.php), tad
   `space-between` nebeturi ko skirstyti — `flex-start` aiškiau pasako ketinimą. */
.header-lite__inner {
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 1rem;
}

.header-lite__brand {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  text-decoration: none;
  color: var(--color-text-primary, #f5f5fa);
  font-weight: 600;
  font-size: clamp(0.95rem, 2.5vw, 1.1rem);
}

.header-lite__logo {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
}

@media (max-width: 480px) {
  .header-lite__name {
    display: none;
  }
}

/* =====================================================
   PRALEISTI ANTRAŠTĘ (WCAG 2.4.1, lygis A)
   =====================================================
   Nuoroda gyvena DOM'e visą laiką ir yra pirmas fokusuojamas elementas, bet
   matoma tampa tik gavusi fokusą. Slepiama nukeliant virš ekrano, o ne
   `display: none` — paslėptas per display elementas iškrinta iš tabuliavimo
   tvarkos, ir nuoroda taptų nepasiekiama būtent tiems, kam skirta. */
.skip-link {
	position: absolute;
	top: 0;
	left: var(--spacing-sm, 0.5rem);
	z-index: var(--z-maximum, 10000);
	transform: translateY(-150%);
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 var(--spacing-md, 1rem);
	background: var(--color-accent-gold, #e7ca93);
	border-radius: 0 0 var(--radius-md, 0.5rem) var(--radius-md, 0.5rem);
	/* Tamsus tekstas ant aukso — ta pati AA pora kaip pirminiuose mygtukuose. */
	color: #17151f;
	font-weight: var(--font-weight-semibold, 600);
	font-size: var(--font-size-sm, 0.875rem);
	text-decoration: none;
	transition: transform var(--duration-fast, 150ms) var(--ease-default, ease-out);
}

.skip-link:focus,
.skip-link:focus-visible {
	transform: translateY(0);
	outline: 2px solid var(--color-text-primary, #f5f5fa);
	outline-offset: 2px;
}

/* <main tabindex="-1"> gauna fokusą programiškai — kontūras ten nieko
   nepasako, tad neblaškome. */
main[tabindex='-1']:focus {
	outline: none;
}

@media (prefers-reduced-motion: reduce) {
	.skip-link {
		transition: none;
	}
}