/* ELSC theme: only what theme.json can't express. Square corners, no shadows, no gradients. */

:root {
	--elsc-tracking: -0.066em;
	--elsc-focus: 3px solid var(--wp--preset--color--red);
}

/* Visible keyboard focus everywhere. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: var(--elsc-focus);
	outline-offset: 2px;
}

/* Skip link (WordPress adds it for block themes). */
.skip-link.screen-reader-text:focus {
	background: var(--wp--preset--color--black);
	color: var(--wp--preset--color--offwhite);
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	padding: 0.75rem 1rem;
	clip-path: none;
}

/* ---------- Heading style "Strips": each line on its own off-white strip, as in the reels ---------- */
/* The heading is rendered inline so the off-white background wraps line by line (box-decoration-break). */
.wp-block-heading.is-style-strips {
	display: inline;
	background-color: var(--wp--preset--color--offwhite);
	color: var(--wp--preset--color--black);
	font-weight: 900;
	letter-spacing: var(--elsc-tracking);
	line-height: 1.24;
	padding: 0 0.12em;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}
/* Inline elements get no vertical margin, so space the next block instead. */
.wp-block-heading.is-style-strips + * {
	margin-block-start: var(--wp--preset--spacing--40);
}
/* Keywords: select a word and use Highlight (mark) in the editor; it turns red, same weight. */
.wp-block-heading.is-style-strips mark {
	background: none !important;
	color: var(--wp--preset--color--red) !important;
}

/* ---------- Paragraph style "Tag" ---------- */
.is-style-tag {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 800;
	font-size: 0.8125rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--wp--preset--color--card-red);
	margin-block-end: 0.25rem;
}
/* Red tags stay red on black (4.8:1, passes AA); on card-red they turn off-white. */
.has-black-background-color .is-style-tag {
	color: var(--wp--preset--color--red);
}
.has-card-red-background-color .is-style-tag {
	color: var(--wp--preset--color--offwhite);
}

/* ---------- Buttons ---------- */
.wp-block-button.is-style-outline-elsc .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--black);
	box-shadow: inset 0 0 0 2px currentColor;
}
.wp-block-button.is-style-outline-elsc .wp-block-button__link:is(:hover, :focus-visible) {
	background: var(--wp--preset--color--black);
	color: var(--wp--preset--color--offwhite);
	box-shadow: none;
}
.has-black-background-color .wp-block-button.is-style-outline-elsc .wp-block-button__link {
	color: var(--wp--preset--color--offwhite);
}

/* ---------- Header ---------- */
.elsc-header {
	border-block-end: 1px solid var(--wp--preset--color--black);
}
.elsc-header .elsc-logo img {
	display: block;
	height: 40px;
	width: auto;
}
@media (max-width: 600px) {
	.elsc-header .elsc-logo img { height: 32px; }
}
.elsc-header .wp-block-navigation a:where(:not(.wp-element-button)) {
	text-decoration: none;
}
.elsc-header .wp-block-navigation a:where(:not(.wp-element-button)):hover,
.elsc-header .wp-block-navigation .current-menu-item > a {
	text-decoration: underline;
	text-decoration-color: var(--wp--preset--color--red);
	text-decoration-thickness: 3px;
	text-underline-offset: 6px;
}
/* Mobile menu overlay in brand colours. */
.wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--black) !important;
	color: var(--wp--preset--color--offwhite) !important;
}

/* ---------- Footer ---------- */
.elsc-footer a { color: inherit; }
.elsc-footer .elsc-logo img { height: 36px; width: auto; display: block; }

/* ---------- Cards in query loops ---------- */
.elsc-card {
	border-block-start: 3px solid var(--wp--preset--color--black);
	padding-block-start: 1rem;
	height: 100%;
}
.elsc-card .wp-block-post-title a { text-decoration: none; color: var(--wp--preset--color--black); }
.elsc-card .wp-block-post-title a:hover { text-decoration: underline; text-decoration-color: var(--wp--preset--color--red); }
.elsc-card .wp-block-post-featured-image img { aspect-ratio: 16 / 9; object-fit: cover; }

/* No rounded corners or shadows anywhere, whatever a block's defaults are. */
img, .wp-block-image img, .wp-block-button__link, input, select, textarea, .wp-block-search__input {
	border-radius: 0 !important;
}
.wp-block-search__input { border: 2px solid var(--wp--preset--color--black); }

