/* ==========================================================================
   R2 Állatpatika – oldalelrendezés
   Minden szín, betű és alapelem az r2.css-ből (a jóváhagyott arculatból) jön.
   ========================================================================== */

/* ---------- Alapok ---------- */
html { scroll-behavior: smooth; scroll-padding-top: 5.5rem; -webkit-text-size-adjust: 100%; }
body { overflow-x: clip; }
a { color: inherit; }
img { height: auto; }
p { margin: 0 0 1em; }
.keret { width: min(100% - 2.5rem, 1200px); margin-inline: auto; }
.keret--keskeny { width: min(100% - 2.5rem, 760px); margin-inline: auto; }
.szakasz { padding-block: clamp(4rem, 9vw, 7.5rem); position: relative; }
.hatter-krem { background: var(--r2-krem); }
.hatter-feher { background: var(--r2-feher); }
.hatter-sarga { background: var(--r2-sarga); }
.hatter-barack { background: var(--r2-barack); }
.hatter-vaj { background: var(--r2-vaj); }
.hatter-fekete { background: var(--r2-fekete); color: var(--r2-feher); }
.hatter-fekete .t-apro { color: rgba(255, 255, 255, .64); }
.hatter-fekete .t-lead { color: rgba(255, 255, 255, .82); }
/* azonos színű egymást követő szakaszok ne duplázzák a térközt */
.hatter-krem + .hatter-krem, .hatter-feher + .hatter-feher, .hatter-sarga + .hatter-sarga,
.hatter-barack + .hatter-barack, .hatter-vaj + .hatter-vaj, .hatter-fekete + .hatter-fekete { padding-top: 0; }
.egyben { white-space: nowrap; }
.sor { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.blokkfej { display: grid; gap: 1rem; margin-bottom: clamp(2rem, 4.5vw, 3.5rem); max-width: 44rem; justify-items: start; }
.blokkfej--szeles { max-width: none; grid-template-columns: 1fr; align-items: end; }
@media (min-width: 860px) { .blokkfej--szeles { grid-template-columns: minmax(0, 44rem) auto; justify-content: space-between; } }
.blokkfej__bal { display: grid; gap: 1rem; justify-items: start; }
.blokkfej--kozep { margin-inline: auto; text-align: center; justify-items: center; }
.ugras { position: absolute; left: 1rem; top: -5rem; z-index: 100; }
.ugras:focus { top: 1rem; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.gomb--feher-korvonal { background: transparent; color: var(--r2-feher); border-color: var(--r2-feher); }
.gomb--feher-korvonal:hover { background: var(--r2-feher); color: var(--r2-fekete); }
.hatter-fekete .gomb:not(.gomb--sarga):not(.gomb--feher-korvonal) { background: var(--r2-sarga); color: var(--r2-fekete); border-color: var(--r2-sarga); }
.hatter-sarga .gomb--sarga { background: var(--r2-fekete); color: var(--r2-feher); border-color: var(--r2-fekete); }
.gomb svg { transition: transform var(--gyors); }
.gomb:hover svg { transform: translateX(3px); }

/* megjelenés görgetéskor */
.js .rv { opacity: 0; transform: translateY(28px); transition: opacity .7s cubic-bezier(.2, .7, .2, 1), transform .7s cubic-bezier(.2, .7, .2, 1); transition-delay: var(--k, 0ms); }
.js .rv.lathato { opacity: 1; transform: none; }

/* ---------- Fejléc ---------- */
.fejlec { position: sticky; top: 0; z-index: 50; background: var(--r2-sarga); transition: box-shadow var(--gyors); }
.admin-bar .fejlec { top: 32px; }
@media (max-width: 782px) { .admin-bar .fejlec { top: 46px; } }
@media (max-width: 600px) { .admin-bar .fejlec { top: 0; } }
.fejlec.gorgetve { box-shadow: 0 2px 0 var(--r2-fekete); }
.fejlec__belso { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 4.75rem; }
.fejlec .fejlec-logo img { height: 54px; width: auto; }
.fejlec .fejlec-logo span { font-size: .9375rem; }
@media (max-width: 380px) { .fejlec .fejlec-logo span { font-size: .8125rem; letter-spacing: .16em; } }
.fomenu { display: none; gap: clamp(1rem, 1.8vw, 1.75rem); }
.fomenu a { position: relative; padding: .375rem 0; font-weight: 700; font-size: .9875rem; text-decoration: none; white-space: nowrap; }
.fomenu a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 3px; border-radius: 3px; background: var(--r2-fekete); transform: scaleX(0); transform-origin: left; transition: transform var(--gyors); }
.fomenu a:hover::after, .fomenu a:focus-visible::after, .fomenu a[aria-current]::after { transform: scaleX(1); }
.fomenu a:focus-visible { outline: none; }
.fejlec__gomb { display: none; }
.menugomb { display: inline-grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; border: 0; background: var(--r2-fekete); color: var(--r2-feher); cursor: pointer; position: relative; z-index: 60; }
.menugomb svg { width: 1.375rem; height: 1.375rem; }
.menugomb .zar { display: none; }
.menugomb:focus-visible { outline: 3px solid var(--r2-barna); outline-offset: 3px; }
@media (min-width: 1120px) { .fomenu { display: flex; } .fejlec__gomb { display: inline-flex; } .menugomb { display: none; } }

.mobilmenu { position: fixed; inset: 0; z-index: 40; background: var(--r2-fekete); color: var(--r2-feher); padding: 6.5rem 1.25rem max(2rem, env(safe-area-inset-bottom)); display: grid; align-content: space-between; gap: 2rem; overflow-y: auto; visibility: hidden; opacity: 0; transform: translateY(-12px); transition: opacity .25s, transform .25s, visibility .25s; }
.menu-nyitva .mobilmenu { visibility: visible; opacity: 1; transform: none; }
.menu-nyitva { overflow: hidden; }
.menu-nyitva .fejlec { background: var(--r2-fekete); box-shadow: none; }
.menu-nyitva .fejlec .fejlec-logo { color: var(--r2-feher); }
.menu-nyitva .menugomb { background: var(--r2-sarga); color: var(--r2-fekete); }
.menu-nyitva .menugomb .nyit { display: none; } .menu-nyitva .menugomb .zar { display: block; }
.mobilmenu nav { display: grid; }
.mobilmenu nav a { font-size: clamp(1.75rem, 7vw, 2.5rem); font-weight: 800; letter-spacing: -.02em; text-decoration: none; padding: .5rem 0; border-bottom: 1px solid rgba(255, 255, 255, .14); }
.mobilmenu nav a[aria-current] { color: var(--r2-sarga); }
.mobilmenu nav a:hover, .mobilmenu nav a:focus-visible { color: var(--r2-sarga); outline: none; }
.mobilmenu__lab { display: grid; gap: 1rem; justify-items: start; }
.mobilmenu__lab .gomb { justify-content: center; width: 100%; }
.mobilmenu .cimke { background: #3A3A3A; }
.mobilmenu__elerhetoseg { color: rgba(255, 255, 255, .7); font-size: .9375rem; }
.mobilmenu__elerhetoseg a { text-decoration: none; font-weight: 700; color: var(--r2-feher); }

/* ---------- Nyitókép ---------- */
.hos { padding-block: clamp(1.5rem, 4vw, 3.5rem) 0; overflow: hidden; }
.hos__racs { display: grid; gap: clamp(2.5rem, 5vw, 4rem); align-items: center; }
@media (min-width: 900px) { .hos__racs { grid-template-columns: 1.05fr .95fr; } }
.hos__racs--kep-nelkul { grid-template-columns: 1fr !important; max-width: 52rem; }
.hos__szoveg { display: grid; gap: 1.5rem; justify-items: start; }
.hos__szoveg > * { animation: felbuk .8s cubic-bezier(.2, .8, .2, 1) both; }
.hos__szoveg > :nth-child(2) { animation-delay: .08s; } .hos__szoveg > :nth-child(3) { animation-delay: .16s; } .hos__szoveg > :nth-child(4) { animation-delay: .24s; }
@keyframes felbuk { from { opacity: 0; transform: translateY(26px); } }
.hos__kep { position: relative; animation: felbuk 1s .15s cubic-bezier(.2, .8, .2, 1) both; }
.hos__kep > img { width: 100%; height: auto; aspect-ratio: 5 / 5.3; object-fit: cover; border-radius: 2.75rem; border: 4px solid var(--r2-fekete); }
@media (max-width: 899px) { .hos__kep > img { aspect-ratio: 5 / 4.6; border-radius: 2rem; } }
.hos__kep .jegyzet { left: -.75rem; bottom: 2.25rem; }
.hos__kep .matrica { position: absolute; width: clamp(104px, 11vw, 148px); right: -1rem; top: -1.75rem; transform: rotate(12deg); }
@media (max-width: 899px) { .hos__kep .jegyzet { left: .75rem; bottom: 1.25rem; } .hos__kep .matrica { right: .25rem; top: -1.25rem; } }
.gyorsinfo { margin-top: clamp(2.5rem, 5vw, 4rem); border-top: 2px solid var(--r2-fekete); display: grid; }
@media (min-width: 760px) { .gyorsinfo { grid-template-columns: repeat(3, 1fr); } }
.gyorsinfo a, .gyorsinfo div { display: flex; align-items: center; gap: .75rem; padding: 1.125rem 0; font-weight: 700; text-decoration: none; }
.gyorsinfo > * + * { border-top: 1px solid rgba(36, 36, 36, .2); }
@media (min-width: 760px) { .gyorsinfo > * + * { border-top: 0; border-left: 1px solid rgba(36, 36, 36, .2); padding-left: 1.5rem; } }
.gyorsinfo svg { width: 1.5rem; height: 1.5rem; flex: none; }
.gyorsinfo a:hover span { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }

/* ---------- Futó szalag ---------- */
.futosav { background: var(--r2-fekete); color: var(--r2-sarga); overflow: hidden; padding: .875rem 0; }
.futosav--sarga { background: var(--r2-sarga); color: var(--r2-fekete); border-block: 2px solid var(--r2-fekete); }
.futosav__belso { display: flex; width: max-content; animation: fut 36s linear infinite; }
.futosav span { padding-right: 2.5rem; white-space: nowrap; }
@keyframes fut { to { transform: translateX(-50%); } }

/* ---------- Aloldal fejléc ---------- */
.oldalfej { padding-block: clamp(2.5rem, 6vw, 5rem) clamp(3rem, 7vw, 5.5rem); overflow: hidden; }
.oldalfej__racs { display: grid; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
@media (min-width: 900px) { .oldalfej__racs--keppel { grid-template-columns: 1.15fr .85fr; } }
.oldalfej__szoveg { display: grid; gap: 1.25rem; justify-items: start; max-width: 46rem; }
.oldalfej__szoveg > * { animation: felbuk .8s cubic-bezier(.2, .8, .2, 1) both; }
.oldalfej__szoveg > :nth-child(2) { animation-delay: .06s; } .oldalfej__szoveg > :nth-child(3) { animation-delay: .12s; }
.oldalfej .t-display { font-size: clamp(2.5rem, 5.6vw, 4.5rem); }
.oldalfej__kep { position: relative; animation: felbuk 1s .1s cubic-bezier(.2, .8, .2, 1) both; }
.oldalfej__kep img { width: 100%; aspect-ratio: 4 / 3.4; object-fit: cover; border-radius: 2.25rem; border: 4px solid var(--r2-fekete); }
.oldalfej__kezi { font-size: clamp(1.25rem, 2.2vw, 1.625rem); color: var(--r2-barna); transform: rotate(-2deg); }
.hatter-fekete .oldalfej__kezi { color: var(--r2-sarga); }
.morzsa { display: flex; flex-wrap: wrap; gap: .5rem; font-size: .875rem; font-weight: 700; }
.morzsa a { text-decoration: none; opacity: .7; }
.morzsa a:hover { opacity: 1; text-decoration: underline; }

/* ---------- Nagy cím + szöveg ---------- */
.mi-az { display: grid; gap: clamp(2rem, 5vw, 5rem); align-items: start; }
@media (min-width: 900px) { .mi-az { grid-template-columns: 1.1fr .9fr; } }
.mi-az__szoveg { display: grid; gap: 1.5rem; justify-items: start; }
.mi-az__szoveg p { margin: 0; }
.mi-az__szoveg .szoveg > * + * { margin-top: 1em; }
.mi-az__kezi { font-size: clamp(1.5rem, 2.6vw, 2rem); color: var(--r2-barna); transform: rotate(-2deg); margin-top: .5rem; }
.hatter-fekete .mi-az__kezi { color: var(--r2-sarga); }

/* ---------- Kép + szöveg ---------- */
.kepszoveg { display: grid; gap: clamp(2rem, 5vw, 5rem); align-items: center; }
@media (min-width: 900px) {
  .kepszoveg { grid-template-columns: 1fr 1fr; }
  .kepszoveg--bal .kepszoveg__kep { order: -1; }
}
.kepszoveg__szoveg { display: grid; gap: 1.25rem; justify-items: start; }
.kepszoveg__kep { position: relative; }
.kepszoveg__kep > img { width: 100%; aspect-ratio: 4 / 4.4; object-fit: cover; border-radius: 2.25rem; border: 4px solid var(--r2-fekete); }
.kepszoveg__kep .jegyzet { right: -.5rem; bottom: 1.75rem; }
@media (max-width: 899px) { .kepszoveg__kep .jegyzet { right: .75rem; } }
.kepszoveg__kep--kapszula { display: grid; justify-items: center; }
.kepszoveg__kep--kapszula .kapszula { --w: min(260px, 62vw); transform: rotate(-4deg); }
.kepszoveg__kep--kapszula .jegyzet { right: auto; bottom: auto; left: calc(50% + min(90px, 20vw)); top: 8%; max-width: 11rem; }
@media (max-width: 560px) { .kepszoveg__kep--kapszula .jegyzet { left: auto; right: 0; top: 2%; } }
.kezi-megjegyzes { font-size: clamp(1.375rem, 2.4vw, 1.75rem); color: var(--r2-barna); transform: rotate(-2deg); }
.hatter-fekete .kezi-megjegyzes { color: var(--r2-sarga); }

/* ---------- Szövegtörzs (prose) ---------- */
.szoveg { font-size: 1.0625rem; line-height: 1.7; }
.szoveg > :first-child { margin-top: 0; }
.szoveg > :last-child { margin-bottom: 0; }
.szoveg h2 { font-size: clamp(1.625rem, 3vw, 2.125rem); font-weight: 800; line-height: 1.15; letter-spacing: -.02em; margin: 2.25em 0 .6em; text-wrap: balance; }
.szoveg h3 { font-size: 1.375rem; font-weight: 800; line-height: 1.25; margin: 1.75em 0 .5em; }
.szoveg h4 { font-size: 1.125rem; font-weight: 800; margin: 1.5em 0 .5em; }
.szoveg p, .szoveg ul, .szoveg ol { margin: 0 0 1.1em; }
.szoveg ul, .szoveg ol { padding-left: 1.4em; }
.szoveg li { margin-bottom: .45em; }
.szoveg ul li::marker { color: var(--r2-barna); }
.szoveg ol li::marker { font-weight: 800; }
.szoveg a { text-decoration-thickness: 2px; text-underline-offset: 3px; text-decoration-color: var(--r2-sarga-sotet); font-weight: 700; }
.szoveg a:hover { background: var(--r2-sarga); text-decoration-color: var(--r2-fekete); }
.hatter-fekete .szoveg a:hover { color: var(--r2-fekete); }
.szoveg strong { font-weight: 800; }
.szoveg blockquote { margin: 1.75em 0; padding: 1.25rem 1.5rem; border-radius: 1.25rem 1.25rem 1.25rem .25rem; background: var(--r2-sarga); font-family: var(--font-kezi); font-weight: 600; font-size: 1.25rem; line-height: 1.35; }
.szoveg blockquote p:last-child { margin: 0; }
.szoveg blockquote cite { display: block; margin-top: .5rem; font-family: var(--font-fo); font-size: .875rem; font-style: normal; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.szoveg img, .szoveg .wp-block-image img { border-radius: var(--r-kartya); height: auto; }
.szoveg figure { margin: 2em 0; }
.szoveg figcaption { margin-top: .625rem; font-size: .875rem; color: var(--r2-szurke); text-align: center; }
.szoveg hr { border: 0; height: 2px; background: var(--r2-fekete); margin: 2.5em 0; border-radius: 2px; }
.szoveg table { width: 100%; border-collapse: collapse; font-size: 1rem; }
.szoveg th, .szoveg td { text-align: left; padding: .625rem .5rem; border-bottom: 1px solid var(--r2-vonal); }
.szoveg .wp-block-buttons { display: flex; gap: .75rem; flex-wrap: wrap; }
.szoveg .wp-block-button__link { display: inline-flex; align-items: center; min-height: 3.25rem; padding: .75rem 1.75rem; border-radius: var(--r-kapszula); background: var(--r2-fekete); color: var(--r2-feher); font-weight: 800; font-size: .9375rem; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; }
.szoveg .wp-block-button__link:hover { background: var(--r2-fekete); transform: translateY(-2px); }
.szoveg .wp-block-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: .75rem; }
.szoveg .wp-block-gallery img { aspect-ratio: 1; object-fit: cover; width: 100%; }
.szoveg .has-text-align-center { text-align: center; }
.szoveg .alignwide { margin-inline: calc(min(100vw - 2.5rem, 1100px) / -2 + 50%); }
.szoveg--szeles { max-width: none; }

/* ---------- Értékkártyák ---------- */
.ertek { align-content: start; }
.ertek:nth-child(4n+1) { background: var(--r2-sarga); }
.ertek:nth-child(4n+2) { background: var(--r2-barack); }
.ertek:nth-child(4n+3) { background: var(--r2-fekete); color: var(--r2-feher); }
.ertek:nth-child(4n+4) { background: var(--r2-vaj); }
.hatter-sarga .ertek:nth-child(4n+1) { background: var(--r2-feher); }
.hatter-fekete .ertek:nth-child(4n+3) { background: #3A3A3A; }
@media (max-width: 600px) { .ertek { min-height: 0; } .ertek svg { margin-bottom: .75rem; } }

/* ---------- Fotómozaik ---------- */
.hangulat { display: grid; gap: 1.25rem; grid-template-columns: repeat(2, 1fr); grid-auto-rows: clamp(170px, 44vw, 250px); grid-auto-flow: dense; }
@media (min-width: 900px) { .hangulat { grid-template-columns: repeat(4, 1fr); grid-auto-rows: clamp(240px, 23vw, 310px); } }
.csempe { position: relative; border-radius: var(--r-kartya); overflow: hidden; margin: 0; }
.csempe > img { width: 100%; height: 100%; object-fit: cover; transition: transform 700ms cubic-bezier(.2, .7, .2, 1); }
.csempe:hover > img { transform: scale(1.03); }
.csempe--nagy { grid-column: span 2; grid-row: span 2; }
.csempe--szeles { grid-column: span 2; }
.csempe--magas { grid-row: span 2; }
.csempe--kor { background: var(--r2-sarga); display: grid; place-items: center; padding: 1.25rem; }
.hatter-sarga .csempe--kor { background: var(--r2-feher); }
.csempe__kor { width: min(78%, 210px); aspect-ratio: 1; border-radius: 50%; border: 6px solid var(--r2-fekete); overflow: hidden; }
.csempe__kor img { width: 100%; height: 100%; object-fit: cover; }
.csempe--idezet { background: var(--r2-fekete); color: var(--r2-feher); padding: clamp(1.25rem, 2.4vw, 2rem); display: grid; align-content: space-between; gap: 1rem; }
.hatter-fekete .csempe--idezet { background: var(--r2-sarga); color: var(--r2-fekete); }
.csempe--idezet p { margin: 0; font-size: clamp(1.125rem, 1.9vw, 1.625rem); font-weight: 800; line-height: 1.15; letter-spacing: -.015em; }
.csempe--idezet .t-cimke { color: var(--r2-sarga); }
.hatter-fekete .csempe--idezet .t-cimke { color: var(--r2-fekete); }
.csempe .jegyzet { font-size: clamp(1rem, 1.5vw, 1.1875rem); right: 1.25rem; bottom: 1.25rem; }
.csempe .jegyzet--jobb { right: auto; left: 1.25rem; }
@media (max-width: 899px) {
  .csempe--idezet { align-content: center; } .csempe--idezet .t-cimke { display: none; } .csempe--idezet p { font-size: 1.0625rem; }
  .csempe .jegyzet { max-width: 12.5rem; font-size: .9375rem; right: .75rem; bottom: .75rem; padding: .5rem .875rem; }
  .csempe .jegyzet--jobb { left: .75rem; }
  .csempe:not(.csempe--nagy):not(.csempe--szeles) .jegyzet { display: none; }
}

/* ---------- Galéria ---------- */
.galeria { columns: 2 180px; column-gap: 1rem; }
@media (min-width: 900px) { .galeria { columns: 3 260px; column-gap: 1.25rem; } }
.galeria__elem { display: block; margin: 0 0 1rem; break-inside: avoid; border-radius: var(--r-kartya); overflow: hidden; cursor: zoom-in; position: relative; border: 0; padding: 0; background: var(--r2-vaj); width: 100%; }
@media (min-width: 900px) { .galeria__elem { margin-bottom: 1.25rem; } }
.galeria__elem img { width: 100%; height: auto; transition: transform 600ms cubic-bezier(.2, .7, .2, 1); }
.galeria__elem:hover img { transform: scale(1.04); }
.galeria__elem:focus-visible { outline: 3px solid var(--r2-barna); outline-offset: 3px; }
.galeria--racs { columns: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(46%, 220px), 1fr)); gap: 1rem; }
.galeria--racs .galeria__elem { margin: 0; aspect-ratio: 1; }
.galeria--racs .galeria__elem img { height: 100%; object-fit: cover; }
.galeria--sav { columns: auto; display: flex; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; padding: .25rem max(1.25rem, (100vw - 1200px) / 2) 1.5rem; scrollbar-width: thin; scrollbar-color: var(--r2-fekete) transparent; }
.galeria--sav .galeria__elem { flex: none; width: auto; height: clamp(260px, 42vw, 420px); margin: 0; scroll-snap-align: center; }
.galeria--sav .galeria__elem img { height: 100%; width: auto; }
.galeria-gomb { margin-top: 2rem; }

/* nagyítható elemek */
[data-nagy] { cursor: zoom-in; }
[data-nagy]:focus-visible { outline: 3px solid var(--r2-barna); outline-offset: 3px; }
.social-racs__elem { display: block; width: 100%; padding: 0; border: 0; background: var(--r2-vaj); border-radius: clamp(16px, 2vw, 28px); overflow: hidden; aspect-ratio: 1; }
.social-racs__elem img { width: 100%; height: 100%; object-fit: cover; transition: transform 500ms cubic-bezier(.2, .7, .2, 1); }
.social-racs__elem:hover img { transform: scale(1.06); }
.cikktorzs .szoveg img[data-nagy] { transition: transform var(--gyors); }

/* nagyító */
.nagyito { border: 0; padding: 0; margin: 0; width: 100vw; height: 100dvh; max-width: none; max-height: none; background: rgba(24, 24, 24, .97); color: var(--r2-feher); }
.nagyito::backdrop { background: transparent; }
.nagyito[open] { display: grid; grid-template-rows: 1fr auto; place-items: center; }
.nagyito img { max-width: min(94vw, 1400px); max-height: calc(100dvh - 7rem); width: auto; height: auto; border-radius: 1.25rem; object-fit: contain; }
.nagyito__sav { display: flex; gap: .75rem; align-items: center; padding: 1rem; }
.nagyito__szam { font-weight: 800; letter-spacing: .12em; font-size: .8125rem; min-width: 4.5rem; text-align: center; }
.nagyito button { display: inline-grid; place-items: center; width: 3.25rem; height: 3.25rem; border-radius: 50%; border: 2px solid var(--r2-feher); background: transparent; color: var(--r2-feher); cursor: pointer; transition: background var(--gyors), color var(--gyors); }
.nagyito button:hover, .nagyito button:focus-visible { background: var(--r2-sarga); color: var(--r2-fekete); border-color: var(--r2-sarga); outline: none; }
.nagyito button svg { width: 1.375rem; height: 1.375rem; }
.nagyito__bezar { position: absolute; top: max(1rem, env(safe-area-inset-top)); right: 1rem; }
.nagyito__felirat { position: absolute; left: 50%; bottom: 5.5rem; transform: translateX(-50%) rotate(-2deg); max-width: min(90vw, 28rem); text-align: center; }
.nagyito__felirat:empty { display: none; }
.nagyito--egy .nagyito__elozo, .nagyito--egy .nagyito__kovetkezo, .nagyito--egy .nagyito__szam { visibility: hidden; }

/* ---------- Számozott lista ---------- */
.helyzetek { display: grid; border-top: 2px solid currentColor; }
.helyzet { display: grid; grid-template-columns: auto 1fr auto; gap: .5rem clamp(1rem, 3vw, 2.5rem); align-items: center; padding: clamp(1.125rem, 2.4vw, 1.75rem) clamp(.75rem, 2vw, 1.75rem); border-bottom: 2px solid currentColor; text-decoration: none; position: relative; isolation: isolate; }
a.helyzet::before { content: ""; position: absolute; inset: .375rem 0; z-index: -1; border-radius: var(--r-kapszula); background: var(--r2-sarga); transform: scaleX(.96) scaleY(.7); opacity: 0; transition: transform var(--gyors), opacity var(--gyors); }
.hatter-sarga a.helyzet::before { background: var(--r2-feher); }
a.helyzet:hover::before, a.helyzet:focus-visible::before { opacity: 1; transform: none; }
.hatter-fekete a.helyzet:hover, .hatter-fekete a.helyzet:focus-visible { color: var(--r2-fekete); }
.helyzet:focus-visible { outline: none; }
.helyzet__szam { display: grid; place-items: center; width: 3rem; height: 1.75rem; border-radius: var(--r-kapszula-kicsi); background: var(--r2-fekete); color: var(--r2-sarga); font-size: .8125rem; font-weight: 800; letter-spacing: .06em; }
.hatter-fekete .helyzet__szam { background: var(--r2-sarga); color: var(--r2-fekete); }
.helyzet__szoveg { display: grid; gap: .125rem .5rem; }
@media (min-width: 900px) { .helyzet__szoveg { grid-template-columns: 17rem 1fr; align-items: center; gap: 2rem; } }
.helyzet__cim { font-size: clamp(1.5rem, 3.4vw, 2.5rem); font-weight: 800; letter-spacing: -.02em; line-height: 1.1; }
.helyzet__leiras { font-size: 1rem; line-height: 1.45; max-width: 36rem; }
.helyzet__nyil { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; border: 2px solid currentColor; transition: background var(--gyors), color var(--gyors), transform var(--gyors); }
.helyzet__nyil svg { width: 1.25rem; height: 1.25rem; }
a.helyzet:hover .helyzet__nyil, a.helyzet:focus-visible .helyzet__nyil { background: var(--r2-fekete); color: var(--r2-sarga); border-color: var(--r2-fekete); transform: translateX(4px); }
@media (max-width: 600px) { .helyzet { grid-template-columns: auto 1fr; } .helyzet__nyil { display: none; } .helyzet__szam { align-self: start; margin-top: .375rem; } }

/* ---------- Sötét kiemelő (Klub) ---------- */
.klub { overflow: hidden; }
.klub__racs { display: grid; gap: clamp(2.5rem, 5vw, 5rem); align-items: center; }
@media (min-width: 900px) { .klub__racs { grid-template-columns: 1.1fr .9fr; } }
.klub__szoveg { display: grid; gap: 1.5rem; justify-items: start; }
.klub__oldal { position: relative; display: grid; justify-items: center; padding-bottom: 1rem; }
.klub__minta { position: absolute; inset: 12% -40% 18% 22%; border-radius: var(--r-kartya); opacity: .9; }
.klub__logo { position: relative; width: min(72%, 320px); height: auto; }
.klub__oldal .esemeny { position: relative; width: min(100%, 25rem); margin-top: -2.25rem; box-shadow: 0 24px 50px -20px rgba(0, 0, 0, .7); text-decoration: none; }
.hatter-sarga .klub__minta { background-color: var(--r2-fekete); }

/* ---------- Programok ---------- */
.programok { display: grid; gap: 1rem; }
a.esemeny { text-decoration: none; transition: transform var(--gyors), box-shadow var(--gyors); }
a.esemeny:hover { transform: translateY(-3px); box-shadow: var(--arnyek); }
a.esemeny:focus-visible { outline: 3px solid var(--r2-barna); outline-offset: 3px; }
.esemeny__cim { font-size: clamp(1.25rem, 2.4vw, 1.625rem); font-weight: 800; line-height: 1.15; letter-spacing: -.01em; margin: .25rem 0; }
.esemeny__rovid { margin: .25rem 0 0; font-size: .9375rem; opacity: .8; }
.esemeny__meta { font-size: .9375rem; font-weight: 600; }
@media (min-width: 760px) { .esemeny--nagy { grid-template-columns: auto 1fr auto; padding: 1.5rem 2rem 1.5rem 1.5rem; } .esemeny--nagy .esemeny__nap { width: 6rem; } }
.esemeny__nyil { display: none; }
@media (min-width: 760px) { .esemeny--nagy .esemeny__nyil { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; border: 2px solid currentColor; } .esemeny__nyil svg { width: 1.25rem; height: 1.25rem; } }
.hatter-fekete .esemeny:not(.esemeny--sarga) { background: #333; }
.programkartyak { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.programkartya { position: relative; }
.programkartya .blogkartya__kep { position: relative; }
.programkartya__datum { position: absolute; left: 1rem; top: 1rem; }
.ures-uzenet { padding: 1.5rem 1.75rem; border-radius: var(--r-kartya); border: 2px dashed currentColor; font-weight: 600; max-width: 40rem; }

/* program oldal */
.program-adatok { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); margin-top: 1rem; }
.program-adat { background: var(--r2-fekete); color: var(--r2-feher); border-radius: var(--r-kartya); padding: 1.25rem 1.5rem; display: grid; gap: .375rem; }
.program-adat .t-cimke { color: var(--r2-sarga); }
.program-adat b { font-size: 1.1875rem; line-height: 1.25; }

/* ---------- Blog ---------- */
.cikkek { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.hatter-feher .blogkartya { background: var(--r2-krem); }
.hatter-fekete .blogkartya { background: #333; color: var(--r2-feher); }
.hatter-fekete .blogkartya .t-apro { color: rgba(255, 255, 255, .64); }
.blogkartya__kep { background: var(--r2-vaj); aspect-ratio: 4 / 3; }
.blogkartya__kep img { height: 100%; }
.blogkartya__kivonat { margin: 0; font-size: .9375rem; line-height: 1.5; color: var(--r2-szurke); }
.blogkartya__ures { display: grid; place-items: center; height: 100%; color: var(--r2-barna); }
.blogkartya__ures svg { width: 4rem; height: 4rem; }
.blogkartya--kiemelt { grid-column: 1 / -1; }
@media (min-width: 860px) {
  .blogkartya--kiemelt { grid-template-columns: 1.2fr 1fr; align-items: stretch; }
  .blogkartya--kiemelt .blogkartya__kep { aspect-ratio: auto; min-height: 100%; }
  .blogkartya--kiemelt .blogkartya__szoveg { padding: 2.5rem; align-content: center; gap: 1rem; }
  .blogkartya--kiemelt .t-h3 { font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.1; letter-spacing: -.02em; }
}
.szuro { display: flex; gap: .5rem; overflow-x: auto; padding: .25rem .125rem 1rem; margin-bottom: 1.5rem; scrollbar-width: none; }
.szuro::-webkit-scrollbar { display: none; }
.szuro a { flex: none; display: inline-flex; align-items: center; min-height: 2.5rem; padding: .375rem 1.125rem; border-radius: .75rem; border: 2px solid var(--r2-fekete); font-size: .8125rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; white-space: nowrap; transition: background var(--gyors), color var(--gyors); }
.szuro a:hover { background: var(--r2-fekete); color: var(--r2-feher); }
.szuro a[aria-current] { background: var(--r2-fekete); color: var(--r2-sarga); }
.lapozo { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; margin-top: clamp(2.5rem, 5vw, 4rem); }
.lapozo .page-numbers { display: inline-grid; place-items: center; min-width: 3rem; height: 3rem; padding: 0 1rem; border-radius: var(--r-kapszula); border: 2px solid var(--r2-fekete); font-weight: 800; text-decoration: none; }
.lapozo .page-numbers.current { background: var(--r2-fekete); color: var(--r2-sarga); }
.lapozo a.page-numbers:hover { background: var(--r2-sarga); border-color: var(--r2-sarga); }
.lapozo .dots { border: 0; min-width: auto; padding: 0; }
.lapozo .page-numbers { gap: .5rem; transition: background var(--gyors), border-color var(--gyors), transform var(--gyors); }
.lapozo .page-numbers.current { background: var(--r2-sarga); color: var(--r2-fekete); border-color: var(--r2-fekete); box-shadow: 0 4px 0 var(--r2-fekete); transform: translateY(-2px); }
.lapozo .prev, .lapozo .next { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: 0 1.125rem; font-size: .8125rem; letter-spacing: .08em; text-transform: uppercase; }
.lapozo svg { width: 1.125rem; height: 1.125rem; }
@media (max-width: 480px) { .lapozo__felirat { display: none; } .lapozo .prev, .lapozo .next { padding: 0; min-width: 3rem; } }
.lapjelzo { display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem; margin: -.5rem 0 1.5rem; }
.lapjelzo__szam { display: inline-flex; align-items: center; min-height: 2rem; padding: .25rem .875rem; border-radius: var(--r-kapszula-kicsi); background: var(--r2-sarga); font-size: .8125rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.lapjelzo__ossz { font-size: .875rem; color: var(--r2-szurke); font-weight: 600; }

/* cikk oldal */
.cikkfej { padding-block: clamp(2rem, 5vw, 4rem) 0; }
.cikkfej__belso { display: grid; gap: 1.25rem; justify-items: start; max-width: 52rem; }
.cikkfej__meta { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; align-items: center; font-size: .9375rem; font-weight: 700; color: var(--r2-szurke); }
.cikkfej__meta span { display: inline-flex; align-items: center; gap: .375rem; }
.cikkfej__meta svg { width: 1.125rem; height: 1.125rem; }
.cikkfej .t-display { font-size: clamp(2.25rem, 5.5vw, 4.25rem); }
.cikkkep { margin: clamp(2rem, 4vw, 3rem) auto 0; width: min(100% - 2.5rem, 1200px); }
.cikkkep img { width: 100%; aspect-ratio: 16 / 8.5; object-fit: cover; border-radius: clamp(1.5rem, 3vw, 2.75rem); border: 4px solid var(--r2-fekete); }
@media (max-width: 700px) { .cikkkep img { aspect-ratio: 4 / 3.2; } }
.cikktorzs, .hatter-krem + .cikktorzs { padding-block: clamp(2.5rem, 6vw, 4.5rem); }
.cikktorzs .szoveg { font-size: clamp(1.0625rem, 1.4vw, 1.1875rem); }
.cikktorzs .szoveg > p:first-child { font-size: clamp(1.1875rem, 2vw, 1.375rem); font-weight: 600; line-height: 1.55; }
.megosztas { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; margin-top: 3rem; padding-top: 1.5rem; border-top: 2px solid var(--r2-fekete); }
.megosztas .t-cimke { margin-right: .5rem; }
.korgomb { position: relative; display: inline-grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; border: 2px solid currentColor; background: transparent; color: inherit; cursor: pointer; transition: background var(--gyors), color var(--gyors), border-color var(--gyors); }
.korgomb svg { width: 1.375rem; height: 1.375rem; }
.korgomb:hover, .korgomb:focus-visible { background: var(--r2-sarga); color: var(--r2-fekete); border-color: var(--r2-sarga); outline: none; }
.korgomb[data-masolva]::after { content: "Link másolva"; position: absolute; transform: translateY(-2.5rem); background: var(--r2-fekete); color: var(--r2-feher); padding: .25rem .625rem; border-radius: var(--r-kapszula-kicsi); font-size: .75rem; font-weight: 700; white-space: nowrap; }
.cikk-cta { display: grid; gap: 1.25rem; justify-items: start; padding: clamp(1.75rem, 4vw, 3rem); border-radius: var(--r-kartya); background: var(--r2-sarga); margin-top: 3rem; position: relative; overflow: hidden; }
.cikk-cta .t-h3 { font-size: clamp(1.5rem, 2.8vw, 2rem); font-weight: 800; letter-spacing: -.015em; max-width: 30rem; }
.cikk-cta p { margin: 0; max-width: 36rem; }

/* ---------- Történetek ---------- */
.tortenetek { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); }
.tortenet { min-height: 20rem; border-radius: var(--r-kartya); padding: clamp(1.375rem, 2vw, 1.75rem); display: grid; gap: 1.25rem; align-content: space-between; justify-items: start; background: var(--r2-feher); text-decoration: none; transition: transform var(--gyors), box-shadow var(--gyors); }
a.tortenet:hover { transform: translateY(-4px) rotate(-.6deg); box-shadow: var(--arnyek); }
.tortenet:focus-visible { outline: 3px solid var(--r2-barna); outline-offset: 3px; }
.tortenet p { margin: 0; font-size: clamp(1.25rem, 1.75vw, 1.5rem); }
@media (max-width: 559px) { .tortenet { min-height: 0; } }
.tortenet--fekete { background: var(--r2-fekete); color: var(--r2-feher); }
.tortenet--fekete p { color: var(--r2-sarga); }
.tortenet--sarga { background: var(--r2-sarga); }
.tortenet--vaj { background: var(--r2-vaj); }
.hatter-feher .tortenet--feher { background: var(--r2-krem); }
.tortenet__szerzo { display: flex; align-items: center; gap: .75rem; font-size: .9375rem; font-weight: 700; line-height: 1.3; }
.tortenet__szerzo small { display: block; font-weight: 500; opacity: .7; font-size: .8125rem; }
.tortenet__arc { width: 3rem; height: 3rem; border-radius: 50%; border: 3px solid currentColor; overflow: hidden; flex: none; display: grid; place-items: center; font-weight: 800; }
.tortenet__arc img { width: 100%; height: 100%; object-fit: cover; }
.tortenetek-gomb { margin-top: 2rem; }

/* ---------- Csapat ---------- */
.csapatfuto { overflow: hidden; padding-block: .5rem 1rem; -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); }
.csapatfuto__sav { display: flex; width: max-content; animation: fut var(--ido, 60s) linear infinite; }
.csapatfuto:hover .csapatfuto__sav, .csapatfuto:focus-within .csapatfuto__sav { animation-play-state: paused; }
.csapatfuto__csoport { display: flex; gap: clamp(1.25rem, 2.5vw, 2rem); padding-right: clamp(1.25rem, 2.5vw, 2rem); }
@media (prefers-reduced-motion: reduce) {
  .csapatfuto { overflow-x: auto; -webkit-mask-image: none; mask-image: none; padding-inline: 1.25rem; }
  .csapatfuto__sav { animation: none; }
  .csapatfuto__csoport[aria-hidden] { display: none; }
}
.kapszula__ablak img { transform: scale(var(--nagyitas, 1.3)); transform-origin: var(--fx, 50%) var(--fy, 35%); object-position: var(--fx, 50%) var(--fy, 35%); }
.hatter-fekete .kapszula { background: #3A3A3A; }
.csapatracs { display: grid; gap: clamp(2.5rem, 5vw, 3.5rem) 2rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); }
.tag { display: grid; grid-template-columns: auto 1fr; gap: 1.25rem; align-items: start; }
.tag .kapszula { --w: 128px; }
.tag__szoveg { display: grid; gap: .625rem; align-content: start; padding-top: .5rem; }
.tag__nev { font-size: 1.75rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.05; margin: 0; }
.tag__szerep { font-size: .75rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--r2-barna); line-height: 1.35; }
.hatter-fekete .tag__szerep { color: var(--r2-sarga); }
.tag__bemutatkozas { margin: 0; font-size: .9875rem; line-height: 1.55; }
.tag__kerdesek { margin: .25rem 0 0; display: grid; gap: .625rem; }
.tag__kerdesek div { padding: .75rem 1rem; border-radius: 1.125rem 1.125rem 1.125rem .25rem; background: var(--r2-vaj); }
.hatter-feher .tag__kerdesek div { background: var(--r2-krem); }
.hatter-fekete .tag__kerdesek div { background: #333; }
.tag__kerdesek dt { font-size: .75rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.tag__kerdesek dd { margin: .125rem 0 0; font-family: var(--font-kezi); font-weight: 600; font-size: 1.0625rem; line-height: 1.3; }
@media (max-width: 480px) { .tag { gap: 1rem; } .tag .kapszula { --w: 96px; } .tag__nev { font-size: 1.5rem; } .tag__szoveg { padding-top: .25rem; } }

/* ---------- Gyere el hozzánk ---------- */
.gyere__racs { display: grid; gap: 1.25rem; align-items: start; }
@media (min-width: 960px) { .gyere__racs--ket { grid-template-columns: 1fr 1fr; gap: 2rem; } }
.gyere__bal { display: grid; gap: 1.25rem; }
.adatok { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); }
.adat { background: var(--r2-fekete); color: var(--r2-feher); border-radius: var(--r-kartya); padding: 1.5rem 1.625rem; display: grid; gap: .625rem; align-content: start; }
.hatter-fekete .adat { background: #333; }
.adat .t-cimke { color: var(--r2-sarga); }
.adat .t-apro, .program-adat .t-apro { color: rgba(255, 255, 255, .78); }
.adat a { text-decoration: none; font-weight: 800; font-size: 1.3125rem; letter-spacing: -.01em; overflow-wrap: anywhere; }
.adat a:hover { color: var(--r2-sarga); }
.adat address { font-style: normal; font-weight: 800; font-size: 1.3125rem; line-height: 1.25; letter-spacing: -.01em; }
.adat--szeles { grid-column: 1 / -1; }
.adat .szoveg { font-size: .9875rem; line-height: 1.55; }
.adat .szoveg a { font-size: inherit; text-decoration: underline; }
.nyitva { width: 100%; border-collapse: collapse; font-size: 1rem; }
.nyitva td { padding: .3125rem 0; border-bottom: 1px solid rgba(255, 255, 255, .16); }
.nyitva tr:last-child td { border-bottom: 0; }
.nyitva td:last-child { text-align: right; font-weight: 800; }
.nyitva tr.ma td { color: var(--r2-sarga); }
.nyitva__kivetel { font-size: .875rem; color: rgba(255, 255, 255, .7); margin: .25rem 0 0; }
.terkep { position: relative; border-radius: var(--r-kartya); overflow: hidden; background: var(--r2-krem); min-height: 300px; border: 2px solid var(--r2-fekete); }
.terkep > img, .terkep > svg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.terkep > iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.terkep__reteg { position: absolute; inset: auto 0 0; padding: 1rem; display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; background: linear-gradient(to top, rgba(36, 36, 36, .6), transparent); }
.terkep--betoltve .terkep__reteg { background: none; padding: .75rem; inset: auto auto 0 0; }
.terkep--betoltve .terkep__betolt { display: none; }
.terkep__megjegyzes { flex-basis: 100%; font-size: .75rem; color: var(--r2-feher); }
.terkep--betoltve .terkep__megjegyzes { display: none; }
.urlapkartya { padding: clamp(1.5rem, 3.5vw, 2.5rem); display: grid; gap: 1.5rem; }
.hatter-feher .urlapkartya { background: var(--r2-krem); }
.hatter-fekete .urlapkartya { color: var(--r2-fekete); }
.urlap__koszi { display: none; font-size: 1.5rem; color: var(--r2-barna); margin: 0; }
.elkuldve .urlap__koszi { display: block; }
.elkuldve .urlap { display: none; }
.urlap__hiba { margin: 0; padding: .75rem 1rem; border-radius: 1rem; background: var(--r2-barack); font-weight: 700; font-size: .9375rem; }
.urlap button[disabled] { opacity: .6; cursor: progress; }
.ketmezo { display: grid; gap: 1rem; }
@media (min-width: 560px) { .ketmezo { grid-template-columns: 1fr 1fr; } }
.csapda { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.mezo input:user-invalid, .mezo textarea:user-invalid { border-color: var(--r2-terrakotta); }

/* ---------- Közösségi ---------- */
.social-racs { display: grid; gap: .75rem; grid-template-columns: repeat(3, 1fr); }
@media (min-width: 760px) { .social-racs { grid-template-columns: repeat(6, 1fr); gap: 1rem; } }
.social-racs a { display: block; border-radius: clamp(16px, 2vw, 28px); overflow: hidden; aspect-ratio: 1; position: relative; }
.social-racs img { width: 100%; height: 100%; object-fit: cover; transition: transform 500ms cubic-bezier(.2, .7, .2, 1); }
.social-racs a:hover img { transform: scale(1.06); }
.social-racs a:focus-visible { outline: 3px solid var(--r2-barna); outline-offset: 3px; }

/* ---------- Kérdések ---------- */
.gyik { display: grid; gap: .75rem; max-width: 52rem; }
.gyik details { border-radius: 1.5rem; background: var(--r2-feher); transition: background var(--gyors); }
.hatter-feher .gyik details { background: var(--r2-krem); }
.hatter-fekete .gyik details { background: #333; }
.gyik details[open] { background: var(--r2-sarga); color: var(--r2-fekete); }
.gyik summary { list-style: none; display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: center; padding: 1.125rem 1.25rem 1.125rem 1.5rem; font-size: clamp(1.0625rem, 1.8vw, 1.25rem); font-weight: 800; line-height: 1.3; cursor: pointer; border-radius: inherit; }
.gyik summary::-webkit-details-marker { display: none; }
.gyik summary:focus-visible { outline: 3px solid var(--r2-barna); outline-offset: 2px; }
.gyik summary span { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--r2-fekete); color: var(--r2-sarga); transition: transform var(--gyors); }
.gyik summary svg { width: 1.125rem; height: 1.125rem; }
.gyik details[open] summary span { transform: rotate(45deg); }
.gyik .szoveg { padding: 0 1.5rem 1.375rem; font-size: 1rem; }

/* ---------- Nagy mondat ---------- */
.idezetblokk { display: grid; gap: 1.5rem; justify-items: center; text-align: center; max-width: 60rem; margin-inline: auto; }
.idezetblokk__szoveg { margin: 0; font-size: clamp(1.75rem, 4.2vw, 3.25rem); line-height: 1.15; text-wrap: balance; }
.idezetblokk__szoveg.t-kezi { color: var(--r2-barna); line-height: 1.2; }
.hatter-fekete .idezetblokk__szoveg.t-kezi { color: var(--r2-sarga); }
.hatter-sarga .idezetblokk__szoveg.t-kezi { color: var(--r2-fekete); }
.idezetblokk__szoveg--fo { font-weight: 800; letter-spacing: -.025em; }
.idezetblokk__alairas { display: flex; align-items: center; gap: .875rem; font-weight: 800; font-size: .9375rem; letter-spacing: .08em; text-transform: uppercase; }
.idezetblokk__arc { width: 4rem; height: 4rem; border-radius: 50%; overflow: hidden; border: 3px solid currentColor; }
.idezetblokk__arc img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Felhívás sáv ---------- */
.cta { display: grid; gap: clamp(2rem, 4vw, 3rem); align-items: center; padding: clamp(2rem, 5vw, 4rem); border-radius: clamp(1.75rem, 3vw, 2.75rem); background: var(--r2-sarga); position: relative; overflow: hidden; }
.hatter-sarga .cta { background: var(--r2-fekete); color: var(--r2-feher); }
.hatter-fekete .cta { background: var(--r2-sarga); color: var(--r2-fekete); }
@media (min-width: 860px) { .cta--keppel { grid-template-columns: 1fr auto; } }
.cta__szoveg { display: grid; gap: 1.25rem; justify-items: start; }
.cta .kapszula { --w: clamp(130px, 16vw, 180px); justify-self: center; transform: rotate(6deg); }

/* ---------- Lábléc ---------- */
.lablec-minta { height: 84px; }
.lablec { background: var(--r2-fekete); color: var(--r2-feher); padding-block: clamp(3rem, 6vw, 5rem) 7rem; }
.lablec__racs { display: grid; gap: 2.5rem; }
@media (min-width: 560px) { .lablec__racs { grid-template-columns: 1fr 1fr; } .lablec__marka { grid-column: 1 / -1; } }
@media (min-width: 960px) { .lablec__racs { grid-template-columns: 1.3fr 1fr 1fr 1fr; } .lablec__marka { grid-column: auto; } }
@media (min-width: 760px) { .lablec { padding-bottom: 2.5rem; } }
.lablec__marka { display: grid; gap: 1.25rem; justify-items: start; }
.lablec__marka img { width: 116px; height: auto; }
.lablec__mondat { margin: 0; font-size: 1.375rem; color: var(--r2-sarga); max-width: 20rem; }
.lablec h2 { margin: 0 0 1rem; color: var(--r2-sarga); }
.lablec ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .5rem; }
.lablec li a { text-decoration: none; font-weight: 600; }
.lablec li a:hover { color: var(--r2-sarga); }
.lablec__also { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid rgba(255, 255, 255, .16); display: flex; flex-wrap: wrap; gap: .75rem 2rem; justify-content: space-between; font-size: .875rem; color: rgba(255, 255, 255, .62); }
.lablec__also a { text-decoration: none; }
.lablec__also a:hover { color: var(--r2-sarga); }
.lablec__also nav { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; }
.lablec__suti { padding: 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
.lablec__suti:hover { color: var(--r2-sarga); }

/* ---------- Mobil alsó sáv ---------- */
.mobilsav { position: fixed; left: 50%; bottom: max(.75rem, env(safe-area-inset-bottom)); transform: translateX(-50%); z-index: 30; display: flex; gap: .25rem; padding: .3125rem; border-radius: var(--r-kapszula); background: var(--r2-fekete); box-shadow: var(--arnyek); transition: transform .3s, opacity .3s; }
.mobilsav a { display: inline-flex; align-items: center; gap: .5rem; padding: .625rem 1.125rem; border-radius: .75rem; color: var(--r2-feher); text-decoration: none; font-size: .8125rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.mobilsav a:last-child { background: var(--r2-sarga); color: var(--r2-fekete); }
.mobilsav svg { width: 1.125rem; height: 1.125rem; }
.mobilsav--rejtve { transform: translate(-50%, 150%); opacity: 0; }
.menu-nyitva .mobilsav { opacity: 0; pointer-events: none; }
@media (min-width: 760px) { .mobilsav { display: none; } }

/* ---------- 404 ---------- */
.hiba { min-height: 60vh; display: grid; align-items: center; }
.hiba__racs { display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 860px) { .hiba__racs { grid-template-columns: 1.2fr .8fr; } }
.hiba__szam { font-size: clamp(6rem, 20vw, 12rem); font-weight: 900; line-height: .85; letter-spacing: -.05em; }
.hiba .kapszula { --w: min(240px, 60vw); justify-self: center; transform: rotate(-6deg); }

/* ---------- Kereső ---------- */
.kereso { display: flex; gap: .5rem; max-width: 34rem; }
.kereso input { flex: 1; font: inherit; padding: .75rem 1.25rem; border: 2px solid var(--r2-fekete); border-radius: var(--r-kapszula); background: var(--r2-feher); min-width: 0; }
.kereso input:focus { outline: 3px solid var(--r2-sarga); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .js .rv { opacity: 1; transform: none; transition: none; }
  .hos__szoveg > *, .hos__kep, .oldalfej__szoveg > *, .oldalfej__kep, .futosav__belso { animation: none; }
  .csempe > img, .galeria__elem img, a.tortenet, a.esemeny { transition: none; }
}