/*!
 * IH Course Finder — tanfolyamválasztó
 * A stílus az IHB Figma „Útválasztó modál (terv)" oldal Dev Mode értékeiből.
 * Minden osztály .ihcf- prefixszel, hogy ne ütközzön a témával / Elementorral.
 */

.ihcf-root.ihcf-root {
  --ihcf-primary: #3b44b5;
  --ihcf-primary-hover: #323a9c;
  --ihcf-soft: #e1e7f8;
  --ihcf-ground: #f5f5f7;
  --ihcf-text: #292929;
  --ihcf-ink: #000000;
  --ihcf-muted: #5f6070;
  --ihcf-faint: #9a9aa5;
  --ihcf-line: #e1e7f8;
  --ihcf-green: #008c4d;
  --ihcf-error: #b12624;
  --ihcf-green-soft: #e2f4ea;
  --ihcf-pink-soft: #fde3e3;

  /* Az ikonnégyzetek márkaszínei. A hat szín a panel tetején futó színes
     csíkból való, annak sorrendjében; a csík két legvilágosabb szegmense
     (lime #AEDC5C, sárga #FBCE72) kimarad, mert azokon a fehér ikon
     gyakorlatilag eltűnne. */
  --ihcf-b-piros: #ff6166;
  --ihcf-b-rozsa: #f168a5;
  --ihcf-b-bordo: #9f2b76;
  --ihcf-b-indigo: #3944bd;
  --ihcf-b-zold: #00b25a;
  --ihcf-b-narancs: #ffa753;

  /* A korábbi négy szín — a folyamatból kieső képernyők még ezt használják. */
  --ihcf-c-coral: #f06c6a;
  --ihcf-c-green: #28ae62;
  --ihcf-c-orange: #dd9933;
  --ihcf-c-purple: #923472;

  --ihcf-radius-card: 20px;
  --ihcf-radius-box: 16px;
  --ihcf-radius-opt: 12px;

  --ihcf-font: Aptos, "Open Sans", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;

  font-family: var(--ihcf-font);
  color: var(--ihcf-text);
  -webkit-font-smoothing: antialiased;
}

/* A téma nem mindenhol állít box-sizing-et — enélkül a 100% széles
   gombok kilógnak a panelből. */
.ihcf-root.ihcf-root,
.ihcf-root.ihcf-root *,
.ihcf-root.ihcf-root *::before,
.ihcf-root.ihcf-root *::after {
  box-sizing: border-box;
}

/*
 * Védőreset. A téma és az Elementor a gombokra, címsorokra és mezőkre is ad
 * saját stílust (`.elementor-kit-9 button`, `.elementor-kit-9 h2`), ami
 * erősebb az egyosztályos szabályoknál. Itt semlegesítjük, amit utána a
 * saját komponensszabályaink állítanak be — azok magasabb fajsúlyúak, így
 * ezzel a resettel szemben is nyernek.
 */
.ihcf-root.ihcf-root button,
.ihcf-root.ihcf-root input,
.ihcf-root.ihcf-root a {
  margin: 0;
  font: inherit;
  letter-spacing: normal;
  text-transform: none;
  box-shadow: none;
  min-height: 0;
  min-width: 0;
  /* A tema nowrap-ot orokit a gombok szovegere, ezert a hosszu feliratok
     nem tornek. Szokoznel torjenek, de szo kozben soha. */
  white-space: normal;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: manual;
}
.ihcf-root.ihcf-root button {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: inherit;
  text-align: left;
  width: auto;
  transition: none;
}
.ihcf-root.ihcf-root a {
  color: inherit;
  text-decoration: none;
}
.ihcf-root.ihcf-root h2,
.ihcf-root.ihcf-root h3 {
  margin: 0;
  font: inherit;
  color: inherit;
  letter-spacing: normal;
}
.ihcf-root.ihcf-root p {
  margin: 0;
}
.ihcf-root.ihcf-root svg {
  display: inline-block;
  vertical-align: middle;
}

