/* post-typography.css
 * Final word on what a Skorwider blog post looks like.
 *
 * The earlier Divi CSS still ships in the page, so we override with high
 * specificity (`html body #page-container …`). Single intent: every page
 * in the blog reads like a magazine column, not a 2018 starter template.
 * Title, subtitle, byline, body, links, lists, blockquotes, figures,
 * headings — all retuned. Empty paragraphs collapse. Double `<br>` becomes
 * one paragraph break.
 */

html body #page-container {
  /* The post page lives at a max-width inside the Divi container. We widen
     it slightly so the body column stops feeling newspaper-narrow on
     desktop, and on mobile we set it almost to the viewport edges. */
  --post-content-width: 720px;
}

@media (min-width: 980px) {
  html body #page-container .et_pb_post_title_0_tb_body,
  html body #page-container .et_pb_post_content_0_tb_body {
    max-width: var(--post-content-width);
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* ---- 1. Title ---------------------------------------------------------- */

html body #page-container h1.entry-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 700;
  /* Big on desktop, but never larger than the page-frame can hold. */
  font-size: clamp(28px, 4.4vw, 44px);
  line-height: 1.14;
  letter-spacing: -0.01em;
  color: #14181f;
  margin: 0 0 0.4em;
  text-align: left;
  text-transform: none;
}

/* The eyebrow line above the title ("Aktualności · 12 gru 2026") */
html body #page-container .et_pb_post_title_0_tb_body .et_pb_module_header,
html body #page-container .et_pb_post_title_0_tb_body .entry-published,
html body #page-container .et_pb_title_meta_container {
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2.2px;
  text-transform: uppercase;
  color: var(--color-brand-pink, #e6157a);
  margin: 0 0 14px;
}

/* ---- 2. Body ----------------------------------------------------------- */

html body #page-container .et_pb_post_content_0_tb_body {
  --post-body-font: 'Lora', Georgia, 'Times New Roman', serif;
  --post-body-color: #2c2f33;
  --post-body-faint: #6a7280;
  --post-body-link: #e6157a;
  --post-body-rule: rgba(20, 24, 31, 0.08);

  font-family: var(--post-body-font);
  font-size: 18px;
  line-height: 1.72;
  color: var(--post-body-color);
  text-align: left;
  letter-spacing: 0;
  word-wrap: break-word;
  overflow-wrap: anywhere;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Paragraphs — generous breath, a touch lighter at the top of the article */
html body #page-container .et_pb_post_content_0_tb_body p {
  margin: 0 0 1.18em;
  padding: 0;
}

html body #page-container .et_pb_post_content_0_tb_body > p:first-of-type {
  font-size: 1.06em;
  line-height: 1.68;
  color: #3a3f47;
}

/* Empty paragraphs collapse so a stray `<p></p>` does not shove the next
 * sentence down a whole paragraph-height. */
html body #page-container .et_pb_post_content_0_tb_body p:empty {
  margin: 0;
  height: 0;
}

/* A leading `<br>` at the start of a paragraph is a forgotten CRLF from the
 * CMS; a trailing one is a Save-As-Draft artefact. Both visually disappear. */
html body #page-container .et_pb_post_content_0_tb_body p > br:first-child,
html body #page-container .et_pb_post_content_0_tb_body p > br:last-child {
  display: none;
}

/* Two `<br><br>` in a row used to mean "new paragraph". Honour it once,
 * margin-wise, then read on. */
html body #page-container .et_pb_post_content_0_tb_body br + br {
  display: block;
  content: "";
  margin: 0.6em 0;
}
html body #page-container .et_pb_post_content_0_tb_body p br + br {
  margin: 0;
  display: none; /* the <p> above already provides the spacing */
}

/* Headings — Playfair, ink-black, generous above, tight below */
html body #page-container .et_pb_post_content_0_tb_body h2,
html body #page-container .et_pb_post_content_0_tb_body h3,
html body #page-container .et_pb_post_content_0_tb_body h4,
html body #page-container .et_pb_post_content_0_tb_body h5 {
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 600;
  letter-spacing: 0;
  color: #14181f;
  line-height: 1.28;
  text-align: left;
}
html body #page-container .et_pb_post_content_0_tb_body h2 {
  font-size: 30px;
  margin: 2em 0 0.55em;
}
html body #page-container .et_pb_post_content_0_tb_body h3 {
  font-size: 23px;
  margin: 1.7em 0 0.45em;
}
html body #page-container .et_pb_post_content_0_tb_body h4 {
  font-size: 19px;
  margin: 1.5em 0 0.4em;
}
html body #page-container .et_pb_post_content_0_tb_body h2:first-child,
html body #page-container .et_pb_post_content_0_tb_body h3:first-child,
html body #page-container .et_pb_post_content_0_tb_body h4:first-child {
  margin-top: 0;
}

/* Inline emphasis */
html body #page-container .et_pb_post_content_0_tb_body strong,
html body #page-container .et_pb_post_content_0_tb_body b {
  font-weight: 600;
  color: #14181f;
}
html body #page-container .et_pb_post_content_0_tb_body em,
html body #page-container .et_pb_post_content_0_tb_body i {
  font-style: italic;
  color: #14181f;
}

