/* Vezetők Imája · vezetokimaja.ro
   Koncepció: esti szoba, meleg papírfény. A kártyák tárgyként fekszenek egy papírszínű
   asztalon, a szöveg petróleum-tinta, az arany csak ott van, ahol fény van.
   Forrás: docs/design-system.md; a kártyák rendszere a vault kartya/DESIGN.md-jében.
   Egyedi site, nem használja a factory default témáját. */

@font-face { font-family: 'Alegreya'; font-style: italic; font-weight: 400 800; font-display: swap; src: url('/fonts/alegreya-italic-400-800-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Alegreya'; font-style: italic; font-weight: 400 800; font-display: swap; src: url('/fonts/alegreya-italic-400-800-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Alegreya'; font-style: normal; font-weight: 400 800; font-display: swap; src: url('/fonts/alegreya-normal-400-800-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Alegreya'; font-style: normal; font-weight: 400 800; font-display: swap; src: url('/fonts/alegreya-normal-400-800-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Alegreya Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url('/fonts/alegreya-sans-normal-500-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Alegreya Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url('/fonts/alegreya-sans-normal-500-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Alegreya Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/alegreya-sans-normal-700-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Alegreya Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/alegreya-sans-normal-700-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --paper: oklch(99% 0.004 85);          /* #fcfbf8, tört fehér */
  --paper-deep: oklch(96.5% 0.008 85);   /* #f5f2ec */
  --rule: oklch(90% 0.012 80);           /* #e6e0d6 */
  --ink: oklch(32% 0.035 220);           /* #1f3a44 */
  --ink-soft: oklch(47% 0.025 220);      /* #4d6168 */
  --night: oklch(22% 0.025 210);         /* #152327 */
  --ivory: oklch(94% 0.025 85);          /* #efe6d2 */
  --gold: oklch(74% 0.13 75);            /* #d9a54d */
  --gold-ink: oklch(52% 0.105 68);       /* #94661c, AA világos alapon */

  --font: 'Alegreya', Georgia, serif;            /* 2026-10-05: a főoldal (A3.1) betűcsaládja az egész site-on */
  --sans: 'Alegreya Sans', ui-sans-serif, system-ui, sans-serif;
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px; --s8: 72px; --s9: 112px;
  --measure: 62ch;
  --wrap: min(1160px, 100% - 2 * var(--s5));
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --shadow-card: 0 1px 1px oklch(30% .03 60 / .10), 0 6px 14px oklch(30% .03 60 / .12), 0 22px 40px -12px oklch(30% .03 60 / .22);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background-color: var(--paper); color: var(--ink);
  font: 400 1.125rem/1.6 var(--font);
  /* 2026-10-04: fehér, szellős; a papírszemcse kikerült */
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3 { line-height: 1.12; letter-spacing: -.012em; margin: 0; font-weight: 700; text-wrap: balance; }
p { margin: 0; }

.skip { position: absolute; left: -999px; top: var(--s3); background: var(--ink); color: var(--paper); padding: var(--s2) var(--s4); border-radius: 4px; z-index: 10; }
.skip:focus { left: var(--s3); }
:focus-visible { outline: 2px solid var(--gold-ink); outline-offset: 3px; border-radius: 3px; }

.eyebrow { font-size: .8125rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-ink); }
.muted { color: var(--ink-soft); }
.link { color: var(--ink); font-weight: 600; text-decoration: underline; text-decoration-color: var(--gold); text-decoration-thickness: 2px; text-underline-offset: .28em; }
.link:hover { text-decoration-color: var(--ink); }
.btn {
  display: inline-block; padding: .78em 1.25em; border-radius: 999px; background: var(--ink); color: var(--paper);
  font-weight: 600; text-decoration: none; transition: background-color .2s var(--ease-out);
}
.btn:hover { background: var(--night); }

/* ---------- fejléc ---------- */
.site-header {
  width: var(--wrap); margin: 0 auto; padding: var(--s5) 0 var(--s4);
  display: flex; align-items: center; justify-content: space-between; gap: var(--s5);
}
.brand { display: inline-flex; align-items: center; gap: var(--s3); text-decoration: none; }
.brand__logo { width: 44px; }
.brand__word { width: clamp(112px, 34vw, 168px); }
.brand { min-width: 0; flex-shrink: 1; }
.site-nav { display: flex; gap: var(--s4); font-weight: 600; font-size: .9375rem; flex-shrink: 0; }
.site-nav a { text-decoration: none; padding: var(--s2) 0; border-bottom: 2px solid transparent; }
.site-nav a:hover { border-bottom-color: var(--gold); }

/* ---------- kártya-tárgy ---------- */
.card { position: relative; perspective: 1600px; }
.card__btn { all: unset; display: block; width: 100%; cursor: pointer; border-radius: 6px; }
.card__btn:focus-visible { outline: 2px solid var(--gold-ink); outline-offset: 6px; }
.card__inner {
  position: relative; display: block; aspect-ratio: 148 / 105; transform-style: preserve-3d;
  transition: transform .75s var(--ease-out);
}
.card__face, .card__single {
  width: 100%; aspect-ratio: 148 / 105; object-fit: cover; border-radius: 4px; box-shadow: var(--shadow-card); background: var(--paper-deep);
}
.card__face { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.card__back { transform: rotateY(180deg); }
.card.is-flipped .card__inner { transform: rotateY(180deg); }
.card__hint { margin-top: var(--s3); font-size: .8125rem; color: var(--ink-soft); text-align: center; }
.card--tilt .card__btn { rotate: -1.6deg; }
.js .card--settle { opacity: 0; translate: 0 10px; }
.js .card--settle.is-in { opacity: 1; translate: 0 0; transition: opacity .6s var(--ease-out), translate .8s var(--ease-out); }

/* ---------- bemutató oldal (landing): szellős, fehér, átlátható ---------- */
.landing { width: var(--wrap); margin: 0 auto; }
.landing > section { padding: var(--s8) 0; border-top: 1px solid var(--rule); display: grid; gap: var(--s5); }
.landing > section:first-child { border-top: 0; }
.l-label { font-size: .8125rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-ink); }
.l-hero { padding: var(--s8) 0 var(--s9) !important; }
.l-hero__logo { width: 72px; margin-bottom: var(--s5); }
.l-hero__title { font-size: clamp(2.4rem, 1.4rem + 4.4vw, 4.6rem); max-width: 17ch; margin-top: var(--s3); }
.l-hero__lede { max-width: 52ch; font-size: clamp(1.125rem, 1rem + .4vw, 1.3rem); line-height: 1.55; color: var(--ink-soft); margin-top: var(--s4); }
.l-why__body { display: grid; gap: var(--s4); max-width: 60ch; }
.l-why__lead { font-size: clamp(1.3rem, 1.05rem + 1vw, 1.75rem); line-height: 1.38; font-weight: 500; }
.l-why__body p:not(.l-why__lead) { color: var(--ink-soft); }
.l-quote { margin: var(--s5) 0 0; padding: var(--s5) 0 0; border-top: 1px solid var(--rule); font-size: 1.25rem; line-height: 1.45; max-width: 40ch; }
.l-quote cite { display: block; margin-top: var(--s2); font-style: normal; font-weight: 600; font-size: .9375rem; letter-spacing: .06em; color: var(--gold-ink); }
.l-pillars__list, .l-values__list { margin: 0; display: grid; gap: var(--s5) var(--s7); }
.l-pillars__list dt { font-size: 1.5rem; font-weight: 700; }
.l-pillars__list dd, .l-values__list dd { margin: var(--s2) 0 0; color: var(--ink-soft); max-width: 34ch; }
.l-values__list dt { font-weight: 700; font-size: 1.0625rem; }
.l-values__note { margin-top: var(--s4); color: var(--ink-soft); max-width: 60ch; }
.l-steps { list-style: none; margin: 0; padding: 0; counter-reset: s; display: grid; gap: var(--s4); max-width: 62ch; }
.l-steps li { counter-increment: s; display: grid; grid-template-columns: 2.6rem 1fr; gap: var(--s3); color: var(--ink-soft); }
.l-steps li::before { content: counter(s); font-weight: 700; color: var(--gold-ink); font-variant-numeric: tabular-nums; }
.l-steps strong { color: var(--ink); font-weight: 700; }
.l-next { align-items: center; padding-bottom: var(--s9) !important; }
.next__title { font-size: clamp(1.5rem, 1.15rem + 1.4vw, 2.2rem); font-weight: 700; line-height: 1.15; text-wrap: balance; }
.next__title .nr { color: var(--gold-ink); }
.next__meta { color: var(--ink-soft); font-weight: 600; }
.next__verse { font-size: 1.125rem; line-height: 1.5; max-width: 46ch; }
.next__verse span { white-space: nowrap; font-weight: 600; color: var(--gold-ink); letter-spacing: .04em; }
.l-next__links { display: flex; flex-wrap: wrap; gap: var(--s5); align-items: center; margin-top: var(--s3); }
.next__card img { border-radius: 4px; box-shadow: var(--shadow-card); max-width: 460px; width: 100%; }
.next__card { justify-self: start; }

/* ---------- főoldal (régi) ---------- */
.hero {
  width: var(--wrap); margin: 0 auto; padding: var(--s7) 0 var(--s9);
  display: grid; gap: var(--s7); align-items: center;
}
.hero__title { font-size: clamp(2.2rem, 1.4rem + 3.6vw, 3.9rem); margin-top: var(--s4); max-width: 14ch; }
.hero__lede { margin-top: var(--s5); max-width: 46ch; font-size: 1.125rem; color: var(--ink-soft); }
.hero__actions { margin-top: var(--s6); display: flex; flex-wrap: wrap; align-items: center; gap: var(--s5); }
.hero__card { max-width: 620px; justify-self: center; width: 100%; }

.latest { width: var(--wrap); max-width: 760px; margin: 0 auto var(--s9); padding-top: var(--s6); border-top: 1px solid var(--rule); }
.latest h2 { margin-top: var(--s3); font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.3rem); }
.latest .nr { color: var(--gold-ink); }
.latest__meta { margin-top: var(--s3); color: var(--ink-soft); font-weight: 600; }
.latest__verse { margin: var(--s5) 0; padding: 0; font-size: 1.25rem; line-height: 1.5; max-width: 48ch; }
.latest__verse cite { display: block; margin-top: var(--s2); font-style: normal; font-weight: 600; font-size: .9375rem; letter-spacing: .06em; color: var(--gold-ink); }
.latest .link { display: inline-block; margin-top: var(--s2); }

/* inverzió: a csend sávja */
.about { background: var(--night); color: var(--ivory); padding: var(--s9) 0; }
.about__inner { width: var(--wrap); margin: 0 auto; display: grid; gap: var(--s5); }
.about h2 { font-size: .8125rem; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); font-weight: 600; }
.about__vision { font-size: clamp(1.45rem, 1.1rem + 1.5vw, 2.25rem); line-height: 1.32; max-width: 30ch; font-weight: 500; }
.about__ref { color: var(--gold); font-weight: 600; letter-spacing: .06em; font-size: .9375rem; }
.about__pillars { margin: var(--s6) 0 0; display: grid; gap: var(--s5); }
.about__pillars div { border-top: 1px solid oklch(94% .025 85 / .18); padding-top: var(--s4); }
.about__pillars dt { font-weight: 700; font-size: 1.125rem; color: var(--ivory); }
.about__pillars dd { margin: var(--s2) 0 0; color: oklch(86% .02 85); max-width: 36ch; }
.about__note { margin-top: var(--s5); color: oklch(80% .02 85); max-width: var(--measure); }

.recent { width: var(--wrap); margin: 0 auto; padding: var(--s8) 0 var(--s9); }
.section-head { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s4); flex-wrap: wrap; margin-bottom: var(--s5); }
.section-head h2 { font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem); }

/* ---------- regiszter ---------- */
.reg { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.reg__row { border-bottom: 1px solid var(--rule); }
.reg__link {
  display: grid; grid-template-columns: 3.2rem 1fr; gap: var(--s1) var(--s4);
  padding: var(--s4) var(--s2); text-decoration: none; border-radius: 4px;
  transition: background-color .2s var(--ease-out);
}
.reg__link:hover { background: var(--paper-deep); }
.reg__nr { font-weight: 700; color: var(--gold-ink); grid-row: span 3; font-variant-numeric: tabular-nums; }
.reg__date { font-size: .875rem; color: var(--ink-soft); font-weight: 600; font-variant-numeric: tabular-nums; }
.reg__main { display: flex; flex-direction: column; gap: 2px; }
.reg__tema { font-weight: 700; font-size: 1.0625rem; line-height: 1.3; }
.reg__ige { font-size: .875rem; color: var(--gold-ink); font-weight: 600; letter-spacing: .02em; }
.reg__who { font-size: .875rem; color: var(--ink-soft); grid-column: 2; }
.reg__media { display: none; }
.reg__thumb { width: 112px; border-radius: 3px; box-shadow: 0 1px 2px oklch(30% .03 60 / .18), 0 6px 12px -6px oklch(30% .03 60 / .3); }

.page-head { width: var(--wrap); margin: 0 auto; padding: var(--s7) 0 var(--s6); }
.page-head h1 { margin-top: var(--s3); font-size: clamp(2rem, 1.4rem + 2.6vw, 3.2rem); }
.page-head__lede { margin-top: var(--s4); color: var(--ink-soft); max-width: var(--measure); }
.year { width: var(--wrap); margin: 0 auto var(--s7); display: grid; gap: var(--s3); }
.year__h { font-size: .875rem; letter-spacing: .14em; color: var(--ink-soft); font-weight: 700; padding: var(--s2) 0; }

/* ---------- alkalom-oldal ---------- */
.occasion { width: var(--wrap); margin: 0 auto; padding: var(--s6) 0 var(--s8); }
.occasion__grid { display: grid; gap: var(--s7); align-items: start; }
.occasion__text h1 { margin-top: var(--s3); font-size: clamp(1.9rem, 1.3rem + 2.4vw, 3rem); max-width: 18ch; }
.facts { margin: var(--s6) 0 0; display: grid; gap: var(--s3); }
.facts div { display: grid; grid-template-columns: 7.5rem 1fr; gap: var(--s3); border-top: 1px solid var(--rule); padding-top: var(--s3); }
.facts dt { color: var(--ink-soft); font-weight: 600; font-size: .9375rem; }
.facts dd { margin: 0; font-weight: 600; }
.print { margin-top: var(--s7); border: 1px solid var(--rule); border-radius: 8px; padding: var(--s5); background: oklch(98% .008 85); }
.print h2 { font-size: 1.0625rem; margin-bottom: var(--s4); }
.print__spec { margin: var(--s4) 0 0; padding-left: 1.1em; color: var(--ink-soft); font-size: .9375rem; }
.note { margin-top: var(--s6); font-size: .9375rem; }
.nocard { padding: var(--s7) var(--s5); border: 1px dashed var(--rule); border-radius: 6px; color: var(--ink-soft); text-align: center; }
.sides { display: grid; gap: var(--s5); margin-top: var(--s8); }
.sides figure { margin: 0; }
.sides img { border-radius: 4px; box-shadow: var(--shadow-card); }
.sides figcaption { margin-top: var(--s3); font-size: .875rem; color: var(--ink-soft); font-weight: 600; }
.extra { display: grid; gap: var(--s5); margin-top: var(--s5); }
.extra__img { border-radius: 4px; box-shadow: var(--shadow-card); }
.pager { display: flex; justify-content: space-between; align-items: center; margin-top: var(--s8); padding-top: var(--s5); border-top: 1px solid var(--rule); font-weight: 600; }
.pager a { text-decoration: none; padding: var(--s2) 0; }
.pager a:hover { color: var(--gold-ink); }

/* ---------- lábléc ---------- */
.site-footer {
  width: var(--wrap); margin: 0 auto; padding: var(--s6) 0 var(--s7); border-top: 1px solid var(--rule);
  display: flex; flex-wrap: wrap; gap: var(--s4) var(--s6); justify-content: space-between; font-size: .875rem; color: var(--ink-soft);
}
.site-footer nav { display: flex; gap: var(--s5); }
.site-footer a { text-decoration: none; }
.site-footer a:hover { color: var(--ink); text-decoration: underline; }

/* jogi oldalak */
.legal-block { width: var(--wrap); max-width: 760px; margin: 0 auto; padding: var(--s7) 0 var(--s8); }
.legal-block h1 { font-size: clamp(1.8rem, 1.4rem + 1.6vw, 2.5rem); margin-bottom: var(--s5); }
.legal-block h2 { font-size: 1.25rem; margin: var(--s6) 0 var(--s3); }
.legal-block p, .legal-block li, .legal-block dd { max-width: var(--measure); }
.legal-block p + p { margin-top: var(--s3); }
.legal-block dt { font-weight: 700; margin-top: var(--s4); }
.legal-block dd { margin: var(--s1) 0 0; }

/* ---------- szélesebb képernyők ---------- */
@media (max-width: 400px) {
  .brand__logo { width: 36px; }
  .brand { gap: var(--s2); }
}
@media (min-width: 760px) {
  .site-nav { gap: var(--s5); }
  .landing > section:not(.l-hero):not(.l-next) { grid-template-columns: 12rem 1fr; gap: var(--s7); }
  .l-next { grid-template-columns: 1fr 1fr; gap: var(--s7); }
  .l-pillars__list { grid-template-columns: repeat(3, 1fr); }
  .l-values__list { grid-template-columns: repeat(2, 1fr); }
  .l-values__note { grid-column: 2; }
  .reg__link { grid-template-columns: 3.4rem 10.5rem 1fr 13rem; align-items: center; padding: var(--s4) var(--s3); }
  .reg__nr { grid-row: auto; }
  .reg__who { grid-column: auto; }
  .about__pillars { grid-template-columns: repeat(3, 1fr); gap: var(--s6); }
  .sides { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 980px) {
  .next__card { justify-self: end; }
  .hero { grid-template-columns: 1fr 1.05fr; }
  .hero__card { justify-self: end; }
  .occasion__grid { grid-template-columns: 1.15fr 1fr; gap: var(--s8); }
  .reg__link { grid-template-columns: 3.4rem 10.5rem 1fr 14rem 124px; }
  .reg__media { display: block; justify-self: end; }
}

@media (prefers-reduced-motion: reduce) {
  .card__inner { transition: none; }
  .card__face { transition: opacity .25s linear; }
  .card.is-flipped .card__inner { transform: none; }
  .card.is-flipped .card__front { opacity: 0; }
  .card__back { transform: none; opacity: 0; }
  .card.is-flipped .card__back { opacity: 1; }
  .js .card--settle { opacity: 1; translate: none; }
}

/* betűhangolás (2026-10-05): címkék, navigáció, gombok, számok Alegreya Sans; címek Alegreya */
.eyebrow, .site-nav, .btn, .link, .reg__nr, .reg__date, .reg__ige, .reg__who, .facts dt, .print__spec, .pager, .site-footer, .card__hint, .year__h, .sides figcaption { font-family: var(--sans); }
h1, h2, h3, .reg__tema { font-family: var(--font); letter-spacing: -.005em; }