/*
 * Only what theme.json cannot express.
 * Logical properties only — no left/right, no margin-left. See docs/I18N-RTL.md.
 */

/* Visually hidden, still announced. The standard WordPress admin utility,
   not yet present on the front end here — needed wherever a visible glyph or
   icon carries information a screen reader can't read literally (see the
   review-stars accessible label). */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	block-size: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	inline-size: 1px;
	word-wrap: normal !important;
}

/* The root gap sets the rhythm inside a layout, but between the shell's own
   parts the design has none: the hero meets the header, the footer meets the
   last band. Sections carry their own space, so nothing is lost by zeroing
   this — and the alternative, a blockGap of 0, would flatten every group. */
.wp-site-blocks > * {
	margin-block-start: 0;
}

/* Sticky header sits above the editor's own layers but below core modals.
   The frosted fill it used to carry lives in blocks.css now — see the note
   there for why the blur cannot sit on this element. */
.codigo-lavie-header {
	z-index: 60;
}

/* The design hangs the menu off the end of the bar and lets the logo hold the
   start. Core's flex layout packs every child to the start instead, so the
   nav claims the slack — and takes the buttons, or the burger, with it.
   The element selector is load-bearing: core repeats `wp-block-navigation` on
   the list inside the overlay, where the same auto margin would sit on the
   cross axis and stop the rows stretching to the full width. */
.codigo-lavie-header > * > nav.wp-block-navigation {
	margin-inline-start: auto;
}

/* The phone breakpoint hides the tel: button; the dock re-exposes it. Two
   classes, because core sets the button's display through a child selector of
   the same weight and would otherwise keep it on screen. */
@media (max-width: 1400px) {
	.wp-block-button.codigo-lavie-call {
		display: none;
	}
}

/* The design sheds nav links as the bar narrows, rather than wrapping them.
   Positional, so it is order-dependent by nature: reordering the menu changes
   which links survive. The two action links sit last and are hidden inline
   anyway, so they are unaffected. Find your plan is persistent by design, so
   it carries `codigo-nav-persist` and survives every step. Scoped to the
   closed container: the `:not()` lifts these above the overlay's reset
   below, which would otherwise lose and leave the overlay truncated. */
@media (max-width: 1220px) {
	.codigo-lavie-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > li:nth-child(n+5):not(.codigo-nav-persist) {
		display: none;
	}
}

@media (max-width: 1020px) {
	.codigo-lavie-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > li:nth-child(n+3):not(.codigo-nav-persist) {
		display: none;
	}
}

/* Both rules must stop applying once the overlay takes over, or the overlay
   would inherit a truncated menu. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > li {
	display: block;
}

/* ── Navigation breakpoint ────────────────────────────────────────────────
   The design switches to the hamburger overlay at 820px. core/navigation's
   "mobile" overlay switches at 600px and that value is not configurable, so
   the 600–820px band re-asserts the overlay state core's own min-width rules
   would otherwise undo. Scoped to the header: the footer navigation sets
   overlayMenu "never" and must not be caught by this.
   Revisit if core ever exposes the breakpoint as a setting. */
@media (min-width: 600px) and (max-width: 820px) {
	.codigo-lavie-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}

	.codigo-lavie-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.codigo-lavie-header .wp-block-navigation__responsive-container.is-menu-open {
		display: flex;
		inset: 0;
		position: fixed;
		z-index: 100000;
	}
}

/* ── Menu toggles ─────────────────────────────────────────────────────────
   Core ships both toggles as a bare glyph. The design gives each one the same
   46px disc the outline buttons are cut from, so open and close read as one
   control in two states. */
.codigo-lavie-header .wp-block-navigation__responsive-container-open,
.codigo-lavie-header .wp-block-navigation__responsive-container-close {
	align-items: center;
	background-color: var(--wp--preset--color--base);
	block-size: 46px;
	border: 1px solid var(--wp--custom--divider);
	border-radius: var(--wp--custom--radius--pill);
	color: var(--wp--preset--color--ink);
	flex-shrink: 0;
	inline-size: 46px;
	justify-content: center;
	padding: 0;
}

/* Scoped to the open state: core hides this button while the menu is inline
   with a selector one class deeper than this one, and that hide must hold. */
.codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-container-close {
	display: flex;
}

.codigo-lavie-header .wp-block-navigation__responsive-container-open svg,
.codigo-lavie-header .wp-block-navigation__responsive-container-close svg {
	block-size: 22px;
	inline-size: 22px;
}

