/* ============================================================
   SILERS — Styl ID dla stron spoza paczki projektu
   (blog, dokumenty prawne, audyt KSC, podpis, serwis Garwolin,
   program partnerski, ID CRM). Ładowany PO inline <style> strony:
   przekłada jej stare komponenty na wygląd nowej strony.
   ============================================================ */

/* — stare zmienne stron → paleta Stylu ID — */
:root {
  --bg: #fff; --bg2: #fff; --panel: #fff; --panel2: var(--surface);
  --line: #dedee7; --line2: #cfcfd9;
  --txt: #3c3c47; --txt-dim: var(--muted); --white: var(--ink);
  --blue: var(--purple); --cyan: #7630b0; --green: #0c7a4d; --violet: var(--purple);
  --grad: #7a2fd6; --grad-ai: #7a2fd6;
  --mono: Arial, Helvetica, sans-serif; --r: 0;
  /* tokeny v2 (część stron po 07.10) */
  --paper: #fff; --ink-2: #3c3c47; --ink-3: var(--muted); --rule: #dedee7; --rule-2: #cfcfd9;
  --brand: var(--purple); --brand-ink: #7630b0; --ok: #0c7a4d; --warn: #b45309;
  --head: Arial, Helvetica, sans-serif; --body: Arial, Helvetica, sans-serif;
}
body { background: #fff; color: var(--ink); font-family: Arial, Helvetica, sans-serif; }

/* globalne reguły style.css (h1/h2/p) nie mogą rozdmuchać starej treści —
   :where() = najniższa waga, więc klasy strony nadal wygrywają */
:where(main.legacy) p { margin: 0; }
:where(main.legacy) h1 { font-size: clamp(2.4rem, 4vw, 3.6rem); }
:where(main.legacy) h2 { font-size: clamp(1.7rem, 2.6vw, 2.3rem); }
:where(main.legacy) h3 { font-size: 1.15rem; }
main.legacy h1, main.legacy h2, main.legacy h3, main.legacy h4 {
  font-family: Arial, Helvetica, sans-serif; color: var(--ink); font-weight: 600; letter-spacing: -.035em; line-height: 1.12;
}
main.legacy h3 { letter-spacing: -.02em; }

/* — „hero" starej strony = otwarcie podstrony (jasne, jak .page-intro) — */
main.legacy header, main.legacy .hero {
  position: static; z-index: auto; backdrop-filter: none; background: #fff; color: var(--ink);
  border-bottom: 1px solid var(--line); overflow: visible; padding: 80px 0 60px;
}
main.legacy .glow { display: none !important; }
main.legacy .badge {
  display: block; padding: 0; margin-bottom: 25px; background: none; border: 0; border-radius: 0;
  font-size: .875rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; color: #7631b0;
}
main.legacy .hero h1 { font-size: clamp(2.6rem, 4.3vw, 4rem); line-height: 1.08; letter-spacing: -.045em; margin-bottom: 28px; max-width: 900px; }
main.legacy .grad, main.legacy .grad-ai {
  background: none !important; -webkit-text-fill-color: currentColor !important; color: #7630b0;
}
main.legacy .hero p.lead, main.legacy p.lead { font-size: 1.2rem; line-height: 1.65; color: var(--muted); max-width: 790px; }
main.legacy p.lead strong, main.legacy .hero p.lead strong { color: var(--ink); }
main.legacy .trust { color: var(--muted); font-size: .875rem; }
main.legacy .cta-row { gap: 15px; }

/* — przyciski: jak .btn / .btn.secondary z paczki — */
main.legacy .btn {
  min-height: 54px; padding: 15px 24px; border-radius: 0; font-weight: 700; font-size: .95rem;
  background: #fff; color: var(--ink); border: 1px solid #bcbcc8; box-shadow: none; transform: none;
}
main.legacy .btn:hover { box-shadow: none; transform: none; border-color: var(--ink); }
main.legacy .btn-primary, main.legacy .btn-green, main.legacy .btn-ai {
  background: #7a2fd6; color: #fff; border-color: transparent;
}
main.legacy .btn-primary:hover, main.legacy .btn-green:hover, main.legacy .btn-ai:hover { background: #6624b8; box-shadow: none; border-color: transparent; }
main.legacy .btn-sm { min-height: 44px; padding: 10px 18px; font-size: .875rem; }

/* — sekcje i nagłówki sekcji — */
main.legacy section { padding: 80px 0; }
main.legacy section.bordered { border-top: 1px solid var(--line); }
main.legacy > section.bordered:nth-of-type(even) { background: var(--surface); }
main.legacy h2.sec { text-align: left; font-size: clamp(2rem, 3vw, 2.8rem); letter-spacing: -.045em; max-width: 820px; margin-bottom: 18px; }
main.legacy p.sub { text-align: left; margin: 0 0 44px; max-width: 760px; color: var(--muted); font-size: 1.05rem; }
main.legacy p.sub a, main.legacy .card p a { color: #7630b0; border-bottom: 1px solid #aa75da; }

/* — karty, kroki, liczby: płasko, linie zamiast pudełek z cieniem — */
main.legacy .card, main.legacy .step, main.legacy .stat, main.legacy .box, main.legacy .use, main.legacy .fact,
main.legacy .level, main.legacy .post, main.legacy .product, main.legacy .step-box {
  border-radius: 0; box-shadow: none; background: #fff; border: 1px solid var(--line);
}
main.legacy .card:hover, main.legacy .post:hover, main.legacy .product:hover { transform: none; box-shadow: none; border-color: #ac7fcb; background: #fdfbff; }
main.legacy .card h3, main.legacy .step h3 { font-size: 1.15rem; margin-bottom: 10px; }
main.legacy .card p, main.legacy .step p { color: var(--muted); font-size: .95rem; }
main.legacy .ico { border-radius: 0; background: transparent; border: 1px solid var(--line); }
main.legacy .ico svg { stroke: var(--purple); }
main.legacy .step .n { color: #7830b0; font-weight: 700; letter-spacing: .1em; font-size: .875rem; }
main.legacy .stat .num { color: var(--ink); font-weight: 700; letter-spacing: -.03em; }
main.legacy .stat .num span { color: #7630b0; }
main.legacy .stat .lbl { color: var(--muted); }
main.legacy .chips { justify-content: flex-start; margin: 0; }
main.legacy .chips span { border-radius: 0; background: #fff; border-color: var(--line); color: var(--ink); }
main.legacy .tag { border-radius: 0; }

/* — zrzuty w ramce → .editorial-screen — */
main.legacy .frame { border-radius: 0; background: #eeedf3; border: 1px solid #d3d1dc; box-shadow: none; padding: 14px; }
main.legacy .frame img { border: 1px solid #d3d1dc; background: #fff; }
main.legacy .frame-bar { background: none; border: 0; padding: 0 3px 12px; }
main.legacy .frame-bar span:not(.url) { display: none; }
main.legacy .frame-bar .url { margin: 0; font-size: .875rem; color: #696375; }

/* — boksy wyróżnione / CTA — */
main.legacy .infradesk-box, main.legacy .custom-box, main.legacy .honest, main.legacy .disclaimer, main.legacy .warn {
  background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: 0 !important; box-shadow: none !important;
}
main.legacy .cta-box {
  border-radius: 0; background: var(--dark) !important; color: #fff; border: 0 !important; border-top: 3px solid var(--purple) !important;
  box-shadow: none; text-align: left;
}
main.legacy .cta-box h2 { color: #fff; }
main.legacy .cta-box p { color: #cbc4d5; margin-left: 0; }
main.legacy .cta-box .cta-row { justify-content: flex-start !important; }
main.legacy .cta-box .btn:not(.btn-primary) { background: transparent; color: #fff; border-color: #82768d; }
main.legacy .cta-box .btn:not(.btn-primary):hover { border-color: #fff; }

/* — FAQ jak .faq z paczki: linie, bez pudełek — */
main.legacy details { border: 0; border-top: 1px solid var(--line); border-radius: 0; background: none; margin: 0; }
main.legacy details:last-of-type { border-bottom: 1px solid var(--line); }
main.legacy details summary { padding: 22px 0; font-weight: 600; font-size: 1.1rem; color: var(--ink); }
main.legacy details summary:hover { color: #7630aa; }
main.legacy details[open] summary::after { color: #7630aa; }
main.legacy details .ans { padding: 0 0 22px; color: var(--muted); font-size: 1rem; }
main.legacy details .ans a { color: #7630b0; }

/* — dokumenty prawne, artykuły — */
main.legacy .doc a, main.legacy article a:not(.btn) { color: #7630b0; }
main.legacy code { font-family: ui-monospace, monospace; border-radius: 0; }
main.legacy nav.toc {
  position: static; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; max-height: none; overflow: visible;
  background: none; border: 0; backdrop-filter: none; font-size: .875rem;
}
main.legacy nav.toc a { display: inline-block; padding: 8px 13px; border-radius: 0; background: #fff; border: 1px solid var(--line); color: var(--ink); text-decoration: none; font-size: .875rem; }
main.legacy nav.toc a:hover { border-color: #ac7fcb; color: #7630aa; background: #fdfbff; }
main.legacy table th { font-weight: 700; color: var(--ink); }

@media (max-width: 1000px) {
  main.legacy nav.toc { display: flex; position: static; }
}
@media (max-width: 760px) {
  main.legacy section { padding: 60px 0; }
  main.legacy header, main.legacy .hero { padding: 55px 0 45px; }
}