/* =====================================================================
   DÚROS — magyar népzenei zenekar
   Dizájnrendszer + látványstílusok
   ===================================================================== */

/* ---------- Tokenek ---------- */
:root{
  --ink:        #0c0b0a;   /* meleg, mély háttér */
  --ink-2:      #15120f;   /* panel */
  --ink-3:      #1e1a16;   /* kiemelt panel */
  --paper:      #f3ebdd;   /* meleg krém szöveg */
  --paper-dim:  #b3a895;   /* tompított krém */
  --paper-faint:#6b6256;   /* halvány */

  --red:    #c8403f;   /* paprika */
  --blue:   #3b6fc4;   /* kékfestő */
  --gold:   #d8a126;   /* búza-arany */
  --green:  #4fa860;
  --purple: #9a55b8;

  --accent: var(--gold);

  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body: 'Space Grotesk', system-ui, -apple-system, sans-serif;

  --pad: clamp(1.25rem, 5vw, 6rem);
  --maxw: 1680px;

  --e-out: cubic-bezier(0.16, 1, 0.3, 1);
  --e-inout: cubic-bezier(0.76, 0, 0.24, 1);

  --line: rgba(243,235,221,0.14);
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; }
html.lenis,html.lenis body{ height:auto; }
.lenis.lenis-smooth{ scroll-behavior:auto !important; }
.lenis.lenis-stopped{ overflow:hidden; }

body{
  background:var(--ink);
  color:var(--paper);
  font-family:var(--font-body);
  font-weight:400;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
  cursor:auto;
}
.js-ready body{ cursor:none; }
@media (hover:none){ .js-ready body{ cursor:auto; } }

img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font:inherit; color:inherit; background:none; border:none; cursor:none; }
::selection{ background:var(--red); color:var(--paper); }

h1,h2,h3,blockquote{ font-family:var(--font-display); font-weight:500; line-height:0.95; letter-spacing:-0.02em; }
em{ font-style:italic; }

/* ---------- Szemcse / grain ---------- */
.grain{
  position:fixed; inset:-50%; z-index:9000; pointer-events:none;
  opacity:0.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 0.6s steps(2) infinite;
}
@keyframes grain{
  0%{transform:translate(0,0)} 25%{transform:translate(-3%,2%)}
  50%{transform:translate(2%,-3%)} 75%{transform:translate(-2%,-2%)} 100%{transform:translate(2%,3%)}
}

/* ---------- Scroll-haladás ---------- */
.scroll-progress{
  position:fixed; top:0; left:0; right:0; height:3px; z-index:8000; pointer-events:none;
  background:rgba(243,235,221,0.08);
}
.scroll-progress span{
  display:block; height:100%; width:100%; transform:scaleX(0); transform-origin:0 50%;
  background:linear-gradient(90deg,var(--red),var(--gold),var(--green),var(--blue));
}

/* ---------- Egyedi kurzor ---------- */
.cursor{ display:none; position:fixed; top:0; left:0; z-index:9500; pointer-events:none; mix-blend-mode:difference; }
.js-ready .cursor{ display:block; }
.cursor__dot{
  position:fixed; top:0; left:0; width:7px; height:7px; border-radius:50%;
  background:var(--paper);
}
.cursor__ring{
  position:fixed; top:0; left:0; width:40px; height:40px; border-radius:50%;
  border:1px solid var(--paper); display:flex; align-items:center; justify-content:center;
  transition:width 0.4s var(--e-out), height 0.4s var(--e-out), background 0.4s ease;
}
.cursor.is-hover .cursor__ring{ width:74px; height:74px; background:rgba(243,235,221,0.08); }
.cursor.is-lap .cursor__ring{ width:96px; height:96px; }
.cursor.is-lap .cursor__ring::after{
  content:"nézd"; font-size:10px; letter-spacing:0.12em; text-transform:uppercase; color:var(--paper);
}
@media (hover:none){ .cursor, .js-ready .cursor{ display:none; } }

/* =====================================================================
   PRELOADER
   ===================================================================== */