/* ── Overlay menu ─────────────────────────────────────────────────────────
   Everything below carries `:root` and the full `…container-content` chain.
   Core's own overlay rules are four classes deep and land on the anchor
   itself — `…content .wp-block-navigation-item__content { padding: 0 }`,
   `align-items: var(--navigation-layout-justification-setting)`, `gap:
   inherit` — so a shorter selector loses on specificity rather than on
   source order, whichever way the block stylesheet happens to print. The
   `:root` idiom is the same one blocks.css uses against core's buttons. */

/* The overlay is the one place the shell pad is not inherited from a layout,
   so it is restated. Core's own padding here reads the root padding, which
   this theme leaves at zero, and the rows would otherwise touch both edges. */
:root .codigo-lavie-header .is-menu-open {
	padding: 14px var(--wp--custom--shell-pad) var(--wp--preset--spacing--50);
}

/* All three boxes, not just the list: the bar's `justifyContent: right` reaches
   the overlay as `align-items: flex-end` on the wrapper, the list and each row
   in turn, and any one of them left alone shrink-wraps the rows back to the
   width of their longest label. */
:root .codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-container-content,
:root .codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container,
:root .codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item {
	align-items: stretch;
	gap: 0;
}

/* Core stacks the links at the size and alignment the inline bar uses. The
   design restates them as a full-bleed list of ruled rows in the heading
   face — 33px is the design's own step, between heading-s and heading-m and
   used nowhere else, which is why it is not a preset. */
:root .codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content {
	border-block-end: 1px solid var(--wp--custom--divider);
	display: block;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 33px;
	line-height: 1.1;
	padding-block: var(--wp--preset--spacing--20);
}

/* The row before the buttons closes the list, so it sheds its rule. */
:root .codigo-lavie-header .is-menu-open .wp-block-navigation-item:has( + .codigo-nav-action ) .wp-block-navigation-item__content {
	border-block-end-width: 0;
}

/* Book and Call ride inside the overlay, pinned to the bottom as the pills
   they are on the bar, and are suppressed while the menu renders inline. */
.codigo-lavie-header .codigo-nav-action {
	display: none;
}

.codigo-lavie-header .is-menu-open .codigo-nav-action {
	display: block;
}

/* Core nests the list four boxes below the fixed overlay — close, dialog,
   content, list — and only the overlay itself is a full-height column. Every
   box in the chain has to grow for the auto margin below to have slack to
   eat. The `:has()` min-block-size this replaces resolved a percentage
   against an auto-height parent, which is how it came out as zero. */
.codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-close,
.codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-dialog,
.codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-container-content,
.codigo-lavie-header .is-menu-open .wp-block-navigation__container {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

/* Book is the first action in source order, so this is the seam between the
   links and the pair of buttons. It cannot be `:first-of-type`: that matches
   the first `li` among its siblings, which is Treatments, so the rule it
   replaces never fired and the buttons sat wherever the list left them. */
.codigo-lavie-header .is-menu-open .codigo-nav-action--book {
	margin-block-start: auto;
	padding-block-start: var(--wp--preset--spacing--40);
}

.codigo-lavie-header .is-menu-open .codigo-nav-action + .codigo-nav-action {
	padding-block-start: 11px;
}

:root .codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-container-content .codigo-nav-action .wp-block-navigation-item__content {
	border: 1px solid transparent;
	border-radius: var(--wp--custom--radius--pill);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	padding: var(--wp--preset--spacing--20);
	text-align: center;
}

:root .codigo-lavie-header .is-menu-open .codigo-nav-action--book .wp-block-navigation-item__content {
	background-color: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--base);
}

:root .codigo-lavie-header .is-menu-open .codigo-nav-action--call .wp-block-navigation-item__content {
	background-color: var(--wp--preset--color--base);
	border-color: var(--wp--custom--divider);
	color: var(--wp--preset--color--ink);
}

