/*
 * Boerne Little League — layout CSS.
 *
 * Colors, type sizes and spacing are design tokens in theme.json and are used
 * here as var(--wp--preset--*). Change a token there, not here.
 * Rules from the design handoff: radius 0 everywhere, 2px section rules,
 * flush-left button labels, no shadows, black-and-white photos.
 */

/* ---------- Base ---------- */

:root {
	--bll-rule: 2px solid var(--wp--preset--color--divider);
	--bll-row-rule: 1px solid var(--wp--preset--color--neutral-300);
	/* Side padding for board rows (This week, Field status): tighter on mid-size screens so names fit. */
	--bll-board-pad: clamp(16px, 2vw, 32px);
	/* Design used text at 55% opacity; that fails WCAG AA, so muted text uses Neutral 700 (5.9:1). */
	--bll-muted: var(--wp--preset--color--neutral-700);
	--bll-ink-hover: #2f2c2a;
	--bll-header-h: 84px;
}

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--gold);
	outline-offset: 2px;
}

::selection {
	background: var(--wp--preset--color--gold-300);
	color: var(--wp--preset--color--ink);
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ---------- Buttons: flush-left labels, ink and outline variants ---------- */

.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	text-align: left;
	min-height: 44px;
	box-sizing: border-box;
}

.wp-block-button.is-style-ink .wp-block-button__link {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--gold);
}

.wp-block-button.is-style-ink .wp-block-button__link:hover {
	background: var(--bll-ink-hover);
	color: var(--wp--preset--color--gold);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: color-mix(in sRGB, var(--wp--preset--color--text) 7%, transparent);
	color: var(--wp--preset--color--text);
}

/* Outline buttons on dark grounds switch to gold on hover. */
.has-ink-background-color .wp-block-button.is-style-outline .wp-block-button__link {
	border-color: var(--wp--preset--color--neutral-600);
	color: var(--wp--preset--color--bg);
}

.has-ink-background-color .wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: transparent;
	border-color: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--gold);
}

/* ---------- Small utilities exposed as block styles ---------- */

.is-style-kicker {
	margin: 0;
	font-weight: 800;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold-700);
}

.has-ink-background-color .is-style-kicker {
	color: var(--wp--preset--color--gold);
}

.is-style-photo-bw img,
img.is-style-photo-bw {
	filter: grayscale(1) contrast(1.08);
}

.wp-block-group.is-style-rule-top {
	border-top: 2px solid var(--wp--preset--color--ink);
}

.bll-photo-placeholder {
	display: flex;
	align-items: flex-end;
	min-height: 150px;
	padding: 12px;
	background: repeating-linear-gradient(135deg, var(--wp--preset--color--neutral-300) 0 10px, var(--wp--preset--color--neutral-200) 10px 20px);
	box-sizing: border-box;
}

.bll-photo-placeholder p {
	margin: 0;
	padding: 6px 9px;
	background: var(--wp--preset--color--bg);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 11px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

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

.bll-site-header {
	background: var(--wp--preset--color--bg);
}

.bll-header {
	height: var(--bll-header-h);
	margin: 0;
	padding-left: var(--wp--preset--spacing--gutter);
	border-bottom: var(--bll-rule);
	gap: 16px;
	box-sizing: border-box;
}

.bll-header__brand {
	gap: 18px;
	flex: none;
}

.bll-header__logo img {
	display: block;
	width: auto;
	height: 64px;
}

.bll-header__caption {
	flex: none;
	width: 120px;
	margin: 0;
	padding-left: 18px;
	border-left: 1px solid var(--wp--preset--color--neutral-300);
	font-size: 11px;
	line-height: 1.5;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--bll-muted);
}

.bll-header__actions {
	gap: 10px;
	height: 100%;
}

.bll-header .bll-header__register.wp-block-buttons {
	display: none;
}

/* Full-height nav: each item is a block the height of the header. */
.bll-nav,
.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open),
.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-close,
.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-dialog,
.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-container-content,
.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container {
	height: 100%;
	align-items: stretch;
	gap: 0;
}

.bll-nav .wp-block-navigation-item {
	font-weight: 800;
	font-size: 14px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation-item {
	align-items: stretch;
}

.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation-item__content {
	display: flex;
	align-items: center;
	padding: 0 20px;
	color: var(--wp--preset--color--text);
	text-decoration: none;
	box-shadow: inset 0 -4px 0 transparent;
	transition: background-color 120ms ease;
}

.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation-item__content:hover {
	background: var(--wp--preset--color--gold-100);
}

.bll-nav .current-menu-item > .wp-block-navigation-item__content,
.bll-nav .wp-block-navigation-item__content[aria-current="page"] {
	box-shadow: inset 0 -4px 0 var(--wp--preset--color--gold) !important;
}

/* Last item: "Sponsor us" as a solid ink block. Add class "bll-nav-cta" to the link. */
.bll-nav .bll-nav-cta > .wp-block-navigation-item__content {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--gold) !important;
	padding: 0 26px !important;
}

