/* ==========================================================================
   Default page template – scoped to body.thb-page-default / .thb-pd
   Palette and type follow Forside v2 / landing pages:
   greens #334010 / #1a2e05 / #4a5a20, amber #ff8a00, tints #f5f7ee / #e8edda,
   Fira Sans Extra Condensed (display) + Lato (body).
   ========================================================================== */

.thb-pd {
  --pd-green:      #334010;
  --pd-green-dark: #1a2e05;
  --pd-green-mid:  #4a5a20;
  --pd-amber:      #ff8a00;
  --pd-ink:        #1f2a19;
  --pd-ink-2:      #4b5538;
  --pd-ink-3:      #6f7a5c;
  --pd-tint:       #f5f7ee;
  --pd-tint-2:     #e8edda;
  --pd-line:       #d7dbc8;
  --pd-line-2:     #b9c39a;
  --pd-radius:     16px;
  --pd-display:    "Fira Sans Extra Condensed", "Arial Narrow", system-ui, sans-serif;
  --pd-body:       "Lato", "Helvetica Neue", Arial, system-ui, sans-serif;
  --pd-wide:       1040px;   /* figures, html blocks, grids */
  --pd-measure:    720px;    /* running text */
  --pd-gutter:     clamp(16px, 4vw, 40px);

  display: block;
  width: 100%;
  font-family: var(--pd-body);
  color: var(--pd-ink);
  -webkit-font-smoothing: antialiased;
}

.thb-pd *, .thb-pd *::before, .thb-pd *::after { box-sizing: border-box; }

.pd-wrap {
  width: 100%;
  max-width: calc(var(--pd-wide) + 2 * var(--pd-gutter));
  margin-inline: auto;
  padding-inline: var(--pd-gutter);
}

/* ---- Title block ---------------------------------------------------------- */
.pd-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-block: clamp(36px, 6vw, 72px) clamp(32px, 5vw, 60px);
  background:
    radial-gradient(520px 260px at 92% -30%, rgba(255, 138, 0, 0.16), transparent 70%),
    radial-gradient(420px 320px at -10% 120%, rgba(74, 90, 32, 0.10), transparent 70%),
    linear-gradient(180deg, var(--pd-tint-2) 0%, var(--pd-tint) 100%);
  border-bottom: 1px solid var(--pd-line);
}

.pd-crumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin: 0 0 clamp(14px, 2vw, 22px);
  font-family: var(--pd-display);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--pd-green-mid);
  line-height: 1.3;
}
.pd-crumbs a {
  color: var(--pd-green-mid);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color .15s ease, color .15s ease;
}
.pd-crumbs a:hover, .pd-crumbs a:focus-visible { color: var(--pd-green-dark); border-color: var(--pd-line-2); }
.pd-crumbs__sep { color: var(--pd-line-2); font-weight: 400; }
.pd-crumbs__current { color: var(--pd-ink-3); font-weight: 500; }

.pd-title {
  margin: 0;
  max-width: 18ch;
  font-family: var(--pd-display);
  font-weight: 700;
  font-size: clamp(38px, 5.4vw, 64px);
  line-height: 1.02;
  letter-spacing: -0.012em;
  color: var(--pd-green-dark);
  text-wrap: balance;
}

.pd-rule {
  width: 44px;
  height: 3px;
  margin: clamp(18px, 2.4vw, 26px) 0 0;
  border-radius: 2px;
  background: var(--pd-amber);
}

.pd-lead {
  margin: 16px 0 0;
  max-width: 62ch;
  font-size: clamp(17px, 1.5vw, 20px);
  line-height: 1.6;
  color: var(--pd-ink-2);
  text-wrap: pretty;
}

/* ---- Content area -------------------------------------------------------- */
.pd-body {
  padding-block: clamp(32px, 5vw, 64px) clamp(56px, 8vw, 104px);
}

.pd-content { font-size: 18px; line-height: 1.65; }

/* Every direct child is centred; running text gets a readable measure,
   figures / html blocks / grids may use the full width. */
.pd-content > * { margin-inline: auto; max-width: var(--pd-wide); }
.pd-content > :where(p, h2, h3, h4, h5, h6, ul, ol, dl, blockquote, pre, table, hr,
  .wp-block-quote, .wp-block-table, .wp-block-buttons, .wp-block-list, .wp-block-details, .pd-pages) {
  max-width: var(--pd-measure);
}
.pd-content > :first-child { margin-top: 0; }
.pd-content > :last-child { margin-bottom: 0; }

/* First paragraph reads as an intro when the page has no excerpt */
body.thb-page-default:not(.thb-page-default--has-lead) .pd-content > p:first-child {
  font-size: clamp(18px, 1.4vw, 20px);
  color: var(--pd-ink-2);
}

.pd-content p { margin: 0 auto 1.25em; text-wrap: pretty; }

.pd-content h2, .pd-content h3, .pd-content h4 {
  font-family: var(--pd-display);
  font-weight: 700;
  color: var(--pd-green-dark);
  line-height: 1.1;
  letter-spacing: -0.01em;
  text-wrap: balance;
}
.pd-content h2 { font-size: clamp(28px, 3.2vw, 38px); margin: 2.1em auto 0.6em; }
.pd-content h3 { font-size: clamp(22px, 2.4vw, 27px); margin: 1.8em auto 0.5em; }
.pd-content h4 { font-size: 20px; margin: 1.6em auto 0.5em; }
.pd-content h2 + h3, .pd-content h3 + h4 { margin-top: 0.8em; }