/* ── Mega menu ────────────────────────────────────────────────────────────
   Plain core submenus, edited in the header part's List View like any other
   menu item. A top-level submenu carrying `codigo-mega` (Advanced → CSS
   class) opens as a full-width panel; each submenu inside it is one column,
   its label the column heading. Everything else is read from the content,
   not from classes, so an editor can add, rename, reorder or empty a group
   without touching code:
   - a group of 12+ links takes two tracks and flows into two columns;
   - a link's Description prints as a badge (the Sciton mJOULE tag);
   - a group carrying `codigo-mega__concerns` is the browse-by-concern row
     across the foot of the panel, drawn as chips.
   Open/close, Escape and focus-out are core's own interactivity, untouched.
   Panel colours come from the navigation block's own Overlay colours, so
   they are edited there, not here. */
@media (min-width: 821px) {
	/* The panel spans the bar, not the item. Every box between the item and
	   the sticky header is positioned by core, so each is flattened and the
	   header — sticky, so a containing block — catches the panel. */
	.codigo-lavie-header nav.wp-block-navigation,
	.codigo-lavie-header .wp-block-navigation__responsive-container:not(.is-menu-open),
	.codigo-lavie-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-dialog,
	.codigo-lavie-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container,
	.codigo-lavie-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .codigo-mega {
		position: static;
	}

	/* The panel opens at the header's lower edge, a gap below the link. The
	   item reaches down across it so the pointer never leaves the item, and
	   core's hover never closes the panel on the way in. Layout-neutral. */
	.codigo-lavie-header .wp-block-navigation__container > .codigo-mega {
		margin-block-end: -30px;
		padding-block-end: 30px;
	}

	:root .codigo-lavie-header .wp-block-navigation .wp-block-navigation__container > .codigo-mega.has-child > .wp-block-navigation__submenu-container {
		align-items: start;
		border: 0;
		border-block-end: 1px solid var(--wp--custom--divider);
		box-shadow: 0 24px 48px -28px var(--wp--custom--ink--half);
		display: grid;
		gap: var(--wp--preset--spacing--40) 28px;
		grid-auto-flow: row dense;
		grid-template-columns: repeat(auto-fill, minmax(135px, 1fr));
		inset-block-start: 100%;
		inset-inline: 0;
		max-block-size: calc(100dvh - 140px);
		overflow-y: auto;
		padding-block: var(--wp--preset--spacing--50);
		padding-inline: max(var(--wp--custom--shell-pad), calc((100% - var(--wp--style--global--wide-size)) / 2));
	}

	/* A column. */
	:root .codigo-lavie-header .wp-block-navigation .codigo-mega.has-child > .wp-block-navigation__submenu-container > .has-child {
		align-items: stretch;
		display: flex;
		flex-direction: column;
		min-inline-size: 0;
	}

	:root .codigo-lavie-header .wp-block-navigation .codigo-mega.has-child > .wp-block-navigation__submenu-container > .has-child:has(> .wp-block-navigation__submenu-container > li:nth-child(12)) {
		grid-column: span 2;
	}

	/* Its links: always shown, in flow — never core's fly-out. */
	:root .codigo-lavie-header .wp-block-navigation .codigo-mega.has-child > .wp-block-navigation__submenu-container > .has-child > .wp-block-navigation__submenu-container {
		background: transparent;
		border: 0;
		display: block;
		height: auto;
		min-width: 0;
		opacity: 1;
		overflow: visible;
		padding: 0;
		position: static;
		visibility: inherit;
		width: auto;
	}

	:root .codigo-lavie-header .wp-block-navigation .codigo-mega.has-child > .wp-block-navigation__submenu-container > .has-child:has(> .wp-block-navigation__submenu-container > li:nth-child(12)) > .wp-block-navigation__submenu-container {
		column-count: 2;
		column-gap: 28px;
	}

	:root .codigo-lavie-header .wp-block-navigation .codigo-mega .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container::before,
	:root .codigo-lavie-header .wp-block-navigation .codigo-mega .wp-block-navigation__submenu-container .wp-block-navigation-submenu__toggle {
		display: none;
	}

	:root .codigo-lavie-header .wp-block-navigation .codigo-mega .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container > li {
		break-inside: avoid;
		display: block;
	}

	/* Column heading. */
	:root .codigo-lavie-header .wp-block-navigation .codigo-mega.has-child > .wp-block-navigation__submenu-container > .has-child > .wp-block-navigation-item__content {
		color: var(--wp--custom--ink--soft);
		font-size: var(--wp--preset--font-size--x-small);
		font-weight: 700;
		letter-spacing: 0.14em;
		padding: 0 0 10px;
		text-transform: uppercase;
	}

	:root .codigo-lavie-header .wp-block-navigation .codigo-mega .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
		color: var(--wp--custom--ink--strong);
		display: block;
		font-size: var(--wp--preset--font-size--small);
		line-height: 1.3;
		padding: 5px 0;
	}

	:root .codigo-lavie-header .wp-block-navigation .codigo-mega .wp-block-navigation__submenu-container .wp-block-navigation-item__content:is(:hover, :focus-visible) {
		color: var(--wp--preset--color--ink);
		text-decoration: underline;
		text-underline-offset: 3px;
	}

	/* Browse by concern: the row across the foot of the panel. */
	:root .codigo-lavie-header .wp-block-navigation .codigo-mega.has-child > .wp-block-navigation__submenu-container > .codigo-mega__concerns {
		align-items: center;
		border-block-start: 1px solid var(--wp--custom--divider);
		flex-direction: row;
		flex-wrap: wrap;
		gap: 10px 20px;
		grid-column: 1 / -1;
		padding-block-start: var(--wp--preset--spacing--30);
	}

	:root .codigo-lavie-header .wp-block-navigation .codigo-mega.has-child > .wp-block-navigation__submenu-container > .codigo-mega__concerns > .wp-block-navigation-item__content {
		padding: 0;
	}

	:root .codigo-lavie-header .wp-block-navigation .codigo-mega.has-child > .wp-block-navigation__submenu-container > .codigo-mega__concerns > .wp-block-navigation__submenu-container {
		column-count: auto;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		gap: 8px;
	}

	:root .codigo-lavie-header .wp-block-navigation .codigo-mega .codigo-mega__concerns .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
		border: 1px solid var(--wp--custom--divider);
		border-radius: var(--wp--custom--radius--pill);
		padding: 6px 14px;
	}

	:root .codigo-lavie-header .wp-block-navigation .codigo-mega .codigo-mega__concerns .wp-block-navigation__submenu-container .wp-block-navigation-item__content:is(:hover, :focus-visible) {
		background-color: var(--wp--preset--color--aqua-tint);
		border-color: var(--wp--preset--color--aqua);
		text-decoration: none;
	}

	/* The plain dropdowns — Locations, Membership, About. */
	:root .codigo-lavie-header .wp-block-navigation .wp-block-navigation__container > .has-child:not(.codigo-mega) > .wp-block-navigation__submenu-container {
		border: 1px solid var(--wp--custom--divider);
		border-radius: var(--wp--custom--radius--md);
		box-shadow: 0 24px 48px -28px var(--wp--custom--ink--half);
		min-inline-size: 240px;
		padding: 8px;
	}

	:root .codigo-lavie-header .wp-block-navigation .wp-block-navigation__container > .has-child:not(.codigo-mega) > .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
		border-radius: var(--wp--custom--radius--sm);
		font-size: var(--wp--preset--font-size--small);
		padding: 9px 12px;
	}

	:root .codigo-lavie-header .wp-block-navigation .wp-block-navigation__container > .has-child:not(.codigo-mega) > .wp-block-navigation__submenu-container .wp-block-navigation-item__content:is(:hover, :focus-visible) {
		background-color: var(--wp--preset--color--aqua-tint);
	}
}

