/* Narrow desktop — hamburger before the 9-item nav crowds. */
@media (max-width: 1239px) {
	.primary-nav {
		display: none;
	}

	.menu-toggle {
		display: grid;
		place-items: center;
	}

	.wwb-announce-social {
		display: none;
	}

	.footer-grid {
		grid-template-columns: 1fr 1fr;
	}
}

/* Four action cards need ~280px each. 2×2 until that width exists. */
@media (max-width: 1359px) {
	.action-grid,
	.facts-grid {
		grid-template-columns: 1fr 1fr;
	}

	.action-card-cta .btn {
		white-space: normal;
		height: auto;
		min-height: 50px;
	}

	.home-hero {
		min-height: min(70vh, 720px);
	}

	.home-hero > *,
	.action-card,
	.split-panel,
	.choice-card,
	.page-hero-media,
	.footer-grid > * {
		min-width: 0;
	}
}

/*
 * Two-column editorial layouts: stack before columns go skinny.
 * Measured: 1100 still comfortable; 1000 and below makes the hero photo
 * a ~420×688 strip and Sponsor/Partner headings feel squeezed.
 */
@media (max-width: 1099px) {
	.home-hero,
	.calendar-teaser,
	.page-hero-grid,
	.page-hero-grid.calendar-hero,
	.about-hero .page-hero-grid,
	.choice-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.calendar-hero {
		justify-items: center;
		text-align: center;
	}

	.calendar-hero-copy {
		width: 100%;
	}

	.calendar-hero .calendar-mock {
		width: min(100%, 300px);
		height: auto;
		max-height: none;
		aspect-ratio: 11 / 28;
		margin-inline: auto;
		margin-top: 40px;
	}

	.home-hero {
		min-height: 0;
	}

	.home-hero-media {
		width: 100%;
		max-width: 100%;
		min-width: 0;
		min-height: 220px;
		max-height: min(42vh, 360px);
		aspect-ratio: 16 / 11;
	}

	.about-hero .page-hero-media .photo-frame--full img {
		width: 100%;
		height: auto;
	}

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

	.split-panels {
		grid-template-columns: minmax(0, 1fr);
		gap: 64px;
		min-height: 0;
		padding-block: 48px 72px;
		align-content: start;
	}

	.split-panel,
	.split-panel-copy {
		align-items: flex-start;
	}
}

@media (max-width: 767px) {
	.contact-photo-block {
		aspect-ratio: 2.5 / 1;
	}

	.contact-photo-block img,
	.contact-photo-img {
		object-position: center 92%;
	}

	.action-grid,
	.facts-grid,
	.footer-grid {
		grid-template-columns: 1fr;
	}

	.action-card {
		height: auto;
		min-height: 0;
	}

	.action-card-content {
		flex: 0 1 auto;
	}

	.action-card-cta .btn {
		height: auto;
		min-height: 44px;
		white-space: normal;
	}

	.btn {
		width: calc(100% - 8px);
		max-width: calc(100% - 8px);
		white-space: normal;
		min-height: 44px;
	}

	.wwb-cookie {
		left: var(--wwb-gutter);
		right: var(--wwb-gutter);
		max-width: none;
	}

	.calendar-teaser-actions .btn,
	.error-404-actions .btn,
	.wwb-cookie-actions .btn {
		width: auto;
	}

	.footer-base {
		flex-direction: column;
	}

	.footer-base a {
		margin-left: 0;
		margin-right: 14px;
	}

	.footer-logo {
		max-width: 100%;
		gap: 8px;
	}

	.footer-logo-mark {
		font-size: 2.05rem;
	}

	.footer-logo-divider {
		height: 1.5rem;
	}

	.footer-logo-who,
	.footer-logo-build {
		font-size: 0.7rem;
	}

	.home-hero-copy {
		padding-top: 40px;
		padding-bottom: 28px;
	}

	.wwb-media-page .page-hero {
		padding-top: 40px;
		padding-bottom: 24px;
	}

	.wwb-media-coming-soon__inner {
		min-height: 420px;
		padding-top: 40px;
		padding-bottom: 72px;
	}

	.wwb-media-coming-soon__title {
		font-size: clamp(3.25rem, 18vw, 5.5rem);
		line-height: 0.86;
	}
}

