/*
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
*/
/* FONTOS: a fenti WordPress-fejlec komment MOST MAR resze ennek a
   fajlnak, KIFEJEZETTEN azert, hogy a teljes style.css tartalma
   1:1 lecserelheto legyen innen, kulon kezi "fejlec megorzese"
   lepes nelkul - lasd egyeztetes, 2026-07-24. Ha ez a fajl valaha
   uj projekt alapjakent szolgalna (nem csak Mikroszunet-nek), ezt
   a blokkot at kell irni az adott projekt sajat gyermek-temajanak
   fejlecere. */

/* ============================================================
   MIKROSZUNET.HU - CORE CSS
   A jovahagyott specifikacio alapjan (Mikroszunet_hu_fooldal_CSS_sablon_
   specifikacio_v1_0.docx + V1.1 modositasi javaslatok).
   FONTOS KULONBSEG a SITE_MODUL_SABLON rendszerhez kepest: itt a szinek
   MAR VEGLEGESEK, joviahagyottak - nem placeholder ertekek, nincs
   projektenkenti csere-logika (04_SZINALLITASI_UTMUTATO a site-
   rendszerben ezert nincs itt megfeleloje ilyen ertelemben - lasd
   05-os fajl helyette, ami mar kesz ertekeket dokumental).
   ============================================================ */

html,
body{
  max-width:100%;
  overflow-x:hidden;
}

:root{
  /* hatterek */
  --ms-bg:#FBFAF7;
  --ms-surface:#FFFFFF;
  --ms-surface-soft:#F5F6F1;

  /* szoveg */
  --ms-text:#243247;
  --ms-text-muted:#68717D;

  /* szegely */
  --ms-line:#E7E8E2;

  /* zsalya (nyugodt, szakmai alapkarakter) */
  --ms-sage:#7D8B66;
  --ms-sage-dark:#5F6F4E;
  --ms-sage-soft:#EEF1E8;

  /* arany (CTA, navigacios/interakcios akcens) */
  --ms-gold:#B68A2A;
  --ms-gold-hover:#96721F; /* kulon, tudatosan valasztott sotetebb tonus -
    NEM automatikus CSS filter/brightness, lasd site- rendszer 04-es
    fajl "Hover szin" szabalya, ugyanaz az elv ervenyes itt is */
  --ms-gold-soft:#F5EEDC;

  /* bordó (KIZAROLAG a jobb oldali gondolatsav idezet-kartyajahoz -
     lasd specifikacio: "nem altalanos kartyaszin") */
  --ms-burgundy:#5B1426;
  --ms-burgundy-dark:#35101B;
  --ms-burgundy-soft:#F4E9EC;
  --ms-text-on-burgundy:#F7F1E6;
  --ms-muted-on-burgundy:#D9C4B0;

  /* lekerekites + arnyek */
  --ms-radius-sm:10px;
  --ms-radius-md:16px;
  --ms-radius-lg:22px;
  --ms-shadow-card:0 12px 32px rgba(36,50,71,.07);

  /* elrendezes */
  --ms-container:1480px;
  --ms-inset:clamp(20px, 4vw, 64px);

  /* tipografia - serif kijelzo-cim + sans torzsszoveg parositas */
  --ms-font-display:"Cormorant Garamond","Georgia",serif;
  --ms-font-body:"Inter","Aptos","Segoe UI",sans-serif;
}

/* MEGJEGYZES A KONTRASZTRÓL: a --ms-gold kozepesen vilagos tonus - az
   ms-btn-primary alant grafit (--ms-text) szoveget hasznal rajta, NEM
   feherét, mert igy biztosabb a WCAG AA kontraszt. Elesites elott
   MINDENKEPP futtass le egy kontraszt-ellenorzest (lasd 05-os fajl),
   ugyanugy, ahogy a site- rendszer 04-es fajlja is kotelezove teszi uj
   szin bevezetesekor. */


/* ============================================================
   ALAP / VAZ
   ============================================================ */

.ms-home,
.ms-home *{
  box-sizing:border-box;
  font-family:var(--ms-font-body);
}
.ms-home{
  background:var(--ms-bg);
  color:var(--ms-text);
}

.ms-container{
  width:100%!important;
  max-width:var(--ms-container)!important;
  margin:0 auto!important;
  padding:0 var(--ms-inset)!important;
}


/* ============================================================
   FEJLEC
   ============================================================ */

/* GRID-ALAPU FEJLEC (2026-07-24, a Flexbox-os valtozat tobbszori
   megbizhatatlansaga utani dontes): 3 elore rogzitett oszlop - logo
   (auto = csak a sajat tartalma szerinti szelesseg), menu (1fr = a
   maradek hely), gombok (auto). A Grid NEM "probalgatja" a novekedest/
   zsugorodast tobb egymasra hato tenyezobol, mint a Flexbox space-
   between - elore kijelolt oszlopok, kiszamithato viselkedes. Igy MAR
   NEM SZAMIT, hogy az Elementor "Irany" panel-beallitasa mit mutat a
   legkulso dobozon - a Grid felulirja azt is. */
.ms-header{
  position:sticky!important;
  top:0!important;
  z-index:100!important;
  min-height:80px!important;
  display:grid!important;
  grid-template-columns:auto 1fr auto!important;
  align-items:center!important;
  column-gap:20px!important;
  padding:0 var(--ms-inset)!important;
  background:rgba(255,255,255,.94)!important;
  -webkit-backdrop-filter:blur(14px)!important;
  backdrop-filter:blur(14px)!important;
  border-bottom:1px solid var(--ms-line)!important;
}

/* A logo+alcim csoport ES a kereso+gomb csoport NE zsugorodjon/csusszon
   ossze, csak a menu tordjon szukseg eseten - ket kulon strukturalis
   osztaly a ket "szelso" csoportra (lasd 06-os fajl frissitese).
   ALIGN-ITEMS:FLEX-START KOTELEZO az ms-header-brand-on: fuggoleges (↓)
   Flexbox alapertelmezett viselkedese, hogy a benne levo elemeket
   TELJES SZELESSEGRE NYUJTJA (ugyanaz az elv, mint a CSS Grid "stretch"
   hibaja mas moduloknal, csak ez a Flexbox-os valtozata) - enelkul a
   logo/alcim widget a teljes fejlec-szelesseget probalja kitolteni. */
.ms-header-brand{
  display:flex!important;
  flex-direction:row!important;
  align-items:flex-start!important;
}
.ms-header-actions{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:14px!important;
}