.bll-nav .bll-nav-cta > .wp-block-navigation-item__content:hover {
	background: var(--bll-ink-hover) !important;
}

/* Hamburger + overlay */
.bll-nav .wp-block-navigation__responsive-container-open {
	width: 44px;
	height: 44px;
	align-self: center;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--wp--preset--color--divider);
}

.bll-nav .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--bg);
	color: var(--wp--preset--color--text);
	padding: 24px var(--wp--preset--spacing--gutter);
}

.bll-nav .is-menu-open .wp-block-navigation__container {
	gap: 0;
	width: 100%;
}

.bll-nav .is-menu-open .wp-block-navigation-item {
	width: 100%;
	border-bottom: var(--bll-row-rule);
	font-size: 18px;
}

.bll-nav .is-menu-open .wp-block-navigation-item__content {
	display: block;
	width: 100%;
	padding: 14px 0;
	text-decoration: none;
}

.bll-nav .is-menu-open .bll-nav-cta > .wp-block-navigation-item__content {
	margin-top: 16px;
	padding: 16px !important;
}

/* Below the nav breakpoint: compact header, Register button, hamburger. */
@media (max-width: 1099px) {
	:root {
		--bll-header-h: 64px;
	}

	.bll-header {
		padding-right: var(--wp--preset--spacing--gutter);
	}

	.bll-header__logo img {
		height: 46px;
	}

	.bll-header__caption {
		display: none;
	}

	.bll-header__actions {
		align-items: center;
	}

	.bll-header .bll-header__register.wp-block-buttons {
		display: flex;
	}

	.bll-header__register .wp-block-button__link {
		padding: 12px 16px;
		font-size: 13px;
	}

	/* Core switches to the overlay at 600px; the design needs it up to 1099px. */
	.bll-nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.bll-nav .wp-block-navigation__responsive-container:not(.hidden-by-default, .is-menu-open) {
		display: none;
	}
}

/* ---------- Main content ---------- */

/* Header, main and footer butt together; sections draw their own rules.
   Footer sits at the bottom of the window even on short pages. */
.wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	min-height: 100dvh;
}

.wp-site-blocks > * + * {
	margin-block-start: 0;
}

.wp-site-blocks > main,
.wp-site-blocks > .bll-main {
	flex: 1 0 auto;
}

.bll-main {
	margin-top: 0;
	padding-top: var(--wp--preset--spacing--80);
	padding-bottom: var(--wp--preset--spacing--80);
}

.bll-main--home,
.bll-main--full {
	padding-top: 0;
	padding-bottom: 0;
}

.bll-main > * + * {
	margin-block-start: 24px;
}

.bll-page-title {
	margin-bottom: 8px;
}

