/* ==========================================================================================================
   knowledge.css — FAQ page, Resources (blog index + articles), search results and the privacy policy (agent "knowledge").
   Loaded after dds.css + wp.css on those views only (inc/knowledge.php), and in the block editor so article
   content classes preview correctly. Tone variables only (DESIGN §4.7); never hard-coded colours.
   Builders: .build/content/knowledge/*.js. Classes added here (not GB global classes; set via the block's
   "Additional CSS class"): dds-prose, dds-article-head, dds-article, dds-article__media, dds-article__credit,
   dds-article__meta, dds-toc, dds-group-head, dds-pagination, dds-search; in post content: dds-ticks, dds-article-note,
   dds-article-cta, dds-sources.
   ========================================================================================================== */

/* ---------- FAQ: lists inside answers (DESIGN §8.12 sets every answer child to padding 0 40px 24px 52px) ---------- */
.dds-faq .gb-accordion__content > :is(ul, ol){ padding-left:74px; list-style:disc; }
.dds-faq .gb-accordion__content > :is(ul, ol) li + li{ margin-top:6px; }
.dds-faq .gb-accordion__content > :is(ul, ol) li::marker{ color:var(--muted); }
@media (max-width:767px){ .dds-faq .gb-accordion__content > :is(ul, ol){ padding-left:62px; } }

/* FAQ group heads (left column): eyebrow → H2 → intro → link arrow */
.dds-group-head h2{ margin-bottom:16px; }
.dds-group-head .dds-intro{ max-width:26em; margin-bottom:22px; }

/* ---------- Long-form text (article body, privacy policy): a 720 px reading column ---------- */
.dds-prose{ max-width:720px; font-size:1.0625rem; line-height:1.7; color:var(--fg-2); }
.dds-prose :is(p, ul, ol){ margin:0 0 1.25em; }
.dds-prose :is(ul, ol){ padding-left:1.35em; }
.dds-prose li + li{ margin-top:.5em; }
.dds-prose li::marker{ color:var(--muted); }
.dds-prose :is(strong, b){ font-weight:600; color:var(--fg); }
.dds-prose h2{ margin:2.2em 0 .55em; font-size:clamp(1.75rem, 1.45rem + 1vw, 2.25rem); line-height:1.12; }
.dds-prose h3{ margin:1.7em 0 .5em; font-size:1.375rem; line-height:1.25; letter-spacing:0; }
.dds-prose :is(h2, h3):first-child{ margin-top:0; }
.dds-prose :is(h2, h3) + :is(p, ul, ol){ margin-top:0; }
.dds-prose a{ overflow-wrap:anywhere; }
.dds-prose > :last-child, .dds-prose .dynamic-entry-content > :last-child{ margin-bottom:0; }
@media (max-width:767px){ .dds-prose{ font-size:1rem; line-height:1.65; } }

/* Checklist items (article 2 "Quick checklist"): empty boxes to tick, like the preflight legend (DESIGN §8.6). */
.dds-ticks, .dds-prose .dds-ticks{ list-style:none; padding-left:0; }
.dds-ticks li{ position:relative; padding-left:32px; }
.dds-ticks li::before{ content:""; position:absolute; left:0; top:.28em; width:18px; height:18px; border:1.5px solid var(--icon); border-radius:var(--radius); background:var(--surface); }

/* The article's closing prompt and its general-information note. */
.dds-article-cta, .dds-prose .dds-article-cta{ margin:40px 0 1.25em; padding:20px 24px; border-left:3px solid var(--accent-2); background:var(--tile); color:var(--fg); }
.dds-article-note, .dds-prose .dds-article-note{ margin-top:40px; padding-top:20px; border-top:1px solid var(--line); font-size:.9375rem; line-height:1.55; font-style:italic; color:var(--muted); }
.dds-prose .dds-article-note + .dds-article-cta{ margin-top:24px; }

/* Sources (part of each article body; Article.citation comes from the same list). */
.dds-sources{ margin-top:56px; padding-top:28px; border-top:1px solid var(--rule); }
.dds-sources h2, .dds-prose .dds-sources h2{ margin:0 0 16px; font-size:1.5rem; line-height:1.2; }
.dds-sources ol, .dds-prose .dds-sources ol{ margin:0; padding-left:1.6em; font-size:.9375rem; line-height:1.5; color:var(--muted); }
.dds-sources li + li{ margin-top:.55em; }
.dds-sources li::marker{ font:500 .75rem/1 var(--f-mono); color:var(--muted); }
.dds-sources a{ overflow-wrap:anywhere; }
/* GP pads group inner containers like page sections on full-width layouts (.site-main .wp-block-group__inner-container
   {padding:64px 24px}); inside a reading column a group is just a wrapper. */
