/* Mind Architect - oddech, spójne ilustracje, oferta w pierwszym ekranie, pasek skrótów (28.10.2026).
   Z dyskusji w społeczności (Elżbieta: ciasno przy oknach Notatnika i nagłówkach; Ola: przygaszone ilustracje
   na początku, wyraziste dalej; Martyna: pierwszy ekran jak zapis do newslettera) i z pomiaru stron.
   Nakładka na motyw "letnie niebo": selektory z html body + !important, bo motyw też ich używa. */

/* --- 1. Więcej powietrza między sekcjami i pod nagłówkami --- */
html body section[id]:not(#mindDecisionHero) { padding-top: 112px !important; padding-bottom: 112px !important; }
html body section[id] h2.section-title, html body section[id] > .container > h2, html body section[id] .text-center > h2 { margin-bottom: 30px !important; }
html body section[id] .section-label, html body section[id] .kv2-eyebrow { margin-bottom: 14px !important; }
@media (max-width: 900px) {
  html body section[id]:not(#mindDecisionHero) { padding-top: 84px !important; padding-bottom: 84px !important; }
}
@media (max-width: 560px) {
  html body section[id]:not(#mindDecisionHero) { padding-top: 72px !important; padding-bottom: 72px !important; }
  html body section[id] h2.section-title { margin-bottom: 24px !important; }
}

/* okna Notatnika: większe odstępy między zrzutami i oddech pod obrazem */
html body #platforma .pf-grid { gap: 44px !important; }
html body #platforma .pf-grid > * img { margin-bottom: 6px; }
html body #platforma .pf-grid figcaption, html body #platforma .pf-grid [class*="caption"], html body #platforma .pf-grid [class*="opis"] { padding-top: 18px !important; line-height: 1.6 !important; }
@media (max-width: 760px) { html body #platforma .pf-grid { gap: 32px !important; } }

/* --- 2. Ilustracje w pełnych kolorach na całej stronie (motyw wypierał kolory tylko filmikom w pętli).
   Wyjątek: .trans-vid ma celowo przyciemnione "przed" w sekcji przemiany. --- */
html body section video:not(.trans-vid), html body main video:not(.trans-vid) { filter: none !important; }

/* --- 3. Pierwszy ekran: co dostajesz i za ile, zaraz pod przyciskami.
   .mind-decision-copy to flex z order na dzieciach: przyciski mają 4, lista "w sześciu modułach" 5. --- */
html body .ma-oferta {
  order: 4; list-style: none; margin: 18px 0 6px; padding: 16px 18px; display: grid; gap: 10px;
  background: rgba(255, 255, 255, .72); border: 1px solid rgba(35, 120, 189, .18); border-radius: 14px;
  box-shadow: 0 10px 30px -18px rgba(31, 109, 176, .45); max-width: 560px;
}
html body .ma-oferta li { display: flex; align-items: flex-start; gap: 10px; margin: 0; font-size: 15px; line-height: 1.45; color: var(--v4-body, #23292f); }
html body .ma-oferta li::before { content: none !important; }
html body .mind-decision-copy > [hidden] { display: none !important; } /* ukryta notka promo dla czatu */
html body .ma-oferta svg { flex: 0 0 20px; width: 20px; height: 20px; margin-top: 1px; color: var(--accent, #2378bd); }
html body .ma-oferta b { font-weight: 600; color: var(--v4-ink, #1d2329); }
/* strony promocyjne: powód promocji z dawnej notki pod przyciskami */
html body .ma-oferta li.ma-oferta__promo { font-weight: 600; color: var(--accent, #2378bd); padding-bottom: 10px; border-bottom: 1px solid rgba(35, 120, 189, .14); }
@media (max-width: 560px) { html body .ma-oferta { padding: 14px; } html body .ma-oferta li { font-size: 14.5px; } }

/* --- 4. Pasek skrótów (telefon i tablet) - pojawia się po zjechaniu z pierwszego ekranu --- */
.ma-skroty { display: none; }
@media (max-width: 900px) {
  .ma-skroty {
    display: block; position: fixed; left: 0; right: 0; z-index: 998; top: var(--ma-skroty-top, 83px);
    background: rgba(242, 247, 251, .96); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    border-bottom: 1px solid rgba(35, 120, 189, .14); box-shadow: 0 8px 18px -14px rgba(31, 109, 176, .5);
    transform: translateY(-120%); opacity: 0; pointer-events: none; transition: transform .25s ease, opacity .25s ease;
  }
  .ma-skroty.ma-skroty--on { transform: none; opacity: 1; pointer-events: auto; }
  .ma-skroty__lista { display: flex; gap: 8px; overflow-x: auto; padding: 9px 14px; margin: 0; list-style: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .ma-skroty__lista::-webkit-scrollbar { display: none; }
  .ma-skroty__lista a {
    display: inline-flex; align-items: center; white-space: nowrap; padding: 7px 13px; border-radius: 999px;
    font: 500 13.5px/1 Inter, system-ui, sans-serif; color: #2b3a47; text-decoration: none;
    background: #fff; border: 1px solid rgba(35, 120, 189, .2);
  }
  .ma-skroty__lista a[aria-current="location"] { background: var(--accent, #2378bd); border-color: var(--accent, #2378bd); color: #fff; }
  html.ma-skroty-aktywne :where(section, main)[id] { scroll-margin-top: calc(var(--ma-skroty-top, 83px) + 64px) !important; }
}
@media (prefers-reduced-motion: reduce) { .ma-skroty { transition: none; } }
