/*
Theme Name: 3535 Studios
Theme URI: https://3535studios.com
Author: 3535 Studios
Author URI: https://3535studios.com
Description: Child theme of Ollie for 3535 Studios. Provides the 3535 brand design system (theme.json tokens), enterprise header, and homepage block patterns. Presentation only — company functionality belongs in a separate plugin.
Template: ollie
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
Version: 0.12.5
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: 3535-studios
Tags: full-site-editing, block-patterns, block-styles, custom-logo, editor-style, wide-blocks
*/

/* ==========================================================================
   Foundations
   ========================================================================== */

:root {
	--studios-focus-ring: 2px solid var(--wp--preset--color--primary);
	--studios-focus-offset: 3px;
	--studios-header-breakpoint: 1240px; /* Reference only: CSS media queries cannot read custom properties. */
}

/* Visible, consistent focus indicator (WCAG 2.4.7 / 2.4.11 / 2.4.13). */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: var(--studios-focus-ring);
	outline-offset: var(--studios-focus-offset);
	border-radius: 2px;
}

/* On gold buttons the gold ring would be invisible; use navy + white halo. */
.wp-block-button__link:focus-visible,
.wp-element-button:focus-visible {
	outline: 2px solid var(--wp--preset--color--base);
	outline-offset: 2px;
	box-shadow: 0 0 0 5px var(--wp--preset--color--main);
}

/* Skip link added by core for block themes. */
.skip-link.screen-reader-text:focus {
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--main);
	font-weight: 600;
}

/* Gold text highlight used inside headings (native "Highlight" format). */
mark.has-inline-color {
	background-color: transparent;
}

/* ==========================================================================
   Block style: Paragraph › Eyebrow (gold rule + tracked uppercase label)
   ========================================================================== */

.is-style-eyebrow {
	display: flex;
	align-items: center;
	gap: 0.875rem;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--xx-small);
	font-weight: 600;
	letter-spacing: 0.28em;
	line-height: 1.4;
	text-transform: uppercase;
}

.is-style-eyebrow::before {
	content: "";
	flex: 0 0 auto;
	width: 2.25rem;
	height: 3px;
	background-color: var(--wp--preset--color--primary);
}

.is-style-eyebrow.has-text-align-center {
	justify-content: center;
}

/* ==========================================================================
   Block style: Button › Arrow (decorative arrow hidden from assistive tech)
   ========================================================================== */

.wp-block-button.is-style-arrow .wp-block-button__link::after {
	content: "\2192" / "";
	display: inline-block;
	margin-inline-start: 0.6em;
	transition: transform 0.2s ease;
}

.wp-block-button.is-style-arrow .wp-block-button__link:hover::after,
.wp-block-button.is-style-arrow .wp-block-button__link:focus-visible::after {
	transform: translateX(3px);
}

/* ==========================================================================
   Header
   ========================================================================== */

.studios-header {
	position: relative;
	z-index: 20;
}

/* Logo: the owner-approved primary horizontal SVG (960 × 180 viewBox, built-in clear space), shared by header and footer. */
.studios-logo.wp-block-image {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	margin: 0;
	line-height: 0;
}

.studios-logo.wp-block-image a {
	display: block;
	line-height: 0;
}

/* The negative inline margins pull the built-in side clear space (3.33% each side) back to the
   page gutter, so the lettering aligns with page content; nothing is cropped. */
.studios-logo.wp-block-image img {
	display: block;
	width: var(--studios-logo-width);
	max-width: none;
	height: auto;
	aspect-ratio: 960 / 180;
	margin-inline: calc(var(--studios-logo-width) * -0.0333);
}

/* Header: scales with the viewport and never takes the menu toggle's space on narrow screens. */
.studios-header .studios-logo {
	--studios-logo-width: clamp(12.5rem, 56vw, 20rem);
}

/* Full desktop menu (≥ 1240px): 280px, growing to the approved 360px on roomy headers. */
@media (min-width: 1240px) {
	.studios-header .studios-logo {
		--studios-logo-width: clamp(17.5rem, 17.5rem + (100vw - 1240px) * 0.4, 22.5rem);
	}
}

/* The taller mark sets the header height on wider screens; trim the vertical padding so the bar stays compact. */
@media (min-width: 600px) {
	.wp-block-group.studios-header {
		padding-top: 0.75rem !important;
		padding-bottom: 0.75rem !important;
	}
}

.studios-logo--footer {
	--studios-logo-width: 15rem;
}

.studios-header-cta {
	flex-shrink: 0;
}

.studios-header-cta .wp-block-button__link {
	white-space: nowrap;
}

/* Primary navigation */
.studios-primary-nav .wp-block-navigation-item__content {
	display: inline-block;
	padding-block: 0.5rem; /* ≥ 24px target size (WCAG 2.5.8) */
	text-decoration: none;
	text-decoration-color: transparent;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.65em;
	transition: color 0.15s ease, text-decoration-color 0.15s ease;
}

.studios-primary-nav .wp-block-navigation-item__content:hover,
.studios-primary-nav .wp-block-navigation-item__content:focus-visible,
.studios-primary-nav .current-menu-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--primary);
	text-decoration-line: underline;
	text-decoration-color: currentColor;
}

/* CTA and Home are duplicated inside the menu so they appear in the mobile overlay only
   (desktop: the logo links home and the header button is the CTA). */
.studios-primary-nav .studios-nav-cta,
.studios-primary-nav .studios-nav-home {
	display: none;
}

/* Collapse to the overlay menu below 1240px (core default is 600px; the full row needs ~1176px of content width). */
@media (max-width: 1239.98px) {
	.studios-primary-nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.studios-primary-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}

	.studios-header-cta {
		display: none !important;
	}

	.studios-primary-nav .is-menu-open .studios-nav-cta {
		display: block;
		margin-top: 1rem;
	}

	.studios-primary-nav .is-menu-open .studios-nav-home {
		display: block;
	}
}

/* Menu toggles: replace Ollie's ivory boxed treatment with an outlined icon on navy. */
.wp-block-navigation.studios-primary-nav .wp-block-navigation__responsive-container-open:has(svg),
.wp-block-navigation.studios-primary-nav .wp-block-navigation__responsive-container-close:has(svg) {
	min-width: 44px;
	min-height: 44px;
	align-items: center;
	justify-content: center;
	padding: 8px;
	border: 1px solid var(--wp--preset--color--border-dark);
	border-radius: 2px;
	background: transparent;
	color: var(--wp--preset--color--base);
}

.wp-block-navigation.studios-primary-nav .wp-block-navigation__responsive-container-open:has(svg):hover,
.wp-block-navigation.studios-primary-nav .wp-block-navigation__responsive-container-close:has(svg):hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

.studios-primary-nav .wp-block-navigation__responsive-container-open svg,
.studios-primary-nav .wp-block-navigation__responsive-container-close svg {
	width: 26px;
	height: 26px;
}

/* Overlay menu */
.studios-primary-nav .wp-block-navigation__responsive-container.is-menu-open {
	padding: clamp(1rem, 4vw, 2rem) var(--wp--preset--spacing--medium);
}

.studios-primary-nav .is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 3.5rem;
}

.wp-block-navigation.studios-primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
}

.wp-block-navigation.studios-primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container li.studios-nav-cta {
	width: auto;
	align-self: flex-start;
	margin-top: 1.25rem;
}

.wp-block-navigation.studios-primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .studios-nav-cta > .wp-block-navigation-item__content {
	width: auto;
	padding: 0.95em 1.75em;
	border-radius: 2px;
	background-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--main);
	font-family: var(--wp--preset--font-family--primary);
	font-size: var(--wp--preset--font-size--base);
	text-decoration: none;
}

.wp-block-navigation.studios-primary-nav .wp-block-navigation__responsive-container.is-menu-open .studios-nav-cta > .wp-block-navigation-item__content:hover {
	background-color: var(--wp--preset--color--primary-alt);
}

/* ==========================================================================
   Hero
   ========================================================================== */

.studios-hero__title {
	text-wrap: balance;
}

.studios-hero__lead {
	max-width: 36rem;
}

.studios-hero__tagline p {
	margin: 0;
}

@media (max-width: 781px) {
	.studios-hero__aside {
		justify-content: flex-start !important;
	}
}

