/* =========================================================================
   Rowerowa Osada — REDESIGN cennik.html (wizualizacja / prototyp)
   Ładowany WYŁĄCZNIE na cennik.html — nie wpływa na inne strony.
   Zasada: KEEP THE OFFER — REPLACE THE VISUAL LAYER.
   Ceny, kategorie, zdjęcia rowerów i linki (reservation.html, cennik.html,
   rowery-*.html) pozostają dokładnie takie same jak w produkcyjnym
   cennik.html — ten plik zmienia wyłącznie markup prezentacji i CSS.
   Tokeny/navbar/footer/przyciski są 1:1 z redesign-home.css (ten sam
   design system co strona główna), zduplikowane tu zgodnie z konwencją
   już przyjętą dla 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 / reservation.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);
}
.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 (footer) — 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 — cennik
   ========================================================================= */
.rd-cennik-hero{
  position:relative;
  min-height:52vh;
  display:flex; align-items:flex-end;
  overflow:hidden;
  background:var(--rd-ink);
  padding-top:5rem;
}
@media(min-width:768px){ .rd-cennik-hero{ min-height:58vh; } }
.rd-cennik-hero-bg{ position:absolute; inset:0; z-index:0; }
.rd-cennik-hero-bg img{ width:100%; height:100%; object-fit:cover; object-position:center 35%; }
.rd-cennik-hero-scrim{
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(14,21,18,.55) 0%, rgba(14,21,18,.30) 40%, rgba(14,21,18,.92) 100%);
}
.rd-cennik-hero-content{ position:relative; z-index:10; width:100%; padding:3.5rem 0 3rem; }

.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;
  max-width:100%;
}
.rd-eyebrow .rd-accent{ color:var(--rd-ember); }
.rd-eyebrow-dot{ width:5px; height:5px; border-radius:999px; background:var(--rd-ember); flex-shrink:0; margin-top:.15em; align-self:flex-start; }
@media(max-width:479px){
  .rd-eyebrow{ font-size:9.5px; letter-spacing:.1em; border-radius:14px; line-height:1.5; align-items:flex-start; }
}

.rd-cennik-h1{
  font-family:'Bebas Neue', ui-sans-serif, sans-serif;
  text-transform:uppercase;
  color:#fff;
  line-height:.94;
  letter-spacing:.01em;
  font-size:12vw;
  margin:0;
}
@media(min-width:640px){ .rd-cennik-h1{ font-size:5.2rem; } }
@media(min-width:1024px){ .rd-cennik-h1{ font-size:6.5rem; } }
.rd-cennik-h1 .rd-accent{ color:var(--rd-ember); }

.rd-cennik-hero-desc{
  color:rgba(255,255,255,.82);
  font-size:1.05rem; line-height:1.6; max-width:36rem;
  margin-top:1.1rem;
}

.rd-cennik-coords{
  margin-top:2rem; padding-top:1.5rem;
  border-top:1px solid rgba(255,255,255,.15);
  display:flex; flex-wrap:wrap; gap:1.75rem 2.5rem;
}
.rd-coord-item{ display:flex; flex-direction:column; gap:.15rem; }
.rd-coord-label{
  font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.5);
}
.rd-coord-val{
  font-family:'JetBrains Mono',monospace; font-size:13px; color:rgba(255,255,255,.92);
}

/* =========================================================================
   INTRO / SEO tekst + "Dlaczego warto" jako karty
   ========================================================================= */
.rd-intro-section{ padding:5rem 0 1rem; }
@media(min-width:768px){ .rd-intro-section{ padding:6.5rem 0 1.5rem; } }
.rd-section-eyebrow{
  font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--rd-ember);
  display:inline-block;
  margin-bottom:1rem;
}
.rd-intro-heading{
  font-family:'Archivo',sans-serif; font-weight:800; letter-spacing:-.02em; line-height:1.05;
  font-size:2rem; color:var(--rd-forest); max-width:42rem;
}
@media(min-width:640px){ .rd-intro-heading{ font-size:2.5rem; } }
@media(min-width:1024px){ .rd-intro-heading{ font-size:3rem; } }
.rd-intro-text p{
  color:var(--rd-muted); font-size:1.02rem; line-height:1.7; margin:0 0 1.1rem;
}
.rd-intro-text strong{ color:var(--rd-ink); font-weight:700; }
.rd-intro-text .rd-hl{ color:var(--rd-ember); font-weight:600; }

