/* About page (design C): split hero + photo collage, story + video, values bento, product groups.
   Values come from theme.json presets; icon sizes are the only raw lengths.
   Children use margin: 0 !important because WordPress layout rules (flow/flex/constrained) set margins on them. */

/* ---------- section rhythm (top-level blocks of the page) ---------- */
.kcg-ab-hero + .kcg-ab-story { margin-top: 0 !important; } /* the hero's bottom padding is the gap */
.kcg-ab-sec { display: grid; gap: var(--wp--preset--spacing--60); margin-top: var(--wp--preset--spacing--90) !important; }
.kcg-ab-sec > * { margin: 0 !important; }
.kcg-ab-sec + .kcg-strip { margin-top: var(--wp--preset--spacing--90) !important; }
.kcg-ab-h1 { line-height: 1.08; letter-spacing: -.025em; text-wrap: balance; } /* ds-ok: design type tracking */
.kcg-ab-h2 { letter-spacing: -.015em; text-wrap: balance; } /* ds-ok: design type tracking */

/* icons (core Icon block) */
.kcg-ab-kicker__ic, .kcg-ab-note__ic, .kcg-ab-val__ic, .kcg-ab-group__arrow { display: grid !important; place-items: center; flex: none; }
.kcg-ab-kicker__ic svg { width: 18px; height: 18px; fill: currentColor; } /* ds-ok: icon size */
.kcg-ab-note__ic svg, .kcg-ab-val__ic svg, .kcg-ab-group__arrow svg { width: 20px; height: 20px; fill: currentColor; } /* ds-ok: icon size */

/* ---------- hero: text column + collage ---------- */
.kcg-ab-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: var(--wp--preset--spacing--80); align-items: center; padding-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--70); }
.kcg-ab-hero > *, .kcg-ab-hero__txt > * { margin: 0 !important; }
.kcg-ab-hero__txt { display: grid; gap: var(--wp--preset--spacing--50); justify-items: start; }
.kcg-ab-kicker { gap: var(--wp--preset--spacing--20) !important; padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--30) var(--wp--preset--spacing--10) var(--wp--preset--spacing--20); border-radius: var(--wp--preset--border-radius--pill); font-weight: 600; }
.kcg-ab-lede { max-width: 48ch; }
.kcg-ab-hero .wp-block-buttons { gap: var(--wp--preset--spacing--30); }
/* facts: 3 cells split by hairlines */
.kcg-ab-hero__txt > .kcg-ab-facts { display: flex; justify-self: stretch; margin-top: var(--wp--preset--spacing--20) !important; padding-top: var(--wp--preset--spacing--50); border-top: 1px solid var(--wp--preset--color--line); }
.kcg-ab-facts > * { flex: 1; margin: 0 !important; padding-inline: var(--wp--preset--spacing--50); border-left: 1px solid var(--wp--preset--color--line); }
.kcg-ab-facts > :first-child { padding-left: 0; border-left: 0; }
.kcg-ab-fact > * { margin: 0 !important; }
.kcg-ab-fact > * + * { margin-top: var(--wp--preset--spacing--10) !important; }
.kcg-ab-fact-n { font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; }
/* collage: big photo top-right, framed photo bottom-left, opening-hours card bottom-right */
.kcg-ab-collage { position: relative; aspect-ratio: 1.12; } /* ds-ok: design ratio */
.kcg-ab-collage > * { position: absolute; margin: 0 !important; }
.kcg-ab-collage .wp-block-image img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--wp--preset--border-radius--medium); }
.kcg-ab-collage__main { top: 0; right: 0; width: 84%; height: 84%; } /* ds-ok: design ratio */
.kcg-ab-collage__sub { left: 0; bottom: 0; width: 48%; aspect-ratio: 4 / 3; } /* ds-ok: design ratio */
.kcg-ab-collage .kcg-ab-collage__sub img { border: var(--wp--preset--spacing--20) solid var(--wp--preset--color--paper); box-shadow: var(--wp--preset--shadow--lift); }
.kcg-ab-collage > .kcg-ab-note { right: var(--wp--preset--spacing--40); bottom: var(--wp--preset--spacing--40); gap: var(--wp--preset--spacing--30); padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40); border-radius: var(--wp--preset--border-radius--medium); box-shadow: var(--wp--preset--shadow--lift); }
.kcg-ab-note__t > * { margin: 0 !important; }

/* ---------- story: text + video ---------- */
.kcg-ab-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--wp--preset--spacing--80); align-items: center; padding: var(--wp--preset--spacing--80); border-radius: var(--wp--preset--border-radius--medium); }
.kcg-ab-story > *, .kcg-ab-story__txt > * { margin: 0 !important; }
.kcg-ab-story__txt { display: grid; gap: var(--wp--preset--spacing--40); }
.kcg-ab-story__txt p { max-width: 62ch; text-wrap: pretty; }
.kcg-ab-story .wp-block-embed__wrapper { border-radius: var(--wp--preset--border-radius--medium); overflow: hidden; }
.kcg-ab-story .wp-block-embed figcaption { margin: var(--wp--preset--spacing--30) 0 0; text-align: left; font-weight: 500; }

