/*
Theme Name: Storybook Homes NJ
Theme URI: https://storybookhomesnj.local
Author: Storybook Homes NJ
Description: Custom hand-coded theme for Storybook Homes NJ, a New Jersey custom home builder and developer.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: storybook-homes
*/

/* ==========================================================================
   Design tokens
   ========================================================================== */
:root {
	--charcoal: #15140f;
	--charcoal-soft: #201d18;
	--forest: #15140f;
	--forest-soft: #201d18;
	--cream: #f1e6e0;
	--cream-deep: #ece3d4;
	--gold: #c9a35a;
	--gold-soft: #d9bc84;
	--gold-deep: #7a5c26;
	--ink: #201d18;
	--paper: #f4efe6;
	--muted: #a9a08e;
	--muted-dark: #5f5747;
	--line: rgba(32, 29, 24, 0.12);
	--line-light: rgba(244, 239, 230, 0.18);

	--font-display: 'Playfair Display', Georgia, serif;
	--font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

	--container: 1180px;
}

/* ==========================================================================
   Reset & base
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
	margin: 0;
	font-family: var(--font-body);
	color: var(--ink);
	background: var(--cream);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
	outline: 2px solid var(--gold);
	outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.reveal { transition: none; }
}
ul { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: 600; margin: 0; line-height: 1.15; }
p { margin: 0 0 1em; }
.sbh-container { max-width: var(--container); margin: 0 auto; padding: 0 32px; }

/* ==========================================================================
   Reveal-on-scroll animation
   ========================================================================== */
.reveal {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.8s ease, transform 0.8s ease;
}
.reveal.is-visible { opacity: 1; transform: translateY(0); }

/* ==========================================================================
   Buttons
   ========================================================================== */
.sbh-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 15px 30px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	border-radius: 2px;
	border: 1px solid transparent;
	transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
	white-space: nowrap;
}
.sbh-btn--gold { background: var(--gold); color: var(--charcoal); }
.sbh-btn--gold:hover { background: var(--gold-soft); transform: translateY(-2px); }
.sbh-btn--ghost-light { border-color: var(--line-light); color: var(--paper); }
.sbh-btn--ghost-light:hover { border-color: var(--gold); color: var(--gold); transform: translateY(-2px); }
.sbh-btn--gold-outline { border-color: var(--gold); color: var(--gold); padding: 13px 26px; }
.sbh-btn--gold-outline:hover { background: var(--gold); color: var(--charcoal); }
.sbh-btn--forest { background: var(--forest); color: var(--paper); padding: 13px 26px; }
.sbh-btn--forest:hover { background: var(--forest-soft); transform: translateY(-2px); }
.sbh-btn--wide { width: 100%; padding: 17px 30px; }

/* ==========================================================================
   Eyebrow labels / headings
   ========================================================================== */
.sbh-eyebrow {
	font-family: var(--font-body);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--gold-deep);
	margin: 0 0 18px;
}
.sbh-eyebrow--light { color: var(--gold); }
.sbh-h2 { font-size: clamp(28px, 4vw, 42px); color: var(--ink); }
.sbh-h2--light { color: var(--paper); }
.sbh-h2 em, .sbh-hero__title, .sbh-page-hero__title { font-style: italic; }

/* ==========================================================================
   Nav
   ========================================================================== */
