/* ==========================================================================
   KORMOS-MAYER BÁLINT / Design System v2
   Referenciák: erasedtapes.com (semleges, panelrácsos, táblázatos),
   lucymorgan.net (monokróm, sűrített wordmark, apró mono címkék),
   nin.com (fekete–vörös, grafikus), lector.hu (sávos ajánlatkérő).

   Alapelvek: lapos felületek · nincs árnyék · nincs lekerekítés ·
   egyetlen vörös kiemelés · apró, funkcionális tipográfia · hajszálvonalas rácsok
   ========================================================================== */

/* ---------- 0. TOKENS ---------------------------------------------------- */
:root{
  --ink:        #111113;
  --ink-bar:    #16161A;
  --ink-soft:   #2A2A2E;
  --paper:      #FBFAF8;
  --panel:      #F1F0EC;
  --panel-2:    #E7E5DF;
  --grey:       #6C6A66;
  --grey-2:     #9C9992;
  --rule:       #DBD8D1;
  --rule-dark:  rgba(251,250,248,.18);

  --bg:         var(--paper);
  --fg:         var(--ink);
  --fg-2:       var(--grey);
  --fg-3:       var(--grey-2);
  --line:       var(--rule);

  --font-wm:   "Anton", "Haettenschweiler", "Arial Narrow", sans-serif;
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --fs-micro: 10px;
  --fs-meta:  11px;
  --fs-sm:    13px;
  --fs-body:  15px;
  --fs-lead:  clamp(15px, 14px + .35vw, 18px);
  --fs-h3:    clamp(15px, 14.4px + .3vw, 17px);
  --fs-h2:    clamp(19px, 17px + .7vw, 25px);
  --fs-h1:    clamp(30px, 22px + 3.2vw, 62px);
  --fs-wm:    clamp(44px, 9vw, 168px);

  --gutter: clamp(16px, 1.2vw + 10px, 26px);
  --maxw: 1320px;
  --maxw-text: 72ch;
  --section-y: clamp(46px, 4.5vw, 86px);
  --strip-h: 32px;
  --bar-h: 54px;
  --nav-h: calc(var(--strip-h) + var(--bar-h));

  --r: 0px;
  --ease: cubic-bezier(.2,.6,.3,1);
}

[data-theme="dark"]{
  --bg: var(--ink); --fg: #F2F1EE; --fg-2: #A3A099; --fg-3: #76736D;
  --line: var(--rule-dark); --panel: #1C1C20; --panel-2: #232328;
}
[data-theme="panel"]{ --bg: var(--panel); }

/* ---------- 1. RESET ----------------------------------------------------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--nav-h) + 16px); }
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--font-sans); font-size:var(--fs-body); line-height:1.55;
  font-weight:400; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
body.is-locked{ overflow:hidden; }
img,svg,video{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
button,input,select,textarea{ font:inherit; color:inherit; }
ul,ol{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,h5,p,figure,blockquote,dl,dd{ margin:0; }
table{ border-collapse:collapse; width:100%; }
hr{ border:0; border-top:1px solid var(--line); margin:0; }
::selection{ background:var(--ink); color:var(--paper); }
:focus-visible{ outline:2px solid var(--fg); outline-offset:2px; }
.skip-link{
  position:absolute; left:12px; top:-60px; z-index:2000; background:var(--ink); color:var(--paper);
  padding:8px 14px; font-size:var(--fs-sm); transition:top .2s;
}
.skip-link:focus{ top:8px; }

/* ---------- 2. TYPOGRAPHY ------------------------------------------------ */
.wm{
  font-family:var(--font-wm); font-weight:400; text-transform:lowercase;
  letter-spacing:-.015em; line-height:.86; word-spacing:.06em;
}
.wm em{ font-style:normal; color:var(--fg-3); margin-left:.16em; }
h1,.h1{ font-size:var(--fs-h1); font-weight:700; letter-spacing:-.025em; line-height:1.06; }
h2,.h2{ font-size:var(--fs-h2); font-weight:700; letter-spacing:-.02em; line-height:1.15; }
h3,.h3{ font-size:var(--fs-h3); font-weight:600; letter-spacing:-.012em; line-height:1.3; }
h4,.h4{ font-size:var(--fs-body); font-weight:600; letter-spacing:-.01em; line-height:1.35; }
.lead{ font-size:var(--fs-lead); line-height:1.5; color:var(--fg); letter-spacing:-.011em; }
.small{ font-size:var(--fs-sm); }
.muted{ color:var(--fg-2); }
.faint{ color:var(--fg-3); }
.measure{ max-width:var(--maxw-text); }
.measure-sm{ max-width:44ch; }
.balance{ text-wrap:balance; }

.kicker,.meta{
  font-family:var(--font-sans); font-size:var(--fs-meta); font-weight:600;
  letter-spacing:.13em; text-transform:uppercase; color:var(--fg-3);
  display:inline-flex; align-items:center; gap:8px;
}
.kicker--dot::before{ content:""; width:5px; height:5px; background:var(--fg); flex:none; }
.code{
  font-family:var(--font-sans); font-size:var(--fs-micro); font-weight:600; letter-spacing:.12em;
  text-transform:uppercase; color:var(--fg-3);
}
.hl{ color:var(--fg); font-weight:600; }
.u{ text-decoration:underline; text-underline-offset:2px; text-decoration-thickness:1px; }

.rich{ font-size:var(--fs-body); max-width:var(--maxw-text); }
.rich p + p{ margin-top:1em; }
.rich h3{ margin:2.4em 0 .5em; font-size:var(--fs-body); font-weight:700; }
.rich ul{ margin:1em 0; display:grid; gap:4px; }
.rich ul li{ padding-left:16px; position:relative; color:var(--fg-2); }
.rich ul li::before{ content:""; position:absolute; left:0; top:.62em; width:5px; height:5px;
  background:var(--grey-2); }