.bll-post-meta {
	gap: 12px;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.bll-post-meta a {
	color: var(--wp--preset--color--gold-700);
	text-decoration: none;
}

.bll-news-row {
	padding: 22px 0;
	border-top: 2px solid var(--wp--preset--color--ink);
}

.bll-news-row__title {
	margin: 6px 0 8px;
	font-size: var(--wp--preset--font-size--x-large);
}

.bll-news-row__title a {
	color: inherit;
	text-decoration: none;
}

.bll-news-row__title a:hover {
	color: var(--wp--preset--color--gold-700);
}

/* ---------- Home hero (1a Grid Board) ---------- */

.bll-hero {
	margin: 0;
	border-bottom: var(--bll-rule);
	gap: 0;
}

.bll-hero__statement {
	display: flex;
	flex-direction: column;
	gap: 22px;
	padding: 48px var(--wp--preset--spacing--gutter) 44px;
	border-right: var(--bll-rule);
}

.bll-hero__statement > * {
	margin: 0;
}

.bll-hero__title {
	text-wrap: balance;
}

.bll-hero__intro {
	max-width: 44ch;
	line-height: 1.55;
	text-wrap: pretty;
}

.bll-hero__actions {
	gap: 12px;
	padding-top: 4px;
}

.bll-hero__photo {
	min-height: 196px;
	margin-top: 8px;
}

/* Hero photo fills the column but never towers on wide screens. */
.wp-block-post-featured-image.bll-hero__photo {
	position: relative;
	flex: 1;
	min-height: 240px;
	max-height: 440px;
	margin-bottom: 0;
	overflow: hidden;
}

.wp-block-post-featured-image.bll-hero__photo img {
	width: 100%;
	height: 100%;
	min-height: 240px;
	max-height: 440px;
	object-fit: cover;
	object-position: center 40%;
}

.bll-hero__board {
	display: flex;
	flex-direction: column;
}

.bll-board-head {
	padding: 22px var(--bll-board-pad);
	border-bottom: var(--bll-rule);
}

.bll-board-head__title,
.bll-hero__board .bll-field-status__title {
	margin: 0;
	font-size: 20px;
	letter-spacing: 0.02em;
}

.bll-board-head__link {
	margin: 0;
}

.bll-board-head__link a {
	font-weight: 800;
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
}

.bll-board-empty {
	margin: 0;
	padding: 17px var(--bll-board-pad);
	border-bottom: var(--bll-row-rule);
	font-size: 14px;
	color: var(--bll-muted);
}

@media (max-width: 781px) {
	.bll-hero__statement {
		padding: 26px var(--wp--preset--spacing--gutter) 24px;
		gap: 16px;
		border-right: 0;
		border-bottom: var(--bll-rule);
	}

	.bll-hero__actions,
	.bll-hero__actions .wp-block-button {
		width: 100%;
	}

	.bll-hero__actions .wp-block-button__link {
		width: 100%;
		padding: 16px;
	}

	.bll-hero__photo {
		min-height: 150px;
		margin-top: 0;
	}

	/* Mobile design order: title, intro, photo, then full-width buttons. */
	.bll-hero__actions {
		order: 1;
	}

	.bll-board-head,
	.bll-board-empty {
		padding-left: 18px;
		padding-right: 18px;
	}
}

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

.bll-footer {
	margin-top: 0;
	padding: 48px var(--wp--preset--spacing--gutter) 28px;
	color: var(--wp--preset--color--neutral-300);
}

.bll-footer__cols {
	gap: 36px;
	margin-bottom: 36px;
}

.bll-footer__org > * {
	margin: 0 0 14px;
}

.bll-footer__logo img {
	display: block;
	width: auto;
	height: 74px;
}

.bll-footer__address {
	font-size: 14px;
	line-height: 1.7;
	color: var(--wp--preset--color--neutral-400);
}

.bll-footer a {
	color: var(--wp--preset--color--neutral-300);
	text-decoration: none;
}

.bll-footer a:hover {
	color: var(--wp--preset--color--gold);
}

.bll-footer__email a {
	font-size: 14px;
	color: var(--wp--preset--color--gold);
}

.bll-footer__heading {
	margin: 0 0 10px;
	font-size: 12px;
	letter-spacing: 0.12em;
	color: var(--wp--preset--color--gold);
}

.bll-footer__links {
	margin: 0;
	padding: 0;
	list-style: none;
}

.bll-footer__links li {
	margin: 0 0 10px;
	font-size: 14px;
}

.bll-footer__legal {
	padding-top: 18px;
	border-top: 1px solid var(--wp--preset--color--neutral-800);
	font-size: 12px;
	color: var(--wp--preset--color--neutral-500);
}

.bll-footer__legal p {
	margin: 0;
}

@media (max-width: 781px) {
	.bll-footer__cols {
		gap: 28px;
	}
}

/* ---------- Inner pages ---------- */

.bll-main--page {
	padding-top: 0;
}

.bll-page-hero {
	padding: 48px var(--wp--preset--spacing--gutter) 40px;
	border-bottom: var(--bll-rule);
}

.bll-page-hero > * {
	margin-block: 0;
}

.bll-page-hero > * + * {
	margin-block-start: 16px;
}

.bll-page-hero__title {
	font-size: clamp(34px, 3.6vw, 52px);
	text-wrap: balance;
}

.bll-page-hero__intro {
	max-width: 60ch;
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.55;
}

.bll-page-hero__intro .wp-block-post-excerpt__excerpt {
	margin: 0;
}

.bll-page-content {
	max-width: 1440px;
	padding: 0 var(--wp--preset--spacing--gutter);
	box-sizing: border-box;
}

.bll-page-content > :first-child {
	margin-top: 40px;
}

.bll-page-content > h2 {
	margin-top: 56px;
	margin-bottom: 16px;
}

.bll-page-content > h3 {
	margin-top: 32px;
}

/* A full-bleed section inside page content (bands, card grids). */
.bll-page-content > .alignfull {
	margin-left: calc(-1 * var(--wp--preset--spacing--gutter));
	margin-right: calc(-1 * var(--wp--preset--spacing--gutter));
}

/* ---------- Cards and grids ---------- */

.wp-block-group.is-style-card {
	padding: 18px 20px 22px;
	border-top: 2px solid var(--wp--preset--color--ink);
	background: var(--wp--preset--color--bg);
}

.wp-block-group.is-style-card > * {
	margin-block: 0;
}

.wp-block-group.is-style-card > * + * {
	margin-block-start: 8px;
}

.wp-block-group.is-style-card h3 {
	font-size: var(--wp--preset--font-size--x-large);
	letter-spacing: -0.005em;
}

.wp-block-group.is-style-card p {
	font-size: 15px;
	line-height: 1.6;
}

.bll-grid {
	gap: 24px;
}

.is-style-tag {
	display: inline-block;
	width: fit-content;
	padding: 3px 8px;
	background: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--ink);
	font-weight: 800;
	font-size: 11px !important;
	line-height: 1.4 !important;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.is-style-tag.is-closed {
	background: var(--wp--preset--color--neutral-300);
}

/* People list (board roster): role kicker over name. */
.bll-person .is-style-kicker {
	font-size: 11px;
}

.bll-person h3 {
	margin: 4px 0 0;
	text-transform: none;
	font-size: 20px;
}

/* ---------- FAQ (details) ---------- */

.wp-block-details {
	border-bottom: var(--bll-row-rule);
	padding: 0;
}

/* A run of questions hangs off a heavy rule: under its section heading,
   or on the first question when there's no heading. Works while searching too. */
h2:has(+ .wp-block-details) {
	padding-bottom: 12px;
	border-bottom: 2px solid var(--wp--preset--color--ink);
}

.wp-block-details:first-of-type:not(h2 + *) {
	border-top: 2px solid var(--wp--preset--color--ink);
}

.bll-faq-map {
	max-width: 760px;
	margin-top: 24px;
}

.wp-block-details summary {
	position: relative;
	padding: 18px 44px 18px 0;
	font-weight: 800;
	font-size: 18px;
	line-height: 1.3;
	cursor: pointer;
	list-style: none;
}

.wp-block-details summary::-webkit-details-marker {
	display: none;
}

.wp-block-details summary::after {
	content: "+";
	position: absolute;
	top: 50%;
	right: 4px;
	transform: translateY(-50%);
	font-size: 26px;
	font-weight: 400;
	color: var(--wp--preset--color--gold-700);
}

.wp-block-details[open] summary::after {
	content: "–";
}

.wp-block-details summary:hover {
	color: var(--wp--preset--color--gold-700);
}

.wp-block-details > :not(summary) {
	margin-top: 0;
	margin-bottom: 18px;
}

/* ---------- Bands ---------- */

.bll-band {
	padding: var(--wp--preset--spacing--80) var(--wp--preset--spacing--gutter);
}

.bll-band > * {
	max-width: 760px;
	margin-block: 0;
}

.bll-band > * + * {
	margin-block-start: 14px;
}

.bll-band.has-gold-background-color,
.bll-band.has-gold-background-color :where(h2, h3, p, a:not(.wp-element-button)) {
	color: var(--wp--preset--color--ink);
}

.bll-band.has-surface-background-color {
	border-top: var(--bll-rule);
	border-bottom: var(--bll-rule);
}

.bll-page-content > .bll-band:last-child {
	margin-bottom: 0;
}

/* Status rows (registration windows). */
.bll-status-row {
	padding: 16px 0;
	border-bottom: var(--bll-row-rule);
	gap: 8px 20px;
}

.bll-status-row > * {
	margin: 0;
}

.bll-status-row h3 {
	font-size: 18px;
	min-width: 220px;
}

.bll-mono {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 13px;
}

/* ---------- Embedded forms ---------- */

.bll-embed iframe {
	display: block;
	width: 100%;
	min-height: 900px;
	border: 0;
	background: var(--wp--preset--color--white);
}

.bll-page-content figure.wp-block-image img {
	height: auto;
}

/* ---------- Links list ---------- */

.bll-links {
	padding: 0;
	list-style: none;
	border-top: 2px solid var(--wp--preset--color--ink);
}

.bll-links li {
	margin: 0;
	border-bottom: var(--bll-row-rule);
}

.bll-links a {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 0;
	font-weight: 600;
	color: var(--wp--preset--color--text);
	text-decoration: none;
}

.bll-links a::after {
	content: "→";
	color: var(--wp--preset--color--gold-700);
}

.bll-links a:hover {
	color: var(--wp--preset--color--gold-700);
}

@media (max-width: 781px) {
	.bll-page-hero {
		padding-top: 28px;
		padding-bottom: 24px;
	}

	.bll-page-content > :first-child {
		margin-top: 24px;
	}

	.bll-page-content > h2 {
		margin-top: 40px;
	}

	.bll-status-row h3 {
		min-width: 0;
		width: 100%;
	}
}

/* A page that ends in a full-width band sits flush on the footer. */
.bll-main--page:has(.bll-page-content > .bll-band:last-child) {
	padding-bottom: 0;
}

/* ---------- Home: sponsor band + wall ---------- */

.bll-sponsor-band {
	gap: 24px 40px;
	padding-top: 52px;
	padding-bottom: 52px;
}

.bll-sponsor-band > * {
	max-width: none;
}

.bll-sponsor-band__text > * {
	margin-block: 0;
	max-width: 52ch;
}

.bll-sponsor-band__text h2 {
	margin: 8px 0 10px;
	font-size: clamp(26px, 3vw, 40px);
	line-height: 1.02;
	letter-spacing: -0.02em;
}

.bll-sponsor-band .is-style-kicker {
	color: var(--wp--preset--color--ink);
}

.bll-home-sponsors {
	padding: 40px var(--wp--preset--spacing--gutter) 44px;
}

.bll-home-sponsors__title {
	margin: 0 0 20px;
	font-size: 14px;
	letter-spacing: 0.12em;
	color: var(--bll-muted);
}

/* Sections in main stack flush; each draws its own rules. */
.bll-main--home > * {
	margin-block: 0;
}


/* ---------- WPForms (Lite): match the design system ----------
   WPForms exposes CSS variables; overriding them here keeps forms on-brand
   without touching the plugin. */

.wpforms-container,
.wpforms-container-full {
	--wpforms-field-border-radius: 0;
	--wpforms-button-border-radius: 0;
	--wpforms-container-border-radius: 0;
	--wpforms-field-border-color: var(--wp--preset--color--neutral-500);
	--wpforms-field-border-size: 1px;
	--wpforms-field-background-color: var(--wp--preset--color--white);
	--wpforms-field-text-color: var(--wp--preset--color--text);
	--wpforms-label-color: var(--wp--preset--color--text);
	--wpforms-label-sublabel-color: var(--wp--preset--color--neutral-700);
	--wpforms-label-error-color: #a3190c;
	--wpforms-button-background-color: var(--wp--preset--color--gold);
	--wpforms-button-background-color-alt: var(--wp--preset--color--gold);
	--wpforms-button-text-color: var(--wp--preset--color--ink);
	--wpforms-button-text-color-alt: var(--wp--preset--color--ink);
	--wpforms-button-border-size: 0;
	--wpforms-icon-choices-color: var(--wp--preset--color--gold-700);
	--wpforms-field-size-input-height: 46px;
	--wpforms-field-size-font-size: 16px;
	--wpforms-label-size-font-size: 15px;

	max-width: 760px;
	margin-left: 0 !important;
	font-family: var(--wp--preset--font-family--archivo);
}

.wpforms-container .wpforms-field-label {
	font-weight: 600 !important;
}

.wpforms-container .wpforms-field-description {
	color: var(--bll-muted) !important;
}

.wpforms-container input:focus,
.wpforms-container textarea:focus,
.wpforms-container select:focus {
	border-color: var(--wp--preset--color--ink) !important;
	box-shadow: 0 0 0 1px var(--wp--preset--color--ink) !important;
	outline: 2px solid var(--wp--preset--color--gold) !important;
	outline-offset: 2px;
}

.wpforms-container button[type="submit"] {
	padding: 15px 26px !important;
	height: auto !important;
	font-weight: 800 !important;
	font-size: 15px !important;
	letter-spacing: 0.06em;
	text-align: left;
	text-transform: uppercase;
}

.wpforms-container button[type="submit"]:hover {
	background: var(--wp--preset--color--gold-600) !important;
}

.wpforms-confirmation-container-full {
	border: 0 !important;
	border-top: 2px solid var(--wp--preset--color--ink) !important;
	border-radius: 0 !important;
	background: var(--wp--preset--color--gold-100) !important;
	color: var(--wp--preset--color--text) !important;
}

/* Zeffy embed: give the payment form room; fallback styled like a note. */
.bll-zeffy iframe {
	min-height: 0;
}

.bll-zeffy__fallback {
	margin: 0;
	padding: 18px 20px;
	border-top: 2px solid var(--wp--preset--color--ink);
	background: var(--wp--preset--color--gold-100);
	font-weight: 600;
}

/* ---------- Sponsor page: impact strip, tiers, steps ---------- */

.bll-impact {
	gap: 0;
	margin-top: 0;
	border-bottom: var(--bll-rule);
}

.bll-page-content > .bll-impact:first-child {
	margin-top: 0;
}

.bll-impact__item {
	padding: 24px 24px 26px 0;
}

.bll-impact__item + .bll-impact__item {
	padding-left: 24px;
	border-left: var(--bll-row-rule);
}

.bll-impact__item > * {
	margin: 0;
}

.bll-impact__item h3 {
	margin-bottom: 6px;
	font-size: 16px;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--gold-700);
}

