/* ─── Peak AI · megosztott stíluslap ────────────────────────────
   A /blog, az /impresszum, az /adatkezeles és az /aszf oldalak ezt
   használják. A tokenek az index.html inline stíluslapjával azonosak
   (brand kit tokens.css v1.0) — ha az arculat változik, mindkettőt
   frissíteni kell.
   ──────────────────────────────────────────────────────────────── */
:root{
  --peak-depth:#060810; --peak-obsidian:#0B0E13; --peak-basalt:#14181F;
  --peak-ridge:#1E232C; --peak-glacier:#5A6472; --peak-mist:#A8B1BD;
  --peak-summit:#F4F6FA; --peak-snow:#FFFFFF;
  --peak-accent:#5DE8E2; --peak-accent-lift:#7BFFF7; --peak-accent-deep:#1FAEA8;
  --peak-solar:#FFD479;

  --font-display:"Space Grotesk",system-ui,-apple-system,sans-serif;
  --font-body:"Manrope",system-ui,-apple-system,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,monospace;

  --bg:var(--peak-summit);
  --surface:var(--peak-snow);
  --line:#DDE2EA;
  --text:var(--peak-ridge);
  --heading:var(--peak-obsidian);
  --muted:var(--peak-glacier);
  --max:1140px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--font-body); font-size:17px; line-height:1.68;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{
  font-family:var(--font-display); color:var(--heading);
  line-height:1.14; margin:0 0 .5em; letter-spacing:-.03em; font-weight:600;
}
h1{font-size:clamp(2rem,4.6vw,3.1rem); letter-spacing:-.04em}
h2{font-size:clamp(1.5rem,3vw,2.05rem)}
h3{font-size:1.18rem; letter-spacing:-.02em}
h4{font-size:1.02rem; letter-spacing:-.02em}
p{margin:0 0 1rem}
a{color:inherit}
.wrap{max-width:var(--max); margin:0 auto; padding:0 24px}
.lede{font-size:clamp(1.05rem,2vw,1.2rem); max-width:62ch}

.eyebrow{
  display:flex; align-items:center; gap:12px;
  font-family:var(--font-mono); font-size:.7rem; font-weight:500;
  letter-spacing:.22em; text-transform:uppercase;
  color:var(--muted); margin:0 0 1.2rem;
}
.eyebrow::before{content:""; width:34px; height:2px; background:var(--peak-accent-deep); flex:none}
.on-dark .eyebrow{color:var(--peak-mist)}
.on-dark .eyebrow::before{background:var(--peak-accent)}

/* ─── logó ─────────────────────────────────────────────────────── */
.logo{display:block; text-decoration:none; line-height:0}
.logo svg{display:block; height:auto}
.logo-nav svg{width:128px}
.logo-foot svg{width:224px}

/* ─── nav ──────────────────────────────────────────────────────── */
nav{
  position:sticky; top:0; z-index:50; background:rgba(244,246,250,.86);
  backdrop-filter:saturate(160%) blur(14px); border-bottom:1px solid var(--line);
}
.nav-in{display:flex; align-items:center; justify-content:space-between; height:70px}
.nav-links{display:flex; gap:32px; align-items:center}
.nav-links a{color:var(--text); text-decoration:none; font-size:.94rem; font-weight:500}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--peak-accent-deep)}
@media(max-width:900px){.nav-links{display:none}}