/* ------------------------------------------------------------ fókuszgyűrű */

.ihcf-root.ihcf-root .ihcf-opt:focus-visible,
.ihcf-root.ihcf-root .ihcf-btn:focus-visible,
.ihcf-root.ihcf-root .ihcf-textlink:focus-visible,
.ihcf-root.ihcf-root.ihcf-textlink:focus-visible {
  outline: 3px solid var(--ihcf-primary);
  outline-offset: 3px;
}

/* ----------------------------------------------------------------- shell */

.ihcf-root.ihcf-root .ihcf-panel {
  display: flex;
  flex-direction: column;
  gap: 28px;
  width: 100%;
  padding: 40px 40px 44px;
  background: #fff;
  border-radius: var(--ihcf-radius-card);
}
.ihcf-root.ihcf-root .ihcf-panel.is-offer {
  max-width: 600px;
}
.ihcf-root.ihcf-root .ihcf-panel.is-wide {
  max-width: 1020px;
  padding: 48px 44px;
}

/* ------------------------------------------------------ beágyazott blokk

   A választó az oldal folyamában jelenik meg: balra a szöveg, jobbra a
   választó. 900px alatt egymás alá kerülnek. */

.ihcf-root.ihcf-root.ihcf-block {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  /* Felülre igazítva: a jobb oldali panel képernyőnként más magas, és
     középre igazítva minden lépésnél elmozdulna a bal oldali szöveg. */
  align-items: start;
  gap: clamp(32px, 4vw, 64px);
  width: 100%;
}
/* A szöveg a panel magasságához képest függőlegesen középen. */
.ihcf-root.ihcf-root .ihcf-block__text {
  align-self: center;
}
/* style="embed" — csak a választó, szöveg nélkül. */
.ihcf-root.ihcf-root.ihcf-block--bare {
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
}
.ihcf-root.ihcf-root .ihcf-block__title {
  margin: 0 0 16px;
  font-family: var(--ihcf-font);
  font-size: clamp(28px, 3.2vw, 40px);
  font-weight: 700;
  line-height: 1.18;
  color: var(--ihcf-ink);
  text-wrap: balance;
}
.ihcf-root.ihcf-root .ihcf-block__lead {
  margin: 0;
  font-size: 17px;
  line-height: 1.6;
  color: var(--ihcf-muted);
}

/* A beágyazott panel nem lebeg: nincs magasságkorlát és görgetés, viszont
   kap egy finom keretet, hogy fehér háttéren is kártyaként olvasódjon. */
.ihcf-root.ihcf-root .ihcf-panel.is-inline {
  /* Kitölti a rácsoszlopot — így fér el három kártya egymás mellett. */
  max-width: 100%;
  max-height: none;
  overflow: visible;
  transform: none;
  /* A képernyők eltérő magasságúak; enélkül a blokk minden lépésnél
     ugrálna, és alatta az egész oldal elmozdulna. A legmagasabb a forma-
     és a nyelvkérdés: 6 opció három oszlopban = két sor. */
  min-height: 460px;
  gap: 22px;
  justify-content: flex-start;
  padding: 28px 28px 32px;
  border: 1px solid var(--ihcf-line);
  box-shadow: 0 2px 10px rgba(20, 22, 40, 0.04);
}

/* Hárman egy sorban. A kártya belseje szűk, ezért kisebb margó és
   betűméret. */
