/* Mobilmenü minden oldalon: bal oldali hamburger, balról nyíló fiók (lásd mobile-menu.js) */
.mm-toggle, .mm-drawer, .mm-shade { display: none; }
@media (max-width: 1080px) {
  header .mm-toggle { order: -1; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 44px; height: 44px; min-height: 44px; margin: 0 4px 0 0; padding: 0; border: 1px solid #4a4235; border-radius: 0; background: transparent; color: #e2c894; cursor: pointer; }
  header .mm-toggle:hover { border-color: #c9a86b; }
  header.top { gap: 12px; }
  header.header .menu-toggle, header.header > nav { display: none !important; }
  header.header { display: flex !important; align-items: center; gap: 12px; }
  header.header .brand { margin-right: auto; }
  .mm-shade { display: block; position: fixed; inset: 0; z-index: 990; background: rgba(10,9,7,.7); backdrop-filter: blur(3px); opacity: 0; pointer-events: none; transition: opacity .3s; }
  .mm-drawer { display: flex; position: fixed; z-index: 1000; left: 0; top: 0; bottom: 0; width: min(360px, 88vw); flex-direction: column; gap: 18px; padding: calc(16px + env(safe-area-inset-top, 0px)) 22px calc(22px + env(safe-area-inset-bottom, 0px)) max(22px, env(safe-area-inset-left, 0px)); box-sizing: border-box; background: #1b1814; border-right: 1px solid #c9a86b; box-shadow: 24px 0 60px rgba(0,0,0,.6); overflow-y: auto; overscroll-behavior: contain; transform: translateX(-102%); transition: transform .3s ease; }
  .mm-drawer[hidden] { display: none; }
  html.mm-open { overflow: hidden; }
  html.mm-open .mm-shade { opacity: 1; pointer-events: auto; }
  html.mm-open .mm-drawer { transform: none; }
  .mm-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid #2c2821; }
  .mm-head .brand { display: inline-flex; align-items: center; gap: 10px; color: #f1ebdd; text-decoration: none; }
  .mm-head .brand svg { width: 44px; height: auto; color: #c9a86b; }
  .mm-head .brand b, .mm-head .brand .vs-word { font: 400 13px/1.1 Michroma, sans-serif; letter-spacing: 3px; color: #f1ebdd; }
  .mm-head .brand small { display: block; font-size: 7px; letter-spacing: 3.4px; color: #a79f8e; }
  .mm-close { width: 40px; height: 40px; min-height: 40px; padding: 0; border: 1px solid #4a4235; border-radius: 0; background: transparent; color: #e2c894; font-size: 24px; line-height: 1; cursor: pointer; }
  .mm-links { display: flex; flex-direction: column; }
  .mm-links a { display: flex; align-items: center; justify-content: space-between; padding: 13px 2px; border-bottom: 1px solid #2c2821; color: #f1ebdd; text-decoration: none; font: 400 24px/1.15 Newsreader, Georgia, serif; }
  .mm-links a::after { content: "›"; font: 300 22px/1 'Instrument Sans', sans-serif; color: #6d6453; }
  .mm-links a:hover, .mm-links a:focus-visible { color: #e2c894; outline: none; }
  .mm-links a[aria-current="page"] { color: #e2c894; }
  .mm-links a[aria-current="page"]::after { content: ""; width: 7px; height: 7px; background: #c9a86b; transform: rotate(45deg); }
  .mm-acts { margin-top: auto; display: flex; flex-direction: column; gap: 10px; padding-top: 8px; }
  .mm-cta, .mm-call { height: 52px; display: flex; align-items: center; justify-content: center; gap: 10px; text-decoration: none; font: 600 15px 'Instrument Sans', sans-serif; }
  .mm-cta { background: #c9a86b; color: #1a1712; clip-path: polygon(12px 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%, 0 12px); }
  .mm-call { border: 1px solid rgba(241,235,221,.4); color: #f1ebdd; font-weight: 500; }
}
@media (prefers-reduced-motion: reduce) { .mm-drawer, .mm-shade { transition: none; } }
/* keskeny telefonon a hamburger mellett is elférjen a logó és az ajánlatkérés gomb */
@media (max-width: 460px) {
  header.top { gap: 10px; }
  header.top .mm-toggle { width: 40px; height: 40px; min-height: 40px; margin-right: 0; }
  header.top .brand { gap: 8px; min-width: 0; }
  header.top .brand svg { width: 36px; height: 20px; }
  header.top .brand b { font-size: 11px; letter-spacing: 2px; white-space: nowrap; }
  header.top .btn { height: 40px; padding: 0 12px; font-size: 13px; white-space: nowrap; flex: 0 0 auto; }
  header.top .btn svg { display: none; }
}
@media (max-width: 350px) { header.top .btn { display: none; } }
/* asztali menü: az aktuális oldal halvány jelölése */
header nav a[aria-current="page"] { color: #e2c894 !important; position: relative; }
header nav a[aria-current="page"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: -7px; height: 1px; background: linear-gradient(90deg, transparent, rgba(201,168,107,.75), transparent); pointer-events: none; }
@media (max-width: 1080px) { header.vs-top { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 12px; } }
header nav a[aria-current="location"] { color: #e2c894 !important; position: relative; }
header nav a[aria-current="location"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: -7px; height: 1px; background: linear-gradient(90deg, transparent, rgba(201,168,107,.75), transparent); pointer-events: none; }

/* elérhetőség a menü végén: telefon és e-mail kis betűvel egymás alatt */
header nav .nav-contact { display: inline-flex; flex-direction: column; justify-content: center; gap: 2px; margin-left: 6px; padding-left: 18px; border-left: 1px solid rgba(201,168,107,.35); line-height: 1.2; }
header nav .nav-contact a { font-size: 12px !important; letter-spacing: .2px; color: #bdb4a2 !important; white-space: nowrap; padding: 0 !important; }
header nav .nav-contact a:hover { color: #e2c894 !important; }
header nav .nav-contact a::after { display: none !important; }
.mm-mail { display: none; }
@media (max-width: 1360px) { header nav .nav-contact { display: none; } }
@media (max-width: 1080px) { .mm-mail { display: flex; align-items: center; justify-content: center; height: 40px; color: #bdb4a2; font-size: 14px; text-decoration: none; } }
/* a menüpontok soha ne törjenek két sorba; az elérhetőség csak elég széles képernyőn látszik */
header nav a { white-space: nowrap; }
@media (max-width: 1640px) { header.top nav .nav-contact { display: none; } }
@media (max-width: 1560px) { header.header nav .nav-contact { display: none; } }
/* vízszintesen húzható címkesorok (pl. Munkáink szűrői): görgetősáv nélkül, a szélén finom elhalványulás */
.filter-chips, .portfolio-tags { scrollbar-width: none; }
.filter-chips::-webkit-scrollbar, .portfolio-tags::-webkit-scrollbar { display: none; }
@media (max-width: 900px) { .filter-chips, .portfolio-tags { -webkit-mask-image: linear-gradient(90deg, #000 82%, transparent); mask-image: linear-gradient(90deg, #000 82%, transparent); } }
/* szlogen a lábléc márkasorában: vékony kézírás, arany */
.foot-slogan { display: inline-block; margin-left: 14px; font: 400 21px/1 Caveat, 'Segoe Print', cursive; letter-spacing: .2px; color: #e2c894; vertical-align: -2px; white-space: nowrap; }
@media (max-width: 720px) { .foot-slogan { display: block; margin: 8px 0 0; } }
.footer-bottom .foot-slogan { margin-right: auto; }
/* szlogen extra vékonyan: a betűk szélét a lábléc háttérszínével visszavágjuk (ugyanaz a Caveat, vékonyabb vonallal) */
.foot-slogan { -webkit-text-stroke: .55px #181611; }
footer.foot .foot-slogan { -webkit-text-stroke-color: #15130f; }
/* szlogen a logó mellett: visszafogott Michroma, csak széles monitoron */
.brand-slogan { display: none; }
@media (min-width: 1800px) {
  header .brand-slogan { display: inline-flex; align-items: center; flex: 0 0 auto; height: 30px; margin-left: 4px; padding-left: 18px; border-left: 1px solid rgba(201,168,107,.28); font: 400 9px/1.3 Michroma, sans-serif; letter-spacing: 2.4px; text-transform: uppercase; color: #8c826b; white-space: nowrap; }
}

/* EGYSÉGES FEJLÉC minden oldalon (a kalkulátor szerkezete a minta): 76 px magas, 72 px oldalsó margó,
   a logó, a szlogen és a menü minden oldalon ugyanott; a jobb oldali elemek a jobb szélen */
@media (min-width: 1081px) {
  header.top, header.header, header.vs-top { box-sizing: border-box; height: 76px !important; min-height: 76px; display: flex !important; align-items: center; gap: 0 !important; padding: 0 clamp(16px, 3.75vw, 72px) !important; background: rgba(21,19,15,.94) !important; border-bottom: 1px solid #2c2821 !important; backdrop-filter: blur(14px); }
  header.top .brand, header.header .brand, header.vs-top .vs-brand { flex: 0 0 auto; width: 255px; margin: 0 !important; padding: 0 !important; display: flex; align-items: center; gap: 14px; }
  header.top .brand svg, header.header .brand svg, header.vs-top .vs-brand svg { width: 52px !important; height: 29px !important; flex: 0 0 auto; }
  header .brand-slogan { margin-left: 0 !important; }
  header.top nav, header.header nav, header.vs-top nav { flex: 0 1 auto; margin: 0 auto 0 32px !important; gap: 26px !important; font-size: 15px; }
  header.top nav a, header.header nav a, header.vs-top nav a { font-size: 15px !important; padding-block: 0 !important; }
}
@media (min-width: 1081px) and (max-width: 1500px) { header.top nav, header.header nav, header.vs-top nav { gap: 20px !important; margin-left: 24px !important; } }
/* menüpontok fix magassággal: az aktuális oldal aláhúzása semmit nem told el */
@media (min-width: 1081px) {
  header.top nav > a, header.header nav > a, header.vs-top nav > a { display: inline-flex !important; align-items: center; height: 40px; line-height: 1; padding: 0 !important; margin: 0 !important; border: 0 !important; position: relative; box-sizing: border-box; }
  header nav > a[aria-current]::after { bottom: 4px !important; }
}
@media (min-width: 1081px) {
  header .brand b, header .brand .vs-word, header .vs-brand b, header .vs-brand span { white-space: nowrap; }
  header nav > a.mobile-contact { display: none !important; }
}
/* logó, elválasztó, szlogen: természetes szélesség, fix térközökkel (nem csúsznak egymásra) */
@media (min-width: 1081px) {
  header.top .brand, header.header .brand, header.vs-top .vs-brand { width: auto !important; flex: 0 0 auto; }
  header .brand-slogan { margin-left: 24px !important; padding-left: 22px !important; }
  header.top nav, header.header nav, header.vs-top nav { margin-left: 40px !important; }
}
@media (min-width: 1081px) and (max-width: 1500px) { header.top nav, header.header nav, header.vs-top nav { margin-left: 28px !important; } }
/* menüpontok színe és fölé vitele minden oldalon egyformán */
header.top nav > a, header.header nav > a, header.vs-top nav > a { color: #d6cfbf; transition: color .2s; }
header.top nav > a:hover, header.header nav > a:hover, header.vs-top nav > a:hover, header nav > a:focus-visible { color: #f6ead0 !important; }
header nav > a[aria-current]:hover { color: #f6ead0 !important; }
/* nagyobb térközök a fejlécben (logó – szlogen – menü) */
@media (min-width: 1081px) {
  header .brand-slogan { margin-left: 38px !important; padding-left: 20px !important; }
  header.top nav, header.header nav, header.vs-top nav { margin-left: 56px !important; }
}
@media (min-width: 1800px) { header.top nav, header.header nav, header.vs-top nav { margin-left: 110px !important; } }
@media (min-width: 1081px) and (max-width: 1500px) { header.top nav, header.header nav, header.vs-top nav { margin-left: 36px !important; } }