@media (max-width: 1023.98px) {
	/* Below 1024px the text overlaps the bright facade and sky, so darken the photo evenly. */
	.studios-hero .wp-block-cover__background.has-midnight-fade-gradient-background {
		background: linear-gradient(180deg, rgba(7, 14, 26, 0.86) 0%, rgba(7, 14, 26, 0.74) 55%, rgba(7, 14, 26, 0.82) 100%) !important;
	}
}

@media (max-width: 599.98px) {
	.is-style-eyebrow {
		letter-spacing: 0.2em;
	}
}

/* ==========================================================================
   Shared section components
   ========================================================================== */

/* Split sections stack between core's 782px column breakpoint and the 1240px
   header breakpoint, where side-by-side text and card grids get too narrow. */
@media (min-width: 782px) and (max-width: 1239.98px) {
	.wp-block-columns.studios-stack-tablet {
		flex-wrap: wrap !important;
	}

	.wp-block-columns.studios-stack-tablet > .wp-block-column {
		flex-basis: 100% !important;
	}
}

/* Paragraph › Eyebrow (rule below) and the heading variant used in Industries. */
.is-style-eyebrow-stacked,
.studios-heading-eyebrow {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--xx-small);
	font-weight: 600;
	letter-spacing: 0.28em;
	line-height: 1.7;
	text-transform: uppercase;
}

.is-style-eyebrow-stacked::after,
.studios-heading-eyebrow::after {
	content: "";
	display: block;
	width: 2.25rem;
	height: 2px;
	margin-top: 0.75rem;
	background-color: var(--wp--preset--color--primary);
}

/* Paragraph › Arrow Link */
:where(.is-style-arrow-link) {
	font-size: var(--wp--preset--font-size--small);
}

.is-style-arrow-link a {
	color: inherit;
	font-weight: 600;
	text-decoration: none;
}

.is-style-arrow-link a::after {
	content: "\2192" / "";
	display: inline-block;
	margin-inline-start: 0.5em;
	transition: transform 0.2s ease;
}

.is-style-arrow-link a:hover,
.is-style-arrow-link a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.is-style-arrow-link a:hover::after,
.is-style-arrow-link a:focus-visible::after {
	transform: translateX(3px);
}

/* Line icons (decorative SVGs in Image blocks) */
.studios-icon.wp-block-image {
	flex-shrink: 0;
	margin: 0;
	line-height: 0;
}

.studios-icon.wp-block-image img {
	display: block;
	width: 2.25rem;
	height: 2.25rem;
	object-fit: contain;
}

.studios-icon--lg.wp-block-image img {
	width: 3rem;
	height: 3rem;
}

/* Images that fill their column (Differentiators, Project Inquiry) */
.studios-fill-image.wp-block-image {
	position: absolute;
	inset: 0;
	margin: 0;
}

.studios-fill-image.wp-block-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Labelled placeholder for unverified figures */
.studios-placeholder-tag {
	display: inline-block;
	padding: 0.15rem 0.5rem;
	border: 1px dashed currentColor;
	border-radius: 2px;
	color: var(--wp--preset--color--primary);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	line-height: 1.5;
	text-transform: uppercase;
}

/* ==========================================================================
   Service pillars
   ========================================================================== */

.studios-index {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin: 0 0 0.2rem;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--xx-small);
	font-weight: 600;
	letter-spacing: 0.2em;
}

.studios-index::after {
	content: "";
	width: 1.5rem;
	height: 2px;
	background-color: var(--wp--preset--color--primary);
}

.studios-pillar > * {
	margin-block: 0;
}

.studios-pillar .wp-block-heading {
	margin-top: var(--wp--preset--spacing--medium);
}

@media (min-width: 782px) {
	.studios-pillars > .wp-block-column {
		padding-inline: clamp(1.5rem, 3vw, 3rem);
	}

	.studios-pillars > .wp-block-column:first-child {
		padding-inline-start: 0;
	}

	.studios-pillars > .wp-block-column:last-child {
		padding-inline-end: 0;
	}

	.studios-pillars > .wp-block-column + .wp-block-column {
		border-left: 1px solid var(--wp--preset--color--border-light);
	}
}

@media (max-width: 781px) {
	.studios-pillars > .wp-block-column + .wp-block-column {
		padding-top: var(--wp--preset--spacing--large);
		border-top: 1px solid var(--wp--preset--color--border-light);
	}
}

/* ==========================================================================
   Cards (Products, Solutions)
   ========================================================================== */

.studios-card {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: 4px;
	box-shadow: 0 24px 48px -28px rgba(0, 0, 0, 0.6);
}

.studios-card__media.wp-block-image {
	margin: 0;
}

.studios-card__media.wp-block-image img {
	display: block;
	width: 100%;
}

.studios-card__body {
	flex: 1;
}

.studios-card__body > * {
	margin-block: 0;
}

.studios-product-card__brand {
	margin-bottom: 0.25rem;
}

.studios-product-card__brand .wp-block-heading {
	margin: 0;
	letter-spacing: -0.01em;
}

.studios-solution-card > * {
	margin-block: 0;
}

.studios-solution-card__media.wp-block-image {
	position: relative;
	margin: 0;
}

.studios-solution-card__media.wp-block-image img {
	display: block;
	width: 100%;
	border-radius: 4px;
}

/* Small gold notch under each image, as in the mockup. */
.studios-solution-card__media.wp-block-image::after {
	content: "";
	position: absolute;
	bottom: -6px;
	left: 0;
	width: 1.25rem;
	height: 6px;
	background-color: var(--wp--preset--color--primary);
}

.studios-kicker {
	font-family: var(--wp--preset--font-family--heading);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.24em;
	text-transform: uppercase;
}

.studios-solution-card .wp-block-heading {
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1.3;
}

.studios-solution-card .wp-block-heading a {
	color: inherit;
	text-decoration: none;
}

.studios-solution-card .wp-block-heading a:hover,
.studios-solution-card .wp-block-heading a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

/* ==========================================================================
   Differentiators
   ========================================================================== */

.studios-differentiators__media,
.studios-inquiry-section__media {
	position: relative;
	min-height: 11rem;
}

.studios-stat {
	text-align: center;
}

.studios-stat > * {
	margin-block: 0;
}

.studios-stat .studios-icon {
	margin-bottom: 0.5rem;
}

.studios-stat__value {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	line-height: 1.25;
}

.studios-stat__value--number {
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 700;
	line-height: 1.05;
}

