/*
 * Salpim brand layer for Flatsome.
 *
 * Colours follow the Salpim web app (--salpim-brand-* in salpim/frontend/src/app/globals.css);
 * Flatsome's own colour options are set to the same values. Classes that start with "sp-" are set
 * on UX Builder elements through their "Class" field, so the pages stay editable in the builder.
 */

/* Inter (variable, Latin subset), SIL Open Font License 1.1: fonts/OFL-Inter.txt */
@font-face {
	font-family: "Inter";
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url("fonts/inter-latin-wght-normal.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	--sp-primary: #BD500B;
	--sp-primary-dark: #8F3A06;
	--sp-orange: #F7941D;
	--sp-gold: #FBBA33;
	--sp-amber: #F59E0B;
	--sp-peach: #FFEDD5;
	--sp-cream: #FFF8F2;
	--sp-sand: #F6EDE4;
	--sp-ink: #2B211C;
	--sp-text: #5A4A40;
	--sp-muted: #7A6456;
	--sp-line: rgba(97, 39, 9, 0.11);
	--sp-night: #211813;
	--sp-radius: 16px;
	--sp-radius-lg: 24px;
	--sp-shadow: 0 1px 2px rgba(97, 39, 9, 0.04), 0 10px 30px rgba(97, 39, 9, 0.07);
	--sp-shadow-lg: 0 2px 6px rgba(97, 39, 9, 0.04), 0 28px 70px rgba(97, 39, 9, 0.13);
	--sp-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Noto Sans", sans-serif;
	--sp-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

/* ---- Base typography ------------------------------------------------------ */

body {
	font-family: var(--sp-font);
	color: var(--sp-text);
	font-size: 1rem;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6, .heading-font, .alt-font,
.nav > li > a, .button, button, input, select, textarea,
.off-canvas-center .nav-sidebar.nav-vertical > li > a {
	font-family: var(--sp-font);
}

h1, h2, h3, h4, h5, h6 {
	color: var(--sp-ink);
	letter-spacing: -0.02em;
}

/* Korean lines break between words, not inside them; a long URL or e-mail still wraps. */
:lang(ko) {
	word-break: keep-all;
	overflow-wrap: break-word;
}

/* Hangul has no capitals and sits denser than Latin: the wide tracking of the small uppercase
   labels and the tight tracking of the large headings are relaxed on Korean pages. */
:lang(ko) .sp-eyebrow,
:lang(ko) .sp-step h5::before,
:lang(ko) .sp-footer__title,
:lang(ko) .sp-journey__label,
:lang(ko) .sp-bodymap__kicker,
:lang(ko) .sp-map__label,
:lang(ko) .sp-mega__title,
:lang(ko) .sp-logos__title,
:lang(ko) .sp-ctable thead th,
:lang(ko) .sp-ctable__group th,
:lang(ko) .sp-clinic__area,
:lang(ko) .sp-toc__title,
:lang(ko) .search-results .page-title {
	letter-spacing: 0.04em;
}

:lang(ko) .banner h1.sp-display,
:lang(ko) .sp-display--dark,
:lang(ko) .single-post .entry-header .entry-title {
	letter-spacing: -0.018em;
}

:lang(ko) .banner h2.sp-h2,
:lang(ko) h1,
:lang(ko) h2,
:lang(ko) h3 {
	letter-spacing: -0.012em;
}

::selection {
	background: var(--sp-peach);
	color: var(--sp-ink);
}

a {
	transition: color 0.2s ease;
}

/* ---- Buttons: brand radius, no uppercase ---------------------------------- */

.button,
input[type="submit"],
.wp-element-button {
	text-transform: none;
	letter-spacing: 0;
	font-weight: 600;
	border-radius: 12px;
	transition: transform 0.2s var(--sp-ease), box-shadow 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.button.primary:not(.is-outline):not(.is-link) {
	box-shadow: 0 6px 18px rgba(189, 80, 11, 0.28);
}

.button.primary:not(.is-outline):not(.is-link):hover {
	background-color: var(--sp-primary-dark);
	box-shadow: 0 10px 26px rgba(189, 80, 11, 0.34);
	transform: translateY(-1px);
}

.button i {
	transition: transform 0.2s var(--sp-ease);
}

.button:hover i.icon-angle-right {
	transform: translateX(3px);
}

.button.is-larger {
	padding: 0.15em 1.35em;
	font-size: 1.05rem;
	line-height: 3.05em;
}

.sp-btn {
	margin: 0.35rem 0.6rem 0.35rem 0;
}

.sp-btn--glass.is-outline {
	background: rgba(255, 255, 255, 0.1);
	border: 1.5px solid rgba(255, 255, 255, 0.55);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	color: #fff;
}

.sp-btn--glass.is-outline:hover {
	background: #fff;
	border-color: #fff;
	color: var(--sp-ink);
	box-shadow: none;
}

.sp-btn--outline.is-outline {
	border: 1.5px solid rgba(43, 33, 28, 0.22);
	color: var(--sp-ink);
	padding: 0 1.6em;
}

.sp-btn--outline.is-outline:hover {
	background: var(--sp-ink);
	border-color: var(--sp-ink);
	color: #fff;
	box-shadow: none;
}

.sp-btn--link.is-link {
	padding: 0;
	color: var(--sp-primary);
	font-size: 1rem;
	text-decoration: none;
}

.sp-btn--link.is-link span {
	border-bottom: 1.5px solid rgba(189, 80, 11, 0.3);
	padding-bottom: 2px;
	transition: border-color 0.2s ease;
}

.sp-btn--link.is-link:hover span {
	border-color: currentColor;
}

/* ---- Header --------------------------------------------------------------- */

.header-main .nav > li > a {
	font-size: 0.95rem;
	font-weight: 550;
	letter-spacing: 0;
}

/* Narrow desktops and tablets in landscape (850-1199px): menu, language and button stay on one row
   instead of the button dropping below the header. Under 940px the language shows its flag only. */
@media (min-width: 850px) and (max-width: 1199px) {
	.header-main .nav-spacing-large > li {
		margin: 0 6px;
	}

	.header-main .nav > li > a {
		font-size: 0.86rem;
	}

	.header-main .header-button-1 .button {
		padding: 0 0.85em;
		font-size: 0.84rem;
	}
}

@media (min-width: 850px) and (max-width: 939px) {
	.header-main #logo {
		margin-right: 12px;
	}

	.header-main .header-language-dropdown__link {
		font-size: 0 !important;
	}

	.header-main .header-language-dropdown__link .image-icon img {
		width: 18px;
		height: auto;
	}
}

/* The menu links are anchors on the home page, so Flatsome marks several of them "active" at once. */
.header-main .nav > li.active > a,
.header:not(.transparent) .header-nav-main.nav > li.active:not(:hover) > a {
	color: var(--sp-ink);
}

.header-main .nav > li > a:hover {
	color: var(--sp-primary);
}

#header.transparent .header-main.nav-dark .nav > li > a,
#header.transparent .header-main.nav-dark .nav > li.active > a {
	color: rgba(255, 255, 255, 0.9);
}

#header.transparent .header-main.nav-dark .nav > li > a:hover {
	color: #fff;
}

.header-button-1 .button,
.header-button .button {
	border-radius: 12px;
	padding: 0 1.15em;
	font-size: 0.92rem;
	line-height: 2.55em;
	min-height: 2.55em;
}

#header.transparent .header-bg-color {
	background-color: transparent !important;
}

#header .header-wrapper.stuck .header-main,
.header-wrapper.stuck {
	box-shadow: 0 1px 0 var(--sp-line), 0 10px 30px rgba(97, 39, 9, 0.06);
	-webkit-backdrop-filter: saturate(160%) blur(14px);
	backdrop-filter: saturate(160%) blur(14px);
}

.header-language-dropdown__link .image-icon img,
.nav-dropdown .icon-image img {
	border-radius: 3px;
}

.nav-dropdown {
	border-radius: 14px;
	border: 1px solid var(--sp-line);
	box-shadow: var(--sp-shadow-lg);
}

/* ---- Shared section parts ------------------------------------------------- */

.sp-head {
	margin-bottom: 2.25rem;
}

.sp-head--center {
	text-align: center;
	max-width: 46rem;
	margin-left: auto;
	margin-right: auto;
}

.sp-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	margin: 0 0 0.85rem;
	color: var(--sp-primary);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.sp-eyebrow::before {
	content: "";
	width: 22px;
	height: 2px;
	border-radius: 2px;
	background: linear-gradient(90deg, var(--sp-orange), var(--sp-gold));
}

.sp-eyebrow--light {
	color: var(--sp-gold);
}

.sp-h2,
.banner h2.sp-h2 {
	margin: 0 0 0.55em;
	font-size: clamp(2rem, 1.35rem + 2.2vw, 3rem);
	line-height: 1.08;
	font-weight: 720;
	letter-spacing: -0.032em;
	color: var(--sp-ink);
	text-wrap: balance;
}

.dark .sp-h2,
.sp-h2.is-light {
	color: #fff;
}

.sp-h3 {
	margin: 0 0 0.35em;
	font-size: 1.35rem;
	line-height: 1.25;
	font-weight: 700;
	letter-spacing: -0.02em;
}

.sp-sub {
	margin: 0 auto;
	max-width: 40rem;
	font-size: 1.12rem;
	line-height: 1.65;
	color: var(--sp-text);
	text-wrap: pretty;
}

.dark .sp-sub {
	color: rgba(255, 255, 255, 0.82);
}

.sp-body {
	font-size: 1.06rem;
	line-height: 1.75;
	color: var(--sp-text);
	text-wrap: pretty;
}

.sp-photo .img-inner {
	border-radius: 22px;
	overflow: hidden;
	box-shadow: var(--sp-shadow);
}

.sp-photo .img-inner img {
	transition: transform 1.2s var(--sp-ease);
}

.sp-photo:hover .img-inner img {
	transform: scale(1.04);
}

.sp-checklist {
	list-style: none;
	margin: 1.4rem 0 1.8rem;
	padding: 0;
}

.sp-checklist li {
	margin: 0 0 0.7rem;
	padding-left: 2.1rem;
	min-height: 1.5rem;
	background: url("icons/check-circle.svg") no-repeat 0 0.05em / 1.45rem;
	color: var(--sp-ink);
	font-weight: 550;
}

.sp-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	list-style: none;
	margin: 1.25rem 0 0;
	padding: 0;
}

.sp-chips li {
	margin: 0;
	padding: 0.5rem 0.95rem 0.5rem 2.2rem;
	border: 1px solid var(--sp-line);
	border-radius: 999px;
	background: #fff url("icons/check-circle.svg") no-repeat 0.7rem 50% / 1.15rem;
	color: var(--sp-ink);
	font-size: 0.9rem;
	font-weight: 550;
}

/* ---- Hero ----------------------------------------------------------------- */

.sp-hero .overlay {
	background:
		linear-gradient(90deg, rgba(26, 15, 8, 0.78) 0%, rgba(26, 15, 8, 0.5) 38%, rgba(26, 15, 8, 0.08) 72%),
		linear-gradient(0deg, rgba(26, 15, 8, 0.6) 0%, rgba(26, 15, 8, 0) 42%),
		linear-gradient(180deg, rgba(26, 15, 8, 0.45) 0%, rgba(26, 15, 8, 0) 22%) !important;
}

.sp-hero .banner-bg img.bg,
.sp-hero .video-bg {
	object-position: 62% 50%;
}

.sp-hero .text-inner > :first-child {
	margin-top: 0;
}

.sp-pill {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	margin: 0 0 1.4rem;
	padding: 0.45rem 0.95rem 0.45rem 0.8rem;
	border: 1px solid rgba(255, 255, 255, 0.24);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.12);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	color: #fff;
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	line-height: 1.3;
}

.sp-pill::before {
	content: "";
	flex: none;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--sp-gold);
	box-shadow: 0 0 0 4px rgba(251, 186, 51, 0.25);
}

.sp-display,
.banner h1.sp-display {
	margin: 0 0 0.4em;
	color: #fff;
	font-size: clamp(2.7rem, 1.4rem + 4.3vw, 5rem);
	line-height: 1.02;
	font-weight: 760;
	letter-spacing: -0.042em;
	text-shadow: 0 2px 30px rgba(0, 0, 0, 0.18);
}

.sp-accent {
	background: linear-gradient(92deg, var(--sp-gold) 0%, var(--sp-orange) 70%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	text-shadow: none;
}

.sp-hero .sp-lead,
.sp-page-hero .sp-lead,
.sp-seoul .sp-lead {
	max-width: 33rem;
	margin: 0 0 2rem;
	color: rgba(255, 255, 255, 0.88);
	font-size: clamp(1.05rem, 0.98rem + 0.3vw, 1.22rem);
	line-height: 1.62;
}

.sp-facts {
	display: inline-flex;
	list-style: none;
	margin: 0;
	padding: 0.4rem;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 20px;
	background: rgba(20, 12, 7, 0.28);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	color: #fff;
	text-align: left;
}

.sp-facts li {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0.85rem 1.35rem;
}

.sp-facts li + li {
	border-left: 1px solid rgba(255, 255, 255, 0.16);
}

.sp-facts strong {
	font-size: 1.7rem;
	font-weight: 720;
	letter-spacing: -0.03em;
	line-height: 1.1;
}

.sp-facts span {
	margin-top: 0.2rem;
	color: rgba(255, 255, 255, 0.74);
	font-size: 0.82rem;
	white-space: nowrap;
}

/* ---- How it works (card overlapping the hero) ------------------------------ */

.sp-steps {
	position: relative;
	z-index: 3;
	overflow: visible;
}

.sp-steps__card > .col-inner {
	box-shadow: var(--sp-shadow-lg);
	border: 1px solid rgba(255, 255, 255, 0.8);
}

.sp-steps__card .sp-head {
	margin-bottom: 1.5rem;
}

.sp-steps__card .sp-h2 {
	font-size: clamp(1.75rem, 1.3rem + 1.5vw, 2.35rem);
}

.sp-steps__card .sp-sub {
	font-size: 1.05rem;
}

.sp-steps__row {
	counter-reset: sp-step;
}

.sp-steps__row.row-divided > .col + .col:not(.large-12) {
	border-left-color: var(--sp-line);
}

.sp-step {
	counter-increment: sp-step;
	padding: 0.5rem 0.75rem 0;
}

.sp-step .icon-box-img {
	width: 76px !important;
	margin-bottom: 1.1rem;
}

.sp-step .icon-inner,
.sp-feature .icon-inner {
	padding: 12px;
	border-radius: 20px;
	background: linear-gradient(145deg, #FFF3E4 0%, var(--sp-peach) 100%);
	box-shadow: inset 0 0 0 1px rgba(189, 80, 11, 0.08);
}

.sp-step h5,
.sp-feature h5,
.sp-feature h3 {
	margin-bottom: 0.45em;
	color: var(--sp-ink);
	font-size: 1.18rem;
	font-weight: 700;
	letter-spacing: -0.015em;
	text-transform: none;
}

.sp-step h5::before {
	content: "0" counter(sp-step);
	display: block;
	margin-bottom: 0.45rem;
	color: var(--sp-primary);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.16em;
}

.sp-step p,
.sp-feature p {
	color: var(--sp-text);
	font-size: 0.98rem;
	line-height: 1.65;
}

/* ---- About ---------------------------------------------------------------- */

.sp-about .sp-head {
	margin-bottom: 1.4rem;
}

.sp-about__photos .col:nth-child(2) .sp-photo .img-inner {
	box-shadow: var(--sp-shadow-lg);
}

/* ---- Specialties (image boxes) ------------------------------------------- */

.sp-services__grid > .col {
	padding-bottom: 20px;
}

.sp-services__grid + .row {
	margin-top: 1.25rem;
}

.sp-service.box {
	border-radius: 22px;
	overflow: hidden;
	box-shadow: var(--sp-shadow);
	transition: transform 0.35s var(--sp-ease), box-shadow 0.35s var(--sp-ease);
	isolation: isolate;
}

.sp-service.box:hover {
	transform: translateY(-4px);
	box-shadow: var(--sp-shadow-lg);
}

.sp-service .image-cover img {
	transition: transform 1s var(--sp-ease);
}

.sp-service .shade {
	opacity: 1 !important;
	background: linear-gradient(0deg, rgba(25, 14, 7, 0.88) 0%, rgba(25, 14, 7, 0.55) 38%, rgba(25, 14, 7, 0) 72%) !important;
}

.sp-service .box-image::after {
	content: "";
	position: absolute;
	top: 18px;
	right: 18px;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92) url("icons/arrow-right.svg") no-repeat 50% 50% / 20px;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15);
	transform: translateX(6px);
	opacity: 0;
	transition: opacity 0.3s ease, transform 0.3s var(--sp-ease);
	pointer-events: none;
}

.sp-service:hover .box-image::after {
	opacity: 1;
	transform: none;
}

.sp-service .box-text {
	padding: 26px 26px 24px;
}

.sp-service .box-text-inner p:first-child {
	margin: 0 0 0.85rem;
}