.ms-header-logo,
.ms-header-logo .elementor-heading-title{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:8px!important;
  width:auto!important;
  align-self:flex-start!important;
  font-weight:800!important;
  font-size:17px!important;
  color:var(--ms-text)!important;
  margin:0!important;
}
.ms-header-logo img{
  height:36px!important;
  width:auto!important;
  max-width:none!important;
  display:block!important;
}
.ms-header-tagline,
.ms-header-tagline p{
  width:auto!important;
  align-self:flex-start!important;
  font-size:11.5px!important;
  color:var(--ms-text-muted)!important;
  margin:0!important;
}

.ms-header-nav{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:26px!important;
  min-width:0!important; /* Grid-elemeknek is van alapertelmezett
    min-width:auto viselkedesuk (a tartalom szerint), ez ugyanugy
    kell Gridnel is, mint korabban Flexboxnal - enelkul nem tudna
    zsugorodni/tordni, ha a tartalma szelesebb az oszlopnal. */
  justify-content:center!important;
}
/* Az Elementor Nav Menu widget a tenyleges <ul><li> listat egy BELJEBB
   levo elemre teszi, nem kozvetlenul az ms-header-nav osztalyra - ezert
   kell KULON, tag-szelektoros szabaly a belso ul/li-re is (nem eleg csak
   a kulso dobozt flex-re allitani). Ugyanaz az elv, mint a site-service-
   card h3/p/a tag-szelektoros pelda a site- rendszerben.
   FLEX-WRAP:WRAP (nem nowrap!) - ha nem fer ki mind a 6 menupont egy
   sorban, inkabb tordjon ket sorba, mint hogy ratolodjon/atfedje a
   szomszedos elemeket (ez okozta a korabbi egymasra-csuszast). */
.ms-header-nav ul{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px 22px!important;
  list-style:none!important;
  margin:0!important;
  padding:0!important;
  flex-wrap:wrap!important;
}
.ms-header-nav li{
  margin:0!important;
  padding:0!important;
  width:auto!important;
  flex:0 0 auto!important;
  list-style:none!important;
}
.ms-header-nav a,
.ms-header-nav a:visited{
  color:var(--ms-text)!important;
  font-size:13px!important;
  font-weight:650!important;
  letter-spacing:.01em!important;
  text-decoration:none!important;
  white-space:nowrap!important;
}
.ms-header-nav a:hover,
.ms-header-nav a:focus,
.ms-header-nav a.elementor-item-active{
  color:var(--ms-sage-dark)!important;
}
.ms-header-nav a::before,
.ms-header-nav a::after{
  background:none!important;
  border:none!important;
  content:none!important;
}

.ms-header-search{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:38px!important;
  height:38px!important;
  border-radius:50%!important;
  background:var(--ms-surface-soft)!important;
  color:var(--ms-text)!important;
  overflow:hidden!important;
}
/* Ugyanaz az elv, mint a ms-header-nav-nal: a tenyleges ikon (SVG vagy
   ikon-betutipus) egy belso elemre kerul, kulon meretezni kell.
   ELESBEN MEGERoSITVE (2026-07-24): az Elementor Icon widgetnek van
   egy SAJAT, GLOBALIS szin-szabalya
   (".elementor-widget-icon.elementor-view-default .elementor-icon svg
   {fill:var(--e-global-color-primary)}"), aminek nagyobb a CSS-
   specificitasa (3 osztaly), mint egy egyszeru ".ms-header-search
   svg"-nek (1 osztaly) - EZERT KELL a ".elementor-icon" koztes
   osztalyt is beleirni a szelektorba, hogy a specificitasunk
   biztosan nyerjen. Ugyanez a mintazat kell MINDEN uj Icon widget-
   szinezesnel a projektben. */
.ms-header-search svg,
.ms-header-search i,
.ms-header-search .elementor-icon svg{
  width:16px!important;
  height:16px!important;
  font-size:16px!important;
  fill:var(--ms-text)!important;
  color:var(--ms-text)!important;
}

/* "MAI KOCKA" fejlec-gomb (specifikacio: ".header-cta") - arany kereteses
   variansa a ms-btn-outline-nak, sajat osztallyal, mert ez mindig arany
   szinu keretet kap, nem zsalyat, mint a tobbi outline gomb */
.ms-header-cta,
.ms-header-cta a.elementor-button{
  border:1px solid var(--ms-gold)!important;
  color:var(--ms-gold)!important;
  background:transparent!important;
}
.ms-header-cta:hover,
.ms-header-cta a.elementor-button:hover{
  background:var(--ms-gold-soft)!important;
}


/* ============================================================
   TIPOGRAFIA
   ============================================================ */

.ms-eyebrow,
.ms-eyebrow .elementor-heading-title{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  margin:0 0 6px!important;
  color:var(--ms-sage-dark)!important;
  font-family:var(--ms-font-body)!important;
  font-size:11px!important;
  font-weight:700!important;
  letter-spacing:.07em!important;
  text-transform:uppercase!important;
}
.ms-eyebrow.is-gold,
.ms-eyebrow.is-gold .elementor-heading-title{color:var(--ms-gold)!important;}

.ms-title-display,
.ms-title-display .elementor-heading-title{
  margin:0 0 8px!important;
  color:var(--ms-text)!important;
  font-family:var(--ms-font-display)!important;
  font-weight:600!important;
  font-size:clamp(28px,2.6vw,40px)!important;
  line-height:1.15!important;
  text-wrap:balance;
}

.ms-lead,
.ms-lead p{
  max-width:56ch!important;
  margin:0 0 28px!important;
  color:var(--ms-text-muted)!important;
  font-size:17px!important;
  line-height:1.6!important;
}

.ms-text,
.ms-text p,
.ms-text li{
  color:var(--ms-text-muted)!important;
  font-size:15.5px!important;
  line-height:1.65!important;
}

.ms-meta{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:10px!important;
  font-size:12px!important;
  color:var(--ms-text-muted)!important;
}


/* ============================================================
   HERO
   ============================================================ */

/* JAVITVA (2026-07-24) - a hero NEM ketoszlopos (szoveg | kulon kep-
   doboz), hanem EGYETLEN, TELJES SZELESSEGU foto felett all a szoveg,
   balra-feheredo gradienssel - a latvanyterv (latvany.png) pontos
   ujraellenorzese utan derult ki, hogy a korabbi ketoszlopos Grid-
   valtozat rosszul ertelmezte a mockupot. Az ms-hero maga a POZICIONALO
   kontener (position:relative), az ms-hero-media EGY TELJES, ABSZOLUT
   POZICIOJU HATTERRETEG (inset:0), a szoveg pedig kulon, "elorebb"
   reteg (z-index) ugyanabban a dobozban - NEM ket egymas melletti
   oszlop. */