.dds-sources > .wp-block-group__inner-container, .dds-prose .wp-block-group__inner-container{ max-width:none; padding:0; }

/* ---------- Loop/content templates: bands butt edge to edge (R1 KN-04) ----------
   GP gives every direct child of .site-main a bottom margin (24 px; 20 px ≤ 767). A loop template prints its
   sections straight into .site-main, so each band left a paper sliver under it. Pages, services and projects have one
   child (the article wrapper), so they never showed it. */
:is(.blog, .archive, .search, .single-post) .site-main > :is(section, article, div){ margin-bottom:0; }

/* ---------- Single article (GP content template, post:post) ---------- */
/* style.css narrows .site-main to 720 px for GP's default single template; the content template runs full width
   (its own column below), so the bands and the CTA panel can span the page like every other template. */
.single-post .site-main{ max-width:none; }
.dds-article-head, .dds-article{ max-width:720px; margin-inline:auto; }
.dds-article-head h1{ max-width:none; margin-bottom:20px; font-size:clamp(2.25rem, 1.55rem + 2.3vw, 3.5rem); line-height:1.06; }
.dds-article-head .dds-lead{ max-width:none; }
.dds-article__meta{ margin-top:20px; }
/* Breadcrumb: the current item is the title cut to 5 words on a word boundary ({{dds_article key:crumb_title}}),
   so no CSS ellipsis (it cut mid-word); a long crumb wraps like any other. */
/* Featured image: figure > viewfinder + the visible photo credit (DECISIONS-R1 D10), 13 px muted, 8 px under it. */
.dds-article__media{ margin:0 0 48px; }
.dds-article__media .dds-article__credit{ margin:8px 0 0; font-size:.8125rem; line-height:1.45; color:var(--muted); }
.dds-article__credit a{ color:var(--fg-2); text-decoration:underline; text-underline-offset:2px; }
.dds-article__credit a:hover{ color:var(--link); }
.dds-article-body{ padding-block:clamp(40px, 4vw, 64px) clamp(56px, 5vw, 80px); }
@media (max-width:767px){ .dds-article__media{ margin-bottom:32px; } }

/* ---------- Resources cards: the "Read the article" row nudges like the service cards (DESIGN §8.8) ---------- */
.dds-post-card .dds-card__more svg{ width:20px; height:20px; color:var(--arrow); stroke-width:1.75; transition:transform .2s ease; }
.dds-post-card:hover .dds-card__more svg{ transform:translateX(4px); }
.dds-post-card__body .dds-small{ margin-top:-2px; font-size:.875rem; }
.dds-post-card__body h2, .dds-post-card__body h3{ font-size:1.5rem; line-height:1.18; }
@media (max-width:767px){ .dds-post-card__body h2, .dds-post-card__body h3{ font-size:1.375rem; } }

/* 768–1024: two columns, so an odd last card would sit alone beside an empty cell (R1 KN-07). It spans the row
   instead, laid out horizontally: media ~45 % on the left, the text on the right. Polish R2: the same at ≥1025 for a
   card alone on the last row of the 3-column grid (media one column wide), and a text-only card (search: a page
   without a photo) simply spans the row with its text kept to a readable measure. */
@media (min-width:768px) and (max-width:1024px){
  .dds-post-cards > .dds-post-card:last-child:nth-child(odd){ grid-column:1 / -1; }
  .dds-post-cards > .dds-post-card:last-child:nth-child(odd):has(> .dds-vf){ display:grid; grid-template-columns:minmax(0,45%) minmax(0,1fr); }
  .dds-post-cards > .dds-post-card:last-child:nth-child(odd) > .dds-vf{ aspect-ratio:auto; min-height:220px; border-bottom:0; border-right:1px solid var(--line); }
}
@media (min-width:1025px){
  .dds-post-cards > .dds-post-card:last-child:nth-child(3n+1){ grid-column:1 / -1; }
  .dds-post-cards > .dds-post-card:last-child:nth-child(3n+1):has(> .dds-vf){ display:grid; grid-template-columns:calc((100% - 40px) / 3) minmax(0,1fr); }
  .dds-post-cards > .dds-post-card:last-child:nth-child(3n+1) > .dds-vf{ aspect-ratio:auto; min-height:220px; border-bottom:0; border-right:1px solid var(--line); }
}
.dds-post-cards > .dds-post-card:not(:has(> .dds-vf)) .dds-post-card__body > p:not(.dds-post-card__meta){ max-width:46em; }

