/* =============================================
   Block-level overrides
   Map core Gutenberg block default markup back
   to the original BEM class styles so renders
   stay pixel-perfect.
   ============================================= */

/* ---- wp-block-group: collapse default gaps ---- */
.wp-block-group { box-sizing: border-box; }

.wp-block-group.hero,
.wp-block-group.services,
.wp-block-group.timeline,
.wp-block-group.work,
.wp-block-group.testimonials,
.wp-block-group.promise,
.wp-block-group.faq,
.wp-block-group.cta,
.wp-block-group.about-hero,
.wp-block-group.about-hero__inner,
.wp-block-group.about-hero__text,
.wp-block-group.about-hero__media,
.wp-block-group.about-stats,
.wp-block-group.about-stats__grid,
.wp-block-group.about-stat,
.wp-block-group.about-story,
.wp-block-group.about-story__inner,
.wp-block-group.about-story__media,
.wp-block-group.about-story__text,
.wp-block-group.about-values,
.wp-block-group.about-values__grid,
.wp-block-group.about-value,
.wp-block-group.about-timeline,
.wp-block-group.about-team,
.wp-block-group.about-team__grid,
.wp-block-group.about-member,
.wp-block-group.about-member__photo,
.wp-block-group.about-press,
.wp-block-group.about-press__logos,
.wp-block-group.about-quote,
.wp-block-group.olek-main,
.wp-block-group.hero__text,
.wp-block-group.hero__media,
.wp-block-group.hero__press,
.wp-block-group.service-card,
.wp-block-group.service-card__content,
.wp-block-group.service-card__overlay,
.wp-block-group.work__grid,
.wp-block-group.work__item,
.wp-block-group.work__text,
.wp-block-group.testimonials__grid,
.wp-block-group.testimonials__card,
.wp-block-group.testimonial__author,
.wp-block-group.testimonial__author-meta,
.wp-block-group.promise__left,
.wp-block-group.faq__grid,
.wp-block-group.faq__col,
.wp-block-group.cta__inner,
.wp-block-group.cta__image,
.wp-block-group.cta__text,
.wp-block-group.site-header,
.wp-block-group.site-header__inner,
.wp-block-group.site-footer,
.wp-block-group.site-footer__brand,
.wp-block-group.site-footer__nav,
.wp-block-group.site-footer__contact,
.wp-block-group.site-footer__address,
.wp-block-group.site-footer__bottom {
	gap: 0;
}

/* ---- wp-block-heading: only zero margins where olek.css does not set them ---- */
h3.wp-block-heading.service-card__title,
h3.wp-block-heading.work__title,
h3.wp-block-heading.site-footer__heading {
	margin-block: 0;
}

/* ---- core/paragraph: zero margins only where olek.css does not set them ---- */
p.hero__tagline,
p.hero__stat,
p.timeline__desc,
p.work__link-wrap,
p.testimonial__stars,
p.testimonial__avatar,
p.testimonial__name,
p.testimonial__role,
p.cta__contact-text,
p.faq__answer,
p.site-footer__tagline,
p.site-footer__copy {
	margin-block: 0;
}

.promise__steps > p { margin-block: 0; }

/* ---- core/list inside footer nav ---- */
.site-footer__nav .wp-block-list {
	margin: 0;
	padding-left: 0;
}
.site-footer__nav .wp-block-list li {
	list-style: none;
}

/* ---- core/details — give summary the FAQ question styling ---- */
.faq__item > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1.25rem 0;
	cursor: pointer;
	font-family: var(--ff-sans);
	font-size: var(--fs-16);
	font-weight: var(--fw-medium);
	color: var(--color-text);
	list-style: none;
	gap: 1rem;
	transition: color 0.2s var(--ease-out);
}
.faq__item > summary::-webkit-details-marker { display: none; }
.faq__item > summary::marker { content: ''; }
.faq__item > summary::after {
	content: '+';
	font-size: var(--fs-20);
	font-weight: var(--fw-light);
	color: var(--color-text-light);
	flex-shrink: 0;
	transition: transform 0.2s var(--ease-out);
}
.faq__item[open] > summary::after { transform: rotate(45deg); }
.faq__item > summary:hover { color: var(--color-gold); }

/* ---- core/image overrides for hero/cta/service-card ---- */
.wp-block-image.is-style-olek-cover,
.wp-block-image.is-style-olek-cover > img {
	display: block;
	margin: 0;
	width: 100%;
	height: 100%;
}
.hero__media .wp-block-image,
.hero__media .wp-block-image > img,
.cta__image .wp-block-image,
.cta__image .wp-block-image > img {
	margin: 0;
	width: 100%;
	height: 100%;
}
.hero__media .wp-block-image > img {
	object-fit: cover;
	object-position: 70% center;
}
.cta__image .wp-block-image > img {
	object-fit: cover;
}