.ms-hero{
  position:relative!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  padding:48px var(--ms-inset)!important;
  min-height:460px!important;
  overflow:hidden!important;
}

.ms-hero-content{
  position:relative!important;
  z-index:1!important;
  max-width:560px!important;
  width:auto!important;
}

.ms-hero-title,
.ms-hero-title .elementor-heading-title{
  margin:0 0 20px!important;
  color:var(--ms-text)!important;
  font-family:var(--ms-font-display)!important;
  font-weight:600!important;
  font-size:clamp(38px,4.5vw,64px)!important;
  line-height:1.08!important;
  text-wrap:balance;
}

/* Teljes, hatterkent futo foto-reteg - NEM oszlop, hanem a teljes
   ms-hero dobozt kitolto, abszolut pozicionalt kep */
.ms-hero-media{
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  overflow:hidden!important;
}
/* Elementor minden widgetet sajat, position:relative dobozba csomagol
   (.elementor-widget-image, .elementor-widget-html stb.) - ez a doboz
   flex-elemkent 0 szelessegre esik ossze, mert egyetlen tartalma
   (a mi position:absolute kepunk/SVG-nk) nem ad neki meretet. Ezert
   ezt a kozteS dobozt is teljes meretüre + abszolut pozicioba kell
   tenni, kulonben a benne levo width:100%/top %/right % ehhez a
   0x0-s dobozhoz, nem a ms-hero-media-hoz viszonyul. */
.ms-hero-media > .elementor-widget{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
}
.ms-hero-media img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:78% center!important;
  display:block!important;
}
/* Balra-feheredo gradiens - ez teszi olvashatova a szoveget a foto
   felett, jobb oldalt szabadon hagyva a foto latvanyat (lasd
   specifikacio: "jobboldali fókusz; lágy, balra fehéredő gradient") */
.ms-hero-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,
    var(--ms-bg) 0%,
    var(--ms-bg) 22%,
    rgba(251,250,247,.88) 38%,
    rgba(251,250,247,.35) 55%,
    transparent 72%);
  pointer-events:none;
}

.ms-hero-cube{
  position:absolute!important;
  top:18%!important;
  right:20%!important;
  width:110px!important;
  height:110px!important;
  z-index:1!important;
  animation:ms-cube-float 26s ease-in-out infinite!important;
}
.ms-hero-cube svg{width:100%!important;height:100%!important;display:block!important;}
@keyframes ms-cube-float{
  0%,100%{transform:translateY(0) rotate(0deg);}
  50%{transform:translateY(-10px) rotate(4deg);}
}
@media (prefers-reduced-motion:reduce){
  .ms-hero-cube{animation:none!important;}
}


/* ============================================================
   GOMBOK
   ============================================================ */

.ms-btn-primary,
.ms-btn-outline{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:13px 24px;
  border-radius:var(--ms-radius-sm);
  font-family:var(--ms-font-body);
  font-weight:700;
  font-size:14.5px;
  text-decoration:none;
  border:none;
  cursor:pointer;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.ms-btn-primary{background:var(--ms-gold);color:var(--ms-text);}
.ms-btn-primary:hover{background:var(--ms-gold-hover);}
.ms-btn-outline{background:transparent;color:var(--ms-text);border:1.5px solid var(--ms-sage);}
.ms-btn-outline:hover{border-color:var(--ms-sage-dark);color:var(--ms-sage-dark);}

/* Elementor Button widget harom retege - lasd site- rendszer 08-as fajl,
   12. pont ("gomb a gombban") - ugyanaz a mintazat kell itt is */
.ms-btn-primary.elementor-widget-button,
.ms-btn-outline.elementor-widget-button,
.ms-header-cta.elementor-widget-button{
  background:transparent!important;
  padding:0!important;
  display:inline-block!important;
}
.ms-btn-primary .elementor-button-content-wrapper,
.ms-btn-primary .elementor-button-text,
.ms-btn-outline .elementor-button-content-wrapper,
.ms-btn-outline .elementor-button-text,
.ms-header-cta .elementor-button-content-wrapper,
.ms-header-cta .elementor-button-text{
  padding:0!important;
  margin:0!important;
  width:auto!important;
  height:auto!important;
  max-width:none!important;
  min-height:0!important;
  background:transparent!important;
  border:none!important;
  box-sizing:border-box!important;
}
.ms-btn-primary a.elementor-button,
.ms-btn-outline a.elementor-button{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:48px!important;
  padding:13px 24px!important;
  margin:0!important;
  width:auto!important;
  height:auto!important;
  max-width:none!important;
  border-radius:var(--ms-radius-sm)!important;
  text-decoration:none!important;
  font-size:14.5px!important;
  font-weight:700!important;
  border:none!important;
  box-sizing:border-box!important;
}
.ms-btn-primary a.elementor-button{background:var(--ms-gold)!important;color:var(--ms-text)!important;}
.ms-btn-primary a.elementor-button:hover{background:var(--ms-gold-hover)!important;}
.ms-btn-outline a.elementor-button{background:transparent!important;color:var(--ms-text)!important;border:1.5px solid var(--ms-sage)!important;}
.ms-btn-outline a.elementor-button:hover{border-color:var(--ms-sage-dark)!important;color:var(--ms-sage-dark)!important;}

.ms-btn-primary:focus-visible,
.ms-btn-outline:focus-visible,
.ms-btn-primary a.elementor-button:focus-visible,
.ms-btn-outline a.elementor-button:focus-visible{
  outline:3px solid rgba(182,138,42,.45);
  outline-offset:2px;
}

.ms-btn-row{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;gap:14px!important;}
@media (max-width:560px){
  .ms-btn-row{flex-direction:column!important;}
  .ms-btn-row .ms-btn-primary a.elementor-button,
  .ms-btn-row .ms-btn-outline a.elementor-button{width:100%!important;}
}


/* ============================================================
   FOOLDAL VAZ - KETOSZLOPOS RACS + JOBB SAV
   ============================================================ */

.ms-homepage-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 340px!important;
  gap:36px!important;
  align-items:start!important;
  padding:0 var(--ms-inset)!important;
}
/* VISSZAALLITVA (2026-07-26): a 260px-es probaval a jobb sav lett tul
   szuk (a rail-card cimek/gombok ket sorba tordeltek) - a 340px az
   eredeti, mukodo ertek. A "Mai felismerések" kartyak tomorseget NEM
   a grid aranyaval, hanem a sajat parametereikkel (ikon/betumeret/
   padding a rail-card-hoz igazitva) oldjuk meg, azt mar megcsinaltuk. */