/* Anchors — brand pink, no noisy underline, a hair-thin lift on hover */
html body #page-container .et_pb_post_content_0_tb_body a,
html body #page-container .et_pb_post_content_0_tb_body p a,
html body #page-container .et_pb_post_content_0_tb_body li a {
  color: var(--post-body-link);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: rgba(230, 21, 122, 0.32);
  transition: text-decoration-color 0.2s ease, color 0.2s ease;
}
html body #page-container .et_pb_post_content_0_tb_body a:hover,
html body #page-container .et_pb_post_content_0_tb_body p a:hover,
html body #page-container .et_pb_post_content_0_tb_body li a:hover {
  color: var(--post-body-link);
  text-decoration-color: var(--post-body-link);
}

/* Lists — Discriminative spacing, never flush with the paragraph gutter */
html body #page-container .et_pb_post_content_0_tb_body ul,
html body #page-container .et_pb_post_content_0_tb_body ol {
  margin: 0 0 1.18em 1.6em;
  padding: 0;
}
html body #page-container .et_pb_post_content_0_tb_body li {
  margin: 0.45em 0;
  line-height: 1.66;
}
html body #page-container .et_pb_post_content_0_tb_body ul li {
  list-style: disc;
}
html body #page-container .et_pb_post_content_0_tb_body ul ul {
  list-style: circle;
  margin-bottom: 0;
}

/* Blockquote — rule on the left, quieter indentation */
html body #page-container .et_pb_post_content_0_tb_body blockquote,
html body #page-container .et_pb_post_content_0_tb_body .wp-block-quote {
  font-family: 'Playfair Display', Georgia, serif;
  font-style: italic;
  font-weight: 500;
  font-size: 1.16em;
  line-height: 1.55;
  margin: 1.5em 0 1.5em 0;
  padding: 0.2em 0 0.2em 1.2em;
  border-left: 2px solid var(--post-body-link);
  color: #14181f;
}
html body #page-container .et_pb_post_content_0_tb_body blockquote p {
  margin: 0 0 0.6em;
}
html body #page-container .et_pb_post_content_0_tb_body blockquote cite,
html body #page-container .et_pb_post_content_0_tb_body blockquote footer {
  display: block;
  margin-top: 0.6em;
  font-family: 'Poppins', system-ui, sans-serif;
  font-style: normal;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--post-body-faint);
}

/* Figures and images — straight, with breathing room */
html body #page-container .et_pb_post_content_0_tb_body figure,
html body #page-container .et_pb_post_content_0_tb_body .wp-block-image,
html body #page-container .et_pb_post_content_0_tb_body img {
  max-width: 100%;
  height: auto;
}
html body #page-container .et_pb_post_content_0_tb_body figure,
html body #page-container .et_pb_post_content_0_tb_body .wp-block-image {
  margin: 1.6em 0;
}
html body #page-container .et_pb_post_content_0_tb_body figcaption,
html body #page-container .et_pb_post_content_0_tb_body .wp-caption-text {
  display: block;
  margin-top: 0.55em;
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: var(--post-body-faint);
  letter-spacing: 0.02em;
}

/* Tables — thin rules, never the Divi zebra default */
html body #page-container .et_pb_post_content_0_tb_body table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.4em 0;
  font-size: 0.94em;
  line-height: 1.55;
}
html body #page-container .et_pb_post_content_0_tb_body th,
html body #page-container .et_pb_post_content_0_tb_body td {
  padding: 0.7em 0.9em;
  border-bottom: 1px solid var(--post-body-rule);
  text-align: left;
  vertical-align: top;
}
html body #page-container .et_pb_post_content_0_tb_body th {
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: #14181f;
  border-bottom: 1px solid #14181f;
}

/* Code — monospace but quiet, used very rarely in this site */
html body #page-container .et_pb_post_content_0_tb_body code,
html body #page-container .et_pb_post_content_0_tb_body kbd {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.92em;
  background: #f5f5f7;
  padding: 0.12em 0.38em;
  border-radius: 2px;
  color: #14181f;
}
html body #page-container .et_pb_post_content_0_tb_body pre {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.92em;
  background: #f5f5f7;
  padding: 1em 1.1em;
  margin: 1.4em 0;
  overflow-x: auto;
  border-radius: 2px;
  line-height: 1.55;
}
html body #page-container .et_pb_post_content_0_tb_body pre code {
  background: transparent;
  padding: 0;
}

/* Horizontal rule — invisible by design unless the author added one */
html body #page-container .et_pb_post_content_0_tb_body hr {
  border: 0;
  border-top: 1px solid var(--post-body-rule);
  margin: 2.2em 0;
}

/* Mobile (single column) — let the body breathe, slightly smaller */
@media (max-width: 760px) {
  html body #page-container h1.entry-title {
    font-size: 28px;
    line-height: 1.18;
    margin: 0 0 0.5em;
  }
  html body #page-container .et_pb_post_content_0_tb_body {
    font-size: 17px;
    line-height: 1.66;
  }
  html body #page-container .et_pb_post_content_0_tb_body > p:first-of-type {
    font-size: 1.04em;
    line-height: 1.62;
  }
  html body #page-container .et_pb_post_content_0_tb_body h2 {
    font-size: 24px;
    margin: 1.6em 0 0.5em;
  }
  html body #page-container .et_pb_post_content_0_tb_body h3 {
    font-size: 20px;
    margin: 1.4em 0 0.45em;
  }
  html body #page-container .et_pb_post_content_0_tb_body h4 {
    font-size: 17.5px;
  }
  html body #page-container .et_pb_post_content_0_tb_body blockquote {
    font-size: 1.06em;
    padding: 0.2em 0 0.2em 1em;
  }
}