@charset "utf-8";
/* Kóré Cukrászda, koncepció-minta.
   Motívum: a VITRIN. Egy 1px búza-arany hajszálkeret, 8px belső hézaggal.
   Ugyanaz a polc, ugyanaz a fény, vadul különböző torták. */

/* ---------- betűk ---------- */
/* Display: Yeseva One. A Kore sajat logoja kezirasos, regi cukrasz-cegér karakteru;
   ehhez a Fraunces (amit minden AI-oldal hasznal) nem illett. A Yeseva One
   regi bolti tabla-karakteru, es hozza a magyar hosszu ekezeteket. */
@font-face{font-family:"Yeseva";src:url("assets/fonts/yeseva-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Eczar";src:url("assets/fonts/eczar-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Eczar";src:url("assets/fonts/eczar-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Manrope";src:url("assets/fonts/manrope-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Manrope";src:url("assets/fonts/manrope-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}

/* ---------- paletta ---------- */
:root{
  --szilva:#241A26;
  --szilva-melyebb:#1C1420;
  --szilva-kartya:#3A2A3F;
  --porcelan:#F5F1EA;
  --porcelan-halk:#B9ADB7;
  --barack:#E4A05A;
  --buza:#D9C08A;
  --buza-halk:rgba(217,192,138,.34);
  --buza-kozep:rgba(217,192,138,.58);
  --lap-halk:#5E4A62;
  --hezag:8px;
  --sav:clamp(24px,5vw,64px);
  --max:1280px;
  --konnyu:cubic-bezier(.22,.68,.28,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--szilva);color:var(--porcelan);
  font-family:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:clamp(16px,.4vw + 15px,18px);line-height:1.66;
  font-variant-numeric:tabular-nums;
  overflow-x:hidden;
}
img,svg,video{max-width:100%;height:auto;display:block}
::selection{background:var(--barack);color:var(--szilva)}
:focus-visible{outline:2px solid var(--barack);outline-offset:3px;border-radius:1px}

h1,h2,h3,h4{font-family:"Yeseva","Eczar",Georgia,serif;font-weight:400;margin:0;letter-spacing:-.012em;line-height:1.08}
p{margin:0 0 1em}
a{color:inherit}

.rejtett{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.kihagyo{position:absolute;left:-9999px;top:0;background:var(--barack);color:var(--szilva);padding:10px 16px;z-index:60;font-weight:600}
.kihagyo:focus{left:8px;top:8px}

/* ---------- szerkezeti alapok ---------- */
.belso{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--sav)}
.szuk{max-width:74ch}
.hasab{max-width:68ch}

.cimke{font-family:"Manrope";font-size:11px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--buza);margin:0 0 14px;display:block}

/* polc: a vitrin vízszintes vonala, bal oldali konzol-jellel */
.polc{border:0;height:1px;background:var(--buza-halk);margin:0;position:relative}
.polc::before{content:"";position:absolute;left:0;top:-5px;width:1px;height:11px;background:var(--buza)}
.polc::after{content:"";position:absolute;left:26px;top:-3px;width:1px;height:7px;background:var(--buza-kozep)}

/* ---------- fejléc ---------- */
.demosav{margin:0;background:var(--szilva-melyebb);color:var(--porcelan-halk);
  font-size:12px;letter-spacing:.06em;text-align:center;padding:9px 16px;
  border-bottom:1px solid var(--buza-halk)}

.fejlec{position:relative;z-index:30;background:var(--szilva);border-bottom:1px solid var(--buza-halk)}
.fejlec-belso{max-width:var(--max);margin-inline:auto;padding:16px var(--sav);
  display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.jel{text-decoration:none;display:flex;align-items:baseline;gap:9px;flex:0 0 auto}
.jel-nev{font-family:"Yeseva";font-weight:600;font-size:27px;letter-spacing:.005em;color:var(--porcelan)}
.jel-alsor{font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--buza)}
.fo-nav{margin-left:auto}
.fo-nav ul{list-style:none;display:flex;gap:clamp(14px,2vw,30px);margin:0;padding:0;flex-wrap:wrap}
.fo-nav a{text-decoration:none;font-size:14.5px;color:var(--porcelan-halk);padding-bottom:4px;
  border-bottom:1px solid transparent;transition:color .16s var(--konnyu),border-color .16s var(--konnyu)}
.fo-nav a:hover{color:var(--porcelan);border-bottom-color:var(--buza)}
.fo-nav a[aria-current="page"]{color:var(--porcelan);border-bottom-color:var(--barack)}

.gomb{display:inline-flex;align-items:center;gap:10px;background:var(--barack);color:var(--szilva);
  text-decoration:none;font-weight:600;font-size:15px;padding:13px 22px;border:1px solid var(--barack);
  border-radius:0;cursor:pointer;font-family:inherit;transition:background .16s var(--konnyu),color .16s var(--konnyu)}
.gomb:hover{background:#F0B274;border-color:#F0B274}
.gomb--halk{background:transparent;color:var(--porcelan);border-color:var(--buza-kozep)}
.gomb--halk:hover{background:transparent;border-color:var(--buza);color:var(--buza)}
.gomb--nagy{font-size:16.5px;padding:16px 28px}
.gomb-nyil{font-size:13px;line-height:1}

/* mobil-nav: JS nélkül is működő details */
.mobil-nav{display:none;margin-left:auto}
.mobil-nav summary{list-style:none;cursor:pointer;font-size:14px;font-weight:600;color:var(--buza);
  border:1px solid var(--buza-halk);padding:9px 14px}
.mobil-nav summary::-webkit-details-marker{display:none}
.mobil-nav[open] summary{border-color:var(--buza)}
.mobil-nav ul{list-style:none;margin:10px 0 0;padding:0;position:absolute;right:var(--sav);
  background:var(--szilva-kartya);border:1px solid var(--buza-halk);min-width:212px;z-index:40}
.mobil-nav li+li{border-top:1px solid var(--buza-halk)}
.mobil-nav a{display:block;padding:13px 18px;text-decoration:none;font-size:15px;color:var(--porcelan)}
.mobil-nav a[aria-current="page"]{color:var(--barack)}

/* ---------- vitrin: a szignatúra ---------- */
.vitrin{position:relative;display:block;padding:var(--hezag);text-decoration:none;color:inherit}
.vitrin-keret{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.vitrin-keret rect{fill:none;stroke:var(--buza-halk);stroke-width:1;
  stroke-dasharray:100;stroke-dashoffset:100;transition:stroke .15s linear}
.vitrin:hover .vitrin-keret rect,.vitrin:focus-visible .vitrin-keret rect{stroke:var(--buza)}
.vitrin-kep{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--szilva-kartya)}
.vitrin-kep img{width:100%;height:100%;object-fit:cover}
.vitrin--fekvo .vitrin-kep{aspect-ratio:3/2}
.vitrin-alairas{padding:13px 3px 3px}
.vitrin-alkalom{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--buza);display:block}
.vitrin-leiras{display:block;font-size:14.5px;line-height:1.42;color:var(--porcelan);margin-top:6px}
.vitrin-tett{display:inline-flex;align-items:center;gap:7px;margin-top:9px;font-size:13px;
  color:var(--barack);text-decoration:none;border-bottom:1px solid transparent}
.vitrin-tett:hover{border-bottom-color:var(--barack)}

/* nagyítható kép */
.nagyithato{cursor:zoom-in}

/* rács-változatok */
.racs{display:grid;gap:clamp(18px,2.4vw,34px)}
.racs--3{grid-template-columns:repeat(3,1fr)}
.racs--4{grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.8vw,22px)}
.racs--2{grid-template-columns:repeat(2,1fr)}

/* mozgás: vitrin-nyitás */
.js .vitrin .vitrin-kep img,.js .vitrin .vitrin-toltelek{opacity:0;filter:blur(6px)}
.js .vitrin.latszik .vitrin-kep img,.js .vitrin.latszik .vitrin-toltelek{
  opacity:1;filter:blur(0);
  transition:opacity .4s var(--konnyu) var(--kesleltetes,0ms),filter .4s var(--konnyu) var(--kesleltetes,0ms)}
.js .vitrin.latszik .vitrin-keret rect{
  stroke-dashoffset:0;
  transition:stroke-dashoffset .4s var(--konnyu) var(--kesleltetes,0ms),stroke .15s linear}
html:not(.js) .vitrin-keret rect{stroke-dashoffset:0}

/* halk alap-reveal a nem-vitrin blokkokra */
.js [data-fel]{opacity:0;transform:translateY(14px)}
.js [data-fel].latszik{opacity:1;transform:none;transition:opacity .5s var(--konnyu),transform .5s var(--konnyu)}

/* ---------- hero ---------- */
.hero{padding:clamp(48px,7vw,104px) 0 0;position:relative}
.hero-belso{max-width:var(--max);margin-inline:auto;padding-inline:var(--sav);
  display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.86fr);
  gap:clamp(28px,5vw,72px);align-items:center}
.hero h1{font-size:clamp(35px,6.1vw,70px);line-height:1.04;margin:0 0 22px;max-width:14ch}
.hero h1 em{font-style:normal;color:var(--barack)}
.hero-mondat{color:var(--porcelan-halk);max-width:46ch;font-size:clamp(16px,.5vw + 15px,18.5px)}
.hero-tettek{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:30px}
.hero-tel{color:var(--porcelan);text-decoration:none;font-size:15px;border-bottom:1px solid var(--buza-halk);padding-bottom:3px}
.hero-tel:hover{border-bottom-color:var(--buza)}
.hero-kep{position:relative;padding:var(--hezag)}
.hero-kep img{width:100%;aspect-ratio:4/5;object-fit:cover}
.hero-jegyzet{margin:16px 0 0;font-size:12.5px;color:var(--porcelan-halk);letter-spacing:.02em}
.hero-polc{max-width:var(--max);margin:clamp(44px,6vw,88px) auto 0;padding-inline:var(--sav)}

/* ---------- általános sávok ---------- */
.sav{padding-block:clamp(56px,7.4vw,116px)}
.sav--suru{padding-block:clamp(38px,4.4vw,62px)}
.sav--levegos{padding-block:clamp(74px,10vw,164px)}
.sav--kartya{background:var(--szilva-melyebb)}
.sav-fej{display:flex;justify-content:space-between;align-items:flex-end;gap:26px;flex-wrap:wrap;margin-bottom:clamp(26px,3.4vw,46px)}
.sav-fej h2{font-size:clamp(27px,3.5vw,43px);max-width:19ch}
.sav-fej p{margin:0;color:var(--porcelan-halk);font-size:14.5px;max-width:40ch}

/* ---------- „Ma a pultban” csík ---------- */
.pult-csik{display:flex;gap:clamp(14px,1.8vw,24px);overflow-x:auto;padding-bottom:14px;
  scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.pult-csik>*{flex:0 0 clamp(198px,23vw,254px);scroll-snap-align:start}
.pult-csik::-webkit-scrollbar{height:5px}
.pult-csik::-webkit-scrollbar-thumb{background:var(--buza-halk)}
.vitrin-toltelek{aspect-ratio:4/5;display:flex;flex-direction:column;justify-content:flex-end;
  padding:22px 18px;background:var(--szilva-kartya)}
.toltelek-ar{font-family:"Yeseva";font-weight:600;font-size:clamp(29px,3.4vw,40px);color:var(--buza);line-height:1}
.toltelek-nev{font-size:14px;color:var(--porcelan);margin-top:9px;line-height:1.35}
.toltelek-egyseg{font-size:12px;color:var(--porcelan-halk);margin-top:5px}

/* ---------- bizalmi sáv ---------- */
.bizalom{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--buza-halk);border-bottom:1px solid var(--buza-halk)}
.bizalom>div{padding:clamp(24px,3vw,38px) clamp(14px,2vw,28px)}
.bizalom>div+div{border-left:1px solid var(--buza-halk)}
.bizalom dt{font-family:"Yeseva";font-weight:600;font-size:clamp(28px,3.6vw,46px);color:var(--porcelan);line-height:1}
.bizalom dd{margin:10px 0 0;font-size:13.5px;color:var(--porcelan-halk);line-height:1.44}

/* ---------- lépés-kártyák ---------- */
.lepesek{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,32px)}
.lepes{position:relative;padding:clamp(24px,2.6vw,34px)}
.lepes-keret{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.lepes-keret rect{fill:none;stroke:var(--buza-halk);stroke-width:1}
.lepes-szam{font-family:"Yeseva";font-weight:600;font-size:15px;color:var(--barack);display:block;margin-bottom:16px;letter-spacing:.06em}
.lepes h3{font-size:clamp(19px,1.7vw,23px);margin:0 0 12px}
.lepes p{margin:0;font-size:14.8px;color:var(--porcelan-halk);line-height:1.6}

/* ---------- teljes szélességű fotósáv ---------- */
.fotosav{position:relative;isolation:isolate;min-height:clamp(340px,44vw,520px);display:flex;align-items:flex-end}
.fotosav img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.fotosav::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(28,20,32,.95) 0%,rgba(28,20,32,.86) 34%,rgba(28,20,32,.42) 70%,rgba(28,20,32,.3) 100%)}
.fotosav-belso{max-width:var(--max);margin-inline:auto;padding:clamp(38px,5.4vw,76px) var(--sav);width:100%}
.fotosav h2{font-size:clamp(26px,3.4vw,42px);max-width:15ch;margin-bottom:16px}
.fotosav p{color:var(--porcelan);max-width:44ch;margin-bottom:20px}
.fotosav .ar-kiemelt{font-family:"Yeseva";font-weight:600;color:var(--buza);font-size:clamp(22px,2.4vw,30px)}

/* ---------- tipográfiai tábla (fotó nélküli sávok) ---------- */
.tabla{position:relative;padding:clamp(30px,4vw,58px)}
.tabla-keret{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.tabla-keret rect{fill:none;stroke:var(--buza-halk);stroke-width:1}
.tabla-racs{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(26px,4vw,60px);align-items:center}
.tabla-allitas{font-family:"Yeseva";font-weight:600;font-size:clamp(24px,3.2vw,40px);line-height:1.14;margin:0}
.tabla-adat{margin:0;font-size:15px;color:var(--porcelan-halk)}
.tabla-adat dt{color:var(--buza);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;margin-top:18px}
.tabla-adat dt:first-child{margin-top:0}
.tabla-adat dd{margin:5px 0 0;color:var(--porcelan)}
.tabla-adat a{color:var(--porcelan);text-decoration:none;border-bottom:1px solid var(--buza-halk)}
.tabla-adat a:hover{border-bottom-color:var(--buza)}

/* ---------- szűrő-chipek ---------- */
.chipek{display:flex;flex-wrap:wrap;gap:9px;margin:0 0 clamp(28px,3.4vw,44px);padding:0;list-style:none}
.chip{display:inline-block;padding:9px 17px;border:1px solid var(--buza-halk);color:var(--porcelan-halk);
  text-decoration:none;font-size:13.5px;font-weight:600;letter-spacing:.03em;background:transparent;
  font-family:inherit;cursor:pointer;transition:border-color .16s var(--konnyu),color .16s var(--konnyu)}
.chip:hover{border-color:var(--buza);color:var(--porcelan)}
.chip[aria-current="true"],.chip[aria-pressed="true"]{border-color:var(--barack);color:var(--barack)}

.alkalom-blokk{margin-bottom:clamp(44px,5.6vw,84px)}
.alkalom-blokk h3{font-size:clamp(21px,2.3vw,29px);margin:0 0 6px}
.alkalom-blokk .alkalom-alcim{color:var(--porcelan-halk);font-size:14.5px;margin:0 0 clamp(20px,2.4vw,32px)}

/* üres állapot: nem lyuk, hanem tervezett kártya */
.ures{position:relative;padding:var(--hezag)}
.ures-belso{aspect-ratio:4/5;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  gap:16px;padding:clamp(20px,2.4vw,30px);background:var(--szilva-kartya)}
.ures-belso p{margin:0;font-size:14.5px;color:var(--porcelan-halk)}
.ures-rajz{width:82px;height:auto;stroke:var(--buza);fill:none;stroke-width:1.1}

/* ---------- szeletszám-vonalzó ---------- */
.vonalzo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.82fr);gap:clamp(26px,4vw,64px);align-items:center}
.vonalzo-rajz{position:relative;padding:var(--hezag)}
.vonalzo-svg{width:100%;height:auto;display:block;background:var(--szilva-melyebb)}
.vonalzo-svg .vonal{stroke:var(--buza);fill:none;stroke-width:1.1;vector-effect:non-scaling-stroke}
.vonalzo-svg .halk{stroke:var(--buza-halk)}
.vonalzo-svg text{fill:var(--porcelan-halk);font-family:"Manrope",sans-serif;font-size:9px;letter-spacing:.08em}
.vonalzo-vezerlo{display:none}
.js .vonalzo-vezerlo{display:block;margin-top:22px}
.vonalzo-vezerlo label{display:block;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--buza);margin-bottom:12px}
input[type=range]{width:100%;accent-color:var(--barack);height:26px;background:transparent}
.vonalzo-kiiras{font-family:"Yeseva";font-weight:600;font-size:clamp(25px,3vw,37px);color:var(--porcelan);margin:20px 0 6px;line-height:1.1}
.vonalzo-jegyzet{font-size:14px;color:var(--porcelan-halk);max-width:42ch}

