/* =============================================================================
   helioos.pl — blog (spójny z marką: ciemne tło, złote akcenty)
   ============================================================================= */
:root{
  --bl-bg:#070D19; --bl-bg2:#0d1626; --bl-card:#0f1a2c; --bl-line:rgba(255,255,255,.10);
  --bl-gold:#FFB300; --bl-text:#EAECEF; --bl-mut:#9aa0ad; --bl-mut2:#6b7180;
}
*{box-sizing:border-box}
body.blogpage{margin:0;background:var(--bl-bg);color:var(--bl-text);
  font-family:'Spectral',Georgia,serif;line-height:1.7;
  -webkit-font-smoothing:antialiased}
body.blogpage a{color:inherit;text-decoration:none}

/* Header */
.bl-header{display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:18px 28px;border-bottom:1px solid var(--bl-line);position:sticky;top:0;
  background:rgba(7,13,25,.85);backdrop-filter:blur(8px);z-index:50}
.bl-brand{font-family:'Cinzel',serif;font-weight:700;letter-spacing:.14em;font-size:1.05rem;color:#fff;display:flex;align-items:center;gap:8px}
.bl-sun{color:var(--bl-gold)}
.bl-nav{display:flex;align-items:center;gap:22px;font-family:'Space Grotesk',sans-serif;font-size:.92rem}
.bl-nav a{color:var(--bl-mut)}
.bl-nav a:hover,.bl-nav a.is-active{color:#fff}
.bl-cta{display:inline-block;background:var(--bl-gold);color:#1a1206 !important;
  font-family:'Space Grotesk',sans-serif;font-weight:600;padding:9px 16px;border-radius:9px;font-size:.9rem}
.bl-cta:hover{filter:brightness(1.07)}

/* Layout */
.bl-main{max-width:1080px;margin:0 auto;padding:48px 24px 72px}
.bl-hero{text-align:center;max-width:720px;margin:0 auto 48px}
.bl-eyebrow{color:var(--bl-gold);font-family:'Space Grotesk',sans-serif;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;font-size:.78rem;margin-bottom:12px}
.bl-hero h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(1.9rem,4vw,2.8rem);line-height:1.1;margin:0 0 14px;color:#fff}
.bl-hero p{color:var(--bl-mut);font-size:1.1rem;margin:0}

/* Grid + cards */
.bl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px}
.bl-card{background:var(--bl-card);border:1px solid var(--bl-line);border-radius:14px;overflow:hidden;
  display:flex;flex-direction:column;transition:transform .18s,border-color .18s,box-shadow .18s}
.bl-card:hover{transform:translateY(-3px);border-color:rgba(255,179,0,.35);box-shadow:0 18px 44px rgba(0,0,0,.4)}
.bl-card-img{display:block;aspect-ratio:16/9;overflow:hidden}
.bl-card-img img{width:100%;height:100%;object-fit:cover}
.bl-card-body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.bl-card-body time{color:var(--bl-mut2);font-family:'Space Grotesk',sans-serif;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase}
.bl-card-body h2{font-family:'Space Grotesk',sans-serif;font-size:1.25rem;line-height:1.25;margin:0;color:#fff}
.bl-card-body h2 a:hover{color:var(--bl-gold)}
.bl-card-body p{color:var(--bl-mut);font-size:.98rem;margin:0;flex:1}
.bl-readmore{color:var(--bl-gold);font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:.9rem;margin-top:4px}
.bl-readmore i{transition:transform .15s}
.bl-readmore:hover i{transform:translateX(4px)}

/* Empty state */
.bl-empty{text-align:center;max-width:520px;margin:40px auto;padding:48px 24px;
  background:var(--bl-card);border:1px solid var(--bl-line);border-radius:16px}
.bl-empty-sun{font-size:48px;color:var(--bl-gold);animation:blspin 16s linear infinite}
@keyframes blspin{to{transform:rotate(360deg)}}
.bl-empty h1,.bl-empty h2{font-family:'Space Grotesk',sans-serif;color:#fff;margin:14px 0 8px}
.bl-empty p{color:var(--bl-mut);margin:0 0 22px}

/* Article */
.bl-article-wrap{max-width:760px}
.bl-breadcrumb{font-family:'Space Grotesk',sans-serif;font-size:.85rem;color:var(--bl-mut2);margin-bottom:22px}
.bl-breadcrumb a:hover{color:var(--bl-gold)}
.bl-breadcrumb span{margin:0 6px}
.bl-article>header time{color:var(--bl-mut2);font-family:'Space Grotesk',sans-serif;font-size:.82rem;letter-spacing:.05em;text-transform:uppercase}
.bl-article>header h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.12;margin:10px 0 14px;color:#fff}
.bl-lead{color:var(--bl-mut);font-size:1.2rem;line-height:1.6;margin:0 0 8px}
.bl-article-hero{width:100%;border-radius:14px;margin:22px 0 8px;border:1px solid var(--bl-line)}

/* Prose typography */
.bl-prose{font-size:1.12rem;color:#d7dae0;margin-top:26px}
.bl-prose h2{font-family:'Space Grotesk',sans-serif;color:#fff;font-size:1.6rem;margin:38px 0 14px;line-height:1.2}
.bl-prose h3{font-family:'Space Grotesk',sans-serif;color:#fff;font-size:1.3rem;margin:30px 0 12px}
.bl-prose p{margin:0 0 18px}
.bl-prose a{color:var(--bl-gold);text-decoration:underline;text-underline-offset:3px}
.bl-prose ul,.bl-prose ol{margin:0 0 18px;padding-left:1.4em}
.bl-prose li{margin:6px 0}
.bl-prose img{max-width:100%;height:auto;border-radius:12px;margin:14px 0;border:1px solid var(--bl-line)}
.bl-prose blockquote{margin:22px 0;padding:14px 20px;border-left:3px solid var(--bl-gold);
  background:rgba(255,179,0,.06);border-radius:0 10px 10px 0;color:#e6e8ec}
.bl-prose code{background:#0a1320;border:1px solid var(--bl-line);border-radius:6px;padding:2px 6px;font-size:.92em;font-family:'IBM Plex Mono',ui-monospace,monospace}
.bl-prose pre{background:#0a1320;border:1px solid var(--bl-line);border-radius:12px;padding:18px;overflow:auto;margin:0 0 18px}
.bl-prose pre code{background:none;border:none;padding:0}
.bl-prose hr{border:none;border-top:1px solid var(--bl-line);margin:34px 0}
.bl-prose table{width:100%;border-collapse:collapse;margin:0 0 18px;font-size:.98rem}
.bl-prose th,.bl-prose td{border:1px solid var(--bl-line);padding:10px 12px;text-align:left}
.bl-prose th{background:rgba(255,255,255,.04);font-family:'Space Grotesk',sans-serif}

/* Article CTA */
.bl-article-cta{margin-top:48px;padding:32px;text-align:center;background:linear-gradient(180deg,rgba(255,179,0,.08),rgba(255,179,0,.02));
  border:1px solid rgba(255,179,0,.25);border-radius:16px}
.bl-article-cta h3{font-family:'Space Grotesk',sans-serif;color:#fff;margin:0 0 8px;font-size:1.4rem}
.bl-article-cta p{color:var(--bl-mut);margin:0 0 20px}

/* Footer */
.bl-footer{border-top:1px solid var(--bl-line);padding:28px;display:flex;flex-wrap:wrap;gap:10px;
  justify-content:space-between;color:var(--bl-mut2);font-family:'Space Grotesk',sans-serif;font-size:.85rem;max-width:1080px;margin:0 auto}
.bl-footer a:hover{color:var(--bl-gold)}

@media(max-width:600px){
  .bl-header{padding:14px 16px;gap:10px;flex-wrap:wrap}
  .bl-nav{gap:14px;font-size:.85rem}
  .bl-main{padding:32px 16px 56px}
}