.ihcf-root.ihcf-root .ihcf-panel.is-inline .ihcf-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
/* Kevesebb válasz esetén a kártyák kitöltik a sort, nem marad üres hely. */
.ihcf-root.ihcf-root .ihcf-panel.is-inline .ihcf-grid.is-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ihcf-root.ihcf-root .ihcf-panel.is-inline .ihcf-grid.is-1 {
  grid-template-columns: minmax(0, 1fr);
}
.ihcf-root.ihcf-root .ihcf-panel.is-inline .ihcf-opt {
  padding: 14px 12px;
  gap: 10px;
  font-size: 13px;
  line-height: 1.3;
  /* Nincs automatikus elválasztás: a magyar szótár olyan szavakat is
     elvágott, amik amúgy kifértek volna (Nyelvvizsgáz-ni,
     fejleszté-séhez). A szavak szóköznél törnek; ha egy szó mégsem
     férne ki, az overflow-wrap töri — de az csak végszükség. */
  hyphens: manual;
  overflow-wrap: break-word;
}
.ihcf-root.ihcf-root .ihcf-panel.is-inline .ihcf-opt__icon {
  width: 40px;
  height: 40px;
}
.ihcf-root.ihcf-root .ihcf-panel.is-inline .ihcf-opt__icon svg {
  width: 21px;
  height: 21px;
}
.ihcf-root.ihcf-root .ihcf-panel.is-inline .ihcf-choices {
  grid-template-columns: minmax(0, 1fr);
}
.ihcf-root.ihcf-root .ihcf-panel.is-inline .ihcf-choice + .ihcf-choice {
  border-left: 0;
  border-top: 1px solid var(--ihcf-line);
}
/* Beágyazva a széles (ajánlat) képernyő sem lóghat ki az oszlopból. */
.ihcf-root.ihcf-root .ihcf-panel.is-inline.is-wide,
.ihcf-root.ihcf-root .ihcf-panel.is-inline.is-offer {
  max-width: 100%;
  padding: 28px 28px 32px;
}

@media (max-width: 900px) {
  .ihcf-root.ihcf-root.ihcf-block {
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
    justify-items: center;
    /* Oszlopos elrendezésben a blokk a fölötte és alatta lévő tartalomhoz
       tapadna — ezért kap saját függőleges eltartást. */
    padding-block: 36px;
  }
}
/* Keskenyebb oszlopban két kártya fér el rendesen, telefonon egy. */
@media (max-width: 760px) {
  .ihcf-root.ihcf-root .ihcf-panel.is-inline .ihcf-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 360px) {
  .ihcf-root.ihcf-root .ihcf-panel.is-inline .ihcf-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 640px) {
  .ihcf-root.ihcf-root .ihcf-panel.is-inline,
  .ihcf-root.ihcf-root .ihcf-panel.is-inline.is-wide,
  .ihcf-root.ihcf-root .ihcf-panel.is-inline.is-offer {
    min-height: 0;
    padding: 24px 18px 28px;
  }
  .ihcf-root.ihcf-root .ihcf-panel.is-inline .ihcf-opt {
    font-size: 14px;
  }
}

/* brand stripe */
.ihcf-root.ihcf-root .ihcf-brandbar {
  /* A Figma szerint: 8 x 27,5 px szegmens, 6 px magas, szögletes. */
  display: flex;
  align-self: center;
  width: 220px;
  height: 6px;
}
.ihcf-root.ihcf-root .ihcf-brandbar i {
  flex: 1 1 0;
}

.ihcf-root.ihcf-root .ihcf-toprow {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 22px;
}
/* A pöttyök és a lépésjelző egy csoport, mindig a sor jobb szélén — akkor
   is, ha a vissza gomb nem látszik. */
.ihcf-root.ihcf-root .ihcf-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}
.ihcf-root.ihcf-root .ihcf-meta .ihcf-eyebrow {
  white-space: nowrap;
}
.ihcf-root.ihcf-root .ihcf-dots {
  display: flex;
  gap: 7px;
}
.ihcf-root.ihcf-root .ihcf-dots i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #d8dbe8;
  transition: background-color 0.2s ease;
}
.ihcf-root.ihcf-root .ihcf-dots i.is-on {
  background: var(--ihcf-primary);
}

/* ------------------------------------------------------------- header */

