/* ============================================================
   oldal.css — az újrakészített oldalak kiegészítő stílusai
   (a témákat és az alapokat a style.css adja)
   ============================================================ */

.kihagy { position:absolute; left:-999px; }
.kihagyas:focus, .kihagy:focus { left: 1rem; top: 1rem; z-index: 99; background: var(--arany); color: var(--fa-sotet); padding: .5rem 1rem; }

/* --- Egyszerű reszponzív rács (Bootstrap helyett) --- */
.racs { display: grid; gap: 1rem; }
.racs-ketto  { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.racs-harom  { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.racs-negy   { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 991px) { .racs-negy { grid-template-columns: repeat(2, minmax(0, 1fr)); } .racs-harom { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .racs-ketto { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .racs-harom { grid-template-columns: 1fr; } }

.bolt-cim { display:block; }
.bolt-alcim { display:block; }
.mb-0 { margin-bottom: 0; }

/* --- Hero: két fő termékvonal --- */
.hero-ketto { display:grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1rem; }
@media (max-width: 700px) { .hero-ketto { grid-template-columns: 1fr; } }
.hero-kartya {
  display:flex; flex-direction:column; gap:.4rem; padding: 1.6rem 1.5rem;
  border:2px solid var(--bor); border-radius: var(--radius-nagy); color: var(--pergamen);
  background: linear-gradient(160deg, rgba(201,162,94,.10), transparent 60%), var(--fa-vilagos);
  box-shadow: var(--arnyek); transition: transform .18s, border-color .18s, box-shadow .18s;
}
.hero-kartya:hover { transform: translateY(-3px); border-color: var(--arany); box-shadow: var(--arnyek-mely); color: var(--pergamen); }
.hero-ikon { font-size: 2.4rem; line-height: 1; }
.hero-kartya h2 { font-family: var(--betu-cim); color: var(--arany-vilagos); font-size: 1.7rem; margin: .2rem 0 0; }
.hero-kartya p { margin: 0; color: var(--pergamen-halvany); font-size: 1.05rem; }
.hero-gomb { margin-top:auto; padding-top:.6rem; font-family: var(--betu-ui); color: var(--arany-vilagos); letter-spacing:.5px; font-size:1.1rem; }

/* --- Kártyák (főoldali lista) --- */
.kartya-kep { position:relative; display:block; }
.kartya-kep img, .talalat-borito, .kiemelt-borito { background: var(--fa-sotet); }
.kiemelt-kartya { text-decoration:none; color: inherit; }
.kiemelt-kartya:hover { color: inherit; }
.kiemelt-kartya .jelvenyek { position:absolute; left:.5rem; top:.5rem; }
.kiemelt-ar { font-family: var(--betu-cim); color: var(--pergamen); margin: 0; font-size: 1.05rem; }
.talalat-kartya { position:relative; text-decoration:none; color: inherit; }
.talalat-kartya:hover { color: inherit; }
.talalat-kartya.eladva { opacity: .62; }
.talalat-kartya.eladva .talalat-borito { filter: grayscale(.7); }
.talalat-ar { font-family: var(--betu-cim); font-size: 1.15rem; color: var(--pergamen); }
.talalat-meta { font-size: .95rem; color: var(--pergamen-tompa); margin: 0; }
.talalat-also { display:flex; align-items:center; justify-content:space-between; gap:.6rem; flex-wrap:wrap; }
.talalat-nincs-kep { width:92px; aspect-ratio:2/3; flex:none; display:flex; align-items:center; justify-content:center; text-align:center; font-size:.8rem; color: var(--pergamen-tompa); border:1px dashed var(--bor-vilagos); border-radius: var(--radius); }

/* --- Jelvények --- */
.jelvenyek { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.6rem; }
.jelveny { display:inline-block; font-family: var(--betu-ui); font-size:.88rem; letter-spacing:.6px; text-transform:uppercase; padding:.12rem .55rem; border-radius: 999px; border:1px solid var(--bor-vilagos); background: var(--fa-vilagosabb); color: var(--pergamen-halvany); }
.jelveny-ok { border-color: var(--zold-patina); color: var(--pergamen); }
.jelveny-foglalt { border-color: #c98a2b; color: #e8b25a; }
.jelveny-eladva { border-color: var(--voros); color: #d98a7c; }
.jelveny-kotes, .jelveny-egyedi { border-color: var(--arany-melyebb); color: var(--arany-vilagos); }
.jelveny-uj { background: var(--arany); color: var(--fa-sotet); border-color: var(--arany); font-weight:700; }
[data-tema="pergamen"] .jelveny-foglalt, [data-tema="bordo"] .jelveny-foglalt { color:#8a5a10; }
[data-tema="pergamen"] .jelveny-eladva, [data-tema="bordo"] .jelveny-eladva { color:#8b3a2f; }

/* --- Kereső kiegészítések --- */
.kereso-opciok { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:.8rem; margin-top:1.1rem; padding-top:.9rem; border-top:1px dashed var(--bor); font-family: var(--betu-ui); font-size:1.05rem; color: var(--pergamen-halvany); }
.kapcsolo { display:inline-flex; align-items:center; gap:.5rem; cursor:pointer; }
.kapcsolo input { width:1.1rem; height:1.1rem; accent-color: var(--arany); }
.rendezes select { font: inherit; color: var(--pergamen); background: var(--fa-sotet); border:1px solid var(--bor-vilagos); border-radius: var(--radius); padding:.25rem .5rem; }
.kereso-badge small { opacity:.65; margin-left:.25rem; font-size:.8em; }
.aktiv-szuro { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin: .2rem 0 1rem; font-family: var(--betu-ui); }
.szuro-cimke { display:inline-flex; gap:.4rem; align-items:center; background: var(--arany); color: var(--fa-sotet); border-radius: 999px; padding:.15rem .4rem .15rem .8rem; }
.szuro-cimke button { background: rgba(0,0,0,.2); color: inherit; border:0; border-radius:50%; width:1.4rem; height:1.4rem; cursor:pointer; line-height:1; }

/* --- Lépések --- */
.lepes-sor { list-style:none; margin: 0; padding:0; display:grid; grid-template-columns: repeat(4, 1fr); gap:1rem; }
@media (max-width: 900px) { .lepes-sor { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .lepes-sor { grid-template-columns: 1fr; } }
.lepes-sor li { background: var(--fa-vilagos); border:1px solid var(--bor); border-radius: var(--radius-nagy); padding:1rem; display:flex; flex-direction:column; gap:.3rem; box-shadow: var(--arnyek); }
.lepes-szam { width:2rem; height:2rem; border-radius:50%; background: var(--arany); color: var(--fa-sotet); display:flex; align-items:center; justify-content:center; font-weight:700; font-family: var(--betu-cim); }
.lepes-sor strong { color: var(--arany-vilagos); font-family: var(--betu-cim); }
.lepes-sor span:last-child { font-size:1rem; color: var(--pergamen-halvany); }

/* --- Morzsamenü --- */
.morzsa ol { list-style:none; display:flex; flex-wrap:wrap; gap:.4rem; padding:0; margin: 0 0 1.2rem; font-family: var(--betu-ui); font-size:1.05rem; }
.morzsa li + li::before { content:"›"; margin-right:.4rem; color: var(--pergamen-tompa); }
.morzsa a { color: var(--pergamen-halvany); }
.morzsa span[aria-current] { color: var(--pergamen-tompa); }

/* --- Könyv/doboz adatlap --- */
.galeria-nincs { aspect-ratio:2/3; display:flex; align-items:center; justify-content:center; color: var(--pergamen-tompa); font-family: var(--betu-ui); font-size:1.2rem; }
.galeria-fokep { cursor: zoom-in; }
.galeria-nagyit { position:absolute; right:.6rem; bottom:.6rem; width:40px; height:40px; border-radius:50%; background: rgba(28,20,16,.78); border:1px solid var(--arany-melyebb); color: var(--arany-vilagos); cursor:pointer; font-size:1.15rem; }
.galeria-belyeg { padding:0; background:none; border:2px solid transparent; border-radius: var(--radius); cursor:pointer; opacity:.6; }
.galeria-belyeg img { width:58px; aspect-ratio:2/3; object-fit:cover; border-radius:2px; }
.galeria-belyeg.aktiv { opacity:1; border-color: var(--arany); }
.galeria-belyeg:hover { opacity:.95; }
.adat-racs-3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 520px) { .adat-racs-3 { grid-template-columns: 1fr 1fr; } }
.adat-ertek a { color: inherit; }
.fo-fejlec-iro a { color: inherit; border-bottom: 1px dotted var(--pergamen-tompa); }
.doboz-leiras p:first-child { margin-top: 0; } .doboz-leiras p:last-child { margin-bottom: 0; }
.ajanlo-tartalom p, .szoveg-blokk-szoveg p { margin: 0 0 .9rem; }
.ajanlo-tartalom p:last-child, .szoveg-blokk-szoveg p:last-child { margin-bottom: 0; }
.formazott { white-space: normal; }
.ajanlo-tartalom { font-size: 1.22rem; }
.szoveg-blokk-szoveg { font-size: 1.22rem; }
.mind-nyit { text-align:center; margin: 0 0 1.5rem; }
.kis { font-size: 1rem; padding: .3rem .9rem; }
.megosztas { display:flex; gap:.6rem; flex-wrap:wrap; }
.hashtag-cimke { text-decoration:none; }
.hashtag-cimke:hover { background: var(--bor); color: var(--arany-vilagos); }
.hasonlo-kapható[hidden] { display:none; }

/* --- Rendelés / visszahívás űrlap --- */
.rendeles-doboz { background: linear-gradient(180deg, rgba(201,162,94,.10), transparent), var(--fa-vilagosabb); border:2px solid var(--arany-melyebb); border-radius: var(--radius-nagy); padding:1.2rem 1.3rem 1.3rem; box-shadow: var(--arnyek); }
.rendeles-cim { font-family: var(--betu-cim); color: var(--arany-vilagos); font-size:1.5rem; margin:0 0 .3rem; }
.rendeles-szoveg { margin:0 0 .9rem; font-size:1.08rem; color: var(--pergamen-halvany); }
.rendeles-lezart { border-style:dashed; border-color: var(--bor-vilagos); }
.urlap-racs { display:grid; grid-template-columns: 1fr 1fr; gap:.8rem; }
@media (max-width: 520px) { .urlap-racs { grid-template-columns: 1fr; } }
.urlap-racs-3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 620px) { .urlap-racs-3 { grid-template-columns: 1fr; } }
.urlap-mezo select { font: inherit; color: var(--pergamen); background: var(--fa-sotet); border:1px solid var(--bor-vilagos); border-radius: var(--radius); padding:.6rem .6rem; width:100%; }
.urlap-mezo { display:flex; flex-direction:column; gap:.2rem; margin-bottom:.8rem; font-family: var(--betu-ui); font-size:1.02rem; letter-spacing:.4px; color: var(--pergamen-halvany); }
.urlap-mezo input, .urlap-mezo textarea { font-family: var(--betu-szoveg); font-size:1.1rem; color: var(--pergamen); background: var(--fa-sotet); border:1px solid var(--bor-vilagos); border-radius: var(--radius); padding:.6rem .8rem; width:100%; }
.urlap-mezo input:focus, .urlap-mezo textarea:focus { outline:none; border-color: var(--arany); box-shadow:0 0 0 2px rgba(201,162,94,.25); }
.urlap-mezo input.hibas { border-color: #d0604d; }
.urlap-pipa { display:flex; gap:.6rem; align-items:flex-start; font-size:.98rem; color: var(--pergamen-halvany); margin-bottom: .9rem; cursor:pointer; }
.urlap-pipa input { margin-top:.25rem; width:1.15rem; height:1.15rem; accent-color: var(--arany); flex:none; }
.urlap-pipa a { text-decoration: underline; }
.meztelen { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.gomb-nagy { font-size:1.25rem; padding:.7rem 1.6rem; width:100%; }
.gomb[disabled] { opacity:.6; cursor:wait; }
.urlap-uzenet { margin:.7rem 0 0; font-family: var(--betu-ui); font-size:1.1rem; min-height:1.2em; }
.urlap-uzenet.ok { color: #7fc38a; font-weight:600; }
.urlap-uzenet.hiba { color: #e58a7a; }
[data-tema="pergamen"] .urlap-uzenet.ok, [data-tema="bordo"] .urlap-uzenet.ok { color:#2e7d3f; }
[data-tema="pergamen"] .urlap-uzenet.hiba, [data-tema="bordo"] .urlap-uzenet.hiba { color:#a83a28; }
.rendeles-telefon { margin:.9rem 0 0; font-size:1.02rem; text-align:center; color: var(--pergamen-tompa); }
.rendeles-telefon a { font-weight:600; }

/* --- Dobozok --- */
.bevezeto-szoveg { text-align:center; max-width: 46rem; margin: -.6rem auto 1.4rem; color: var(--pergamen-halvany); font-size:1.15rem; }
.egyedi-kero-doboz { max-width: 40rem; margin: 0 auto; }
.egyedi-kero-doboz > p { text-align:center; color: var(--pergamen-halvany); }

/* --- Szöveges oldalak --- */
.szoveg-oldal { max-width: 52rem; }
.szoveg-doboz { background: var(--fa-vilagos); border:1px solid var(--bor); border-radius: var(--radius-nagy); box-shadow: var(--arnyek); padding: 1.5rem 1.7rem; font-size:1.12rem; }
.szoveg-doboz h2 { font-family: var(--betu-cim); color: var(--arany-vilagos); font-size:1.5rem; margin: 1.6rem 0 .5rem; }
.szoveg-doboz h3 { font-family: var(--betu-ui); color: var(--arany); font-size:1.25rem; margin:1.1rem 0 .2rem; }
.szoveg-doboz > :first-child { margin-top:0; }
.lepes-lista li { margin-bottom:.6rem; }
.kicsi { font-size:.92rem; color: var(--pergamen-tompa); }
.koszonet { text-align:center; }
.koszonet h1 { font-family: var(--betu-cim); color: var(--arany-vilagos); }

/* --- Katalógus --- */
.tabla-keret { overflow-x:auto; background: var(--fa-vilagos); border:1px solid var(--bor); border-radius: var(--radius-nagy); }
.katalogus { width:100%; border-collapse: collapse; font-size:1.02rem; }
.katalogus th, .katalogus td { padding:.55rem .8rem; border-bottom:1px solid var(--bor); text-align:left; vertical-align:top; }
.katalogus th { font-family: var(--betu-ui); letter-spacing:1px; text-transform:uppercase; color: var(--arany); font-size:.92rem; }
.katalogus td.ar { white-space:nowrap; text-align:right; font-variant-numeric: tabular-nums; }
.katalogus a { font-weight:600; }

/* --- Lábléc --- */
.lablec-fo { font-family: var(--betu-cim); font-size:1.2rem; color: var(--arany-vilagos); margin:0 0 .3rem; }
.lablec p { margin:.25rem 0; }
.lablec-linkek a { text-decoration: underline; }

/* --- Nagyító (lightbox) --- */
.nagyito { position:fixed; inset:0; background: rgba(8,6,4,.94); z-index: 200; display:flex; align-items:center; justify-content:center; padding: 1rem; }
.nagyito img { max-width: 100%; max-height: 100%; object-fit: contain; box-shadow: 0 10px 50px rgba(0,0,0,.8); }
.nagyito button { position:absolute; background: rgba(40,30,20,.85); color:#f3e7cf; border:1px solid #c9a25e; border-radius:50%; width:48px; height:48px; font-size:1.6rem; cursor:pointer; }
.nagyito .zar { top:1rem; right:1rem; } .nagyito .bal { left:1rem; top:50%; } .nagyito .jobb { right:1rem; top:50%; }

/* --- Nyomtatás --- */
@media print {
  body { background: #fff !important; color: #000 !important; }
  .fejlec, .lablec, .szinvalaszto, .nyomtat, .fo-nav, .morzsa { display:none !important; }
  .tabla-keret { border:0; } .katalogus { font-size: 10pt; } .katalogus th, .katalogus td { border-bottom:1px solid #999; color:#000; }
  a { color:#000 !important; text-decoration:none; }
}

/* --- Gomb-alaphelyzet (a Bootstrap nélkül a böngésző saját gombstílusa jönne elő) --- */
.ajanlo-ful { background: transparent; border: 0; border-bottom: 3px solid transparent; }
.ajanlo-ful.aktiv { border-bottom-color: var(--arany); }
.galeria-nyil, .galeria-nagyit { padding: 0; }
.kereso-badge, .lapozo-gomb, .gomb { font-family: var(--betu-ui); }
.lapozo-gomb { font-family: "Source Sans 3", system-ui, sans-serif; }
.text-muted { color: var(--pergamen-tompa); }
.small { font-size: .9rem; }
details > summary { list-style: none; }
img { max-width: 100%; }
@media (max-width: 575px) {
  .hero-kartya { padding: 1.2rem 1.1rem; }
  .rendeles-doboz { padding: 1rem; }
  .szoveg-doboz { padding: 1.1rem 1.1rem; }
  .ajanlo-tartalom, .szoveg-blokk-szoveg { font-size: 1.12rem; }
}

/* --- Mobil: kompakt fejléc, hogy a tartalom hamarabb látszódjon --- */
@media (max-width: 575px) {
  .fejlec { padding: 2.4rem .8rem .9rem; }
  .fejlec-logo svg { width: 34px; height: 34px; }
  .bolt-alcim { display: none; }
  .fo-nav { margin-top: .6rem; gap: .2rem .8rem; }
  .fo-nav a { font-size: 1rem; padding: .15rem .3rem; }
  .tartalom { padding-top: 1.2rem; }
  .hero-ketto { gap: .7rem; }
  .hero-kartya { gap: .25rem; }
  .hero-ikon { font-size: 1.8rem; }
  .hero-kartya h2 { font-size: 1.35rem; }
  .hero-kartya p { font-size: .98rem; }
  .plakat { min-height: 150px; padding: 1.1rem; }
  .szekcio-cim { margin: 1.6rem 0 1rem; }
}