/* =========================================================================
   Rowerowa Osada — REDESIGN blog.html
   Ładowany WYŁĄCZNIE na blog.html — nie wpływa na inne strony.
   Zasada: KEEP THE CONTENT — REPLACE THE VISUAL LAYER.
   Treść artykułów, zdjęcia, linki i logika filtrowania pozostają dokładnie
   takie same jak w produkcyjnym blog.html — ten plik zmienia wyłącznie
   markup prezentacji i CSS.
   Tokeny/navbar/footer/przyciski są 1:1 z redesign-home.css / redesign-cennik.css
   (ten sam design system co strona główna), zduplikowane tu zgodnie z konwencją
   przyjętą dla redesign-cennik.css i redesign-reservation.css (każda strona
   ładuje własny, samodzielny plik redesign-*.css).
   ========================================================================= */

:root{
  --rd-ink:#0E1512;
  --rd-forest:#1E3A2F;
  --rd-forest-light:#2C4F40;
  --rd-stone:#F6F3EC;
  --rd-surface:#FBFAF7;
  --rd-ember:#E85D2C;
  --rd-ember-deep:#C94A1E;
  --rd-muted:#8A8578;
  --rd-line:#DFD9C9;
}

body{
  font-family:'Inter', ui-sans-serif, system-ui, sans-serif;
  background:var(--rd-stone) !important;
}

/* =========================================================================
   NAVBAR — identyczny system co index.html / cennik.html
   ========================================================================= */
header.rd-navbar{
  background:rgba(255,255,255,.98);
  border-bottom:1px solid var(--rd-line);
  backdrop-filter:blur(14px);
}
header.rd-navbar .rd-nav-link{
  font-family:'Archivo',sans-serif; font-weight:600; font-size:13.5px;
  letter-spacing:.02em; color:var(--rd-forest);
  transition:color .25s ease;
}
header.rd-navbar .rd-nav-link:hover{ color:var(--rd-ember); }
header.rd-navbar .rd-nav-link.rd-active{ color:var(--rd-ember); }
header.rd-navbar .rd-icon-btn{ color:var(--rd-forest); transition:color .2s ease, background-color .2s ease; }
header.rd-navbar .rd-icon-btn:hover{ color:var(--rd-ember); background:var(--rd-stone); }
header.rd-navbar .rd-logo-img{ filter:none; }