.sp-service__icon {
	display: block;
	width: 46px;
	height: 46px;
	padding: 9px;
	border-radius: 14px;
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

.sp-service h3 {
	margin: 0 0 0.3rem;
	color: #fff;
	font-size: 1.4rem;
	font-weight: 700;
	letter-spacing: -0.02em;
}

.sp-service .box-text-inner > p:last-child {
	margin: 0;
	max-width: 24rem;
	color: rgba(255, 255, 255, 0.84);
	font-size: 0.95rem;
	line-height: 1.55;
}

/* Specialties in rows of four (sp-services__grid--four): the seven specialties and IV Therapy, coming soon.
   From 1100px four cards a row, each the same height whatever its text (the height replaces the image box's
   inline padding-top); below that two a row (four would leave the text no room), on phones one. */
@media (min-width: 850px) and (max-width: 1099px) {
	.sp-services__grid--four > .col {
		flex-basis: 50%;
		max-width: 50%;
	}

	.sp-services__grid--four .sp-service .image-cover {
		padding-top: 58% !important;
	}
}

@media (min-width: 1100px) {
	.sp-services__grid--four .sp-service .image-cover {
		padding-top: 97.6% !important;
	}

	.sp-services__grid--four .sp-service .box-text {
		padding: 22px 20px 20px;
	}

	.sp-services__grid--four .sp-service h3 {
		font-size: 1.25rem;
	}

	.sp-services__grid--four .sp-service .box-text-inner > p:last-child {
		font-size: 0.9rem;
	}
}

/* A specialty that is coming: no link, so it does not lift, zoom, tilt or show the arrow. */
.sp-service--soon {
	cursor: default;
}

.sp-service--soon.box:hover {
	transform: none;
	box-shadow: var(--sp-shadow);
}

.sp-service--soon .box-image::after {
	display: none;
}

.sp-service .box-text-inner .sp-soon {
	display: inline-block;
	margin: 0 0 0.5rem;
	padding: 0.22rem 0.65rem;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.94);
	color: var(--sp-primary-dark);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.3;
	text-transform: uppercase;
}

/* ---- Check-up tiers ------------------------------------------------------- */

.sp-checkup .sp-head {
	margin-bottom: 0;
}

.sp-checkup .sp-body {
	margin-bottom: 0;
}

.sp-tiers {
	margin-top: 3rem;
}

.sp-tiers > .col {
	padding-bottom: 24px;
}

.sp-tier.pricing-table {
	height: 100%;
	display: flex;
	flex-direction: column;
	padding: 34px 30px 30px;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius-lg);
	background: #fff;
	box-shadow: var(--sp-shadow);
	text-align: left;
	transition: transform 0.35s var(--sp-ease), box-shadow 0.35s var(--sp-ease);
}

/* Flatsome centres ".text-center > div" with auto margins, which shrinks flex children. */
.sp-tier.pricing-table > div {
	width: 100%;
	margin-left: 0;
	margin-right: 0;
}

.pricing-table-wrapper:has(.sp-tier),
.sp-tiers > .col > .col-inner,
.sp-why__grid > .col > .col-inner {
	height: 100%;
}

.sp-tier.pricing-table:hover {
	transform: translateY(-4px);
	box-shadow: var(--sp-shadow-lg);
}

.sp-tier.pricing-table .pricing-table-header {
	padding: 0 0 1.4rem;
	border-bottom: 1px solid var(--sp-line);
	background: none;
}

.sp-tier.pricing-table .title {
	margin-bottom: 1rem;
	padding: 0;
	border: 0;
	background: none;
	color: var(--sp-ink);
	font-size: 1.12rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	text-transform: none;
}

.sp-tier .title::before {
	content: "";
	display: block;
	width: 44px;
	height: 44px;
	margin-bottom: 1rem;
	border-radius: 14px;
	background: var(--sp-peach) url("icons/heartbeat.svg") no-repeat 50% 50% / 24px;
}

.sp-tiers > .col:nth-child(2) .sp-tier .title::before {
	background-image: url("icons/medal.svg");
}

.sp-tiers > .col:nth-child(3) .sp-tier .title::before {
	background-image: url("icons/crown-simple.svg");
}

.sp-tier.pricing-table .price {
	padding: 0;
	color: var(--sp-ink);
	font-size: 2.5rem;
	font-weight: 750;
	letter-spacing: -0.04em;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

.sp-tier.pricing-table .description {
	padding: 0;
	margin-top: 0.55rem;
	color: var(--sp-muted);
	font-size: 0.9rem;
	opacity: 1;
}

.sp-tier.pricing-table .pricing-table-items {
	flex: 1;
	padding: 1.1rem 0 0.4rem;
}

.sp-tier.pricing-table .items > .bullet-item {
	position: relative;
	padding: 0.5rem 0 0.5rem 1.9rem;
	border: 0;
	color: var(--sp-ink);
	font-size: 0.96rem;
	text-align: left;
}

.sp-tier .bullet-item::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.62rem;
	width: 1.2rem;
	height: 1.2rem;
	background: url("icons/check-circle.svg") no-repeat 0 0 / contain;
}

.sp-tier.pricing-table .cta-button {
	padding: 1rem 0 0;
}

.sp-tier .cta-button .button {
	width: 100%;
	margin: 0;
	border-radius: 12px;
	border: 1.5px solid rgba(43, 33, 28, 0.2);
	color: var(--sp-ink);
	background: transparent;
}

.sp-tier .cta-button .button:hover {
	background: var(--sp-ink);
	border-color: var(--sp-ink);
	color: #fff;
	box-shadow: none;
}

.sp-tier--featured.pricing-table {
	background: var(--sp-night);
	border-color: var(--sp-night);
	box-shadow: 0 30px 70px rgba(33, 24, 19, 0.28);
}

.sp-tier--featured.pricing-table .title,
.sp-tier--featured.pricing-table .price,
.sp-tier--featured.pricing-table .items > .bullet-item {
	color: #fff;
}

.sp-tier--featured.pricing-table .description {
	color: rgba(255, 255, 255, 0.62);
}

.sp-tier--featured.pricing-table .pricing-table-header {
	border-color: rgba(255, 255, 255, 0.12);
}

.sp-tier--featured.pricing-table .title::before {
	background-color: rgba(255, 237, 213, 0.95);
}

.sp-tier--featured .cta-button .button {
	border-color: var(--sp-primary);
	background: var(--sp-primary);
	color: #fff;
}

.sp-tier--featured .cta-button .button:hover {
	border-color: #fff;
	background: #fff;
	color: var(--sp-ink);
}

/* Four levels side by side: a little tighter than three. VVIP is the dark card with the gold badge. */
.sp-tiers > .col {
	padding-top: 14px;
}

.sp-tiers > .col .sp-tier.pricing-table {
	padding: 30px 26px 26px;
}

.sp-tiers > .col:nth-child(4) .sp-tier .title::before {
	background-image: url("icons/diamond.svg");
}

.sp-tier__badge {
	position: absolute;
	top: -13px;
	left: 50%;
	z-index: 3;
	margin: 0;
	padding: 0.28rem 0.9rem;
	border-radius: 999px;
	background: var(--sp-gold);
	box-shadow: 0 6px 16px rgba(33, 24, 19, 0.25);
	color: #3A2A20;
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	line-height: 1.3;
	text-transform: uppercase;
	white-space: nowrap;
	transform: translateX(-50%);
}

.sp-tier--vvip.pricing-table {
	background:
		radial-gradient(90% 55% at 100% 0%, rgba(251, 186, 51, 0.24) 0%, rgba(251, 186, 51, 0) 60%),
		linear-gradient(160deg, #2B211C 0%, #3A2A20 60%, #4A3020 100%);
	border-color: rgba(251, 186, 51, 0.6);
}

.sp-tier--vvip.pricing-table .price {
	color: var(--sp-gold);
}

.sp-tier--vvip .cta-button .button {
	border-color: var(--sp-gold);
	background: var(--sp-gold);
	color: #3A2A20;
}

.sp-tier--vvip .cta-button .button:hover {
	border-color: #fff;
	background: #fff;
	color: var(--sp-ink);
}

.sp-tier--vvip .bullet-item::before {
	filter: brightness(1.15);
}

/* Live offers (salpim-showcase cards) */

.sp-live {
	margin-top: 2.5rem;
}

.sp-live__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.25rem 1.5rem;
	padding-top: 2.4rem;
	border-top: 1px solid var(--sp-line);
}

.sp-live__head p {
	margin: 0;
	color: var(--sp-muted);
	font-size: 0.92rem;
}

.sp-live .salpim-showcase {
	margin-block: 1.5rem 0;
}

.sp-live .salpim-card {
	position: relative;
	border: 1px solid var(--sp-line);
	border-radius: 20px;
	background: #fff;
	box-shadow: var(--sp-shadow);
	transition: transform 0.35s var(--sp-ease), box-shadow 0.35s var(--sp-ease);
}

.sp-live .salpim-card:hover {
	transform: translateY(-3px);
	box-shadow: var(--sp-shadow-lg);
}

.sp-live .salpim-card__media--empty {
	display: none;
}

/* A list that mixes clinics with and without photos keeps one rhythm: a card without a photo gets a quiet
   panel of the same size (the Salpim mark on cream) instead of starting straight with its text. */
.sp-live .salpim-showcase__grid:has(.salpim-card__media:not(.salpim-card__media--empty)) .salpim-card__media--empty {
	display: block;
	background:
		url("brand/salpim-mark.svg") no-repeat 50% 50% / 52px auto,
		radial-gradient(110% 120% at 100% 0%, rgba(251, 186, 51, 0.2) 0%, rgba(251, 186, 51, 0) 60%),
		var(--sp-cream);
}

.sp-live .salpim-card__body {
	gap: 0.3rem;
	padding: 1.5rem 1.35rem 1.4rem;
}

.sp-live .salpim-card__eyebrow {
	align-self: flex-start;
	margin-bottom: 0.4rem !important;
	padding: 0.25rem 0.6rem;
	border-radius: 999px;
	background: var(--sp-peach);
	color: var(--sp-primary-dark);
	font-size: 0.72rem;
	font-weight: 650;
	line-height: 1.35;
	opacity: 1;
}

.sp-live .salpim-card__title {
	color: var(--sp-ink);
	font-size: 1.3rem;
	font-weight: 700;
	letter-spacing: -0.02em;
}

.sp-live .salpim-card__title a:hover {
	color: var(--sp-primary);
	text-decoration: none;
}

.sp-live .salpim-card__provider {
	color: var(--sp-text);
	font-weight: 550;
	opacity: 1;
}

.sp-live .salpim-card__provider::before {
	content: "";
	display: inline-block;
	width: 1rem;
	height: 1rem;
	margin-right: 0.4rem;
	vertical-align: -0.15em;
	background: url("icons/seal-check.svg") no-repeat 0 0 / contain;
}

.sp-live .salpim-card__meta,
.sp-live .salpim-card__note {
	color: var(--sp-muted);
	opacity: 1;
}

/* An offer card reads: what it is, the conditions, then the price and the button at the bottom. The price and the
   button of every card in a row line up (the conditions fill the space between), so prices can be compared by eye. */
.sp-live .salpim-card__body:has(> .salpim-card__price) > .salpim-card__note {
	order: 1;
}

.sp-live .salpim-card__price {
	order: 2;
	margin-top: auto;
	padding-top: 0.6rem;
	color: var(--sp-ink);
	font-size: 1.5rem;
	font-weight: 750;
	letter-spacing: -0.03em;
	font-variant-numeric: tabular-nums;
}

.sp-live .salpim-card__vat {
	display: block;
	margin-top: 0.15rem;
	color: var(--sp-muted);
	font-size: 0.78rem;
	font-weight: 500;
	letter-spacing: 0;
	opacity: 1;
}

.sp-live .salpim-card__cta {
	order: 3;
	align-self: stretch;
	margin-top: auto !important;
	padding: 0.7rem 1rem;
	border-radius: 12px;
	background: var(--sp-primary);
	color: #fff;
	font-size: 0.95rem;
	font-weight: 600;
	text-align: center;
}

.sp-live .salpim-card__cta:hover {
	background: var(--sp-primary-dark);
	color: #fff;
}

/* After a price the button sits one step below it; without a price it goes to the bottom on its own. */
.sp-live .salpim-card__body:has(> .salpim-card__price) > .salpim-card__cta {
	margin-top: 1rem !important;
}

.sp-live .salpim-card__body > :has(+ .salpim-card__cta) {
	margin-block-end: 0;
}

.sp-live .salpim-card__body:not(:has(> .salpim-card__price)) > :has(+ .salpim-card__cta) {
	margin-block-end: 1rem;
}

/* ---- Why Salpim ----------------------------------------------------------- */

.sp-why-head .sp-head {
	margin-bottom: 0;
}

.sp-why-head .section-bg-overlay,
.sp-why-head .section-bg .overlay {
	background: linear-gradient(180deg, rgba(36, 20, 10, 0.55) 0%, rgba(36, 20, 10, 0.78) 100%) !important;
}

.sp-why {
	position: relative;
	z-index: 2;
}

.sp-why__grid {
	margin-top: -150px !important;
}

.sp-why__grid > .col {
	padding-bottom: 24px;
}

.sp-feature.icon-box {
	height: 100%;
	padding: 30px 28px;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius-lg);
	background: #fff;
	box-shadow: var(--sp-shadow);
	transition: transform 0.35s var(--sp-ease), box-shadow 0.35s var(--sp-ease);
}

.sp-feature.icon-box:hover {
	transform: translateY(-4px);
	box-shadow: var(--sp-shadow-lg);
}

.sp-feature .icon-box-img {
	width: 60px !important;
	margin-bottom: 1.15rem;
}

.sp-feature .icon-inner {
	padding: 10px;
	border-radius: 16px;
}

.sp-why-head {
	padding-bottom: 210px !important;
}

/* ---- Team ----------------------------------------------------------------- */

.sp-team .sp-head {
	margin-bottom: 1.2rem;
}

.sp-team__photos .col {
	padding-bottom: 14px;
}

/* ---- Seoul banner, FAQ ---------------------------------------------------- */

.sp-seoul h2.sp-h2 {
	color: #fff;
	font-size: clamp(2.2rem, 1.4rem + 2.8vw, 3.6rem);
}

.sp-seoul .sp-lead {
	margin: 0 auto;
	max-width: 36rem;
}

.sp-seoul .text-inner .sp-eyebrow {
	justify-content: center;
}

.sp-faq {
	position: relative;
	z-index: 2;
	overflow: visible;
}

.sp-faq__card > .col-inner {
	box-shadow: var(--sp-shadow-lg);
	border: 1px solid rgba(255, 255, 255, 0.9);
}

.sp-faq__card .sp-head {
	margin-bottom: 1.5rem;
}

.sp-accordion .accordion-item {
	border-bottom: 1px solid var(--sp-line);
}

.sp-accordion .accordion-item:last-child {
	border-bottom: 0;
}

.sp-accordion .accordion-title {
	display: flex;
	align-items: center;
	flex-direction: row-reverse;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.25rem 0;
	border: 0;
	color: var(--sp-ink);
	font-size: 1.08rem;
	font-weight: 650;
	letter-spacing: -0.01em;
	transition: color 0.2s ease;
}

.sp-accordion .accordion-title:hover,
.sp-accordion .accordion-title.active {
	color: var(--sp-primary);
}

.sp-accordion .accordion-title .toggle {
	position: static;
	flex: none;
	width: 34px;
	height: 34px;
	margin: 0;
	border-radius: 50%;
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--sp-line);
	color: var(--sp-primary);
	opacity: 1;
	transition: transform 0.3s var(--sp-ease), background-color 0.2s ease;
}

.sp-accordion .accordion-title.active .toggle {
	background: var(--sp-primary);
	color: #fff;
}

.sp-accordion .accordion-inner {
	padding: 0 3.5rem 1.4rem 0;
	color: var(--sp-text);
	font-size: 1rem;
	line-height: 1.7;
}

/* ---- Final call to action -------------------------------------------------- */

.sp-cta__card > .col-inner {
	overflow: hidden;
	position: relative;
	background:
		radial-gradient(120% 140% at 100% 0%, rgba(251, 186, 51, 0.45) 0%, rgba(251, 186, 51, 0) 50%),
		linear-gradient(120deg, #8F3A06 0%, #BD500B 48%, #D96A12 100%);
	box-shadow: 0 30px 80px rgba(143, 58, 6, 0.3);
	color: #fff;
}

.sp-cta__card > .col-inner::after {
	content: "";
	position: absolute;
	right: -60px;
	bottom: -120px;
	width: 360px;
	height: 360px;
	border-radius: 50%;
	border: 60px solid rgba(255, 255, 255, 0.06);
	pointer-events: none;
}

.sp-cta__card .sp-h2 {
	color: #fff;
}

.sp-cta__card .sp-lead {
	max-width: 32rem;
	margin: 0;
	color: rgba(255, 255, 255, 0.86);
	font-size: 1.12rem;
	line-height: 1.65;
}

.sp-cta__icon {
	display: block;
	width: 64px;
	height: 64px;
	margin-bottom: 1.2rem;
	padding: 6px;
	border-radius: 20px;
	background: #fff;
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.14);
}

.sp-cta__actions .col-inner {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0.75rem;
}

.sp-cta__actions .button {
	margin: 0;
	width: 100%;
}

/* Flatsome's ".white" helper sets colour and background with !important. */
.button.white.sp-btn--light,
.button.white.sp-btn--light:visited {
	background: #fff;
	color: var(--sp-primary-dark) !important;
	box-shadow: 0 10px 26px rgba(0, 0, 0, 0.16);
}

.button.white.sp-btn--light:hover {
	background-color: var(--sp-cream) !important;
	color: var(--sp-primary-dark);
	transform: translateY(-1px);
}

.sp-btn--ghost-light.is-outline {
	border: 1.5px solid rgba(255, 255, 255, 0.5);
	color: #fff;
}