/* ─── gombok ───────────────────────────────────────────────────── */
.btn{
  display:inline-block; text-decoration:none; padding:13px 26px; border-radius:8px;
  font-family:var(--font-display); font-weight:600; font-size:.97rem; letter-spacing:-.01em;
  background:var(--peak-accent-deep); color:var(--peak-obsidian);
  border:1px solid var(--peak-accent-deep); transition:background .16s,border-color .16s;
}
.btn:hover{background:#1A9A94; border-color:#1A9A94}
.btn-sm{padding:9px 19px; font-size:.9rem}
.btn-ghost{background:transparent; color:var(--heading); border-color:var(--line)}
.btn-ghost:hover{background:var(--surface); border-color:var(--muted)}
.on-dark .btn{background:var(--peak-accent); border-color:var(--peak-accent); color:var(--peak-obsidian)}
.on-dark .btn:hover{background:var(--peak-accent-lift); border-color:var(--peak-accent-lift)}

.on-dark{background:var(--peak-obsidian); color:var(--peak-mist)}
.on-dark h1,.on-dark h2,.on-dark h3{color:var(--peak-summit)}

section{padding:70px 0}
.card{background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:28px}

/* ─── blog fejléc sáv ──────────────────────────────────────────── */
.blog-hero{padding:74px 0 78px; position:relative; overflow:hidden;
  background:linear-gradient(180deg,var(--peak-depth),var(--peak-obsidian))}
.blog-hero::after{
  content:""; position:absolute; right:-180px; top:-160px; width:640px; height:640px;
  border-radius:50%; pointer-events:none;
  background:radial-gradient(circle,rgba(93,232,226,.13),transparent 65%);
}
.blog-hero .wrap{position:relative; z-index:1}
.blog-hero .lede{color:var(--peak-mist); margin-top:1.3rem}

/* ─── cikklista ────────────────────────────────────────────────── */
.post-list{display:grid; gap:20px; max-width:820px}
.post-card{
  display:block; text-decoration:none; background:var(--surface);
  border:1px solid var(--line); border-radius:16px; padding:30px 32px;
  transition:border-color .16s, box-shadow .16s, transform .16s;
}
.post-card:hover{border-color:var(--peak-accent-deep); box-shadow:0 12px 34px rgba(31,174,168,.11); transform:translateY(-2px)}
.post-meta{
  font-family:var(--font-mono); font-size:.7rem; font-weight:500; letter-spacing:.18em;
  text-transform:uppercase; color:var(--muted); margin:0 0 12px;
}
.post-card h2{font-size:clamp(1.25rem,2.4vw,1.62rem); margin-bottom:.45em}
.post-card p{font-size:.98rem; color:var(--text); margin:0}
.post-more{display:inline-block; margin-top:16px; font-weight:600;
  font-family:var(--font-display); font-size:.94rem; color:var(--peak-accent-deep)}

/* ─── cikk törzs ───────────────────────────────────────────────── */
.article{max-width:720px; margin:0 auto; padding:56px 24px 20px}
.breadcrumb{font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted); margin:0 0 26px}
.breadcrumb a{color:var(--muted); text-decoration:none}
.breadcrumb a:hover{color:var(--peak-accent-deep)}
.article h2{margin-top:2.4em}
.article h3{margin-top:2em}
.article ul,.article ol{padding-left:22px; margin:0 0 1.2rem}
.article li{margin-bottom:.55rem}
.article > p:first-of-type{font-size:1.06rem}

/* rövid válasz — a GEO-blokk, ez kerül az AI-idézetekbe */
.answer{
  background:var(--surface); border:1px solid var(--line);
  border-left:3px solid var(--peak-accent-deep);
  border-radius:0 14px 14px 0; padding:24px 28px; margin:0 0 34px;
}
.answer .post-meta{margin-bottom:8px}
.answer p{margin:0; font-size:1.04rem}

/* táblázat */
.tbl-wrap{overflow-x:auto; margin:0 0 1.4rem; -webkit-overflow-scrolling:touch}
table{border-collapse:collapse; width:100%; min-width:520px; font-size:.94rem}
th,td{text-align:left; padding:12px 14px; border-bottom:1px solid var(--line); vertical-align:top}
th{font-family:var(--font-mono); font-size:.68rem; font-weight:500; letter-spacing:.16em;
   text-transform:uppercase; color:var(--muted); border-bottom:1px solid var(--peak-glacier)}
td b,td strong{font-family:var(--font-mono); font-weight:500; color:var(--heading); white-space:nowrap}
tr.sum td{border-top:2px solid var(--peak-ridge); border-bottom:0; padding-top:15px}
tr.sum td b{color:var(--peak-accent-deep); font-family:var(--font-display); font-size:1.1rem; font-weight:600}

.note{font-size:.85rem; color:var(--muted); line-height:1.62; margin:0 0 1.4rem}

/* GYIK */
.faq{border-top:1px solid var(--line); margin-top:14px}
.faq-item{border-bottom:1px solid var(--line); padding:22px 0}
.faq-item h3{margin:0 0 .5em; font-size:1.06rem}
.faq-item p:last-child{margin-bottom:0}

