/*
Theme Name: Inspire Design Interiors
Theme URI: https://ia.uk
Author: Internet Assist Limited
Author URI: https://ia.uk
Description: Bespoke, lightweight theme for Inspire Design Interiors – designed and developed by Internet Assist Limited. No page builder; editable home page, portfolio, journal and testimonials.
Version: 1.1.1
License: Proprietary. © Internet Assist Limited. All rights reserved.
Requires PHP: 8.0
Text Domain: inspire
Update URI: false
*/

/* ---------- Tokens ---------- */
/* Fonts are served from this site (faster, and no visitor data sent to Google). Variable fonts,
   Latin set, SIL Open Font License. The fallbacks are resized to match, so text doesn't jump when
   the real fonts arrive. */
@font-face { font-family: "Bodoni Moda"; font-style: normal; font-weight: 400 900; font-display: swap; src: url(assets/fonts/bodoni-moda.woff2) format("woff2"); }
@font-face { font-family: "Bodoni Moda"; font-style: italic; font-weight: 400 900; font-display: swap; src: url(assets/fonts/bodoni-moda-italic.woff2) format("woff2"); }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(assets/fonts/montserrat.woff2) format("woff2"); }
@font-face { font-family: "Bodoni Fallback"; src: local("Times New Roman"), local("TimesNewRomanPSMT"), local("Times"); size-adjust: 115.4%; ascent-override: 97.5%; descent-override: 34.7%; line-gap-override: 0%; }
@font-face { font-family: "Montserrat Fallback"; src: local("Arial"), local("ArialMT"), local("Helvetica"); size-adjust: 111%; ascent-override: 87.2%; descent-override: 22.6%; line-gap-override: 0%; }

:root {
	--ivory: #f3ede4;
	--paper: #faf7f2;
	--sand: #e6dccd;
	--stone: #a8957a;
	--taupe: #7a6a58;
	--ink: #14110f;
	--ink-2: #3b342e;
	--accent: #9c7b45;
	--brass: #b8975a;
	--line: rgba(20, 17, 15, .11);

	--serif: "Bodoni Moda", "Bodoni Fallback", "Times New Roman", serif;
	--sans: "Montserrat", "Montserrat Fallback", Arial, sans-serif;

	--wrap: 1320px;
	--gutter: clamp(20px, 4vw, 56px);
	--section: clamp(72px, 10vw, 150px);
	--ease: cubic-bezier(.22, .61, .36, 1);
	--ease-out: cubic-bezier(.16, 1, .3, 1);
	--header-h: 88px;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--paper);
	color: var(--ink-2);
	font: 300 clamp(16px, 1.05vw, 17.5px)/1.75 var(--sans);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
}
img, video, iframe { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: color .3s var(--ease); }
p { margin: 0 0 1.25em; }
p:last-child { margin-bottom: 0; }
strong { font-weight: 500; color: var(--ink); }
button { font: inherit; cursor: pointer; }
::selection { background: var(--sand); color: var(--ink); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

h1, h2, h3, h4 {
	font-family: var(--serif);
	font-weight: 400;
	color: var(--ink);
	line-height: 1.08;
	letter-spacing: -.01em;
	margin: 0 0 .5em;
}
h1 { font-size: clamp(44px, 6.4vw, 96px); }
h2 { font-size: clamp(34px, 4.2vw, 62px); }
h3 { font-size: clamp(24px, 2.2vw, 32px); }
h4 { font-size: 22px; }
h1 em, h2 em, h3 em { font-style: italic; color: var(--taupe); }

.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter); }
.wrap--narrow { max-width: 860px; }
.section { padding-block: var(--section); }
.section--ivory { background: var(--ivory); }
.section--ink { background: var(--ink); color: rgba(255, 255, 255, .72); }
.section--ink h2, .section--ink h3 { color: #fff; }
.section--ink h2 em { color: var(--stone); }

.eyebrow {
	display: inline-flex; align-items: center; gap: 14px;
	font: 500 12px/1 var(--sans);
	letter-spacing: .28em; text-transform: uppercase;
	color: var(--taupe);
	margin-bottom: 28px;
}
.eyebrow::before { content: ""; width: 36px; height: 1px; background: currentColor; opacity: .6; }
.section--ink .eyebrow { color: var(--stone); }
.lead { font-size: clamp(18px, 1.35vw, 21px); line-height: 1.7; color: var(--ink-2); }

.skip-link { position: absolute; left: -9999px; top: 0; z-index: 999; background: var(--ink); color: #fff; padding: 12px 18px; }
.skip-link:focus { left: 12px; top: 12px; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Buttons ---------- */
.btn {
	--bg: var(--ink); --fg: #fff;
	position: relative; display: inline-flex; align-items: center; gap: 14px;
	padding: 18px 34px;
	background: var(--bg); color: var(--fg);
	border: 1px solid var(--bg);
	font: 500 12px/1 var(--sans); letter-spacing: .22em; text-transform: uppercase;
	overflow: hidden; isolation: isolate;
	transition: color .5s var(--ease-out), border-color .5s var(--ease-out);
}
.btn::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: var(--accent);
	transform: scaleX(0); transform-origin: right;
	transition: transform .6s var(--ease-out);
}
.btn:hover::before { transform: scaleX(1); transform-origin: left; }
.btn:hover { border-color: var(--accent); color: #fff; }
.btn svg { width: 18px; height: 18px; transition: transform .5s var(--ease-out); }
.btn:hover svg { transform: translateX(4px); }
.btn--ghost { --bg: transparent; --fg: var(--ink); border-color: var(--ink); }
.btn--light { --bg: transparent; --fg: #fff; border-color: rgba(255, 255, 255, .6); }
.btn--light::before { background: #fff; }
.btn--light:hover { color: var(--ink); border-color: #fff; }

.link-arrow {
	display: inline-flex; align-items: center; gap: 12px;
	font: 500 12px/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--ink);
	padding-bottom: 8px; border-bottom: 1px solid var(--line);
	transition: border-color .4s var(--ease), gap .4s var(--ease);
}
.link-arrow:hover { border-color: var(--ink); gap: 18px; }
.link-arrow svg { width: 16px; height: 16px; }

/* ---------- Header ---------- */
.site-header {
	position: fixed; inset: 0 0 auto; z-index: 100;
	height: var(--header-h);
	display: flex; align-items: center;
	color: var(--ink);
	transition: background-color .5s var(--ease), height .5s var(--ease), box-shadow .5s var(--ease), color .5s var(--ease), transform .5s var(--ease);
}
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 32px; max-width: 1480px; }
.has-hero .site-header:not(.is-scrolled) { color: #fff; }
.site-header.is-scrolled {
	--header-h: 72px;
	background: rgba(251, 249, 246, .92);
	backdrop-filter: saturate(140%) blur(14px);
	-webkit-backdrop-filter: saturate(140%) blur(14px);
	box-shadow: 0 1px 0 var(--line);
}
.site-header.is-hidden { transform: translateY(-100%); }
body:not(.has-hero) { padding-top: var(--header-h); }
body:not(.has-hero) .site-header { background: var(--paper); box-shadow: 0 1px 0 var(--line); }

.brand { display: flex; flex-direction: column; line-height: 1; color: inherit; flex-shrink: 0; }
.brand__name { font: 500 clamp(24px, 2vw, 30px)/1 var(--serif); letter-spacing: .02em; }
.brand__tag { font: 400 9.5px/1 var(--sans); letter-spacing: .5em; text-transform: uppercase; margin-top: 7px; opacity: .8; }

.nav-primary ul { list-style: none; margin: 0; padding: 0; }
.nav-primary > ul { display: flex; align-items: center; gap: clamp(18px, 2vw, 34px); }
.nav-primary li { position: relative; }
.nav-primary a {
	position: relative; display: block; padding: 10px 0; white-space: nowrap;
	font: 400 12.5px/1 var(--sans); letter-spacing: .16em; text-transform: uppercase;
}
.nav-primary > ul > li > a::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 4px; height: 1px; background: currentColor;
	transform: scaleX(0); transform-origin: right; transition: transform .5s var(--ease-out);
}
.nav-primary > ul > li:hover > a::after,
.nav-primary > ul > .current-menu-item > a::after,
.nav-primary > ul > .current-menu-ancestor > a::after { transform: scaleX(1); transform-origin: left; }
.nav-primary .sub-menu {
	position: absolute; top: 100%; left: -24px; min-width: 270px;
	padding: 14px 0; background: var(--paper); color: var(--ink);
	box-shadow: 0 30px 60px -20px rgba(29, 27, 25, .25);
	opacity: 0; visibility: hidden; transform: translateY(10px);
	transition: opacity .35s var(--ease), transform .35s var(--ease), visibility .35s;
}
.nav-primary li:hover > .sub-menu, .nav-primary li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.nav-primary .sub-menu a { padding: 11px 24px; letter-spacing: .1em; font-size: 12px; }
.nav-primary .sub-menu a:hover { color: var(--accent); background: var(--ivory); }
.nav-primary .menu-item-has-children > a { padding-right: 14px; }
.nav-primary .menu-item-has-children > a::before {
	content: ""; position: absolute; right: 0; top: 50%; width: 5px; height: 5px; margin-top: -4px;
	border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: rotate(45deg);
}

.header-cta { display: flex; align-items: center; gap: 26px; }
.header-phone { font: 400 13px/1 var(--sans); letter-spacing: .08em; white-space: nowrap; }
.site-header .btn { padding: 15px 24px; white-space: nowrap; }
.has-hero .site-header:not(.is-scrolled) .btn { --bg: transparent; border-color: rgba(255, 255, 255, .55); }
.has-hero .site-header:not(.is-scrolled) .btn::before { background: #fff; }
.has-hero .site-header:not(.is-scrolled) .btn:hover { color: var(--ink); }

.menu-toggle {
	display: none; position: relative; z-index: 120;
	width: 44px; height: 44px; padding: 0; border: 0; background: none; color: inherit;
}
.menu-toggle span { position: absolute; left: 10px; right: 10px; height: 1px; background: currentColor; transition: transform .5s var(--ease-out), opacity .3s; }
.menu-toggle span:nth-child(1) { top: 16px; }
.menu-toggle span:nth-child(2) { top: 22px; }
.menu-toggle span:nth-child(3) { top: 28px; }
.menu-open .menu-toggle span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.menu-open .menu-toggle span:nth-child(2) { opacity: 0; }
.menu-open .menu-toggle span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 1380px) {
	.header-phone { display: none; }
}
@media (max-width: 1240px) {
	.nav-primary > ul { gap: 18px; }
}
@media (max-width: 1024px) {
	:root { --header-h: 72px; }
	.menu-toggle { display: block; }
	.header-cta .btn { display: none; }
	.nav-primary {
		position: fixed; inset: 70px 0 0; z-index: 110; /* starts at the header bar (70px when scrolled), so links never scroll beneath the logo and nothing shows through a gap */
		background: var(--ivory); color: var(--ink);
		padding: 24px var(--gutter) 40px;
		overflow-y: auto;
		clip-path: inset(0 0 100% 0);
		transition: clip-path .7s var(--ease-out);
	}
	.menu-open .nav-primary { clip-path: inset(0 0 0 0); }
	.menu-open .site-header { color: var(--ink) !important; background: var(--ivory) !important; box-shadow: none !important; backdrop-filter: none; }
	.menu-open .site-header .topbar { height: 0; opacity: 0; }
	.nav-primary > ul { flex-direction: column; align-items: stretch; gap: 0; }
	.nav-primary > ul > li { border-bottom: 1px solid var(--line); opacity: 0; transform: translateY(16px); transition: opacity .5s var(--ease), transform .6s var(--ease-out); }
	.menu-open .nav-primary > ul > li { opacity: 1; transform: none; }
	.menu-open .nav-primary > ul > li:nth-child(n) { transition-delay: calc(.05s * var(--i, 1) + .15s); }
	.nav-primary > ul > li > a { font: 400 30px/1.1 var(--serif); letter-spacing: 0; text-transform: none; padding: 16px 0; }
	.nav-primary > ul > li > a::after { display: none; }
	.nav-primary .menu-item-has-children > a::before { right: 6px; width: 8px; height: 8px; }
	.nav-primary .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; background: none; padding: 0 0 16px; display: none; }
	.nav-primary .is-open > .sub-menu { display: block; }
	.nav-primary .sub-menu { padding: 0 0 18px 2px; }
	.nav-primary .sub-menu a { padding: 12px 0; font-size: 15px; letter-spacing: .01em; }
	.nav-primary .sub-menu a:hover { background: none; }
	.menu-open { overflow: hidden; }
}

@media (min-width: 1025px) { .nav-primary .mobile-only { display: none; } }

/* ---------- Hero (home): editorial split ---------- */
.hero {
	display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	min-height: calc(100vh - var(--header-h)); background: var(--ivory);
}
@supports (height: 100svh) { .hero { min-height: calc(100svh - var(--header-h)); } }
.hero__content {
	display: flex; flex-direction: column; justify-content: center;
	padding: clamp(48px, 7vh, 96px) clamp(32px, 5vw, 96px) clamp(40px, 6vh, 80px) max(var(--gutter), calc((100vw - 1480px) / 2 + var(--gutter)));
}
.hero h1 { font-size: clamp(48px, 5.6vw, 96px); line-height: 1.02; margin-bottom: 30px; }
.hero h1 em { color: var(--brass); }
.hero__text { max-width: 440px; font-size: clamp(16.5px, 1.2vw, 19px); line-height: 1.7; margin-bottom: 40px; }
.hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 22px 34px; }
.hero__facts { display: grid; grid-template-columns: repeat(3, auto); justify-content: start; gap: 36px; margin: clamp(40px, 7vh, 80px) 0 0; padding-top: 28px; border-top: 1px solid var(--line); }
.hero__facts dt { font: 400 clamp(26px, 2.2vw, 34px)/1 var(--serif); color: var(--ink); margin-bottom: 8px; }
.hero__facts dd { margin: 0; font-size: 12.5px; line-height: 1.45; letter-spacing: .04em; color: var(--taupe); max-width: 15ch; }

.hero__visual { position: relative; overflow: hidden; background: var(--ink); min-height: 520px; }
.hero__slides { position: absolute; inset: 0; }
.hero__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.6s var(--ease); }
.hero__slide.is-active { opacity: 1; z-index: 1; }
.hero__slide img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.1); }
.hero__slide.is-active img { animation: kenburns 9s var(--ease) forwards; }
@keyframes kenburns { from { transform: scale(1.1); } to { transform: scale(1); } }
.hero__visual::after { content: ""; position: absolute; inset: auto 0 0; height: 45%; z-index: 1; background: linear-gradient(0deg, rgba(20,18,16,.6), transparent); pointer-events: none; }

