/*
Theme Name: Atomic WP Theme
Theme URI: https://atomic-design.be/
Author: Atomic Design
Description: Neutral standalone block-theme foundation for the Atomic WP ecosystem.
Version: 0.1.0
Text Domain: atomic-wp
Requires at least: 6.6
*/

/* =========================================================
   Base layout
   ========================================================= */

:root {
	--awp-page-gutter: clamp(20px, 4vw, 64px);
	--awp-button-arrow-content: "→"; /* @deprecated: saved pre-ADR-030 button classes only. */
	--awp-separator-upper-color: var(--wp--preset--color--surface, #ffffff);
	--awp-separator-lower-color: var(--wp--preset--color--background, #ffffff);
	--awp-rail-track-color: var(--wp--preset--color--border, #d6d3d1);
	--awp-rail-track-width: 2px;
	--awp-rail-marker-size: 0.75rem;
	--awp-rail-marker-color: var(--wp--preset--color--surface, #ffffff);
	--awp-rail-marker-active-color: var(--awp-context-accent, var(--wp--preset--color--primary, #0f172a));
	--awp-rail-label-color: var(--wp--preset--color--text, currentColor);
	--awp-rail-gap: var(--wp--preset--spacing--50);
	--awp-rail-active-scale: 1.15;
}

.wp-site-blocks {
	min-height: 100vh;
}

/* Global semantic utility: forcefully hides an element on all viewports.
   Placed on the parent theme so every child theme can rely on it.
   !important matches the intended "strong guard" semantics — when .hidden
   is applied, the element must not render, regardless of other display
   declarations (e.g. inline `display:flex` on block wrappers). */
.hidden {
	display: none !important;
}

/* Smooth same-document navigation is opt-in: the selector only activates
   when the reusable Back to Top pattern is present. */
html:has(.awp-back-to-top) {
	scroll-behavior: smooth;
}

/* =========================================================
   Shared header / footer — static presentation only.
   Nav V1 + Motion remain the ONLY owners of scroll / sticky
   / shrink / transparent-at-top runtime behavior.
   Theme CSS below only styles emitted classes or a static
   base state; no new scroll listener / rAF / class toggle.
   ========================================================= */

.awp-site-header,
.awp-site-footer {
	position: relative;
}

/* Static header refinements: generous vertical pad, inline
   width guard, soft background border via token. Flex alignment
   tuned for editorial logotype + nav. */
.awp-site-header {
	padding-block: var(--wp--preset--spacing--30);
	background-color: var(--wp--preset--color--background, #ffffff);
	border-bottom-color: var(--wp--preset--color--border, #d6d3d1);
	border-bottom-style: solid;
	border-bottom-width: 1px;
	will-change: transform, padding;
}

/* Generic reusable sticky/retract header (opt-in via filter awp_theme_enable_sticky_header).
   ZERO client tokens. Child themes opt-in via ONE line. Reduced-motion respected.
   Focus / open submenu forces visible. Mobile breakpoint disables retract. */
.awp-site-header.awp-site-header--sticky-enabled {
	/* Generic runtime configuration; child themes may override per site. */
	--awp-header-retract-threshold: 280px;
	position: sticky;
	top: 0;
	z-index: var(--awp-z-header, 100);
	transition: transform 320ms cubic-bezier(0.16, 1, 0.3, 1),
		padding-block 220ms ease,
		box-shadow 220ms ease;
}
.awp-site-header.awp-site-header--sticky-enabled.awp-site-header--at-top {
	transform: none;
	box-shadow: none;
}
.awp-site-header.awp-site-header--sticky-enabled.awp-site-header--compact {
	transform: none;
	padding-block: calc(var(--wp--preset--spacing--20, 0.6rem) * 0.75);
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05), 0 4px 16px rgba(15, 23, 42, 0.06);
}
.awp-site-header.awp-site-header--sticky-enabled.awp-site-header--retracted {
	transform: translateY(calc(-100% - 8px));
	padding-block: calc(var(--wp--preset--spacing--20, 0.6rem) * 0.75);
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}
.awp-site-header.awp-site-header--sticky-enabled.awp-site-header--force-visible,
.awp-site-header.awp-site-header--sticky-enabled:focus-within,
.awp-site-header.awp-site-header--sticky-enabled:has([aria-expanded="true"]) {
	transform: none !important;
}
@media (prefers-reduced-motion: reduce) {
	.awp-site-header.awp-site-header--sticky-enabled,
	.awp-site-header.awp-site-header--sticky-enabled.awp-site-header--at-top,
	.awp-site-header.awp-site-header--sticky-enabled.awp-site-header--compact,
	.awp-site-header.awp-site-header--sticky-enabled.awp-site-header--retracted {
		transition: none !important;
		transform: none !important;
	}
}
@media (max-width: 781.98px) {
	.awp-site-header.awp-site-header--sticky-enabled.awp-site-header--retracted {
		transform: none !important;
	}
}

/* Generic promoted header layout (NAV-03 / NAV-06):
   Parent provides canonical flex space-between + width modes.
   Child may only provide client-specific variant styles/branding,
   never re-declare these generic layout foundations. */
.awp-site-header > .wp-block-group__inner-container,
.awp-site-header > .wp-block-group {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--40);
	padding-inline: var(--awp-page-gutter);
	margin-inline: auto;
	width: 100%;
	box-sizing: border-box;
}

.awp-site-header__identity {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	gap: var(--wp--preset--spacing--20);
	min-width: 0;
}

.awp-site-header__identity .wp-block-site-title {
	margin: 0;
	font-family: var(--wp--preset--font-family--display-font);
	font-size: var(--wp--preset--font-size--large);
	line-height: 1;
}

/* Three-region headers keep the Core navigation visually centered between
   the site identity and the action region. The flex fallback above remains
   the generic two-region header layout. */
.awp-site-header > .wp-block-group:has(> .wp-block-navigation):has(> .wp-block-buttons) {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	align-items: center;
	justify-content: initial;
}
.awp-site-header > .wp-block-group:has(> .wp-block-navigation):has(> .wp-block-buttons) > .wp-block-navigation {
        justify-self: center;
        min-width: 0;
        margin-block: 0;
        align-self: center;
}
.awp-site-header > .wp-block-group:has(> .wp-block-navigation):has(> .wp-block-buttons) > .wp-block-buttons {
        justify-self: end;
        margin-block: 0;
        align-self: center;
}
.awp-site-header > .wp-block-group:has(> .wp-block-navigation):has(> .wp-block-buttons) > :first-child {
        justify-self: start;
        min-width: 0;
        margin-block: 0;
        align-self: center;
}
/* Canonical header width modes — single source of truth.
   Width tokens are Core's global contentSize / wideSize; "full" bypasses. */
.awp-site-header.awp-site-header--width-content > .wp-block-group__inner-container,
.awp-site-header.awp-site-header--width-content > .wp-block-group {
	max-width: var(--wp--style--global--content-size, 46rem);
}
.awp-site-header.awp-site-header--width-wide > .wp-block-group__inner-container,
.awp-site-header.awp-site-header--width-wide > .wp-block-group {
	max-width: var(--wp--style--global--wide-size, 80rem);
}
.awp-site-header.awp-site-header--width-full > .wp-block-group__inner-container,
.awp-site-header.awp-site-header--width-full > .wp-block-group {
	max-width: none;
}

/* CTA mobile visibility is a SETTING, not a universal rule.
   Only hide CTAs on mobile when header.cta.mobileVisible=false. */
@media (max-width: 782px) {
	.awp-site-header.awp-site-header--cta-mobile-hidden .wp-block-buttons {
		display: none;
	}
}

/* Branded logo widths (NAV-07 shared precedence): resolved sizes via CSS vars.
   Parent does not hard-code client-specific size literals. */
.awp-site-header .wp-block-site-logo { flex: 0 0 auto; }
.awp-site-header .wp-block-site-logo img {
	width: var(--awp-nav-logo-width-desktop, 240px);
	height: auto;
	max-height: none;
	object-fit: contain;
	object-position: left center;
}
@media (max-width: 782px) {
	.awp-site-header .wp-block-site-logo img {
		width: var(--awp-nav-logo-width-mobile, 200px);
		max-height: none;
	}
}

@media (max-width: 782px) {
	.awp-site-header > .wp-block-group:has(> .wp-block-navigation):has(> .wp-block-buttons) {
		display: flex;
		justify-content: space-between;
	}
}

/* Nav typography + spacing (NAV-05) — generic presentation.
   All values flow from shared-precedence CSS custom properties,
   never local literals in the child. */
.awp-site-header nav {
	font-size: var(--awp-nav-font-size, inherit);
	font-weight: var(--awp-nav-font-weight, inherit);
	letter-spacing: var(--awp-nav-letter-spacing, inherit);
}
.awp-site-header .wp-block-navigation__container,
.awp-site-header nav .wp-block-page-list {
	gap: var(--awp-nav-link-gap, var(--wp--preset--spacing--40));
}
.awp-site-header nav .wp-block-navigation-item__content,
.awp-site-header nav a {
	color: var(--awp-nav-link-color, inherit);
}
.awp-site-header nav a:hover {
	color: var(--awp-nav-link-hover-color, var(--awp-context-accent, inherit));
}
.awp-site-header nav .current-menu-item > a,
.awp-site-header nav .wp-block-navigation-item.is-active > a,
.awp-site-header nav a:active,
.awp-site-header nav a.current {
	color: var(--awp-nav-link-active-color, var(--awp-context-accent, inherit));
}

/* Link decoration modes (NAV-05).
   Explicitly named classes; child themes may add client accent overrides. */
.awp-nav.awp-nav--deco-none nav a,
.awp-nav.awp-nav--deco-none nav .wp-block-navigation-item__content {
	text-decoration: none;
}
.awp-nav.awp-nav--deco-underline nav a {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}
.awp-nav.awp-nav--deco-underline-on-hover nav a {
	text-decoration: none;
}
.awp-nav.awp-nav--deco-underline-on-hover nav a:hover {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}
.awp-nav.awp-nav--deco-active-underline nav .current-menu-item > a,
.awp-nav.awp-nav--deco-active-underline nav .wp-block-navigation-item.is-active > a,
.awp-nav.awp-nav--deco-active-underline nav a.current {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}

/* Footer foundation: rhythm, top hairline via accent token,
   block spacing, muted sub-copy and copyright line sizing. */
.awp-site-footer {
	padding-block-start: var(--wp--preset--spacing--60);
	padding-block-end: var(--wp--preset--spacing--60);
	padding-inline: var(--awp-page-gutter);
	margin-block-start: var(--wp--preset--spacing--70);
	background-color: var(--wp--preset--color--surface, #f5f5f4);
	border-top-color: var(--wp--preset--color--accent, #111827);
	border-top-style: solid;
	border-top-width: 1px;
	box-sizing: border-box;
}

.awp-site-footer > .wp-block-group__inner-container,
.awp-site-footer > .wp-block-group,
.awp-site-footer .awp-site-footer__inner {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--40);
	width: 100%;
	max-width: var(--wp--style--global--wide-size, 80rem);
	margin-inline: auto;
}

.awp-site-footer .wp-block-site-logo,
.awp-site-footer .wp-block-image {
	flex: 0 0 auto;
	max-width: min(100%, var(--awp-footer-logo-width, 9rem));
	margin: 0;
}

.awp-site-footer .wp-block-site-logo img,
.awp-site-footer .wp-block-image img {
	width: auto;
	max-width: min(100%, var(--awp-footer-logo-width, 9rem));
	max-height: var(--awp-footer-logo-max-height, 6rem);
	height: auto;
	object-fit: contain;
	object-position: left center;
}

.awp-site-header .wp-block-navigation__container,
.awp-site-footer .wp-block-navigation__container {
	gap: var(--wp--preset--spacing--30);
}

.awp-site-header .wp-block-site-tagline,
.awp-site-footer .wp-block-site-tagline,
.awp-site-footer .wp-block-paragraph {
	color: var(--wp--preset--color--muted, #6b7280);
}

/* =========================================================
   Main content column
   ========================================================= */

.awp-site-main {
	margin-block-start: 0;
	margin-top: 0;
	padding-top: 0;
	padding-bottom: var(--wp--preset--spacing--70);
}

.awp-site-main > .wp-block-query,
.awp-site-main > .wp-block-post-content,
.awp-site-main > .wp-block-post-featured-image,
.awp-site-main > .wp-block-post-terms,
.awp-site-main > .wp-block-comments,
.awp-site-main > .wp-block-post-title {
	margin-block-start: 0;
}

/* =========================================================
   Shared pattern panel
   ========================================================= */

.awp-pattern-panel {
	box-sizing: border-box;
	border: var(--wp--custom--border--width, 1px) solid var(--wp--preset--color--border, #d6d3d1);
	border-radius: var(--wp--custom--radius--lg, 1.25rem);
	background: var(--wp--preset--color--background, #ffffff);
	padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--50);
}

.wp-block-group.is-style-panel {
	box-sizing: border-box;
	border: var(--wp--custom--border--width, 1px) solid var(--wp--preset--color--border, #d6d3d1);
	border-radius: var(--wp--custom--radius--lg, 1.25rem);
	background: var(--wp--preset--color--background, #ffffff);
	padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--50);
}

/* =========================================================
   NEW semantic awp- classes introduced by Brand/Design V1.
   Count: 7 NEW .awp-* className introductions (≤12 cap).
   Pre-existing awp- classes: awp-site-header, awp-site-footer,
   awp-site-main, awp-pattern-panel.
   ========================================================= */

/* 1. Section vertical rhythm delimiter. Outer wrapper for
      home sections 2-5 and secondary page wrappers.
      Alternates background via descendant modifier later. */
.awp-section {
	padding-block-start: var(--wp--preset--spacing--70);
	padding-block-end: var(--wp--preset--spacing--70);
}

.awp-section:not([class*="awp-section--inner-width-"]) > .wp-block-group__inner-container,
.awp-section:not([class*="awp-section--inner-width-"]) > * {
	max-width: var(--wp--style--global--wide-size, 80rem);
	margin-inline: auto;
}

/* 2. Editorial intro wrapper — eyebrow + heading + lede. */
.awp-editorial-intro {
	max-width: var(--wp--style--global--content-size, 46rem);
	margin-inline: auto;
	text-align: center;
}

/* 3. Eyebrow variant — muted uppercase/small tracking. */
.awp-editorial-intro__eyebrow {
	color: var(--wp--preset--color--primary, #0f172a);
	font-size: var(--wp--preset--font-size--small, 0.875rem);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin-block: 0 var(--wp--preset--spacing--30);
}

/* 4. Lede variant — slightly larger body, wider measure,
      looser line-height for an editorial opener. */
.awp-editorial-intro__lede {
	font-size: var(--wp--preset--font-size--large, 1.125rem);
	line-height: 1.7;
	color: var(--wp--preset--color--text, #1f2937);
	max-width: 48rem;
	margin-inline: auto;
}

/* 5. Hero editorial pattern — background/surface wash,
      generous spacing, subtle accent hairline below. */
.awp-pattern-hero {
	background-color: var(--wp--preset--color--surface, #f5f5f4);
	border-bottom: 1px solid var(--wp--preset--color--accent, #111827);
}

.awp-pattern-hero .wp-block-heading {
	color: var(--wp--preset--color--text, #1f2937);
}

.awp-pattern-hero .wp-block-paragraph.has-muted-color {
	color: var(--wp--preset--color--text, #1f2937);
	opacity: 0.8;
}

/* 6. Callout / conversion CTA block — surface accent, soft
      border-left primary accent. */
.awp-callout {
	background-color: var(--wp--preset--color--surface, #f5f5f4);
	border-left: 3px solid var(--wp--preset--color--primary, #0f172a);
	border-radius: var(--wp--custom--radius--md, 0.75rem);
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--60);
	box-sizing: border-box;
}

.wp-block-group.is-style-callout {
	background-color: var(--wp--preset--color--surface, #f5f5f4);
	border-left: 3px solid var(--wp--preset--color--primary, #0f172a);
	border-radius: var(--wp--custom--radius--md, 0.75rem);
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--60);
	box-sizing: border-box;
}

/* End of NEW awp- class introductions.
   Total NEW awp- className count = 7 (of 12 allowed). */

/* =========================================================
   Palette background alternations — reuses the delimiter
   class, does not introduce new awp- names.
   ========================================================= */

.awp-section.is-style-surface {
	background-color: var(--wp--preset--color--surface, #f5f5f4);
}

.awp-section.is-style-paper {
	background-color: var(--wp--preset--color--background, #ffffff);
}

/* =========================================================
   Focus & accessibility — visible focus rings via primary
   token for all interactive descendants of awp components.
   ========================================================= */

.awp-site-header a:focus-visible,
.awp-site-footer a:focus-visible,
.awp-section a:focus-visible,
.awp-pattern-hero a:focus-visible,
.awp-editorial-intro a:focus-visible,
.awp-callout a:focus-visible,
.awp-site-header button:focus-visible,
.awp-site-footer button:focus-visible,
.wp-element-button:focus-visible,
.wp-block-button__link:focus-visible,
.wp-block-navigation a:focus-visible,
.wp-block-navigation button:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary, #0f172a);
	outline-offset: 2px;
	border-radius: var(--wp--custom--radius--sm, 0.375rem);
}

/* Optional site attribution is informational, never a call to action. */
.awp-footer-attribution {
	margin: var(--wp--preset--spacing--20, .5rem) 0 0;
	font-size: var(--wp--preset--font-size--small, .875rem);
	opacity: .72;
}
.awp-footer-attribution a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .16em; }

/* =========================================================
   Button / link transitions — subtle, always guarded by
   prefers-reduced-motion reset below.
   ========================================================= */

.wp-element-button,
.wp-block-button__link,
.wp-block-button > .wp-block-button__link,
.awp-site-header a,
.awp-site-footer a,
.awp-section a,
.awp-pattern-hero a {
	transition-duration: 150ms;
	transition-timing-function: ease;
	transition-property: color, background-color, border-color, box-shadow, text-decoration-color;
}

/* =========================================================
   Reduced motion — disable every non-essential transition /
   animation added by this stylesheet.
   Constitutional INV-08 / Constitution invariant 8.
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
	html:has(.awp-back-to-top) {
		scroll-behavior: auto;
	}
	.wp-element-button,
	.wp-block-button__link,
	.awp-site-header a,
	.awp-site-footer a,
	.awp-section a,
	.awp-pattern-hero a,
	.awp-callout a {
		transition: none !important;
		animation: none !important;
	}
}

/* =========================================================
   Image rendering guard — Core images inherit aspect,
   preserve intrinsic ratios, radius via token.
   ========================================================= */

.wp-block-image img {
	height: auto;
	max-width: 100%;
	object-fit: cover;
}

/* =========================================================
   Accessibility refinements.
   WCAG target size (Level AA, 2.5.5) minimum ~44px for
   primary button controls; Nav V1 owns its own toggles.
   200% zoom / reflow: prevent horizontal overflow on root
   containers so zoomed text never forces a side scrollbar.
   ========================================================= */

.wp-element-button,
.wp-block-button__link {
	min-height: 2.75rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	--awp-icon-primary: currentColor;
	--awp-icon-secondary: currentColor;
}

.wp-element-button:active,
.wp-block-button__link:active { opacity: 0.88; }

html,
body {
	overflow-x: clip;
}

/* =========================================================
   Typography invariants — no mid-word breaks for editorial text.
   Normal words wrap only at natural language boundaries.
   ========================================================= */

h1, h2, h3, h4, h5, h6,
p, li, figcaption, label,
.wp-block-navigation-item,
.wp-block-button__link,
.wp-block-navigation a,
.wp-block-post-title,
.wp-block-site-title,
a {
	word-break: normal;
	overflow-wrap: normal;
	hyphens: none;
	-webkit-hyphens: none;
}

/* Scoped exception for machine strings / URLs / hashes / IDs / code. */
.awp-break-technical {
	overflow-wrap: anywhere;
	word-break: normal;
}

/* =========================================================
   Narrow-screen / mobile responsiveness.
   ========================================================= */

@media (max-width: 782px) {
	.awp-section {
		padding-block-start: var(--wp--preset--spacing--60);
		padding-block-end: var(--wp--preset--spacing--60);
	}

	.awp-site-header {
		padding-block-start: var(--wp--preset--spacing--30);
		padding-block-end: var(--wp--preset--spacing--30);
	}
}

/* =========================================================
   Contextual accent cascade
   ========================================================= */

:root {
	--awp-context-accent: var(--wp--preset--color--primary, #0f172a);
	--awp-context-on-accent: var(--wp--preset--color--background, #ffffff);
	/* Compatibility aliases for existing client content. New components use
	   the context names above. */
	--awp-accent: var(--awp-context-accent);
	--awp-on-accent: var(--awp-context-on-accent);
}

/* Semantic context utilities are palette-role based, never brand-color based.
   A child/site palette may add any other slug through the native block
   background setting or the render-time awp-context-{slug} bridge. */
.awp-context-primary,
.awp-context-secondary,
.awp-context-accent,
.awp-context-contrast {
	--awp-context-on-accent: var(--wp--preset--color--background, #ffffff);
}
.awp-context-primary { --awp-context-accent: var(--wp--preset--color--primary, #0f172a); }
.awp-context-secondary { --awp-context-accent: var(--wp--preset--color--secondary, #6b7280); }
.awp-context-accent { --awp-context-accent: var(--wp--preset--color--accent, #111827); }
.awp-context-contrast {
	--awp-context-accent: var(--wp--preset--color--contrast, #111111);
	--awp-context-on-accent: var(--wp--preset--color--background, #ffffff);
}

.awp-accent-surface,
.wp-block-group.awp-accent-surface,
.awp-section.awp-accent-surface {
	--awp-context-accent: var(--wp--preset--color--primary, #0f172a);
	--awp-context-on-accent: var(--wp--preset--color--background, #ffffff);
	background-color: var(--awp-context-accent);
	color: var(--awp-context-on-accent);
}

.awp-accent-surface .wp-block-heading,
.awp-accent-surface .wp-block-paragraph {
	color: inherit;
}

/* Accent position hooks (section → component → leaf).
   Consumer adds these classes on any Group ancestor.
   Parent defaults to generic palette tokens; child
   theme re-maps via its own theme.json palette. */
.awp-card {
	box-sizing: border-box;
	min-width: 0;
	max-width: 100%;
	height: 100%;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: var(--wp--preset--spacing--30);
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
	border: var(--wp--custom--border--width, 1px) solid var(--wp--preset--color--border, #d6d3d1);
	border-radius: var(--awp-card-radius, var(--wp--custom--radius--lg, 1.25rem));
	background-color: var(--wp--preset--color--background, #ffffff);
	box-shadow: var(--awp-card-shadow, 0 1px 2px rgb(0 0 0 / 3%));
}

.wp-block-group.is-style-card {
	box-sizing: border-box;
	min-width: 0;
	max-width: 100%;
	height: 100%;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: var(--wp--preset--spacing--30);
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
	border: var(--wp--custom--border--width, 1px) solid var(--wp--preset--color--border, #d6d3d1);
	border-radius: var(--awp-card-radius, var(--wp--custom--radius--lg, 1.25rem));
	background-color: var(--wp--preset--color--background, #ffffff);
	box-shadow: var(--awp-card-shadow, 0 1px 2px rgb(0 0 0 / 3%));
}

.awp-card__title {
	box-sizing: border-box;
	max-width: 100%;
	margin: 0;
	overflow-wrap: normal;
}

.awp-card__copy {
	box-sizing: border-box;
	max-width: 100%;
	margin: 0;
	overflow-wrap: normal;
}

.awp-card-grid,
.wp-block-group.awp-card-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
	align-items: stretch;
	gap: var(--wp--preset--spacing--40);
}

.awp-card-grid > * {
	min-width: 0;
	margin-block-start: 0;
}

.awp-card-grid > .awp-card {
	align-self: stretch;
	height: 100%;
}

.awp-card__orb {
	box-sizing: border-box;
	width: var(--awp-card-orb-size, 3.5rem);
	aspect-ratio: 1;
	flex: 0 0 var(--awp-card-orb-size, 3.5rem);
	max-width: 100%;
	border-radius: 9999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	background-color: var(--awp-context-accent, var(--wp--preset--color--primary, #0f172a));
	color: var(--awp-context-on-accent, var(--wp--preset--color--background, #ffffff));
	font-weight: 700;
}

.awp-card__orb--sm { --awp-card-orb-size: 2.5rem; }
.awp-card__orb img,
.awp-card__orb svg { width: var(--awp-card-orb-icon-size, 1.75rem); height: var(--awp-card-orb-icon-size, 1.75rem); display: block; }

.awp-card {
	border-color: color-mix(in srgb, var(--awp-context-accent) 20%, var(--wp--preset--color--border, #d6d3d1));
}

/* Thin accent hairline consumed by Hero / Split / Cards. */
.awp-accent-line {
	height: 3px;
	width: 3rem;
	background-color: var(--awp-context-accent, currentColor);
	border: 0;
	margin-inline: 0;
}
.awp-accent-line.is-style-centered {
	margin-inline: auto;
}

/* =========================================================
   Document / prose treatment — restrained long-form reading
   for legal notices, policies and similar prose pages.
   Width, rhythm and type scale only; palette stays native.
   ========================================================= */

.wp-block-group.is-style-document {
	box-sizing: border-box;
	max-width: min(100% - 2 * var(--awp-page-gutter, 1rem), 56rem);
	margin-inline: auto;
}
.wp-block-group.is-style-document > :first-child { margin-block-start: 0; }
.wp-block-group.is-style-document h1.wp-block-heading,
.wp-block-group.is-style-document h1 {
	font-size: clamp(2rem, 1.6rem + 2vw, 3rem);
	line-height: 1.05;
	text-wrap: balance;
}
.wp-block-group.is-style-document h2.wp-block-heading,
.wp-block-group.is-style-document h2 {
	font-size: clamp(1.35rem, 1.2rem + 0.8vw, 1.75rem);
	line-height: 1.15;
	margin-block-start: var(--wp--preset--spacing--60, 2.25rem);
	text-wrap: balance;
}
.wp-block-group.is-style-document h3.wp-block-heading,
.wp-block-group.is-style-document h3 {
	font-size: clamp(1.1rem, 1.05rem + 0.3vw, 1.25rem);
	line-height: 1.25;
	margin-block-start: var(--wp--preset--spacing--50, 1.5rem);
}
.wp-block-group.is-style-document p,
.wp-block-group.is-style-document li {
	line-height: 1.7;
	overflow-wrap: normal;
}
.wp-block-group.is-style-document ul.wp-block-list,
.wp-block-group.is-style-document ol.wp-block-list {
	padding-inline-start: 1.25rem;
}
.wp-block-group.is-style-document ul.wp-block-list > li + li,
.wp-block-group.is-style-document ol.wp-block-list > li + li {
	margin-block-start: var(--wp--preset--spacing--20, 0.5rem);
}
.wp-block-group.is-style-document > p.has-small-font-size:last-child {
	color: var(--wp--preset--color--muted, #6b7280);
}

/* =========================================================
   Legacy Button optional-icon model for saved pre-ADR-030 content.
   3 states: NONE (native Core), BEFORE (pseudo ::before),
   AFTER (pseudo ::after). Arrow content via CSS only so
   labels remain real visible text.
   BEFORE state proven in focused fixture/unit test only;
   production sites never consume it visibly unless design explicitly calls for it.
   Always single focus surface; real text label kept.
   ========================================================= */

.wp-block-button.is-style-has-icon-before .wp-block-button__link::before,
.wp-element-button.is-style-has-icon-before::before,
.wp-block-button__link.has-icon-before::before {
	content: var(--awp-button-arrow-content, "→");
	margin-inline-end: 0.5rem;
	display: inline-block;
	line-height: 1;
	speak: never;
}

.wp-block-button.is-style-has-icon-after .wp-block-button__link::after,
.wp-element-button.is-style-has-icon-after::after,
.wp-block-button__link.has-icon-after::after {
	content: var(--awp-button-arrow-content, "→");
	margin-inline-start: 0.5rem;
	display: inline-block;
	line-height: 1;
	speak: never;
}

/* Core Button visual variants. WordPress theme.json / Global Styles owns the
   common geometry. These semantic styles consume the same native presets and
   keep explicit Gutenberg background/text choices authoritative. */
.wp-block-button:not(.is-style-outline):not(.is-style-secondary):not(.is-style-on-dark):not(.is-style-ghost):not(.is-style-text) > .wp-block-button__link:not(.has-background),
.wp-block-button.is-style-primary > .wp-block-button__link:not(.has-background) {
	background-color: var(--awp-context-accent, var(--wp--preset--color--primary, #0f172a));
	border-color: var(--awp-context-accent, var(--wp--preset--color--primary, #0f172a));
	border-style: solid;
	color: var(--awp-context-on-accent, var(--wp--preset--color--background, #ffffff));
}

.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background),
.wp-block-button.is-style-secondary > .wp-block-button__link:not(.has-background) {
	background-color: var(--wp--preset--color--background, #ffffff);
	border-color: var(--awp-context-accent, var(--wp--preset--color--primary, #0f172a));
	border-style: solid;
}
.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-text-color),
.wp-block-button.is-style-secondary > .wp-block-button__link:not(.has-text-color) {
	color: var(--awp-context-accent, var(--wp--preset--color--primary, #0f172a));
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover:not(.has-background),
.wp-block-button.is-style-outline > .wp-block-button__link:focus-visible:not(.has-background),
.wp-block-button.is-style-secondary > .wp-block-button__link:hover:not(.has-background),
.wp-block-button.is-style-secondary > .wp-block-button__link:focus-visible:not(.has-background) {
	background-color: var(--awp-context-accent, var(--wp--preset--color--primary, #0f172a));
	border-color: var(--awp-context-accent, var(--wp--preset--color--primary, #0f172a));
	color: var(--awp-context-on-accent, var(--wp--preset--color--background, #ffffff));
}

/* Explicit On-dark style, plus the existing semantic light-foreground context
   for saved content. The translucent surface is a readable fallback before
   backdrop-filter support is considered. */
.wp-block-button.is-style-on-dark > .wp-block-button__link:not(.has-background),
.wp-block-group.awp-content-color-light .wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background) {
	background-color: rgb(255 255 255 / 12%);
	border-color: rgb(255 255 255 / 68%);
	border-style: solid;
	box-shadow: inset 0 1px 0 rgb(255 255 255 / 12%);
}
.wp-block-button.is-style-on-dark > .wp-block-button__link:not(.has-text-color),
.wp-block-group.awp-content-color-light .wp-block-button.is-style-outline > .wp-block-button__link:not(.has-text-color) {
	color: var(--wp--preset--color--background, #ffffff);
}
.wp-block-button.is-style-on-dark > .wp-block-button__link:hover:not(.has-background),
.wp-block-button.is-style-on-dark > .wp-block-button__link:focus-visible:not(.has-background),
.wp-block-group.awp-content-color-light .wp-block-button.is-style-outline > .wp-block-button__link:hover:not(.has-background),
.wp-block-group.awp-content-color-light .wp-block-button.is-style-outline > .wp-block-button__link:focus-visible:not(.has-background) {
	background-color: rgb(255 255 255 / 22%);
	border-color: rgb(255 255 255 / 90%);
	color: var(--wp--preset--color--background, #ffffff);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
	.wp-block-button.is-style-on-dark > .wp-block-button__link:not(.has-background),
	.wp-block-group.awp-content-color-light .wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background) {
		-webkit-backdrop-filter: blur(10px) saturate(130%);
		backdrop-filter: blur(10px) saturate(130%);
	}
}

.wp-block-button > .wp-block-button__link:hover,
.wp-block-button > .wp-block-button__link:focus-visible {
	box-shadow: 0 10px 26px color-mix(in srgb, var(--wp--preset--color--contrast, #111827) 14%, transparent);
}

.wp-block-button.is-style-ghost > .wp-block-button__link:not(.has-background) {
	background-color: transparent;
	border-color: transparent;
}
.wp-block-button.is-style-ghost > .wp-block-button__link:not(.has-text-color) {
	color: var(--awp-context-accent, var(--wp--preset--color--primary, #0f172a));
}

/* On-accent button / surface contrast helpers.
   Solid filled surfaces that are NOT on accent-background
   themselves use their text as primary. On-accent guarantees:
   blue/red/black → white text; yellow/muted/light → dark text. */
.awp-on-accent {
	color: var(--awp-context-on-accent, var(--wp--preset--color--background, #ffffff));
}
.wp-block-button.awp-on-accent .wp-block-button__link {
	background-color: var(--awp-context-accent);
	color: var(--awp-context-on-accent);
	border-color: var(--awp-context-accent);
}

/* =========================================================
   TASK 2. Media treatment vocabulary (Core Block Styles).
   Default: Core. Editorial: softer contrast + serif crop.
   Accent Corner: 3px accent border bottom-right.
   Hover Tint: subtle accent overlay on hover/keyfocus.
   Corner+Tint combination is additive by applying both.
   Motion transitions always reduced-motion guarded.
   ========================================================= */

.wp-block-image.is-style-editorial img,
.wp-block-video.is-style-editorial video,
.wp-block-image.is-style-editorial figure {
	filter: contrast(0.97) saturate(0.95);
	box-shadow: 0 1px 2px rgba(17, 24, 39, 0.04);
}

.wp-block-image.is-style-accent-corner figure,
.wp-block-video.is-style-accent-corner figure {
	position: relative;
	overflow: hidden;
}
.wp-block-image.is-style-accent-corner figure::after,
.wp-block-video.is-style-accent-corner figure::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: 0;
	width: 1.5rem;
	height: 1.5rem;
	border-right: 3px solid var(--awp-context-accent, currentColor);
	border-bottom: 3px solid var(--awp-context-accent, currentColor);
	border-bottom-right-radius: var(--wp--custom--radius--md, 0.75rem);
	pointer-events: none;
}

.wp-block-image.is-style-hover-tint figure,
.wp-block-video.is-style-hover-tint figure {
	position: relative;
	overflow: hidden;
}
.wp-block-image.is-style-hover-tint figure::before,
.wp-block-video.is-style-hover-tint figure::before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: var(--awp-context-accent, #0f172a);
	opacity: 0;
	transition: opacity 200ms ease;
	z-index: 2;
	pointer-events: none;
}
.wp-block-image.is-style-hover-tint:hover figure::before,
.wp-block-video.is-style-hover-tint:hover figure::before,
.wp-block-image.is-style-hover-tint figure:focus-within::before,
.wp-block-video.is-style-hover-tint figure:focus-within::before {
	opacity: 0.18;
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-image.is-style-hover-tint figure::before,
	.wp-block-video.is-style-hover-tint figure::before {
		transition: none;
	}
}
