/*
Theme Name:        Sterling
Theme URI:         https://sterlingdesign.co
Description:       Block theme for Sterling Design. Header, footer, and page templates built from the Sterling Design Blocks patterns; brand colors and type live in theme.json. Requires the Sterling Design Blocks plugin for the brand CSS and patterns.
Version:           1.0.0
Requires at least: 6.6
Requires PHP:      7.4
Author:            The Dealio
License:           GPL-2.0-or-later
Text Domain:       sterling
*/

/* Sections run edge to edge and stack flush; each pattern handles its own
   padding and inner width. */
.wp-site-blocks > *,
main.wp-block-group > *,
.wp-block-post-content > * {
	margin-block: 0;
}

/* ---- Hero ----------------------------------------------------------------
   Copy sits in the same 1120px column as the sections below (core's cover
   positioning rules force margin:0 / width:auto, hence the !importants).   */
.wp-block-cover.sd-hero .wp-block-cover__inner-container {
	width: 100% !important;
	max-width: 1120px !important;
	margin-inline: auto !important;
	padding: 0 1.5rem 3.5rem;
	box-sizing: border-box;
}
.wp-block-cover.sd-hero .sd-hero__inner {
	padding: 0 !important;
	max-width: 640px;
}

/* Denim scrim: dark behind the copy (left + bottom), clear over the photo.
   Replaces the block's 50%-opacity bottom gradient. */
.wp-block-cover.sd-hero .wp-block-cover__background {
	opacity: 1 !important;
	background:
		linear-gradient(90deg, rgba(27, 37, 50, 0.86) 0%, rgba(27, 37, 50, 0.72) 38%, rgba(27, 37, 50, 0.3) 60%, rgba(27, 37, 50, 0) 78%),
		linear-gradient(to top, rgba(27, 37, 50, 0.75) 0%, rgba(27, 37, 50, 0) 45%) !important;
}
@media (max-width: 781px) {
	/* copy spans the full width on phones, so darken bottom-up instead */
	.wp-block-cover.sd-hero .wp-block-cover__background {
		background: linear-gradient(to top, rgba(27, 37, 50, 0.92) 0%, rgba(27, 37, 50, 0.7) 45%, rgba(27, 37, 50, 0.15) 80%) !important;
	}
}

.sd-hero h1 {
	font-size: clamp(2.6rem, 5.2vw, 4.2rem) !important;
	line-height: 1.02 !important;
	font-weight: 500;
	text-shadow: 0 2px 18px rgba(12, 18, 26, 0.35);
}
.sd-hero h1 + p {
	font-size: 1.15rem !important;
	line-height: 1.55 !important;
	max-width: 30rem;
	color: #f4f3ef !important;
	text-shadow: 0 1px 10px rgba(12, 18, 26, 0.45);
}

/* Material swatch cards: chip and label sit flush */
.sd-swatch > * + * { margin-block-start: 0; }

/* Planner rail sticks below the sticky header */
.sd-intake { --sd-intake-sticky-top: 6.5rem; }

/* ---- Header ------------------------------------------------------------ */
.sd-site-header {
	position: sticky;
	top: 0;
	z-index: 50;
}
.admin-bar .sd-site-header { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 600px) {
	.admin-bar .sd-site-header { top: 0; }
}

.sd-header__brand a { display: flex; align-items: center; gap: 0.7rem; text-decoration: none; }
.sd-header__actions { gap: 2rem; }

/* Navigation block styled like the pattern's nav list */
.sd-header .wp-block-navigation {
	font-family: var(--sd-font-display);
	text-transform: uppercase;
	letter-spacing: 0.16em;
	font-weight: 500;
	font-size: 0.8rem;
	color: var(--sd-denim);
	gap: 1.75rem;
}
.sd-header .wp-block-navigation-item__content { transition: color 0.2s ease; }
.sd-header .wp-block-navigation-item__content:hover,
.sd-header .current-menu-item > .wp-block-navigation-item__content { color: var(--sd-blaze); }

/* Mobile overlay */
.sd-header .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--sd-denim);
	color: var(--sd-sand);
	padding: 2rem 1.5rem;
}
.sd-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	gap: 1.5rem;
	font-size: 1.1rem;
}

.sd-header .sd-btn .wp-block-button__link {
	font-family: var(--sd-font-display);
	text-transform: uppercase;
	letter-spacing: 0.14em;
	font-size: 0.75rem;
	font-weight: 500;
}
.sd-header .sd-btn .wp-block-button__link { white-space: nowrap; }
@media (max-width: 600px) {
	.sd-header .sd-header__actions { gap: 1rem; }
	.sd-header .sd-btn .wp-block-button__link {
		padding: 0.55rem 0.85rem !important;
		font-size: 0.68rem;
		letter-spacing: 0.1em;
	}
}
@media (max-width: 480px) {
	.sd-header .sd-header__wordmark { display: none; }
}

/* ---- Footer ------------------------------------------------------------ */
.sd-foot__nav a,
.sd-foot a { text-decoration: none; }

/* ---- Text links in page content --------------------------------------- */
.sd-link {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s ease;
}
.sd-link:hover { color: var(--sd-blaze); }
.sd-on-dark a.sd-link:hover { color: var(--sd-oatmeal); }

/* ---- Fallback templates (404, posts) ----------------------------------- */
.sd-plain {
	padding: 5rem 1.5rem;
}