.ihcf-root.ihcf-root .ihcf-head {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ihcf-root.ihcf-root .ihcf-head.is-center {
  text-align: center;
  align-items: center;
}
.ihcf-root.ihcf-root .ihcf-eyebrow {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ihcf-primary);
}
.ihcf-root.ihcf-root .ihcf-title {
  margin: 0;
  font-family: var(--ihcf-font);
  font-size: 24px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--ihcf-ink);
  text-wrap: balance;
}
.ihcf-root.ihcf-root .ihcf-lead {
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: var(--ihcf-muted);
}
.ihcf-root.ihcf-root .ihcf-head.is-center .ihcf-lead {
  max-width: 44ch;
}

/* ------------------------------------------------------- option cards */

.ihcf-root.ihcf-root .ihcf-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.ihcf-root.ihcf-root .ihcf-grid.is-single {
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

.ihcf-root.ihcf-root .ihcf-opt {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  padding: 18px 16px;
  text-align: left;
  background: var(--ihcf-ground);
  border: 1px solid var(--ihcf-line);
  border-radius: var(--ihcf-radius-opt);
  color: var(--ihcf-text);
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  cursor: pointer;
  transition: border-color 0.16s ease, background-color 0.16s ease;
}
.ihcf-root.ihcf-root .ihcf-opt:hover {
  border-color: var(--ihcf-primary);
  background: #fff;
}
.ihcf-root.ihcf-root .ihcf-opt.is-selected {
  border-color: var(--ihcf-primary);
  background: var(--ihcf-soft);
}
/*
 * Ikonnégyzet. Az ihbudapest.hu kártyáin a sarokban ülő jelvény mintájára:
 * 45x45 px, 8 px sarok, tömör márkaszín, fehér ikon. A négy szín a válaszok
 * sorrendjében forog (lásd a konfiguráció iconColors mezőjét).
 */
.ihcf-root.ihcf-root .ihcf-opt__icon,
.ihcf-root.ihcf-root .ihcf-choice__icon {
  width: 45px;
  height: 45px;
  flex: none;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: var(--ihcf-c-coral);
  color: #fff;
  line-height: 0;
}
.ihcf-root.ihcf-root .ihcf-opt__icon.is-coral,
.ihcf-root.ihcf-root .ihcf-choice__icon.is-coral { background: var(--ihcf-c-coral); }
.ihcf-root.ihcf-root .ihcf-opt__icon.is-green,
.ihcf-root.ihcf-root .ihcf-choice__icon.is-green { background: var(--ihcf-c-green); }
.ihcf-root.ihcf-root .ihcf-opt__icon.is-orange,
.ihcf-root.ihcf-root .ihcf-choice__icon.is-orange { background: var(--ihcf-c-orange); }
.ihcf-root.ihcf-root .ihcf-opt__icon.is-purple,
.ihcf-root.ihcf-root .ihcf-choice__icon.is-purple { background: var(--ihcf-c-purple); }

.ihcf-root.ihcf-root .ihcf-opt__icon.is-piros,
.ihcf-root.ihcf-root .ihcf-choice__icon.is-piros { background: var(--ihcf-b-piros); }
.ihcf-root.ihcf-root .ihcf-opt__icon.is-rozsa,
.ihcf-root.ihcf-root .ihcf-choice__icon.is-rozsa { background: var(--ihcf-b-rozsa); }
.ihcf-root.ihcf-root .ihcf-opt__icon.is-bordo,
.ihcf-root.ihcf-root .ihcf-choice__icon.is-bordo { background: var(--ihcf-b-bordo); }
.ihcf-root.ihcf-root .ihcf-opt__icon.is-indigo,
.ihcf-root.ihcf-root .ihcf-choice__icon.is-indigo { background: var(--ihcf-b-indigo); }
.ihcf-root.ihcf-root .ihcf-opt__icon.is-zold,
.ihcf-root.ihcf-root .ihcf-choice__icon.is-zold { background: var(--ihcf-b-zold); }
.ihcf-root.ihcf-root .ihcf-opt__icon.is-narancs,
.ihcf-root.ihcf-root .ihcf-choice__icon.is-narancs { background: var(--ihcf-b-narancs); }

/* Az ikonok 24×24-es SVG-k, 2-es vonalvastagsággal — mint az oldal sajátjai. */
.ihcf-root.ihcf-root .ihcf-opt__icon svg {
  display: block;
  width: 23px;
  height: 23px;
}
.ihcf-root.ihcf-root .ihcf-info__icon svg {
  width: 26px;
  height: 26px;
}
.ihcf-root.ihcf-root .ihcf-choice__icon svg {
  display: block;
  width: 23px;
  height: 23px;
}
.ihcf-root.ihcf-root .ihcf-btn__arrow {
  display: inline-flex;
  line-height: 0;
}
.ihcf-root.ihcf-root .ihcf-btn__arrow svg {
  width: 17px;
  height: 17px;
}
.ihcf-root.ihcf-root .ihcf-check svg {
  width: 34px;
  height: 34px;
}
.ihcf-root.ihcf-root .ihcf-opt__label {
  display: block;
  text-wrap: balance;
}
.ihcf-root.ihcf-root .ihcf-opt__note {
  display: block;
  margin-top: 2px;
  font-size: 13px;
  font-weight: 400;
  color: var(--ihcf-muted);
}

/* radio-sor a szintfelmérőhöz */
.ihcf-root.ihcf-root .ihcf-radio {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  font-size: 15px;
  font-weight: 600;
}
.ihcf-root.ihcf-root .ihcf-radio__dot {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  border: 2px solid #c9cee3;
  border-radius: 50%;
  background: #fff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.ihcf-root.ihcf-root .ihcf-radio:hover .ihcf-radio__dot {
  border-color: var(--ihcf-primary);
  box-shadow: inset 0 0 0 3px #fff, inset 0 0 0 10px var(--ihcf-primary);
}

/* ------------------------------------------------------------ buttons */

.ihcf-root.ihcf-root .ihcf-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 17px 26px;
  border: 1.5px solid transparent;
  border-radius: var(--ihcf-radius-opt);
  background: var(--ihcf-primary);
  color: #fff;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}
.ihcf-root.ihcf-root .ihcf-btn:hover {
  background: var(--ihcf-primary-hover);
  color: #fff;
}
.ihcf-root.ihcf-root .ihcf-btn--ghost {
  background: #fff;
  border-color: var(--ihcf-primary);
  color: var(--ihcf-primary);
}
.ihcf-root.ihcf-root .ihcf-btn--ghost:hover {
  background: var(--ihcf-soft);
  color: var(--ihcf-primary);
}
.ihcf-root.ihcf-root .ihcf-btn--block {
  width: 100%;
}
.ihcf-root.ihcf-root .ihcf-btnrow {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

/* -------------------------------------------------------- info stripe */

.ihcf-root.ihcf-root .ihcf-info {
  display: flex;
  align-items: center;
  gap: 16px;
}
.ihcf-root.ihcf-root .ihcf-info__icon {
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  border-radius: var(--ihcf-radius-opt);
  background: var(--ihcf-soft);
  color: var(--ihcf-primary);
}
.ihcf-root.ihcf-root .ihcf-info__title {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--ihcf-text);
}
.ihcf-root.ihcf-root .ihcf-info__note {
  margin: 2px 0 0;
  font-size: 14px;
  color: var(--ihcf-muted);
}

/* --------------------------------------------------------- level meter */

.ihcf-root.ihcf-root .ihcf-badge {
  align-self: flex-start;
  padding: 12px 22px;
  border-radius: 999px;
  background: var(--ihcf-soft);
  color: var(--ihcf-primary);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
}

.ihcf-root.ihcf-root .ihcf-meter {
  display: grid;
  gap: 10px 8px;
}
.ihcf-root.ihcf-root .ihcf-meter__bars,
.ihcf-root.ihcf-root .ihcf-meter__labels {
  display: grid;
  grid-template-columns: inherit;
  gap: 8px;
}
.ihcf-root.ihcf-root .ihcf-meter__bar {
  height: 6px;
  border-radius: 3px;
  background: var(--ihcf-soft);
}
.ihcf-root.ihcf-root .ihcf-meter__bar.is-on {
  background: var(--ihcf-primary);
}
.ihcf-root.ihcf-root .ihcf-meter__label {
  font-size: 13px;
  font-weight: 700;
  color: var(--ihcf-faint);
  text-align: center;
}
.ihcf-root.ihcf-root .ihcf-meter__label.is-on {
  color: var(--ihcf-text);
}

/* --------------------------------------------------------- choice cards */

/* A tervben a két választókártya egy közös keretben ül, függőleges
   elválasztóval — nem két külön doboz. */
.ihcf-root.ihcf-root .ihcf-choices {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid var(--ihcf-line);
  border-radius: var(--ihcf-radius-box);
  overflow: hidden;
}
.ihcf-root.ihcf-root .ihcf-choice {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 28px;
  background: #fff;
}
.ihcf-root.ihcf-root .ihcf-choice + .ihcf-choice {
  border-left: 1px solid var(--ihcf-line);
}
/* A kimeneti kártyák ikonja ugyanaz a jelvény — a színt a `tone` adja. */
.ihcf-root.ihcf-root .ihcf-choice__title {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--ihcf-ink);
}
.ihcf-root.ihcf-root .ihcf-choice__desc {
  margin: 0;
  flex: 1 1 auto;
  font-size: 14px;
  line-height: 1.55;
  color: var(--ihcf-muted);
}
.ihcf-root.ihcf-root .ihcf-choice hr {
  width: 100%;
  height: 1px;
  margin: 0;
  border: 0;
  background: var(--ihcf-line);
}