/* ── Mega menu tabs ───────────────────────────────────────────────────────
   Drawn by assets/js/mega-menu.js; without it there is no strip and both
   sides show, as above. `!important` on the hidden side only: the column
   rules are deliberately heavy to beat core, and `hidden` must beat them. */
.codigo-lavie-header .codigo-mega > .wp-block-navigation__submenu-container > li[hidden] {
	display: none !important;
}

:root .codigo-lavie-header .wp-block-navigation .codigo-mega > .wp-block-navigation__submenu-container > .codigo-mega__tabs {
	display: block;
	grid-column: 1 / -1;
}

.codigo-mega__tabs [role="tablist"] {
	border-block-end: 1px solid var(--wp--custom--divider);
	display: flex;
	gap: var(--wp--preset--spacing--30);
}

.codigo-mega__tab {
	background: none;
	border: 0;
	border-block-end: 2px solid transparent;
	color: var(--wp--custom--ink--soft);
	cursor: pointer;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	margin-block-end: -1px;
	padding: 0 0 10px;
}

.codigo-mega__tab:hover,
.codigo-mega__tab[aria-selected="true"] {
	color: var(--wp--preset--color--ink);
}

.codigo-mega__tab[aria-selected="true"] {
	border-block-end-color: var(--wp--preset--color--ink);
}