/* ---------- rendelőlap ---------- */
.alkalom-csempek{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,20px);margin:0;padding:0;border:0}
.alkalom-csempek legend{padding:0;margin:0 0 clamp(22px,3vw,36px);float:left;width:100%}
.csempe{position:relative}
.csempe input{position:absolute;opacity:0;width:1px;height:1px}
.csempe label{display:flex;flex-direction:column;justify-content:flex-end;gap:8px;min-height:clamp(112px,13vw,158px);
  padding:clamp(16px,1.8vw,24px);border:1px solid var(--buza-halk);cursor:pointer;
  transition:border-color .16s var(--konnyu),background .16s var(--konnyu)}
.csempe label:hover{border-color:var(--buza)}
.csempe input:focus-visible+label{outline:2px solid var(--barack);outline-offset:3px}
.csempe input:checked+label{border-color:var(--barack);background:rgba(228,160,90,.09)}
.csempe-nev{font-family:"Yeseva";font-weight:600;font-size:clamp(18px,2vw,25px);line-height:1.1}
.csempe-jel{width:15px;height:15px;border:1px solid var(--buza-kozep);border-radius:50%;position:relative}
.csempe input:checked+label .csempe-jel{border-color:var(--barack)}
.csempe input:checked+label .csempe-jel::after{content:"";position:absolute;inset:3px;background:var(--barack);border-radius:50%}