.rd-why-grid{
  display:grid; grid-template-columns:1fr; gap:1rem; margin-top:2.5rem;
}
@media(min-width:640px){ .rd-why-grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px){ .rd-why-grid{ grid-template-columns:repeat(4,1fr); gap:1.25rem; } }
.rd-why-card{
  background:#fff; border:1px solid var(--rd-line); border-radius:4px;
  padding:1.5rem 1.35rem;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.rd-why-card:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 40px -20px rgba(14,21,18,.2);
  border-color:var(--rd-ember);
}
.rd-why-num{
  font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--rd-ember); letter-spacing:.08em;
  margin-bottom:.85rem; display:block;
}
.rd-why-title{
  font-family:'Archivo',sans-serif; font-weight:700; font-size:1rem; color:var(--rd-forest);
  line-height:1.35;
}

/* =========================================================================
   NAGŁÓWEK KATEGORII (numeracja edytorska)
   ========================================================================= */
.rd-cat-section{ padding:4.5rem 0; border-top:1px solid var(--rd-line); }
.rd-cat-section:first-of-type{ border-top:none; }
.rd-cat-head{
  display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1.5rem;
  margin-bottom:2.75rem;
}
.rd-cat-head-left{ display:flex; align-items:flex-start; gap:1.25rem; }
.rd-cat-num{
  font-family:'JetBrains Mono',monospace; font-weight:600; font-size:13px;
  color:var(--rd-ember);
  border:1px solid var(--rd-line); border-radius:999px;
  width:42px; height:42px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  margin-top:.3rem;
}
.rd-cat-heading{
  font-family:'Archivo',sans-serif; font-weight:800; letter-spacing:-.02em; line-height:.98;
  font-size:2.1rem; color:var(--rd-ink); margin:0;
}
@media(min-width:640px){ .rd-cat-heading{ font-size:2.6rem; } }
@media(min-width:1024px){ .rd-cat-heading{ font-size:3.1rem; } }
.rd-cat-sub{
  font-family:'JetBrains Mono',monospace; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--rd-muted); margin-top:.5rem;
}
.rd-cat-desc{
  color:var(--rd-muted); font-size:.98rem; line-height:1.7; max-width:38rem;
}

/* =========================================================================
   KARTY PRODUKTOWE (rowery)
   ========================================================================= */
.rd-product-grid{
  display:grid; grid-template-columns:1fr; gap:1.5rem;
}
@media(min-width:640px){ .rd-product-grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1280px){ .rd-product-grid{ grid-template-columns:repeat(4,1fr); gap:1.5rem; } }

