/* =========================================================
   GOLDENCUT — index3-2 override
   "Rólunk" szekció: a bal oldali KÉP helyett NAGY logó
   (a kétoszlopos elrendezés megmarad: logó balra, szöveg jobbra).
   ========================================================= */

/* =========================================================
   FIX: vízszintes túlcsordulás
   A "Görgessen" (.hero-scroll) középre igazítása ne a transformra
   épüljön (a reduced-motion a .reveal-eknél kinullázza a transformot,
   így a left:50% jobbra tolja → vízszintes scroll). Teljes szélességű,
   flexszel középre igazítva — transform-független.
   ========================================================= */
.bg-plant-scroll .hero-scroll {
  position: absolute;
  left: 0; right: 0;
  transform: none;
  z-index: 2;
}

/* Biztonsági háló: semmi ne lógjon ki vízszintesen */
html, body { overflow-x: hidden; }

/* =========================================================
   BELÉPÉS / REGISZTRÁCIÓ
   ========================================================= */
/* A menüpont arany kiemeléssel (desktop) */
.main-nav .nav-account { color: var(--gold); }
.main-nav .nav-account:hover { color: var(--gold); }
.main-nav .nav-account::after { background: var(--gold); }

/* Fiók-ikon a fejlécben */
.icon-btn.account { text-decoration: none; }

/* =========================================================
   MOBIL HAMBURGER MENÜ
   ========================================================= */
/* Desktopon a hamburger rejtve */
.nav-toggle { display: none; }
.nav-toggle-bars { display: block; width: 20px; height: 14px; position: relative; }
.nav-toggle-bars span {
  position: absolute; left: 0; width: 100%; height: 2px; border-radius: 2px;
  background: currentColor; transition: transform .3s var(--ease), opacity .2s var(--ease), top .3s var(--ease);
}
.nav-toggle-bars span:nth-child(1) { top: 0; }
.nav-toggle-bars span:nth-child(2) { top: 6px; }
.nav-toggle-bars span:nth-child(3) { top: 12px; }
/* Nyitott állapot: X */
.nav-open .nav-toggle-bars span:nth-child(1) { top: 6px; transform: rotate(45deg); }
.nav-open .nav-toggle-bars span:nth-child(2) { opacity: 0; }
.nav-open .nav-toggle-bars span:nth-child(3) { top: 6px; transform: rotate(-45deg); }

@media (max-width: 900px) {
  /* Hamburger + kosár láthatóan, jobbra fent */
  .nav-toggle { display: inline-flex; }
  .main-nav { display: flex; }   /* felülírjuk a base ≤760 display:none-ját */
  .header-actions { gap: 0.45rem; }
  .header-actions .icon-btn.lang { display: none; }   /* nyelvváltó elrejtve mobilon a helyért */
  .header-actions .icon-btn.account { display: none; } /* a lenyíló menüben már ott a Belépés link */
  /* a Belépés/Regisztráció kiemelése a mobil menü alján */
  .main-nav .nav-account { margin-top: 0.3rem; }
  .icon-btn.cart, .nav-toggle { color: var(--ink); }

  /* A menüpontok lenyíló panelként a header alatt */
  .main-nav {
    position: absolute; top: 100%; left: 0; right: 0;
    display: flex; flex-direction: column; gap: 0;
    background: rgba(5, 8, 7, 0.97);
    backdrop-filter: blur(12px) saturate(140%);
    border-top: 1px solid var(--line-soft);
    border-bottom: 1px solid var(--line-soft);
    padding: 0.5rem 1.5rem 1rem;
    box-shadow: 0 24px 40px -20px rgba(0,0,0,0.8);
    /* alapból csukva: ne foglaljon helyet, ne kattintható */
    opacity: 0; visibility: hidden; transform: translateY(-8px);
    transition: opacity .3s var(--ease), transform .3s var(--ease), visibility .3s;
  }
  .site-header.nav-open .main-nav {
    opacity: 1; visibility: visible; transform: none;
  }
  .main-nav a {
    padding: 1rem 0; font-size: 1rem; letter-spacing: 0.08em;
    border-bottom: 1px solid var(--line-soft); color: var(--ink-soft);
  }
  .main-nav a:last-child { border-bottom: none; }
  .main-nav a::after { display: none; }  /* nincs aláhúzás-animáció listában */
}

/* Kategória szekció bevezető sora a cím alatt */
.categories .cat-intro {
  margin-top: 1rem;
  color: var(--ink-soft);
  max-width: 46ch;
  margin-left: auto;
  margin-right: auto;
}

/* A bal oszlop most a logót tartja — kép helyett középre igazítva */
.story--logo .story-media {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 0;
  padding: clamp(1rem, 2vw, 2rem);
  background: rgba(8, 16, 12, 0.55);
}
.story--logo .story-media img {
  width: min(560px, 100%);
  height: auto;
  object-fit: contain;
  transform: none !important;       /* nincs zoom, mint a fotónál */
  filter: drop-shadow(0 10px 30px rgba(0,0,0,0.5));
}
/* A hover-zoomot is kikapcsoljuk a logónál */
.story--logo:hover .story-media img { transform: none !important; }

@media (max-width: 980px) {
  .story--logo .story-media { min-height: 260px; }
  .story--logo .story-media img { width: min(280px, 60%); }
}