/* ==========================================================================
   Ottawa Renovation — main stylesheet
   Tokens, type scale and spacing are taken from the approved Figma file
   (Shared design system). Breakpoints follow the Figma frames:
   Desktop 1440 / Laptop 1280  →  Tablet 768  →  Mobile 390.
   ========================================================================== */

/* Fonts (self-hosted variable fonts, latin subset) ------------------------- */
@font-face {
	font-family: "Manrope";
	font-style: normal;
	font-weight: 400 600;
	font-display: swap;
	src: url("../fonts/manrope-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Inter";
	font-style: normal;
	font-weight: 400 600;
	font-display: swap;
	src: url("../fonts/inter-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Tokens ------------------------------------------------------------------- */
:root {
	/* Colour (Figma variables) */
	--c-charcoal: #1f2933;
	--c-copper: #c47a43;
	--c-copper-dark: #b46b36;    /* surface/support-4, primary hover */
	--c-copper-text: #9a5a2b;    /* copper darkened for AA text on light surfaces */
	--c-slate: #5a697e;          /* Figma #64748b darkened for WCAG AA on warm/stone surfaces */
	--c-btn-text: #000000;       /* logo black: text on copper, AA at default (6.2:1) and hover (5.1:1) */
	--c-green: #2a6f04;          /* logo green: small accents on light surfaces (AA on warm, stone, white) */
	--c-warm: #f8f7f4;
	--c-white: #ffffff;
	--c-stone: #eeeae3;          /* surface/support-2 */
	--c-line: #dcddd8;           /* border/support-1 */
	--c-mist: #cbd0d3;           /* text/support-7 */
	--c-footer-line: #48515a;    /* surface/support-8 */
	--c-black: #000000;
	--c-error: #a93434;
	--c-success: #35684c;

	/* Type */
	--f-heading: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
	--f-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

	--fs-display: 68px;  --ls-display: -2px;
	--fs-h2: 44px;       --ls-h2: -1.1px;
	--fs-h3: 28px;
	--fs-card: 22px;
	--fs-lead: 18px;
	--fs-body: 17px;

	/* Layout */
	--gutter: 80px;
	--section-y: 96px;
	--stack: 48px;
	--split-gap: 72px;
	--max: 1440px;
	--header-h: 96px;
	--radius: 3px;
	--ease: cubic-bezier(.2, .7, .2, 1);
}

/* Base --------------------------------------------------------------------- */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 16px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

body {
	margin: 0;
	background: var(--c-warm);
	color: var(--c-charcoal);
	font-family: var(--f-body);
	font-size: var(--fs-body);
	line-height: 1.65;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
body.nav-open { overflow: hidden; }

img, picture, svg, video { display: block; max-width: 100%; }
img { height: auto; }
picture { width: 100%; height: 100%; }

a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--c-green); }

h1, h2, h3, h4, h5, h6, p, figure, blockquote, ul, ol, dl { margin: 0; }
h1, h2, h3, h4 { font-family: var(--f-heading); font-weight: 600; text-wrap: balance; }
p { text-wrap: pretty; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }

:focus-visible {
	outline: 3px solid var(--c-charcoal);
	outline-offset: 3px;
}
.section--charcoal :focus-visible,
.site-footer :focus-visible,
.hero :focus-visible,
.pathway :focus-visible { outline-color: var(--c-warm); }

.screen-reader-text,
.visually-hidden {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0);
	white-space: nowrap; border: 0;
}
.skip-link {
	position: absolute; left: 16px; top: -100px; z-index: 1000;
	padding: 12px 18px; background: var(--c-charcoal); color: var(--c-white);
	font-weight: 600; font-size: 15px; border-radius: var(--radius);
	text-decoration: none;
}
.skip-link:focus { top: 16px; color: var(--c-white); }

/* Layout ------------------------------------------------------------------- */
.container {
	width: 100%;
	max-width: var(--max);
	margin-inline: auto;
	padding-inline: var(--gutter);
}
.section { padding-block: var(--section-y); }
.section > .container { display: flex; flex-direction: column; gap: var(--stack); align-items: flex-start; }
.section > .container > * { max-width: 100%; }
.section > .container > .grid,
.section > .container > .split,
.section > .container > .media,
.section > .container > .accordion-layout,
.section > .container > .full { width: 100%; }

.section--warm { background: var(--c-warm); }
.section--white { background: var(--c-white); }
.section--stone { background: var(--c-stone); }
.section--charcoal { background: var(--c-charcoal); color: var(--c-warm); }

.grid { display: grid; gap: 32px; }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px 40px; }

.split {
	display: flex;
	gap: var(--split-gap);
	align-items: center;
}
.split > * { flex: 1 1 0; min-width: 0; }
.split--top { align-items: flex-start; }
.split--reverse { flex-direction: row-reverse; }

.stack { display: flex; flex-direction: column; gap: 24px; align-items: flex-start; }
.stack > * { max-width: 100%; }
.stack--20 { gap: 20px; }
.stack--14 { gap: 14px; }

/* Typography --------------------------------------------------------------- */
.eyebrow {
	display: flex;
	gap: 12px;
	align-items: baseline;
	font-family: var(--f-body);
	font-weight: 600;
	font-size: 12px;
	line-height: 1.3;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: var(--c-slate);
}
.eyebrow__dash { color: var(--c-green); letter-spacing: 0; }
.section--charcoal .eyebrow__dash,
.hero .eyebrow__dash,
.pathway .eyebrow__dash,
.site-footer .eyebrow__dash { color: var(--c-copper); }
.section--charcoal .eyebrow,
.hero .eyebrow,
.pathway .eyebrow { color: var(--c-mist); }

