/* ============================================================
   Strony prawne (regulamin, polityka, kontakt…) — spójne z index.
   Bazuje na zmiennych z home.css (--h-*). Ładowane PO home.css.
   ============================================================ */

.legal-body-page {
  background: var(--h-paper); color: var(--h-ink);
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* Topbar: link „Wróć do sklepu" po prawej */
.home-topbar .co-back {
  color: var(--h-soft); text-decoration: none; font-size: 14px; font-weight: 500;
  white-space: nowrap; transition: color .15s;
}
.home-topbar .co-back:hover { color: var(--h-gold-dk); }

/* Kontener treści */
.legal-wrap { max-width: 820px; margin: 0 auto; padding: 0 22px 50px; }

/* Okruszki */
.legal-crumbs {
  display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--h-soft);
  padding: 24px 0 18px;
}
.legal-crumbs a { color: var(--h-gold-dk); text-decoration: none; }
.legal-crumbs a:hover { text-decoration: underline; }
.legal-crumbs span:last-child { color: var(--h-ink); }

/* Karta artykułu */
.legal-card {
  background: var(--h-card); border: 1px solid var(--h-line); border-radius: 14px;
  padding: 36px 40px; box-shadow: 0 8px 26px rgba(43,40,36,.06);
}
.legal-card h1 {
  font-family: var(--display, 'Space Grotesk', sans-serif); font-size: 30px; color: var(--h-ink);
  margin: 0 0 22px; font-weight: 700; letter-spacing: -.01em;
}

/* Treść z panelu (HTML z bazy) — typografia w motywie */
.legal-body { color: #4b463d; font-size: 15.5px; line-height: 1.72; }
.legal-body h2 {
  font-family: var(--display, 'Space Grotesk', sans-serif); font-size: 21px; color: var(--h-ink);
  margin: 30px 0 12px; font-weight: 700;
}
.legal-body h3 { font-size: 17px; color: var(--h-ink); margin: 22px 0 10px; font-weight: 600; }
.legal-body p { margin: 0 0 14px; }
.legal-body ul, .legal-body ol { margin: 0 0 16px; padding-left: 22px; }
.legal-body li { margin-bottom: 7px; }
.legal-body a { color: var(--h-gold-dk); text-decoration: underline; }
.legal-body a:hover { color: var(--h-gold); }
.legal-body strong { color: var(--h-ink); font-weight: 600; }
.legal-body table { width: 100%; border-collapse: collapse; margin: 0 0 18px; font-size: 14.5px; }
.legal-body th, .legal-body td { border: 1px solid var(--h-line); padding: 9px 12px; text-align: left; }
.legal-body th { background: var(--h-panel); font-weight: 600; color: var(--h-ink); }
.legal-body hr { border: 0; border-top: 1px solid var(--h-line); margin: 26px 0; }

/* Link powrotu pod kartą */
.legal-back-link { margin: 24px 0 0; }
.legal-back-link a { color: var(--h-gold-dk); text-decoration: none; font-weight: 500; font-size: 14px; }
.legal-back-link a:hover { text-decoration: underline; }

@media (max-width: 640px) {
  .legal-card { padding: 26px 22px; }
  .legal-card h1 { font-size: 25px; }
}

/* ============================================================
   Strona Kontakt — dane firmy + formularz (motyw strony głównej)
   ============================================================ */
.contact-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 28px; align-items: start; }

/* Dane firmy */
.contact-info { font-size: 15px; color: #4b463d; line-height: 1.7; }
.contact-info h2 { font-family: var(--display, 'Space Grotesk', sans-serif); font-size: 20px; color: var(--h-ink); margin: 0 0 14px; font-weight: 700; }
.ci-list { list-style: none; margin: 0; padding: 0; }
.ci-list li { display: flex; gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--h-line); }
.ci-list li:last-child { border-bottom: 0; }
.ci-name { color: var(--h-soft); min-width: 90px; font-size: 14px; }
.contact-info a { color: var(--h-gold-dk); text-decoration: none; }
.contact-info a:hover { text-decoration: underline; }

/* Formularz */
.contact-form-wrap { }
.contact-form-wrap h2 { font-family: var(--display, 'Space Grotesk', sans-serif); font-size: 20px; color: var(--h-ink); margin: 0 0 14px; font-weight: 700; }
.cf-field { margin-bottom: 14px; }
.cf-field label { display: block; font-size: 14px; font-weight: 500; color: var(--h-ink); margin-bottom: 6px; }
.cf-field input, .cf-field textarea {
  width: 100%; padding: 10px 13px; border: 1px solid var(--h-line2); border-radius: 9px;
  font-size: 15px; font-family: inherit; color: var(--h-ink); background: #fff; transition: border-color .15s, box-shadow .15s;
}
.cf-field input:focus, .cf-field textarea:focus { outline: none; border-color: var(--h-gold); box-shadow: 0 0 0 3px rgba(193,154,62,.14); }
.cf-field textarea { min-height: 130px; resize: vertical; }
.cf-error { display: block; color: #c0392b; font-size: 13px; margin-top: 5px; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Przycisk wyślij — złoty (zamiast miętowego btn-primary) */
.contact-form .btn, .contact-form button[type="submit"] {
  background: var(--h-gold); color: #fff; border: 0; padding: 12px 26px; border-radius: 10px;
  font-size: 15px; font-weight: 600; cursor: pointer; font-family: inherit; transition: background .15s;
}
.contact-form .btn:hover, .contact-form button[type="submit"]:hover { background: var(--h-gold-dk); }

/* Komunikaty */
.contact-ok { background: #eef6ea; border: 1px solid #cfe4c3; color: #3a6b2a; padding: 14px 16px; border-radius: 10px; margin-bottom: 18px; font-size: 15px; }
.contact-err { background: #fbeaea; border: 1px solid #f0cccc; color: #c0392b; padding: 14px 16px; border-radius: 10px; margin-bottom: 18px; font-size: 15px; }
.subtle { color: var(--h-soft); font-size: 13px; }

@media (max-width: 640px) {
  .contact-grid { grid-template-columns: 1fr; gap: 22px; }
}