.sp-btn--ghost-light.is-outline:hover {
	background: rgba(255, 255, 255, 0.12);
	border-color: #fff;
	color: #fff;
	box-shadow: none;
}

/* ---- Footer --------------------------------------------------------------- */

.sp-footer {
	color: rgba(255, 255, 255, 0.68);
	font-size: 0.95rem;
}

.sp-footer__logo {
	display: block;
	width: 148px;
	height: auto;
	margin-bottom: 1.2rem;
}

.sp-footer__about {
	max-width: 22rem;
	line-height: 1.7;
}

.sp-footer__title {
	margin-bottom: 1rem;
	color: #fff !important;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.sp-footer__links {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sp-footer__links li {
	margin: 0 0 0.65rem;
	margin-left: 0 !important;
}

.sp-footer a {
	color: rgba(255, 255, 255, 0.82);
}

.sp-footer a:hover {
	color: var(--sp-gold);
}

.sp-footer.dark .sp-footer__about,
.sp-footer.dark .sp-footer__contact {
	color: rgba(255, 255, 255, 0.72);
}

.sp-footer__legal,
.sp-footer.dark .sp-footer__legal {
	color: rgba(255, 255, 255, 0.5);
	font-size: 0.85rem;
	line-height: 1.7;
}

.absolute-footer {
	border-top: 1px solid rgba(255, 255, 255, 0.07);
	color: rgba(255, 255, 255, 0.5);
	font-size: 0.85rem;
}

.absolute-footer.dark {
	color: rgba(255, 255, 255, 0.5);
}

.back-to-top {
	border-radius: 14px !important;
}

/* ---- Tablet and phone ------------------------------------------------------ */

@media (max-width: 849px) {
	.sp-hero .overlay {
		background:
			linear-gradient(0deg, rgba(26, 15, 8, 0.85) 0%, rgba(26, 15, 8, 0.45) 55%, rgba(26, 15, 8, 0.25) 100%) !important;
	}

	.sp-steps__row.row-divided > .col + .col:not(.large-12) {
		border-left: 0;
		border-top: 1px solid var(--sp-line);
		padding-top: 1.5rem;
	}

	.sp-head {
		margin-bottom: 1.75rem;
	}

	.sp-checkup .sp-head {
		margin-bottom: 1rem;
	}

	.sp-tiers {
		margin-top: 2rem;
	}

	.sp-why__grid {
		margin-top: -120px !important;
	}

	.sp-why-head {
		padding-bottom: 160px !important;
	}

	.sp-cta__actions .col-inner {
		margin-top: 1.5rem;
	}
}

@media (max-width: 549px) {
	/* Patient photo galleries: one swipeable row on phones instead of a long grid (the next photo peeks in). */
	.row.sp-gallery {
		display: flex !important;
		flex-wrap: nowrap;
		align-items: flex-start;
		height: auto !important;
		margin-right: -20px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.row.sp-gallery::-webkit-scrollbar {
		display: none;
	}

	.row.sp-gallery > .gallery-col {
		position: static !important;
		flex: 0 0 72%;
		max-width: 72%;
		transform: none !important;
		scroll-snap-align: start;
	}

	/* A 20px side margin for the text of every section on phones (Flatsome's columns give 15px). */
	.section-content > .row:not(.row-collapse) > .col {
		padding-left: 20px;
		padding-right: 20px;
	}

	.sp-display {
		font-size: 2.6rem;
	}

	.sp-pill {
		font-size: 0.78rem;
	}

	.sp-hero .sp-btn,
	.sp-page-hero .sp-btn {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0.35em;
		width: 100%;
		margin-right: 0;
	}

	.sp-hero .sp-btn i,
	.sp-page-hero .sp-btn i {
		top: 0;
	}

	.sp-step,
	.sp-step.text-center {
		padding: 0;
	}

	.sp-service .box-text {
		padding: 22px 20px 20px;
	}

	.sp-tier.pricing-table,
	.sp-feature.icon-box {
		padding: 26px 22px;
	}

	.sp-accordion .accordion-inner {
		padding-right: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}

/* Flatsome lifts the featured price table with a negative margin; the dark colour is emphasis enough. */
.sp-tier--featured.featured-table {
	margin-top: 0;
	border-width: 1px;
}

.sp-tier--featured.featured-table .title {
	background: none;
}

/* ==== Motion ================================================================ */

/* Hero copy arrives line by line; the header fades in. */
@media (prefers-reduced-motion: no-preference) {
	.sp-hero .text-inner > * {
		animation: sp-rise 0.95s var(--sp-ease) both;
	}

	.sp-hero .text-inner > :nth-child(1) { animation-delay: 0.15s; }
	.sp-hero .text-inner > :nth-child(2) { animation-delay: 0.3s; }
	.sp-hero .text-inner > :nth-child(3) { animation-delay: 0.48s; }
	.sp-hero .text-inner > :nth-child(4) { animation-delay: 0.64s; }
	.sp-hero .text-inner > :nth-child(5) { animation-delay: 0.74s; }

	.sp-hero__facts .sp-facts {
		animation: sp-rise 1s var(--sp-ease) 0.95s both;
	}

	.sp-page-hero .text-inner > * {
		animation: sp-rise 0.9s var(--sp-ease) both;
	}

	.sp-page-hero .text-inner > :nth-child(2) { animation-delay: 0.12s; }
	.sp-page-hero .text-inner > :nth-child(3) { animation-delay: 0.24s; }
	.sp-page-hero .text-inner > :nth-child(4) { animation-delay: 0.36s; }
	.sp-page-hero .text-inner > :nth-child(5) { animation-delay: 0.46s; }
}

@keyframes sp-rise {
	from {
		opacity: 0;
		transform: translateY(18px);
		filter: blur(6px);
	}

	to {
		opacity: 1;
		transform: none;
		filter: none;
	}
}

/* Flatsome's scroll reveal ("Animate" option): softer timing, and columns in a row arrive one after another. */
[data-animated="true"] {
	transition: transform 1s var(--sp-ease), opacity 0.8s ease, filter 1s ease !important;
}

.sp-stagger > .col:nth-child(2) [data-animated="true"],
.sp-stagger > .col:nth-child(2)[data-animated="true"] { transition-delay: 0.08s !important; }
.sp-stagger > .col:nth-child(3) [data-animated="true"],
.sp-stagger > .col:nth-child(3)[data-animated="true"] { transition-delay: 0.16s !important; }
.sp-stagger > .col:nth-child(4) [data-animated="true"],
.sp-stagger > .col:nth-child(4)[data-animated="true"] { transition-delay: 0.24s !important; }
.sp-stagger > .col:nth-child(5) [data-animated="true"],
.sp-stagger > .col:nth-child(5)[data-animated="true"] { transition-delay: 0.32s !important; }
.sp-stagger > .col:nth-child(6) [data-animated="true"],
.sp-stagger > .col:nth-child(6)[data-animated="true"] { transition-delay: 0.4s !important; }
.sp-stagger > .col:nth-child(7) [data-animated="true"],
.sp-stagger > .col:nth-child(7)[data-animated="true"] { transition-delay: 0.48s !important; }
.sp-stagger > .col:nth-child(8) [data-animated="true"],
.sp-stagger > .col:nth-child(8)[data-animated="true"] { transition-delay: 0.56s !important; }

/* sp-tilt: leans towards the pointer, with a soft glare. */
.sp-tilt.is-tilt-ready {
	transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
	transition: transform 0.5s var(--sp-ease), box-shadow 0.35s var(--sp-ease);
	will-change: transform;
}

.sp-tilt.is-tilt-ready.is-tilting {
	transition: transform 0.12s linear, box-shadow 0.35s var(--sp-ease);
}

.sp-service.box.sp-tilt.is-tilt-ready:hover {
	transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(-4px);
}

.sp-tilt::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 3;
	border-radius: inherit;
	background: radial-gradient(circle at var(--gx, 50%) var(--gy, 50%), rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0) 55%);
	opacity: 0;
	transition: opacity 0.3s ease;
	pointer-events: none;
}

.sp-tilt.is-tilting::after {
	opacity: 1;
}

/* sp-spotlight: a light that follows the pointer over a dark or coloured card. */
.sp-spotlight > .col-inner {
	position: relative;
}

.sp-spotlight > .col-inner::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	border-radius: inherit;
	background: radial-gradient(420px circle at var(--mx, 75%) var(--my, 20%), rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0) 60%);
	pointer-events: none;
}

.sp-spotlight > .col-inner > * {
	position: relative;
	z-index: 1;
}

/* ==== Interactive elements ================================================== */

/* ---- Counter ---- */

.sp-counter {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}

.sp-counter__figure {
	color: var(--sp-ink);
	font-size: clamp(2.4rem, 1.6rem + 2.4vw, 3.5rem);
	font-weight: 760;
	letter-spacing: -0.045em;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

.sp-counter__affix {
	color: var(--sp-primary);
}

.sp-counter__label {
	color: var(--sp-text);
	font-size: 0.95rem;
	line-height: 1.4;
}

.dark .sp-counter__figure {
	color: #fff;
}

.dark .sp-counter__affix {
	color: var(--sp-gold);
}

.dark .sp-counter__label {
	color: rgba(255, 255, 255, 0.74);
}

/* ---- Journey line ---- */

.sp-journey {
	--p: 0;
	position: relative;
}

.sp-journey__track {
	position: relative;
	aspect-ratio: 6 / 1;
	margin: 0 0 1.25rem;
}

.sp-journey__svg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow: visible;
}

.sp-journey__base {
	fill: none;
	stroke: rgba(189, 80, 11, 0.22);
	stroke-width: 2.5;
	stroke-dasharray: 1 11;
	stroke-linecap: round;
}

.sp-journey__line {
	fill: none;
	stroke: var(--sp-primary);
	stroke-width: 3.5;
	stroke-linecap: round;
}

.sp-journey:not(.is-ready) .sp-journey__line {
	stroke-dasharray: none;
}

.sp-journey__dot {
	position: absolute;
	top: 50%;
	width: 18px;
	height: 18px;
	border: 3px solid #fff;
	border-radius: 50%;
	background: #E9D8C8;
	box-shadow: 0 0 0 1px var(--sp-line), 0 4px 10px rgba(97, 39, 9, 0.12);
	transform: translate(-50%, -50%) scale(0.85);
	transition: background-color 0.4s ease, transform 0.5s var(--sp-ease), box-shadow 0.4s ease;
}

.sp-journey__dot.is-reached,
.sp-journey:not(.is-ready) .sp-journey__dot {
	background: var(--sp-primary);
	box-shadow: 0 0 0 6px rgba(189, 80, 11, 0.14), 0 6px 14px rgba(189, 80, 11, 0.3);
	transform: translate(-50%, -50%) scale(1);
}

.sp-journey__plane {
	position: absolute;
	left: 0;
	top: 50%;
	width: 34px;
	height: 34px;
	color: var(--sp-primary);
	opacity: 0;
	transition: opacity 0.3s ease;
	pointer-events: none;
	filter: drop-shadow(0 6px 10px rgba(189, 80, 11, 0.3));
}

.sp-journey__plane svg {
	display: block;
	width: 100%;
	height: 100%;
}

.sp-journey__steps {
	display: grid;
	grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr));
	gap: 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sp-journey__step {
	margin: 0;
	padding: 0 0.5rem;
	text-align: center;
	transform: translateY(10px);
	transition: transform 0.7s var(--sp-ease);
}

.sp-journey__step.is-reached,
.sp-journey:not(.is-ready) .sp-journey__step {
	transform: none;
}

/* Until the plane reaches a step only its icon is dimmed, so the text keeps its contrast. */
.sp-journey__step .sp-journey__icon {
	opacity: 0.4;
	filter: saturate(0.3);
	transition: opacity 0.6s ease, filter 0.6s ease;
}

.sp-journey__step.is-reached .sp-journey__icon,
.sp-journey:not(.is-ready) .sp-journey__step .sp-journey__icon {
	opacity: 1;
	filter: none;
}

.sp-journey__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 68px;
	height: 68px;
	margin-bottom: 0.9rem;
	border-radius: 20px;
	background: linear-gradient(145deg, #FFF3E4 0%, var(--sp-peach) 100%);
	box-shadow: inset 0 0 0 1px rgba(189, 80, 11, 0.08);
}

.sp-journey__icon img {
	width: 40px;
	height: 40px;
}

