/* =========================================================================
   AM Memorial Theme - main stylesheet
   Mobile-first, system fonts only, no remote assets, no JavaScript.
   ========================================================================= */

:root {
	--am-color-background: #f8f5ef;
	--am-color-surface: #fffdf8;
	--am-color-surface-muted: #eee8de;
	--am-color-warm: #f4e7da;
	--am-color-text: #202722;
	--am-color-muted: #59635d;
	--am-color-border: #d8d0c3;
	--am-color-accent: #285746;
	--am-color-accent-dark: #17392e;
	--am-color-secondary: #95593f;
	--am-color-secondary-dark: #7c4631;
	--am-color-gold: #ad8549;
	--am-color-focus: #005fcc;
	--am-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	--am-font-serif: Georgia, Cambria, "Times New Roman", Times, serif;
	--am-space-page: 1rem;
	--am-content-width: 46rem;
	--am-wide-width: 74rem;
	--am-radius-small: 0.35rem;
	--am-radius: 0.85rem;
	--am-radius-large: 1.4rem;
	--am-shadow-soft: 0 1.25rem 3.5rem rgb(32 39 34 / 8%);
	--am-shadow-plate: 0 1.5rem 3rem rgb(23 57 46 / 12%);
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	background: var(--am-color-background);
	color: var(--am-color-text);
	font-family: var(--am-font-sans);
	font-size: 1rem;
	line-height: 1.7;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

body,
button,
input,
select,
textarea {
	font-family: var(--am-font-sans);
}

img,
svg,
video {
	display: block;
	max-width: 100%;
	height: auto;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin-block: 0;
	color: var(--am-color-text);
	font-family: var(--am-font-serif);
	font-weight: 700;
	line-height: 1.12;
	text-wrap: balance;
}

p,
ul,
ol {
	margin-block-start: 0;
}

a {
	color: var(--am-color-accent);
	text-decoration-thickness: 0.08em;
	text-underline-offset: 0.18em;
}

a:hover {
	text-decoration-thickness: 0.12em;
}

:focus-visible {
	outline: 3px solid var(--am-color-focus);
	outline-offset: 3px;
}

::selection {
	background: #d9e8df;
	color: var(--am-color-accent-dark);
}

/* ----- Accessibility helpers ------------------------------------------- */

.screen-reader-text,
.skip-link {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.skip-link:focus,
.skip-link:focus-visible {
	position: fixed;
	top: 1rem;
	left: 1rem;
	z-index: 1000;
	width: auto;
	height: auto;
	padding: 0.75rem 1rem;
	clip: auto;
	background: var(--am-color-surface);
	color: var(--am-color-text);
	border-radius: var(--am-radius-small);
	box-shadow: 0 0 0 3px var(--am-color-focus);
}

/* ----- Layout shell ---------------------------------------------------- */

.site-shell {
	width: min(100% - (var(--am-space-page) * 2), var(--am-wide-width));
	margin-inline: auto;
}

/* ----- Header ---------------------------------------------------------- */

/* AM-027 editorial header: warm gradient surface, gold hairline under the
   accent bar and a soft shadow that gently separates it from the page. */
.site-header {
	position: relative;
	z-index: 10;
	border-top: 3px solid var(--am-color-accent);
	border-bottom: 1px solid var(--am-color-border);
	background:
		radial-gradient(circle at 88% 0%, rgb(173 133 73 / 10%) 0, rgb(173 133 73 / 0%) 18rem),
		linear-gradient(150deg, var(--am-color-surface) 30%, #f6efe3 100%);
	box-shadow:
		inset 0 1px 0 rgb(173 133 73 / 45%),
		0 10px 28px rgb(32 39 34 / 5%);
}

.site-header__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.85rem;
	padding-block: 1.25rem;
}

.site-header__brand {
	display: flex;
	align-items: center;
	gap: 0.8rem;
}

/* Refined memorial seal: engraved double-ring monogram with a gold echo */
.site-monogram {
	display: grid;
	place-content: center;
	width: 2.85rem;
	height: 2.85rem;
	border-radius: 0.75rem;
	background: linear-gradient(155deg, var(--am-color-surface), var(--am-color-warm));
	box-shadow:
		inset 0 0 0 1px var(--am-color-accent),
		inset 0 0 0 4px var(--am-color-surface),
		inset 0 0 0 5px rgb(173 133 73 / 45%),
		0 2px 8px rgb(32 39 34 / 8%);
	color: var(--am-color-accent);
	font-family: var(--am-font-serif);
	font-size: 1.08rem;
	font-weight: 700;
	letter-spacing: 0.05em;
}

.site-brand-text {
	gap: 0.1rem;
}

.site-header .wp-block-site-title {
	margin: 0;
	font-family: var(--am-font-serif);
	font-size: 1.42rem;
	font-weight: 700;
	letter-spacing: -0.015em;
	line-height: 1.08;
}

.site-header .wp-block-site-title a {
	color: var(--am-color-text);
	text-decoration: none;
}

.site-brand__payoff {
	color: var(--am-color-secondary);
	font-size: 0.6rem;
	font-weight: 750;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}

.site-navigation {
	width: 100%;
}

/* Hand-authored primary menu (AM-016B5). The link styling below is shared with
   the desktop row and the mobile collapsed panel. */
/* AM-027: quieter, more editorial desktop menu - small caps with generous
   letterspacing; the mobile open panel restores normal case for readability. */
.nav-menu {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem 1.6rem;
	padding: 0;
	margin: 0;
	font-size: 0.8rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	list-style: none;
}

/* Mobile menu toggle (AM-016B5). Hidden by default so that, without JavaScript,
   the full menu stays visible and usable. The navigation.js progressive
   enhancement adds the `.nav-js` flag on <html>, which reveals the toggle and
   collapses the menu on small screens only. */
/* Icon-only square button (AM-016B5C): the visible "Menu" word is removed (kept
   as screen-reader text); only the hamburger/close glyph shows. Sized 2.75rem
   (>= 44px tap target) and shaped to mirror the "AM" monogram on the left. */
.nav-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border: 1px solid var(--am-color-border);
	border-radius: 0.65rem;
	background: var(--am-color-surface);
	color: var(--am-color-text);
	cursor: pointer;
}

.nav-toggle:hover {
	border-color: var(--am-color-accent);
	color: var(--am-color-accent);
}

/* Open state (AM-016B5B): clear but restrained - tinted, not loud. */
.nav-toggle[aria-expanded="true"] {
	border-color: var(--am-color-accent);
	background: var(--am-color-warm);
	color: var(--am-color-accent-dark);
}

.nav-toggle__bars,
.nav-toggle__bars::before,
.nav-toggle__bars::after {
	display: block;
	width: 1.2rem;
	height: 2px;
	background: currentcolor;
	transition: transform 0.2s ease, opacity 0.2s ease;
	content: "";
}

.nav-toggle__bars {
	position: relative;
}

.nav-toggle__bars::before {
	position: absolute;
	top: -0.4rem;
}

.nav-toggle__bars::after {
	position: absolute;
	top: 0.4rem;
}

/* Open state: morph the three bars into a close (X) icon. */
.nav-toggle[aria-expanded="true"] .nav-toggle__bars {
	background: transparent;
}

.nav-toggle[aria-expanded="true"] .nav-toggle__bars::before {
	top: 0;
	transform: rotate(45deg);
}

.nav-toggle[aria-expanded="true"] .nav-toggle__bars::after {
	top: 0;
	transform: rotate(-45deg);
}

@media (max-width: 47.999rem) {
	/* Mobile header composition (AM-016B5B): brand pinned left, toggle pushed to
	   the right margin. The brand is allowed to grow and shrink (`min-width: 0`)
	   so the wordmark never crowds the toggle - there is always clear space
	   between them, and on very narrow screens the title can wrap gracefully. */
	.site-header__brand {
		flex: 1 1 auto;
		min-width: 0;
	}

	.nav-js .nav-toggle {
		display: inline-flex;
		margin-left: auto;
	}

	.nav-js .site-navigation {
		flex-basis: 100%;
	}

	/* Collapsed by default once JS is active; expanded only when open. The panel
	   expands in normal flow (it pushes the page down) so it never overlaps the
	   hero and needs no scroll lock or focus trap. Styled as a soft surface card
	   rather than a bare list, with rounded rows and a clear active state. */
	.nav-js .site-navigation .nav-menu {
		display: none;
	}

	.nav-js .site-navigation.is-open .nav-menu {
		display: flex;
		flex-direction: column;
		gap: 0.15rem;
		margin-top: 0.85rem;
		padding: 0.5rem;
		border: 1px solid var(--am-color-border);
		border-radius: var(--am-radius);
		background: var(--am-color-surface);
		box-shadow: var(--am-shadow-soft);
	}

	.nav-js .site-navigation.is-open .nav-menu a {
		display: block;
		padding: 0.7rem 0.85rem;
		border-radius: var(--am-radius-small);
		color: var(--am-color-text);
		font-size: 1rem;
		letter-spacing: normal;
		text-transform: none;
	}

	.nav-js .site-navigation.is-open .nav-menu a::after {
		display: none;
	}

	.nav-js .site-navigation.is-open .nav-menu a:hover,
	.nav-js .site-navigation.is-open .nav-menu a:focus-visible {
		background: var(--am-color-surface-muted);
		color: var(--am-color-accent);
	}

	.nav-js .site-navigation.is-open .nav-menu a[aria-current] {
		background: var(--am-color-warm);
		box-shadow: inset 0.2rem 0 0 var(--am-color-gold);
		color: var(--am-color-accent-dark);
	}
}

.site-navigation a,
.menu a {
	position: relative;
	color: var(--am-color-muted);
	font-weight: 650;
	text-decoration: none;
}

.site-navigation a::after {
	position: absolute;
	right: 0;
	bottom: -0.4rem;
	left: 0;
	height: 2px;
	background: var(--am-color-accent);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.2s ease;
	content: "";
}

.site-navigation a:hover,
.site-navigation a:focus-visible {
	color: var(--am-color-accent);
}

.site-navigation a:hover::after,
.site-navigation a:focus-visible::after {
	transform: scaleX(1);
}

/* Active page (WordPress navigation adds aria-current) */
.site-navigation a[aria-current] {
	color: var(--am-color-accent-dark);
}

.site-navigation a[aria-current]::after {
	background: var(--am-color-gold);
	transform: scaleX(1);
}

.menu a:hover {
	color: var(--am-color-accent);
	text-decoration: underline;
	text-underline-offset: 0.3em;
}

/* ----- Generic single-entry pages ------------------------------------- */

.site-main {
	padding-block: 2rem;
}

.entry {
	max-width: var(--am-content-width);
	margin-inline: auto;
}

.entry__title,
.wp-block-post-title {
	font-family: var(--am-font-serif);
	line-height: 1.15;
}

/* ----- Home shared ----------------------------------------------------- */

.home-main {
	overflow: hidden;
}

.home-main:focus {
	outline: none;
}

.home-main section {
	scroll-margin-top: 2rem;
}

.home-eyebrow {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	margin-bottom: 0.85rem;
	color: var(--am-color-accent);
	font-size: 0.72rem;
	font-weight: 750;
	letter-spacing: 0.18em;
	line-height: 1.5;
	text-transform: uppercase;
}

.home-eyebrow__line {
	width: 1.8rem;
	height: 1px;
	background: currentcolor;
}

.home-eyebrow--light {
	color: #c6d9ce;
}

.home-section {
	padding-block: clamp(4rem, 9vw, 7rem);
}

.home-section h2 {
	font-size: clamp(2.25rem, 6vw, 4.2rem);
	letter-spacing: -0.035em;
}

.home-section__lead {
	color: var(--am-color-text);
	font-size: clamp(1.12rem, 2.4vw, 1.4rem);
	line-height: 1.55;
}

/* ----- Hero ------------------------------------------------------------ */

.home-hero {
	position: relative;
	background:
		radial-gradient(circle at 18% 10%, rgb(173 133 73 / 16%) 0, rgb(173 133 73 / 0%) 26rem),
		radial-gradient(circle at 4% 96%, rgb(40 87 70 / 9%) 0, rgb(40 87 70 / 0%) 24rem),
		linear-gradient(150deg, #faf7f1 0%, #f1ebe1 100%);
}

/* AM-023 definitive hero. ALL hero layout rules (base + media queries) live in
   this single section: the AM-022 "small card" regression happened because a
   base .home-hero__figure re-declared after the desktop media queries silently
   capped the photo at 24rem at every viewport. Keeping the component
   self-contained prevents that class of bug. Layout: editorial split, text on
   the left, photo filling the whole right column (square crop on desktop). */
.home-hero__grid {
	display: grid;
	width: min(100% - (var(--am-space-page) * 2), 90rem);
	gap: clamp(1.75rem, 5vw, 2.75rem);
	align-items: center;
	padding-block: clamp(2.25rem, 6vw, 3.75rem);
}

.home-hero__content-inner {
	max-width: 36rem;
}

.home-eyebrow--hero {
	color: var(--am-color-secondary);
}

.home-hero__title {
	display: flex;
	flex-direction: column;
	margin: 0;
	font-weight: 700;
	letter-spacing: -0.045em;
	line-height: 0.92;
}

.home-hero__title-first {
	font-size: clamp(2.5rem, 8vw, 4.8rem);
	color: var(--am-color-text);
}

.home-hero__title-last {
	font-size: clamp(2.5rem, 8vw, 4.8rem);
	color: var(--am-color-accent);
}

.home-hero__lead {
	max-width: 38rem;
	margin: 1.75rem 0 0;
	color: var(--am-color-accent-dark);
	font-family: var(--am-font-serif);
	font-size: clamp(1.3rem, 3vw, 1.8rem);
	line-height: 1.4;
	text-wrap: balance;
}

.home-hero__intro {
	max-width: 40rem;
	margin: 1.1rem 0 0;
	color: var(--am-color-muted);
	font-size: 1.05rem;
}

.home-actions {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0.75rem;
	margin-top: 2.1rem;
}

/* The photo: the real approved WebP portrait, served as an art-directed
   <picture> (LCP/SEO/a11y) with a tight 4/5 crop below 62rem and a tight
   square crop from 62rem up. The aspect-ratio always matches the asset being
   served, so object-fit: cover never amputates the open arms or the feet. */
.home-hero__visual {
	display: grid;
}

.home-hero__figure {
	position: relative;
	width: 100%;
	max-width: 30rem;
	margin: 0 auto;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	border: 1px solid var(--am-color-border);
	border-radius: var(--am-radius-large);
	background: var(--am-color-surface-muted);
	box-shadow: var(--am-shadow-soft);
}

.home-hero__picture {
	display: block;
	width: 100%;
	height: 100%;
}

.home-hero__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 50%;
}

@media (min-width: 62rem) {
	.home-hero__grid {
		grid-template-columns: minmax(0, 0.85fr) minmax(26rem, 1.15fr);
		gap: clamp(2rem, 4vw, 3.5rem);
		padding-block: clamp(3rem, 6vw, 4.5rem);
	}

	.home-hero__content-inner {
		max-width: 32rem;
	}

	/* Column-filling square photo: no width cap, no side margins. On a full
	   90rem shell the figure reaches ~49rem (~790px), twice the linear size of
	   the regressed 24rem card. */
	.home-hero__figure {
		max-width: none;
		margin: 0;
		aspect-ratio: 1 / 1;
		box-shadow: var(--am-shadow-plate);
	}
}

/* Discreet caption below the split (AM-016B4C): a plain muted line, shell
   aligned, that flags the provisional visual without re-creating a card. */
.home-hero__caption {
	padding-block: 1rem 1.5rem;
	color: var(--am-color-muted);
	font-size: 0.82rem;
	font-style: italic;
	line-height: 1.45;
}

/* Slim editorial strip moved out of the hero (AM-016B4C) so the hero stays
   uncluttered and scenic. Holds the "Un luogo costruito con cura" principles. */
.home-hero-aside {
	padding-block: clamp(1.4rem, 3vw, 2.1rem);
	background: var(--am-color-surface);
	border-block: 1px solid var(--am-color-border);
}

.home-hero-aside__inner {
	display: grid;
	gap: 0.85rem;
}

.home-hero-aside__title {
	margin: 0;
	color: var(--am-color-text);
	font-size: 1.05rem;
	font-weight: 700;
	letter-spacing: 0.01em;
}

.am-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 3rem;
	padding: 0.72rem 1.4rem;
	border: 2px solid transparent;
	border-radius: 999px;
	font-size: 0.95rem;
	font-weight: 750;
	line-height: 1.3;
	text-align: center;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.am-button:hover {
	text-decoration: none;
}

.am-button--primary {
	background: var(--am-color-accent);
	color: #fff;
}

.am-button--primary:hover {
	background: var(--am-color-accent-dark);
	color: #fff;
}

.am-button--ghost {
	border-color: rgb(40 87 70 / 35%);
	background: transparent;
	color: var(--am-color-accent-dark);
}

.am-button--ghost:hover {
	border-color: var(--am-color-accent);
	background: var(--am-color-surface);
	color: var(--am-color-accent-dark);
}

/* Hero aside principles list */

.home-principles {
	display: grid;
	gap: 0.6rem;
	padding: 0;
	margin: 0;
	color: var(--am-color-muted);
	list-style: none;
}

.home-principles li {
	display: grid;
	grid-template-columns: 0.7rem 1fr;
	gap: 0.7rem;
	align-items: baseline;
}

.home-principles li::before {
	width: 0.45rem;
	height: 0.45rem;
	border-radius: 50%;
	background: var(--am-color-gold);
	content: "";
}

.home-principles--inline {
	gap: 0.4rem 1.75rem;
}

/* ----- Project section ------------------------------------------------- */

.home-project {
	display: grid;
	gap: 2.25rem;
}

.home-lead-quote {
	margin: 1.4rem 0 0;
	color: var(--am-color-accent);
	font-family: var(--am-font-serif);
	font-size: clamp(1.3rem, 3.4vw, 1.9rem);
	font-style: italic;
	line-height: 1.35;
	text-wrap: balance;
}

.home-project__body > p:first-child {
	margin-bottom: 1rem;
}

.home-project__body > p:not(.home-section__lead) {
	max-width: 44rem;
	color: var(--am-color-muted);
}

.home-intentions {
	display: grid;
	gap: 0;
	margin: 2rem 0 0;
	list-style: none;
}

.home-intention {
	display: grid;
	gap: 0.2rem;
	padding: 1.15rem 0;
	border-top: 1px solid var(--am-color-border);
}

.home-intention:last-child {
	border-bottom: 1px solid var(--am-color-border);
}

.home-intention__word {
	position: relative;
	padding-left: 1.1rem;
	color: var(--am-color-accent-dark);
	font-family: var(--am-font-serif);
	font-size: 1.35rem;
	font-weight: 700;
}

.home-intention__word::before {
	position: absolute;
	left: 0;
	color: var(--am-color-gold);
	content: "—";
}

.home-intention__text {
	color: var(--am-color-muted);
	font-size: 0.98rem;
}

/* ----- Paths (dark editorial index) ------------------------------------ */

.home-section--paths {
	background:
		radial-gradient(circle at 90% 0%, rgb(173 133 73 / 14%) 0, rgb(173 133 73 / 0%) 30rem),
		var(--am-color-accent-dark);
	color: #eef3ef;
}

.home-section--paths h2,
.home-section--paths h3 {
	color: #fff;
}

.home-section__heading {
	display: grid;
	gap: 1.2rem;
	margin-bottom: 2.5rem;
}

.home-section__heading > p {
	max-width: 38rem;
	margin: 0;
	color: var(--am-color-muted);
	font-size: 1.02rem;
	line-height: 1.6;
}

/* The pale tint is legible only on the dark paths section. On light sections
   (e.g. the editorial areas block) the intro paragraph keeps the readable
   muted token above, which clears WCAG AA contrast on the cream background. */
.home-section--paths .home-section__heading > p {
	color: #d3ddd7;
}

/* AM-027: the four paths become photographic cards on the dark section. Each
   card pairs a real image from the archive with the numbered editorial body. */
.home-paths {
	display: grid;
	gap: 1.25rem;
	padding: 0;
	margin: 0;
	list-style: none;
}

.home-path {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid rgb(238 243 239 / 16%);
	border-radius: var(--am-radius);
	background: rgb(255 253 248 / 4%);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.home-path:hover,
.home-path:focus-within {
	border-color: rgb(255 217 160 / 45%);
	box-shadow: 0 1rem 2.5rem rgb(0 0 0 / 28%);
}

.home-path__media {
	position: relative;
	margin: 0;
	overflow: hidden;
	aspect-ratio: 16 / 10;
}

.home-path__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Soft dark scrim at the bottom of the photo, so the card body feels anchored. */
.home-path__media::after {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgb(23 57 46 / 0%) 55%, rgb(23 57 46 / 42%) 100%);
	content: "";
}

.home-path__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 1.1rem 1.25rem 1.3rem;
}

