/* ============================================================
   Block adaptations.
   main.css holds the original design. This file maps WordPress
   block markup (navigation, buttons, site title, lists, images)
   onto those same rules so the rendered page matches the design.
   ============================================================ */

/* ---------- layout plumbing ---------- */
main section[id] { scroll-margin-top: 5rem; }
.wp-block-group.wrap { width: 100%; }
.site-main > .entry-content > * { margin-block: 0; }
.alignfull { max-width: none; width: 100%; }

/* Containers that position their own children: cancel the editor's
   automatic block gap so the design's grid gaps are what show. */
.nav-row > *, .brand > *, .brand-text > *, .hero-cta > *, .showcase-grid > *,
.showcase-copy > * + *, .video-grid > *, .video-card > *, .services-grid > *,
.about-top > *, .contact-grid > *, .info-cards > *, .gallery > *,
.trust-row > *, .trust-names > *, .gifting-tags > *, .footer-grid > *,
.footer-bottom > *, .hero-inner > *, .about-copy > *, .section-head > *,
.gifting-copy > *, .video-meta > *, .service-card > *, .footer-about > * {
	margin-block-start: 0;
}
.showcase-copy > * + * { margin-block-start: 0; }

/* ---------- buttons ----------
   The .btn classes sit on the wrapper WordPress prints, so strip the design's
   button styling off the wrapper and put it on the link inside. */
.wp-block-button.btn {
	margin: 0; padding: 0; border: 0; border-radius: 0; background: none;
	box-shadow: none; display: inline-flex; backdrop-filter: none;
}
.wp-block-button.btn > .wp-block-button__link {
	display: inline-flex; align-items: center; justify-content: center; gap: .6em;
	padding: .95rem 1.7rem; border-radius: 999px; font-weight: 600; font-size: .92rem;
	line-height: 1.6; text-decoration: none; border: 0; white-space: nowrap;
	transition: transform .35s var(--ease), box-shadow .35s var(--ease), background-color .3s, color .3s, border-color .3s;
}
.wp-block-button.btn > .wp-block-button__link:active { transform: scale(.97); }
.wp-block-button.btn-solid > .wp-block-button__link { background: var(--gold); color: var(--ink); }
.wp-block-button.btn-solid > .wp-block-button__link:hover { background: var(--gold-lt); color: var(--ink); box-shadow: 0 14px 28px -12px rgba(185,137,18,.6); }
.wp-block-button.btn-outline > .wp-block-button__link { background: transparent; border: 1.5px solid var(--line-soft); color: var(--paper); backdrop-filter: blur(6px); }
.wp-block-button.btn-outline > .wp-block-button__link:hover { background: rgba(244,239,226,.12); border-color: var(--paper); color: var(--paper); }
.wp-block-button.btn-dark-outline > .wp-block-button__link { background: transparent; border: 1.5px solid var(--line); color: var(--ink); }
.wp-block-button.btn-dark-outline > .wp-block-button__link:hover { background: var(--teal-deep); border-color: var(--teal-deep); color: var(--paper); }
.nav-cta .wp-block-button.btn > .wp-block-button__link { padding: .7rem 1.3rem; font-size: .82rem; }
.site-header:not(.scrolled) .nav-cta .wp-block-button.btn-dark-outline > .wp-block-button__link { border-color: var(--line-soft); color: var(--paper); }
.site-header:not(.scrolled) .nav-cta .wp-block-button.btn-dark-outline > .wp-block-button__link:hover { background: var(--paper); border-color: var(--paper); color: var(--ink); }

/* WordPress zeroes the top margin of a group's first child; the design relies
   on those margins, so put them back where it does. */
.hero-inner > .eyebrow { margin-top: 1.4rem; }
.showcase-copy > .eyebrow { margin-top: 1.2rem; }
.section-head > .eyebrow { margin-top: 1rem; }
.about-copy > .eyebrow { margin-top: 1rem; }

/* ---------- header: brand ---------- */
.site-header .nav-row { gap: 1rem; }
.brand { gap: .7rem; }
.brand .wp-block-site-logo { line-height: 0; margin: 0; }
.brand .wp-block-site-logo img { height: 30px; width: auto; filter: drop-shadow(0 1px 2px rgba(0,0,0,.25)); }
.brand-text { display: block; }
.brand .wp-block-site-title {
	margin: 0; font-family: var(--ff-display); font-weight: 600; font-size: 1.05rem;
	letter-spacing: .01em; line-height: 1.6;
}
.brand .wp-block-site-title a { color: var(--paper); transition: color .4s var(--ease); text-decoration: none; }
.brand .wp-block-site-tagline {
	margin: 0; font-family: var(--ff-body); font-weight: 500; font-size: .58rem;
	letter-spacing: .2em; text-transform: uppercase; color: var(--muted-lt);
	transition: color .4s var(--ease); line-height: 1.6;
}
.site-header.scrolled .brand .wp-block-site-title a { color: var(--ink); }
.site-header.scrolled .brand .wp-block-site-tagline { color: var(--muted); }