/* szerző */
.author{
  display:flex; gap:18px; align-items:flex-start; background:var(--surface);
  border:1px solid var(--line); border-radius:14px; padding:24px 26px; margin:44px 0 0;
}
.author-mark{
  width:46px; height:46px; border-radius:11px; flex:none;
  background:rgba(31,174,168,.12); display:grid; place-items:center;
}
.author-mark svg{width:26px; height:auto}
.author h4{margin:0 0 4px}
.author p{margin:0; font-size:.9rem; color:var(--muted); line-height:1.6}

/* cikkzáró CTA */
.cta{border-radius:18px; padding:48px 40px; text-align:center; position:relative; overflow:hidden;
     background:linear-gradient(160deg,var(--peak-obsidian),var(--peak-depth))}
.cta::before{content:""; position:absolute; left:50%; top:-260px; transform:translateX(-50%);
             width:640px; height:540px; border-radius:50%; pointer-events:none;
             background:radial-gradient(circle,rgba(93,232,226,.13),transparent 66%)}
.cta > *{position:relative}
.cta h2{margin-top:0}
.cta p{max-width:52ch; margin:0 auto 26px; color:var(--peak-mist)}
@media(max-width:640px){.cta{padding:36px 22px}}

/* következő cikk */
.next-up{max-width:720px; margin:52px auto 0; padding:0 24px}
.next-up .post-meta{margin-bottom:14px}

/* ─── lábléc ───────────────────────────────────────────────────── */
footer{background:var(--peak-obsidian); color:var(--peak-glacier);
       padding:56px 0 44px; font-size:.9rem; margin-top:80px}
.foot-grid{display:flex; justify-content:space-between; gap:40px; flex-wrap:wrap}
footer a{color:var(--peak-mist); text-decoration:none}
footer a:hover{color:var(--peak-accent)}
.foot-h{font-family:var(--font-mono); font-size:.68rem; font-weight:500; letter-spacing:.2em;
        text-transform:uppercase; color:var(--peak-glacier); display:block; margin-bottom:12px}
.tiny{font-size:.8rem; margin-top:36px; line-height:1.65; color:#4A5462}

/* ─── jogi oldalak (impresszum, adatkezelés, ÁSZF) ─────────────── */
.legal{max-width:760px; margin:0 auto; padding:52px 24px 20px}
.legal h2{margin-top:2.6em; font-size:clamp(1.35rem,2.6vw,1.75rem)}
.legal h3{margin-top:1.9em; font-size:1.08rem}
.legal ul,.legal ol{padding-left:22px; margin:0 0 1.2rem}
.legal li{margin-bottom:.5rem}
.legal p,.legal li{font-size:.99rem}

/* adatlap: mező / érték */
.kv{border-top:1px solid var(--line); margin:0 0 1.6rem}
.kv-row{display:flex; gap:20px; padding:13px 0; border-bottom:1px solid var(--line); flex-wrap:wrap}
.kv-row dt{flex:0 0 210px; font-family:var(--font-mono); font-size:.7rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin:0; padding-top:3px}
.kv-row dd{flex:1 1 260px; margin:0; font-size:.99rem}
.kv-row dd b{font-family:var(--font-mono); font-weight:500; color:var(--heading)}
@media(max-width:640px){.kv-row dt{flex-basis:100%}}

/* tartalomjegyzék */
.toc{background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:24px 28px; margin:0 0 38px}
.toc .post-meta{margin-bottom:12px}
.toc ol{margin:0; padding-left:20px; columns:2; column-gap:34px}
.toc li{margin-bottom:7px; font-size:.94rem; break-inside:avoid}
.toc a{color:var(--text); text-decoration:none}
.toc a:hover{color:var(--peak-accent-deep)}
@media(max-width:640px){.toc ol{columns:1}}

/* kiemelt figyelmeztetés */
.callout{background:var(--surface); border:1px solid var(--line);
  border-left:3px solid var(--peak-solar); border-radius:0 14px 14px 0;
  padding:22px 26px; margin:0 0 1.6rem}
.callout p:last-child{margin-bottom:0}
.callout .post-meta{margin-bottom:8px}

/* hatály / frissítés */
.stamp{font-family:var(--font-mono); font-size:.74rem; letter-spacing:.1em;
  color:var(--muted); border-top:1px solid var(--line); padding-top:20px; margin-top:46px}