.home-path__index {
	margin-bottom: 0.45rem;
	font-family: var(--am-font-serif);
	font-size: 0.95rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	line-height: 1;
	color: var(--am-color-gold);
}

.home-path__body h3 {
	font-size: 1.3rem;
	letter-spacing: -0.02em;
}

.home-path__body h3 + p {
	margin: 0.55rem 0 1rem;
	color: #d3ddd7;
	font-size: 0.95rem;
	line-height: 1.55;
}

/* AM-028: Percorsi CTAs get the same evident pill treatment on the dark section. */
.home-path__body a {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	align-self: start;
	margin-top: auto;
	padding: 0.5rem 0.95rem;
	border: 1px solid rgb(255 217 160 / 42%);
	border-radius: 999px;
	color: #fff;
	font-size: 0.85rem;
	font-weight: 750;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.home-path__body a span {
	transition: transform 0.2s ease;
}

.home-path__body a:hover,
.home-path__body a:focus-visible {
	border-color: #ffd9a0;
	background: rgb(255 217 160 / 16%);
	color: #ffe9c9;
}

.home-path__body a:hover span,
.home-path__body a:focus-visible span {
	transform: translateX(0.2rem);
}

.home-path--feature {
	border-color: rgb(255 217 160 / 38%);
}

.home-path--feature .home-path__index {
	color: #ffd9a0;
}

.home-path--feature .home-path__body h3::after {
	display: inline-block;
	margin-left: 0.6rem;
	padding: 0.15rem 0.55rem;
	border: 1px solid rgb(255 217 160 / 55%);
	border-radius: 999px;
	color: #ffd9a0;
	font-family: var(--am-font-sans);
	font-size: 0.6rem;
	font-weight: 750;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	vertical-align: middle;
	content: "Centrale";
}

/* ----- Tournament (warm centerpiece) ----------------------------------- */

.home-section--tournament {
	position: relative;
	background:
		radial-gradient(circle at 12% 18%, rgb(173 133 73 / 18%) 0, rgb(173 133 73 / 0%) 24rem),
		linear-gradient(160deg, #f6ece1 0%, #efdfd1 100%);
	border-block: 1px solid var(--am-color-border);
}

.home-tournament {
	display: grid;
	gap: 2.25rem;
	align-items: center;
}

.home-tournament__media {
	margin: 0;
}

.home-tournament__content {
	max-width: 44rem;
}

.home-section--tournament .home-eyebrow {
	color: var(--am-color-secondary);
}

.home-tournament__content .home-section__lead {
	margin: 1.4rem 0 1rem;
}

.home-tournament__content > p:not(.home-eyebrow, .home-section__lead, .home-continuity) {
	color: var(--am-color-muted);
}

.home-editorial-list {
	display: grid;
	gap: 0.75rem;
	padding: 0;
	margin: 1.4rem 0 0;
	list-style: none;
}

.home-editorial-list li {
	display: grid;
	gap: 0.2rem;
	padding: 0.9rem 0;
	border-top: 1px solid rgb(149 89 63 / 22%);
}

.home-editorial-list li:last-child {
	border-bottom: 1px solid rgb(149 89 63 / 22%);
}

.home-editorial-list strong {
	color: var(--am-color-secondary-dark);
	font-family: var(--am-font-serif);
	font-size: 1.08rem;
	line-height: 1.25;
}

.home-editorial-list span {
	color: var(--am-color-muted);
	font-size: 0.95rem;
	line-height: 1.55;
}

.home-continuity {
	margin: 1.4rem 0 0;
	color: var(--am-color-secondary-dark);
	font-family: var(--am-font-serif);
	font-size: 1.05rem;
	font-style: italic;
}

.home-tournament__actions,
.home-materials-cta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 1.45rem;
}

/* ----- Split sections (memories / sources) ----------------------------- */

.home-split {
	display: grid;
	gap: 2rem;
}

.home-split__content {
	max-width: 42rem;
}

.home-split__content > p:not(.home-section__lead) {
	color: var(--am-color-muted);
}

.home-section--memories {
	background: var(--am-color-surface);
	border-bottom: 1px solid var(--am-color-border);
}

/* ----- Editorial areas grid (AM-016B6) --------------------------------- */
/* Distinct cards that orient the visitor toward the real inner pages
   (Documentazione / Cronologia / Aggiornamenti documentali), keeping the
   three areas clearly separated. Reuses the section heading layout above. */

.home-section--areas {
	background: var(--am-color-background);
}

.home-areas {
	display: grid;
	gap: 1rem;
	padding: 0;
	margin: 0;
	list-style: none;
}

.home-area {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 1.6rem 1.5rem;
	border: 1px solid var(--am-color-border);
	border-radius: var(--am-radius);
	background: var(--am-color-surface);
	box-shadow: var(--am-shadow-soft);
	transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.home-area:hover,
.home-area:focus-within {
	border-color: rgb(40 87 70 / 35%);
	box-shadow: var(--am-shadow-plate);
}

.home-area__kicker {
	margin: 0;
	color: var(--am-color-secondary);
	font-size: 0.66rem;
	font-weight: 750;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.home-area h3 {
	margin: 0;
	font-size: 1.3rem;
	letter-spacing: -0.01em;
}

.home-area p {
	margin: 0;
	color: var(--am-color-muted);
	font-size: 0.96rem;
	line-height: 1.55;
}

/* AM-028: the editorial areas block is now descriptive cards + one shared CTA
   button (the three documentation facets link to the single consolidated page). */
.home-areas__cta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 2rem;
}

/* ----- Footer ---------------------------------------------------------- */

/* AM-027: gold keyline on top of the dark footer, mirroring the header. */
.site-footer {
	border-top: 3px solid var(--am-color-gold);
	background:
		radial-gradient(circle at 88% 0%, rgb(173 133 73 / 14%) 0, rgb(173 133 73 / 0%) 24rem),
		var(--am-color-accent-dark);
	color: #c6d0ca;
	box-shadow: inset 0 1px 0 rgb(255 253 248 / 12%);
}

.site-footer__inner {
	display: grid;
	gap: 2.25rem;
	padding-block: 3.25rem;
}

.site-footer__top {
	display: grid;
	gap: 1.25rem;
}

.site-footer__brand {
	display: flex;
	align-items: center;
	gap: 0.8rem;
	color: inherit;
	text-decoration: none;
}

.site-footer__monogram {
	display: grid;
	place-content: center;
	width: 2.6rem;
	height: 2.6rem;
	border-radius: 0.65rem;
	background: linear-gradient(155deg, rgb(255 253 248 / 6%), rgb(173 133 73 / 12%));
	box-shadow:
		inset 0 0 0 1px rgb(173 133 73 / 60%),
		inset 0 0 0 4px var(--am-color-accent-dark),
		inset 0 0 0 5px rgb(173 133 73 / 30%);
	color: #ffd9a0;
	font-family: var(--am-font-serif);
	font-size: 1.02rem;
	font-weight: 700;
	letter-spacing: 0.05em;
}

.site-footer__brandtext {
	display: flex;
	flex-direction: column;
	gap: 0.12rem;
}

.site-footer__name {
	color: #fff;
	font-family: var(--am-font-serif);
	font-size: 1.32rem;
	font-weight: 700;
	line-height: 1.08;
}

.site-footer__payoff {
	color: #ffd9a0;
	font-size: 0.6rem;
	font-weight: 750;
	letter-spacing: 0.22em;
	text-transform: uppercase;
}

.site-footer__mission {
	max-width: 44rem;
	margin: 0;
	color: #e3e9e4;
	font-family: var(--am-font-serif);
	font-size: 1.12rem;
	font-style: italic;
	line-height: 1.55;
}

.site-footer__bottom {
	display: grid;
	gap: 0.5rem;
	padding-top: 1.5rem;
	border-top: 1px solid rgb(255 255 255 / 15%);
}

.site-footer__note {
	max-width: 44rem;
	margin: 0;
	color: #d5ddd8;
	font-size: 0.92rem;
}

.site-footer__legal {
	margin: 0;
	color: #aebbb3;
	font-size: 0.78rem;
	letter-spacing: 0.04em;
}

/* AM-024: sober, non-commercial credit line. The link is plain text on the
   maker's name, styled to sit quietly with the rest of the footer. */
.site-footer__credit {
	margin: 0;
	color: #aebbb3;
	font-size: 0.85rem;
}

.site-footer__credit a {
	color: #e3e9e4;
	text-decoration: underline;
	text-decoration-color: rgb(255 217 160 / 55%);
	text-underline-offset: 0.22em;
}

.site-footer__credit a:hover {
	color: #ffd9a0;
}

/* ----- Responsive ------------------------------------------------------ */

@media (min-width: 36rem) {
	.home-actions {
		flex-direction: row;
		align-items: center;
	}

	.home-intentions {
		grid-template-columns: repeat(3, 1fr);
		gap: 0;
		border-top: 1px solid var(--am-color-border);
	}

	.home-intention {
		padding: 1.25rem 1.25rem 1.35rem 0;
		border-top: 0;
	}

	.home-intention:last-child {
		border-bottom: 0;
	}

	.home-paths {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.5rem;
	}
}

@media (min-width: 48rem) {
	:root {
		--am-space-page: 1.5rem;
	}

	.home-hero-aside__inner {
		grid-template-columns: auto 1fr;
		gap: 1rem 2.5rem;
		align-items: center;
	}

	.home-principles--inline {
		grid-auto-flow: column;
		grid-template-columns: none;
		justify-content: start;
	}

	.site-header__inner {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		gap: 1.5rem;
	}

	.site-navigation {
		width: auto;
	}

	.site-main {
		padding-block: 3rem;
	}

	.home-section__heading {
		grid-template-columns: minmax(0, 1.1fr) minmax(18rem, 0.9fr);
		align-items: end;
	}

	.home-project {
		grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
		gap: clamp(2.5rem, 6vw, 5rem);
		align-items: start;
	}

	.home-tournament {
		grid-template-columns: minmax(13rem, 0.6fr) minmax(0, 1.4fr);
		gap: clamp(2.5rem, 7vw, 6rem);
	}

	.home-split {
		grid-template-columns: minmax(15rem, 0.8fr) minmax(0, 1.2fr);
		gap: clamp(3rem, 8vw, 7rem);
		align-items: start;
	}

	.home-areas {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 1.25rem;
	}

	.site-footer__inner {
		grid-template-columns: minmax(0, 1fr);
	}

	.site-footer__top {
		grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
		gap: clamp(2rem, 5vw, 4rem);
		align-items: center;
	}

	.site-footer__bottom {
		display: flex;
		flex-wrap: wrap;
		gap: 0.5rem 2rem;
		align-items: baseline;
		justify-content: space-between;
	}
}

@media (min-width: 62rem) {
	.home-paths {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 1.25rem;
	}
}

/* ----- Full-bleed atmospheric band -------------------------------------- */
/* Self-authored decorative SVG background (local, no remote assets) behind a
   real quote from the community's own words. */

.home-band {
	position: relative;
	display: grid;
	place-items: center;
	min-height: clamp(13rem, 28vw, 20rem);
	padding: 2.5rem var(--am-space-page);
	background: var(--am-color-accent-dark) url("../images/placeholder-band.svg") center / cover no-repeat;
	text-align: center;
}

.home-band__quote {
	max-width: 42rem;
	margin: 0;
}

.home-band__quote p {
	margin: 0;
	color: #f4ece0;
	font-family: var(--am-font-serif);
	font-size: clamp(1.3rem, 3.2vw, 2rem);
	font-style: italic;
	line-height: 1.4;
	text-wrap: balance;
}

.home-band__quote cite {
	display: block;
	margin-top: 0.9rem;
	color: #ffd9a0;
	font-size: 0.78rem;
	font-style: normal;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

/* Memories split media */

.home-split__media {
	margin: 0;
}

@media (min-width: 48rem) {
	.home-section--tournament .home-tournament {
		grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
		align-items: center;
	}

	.home-split--media {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
		align-items: center;
	}
}

/* ----- AM-016B1 singular pages & posts (multipage preparation) --------- */
/* Generic templates page.html / single.html render approved WordPress pages
   and posts (e.g. future Aggiornamenti) with the same header/footer, skip
   target and editorial typography. They expose no hardcoded navigation and
   create no links, so they add zero 404 risk and only take effect when real
   content exists. Content width follows theme.json contentSize (720px). */

.singular-main {
	padding-block: clamp(2.5rem, 6vw, 4.5rem);
}

.singular-entry {
	margin-inline: auto;
}

/* Editorial header: a short gold keyline sits above the title so inner pages
   read as part of one system, echoing the header/footer identity. A hairline
   rule separates the heading from the body. */
.singular-entry__header {
	margin-bottom: clamp(1.75rem, 4vw, 2.5rem);
	padding-bottom: 1.5rem;
	border-bottom: 1px solid var(--am-color-border);
}

.singular-entry__header::before {
	display: block;
	width: 2.75rem;
	height: 3px;
	margin-bottom: 1.1rem;
	background: var(--am-color-gold);
	content: "";
}

.singular-entry .wp-block-post-title,
.singular-entry .entry__title {
	margin: 0;
	font-size: clamp(2.1rem, 5vw, 3.1rem);
	letter-spacing: -0.02em;
	line-height: 1.12;
}

.singular-entry__date {
	display: block;
	margin-bottom: 0.7rem;
	color: var(--am-color-muted);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.singular-entry .wp-block-post-content > * {
	margin-block: 0 1.15rem;
}

.singular-entry .wp-block-post-content > :last-child {
	margin-bottom: 0;
}

/* Confident lead-in: the opening paragraph reads slightly larger. */
.singular-entry .wp-block-post-content > p:first-of-type {
	color: var(--am-color-text);
	font-size: 1.15rem;
	line-height: 1.6;
}

/* Structured editorial blocks for future articles / documentary content. */
.singular-entry .wp-block-post-content :is(h2, h3, h4) {
	margin-top: 2.25rem;
	line-height: 1.2;
}

.singular-entry .wp-block-post-content h2 {
	font-size: clamp(1.5rem, 3.5vw, 1.95rem);
	letter-spacing: -0.015em;
}

.singular-entry .wp-block-post-content h3 {
	font-size: 1.3rem;
}

.singular-entry .wp-block-post-content a {
	color: var(--am-color-accent);
	text-decoration: underline;
	text-underline-offset: 0.18em;
}

.singular-entry .wp-block-post-content a:hover {
	color: var(--am-color-accent-dark);
}

.singular-entry .wp-block-post-content :is(ul, ol) {
	padding-left: 1.4rem;
}

.singular-entry .wp-block-post-content li {
	margin-bottom: 0.4rem;
}

.singular-entry .wp-block-post-content blockquote {
	margin-inline: 0;
	padding: 0.4rem 0 0.4rem 1.4rem;
	border-left: 4px solid var(--am-color-gold);
	color: var(--am-color-accent-dark);
	font-family: var(--am-font-serif);
	font-style: italic;
}

/* ----- AM-016B2B footer multipage navigation --------------------------- */
/* Conservative footer site-map (no full visual redesign yet - that is
   AM-016B3). Columns of real multipage links on the dark footer, readable
   and accessible. Real pages already exist in staging. */

.site-footer__nav {
	display: grid;
	gap: 1.6rem 2.5rem;
	padding-top: 1.9rem;
	border-top: 1px solid rgb(255 255 255 / 12%);
}

.site-footer__heading {
	margin: 0 0 0.75rem;
	color: #ffd9a0;
	font-family: var(--am-font-sans);
	font-size: 0.72rem;
	font-weight: 750;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

/* Short gold keyline under each footer column heading (AM-027). */
.site-footer__heading::after {
	display: block;
	width: 1.75rem;
	height: 2px;
	margin-top: 0.5rem;
	background: rgb(173 133 73 / 65%);
	content: "";
}

.site-footer__nav ul {
	display: grid;
	gap: 0.45rem;
	padding: 0;
	margin: 0;
	list-style: none;
}

.site-footer__nav a {
	color: #d5ddd8;
	font-size: 0.92rem;
	text-decoration: none;
}

.site-footer__nav a:hover {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 0.25em;
}

.site-footer__social {
	display: grid;
	gap: 1rem;
	padding-top: 1.6rem;
	border-top: 1px solid rgb(255 255 255 / 12%);
}

.site-footer__social-copy {
	display: grid;
	gap: 0.45rem;
	max-width: 42rem;
}

.site-footer__social-copy p,
.site-footer__social-note {
	margin: 0;
	color: #c6d0ca;
	font-size: 0.9rem;
	line-height: 1.55;
}

.site-footer__social-links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.site-footer__social-link {
	display: inline-flex;
	align-items: center;
	gap: 0.75rem;
	min-height: 3.25rem;
	padding: 0.7rem 0.85rem;
	border: 1px solid rgb(255 255 255 / 14%);
	border-radius: var(--am-radius-small);
	background: rgb(255 253 248 / 5%);
	color: #fff;
	text-decoration: none;
	transition:
		background-color 160ms ease,
		border-color 160ms ease,
		transform 160ms ease;
}

.site-footer__social-link:hover {
	border-color: rgb(255 217 160 / 54%);
	background: rgb(255 253 248 / 9%);
	color: #fff;
	text-decoration: none;
	transform: translateY(-1px);
}

.site-footer__social-icon {
	display: grid;
	flex: 0 0 auto;
	place-items: center;
	width: 2.15rem;
	height: 2.15rem;
	border-radius: 0.5rem;
	background: rgb(255 255 255 / 10%);
	color: #fff;
	font-size: 1.2rem;
	font-weight: 800;
	line-height: 1;
}

.site-footer__social-icon svg {
	width: 1.25rem;
	height: 1.25rem;
	fill: currentcolor;
}

.site-footer__social-icon--youtube {
	background: #b8322a;
}

.site-footer__social-icon--facebook {
	background: #2e5d9f;
	font-family: Arial, sans-serif;
}

.site-footer__social-link strong,
.site-footer__social-link span span {
	display: block;
}

.site-footer__social-link strong {
	font-size: 0.9rem;
	line-height: 1.2;
}

.site-footer__social-link span span {
	color: #c6d0ca;
	font-size: 0.78rem;
	line-height: 1.3;
}

.site-footer__social-note {
	max-width: 48rem;
	color: #aebbb3;
}

.site-footer__social-note a {
	color: #e3e9e4;
	text-decoration: underline;
	text-decoration-color: rgb(255 217 160 / 55%);
	text-underline-offset: 0.22em;
}

@media (min-width: 36rem) {
	.site-footer__nav {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* ----- AM-019 editorial inner pages ------------------------------------ */
/* Reusable, library-free components used by the slug-specific page templates
   (templates/page-*.html) to turn placeholder pages into real editorial pages:
   internal hero, prose sections, method/privacy/construction notes, CTA row,
   simple card grid and a placeholder timeline. All content is authored in the
   templates as semantic HTML (no DB), heading order is enforced (single H1). */

.page-main {
	overflow: hidden;
}

.page-main:focus {
	outline: none;
}

.page-hero {
	padding-block: clamp(2.5rem, 6vw, 4.25rem);
	background:
		radial-gradient(circle at 12% 8%, rgb(173 133 73 / 12%) 0, rgb(173 133 73 / 0%) 22rem),
		linear-gradient(150deg, #faf7f1 0%, #f1ebe1 100%);
	border-bottom: 1px solid var(--am-color-border);
}

.page-hero > .site-shell {
	width: min(100% - (var(--am-space-page) * 2), 58rem);
}

.page-hero--narrative > .site-shell {
	position: relative;
	padding: clamp(1.25rem, 3vw, 2rem) 0;
}

.page-hero--narrative > .site-shell::before {
	display: block;
	width: 3.25rem;
	height: 3px;
	margin-bottom: 1rem;
	background: var(--am-color-gold);
	content: "";
}

.page-hero--documentary {
	background:
		radial-gradient(circle at 12% 8%, rgb(40 87 70 / 9%) 0, rgb(40 87 70 / 0%) 20rem),
		linear-gradient(150deg, #fbf8f2 0%, #f2ede4 100%);
}

.page-hero--documentary > .site-shell {
	width: min(100% - (var(--am-space-page) * 2), 52rem);
	padding: clamp(1.25rem, 3vw, 1.8rem) 0;
}

.page-hero--documentary > .site-shell::before {
	display: block;
	width: 2.75rem;
	height: 3px;
	margin-bottom: 1rem;
	background: var(--am-color-accent);
	content: "";
}

.page-hero--tournament > .site-shell {
	width: min(100% - (var(--am-space-page) * 2), 68rem);
}

/* In the tournament split the shell is a grid: the narrative ::before keyline
   would otherwise become an anonymous grid item and push the copy into the
   wrong column (media dropping to a second row). Draw it on the copy column. */
.page-hero--tournament > .site-shell::before {
	content: none;
}

.page-hero--tournament .page-hero__copy::before {
	display: block;
	width: 3.25rem;
	height: 3px;
	margin-bottom: 1rem;
	background: var(--am-color-gold);
	content: "";
}

.page-hero__split {
	display: grid;
	gap: clamp(1.5rem, 4vw, 2.5rem);
	align-items: center;
}

.page-hero__copy {
	min-width: 0;
}

.page-hero__title {
	margin: 0;
	font-size: clamp(2.1rem, 5.5vw, 3.4rem);
	letter-spacing: -0.03em;
	line-height: 1.08;
}

.page-hero__lead {
	max-width: 44rem;
	margin: 1.2rem 0 0;
	color: var(--am-color-accent-dark);
	font-family: var(--am-font-serif);
	font-size: clamp(1.2rem, 2.6vw, 1.6rem);
	line-height: 1.4;
	text-wrap: balance;
}

/* Optional supporting paragraph under the hero lead (why the page exists). */
.page-hero__text {
	max-width: 40rem;
	margin: 1rem 0 0;
	color: var(--am-color-muted);
	font-size: 1.02rem;
	line-height: 1.65;
}

.page-body {
	padding-block: clamp(2.5rem, 6vw, 4rem);
}

.page-prose {
	max-width: 46rem;
}

.page-prose--wide {
	max-width: 64rem;
}

/* AM-028: keep reading blocks aligned with the text column on wide-prose pages
   (the "In breve" panel used to stretch wider than its heading); true media —
   galleries, roster and card grids — still span the full width below. */
.page-prose--wide .page-section > :is(h2, p, .page-lead, .page-note, .page-cta, .page-brief, .documentation-criteria, .documentation-review-list, .page-timeline) {
	max-width: 46rem;
}

.page-section + .page-section {
	margin-top: clamp(2.25rem, 5vw, 3.25rem);
}

.page-section h2 {
	margin: 0 0 0.9rem;
	font-size: clamp(1.55rem, 3.5vw, 2.15rem);
	letter-spacing: -0.02em;
}

.page-section h3 {
	margin: 1.6rem 0 0.5rem;
	font-size: 1.25rem;
}

.page-section p {
	margin: 0 0 1.1rem;
}

.page-section :is(ul, ol) {
	margin: 0 0 1.1rem;
	padding-left: 1.4rem;
}

.page-section li {
	margin-bottom: 0.4rem;
}

.page-section p:last-child,
.page-section :is(ul, ol):last-child {
	margin-bottom: 0;
}

.page-lead {
	color: var(--am-color-text);
	font-size: 1.12rem;
	line-height: 1.6;
}

.tournament-hero-facts {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
	margin-top: 1.35rem;
}

.tournament-hero-facts span {
	display: inline-flex;
	align-items: center;
	min-height: 2rem;
	padding: 0.35rem 0.7rem;
	border: 1px solid rgb(149 89 63 / 24%);
	border-radius: 999px;
	background: rgb(255 253 248 / 68%);
	color: var(--am-color-secondary-dark);
	font-size: 0.72rem;
	font-weight: 750;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.tournament-hero-media {
	margin: 0;
}

.tournament-hero-media figcaption {
	margin-top: 0.7rem;
	color: var(--am-color-muted);
	font-size: 0.82rem;
	font-style: italic;
	line-height: 1.45;
}

/* Note boxes: method (gold), privacy/consent (accent), construction (warm). */
.page-note {
	padding: 1.15rem 1.3rem;
	margin: 1.5rem 0;
	border-left: 4px solid var(--am-color-gold);
	border-radius: 0 var(--am-radius-small) var(--am-radius-small) 0;
	background: var(--am-color-surface-muted);
}

.page-note > :first-child {
	margin-top: 0;
}

.page-note > :last-child {
	margin-bottom: 0;
}

.page-note__label {
	display: block;
	margin-bottom: 0.35rem;
	color: var(--am-color-secondary);
	font-size: 0.7rem;
	font-weight: 750;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.page-note--privacy {
	border-left-color: var(--am-color-accent);
}

.page-note--construction {
	border-left-color: var(--am-color-secondary);
	background: var(--am-color-warm);
}

.page-cta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 1.6rem;
}

.page-cards {
	display: grid;
	gap: 1rem;
	margin: 1.5rem 0 0;
	padding: 0;
	list-style: none;
}

.page-card {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 1.4rem;
	border: 1px solid var(--am-color-border);
	border-radius: var(--am-radius);
	background: var(--am-color-surface);
}

.page-card h3 {
	margin: 0;
	font-size: 1.15rem;
}

.page-card p {
	margin: 0;
	color: var(--am-color-muted);
	font-size: 0.96rem;
}

.page-cards--compact .page-card {
	gap: 0.4rem;
}

/* Optional quiet link at the bottom of a page card (AM-025). */
.page-card__link {
	margin-top: auto;
	padding-top: 0.5rem;
	color: var(--am-color-accent);
	font-size: 0.9rem;
	font-weight: 750;
	text-decoration: none;
}

.page-card__link:hover,
.page-card__link:focus-visible {
	color: var(--am-color-accent-dark);
	text-decoration: underline;
	text-underline-offset: 0.25em;
}

.documentation-criteria,
.documentation-review-list {
	display: grid;
	gap: 0.75rem;
	padding: 0;
	margin: 1.4rem 0 0;
	list-style: none;
}

.documentation-criteria li {
	display: grid;
	gap: 0.3rem;
	padding: 1rem 0;
	border-top: 1px solid var(--am-color-border);
}

.documentation-criteria li:last-child {
	border-bottom: 1px solid var(--am-color-border);
}

.documentation-criteria strong {
	color: var(--am-color-accent-dark);
	font-family: var(--am-font-serif);
	font-size: 1.12rem;
}

.documentation-criteria span,
.documentation-review-list li {
	color: var(--am-color-muted);
	font-size: 0.96rem;
	line-height: 1.55;
}

.documentation-review-list li {
	position: relative;
	padding-left: 1.15rem;
}

.documentation-review-list li::before {
	position: absolute;
	top: 0.65rem;
	left: 0;
	width: 0.45rem;
	height: 0.45rem;
	border-radius: 50%;
	background: var(--am-color-gold);
	content: "";
}

/* Timeline used by the consolidated documentation & chronology page. */
.page-timeline {
	margin: 1.5rem 0 0;
	padding: 0;
	list-style: none;
}

.page-timeline li {
	position: relative;
	padding: 0 0 1.25rem 1.6rem;
	border-left: 2px solid var(--am-color-border);
}

.page-timeline li::before {
	position: absolute;
	top: 0.15rem;
	left: -0.42rem;
	width: 0.65rem;
	height: 0.65rem;
	border-radius: 50%;
	background: var(--am-color-gold);
	content: "";
}

.page-timeline li:last-child {
	padding-bottom: 0;
	border-left-color: transparent;
}

.page-timeline__date {
	display: block;
	color: var(--am-color-accent-dark);
	font-weight: 700;
}

.tournament-next {
	display: grid;
	gap: 1.2rem;
	padding: 1.4rem;
	border: 1px solid rgb(149 89 63 / 24%);
	border-left: 4px solid var(--am-color-secondary);
	border-radius: var(--am-radius-small);
	background: var(--am-color-warm);
}

.tournament-next__label {
	margin: 0 0 0.5rem;
	color: var(--am-color-secondary);
	font-size: 0.66rem;
	font-weight: 750;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.tournament-next__status {
	display: grid;
	gap: 0.2rem;
	align-content: start;
	padding: 1rem;
	border: 1px solid rgb(149 89 63 / 22%);
	border-radius: var(--am-radius-small);
	background: rgb(255 253 248 / 62%);
}

.tournament-next__status span {
	color: var(--am-color-muted);
	font-size: 0.72rem;
	font-weight: 750;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.tournament-next__status strong {
	color: var(--am-color-secondary-dark);
	font-family: var(--am-font-serif);
	font-size: 1.15rem;
	line-height: 1.25;
}

.tournament-years {
	display: grid;
	gap: 1rem;
	padding: 0;
	margin: 1.5rem 0 0;
	list-style: none;
}

.tournament-archive-tools {
	display: inline-flex;
	gap: 0.2rem;
	margin-top: 0.9rem;
	padding: 0.22rem;
	border: 1px solid var(--am-color-border);
	border-radius: 999px;
	background: var(--am-color-surface-muted);
}

.tournament-archive-tools__button {
	min-height: 2.25rem;
	padding: 0.35rem 0.85rem;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--am-color-muted);
	font: inherit;
	font-size: 0.86rem;
	font-weight: 750;
	cursor: pointer;
}

.tournament-archive-tools__button:hover,
.tournament-archive-tools__button:focus-visible {
	color: var(--am-color-accent-dark);
}

.tournament-archive-tools__button.is-active {
	background: var(--am-color-accent);
	color: #fff;
	box-shadow: 0 0.35rem 0.9rem rgb(40 87 70 / 18%);
}

.tournament-year-card {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding: 1.25rem;
	border: 1px solid var(--am-color-border);
	border-radius: var(--am-radius-small);
	background: var(--am-color-surface);
	box-shadow: var(--am-shadow-soft);
}

.tournament-year-card {
	position: relative;
	overflow: hidden;
}

.tournament-year-card::before {
	display: block;
	width: 2rem;
	height: 3px;
	background: var(--am-color-gold);
	content: "";
}

.tournament-year-card--current {
	border-color: rgb(149 89 63 / 38%);
	background: linear-gradient(150deg, var(--am-color-surface), var(--am-color-warm));
}

.tournament-year-card__header {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
	align-items: center;
	justify-content: space-between;
}

.tournament-year-card h3 {
	margin: 0;
	font-size: 1.35rem;
	letter-spacing: -0.01em;
}

.tournament-status {
	display: inline-flex;
	align-items: center;
	min-height: 1.8rem;
	padding: 0.25rem 0.55rem;
	border: 1px solid var(--am-color-border);
	border-radius: 999px;
	background: var(--am-color-surface-muted);
	color: var(--am-color-muted);
	font-size: 0.68rem;
	font-weight: 750;
	letter-spacing: 0.08em;
	line-height: 1.2;
	text-transform: uppercase;
}

.tournament-status--available {
	border-color: rgb(40 87 70 / 24%);
	background: rgb(217 232 223 / 70%);
	color: var(--am-color-accent-dark);
}

.tournament-status--current {
	border-color: rgb(149 89 63 / 30%);
	background: rgb(244 231 218 / 88%);
	color: var(--am-color-secondary-dark);
}

.tournament-fields {
	display: grid;
	gap: 0.65rem;
	margin: 0;
}

.tournament-fields div {
	display: grid;
	gap: 0.15rem;
	padding-top: 0.65rem;
	border-top: 1px solid var(--am-color-border);
}

.tournament-fields dt {
	color: var(--am-color-accent-dark);
	font-size: 0.72rem;
	font-weight: 750;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.tournament-fields dd {
	margin: 0;
	color: var(--am-color-muted);
	font-size: 0.94rem;
	line-height: 1.45;
}

.tournament-hall {
	display: grid;
	gap: 1rem;
	margin-top: 1.5rem;
}

.tournament-hall > div {
	padding: 1.15rem;
	border: 1px solid var(--am-color-border);
	border-radius: var(--am-radius-small);
	background: var(--am-color-surface);
}

.tournament-hall span {
	display: block;
	margin-bottom: 0.35rem;
	color: var(--am-color-secondary);
	font-size: 0.7rem;
	font-weight: 750;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.tournament-hall p {
	color: var(--am-color-muted);
}

@media (min-width: 48rem) {
	.page-hero__split {
		grid-template-columns: minmax(0, 0.95fr) minmax(18rem, 1.05fr);
	}

	.page-cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.25rem;
	}

	.tournament-next {
		grid-template-columns: minmax(0, 1fr) minmax(13rem, 0.36fr);
		align-items: start;
	}

	.tournament-years {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.25rem;
	}

	.tournament-hall {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (min-width: 64rem) {
	.tournament-years {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.page-cards--compact {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.page-cards--trio {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* ----- Photographic components (AM-024/AM-027) --------------------------- */
/* Reusable frame for real photos served as <img> (better alt/SEO than CSS
   backgrounds). All assets are local WebP derived from the project Drive
   archive and from the family albums; originals never enter the repository
   and every image is chosen together with the family and friends. */

.media-frame {
	position: relative;
	overflow: hidden;
	border: 1px solid var(--am-color-border);
	border-radius: var(--am-radius-large);
	background: var(--am-color-surface-muted);
	box-shadow: var(--am-shadow-soft);
}

.media-frame > img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.media-frame--wide {
	aspect-ratio: 16 / 10;
}

.media-frame--landscape {
	aspect-ratio: 4 / 3;
}

.media-frame--portrait {
	aspect-ratio: 3 / 4;
}

.media-caption {
	margin: 0.7rem 0 0;
	color: var(--am-color-muted);
	font-size: 0.82rem;
	font-style: italic;
	line-height: 1.45;
}

/* Tournament photo galleries: hub selection (3 columns) and edition-page
   gallery (2 wider columns, more photographic). Figures share caption rules. */
.tournament-gallery,
.edition-gallery {
	display: grid;
	gap: 1.25rem;
	margin: 1.5rem 0 0;
}

.edition-gallery {
	gap: 1.5rem;
}

.tournament-gallery figure,
.edition-gallery figure {
	margin: 0;
}

.tournament-gallery figcaption,
.edition-gallery figcaption {
	margin-top: 0.6rem;
	color: var(--am-color-muted);
	font-size: 0.85rem;
	line-height: 1.5;
}

.tournament-gallery figcaption strong,
.edition-gallery figcaption strong {
	display: block;
	color: var(--am-color-text);
	font-family: var(--am-font-serif);
	font-size: 1.02rem;
}

/* A single-photo edition gallery stays contained instead of stretching. */
.edition-gallery--single {
	max-width: 34rem;
}

@media (min-width: 48rem) {
	.tournament-gallery {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.edition-gallery {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.edition-gallery--single {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Sober closing strip at the end of the homepage. */
.home-closing {
	padding-block: clamp(2.5rem, 5vw, 3.75rem);
	border-top: 1px solid var(--am-color-border);
	background: var(--am-color-surface);
	text-align: center;
}

.home-closing__inner {
	display: grid;
	gap: 1.1rem;
	justify-items: center;
}

.home-closing h2 {
	margin: 0;
	font-size: clamp(1.5rem, 3.2vw, 2rem);
	letter-spacing: -0.015em;
}

.home-closing p {
	max-width: 44rem;
	margin: 0;
	color: var(--am-color-muted);
}

.home-closing__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: center;
}

/* ----- AM-025 "In breve" panel ------------------------------------------ */
/* Compact, crawlable summary used on the homepage and inner pages: a labeled
   panel with term/description pairs. One component for every "In breve". */

.page-brief {
	padding: 1.4rem 1.5rem;
	margin: 1.5rem 0 0;
	border: 1px solid var(--am-color-border);
	border-top: 3px solid var(--am-color-gold);
	border-radius: var(--am-radius-small);
	background: var(--am-color-surface);
	box-shadow: var(--am-shadow-soft);
}

.page-brief__label {
	display: block;
	margin-bottom: 0.9rem;
	color: var(--am-color-secondary);
	font-size: 0.7rem;
	font-weight: 750;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.page-brief dl {
	display: grid;
	gap: 0.85rem;
	margin: 0;
}

.page-brief dt {
	color: var(--am-color-accent-dark);
	font-size: 0.72rem;
	font-weight: 750;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.page-brief dd {
	margin: 0.15rem 0 0;
	color: var(--am-color-muted);
	font-size: 0.95rem;
	line-height: 1.55;
}

@media (min-width: 48rem) {
	.page-brief dl {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1rem 2rem;
	}
}

@media (min-width: 64rem) {
	.page-brief--columns dl {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* ----- AM-025 tournament edition pages ---------------------------------- */
/* Per-year pages (page-torneo-del-15-luglio-YYYY.html). The hero reuses
   .page-hero--narrative/--tournament; below are only the edition-specific
   pieces: breadcrumb, inter-edition navigation and hub year-card links. */

.edition-breadcrumb {
	margin-bottom: 1.1rem;
	font-size: 0.85rem;
}

.edition-breadcrumb ol {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 0.6rem;
	padding: 0;
	margin: 0;
	list-style: none;
}

.edition-breadcrumb li {
	display: flex;
	gap: 0.6rem;
	align-items: baseline;
	color: var(--am-color-muted);
}

.edition-breadcrumb li + li::before {
	color: var(--am-color-gold);
	content: "\203A";
}

.edition-breadcrumb a {
	color: var(--am-color-accent);
	font-weight: 650;
	text-decoration: none;
}

.edition-breadcrumb a:hover,
.edition-breadcrumb a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

/* Prev/next/archive navigation at the end of each edition page. */
.edition-nav {
	display: grid;
	gap: 0.75rem;
	padding-top: 1.75rem;
	margin-top: clamp(2.25rem, 5vw, 3.25rem);
	border-top: 1px solid var(--am-color-border);
}

.edition-nav__item {
	display: grid;
	gap: 0.15rem;
	align-content: start;
	padding: 0.9rem 1.1rem;
	border: 1px solid var(--am-color-border);
	border-radius: var(--am-radius-small);
	background: var(--am-color-surface);
	text-decoration: none;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

a.edition-nav__item:hover,
a.edition-nav__item:focus-visible {
	border-color: rgb(40 87 70 / 45%);
	box-shadow: var(--am-shadow-soft);
}

.edition-nav__label {
	color: var(--am-color-muted);
	font-size: 0.68rem;
	font-weight: 750;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.edition-nav__title {
	color: var(--am-color-accent-dark);
	font-family: var(--am-font-serif);
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.3;
}

/* Placeholder cell when there is no previous/next edition. */
.edition-nav__item--ghost {
	border-style: dashed;
	background: transparent;
}

.edition-nav__item--ghost .edition-nav__title {
	color: var(--am-color-muted);
}

@media (min-width: 48rem) {
	.edition-nav {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.edition-nav__item--next {
		text-align: right;
	}
}

/* Hub year cards linked to the edition pages, with optional photo preview. */
.tournament-year-card--linked {
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.tournament-year-card--linked:hover,
.tournament-year-card--linked:focus-within {
	border-color: rgb(40 87 70 / 40%);
	box-shadow: var(--am-shadow-plate);
}

.tournament-year-card__media {
	margin: 0;
}

.tournament-year-card__media .media-frame {
	border-radius: var(--am-radius-small);
}

/* AM-028: the "Apri la scheda" CTA becomes an evident pill button, bottom-aligned
   in every card (margin-top: auto) so the whole archive reads as one tidy grid. */
.tournament-year-card__link {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	align-self: start;
	margin-top: auto;
	padding: 0.55rem 1rem;
	border: 1px solid rgb(40 87 70 / 32%);
	border-radius: 999px;
	background: var(--am-color-surface-muted);
	color: var(--am-color-accent-dark);
	font-size: 0.9rem;
	font-weight: 750;
	text-decoration: none;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.tournament-year-card__link span {
	transition: transform 0.2s ease;
}

.tournament-year-card__link:hover,
.tournament-year-card__link:focus-visible {
	border-color: var(--am-color-accent);
	background: var(--am-color-accent);
	color: #fff;
}

.tournament-year-card__link:hover span,
.tournament-year-card__link:focus-visible span {
	transform: translateX(0.2rem);
}

/* ----- AM-027 squadre e albo -------------------------------------------- */
/* Team rosters reconstructed from the tournament group's own announcements:
   one card per squad, with a colored keyline matching the shirt color and an
   optional note (winner/finalist). Minors are never listed by name. */

.edition-roster {
	display: grid;
	gap: 1rem;
	margin: 1.5rem 0 0;
}

.edition-roster__team {
	display: flex;
	flex-direction: column;
	padding: 1.15rem 1.25rem 1.25rem;
	border: 1px solid var(--am-color-border);
	border-top: 4px solid var(--am-color-border);
	border-radius: var(--am-radius-small);
	background: var(--am-color-surface);
	box-shadow: var(--am-shadow-soft);
}

.edition-roster__team h3 {
	margin: 0 0 0.6rem;
	font-size: 1.08rem;
	letter-spacing: -0.01em;
}

.edition-roster__team ul {
	display: grid;
	gap: 0.3rem;
	padding: 0;
	margin: 0;
	color: var(--am-color-muted);
	font-size: 0.94rem;
	line-height: 1.45;
	list-style: none;
}

.edition-roster__team li {
	padding-top: 0.3rem;
	border-top: 1px solid rgb(216 208 195 / 55%);
}

.edition-roster__note {
	margin: 0.85rem 0 0;
	padding-top: 0.6rem;
	border-top: 1px solid var(--am-color-border);
	color: var(--am-color-secondary-dark);
	font-size: 0.72rem;
	font-weight: 750;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

/* Shirt-color keylines: sober tints of the real team colors. */
.edition-roster__team--bianca { border-top-color: #cfc8b9; }
.edition-roster__team--rossa { border-top-color: #a24734; }
.edition-roster__team--turchese { border-top-color: #2f7f7a; }
.edition-roster__team--blu { border-top-color: #34558b; }
.edition-roster__team--gialla { border-top-color: #c9a13b; }

@media (min-width: 48rem) {
	.edition-roster {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.25rem;
	}
}

/* Closing note under the hub honours grid. */
.tournament-hall__note {
	max-width: 46rem;
	margin: 1.25rem 0 0;
	color: var(--am-color-muted);
	font-size: 0.95rem;
	font-style: italic;
	line-height: 1.6;
}

/* ----- AM-029 image lightbox -------------------------------------------- */
/* Progressive enhancement (assets/js/lightbox.js): content photos inside the
   reusable .media-frame become zoomable buttons that open in an accessible
   modal overlay. Local only, no libraries. The entrance animation below is
   neutralised by the global prefers-reduced-motion rule further down. */

.media-frame.is-zoomable {
	cursor: zoom-in;
}

/* Discreet zoom affordance in the corner, revealed on hover/focus only. */
.media-frame.is-zoomable::after {
	position: absolute;
	right: 0.55rem;
	bottom: 0.55rem;
	display: grid;
	place-content: center;
	width: 1.9rem;
	height: 1.9rem;
	border-radius: 999px;
	background: rgb(23 57 46 / 62%);
	color: #fff;
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1;
	opacity: 0;
	transition: opacity 0.2s ease;
	pointer-events: none;
	content: "+";
}

.media-frame.is-zoomable:hover::after,
.media-frame.is-zoomable:focus-visible::after {
	opacity: 1;
}

.media-frame.is-zoomable:focus-visible {
	outline: 3px solid var(--am-color-focus);
	outline-offset: 3px;
}

html.am-lightbox-open {
	overflow: hidden;
}

.am-lightbox {
	position: fixed;
	inset: 0;
	z-index: 1000;
	display: grid;
	place-items: center;
	padding: clamp(1rem, 4vw, 2.5rem);
}

.am-lightbox[hidden] {
	display: none;
}

.am-lightbox__backdrop {
	position: absolute;
	inset: 0;
	background: rgb(16 24 20 / 88%);
	animation: am-lightbox-fade 0.2s ease;
}

.am-lightbox__figure {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	max-width: min(100%, 72rem);
	margin: 0;
	animation: am-lightbox-zoom 0.2s ease;
}

.am-lightbox__img {
	max-width: 100%;
	max-height: 80vh;
	margin: 0 auto;
	border-radius: var(--am-radius-small);
	box-shadow: 0 1.5rem 4rem rgb(0 0 0 / 45%);
	object-fit: contain;
}

.am-lightbox__caption {
	max-width: 44rem;
	margin: 0 auto;
	color: #e7ede9;
	font-size: 0.9rem;
	font-style: italic;
	line-height: 1.5;
	text-align: center;
}

.am-lightbox__caption[hidden] {
	display: none;
}

.am-lightbox__close {
	position: absolute;
	top: clamp(0.75rem, 2vw, 1.25rem);
	right: clamp(0.75rem, 2vw, 1.25rem);
	z-index: 2;
	display: grid;
	place-content: center;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border: 1px solid rgb(255 255 255 / 35%);
	border-radius: 999px;
	background: rgb(16 24 20 / 70%);
	color: #fff;
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
	transition: background-color 0.2s ease, border-color 0.2s ease;
}

.am-lightbox__close:hover,
.am-lightbox__close:focus-visible {
	border-color: #fff;
	background: rgb(40 87 70 / 92%);
}

@keyframes am-lightbox-fade {
	from { opacity: 0; }
}

@keyframes am-lightbox-zoom {
	from { opacity: 0; transform: scale(0.97); }
}

/* ----- Motion preferences ---------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		transition-duration: 0.001ms !important;
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
	}
}

/* ----- AM-030 pre-launch polish --------------------------------------- */

/* INT3: vertical tournament photo on the homepage, contained beside the text. */
.home-tournament__media--portrait {
	max-width: 26rem;
	margin-inline: auto;
}

@media (min-width: 48rem) {
	.home-tournament__media--portrait {
		max-width: 24rem;
		margin-inline-start: auto;
		margin-inline-end: 0;
	}
}

/* INT2: responsive, privacy-friendly video embed (youtube-nocookie iframe). */
.page-video {
	margin: 1.5rem 0 0;
}

.page-video__frame {
	position: relative;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	border: 1px solid var(--am-color-border);
	border-radius: var(--am-radius-large);
	background: var(--am-color-surface-muted);
	box-shadow: var(--am-shadow-soft);
}

.page-video__frame iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* INT11: strong lead image at the top of an editorial page. */
.page-lead-media {
	margin: 0 0 2rem;
}

/* INT10: documentation source cards, labelled by source type. */
.doc-sources {
	display: grid;
	gap: 1rem;
	margin: 1.5rem 0 0;
}

@media (min-width: 48rem) {
	.doc-sources {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.doc-source {
	margin: 0;
	padding: 1.15rem 1.3rem 1.25rem;
	border: 1px solid var(--am-color-border);
	border-radius: var(--am-radius-large);
	background: var(--am-color-surface);
	box-shadow: var(--am-shadow-soft);
}

.doc-source__type {
	display: inline-flex;
	align-items: center;
	padding: 0.22rem 0.6rem;
	border: 1px solid var(--am-color-border);
	border-radius: 999px;
	font-size: 0.66rem;
	font-weight: 750;
	letter-spacing: 0.08em;
	line-height: 1.2;
	text-transform: uppercase;
}

.doc-source__type--primary {
	border-color: rgb(149 89 63 / 30%);
	background: rgb(244 231 218 / 88%);
	color: var(--am-color-secondary-dark);
}

.doc-source__type--news {
	border-color: rgb(40 87 70 / 24%);
	background: rgb(217 232 223 / 70%);
	color: var(--am-color-accent-dark);
}

.doc-source h3 {
	margin: 0.65rem 0 0.35rem;
	font-size: 1.05rem;
}

.doc-source p {
	margin: 0;
	color: var(--am-color-muted);
	font-size: 0.92rem;
	line-height: 1.55;
}

/* =======================================================================
   AM-031 pre-launch refinement (home, tournament, ricordi, chronology)
   New, self-contained components + a few scoped layout overrides. No new
   dependencies, no remote assets: local inline SVG icons only.
   ======================================================================= */

/* INT1 (home brief card grid), INT2 (stretched vertical tournament photo) and
   INT3 (.page-cards--column) were retired by AM-032: the homepage brief section
   merged into the unified "Esplora il sito" paths grid, the vertical photo is
   sized by migliorie.css §15 and the project cards use .page-cards--rooms. */

/* ----- INT4: "La cronaca di Trullovic" editorial quote-card ------------- */
/* A distinct, warm block holding a short curated excerpt from the friend's
   deferred match report, clearly set apart from the paraphrased recap. */
.edition-chronicle {
	max-width: 46rem;
	margin: clamp(1.6rem, 4vw, 2.4rem) 0 0;
	padding: 1.5rem 1.6rem 1.6rem;
	border: 1px solid var(--am-color-border);
	border-left: 4px solid var(--am-color-gold);
	border-radius: 0 var(--am-radius) var(--am-radius) 0;
	background: linear-gradient(160deg, var(--am-color-surface), var(--am-color-warm));
	box-shadow: var(--am-shadow-soft);
}

.edition-chronicle__label {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	margin-bottom: 0.9rem;
	color: var(--am-color-secondary);
	font-size: 0.7rem;
	font-weight: 750;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.edition-chronicle__label::before {
	width: 1.5rem;
	height: 2px;
	background: var(--am-color-gold);
	content: "";
}

.edition-chronicle__quote {
	margin: 0;
}

.edition-chronicle__quote p {
	margin: 0 0 0.9rem;
	color: var(--am-color-accent-dark);
	font-family: var(--am-font-serif);
	font-size: clamp(1.05rem, 2vw, 1.2rem);
	font-style: italic;
	line-height: 1.5;
}

.edition-chronicle__quote p:last-of-type {
	margin-bottom: 0;
}

.edition-chronicle__by {
	display: block;
	margin-top: 1.05rem;
	color: var(--am-color-secondary-dark);
	font-size: 0.8rem;
	font-style: normal;
	font-weight: 700;
	letter-spacing: 0.05em;
}

/* ----- INT6: tidy three-photo edition gallery + winner card focus ------ */
/* Three photos align as one clean row on desktop (was a 2-col grid with a
   gap and mismatched heights). */
@media (min-width: 48rem) {
	.edition-gallery--triptych {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* Bias a portrait source framed wide toward the faces/shirts, not the turf. */
.media-frame--top > img {
	object-position: center 28%;
}

/* ----- INT8: Ricordi page (voices + honest contribute path) ------------ */
/* No live form backend exists (no DB/plugin/third-party allowed): this page
   presents the collected voices and a clear route to contribute. Published
   dedications will appear here, in "Le voci raccolte". */
.ricordi-voices {
	display: grid;
	gap: 1.15rem;
	margin: 1.5rem 0 0;
}

.voice-card {
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	padding: 1.4rem 1.5rem 1.5rem;
	border: 1px solid var(--am-color-border);
	border-top: 3px solid var(--am-color-gold);
	border-radius: var(--am-radius);
	background: var(--am-color-surface);
	box-shadow: var(--am-shadow-soft);
}

.voice-card blockquote {
	margin: 0;
	color: var(--am-color-accent-dark);
	font-family: var(--am-font-serif);
	font-size: 1.1rem;
	font-style: italic;
	line-height: 1.5;
}

.voice-card cite {
	color: var(--am-color-secondary-dark);
	font-size: 0.82rem;
	font-style: normal;
	font-weight: 700;
	letter-spacing: 0.04em;
}

.ricordi-empty {
	margin: 1.25rem 0 0;
	padding: 1.4rem 1.5rem;
	border: 1px dashed rgb(149 89 63 / 40%);
	border-radius: var(--am-radius);
	background: var(--am-color-surface-muted);
	color: var(--am-color-muted);
	font-style: italic;
	line-height: 1.6;
}

/* The .ricordi-steps list was replaced in AM-032 by the .ricordi-how chips and
   the real moderated submission form (styles in migliorie.css §9/§18). */

@media (min-width: 48rem) {
	.ricordi-voices {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* ----- INT9: chronology — key questions + "what we know / to verify" ---- */
.doc-qa {
	display: grid;
	gap: 0.9rem;
	margin: 1.5rem 0 0;
}

.doc-qa__item {
	padding: 1.15rem 1.35rem;
	border: 1px solid var(--am-color-border);
	border-radius: var(--am-radius);
	background: var(--am-color-surface);
	box-shadow: var(--am-shadow-soft);
}

.doc-qa__item h3 {
	margin: 0 0 0.4rem;
	font-size: 1.05rem;
}

.doc-qa__item p {
	margin: 0;
	color: var(--am-color-muted);
	font-size: 0.96rem;
	line-height: 1.6;
}

.doc-knowns {
	display: grid;
	gap: 1rem;
	margin: 1.5rem 0 0;
}

.doc-knowns__col {
	padding: 1.3rem 1.4rem 1.4rem;
	border: 1px solid var(--am-color-border);
	border-radius: var(--am-radius);
	background: var(--am-color-surface);
	box-shadow: var(--am-shadow-soft);
}

.doc-knowns__col--known {
	border-top: 3px solid var(--am-color-accent);
}

.doc-knowns__col--open {
	border-top: 3px solid var(--am-color-gold);
}

.doc-knowns__col h3 {
	margin: 0 0 0.7rem;
	font-size: 1.1rem;
}

.doc-knowns__col ul {
	margin: 0;
	padding-left: 1.15rem;
	color: var(--am-color-muted);
	font-size: 0.96rem;
	line-height: 1.55;
}

.doc-knowns__col li {
	margin-bottom: 0.5rem;
}

.doc-knowns__col li:last-child {
	margin-bottom: 0;
}

@media (min-width: 48rem) {
	.doc-knowns {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}