/* LEZART DONTES (2026-07-24): a specifikacio ket resze (nyers CSS-pelda
   vs. reszponziv tablazat) kozotti ellentmondast a tablazat javara
   dontottuk el, mert az reszletesebben vegiggondolt allapotot ir le:
   ≥1280px teljes ketoszlop (340px sav), 992-1279px kozott MEG MINDIG
   ketoszlopos, csak szukitett savval (300px), es CSAK 992px ALATT valik
   egyoszlopossa. Igy a sav a leheto leghosszabb ideig lathato marad
   ketoszlopos nezetben, mielott egyoszlopos mobil-elrendezesre valtana. */
@media (max-width:1279px) and (min-width:992px){
  .ms-homepage-grid{grid-template-columns:minmax(0,1fr) 300px!important;}
}
@media (max-width:991px){
  .ms-homepage-grid{grid-template-columns:1fr!important;}
}

.ms-insight-rail{
  position:sticky!important;
  top:104px!important;
  padding:24px 20px!important;
  background:var(--ms-gold-soft)!important;
  border-radius:var(--ms-radius-md)!important;
}
@media (max-width:991px){
  .ms-insight-rail{position:static!important;padding:20px!important;}
}

.ms-home-section{
  display:flex!important;
  flex-direction:column!important;
  margin:0 0 56px!important;
}
/* Erre az egesz CSS-re igaz: MINDEN .ms- Flexbox/Div block dobozra
   EXPLICIT flex-direction kell, nem szabad az Elementor panel
   valasztasara/alapertelmezesere bizni - lasd projekt-memoria,
   "flex-direction default trap" leckéje. */

.ms-section-head{
  display:flex!important;
  flex-direction:row!important;
  width:100%!important;
  align-items:baseline!important;
  justify-content:space-between!important;
  gap:20px!important;
  flex-wrap:wrap!important;
  margin:0 0 24px!important;
}
.ms-section-head .ms-title-display,
.ms-section-head .ms-title-display .elementor-heading-title{margin:0!important;}

/* KIS, KARTYA-SZINTU cim - NE az ms-title-display-t hasznald kartyakon
   belul (insight-card, article-card stb.), az a NAGY szekcio-cimekhez
   van (Hero, "Mai felismerések" stb.) - ez itt a finomabb, kisebb
   valtozat, pontosan a latvanyterv kartya-cimeihez. */
.ms-card-title,
.ms-card-title .elementor-heading-title{
  margin:0 0 6px!important;
  color:var(--ms-text)!important;
  font-family:var(--ms-font-display)!important;
  font-weight:700!important;
  font-size:18px!important;
  line-height:1.3!important;
}

.ms-link-arrow{
  color:var(--ms-gold)!important;
  font-size:13px!important;
  font-weight:700!important;
  text-decoration:none!important;
  white-space:nowrap!important;
}
.ms-link-arrow:hover{text-decoration:underline!important;}


/* ============================================================
   MAI FELISMERESEK (insight kartyak)
   ============================================================ */

.ms-insight-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:20px!important;
  align-items:start!important;
}
.ms-insight-card{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  text-align:left!important;
  align-self:start!important;
  gap:8px!important;
  padding:20px 18px!important;
  background:var(--ms-surface)!important;
  border:1px solid var(--ms-line)!important;
  border-radius:var(--ms-radius-md)!important;
  box-shadow:none!important;
  transition:transform .25s ease, box-shadow .25s ease;
}
.ms-insight-card:hover{
  transform:translateY(-3px)!important;
  box-shadow:var(--ms-shadow-card)!important;
}
/* UJ (2026-07-26): az ikon + a "KUTATAS/HELYZET" cimke egy sorban van
   ebben a wrapperben - EZ MAS SZERKEZET, mint korabban (akkor az ikon
   a kartya kulon, felso szintu gyereke volt) - lasd 06-os/07-es fajl
   frissitett fajaban. */
.ms-insight-header{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:8px!important;
}
.ms-insight-header .ms-eyebrow{margin:0!important;}
.ms-insight-icon{
  flex:0 0 auto!important;
  width:28px!important;
  height:28px!important;
  border-radius:50%!important;
  background:var(--ms-sage-soft)!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
}
/* Elore beepitett Elementor Icon widget szin-fix - lasd 05-os fajl/
   projekt-memoria, "Elementor Icon widget color" lecke. Barmely uj
   Icon-widget-alapu modulnal EZT A MINTAT kell ismetelni ELORE, ne
   csak utolag, ha mar hibas volt elesben. */
.ms-insight-icon .elementor-widget-icon .elementor-icon svg,
.ms-insight-icon i{
  fill:var(--ms-sage-dark)!important;
  color:var(--ms-sage-dark)!important;
  width:14px!important;
  height:14px!important;
}
.ms-insight-body{
  display:flex!important;
  flex-direction:column!important;
  flex:1 1 auto!important;
  min-width:0!important;
  width:100%!important;
}
.ms-insight-card .elementor-widget-container{padding:0!important;margin:0!important;}
/* A kartya keskeny (a fo oszlop, nem a teljes oldal szelessege), ezert
   a cim/szoveg tordelese hosszu szoveggel magas kartyat csinal - ez a
   3 szabaly maximum 2 sorra vagja a cimet ES a leirast, hogy a kartyak
   egyenletesen alacsonyak/kompaktak maradjanak, akkor is, ha kesobb
   valodi (hosszabb/rovidebb) cikk-cimek/kivonatok kerulnek bele. */
.ms-insight-body .ms-card-title,
.ms-insight-body .ms-card-title .elementor-heading-title{
  font-family:var(--ms-font-body)!important;
  font-size:14.5px!important;
  margin:0 0 4px!important;
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
}
.ms-insight-body .ms-text,
.ms-insight-body .ms-text p{
  font-size:12.5px!important;
  line-height:1.5!important;
  display:-webkit-box!important;
  -webkit-line-clamp:3!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
}
/* A kartyan beluli "Tovabb" link - NE az ms-link-arrow-ot hasznald (az
   a szekcio-fejlec ARANY linkje), ez itt a zsalya-zold, kisebb valtozat,
   HTML widgetbe irando: <a href="..." class="ms-card-link">Tovább →</a> */
.ms-card-link{
  display:inline-block!important;
  margin-top:4px!important;
  color:var(--ms-gold)!important;
  font-size:13px!important;
  font-weight:700!important;
  text-decoration:none!important;
}
.ms-card-link:hover{text-decoration:underline!important;}