.display {
	font-size: var(--fs-display);
	line-height: 1.16;
	letter-spacing: var(--ls-display);
	color: var(--c-charcoal);
}
.h2 {
	font-size: var(--fs-h2);
	line-height: 1.16;
	letter-spacing: var(--ls-h2);
	color: var(--c-charcoal);
}
.h3 {
	font-size: var(--fs-h3);
	line-height: 1.16;
	letter-spacing: -1.1px;
	color: var(--c-charcoal);
}
.lead { font-size: var(--fs-lead); line-height: 1.65; color: var(--c-slate); }
.body { font-size: var(--fs-body); line-height: 1.65; color: var(--c-slate); }
.body--sm { font-size: 15px; }
.body--md { font-size: 16px; }
.small { font-size: 13px; line-height: 1.65; color: var(--c-slate); }
.prose { display: flex; flex-direction: column; gap: 24px; color: var(--c-slate); font-size: var(--fs-body); line-height: 1.65; }
.prose a { color: var(--c-charcoal); }
.prose ul, .prose ol { padding-left: 1.2em; display: grid; gap: 8px; }
.prose strong { color: var(--c-charcoal); font-weight: 600; }
.section--charcoal .h2,
.section--charcoal .display { color: var(--c-warm); }
.section--charcoal .body,
.section--charcoal .lead { color: var(--c-mist); }

.measure { max-width: 920px; }

/* Buttons & links ---------------------------------------------------------- */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	padding: 15px 21px;
	border: 1px solid var(--c-black);
	border-radius: var(--radius);
	font-family: var(--f-body);
	font-weight: 600;
	font-size: 15px;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease);
}
.btn .icon { flex: none; transition: transform .2s var(--ease); }
.btn:hover .icon { transform: translate(2px, -2px); }
.btn--primary { background: var(--c-copper); color: var(--c-btn-text); }
.btn--primary:hover { background: var(--c-copper-dark); color: var(--c-btn-text); }
.btn--secondary { background: var(--c-warm); color: var(--c-charcoal); border-color: var(--c-charcoal); }
.btn--secondary:hover { background: var(--c-stone); color: var(--c-charcoal); }
.btn--dark { background: var(--c-black); color: var(--c-white); border-color: var(--c-mist); }
.btn--dark:hover { background: var(--c-charcoal); color: var(--c-white); }
.btn:focus-visible { outline: 3px solid var(--c-charcoal); outline-offset: 2px; }
.btn--dark:focus-visible,
.section--charcoal .btn:focus-visible { outline-color: var(--c-warm); }
.btn[disabled],
.btn.is-disabled { background: var(--c-stone); color: var(--c-slate); pointer-events: none; }

.text-link {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-weight: 600;
	font-size: 15px;
	line-height: 1.3;
	color: var(--c-charcoal);
	text-decoration: none;
}
.text-link span { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .25s var(--ease); }
.text-link:hover { color: var(--c-charcoal); }
.text-link:hover span { background-size: 100% 1px; }
.text-link .icon { flex: none; transition: transform .2s var(--ease); }
.text-link:hover .icon { transform: translate(2px, -2px); }
.text-link--light { color: var(--c-white); }
.text-link--light:hover { color: var(--c-white); }
.text-link--light .icon { color: var(--c-copper); }

.divider { height: 1px; width: 100%; background: var(--c-line); border: 0; margin: 0; }

/* Media ("Labeled architectural image") ------------------------------------ */
.media { width: 100%; }
.media__frame { position: relative; width: 100%; overflow: hidden; background: var(--c-stone); }
.media__frame img,
.media__frame picture { width: 100%; height: 100%; object-fit: cover; }
.media__frame picture img { width: 100%; height: 100%; object-fit: cover; }
.media__caption { font-size: 11px; line-height: 2.5; color: var(--c-slate); }
.media--editorial .media__frame { height: 480px; }
.media--card .media__frame { height: 220px; }
.media--tile .media__frame { height: 330px; }
.media--feature .media__frame { height: 460px; }
.media--detail .media__frame { height: 520px; }
.media--wide-md .media__frame { height: 640px; }
.media--wide-lg .media__frame { height: 660px; }
.media--wide-xl .media__frame { height: 700px; }
.media--wide-md .media__caption,
.media--wide-lg .media__caption,
.media--wide-xl .media__caption { padding-inline: var(--gutter); max-width: var(--max); margin-inline: auto; }

a .media__frame img,
button .media__frame img { transition: transform .6s var(--ease); }
a:hover .media__frame img,
button:hover .media__frame img { transform: scale(1.03); }

/* Header ------------------------------------------------------------------- */
.site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: var(--c-warm);
	border-bottom: 1px solid var(--c-line);
}
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 0; } }

.site-header__bar {
	height: var(--header-h);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
}
.site-logo { display: inline-flex; align-items: center; flex: none; text-decoration: none; }
.site-logo__img { height: 64px; width: auto; }
.brand { display: inline-flex; align-items: center; gap: 12px; }
.brand__mark { height: 44px; width: auto; flex: none; }
.brand__mark--custom { height: 56px; }
.brand__name { font-family: var(--f-heading); font-weight: 400; font-size: 20px; line-height: 1.2; letter-spacing: -0.6px; color: var(--c-charcoal); white-space: nowrap; }
.brand--light .brand__mark { height: 44px; }
.brand--light { flex-direction: column; align-items: flex-start; gap: 14px; }
.brand--light .brand__name { font-weight: 600; font-size: 25px; letter-spacing: 0; color: var(--c-white); white-space: normal; }