.urlap-racs{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(30px,4.4vw,72px);align-items:start}
.mezo-racs{display:grid;grid-template-columns:repeat(2,1fr);gap:18px clamp(16px,2vw,26px)}
.mezo{display:flex;flex-direction:column;gap:8px}
.mezo--teljes{grid-column:1/-1}
.mezo label,.mezocsoport-cim{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--buza)}
.mezo input,.mezo select,.mezo textarea{
  font-family:inherit;font-size:15.5px;color:var(--porcelan);background:var(--szilva-melyebb);
  border:1px solid var(--buza-halk);border-radius:0;padding:12px 14px;width:100%;
  transition:border-color .16s var(--konnyu)}
.mezo textarea{min-height:96px;resize:vertical;line-height:1.55}
.mezo input:hover,.mezo select:hover,.mezo textarea:hover{border-color:var(--buza-kozep)}
.mezo input:focus,.mezo select:focus,.mezo textarea:focus{outline:none;border-color:var(--barack)}
.mezo-sugo{font-size:13px;color:var(--porcelan-halk);line-height:1.5}
.mezo-kotelezo{color:var(--barack)}

fieldset.agi{border:0;padding:0;margin:clamp(24px,3vw,40px) 0 0;min-width:0}
fieldset.agi legend{padding:0;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--buza);margin-bottom:16px}

/* JS nélkül is ágazik: :has() alapú elágazás */
@supports selector(:has(*)){
  .agi[data-agi]{display:none}
  #urlap:has(#alk-gyerekzsur:checked) .agi[data-agi~="gyerekzsur"],
  #urlap:has(#alk-szulinap:checked) .agi[data-agi~="szulinap"],
  #urlap:has(#alk-eskuvo:checked) .agi[data-agi~="eskuvo"],
  #urlap:has(#alk-ballagas:checked) .agi[data-agi~="ballagas"],
  #urlap:has(#alk-evfordulo:checked) .agi[data-agi~="evfordulo"],
  #urlap:has(#alk-ceges:checked) .agi[data-agi~="ceges"]{display:block}
  .panel[data-panel]{display:none}
  .panel--alap{display:block}
  #urlap:has(#alk-gyerekzsur:checked) .panel[data-panel="gyerekzsur"],
  #urlap:has(#alk-szulinap:checked) .panel[data-panel="szulinap"],
  #urlap:has(#alk-eskuvo:checked) .panel[data-panel="eskuvo"],
  #urlap:has(#alk-ballagas:checked) .panel[data-panel="ballagas"],
  #urlap:has(#alk-evfordulo:checked) .panel[data-panel="evfordulo"],
  #urlap:has(#alk-ceges:checked) .panel[data-panel="ceges"]{display:block}
  #urlap:has(#alk-gyerekzsur:checked) .panel--alap,
  #urlap:has(#alk-szulinap:checked) .panel--alap,
  #urlap:has(#alk-eskuvo:checked) .panel--alap,
  #urlap:has(#alk-ballagas:checked) .panel--alap,
  #urlap:has(#alk-evfordulo:checked) .panel--alap,
  #urlap:has(#alk-ceges:checked) .panel--alap{display:none}
}

.panel-doboz{position:sticky;top:22px}
.panel h3{font-size:15px;font-family:"Manrope";font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--buza);margin:0 0 18px;font-size:11px}
.panel .racs{gap:14px}
.panel-jegyzet{font-size:13px;color:var(--porcelan-halk);margin:16px 0 0}

/* megrendelőlap: porcelán alapon szedve, ahogy a pultnál */
.lap{background:var(--porcelan);color:var(--szilva);padding:clamp(26px,3.4vw,46px);position:relative}
.lap::before{content:"";position:absolute;inset:9px;border:1px solid rgba(94,74,98,.28);pointer-events:none}
.lap-fej{display:flex;justify-content:space-between;align-items:baseline;gap:18px;flex-wrap:wrap;
  border-bottom:1px solid rgba(94,74,98,.3);padding-bottom:14px;margin-bottom:22px}
