/* Functional layer on top of Kai's design (kai.css): only what cm.js and the
   consent gate need. No global element rules here, so the design keeps its look. */
:root { --suti-sav-magassag: 0px; }
body { padding-bottom: var(--suti-sav-magassag); }
/* An author display rule beats the UA [hidden] rule, so it is restated here. */
[hidden], .suti-sav[hidden] { display: none !important; }

.proba-sav {
  background: #fff3c4; color: #5a4300; font: 14px/1.4 "Inter", system-ui, sans-serif; text-align: center; padding: 6px 12px;
  border-bottom: 1px solid #e8d48a;
}

/* Consent bar (same contract as ai-audit-immerziv gtm.ts) */
.suti-sav {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; background: #fff; color: #17130f; border-top: 2px solid #17130f;
  padding: 14px 20px; display: flex; gap: 14px; align-items: center; justify-content: center; flex-wrap: wrap;
  font: 15px/1.5 "Inter", system-ui, sans-serif; box-shadow: 0 -6px 20px rgba(0,0,0,.08);
}
.suti-sav p { margin: 0; max-width: 640px; }
.suti-sav a { color: #a50f15; }
.suti-sav button { font: 700 15px "Inter", system-ui, sans-serif; padding: 10px 18px; border-radius: 6px; cursor: pointer; border: 2px solid #17130f; }
.suti-sav .elfogad { background: #17130f; color: #fff; }
.suti-sav .elutasit { background: #fff; color: #17130f; }

/* Checkout card step: the TEST box of the local payment double, and the error slot */
.teszt-kartya { border: 3px solid #c79a00; background: #fffbe6; color: #17130f; border-radius: 10px; padding: 20px; }
.teszt-kartya .teszt-cimke { display: inline-block; background: #c79a00; color: #fff; font: 700 13px "Inter", system-ui, sans-serif; letter-spacing: .1em; padding: 3px 8px; border-radius: 4px; }
.kartya-hiba { color: #a50f15; font-weight: 600; }

/* Illustration label required by the copy Doc (Felix 55034): an invented
   example must say so, visibly, next to the figure. */
.swap .fig-note.szemleltetes { color: #C9CEDA; margin-top: 14px; }


/* Blind comparison data figure (vak-szakasz.html): figure left, the two result
   paragraphs right; one column under 768 px, same break as kai.css. */
.meres-sor { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 48px; align-items: center; margin: 48px 0 40px; }
.meres-abra { width: 100%; max-width: 420px; height: auto; }
#osszevetes .ba .sheet .hl { font-size: clamp(22px, 2.4vw, 30px); }
#osszevetes .ba { margin: 28px 0 32px; }
@media (max-width: 767px) { .meres-sor { grid-template-columns: 1fr; gap: 24px; } #osszevetes .who span:last-child { display: none; } }

/* One-click consent sentence above the upsell/downsell button (Doc 4/A-4/B, Lead 55123).
   Readable, not fine print: it is the legal consent the click records. */
.gomb-hozzajarulas { font-size: 15px; line-height: 1.5; color: var(--tinta-2); max-width: 560px; margin: 0 0 14px; }

/* FIG 1 typing covers are clipped to the paper (kai-szoveg.mjs, #hxClip). Below 768 px Kai
   widens the paper to x 170 / width 282 (kai.css); the clip follows, or the covers would be
   cut at the old edge. Mirror of kai.css .hx-paper > rect:first-child, checked 2026-09-24. */
@media (max-width: 767px) { .hx-clip { x: 170px; width: 282px; } }

/* "Akikkel Sipos Zoltán dolgozott" (Doc 0925, kai-szoveg.mjs): spans the two quote columns,
   in Kai's display face; kai.css has no rule for it, so it lives here and survives a re-pull. */
.quotes .quotes-title { grid-column: 1 / -1; margin: 0; font-family: var(--font-display); font-size: 28px; line-height: 1.2; }
@media (max-width: 767px) { .quotes .quotes-title { font-size: 24px; } }