/* ----------------------------------------------------------- course row */

.ihcf-root.ihcf-root .ihcf-course {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  padding: 20px;
  background: var(--ihcf-ground);
  border: 1px solid var(--ihcf-line);
  border-radius: var(--ihcf-radius-box);
}
.ihcf-root.ihcf-root .ihcf-course__tag {
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--ihcf-soft);
  color: var(--ihcf-primary);
  font-size: 13px;
  font-weight: 700;
}
.ihcf-root.ihcf-root .ihcf-course__body {
  flex: 1 1 200px;
  min-width: 0;
}
.ihcf-root.ihcf-root .ihcf-course__title {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--ihcf-ink);
}
.ihcf-root.ihcf-root .ihcf-course__meta {
  margin: 4px 0 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ihcf-muted);
}

/* --------------------------------------------------------------- űrlap */

.ihcf-root.ihcf-root .ihcf-form {
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.ihcf-root.ihcf-root .ihcf-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ihcf-root.ihcf-root .ihcf-field label {
  font-size: 15px;
  font-weight: 700;
  color: var(--ihcf-text);
}
.ihcf-root.ihcf-root .ihcf-field input {
  width: 100%;
  padding: 17px 18px;
  background: var(--ihcf-ground);
  border: 1.5px solid transparent;
  border-radius: var(--ihcf-radius-opt);
  color: var(--ihcf-text);
  font: inherit;
  font-size: 15px;
  line-height: 1.3;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}
.ihcf-root.ihcf-root .ihcf-field input::placeholder {
  color: var(--ihcf-faint);
}
.ihcf-root.ihcf-root .ihcf-field input:focus {
  outline: none;
  background: #fff;
  border-color: var(--ihcf-primary);
}
.ihcf-root.ihcf-root .ihcf-field input[aria-invalid="true"] {
  border-color: var(--ihcf-error);
  background: #fff;
}
.ihcf-root.ihcf-root .ihcf-error {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--ihcf-error);
}

