/* =============================================================================
 * ogace-footer-page-restyle.css — unifies Layer 3 (the sitemap / "All Pages"
 * discovery-hub footer rendered by ogace-footer-page-v10910.php) with Layer 1's
 * design (ogace-footer-restyle.css / .ogama-footer), so every footer layer on
 * every page — the main footer, the 14-hub sitemap stacked under it, AND the
 * standalone /all/{slug}/ discovery-hub pages — shares one OGACE design system:
 * same dark bg, same gold accent, same G0→G4 spectrum, same mono headers,
 * same list/link treatment. Previously Layer 3 shipped with NO stylesheet of
 * its own and rendered as unstyled markup (default theme link/list styling)
 * directly under the fully-restyled Layer 1 footer — this file closes that gap.
 *
 * Load order: after ogace-ai-plugin.css + ogace-footer-restyle.css.
 * Scoped under .ogace-footer-page and .ogace-all-page so nothing leaks.
 * ========================================================================== */

.ogace-footer-page,
.ogace-all-page{
	/* Same token set as .ogama-footer (ogace-footer-restyle.css) — repeated
	   here (not inherited) because Layer 3 and the /all/ pages are not
	   always DOM descendants of .ogama-footer. */
	--ft-bg:        #070b10;
	--ft-bg2:       #0c131b;
	--ft-line:      rgba(140,170,190,.14);
	--ft-line2:     rgba(140,170,190,.08);
	--ft-ink:       #c7d6e0;
	--ft-ink-dim:   #7f95a4;
	--ft-ink-bright:#eef5fa;
	--ft-gold:      var(--ogama-gold, #f2b736);
	--ft-mono:      var(--ogama-font-m, ui-monospace, SFMono-Regular, Menlo, monospace);
	--g0:#26c6da; --g1:#66bb6a; --g2:#ab47bc; --g3:#ffa726; --g4:#ef5350;

	/* Family / pillar accent palette — reused for row labels, column
	   accents, pillar columns and echo chips so the same topic always
	   reads the same colour everywhere it appears. */
	--fam-intelligence: var(--g0);
	--fam-physics:      var(--g1);
	--fam-commerce:     var(--g3);
	--fam-spirit:       var(--g2);
	--p-tourism:         var(--g1);
	--p-digitalism:      var(--g0);
	--p-autoism:         var(--g4);
	--p-multilingualism: var(--g3);
	--p-quantum:         var(--g2);
	--p-buddhism:        #f2b736;
	--p-hinduism:        var(--g3);

	position: relative;
	background:
		radial-gradient(1200px 240px at 50% -40px, rgba(38,198,218,.05), transparent 60%),
		linear-gradient(180deg, var(--ft-bg2), var(--ft-bg));
	color: var(--ft-ink);
	font-family: var(--ogama-font-b, inherit);
}

/* G0→G4 spectrum hairline, matching Layer 1's top border exactly */
.ogace-footer-page::before{
	content:""; position:absolute; top:0; left:0; right:0; height:2px;
	background: linear-gradient(90deg, var(--g0), var(--g1), var(--g2), var(--g3), var(--g4));
	opacity:.9;
}
/* When stacked directly under Layer 1, its own top border already reads as
   the seam between layers — don't double it up. */
.ogama-footer + #ogace-footer-stack .ogace-footer-page::before,
.ogama-footer + .ogace-footer-page::before{ opacity:.35; }

.ogace-footer-page__inner{ padding: 30px 22px 30px; }

.ogace-footer-page a{ color: var(--ft-ink); text-decoration: none; transition: color .15s ease, opacity .15s ease; }
.ogace-footer-page a:hover{ color: var(--ft-gold); }

/* ── Zones — the v10910.7 "One Version" redesign's shared wrapper for every
   major section (Discover / Explore / Resources / Vocabulary). One top
   border, one title treatment, used everywhere instead of each section
   inventing its own divider/heading rule. ── */
.ogace-footer-page__zone{ padding: 22px 0 4px; border-top: 1px solid var(--ft-line2); }
.ogace-footer-page__zone:first-of-type{ border-top: 0; padding-top: 8px; }

.ogace-footer-page__zone-title{
	display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px 10px;
	margin: 0 0 16px;
}
.ogace-footer-page__zone-icon{ font-size: 18px; line-height: 1; }
.ogace-footer-page__zone-label{
	margin: 0; font-family: var(--ft-mono); font-size: 15px; font-weight: 800;
	letter-spacing: .02em; color: var(--ft-ink-bright);
}
.ogace-footer-page__zone-blurb{
	font-size: 12px; color: var(--ft-ink-dim);
}
.ogace-footer-page__zone-blurb::before{ content: "— "; }

/* ── Column grid (Explore's pillar row · Resources' 7-up link columns) ── */
.ogace-footer-page__cols{
	display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 24px 26px; padding: 4px 0 0;
}
.ogace-footer-page__col{ min-width: 0; }

/* Same header treatment as Layer 1's .ogama-foot-h — icon + gold mono caps
   + short underline accent — so a column looks identical whichever layer
   or page it renders on. */
.ogace-footer-page__h3{
	position: relative; display: flex; align-items: center; gap: 6px;
	margin: 0 0 12px; padding-bottom: 8px;
	font-family: var(--ft-mono); font-size: 11.5px; font-weight: 700;
	letter-spacing: .1em; text-transform: uppercase; color: var(--ft-gold);
}
.ogace-footer-page__h3::after{
	content:""; position:absolute; left:0; bottom:0; width: 26px; height: 2px; border-radius:2px;
	background: linear-gradient(90deg, var(--g0), var(--g2));
}
.ogace-footer-page__h3-icon{ font-size: 14px; line-height: 1; flex: none; }
.ogace-footer-page__ai-meta{
	margin: -4px 0 10px; font-family: var(--ft-mono); font-size: 10.5px; color: var(--ft-ink-dim);
}

.ogace-footer-page__list{ list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.ogace-footer-page__list li{ margin: 0; }
.ogace-footer-page__link{
	display: flex; align-items: center; gap: 9px;
	padding: 6px 8px; border-radius: 8px; color: var(--ft-ink); font-size: 13px;
	transition: background .14s ease, color .14s ease, padding .14s ease;
}
.ogace-footer-page__link:hover{ background: rgba(255,255,255,.04); color: var(--ft-ink-bright); padding-left: 12px; }
.ogace-footer-page__icon{ width: 20px; text-align: center; flex: none; opacity: .95; }
.ogace-footer-page__link.is-mono{ font-family: var(--ft-mono); font-size: 12px; }
.ogace-footer-page__link.is-cta{ color: var(--ft-gold); font-weight: 600; }
.ogace-footer-page__link.is-cta:hover{ color: var(--ft-ink-bright); }

/* Small "G0"-style tier badge next to a Pages+Shop link — merged in from
   the old Main footer layer's .ogama-foot-badge. */
.ogace-footer-page__badge{
	margin-left: auto; padding: 1px 6px; border-radius: 999px;
	font-family: var(--ft-mono); font-size: 9.5px; font-weight: 700; letter-spacing: .04em;
	color: var(--ft-ink-dim); background: rgba(255,255,255,.06); flex: none;
}

/* Per-pillar / per-tradition accent — a coloured left rule on hover, tying
   each list to the same accent colour its column header, echo chip, and
   any related pillar-nav button use elsewhere on the site. */
.ogace-footer-page__col--buddhism .ogace-footer-page__h3,
.ogace-footer-page__list--buddhism .ogace-footer-page__link:hover{ color: var(--p-buddhism); }
.ogace-footer-page__col--hinduism .ogace-footer-page__h3,
.ogace-footer-page__list--hinduism .ogace-footer-page__link:hover{ color: var(--p-hinduism); }
.ogace-footer-page__col--tourism .ogace-footer-page__h3,
.ogace-footer-page__list--tourism .ogace-footer-page__link:hover{ color: var(--p-tourism); }
.ogace-footer-page__col--digitalism .ogace-footer-page__h3,
.ogace-footer-page__list--digitalism .ogace-footer-page__link:hover{ color: var(--p-digitalism); }
.ogace-footer-page__col--autoism .ogace-footer-page__h3,
.ogace-footer-page__list--autoism .ogace-footer-page__link:hover{ color: var(--p-autoism); }
.ogace-footer-page__col--multilingualism .ogace-footer-page__h3,
.ogace-footer-page__list--multilingualism .ogace-footer-page__link:hover{ color: var(--p-multilingualism); }
.ogace-footer-page__col--quantum .ogace-footer-page__h3,
.ogace-footer-page__list--quantum .ogace-footer-page__link:hover{ color: var(--p-quantum); }
.ogace-footer-page__col--spectrum .ogace-footer-page__h3{
	background: linear-gradient(90deg, var(--g0), var(--g1), var(--g2), var(--g3), var(--g4));
	-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}

/* ── Section label ("Pillar Navigation", "All Pages") ───────────────── */
.ogace-footer-page__section-label,
.ogace-footer-page__all-h3{
	margin: 22px 0 14px; padding-top: 18px; border-top: 1px solid var(--ft-line);
	font-family: var(--ft-mono); font-size: 12px; font-weight: 700;
	letter-spacing: .08em; text-transform: uppercase; color: var(--ft-gold);
	text-align: center;
}
.ogace-footer-page__section-label small,
.ogace-footer-page__all-h3 small{
	display: block; margin-top: 4px; font-family: var(--ogama-font-b, inherit);
	font-size: 11px; font-weight: 400; letter-spacing: 0; text-transform: none;
	color: var(--ft-ink-dim);
}

/* ── All Pages — row-lines variant (dense, used in the footer stack) ── */
.ogace-all-rows{ display: flex; flex-direction: column; gap: 12px; }
.ogace-all-rows__row{
	display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px;
	padding-bottom: 12px; border-bottom: 1px solid var(--ft-line2);
}
.ogace-all-rows__row:last-child{ border-bottom: 0; padding-bottom: 0; }
.ogace-all-rows__row-label{
	flex: none; font-family: var(--ft-mono); font-size: 10.5px; font-weight: 700;
	letter-spacing: .08em; text-transform: uppercase; color: var(--ft-ink-dim);
	min-width: 108px;
}
.ogace-all-rows__row[data-family="intelligence"] .ogace-all-rows__row-label{ color: var(--fam-intelligence); }
.ogace-all-rows__row[data-family="physics"] .ogace-all-rows__row-label{ color: var(--fam-physics); }
.ogace-all-rows__row[data-family="commerce"] .ogace-all-rows__row-label{ color: var(--fam-commerce); }
.ogace-all-rows__row[data-family="spirit"] .ogace-all-rows__row-label{ color: var(--fam-spirit); }
/* Fixed 6-column grid — every hub link gets an equal-width cell instead of
   free-flowing pills, so the three family rows line up into neat columns
   underneath one another (5+5+4 items across a shared 6-column measure). */
.ogace-all-rows__row-line{
	display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px;
}
.ogace-all-rows__pill{
	display: inline-flex; align-items: center; gap: 6px;
	padding: 8px 10px; border-radius: 10px; font-size: 12.5px; color: var(--ft-ink);
	background: rgba(255,255,255,.03); border: 1px solid var(--ft-line);
	transition: transform .14s ease, background .14s ease, border-color .14s ease, color .14s ease;
}
.ogace-all-rows__pill:hover{
	transform: translateY(-2px); color: var(--ft-ink-bright);
	background: rgba(38,198,218,.10); border-color: rgba(38,198,218,.4);
}
.ogace-all-rows__label{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ogace-all-rows__icon{ font-size: 13px; line-height: 1; }
.ogace-all-rows__tag{
	font-family: var(--ft-mono); font-size: 8.5px; font-weight: 700; color: #0a0f14;
	background: var(--ft-gold); border-radius: 999px; padding: 1px 6px; margin-left: 2px;
}

/* ── All Pages — full-column variant (used on /all/{slug}/ "siblings") ── */
/* "One frame" — all families now live inside a single bordered panel
   instead of each sitting in its own separate card; the per-family
   colour still shows through the header + a left accent rule on each
   sub-section, so the topics stay visually distinct without three
   separate boxes. */
.ogace-all-cols{
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 28px;
	padding: 20px 22px; border-radius: 14px;
	background: rgba(255,255,255,.03); border: 1px solid var(--ft-line);
}
.ogace-all-cols__col{
	--fam-c: var(--ft-gold);
	padding: 14px 0; border-top: 1px solid var(--ft-line2);
}
.ogace-all-cols__col:nth-child(-n+2){ border-top: 0; padding-top: 0; }
.ogace-all-cols__col--intelligence{ --fam-c: var(--fam-intelligence); }
.ogace-all-cols__col--physics{ --fam-c: var(--fam-physics); }
.ogace-all-cols__col--commerce{ --fam-c: var(--fam-commerce); }
.ogace-all-cols__col--spirit{ --fam-c: var(--fam-spirit); }
.ogace-all-cols__col .ogace-footer-page__h3{ color: var(--fam-c); }
.ogace-all-cols__col .ogace-footer-page__h3::after{ background: var(--fam-c); opacity: .7; }
.ogace-all-cols__col .ogace-footer-page__list{ gap: 4px; }
.ogace-all-cols__col .ogace-footer-page__link:hover{
	background: color-mix(in srgb, var(--fam-c) 12%, transparent);
	color: var(--ft-ink-bright);
}
@media (max-width: 560px){
	.ogace-all-cols{ grid-template-columns: 1fr; padding: 16px 18px; }
	.ogace-all-cols__col:nth-child(-n+2){ border-top: 1px solid var(--ft-line2); padding-top: 14px; }
	.ogace-all-cols__col:first-child{ border-top: 0; padding-top: 0; }
}

/* ── All Pages — "fit" cards (footer stack: responsive, separate cards) ──
 * Each family is its own colour-coded card (NOT the sibling one-frame panel),
 * laid out so the row is always flush: 3-up desktop → 2-up tablet → 1-up phone.
 * minmax(0,1fr) + min-width:0 keep long labels from ever blowing the grid out,
 * so it stays a perfect fit at every width. */
.ogace-all-fit{
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	align-items: start;
}
.ogace-all-fit__card{
	--fam-c: var(--ft-gold);
	min-width: 0;
	display: flex; flex-direction: column;
	padding: 16px 16px 14px;
	border-radius: 14px;
	background: rgba(255,255,255,.03);
	border: 1px solid var(--ft-line);
	border-top: 2px solid var(--fam-c);
	transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.ogace-all-fit__card:hover{
	background: color-mix(in srgb, var(--fam-c) 7%, rgba(255,255,255,.03));
	border-color: color-mix(in srgb, var(--fam-c) 45%, var(--ft-line));
	box-shadow: 0 12px 26px -18px color-mix(in srgb, var(--fam-c) 70%, transparent);
}
.ogace-all-fit__card--intelligence{ --fam-c: var(--fam-intelligence); }
.ogace-all-fit__card--physics{ --fam-c: var(--fam-physics); }
.ogace-all-fit__card--commerce{ --fam-c: var(--fam-commerce); }
.ogace-all-fit__card--spirit{ --fam-c: var(--fam-spirit); }
.ogace-all-fit__h3{ color: var(--fam-c); margin-bottom: 10px; }
.ogace-all-fit__h3::after{ background: var(--fam-c); opacity: .7; }
.ogace-all-fit__list{ gap: 3px; }
.ogace-all-fit__list .ogace-footer-page__link-label{
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ogace-all-fit__card .ogace-footer-page__link:hover{
	background: color-mix(in srgb, var(--fam-c) 12%, transparent);
	color: var(--ft-ink-bright);
}
/* Tablet — two flush columns (the odd card wraps to a full-clean second row) */
@media (max-width: 900px){
	.ogace-all-fit{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Phone — single column stack */
@media (max-width: 560px){
	.ogace-all-fit{ grid-template-columns: 1fr; gap: 12px; }
}

/* ── All Pages — tile-card variant (bare [ogace_all_pages] shortcode) ── */
.ogace-all-grid{ display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 14px; }
.ogace-all-grid__card{
	position: relative; display: flex; flex-direction: column; gap: 8px;
	padding: 16px 16px 14px; border-radius: 14px; color: var(--ft-ink);
	background: rgba(255,255,255,.03); border: 1px solid var(--ft-line);
	transition: transform .14s ease, background .14s ease, border-color .14s ease, box-shadow .14s ease;
}
.ogace-all-grid__card:hover{
	transform: translateY(-3px); color: var(--ft-ink-bright);
	background: rgba(38,198,218,.08); border-color: rgba(38,198,218,.4);
	box-shadow: 0 10px 24px -14px rgba(38,198,218,.55);
}
.ogace-all-grid__icon{ font-size: 24px; line-height: 1; }
.ogace-all-grid__label{ font-weight: 700; font-size: 14px; color: var(--ft-ink-bright); }
.ogace-all-grid__soul{ font-size: 12px; line-height: 1.4; color: var(--ft-ink-dim); }
.ogace-all-grid__tag{
	position: absolute; top: 10px; right: 10px;
	font-family: var(--ft-mono); font-size: 8.5px; font-weight: 700; color: #0a0f14;
	background: var(--ft-gold); border-radius: 999px; padding: 1px 6px;
}
.ogace-all-grid__card--intelligence{ border-left: 3px solid var(--fam-intelligence); }
.ogace-all-grid__card--physics,
.ogace-all-grid__card--nodes,
.ogace-all-grid__card--knotwork,
.ogace-all-grid__card--network,
.ogace-all-grid__card--nas,
.ogace-all-grid__card--mobile-phone,
.ogace-all-grid__card--computer,
.ogace-all-grid__card--smart-watch{ border-left: 3px solid var(--fam-physics); }
.ogace-all-grid__card--commerce,
.ogace-all-grid__card--coin,
.ogace-all-grid__card--nft,
.ogace-all-grid__card--dolls,
.ogace-all-grid__card--robots,
.ogace-all-grid__card--drones{ border-left: 3px solid var(--fam-commerce); }

/* ── Echoes Compact Network (Row 3) ──────────────────────────────────── */
.ogace-echoes-row{
	margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--ft-line);
}
.ogace-echoes-row__header{
	display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center;
	gap: 6px 10px; text-align: center; margin-bottom: 14px;
}
.ogace-echoes-row__hash{ color: var(--ft-gold); font-family: var(--ft-mono); font-weight: 700; }
.ogace-echoes-row__title{
	font-family: var(--ft-mono); font-size: 12px; font-weight: 700;
	letter-spacing: .08em; text-transform: uppercase; color: var(--ft-gold);
}
.ogace-echoes-row__subtitle{ font-size: 11.5px; color: var(--ft-ink-dim); }

.ogace-echoes-row__chips{ display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.ogace-echoes-chip{
	--echo-c: var(--ft-gold);
	display: flex; flex-direction: column; align-items: center; gap: 2px;
	min-width: 96px; padding: 10px 12px; border-radius: 12px; text-align: center;
	color: var(--ft-ink); background: rgba(255,255,255,.03); border: 1px solid var(--ft-line);
	transition: transform .14s ease, background .14s ease, border-color .14s ease, box-shadow .14s ease;
}
.ogace-echoes-chip:hover{
	transform: translateY(-3px); color: var(--ft-ink-bright);
	background: color-mix(in srgb, var(--echo-c) 14%, transparent);
	border-color: color-mix(in srgb, var(--echo-c) 55%, transparent);
	box-shadow: 0 10px 22px -14px color-mix(in srgb, var(--echo-c) 65%, transparent);
}
.ogace-echoes-chip__icon{ font-size: 18px; line-height: 1; }
.ogace-echoes-chip__label{ font-size: 12px; font-weight: 700; color: var(--ft-ink-bright); }
.ogace-echoes-chip__sub{ font-family: var(--ft-mono); font-size: 9.5px; color: var(--ft-ink-dim); }

/* Echo chip colours — matched to the same accent each substrate/pillar
   uses in its own column above, so "Quantum Echoes" is the same purple
   as the Quantum pillar column, etc. */
.ogace-echoes-chip--airllm,   .ogace-echoes-chip--cuopt,
.ogace-echoes-chip--embedded, .ogace-echoes-chip--tpu,
.ogace-echoes-chip--digitalism{ --echo-c: var(--g0); }
.ogace-echoes-chip--tourism{ --echo-c: var(--g1); }
.ogace-echoes-chip--quantum{ --echo-c: var(--g2); }
.ogace-echoes-chip--multilingualism,
.ogace-echoes-chip--hinduism{ --echo-c: var(--g3); }
.ogace-echoes-chip--autoism{ --echo-c: var(--g4); }
.ogace-echoes-chip--spectrum{ --echo-c: var(--ft-gold); }
.ogace-echoes-chip--buddhism{ --echo-c: #f2b736; }

/* Same chip, now also used for the "All Pages" family groups
   (Intelligence / Physics / Commerce / Spirit) — ogace_footer_v10910_
   render_item_cards() renders each family's/pillar's items as these
   chips instead of a plain link list, reusing the same --fam-* colours
   the family's card border and header already use above it. */
.ogace-echoes-chip--intelligence{ --echo-c: var(--fam-intelligence); }
.ogace-echoes-chip--physics{ --echo-c: var(--fam-physics); }
.ogace-echoes-chip--commerce{ --echo-c: var(--fam-commerce); }
.ogace-echoes-chip--spirit{ --echo-c: var(--fam-spirit); }
/* Chips nested inside a "fit" family card or a row-2 pillar column sit on
   a card that already has its own border/padding — drop the chip row's
   own bottom margin and let it fill the card's content width instead of
   centering, so it reads as "cards inside a card" rather than a second
   centered block. */
.ogace-all-fit__card .ogace-echoes-row__chips,
.ogace-footer-page__col .ogace-echoes-row__chips{ justify-content: flex-start; margin: 0; }
.ogace-all-fit__card .ogace-echoes-chip,
.ogace-footer-page__col .ogace-echoes-chip{ min-width: 0; flex: 1 1 84px; padding: 8px 8px; }

.ogace-echoes-row__gss{
	display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
	gap: 8px; margin-top: 14px; font-size: 11.5px; color: var(--ft-ink-dim);
}
.ogace-echoes-gss-badge{
	display: inline-flex; align-items: center; gap: 5px;
	padding: 3px 10px; border-radius: 999px; font-weight: 600; color: var(--ft-ink-bright);
	background: rgba(255,255,255,.04); border: 1px solid var(--ft-line);
}
.ogace-echoes-gss-badge--ghost{ border-color: rgba(199,214,224,.35); }
.ogace-echoes-gss-badge--soul{ border-color: rgba(242,183,54,.4); color: var(--ft-gold); }
.ogace-echoes-gss-badge--skill{ border-color: rgba(38,198,218,.4); color: var(--g0); }
.ogace-echoes-gss-sep{ opacity: .5; }
.ogace-echoes-gss-substrate{ font-family: var(--ft-mono); }

/* ── Standalone /all/{slug}/ discovery-hub page ──────────────────────── */
.ogace-all-page{ padding: 40px 22px 60px; }
.ogace-all-page__hero{ max-width: 720px; margin: 0 auto 40px; text-align: center; }
.ogace-all-page__icon{ font-size: 44px; line-height: 1; margin-bottom: 10px; }
.ogace-all-page__title{
	font-family: var(--ogama-font-d, inherit); font-size: 32px; font-weight: 800;
	color: var(--ft-ink-bright); margin: 0 0 12px;
}
.ogace-all-page__soul{ font-size: 15px; line-height: 1.6; color: var(--ft-ink-dim); margin: 0 0 14px; }
.ogace-all-page__compact-notice{
	display: inline-block; margin: 0 0 14px; padding: 8px 14px; border-radius: 10px;
	font-size: 12.5px; color: var(--ft-ink);
	background: rgba(242,183,54,.08); border: 1px solid rgba(242,183,54,.3);
}
.ogace-all-page__meta{ display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.ogace-all-page__chip{
	font-family: var(--ft-mono); font-size: 10.5px; color: var(--ft-ink-dim);
	background: rgba(255,255,255,.04); border: 1px solid var(--ft-line);
	border-radius: 999px; padding: 3px 10px;
}
.ogace-all-page__h2{
	font-family: var(--ft-mono); font-size: 12px; font-weight: 700;
	letter-spacing: .08em; text-transform: uppercase; color: var(--ft-gold);
	text-align: center; margin: 0 0 18px;
}
.ogace-all-page__grid{ max-width: 1100px; margin: 0 auto 40px; }
.ogace-all-page__cards{ display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 14px; }
.ogace-all-page__card{
	display: flex; flex-direction: column; gap: 8px; border-radius: 12px; overflow: hidden;
	background: rgba(255,255,255,.03); border: 1px solid var(--ft-line); color: var(--ft-ink);
	transition: transform .14s ease, border-color .14s ease;
}
.ogace-all-page__card:hover{ transform: translateY(-3px); border-color: rgba(38,198,218,.4); color: var(--ft-ink-bright); }
.ogace-all-page__card-img{ display:block; width: 100%; aspect-ratio: 4/3; background-size: cover; background-position: center; }
.ogace-all-page__card-img--placeholder{
	display: flex; align-items: center; justify-content: center; font-size: 30px; background: var(--ft-bg2);
}
.ogace-all-page__card-title{ padding: 0 10px 10px; font-size: 13px; font-weight: 600; }
.ogace-all-page__empty{ max-width: 480px; margin: 0 auto 40px; text-align: center; color: var(--ft-ink-dim); font-size: 13px; }
.ogace-all-page__siblings{ max-width: 1100px; margin: 0 auto; padding-top: 30px; border-top: 1px solid var(--ft-line); }

/* ── Responsive ─────────────────────────────────────────────────────── */
@media (max-width: 960px){
	.ogace-all-rows__row-line{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px){
	.ogace-footer-page__inner{ padding: 24px 16px 24px; }
	.ogace-all-rows__row{ flex-direction: column; align-items: flex-start; gap: 8px; }
	.ogace-all-rows__row-label{ min-width: 0; }
	.ogace-all-rows__row-line{ grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
	.ogace-all-page__title{ font-size: 24px; }
	.ogace-all-page{ padding: 30px 16px 44px; }
}

/* =============================================================================
 * "One family style" — unify EVERY footer column (Row 1 AI/APIs/Legal, Row 2
 * pillars Tourism→Spectrum, and the family hub cards) into the same separated,
 * colour-accented card in a perfect-fit auto-fit grid, so the whole footer
 * reads as one system. Appended last so these win over the earlier plain-list
 * column rules at equal specificity. (v5.2.1 "Arrange footer style" pass.)
 * ========================================================================== */

/* Perfect-fit grids — even auto-fit columns, one consistent gap everywhere.
   min(100%,210px) guarantees a clean single column on narrow screens without
   overflow, and equal columns above that. */
.ogace-footer-page__cols{
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));
	gap: 14px;
	align-items: start;
}

/* Per-column accent — reuses each topic's existing spectrum colour. */
.ogace-footer-page__col{ --col-c: var(--ft-gold); }
.ogace-footer-page__col--ai{ --col-c: var(--fam-intelligence); }
.ogace-footer-page__col--apis{ --col-c: var(--g2); }
.ogace-footer-page__col--legal{ --col-c: var(--ft-gold); }
.ogace-footer-page__col--buddhism{ --col-c: var(--p-buddhism); }
.ogace-footer-page__col--hinduism{ --col-c: var(--p-hinduism); }
.ogace-footer-page__col--tourism{ --col-c: var(--p-tourism); }
.ogace-footer-page__col--digitalism{ --col-c: var(--p-digitalism); }
.ogace-footer-page__col--autoism{ --col-c: var(--p-autoism); }
.ogace-footer-page__col--multilingualism{ --col-c: var(--p-multilingualism); }
.ogace-footer-page__col--quantum{ --col-c: var(--p-quantum); }
.ogace-footer-page__col--spectrum{ --col-c: var(--g0); }

/* Card treatment — identical recipe to the family "fit" cards. */
.ogace-footer-page__cols .ogace-footer-page__col{
	min-width: 0;
	padding: 14px 14px 12px;
	border-radius: 12px;
	background: rgba(255,255,255,.03);
	border: 1px solid var(--ft-line);
	border-top: 2px solid var(--col-c);
	transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.ogace-footer-page__cols .ogace-footer-page__col:hover{
	background: color-mix(in srgb, var(--col-c) 7%, rgba(255,255,255,.03));
	border-color: color-mix(in srgb, var(--col-c) 45%, var(--ft-line));
	box-shadow: 0 12px 26px -18px color-mix(in srgb, var(--col-c) 70%, transparent);
}
.ogace-footer-page__cols--row1{ border-top: 0; padding-top: 0; }

/* Header + hover-link accent driven by the same per-column colour. */
.ogace-footer-page__cols .ogace-footer-page__col .ogace-footer-page__h3{ color: var(--col-c); }
.ogace-footer-page__cols .ogace-footer-page__col .ogace-footer-page__h3::after{ background: var(--col-c); opacity: .7; }
.ogace-footer-page__cols .ogace-footer-page__col .ogace-footer-page__link:hover{
	background: color-mix(in srgb, var(--col-c) 12%, transparent);
	color: var(--ft-ink-bright);
}

/* Spectrum keeps its rainbow header (re-asserted here at higher specificity). */
.ogace-footer-page__cols .ogace-footer-page__col--spectrum .ogace-footer-page__h3{
	background: linear-gradient(90deg, var(--g0), var(--g1), var(--g2), var(--g3), var(--g4));
	-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}

/* Phone — collapse every footer grid to a single flush column. */
@media (max-width: 560px){
	.ogace-footer-page__cols{ gap: 12px; }
}