.primary-nav { display: flex; align-items: center; }
.primary-nav__list,
.primary-nav__list ul { list-style: none; margin: 0; padding: 0; }
.primary-nav__list { display: flex; align-items: center; gap: 24px; }
.primary-nav__list > li { position: static; }
.primary-nav__list > li > a,
.primary-nav__toggle {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 0;
	background: none;
	border: 0;
	font-family: var(--f-body);
	font-size: 13px;
	line-height: 1.2;
	color: var(--c-charcoal);
	text-decoration: none;
	white-space: nowrap;
}
.primary-nav__list > li > a { position: relative; }
.primary-nav__list > li > a::after,
.primary-nav__toggle::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 2px;
	height: 1px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .25s var(--ease);
}
.primary-nav__toggle { position: relative; }
.primary-nav__list > li > a:hover::after,
.primary-nav__toggle:hover::after,
.primary-nav__list > .current-menu-item > a::after,
.primary-nav__list > .current-menu-ancestor > .primary-nav__toggle::after,
.primary-nav__list > .current-menu-parent > .primary-nav__toggle::after { transform: scaleX(1); }
.primary-nav__list > li > a:hover { color: var(--c-charcoal); }
.primary-nav__toggle .icon { transition: transform .2s var(--ease); color: var(--c-charcoal); }
.primary-nav__toggle[aria-expanded="true"] .icon { transform: rotate(180deg); }

.site-header__cta { flex: none; }

/* Mega menu */
.mega {
	position: absolute;
	left: 0; right: 0;
	top: 100%;
	background: var(--c-warm);
	border-bottom: 1px solid var(--c-line);
	box-shadow: 0 24px 40px -32px rgba(31, 41, 51, .35);
	visibility: hidden;
	opacity: 0;
	transform: translateY(-6px);
	transition: opacity .2s var(--ease), transform .2s var(--ease), visibility 0s linear .2s;
}
.mega.is-open {
	visibility: visible;
	opacity: 1;
	transform: none;
	transition: opacity .2s var(--ease), transform .2s var(--ease), visibility 0s;
}
.mega__inner {
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: 64px;
	padding-block: 40px 48px;
}
.mega__intro { display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
.mega__title { font-family: var(--f-heading); font-weight: 600; font-size: 28px; line-height: 1.16; letter-spacing: -1.1px; }
.mega__list {
	list-style: none; margin: 0; padding: 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0 40px;
}
.mega__list li { border-top: 1px solid var(--c-line); }
.mega__list a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding: 16px 0;
	font-family: var(--f-heading);
	font-weight: 600;
	font-size: 17px;
	line-height: 1.4;
	color: var(--c-charcoal);
	text-decoration: none;
}
.mega__list a .icon { color: var(--c-green); transition: transform .2s var(--ease); }
.mega__list a:hover .icon { transform: translate(2px, -2px); }
.mega__list .current-menu-item > a { color: var(--c-green); }

/* Mobile navigation */
.nav-toggle {
	display: none;
	width: 44px; height: 44px;
	margin-right: -9px;
	align-items: center; justify-content: center;
	background: none; border: 0; color: var(--c-charcoal);
}
.mobile-nav {
	position: fixed;
	inset: var(--header-h) 0 0 0;
	z-index: 99;
	background: var(--c-warm);
	overflow-y: auto;
	overscroll-behavior: contain;
	visibility: hidden;
	opacity: 0;
	transition: opacity .2s var(--ease), visibility 0s linear .2s;
}
.admin-bar .mobile-nav { top: calc(var(--header-h) + 46px); }
.mobile-nav.is-open { visibility: visible; opacity: 1; transition: opacity .2s var(--ease), visibility 0s; }
.mobile-nav__inner { padding-block: 16px 48px; display: flex; flex-direction: column; gap: 32px; }
.mobile-nav__list,
.mobile-nav__list ul { list-style: none; margin: 0; padding: 0; }
.mobile-nav__list > li { border-bottom: 1px solid var(--c-line); }
.mobile-nav__list > li > a,
.mobile-nav__list .mobile-nav__toggle {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
	padding: 18px 0;
	background: none;
	border: 0;
	font-family: var(--f-heading);
	font-weight: 600;
	font-size: 22px;
	letter-spacing: -0.5px;
	color: var(--c-charcoal);
	text-decoration: none;
	text-align: left;
}
.mobile-nav__toggle .icon { transition: transform .2s var(--ease); }
.mobile-nav__toggle[aria-expanded="true"] .icon { transform: rotate(180deg); }
.mobile-nav__sub { padding: 0 0 16px; }
.mobile-nav__sub[hidden] { display: none; }
.mobile-nav__sub a {
	display: block;
	padding: 10px 0;
	font-size: 15px;
	color: var(--c-slate);
	text-decoration: none;
}
.mobile-nav__sub a:hover,
.mobile-nav__sub .current-menu-item > a { color: var(--c-charcoal); }
.mobile-nav__contact { display: flex; flex-direction: column; gap: 6px; font-size: 15px; color: var(--c-slate); }
.mobile-nav__contact a { color: var(--c-charcoal); text-decoration: none; }

/* Hero (homepage) ---------------------------------------------------------- */
.hero {
	position: relative;
	isolation: isolate;
	min-height: 780px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 40px;
	padding-block: 100px 28px;
	color: var(--c-white);
	overflow: hidden;
	background: var(--c-charcoal);
}
.hero__media { position: absolute; inset: 0; z-index: -2; }
.hero__media img,
.hero__media picture { width: 100%; height: 100%; object-fit: cover; }
.hero__overlay {
	position: absolute; inset: 0; z-index: -1;
	background: linear-gradient(90deg, rgba(18, 26, 33, .91) 0%, rgba(18, 26, 33, .66) 60%, rgba(18, 26, 33, .22) 100%);
}
.hero__inner { display: flex; flex-direction: column; gap: 40px; width: 100%; }
.hero__message { max-width: 730px; display: flex; flex-direction: column; gap: 28px; align-items: flex-start; }
.hero__title { font-size: var(--fs-display); line-height: 1.16; letter-spacing: var(--ls-display); color: var(--c-warm); }
.hero__text { font-size: 18px; line-height: 1.65; color: var(--c-white); }
.hero__actions { display: flex; flex-wrap: wrap; gap: 16px; }
.hero__footnote { display: flex; flex-direction: column; gap: 18px; padding-top: 64px; }
.hero__footnote::before { content: ""; height: 1px; background: var(--c-white); width: 100%; }
.hero__footnote p { font-size: 11px; color: var(--c-white); }

