/* Design B — layered on ../shared/css/style.css (agreed colours + type).
   Calm, single reading column, solid navy panels, no text on photos.
   Sizes re-stated in rem so the "Larger text" button scales everything.
   Contrast: aqua on navy 5.2:1 (any size), white on navy 16:1, navy on aqua 5.2:1. */

:root {
	--tint: #E6F0F7;      /* navy 13.9:1, dark blue 7.7:1, teal 4.7:1 */
	--line: #C9D7E4;      /* decorative only */
	--focus: #E35205;
	--wrap: 1140px;
	--col: 44rem;
}
html { font-size: 100%; }
html.text-lg { font-size: 118.75%; }
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: #fff; font-size: 1rem; line-height: 1.65; }
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: underline; text-underline-offset: 0.15em; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
main:focus { outline: none; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* agreed type scale, restated in rem */
h1 { font-size: 2.5rem; } h2 { font-size: 2rem; } h3 { font-size: 1.625rem; } h4 { font-size: 1.25rem; } h5 { font-size: 1.125rem; }
p, li, dd, dt, label, legend, input, select, textarea, button { font-size: 1rem; }
p { line-height: 1.65; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }
.col { max-width: var(--col); }
.plain { list-style: none; margin: 0; padding: 0; }
.small { color: var(--crda-grey); font-size: 0.95rem; }
.meta { color: var(--crda-grey); margin: 0 0 4px; }
.lede { font-size: 1.25rem; line-height: 1.55; }
.btns { display: flex; flex-wrap: wrap; gap: 12px; }
.btn-ghost { border: 2px solid var(--crda-dark-blue); color: var(--crda-dark-blue); padding: 10px 20px; background: #fff; }
.btn-ghost:hover, .btn-ghost:focus { background: var(--crda-dark-blue); color: #fff; }
.crda-btn { line-height: 1.3; }
.crda-btn--accent { font-size: 1.1875rem; }

.skip { position: absolute; left: 12px; top: -60px; background: #fff; color: var(--crda-navy); padding: 12px 18px; z-index: 100; font-weight: bold; }
.skip:focus { top: 12px; }
.demo-bar { background: var(--crda-grey); }
.demo-bar p { margin: 0 auto; max-width: var(--wrap); padding: 6px 24px; color: #fff; font-size: 0.95rem; }
.demo-bar a { color: #fff; }

/* Header: navy, audience-led menu on its own row */
.site-header { background: var(--crda-navy); color: #fff; position: relative; z-index: 20; }
.header-row { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-top: 16px; padding-bottom: 12px; }
.logo { display: flex; align-items: center; gap: 14px; color: #fff; text-decoration: none; }
.logo:hover, .logo:focus { color: #fff; }
.logo-mark { background: var(--crda-aqua); color: var(--crda-navy); font-weight: bold; font-size: 1.2rem; padding: 12px 10px; border-radius: 50% 50% 8px 8px; }
.logo-text { font-weight: bold; font-size: 1.15rem; line-height: 1.2; }
.header-tools { display: flex; align-items: center; gap: 12px; }
.text-size { font: inherit; font-weight: bold; color: #fff; background: transparent; border: 2px solid #fff; border-radius: 6px; padding: 9px 14px; cursor: pointer; }
.text-size[aria-pressed="true"] { background: #fff; color: var(--crda-navy); }
.nav-toggle { display: none; }
.primary-nav { border-top: 1px solid rgba(255, 255, 255, 0.25); }
.menu { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.menu > li { position: relative; }
.menu > li > a, .sub-toggle { display: block; padding: 14px 16px; font: inherit; font-weight: bold; color: #fff; background: none; border: 0; cursor: pointer; text-decoration: none; }
.menu > li:first-child > a { padding-left: 0; }
.menu > li > a:hover, .sub-toggle:hover { text-decoration: underline; }
.menu > li > a[aria-current="page"], .menu .is-active > .sub-toggle { box-shadow: inset 0 -4px 0 var(--crda-aqua); }
.chev { display: inline-block; width: 0.45em; height: 0.45em; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); margin: 0 0 0.25em 0.5em; }
.sub-toggle[aria-expanded="true"] .chev { transform: rotate(-135deg); margin-bottom: -0.1em; }
.sub { list-style: none; margin: 0; padding: 10px; position: absolute; left: 0; top: 100%; min-width: 260px; background: #fff; border-radius: 0 0 8px 8px; box-shadow: 0 12px 28px rgba(17, 28, 78, 0.25); }
.js .sub { display: none; }
.js .sub-toggle[aria-expanded="true"] + .sub { display: block; }
.sub a { display: block; padding: 10px 12px; color: var(--crda-navy); text-decoration: none; border-radius: 6px; }
.sub a:hover, .sub a:focus { background: var(--tint); text-decoration: underline; }
.sub a[aria-current="page"] { font-weight: bold; }

/* Rhythm */
.block { padding: 56px 0; }
.block:not(.tint) + .block:not(.tint) { padding-top: 8px; }
.tint { background: var(--tint); }
.tint h3, .tint .rl-t { color: var(--crda-dark-blue); }
.block > .wrap > h2:first-child, .col > h2:first-child { margin-top: 0; }
.col ul, .col ol:not(.timeline) { padding-left: 1.2em; }
.col li { margin-bottom: 8px; }

/* Page head: photo first (untouched), then title + In short beside it */
.photo-band img { width: 100%; aspect-ratio: 32 / 9; object-fit: cover; object-position: 50% 40%; }
.photo-band--tall img { aspect-ratio: 21 / 8; object-position: 50% 15%; }
.page-head { padding-bottom: 32px; border-bottom: 1px solid var(--line); margin-bottom: 24px; }
.ph-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 48px; align-items: start; padding-top: 28px; }
.page-head h1 { font-size: clamp(2.4rem, 4.5vw, 3.4rem); line-height: 1.08; margin-bottom: 16px; }
.crumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 28px 0 16px; }
.ph-grid .crumbs ol { margin-top: 0; }
.crumbs li + li::before { content: ">"; margin-right: 6px; color: var(--crda-grey); }
.crumbs span { color: var(--crda-grey); }
.in-short { margin-top: 8px; }
.in-short h2 { color: var(--crda-navy); font-size: 1.375rem; margin: 0 0 8px; }
.in-short ul { margin: 0; padding-left: 1.1em; }
.in-short li { margin-bottom: 6px; color: var(--crda-navy); font-size: 1.0625rem; }
.good-to-know { margin: 8px 0 24px; }

/* Home hero: photo, then a solid navy panel (no text on the photo) */
.home-hero .hero-panel { background: var(--crda-navy); color: #fff; padding: 8px 0 48px; }
.home-hero h1 { color: #fff; font-size: clamp(2.6rem, 5.5vw, 4.4rem); line-height: 1.04; margin: 24px 0 14px; }
.home-hero .mi { color: var(--crda-aqua); font-size: 1.25rem; font-weight: bold; }
.home-hero .lede { color: #fff; }
.home-hero .in-short { margin-top: 32px; }
.center-h { margin-top: 0; }

/* Audience chooser: three big, whole-row links */
.paths { display: grid; gap: 14px; }
.path a { display: grid; grid-template-columns: 180px 1fr; gap: 24px; align-items: center; text-decoration: none; border: 2px solid var(--line); border-radius: 12px; overflow: hidden; color: var(--crda-navy); background: #fff; }
.path a:hover { border-color: var(--crda-dark-blue); }
.path a:hover .path-t { text-decoration: underline; }
.path-photo img { width: 180px; height: 130px; object-fit: cover; object-position: 50% 25%; }
.path-t { display: block; font-size: 1.5rem; font-weight: bold; color: var(--crda-dark-blue); }
.path-d { display: block; margin-top: 4px; }

/* Navy panel sections */
.panel { background: var(--crda-navy); color: #fff; padding: 64px 0; }
.panel h2 { color: var(--crda-aqua); margin-top: 0; }
.panel p, .panel li { color: #fff; }
.panel a, .on-dark { color: #fff; font-weight: bold; }
.panel a:hover, .panel a:focus { color: #fff; text-decoration-thickness: 2px; }
.stmts { display: grid; gap: 0; }
.stmt { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; padding: 36px 0; border-top: 1px solid rgba(255, 255, 255, 0.3); }
.stmt:first-child { border-top: 0; padding-top: 0; }
.stmt-q { font-size: 1.75rem; line-height: 1.25; font-weight: bold; color: var(--crda-aqua) !important; margin: 0; }
.stmt-d p:last-child { margin-bottom: 0; }

/* Rider quotes */
.rqs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-bottom: 28px; }
.rq-photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 10px; }
.rq blockquote { margin: 18px 0 8px; }
.rq blockquote p { font-size: 1.375rem; line-height: 1.35; font-weight: bold; }
.rq-by { opacity: 1; }

/* Horse nameplates */
.plate { display: inline-block; background: var(--crda-navy); color: #fff; font-weight: bold; font-size: 1.25rem; line-height: 1.2; padding: 10px 18px; border-radius: 6px;
	box-shadow: inset 0 0 0 3px var(--crda-navy), inset 0 0 0 5px #fff; margin: 0 0 10px; text-decoration: none; }
h1.plate, h2.plate { color: #fff; }
.plate--big { font-size: clamp(2.2rem, 4vw, 3.2rem); padding: 14px 26px; box-shadow: inset 0 0 0 4px var(--crda-navy), inset 0 0 0 7px #fff; }
.plates { display: flex; flex-wrap: wrap; gap: 10px; }
.plate--link { margin: 0; }
.plate--link:hover, .plate--link:focus { background: var(--crda-dark-blue); color: #fff; text-decoration: underline; }
.big-sentence { font-size: 1.5rem; line-height: 1.4; font-weight: bold; color: var(--crda-navy); }

/* Badges */
.badges { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
.crda-badge { display: inline-block; background: var(--crda-aqua); color: var(--crda-navy); font-size: 0.8125rem; font-weight: bold; padding: 4px 10px; border-radius: 12px; }
.tag { display: inline-block; border: 1px solid var(--crda-grey); color: var(--crda-navy); font-size: 0.8125rem; font-weight: bold; padding: 3px 10px; border-radius: 12px; }
.tag--need { background: var(--crda-dark-blue); border-color: var(--crda-dark-blue); color: #fff; }

/* Horses list */
.jump { background: var(--tint); border-radius: 10px; padding: 18px 22px; margin-bottom: 8px; }
.jump-h { font-size: 1.125rem; color: var(--crda-navy); margin: 0 0 8px; }
.jump ul { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.jump a { font-weight: bold; }
.horse-rows { display: grid; gap: 0; }
.horse-row { display: grid; grid-template-columns: 340px 1fr; gap: 40px; padding: 36px 0; border-top: 1px solid var(--line); scroll-margin-top: 16px; }
.horse-row:first-child { border-top: 0; padding-top: 0; }
.hr-photo img { width: 100%; aspect-ratio: 1; object-fit: cover; object-position: 50% 30%; border-radius: 10px; }
.mini { display: grid; grid-template-columns: repeat(3, auto); justify-content: start; gap: 4px 32px; margin: 0 0 14px; }
.mini dt { font-weight: bold; color: var(--crda-dark-blue); font-size: 0.95rem; }
.mini dd { margin: 0; }
.horse-head { display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; align-items: center; padding-bottom: 8px; }
.hh-photo img { width: 100%; aspect-ratio: 4 / 4.4; object-fit: cover; border-radius: 12px; }

/* Rows (dl) */
.rows { margin: 0; border-top: 2px solid var(--crda-navy); }
.rows div { display: grid; grid-template-columns: 12rem 1fr; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.rows dt { font-weight: bold; color: var(--crda-navy); }
.rows dd { margin: 0; }
.rows address { font-style: normal; }

/* Timeline (a real sequence) */
.timeline { list-style: none; counter-reset: t; margin: 0; padding: 0; }
.timeline li { counter-increment: t; position: relative; padding: 0 0 28px 72px; }
.timeline li::before { content: counter(t); position: absolute; left: 0; top: 0; width: 48px; height: 48px; border-radius: 50%; background: var(--crda-navy); color: #fff; font-weight: bold; font-size: 1.25rem; display: grid; place-items: center; }
.timeline li::after { content: ""; position: absolute; left: 23px; top: 52px; bottom: 4px; width: 2px; background: var(--line); }
.timeline li:last-child::after { display: none; }
.step-t { font-size: 1.25rem; color: var(--crda-navy); margin: 8px 0 4px; }
.timeline p { margin: 0; }

/* Sections with a photo under the text */
.sec-photo { margin: 28px 0 0; max-width: 56rem; }
.sec-photo img { width: 100%; aspect-ratio: 16 / 8; object-fit: cover; border-radius: 12px; }
.defs dt { font-weight: bold; color: var(--crda-dark-blue); margin-top: 14px; }
.defs dd { margin: 4px 0 0; }

/* What to do next */
.next { border: 4px solid var(--crda-navy); border-radius: 14px; padding: 32px 36px; max-width: var(--col); }
.next h2 { margin-top: 0; color: var(--crda-navy); }

/* Tiers */
.tiers { display: grid; gap: 0; margin-bottom: 24px; border-top: 2px solid var(--crda-navy); }
.tier { display: grid; grid-template-columns: 14rem 1fr; gap: 24px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.tier-n { margin: 0; font-size: 1.625rem; }
.tier-p { margin: 4px 0 0; font-weight: bold; }
.tier ul { margin: 0; padding-left: 1.1em; }

/* Gallery */
.gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.gallery img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 10px; }

/* Row links (related, etc.) */
.rowlinks { display: grid; gap: 16px; }
.rl { display: grid; grid-template-columns: 140px 1fr; gap: 20px; align-items: center; position: relative; }
.rl-photo img { width: 140px; height: 105px; object-fit: cover; border-radius: 8px; }
.rl-t { font-size: 1.25rem; color: var(--crda-navy); margin: 0 0 4px; }
.rl-t a { color: inherit; }
.rl p { margin: 0; }

/* Date plates */
.dplate { display: inline-grid; place-items: center; width: 72px; min-width: 72px; height: 76px; border-radius: 8px; background: var(--crda-navy); color: #fff; font-weight: bold; line-height: 1; }
.dp-d { font-size: 1.75rem; }
.dp-m { font-size: 0.95rem; }
.datelist { display: grid; gap: 22px; margin-bottom: 16px; }
.dl-item { display: grid; grid-template-columns: 72px 1fr; gap: 20px; align-items: start; }
.dl-item p { margin: 0 0 4px; }
.datelist--big { gap: 36px; }
.two { display: grid; grid-template-columns: 1.3fr 1fr; gap: 56px; }
.two h2 { margin-top: 0; }
.event-card { display: grid; grid-template-columns: 72px 1fr; gap: 20px; background: #fff; border-radius: 12px; padding: 22px; margin-bottom: 16px; }
.event-card p { margin: 0 0 6px; }

/* News */
.news-rows { display: grid; gap: 0; }
.news-row { display: grid; grid-template-columns: 300px 1fr; gap: 32px; padding: 28px 0; border-top: 1px solid var(--line); }
.news-row:first-child { border-top: 0; padding-top: 0; }
.nr-photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 10px; }
.nr-t { font-size: 1.5rem; margin: 4px 0 8px; color: var(--crda-navy); }
.nr-t a { color: inherit; }
.pager { display: flex; gap: 18px; margin-top: 28px; font-weight: bold; }
.pager [aria-current] { color: var(--crda-navy); text-decoration: none; }
.map-ph { border: 2px dashed var(--crda-grey); border-radius: 12px; padding: 32px; min-height: 220px; display: grid; place-items: center; text-align: center; background: #fff; }

/* Stories */
.story-rows { display: grid; gap: 0; }
.story-row { display: grid; grid-template-columns: 300px 1fr; gap: 36px; padding: 32px 0; border-top: 1px solid var(--line); align-items: center; }
.story-row:first-child { border-top: 0; padding-top: 0; }
.sr-photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 10px; }
.story-row blockquote { margin: 0 0 8px; }
.story-row blockquote p { font-size: 1.5rem; line-height: 1.35; font-weight: bold; color: var(--crda-navy); margin: 0; }
.sr-t { font-size: 1.25rem; margin: 4px 0 0; color: var(--crda-navy); }
.sr-t a { color: var(--crda-teal); }
.big-quote { margin: 8px 0 0; }
.big-quote p { font-size: clamp(1.6rem, 3vw, 2.2rem); line-height: 1.3; font-weight: bold; color: var(--crda-navy); margin: 0 0 8px; }
.big-quote footer { color: var(--crda-grey); }
.story-photo { margin: 0 auto; }
.story-photo img { width: 100%; max-height: 560px; object-fit: cover; border-radius: 12px; }

/* People */
.people { display: grid; grid-template-columns: repeat(3, 1fr); gap: 36px 32px; }
.person-photo img, .person-photo .initials { width: 160px; height: 160px; border-radius: 50%; object-fit: cover; object-position: 50% 25%; }
.initials { display: grid; place-items: center; background: var(--tint); color: var(--crda-dark-blue); font-size: 2.6rem; font-weight: bold; }
.person-n { font-size: 1.375rem; color: var(--crda-navy); margin: 16px 0 2px; }
.person-r { font-weight: bold; color: var(--crda-teal); margin: 0 0 8px; }

/* Sponsors list */
.sp-list { border-top: 2px solid var(--crda-navy); }
.sp-list li { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 14px 0; border-bottom: 1px solid var(--line); }
.sp-n { font-weight: bold; color: var(--crda-navy); font-size: 1.125rem; }
.sp-note { color: var(--crda-grey); }

/* Contact */
.big-phone { margin: 0 0 24px; }
.big-phone a { font-size: clamp(1.8rem, 4vw, 2.6rem); font-weight: bold; color: var(--crda-dark-blue); }
.big-phone span { display: block; color: var(--crda-grey); }

/* Forms */
.form-wrap { max-width: var(--wrap); margin: 0 auto; padding: 24px 24px 56px; }
.form-wrap > h2, .form-wrap > p { max-width: var(--col); }
.form { max-width: var(--col); border-top: 4px solid var(--crda-navy); padding-top: 24px; }
.field { margin: 0 0 24px; }
.field label, .field--choices legend { display: block; font-weight: bold; color: var(--crda-navy); margin-bottom: 6px; font-size: 1.0625rem; }
.group { border: 0; padding: 0; margin: 0 0 16px; }
.group > legend { font-size: 1.375rem; font-weight: bold; color: var(--crda-dark-blue); margin-bottom: 16px; }
.field--choices { border: 0; padding: 0; }
.req, .opt { font-weight: normal; color: var(--crda-grey); }
.hint { color: var(--crda-grey); margin: 0 0 6px; }
input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="date"], select, textarea {
	width: 100%; font: inherit; color: var(--crda-navy); background: #fff; padding: 12px 14px; min-height: 52px; border: 2px solid var(--crda-navy); border-radius: 8px; }
input:focus, select:focus, textarea:focus { box-shadow: 0 0 0 3px var(--crda-aqua); }
.choice { display: flex; align-items: center; gap: 12px; font-weight: normal !important; padding: 8px 0; }
.choice input { width: 24px; height: 24px; accent-color: var(--crda-navy); }
.hp { position: absolute; left: -9999px; }
.demo-note { font-size: 0.9rem; color: var(--crda-grey); margin-top: 12px; }
.form button, .donate-box button, .newsletter button { border: 0; cursor: pointer; }

/* Donate */
.donate-box { max-width: var(--col); border: 4px solid var(--crda-navy); border-radius: 14px; padding: 32px; }
.donate-box h2 { margin-top: 0; }
.donate-box fieldset { border: 0; padding: 0; margin: 0 0 24px; }
.donate-box legend { font-weight: bold; color: var(--crda-navy); margin-bottom: 10px; font-size: 1.125rem; }
.freq { display: flex; gap: 0; }
.freq legend { width: 100%; }
.seg { flex: 1; }
.seg input, .amt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.seg span { display: block; text-align: center; padding: 12px; border: 2px solid var(--crda-navy); font-weight: bold; color: var(--crda-navy); cursor: pointer; }
.seg:first-of-type span { border-radius: 8px 0 0 8px; }
.seg:last-of-type span { border-radius: 0 8px 8px 0; border-left: 0; }
.seg input:checked + span { background: var(--crda-navy); color: #fff; }
.seg input:focus-visible + span, .amt input:focus-visible ~ span { outline: 3px solid var(--focus); outline-offset: 2px; }
.amts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-bottom: 14px; }
.amt { display: block; border: 2px solid var(--crda-navy); border-radius: 8px; padding: 12px 16px; cursor: pointer; position: relative; }
.amt span { font-size: 1.375rem; font-weight: bold; color: var(--crda-navy); display: block; }
.amt small { color: var(--crda-grey); font-size: 0.95rem; }
.amt:has(input:checked) { background: var(--crda-navy); }
.amt:has(input:checked) span, .amt:has(input:checked) small { color: #fff; }
.other span { display: block; font-weight: bold; color: var(--crda-navy); margin-bottom: 6px; }
.other input { max-width: 180px; }

/* Footer: white, links grouped by audience */
.site-footer { border-top: 6px solid var(--crda-navy); background: #fff; margin-top: 56px; }
.site-footer h2 { font-size: 1.25rem; color: var(--crda-navy); margin: 0 0 12px; }
.footer-links { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; padding-top: 48px; padding-bottom: 32px; border-bottom: 1px solid var(--line); }
.footer-links li, .footer-contact li { margin-bottom: 8px; }
.footer-contact { display: grid; grid-template-columns: 1fr 1fr 1.3fr; gap: 32px; padding-top: 32px; padding-bottom: 40px; }
.footer-contact address { font-style: normal; }
.phone { font-weight: bold; font-size: 1.25rem; }
.newsletter label { display: block; font-weight: bold; margin-bottom: 6px; }
.newsletter__row { display: flex; gap: 8px; }
.newsletter input { flex: 1; }
.newsletter .hint { margin-top: 8px; }
.footer-base { background: var(--crda-navy); }
.footer-base .wrap { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-top: 16px; padding-bottom: 16px; }
.footer-base p { color: #fff; margin: 0; }
.footer-base a { color: #fff; margin-left: 14px; }

/* ---------- Tablet ---------- */
@media (max-width: 1024px) {
	.rqs, .people { grid-template-columns: 1fr 1fr; }
	.footer-links { grid-template-columns: 1fr 1fr; }
	.footer-contact { grid-template-columns: 1fr 1fr; }
	.footer-contact > :last-child { grid-column: span 2; }
}
@media (max-width: 900px) {
	.nav-toggle { display: inline-block; font: inherit; font-weight: bold; color: var(--crda-navy); background: #fff; border: 0; border-radius: 6px; padding: 10px 16px; cursor: pointer; }
	.js .primary-nav { display: none; }
	.js .primary-nav.is-open { display: block; }
	.menu { flex-direction: column; padding-bottom: 12px; }
	.menu > li > a, .sub-toggle { padding-left: 0; }
	.sub { position: static; box-shadow: none; border-radius: 8px; }
}
/* ---------- Mobile ---------- */
@media (max-width: 768px) {
	.block { padding: 40px 0; }
	.ph-grid, .two, .horse-head, .stmt { grid-template-columns: 1fr; gap: 20px; }
	.photo-band img, .photo-band--tall img { aspect-ratio: 4 / 3; }
	.header-row { flex-wrap: wrap; }
	.header-tools { width: 100%; justify-content: space-between; }
	.path a { grid-template-columns: 96px 1fr; gap: 14px; }
	.path-photo img { width: 96px; height: 96px; }
	.path-t { font-size: 1.2rem; }
	.rqs, .people, .gallery, .footer-links, .footer-contact { grid-template-columns: 1fr; }
	.footer-contact > :last-child { grid-column: auto; }
	.horse-row, .news-row, .story-row { grid-template-columns: 1fr; gap: 16px; }
	.mini { grid-template-columns: 1fr 1fr; }
	.rows div, .tier { grid-template-columns: 1fr; gap: 4px; }
	.amts { grid-template-columns: 1fr; }
	.newsletter__row { flex-direction: column; }
	.next, .donate-box { padding: 24px; }
	.rl { grid-template-columns: 96px 1fr; }
	.rl-photo img { width: 96px; height: 72px; }
}

.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
