/* woodflowdistribution.hu – aloldalak közös stílusa (a főoldal színei és betűi) */
:root { --ink:#1C1E1F; --ink-2:#242628; --paper:#F3F0EA; --paper-2:#EAE3D4; --copper:#C1571F; --copper-dark:#A8481A;
        --muted:#5B6167; --muted-dark-bg:#9BA1A6; --border-dark:rgba(245,242,236,0.14); --border-light:rgba(28,30,31,0.12); }
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'IBM Plex Sans',sans-serif; color:var(--ink); background:var(--paper); line-height:1.6; }
h1,h2,h3 { font-family:'Space Grotesk',sans-serif; font-weight:700; letter-spacing:-0.5px; }
a { color:var(--copper-dark); }
.wrap { max-width:1240px; margin:0 auto; padding:0 32px; }

/* fejléc */
header.nav { position:sticky; top:0; z-index:50; background:var(--ink); border-bottom:1px solid var(--border-dark); }
.nav-inner { display:flex; align-items:center; gap:22px; padding:12px 32px; max-width:1240px; margin:0 auto; }
.brand { display:flex; align-items:center; gap:9px; color:var(--copper); font:700 18px 'Space Grotesk',sans-serif; text-decoration:none; }
.menu { display:flex; gap:2px; list-style:none; flex:1; }
.menu .dd { background:none; border:0; color:var(--paper); font:500 14px 'IBM Plex Sans',sans-serif; padding:8px 11px; cursor:pointer; border-radius:2px; }
.menu .dd::after { content:" ▾"; color:var(--muted-dark-bg); font-size:11px; }
.menu .dd:hover, .menu .dd[aria-expanded="true"] { background:rgba(255,255,255,0.08); }
.actions { display:flex; gap:12px; align-items:center; }
.lang { display:flex; gap:2px; background:rgba(255,255,255,0.06); padding:3px; border-radius:3px; }
.lang a { font:500 12px 'IBM Plex Mono',monospace; padding:5px 10px; color:var(--muted-dark-bg); text-decoration:none; border-radius:2px; }
.lang a.on { background:var(--copper); color:#fff; }
.login { font-weight:600; font-size:13px; color:var(--muted-dark-bg); border:1px solid currentColor; padding:7px 13px; border-radius:2px; text-decoration:none; }
.login:hover { color:var(--paper); }
.cta { display:inline-block; background:var(--copper); color:#fff !important; font-weight:600; font-size:13px; padding:9px 16px; border-radius:2px; text-decoration:none; white-space:nowrap; }
.cta:hover { background:var(--copper-dark); }
.burger { display:none; background:none; border:1px solid var(--border-dark); color:var(--paper); font-size:18px; padding:4px 10px; border-radius:2px; cursor:pointer; margin-left:auto; }
/* kereső gomb (kereses.js): asztalon a menü után, mobilon a hamburger mellett */
.srch-btn { display:inline-flex; align-items:center; justify-content:center; background:none; border:1px solid var(--border-dark); color:var(--paper); border-radius:2px; width:36px; height:34px; cursor:pointer; flex-shrink:0; }
.srch-btn:hover { border-color:var(--copper); }
.menu { order:1; } .srch-btn { order:2; } .actions { order:3; }
.mega { display:none; position:absolute; left:0; right:0; top:100%; background:var(--ink-2); border-bottom:3px solid var(--copper); box-shadow:0 18px 40px rgba(0,0,0,.35); max-height:calc(100vh - 70px); overflow:auto; }
.mega.open { display:block; }
.mega-inner { max-width:1240px; margin:0 auto; padding:22px 32px 12px; display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:22px; }
.mega .col h4 { font:500 11px 'IBM Plex Mono',monospace; letter-spacing:2.5px; text-transform:uppercase; color:var(--muted-dark-bg); margin-bottom:8px; padding-bottom:8px; border-bottom:1px solid var(--border-dark); }
.mega .col.wide { grid-column:1 / -1; columns:2; }
.mega .item { display:block; padding:7px 10px; margin:0 -10px; border-radius:3px; text-decoration:none; color:var(--paper); break-inside:avoid; }
.mega .item:hover { background:rgba(193,87,31,0.18); }
.mega .item b { font:600 14px 'Space Grotesk',sans-serif; display:block; line-height:1.3; }
.mega .item small { display:block; font:500 11px 'IBM Plex Mono',monospace; color:var(--muted-dark-bg); margin-top:2px; }
.mega .item.sm { padding:3px 10px; }
.mega .item.sm b { font:600 13px 'IBM Plex Mono',monospace; display:inline; }
.mega .item.sm small { display:inline; margin-left:6px; }
.mega .mat-grp { margin-bottom:14px; }
.mega-foot { max-width:1240px; margin:0 auto; padding:12px 32px 16px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; border-top:1px solid var(--border-dark); font-size:13px; }
.mega-foot a { color:var(--copper); text-decoration:none; font-weight:600; }

/* tartalom */
main.wrap { padding-top:28px; padding-bottom:72px; }
.crumb { font:500 12px 'IBM Plex Mono',monospace; color:var(--muted); margin-bottom:14px; }
.crumb a { color:var(--muted); text-decoration:none; }
.crumb a:hover { color:var(--copper); }
h1 { font-size:36px; line-height:1.15; margin:4px 0 16px; }
.lead { font-size:17px; max-width:820px; color:#33373a; margin-bottom:12px; }
.grid { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:40px; margin-top:8px; }
.article { max-width:820px; }
.article .meta { font:500 12px 'IBM Plex Mono',monospace; color:var(--muted); margin-bottom:6px; }
.article h2, main h2 { font-size:22px; margin:30px 0 10px; }
.article h3 { font-size:17px; margin:20px 0 6px; }
.article p { margin:0 0 14px; font-size:16px; color:#2d3133; }
.article ul, .article ol { padding-left:22px; margin:6px 0 16px; }
.article li { margin:4px 0; font-size:16px; color:#2d3133; }
.article table, .tbl-wrap table { width:100%; border-collapse:collapse; font-size:14px; background:#fff; margin:8px 0 14px; }
.article th, .article td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--border-light); vertical-align:top; }
.article th { font:500 11px 'IBM Plex Mono',monospace; letter-spacing:1px; text-transform:uppercase; color:var(--muted); background:var(--paper-2); }
.tbl-wrap { overflow:auto; max-height:540px; border:1px solid var(--border-light); background:#fff; margin:8px 0; }
.tbl-wrap table { margin:0; }
.tbl-wrap th { position:sticky; top:0; white-space:nowrap; }
.tbl-wrap td { white-space:nowrap; }
.tbl-wrap td:first-child { font:600 13px 'IBM Plex Mono',monospace; }
.tbl-note { font-size:13px; color:var(--muted); margin:6px 0 12px; }
.note { font-size:13px; color:var(--muted); margin-top:18px; }
.tags span { display:inline-block; font:500 12px 'IBM Plex Mono',monospace; background:var(--paper-2); padding:3px 8px; margin:0 6px 6px 0; border-radius:2px; color:var(--ink); }
.chips a { display:inline-block; font:600 13px 'Space Grotesk',sans-serif; background:#fff; border:1px solid var(--border-light); color:var(--ink); padding:6px 11px; margin:0 6px 6px 0; border-radius:2px; text-decoration:none; }
.chips a:hover { border-color:var(--copper); color:var(--copper); }
.side { background:var(--ink); color:var(--paper); padding:22px; border-radius:3px; align-self:start; position:sticky; top:84px; }
.side h3 { font-size:17px; margin-bottom:10px; }
.side ul { list-style:none; font-size:14px; margin-bottom:16px; }
.side li { padding:6px 0; border-bottom:1px solid var(--border-dark); }
.side a { color:var(--paper); text-decoration:none; }
.side a:hover { color:var(--copper); }
.callout { background:var(--ink); color:var(--paper); padding:22px; margin-top:28px; border-radius:3px; }
.callout p { color:var(--paper) !important; margin-bottom:12px; }
.cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:14px; margin-bottom:10px; }
.card { display:block; background:#fff; border:1px solid var(--border-light); padding:16px; border-radius:3px; text-decoration:none; color:var(--ink); }
.card:hover { border-color:var(--copper); }
.card b { display:block; font:600 16px 'Space Grotesk',sans-serif; margin-bottom:8px; }
.card small { display:block; color:var(--muted); font-size:13px; line-height:1.5; }

/* lábléc */
.foot { background:var(--ink); color:var(--muted-dark-bg); font-size:14px; padding:32px 0; }
.foot .wrap { display:flex; gap:40px; flex-wrap:wrap; justify-content:space-between; }
.foot b { color:var(--paper); }
.foot a { color:var(--muted-dark-bg); text-decoration:none; }
.foot a:hover { color:var(--paper); }

@media (max-width: 960px) {
  .grid { grid-template-columns:minmax(0,1fr); }
  .side { position:static; }
  .wrap, .nav-inner, .mega-inner, .mega-foot { padding-left:16px; padding-right:16px; }
  .burger { display:block; margin-left:8px; }
  .srch-btn { order:0; margin-left:auto; }
  .nav-inner { flex-wrap:wrap; gap:10px; }
  .menu, .actions { display:none; width:100%; }
  header.nav.open .menu { display:flex; flex-direction:column; }
  header.nav.open .actions { display:flex; flex-wrap:wrap; padding-bottom:8px; }
  /* nyitott menü: a fejléc görget, nem a háttéroldal */
  header.nav.open { max-height:100vh; max-height:100dvh; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
  html.menu-lock, html.menu-lock body { overflow:hidden; }
  .mega { position:static; box-shadow:none; max-height:none; }
  .mega .col.wide { columns:1; }
  h1 { font-size:28px; }
}

/* asztali nézet: a menük egérrel ráhúzásra is lenyílnak (kattintásra és billentyűzettel is) */
@media (hover: hover) and (min-width: 961px) {
  .menu > li { padding:12px 0; margin:-12px 0; }
  .menu > li:hover > .mega, .menu > li:focus-within > .mega { display:block; }
  .menu > li:hover > .dd { background:rgba(255,255,255,0.08); }
}
/* termékoldal fejléce (2026-10-22): szürke sáv — cím + bevezető, jobbra pipás állítások; alatta háromoszlopos adatsáv */
.phero { background:var(--paper-2); margin:6px calc(50% - 50vw) 0; padding:54px 0 58px; }
.phero-in { max-width:1200px; margin:0 auto; padding:0 24px; display:grid; grid-template-columns:minmax(0,1.45fr) minmax(0,1fr); gap:48px; align-items:center; }
.phero h1 { font-size:clamp(30px,4vw,46px); line-height:1.08; margin:0 0 20px; letter-spacing:-.015em; }
.phero-txt p { font-size:17px; line-height:1.65; color:var(--ink-2); max-width:640px; }
.phero-usp { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; align-items:flex-start; }
.phero-usp li { display:flex; align-items:center; gap:14px; background:#fff; border-radius:999px; padding:14px 24px 14px 20px; font-weight:600; font-size:15.5px; line-height:1.35; box-shadow:0 1px 0 var(--border-light); }
.phero-usp svg { flex:none; color:var(--copper); }
.pspec { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; margin:44px 0 18px; }
.pspec.n2 { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:900px; }
.pspec.n1 { grid-template-columns:minmax(0,1fr); max-width:620px; }
.pspec-col h2 { font-size:21px; margin:0 0 14px !important; padding-bottom:14px; border-bottom:1px solid var(--border-light); }
.pspec-col dl { margin:0; }
.pspec-col dl > div { display:grid; grid-template-columns:minmax(110px,40%) 1fr; gap:12px; padding:13px 8px; border-bottom:1px solid var(--border-light); font-size:15px; }
.pspec-col dt { font-weight:700; }
.pspec-col dd { margin:0; line-height:1.55; }
@media (max-width:900px){
  .phero { padding:34px 0 38px; }
  .phero-in { grid-template-columns:1fr; gap:26px; padding:0 16px; }
  .phero-txt p { font-size:16px; }
  .phero-usp li { padding:11px 18px 11px 14px; font-size:14.5px; }
  .pspec, .pspec.n1, .pspec.n2 { grid-template-columns:1fr; gap:22px; margin-top:30px; max-width:none; }
}
/* GYIK lenyílóként (2026-10-22) — a főoldali minta */
.faq-list { margin:8px 0 18px; }
.faq-item { padding:18px 0; border-top:1px solid var(--border-light); }
.faq-item:last-child { border-bottom:1px solid var(--border-light); }
.faq-item summary { font-family:'Space Grotesk',sans-serif; font-weight:700; letter-spacing:-0.3px; font-size:16px; cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:'+'; font-family:'IBM Plex Mono',monospace; font-size:20px; font-weight:400; color:var(--copper); flex-shrink:0; }
.faq-item[open] summary::after { content:'–'; }
.faq-item summary:hover { color:var(--copper); }
.faq-item p { margin-top:10px; color:var(--muted); max-width:760px; }