/* Hero press logos as core/image — the figure carries the height
   (.hero__press-logo: 36px desktop / 28px mobile, veranda 26/20), the
   image just fills it so it never overflows its container. */
.hero__press-logos .wp-block-image {
	margin: 0;
}
.hero__press-logos .wp-block-image > img {
	display: block;
	height: 100%;
	width: auto;
}

/* CTA contact item — icon + text inline (icon aligns to first text line) */
.cta__contact-item .wp-block-image.cta__contact-icon {
	margin: 2px 0 0;
	flex-shrink: 0;
	color: var(--color-gold);
}
.cta__contact-item .wp-block-image.cta__contact-icon > img {
	width: 18px;
	height: 18px;
	display: block;
}
.cta__contact-item {
	display: flex;
	align-items: flex-start;
	gap: var(--sp-8);
}

/* ---- core/buttons + core/button → .btn styles ---- */
.wp-block-button.is-style-olek-primary > .wp-block-button__link,
.wp-block-button.is-style-olek-outline > .wp-block-button__link,
.wp-block-button.is-style-olek-outline-dark > .wp-block-button__link,
.wp-block-button.is-style-olek-outline-light > .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--sp-8);
	font-family: var(--ff-sans);
	font-size: var(--fs-13);
	font-weight: var(--fw-semibold);
	letter-spacing: var(--ls-wider);
	text-transform: uppercase;
	line-height: 1;
	padding: 15px 28px;
	border: 1.5px solid transparent;
	border-radius: 0;
	cursor: pointer;
	transition:
		background var(--duration) var(--ease-out),
		color var(--duration) var(--ease-out),
		border-color var(--duration) var(--ease-out);
}

/* Primary */
.wp-block-button.is-style-olek-primary > .wp-block-button__link {
	background: var(--color-bg-dark);
	color: var(--color-text-inverse);
	border-color: var(--color-bg-dark);
}
.wp-block-button.is-style-olek-primary > .wp-block-button__link:hover {
	background: var(--color-text);
	border-color: var(--color-text);
}

/* Outline (light bg, dark border) */
.wp-block-button.is-style-olek-outline > .wp-block-button__link {
	background: transparent;
	color: var(--color-text);
	border-color: var(--color-text);
}
.wp-block-button.is-style-olek-outline > .wp-block-button__link:hover {
	background: var(--color-text);
	color: var(--color-bg);
	border-color: var(--color-text);
}

/* Outline dark (transparent over dark bg) */
.wp-block-button.is-style-olek-outline-dark > .wp-block-button__link {
	background: transparent;
	color: var(--color-text);
	border-color: var(--color-text);
	padding: 12px 22px;
	font-size: var(--fs-12);
}
.wp-block-button.is-style-olek-outline-dark > .wp-block-button__link:hover {
	background: var(--color-text);
	color: var(--color-bg);
	border-color: var(--color-text);
}

/* Outline light (over dark band) */
.wp-block-button.is-style-olek-outline-light > .wp-block-button__link {
	background: transparent;
	color: var(--color-text-inverse);
	border-color: rgba(245, 240, 232, 0.4);
	padding: 12px 22px;
	font-size: var(--fs-12);
}
.wp-block-button.is-style-olek-outline-light > .wp-block-button__link:hover {
	background: var(--color-text-inverse);
	color: var(--color-bg-dark);
	border-color: var(--color-text-inverse);
}

/* Arrow suffix */
.wp-block-button.is-style-olek-arrow > .wp-block-button__link::after {
	content: '\2192';
	font-size: var(--fs-14);
	margin-left: var(--sp-4);
}
.wp-block-button.is-style-olek-arrow-sm > .wp-block-button__link::after {
	content: '\2192';
	font-size: var(--fs-12);
	margin-left: var(--sp-4);
}

/* Disabled state */
.wp-block-button.is-style-olek-disabled > .wp-block-button__link {
	opacity: 0.4;
	pointer-events: none;
	cursor: default;
}

/* Hero CTAs container gap */
.wp-block-buttons.hero__ctas {
	gap: var(--sp-12);
	margin-block: 0;
}
.wp-block-buttons.hero__ctas .wp-block-button { margin: 0; }

/* Buttons block defaults — make them inline-friendly */
.service-card .wp-block-buttons,
.promise__left .wp-block-buttons { margin: 0; }
.service-card .wp-block-buttons .wp-block-button,
.promise__left .wp-block-buttons .wp-block-button { margin: 0; }