/* Page introduction -------------------------------------------------------- */
.page-intro > .container { gap: 48px; }
.page-intro__copy { max-width: 920px; display: flex; flex-direction: column; gap: 24px; }
.breadcrumbs { font-size: 12px; line-height: 1.6; color: var(--c-slate); }
.breadcrumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 10px; }
.breadcrumbs li { display: inline-flex; gap: 10px; }
.breadcrumbs li + li::before { content: "/"; color: var(--c-slate); padding-right: 0; }
.breadcrumbs a { color: var(--c-slate); text-decoration: none; }
.breadcrumbs a:hover { color: var(--c-charcoal); text-decoration: underline; }
.breadcrumbs [aria-current] { color: var(--c-slate); }

/* Service cards ------------------------------------------------------------ */
.service-card { display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
.service-card__title { font-family: var(--f-heading); font-weight: 600; font-size: var(--fs-card); line-height: 1.25; letter-spacing: -0.5px; }
.service-card__title a { text-decoration: none; color: var(--c-charcoal); }
.service-card__title a::after { content: ""; position: absolute; inset: 0; }
.service-card { position: relative; }
.service-card__text { font-size: 15px; line-height: 1.65; color: var(--c-slate); }
.service-card .text-link { position: relative; z-index: 1; pointer-events: none; }
.service-card:hover .text-link span { background-size: 100% 1px; }
.service-card:hover .text-link .icon { transform: translate(2px, -2px); }
.service-card:hover .media__frame img { transform: scale(1.03); }
.service-card .media__frame img { transition: transform .6s var(--ease); }
.service-card:focus-within { outline: 3px solid var(--c-charcoal); outline-offset: 6px; }
.service-card__title a:focus-visible { outline: none; }

/* Topic grid (features) ---------------------------------------------------- */
.topic { display: flex; flex-direction: column; gap: 20px; align-items: flex-start; }
.topic::before { content: ""; width: 100%; height: 1px; background: var(--c-line); }
.topic .icon { color: var(--c-green); }
.topic__text { color: var(--c-slate); font-size: 16px; line-height: 1.65; }
.grid--text-sm .topic__text { font-size: 15px; }
.grid--text-lg .topic__text { font-size: 17px; }
.grid--features { gap: 48px 40px; }
.grid--topics { gap: 32px; }
.grid--2.grid--topics { gap: 40px; }

/* Inspiration / project cards ---------------------------------------------- */
.tile { display: flex; flex-direction: column; gap: 14px; position: relative; }
.tile__meta { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.tile__details { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.tile__category { font-size: 12px; line-height: 1.3; color: var(--c-slate); }
.tile__title { font-family: var(--f-heading); font-weight: 600; font-size: 23px; line-height: 1.25; color: var(--c-charcoal); }
.tile__title a { color: inherit; text-decoration: none; }
.tile__title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.tile .icon { flex: none; color: var(--c-charcoal); transition: transform .2s var(--ease); }
.tile:hover .icon { transform: translate(2px, -2px); }
.tile:hover .media__frame img { transform: scale(1.03); }
.tile .media__frame img { transition: transform .6s var(--ease); }
.tile:focus-within { outline: 3px solid var(--c-charcoal); outline-offset: 6px; }
.tile__title a:focus-visible { outline: none; }
.tile--feature .tile__title { font-size: 28px; line-height: 1.16; letter-spacing: -1.1px; }
.tile--feature .tile__text { font-size: 14px; color: var(--c-slate); }

.portfolio-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; width: 100%; }
.portfolio-grid > .tile:first-child { grid-column: span 2; }

/* Process ------------------------------------------------------------------ */
.grid--process { gap: 32px 40px; }
.step { display: flex; flex-direction: column; gap: 20px; }
.step::before { content: ""; width: 100%; height: 1px; background: var(--c-line); }
.step__number { font-family: var(--f-heading); font-weight: 400; font-size: 36px; line-height: 1.2; color: var(--c-green); }
.step__text { font-size: 15px; line-height: 1.65; color: var(--c-slate); }

/* Pathways ----------------------------------------------------------------- */
.pathways { display: flex; }
.pathway {
	position: relative;
	isolation: isolate;
	flex: 1 1 0;
	min-height: 540px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 24px;
	padding: 48px 40px;
	color: var(--c-white);
	overflow: hidden;
	background: var(--c-charcoal);
}
.pathway__media { position: absolute; inset: 0; z-index: -2; }
.pathway__media img,
.pathway__media picture { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.pathway:hover .pathway__media img { transform: scale(1.03); }
.pathway::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: linear-gradient(180deg, rgba(31, 41, 51, .13) 0%, rgba(31, 41, 51, .95) 100%);
}
.pathway .h2 { color: var(--c-warm); }
.pathway__note { font-size: 11px; line-height: 1.4; color: var(--c-white); }

/* Area / local image placeholder ------------------------------------------- */
.placeholder-panel {
	width: 100%;
	min-height: 420px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 24px;
	padding: 32px;
	background: var(--c-stone);
	text-align: center;
}
.section--stone .placeholder-panel { background: var(--c-warm); }
.placeholder-panel .icon { color: var(--c-green); }
.placeholder-panel__title { font-family: var(--f-heading); font-weight: 400; font-size: 24px; line-height: 1.4; color: var(--c-charcoal); }
.placeholder-panel__note { font-size: 12px; color: var(--c-slate); }
.area-columns { display: flex; gap: 48px; width: 100%; }
.area-columns > * { flex: 1 1 0; min-width: 0; }

/* FAQ accordion ------------------------------------------------------------ */
.accordion-layout { display: flex; gap: 80px; align-items: flex-start; }
.accordion-layout__intro { flex: 0 0 380px; display: flex; flex-direction: column; gap: 24px; align-items: flex-start; }
.accordion-layout--category .accordion-layout__intro { flex-basis: 340px; }
.accordion-layout__list { flex: 1 1 0; min-width: 0; }

.accordion { border-bottom: 1px solid var(--c-line); }
.accordion__item { border-top: 1px solid var(--c-line); }
.accordion__heading { margin: 0; font: inherit; }
.accordion__button {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 24px 0;
	background: none;
	border: 0;
	text-align: left;
	font-family: var(--f-heading);
	font-weight: 600;
	font-size: 19px;
	line-height: 1.4;
	color: var(--c-charcoal);
}
.accordion--lg .accordion__button { font-size: 20px; gap: 24px; }
.accordion__button > span { flex: 1 1 auto; }
.accordion__button .icon { flex: none; }
.accordion__button .icon--minus { display: none; }
.accordion__button[aria-expanded="true"] .icon--plus { display: none; }
.accordion__button[aria-expanded="true"] .icon--minus { display: block; }
.accordion__button:hover { color: var(--c-green); }
.accordion__panel { padding: 0 28px 24px 0; color: var(--c-slate); font-size: 15px; line-height: 1.65; }
.accordion--lg .accordion__panel { padding: 0 24px 28px 0; font-size: 17px; }
.accordion__panel[hidden] { display: none; }
.accordion__panel > * + * { margin-top: 12px; }
.accordion-note { margin-top: 16px; font-size: 13px; color: var(--c-slate); }

.faq-index { display: flex; flex-wrap: wrap; gap: 20px; }
.faq-index a { font-weight: 600; font-size: 14px; color: var(--c-charcoal); text-decoration: none; display: inline-flex; gap: 6px; align-items: center; }
.faq-index a:hover { text-decoration: underline; }
.faq-index .icon { width: 14px; height: 14px; }
.section.faq-index-wrap { padding-top: 0; padding-bottom: 40px; }

/* Scope note --------------------------------------------------------------- */
.scope-note { padding-block: 32px; background: var(--c-stone); }
.scope-note .container { display: flex; flex-direction: column; gap: 8px; }
.scope-note__text { font-size: 17px; line-height: 1.65; color: var(--c-charcoal); }
.scope-note__detail { font-size: 14px; line-height: 1.65; color: var(--c-slate); }

/* CTA ---------------------------------------------------------------------- */
.cta > .container { gap: 36px; }
.cta__row { display: flex; gap: 40px; align-items: center; width: 100%; }
.cta__copy { flex: 1 1 auto; display: flex; flex-direction: column; gap: 24px; }
.cta__copy .body { color: var(--c-mist); }

/* Footer ------------------------------------------------------------------- */
.site-footer { background: var(--c-charcoal); color: var(--c-mist); padding-block: 96px 32px; }
.site-footer .container { display: flex; flex-direction: column; gap: 40px; }
.footer-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px; }
.footer-col { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.footer-col--company { gap: 20px; }
.footer-col__title { font-family: var(--f-body); font-weight: 600; font-size: 15px; line-height: 1.65; color: var(--c-white); }
.footer-brand { font-family: var(--f-heading); font-weight: 600; font-size: 25px; line-height: 1.2; color: var(--c-white); text-decoration: none; }
.footer-logo { display: inline-block; }
.footer-logo { text-decoration: none; }
.footer-logo img { width: auto; }
.footer-text { font-size: 14px; line-height: 1.65; }
.footer-text p + p { margin-top: 1.65em; }
.footer-menu { list-style: none; margin: 0; padding: 0; font-size: 13px; line-height: 2.6; }
.footer-menu a,
.footer-text a { color: var(--c-mist); text-decoration: none; }
.footer-menu a:hover,
.footer-text a:hover { color: var(--c-white); text-decoration: underline; }
.footer-contact { list-style: none; margin: 0; padding: 0; font-size: 14px; line-height: 1.65; }
.footer-contact li.gap { height: 1.65em; }
.site-footer .divider { background: var(--c-footer-line); }
.footer-scope { font-size: 13px; line-height: 1.65; }
.footer-legal { font-size: 12px; line-height: 1.6; display: flex; flex-wrap: wrap; gap: 6px 14px; }
.footer-legal a { color: var(--c-mist); }
.footer-legal a:hover { color: var(--c-white); }

/* Contact form ------------------------------------------------------------- */
.inquiry { display: flex; gap: 72px; align-items: flex-start; width: 100%; }
.inquiry__form { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 28px; }
.inquiry__aside {
	flex: 0 0 320px;
	display: flex; flex-direction: column; gap: 28px;
	padding: 28px;
	background: var(--c-warm);
	position: sticky;
	top: calc(var(--header-h) + 24px);
}
.inquiry__contacts { display: flex; flex-direction: column; gap: 20px; font-weight: 500; font-size: 15px; line-height: 1.65; }
.inquiry__contacts a { color: var(--c-charcoal); text-decoration: none; }
.inquiry__contacts a:hover { text-decoration: underline; }
.inquiry__contacts dt { color: var(--c-charcoal); }
.inquiry__contacts dd { margin: 0; color: var(--c-charcoal); }

.form { display: flex; flex-direction: column; gap: 28px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.field { display: flex; flex-direction: column; gap: 9px; min-width: 0; }
.field__label { font-weight: 500; font-size: 14px; line-height: 1.4; color: var(--c-charcoal); }
.field__label .req { color: var(--c-error); }
.field__hint { font-size: 12px; line-height: 1.5; color: var(--c-slate); }
.field .wpcf7-form-control-wrap { display: block; position: relative; }
.form input[type="text"],
.form input[type="email"],
.form input[type="tel"],
.form input[type="date"],
.form input[type="url"],
.form select,
.form textarea {
	width: 100%;
	min-height: 54px;
	padding: 15px 16px;
	background: var(--c-white);
	border: 1px solid var(--c-line);
	border-radius: var(--radius);
	font-size: 15px;
	line-height: 1.5;
	color: var(--c-charcoal);
	transition: border-color .15s var(--ease), box-shadow .15s var(--ease);
}
.form textarea { min-height: 152px; resize: vertical; }
.form select {
	appearance: none;
	padding-right: 44px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 17 17' fill='none'%3E%3Cpath d='M4.25 6.375L8.5 10.625L12.75 6.375' stroke='%235A697E' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 16px center;
}
.form ::placeholder { color: var(--c-slate); opacity: 1; }
.form input:focus,
.form select:focus,
.form textarea:focus { outline: none; border-color: var(--c-copper); box-shadow: 0 0 0 1px var(--c-copper); }
.form [aria-invalid="true"] { border-color: var(--c-error); }
.form input:disabled,
.form select:disabled { background-color: var(--c-stone); }

.upload {
	position: relative;
	display: flex; align-items: center; gap: 12px;
	min-height: 128px;
	padding: 16px;
	background: var(--c-white);
	border: 1px dashed var(--c-line);
	border-radius: var(--radius);
	color: var(--c-slate);
	font-size: 15px;
	transition: border-color .15s var(--ease);
}
.upload:hover,
.upload:focus-within { border-color: var(--c-copper); }
.upload .icon { color: var(--c-slate); flex: none; }
.upload input[type="file"] { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
.upload__name { color: var(--c-charcoal); font-weight: 500; }

.form-consent { font-size: 12px; line-height: 1.65; color: var(--c-slate); }
.form-consent a { color: var(--c-charcoal); }
.form-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* Contact Form 7 output */
.wpcf7 form { margin: 0; }
.wpcf7-not-valid-tip { display: block; margin-top: 6px; font-size: 12px; line-height: 1.5; color: var(--c-error); }
.wpcf7 form .wpcf7-response-output {
	margin: 0;
	padding: 16px 18px;
	border: 1px solid var(--c-line);
	border-left-width: 4px;
	border-radius: var(--radius);
	font-size: 15px;
	line-height: 1.5;
	background: var(--c-warm);
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output { border-color: var(--c-error); color: var(--c-charcoal); }
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--c-success); color: var(--c-charcoal); }
.wpcf7 form .wpcf7-response-output:empty,
.wpcf7 form.init .wpcf7-response-output { display: none; }
.wpcf7-spinner { margin: 0 0 0 12px; vertical-align: middle; }
.form-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.form-notice { padding: 24px; background: var(--c-stone); font-size: 15px; color: var(--c-charcoal); }

/* Gallery ------------------------------------------------------------------ */
.filters { display: flex; flex-wrap: wrap; gap: 10px; }
.filter {
	display: inline-flex;
	padding: 11px 16px;
	background: var(--c-white);
	border: 1px solid var(--c-line);
	border-radius: var(--radius);
	font-size: 13px;
	line-height: 1.2;
	color: var(--c-charcoal);
	text-decoration: none;
	transition: background-color .15s var(--ease), border-color .15s var(--ease), color .15s var(--ease);
}
.filter:hover { border-color: var(--c-charcoal); color: var(--c-charcoal); }
.filter[aria-pressed="true"],
.filter[aria-current="page"],
.filter.is-active { background: var(--c-charcoal); border-color: var(--c-charcoal); color: var(--c-white); }
.gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 44px; width: 100%; }
.gallery > .tile--wide { grid-column: span 2; }
.gallery > [hidden] { display: none; }
.gallery__open {
	display: block; width: 100%; padding: 0; border: 0; background: none; text-align: left;
	cursor: zoom-in; position: relative; z-index: 2;
}
.gallery-status:empty { display: none; }
.gallery-empty { padding: 48px 0; color: var(--c-slate); }

.thumb-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; width: 100%; }
.thumb-grid .gallery__open .media__frame { height: 260px; }

/* Lightbox */
.lightbox {
	position: fixed; inset: 0; z-index: 1000;
	display: flex; align-items: center; justify-content: center;
	padding: 72px 88px;
	background: rgba(18, 26, 33, .94);
}
.lightbox[hidden] { display: none; }
.lightbox__figure { display: flex; flex-direction: column; gap: 12px; max-width: 100%; max-height: 100%; }
.lightbox__img { max-width: 100%; max-height: calc(100vh - 180px); object-fit: contain; margin: 0 auto; }
.lightbox__caption { color: var(--c-mist); font-size: 13px; text-align: center; }
.lightbox__btn {
	position: absolute;
	width: 48px; height: 48px;
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--c-warm); color: var(--c-charcoal);
	border: 0; border-radius: 99px;
}
.lightbox__btn:hover { background: var(--c-copper); }
.lightbox__btn:focus-visible { outline: 3px solid var(--c-copper); outline-offset: 3px; }
.lightbox__close { top: 20px; right: 20px; }
.lightbox__prev { left: 20px; top: 50%; transform: translateY(-50%); }
.lightbox__next { right: 20px; top: 50%; transform: translateY(-50%); }
.lightbox__prev .icon { transform: rotate(-135deg); }
.lightbox__next .icon { transform: rotate(45deg); }

