/**
 * single-product.css — rytm karty produktu: kotwice i dwa domknięcia.
 *
 * Wymaga tokens.css i base.css wczytanych wcześniej.
 * Każdy odstęp pochodzi z var(--dc-*).
 *
 * TO NIE JEST PLIK SEKCJI, choć leży w sections/ — dokładnie jak
 * front-page.css, header.css, footer.css i styleguide.css: pętla
 * w dc_enqueue_assets() wczytuje stąd wszystko, a osobny katalog dla
 * jednego pliku strony byłby nową konwencją bez drugiego przypadku.
 * Stylizuje WYŁĄCZNIE owijkę .dc-single-product__section
 * z woocommerce/single-product.php — nigdy sekcję w środku.
 *
 * ODSTĘPY MIĘDZY SEKCJAMI W WIĘKSZOŚCI TU NIE MIESZKAJĄ. Zmierzone
 * w makiecie product.html (2026-08-30, 1440 / 768 / 390 px — wynik
 * identyczny na każdej z trzech szerokości): KAŻDA sekcja ma 64 px
 * oddechu u góry i u dołu, czyli treść→treść 128 px między każdą parą.
 * Motyw daje te 128 px bez ani jednej reguły tutaj, bo każda sekcja karty
 * produktu niesie .dc-section (64 + 64 z base.css).
 *
 * WYJĄTKÓW JEST DOKŁADNIE DWA i tylko one stoją niżej: makieta domyka FAQ
 * dolnym oddechem 88 px zamiast 64, a sekcję #contact (u nas shared/help-cta)
 * 80 px zamiast 64. Różnicę dokłada STRONA, nie sekcja — obie sekcje są
 * w shared/ i na innych stronach stoją w innym sąsiedztwie (front-page.css
 * dokłada help-cta swoje 16 px z tego samego powodu).
 */

/* ==========================================================================
   1. KOTWICE POD LEPKIM NAGŁÓWKIEM
   Nagłówek jest position: sticky (header.css) i zmierzony ma 61 px przy
   1440 px oraz 65 px przy 768 i 390 px. Bez marginesu przewijania cel
   kotwicy (#reviews z oceny w product/hero) ląduje pod paskiem.
   --dc-space-80 jest pierwszym tokenem odstępu powyżej 65 px; nadwyżka
   15–19 px to oddech między paskiem a górną krawędzią sekcji, nie luz
   do zmierzenia. Ta sama wartość i ten sam powód co w front-page.css.
   Margines stoi na owijce, bo to ona niesie id (reguła 4: kotwica jest
   sprawą strony, nie sekcji).
   ========================================================================== */
.dc-single-product__section {
  scroll-margin-block-start: var(--dc-space-80);
}

/* ==========================================================================
   2. DWA DOMKNIĘCIA Z MAKIETY
   Selektory łączą klasę owijki z identyfikatorem kotwicy, bo dokładnie
   tego dotyczy reguła: nie „każda sekcja FAQ w serwisie", tylko „ta jedna
   pozycja w rytmie TEJ strony". Sekcja w środku zostaje nietknięta,
   a owijka bez identyfikatora nie istnieje.
   64 (sekcja) + 24 = 88 (makieta, faq).
   64 (sekcja) + 16 = 80 (makieta, contact).
   ========================================================================== */
.dc-single-product__section#faq {
  padding-block-end: var(--dc-space-24);
}

.dc-single-product__section#help-cta {
  padding-block-end: var(--dc-space-16);
}