.sbh-nav {
	position: fixed;
	top: 0; left: 0; right: 0;
	z-index: 100;
	background: rgba(21, 20, 15, 0.55);
	backdrop-filter: blur(8px);
	transition: background 0.3s ease;
}
.admin-bar .sbh-nav { top: 32px; }
@media (max-width: 782px) {
	.admin-bar .sbh-nav { top: 46px; }
}
.sbh-nav.is-scrolled { background: rgba(21, 20, 15, 0.92); }
.sbh-nav__inner {
	position: relative;
	max-width: 1440px;
	margin: 0 auto;
	padding: 14px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: nowrap;
}
.sbh-nav__logo img { height: 56px; width: auto; }
.sbh-nav__links {
	display: flex;
	gap: 14px;
	flex-wrap: nowrap;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
.sbh-nav__links a {
	color: var(--paper);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	white-space: nowrap;
	transition: color 0.2s ease;
	position: relative;
}
.sbh-nav__links a:hover { color: var(--gold); }
.sbh-nav__cta { display: flex; align-items: center; gap: 12px; flex-wrap: nowrap; }
.sbh-nav__phone { color: var(--paper); font-size: 11px; font-weight: 500; white-space: nowrap; }
.sbh-nav__cta .sbh-btn { padding: 10px 14px; font-size: 10px; white-space: nowrap; }
.sbh-nav__phone:hover { color: var(--gold); }
.sbh-nav__toggle {
	display: none;
	flex-direction: column;
	gap: 5px;
	background: none;
	border: none;
	padding: 8px;
}
.sbh-nav__toggle span { width: 22px; height: 2px; background: var(--paper); }
.sbh-nav__mobile {
	display: none;
	flex-direction: column;
	padding: 10px 32px 24px;
	gap: 4px;
	background: rgba(21, 20, 15, 0.97);
}
.sbh-nav__mobile a {
	color: var(--paper);
	padding: 12px 0;
	border-bottom: 1px solid var(--line-light);
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}
.sbh-nav__mobile.is-open { display: flex; }

/* ==========================================================================
   Hero (home)
   ========================================================================== */
.sbh-hero {
	position: relative;
	min-height: 92vh;
	background-size: cover;
	background-position: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	color: var(--paper);
	overflow: hidden;
}
.sbh-hero__overlay {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(10,9,7,0.82) 0%, rgba(10,9,7,0.72) 45%, rgba(10,9,7,0.94) 100%);
}
.sbh-hero__content {
	position: relative;
	z-index: 2;
	max-width: 720px;
	margin: 0 auto;
	padding: 160px 32px 80px;
	text-align: center;
}
.sbh-hero__title {
	font-size: clamp(44px, 8vw, 88px);
	margin: 10px 0 24px;
	text-shadow: 0 2px 24px rgba(0,0,0,0.5);
}
.sbh-hero__lead { font-size: 18px; color: var(--cream-deep); max-width: 560px; margin: 0 auto 36px; text-shadow: 0 1px 12px rgba(0,0,0,0.6); }
.sbh-hero__actions { display: flex; gap: 20px; justify-content: center; flex-wrap: wrap; }

.sbh-stat-strip {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	background: rgba(21, 20, 15, 0.85);
	border-top: 1px solid var(--line-light);
}
.sbh-stat { text-align: center; padding: 28px 12px; border-right: 1px solid var(--line-light); }
.sbh-stat:last-child { border-right: none; }
.sbh-stat span { display: block; font-family: var(--font-display); font-size: clamp(24px, 3vw, 34px); color: var(--gold); }
.sbh-stat small { font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }

/* ==========================================================================
   Page hero (interior pages)
   ========================================================================== */
.sbh-page-hero {
	position: relative;
	background-color: var(--forest);
	background-size: cover;
	background-position: center;
	color: var(--paper);
	padding: 170px 32px 90px;
	text-align: center;
	overflow: hidden;
}
.sbh-page-hero__overlay {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(10,9,7,0.88) 0%, rgba(10,9,7,0.88) 45%, rgba(10,9,7,0.94) 100%);
}
.sbh-page-hero > div { position: relative; z-index: 2; max-width: 720px; margin: 0 auto; }
.sbh-page-hero__title { font-size: clamp(36px, 6vw, 58px); margin: 10px 0 20px; text-shadow: 0 2px 20px rgba(0,0,0,0.55); }
.sbh-page-hero__lead { font-size: 17px; color: var(--cream-deep); text-shadow: 0 1px 12px rgba(0,0,0,0.6); }

/* ==========================================================================
   Sections
   ========================================================================== */
.sbh-section { padding: 100px 32px; }
.sbh-section--cream { background: var(--cream); }
.sbh-section--dark { background: var(--forest); color: var(--paper); }
.sbh-section--forest { background: var(--forest); color: var(--paper); }
.sbh-section--contact-teaser { text-align: center; }
.sbh-section--contact-teaser h2 { max-width: 560px; margin: 0 auto 30px; }
.sbh-section--story .sbh-story-body { max-width: 780px; }