.preloader{ display:none; }
.js-ready .preloader{
  position:fixed; inset:0; z-index:9999; display:flex;
  flex-direction:column; align-items:center; justify-content:center; gap:1.5rem;
  background:var(--ink);
}
.preloader__motif{ color:var(--gold); }
.preloader__tulip{ width:54px; height:64px; opacity:0; transform:translateY(20px) rotate(-8deg); }
.preloader__word{ display:flex; gap:0.02em; font-family:var(--font-display); font-weight:600;
  font-size:clamp(3rem,12vw,9rem); line-height:1; letter-spacing:0.02em; color:var(--paper); overflow:hidden; padding-block:0.1em; margin-block:-0.1em; }
.preloader__word span{ display:inline-block;  opacity:0; }
.preloader__count{ font-family:var(--font-display); font-size:clamp(2rem,7vw,4rem); color:var(--paper); }
.preloader__count i{ font-style:normal; color:var(--accent); font-size:0.5em; vertical-align:super; }
.preloader__bar{ width:min(280px,60vw); height:2px; background:rgba(243,235,221,0.15); overflow:hidden; }
.preloader__bar span{ display:block; height:100%; width:100%; transform:scaleX(0); transform-origin:0 50%;
  background:linear-gradient(90deg,var(--red),var(--gold)); }
.preloader.is-done{ pointer-events:none; }

/* =====================================================================
   NAV
   ===================================================================== */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:7000;
  display:flex; align-items:center; justify-content:space-between;
  padding:1.4rem var(--pad); mix-blend-mode:difference;
}
.nav__brand{ display:flex; align-items:center; gap:0.6rem; font-family:var(--font-display);
  font-size:1.5rem; font-weight:600; letter-spacing:0.01em; }
.nav__mark{ width:26px; height:26px; color:var(--paper); animation:spin 24s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }
.nav__links{ display:flex; align-items:center; gap:2rem; font-size:0.92rem; }
.nav__links a{ position:relative; padding:0.3rem 0; letter-spacing:0.01em; }
.nav__links a:not(.nav__cta)::after{
  content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:currentColor;
  transform:scaleX(0); transform-origin:0 50%; transition:transform 0.5s var(--e-out);
}
.nav__links a:not(.nav__cta):hover::after{ transform:scaleX(1); }
.nav__cta{ border:1px solid currentColor; border-radius:100px; padding:0.5rem 1.2rem !important; }
.nav__burger{ display:none; }

/* mobil menü */
.menu{ position:fixed; inset:0; z-index:6900; background:var(--ink-2);
  display:flex; flex-direction:column; justify-content:center; padding:var(--pad);
  clip-path:inset(0 0 100% 0); transition:clip-path 0.8s var(--e-inout); }
.menu.is-open{ clip-path:inset(0 0 0% 0); }
.menu__links{ display:flex; flex-direction:column; gap:0.4rem; }
.menu__links a{ font-family:var(--font-display); font-size:clamp(2.2rem,11vw,4rem); display:flex; align-items:baseline; gap:1rem; color:var(--paper); }
.menu__links a i{ font-style:normal; font-family:var(--font-body); font-size:0.9rem; color:var(--accent); }
.menu__foot{ display:flex; gap:2rem; margin-top:3rem; color:var(--paper-dim); font-size:0.9rem; flex-wrap:wrap; }

/* =====================================================================
   HERO
   ===================================================================== */
.hero{ position:relative; min-height:100svh; display:flex; align-items:center;
  padding:0 var(--pad); overflow:hidden; }
.hero__field{ position:absolute; inset:0; pointer-events:none; }
.hero__field .float{ position:absolute; opacity:0.5; will-change:transform; }
.float.f1{ width:90px;  top:18%; left:8%;  color:var(--blue); }
.float.f2{ width:120px; top:62%; left:14%; color:var(--red); }
.float.f3{ width:150px; top:24%; right:10%; color:var(--gold); }
.float.f4{ width:80px;  top:70%; right:18%; color:var(--green); }
.float.f5{ width:64px;  top:44%; left:46%; color:var(--purple); opacity:0.35; }
.float.f6{ width:70px;  top:80%; left:60%; color:var(--gold); opacity:0.4; }