.codigo-mega__tab:focus-visible {
	outline: 2px solid var(--wp--preset--color--ink);
	outline-offset: 3px;
}

/* On its own tab the concern row needs no rule to divide it from anything. */
:root .codigo-lavie-header .wp-block-navigation .codigo-mega.has-child > .has-tabs > .codigo-mega__concerns {
	border-block-start: 0;
	padding-block-start: 0;
}

:root .codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-container-content .codigo-mega .codigo-mega__tabs {
	padding-block: var(--wp--preset--spacing--20) 4px;
}

/* A link's Description, as a badge beside its label — both layouts. */
.codigo-lavie-header .wp-block-navigation__submenu-container .wp-block-navigation-item__description {
	background-color: var(--wp--preset--color--aqua-tint);
	border-radius: var(--wp--custom--radius--pill);
	color: var(--wp--preset--color--ink);
	display: inline-block;
	font-family: var(--wp--preset--font-family--body);
	font-size: 11px;
	font-weight: 600;
	line-height: 1.5;
	margin-inline-start: 6px;
	padding: 0 7px;
	vertical-align: 1px;
}

/* ── Overlay: submenus ────────────────────────────────────────────────────
   Core prints every submenu expanded in the overlay. At the 33px row size
   the treatment list would run for metres, so everything below the top
   level drops to body text: group labels as eyebrows, their links in two
   compact columns, the concern row as chips. */
:root .codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
	padding: 6px 0 var(--wp--preset--spacing--20);
}

:root .codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	border-block-end-width: 0;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.3;
	padding-block: 7px;
}

:root .codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-container-content .codigo-mega .wp-block-navigation__submenu-container > .has-child > .wp-block-navigation-item__content {
	color: var(--wp--custom--ink--soft);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.14em;
	padding-block: var(--wp--preset--spacing--20) 2px;
	text-transform: uppercase;
}

:root .codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-container-content .codigo-mega .wp-block-navigation__submenu-container > .has-child > .wp-block-navigation__submenu-container {
	column-gap: 16px;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	padding-block: 0;
}

:root .codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-container-content .codigo-mega .codigo-mega__concerns > .wp-block-navigation__submenu-container {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 8px;
	padding-block-start: 6px;
}

:root .codigo-lavie-header .is-menu-open .wp-block-navigation__responsive-container-content .codigo-mega .codigo-mega__concerns .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	border: 1px solid var(--wp--custom--divider);
	border-radius: var(--wp--custom--radius--pill);
	padding: 6px 14px;
}

/* ── Footer ───────────────────────────────────────────────────────────────
   The dark shell is a rounded panel inside the cream band. Everything inside
   it reads on ink, so link colour is re-pointed here rather than per block —
   theme.json's global link colour is ink, which would vanish against it. */
.codigo-lavie-footer__shell a {
	color: var(--wp--custom--on-dark--muted);
	transition: color 0.16s;
}

.codigo-lavie-footer__shell a:hover,
.codigo-lavie-footer__shell a:focus {
	color: var(--wp--preset--color--aqua);
}

/* The shell tightens on phones, where 48px of inset costs more than it buys. */
@media (max-width: 640px) {
	.codigo-lavie-footer__shell {
		padding: var(--wp--preset--spacing--40);
	}
}

/* Grid columnCount is a desktop value and cannot express fr ratios, so the
   real track definitions live here. Scoped one level deeper than the block's
   own layout class so these win on specificity, not on source order. */
.codigo-lavie-footer .codigo-lavie-footer__news {
	grid-template-columns: 1.15fr 0.85fr;
}

.codigo-lavie-footer .codigo-lavie-footer__grid {
	align-items: start;
	grid-template-columns: 1.5fr repeat(3, minmax(0, 1fr));
}