.bll-impact__item p {
	font-size: 15px;
	line-height: 1.5;
}

.bll-tiers {
	gap: 24px;
	align-items: stretch;
}

.wp-block-group.bll-tier {
	display: flex;
	flex-direction: column;
	padding: 22px 24px 26px;
	border-top-width: 4px;
	background: var(--wp--preset--color--white);
}

.bll-tier h3 {
	font-size: 22px;
	letter-spacing: 0.02em;
}

.wp-block-group.is-style-card .bll-tier__price {
	margin-top: 4px;
	font-weight: 800;
	font-size: 40px;
	line-height: 1;
	letter-spacing: -0.02em;
}

.wp-block-group.is-style-card .bll-tier__meta {
	padding-bottom: 14px;
	border-bottom: var(--bll-row-rule);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 12px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold-700);
}

.bll-checklist {
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
}

.bll-checklist li {
	position: relative;
	margin: 0 0 8px;
	padding-left: 22px;
	font-size: 15px;
	line-height: 1.45;
}

.bll-checklist li::before {
	content: "";
	position: absolute;
	top: 0.45em;
	left: 0;
	width: 8px;
	height: 8px;
	background: var(--wp--preset--color--gold);
}

/* Hall of Fame: ink card with gold price. */
.wp-block-group.bll-tier--featured {
	border-top-color: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--bg);
}