.hero__inner{ position:relative; z-index:2; width:100%; max-width:var(--maxw); margin:0 auto; }
.hero__eyebrow{ overflow:hidden; margin-bottom:1.2rem; }
.hero__eyebrow span{ display:inline-block; text-transform:uppercase; letter-spacing:0.35em;
  font-size:0.8rem; color:var(--paper-dim); }
.hero__title{ font-size:clamp(6rem,29vw,30rem); font-weight:600; line-height:1.04; letter-spacing:-0.04em; }
.hero__title .line{ display:block; overflow:hidden; padding-block:0.04em; }
.hero__title .word{ display:inline-block; will-change:transform; }
.hero__title .line:nth-child(2){ margin-top:-0.36em; padding-left:0.35em; color:transparent;
  -webkit-text-stroke:2.5px var(--paper); }
.hero__meta{ display:flex; justify-content:space-between; align-items:flex-end; gap:2rem;
  margin-top:2.5rem; flex-wrap:wrap; }
.hero__meta > p{ overflow:hidden; max-width:34ch; font-size:clamp(1rem,1.4vw,1.25rem); color:var(--paper-dim); }
.hero__meta > p span{ display:inline-block; }
.hero__scroll{ display:inline-flex; align-items:center; gap:0.7rem; text-transform:uppercase;
  letter-spacing:0.2em; font-size:0.8rem; color:var(--paper); }
.hero__scroll-dot{ width:34px; height:34px; border:1px solid var(--line); border-radius:50%; position:relative; }
.hero__scroll-dot::after{ content:""; position:absolute; left:50%; top:8px; width:2px; height:8px;
  background:var(--accent); transform:translateX(-50%); animation:scrolldot 1.6s var(--e-inout) infinite; }
@keyframes scrolldot{ 0%{opacity:0; transform:translate(-50%,-6px)} 40%{opacity:1} 100%{opacity:0; transform:translate(-50%,12px)} }

.hero__corner{ position:absolute; z-index:2; font-size:0.78rem; letter-spacing:0.15em;
  text-transform:uppercase; color:var(--paper-faint); }
.hero__corner.tl{ top:6.5rem; left:var(--pad); }
.hero__corner.tr{ top:6.5rem; right:var(--pad); text-align:right; }

/* =====================================================================
   MARQUEE
   ===================================================================== */
.marquee{ border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  padding:1.4rem 0; overflow:hidden; white-space:nowrap; background:var(--ink-2); }
.marquee__track{ display:inline-flex; align-items:center; gap:2.5rem; will-change:transform; }
.marquee__track span{ font-family:var(--font-display); font-size:clamp(1.6rem,4vw,3rem);
  font-weight:500; letter-spacing:0.01em; }
.marquee__track b{ color:var(--accent); font-size:1.2rem; }

/* =====================================================================
   SZEKCIÓ-CÍMKÉK + REVEAL
   ===================================================================== */
.section-label{ overflow:hidden; text-transform:uppercase; letter-spacing:0.25em;
  font-size:0.78rem; color:var(--paper-faint); margin-bottom:2rem; }
.section-label span{ display:inline-block; }

/* progresszív enhancement — csak JS mellett rejtünk */
/* Maszkolt szöveg-reveal: a span a maszk (overflow), a belső .reveal-in mozog.
   Alapállapot LÁTHATÓ (fail-safe) — a JS from-mal animál. */
[data-reveal] > span{ display:inline-block; overflow:hidden; padding-block:0.12em; margin-block:-0.12em; vertical-align:top; }
.reveal-in{ display:inline-block; will-change:transform; }


/* =====================================================================
   MANIFESZTÓ — szavankénti highlight
   ===================================================================== */