.hero__caption {
	position: absolute; z-index: 2; left: clamp(20px, 3vw, 48px); right: clamp(20px, 3vw, 48px); bottom: clamp(20px, 3vw, 44px);
	display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; color: #fff;
}
.hero__project { position: absolute; left: 0; bottom: 0; max-width: 60%; opacity: 0; transform: translateY(14px); transition: opacity .8s var(--ease), transform .9s var(--ease-out); pointer-events: none; }
.hero__project.is-active { position: relative; opacity: 1; transform: none; pointer-events: auto; transition-delay: .35s; }
.hero__project-cat { display: block; font: 500 11px/1 var(--sans); letter-spacing: .26em; text-transform: uppercase; color: rgba(255,255,255,.75); margin-bottom: 12px; }
.hero__project strong { display: block; font: 400 clamp(24px, 2.2vw, 34px)/1.15 var(--serif); color: #fff; }
.hero__project-loc { font-size: 14px; color: rgba(255,255,255,.75); }
.hero__project:hover strong { text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 1px; }
.hero__controls { display: flex; flex-direction: column; align-items: flex-end; gap: 14px; flex-shrink: 0; }
.hero__count { font: 400 13px/1 var(--sans); letter-spacing: .14em; color: rgba(255,255,255,.7); }
.hero__count b { font-weight: 500; color: #fff; }
.hero__bars { display: flex; gap: 8px; }
.hero__tab { position: relative; width: 44px; height: 24px; padding: 0; border: 0; background: none; }
.hero__tab::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 2px; background: rgba(255,255,255,.3); }
.hero__tab i { position: absolute; left: 0; top: 50%; height: 2px; width: 0; background: #fff; }
.hero__tab.is-active i { animation: progress 7s linear forwards; }
@keyframes progress { to { width: 100%; } }

@media (max-width: 1100px) { .hero__facts { gap: 24px; } }
@media (max-width: 900px) {
	.hero { grid-template-columns: 1fr; min-height: 0; }
	.hero__visual { order: -1; min-height: 0; aspect-ratio: 4 / 3.6; }
	.hero__content { padding: 44px var(--gutter) 56px; }
	.hero__project { max-width: 70%; }
}
@media (max-width: 560px) {
	.hero h1 { font-size: clamp(42px, 12vw, 56px); }
	.hero__actions .btn { flex: 1 1 100%; justify-content: center; }
	.hero__facts { grid-template-columns: repeat(3, 1fr); gap: 16px; }
	.hero__facts dd { font-size: 11.5px; }
	.hero__count { display: none; }
	.hero__tab { width: 28px; }
}

/* ---------- Press marquee ---------- */
.press { padding-block: 34px; border-bottom: 1px solid var(--line); background: var(--paper); overflow: hidden; }
.press__inner { display: flex; align-items: center; gap: 40px; }
.press__label { flex-shrink: 0; font: 500 11px/1 var(--sans); letter-spacing: .28em; text-transform: uppercase; color: var(--taupe); padding-left: var(--gutter); }
.press__track { flex: 1; overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.press__list { display: flex; gap: 64px; width: max-content; list-style: none; margin: 0; padding: 0; animation: marquee 40s linear infinite; }
.press__list li { font: italic 400 clamp(20px, 1.8vw, 26px)/1 var(--serif); color: var(--ink-2); white-space: nowrap; opacity: .75; }
.press:hover .press__list { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-50%); } }
@media (max-width: 720px) { .press__inner { flex-direction: column; align-items: flex-start; gap: 18px; } .press__track { width: 100%; } }

/* ---------- Intro ---------- */
.intro { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(40px, 7vw, 120px); align-items: center; }
.intro__media { position: relative; }
.intro__media .frame { aspect-ratio: 4 / 5; overflow: hidden; }
.intro__media .frame img { width: 100%; height: 100%; object-fit: cover; }
.intro__media .frame--small {
	position: absolute; right: -8%; bottom: -10%; width: 46%; aspect-ratio: 1;
	border: 10px solid var(--paper);
}
.intro__badge {
	position: absolute; left: -24px; top: 40px;
	width: 132px; height: 132px; border-radius: 50%;
	display: grid; place-items: center; text-align: center;
	background: var(--ink); color: #fff;
	font: 400 11px/1.4 var(--sans); letter-spacing: .18em; text-transform: uppercase;
}
.intro__badge strong { display: block; font: 400 40px/1 var(--serif); letter-spacing: 0; color: #fff; margin-bottom: 4px; }
.facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 48px; padding-top: 36px; border-top: 1px solid var(--line); }
.facts dt { font: 400 clamp(28px, 2.4vw, 38px)/1 var(--serif); color: var(--ink); margin-bottom: 10px; }
.facts dd { margin: 0; font-size: 13px; letter-spacing: .06em; color: var(--taupe); line-height: 1.5; }
@media (max-width: 900px) {
	.intro { grid-template-columns: 1fr; }
	.intro__media { margin-right: 10%; margin-bottom: 40px; }
	.intro__badge { left: 12px; top: 12px; width: 108px; height: 108px; }
	.intro__badge strong { font-size: 32px; }
}
@media (max-width: 520px) { .facts { grid-template-columns: 1fr; gap: 20px; } }

/* ---------- Section head ---------- */
.section-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; margin-bottom: clamp(40px, 5vw, 72px); }
.section-head h2 { margin: 0; max-width: 16ch; }
.section-head p { max-width: 440px; margin: 0; }
@media (max-width: 800px) { .section-head { flex-direction: column; align-items: flex-start; gap: 20px; } }

/* ---------- Sector cards ---------- */
.sectors { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(14px, 1.6vw, 24px); }
.sector {
	position: relative; display: block; aspect-ratio: 3 / 4.2; overflow: hidden; color: #fff; background: var(--ink);
}
.sector img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease-out), opacity .6s; opacity: .92; }
.sector::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(20,18,16,.78) 0%, rgba(20,18,16,.05) 55%); transition: opacity .6s; }
.sector:hover img { transform: scale(1.06); opacity: 1; }
.sector__body { position: absolute; inset: auto 0 0; z-index: 2; padding: clamp(24px, 2.6vw, 40px); }
.sector__num { font: italic 400 16px/1 var(--serif); opacity: .8; display: block; margin-bottom: 14px; }
.sector h3 { color: #fff; font-size: clamp(30px, 2.6vw, 40px); margin-bottom: 10px; }
.sector p { font-size: 15px; color: rgba(255, 255, 255, .8); max-width: 30ch; margin: 0; max-height: 0; opacity: 0; overflow: hidden; transition: max-height .7s var(--ease-out), opacity .5s, margin .5s; }
.sector:hover p, .sector:focus-visible p { max-height: 140px; opacity: 1; margin-bottom: 18px; }
.sector__more { display: inline-flex; gap: 10px; align-items: center; font: 500 11px/1 var(--sans); letter-spacing: .24em; text-transform: uppercase; }
.sector__more svg { width: 16px; transition: transform .5s var(--ease-out); }
.sector:hover .sector__more svg { transform: translateX(6px); }
@media (hover: none) { .sector p { max-height: none; opacity: 1; margin-bottom: 16px; } }
@media (max-width: 900px) {
	.sectors { grid-template-columns: 1fr; }
	.sector { aspect-ratio: 4 / 3.4; }
	.sector p { max-height: none; opacity: 1; margin-bottom: 16px; }
}

/* ---------- Process ---------- */
.process { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(28px, 4vw, 64px); counter-reset: step; }
.step { position: relative; padding-top: 36px; border-top: 1px solid rgba(255, 255, 255, .18); }
.section:not(.section--ink) .step { border-color: var(--line); }
.step::before {
	counter-increment: step; content: "0" counter(step);
	display: block; font: italic 400 64px/1 var(--serif); color: var(--brass); margin-bottom: 26px;
}
.step h3 { margin-bottom: 16px; }
.step p { font-size: 16px; }
@media (max-width: 900px) { .process { grid-template-columns: 1fr; } }

/* ---------- Project cards ---------- */
.projects { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(36px, 4vw, 56px) clamp(16px, 2vw, 32px); }
.projects--rail {
	display: grid; grid-auto-flow: column; grid-auto-columns: clamp(270px, 30vw, 420px); grid-template-columns: none;
	overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
	padding-inline: var(--gutter); margin-inline: calc(var(--gutter) * -1); scroll-padding-inline: var(--gutter);
	padding-bottom: 6px;
}
.projects--rail::-webkit-scrollbar { display: none; }
.projects--rail > * { scroll-snap-align: start; }
.project { display: block; }
.project__media { position: relative; aspect-ratio: 4 / 5; overflow: hidden; background: var(--sand); margin-bottom: 22px; }
.project__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease-out); }
.project:hover .project__media img { transform: scale(1.06); }
.project__media::after {
	content: "View project"; position: absolute; left: 50%; top: 50%;
	width: 104px; height: 104px; border-radius: 50%; display: grid; place-items: center; text-align: center;
	background: rgba(251, 249, 246, .92); color: var(--ink);
	font: 500 10.5px/1.3 var(--sans); letter-spacing: .2em; text-transform: uppercase; padding: 14px;
	transform: translate(-50%, -50%) scale(.6); opacity: 0;
	transition: transform .6s var(--ease-out), opacity .4s;
}
.project:hover .project__media::after { transform: translate(-50%, -50%) scale(1); opacity: 1; }
.project__meta { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.project__title { font: 400 clamp(22px, 1.7vw, 27px)/1.2 var(--serif); color: var(--ink); margin: 0 0 4px; transition: color .3s; }
.project:hover .project__title { color: var(--accent); }
.project__loc { font-size: 13px; color: var(--taupe); letter-spacing: .04em; }
.project__cat { font: 500 10.5px/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--stone); white-space: nowrap; }
@media (max-width: 1000px) { .projects { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .projects { grid-template-columns: 1fr; } }

.rail-nav { display: flex; gap: 10px; }
.rail-nav button {
	width: 54px; height: 54px; border-radius: 50%; border: 1px solid var(--line); background: transparent; color: var(--ink);
	display: grid; place-items: center; transition: background .4s, color .4s, border-color .4s;
}
.rail-nav button:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.rail-nav svg { width: 18px; }

.filters { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 48px; }
.filters button {
	padding: 12px 22px; border: 1px solid var(--line); border-radius: 100px; background: transparent; color: var(--ink-2);
	font: 400 12px/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; transition: all .35s var(--ease);
}
.filters button:hover { border-color: var(--ink); }
.filters button.is-active { background: var(--ink); color: #fff; border-color: var(--ink); }
.project.is-hidden { display: none; }

/* ---------- Services list ---------- */
.services { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(40px, 7vw, 120px); align-items: start; }
.services__sticky { position: sticky; top: calc(var(--header-h) + 40px); }
.service-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.service-list a {
	display: grid; grid-template-columns: 56px 1fr auto; align-items: center; gap: 20px;
	padding: 30px 0; border-bottom: 1px solid var(--line);
	transition: padding .5s var(--ease-out), color .3s;
}
.service-list a:hover { padding-left: 14px; color: var(--accent); }
.service-list .n { font: italic 400 18px/1 var(--serif); color: var(--stone); }
.service-list h3 { margin: 0 0 6px; font-size: clamp(24px, 2vw, 30px); transition: color .3s; }
.service-list a:hover h3 { color: var(--accent); }
.service-list p { margin: 0; font-size: 15px; color: var(--taupe); }
.service-list svg { width: 22px; transition: transform .5s var(--ease-out); }
.service-list a:hover svg { transform: translateX(6px) rotate(-45deg); }
@media (max-width: 900px) { .services { grid-template-columns: 1fr; } .services__sticky { position: static; } .service-list a { grid-template-columns: 40px 1fr auto; } }

/* ---------- Testimonials ---------- */
.quotes { position: relative; max-width: 980px; margin-inline: auto; text-align: center; }
.quotes__mark { font: 400 140px/0.6 var(--serif); color: var(--brass); display: block; height: 60px; }
.quotes__track { display: grid; }
.quote { grid-area: 1 / 1; opacity: 0; visibility: hidden; transform: translateY(14px); transition: opacity .9s var(--ease), transform .9s var(--ease-out), visibility .9s; }
.quote.is-active { opacity: 1; visibility: visible; transform: none; }
.quote blockquote { margin: 0 0 36px; font: 400 clamp(23px, 2.5vw, 36px)/1.4 var(--serif); color: var(--ink); }
.section--ink .quote blockquote { color: #fff; }
.quote cite { font-style: normal; font: 500 12px/1.6 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--ink); }
.section--ink .quote cite { color: #fff; }
.quote cite span { display: block; font-weight: 300; letter-spacing: .08em; text-transform: none; font-size: 14px; color: var(--taupe); margin-top: 4px; }
.section--ink .quote cite span { color: var(--stone); }
.quotes__dots { display: flex; justify-content: center; gap: 10px; margin-top: 44px; }
.quotes__dots button { width: 34px; height: 20px; border: 0; padding: 0; background: none; position: relative; }
.quotes__dots button::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: currentColor; opacity: .3; transition: opacity .3s, height .3s; }
.quotes__dots button.is-active::after { opacity: 1; height: 2px; }

.quote-grid { columns: 2 380px; column-gap: clamp(24px, 3vw, 48px); }
.quote-grid figure { break-inside: avoid; margin: 0 0 clamp(24px, 3vw, 48px); padding: clamp(28px, 3vw, 44px); background: var(--ivory); }
.quote-grid blockquote { margin: 0 0 22px; font: 400 clamp(19px, 1.6vw, 23px)/1.5 var(--serif); color: var(--ink); }
.quote-grid figcaption { font: 500 12px/1.6 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--ink); }
.quote-grid figcaption span { display: block; font-weight: 300; text-transform: none; letter-spacing: .04em; color: var(--taupe); font-size: 14px; }
.quote-grid figure { scroll-margin-top: 120px; outline: 0; transition: box-shadow .4s, background .4s; }
.quote-grid figure:target { background: #fff; box-shadow: 0 0 0 2px var(--brass), 0 18px 40px -20px rgba(0,0,0,.25); animation: quote-found 1.6s var(--ease) 1; }
@keyframes quote-found { 0%, 40% { box-shadow: 0 0 0 6px var(--brass), 0 18px 40px -20px rgba(0,0,0,.25); } }
.quote__more { display: inline-block; margin: -18px 0 26px; font: 500 12px/1.6 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--brass); text-decoration: none; border-bottom: 1px solid currentColor; }
.quote__more:hover, .quote__more:focus-visible { color: var(--ink); }

/* ---------- Video ---------- */
.videos { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(24px, 3vw, 48px); }
.video-card h3 { margin: 26px 0 12px; }
.video-card p { font-size: 15.5px; }
.video-facade {
	position: relative; aspect-ratio: 16 / 9; width: 100%; padding: 0; border: 0; overflow: hidden; background: var(--ink); color: #fff;
}
.video-facade img { width: 100%; height: 100%; object-fit: cover; opacity: .82; transition: transform 1.2s var(--ease-out), opacity .5s; }
.video-facade:hover img { transform: scale(1.04); opacity: .7; }
.video-facade .play {
	position: absolute; left: 50%; top: 50%; width: 88px; height: 88px; margin: -44px 0 0 -44px; border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, .7); display: grid; place-items: center; transition: transform .5s var(--ease-out), background .4s;
}
.video-facade:hover .play { transform: scale(1.1); background: rgba(255, 255, 255, .15); }
.video-facade .play svg { width: 22px; margin-left: 4px; }
.video-facade iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
@media (max-width: 800px) { .videos { grid-template-columns: 1fr; } }

