/* ============================================================
   KOMINY ZE STALI NIERDZEWNEJ — strona-archiwum
   Pasek pigułek u góry przełącza (bez przeładowania) widoczny panel:
   zbiorczy widok "Kominy ze stali nierdzewnej" (wszystkie 6 zestawów)
   albo jeden z 3 rodzajów montażu (2 zestawy: Ø150mm / Ø200mm). Karty
   produktów to zwykłe .product-card z style.css/woocommerce.css —
   ta reguła dokłada tylko układ pigułek/paneli specyficzny dla tej strony.
   Ładowana tylko na stronie z szablonem "page-kominy.php".
   ============================================================ */

.kominy-hero { padding-bottom: 0; }

/* --- pasek pigułek: przyciski (3 rodzaje montażu + zbiorczy) obok linku
   (Oferta indywidualna, prowadzi na zewnątrz do konfiguratora) --- */
.shop-cat-strip-item { background: none; border: none; padding: 0; cursor: pointer; font: inherit; }
.kominy-pill-link .shop-cat-strip-img { position: relative; }
.kominy-pill-ext {
  position: absolute; bottom: -2px; right: -2px; width: 22px; height: 22px; border-radius: 50%;
  background: var(--dark); border: 2px solid var(--white); display: flex; align-items: center; justify-content: center;
}
.kominy-pill-ext svg { width: 11px; height: 11px; }
.shop-cat-strip-img svg { width: 34px; height: 34px; color: var(--ink); }

/* --- panele przełączane pigułkami --- */
.kominy-panels { padding-top: 0.5rem; }
.kominy-panel { opacity: 0; transform: translateY(6px); transition: opacity 0.22s ease, transform 0.22s ease; }
.kominy-panel.panel-in { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) { .kominy-panel { transition: none; } }

.kominy-typ-group + .kominy-typ-group { margin-top: 3.5rem; padding-top: 3.5rem; border-top: 1px solid var(--border); }

.kominy-typ-header { text-align: center; max-width: 680px; margin: 0 auto 2.25rem; }
.kominy-typ-header .section-title { margin-bottom: 0.6rem; }

.kominy-variant-grid {
  display: grid; grid-template-columns: repeat(2, minmax(320px, 1fr));
  gap: 2rem; max-width: 1180px; margin: 0 auto; padding: 0 1.25rem;
}
@media (max-width: 700px) { .kominy-variant-grid { grid-template-columns: 1fr; } }

/* --- znaczek średnicy na zdjęciu produktu (Ø150 / Ø200) --- */
.product-card-img { position: relative; }
.kominy-variant-badge {
  position: absolute; top: 0.9rem; left: 0.9rem; z-index: 2; background: var(--dark); color: var(--white);
  font-size: 0.76rem; font-weight: 800; padding: 0.3rem 0.7rem; border-radius: 999px;
}

/* --- czym jest komin --- */
.kominy-info-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; max-width: 1000px; margin: 0 auto; padding: 0 1.25rem; }
@media (max-width: 800px) { .kominy-info-grid { grid-template-columns: 1fr; } }
.kominy-info-card { background: var(--alt); border-radius: 14px; padding: 1.5rem; }
.kominy-info-card h3 { font-size: 1rem; margin-bottom: 0.5rem; }
.kominy-info-card p { font-size: 0.85rem; color: var(--ink-muted); margin: 0; }

/* --- FAQ --- */
.kominy-faq-list { max-width: 720px; margin: 0 auto; padding: 0 1.25rem; display: flex; flex-direction: column; gap: 0.75rem; }
.kominy-faq-item { background: var(--alt); border-radius: 12px; padding: 1.1rem 1.4rem; }
.kominy-faq-item summary {
  cursor: pointer; font-weight: 700; font-size: 0.94rem; list-style: none; display: flex; align-items: center;
  justify-content: space-between;
}
.kominy-faq-item summary::-webkit-details-marker { display: none; }
.kominy-faq-item summary::after { content: '+'; font-size: 1.3rem; color: var(--yellow); margin-left: 1rem; flex-shrink: 0; }
.kominy-faq-item[open] summary::after { content: '\2212'; }
.kominy-faq-item p { font-size: 0.86rem; color: var(--ink-muted); margin: 0.9rem 0 0; }