/*
Theme Name: blank space
Description: A custom block theme scaffolded by Studio Code.
Requires at least: 6.7
Tested up to: 6.9
Requires PHP: 7.4
Version: 0.1.16
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: blankspace
Tags: full-site-editing, block-patterns, block-styles, wide-blocks, accessibility-ready, style-variations
*/

/* WordPress inserts a margin-block-start equal to the block gap (24px unless
   theme.json sets styles.spacing.blockGap) between the template's top-level
   sections (header part, main, footer part) — a gap that exists even when no
   markup asks for it. Zero it so sections butt edge-to-edge and own their
   vertical rhythm via padding; this does not affect block gaps inside nested
   layouts. */
.wp-site-blocks > * + * {
	margin-block-start: 0;
}

/* With that gap gone, main carries its own vertical padding so templates this
   theme does not author (WooCommerce shop, product, cart…) still clear the
   header and footer. A descendant selector, not a child one: WooCommerce wraps
   the single-product main in an extra group. Templates built from full-bleed
   sections opt out with is-flush and let the sections own the rhythm. */
.wp-site-blocks main {
	padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--70);
}
.wp-site-blocks main.is-flush {
	padding-block: 0;
}

:root { --bs-muted: var(--wp--preset--color--contour); --bs-brand-gap: 16px; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; }
.wp-site-blocks main { padding-block: 64px 100px; }
.wp-site-blocks main.is-flush { padding-block: 0; }
.wp-block-post-content > * { margin-block-start: 0; }
.wp-block-group > :first-child { margin-block-start: 0; }
img { max-width: 100%; height: auto; }
a { text-underline-offset: .24em; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
/* The policy owns a reading measure, without changing the homepage grid. */
.wp-site-blocks main.privacy-page { padding-block: clamp(40px,5vw,72px) clamp(72px,7vw,112px); }
.privacy-page .privacy-return { margin-block: 0 24px; font-size: 16px; }
.privacy-return a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; text-decoration: none; }
.privacy-return a:hover { text-decoration: underline; text-decoration-color: var(--wp--preset--color--gold); text-decoration-thickness: 1px; }
.privacy-return a:before { content: ''; flex: 0 0 10px; width: 10px; height: 16px; background: currentColor; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 20'%3E%3Cpath d='m9 3-6 7 6 7' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.privacy-page .privacy-title { margin-block: 0 40px; overflow-wrap: anywhere; }
.privacy-content { font-size: clamp(16px,1.25vw,18px); line-height: 1.7; overflow-wrap: anywhere; }
/* A separate face keeps the new Bold weight from changing other site labels. */
.privacy-content .privacy-updated { font-family: var(--wp--preset--font-family--space-mono-bold); font-size: clamp(12px,1.05vw,16px); font-weight: 700; line-height: 1.5; letter-spacing: .035em; text-transform: uppercase; color: var(--bs-muted); }
.privacy-content > * { margin-block: 0 1.25em; }
.privacy-content :is(h2,h3,h4) { margin-block: 2em .65em; line-height: 1.3; }
.privacy-content h2 { font-family: var(--wp--preset--font-family--space-grotesk); font-size: var(--wp--preset--font-size--secondary); font-weight: 500; }
.privacy-content h3 { font-size: 1.1em; }
.privacy-content > :first-child { margin-top: 0; }
.privacy-content > :last-child { margin-bottom: 0; }
.footer-privacy a { display: inline-flex; align-items: center; min-height: 44px; }
.footer-privacy a:hover { text-decoration: underline; text-decoration-color: var(--wp--preset--color--gold); }
html[data-darkreader-scheme="dark"] .footer-privacy a:focus-visible { outline-color: currentColor; }
.site-header { position: relative; z-index: 2; padding-block: 52px 36px; }
.header-inner { gap: 32px; }
.brand,.footer-brand-lockup { gap: var(--bs-brand-gap); }
.brand-mark { margin: 0; flex: 0 0 36px; }
.brand-mark img { display: block; width: 36px; }
.brand-name { margin: 0; font-family: var(--wp--preset--font-family--space-grotesk); font-size: 28px; font-weight: 500; white-space: nowrap; }
.brand-name a { text-decoration: none; }
.primary-navigation .wp-block-navigation__container { gap: clamp(32px,5.2vw,84px); }
.primary-navigation a { min-height: 44px; display: flex; align-items: center; text-decoration: none; }
.primary-navigation a:hover { text-decoration: underline; }
/* Keep the native template part in flow: sticky adds no spacer or layout shift. */
.wp-site-blocks > header.wp-block-template-part { position: sticky; top: var(--wp-admin--admin-bar--height,0px); z-index: 50; pointer-events: none; }
.site-header { --bs-navigation-foreground: var(--wp--preset--color--primary); --bs-navigation-surface: var(--wp--preset--color--background); --bs-navigation-indicator: #897F64; --bs-navigation-lift: 32px; --bs-navigation-shift: 0px; --bs-navigation-left-alpha: .75; --bs-navigation-right-alpha: .90; --bs-navigation-center-alpha: 0; color: var(--bs-navigation-foreground); }
.site-header[data-surface="dark"] { --bs-navigation-foreground: var(--wp--preset--color--background); --bs-navigation-surface: var(--wp--preset--color--primary); --bs-navigation-indicator: var(--wp--preset--color--gold); }
/* Two side fields share one mask so their opacity cannot compound. Their
   inner regions cover the controls; the horizontal and vertical fades multiply.
   Geometry follows navigation bounds only, never passing page content. */
.site-header:before { content: ''; position: absolute; z-index: -1; inset: 0 0 auto; height: var(--bs-navigation-field-height,184px); pointer-events: none; opacity: 0; background: var(--bs-navigation-wash,var(--bs-navigation-surface)); mask-image: linear-gradient(90deg,rgba(0,0,0,var(--bs-navigation-left-alpha)) var(--bs-navigation-field-left,28%),rgba(0,0,0,var(--bs-navigation-center-alpha)) var(--bs-navigation-field-center,50%),rgba(0,0,0,var(--bs-navigation-right-alpha)) var(--bs-navigation-field-right,72%)),linear-gradient(180deg,#000 var(--bs-navigation-field-bottom,104px),transparent 100%); mask-composite: intersect; transition: opacity 200ms ease-out; }
.site-header[data-scrolled="true"] { --bs-navigation-shift: calc(-1 * var(--bs-navigation-lift)); }
.site-header[data-scrolled="true"]:before { opacity: 1; }
/* Move the whole painted header without changing its in-flow footprint.
   Focus reveals immediately, before an offscreen control can retain focus.
   Remove the transform entirely for core's viewport-fixed mobile dialog. */
.site-header { transition: transform 200ms ease-out; }
.site-header[data-hidden="true"] { transform: translateY(calc(-1 * var(--bs-navigation-hide-distance,220px))); }
.site-header:focus-within,.site-header:has(.is-menu-open) { transform: none; transition: none; }
/* Move only controls: transforming their ancestor would contain core's fixed modal. */
.site-header .brand,.site-header nav.primary-navigation > .wp-block-navigation__responsive-container-open,.site-header nav.primary-navigation > .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-container-content { transform: translateY(var(--bs-navigation-shift)); transition: transform 200ms ease-out; }
@media(max-width:900px) { .site-header { --bs-navigation-lift: 28px; --bs-navigation-right-alpha: .75; } }
/* On phones the controls nearly fill the row: overlap the feathers gently
   through the narrow middle instead of cutting a bright channel into photos. */
@media(max-width:700px) { .site-header { --bs-navigation-lift: 14px; --bs-navigation-center-alpha: .525; } }
/* Empty header space must not block the page's links or form controls. */
.site-header[data-navigation-ready="true"] { pointer-events: none; }
.site-header :is(a,button),.primary-navigation .is-menu-open { pointer-events: auto; }
.site-header :is(a,button):focus-visible { outline-color: var(--bs-navigation-foreground); }
.primary-navigation .is-menu-open :is(a,button):focus-visible { outline-color: var(--wp--preset--color--primary); }
.site-header .brand-name a,.site-header .primary-navigation { color: var(--bs-navigation-foreground); }
.site-header .brand-name a { color: var(--bs-navigation-local-foreground,var(--bs-navigation-foreground)); }
.site-header .brand-mark { position: relative; }
.site-header .brand-mark img { visibility: hidden; }
.site-header .brand-mark:after { content: ''; position: absolute; inset: 0; background: var(--bs-navigation-ink,var(--bs-navigation-foreground)); mask: var(--bs-logo-artwork,url('assets/art/logo.svg')) center / contain no-repeat; pointer-events: none; }
.primary-navigation a { color: inherit; font-weight: 400; }
.primary-navigation .wp-block-navigation__responsive-container-open { color: var(--bs-navigation-foreground); position: relative; }
.primary-navigation .wp-block-navigation__responsive-container-open svg { visibility: hidden; }
.primary-navigation .wp-block-navigation__responsive-container-open:after { content: ''; position: absolute; left: 50%; top: 50%; width: 32px; height: 32px; transform: translate(-50%,-50%); background: var(--bs-navigation-ink,var(--bs-navigation-foreground)); mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M4 9h24v2H4zm0 12h24v2H4z'/%3E%3C/svg%3E") center / contain no-repeat; pointer-events: none; }
@media(forced-colors:active) {
 /* Preserve monochrome masks in system ink, without opting out controls or text. */
 .site-header .brand-mark:after,.site-footer .footer-brand-mark:after,.primary-navigation .wp-block-navigation__responsive-container-open:after { background: CanvasText; forced-color-adjust: none; }
}
.site-header .primary-navigation .is-menu-open a { color: var(--wp--preset--color--primary); }
.primary-navigation a[aria-current="location"] { font-weight: 500; }
.primary-navigation .wp-block-navigation-item__label { position: relative; display: inline-block; white-space: nowrap; color: var(--bs-navigation-local-foreground,inherit); }
.site-header .navigation-crossing:is(a,.wp-block-navigation-item__label) { color: transparent; background: var(--bs-navigation-ink); background-clip: text; -webkit-background-clip: text; }
.primary-navigation .is-menu-open .wp-block-navigation-item__label { color: inherit; background: none; }
.primary-navigation .wp-block-navigation-item__label:before { content: attr(data-navigation-label); display: block; height: 0; visibility: hidden; font-weight: 500; }
.primary-navigation a[aria-current="location"] .wp-block-navigation-item__label:after { content: ''; position: absolute; left: 50%; bottom: -10px; width: calc(100% + 6px); height: 2px; background: var(--bs-navigation-indicator); transform: translateX(-50%); }
.primary-navigation .is-menu-open a[aria-current="location"] .wp-block-navigation-item__label:after { bottom: 0; width: 100%; background: #897F64; }
/* Dark Reader can transform explicit color roles, but not the JS color/gradient
   shorthand reliably. Keep the normal split paint; use readable solid ink here. */
html[data-darkreader-scheme="dark"] .site-header:before {
 background-image: none;
 background-color: var(--bs-navigation-surface);
}
html[data-darkreader-scheme="dark"] .site-header .brand-mark:after,
html[data-darkreader-scheme="dark"] .primary-navigation .wp-block-navigation__responsive-container-open:after { background: currentColor; }
html[data-darkreader-scheme="dark"] .site-header .navigation-crossing:is(a,.wp-block-navigation-item__label) {
 color: var(--bs-navigation-foreground);
 background: none;
}
html[data-darkreader-scheme="dark"] .site-header :is(a,button):focus-visible { outline-color: currentColor; }
html[data-darkreader-scheme="dark"] .primary-navigation a[aria-current="location"] .wp-block-navigation-item__label:after {
 color: var(--wp--preset--color--gold);
 background: currentColor;
}
:where(.hero,.services-section,.experience-section,.contact-section)[id] { scroll-margin-top: var(--bs-navigation-anchor-offset,var(--bs-navigation-clearance,100px)); }
.blankspace-contact-form :is(input,textarea) { scroll-margin-top: calc(var(--bs-navigation-clearance,100px) + 12px); }
.hero { position: relative; isolation: isolate; padding-block: 100px 92px; }
/* Clip and fade the field independently of its rotated vector canvas.
   This absolute, final child is exempt from WordPress's editorial measure. */
.hero .hero-artwork { position: absolute; z-index: -1; inset: -150px 0 0; max-width: none; margin: 0; overflow: clip; mask-image: linear-gradient(180deg,black calc(80% + 30px),transparent); pointer-events: none; }
.hero-artwork:before { content: ''; position: absolute; left: calc(50% + min(22vw,520px)); top: 46%; width: clamp(1350px,100vw,2000px); aspect-ratio: 1000 / 2196; background: var(--bs-hero-artwork,url('assets/art/lagrange-complete-contours.svg')) center / contain no-repeat; transform: translate(-50%,-50%) rotate(-28deg); transform-origin: center; opacity: .4; mask-image: linear-gradient(90deg,transparent,black 5%,black 95%,transparent); }
@media(700px < width <= 1100px) {
 .hero-artwork:before { left: 76%; top: 54%; width: 1400px; }
 .hero .hero-copy { max-width: 680px; }
}
/* Quiet the smaller-screen reading area without moving the eye or fading text.
   This wash shares the artwork layer's existing top and bottom masks. */
@media(max-width:1100px) {
 .hero-artwork:after { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 105% 55% at 5% 40%,color-mix(in srgb,var(--wp--preset--color--background) 85%,transparent),color-mix(in srgb,var(--wp--preset--color--background) 60%,transparent) 40%,transparent 100%); }
}
.hero-eyebrow { font-family: var(--wp--preset--font-family--space-mono); font-size: clamp(18px,1.3vw,20px); color: var(--bs-muted); margin-bottom: 46px; }
.hero-title { font-size: var(--wp--preset--font-size--display); font-weight: 400; line-height: 1.25; letter-spacing: -.025em; max-width: 1000px; }
.hero-title strong { font-weight: 700; }
.hero-copy { max-width: 770px; margin-block: 60px 0; color: var(--bs-muted); }
.hero-actions { margin-block: 64px 0; }
.hero-actions .wp-element-button { display: inline-flex; gap: 20px; align-items: center; }
.hero-actions .wp-element-button:focus-visible { outline-color: var(--wp--preset--color--primary); }
.hero-actions span { font-size: 28px; line-height: 1; }
.direction-chevron { color: transparent; background: center / 100% 12px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 12'%3E%3Cpath d='m3 3 7 6 7-6' fill='none' stroke='%23F4F1E9' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.hero-reassurance { font-size: clamp(14px,1.2vw,18px); color: var(--bs-muted); margin-block: 44px 0; }
.site-footer { padding-block: clamp(72px,5.5vw,88px) 43px; border: 0; font-size: 16px; line-height: 1.5; }
.site-footer.has-global-padding { padding-inline: clamp(28px,7.5vw,120px); }
.footer-inner { font-size: 16px; }
.footer-inner p { margin: 0; }
.footer-main { grid-template-columns: minmax(0,1.57fr) minmax(0,1fr) minmax(0,1.02fr); gap: 0; align-items: start; }
.footer-main > * { min-width: 0; margin: 0; }
.footer-brand-lockup { position: relative; width: max-content; max-width: 100%; min-height: 44px; font-size: clamp(28px,2vw,32px); }
.footer-brand { font-family: var(--wp--preset--font-family--space-grotesk); font-size: inherit; font-weight: 500; line-height: 1.25; white-space: nowrap; }
.footer-brand a { text-decoration: none; }
.footer-brand a:after { content: ''; position: absolute; inset: 0; }
.site-footer .footer-brand a:focus-visible { outline: none; }
.footer-brand a:focus-visible:after { outline: 2px solid var(--wp--preset--color--gold); outline-offset: 4px; }
.footer-brand-mark { position: relative; flex: 0 0 1.125em; margin: 0; }
.footer-brand-mark img { display: block; width: 100%; visibility: hidden; }
.footer-brand-mark:after { content: ''; position: absolute; inset: 0; background: currentColor; mask: var(--bs-logo-artwork,url('assets/art/logo.svg')) center / contain no-repeat; pointer-events: none; }
.footer-identity .footer-descriptor { margin-top: 11px; font-size: clamp(15px,1.125vw,18px); color: var(--wp--preset--color--soft); }
.footer-label { font-family: var(--wp--preset--font-family--space-mono); font-size: 13px; font-weight: 400; line-height: 26px; color: var(--wp--preset--color--gold); }
.footer-contact .footer-email,.footer-availability .footer-value { margin-top: 14px; }
.site-footer a { color: inherit; }
.footer-email a { display: inline-block; max-width: 100%; min-height: 44px; padding-block: 10px; overflow-wrap: anywhere; text-decoration: underline; text-decoration-color: var(--wp--preset--color--divider); text-decoration-thickness: 1px; text-underline-offset: .6em; }
.footer-value { padding-block: 10px; }
.footer-inner .footer-utility { margin-top: clamp(64px,10.125vw,162px); padding-top: 20px; border-top: 1px solid color-mix(in srgb,var(--wp--preset--color--divider) 50%,transparent); gap: 0 clamp(32px,7.5vw,120px); align-items: center; font-size: 14px; color: var(--wp--preset--color--soft); }
.footer-utility > * { max-width: 100%; }
.footer-utility .footer-copyright { margin-right: auto; overflow-wrap: anywhere; }
.footer-return a { display: inline-flex; align-items: center; min-height: 44px; gap: 16px; padding-right: 6px; color: var(--wp--preset--color--light); text-decoration: none; white-space: nowrap; }
.footer-return a:after { content: ''; flex: 0 0 16px; width: 16px; height: 12px; background: center / 16px 10px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 12'%3E%3Cpath d='m3 9 7-6 7 6' fill='none' stroke='%23B3AB91' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.site-footer a:focus-visible { outline: 2px solid var(--wp--preset--color--gold); outline-offset: 4px; }
@media(max-width:900px) {
 .footer-main { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 40px 32px; }
 .footer-identity { grid-column: 1 / -1; }
}
@media(max-width:700px) {
 .site-footer { padding-block: 72px 73px; }
 .site-footer.has-global-padding { padding-inline: 28px; }
 .footer-main { grid-template-columns: minmax(0,1fr); gap: 42px; }
 .footer-brand-lockup { font-size: 28px; }
 .footer-identity .footer-descriptor { margin-top: 14px; font-size: 15px; }
 .footer-contact .footer-email,.footer-availability .footer-value { margin-top: 1px; }
 .footer-inner .footer-utility { margin-top: 54px; gap: 0 24px; font-size: 13px; }
 .footer-privacy { order: 3; flex-basis: 100%; }
 .footer-return { order: 2; }
 .footer-return a { gap: 14px; padding-right: 0; }
}
.prior-work-link a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
/* One inner rule spans the words, icon and gap without moving the 44px target. */
.underlined-link-content { display: inline-flex; align-items: center; gap: 8px; padding-bottom: 3px; border-bottom: 1px solid currentColor; }
@media(max-width: 700px) {
 .site-header { padding-block: 28px 20px; }
 .header-inner { gap: 20px; }
 .site-header .header-inner { flex-wrap: wrap; }
 .site-header .primary-navigation { margin-inline-start: auto; }
 :root { --bs-brand-gap: 12px; }
 .brand-mark { flex-basis: 28px; }
 .brand-mark img { width: 28px; }
 .brand-name { font-size: 24px; }
 .primary-navigation .wp-block-navigation__responsive-container-open { min-width: 44px; min-height: 44px; }
 .primary-navigation .wp-block-navigation__responsive-container-open svg { width: 32px; height: 32px; }
 .hero { padding-block: 24px 40px; }
 .hero .hero-artwork { inset: 0; mask-image: linear-gradient(180deg,transparent 8%,black 50%,black 88%,transparent); }
 .hero-artwork:before { left: 72%; top: 63%; width: clamp(1000px,310vw,1700px); opacity: .55; }
 .hero-eyebrow { font-size: 14px; margin-bottom: 32px; text-wrap: balance; }
 .hero-title { font-size: clamp(37px,10.5vw,56px); line-height: 1.25; letter-spacing: -.02em; }
 .hero-title strong { display: block; margin-top: 8px; max-inline-size: 6em; }
 .hero-copy { margin-top: 32px; font-size: 16px; }
 .hero-actions { margin-top: 32px; }
 .hero-actions .wp-element-button { font-size: clamp(16px,4.2vw,22px); padding: 16px 20px; }
 .hero-actions span { font-size: 24px; }
 .hero-reassurance { margin-top: 30px; line-height: 1.6; }
 .primary-navigation .is-menu-open { background: var(--wp--preset--color--background); padding: 32px; }
 .primary-navigation .is-menu-open a { font-size: 28px; }
}
/* Portrait phones: fill the initial small viewport together with the 92px
   in-flow header. Stay stable as browser bars retract, and let longer/larger
   text grow beyond one screen without clipping. */
@media(max-width:700px) and (orientation:portrait) {
 .hero { min-height: calc(100svh - 92px); display: grid; align-content: center; }
 .hero-eyebrow { margin-bottom: clamp(32px,5svh,48px); }
 .hero-copy { margin-top: clamp(32px,5svh,48px); }
 .hero-actions { margin-top: clamp(32px,4svh,40px); }
}
/* Match the navigation transition to available space, rather than core's 600px default. */
@media(max-width:900px) {
 .primary-navigation > .wp-block-navigation__responsive-container-open { display: flex; min-width: 44px; min-height: 44px; }
 .primary-navigation .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none; }
 .primary-navigation .is-menu-open { background: var(--wp--preset--color--background); color: var(--wp--preset--color--primary); padding: 32px; }
 .primary-navigation .is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start; }
 .primary-navigation .is-menu-open .wp-block-navigation__container { align-items: flex-start; }
 .primary-navigation .is-menu-open a { font-size: 28px; }
 .primary-navigation .wp-block-navigation__responsive-container-close { min-width: 44px; min-height: 44px; }
 .primary-navigation .wp-block-navigation__responsive-container-open { align-items: center; justify-content: center; }
 .primary-navigation .wp-block-navigation__responsive-container-open svg { width: 32px; height: 32px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } *, *:before, *:after { animation: none !important; transition: none !important; } }

.services-section { --service-art-size: clamp(220px,20vw,280px); padding-block: clamp(64px,6vw,96px) clamp(72px,6vw,100px); }
.section-eyebrow { font-family: var(--wp--preset--font-family--space-mono); font-size: clamp(var(--wp--preset--font-size--label),1.05vw,16px); font-weight: 400; line-height: 1.5; letter-spacing: .035em; margin-bottom: 22px; }
.section-title { font-size: var(--wp--preset--font-size--headline); letter-spacing: -.025em; }
.section-intro { margin-block: 24px 0; max-width: 1000px; color: var(--bs-muted); }
.services-grid { max-width: var(--wp--style--global--wide-size); gap: clamp(44px,4vw,64px) clamp(48px,5vw,80px); margin-top: 24px; }
.is-style-service { gap: 8px; align-content: start; }
.service-art { margin: 0 0 8px; }
.service-art img { display: block; width: min(100%,var(--service-art-size)); aspect-ratio: 360 / 220; object-fit: contain; }
.service-title { font-family: var(--wp--preset--font-family--space-grotesk); font-size: var(--wp--preset--font-size--secondary); font-weight: 500; line-height: 1.25; }
.service-copy { max-width: 48ch; margin: 0; color: var(--bs-muted); }
/* Align the visible diagrams, retaining their original geometry and scale.
   Explore alone has substantial internal lower whitespace in its source canvas. */
@media(width > 700px) {
 .services-grid .service-art img { object-position: left bottom; }
 .services-grid > .is-style-service:first-child .service-art img { object-position: left calc(100% + var(--service-art-size) * .06); }
}
@media(max-width:700px) {
 .services-section { --service-art-size: clamp(96px,28vw,128px); padding-block: 56px 64px; }
 .section-eyebrow { margin-bottom: 20px; }
 .section-title { font-size: clamp(32px,8vw,42px); line-height: 1.16; }
 .section-intro { font-size: 16px; line-height: 1.7; margin-top: 24px; }
 .services-grid { grid-template-columns: minmax(0,1fr); gap: 0; margin-top: 28px; }
 .is-style-service { grid-template-columns: minmax(0,var(--service-art-size)) minmax(0,1fr); gap: 20px; padding-block: 28px 24px; border-top: 1px solid var(--wp--preset--color--soft); align-items: center; }
 .service-art { margin: 0; }
 .service-title { font-size: 20px; overflow-wrap: anywhere; }
 .service-copy { grid-column: 1 / -1; font-size: 16px; line-height: 1.6; }
}

/* Services side-rail experiment: pair the text at wider single-column widths. */
@media(600px <= width <= 700px) {
 .services-section .is-style-service { row-gap: 8px; align-items: start; }
 .services-section .service-art { grid-column: 1; grid-row: 1 / span 2; align-self: start; }
 .services-section .service-title { grid-column: 2; grid-row: 1; }
 .services-section .service-copy { grid-column: 2; grid-row: 2; text-wrap: pretty; }
}
/* End Services side-rail experiment. */

.experience-section { background: var(--wp--preset--color--primary); color: var(--wp--preset--color--light); padding-block: clamp(56px,4vw,72px); position: relative; isolation: isolate; }
/* Keep the field full-width while its fade ends within this section.
   An explicit width prevents the height cap from shrinking the artwork. */
.experience-section:before { content: ''; position: absolute; z-index: -1; inset: 0 0 auto; width: 100%; max-height: 100%; aspect-ratio: 1536 / 865; background: var(--bs-experience-artwork,url('assets/art/experience-contours.svg')) right top / 100% auto no-repeat; opacity: .66; mask-image: linear-gradient(180deg,black 65%,transparent); pointer-events: none; }
.experience-section .section-eyebrow,.story-meta { color: var(--wp--preset--color--gold); }
.experience-intro { max-width: 600px; padding-bottom: 16px; }
.experience-intro .section-title { font-size: clamp(34px,3.3vw,54px); }
.experience-copy { font-size: clamp(16px,1.12vw,18px); color: var(--wp--preset--color--soft); margin-top: 20px; }
.is-style-story { border-top: 1px solid var(--wp--preset--color--divider); gap: 8px 24px; padding-top: 22px; align-items: start; align-content: start; grid-template-rows: min-content min-content auto; }
.story-name,.story-meta { font-family: var(--wp--preset--font-family--space-mono); font-size: 12px; margin: 0; }
.story-name { font-weight: 400; }
.story-meta { font-family: var(--wp--preset--font-family--space-mono-bold); font-size: 12px; font-weight: 700; }
.story-lead { grid-template-columns: minmax(0,.9fr) minmax(0,1.2fr); grid-template-rows: minmax(0,1fr) repeat(3,min-content) minmax(0,1fr); row-gap: 0; margin-top: 0; }
.story-lead .story-name,.story-lead .story-meta { grid-column: 1; }
/* Flexible outer tracks center the copy cluster beside the intrinsic photo;
   neither column needs a fixed height or padding to fill a missing label row. */
.story-lead .story-name { grid-row: 2; }
.story-lead .story-meta { grid-row: 3; margin-top: 4px; }
.story-lead .story-text { grid-column: 1; grid-row: 4; padding: 0; margin-top: 22px; }
.story-lead .story-image { grid-column: 2; grid-row: 1 / 6; align-self: center; }
.story-image { margin: 0; position: relative; }
.story-image > .story-photo { position: relative; margin: 0; }
.story-image > .story-credit { margin: 4px 0 0; color: color-mix(in srgb,var(--wp--preset--color--gold) 85%,var(--wp--preset--color--primary)); font-family: var(--wp--preset--font-family--space-mono); font-size: 11px; font-weight: 400; line-height: 1.5; text-align: left; text-transform: uppercase; }
.story-lead .story-image > .story-credit { text-align: right; }
.story-image img { display: block; width: 100%; height: 100%; aspect-ratio: 1.5; object-fit: cover; }
.story-lead .story-image img { height: auto; aspect-ratio: 2.04; mask-image: linear-gradient(90deg,transparent,black 10%,black 90%,transparent); }
.story-image figcaption { position: absolute; inset: auto 0 0 auto; max-width: 100%; padding: 4px 8px; background: rgba(37,37,44,.86); color: var(--wp--preset--color--light); font-family: var(--wp--preset--font-family--space-mono); font-size: 11px; text-wrap: balance; margin: 0; }
.story-image figcaption[data-align="left"] { inset-inline: 0 auto; text-align: left; }
.story-image figcaption[data-full-width] { inline-size: 100%; }
.story-title { font-size: clamp(24px,2.3vw,36px); line-height: 1.22; }
.story-lead .story-title { font-family: var(--wp--preset--font-family--space-grotesk); font-weight: 500; }
.story-copy { font-size: clamp(16px,1.12vw,18px); color: var(--wp--preset--color--soft); margin-top: 16px; }
.supporting-stories { gap: 40px; margin-top: 28px; border-top: 1px solid var(--wp--preset--color--divider); }
.story-support { grid-template-columns: minmax(0,.8fr) minmax(0,1fr); gap: 4px 24px; border-top: 0; }
.story-support .story-name,.story-support .story-meta { grid-column: 1 / -1; }
.story-support .story-image { grid-row: 3; grid-column: 1; align-self: start; margin-top: 8px; }
.story-support .story-image img { aspect-ratio: 1.3; }
.story-support .story-text { grid-row: 3; grid-column: 2; margin-top: 8px; }
.story-support .story-title { font-family: var(--wp--preset--font-family--space-grotesk); font-size: clamp(20px,1.55vw,24px); font-weight: 500; }
.story-support .story-copy { font-size: clamp(14px,.95vw,16px); margin-top: 12px; }
@media(max-width:1100px) {
 .story-support { grid-template-columns: minmax(0,1fr); }
 .story-support .story-image { grid-row: 3; }
 .story-support .story-text { grid-column: 1; grid-row: 4; }
 .story-support .story-image img { aspect-ratio: 1.5; }
}
@media(max-width:1000px) {
 .story-lead { grid-template-columns: minmax(0,1fr); grid-template-rows: min-content min-content auto auto; row-gap: 4px; }
 .story-lead .story-name { grid-row: 1; }
 .story-lead .story-meta { grid-row: 2; margin-top: 0; }
 .story-lead .story-image { grid-column: 1; grid-row: 3; margin-top: 16px; align-self: start; }
 .story-lead .story-image img { aspect-ratio: 2; height: auto; mask-image: none; }
 .story-lead .story-image > .story-credit { text-align: left; }
 .story-lead .story-text { grid-column: 1; grid-row: 4; padding-block: 10px 0; margin-top: 20px; }
}
@media(max-width:700px) {
 .experience-section { padding-block: 40px 56px; }
 .experience-section:before { aspect-ratio: auto; height: 56vw; background-size: 160% auto; opacity: 1; mask-image: linear-gradient(180deg,black,transparent); }
 .experience-intro { padding-bottom: 32px; }
 .experience-intro .section-title { font-size: clamp(32px,8vw,42px); }
 .experience-copy { font-size: 16px; line-height: 1.5; }
 .story-lead,.supporting-stories,.story-support { grid-template-columns: minmax(0,1fr); gap: 6px 0; }
 .story-lead,.story-support { row-gap: 2px; }
 .is-style-story { padding-top: 28px; padding-bottom: 30px; }
 .story-lead .story-image,.story-support .story-image { grid-column: 1; grid-row: 3; margin-top: 24px; }
 .story-lead .story-text,.story-support .story-text { grid-column: 1; grid-row: 4; padding: 0; margin-top: 20px; }
 .story-lead .story-name,.story-lead .story-meta { grid-column: 1; }
 .story-meta { margin-top: 6px; }
 .story-name { font-size: 11px; }
 .story-title,.story-support .story-title { font-size: 26px; }
 .story-copy,.story-support .story-copy { font-size: 16px; line-height: 1.5; margin-top: 20px; }
 .supporting-stories { margin-top: 0; border-top: 0; }
 .story-support { border-top: 1px solid var(--wp--preset--color--divider); }
 .story-image img { aspect-ratio: 1.5; height: auto; }
 .story-lead .story-image img { aspect-ratio: 1.5; }
}

.contact-section { padding-block: clamp(64px,7vw,112px); }
.contact-inner { grid-template-columns: minmax(0,.9fr) minmax(0,1.2fr); gap: clamp(48px,7vw,112px); align-items: center; }
.contact-narrative .section-title { max-width: 600px; margin-top: 64px; text-wrap: balance; overflow-wrap: anywhere; }
.contact-lead { color: var(--bs-muted); font-weight: 600; margin-top: 48px; }
.contact-copy { color: var(--bs-muted); margin-top: 12px; }
.prior-work-link { margin-top: 64px; font-size: clamp(15px,1.5625vw,17px); font-weight: 600; }
.prior-work-link .direction-chevron { font-size: 26px; line-height: 1; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 12'%3E%3Cpath d='m3 9 7-6 7 6' fill='none' stroke='%2325252C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.contact-inner > :is(.wp-block-contact-form-7-contact-form-selector,.contact-email-treatment) { min-width: 0; margin: 0; }
.contact-email-treatment { align-self: center; }
.contact-section .contact-inner.contact-email-layout { row-gap: 0; }
.contact-email-layout > .contact-email-treatment { grid-column: 2; grid-row: 1 / span 2; }
.contact-email-layout > .prior-work-link { grid-column: 1; grid-row: 2; margin: 64px 0 0; }
.contact-email-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-block: 0 20px; }
.contact-email-address { min-width: 0; max-width: 100%; margin: 0; font-family: var(--wp--preset--font-family--space-grotesk); font-size: clamp(18px,2.1vw,30px); font-weight: 500; line-height: 1.4; overflow-wrap: anywhere; }
.contact-email-address a { display: inline-block; min-height: 44px; padding-block: 8px; text-underline-offset: .25em; text-decoration-thickness: 1px; }
.contact-email-address a:hover { text-decoration-color: var(--wp--preset--color--gold); }
.contact-email-copy { flex: none; width: 104px; height: 44px; padding: 10px; border: 0; background: transparent; color: var(--bs-muted); font-family: var(--wp--preset--font-family--space-mono); font-size: 12px; line-height: 1.5; cursor: pointer; }
.contact-email-copy:not([hidden]) { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.contact-email-copy svg { display: block; flex: none; }
.contact-email-copy:hover { color: var(--wp--preset--color--primary); }
.contact-email-copy-label { flex: none; width: 6ch; text-align: left; }
.contact-email-copy .contact-email-check-icon,.contact-email-copy[data-copied="true"] .contact-email-copy-icon { display: none; }
.contact-email-copy[data-copied="true"] .contact-email-check-icon { display: initial; }
.contact-email-address a:focus-visible,.contact-email-copy:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.contact-email-status:not(.screen-reader-text) { margin-block: 0 16px; color: var(--bs-muted); font-size: 13px; line-height: 1.5; }
.blankspace-contact-form { display: grid; grid-template-columns: minmax(0,1fr); gap: 20px; margin: 0; align-self: center; }
.blankspace-contact-form p { margin: 0; }
.contact-fields-pair { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 20px; }
.blankspace-contact-form label { display: block; font-size: 16px; line-height: 1.5; margin: 0; min-width: 0; }
.form-field-label { display: block; margin-bottom: 8px; }
.blankspace-contact-form .wpcf7-form-control-wrap { display: block; }
.blankspace-contact-form input,.blankspace-contact-form textarea { width: 100%; background: transparent; color: var(--wp--preset--color--primary); border: 1px solid var(--wp--preset--color--contour); border-radius: 4px; font: inherit; font-size: 16px; padding: 16px; }
.blankspace-contact-form textarea { min-height: 150px; height: 150px; resize: vertical; }
.blankspace-contact-form ::placeholder { color: var(--wp--preset--color--contour); opacity: 1; }
.form-helper { color: var(--bs-muted); font-size: 13px; line-height: 1.5; }
.blankspace-contact-form .form-helper { margin-top: -12px; }
.form-actions { position: relative; justify-self: end; min-width: 0; margin-top: 16px; }
.blankspace-contact-form input[type=submit] { width: auto; min-width: 208px; min-height: 56px; padding: 16px 64px 16px 24px; background: var(--wp--preset--color--primary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 5 7 7-7 7' fill='none' stroke='%23F4F1E9' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 20px center / 24px 24px no-repeat; color: var(--wp--preset--color--light); font-weight: 600; text-align: left; white-space: normal; cursor: pointer; }
.blankspace-contact-form input[type=submit]:disabled { opacity: .65; cursor: wait; }
.form-actions .wpcf7-spinner { position: absolute; top: 16px; right: 100%; margin: 0 12px 0 0; }
.blankspace-contact-form .wpcf7-not-valid-tip { color: #8B3029; font-size: 14px; margin-top: 6px; }
.blankspace-contact-form [aria-invalid=true] { border-color: #8B3029; }
.wpcf7 form.blankspace-contact-form .wpcf7-response-output { margin: 0; padding: 12px 16px; border: 1px solid var(--wp--preset--color--contour); border-radius: 4px; font-size: 16px; }
.wpcf7 form.blankspace-contact-form.invalid .wpcf7-response-output,.wpcf7 form.blankspace-contact-form.spam .wpcf7-response-output,.wpcf7 form.blankspace-contact-form.failed .wpcf7-response-output { border-color: #8B3029; }
@media(width > 1000px) {
 .contact-inner { align-items: start; }
 .contact-inner > .wp-block-contact-form-7-contact-form-selector { margin-top: clamp(96px,9vw,144px); }
}
@media(max-width:1000px) {
 .contact-email-layout > .contact-email-treatment { grid-column: 1; grid-row: auto; margin-top: 48px; }
 .contact-email-layout > .prior-work-link { grid-column: 1; grid-row: auto; margin-top: 32px; }
}
@media(700px < width <= 1000px) {
 .contact-section .contact-inner { max-width: 760px; grid-template-columns: minmax(0,1fr); gap: 48px; }
 .contact-narrative .section-title { max-width: 680px; }
 .contact-inner > :is(.wp-block-contact-form-7-contact-form-selector,.contact-email-treatment) { max-width: 760px; width: 100%; }
 .contact-section .form-actions { justify-self: center; }
}
@media(max-width:700px) {
 .contact-inner { grid-template-columns: minmax(0,1fr); gap: 44px; }
 .contact-email-row { gap: 4px 12px; margin-bottom: 16px; }
 .contact-email-copy { width: auto; min-width: 44px; padding-inline: 0; }
 .contact-email-copy:not([hidden]) { justify-content: flex-start; gap: 4px; }
 .contact-email-layout > .contact-email-treatment { margin-top: 44px; }
 .contact-narrative .section-title { margin-top: 36px; }
 .contact-lead { margin-top: 56px; font-size: 16px; }
 .contact-copy { font-size: 16px; line-height: 1.5; }
 .prior-work-link { margin-top: 32px; font-size: 15px; font-weight: 400; }
 .contact-fields-pair { grid-template-columns: minmax(0,1fr); }
 .form-actions,.blankspace-contact-form input[type=submit] { width: 100%; }
 .form-actions .wpcf7-spinner { right: 0; }
}

/* Email-only Contact: links follow the invitation on wide screens and the email when stacked. */
.contact-section .contact-shell { container-type: inline-size; }
.contact-section .contact-shell > .section-eyebrow { margin: 0; }
.contact-section .contact-shell > .contact-inner { margin-top: 28px; }
.contact-section .contact-inner.contact-invitation { max-width: none; grid-template-columns: minmax(0,1.05fr) minmax(0,1fr); grid-template-areas: "invitation action" "more action"; gap: var(--wp--preset--spacing--sm) clamp(48px,6vw,96px); align-items: start; }
.contact-invitation .contact-narrative { grid-area: invitation; }
.contact-invitation .contact-narrative .section-title { margin-top: 0; }
.contact-invitation .contact-lead { margin-top: var(--wp--preset--spacing--md); color: var(--wp--preset--color--primary); font-family: var(--wp--preset--font-family--space-grotesk); font-size: var(--wp--preset--font-size--body); font-weight: 500; line-height: 1.5; }
.contact-invitation .contact-copy { margin-top: 12px; font-size: var(--wp--preset--font-size--body); line-height: 1.5; }
.contact-invitation .contact-action { grid-area: action; min-width: 0; margin: 0; padding-top: 0; align-self: center; }
.contact-invitation .contact-email-treatment { margin: 0; }
.contact-invitation .contact-email-row { column-gap: 4px; margin-bottom: calc(var(--wp--preset--spacing--sm) / 2); }
.contact-invitation .contact-email-address { font-family: var(--wp--preset--font-family--ibm-plex-sans); font-size: var(--wp--preset--font-size--secondary); font-weight: 600; line-height: 1.5; }
.contact-invitation .contact-email-copy { width: auto; min-width: 88px; height: auto; min-height: 44px; }
.contact-invitation .form-helper { margin: 0; max-width: 44ch; font-size: var(--wp--preset--font-size--label); line-height: 1.5; }
.contact-invitation .contact-more { grid-area: more; justify-self: start; width: fit-content; max-width: 100%; margin: 0; padding: 0; border: 0; }
.contact-invitation .contact-more-link { margin: 0; color: var(--bs-muted); font-size: var(--wp--preset--font-size--label); font-weight: 400; line-height: 1.5; }
.contact-invitation .contact-more-links { min-width: 0; gap: 0 var(--wp--preset--spacing--sm); margin: 0; }
.contact-invitation .contact-more-link a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
.contact-invitation .contact-more-link .underlined-link-content { padding: 0; border: 0; }
.contact-invitation .contact-more-link .link-label { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .24em; }
.contact-invitation .contact-more-link a:hover .link-label { text-decoration-color: var(--wp--preset--color--gold); }
/* Keep the natural invitation → email → links order below the editorial split. */
@container (max-width: 51rem) {
 .contact-section .contact-inner.contact-invitation { grid-template-columns: minmax(0,1fr); grid-template-areas: "invitation" "action" "more"; gap: var(--wp--preset--spacing--md); }
 .contact-invitation .contact-narrative .section-title { max-width: none; }
 .contact-invitation .contact-copy { max-width: 770px; }
 .contact-invitation .contact-more { margin-top: var(--wp--preset--spacing--md); }
}
@media(max-width:700px) {
 .contact-invitation .contact-email-row { column-gap: 12px; }
 .contact-section .contact-shell > .contact-inner { margin-top: 24px; }
 .contact-invitation .contact-lead { margin-top: 24px; text-wrap: balance; }
 .contact-invitation .contact-copy { text-wrap: pretty; }
 .contact-invitation .contact-email-address { font-size: clamp(20px,calc(25.4px - .77vw),22px); }
 .contact-invitation .contact-email-copy { min-width: 44px; }
}
/* Narrow phones use one explicit email/Copy action stack. */
@media(max-width:441px) {
 .contact-invitation .contact-email-row { flex-direction: column; align-items: flex-start; row-gap: 8px; margin-bottom: 0; }
 .contact-invitation .contact-email-address a { display: inline-flex; align-items: flex-end; padding-block: 0; }
 .contact-invitation .contact-email-copy:not([hidden]) { align-items: flex-start; padding-block: 4px; }
}
/* Below the email's comfortable measure, scale it to the shell. */
@container (max-width: 18rem) {
 .contact-invitation .contact-email-address { font-size: clamp(18px,7.5cqi,22px); }
}
/* Once the main type scale has capped, give the primary action more presence. */
@media(min-width:1600px) {
 .contact-invitation .contact-email-address { font-size: clamp(26px,1.6vw,30px); }
 .contact-invitation .form-helper { font-size: 16px; }
}