.ihcf-root.ihcf-root .ihcf-consent {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ihcf-text);
  cursor: pointer;
}
.ihcf-root.ihcf-root .ihcf-consent input {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin: 1px 0 0;
  accent-color: var(--ihcf-primary);
  cursor: pointer;
}
.ihcf-root.ihcf-root .ihcf-consent a {
  color: var(--ihcf-primary);
  text-underline-offset: 2px;
}

/* ------------------------------------------------------- próbaóra sávok */

.ihcf-root.ihcf-root .ihcf-slots {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ihcf-root.ihcf-root .ihcf-slot {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 16px 18px;
  text-align: left;
  background: var(--ihcf-ground);
  border: 1.5px solid transparent;
  border-radius: var(--ihcf-radius-opt);
  color: var(--ihcf-text);
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}
.ihcf-root.ihcf-root .ihcf-slot:hover {
  border-color: var(--ihcf-primary);
}
.ihcf-root.ihcf-root .ihcf-slot.is-selected {
  background: #eef1fc;
  border-color: var(--ihcf-primary);
}
.ihcf-root.ihcf-root .ihcf-slot__dot {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  border: 2px solid #c9cee3;
  border-radius: 50%;
  background: #fff;
}
.ihcf-root.ihcf-root .ihcf-slot.is-selected .ihcf-slot__dot {
  border-color: var(--ihcf-primary);
  box-shadow: inset 0 0 0 3px #fff, inset 0 0 0 10px var(--ihcf-primary);
}

/* --------------------------------------------------------------- check */

.ihcf-root.ihcf-root .ihcf-check {
  align-self: center;
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--ihcf-green-soft);
  color: var(--ihcf-green);
}