/* ---------- values bento: tall brand card + two cards ---------- */
.kcg-ab-bento { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: var(--wp--preset--spacing--40); } /* ds-ok: design ratio */
.kcg-ab-bento > *, .kcg-ab-val > *, .kcg-ab-val__b > * { margin: 0 !important; }
.kcg-ab-val { display: grid; gap: var(--wp--preset--spacing--30); align-content: start; padding: var(--wp--preset--spacing--70); border-radius: var(--wp--preset--border-radius--medium); }
.kcg-ab-val p { text-wrap: pretty; }
.kcg-ab-val__ic { justify-self: start; width: 48px; height: 48px; border-radius: var(--wp--preset--border-radius--small); background: var(--wp--preset--color--brand-soft); color: var(--wp--preset--color--brand); } /* ds-ok: icon tile size */
.kcg-ab-lead { grid-row: span 2; align-content: space-between; gap: var(--wp--preset--spacing--70); }
.kcg-ab-lead .kcg-ab-val__ic { background: var(--wp--preset--color--on-brand); }
.kcg-ab-val__b { display: grid; gap: var(--wp--preset--spacing--30); }
.kcg-ab-big { line-height: 1.45; font-weight: 500; }

/* ---------- product groups: photo cards from a Terms Query ---------- */
.kcg-ab-sec > .kcg-ab-sec__h { align-items: baseline; gap: var(--wp--preset--spacing--40); }
.kcg-ab-sec__h > * { margin: 0 !important; } /* .kcg-all has a top margin for use under grids */
/* the 3-column grid and its gap are the Term Template block's own layout settings (the 900px query only drops to 2) */
.kcg-ab-group > *, .kcg-ab-group__b > *, .kcg-ab-group__t > * { margin: 0 !important; }
.kcg-ab-group { position: relative; display: grid; grid-template-rows: auto 1fr; height: 100%; border-radius: var(--wp--preset--border-radius--medium); overflow: hidden; transition: box-shadow .25s var(--wp--custom--ease); } /* ds-ok: same motion as theme.css cards */
.kcg-ab-group:hover { box-shadow: var(--wp--preset--shadow--lift); }
.kcg-ab-group:has(a:focus-visible) { outline: 2px solid var(--wp--preset--color--brand); outline-offset: 2px; } /* ds-ok: same focus ring as theme.json buttons */
.kcg-ab-group__img { aspect-ratio: 16 / 10; overflow: hidden; } /* ds-ok: design ratio */
.kcg-ab-group .kcg-ab-group__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--wp--custom--ease); }
.kcg-ab-group:hover .kcg-ab-group__img img { transform: scale(1.04); }
.kcg-ab-group__b { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--wp--preset--spacing--30); align-items: center; padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50); }
.kcg-ab-group .kcg-term-icon { width: 40px; height: 40px; } /* ds-ok: icon tile size */
.kcg-ab-group .wp-block-term-name { font-size: var(--wp--preset--font-size--medium); font-weight: 700; line-height: 1.3; }
.kcg-ab-group .wp-block-term-name a { color: var(--wp--preset--color--ink); text-decoration: none; }
.kcg-ab-group .wp-block-term-name a::after { content: ""; position: absolute; inset: 0; } /* the whole card is the category link */
.kcg-ab-group__arrow { transition: transform .25s var(--wp--custom--ease); } /* ds-ok: same motion as theme.css cards */
.kcg-ab-group:hover .kcg-ab-group__arrow { transform: translateX(3px); } /* ds-ok: design nudge */

/* hotline link inside the navy strip sentence reads as text */
.kcg-strip__txt a { color: inherit; }

@media (max-width: 900px) {
	.kcg-ab-hero, .kcg-ab-story { grid-template-columns: minmax(0, 1fr); }
	.kcg-ab-hero { gap: var(--wp--preset--spacing--70); }
	.kcg-ab-story { gap: var(--wp--preset--spacing--60); padding: var(--wp--preset--spacing--60); }
	.kcg-ab-groups .wp-block-term-template { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
	.kcg-ab-sec { margin-top: var(--wp--preset--spacing--80) !important; }
	.kcg-ab-facts > * { padding-inline: var(--wp--preset--spacing--30); }
	.kcg-ab-collage > .kcg-ab-note { right: var(--wp--preset--spacing--20); bottom: var(--wp--preset--spacing--20); padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30); }
	.kcg-ab-story { padding: var(--wp--preset--spacing--40); }
	.kcg-ab-bento { grid-template-columns: minmax(0, 1fr); }
	.kcg-ab-lead { grid-row: auto; }
	.kcg-ab-val { padding: var(--wp--preset--spacing--50); }
	.kcg-ab-group__b { grid-template-columns: minmax(0, 1fr); padding: var(--wp--preset--spacing--30); }
	.kcg-ab-group .kcg-term-icon, .kcg-ab-group .kcg-ab-group__arrow { display: none !important; }
}