.manifeszto{ max-width:var(--maxw); margin:0 auto; padding:clamp(7rem,16vw,16rem) var(--pad) clamp(3rem,6vw,5rem); }
.manifeszto__text{ font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.8rem,4.6vw,4.6rem); line-height:1.12; letter-spacing:-0.015em; max-width:20ch; }
.manifeszto__text .w{ color:rgba(243,235,221,0.16); transition:color 0.25s ease; }

/* =====================================================================
   RÓLUNK
   ===================================================================== */
.about{ max-width:var(--maxw); margin:0 auto; padding:clamp(2rem,5vw,5rem) var(--pad) clamp(4rem,9vw,8rem);
  display:grid; grid-template-columns:0.85fr 1fr; gap:clamp(2rem,6vw,6rem); align-items:center; }
@media (min-width:761px){ .about{ min-height:100svh; } }
.about__visual{ position:relative; will-change:transform, clip-path; }
.about__card{ position:relative; aspect-ratio:3/4; border-radius:6px; overflow:hidden;
  background:linear-gradient(160deg,var(--ink-3),var(--ink-2));
  border:1px solid var(--line); display:flex; align-items:center; justify-content:center; }
.about__motif{ width:46%; color:var(--gold); position:relative; z-index:2; filter:drop-shadow(0 10px 30px rgba(0,0,0,0.4)); }
.about__pattern{ position:absolute; inset:0; opacity:0.16;
  background-image:radial-gradient(circle at 1px 1px, var(--paper) 1px, transparent 0);
  background-size:22px 22px; }
.about__tag{ position:absolute; bottom:1rem; left:1rem; z-index:3; font-size:0.78rem;
  text-transform:uppercase; letter-spacing:0.2em; color:var(--paper-dim); }
.about__body h3{ font-size:clamp(2rem,4.5vw,3.6rem); margin-bottom:2rem; }
.about__body h3 span{ display:inline-block; overflow:hidden; }
.about__p{ display:flex; flex-direction:column; gap:1.2rem; max-width:46ch;
  color:var(--paper-dim); font-size:1.05rem; }
.about__p p{ overflow:hidden; }
.about__stats{ display:flex; gap:clamp(1.5rem,4vw,3.5rem); margin-top:3rem; flex-wrap:wrap; }
.stat{ display:flex; flex-direction:column; }
.stat__num{ font-family:var(--font-display); font-size:clamp(2.6rem,6vw,4.4rem); line-height:1; color:var(--paper); }
.stat__plus{ display:none; }
.stat__label{ font-size:0.85rem; color:var(--paper-faint); text-transform:uppercase; letter-spacing:0.12em; margin-top:0.4rem; }

/* =====================================================================
   TÁJAK — horizontális scroll
   ===================================================================== */
.tajak{ background:var(--ink-2); }
.tajak__pin{ min-height:100svh; display:flex; flex-direction:column; justify-content:center;
  padding:clamp(4rem,8vw,7rem) 0; overflow:hidden; }
.tajak__head{ padding:0 var(--pad); max-width:var(--maxw); margin:0 auto 3rem; width:100%; }
.tajak__head h2{ font-size:clamp(2.6rem,8vw,7rem); }
.tajak__head h2 em{ color:var(--accent); }
.tajak__lead{ margin-top:1rem; color:var(--paper-dim); max-width:40ch; }
.tajak__track{ display:flex; gap:clamp(1rem,2.5vw,2.5rem); padding:0 var(--pad); will-change:transform; }
.taj{ position:relative; flex:0 0 auto; width:min(78vw,420px); aspect-ratio:3/3.4;
  border-radius:8px; padding:2.2rem; overflow:hidden; display:flex; flex-direction:column;
  justify-content:flex-end; gap:0.8rem;
  background:linear-gradient(165deg, color-mix(in srgb, var(--c) 30%, var(--ink-3)), var(--ink-3));
  border:1px solid var(--line); }
.taj::before{ content:""; position:absolute; inset:0; opacity:0.12;
  background-image:radial-gradient(circle at 1px 1px, var(--c2) 1.2px, transparent 0); background-size:20px 20px; }
.taj__idx{ position:absolute; top:1.4rem; left:2.2rem; font-family:var(--font-display);
  font-size:1.1rem; color:var(--paper-dim); }
