/* KL Stable – kézzel írt stílus. Színek a lovak szőrszíneiből: tinta (fekete mén), gesztenye (pej/sárga), krém (cremello), sövényzöld. */
@font-face { font-family: 'Bodoni Moda'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/bodoni-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Bodoni Moda'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/bodoni-normal-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: 'Bodoni Moda'; font-style: italic; font-weight: 400 700; font-display: swap; src: url(../fonts/bodoni-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+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Bodoni Moda'; font-style: italic; font-weight: 400 700; font-display: swap; src: url(../fonts/bodoni-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: 'Figtree'; font-style: normal; font-weight: 300 900; font-display: swap; src: url(../fonts/figtree-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 300 900; font-display: swap; src: url(../fonts/figtree-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; }

:root {
  --papir: #f6f0e5;
  --papir-2: #ece3d3;
  --krem: #efe3c8;
  --tinta: #1f1b16;
  --tinta-2: #4b433a;
  --tinta-3: #7a6f63;
  --gesztenye: #9a4a25;
  --gesztenye-2: #b8652f;
  --arany: #c99b4f;
  --zold: #55624a;
  --vonal: rgba(31, 27, 22, .14);
  --serif: 'Bodoni Moda', 'Didot', Georgia, serif;
  --sans: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --keret: 1200px;
  --sugar: 14px;
  /* leopárdfoltos minta – a tinta színével, áttetszően */
  --foltok: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cg fill='%231f1b16'%3E%3Cellipse cx='22' cy='18' rx='7' ry='5.5' transform='rotate(20 22 18)'/%3E%3Cellipse cx='80' cy='34' rx='4.5' ry='4'/%3E%3Cellipse cx='140' cy='20' rx='8' ry='6' transform='rotate(-30 140 20)'/%3E%3Cellipse cx='50' cy='76' rx='9' ry='7' transform='rotate(40 50 76)'/%3E%3Cellipse cx='112' cy='82' rx='5' ry='6'/%3E%3Cellipse cx='166' cy='92' rx='4' ry='3.5'/%3E%3Cellipse cx='16' cy='126' rx='5' ry='4.2'/%3E%3Cellipse cx='86' cy='136' rx='7.5' ry='6' transform='rotate(-15 86 136)'/%3E%3Cellipse cx='148' cy='150' rx='9' ry='7' transform='rotate(25 148 150)'/%3E%3Cellipse cx='40' cy='168' rx='3.5' ry='3'/%3E%3Cellipse cx='120' cy='176' rx='3' ry='2.6'/%3E%3C/g%3E%3C/svg%3E");
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; -webkit-text-size-adjust: 100%; }
html, body { overflow-x: clip; }
body { margin: 0; background: var(--papir); color: var(--tinta); font: 400 17px/1.65 var(--sans); }
img { max-width: 100%; display: block; }
a { color: var(--gesztenye); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--tinta); }
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 500; line-height: 1.1; margin: 0 0 .5em; letter-spacing: -.01em; }
h1 { font-size: clamp(2.6rem, 6vw, 5.2rem); }
h2 { font-size: clamp(2rem, 3.6vw, 3rem); }
h3 { font-size: 1.6rem; }
p { margin: 0 0 1em; }
.keret { max-width: var(--keret); margin: 0 auto; padding: 0 24px; }
.rejtett { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.ugras { position: absolute; left: -999px; top: 8px; background: var(--tinta); color: var(--krem); padding: 8px 14px; z-index: 100; }
.ugras:focus { left: 8px; }
.felso { font: 600 .78rem/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--gesztenye); margin-bottom: 1.1em; }
:focus-visible { outline: 2px solid var(--gesztenye); outline-offset: 3px; }

/* ---------- gombok, linkek */
.gombok { display: flex; flex-wrap: wrap; gap: 12px; }
.gomb { display: inline-flex; align-items: center; gap: .5em; background: var(--tinta); color: var(--krem); border: 1.5px solid var(--tinta);
  padding: .85em 1.6em; border-radius: 999px; font-weight: 600; text-decoration: none; transition: background .2s, color .2s, transform .2s; }
.gomb:hover { background: var(--gesztenye); border-color: var(--gesztenye); color: #fff; transform: translateY(-1px); }
.gomb-vonal { background: transparent; color: var(--tinta); }
.gomb-vonal:hover { background: var(--tinta); border-color: var(--tinta); color: var(--krem); }
.gomb-kicsi { padding: .6em 1.2em; font-size: .92rem; }
.nyil-link { font-weight: 600; color: var(--tinta); text-decoration: none; border-bottom: 1.5px solid var(--gesztenye); padding-bottom: 2px; white-space: nowrap; }
.nyil-link::after { content: ' →'; color: var(--gesztenye); transition: margin .2s; }
.nyil-link:hover::after { margin-left: 4px; }

/* ---------- fejléc */
.fej { position: sticky; top: 0; z-index: 50; background: rgba(246, 240, 229, .92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid transparent; transition: border-color .3s, box-shadow .3s; }
.fej.gorgetve { border-color: var(--vonal); box-shadow: 0 6px 24px -18px rgba(31, 27, 22, .5); }
.fej-belso { max-width: var(--keret); margin: 0 auto; padding: 12px 24px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.logo { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--tinta); }
.logo-jel { width: 50px; height: 50px; flex: none; transition: transform .6s cubic-bezier(.3, 1.6, .5, 1); }
.logo:hover .logo-jel { transform: rotate(-8deg); }
.logo-szoveg b { display: block; font: 600 1.45rem/1 var(--serif); letter-spacing: .01em; }
.logo-szoveg small { display: block; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-3); margin-top: 4px; }
nav ul { list-style: none; margin: 0; padding: 0; }
#menu > ul { display: flex; gap: 4px; }
#menu > ul > li { position: relative; }
#menu > ul > li > a { display: block; padding: 10px 14px; color: var(--tinta); text-decoration: none; font-weight: 500; border-radius: 999px; }
#menu > ul > li > a:hover, #menu > ul > li > a.aktiv { background: var(--papir-2); }
#menu > ul > li > a.aktiv { color: var(--gesztenye); }
.van-al > a::after { content: ''; display: inline-block; width: 6px; height: 6px; border: solid currentColor; border-width: 0 1.5px 1.5px 0;
  transform: rotate(45deg) translateY(-3px); margin-left: 8px; opacity: .6; }
.al { position: absolute; top: 100%; left: 0; min-width: 250px; background: var(--papir); border: 1px solid var(--vonal); border-radius: var(--sugar);
  padding: 8px; box-shadow: 0 20px 40px -20px rgba(31, 27, 22, .35); opacity: 0; visibility: hidden; transform: translateY(6px); transition: .2s; }
.van-al:hover .al, .van-al:focus-within .al { opacity: 1; visibility: visible; transform: none; }
.al a { display: block; padding: 8px 12px; border-radius: 8px; color: var(--tinta); text-decoration: none; font-size: .95rem; }
.al a:hover { background: var(--papir-2); color: var(--gesztenye); }
.menu-gomb { display: none; background: none; border: 0; width: 44px; height: 44px; padding: 10px; cursor: pointer; }
.menu-gomb span { display: block; height: 2px; background: var(--tinta); margin: 5px 0; transition: .25s; }
.menu-gomb[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-gomb[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-gomb[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---------- nyitó (hős) */
.hos { max-width: var(--keret); margin: 0 auto; padding: 56px 24px 72px; display: grid; grid-template-columns: 1.05fr 1fr; gap: 48px; align-items: center; }
.hos h1 { margin-bottom: .35em; }
.szines { font-style: italic; background: linear-gradient(100deg, var(--gesztenye) 0%, var(--arany) 45%, var(--tinta-2) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: .06em; }
.hos-bevezeto { font-size: 1.2rem; color: var(--tinta-2); max-width: 32em; margin-bottom: 2em; }
.hos-kepek { position: relative; height: 560px; }
.hk { position: absolute; margin: 0; overflow: hidden; border-radius: 200px 200px var(--sugar) var(--sugar); box-shadow: 0 30px 60px -30px rgba(31, 27, 22, .55); }
.hk img { width: 100%; height: 100%; object-fit: cover; }
.hk-1 { left: 0; top: 40px; width: 62%; height: 440px; z-index: 2; border-radius: var(--sugar); }
.hk-2 { right: 0; top: 0; width: 42%; height: 300px; }
.hk-3 { right: 4%; bottom: 0; width: 38%; height: 240px; z-index: 3; border-radius: var(--sugar) var(--sugar) 200px 200px; border: 6px solid var(--papir); }
.hos-kepek::before { content: ''; position: absolute; left: -40px; bottom: -10px; width: 200px; height: 200px; background: var(--foltok); opacity: .14; z-index: 0; }

/* színsáv: a ménjeink színei */
.szinsav { background: var(--tinta); color: var(--krem); padding: 18px 0; }
.szinsav-belso { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 22px; }
.sz { display: inline-flex; align-items: center; gap: 10px; font: italic 500 1.05rem var(--serif); }
.sz::before { content: ''; width: 22px; height: 22px; border-radius: 50%; border: 1px solid rgba(239, 227, 200, .4); flex: none; }
.sz-fekete::before { background: #0d0b09; }
.sz-pej::before { background: radial-gradient(circle at 35% 35%, #a5532a, #5a2a14); }
.sz-sarga::before { background: radial-gradient(circle at 35% 35%, #d88a45, #a8592a); }
.sz-krem::before { background: #f3ead5; }
.sz-tarka::before { background: conic-gradient(#6b331a 0 30%, #fff 30% 55%, #6b331a 55% 70%, #fff 70%); }
.sz-leopard::before { background: #f4efe6 radial-gradient(circle at 30% 35%, #1f1b16 0 3px, transparent 3.5px), radial-gradient(circle at 68% 60%, #1f1b16 0 3.5px, transparent 4px), radial-gradient(circle at 40% 75%, #1f1b16 0 2px, transparent 2.5px); }
.sz-fewspot::before { background: #f8f6f0 radial-gradient(circle at 62% 38%, #6a5a4a 0 2px, transparent 2.5px); }

/* ---------- szakaszok */
.szakasz { padding: 96px 0; }
.szakasz.sotet { background: var(--tinta); color: var(--krem); }
.szakasz.sotet .felso { color: var(--arany); }
.szakasz.sotet h2, .szakasz.sotet h3 { color: #fff; }
.szakasz-fej { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 40px; flex-wrap: wrap; }
.szakasz-fej h2 { margin: 0; }
.ket-has { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.bemutato { background: var(--papir-2); position: relative; overflow: hidden; }
.bemutato::after { content: ''; position: absolute; right: -60px; top: -60px; width: 360px; height: 360px; background: var(--foltok); opacity: .07; pointer-events: none; }
.bemutato .szoveg p { font-size: 1.15rem; color: var(--tinta-2); }
.jelmondat { font: italic 500 clamp(2rem, 4vw, 3rem)/1.1 var(--serif) !important; color: var(--gesztenye) !important; margin-top: .8em; }

/* ménkártyák a kezdőlapon */
.men-racs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.men-kartya { display: block; text-decoration: none; color: var(--tinta); }
.men-kep { display: block; aspect-ratio: 3 / 2; overflow: hidden; border-radius: var(--sugar); background: var(--papir-2); }
.men-kep img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2, .7, .2, 1); }
.men-kartya:hover .men-kep img { transform: scale(1.05); }
.men-szoveg { display: block; padding: 16px 4px 0; }
.men-szoveg em { display: block; font: italic 400 1rem var(--serif); color: var(--gesztenye); }
.men-szoveg b { display: block; font: 500 1.65rem/1.15 var(--serif); margin: 2px 0 4px; }
.men-szoveg small { display: block; color: var(--tinta-3); font-size: .9rem; }
.men-ar { display: inline-block; margin-top: 10px; font-size: .82rem; font-weight: 600; letter-spacing: .03em; border: 1px solid var(--vonal); border-radius: 999px; padding: 4px 12px; }

/* szolgáltatás-kártyák */
.szolg-szakasz { background: var(--tinta); color: var(--krem); }
.szolg-szakasz .felso { color: var(--arany); }
.szolg-racs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.szolg { position: relative; display: block; aspect-ratio: 5 / 4; border-radius: var(--sugar); overflow: hidden; color: #fff; text-decoration: none; }
.szolg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .7s; }
.szolg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20, 16, 12, 0) 30%, rgba(20, 16, 12, .88)); }
.szolg:hover img { transform: scale(1.05); }
.szolg span { position: absolute; left: 0; right: 0; bottom: 0; padding: 26px; z-index: 1; }
.szolg b { display: block; font: 500 1.7rem/1.1 var(--serif); margin-bottom: 8px; }
.szolg small { display: block; font-size: .95rem; color: rgba(255, 255, 255, .82); }
.szolg b::after { content: ' →'; color: var(--arany); }

/* idézet-szakasz */
.kerek-kep { margin: 0; aspect-ratio: 1; border-radius: 50%; overflow: hidden; max-width: 460px; justify-self: center; box-shadow: 0 0 0 10px var(--papir), 0 0 0 11px var(--vonal); }
.kerek-kep img { width: 100%; height: 100%; object-fit: cover; }
.idezet-szakasz .ket-has { align-items: center; }
blockquote { margin: 0 0 .4em; }
blockquote p { font: italic 500 clamp(2.4rem, 5vw, 3.8rem)/1.05 var(--serif); margin: 0; }
.idezet-szakasz p { font-size: 1.12rem; color: var(--tinta-2); }
.idezet-szakasz blockquote p { font-size: clamp(2.4rem, 5vw, 3.8rem); color: var(--tinta); }

/* kapcsolati sáv */
.kapcs-sav { background: var(--gesztenye); color: #fff; padding: 64px 0; position: relative; overflow: hidden; }
.kapcs-sav::before { content: ''; position: absolute; inset: 0; background: var(--foltok); opacity: .08; filter: invert(1); }
.kapcs-sav-belso { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.kapcs-sav h2 { margin: 0; color: #fff; }
.kapcs-sav .felso { color: var(--krem); }
.kapcs-sav-adatok p { margin: 0 0 10px; display: grid; grid-template-columns: 90px 1fr; gap: 12px; }
.kapcs-sav-adatok span { font-size: .75rem; letter-spacing: .16em; text-transform: uppercase; opacity: .75; padding-top: 4px; }
.kapcs-sav a { color: #fff; }
.kapcs-sav-adatok .tel-sor { font-size: inherit; letter-spacing: 0; text-transform: none; opacity: 1; padding: 0; display: flex; flex-wrap: wrap; gap: 0 18px; }

/* ---------- aloldalak címe */
.oldalcim { position: relative; padding: 110px 0 90px; background: var(--tinta); color: var(--krem); overflow: hidden; }
.oldalcim-kep { position: absolute; inset: 0; background-size: cover; background-position: center 35%; opacity: .42; }
.oldalcim::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(31, 27, 22, .92) 0%, rgba(31, 27, 22, .35) 75%); }
.oldalcim .keret { position: relative; z-index: 1; }
.oldalcim h1 { color: #fff; margin: 0 0 .2em; }
.oldalcim .felso { color: var(--arany); }
.alcim { font: italic 400 1.35rem/1.4 var(--serif); max-width: 32em; margin: 0; color: var(--krem); }

/* ugrósáv */
.ugro-sav { background: var(--papir-2); border-bottom: 1px solid var(--vonal); position: sticky; top: 71px; z-index: 40; }
.ugro-belso { display: flex; gap: 10px; overflow-x: auto; padding-top: 12px; padding-bottom: 12px; scrollbar-width: none; }
.ugro-belso::-webkit-scrollbar { display: none; }
.ugro-belso a { flex: none; display: flex; align-items: center; gap: 10px; padding: 5px 16px 5px 5px; border-radius: 999px; background: var(--papir);
  border: 1px solid var(--vonal); color: var(--tinta); text-decoration: none; font-weight: 500; font-size: .93rem; white-space: nowrap; }
.ugro-belso a:hover { border-color: var(--gesztenye); color: var(--gesztenye); }
.ugro-belso img { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; }
.ugro-szoveg .ugro-belso a { padding: 8px 16px; }

/* ---------- fedezőmének */
.menek { padding-top: 40px; padding-bottom: 40px; }
.men { display: grid; grid-template-columns: 5fr 6fr; gap: 64px; padding: 72px 0; border-bottom: 1px solid var(--vonal); align-items: start; }
.men:last-child { border-bottom: 0; }
.men-tukor .men-fokep { order: 2; }
.men-fokep { position: sticky; top: 150px; }
.men-fokep a { display: block; border-radius: var(--sugar); overflow: hidden; aspect-ratio: 3 / 2; box-shadow: 0 30px 60px -34px rgba(31, 27, 22, .6); }
.men-fokep img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s; }
.men-fokep a:hover img { transform: scale(1.03); }
.men-becenev { font: italic 400 1.3rem var(--serif); color: var(--gesztenye); margin-bottom: .2em; }
.men h2 { font-size: clamp(2.2rem, 4vw, 3.4rem); margin-bottom: .15em; }
.men-alap { font-size: .85rem; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-3); margin-bottom: 1.6em; }
.men-test > p { color: var(--tinta-2); }

/* származási ábra */
.csalad { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; gap: 8px 20px; margin: 0 0 1.8em; padding: 18px 20px;
  background: var(--papir-2); border-radius: var(--sugar); position: relative; }
.csalad-lo { grid-row: 1 / 3; align-self: center; font: 600 1.05rem var(--serif); padding-right: 20px; border-right: 1.5px solid var(--gesztenye); max-width: 11em; }
.csalad-ag { font-weight: 600; font-size: .98rem; }
.csalad-cimke { display: block; font-size: .68rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-3); }
.csalad-nagy { display: block; margin-top: 6px; padding-left: 14px; border-left: 1px dashed var(--tinta-3); font-weight: 500; }

/* genetika */
.genetika { margin: 1.8em 0; padding: 22px; border: 1px solid var(--vonal); border-radius: var(--sugar); background: #fbf8f2; }
.genetika h4 { font-size: 1.3rem; margin-bottom: .7em; }
.genetika ul { list-style: none; margin: 0 0 1em; padding: 0; display: grid; gap: 14px; }
.gen { display: grid; grid-template-columns: 44px 1fr auto; grid-template-areas: 'minta nev esely' 'minta meter meter' 'minta mi mi'; gap: 4px 14px; align-items: center; }
.gen-minta { grid-area: minta; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--vonal); align-self: start; }
.gen-nev { grid-area: nev; font: 600 1.15rem var(--serif); }
.gen-esely { grid-area: esely; font-size: .85rem; color: var(--tinta-3); }
.gen-esely b { color: var(--tinta); font-size: 1rem; }
.gen-meter { grid-area: meter; height: 6px; background: var(--papir-2); border-radius: 3px; overflow: hidden; }
.gen-meter i { display: block; height: 100%; background: linear-gradient(90deg, var(--gesztenye), var(--arany)); border-radius: 3px; }
.gen-mi { grid-area: mi; font-size: .9rem; color: var(--tinta-2); }
.genetika > p { font-size: .92rem; color: var(--tinta-3); margin: 0; }
.gen-lp .gen-minta { background: #f4efe6 radial-gradient(circle at 30% 40%, #3b302a 0 3px, transparent 3.5px), radial-gradient(circle at 65% 30%, #3b302a 0 2px, transparent 2.5px), radial-gradient(circle at 55% 70%, #3b302a 0 3px, transparent 3.5px); }
.gen-patn1 .gen-minta { background: #f7f3ec var(--foltok) center / 70px; }
.gen-tobiano .gen-minta { background: conic-gradient(from 30deg, #6b331a 0 28%, #fff 28% 52%, #6b331a 52% 74%, #fff 74%); }
.gen-krém .gen-minta, .gen-krem .gen-minta { background: radial-gradient(circle at 35% 35%, #fbf4e2, #e7d6ae); }

/* ár-doboz */
.ar-doboz { display: grid; grid-template-columns: 1fr auto; gap: 4px 20px; align-items: center; padding: 20px 22px; border-radius: var(--sugar);
  background: var(--tinta); color: var(--krem); margin: 1.8em 0; }
.ar-doboz span { grid-column: 1 / -1; font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--arany); }
.ar-doboz p { margin: 0; font: 500 1.08rem/1.4 var(--serif); }
.ar-doboz .gomb { background: var(--krem); color: var(--tinta); border-color: var(--krem); }
.ar-doboz .gomb:hover { background: var(--arany); border-color: var(--arany); }

/* galéria */
.galeria { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; }
.galeria a { display: block; aspect-ratio: 1; overflow: hidden; border-radius: 10px; }
.galeria img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s, opacity .3s; }
.galeria a:hover img { transform: scale(1.07); }

/* ---------- lovaink */
.menek-elozetes { padding: 64px 0 0; }
.menek-banner { position: relative; display: block; height: 300px; border-radius: var(--sugar); overflow: hidden; color: #fff; text-decoration: none; }
.menek-banner img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; transition: transform .8s; }
.menek-banner:hover img { transform: scale(1.03); }
.menek-banner::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20, 16, 12, .85), rgba(20, 16, 12, 0) 70%); }
.menek-banner span { position: absolute; left: 40px; top: 50%; transform: translateY(-50%); z-index: 1; max-width: 560px; }
.menek-banner small { display: block; font-size: .75rem; letter-spacing: .2em; text-transform: uppercase; color: var(--arany); }
.menek-banner b { display: block; font: 500 clamp(2rem, 4vw, 3rem)/1.1 var(--serif); margin: 6px 0; }
.menek-banner b::after { content: ' →'; color: var(--arany); }
.menek-banner em { font: italic 400 1.1rem var(--serif); }
.lovak-szakasz { padding: 72px 0 24px; }
h2.vonalas { display: flex; align-items: center; gap: 24px; margin-bottom: 36px; }
h2.vonalas::after { content: ''; flex: 1; height: 1px; background: var(--vonal); }
.lo-racs { display: grid; gap: 28px; }
.lo { display: grid; grid-template-columns: 440px 1fr; gap: 36px; padding: 24px; background: #fbf8f2; border: 1px solid var(--vonal); border-radius: calc(var(--sugar) + 4px); }
.lo-kep { display: block; }
.lo-kep, .lo .nincs-foto { aspect-ratio: 3 / 2; border-radius: var(--sugar); overflow: hidden; }
.lo-kep img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.lo-kep:hover img { transform: scale(1.04); }
.lo h3 { font-size: 2.1rem; margin-bottom: .5em; }
.lo-test p { color: var(--tinta-2); }
.adatok { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 16px; margin: 0 0 1.4em; padding: 0 0 1.2em; border-bottom: 1px solid var(--vonal); }
.adatok dt { font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-3); }
.adatok dd { margin: 0; font-weight: 600; }
.lo-belyegek { display: flex; gap: 10px; flex-wrap: wrap; }
.lo-belyegek a { width: 92px; height: 92px; border-radius: 10px; overflow: hidden; }
.lo-belyegek img { width: 100%; height: 100%; object-fit: cover; }
.lo-racs-kicsi { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.lo-racs-kicsi .lo { display: block; padding: 14px; }
.lo-racs-kicsi .nincs-foto { aspect-ratio: 4 / 3; margin-bottom: 14px; }
.lo-racs-kicsi h3 { font-size: 1.4rem; margin: 0 4px 4px; }
.nincs-foto { display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--papir-2) var(--foltok) center / 150px;
  position: relative; color: var(--tinta-3); }
.nincs-foto::before { content: ''; position: absolute; inset: 0; background: rgba(236, 227, 211, .82); }
.nincs-foto span, .nincs-foto small { position: relative; }
.nincs-foto span { font: italic 500 3.4rem/1 var(--serif); color: var(--tinta-2); }
.nincs-foto small { font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; margin-top: 8px; }

/* csikók évjáratonként */
.csikok-szakasz { padding-bottom: 96px; }
.evjaratok { display: grid; gap: 0; }
.evjarat { display: grid; grid-template-columns: 140px 1fr; gap: 28px; padding: 26px 0; border-top: 1px solid var(--vonal); }
.evjarat h3 { font: italic 500 2.6rem/1 var(--serif); color: var(--gesztenye); margin: 0; }
.evjarat ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 18px; }
.csiko a { display: block; }
.csiko a[hidden] { display: none; }   /* a sorozat többi képe csak a nagyítónak kell */
.csiko a, .csiko .nincs-foto { aspect-ratio: 1; border-radius: 50%; overflow: hidden; }
.csiko img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.csiko a:hover img { transform: scale(1.06); }
.csiko .nincs-foto span { font-size: 2.4rem; }
.csiko .nincs-foto small { font-size: .6rem; }
.csiko > span { display: block; text-align: center; font: 500 1.1rem var(--serif); margin-top: 10px; }

/* ---------- rólunk */
.tortenet { display: grid; grid-template-columns: 1.4fr 1fr; gap: 72px; }
.nagy-bekezdes { font: 400 1.45rem/1.5 var(--serif); color: var(--tinta); }
.iniciale { float: left; font: 500 5.4rem/.82 var(--serif); color: var(--gesztenye); margin: 6px 12px 0 0; }
.tortenet-szoveg p { color: var(--tinta-2); font-size: 1.1rem; }
.tortenet-szoveg .nagy-bekezdes { color: var(--tinta); font-size: 1.45rem; }
.alairas { font: italic 500 1.7rem var(--serif) !important; color: var(--tinta) !important; margin-top: 1.4em; }
.alairas small { display: block; font: 400 .9rem var(--sans); font-style: normal; color: var(--tinta-3); }
.tortenet-kepek { display: grid; gap: 24px; }
.tortenet-kepek figure { margin: 0; }
.tortenet-kepek img { border-radius: var(--sugar); aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
.tortenet-kepek figcaption { font: italic 400 1rem var(--serif); color: var(--tinta-3); margin-top: 8px; }
.tortenet-kepek figure:nth-child(2) { margin-left: 15%; }
.idovonal-szakasz { background: var(--papir-2); }
.idovonal { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; position: relative; }
.idovonal::before { content: ''; position: absolute; left: 0; right: 0; top: 34px; height: 1.5px; background: var(--gesztenye); opacity: .5; }
.idovonal li { padding: 0 18px 0 0; position: relative; }
.idovonal b { display: block; font: italic 500 2.2rem/1 var(--serif); color: var(--gesztenye); margin-bottom: 28px; }
.idovonal li::before { content: ''; position: absolute; left: 0; top: 29px; width: 12px; height: 12px; border-radius: 50%; background: var(--papir-2); border: 2px solid var(--gesztenye); }
.idovonal p { color: var(--tinta-2); font-size: .98rem; }

/* ---------- szolgáltatások */
.arlista { width: 100%; border-collapse: collapse; background: #fbf8f2; border-radius: var(--sugar); overflow: hidden; border: 1px solid var(--vonal); }
.arlista caption { text-align: left; font: 500 1.5rem var(--serif); padding-bottom: 12px; }
.arlista th, .arlista td { padding: 16px 20px; border-bottom: 1px solid var(--vonal); text-align: left; vertical-align: top; }
.arlista tr:last-child th, .arlista tr:last-child td { border-bottom: 0; }
.arlista th a { font: 600 1.1rem var(--serif); color: var(--tinta); text-decoration: none; }
.arlista th a:hover { color: var(--gesztenye); }
.arlista th small { display: block; font-weight: 400; color: var(--tinta-3); font-size: .82rem; }
.arlista td { color: var(--tinta-2); font-size: .95rem; }
.ar-kartyak { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 1.6em; }
.ar-kartyak div { border: 1px solid rgba(239, 227, 200, .25); border-radius: var(--sugar); padding: 20px; }
.ar-kartyak span { display: block; font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: var(--arany); }
.ar-kartyak b { display: block; font: 500 1.9rem/1.2 var(--serif); color: #fff; margin: 6px 0; }
.ar-kartyak small { color: rgba(239, 227, 200, .75); font-size: .88rem; line-height: 1.45; display: block; }
.szolg-kep { margin: 0 0 24px; }
.szolg-kep img { border-radius: var(--sugar); aspect-ratio: 16 / 10; object-fit: cover; width: 100%; object-position: center 30%; }
.feltetelek { border-left: 2px solid var(--arany); padding-left: 22px; }
.feltetelek h3 { font-size: 1.35rem; }
.feltetelek ul { margin: 0; padding-left: 1.1em; color: rgba(239, 227, 200, .85); }
.feltetelek li { margin-bottom: 6px; }
.rehab-fej { align-items: end; margin-bottom: 40px; }
.rehab-racs { display: grid; grid-template-columns: 1fr 1.2fr; gap: 28px; }
.rehab-doboz { background: #fbf8f2; border: 1px solid var(--vonal); border-radius: var(--sugar); padding: 30px; }
.rehab-doboz h3 { font-size: 1.5rem; margin-bottom: 1em; }
.pipas { list-style: none; margin: 0; padding: 0; }
.pipas li { padding: 9px 0 9px 32px; border-bottom: 1px dashed var(--vonal); position: relative; }
.pipas li:last-child { border-bottom: 0; }
.pipas li::before { content: ''; position: absolute; left: 4px; top: 15px; width: 12px; height: 7px; border: solid var(--gesztenye); border-width: 0 0 2px 2px; transform: rotate(-45deg); }
.cimkek { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.cimkek li { padding: 8px 16px; border-radius: 999px; background: var(--papir-2); font-size: .95rem; font-weight: 500; }
.megjegyzes { margin-top: 32px; font: italic 400 1.25rem var(--serif); color: var(--gesztenye); text-align: center; }

/* ---------- kapcsolat */
.kapcs-racs { display: grid; grid-template-columns: 1fr 1.3fr; gap: 40px; }
.kapcs-kartya { background: var(--tinta); color: var(--krem); border-radius: calc(var(--sugar) + 4px); padding: 40px; position: relative; overflow: hidden; }
.kapcs-kartya::after { content: ''; position: absolute; right: -40px; bottom: -40px; width: 220px; height: 220px; background: var(--foltok); filter: invert(1); opacity: .08; }
.kapcs-kartya h2 { color: #fff; }
.kapcs-nev { font: italic 500 1.45rem var(--serif); }
.kapcs-nev small { display: block; font: 400 .85rem var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--arany); }
.kapcs-lista { margin: 0 0 28px; }
.kapcs-lista div { display: grid; grid-template-columns: 100px 1fr; gap: 12px; padding: 12px 0; border-bottom: 1px solid rgba(239, 227, 200, .15); }
.kapcs-lista dt { font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--arany); padding-top: 4px; }
.kapcs-lista dd { margin: 0; }
.kapcs-kartya a { color: #fff; }
.kapcs-kartya .gomb { background: var(--krem); color: var(--tinta); border-color: var(--krem); position: relative; z-index: 1; }
.kapcs-kartya .gomb-vonal { background: transparent; color: var(--krem); }
.terkep { border-radius: calc(var(--sugar) + 4px); overflow: hidden; height: 400px; border: 1px solid var(--vonal); background: var(--papir-2); }
.terkep iframe { width: 100%; height: 100%; border: 0; }
.utvonalak { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 16px; }
.utvonal { display: flex; align-items: center; gap: 12px; padding: 14px; border: 1px solid var(--vonal); border-radius: var(--sugar); background: #fbf8f2; color: var(--tinta); text-decoration: none; }
.utvonal:hover { border-color: var(--gesztenye); }
.nav-logo { flex: none; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: #fff; border: 1px solid var(--vonal); }
.nav-waze { background: #33ccff; border-color: #33ccff; }
.nav-apple { background: #000; border-color: #000; }
.nav-apple img { margin-top: -2px; }
.utvonal b { display: block; font-size: .95rem; }
.utvonal small { display: block; color: var(--tinta-3); font-size: .8rem; }

/* ---------- lábléc */
.lab { background: #15120f; color: rgba(239, 227, 200, .78); padding: 72px 0 28px; }
.lab-belso { max-width: var(--keret); margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: 1.3fr 1.2fr 1fr 1fr; gap: 40px; }
.lab h3 { font: 600 .74rem var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--arany); margin-bottom: 1.2em; }
.lab ul { list-style: none; margin: 0; padding: 0; }
.lab li { margin-bottom: 6px; }
.lab a { color: var(--krem); text-decoration: none; }
.lab a:hover { color: var(--arany); }
.logo-vilagos { color: var(--krem); }
.logo-vilagos small { color: rgba(239, 227, 200, .55); }
.lab-jelmondat { font: italic 400 1.6rem var(--serif); color: var(--krem); margin-top: 1.2em; }
.lab-also { max-width: var(--keret); margin: 48px auto 0; padding: 24px 24px 0; border-top: 1px solid rgba(239, 227, 200, .12); font-size: .85rem; color: rgba(239, 227, 200, .45); }

/* ---------- képnézegető */
.nagyito { padding: 0; border: 0; background: transparent; max-width: 100vw; max-height: 100vh; width: 100vw; height: 100vh; }
.nagyito::backdrop { background: rgba(15, 12, 10, .94); }
.nagyito[open] { display: flex; align-items: center; justify-content: center; }
.nagyito img { max-width: calc(100vw - 140px); max-height: calc(100vh - 100px); object-fit: contain; border-radius: 6px; }
.nagyito button { position: absolute; background: rgba(239, 227, 200, .12); color: var(--krem); border: 0; width: 52px; height: 52px; border-radius: 50%;
  font-size: 2rem; line-height: 1; cursor: pointer; transition: background .2s; }
.nagyito button:hover { background: rgba(239, 227, 200, .28); }
.ny-zar { top: 18px; right: 18px; }
.ny-elozo { left: 18px; top: 50%; transform: translateY(-50%); }
.ny-kovetkezo { right: 18px; top: 50%; transform: translateY(-50%); }
.ny-felirat { position: absolute; bottom: 14px; left: 0; right: 0; text-align: center; color: var(--krem); font: italic 400 1.1rem var(--serif); margin: 0; }

/* megjelenés görgetéskor */
.feltunik { opacity: 0; transform: translateY(24px); transition: opacity .8s, transform .8s cubic-bezier(.2, .7, .2, 1); }
.feltunik.lathato { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } .feltunik { opacity: 1; transform: none; } }

/* ---------- reszponzív */
@media (max-width: 1080px) {
  .men-racs { grid-template-columns: repeat(2, 1fr); }
  .lab-belso { grid-template-columns: 1fr 1fr; }
  .idovonal { grid-template-columns: 1fr; gap: 24px; }
  .idovonal::before { left: 5px; right: auto; top: 0; bottom: 0; width: 1.5px; height: auto; }
  .idovonal li { padding-left: 36px; }
  .idovonal li::before { top: 8px; }
  .idovonal b { margin-bottom: 8px; }
}
@media (max-width: 900px) {
  .menu-gomb { display: block; }
  #menu { position: fixed; inset: 70px 0 0 0; background: var(--papir); overflow-y: auto; padding: 16px 24px 40px; transform: translateX(100%); visibility: hidden; transition: transform .3s, visibility 0s .3s; }
  #menu.nyitva { transform: none; visibility: visible; transition: transform .3s; }
  #menu > ul { flex-direction: column; gap: 0; }
  #menu > ul > li { border-bottom: 1px solid var(--vonal); }
  #menu > ul > li > a { font: 500 1.6rem var(--serif); padding: 14px 0; border-radius: 0; }
  #menu > ul > li > a:hover, #menu > ul > li > a.aktiv { background: none; }
  .van-al > a::after { display: none; }
  .al { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; background: none; padding: 0 0 12px; min-width: 0; }
  .al a { padding: 6px 0; color: var(--tinta-2); }
  .hos { grid-template-columns: 1fr; padding-top: 32px; gap: 32px; }
  .hos-kepek { height: 420px; }
  .hk-1 { height: 330px; top: 30px; }
  .hk-2 { height: 220px; }
  .hk-3 { height: 180px; }
  .ket-has, .tortenet, .kapcs-racs, .kapcs-sav-belso, .rehab-racs { grid-template-columns: 1fr; gap: 36px; }
  .szolg-racs { grid-template-columns: 1fr; }
  .men { grid-template-columns: 1fr; gap: 28px; padding: 48px 0; }
  .men-tukor .men-fokep { order: 0; }
  .men-fokep { position: static; }
  .lo { grid-template-columns: 1fr; gap: 20px; }
  .tortenet-kepek figure:nth-child(2) { margin-left: 0; }
  .ugro-sav { top: 70px; }
  .szakasz { padding: 72px 0; }
}
@media (max-width: 600px) {
  body { font-size: 16px; }
  .keret, .fej-belso, .hos, .lab-belso { padding-left: 16px; padding-right: 16px; }
  .logo-szoveg small { display: none; }
  .hos-kepek { height: 340px; }
  .hk-1 { width: 70%; height: 260px; top: 20px; }
  .hk-2 { width: 44%; height: 170px; }
  .hk-3 { width: 46%; height: 150px; border-width: 4px; }
  .men-racs { grid-template-columns: 1fr 1fr; gap: 16px; }
  .men-szoveg b { font-size: 1.2rem; }
  .men-szoveg small, .men-ar { font-size: .72rem; }
  .men-ar { padding: 3px 8px; }
  .adatok { grid-template-columns: 1fr 1fr; }
  .evjarat { grid-template-columns: 1fr; gap: 14px; }
  .evjarat ul { grid-template-columns: repeat(2, 1fr); }
  .lab-belso { grid-template-columns: 1fr; }
  .utvonalak { grid-template-columns: 1fr; }
  .ar-kartyak { grid-template-columns: 1fr; }
  .ar-doboz { grid-template-columns: 1fr; }
  .kapcs-kartya { padding: 28px 22px; }
  .kapcs-lista div { grid-template-columns: 1fr; gap: 2px; }
  .kapcs-sav-adatok p { grid-template-columns: 1fr; gap: 0; }
  .csalad { grid-template-columns: 1fr; }
  .csalad-lo { grid-row: auto; border-right: 0; border-bottom: 1.5px solid var(--gesztenye); padding: 0 0 8px; max-width: none; }
  .menek-banner span { left: 22px; right: 22px; }
  .nagyito img { max-width: 100vw; max-height: calc(100vh - 140px); border-radius: 0; }
  .ny-elozo, .ny-kovetkezo { top: auto; bottom: 50px; transform: none; }
  .arlista th, .arlista td { display: block; padding: 12px 16px; }
  .arlista th { border-bottom: 0; padding-bottom: 0; }
}