/*
 * Mobile-first responsive layer.
 *
 * Base rules target narrow viewports. Enhancements are introduced with
 * min-width queries so larger layouts do not define the mobile experience.
 */

html {
	overflow-x: clip;
	-webkit-text-size-adjust: 100%;
}

body {
	min-width: 20rem;
	overflow-wrap: break-word;
}

.bb-shell,
.bb-header__inner,
.bb-footer__inner,
.bb-site {
	width: min(calc(100% - 2rem), var(--bb-shell));
}

a,
button,
input,
select,
textarea {
	touch-action: manipulation;
}

.bb-button,
.bb-field-button,
.bb-menu-toggle {
	min-height: 2.75rem;
	align-items: center;
	justify-content: center;
}

.bb-header__inner {
	min-height: 4.5rem;
	gap: 0.75rem;
}

.bb-brand {
	min-width: 0;
	gap: 0.5rem;
}

.bb-brand__mark {
	width: 3rem;
	height: 3rem;
}

.bb-brand__name {
	font-size: clamp(1.2rem, 5vw, 1.5rem);
}

.bb-brand__tagline {
	display: none;
}

.bb-menu-toggle {
	display: inline-flex;
	flex: 0 0 auto;
}

.bb-nav {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	border-bottom: 1px solid var(--bb-border);
	padding: 0.75rem 1rem 1rem;
	background: var(--bb-white);
	box-shadow: 0 0.75rem 1.5rem rgb(3 61 80 / 14%);
}

.bb-nav.is-open {
	display: block;
}

.bb-nav ul {
	display: grid;
	gap: 0;
}

.bb-nav a {
	display: flex;
	min-height: 2.75rem;
	align-items: center;
	border-bottom: 1px solid var(--bb-border);
}

.bb-nav li:last-child a {
	border-bottom: 0;
}

.bb-parent-hero {
	padding-block: 2.5rem 3rem;
}

.bb-parent-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 2rem;
}

.bb-parent-logo {
	width: min(72vw, 18rem);
	margin-inline: auto;
	padding: 0.75rem;
	box-shadow: 0.65rem 0.65rem 0 var(--bb-yellow);
}

.bb-parent-hero__copy h1 {
	font-size: clamp(3rem, 15vw, 4.75rem);
}

.bb-parent-entrances {
	padding-block: 3rem;
	background: var(--bb-white);
}

.bb-parent-entrances__grid,
.bb-card-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 1rem;
}

.bb-hero__grid,
.bb-apiary-hero__grid,
.bb-willow-hero__grid {
	grid-template-columns: minmax(0, 1fr);
}

.bb-master-logo,
.bb-section-logo {
	width: min(78%, 24rem);
	margin-inline: auto;
}

.bb-card {
	min-height: 13rem;
}

.bb-entrance {
	min-height: 17rem;
	padding: 1.5rem;
}

.bb-entrance strong {
	font-size: clamp(2rem, 9vw, 2.8rem);
}

/* Venture section navigation is owned by venture-nav.css. */

.bb-apiary-feature {
	min-height: 36rem;
}

.bb-apiary-feature__media {
	background-position: 62% center;
}

.bb-apiary-feature::before {
	background: linear-gradient(90deg, rgb(3 61 80 / 94%), rgb(3 61 80 / 60%));
}

.bb-apiary-feature__copy {
	padding-block: 4.5rem 7rem;
}

.bb-apiary-feature h1 {
	font-size: clamp(3.5rem, 17vw, 5.5rem);
}

.bb-home-hero__actions,
.bb-field-hero__actions {
	align-items: stretch;
	flex-direction: column;
}

.bb-home-hero__actions > *,
.bb-field-hero__actions > * {
	width: 100%;
}

.bb-intro,
.bb-pathways,
.bb-apiary-page__content,
.bb-apiary-stories,
.bb-page-content {
	padding-block: 3rem;
}

.bb-intro__grid,
.bb-pathway {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 1rem;
}

.bb-pathway {
	padding: 1.5rem;
}

.bb-apiary-stories__grid,
.bb-beekeepers__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
}



.bb-field-hero__inner,
.bb-field-intro__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
}

.bb-field-hero__inner {
	min-height: 0;
	gap: 1rem;
}

.bb-field-hero__copy {
	padding-block: 4rem 1rem;
}

.bb-field-hero h1 {
	font-size: clamp(3.25rem, 15vw, 5.25rem);
}

.bb-field-hero__art,
.bb-farm-plan {
	min-height: 22rem;
}

.bb-field-intro {
	padding-block: 3.5rem;
}

.bb-field-intro__grid {
	gap: 1.5rem;
}

.bb-field-intro__grid > div:last-child {
	border-top: 0.45rem solid var(--bb-field-yellow);
	border-left: 0;
	padding: 1.5rem 0 0;
}

.bb-footer__inner {
	align-items: flex-start;
	flex-direction: column;
}

img,
video,
iframe {
	max-width: 100%;
}

iframe {
	width: 100%;
}

