/* Saját tárhelyről: Kalam 700 (címek) és Karla 400–700 (szöveg), latin + latin-ext (ő, ű). SIL OFL. */
@font-face {
  font-family: "Kalam";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/kalam-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Kalam";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/kalam-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: "Karla";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/karla-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Karla";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/karla-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;
}

/* Kinek van igaza? – „Post-it fal” dizájn.
   Palaszürke tábla, rajta pasztell cetlik és fehér lapok. A cetlik enyhe
   dőlése CSS-ből jön (nth-child), a markupban nincs inline stílus (CSP). */

:root {
  --kvi-wall: #2f3a40;
  --kvi-wall-dark: #1d2326;
  --kvi-ink: #1d2326;
  --kvi-ink-soft: #4c5a61;
  --kvi-paper: #ffffff;
  --kvi-bg: #f4f6f7;
  --kvi-line: #dfe5e8;
  --kvi-on-wall: #ffffff;
  --kvi-on-wall-soft: #c7d0d4;
  --kvi-lemon: #fff27a;
  --kvi-pink: #ff9ec7;
  --kvi-mint: #9ff0c9;
  --kvi-sky: #8fd3ff;
  --kvi-pin: #e2403a;
  /* a fehér lapon belüli interaktív elemek (feladatlapok) kiemelőszíne */
  --kvi-accent: #0b4f8a;
  --kvi-accent-dark: #083b68;
  --kvi-ok: #007941;
  --kvi-bad: #c43d3d;
  --kvi-radius: 4px;
  --kvi-radius-btn: 4px;
  --kvi-shadow: 0 14px 26px rgba(0, 0, 0, .32);
  --kvi-shadow-sm: 0 6px 12px rgba(0, 0, 0, .25);
  --kvi-font: "Karla", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --kvi-font-hand: "Kalam", "Comic Sans MS", cursive;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--kvi-font);
  font-size: 17px;
  line-height: 1.6;
  color: var(--kvi-ink);
  background: var(--kvi-wall);
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
main { flex: 1 0 auto; }
h1, h2, h3 { font-family: var(--kvi-font-hand); font-weight: 700; line-height: 1.1; margin: 0; }
a { color: var(--kvi-accent); }
img { max-width: 100%; height: auto; }
:focus-visible { outline: 3px solid var(--kvi-ink); box-shadow: 0 0 0 6px var(--kvi-lemon); outline-offset: 0; }