.bll-tier--featured h3,
.wp-block-group.is-style-card.bll-tier--featured .bll-tier__price {
	color: var(--wp--preset--color--gold);
}

.wp-block-group.is-style-card.bll-tier--featured .bll-tier__meta {
	color: var(--wp--preset--color--gold-300);
	border-bottom-color: var(--wp--preset--color--neutral-800);
}

.bll-tier--featured .bll-checklist li {
	color: var(--wp--preset--color--neutral-200);
}

.bll-fineprint {
	font-size: 14px;
	color: var(--bll-muted);
}

.bll-steps {
	gap: 24px;
}

.bll-step {
	padding-top: 16px;
	border-top: 2px solid var(--wp--preset--color--ink);
}

.bll-step > * {
	margin: 0;
}

.bll-step > * + * {
	margin-top: 8px;
}

.bll-step__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--ink);
	font-weight: 800;
	font-size: 16px;
}

.bll-logo-note {
	max-width: 760px;
	margin-top: 32px;
}

@media (max-width: 781px) {
	.bll-impact__item,
	.bll-impact__item + .bll-impact__item {
		padding: 16px 0;
		border-left: 0;
		border-bottom: var(--bll-row-rule);
	}

	.wp-block-group.is-style-card .bll-tier__price {
		font-size: 34px;
	}
}

