/* ============================================================
 * Section Builder — base layout (always loaded)
 * Only structural rules live here. All visual styling is in the
 * per-entry "Custom CSS" field, pre-filled from default-theme.css.
 * ============================================================ */

.sb-layout {
	color: inherit;
}

/* Sticky nav — visual styling overridden by the per-entry CSS. */
.sb-nav {
	position: sticky;
	top: 0;
	z-index: 50;
	background: #fff;
}

.sb-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
}

.sb-nav a {
	display: inline-block;
	text-decoration: none;
}

/* Sections stack vertically; anchor jumps land below the sticky nav. */
.sb-section {
	padding: 48px 16px;
	scroll-margin-top: 80px;
}

.sb-section-inner {
	max-width: 1100px;
	margin: 0 auto;
}

/* Media defaults so images don't overflow the container. */
.sb-image,
.sb-gallery-item {
	max-width: 100%;
	height: auto;
}

.sb-gallery {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 12px;
}

.sb-section--embed iframe {
	width: 100%;
	aspect-ratio: 16 / 9;
	border: 0;
}