/* ---- Hero stats: separators between paragraphs ---- */
.hero__proof.wp-block-group {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0;
}
.hero__proof .hero__stat:not(:last-child)::after {
	content: '';
	display: inline-block;
	width: 1px;
	height: 14px;
	background: var(--color-border);
	margin-left: var(--sp-20);
	vertical-align: middle;
}
.hero__proof .hero__stat { display: inline-flex; align-items: center; gap: 0.5em; }
/* space after the separator before the next stat */
.hero__proof .hero__stat:not(:last-child) { margin-right: var(--sp-20); }

/* Timeline (olek/timeline) — rendered as semantic <ol>/<li>, the
   original .timeline__track / .timeline__era styles apply directly.
   The render callback sets grid-template-columns: repeat(N, 1fr) as
   an inline style so the grid adapts to the item count. */

/* Work items: image position is controlled per-block via the
   `imagePosition` attribute on olek/work-item, which adds the
   .work__item--reverse modifier when set to "right". The original
   olek.css rules for .work__item--reverse handle the order swap. */

/* ---- Promise steps rendered as core/paragraph siblings ---- */
.promise__steps.wp-block-group {
	list-style: none;
	margin: 0 0 var(--sp-32);
	padding: 0;
	counter-reset: promise-step;
	display: flex;
	flex-direction: column;
	gap: var(--sp-12);
}
.promise__steps > p {
	display: flex;
	align-items: baseline;
	gap: var(--sp-12);
	font-size: var(--fs-14);
	color: var(--color-text-inverse);
}
.promise__steps > p > span {
	font-family: var(--ff-serif);
	font-size: var(--fs-18);
	color: var(--color-gold-light);
	font-weight: var(--fw-medium);
}

/* ---- core/quote → testimonial__text ---- */
.testimonial__text.wp-block-quote {
	margin: 0;
	border: none;
	padding: 0;
	font-style: normal;
}
.testimonial__text.wp-block-quote > p {
	margin: 0;
	font-style: italic;
}

/* ---- core/quote → promise__quote with multi-line cite ---- */
.promise__quote.wp-block-quote {
	border-left: 2px solid var(--color-gold);
	padding-left: var(--sp-32);
	margin: 0;
}
.promise__quote.wp-block-quote > p {
	font-family: var(--ff-serif);
	font-size: clamp(var(--fs-20), 2vw, var(--fs-28));
	font-weight: var(--fw-light);
	font-style: italic;
	line-height: 1.5;
	color: var(--color-text-inverse);
	margin-bottom: var(--sp-24);
}
.promise__quote.wp-block-quote > cite {
	display: flex;
	flex-direction: column;
	gap: 2px;
	font-style: normal;
}
.promise__quote-cite {
	font-family: var(--ff-sans);
	font-size: var(--fs-14);
	font-weight: var(--fw-semibold);
	color: var(--color-text-inverse);
}
.promise__quote-role {
	font-size: var(--fs-12);
	color: var(--color-text-light);
}
/* Mobile: shrink quote to match the design (olek.css media rules are
   outranked by the .wp-block-quote specificity above). */
@media (max-width: 768px) {
	.promise__quote.wp-block-quote { padding-left: var(--sp-24); }
	.promise__quote.wp-block-quote > p { font-size: var(--fs-20); }
}
@media (max-width: 480px) {
	.promise__quote.wp-block-quote > p { font-size: var(--fs-18); }
}