/* ---------- Header dropdowns (About, Play, Helpful Links) ----------
   Open on hover (and keyboard focus). Each parent is a full-height label like
   the other nav items; the small arrow beside it is a real button, so keyboard
   and touch users can open the menu too. Menus hang off a gold rule. */

.bll-nav .has-child {
	position: relative;
}

.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .has-child > .wp-block-navigation-item__content {
	padding-right: 34px;
	cursor: default;
}

.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .has-child:hover > .wp-block-navigation-item__content,
.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .has-child:focus-within > .wp-block-navigation-item__content {
	background: var(--wp--preset--color--gold-100);
}

.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .has-child > .wp-block-navigation-submenu__toggle {
	position: absolute;
	top: 50%;
	right: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	transform: translateY(-50%);
	cursor: pointer;
}

.bll-nav .has-child > .wp-block-navigation-submenu__toggle svg {
	width: 10px;
	height: 10px;
	stroke: currentColor;
}

.bll-nav .current-menu-ancestor > .wp-block-navigation-item__content {
	box-shadow: inset 0 -4px 0 var(--wp--preset--color--gold) !important;
}

.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container {
	min-width: 260px !important;
	height: auto;
	padding: 6px 0;
	border: 1px solid var(--wp--preset--color--neutral-300) !important;
	border-top: 4px solid var(--wp--preset--color--gold) !important;
	background: var(--wp--preset--color--bg) !important;
	color: var(--wp--preset--color--text);
}

.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	display: block;
	width: 100%;
	padding: 12px 20px;
	font-size: 13px;
	box-shadow: none !important;
	cursor: pointer;
}

.bll-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.bll-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible {
	background: var(--wp--preset--color--gold-100);
	color: var(--wp--preset--color--text);
}

.bll-nav .wp-block-navigation__submenu-container .current-menu-item > .wp-block-navigation-item__content {
	box-shadow: inset 4px 0 0 var(--wp--preset--color--gold) !important;
}

/* Mobile/tablet overlay: show each group as a labelled section. */
.bll-nav .is-menu-open .has-child {
	flex-direction: column;
	align-items: flex-start;
}

.bll-nav .is-menu-open .has-child > .wp-block-navigation-item__content {
	padding: 18px 0 6px !important;
	border: 0;
	background: none;
	font-size: 12px;
	letter-spacing: 0.14em;
	color: var(--wp--preset--color--gold-700);
}

.bll-nav .is-menu-open .has-child > .wp-block-navigation__submenu-icon {
	display: none;
}