/* Tablet: both shells collapse to one column, footer links go two-up. */
@media (max-width: 1024px) {
	.codigo-lavie-footer .codigo-lavie-footer__news {
		grid-template-columns: 1fr;
	}

	.codigo-lavie-footer .codigo-lavie-footer__grid {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 640px) {
	.codigo-lavie-footer .codigo-lavie-footer__grid {
		grid-template-columns: 1fr;
	}

	/* Clears the fixed dock in blocks.css, so the footer's own legal line is
	   not the thing sitting behind it. 82px is the design's figure: the dock's
	   72px content box plus its 10px top padding, before the safe-area inset
	   the dock adds again on top of that on a notched phone. */
	body {
		padding-block-end: 82px;
		/* Stacks the AI chat pill (codigo-ai-chat) above the dock rather than
		   over its buttons: the dock's 82px and safe-area inset, plus a 12px gap. */
		--codigo-ai-chat-offset: calc(94px + env(safe-area-inset-bottom));
	}
}

/* Newsletter copy takes the full width of its grid track — the track ratio
   already sets the measure, so a second cap here only left dead space. */
.codigo-lavie-footer__newscopy {
	max-inline-size: none;
}

/* The heading spans the track; only the body copy is held to a measure. */
.codigo-lavie-footer__newscopy > p {
	max-inline-size: 500px;
}

/* Brand card hugs the logo instead of stretching to the column. */
.codigo-lavie-footer__brandmark {
	inline-size: fit-content;
}

/* Measure caps live here, not on the blocks. A constrained layout would get
   them from contentSize, but core implements that with margin-left/right and
   !important, which pins the column in RTL. */
.codigo-lavie-footer__brand > p {
	max-inline-size: 32ch;
}

/* Link columns are tracked uppercase — set once, not per link. */
.codigo-lavie-footer__links {
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

/* Book is the one link in the column that carries emphasis. */
.codigo-lavie-footer__shell .codigo-lavie-footer__book a {
	color: var(--wp--preset--color--aqua);
}

/* Outlined circular social buttons, filling on hover. Sized to the 44px
   minimum touch target rather than to the icon. */
.codigo-lavie-footer__social.wp-block-social-links {
	gap: var(--wp--custom--gap);
}

.codigo-lavie-footer__social .wp-block-social-link {
	margin: 0;
}

.codigo-lavie-footer__social .wp-block-social-link-anchor {
	align-items: center;
	background-color: transparent;
	block-size: 44px;
	border: 1px solid var(--wp--custom--on-dark--line);
	border-radius: var(--wp--custom--radius--pill);
	color: var(--wp--custom--on-dark--strong);
	display: flex;
	inline-size: 44px;
	justify-content: center;
	padding: 0;
	transition: background-color 0.16s, border-color 0.16s, color 0.16s;
}

.codigo-lavie-footer__social .wp-block-social-link-anchor svg {
	block-size: 20px;
	fill: currentColor;
	inline-size: 20px;
}

.codigo-lavie-footer__social .wp-block-social-link-anchor:hover,
.codigo-lavie-footer__social .wp-block-social-link-anchor:focus {
	background-color: var(--wp--preset--color--aqua);
	border-color: var(--wp--preset--color--aqua);
	color: var(--wp--preset--color--ink);
}

/* Horizontal swipe rows moved to assets/css/blocks.css as the `swipe` block
   style, so the editor renders them too and the client can switch a row back
   to a wrapping grid without editing CSS. */

/* ── Preloader + entrance ─────────────────────────────────────────────────
   A brand moment on first paint, not a spinner: the wordmark builds itself
   while the hero underneath finishes its own reveal out of sight, so the
   curtain lift uncovers a page that is already settled rather than one still
   catching up — nothing here can push the hero's paint past the LCP budget.
   Markup lives in parts/header.html; assets/js/loading.js drives the exit.
   Repeat visits within a session skip the whole thing — see
   html.codigo-no-preloader, set by the inline script next to the markup
   before the stylesheet ever gets a chance to paint it. */
#codigo-preloader {
	align-items: center;
	background-color: var(--wp--preset--color--cream);
	block-size: 100vh;
	block-size: 100dvh;
	display: flex;
	inset: 0;
	justify-content: center;
	overflow: hidden;
	pointer-events: none;
	position: fixed;
	transition: opacity 0.5s ease, transform 0.6s cubic-bezier(0.6, 0, 0.2, 1);
	z-index: 9999;
}

#codigo-preloader.is-done {
	opacity: 0;
	transform: scale(1.04);
}

html.codigo-no-preloader #codigo-preloader {
	display: none;
}

.codigo-preloader__glow {
	background: radial-gradient(circle, var(--wp--preset--color--aqua-tint) 0%, transparent 70%);
	block-size: 60vmax;
	inline-size: 60vmax;
	inset-block-start: 50%;
	inset-inline-start: 50%;
	opacity: 0;
	position: absolute;
	transform: translate(-50%, -50%) scale(0.4);
	animation: codigo-glow-bloom 1.1s cubic-bezier(0.16, 0.84, 0.44, 1) forwards;
}