@media (max-width:992px){
  .ms-insight-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (max-width:768px){
  .ms-insight-grid{grid-template-columns:1fr!important;}
}


/* ============================================================
   TEMAK SZERINTI BONGESZES (statikus csempek)
   ============================================================ */

.ms-topic-grid{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:14px!important;
  align-items:start!important;
}
.ms-topic-tile{
  display:block!important;
  align-self:start!important;
  padding:20px 18px!important;
  background:var(--ms-sage-soft)!important;
  border-radius:var(--ms-radius-sm)!important;
  text-decoration:none!important;
  transition:transform .2s ease;
}
.ms-topic-tile:hover{transform:translateY(-2px)!important;}
.ms-topic-tile .elementor-widget-icon .elementor-icon svg,
.ms-topic-tile i{
  fill:var(--ms-sage-dark)!important;
  color:var(--ms-sage-dark)!important;
  width:22px!important;
  height:22px!important;
}
/* HA a csempe egyetlen HTML widgetkent, nyers <a><svg>...</a> formaban
   epul (nem kulon Icon widgettel), a fenti szelektor nem talalja el a
   sima <svg>-t - ez a plusz szabaly azt az esetet fedi le. */
.ms-topic-tile > svg{
  display:block!important;
  color:var(--ms-sage-dark)!important;
  margin-bottom:8px!important;
}
.ms-topic-tile h3{margin:8px 0 2px!important;font-size:14.5px!important;font-weight:700!important;color:var(--ms-text)!important;}
.ms-topic-tile p{margin:0!important;font-size:12px!important;color:var(--ms-text-muted)!important;}

@media (max-width:992px){
  .ms-topic-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
}
/* Mobilon a specifikacio ket lehetoseget enged (lasd 04-es fajl, 7.2-es
   pont): "vizszintesen lapozhato 1,15 kartyas carousel VAGY 2 oszlopos
   racs". Itt az egyszerubb, JS-mentes 2 oszlopos racsot valasztjuk
   alapertelmezesnek - ha kesobb inkabb a lapozhato carousel valtozat
   kell, azt kulon kell megepiteni (nem sima CSS grid). */
@media (max-width:768px){
  .ms-topic-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;}
  .ms-topic-tile{padding:14px 12px!important;}
  .ms-topic-tile > svg,
  .ms-topic-tile .elementor-widget-icon .elementor-icon svg,
  .ms-topic-tile i{width:18px!important;height:18px!important;}
  .ms-topic-tile h3{font-size:13px!important;margin:6px 0 2px!important;}
  .ms-topic-tile p{font-size:11px!important;}
}


/* ============================================================
   LEGUJABB CIKKEK
   ============================================================ */

.ms-article-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:24px!important;
  align-items:start!important;
}
@media (min-width:1400px){
  .ms-article-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
}
@media (max-width:768px){
  .ms-article-grid{grid-template-columns:1fr!important;}
}

.ms-article-card{
  display:block!important;
  align-self:start!important;
  text-decoration:none!important;
  border-radius:var(--ms-radius-md)!important;
  overflow:hidden!important;
  background:var(--ms-surface)!important;
  border:1px solid var(--ms-line)!important;
}
.ms-article-card:hover .ms-article-title,
.ms-article-card:hover .ms-article-title .elementor-heading-title{
  color:var(--ms-sage-dark)!important;
}
.ms-article-media{
  position:relative!important;
  width:100%!important;
  aspect-ratio:16/7!important;
  overflow:hidden!important;
}
/* Ugyanaz a hiba/javitas mint a Hero-nal: az Elementor a Featured
   Image widget kore sajat, position:relative dobozt tesz, ami magassag
   nelkul osszeesik (mert az egyetlen tartalma, a mi position:absolute
   kepunk, nem ad neki meretet) - ezt is teljes meretüre kell tenni. */
.ms-article-media > .elementor-widget{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
}
.ms-article-media img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
}
.ms-article-body{padding:16px 18px 20px!important;}
.ms-article-eyebrow,
.ms-article-eyebrow .elementor-heading-title{
  display:inline-block!important;
  margin:0 0 8px!important;
  font-size:11px!important;
  font-weight:700!important;
  letter-spacing:.07em!important;
  text-transform:uppercase!important;
  color:var(--ms-sage-dark)!important;
}
.ms-article-eyebrow.is-gold,
.ms-article-eyebrow.is-gold .elementor-heading-title{color:var(--ms-gold)!important;}
.ms-article-title,
.ms-article-title .elementor-heading-title{
  margin:0 0 8px!important;
  color:var(--ms-text)!important;
  font-family:var(--ms-font-body)!important;
  font-weight:500!important;
  font-size:15px!important;
  line-height:1.35!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
}
.ms-article-card .elementor-widget-container{padding:0!important;margin:0!important;}

/* content_type ikon (📖🎧🧠⚡) - NEM kulon CSS-logika allitja be, hanem
   az ACF valaszthato mezo CIMKEJEBE mar bele van irva az emoji, lasd
   04-es fajl - ez az osztaly csak apro terkozt/meretet ad neki, ha
   kulon span-ba kerulne */
.ms-content-icon{font-size:13px!important;margin-right:4px!important;}


/* ============================================================
   MAI GONDOLAT - BORDÓ IDEZET-CAROUSEL (JOBB SAV)
   ============================================================ */

.ms-thought-slider{
  position:relative!important;
  min-height:360px!important;
  padding:36px 32px!important;
  border-radius:var(--ms-radius-md)!important;
  background:linear-gradient(160deg,var(--ms-burgundy-dark),var(--ms-burgundy))!important;
  color:var(--ms-text-on-burgundy)!important;
  overflow:hidden!important;
}
.ms-thought-quote-mark{
  font-family:var(--ms-font-display)!important;
  font-size:44px!important;
  line-height:1!important;
  color:var(--ms-gold)!important;
  opacity:.85!important;
}
.ms-thought-quote,
.ms-thought-quote p{
  margin:16px 0 14px!important;
  color:var(--ms-text-on-burgundy)!important;
  font-family:var(--ms-font-display)!important;
  font-style:italic!important;
  font-size:19px!important;
  line-height:1.4!important;
}
.ms-thought-author{margin:0 0 20px!important;font-size:13.5px!important;color:var(--ms-muted-on-burgundy)!important;}
.ms-thought-meta{padding-top:16px!important;border-top:1px solid rgba(247,241,230,.18)!important;}
.ms-thought-meta a{font-size:13px!important;font-weight:700!important;color:var(--ms-gold)!important;text-decoration:none!important;}
.ms-thought-meta a:hover{text-decoration:underline!important;}

