/* ==========================================================================
   Liszt Ferenc Zongoraterem – egyedi stílusok (a template fölé)
   ========================================================================== */

/* --- Sötét fejléc, hogy az arany logó kiemelkedjen --- */
.tp-header-area.tp-header-style-4 {
   background-color: #0a0a0a;
}
.tp-header-area.tp-header-style-4.tp-header-sticky-cloned.header-sticky {
   background-color: #0a0a0a;
   box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35);
}

/* --- Logó: reszponzív magasság (mobil → desktop) --- */
.tp-header-logo img {
   height: clamp(34px, 5.2vw, 56px);
   width: auto;
}

/* --- Menü szöveg világos/arany a sötét sávon --- */
.tp-header-style-4 .tp-main-menu-content > ul > li > a {
   color: #f3e3c0;
}
.tp-header-style-4 .tp-main-menu-content > ul > li > a:hover,
.tp-header-style-4 .tp-main-menu-content > ul > li.active > a {
   color: #e9c66b;
}

/* --- Mobil hamburger ikon világos --- */
.tp-header-style-4 .tp-header-bar .tp-menu-bar {
   color: #f3e3c0;
}

/* --- Mobilon a logó-oszlop kapjon elég helyet, a hamburger jobbra --- */
@media (max-width: 991px) {
   .tp-header-area.tp-header-style-4 {
      padding-top: 10px;
      padding-bottom: 10px;
   }
}

/* --- Elegáns talpas címsor-betű (zongoraterem hangulat) --- */
.tp-slider-title,
.tp-section-title,
h1, h2, h3, h4, h5, h6 {
   font-family: "Playfair Display", Georgia, "Times New Roman", serif;
}

/* --- Rólunk képek: WebGL-effekt helyett sima, megbízható megjelenítés --- */
.tp-about-4-thumb-1 .tp-hover-distort-wrapper .canvas,
.tp-about-4-thumb-2 .tp-hover-distort-wrapper .canvas,
.tp-about-4-thumb-1 .tp-hover-distort-img.back,
.tp-about-4-thumb-2 .tp-hover-distort-img.back {
   display: none;
}
.tp-about-4-thumb-1,
.tp-about-4-thumb-2 {
   width: 46%;
}
.tp-about-4-thumb-1 .tp-hover-distort-img.front,
.tp-about-4-thumb-2 .tp-hover-distort-img.front {
   opacity: 1;
   position: relative;
   display: block;
   width: 100%;
   height: auto;
   aspect-ratio: 290 / 422;
   object-fit: cover;
   border-radius: 8px;
}

/* --- Térköz a galéria és a footer között --- */
.tp-service-2-area.tp-service-style-4 {
   padding-bottom: 100px;
}

/* --- Munkáink: kétoszlopos, szabad (masonry) galéria --- */
.zs-masonry {
   display: flex;
   gap: 20px;
   align-items: flex-start;
   max-width: 1140px;
   margin: 0 auto;
}
.zs-mcol {
   flex: 1;
   display: flex;
   flex-direction: column;
   gap: 20px;
}
.zs-mitem {
   overflow: hidden;
   border-radius: 10px;
}
.zs-mitem img {
   width: 100%;
   height: auto;
   display: block;
   transition: transform 0.6s ease;
}
.zs-mitem:hover img {
   transform: scale(1.05);
}
/* A 3. (munka) oszlop álló képeit alacsonyabb arányra vágjuk, hogy az oszlopok egy magasak legyenek */
.zs-masonry .zs-mcol:nth-child(3) .zs-mitem img {
   aspect-ratio: 4 / 3;
   height: auto;
   object-fit: cover;
   object-position: center;
}
@media (max-width: 575px) {
   .zs-masonry {
      flex-direction: column;
   }
}

/* --- Finom, aláhúzott szövegközi link --- */
.subtle-link {
   color: inherit;
   text-decoration: underline;
   text-decoration-thickness: 1px;
   text-underline-offset: 3px;
   text-decoration-color: #6f6647;
   transition: color 0.2s ease, text-decoration-color 0.2s ease;
}
.subtle-link:hover {
   color: #6f6647;
   text-decoration-color: #6f6647;
}

/* --- Hero alcím: H2 a SEO-súlyért, de a bekezdés kinézetével --- */
.tp-hero-lead {
   font: inherit;
   margin-top: 0;
}

/* --- Menü jobbra igazítása a fejlécben --- */
.tp-header-style-4 .tp-header-menu {
   text-align: right;
}
.tp-header-style-4 .tp-main-menu-content > ul {
   justify-content: flex-end;
}

/* --- Hero képváltó: egységes négyzetes arány, álló kép szép kitöltése --- */
.tp-slider-2-thumb {
   aspect-ratio: 520 / 512;
   overflow: hidden;
   border-radius: 10px;
}
.tp-slider-2-thumb img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center 28%;
}