.lap-fej h3{font-size:clamp(20px,2.2vw,27px);color:var(--szilva)}
.lap-fej span{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--lap-halk)}
.lap-sorok{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:13px 20px;align-items:baseline}
.lap-sorok dt{font-size:11px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--lap-halk);white-space:nowrap}
.lap-sorok dd{margin:0;font-family:"Yeseva";font-size:17.5px;color:var(--szilva);line-height:1.35;
  border-bottom:1px dotted rgba(94,74,98,.5);min-height:1.5em;word-break:break-word}
.lap-labjegyzet{margin:24px 0 0;font-size:13px;color:var(--lap-halk);line-height:1.55}
.lap-labjegyzet strong{color:var(--szilva)}

.kuldes-sav{display:flex;align-items:center;gap:clamp(16px,2.4vw,32px);flex-wrap:wrap;margin-top:clamp(26px,3vw,40px)}
.kuldes-sav .telefon-kiiras{font-size:14.5px;color:var(--porcelan-halk)}
.kuldes-sav .telefon-kiiras a{color:var(--porcelan);text-decoration:none;border-bottom:1px solid var(--buza-halk)}
.kuldes-sav .telefon-kiiras a:hover{border-bottom-color:var(--buza)}

.tenyek{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px);margin:0}
.tenyek div{border-top:1px solid var(--buza-halk);padding-top:20px}
.tenyek dt{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--buza);margin-bottom:10px}
.tenyek dd{margin:0;font-size:14.8px;color:var(--porcelan-halk);line-height:1.6}

/* ---------- árlista-blokkok ---------- */
.arlista{margin:0;display:grid;gap:0}
.arlista div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  padding:14px 0;border-bottom:1px solid var(--buza-halk)}
.arlista dt{font-size:15.5px;color:var(--porcelan)}
.arlista dd{margin:0;font-family:"Yeseva";font-weight:600;font-size:17px;color:var(--buza);white-space:nowrap}
.izlista{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.izlista li{border:1px solid var(--buza-halk);padding:7px 14px;font-size:13.5px;color:var(--porcelan)}
.forrasjegyzet{font-size:12.5px;color:var(--porcelan-halk);margin-top:18px;line-height:1.55;max-width:62ch}

.csalad{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(26px,4vw,64px);align-items:center}
.csalad--forditva{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
.csalad--forditva .csalad-szoveg{order:2}
.csalad h3{font-size:clamp(23px,2.8vw,34px);margin:0 0 14px}
.csalad p{color:var(--porcelan-halk)}
.nagy-szam{font-family:"Yeseva";font-weight:600;font-size:clamp(64px,11vw,148px);color:var(--buza);
  line-height:.86;display:block;letter-spacing:-.03em}
.nagy-szam-alsor{display:block;font-family:"Manrope";font-size:12px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--porcelan-halk);margin-top:14px}

/* ---------- lábléc ---------- */
.lablec{background:var(--szilva-melyebb);border-top:1px solid var(--buza-halk);padding-block:clamp(44px,5.4vw,76px) 30px}
.lablec-fo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(28px,4vw,64px);
  padding-bottom:34px;border-bottom:1px solid var(--buza-halk)}
.lablec-adat{margin:0;font-size:15px}
.lablec-adat dt{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--buza);margin-top:18px}
.lablec-adat dt:first-of-type{margin-top:0}
.lablec-adat dd{margin:5px 0 0}
.lablec-adat a{color:var(--porcelan);text-decoration:none;border-bottom:1px solid var(--buza-halk)}
.lablec-adat a:hover{border-bottom-color:var(--buza)}
.lablec-nav ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.lablec-nav a{color:var(--porcelan-halk);text-decoration:none;font-size:15px}
.lablec-nav a:hover{color:var(--porcelan)}
.lablec-zaras{padding-top:26px;color:var(--porcelan-halk);font-size:12.5px;line-height:1.62;max-width:82ch}
.lablec-zaras p{margin:0 0 8px}

/* ---------- nagyító ---------- */
.lightbox{position:fixed;inset:0;z-index:80;background:rgba(20,14,23,.96);display:flex;
  align-items:center;justify-content:center;padding:clamp(16px,4vw,54px)}
.lightbox img{max-width:100%;max-height:84vh;object-fit:contain;border:1px solid var(--buza-halk)}
.lightbox-alairas{position:absolute;left:0;right:0;bottom:18px;text-align:center;font-size:13.5px;
  color:var(--porcelan-halk);padding-inline:16px}
.lightbox button{position:absolute;background:transparent;border:1px solid var(--buza-halk);color:var(--porcelan);
  font-family:inherit;font-size:18px;line-height:1;width:44px;height:44px;cursor:pointer}
.lightbox button:hover{border-color:var(--buza);color:var(--buza)}
.lightbox .lb-zar{top:clamp(12px,3vw,26px);right:clamp(12px,3vw,26px)}
.lightbox .lb-elozo{left:clamp(8px,2vw,22px);top:50%;transform:translateY(-50%)}
.lightbox .lb-kovetkezo{right:clamp(8px,2vw,22px);top:50%;transform:translateY(-50%)}

/* ---------- oldalfej az aloldalakon ---------- */
.oldalfej{padding:clamp(44px,6vw,92px) 0 clamp(28px,3.4vw,48px)}
.oldalfej h1{font-size:clamp(33px,5.4vw,62px);max-width:16ch;margin-bottom:20px}
.oldalfej p{color:var(--porcelan-halk);max-width:56ch;font-size:clamp(16px,.4vw + 15px,18px)}
.morzsa{font-size:12.5px;color:var(--porcelan-halk);margin:0 0 22px}
.morzsa a{color:var(--porcelan-halk);text-decoration:none;border-bottom:1px solid transparent}
.morzsa a:hover{color:var(--porcelan);border-bottom-color:var(--buza-halk)}