/* Egyetlen slide megjelenesi animacioja - HA a Loop Carousel widget
   sajat athid-effektje nem elegendo/nem szep, ez az osztaly kezzel is
   rarakhato az aktiv slide-ra (lasd 06-os fajl, meg kiprobalando resz) */
@keyframes ms-thought-fade{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
.ms-thought-slide.is-active{animation:ms-thought-fade .55s ease both!important;}
@media (prefers-reduced-motion:reduce){
  .ms-thought-slide.is-active{animation:none!important;}
}

.ms-thought-nav{
  position:absolute!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:44px!important; /* erintesi celterulet minimum, lasd 05-os fajl */
  height:44px!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.12)!important;
  border:none!important;
  color:var(--ms-text-on-burgundy)!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  cursor:pointer!important;
}
.ms-thought-nav.is-prev{left:14px!important;}
.ms-thought-nav.is-next{right:14px!important;}
.ms-thought-dots{display:flex!important;flex-direction:row!important;gap:8px!important;justify-content:center!important;margin-top:18px!important;}
.ms-thought-dots button{
  width:7px!important;
  height:7px!important;
  border-radius:50%!important;
  border:none!important;
  padding:0!important;
  background:rgba(247,241,230,.35)!important;
  cursor:pointer!important;
}
.ms-thought-dots button.is-active{background:var(--ms-gold)!important;}
.ms-thought-nav:focus-visible,
.ms-thought-dots button:focus-visible{
  outline:2px solid var(--ms-gold)!important;
  outline-offset:2px!important;
}


/* ============================================================
   JOBB SAV - TOVABBI MODULOK (max 2 db, lasd 03-as fajl)
   ============================================================ */

.ms-rail-card{
  display:flex!important;
  flex-direction:row!important;
  align-items:flex-start!important;
  gap:14px!important;
  padding:20px!important;
  margin-top:20px!important;
  background:var(--ms-surface)!important;
  border:1px solid var(--ms-line)!important;
  border-radius:var(--ms-radius-md)!important;
}
.ms-rail-card.is-practice{border-color:var(--ms-gold)!important;background:var(--ms-gold-soft)!important;}
.ms-rail-card-icon{
  flex:0 0 auto!important;
  width:40px!important;
  height:40px!important;
  border-radius:50%!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  background:var(--ms-surface)!important;
}
.ms-rail-card-icon .elementor-widget-icon .elementor-icon svg,
.ms-rail-card-icon i{
  fill:var(--ms-sage-dark)!important;
  color:var(--ms-sage-dark)!important;
  width:20px!important;
  height:20px!important;
}
.ms-rail-card.is-practice .ms-rail-card-icon .elementor-widget-icon .elementor-icon svg,
.ms-rail-card.is-practice .ms-rail-card-icon i{
  fill:var(--ms-gold)!important;
  color:var(--ms-gold)!important;
}
.ms-rail-card h4{margin:0 0 4px!important;font-size:14.5px!important;font-weight:700!important;color:var(--ms-text)!important;}
.ms-rail-card p{margin:0 0 10px!important;font-size:12.5px!important;color:var(--ms-text-muted)!important;line-height:1.5!important;}
.ms-rail-card a{font-size:12.5px!important;font-weight:700!important;color:var(--ms-gold)!important;text-decoration:none!important;}
.ms-rail-card .elementor-widget-container{padding:0!important;margin:0!important;}


/* ============================================================
   UJRAFELHASZNALHATO BANNER MODULOK (meg nincs eleslesitve tartalommal,
   akkor huzd be, amikor van valodi kep/szoveg ra - lasd 02-es fajl)
   ============================================================ */

/* 1) JOBB SAVBA VALO, "KOCKA"-ARANYU BANNER - kep + cim + szoveg + gomb,
   ugyanolyan doboz mint a ms-rail-card, csak onallo, keretes kartya
   kep-hellyel felul. */
.ms-rail-banner{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:10px!important;
  padding:20px!important;
  margin-top:20px!important;
  background:var(--ms-surface)!important;
  border:1px solid var(--ms-line)!important;
  border-radius:var(--ms-radius-md)!important;
  overflow:hidden!important;
}
.ms-rail-banner img{
  width:100%!important;
  aspect-ratio:16/10!important;
  object-fit:cover!important;
  border-radius:var(--ms-radius-sm)!important;
  display:block!important;
}
.ms-rail-banner h4{margin:4px 0 0!important;font-size:14.5px!important;font-weight:700!important;color:var(--ms-text)!important;}
.ms-rail-banner p{margin:0!important;font-size:12.5px!important;color:var(--ms-text-muted)!important;line-height:1.5!important;}
.ms-rail-banner a.ms-card-link{margin-top:2px!important;}

/* 2) BAL OSZLOPBA (fo tartalom) VALO, HOSSZU KESKENY SAV-BANNER - csak
   egy Image widget, amin be van allitva az Elementor sajat "Link"
   mezoje (Tartalom ful) - nincs kulon szoveg/gomb, csak kattinthato
   kep. HA a kep NEM tolti ki a teljes szelesseget, ELESben ellenorizni
   kell, hogy az Elementor sajat .elementor-widget-image wrapper-e nem
   esik-e ossze (lasd Hero-nal mar dokumentalt "widget wrapper 0
   szelesseg" hiba, projekt-memoria). */
.ms-strip-banner img{
  width:100%!important;
  height:140px!important;
  object-fit:cover!important;
  border-radius:var(--ms-radius-md)!important;
  display:block!important;
  margin:0 0 32px!important;
}


/* ============================================================
   WELLBEING BOX ATVEZETES (teljes szelessegu, nyugodt sav)
   ============================================================
   A tartalmi koncepcio doksi kifejezetten "NEM reklám" jelleget kér -
   ezert NEM az arany/CTA-szinvilagot hasznaljuk (az figyelemfelkeltő,
   eladó hangulatot adna), hanem a nyugodt zsalya-tonust, es a vizualis
   nyelv a jobb sav "rail-card" mintajat koveti (kor-ikon + cim + szoveg
   + gomb), csak teljes szelessegu, önallo savkent, a "Legujabb cikkek"
   es a hirlevel-sav kozott (lasd 03-as fajl, blokk-sorrend). */
