/* Click-to-load YouTube embed (replaces the oEmbed iframe; no third-party request until click). */
.yt-embed{position:relative;aspect-ratio:16/9;background:#000 center/cover no-repeat;display:flex;align-items:center;justify-content:center;cursor:pointer}
.yt-embed a{color:#fff;background:rgba(0,0,0,.6);padding:10px 18px;border-radius:6px}
.yt-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
/* core-block-supports-inline-css rules used by the copied GP elements (live /anakim) */
.wp-container-core-group-is-layout-8f761849{flex-wrap:nowrap;}
.wp-container-core-group-is-layout-4fc3f8e1{flex-direction:column;align-items:flex-start;}
/* Static embeds (no provider script): tweets and link cards */
.static-embed{border-left:4px solid #1d9bf0;margin:0 0 1.5em;padding:.75em 1em;background:rgba(0,0,0,.03)}
.wp-embedded-content.static-embed{border-left-color:#999}
.static-embed p{margin-bottom:.5em}
.wp-reusable-block-missing{display:none}
/* Mobile tag dialog (replaces the GP modal #gp-tags) */
.gp-tags-dialog{border:0;padding:0;max-width:min(92vw,520px);max-height:85vh;overflow:auto;border-radius:6px}
.gp-tags-dialog::backdrop{background:rgba(0,0,0,.6)}
.gp-tags-dialog .inside-right-sidebar{display:block!important;padding:20px}
@media (max-width:768px){.single-videos .inside-right-sidebar,.single-work .inside-right-sidebar{display:none}}
/* Without JS the floating tag button (href="#tagblock") must still reach the tags and the source link: show the hidden sidebar when #tagblock is the target. */
@media (max-width:768px){#right-sidebar .inside-right-sidebar:has(#tagblock:target){display:block!important}}
html{scroll-behavior:smooth}

/* Reusable block 23961 "Small cards (names)": rules copied from live uploads/generateblocks/style-23338.css (essenes page). */
.gb-grid-wrapper-91973c7a{display:flex;flex-wrap:wrap;row-gap:20px;margin-left:-20px;}
.gb-grid-wrapper-91973c7a > .gb-grid-column{box-sizing:border-box;padding-left:20px;}
.gb-container-6cb5a58c{display:block;margin:0;border-radius:12px;background-color:#fafafa;}
.gb-grid-wrapper > .gb-grid-column-6cb5a58c{width:50%;}
.gb-container-433bc5a1{display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-start;column-gap:12px;flex-grow:1;order:1;}
.gb-container-00999c01{display:flex;align-items:center;flex-grow:1;flex-basis:0px;padding-right:10px;}
.gb-block-image-490a76d9{padding:10px;margin-top:5px;}
.gb-image-490a76d9{border-radius:12px;width:120px;height:120px;object-fit:cover;vertical-align:middle;}
h3.gb-headline-7383e157{font-size:20px;margin-top:-10px;margin-bottom:5px;}
@media (max-width: 767px) {
.gb-container-6cb5a58c{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;column-gap:12px;padding:0;border-radius:12px;}
.gb-grid-wrapper > .gb-grid-column-6cb5a58c{width:100%;}
.gb-container-433bc5a1{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:flex-start;column-gap:12px;flex-grow:1;order:1;}
.gb-grid-wrapper > .gb-grid-column-433bc5a1{flex-grow:1;}
.gb-container-00999c01{display:flex;align-items:center;flex-grow:1;flex-basis:0px;}
.gb-grid-wrapper > .gb-grid-column-00999c01{flex-grow:1;flex-basis:0px;}
.gb-block-image-490a76d9{padding:5px;margin:0;}
.gb-image-490a76d9{border-radius:6px;width:72px;height:72px;object-fit:cover;}
h3.gb-headline-7383e157{display:inline-block;font-size:16px;text-align:left;margin:2px;}
}

/* Archive pager like live: perfmatters "used CSS" on live drops GP's .paging-navigation rules, so
   "Older posts"/"Newer posts" show and the page numbers are plain inline links (checked on /tag/aessir). */
.paging-navigation .nav-previous,.paging-navigation .nav-next{display:block}
.paging-navigation .nav-links{display:block}
.paging-navigation .nav-links>*{padding:0}
.paging-navigation .nav-links .current{font-weight:inherit}
/* Live (GP Premium page header CSS): the page header image is hidden; the homepage prints it but it is not shown. */
.generate-page-header, .page-header-image, .page-header-image-single { display: none; }
/* GP dynamic CSS prints width 100% on no-sidebar pages (70% on right-sidebar pages); wp-inline.css has the 70% rule. */
.no-sidebar .site-content .content-area { width: 100%; }
/* Tag archives: live perfmatters used-CSS has no page-numbers rules, so the pager is plain inline text
   ("1 2 Next →"). child.css would hide the next number and add boxes. Checked on live /tag/aessir 2026-10-04. */
.tag #nav-below .nav-links>*{display:inline;padding:0!important;border:0;background:none;margin-right:0;border-radius:0}

/* Quote cards (src/lib/quotes.ts). Default since 2026-10-06 (approved by Tijs): card with source photo and link.
   Fallback toggle: <html class="quotes-old"> (preview Worker, ?quotes=old) shows the old WordPress look. No JS needed. */
html.quotes-old .doa-quote{margin:0}
html.quotes-old .doa-quote__by{display:none}
html:not(.quotes-old) .doa-quote{position:relative;margin:1.75em 0;padding:2.9em 1.75em 1.4em;background:#f7f1ea;border:1px solid rgba(140,44,25,.12);border-radius:14px;box-shadow:0 1px 2px rgba(34,34,34,.04)}
html:not(.quotes-old) .doa-quote::before{content:"\201C";content:"\201C"/"";position:absolute;top:.06em;left:.26em;font-family:Georgia,"Times New Roman",serif;font-size:6.5rem;line-height:1;color:var(--accent,#8c2c19);opacity:.3;pointer-events:none}
html:not(.quotes-old) .doa-quote>blockquote{margin:0;padding:0;border:0;font-style:normal;font-size:1.125rem;line-height:1.7;color:var(--contrast-2,#444)}
html:not(.quotes-old) .doa-quote>blockquote p{margin-bottom:.9em}
html:not(.quotes-old) .doa-quote>blockquote p:last-of-type{margin-bottom:0}
html:not(.quotes-old) .doa-quote>blockquote>cite{display:none}
html:not(.quotes-old) .doa-quote__by{display:flex;align-items:center;gap:.8em;margin-top:1.1em;padding-top:1em;border-top:1px solid rgba(140,44,25,.15);font-size:.95rem;line-height:1.35}
html:not(.quotes-old) .doa-quote__photo{flex:none;width:48px;height:48px;border-radius:50%;object-fit:cover;background:#e9e2d9;box-shadow:0 0 0 2px #fff,0 1px 3px rgba(0,0,0,.18)}
html:not(.quotes-old) .doa-quote__meta{display:flex;flex-direction:column;min-width:0}
html:not(.quotes-old) .doa-quote__cite{font-weight:600;color:var(--contrast,#222);overflow-wrap:anywhere}
html:not(.quotes-old) .doa-quote__source{font-size:.875em;color:var(--contrast-3,#666)}
html:not(.quotes-old) .doa-quote__by a{color:var(--accent,#8c2c19);text-decoration:none}
html:not(.quotes-old) .doa-quote__by a:hover{text-decoration:underline}
html:not(.quotes-old) .doa-quote__by a:focus-visible{outline:2px solid var(--accent,#8c2c19);outline-offset:2px;border-radius:2px}
html:not(.quotes-old) .doa-quote--nocite>blockquote{padding-bottom:0}
@media (max-width:600px){
  html:not(.quotes-old) .doa-quote{margin:1.4em 0;padding:2.5em 14px 1.15em;border-radius:12px}
  html:not(.quotes-old) .doa-quote::before{font-size:5.25rem;left:.1em}
  html:not(.quotes-old) .doa-quote>blockquote{font-size:1.05rem;line-height:1.65}
  html:not(.quotes-old) .doa-quote__photo{width:44px;height:44px}
}
@media print{html:not(.quotes-old) .doa-quote{box-shadow:none;background:none}}

/* Verse lists (src/lib/verses.ts). Default since 2026-10-06 (approved by Tijs). Fallback toggle:
   <html class="verses-old"> (preview Worker, ?verses=old) leaves the .doa-verses wrapper without style. Verse numbers are the native list markers, so
   <ol start="n"> keeps its numbers. No JS needed.
   Own cool palette (differs from the warm quote cards): card #eef3f2, accent #4a6362 (site --terracotta-1),
   numbers and source link #3d5655 (7.0:1 on the card), text #444 (8.7:1). */
:is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses){margin:1.75em 0;padding:1.3em 1.4em 1.2em 1em;background:#eef3f2;border:1px solid rgba(74,99,98,.16);border-left:3px solid #4a6362;border-radius:14px;box-shadow:0 1px 2px rgba(34,34,34,.04)}
/* Narrow hanging number column: native outside markers (end-aligned, so numbers line up on the right and
   <ol start> stays correct); wrapped lines align with the text. Width = widest number (class from verses.ts). */
:is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses)>ol{--vnum:1.55em;margin:0;padding:0 0 0 var(--vnum);list-style-position:outside;font-size:1.0625rem;line-height:1.7;color:var(--contrast-2,#444)}
:is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses).doa-verses--d1>ol{--vnum:1.2em}
:is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses).doa-verses--d3>ol{--vnum:2.05em}
:is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses).doa-verses--d4>ol{--vnum:2.55em}
:is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses)>ol>li{margin:0 0 .65em;padding:0;overflow-wrap:break-word}
:is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses)>ol>li:last-child{margin-bottom:0}
:is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses)>ol>li::marker{color:#3d5655;font-size:.8em;font-weight:600;font-variant-numeric:tabular-nums}
:is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses)>ol+p{margin:1.1em 0 0;padding-top:.9em;border-top:1px solid rgba(74,99,98,.2);font-size:.95rem;font-weight:600;line-height:1.35;color:var(--contrast,#222)}
:is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses)>ol+p a{color:#3d5655;text-decoration:none}
:is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses)>ol+p a:hover{text-decoration:underline}
:is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses) a:focus-visible{outline:2px solid #3d5655;outline-offset:2px;border-radius:2px}
html:not(.verses-old) .doa-quote+.doa-verses{margin-top:-.75em}
@media (max-width:600px){
  /* About 10px left (3px accent + 7px) and 10px right. */
  :is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses){margin:1.4em 0;padding:1em 10px 1em 7px;border-radius:12px}
  :is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses)>ol{font-size:1rem;line-height:1.65}
}
@media print{:is(html:not(.verses-old) .doa-verses, html:not(.layout-old) .lay-verses){box-shadow:none;background:none}}

/* Reading layout for source-text pages (src/lib/layout.ts). Default since 2026-10-06.
   Fallback: <html class="layout-old"> (preview Worker, ?layout=old) leaves .lay-* wrappers without style.
   Opening = paper panel with a lead paragraph; passage = cool slate panel; reading = paper prose block;
   lines = sage poetic lines; author bio = small grey box; clear space and a rule above each h2. */
html:not(.layout-old) .lay-page>h2{margin-top:2.2em;padding-top:1.1em;border-top:1px solid rgba(34,34,34,.12)}
html:not(.layout-old) .lay-opening{margin:0 0 1.75em;padding:1.4em 1.6em 1.1em;background:#fbfaf6;border:1px solid #ebe5da;border-radius:14px}
html:not(.layout-old) .lay-opening>p:first-child,html:not(.layout-old) .lay-opening>.toc+p,html:not(.layout-old) .lay-opening>.lay-explainer:first-child+p{font-size:1.18em;line-height:1.55;color:var(--contrast,#222)}
html:not(.layout-old) .lay-opening>p:last-child{margin-bottom:0}
html:not(.layout-old) .lay-passage{margin:1.75em 0;padding:1.4em 1.6em 1.1em;background:#f2f3f8;border:1px solid rgba(75,81,112,.16);border-left:3px solid #4b5170;border-radius:14px;font-family:Georgia,"Times New Roman",serif;font-size:1.05rem;line-height:1.75;color:#33343d}
html:not(.layout-old) .lay-passage>p{margin-bottom:.9em}
html:not(.layout-old) .lay-passage__by{margin-top:1em;padding-top:.85em;border-top:1px solid rgba(75,81,112,.2);font-family:inherit;font-size:.9rem;line-height:1.4}
html:not(.layout-old) .lay-passage__by p{margin:0;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;color:#222}
html:not(.layout-old) .lay-passage__by em{color:#4b5170}
html:not(.layout-old) .lay-reading{margin:0 0 1.75em;padding:1.25em 1.5em 1em;background:#fbfaf6;border:1px solid #ebe5da;border-radius:14px}
html:not(.layout-old) .lay-reading>p:last-child{margin-bottom:0}
html:not(.layout-old) h2+.lay-reading>p:first-child,html:not(.layout-old) h3+.lay-reading>p:first-child{font-size:1.12em;line-height:1.55;color:var(--contrast,#222)}
html:not(.layout-old) .lay-lines{margin:1.5em 0;padding:1.15em 1.4em 1em;background:#eef3f2;border:1px solid rgba(74,99,98,.22);border-left:3px solid #4a6362;border-radius:12px;font-family:Georgia,"Times New Roman",serif;font-size:1.05rem;line-height:1.55;color:#222}
html:not(.layout-old) .lay-lines>p{margin:.28em 0}
html:not(.layout-old) .lay-lines>p:first-child{margin-top:0}
html:not(.layout-old) .lay-lines>p:last-child{margin-bottom:0}
html:not(.layout-old) .lay-authorbio{margin:0 0 1.5em;padding:1.1em 1.3em .4em;background:var(--base-2,#fafafa);border:1px solid #e6e6e6;border-radius:12px;font-size:.94em;color:var(--contrast-2,#444)}
/* Plain framing text above panels — no card/box (Tijs 2026-10-06). */
html:not(.layout-old) .lay-intro{margin:0 0 1.1em;padding:0;border:0;background:none;border-radius:0;box-shadow:none;font-size:1rem;line-height:1.65;color:var(--contrast-2,#444)}
html:not(.layout-old) .lay-intro p{margin:0 0 .55em}
html:not(.layout-old) .lay-intro p:last-child{margin-bottom:0}
html:not(.layout-old) .lay-explainer{margin:0 0 1.4em;padding:.85em 1.1em;border:1px dashed #b9b3a7;border-radius:10px;background:#fff;font-size:.97rem;line-height:1.6;color:var(--contrast,#222)}
html:not(.layout-old) .lay-explainer__label{display:block;margin-bottom:.3em;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#7a4a00}
html:not(.layout-old) .lay-explainer p{margin:0}
@media (max-width:600px){
  html:not(.layout-old) .lay-opening{padding:1.1em 12px .9em;border-radius:12px}
  html:not(.layout-old) .lay-passage{padding:1.1em 12px .9em 10px;border-radius:12px;font-size:1rem;line-height:1.7}
  html:not(.layout-old) .lay-reading{padding:1.05em 12px .85em;border-radius:12px}
  html:not(.layout-old) .lay-lines{padding:1em 12px .85em 10px;border-radius:12px;font-size:1rem}
  html:not(.layout-old) .lay-authorbio{padding:1em 12px .3em}
  html:not(.layout-old) .lay-explainer{padding:.75em 12px}
}

/* Post cards (default since 2026-10-06). Horizontal on all breakpoints: square image left, dark title +
   full excerpt right (no truncation). Image fills the card height. CSS only; markup unchanged.
   Fallback ?cards=old (Worker adds html.cards-old) restores the previous WordPress / black-label look.
   (1) .grid-card-black home/hub cards  (2) .grid-card names cards  (3) .video-card category/author rows. */
html:not(.cards-old) .grid-card-black,
html:not(.cards-old) .grid-card{position:relative;display:flex;flex-direction:column;height:100%;margin:0;padding:0;background:#fff;border:1px solid #e7e1d9;border-radius:14px;overflow:hidden;box-shadow:0 1px 2px rgba(34,34,34,.04);transition:border-color .2s ease,box-shadow .2s ease}
html:not(.cards-old) .grid-card>.gb-container,
html:not(.cards-old) .grid-card .gb-container,
html:not(.cards-old) .grid-card h3.gb-headline{position:static}
html:not(.cards-old) .grid-card h3.gb-headline a{display:inline;position:static;z-index:auto;max-width:none;padding:0;background:none;box-shadow:none;border-radius:0;line-height:inherit;letter-spacing:inherit;color:var(--contrast,#222);text-decoration:none;transition:color .15s ease}
html:not(.cards-old) .grid-card h3.gb-headline a::after{content:"";position:absolute;inset:0;z-index:2}
html:not(.cards-old) .grid-card h3.gb-headline a:focus-visible{outline:none}
html:not(.cards-old) .grid-card:has(a:focus-visible){outline:3px solid var(--accent,#8c2c19);outline-offset:2px}
html:not(.cards-old) .grid-card-black>div.gb-headline:empty{display:none}
html:not(.cards-old) .grid-card:not(.grid-card-black):hover h3.gb-headline a{color:var(--accent,#8c2c19)}
@media (hover:hover){
  html:not(.cards-old) .grid-card:hover{border-color:rgba(140,44,25,.35);box-shadow:0 8px 20px rgba(34,34,34,.09)}
  html:not(.cards-old) .grid-card-black:hover .gb-block-image img{transform:scale(1.04);filter:brightness(.92)}
}
@media (prefers-reduced-motion:reduce){
  html:not(.cards-old) .grid-card,html:not(.cards-old) .grid-card-black .gb-block-image img{transition:none;transform:none!important}
}
/* Horizontal hub/home cards: square image left (fills card height), title + full excerpt right. */
html:not(.cards-old) .grid-card-black{display:grid;grid-template-columns:96px minmax(0,1fr);grid-template-rows:auto 1fr;align-items:start;background:#fff}
html:not(.cards-old) .grid-card-black>.gb-container{display:contents;background:none}
html:not(.cards-old) .grid-card-black>.gb-container>*{grid-area:auto}
html:not(.cards-old) .grid-card-black .gb-block-image{position:relative;grid-column:1;grid-row:1/-1;align-self:stretch;width:96px;min-height:96px;margin:0;padding:0;overflow:hidden;background:#ece7e0}
html:not(.cards-old) .grid-card-black .gb-block-image img{position:absolute;inset:0;display:block;width:100%;height:100%;min-height:0;object-fit:cover;object-position:50% 35%;border-radius:0;transition:transform .4s ease,filter .3s ease}
html:not(.cards-old) .grid-card-black h3.gb-headline{grid-column:2;grid-row:1;align-self:start;z-index:auto;margin:0;padding:13px 14px 3px;font-size:17.5px;line-height:1.3;font-weight:700;letter-spacing:-.01em;background:none;text-shadow:none;color:var(--contrast,#222)}
html:not(.cards-old) .grid-card-black h3.gb-headline a{color:#222!important;-webkit-text-fill-color:#222!important;text-decoration:none!important;background:none!important;transition:none}
html:not(.cards-old) .grid-card-black:hover h3.gb-headline a{color:var(--accent,#8c2c19)!important;-webkit-text-fill-color:var(--accent,#8c2c19)!important}
html:not(.cards-old) .grid-card-black>div.gb-headline{grid-column:2;grid-row:2;align-self:start;position:static;z-index:auto;display:block;margin:0;padding:5px 14px 14px;font-size:15.5px;line-height:1.55;color:#555}
@media (min-width:768px){
  html:not(.cards-old) .grid-card-black{grid-template-columns:120px minmax(0,1fr)}
  html:not(.cards-old) .grid-card-black .gb-block-image{width:120px;min-height:120px}
  html:not(.cards-old) .grid-card-black h3.gb-headline{padding:15px 16px 4px;font-size:18.5px}
  html:not(.cards-old) .grid-card-black>div.gb-headline{padding:5px 16px 15px}
}
@media (min-width:1025px){
  html:not(.cards-old) .grid-card-black{grid-template-columns:160px minmax(0,1fr)}
  html:not(.cards-old) .grid-card-black .gb-block-image{width:160px;min-height:160px}
  html:not(.cards-old) .grid-card-black h3.gb-headline{padding:16px 18px 5px;font-size:19px}
  html:not(.cards-old) .grid-card-black>div.gb-headline{padding:5px 18px 16px}
}
/* Small "names" cards (title only, no excerpt): square image flush left filling the card height, bold title
   vertically centred on the right. Same frame/hover as the main cards; compact because there is no excerpt. */
html:not(.cards-old) .grid-card:not(.grid-card-black){flex-direction:row;align-items:stretch}
html:not(.cards-old) .grid-card:not(.grid-card-black)>.gb-container{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:stretch;gap:0;width:100%;margin:0;padding:0}
html:not(.cards-old) .grid-card:not(.grid-card-black) .gb-block-image{position:relative;flex:none;align-self:stretch;width:84px;min-height:84px;margin:0;padding:0;overflow:hidden;background:#ece7e0}
html:not(.cards-old) .grid-card:not(.grid-card-black) .gb-block-image img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;border-radius:0;object-fit:cover;object-position:50% 30%;transition:transform .4s ease,filter .3s ease}
html:not(.cards-old) .grid-card:not(.grid-card-black) .gb-container .gb-container{display:flex;align-items:center;flex:1 1 0;min-width:0;margin:0;padding:12px 16px}
html:not(.cards-old) .grid-card:not(.grid-card-black) h3.gb-headline{display:block;margin:0;padding:0;font-size:17.5px;line-height:1.3;font-weight:700;letter-spacing:-.01em;text-align:left}
html:not(.cards-old) .grid-card:not(.grid-card-black) h3.gb-headline a{color:#222;-webkit-text-fill-color:currentColor}
html:not(.cards-old) .grid-card:not(.grid-card-black):hover h3.gb-headline a{color:var(--accent,#8c2c19)}
@media (hover:hover){
  html:not(.cards-old) .grid-card:not(.grid-card-black):hover .gb-block-image img{transform:scale(1.04);filter:brightness(.92)}
}
@media (prefers-reduced-motion:reduce){
  html:not(.cards-old) .grid-card:not(.grid-card-black) .gb-block-image img{transition:none;transform:none!important}
}
@media (min-width:768px){
  html:not(.cards-old) .grid-card:not(.grid-card-black) .gb-block-image{width:96px;min-height:96px}
  html:not(.cards-old) .grid-card:not(.grid-card-black) h3.gb-headline{font-size:18.5px}
}
@media (min-width:1025px){
  html:not(.cards-old) .grid-card:not(.grid-card-black) .gb-block-image{width:104px;min-height:104px}
  html:not(.cards-old) .grid-card:not(.grid-card-black) .gb-container .gb-container{padding:14px 18px}
  html:not(.cards-old) .grid-card:not(.grid-card-black) h3.gb-headline{font-size:19px}
}
/* Category/author archive items (title only, optional category kicker): boxed cards like the names cards.
   Square image flush left filling the card height, bold title centred right, same frame/hover. The whole card is
   already clickable via child.css (.video-card h2 a:before). ?cards=old restores the previous look. */
html:not(.cards-old) .dynamic-content-template:has(>.video-card){margin:0 0 14px}
html:not(.cards-old) .dynamic-content-template>.video-card{position:relative;margin:0 16px;padding:0;background:#fff;border:1px solid #e7e1d9;border-radius:14px;overflow:hidden;box-shadow:0 1px 2px rgba(34,34,34,.04);transition:border-color .2s ease,box-shadow .2s ease}
html:not(.cards-old) .video-card>.gb-container{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:stretch;justify-content:flex-start;gap:0;margin:0;padding:0}
html:not(.cards-old) .video-card .gb-container-a202e117{position:relative;flex:none;align-self:stretch;width:84px;min-height:84px;margin:0;padding:0;overflow:hidden;background:#ece7e0}
html:not(.cards-old) .video-card .gb-container-a202e117:not(:has(img)){background:#f7f1ea}
html:not(.cards-old) .video-card img.dynamic-featured-image{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;border-radius:0;object-fit:cover;object-position:50% 30%;transition:transform .4s ease,filter .3s ease}
html:not(.cards-old) .video-card .gb-container-b35ad2e5{flex:1 1 0;min-width:0;margin:0;padding:12px 16px;justify-content:center;align-items:flex-start}
html:not(.cards-old) .video-card div.gb-headline-9162147e{display:block;margin:0;padding:0 0 4px;font-size:12px;line-height:1.3;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#857a70}
html:not(.cards-old) .video-card h2.gb-headline{margin:0;padding:0;font-size:17.5px;line-height:1.3;font-weight:700;letter-spacing:-.01em;text-align:left}
html:not(.cards-old) .video-card h2.gb-headline a{color:#222;-webkit-text-fill-color:currentColor;text-decoration:none;transition:color .15s ease}
html:not(.cards-old) .video-card:hover h2.gb-headline a{color:var(--accent,#8c2c19)}
html:not(.cards-old) .video-card h2.gb-headline a:focus-visible{outline:none}
html:not(.cards-old) .video-card:has(a:focus-visible){outline:3px solid var(--accent,#8c2c19);outline-offset:2px}
@media (hover:hover){
  html:not(.cards-old) .dynamic-content-template>.video-card:hover{border-color:rgba(140,44,25,.35);box-shadow:0 8px 20px rgba(34,34,34,.09)}
  html:not(.cards-old) .video-card:hover img.dynamic-featured-image{transform:scale(1.04);filter:brightness(.92)}
}
@media (prefers-reduced-motion:reduce){
  html:not(.cards-old) .dynamic-content-template>.video-card,html:not(.cards-old) .video-card img.dynamic-featured-image{transition:none;transform:none!important}
}
@media (min-width:768px){
  html:not(.cards-old) .dynamic-content-template:has(>.video-card){margin:0 0 16px}
  html:not(.cards-old) .dynamic-content-template>.video-card{margin:0}
  html:not(.cards-old) .video-card .gb-container-a202e117{width:96px;min-height:96px}
  html:not(.cards-old) .video-card h2.gb-headline{font-size:18.5px}
}
/* Desktop: two columns of cards so the archive list uses the content width. */
@media (min-width:1025px){
  html:not(.cards-old) #main:has(>.dynamic-content-template>.video-card){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 20px;align-content:start}
  html:not(.cards-old) #main:has(>.dynamic-content-template>.video-card)>:not(.dynamic-content-template){grid-column:1/-1}
  html:not(.cards-old) #main>.dynamic-content-template:has(>.video-card){margin:0}
  html:not(.cards-old) #main>.dynamic-content-template>.video-card{height:100%}
  html:not(.cards-old) .video-card>.gb-container{height:100%}
  html:not(.cards-old) .video-card .gb-container-a202e117{width:104px;min-height:104px}
  html:not(.cards-old) .video-card .gb-container-b35ad2e5{padding:14px 18px}
  html:not(.cards-old) .video-card h2.gb-headline{font-size:19px}
}
/* Names cards on hub pages: phone gap between stacked cards 20px -> 14px. */
@media (max-width:767px){
  html:not(.cards-old) .gb-grid-wrapper:has(>.gb-grid-column>.grid-card:not(.grid-card-black)){row-gap:14px}
}
/* Category/author archives: the right sidebar is always empty there, so hide it (only when truly empty) and let the
   card list use the full container width: 2 columns from tablet, 3 from 1200px (cards stay ~370px+ wide).
   Scoped to body.archive.category / body.archive.author; tag pages, posts, pages, hubs and home are untouched.
   ?cards=old restores the sidebar and the old list. */
html:not(.cards-old) body.archive:is(.category,.author) #right-sidebar:has(>.inside-right-sidebar:empty){display:none}
html:not(.cards-old) body.archive:is(.category,.author):has(#right-sidebar>.inside-right-sidebar:empty) .site-content .content-area{width:100%}
@media (min-width:768px){
  html:not(.cards-old) body.archive:is(.category,.author):has(#right-sidebar>.inside-right-sidebar:empty) #main:has(>.dynamic-content-template>.video-card){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 20px;align-content:start}
  html:not(.cards-old) body.archive:is(.category,.author):has(#right-sidebar>.inside-right-sidebar:empty) #main:has(>.dynamic-content-template>.video-card)>:not(.dynamic-content-template){grid-column:1/-1}
  html:not(.cards-old) body.archive:is(.category,.author):has(#right-sidebar>.inside-right-sidebar:empty) #main>.dynamic-content-template:has(>.video-card){margin:0}
  html:not(.cards-old) body.archive:is(.category,.author):has(#right-sidebar>.inside-right-sidebar:empty) #main>.dynamic-content-template>.video-card,
  html:not(.cards-old) body.archive:is(.category,.author):has(#right-sidebar>.inside-right-sidebar:empty) .video-card>.gb-container{height:100%}
}
@media (min-width:1200px){
  html:not(.cards-old) body.archive:is(.category,.author):has(#right-sidebar>.inside-right-sidebar:empty) #main:has(>.dynamic-content-template>.video-card){grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* Full-width archives between 768px and the 1200px container + margins: keep the cards off the screen edge
   (aligned with the 16px page title inset). */
@media (min-width:768px) and (max-width:1239px){
  html:not(.cards-old) body.archive:is(.category,.author):has(#right-sidebar>.inside-right-sidebar:empty) #main:has(>.dynamic-content-template>.video-card){padding:0 16px}
}

/* Repeated subheadings as labelled blocks (src/lib/markdown/subheads.mjs), test page /the-hierarchy-of-yhwh (2026-10-07).
   The label is a soft brick-tinted band with a brick bar; the section text below stays full width, so quote and verse
   cards are not boxed in a second box and phones lose no width. */
.doa-sub{margin:1.7em 0 1.5em}
.doa-sub__label{margin:0 0 .85em;padding:.5em .85em;background:rgba(140,44,25,.09);border-left:3px solid #8c2c19;border-radius:0 8px 8px 0;color:#8c2c19;font-size:1.02rem;line-height:1.35}
.doa-sub__label strong{font-weight:700}
.doa-sub>:last-child{margin-bottom:0}
h2+.doa-sub{margin-top:.9em}

/* Tables (default since 2026-10-07, approved by Tijs; ?tables=old restores the plain WordPress look). CSS only on the
   WordPress markup (230 of 231 tables sit in figure.wp-block-table).
   - Every table wrapper scrolls sideways when the table is wider than the column (like live's .wp-block-table), so wide
     tables are not clipped on phones; the frame sits on the scroll wrapper. The tag navigator (src/scripts/tagjump.ts)
     scrolls a match inside such a table into view sideways.
   - Data tables (2+ rows): rounded warm frame, header row (<thead> or a first row of <th>) bold in the normal text
     colour on a soft brick tint, soft row dividers and a light zebra. Only backgrounds and borders are coloured.
     Tables without <th> keep a plain first row (CSS cannot tell "every cell is bold"; :has() cannot be nested).
   - One-row tables (image/caption layout tables in the Donnelly books) only get the scroll fix. */
html:not(.tables-old) .entry-content figure.wp-block-table{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;margin:0 0 1.6em}
html:not(.tables-old) .entry-content figure.wp-block-table:has(tr+tr){border:1px solid #e3cfbf;border-radius:14px;background:#fff;box-shadow:0 1px 2px rgba(140,44,25,.06),0 6px 18px -10px rgba(90,45,20,.18)}
html:not(.tables-old) .entry-content figure.wp-block-table:has(tr+tr)>table{margin:0;border:0;border-collapse:separate;border-spacing:0;font-size:.95rem;line-height:1.5}
html:not(.tables-old) .entry-content figure.wp-block-table:has(tr+tr) :is(td,th){border:0;border-bottom:1px solid rgba(140,44,25,.12);padding:.65em .85em;vertical-align:top;text-align:left}
html:not(.tables-old) .entry-content figure.wp-block-table:has(tr+tr) tr:last-child>:is(td,th){border-bottom:0}
html:not(.tables-old) .entry-content figure.wp-block-table:has(tr+tr) :is(td,th)+:is(td,th){border-left:1px solid rgba(140,44,25,.07)}
html:not(.tables-old) .entry-content figure.wp-block-table:has(tr+tr) tbody tr:nth-child(even)>td{background:rgba(247,241,234,.7)}
html:not(.tables-old) .entry-content figure.wp-block-table:has(tr+tr) thead :is(th,td),
html:not(.tables-old) .entry-content figure.wp-block-table:has(tr+tr) table:not(:has(thead)) tr:first-child:not(:has(>td))>th{background:#f3e3d8;color:inherit;font-weight:700;border-bottom:2px solid rgba(140,44,25,.28);vertical-align:bottom}
html:not(.tables-old) .entry-content figure.wp-block-table:has(tr+tr) tbody th{background:#f7f1ea;color:inherit;font-weight:700}
html:not(.tables-old) .entry-content figure.wp-block-table:has(tr+tr)>figcaption{margin:0;padding:.55em .9em .65em;border-top:1px solid rgba(140,44,25,.12);background:#fbf7f2;font-size:.85rem;text-align:left}
@media (max-width:767px){
  html:not(.tables-old) .entry-content figure.wp-block-table:has(tr+tr) :is(td,th){padding:.55em .7em}
  html:not(.tables-old) .entry-content figure.wp-block-table:has(tr+tr)>table{font-size:.93rem}
}
html:not(.tables-old) .entry-content :not(figure)>table{display:block;max-width:100%;overflow-x:auto}
/* No box-in-box: when the reading-layout opening panel (.lay-opening, src/lib/layout.ts) holds a framed table, the panel
   drops its own box (background, border, radius, padding) so only the warm table frame remains (4 pages: /daniel, /job,
   /luke-323-38, /destruction-of-babylon). Its text and quote cards are unchanged. ?tables=old or ?layout=old: as before. */
html:not(.layout-old):not(.tables-old) .lay-opening:has(>figure.wp-block-table tr+tr){padding:0;background:none;border:0;border-radius:0;box-shadow:none}

/* Names block (default since 2026-10-07, approved by Tijs; ?names=old restores the heading and bullets).
   The recurring "Names" heading is a bold label paragraph <p class="doa-names" id="names" data-h="2"><strong>Names</strong></p>
   (src/lib/markdown/names-block.mjs); label + the list right after it (on two pages an intro paragraph and list, or one
   paragraph) form one soft green card. Only background and a thin even border are coloured; text keeps the body colour,
   bold stays bold, links keep the normal link style. No bullets or numbers, more room between the names. */
html:not(.names-old) .entry-content p.doa-names:has(+:is(ul,ol,p)){margin:1.9em 0 0;padding:.95em 1.2em .45em;background:#eef2e3;border:1px solid rgba(86,107,52,.26);border-bottom:0;border-radius:14px 14px 0 0}
html:not(.names-old) .entry-content p.doa-names+:is(ul,ol,p),
html:not(.names-old) .entry-content p.doa-names+p+:is(ul,ol){margin:0 0 1.9em;padding:.2em 1.2em 1.1em;background:#eef2e3;border:1px solid rgba(86,107,52,.26);border-top:0;border-radius:0 0 14px 14px;list-style:none}
html:not(.names-old) .entry-content p.doa-names+p:has(+:is(ul,ol)){margin-bottom:0;padding-bottom:.6em;border-bottom:0;border-radius:0}
html:not(.names-old) .entry-content p.doa-names+p+:is(ul,ol){padding-top:0}
html:not(.names-old) .entry-content p.doa-names+:is(ul,ol)>li,
html:not(.names-old) .entry-content p.doa-names+p+:is(ul,ol)>li{margin:0 0 .7em;padding:0;line-height:1.6}
html:not(.names-old) .entry-content p.doa-names+:is(ul,ol)>li:last-child,
html:not(.names-old) .entry-content p.doa-names+p+:is(ul,ol)>li:last-child{margin-bottom:0}
html:not(.names-old) .entry-content p.doa-names+:is(ul,ol)>li::marker,
html:not(.names-old) .entry-content p.doa-names+p+:is(ul,ol)>li::marker{content:none}
@media (max-width:767px){
  html:not(.names-old) .entry-content p.doa-names:has(+:is(ul,ol,p)){padding:.85em 1em .4em}
  html:not(.names-old) .entry-content p.doa-names+:is(ul,ol,p),
  html:not(.names-old) .entry-content p.doa-names+p+:is(ul,ol){padding-left:1em;padding-right:1em}
}

/* Title header without photo (default since 2026-10-07, approved by Tijs; ?hero=old restores the theme's fallback
   photo). Posts without their own image (no featured image, no YouTube cover; 189 posts) carry .doa-hero-plain on the
   hero container ([...slug].astro): no fallback photo, a compact soft beige band with a thin border, the title in the
   normal text colour. Posts with their own image are untouched. */
html:not(.hero-old) .gb-container-0aa5cef8:has(>.doa-hero-plain){height:auto}
html:not(.hero-old) .gb-container-125694d9.doa-hero-plain{height:auto;min-height:0;background-image:none;background-color:#f7f1ea;border:1px solid rgba(140,44,25,.12);border-radius:14px}
html:not(.hero-old) .doa-hero-plain .gb-container-a202e117{padding:28px 28px 26px}
html:not(.hero-old) .doa-hero-plain h1.gb-headline-c4da9f90{display:block;margin:0;padding:0;background:none;box-shadow:none;color:inherit;font-size:40px;line-height:1.25;border-radius:0}
@media (max-width:768px){
  html:not(.hero-old) .gb-container-125694d9.doa-hero-plain{border-width:0 0 1px;border-radius:0}
  html:not(.hero-old) .doa-hero-plain .gb-container-a202e117{padding:18px 16px 16px}
  html:not(.hero-old) .doa-hero-plain h1.gb-headline-c4da9f90{font-size:26px;line-height:1.3}
}

/* Editorial header + opening text (default since 2026-10-07, approved by Tijs; was the ?hero2=c preview test).
   ?hero2=old (preview only, Worker adds html.hero2-old) restores the previous look.
   Header (posts and homepage with their own image; .doa-hero-plain pages keep their own compact header above):
   the photo becomes a small rounded square on the left inside a soft beige card (#f7f1ea, thin warm border), tagline and
   title on the right in dark text. The photo is the same CSS background as before (Base.astro hero CSS / GB dynamic
   bg): the card hides it (background-size 0) and ::before paints it with background-image:inherit, no markup change.
   Opening text: first paragraph of a post as a lead; on the homepage the intro paragraphs before the first heading form
   one opening panel. Emoji-led paragraphs (marked at build time with an empty <i class="doa-emo">,
   src/lib/emoji-marker.mjs) get the emoji in a hanging column, so the text lines up like a list. Text unchanged. */
html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-0aa5cef8:has(>.gb-container-125694d9:not(.doa-hero-plain)>.gb-container-a202e117){height:auto}
html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain):has(>.gb-container-a202e117){
  height:auto;min-height:0;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;
  background-color:#f7f1ea;background-size:0 0;background-repeat:no-repeat;
  border:1px solid rgba(140,44,25,.12);border-radius:14px;padding:14px;box-shadow:none;overflow:hidden}
html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain):has(>.gb-container-a202e117)::before{
  content:"";display:block;width:100%;aspect-ratio:21/8;border-radius:10px;
  background-image:inherit;background-size:cover;background-position:center;background-repeat:no-repeat;background-color:#ece7e0}
html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain)>.gb-container-a202e117{padding:22px 14px 8px}
html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain) h1.gb-headline-c4da9f90{
  display:block;max-width:none;margin:0;padding:0;background:none;box-shadow:none;color:inherit;font-size:40px;line-height:1.25;border-radius:0}
html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain) div.gb-headline-103c80fa{margin:0 0 12px}

@media (max-width:768px){
  html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain):has(>.gb-container-a202e117){
    border-width:0 0 1px;border-radius:0;padding:12px 16px 4px}
  html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain):has(>.gb-container-a202e117)::before{aspect-ratio:16/9;border-radius:12px}
  html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain)>.gb-container-a202e117{padding:16px 0 12px}
  html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain) h1.gb-headline-c4da9f90{font-size:26px;line-height:1.3}
}

/* ---------- Opening text ---------- */
/* Lead: the first paragraph of a post (also right after the table of contents). */
html:not(.hero2-old) body.single-post .entry-content>:is(p:first-child,.toc:first-child+p):not(.doa-names){font-size:1.12em;line-height:1.6}

/* Homepage: intro paragraphs before the first heading = one opening panel. */
html:not(.hero2-old) body.home .entry-content>p.frontpage-p:not(h2~p){
  margin:0;padding:0 1.5rem .9em;background:#fbfaf6;border:solid #ebe5da;border-width:0 1px}
html:not(.hero2-old) body.home .entry-content>p.frontpage-p:first-child{
  margin-top:6px;padding-top:1.3rem;border-top-width:1px;border-radius:14px 14px 0 0;font-size:1.18em;line-height:1.55}
html:not(.hero2-old) body.home .entry-content>p.frontpage-p:not(h2~p):has(+h2){
  padding-bottom:1.3rem;border-bottom-width:1px;border-radius:0 0 14px 14px;margin-bottom:2em}
@media (max-width:768px){
  html:not(.hero2-old) body.home .entry-content>p.frontpage-p:not(h2~p){padding-left:1rem;padding-right:1rem}
}

/* Emoji-led paragraphs: emoji in its own column, text aligned (hanging indent). */
html:not(.hero2-old) .entry-content p:has(i.doa-emo){padding-left:2em;text-indent:0}
html:not(.hero2-old) body.home .entry-content>p.frontpage-p:not(h2~p):has(i.doa-emo){padding-left:calc(1.5rem + 2em)}
@media (max-width:768px){
  html:not(.hero2-old) body.home .entry-content>p.frontpage-p:not(h2~p):has(i.doa-emo){padding-left:calc(1rem + 2em)}
}
html:not(.hero2-old) .entry-content p:has(i.doa-emo)::first-letter{
  float:left;margin:0 0 0 -2em;width:2em;text-align:left;font-size:1.05em}

/* Small square picture left, tagline + title right (like the horizontal post cards). */
html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain):has(>.gb-container-a202e117){
  display:grid;grid-template-columns:200px minmax(0,1fr);align-items:center;column-gap:28px;padding:14px}
html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain):has(>.gb-container-a202e117)::before{
  grid-column:1;grid-row:1;width:200px;aspect-ratio:1/1;border-radius:10px}
html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain)>.gb-container-a202e117{grid-column:2;grid-row:1;padding:6px 14px 6px 0}
html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain) h1.gb-headline-c4da9f90{font-size:36px;line-height:1.25}
@media (max-width:768px){
  html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain):has(>.gb-container-a202e117){
    grid-template-columns:104px minmax(0,1fr);column-gap:14px;padding:12px 16px}
  html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain):has(>.gb-container-a202e117)::before{width:104px;aspect-ratio:1/1;border-radius:10px}
  html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain)>.gb-container-a202e117{padding:2px 0}
  html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain) h1.gb-headline-c4da9f90{font-size:20px;line-height:1.3;overflow-wrap:anywhere;hyphens:auto}
  html:not(.hero2-old) :is(body.single-post,body.home) .gb-container-125694d9:not(.doa-hero-plain) div.gb-headline-103c80fa{margin:0 0 8px;padding:5px 9px;font-size:.62em;letter-spacing:.8px}
}

/* Tagline: no label chip, plain small uppercase muted grey text (#5e5852, neutral warm grey, not red).
   Homepage: beige band runs edge to edge (box-shadow spread + clip-path, so the content stays in the
   content column and nothing overflows), no rounded sides, bigger title. */
html:not(.hero2-old) body.single-post .gb-container-125694d9:not(.doa-hero-plain) div.gb-headline-103c80fa{
  background:none;padding:0;margin:0 0 10px;border-radius:0;color:#5e5852;font-size:14px;line-height:1.4;letter-spacing:1.6px;font-weight:700;text-transform:uppercase}
html:not(.hero2-old) body.home .gb-container-125694d9:not(.doa-hero-plain):has(>.gb-container-a202e117){
  border:0;border-radius:0;box-shadow:0 0 0 100vmax #f7f1ea;clip-path:inset(0 -100vmax);padding:26px 0;column-gap:36px}
html:not(.hero2-old) body.home .gb-container-125694d9:not(.doa-hero-plain) h1.gb-headline-c4da9f90{font-size:52px;line-height:1.15;letter-spacing:-.3px}
@media (max-width:768px){
  html:not(.hero2-old) body.single-post .gb-container-125694d9:not(.doa-hero-plain) div.gb-headline-103c80fa{font-size:11px;letter-spacing:1.3px;margin:0 0 6px}
  html:not(.hero2-old) body.home .gb-container-125694d9:not(.doa-hero-plain):has(>.gb-container-a202e117){
    grid-template-columns:96px minmax(0,1fr);column-gap:16px;padding:18px 16px}
  html:not(.hero2-old) body.home .gb-container-125694d9:not(.doa-hero-plain):has(>.gb-container-a202e117)::before{width:96px}
  html:not(.hero2-old) body.home .gb-container-125694d9:not(.doa-hero-plain) h1.gb-headline-c4da9f90{font-size:29px;line-height:1.2;letter-spacing:0;overflow-wrap:normal;hyphens:manual}
}

/* Homepage topic blocks (default since 2026-10-07, approved by Tijs; was the ?home=new preview test).
   Markup is built into the homepage (src/lib/home-sections.mjs): intro + jump list after the opening panel, each
   section in <section class="doa-hsec" id=...> with a small square picture before its heading.
   Each section = a light warm card (lighter than the header's #f7f1ea), heading row like the editorial header.
   Mobile: the cards become full-width bands (no side borders). No coloured text.
   ?home=old (preview only, Worker adds html.home-old) restores the previous look with CSS only (rules at the end). */
/* The opening panel's last paragraph is followed by the intro instead of the first h2: close the panel there too. */
html:not(.hero2-old) body.home .entry-content>p.frontpage-p:not(h2~p):has(+.doa-home-intro){
  padding-bottom:1.3rem;border-bottom-width:1px;border-radius:0 0 14px 14px;margin-bottom:0}

/* Intro + jump list */
html:not(.home-old) body.home .doa-home-intro{margin:2.4em 0 1.6em}
html:not(.home-old) body.home .doa-home-intro>p{margin:0 0 .8em;font-size:1.12em;line-height:1.55}
html:not(.home-old) body.home .doa-home-jump{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
html:not(.home-old) body.home .doa-home-jump li{margin:0;padding:0}
html:not(.home-old) body.home .doa-home-jump a{display:inline-block;padding:7px 14px;background:#fff;border:1px solid #e2dbd0;border-radius:999px;
  color:inherit;text-decoration:none;font-size:.9em;font-weight:600;line-height:1.3}
html:not(.home-old) body.home .doa-home-jump a:hover,
html:not(.home-old) body.home .doa-home-jump a:focus-visible{border-color:#bfb3a3;background:#fbf8f3}

/* Section cards */
html:not(.home-old) body.home .doa-hsec{margin:0 0 28px;padding:24px 26px 20px;background:#fbf8f3;border:1px solid #ebe5da;border-radius:14px;scroll-margin-top:16px}
html:not(.home-old) body.home .doa-hsec-head{display:flex;align-items:center;gap:18px;margin:0 0 18px}
html:not(.home-old) body.home .doa-hsec-img{flex:0 0 auto;display:block;width:76px;height:76px;margin:0;object-fit:cover;border-radius:10px;background:#ece7e0}
html:not(.home-old) body.home .doa-hsec-head>h2{margin:0;padding:0;color:inherit;line-height:1.2}
html:not(.home-old) body.home .doa-hsec>p:empty{display:none}
html:not(.home-old) body.home .doa-hsec>p:last-child,
html:not(.home-old) body.home .doa-hsec>p:has(+p:empty:last-child){margin-bottom:0}
html:not(.home-old) body.home .doa-hsec>.gb-grid-wrapper:last-child{margin-bottom:0}

@media (max-width:768px){
  html:not(.home-old) body.home .doa-home-intro{margin:2em 0 1.4em}
  html:not(.home-old) body.home .doa-hsec{margin:0 0 22px;padding:20px 0 16px;border:0;border-radius:0;
    box-shadow:0 0 0 100vmax #fbf8f3;clip-path:inset(0 -100vmax)}
  html:not(.home-old) body.home .doa-hsec-head{gap:14px;margin:0 0 14px}
  html:not(.home-old) body.home .doa-hsec-img{width:60px;height:60px;border-radius:9px}
}

/* ?home=old fallback: no intro, no pictures, the wrappers do not box anything (the old flat sections). */
html.home-old body.home .doa-home-intro,
html.home-old body.home .doa-hsec-img{display:none}
html.home-old body.home :is(.doa-hsec,.doa-hsec-head){display:contents}
html.home-old body.home .entry-content>p.frontpage-p:not(h2~p):has(+.doa-home-intro){margin-bottom:2em}
/* child.css spaces the headings with `p + .frontpage-h2` / `.gb-query-loop-wrapper + .frontpage-h2`, which no longer
   match inside the wrappers: same values here for the fallback. */
html.home-old body.home .doa-hsec-head>h2.frontpage-h2{margin-top:40px}
@media (min-width:768px){
  html.home-old body.home .doa-hsec-head>h2.frontpage-h2{margin-top:60px}
}
/* The theme zeroes the bottom margin of the last child of .entry-content; in the fallback that is inside the last section. */
html.home-old body.home .entry-content>.doa-hsec:last-child>:last-child{margin-bottom:0}

/* Homepage "More on X" topic links as full-width button cards (default since 2026-10-07, approved by Tijs; was the
   ?more=new preview test). Small rounded thumbnail, the existing text, a chevron. CSS only: the <p>, the link, its href
   and its anchor text are unchanged. The whole card is clickable (the link's ::after covers it; the chevron ignores
   pointer events). No coloured text. Thumbnails: the hub page's image; /essenes has no image, so the section's heading
   picture. ?more=old (preview only, Worker adds html.more-old) restores the plain text link. */
html:not(.more-old) body.home .doa-hsec>p.wp-block-paragraph:not(.frontpage-p):has(>a[href^="/"]){
  position:relative;display:block;min-height:64px;margin:20px 0 0;padding:20px 52px 20px 78px;
  background:#fff;border:1px solid #e2dbd0;border-radius:12px;box-shadow:0 1px 2px rgba(34,34,34,.04);
  font-weight:700;font-size:1.05em;line-height:24px;color:inherit;transition:border-color .15s ease,background-color .15s ease}
html:not(.more-old) body.home .doa-hsec>p.wp-block-paragraph:not(.frontpage-p):has(>a[href^="/"])::before{
  content:"";position:absolute;left:10px;top:50%;width:52px;height:52px;margin-top:-26px;border-radius:9px;
  background:#ece7e0 center/cover no-repeat}
html:not(.more-old) body.home #atlantis>p.wp-block-paragraph:not(.frontpage-p):has(>a[href="/atlanteans-main"])::before{
  background-image:url(/wp-content/uploads/2024/06/atlantis-harbor-300x200.jpg)}
html:not(.more-old) body.home #essenes-and-magdalenes>p.wp-block-paragraph:not(.frontpage-p):has(>a[href="/essenes"])::before{
  background-image:url(/wp-content/uploads/2024/06/esseness-300x200.jpg)}
/* Chevron */
html:not(.more-old) body.home .doa-hsec>p.wp-block-paragraph:not(.frontpage-p):has(>a[href^="/"])::after{
  content:"";position:absolute;right:22px;top:50%;width:9px;height:9px;margin-top:-5px;
  border:solid currentColor;border-width:2px 2px 0 0;transform:rotate(45deg);transition:right .15s ease;pointer-events:none}
/* The link: dark text, no underline, stretched over the whole card. */
html:not(.more-old) body.home .doa-hsec>p.wp-block-paragraph:not(.frontpage-p)>a[href^="/"]{color:inherit;text-decoration:none}
html:not(.more-old) body.home .doa-hsec>p.wp-block-paragraph:not(.frontpage-p)>a[href^="/"]::after{
  content:"";position:absolute;inset:0;border-radius:12px}
html:not(.more-old) body.home .doa-hsec>p.wp-block-paragraph:not(.frontpage-p):has(>a[href^="/"]):hover{border-color:#bfb3a3;background-color:#fbf8f3}
html:not(.more-old) body.home .doa-hsec>p.wp-block-paragraph:not(.frontpage-p):has(>a[href^="/"]):hover::after{right:18px}
html:not(.more-old) body.home .doa-hsec>p.wp-block-paragraph:not(.frontpage-p):has(>a[href^="/"]:focus-visible){outline:2px solid #222;outline-offset:2px}
html:not(.more-old) body.home .doa-hsec>p.wp-block-paragraph:not(.frontpage-p)>a[href^="/"]:focus-visible{outline:none}
@media (max-width:768px){
  html:not(.more-old) body.home .doa-hsec>p.wp-block-paragraph:not(.frontpage-p):has(>a[href^="/"]){margin-top:16px;padding:18px 46px 18px 72px;min-height:62px}
  html:not(.more-old) body.home .doa-hsec>p.wp-block-paragraph:not(.frontpage-p):has(>a[href^="/"])::before{left:9px;width:48px;height:48px;margin-top:-24px;border-radius:8px}
}