/* vv-szerzo — szerző-sáv (byline), illesztve a page-hero alá.
   Szín- és betűvilág a wp-content/uploads/vv-teszt/teszt.css élő mintájából átvéve
   (mérve 2026-09-04: --zold #4BAC9B, --ink #0E211F, --ink-2 #3E5A56, --ink-3 #6E8783,
   --line #D3E2DE, --surface #FFFFFF, --ground #F4F8F7, Mulish + Comfortaa).
   Önálló változó-készlet, mert ez a blokk a page-hero ALATT, a .vv-teszt keretén KÍVÜL él —
   nem támaszkodik a .vv-teszt-en belüli --token örökítésre.

   SZÁNDÉKOSAN VILÁGOS-CSAK — MÉRT DÖNTÉS, NE "JAVÍTSD MEG" ÚJRA (2026-09-04, PM-mérés):
   a teszt.css-ben VAN egy prefers-color-scheme:dark + [data-theme="dark"] sötét ág, DE az
   élő /szemelyisegteszt/ lapon ez HATÁSTALAN: a :root szintű --ground token ténylegesen
   sötétre vált media query alatt (`emulateMediaFeatures` móddal mérve), de a .vv-teszt doboz
   NEM fogyasztja ezt a :root tokent, saját, mindig világos értéket használ — a képernyőkép is
   teljesen világos maradt sötét preferencia mellett. A WP-téma (page-hero, fejléc, lábléc)
   emellett EGYÁLTALÁN NEM támogat sötét módot (0 találat prefers-color-scheme/data-theme a
   téma style.css-ében). Egy korábbi kör ezért tévesen épített sötét ágat ide: az a byline-t
   tette volna az EGYETLEN sötét elemmé egy egyébként világos lapon — rosszabb, mint a
   kiindulás. A sötét ág emiatt itt NINCS, és NE kerüljön vissza, amíg a .vv-teszt maga nem
   kezdi ténylegesen fogyasztani a :root sötét tokeneket az élő oldalon. (A levont sötét
   render-ek és a mérés dokumentálva: render/render-ellenorzes.md.) */

.vv-szerzo {
  --vvsz-ground: #F4F8F7;
  --vvsz-ink: #0E211F;
  --vvsz-ink-2: #3E5A56;
  --vvsz-ink-3: #6E8783;
  --vvsz-line: #D3E2DE;
  --vvsz-zold: #4BAC9B;
  --vvsz-focus: #1B7F6E;

  max-width: 760px;
  margin: 0 auto 28px;
  padding: 0 20px;
}

.vv-szerzo__link {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  border: 1px solid var(--vvsz-line);
  border-radius: 14px;
  background: var(--vvsz-ground);
  text-decoration: none;
  transition: border-color .15s, transform .15s;
}

.vv-szerzo__link:hover {
  border-color: var(--vvsz-zold);
  transform: translateY(-1px);
}

.vv-szerzo__link:focus-visible {
  outline: 3px solid var(--vvsz-focus);
  outline-offset: 3px;
  border-radius: 14px;
}

.vv-szerzo__kep {
  width: 60px;
  height: 60px;
  min-width: 60px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #FFFFFF;
  box-shadow: 0 1px 2px rgba(14, 33, 31, .12);
}

.vv-szerzo__szoveg {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-family: 'Mulish', ui-sans-serif, system-ui, -apple-system, sans-serif;
  line-height: 1.35;
}

.vv-szerzo__eyebrow {
  font-size: 11.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  /* a --vvsz-zold (#4BAC9B) 2,56:1 kontraszttal bukna a --vvsz-ground hátteren
     (mérve 2026-09-04, WCAG AA normál szöveghez 4,5:1 kell) — a site-mintában
     ugyanez a kombináció fordul elő, de itt a sötétebb --vvsz-focus tónust
     használjuk (4,55:1), hogy az eyebrow-címke önmagában is olvasható legyen
     (ld. render/render-ellenorzes.md). */
  color: var(--vvsz-focus);
  font-weight: 600;
}

.vv-szerzo__nev {
  font-family: 'Comfortaa', ui-sans-serif, system-ui, sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: var(--vvsz-ink);
}

.vv-szerzo__titulus {
  font-size: 13.5px;
  color: var(--vvsz-ink-2);
}

@media (max-width: 520px) {
  .vv-szerzo__link {
    padding: 10px 14px;
    gap: 12px;
  }
  .vv-szerzo__kep {
    width: 52px;
    height: 52px;
    min-width: 52px;
  }
  .vv-szerzo__titulus {
    font-size: 13px;
  }
}

/* ── .vv-frissitve — látható frissítés-dátum (SZABVANY §4). Hozzáadva 2026-09-06, a
   datum-byline-appstore csomagban. A sáv-szélesség a byline-éval egyezik, hogy a
   H1 alatti meta-sor és a szerző-doboz egy vonalban álljon. ── */
.vv-frissitve {
  max-width: 760px;
  margin: 0 auto 8px;
  padding: 0 20px;
  font-family: 'Mulish', ui-sans-serif, system-ui, -apple-system, sans-serif;
  font-size: 13.5px;
  color: #3E5A56;
}