.ms-transition-band{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:28px!important;
  flex-wrap:wrap!important;
  max-width:1140px!important;
  margin:0 auto 56px!important;
  padding:32px 40px!important;
  border-radius:var(--ms-radius-md)!important;
  background:var(--ms-sage-soft)!important;
  border:1px solid var(--ms-line)!important;
}
.ms-transition-band-text{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:18px!important;
  flex:1 1 380px!important;
  min-width:0!important;
}
.ms-transition-icon{
  flex:0 0 auto!important;
  width:48px!important;
  height:48px!important;
  border-radius:50%!important;
  background:var(--ms-surface)!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
}
.ms-transition-icon .elementor-widget-icon .elementor-icon svg,
.ms-transition-icon i{
  fill:var(--ms-sage-dark)!important;
  color:var(--ms-sage-dark)!important;
  width:24px!important;
  height:24px!important;
}
.ms-transition-band h4{margin:0 0 4px!important;font-size:16px!important;font-weight:700!important;color:var(--ms-text)!important;}
.ms-transition-band p{margin:0!important;font-size:13.5px!important;color:var(--ms-text-muted)!important;line-height:1.5!important;}
.ms-transition-band .elementor-widget-container{padding:0!important;margin:0!important;}

@media (max-width:768px){
  .ms-transition-band{padding:24px!important;justify-content:center!important;text-align:center!important;}
  .ms-transition-band-text{flex-direction:column!important;}
}


/* ============================================================
   HIRLEVEL SAV (also, WP sajat Form widget - lasd egyeztetes)
   ============================================================ */

/* GRID-ALAPU HIRLEVEL-SAV (2026-07-24, a fejlecnel mar bevalt mintat
   koveti) - 3 elore rogzitett oszlop, NEM Flexbox space-between, mert
   az ugyanugy egymasra-csuszashoz vezetett, mint a fejlecnel. */
.ms-newsletter{
  display:grid!important;
  grid-template-columns:auto 1fr auto!important;
  align-items:center!important;
  column-gap:24px!important;
  padding:32px var(--ms-inset)!important;
  background:var(--ms-surface-soft)!important;
  border-top:1px solid var(--ms-line)!important;
}
@media (max-width:768px){
  .ms-newsletter{
    grid-template-columns:1fr!important;
    justify-items:center!important;
    row-gap:16px!important;
  }
}
.ms-newsletter-text{display:flex!important;flex-direction:row!important;align-items:center!important;gap:14px!important;}
.ms-newsletter-icon{
  display:inline-flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  width:40px!important;
  height:40px!important;
  flex-shrink:0!important;
  color:var(--ms-sage-dark)!important;
}
.ms-newsletter-icon svg,
.ms-newsletter-icon i,
.ms-newsletter-icon .elementor-widget-icon .elementor-icon svg{
  width:22px!important;
  height:22px!important;
  font-size:22px!important;
  fill:var(--ms-sage-dark)!important;
  color:var(--ms-sage-dark)!important;
}
.ms-newsletter h4{margin:0!important;font-size:15px!important;font-weight:700!important;color:var(--ms-text)!important;}
.ms-newsletter p{margin:0!important;font-size:12.5px!important;color:var(--ms-text-muted)!important;}
.ms-newsletter-form{display:flex!important;flex-direction:row!important;gap:10px!important;flex-wrap:wrap!important;}
/* Elementor Pro Form widget - a mezo/gomb NEM kozvetlenul a widgeten
   van, hanem tovabbi belso retegekben (.elementor-form-fields-wrapper >
   .elementor-field-group > input/button) - EZ MEG NEM VOLT KIPROBALVA
   elesben, a lenti osztalynevek az Elementor Pro Form widget rég óta
   stabil, altalanos szerkezete alapjan irodtak. HA MASKEPP nez ki
   elesben, Inspect-tel ellenorizni kell a tenyleges osztalyneveket es
   pontositani ezt a szabalyt. */
.ms-newsletter-form .elementor-form-fields-wrapper{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:wrap!important;
  align-items:flex-end!important;
  gap:10px!important;
}
/* VEGLEGES, A SAJAT BONGESZOMBEN ELESBEN LETESZTELT MEGOLDAS
   (2026-07-24) - A szulo ".elementor-form-fields-wrapper" display:flex,
   ES EZ A FONTOS RESZ: flex-konteneren belul egy gyerek sajat
   "display:inline-block" beallitasa figyelmen kivul marad (CSS Flexbox
   specifikacio: a flex-elemek "display" erteke automatikusan
   "blockified" - ezert nem mukodott az inline-block-os probalkozas).
   A helyes megoldas: VALODI flex tulajdonsagokkal (flex-basis a "flex"
   rovidites resze) szabalyozni, nem width-tel/display-jel. Kozvetlenul
   a mikroszunet.hu live oldalan tesztelve (JS-injektalt CSS-sel,
   getBoundingClientRect()-tel ellenorizve), mielott ez a vegleges
   valtozat bekerult volna. */
.ms-newsletter-form .elementor-field-type-email{
  flex:1 1 200px!important;
  width:auto!important;
}
.ms-newsletter-form .elementor-field-type-submit{
  flex:0 0 100px!important;
  width:auto!important;
}
.ms-newsletter-form .elementor-field-type-submit .elementor-button{
  width:100%!important;
}
.ms-newsletter-form .elementor-field-label{display:none!important;}
.ms-newsletter-form input.elementor-field,
.ms-newsletter-form input[type="email"]{
  min-width:220px!important;
  height:auto!important;
  padding:12px 14px!important;
  border:1px solid var(--ms-line)!important;
  border-radius:var(--ms-radius-sm)!important;
  font-size:14px!important;
  color:var(--ms-text)!important;
  background:#ffffff!important;
}
.ms-newsletter-form button.elementor-button,
.ms-newsletter-form .elementor-button{
  background:var(--ms-gold)!important;
  color:var(--ms-text)!important;
  border:none!important;
  border-radius:var(--ms-radius-sm)!important;
  padding:12px 22px!important;
  min-height:44px!important;
  font-weight:700!important;
  font-size:14px!important;
}
.ms-newsletter-form button.elementor-button:hover,
.ms-newsletter-form .elementor-button:hover{
  background:var(--ms-gold-hover)!important;
}
.ms-newsletter-social{display:flex!important;flex-direction:row!important;align-items:center!important;gap:14px!important;}
.ms-newsletter-social a{
  width:34px!important;
  height:34px!important;
  border-radius:50%!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  background:var(--ms-surface)!important;
  border:1px solid var(--ms-line)!important;
  color:var(--ms-text)!important;
}
/* Elesben ellenorizve (2026-07-24): az ikon SVG sajat fill tulajdonsaga
   fuggetlen a "color"-tol, kulon kell celozni. */