/* Right-to-left (Arabic): flip the quote rule. */
[dir="rtl"] .wp-block-quote {
	border-left: 0;
	border-right: 4px solid var(--wp--preset--color--red);
	padding-left: 0;
	padding-right: 1.25rem;
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; }
}

/* Plain link lists (footer). */
.wp-block-list.is-style-none { list-style: none; padding-inline-start: 0; }
.wp-block-list.is-style-none li + li { margin-block-start: 0.4rem; }

/* ---------- Section pages (0.1.3) ---------- */
/* Big numbers: steps and key figures. */
.elsc-step-number {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 900;
	font-size: clamp(2.75rem, 6vw, 4.5rem);
	line-height: 1;
	letter-spacing: var(--elsc-tracking);
	color: var(--wp--preset--color--card-red);
	margin-block-end: 0.5rem;
}
.has-black-background-color .elsc-step-number { color: var(--wp--preset--color--red); }
/* Cards on black: off-white rule; headings and links readable. */
.has-black-background-color .elsc-card { border-block-start-color: var(--wp--preset--color--offwhite); }
.has-black-background-color :is(h1, h2, h3, h4) { color: var(--wp--preset--color--offwhite); }
.has-black-background-color .wp-block-heading.is-style-strips { color: var(--wp--preset--color--black); }
.has-black-background-color a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--offwhite); }
/* Card headings that link: black, red underline on hover. */
.elsc-card .wp-block-heading a { color: inherit; text-decoration: none; }
.elsc-card .wp-block-heading a:is(:hover, :focus-visible) { text-decoration: underline; text-decoration-color: var(--wp--preset--color--red); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.elsc-card .wp-block-image img { aspect-ratio: 1200 / 630; object-fit: cover; width: 100%; }
/* "Read bio" toggles. */
.elsc-card .wp-block-details { border: 0; padding: 0; }
.elsc-card .wp-block-details summary {
	cursor: pointer;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: 0.9375rem;
	text-decoration: underline;
	text-decoration-color: var(--wp--preset--color--red);
	text-underline-offset: 4px;
}
.elsc-card .is-style-tag { margin-block-start: 0.25rem; }
/* First element in a card sits right under the rule (big numbers keep no 1em default margin). */
.elsc-card > :first-child, .elsc-step-number { margin-block-start: 0; }

/* =====================================================================
   0.2.0: compact layout, cards, lists, team, forms, donate
   ===================================================================== */

/* Hero: intro text slightly muted so the strips lead. */
.elsc-hero .elsc-lede { color: var(--wp--preset--color--offwhite); opacity: 0.88; max-width: 44rem; }
.elsc-hero .wp-block-buttons { margin-block-start: var(--wp--preset--spacing--40); }
.elsc-section-intro { max-width: 44rem; color: var(--wp--preset--color--grey-dark); }

/* Cards: compact rhythm. */
.elsc-card { padding-block-start: 0.875rem; }
.elsc-card > * + * { margin-block-start: 0.5rem; }
.elsc-card .wp-block-post-featured-image { margin-block-end: 0.25rem; }
.elsc-card .wp-block-post-featured-image img { width: 100%; object-fit: cover; }
.elsc-card-terms, .elsc-card-terms a {
	font-family: var(--wp--preset--font-family--heading); font-weight: 800; font-size: 0.75rem;
	text-transform: uppercase; letter-spacing: 0.04em; color: var(--wp--preset--color--card-red); text-decoration: none;
}
.elsc-card-title { font-size: var(--wp--preset--font-size--large); line-height: 1.2; margin-block-start: 0.25rem; }
.elsc-card-title a { color: var(--wp--preset--color--black); text-decoration: none; }
.elsc-card-title a:is(:hover, :focus-visible) { text-decoration: underline; text-decoration-color: var(--wp--preset--color--red); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.elsc-card-excerpt { font-size: 0.9375rem; color: var(--wp--preset--color--ink); }
.elsc-card-excerpt .wp-block-post-excerpt__more-text { display: none; }
.elsc-card-date { font-size: 0.8125rem; color: var(--wp--preset--color--grey-dark); }
.elsc-read-more { font-family: var(--wp--preset--font-family--heading); font-weight: 700; color: var(--wp--preset--color--card-red); }
.elsc-stat-label { font-family: var(--wp--preset--font-family--heading); font-weight: 700; margin-block-start: 0 !important; }

/* News: on wide screens the newest post takes two columns. */
@media (min-width: 900px) {
	.elsc-news-grid .wp-block-post-template > li:first-child { grid-column: span 2; }
	.elsc-news-grid .wp-block-post-template > li:first-child .elsc-card-title { font-size: var(--wp--preset--font-size--x-large); }
}

/* Filter chips (category list) and jump links. */
.elsc-filter-chips, .elsc-jump-nav { display: flex; flex-wrap: wrap; gap: 0.5rem; list-style: none; padding: 0; margin-block-start: var(--wp--preset--spacing--40); }
.elsc-filter-chips li { margin: 0; }
.elsc-filter-chips a, .elsc-jump-nav a {
	display: inline-block; padding: 0.35rem 0.75rem; border: 2px solid currentColor;
	font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 0.875rem; text-decoration: none; color: inherit;
}
.elsc-filter-chips a:is(:hover, :focus-visible), .elsc-jump-nav a:is(:hover, :focus-visible) { background: var(--wp--preset--color--red); border-color: var(--wp--preset--color--red); color: var(--wp--preset--color--white); }
.elsc-filter-chips .current-cat a { background: var(--wp--preset--color--offwhite); color: var(--wp--preset--color--black); border-color: var(--wp--preset--color--offwhite); }

/* Team: small cards, four to a row. */
.elsc-person { padding-block-start: 0.75rem; }
.elsc-person > * + * { margin-block-start: 0.25rem; }
.elsc-person-photo img { border-radius: 0; filter: grayscale(1); }
.elsc-person-name { font-size: 1.125rem; margin: 0; }
.elsc-person-role, .elsc-person-role p { font-size: 0.875rem; color: var(--wp--preset--color--grey-dark); margin: 0; }
.elsc-person-bio summary { font-size: 0.8125rem !important; }
.elsc-person-bio .wp-block-post-content { font-size: 0.875rem; margin-block-start: 0.5rem; }
[id] { scroll-margin-top: 1.5rem; }

/* Lists with ticks (red squares, no icons). */
.elsc-checklist { list-style: none; padding-inline-start: 0; }
.elsc-checklist li { position: relative; padding-inline-start: 1.25rem; margin-block-end: 0.35rem; }
.elsc-checklist li::before { content: ""; position: absolute; inset-inline-start: 0; top: 0.55em; width: 0.5rem; height: 0.5rem; background: var(--wp--preset--color--red); }

/* Forms (newsletter, contact). */
.elsc-form p { margin: 0 0 0.875rem; }
.elsc-form label { display: block; font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 0.9375rem; margin-block-end: 0.25rem; }
.elsc-form label span { font-weight: 600; color: var(--wp--preset--color--grey-dark); }
.elsc-form input[type=text], .elsc-form input[type=email], .elsc-form textarea {
	width: 100%; padding: 0.65rem 0.75rem; border: 2px solid var(--wp--preset--color--black); background: var(--wp--preset--color--white); font: inherit;
}
.elsc-form button { border: 0; cursor: pointer; background: var(--wp--preset--color--card-red); color: var(--wp--preset--color--offwhite); font-family: var(--wp--preset--font-family--heading); font-weight: 700; padding: 0.85em 1.4em; }
.elsc-form button:is(:hover, :focus-visible) { background: var(--wp--preset--color--black); }
.elsc-form-note { font-size: 0.8125rem; color: var(--wp--preset--color--grey-dark); }

/* Donate: form in a framed panel. */
.elsc-donate-embed { border: 3px solid var(--wp--preset--color--black); padding: 1rem; background: var(--wp--preset--color--white); max-width: 540px; }
.elsc-donate-embed iframe { display: block; margin: 0 auto; }

/* Header: two buttons; short label on small screens. */
.elsc-header .elsc-short { display: none; }
.elsc-header-buttons { gap: 0.5rem; flex-wrap: nowrap; }
.elsc-header-buttons .wp-block-button__link { padding: 0.6em 1em; font-size: 0.9375rem; white-space: nowrap; }
@media (max-width: 600px) {
	.elsc-header .elsc-long { display: none; }
	.elsc-header .elsc-short { display: inline; }
	.elsc-header-actions { gap: 0.5rem !important; }
	.elsc-header-buttons .wp-block-button__link { padding: 0.55em 0.75em; font-size: 0.875rem; }
}

/* Form fields include padding and border in their width. */
.elsc-form input, .elsc-form textarea, .elsc-form select { box-sizing: border-box; max-width: 100%; }