.bll-nav .is-menu-open .wp-block-navigation__submenu-container {
	width: 100%;
	padding: 0 0 8px !important;
	border: 0 !important;
}

.bll-nav .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
	border-bottom: 0;
}

.bll-nav .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 10px 0 10px 14px !important;
	font-size: 16px;
	border-left: 2px solid var(--wp--preset--color--neutral-300);
}

/* Nav labels never wrap; between the hamburger breakpoint and 1280px the
   header tightens (caption hidden, narrower items) so everything fits. */
.bll-nav .wp-block-navigation-item__label {
	white-space: nowrap;
}

.bll-nav .has-child > .wp-block-navigation__submenu-icon {
	z-index: 1;
}

@media (min-width: 1100px) and (max-width: 1279px) {
	.bll-header__caption {
		display: none;
	}

	.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation-item__content {
		padding-left: 13px;
		padding-right: 13px;
	}

	.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .has-child > .wp-block-navigation-item__content {
		padding-right: 30px;
	}

	.bll-nav .wp-block-navigation__responsive-container:not(.is-menu-open) .has-child > .wp-block-navigation-submenu__toggle {
		right: 8px;
	}

	.bll-nav .bll-nav-cta > .wp-block-navigation-item__content {
		padding: 0 18px !important;
	}
}

/* In the phone/tablet menu, mark the current page with a gold bar, not an underline. */
.bll-nav .is-menu-open .current-menu-item > .wp-block-navigation-item__content,
.bll-nav .is-menu-open .wp-block-navigation-item__content[aria-current="page"] {
	box-shadow: inset 4px 0 0 var(--wp--preset--color--gold) !important;
	padding-left: 14px !important;
}

/* ---------- Page width ----------
   Sections use the full page width (up to 1440px, like the homepage).
   Only running text is held to a readable line length. */

.bll-page-content > p,
.bll-page-content > ul:not(.bll-links),
.bll-page-content > ol,
.bll-page-content > .wp-block-list:not(.bll-links) {
	max-width: 72ch;
}

.bll-page-content > .bll-links,
.bll-page-content > .wpforms-container,
.bll-page-content > .wp-block-image:not(.alignwide, .alignfull) {
	max-width: 760px;
}

/* ---------- FAQ: open Q&A, topic column on the left ----------
   Desktop: topic heading stays in view on the left while its answers read
   down the right. Phones/tablets: one column. */

.bll-faq-section {
	display: grid;
	grid-template-columns: minmax(220px, 1fr) minmax(0, 2.2fr);
	gap: 0 56px;
	margin-top: 56px;
	padding-top: 20px;
	border-top: 2px solid var(--wp--preset--color--ink);
}

.bll-faq-section > h2 {
	position: sticky;
	top: 24px;
	align-self: start;
	margin: 0;
	padding: 0;
	border: 0;
	font-size: clamp(22px, 2.2vw, 32px);
}

.bll-faq-section__list {
	margin: 0;
}

.bll-qa {
	margin: 0;
	padding: 22px 0 24px;
	border-bottom: var(--bll-row-rule);
	scroll-margin-top: 24px;
}

.bll-faq-section__list > .bll-qa:first-child {
	padding-top: 0;
}

.bll-qa > * {
	max-width: 68ch;
	margin-block: 0;
}

.bll-qa > * + * {
	margin-block-start: 10px;
}

.bll-qa__q {
	font-size: 20px;
	line-height: 1.25;
	letter-spacing: -0.005em;
	text-transform: none;
}

.bll-qa p,
.bll-qa li {
	font-size: 16px;
	line-height: 1.6;
}

.bll-qa ul {
	padding-left: 20px;
}

/* Arriving from a link like /faq/#refunds: gold bar marks the answer. */
.bll-qa:target {
	margin-left: -16px;
	padding-left: 12px;
	box-shadow: inset 4px 0 0 var(--wp--preset--color--gold);
}

.bll-qa .bll-faq-map {
	max-width: 640px;
	margin-top: 16px;
}

@media (max-width: 1099px) {
	.bll-faq-section {
		grid-template-columns: 1fr;
		margin-top: 40px;
	}

	.bll-faq-section > h2 {
		position: static;
		margin-bottom: 20px;
	}
}

/* `hidden` must win over layout display values (grid/flex) set above. */
.bll-page-content [hidden] {
	display: none !important;
}

/* ---------- Contact: form + direct inboxes ---------- */

.bll-contact {
	margin-top: 40px;
}

.bll-contact h2 {
	margin-top: 0;
	margin-bottom: 20px;
	font-size: var(--wp--preset--font-size--x-large);
	letter-spacing: 0.02em;
}

.bll-contact__side {
	padding-top: 20px;
	border-top: 2px solid var(--wp--preset--color--ink);
}