/* ---------- header: navigation ---------- */
.site-header .nav-links { flex: 0 1 auto; }
.nav-links .wp-block-navigation__container {
	display: flex; align-items: center; gap: 2.1rem; flex-wrap: nowrap;
}
.site-header .nav-links .wp-block-navigation-item__content.wp-block-navigation-item__content {
	font-size: .88rem; font-weight: 500; color: var(--muted-lt);
	position: relative; padding: .2rem 0; transition: color .3s; text-decoration: none;
}
.site-header .nav-links .wp-block-navigation-item__content::after {
	content: ""; position: absolute; left: 0; bottom: -2px; height: 1px; width: 0;
	background: var(--gold); transition: width .3s var(--ease);
}
.site-header .nav-links .wp-block-navigation-item__content.wp-block-navigation-item__content:hover { color: var(--paper); }
.site-header .nav-links .wp-block-navigation-item__content:hover::after { width: 100%; }
.site-header.scrolled .site-header .nav-links .wp-block-navigation-item__content.wp-block-navigation-item__content { color: var(--ink-soft); }
.site-header.scrolled .nav-links .wp-block-navigation-item__content.wp-block-navigation-item__content:hover { color: var(--teal-deep); }

/* The original mobile menu was a hand-built overlay on .nav-links. The block
   navigation brings its own overlay, so undo those rules for the nav element. */
@media (max-width: 900px) {
	.site-header .nav-links {
		position: static; inset: auto; background: none; display: flex;
		flex-direction: row; align-items: center; justify-content: flex-end;
		gap: 0; opacity: 1; visibility: visible; transform: none;
	}
}

/* The menu button: WordPress switches at 600px, the design switches at 1000px. */
@media (max-width: 1000px) {
	.site-header .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none; }
	.site-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.site-header .nav-cta { display: none; }
}
@media (min-width: 1001px) {
	.site-header .wp-block-navigation__responsive-container-open { display: none; }
	.site-header .wp-block-navigation__responsive-container.is-menu-open { display: none; }
}

/* Menu button drawn as the design's three lines. */
.site-header .wp-block-navigation__responsive-container-open,
.site-header .wp-block-navigation__responsive-container-close {
	width: 44px; height: 44px; border-radius: 50%; position: relative;
	align-items: center; justify-content: center; flex-shrink: 0; padding: 0; color: transparent;
}
.site-header .wp-block-navigation__responsive-container-open svg,
.site-header .wp-block-navigation__responsive-container-close svg { display: none; }
.site-header .wp-block-navigation__responsive-container-open::before,
.site-header .wp-block-navigation__responsive-container-open::after {
	content: ""; position: absolute; width: 20px; height: 1.6px; background: var(--paper);
	transition: .35s var(--ease);
}
.site-header .wp-block-navigation__responsive-container-open::before { transform: translateY(-6px); box-shadow: 0 6px 0 var(--paper); }
.site-header .wp-block-navigation__responsive-container-open::after { transform: translateY(6px); }
.site-header.scrolled .wp-block-navigation__responsive-container-open::before { background: var(--ink); box-shadow: 0 6px 0 var(--ink); }
.site-header.scrolled .wp-block-navigation__responsive-container-open::after { background: var(--ink); }
.site-header .wp-block-navigation__responsive-container-close::before,
.site-header .wp-block-navigation__responsive-container-close::after {
	content: ""; position: absolute; width: 20px; height: 1.6px; background: var(--paper);
}
.site-header .wp-block-navigation__responsive-container-close::before { transform: rotate(45deg); }
.site-header .wp-block-navigation__responsive-container-close::after { transform: rotate(-45deg); }

/* The open menu panel: full screen, links centred, close button where the
   menu button was. */
