/* Home (front-page.html and the market-home template): the page's own layout. The hero's styles ship with the
   hero-morph block (blocks/hero-morph/style.css); the Home sections (Task 6) add theirs here. */

.wp-site-blocks > .sv-home { margin-block-start: 0; }   /* the hero meets the header (S:168) */
.sv-home > * { margin-block: 0; }

/* ---- shared on Home (S:224-632). Small text is 12px at least and muted text uses the AA greys (screen map §4). ---- */
:where(.sv-home) :where(p, h2, h3, dl, dd, ul) { margin: 0; }   /* zero specificity: every margin below wins */
.sv-home :where(.is-layout-flow, .is-layout-constrained) > * { margin-block: 0; }   /* spacing on Home is set per element below */
.sv-home .sv-eyebrow { margin-bottom: 12px; font-size: 13px; letter-spacing: .18em; text-transform: uppercase; color: var(--wp--preset--color--ink-600); }
.sv-home-h { font-size: clamp(24px, 2.8vw, 40px); line-height: 1.1; letter-spacing: -.02em; }
.sv-home-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 16px 24px; margin-bottom: 26px; }
.sv-home-head > :first-child { flex: 1 1 420px; min-width: 0; }
:where(.sv-home > :not(.wp-block-salvagente-hero-morph)) :where(.sv-metric, .sv-metric-sm) { font-weight: 400; line-height: .95; letter-spacing: -.02em; font-variant-numeric: tabular-nums; color: var(--wp--preset--color--ink-900); }
:where(.sv-home > :not(.wp-block-salvagente-hero-morph)) .sv-metric-sm { line-height: 1; letter-spacing: -.01em; }
/* The ink metric colour is for the light sections only; it never reaches the hero (Chris decision 35, Ana C1: ink on the
   hero's black was 1.1:1). Zero-specificity scope, so each section's own metric colour still wins. */