@media (max-width: 430px) {
	.hero-title {
		font-size: clamp(2.8rem, 14vw, 4.2rem);
	}

	.page-title {
		font-size: clamp(2.6rem, 12vw, 3.6rem);
	}

	.statement-band h2,
	.statement-band .section-title {
		font-size: clamp(2.1rem, 11vw, 3.4rem);
	}

	.page-hero {
		padding-top: 40px;
		padding-bottom: 28px;
	}

	.section {
		padding-block: clamp(44px, 10vw, 72px);
	}

	.action-card {
		padding-inline: 2px;
	}

	.legal-page .page-title {
		font-size: clamp(2.7rem, 14vw, 3.4rem);
		max-width: none;
	}

	.legal-body p,
	.legal-body li {
		font-size: 1.02rem;
		line-height: 1.7;
	}

	.legal-contact {
		padding: 22px;
	}

	.wwb-announce p {
		letter-spacing: 0.06em;
	}

	.wwb-media-coming-soon__title {
		font-size: clamp(3rem, 17vw, 4.2rem);
	}
}

/*
 * Phone landscape only. max-width 899px is required so short laptop
 * windows (900–1099 × ~600–700) keep the stacked hero from the 1099px rule.
 */
@media (max-height: 667px) and (orientation: landscape) and (max-width: 899px) {
	.home-hero {
		min-height: min(260px, 100svh);
		max-height: min(300px, 100svh);
		grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
		align-items: stretch;
		overflow: hidden;
	}

	.home-hero-copy {
		padding-block: 10px 12px;
		min-height: 0;
		overflow: hidden;
		justify-content: center;
	}

	.home-hero-copy .hero-title {
		font-size: clamp(1.85rem, 9vh, 3.1rem);
		margin-bottom: 6px;
	}

	.hero-statement {
		font-size: clamp(0.92rem, 3.2vh, 1.25rem);
		margin-bottom: 6px;
	}

	.hero-support {
		margin-bottom: 6px;
		font-size: 0.88rem;
	}

	.hero-categories {
		font-size: 0.62rem;
		line-height: 1.35;
		margin-bottom: 10px;
		max-height: 2.7em;
		overflow: hidden;
	}

	.home-hero-copy .btn {
		min-height: 40px;
		height: 40px;
	}

	.home-hero-media {
		min-height: 0;
		max-height: none;
		height: auto;
		align-self: stretch;
		aspect-ratio: auto;
	}

	.contact-photo-block {
		aspect-ratio: 2.55 / 1;
	}

	.contact-photo-block img,
	.contact-photo-img {
		object-position: center 93%;
	}

	.wwb-media-coming-soon__inner {
		min-height: 260px;
		padding-top: 32px;
		padding-bottom: 48px;
	}

	.wwb-media-coming-soon__title {
		font-size: clamp(3rem, 10vw, 6rem);
	}

	.split-panels {
		min-height: 0;
		padding-block: 32px 40px;
		gap: clamp(32px, 6vw, 64px);
	}
}

@media (max-height: 500px) and (orientation: landscape) and (max-width: 899px) {
	.home-hero {
		min-height: min(260px, 100svh);
		max-height: min(300px, 100svh);
		grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
	}

	.home-hero-copy {
		padding-block: 8px 10px;
	}

	.home-hero-copy .hero-title {
		font-size: clamp(1.7rem, 8.5vh, 2.8rem);
	}

	.hero-categories {
		display: none;
	}

	.home-hero-media {
		min-height: 0;
		max-height: none;
		aspect-ratio: auto;
	}

	.wwb-media-coming-soon__inner {
		min-height: 220px;
		padding-top: 24px;
		padding-bottom: 40px;
	}

	.wwb-media-coming-soon__title {
		font-size: clamp(2.8rem, 9vw, 5.2rem);
	}

	.split-panels {
		min-height: 0;
		padding-block: 24px 32px;
	}
}

@media (min-width: 1920px) {
	.home-hero {
		min-height: 820px;
	}

	.action-card p {
		max-width: 36ch;
	}

	.wwb-media-coming-soon__inner {
		min-height: 640px;
	}

	.wwb-media-coming-soon__title {
		font-size: clamp(8rem, 8vw, 10rem);
	}
}

@media (min-width: 2200px) {
	:root {
		--wwb-container: 1600px;
	}
}

/*
 * Narrow laptop lock. Must stay last so no height/orientation query can
 * restore two columns between 900px and 1099px.
 */
@media (min-width: 900px) and (max-width: 1099px) {
	.home-hero {
		grid-template-columns: minmax(0, 1fr);
		min-height: 0;
		max-height: none;
		overflow: visible;
		align-items: stretch;
	}

	.home-hero-copy {
		overflow: visible;
		padding-block: clamp(32px, 5vw, 56px);
	}

	.home-hero-media {
		width: 100%;
		max-width: 100%;
		min-width: 0;
		min-height: 220px;
		max-height: min(42vh, 360px);
		aspect-ratio: 16 / 11;
		align-self: stretch;
	}
}