.rd-btn-ember{
  background:var(--rd-ember); color:#fff; font-family:'Archivo',sans-serif; font-weight:700;
  letter-spacing:.02em; font-size:13.5px;
  padding:.7rem 1.5rem; border-radius:4px; display:inline-flex; align-items:center; gap:.5rem;
  transition:transform .2s ease, background-color .2s ease, box-shadow .2s ease;
  box-shadow:0 10px 24px -10px rgba(232,93,44,.6);
  border:none; cursor:pointer;
}
.rd-btn-ember:hover{ background:var(--rd-ember-deep); transform:translateY(-1px); color:#fff; }

.rd-btn-dark{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:'Archivo',sans-serif; font-weight:600; font-size:13px; letter-spacing:.03em; text-transform:uppercase;
  border:1.5px solid var(--rd-ink); color:var(--rd-ink);
  padding:.85rem 1.4rem; border-radius:4px; background:transparent;
  transition:background-color .2s ease, color .2s ease;
}
.rd-btn-dark:hover{ background:var(--rd-ink); color:#fff; }

.rd-btn-outline-cream{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:'Archivo',sans-serif; font-weight:600; font-size:13px; letter-spacing:.03em; text-transform:uppercase;
  border:1.5px solid rgba(255,255,255,.55); color:#fff; background:transparent;
  padding:.85rem 1.4rem; border-radius:4px;
  transition:border-color .2s ease, background-color .2s ease;
}
.rd-btn-outline-cream:hover{ border-color:#fff; background:rgba(255,255,255,.08); }

/* =========================================================================
   TOPO / GPS decorative pattern — 1:1 z redesign-home.css
   ========================================================================= */
.rd-topo-pattern{
  position:relative;
  background-image:
    repeating-radial-gradient(circle at 15% 20%, rgba(255,255,255,.035) 0, rgba(255,255,255,.035) 1px, transparent 1px, transparent 34px),
    repeating-radial-gradient(circle at 85% 75%, rgba(255,255,255,.035) 0, rgba(255,255,255,.035) 1px, transparent 1px, transparent 46px);
}

/* =========================================================================
   HERO — blog
   ========================================================================= */
.rd-blog-hero{
  position:relative;
  background:var(--rd-ink);
  padding:9.5rem 0 4.5rem;
  overflow:hidden;
}
.rd-blog-hero-content{ position:relative; z-index:10; max-width:44rem; margin:0 auto; padding:0 1rem; text-align:center; }

.rd-eyebrow{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(255,255,255,.88);
  border:1px solid rgba(255,255,255,.28);
  border-radius:999px;
  padding:.5rem .95rem;
  margin-bottom:1.35rem;
}
.rd-eyebrow-dot{ width:5px; height:5px; border-radius:999px; background:var(--rd-ember); flex-shrink:0; }

.rd-blog-h1{
  font-family:'Bebas Neue', ui-sans-serif, sans-serif;
  text-transform:uppercase;
  color:#fff;
  line-height:.92;
  letter-spacing:.01em;
  font-size:13vw;
  margin:0;
}
@media(min-width:640px){ .rd-blog-h1{ font-size:4.6rem; } }
@media(min-width:1024px){ .rd-blog-h1{ font-size:5.6rem; } }

.rd-blog-hero-desc{
  color:rgba(255,255,255,.8);
  font-size:1.05rem; line-height:1.65; max-width:34rem;
  margin:1.25rem auto 0;
}

.rd-blog-stats{
  display:flex; justify-content:center; flex-wrap:wrap; gap:2.5rem;
  margin-top:2.5rem; padding-top:2rem;
  border-top:1px solid rgba(255,255,255,.15);
}
.rd-blog-stat{ text-align:center; }
.rd-blog-stat-num{
  font-family:'Archivo',sans-serif; font-weight:800; font-size:1.7rem; color:#fff; letter-spacing:-.01em;
}
.rd-blog-stat-label{
  font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.5); margin-top:.3rem;
}

/* =========================================================================
   CONTENT SECTION / FILTERS
   ========================================================================= */
.rd-blog-content{ padding:4.5rem 0 5rem; }
@media(min-width:768px){ .rd-blog-content{ padding:5.5rem 0 6.5rem; } }

.filter-btn{
  font-family:'Archivo',sans-serif; font-weight:600; font-size:13px; letter-spacing:.02em;
  padding:.65rem 1.35rem; border-radius:999px;
  border:1.5px solid var(--rd-line) !important;
  background:#fff !important; color:var(--rd-forest) !important;
  transition:border-color .25s ease, color .25s ease, background-color .25s ease;
  cursor:pointer;
}
.filter-btn:hover{ border-color:var(--rd-ember) !important; color:var(--rd-ember) !important; }
.filter-btn.active{
  background:var(--rd-ember) !important; border-color:var(--rd-ember) !important; color:#fff !important;
}

/* =========================================================================
   FEATURED CARD (najnowszy artykuł)
   ========================================================================= */
.rd-featured-card{
  position:relative; display:flex; flex-direction:column; justify-content:flex-end;
  border-radius:6px; overflow:hidden; margin-bottom:3.5rem;
  min-height:400px; background:var(--rd-ink);
  text-decoration:none;
}
@media(min-width:768px){ .rd-featured-card{ min-height:480px; } }
.rd-featured-card .article-image{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform .6s cubic-bezier(.16,1,.3,1);
}
.rd-featured-card:hover .article-image{ transform:scale(1.045); }
.rd-featured-scrim{
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(14,21,18,.1) 0%, rgba(14,21,18,.35) 45%, rgba(14,21,18,.94) 100%);
}
.rd-featured-body{ position:relative; z-index:10; padding:2.25rem 1.75rem; color:#fff; }
@media(min-width:768px){ .rd-featured-body{ padding:3rem 2.75rem; } }
.rd-featured-tag{
  display:inline-block; font-family:'JetBrains Mono',monospace; font-size:9.5px; font-weight:600;
  letter-spacing:.12em; text-transform:uppercase; background:var(--rd-ember); color:#fff;
  border-radius:999px; padding:.34rem .8rem; margin-bottom:1rem;
}
.rd-featured-meta{
  font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.05em; color:rgba(255,255,255,.72);
  display:flex; gap:.7rem; align-items:center; margin-bottom:.85rem; flex-wrap:wrap;
}
.rd-featured-title{
  font-family:'Archivo',sans-serif; font-weight:800; letter-spacing:-.01em;
  font-size:1.7rem; line-height:1.15; color:#fff; margin:0 0 .75rem; max-width:38rem;
}
@media(min-width:768px){ .rd-featured-title{ font-size:2.3rem; } }
.rd-featured-excerpt{
  color:rgba(255,255,255,.82); font-size:.98rem; line-height:1.6; max-width:34rem; margin:0 0 1.35rem;
}
.rd-featured-link{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:'Archivo',sans-serif; font-weight:700; font-size:13.5px; color:#fff;
}
.rd-featured-link svg{ transition:transform .25s ease; width:16px; height:16px; }
.rd-featured-card:hover .rd-featured-link svg{ transform:translateX(3px); }

/* =========================================================================
   ARTICLE CARDS (grid)
   ========================================================================= */
#articlesGrid{
  display:grid; grid-template-columns:1fr; gap:1.75rem;
}
@media(min-width:640px){ #articlesGrid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px){ #articlesGrid{ grid-template-columns:repeat(3,1fr); gap:2rem; } }

.rd-card{
  display:flex; flex-direction:column;
  background:#fff; border:1px solid var(--rd-line); border-radius:4px; overflow:hidden;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  text-decoration:none;
}
.rd-card:hover{
  transform:translateY(-4px);
  box-shadow:0 24px 44px -22px rgba(14,21,18,.22);
  border-color:#cfc8b6;
}
.rd-card-img-wrap{ position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--rd-stone); }
.rd-card-img-wrap .article-image{
  width:100%; height:100%; object-fit:cover;
  transition:transform .6s cubic-bezier(.16,1,.3,1);
}
.rd-card:hover .rd-card-img-wrap .article-image{ transform:scale(1.06); }
.rd-tag{
  position:absolute; top:.85rem; left:.85rem; z-index:5;
  font-family:'JetBrains Mono',monospace; font-size:9.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  background:rgba(255,255,255,.94); color:var(--rd-ember);
  border-radius:999px; padding:.32rem .75rem; backdrop-filter:blur(6px);
}
.rd-card-body{ padding:1.5rem 1.4rem 1.65rem; display:flex; flex-direction:column; flex:1; }
.rd-card-meta{
  font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:.05em; color:var(--rd-muted);
  display:flex; align-items:center; gap:.55rem; margin-bottom:.85rem;
}
.rd-card-title{
  font-family:'Archivo',sans-serif; font-weight:700; font-size:1.05rem; line-height:1.32;
  color:var(--rd-ink); margin:0 0 .6rem; transition:color .2s ease;
}
.rd-card:hover .rd-card-title{ color:var(--rd-ember); }
.rd-card-excerpt{
  color:var(--rd-muted); font-size:.9rem; line-height:1.6; margin:0 0 1.15rem; flex:1;
}
.rd-card-link{
  display:inline-flex; align-items:center; gap:.45rem; margin-top:auto;
  font-family:'Archivo',sans-serif; font-weight:700; font-size:12.5px; letter-spacing:.02em; color:var(--rd-ember);
}
.rd-card-link svg{ transition:transform .2s ease; width:14px; height:14px; }
.rd-card:hover .rd-card-link svg{ transform:translateX(3px); }

/* =========================================================================
   NEWSLETTER
   ========================================================================= */
.rd-newsletter{
  position:relative; background:var(--rd-forest); overflow:hidden; padding:5rem 0;
}
.rd-newsletter-content{ position:relative; z-index:10; max-width:32rem; margin:0 auto; padding:0 1rem; text-align:center; }
.rd-newsletter-content h2{
  font-family:'Archivo',sans-serif; font-weight:800; letter-spacing:-.01em;
  font-size:1.85rem; color:#fff; margin:0 0 .85rem;
}
@media(min-width:768px){ .rd-newsletter-content h2{ font-size:2.25rem; } }
.rd-newsletter-content p{
  color:rgba(255,255,255,.78); font-size:1rem; line-height:1.6; margin:0 0 2rem;
}
.rd-newsletter-form{ display:flex; flex-direction:column; gap:.75rem; max-width:26rem; margin:0 auto; }
@media(min-width:480px){ .rd-newsletter-form{ flex-direction:row; } }
.rd-newsletter-form input{
  flex:1; padding:.85rem 1.1rem; border-radius:4px; border:1.5px solid rgba(255,255,255,.25);
  background:rgba(255,255,255,.08); color:#fff; font-family:'Inter',sans-serif; font-size:.9rem;
}
.rd-newsletter-form input::placeholder{ color:rgba(255,255,255,.5); }
.rd-newsletter-form input:focus{ outline:none; border-color:var(--rd-ember); background:rgba(255,255,255,.12); }

/* =========================================================================
   FOOTER — 1:1 z redesign-cennik.css / redesign-home.css
   ========================================================================= */
footer.rd-footer{ background:var(--rd-ink) !important; color:rgba(255,255,255,.72) !important; }
footer.rd-footer h3{
  font-family:'Archivo',sans-serif !important; font-weight:700 !important; font-size:1rem !important;
}
footer.rd-footer a:hover{ color:var(--rd-ember) !important; }
.rd-footer-bottom{ background:rgba(0,0,0,.15); }

::selection{ background:var(--rd-ember); color:#fff; }

@media (prefers-reduced-motion: reduce){
  .rd-card, .rd-featured-card, .article-image{ transition:none !important; }
}