/* ---- Testimonial author footer reconstructed via core blocks ---- */
.testimonials__card.wp-block-group {
	display: flex;
	flex-direction: column;
	gap: var(--sp-16);
}
.testimonial__author.wp-block-group {
	display: flex;
	align-items: center;
	gap: var(--sp-12);
}
.testimonial__author-meta.wp-block-group {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

/* ---- core/social-links inside footer ---- */
.site-footer__socials.wp-block-social-links {
	margin: var(--sp-16) 0 0;
	padding: 0;
	gap: var(--sp-12);
}
.site-footer__socials .wp-block-social-link {
	background: transparent !important;
	color: var(--color-text-body);
	width: 18px;
	height: 18px;
	margin: 0;
	padding: 0;
}
.site-footer__socials .wp-block-social-link a {
	padding: 0;
	color: inherit;
}
.site-footer__socials .wp-block-social-link svg {
	width: 18px;
	height: 18px;
	display: block;
}
.site-footer__socials .wp-block-social-link:hover,
.site-footer__socials .wp-block-social-link:focus {
	color: var(--color-gold);
	transform: none;
}

/* ---- Footer address rendered as core/group ---- */
.site-footer__address.wp-block-group {
	font-style: normal;
	display: flex;
	flex-direction: column;
	gap: var(--sp-8);
}
.site-footer__address > p {
	margin: 0;
	font-size: var(--fs-13);
	color: var(--color-text-body);
	line-height: var(--lh-normal);
}
.site-footer__address a {
	color: var(--color-text-body);
	transition: color var(--duration) var(--ease-out);
}
.site-footer__address a:hover { color: var(--color-gold); }

/* ---- Footer bottom (privacy/terms) — let olek.css drive layout, the grid above already has the divider ---- */
.site-footer__bottom.wp-block-group {
	display: flex;
	justify-content: flex-end;
	gap: var(--sp-24);
}
.site-footer__bottom > p {
	margin: 0;
	font-size: var(--fs-12);
	color: var(--color-text-light);
}

/* Olek main wrapper passes through */
.wp-block-group.olek-main { display: block; }

/* =============================================
   Lazy image fade-in — make CSS-only so it
   works inside the Site Editor preview iframe
   where the frontend olek.js doesn't run.
   ============================================= */
img[loading="lazy"] {
	opacity: 1;
	animation: olek-fade-in 0.5s var(--ease-out, ease-out);
}
img[loading="lazy"].loaded {
	animation: none;
}
@keyframes olek-fade-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}

/* =============================================
   core/site-title + core/site-tagline as logo
   ============================================= */
.site-header__logo.wp-block-group,
.site-footer__logo.wp-block-group {
	display: flex;
	flex-direction: column;
	gap: 1px;
	line-height: 1;
}

.site-header__logo .wp-block-site-title,
.site-footer__logo .wp-block-site-title {
	font-family: var(--ff-serif);
	font-size: var(--fs-28);
	font-weight: var(--fw-semibold);
	letter-spacing: 0.35em;
	color: var(--color-text);
	text-transform: uppercase;
	margin: 0;
	line-height: 1;
}
.site-header__logo .wp-block-site-title a,
.site-footer__logo .wp-block-site-title a {
	color: inherit;
	text-decoration: none;
}

.site-header__logo .wp-block-site-tagline,
.site-footer__logo .wp-block-site-tagline {
	font-family: var(--ff-sans);
	font-size: var(--fs-11);
	font-weight: var(--fw-medium);
	letter-spacing: var(--ls-widest);
	color: var(--color-text-light);
	text-transform: uppercase;
	margin: 0;
	line-height: 1;
}

/* =============================================
   core/navigation mapped to site-nav BEM styles
   ============================================= */
.wp-block-navigation.site-nav {
	flex: 1;
	display: flex;
	justify-content: center;
}

.wp-block-navigation.site-nav .wp-block-navigation__container {
	display: flex;
	align-items: center;
	gap: var(--sp-32);
	margin: 0;
	padding: 0;
}

.wp-block-navigation.site-nav .wp-block-navigation-item {
	position: relative;
}

.wp-block-navigation.site-nav .wp-block-navigation-item__content {
	font-size: var(--fs-13);
	font-weight: var(--fw-medium);
	letter-spacing: var(--ls-wide);
	text-transform: uppercase;
	color: var(--color-text);
	padding-block: var(--sp-4);
	position: relative;
	transition: color var(--duration) var(--ease-out);
}

.wp-block-navigation.site-nav .wp-block-navigation-item__content::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 0;
	height: 1.5px;
	background: var(--color-gold);
	transition: width 0.3s var(--ease-out);
}

.wp-block-navigation.site-nav .wp-block-navigation-item__content:hover {
	color: var(--color-gold);
}
.wp-block-navigation.site-nav .wp-block-navigation-item__content:hover::after {
	width: 100%;
}

/* Submenu (dropdown) */
.wp-block-navigation.site-nav .wp-block-navigation__submenu-container {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	min-width: 220px;
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	box-shadow: 0 8px 32px rgba(42, 39, 33, 0.08);
	padding: var(--sp-12) 0;
	margin-top: var(--sp-8);
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.25s var(--ease-out), visibility 0.25s;
	z-index: 110;
	border-radius: 0;
}

.wp-block-navigation.site-nav .wp-block-navigation__submenu-container::before {
	content: '';
	position: absolute;
	top: -8px;
	left: 0;
	right: 0;
	height: 8px;
}

.wp-block-navigation.site-nav .has-child:hover > .wp-block-navigation__submenu-container,
.wp-block-navigation.site-nav .has-child:focus-within > .wp-block-navigation__submenu-container {
	opacity: 1;
	visibility: visible;
}