/* ---------- záró átvezetés ---------- */
.atvezeto{position:relative;padding:clamp(34px,4.6vw,68px);text-align:left}
.atvezeto-keret{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.atvezeto-keret rect{fill:none;stroke:var(--buza-halk);stroke-width:1}
.atvezeto h2{font-size:clamp(25px,3.2vw,40px);max-width:18ch;margin-bottom:16px}
.atvezeto p{color:var(--porcelan-halk);max-width:52ch}

/* ---------- reszponzív ---------- */
@media (max-width:1000px){
  .hero-belso{grid-template-columns:1fr;gap:34px}
  .hero-kep{order:-1;max-width:440px}
  .hero h1{max-width:18ch}
  .urlap-racs{grid-template-columns:1fr}
  /* egy hasábban a torták a csempék UTÁN, a mezők ELŐTT jönnek:
     a választás után rögtön tortát lát a vendég, nem űrlapot */
  .panel-doboz{position:static;order:-1;margin:clamp(14px,2.4vw,24px) 0 clamp(20px,3vw,32px)}
  .urlap-racs{display:flex;flex-direction:column}
  .vonalzo{grid-template-columns:1fr}
  .csalad,.csalad--forditva{grid-template-columns:1fr}
  .csalad--forditva .csalad-szoveg{order:0}
  .tabla-racs{grid-template-columns:1fr}
  .lablec-fo{grid-template-columns:1fr}
}
@media (max-width:820px){
  .fo-nav{display:none}
  .mobil-nav{display:block}
  .racs--3{grid-template-columns:repeat(2,1fr)}
  .racs--4{grid-template-columns:repeat(2,1fr)}
  .lepesek{grid-template-columns:1fr}
  .bizalom{grid-template-columns:repeat(2,1fr)}
  .bizalom>div:nth-child(odd){border-left:0}
  .bizalom>div:nth-child(n+3){border-top:1px solid var(--buza-halk)}
  .tenyek{grid-template-columns:1fr}
}
@media (max-width:640px){
  .mezo-racs{grid-template-columns:1fr}
  .alkalom-csempek{grid-template-columns:repeat(2,1fr)}
  .bizalom dt{font-size:30px}
  .fotosav::after{background:linear-gradient(180deg,rgba(28,20,32,.68) 0%,rgba(28,20,32,.9) 52%,rgba(28,20,32,.97) 100%)}
  .fotosav{align-items:flex-end;min-height:400px}
}
@media (max-width:430px){
  .racs--4{grid-template-columns:repeat(2,1fr)}
  .lightbox .lb-elozo,.lightbox .lb-kovetkezo{top:auto;bottom:60px;transform:none}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;scroll-behavior:auto !important}
  .js .vitrin .vitrin-kep img,.js .vitrin .vitrin-toltelek{filter:none}
  .js .vitrin.latszik .vitrin-kep img,.js .vitrin.latszik .vitrin-toltelek{transition:opacity .2s linear}
  .js .vitrin .vitrin-keret rect,.js .vitrin.latszik .vitrin-keret rect{stroke-dashoffset:0;transition:none}
  .js [data-fel]{transform:none}
  .js [data-fel].latszik{transition:opacity .2s linear}
}

@media print{
  .demosav,.fejlec,.lightbox,.mobil-nav{display:none}
  body{background:#fff;color:#000}
}

/* ---------- rendelőlap: csempék, hibák, visszaigazolás ---------- */
.alkalom-csempek legend{grid-column:1/-1;float:none;width:auto}
.alkalom-csempek legend .cimke{margin-bottom:10px}
.csempe-kerdes{font-family:"Yeseva","Eczar",Georgia,serif;font-weight:400;font-size:clamp(24px,3.2vw,40px);
  line-height:1.1;display:block;max-width:20ch;letter-spacing:-.012em}
.csempe label{position:relative;gap:6px}
.csempe-jel{position:absolute;top:clamp(14px,1.6vw,20px);right:clamp(14px,1.6vw,20px);margin:0}
.csempe-alsor{font-size:13px;color:var(--porcelan-halk);line-height:1.4;max-width:24ch}
.csempe input:checked+label .csempe-nev{color:var(--barack)}

.urlap-mezok{min-width:0}
.agi legend{color:var(--buza)}
.mezo-hiba{margin:0;font-size:13.5px;line-height:1.5;color:#F2B98A;
  border-left:2px solid var(--barack);padding-left:10px}
.mezo input[aria-invalid="true"],.mezo textarea[aria-invalid="true"]{border-color:var(--barack)}
.alkalom-csempek[aria-invalid="true"]+.mezo-hiba{margin-top:14px}
.mezo-sugo a{color:var(--porcelan)}

.panel-ures{border:1px solid var(--buza-halk);padding:clamp(20px,2.4vw,28px);
  display:flex;flex-direction:column;gap:16px;align-items:flex-start;background:var(--szilva-kartya)}
.panel-ures p{margin:0;font-size:14.5px;color:var(--porcelan-halk)}
.panel-ures a{color:var(--barack)}
.panel .vitrin-alairas{padding:10px 2px 2px}
.panel .vitrin-leiras{font-size:12.5px;line-height:1.35;margin-top:0}

/* élő megrendelőlap sáv */
.lap-sav{margin-top:clamp(46px,6vw,86px);border-top:1px solid var(--buza-halk);padding-top:clamp(34px,4vw,56px);
  display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);
  grid-template-rows:auto auto 1fr;column-gap:clamp(26px,4vw,64px);row-gap:26px;align-items:start}
.lap-sav-fej{grid-column:1;grid-row:1}
.lap-sav>.lap{grid-column:2;grid-row:1/span 3}
.lap-sav .kuldes-sav{grid-column:1;grid-row:2;margin-top:0}
.lap-sav>.mezo-sugo{grid-column:1;grid-row:3;align-self:start}
.lap-sav-cim{font-family:"Yeseva","Eczar",Georgia,serif;font-weight:400;font-size:clamp(24px,2.9vw,36px);
  line-height:1.1;margin:0 0 14px}
.lap-sav-fej p{color:var(--porcelan-halk);font-size:14.5px;max-width:34ch}
.lap-print{display:none}

/* visszaigazolás */
.vissza-fej{margin-bottom:clamp(28px,3.4vw,46px)}
.vissza-fej h2{font-size:clamp(27px,3.5vw,43px);max-width:20ch;margin-bottom:14px}
.vissza-fej p{color:var(--porcelan-halk);max-width:52ch;margin:0}
.vissza-racs{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(26px,4vw,64px);align-items:start}
.vissza-tettek h3{font-size:15px;font-family:"Manrope";font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--buza);margin:0 0 18px}
.vissza-tettek p{margin:0 0 10px}
.vissza-tettek .mezo-sugo{margin-bottom:22px;max-width:42ch}
.vissza-tettek .gomb{width:auto}

/* nyitvatartási táblázat */
.nyitva{width:100%;border-collapse:collapse;font-size:15.5px;max-width:560px}
.nyitva caption{text-align:left}
.nyitva th,.nyitva td{text-align:left;padding:13px 0;border-bottom:1px solid var(--buza-halk)}
.nyitva thead th{font-family:"Manrope";font-size:11px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--buza);padding-top:0}
.nyitva tbody th{font-weight:400;color:var(--porcelan)}
.nyitva td{font-family:"Yeseva","Eczar",Georgia,serif;font-weight:400;color:var(--porcelan);text-align:right}
.nyitva td.zarva{color:var(--porcelan-halk);font-family:"Manrope";font-weight:400;font-size:14.5px}

/* idézet-sáv */
.idezet-sav{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(28px,4.4vw,72px);align-items:center}
.idezet{margin:0 0 18px;padding:0;position:relative;padding-left:clamp(20px,3vw,38px);
  border-left:1px solid var(--buza-kozep)}
.idezet p{font-family:"Yeseva","Eczar",Georgia,serif;font-weight:400;font-size:clamp(19px,2.1vw,27px);
  line-height:1.38;margin:0;color:var(--porcelan)}

/* jelmondat */
.jelmondat{text-align:center;max-width:15ch;margin-inline:auto}
.jelmondat-szoveg{font-family:"Yeseva","Eczar",Georgia,serif;font-weight:400;font-size:clamp(30px,5.4vw,64px);
  line-height:1.06;letter-spacing:-.02em;color:var(--porcelan);margin:0 0 18px}
.jelmondat-alsor{color:var(--porcelan-halk);font-size:14.5px;margin:0;max-width:38ch;margin-inline:auto}

@media (max-width:1000px){
  .lap-sav{grid-template-columns:1fr}
  .lap-sav-fej,.lap-sav>.lap,.lap-sav .kuldes-sav,.lap-sav>.mezo-sugo{grid-column:1;grid-row:auto}
  .vissza-racs{grid-template-columns:1fr}
  .idezet-sav{grid-template-columns:1fr}
  .idezet-sav .vitrin{max-width:420px}
}
@media (max-width:640px){
  .panel .racs--3{grid-template-columns:repeat(3,1fr)}
}