/* Before & after ----------------------------------------------------------- */
.compare { width: 100%; display: flex; flex-direction: column; gap: 16px; }
.compare__stage {
	position: relative;
	height: 440px;
	overflow: hidden;
	background: var(--c-line);
	--pos: 50%;
}
.compare__img { position: absolute; inset: 0; }
.compare__img img,
.compare__img picture { width: 100%; height: 100%; object-fit: cover; }
.compare__after { clip-path: inset(0 0 0 var(--pos)); }
.compare__label {
	position: absolute; top: 20px; z-index: 2;
	padding: 6px 10px; background: var(--c-warm);
	font-weight: 600; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; color: var(--c-charcoal);
}
.compare__label--before { left: 20px; }
.compare__label--after { right: 20px; }
.compare__divider {
	position: absolute; top: 0; bottom: 0; left: var(--pos); z-index: 2;
	width: 2px; margin-left: -1px; background: var(--c-warm); pointer-events: none;
}
.compare__handle {
	position: absolute; top: 50%; left: var(--pos); z-index: 3;
	width: 48px; height: 48px; margin: -24px 0 0 -24px;
	display: flex; align-items: center; justify-content: center;
	background: var(--c-copper); color: var(--c-btn-text); border-radius: 99px;
	pointer-events: none;
}
.compare__range {
	position: absolute; inset: 0; z-index: 4;
	width: 100%; height: 100%; margin: 0;
	opacity: 0; cursor: ew-resize;
}
.compare__range:focus-visible ~ .compare__handle { outline: 3px solid var(--c-charcoal); outline-offset: 3px; }