.wp-block-navigation.site-nav .wp-block-navigation__submenu-container .wp-block-navigation-item {
	display: block;
}

.wp-block-navigation.site-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: var(--sp-8) var(--sp-20);
	font-size: var(--fs-13);
	font-weight: var(--fw-regular);
	letter-spacing: 0;
	text-transform: none;
	color: var(--color-text-body);
	display: block;
	transition: color var(--duration) var(--ease-out), background var(--duration) var(--ease-out);
}

.wp-block-navigation.site-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content::after {
	display: none;
}

.wp-block-navigation.site-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	color: var(--color-text);
	background: var(--color-bg-cream);
}

/* Dropdown caret on parent items */
.wp-block-navigation.site-nav .has-child > .wp-block-navigation-item__content::before {
	display: none;
}
.wp-block-navigation.site-nav .has-child > .wp-block-navigation-item__content .wp-block-navigation__submenu-icon {
	display: inline-flex;
	margin-left: var(--sp-4);
}

/* =============================================
   Header actions decomposed (phone link + CTA button)
   ============================================= */
.site-header__actions.wp-block-group {
	display: flex;
	align-items: center;
	gap: var(--sp-20);
	flex-shrink: 0;
}

.site-header__phone-wrap {
	margin: 0;
}

.site-header__actions .site-header__phone {
	display: inline-flex;
	align-items: center;
	gap: var(--sp-8);
	font-size: var(--fs-13);
	font-weight: var(--fw-medium);
	letter-spacing: var(--ls-wide);
	color: var(--color-text);
	transition: color var(--duration) var(--ease-out);
}

/* Phone icon via CSS mask (inherits color from currentColor) */
.site-header__actions .site-header__phone::before {
	content: '';
	display: inline-block;
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: url('../images/icons/phone-mask.svg') no-repeat center / contain;
	mask: url('../images/icons/phone-mask.svg') no-repeat center / contain;
	flex-shrink: 0;
}

.site-header__actions .site-header__phone:hover {
	color: var(--color-gold);
}

.site-header__cta-wrap.wp-block-buttons {
	margin: 0;
}
.site-header__cta-wrap .wp-block-button { margin: 0; }

/* =============================================
   Testimonials — carousel mode when items > 3
   (Generated by olek/testimonials render callback)
   ============================================= */
.testimonials__grid--carousel {
	display: flex !important;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	gap: var(--sp-24);
	padding-bottom: var(--sp-4);
	scrollbar-width: none;
}
.testimonials__grid--carousel::-webkit-scrollbar { display: none; }

.testimonials__grid--carousel .testimonials__card {
	min-width: calc((100% - var(--sp-24) * 2) / 3);
	max-width: calc((100% - var(--sp-24) * 2) / 3);
	scroll-snap-align: start;
	flex-shrink: 0;
}

/* On smaller screens (≤900px the original media query already
   forces carousel mode for plain .testimonials__grid). Match the
   carousel sizing for the explicit carousel variant too. */
@media (max-width: 900px) {
	.testimonials__grid--carousel .testimonials__card {
		min-width: 85vw;
		max-width: 85vw;
		scroll-snap-align: center;
	}
}

/* Generated dots wrapper */
.testimonials__dots[data-testimonials-dots] {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--sp-8);
	padding-top: var(--sp-24);
	margin: 0;
}

/* In desktop carousel mode (3 visible at a time), the last 2 dots
   are not unique scroll start positions, so hide them. Number of
   real scroll positions = items - 2. */
.testimonials__grid--carousel ~ .testimonials__dots[data-testimonials-dots] .testimonials__dot:nth-last-child(-n+2) {
	display: none;
}

/* On mobile, the original CSS already turns the grid into a carousel
   (one card visible at a time), so show every dot regardless of mode
   and override the desktop-only nth-last-child(-n+2) hide rule. */
@media (max-width: 900px) {
	.testimonials__grid ~ .testimonials__dots[data-testimonials-dots] {
		display: flex;
	}
	.testimonials__grid ~ .testimonials__dots[data-testimonials-dots] .testimonials__dot,
	.testimonials__grid--carousel ~ .testimonials__dots[data-testimonials-dots] .testimonials__dot:nth-last-child(-n+2) {
		display: block;
	}
}

.testimonials__dot[role="button"] {
	width: 28px;
	height: 3px;
	border-radius: 2px;
	background: var(--color-border);
	padding: 0;
	cursor: pointer;
	transition: background 0.3s var(--ease-out), width 0.3s var(--ease-out);
}