/* Query pagination (shows once there are more articles than one page holds). */
.dds-pagination:not(:has(a, .page-numbers)){ display:none; }
.dds-pagination{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:40px; font:600 1rem/1 var(--f-body); }
.dds-pagination .page-numbers, .dds-pagination a{ display:inline-grid; place-items:center; min-width:44px; min-height:44px; padding:0 12px; border:1px solid var(--line); border-radius:var(--radius); color:var(--fg); text-decoration:none; }
.dds-pagination a:hover{ border-color:var(--fg); color:var(--fg); }
.dds-pagination .page-numbers.current{ background:var(--fg); border-color:var(--fg); color:var(--bg); }
.dds-pagination .page-numbers.dots{ border-color:transparent; }
.dds-pagination nav{ display:flex; flex-wrap:wrap; gap:8px; }

/* ---------- Search results (GP loop template search-loop, R1 KN-01) ---------- */
/* H1 "Results for “<term>”": a long or unbroken term wraps instead of overflowing. */
.search .dds-page-hero h1{ max-width:20ch; overflow-wrap:anywhere; }
/* Core search form in the hero's right column, styled like the site's form fields (DESIGN §8.17) and buttons (§8.2). */
.dds-search{ margin:0; }
.dds-search .wp-block-search__label{ display:block; margin:0 0 8px; color:var(--fg); font:600 1rem/1.35 var(--f-body); }
.dds-search .wp-block-search__inside-wrapper{ display:flex; gap:8px; width:100%; padding:0; border:0; background:none; }
.dds-search .wp-block-search__input{ flex:1 1 auto; min-width:0; min-height:52px; margin:0; padding:12px 14px; background:var(--white); color:var(--fg);
  border:1.5px solid var(--muted); border-radius:var(--radius); box-shadow:none; font:400 1rem/1.4 var(--f-body); }
.dds-search .wp-block-search__input:hover{ border-color:var(--fg); }
.dds-search .wp-block-search__input:focus{ outline:2px solid var(--focus); outline-offset:3px; border-color:var(--fg); }
.dds-search .wp-block-search__button{ flex:none; display:inline-flex; align-items:center; justify-content:center; min-height:52px; margin:0; padding:13px 22px;
  background:var(--btn-bg); color:var(--btn-fg); border:1px solid var(--btn-bd); border-radius:var(--radius); font:600 1rem/1.2 var(--f-body); cursor:pointer;
  transition:background-color var(--t), color var(--t), border-color var(--t); }
.dds-search .wp-block-search__button:is(:hover, :focus-visible){ background:var(--btn-bg-h); color:var(--btn-fg-h); border-color:var(--btn-bd-h); }
/* A service result without a photo shows its plate (DESIGN §8.18); dark plates get the light brackets (.dds-vf--light). */
.dds-post-card .dds-vf[data-dds-frame="light"]{ --vf-c:rgba(247,244,236,.95); --vf-halo:rgba(19,36,29,.7); }
/* A result with neither a photo nor a plate: a page or project has no viewfinder at all (Polish R2, inc/knowledge.php
   {{dds_search key:frame}}); an article without a photo keeps the contour panel in the grids and drops it on phones. */
@media (max-width:767px){ .search .dds-post-card > .dds-vf:not(:has(img)){ display:none; } }
/* Polish R3: on phones a service result drops its plate too, as the service cards on /services/ and home do (the
   plate's callouts were also too small there). Articles keep their photos. */
@media (max-width:767px){ .search .dds-post-card.type-dds_service > .dds-vf{ display:none; } }
/* Result titles are H2s (the results are the page's top-level items); same size as the Resources card H3s. */
.search .dds-post-card__body h2{ margin-bottom:0; }

/* ---------- Privacy policy: sticky "On this page" list beside the text (desktop only) ---------- */
.dds-toc{ font-size:.9375rem; line-height:1.4; }
.dds-toc .dds-mono{ margin-bottom:12px; color:var(--eyebrow); }
.dds-toc ol{ margin:0; padding:0 0 0 14px; list-style:none; border-left:1px solid var(--line); }
.dds-toc a{ display:block; padding:5px 0; color:var(--fg-2); text-decoration:none; }
.dds-toc a:hover{ color:var(--link); text-decoration:underline; }
@media (max-width:1024px){ .dds-toc, .dds-sticky:has(> .dds-toc){ display:none; } }