/* ---------- CTA ---------- */
.cta { position: relative; overflow: hidden; color: #fff; background: var(--ink); text-align: center; }
.cta__bg { position: absolute; inset: -10% 0; }
.cta__bg img { width: 100%; height: 100%; object-fit: cover; opacity: .38; }
/* Darker veil behind the text so it stays readable on light parts of the photo. */
.cta__bg::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 70% at 50% 50%, rgba(20, 17, 15, .55), rgba(20, 17, 15, .2) 75%); }
@media (max-width: 700px) { .cta__bg::after { background: rgba(20, 17, 15, .5); } }
.cta .wrap { position: relative; }
.cta h2 { color: #fff; max-width: 18ch; margin: 0 auto 24px; }
.cta h2 em { color: #e6dccf; }
.cta p { max-width: 560px; margin: 0 auto 40px; color: rgba(255, 255, 255, .8); }
.cta .eyebrow { color: #fff; }
.cta__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
.cta .btn:not(.btn--light) { --bg: #fff; --fg: var(--ink); border-color: #fff; }
.cta .btn:not(.btn--light):hover { color: #fff; border-color: var(--accent); }

/* ---------- Page hero (inner) ---------- */
.page-hero { padding-block: clamp(60px, 9vw, 130px) clamp(40px, 5vw, 70px); }
.page-hero h1 { max-width: 16ch; margin-bottom: 0; }
.page-hero__intro { display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(32px, 6vw, 100px); align-items: end; }
.page-hero__intro p { margin: 0; }
.crumbs { font: 400 12px/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--taupe); margin-bottom: 30px; display: flex; flex-wrap: wrap; gap: 10px; }
.crumbs a:hover { color: var(--ink); }
.crumbs span[aria-hidden] { opacity: .5; }
.page-hero__media { aspect-ratio: 21 / 9; overflow: hidden; margin-top: clamp(40px, 5vw, 72px); }
.page-hero__media img { width: 100%; height: 110%; object-fit: cover; }
@media (max-width: 900px) { .page-hero__intro { grid-template-columns: 1fr; } .page-hero__media { aspect-ratio: 4 / 3; } }

/* ---------- Prose (editable content) ---------- */
.prose { font-size: clamp(16.5px, 1.1vw, 18px); }
.prose > * + * { margin-top: 1.3em; }
.prose h2 { font-size: clamp(30px, 3vw, 44px); margin-top: 1.6em; margin-bottom: .2em; }
.prose h3 { margin-top: 1.6em; margin-bottom: .1em; }
.prose a:not(.btn) { color: var(--accent); border-bottom: 1px solid rgba(156, 123, 69, .3); }
.prose a:not(.btn):hover { border-color: var(--accent); }
.prose ul { list-style: none; padding: 0; margin: 1.6em 0; }
.prose ul li { position: relative; padding: 12px 0 12px 34px; border-bottom: 1px solid var(--line); }
.prose ul li::before { content: ""; position: absolute; left: 0; top: 24px; width: 18px; height: 1px; background: var(--brass); }
.prose blockquote { margin: 2em 0; padding: 0 0 0 32px; border-left: 1px solid var(--brass); font: 400 clamp(22px, 2vw, 28px)/1.45 var(--serif); color: var(--ink); }
.prose blockquote cite { display: block; margin-top: 18px; font: 500 12px/1.5 var(--sans); letter-spacing: .18em; text-transform: uppercase; font-style: normal; color: var(--taupe); }
.prose img { margin-block: 2em; }
.prose .lead:first-child, .prose > p:first-child { font-size: clamp(19px, 1.5vw, 23px); line-height: 1.65; color: var(--ink); }

.content-grid { display: grid; grid-template-columns: 1fr 340px; gap: clamp(40px, 7vw, 120px); align-items: start; }
.aside-card { position: sticky; top: calc(var(--header-h) + 32px); padding: 40px 36px; background: var(--ivory); }
.aside-card h3 { margin-bottom: 14px; }
.aside-card p { font-size: 15px; }
.aside-card .btn { width: 100%; justify-content: center; margin-top: 12px; }
.aside-card__phone { display: block; font: 400 28px/1 var(--serif); color: var(--ink); margin: 18px 0 6px; }
.aside-card ul { list-style: none; margin: 28px 0 0; padding: 22px 0 0; border-top: 1px solid var(--line); font-size: 14px; }
.aside-card li { padding: 6px 0 6px 26px; position: relative; }
.aside-card li::before { content: ""; position: absolute; left: 0; top: 17px; width: 12px; height: 1px; background: var(--brass); }
@media (max-width: 960px) { .content-grid { grid-template-columns: 1fr; } .aside-card { position: static; } }

/* ---------- Media grids in content ---------- */
.img-row { columns: 3 220px; column-gap: 16px; margin-block: 2.4em !important; }
.img-row > * { break-inside: avoid; margin: 0 0 16px !important; }
.img-row img { display: block; width: 100%; height: auto; margin: 0; }
/* Block-editor galleries (core block CSS is not loaded). */
.wp-block-gallery { columns: 3 240px; column-gap: 16px; margin-block: 2.4em !important; padding: 0; }
.wp-block-gallery > figure, .wp-block-gallery .wp-block-image { break-inside: avoid; margin: 0 0 16px !important; width: auto !important; }
.wp-block-gallery img { display: block; width: 100% !important; height: auto !important; object-fit: contain !important; margin: 0; }
.logo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); margin-top: 3em !important; }
.logo-grid figure { margin: 0; background: var(--paper); aspect-ratio: 3 / 2; display: grid; place-items: center; padding: 22px; }
.logo-grid img { max-height: 70px; width: auto; object-fit: contain; margin: 0; filter: grayscale(1); opacity: .75; transition: filter .4s, opacity .4s; }
.logo-grid figure:hover img { filter: none; opacity: 1; }

/* ---------- Team ---------- */
.team { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(28px, 3vw, 48px); margin-top: 3em !important; }
.team figure { margin: 0; }
.team .team__img { aspect-ratio: 4 / 5; overflow: hidden; background: var(--sand); margin-bottom: 22px; }
.team .team__img img { width: 100%; height: 100%; object-fit: cover; object-position: top; margin: 0; transition: transform 1.2s var(--ease-out); }
.team figure:hover .team__img img { transform: scale(1.04); }
.team h3 { margin: 0 0 4px; }
.team .role { font: 500 11px/1.4 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--stone); margin-bottom: 14px; display: block; }
.team p { font-size: 15.5px; }
@media (max-width: 900px) { .team { grid-template-columns: 1fr; max-width: 460px; } }

.partner { display: grid; grid-template-columns: 220px 1fr; gap: 40px; align-items: center; padding: 44px; background: var(--ivory); margin-top: 3em !important; }
.partner img { margin: 0; mix-blend-mode: multiply; }
@media (max-width: 700px) { .partner { grid-template-columns: 1fr; padding: 28px; } }

/* ---------- Single project ---------- */
.project-hero { position: relative; height: min(88vh, 860px); min-height: 520px; overflow: hidden; background: var(--ink); color: #fff; display: flex; align-items: flex-end; }
.project-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .9; }
.project-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(20,18,16,.75), rgba(20,18,16,0) 60%), linear-gradient(180deg, rgba(20,18,16,.5), transparent 25%); }
.project-hero .wrap { position: relative; z-index: 2; padding-bottom: clamp(40px, 6vw, 80px); }
.project-hero h1 { color: #fff; margin-bottom: 0; }
.project-hero .eyebrow, .project-hero .crumbs { color: rgba(255, 255, 255, .8); }
.project-info { display: grid; grid-template-columns: 300px 1fr; gap: clamp(40px, 8vw, 140px); }
.project-info dl { margin: 0; }
.project-info dt { font: 500 11px/1 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: var(--stone); margin-bottom: 10px; }
.project-info dd { margin: 0 0 30px; font: 400 22px/1.3 var(--serif); color: var(--ink); padding-bottom: 26px; border-bottom: 1px solid var(--line); }
@media (max-width: 860px) { .project-info { grid-template-columns: 1fr; } .project-info dl { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; } }

/* Masonry: every photo at its natural ratio, never cropped. */
.gallery { columns: 3 300px; column-gap: clamp(10px, 1.4vw, 20px); }
.gallery a { position: relative; display: block; overflow: hidden; background: var(--sand); margin: 0 0 clamp(10px, 1.4vw, 20px); break-inside: avoid; cursor: zoom-in; }
.gallery img { display: block; width: 100%; height: auto; transition: transform 1.4s var(--ease-out); }
.gallery a:hover img { transform: scale(1.04); }
@media (max-width: 640px) { .gallery { columns: 1; } }

.project-nav { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); }
.project-nav a { padding: clamp(32px, 4vw, 56px) var(--gutter); display: flex; flex-direction: column; gap: 10px; transition: background .4s; }
.project-nav a:hover { background: var(--ivory); }
.project-nav a + a { border-left: 1px solid var(--line); text-align: right; align-items: flex-end; }
.project-nav span { font: 500 11px/1 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: var(--stone); }
.project-nav strong { font: 400 clamp(22px, 2.2vw, 32px)/1.2 var(--serif); }

/* ---------- Lightbox ---------- */
.lightbox { position: fixed; inset: 0; z-index: 300; background: rgba(20, 18, 16, .96); display: grid; place-items: center; opacity: 0; visibility: hidden; transition: opacity .4s, visibility .4s; }
.lightbox.is-open { opacity: 1; visibility: visible; }
.lightbox img { max-width: 92vw; max-height: 86vh; object-fit: contain; transition: opacity .35s; }
.lightbox button { position: absolute; background: none; border: 0; color: #fff; width: 56px; height: 56px; display: grid; place-items: center; opacity: .75; transition: opacity .3s; }
.lightbox button:hover { opacity: 1; }
.lightbox svg { width: 26px; }
.lightbox__close { top: 18px; right: 18px; }
.lightbox__prev { left: 12px; top: 50%; transform: translateY(-50%); }
.lightbox__next { right: 12px; top: 50%; transform: translateY(-50%); }
.lightbox__count { position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%); color: rgba(255,255,255,.7); font: 400 12px/1 var(--sans); letter-spacing: .2em; }