.sbh-section__grid, .sbh-project-grid, .sbh-award-grid, .sbh-video-grid, .sbh-gallery-grid, .sbh-section__head, .sbh-contact-grid {
	max-width: var(--container);
	margin: 0 auto;
}
.sbh-section__grid {
	display: grid;
	grid-template-columns: 300px 1fr;
	gap: 60px;
}
.sbh-section__side { position: sticky; top: 120px; align-self: start; }
.sbh-section__grid--intro { align-items: center; }
.sbh-section__grid--intro .sbh-section__side { position: static; align-self: auto; }
.sbh-section__main p { max-width: 640px; }
.sbh-section__main--light { color: var(--cream-deep); max-width: 640px; }
.sbh-section__head { text-align: center; margin-bottom: 56px; }
.sbh-section__head h2 { max-width: 620px; margin: 0 auto; }
.sbh-section__cta { text-align: center; margin-top: 50px; }
.sbh-section__lead { max-width: 480px; margin: 0 auto 30px; opacity: 0.8; }

.sbh-tags { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.sbh-tag {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	padding: 10px 18px;
	border: 1px solid var(--line);
	border-radius: 999px;
	color: var(--muted-dark);
}

/* ==========================================================================
   Project cards + grid
   ========================================================================== */
.sbh-project-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 10px; }
.sbh-project-grid--full { grid-template-columns: repeat(3, 1fr); }
.sbh-project-card {
	display: block;
	text-align: left;
	width: 100%;
	background: rgba(244, 239, 230, 0.03);
	border: 1px solid var(--line-light);
	border-radius: 4px;
	padding: 30px;
	transition: transform 0.3s ease, border-color 0.3s ease, background 0.3s ease;
}
.sbh-section--cream .sbh-project-card { background: #fff; border-color: var(--line); }
.sbh-project-card--clickable { cursor: pointer; }
.sbh-project-card--clickable:hover { transform: translateY(-6px); border-color: var(--gold); }
.sbh-project-card--featured { border-color: var(--gold); background: rgba(201, 163, 90, 0.08); }
.sbh-section--cream .sbh-project-card--featured { background: rgba(201, 163, 90, 0.08); }
.sbh-project-card__status {
	font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gold-deep);
	margin-bottom: 12px;
}
.sbh-project-card h3 { font-size: 20px; margin-bottom: 4px; }
.sbh-project-card__town { font-size: 13px; color: var(--muted-dark); margin-bottom: 14px; }
.sbh-project-card p { font-size: 14.5px; }
.sbh-section--dark .sbh-project-card__town, .sbh-section--dark .sbh-project-card p,
.sbh-section--forest .sbh-project-card__town, .sbh-section--forest .sbh-project-card p { color: var(--cream-deep); }
.sbh-section--cream .sbh-project-card h3,
.sbh-section--cream .sbh-project-card p:not(.sbh-project-card__status):not(.sbh-project-card__price) { color: var(--ink); }
.sbh-project-card__meta { display: flex; gap: 16px; font-size: 13px; font-weight: 600; margin-top: 16px; }
.sbh-project-card__price { color: var(--gold-deep); }
.sbh-project-card__video-flag { display: inline-block; margin-top: 14px; font-size: 12px; color: var(--gold-deep); font-weight: 600; }

/* ==========================================================================
   Modal
   ========================================================================== */
.sbh-modal { position: fixed; inset: 0; z-index: 300; display: none; align-items: center; justify-content: center; padding: 24px; }
.sbh-modal.is-open { display: flex; }
.sbh-modal__backdrop { position: absolute; inset: 0; background: rgba(21, 20, 15, 0.8); }
.sbh-modal__panel {
	position: relative;
	background: var(--cream);
	max-width: 640px;
	width: 100%;
	max-height: 85vh;
	overflow-y: auto;
	border-radius: 6px;
	padding: 48px;
	transform: translateY(20px);
	opacity: 0;
	transition: transform 0.3s ease, opacity 0.3s ease;
}
.sbh-modal.is-open .sbh-modal__panel { transform: translateY(0); opacity: 1; }
.sbh-modal__close {
	position: absolute; top: 16px; right: 16px;
	background: none; border: none; font-size: 28px; line-height: 1; color: var(--muted-dark);
}
.sbh-modal__body .sbh-eyebrow { margin-bottom: 8px; }
.sbh-modal__body h3 { font-size: 28px; margin-bottom: 6px; }
.sbh-modal__body .sbh-modal__town { color: var(--muted-dark); margin-bottom: 20px; }
.sbh-modal__body .sbh-modal__meta { display: flex; gap: 24px; margin: 20px 0; font-weight: 600; }
.sbh-modal__body .sbh-modal__meta span:first-child { color: var(--gold-deep); }