/* -------------------------------------------------------------- footer */

.ihcf-root.ihcf-root .ihcf-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.ihcf-root.ihcf-root .ihcf-back {
  padding: 0;
  border: 0;
  background: none;
  color: var(--ihcf-primary);
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}
.ihcf-root.ihcf-root .ihcf-back:hover {
  text-decoration: underline;
}
.ihcf-root.ihcf-root .ihcf-hint {
  margin: 0;
  margin-left: auto;
  font-size: 13px;
  color: var(--ihcf-faint);
}
.ihcf-root.ihcf-root .ihcf-textlink,
.ihcf-root.ihcf-root.ihcf-textlink {
  display: inline-block;
  cursor: pointer;
  color: var(--ihcf-primary);
  font-size: 14px;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ---------------------------------------------------------- responsive */

@media (max-width: 900px) {
  .ihcf-root.ihcf-root .ihcf-choices {
    grid-template-columns: minmax(0, 1fr);
  }
  .ihcf-root.ihcf-root .ihcf-choice + .ihcf-choice {
    border-left: 0;
    border-top: 1px solid var(--ihcf-line);
  }
  .ihcf-root.ihcf-root .ihcf-panel.is-wide {
    padding: 32px 20px 36px;
  }
}

@media (max-width: 640px) {
  .ihcf-root.ihcf-root .ihcf-panel {
    gap: 22px;
    padding: 32px 20px 36px;
  }
  .ihcf-root.ihcf-root .ihcf-grid,
  .ihcf-root.ihcf-root .ihcf-btnrow {
    grid-template-columns: minmax(0, 1fr);
  }
  .ihcf-root.ihcf-root .ihcf-title {
    font-size: 21px;
  }
  .ihcf-root.ihcf-root .ihcf-badge {
    font-size: 16px;
  }
  .ihcf-root.ihcf-root .ihcf-meter__label {
    font-size: 11px;
  }
  .ihcf-root.ihcf-root .ihcf-course__tag {
    order: -1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ihcf-root.ihcf-root *,
  .ihcf-root.ihcf-root .ihcf-panel {
    transition-duration: 0.01ms !important;
  }
}

/* Több gomb egymás alatt az ajánlat képernyőn (gyerekes ág). */
.ihcf-root.ihcf-root .ihcf-actions {
  display: grid;
  gap: 10px;
}