.site-header .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--teal-deep); padding: 0; display: flex; flex-direction: column; justify-content: center;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close {
	display: flex; flex-direction: column; justify-content: center; height: 100%; max-width: none;
}
.site-header .wp-block-navigation__responsive-dialog {
	display: flex; flex: 1 1 auto; align-items: center; justify-content: center; margin-top: 0;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	position: fixed; top: 1.1rem; right: clamp(1.25rem, 4vw, 3rem); left: auto; z-index: 3;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	justify-content: center; align-items: center; height: 100%; padding: 0;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	flex-direction: column; align-items: center; justify-content: center; gap: 2.1rem;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content.wp-block-navigation-item__content {
	color: var(--paper); font-size: 1.4rem; font-family: var(--ff-display);
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content.wp-block-navigation-item__content:hover { color: var(--gold-lt); }

/* ---------- hero ---------- */
.hero .hero-inner .wp-block-heading { font-size: clamp(2.5rem,6.2vw,4.6rem); max-width: 16ch; margin-top: 1rem; text-wrap: balance; }
.hero .hero-inner .wp-block-heading em { font-style: italic; color: var(--gold-lt); font-weight: 400; }
.hero-cta { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.3rem; }

/* ---------- lead video section ---------- */
.showcase-copy .wp-block-heading { color: var(--paper); margin-top: .7rem; font-size: clamp(2.1rem,4.4vw,3.4rem); text-wrap: balance; }
.showcase-copy p:not(.eyebrow) { color: var(--muted-lt); margin-top: 1.2rem; max-width: 44ch; }
.showcase-list { margin-top: 1.8rem; display: grid; gap: .9rem; padding-left: 0; list-style: none; }
.showcase-list li { display: flex; gap: .7rem; align-items: flex-start; font-size: .95rem; color: var(--muted-lt); }
.showcase-list li::before {
	content: ""; width: 18px; height: 18px; flex-shrink: 0; margin-top: .15rem;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e6c36a' stroke-width='2'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") no-repeat center / contain;
}
.showcase-copy .hero-cta { margin-top: 2rem; }

/* ---------- sections built from groups ---------- */
.trust-row .trust-label, .trust-names p { margin: 0; }
.trust-names p { font-family: var(--ff-display); font-style: italic; font-size: 1.05rem; color: var(--paper); opacity: .88; }
.trust-names { display: flex; flex-wrap: wrap; gap: clamp(1.4rem,4vw,3rem); justify-content: center; }

.about-figure .wp-block-image { margin: 0; height: 100%; }
.about-figure .wp-block-image img { width: 100%; height: 100%; object-fit: cover; }

.service-card .wp-block-heading { margin-top: .8rem; font-size: 1.08rem; font-weight: 600; font-family: var(--ff-body); }
.service-card p:not(.num) { margin-top: .55rem; font-size: .9rem; color: var(--muted); }
.service-card .num { margin: 0; }

.gifting-tags { padding-left: 0; }
.gifting-copy .wp-block-heading { margin-top: .5rem; font-size: clamp(1.2rem,2.4vw,1.5rem); max-width: 52ch; color: var(--ink-soft); font-weight: 500; }

.video-meta .wp-block-heading { font-size: 1.12rem; margin-top: .4rem; line-height: 1.25; }
.video-meta .v-tag, .video-meta .v-desc { margin-top: .55rem; }
.video-meta .v-tag { margin-top: 0; }

.section-head .wp-block-heading { font-size: clamp(1.9rem,4vw,2.9rem); margin-top: .6rem; }

/* ---------- footer ---------- */
.site-footer .footer-brand .wp-block-site-logo img { height: 28px; width: auto; }
.site-footer .footer-brand .footer-brand-name {
	margin: 0; font-family: var(--ff-display); font-weight: 600; color: var(--paper); font-size: 1.05rem;
	max-width: none;
}
.site-footer .footer-col .wp-block-heading {
	font-size: .72rem; letter-spacing: .18em; text-transform: uppercase;
	color: var(--gold-lt); font-weight: 600; margin-bottom: 1.1rem; font-family: var(--ff-body);
}
.site-footer .footer-col .footer-nav { margin-top: 0; }
.site-footer .footer-nav .wp-block-navigation__container { display: grid; gap: .7rem; }
.site-footer .footer-nav .wp-block-navigation-item { font-size: 1rem; line-height: 1.6; }
.site-footer .footer-nav .wp-block-navigation-item__content.wp-block-navigation-item__content { font-size: .9rem; line-height: calc(1rem * 1.6); color: var(--muted-lt); transition: color .25s; }
.site-footer .footer-nav .wp-block-navigation-item__content.wp-block-navigation-item__content:hover { color: var(--paper); }
.site-footer .footer-contact-list { display: grid; gap: .7rem; padding-left: 0; list-style: none; }
.site-footer .footer-contact-list a { color: var(--muted-lt); }
.site-footer .footer-contact-list a:hover { color: var(--paper); }
.site-footer .footer-bottom p { margin: 0; max-width: none; font-size: .8rem; }
.site-footer .footer-about p { font-size: .9rem; max-width: 36ch; color: var(--muted-lt); }

/* ---------- project update (work in progress) ---------- */
.project-update {
	padding-block: clamp(4.5rem, 9vw, 7rem);
	background: var(--paper);
	position: relative; isolation: isolate; overflow: hidden;
}
.project-update::before {
	content: ""; position: absolute; z-index: -1; pointer-events: none;
	background: url(../img/watercolour-bloom-b.webp) no-repeat center / contain;
	mix-blend-mode: multiply; aspect-ratio: 760/692;
	left: 0; bottom: 0; width: min(44vw, 600px); transform: scaleX(-1);
}
.project-update .section-head { max-width: 680px; }
.project-update .section-head p:not(.eyebrow) { margin-top: 1rem; }
@media (max-width: 900px) {
	.project-update::before { width: 78vw; opacity: .45; }
}

/* ---------- inner pages (anything that is not the homepage) ----------
   Their first section is light, so the header starts solid instead of
   transparent. These mirror the .scrolled rules in main.css. */
body:not(.is-front) .site-header::before { opacity: 1; }
body:not(.is-front) .site-header {
	box-shadow: 0 1px 0 rgba(21,22,31,.06); border-bottom-color: var(--line); padding: .7rem 0;
}
body:not(.is-front) .brand .wp-block-site-title a { color: var(--ink); }
body:not(.is-front) .brand .wp-block-site-tagline { color: var(--muted); }
body:not(.is-front) .nav-links .wp-block-navigation-item__content.wp-block-navigation-item__content { color: var(--ink-soft); }
body:not(.is-front) .nav-links .wp-block-navigation-item__content.wp-block-navigation-item__content:hover { color: var(--teal-deep); }
body:not(.is-front) .nav-cta .wp-block-button.btn-dark-outline > .wp-block-button__link { border-color: var(--line); color: var(--ink); }
body:not(.is-front) .wp-block-navigation__responsive-container-open::before { background: var(--ink); box-shadow: 0 6px 0 var(--ink); }
body:not(.is-front) .wp-block-navigation__responsive-container-open::after { background: var(--ink); }

/* Written content on inner pages keeps normal list markers. */
.page-body ul:not(.wp-block-navigation__container):not(.footer-contact-list) { list-style: disc; padding-left: 1.3em; }
.page-body ol { list-style: decimal; padding-left: 1.3em; }
.page-body li { margin-bottom: .35rem; }

/* ---------- project update (work in progress) ---------- */
.project-update {
	padding-block: clamp(4.5rem, 9vw, 7rem);
	background: var(--paper);
	position: relative; isolation: isolate; overflow: hidden;
}
.project-update::before {
	content: ""; position: absolute; z-index: -1; pointer-events: none;
	background: url(../img/watercolour-bloom-b.webp) no-repeat center / contain;
	mix-blend-mode: multiply; aspect-ratio: 760/692;
	left: 0; bottom: 0; width: min(44vw, 600px); transform: scaleX(-1);
}
.project-update .section-head { max-width: 680px; }
.project-update .section-head p:not(.eyebrow) { margin-top: 1rem; }
@media (max-width: 900px) {
	.project-update::before { width: 78vw; opacity: .45; }
}

/* ---------- inner pages (anything that is not the homepage) ---------- */
.inner-page .page-head { padding-block: clamp(8rem,14vw,10.5rem) clamp(1.5rem,3vw,2.5rem); background: var(--paper-dim); }
.inner-page .page-head .wp-block-post-title { font-size: clamp(2rem,4.4vw,3.2rem); max-width: 22ch; }
.inner-page .page-head .eyebrow { margin-bottom: .4rem; }
.inner-page .page-body { padding-block: clamp(3rem,6vw,4.5rem) clamp(4.5rem,9vw,7rem); background: var(--paper); }
.inner-page .page-body .wrap > .entry-content > * + * { margin-top: 1.1rem; }
.inner-page .page-body .wp-block-heading { margin-top: 2.2rem; }
.inner-page .page-body p { color: var(--ink-soft); }
.inner-page .page-body a:not(.wp-block-button__link) { color: var(--teal-deep); text-decoration: underline; }

/* ---------- editor-only tidying ---------- */
.editor-styles-wrapper .site-header { position: static; }