.taj__motif{ position:absolute; top:1.2rem; right:1.2rem; width:30%; color:var(--c2);
  opacity:0.85; filter:drop-shadow(0 6px 18px rgba(0,0,0,0.4)); }
.taj h3{ position:relative; font-size:clamp(1.8rem,3vw,2.6rem); color:var(--paper); }
.taj p{ position:relative; color:var(--paper-dim); font-size:0.98rem; line-height:1.45; }
.taj__tag{ position:relative; align-self:flex-start; margin-top:0.4rem; font-size:0.72rem;
  text-transform:uppercase; letter-spacing:0.18em; color:var(--c2);
  border:1px solid color-mix(in srgb, var(--c2) 50%, transparent); border-radius:100px; padding:0.35rem 0.9rem; }

/* =====================================================================
   TAGOK
   ===================================================================== */
.tagok{ max-width:var(--maxw); margin:0 auto; padding:clamp(6rem,14vw,12rem) var(--pad); }
.tagok__head{ display:flex; flex-direction:column; margin-bottom:3rem; }
.tagok__head h2{ font-size:clamp(3rem,12vw,10rem); }
.tagok__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,2vw,1.6rem); perspective:1200px; }
.tag-card{ position:relative; border-top:1px solid var(--line); padding-top:1rem; will-change:transform, opacity; }
.tag-card__media{ position:relative; aspect-ratio:4/5; border-radius:6px; overflow:hidden;
  background:linear-gradient(160deg,var(--ink-3),var(--ink-2)); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; }
.tag-card__media::before{ content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 50% 120%, color-mix(in srgb,var(--c) 55%, transparent), transparent 60%);
  opacity:0; transition:opacity 0.6s var(--e-out); }
.tag-card__media svg{ width:48%; color:var(--paper-faint); transition:color 0.6s var(--e-out); z-index:2; will-change:transform; }
.tag-card:hover .tag-card__media::before{ opacity:1; }
.tag-card:hover .tag-card__media svg{ color:var(--paper); }
.tag-card__row{ display:flex; justify-content:space-between; align-items:baseline; gap:1rem; margin-top:1rem; }
.tag-card__row h3{ font-size:clamp(1.2rem,2vw,1.7rem); }
.tag-card__row span{ font-size:0.82rem; color:var(--paper-faint); text-align:right; text-transform:uppercase; letter-spacing:0.08em; }

/* =====================================================================
   IDÉZET
   ===================================================================== */