.ms-newsletter-social svg,
.ms-newsletter-social i{
  width:16px!important;
  height:16px!important;
  fill:var(--ms-text-muted)!important;
  color:var(--ms-text-muted)!important;
}


/* ============================================================
   LABLEC (meg nincs reszletesen kidolgozva - lasd 03-as fajl)
   ============================================================ */

/* Jogi sav (copyright + Impresszum/Adatvedelem/ASZF) - raw HTML-re
   szant, mint a site-route-divider a site- rendszerben, ezert nincs
   Elementor-wrapper okozta osztaly-gond vele (a class mar benne van a
   nyers HTML-ben). Lasd 06-os fajl frissitese. */
.ms-footer{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px 18px!important;
  padding:24px var(--ms-inset)!important;
  font-size:12px!important;
  color:var(--ms-text-muted)!important;
  border-top:1px solid var(--ms-line)!important;
}
.ms-footer a{
  color:var(--ms-text-muted)!important;
  text-decoration:none!important;
}
.ms-footer a:hover{
  color:var(--ms-sage-dark)!important;
  text-decoration:underline!important;
}
.ms-footer a:focus-visible{
  outline:2px solid var(--ms-gold)!important;
  outline-offset:2px!important;
}


/* ============================================================
   MOBIL TORESPONTOK (1280 / 992 / 768 - lasd 05-os fajl)
   ============================================================ */

@media (max-width:992px){
  .ms-hero{padding:32px var(--ms-inset)!important;min-height:380px!important;}
  .ms-hero-content{max-width:100%!important;}
  /* Kesekbeny nezetben tobb helyet foglal a szoveg-terulet a fotohoz
     kepest, ezert a gradienst is szelesebbre/erosebbre kell allitani,
     kulonben a szoveg nem lesz eleg olvashato a foto felett. */
  .ms-hero-media::after{
    background:linear-gradient(90deg,
      var(--ms-bg) 0%,
      var(--ms-bg) 45%,
      rgba(251,250,247,.92) 65%,
      rgba(251,250,247,.5) 82%,
      transparent 98%)!important;
  }
  .ms-header-nav{gap:18px!important;}
}

@media (max-width:768px){
  .ms-header-nav{display:none!important;} /* Elementor Nav Menu sajat hamburgere veszi at */
  .ms-header{padding:0 20px!important;min-height:68px!important;}
  .ms-hero{padding:28px 20px!important;}
  .ms-hero-title,
  .ms-hero-title .elementor-heading-title{font-size:34px!important;}
  .ms-container{padding:0 20px!important;}
  .ms-home-section{margin:0 0 40px!important;}
  .ms-newsletter{padding:24px 20px!important;justify-content:center!important;text-align:center!important;}
  .ms-thought-slider{padding:28px 24px!important;min-height:0!important;}
}


/* ============================================================
   EGYEDI CIKK OLDAL (Single Post sablon, Theme Builder)
   ============================================================ */

.ms-post-header{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:10px!important;
  max-width:900px!important;
  margin:0 auto!important;
  padding:32px var(--ms-inset) 0!important;
}
.ms-post-media{
  position:relative!important;
  width:100%!important;
  aspect-ratio:21/9!important;
  overflow:hidden!important;
  border-radius:var(--ms-radius-md)!important;
  margin-bottom:8px!important;
}
/* Ugyanaz a hiba/javitas, mint a Hero-nal es a cikk-kartyaknal: az
   Elementor a Featured Image widget kore sajat, position:relative
   dobozt tesz, ami magassag nelkul osszeesik - eleve ide is betettem
   a javitast, nem varva meg, hogy elesben elromoljon. */
.ms-post-media > .elementor-widget{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
}
.ms-post-media img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
}
.ms-post-title,
.ms-post-title a,
.ms-post-title .elementor-heading-title{
  margin:4px 0 0!important;
  color:var(--ms-text)!important;
  font-family:var(--ms-font-display)!important;
  font-weight:600!important;
  font-size:clamp(22px,2.2vw,30px)!important;
  line-height:1.25!important;
  text-decoration:none!important;
}
@media (max-width:768px){
  .ms-post-header{padding:24px 20px 0!important;}
  .ms-post-media{aspect-ratio:16/10!important;}
  .ms-post-title,
  .ms-post-title a,
  .ms-post-title .elementor-heading-title{font-size:22px!important;}
}

/* CIKK TARTALOM TIPOGRAFIA - meg nem volt megirva, a "Post Content"
   widget nyers WordPress-tartalmat ad ki (bekezdesek, h2/h3 alcimek
   a szerkesztobol), ezert cimke-szelektorral kell celozni, nem
   osztallyal. */
.ms-post-content{
  font-family:var(--ms-font-body)!important;
  color:var(--ms-text-muted)!important;
  font-size:16px!important;
  line-height:1.75!important;
}
.ms-post-content h2{
  margin:36px 0 12px!important;
  color:var(--ms-text)!important;
  font-family:var(--ms-font-display)!important;
  font-weight:600!important;
  font-size:22px!important;
  line-height:1.3!important;
}
.ms-post-content h3{
  margin:28px 0 10px!important;
  color:var(--ms-text)!important;
  font-family:var(--ms-font-display)!important;
  font-weight:600!important;
  font-size:18px!important;
  line-height:1.35!important;
}
.ms-post-content p{margin:0 0 18px!important;}
.ms-post-content ul,
.ms-post-content ol{margin:0 0 18px!important;padding-left:22px!important;}
.ms-post-content li{margin:0 0 8px!important;}
.ms-post-content a{color:var(--ms-sage-dark)!important;text-decoration:underline!important;}
.ms-post-content img{
  max-width:100%!important;
  height:auto!important;
  border-radius:var(--ms-radius-md)!important;
  margin:8px 0 24px!important;
  display:block!important;
}
.ms-post-content blockquote{
  margin:24px 0!important;
  padding:4px 0 4px 20px!important;
  border-left:3px solid var(--ms-gold)!important;
  font-style:italic!important;
  color:var(--ms-text)!important;
}

/* "Mas cikkek" jobb savos lista - ugyanaz a sablon (MS Cikk Kartya)
   fut itt is, mint a fooldali "Legujabb cikkek"-nel, DE ott kerte a
   datumot, itt (keskeny savban) NEM kell - ezert csak a jobb sav
   kontextusaban tuntetjuk el, a fooldalon marad. */
.ms-insight-rail .ms-meta{display:none!important;}