.custom-home-page { padding: clamp(24px,5vw,80px) 20px; background: var(--color-page-bg,#f7f8f5); }
.custom-block {
  width: min(100%,840px);
  margin: 0 auto 20px;
  padding: clamp(18px,3vw,40px);
  border-radius: 20px;
  color: var(--text-color, #17243b);
  overflow-wrap: anywhere;
}
.custom-block.width-wide { width: min(100%,1240px); }
.custom-block.tone-plain { background: transparent; }
.custom-block.tone-soft { background: color-mix(in srgb,var(--color-accent,#2563eb) 7%,white); }
.custom-block.tone-accent { background: var(--color-feature-bg,#f1c83a); color: var(--color-feature-text,#1d0303); }
.custom-block.tone-dark { background: #142536; color: #f8fafc; }
.custom-block.align-left { text-align: left; }
.custom-block.align-center { text-align: center; }
.custom-block.align-right { text-align: right; }
.custom-block :is(h1,h2,h3,p,ul,ol,figure) { margin-top: 0; margin-bottom: 0; max-width: none; }
.custom-block h1 { font-size: clamp(36px,6vw,76px); letter-spacing: -.055em; line-height: 1.07; }
.custom-block h2 { font-size: clamp(28px,4vw,48px); letter-spacing: -.04em; line-height: 1.15; }
.custom-block h3 { font-size: clamp(22px,3vw,32px); line-height: 1.25; }
.custom-rich-text { font-size: clamp(16px,1.8vw,20px); line-height: 1.8; }
.custom-rich-text p + p { margin-top: 1em; }
.custom-block a { color: inherit; text-decoration: underline; }
.custom-block img { width: 100%; height: auto; border-radius: 14px; }
.custom-rich-text img { width: auto; }
.custom-block :is(video,iframe) { display: block; width: 100%; aspect-ratio: 16/9; border: 0; border-radius: 14px; background: #101c29; }
.custom-block figcaption { margin-top: 12px; font-size: 14px; opacity: .8; }
.custom-table-scroll { overflow-x: auto; }
.custom-block table { width: 100%; border-collapse: collapse; text-align: left; }
.custom-block :is(th,td) { border: 1px solid color-mix(in srgb,currentColor 20%,transparent); padding: 14px 18px; min-width: 100px; }
.custom-block th { background: color-mix(in srgb,currentColor 7%,transparent); }
.custom-block caption { text-align: left; margin-bottom: 12px; }
.custom-block li + li { margin-top: 8px; }
.custom-block ul,.custom-block ol { display: inline-block; text-align: left; padding-left: 24px; }
.custom-block .custom-button { display: inline-flex; gap: 30px; align-items: center; padding: 16px 24px; border-radius: 100px; background: var(--color-accent,#2563eb); color: #fff; font-weight: 650; text-decoration: none; }
.custom-block hr { border: 0; height: 1px; background: currentColor; opacity: .2; }
.custom-divider { padding-top: 8px; padding-bottom: 8px; }

.custom-block.tone-white { background: #fff; }
.custom-category .post-cover img { height: 100%; object-fit: cover; border-radius: 0; }
.custom-category .post-card a { text-decoration: none; }

/* ==========================================================================
   Category List block — responsive grid layout
   Only affects <div class="category-page"><div class="archive-list category-list"> on
   the Custom Homepage; does NOT touch standard category/archive pages.
   ========================================================================== */

/* --- Desktop: 1–4 cards per row, max four --- */
.category-page .archive-list.category-list {
  grid-template-columns: var(--hp-cl-cols);
}

/* data-items = 1 … 9+ */
.category-page .archive-list.category-list[data-items="1"] { grid-template-columns: repeat(4,minmax(0,1fr)); }
.category-page .archive-list.category-list[data-items="2"] { grid-template-columns: repeat(2,minmax(0,1fr)); }
.category-page .archive-list.category-list[data-items="3"] { grid-template-columns: repeat(3,minmax(0,1fr)); }
.category-page .archive-list.category-list[data-items="4"] { grid-template-columns: repeat(4,minmax(0,1fr)); }
.category-page .archive-list.category-list[data-items="5"],
.category-page .archive-list.category-list[data-items="6"],
.category-page .archive-list.category-list[data-items="7"],
.category-page .archive-list.category-list[data-items="8"],
.category-page .archive-list.category-list[data-items="9"],
.category-page .archive-list.category-list[data-items="10"],
.category-page .archive-list.category-list[data-items="11"],
.category-page .archive-list.category-list[data-items="12"] { grid-template-columns: repeat(4,minmax(0,1fr)); }

/* Center the last (incomplete) row when it has fewer cards than the grid
   width — this covers the 1, 2, 3, and 5, 6, 7 cases.                   */
.category-page .archive-list.category-list[data-incomplete-row] > .hp-cl-row {
  justify-content: var(--hp-cl-row-justify);
}

/* --- Tablet: max two cards per row (break at 820px / site.css breakpoint) --- */
@media (max-width: 820px) {
  .category-page .archive-list.category-list {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  /* When 1 item remains on tablet, center it */
  .category-page .archive-list.category-list[data-items="1"],
  .category-page .archive-list.category-list[data-items="3"],
  .category-page .archive-list.category-list[data-items="5"],
  .category-page .archive-list.category-list[data-items="7"],
  .category-page .archive-list.category-list[data-items="9"],
  .category-page .archive-list.category-list[data-items="11"] {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  /* Center single last row */
  .category-page .archive-list.category-list[data-incomplete-row="1"] > .hp-cl-row,
  .category-page .archive-list.category-list[data-incomplete-row="2"] > .hp-cl-row,
  .category-page .archive-list.category-list[data-incomplete-row="3"] > .hp-cl-row,
  .category-page .archive-list.category-list[data-incomplete-row="5"],
  .category-page .archive-list.category-list[data-incomplete-row="7"],
  .category-page .archive-list.category-list[data-incomplete-row="9"],
  .category-page .archive-list.category-list[data-incomplete-row="11"] {
    justify-content: center;
  }
}

/* --- Mobile: one card per row (break at 640px / site.css breakpoint) --- */
@media (max-width: 640px) {
  .category-page .archive-list.category-list {
    grid-template-columns: 1fr;
  }
  /* Center single card on mobile */
  .category-page .archive-list.category-list[data-incomplete-row="1"],
  .category-page .archive-list.category-list[data-incomplete-row] > .hp-cl-row {
    justify-content: center;
  }
}

.custom-quote blockquote { margin: 0; padding: 0 0 0 24px; border-left: 3px solid currentColor; font-size: clamp(22px,3vw,34px); font-style: italic; line-height: 1.5; }
.custom-quote p, .custom-callout p, .custom-faq-items p { white-space: pre-line; }
.custom-callout { border: 1px solid color-mix(in srgb,currentColor 20%,transparent); border-inline-start: 5px solid var(--color-accent,#5145cd); }
.custom-callout h3 + p { margin-top: 14px; line-height: 1.8; }
.custom-stats-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,150px),1fr)); gap: 24px; margin: 0; }
.custom-stats-grid > div { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.custom-stats-grid dt { font-size: 14px; opacity: .85; }
.custom-stats-grid dd { order: -1; margin: 0; font-size: clamp(32px,5vw,52px); font-weight: 700; line-height: 1.15; }
.custom-faq-items details { border-bottom: 1px solid color-mix(in srgb,currentColor 20%,transparent); padding: 18px 0; }
.custom-faq-items summary { cursor: pointer; font-weight: 650; font-size: 18px; }
.custom-faq-items details p { margin-top: 16px; line-height: 1.8; }
.custom-faq-items summary:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }

/* Consecutive opening headings form a compact editorial introduction. */
.custom-home-page:has(> .custom-heading:first-child + .custom-heading h1) { min-height:70vh; padding-top:clamp(48px,7vw,96px); background:radial-gradient(ellipse at 50% 0%,color-mix(in srgb,var(--color-accent,#2563eb) 5%,transparent),transparent 65%),var(--color-page-bg,#f7f8f5); }
.custom-heading:first-child:has(+ .custom-heading h1) { margin-bottom:0; padding-block:0; }
.custom-heading:first-child:has(+ .custom-heading h1) h3 { display:inline-block; padding:9px 16px; border:1px solid var(--line); border-radius:100px; background:#ffffffb3; color:var(--muted); font-size:11px; line-height:1.6; letter-spacing:.12em; text-transform:uppercase; }
.custom-heading:first-child + .custom-heading:has(h1) { padding-block:28px 16px; margin-bottom:0; }
.custom-heading:has(h1) + .custom-text { padding-top:0; padding-bottom:16px; margin-bottom:0; color:var(--muted); }
.custom-heading:has(h1) + .custom-text .custom-rich-text { max-width:52ch; margin-inline:auto; }
.custom-heading:has(h1) + .custom-text + .custom-button { padding-top:12px; margin-bottom:40px; }
.custom-block .custom-button { border-radius:12px; background:var(--color-nav,#07468d); box-shadow:0 6px 18px #17293612; }
.custom-block .custom-button:hover { background:var(--color-nav-hover,#b95f3a); }
.custom-block .custom-button:focus-visible { outline:3px solid var(--color-accent,#2563eb); outline-offset:4px; }

/* Rich-text images stay inside their block; text wraps on desktop. */
.custom-rich-text { display: block; }
.custom-rich-text img.rich-image { height:auto; max-width:100%; border-radius:12px; }
.custom-rich-text img.rich-image-width-25 { width:25%; }
.custom-rich-text img.rich-image-width-40 { width:40%; }
.custom-rich-text img.rich-image-width-50 { width:50%; }
.custom-rich-text img.rich-image-width-100 { width:100%; }
.custom-rich-text img.rich-image-left { float:left; margin:6px 24px 16px 0; }
.custom-rich-text img.rich-image-right { float:right; margin:6px 0 16px 24px; }
.custom-rich-text img.rich-image-none { float:none; display:block; margin:16px auto; }
.custom-rich-text img.rich-image-width-100 { margin-inline:0; }
@media(max-width:640px) {
  .custom-rich-text img.rich-image { float:none; display:block; width:100%; margin:16px 0; }
}

/* Shared typography for text blocks in the editor, previews and published pages. */
.custom-rich-text { display: flow-root; overflow-x: auto; }
.custom-rich-text > :is(p,div,h1,h2,h3,h4,h5,h6,blockquote,pre,ul,ol,dl,table,figure,details,hr) { margin-block: 0 1em; }
.custom-rich-text > :last-child { margin-bottom: 0; }
.custom-rich-text :is(h1,h2,h3,h4,h5,h6) { line-height: 1.25; letter-spacing: normal; }
.custom-rich-text h1 { font-size: 2em; }
.custom-rich-text h2 { font-size: 1.7em; }
.custom-rich-text h3 { font-size: 1.4em; }
.custom-rich-text h4 { font-size: 1.2em; }
.custom-rich-text h5 { font-size: 1.1em; }
.custom-rich-text h6 { font-size: 1em; }
.custom-rich-text :is(ul,ol) { display: block; padding-inline-start: 1.6em; text-align: inherit; }
.custom-rich-text ul { list-style-type: disc; }
.custom-rich-text ol { list-style-type: decimal; }
.custom-rich-text ul ul { list-style-type: circle; }
.custom-rich-text li > :is(ul,ol) { margin-block: .4em; }
.custom-rich-text blockquote { border-inline-start: 4px solid currentColor; padding-inline-start: 1em; margin-inline: 0; opacity: .9; }
.custom-rich-text :is(code,kbd,samp,pre) { font-family: monospace; }
.custom-rich-text :is(code,kbd,samp) { background: color-mix(in srgb,currentColor 8%,transparent); padding: .1em .3em; border-radius: 4px; }
.custom-rich-text pre { white-space: pre-wrap; padding: 1em; background: color-mix(in srgb,currentColor 8%,transparent); border-radius: 8px; }
.custom-rich-text pre code { padding: 0; background: none; }
.custom-rich-text :is(s,strike,del) { text-decoration: line-through; }
.custom-rich-text :is(u,ins) { text-decoration: underline; }
.custom-rich-text sub { vertical-align: sub; font-size: .75em; }
.custom-rich-text sup { vertical-align: super; font-size: .75em; }
.custom-rich-text mark { background: #fff19d; color: #17243b; }
.custom-rich-text dd { margin-inline-start: 1.5em; }
.custom-rich-text dt { font-weight: bold; }
.custom-rich-text summary { cursor: pointer; font-weight: bold; }
.custom-rich-text table { font-size: .9em; }

/* Validated block appearance settings, shared by editing and public rendering. */
.custom-list > :is(ul,ol) { font-size: var(--block-font-size,inherit); }
.custom-list > :is(ul,ol) > li + li { margin-top: var(--block-item-gap,8px); }
.custom-table td { background-color: var(--block-cell-background,transparent); color: var(--block-cell-color,inherit); }
.custom-table th { background-color: var(--block-header-background,var(--block-cell-background,color-mix(in srgb,currentColor 7%,transparent))); color: var(--block-header-color,var(--block-cell-color,inherit)); }
.custom-block.custom-button > .custom-button { box-sizing: border-box; justify-content: center; max-width: 100%; min-height: var(--block-height,auto); border-radius: var(--block-radius,100px); font-size: var(--block-font-size,inherit); background: var(--block-button-background,var(--color-accent,#2563eb)); color: var(--block-button-text,#fff); transition: background-color .15s,color .15s; }
.custom-block.custom-button > .custom-button:is(:hover,:focus-visible) { background: var(--block-button-hover,var(--block-button-background,var(--color-accent,#2563eb))); color: var(--block-button-hover-text,var(--block-button-text,#fff)); }
.custom-block.custom-button[data-button-width=full] > .custom-button { display: flex; width: 100%; }
.custom-block.custom-button[data-button-width=custom] > .custom-button { width: var(--block-width-px,240px); }
.custom-quote blockquote { font-size: var(--block-font-size,clamp(22px,3vw,34px)); color: var(--block-quote-color,inherit); font-style: var(--block-font-style,italic); border-left-width: var(--block-border-width,3px); border-left-color: var(--block-border-color,currentColor); }
.custom-quote figcaption { font-size: var(--block-attribution-size,14px); color: var(--block-attribution-color,inherit); }
.custom-stats .custom-stats-grid { gap: var(--block-gap,24px); }
.custom-stats .custom-stats-grid > div { padding: var(--block-padding,0); background: var(--block-card-background,transparent); border-radius: 10px; }
.custom-stats :is(dd,.custom-stat-value) { font-size: var(--block-value-size,clamp(32px,5vw,52px)); color: var(--block-value-color,inherit); font-weight: 700; line-height: 1.15; }
.custom-stats :is(dt,.custom-stat-label) { font-size: var(--block-label-size,14px); color: var(--block-label-color,inherit); }
.custom-stats[data-stats-columns]:not([data-stats-columns=""]) .custom-stats-grid { grid-template-columns: repeat(var(--block-columns),minmax(0,1fr)); }
@media(max-width:600px) {
  .custom-stats .custom-stats-grid,
  .custom-stats[data-stats-columns]:not([data-stats-columns=""]) .custom-stats-grid { grid-template-columns: minmax(0,1fr); }
}