/* The content tiers: race, city and trail pages and the marathons archive. */

/* --- Race landing pages (/marathons/…, Printworks_Races) ------------------ */
.contour-race-plaque { border-bottom: 1px solid var(--wp--preset--color--line); background: var(--wp--preset--color--sink); padding: var(--wp--preset--spacing--30) 0; }
.contour-race-plaque-line { margin: 0; font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.contour-race-plaque-line strong { color: var(--wp--preset--color--ink); font-weight: 600; }
.contour-race-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--40); list-style: none; padding: 0; margin: 0; }
.contour-race-card { border-top: 1px solid var(--wp--preset--color--line); padding-top: var(--wp--preset--spacing--20); }
.contour-race-card-name { margin: 0 0 0.35rem; font-size: 1.05rem; font-family: var(--wp--preset--font-family--display); font-weight: 600; letter-spacing: -0.01em; }
.contour-race-card-name a { text-decoration: none; color: var(--wp--preset--color--ink); }
.contour-race-card-name a:hover { color: var(--wp--preset--color--accent); }
.contour-race-card-desc, .contour-race-card-desc p { margin: 0; color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--small); line-height: 1.5; }

@media (max-width: 1023px) { .contour-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .contour-race-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .contour-trust-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { .contour-race-grid { grid-template-columns: 1fr; } .contour-hero-columns { flex-direction: column-reverse; } .contour-mockup--hero .contour-frame { width: min(100%, 300px); border-width: 9px; } .contour-grid { gap: var(--wp--preset--spacing--30) var(--wp--preset--spacing--20); } .contour-trust-list { grid-template-columns: 1fr; gap: var(--wp--preset--spacing--20); } }

/* --- City landing pages (/cities/…, Printworks_Cities) -------------------- */
.contour-city-plaque { border-bottom: 1px solid var(--wp--preset--color--line); background: var(--wp--preset--color--sink); padding: var(--wp--preset--spacing--30) 0; }
.contour-city-plaque-line { margin: 0; font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.contour-city-plaque-line strong { color: var(--wp--preset--color--ink); font-weight: 600; }
.contour-city-frames { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40); list-style: none; padding: 0; margin: var(--wp--preset--spacing--30) 0 0; }
.contour-city-frame { border-top: 1px solid var(--wp--preset--color--line); padding-top: var(--wp--preset--spacing--20); }
.contour-city-frame-name { margin: 0 0 0.2rem; font-size: 1.05rem; font-family: var(--wp--preset--font-family--display); font-weight: 600; letter-spacing: -0.01em; }
.contour-city-frame-name a { text-decoration: none; color: var(--wp--preset--color--ink); border-bottom: 1px solid var(--wp--preset--color--line); }
.contour-city-frame-name a:hover { color: var(--wp--preset--color--accent); border-bottom-color: currentColor; }
.contour-city-frame-scale { display: block; font-family: var(--wp--preset--font-family--mono); font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.contour-city-frame-note { margin: 0.4rem 0 0; color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--small); line-height: 1.55; }
.contour-city-paper p { margin: 0 0 1rem; }
.contour-city-related a { color: var(--wp--preset--color--muted); }
.contour-city-related a + a { margin-left: 0.6rem; }
@media (max-width: 599px) { .contour-city-frames { grid-template-columns: 1fr; } }

/* --- Trail landing pages (/trails/…, Printworks_Trails) ------------------- */
/* Generic names, not trail-specific: a plaque of facts and a grid of frames is
   what every landing tier wants, and the city pages predate the pattern. */
.contour-plaque { border-bottom: 1px solid var(--wp--preset--color--line); background: var(--wp--preset--color--sink); padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--30); display: flex; flex-wrap: wrap; gap: 0.5rem var(--wp--preset--spacing--40); justify-content: center; }
.contour-fact { font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--x-small); letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.contour-fact-value { color: var(--wp--preset--color--ink); font-weight: 600; }
.contour-frame-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40); margin-top: var(--wp--preset--spacing--40); }
.contour-frame-card { border-top: 1px solid var(--wp--preset--color--line); padding-top: var(--wp--preset--spacing--20); text-decoration: none; display: block; }
.contour-frame-label { display: block; font-family: var(--wp--preset--font-family--display); font-size: 1.05rem; font-weight: 600; letter-spacing: -0.01em; color: var(--wp--preset--color--ink); }
.contour-frame-card:hover .contour-frame-label { color: var(--wp--preset--color--accent); }
.contour-frame-note { display: block; margin-top: 0.4rem; color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--small); line-height: 1.55; }
.contour-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40); }
.contour-card--trail { border-top: 1px solid var(--wp--preset--color--line); padding-top: var(--wp--preset--spacing--20); text-decoration: none; }
.contour-trail-prose p { margin: 0 0 1rem; }
@media (max-width: 781px) { .contour-card-grid { grid-template-columns: 1fr; } }
@media (max-width: 599px) { .contour-frame-grid, .contour-card-grid { grid-template-columns: 1fr; } }

/* The marathons archive: every race as a card with its art (stage two of the site review). */
.contour-race-grid--art { gap: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40); }
.contour-race-card--art { display: flex; flex-direction: column; gap: 0.25rem; border-top: 0; padding-top: 0; text-decoration: none; color: var(--wp--preset--color--ink); }
.contour-race-card-link { display: flex; flex-direction: column; gap: 0.25rem; text-decoration: none; color: inherit; }
.contour-race-card-more { align-self: flex-start; margin-top: 0.35rem; font-size: 0.78rem; color: var(--wp--preset--color--muted); text-decoration: none; border-bottom: 1px solid var(--wp--preset--color--line); }
.contour-race-card-more:hover { color: var(--wp--preset--color--accent); }
.contour-race-card-art { display: block; background: var(--wp--preset--color--sink, #f2eee6); padding: 8%; margin-bottom: 0.6rem; }
.contour-race-card-art img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; box-shadow: 0 14px 28px -18px rgba(23, 21, 15, 0.45); border: 6px solid #1a1814; box-sizing: border-box; }
/* After dark on hover: the night print laid over the day one. Where nothing hovers it is not shown, so the lazy image is never fetched. */
.contour-race-card-stack { display: block; position: relative; }
.contour-race-card-night { display: none; }
@media (hover: hover) {
	.contour-race-card-night { display: block; position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }
	.contour-race-card-link:hover .contour-race-card-night,
	.contour-race-card-link:focus-visible .contour-race-card-night { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) { .contour-race-card-night { transition: none; } }
.contour-race-card-when { font-family: var(--wp--preset--font-family--mono); font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.contour-race-card--art .contour-race-card-name { font-family: var(--wp--preset--font-family--display); font-weight: 600; font-size: 1.05rem; letter-spacing: -0.01em; }
.contour-race-card-link:hover .contour-race-card-name { color: var(--wp--preset--color--accent); }
.contour-race-card--art .contour-race-card-desc { color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--small); line-height: 1.45; }
.contour-race-sort { margin-top: calc(-1 * var(--wp--preset--spacing--30)); }