/* ==========================================================================
   Awards
   ========================================================================== */
.sbh-award-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.sbh-award-card {
	border: 1px solid var(--line-light);
	border-radius: 4px;
	padding: 36px;
}
.sbh-award-card__label { font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold); margin-bottom: 14px; }
.sbh-award-card h3 { font-size: 20px; color: var(--paper); margin-bottom: 10px; }
.sbh-award-card p { color: var(--cream-deep); margin: 0; }

/* ==========================================================================
   Gallery
   ========================================================================== */
.sbh-gallery-tabs { display: flex; justify-content: center; gap: 14px; margin-bottom: 40px; }
.sbh-gallery-tab {
	background: none;
	border: 1px solid var(--line-light);
	color: var(--cream-deep);
	padding: 10px 24px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	transition: all 0.25s ease;
}
.sbh-gallery-tab.is-active, .sbh-gallery-tab:hover { background: var(--gold); border-color: var(--gold); color: var(--charcoal); }
.sbh-gallery-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}
.sbh-gallery-item {
	padding: 0; border: none; border-radius: 4px; overflow: hidden;
	aspect-ratio: 4 / 3;
	transition: transform 0.3s ease;
	opacity: 1;
}
.sbh-gallery-item.is-hidden { display: none; }
.sbh-gallery-item:hover { transform: scale(1.03); }
.sbh-gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
.sbh-gallery-item:hover img { transform: scale(1.08); }

/* ---- Plate gallery (structured showcase grid, medium/standard scale) ----
   Every tile gets an explicit pixel height — no percentage/auto height chains
   through nested flex/grid, which is what caused tiles to size to the image's
   intrinsic dimensions instead of their container. Gap kept tight (6px) to
   match the mockup's near-seamless mosaic look, not a spaced-out grid. */
.sbh-plate-gallery { display: flex; flex-direction: column; gap: 6px; }
.sbh-plate-top { display: grid; grid-template-columns: 1.4fr 1fr; grid-template-rows: 360px; gap: 6px; }
.sbh-plate-top__stack { display: flex; flex-direction: column; gap: 6px; }
.sbh-plate-top__stack .sbh-plate { height: 177px; }
.sbh-plate-top > .sbh-plate { height: 360px; }
.sbh-plate-bottom { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.sbh-plate-bottom .sbh-plate { height: 170px; }
.sbh-plate {
	position: relative;
	border-radius: 4px;
	overflow: hidden;
	display: block;
	width: 100%;
	border: none;
	padding: 0;
}
.sbh-plate img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.sbh-plate:hover img { transform: scale(1.06); }
.sbh-plate__overlay {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(10,9,7,0) 55%, rgba(10,9,7,0.82) 100%);
}
.sbh-plate__caption { position: absolute; left: 18px; bottom: 14px; z-index: 2; text-align: left; }
.sbh-plate__caption .label { font-family: var(--font-display); font-style: italic; font-size: 18px; color: var(--paper); }
.sbh-plate__caption .num { display: block; font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); margin-top: 4px; }
@media (max-width: 900px) {
	.sbh-plate-top { grid-template-columns: 1fr; grid-template-rows: auto; }
	.sbh-plate-top > .sbh-plate { height: 220px; }
	.sbh-plate-top__stack { flex-direction: row; }
	.sbh-plate-top__stack .sbh-plate { height: 160px; }
	.sbh-plate-bottom { grid-template-columns: 1fr 1fr; }
	.sbh-plate-bottom .sbh-plate { height: 160px; }
}
@media (max-width: 600px) {
	.sbh-plate-bottom { grid-template-columns: 1fr; }
}