.testimonials__dot[role="button"].testimonials__dot--active {
	background: var(--color-gold);
	width: 40px;
}

.testimonials__dot[role="button"]:focus-visible {
	outline: 2px solid var(--color-gold);
	outline-offset: 2px;
}

/* core/paragraph → testimonials__badge */
p.testimonials__badge {
	margin: 0;
	padding-top: var(--sp-32);
	text-align: center;
	font-size: var(--fs-13);
	color: var(--color-text-body);
	letter-spacing: var(--ls-wide);
}
p.testimonials__badge .testimonials__badge-stars {
	color: var(--color-gold);
	letter-spacing: 3px;
	margin-right: var(--sp-4);
}
p.testimonials__badge strong {
	color: var(--color-text);
	font-weight: var(--fw-semibold);
}


/* =============================================
   About Us page
   ============================================= */

/* ---- about hero ---- */
.wp-block-group.about-hero {
	background: var(--color-bg);
	padding-block: clamp(var(--sp-80), 10vw, var(--sp-120)) var(--sp-64);
}
.wp-block-group.about-hero__inner {
	display: grid;
	grid-template-columns: 1.05fr 1fr;
	gap: clamp(var(--sp-40), 5vw, var(--sp-80));
	align-items: center;
}
.wp-block-group.about-hero__text { max-width: 560px; }
p.about-hero__label {
	margin: 0 0 var(--sp-20);
	font-size: var(--fs-12);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-gold);
	font-weight: var(--fw-medium);
}
h1.wp-block-heading.about-hero__heading {
	margin: 0 0 var(--sp-24);
	font-family: var(--ff-serif);
	font-weight: var(--fw-light);
	font-size: clamp(2.25rem, 4.5vw, 3.75rem);
	line-height: var(--lh-tight);
	color: var(--color-text);
}
p.about-hero__body {
	margin: 0;
	font-size: var(--fs-17);
	line-height: var(--lh-normal);
	color: var(--color-text-body);
}
.wp-block-group.about-hero__media .wp-block-image img {
	width: 100%;
	height: 100%;
	min-height: 480px;
	object-fit: cover;
	border-radius: 2px;
}

/* ---- about stats ---- */
.wp-block-group.about-stats {
	padding-block: var(--sp-56);
	background: var(--color-bg-cream);
}
.wp-block-group.about-stats__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--sp-32);
}
.wp-block-group.about-stat {
	display: flex;
	flex-direction: column;
	gap: var(--sp-8);
	text-align: center;
	border-left: 1px solid var(--color-border);
	padding: var(--sp-20) var(--sp-16);
}
.wp-block-group.about-stat:first-child { border-left: 0; }
p.about-stat__value {
	margin: 0;
	font-family: var(--ff-serif);
	font-size: clamp(2.5rem, 4vw, 3.5rem);
	font-weight: var(--fw-light);
	line-height: 1;
	color: var(--color-gold);
}
p.about-stat__value span {
	font-size: 0.45em;
	color: var(--color-text-light);
	margin-left: 2px;
}
p.about-stat__label {
	margin: 0;
	font-size: var(--fs-12);
	letter-spacing: var(--ls-wide);
	text-transform: uppercase;
	color: var(--color-text-body);
}

/* ---- about story ---- */
.wp-block-group.about-story {
	padding-block: clamp(var(--sp-80), 8vw, var(--sp-120));
}
.wp-block-group.about-story__inner {
	display: grid;
	grid-template-columns: 1fr 1.1fr;
	gap: clamp(var(--sp-40), 5vw, var(--sp-80));
	align-items: center;
}
.wp-block-group.about-story__media .wp-block-image img {
	width: 100%;
	min-height: 520px;
	object-fit: cover;
	border-radius: 2px;
}
.wp-block-group.about-story__text { max-width: 560px; }
p.about-story__label {
	margin: 0 0 var(--sp-16);
	font-size: var(--fs-12);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-gold);
	font-weight: var(--fw-medium);
}
h2.wp-block-heading.about-story__heading {
	margin: 0 0 var(--sp-24);
	font-family: var(--ff-serif);
	font-weight: var(--fw-light);
	font-size: clamp(1.75rem, 3.2vw, 2.75rem);
	line-height: var(--lh-snug);
	color: var(--color-text);
}
p.about-story__body {
	margin: 0 0 var(--sp-20);
	color: var(--color-text-body);
	line-height: var(--lh-normal);
}
.wp-block-group.about-story__text .wp-block-buttons { margin-top: var(--sp-16); }