.quote{ position:relative; text-align:center; padding:clamp(6rem,14vw,12rem) var(--pad);
  background:var(--ink-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.quote__motif{ width:min(240px,60vw); height:auto; margin:0 auto 2.5rem; color:var(--accent); opacity:0.7; }
.quote blockquote{ font-size:clamp(1.8rem,5vw,4.4rem); line-height:1.1; max-width:18ch; margin:0 auto;
  font-style:italic; font-weight:400; }
.quote .w{ color:rgba(243,235,221,0.16); transition:color 0.25s ease; }
.quote cite{ display:block; overflow:hidden; margin-top:2rem; font-style:normal; }
.quote cite span{ display:inline-block; font-size:0.9rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--paper-faint); }

/* =====================================================================
   KONCERTEK — lista hover reveal
   ===================================================================== */
.koncertek{ max-width:var(--maxw); margin:0 auto; padding:clamp(6rem,14vw,12rem) var(--pad); }
.koncertek__head{ margin-bottom:2rem; }
.koncertek__head h2{ font-size:clamp(2.6rem,8vw,7rem); }
.koncertek__head h2 span{ display:inline-block; overflow:hidden; }
.gigs{ border-top:1px solid var(--line); }
.gig{ position:relative; display:grid; grid-template-columns:auto 1fr auto auto;
  align-items:center; gap:2rem; padding:clamp(1.4rem,3vw,2.4rem) 0.5rem;
  border-bottom:1px solid var(--line); overflow:hidden; transition:padding 0.5s var(--e-out); }
.gig__bg{ position:absolute; inset:0; z-index:0; transform:scaleY(0); transform-origin:50% 100%;
  background:linear-gradient(90deg, color-mix(in srgb,var(--red) 22%, transparent), transparent);
  transition:transform 0.5s var(--e-out); }
.gig > *:not(.gig__bg){ position:relative; z-index:1; }
.gig__date{ display:flex; flex-direction:column; align-items:center; min-width:64px;
  font-family:var(--font-display); }
.gig__date i{ font-style:normal; font-size:0.78rem; letter-spacing:0.15em; color:var(--accent); text-transform:uppercase; }
.gig__date b{ font-size:1.9rem; font-weight:500; line-height:1; }
.gig__name{ font-family:var(--font-display); font-size:clamp(1.4rem,3.4vw,2.8rem); transition:transform 0.5s var(--e-out); }
.gig__place{ color:var(--paper-dim); font-size:0.95rem; }
.gig__cta{ font-size:0.9rem; letter-spacing:0.05em; color:var(--paper); white-space:nowrap; opacity:0.5; transition:opacity 0.5s var(--e-out), transform 0.5s var(--e-out); }
.gig:hover{ padding-left:1.4rem; padding-right:1.4rem; }
.gig:hover .gig__bg{ transform:scaleY(1); }
.gig:hover .gig__name{ transform:translateX(0.5rem); }
.gig:hover .gig__cta{ opacity:1; transform:translateX(-0.3rem); }

/* =====================================================================
   GALÉRIA
   ===================================================================== */
.galeria{ max-width:var(--maxw); margin:0 auto; padding:clamp(2rem,4vw,4rem) var(--pad) clamp(6rem,14vw,12rem); }
.galeria__head{ position:relative; z-index:2; margin-bottom:3rem; }
.galeria__head h2{ font-size:clamp(3rem,12vw,10rem); }
.galeria__grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:clamp(1rem,2vw,1.6rem);
  grid-auto-rows:minmax(120px,auto); }
.gal{ position:relative; border-radius:8px; overflow:hidden; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(160deg, color-mix(in srgb,var(--c) 28%, var(--ink-3)), var(--ink-3));
  border:1px solid var(--line); will-change:transform; }
.gal::before{ content:""; position:absolute; inset:0; opacity:0.14;
  background-image:radial-gradient(circle at 1px 1px, var(--c2) 1.2px, transparent 0); background-size:20px 20px; }
.gal svg{ width:40%; color:var(--c2); position:relative; z-index:2; transition:transform 0.8s var(--e-out); filter:drop-shadow(0 8px 24px rgba(0,0,0,0.4)); }
.gal:hover svg{ transform:scale(1.15) rotate(-5deg); }
.gal figcaption{ position:absolute; bottom:1rem; left:1rem; z-index:3; font-size:0.8rem;
  letter-spacing:0.1em; text-transform:uppercase; color:var(--paper-dim); }
.g-a{ grid-column:span 3; grid-row:span 2; }
.g-b{ grid-column:span 3; grid-row:span 3; }
.g-c{ grid-column:span 2; grid-row:span 2; }
.g-d{ grid-column:span 4; grid-row:span 2; }
.g-e{ grid-column:span 2; grid-row:span 1; }

/* =====================================================================
   KAPCSOLAT
   ===================================================================== */
.kapcsolat{ position:relative; text-align:center; padding:clamp(7rem,16vw,15rem) var(--pad); overflow:hidden; }
.kapcsolat__field{ position:absolute; inset:0; pointer-events:none; }
.kapcsolat__field .float{ position:absolute; opacity:0.3; }
.float.k1{ width:120px; top:18%; left:12%; color:var(--gold); }
.float.k2{ width:90px; bottom:14%; right:14%; color:var(--red); }
.kapcsolat__big{ position:relative; font-size:clamp(2.8rem,10vw,8.5rem); line-height:0.95; }
.kapcsolat__lead{ position:relative; max-width:42ch; margin:1.5rem auto 0; color:var(--paper-dim);
  overflow:hidden; }