.sp-journey__label {
	display: block;
	margin-bottom: 0.35rem;
	color: var(--sp-primary);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.sp-journey__title {
	margin: 0 0 0.45rem;
	color: var(--sp-ink);
	font-size: 1.18rem;
	font-weight: 700;
	letter-spacing: -0.015em;
}

.sp-journey__text p {
	margin: 0 auto;
	max-width: 22rem;
	color: var(--sp-text);
	font-size: 0.98rem;
	line-height: 1.65;
}

/* ---- Body map ---- */

.sp-bodymap {
	--mx: 50%;
	--my: 40%;
}

.sp-bodymap__levels {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.4rem;
	margin: 0 auto 1.75rem;
	padding: 0.35rem;
	width: fit-content;
	max-width: 100%;
	border: 1px solid var(--sp-line);
	border-radius: 18px;
	background: #fff;
	box-shadow: var(--sp-shadow);
}

.sp-bodymap__level {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.05rem;
	margin: 0;
	padding: 0.55rem 1.1rem;
	min-height: 0;
	border: 0;
	border-radius: 14px;
	background: transparent;
	color: var(--sp-ink);
	font: inherit;
	line-height: 1.2;
	text-transform: none;
	letter-spacing: 0;
	cursor: pointer;
	transition: background-color 0.25s ease, color 0.25s ease;
}

.sp-bodymap__level span {
	font-size: 0.95rem;
	font-weight: 650;
}

.sp-bodymap__level small {
	color: var(--sp-muted);
	font-size: 0.75rem;
	font-weight: 500;
}

.sp-bodymap__level:hover {
	background: var(--sp-cream);
}

.sp-bodymap__level[aria-pressed="true"] {
	background: var(--sp-ink);
	color: #fff;
}

.sp-bodymap__level[aria-pressed="true"] small {
	color: rgba(255, 255, 255, 0.7);
}

.sp-bodymap__level.is-baseline[aria-pressed="true"] {
	background: #7A6456;
}

/* VVIP: the most complete level, in the gold of its card and table column */
.sp-bodymap__level.is-vvip {
	background: linear-gradient(135deg, #FFF4D6 0%, #FDE6A8 100%);
	box-shadow: inset 0 0 0 1px rgba(224, 160, 20, 0.55);
}

.sp-bodymap__level.is-vvip span {
	color: #6B4700;
}

.sp-bodymap__level.is-vvip small {
	color: #8C5E00;
}

.sp-bodymap__level.is-vvip:hover {
	background: linear-gradient(135deg, #FFEFC4 0%, #FBDC8C 100%);
}

.sp-bodymap__level.is-vvip[aria-pressed="true"] {
	background: linear-gradient(135deg, #2B211C 0%, #4A3020 100%);
	box-shadow: inset 0 0 0 1px rgba(251, 186, 51, 0.7);
}

.sp-bodymap__level.is-vvip[aria-pressed="true"] span {
	color: var(--sp-gold);
}

.sp-bodymap__level.is-vvip[aria-pressed="true"] small {
	color: rgba(255, 255, 255, 0.72);
}

.sp-bodymap__stage {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	align-items: center;
	gap: 2.5rem;
}

.sp-bodymap__figure {
	position: relative;
	padding: 1.25rem 1rem;
	border-radius: 28px;
	background:
		radial-gradient(260px circle at var(--mx) var(--my), rgba(251, 186, 51, 0.22), rgba(251, 186, 51, 0) 70%),
		linear-gradient(180deg, #FFFDFB 0%, var(--sp-cream) 100%);
	box-shadow: inset 0 0 0 1px var(--sp-line);
}

.sp-bodymap__svg {
	display: block;
	width: auto;
	max-width: 100%;
	/* The level buttons and the whole figure fit in one screen: the figure follows the viewport height. */
	height: clamp(300px, calc(100svh - 250px), 540px);
	margin: 0 auto;
	overflow: visible;
}

.sp-bodymap__svg .sp-skin {
	fill: url(#sp-skin);
	stroke: #E4CFBC;
	stroke-width: 1;
}

.sp-bodymap__svg .sp-floor {
	fill: url(#sp-floor);
}

.sp-bodymap__svg .sp-skin-detail {
	fill: none;
	stroke: #E6D3C1;
	stroke-width: 1.1;
	stroke-linecap: round;
}

.sp-zone {
	cursor: pointer;
	outline: none;
}

.sp-organ {
	fill: url(#sp-organ-out);
	stroke: #FFFBF7;
	stroke-width: 1;
	stroke-linejoin: round;
	transition: fill 0.45s ease, stroke 0.45s ease, opacity 0.45s ease;
}

.sp-organ--deep {
	fill: url(#sp-organ-out-deep);
}

.sp-organ--soft {
	fill: url(#sp-organ-out-soft);
}

.sp-organ--line {
	fill: none;
	stroke: #D5C2B0;
	stroke-width: 1.4;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.sp-organ--thin {
	stroke-width: 1;
}

.sp-organ--guide {
	stroke-width: 0.9;
	stroke-dasharray: 2 3;
}

.sp-organ--tube {
	fill: none;
	stroke: #E3D3C4;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.sp-organ--ring {
	fill: rgba(255, 255, 255, 0.28);
	stroke: #D5C2B0;
	stroke-width: 1.3;
	stroke-dasharray: 2.5 3;
}

.sp-organ--dot {
	fill: #D5C2B0;
	stroke: none;
}

.sp-organ-detail {
	fill: none;
	stroke: rgba(255, 255, 255, 0.72);
	stroke-width: 1;
	stroke-linecap: round;
	pointer-events: none;
}

.sp-organ-iris {
	fill: #CDB7A3;
	pointer-events: none;
	transition: fill 0.45s ease;
}

.sp-zone.is-in .sp-organ {
	fill: url(#sp-organ-in);
}

.sp-zone.is-in .sp-organ--deep {
	fill: url(#sp-organ-in-deep);
}

.sp-zone.is-in .sp-organ--soft {
	fill: url(#sp-organ-in-soft);
}

.sp-zone.is-in .sp-organ--line {
	fill: none;
	stroke: var(--sp-primary);
}

.sp-zone.is-in .sp-organ--tube {
	fill: none;
	stroke: #E57B1E;
}

.sp-zone.is-in .sp-organ--ring {
	fill: rgba(247, 148, 29, 0.14);
	stroke: var(--sp-orange);
	stroke-dasharray: none;
}

.sp-zone.is-in .sp-organ--dot,
.sp-zone.is-in .sp-organ-iris {
	fill: var(--sp-primary-dark);
}

.sp-zone.is-opt .sp-organ {
	fill: url(#sp-organ-opt);
	stroke: #E8A23A;
	stroke-dasharray: 3 2.4;
}

.sp-zone.is-opt .sp-organ--line {
	fill: none;
	stroke: var(--sp-amber);
	stroke-dasharray: 4 4;
}

.sp-zone.is-opt .sp-organ--tube {
	fill: none;
	stroke: #F8D597;
	stroke-dasharray: none;
}

.sp-zone.is-opt .sp-organ--ring {
	fill: rgba(251, 186, 51, 0.12);
	stroke: var(--sp-amber);
}

.sp-zone.is-opt .sp-organ--dot,
.sp-zone.is-opt .sp-organ-iris {
	fill: var(--sp-amber);
}

.sp-zone.is-opt .sp-organ-detail {
	stroke: rgba(205, 134, 20, 0.4);
}

.sp-zone.is-out .sp-organ {
	opacity: 0.9;
}

.sp-organ--bone {
	fill: #FBF6F1;
	stroke: #DCCAB9;
}

.sp-zone.is-in .sp-organ--bone {
	fill: #FDE6CE;
	stroke: #E07A1F;
}

.sp-zone.is-opt .sp-organ--bone {
	fill: #FFF7E9;
	stroke: var(--sp-amber);
	stroke-dasharray: 2.4 2;
}

.sp-zone__organs.is-selected {
	filter: url(#sp-glow);
}

.sp-zone.is-selected .sp-organ:not(.sp-organ--line):not(.sp-organ--tube):not(.sp-organ--dot) {
	stroke: var(--sp-ink);
	stroke-width: 1.3;
	stroke-dasharray: none;
}

.is-scanning .sp-organ,
.is-scanning .sp-hotspot {
	transition-delay: calc(var(--y, 0) * 1.5ms);
}

.sp-hotspot {
	fill: #fff;
	stroke: #C9B19C;
	stroke-width: 1.6;
	transition: fill 0.4s ease, stroke 0.4s ease;
}

.sp-zone.is-in .sp-hotspot {
	fill: var(--sp-primary);
	stroke: #fff;
	stroke-width: 2;
}

.sp-zone.is-opt .sp-hotspot {
	fill: var(--sp-amber);
	stroke: #fff;
	stroke-width: 2;
}

.sp-hotspot__ring {
	fill: none;
	stroke: var(--sp-primary);
	stroke-width: 1.5;
	opacity: 0;
	transform-box: fill-box;
	transform-origin: center;
}

.sp-zone.is-selected .sp-hotspot__ring {
	animation: sp-pulse 2.2s ease-out infinite;
}

.sp-zone:focus-visible .sp-hotspot {
	stroke: var(--sp-ink);
	stroke-width: 3;
}

.sp-body__scan {
	opacity: 0;
	pointer-events: none;
}

.is-scanning .sp-body__scan {
	animation: sp-scan 1.35s cubic-bezier(0.45, 0, 0.25, 1);
}

@keyframes sp-scan {
	0% { opacity: 0; transform: translateY(0); }
	10% { opacity: 1; }
	90% { opacity: 1; }
	100% { opacity: 0; transform: translateY(820px); }
}

@keyframes sp-pulse {
	0% { opacity: 0.7; transform: scale(0.6); }
	100% { opacity: 0; transform: scale(1.9); }
}

.sp-bodymap__panel {
	padding: 2rem 2rem 1.75rem;
	border: 1px solid var(--sp-line);
	border-radius: 24px;
	background: #fff;
	box-shadow: var(--sp-shadow);
}

.sp-bodymap__kicker {
	margin: 0 0 0.4rem;
	color: var(--sp-primary);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.sp-bodymap__zone {
	margin: 0 0 0.4rem;
	color: var(--sp-ink);
	font-size: 1.6rem;
	font-weight: 730;
	letter-spacing: -0.025em;
}

.sp-bodymap__blurb {
	margin: 0 0 1.1rem;
	color: var(--sp-text);
	line-height: 1.6;
}

.sp-bodymap__tests {
	margin: 0 0 1.1rem;
	padding: 0;
	list-style: none;
}

.sp-bodymap__tests li {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.35rem 0.75rem;
	margin: 0;
	padding: 0.6rem 0;
	border-bottom: 1px solid var(--sp-line);
	color: var(--sp-ink);
	font-weight: 550;
}

.sp-bodymap__tests li:last-child {
	border-bottom: 0;
}

.sp-bodymap__tests li.is-out {
	color: var(--sp-muted);
	font-weight: 450;
}

.sp-bodymap__tags {
	display: inline-flex;
	gap: 0.3rem;
}

.sp-tag {
	display: inline-block;
	padding: 0.2rem 0.6rem;
	border-radius: 999px;
	background: var(--sp-sand);
	color: var(--sp-text);
	font-size: 0.74rem;
	font-weight: 650;
	line-height: 1.3;
	white-space: nowrap;
}

.sp-tag--in,
.sp-tag--m,
.sp-tag--f {
	background: #FBE3D2;
	color: var(--sp-primary-dark);
}

.sp-tag--opt {
	background: #FEF0D2;
	color: #8C5E00;
}

.sp-tag--sex {
	background: #EFE7F6;
	color: #5B4A7A;
}

.sp-tag--cov {
	background: #FFF4D6;
	color: #7A5200;
	box-shadow: inset 0 0 0 1px rgba(224, 160, 20, 0.45);
}

.sp-bodymap__summary {
	margin: 0 0 0.25rem;
	color: var(--sp-ink);
	font-weight: 650;
}

.sp-bodymap__choice {
	margin: 0 0 1rem;
	color: var(--sp-muted);
	font-size: 0.92rem;
}

.sp-bodymap__link {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	color: var(--sp-primary);
	font-weight: 650;
}

.sp-bodymap__link::after {
	content: "→";
	transition: transform 0.2s var(--sp-ease);
}

.sp-bodymap__link:hover::after {
	transform: translateX(3px);
}

.sp-bodymap__hint {
	margin: 1.25rem 0 0;
	color: var(--sp-muted);
	font-size: 0.85rem;
	text-align: center;
}

/* ---- Clinic map ---- */

.sp-clinicmap__stage {
	position: relative;
	z-index: 3;
	aspect-ratio: 4 / 3;
	border-radius: 28px;
	background: #E8F0F2;
	box-shadow: inset 0 0 0 1px var(--sp-line), var(--sp-shadow);
}

/* Only the drawing is clipped to the rounded box: a clinic card near the top edge opens above the
   box and stays fully visible, on top of the content around it. */
.sp-map {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	-webkit-clip-path: inset(0 round 28px);
	clip-path: inset(0 round 28px);
}

.sp-map__base,
.sp-clinicmap__pins {
	transition: transform 0.6s var(--sp-ease);
}

.sp-map__sea {
	fill: #E5EEF0;
}

.sp-map__land {
	fill: #FBF6F0;
	stroke: #fff;
	stroke-width: 2;
}

.sp-map__region {
	fill: #F6E9DC;
	stroke: #fff;
	stroke-width: 2;
}

.sp-map__seoul {
	fill: #F9DFC6;
}

.sp-map__river {
	fill: none;
	stroke: #D5E5EA;
	stroke-width: 10;
	stroke-linecap: round;
}

.sp-map__label {
	fill: #A58C78;
	font-family: var(--sp-font);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
}

.sp-map__label--soft {
	fill: #C2AE9D;
	font-size: 11px;
}

.sp-map__label--sea,
.sp-map__label--river {
	fill: #93AEB6;
	font-size: 12px;
	font-style: italic;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: none;
}

.sp-clinicmap__pins {
	position: absolute;
	inset: 0;
}

.sp-clinicmap__pin,
.sp-clinicmap__airport {
	position: absolute;
	z-index: 1;
}

.sp-clinicmap__pin {
	opacity: 0;
	transform: translateY(-26px);
	transition: opacity 0.5s ease, transform 0.7s cubic-bezier(0.2, 1.4, 0.4, 1);
	transition-delay: calc(var(--i, 0) * 90ms + 0.15s);
}

.sp-clinicmap.is-in .sp-clinicmap__pin {
	opacity: 1;
	transform: none;
}

.sp-clinicmap__pin:hover,
.sp-clinicmap__pin:focus-within,
.sp-clinicmap__pin.is-open {
	z-index: 20;
}

.sp-clinicmap__dot {
	position: absolute;
	left: 0;
	top: 0;
	width: 18px;
	height: 18px;
	min-width: 0;
	max-width: none;
	min-height: 0;
	font-size: 0;
	line-height: 0;
	margin: 0;
	padding: 0;
	border: 3px solid #fff;
	border-radius: 50%;
	background: var(--sp-primary);
	box-shadow: 0 0 0 6px rgba(189, 80, 11, 0.16), 0 6px 14px rgba(189, 80, 11, 0.35);
	transform: translate(-50%, -50%);
	cursor: pointer;
	transition: transform 0.25s var(--sp-ease);
}

.sp-clinicmap__dot::after {
	content: "";
	position: absolute;
	inset: -9px;
	border: 2px solid rgba(189, 80, 11, 0.45);
	border-radius: 50%;
	animation: sp-ping 2.6s ease-out infinite;
	animation-delay: calc(var(--i, 0) * 0.3s);
}

@keyframes sp-ping {
	0% { opacity: 0.8; transform: scale(0.5); }
	70%, 100% { opacity: 0; transform: scale(1.6); }
}

.sp-clinicmap__pin:hover .sp-clinicmap__dot,
.sp-clinicmap__pin.is-open .sp-clinicmap__dot,
.sp-clinicmap__dot:focus-visible {
	transform: translate(-50%, -50%) scale(1.2);
}

.sp-clinicmap__name {
	position: absolute;
	top: 0;
	left: 16px;
	padding: 0.25rem 0.6rem;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 4px 12px rgba(97, 39, 9, 0.12);
	color: var(--sp-ink);
	font-size: 0.78rem;
	font-weight: 650;
	white-space: nowrap;
	transform: translateY(-50%);
	pointer-events: none;
}

.sp-clinicmap__pin.is-left .sp-clinicmap__name {
	left: auto;
	right: 16px;
}

.sp-clinicmap__card {
	position: absolute;
	bottom: 18px;
	left: 50%;
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	width: 230px;
	padding: 0.6rem 0.6rem 0.85rem;
	border-radius: 18px;
	background: #fff;
	box-shadow: var(--sp-shadow-lg);
	color: var(--sp-text);
	font-size: 0.85rem;
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, 8px);
	transition: opacity 0.25s ease, transform 0.3s var(--sp-ease), visibility 0s linear 0.3s;
}

.sp-clinicmap__pin:hover .sp-clinicmap__card,
.sp-clinicmap__pin:focus-within .sp-clinicmap__card,
.sp-clinicmap__pin.is-open .sp-clinicmap__card {
	opacity: 1;
	visibility: visible;
	transform: translate(-50%, 0);
	transition-delay: 0s;
}

.sp-clinicmap__photo img {
	display: block;
	width: 100%;
	height: 110px;
	margin-bottom: 0.5rem;
	border-radius: 12px;
	object-fit: cover;
}

.sp-clinicmap__card strong {
	padding: 0 0.25rem;
	color: var(--sp-ink);
	font-size: 0.95rem;
	line-height: 1.3;
}

.sp-clinicmap__card > span:not(.sp-clinicmap__photo) {
	padding: 0 0.25rem;
}

.sp-clinicmap__more {
	margin: 0.35rem 0.25rem 0;
	color: var(--sp-primary);
	font-weight: 650;
}

.sp-clinicmap__airport {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	color: #5E7A82;
	font-size: 0.75rem;
	font-weight: 650;
	transform: translate(-14px, -50%);
}

.sp-clinicmap__airport svg {
	width: 26px;
	height: 26px;
	padding: 5px;
	border-radius: 50%;
	background: #fff;
	color: #5E7A82;
	box-shadow: 0 4px 10px rgba(30, 60, 70, 0.15);
}

.sp-clinicmap__list {
	display: none;
	margin: 1.25rem 0 0;
	padding: 0;
	list-style: none;
}

.sp-clinicmap__list li {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.15rem 0.6rem;
	margin: 0;
	padding: 0.7rem 0;
	border-bottom: 1px solid var(--sp-line);
}

.sp-clinicmap__list strong {
	color: var(--sp-ink);
}

.sp-clinicmap__list span {
	color: var(--sp-muted);
	font-size: 0.9rem;
}

.sp-clinicmap__list .sp-clinicmap__more {
	margin: 0 0 0 auto;
}

.sp-clinicmap__note {
	margin: 0.75rem 0 0;
	color: var(--sp-muted);
	font-size: 0.8rem;
	text-align: right;
}

@media (max-width: 849px) {
	.sp-journey__track {
		display: none;
	}

	.sp-journey__steps {
		position: relative;
		grid-template-columns: minmax(0, 1fr);
		gap: 1.75rem;
		padding-left: 3.25rem;
	}

	.sp-journey__steps::before,
	.sp-journey__steps::after {
		content: "";
		position: absolute;
		left: 0.95rem;
		top: 0.5rem;
		bottom: 0.5rem;
		width: 3px;
		border-radius: 3px;
		background: rgba(189, 80, 11, 0.16);
	}

	.sp-journey__steps::after {
		background: var(--sp-primary);
		transform: scaleY(var(--p, 1));
		transform-origin: top;
	}

	.sp-journey__step {
		position: relative;
		padding: 0;
		text-align: left;
	}

	.sp-journey__step::before {
		content: "";
		position: absolute;
		z-index: 1;
		left: calc(-2.3rem - 6.5px);
		top: 1.4rem;
		width: 16px;
		height: 16px;
		border: 3px solid #fff;
		border-radius: 50%;
		background: #E9D8C8;
		box-shadow: 0 0 0 1px var(--sp-line);
		transition: background-color 0.4s ease;
	}

	.sp-journey__step.is-reached::before,
	.sp-journey:not(.is-ready) .sp-journey__step::before {
		background: var(--sp-primary);
	}

	.sp-journey__text p {
		margin: 0;
	}

	.sp-bodymap__stage {
		grid-template-columns: minmax(0, 1fr);
		gap: 1.25rem;
	}

	.sp-bodymap__svg {
		height: clamp(280px, calc(100svh - 270px), 440px);
	}

	.sp-bodymap__level {
		padding: 0.5rem 0.75rem;
	}

	.sp-clinicmap__name,
	.sp-clinicmap__card {
		display: none;
	}

	.sp-clinicmap__list {
		display: block;
	}

	.sp-clinicmap__airport span {
		display: none;
	}
}

@media (max-width: 549px) {
	.sp-bodymap__panel {
		padding: 1.4rem 1.2rem 1.25rem;
	}

	.sp-bodymap__levels {
		border-radius: 16px;
	}

	.sp-bodymap__level small {
		display: none;
	}

	.sp-clinicmap__stage {
		border-radius: 20px;
	}

	.sp-map {
		-webkit-clip-path: inset(0 round 20px);
		clip-path: inset(0 round 20px);
	}
}

/* ==== Mega menu (Treatments), floating "Ask us", footer extras ============= */

.header-nav .menu-item-has-block > .nav-dropdown {
	padding: 0;
	border: 0;
	border-radius: 24px;
	overflow: hidden;
	box-shadow: 0 30px 80px rgba(43, 33, 28, 0.18), 0 2px 8px rgba(43, 33, 28, 0.06);
}

.sp-mega {
	margin: 0 !important;
	text-align: left;
}

.sp-mega__main > .col-inner {
	padding: 32px 36px 28px;
}

.sp-mega__title {
	margin: 0 0 1rem;
	color: var(--sp-muted);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.sp-mega__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 6px;
}

.sp-mega__item {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	padding: 0.8rem 0.9rem;
	border-radius: 16px;
	color: var(--sp-ink);
	transition: background-color 0.2s ease, transform 0.2s var(--sp-ease);
}

.sp-mega__item:hover,
.sp-mega__item:focus-visible {
	background: var(--sp-cream);
	color: var(--sp-ink);
	transform: translateX(2px);
}

/* A specialty that is coming (IV Therapy): shown, but not a link. */
.sp-mega__item--soon {
	cursor: default;
	opacity: 0.62;
}

.sp-mega__item--soon:hover {
	background: none;
	transform: none;
}

.sp-mega__item img {
	flex: none;
	width: 44px;
	height: 44px;
	padding: 8px;
	border-radius: 14px;
	background: var(--sp-peach);
}

.sp-mega__item strong {
	display: block;
	font-size: 0.97rem;
	font-weight: 680;
	line-height: 1.25;
}

.sp-mega__item small {
	display: block;
	margin-top: 0.1rem;
	color: var(--sp-muted);
	font-size: 0.82rem;
	line-height: 1.35;
}

.sp-mega__foot {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	margin: 1.1rem 0 0;
	padding: 1rem 0.9rem 0;
	border-top: 1px solid var(--sp-line);
	font-size: 0.9rem;
	font-weight: 650;
}

.sp-mega__foot a::after {
	content: " →";
}

.sp-mega__aside > .col-inner {
	height: 100%;
	padding: 28px;
	background:
		radial-gradient(120% 120% at 100% 0%, rgba(251, 186, 51, 0.35) 0%, rgba(251, 186, 51, 0) 55%),
		linear-gradient(140deg, #8F3A06 0%, #BD500B 60%, #D96A12 100%);
}

.sp-mega__card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	height: 100%;
	color: rgba(255, 255, 255, 0.86);
	font-size: 0.93rem;
	line-height: 1.55;
}

.sp-mega__card img {
	width: 52px;
	height: 52px;
	margin-bottom: 0.9rem;
	padding: 6px;
	border-radius: 16px;
	background: #fff;
}

.sp-mega__card-title {
	margin: 0 0 0.35rem;
	color: #fff;
	font-size: 1.15rem;
	font-weight: 720;
	letter-spacing: -0.015em;
}

.sp-mega__card p {
	margin-bottom: 1.1rem;
}

.sp-mega__cta {
	margin-top: auto;
	padding: 0.65rem 1.05rem;
	border-radius: 12px;
	background: #fff;
	color: var(--sp-primary-dark);
	font-weight: 680;
}

.sp-mega__cta:hover {
	background: var(--sp-cream);
	color: var(--sp-primary-dark);
}

/* Floating "Ask us" button and its lightbox: bottom right; interactive.js shows it once the visitor has scrolled past
   the first screen (without the script it is simply always there). On phones only the icon shows. */
.sp-float {
	position: fixed;
	right: 22px;
	bottom: 22px;
	z-index: 40;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.7rem 1.1rem 0.7rem 0.8rem;
	border-radius: 999px;
	background: #fff;
	box-shadow: 0 12px 30px rgba(43, 33, 28, 0.18), 0 0 0 1px var(--sp-line);
	color: var(--sp-ink);
	font-size: 0.92rem;
	font-weight: 680;
	transition: opacity 0.3s ease, transform 0.3s var(--sp-ease), box-shadow 0.25s ease, visibility 0.3s;
}

.sp-float img {
	width: 26px;
	height: 26px;
}

.sp-float:hover {
	color: var(--sp-ink);
	transform: translateY(-2px);
	box-shadow: 0 18px 40px rgba(43, 33, 28, 0.22), 0 0 0 1px var(--sp-line);
}

.sp-float--hidden {
	opacity: 0;
	visibility: hidden;
	transform: translateY(12px);
	pointer-events: none;
}

@media (max-width: 549px) {
	.sp-float {
		right: 16px;
		bottom: 16px;
		padding: 0;
		width: 52px;
		height: 52px;
		justify-content: center;
	}

	/* The label stays for screen readers. */
	.sp-float span {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		white-space: nowrap;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sp-float {
		transition: none;
	}
}

.sp-ask-box {
	border-radius: 24px;
	overflow: hidden;
}

.sp-ask {
	padding: 32px 30px 26px;
}

.sp-ask .sp-h3 {
	font-size: 1.6rem;
}

.sp-ask__intro {
	color: var(--sp-text);
}

.sp-ask__list {
	margin: 1rem 0 0;
	padding: 0;
	list-style: none;
}

.sp-ask__list li {
	margin: 0 0 0.5rem;
}

.sp-ask__list a {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	padding: 0.75rem 0.9rem;
	border: 1px solid var(--sp-line);
	border-radius: 16px;
	color: var(--sp-ink);
	transition: background-color 0.2s ease, border-color 0.2s ease;
}

.sp-ask__list a:hover {
	background: var(--sp-cream);
	border-color: rgba(189, 80, 11, 0.25);
	color: var(--sp-ink);
}

.sp-ask__list img {
	flex: none;
	width: 44px;
	height: 44px;
	padding: 8px;
	border-radius: 14px;
	background: var(--sp-peach);
}

.sp-ask__list strong {
	display: block;
	font-weight: 680;
}

.sp-ask__list small {
	display: block;
	color: var(--sp-muted);
	font-size: 0.85rem;
}

.sp-footer__social {
	margin-top: 0.5rem;
}

.sp-footer .social-icons .icon,
.sp-footer .social-icons a {
	border-radius: 12px !important;
}

.sp-footer .social-icons .button.is-outline,
.sp-footer .social-icons a.icon.button {
	background: rgba(255, 255, 255, 0.08) !important;
	border-color: transparent !important;
	color: rgba(255, 255, 255, 0.85) !important;
}

.sp-footer .social-icons a {
	box-shadow: none !important;
}

.sp-footer .social-icons a.icon.button:hover {
	background: var(--sp-primary) !important;
	color: #fff !important;
}

.sp-footer__note {
	margin-top: 1.5rem;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* ==== Inner page hero ======================================================= */

.sp-page-hero .overlay {
	background:
		linear-gradient(90deg, rgba(26, 15, 8, 0.78) 0%, rgba(26, 15, 8, 0.45) 45%, rgba(26, 15, 8, 0.1) 80%),
		linear-gradient(0deg, rgba(26, 15, 8, 0.55) 0%, rgba(26, 15, 8, 0) 45%),
		linear-gradient(180deg, rgba(26, 15, 8, 0.5) 0%, rgba(26, 15, 8, 0) 26%) !important;
}

.sp-page-hero .text-inner > :first-child {
	margin-top: 0;
}

.banner h1.sp-display--page,
.sp-display--page {
	font-size: clamp(2.4rem, 1.5rem + 3.2vw, 4rem);
}

.sp-crumbs,
.sp-page-hero #breadcrumbs {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35rem;
	margin: 0 0 1.1rem;
	padding: 0.35rem 0.85rem;
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.1);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	color: rgba(255, 255, 255, 0.8);
	font-size: 0.82rem;
	font-weight: 550;
}

.sp-crumbs a,
.sp-page-hero #breadcrumbs a {
	color: #fff;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.sp-crumbs a:hover,
.sp-page-hero #breadcrumbs a:hover {
	color: var(--sp-gold);
}

.sp-page-hero .breadcrumb_last {
	color: rgba(255, 255, 255, 0.75);
}

/* "Next steps" links at the end of every inner page */
.sp-next {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sp-next li {
	margin: 0;
}

.sp-next a {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	height: 100%;
	padding: 1.25rem 1.25rem 1.1rem;
	border: 1px solid var(--sp-line);
	border-radius: 20px;
	background: #fff;
	color: var(--sp-ink);
	box-shadow: var(--sp-shadow);
	transition: transform 0.3s var(--sp-ease), box-shadow 0.3s var(--sp-ease), border-color 0.3s ease;
}

.sp-next a:hover {
	border-color: rgba(189, 80, 11, 0.3);
	box-shadow: var(--sp-shadow-lg);
	color: var(--sp-ink);
	transform: translateY(-3px);
}

.sp-next img {
	width: 40px;
	height: 40px;
	margin-bottom: 0.35rem;
	padding: 7px;
	border-radius: 12px;
	background: var(--sp-peach);
}

.sp-next strong {
	font-size: 1.02rem;
	font-weight: 700;
}

.sp-next small {
	color: var(--sp-muted);
	font-size: 0.88rem;
	line-height: 1.45;
}

.sp-next strong::after {
	content: " →";
	color: var(--sp-primary);
}

@media (max-width: 849px) {
	.header-nav .menu-item-has-block > .nav-dropdown {
		border-radius: 0;
	}

	.sp-mega__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.sp-next {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 549px) {
	.sp-float {
		left: 14px;
		bottom: 14px;
		padding: 0.6rem;
	}

	.sp-float span {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		white-space: nowrap;
	}

	.sp-next {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Mobile off-canvas menu */
.mobile-sidebar .nav-sidebar > li > a,
.off-canvas .nav-vertical > li > a {
	color: var(--sp-ink);
	font-size: 1.08rem;
	font-weight: 650;
	letter-spacing: -0.01em;
	text-transform: none;
}

.off-canvas .nav-vertical > li > a:hover,
.off-canvas .nav-vertical > li.active > a {
	color: var(--sp-primary);
}

.off-canvas-left .mfp-content,
.off-canvas .sidebar-menu {
	background: var(--sp-cream);
}

.off-canvas .header-button-1 .button,
.off-canvas .button.primary {
	width: calc(100% - 40px);
	margin: 0.5rem 20px;
	line-height: 3em;
}

/* ==== Home: partner logos, real moments, small links ======================== */

.sp-steps__more,
.sp-live__more,
.sp-faq__more {
	margin: 1.5rem 0 0;
	text-align: center;
	font-weight: 650;
}

.sp-steps__more a::after,
.sp-live__more a::after,
.sp-faq__more a::after {
	content: " →";
}

.sp-logos-row {
	padding: 3.5rem 0 1rem;
}

.sp-logos__title {
	margin: 0 0 1.25rem;
	color: var(--sp-muted);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-align: center;
	text-transform: uppercase;
}

.sp-logos .logo-inner img,
.sp-logos img {
	max-height: 54px;
	width: auto;
	filter: grayscale(1) contrast(0.9);
	opacity: 0.62;
	transition: filter 0.35s ease, opacity 0.35s ease;
}

.sp-logos a:hover img,
.sp-logos .ux-logo:hover img {
	filter: none;
	opacity: 1;
}

.sp-logos .flickity-slider > * {
	display: flex;
	align-items: center;
	justify-content: center;
}

.sp-moments__row {
	padding-left: max(15px, calc((100vw - 1200px) / 2));
}

.sp-moments__row > .col {
	padding-right: 0;
}

/* A rail of several photos side by side: free-ish scrolling, a gap, and room after the last one. */
.sp-moments__slider .sp-rail__track {
	gap: 18px;
	scroll-snap-type: x proximity;
	padding-right: max(15px, calc((100vw - 1200px) / 2));
	scroll-padding-left: 0;
}

.sp-moment.img {
	position: relative;
}

.sp-moment .img-inner {
	border-radius: 22px;
	overflow: hidden;
	box-shadow: var(--sp-shadow);
}

.sp-moment .img-inner img {
	transition: transform 1s var(--sp-ease);
}

.sp-moment:hover .img-inner img {
	transform: scale(1.04);
}

.sp-moment .caption {
	position: absolute;
	width: auto;
	max-height: none !important;
	transform: none;
	left: 12px;
	right: 12px;
	bottom: 12px;
	padding: 0.5rem 0.85rem;
	border-radius: 14px;
	background: rgba(255, 255, 255, 0.92);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	color: var(--sp-ink);
	font-size: 0.85rem;
	font-weight: 650;
	line-height: 1.35;
	text-align: left;
	opacity: 1;
}

.sp-moments__slider .sp-rail__btn {
	width: 48px;
	height: 48px;
	margin-top: -24px;
}

.sp-photo--focus-top .img-inner img {
	object-position: 50% 30%;
}

.sp-photo--focus-right .img-inner img {
	object-position: 70% 50%;
}

/* The team photo is tall: in a wide frame, show the faces and the hands (about 52% down), not the ceiling above them. */
.sp-photo--focus-team .img-inner img {
	object-position: 50% 52%;
}

/* ==== Hair page: before and after posters =================================== */

.sp-results .sp-photo--poster .img-inner {
	background: var(--sp-sand);
}

.sp-results__cap {
	margin: 1rem 0 0;
	color: var(--sp-muted);
	font-size: 0.9rem;
	line-height: 1.45;
	text-align: center;
}

.sp-results__cap strong {
	display: block;
	margin-bottom: 0.15rem;
	color: var(--sp-ink);
	font-size: 1rem;
	font-weight: 700;
}

.sp-results__note {
	margin: 2rem 0 0;
	color: var(--sp-muted);
	font-size: 0.85rem;
	line-height: 1.6;
	text-align: center;
}

/* ==== VVIP section of the check-up page ===================================== */

.sp-vip {
	background:
		radial-gradient(60% 50% at 100% 0%, rgba(251, 186, 51, 0.16) 0%, rgba(251, 186, 51, 0) 70%),
		radial-gradient(50% 40% at 0% 100%, rgba(189, 80, 11, 0.18) 0%, rgba(189, 80, 11, 0) 70%),
		var(--sp-night);
	color: rgba(255, 255, 255, 0.82);
}

.sp-vip .sp-h2 {
	color: #fff;
}

.sp-vip .sp-lead {
	max-width: 33rem;
	color: rgba(255, 255, 255, 0.78);
	font-size: 1.08rem;
	line-height: 1.65;
}

.sp-vip .sp-btn {
	margin-right: 0.5rem;
}

.sp-vip__photos .sp-photo .img-inner {
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
}

.sp-vip__adds {
	margin-top: 4.5rem;
}

.sp-vip__adds > .col {
	padding-bottom: 20px;
}

.sp-vip__adds > .col > .col-inner {
	height: 100%;
}

.sp-vip__add {
	height: 100%;
	padding: 1.6rem 1.5rem 1.7rem;
	border: 1px solid rgba(251, 186, 51, 0.28);
	border-radius: 20px;
	background: rgba(255, 255, 255, 0.05);
}

.sp-vip__add img {
	display: block;
	box-sizing: content-box;
	margin: 0 0 1rem;
	padding: 9px;
	border-radius: 14px;
	background: rgba(255, 237, 213, 0.95);
}

.sp-vip__add h3 {
	margin: 0 0 0.5rem;
	color: var(--sp-gold);
	font-size: 1.1rem;
	font-weight: 700;
	letter-spacing: -0.01em;
}

.sp-vip__add p {
	margin: 0;
	color: rgba(255, 255, 255, 0.74);
	font-size: 0.95rem;
	line-height: 1.6;
}

.sp-vip .sp-live {
	margin-top: 4rem;
}

.sp-vip .sp-live__head {
	border-top-color: rgba(255, 255, 255, 0.14);
}

.sp-vip .sp-live__head .sp-h3 {
	color: #fff;
}

.sp-vip .sp-live__head p {
	color: rgba(255, 255, 255, 0.62);
}

.sp-vip .sp-live__more a {
	color: var(--sp-gold);
}

@media (max-width: 549px) {
	/* Body map levels: an even 2 x 2 grid instead of a ragged wrap */
	.sp-bodymap__levels {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		width: 100%;
	}

	.sp-bodymap__level {
		width: 100%;
	}

	/* The fifth button (VVIP) takes the whole last row */
	.sp-bodymap__level.is-vvip {
		grid-column: 1 / -1;
	}

	/* Leave room for the floating "Ask us" button at the very end of the page */
	.absolute-footer {
		padding-bottom: 72px;
	}
}

/* ==== Live "from" price (salpim_price_from) ================================= */

.salpim-from {
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
}

.salpim-from__price {
	color: var(--sp-primary);
	font-size: 1.05rem;
	font-weight: 750;
	letter-spacing: -0.01em;
	font-variant-numeric: tabular-nums;
}

.salpim-from__meta {
	color: var(--sp-muted);
	font-size: 0.78rem;
}

.sp-tier .salpim-from {
	margin: 0 0 0.35rem;
	padding: 0.7rem 0.85rem;
	border-radius: 14px;
	background: var(--sp-cream);
}

.sp-tier--featured .salpim-from {
	background: rgba(255, 255, 255, 0.08);
}

.sp-tier--featured .salpim-from__price {
	color: var(--sp-gold);
}

.sp-tier--featured .salpim-from__meta {
	color: rgba(255, 255, 255, 0.6);
}

/* ==== Check-up comparison table (salpim_checkup_table) ====================== */

.sp-ctable {
	--sp-sticky: 68px;
	border: 1px solid var(--sp-line);
	border-radius: 24px;
	background: #fff;
	box-shadow: var(--sp-shadow);
	overflow: clip;
}

.sp-ctable table {
	width: 100%;
	margin: 0;
	border-collapse: separate;
	border-spacing: 0;
	table-layout: fixed;
	font-size: 0.95rem;
}

.sp-ctable th,
.sp-ctable td {
	padding: 0.8rem 1rem;
	border-bottom: 1px solid var(--sp-line);
	vertical-align: middle;
}

.sp-ctable .sp-ctable__test {
	width: 40%;
}

.sp-ctable thead th {
	position: sticky;
	top: var(--sp-sticky);
	z-index: 2;
	padding: 1.1rem 1rem;
	border-bottom: 1px solid var(--sp-line);
	background: rgba(255, 255, 255, 0.96);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	color: var(--sp-muted);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-align: left;
	text-transform: uppercase;
}

.sp-ctable thead .sp-ctable__level {
	text-align: center;
	letter-spacing: 0;
	text-transform: none;
}

.sp-ctable__level span {
	display: block;
	color: var(--sp-ink);
	font-size: 1rem;
	font-weight: 720;
	letter-spacing: -0.01em;
}

.sp-ctable__level small {
	display: block;
	color: var(--sp-muted);
	font-size: 0.8rem;
	font-weight: 500;
}

.sp-ctable thead .sp-ctable__level.is-vvip {
	background: linear-gradient(180deg, #2B211C 0%, #3A2A20 100%);
	box-shadow: inset 0 3px 0 var(--sp-gold);
}

.sp-ctable thead .sp-ctable__level.is-vvip span {
	color: var(--sp-gold);
}

.sp-ctable thead .sp-ctable__level.is-vvip small {
	color: rgba(255, 255, 255, 0.7);
}

.sp-ctable__badge {
	display: block;
	width: fit-content;
	margin: 0 auto 0.35rem;
	padding: 0.15rem 0.55rem;
	border-radius: 999px;
	background: var(--sp-gold);
	color: #3A2A20;
	font-size: 0.62rem;
	font-style: normal;
	font-weight: 800;
	letter-spacing: 0.08em;
	line-height: 1.3;
	text-transform: uppercase;
}

.sp-ctable tbody th {
	color: var(--sp-ink);
	font-weight: 560;
	line-height: 1.35;
	text-align: left;
}

.sp-ctable tbody th small {
	display: block;
	margin-top: 0.15rem;
	color: var(--sp-muted);
	font-size: 0.8rem;
	font-weight: 400;
}

.sp-ctable tbody td {
	text-align: center;
}

.sp-ctable tbody td.lv-vvip,
.sp-ctable tfoot td.lv-vvip {
	background: rgba(251, 186, 51, 0.13);
}

.sp-ctable tbody td.lv-vvip.is-in svg circle,
.sp-ctable tbody td.lv-vvip.is-m svg circle,
.sp-ctable tbody td.lv-vvip.is-f svg circle {
	fill: #B7791F;
}

/* Where a VVIP test is offered, when not at every hospital */
.sp-ctable__cov {
	display: block;
	margin-top: 0.2rem;
	color: #8C5E00;
	font-size: 0.68rem;
	font-weight: 650;
	line-height: 1.25;
}

.sp-ctable__note {
	margin: 0;
	padding: 0.85rem 1.25rem 1rem;
	border-top: 1px solid var(--sp-line);
	background: var(--sp-cream);
	color: var(--sp-muted);
	font-size: 0.82rem;
	line-height: 1.5;
}

.sp-ctable svg {
	display: inline-block;
	width: 22px;
	height: 22px;
	vertical-align: middle;
}

.sp-ctable .is-in svg circle,
.sp-ctable .is-m svg circle,
.sp-ctable .is-f svg circle {
	fill: var(--sp-primary);
}

.sp-ctable .is-opt svg circle {
	stroke: var(--sp-amber);
}

.sp-ctable .is-opt svg path {
	fill: var(--sp-amber);
}

.sp-ctable .is-out svg path {
	stroke: #CDB8A5;
}

.sp-ctable__sex {
	display: block;
	margin-top: 0.2rem;
	color: #5B4A7A;
	font-size: 0.7rem;
	font-weight: 650;
}

.sp-ctable__group th {
	padding: 0.65rem 1rem;
	background: var(--sp-sand);
	color: var(--sp-text);
	font-size: 0.74rem;
	font-weight: 750;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.sp-ctable tfoot th,
.sp-ctable tfoot td {
	border-bottom: 0;
	color: var(--sp-text);
	font-size: 0.85rem;
	line-height: 1.45;
}

.sp-ctable tfoot th {
	color: var(--sp-ink);
	font-weight: 700;
	text-align: left;
}

.sp-ctable tfoot td {
	text-align: center;
}

.sp-ctable__legend {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	margin: 0;
	padding: 1rem 1.25rem;
	border-top: 1px solid var(--sp-line);
	background: var(--sp-cream);
	color: var(--sp-text);
	font-size: 0.85rem;
}

.sp-ctable__legend span {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
}

.sp-ctable__legend svg {
	width: 18px;
	height: 18px;
}

@media (max-width: 849px) {
	.sp-ctable {
		--sp-sticky: 64px;
	}
}

@media (max-width: 549px) {
	/* Five columns on a phone: the test names get less room and the four levels share the rest evenly. */
	.sp-ctable table {
		font-size: 0.8rem;
	}

	.sp-ctable th,
	.sp-ctable td {
		padding: 0.6rem 0.15rem;
	}

	.sp-ctable tbody th,
	.sp-ctable thead .sp-ctable__test,
	.sp-ctable tfoot th {
		padding-left: 0.75rem;
		overflow-wrap: anywhere;
	}

	.sp-ctable .sp-ctable__test {
		width: 31%;
	}

	.sp-ctable thead th {
		padding: 0.8rem 0.1rem;
	}

	.sp-ctable thead .sp-ctable__test {
		padding-left: 0.75rem;
	}

	.sp-ctable__level span {
		font-size: 0.68rem;
		line-height: 1.2;
	}

	/* The gold column already says it: no room for the badge */
	.sp-ctable__badge {
		display: none;
	}

	.sp-ctable__cov {
		font-size: 0.58rem;
	}

	.sp-ctable__note {
		padding: 0.75rem 0.85rem 0.9rem;
		font-size: 0.76rem;
	}

	.sp-ctable__level small,
	.sp-ctable tbody th small {
		display: none;
	}

	.sp-ctable tfoot td {
		font-size: 0.72rem;
	}
}

/* ==== Check-up page ========================================================= */

/* Yoast breadcrumb inside page heroes ([wpseo_breadcrumb] prints span#breadcrumbs) */
.sp-page-hero .text-inner > #breadcrumbs,
.sp-page-hero .text-inner > p:first-child > #breadcrumbs {
	margin-bottom: 1.25rem;
}

.sp-page-hero .sp-display--page {
	margin-top: 0.25rem;
}

/* VVIP card */
.sp-vvip > .col-inner {
	overflow: hidden;
	background:
		radial-gradient(90% 120% at 100% 0%, rgba(251, 186, 51, 0.22) 0%, rgba(251, 186, 51, 0) 55%),
		linear-gradient(135deg, #2B211C 0%, #3A2A20 55%, #4A3020 100%);
	color: rgba(255, 255, 255, 0.86);
	box-shadow: 0 30px 80px rgba(33, 24, 19, 0.28);
}

.sp-vvip .sp-h2 {
	color: #fff;
	font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.4rem);
}

.sp-vvip .sp-lead {
	max-width: 34rem;
	color: rgba(255, 255, 255, 0.78);
	font-size: 1.05rem;
	line-height: 1.65;
}

.salpim-from--light {
	margin: 0.5rem 0 1.25rem;
}

.salpim-from--light .salpim-from__price {
	color: var(--sp-gold);
	font-size: 1.35rem;
}

.salpim-from--light .salpim-from__meta {
	color: rgba(255, 255, 255, 0.6);
}

.sp-vvip__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sp-vvip__list li {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0;
	padding: 0.9rem 1rem;
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 16px;
	background: rgba(255, 255, 255, 0.06);
	color: #fff;
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1.35;
}

.sp-vvip__list img {
	flex: none;
	width: 40px;
	height: 40px;
	padding: 6px;
	border-radius: 12px;
	background: rgba(255, 237, 213, 0.95);
}

.sp-levels .sp-tiers {
	margin-top: 1rem;
	margin-bottom: 1.5rem;
}

/* Gallery */
.sp-gallery .box-image {
	border-radius: 20px;
	overflow: hidden;
	box-shadow: var(--sp-shadow);
}

.sp-gallery .gallery-col {
	padding-bottom: 14px !important;
}

/* Plain FAQ section (no overlapping card) */
.sp-faq-plain .sp-accordion {
	padding: 0.5rem 2rem;
	border: 1px solid var(--sp-line);
	border-radius: 24px;
	background: var(--sp-cream);
}

.sp-next-section .sp-eyebrow {
	margin-bottom: 1.25rem;
}

@media (max-width: 849px) {
	.sp-vvip__list {
		grid-template-columns: minmax(0, 1fr);
		margin-top: 1.5rem;
	}
}

@media (max-width: 549px) {
	.sp-faq-plain .sp-accordion {
		padding: 0.25rem 1rem;
	}
}

/* Flatsome sets every th to uppercase with tight line height, and td/th to 0.9em. */
.sp-ctable th,
.sp-ctable td {
	font-size: inherit;
}

.sp-ctable tbody th,
.sp-ctable tfoot th,
.sp-ctable .sp-ctable__level {
	letter-spacing: 0;
	line-height: 1.35;
	text-transform: none;
}

.sp-ctable th:first-child,
.sp-ctable td:first-child {
	padding-left: 1.25rem;
}

/* Page heroes: stronger scrim, since clinic photos are bright white */
.sp-page-hero .overlay {
	background:
		linear-gradient(90deg, rgba(26, 15, 8, 0.86) 0%, rgba(26, 15, 8, 0.62) 42%, rgba(26, 15, 8, 0.16) 78%),
		linear-gradient(0deg, rgba(26, 15, 8, 0.55) 0%, rgba(26, 15, 8, 0) 40%),
		linear-gradient(180deg, rgba(26, 15, 8, 0.55) 0%, rgba(26, 15, 8, 0) 26%) !important;
}

.sp-crumbs > span > span {
	display: inline;
}

@media (max-width: 849px) {
	.sp-page-hero .overlay {
		background: linear-gradient(0deg, rgba(26, 15, 8, 0.9) 0%, rgba(26, 15, 8, 0.6) 55%, rgba(26, 15, 8, 0.45) 100%) !important;
	}
}

/* Flatsome resets p inside banners (.banner p { padding: 0; margin: 1em 0 }). */
.banner p.sp-pill {
	margin: 0 0 1.4rem;
	padding: 0.45rem 0.95rem 0.45rem 0.8rem;
}

.banner p.sp-crumbs {
	margin: 0 0 1.1rem;
	padding: 0.35rem 0.85rem;
}

/* ==== Body scan (salpim_body_scan) ========================================== */

.sp-scan {
	--sp-scan-dur: 7s;
	position: relative;
	max-width: 420px;
	margin: 0 auto;
}

.sp-scan__stage {
	position: relative;
	padding: 0 22%;
}

.sp-scan__svg {
	display: block;
	width: 100%;
	height: auto;
	overflow: visible;
}

.sp-scan .sp-skin {
	fill: rgba(255, 255, 255, 0.08);
	stroke: rgba(255, 255, 255, 0.22);
	stroke-width: 1.5;
}

.sp-scan .sp-limb {
	fill: none;
	stroke: rgba(255, 255, 255, 0.08);
	stroke-width: 34;
	stroke-linecap: round;
}

.sp-scan .sp-limb--leg {
	stroke-width: 46;
}

.sp-scan__area > * {
	fill: rgba(251, 186, 51, 0.12);
	stroke: rgba(251, 186, 51, 0.45);
	stroke-width: 1.5;
}

.sp-scan__area .sp-scan__line {
	fill: none;
	stroke: rgba(251, 186, 51, 0.6);
	stroke-width: 6;
	stroke-linecap: round;
}

.sp-scan__area .sp-scan__line--thin {
	stroke-width: 2;
}

.sp-scan__beam {
	opacity: 0.9;
}

.sp-scan__beam-line {
	fill: #FFE9C2;
}

.sp-scan__beam,
.sp-scan__beam-line {
	transform: translateY(0);
}

.sp-scan__label {
	position: absolute;
	padding: 0.3rem 0.7rem;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 999px;
	background: rgba(20, 12, 7, 0.55);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	color: #fff;
	font-size: 0.78rem;
	font-weight: 650;
	white-space: nowrap;
	transform: translateY(-50%);
}

.sp-scan__label.is-right {
	right: 0;
}

.sp-scan__label.is-left {
	left: 0;
}

.sp-scan__label::before {
	content: "";
	position: absolute;
	top: 50%;
	width: 22px;
	height: 1px;
	background: rgba(251, 186, 51, 0.6);
}

.sp-scan__label.is-right::before {
	right: 100%;
}

.sp-scan__label.is-left::before {
	left: 100%;
}

@media (prefers-reduced-motion: no-preference) {
	.sp-scan__beam,
	.sp-scan__beam-line {
		animation: sp-scan-beam var(--sp-scan-dur) cubic-bezier(0.45, 0, 0.55, 1) infinite;
	}

	.sp-scan__area > * {
		animation: sp-scan-area var(--sp-scan-dur) ease-in-out infinite;
		animation-delay: calc(var(--y) / 720 * var(--sp-scan-dur) * 0.8);
	}

	.sp-scan__label {
		animation: sp-scan-label var(--sp-scan-dur) ease-in-out infinite;
		animation-delay: calc(var(--y) / 720 * var(--sp-scan-dur) * 0.8);
	}
}

@keyframes sp-scan-beam {
	0% { transform: translateY(0); opacity: 0; }
	6% { opacity: 1; }
	80% { transform: translateY(810px); opacity: 1; }
	86%, 100% { transform: translateY(810px); opacity: 0; }
}

@keyframes sp-scan-area {
	0% { fill: rgba(251, 186, 51, 0.7); stroke: #FFE0A3; }
	30% { fill: rgba(251, 186, 51, 0.32); stroke: rgba(251, 186, 51, 0.7); }
	70%, 100% { fill: rgba(251, 186, 51, 0.12); stroke: rgba(251, 186, 51, 0.45); }
}

@keyframes sp-scan-label {
	0% { opacity: 1; }
	45% { opacity: 1; }
	70%, 100% { opacity: 0.45; }
}

/* MRI hero (dark section with the scan on the right) */
.sp-mri-hero {
	overflow: hidden;
}

.sp-mri-hero .section-bg {
	background:
		radial-gradient(60% 70% at 78% 45%, rgba(189, 80, 11, 0.35) 0%, rgba(189, 80, 11, 0) 60%),
		radial-gradient(40% 50% at 15% 85%, rgba(251, 186, 51, 0.12) 0%, rgba(251, 186, 51, 0) 60%),
		linear-gradient(160deg, #1E1611 0%, #2B1E16 60%, #3A2416 100%) !important;
}

.sp-mri-hero .sp-lead {
	max-width: 34rem;
	margin: 0 0 2rem;
	color: rgba(255, 255, 255, 0.84);
	font-size: clamp(1.05rem, 0.98rem + 0.3vw, 1.2rem);
	line-height: 1.62;
}

.sp-mri-hero .sp-display {
	font-size: clamp(2.4rem, 1.5rem + 3.2vw, 4rem);
}

.sp-mri-hero p.sp-crumbs {
	margin: 0 0 1.1rem;
	padding: 0.35rem 0.85rem;
}

@media (max-width: 849px) {
	.sp-scan {
		max-width: 340px;
		margin-top: 2rem;
	}
}

/* Inline facts strip (MRI hero) */
.sp-facts--inline {
	display: inline-flex;
	margin-top: 2rem;
}

.sp-mri-hero .sp-facts {
	background: rgba(255, 255, 255, 0.05);
}

/* Small comparison cards (MRI vs CT) */
.sp-mini-card {
	height: 100%;
	padding: 1.6rem 1.5rem 1.2rem;
	border: 1px solid var(--sp-line);
	border-radius: 22px;
	background: #fff;
	box-shadow: var(--sp-shadow);
}

.sp-mini-card--accent {
	border-color: transparent;
	background: var(--sp-night);
	color: rgba(255, 255, 255, 0.85);
}

.sp-mini-card__kicker {
	margin: 0 0 0.8rem;
	color: var(--sp-primary);
	font-size: 1.6rem;
	font-weight: 760;
	letter-spacing: -0.03em;
}

.sp-mini-card--accent .sp-mini-card__kicker {
	color: var(--sp-gold);
}

.sp-mini-card ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sp-mini-card li {
	margin: 0 0 0.55rem;
	padding-left: 1.6rem;
	background: url("icons/check-circle.svg") no-repeat 0 0.15em / 1.1rem;
	font-size: 0.95rem;
	line-height: 1.5;
}

.sp-compare-cards .col {
	padding-bottom: 16px;
}

.sp-areas {
	margin-top: 0 !important;
}

@media (max-width: 549px) {
	.sp-facts--inline {
		display: flex;
		width: 100%;
	}

	.sp-facts--inline li {
		padding: 0.7rem 0.75rem;
	}

	.sp-facts--inline strong {
		font-size: 1.25rem;
	}
}

@media (max-width: 549px) {
	.sp-facts--inline li {
		flex: 1 1 0;
		min-width: 0;
	}

	.sp-facts--inline span {
		white-space: normal;
	}
}

@media (max-width: 549px) {
	.sp-facts--inline li {
		padding: 0.6rem 0.65rem;
	}

	.sp-facts--inline strong {
		font-size: 1.08rem;
		white-space: nowrap;
	}

	.sp-facts--inline span {
		font-size: 0.74rem;
		line-height: 1.3;
	}
}

/* ==== Specialty pages: tabs and package cards ============================== */

.sp-head__icon {
	display: block;
	width: 64px;
	height: 64px;
	margin: 0 auto 1rem;
	padding: 12px;
	border-radius: 20px;
	background: linear-gradient(145deg, #FFF3E4 0%, var(--sp-peach) 100%);
}

.sp-tabs > .nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.45rem;
	margin: 0 auto 2rem;
	padding: 0.35rem;
	width: fit-content;
	max-width: 100%;
	border: 1px solid var(--sp-line);
	border-radius: 18px;
	background: var(--sp-cream);
}

.sp-tabs > .nav > li {
	margin: 0 !important;
}

.sp-tabs > .nav > li > a {
	padding: 0.6rem 1.1rem !important;
	border: 0 !important;
	border-radius: 14px !important;
	background: transparent !important;
	color: var(--sp-ink) !important;
	font-size: 0.95rem;
	font-weight: 650;
	text-transform: none;
	letter-spacing: 0;
	transition: background-color 0.25s ease, color 0.25s ease;
}

.sp-tabs > .nav > li > a:hover {
	background: #fff !important;
}

/* Six or more groups (Dermatology) still fit one row on desktop. */
@media (min-width: 850px) {
	.sp-tabs > .nav:has(> li:nth-child(6)) > li > a {
		padding: 0.6rem 0.8rem !important;
		font-size: 0.9rem;
	}
}

.sp-tabs > .nav > li.active > a {
	background: var(--sp-ink) !important;
	color: #fff !important;
	box-shadow: 0 6px 16px rgba(43, 33, 28, 0.18);
}

.sp-tabs .tab-panels {
	padding: 0;
	border: 0;
}

.sp-tabs .panel.active {
	animation: sp-rise 0.55s var(--sp-ease) both;
}

.sp-tab__lead {
	max-width: 46rem;
	margin: 0 auto 1.5rem;
	color: var(--sp-text);
	font-size: 1.05rem;
	line-height: 1.65;
	text-align: center;
}

.sp-tab__lead strong {
	color: var(--sp-ink);
}

.sp-pkgs {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 14px;
}

.sp-pkg {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	padding: 1.3rem 1.3rem 1.2rem;
	border: 1px solid var(--sp-line);
	border-radius: 20px;
	background: #fff;
	box-shadow: var(--sp-shadow);
	transition: transform 0.3s var(--sp-ease), box-shadow 0.3s var(--sp-ease), border-color 0.3s ease;
}

.sp-pkg:hover {
	border-color: rgba(189, 80, 11, 0.25);
	box-shadow: var(--sp-shadow-lg);
	transform: translateY(-3px);
}

.sp-pkg__time {
	align-self: flex-start;
	padding: 0.2rem 0.6rem 0.2rem 1.6rem;
	border-radius: 999px;
	background: var(--sp-cream) url("icons/clock.svg") no-repeat 0.45rem 50% / 0.95rem;
	color: var(--sp-primary-dark);
	font-size: 0.75rem;
	font-weight: 650;
}

.sp-pkg__name {
	margin: 0.35rem 0 0;
	color: var(--sp-ink);
	font-size: 1.12rem;
	font-weight: 720;
	letter-spacing: -0.015em;
}

.sp-pkg p {
	margin: 0;
	color: var(--sp-text);
	font-size: 0.93rem;
	line-height: 1.55;
}

.sp-tab__note {
	margin: 1.5rem 0 0;
	padding: 0.8rem 1rem 0.8rem 2.6rem;
	border-radius: 14px;
	background: var(--sp-cream) url("icons/chat-circle-dots.svg") no-repeat 0.85rem 50% / 1.25rem;
	color: var(--sp-ink);
	font-size: 0.93rem;
	text-align: left;
}

/* Empty state of [salpim_offers] (no offers published yet) */
.salpim-showcase--empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
	max-width: 36rem;
	margin: 0 auto;
	padding: 2rem 1.5rem;
	border: 1px dashed rgba(189, 80, 11, 0.3);
	border-radius: 24px;
	background: #fff;
	text-align: center;
}

.salpim-showcase__empty {
	margin: 0;
	color: var(--sp-ink);
	font-size: 1.05rem;
	font-weight: 550;
	line-height: 1.55;
}

.salpim-showcase__empty-link {
	padding: 0.7rem 1.3rem;
	border-radius: 12px;
	background: var(--sp-primary);
	color: #fff;
	font-weight: 650;
}

.salpim-showcase__empty-link:hover {
	background: var(--sp-primary-dark);
	color: #fff;
}

@media (max-width: 549px) {
	.sp-tabs > .nav {
		flex-wrap: nowrap;
		justify-content: flex-start;
		width: 100%;
		overflow-x: auto;
		scrollbar-width: none;
	}

	.sp-tabs > .nav::-webkit-scrollbar {
		display: none;
	}

	.sp-tabs > .nav > li > a {
		white-space: nowrap;
	}
}

.sp-pkgs {
	grid-template-columns: repeat(auto-fit, minmax(230px, 300px));
	justify-content: center;
}

@media (max-width: 549px) {
	.sp-pkgs {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ==== Treatments hub ======================================================== */

.sp-hub-hero {
	padding-top: 56px !important;
}

.banner p.sp-crumbs--light,
p.sp-crumbs--light {
	margin: 0 0 1rem;
	padding: 0.35rem 0.85rem;
	border-color: var(--sp-line);
	background: #fff;
	color: var(--sp-muted);
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
}

.sp-crumbs--light a {
	color: var(--sp-ink) !important;
}

.sp-crumbs--light .breadcrumb_last {
	color: var(--sp-muted) !important;
}

.sp-display--dark {
	margin: 0 0 0.35em;
	color: var(--sp-ink);
	font-size: clamp(2.4rem, 1.5rem + 3vw, 3.8rem);
	font-weight: 760;
	letter-spacing: -0.042em;
	line-height: 1.04;
}

.sp-sub--left {
	margin: 0;
	max-width: 38rem;
	text-align: left;
}

.sp-hub-hero__actions .col-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 0.6rem;
}

.sp-hub-hero__actions .button {
	margin: 0;
}

.sp-hub-grid {
	margin-top: 2.5rem !important;
}

.sp-mri-strip {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-top: 0.5rem;
	padding: 1.1rem 1.4rem;
	border-radius: 22px;
	background:
		radial-gradient(60% 140% at 100% 0%, rgba(251, 186, 51, 0.25) 0%, rgba(251, 186, 51, 0) 60%),
		var(--sp-night);
	color: rgba(255, 255, 255, 0.8);
	box-shadow: var(--sp-shadow);
	transition: transform 0.3s var(--sp-ease), box-shadow 0.3s var(--sp-ease);
}

.sp-mri-strip:hover {
	color: rgba(255, 255, 255, 0.9);
	box-shadow: var(--sp-shadow-lg);
	transform: translateY(-2px);
}

.sp-mri-strip img {
	flex: none;
	width: 52px;
	height: 52px;
	padding: 9px;
	border-radius: 16px;
	background: rgba(255, 237, 213, 0.95);
}

.sp-mri-strip strong {
	display: block;
	color: #fff;
	font-size: 1.15rem;
	font-weight: 720;
}

.sp-mri-strip small {
	display: block;
	font-size: 0.92rem;
}

.sp-mri-strip em {
	margin-left: auto;
	padding: 0.55rem 1rem;
	border-radius: 12px;
	background: #fff;
	color: var(--sp-primary-dark);
	font-style: normal;
	font-weight: 680;
	white-space: nowrap;
}

.sp-ways .sp-feature.icon-box {
	cursor: pointer;
}

@media (max-width: 849px) {
	.sp-hub-hero__actions .col-inner {
		justify-content: flex-start;
		margin-top: 1.5rem;
	}
}

@media (max-width: 549px) {
	.sp-mri-strip {
		flex-wrap: wrap;
	}

	.sp-mri-strip em {
		margin-left: 0;
	}
}

.sp-ways {
	margin-top: 0 !important;
}

/* ==== Partner clinics ======================================================= */

.sp-clinic {
	padding-bottom: 72px;
}

.sp-clinic:last-of-type {
	padding-bottom: 0;
}

.sp-clinic--reverse > .col:first-child {
	order: 2;
}

/* The clinic of a specialty page sits between the live offers and the consultation band: less air below it, and
   on the hair page a rule before the results the clinic shares. */
.sp-clinic-feature {
	padding-bottom: 24px !important;
}

.sp-clinic-feature .sp-clinic {
	padding-bottom: 0;
}

.sp-clinic-results {
	margin-top: 4.5rem;
	padding-top: 4rem;
	border-top: 1px solid var(--sp-line);
}

.sp-clinic-results .sp-head {
	margin-bottom: 0.5rem;
}

/* On a phone the three posters sit side by side to swipe, the next one showing, instead of three screens in a column. */
@media (max-width: 549px) {
	.sp-clinic-results {
		margin-top: 3rem;
		padding-top: 3rem;
	}

	.sp-clinic-feature .sp-results.row.sp-stagger {
		flex-wrap: nowrap;
		overflow-x: auto;
		scroll-snap-type: x proximity;
		scrollbar-width: none;
	}

	.sp-clinic-feature .sp-results.row.sp-stagger::-webkit-scrollbar {
		display: none;
	}

	.sp-clinic-feature .sp-results.row.sp-stagger > .col {
		flex: 0 0 74%;
		max-width: 74%;
		scroll-snap-align: start;
	}
}

.sp-clinic__slider,
.sp-clinic__photo .img-inner {
	border-radius: 24px;
	overflow: hidden;
}

.sp-clinic__slider {
	box-shadow: var(--sp-shadow-lg);
}

.sp-clinic__photo .img-inner {
	box-shadow: var(--sp-shadow-lg);
}

.sp-clinic__slider .sp-clinic__photo .img-inner {
	border-radius: 0;
	box-shadow: none;
}

/* ==== Photo rail ([salpim_rail]) ============================================ */

.sp-rail {
	position: relative;
}

.sp-rail__track {
	display: flex;
	gap: 0;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.sp-rail__track::-webkit-scrollbar {
	display: none;
}

.sp-rail__track:focus-visible {
	outline: 3px solid var(--sp-primary);
	outline-offset: -3px;
}

.sp-rail__track > * {
	flex: 0 0 var(--rail-w, 100%);
	min-width: 0;
	margin: 0 !important;
	scroll-snap-align: start;
}

@media (max-width: 849px) {
	.sp-rail__track > * {
		flex-basis: var(--rail-w-md, var(--rail-w, 100%));
	}
}

@media (max-width: 549px) {
	.sp-rail__track > * {
		flex-basis: var(--rail-w-sm, var(--rail-w-md, var(--rail-w, 100%)));
	}
}

.sp-rail__btn {
	position: absolute;
	top: 50%;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	margin: -22px 0 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 6px 18px rgba(33, 24, 19, 0.22);
	color: var(--sp-ink);
	cursor: pointer;
	transition: background-color 0.2s ease, transform 0.2s ease;
}

.sp-rail__btn[hidden] {
	display: none;
}

.sp-rail__btn:hover {
	background: #fff;
	transform: scale(1.06);
}

.sp-rail__btn svg {
	width: 22px;
	height: 22px;
}

.sp-rail__btn--prev {
	left: 12px;
}

.sp-rail__btn--next {
	right: 12px;
}

.sp-rail__count {
	position: absolute;
	right: 14px;
	bottom: 14px;
	z-index: 2;
	padding: 0.2rem 0.65rem;
	border-radius: 999px;
	background: rgba(33, 24, 19, 0.62);
	color: #fff;
	font-size: 0.78rem;
	font-weight: 650;
	font-variant-numeric: tabular-nums;
	line-height: 1.5;
	pointer-events: none;
}

.sp-rail__count[hidden] {
	display: none;
}

.sp-clinic__logo {
	margin-bottom: 1rem !important;
}

.sp-clinic__logo img {
	max-height: 56px;
	width: auto;
	object-fit: contain;
}

.sp-clinic__area {
	margin: 0 0 0.3rem;
	padding-left: 1.4rem;
	background: url("icons/map-pin-line.svg") no-repeat 0 50% / 1.05rem;
	color: var(--sp-primary);
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.sp-clinic__name {
	margin: 0 0 0.15rem;
	color: var(--sp-ink);
	font-size: clamp(1.45rem, 1.2rem + 0.8vw, 1.9rem);
	font-weight: 740;
	letter-spacing: -0.025em;
	line-height: 1.15;
}

.sp-clinic__ko {
	margin: 0 0 1rem;
	color: var(--sp-muted);
	font-size: 0.95rem;
}

.sp-clinic .sp-chips {
	margin: 0 0 1.1rem;
}

.sp-clinic__address {
	margin: 0 0 1.3rem;
	padding: 0.75rem 0.9rem;
	border-left: 3px solid var(--sp-peach);
	color: var(--sp-text);
	font-size: 0.9rem;
	line-height: 1.5;
}

.sp-partner-band > .col-inner {
	border: 1px solid var(--sp-line);
	background: #fff;
	box-shadow: var(--sp-shadow);
}

.sp-partner-band .sp-body {
	margin: 0;
}

@media (max-width: 849px) {
	.sp-clinic--reverse > .col:first-child {
		order: 0;
	}

	.sp-clinic {
		padding-bottom: 48px;
	}

	.sp-partner-band__actions .col-inner {
		text-align: left !important;
		margin-top: 1rem;
	}
}

/* Flatsome indents list items inside columns (.col-inner ul li { margin-left: 1.3em }). */
.sp-chips li,
.sp-checklist li,
.sp-vvip__list li,
.sp-mini-card li,
.sp-next li,
.sp-ask__list li,
.sp-facts li,
.sp-bodymap__tests li,
.sp-journey__step,
.sp-clinicmap__list li,
.sp-footer__links li {
	margin-left: 0 !important;
}

.sp-clinic__logo.img {
	width: auto !important;
	margin: 0 0 1.1rem !important;
}

.sp-clinic__logo .img-inner,
.sp-clinic__logo img {
	width: auto !important;
	height: 46px !important;
	max-width: 240px;
	object-fit: contain;
	object-position: left center;
}

/* Partner logo strip: soft fade at both ends */
.sp-logos .flickity-viewport {
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
}

.sp-logos .ux-logo {
	margin: 0 14px;
}

/* ==== Request status (How it works) ========================================= */

.sp-status {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: sp-status;
}

.sp-status::before {
	content: "";
	position: absolute;
	left: 27px;
	top: 28px;
	bottom: 28px;
	width: 2px;
	background: linear-gradient(180deg, #F59E0B 0%, var(--sp-primary) 50%, #2F7D4F 100%);
	opacity: 0.35;
}

.sp-status__item {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 1.1rem;
	margin: 0 0 14px !important;
	padding: 1.2rem 1.3rem 1.2rem 0;
	border-radius: 20px;
}

.sp-status__item::before {
	content: "";
	flex: none;
	position: relative;
	z-index: 1;
	width: 56px;
	height: 56px;
	border-radius: 18px;
	background: #fff url("icons/clock.svg") no-repeat 50% 50% / 28px;
	box-shadow: var(--sp-shadow);
}

.sp-status__item.is-confirmed::before {
	background-image: url("icons/calendar-check.svg");
}

.sp-status__item.is-completed::before {
	background-image: url("icons/check-circle.svg");
}

.sp-status__item p {
	margin: 0.15rem 0 0;
	color: var(--sp-text);
	line-height: 1.6;
}

.sp-status__item p strong {
	display: block;
	color: var(--sp-ink);
}

.sp-status__badge {
	position: absolute;
	right: 0;
	top: 1.1rem;
	padding: 0.25rem 0.7rem;
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 700;
}

.is-pending .sp-status__badge {
	background: #FEF3D6;
	color: #8C5E00;
}

.is-confirmed .sp-status__badge {
	background: #FBE3D2;
	color: var(--sp-primary-dark);
}

.is-completed .sp-status__badge {
	background: #E6F4EA;
	color: #137333;
}

.sp-status__item p {
	padding-right: 6.5rem;
}

.sp-roles .sp-mini-card {
	padding: 2rem 2rem 1.5rem;
}

@media (max-width: 549px) {
	.sp-status__badge {
		position: static;
		display: inline-block;
		margin-bottom: 0.4rem;
	}

	.sp-status__item {
		flex-wrap: wrap;
		padding-right: 0;
	}

	.sp-status__item p {
		padding-right: 0;
	}

	.sp-status__item::before {
		width: 48px;
		height: 48px;
	}

	.sp-status::before {
		left: 23px;
	}
}

/* FAQ page: accordions inside the topic tabs */
.sp-faq-page .sp-accordion {
	padding: 0.5rem 2rem;
	border: 1px solid var(--sp-line);
	border-radius: 24px;
	background: var(--sp-cream);
}

.sp-faq-page .sp-tabs > .nav {
	margin-bottom: 2.5rem;
}

@media (max-width: 549px) {
	.sp-faq-page .sp-accordion {
		padding: 0.25rem 1rem;
	}
}

.sp-display--dark {
	text-shadow: none;
}

/* ==== Contact page and forms (Contact Form 7) ============================== */

.sp-contact {
	padding-bottom: 96px !important;
}

.sp-channels {
	margin: 0 0 1.5rem;
	padding: 0;
	list-style: none;
}

.sp-channels li {
	margin: 0 0 10px !important;
}

.sp-channels a {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	padding: 1rem 1.1rem;
	border: 1px solid var(--sp-line);
	border-radius: 18px;
	background: #fff;
	color: var(--sp-ink);
	box-shadow: var(--sp-shadow);
	transition: transform 0.25s var(--sp-ease), border-color 0.25s ease;
}

.sp-channels a:hover {
	border-color: rgba(189, 80, 11, 0.3);
	color: var(--sp-ink);
	transform: translateX(3px);
}

.sp-channels img {
	flex: none;
	width: 46px;
	height: 46px;
	padding: 8px;
	border-radius: 14px;
	background: var(--sp-peach);
}

.sp-channels strong {
	display: block;
	font-weight: 700;
}

.sp-channels small {
	display: block;
	color: var(--sp-muted);
	font-size: 0.88rem;
}

.sp-contact__note {
	padding: 1.25rem 1.3rem;
	border-radius: 18px;
	background: rgba(255, 255, 255, 0.6);
	border: 1px dashed var(--sp-line);
}

.sp-contact__note .sp-body {
	margin-bottom: 0.6rem;
}

.sp-contact__small {
	margin: 0;
	color: var(--sp-muted);
	font-size: 0.85rem;
}

.sp-form-card > .col-inner {
	border: 1px solid var(--sp-line);
	box-shadow: var(--sp-shadow-lg);
}

.sp-form-card .sp-h3 {
	font-size: 1.6rem;
}

.sp-form-card__intro {
	color: var(--sp-muted);
	font-size: 0.93rem;
}

.sp-form {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.sp-form__row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
}

.sp-field {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	margin: 0;
	color: var(--sp-ink);
	font-size: 0.9rem;
	font-weight: 650;
}

.sp-field > span:first-child small {
	margin-left: 0.25rem;
	color: var(--sp-muted);
	font-weight: 500;
}

.sp-form input[type="text"],
.sp-form input[type="email"],
.sp-form input[type="tel"],
.sp-form select,
.sp-form textarea {
	width: 100%;
	margin: 0;
	padding: 0.75rem 0.9rem;
	border: 1px solid rgba(97, 39, 9, 0.16);
	border-radius: 12px;
	background: #fff;
	box-shadow: none;
	color: var(--sp-ink);
	font-size: 1rem;
	font-weight: 450;
	line-height: 1.4;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.sp-form input,
.sp-form select {
	height: 3rem;
}

.sp-form textarea {
	min-height: 8rem;
	resize: vertical;
}

.sp-form input:focus,
.sp-form select:focus,
.sp-form textarea:focus {
	border-color: var(--sp-primary);
	box-shadow: 0 0 0 4px rgba(189, 80, 11, 0.14);
	outline: none;
}

.sp-form ::placeholder {
	color: #A8968A;
}

.sp-form .wpcf7-form-control-wrap {
	display: block;
}

.sp-form .wpcf7-not-valid-tip {
	margin-top: 0.3rem;
	color: #B3261E;
	font-size: 0.82rem;
	font-weight: 550;
}

.sp-form .wpcf7-not-valid {
	border-color: #B3261E !important;
}

.sp-field--checks .wpcf7-checkbox {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.sp-field--checks .wpcf7-list-item {
	margin: 0;
}

.sp-field--checks .wpcf7-list-item label {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	margin: 0;
	padding: 0.5rem 0.85rem;
	border: 1px solid var(--sp-line);
	border-radius: 999px;
	background: var(--sp-cream);
	color: var(--sp-ink);
	font-size: 0.88rem;
	font-weight: 550;
	cursor: pointer;
}

.sp-field--checks input[type="checkbox"] {
	margin: 0;
	accent-color: var(--sp-primary);
}

.sp-form__consent {
	color: var(--sp-text);
	font-size: 0.88rem;
	line-height: 1.5;
}

.sp-form__consent .wpcf7-list-item {
	margin: 0;
}

.sp-form__consent label {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	font-weight: 450;
}

.sp-form__consent input[type="checkbox"] {
	flex: none;
	width: 18px;
	height: 18px;
	margin: 0.15rem 0 0;
	accent-color: var(--sp-primary);
}

.sp-form__submit {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.sp-form .sp-submit {
	margin: 0;
	padding: 0 1.6em;
	height: 3.1rem;
	border: 0;
	border-radius: 12px;
	background: var(--sp-primary);
	color: #fff;
	font-size: 1rem;
	font-weight: 650;
	text-transform: none;
	letter-spacing: 0;
	box-shadow: 0 6px 18px rgba(189, 80, 11, 0.28);
}

.sp-form .sp-submit:hover {
	background: var(--sp-primary-dark);
}

.sp-form .sp-submit:disabled {
	opacity: 0.6;
}

.wpcf7 form .wpcf7-response-output {
	margin: 1rem 0 0;
	padding: 0.8rem 1rem;
	border-radius: 12px;
	font-size: 0.93rem;
}

.wpcf7 form.sent .wpcf7-response-output {
	border-color: #2F7D4F;
	background: #E6F4EA;
	color: #137333;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output {
	border-color: #E8A23A;
	background: #FEF3D6;
	color: #8C5E00;
}

@media (max-width: 549px) {
	.sp-form__row {
		grid-template-columns: minmax(0, 1fr);
	}
}

.sp-form select {
	-webkit-appearance: none;
	appearance: none;
	padding-right: 2.6rem;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%23BD500B' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 0.9rem center / 16px;
}

/* ==== About ================================================================= */

.sp-about-hero {
	padding-top: 56px !important;
}

.sp-accent--dark {
	background: linear-gradient(92deg, var(--sp-orange) 0%, var(--sp-primary) 80%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.sp-about-hero .sp-sub--left {
	margin-bottom: 1.75rem;
}

.sp-facts-list {
	display: grid;
	grid-template-columns: minmax(0, 40%) minmax(0, 1fr);
	gap: 0;
	margin: 1.5rem 0 0;
	border: 1px solid var(--sp-line);
	border-radius: 20px;
	background: #fff;
	overflow: hidden;
}

.sp-facts-list dt,
.sp-facts-list dd {
	margin: 0;
	padding: 0.8rem 1.1rem;
	border-bottom: 1px solid var(--sp-line);
	font-size: 0.95rem;
}

.sp-facts-list dt {
	color: var(--sp-muted);
	font-weight: 600;
}

.sp-facts-list dd {
	color: var(--sp-ink);
	font-weight: 550;
}

.sp-facts-list dt:nth-last-of-type(1),
.sp-facts-list dd:nth-last-of-type(1) {
	border-bottom: 0;
}

.sp-gallery.row-masonry .gallery-col,
.sp-gallery .gallery-col {
	padding-bottom: 12px !important;
}

.sp-facts-list dt,
.sp-facts-list dd {
	text-transform: none;
	letter-spacing: 0;
	line-height: 1.45;
	overflow-wrap: anywhere;
}

/* Phones: the label above its value. */
@media (max-width: 549px) {
	.sp-facts-list {
		grid-template-columns: minmax(0, 1fr);
	}

	.sp-facts-list dt {
		padding-bottom: 0;
		border-bottom: 0;
		font-size: 0.85rem;
	}
}

.sp-gallery .box-text {
	padding: 0.45rem 0.2rem 0;
}

.sp-gallery .box-text p,
.sp-gallery .box-text {
	color: var(--sp-muted);
	font-size: 0.82rem;
	line-height: 1.4;
}

/* ==== Long-form pages (legal) and guides ==================================== */

.sp-legal__updated {
	margin: 1rem 0 0;
	color: var(--sp-muted);
	font-size: 0.88rem;
}

.sp-toc > .col-inner {
	top: 100px;
}

.sp-toc__title {
	margin: 0 0 0.75rem;
	color: var(--sp-muted);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.sp-toc ol {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: sp-toc;
	border-left: 2px solid var(--sp-line);
}

.sp-toc li {
	margin: 0 !important;
	counter-increment: sp-toc;
}

.sp-toc a {
	display: block;
	padding: 0.4rem 0 0.4rem 1rem;
	margin-left: -2px;
	border-left: 2px solid transparent;
	color: var(--sp-text);
	font-size: 0.92rem;
	line-height: 1.35;
}

.sp-toc a:hover {
	border-left-color: var(--sp-primary);
	color: var(--sp-primary);
}

.sp-legal,
.single-post .entry-content {
	color: var(--sp-text);
	font-size: 1.04rem;
	line-height: 1.75;
}

.sp-legal h2,
.single-post .entry-content h2 {
	margin: 2.4rem 0 0.8rem;
	color: var(--sp-ink);
	font-size: 1.45rem;
	font-weight: 720;
	letter-spacing: -0.02em;
	line-height: 1.25;
	scroll-margin-top: 100px;
}

.sp-legal h2:first-child {
	margin-top: 0;
}

.sp-legal ul,
.single-post .entry-content ul {
	margin: 0 0 1.3em;
	padding: 0;
	list-style: none;
}

.sp-legal ul li,
.single-post .entry-content ul li {
	position: relative;
	margin: 0 0 0.5rem !important;
	padding-left: 1.4rem;
}

.sp-legal ul li::before,
.single-post .entry-content ul li::before {
	content: "";
	position: absolute;
	left: 0.25rem;
	top: 0.72em;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--sp-orange);
}

.sp-legal strong,
.single-post .entry-content strong {
	color: var(--sp-ink);
}

.sp-legal__table {
	margin: 0 0 1.5rem;
	overflow-x: auto;
	border: 1px solid var(--sp-line);
	border-radius: 16px;
}

.sp-legal__table table {
	margin: 0;
	min-width: 520px;
}

.sp-legal__table th,
.sp-legal__table td {
	padding: 0.7rem 1rem !important;
	font-size: 0.92rem;
	letter-spacing: 0;
	text-transform: none;
	line-height: 1.45;
}

.sp-legal__table th {
	background: var(--sp-cream);
	color: var(--sp-ink);
	font-weight: 700;
}

.sp-legal__table td:first-child {
	color: var(--sp-ink);
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 0.84rem;
}

/* Guides grid (blog_posts) */
.sp-posts .box-blog-post {
	height: 100%;
	border: 1px solid var(--sp-line);
	border-radius: 22px;
	overflow: hidden;
	background: #fff;
	box-shadow: var(--sp-shadow);
	transition: transform 0.3s var(--sp-ease), box-shadow 0.3s var(--sp-ease);
}

.sp-posts .box-blog-post:hover {
	box-shadow: var(--sp-shadow-lg);
	transform: translateY(-3px);
}

.sp-posts .box-text {
	padding: 1.3rem 1.4rem 1.4rem !important;
}

.sp-posts .post-title {
	color: var(--sp-ink);
	font-weight: 720;
	letter-spacing: -0.015em;
	line-height: 1.3;
}

.sp-posts .is-divider {
	display: none;
}

.sp-posts .from_the_blog_excerpt {
	color: var(--sp-text);
	font-size: 0.95rem;
}

.sp-soon {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
	padding: 2.5rem 1.5rem;
	border: 1px dashed rgba(189, 80, 11, 0.3);
	border-radius: 24px;
	text-align: center;
}

.sp-soon img {
	width: 64px;
	height: 64px;
	padding: 12px;
	border-radius: 20px;
	background: var(--sp-peach);
}

.sp-soon p {
	margin: 0;
	color: var(--sp-text);
}

/* Single post */
.single-post .entry-header .entry-title {
	color: var(--sp-ink);
	font-size: clamp(2rem, 1.4rem + 2vw, 2.8rem);
	font-weight: 760;
	letter-spacing: -0.035em;
	line-height: 1.12;
}

.single-post .entry-image img {
	border-radius: 24px;
}

.single-post .article-inner {
	max-width: 760px;
	margin: 0 auto;
}

.sp-post-cta-row {
	margin: 3rem 0 1rem !important;
}

.sp-post-cta .sp-h3 {
	margin-bottom: 0.25rem;
	color: #fff;
}

.sp-post-cta p {
	margin: 0;
	color: rgba(255, 255, 255, 0.85);
}

@media (max-width: 849px) {
	.sp-toc {
		margin-bottom: 1.5rem;
	}

	.sp-toc ol {
		display: flex;
		flex-wrap: wrap;
		gap: 0.4rem;
		border-left: 0;
	}

	.sp-toc a {
		margin: 0;
		padding: 0.35rem 0.75rem;
		border: 1px solid var(--sp-line);
		border-radius: 999px;
		font-size: 0.85rem;
	}
}

.sp-posts .post-item > .col-inner {
	height: 100%;
}

.sp-posts .box-blog-post {
	display: flex;
	flex-direction: column;
}

.sp-posts .box-blog-post .box-text {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.sp-posts .box-text-inner {
	display: flex;
	flex: 1;
	flex-direction: column;
}

.sp-posts .cat-label {
	align-self: flex-start;
	padding: 0.2rem 0.6rem;
	border-radius: 999px;
	background: var(--sp-peach);
	color: var(--sp-primary-dark);
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	opacity: 1;
}

.sp-posts .post-meta {
	color: var(--sp-muted);
	font-size: 0.8rem;
}

.sp-posts .button.is-link,
.sp-posts .button {
	align-self: flex-start;
	margin: auto 0 0 !important;
	padding: 0.8rem 0 0 !important;
	color: var(--sp-primary) !important;
	font-size: 0.92rem;
	font-weight: 680;
	text-transform: none;
	letter-spacing: 0;
}

.sp-posts .button::after {
	content: " →";
}

.single-post .badge.post-date {
	display: none;
}

/* 404 */
.sp-404__code {
	margin: 0 0 0.5rem;
	background: linear-gradient(92deg, var(--sp-gold) 0%, var(--sp-primary) 80%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	font-size: clamp(5rem, 3rem + 8vw, 9rem);
	font-weight: 800;
	letter-spacing: -0.06em;
	line-height: 1;
}

.sp-404 .sp-sub {
	margin-bottom: 1.75rem;
}

.sp-next--404 {
	margin-top: 3.5rem;
}

/* Search results */
.search-results .page-title {
	letter-spacing: 0.08em;
}

.search-results .article-inner .entry-header {
	text-align: left !important;
}

.search-results .entry-title {
	font-size: 1.5rem;
	text-align: left;
}

.search-results .entry-title a {
	color: var(--sp-ink);
}

.search-results .entry-divider,
.search-results .is-divider {
	display: none;
}

.search-results .entry-summary,
.search-results .entry-content {
	padding-top: 0.25rem;
	text-align: left;
}

.search-results .entry-summary .more-link,
.search-results .entry-content .more-link {
	display: none;
}

.search-results article {
	padding: 1.5rem 0 !important;
	border-bottom: 1px solid var(--sp-line);
}

.search-results .large-columns-1,
.search-results .post-sidebar,
.search-results #content > .row > .col {
	max-width: 820px;
	margin: 0 auto;
}

.search-results .entry-header-text {
	padding: 0 !important;
	text-align: left !important;
}

.search-results .entry-category:empty,
.search-results .entry-meta:empty,
.search-results footer.entry-meta {
	display: none;
}

.search-results .entry-title {
	margin: 0 0 0.35rem;
}

.search-results .entry-summary p {
	margin: 0;
}

.search-results .entry-content {
	padding: 0 !important;
}

.search-results .entry-summary .text-center {
	display: none;
}

.search-results article {
	margin: 0 !important;
	padding: 1.4rem 0 !important;
}

.search-results article .article-inner {
	padding: 0 !important;
	border: 0 !important;
}


/* ==== Logo strip: no script, fixed height, so nothing moves after the page has loaded ========== */

.sp-strip {
	height: 74px;
	overflow: hidden;
	contain: layout paint;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
}

.sp-strip__track {
	display: flex;
	width: max-content;
	height: 100%;
}

.sp-strip__set {
	display: flex;
	flex: none;
	align-items: center;
	height: 100%;
}

.sp-strip__item {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	height: 74px;
	margin: 0 clamp(18px, 2.4vw, 36px);
}

.sp-strip__item img {
	display: block;
	width: auto;
	height: var(--h, 40px);
	max-width: none;
	filter: grayscale(1) contrast(0.9);
	opacity: 0.62;
	transition: filter 0.35s ease, opacity 0.35s ease;
}

a.sp-strip__item:hover img,
a.sp-strip__item:focus-visible img {
	filter: none;
	opacity: 1;
}

@media (prefers-reduced-motion: no-preference) {
	.sp-strip__track {
		animation: sp-strip calc(var(--n, 7) * 4.5s) linear infinite;
	}

	.sp-strip:hover .sp-strip__track {
		animation-play-state: paused;
	}
}

@keyframes sp-strip {
	to { transform: translate3d(-50%, 0, 0); }
}

/* Without motion the strip is a static, centred, wrapping row. */
@media (prefers-reduced-motion: reduce) {
	.sp-strip {
		height: auto;
		-webkit-mask-image: none;
		mask-image: none;
	}

	.sp-strip__track {
		width: auto;
		justify-content: center;
	}

	.sp-strip__set {
		flex-wrap: wrap;
		justify-content: center;
		height: auto;
	}

	.sp-strip__set[aria-hidden="true"] {
		display: none;
	}
}

/* ==== Language hint (src/I18n.php): "This page is also available in ..." ==== */
.sp-langhint {
	position: fixed;
	left: 50%;
	bottom: 24px;
	z-index: 1100;
	display: flex;
	align-items: center;
	gap: 0.75rem;
	max-width: calc(100% - 32px);
	padding: 0.6rem 0.6rem 0.6rem 1.1rem;
	transform: translateX(-50%);
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 12px 30px rgba(43, 33, 28, 0.18), 0 0 0 1px var(--sp-line);
	color: var(--sp-ink);
	font-size: 0.9rem;
}

.sp-langhint p {
	margin: 0;
}

.sp-langhint a {
	flex: none;
	padding: 0.45rem 0.8rem;
	border-radius: 10px;
	background: var(--sp-primary);
	color: #fff;
	font-weight: 650;
	white-space: nowrap;
}

.sp-langhint a:hover {
	background: var(--sp-primary-dark);
	color: #fff;
}

.sp-langhint button {
	flex: none;
	width: 32px;
	height: 32px;
	margin: 0;
	padding: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--sp-muted);
	font-size: 1.3rem;
	line-height: 1;
}

@media (max-width: 549px) {
	.sp-langhint {
		bottom: 84px;
		flex-wrap: wrap;
		width: calc(100% - 32px);
	}

	.sp-langhint p {
		flex: 1 1 100%;
	}
}