.sv-home .sv-mono { letter-spacing: .06em; font-variant-numeric: tabular-nums; }
.sv-pill {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	box-sizing: border-box;
	padding: 11px 22px;
	border: 1px solid var(--wp--preset--color--primary);
	border-radius: 999px;
	background: var(--wp--preset--color--primary);
	box-shadow: 0 8px 22px -10px rgba(77, 197, 213, .9);
	font-size: 12px;
	letter-spacing: .12em;
	text-transform: uppercase;
	white-space: nowrap;
	text-decoration: none;
	color: #0c0d0e;
}
.sv-pill.is-dark { padding: 13px 24px; background: #0c0d0e; box-shadow: none; color: #fff; }
.sv-pill.is-big { padding: 16px 32px; font-size: 12.5px; box-shadow: none; }

/* The coming-soon ribbon (S:228). Chris decision 95: the band's centre sits on the corner's diagonal (56 px in from the top and
   the right edge), so the card clips it equally at both ends and the centred text reads whole. */
.sv-has-ribbon { position: relative; overflow: hidden; }
:is(.sv-home, .sv-services) .sv-ribbon {
	position: absolute;
	right: 56px;
	top: 56px;
	z-index: 6;
	margin: 0;
	padding: 6px 48px;
	text-align: center;
	white-space: nowrap;
	transform: translate(50%, -50%) rotate(45deg);
	background: var(--wp--preset--color--primary);
	box-shadow: 0 6px 18px -8px rgba(12, 26, 42, .4);
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 12px;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: #0c0d0e;
	pointer-events: none;
}

/* ---- flow strip (S:226-243) ---- */
.sv-home-flow { display: flex; gap: 20px; padding: 40px var(--pg) 0; }
.sv-flow-portal { flex: 1.4; display: flex; align-items: center; gap: 22px; padding: 24px 28px; }
.sv-flow-figure { display: block; width: auto; height: 110px; margin: -30px 0; }
.sv-home .sv-flow-k { font-size: 13px; }
.sv-home .sv-flow-portal-line { max-width: 470px; margin-top: 10px; font-size: 17px; line-height: 1.6; color: var(--wp--preset--color--ink-700); }   /* S:232 slot, Chris decision 40 */
.sv-flow-go { margin-left: auto; margin-right: 112px; }
.sv-flow-red {
	flex: .85;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 24px 28px;
	text-decoration: none;
	color: inherit;
}
.sv-flow-red-text { display: flex; flex-direction: column; gap: 8px; }
.sv-flow-red-line { font-size: 16px; line-height: 1.5; color: var(--wp--preset--color--ink-700); }
.sv-home .sv-flow-price { font-size: clamp(22px, 2.4vw, 34px); white-space: nowrap; }

/* ---- how it works: the dark band (S:245-386) ---- */
.sv-home-how { margin-top: 96px; padding: 70px var(--pg) 72px; background: #0b0c0d; color: #fff; }
.sv-how-head { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 60px; align-items: end; margin-bottom: 44px; }
.sv-home .sv-how-eyebrow { font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--wp--preset--color--primary); }
.sv-home .sv-how-h { margin-top: 16px; font-size: clamp(26px, 3.1vw, 44px); line-height: 1.06; letter-spacing: -.02em; color: #fff; text-wrap: pretty; }
.sv-how-intro { font-size: 16.5px; line-height: 1.62; color: var(--wp--preset--color--on-dark-dim); text-wrap: pretty; }
.sv-how-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 36px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .1); }
.sv-how-note { font-size: 12px; letter-spacing: .18em; color: var(--wp--preset--color--grey-aa); }
/* Ozone panel to wavelength block: the band's 44 px rhythm (Ana 21 Oct, ozone-panel-spacing §2); (0,2,0) beats line 9. */
.sv-home-how > .wp-block-salvagente-wavelength-slider { margin-top: 44px; }
/* The dark cards both teaching blocks use (S:258, S:305). */
.sv-dark-card { padding: 22px 24px; border: 1px solid rgba(255, 255, 255, .13); border-radius: 20px; background: rgba(255, 255, 255, .035); }
.sv-dark-card.is-teal { border-color: rgba(77, 197, 213, .45); background: rgba(77, 197, 213, .05); }
.sv-dark-k { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--wp--preset--color--grey-aa); }
.sv-dark-k b { font-family: var(--wp--preset--font-family--display); font-weight: 700; letter-spacing: .08em; color: #fff; }

/* ---- range (S:387-431) ---- */
.sv-home-range { padding: 96px var(--pg) 0; }
.sv-home-cards .wc-block-product-template { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 0; list-style: none; }
.sv-home-cards .wc-block-product { display: flex; margin: 0; }
.sv-home-cards .wc-block-product > .sv-home-card { flex: 1; }
.sv-home-card { display: flex; flex-direction: column; height: 100%; box-sizing: border-box; padding: 28px 28px 26px; }
.sv-home-cards .wc-block-product:nth-child(3) .sv-home-card { border: 1.5px solid var(--wp--preset--color--primary); box-shadow: 0 20px 48px -26px rgba(77, 197, 213, .85); }
.sv-home-card-img img { width: 100%; height: 230px; object-fit: contain; box-sizing: border-box; padding: 14px; }
.sv-home-card .wp-block-post-title.sv-home-card-title { margin-top: 20px; font-size: 13px; text-align: left; }
.sv-home-card-title a { color: inherit; text-decoration: none; }
.sv-home-card-title a::after { content: ""; position: absolute; inset: 0; }   /* the whole card opens the product */
.sv-home-card { position: relative; }
.sv-home-card-blurb { margin-top: 10px; min-height: 78px; font-size: 16.5px; line-height: 1.55; color: var(--wp--preset--color--ink-700); }
.sv-home-card-blurb p { margin: 0; }
.sv-home-card .sv-home-price { margin-top: auto; padding-top: 16px; border-top: 1px solid var(--sv-stroke-hair); font-size: 26px; text-align: left; }

/* ---- portal teaser (S:433-537) ---- */
.sv-home-portal {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 470px minmax(0, 1fr);
	gap: 30px;
	align-items: center;
	margin: 96px var(--pg) 0;
	padding: 56px 48px;
	border: 1px solid rgba(77, 197, 213, .55);
	border-radius: 36px;
	background: rgba(255, 255, 255, .34);
	-webkit-backdrop-filter: blur(28px) saturate(140%);
	backdrop-filter: blur(28px) saturate(140%);
	box-shadow: 0 26px 64px -36px rgba(12, 13, 14, .5);
}
.sv-portal-text { max-width: 420px; }
.sv-home .sv-portal-h { color: var(--wp--custom--contrast--accent-on-light); line-height: 1.06; }   /* S:439 cyan fails on light (screen map §4) */
.sv-portal-lede { margin-top: 16px; font-size: 17px; line-height: 1.62; color: var(--wp--preset--color--ink-700); }
.sv-portal-points { margin-top: 28px; border-top: 1px solid var(--sv-stroke-hair); }
.sv-portal-points > div { padding: 16px 0; border-bottom: 1px solid var(--sv-stroke-hair); }
.sv-portal-points dt { font-size: 12px; letter-spacing: .14em; color: var(--wp--preset--color--ink-600); }
.sv-portal-points dd { margin-top: 8px; font-size: 16px; line-height: 1.55; color: var(--wp--preset--color--ink-800); }
.sv-vitals { display: flex; flex-direction: column; gap: 16px; }
.sv-vital { position: relative; padding: 20px 22px; }
.sv-vital .sv-label { font-size: 12px; }
.sv-vital .sv-mono { font-size: 12px; color: var(--wp--preset--color--ink-600); }
.sv-vital-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sv-vital-n { display: flex; align-items: baseline; gap: 10px; margin-top: 4px; }
.sv-vital-n .sv-metric { font-size: 50px; }
.sv-ecg { position: relative; height: 62px; margin-top: 2px; overflow: hidden; }
.sv-ecg-track { display: flex; width: 200%; height: 100%; animation: sv-home-ecg 7s linear infinite; }
.sv-ecg-track svg { flex: 1; display: block; height: 100%; }
.sv-vital-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; margin-top: 2px; }
.sv-ecg-toggle { display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border: 1px solid var(--sv-stroke-hair); border-radius: 999px; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--ink-700); cursor: pointer; }
.sv-ecg-toggle .is-play,
.sv-ecg-pause:checked ~ .sv-vital-foot .sv-ecg-toggle .is-pause { display: none; }
.sv-ecg-pause:checked ~ .sv-vital-foot .sv-ecg-toggle .is-play { display: inline; }
.sv-ecg-pause:checked ~ .sv-ecg .sv-ecg-track { animation-play-state: paused; }
.sv-ecg-pause:focus-visible ~ .sv-vital-foot .sv-ecg-toggle { outline: 2px solid var(--wp--preset--color--ink); outline-offset: 2px; }
.sv-vital-pair { display: flex; gap: 16px; }
.sv-vital-pair > * { flex: 1; }
.sv-home .sv-vital-m { margin: 10px 0 8px; font-size: clamp(22px, 2.4vw, 34px); }
.sv-hrv { display: flex; gap: 10px; margin-top: 12px; }
.sv-hrv span { flex: 1; padding: 7px 0; border: 1px solid var(--sv-stroke-glass); border-radius: 10px; background: rgba(255, 255, 255, .5); text-align: center; color: var(--wp--preset--color--ink-800); }
.sv-hrv-line { display: block; width: 100%; height: 34px; margin-top: 10px; }