/* Explicit 2- or 4-up grids so the four items never wrap as 3 + 1. */
.wp-block-group.studios-stats,
.wp-block-group.studios-industry-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Card grids fill the row exactly (core's auto-fill can leave an empty track). */
.wp-block-group.studios-product-grid,
.wp-block-group.studios-solution-grid {
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 600px) {
	.wp-block-group.studios-product-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.wp-block-group.studios-solution-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (min-width: 900px) {
	.wp-block-group.studios-stats {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (min-width: 600px) {
	.wp-block-group.studios-industry-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (min-width: 1240px) {
	.studios-stats > .studios-stat + .studios-stat {
		border-left: 1px solid var(--wp--preset--color--border-dark);
	}
}

/* ==========================================================================
   Industries
   ========================================================================== */

.studios-heading-eyebrow {
	margin: 0;
	max-width: 18rem;
}

.studios-industry > * {
	margin-block: 0;
}

/* ==========================================================================
   Project inquiry
   ========================================================================== */

.studios-inquiry-section__inner {
	align-items: center;
}

.studios-inquiry-section__inner > .wp-block-group > * {
	margin-block: 0;
}

.studios-inquiry-section__inner > .wp-block-group > * + * {
	margin-top: var(--wp--preset--spacing--medium);
}

@media (max-width: 781px) {
	.studios-inquiry-section__media {
		display: none;
	}
}

/* ==========================================================================
   Footer
   ========================================================================== */

.studios-footer__base > * {
	margin: 0;
}

.studios-footer__legal-row > * {
	margin: 0;
}

.studios-footer-legal.wp-block-list > li {
	margin: 0;
}

.studios-footer-legal.wp-block-list {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.studios-footer .studios-footer-legal a {
	display: inline-block;
	padding-block: 0.25rem;
	color: inherit;
	text-decoration: none;
}

.studios-footer .studios-footer-legal a:hover,
.studios-footer .studios-footer-legal a:focus-visible {
	color: var(--wp--preset--color--primary);
	text-decoration: underline;
}

.studios-footer-contact.wp-block-list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.studios-footer-contact li {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0;
}

.studios-footer-contact li::before {
	content: "";
	flex: 0 0 1rem;
	height: 1rem;
	background: no-repeat center / contain;
}

.studios-footer-contact li.studios-contact--location::before { background-image: url(assets/icons/gold/map-pin.svg); }
.studios-footer-contact li.studios-contact--phone::before { background-image: url(assets/icons/gold/phone.svg); }
.studios-footer-contact li.studios-contact--email::before { background-image: url(assets/icons/gold/mail.svg); }

.studios-footer .studios-footer-contact a {
	display: inline-block;
	padding-block: 0.25rem;
	color: inherit;
	text-decoration: none;
}

.studios-footer .studios-footer-contact a:hover,
.studios-footer .studios-footer-contact a:focus-visible {
	color: var(--wp--preset--color--primary);
	text-decoration: underline;
}

.studios-footer .studios-footer-nav .wp-block-navigation-item__content {
	display: inline-block;
	padding-block: 0.5rem;
	text-decoration: none;
}

.studios-footer .studios-footer-nav .wp-block-navigation-item__content:hover,
.studios-footer .studios-footer-nav .wp-block-navigation-item__content:focus-visible,
.studios-footer .studios-footer-nav .current-menu-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--primary);
}

.studios-footer .studios-social .wp-social-link a {
	padding: 0.35rem;
}

.studios-footer .studios-social .wp-social-link:hover {
	color: var(--wp--preset--color--primary) !important;
}

/* ==========================================================================
   Services page (new classes only — no effect on the homepage)
   ========================================================================== */

/* In-page anchor targets (#services-list, #our-approach) */
#services-list,
#our-approach {
	scroll-margin-top: 1rem;
}

/* Commercial hero: the sunset sits behind the end of the long gold headline line. */
@media (min-width: 1024px) {
	.studios-hero--page.studios-hero--commercial .wp-block-cover__background.has-midnight-fade-gradient-background {
		background:
			linear-gradient(0deg, rgba(7, 14, 26, 0.88) 0%, rgba(7, 14, 26, 0.55) 26%, rgba(7, 14, 26, 0) 50%),
			linear-gradient(90deg, rgba(7, 14, 26, 0.94) 0%, rgba(7, 14, 26, 0.9) 54%, rgba(16, 28, 48, 0.4) 72%, rgba(16, 28, 48, 0) 86%) !important;
	}
}

/* Page heroes carry a wider headline than the homepage, so extend the dark side of the overlay. */
@media (min-width: 1024px) {
	.studios-hero--page .wp-block-cover__background.has-midnight-fade-gradient-background {
		background:
			linear-gradient(0deg, rgba(7, 14, 26, 0.88) 0%, rgba(7, 14, 26, 0.55) 26%, rgba(7, 14, 26, 0) 50%),
			linear-gradient(90deg, rgba(7, 14, 26, 0.92) 0%, rgba(7, 14, 26, 0.85) 50%, rgba(16, 28, 48, 0.35) 70%, rgba(16, 28, 48, 0) 84%) !important;
	}
}

@media (max-width: 1023.98px) {
	.studios-hero--page .wp-block-cover__background.has-midnight-fade-gradient-background {
		background: linear-gradient(180deg, rgba(7, 14, 26, 0.86) 0%, rgba(7, 14, 26, 0.8) 55%, rgba(7, 14, 26, 0.88) 100%) !important;
	}
}

.studios-measure {
	max-width: 46rem;
}

/* Section intro with a divided aside */
@media (min-width: 782px) {
	.studios-section-intro__aside {
		padding-left: var(--wp--preset--spacing--medium);
		border-left: 1px solid var(--wp--preset--color--border-light);
	}
}

/* Service cards: 1 → 2 → 3 columns */
.wp-block-group.studios-service-grid {
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 600px) {
	.wp-block-group.studios-service-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.wp-block-group.studios-service-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.studios-service-card {
	display: flex;
	flex-direction: column;
	padding: clamp(1.5rem, 2.4vw, 2.25rem);
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 4px;
	transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.studios-service-card:hover,
.studios-service-card:focus-within {
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 18px 40px -28px rgba(16, 28, 48, 0.45);
}

.studios-service-card .studios-service-card__title {
	margin-top: var(--wp--preset--spacing--medium);
	font-weight: 600;
	letter-spacing: -0.005em;
	line-height: 1.25;
}

.studios-service-card .studios-card-link {
	margin-top: auto;
	padding-top: 1.25rem;
}

/* Approach / process steps: 1 → 2 → 4 columns */
.wp-block-group.studios-steps {
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 600px) {
	.wp-block-group.studios-steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 900px) {
	.wp-block-group.studios-steps {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

.wp-block-group.studios-step__head {
	align-items: center;
	gap: 0.75rem;
}

/* Connector line after each step icon (decorative). */
.studios-step__head::after {
	content: "";
	flex: 1;
	height: 1px;
	background-color: color-mix(in srgb, currentColor 30%, transparent);
}

@media (max-width: 599.98px) {
	.studios-step__head::after {
		display: none;
	}
}

.studios-step__icon.wp-block-image {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3.5rem;
	height: 3.5rem;
	border: 1.5px solid color-mix(in srgb, currentColor 70%, transparent);
	border-radius: 50%;
}

.studios-step__icon.wp-block-image img {
	width: 1.625rem;
	height: 1.625rem;
}

.studios-step .studios-step__num {
	margin-top: 1rem;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--xx-small);
	font-weight: 600;
	letter-spacing: 0.12em;
}

.studios-step .studios-step__title {
	font-weight: 600;
	letter-spacing: 0;
}

/* Featured capabilities: intro | image | panel */
.wp-block-group.studios-capabilities {
	grid-template-columns: minmax(0, 1fr);
	align-items: center;
}

@media (min-width: 782px) {
	.wp-block-group.studios-capabilities {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.studios-capabilities__intro {
		grid-column: 1 / -1;
	}
}

@media (min-width: 1240px) {
	.wp-block-group.studios-capabilities {
		grid-template-columns: 1.1fr 1.15fr 0.9fr;
	}

	.studios-capabilities__intro {
		grid-column: auto;
	}
}

.studios-capabilities__intro > * {
	margin-block: 0;
}

.studios-capabilities__intro > * + * {
	margin-top: var(--wp--preset--spacing--medium);
}

.studios-capabilities__intro .wp-block-heading {
	margin-top: var(--wp--preset--spacing--small);
}

.studios-capabilities__media.wp-block-image {
	height: 100%;
	margin: 0;
}

.studios-capabilities__media.wp-block-image img {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 4px;
}

.studios-tech-panel {
	align-self: stretch;
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 4px;
}

.studios-tech-panel .studios-kicker {
	margin: 0;
	line-height: 1.5;
}

.studios-tech-list.wp-block-list {
	display: grid;
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.studios-tech-list li {
	display: flex;
	align-items: center;
	gap: 0.875rem;
	min-height: 2rem;
	margin: 0;
	color: var(--wp--preset--color--primary-alt-accent);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.35;
}

.studios-tech-list li::before {
	content: "";
	flex: 0 0 1.75rem;
	height: 1.75rem;
	background: no-repeat center / contain;
}

.studios-tech-list .studios-tech--wordpress::before { background-image: url(assets/icons/navy/layout-template.svg); }
.studios-tech-list .studios-tech--javascript::before { background-image: url(assets/icons/navy/code-xml.svg); }
.studios-tech-list .studios-tech--ai::before { background-image: url(assets/icons/navy/brain-circuit.svg); }
.studios-tech-list .studios-tech--api::before { background-image: url(assets/icons/navy/cable.svg); }
.studios-tech-list .studios-tech--cloud::before { background-image: url(assets/icons/navy/cloud.svg); }
.studios-tech-list .studios-tech--a11y::before { background-image: url(assets/icons/navy/accessibility.svg); }
.studios-tech-list .studios-tech--maintenance::before { background-image: url(assets/icons/navy/wrench.svg); }

/* Sector cards: 1 → 2 → 4 columns */
.wp-block-group.studios-sector-grid {
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 600px) {
	.wp-block-group.studios-sector-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.wp-block-group.studios-sector-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

.studios-sector-card {
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 4px;
}

.studios-sector-card .wp-block-heading {
	font-weight: 600;
	letter-spacing: 0;
}

/* CTA banner */
.studios-cta-banner__media {
	position: relative;
	min-height: 12rem;
}

/* ==========================================================================
   Government page (new classes only)
   ========================================================================== */

#capabilities,
#credentials,
#experience {
	scroll-margin-top: 1rem;
}

/* Button › Download: decorative download glyph (hidden from assistive tech). */
.wp-block-button.is-style-download .wp-block-button__link::after {
	content: "" / "";
	display: inline-block;
	width: 1em;
	height: 1em;
	margin-inline-start: 0.6em;
	vertical-align: -0.15em;
	background-color: currentColor;
	-webkit-mask: url(assets/icons/white/download.svg) no-repeat center / contain;
	mask: url(assets/icons/white/download.svg) no-repeat center / contain;
	transition: transform 0.2s ease;
}

.wp-block-button.is-style-download .wp-block-button__link:hover::after,
.wp-block-button.is-style-download .wp-block-button__link:focus-visible::after {
	transform: translateY(2px);
}

/* Outline buttons over photos get a translucent navy fill so the label stays legible. */
.wp-block-cover .wp-block-button.is-style-outline .wp-block-button__link {
	background-color: rgba(7, 14, 26, 0.55);
}

/* Gold icon on a navy disc */
.studios-icon-disc.wp-block-image {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 3.75rem;
	height: 3.75rem;
	margin: 0;
	border-radius: 50%;
	background-color: var(--wp--preset--color--main);
}

.studios-icon-disc.wp-block-image img {
	width: 1.75rem;
	height: 1.75rem;
}

.studios-service-card--disc .studios-pillar__head {
	align-items: center;
}

/* Approach: chevron step panels over a faint architectural texture */
.studios-approach-cover .wp-block-cover__image-background {
	filter: grayscale(0.4);
}

.wp-block-group.studios-flow {
	grid-template-columns: minmax(0, 1fr);
	gap: 0.75rem;
}

@media (min-width: 600px) {
	.wp-block-group.studios-flow {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.wp-block-group.studios-flow {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 0;
	}
}

.studios-flow__step {
	padding: clamp(1.25rem, 2vw, 1.75rem);
	border: 1px solid rgba(203, 169, 108, 0.35);
	background-color: rgba(28, 44, 71, 0.72);
}

.studios-flow__step > * {
	margin-block: 0;
}

@media (min-width: 1024px) {
	.studios-flow__step {
		padding-inline: 2.25rem 2.5rem;
		border: 0;
		clip-path: polygon(0 0, calc(100% - 1.25rem) 0, 100% 50%, calc(100% - 1.25rem) 100%, 0 100%, 1.25rem 50%);
	}

	.studios-flow__step:first-child {
		padding-inline-start: 1.75rem;
		clip-path: polygon(0 0, calc(100% - 1.25rem) 0, 100% 50%, calc(100% - 1.25rem) 100%, 0 100%);
	}

	.studios-flow__step + .studios-flow__step {
		margin-inline-start: -0.5rem;
	}
}

.wp-block-group.studios-flow__head {
	align-items: center;
}

.studios-flow__num {
	margin: 0;
	color: var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--medium-large);
	font-weight: 700;
	line-height: 1;
}

.studios-flow__step .studios-step__title {
	margin-top: 1rem;
	margin-bottom: 0.375rem;
}

/* Credentials: badge | identifiers | contact */
.wp-block-group.studios-creds {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wp--preset--spacing--medium);
}

.wp-block-group.studios-creds > * {
	margin: 0;
}

@media (min-width: 782px) {
	.wp-block-group.studios-creds {
		grid-template-columns: minmax(12rem, 0.8fr) minmax(0, 1.6fr);
	}

	.studios-creds__contact {
		grid-column: 1 / -1;
	}
}

@media (min-width: 1240px) {
	.wp-block-group.studios-creds {
		grid-template-columns: minmax(13rem, 0.75fr) minmax(0, 1.5fr) minmax(16rem, 1fr);
	}

	.studios-creds__contact {
		grid-column: auto;
	}
}

.studios-creds__badge,
.studios-creds__contact {
	border-radius: 4px;
}

.studios-creds__badge {
	border: 1px solid var(--wp--preset--color--border-light);
}

.studios-sba-mark.wp-block-image {
	margin: 0;
}

.studios-sba-mark.wp-block-image img {
	display: block;
	height: auto;
}

.studios-creds__badge-label {
	margin: 0;
	line-height: 1.45;
}

.studios-creds__data {
	padding: var(--wp--preset--spacing--medium);
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 4px;
}

.wp-block-group.studios-creds__ids {
	grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
	column-gap: var(--wp--preset--spacing--large);
}

@media (min-width: 600px) {
	.wp-block-group.studios-creds__ids {
		grid-template-columns: minmax(max-content, 1.3fr) minmax(max-content, 1fr) minmax(max-content, 1fr);
	}
}

.studios-cred > * {
	margin-block: 0;
}

.studios-cred .studios-kicker {
	color: var(--wp--preset--color--gold-deep);
	line-height: 1.5;
}

.studios-cred__value {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	letter-spacing: 0.02em;
	font-variant-numeric: tabular-nums;
}

.studios-naics.wp-block-list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
	gap: 0.5rem 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--wp--preset--font-size--small);
}

.studios-naics li {
	margin: 0;
	padding-top: 0.5rem;
	border-top: 1px solid var(--wp--preset--color--border-light);
}

.studios-naics strong {
	display: inline-block;
	min-width: 4.25rem;
	font-family: var(--wp--preset--font-family--heading);
	font-variant-numeric: tabular-nums;
}

.studios-creds__contact > * {
	margin-block: 0;
}

.studios-contact-list.wp-block-list {
	display: grid;
	gap: 0.875rem;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--wp--preset--font-size--small);
}

.studios-contact-list li {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	margin: 0;
	line-height: 1.45;
}

.studios-contact-list li::before {
	content: "";
	flex: 0 0 1.25rem;
	height: 1.25rem;
	background: no-repeat center / contain;
}

.studios-contact-list a {
	color: inherit;
	text-underline-offset: 0.2em;
}

/* li.class (0,1,2) so these beat the `background` shorthand on the list item rules above. */
li.studios-contact--location::before { background-image: url(assets/icons/gold/map-pin.svg); }
li.studios-contact--phone::before { background-image: url(assets/icons/gold/phone.svg); }
li.studios-contact--email::before { background-image: url(assets/icons/gold/mail.svg); }
li.studios-contact--web::before { background-image: url(assets/icons/gold/globe.svg); }

/* Commercial project cards (navy) */
.studios-project-card {
	border-color: var(--wp--preset--color--border-dark);
}

/* Website screenshots: keep the top of the page (header + hero) in view. */
.studios-project-card .studios-card__media img {
	object-position: top;
}

.studios-project-card .studios-sector-card__body {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.studios-project-card__tag {
	align-self: flex-start;
	padding: 0.15rem 0.5rem;
	border: 1px solid var(--wp--preset--color--primary);
	border-radius: 2px;
	color: var(--wp--preset--color--primary);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.studios-project-card .studios-card-link {
	margin-top: auto;
	padding-top: 0.75rem;
}

.studios-project-card .studios-card-link a {
	color: var(--wp--preset--color--primary);
}

.studios-external a::after {
	content: "\2197" / "";
}

.wp-block-group.studios-sector-card.studios-project-card {
	display: flex;
	flex-direction: column;
}

/* Government CTA buttons fill their column */
.studios-gov-cta .wp-block-buttons.is-vertical {
	align-items: stretch;
}

.studios-gov-cta .wp-block-buttons.is-vertical .wp-block-button__link {
	width: 100%;
	text-align: center;
}

/* ==========================================================================
   Products page (new classes only)
   ========================================================================== */

#featured-products,
#reunionary,
#product-philosophy {
	scroll-margin-top: 1rem;
}

/* Principles: 1 → 3 columns */
.wp-block-group.studios-principles {
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 782px) {
	.wp-block-group.studios-principles {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.studios-principles > .studios-principle + .studios-principle {
		padding-left: var(--wp--preset--spacing--medium);
		border-left: 1px solid var(--wp--preset--color--border-light);
	}
}

.studios-principle > .wp-block-group > * {
	margin-block: 0;
}

.studios-principle .studios-service-card__title {
	margin-bottom: 0.375rem;
}

/* Product showcases */
.studios-product-logo.wp-block-image {
	margin-bottom: 0;
	margin-inline: 0;
	line-height: 0;
}

/* Logo sits closer to its eyebrow; the H2 gets more room above it. */
.studios-product-feature .wp-block-column > .studios-product-logo,
.studios-product-feature .wp-block-column > .studios-reunionary-lockup {
	margin-top: var(--wp--preset--spacing--small);
}

.studios-reunionary-lockup .studios-product-logo.wp-block-image {
	margin-top: 0;
}

.studios-product-logo.wp-block-image img {
	display: block;
	height: auto;
	max-width: 100%;
}

.wp-block-group.studios-reunionary-lockup {
	align-items: center;
}

.studios-product-feature__title {
	line-height: 1.12;
}

.studios-product-tagline {
	margin-top: 1rem;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
}

.studios-product-note {
	padding-left: 0.875rem;
	border-left: 2px solid var(--wp--preset--color--border-dark);
	line-height: 1.5;
}

.studios-product-shot.wp-block-image {
	margin: 0;
}

.studios-product-shot.wp-block-image img {
	display: block;
	width: 100%;
	height: auto;
}

.studios-product-shot .wp-element-caption {
	margin-top: 0.5rem;
	font-size: var(--wp--preset--font-size--xx-small);
	text-align: center;
}

.studios-product-feature--dark .studios-product-shot .wp-element-caption {
	color: var(--wp--preset--color--mist);
}

.studios-product-feature--light .studios-product-shot .wp-element-caption {
	color: var(--wp--preset--color--secondary);
}

/* Feature list with gold icons */
.studios-feature-list.wp-block-list {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 0.875rem 1.5rem;
	margin-bottom: 0;
	margin-inline: 0;
	padding: 0;
	list-style: none;
	font-size: var(--wp--preset--font-size--small);
}

@media (min-width: 600px) {
	.studios-feature-list.wp-block-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.studios-feature-list li {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	margin: 0;
	line-height: 1.45;
}

.studios-feature-list li::before {
	content: "";
	flex: 0 0 1.5rem;
	height: 1.5rem;
	background: no-repeat center / contain;
}

/* li.class (0,1,2) beats the `background` shorthand above (0,1,2 declared earlier). */
.studios-feature-list li.studios-feature--folder-lock::before { background-image: url(assets/icons/gold/folder-lock.svg); }
.studios-feature-list li.studios-feature--share-2::before { background-image: url(assets/icons/gold/share-2.svg); }
.studios-feature-list li.studios-feature--bell-ring::before { background-image: url(assets/icons/gold/bell-ring.svg); }
.studios-feature-list li.studios-feature--shield-check::before { background-image: url(assets/icons/gold/shield-check.svg); }
.studios-feature-list li.studios-feature--layout-template::before { background-image: url(assets/icons/gold/layout-template.svg); }
.studios-feature-list li.studios-feature--blocks::before { background-image: url(assets/icons/gold/blocks.svg); }
.studios-feature-list li.studios-feature--users::before { background-image: url(assets/icons/gold/users.svg); }
.studios-feature-list li.studios-feature--smartphone::before { background-image: url(assets/icons/gold/smartphone.svg); }

.studios-product-feature--light .studios-feature-list li {
	color: var(--wp--preset--color--primary-alt-accent);
}

/* Reunionary Pro status note */
.studios-status-note {
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 4px;
}

.studios-status-note > * {
	margin: 0;
}

.studios-badge {
	flex-shrink: 0;
	padding: 0.15rem 0.5rem;
	border: 1px solid var(--wp--preset--color--gold-deep);
	border-radius: 2px;
	color: var(--wp--preset--color--gold-deep);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	line-height: 1.5;
	text-transform: uppercase;
	white-space: nowrap;
}

/* Comparison cards: 1 → 2 columns */
.wp-block-group.studios-compare-grid {
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 782px) {
	.wp-block-group.studios-compare-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.studios-compare-card {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 4px;
	box-shadow: 0 18px 40px -32px rgba(16, 28, 48, 0.45);
}

.studios-compare-card > * {
	margin-block: 0;
}

.studios-compare-card__head > * {
	margin-block: 0;
}

.studios-compare-card__head .studios-kicker {
	margin-top: 0.75rem;
	line-height: 1.5;
}

.studios-compare-row {
	padding-block: 1rem;
	border-top: 1px solid var(--wp--preset--color--border-light);
}

.studios-compare-row > * {
	margin: 0;
}

.studios-compare-row__label {
	flex: 0 0 5.5rem;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	line-height: 1.5;
}

.studios-compare-row__value {
	line-height: 1.5;
}

.studios-compare-card .studios-card-link {
	margin-top: auto;
	padding-top: 0.5rem;
}

.studios-compare-card .studios-card-link a {
	color: var(--wp--preset--color--gold-deep);
}

/* Small screens: icon + label on one line, value directly beneath the label. */
@media (max-width: 479.98px) {
	.wp-block-group.studios-compare-row {
		display: grid;
		grid-template-columns: 2.25rem minmax(0, 1fr);
		column-gap: 1rem;
		row-gap: 0.125rem;
		align-items: start;
	}

	.studios-compare-row > .studios-icon {
		grid-row: span 2;
	}

	.studios-compare-row__label {
		flex: none;
	}
}

/* ==========================================================================
   About page (new classes only)
   ========================================================================== */

#mission,
#our-story,
#foundation,
#what-we-build {
	scroll-margin-top: 1rem;
}

/* Split hero (About, Insights): full-bleed photo on the right, navy panel with a diagonal edge on the left. */
.studios-split-hero.wp-block-cover {
	align-items: stretch;
}

.studios-split-hero .wp-block-cover__image-background {
	left: auto !important;
	right: 0;
	width: 62% !important;
	object-position: 50% 30%;
}

/* Navy panel with a soft diagonal edge, painted over the photo's left side. */
.studios-split-hero .wp-block-cover__background {
	opacity: 1 !important;
	background:
		linear-gradient(105deg, #101C30 0%, #101C30 44%, rgba(16, 28, 48, 0.86) 49%, rgba(16, 28, 48, 0.18) 58%, rgba(16, 28, 48, 0) 66%),
		linear-gradient(0deg, rgba(7, 14, 26, 0.55) 0%, rgba(7, 14, 26, 0) 28%) !important;
}

/* Thin architectural diagonal accents, as in the mockup. */
.studios-split-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background:
		linear-gradient(105deg, transparent 47.6%, rgba(203, 169, 108, 0.35) 47.7%, rgba(203, 169, 108, 0.35) 47.85%, transparent 48%),
		linear-gradient(105deg, transparent 51%, rgba(255, 255, 255, 0.08) 51.1%, rgba(255, 255, 255, 0.08) 54%, transparent 54.1%);
	pointer-events: none;
}

.studios-split-hero .wp-block-cover__inner-container {
	z-index: 2;
}

.studios-split-hero__row {
	min-height: 100%;
}

.studios-split-hero__aside.wp-block-column {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: center;
	gap: var(--wp--preset--spacing--large);
	align-self: stretch;
}

/* The photo scales with the viewport, so the tagline and caption are pinned to the hero's right edge
   (not the text column) to stay clear of the founder's face at every desktop width. */
@media (min-width: 1024px) {
	.studios-split-hero__aside.wp-block-column {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		width: auto;
		flex-basis: auto !important;
		justify-content: flex-end;
		gap: clamp(3rem, 7vw, 6.5rem);
	}

	.studios-split-hero__tagline,
	.studios-split-hero__caption {
		width: auto;
		min-width: 10.5rem;
	}
}

@media (min-width: 1024px) and (max-width: 1359.98px) {
	.studios-split-hero__tagline {
		display: none;
	}
}

.studios-split-hero__tagline,
.studios-split-hero__caption {
	width: 12.5rem;
	white-space: nowrap;
	text-shadow: 0 1px 12px rgba(7, 14, 26, 0.6);
}

.studios-split-hero__tagline {
	margin-top: auto;
}

/* Translucent navy panels keep the tagline legible over the bright windows without altering the photo. */
.studios-split-hero__tagline.wp-block-group,
.studios-split-hero__caption.wp-block-group {
	padding-right: 1rem !important;
	background: rgba(7, 14, 26, 0.78);
}

.studios-split-hero__tagline.wp-block-group {
	padding-top: 0.75rem !important;
	padding-bottom: 0.75rem !important;
}

.studios-split-hero__caption.wp-block-group {
	margin-top: 0;
	padding-top: 0.5rem !important;
	padding-bottom: 0.5rem !important;
}

.studios-split-hero__tagline p,
.studios-split-hero__caption p {
	margin: 0;
}

.studios-founder__name {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	line-height: 1.4;
}

.studios-founder__role {
	font-size: var(--wp--preset--font-size--xx-small);
	font-weight: 500;
	line-height: 1.4;
}

/* Below 1024px: photo becomes a full-width band under the copy. */
@media (max-width: 1023.98px) {
	.studios-split-hero.wp-block-cover {
		display: flex;
		flex-direction: column;
		padding: 0 !important;
		min-height: 0 !important;
	}

	.studios-split-hero .wp-block-cover__image-background {
		position: relative !important;
		order: 2;
		width: 100% !important;
		height: auto !important;
		aspect-ratio: 4 / 3;
		object-position: 50% 25% !important;
	}

	.studios-split-hero .wp-block-cover__background {
		display: none;
	}

	.studios-split-hero::after {
		display: none;
	}

	.studios-split-hero .wp-block-cover__inner-container {
		position: static;
		order: 1;
		width: 100%;
		padding: var(--wp--preset--spacing--large) var(--wp--preset--spacing--medium);
		background: #101C30;
	}

	.studios-split-hero__aside.wp-block-column {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		top: auto;
		flex-direction: row;
		align-items: flex-end;
		justify-content: space-between;
		padding: 0 var(--wp--preset--spacing--medium) var(--wp--preset--spacing--medium);
		z-index: 2;
		pointer-events: none;
	}

	.studios-split-hero__tagline {
		display: none;
	}

	.studios-split-hero__caption {
		width: auto;
		margin-left: auto;
		white-space: nowrap;
	}

	.studios-split-hero {
		position: relative;
	}
}

/* ==========================================================================
   Insights (posts page, topic archives, articles)
   ========================================================================== */

#latest-insights,
#topics {
	scroll-margin-top: 1rem;
}

/* Insights hero: no face to protect, so keep the tagline visible on narrower desktops too. */
@media (min-width: 1024px) and (max-width: 1359.98px) {
	.studios-insights-hero .studios-split-hero__tagline {
		display: block;
	}
}

/* Insights CTA: the sunset shifts behind the tagline as the photo scales, so give it the hero's navy panel. */
.studios-insights-cta .studios-split-cta__aside .studios-hero__tagline.wp-block-group {
	padding: 0.75rem 1rem 0.75rem 1.25rem !important;
	background: rgba(7, 14, 26, 0.78);
}

/* Article cards: 1 → 2 → 3 columns, equal heights */
.wp-block-post-template.studios-post-grid {
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wp--preset--spacing--medium);
	margin: 0;
}

@media (min-width: 600px) {
	.wp-block-post-template.studios-post-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.wp-block-post-template.studios-post-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.studios-post-grid > .wp-block-post {
	display: flex;
	margin: 0;
}

.wp-block-group.studios-post-card {
	flex: 1;
	gap: 0;
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 4px;
	background: var(--wp--preset--color--base);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.wp-block-group.studios-post-card:hover,
.wp-block-group.studios-post-card:focus-within {
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 10px 24px rgba(16, 28, 48, 0.08);
}

.studios-post-card .studios-post-card__image {
	width: 100%;
	margin: 0;
}

.studios-post-card .studios-post-card__image img {
	display: block;
	width: 100%;
	object-fit: cover;
}

.wp-block-group.studios-post-card__body {
	flex: 1;
	gap: 0.625rem;
	padding: var(--wp--preset--spacing--medium);
}

.studios-post-card__body > * {
	margin: 0;
}

.wp-block-group.studios-post-card__meta {
	gap: 0.25rem 0.75rem;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--xx-small);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.studios-post-card__meta > * {
	margin: 0;
}

.studios-post-card__category a {
	color: var(--wp--preset--color--gold-deep);
	text-decoration: none;
}

.studios-post-card__category a:hover,
.studios-post-card__category a:focus-visible {
	text-decoration: underline;
}

.studios-post-card__date {
	padding-left: 0.75rem;
	border-left: 1px solid var(--wp--preset--color--border-light);
	color: var(--wp--preset--color--secondary);
}

.studios-post-card__title {
	line-height: 1.3;
}

.studios-post-card__title a {
	color: var(--wp--preset--color--main);
	text-decoration: none;
}

.studios-post-card__title a:hover,
.studios-post-card__title a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 0.18em;
}

.studios-post-card__excerpt {
	color: var(--wp--preset--color--secondary);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.6;
}

.studios-post-card__excerpt .wp-block-post-excerpt__excerpt {
	margin: 0;
}

.wp-block-read-more.studios-post-card__more {
	margin-top: auto;
	padding-top: 0.5rem;
	color: var(--wp--preset--color--gold-deep);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	text-decoration: none;
}

.wp-block-read-more.studios-post-card__more::after {
	content: "\2192" / "";
	display: inline-block;
	margin-inline-start: 0.5em;
	transition: transform 0.2s ease;
}

.wp-block-read-more.studios-post-card__more:hover,
.wp-block-read-more.studios-post-card__more:focus-visible {
	color: var(--wp--preset--color--main);
	text-decoration: underline;
}

.wp-block-read-more.studios-post-card__more:hover::after {
	transform: translateX(3px);
}

/* Pagination */
.wp-block-query-pagination.studios-pagination {
	gap: 0.5rem 1rem;
	margin-top: var(--wp--preset--spacing--large);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

.studios-pagination a,
.studios-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.75rem;
	min-height: 2.75rem;
	padding: 0 0.75rem;
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 4px;
	color: var(--wp--preset--color--main);
	text-decoration: none;
}

.studios-pagination .page-numbers.current {
	border-color: var(--wp--preset--color--main);
	background: var(--wp--preset--color--main);
	color: var(--wp--preset--color--base);
}

.studios-pagination .page-numbers.dots {
	border-color: transparent;
}

.studios-pagination a:hover,
.studios-pagination a:focus-visible {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--gold-deep);
}

/* Empty state ("Insights are coming soon.") */
.wp-block-group.studios-empty-state {
	padding: var(--wp--preset--spacing--large) var(--wp--preset--spacing--medium);
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 4px;
	background: var(--wp--preset--color--tertiary);
	text-align: center;
}

.studios-empty-state > * {
	margin-block: 0;
}

.studios-empty-state > * + * {
	margin-top: 0.75rem;
}

.studios-empty-state > .wp-block-buttons {
	margin-top: var(--wp--preset--spacing--medium);
}

.studios-empty-state p {
	color: var(--wp--preset--color--secondary);
}

/* Topic cards: 1 → 2 → 3 → 6 columns; the whole card is one link */
.wp-block-group.studios-topic-grid {
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 480px) {
	.wp-block-group.studios-topic-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 782px) {
	.wp-block-group.studios-topic-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (min-width: 1200px) {
	.wp-block-group.studios-topic-grid {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
}

.wp-block-group.studios-topic-card {
	position: relative;
	justify-content: flex-start;
	height: 100%;
	padding: var(--wp--preset--spacing--medium) var(--wp--preset--spacing--small);
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 4px;
	text-align: center;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.studios-topic-card > * {
	margin: 0;
}

.studios-topic-card .studios-icon-disc.wp-block-image {
	width: 4.25rem;
	height: 4.25rem;
	margin-bottom: 0.25rem;
}

.studios-topic-card .studios-icon-disc.wp-block-image img {
	width: 2.125rem;
	height: 2.125rem;
}

.wp-block-group.studios-topic-card::after {
	content: "\2192" / "";
	margin-top: auto;
	padding-top: 0.5rem;
	color: var(--wp--preset--color--gold-deep);
	font-weight: 600;
	transition: transform 0.2s ease;
}

.wp-block-group.studios-topic-card:hover,
.wp-block-group.studios-topic-card:focus-within {
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 10px 24px rgba(16, 28, 48, 0.08);
}

.wp-block-group.studios-topic-card:hover::after {
	transform: translateX(3px);
}

.wp-block-group.studios-topic-card:focus-within {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
}

.studios-topic-card__title a {
	color: var(--wp--preset--color--main);
	text-decoration: none;
}

.studios-topic-card__title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.studios-topic-card__title a:focus-visible {
	outline: none;
}

.studios-topic-card__text {
	line-height: 1.5;
}

/* Breadcrumbs on navy headers */
.studios-breadcrumbs {
	color: var(--wp--preset--color--mist);
}

.studios-breadcrumbs a {
	color: var(--wp--preset--color--base);
	text-decoration: underline;
	text-decoration-color: rgba(203, 169, 108, 0.6);
	text-underline-offset: 0.2em;
}

.studios-breadcrumbs a:hover,
.studios-breadcrumbs a:focus-visible {
	color: var(--wp--preset--color--primary);
}

.studios-archive-header .wp-block-term-description p {
	margin: 0;
	color: var(--wp--preset--color--base);
}

.studios-archive-header > .wp-block-term-description {
	max-width: var(--wp--style--global--wide-size);
}

.studios-archive-header .wp-block-term-description p {
	max-width: 46rem;
}

/* Article header */
.studios-article__category {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.studios-article__category a {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
}

.studios-article__category a:hover,
.studios-article__category a:focus-visible {
	text-decoration: underline;
}

.studios-article-header .studios-article__title {
	margin-top: 0.25rem;
}

.studios-article__meta > * {
	margin: 0;
}

.studios-article__meta > * + *::before {
	content: "\00B7" / "";
	margin: 0 0.625rem;
}

.studios-article__meta > .wp-block-post-author {
	display: flex;
	flex: 0 0 auto;
	align-items: baseline;
	font-size: inherit;
}

.studios-article__author .wp-block-post-author__content {
	display: flex;
	flex: 0 0 auto;
	gap: 0.3em;
	padding: 0;
}

.studios-article__author .wp-block-post-author__byline,
.studios-article__author .wp-block-post-author__name {
	width: auto;
	margin: 0;
	font-size: inherit;
	font-weight: inherit;
	white-space: nowrap;
}

/* Article body: comfortable long-form reading */
.studios-article > .studios-article__image {
	max-width: min(1000px, 100%);
	margin-bottom: var(--wp--preset--spacing--small);
}

.studios-article > .studios-article__image img {
	border-radius: 4px;
}

.studios-article > .studios-article__content {
	max-width: none;
	color: var(--wp--preset--color--primary-alt-accent);
	font-size: var(--wp--preset--font-size--base);
	line-height: 1.75;
}

.studios-article__content > h2,
.studios-article__content > h3,
.studios-article__content > h4 {
	margin-top: var(--wp--preset--spacing--large);
	margin-bottom: 0;
	line-height: 1.25;
}

.studios-article__content > h2 {
	font-size: var(--wp--preset--font-size--large);
}

.studios-article__content > h3 {
	font-size: var(--wp--preset--font-size--medium-large);
}

.studios-article__content > h2 + *,
.studios-article__content > h3 + *,
.studios-article__content > h4 + * {
	margin-top: 0.75rem;
}

.studios-article__content a:where(:not(.wp-element-button)) {
	color: var(--wp--preset--color--gold-deep);
	text-decoration: underline;
	text-underline-offset: 0.18em;
}

.studios-article__content a:where(:not(.wp-element-button)):hover {
	color: var(--wp--preset--color--main);
}

.studios-article__content .wp-block-list > li {
	margin-bottom: 0.375rem;
}

.studios-article__content .wp-block-quote {
	margin-left: 0;
	padding: 0.25rem 0 0.25rem var(--wp--preset--spacing--medium);
	border-left: 3px solid var(--wp--preset--color--primary);
	color: var(--wp--preset--color--main);
	font-size: var(--wp--preset--font-size--medium);
	font-style: normal;
}

.studios-article__content .wp-block-quote cite {
	display: block;
	margin-top: 0.5rem;
	color: var(--wp--preset--color--secondary);
	font-size: var(--wp--preset--font-size--small);
	font-style: normal;
}

.studios-article__content .wp-block-table {
	overflow-x: auto;
}

.studios-article__content .wp-block-table table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--wp--preset--font-size--small);
}

.studios-article__content .wp-block-table th,
.studios-article__content .wp-block-table td {
	padding: 0.625rem 0.75rem;
	border: 1px solid var(--wp--preset--color--border-light);
	text-align: left;
	vertical-align: top;
}

.studios-article__content .wp-block-table thead th,
.studios-article__content .wp-block-table th {
	background: var(--wp--preset--color--tertiary);
	color: var(--wp--preset--color--main);
	font-weight: 600;
}

/* Code wraps instead of scrolling, so it stays readable and needs no keyboard scrolling. */
.studios-article__content .wp-block-code,
.studios-article__content pre {
	white-space: pre-wrap;
	overflow-wrap: anywhere;
	padding: var(--wp--preset--spacing--small) var(--wp--preset--spacing--medium);
	border-radius: 4px;
	background: var(--wp--preset--color--main);
	color: #E8ECF3;
	font-size: 0.9rem;
	line-height: 1.6;
}

.studios-article__content pre > code {
	display: block;
	overflow: visible;
	white-space: inherit;
	overflow-wrap: inherit;
}

.studios-article__content :not(pre) > code {
	padding: 0.1em 0.35em;
	border-radius: 3px;
	background: var(--wp--preset--color--tertiary);
	font-size: 0.92em;
}

.studios-article__content .wp-block-file {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1rem;
	padding: var(--wp--preset--spacing--small) var(--wp--preset--spacing--medium);
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 4px;
	background: var(--wp--preset--color--tertiary);
}

.studios-article__content .wp-block-image img {
	border-radius: 4px;
}

.studios-article__content .wp-element-caption,
.studios-article__content figcaption {
	color: var(--wp--preset--color--secondary);
	font-size: var(--wp--preset--font-size--x-small);
}

.studios-article__footer > * {
	margin: 0;
}

.studios-article__terms,
.studios-article__explore {
	color: var(--wp--preset--color--secondary);
}

.studios-article__footer a {
	color: var(--wp--preset--color--gold-deep);
	text-decoration: underline;
	text-underline-offset: 0.18em;
}

.studios-article__footer a:hover,
.studios-article__footer a:focus-visible {
	color: var(--wp--preset--color--main);
}

.studios-article__back a {
	display: inline-block;
	padding-block: 0.375rem;
	font-weight: 600;
}

@media (prefers-reduced-motion: reduce) {
	.studios-post-card,
	.studios-topic-card,
	.studios-post-card__more::after,
	.studios-topic-card::after {
		transition: none !important;
	}
}

/* ==========================================================================
   Legal pages (Privacy Policy, Terms of Use)
   ========================================================================== */

.studios-legal-header .studios-legal__updated {
	margin-top: var(--wp--preset--spacing--small);
}

/* Align the lead with the title instead of centring its narrower measure. */
.studios-legal-header > .studios-hero__lead {
	max-width: var(--wp--style--global--content-size);
}

.studios-legal {
	color: var(--wp--preset--color--primary-alt-accent);
}

.studios-legal > .wp-block-heading {
	margin-top: var(--wp--preset--spacing--large);
	margin-bottom: 0;
	scroll-margin-top: 1.5rem;
}

.studios-legal > .wp-block-heading + * {
	margin-top: 0.75rem;
}

.studios-legal > p,
.studios-legal > .wp-block-list {
	line-height: 1.7;
}

.studios-legal > .wp-block-list {
	padding-left: 1.25rem;
}

.studios-legal > .wp-block-list > li {
	margin: 0 0 0.375rem;
}

.studios-legal a:where(:not(.wp-element-button)) {
	color: var(--wp--preset--color--gold-deep);
	text-decoration: underline;
	text-underline-offset: 0.18em;
}

.studios-legal a:where(:not(.wp-element-button)):hover {
	color: var(--wp--preset--color--main);
}

.wp-block-group.studios-legal__toc {
	padding: var(--wp--preset--spacing--medium);
	border-radius: 4px;
}

.studios-legal__toc-label {
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.studios-legal__toc-list.wp-block-list {
	margin: 0.5rem 0 0;
	padding: 0;
	list-style: none;
	font-size: var(--wp--preset--font-size--small);
	columns: 1;
	column-gap: var(--wp--preset--spacing--medium);
}

.studios-legal__toc-list.wp-block-list > li,
.studios-legal__toc-list.wp-block-list > li:first-child {
	break-inside: avoid;
	margin: 0;
	padding: 0.3rem 0;
}

.studios-legal .studios-legal__toc-list a {
	color: var(--wp--preset--color--main);
	text-decoration: none;
}

.studios-legal .studios-legal__toc-list a:hover,
.studios-legal .studios-legal__toc-list a:focus-visible {
	color: var(--wp--preset--color--gold-deep);
	text-decoration: underline;
}

@media (min-width: 600px) {
	.studios-legal__toc-list.wp-block-list {
		columns: 2;
	}
}

.wp-block-group.studios-legal__contact {
	margin-top: var(--wp--preset--spacing--large);
	padding: var(--wp--preset--spacing--medium);
}

.studios-legal__contact > .wp-block-heading {
	margin: 0;
}

.studios-legal__contact-list.wp-block-list {
	margin: 0.5rem 0 0;
	padding: 0;
	list-style: none;
}

.studios-legal__contact-list.wp-block-list > li {
	margin: 0 0 0.25rem;
}

/* Mission values: 1 → 2 → 4 columns, equal heights */
.wp-block-group.studios-value-grid {
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 600px) {
	.wp-block-group.studios-value-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.wp-block-group.studios-value-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

.wp-block-group.studios-value-card {
	justify-content: flex-start;
	height: 100%;
	padding: var(--wp--preset--spacing--medium);
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 4px;
	text-align: center;
}

.studios-value-card > * {
	margin-block: 0;
}

.studios-value-card .studios-icon-disc {
	margin-bottom: 0.5rem;
}

/* Larger gold-on-navy icon discs, as in the mockup. */
.studios-value-card .studios-icon-disc.wp-block-image {
	width: 4.5rem;
	height: 4.5rem;
}

.studios-value-card .studios-icon-disc.wp-block-image img {
	width: 2.25rem;
	height: 2.25rem;
}

.studios-pillar-row .studios-icon-disc.wp-block-image {
	width: 4rem;
	height: 4rem;
}

.studios-pillar-row .studios-icon-disc.wp-block-image img {
	width: 2rem;
	height: 2rem;
}

/* About CTA (per mockup): navy behind the copy, sunset city and silhouette left visible on the right. */
@media (min-width: 1024px) {
	.studios-split-cta.wp-block-cover {
		background-color: #0B1424;
	}

	.studios-split-cta .wp-block-cover__image-background {
		left: auto !important;
		right: 0;
		width: 64% !important;
	}

	.studios-hero--page.studios-split-cta .wp-block-cover__background.has-midnight-fade-gradient-background {
		background:
			linear-gradient(90deg, rgba(11, 20, 36, 1) 0%, rgba(11, 20, 36, 0.96) 38%, rgba(16, 28, 48, 0.45) 50%, rgba(16, 28, 48, 0) 62%),
			linear-gradient(0deg, rgba(7, 14, 26, 0.35) 0%, rgba(7, 14, 26, 0) 30%) !important;
	}
}

.studios-split-cta__aside.wp-block-column {
	display: flex;
	justify-content: flex-end;
}

.studios-split-cta__aside .studios-hero__tagline {
	text-shadow: 0 1px 12px rgba(7, 14, 26, 0.7);
}

/* Narrower desktops: keep the photo clear of the longer headline line. */
@media (min-width: 1024px) and (max-width: 1279.98px) {
	.studios-split-cta .wp-block-cover__image-background {
		width: 44% !important;
	}

	.studios-hero--page.studios-split-cta .wp-block-cover__background.has-midnight-fade-gradient-background {
		background: linear-gradient(90deg, rgba(11, 20, 36, 1) 0%, rgba(11, 20, 36, 0.96) 58%, rgba(16, 28, 48, 0.4) 66%, rgba(16, 28, 48, 0) 76%) !important;
	}
}

@media (max-width: 1023.98px) {
	.studios-split-cta__aside.wp-block-column {
		justify-content: flex-start;
	}
}

/* Our Story band (per mockup): copy on navy, summit photo on the right with a diagonal reveal. */
.studios-story__copy {
	padding-left: max(var(--wp--preset--spacing--medium), calc((100vw - var(--wp--style--global--wide-size)) / 2));
	padding-right: var(--wp--preset--spacing--medium);
}

.studios-story__copy > * {
	margin-block: 0;
}

.studios-story__copy > * + * {
	margin-top: 1rem;
}

.studios-story__copy > .wp-block-heading {
	margin-top: var(--wp--preset--spacing--small);
	margin-bottom: 0.5rem;
}

.studios-story__media {
	position: relative;
	min-height: 22rem;
}

.studios-story__media::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(100deg, #101C30 0%, #101C30 8%, rgba(16, 28, 48, 0.55) 14%, rgba(16, 28, 48, 0) 26%);
	pointer-events: none;
}

.studios-story__media .studios-fill-image img {
	object-position: 60% 50%;
}

.studios-story__tagline {
	position: absolute;
	right: var(--wp--preset--spacing--medium);
	bottom: var(--wp--preset--spacing--medium);
	z-index: 2;
	text-shadow: 0 1px 10px rgba(7, 14, 26, 0.7);
}

.studios-story__tagline p {
	margin: 0;
}

@media (max-width: 781px) {
	.studios-story__media {
		min-height: 18rem;
	}

	.studios-story__media::before {
		background: linear-gradient(180deg, #101C30 0%, rgba(16, 28, 48, 0) 22%);
	}
}

/* Foundation pillars: 1 → 2 → 4 columns with dividers */
.wp-block-group.studios-pillar-row {
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 600px) {
	.wp-block-group.studios-pillar-row {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1240px) {
	.wp-block-group.studios-pillar-row {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.studios-pillar-row > .studios-principle + .studios-principle {
		padding-left: var(--wp--preset--spacing--medium);
		border-left: 1px solid var(--wp--preset--color--border-light);
	}
}

.studios-pillar-row .studios-service-card__title {
	margin-bottom: 0.375rem;
	line-height: 1.3;
}

/* What We Build cards: image beside text on wide screens, stacked below 1024px */
.wp-block-group.studios-build-grid {
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 1024px) {
	.wp-block-group.studios-build-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.wp-block-group.studios-build-card {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 4px;
}

@media (min-width: 600px) {
	.wp-block-group.studios-build-card {
		grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	}
}

.studios-build-card__media.wp-block-image {
	height: 100%;
	min-height: 12rem;
	margin: 0;
}

.studios-build-card__media.wp-block-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.studios-build-card__body {
	display: flex;
	flex-direction: column;
}

.studios-build-card__body > * {
	margin-block: 0;
}

.studios-build-card__body .studios-card-link {
	margin-top: auto;
	padding-top: 0.75rem;
}

.studios-build-card .studios-card-link a {
	color: var(--wp--preset--color--gold-deep);
}

.studios-build-card__body p:not(.studios-card-link) a {
	color: var(--wp--preset--color--main);
	text-decoration-color: var(--wp--preset--color--primary);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
}

.studios-build-card__body p:not(.studios-card-link) a:hover,
.studios-build-card__body p:not(.studios-card-link) a:focus-visible {
	color: var(--wp--preset--color--gold-deep);
}

/* ==========================================================================
   Motion preferences
   ========================================================================== */

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