.sbh-lightbox {
	position: fixed; inset: 0; z-index: 400;
	display: none; align-items: center; justify-content: center;
	background: rgba(21, 20, 15, 0.95);
	padding: 40px;
}
.sbh-lightbox.is-open { display: flex; }
.sbh-lightbox__image { max-width: 90vw; max-height: 85vh; object-fit: contain; border-radius: 4px; }
.sbh-lightbox__close, .sbh-lightbox__prev, .sbh-lightbox__next {
	position: absolute; background: none; border: none; color: var(--paper); font-size: 32px;
}
.sbh-lightbox__close { top: 24px; right: 32px; }
.sbh-lightbox__prev { left: 32px; top: 50%; transform: translateY(-50%); font-size: 48px; }
.sbh-lightbox__next { right: 32px; top: 50%; transform: translateY(-50%); font-size: 48px; }
.sbh-lightbox__prev:hover, .sbh-lightbox__next:hover, .sbh-lightbox__close:hover { color: var(--gold); }

/* ==========================================================================
   Videos
   ========================================================================== */
.sbh-video-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 40px; }
.sbh-video-card__embed { position: relative; padding-top: 56.25%; border-radius: 4px; overflow: hidden; margin-bottom: 20px; }
.sbh-video-card__embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.sbh-video-card h3 { color: var(--paper); font-size: 20px; margin-bottom: 8px; }
.sbh-video-card p { color: var(--cream-deep); }

/* ==========================================================================
   Contact
   ========================================================================== */
