/* Accessibility layer over the supplied V5 design.
   Measured WCAG ratios are in tests/contrast.test.js.
   Failing source colors are overridden here; passing colors stay in the design CSS. */

.mobile-toggle {
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	padding: 0;
}

.lang-select,
.main-nav > a,
.nav-dropdown summary,
.mobile-panel a,
.footer-column a,
.v5-faq-accordion summary,
.accordion summary,
.v5-console-controls button,
.v5-gallery-tab,
.v5-mobile-download > a {
	min-height: 44px;
}

.v5-mobile-download > a {
	display: inline-flex;
	align-items: center;
}

/* The 44px targets above must stay vertically centred in the 76px header. */
.main-nav > a,
.nav-dropdown summary {
	display: flex;
	align-items: center;
}

.nav-dropdown summary .chevron {
	line-height: 1;
	transform: translateY(-2px);
}

.lang-select-wrap {
	box-sizing: border-box;
	height: 44px;
	padding: 0 12px;
}

.lang-select {
	min-height: 42px;
}

.lang-select-wrap.is-enhanced {
	padding: 0;
}

.lang-select-wrap.is-enhanced > :not(.lang-trigger):not(.lang-list) {
	display: none;
}

.lang-trigger {
	display: flex;
	align-items: center;
	gap: 6px;
	height: 42px;
	padding: 0 12px;
	border: 0;
	border-radius: inherit;
	background: transparent;
	color: inherit;
	font: inherit;
	font-size: 11px;
	font-weight: 650;
	white-space: nowrap;
	cursor: pointer;
}

.lang-code {
	font-weight: 750;
	letter-spacing: 0.04em;
}

.lang-chevron {
	font-size: 13px;
	line-height: 1;
	transform: translateY(-2px);
	transition: transform 0.2s;
}

.lang-trigger[aria-expanded="true"] .lang-chevron {
	transform: translateY(1px) rotate(180deg);
}

.lang-list {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	z-index: 20;
	display: grid;
	gap: 1px;
	min-width: 190px;
	margin: 0;
	padding: 8px;
	list-style: none;
	border-radius: 15px;
	background: #f6f7f0;
	color: #183d2b;
	box-shadow: 0 25px 70px #0003;
}

.lang-list[hidden] {
	display: none;
}

.lang-list a {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	padding: 0 12px;
	border-radius: 8px;
	font-size: 13px;
}

.lang-list a b {
	width: 22px;
	font-size: 11px;
	letter-spacing: 0.06em;
	opacity: 0.65;
}

.lang-list a:hover,
.lang-list a:focus-visible {
	background: #e4eee0;
}

.lang-list a[aria-current] {
	font-weight: 700;
}

.lang-list a[aria-current]::after {
	content: "✓";
	margin-left: auto;
}

@media (max-width: 420px) {
	.lang-name {
		display: none;
	}
}

.mobile-panel a,
.footer-column a {
	display: flex;
	align-items: center;
	max-width: 100%;
}

.footer-top {
	grid-template-columns: minmax(0, 32%) minmax(0, 1fr);
}

.footer-links,
.footer-column {
	min-width: 0;
}

html {
	overflow-x: clip;
}

@media (max-width: 700px) {
	.v5-gallery-tab {
		width: auto;
	}
}

:focus-visible {
	outline: 3px solid #0c281f !important;
	outline-offset: 3px !important;
}

.v5-sitewide .site-header :focus-visible,
.v5-usecases :focus-visible,
.v5-together :focus-visible,
.v5-final :focus-visible,
.inner-hero-dark :focus-visible,
.footer :focus-visible {
	outline-color: #e8f6e4 !important;
}

.v5-step-body p,
.v5-feature-copy p,
.v5-faq-accordion details p,
.pricing-card:not(.is-featured) p,
.store-card small,
.v5-mobile-download > span small,
.inner-hero:not(.inner-hero-dark) p,
.fineprint,
.v5-business-card p,
.v5-business-section p {
	color: #41574c;
}

.inner-hero:not(.inner-hero-dark) .eyebrow,
.section .eyebrow,
.bottom-cta .eyebrow {
	color: #1b5a36;
}

.pricing-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.pricing-card:nth-child(2) {
	background: #fff;
	color: #142e25;
}

.pricing-card:nth-child(2) p {
	color: #41574c;
}

.pricing-card.is-featured {
	background: #103e2e;
	color: #fff;
}

.pricing-card.is-featured p,
.pricing-card.is-featured .plan-price {
	color: #d7eee0;
}

.plan-price {
	font-size: clamp(28px, 3vw, 36px);
	font-weight: 720;
	letter-spacing: -0.04em;
	line-height: 1.1;
	margin: 12px 0;
	color: #142e25;
}

.pricing-card .btn {
	margin-top: auto;
}

@media (max-width: 980px) {
	.pricing-grid {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto !important;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}

	.reveal {
		opacity: 1 !important;
		transform: none !important;
	}
}

/* Subpages kept a dark V4 header while V5 painted dark text on it. */
.lm-home :focus-visible,
.lm-page :focus-visible {
	outline-color: #e8f6e4 !important;
}

body.v5-sitewide[data-v4]:not(.lm-page) .site-header,
body.v5-sitewide[data-v4]:not(.lm-page) .site-header:has(.nav-dropdown[open]) {
	background: rgba(250, 251, 248, 0.96);
	color: #163f30;
	border-bottom-color: #dae5da;
}

body.v5-sitewide[data-v4]:not(.lm-page) .brand,
body.v5-sitewide[data-v4]:not(.lm-page) .main-nav > a,
body.v5-sitewide[data-v4]:not(.lm-page) .main-nav a.active,
body.v5-sitewide[data-v4]:not(.lm-page) .main-nav a:hover,
body.v5-sitewide[data-v4]:not(.lm-page) .nav-dropdown summary,
body.v5-sitewide[data-v4]:not(.lm-page) .nav-dropdown summary:hover,
body.v5-sitewide[data-v4]:not(.lm-page) .lang-select-wrap,
body.v5-sitewide[data-v4]:not(.lm-page) .lang-select {
	color: #1b4332;
}

body.v5-sitewide[data-v4]:not(.lm-page) .mobile-toggle span {
	background: #1b4332;
}

@media (max-width: 700px) {
	.v5-gallery-stage {
		height: auto;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-end;
		padding: 58px 16px 18px;
		gap: 14px;
	}

	.v5-gallery-phone,
	.v5-gallery-phone:hover {
		position: relative;
		transform: none;
		width: min(174px, 46vw);
	}

	.v5-gallery-copy {
		position: static;
		left: auto;
		bottom: auto;
		max-width: none;
		width: 100%;
	}

	.v5-gallery-copy,
	.v5-gallery-copy span {
		color: #1b4332;
	}
}