.compare--static .compare__stage { display: flex; gap: 2px; }
.compare__placeholder {
	flex: 1 1 0; min-width: 0;
	display: flex; flex-direction: column; justify-content: center; gap: 24px;
	padding: 32px;
	background: var(--c-stone);
}
.compare__placeholder + .compare__placeholder { background: var(--c-warm); }
.compare__placeholder strong { font-weight: 600; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; color: var(--c-charcoal); }
.compare__placeholder span { font-family: var(--f-heading); font-size: 28px; line-height: 1.4; color: var(--c-slate); }
.compare--static .compare__handle { pointer-events: none; }

/* Single project ----------------------------------------------------------- */
.project-overview { display: flex; gap: 64px; align-items: flex-start; width: 100%; }
.project-overview__story { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 24px; }
.project-facts { flex: 0 0 340px; display: flex; flex-direction: column; gap: 20px; margin: 0; }
.project-fact { display: flex; flex-direction: column; gap: 12px; }
.project-fact::before { content: ""; height: 1px; background: var(--c-line); }
.project-fact dd { margin: 0; font-size: 17px; line-height: 1.65; color: var(--c-charcoal); }
.project-fact dd a { color: var(--c-charcoal); }

/* Legal document ----------------------------------------------------------- */
.legal-meta__text { font-size: 17px; line-height: 1.65; color: var(--c-charcoal); }
.legal-meta__text p { margin: 0; }
.document { display: flex; gap: 80px; align-items: flex-start; width: 100%; }
.document__toc { flex: 0 0 280px; display: flex; flex-direction: column; gap: 20px; position: sticky; top: calc(var(--header-h) + 24px); }
.document__toc ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 20px; }
.document__toc a { display: flex; gap: 14px; font-size: 14px; line-height: 1.5; color: var(--c-charcoal); text-decoration: none; }
.document__toc a:hover { text-decoration: underline; }
.document__toc .num { flex: none; width: 1.6em; color: var(--c-slate); }
.document__body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 56px; }
.doc-section { display: flex; flex-direction: column; gap: 24px; }
.doc-section::before { content: ""; height: 1px; background: var(--c-line); }
.doc-section__body { display: flex; flex-direction: column; gap: 24px; color: var(--c-slate); font-size: 17px; line-height: 1.65; }
.doc-section__body > p:last-child:not(:first-child) { font-size: 15px; }
.doc-section__body ul,
.doc-section__body ol { padding-left: 1.2em; display: grid; gap: 8px; }