/* ---- about values ---- */
.wp-block-group.about-values {
	padding-block: clamp(var(--sp-80), 8vw, var(--sp-120));
	background: var(--color-bg-cream);
}
.wp-block-group.about-values h2.section-heading {
	margin: 0 0 var(--sp-56);
	text-align: center;
	font-family: var(--ff-serif);
	font-weight: var(--fw-light);
	font-size: clamp(2rem, 3.5vw, 3rem);
	color: var(--color-text);
}
.wp-block-group.about-values__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--sp-32);
}
.wp-block-group.about-value {
	padding: var(--sp-40) var(--sp-32);
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: 2px;
	display: flex;
	flex-direction: column;
	gap: var(--sp-16);
	transition: transform var(--duration) var(--ease-out), box-shadow var(--duration) var(--ease-out);
}
.wp-block-group.about-value:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 32px rgba(43, 40, 32, 0.06);
}
p.about-value__num {
	margin: 0;
	font-family: var(--ff-serif);
	font-size: var(--fs-32);
	font-weight: var(--fw-light);
	color: var(--color-gold);
	line-height: 1;
}
h3.wp-block-heading.about-value__heading {
	margin: 0;
	font-family: var(--ff-serif);
	font-weight: var(--fw-regular);
	font-size: var(--fs-24);
	color: var(--color-text);
}
p.about-value__body {
	margin: 0;
	font-size: var(--fs-15);
	line-height: var(--lh-normal);
	color: var(--color-text-body);
}

/* ---- about timeline (reuse home timeline) ---- */
.wp-block-group.about-timeline {
	padding-block: clamp(var(--sp-80), 8vw, var(--sp-120));
}

/* ---- about team ---- */
.wp-block-group.about-team {
	padding-block: clamp(var(--sp-80), 8vw, var(--sp-120));
	background: var(--color-bg);
}
.wp-block-group.about-team h2.section-heading {
	margin: 0 auto var(--sp-16);
	text-align: center;
	font-family: var(--ff-serif);
	font-weight: var(--fw-light);
	font-size: clamp(2rem, 3.5vw, 3rem);
	color: var(--color-text);
}
p.about-team__lede {
	margin: 0 auto var(--sp-56);
	text-align: center;
	max-width: 540px;
	font-size: var(--fs-17);
	color: var(--color-text-body);
	line-height: var(--lh-normal);
}
.wp-block-group.about-team__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--sp-32);
}
.wp-block-group.about-member {
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: var(--sp-16);
}
.wp-block-group.about-member__photo {
	width: 100%;
	aspect-ratio: 1 / 1;
	background: var(--color-bg-cream);
	border: 1px solid var(--color-border);
	display: grid;
	place-items: center;
	border-radius: 2px;
}
p.about-member__initials {
	margin: 0;
	font-family: var(--ff-serif);
	font-size: clamp(2rem, 3vw, 2.5rem);
	font-weight: var(--fw-light);
	color: var(--color-gold);
	letter-spacing: 0.05em;
}
h3.wp-block-heading.about-member__name {
	margin: 0;
	font-family: var(--ff-serif);
	font-weight: var(--fw-regular);
	font-size: var(--fs-20);
	color: var(--color-text);
}
p.about-member__role {
	margin: 0;
	font-size: var(--fs-13);
	letter-spacing: var(--ls-wide);
	text-transform: uppercase;
	color: var(--color-text-body);
}

/* ---- about press ---- */
.wp-block-group.about-press {
	padding-block: var(--sp-64);
	background: var(--color-bg-cream);
}
p.about-press__label {
	margin: 0 0 var(--sp-24);
	text-align: center;
	font-size: var(--fs-12);
	letter-spacing: var(--ls-widest);
	text-transform: uppercase;
	color: var(--color-text-body);
}
.wp-block-group.about-press__logos {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: clamp(var(--sp-40), 6vw, var(--sp-80));
	flex-wrap: wrap;
}
.wp-block-image.about-press__logo img {
	height: 28px;
	width: auto;
	opacity: 0.6;
	filter: grayscale(1);
	transition: opacity var(--duration) var(--ease-out);
}
.wp-block-image.about-press__logo:hover img { opacity: 1; }
.wp-block-image.about-press__logo--veranda img { height: 22px; }

