/* RoboDuck hírek – egy hasábos olvasóoldal és kártyarács; a tokenek a gyűjtőoldaléval azonosak */
@font-face{font-family:"Fredoka";src:url(/assets/fonts/Fredoka.woff) format("woff");font-weight:300 700;font-display:swap}
@font-face{font-family:"Figtree";src:url(/assets/fonts/Figtree.woff) format("woff");font-weight:300 900;font-display:swap}
:root{
  --duck:#FFC83D; --ink:#14213D; --circuit:#0F9A92; --beak:#F2803A;
  --bg:#F6F7F9; --surface:#FFFFFF; --muted:#5A6478; --line:#DDE1E8; --tint:#FFF4D6;
  --display:"Fredoka",ui-rounded,"SF Pro Rounded",system-ui,sans-serif;
  --body:"Figtree",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:18px/1.65 var(--body)}
a{color:var(--circuit)}
img{max-width:100%;height:auto}
h1,h2,h3{font-family:var(--display);line-height:1.1;margin:0;text-wrap:balance}
p{margin:0}
.inner{max-width:1080px;margin:0 auto;padding-left:max(18px,env(safe-area-inset-left,0px));padding-right:max(18px,env(safe-area-inset-right,0px))}

.top{background:var(--duck);padding-top:env(safe-area-inset-top,0px)}
.top .inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:14px}
.top .logo img{display:block;height:40px;width:auto}
.top nav{display:flex;gap:18px;align-items:center;font-weight:600;font-size:.95rem}
.top nav a{color:var(--ink);text-decoration:none}
.top nav .cta{background:var(--ink);color:var(--duck);padding:8px 14px;border-radius:999px}
.top nav a:focus-visible{outline:3px solid var(--circuit);outline-offset:3px}

main{padding-block:40px 64px}
.meta{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;font-size:.85rem;color:var(--muted)}
.tag{background:var(--tint);color:var(--ink);border:1px solid var(--duck);padding:3px 10px;border-radius:999px;font-weight:600;font-size:.78rem}

/* cikk */
.cikk{max-width:760px;display:grid;gap:22px}
.cikk h1{font-size:clamp(2rem,5vw,3rem);font-weight:700;letter-spacing:-.01em}
.lead{font-size:1.2rem;color:#2a3550;max-width:62ch}
.kep{border-radius:18px;display:block;border:2px solid var(--ink)}
.torzs{display:grid;gap:16px;max-width:66ch}
.tenyek{margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.tenyek div{background:var(--surface);padding:14px 16px}
.tenyek dt{font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
.tenyek dd{margin:4px 0 0;font-weight:600}
.duki{display:grid;grid-template-columns:56px 1fr;gap:14px;align-items:start;background:var(--tint);border:2px solid var(--ink);border-radius:18px;padding:16px 18px}
.duki b{font-family:var(--display);font-size:1.1rem}
.duki p{margin-top:4px}
.forras{font-size:.9rem;color:var(--muted)}
.tovabbi{border-top:1px solid var(--line);padding-top:22px;display:grid;gap:10px}
.tovabbi h2{font-size:1.3rem}
.tovabbi ul{margin:0;padding-left:20px;display:grid;gap:6px}

/* feliratkozó doboz */
.sub{display:grid;grid-template-columns:64px 1fr auto;gap:16px;align-items:center;background:var(--surface);border:2px solid var(--ink);border-radius:18px;padding:18px 20px;box-shadow:0 2px 0 var(--ink)}
.sub img{border-radius:16px}
.sub h2{font-size:1.25rem}
.sub p{color:var(--muted);font-size:.95rem;margin-top:2px}
.btn{font:600 1rem var(--display);background:var(--ink);color:var(--duck);text-decoration:none;padding:12px 16px;border-radius:12px;white-space:nowrap}
@media (max-width:640px){.sub{grid-template-columns:48px 1fr}.sub img{width:48px;height:48px}.sub .btn{grid-column:1/-1;text-align:center}}

/* lista */
.lista{display:grid;gap:24px}
.lista h1{font-size:clamp(2.2rem,6vw,3.4rem);font-weight:700}
.racs{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px}
.racs article{background:var(--surface);border:1px solid var(--line);border-radius:18px;overflow:hidden;display:grid;align-content:start}
.racs article img{display:block;aspect-ratio:1200/630;object-fit:cover}
.racs article .meta,.racs article h2,.racs article p{padding:0 18px}
.racs article .meta{padding-top:14px}
.racs article h2{font-size:1.25rem;font-weight:600;margin-top:6px}
.racs article h2 a{color:var(--ink);text-decoration:none}
.racs article h2 a:hover{text-decoration:underline}
.racs article p:last-child{color:var(--muted);font-size:.95rem;padding-top:8px;padding-bottom:18px}
.ures{color:var(--muted)}

footer{border-top:1px solid var(--line);padding-block:28px calc(28px + env(safe-area-inset-bottom,0px));font-size:.9rem;color:var(--muted)}
footer .inner{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;align-items:center}
footer img{height:30px;width:auto;display:block}

/* rovatsáv a fejléc alatt: vízszintesen görgethető pirulák */
.rovatsav{background:var(--surface);border-bottom:1px solid var(--line)}
.rovatsav .inner{display:flex;gap:8px;overflow-x:auto;padding-block:10px;scrollbar-width:none}
.rovatsav .inner::-webkit-scrollbar{display:none}
.rovatsav a{flex:none;font-weight:600;font-size:.88rem;color:var(--ink);text-decoration:none;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:var(--bg)}
.rovatsav a:hover{border-color:var(--ink)}
.tag.rovat{background:var(--ink);color:var(--duck);border-color:var(--ink);text-decoration:none}