.rd-product-card{
  position:relative;
  background:#fff;
  border:1.5px solid var(--rd-line);
  border-radius:6px;
  overflow:hidden;
  display:flex; flex-direction:column;
  transition:border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.rd-product-card:hover{
  transform:translateY(-4px);
  border-color:#cfc8b6;
  box-shadow:0 24px 44px -22px rgba(14,21,18,.28);
}
.rd-product-card.rd-featured{
  border-color:var(--rd-ember);
  box-shadow:0 0 0 1px var(--rd-ember);
}
.rd-featured-tag{
  position:absolute; top:.9rem; left:.9rem; z-index:5;
  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:.32rem .7rem;
}

.rd-product-img-wrap{
  position:relative;
  background:linear-gradient(180deg, var(--rd-surface) 0%, #fff 100%);
  border-bottom:1px solid var(--rd-line);
  padding:1.75rem 1.25rem 1.1rem;
  display:flex; align-items:center; justify-content:center;
  min-height:190px;
  overflow:hidden;
}
.rd-product-img-wrap img{
  width:100%; height:170px; object-fit:contain;
  filter:drop-shadow(0 18px 22px rgba(14,21,18,.18));
  transition:transform .4s cubic-bezier(.16,1,.3,1);
}
.rd-product-card:hover .rd-product-img-wrap img{ transform:scale(1.035); }

.rd-product-body{ padding:1.25rem 1.35rem 1.35rem; display:flex; flex-direction:column; flex:1; }
.rd-product-name{
  font-family:'Archivo',sans-serif; font-weight:800; font-size:1.02rem; letter-spacing:-.01em;
  color:var(--rd-ink); margin:0 0 .3rem; line-height:1.25;
}
.rd-product-tagline{
  font-family:'Inter',sans-serif; font-size:12.5px; color:var(--rd-muted); margin:0 0 1.1rem;
  line-height:1.4;
}

.rd-price-rows{ border-top:1px solid var(--rd-line); margin-bottom:1.15rem; }
.rd-price-row{
  display:flex; align-items:center; justify-content:space-between;
  padding:.6rem 0; border-bottom:1px solid var(--rd-line);
}
.rd-price-row:last-child{ border-bottom:none; }
.rd-price-period{
  font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.04em; text-transform:uppercase;
  color:var(--rd-muted);
}
.rd-price-amount{
  font-family:'Archivo',sans-serif; font-weight:800; font-size:1.15rem; color:var(--rd-ember);
}

.rd-product-cta{
  margin-top:auto; width:100%;
  display:flex; align-items:center; justify-content:center; gap:.45rem;
  font-family:'Archivo',sans-serif; font-weight:700; font-size:12.5px; text-transform:uppercase; letter-spacing:.03em;
  border:1.5px solid var(--rd-ink); color:var(--rd-ink); background:#fff;
  border-radius:4px; padding:.72rem; min-height:44px;
  transition:background-color .2s ease, color .2s ease;
}
.rd-product-cta:hover{ background:var(--rd-ink); color:#fff; }
.rd-product-cta svg{ width:15px; height:15px; }

/* =========================================================================
   AKCESORIA — kompaktowe karty
   ========================================================================= */
.rd-accessory-grid{
  display:grid; grid-template-columns:repeat(2,1fr); gap:1rem;
}
@media(min-width:640px){ .rd-accessory-grid{ grid-template-columns:repeat(4,1fr); gap:1.25rem; } }
.rd-accessory-card{
  background:#fff; border:1.5px solid var(--rd-line); border-radius:6px;
  padding:1.35rem 1.15rem; text-align:center;
  transition:border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.rd-accessory-card:hover{
  transform:translateY(-3px); border-color:#cfc8b6;
  box-shadow:0 16px 30px -18px rgba(14,21,18,.24);
}
.rd-accessory-img-wrap{
  height:88px; display:flex; align-items:center; justify-content:center; margin-bottom:1rem;
}
.rd-accessory-img-wrap img{
  max-width:100%; max-height:100%; object-fit:contain;
  filter:drop-shadow(0 10px 14px rgba(14,21,18,.16));
}
.rd-accessory-name{
  font-family:'Archivo',sans-serif; font-weight:700; font-size:.85rem; letter-spacing:.01em;
  color:var(--rd-ink); margin:0 0 .2rem;
}
.rd-accessory-tagline{
  font-family:'Inter',sans-serif; font-size:11px; color:var(--rd-muted); margin:0 0 .85rem; line-height:1.35;
  min-height:2.4em;
}
.rd-accessory-price{
  font-family:'Archivo',sans-serif; font-weight:800; font-size:1.15rem; color:var(--rd-ember);
}
.rd-accessory-period{
  font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--rd-muted); margin-top:.15rem;
}

/* =========================================================================
   FINALNE CTA
   ========================================================================= */
.rd-final-cta{
  margin:2rem 0 5rem;
  background:var(--rd-forest);
  border-radius:6px;
  padding:3rem 2rem;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.rd-final-cta::before{
  content:"";
  position:absolute; inset:0;
  background-image:
    repeating-radial-gradient(circle at 20% 30%, rgba(255,255,255,.04) 0, rgba(255,255,255,.04) 1px, transparent 1px, transparent 32px),
    repeating-radial-gradient(circle at 80% 70%, rgba(255,255,255,.04) 0, rgba(255,255,255,.04) 1px, transparent 1px, transparent 44px);
}
.rd-final-cta-inner{ position:relative; z-index:1; }
.rd-final-cta-eyebrow{
  font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(255,255,255,.6); margin-bottom:.85rem; display:block;
}
.rd-final-cta h2{
  font-family:'Archivo',sans-serif; font-weight:800; letter-spacing:-.02em;
  font-size:1.9rem; color:#fff; margin:0 0 .75rem;
}
@media(min-width:640px){ .rd-final-cta h2{ font-size:2.4rem; } }
.rd-final-cta p{
  color:rgba(255,255,255,.75); font-size:1rem; max-width:34rem; margin:0 auto 1.75rem;
}

/* =========================================================================
   FOOTER — 1:1 z 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-product-card, .rd-why-card, .rd-accessory-card{ transition:none !important; }
}