.kapcsolat__lead span{ display:inline-block; }
.magnet{ position:relative; display:inline-block; margin-top:3rem; padding:1.3rem 3rem;
  border:1px solid var(--paper); border-radius:100px; font-size:clamp(1rem,2vw,1.4rem);
  will-change:transform; }
.magnet__inner{ display:inline-block; will-change:transform; }
.magnet::after{ content:""; position:absolute; inset:0; border-radius:100px; background:var(--paper);
  transform:scale(0); transition:transform 0.5s var(--e-out); z-index:-1; }
.magnet:hover{ color:var(--ink); }
.magnet:hover::after{ transform:scale(1); }
.kapcsolat__socials{ position:relative; display:flex; justify-content:center; flex-wrap:wrap;
  gap:1.5rem 2.5rem; margin-top:3.5rem; }
.kapcsolat__socials a{ position:relative; font-size:0.95rem; letter-spacing:0.05em; color:var(--paper-dim); }
.kapcsolat__socials a::after{ content:""; position:absolute; left:0; bottom:-3px; width:100%; height:1px;
  background:var(--accent); transform:scaleX(0); transform-origin:0 50%; transition:transform 0.4s var(--e-out); }
.kapcsolat__socials a:hover{ color:var(--paper); }
.kapcsolat__socials a:hover::after{ transform:scaleX(1); }

/* =====================================================================
   FOOTER
   ===================================================================== */
.footer{ border-top:1px solid var(--line); padding:clamp(3rem,6vw,5rem) var(--pad) 2rem; overflow:hidden; }
.footer__big{ display:flex; justify-content:space-between; font-family:var(--font-display);
  font-weight:600; font-size:clamp(4rem,26vw,26rem); line-height:0.8; letter-spacing:-0.03em;
  color:transparent; -webkit-text-stroke:1px var(--paper-faint); }
.footer__row{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem;
  margin-top:2rem; font-size:0.85rem; color:var(--paper-faint); letter-spacing:0.05em; }
.footer__top{ color:var(--paper); }

/* =====================================================================
   RESZPONZÍV
   ===================================================================== */
@media (max-width:1024px){
  .about{ grid-template-columns:1fr; }
  .about__visual{ max-width:420px; }
  .tagok__grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:760px){
  .nav__links{ display:none; }
  .nav__burger{ display:flex; flex-direction:column; gap:6px; width:34px; height:34px;
    align-items:center; justify-content:center; mix-blend-mode:difference; }
  .nav__burger span{ display:block; width:26px; height:2px; background:var(--paper); transition:transform 0.4s var(--e-out),opacity 0.3s; }
  .nav__burger.is-open span:nth-child(1){ transform:translateY(4px) rotate(45deg); }
  .nav__burger.is-open span:nth-child(2){ transform:translateY(-4px) rotate(-45deg); }

  .hero__meta{ flex-direction:column; align-items:flex-start; }
  .hero__corner{ display:none; }

  .tagok__grid{ grid-template-columns:1fr 1fr; gap:1rem; }
  .tag-card__row{ flex-direction:column; gap:0.2rem; }
  .tag-card__row span{ text-align:left; }

  .gig{ grid-template-columns:auto 1fr; row-gap:0.4rem; }
  .gig__place{ grid-column:2; }
  .gig__cta{ display:none; }

  .galeria__grid{ grid-template-columns:repeat(2,1fr); }
  .g-a,.g-b,.g-c,.g-d,.g-e{ grid-column:span 1; grid-row:span 1; aspect-ratio:1; }
  .g-b{ grid-column:span 2; aspect-ratio:16/10; }

  .cursor{ display:none; }
}
@media (max-width:480px){
  .tagok__grid{ grid-template-columns:1fr; }
}

/* ---------- Mozgáscsökkentés ---------- */
@media (prefers-reduced-motion:reduce){
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; }
  .grain{ display:none; }
  .tajak__pin{ min-height:auto; }
  .tajak__track{ overflow-x:auto; padding-bottom:1.5rem; }
  .about{ min-height:auto !important; }
}