.bll-contact__side h3 {
	margin: 28px 0 10px;
	font-size: 16px;
	letter-spacing: 0.06em;
}

.bll-inboxes {
	margin: 0;
	padding: 0;
	list-style: none;
}

.bll-inboxes li {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 12px 0;
	border-bottom: var(--bll-row-rule);
}

.bll-inboxes strong {
	font-weight: 800;
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold-700);
}

.bll-inboxes a {
	overflow-wrap: anywhere;
}

/* Wide black-and-white photo strip at the top of a page section. */
.bll-section-photo {
	margin: 0 0 24px;
}

.bll-page-content figure.bll-section-photo img {
	display: block;
	width: 100%;
	height: clamp(180px, 22vw, 320px);
	object-fit: cover;
	object-position: center 35%;
}

/* Title on the hero photo (the image's caption), styled like the design's photo labels. */
.bll-hero__caption {
	position: absolute;
	left: 12px;
	bottom: 12px;
	margin: 0;
	padding: 8px 12px;
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--gold);
	font-weight: 800;
	font-size: 13px;
	line-height: 1.2;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

/* ---------- In-house rules pages ---------- */

/* At-a-glance tiles: the numbers everyone asks about. */
.bll-glance {
	gap: 0;
	margin-top: 40px;
	border-top: 2px solid var(--wp--preset--color--ink);
	border-left: var(--bll-row-rule);
}

.bll-glance__item {
	padding: 14px 16px 16px;
	border-right: var(--bll-row-rule);
	border-bottom: var(--bll-row-rule);
	background: var(--wp--preset--color--white);
}

.bll-glance__item > * {
	margin: 0;
}

.bll-glance__label {
	font-weight: 800;
	font-size: 11px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold-700);
}

.bll-glance__value {
	margin-top: 4px !important;
	font-weight: 800;
	font-size: 17px;
	line-height: 1.25;
}

/* Rules: one rule per row, easy to scan and to point at. */
.bll-rules-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.bll-rules-list > li {
	position: relative;
	margin: 0;
	padding: 12px 0 12px 22px;
	border-bottom: var(--bll-row-rule);
	font-size: 16px;
	line-height: 1.55;
}

.bll-rules-list > li::before {
	content: "";
	position: absolute;
	top: 1.15em;
	left: 0;
	width: 8px;
	height: 8px;
	background: var(--wp--preset--color--gold);
}

.bll-rules-list ul {
	margin: 6px 0 0;
	padding-left: 18px;
	list-style: disc;
}

.bll-rules-list ul li {
	margin: 4px 0;
	font-size: 15px;
}

.bll-faq-section__list > .bll-rules-list + .bll-rules-list,
.bll-faq-section__list > .bll-rules-table + .bll-rules-list {
	margin-top: 16px;
}

.bll-faq-section__list h3 {
	margin: 28px 0 4px;
	font-size: 17px;
	letter-spacing: 0.02em;
}

.bll-rules-table {
	margin: 0 0 16px;
}

.bll-rules-table table {
	border-collapse: collapse;
	width: 100%;
	max-width: 560px;
	background: var(--wp--preset--color--white);
}

.bll-rules-table th,
.bll-rules-table td {
	padding: 10px 14px;
	border: var(--bll-row-rule);
	text-align: left;
	font-size: 15px;
}

.bll-rules-table thead th {
	border-bottom: 2px solid var(--wp--preset--color--ink);
	font-weight: 800;
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.bll-faq-search--topics .bll-faq-search__topics ul {
	margin-top: 24px;
}

@media print {
	/* Managers print rules for the dugout. */
	.bll-site-header,
	.bll-footer,
	.bll-faq-search,
	.bll-announcement {
		display: none !important;
	}

	.bll-faq-section {
		display: block;
		break-inside: avoid-page;
	}

	.bll-faq-section > h2 {
		position: static;
	}
}

/* Rules note: last-updated date + "Little League rules apply" fallback. */
.bll-rules-note {
	margin-top: 40px;
	padding: 14px 18px;
	border-left: 4px solid var(--wp--preset--color--gold);
	background: var(--wp--preset--color--gold-100);
}

.bll-rules-note > * {
	margin: 0;
}

.bll-rules-note > * + * {
	margin-top: 4px;
}

.bll-rules-note__updated {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 12px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--neutral-700);
}

.bll-rules-note + .bll-glance {
	margin-top: 16px;
}

/* External links (marked by bll-core) open in a new tab: show a small arrow,
   announced to screen readers as "(opens in a new tab)". Image links (sponsor
   logos) get the spoken cue only. */
a.bll-external::after {
	content: "\2197" / "(opens in a new tab)";
	display: inline-block;
	margin-inline-start: 0.2em;
	font-size: 0.85em;
	line-height: 1;
	text-decoration: none;
}

a.bll-external:has(img, svg)::after {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}