.sbh-contact-grid { display: grid; grid-template-columns: 320px 1fr; gap: 40px; }
.sbh-contact-info, .sbh-contact-form-wrap {
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 4px;
	padding: 40px;
}
.sbh-contact-info h3 { font-size: 26px; margin: 4px 0 8px; }
.sbh-contact-info__row { display: block; margin-top: 16px; font-weight: 500; }
.sbh-contact-info__row:hover { color: var(--gold-deep); }
.sbh-form label { display: block; font-size: 12px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted-dark); margin-bottom: 18px; }
.sbh-form input, .sbh-form textarea {
	display: block; width: 100%; margin-top: 8px;
	padding: 12px 4px;
	border: none; border-bottom: 1px solid var(--line);
	background: transparent;
	font-family: var(--font-body); font-size: 15px; color: var(--ink);
	text-transform: none; letter-spacing: normal; font-weight: 400;
	resize: vertical;
}
.sbh-form input::placeholder, .sbh-form textarea::placeholder { color: var(--muted-dark); opacity: 0.75; }
.sbh-form input:focus, .sbh-form textarea:focus { outline: none; border-bottom-color: var(--gold); }
.sbh-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.sbh-form__honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.sbh-form-notice { padding: 16px 20px; border-radius: 4px; margin-bottom: 24px; font-size: 14px; font-weight: 500; }
.sbh-form-notice--success { background: rgba(22, 40, 31, 0.08); color: var(--forest); border: 1px solid var(--forest); }
.sbh-form-notice--error { background: rgba(180, 60, 40, 0.08); color: #a13a26; border: 1px solid #a13a26; }

/* ==========================================================================
   Footer
   ========================================================================== */
.sbh-footer {
	position: relative;
	background:
		radial-gradient(ellipse 900px 500px at 15% 0%, rgba(201,163,90,0.06) 0%, transparent 60%),
		linear-gradient(180deg, var(--charcoal-soft) 0%, var(--charcoal) 100%);
	color: var(--muted);
	padding-top: 80px;
}
.sbh-footer::before {
	content: '';
	position: absolute; top: 0; left: 0; right: 0;
	height: 2px;
	background: linear-gradient(90deg, transparent 0%, var(--gold) 50%, transparent 100%);
	opacity: 0.6;
}
.sbh-footer__top {
	max-width: var(--container);
	margin: 0 auto;
	padding: 0 32px 52px;
	display: grid;
	grid-template-columns: 1.6fr 1fr 1fr 1fr;
	gap: 48px;
	border-bottom: 1px solid var(--line-light);
}
.sbh-footer__brand img { margin-bottom: 24px; }
.sbh-footer__brand p { color: var(--cream-deep); font-size: 14.5px; line-height: 1.75; margin: 0 0 26px; max-width: 340px; }
.sbh-footer__col {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding-left: 44px;
	border-left: 1px solid var(--line-light);
}
.sbh-footer__heading {
	position: relative;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--gold);
	margin: 0 0 12px;
	padding-bottom: 14px;
}
.sbh-footer__heading::after {
	content: '';
	position: absolute; left: 0; bottom: 0;
	width: 28px; height: 2px;
	background: var(--gold);
	opacity: 0.7;
}
.sbh-footer__col > a {
	position: relative;
	display: inline-block;
	width: fit-content;
	color: var(--cream-deep);
	font-size: 14px;
	transition: color 0.2s ease;
}
.sbh-footer__col > a::after {
	content: '';
	position: absolute; left: 0; bottom: -3px;
	width: 0; height: 1px;
	background: var(--gold);
	transition: width 0.25s ease;
}
.sbh-footer__col > a:hover { color: var(--gold); }
.sbh-footer__col > a:hover::after { width: 100%; }
.sbh-footer__text { color: var(--muted); font-size: 13.5px; line-height: 1.6; margin: 0; }
.sbh-footer__name { font-family: var(--font-display); font-size: 20px; color: var(--paper); margin: 4px 0 0; }
.sbh-footer__contact-row {
	display: flex !important;
	align-items: center;
	gap: 10px;
	width: fit-content;
}
.sbh-footer__contact-row::after { display: none; }
.sbh-footer__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: rgba(201, 163, 90, 0.12);
	border: 1px solid rgba(201, 163, 90, 0.35);
	color: var(--gold);
	font-size: 13px;
	flex-shrink: 0;
	transition: background 0.2s ease, transform 0.2s ease;
}
.sbh-footer__contact-row:hover .sbh-footer__icon { background: var(--gold); color: var(--charcoal); transform: scale(1.08); }
.sbh-footer__bottom {
	max-width: var(--container);
	margin: 0 auto;
	padding: 26px 32px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	font-size: 12.5px;
	letter-spacing: 0.02em;
	color: var(--muted);
}
.sbh-footer__bottom p { margin: 0; }
.sbh-footer__bottom a { color: var(--muted); transition: color 0.2s ease; }
.sbh-footer__bottom a:hover { color: var(--gold); }
@media (max-width: 980px) {
	.sbh-footer__top { grid-template-columns: 1fr 1fr; }
	.sbh-footer__brand { grid-column: 1 / -1; padding-left: 0; border-left: none; }
	.sbh-footer__col:nth-child(2) { padding-left: 0; border-left: none; }
}
@media (max-width: 560px) {
	.sbh-footer__top { grid-template-columns: 1fr; }
	.sbh-footer__col { padding-left: 0; border-left: none; }
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1180px) {
	.sbh-nav__links, .sbh-nav__cta { display: none; }
	.sbh-nav__toggle { display: flex; }
}
@media (max-width: 900px) {
	.sbh-section__grid { grid-template-columns: 1fr; }
	.sbh-section__side { position: static; }
	.sbh-project-grid, .sbh-project-grid--full { grid-template-columns: repeat(2, 1fr); }
	.sbh-award-grid { grid-template-columns: 1fr; }
	.sbh-gallery-grid { grid-template-columns: repeat(3, 1fr); }
	.sbh-contact-grid { grid-template-columns: 1fr; }
	.sbh-form__row { grid-template-columns: 1fr; }
	.sbh-footer__inner { grid-template-columns: 1fr; }
	.sbh-stat-strip { grid-template-columns: repeat(2, 1fr); }
	.sbh-stat:nth-child(2) { border-right: none; }
}
@media (max-width: 600px) {
	.sbh-section { padding: 70px 20px; }
	.sbh-project-grid, .sbh-project-grid--full { grid-template-columns: 1fr; }
	.sbh-gallery-grid { grid-template-columns: repeat(2, 1fr); }
	.sbh-hero__actions { flex-direction: column; width: 100%; }
	.sbh-hero__content { padding: 130px 24px 60px; }
}