/* ---- about quote ---- */
.wp-block-group.about-quote {
	padding-block: clamp(var(--sp-80), 8vw, var(--sp-120));
	background: var(--color-bg-dark);
	color: var(--color-text-inverse);
}
.wp-block-quote.about-quote__block {
	margin: 0 auto;
	max-width: 880px;
	text-align: center;
	border: 0;
	padding: 0;
}
.wp-block-quote.about-quote__block p {
	margin: 0 0 var(--sp-32);
	font-family: var(--ff-serif);
	font-weight: var(--fw-light);
	font-size: clamp(1.5rem, 2.6vw, 2rem);
	line-height: 1.4;
	color: var(--color-text-inverse);
	font-style: normal;
}
.wp-block-quote.about-quote__block cite {
	display: flex;
	flex-direction: column;
	gap: var(--sp-4);
	font-style: normal;
}
.wp-block-quote.about-quote__block .about-quote__cite {
	font-family: var(--ff-serif);
	font-size: var(--fs-18);
	color: var(--color-text-inverse);
}
.wp-block-quote.about-quote__block .about-quote__role {
	font-size: var(--fs-12);
	letter-spacing: var(--ls-wide);
	text-transform: uppercase;
	color: var(--color-text-light);
}

/* ---- responsive ---- */
@media (max-width: 960px) {
	.wp-block-group.about-hero__inner,
	.wp-block-group.about-story__inner {
		grid-template-columns: 1fr;
	}
	.wp-block-group.about-stats__grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.wp-block-group.about-stat { border-left: 0; border-top: 1px solid var(--color-border); padding-top: var(--sp-24); }
	.wp-block-group.about-stat:nth-child(-n+2) { border-top: 0; padding-top: 0; }
	.wp-block-group.about-values__grid {
		grid-template-columns: 1fr;
	}
	.wp-block-group.about-team__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.wp-block-group.about-stats__grid {
		grid-template-columns: 1fr;
	}
	.wp-block-group.about-stat { border-top: 1px solid var(--color-border); padding-top: var(--sp-24); }
	.wp-block-group.about-stat:first-child { border-top: 0; padding-top: 0; }
	.wp-block-group.about-team__grid {
		grid-template-columns: 1fr;
	}
}

/* =============================================
   Mobile header (≤768px) — Gutenberg markup
   The original olek.css mobile rules target legacy class names
   (.btn, .site-nav) that core blocks do not output, so the header
   overrides are re-declared here against the real block markup.
   ============================================= */
@media (max-width: 768px) {
	/* Center padded sections on mobile — drop the desktop 48px left indent
	   so timeline / work / testimonials / faq sit symmetrically. */
	.container.container--padded { padding-left: var(--container-pad); }

	/* Push phone + hamburger to the right once the inline nav is gone */
	.site-header__actions.wp-block-group { margin-left: auto; }

	/* Hide the consultation CTA on mobile (core/button, not .btn) */
	.site-header__cta-wrap.wp-block-buttons { display: none; }

	/* Phone collapses to icon only */
	.site-header__actions .site-header__phone { font-size: 0; gap: 0; }
	.site-header__actions .site-header__phone::before { width: 20px; height: 20px; }

	/* Hamburger button — keep its intrinsic size */
	.hamburger { display: flex; flex-shrink: 0; width: 36px; height: 36px; }

	/* Navigation becomes a fullscreen overlay toggled by the hamburger.
	   Override the desktop .wp-block-navigation.site-nav flex rule. */
	.wp-block-navigation.site-nav {
		display: none;
		position: fixed;
		inset: 0;
		z-index: 200;
		flex: none;
		background: rgba(253, 252, 250, 0.98);
		flex-direction: column;
		align-items: center;
		justify-content: center;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}
	.wp-block-navigation.site-nav.site-nav--open { display: flex; }

	.wp-block-navigation.site-nav .wp-block-navigation__container {
		flex-direction: column;
		gap: var(--sp-20);
		text-align: center;
		padding: var(--sp-40) var(--sp-20);
		width: 100%;
		align-items: center;
		opacity: 1;
	}

	.wp-block-navigation.site-nav .wp-block-navigation-item__content {
		font-size: var(--fs-18);
		letter-spacing: var(--ls-wider);
	}

	/* Top-level items with children stack content + submenu vertically */
	.wp-block-navigation.site-nav .wp-block-navigation-item.has-child {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
	}

	/* Submenus render inline (no hover dropdown) inside the overlay */
	.wp-block-navigation.site-nav .wp-block-navigation__submenu-container {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		width: auto;
		min-width: 0;
		height: auto;
		overflow: visible;
		border: none;
		box-shadow: none;
		padding: var(--sp-8) 0 0;
		margin: 0;
		background: transparent;
		text-align: center;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: var(--sp-8);
	}
	.wp-block-navigation.site-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
		font-size: var(--fs-14);
		padding: 6px 0;
		color: var(--color-text-light);
	}
	.wp-block-navigation.site-nav .wp-block-navigation__submenu-icon { display: none; }
}