/* Default page / post content --------------------------------------------- */
.entry-content { max-width: 920px; display: flex; flex-direction: column; gap: 24px; font-size: 17px; line-height: 1.65; color: var(--c-slate); }
.entry-content h2 { font-size: 32px; line-height: 1.16; letter-spacing: -1.1px; color: var(--c-charcoal); margin-top: 24px; }
.entry-content h3 { font-size: 24px; line-height: 1.25; color: var(--c-charcoal); margin-top: 12px; }
.entry-content a { color: var(--c-charcoal); }
.entry-content img { height: auto; }
.entry-content ul, .entry-content ol { padding-left: 1.2em; display: grid; gap: 8px; }
.entry-content blockquote { border-left: 3px solid var(--c-copper); padding-left: 20px; color: var(--c-charcoal); }
.post-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 32px; width: 100%; }
.pagination .nav-links { display: flex; gap: 10px; flex-wrap: wrap; }
.pagination .page-numbers { display: inline-flex; min-width: 44px; height: 44px; align-items: center; justify-content: center; padding: 0 12px; border: 1px solid var(--c-line); border-radius: var(--radius); text-decoration: none; font-size: 14px; background: var(--c-white); }
.pagination .page-numbers.current { background: var(--c-charcoal); color: var(--c-white); border-color: var(--c-charcoal); }
.search-form { display: flex; gap: 12px; width: 100%; max-width: 560px; }
.search-form label { flex: 1; }
.search-form input[type="search"] { width: 100%; min-height: 54px; padding: 15px 16px; border: 1px solid var(--c-line); border-radius: var(--radius); background: var(--c-white); font-size: 15px; }