/* ---------- Contact ---------- */
.contact { display: grid; grid-template-columns: 1.25fr 1fr; gap: clamp(40px, 7vw, 120px); align-items: start; }
.form { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 24px; }
.field { position: relative; display: flex; flex-direction: column-reverse; }
.field--full { grid-column: 1 / -1; }
.field label { font: 500 11px/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--taupe); margin-bottom: 10px; transition: color .3s; }
.field input, .field select, .field textarea {
	width: 100%; padding: 12px 0 14px; border: 0; border-bottom: 1px solid rgba(29, 27, 25, .25); border-radius: 0;
	background: transparent; color: var(--ink); font: 300 17px/1.5 var(--sans); transition: border-color .4s;
	-webkit-appearance: none; appearance: none;
}
.field select { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%231d1b19'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E") right 4px center no-repeat; }
.field textarea { min-height: 140px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--ink); }
.field input:focus + label, .field textarea:focus + label, .field select:focus + label { color: var(--ink); }
.form .consent { grid-column: 1 / -1; font-size: 13.5px; color: var(--taupe); display: flex; gap: 12px; align-items: flex-start; }
.form .consent input { margin-top: 5px; accent-color: var(--ink); }
.form .btn { justify-self: start; }
.form .hp { position: absolute; left: -9999px; }
.notice { grid-column: 1 / -1; padding: 18px 22px; font-size: 15px; border-left: 2px solid var(--accent); background: rgba(156, 123, 69, .06); color: var(--ink); }
.notice--error { border-color: #a2463b; background: rgba(162, 70, 59, .07); }
.contact-details { padding: clamp(32px, 4vw, 56px); background: var(--ivory); }
.contact-details h3 { font-size: 26px; margin-bottom: 8px; }
.contact-details .big { display: block; font: 400 clamp(28px, 2.6vw, 38px)/1.1 var(--serif); color: var(--ink); margin-bottom: 4px; }
.contact-details .big:hover { color: var(--accent); }
.contact-details address { font-style: normal; font-size: 15px; line-height: 1.7; }
.contact-details .block { padding-block: 26px; border-bottom: 1px solid var(--line); }
.contact-details .block:first-child { padding-top: 0; }
.contact-details .block:last-child { border: 0; padding-bottom: 0; }
.contact-details .label { font: 500 11px/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--stone); display: block; margin-bottom: 12px; }
@media (max-width: 960px) { .contact { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .form { grid-template-columns: 1fr; } }

/* ---------- News ---------- */
.posts { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(40px, 4vw, 64px) clamp(20px, 2.4vw, 36px); }
.post-card__media { aspect-ratio: 3 / 2; overflow: hidden; background: var(--sand); margin-bottom: 22px; }
.post-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease-out); }
.post-card:hover .post-card__media img { transform: scale(1.05); }
.post-card time { font: 500 11px/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--stone); }
.post-card h3 { margin: 12px 0 12px; font-size: clamp(22px, 1.8vw, 27px); transition: color .3s; }
.post-card:hover h3 { color: var(--accent); }
.post-card p { font-size: 15px; color: var(--taupe); }
@media (max-width: 1000px) { .posts { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .posts { grid-template-columns: 1fr; } }
.pagination { margin-top: 64px; display: flex; gap: 8px; justify-content: center; }
.pagination .page-numbers { min-width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid var(--line); font-size: 14px; }
.pagination .current, .pagination a:hover { background: var(--ink); color: #fff; border-color: var(--ink); }

/* ---------- Footer ---------- */
.site-footer { background: var(--ink); color: rgba(255, 255, 255, .62); padding-top: clamp(72px, 8vw, 120px); font-size: 15px; }
.site-footer a:hover { color: #fff; }
.footer-top { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: clamp(32px, 4vw, 64px); padding-bottom: clamp(56px, 6vw, 90px); }
.site-footer .brand { color: #fff; margin-bottom: 26px; }
.site-footer h4 { font: 500 11px/1 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: #fff; margin-bottom: 24px; }
.site-footer ul { list-style: none; margin: 0; padding: 0; }
.site-footer li { margin-bottom: 10px; }
.site-footer address { font-style: normal; line-height: 1.7; }
.footer-contact a { display: block; font: 400 24px/1.3 var(--serif); color: #fff; }
.footer-sbid { margin-top: 30px; width: 150px; opacity: .85; }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; padding-block: 28px; border-top: 1px solid rgba(255, 255, 255, .12); font-size: 13px; }
.footer-bottom ul { display: flex; flex-wrap: wrap; gap: 24px; }
.footer-bottom li { margin: 0; }
.footer-word { font: 400 clamp(56px, 13.5vw, 230px)/.8 var(--serif); color: rgba(255, 255, 255, .05); white-space: nowrap; text-align: center; margin: 0; padding-bottom: 8px; letter-spacing: -.02em; user-select: none; overflow: hidden; }
@media (max-width: 960px) { .footer-top { grid-template-columns: 1fr 1fr; } .footer-top > :first-child { grid-column: 1 / -1; } }
@media (max-width: 520px) { .footer-top { grid-template-columns: 1fr; } }

/* ---------- Reveal animations ---------- */
.js [data-reveal] { opacity: 0; transform: translateY(36px); transition: opacity 1.1s var(--ease), transform 1.2s var(--ease-out); transition-delay: var(--d, 0s); }
.js [data-reveal].is-in { opacity: 1; transform: none; }
.js [data-reveal="fade"] { transform: none; }
.js [data-reveal="clip"] { opacity: 1; transform: none; clip-path: inset(100% 0 0 0); transition: clip-path 1.5s var(--ease-out); transition-delay: var(--d, 0s); }
.js [data-reveal="clip"].is-in { clip-path: inset(0 0 0 0); }
.js [data-reveal="clip"] img { transform: scale(1.18); transition: transform 2s var(--ease-out); transition-delay: var(--d, 0s); }
.js [data-reveal="clip"].is-in img { transform: scale(1); }
.split-line { display: block; overflow: hidden; }
.split-line > span { display: block; transform: translateY(105%); transition: transform 1.2s var(--ease-out); transition-delay: var(--d, 0s); }
.is-loaded .split-line > span, .no-js .split-line > span { transform: none; }
.hero .eyebrow, .hero__text, .hero__actions, .hero__facts { opacity: 0; transform: translateY(20px); transition: opacity 1s var(--ease), transform 1.1s var(--ease-out); }
.is-loaded .hero .eyebrow, .is-loaded .hero__text, .is-loaded .hero__actions, .is-loaded .hero__facts { opacity: 1; transform: none; }
.is-loaded .hero__text { transition-delay: .55s; }
.is-loaded .hero__actions { transition-delay: .7s; }
.is-loaded .hero__facts { transition-delay: .9s; }


@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; transition-delay: 0s !important; scroll-behavior: auto !important; }
	.js [data-reveal], .js [data-reveal="clip"] { opacity: 1; transform: none; clip-path: none; }
	.split-line > span { transform: none; }
	.press__list { animation: none; }
}

@media (max-width: 560px) { .hero .eyebrow { letter-spacing: .18em; font-size: 11px; } .hero .eyebrow::before { width: 24px; } }

/* ---------- Hero: full-width override ---------- */
.hero { display: flex; align-items: center; position: relative; min-height: 100vh; background: var(--ink); color: #fff; overflow: hidden; }
@supports (height: 100svh) { .hero { min-height: 100svh; } }
.hero__visual { position: absolute; inset: 0; min-height: 0; aspect-ratio: auto; order: 0; }
.hero__visual::after {
	height: auto; inset: 0;
	background:
		linear-gradient(90deg, rgba(20,18,16,.82) 0%, rgba(20,18,16,.6) 32%, rgba(20,18,16,.18) 62%, rgba(20,18,16,.05) 100%),
		linear-gradient(0deg, rgba(20,18,16,.65) 0%, rgba(20,18,16,0) 35%),
		linear-gradient(180deg, rgba(20,18,16,.5) 0%, rgba(20,18,16,0) 22%);
}
.hero__content {
	position: relative; z-index: 2; width: 100%; max-width: 1480px; margin-inline: auto;
	padding: calc(var(--header-h) + 48px) var(--gutter) 150px;
}
.hero__content > * { max-width: 620px; }
.hero h1 { color: #fff; font-size: clamp(52px, 6.6vw, 112px); }
.hero h1 em { color: #d9c3a0; }
.hero .eyebrow { color: rgba(255,255,255,.85); }
.hero__text { color: rgba(255,255,255,.86); max-width: 500px; }
.hero__actions .btn:not(.btn--light) { --bg: #fff; --fg: var(--ink); border-color: #fff; }
.hero__actions .btn:not(.btn--light):hover { color: #fff; border-color: var(--accent); }
.hero__facts { border-color: rgba(255,255,255,.22); max-width: 560px; }
.hero__facts dt { color: #fff; }
.hero__facts dd { color: rgba(255,255,255,.72); }
.hero__caption { left: auto; width: min(520px, 45%); right: max(var(--gutter), calc((100vw - 1480px) / 2 + var(--gutter))); bottom: clamp(28px, 5vh, 56px); }
@media (max-width: 900px) {
	.hero { display: flex; align-items: flex-end; }
	.hero__visual { aspect-ratio: auto; }
	.hero__visual::after { background: linear-gradient(0deg, rgba(20,18,16,.88) 0%, rgba(20,18,16,.55) 55%, rgba(20,18,16,.25) 100%); }
	.hero__content { padding: calc(var(--header-h) + 40px) var(--gutter) 130px; }
	.hero__facts { display: none; }
	.hero__caption { left: var(--gutter); right: var(--gutter); width: auto; bottom: 28px; }
	.hero__project-cat { margin-bottom: 6px; }
	.hero__project strong { font-size: 20px; }
	.hero__project-loc { display: none; }
}

/* ---------- Luxury typography tuning (Bodoni Moda + Montserrat) ---------- */
body { font-weight: 300; font-size: clamp(15px, 1vw, 16.5px); line-height: 1.85; letter-spacing: .01em; }
h1, h2, h3, h4 { font-weight: 400; letter-spacing: -.02em; line-height: 1.1; font-optical-sizing: auto; }
h1 { font-size: clamp(42px, 5.6vw, 88px); }
h2 { font-size: clamp(32px, 3.7vw, 56px); }
h3 { font-size: clamp(21px, 1.9vw, 28px); letter-spacing: -.01em; }
h1 em, h2 em, h3 em { color: var(--brass); }
.hero h1 { font-size: clamp(46px, 5.8vw, 96px); letter-spacing: -.025em; }
.hero h1 em, .cta h2 em { color: #d8bd8a; }
.section--ink h2 em { color: var(--brass); }
.eyebrow, .btn, .link-arrow, .nav-primary a, .project__cat, .hero__project-cat, .sector__more, .filters button, .field label, .site-footer h4, .contact-details .label, .crumbs { font-family: var(--sans); font-weight: 500; }
.eyebrow { font-size: 11px; letter-spacing: .32em; color: var(--accent); }
.eyebrow::before { background: var(--brass); opacity: 1; }
.hero .eyebrow, .cta .eyebrow { color: #d8bd8a; }
.nav-primary a { font-size: 11.5px; letter-spacing: .2em; font-weight: 400; }
.btn { font-size: 11px; letter-spacing: .26em; font-weight: 500; }
.brand__name { font-family: var(--serif); font-weight: 400; letter-spacing: .01em; }
.brand__tag { font-family: var(--sans); color: var(--brass); opacity: 1; font-weight: 500; }
.has-hero .site-header:not(.is-scrolled) .brand__tag { color: #d8bd8a; }
.lead { font-weight: 300; }
.step::before, .sector__num, .service-list .n, .quotes__mark { color: var(--brass); }
.quote blockquote, .quote-grid blockquote, .prose blockquote { font-style: italic; letter-spacing: -.01em; }
.facts dt, .hero__facts dt, .footer-contact a, .aside-card__phone, .contact-details .big { font-family: var(--serif); }
.hero__facts dt { color: #fff; }
.press__list li { font-style: italic; }
.section--ink { background: #14110f; }
.site-footer { background: #0f0d0b; }
.footer-word { color: rgba(216, 189, 138, .06); }
.btn::before { background: var(--accent); }
.btn--light::before { background: #fff; }
.filters button.is-active, .pagination .current, .pagination a:hover { background: var(--ink); }
.project:hover .project__title, .service-list a:hover h3, .post-card:hover h3 { color: var(--accent); }
.intro__badge { background: var(--ink); box-shadow: 0 0 0 6px var(--paper), 0 0 0 7px var(--brass); }
.intro__badge strong { color: #d8bd8a; }
/* Montserrat is wider: rebalance header + hero spacing */
.nav-primary a { font-size: 11px; letter-spacing: .16em; }
.nav-primary > ul { gap: clamp(16px, 1.6vw, 28px); }
.site-header .wrap { gap: 24px; }
.site-header .btn { padding: 14px 20px; letter-spacing: .2em; }
@media (max-width: 1520px) { .header-phone { display: none; } }
.hero__content > * { max-width: 660px; }
.hero__actions { flex-wrap: nowrap; gap: 16px; }
.hero__caption { width: min(600px, 50%); }
.hero__project { max-width: 72%; }
.hero__project strong { font-size: clamp(22px, 1.8vw, 28px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 560px) { .hero__actions { flex-wrap: wrap; } }
@media (max-width: 900px) { .hero__project strong { white-space: normal; font-size: 19px; } .hero__project { max-width: 58%; } }

/* ---------- Header v2: full-width, two-tier ---------- */
:root { --topbar-h: 38px; --bar-h: 84px; --header-h: calc(var(--topbar-h) + var(--bar-h)); }
.site-header { display: block; height: auto; }
.site-header.is-scrolled { --header-h: auto; }
.topbar {
	height: var(--topbar-h); overflow: hidden;
	border-bottom: 1px solid rgba(20, 17, 15, .08);
	font: 400 11px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase;
	transition: height .5s var(--ease), opacity .4s var(--ease), border-color .4s;
}
.topbar__inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-inline: clamp(20px, 3.4vw, 64px); opacity: .78; }
.topbar__links { display: flex; gap: 32px; text-transform: none; letter-spacing: .06em; font-size: 12px; }
.topbar a:hover { color: var(--brass); }
.has-hero .site-header:not(.is-scrolled) .topbar { border-color: rgba(255, 255, 255, .14); }
.site-header.is-scrolled .topbar { height: 0; opacity: 0; border-color: transparent; }

.header-main {
	position: relative;
	display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 32px;
	height: var(--bar-h); padding-inline: clamp(20px, 3.4vw, 64px);
	transition: height .5s var(--ease);
}
.header-main::after {
	content: ""; position: absolute; left: clamp(20px, 3.4vw, 64px); right: clamp(20px, 3.4vw, 64px); bottom: 0; height: 1px;
	background: linear-gradient(90deg, transparent, rgba(184, 151, 90, .55) 20%, rgba(184, 151, 90, .55) 80%, transparent);
	opacity: 0; transition: opacity .5s;
}
.has-hero .site-header:not(.is-scrolled) .header-main::after { opacity: 1; background: linear-gradient(90deg, transparent, rgba(255,255,255,.22) 20%, rgba(255,255,255,.22) 80%, transparent); }
.site-header.is-scrolled .header-main { height: 70px; }
.site-header.is-scrolled .header-main::after, body:not(.has-hero) .header-main::after { opacity: 1; }
body:not(.has-hero) .site-header, .site-header.is-scrolled { box-shadow: none; }
.site-header.is-scrolled { background: rgba(250, 247, 242, .94); }

.brand { justify-self: start; }
.brand__name { font-size: clamp(25px, 1.9vw, 31px); }
.nav-primary { justify-self: center; }
.nav-primary > ul { gap: clamp(20px, 2.2vw, 40px); }
.nav-primary a { font-size: 11px; letter-spacing: .2em; padding: 14px 0; }
.nav-primary > ul > li > a::after { bottom: 6px; height: 1px; background: var(--brass); }
.nav-primary .sub-menu { left: 50%; transform: translate(-50%, 10px); top: calc(100% + 6px); border-top: 1px solid var(--brass); padding: 18px 0; min-width: 280px; }
.nav-primary li:hover > .sub-menu, .nav-primary li:focus-within > .sub-menu { transform: translate(-50%, 0); }
.nav-primary .sub-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.nav-primary .sub-menu a { padding: 11px 28px; text-transform: none; font-size: 13.5px; letter-spacing: .02em; font-weight: 400; }
.nav-primary .sub-menu a:hover { color: var(--accent); background: transparent; padding-left: 34px; transition: padding .35s var(--ease), color .3s; }
.header-cta { justify-self: end; gap: 18px; }
.header-phone { display: none !important; }
.site-header .btn { padding: 15px 26px; }

@media (max-width: 1280px) {
	.header-main { grid-template-columns: auto 1fr auto; }
	.nav-primary > ul { gap: 20px; }
	.topbar__inner > span:first-child { display: none; }
	.topbar__inner { justify-content: flex-end; }
}
@media (max-width: 1024px) {
	:root { --topbar-h: 0px; --bar-h: 72px; }
	.topbar { display: none; }
	.header-main { grid-template-columns: 1fr auto; }
	.nav-primary .sub-menu { transform: none; left: auto; border: 0; min-width: 0; }
	.nav-primary li:hover > .sub-menu { transform: none; }
	.nav-primary .sub-menu a:hover { padding-left: 0; }
	.header-main::after { display: none; }
}
@media (max-width: 1024px) { .nav-primary { justify-self: stretch; width: 100%; } }
/* Only the header logo sits above the open mobile menu (the footer logo must stay underneath it). */
.site-header .brand { position: relative; z-index: 120; }
.menu-open .site-header .brand { color: var(--ink); }
@media (min-width: 901px) {
	.hero__content { max-width: none; padding-inline: clamp(20px, 3.4vw, 64px); }
	.hero__caption { right: clamp(20px, 3.4vw, 64px); }
}

/* Inner-page hero image: full-bleed */
.page-hero__media { width: 100vw; max-width: none; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); aspect-ratio: auto; height: clamp(360px, 62vh, 720px); }
.page-hero__media img { height: 116%; margin-top: -8%; }
.page-hero { padding-bottom: 0; }
.page-hero__pair { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(10px, 1.4vw, 20px); margin-top: clamp(40px, 5vw, 72px); align-items: start; }
.page-hero__pair figure { margin: 0; overflow: hidden; background: var(--sand); }
.page-hero__pair img { display: block; width: 100%; height: auto; animation: heroImgIn 1.1s var(--ease-out) both; }
@media (max-width: 700px) { .page-hero__pair { grid-template-columns: 1fr; } }
.page-hero:not(:has(.page-hero__media, .page-hero__pair)) { padding-bottom: clamp(40px, 5vw, 70px); }
@media (max-width: 900px) { .page-hero__media { height: 52vh; aspect-ratio: auto; } }

/* Real logo */
.brand { display: block; line-height: 0; }
.brand__logo { height: 50px; width: auto; transition: height .5s var(--ease), opacity .4s var(--ease); }
.brand__logo--light { position: absolute; left: 0; top: 0; opacity: 0; }
.has-hero .site-header:not(.is-scrolled) .brand__logo--light { opacity: 1; }
.has-hero .site-header:not(.is-scrolled) .brand__logo--dark { opacity: 0; }
.menu-open .brand__logo--light { opacity: 0 !important; }
.menu-open .brand__logo--dark { opacity: 1 !important; }
.site-header.is-scrolled .brand__logo { height: 40px; }
.site-footer .brand { margin-bottom: 28px; }
.site-footer .brand__logo { height: 54px; }
@media (max-width: 1024px) { .brand__logo, .site-header.is-scrolled .brand__logo { height: 38px; } }

/* ---------- Full-width layout ---------- */
:root { --gutter: clamp(20px, 3.4vw, 64px); }
.wrap { max-width: none; }
.wrap--narrow { max-width: 920px; }
.content-grid { grid-template-columns: minmax(0, 1fr) 380px; }
.content-grid .prose { max-width: 860px; }
.section-head p { max-width: 520px; }
.intro { grid-template-columns: 1fr 1fr; }
.intro > div:last-child { max-width: 720px; }
.page-hero__intro > p { max-width: 620px; justify-self: end; }
.aside-card .btn { white-space: nowrap; }
.quotes { max-width: 1100px; }
.services { grid-template-columns: 1fr 1.25fr; }
@media (min-width: 1600px) {
	.projects:not(.projects--rail) { grid-template-columns: repeat(4, 1fr); }
	.posts { grid-template-columns: repeat(4, 1fr); }
	.process { gap: clamp(48px, 5vw, 120px); }
}
@media (max-width: 960px) { .content-grid { grid-template-columns: 1fr; } .page-hero__intro > p { justify-self: start; } }
@media (max-width: 900px) { .intro { grid-template-columns: 1fr; } }

/* Hero headline: sturdier optical size + weight for legibility over photography */
.hero h1 {
	font-weight: 500;
	font-variation-settings: "opsz" 11;
	font-optical-sizing: none;
	letter-spacing: -.01em;
	line-height: 1.06;
	font-size: clamp(42px, 5.2vw, 88px);
	text-shadow: 0 2px 30px rgba(10, 8, 6, .35);
}
.hero h1 em { font-weight: 400; color: #e2c999; }

/* ---------- As seen in: magazine covers ---------- */
.press { padding-block: clamp(48px, 6vw, 88px); background: var(--ivory); border: 0; }
.press__inner { display: grid; grid-template-columns: 260px 1fr; align-items: center; gap: clamp(24px, 4vw, 64px); }
.press__label { padding-left: var(--gutter); font: inherit; letter-spacing: normal; text-transform: none; color: inherit; }
.press__label .eyebrow { margin-bottom: 14px; }
.press__label p { font: italic 400 clamp(19px, 1.5vw, 23px)/1.35 var(--serif); color: var(--ink); margin: 0; }
.press__list { gap: clamp(20px, 2vw, 32px); padding-block: 18px; animation-duration: 55s; align-items: center; }
.press__list li { opacity: 1; font: inherit; }
.press__list img {
	height: clamp(150px, 13vw, 210px); width: auto; aspect-ratio: 320 / 438; object-fit: cover;
	box-shadow: 0 18px 34px -16px rgba(20, 17, 15, .45), 0 2px 6px rgba(20, 17, 15, .08);
	transition: transform .6s var(--ease-out), box-shadow .6s var(--ease-out);
}
.press__list li:hover img { transform: translateY(-8px) rotate(-1deg); box-shadow: 0 28px 44px -18px rgba(20, 17, 15, .5); }
@media (max-width: 800px) {
	.press__inner { grid-template-columns: 1fr; gap: 20px; }
	.press__track { padding-inline: 0; }
}

/* ---------- Full service section ---------- */
.fs__head { display: grid; grid-template-columns: 1.25fr 1fr; gap: clamp(32px, 6vw, 120px); align-items: end; margin-bottom: clamp(48px, 6vw, 96px); }
.fs__title { font-size: clamp(36px, 4.4vw, 74px); line-height: 1.06; margin: 0; max-width: 17ch; }
.fs__intro { max-width: 600px; }
.fs__intro .lead { color: var(--ink); }
.fs__intro .link-arrow { margin-top: 12px; }

.fs__mosaic { display: grid; grid-template-columns: 1.45fr 1fr; grid-template-rows: 1fr 1fr; gap: clamp(12px, 1.4vw, 22px); height: clamp(520px, 52vw, 860px); }
.fs__img { position: relative; margin: 0; overflow: hidden; background: var(--sand); }
.fs__img--a { grid-row: 1 / 3; }
.fs__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.6s var(--ease-out); }
.fs__img:hover img { transform: scale(1.04); }
.fs__img figcaption {
	position: absolute; left: clamp(16px, 2vw, 28px); bottom: clamp(16px, 2vw, 28px);
	display: flex; align-items: center; gap: 14px; padding: 12px 20px 12px 14px;
	background: rgba(250, 247, 242, .94); color: var(--ink);
	font: 500 11px/1 var(--sans); letter-spacing: .26em; text-transform: uppercase;
}
.fs__img figcaption span { font: italic 400 18px/1 var(--serif); letter-spacing: 0; color: var(--accent); }

.fs__caps { list-style: none; margin: clamp(56px, 6vw, 96px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(24px, 3vw, 56px); counter-reset: cap; }
.fs__caps li { counter-increment: cap; padding-top: 28px; border-top: 1px solid var(--line); position: relative; }
.fs__caps li::before { content: "0" counter(cap); position: absolute; top: -1px; left: 0; padding-top: 14px; border-top: 1px solid var(--brass); width: 48px; font: italic 400 15px/1 var(--serif); color: var(--brass); }
.fs__caps h3 { margin: 22px 0 12px; font-size: clamp(22px, 1.7vw, 27px); }
.fs__caps p { font-size: 15px; color: var(--taupe); margin: 0; }

.fs__founder {
	margin-top: clamp(56px, 6vw, 96px); padding: clamp(24px, 3vw, 40px) clamp(24px, 3vw, 48px);
	display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: clamp(20px, 3vw, 48px);
	background: var(--ivory); border: 1px solid rgba(184, 151, 90, .25);
}
.fs__portrait { width: 96px; height: 96px; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 4px var(--paper), 0 0 0 5px var(--brass); }
.fs__portrait img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.fs__founder p { margin: 0; max-width: 640px; font-size: 16px; }
.fs__founder strong { font: italic 400 22px/1.3 var(--serif); color: var(--ink); }
.fs__sbid { width: 120px; filter: invert(1) grayscale(1); opacity: .7; mix-blend-mode: multiply; }

@media (max-width: 1100px) {
	.fs__caps { grid-template-columns: repeat(2, 1fr); }
	.fs__founder { grid-template-columns: auto 1fr; }
	.fs__sbid { display: none; }
	.fs__founder .btn { grid-column: 1 / -1; justify-self: start; }
}
@media (max-width: 900px) {
	.fs__head { grid-template-columns: 1fr; }
	.fs__mosaic { grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; height: auto; }
	.fs__img--a { grid-column: 1 / -1; grid-row: auto; aspect-ratio: 4 / 3.4; }
	.fs__img--b, .fs__img--c { aspect-ratio: 1; }
}
@media (max-width: 560px) {
	.fs__caps { grid-template-columns: 1fr; }
	.fs__founder { grid-template-columns: 1fr; text-align: left; }
	.fs__img figcaption { padding: 9px 14px 9px 10px; font-size: 10px; letter-spacing: .2em; }
}

/* ---------- Unified heading style (readable Bodoni cut) ---------- */
h1, h2, h3, h4, .brand__name, .project__title, .facts dt, .hero__facts dt, .footer-contact a, .aside-card__phone, .contact-details .big, .quote blockquote, .quote-grid blockquote, .project-nav strong, .hero__project strong, .press__label p, .fs__founder strong {
	font-variation-settings: "opsz" 14;
	font-optical-sizing: none;
}
h1, h2 { font-weight: 500; letter-spacing: -.015em; }
h3, h4, .project__title { font-weight: 500; letter-spacing: -.005em; }
h1 em, h2 em, h3 em { font-weight: 400; }
.quote blockquote, .quote-grid blockquote, .prose blockquote { font-weight: 400; }

/* ---------- Spacing rhythm fixes ---------- */
:root { --section: clamp(64px, 8vw, 128px); }
.page-hero { padding-top: clamp(32px, 4vw, 64px); }
.page-hero + .section { padding-top: clamp(40px, 5vw, 72px) !important; }
.page-hero .crumbs { margin-bottom: 22px; }
/* Two plain (cream) sections in a row share one gap, not two. */
.section:not(.section--ivory):not(.section--ink):not(.cta) + .section:not(.section--ivory):not(.section--ink):not(.cta) { padding-top: 0; }
.section--ivory + .section--ivory { padding-top: 0; }
.prose > :last-child, .prose > :last-child > :last-child { margin-bottom: 0; }
.js [data-reveal] { transition-duration: .9s, 1s; }

/* Line-mask must not clip descenders (y, g, p) or italic overhangs */
.split-line { padding: 0 .08em .2em; margin: 0 -.08em -.2em; }
.split-line > span { transform: translateY(110%); }
.is-loaded .split-line > span, .no-js .split-line > span { transform: none; }

/* ---------- Partner card (MUDA) ---------- */
.partner {
	grid-template-columns: minmax(200px, 320px) 1fr; gap: 0; padding: 0; align-items: stretch;
	background: var(--ivory); border: 1px solid rgba(184, 151, 90, .25); overflow: hidden;
}
.partner > img { width: 100%; height: 100%; min-height: 200px; object-fit: contain; background: #000; padding: 40px; margin: 0; mix-blend-mode: normal; }
.partner > div { padding: clamp(28px, 3.4vw, 52px); display: flex; flex-direction: column; justify-content: center; }
.partner h3 { margin: 0 0 14px; }
.partner p { font-size: 16px; max-width: 640px; }
.partner a { align-self: flex-start; display: inline-flex; gap: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--brass) !important; font: 500 11px/1 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: var(--ink) !important; }
.partner a:hover { color: var(--accent) !important; }
.prose > p:empty, .partner > p:empty { display: none; }
@media (max-width: 700px) { .partner { grid-template-columns: 1fr; } .partner > img { min-height: 140px; padding: 32px; } }

/* ---------- Journal ---------- */
.post-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font: 500 11px/1.4 var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--taupe); }
.post-meta .tag { padding: 6px 10px; border: 1px solid var(--brass); color: var(--accent); letter-spacing: .2em; margin-right: 6px; }

.feature-post { display: grid; grid-template-columns: 1.35fr 1fr; gap: clamp(28px, 4vw, 72px); align-items: center; }
.feature-post__media { aspect-ratio: 16 / 11; overflow: hidden; background: var(--sand); }
.feature-post__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease-out); }
.feature-post:hover .feature-post__media img { transform: scale(1.04); }
.feature-post__body h2 { font-size: clamp(30px, 3.2vw, 52px); margin: 22px 0 20px; transition: color .3s; }
.feature-post:hover h2 { color: var(--accent); }
.feature-post__body p { font-size: 16.5px; color: var(--ink-2); margin-bottom: 30px; }
@media (max-width: 900px) { .feature-post { grid-template-columns: 1fr; } }

.post-card { display: flex; flex-direction: column; }
.post-card .post-meta { margin-bottom: 4px; }
.post-card h3 { font-size: clamp(21px, 1.6vw, 26px); line-height: 1.22; }
.post-card p { color: var(--ink-2); opacity: .8; }
.post-card__more { margin-top: auto; padding-top: 10px; display: inline-flex; align-items: center; gap: 10px; font: 500 11px/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--ink); }
.post-card__more svg { width: 15px; transition: transform .45s var(--ease-out); }
.post-card:hover .post-card__more svg { transform: translateX(6px); }
.section--ivory .post-card__media { background: var(--sand); }

/* Single article */
.read-progress { position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 200; pointer-events: none; }
.read-progress span { display: block; height: 100%; width: 100%; background: var(--brass); transform-origin: left; transform: scaleX(0); }
.article__head { padding-block: clamp(32px, 4vw, 64px) clamp(32px, 4vw, 56px); }
.article__head .wrap { max-width: 980px; }
.article__head h1 { font-size: clamp(36px, 4.6vw, 72px); margin: 24px 0 0; }
.article__head .lead { margin-top: 24px; }
.article__hero { height: clamp(320px, 70vh, 760px); overflow: hidden; }
.article__hero img { width: 100%; height: 116%; margin-top: -8%; object-fit: cover; }

.article__layout { display: grid; grid-template-columns: 1fr minmax(0, 760px) 1fr; gap: 40px; padding-block: clamp(48px, 6vw, 96px); }
.article__aside { grid-column: 1; justify-self: end; }
.article__sticky { position: sticky; top: 120px; display: flex; flex-direction: column; gap: 12px; font-size: 13.5px; }
.article__sticky .label, .article__author .label { font: 500 10.5px/1 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: var(--stone); margin-bottom: 6px; }
.article__sticky a { color: var(--ink-2); border-bottom: 1px solid transparent; align-self: flex-start; }
.article__sticky a:hover { color: var(--accent); border-color: var(--accent); }
.article__body { grid-column: 2; font-size: clamp(16.5px, 1.1vw, 18px); line-height: 1.85; color: var(--ink-2); font-weight: 400; }
.article__body > p:first-of-type { font-size: clamp(19px, 1.4vw, 22px); line-height: 1.65; color: var(--ink); font-weight: 300; }
.article__body > p:first-of-type::first-letter { float: left; font: 500 4.4em/.82 var(--serif); font-variation-settings: "opsz" 14; color: var(--accent); padding: 8px 14px 0 0; }
.article__body strong, .article__body b { font-weight: 600; color: var(--ink); }
.article__body img, .article__body figure img {
	display: block; width: auto; max-width: 100%; max-height: 78vh; margin: 2.4em auto; object-fit: contain;
	box-shadow: 0 30px 60px -30px rgba(20, 17, 15, .35);
}
.article__body figure { margin: 2.4em 0; }
.article__body figcaption { text-align: center; font-size: 13px; color: var(--taupe); margin-top: -1.4em; }
.article__body .wp-block-image, .article__body .aligncenter { text-align: center; }

.article__foot { padding-bottom: clamp(48px, 6vw, 80px); max-width: 760px; }
.article__author { display: flex; align-items: center; gap: 20px; padding: 28px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.article__author div { display: flex; flex-direction: column; }
.article__author strong { font: 500 22px/1.2 var(--serif); font-variation-settings: "opsz" 14; color: var(--ink); }
.article__author span:last-child { font-size: 14px; color: var(--taupe); }
.project-nav > span { display: block; }

@media (max-width: 1100px) {
	.article__layout { grid-template-columns: minmax(0, 760px); justify-content: center; }
	.article__aside { grid-column: 1; grid-row: 2; justify-self: start; }
	.article__body { grid-column: 1; grid-row: 1; }
	.article__sticky { position: static; flex-direction: row; flex-wrap: wrap; gap: 18px; align-items: center; padding-top: 28px; border-top: 1px solid var(--line); }
	.article__sticky .label { margin: 0; }
}

/* Article: same header as other pages, full-width body */
.article__head { padding-block: clamp(32px, 4vw, 64px) clamp(40px, 5vw, 72px); }
.article__head .wrap { max-width: none; }
.article__head h1 { font-size: clamp(36px, 4.4vw, 72px); margin: 0; max-width: 20ch; }
.article__head .page-hero__intro { align-items: end; }
.article__layout { grid-template-columns: 200px minmax(0, 1fr); gap: clamp(32px, 5vw, 96px); }
.article__aside { grid-column: 1; justify-self: start; }
.article__body { grid-column: 2; max-width: 1040px; }
.article__body img, .article__body figure img { margin-left: 0; margin-right: 0; max-height: 82vh; }
.article__foot { padding-left: calc(var(--gutter) + 200px + clamp(32px, 5vw, 96px)); max-width: none; }
.article__author { max-width: 1040px; }
@media (max-width: 1100px) {
	.article__layout { grid-template-columns: minmax(0, 1fr); }
	.article__body { grid-column: 1; grid-row: 1; max-width: none; }
	.article__aside { grid-row: 2; }
	.article__foot { padding-left: var(--gutter); }
}

/* Stacked hero (News + articles): full-width title, details beneath */
.page-hero--stacked .page-hero__intro { grid-template-columns: 1fr; gap: clamp(20px, 2.4vw, 32px); align-items: start; }
.page-hero--stacked h1 { max-width: none; }
.page-hero--stacked .page-hero__intro > p, .page-hero--stacked .page-hero__intro > div:last-child { justify-self: start; max-width: 900px; }
.page-hero--stacked .page-hero__intro > div:last-child:not(:first-child) { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 32px; padding-top: 22px; border-top: 1px solid var(--line); max-width: none; width: 100%; }
.page-hero--stacked .page-hero__intro > div:last-child .lead { margin: 0 !important; max-width: 760px; }
.article__body { max-width: none; }
.article__author { max-width: none; }
.blog .page-hero--stacked { padding-bottom: clamp(24px, 3vw, 40px); }
.blog .page-hero + .section { padding-top: 0 !important; }

/* ---------- Contact map ---------- */
.locations { position: relative; min-height: clamp(520px, 70vh, 760px); background: var(--sand); }
.locations__map { position: absolute; inset: 0; z-index: 0; }
.locations__map .leaflet-tile-pane { filter: sepia(.25) saturate(.7) brightness(1.02); }
.locations__panel {
	position: absolute; z-index: 2; top: 50%; left: var(--gutter); transform: translateY(-50%);
	width: min(440px, calc(100% - 2 * var(--gutter))); padding: clamp(28px, 3vw, 44px);
	background: rgba(250, 247, 242, .97); box-shadow: 0 40px 80px -40px rgba(20, 17, 15, .45); border-top: 2px solid var(--brass);
}
.js .locations__panel[data-reveal] { transform: translateY(calc(-50% + 30px)); }
.js .locations__panel[data-reveal].is-in { transform: translateY(-50%); }
.locations__panel h2 { font-size: clamp(28px, 2.4vw, 38px); margin-bottom: 24px; }
.locations__list { list-style: none; margin: 0; padding: 0; }
.locations__list li { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 16px 0; border-top: 1px solid var(--line); }
.locations__list button { display: flex; gap: 14px; text-align: left; background: none; border: 0; padding: 0; color: var(--ink-2); font-size: 14px; line-height: 1.5; }
.locations__list button strong { display: block; font: 500 19px/1.3 var(--serif); font-variation-settings: "opsz" 14; color: var(--ink); margin-bottom: 2px; transition: color .3s; }
.locations__list button:hover strong, .locations__list li.is-active strong { color: var(--accent); }
.locations__list .n { flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--ink); color: #fff; font: 500 12px/1 var(--sans); transition: background .3s; }
.locations__list li.is-active .n { background: var(--brass); }
.locations__list a { flex-shrink: 0; font: 500 10.5px/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--ink); padding: 6px 0 4px; border-bottom: 1px solid var(--brass); }
.locations__list a:hover { color: var(--accent); }

.map-pin { position: relative; width: 44px; height: 56px; }
.map-pin span {
	position: absolute; left: 50%; top: 0; width: 40px; height: 40px; margin-left: -20px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg);
	background: var(--ink); border: 2px solid var(--brass); box-shadow: 0 10px 20px -6px rgba(20, 17, 15, .5); transition: background .3s, transform .4s var(--ease-out);
}
.map-pin b { position: absolute; left: 0; right: 0; top: 11px; text-align: center; color: #fff; font: 500 14px/1 var(--sans); z-index: 1; }
.map-pin.is-active span { background: var(--brass); transform: rotate(-45deg) scale(1.15); }
.leaflet-popup-content-wrapper { border-radius: 0; box-shadow: 0 20px 40px -20px rgba(20, 17, 15, .4); }
.leaflet-popup-content { margin: 16px 20px; font: 300 13.5px/1.5 var(--sans); color: var(--ink-2); }
.leaflet-popup-content strong { display: block; font: 500 18px/1.3 var(--serif); color: var(--ink); margin-bottom: 4px; }
.leaflet-container a.leaflet-popup-close-button { color: var(--ink); }
.leaflet-control-attribution { font-size: 10px; background: rgba(250, 247, 242, .8) !important; }
.leaflet-bar a { color: var(--ink) !important; border-radius: 0 !important; }

@media (max-width: 860px) {
	.locations { min-height: 0; display: flex; flex-direction: column; }
	.locations__map { position: relative; height: 380px; }
	.locations__panel, .js .locations__panel[data-reveal], .js .locations__panel[data-reveal].is-in { position: relative; top: auto; left: auto; transform: none; width: auto; margin: -40px var(--gutter) 0; }
	.locations { padding-bottom: var(--section); }
}
.locations__map .leaflet-tile-pane { filter: grayscale(1) sepia(.35) brightness(1.06) contrast(.92); }

/* ---------- Legal pages (full width + contents) ---------- */
.legal { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: clamp(40px, 6vw, 120px); align-items: start; }
.legal__toc { position: sticky; top: 110px; max-height: calc(100vh - 140px); overflow: auto; padding-right: 8px; }
.legal__toc .label { display: block; font: 500 11px/1 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: var(--accent); margin-bottom: 18px; }
.legal__toc ol { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--line); }
.legal__toc a { display: block; padding: 7px 0 7px 18px; margin-left: -1px; border-left: 1px solid transparent; font-size: 13.5px; line-height: 1.4; color: var(--taupe); transition: color .3s, border-color .3s; }
.legal__toc a:hover, .legal__toc a.is-current { color: var(--ink); border-color: var(--brass); }
.legal__body { counter-reset: legal; font-size: 16px; }
.legal__body ol.wp-block-list:has(> li:only-child > strong) { list-style: none; padding: 0; margin: 2.6em 0 .8em; counter-increment: legal; scroll-margin-top: 110px; }
.legal__body ol.wp-block-list:has(> li:only-child > strong) li { padding: 0; border: 0; display: flex; gap: 16px; align-items: baseline; }
.legal__body ol.wp-block-list:has(> li:only-child > strong) li::before { content: counter(legal, decimal-leading-zero); position: static; width: auto; height: auto; background: none; font: italic 400 20px/1 var(--serif); color: var(--brass); }
.legal__body ol.wp-block-list:has(> li:only-child > strong) strong { font: 500 clamp(24px, 2vw, 32px)/1.2 var(--serif); font-variation-settings: "opsz" 14; color: var(--ink); }
.legal__body > ol:first-child { margin-top: 0; }
.legal__body p { margin: 0 0 1em; max-width: 980px; }
.legal__body ul li { padding-block: 8px; }
@media (max-width: 960px) { .legal { grid-template-columns: 1fr; } .legal__toc { position: static; max-height: none; } }

/* ---------- Map (Google) ---------- */
.locations__embed { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: grayscale(.35) sepia(.15); }
.map-info { font: 300 13.5px/1.5 var(--sans); color: var(--ink-2); max-width: 220px; }
.map-info strong { display: block; font: 500 17px/1.3 var(--serif); color: var(--ink); margin-bottom: 4px; }
@media (max-width: 860px) { .locations__embed { position: absolute; } }

/* ---------- reCAPTCHA + trust badges + consent ---------- */
.grecaptcha-badge { z-index: 240 !important; bottom: 20px !important; }
.recaptcha-note { grid-column: 1 / -1; display: flex; gap: 10px; align-items: flex-start; margin: -8px 0 0; font-size: 12.5px; color: var(--taupe); }
.recaptcha-note svg { width: 18px; flex-shrink: 0; color: var(--brass); }
.recaptcha-note a { color: var(--ink-2); border-bottom: 1px solid var(--line); }
.consent-bar {
	position: fixed; z-index: 250; left: var(--gutter); right: var(--gutter); bottom: 20px; margin-inline: auto; max-width: 880px;
	display: flex; align-items: center; justify-content: space-between; gap: 20px 32px; flex-wrap: wrap;
	padding: 22px 26px; background: var(--paper); border-top: 2px solid var(--brass); box-shadow: 0 30px 60px -20px rgba(20,17,15,.45);
	font-size: 14px; animation: consentIn .6s var(--ease-out);
}
.consent-bar[hidden] { display: none; }
.consent-bar p { margin: 0; flex: 1 1 360px; }
.consent-bar a { color: var(--accent); border-bottom: 1px solid currentColor; }
.consent-bar__actions { display: flex; gap: 10px; }
.consent-bar .btn { padding: 13px 22px; }
@keyframes consentIn { from { transform: translateY(30px); opacity: 0; } }
@media (min-width: 861px) { .locations__panel { left: auto; right: var(--gutter); } }

.consent-bar strong { font-weight: 500; color: var(--ink); }
.footer-bottom .credit { color: rgba(255,255,255,.5); }
.footer-bottom .credit a { color: rgba(255,255,255,.8); border-bottom: 1px solid rgba(184,151,90,.6); }
.footer-bottom .credit a:hover { color: #fff; border-color: var(--brass); }

/* ---------- Journal: image beside its text ---------- */
.article__body .media-row {
	display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 72px);
	align-items: start; margin: clamp(40px, 5vw, 80px) 0;
}
.article__body .media-row--flip .media-row__media { order: 2; }
.article__body .media-row__media { position: sticky; top: 110px; }
.article__body .media-row__media figure, .article__body .media-row__media p { margin: 0; }
.article__body .media-row__media img {
	width: 100% !important; height: auto !important; max-height: 82vh; margin: 0; object-fit: cover;
	box-shadow: 0 30px 60px -30px rgba(20, 17, 15, .35);
}
.article__body .media-row__text { align-self: center; }
.article__body .media-row__text > :first-child { margin-top: 0; }
.article__body .media-row__text p { margin: 0 0 1.2em; }
.article__body .media-row__text > :last-child { margin-bottom: 0; }
@media (max-width: 820px) {
	.article__body .media-row { grid-template-columns: 1fr; gap: 24px; }
	.article__body .media-row--flip .media-row__media { order: 0; }
	.article__body .media-row__media { position: static; }
	.article__body .media-row__media img { max-height: 70vh; }
}

/* Failsafe: if the script never runs, never leave content hidden. */
.reveal-fallback [data-reveal], .reveal-fallback [data-reveal] img { opacity: 1 !important; transform: none !important; clip-path: none !important; }
.reveal-fallback .split-line > span, .reveal-fallback .hero .eyebrow, .reveal-fallback .hero__text, .reveal-fallback .hero__actions, .reveal-fallback .hero__facts { opacity: 1 !important; transform: none !important; }

/* Finished reveals: plain painting, no lingering clip/transform layers. */
.js [data-reveal].is-done, .js [data-reveal="clip"].is-done { transition: none; transform: none; clip-path: none; will-change: auto; }
.js [data-reveal="clip"].is-done img { transform: none; transition: transform 1.4s var(--ease-out); }
.js [data-reveal="clip"].is-done:hover img, .fs__img.is-done:hover img { transform: scale(1.04); }

/* Diagnostic: add ?fx=off to any URL to disable every visual effect. */
.no-fx *, .no-fx *::before, .no-fx *::after { animation: none !important; transition: none !important; }
.no-fx [data-reveal], .no-fx [data-reveal] img, .no-fx .split-line > span, .no-fx .hero .eyebrow, .no-fx .hero__text, .no-fx .hero__actions, .no-fx .hero__facts { opacity: 1 !important; transform: none !important; clip-path: none !important; }
.no-fx img { transform: none !important; filter: none !important; }
.no-fx .site-header, .no-fx .site-header.is-scrolled { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.no-fx .hero__slide img { transform: none !important; }

/* Above-the-fold header images: visible immediately, no script needed, no parallax offsets. */
.page-hero__media img, .article__hero img { height: 100%; margin-top: 0; object-fit: cover; animation: heroImgIn 1.1s var(--ease-out) both; }
.feature-post__media img { animation: heroImgIn 1.1s var(--ease-out) both; }
@keyframes heroImgIn { from { opacity: 0; transform: scale(1.04); } to { opacity: 1; transform: none; } }

/* ---------- Page progress (top) ---------- */
.page-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 260; pointer-events: none; }
.page-progress span { display: block; height: 100%; background: linear-gradient(90deg, var(--accent), var(--brass) 60%, #e2c999); transform-origin: left; transform: scaleX(0); }
.read-progress { display: none; }

/* ---------- Floating buttons ---------- */
:root { --float-gap: clamp(16px, 2vw, 28px); --consent-h: 0px; }
.to-top, .wa { position: fixed; bottom: calc(var(--float-gap) + var(--consent-h)); z-index: 230; transition: bottom .4s var(--ease); }

.to-top {
	left: var(--float-gap); width: 52px; height: 52px; padding: 0; border: 0; border-radius: 50%;
	background: rgba(250, 247, 242, .95); color: var(--ink); box-shadow: 0 12px 30px -12px rgba(20, 17, 15, .45);
	display: grid; place-items: center; cursor: pointer;
	opacity: 0; visibility: hidden; transform: translateY(14px);
	transition: opacity .4s var(--ease), transform .5s var(--ease-out), visibility .4s, background .3s, color .3s, bottom .4s var(--ease);
}
.to-top.is-visible { opacity: 1; visibility: visible; transform: none; }
.to-top:hover { background: var(--ink); color: #fff; }
.to-top__ring { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.to-top__ring circle { fill: none; stroke-width: 2; stroke: rgba(20, 17, 15, .1); }
.to-top__ring .to-top__fill { stroke: var(--brass); stroke-linecap: round; transition: stroke-dashoffset .1s linear; }
.to-top__arrow { width: 20px; height: 20px; position: relative; transition: transform .4s var(--ease-out); }
.to-top:hover .to-top__arrow { transform: translateY(-3px); }

.wa { right: var(--float-gap); display: flex; flex-direction: column; align-items: flex-end; gap: 14px; }
.wa__btn {
	position: relative; display: inline-flex; align-items: center; gap: 0; height: 58px; padding: 0 17px; border: 0; border-radius: 100px;
	background: #25d366; color: #fff; cursor: pointer; box-shadow: 0 14px 32px -12px rgba(18, 140, 60, .65);
	transition: gap .45s var(--ease-out), padding .45s var(--ease-out), background .3s, transform .3s;
}
.wa__btn svg { width: 24px; height: 24px; flex-shrink: 0; }
.wa__btn:hover { background: #1ebe5b; transform: scale(1.06); }
.wa__btn::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: 0 0 0 0 rgba(37, 211, 102, .55); }
/* Logo animation: a soft pulse ring, and a little "ring-ring" wiggle every few seconds. */
.wa.is-ready .wa__btn::after { animation: waPulse 3s var(--ease-out) infinite; }
.wa.is-ready .wa__btn svg { animation: waRing 5s ease-in-out 1s infinite; transform-origin: 50% 60%; }
.wa__btn:hover svg { animation-play-state: paused; }
@keyframes waRing { 0%, 76%, 100% { transform: rotate(0) scale(1); } 80% { transform: rotate(-16deg) scale(1.12); } 84% { transform: rotate(14deg) scale(1.12); } 88% { transform: rotate(-10deg) scale(1.08); } 92% { transform: rotate(6deg) scale(1.04); } 96% { transform: rotate(-2deg); } }
@media (prefers-reduced-motion: reduce) { .wa.is-ready .wa__btn::after, .wa.is-ready .wa__btn svg { animation: none; } }
@keyframes waPulse { 0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, .55); } 100% { box-shadow: 0 0 0 18px rgba(37, 211, 102, 0); } }

.wa__card {
	width: min(340px, calc(100vw - 2 * var(--float-gap))); overflow: hidden; border-radius: 14px;
	background: #fff; box-shadow: 0 30px 70px -20px rgba(20, 17, 15, .45);
	transform-origin: bottom right; animation: waIn .4s var(--ease-out);
}
.wa__card[hidden] { display: none; }
@keyframes waIn { from { opacity: 0; transform: translateY(12px) scale(.96); } }
.wa__head { display: flex; align-items: center; gap: 12px; padding: 16px 16px 16px 18px; background: #075e54; color: #fff; }
.wa__avatar { width: 40px; height: 40px; border-radius: 50%; background: rgba(255, 255, 255, .15); display: grid; place-items: center; flex-shrink: 0; }
.wa__avatar svg { width: 22px; height: 22px; }
.wa__head strong { display: block; font: 500 15px/1.3 var(--sans); }
.wa__status { font-size: 12px; opacity: .8; }
.wa__close { margin-left: auto; width: 34px; height: 34px; border: 0; background: none; color: #fff; display: grid; place-items: center; opacity: .8; cursor: pointer; }
.wa__close:hover { opacity: 1; }
.wa__close svg { width: 18px; }
.wa__body { padding: 20px 18px; background: #efe7dd; }
.wa__bubble { position: relative; margin: 0; max-width: 88%; padding: 12px 14px; border-radius: 0 10px 10px 10px; background: #fff; font-size: 14px; line-height: 1.5; color: #303030; box-shadow: 0 1px 1px rgba(0, 0, 0, .08); }
.wa__start { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 14px; padding: 14px; border-radius: 100px; background: #25d366; color: #fff; font: 500 13px/1 var(--sans); letter-spacing: .04em; transition: background .3s; }
.wa__start:hover { background: #1ebe5b; color: #fff; }
.wa__start svg { width: 18px; height: 18px; }

/* Keep reCAPTCHA badge clear of the WhatsApp button. */
.grecaptcha-badge { bottom: calc(var(--float-gap) + 80px) !important; }

@media (max-width: 600px) {
	.to-top { width: 46px; height: 46px; }
	.wa__btn { height: 54px; padding: 0 15px; }
}
.menu-open .wa, .menu-open .to-top { opacity: 0; pointer-events: none; }
@media print { .wa, .to-top, .page-progress { display: none !important; } }

/* ---------- Floating buttons vs cookie bar: buttons never move ---------- */
:root { --consent-h: 0px !important; }
.to-top, .wa { bottom: var(--float-gap) !important; }
@media (min-width: 701px) {
	/* Bar sits between the two corner buttons (52px + 58px wide + gaps). */
	.consent-bar { left: calc(var(--float-gap) + 76px); right: calc(var(--float-gap) + 84px); max-width: 900px; }
}
@media (max-width: 700px) {
	.consent-open .wa, .consent-open .to-top { opacity: 0 !important; visibility: hidden; pointer-events: none; transform: translateY(12px); }
	.wa { transition: opacity .4s var(--ease), transform .5s var(--ease-out), visibility .4s; }
}

/* ---------- Chat card in brand colours ---------- */
.wa__head { background: var(--ink); color: #faf7f2; border-bottom: 2px solid var(--brass); }
.wa__head strong { font: 500 19px/1.2 var(--serif); font-variation-settings: "opsz" 14; letter-spacing: .01em; color: #faf7f2; }
.wa__status { color: #d8bd8a; opacity: 1; letter-spacing: .14em; text-transform: uppercase; font-size: 10.5px; }
.wa__avatar { background: var(--brass); color: var(--ink); }
.wa__close { color: #faf7f2; }
.wa__body { background: var(--ivory); }
.wa__bubble { border-left: 2px solid var(--brass); color: var(--ink-2); }
.wa__head strong { font-size: 17px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wa__head > div { min-width: 0; }
.wa__card { width: min(372px, calc(100vw - 2 * var(--float-gap))); }
.wa__head strong { font-size: 17px; overflow: visible; text-overflow: clip; white-space: normal; }
.wa__head { gap: 10px; padding-right: 10px; }

/* Chat card: original WhatsApp backgrounds; only the title text is recoloured. */
.wa__head { background: #075e54; color: #fff; border-bottom: 0; }
.wa__avatar { background: rgba(255, 255, 255, .15); color: #fff; }
.wa__status { color: #fff; opacity: .8; letter-spacing: normal; text-transform: none; font-size: 12px; }
.wa__close { color: #fff; }
.wa__body { background: #efe7dd; }
.wa__bubble { border-left: 0; color: #303030; }
.wa__head strong { color: #e2c999; }
.wa__btn { text-decoration: none; }
.wa__btn:hover { color: #fff; }

/* Hero caption: long project names wrap; counter + bars always visible and clear of the WhatsApp button. */
@media (min-width: 901px) {
	.hero__caption { width: auto; left: auto; max-width: min(720px, 56vw); right: calc(clamp(20px, 3.4vw, 64px) + 84px); gap: 28px; align-items: flex-end; }
	.hero__project, .hero__project.is-active { flex: 1 1 auto; min-width: 0; max-width: none; }
	.hero__project strong { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.15; }
	.hero__controls { flex: 0 0 auto; }
}

/* Mobile/tablet hero caption: name uses the full width, progress bars sit underneath. */
@media (max-width: 900px) {
	.hero__content { padding-bottom: 170px; }
	.hero__caption { flex-direction: column; align-items: flex-start; gap: 12px; }
	.hero__project, .hero__project.is-active { max-width: 100%; }
	.hero__project strong { font-size: 20px; white-space: normal; line-height: 1.2; }
	.hero__controls { align-items: flex-start; }
}

/* =========================================================================
 * Mobile polish (audit at 360 / 390 / 414 / 768px)
 * ---------------------------------------------------------------------- */

/* 1) Grid columns may shrink below their content's natural width; long words wrap. */
.services, .content-grid, .intro, .fs__head, .page-hero__intro, .contact, .feature-post, .project-info { min-width: 0; }
.services > *, .content-grid > *, .fs__head > *, .page-hero__intro > *, .contact > *, .project-info > * { min-width: 0; }
.service-list a { grid-template-columns: 40px minmax(0, 1fr) auto; }
h1, h2, h3, .project__title, .project-nav strong, .hero__project strong { overflow-wrap: break-word; hyphens: manual; }

@media (max-width: 960px) {
	.content-grid { grid-template-columns: minmax(0, 1fr); }
	.services { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 600px) {
	/* 2) Side-box button can wrap on narrow phones. */
	.aside-card .btn { white-space: normal; text-align: center; line-height: 1.5; padding: 16px 18px; }
	.aside-card { padding: 30px 22px; }

	/* 3) Previous / next project: stack instead of two cramped columns. */
	.project-nav { grid-template-columns: 1fr; }
	.project-nav a + a { border-left: 0; border-top: 1px solid var(--line); text-align: left; align-items: flex-start; }

	/* Bigger tap targets (~40px) for links that sit in lists. */
	.site-footer li a, .site-footer address + *, .footer-bottom li a { display: inline-block; padding: 9px 0; }
	.site-footer li { margin-bottom: 0; }
	.footer-contact a { padding: 6px 0; }
	.footer-contact p a { display: inline-block; padding: 8px 0; }
	.aside-card__phone, .contact-details .big { padding: 6px 0; }
	.contact-details a[href^="mailto"] { display: inline-block; padding: 8px 0; }
	.link-arrow { padding-top: 12px; padding-bottom: 12px; }
	.article__sticky a { padding: 8px 0; }
	.locations__list a { padding: 12px 0 8px; }
	.hero__tab { height: 40px; }

	/* Readable minimum for small labels. */
	.article__sticky .label, .article__author .label, .project__cat, .locations__list a, .fs__img figcaption, .post-meta, .eyebrow { font-size: 11.5px; }
}

/* "What we do" cards on phones: text covers most of the card, so shade more of it. */
@media (max-width: 900px) {
	.sector::after { background: linear-gradient(0deg, rgba(20,17,15,.88) 0%, rgba(20,17,15,.62) 55%, rgba(20,17,15,.25) 100%); }
	.sector h3, .sector p { text-shadow: 0 1px 12px rgba(10, 8, 6, .45); }
}

/* Tablets too: comfortable tap targets and label size. */
@media (max-width: 1024px) {
	.site-footer li a, .footer-bottom li a, .footer-contact p a, .contact-details a[href^="mailto"] { display: inline-block; padding: 9px 0; }
	.site-footer li { margin-bottom: 0; }
	.footer-contact > a, .aside-card__phone { display: inline-block; padding: 6px 0; }
	.link-arrow, .article__sticky a { padding-top: 12px; padding-bottom: 12px; }
	.article__sticky .label, .article__author .label { font-size: 11.5px; }
}

/* Subtle rounded corners (3px) on buttons, boxes and cards. Photos and headers stay sharp. */
:root { --r: 3px; }
.btn, .btn::before, .filters button, .aside-card, .contact-details,
.fs__founder, .partner, .quote-grid figure, .consent-bar, .nav-primary .sub-menu,
.field input, .field select, .field textarea, .post-meta .tag, .locations__panel,
.fs__img figcaption, .notice, .pagination .page-numbers { border-radius: var(--r); }
.partner, .aside-card { overflow: hidden; }
.project__media, .post-card__media, .sector, .fs__img, .feature-post__media { border-radius: var(--r); overflow: hidden; }

/* Slightly larger reading text (~1px). Headings, labels and buttons unchanged. */
body { font-size: clamp(16px, 1.05vw, 17.5px); }
.prose, .article__body { font-size: clamp(17px, 1.15vw, 19px); }
.lead, .hero__text { font-size: clamp(17.5px, 1.3vw, 20px); }
.sector p, .step p, .service-list p, .fs__caps p, .post-card p, .project__loc, .team p, .partner p, .aside-card p, .contact-details address, .site-footer { font-size: 16px; }
@media (max-width: 600px) { body { font-size: 16px; } .prose, .article__body { font-size: 17px; } }

/* Rounded buttons: the hover fill covers the full button (border included), so no dark slivers show in the corners. */
.btn::before, .btn--light::before { inset: -1px; border-radius: var(--r, 0); }
.btn { background-clip: padding-box; }

/* Footer credit: curved gold swoosh underline that redraws like a pen stroke on hover. */
.footer-bottom .credit a {
	border-bottom: 0 !important; padding-bottom: 7px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 8' preserveAspectRatio='none'%3E%3Cpath d='M1 6 C 50 1, 150 1, 199 5' fill='none' stroke='%23b8975a' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") left bottom / 100% 7px no-repeat;
}
.footer-bottom .credit a:hover, .footer-bottom .credit a:focus-visible { animation: swooshDraw .7s var(--ease-out); }
@keyframes swooshDraw { from { background-size: 0% 7px; } to { background-size: 100% 7px; } }
@media (prefers-reduced-motion: reduce) { .footer-bottom .credit a:hover { animation: none; } }

.footer-loc { font-style: normal; margin: 0 0 14px; }
.footer-loc strong { display: block; font: 500 11px/1.6 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--brass); margin-bottom: 2px; }
.footer-loc a { display: block; color: inherit; transition: color .3s; }
.footer-loc a:hover, .footer-loc a:focus-visible { color: #fff; }
.footer-loc a:hover strong::after, .footer-loc a:focus-visible strong::after { opacity: 1; transform: none; }
.footer-loc strong::after { content: " ↗"; opacity: 0; display: inline-block; transform: translate(-3px, 2px); transition: opacity .3s, transform .3s; }

/* ---------- Share ---------- */
.project, .post-card { position: relative; }
.project__link { display: block; }
.post-card__link { display: flex; flex-direction: column; flex: 1; }
.share-btn {
	position: absolute; top: 14px; right: 14px; z-index: 3; width: 42px; height: 42px; display: grid; place-items: center;
	border: 0; border-radius: 50%; background: rgba(250, 247, 242, .92); color: var(--ink); cursor: pointer;
	box-shadow: 0 6px 18px rgba(20, 17, 15, .14); transition: opacity .3s, transform .3s var(--ease-out), background .3s, color .3s;
}
.share-btn svg { width: 18px; height: 18px; }
.share-btn:hover, .share-btn[aria-expanded="true"] { background: var(--ink); color: #fff; }
.share-btn:focus-visible { outline: 2px solid var(--brass); outline-offset: 2px; }
@media (hover: hover) {
	.project .share-btn, .post-card .share-btn { opacity: 0; transform: translateY(-4px); }
	.project:hover .share-btn, .post-card:hover .share-btn, .share-btn:focus-visible, .share-btn[aria-expanded="true"] { opacity: 1; transform: none; }
}
.feature-post__media { display: block; }
.feature-post__body h2 a { color: inherit; }
.feature-post__actions { display: flex; align-items: center; gap: 22px; }
.feature-post__actions .share-btn { position: static; box-shadow: none; border: 1px solid var(--line); background: transparent; }

.share-menu {
	position: absolute; z-index: 300; min-width: 190px; padding: 8px; display: flex; flex-direction: column;
	background: var(--paper); border: 1px solid var(--line); border-radius: var(--r, 0); box-shadow: 0 18px 50px rgba(20, 17, 15, .18);
	animation: shareIn .22s var(--ease-out) both;
}
@keyframes shareIn { from { opacity: 0; transform: translateY(-6px); } }
.share-menu a, .share-menu button {
	display: block; width: 100%; text-align: left; padding: 11px 14px; border: 0; background: none; cursor: pointer;
	font: 500 11px/1.4 var(--sans); letter-spacing: .18em; text-transform: uppercase; color: var(--ink); border-radius: var(--r, 0);
}
.share-menu a:hover, .share-menu button:hover, .share-menu :focus-visible { background: var(--ivory); color: var(--accent); outline: none; }

.share { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; }
.share a, .share button {
	padding: 4px 0; border: 0; border-bottom: 1px solid transparent; background: none; cursor: pointer;
	font: 500 11px/1.6 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--ink-2);
}
.share a:hover, .share button:hover { color: var(--accent); border-color: var(--accent); }
.project-info dd.project-info__share { font: inherit; }
.article__sticky .share { flex-direction: column; gap: 10px; }
.article__sticky .share a, .article__sticky .share button { font: inherit; letter-spacing: 0; text-transform: none; font-size: 13.5px; }
@media (max-width: 600px) { .share a, .share button { padding: 9px 0; } }

/* ---------- WhatsApp pop-up message ---------- */
.wa__tip { position: relative; width: min(280px, calc(100vw - 2 * var(--float-gap) - 20px)); opacity: 0; transform: translateY(10px) scale(.96); transform-origin: bottom right; transition: opacity .35s var(--ease), transform .45s var(--ease-out); }
.wa__tip.is-shown { opacity: 1; transform: none; }
.wa__tip[hidden] { display: none; }
.wa__tip-link { display: block; padding: 14px 40px 14px 16px; background: #fff; color: #303030; border-radius: 14px 14px 4px 14px; box-shadow: 0 12px 36px rgba(20, 17, 15, .18), 0 1px 2px rgba(20, 17, 15, .08); font: 400 14px/1.5 var(--sans); }
.wa__tip-link::after { content: ""; position: absolute; right: 22px; bottom: -7px; width: 14px; height: 14px; background: #fff; transform: rotate(45deg); border-radius: 0 0 3px 0; }
.wa__tip-link strong { display: block; margin-bottom: 2px; font: 600 12px/1.4 var(--sans); letter-spacing: .04em; color: #075e54; }
.wa__tip-link:hover { color: #303030; }
.wa__tip-link:hover .wa__tip-text { text-decoration: underline; text-decoration-color: #25d366; text-underline-offset: 3px; }
.wa__tip-close { position: absolute; top: 6px; right: 6px; z-index: 1; width: 30px; height: 30px; display: grid; place-items: center; border: 0; border-radius: 50%; background: none; color: #8a8a8a; cursor: pointer; }
.wa__tip-close:hover { background: #f1f1f1; color: #303030; }
.wa__tip-close svg { width: 15px; height: 15px; }
.wa__tip-typing { display: none; gap: 4px; padding: 6px 0 4px; }
.wa__tip.is-typing .wa__tip-typing { display: inline-flex; }
.wa__tip.is-typing .wa__tip-text { display: none; }
.wa__tip-typing i { width: 7px; height: 7px; border-radius: 50%; background: #9aa0a6; animation: waDot 1s infinite ease-in-out; }
.wa__tip-typing i:nth-child(2) { animation-delay: .15s; }
.wa__tip-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes waDot { 0%, 60%, 100% { transform: translateY(0); opacity: .5; } 30% { transform: translateY(-4px); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .wa__tip, .wa__tip-typing i { transition: none; animation: none; } }

/* ---------- Mobile menu: booking button and contact details under the links ---------- */
.nav-extra { display: flex; flex-direction: column; gap: 14px; margin-top: 36px; opacity: 0; transform: translateY(16px); transition: opacity .5s var(--ease) .5s, transform .6s var(--ease-out) .5s; }
.menu-open .nav-extra { opacity: 1; transform: none; }
.nav-primary .nav-extra .btn { justify-content: center; padding-block: 18px; }
.nav-primary .nav-extra__phone { font: 400 26px/1.2 var(--serif); letter-spacing: 0; text-transform: none; color: var(--ink); padding: 6px 0 0; }
.nav-primary .nav-extra__mail { font: 400 14px/1.5 var(--sans); letter-spacing: .01em; text-transform: none; color: var(--taupe); padding: 4px 0 8px; overflow-wrap: anywhere; }
@media (min-width: 1025px) { .nav-extra { display: none; } }
@media (max-width: 1024px) {
	/* After the desktop dropdown rules, so the phone sizes win. */
	.nav-primary .sub-menu { padding: 0 0 18px 2px; min-width: 0; border-top: 0; }
	.nav-primary .sub-menu a { padding: 12px 0; font-size: 16px; letter-spacing: .01em; }
}
@media (min-width: 1025px) {
	/* Larger desktop menu text. */
	.nav-primary > ul > li > a { font-size: 13px; letter-spacing: .14em; }
	.header-cta .btn { font-size: 12.5px; letter-spacing: .14em; }
}
@media (min-width: 1025px) and (max-width: 1240px) {
	.nav-primary > ul > li > a { font-size: 12px; letter-spacing: .1em; }
	.nav-primary > ul { gap: 14px; }
}
/* The logo keeps its proportions however tight the bar gets. */
.brand { flex-shrink: 0; min-width: max-content; }
.brand__logo { max-width: none; object-fit: contain; }
/* Larger top strip and navbar text. */
:root { --topbar-h: 44px; }
.topbar { font-size: 13px; letter-spacing: .1em; }
.topbar__links { font-size: 13.5px; }
.topbar__inner { opacity: .85; }
@media (min-width: 1025px) {
	.nav-primary > ul > li > a { font-size: 14px; letter-spacing: .12em; }
	.header-cta .btn { font-size: 13px; }
}
@media (min-width: 1025px) and (max-width: 1366px) {
	.topbar { font-size: 12px; letter-spacing: .08em; }
	.topbar__links { font-size: 13px; gap: 24px; }
	.nav-primary > ul > li > a { font-size: 13px; letter-spacing: .1em; }
}
@media (min-width: 1025px) and (max-width: 1240px) {
	.nav-primary > ul > li > a { font-size: 12.5px; letter-spacing: .06em; }
}
@media (min-width: 1025px) and (max-width: 1240px) {
	.brand__logo { height: 42px; }
	.nav-primary > ul { gap: 12px; }
	.nav-primary > ul > li > a { font-size: 12px; letter-spacing: .04em; }
	.header-cta .btn { padding-inline: 18px; font-size: 11.5px; letter-spacing: .08em; }
}
/* Desktop header sizes scale with the screen, so the logo, links and button always fit on one line
   (≈12px text on small laptops up to 15px on large screens). Overrides the stepped sizes above. */
@media (min-width: 1025px) {
	.brand__logo { height: clamp(40px, 3.1vw, 50px); }
	.nav-primary > ul { gap: clamp(10px, 2.2vw - 14px, 36px); }
	.nav-primary > ul > li > a { font-size: clamp(12px, .55vw + 6.5px, 15px); letter-spacing: clamp(.03em, .16vw - 1.5px, .12em); }
	.header-cta .btn { font-size: clamp(11px, .4vw + 6.5px, 13px); padding-inline: clamp(16px, 1.8vw, 28px); letter-spacing: .1em; }
	.header-main { column-gap: clamp(16px, 2vw, 32px); }
}


/* ---------- Newsletter sign-up (footer and pop-up) ---------- */
.footer-nl__title { margin-top: 34px !important; }
.footer-nl__text { margin: -10px 0 14px; font-size: 14px; }
.nl-form__hp { position: absolute; left: -9999px; }
.nl-form__row { display: flex; gap: 0; max-width: 380px; }
.nl-form input[type="email"] { flex: 1; min-width: 0; padding: 12px 14px; border: 1px solid rgba(255, 255, 255, .22); border-right: 0; background: rgba(255, 255, 255, .05); color: #fff; font: 400 14px/1.2 var(--sans); border-radius: var(--r, 0) 0 0 var(--r, 0); }
.nl-form input[type="email"]::placeholder { color: rgba(255, 255, 255, .5); }
.nl-form input[type="email"]:focus { outline: none; border-color: var(--brass); }
.nl-form button { padding: 0 18px; border: 1px solid var(--brass); background: var(--brass); color: #14110f; font: 500 11px/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; cursor: pointer; border-radius: 0 var(--r, 0) var(--r, 0) 0; transition: background .3s, color .3s; }
.nl-form button:hover { background: #fff; border-color: #fff; }
.nl-form__consent { display: flex; gap: 8px; align-items: flex-start; max-width: 380px; margin-top: 10px; font-size: 12px; line-height: 1.5; color: rgba(255, 255, 255, .55); }
.nl-form__consent input { margin-top: 2px; accent-color: var(--brass); }
.nl-form__consent a { color: inherit; text-decoration: underline; }
.nl-form__msg { min-height: 1em; margin: 8px 0 0; font-size: 13px; color: #d8bd8a; }
.site-footer .footer-contact .nl-form a { display: inline; font: inherit; color: inherit; padding: 0; }

/* Pop-up (light background) */
.welcome-pop { width: min(520px, calc(100vw - 32px)); max-height: calc(100vh - 32px); padding: clamp(28px, 4vw, 44px); border: 0; border-radius: var(--r, 0); background: var(--paper); color: var(--ink); box-shadow: 0 30px 80px rgba(20, 17, 15, .35); overflow: auto; }
.welcome-pop::backdrop { background: rgba(20, 17, 15, .55); }
.welcome-pop[open] { animation: popIn .45s var(--ease-out); }
@keyframes popIn { from { opacity: 0; transform: translateY(16px) scale(.98); } }
.welcome-pop h2 { margin: 0 32px 14px 0; font-size: clamp(26px, 3vw, 34px); }
.welcome-pop__body img { max-width: 100%; height: auto; margin: 0 0 16px; border-radius: var(--r, 0); }
.welcome-pop__body p { margin: 0 0 14px; }
.welcome-pop__close { position: absolute; top: 14px; right: 14px; width: 40px; height: 40px; display: grid; place-items: center; border: 0; background: none; color: var(--ink); cursor: pointer; }
.welcome-pop__close svg { width: 20px; height: 20px; }
.welcome-pop .nl-form { margin-top: 18px; }
.welcome-pop .nl-form input[type="email"] { background: #fff; color: var(--ink); border-color: var(--line); }
.welcome-pop .nl-form input[type="email"]::placeholder { color: var(--taupe); }
.welcome-pop .nl-form button:hover { background: var(--ink); border-color: var(--ink); color: #fff; }
.welcome-pop .nl-form__consent { color: var(--taupe); }
.welcome-pop .nl-form__msg { color: var(--accent); }
@media (prefers-reduced-motion: reduce) { .welcome-pop[open] { animation: none; } }