/* ---------- nyomtatás: a rendelőlap A5-ön ---------- */
@media print{
  @page{size:A5 portrait;margin:12mm}
  body.oldal-rendeles{background:#fff;color:#000;font-size:10.5pt;overflow:visible}
  body.oldal-rendeles>*{display:none !important}
  body.oldal-rendeles>main{display:block !important}
  body.oldal-rendeles main>*{display:none !important}
  body.oldal-rendeles main>#visszaigazolas{display:block !important;padding:0}
  body.oldal-rendeles #visszaigazolas .belso{padding:0;max-width:none}
  body.oldal-rendeles .vissza-fej,body.oldal-rendeles .vissza-tettek{display:none !important}
  body.oldal-rendeles .vissza-racs{display:block}
  body.oldal-rendeles .lap{background:#fff;color:#000;padding:0}
  body.oldal-rendeles .lap::before{display:none}
  body.oldal-rendeles .lap-fej{border-bottom:1px solid #000;padding-bottom:8pt;margin-bottom:12pt}
  body.oldal-rendeles .lap-fej h3{color:#000;font-size:16pt}
  body.oldal-rendeles .lap-fej span{color:#000}
  body.oldal-rendeles .lap-sorok{gap:9pt 14pt}
  body.oldal-rendeles .lap-sorok dt{color:#000}
  body.oldal-rendeles .lap-sorok dd{color:#000;font-size:12pt;border-bottom:1px dotted #666}
  body.oldal-rendeles .lap-labjegyzet{color:#000;font-size:9pt;margin-top:14pt}
  body.oldal-rendeles .lap-print{display:block;margin:14pt 0 0;padding-top:8pt;
    border-top:1px solid #000;font-size:8.5pt;color:#000}
}

/* vonalzó: JS nélkül a statikus mérce és a közvetlen átvezetés marad */
.vonalzo-statikus{display:block;margin-top:22px}
.js .vonalzo-statikus{display:none}
.napo-jegyzet{font-size:13.5px;color:var(--porcelan-halk);margin:0 0 clamp(24px,3vw,38px);max-width:68ch;line-height:1.6}

/* ---------- A hero maga a vitrin (2026-08-10) ----------
   Nem "nagy cím plusz egy kép", hanem polcokra rendezett tortafal:
   a felső polcon a névtábla és két torta, az alsón négy. A polc a
   meglévő búza-arany vonal, tehát a motívum-rendszer viszi a hero-t is. */
.hero{padding-block:clamp(18px,2.6vw,40px) clamp(40px,6vw,72px)}
.hero-belso{display:block;grid-template-columns:none;gap:0;align-items:stretch}
.hero h1{max-width:none}
.polcsor{display:grid;gap:clamp(10px,1.4vw,18px);align-items:end}
.polcsor--felso{grid-template-columns:1fr;margin-bottom:clamp(12px,1.6vw,20px)}
.polcsor--also{grid-template-columns:repeat(2,1fr);margin-block:clamp(12px,1.6vw,20px)}
.hero .polc{margin:0}
.nevtabla{padding-block:clamp(6px,1.4vw,18px)}
.nevtabla h1{font-size:clamp(2.5rem,6.4vw,4.5rem);line-height:.98;letter-spacing:-.018em;margin:.5rem 0 0}
.nevtabla .hero-mondat{margin-top:1.1rem;max-width:46ch}
.nevtabla .hero-tettek{margin-top:1.7rem}
.vitrin--hero{margin:0}
.vitrin--hero img{aspect-ratio:4/5;width:100%;height:100%;object-fit:cover}
.vitrin--gelato img{aspect-ratio:4/5;object-position:50% 55%}
@media (min-width:720px){
  .polcsor--also{grid-template-columns:repeat(4,1fr)}
}
@media (min-width:1000px){
  .polcsor--felso{grid-template-columns:minmax(0,1.62fr) minmax(0,1fr) minmax(0,1fr)}
  .nevtabla{padding-right:clamp(14px,2vw,30px)}
}

/* Rács-túlcsordulás javítása: 1fr helyett minmax(0,1fr), különben a tartalom
   szétfeszíti a sávot keskeny képernyőn (390-en 378 > 342 volt). */
.racs--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.racs--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.racs--2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:820px){
  .racs--3,.racs--4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){
  .racs--3,.racs--4,.racs--2{grid-template-columns:minmax(0,1fr)}
}


/* ================================================================
   HERO: A CEGERTABLA. Dani valasztasa a hat variansbol (2026-08-10).
   A sajat logojuk napsargaja a hatter, a gesztenyebarna a vonal.
   ================================================================ */
/* =========================================================================
   HERO-VÁLTOZAT: A CÉGÉRTÁBLA
   Minden, ami itt van, a Kóré saját világából jön: a napsárga a logójuk sárgája,
   a vonalak a logó gesztenyebarnája, a korall a saját ár-pasztillájuk színe.
   A globális styles.css-t ez a blokk NEM módosítja, csak felülírja a változóit.
   ========================================================================= */

:root{
  /* saját, képből mért márkaszínek */
  --tinta:#582723;              /* gesztenyebarna vonal, a logó rajza */
  --tinta-melyebb:#3A1512;
  --tinta-halk:#6E3A2E;
  --nap:#FDD303;                /* a logó mélyebb sárgája */
  --nap-vilagos:#FEF35B;        /* a logó felső, világosabb sárgája */
  --nap-melyebb:#F2C300;
  --korall:#F7714B;             /* a saját posztgrafikáik ár-pasztillája */
  --tejszin:#FFF7E8;
  --tejszin-melyebb:#F6E7CC;
  --ct-lassu:cubic-bezier(.24,.72,.26,1);

  /* a globális paletta felülírása, hogy a fejléc is a márka világában legyen */
  --szilva:#FFF7E8;
  --szilva-melyebb:#582723;
  --szilva-kartya:#FFFDF6;
  --porcelan:#582723;
  --porcelan-halk:#7C544A;
  --barack:#582723;
  --buza:#582723;
  --buza-halk:rgba(88,39,35,.24);
  --buza-kozep:rgba(88,39,35,.5);
}

/* a demósáv barna szalag, krém betűvel */
.demosav{background:var(--tinta);color:rgba(255,247,232,.86);border-bottom:0}
.fejlec{background:var(--tejszin);border-bottom:1px solid rgba(88,39,35,.18)}
.jel-alsor{color:var(--tinta-halk)}
.kihagyo{background:var(--tinta);color:var(--tejszin)}

/* ---------------------------------------------------------------- tábla */
.cegertabla{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  color:var(--tinta);
  padding:clamp(34px,4.4vw,60px) 0 clamp(92px,9.5vw,120px);
  background:
    radial-gradient(118% 88% at 50% 0%, var(--nap-vilagos) 0%, var(--nap-vilagos) 18%, var(--nap) 62%, var(--nap-melyebb) 100%);
}

/* papír-textúra: nagyon halk szemcse, hogy a sárga ne legyen lapos, de ne is szürküljön */
.cegertabla::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='sz'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23sz)'/%3E%3C/svg%3E");
  background-size:190px 190px;
  mix-blend-mode:multiply;
  opacity:.13;
}
/* papír-rost és fény: normál rétegben, hogy a sárga sárga maradjon */
.cegertabla::after{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    repeating-linear-gradient(114deg, rgba(255,255,255,.13) 0 1px, rgba(255,255,255,0) 1px 6px),
    repeating-linear-gradient(24deg, rgba(88,39,35,.025) 0 1px, rgba(88,39,35,0) 1px 8px),
    radial-gradient(70% 58% at 50% 26%, rgba(255,255,255,.4) 0%, rgba(255,255,255,0) 62%),
    radial-gradient(130% 108% at 50% 100%, rgba(88,39,35,0) 58%, rgba(88,39,35,.07) 100%);
}

/* a tábla kettős keyline-ja, mint egy festett cégéren */
.ct-keret{
  position:absolute;inset:clamp(13px,2vw,28px);z-index:1;pointer-events:none;
  border:2.5px solid var(--tinta);
  border-radius:clamp(16px,2.4vw,32px);
}
.ct-keret::after{
  content:"";position:absolute;inset:7px;
  border:1.2px solid rgba(88,39,35,.5);
  border-radius:inherit;
}
.ct-sarok{position:absolute;width:clamp(20px,2.4vw,32px);height:auto;color:var(--tinta);opacity:.62}
.ct-sarok--bf{left:9px;top:9px}
.ct-sarok--jf{right:9px;top:9px;transform:rotate(90deg)}
.ct-sarok--ja{right:9px;bottom:9px;transform:rotate(180deg)}
.ct-sarok--ba{left:9px;bottom:9px;transform:rotate(270deg)}

/* ------------------------------------------------------------- szerkezet */
.ct-belso{
  position:relative;z-index:3;
  width:100%;max-width:1340px;margin-inline:auto;
  padding-inline:clamp(26px,4.4vw,58px);
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(0,1.9fr) minmax(0,.82fr);
  grid-template-areas:"bal kozep jobb";
  align-items:center;
  column-gap:clamp(18px,3vw,40px);
}

/* -------------------------------------------------------------- középrész */
.ct-kozep{grid-area:kozep;text-align:center;justify-self:center;max-width:660px}

.ct-jel{width:clamp(148px,15vw,196px);height:auto;margin:0 auto clamp(14px,1.8vw,22px);display:block}
.ct-jel path{fill:none;stroke:var(--tinta);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.ct-jel .ct-sugar{stroke-width:1.8;opacity:.68}
.ct-jel .ct-vekony{stroke-width:1.2;opacity:.72}
.ct-jel .ct-tolt{fill:var(--tinta);stroke:none}

.ct-hely{
  font-size:11.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--tinta);margin:0 0 clamp(14px,1.8vw,20px);
}
.ct-hely span{display:inline-block}

.ct-cim{
  font-family:"Yeseva","Yeseva","Eczar",Georgia,serif;font-weight:400;
  font-size:clamp(37px,5vw,65px);
  line-height:1.02;letter-spacing:-.014em;
  color:var(--tinta);
  margin:0;
  text-wrap:balance;
}
.ct-vonas{display:block;width:clamp(168px,26vw,320px);height:auto;margin:clamp(10px,1.4vw,16px) auto clamp(18px,2.4vw,26px)}
.ct-vonas path{fill:none;stroke:var(--tinta);stroke-width:2.6;stroke-linecap:round;vector-effect:non-scaling-stroke}

.ct-alcim{
  margin:0 auto clamp(22px,3vw,30px);max-width:46ch;
  font-size:clamp(16px,1.15vw,18.5px);line-height:1.62;color:var(--tinta-halk);
}

.ct-tettek{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 22px;margin:0 0 clamp(24px,3.4vw,34px)}
.ct-gomb{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--tinta);color:var(--tejszin);
  text-decoration:none;font-weight:600;font-size:16px;letter-spacing:.01em;
  padding:15px 30px;border-radius:999px;
  box-shadow:0 10px 22px rgba(88,39,35,.22);
  transition:background .18s var(--ct-lassu),transform .18s var(--ct-lassu),box-shadow .18s var(--ct-lassu);
}
.ct-gomb:hover{background:var(--tinta-melyebb);transform:translateY(-2px);box-shadow:0 14px 26px rgba(88,39,35,.26)}
.ct-gomb-nyil{font-size:14px;line-height:1}
.ct-tel{
  font-family:"Yeseva","Yeseva","Eczar",Georgia,serif;font-weight:400;
  font-size:clamp(19px,1.5vw,23px);color:var(--tinta);text-decoration:none;
  padding-bottom:9px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='6' viewBox='0 0 24 6'%3E%3Cpath d='M0 4C4 1 8 1 12 4c4 3 8 3 12 0' fill='none' stroke='%23582723' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:repeat-x;background-position:left bottom;background-size:24px 6px;
  transition:opacity .18s var(--ct-lassu);
}
.ct-tel:hover{opacity:.72}

.ct-tenyek{
  list-style:none;margin:0;padding:0;
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:8px 16px;
  font-size:12.5px;font-weight:600;letter-spacing:.05em;color:var(--tinta);
}
.ct-tenyek li{display:flex;align-items:center;gap:16px}
.ct-tenyek li+li::before{
  content:"";width:7px;height:7px;background:var(--korall);
  border:1px solid var(--tinta);transform:rotate(45deg);flex:0 0 auto;
}

/* ------------------------------------------------------------ medalionok */
.ct-oszlop{position:relative}
.ct-oszlop--bal{grid-area:bal;justify-self:end}
.ct-oszlop--jobb{grid-area:jobb;justify-self:start}

.ct-medal{margin:0;position:relative}
.ct-medal--nagy{width:clamp(178px,18.6vw,266px)}
.ct-medal--kicsi{position:absolute;width:45%;z-index:2}
.ct-oszlop--bal .ct-medal--kicsi{right:-19%;bottom:17%}
.ct-oszlop--jobb .ct-medal--kicsi{left:-19%;bottom:17%}

.ct-kep{
  position:relative;display:block;
  border-radius:50%;background:var(--tejszin);padding:6px;
  box-shadow:0 16px 30px rgba(88,39,35,.18);
}
.ct-kep img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:50%;display:block}
.ct-gyuru{
  position:absolute;left:-9px;top:-9px;
  width:calc(100% + 18px);height:calc(100% + 18px);max-width:none;
  pointer-events:none;overflow:visible;
}
.ct-gyuru path{fill:none;stroke:var(--tinta);stroke-linecap:round;vector-effect:non-scaling-stroke}
.ct-gyuru .ct-kulso{stroke-width:2.2}
.ct-gyuru .ct-belso-gyuru{stroke-width:1.1;opacity:.6}

.ct-medal--nagy .ct-kep{transform:rotate(-2deg)}
.ct-oszlop--jobb .ct-medal--nagy .ct-kep{transform:rotate(2deg)}
.ct-oszlop--bal .ct-medal--kicsi .ct-kep{transform:rotate(5deg)}
.ct-oszlop--jobb .ct-medal--kicsi .ct-kep{transform:rotate(-6deg)}

.ct-medal figcaption{
  margin-top:15px;text-align:center;
  font-size:11.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
  color:var(--tinta);
}
.ct-medal--kicsi figcaption{display:none}

/* saját ár-pasztilla, ahogy a posztgrafikáikon */
.ct-ar{
  position:absolute;z-index:4;margin:0;
  right:-16%;top:-13%;
  background:var(--korall);color:var(--tinta-melyebb);
  border:1.6px solid var(--tinta);border-radius:999px;
  padding:9px 16px;transform:rotate(-7deg);
  font-size:12px;font-weight:600;letter-spacing:.05em;line-height:1.25;
  text-align:center;white-space:nowrap;
  box-shadow:0 8px 16px rgba(88,39,35,.2);
}
.ct-ar strong{display:block;font-size:15px;letter-spacing:.02em}

/* ----------------------------------------------------- szabadon álló rajzok */
.ct-dekor{position:absolute;z-index:2;color:var(--tinta);opacity:.82;pointer-events:none}
.ct-dekor path{fill:none;stroke:var(--tinta);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.ct-dekor .ct-tolt{fill:var(--tinta);stroke:none}
.ct-dekor--lapat{left:2.6%;bottom:19%;width:clamp(36px,3.6vw,56px);transform:rotate(-15deg)}
.ct-dekor--gyertyak{right:2.8%;top:19%;width:clamp(50px,5vw,76px)}
.ct-dekor--szoras-bal{left:6.5%;top:9%;width:clamp(60px,7vw,104px);transform:rotate(-10deg);opacity:.6}
.ct-dekor--szoras-jobb{right:6%;bottom:9%;width:clamp(60px,7vw,104px);transform:rotate(9deg);opacity:.6}

/* -------------------------------------------------------- csipke-szegély */
.ct-csipke{
  position:absolute;left:0;right:0;bottom:0;height:32px;z-index:5;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='32' viewBox='0 0 60 32'%3E%3Cpath d='M0 32L60 32L60 8A30 18 0 0 1 0 8Z' fill='%23FFF7E8'/%3E%3Cpath d='M0 8A30 18 0 0 0 60 8' fill='none' stroke='%23582723' stroke-width='2.2' stroke-linecap='round'/%3E%3Ccircle cx='0' cy='8' r='2.4' fill='%23582723'/%3E%3Ccircle cx='60' cy='8' r='2.4' fill='%23582723'/%3E%3C/svg%3E");
  background-repeat:repeat-x;
  background-position:left bottom;
  background-size:60px 32px;
}

/* ------------------------------------------------------------- reszponzív */
@media (max-width:1080px){
  .ct-dekor--szoras-bal,.ct-dekor--szoras-jobb{display:none}
}
@media (max-width:980px){
  .ct-belso{
    grid-template-columns:1fr 1fr;
    grid-template-areas:"kozep kozep" "bal jobb";
    row-gap:clamp(48px,8vw,68px);
    column-gap:clamp(20px,5vw,44px);
  }
  .ct-oszlop--bal,.ct-oszlop--jobb{justify-self:center}
  .ct-medal--nagy{width:min(38vw,244px)}
  .ct-dekor--lapat{left:2%;bottom:auto;top:6%}
  .ct-dekor--gyertyak{right:2%;top:5%}
  .ct-ar{right:-14%;top:-15%}
}
@media (max-width:640px){
  .cegertabla{padding-bottom:clamp(92px,16vw,116px)}
  .ct-dekor--lapat,.ct-dekor--gyertyak{display:none}
  .ct-medal--nagy{width:min(41vw,182px)}
  .ct-medal--kicsi{width:43%}
  /* keskeny kijelzőn a kis medalion a nagyra ül rá, hogy se a kerethez, se egymáshoz ne érjen */
  .ct-oszlop--bal .ct-medal--kicsi{right:0;bottom:20%}
  .ct-oszlop--jobb .ct-medal--kicsi{left:0;bottom:20%}
  .ct-medal figcaption{font-size:10px;letter-spacing:.1em;margin-top:12px}
  .ct-ar{right:0;left:auto;top:-20%;padding:7px 13px;font-size:11px}
  .ct-ar strong{font-size:13.5px}
  .ct-tenyek{gap:6px 12px;font-size:12px}
  .ct-tenyek li{gap:12px}
  .ct-keret{inset:10px;border-width:2px}
  .ct-sarok{width:18px}
}
@media (max-width:430px){
  .ct-tettek{gap:12px}
  .ct-gomb{padding:14px 24px;font-size:15px}
  .ct-belso{padding-inline:22px}
}

/* --------------------------------------------------------------- mozgás */
@media (prefers-reduced-motion:no-preference){
  .ct-jel path,.ct-vonas path,.ct-gyuru path,.ct-dekor path{
    stroke-dasharray:100;stroke-dashoffset:100;
    animation:ct-huz 1.15s var(--ct-lassu) forwards;
  }
  .ct-jel .ct-tolt,.ct-dekor .ct-tolt{
    stroke-dasharray:none;stroke-dashoffset:0;opacity:0;
    animation:ct-elo .5s var(--ct-lassu) .85s forwards;
  }
  .ct-jel .ct-sugar{animation-delay:.05s}
  .ct-jel .ct-vekony{animation-delay:.5s}
  .ct-vonas path{animation-delay:.62s}
  .ct-dekor path{animation-duration:1.4s;animation-delay:.9s}
  .ct-gyuru path{animation-duration:1.3s}
  .ct-oszlop--bal .ct-gyuru path{animation-delay:.34s}
  .ct-oszlop--jobb .ct-gyuru path{animation-delay:.46s}

  .ct-hely,.ct-cim,.ct-alcim,.ct-tettek,.ct-tenyek,.ct-medal,.ct-ar{
    opacity:0;animation:ct-fel .8s var(--ct-lassu) forwards;
    animation-delay:calc(var(--k, 0) * 90ms);
  }
  .ct-lang{transform-origin:center bottom;animation:ct-lobog 2.6s ease-in-out 1.4s infinite}
  .ct-gomb:hover{transform:translateY(-2px)}
}

@keyframes ct-huz{to{stroke-dashoffset:0}}
@keyframes ct-elo{to{opacity:1}}
@keyframes ct-fel{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes ct-lobog{0%,100%{transform:scaleY(1) scaleX(1)}45%{transform:scaleY(1.1) scaleX(.94)}}

@media print{
  .cegertabla{background:#fff;color:#000;padding:20px 0}
  .ct-keret,.ct-csipke,.ct-dekor{display:none}
}

/* --- graft a habcsik-variansbol: a cim alatti vonal habzsak-krem --- */
.ct-vonas{width:clamp(186px,29vw,340px);height:auto}
.ct-vonas use{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.ct-krem-arny{stroke:rgba(58,21,18,.30);stroke-width:9.5;transform:translateY(2.6px)}
.ct-krem-test{stroke-width:8.4}
.ct-krem-feny{stroke:rgba(255,255,255,.62);stroke-width:2.4;transform:translateY(-2.1px)}

/* A kremcsik ugyanugy rajzolodik ki, mint a tobbi vonal, csak use-okon:
   a pathLength itt nem mukodik, ezert a valodi ivhosszal dolgozunk (kb. 372). */
@media (prefers-reduced-motion:no-preference){
  .ct-vonas use{
    stroke-dasharray:372;stroke-dashoffset:372;
    animation:ct-huz-krem 1.05s var(--ct-lassu) .62s forwards;
  }
  .ct-krem-test{animation-delay:.66s}
  .ct-krem-feny{animation-delay:.72s}
  @keyframes ct-huz-krem{to{stroke-dashoffset:0}}
}

/* --- graft a csendelet-variansbol: a medalionok nem kivagatok, hanem
   megvilagitott targyak. Meleg kulcsfeny balrol felulrol, halk vignetta. --- */
.ct-kep::after{
  content:"";position:absolute;inset:6px;border-radius:50%;pointer-events:none;
  background:
    radial-gradient(58% 52% at 32% 22%, rgba(255,247,232,.34), rgba(255,247,232,0) 62%),
    radial-gradient(78% 78% at 50% 50%, rgba(58,21,18,0) 52%, rgba(58,21,18,.28) 100%);
  mix-blend-mode:multiply;
}
.ct-kep::before{
  content:"";position:absolute;inset:6px;border-radius:50%;pointer-events:none;z-index:1;
  background:radial-gradient(46% 40% at 30% 20%, rgba(255,252,240,.30), rgba(255,252,240,0) 68%);
}