/* --- Offcanvas tömörítése + ikon utáni rés a nyitvatartásnál --- */
.tpoffcanvas__logo { margin-bottom: 28px !important; }
/* Kisebb offcanvas logó + arany szekciócímek (Kapcsolat / Nyitvatartás) */
.tpoffcanvas__logo img { max-height: 68px !important; width: auto !important; height: auto !important; }
.tpoffcanvas__contact-title h5 { color: #D8D2AC !important; text-transform: none !important; letter-spacing: 0.3px !important; font-weight: 500 !important; }
.tpoffcanvas__contact-info { margin-bottom: 22px !important; }
.tpoffcanvas__contact-info ul li { margin-bottom: 10px !important; }
.tpoffcanvas__contact-info ul li span { margin-left: 10px; }

/* --- Facebook ikon: halvány szürke karika, fekete „f" --- */
.tpoffcanvas__social .social-icon a {
   background-color: #ececec !important;
   color: #000 !important;
}
.tpoffcanvas__social .social-icon a:hover {
   background-color: #ffffff !important;
   color: #000 !important;
}

/* --- Kapcsolat csak a mobil offcanvas menüben (a desktop sávból elrejtve) --- */
.tp-header-area .tp-main-menu-content > ul > li.menu-contact { display: inline-block; }
.tp-main-menu-mobile .menu-contact { display: block; }

/* Aside / megjegyzés stílus (egyelőre dőlt) */
.zs-megjegyzes { font-style: italic; }

/* Est. 1993 pecsét a footerben */
.footer-est-badge { width: 88px; height: 88px; display: inline-block; margin-bottom: 16px; }

/* Est. 1993 pecsét a FŐOLDAL fejlécében — pontosan a breadcrumb pecsét mérete */
.tp-header-style-4 .est-header-badge { width: 112px !important; height: 112px !important; }
@media (max-width: 767px) { .tp-header-style-4 .est-header-badge { width: 78px !important; height: 78px !important; } }
/* 2px térköz, hogy a kör ne érjen hozzá a sáv tetejéhez/aljához */
.tp-header-style-4 .tp-header-logo { padding-top: 4px !important; padding-bottom: 4px !important; }

/* A H1 címben a „Zongoraszalon" szó kicsivel lazább betűközzel */
.cim-zongoraszalon { letter-spacing: 2px; }

/* Cím- és alcím-osztályok minden oldalon — Playfair Display, legvékonyabb (400) vágat */
.tp-slider-title,
.tp-section-title,
.tp-project-title,
.tp-project-4-title { font-family: "Playfair Display", Georgia, serif !important; font-weight: 400 !important; }

/* Fő CTA gombok egy fokkal nagyobb felirattal + ne nagybetűsítse a szavakat (pl. „Írjon nekünk") */
.tp-btn-black { font-size: 14px !important; text-transform: none !important; }


/* --- Footer alsó sáv: jobb oldali jogi linkek (ÁSZF / Adatkezelés / Facebook) --- */
/* Méret/szín pontosan mint a copyright szöveg (nem fehér, kisebb) */
.zs-footer-legal { display:inline-flex; gap:34px; list-style:none; margin:0; padding:0; }
.zs-footer-legal a { text-transform:uppercase; letter-spacing:1.2px; font-size:12px !important; font-weight:500; color:rgba(255,255,255,0.6) !important; transition:color .2s ease; }
.zs-footer-legal a:hover { color:#D8D2AC !important; }
@media (max-width:767px) { .zs-footer-legal { gap:22px; margin-top:14px; } }

/* === Teljes szélességű (mega) legördülő a „Szolgáltatások" alatt === */
/* Aloldali fejléc legyen pozícionált ős (a homepage fejléc már absolute) */
.tp-header-2-area { position: relative; }
/* A parent li statikus, hogy a panel a fejléc teljes szélességéhez igazodjon */
.tp-header-menu > nav > ul > li.has-dropdown-2,
.tp-header-2-menu > nav > ul > li.has-dropdown-2 { position: static; }
/* A fehér panel teljes szélességű, a fejléc aljához simul (nincs transform-rés),
   az elemek FÜGGŐLEGES listában, a parent menüpont alá igazítva (a bal paddinget JS állítja).
   A desktop legördülő csak ≥1200px-en látszik. */
.tp-header-menu > nav > ul > li.has-dropdown-2 > .submenu,
.tp-header-2-menu > nav > ul > li.has-dropdown-2 > .submenu {
   left: 0; right: 0; width: 100%;
   display: block;
   padding-top: 16px; padding-bottom: 18px;
   padding-left: 30px; padding-right: 30px;   /* a JS a parent bal széléhez igazítja */
   transform: none !important;                 /* ne csússzon le → ne látszódjon a háttér */
}
.tp-header-menu > nav > ul > li.has-dropdown-2 > .submenu > li,
.tp-header-2-menu > nav > ul > li.has-dropdown-2 > .submenu > li { display: block; }
.tp-header-menu > nav > ul > li.has-dropdown-2 > .submenu > li:not(:last-child),
.tp-header-2-menu > nav > ul > li.has-dropdown-2 > .submenu > li:not(:last-child) { margin-bottom: 4px; }

/* --- Menü legördülő: ne nagybetűsítse a második szót (HTML-ben helyes a kis-/nagybetű) --- */
.tp-submenu li a,
.tp-main-menu-mobile .tp-submenu li a { text-transform: none !important; }

/* --- Footer oszlopcímek kisebbre --- */
.tp-footer-area .tp-footer-title { font-size:18px !important; margin-bottom:24px !important; }

/* --- Copyright szöveg: ugyanakkora, mint a jogi linkek (12px) --- */
.tp-copyright-style-2 .tp-copyright-left p { font-size:12px !important; }

/* === Shop galéria cím (aktuális kategória) === */
.zs-shop-heading { margin-bottom: 34px; padding-bottom: 16px; border-bottom: 1px solid #ececec; }
.zs-shop-heading-title { font-family: "Playfair Display", Georgia, serif; font-weight: 400; font-size: 25px; color: #1a2640; margin: 0; letter-spacing: .3px; }

/* === Shop termékkártya (C. Bechstein stílus) === */
.zs-card { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid #e6e6e6; border-radius: 4px; padding: 16px 26px 40px; text-align: center; height: 100%; transition: box-shadow .25s ease; }
.zs-card:hover { box-shadow: 0 8px 28px rgba(0,0,0,.08); }
.zs-card::before { content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 120px; height: 2px; background: #bd9a52; }
.zs-card-logo img { max-height: 44px; width: auto; display: block; margin: 0 auto 18px; }
.zs-card-img { height: 300px; display: flex; align-items: center; justify-content: center; margin-bottom: 26px; }
.zs-card-img img { max-width: 100%; max-height: 100%; width: auto; height: auto; display: block; }
.zs-card-img img.zs-img-up { transform: translateY(-20px); }
.zs-card-title .zs-size { font-size: 16px; color: #555; }
.zs-card-title { font-family: "Playfair Display", Georgia, serif; font-style: normal; font-weight: 400; font-size: 22px; color: #1a2640; margin: auto -26px -40px; padding: 18px 20px; background: #f6f6f6; border-radius: 0 0 4px 4px; }

.tp-sv-details-sidebar > .tp-sv-sidebar-widget:first-child { margin-bottom: 34px !important; }

/* === Shop méret-csúszka (web + mobil, két natív range átlapolva) === */
.zs-range-widget { padding-left: 10px; }
.zs-range-title { font-size: 16px; margin-bottom: 16px; letter-spacing: .3px; color: #444; }
.zs-range-head { margin-bottom: 12px; }
.zs-range-val { font-size: 14px; color: #777; }
.zs-range-track-wrap { position: relative; height: 24px; touch-action: none; }
.zs-range-track { position: absolute; top: 11px; left: 0; right: 0; height: 3px; background: #e3e3e3; border-radius: 3px; }
.zs-range-fill { position: absolute; top: 11px; height: 3px; background: var(--tp-theme-1); border-radius: 3px; }
.zs-range input[type=range] { position: absolute; top: 0; left: 0; width: 100%; height: 24px; margin: 0; background: none; pointer-events: none; touch-action: none; -webkit-appearance: none; appearance: none; }
.zs-range input[type=range]::-webkit-slider-runnable-track { background: none; border: none; }
.zs-range input[type=range]::-moz-range-track { background: none; border: none; }
.zs-range input[type=range]::-webkit-slider-thumb { pointer-events: auto; touch-action: none; -webkit-appearance: none; appearance: none; width: 16px; height: 16px; margin-top: 4px; border-radius: 50%; background: #fff; border: 2px solid var(--tp-theme-1); box-shadow: 0 1px 4px rgba(0,0,0,.2); cursor: pointer; }
.zs-range input[type=range]::-moz-range-thumb { pointer-events: auto; touch-action: none; width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 2px solid var(--tp-theme-1); box-shadow: 0 1px 4px rgba(0,0,0,.2); cursor: pointer; }

/* === Shop oldalsáv (saját kategória-szűrő) === */
.zs-shop-sidebar { padding-left: 10px; }
.zs-shop-cats-title { font-size: 18px; margin-bottom: 20px; letter-spacing: .3px; }
.zs-shop-cats { list-style: none; margin: 0; padding: 0; }
.zs-shop-cats li { margin: 0; }
.zs-cat { width: 100%; text-align: left; background: none; border: 0; border-bottom: 1px solid #ececec; padding: 12px 2px; font-size: 16px; color: #2a2a2a; cursor: pointer; transition: color .2s ease; }
.zs-cat:hover { color: var(--tp-theme-1); }
.zs-cat.active { color: var(--tp-theme-1); font-weight: 600; }
.zs-prod-grid .tp-product-2-title a { font-size: 18px; }
@media (max-width: 991px) { .zs-shop-sidebar { padding-left: 0; margin-top: 30px; } }

/* === BECHSTEIN: a Hangszerek-kártyák képén lévő (forgó) ikon elrejtése === */
body.bechstein-page .tp-service-icon { display: none !important; }

/* === BECHSTEIN: vékony szürke keret a Hangszerek-kártyák képei köré === */
body.bechstein-page .tp-service-thumb { border: 1px solid #e3e3e3; border-radius: 6px; }

/* === BECHSTEIN: a Rólunk-modul két képe vágás nélkül (a képek aránya) + halvány szürke keret === */
body.bechstein-page .tp-about-4-thumb-1 .tp-hover-distort-img.front,
body.bechstein-page .tp-about-4-thumb-2 .tp-hover-distort-img.front {
   aspect-ratio: 600 / 635;
   border: 1px solid #e3e3e3;
   box-shadow: 0 2px 16px rgba(0,0,0,0.06);
}

/* --- Footer oszlopok egyenletes elosztása (a sablon aszimmetrikus paddingjeit kioltjuk) --- */
.tp-footer-area [class*="footer-cols-4-"] { padding-left:0 !important; }

/* --- Footer „Elérhetőség": a címke ne csússzon rá az értékre (a sablon abszolút, 80/70/50px-es spanját feloldjuk) --- */
.tp-footer-area .tp-footer-contact ul li,
.tp-footer-style-4 .tp-footer-widge-style-2 .tp-footer-contact ul li { padding-left:0 !important; }
.tp-footer-area .tp-footer-contact ul li span,
.tp-footer-style-4 .tp-footer-widge-style-2 .tp-footer-contact ul li span { position:static !important; display:inline-block; margin-right:6px; }

/* --- Footer „Nyitvatartás" alatti Térkép link --- */
.zs-footer-map { display:inline-flex; align-items:center; gap:8px; margin-top:16px; color:rgba(255,255,255,0.7); font-size:15px; letter-spacing:.4px; transition:color .2s ease; }
.zs-footer-map:hover { color:#D8D2AC; }
.zs-footer-map i { font-size:15px; }

/* === Hover-re EGY teljes szélességű panel, oszlopokban minden menü almenüi (Shop + Szolgáltatások) === */
/* A fejléc réteg a breadcrumb Est.1993 pecsét (z-index:3) FÖLÉ, hogy a panel elfedje
   (a pecsét a helyén marad, csak hoverkor takarja a panel) */
.tp-header-tranparent { z-index: 6; }
/* A per-menü hover panel elnémítva (helyette a közös oszlopos panel jelenik meg) */
.tp-header-menu > nav > ul > li.has-dropdown-2:hover > .submenu,
.tp-header-2-menu > nav > ul > li.has-dropdown-2:hover > .submenu { opacity: 0 !important; visibility: hidden !important; }

.zs-mega-all {
   position: absolute; top: 100%; left: 0; right: 0; width: 100%;
   background: #fff; border-top: 3px solid var(--tp-theme-1);
   box-shadow: rgba(149,157,165,0.2) 0px 8px 24px;
   opacity: 0; visibility: hidden; transition: opacity .25s ease;
   z-index: 1001; padding: 34px 0 40px;
}
.zs-mega-all.open { opacity: 1; visibility: visible; }
.zs-mega-row { display: flex; gap: 52px; flex-wrap: wrap; justify-content: flex-start; padding-right: 30px; }
.zs-mega-col { min-width: 190px; }
.zs-mega-col-title {
   font-family: "Playfair Display", Georgia, serif; font-size: 14px;
   letter-spacing: 1.5px; text-transform: uppercase; color: #A6A182;
   padding-bottom: 12px; margin-bottom: 16px;
   border-bottom: 1px solid rgba(166,161,130,.4);
}
.zs-mega-all .submenu {
   position: static !important; opacity: 1 !important; visibility: visible !important;
   width: auto !important; min-width: 0 !important; display: block !important;
   box-shadow: none !important; border-top: none !important; padding: 0 !important;
   transform: none !important; background: transparent !important;
   left: auto !important; right: auto !important; clip-path: none !important;
}
.zs-mega-all .submenu > li { display: block !important; margin-bottom: 10px !important; }
.zs-mega-all .submenu > li:last-child { margin-bottom: 0 !important; }
.zs-mega-all .submenu > li > a {
   color: #222; font-size: 15px; position: relative; display: inline-block;
}
/* Hover „futó vonal" effekt (mint az eredeti legördülőben) */
.zs-mega-all .submenu > li > a::after {
   content: ""; position: absolute; bottom: -2px; right: 0; left: auto;
   height: 1px; width: 0; background-color: var(--tp-theme-1); transition: width .5s ease;
}
.zs-mega-all .submenu > li > a:hover::after { width: 100%; right: auto; left: 0; }

/* === FŐOLDAL – MOBIL finomítások === */
/* Hero cím nagyobb telefonon */
@media (max-width: 575px) {
   .tp-slider-2-content .tp-slider-title { font-size: 44px !important; }
}
/* MOBIL: a fejléc (hero) váltakozó képet + keretet kivesszük, és a statisztikák után
   csak kis térköz maradjon, majd jöjjenek az alatta lévő (about) képek. */
@media (max-width: 767px) {
   .tp-slider-2-wrapper { display: none !important; }
   .tp-slider-2-height { padding-top: 155px !important; padding-bottom: 10px !important; }
   .tp-about-4-area { padding-top: 24px !important; }
   /* Törzsszöveg + felsorolás picivel nagyobb mobilon (jobb olvashatóság) */
   .tp-about-4-text p { font-size: 16px !important; }
   .tp-about-4-list ul li { font-size: 16px !important; }
   /* A „Segíthetünk?" gomb kicsit lentebb */
   .tp-about-4-right .tp-btn-black { margin-top: 18px; }
}

/* === MOBIL OFFCANVAS (hamburger) MENÜ – egységes betűméret minden oldalon === */
@media (max-width: 767px) {
   .tp-main-menu-mobile ul li a,
   .tp-main-menu-mobile ul li a span,
   .tp-main-menu-mobile ul li a .menu-text { font-size: 16px !important; }
}

/* === MOBIL: aloldali breadcrumb-banner magassága ===
   A korábbi csökkentés (150px) miatt a jobb alsó Est.1993 pecsét belelógott a
   címbe. Visszaállítjuk az eredeti, „zongorajavítás-szerű" magasságra, így a
   pecsétnek elég hely jut és minden aloldal egységes. */
@media (max-width: 767px) {
   .breadcrumb__height { height: 300px !important; }
}

/* === MOBIL menü accordion-nyíl: függőlegesen középre + fehér (jól látszódjon) === */
.tp-main-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn,
.tp-main-menu-mobile ul li.has-dropdown-2 > a .dropdown-toggle-btn {
   top: 50% !important;
   transform: translateY(-50%) !important;
   color: #ffffff !important;
   border-color: rgba(255,255,255,0.30) !important;
}
.tp-main-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn i,
.tp-main-menu-mobile ul li.has-dropdown-2 > a .dropdown-toggle-btn i {
   color: #ffffff !important;
}

/* === MOBIL: szolgáltatásaink tartalmi szekció feljebb (a szolgáltatás-aloldalakkal egyező ~80px térköz) ===
   tp-project-4-area kizárólag a szolgáltatásaink oldalon van, így más oldalt nem érint. A fejléc/breadcrumb nem változik. */
@media (max-width: 767px) {
   .tp-project-4-area { padding-top: 80px !important; }
}

/* === MOBIL: footer oszlopok sorrendje (Nyitvatartás, Elérhetőség, Szolgáltatások, További oldalaink) ===
   Csak mobilon (≤767px); desktopon a DOM-sorrend marad. */
@media (max-width: 767px) {
   .tp-footer-area > .container > .row > div:nth-child(1) { order: 4; } /* További oldalaink */
   .tp-footer-area > .container > .row > div:nth-child(2) { order: 3; } /* Szolgáltatások */
   .tp-footer-area > .container > .row > div:nth-child(3) { order: 1; } /* Nyitvatartás */
   .tp-footer-area > .container > .row > div:nth-child(4) { order: 2; } /* Elérhetőség */
}

/* === MOBIL: aloldali TÖRZSSZÖVEG 16px (mint a főoldalon) – címekhez (h4/h6) nem nyúlunk ===
   A teljes tartalmi terület MINDEN bekezdése (tp-sv-details-text/-left/-left-box p stb.) + a felsorolások. */
@media (max-width: 767px) {
   .tp-sv-details-area p { font-size: 16px !important; }
   .zs-lista li { font-size: 16px !important; }
}

/* === MOBIL: kétoszlopos rész címe (Akusztikusan/Digitálisan…) akkora, mint az
   „Applikáció/Keverés" (20px), és a pipa-ikon is nagyobb – minden aloldalon === */
@media (max-width: 767px) {
   .tp-sv-details-left h6 { font-size: 20px !important; }
   .tp-sv-details-left h6 i { font-size: 20px !important; }
}

/* === Kapcsolódó oldalak ("További szolgáltatásaink") – a videók/galéria UTÁN, középre === */
.zs-related { background:#F7F5F0; padding: 2.6rem 0 3rem; text-align:center; }
.zs-related-title { font-family:"Playfair Display",Georgia,serif; font-weight:400; font-size:clamp(1.3rem,2vw,1.7rem); color:#1A1A1A; margin-bottom:1.3rem; }
.zs-related-list { list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; justify-content:center; gap:12px 30px; }
.zs-related-list a { color:#1A1A1A; font-size:16px; transition:color .2s ease; }
.zs-related-list a:hover { color:#A6A182; }

/* === MOBIL: kevesebb üres rész az „Írjon nekünk" gomb és a videó/galéria elválasztó között ===
   (a tartalmi szekció pb-150 nagy; felhúzzuk a média-szekciót) */
@media (max-width: 767px) {
   .video-section, .gallery-section { margin-top: -125px !important; padding-top: 1.2rem !important; }
}

/* === Galéria lapozó gombok láthatóbbá (fehér háttéren ne tűnjenek el) === */
.gallery-pager .pgbtn { background: #f1ecdf !important; border: 1px solid #cdc4a8 !important; color: #1A1A1A !important; border-radius: 4px; }
.gallery-pager .pgbtn:hover:not(:disabled) { background: #ffffff !important; border-color: #A6A182 !important; }
.gallery-pager .pgbtn.active { background: #A6A182 !important; border-color: #A6A182 !important; color: #ffffff !important; }
.gallery-pager .pgbtn:disabled { opacity: 0.4 !important; }

/* === MOBIL: galéria lapozó = apró pontok (a fő lapozás a swipe); Előző/Következő gombok el === */
@media (max-width: 767px) {
   .gallery-pager .pgbtn.pgnav { display: none !important; }
   .gallery-pager { gap: 9px !important; }
   .gallery-pager .pgbtn { width: 9px !important; height: 9px !important; padding: 0 !important; min-width: 0 !important; font-size: 0 !important; border-radius: 50% !important; border: none !important; background: #d6cfbb !important; }
   .gallery-pager .pgbtn.active { background: #A6A182 !important; }
}

/* === MOBIL galéria: natív görgethető swipe-sáv (a böngésző saját vízszintes görgetése) === */
@media (max-width: 767px) {
   .gallery-grid.gallery-strip {
      display: flex !important;
      grid-template-columns: none !important;
      flex-wrap: nowrap !important;
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      -webkit-overflow-scrolling: touch;
      gap: 10px;
      padding-bottom: 8px;
      scrollbar-width: none;
   }
   .gallery-grid.gallery-strip::-webkit-scrollbar { display: none; }
   .gallery-grid.gallery-strip .gallery-item {
      flex: 0 0 82% !important;
      scroll-snap-align: center;
      aspect-ratio: 4 / 3;
      border-radius: 6px;
      overflow: hidden;
   }
   .gallery-grid.gallery-strip .gallery-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
   /* a sáv mellett a lapozó pontok feleslegesek */
   .gallery-pager:empty { display: none; }
}

/* Galéria képek: ne legyen natív kép-húzás/long-press menü (zavarná a swipe-ot) */
.gallery-grid img { -webkit-user-drag: none; user-select: none; -webkit-touch-callout: none; }

/* === MOBIL: bérbeadás kategória-képek kisebbek + kis felső térköz (ne tapadjanak a szöveghez) === */
@media (max-width: 767px) {
   .zs-kat-thumb { margin-top: 16px; }
   .zs-kat-thumb img { max-width: 55%; }
}

/* === ASZTALI: bérbeadás kategória-képek kicsivel kisebbek, jobbra igazítva === */
@media (min-width: 768px) {
   .zs-kat-thumb img { max-width: 82%; margin-left: auto; display: block; }
}


/* === BECHSTEIN OLDAL: a menü külön, tömör FEHÉR sáv (a natív elrendezés érintetlen) === */
body.bechstein-page .tp-header-2-area { background: transparent; }
body.bechstein-page .tp-header-2-area::after { content:""; position:absolute; left:0; right:0; top:0; height: var(--zs-bar-h, 100%); background:#0a0a0a; border-bottom:1px solid rgba(255,255,255,0.18); z-index:-1; }
body.bechstein-page .tp-header-2-menu > nav > ul > li > a { color: #ffffff !important; }
body.bechstein-page .tp-header-2-menu > nav > ul > li > a:hover { color: var(--tp-theme-1) !important; }
body.bechstein-page .tp-header-2-menu > nav > ul > li > a::after { content: none !important; }
body.bechstein-page .tp-header-2-bar .tp-menu-bar { color: #ffffff !important; }
body.bechstein-page .tp-header-2-bar button svg { color: #ffffff !important; }
body.bechstein-page .tp-header-2-bar button svg path { fill: #ffffff !important; }
/* Mobil/tablet (desktop menü rejtett): a fekete sáv töltse ki a teljes fejlécet */
@media (max-width: 1199px) { body.bechstein-page .tp-header-2-area::after { height: 100% !important; } }
/* Bechstein hero mobilon: kevesebb alsó üres tér (a háttér vége közelebb a tartalomhoz) */
@media (max-width: 767px) { body.bechstein-page .tp-slider-2-height { padding-bottom: 40px !important; } }
/* Bechstein hero mobilon: a tartalom alatti 80px margó és a kép-blokk elrejtése a felesleges üres tér ellen */
@media (max-width: 767px) {
  body.bechstein-page .tp-slider-2-content { margin-bottom: 0 !important; }
  body.bechstein-page .tp-slider-2-wrapper { display: none !important; }
}
/* Bechstein mobilon: „Hangszerek” közelebb az „Írjon nekünk” gombhoz */
@media (max-width: 767px) {
  body.bechstein-page .tp-about-4-area { padding-bottom: 24px !important; }
  body.bechstein-page .tp-service-area { padding-top: 28px !important; }
}
/* Bechstein mobilon: a kártya-kép kisebb a kereten belül (belső térköz) */
@media (max-width: 767px) {
  body.bechstein-page .tp-service-thumb { padding: 28px; background: #fff; }
}


/* === Bechstein hero logo (a cim helyen) === */
.bechstein-hero-logo { max-width: 100%; height: auto; max-height: 150px; display: inline-block; }
@media (max-width: 767px) { .bechstein-hero-logo { max-height: 90px; } }


/* Bechstein logo a breadcrumb (aloldal) fejlecben */
.bechstein-bc-logo { max-height: 160px; width: auto; height: auto; display: block; }
@media (max-width:767px){ .bechstein-bc-logo { max-height: 92px; } }


/* === Zongorák és pianínók oldal: erősebb sötétítés + premium kép a sarokban === */
body.bechstein-zp .breadcrumb__overlay::after { background: linear-gradient(180deg, rgba(0,0,0,0.66) 0%, rgba(0,0,0,0.96) 100%); }
.breadcrumb__area .premium-badge { position: absolute; right: 34px; bottom: 28px; width: 112px; height: 112px; object-fit: contain; z-index: 4; }
@media (max-width: 767px) { .breadcrumb__area .premium-badge { width: 78px; height: 78px; right: 16px; bottom: 14px; } }

/* Galeria-fejlec: aktiv meret-szuro jelzese, pl. Zongorak (180-230 cm) */
.zs-heading-filter { font-size: 0.62em; font-weight: 400; color: #8a8a8a; letter-spacing: 0.3px; }


/* === Részletes termékoldal (Concert D-282 minta) === */
.zs-pd-img { position:relative; border:1px solid #e6e6e6; border-radius:6px; background:#fff; padding:30px; display:flex; align-items:center; justify-content:center; }
.zs-pd-img::before { content:""; position:absolute; top:0; left:50%; transform:translateX(-50%); width:120px; height:2px; background:#bd9a52; }
.zs-pd-img img { max-width:100%; height:auto; }
.zs-pd-info { padding-left:14px; }
.zs-pd-logo img { max-height:40px; margin-bottom:20px; }
.zs-pd-title { font-family:"Playfair Display", Georgia, serif; font-weight:400; font-size:34px; color:#1a2640; margin:0 0 8px; line-height:1.05; }
.zs-pd-sub { font-family:"Playfair Display", Georgia, serif; font-style:italic; font-weight:400; font-size:18px; letter-spacing:1.5px; color:#1a2640; margin:0 0 26px; }
.zs-pd-lead { color:#555; font-size:16px; line-height:1.75; margin-bottom:26px; }
.zs-pd-specs { list-style:none; margin:0 0 30px; padding:0; }
.zs-pd-specs li { display:flex; justify-content:space-between; gap:18px; padding:11px 0; border-bottom:1px solid #ededed; font-size:15px; }
.zs-pd-specs li span { color:#8a8a8a; }
.zs-pd-specs li strong { color:#1a2640; font-weight:500; text-align:right; }
.zs-pd-desc { margin-top:56px; max-width:880px; }
.zs-pd-desc h3 { font-family:"Playfair Display", Georgia, serif; font-weight:400; font-size:26px; color:#1a2640; margin-bottom:18px; }
.zs-pd-desc p { color:#555; font-size:16px; line-height:1.8; margin-bottom:18px; }
.zs-sidebar-title { font-family:"Playfair Display", Georgia, serif; font-weight:400; font-size:20px; color:#1a2640; margin-bottom:18px; }
@media (max-width: 991px) { .zs-pd-info { padding-left:0; margin-top:32px; } }

/* Termékoldal – jellemzők ikonokkal (Bluetooth / Vario / önjátszó) */
.zs-pd-features { list-style:none; margin:4px 0 30px; padding:0; }
.zs-pd-features li { display:flex; align-items:flex-start; gap:12px; padding:8px 0; color:#5a5a5a; font-size:15px; line-height:1.5; }
.zs-pd-ic { flex:0 0 auto; color:#9a9a9a; display:inline-flex; margin-top:1px; }
.zs-pd-features a.subtle-link { color:#1a2640; text-decoration-color:#bd9a52; }

/* Termékoldal – színváltozatok (Variants) rács */
.zs-pd-variants { margin:8px 0 30px; }
.zs-pd-variants-lead { color:#1a2640; font-size:15px; margin:0 0 16px; }
.zs-pd-swatches { display:flex; flex-wrap:wrap; gap:12px; }
.zs-pd-swatches img { width:62px; height:62px; object-fit:cover; border-radius:8px; border:1px solid #e6e6e6; background:#fff; }
@media (max-width:767px){ .zs-pd-swatches img { width:54px; height:54px; } }

/* Termékoldal – harmonika (accordion), natív <details>, mobilbarát */
.zs-acc { margin-top:54px; max-width:920px; }
.zs-acc details { border-top:1px solid #e4e4e4; }
.zs-acc details:last-child { border-bottom:1px solid #e4e4e4; }
.zs-acc summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:20px 4px; font-family:"Playfair Display", Georgia, serif; font-weight:400; font-size:21px; color:#1a2640; }
.zs-acc summary::-webkit-details-marker { display:none; }
.zs-acc summary::after { content:"+"; font-size:24px; line-height:1; color:#bd9a52; }
.zs-acc details[open] summary::after { content:"\2013"; }
.zs-acc-body { padding:0 4px 26px; }
.zs-acc-body p { color:#555; font-size:16px; line-height:1.8; margin:0 0 16px; }
.zs-acc-body p:last-child { margin-bottom:0; }
.zs-acc-specs { list-style:none; margin:0; padding:0; }
.zs-acc-specs li { display:flex; justify-content:space-between; gap:18px; padding:11px 0; border-bottom:1px solid #ededed; font-size:15px; }
.zs-acc-specs li:last-child { border-bottom:none; }
.zs-acc-specs li span { color:#8a8a8a; }
.zs-acc-specs li strong { color:#1a2640; font-weight:500; }

/* Harmonika – fő jellemzők lista (arany pöttyök, kiemelt címke) */
.zs-acc-subtitle { font-weight:600; color:#1a2640; font-size:16px; margin:8px 0 14px; }
.zs-acc-list { list-style:none; margin:0; padding:0; }
.zs-acc-list li { position:relative; color:#555; font-size:16px; line-height:1.8; margin-bottom:16px; padding-left:18px; }
.zs-acc-list li:last-child { margin-bottom:0; }
.zs-acc-list li::before { content:""; position:absolute; left:0; top:13px; width:6px; height:6px; border-radius:50%; background:#bd9a52; }
.zs-acc-list li strong { color:#1a2640; font-weight:600; }

/* Harmonika – PDF dokumentum link */
.zs-doc-link { display:inline-flex; align-items:center; gap:12px; color:#1a2640; font-size:16px; text-decoration:none; padding:4px 0; }
.zs-doc-ic { color:#bd9a52; display:inline-flex; }
.zs-doc-link span:last-child { text-decoration:underline; text-decoration-color:#d8c69a; text-underline-offset:4px; }
.zs-doc-link:hover span:last-child { text-decoration-color:#bd9a52; }

/* Termékoldal jobb sáv – modell-lista szűkebb térközzel */
.zs-model-nav .zs-sidebar-title { margin-bottom:14px; }
.zs-model-nav ul li:not(:last-child) { margin-bottom:6px !important; }
.zs-model-nav ul li a { padding:10px 18px !important; font-size:15px; }

/* Harmonika – belső alcímek (Playfair) */
.zs-acc-h { font-family:"Playfair Display", Georgia, serif; font-weight:500; font-size:19px; line-height:1.4; color:#1a2640; margin:6px 0 14px; }
.zs-acc-body .zs-acc-h:not(:first-child) { margin-top:28px; }

/* Shop kártya – kattintható (kifeszített link + finom hover) */
.zs-card-stretch { position:absolute; inset:0; z-index:3; border-radius:4px; }
.zs-prod:has(.zs-card-stretch) .zs-card { transition:box-shadow .22s ease, transform .22s ease; }
.zs-prod:has(.zs-card-stretch):hover .zs-card { box-shadow:0 12px 30px rgba(0,0,0,.09); transform:translateY(-3px); }

/* Bechstein főoldal – sorozat-kártyák teljes felülete kattintható */
.tp-service-item { position:relative; }
.tp-service-item:has(.zs-card-stretch) { transition:box-shadow .22s ease, transform .22s ease; }
.tp-service-item:has(.zs-card-stretch):hover { box-shadow:0 14px 34px rgba(0,0,0,.10); transform:translateY(-3px); }

/* Termékoldal jobb sáv – aktív modell jól látható (sötétebb háttér + arany jelzés) */
.zs-model-nav ul li.active a { background-color:#F8F8F8 !important; box-shadow: inset 3px 0 0 #bd9a52; font-weight:500; color:#1a2640; }

/* Jobb sáv – kategória-váltó (Zongora | Pianínó) a lista fölött */
.zs-cat-toggle { display:flex; align-items:center; gap:14px; padding-bottom:16px; margin-bottom:18px; border-bottom:1px solid #e4e4e4; }
.zs-cat-tab { font-family:"Playfair Display", Georgia, serif; font-weight:500; font-size:21px; line-height:1; color:#bdbdbd; text-decoration:none; transition:color .2s ease; }
.zs-cat-tab.active { color:#1a2640; }
.zs-cat-tab:not(.active):hover { color:#bd9a52; }
.zs-cat-sep { width:1px; height:18px; background:#d8d8d8; display:inline-block; }

/* Mobil: nagyobb csúszka-thumb és érintő-terület a könnyebb húzáshoz */
@media (max-width: 767px) {
  .zs-range-track-wrap { height: 34px; }
  .zs-range input[type=range] { height: 34px; }
  .zs-range input[type=range]::-webkit-slider-thumb { width: 26px; height: 26px; margin-top: 4px; }
  .zs-range input[type=range]::-moz-range-thumb { width: 26px; height: 26px; }
  .zs-range-track, .zs-range-fill { top: 16px; }
}

/* Mobil: méret-csúszka elrejtése (érintőn nem stabil), kategória-szűrő marad */
@media (max-width: 767px) { .zs-range-widget { display: none !important; } }

/* Mobil: termékoldal jobb sáv térköz + nincs ragadós hover */
@media (max-width: 991px) {
  .tp-sv-details-sidebar { margin-top: 44px; }
}
@media (hover: none) {
  .tp-sv-details-sidebar .tp-sv-sidebar-widget ul li:not(.active):hover a {
    background-color: transparent !important;
    border-color: var(--tp-grey-1) !important;
    box-shadow: none !important;
  }
}

/* Jobb sáv – pianínó magasság (cm) a modellnév mellett */
.zs-side-size { font-size: 0.85em; color: #8a8a8a; }

/* Termékoldal – garancia kiemelés + szerviz sorok */
.zs-pd-warranty { display:flex; align-items:flex-start; gap:12px; margin:8px 0; color:#5a5a5a; font-size:15px; line-height:1.5; }
.zs-pd-warranty-ic { color:#bd9a52; display:inline-flex; flex:0 0 auto; margin-top:1px; }
.zs-pd-warranty-num { font-weight:700; color:#1a2640; }
.zs-pd-service { margin-top:2px; }

/* Termékoldal – szolgáltatás-stílusú lista (arany circle-check) a leírásban */
.zs-pd-sv-list { margin: 22px 0 26px; }
.zs-pd-sv { position:relative; padding-left:30px; font-size:18px; color:#1a2640; margin:0 0 12px; line-height:1.5; }
.zs-pd-sv:last-child { margin-bottom:0; }
.zs-pd-sv i { position:absolute; top:5px; left:0; font-size:18px; color:var(--tp-theme-1); }
@media (max-width:767px){ .zs-pd-sv { font-size:16px; } }

/* Termékoldal – kiemelt blokk (arany zongorás ikon + szöveg), szolgáltatás-stílus */
.zs-pd-callout { margin: 26px 0; }
.zs-pd-callout-text p { margin: 0 0 6px; color:#555; font-size:16px; line-height:1.7; }
.zs-pd-callout-text p:last-child { margin-bottom:0; }
.zs-pd-callout-text p strong { color:#1a2640; font-weight:600; }

/* Bechstein – Gyakori kérdések (FAQ) accordion */
.zs-faq { max-width: 860px; margin: 0 auto; }
.zs-faq details { border-top:1px solid #e4e4e4; }
.zs-faq details:last-child { border-bottom:1px solid #e4e4e4; }
.zs-faq summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:20px 4px; font-family:"Playfair Display", Georgia, serif; font-weight:400; font-size:20px; color:#1a2640; }
.zs-faq summary::-webkit-details-marker { display:none; }
.zs-faq summary::after { content:"+"; font-size:24px; line-height:1; color:#bd9a52; flex:0 0 auto; }
.zs-faq details[open] summary::after { content:"\2013"; }
.zs-faq-body { padding:0 4px 24px; }
.zs-faq-body p { color:#555; font-size:16px; line-height:1.8; margin:0; }
@media (max-width:767px){ .zs-faq-area{ padding-top:40px !important; padding-bottom:50px !important; } .zs-faq summary{ font-size:17px; } }
/* Bechstein: Hangszerek modul alja közelebb a FAQ-hoz */
body.bechstein-page .tp-service-area { padding-bottom: 50px; }