.codigo-preloader__mark {
	position: relative;
	text-align: center;
}

.codigo-preloader__word {
	align-items: baseline;
	display: inline-flex;
	font-family: var(--wp--preset--font-family--heading);
	font-size: clamp(40px, 8vw, 64px);
	position: relative;
}

.codigo-preloader__la,
.codigo-preloader__vie {
	animation: codigo-reveal-up 0.6s cubic-bezier(0.16, 0.84, 0.44, 1) both;
	display: inline-block;
	opacity: 0;
}

.codigo-preloader__la {
	animation-delay: 0.1s;
	color: var(--wp--preset--color--spring);
}

.codigo-preloader__vie {
	animation-delay: 0.28s;
	color: var(--wp--preset--color--ink);
}

.codigo-preloader__spark {
	animation: codigo-spark-in 0.5s cubic-bezier(0.16, 0.84, 0.44, 1) 0.5s both;
	fill: var(--wp--preset--color--aqua);
	inset-block-start: -2px;
	inset-inline-end: -6px;
	opacity: 0;
	position: absolute;
}

.codigo-preloader__sub {
	animation: codigo-reveal-up 0.5s cubic-bezier(0.16, 0.84, 0.44, 1) 0.42s both;
	color: var(--wp--custom--ink--soft);
	display: block;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.32em;
	margin-block-start: 4px;
	opacity: 0;
}

.codigo-preloader__bar {
	background-color: var(--wp--custom--divider);
	block-size: 2px;
	border-radius: var(--wp--custom--radius--pill);
	inline-size: 130px;
	margin-block-start: var(--wp--preset--spacing--40);
	margin-inline: auto;
	overflow: hidden;
}

.codigo-preloader__fill {
	animation: codigo-bar-fill 0.9s cubic-bezier(0.4, 0, 0.2, 1) 0.2s forwards;
	background: linear-gradient(90deg, var(--wp--preset--color--spring), var(--wp--preset--color--aqua));
	block-size: 100%;
	display: block;
	inline-size: 0;
}

@keyframes codigo-glow-bloom {
	to {
		opacity: 1;
		transform: translate(-50%, -50%) scale(1);
	}
}

@keyframes codigo-reveal-up {
	from {
		opacity: 0;
		transform: translateY(14px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes codigo-spark-in {
	0% {
		opacity: 0;
		transform: scale(0.4) rotate(-15deg);
	}

	60% {
		opacity: 1;
		transform: scale(1.15) rotate(0deg);
	}

	100% {
		opacity: 1;
		transform: scale(1) rotate(0deg);
	}
}

@keyframes codigo-bar-fill {
	to {
		inline-size: 100%;
	}
}

/* The hero finishes its own entrance behind the curtain — by the time it
   lifts, nothing here is still moving. Runs on every load, preloader or not:
   it is quick enough to read as polish rather than a wait, and each selector
   is already load-bearing elsewhere so nothing new is introduced to hook. */
.codigo-lavie-hero .is-style-pill,
.codigo-lavie-hero h1,
.codigo-lavie-hero .codigo-lavie-measure,
.codigo-lavie-hero .wp-block-buttons,
.codigo-lavie-hero .codigo-lavie-hero__stats {
	animation: codigo-reveal-up 0.5s cubic-bezier(0.16, 0.84, 0.44, 1) both;
}

.codigo-lavie-hero h1 {
	animation-delay: 0.09s;
}

.codigo-lavie-hero .codigo-lavie-measure {
	animation-delay: 0.18s;
}

.codigo-lavie-hero .wp-block-buttons {
	animation-delay: 0.27s;
}

.codigo-lavie-hero .codigo-lavie-hero__stats {
	animation-delay: 0.36s;
}

/* Respect the user's motion preference for every animated affordance. */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}

	#codigo-preloader {
		display: none !important;
	}

	.codigo-lavie-hero .is-style-pill,
	.codigo-lavie-hero h1,
	.codigo-lavie-hero .codigo-lavie-measure,
	.codigo-lavie-hero .wp-block-buttons,
	.codigo-lavie-hero .codigo-lavie-hero__stats {
		animation-delay: 0s !important;
		opacity: 1 !important;
		transform: none !important;
	}
}