.rich a{ text-decoration:underline; text-underline-offset:2px; }
.rich a:hover{ text-decoration-thickness:2px; }
.rich blockquote{
  margin:1.8em 0; padding:16px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  font-size:var(--fs-lead); font-style:italic; line-height:1.45;
}
/* Jogi oldalak (adatkezelési tájékoztató, impresszum): címszintek és táblázatok */
.rich h2{ margin:2.8em 0 .6em; font-size:var(--fs-h3); font-weight:700; }
.rich h4{ margin:2em 0 .5em; }
.rich h5{ margin:1.6em 0 .4em; font-size:var(--fs-body); font-weight:600; color:var(--fg-2); }
.rich code{ font-size:.92em; }
.ltable-wrap{ margin:1em 0; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.ltable{ font-size:var(--fs-sm); }
.ltable th,.ltable td{ padding:9px 14px 9px 0; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
.ltable thead th{ font-weight:600; border-bottom-color:var(--fg-3); }
.ltable--kv th{ width:30%; font-weight:600; }
.ltable:not(.ltable--kv){ min-width:640px; }

/* ---------- 3. LAYOUT ---------------------------------------------------- */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }
/* Egységes szélesség: a korábbi „keskeny" és „széles" változat is a fő sávot követi,
   a szöveghosszt a --maxw-text fogja meg (lásd .rich, .acc, .measure). */
.wrap--narrow,.wrap--wide{ max-width:var(--maxw); }
.section{ padding-block:var(--section-y); background:var(--bg); color:var(--fg); }
.section--tight{ padding-block:calc(var(--section-y) * .55); }
.section--flush{ padding-top:0; }
.stack{ display:grid; gap:14px; }
.stack-lg{ display:grid; gap:26px; }
.row{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.row--between{ justify-content:space-between; }
.grid{ display:grid; gap:1px; }
.g-2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.g-3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.g-4{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.gap{ gap:clamp(18px,2vw,34px); }
.split{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.25fr); gap:clamp(24px,4vw,64px); align-items:start; }
.split--even{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.cols-3{ columns:3; column-gap:clamp(20px,3vw,44px); }
.cols-3 p{ break-inside:avoid; margin-bottom:1em; }
.cols-2{ columns:2; column-gap:clamp(20px,3vw,44px); }

.shead{ display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px; margin-bottom:18px; }
.shead h2{ margin-right:4px; }
.shead a{ font-size:var(--fs-sm); color:var(--fg-2); }
.shead a:hover{ color:var(--fg); text-decoration:underline; text-underline-offset:2px; }
.shead--stack{ display:grid; gap:8px; margin-bottom:24px; }

.panel{ background:var(--panel); padding:clamp(18px,2.2vw,30px); }
.panel--flush{ padding:0; }

@media (max-width:1000px){
  .g-4{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cols-3{ columns:2; }
}
@media (max-width:820px){
  .split,.split--even{ grid-template-columns:1fr; }
  .g-3{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:600px){
  .g-2,.g-3,.g-4{ grid-template-columns:1fr; }
  .cols-3,.cols-2{ columns:1; }
}

/* ---------- BUTTONS & LINKS ---------------------------------------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:11px 18px; border:1px solid var(--ink); background:var(--ink); color:var(--paper);
  font-size:var(--fs-sm); font-weight:600; letter-spacing:.01em; line-height:1;
  cursor:pointer; text-align:center; border-radius:var(--r);
  transition:background-color .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease);
}
.btn:hover{ background:transparent; color:var(--ink); border-color:var(--ink); }
.btn--accent{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.btn--accent:hover{ background:transparent; color:var(--ink); border-color:var(--ink); }
.btn--ghost{ background:transparent; color:var(--fg); border-color:var(--line); }
.btn--ghost:hover{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.btn--sm{ padding:7px 12px; font-size:var(--fs-meta); }
.btn--lg{ padding:14px 24px; font-size:var(--fs-body); }
.btn--block{ width:100%; }
.btn[disabled],.btn.is-busy{ opacity:.5; pointer-events:none; }
[data-theme="dark"] .btn{ background:var(--paper); border-color:var(--paper); color:var(--ink); }
[data-theme="dark"] .btn:hover{ background:transparent; color:var(--fg); border-color:var(--fg); }
[data-theme="dark"] .btn--ghost{ background:transparent; color:var(--fg); border-color:var(--rule-dark); }
[data-theme="dark"] .btn--ghost:hover{ background:var(--paper); color:var(--ink); border-color:var(--paper); }

.iconbtn{
  width:26px; height:26px; display:grid; place-items:center; flex:none;
  border:1px solid var(--ink); background:var(--ink); color:var(--paper); cursor:pointer;
  transition:.18s var(--ease);
}
.iconbtn:hover{ background:transparent; color:var(--ink); }

.link-u{ font-size:var(--fs-sm); text-decoration:underline; text-underline-offset:2px; text-decoration-thickness:1px; }
.link-u:hover{ text-decoration-thickness:2px; }
.link-arrow{ display:inline-flex; align-items:center; gap:6px; font-size:var(--fs-sm); font-weight:500; }
.link-arrow:hover{ text-decoration:underline; text-underline-offset:3px; }
.link-arrow .ico{ transition:transform .2s var(--ease); }
.link-arrow:hover .ico{ transform:translateX(3px); }

.tag{
  display:inline-flex; align-items:center; gap:5px; font-family:var(--font-sans);
  font-size:var(--fs-micro); letter-spacing:.11em; text-transform:uppercase;
  padding:3px 7px; border:1px solid var(--line); color:var(--fg-2); background:transparent; white-space:nowrap;
 font-weight:600;}
.tag--accent{ border-color:var(--fg); color:var(--fg); }
.tag--solid{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
button.tag{ cursor:pointer; transition:.18s var(--ease); }
button.tag:hover{ border-color:var(--ink); color:var(--ink); }
button.tag[aria-pressed="true"]{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.tag-row{ display:flex; flex-wrap:wrap; gap:6px; }

/* ---------- 4. NAVIGÁCIÓ (vékony sötét sáv + fő sor) --------------------- */
.nav{ position:fixed; inset:0 0 auto 0; z-index:1000; }

/* Felső segédsáv Erased Tapes fekete csíkja */
.strip{
  background:var(--ink-bar); color:#EDECE8; height:var(--strip-h);
  display:flex; align-items:center; font-size:var(--fs-meta);
  transition:height .25s var(--ease), opacity .2s var(--ease);
  overflow:hidden;
}
.strip__inner{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter);
  display:flex; align-items:center; justify-content:space-between; gap:16px; }
.strip__links{ display:flex; gap:18px; align-items:center; }
.strip a:hover{ color:#fff; text-decoration:underline; text-underline-offset:2px; }
.strip .code{ color:rgba(237,236,232,.55); }
.nav.is-scrolled .strip{ height:0; opacity:0; }

/* Fő sor */
.bar{
  background:var(--paper); border-bottom:1px solid var(--line);
  height:var(--bar-h); display:flex; align-items:center;
}
.bar__inner{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter);
  display:flex; align-items:center; justify-content:space-between; gap:18px; }

/* Wordmark a fejlécben */
.logo{ display:inline-flex; align-items:baseline; gap:7px; flex:none; }
.logo__wm{ font-family:var(--font-wm); font-size:19px; line-height:1; letter-spacing:-.01em; text-transform:lowercase; }
.logo__wm em{ font-style:normal; color:var(--grey-2); margin-left:.18em; }
.logo__tag{ font-family:var(--font-sans); font-size:var(--fs-micro); letter-spacing:.16em;
  text-transform:uppercase; color:var(--grey-2);  font-weight:600;}

.nav__menu{ display:flex; align-items:center; gap:clamp(10px,1.5vw,22px); }
.nav__link{ font-size:var(--fs-sm); color:var(--fg); padding:4px 0; position:relative; white-space:nowrap; }
.nav__link:hover{ text-decoration:underline; text-underline-offset:4px; }
.nav__link[aria-current="page"]{ font-weight:600; box-shadow:inset 0 -1px 0 var(--ink); }

.nav__item{ position:relative; }
.nav__panel{
  position:absolute; top:calc(100% + 14px); left:-14px; min-width:280px; background:var(--paper);
  border:1px solid var(--line); padding:6px; display:grid; gap:1px;
  opacity:0; visibility:hidden; transform:translateY(-4px); transition:.18s var(--ease);
}
.nav__item:hover .nav__panel,.nav__item:focus-within .nav__panel{ opacity:1; visibility:visible; transform:none; }
.nav__panel a{ display:grid; gap:2px; padding:9px 10px; }
.nav__panel a:hover{ background:var(--panel); }
.nav__panel strong{ font-size:var(--fs-sm); font-weight:600; }
.nav__panel span{ font-size:var(--fs-meta); color:var(--fg-2); line-height:1.4; }

/* Nyelvváltó apró, aláhúzott, monokróm */
.lang{ display:flex; align-items:center; gap:9px; }
.lang__btn{
  border:0; background:transparent; cursor:pointer; padding:0;
  font-family:var(--font-sans); font-size:var(--fs-meta); letter-spacing:.1em; text-transform:uppercase;
  color:rgba(237,236,232,.55); transition:.18s var(--ease);
 font-weight:600;}
.lang__btn:hover{ color:#fff; }
.lang__btn[aria-pressed="true"]{ color:#fff; text-decoration:underline; text-underline-offset:3px; }
.nav__actions{ display:flex; align-items:center; gap:12px; flex:none; }

.burger{ display:none; width:34px; height:34px; border:1px solid var(--line); background:transparent;
  cursor:pointer; place-items:center; flex:none; }
.burger span{ display:block; width:14px; height:1px; background:currentColor; transition:.22s var(--ease); }
.burger span + span{ margin-top:4px; }
.burger[aria-expanded="true"] span:first-child{ transform:translateY(2.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:last-child{ transform:translateY(-2.5px) rotate(-45deg); }

.drawer{
  position:fixed; inset:0; z-index:999; background:var(--paper); color:var(--ink);
  padding:calc(var(--nav-h) + 22px) var(--gutter) 40px; display:grid; align-content:start;
  overflow-y:auto; visibility:hidden; opacity:0; transition:opacity .2s var(--ease), visibility .2s;
}
.drawer.is-open{ visibility:visible; opacity:1; }
.drawer > a{ font-size:20px; font-weight:600; letter-spacing:-.02em; padding:13px 0;
  border-bottom:1px solid var(--line); display:flex; align-items:baseline; gap:12px; }
.drawer > a i{ font-family:var(--font-sans); font-size:var(--fs-micro); font-style:normal;
  letter-spacing:.12em; color:var(--grey-2);  font-weight:600;}
.drawer > a:hover{ text-decoration:underline; text-underline-offset:4px; }
.drawer__foot{ margin-top:26px; display:grid; gap:10px; }
.lang--drawer .lang__btn{ color:var(--fg-2); font-size:var(--fs-sm); }
.lang--drawer .lang__btn[aria-pressed="true"]{ color:var(--ink); }

@media (max-width:1080px){
  .nav__menu{ display:none; }
  .burger{ display:grid; }
  .btn--nav{ display:none; }
}
@media (max-width:560px){
  .strip__links .strip__hide{ display:none; }
  .logo__tag{ display:none; }
}

/* ---------- 5. HERO ------------------------------------------------------ */
.hero{ padding-top:var(--nav-h); background:var(--paper); }
.hero__media{ position:relative; width:100%; aspect-ratio:21/7; overflow:hidden; background:var(--panel-2); }
.hero__media svg,.hero__media img{ width:100%; height:100%; object-fit:cover; }
.hero__label{
  position:absolute; left:var(--gutter); bottom:14px; color:#F2F1EE;
  font-family:var(--font-sans); font-size:var(--fs-meta); letter-spacing:.14em; text-transform:uppercase;
  text-shadow:0 1px 12px rgba(0,0,0,.6);
}
.hero__wm{ padding-block:clamp(22px,3vw,40px) clamp(10px,1.4vw,18px); }
.hero__wm .wm{ font-size:var(--fs-wm); }
.hero__strap{ display:flex; flex-wrap:wrap; gap:6px 18px; align-items:baseline;
  padding-bottom:clamp(16px,2vw,26px); border-bottom:1px solid var(--line); }
.hero__strap p{ font-size:var(--fs-lead); font-weight:500; letter-spacing:-.012em; }
.hero__strap .code{ letter-spacing:.16em; }
.hero__grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(14px,1.6vw,24px);
  padding-block:clamp(20px,2.6vw,36px); }
@media (max-width:760px){
  .hero__media{ aspect-ratio:4/3; }
}

/* Aloldali fejléc */
.phero{ padding-top:calc(var(--nav-h) + clamp(26px,3.6vw,54px)); padding-bottom:clamp(20px,2.6vw,34px);
  border-bottom:1px solid var(--line); background:var(--paper); }
.phero__grid{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:clamp(20px,3vw,52px); align-items:end; }
.phero h1{ margin-block:10px 12px; }
@media (max-width:900px){ .phero__grid{ grid-template-columns:1fr; } }
.breadcrumb{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-family:var(--font-sans);
  font-size:var(--fs-micro); letter-spacing:.13em; text-transform:uppercase; color:var(--grey-2);  font-weight:600;}
.breadcrumb li:not(:last-child)::after{ content:"/"; margin-left:6px; }
.breadcrumb a:hover{ color:var(--ink); }

/* ---------- 6. MÉDIA / KÁRTYÁK ------------------------------------------ */
.media{ position:relative; overflow:hidden; background:var(--panel-2); }
.media--16{ aspect-ratio:16/10; } .media--43{ aspect-ratio:4/3; } .media--11{ aspect-ratio:1/1; }
.media svg,.media img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
a:hover > .media svg,a:hover .media svg{ transform:scale(1.03); }

/* Erased Tapes kártya: kód · cím · alcím · apró gombok + bélyegkép */
.rel{ display:grid; grid-template-columns:minmax(0,1fr) 92px; gap:14px; align-items:start;
  background:var(--panel); padding:14px; }
.rel__code{ display:block; margin-bottom:5px;  font-weight:600;}
.rel h3{ font-size:var(--fs-sm); font-weight:700; }
.rel p{ font-size:var(--fs-sm); color:var(--fg-2); }
.rel__fmt{ margin-top:8px; }
.rel__btns{ display:flex; gap:5px; margin-top:10px; }
.rel .media{ width:92px; height:92px; }
a.rel:hover h3{ text-decoration:underline; text-underline-offset:3px; }

/* Egyszerű szöveges kártya */
.card{ display:grid; gap:8px; align-content:start; background:var(--panel); padding:clamp(14px,1.6vw,20px); }
.card--plain{ background:transparent; padding:0; border-top:1px solid var(--line); padding-top:14px; }
.card h3{ font-size:var(--fs-body); font-weight:700; }
.card p{ font-size:var(--fs-sm); color:var(--fg-2); }
a.card:hover h3{ text-decoration:underline; text-underline-offset:3px; }
.card__n{ font-family:var(--font-sans); font-size:var(--fs-micro); letter-spacing:.13em; color:var(--grey-2);  font-weight:600;}

/* Hajszálvonalas listasor (szolgáltatások) */
.srow{ display:grid; grid-template-columns:52px minmax(0,1fr) auto; gap:clamp(12px,2vw,28px);
  align-items:baseline; padding:16px 0; border-top:1px solid var(--line); }
.srow:last-child{ border-bottom:1px solid var(--line); }
.srow__n{ font-family:var(--font-sans); font-size:var(--fs-micro); letter-spacing:.13em; color:var(--grey-2);  font-weight:600;}
.srow__body{ display:grid; gap:5px; }
.srow h3{ font-size:var(--fs-body); font-weight:700; }
.srow:hover h3{ text-decoration:underline; text-underline-offset:3px; }
.srow__meta{ display:flex; flex-wrap:wrap; gap:5px; margin-top:3px; }
@media (max-width:700px){
  .srow{ grid-template-columns:36px minmax(0,1fr); }
  .srow__cta{ grid-column:2; justify-self:start; margin-top:6px; }
}

/* Táblázat koncertnaptár az Erased Tapes „Upcoming shows” mintájára */
.dtable{ font-size:var(--fs-sm); }
.dtable th{ text-align:left; font-family:var(--font-sans); font-size:var(--fs-micro); font-weight:400;
  letter-spacing:.13em; text-transform:uppercase; color:var(--grey-2);
  padding:0 14px 8px 0; border-bottom:1px solid var(--line); }
.dtable td{ padding:11px 14px 11px 0; border-bottom:1px solid var(--line); vertical-align:top; }
.dtable tr:hover td{ background:var(--panel); }
.dtable td:last-child,.dtable th:last-child{ padding-right:0; }
.dtable .nowrap{ white-space:nowrap; }
@media (max-width:760px){
  .dtable thead{ display:none; }
  .dtable tr{ display:grid; grid-template-columns:1fr; gap:3px; padding:14px 0; border-bottom:1px solid var(--line); }
  .dtable td{ padding:0; border:0; }
  .dtable td[data-l]::before{ content:attr(data-l) " "; font-family:var(--font-sans); font-size:var(--fs-micro);
    letter-spacing:.12em; text-transform:uppercase; color:var(--grey-2); }
}

/* Idézet / vélemény Erased Tapes about-oldal hasábos idézetei */
.quote{ display:grid; gap:10px; break-inside:avoid; margin-bottom:22px; }
.quote p{ font-size:var(--fs-sm); font-style:italic; line-height:1.5; }
.quote figcaption{ font-size:var(--fs-sm); color:var(--fg-2); padding-top:10px;
  border-top:1px solid var(--line); }
.quote figcaption strong{ font-weight:600; font-style:normal; color:var(--fg); }
.masonry{ columns:3; column-gap:clamp(20px,3vw,44px); }
@media (max-width:1000px){ .masonry{ columns:2; } }
@media (max-width:620px){ .masonry{ columns:1; } }

/* Ügyfélkör-rács */
.refstrip{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.refstrip div{ background:var(--bg); padding:16px 14px; font-family:var(--font-sans);
  font-size:var(--fs-micro); letter-spacing:.11em; text-transform:uppercase; color:var(--fg-2); }

/* Harmonika */
.acc{ border-top:1px solid var(--line); max-width:var(--maxw-text); }
.acc__item{ border-bottom:1px solid var(--line); }
.acc__btn{ width:100%; background:none; border:0; cursor:pointer; text-align:left;
  padding:14px 34px 14px 0; position:relative; font-size:var(--fs-body); font-weight:600; }
.acc__btn:hover{ text-decoration:underline; text-underline-offset:3px; }
.acc__btn::before,.acc__btn::after{ content:""; position:absolute; right:4px; top:50%; background:currentColor; }
.acc__btn::before{ width:11px; height:1px; translate:0 -50%; }
.acc__btn::after{ width:1px; height:11px; right:9px; translate:0 -50%; transition:.2s var(--ease); }
.acc__btn[aria-expanded="true"]::after{ opacity:0; }
.acc__panel{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .28s var(--ease); }
.acc__panel > div{ overflow:hidden; }
.acc__item.is-open .acc__panel{ grid-template-rows:1fr; }
.acc__panel p{ padding-bottom:16px; color:var(--fg-2); font-size:var(--fs-sm); }

/* ---------- 7. ŰRLAPOK (lapos, hajszálvonalas) -------------------------- */
.field{ display:grid; gap:5px; }
.field > label,.legend{ font-family:var(--font-sans); font-size:var(--fs-micro); letter-spacing:.13em;
  text-transform:uppercase; color:var(--fg-2);  font-weight:600;}
.field:has([required]) > label::after,.check:has([required]) > span::after{ content:" *"; color:var(--fg); }
.field .hint{ font-size:var(--fs-meta); color:var(--fg-3); }
.input,.select,.textarea{
  width:100%; background:#fff; color:var(--fg); border:1px solid var(--rule);
  padding:10px 12px; font-size:var(--fs-sm); line-height:1.4; border-radius:var(--r);
  appearance:none; -webkit-appearance:none; transition:border-color .15s var(--ease);
}
.textarea{ min-height:120px; resize:vertical; font-family:inherit; }
.input::placeholder,.textarea::placeholder{ color:var(--fg-3); }
.input:hover,.select:hover,.textarea:hover{ border-color:var(--grey-2); }
.input:focus,.select:focus,.textarea:focus{ outline:0; border-color:var(--ink); }
.select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' fill='none' stroke='%236C6A66' stroke-width='1.3'%3E%3Cpath d='M1 1l4.5 4.5L10 1'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 11px center; padding-right:30px; cursor:pointer;
}
input[type="date"]{ cursor:pointer; }
.field.has-error .input,.field.has-error .select,.field.has-error .textarea{
  border-color:var(--ink); background:var(--panel); }
.field .err{ font-size:var(--fs-meta); color:var(--ink); font-weight:600; display:none; }
.field.has-error .err{ display:block; }

/* Választócsempék: a keretek egymásra csúsznak, így sehol nincs dupla vonal,
   és a kijelölt állapot a teljes csempét kitölti. */
.choices{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:0; }
.choice{ position:relative; display:grid; background:#fff; border:1px solid var(--rule);
  margin:0 -1px -1px 0; transition:background-color .15s var(--ease), border-color .15s var(--ease); }
.choice input{ position:absolute; opacity:0; inset:0; cursor:pointer; }
.choice span{ display:grid; gap:2px; align-content:start; height:100%; padding:10px 12px; cursor:pointer;
  font-size:var(--fs-sm); font-weight:500; }
.choice span small{ font-size:var(--fs-micro); letter-spacing:.11em; font-weight:600;
  color:var(--fg-3); text-transform:uppercase; }
.choice:hover{ background:var(--panel); z-index:1; }
.choice:has(input:checked){ background:var(--ink); border-color:var(--ink); color:var(--paper); z-index:2; }
.choice:has(input:checked) small{ color:rgba(251,250,248,.62); }
.choice:has(input:focus-visible){ outline:2px solid var(--fg); outline-offset:-2px; z-index:3; }
/* Tartalék :has() nélküli böngészőkre */
.choice input:checked + span{ background:var(--ink); color:var(--paper); }
.choice input:checked + span small{ color:rgba(251,250,248,.62); }

.check{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:9px; align-items:start; cursor:pointer;
  font-size:var(--fs-meta); color:var(--fg-2); line-height:1.5; }
.check input{ appearance:none; -webkit-appearance:none; width:15px; height:15px; margin:2px 0 0;
  border:1px solid var(--rule); background:#fff; cursor:pointer; position:relative; }
.check input:checked{ background:var(--ink); border-color:var(--ink); }
.check input:checked::after{ content:""; position:absolute; left:4.5px; top:1.5px; width:4px; height:8px;
  border:solid #fff; border-width:0 1.4px 1.4px 0; transform:rotate(45deg); }
.check a{ text-decoration:underline; text-underline-offset:2px; }
.check.has-error input{ border-color:var(--ink); background:var(--panel-2); }

/* Gyors ajánlatkérő sáv (lector.hu logika, lapos kivitelben) */
.qbar{ background:var(--panel); border:1px solid var(--rule); padding:clamp(14px,1.8vw,22px); }
.qbar__head{ display:flex; flex-wrap:wrap; gap:6px 16px; align-items:baseline; justify-content:space-between;
  margin-bottom:14px; }
.qbar__grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)) auto; gap:10px; align-items:end; }
.qbar__grid .btn{ height:39px; }
@media (max-width:1000px){ .qbar__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } .qbar__grid .btn{ grid-column:1/-1; } }
@media (max-width:520px){ .qbar__grid{ grid-template-columns:1fr; } }

/* Sávos ajánlatkérő űrlap */
.qform{ border:1px solid var(--rule); background:#fff; }
.qband{ padding:clamp(16px,2vw,26px); border-bottom:1px solid var(--rule); display:grid; gap:14px; }
.qband:last-of-type{ border-bottom:0; }
.qband__head{ display:flex; align-items:baseline; gap:12px; }
.qband__n{ font-family:var(--font-sans); font-size:var(--fs-micro); letter-spacing:.14em; color:var(--grey-2);  font-weight:600;}
.qband__head h3{ font-size:var(--fs-body); font-weight:700; }
.qgrid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.qgrid .full{ grid-column:1/-1; }
@media (max-width:700px){ .qgrid{ grid-template-columns:1fr; } }
.swap{ display:grid; grid-template-columns:1fr auto 1fr; gap:10px; align-items:end; }
.swap__btn{ width:32px; height:32px; margin-bottom:3px; border:1px solid var(--rule); background:#fff;
  cursor:pointer; display:grid; place-items:center; transition:.18s var(--ease); }
.swap__btn:hover{ border-color:var(--ink); background:var(--ink); color:var(--paper); }
@media (max-width:700px){ .swap{ grid-template-columns:1fr; } .swap__btn{ justify-self:start; rotate:90deg; } }

.drop{ border:1px dashed var(--grey-2); padding:clamp(16px,2.4vw,28px); display:grid; place-items:center;
  gap:6px; text-align:center; cursor:pointer; transition:.15s var(--ease); background:var(--panel); }
.drop:hover,.drop.is-over{ border-color:var(--ink); background:var(--panel-2); }
.drop input[type="file"]{ position:absolute; width:1px; height:1px; opacity:0; }
.drop strong{ font-size:var(--fs-sm); font-weight:600; }
.drop small{ font-size:var(--fs-meta); color:var(--fg-3); }
.filelist{ display:grid; gap:1px; }
.fileitem{ display:grid; grid-template-columns:auto minmax(0,1fr) auto auto; gap:10px; align-items:center;
  padding:8px 10px; border:1px solid var(--rule); font-size:var(--fs-meta); background:#fff; }
.fileitem__name{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fileitem__size{ font-family:var(--font-sans); font-size:var(--fs-micro); color:var(--fg-3);  font-weight:600;}
.fileitem button{ background:none; border:0; cursor:pointer; color:var(--fg-3); padding:2px; line-height:0; }
.fileitem button:hover{ color:var(--ink); }

.summary{ border:1px solid var(--rule); background:var(--panel); }
.summary__head{ padding:12px 16px; border-bottom:1px solid var(--rule); }
.summary__body{ padding:12px 16px; display:grid; gap:7px; }
.summary__row{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; align-items:baseline; font-size:var(--fs-sm); }
.summary__row dt{ font-family:var(--font-sans); font-size:var(--fs-micro); letter-spacing:.12em;
  text-transform:uppercase; color:var(--fg-3);  font-weight:600;}
.summary__row dd{ margin:0; text-align:right; font-weight:500; }
.summary__foot{ padding:12px 16px; border-top:1px solid var(--rule); display:grid; gap:9px; }
.trustlist{ display:grid; gap:6px; }
.trustlist li{ display:grid; grid-template-columns:auto 1fr; gap:8px; font-size:var(--fs-sm);
  color:var(--fg-2); align-items:start; }
.trustlist svg{ margin-top:3px; flex:none; color:var(--ink); }

.formnote{ display:none; gap:10px; padding:12px 14px; font-size:var(--fs-sm);
  grid-template-columns:auto 1fr; align-items:start; border:1px solid var(--rule); }
.formnote.is-on{ display:grid; }
.formnote--ok{ border-color:var(--ink); background:var(--panel); }
.formnote--err{ border-color:var(--ink); border-width:2px; }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* ---------- 8. BLOG / GALÉRIA / BEÁGYAZÁS ------------------------------- */
.post{ display:grid; gap:10px; align-content:start; }
.post__meta{ display:flex; flex-wrap:wrap; gap:5px 12px; align-items:center; font-family:var(--font-sans);
  font-size:var(--fs-micro); letter-spacing:.12em; text-transform:uppercase; color:var(--grey-2);  font-weight:600;}
.post h3{ font-size:var(--fs-body); font-weight:700; letter-spacing:-.015em; }
.post:hover h3{ text-decoration:underline; text-underline-offset:3px; }
.post p{ font-size:var(--fs-sm); color:var(--fg-2); }
.post--row{ grid-template-columns:170px minmax(0,1fr); gap:20px; align-items:start;
  padding:20px 0; border-top:1px solid var(--line); }
.post--row:last-child{ border-bottom:1px solid var(--line); }
@media (max-width:620px){ .post--row{ grid-template-columns:1fr; } }

.gallery{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(8px,1vw,14px); }
.gitem{ position:relative; overflow:hidden; background:var(--panel-2); cursor:zoom-in;
  grid-column:span 4; aspect-ratio:4/3; border:0; padding:0; display:block; }
.gitem:nth-child(7n+1),.gitem:nth-child(7n+4){ grid-column:span 6; aspect-ratio:16/10; }
.gitem svg,.gitem img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.gitem:hover svg,.gitem:hover img{ transform:scale(1.03); }
.gitem__cap{ position:absolute; inset:auto 0 0 0; padding:24px 10px 8px; text-align:left; color:#F2F1EE;
  background:linear-gradient(transparent, rgba(17,17,19,.8)); font-family:var(--font-sans);
  font-size:var(--fs-micro); letter-spacing:.12em; text-transform:uppercase;  font-weight:600;}
.gitem.is-hidden{ display:none; }
@media (max-width:820px){ .gitem,.gitem:nth-child(7n+1),.gitem:nth-child(7n+4){ grid-column:span 6; aspect-ratio:4/3; } }
@media (max-width:520px){ .gitem,.gitem:nth-child(7n+1),.gitem:nth-child(7n+4){ grid-column:span 12; } }

.lightbox{ position:fixed; inset:0; z-index:1200; background:rgba(17,17,19,.96); display:grid; place-items:center;
  padding:clamp(14px,4vw,44px); opacity:0; visibility:hidden; transition:.2s var(--ease); }
.lightbox.is-open{ opacity:1; visibility:visible; }
.lightbox__inner{ max-width:1100px; width:100%; display:grid; gap:10px; }
.lightbox__art{ display:grid; }
.lightbox__art img,.lightbox__art svg{ width:100%; height:auto; max-height:80vh;
  object-fit:contain; display:block; }
.lightbox__cap{ color:#F2F1EE; font-family:var(--font-sans); font-size:var(--fs-meta);
  letter-spacing:.12em; text-transform:uppercase;  font-weight:600;}
.lightbox__close{ position:absolute; top:16px; right:18px; width:34px; height:34px;
  border:1px solid rgba(242,241,238,.3); background:transparent; color:#F2F1EE; cursor:pointer;
  display:grid; place-items:center; }
.lightbox__close:hover{ background:#F2F1EE; color:var(--ink); }

.calendly-embed{ display:block; width:100%; min-width:320px; height:700px; border:1px solid var(--rule); }
.embed-fallback{ border:1px dashed var(--grey-2); padding:clamp(22px,4vw,44px); display:grid; gap:12px;
  place-items:center; text-align:center; background:var(--panel); }

/* Elvek listája */
.tl__item{ display:grid; grid-template-columns:120px minmax(0,1fr); gap:clamp(14px,2.4vw,34px);
  padding:16px 0; border-top:1px solid var(--line); }
.tl__item:last-child{ border-bottom:1px solid var(--line); }
.tl__year{ font-family:var(--font-sans); font-size:var(--fs-micro); letter-spacing:.13em; color:var(--grey-2); padding-top:2px;  font-weight:600;}
.tl__body{ display:grid; gap:4px; }
.tl__body p{ font-size:var(--fs-sm); color:var(--fg-2); }
@media (max-width:620px){ .tl__item{ grid-template-columns:1fr; gap:5px; } }

/* Statisztikasáv */
.stats{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--line);
  border-block:1px solid var(--line); }
.stat{ background:var(--bg); padding:16px 14px; display:grid; gap:3px; }
.stat__n{ font-family:var(--font-wm); font-size:clamp(24px,3vw,38px); line-height:1; letter-spacing:-.01em; }
.stat__l{ font-family:var(--font-sans); font-size:var(--fs-micro); letter-spacing:.12em;
  text-transform:uppercase; color:var(--fg-3);  font-weight:600;}
@media (max-width:700px){ .stats{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* ---------- 9. LÁBLÉC ---------------------------------------------------- */
.footer{ background:var(--paper); border-top:1px solid var(--line); }
.footer__cta{ padding-block:clamp(30px,4vw,56px); border-bottom:1px solid var(--line); display:grid; gap:16px; }
.footer__cta h2{ max-width:22ch; }
.footer__grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(18px,2.4vw,40px);
  padding-block:clamp(26px,3.4vw,48px); }
@media (max-width:820px){ .footer__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:520px){ .footer__grid{ grid-template-columns:1fr; } }
.footer h4{ font-size:var(--fs-sm); font-weight:700; margin-bottom:10px; }
.footer__links{ display:grid; gap:5px; }
.footer__links a,.footer__links span{ font-size:var(--fs-sm); color:var(--fg-2); }
.footer__links a:hover{ color:var(--ink); text-decoration:underline; text-underline-offset:2px; }
.footer__bar{ background:var(--ink-bar); color:rgba(242,241,238,.6); }
.footer__bar .wrap{ display:flex; flex-wrap:wrap; gap:8px 18px; justify-content:space-between;
  align-items:center; padding-block:11px; font-size:var(--fs-meta); }
.footer__bar a:hover{ color:#fff; text-decoration:underline; text-underline-offset:2px; }
.socials{ display:flex; gap:12px; }
.socials a{ font-size:var(--fs-sm); color:var(--fg-2); text-decoration:underline; text-underline-offset:2px; }
.socials a:hover{ color:var(--ink); }
/* Demján Sándor Program támogatói sáv, közvetlenül a lábléc után */
.support{ background:#e5e5e5; }
.support img{ display:block; width:100%; max-width:var(--maxw); margin-inline:auto; height:auto; }

/* ---------- 10. SEGÉD / MOZGÁS ------------------------------------------ */
.toast{ position:fixed; left:50%; translate:-50% 0; bottom:22px; z-index:1300; background:var(--ink);
  color:var(--paper); padding:10px 16px; font-size:var(--fs-sm); opacity:0; visibility:hidden;
  transition:.2s var(--ease); }
.toast.is-on{ opacity:1; visibility:visible; }
.progress{ position:fixed; top:0; left:0; height:2px; background:var(--ink); z-index:1001; width:0; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.nowrap{ white-space:nowrap; }
.mt-2{ margin-top:8px } .mt-3{ margin-top:12px } .mt-4{ margin-top:18px }
.mt-5{ margin-top:26px } .mt-6{ margin-top:36px } .mb-4{ margin-bottom:18px } .mb-5{ margin-bottom:26px }
.text-center{ text-align:center } .justify-center{ justify-content:center } .full-w{ width:100% }

/* A referenciák statikusak: csak egy nagyon visszafogott belépő marad */
.reveal{ opacity:0; transform:translateY(8px); transition:opacity .35s var(--ease), transform .35s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; transition-duration:.01ms !important;
    scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; }
}
@media print{
  .nav,.footer__cta,.drawer,.progress{ display:none !important; }
  body{ background:#fff; color:#000; }
  .section{ padding-block:14px; }
}

/* ==========================================================================
   11. KOMPATIBILITÁSI RÉTEG
   A sablonokban öröklődő osztálynevek v2 (lapos, monokróm) kivitelben.
   ========================================================================== */
.grid{ gap:clamp(14px,1.6vw,22px); }
.grid--hair{ gap:1px; background:var(--line); }
[data-theme="panel"] .card,[data-theme="panel"] .qbar{ background:#fff; }

.section-head{ display:grid; gap:8px; margin-bottom:22px; max-width:var(--maxw-text); }
.section-head--split{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between;
  gap:10px 20px; max-width:none; }
.section-head--split .stack-sm{ max-width:var(--maxw-text); }
.stack-sm{ display:grid; gap:6px; }
.body-lg{ font-size:var(--fs-lead); }
.mega{ font-family:var(--font-wm); font-size:var(--fs-wm); line-height:.86; letter-spacing:-.015em; }
.rule{ display:flex; align-items:center; gap:16px; padding-block:14px; border-top:1px solid var(--line); }
.kicker--plain::before{ display:none; }
.split--sticky > :first-child{ position:sticky; top:calc(var(--nav-h) + 22px); }
@media (max-width:900px){ .split--sticky > :first-child{ position:static; } }

.steps{ counter-reset:step; }
.card--num{ counter-increment:step; }
.card--num::before{ content:counter(step,decimal-leading-zero); font-family:var(--font-sans);
  font-size:var(--fs-micro); letter-spacing:.13em; color:var(--grey-2); }
.card--link:hover{ background:var(--panel-2); }
.card__icon{ display:none; }
.card__foot{ margin-top:6px; padding-top:10px; border-top:1px solid var(--line);
  display:flex; justify-content:space-between; gap:10px; align-items:center; }


.post__thumb{ overflow:hidden; background:var(--panel-2); aspect-ratio:16/10; }
.post__thumb svg{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.post:hover .post__thumb svg{ transform:scale(1.03); }

.marquee,.footer__word,.hero__scroll{ display:none; }

.pillar-band{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px;
  background:var(--line); border-block:1px solid var(--line); }
@media (max-width:860px){ .pillar-band{ grid-template-columns:1fr; } }
.pillar{ background:var(--bg); padding:clamp(18px,2.2vw,30px); display:grid; gap:9px; align-content:start;
  transition:background-color .18s var(--ease); }
.pillar:hover{ background:var(--panel); }
.pillar__num{ font-family:var(--font-sans); font-size:var(--fs-micro); letter-spacing:.14em; color:var(--grey-2);  font-weight:600;}
.pillar h3{ font-size:var(--fs-h2); font-weight:700; letter-spacing:-.02em; }
.pillar > p{ font-size:var(--fs-sm); color:var(--fg-2); }
.pillar__list{ display:grid; gap:3px; margin-top:4px; }
.pillar__list li{ font-size:var(--fs-sm); color:var(--fg-2); padding-left:14px; position:relative; }
.pillar__list li::before{ content:""; position:absolute; left:0; top:.6em; width:5px; height:5px;
  background:var(--grey-2); }
.pillar__art{ display:none; }
.pillar .link-arrow{ margin-top:8px; }

.drop__icon{ color:var(--fg-2); }
.mt-7{ margin-top:44px } .mb-6{ margin-bottom:36px }