@media (min-width: 30rem) {
	.bb-brand__tagline {
		display: block;
	}

	.bb-home-hero__actions,
	.bb-field-hero__actions {
		align-items: center;
		flex-direction: row;
	}

	.bb-home-hero__actions > *,
	.bb-field-hero__actions > * {
		width: auto;
	}
}

@media (min-width: 48.01rem) {
	.bb-menu-toggle {
		display: none;
	}

	.bb-nav {
		display: block;
	position: static;
	width: auto;
	border: 0;
	padding: 0;
	background: transparent;
	box-shadow: none;
	}

	.bb-nav ul {
		display: flex;
	align-items: center;
	gap: 1.5rem;
	}

	.bb-nav a {
	min-height: 2.75rem;
	border: 0;
	}

	.bb-footer__inner {
		align-items: center;
		flex-direction: row;
	}

	.bb-parent-hero__inner {
		grid-template-columns: minmax(16rem, 0.8fr) minmax(0, 1.2fr);
		gap: clamp(2rem, 7vw, 7rem);
	}

	.bb-parent-logo {
		width: min(100%, 27rem);
	}


	.bb-intro__grid {
		grid-template-columns: 0.7fr 1.3fr;
		gap: clamp(2rem, 8vw, 8rem);
	}

	.bb-apiary-stories__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.bb-field-hero__inner {
		min-height: clamp(38rem, 76vh, 50rem);
		grid-template-columns: minmax(0, 1.08fr) minmax(18rem, 0.92fr);
		gap: clamp(2rem, 7vw, 7rem);
	}

	.bb-field-hero__copy {
		padding-block: 6rem;
	}

	.bb-field-intro__grid {
		grid-template-columns: 0.85fr 1.15fr;
		gap: clamp(2rem, 8vw, 8rem);
	}

	.bb-field-intro__grid > div:last-child {
		border-top: 0;
		border-left: 0.45rem solid var(--bb-field-yellow);
		padding: 0 0 0 2rem;
	}

}

@media (min-width: 62rem) {
	.bb-parent-entrances__grid,
	.bb-card-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.bb-parent-entrances {
		padding-block: clamp(4rem, 9vw, 8rem);
		background:
			linear-gradient(90deg, var(--bb-yellow) 0 33.333%, var(--bb-gold) 33.333% 66.666%, var(--bb-stone) 66.666%);
		background-size: 100% 0.55rem;
		background-repeat: no-repeat;
	}

	.bb-entrance {
		min-height: 28rem;
		padding: clamp(1.5rem, 4vw, 3rem);
	}

	.bb-apiary-feature__copy {
		padding-block: 7rem 9rem;
	}
}

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


/* Image-led homepage venture gateways. */
.bb-entrance,
.bb-entrance--apiary,
.bb-entrance--willow,
.bb-entrance--homestead {
	position: relative;
	isolation: isolate;
	min-height: 24rem;
	overflow: hidden;
	justify-content: flex-end;
	border: 0;
	background: var(--bb-teal);
	box-shadow: 0 1.5rem 3.5rem rgb(3 61 80 / 18%);
	color: var(--bb-white);
}

.bb-entrance::after {
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(to bottom, rgb(3 61 80 / 5%) 10%, rgb(3 61 80 / 55%) 50%, rgb(3 61 80 / 96%) 100%);
	content: "";
}

.bb-entrance__media {
	position: absolute;
	inset: 0;
	z-index: -2;
}

.bb-entrance__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 350ms ease;
}

.bb-entrance--apiary .bb-entrance__media img,
.bb-entrance--willow .bb-entrance__media img,
.bb-entrance--homestead .bb-entrance__media img {
	object-position: center center;
}

.bb-entrance > :not(.bb-entrance__media) {
	position: relative;
	z-index: 1;
}

.bb-entrance__number {
	position: absolute !important;
	top: 1.25rem;
	right: 1.25rem;
	color: rgb(255 255 255 / 82%);
	font-size: 3rem;
	text-shadow: 0 0.1rem 0.8rem rgb(3 61 80 / 45%);
}

.bb-entrance .bb-eyebrow {
	color: var(--bb-yellow);
	font-weight: 700;
	text-shadow: 0 0.1rem 0.8rem rgb(3 61 80 / 55%);
}

.bb-entrance strong {
	margin: 0.65rem 0 1.2rem;
	padding: 0;
	color: var(--bb-white);
	text-wrap: balance;
	text-shadow: 0 0.15rem 1rem rgb(3 61 80 / 55%);
}

.bb-entrance__link {
	align-self: flex-start;
	min-height: 2.75rem;
	color: var(--bb-white);
}

.bb-entrance:hover .bb-entrance__media img,
.bb-entrance:focus-visible .bb-entrance__media img {
	transform: scale(1.035);
}

.bb-entrance:focus-visible {
	outline: 0.2rem solid var(--bb-yellow);
	outline-offset: 0.25rem;
}

@media (min-width: 48.01rem) {
	.bb-entrance {
		min-height: 28rem;
	}
}

@media (min-width: 62rem) {
	.bb-entrance {
		min-height: 34rem;
	}

	.bb-entrance__number {
		font-size: 4rem;
	}
}