/* MOSAIC sminktetovalas landing (/pmu-sminktetovalas) - asztali terv szerint.
   Betuk: Playfair Display (cimek, sajat tarhelyrol) + Jost (szoveg). */
@font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/playfair-display-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/playfair-display-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/fonts/playfair-display-500-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/fonts/playfair-display-500-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Playfair Display'; font-style: italic; font-weight: 400; font-display: swap; src: url(/assets/fonts/playfair-display-400-italic-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Playfair Display'; font-style: italic; font-weight: 400; font-display: swap; src: url(/assets/fonts/playfair-display-400-italic-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Jost'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/jost-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Jost'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/jost-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --sotet: #0f3a3c;      /* gombok */
  --sotet2: #164547;
  --szoveg: #1b2e2f;
  --halk: #5c6766;
  --arany: #a07f4b;      /* felcimek, arak */
  --arany-v: #c9b28a;
  --krem: #f3f4ef;       /* oldal-hatter */
  --krem2: #eceee7;
  --bezs: #e2e5db;       /* bezs dobozok */
  --bezs2: #d6dacc;
  --zsalya: #e6ebe7;     /* zoldes-szurke dobozok */
  --feher: #fff;
  --vonal: #dce0d6;
  --hiba: #b1382c;
  --cim: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --test: 'Jost', 'Helvetica Neue', Arial, sans-serif;
  --szeles: 1200px;
  /* negy betumeret az egesz oldalon: cim, alcim, szoveg, kicsi (mobilon kisebb lepcsok) */
  --b1: 42px; --b2: 22px; --b3: 16px; --b4: 13px;
  --arnyek: 0 1px 2px rgba(40, 30, 20, .04), 0 8px 24px rgba(40, 30, 20, .06);
}
:where(main, dialog), :where(main, dialog) * { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; background: var(--krem); color: var(--szoveg); font: 400 16px/1.5 var(--test); -webkit-font-smoothing: antialiased; }
:where(main, dialog) img { display: block; max-width: 100%; }
:where(main, dialog) a { color: inherit; }
:where(main, dialog) :is(button, input, textarea) { font: inherit; color: inherit; }
[hidden] { display: none !important; }
:where(main, dialog) svg { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
:where(main, dialog) :is(h1, h2, h3) { font-family: var(--cim); font-weight: 500; color: var(--sotet); margin: 0; letter-spacing: -.01em; }
:where(main, dialog) h2 { font-size: 40px; line-height: 1.12; }
:where(main, dialog) h2.nagy { font-size: 56px; line-height: 1.05; }
:where(main, dialog) h3 { font-size: 20px; line-height: 1.25; }
:where(main, dialog) p { margin: 0; }
.tartalom { width: min(var(--szeles), calc(100% - 64px)); margin: 0 auto; position: relative; }
.kozepre { text-align: center; }
.halk { color: var(--halk); }
.kicsi { font-size: 13px; }
.lead { font-size: 19px; color: #2c3d3d; margin-top: 10px; }
.felcim { font: 600 12px/1.2 var(--test); letter-spacing: .2em; text-transform: uppercase; color: var(--arany); margin-bottom: 10px; }
.felcim.kicsi { font-size: 11px; color: var(--sotet); letter-spacing: .16em; }
.nyil { display: inline-block; transition: transform .2s; }
a:hover .nyil, button:hover .nyil { transform: translateX(3px); }

/* helyorzok: validalasra varo adat (kesobb csere) */
.helyorzo { color: #8a7a62; }
.helyorzo-ikon { opacity: .7; cursor: default; }

/* --- gombok --- */
.gomb { display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid transparent; border-radius: 999px; padding: 12px 26px; font: 500 15px/1.2 var(--test); text-decoration: none; cursor: pointer; transition: background .2s, transform .1s, box-shadow .2s; white-space: nowrap; }
.gomb:active { transform: translateY(1px); }
.gomb svg { width: 18px; height: 18px; }
.gomb-sotet { background: var(--sotet); color: #fff; box-shadow: 0 6px 18px rgba(15, 58, 60, .18); }
.gomb-sotet:hover { background: var(--sotet2); }
.gomb-korvonal { background: transparent; border-color: var(--sotet); color: var(--sotet); }
.gomb-korvonal:hover { background: rgba(15, 58, 60, .05); }
.gomb-bezs { background: var(--bezs); border-color: var(--bezs2); color: #6b5638; font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; padding: 9px 22px; }
.gomb-bezs:hover { background: var(--bezs2); }
.gomb-kicsi { padding: 10px 20px; font-size: 14px; }
.gomb-nagy { padding: 17px 38px; font-size: 16px; letter-spacing: .1em; text-transform: uppercase; }
.gomb-szeles { width: 100%; }
.gomb[aria-disabled="true"] { opacity: .6; pointer-events: none; }
.link-gomb { background: none; border: 0; padding: 0; color: var(--sotet); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
:where(main, dialog) :focus-visible { outline: 2px solid var(--arany); outline-offset: 3px; }


/* --- hero --- */
.hero { padding: 26px 0 44px; background: radial-gradient(120% 90% at 85% 10%, #e9ebe3 0%, transparent 60%), linear-gradient(#f6f7f3, #f0f1eb); }
.tenyek { list-style: none; margin: 0 0 30px; padding: 0; display: flex; justify-content: space-between; gap: 16px; }
.tenyek li { display: flex; align-items: center; gap: 12px; font-size: 13.5px; line-height: 1.25; color: #2a3a3a; }
.ikon-kor { flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--bezs); display: inline-grid; place-items: center; color: #8a6c3e; }
.ikon-kor svg { width: 19px; height: 19px; }
.hero-racs { display: grid; grid-template-columns: 1.08fr .92fr; gap: 28px; align-items: start; }
.hero h1 { font-size: 47px; line-height: 1.06; letter-spacing: -.02em; color: #111f20; margin-top: 4px; }
.hero-al { font-size: 21px; line-height: 1.4; margin: 16px 0 22px; color: #253636; max-width: 480px; }
.szakember-mini { display: flex; align-items: center; gap: 16px; margin-bottom: 22px; }
.szakember-mini b { display: block; font-weight: 500; font-size: 15px; }
.szakember-mini small { display: block; color: var(--halk); font-size: 13px; }
.dij-sor { display: flex; align-items: center; gap: 7px; font-size: 13px; color: #3d4b4b; margin-top: 6px; }
.dij-sor svg { width: 17px; height: 17px; color: var(--arany); flex: none; }
.dij-sor b { display: inline; font-size: 13px; font-weight: 600; }
.avatar { width: 76px; height: 76px; border-radius: 50%; flex: none; object-fit: cover; object-position: 50% 30%; background: #ddd url(/assets/img/pmu/melitta-portre.jpg) 50% 30% / cover no-repeat; box-shadow: 0 0 0 3px #fff, 0 4px 14px rgba(0, 0, 0, .12); }
.avatar.kicsi { width: 64px; height: 64px; }
.masodlagos { display: flex; align-items: center; gap: 24px; margin: 14px 0 26px; }
.masodlagos .gomb { font-size: 14px; padding: 11px 22px; }
.masodlagos .link-gomb { font-size: 14px; }
.bizalom { display: flex; align-items: center; gap: 18px; font-size: 14px; }
.google { display: inline-flex; align-items: center; gap: 8px; background: #fff; border-radius: 999px; padding: 7px 16px 7px 9px; box-shadow: var(--arnyek); text-decoration: none; color: var(--szoveg); font-size: 14px; }
.google:hover { box-shadow: 0 8px 22px rgba(40, 30, 20, .12); }
.g-ertek { font-weight: 600; }
.g-db { color: #3d4b4b; }
.google svg { width: 24px; height: 24px; stroke: none; }
.csillagok { color: #e2a83a; letter-spacing: 2px; }
/* hero: "Melitta munkai" gomb (a Google-ertekeles helyett): ugyanaz a pirula, vonalas ikonnal, a munkak szekciohoz gorget */
.munkak-gomb { padding: 9px 18px 9px 12px; font-weight: 500; }
.munkak-gomb svg { width: 22px; height: 22px; fill: none; stroke: var(--sotet); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.elvalaszto { width: 1px; height: 26px; background: var(--vonal); }
.dij { display: inline-flex; align-items: center; gap: 10px; color: #3d4b4b; }
.hero-kep { margin: 0; position: relative; border-radius: 18px; overflow: hidden; box-shadow: 0 18px 40px rgba(60, 40, 20, .14); aspect-ratio: 1.12; background: #e0e4db; }
.hero-foto { width: 100%; height: 100%; object-fit: cover; object-position: 50% 28%; }
.hero-kep > .cimke { left: auto; right: 14px; }
.hero-betet { position: absolute; left: 14px; bottom: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; width: 46%; padding: 4px; background: rgba(255, 255, 255, .92); border-radius: 12px; box-shadow: 0 8px 24px rgba(0, 0, 0, .18); }
.betet-kep { position: relative; aspect-ratio: 1.14; border-radius: 8px; background: #ddd url(/assets/img/c2eb0f_9a056d2081e84e17a3914d06797e9ca4.jpg) var(--pos) / 175% 200% no-repeat; }
.betet-kep .cimke { left: 6px; bottom: 6px; font-size: 8.5px; padding: 5px 8px; }
.eloutana { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; background: #fff; border-radius: 18px; overflow: hidden; box-shadow: 0 18px 40px rgba(60, 40, 20, .14); aspect-ratio: 1.12; }
.eloutana .fel { position: relative; background: #e0e4db var(--kep) var(--pos) / var(--meret) no-repeat; }
.cimke { position: absolute; left: 14px; bottom: 14px; background: rgba(255, 255, 255, .9); color: #2c2c2c; font: 600 10.5px/1 var(--test); letter-spacing: .14em; text-transform: uppercase; padding: 8px 12px; border-radius: 999px; }
.eloutana .fel + .fel .cimke { left: auto; right: 14px; }

/* --- legkozelebbi idopontok --- */
.idopontok { padding: 44px 0 40px; background: linear-gradient(90deg, #e7e9e1, #edefe8 40%, #e7eae3); border-top: 1px solid var(--vonal); border-bottom: 1px solid var(--vonal); }
.idopontok-racs { display: grid; grid-template-columns: 300px 1fr; gap: 36px; align-items: center; }
.idopontok h2 { font-size: 34px; }
.idopontok .halk { margin-top: 10px; font-size: 14.5px; }
.nap-kartyak { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.nap-kartya { background: #fff; border: 1px solid var(--vonal); border-radius: 14px; padding: 18px 20px; text-align: left; cursor: pointer; display: grid; grid-template-columns: 1fr auto; row-gap: 2px; box-shadow: var(--arnyek); transition: transform .15s, box-shadow .15s; text-decoration: none; color: inherit; min-height: 128px; }
.nap-kartya:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(40, 30, 20, .1); }
.nap-kartya .ikon-kor { width: 34px; height: 34px; grid-column: 1; margin-bottom: 8px; }
.nap-kartya .ikon-kor svg { width: 16px; height: 16px; }
.nap-kartya .kis-nyil { grid-column: 2; grid-row: 1; width: 28px; height: 28px; border-radius: 50%; background: var(--krem2); display: grid; place-items: center; align-self: start; }
.nap-kartya .kis-nyil svg { width: 14px; height: 14px; }
.nap-kartya .datum { grid-column: 1 / -1; font: 500 30px/1.05 var(--cim); color: var(--sotet); }
.nap-kartya .hetnap { grid-column: 1 / -1; font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--halk); }
.nap-kartya .orak { grid-column: 1 / -1; display: flex; align-items: center; gap: 7px; font-size: 13px; margin-top: 10px; color: #2d3a3a; }
.nap-kartya .orak svg { width: 15px; height: 15px; }
.nap-kartya.csontvaz { background: linear-gradient(90deg, #fff 0%, #f1f2ed 50%, #fff 100%) 0 0 / 200% 100%; animation: csillog 1.4s infinite linear; cursor: default; }
@keyframes csillog { to { background-position: -200% 0; } }
.nap-uzenet { grid-column: 1 / -1; background: #fff; border-radius: 14px; padding: 22px; color: var(--halk); border: 1px solid var(--vonal); }
.idopontok .kozepre { margin-top: 24px; }
.gomb-korvonal.gomb-szeles { width: auto; min-width: 240px; padding: 13px 34px; background: rgba(255, 255, 255, .45); }

/* --- helyzetek --- */
.helyzetek { padding: 64px 0 40px; background: #f7f8f6; }
.helyzetek h2 { font-size: 42px; }
.helyzetek > .tartalom > .halk { margin-top: 10px; }
.helyzet-racs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 26px; }
.helyzet { background: #fff; border-radius: 14px; padding: 12px; display: grid; grid-template-columns: 42% 1fr; gap: 16px; box-shadow: var(--arnyek); border: 1px solid #e7eae3; }
.helyzet > img, .helyzet .ketkep { width: 100%; height: 100%; min-height: 190px; object-fit: cover; border-radius: 9px; }
.helyzet .ketkep { display: grid; grid-template-rows: 1fr 1fr; gap: 3px; overflow: hidden; }
.helyzet .ketkep img { width: 100%; height: 100%; object-fit: cover; }
.helyzet > div:last-child { display: flex; flex-direction: column; gap: 10px; padding: 8px 4px 6px 0; }
.helyzet h3 { font-size: 20px; }
.helyzet-terulet { font: 600 11px/1 var(--test) !important; letter-spacing: .18em; text-transform: uppercase; color: var(--arany) !important; }
.helyzet p { font-size: 13.5px; color: var(--halk); line-height: 1.45; }
.helyzet .gomb { margin-top: auto; align-self: stretch; }
.figyelmeztet { display: flex; gap: 8px; background: #fbeeec; border: 1px solid #efc9c3; border-radius: 9px; padding: 9px 10px; color: var(--hiba) !important; font-size: 12px !important; line-height: 1.4 !important; }
.figyelmeztet svg { flex: none; width: 15px; height: 15px; margin-top: 1px; fill: var(--hiba); stroke: #fff; stroke-width: 2.2; }
.helyzet:has(.figyelmeztet) { background: linear-gradient(#fff, #fff) padding-box; }

/* --- eredmenyek --- */
.eredmenyek { padding: 54px 0 70px; background: #f7f8f6; }
.eredmenyek h2 { font-size: 42px; }
.eredmenyek > .tartalom > .halk { margin-top: 8px; }
.szuro { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin: 26px 0 22px; }
.szuro button { border: 1px solid var(--vonal); background: #fff; border-radius: 999px; padding: 8px 22px; font-size: 13.5px; cursor: pointer; color: #354343; }
.szuro button[aria-selected="true"] { background: var(--sotet); border-color: var(--sotet); color: #fff; }
.eset-racs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.eset { background: #fff; border-radius: 14px; padding: 8px 8px 16px; box-shadow: var(--arnyek); border: 1px solid #e7eae3; }
.eset .eloutana { aspect-ratio: 2.55; border-radius: 9px; box-shadow: none; margin-bottom: 14px; }
.eloutana.kicsi .cimke { font-size: 9px; padding: 6px 9px; bottom: 9px; left: 10px; }
.eloutana.kicsi .fel + .fel .cimke { right: 10px; left: auto; }
.eset h3, .eset p { padding: 0 8px; }
.eset h3 { font-size: 18px; }
.eset p { font-size: 13.5px; color: var(--halk); margin-top: 4px; }
.eset .gyogyult { display: flex; align-items: center; gap: 6px; margin-top: 10px; font-size: 13px; }
.eset .gyogyult svg { width: 15px; height: 15px; }
.helyorzo-kep { position: relative; }
.helyorzo-kep .fel { background: repeating-linear-gradient(135deg, #edefe8 0 10px, #e5e8e0 10px 20px); }
.helyorzo-szoveg { position: absolute; inset: 0; display: grid; place-items: center; text-align: center; padding: 0 30px; font-size: 12px; color: #8a7a62; pointer-events: none; }
.ref-racs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.ref { position: relative; margin: 0; border-radius: 12px; overflow: hidden; aspect-ratio: 1; background: #e5e8e0; box-shadow: var(--arnyek); }
.ref img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.ref:hover img { transform: scale(1.03); }
.ref .cimke { left: 10px; bottom: 10px; font-size: 9.5px; }
.ref-racs.zart .ref.tobb { display: none; }
#ref-tobb { margin-top: 24px; }

/* --- arak --- */
.arak { padding: 60px 0 40px; background: linear-gradient(#f4f5f1, #eff0ea); }
.ar-fej { display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: start; margin-bottom: 30px; }
.ar-fej .felcim { margin-bottom: 4px; }
.ar-fej h2.nagy { font-size: 64px; }
.tartalmaz { border-left: 1px solid var(--vonal); padding-left: 30px; }
.tartalmaz ul { list-style: none; margin: 10px 0 0; padding: 0; display: flex; }
.tartalmaz li { width: 112px; text-align: center; font-size: 12.5px; line-height: 1.3; min-height: 72px; color: #3b4848; padding: 0 6px; border-right: 1px solid var(--vonal); }
.tartalmaz li:last-child { border-right: 0; }
.tartalmaz li svg { width: 28px; height: 28px; display: block; margin: 0 auto 8px; color: var(--arany); stroke-width: 1.4; }
.ar-racs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.ar-kartya { background: #fff; border-radius: 14px; overflow: hidden; box-shadow: var(--arnyek); border: 1px solid #e7eae3; display: flex; flex-direction: column; }
.ar-kartya img { width: 100%; aspect-ratio: 1.38; object-fit: cover; }
.ar-kartya > div { padding: 18px 16px 18px; display: flex; flex-direction: column; flex: 1; }
.ar-kartya h3 { font: 500 15px/1.3 var(--test); color: var(--szoveg); }
.ar-kartya .ar { font: 400 22px/1.2 var(--cim); color: var(--arany); margin: 8px 0 8px; }
.ar-kartya .ar.helyorzo { color: #a48c69; }
.ar-kartya p:not(.ar) { font-size: 13px; color: var(--halk); line-height: 1.4; margin-bottom: 16px; }
.ar-kartya .ar-regi { font: 400 14px/1 var(--test); color: var(--halk); margin-left: 4px; }
.ar-most, .ar-regi { white-space: nowrap; }
.ar-kartya p.ar-ido { margin: -4px 0 8px; font-size: 12.5px; letter-spacing: .04em; }
.ar-kartya .gomb { margin-top: auto; align-self: flex-start; }
.eloleg { margin-top: 22px; background: var(--bezs); border-radius: 14px; padding: 18px 34px; display: grid; grid-template-columns: auto auto 1fr auto; gap: 30px; align-items: center; }
.ermek { width: 44px; height: 44px; color: var(--arany); stroke-width: 1.5; }
.eloleg-cim { font: 500 30px/1 var(--cim); color: var(--sotet); padding-right: 30px; border-right: 1px solid var(--bezs2); }
.eloleg-szoveg { font-size: 14px; color: #3b4848; }
.eloleg .level { width: 90px; height: 46px; color: var(--arany); opacity: .7; stroke-width: 1.2; }

/* --- mitol nem lesz mu --- */
.mu { padding: 60px 0 56px; background: #f7f8f4; }
.mu-fej { display: grid; grid-template-columns: 1fr 290px; gap: 40px; align-items: start; margin-bottom: 32px; }
.mu-fej h2 { font-size: 44px; }
.mu-fej .lead { font-size: 17px; }
.jegyzet { background: var(--bezs); border-radius: 14px; padding: 18px 18px; display: flex; gap: 14px; }
.jegyzet h3 { font-size: 19px; }
.jegyzet p { font-size: 12.5px; color: #4a5555; margin-top: 8px; }
.felkialto { flex: none; width: 34px; height: 34px; border-radius: 50%; background: #cdd1ba; color: #6b5023; display: inline-grid; place-items: center; font: 600 18px/1 var(--cim); }
.lepes-racs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.lepes-racs li { background: #fff; border-radius: 14px; padding: 18px 14px 14px; display: flex; flex-direction: column; border: 1px solid #e7eae3; box-shadow: var(--arnyek); }
.lepes-fej { display: flex; align-items: center; gap: 12px; min-height: 46px; }
.szam { flex: none; width: 34px; height: 34px; border-radius: 50%; background: var(--bezs); color: #6b5023; display: inline-grid; place-items: center; font: 500 17px/1 var(--cim); }
.lepes-racs h3 { font: 500 15.5px/1.25 var(--cim); }
.lepes-racs p { font-size: 13px; color: #4a5555; margin: 12px 0 14px; line-height: 1.45; flex: 1; }
.lepes-racs img { width: 100%; aspect-ratio: 1.25; object-fit: cover; border-radius: 9px; }
.lepes-racs li.kiemelt { background: var(--sotet); border-color: var(--sotet); transform: translateY(-6px); box-shadow: 0 18px 40px rgba(15, 58, 60, .25); }
.lepes-racs li.kiemelt h3 { color: #fff; font-family: var(--test); font-size: 13px; letter-spacing: .16em; text-transform: uppercase; font-weight: 600; }
.lepes-racs li.kiemelt p { color: #d9e3e2; }
.lepes-racs li.kiemelt .szam { background: #cdd1ba; }

/* --- menet --- */
.menet { padding: 56px 0 60px; border-top: 1px solid var(--vonal); background: #f6f7f3; }
.menet-racs { display: grid; grid-template-columns: 1fr 236px; gap: 30px; align-items: stretch; }
.menet h2 { font-size: 44px; }
.idovonal { list-style: none; margin: 28px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px; }
.idovonal li { position: relative; }
.idovonal li:not(:last-child)::after { content: '→'; position: absolute; top: 8px; left: 60px; right: -14px; text-align: right; color: var(--arany); border-bottom: 1px solid var(--vonal); height: 14px; line-height: 14px; padding-right: 2px; font-size: 18px; }
.idovonal .ikon-kor { width: 44px; height: 44px; }
.idovonal h3 { font: 600 15px/1.3 var(--test); color: var(--szoveg); margin: 16px 0 8px; }
.idovonal p { font-size: 13px; color: #4a5555; }
.nyugi { background: linear-gradient(160deg, #e6e8df, #d8dccf); border-radius: 16px; padding: 26px 24px; display: flex; flex-direction: column; justify-content: flex-end; min-height: 230px; position: relative; overflow: hidden; }
.nyugi svg { width: 40px; height: 40px; color: #6b5a42; stroke-width: 1.3; position: absolute; top: 24px; left: 24px; }
.nyugi h3 { font-size: 24px; line-height: 1.2; }
.nyugi p { font-size: 13.5px; color: #4a5555; margin-top: 12px; }

/* --- gyogyulasi idovonal --- */
.gyogyulas { padding: 50px 0 64px; border-top: 1px solid var(--vonal); }
.gyogy-fej { display: grid; grid-template-columns: 1fr 280px; gap: 40px; align-items: end; margin-bottom: 24px; }
.gyogy-fej h2 { font-size: 40px; }
.gyogy-fej aside { border-left: 1px solid var(--vonal); padding-left: 22px; }
.gyogy-fej aside h3 { font-size: 17px; }
.gyogy-fej aside p { font-size: 13.5px; color: #4a5555; margin-top: 6px; }
.gyogy-sor { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 44px; }
.gyogy-sor li { position: relative; }
.gyogy-sor li:not(:last-child)::after { content: '→'; position: absolute; right: -32px; top: 64px; color: #7c7468; font-size: 18px; }
.szemoldok-rajz { position: relative; aspect-ratio: 1.6; border-radius: 6px; overflow: hidden; background: radial-gradient(120% 90% at 50% 120%, #c99a83 0%, transparent 60%), linear-gradient(#e2bfa8, #d9b29a); display: grid; place-items: center; }
.szemoldok-rajz svg { width: 82%; opacity: var(--intenz); filter: blur(var(--elmos)); stroke: none; }
.szemoldok-rajz .cimke { left: 0; right: 0; bottom: 0; border-radius: 0; background: rgba(240, 225, 200, .92); text-align: center; padding: 6px; font-size: 9.5px; color: #5d4a32; }
.gyogy-sor p { font-size: 13px; color: #4a5555; margin-top: 12px; }

/* --- szakember --- */
.szakember { padding: 0; background: linear-gradient(90deg, #f2f3ee 0%, #e9ebe3 100%); border-top: 1px solid var(--vonal); overflow: hidden; }
.szakember-racs { display: grid; grid-template-columns: minmax(380px, 1fr) 520px 190px; align-items: stretch; min-height: 460px; }
.szakember-adatok { padding: 36px 0; }
.szakember-adatok h2.nagy { font-size: 50px; white-space: nowrap; }
.szakember-adatok .lead { margin-top: 6px; }
.szakember-adatok ul { list-style: none; padding: 0; margin: 28px 0 0; display: grid; gap: 12px; }
.szakember-adatok blockquote { margin: 34px 0 0; max-width: 400px; font: italic 400 25px/1.32 var(--cim); color: var(--sotet); }
.szakember-adatok li { display: flex; gap: 22px; align-items: flex-start; font-size: 14.5px; }
.szakember-adatok li b { font-weight: 500; }
.szakember-adatok li svg { flex: none; width: 30px; height: 30px; color: var(--arany); stroke-width: 1.3; }
.szakember-kep { background: #000 url(/assets/img/pmu/melitta-wulop-2026.jpg) 50% 20% / 100% auto no-repeat; min-height: 400px; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 88%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 88%, transparent 100%); }
.szakember-video { padding: 30px 0 26px; display: flex; align-items: center; justify-content: flex-start; margin-left: -70px; position: relative; z-index: 1; }
.video-kartya { border: 0; padding: 0; background: var(--sotet); border-radius: 14px; overflow: hidden; cursor: pointer; text-align: left; color: #fff; box-shadow: 0 16px 34px rgba(15, 58, 60, .2); width: 260px; flex: none; }
.video-kep { position: relative; display: block; aspect-ratio: 9 / 14; background: #333 url(/assets/img/pmu/melitta-munka.jpg) 50% 30% / cover; }
.lejatszas { position: absolute; inset: 0; margin: auto; width: 56px; height: 56px; border-radius: 50%; border: 2px solid #fff; background: rgba(0, 0, 0, .25); display: grid; place-items: center; transition: transform .2s; }
.video-kartya:hover .lejatszas { transform: scale(1.06); }
.lejatszas svg { width: 22px; height: 22px; fill: #fff; stroke: none; margin-left: 3px; }
.hossz { position: absolute; right: 10px; bottom: 10px; background: rgba(0, 0, 0, .65); font-size: 11px; padding: 3px 7px; border-radius: 4px; }
.video-felirat { display: block; padding: 11px 14px 13px; }
.video-felirat .nyil { color: var(--arany-v); font-size: 18px; }
.video-felirat b { display: block; font-weight: 500; font-size: 14px; }
.video-felirat small { font-size: 12px; color: #cfdcdb; }

/* --- velemenyek --- */
.velemenyek { padding: 50px 0 56px; background: #f7f8f6; border-top: 1px solid var(--vonal); }
.vel-fej { display: grid; grid-template-columns: auto 1fr auto; gap: 40px; align-items: center; margin-bottom: 26px; }
.vel-fej h2 { font-size: 44px; }
.vonal { height: 1px; background: var(--vonal); }
.google-nagy { display: flex; align-items: center; gap: 12px; }
.google-nagy svg { width: 36px; height: 36px; stroke: none; }
.google-nagy b { font: 500 30px/1 var(--cim); color: var(--sotet); }
.google-nagy small { display: block; font-size: 12.5px; color: var(--halk); }
.trustindex { min-height: 320px; }
.trustindex iframe { display: block; width: 100%; height: 420px; border: 0; }
.trustindex .mh-helykitolto { min-height: 260px; display: grid; place-content: center; gap: 12px; text-align: center; background: #fff; border: 1px solid var(--vonal); border-radius: 14px; padding: 30px; color: var(--halk); }
.trustindex .mh-helykitolto button { justify-self: center; }
.vel-racs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.vel { background: #fff; border-radius: 14px; padding: 16px 16px 14px; border: 1px solid #e7eae3; box-shadow: var(--arnyek); display: flex; flex-direction: column; }
.vel-fej-sor { display: flex; justify-content: space-between; align-items: flex-start; }
.vel-fej-sor svg, .vel-mind > svg { width: 24px; height: 24px; stroke: none; }
.vel .vel-szoveg { background: none; padding: 6px 2px 0; text-align: left; text-transform: none; letter-spacing: 0; font: italic 400 16.5px/1.45 var(--cim); color: var(--szoveg); flex: 1; }
.vel .csillagok { text-align: left; margin: 12px 2px 4px; color: #e2a83a; }
.vel-nev { font-weight: 600; font-size: 14px; margin: 0 2px 12px; }
.vel-nev small { display: block; font-weight: 400; font-size: 12px; color: var(--halk); }
.vel-mind { align-items: center; justify-content: center; text-align: center; gap: 10px; text-decoration: none; color: var(--szoveg); background: var(--bezs); }
.vel-mind b { font: 500 40px/1 var(--cim); color: var(--sotet); }
.vel-mind .gomb { margin-top: 8px; }
.vel-mind-szoveg { white-space: nowrap; font-size: 14.5px; }
a.google-nagy { text-decoration: none; color: inherit; }
.idezojel { font: 500 44px/0.7 var(--cim); color: #b08b51; margin: 12px 0 2px 6px; }
.vel .csillagok { text-align: center; color: #b08b51; margin: 8px 0 12px; font-size: 14px; }
.tema { font-size: 13px; color: #4a5555; margin-top: 12px; padding: 0 6px; }
.tema b { color: var(--szoveg); font-weight: 600; }

/* --- mielott foglalsz --- */
.mielott { padding: 50px 0 40px; border-top: 1px solid var(--vonal); }
.cim-vonallal { display: grid; grid-template-columns: auto 1fr; gap: 26px; align-items: end; margin-bottom: 24px; }
.cim-vonallal h2 { font-size: 44px; }
.cim-vonallal .vonal { margin-bottom: 16px; max-width: 460px; }
.mielott-racs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.mielott-bal { background: linear-gradient(#e8eae2, #e2e5db); border-radius: 14px; padding: 24px 30px 34px; }
.mielott-bal h3 { display: flex; align-items: center; gap: 14px; font-size: 21px; }
.pipak { list-style: none; padding: 0; margin: 20px 0 0 4px; display: grid; gap: 22px; }
.pipak li { position: relative; padding-left: 40px; font-size: 16px; line-height: 1.4; color: var(--szoveg); }
.pipak li::before { content: ''; position: absolute; left: 0; top: 0; width: 24px; height: 24px; border-radius: 50%; border: 1.5px solid #c2a978; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 12.5l3.2 3.2L17 9' fill='none' stroke='%23a07f4b' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 18px no-repeat; }
.mielott-jobb { background: var(--zsalya); border-radius: 14px; padding: 24px 30px; position: relative; overflow: hidden; }
.mielott-jobb .sor { display: flex; gap: 18px; align-items: flex-start; position: relative; z-index: 1; }
.mielott-jobb h3 { font-size: 21px; }
.mielott-jobb p { font-size: 14px; color: #3f4b4b; margin: 8px 0 14px; }
.mielott-jobb hr { border: 0; border-top: 1px solid #cdd5d0; margin: 8px 0 18px 64px; }
.ikon-sotet { flex: none; width: 46px; height: 46px; border-radius: 50%; background: var(--sotet); color: #fff; display: grid; place-items: center; }
.ikon-sotet svg { width: 22px; height: 22px; }
.mielott-jobb .ora { flex: none; width: 46px; height: 46px; color: var(--sotet); stroke-width: 1.5; }
.level-dekor { position: absolute; right: -6px; top: -10px; width: 70px; height: 150px; color: #c9ab7a; stroke-width: 1; opacity: .8; }

/* --- GYIK --- */
.gyik { padding: 44px 0 64px; border-top: 1px solid var(--vonal); }
.gyik-racs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 14px; align-items: start; }
.gyik-racs > div { display: grid; gap: 6px; }
.gyik details { background: #edefea; border-radius: 6px; }
.gyik summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 8px 18px; font-size: 14.5px; cursor: pointer; color: #26393a; }
.gyik summary::-webkit-details-marker { display: none; }
.gyik summary::after { content: '+'; font: 300 24px/1 var(--test); color: var(--arany); transition: transform .2s; }
.gyik details[open] summary::after { transform: rotate(45deg); }
.gyik details p { padding: 0 18px 14px; font-size: 14px; color: #3d4b4b; }
.gyik details p + p { padding-top: 0; }

/* --- foglalo --- */
.foglalas { position: relative; padding: 26px 0 26px; background: linear-gradient(90deg, #f6f7f3 0%, #f2f3ee 60%, #e6e8e0 100%); border-top: 1px solid var(--vonal); overflow: hidden; }
.fogl-hatter { position: absolute; right: 0; top: 0; bottom: 0; width: 26%; background: url(/assets/img/pmu/melitta-wulop-2026.jpg) 78% 8% / auto 150% no-repeat; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 30%); mask-image: linear-gradient(90deg, transparent 0, #000 30%); }
.foglalas .tartalom { width: min(1440px, calc(100% - 64px)); }
.fogl-fej { display: grid; grid-template-columns: 1fr auto; gap: 30px; align-items: start; margin-bottom: 18px; max-width: 980px; }
.fogl-fej .felcim { margin-bottom: 6px; }
.fogl-fej h2.nagy { font-size: 60px; }
.kezirat-szurke { position: relative; font: italic 400 18px/1.35 var(--cim); color: #4a4a40; margin: 8px 0 0; padding-left: 0; }
.kezirat-szurke svg { position: absolute; left: -120px; top: 6px; width: 110px; height: 64px; color: #8e7a5c; stroke-width: 1.2; }
/* a megtervezett foglalasi folyamat (/foglalo-pmu) keretben; a magassagat a pmu-landing.js allitja */
.fogl-racs { display: grid; grid-template-columns: minmax(0, 600px) 1fr; gap: 24px; align-items: stretch; }
.foglalo-keret { position: relative; z-index: 1; background: #fbfaf7; border-radius: 16px; border: 1px solid #e7eae3; box-shadow: var(--arnyek); overflow: hidden; scroll-margin-top: 90px; }
.foglalo-keret iframe { display: block; width: 100%; height: 760px; border: 0; }
.fogl-portre { position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: flex-end; padding: 0 0 6px 30px; color: #fff; text-shadow: 0 1px 12px rgba(0, 0, 0, .35); }
.portre-nev { font: 600 13px/1.4 var(--test); letter-spacing: .16em; text-transform: uppercase; text-align: right; }
.portre-nev small { display: block; font-size: 11px; letter-spacing: .14em; }

/* --- helyszin --- */
.helyszin { padding: 22px 0 18px; background: #f7f8f6; border-top: 1px solid var(--vonal); }
.helyszin .tartalom { width: min(1440px, calc(100% - 64px)); }
.helyszin-racs { display: grid; grid-template-columns: 1.15fr 1fr 0.55fr; gap: 14px; align-items: stretch; }
.helyszin-racs > div:first-child { padding: 12px 20px 10px 0; }
.helyszin h2.nagy { font-size: 52px; }
.helyszin .lead { font-size: 19px; margin-bottom: 16px; }
.hely-sor { display: flex; gap: 18px; align-items: flex-start; margin-top: 10px; }
.hely-sor p { font-size: 15.5px; line-height: 1.35; }
.hely-sor b { font-weight: 500; }
.hely-ketto { display: grid; gap: 4px; margin-top: 4px; }
.hely-ketto .hely-sor p { font-size: 13.5px; color: #3d4b4b; max-width: 440px; }
.hely-ketto .hely-sor p b { font-size: 15.5px; }
.terkep { border-radius: 12px; overflow: hidden; position: relative; min-height: 270px; background: #dfe4db; box-shadow: var(--arnyek); }
.terkep-kep { position: absolute; inset: 0; display: block; background: url(/assets/img/c2eb0f_3d447a4483a54782920eee5bd468b1b5.jpg) 40% 30% / 140% auto no-repeat; text-decoration: none; }
.terkep iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.terkep-cimke { position: absolute; left: 30%; top: 22%; display: flex; gap: 8px; align-items: center; background: #fff; border-radius: 6px; padding: 8px 14px 8px 8px; box-shadow: 0 6px 20px rgba(0, 0, 0, .15); font-size: 13.5px; color: var(--szoveg); }
.terkep-cimke svg { width: 30px; height: 30px; fill: var(--sotet); stroke: none; }
.terkep-cimke b { display: block; font-weight: 600; }
.terkep-gomb { position: absolute; right: 12px; bottom: 12px; background: var(--sotet); color: #fff; font-size: 13px; padding: 8px 14px; border-radius: 999px; }
.hely-kepek { display: grid; grid-template-rows: 1fr 1fr; gap: 8px; }
.hely-kepek img { width: 100%; height: 100%; min-height: 130px; object-fit: cover; border-radius: 10px; }

/* --- parbeszedablakok --- */
dialog { border: 0; border-radius: 16px; padding: 0; box-shadow: 0 30px 80px rgba(0, 0, 0, .25); color: inherit; }
dialog::backdrop { background: rgba(15, 30, 30, .45); }
.vh-zar { position: absolute; right: 12px; top: 10px; border: 0; background: none; font-size: 28px; line-height: 1; cursor: pointer; color: var(--halk); }
.video-ablak { background: #000; width: min(460px, 92vw); }
.video-keret { aspect-ratio: 9 / 16; max-height: 86vh; }
.video-keret iframe { display: block; width: 100%; height: 100%; border: 0; }
.video-ablak .vh-zar { color: #fff; z-index: 1; }

/* --- keskenyebb kepernyo: ideiglenes egymas ala rendezes (a vegleges mobil terv kulon kesz) --- */
@media (max-width: 1100px) {
  .menu { display: none; }
  .tenyek { flex-wrap: wrap; justify-content: flex-start; }
  .hero-racs, .idopontok-racs, .menet-racs, .mu-fej, .gyogy-fej, .ar-fej, .szakember-racs, .vel-fej, .mielott-racs, .gyik-racs, .helyszin-racs, .fogl-fej { grid-template-columns: 1fr; }
  .kezirat { position: static; transform: none; margin-top: 12px; }
  .ar-racs, .lepes-racs { grid-template-columns: repeat(2, 1fr); }
  .helyzet-racs, .eset-racs, .vel-racs { grid-template-columns: repeat(2, 1fr); }
  .ref-racs { grid-template-columns: repeat(3, 1fr); }
  .szakember-video { margin-left: 0; justify-content: center; }
  .idovonal, .gyogy-sor { grid-template-columns: repeat(2, 1fr); }
  .idovonal li::after, .gyogy-sor li::after { display: none; }
  .fogl-racs { grid-template-columns: minmax(0, 600px); justify-content: center; }
  .fogl-portre, .fogl-hatter, .kezirat-szurke svg { display: none; }
  .szakember-kep { min-height: 360px; }
  .eloleg { grid-template-columns: auto 1fr; }
  .eloleg .level { display: none; }
}
/* tablet (egymas ala rendezve): a szeles, alacsony dobozban a plakett felirata (1. hely) is latszodjon, ne csak az arc */
@media (min-width: 701px) and (max-width: 1100px) {
  .szakember-kep { min-height: 600px; background-position: 50% 30%; }
}
@media (max-width: 700px) {
  .foglalo-keret { scroll-margin-top: 130px; }
  .tartalom, .fejlec .sav { width: calc(100% - 32px); }
  h2, h2.nagy, .ar-fej h2.nagy, .fogl-fej h2.nagy { font-size: var(--b1); }
  .hero h1 { font-size: var(--b1); }
  .fej-telefon { display: none; }
  .fejlec .sav { gap: 12px; justify-content: space-between; }
  .ref-racs { grid-template-columns: repeat(2, 1fr); }
  .nap-kartyak, .helyzet-racs, .eset-racs, .vel-racs, .ar-racs, .lepes-racs, .idovonal, .gyogy-sor, .hely-ketto { grid-template-columns: 1fr; }
  .helyzet { grid-template-columns: 1fr; }
  .masodlagos, .bizalom { flex-wrap: wrap; }
  .tartalmaz ul { flex-wrap: wrap; }
  .lepes-racs li.kiemelt { transform: none; }
  .eloleg { grid-template-columns: 1fr; gap: 10px; }
  .eloleg-cim { border: 0; }
  .tenyek li { width: calc(50% - 8px); }
}

/* === 2026-10-03: kert modositasok === */
/* hero: a "gyogyult eredmeny" cimke nelkul, az elotte/utana betet jobbra (kevesebbet takar az arcbol) */
.hero-betet { left: auto; right: 14px; }
/* legkozelebbi idopontok: a gomb a harom kartya alatt, hozzajuk kozepre igazitva */
.idopontok-racs > div:last-child > .kozepre { margin-top: 20px; }
/* referenciak: kattintasra nagyban */
.ref { cursor: zoom-in; }
.nagyito { border: 0; padding: 0; background: transparent; max-width: min(92vw, 900px); max-height: 92vh; overflow: visible; }
.nagyito::backdrop { background: rgba(20, 24, 24, .82); }
.nagyito img { display: block; max-width: min(92vw, 900px); max-height: 88vh; width: auto; height: auto; border-radius: 12px; }
.nagyito .vh-zar, .nagyito .lapoz { position: fixed; border: 0; background: rgba(255, 255, 255, .92); color: #183033; width: 44px; height: 44px; border-radius: 50%; font-size: 24px; cursor: pointer; display: grid; place-items: center; }
.nagyito .vh-zar { top: 16px; right: 16px; }
.nagyito .lapoz { top: 50%; transform: translateY(-50%); }
.nagyito .lapoz.elozo { left: 16px; } .nagyito .lapoz.kov { right: 16px; }
/* velemenyek: lapozhato sor, mind latszik */
.vel-sav { position: relative; }
.vel-racs.lapozo { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 3 * 16px) / 4); grid-template-columns: none; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 4px 2px 10px; }
.vel-racs.lapozo::-webkit-scrollbar { display: none; }
.vel-racs.lapozo > * { scroll-snap-align: start; }
.vel-lapoz { display: flex; justify-content: center; align-items: center; gap: 12px; margin-top: 10px; }
.vel-lapoz button { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--vonal); background: #fff; cursor: pointer; font-size: 18px; color: var(--sotet); }
.vel-lapoz button[disabled] { opacity: .35; cursor: default; }
/* mielott foglalsz: harom jelentkezesi mod */
.utak { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 16px; counter-reset: ut; }
.utak li { display: grid; grid-template-columns: 46px 1fr; gap: 14px; align-items: start; }
.ut-ikon { width: 46px; height: 46px; border-radius: 50%; background: #fff; border: 1.5px solid #c2a978; display: grid; place-items: center; color: #8e6d3e; }
.ut-ikon svg { width: 22px; height: 22px; }
.utak h4 { margin: 2px 0 4px; font: 600 16px/1.3 var(--test); color: var(--szoveg); }
.utak h4 small { font-weight: 400; font-size: 12px; color: #6a5a3e; background: #fff; border-radius: 99px; padding: 2px 8px; margin-left: 6px; vertical-align: 2px; }
.utak p { margin: 0 0 6px; font-size: 14px; color: #4a5555; line-height: 1.45; }
.utak .link-gomb { font-weight: 600; }
.mielott-jobb p + p { margin-top: 0; }
/* foglalo cime: a megjegyzes a nyillal egy sorban, kozvetlenul a cim mellett */
.fogl-fej { display: flex; align-items: flex-end; gap: 22px; max-width: none; }
.kezirat-szurke { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font-size: 17px; }
.kezirat-szurke svg { position: static; flex: none; width: 74px; height: 44px; }
@media (max-width: 1100px) {
  .vel-racs.lapozo { grid-auto-columns: calc((100% - 16px) / 2); }
  .fogl-fej { display: block; }
}
@media (max-width: 700px) {
  .vel-racs.lapozo { grid-auto-columns: 86%; grid-template-columns: none; }
  .kezirat-szurke svg { display: none; }
}
.vel-racs.lapozo .vel-szoveg { display: -webkit-box; -webkit-line-clamp: 8; -webkit-box-orient: vertical; overflow: hidden; }
.mielott-jobb .sor > div { padding-right: 48px; }
/* foglalo: ne legyen nagy ures sav a foglalo es Melitta kepe kozott */
@media (min-width: 1101px) {
  .foglalas .tartalom { width: min(1240px, calc(100% - 64px)); }
  .fogl-hatter { width: 350px; right: max(0px, calc((100% - 1240px) / 2 + 30px)); }
  .fogl-portre { padding-right: 46px; }
}
.utak .link-gomb { text-align: left; display: inline; padding: 0; }
@media (max-width: 700px) { .mielott-jobb .sor > div { padding-right: 14px; } }

/* === 2026-10-03 (2. kor) === */
/* hero: a fo gomb pontosan olyan szeles, mint alatta a ket masodlagos egyutt */
.cta-blokk { display: inline-grid; grid-template-columns: max-content; }
.cta-blokk .gomb-nagy { width: 100%; justify-content: center; padding-left: 20px; padding-right: 20px; }
/* eredmenyek: nem AI-generalt kepek */
.nem-ai { display: flex; align-items: center; justify-content: center; gap: 10px; width: max-content; max-width: 100%; margin: 14px auto 22px; padding: 9px 16px; border-radius: 999px; background: #fff; border: 1px solid var(--vonal); font-size: 14px; color: #3f4b4b; box-shadow: var(--arnyek); }
.nem-ai svg { flex: none; width: 22px; height: 22px; color: var(--zold, #3f7652); stroke: currentColor; fill: none; stroke-width: 1.8; }
.nem-ai b { color: var(--szoveg); }
/* mielott foglalsz: a vendeg erzese a fo sor, a jelentkezes tipusa kis felirat */
.ut-tipus { margin: 0 0 2px !important; font: 600 11px/1.3 var(--test) !important; letter-spacing: .14em; text-transform: uppercase; color: #8e6d3e !important; }
.ut-tipus small { font-size: 10px; letter-spacing: .06em; text-transform: none; background: #fff; border-radius: 99px; padding: 1px 7px; margin-left: 4px; color: #6a5a3e; }
.utak h4 { font: 400 20px/1.25 var(--cim); margin: 0 0 4px; }
/* zold doboz: tisztelet / lemondas, abraval */
.mielott-jobb { padding: 28px 34px 30px; }
.mielott-jobb > h3 { font-size: 24px; margin: 0 40px 8px 0; }
.tisztelet-lead { font-size: 15.5px !important; color: #2f3c3c !important; margin: 0 40px 18px 0 !important; line-height: 1.5; }
.lemondas-abra { list-style: none; margin: 0 0 18px; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); position: relative; }
.lemondas-abra::before { content: ''; position: absolute; left: 16.6%; right: 16.6%; top: 9px; height: 2px; background: linear-gradient(90deg, #8fa89a 0 50%, #c98b6b 50% 100%); }
.lemondas-abra li { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 3px; padding: 0 6px; }
.lemondas-abra .pont { width: 20px; height: 20px; border-radius: 50%; background: #fff; border: 2px solid #8fa89a; margin-bottom: 6px; }
.lemondas-abra .hatar .pont { background: var(--sotet); border-color: var(--sotet); box-shadow: 0 0 0 5px rgba(24, 48, 51, .12); }
.lemondas-abra b { font: 600 13px/1.25 var(--test); color: var(--szoveg); }
.lemondas-abra small { font-size: 12px; color: #4f5d5d; line-height: 1.3; }
.tisztelet-pontok { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.tisztelet-pontok li { display: grid; grid-template-columns: 22px 1fr; gap: 10px; font-size: 14px; color: #34413f; line-height: 1.45; }
.tisztelet-pontok svg { width: 20px; height: 20px; fill: none; stroke: var(--sotet); stroke-width: 2; margin-top: 1px; }
.alairas { margin: 16px 0 0 !important; font: italic 400 17px/1.4 var(--cim) !important; color: var(--sotet) !important; }
.alairas span { font-style: normal; font-size: 15px; margin-left: 6px; }
/* foglalo fejlec: a megjegyzes a lead sorral egy sorban, a nyil lejjebb */
.fogl-fej { display: block; }
.fogl-lead { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 26px; }
.fogl-lead .kezirat-szurke { margin: 0; display: inline-flex; align-items: center; gap: 10px; font-size: 17px; }
.fogl-lead .kezirat-szurke svg { position: static; width: 66px; height: 40px; transform: translateY(10px); }
@media (max-width: 700px) {
  .cta-blokk { display: grid; grid-template-columns: 1fr; }
  .lemondas-abra small { font-size: var(--b4); }
  .mielott-jobb > h3, .tisztelet-lead { margin-right: 0 !important; }
}
.nyugi h3 { margin-top: 56px; }

/* === foglalas: sotet hatter, Melitta kepe szelesebben, lagyan beleolvadva; a foglalo vilagos kartyaja jol kiugrik === */
.foglalas { background: radial-gradient(120% 140% at 85% 30%, #24413f 0%, #183033 45%, #10221f 100%); border-top: 0; color: #e9ebe0; }
.foglalas .fogl-fej h2.nagy, .foglalas .fogl-lead { color: #f3f3ec; }
.foglalas .felcim { color: #d9b77e; }
.foglalas .kezirat-szurke { color: #dadece; }
.foglalas .kezirat-szurke svg { color: #d9b77e; }
.foglalo-keret { border-color: rgba(255, 255, 255, .12); box-shadow: 0 30px 70px rgba(0, 0, 0, .45), 0 0 0 1px rgba(255, 255, 255, .04); }
@media (min-width: 1101px) {
  .fogl-hatter { width: 500px; right: max(0px, calc((100% - 1240px) / 2 - 40px)); background-position: 178px 14%; background-size: auto 128%;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, transparent 35%, rgba(0,0,0,.45) 50%, #000 78%, #000 92%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, transparent 35%, rgba(0,0,0,.45) 50%, #000 78%, #000 92%, transparent 100%); }
  .fogl-hatter::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(24,48,51,.55), rgba(24,48,51,0) 50%); }
  .fogl-portre { padding-right: 20px; }
}

/* === 2026-10-03 (3. kor) === */
/* zold doboz: a kert uj szoveg */
.tisztelet-szoveg { font-size: 14.5px !important; color: #34413f !important; line-height: 1.5; margin: 0 40px 18px 0 !important; }
.tisztelet-lead { font-weight: 600; margin-bottom: 8px !important; }
.tisztelet-kiemelt { display: grid; grid-template-columns: 22px 1fr; gap: 10px; margin: 4px 0 0 !important; padding: 12px 14px; background: rgba(255, 255, 255, .55); border-radius: 10px; font-size: 14.5px !important; line-height: 1.45; color: #2f3c3c !important; }
.tisztelet-kiemelt svg { width: 20px; height: 20px; fill: none; stroke: var(--sotet); stroke-width: 1.8; margin-top: 1px; }
/* foglalo (asztal): Melitta kepe kozvetlenul a foglalo mellett, a feje nincs levagva, lagy atmenettel */
@media (min-width: 1101px) {
  .fogl-hatter { left: calc(max(32px, (100% - 1240px) / 2) + 540px); right: auto; width: 560px;
    background: url(/assets/img/pmu/melitta-wulop-2026.jpg) 100% 8% / 165% auto no-repeat;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, transparent 8%, rgba(0,0,0,.6) 22%, #000 34%, #000 82%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, transparent 8%, rgba(0,0,0,.6) 22%, #000 34%, #000 82%, transparent 100%); }
  .fogl-hatter::after { background: linear-gradient(180deg, rgba(16,34,31,0) 70%, #12261f 100%); }
  .fogl-racs { grid-template-columns: minmax(0, 600px) 1fr; }
  .fogl-portre { padding: 0 0 18px 150px; }
}

/* === mobil: minden szekcio 1, legfeljebb 2 kepernyo === */
@media (max-width: 700px) {
  h2, h2.nagy, .ar-fej h2.nagy, .fogl-fej h2.nagy, .helyzetek h2, .idopontok h2, .mu-fej h2, .menet h2, .gyogy-fej h2 { font-size: var(--b1); line-height: 1.12; }
  .lead { font-size: var(--b3); }
  .felcim { margin-bottom: 6px; }
  .helyzetek, .eredmenyek, .arak, .mu, .menet, .gyogyulas, .szakember, .velemenyek, .mielott, .gyik, .helyszin { padding-top: 36px !important; padding-bottom: 36px !important; }

  /* hero: csempek nelkul; cim -> kep -> alcim -> Melitta -> harom egyforma gomb */
  .tenyek { display: none; }
  .hero { padding: 18px 0 30px; }
  .hero-racs { display: flex; flex-direction: column; gap: 0; }
  .hero-szoveg { display: contents; }
  .hero h1 { order: 1; font-size: var(--b1); margin: 0 0 14px; }
  .hero-kep { order: 2; aspect-ratio: 1.35; border-radius: 14px; }
  .hero-al { order: 3; font-size: var(--b2); margin: 14px 0 14px; }
  .szakember-mini { order: 4; gap: 12px; margin-bottom: 16px; }
  .cta-blokk { order: 5; }
  .bizalom { order: 6; margin-top: 14px; justify-content: center; }
  .szakember-mini .avatar { width: 54px; height: 54px; }
  .dij-sor { white-space: nowrap; font-size: var(--b4); gap: 5px; margin-top: 4px; }
  .dij-sor b { font-size: var(--b4); }
  .dij-sor svg { width: 14px; height: 14px; }
  .cta-blokk { display: grid; grid-template-columns: 1fr; gap: 10px; width: 100%; }
  .masodlagos { display: grid; grid-template-columns: 1fr; gap: 10px; margin: 0; }
  .cta-blokk .gomb-nagy, .masodlagos .gomb, .masodlagos .link-gomb { width: 100%; min-height: 54px; box-sizing: border-box; justify-content: center; padding: 12px 18px; font-size: var(--b3); }
  .cta-blokk .gomb-nagy { font-size: var(--b3); letter-spacing: .08em; }
  .masodlagos .link-gomb { display: inline-flex; align-items: center; gap: 10px; border: 1px solid var(--sotet); border-radius: 999px; text-decoration: none; background: rgba(255, 255, 255, .45); }

  /* legkozelebbi idopontok: egysoros napok */
  .idopontok { padding: 26px 0 26px; }
  .idopontok-racs { gap: 14px; }
  .idopontok .halk { font-size: var(--b4); margin-top: 6px; }
  .nap-kartyak { gap: 8px; }
  .nap-kartya { min-height: 0; padding: 10px 14px; grid-template-columns: auto 1fr auto; column-gap: 14px; row-gap: 0; align-items: center; }
  .nap-kartya .ikon-kor { display: none; }
  .nap-kartya .datum { grid-column: 1; grid-row: 1; font-size: var(--b2); }
  .nap-kartya .hetnap { grid-column: 1; grid-row: 2; font-size: var(--b4); }
  .nap-kartya .orak { grid-column: 2; grid-row: 1 / 3; margin: 0; font-size: var(--b4); }
  .nap-kartya .kis-nyil { grid-column: 3; grid-row: 1 / 3; align-self: center; }
  .idopontok-racs > div:last-child > .kozepre { margin-top: 12px; }
  .idopontok .gomb-korvonal.gomb-szeles { width: 100%; min-width: 0; padding: 12px 18px; }

  /* melyik helyzet: kis kep + szoveg egymas mellett */
  .helyzetek > .tartalom > .halk { font-size: var(--b4); }
  .helyzet-racs { gap: 10px; margin-top: 16px; }
  .helyzet { grid-template-columns: 92px 1fr; gap: 12px; padding: 10px; }
  .helyzet > img { min-height: 0; height: 100%; max-height: 170px; }
  .helyzet > div:last-child { gap: 5px; padding: 2px 0; }
  .helyzet h3 { font-size: var(--b3); line-height: 1.2; }
  .helyzet p { font-size: var(--b4); line-height: 1.4; }
  .helyzet-terulet { font-size: var(--b4) !important; }
  .helyzet .gomb { align-self: flex-start; padding: 8px 16px; font-size: var(--b4); margin-top: 4px; }
  .figyelmeztet svg { width: 15px; height: 15px; }

  /* arak: pipas lista ket oszlopban, egysoros arkartyak */
  .ar-fej { gap: 12px; margin-bottom: 14px; }
  .tartalmaz { border-left: 0; padding-left: 0; }
  .tartalmaz ul { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 12px; margin-top: 6px; }
  .tartalmaz li { width: auto; min-height: 0; border: 0; padding: 0 0 0 20px; text-align: left; font-size: var(--b4); position: relative; }
  .tartalmaz li br, .tartalmaz li svg { display: none; }
  .tartalmaz li::before { content: '✓'; position: absolute; left: 0; top: 0; color: var(--zold, #3f7652); font-weight: 700; }
  .ar-racs { gap: 8px; }
  .ar-kartya { display: grid; grid-template-columns: 74px 1fr; }
  .ar-kartya img { aspect-ratio: auto; height: 100%; min-height: 74px; }
  .ar-kartya > div { display: grid; grid-template-columns: 1fr auto; column-gap: 10px; align-items: center; padding: 9px 12px; }
  .ar-kartya h3 { grid-column: 1; font-size: var(--b3); }
  .ar-kartya .ar { grid-column: 1; font-size: var(--b2); margin: 2px 0 0; }
  .ar-kartya .ar-regi { font-size: var(--b4); }
  .ar-kartya p.ar-ido { grid-column: 1; margin: 0; font-size: var(--b4); }
  .ar-kartya p:not(.ar):not(.ar-ido) { display: none; }
  .ar-kartya .gomb { grid-column: 2; grid-row: 1 / 4; margin: 0; align-self: center; padding: 9px 12px; font-size: 0; letter-spacing: .1em; }
  .ar-kartya .gomb::after { content: 'Időpont →'; font-size: var(--b4); }
  .eloleg { grid-template-columns: auto 1fr; gap: 4px 14px; padding: 12px 16px; margin-top: 12px; }
  .eloleg .ermek { width: 34px; height: 34px; grid-row: 1 / 3; }
  .eloleg-cim { font-size: var(--b2); padding: 0; }
  .eloleg-szoveg { font-size: var(--b4); }
  .eloleg-szoveg br { display: none; }

  /* mitol nem lesz mu hatasu: kis kep + szoveg soronkent */
  .mu-fej { gap: 14px; margin-bottom: 16px; }
  .jegyzet { padding: 12px 14px; gap: 10px; }
  .jegyzet h3 { font-size: var(--b3); }
  .jegyzet p { margin-top: 4px; }
  .lepes-racs { gap: 8px; }
  .lepes-racs li { display: grid; grid-template-columns: 84px 1fr; column-gap: 12px; padding: 10px; align-items: start; }
  .lepes-racs img { grid-column: 1; grid-row: 1 / 3; aspect-ratio: 1; height: auto; }
  .lepes-fej { grid-column: 2; min-height: 0; gap: 8px; }
  .lepes-racs .szam { width: 24px; height: 24px; font-size: var(--b4); }
  .lepes-racs h3 { font-size: var(--b3); }
  .lepes-racs p { grid-column: 2; margin: 4px 0 0; font-size: var(--b4); }

  /* igy zajlik: egyszeru vizszintes abra */
  .menet-racs { gap: 18px; }
  .idovonal { grid-template-columns: repeat(4, 1fr); gap: 4px; margin-top: 20px; position: relative; }
  .idovonal::before { content: ''; position: absolute; left: 12.5%; right: 12.5%; top: 20px; height: 2px; background: linear-gradient(90deg, var(--arany), #c9b089); }
  .idovonal li { text-align: center; }
  .idovonal .ikon-kor { position: relative; width: 40px; height: 40px; border: 2px solid #fff; }
  .idovonal h3 { font-size: var(--b4); margin: 8px 0 0; }
  .idovonal p { display: none; }
  .nyugi { min-height: 0; padding: 14px 16px 14px 62px; }
  .nyugi svg { width: 32px; height: 32px; top: 16px; left: 16px; }
  .nyugi h3 { margin-top: 0 !important; font-size: var(--b2); }
  .nyugi p { margin-top: 4px; font-size: var(--b4); }

  /* gyogyulas: 2x2 kompakt */
  .gyogy-fej { gap: 10px; margin-bottom: 14px; }
  .gyogy-fej aside { border-left: 2px solid var(--vonal); padding-left: 12px; }
  .gyogy-fej aside h3 { font-size: var(--b3); display: inline; }
  .gyogy-fej aside p { display: inline; font-size: var(--b4); }
  .gyogy-sor { grid-template-columns: 1fr 1fr; gap: 14px 12px; }
  .gyogy-sor p { font-size: var(--b4); margin-top: 6px; line-height: 1.4; }
  .szemoldok-rajz { aspect-ratio: 2; }

  /* zold doboz */
  .tisztelet-szoveg { margin-right: 0 !important; }
}
@media (max-width: 700px) {
  .gyogy-fej aside h3::after { content: '\00a0'; }
  .masodlagos .gomb svg { display: none; }
  .masodlagos .gomb::after { content: '→'; }
  .lemondas-abra small { text-wrap: balance; }
  .utak h4 { font-size: var(--b2); }
  .utak p { font-size: var(--b4); }
}

@media (max-width: 700px) { :root { --b1: 30px; --b2: 19px; --b3: 15px; --b4: 12.5px; } }

/* === 2026-10-03 (4. kor): MOSAIC-szinvilag === */
/* a foglalas-gomb mindenhol egyforma: a MOSAIC arany gombja (hover: MOSAIC-zold) */
.gomb-sotet, .gomb-bezs, .idopontok .gomb-korvonal.gomb-szeles { background: linear-gradient(#c6a346, #d9c164); border-color: transparent; color: #fff; text-shadow: 0 1px 2px rgba(80, 60, 10, .35); box-shadow: 0 6px 18px rgba(150, 120, 40, .22); }
.gomb-sotet:hover, .gomb-bezs:hover, .idopontok .gomb-korvonal.gomb-szeles:hover { background: #3f7652; text-shadow: none; }
.gomb-bezs { font-size: 11px; letter-spacing: .14em; }
/* nem AI-generalt kepek + Instagram */
.nem-ai { flex-wrap: wrap; row-gap: 6px; }
.nem-ai .insta { display: inline-flex; align-items: center; gap: 7px; margin-left: 6px; padding: 5px 12px 5px 10px; border-radius: 999px; background: #183033; color: #fff; text-decoration: none; font-weight: 500; white-space: nowrap; }
.nem-ai .insta:hover { background: #3f7652; }
.nem-ai .insta svg { width: 18px; height: 18px; color: #fff; stroke: currentColor; fill: none; stroke-width: 1.8; }
/* mielott foglalsz: az "ingyenes" cimke a felirat mellett */
.ut-tipus { white-space: nowrap; }
@media (max-width: 700px) {
  /* az elso kepernyon a teljes fo gomb latszik: cim -> rovidebb kep -> alcim -> gomb */
  .hero h1 { margin-bottom: 10px; }
  .hero-kep { aspect-ratio: 1.75; }
  .hero-al { margin: 10px 0 12px; }
  .cta-blokk { order: 4; }
  .szakember-mini { order: 5; margin: 16px 0 0; }
  .bizalom { order: 6; }
  .masodlagos .gomb, .masodlagos .link-gomb { min-height: 44px; padding: 8px 16px; font-size: var(--b4); }
  .nem-ai .insta { margin: 2px 0 0; }
  /* GYIK mobilon legalul */
  main { display: flex; flex-direction: column; }
  main > .gyik { order: 2; }
  /* foglalas: csak a cim marad */
  .foglalas .felcim, .foglalas .kezirat-szurke { display: none; }
}
@media (max-width: 700px) {
  .ut-tipus { letter-spacing: .06em; }
  .ut-tipus small { margin-left: 2px; }
}
@media (max-width: 400px) { .dij-hosszu { display: none; } }
@media (max-width: 700px) {
  .ut-tipus { white-space: normal; }
  .ut-tipus small { white-space: nowrap; }
}
@media (max-width: 700px) {
  .mielott-bal { padding-left: 16px !important; padding-right: 16px !important; }
  .utak li { grid-template-columns: 36px 1fr; gap: 10px; }
  .ut-ikon { width: 36px; height: 36px; }
  .ut-ikon svg { width: 18px; height: 18px; }
  .ut-tipus { white-space: nowrap; letter-spacing: .04em; }
  .nem-ai { border-radius: 14px; text-align: center; }
}
@media (max-width: 370px) { .ut-tipus { white-space: normal; } }

/* === 2026-10-03 (5. kor) === */
/* hero: ar szemoldokre, az ajak kisebben; a betet masodik kepe "gyogyult eredmeny" */
.tenyek-al { display: block; color: var(--halk); font-size: var(--b4); }
.betet-kep .cimke { white-space: normal; text-align: center; line-height: 1.15; letter-spacing: .08em; max-width: calc(100% - 12px); }
/* helyzetek: a hosszu cim es a gomb ne logjon ki a kartyabol */
.helyzet > div:last-child { min-width: 0; }
.helyzet h3 { overflow-wrap: anywhere; hyphens: auto; }
.helyzet .gomb { max-width: 100%; }
/* 6 kiemelt eset problematipus szerint */
.eset-racs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 8px; }
.eset { margin: 0; background: #fff; border-radius: 14px; overflow: hidden; border: 1px solid #e3e8e1; box-shadow: var(--arnyek); display: flex; flex-direction: column; }
.eset-kep { position: relative; aspect-ratio: 1.25; background: #e5e8e0; }
.eset-kep img { width: 100%; height: 100%; object-fit: cover; }
.eset[data-irany="lr"] .eset-kep img, .eset[data-irany="tb"] .eset-kep img, .eset[data-irany="bt"] .eset-kep img { object-fit: cover; object-position: 50% 50%; }
.eset[data-irany="tb"] .eset-kep, .eset[data-irany="bt"] .eset-kep { aspect-ratio: 1; }
.eset-cimke { position: absolute; background: rgba(255, 255, 255, .92); color: #2c2c2c; font: 600 var(--b4)/1 var(--test); letter-spacing: .12em; text-transform: uppercase; padding: 6px 10px; border-radius: 999px; }
.eset-cimke.utana { background: #183033; color: #fff; }
.eset[data-irany="lr"] .elotte { left: 10px; bottom: 10px; }
.eset[data-irany="lr"] .utana { right: 10px; bottom: 10px; }
.eset[data-irany="tb"] .elotte { left: 10px; top: 10px; }
.eset[data-irany="tb"] .utana { left: 10px; top: calc(50% + 10px); }
.eset[data-irany="bt"] .utana { left: 10px; top: 10px; }
.eset[data-irany="bt"] .elotte { left: 10px; top: calc(63% + 8px); }
.eset figcaption { padding: 14px 16px 16px; display: grid; gap: 4px; }
.eset-tipus { font: 600 var(--b4)/1.2 var(--test); letter-spacing: .16em; text-transform: uppercase; color: var(--arany); }
.eset figcaption b { font: 500 var(--b2)/1.2 var(--cim); color: var(--szoveg); }
.eset figcaption > span:last-child { font-size: var(--b4); color: var(--halk); line-height: 1.45; }
.eredmenyek .kozepre .gomb { margin-top: 22px; }
/* tovabbi eredmenyek: az arak utan, kattintasra nyilik */
.galeria { padding: 44px 0 50px; background: #f7f8f6; border-top: 1px solid var(--vonal); }
.galeria .halk { margin: 8px 0 18px; }
.galeria .szuro { margin: 18px 0; }
/* mitol nem lesz mu hatasu: a 3. lepes (jovahagyas) kiemelve - petrol hatter, de nem gomb-szeru */
.lepes-racs li.kiemelt { background: #183033; border: 2px solid #c6a346; transform: none; box-shadow: none; cursor: default; position: relative; }
.lepes-racs li.kiemelt h3 { color: #fff; font: 500 var(--b3)/1.25 var(--cim); letter-spacing: 0; text-transform: none; }
.lepes-racs li.kiemelt p { color: #dfe8e6; }
.lepes-racs li.kiemelt .szam { background: #d9c164; color: #183033; }
.lepes-racs li.kiemelt p.kiemelt-cimke { position: absolute; top: -11px; left: 50%; transform: translateX(-50%); margin: 0; flex: none; white-space: nowrap; background: #c6a346; color: #fff; font: 600 var(--b4)/1 var(--test); letter-spacing: .1em; text-transform: uppercase; padding: 5px 10px; border-radius: 999px; }
/* menet: "Mindenkepp felhivunk!" doboz */
.nyugi svg { color: #183033; }
.nyugi h3 { color: #183033; }
@media (max-width: 1100px) { .eset-racs { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 700px) {
  .eset-racs { grid-template-columns: 1fr 1fr; gap: 10px; }
  .eset figcaption { padding: 8px 10px 10px; gap: 2px; }
  .eset-cimke { padding: 4px 7px; letter-spacing: .06em; }
  .eset figcaption > span:last-child { display: none; }
  .galeria { padding: 30px 0 34px; }
  .lepes-racs li.kiemelt { margin-top: 10px; }
  .lepes-racs li.kiemelt p.kiemelt-cimke { left: auto; right: 10px; transform: none; }
}
@media (max-width: 700px) { .eset-kep, .eset[data-irany] .eset-kep { aspect-ratio: 1; } }
.helyzet h3 { overflow-wrap: normal; hyphens: manual; }
@media (min-width: 1101px) and (max-width: 1300px) { .helyzet { grid-template-columns: 36% 1fr; } }
.tisztelet-lead { margin-right: 0 !important; }
@media (min-width: 1241px) { .tisztelet-lead { white-space: nowrap; } }
@media (min-width: 1101px) and (max-width: 1240px) { .tisztelet-lead { font-size: var(--b4) !important; white-space: nowrap; } }

/* === 2026-10-03 (6. kor) === */
/* arkartyak: a gomb a kartya kozepen, teljes szelessegben, nem log ki */
@media (min-width: 701px) {
  .ar-kartya .gomb { align-self: stretch; justify-content: center; padding: 10px 8px; white-space: nowrap; letter-spacing: .1em; }
}
/* a MOSAIC fejlec rozsaszin akcios sava (headspa-akcio) a sminktetovalas oldalon nem kell */
#comp-mpv0gaod { display: none !important; }
/* terkep: a MOSAIC Google-ertekelese a terkepen */
.terkep-ertekeles { position: absolute; right: 12px; top: 12px; z-index: 3; display: flex; align-items: center; gap: 10px; background: #fff; border-radius: 10px; padding: 9px 14px 9px 10px; box-shadow: 0 6px 20px rgba(0, 0, 0, .18); text-decoration: none; color: var(--szoveg); line-height: 1.2; }
.terkep-ertekeles svg { width: 26px; height: 26px; flex: none; }
.terkep-ertekeles b { font-weight: 600; font-size: 14px; }
.terkep-ertekeles .te-sor { display: flex; align-items: center; gap: 6px; margin-top: 2px; }
.terkep-ertekeles .csillagok { color: #f4b400; letter-spacing: 1px; font-size: 15px; }
.terkep-ertekeles small { display: block; font-size: 12px; color: var(--halk); }
.terkep-gomb { z-index: 3; white-space: nowrap; }
@media (max-width: 700px) { .terkep-ertekeles { right: 8px; top: auto; bottom: 56px; } }

/* === 2026-10-04 === */
/* hero-betet: csak a ket tiszta kep (felirat es elvalaszto vonal nelkul) */
.betet-kep { background: #ddd var(--kep) 50% 50% / cover no-repeat; }
#te-minosites { font-size: 13px; font-weight: 500; color: var(--szoveg); }
/* mobil: minden szekciocim egyforma (30 px), a dobozcimek 19 px */
@media (max-width: 700px) {
  main h2, main h2.nagy, .szakember h2, .helyszin h2.nagy, .gyik h2, .mielott h2, .velemenyek h2, .eredmenyek h2 { font-size: var(--b1) !important; line-height: 1.12; }
  .mielott-bal > h3, .mielott-jobb > h3 { font-size: var(--b2) !important; }
  /* hero: az elso kepernyon Melitta is teljesen latszik */
  .hero { padding-top: 12px; }
  .hero h1 { margin-bottom: 8px; }
  .hero-kep { aspect-ratio: 1.9; }
  .hero-al { font-size: var(--b3); margin: 8px 0 10px; }
  .cta-blokk, .masodlagos { gap: 8px; }
  .cta-blokk .gomb-nagy { min-height: 50px; }
  .masodlagos .gomb, .masodlagos .link-gomb { min-height: 40px; padding: 6px 16px; }
  .szakember-mini { margin-top: 12px; }
}
/* asztal: a zold menucsikban a logo felett es alatt ugyanannyi hely */
@media (min-width: 701px) {
  #SITE_HEADER, #bgLayers_SITE_HEADER, #bgLayers_SITE_HEADER > div { min-height: 70px !important; height: 70px !important; }
  #comp-m3znboq3 { margin-top: 8px !important; }
  #comp-m4lbfl1t { margin-top: 17px !important; }
  #comp-m7q6eklh, #comp-m7jcfhgp { margin-top: 20px !important; }
}
/* csillagok: szurke alap + arany reteg a valos ertekig (fel csillag is) */
.te-csillagok { position: relative; display: inline-block; font-size: 15px; letter-spacing: 1px; line-height: 1; color: #dadce0; }
.te-csillagok::before { content: '★★★★★'; }
.te-csillagok::after { content: '★★★★★'; position: absolute; left: 0; top: 0; width: var(--ert, 100%); overflow: hidden; white-space: nowrap; color: #f4b400; }

/* ============ hero-galeria: a teljes folyamat egy vendegen (1:1 minden kijelzon) ============ */
.hero-kep.hero-galeria { aspect-ratio: 1 / 1; background: #e8e4dc; }
.galeria-sav { display: flex; height: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
.galeria-sav::-webkit-scrollbar { display: none; }
.galeria-sav:focus-visible { outline: 3px solid var(--arany, #c6a346); outline-offset: -3px; }
.galeria-kep { flex: 0 0 100%; width: 100%; height: 100%; object-fit: cover; scroll-snap-align: start; scroll-snap-stop: always; }
.galeria-nyil { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 40px; height: 40px; padding: 0 0 4px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .9); color: var(--sotet, #183033); font: 400 28px/1 var(--test, sans-serif); box-shadow: 0 4px 14px rgba(0, 0, 0, .22); cursor: pointer; display: grid; place-items: center; transition: opacity .2s; }
.galeria-elozo { left: 10px; }
.galeria-kov { right: 10px; }
.galeria-nyil:disabled { opacity: 0; pointer-events: none; }
.galeria-pontok { position: absolute; left: 0; right: 0; bottom: 6px; z-index: 2; display: flex; justify-content: center; }
.galeria-pontok button { width: 24px; height: 24px; padding: 0; border: 0; background: none; cursor: pointer; display: grid; place-items: center; }
.galeria-pontok button::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: rgba(255, 255, 255, .72); box-shadow: 0 0 0 1px rgba(0, 0, 0, .18); transition: width .2s, background .2s; }
.galeria-pontok button[aria-current="true"]::before { width: 20px; border-radius: 4px; background: #fff; }
@media (max-width: 700px) { .galeria-nyil { width: 34px; height: 34px; font-size: 24px; } .galeria-elozo { left: 8px; } .galeria-kov { right: 8px; } }

/* ============ Mielott foglalsz, jobb oldal: berajzolom, hogyan fog kinezni (elorajzolt / kesz) ============ */
.mielott-jobb.konz { display: flex; flex-direction: column; }
.mielott-jobb.konz > h3 { font-size: 26px; line-height: 1.2; margin: 0 0 12px; }
.mielott-jobb.konz .tisztelet-lead { margin: 0 0 8px !important; }
.mielott-jobb.konz .tisztelet-szoveg { margin: 0; font-size: 15px; line-height: 1.55; }
.konz-montazs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: auto; padding-top: 20px; }
.konz-montazs figure { position: relative; margin: 0; aspect-ratio: 1 / 1; border-radius: 10px; overflow: hidden; background: #d9ddd2; }
.konz-montazs img { display: block; width: 100%; height: 100%; object-fit: cover; }
.konz-cimke { position: absolute; left: 8px; bottom: 8px; padding: 6px 11px; border-radius: 999px; background: rgba(255, 255, 255, .93); color: var(--sotet, #183033); font: 600 11px/1 var(--test, sans-serif); letter-spacing: .08em; text-transform: uppercase; }

/* ============ hero-galeria: sztori-feliratok (arcra nem lognak: kep-specifikus hely, halvany takaro) ============ */
.galeria-dia { position: relative; flex: 0 0 100%; width: 100%; height: 100%; margin: 0; scroll-snap-align: start; scroll-snap-stop: always; }
.galeria-dia .galeria-kep { display: block; width: 100%; height: 100%; object-fit: cover; }
.galeria-felirat { position: absolute; left: 0; right: 0; bottom: 0; padding: 44px 22px 36px; color: #fff; font: 500 17px/1.35 var(--test, sans-serif); text-align: center; text-wrap: balance; text-shadow: 0 1px 8px rgba(0, 0, 0, .5); background: linear-gradient(to top, rgba(12, 20, 22, .5), rgba(12, 20, 22, 0)); pointer-events: none; }
.galeria-felirat--felso { top: 0; bottom: auto; padding: 20px 22px 44px; background: linear-gradient(to bottom, rgba(12, 20, 22, .5), rgba(12, 20, 22, 0)); }
/* a lapozo pottyok minden kepen latszanak (also halvany sav + sotet gyuru) */
.hero-galeria::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 52px; background: linear-gradient(to top, rgba(12, 20, 22, .4), rgba(12, 20, 22, 0)); pointer-events: none; z-index: 1; }
.galeria-pontok { z-index: 2; bottom: 8px; }
.galeria-pontok button::before { box-shadow: 0 0 0 1px rgba(0, 0, 0, .35), 0 1px 4px rgba(0, 0, 0, .3); }
@media (max-width: 700px) {
  .galeria-felirat { font-size: 13.5px; padding: 30px 14px 32px; }
  .galeria-felirat--felso { padding: 14px 14px 30px; }
}

/* ============ Mielott foglalsz, jobb oldal: a cim asztalon egy sorban ============ */
/* a szoveg szelessege ~23,7 x betumeret; a doboz belso szelessege 1102 px-nel ~437 px, 1440 px-nel ~526 px (afolott allando) */
@media (min-width: 1101px) { .mielott-jobb.konz > h3 { font-size: clamp(16px, calc(5.6px + 1.02vw), 21px); white-space: nowrap; margin-right: 0; } }

/* ============ terkep: ha a Google terkep betoltott, annak sajat kartyaja eleg (a MOSAIC-jelveny csak tartalek) ============ */
.terkep.betoltve .terkep-ertekeles { display: none; }

/* ============ alul a ket kep: fix keparanny, ne a szazalekos magassag adja (egyes bongeszokben egymasra logott) ============ */
@media (max-width: 1100px) {
  .hely-kepek { grid-template-rows: none; grid-template-columns: 1fr 1fr; }
  .hely-kepek img { height: auto; min-height: 0; aspect-ratio: 4 / 3; }
}

/* ============ mobil: a cimek kozepre, a sarga felcimek kiesnek, a videokartya teljes szelessegu ============ */
@media (max-width: 700px) {
  .felcim:not(.kicsi) { display: none; }
  main h2, main h2.nagy, .tartalom h2 { text-align: center; }
  h2 + .lead, h2 + .halk { text-align: center; }
  .cim-vonallal { display: block; }
  .cim-vonallal .vonal { display: none; }
  .mielott-jobb.konz > h3 { text-align: center; }
  .szakember-video { width: 100%; padding: 8px 0 24px; }
  .video-kartya { width: 100%; }
  .video-kep { aspect-ratio: 1 / 1; }
}

/* ============ konzultacios doboz: cim, alcim es szoveg kozepre ============ */
.mielott-jobb.konz, .mielott-jobb.konz > h3, .mielott-jobb.konz .tisztelet-lead, .mielott-jobb.konz .tisztelet-szoveg { text-align: center; }
.mielott-jobb.konz .tisztelet-szoveg { max-width: 470px; margin-left: auto; margin-right: auto; text-wrap: balance; }

/* ============ a sarga felcimek (Fontos informaciok, Elolleg nelkul ...) minden kijelzon kiesnek ============ */
.felcim:not(.kicsi) { display: none; }

/* ============ mobil: a konzultacios keppar (Elorajzolva / Kesz szemoldok) egymas alatt, majdnem teljes szelessegben ============ */
@media (max-width: 700px) {
  .mielott-jobb.konz { padding: 24px 12px 14px; }
  .konz-montazs { grid-template-columns: 1fr; gap: 10px; padding-top: 16px; }
  .konz-cimke { left: 10px; bottom: 10px; font-size: 12px; padding: 7px 13px; }
}

/* ============ asztalon (>= 1101 px) a galeria magassaga a bal oszlopeval egyezik: addig er le, ahol a Google-ertekeles vegzodik ============ */
@media (min-width: 1101px) {
  .hero-racs { align-items: stretch; }
  .hero-kep.hero-galeria { aspect-ratio: auto; min-height: 400px; }
  .hero-galeria .galeria-sav { position: absolute; inset: 0; height: auto; }
}

/* ============ HARMAS GARANCIA ============ */
.garancia { padding: 58px 0 50px; background: #f7f8f6; }
.garancia h2 { font-size: 42px; }
.garancia > .tartalom > .halk { margin-top: 10px; }
.garancia-racs { list-style: none; margin: 30px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.garancia-kartya { background: #fff; border: 1px solid #e7eae3; border-radius: 16px; padding: 30px 26px 28px; text-align: center; box-shadow: var(--arnyek); display: flex; flex-direction: column; align-items: center; }
.garancia-jelveny { position: relative; flex: none; width: 88px; height: 88px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(145deg, #e8d596, #b8963f 55%, #d9c164); box-shadow: 0 10px 22px rgba(150, 120, 40, .3); }
.garancia-jelveny::before { content: ''; position: absolute; inset: 5px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .6); }
.garancia-jelveny > span { width: 66px; height: 66px; border-radius: 50%; background: var(--sotet); display: grid; place-items: center; }
.garancia-jelveny svg { width: 30px; height: 30px; fill: none; stroke: #f1e2b4; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.garancia-sorszam { font: 600 11px/1 var(--test) !important; letter-spacing: .18em; text-transform: uppercase; color: var(--arany) !important; margin: 20px 0 8px; }
.garancia-kartya h3 { font: 500 22px/1.2 var(--cim); color: var(--sotet); }
.garancia-kartya p { font-size: 14.5px; color: #3f4b4b; line-height: 1.55; margin-top: 12px; }
.garancia-kartya .garancia-sorszam { margin-top: 20px; }
.garancia-megj { margin-top: 20px; font-size: 13px; color: var(--halk); }

/* ============ FOGLALAS UTAN 24 ORAN BELUL HIVLAK ============ */
.hivas { padding: 58px 0; background: linear-gradient(#eef0ea, #e7eae2); border-top: 1px solid var(--vonal); }
.hivas-racs { display: grid; grid-template-columns: 390px 1fr; gap: 54px; align-items: center; }
.hivas-kep { margin: 0; position: relative; border-radius: 18px; overflow: hidden; box-shadow: 0 18px 40px rgba(60, 40, 20, .14); aspect-ratio: 4 / 5; background: #dfe3d8; }
.hivas-kep img { display: block; width: 100%; height: 100%; object-fit: cover; }
.hivas-cimke { position: absolute; left: 14px; bottom: 14px; padding: 7px 13px; border-radius: 999px; background: rgba(255, 255, 255, .93); color: var(--sotet); font: 600 11px/1 var(--test); letter-spacing: .08em; text-transform: uppercase; }
.hivas-szoveg h2 { font-size: 40px; line-height: 1.12; }
.hivas-szoveg .lead { font-size: 17px; margin-top: 14px; }
.hivas-lepesek { list-style: none; margin: 26px 0 0; padding: 0; display: grid; gap: 16px; }
.hivas-lepesek li { display: grid; grid-template-columns: 40px 1fr; gap: 16px; align-items: start; }
.hivas-szam { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(#c6a346, #d9c164); color: #fff; font: 500 17px/1 var(--cim); box-shadow: 0 4px 12px rgba(150, 120, 40, .25); }
.hivas-lepesek b { display: block; font: 500 20px/1.25 var(--cim); color: var(--sotet); }
.hivas-lepesek p { font-size: 14.5px; color: #3f4b4b; margin-top: 4px; line-height: 1.5; }
.hivas-megj { margin-top: 22px; font-size: 14.5px; color: #3f4b4b; font-style: italic; }
.hivas-gombok { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin-top: 22px; }

@media (max-width: 1100px) {
  .garancia-racs { grid-template-columns: 1fr; }
  .hivas-racs { grid-template-columns: 1fr; gap: 28px; }
  .hivas-kep { max-width: 420px; margin: 0 auto; width: 100%; }
}
@media (max-width: 700px) {
  .garancia, .hivas { padding-top: 36px !important; padding-bottom: 36px !important; }
  .garancia h2, .hivas-szoveg h2 { font-size: var(--b1); line-height: 1.12; }
  .garancia-racs { margin-top: 20px; gap: 12px; }
  .garancia-kartya { display: grid; grid-template-columns: 58px 1fr; column-gap: 14px; align-items: start; text-align: left; padding: 16px 16px 18px; }
  .garancia-jelveny { grid-row: 1 / span 3; width: 58px; height: 58px; box-shadow: 0 6px 14px rgba(150, 120, 40, .28); }
  .garancia-jelveny::before { inset: 3px; }
  .garancia-jelveny > span { width: 44px; height: 44px; }
  .garancia-jelveny svg { width: 21px; height: 21px; }
  .garancia-kartya .garancia-sorszam { margin: 2px 0 4px; font-size: 10px !important; }
  .garancia-kartya h3 { font-size: 19px; }
  .garancia-kartya p { font-size: 14px; margin-top: 8px; }
  .garancia-megj { font-size: 12.5px; }
  .hivas-szoveg { text-align: left; }
  .hivas-szoveg h2 { text-align: center; }
  .hivas-szoveg .lead { text-align: center; font-size: var(--b3); }
  .hivas-lepesek b { font-size: 18px; }
  .hivas-gombok { justify-content: center; }
  .hivas-gombok .gomb { width: 100%; }
  .hivas-megj { text-align: center; }
}

/* ============ hero: "Mutasd az eredményeket" link (csak mobilon; az Eredmények szekcióhoz görget, hash nélkül) ============ */
.eredmeny-link { display: none; }
@media (max-width: 700px) {
  .bizalom { gap: 8px 16px; }
  .eredmeny-link { display: inline-flex; align-items: center; gap: 6px; padding: 4px 2px; font: 500 14px/1.2 var(--test); color: var(--sotet); }
}