.wrap { max-width: 1240px; margin: 0 auto; padding: 0 24px; }
.narrow { max-width: 880px; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip {
  position: absolute; left: 16px; top: -60px; z-index: 100;
  background: var(--kvi-lemon); color: var(--kvi-ink); font-weight: 700; padding: 10px 14px; text-decoration: none;
}
.skip:focus { top: 12px; }

/* ---------- Gombok ---------- */
.btn {
  display: inline-block; padding: 14px 20px; font: inherit; font-weight: 700; line-height: 1.2;
  text-decoration: none; border: none; cursor: pointer; border-radius: var(--kvi-radius-btn);
}
.btn--dark { background: var(--kvi-ink); color: #fff; }
.btn--dark:hover { background: #000; color: var(--kvi-lemon); }
.btn--lemon { background: var(--kvi-lemon); color: var(--kvi-ink); }
.btn--mint { background: var(--kvi-mint); color: var(--kvi-ink); }
.btn--lemon:hover, .btn--mint:hover { box-shadow: var(--kvi-shadow-sm); }

/* ---------- Fejléc ---------- */
.site-head { background: var(--kvi-wall-dark); border-bottom: 1px solid rgba(255, 255, 255, .08); }
.site-head__in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; padding-top: 14px; padding-bottom: 14px; }
.logo { display: flex; align-items: center; gap: 12px; color: var(--kvi-on-wall); text-decoration: none; }
.logo__text { font-family: var(--kvi-font-hand); font-weight: 700; font-size: 26px; line-height: 1; }
.logo:hover .logo__text { color: var(--kvi-lemon); }
.logo svg { flex: 0 0 auto; }
.nav { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.nav a {
  position: relative; display: inline-block; padding: 10px 14px; font-weight: 700; color: var(--kvi-on-wall);
  text-decoration: none; border-radius: 2px;
}
.nav a::after {
  content: ""; position: absolute; left: 14px; right: 14px; bottom: 4px; height: 4px; border-radius: 2px;
  background: currentColor; opacity: 0; transition: opacity .15s ease;
}
.nav a:hover::after { opacity: .6; }
.nav .nav__esettar::after { background: var(--kvi-lemon); }
.nav .nav__feladatok::after { background: var(--kvi-mint); }
.nav .nav__branchtalk::after { background: var(--kvi-pink); }
.nav a.is-active { color: var(--kvi-ink); }
.nav a.is-active::after { display: none; }
.nav .nav__esettar.is-active { background: var(--kvi-lemon); }
.nav .nav__feladatok.is-active { background: var(--kvi-mint); }
.nav .nav__branchtalk.is-active { background: var(--kvi-pink); }
.nav .nav__ext { margin-left: 8px; color: var(--kvi-on-wall-soft); font-weight: 500; }
.nav .nav__ext:hover { color: var(--kvi-on-wall); }

/* ---------- Cetlik és lapok ---------- */
.note { position: relative; padding: 32px 30px; box-shadow: var(--kvi-shadow); color: var(--kvi-ink); }
.note--lemon { background: var(--kvi-lemon); }
.note--pink { background: var(--kvi-pink); }
.note--mint { background: var(--kvi-mint); }
.note--sky { background: var(--kvi-sky); }
.note--paper { background: var(--kvi-paper); }
.note--pinned::before {
  content: ""; position: absolute; top: 12px; left: 50%; width: 18px; height: 18px; margin-left: -9px;
  border-radius: 50%; background: var(--kvi-pin); box-shadow: 0 3px 4px rgba(0, 0, 0, .4);
}
.tilt-l { transform: rotate(-1.2deg); }
.tilt-r { transform: rotate(1deg); }
.tape::before {
  content: ""; position: absolute; top: -12px; left: 38%; width: 110px; height: 26px;
  background: var(--kvi-pink); opacity: .9; transform: rotate(-3deg);
}
.tape--mint::before { background: var(--kvi-mint); }
.tape--lemon::before { background: var(--kvi-lemon); }
.tape--sky::before { background: var(--kvi-sky); }
.kicker { margin: 0; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; font-size: 13px; }
.lead { margin: 0; font-size: 19px; line-height: 1.55; }

/* ---------- Kezdőlap ---------- */
.hero { padding: 40px 0 0; }
.hero__row { display: flex; flex-wrap: wrap; align-items: center; gap: 40px; }
.hero__note { flex: 1 1 440px; padding: 50px 40px 42px; display: flex; flex-direction: column; gap: 18px; z-index: 1; }
.hero__note h1 { font-size: clamp(56px, 7.4vw, 108px); line-height: .95; }
.hero__note .btn { align-self: flex-start; margin-top: 6px; }
.polaroid { flex: 1 1 540px; margin: 0; position: relative; background: #fff; padding: 14px 14px 44px; box-shadow: var(--kvi-shadow); transform: rotate(2deg); }
.polaroid::before {
  content: ""; position: absolute; top: -14px; left: 42%; width: 120px; height: 30px;
  background: var(--kvi-mint); opacity: .85; transform: rotate(-4deg);
}
.polaroid img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.polaroid figcaption { position: absolute; right: 18px; bottom: 12px; font-size: 12px; color: var(--kvi-ink-soft); }

.doors { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 32px; padding-top: 80px; }
.door { display: flex; flex-direction: column; gap: 12px; min-height: 250px; text-decoration: none; transition: transform .15s ease; }
.door:nth-child(1) { background: var(--kvi-pink); transform: rotate(1.2deg); }
.door:nth-child(2) { background: var(--kvi-mint); transform: rotate(-1.4deg); }
.door:nth-child(3) { background: var(--kvi-sky); transform: rotate(.8deg); }
.door:hover { transform: rotate(0) translateY(-4px); }
.door__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.door h2 { font-size: 38px; }
.door__num { font-family: var(--kvi-font-hand); font-weight: 700; font-size: 40px; line-height: 1; }
.door p { margin: 0; line-height: 1.55; }
.door__cta { margin-top: auto; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }

.section { padding-top: 96px; }
.sec-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 12px 32px; margin-bottom: 20px; }
.sec-title { font-size: 56px; color: var(--kvi-on-wall); }
.more { color: var(--kvi-lemon); font-weight: 700; text-underline-offset: 4px; padding: 8px 0; }
.more:hover { color: #fff; }

.split { display: flex; flex-wrap: wrap; align-items: center; gap: 40px; }
.split__text { flex: 1 1 360px; display: flex; flex-direction: column; gap: 16px; color: var(--kvi-on-wall); }
.split__text p { margin: 0; color: #dfe5e8; font-size: 18px; max-width: 460px; }
.split__text .btn { align-self: flex-start; }
.split__list { flex: 1 1 520px; display: flex; flex-direction: column; gap: 18px; }
.door-mini { display: flex; flex-direction: column; gap: 4px; padding: 20px 22px; text-decoration: none; }
.door-mini:hover { box-shadow: 0 0 0 3px var(--kvi-lemon), var(--kvi-shadow); }

.callbox { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px 40px; padding: 40px; }
.callbox__text { flex: 1 1 520px; display: flex; flex-direction: column; gap: 12px; }
.callbox h2 { font-size: 40px; }
.callbox p { margin: 0; color: #3a4448; max-width: 680px; }
.page-end { height: 96px; }

/* ---------- Szűrőcetlik ---------- */
.filters { display: flex; flex-direction: column; gap: 14px; margin: 48px 0 0; }
.filter-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.filter-label { min-width: 90px; color: var(--kvi-on-wall); font-family: var(--kvi-font-hand); font-weight: 700; font-size: 22px; }
.chips { display: flex; flex-wrap: wrap; gap: 10px; }
.chip {
  display: inline-block; padding: 8px 13px; font-weight: 700; font-size: 14px; line-height: 1.3;
  color: var(--kvi-ink); text-decoration: none; background: var(--kvi-lemon); box-shadow: var(--kvi-shadow-sm);
}
.chip:nth-child(4n+2) { background: var(--kvi-mint); transform: rotate(1deg); }
.chip:nth-child(4n+3) { background: var(--kvi-pink); transform: rotate(-1deg); }
.chip:nth-child(4n+4) { background: var(--kvi-sky); transform: rotate(1.5deg); }
.chip:nth-child(4n+1) { transform: rotate(-1.5deg); }
.chip:hover { transform: rotate(0) translateY(-2px); }
.chip__n { font-weight: 400; }
.chip--all { background: #fff; }
.chip.is-active, .chip.is-active:nth-child(n) { background: var(--kvi-ink); color: #fff; box-shadow: 0 0 0 3px #fff; transform: none; }
.chips--terms .chip { font-size: 13px; padding: 6px 11px; }

/* ---------- Kártyák ---------- */
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 36px 28px; padding-top: 40px; }
.card {
  position: relative; display: flex; flex-direction: column; gap: 10px; padding: 30px 24px 22px;
  background: #fff; color: var(--kvi-ink); text-decoration: none; box-shadow: var(--kvi-shadow);
  transition: transform .15s ease;
}
.card::before {
  content: ""; position: absolute; top: -12px; left: 36%; width: 92px; height: 24px;
  background: var(--kvi-pink); opacity: .85; transform: rotate(-3deg);
}
.card:nth-child(4n+1) { transform: rotate(-.7deg); }
.card:nth-child(4n+2) { transform: rotate(.6deg); }
.card:nth-child(4n+2)::before { background: var(--kvi-lemon); }
.card:nth-child(4n+3) { transform: rotate(.4deg); }
.card:nth-child(4n+3)::before { background: var(--kvi-mint); }
.card:nth-child(4n+4) { transform: rotate(-.5deg); }
.card:nth-child(4n+4)::before { background: var(--kvi-sky); }
.card:hover { transform: rotate(0) translateY(-4px); }
.card__id { font-size: 12px; font-weight: 700; letter-spacing: 1px; color: var(--kvi-ink-soft); }
.card__title { font-size: 25px; line-height: 1.15; }
.card__ex { margin: 0; font-size: 15px; line-height: 1.5; color: #3a4448; }
.card__terms { margin: auto 0 0; padding-top: 10px; border-top: 1px solid var(--kvi-line); font-size: 13px; color: var(--kvi-ink-soft); }
.card--task { min-height: 170px; padding: 22px 20px; }
.card--task::before { display: none; }
.card--task .card__title { font-size: 23px; }
.card--task .card__id { display: flex; justify-content: space-between; align-items: center; color: var(--kvi-ink); }
.card--task .card__terms { border-top: none; padding-top: 0; color: #3a4448; }
.card--t-multiple-choice { background: var(--kvi-mint); }
.card--t-reflektiv { background: var(--kvi-lemon); }
.card--t-varians, .card--t-varians-matching { background: var(--kvi-sky); }
.card--t-essay { background: var(--kvi-pink); }
.card--t-sorrendezes, .card--t-brainstorming { background: #fff; }
.cards--tasks { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 24px; }
.empty { color: var(--kvi-on-wall-soft); padding: 40px 0; }

.pager { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; padding: 56px 0 0; font-weight: 700; }
.pager a, .pager span { padding: 11px 16px; background: #fff; color: var(--kvi-ink); text-decoration: none; }
.pager .is-current { background: var(--kvi-lemon); }
.pager a:hover { background: var(--kvi-mint); }

/* ---------- Archívum-fejléc + kereső ---------- */
.page-hero { padding: 40px 0 0; }
.page-hero__row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 32px; }
.page-hero__note { flex: 1 1 560px; padding: 42px 40px 36px; display: flex; flex-direction: column; gap: 14px; }
.page-hero__note h1 { font-size: clamp(44px, 5.6vw, 76px); line-height: 1; }
.search { flex: 1 1 360px; display: flex; gap: 8px; }
.search input {
  flex: 1; min-width: 0; padding: 14px 16px; border: none; border-radius: var(--kvi-radius); font: inherit; color: var(--kvi-ink); background: #fff;
}
.search button { flex: 0 0 auto; }

/* ---------- Cikk (eset, feladatlap) ---------- */
.article-head { padding: 28px 0 8px; display: flex; flex-direction: column; gap: 14px; }
.crumb { margin: 0; }
.crumb a { color: var(--kvi-on-wall); font-weight: 700; text-decoration: none; }
.crumb a:hover { color: var(--kvi-lemon); }
.article-id { margin: 0; color: var(--kvi-lemon); font-weight: 700; letter-spacing: 1.5px; }
.article-title { color: var(--kvi-on-wall); font-size: clamp(40px, 5.4vw, 70px); line-height: 1.02; }
.stack { display: flex; flex-direction: column; gap: 44px; padding-top: 36px; }
.sheet { position: relative; background: #fff; padding: 40px; box-shadow: var(--kvi-shadow); }
.sheet::before {
  content: ""; position: absolute; top: -14px; left: 40px; width: 130px; height: 30px;
  background: var(--kvi-pink); opacity: .9; transform: rotate(-3deg);
}
.sheet--mint::before { background: var(--kvi-mint); left: auto; right: 60px; transform: rotate(3deg); }
.sheet--sky::before { background: var(--kvi-sky); }
.sheet--plain::before { display: none; }
.sheet h2 { font-size: 34px; margin: 0 0 14px; }
.sheet h3 { font-family: var(--kvi-font); font-size: 20px; margin: 26px 0 8px; }
.sheet p, .sheet li { line-height: 1.65; }
.sheet ul, .sheet ol { padding-left: 24px; }
.sheet blockquote { margin: 18px 0; padding: 18px 22px; background: #eef9f3; font-style: italic; }
.sheet hr { border: none; border-top: 2px dashed var(--kvi-line); margin: 32px 0; }
.sheet table { border-collapse: collapse; width: 100%; }
.sheet th, .sheet td { border-bottom: 1px solid var(--kvi-line); padding: 8px 10px; text-align: left; vertical-align: top; }
.table-scroll { overflow-x: auto; }

/* Az eset tartalma (a vault-parser HTML-je) */
.kvi-eset-cim { font-size: 34px; margin: 0 0 12px; }
.kvi-eset-alcim { margin: 0 0 18px; font-size: 14px; line-height: 1.5; color: var(--kvi-ink-soft); }
.kvi-eset-alcim .kvi-alcim-hu { color: var(--kvi-ink); font-weight: 700; }
.kvi-eset-alcim .kvi-alcim-en { font-style: italic; }
.kvi-eset-lead { background: #fff8bf; padding: 20px 22px; font-size: 19px; line-height: 1.6; }
.kvi-eset-lead p { margin: 0 0 10px; }
.kvi-eset-lead p:last-child { margin-bottom: 0; }
.kvi-forras-blokk { margin-top: 22px; border-top: 2px dashed var(--kvi-line); padding-top: 14px; }
.kvi-forras-blokk .kvi-eset-cim { font-size: 26px; margin-top: 18px; }
.kvi-forras-nyito, .kvi-valasz-nyito { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 10px; padding: 8px 0; font-weight: 700; color: var(--kvi-accent); }
.kvi-forras-nyito::-webkit-details-marker, .kvi-valasz-nyito::-webkit-details-marker { display: none; }
.kvi-forras-nyito::before, .kvi-valasz-nyito::before { content: "\25B8"; transition: transform .15s ease; }
.kvi-forras-blokk[open] .kvi-forras-nyito::before, .kvi-valasz-blokk[open] .kvi-valasz-nyito::before { transform: rotate(90deg); }
.kvi-valasz-nyito { font-family: var(--kvi-font-hand); font-size: 28px; line-height: 1.2; color: var(--kvi-ink); }
.kvi-valasz-blokk[open] .kvi-valasz-nyito { margin-bottom: 12px; }
.kvi-lang-valto { display: inline-flex; gap: 8px; margin: 10px 0 14px; }
.kvi-lang-btn { font: inherit; font-weight: 700; padding: 8px 14px; border: none; background: var(--kvi-bg); color: var(--kvi-ink); cursor: pointer; }
.kvi-lang-btn.is-active { background: var(--kvi-ink); color: #fff; }
.kvi-forras-szoveg[hidden] { display: none; }
.kvi-forras-szoveg { color: #3a4448; }

.gondold { padding: 36px 40px; transform: rotate(-.8deg); display: flex; flex-direction: column; gap: 12px; }
.gondold h2 { font-size: 38px; }
.gondold p { margin: 0; }
.gondold ol { margin: 0; padding: 0; list-style: none; counter-reset: k; display: flex; flex-direction: column; gap: 8px; }
.gondold li { counter-increment: k; font-family: var(--kvi-font-hand); font-weight: 700; font-size: 22px; line-height: 1.35; }
.gondold li::before { content: counter(k) ". "; }
.gondold label { font-weight: 700; margin-top: 4px; }
.gondold textarea {
  font-family: var(--kvi-font-hand); font-weight: 700; font-size: 20px; color: var(--kvi-ink);
  padding: 12px 14px; border: none; background: rgba(255, 255, 255, .65); resize: vertical; min-height: 96px;
}
.cta-pair { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 28px; align-items: start; }
.cta { display: flex; flex-direction: column; gap: 12px; }
.cta:nth-child(1) { transform: rotate(.8deg); }
.cta:nth-child(2) { transform: rotate(-1deg); }
.cta h2 { font-size: 26px; line-height: 1.2; }
.cta p { margin: 0; }
.cta ul { margin: 0; padding-left: 20px; }
.cta .btn { align-self: flex-start; margin-top: 4px; }
.attrib { color: var(--kvi-on-wall-soft); font-size: 14px; line-height: 1.6; border-top: 1px solid #4c5a61; padding-top: 18px; margin: 0; }
.attrib strong { color: #fff; }
.attrib a { color: var(--kvi-lemon); font-weight: 700; }

/* Jelszókapu */
.gate { max-width: 560px; display: flex; flex-direction: column; gap: 12px; }
.gate h2 { font-size: 30px; }
.gate p { margin: 0; }
.gate label { font-weight: 700; font-size: 14px; }
.gate input[type="password"] { font: inherit; padding: 13px 14px; border: 2px solid var(--kvi-ink); border-radius: var(--kvi-radius); }
.gate .btn { align-self: flex-start; }
.gate__hiba { background: #ffe3ea; color: #7a0f2c; padding: 10px 14px; font-weight: 700; }

/* ---------- BranchTalk ---------- */
.bt { display: flex; flex-wrap: wrap; gap: 36px; align-items: flex-start; padding-top: 40px; }
.bt__side { flex: 1 1 340px; display: flex; flex-direction: column; gap: 28px; }
.bt__intro { padding: 38px 32px 32px; display: flex; flex-direction: column; gap: 12px; transform: rotate(-1.2deg); }
.bt__intro h1 { font-size: 64px; line-height: 1; }
.bt__scenes { display: flex; flex-direction: column; gap: 14px; list-style: none; margin: 0; padding: 0; }
.bt-scene {
  width: 100%; text-align: left; border: none; cursor: pointer; font: inherit; color: var(--kvi-ink);
  background: #fff; padding: 18px 20px; box-shadow: var(--kvi-shadow-sm); display: flex; flex-direction: column; gap: 4px;
}
.bt__scenes li:nth-child(2n) .bt-scene { transform: rotate(.8deg); }
.bt-scene:hover, .bt-scene.is-active { box-shadow: 0 0 0 3px var(--kvi-lemon), var(--kvi-shadow-sm); }
.bt-scene__tag { font-size: 12px; font-weight: 700; letter-spacing: 1px; color: var(--kvi-ink-soft); text-transform: uppercase; }
.bt-scene__title { font-family: var(--kvi-font-hand); font-weight: 700; font-size: 21px; line-height: 1.2; }
.bt-code { display: flex; flex-direction: column; gap: 8px; }
.bt-code label { color: #fff; font-weight: 700; }
.bt-code__row { display: flex; gap: 8px; }
.bt-code input { flex: 1; min-width: 0; padding: 13px 14px; border: none; border-radius: var(--kvi-radius); font: inherit; }
.bt-msg { margin: 0; color: var(--kvi-lemon); font-weight: 700; min-height: 1.6em; }
.bt__chat { flex: 999 1 600px; min-width: 0; background: var(--kvi-bg); padding: 32px; box-shadow: var(--kvi-shadow); position: relative; display: flex; flex-direction: column; gap: 16px; }
.bt__chat::before {
  content: ""; position: absolute; top: -14px; left: 44%; width: 130px; height: 30px;
  background: var(--kvi-sky); opacity: .9; transform: rotate(-2deg);
}
.bt__chat-head { display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: space-between; align-items: baseline; border-bottom: 2px dashed var(--kvi-on-wall-soft); padding-bottom: 12px; }
.bt__chat-head h2 { font-size: 28px; }
.bt-link { border: none; background: none; font: inherit; font-weight: 700; color: var(--kvi-accent); padding: 8px 0; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.bt__log { display: flex; flex-direction: column; gap: 14px; }
.bubble { margin: 0; max-width: 78%; padding: 14px 16px; line-height: 1.5; font-size: 17px; }
.bubble--them { align-self: flex-start; background: #fff; border: 2px solid var(--kvi-ink); border-radius: 4px 18px 18px 18px; }
.bubble--you { align-self: flex-end; background: var(--kvi-mint); border-radius: 18px 4px 18px 18px; box-shadow: 0 4px 8px rgba(0, 0, 0, .12); }
.bt__choices { display: flex; flex-direction: column; gap: 10px; padding-top: 16px; border-top: 2px dashed var(--kvi-on-wall-soft); }
.bt__choices p { margin: 0; font-weight: 700; font-size: 14px; color: var(--kvi-ink-soft); }
.choice { border: 2px solid var(--kvi-ink); background: #fff; text-align: left; padding: 14px 16px; line-height: 1.45; font: inherit; font-weight: 500; color: var(--kvi-ink); cursor: pointer; }
.choice:hover { background: var(--kvi-lemon); }
.bt-ending { padding: 24px; transform: rotate(-.6deg); display: flex; flex-direction: column; gap: 10px; box-shadow: var(--kvi-shadow-sm); }
.bt-ending--good { background: var(--kvi-mint); }
.bt-ending--ok { background: var(--kvi-lemon); }
.bt-ending--bad { background: var(--kvi-pink); }
.bt-ending__tone { margin: 0; font-family: var(--kvi-font-hand); font-weight: 700; font-size: 24px; }
.bt-ending p { margin: 0; }
.bt-ending .btn, .bt-ending .bt-link { align-self: flex-start; }
.bt__empty { margin: 0; color: var(--kvi-ink-soft); }
[hidden] { display: none !important; }

/* ---------- Keresés ---------- */
.results-info { color: var(--kvi-on-wall-soft); margin: 32px 0 0; }

/* ---------- Lábléc ---------- */
.site-foot { margin-top: 96px; background: var(--kvi-wall-dark); color: var(--kvi-on-wall-soft); font-size: 14px; line-height: 1.6; }
.site-foot__in { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 24px 48px; padding-top: 40px; padding-bottom: 40px; }
.site-foot__text { flex: 1 1 520px; }
.site-foot__title { margin: 0 0 8px; font-family: var(--kvi-font-hand); font-weight: 700; font-size: 24px; color: #fff; }
.site-foot p { margin: 0; max-width: 680px; }
.site-foot .btn { align-self: flex-start; transform: rotate(-2deg); }

@media (max-width: 640px) {
  body { font-size: 16px; }
  .wrap { padding: 0 16px; }
  .logo__text { font-size: 22px; }
  .nav { gap: 2px; }
  .nav a { padding: 10px 10px; }
  .nav .nav__ext { display: none; }
  .hero__note, .page-hero__note { padding: 38px 22px 28px; }
  .note, .sheet { padding: 28px 20px; }
  .gondold { padding: 30px 20px; }
  .callbox { padding: 28px 20px; }
  .sec-title { font-size: 44px; }
  .cards { grid-template-columns: 1fr; }
  .filter-label { min-width: 0; width: 100%; }
  .bubble { max-width: 90%; }
  .bt__chat { padding: 24px 16px; }
}
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; }
}
@media print {
  body { background: #fff; }
  .site-head, .site-foot, .cta-pair, .gondold textarea { display: none; }
  .sheet, .note { box-shadow: none; transform: none; }
}

/* Feladatlap-blokkok: a feladat.js által kezelt interaktív elemek.
   A régi WP-plugin esettar.css-éből átvéve, az osztálynevek változatlanok. */

/* Feladatlap-specifikus */
li.kvi-correct { list-style: none; margin-left: -26px; padding: 6px 12px; background: #e9f7ef; border-radius: 8px; }
li.kvi-wrong { list-style: none; margin-left: -26px; padding: 6px 12px; border-radius: 8px; color: var(--kvi-ink-soft); }
li.kvi-correct .kvi-mark { color: var(--kvi-ok); }
li.kvi-wrong .kvi-mark { color: var(--kvi-bad); }
.kvi-callout {
  margin: 20px 0; padding: 16px 20px;
  background: #fff8bf; border: 1px solid #efe08a; border-radius: 12px;
}
.kvi-callout-title { margin: 0 0 8px; font-weight: 800; color: var(--kvi-accent-dark); }
.kvi-callout p:last-child { margin-bottom: 0; }
.kvi-korpusz-ref { font-size: 14px; color: var(--kvi-ink-soft); }

/* Interaktív feladatblokkok */
.kvi-q { margin: 20px 0 28px; }
.kvi-opt {
  display: block; width: 100%; text-align: left; margin: 8px 0;
  padding: 12px 16px; font: inherit; font-size: 16px; cursor: pointer;
  background: var(--kvi-paper); color: var(--kvi-ink);
  border: 2px solid var(--kvi-line); border-radius: 10px;
  transition: border-color .1s ease, background .1s ease;
}
.kvi-opt:hover { border-color: var(--kvi-accent); }
.kvi-opt.is-chosen { border-color: var(--kvi-ink); background: #ecedf5; }
.kvi-q.is-done .kvi-opt { cursor: default; }
.kvi-opt.is-correct { border-color: var(--kvi-ok); background: #e9f7ef; }
.kvi-opt.is-wrong { border-color: var(--kvi-bad); background: #fbecec; }
.kvi-q-actions { display: flex; gap: 10px; margin-top: 12px; }
.kvi-check, .kvi-reset, .kvi-reveal-btn, .kvi-mf-pdf, .kvi-ml-pdf {
  padding: 11px 20px; border: none; border-radius: var(--kvi-radius-btn); font: inherit; font-size: 13px;
  font-weight: 700; text-transform: uppercase; letter-spacing: .8px;
  cursor: pointer; background: var(--kvi-accent); color: #fff;
}
.kvi-reset, .kvi-reveal-btn { background: var(--kvi-ink); }
.kvi-check:hover, .kvi-mf-pdf:hover, .kvi-ml-pdf:hover { background: var(--kvi-accent-dark); }
.kvi-q-feedback { font-weight: 700; margin: 12px 0 0; }
.kvi-q-expl {
  margin-top: 14px; padding: 16px 20px;
  background: #e9f7ef; border: 1px solid #bfe3cd; border-radius: 12px;
}
.kvi-q-expl p:first-child { margin-top: 0; }
.kvi-q-expl p:last-child, .kvi-q-expl ol:last-child, .kvi-q-expl ul:last-child { margin-bottom: 0; }

.kvi-ord {
  display: flex; gap: 10px; align-items: flex-start; width: 100%; text-align: left;
  margin: 8px 0; padding: 12px 16px; font: inherit; font-size: 15px; cursor: pointer;
  background: var(--kvi-paper); border: 2px solid var(--kvi-line); border-radius: 10px;
  color: var(--kvi-ink);
}
.kvi-ord:hover { border-color: var(--kvi-accent); }
.kvi-ord.is-picked { border-color: var(--kvi-ink); background: #ecedf5; }
.kvi-ord.is-correct { border-color: var(--kvi-ok); background: #e9f7ef; }
.kvi-ord.is-wrong { border-color: var(--kvi-bad); background: #fbecec; }
.kvi-ord-badge {
  flex: 0 0 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--kvi-ink); color: #fff; border-radius: 8px; font-weight: 800; font-size: 14px;
}
.kvi-ord.is-picked .kvi-ord-badge { background: var(--kvi-accent); }

.kvi-match-row {
  display: flex; gap: 12px; align-items: center; justify-content: space-between;
  margin: 8px 0; padding: 12px 16px;
  background: var(--kvi-paper); border: 2px solid var(--kvi-line); border-radius: 10px;
}
.kvi-match-row.is-correct { border-color: var(--kvi-ok); background: #e9f7ef; }
.kvi-match-row.is-wrong { border-color: var(--kvi-bad); background: #fbecec; }
.kvi-match-left { flex: 1; }
.kvi-match-select {
  font: inherit; font-size: 14px; padding: 8px 10px; border-radius: 8px;
  border: 1px solid var(--kvi-line); background: #fff; max-width: 240px;
}
.kvi-match-fix { font-weight: 800; color: var(--kvi-ok); white-space: nowrap; }

@media (max-width: 640px) {
  .kvi-match-row { flex-direction: column; align-items: stretch; }
  .kvi-match-select { max-width: none; }
}

/* Skálázós önteszt */
.kvi-likert-row {
  display: flex; gap: 16px; align-items: center; justify-content: space-between;
  margin: 10px 0; padding: 14px 16px;
  background: var(--kvi-paper); border: 2px solid var(--kvi-line); border-radius: 10px;
}
.kvi-likert-text { margin: 0; flex: 1; }
.kvi-likert-scale { display: flex; gap: 6px; flex: 0 0 auto; }
.kvi-scale-btn {
  width: 40px; height: 40px; border-radius: 8px; border: 2px solid var(--kvi-line);
  background: var(--kvi-paper); font: inherit; font-weight: 700; cursor: pointer;
  color: var(--kvi-ink);
}
.kvi-scale-btn:hover { border-color: var(--kvi-accent); }
.kvi-scale-btn.is-chosen { background: var(--kvi-accent); border-color: var(--kvi-accent); color: #fff; }
.kvi-q.is-done .kvi-scale-btn { cursor: default; }
.kvi-likert-band {
  margin-top: 14px; padding: 16px 20px;
  background: #fff8bf; border: 1px solid #efe08a; border-radius: 12px; font-weight: 500;
}
@media (max-width: 640px) {
  .kvi-likert-row { flex-direction: column; align-items: stretch; }
  .kvi-likert-scale { justify-content: space-between; }
}

/* Kényszerválasztásos önteszt (A/B mondatpárok, pl. a Thomas-Kilmann teszt) */
.kvi-q-parvalaszt .kvi-pv-row {
  display: grid;
  grid-template-columns: 2rem 1fr;
  gap: .35rem .5rem;
  padding: .7rem 0;
  border-bottom: 1px solid var(--kvi-line);
}
.kvi-q-parvalaszt .kvi-pv-row:last-of-type { border-bottom: 0; }
.kvi-pv-szam {
  grid-row: span 2;
  margin: 0;
  font-weight: 700;
  color: var(--kvi-ink-soft);
}
.kvi-pv-opt {
  display: flex;
  gap: .55rem;
  align-items: baseline;
  width: 100%;
  text-align: left;
  font: inherit;
  color: var(--kvi-ink);
  background: #fff;
  border: 1px solid var(--kvi-line);
  border-radius: 8px;
  padding: .5rem .7rem;
  cursor: pointer;
}
.kvi-pv-opt:hover { border-color: var(--kvi-accent); }
.kvi-pv-opt.is-chosen {
  border-color: var(--kvi-accent);
  background: rgba(11, 79, 138, .09);
  font-weight: 500;
}
.kvi-pv-betu {
  flex: 0 0 auto;
  font-weight: 700;
  color: var(--kvi-accent);
}
.kvi-pv-row.is-answered .kvi-pv-szam { color: var(--kvi-accent); }

.kvi-pv-eredmeny {
  margin-top: 1.2rem;
  padding: 1.1rem 1.2rem;
  background: var(--kvi-bg);
  border-radius: 10px;
}
.kvi-pv-cim { margin: 0 0 .8rem; font-size: 1.05rem; }
.kvi-pv-lista { list-style: none; margin: 0 0 .9rem; padding: 0; }
.kvi-pv-lista li {
  display: grid;
  grid-template-columns: minmax(9rem, 12rem) 1fr 2.2rem;
  gap: .6rem;
  align-items: center;
  margin-bottom: .35rem;
}
.kvi-pv-nev { font-weight: 500; }
.kvi-pv-savw {
  background: #fff;
  border: 1px solid var(--kvi-line);
  border-radius: 999px;
  height: .8rem;
  overflow: hidden;
}
.kvi-pv-sav { display: block; height: 100%; background: var(--kvi-accent); }
.kvi-pv-ertek { text-align: right; font-variant-numeric: tabular-nums; font-weight: 700; }
.kvi-pv-osszegzes { margin: 0; }

@media (max-width: 600px) {
  .kvi-pv-lista li { grid-template-columns: 1fr 2.2rem; }
  .kvi-pv-savw { grid-column: 1 / -1; }
}

/* Konfliktus-műszerfal (2.5.1) */
.kvi-q-muszerfal .kvi-mf-blokk,
.kvi-q-munkalap .kvi-mf-blokk {
  margin: 0 0 26px;
  padding: 18px 20px;
  background: #fff;
  border: 1px solid var(--kvi-line);
  border-radius: 10px;
}
.kvi-q-muszerfal .kvi-mf-blokk h3,
.kvi-q-munkalap .kvi-mf-blokk h3 { margin: 0 0 10px; }
.kvi-mf-sugo { margin: 0 0 10px; color: var(--kvi-ink-soft); font-size: 14.5px; }
.kvi-mf-cimke {
  display: block;
  margin: 12px 0 4px;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--kvi-ink);
}
.kvi-mf-szoveg {
  width: 100%;
  font: inherit;
  color: var(--kvi-ink);
  padding: 9px 12px;
  border: 1px solid var(--kvi-line);
  border-radius: 8px;
  resize: vertical;
  background: var(--kvi-bg);
}
.kvi-mf-szoveg:focus { outline: 2px solid var(--kvi-accent); outline-offset: -1px; }
.kvi-mf-valaszto { display: grid; gap: 6px; margin-bottom: 4px; }
.kvi-mf-opt {
  display: flex;
  gap: 10px;
  align-items: baseline;
  width: 100%;
  text-align: left;
  font: inherit;
  font-size: 15px;
  color: var(--kvi-ink);
  background: #fff;
  border: 1px solid var(--kvi-line);
  border-radius: 8px;
  padding: 8px 12px;
  cursor: pointer;
}
.kvi-mf-opt:hover { border-color: var(--kvi-accent); }
.kvi-mf-opt.is-fo { border-color: var(--kvi-accent); background: rgba(11,79,138,.09); }
.kvi-mf-opt.is-mellek { border-color: var(--kvi-ink-soft); background: var(--kvi-bg); }
.kvi-mf-jel {
  flex: 0 0 14px;
  color: var(--kvi-accent);
  font-weight: 700;
}
.kvi-mf-opt.is-mellek .kvi-mf-jel { color: var(--kvi-ink-soft); }
.kvi-mf-osszegzes {
  margin-top: 18px;
  padding: 16px 20px;
  background: var(--kvi-bg);
  border-radius: 10px;
}
.kvi-mf-lista { list-style: none; margin: 0 0 10px; padding: 0; }
.kvi-mf-lista li { margin-bottom: 6px; }
.kvi-mf-megjegyzes { margin: 0; font-size: 14px; color: var(--kvi-ink-soft); }

/* Saját konfliktus munkalap (1.3.2) */
.kvi-ml-lista { display: grid; gap: 6px; margin-bottom: 6px; }
.kvi-ml-pipa {
  display: flex;
  gap: 10px;
  align-items: baseline;
  width: 100%;
  text-align: left;
  font: inherit;
  font-size: 15px;
  color: var(--kvi-ink);
  background: #fff;
  border: 1px solid var(--kvi-line);
  border-radius: 8px;
  padding: 8px 12px;
  cursor: pointer;
}
.kvi-ml-pipa:hover { border-color: var(--kvi-accent); }
.kvi-ml-pipa.is-be { border-color: var(--kvi-accent); background: rgba(11,79,138,.09); }
.kvi-ml-jel {
  flex: 0 0 14px;
  color: var(--kvi-accent);
  font-weight: 700;
}
.kvi-ml-skala { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 8px; }
.kvi-ml-fok {
  font: inherit;
  min-width: 40px;
  padding: 7px 0;
  color: var(--kvi-ink);
  background: #fff;
  border: 1px solid var(--kvi-line);
  border-radius: 8px;
  cursor: pointer;
}
.kvi-ml-fok:hover { border-color: var(--kvi-accent); }
.kvi-ml-fok.is-be { border-color: var(--kvi-accent); background: rgba(11,79,138,.09); font-weight: 700; }
.kvi-ml-skala-sugo.is-figyelmeztet { color: var(--kvi-ink); font-weight: 600; }
.kvi-ml-sugo {
  display: block;
  margin-top: 2px;
  font-weight: 400;
  font-size: 14px;
  color: var(--kvi-ink-soft);
}
.kvi-ml-allapot { margin: 8px 0 0; font-size: 14px; color: var(--kvi-ink-soft); }

/* Leila-gyakorlat (3.3.3): kétkörös rangsorolás */
.kvi-le-racs { display: grid; gap: 6px; margin: 10px 0 4px; }
.kvi-le-sor {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  background: #fff;
  border: 1px solid var(--kvi-line);
  border-radius: 8px;
}
.kvi-le-nev { font-weight: 700; }
.kvi-le-pontok { display: flex; gap: 6px; }
.kvi-le-pont {
  font: inherit;
  min-width: 38px;
  padding: 6px 0;
  color: var(--kvi-ink);
  background: var(--kvi-bg);
  border: 1px solid var(--kvi-line);
  border-radius: 8px;
  cursor: pointer;
}
.kvi-le-pont:hover { border-color: var(--kvi-accent); }
.kvi-le-pont.is-be { border-color: var(--kvi-accent); background: rgba(11,79,138,.14); font-weight: 700; }
.kvi-le-masodik { margin-top: 26px; padding-top: 6px; border-top: 1px solid var(--kvi-line); }
.kvi-le-tabla { margin-top: 16px; }
.kvi-le-osszegzes { width: 100%; border-collapse: collapse; }
.kvi-le-osszegzes th, .kvi-le-osszegzes td {
  padding: 7px 10px;
  border-bottom: 1px solid var(--kvi-line);
  text-align: left;
}
.kvi-le-osszegzes th { font-size: 14px; color: var(--kvi-ink-soft); }
.kvi-le-tovabb, .kvi-le-osszevet {
  padding: 11px 20px; border: none; border-radius: var(--kvi-radius-btn); font: inherit; font-size: 13px;
  font-weight: 700; text-transform: uppercase; letter-spacing: .8px;
  cursor: pointer; background: var(--kvi-accent); color: #fff;
}
.kvi-le-tovabb:hover, .kvi-le-osszevet:hover { background: var(--kvi-accent-dark); }

/* A műszerfal-bemérés nyomtatási nézete (Letöltés PDF-ben) */
.kvi-mf-print { display: none; }
@media print {
  body.kvi-mf-nyomtatas > *:not(.kvi-mf-print) { display: none !important; }
  body.kvi-mf-nyomtatas .kvi-mf-print {
    display: block !important;
    font-family: "Karla", "Helvetica Neue", Arial, sans-serif;
    color: #25273e;
    font-size: 12pt;
    line-height: 1.55;
  }
  .kvi-mf-print h1 { font-size: 20pt; margin: 0 0 2pt; border-bottom: 2.5pt solid #0b4f8a; padding-bottom: 6pt; }
  .kvi-mfp-datum { color: #505164; font-size: 10pt; margin: 4pt 0 14pt; }
  .kvi-mf-print h2 { font-size: 13pt; margin: 14pt 0 4pt; }
  .kvi-mfp-sor { margin: 0 0 4pt; }
}