/* ---- theBooking.site and the outlets card (S:539-580) ---- */
.sv-home-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding: 96px var(--pg) 0; }
.sv-booking { padding: 36px 38px; border-radius: 36px; background: #0b0c0d; color: #fff; }
.sv-booking .sv-how-eyebrow { margin-bottom: 14px; }
.sv-home .sv-pair-h { font-size: 32px; line-height: 1.1; letter-spacing: -.02em; }
.sv-booking .sv-pair-h { color: #fff; }
.sv-booking-text { margin-top: 14px; font-size: 17px; line-height: 1.62; color: var(--wp--preset--color--on-dark-dim); }
.sv-booking-note { position: relative; margin-top: 18px; padding: 16px 18px 16px 38px; border: 1px solid rgba(77, 197, 213, .35); border-radius: 14px; font-size: 15.5px; line-height: 1.55; color: var(--wp--preset--color--on-dark); }
.sv-booking-note::before { content: ""; position: absolute; left: 18px; top: 23px; width: 6px; height: 6px; border-radius: 99px; background: var(--wp--preset--color--primary); }
.sv-booking .sv-pill { margin-top: 22px; }
.sv-booking-stats { display: flex; flex-wrap: wrap; gap: 28px 44px; margin-top: 26px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .12); }
.sv-booking-stats > div { display: flex; flex-direction: column-reverse; justify-content: flex-end; }
.sv-booking-stats dd { font-size: 32px; color: #fff; }
.sv-home .sv-booking-stats dd { color: #fff; }
.sv-booking-stats dt { margin-top: 10px; font-size: 12px; line-height: 1.45; letter-spacing: .14em; text-transform: uppercase; color: var(--wp--preset--color--grey-aa); }
.sv-booking-stats dt b { font-family: var(--wp--preset--font-family--display); font-weight: 700; letter-spacing: .08em; color: #fff; }
.sv-booking .sv-fees-note { margin-top: 16px; font-size: 13px; line-height: 1.5; color: var(--wp--preset--color--grey-aa); }   /* decision 74: the rate never prints without its note */
.sv-booking .sv-fees-note a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.sv-outlets-card { position: relative; display: flex; flex-direction: column; padding: 36px 38px; }
.sv-outlets-text { margin-top: 14px; font-size: 17px; line-height: 1.62; color: var(--wp--preset--color--ink-700); }
.sv-outlets-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-top: auto; padding-top: 18px; border-top: 1px solid var(--sv-stroke-hair); }
.sv-home .sv-outlets-card .sv-outlets-text { margin-bottom: 40px; }
.sv-outlets-foot .sv-mono { font-size: 12px; color: var(--wp--preset--color--ink-600); }
.sv-outlets-link { display: inline-flex; align-items: center; min-height: 44px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; color: var(--wp--custom--contrast--accent-on-light); }
.sv-outlets-link::after { content: ""; position: absolute; inset: 0; }   /* the whole card opens the outlets page */

/* ---- by the numbers (S:582-607): two cards, the ticker is cut ---- */
.sv-home-numbers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; padding: 96px var(--pg) 0; }
.sv-number { padding: 30px 32px; }
.sv-home-numbers .sv-number:only-child { grid-column: 1 / -1; }
.sv-home .sv-number-n { font-size: clamp(34px, 3.8vw, 54px); line-height: 1; color: var(--wp--preset--color--teal-dark); }
.sv-home .sv-number-k { margin-top: 16px; font-size: 12px; }
.sv-number-text { margin-top: 10px; font-size: 14px; line-height: 1.5; color: var(--wp--preset--color--ink-700); }

/* ---- resources (S:609-631) ---- */
.sv-home-resources { padding: 96px var(--pg) 0; }
.sv-resource-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.sv-resource-col { padding: 28px 30px; }
.sv-home .sv-resource-k { font-size: 12.5px; }
.sv-resource-rows { display: flex; flex-direction: column; gap: 12px; margin-top: 20px; padding: 0; list-style: none; }
.sv-resource-rows a { display: flex; align-items: center; min-height: 44px; padding-bottom: 12px; border-bottom: 1px solid var(--sv-stroke-hair); font-size: 16.5px; line-height: 1.45; text-decoration: none; color: var(--wp--preset--color--ink-700); }
.sv-resource-rows a:hover { color: var(--wp--custom--contrast--accent-on-light); }
/* Outlet marquee: the band sits one section-rhythm below Resources (decision 85). Two classes, so .sv-home > * cannot zero it. */
.sv-home .wp-block-salvagente-marquee { margin-top: 96px; }

@keyframes sv-home-ecg { to { transform: translateX(-50%); } }   /* svMarquee S:27 */
@media (prefers-reduced-motion: reduce) {
	.sv-ecg-track { animation: none; }
}

/* ---- responsive (S:43-127) ---- */
@media (max-width: 1100px) {
	.sv-home-flow { flex-wrap: wrap; }
	.sv-home-flow > * { flex-basis: 100%; }
	.sv-how-head, .sv-home-portal, .sv-home-pair { grid-template-columns: minmax(0, 1fr); }
	.sv-how-head { gap: 16px; }
	/* Portal, one column (Ana C3): text, then 24 px, the figure, 16 px, the caption, 32 px, the vitals. */
	.sv-home-portal { gap: 0; }
	.sv-portal-text { max-width: none; margin-bottom: 24px; }
	.sv-home-portal .wp-block-salvagente-hex-figure { margin-bottom: 32px; }
	.sv-home-cards .wc-block-product-template, .sv-resource-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
	.sv-home-how { padding-top: 56px; }
	.sv-home-how > .wp-block-salvagente-wavelength-slider { margin-top: 36px; }
	.sv-home-range, .sv-home-pair, .sv-home-numbers, .sv-home-resources { padding-top: 56px; }
	.sv-home-how, .sv-home-portal { margin-top: 56px; }
	.sv-home .wp-block-salvagente-marquee { margin-top: 56px; }
	.sv-home-cards .wc-block-product-template, .sv-resource-cols, .sv-home-numbers { grid-template-columns: minmax(0, 1fr); }
	.sv-flow-portal { flex-wrap: wrap; }
	.sv-flow-go { margin: 0; }
	.sv-flow-red { flex-wrap: wrap; }
	.sv-home-portal { padding: 32px 22px; }
	.sv-home-portal .sv-eyebrow { padding-right: 72px; }   /* clear of the corner ribbon (Ana C3) */
	.sv-booking, .sv-outlets-card { padding: 28px 20px; }
	.sv-booking-stats { flex-direction: column; gap: 16px; }
	.sv-vital-pair { flex-wrap: wrap; }
}
@media (max-width: 720px) {   /* Ana G3: the -30px figure margin is for one row; on a wrapped card it pulled the label into the figure */
	.sv-flow-figure { height: 88px; margin: 0; }
	.sv-flow-portal-text { flex-basis: 100%; }
}

/* The globe teaser in the outlets card (Phase 5b Task 15; S:572-574): fills the space between the text and the footer. */
.sv-outlets-card .wp-block-salvagente-outlets-map.is-live { flex: 1; display: grid; margin: -22px 0 18px; }
.sv-outlets-card .is-mode-teaser .sv-globe-stage { min-height: 300px; }