.pd-content a:not(.wp-block-button__link) {
  color: var(--pd-green);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-decoration-color: var(--pd-line-2);
  text-underline-offset: 3px;
  transition: color .15s ease, text-decoration-color .15s ease;
}
.pd-content a:not(.wp-block-button__link):hover,
.pd-content a:not(.wp-block-button__link):focus-visible {
  color: var(--pd-green-dark);
  text-decoration-color: currentColor;
}
.pd-content strong, .pd-content b { font-weight: 700; color: var(--pd-green-dark); }

/* Lists */
.pd-content ul, .pd-content ol { margin: 0 auto 1.5em; padding-left: 1.35em; }
.pd-content li { margin: 0 0 0.55em; padding-left: 0.2em; }
.pd-content li::marker { color: var(--pd-green-mid); }
.pd-content ol li::marker { font-family: var(--pd-display); font-weight: 700; }
.pd-content li > ul, .pd-content li > ol { margin: 0.5em 0 0.4em; }

/* Figures, images, embeds */
.pd-content figure, .pd-content .wp-block-image { margin: clamp(28px, 4vw, 48px) auto; }
.pd-content img { max-width: 100%; height: auto; border-radius: var(--pd-radius); }
.pd-content figure svg { display: block; width: 100%; height: auto; }
.pd-content figcaption {
  margin-top: 12px;
  font-size: 15px;
  line-height: 1.5;
  color: var(--pd-ink-3);
  text-align: center;
}
.pd-content .wp-block-embed iframe, .pd-content .wp-block-video video { max-width: 100%; border-radius: var(--pd-radius); }

/* Quotes, rules, tables, code */
.pd-content blockquote, .pd-content .wp-block-quote {
  margin: 2em auto;
  padding: 4px 0 4px 22px;
  border-left: 3px solid var(--pd-amber);
  font-size: 1.05em;
  color: var(--pd-ink-2);
}
.pd-content blockquote p:last-child { margin-bottom: 0; }
.pd-content blockquote cite { display: block; margin-top: 8px; font-size: 15px; font-style: normal; color: var(--pd-ink-3); }

.pd-content hr { margin: 3em auto; border: 0; border-top: 1px solid var(--pd-line); }

.pd-content table { width: 100%; border-collapse: collapse; margin: 2em auto; font-size: 16px; }
.pd-content th, .pd-content td { padding: 12px 14px; border-bottom: 1px solid var(--pd-line); text-align: left; vertical-align: top; }
.pd-content th { font-family: var(--pd-display); font-size: 17px; letter-spacing: 0.02em; color: var(--pd-green-dark); background: var(--pd-tint); }
.pd-content .wp-block-table { overflow-x: auto; }

.pd-content code { font-size: 0.9em; padding: 2px 6px; border-radius: 6px; background: var(--pd-tint-2); }

/* Buttons (Gutenberg) */
.pd-content .wp-block-button__link {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 50px; padding: 0 26px;
  border-radius: 999px; border: 0;
  background: var(--pd-green); color: #fff;
  font-family: var(--pd-body); font-size: 15px; font-weight: 700; text-decoration: none;
  transition: background .15s ease, transform .15s ease;
}
.pd-content .wp-block-button__link:hover { background: var(--pd-green-dark); color: #fff; transform: translateY(-1px); }
.pd-content .is-style-outline .wp-block-button__link { background: transparent; color: var(--pd-green); box-shadow: inset 0 0 0 2px var(--pd-line-2); }

/* Paged content + comments */
.pd-pages { margin-top: 2.5em; font-weight: 700; }
.pd-pages a, .pd-pages .post-page-numbers { display: inline-block; padding: 6px 12px; margin-right: 6px; border-radius: 999px; background: var(--pd-tint-2); }
.pd-comments { margin-top: clamp(40px, 6vw, 72px); }

/* ---- Mobile --------------------------------------------------------------- */
@media (max-width: 640px) {
  .pd-hero { padding-block: 30px 28px; }
  .pd-crumbs { font-size: 12.5px; letter-spacing: 0.12em; margin-bottom: 12px; }
  .pd-title { font-size: clamp(34px, 10vw, 42px); max-width: none; }
  .pd-lead { font-size: 17px; margin-top: 14px; }
  .pd-body { padding-block: 28px 56px; }
  .pd-content { font-size: 17px; line-height: 1.6; }
  .pd-content h2 { font-size: 28px; margin-top: 1.8em; }
  .pd-content h3 { font-size: 22px; }
  .pd-content ul, .pd-content ol { padding-left: 1.2em; }
  .pd-content figure, .pd-content .wp-block-image { margin: 24px auto; }
  .pd-content figcaption { font-size: 14px; }
  .pd-content th, .pd-content td { padding: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .thb-pd * { transition: none !important; }
}

/* Figures/html blocks placed first carry their own inline top margin – drop it */
.pd-content > figure:first-child, .pd-content > style:first-child + figure { margin-top: 0 !important; }