/* ==========================================================================
   Responsive
   ========================================================================== */

/* Laptop 1280 and narrower desktops */
@media (max-width: 1279px) {
	.primary-nav__list { gap: 20px; }
	.mega__inner { grid-template-columns: 220px 1fr; gap: 48px; }
	.inquiry { gap: 48px; }
	.inquiry__aside { flex-basis: 300px; }
}

/* Collapse the primary navigation to the mobile menu */
@media (max-width: 1080px) {
	:root { --header-h: 80px; }
	.primary-nav,
	.site-header__cta { display: none; }
	.nav-toggle { display: inline-flex; }
	.site-logo__img { height: 54px; }
	.brand__mark { height: 36px; }
	.grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 32px; }
	.accordion-layout { flex-direction: column; gap: 40px; }
	.accordion-layout__intro { flex-basis: auto; width: 100%; }
	.inquiry { flex-direction: column; }
	.inquiry__aside { position: static; flex-basis: auto; width: 100%; }
	.document { flex-direction: column; gap: 48px; }
	.document__toc { position: static; flex-basis: auto; }
	.project-overview { flex-direction: column; gap: 48px; }
	.project-facts { flex-basis: auto; width: 100%; }
}

/* Tablet 768 */
@media (max-width: 1023px) {
	:root {
		--gutter: 40px;
		--section-y: 80px;
		--stack: 40px;
		--split-gap: 48px;
		--fs-display: 52px;
		--fs-h2: 38px;
	}
	.hero { min-height: 720px; padding-block: 88px 28px; }
	.split,
	.split--reverse { flex-direction: column; align-items: stretch; }
	.split > .media { order: -1; }
	.grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.grid--process { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.portfolio-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.portfolio-grid > .tile:first-child { grid-column: span 2; }
	.gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 32px; }
	.gallery > .tile--wide { grid-column: span 2; }
	.pathways { flex-direction: column; }
	.pathway { min-height: 480px; }
	.cta__row { flex-direction: column; align-items: flex-start; gap: 32px; }
	.footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px 40px; }
	.area-columns { flex-direction: column; gap: 24px; }
	.media--wide-md .media__frame,
	.media--wide-lg .media__frame,
	.media--wide-xl .media__frame { height: 520px; }
	.post-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.thumb-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.media--feature .media__frame { height: 400px; }
	.media--detail .media__frame { height: 420px; }
	.compare__stage { height: 380px; }
}

/* Mobile 390 */
@media (max-width: 767px) {
	:root {
		--gutter: 24px;
		--section-y: 64px;
		--stack: 32px;
		--split-gap: 32px;
		--fs-display: 40px;
		--fs-h2: 32px;
		--fs-h3: 25px;
		--fs-card: 25px;
		--fs-lead: 16px;
		--fs-body: 16px;
	}
	.site-logo__img { height: 50px; }
	.brand { gap: 10px; }
	.brand__mark { height: 32px; }
	.brand__name { font-size: 18px; }
	.brand--light .brand__name { font-size: 22px; }
	.hero { min-height: 640px; padding-block: 72px 24px; }
	.hero__text { font-size: 16px; }
	.hero__actions { flex-direction: column; align-items: stretch; width: 100%; }
	.hero__actions .btn { justify-content: space-between; }
	.hero__footnote { padding-top: 40px; }
	.grid--2,
	.grid--3,
	.grid--4,
	.grid--process,
	.portfolio-grid,
	.gallery,
	.footer-grid,
	.post-list,
	.thumb-grid { grid-template-columns: minmax(0, 1fr); }
	.portfolio-grid > .tile:first-child,
	.gallery > .tile--wide { grid-column: auto; }
	.grid--features { gap: 40px; }
	.media--editorial .media__frame { height: 320px; }
	.media--card .media__frame { height: 240px; }
	.media--tile .media__frame,
	.media--feature .media__frame { height: 300px; }
	.media--detail .media__frame { height: 320px; }
	.media--wide-md .media__frame,
	.media--wide-lg .media__frame,
	.media--wide-xl .media__frame { height: 360px; }
	.pathway { min-height: 420px; padding: 40px 24px; }
	.placeholder-panel { min-height: 300px; }
	.accordion__button { font-size: 17px; }
	.accordion--lg .accordion__button { font-size: 18px; }
	.form-grid { grid-template-columns: minmax(0, 1fr); }
	.inquiry__aside { padding: 24px; }
	.cta .btn { width: 100%; justify-content: space-between; }
	.compare__stage { height: 300px; }
	.compare__placeholder { padding: 20px; }
	.compare__placeholder span { font-size: 20px; }
	.lightbox { padding: 64px 12px; }
	.lightbox__prev,
	.lightbox__next { top: auto; bottom: 12px; transform: none; }
	.site-footer { padding-top: 72px; }
	.mobile-nav__list > li > a,
	.mobile-nav__list .mobile-nav__toggle { font-size: 20px; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
	a:hover .media__frame img,
	.tile:hover .media__frame img,
	.service-card:hover .media__frame img,
	.pathway:hover .pathway__media img { transform: none; }
}

/* Print */
@media print {
	.site-header, .mobile-nav, .site-footer, .cta, .lightbox { display: none !important; }
	body { background: #fff; }
}

/* List resets for semantic grids */
ul.grid, ol.grid, .faq-index, .gallery { list-style: none; margin: 0; padding: 0; }
span.media__frame { display: block; }
.gallery__open .media__frame { height: 330px; }
.tile--wide .gallery__open .media__frame,
.tile--wide .media__frame { height: 330px; }
@media (max-width: 767px) { .gallery__open .media__frame { height: 300px; } }