@font-face {
	font-family: "Montserrat";
	src: url("../fonts/montserrat-latin-variable.woff2") format("woff2");
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
}

@font-face {
	font-family: "Poppins";
	src: url("../fonts/poppins-latin-400.woff2") format("woff2");
	font-style: normal;
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: "Poppins";
	src: url("../fonts/poppins-latin-500.woff2") format("woff2");
	font-style: normal;
	font-weight: 500;
	font-display: swap;
}

@font-face {
	font-family: "Poppins";
	src: url("../fonts/poppins-latin-600.woff2") format("woff2");
	font-style: normal;
	font-weight: 600;
	font-display: swap;
}

@font-face {
	font-family: "Poppins";
	src: url("../fonts/poppins-latin-700.woff2") format("woff2");
	font-style: normal;
	font-weight: 700;
	font-display: swap;
}

html,
body.msuie-has-landing {
	max-width: 100%;
}

.msuie-landing {
	--msuie-ink: #282827;
	--msuie-paper: #faf9f5;
	--msuie-paper-deep: #e9e7df;
	--msuie-paper-soft: #f2f0ea;
	--msuie-lime: #efede7;
	--msuie-sage: #e4e2da;
	--msuie-line: rgba(40, 40, 39, 0.15);
	--msuie-serif: "Poppins", sans-serif;
	--msuie-sans: "Poppins", sans-serif;
	--msuie-title-font: "Montserrat";
	--msuie-body-font: "Poppins";
	--msuie-button-font: "Poppins";
	position: relative;
	width: 100%;
	max-width: none;
	margin: 0;
	background: var(--msuie-paper);
	color: var(--msuie-ink);
	font-family: var(--msuie-sans);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.45;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	font-feature-settings: "kern", "ss01", "ss02";
	font-synthesis: none;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	overscroll-behavior-x: none;
	touch-action: pan-y;
}

.msuie-landing *,
.msuie-landing *::before,
.msuie-landing *::after {
	box-sizing: border-box;
}

.msuie-landing :where(h1, h2, h3, p, figure, blockquote, dl, dd) {
	margin: 0;
}

.msuie-landing :where(button, input, select, textarea) {
	font: inherit;
}

.msuie-landing :where(a) {
	color: inherit;
	text-decoration: none;
}

.msuie-landing :where(img, video) {
	display: block;
	max-width: 100%;
}

.msuie-landing :where(button, a, summary):focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 4px;
}

.msuie-landing .screen-reader-text {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.msuie-skip-link {
	position: fixed;
	top: 10px;
	left: 10px;
	z-index: 100002;
	padding: 10px 14px;
	background: var(--msuie-paper);
	color: var(--msuie-ink);
	font-size: 13px;
	font-weight: 700;
	transform: translateY(-160%);
}

.msuie-skip-link:focus {
	transform: translateY(0);
}

.msuie-boot {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	inset: 0;
	z-index: 200000;
	display: none;
	place-items: center;
	background: #000;
	opacity: 1;
	visibility: visible;
	transition: opacity 200ms cubic-bezier(0.22, 1, 0.36, 1), visibility 200ms linear;
}

.msuie-boot-enabled .msuie-boot {
	display: grid;
}

.msuie-boot img {
	position: relative;
	z-index: 1;
	width: clamp(132px, 38vw, 178px);
	height: auto;
	opacity: 0;
	transform: scale(0.985);
	animation: msuie-boot-mark 180ms cubic-bezier(0.22, 1, 0.36, 1) 20ms forwards;
}

.msuie-entry-gate {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	inset: 0;
	z-index: 2;
	display: block;
	width: 100%;
	height: 100%;
	padding: 0;
	border: 0;
	background: transparent;
	color: #fff;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

.msuie-entry-gate[hidden] {
	display: none;
}

.msuie-entry-gate__prompt {
	position: absolute;
	left: 50%;
	bottom: max(8svh, calc(30px + env(safe-area-inset-bottom)));
	transform: translateX(-50%);
	color: rgba(255, 255, 255, 0.92);
	font-family: var(--msuie-sans);
	font-size: clamp(0.625rem, 2.6vw, 0.75rem);
	font-weight: 500;
	letter-spacing: 0.18em;
	line-height: 1.2;
	text-transform: uppercase;
	white-space: nowrap;
	animation: msuie-entry-pulse 2.35s cubic-bezier(0.45, 0, 0.55, 1) infinite;
}

.msuie-entry-gate:focus-visible {
	outline: 1px solid rgba(255, 255, 255, 0.8);
	outline-offset: -14px;
}

.msuie-boot.is-entering .msuie-entry-gate__prompt {
	animation: none;
	opacity: 0.45;
}

.msuie-boot.is-leaving {
	opacity: 0;
	visibility: hidden;
	/* Absorb any launch-time swipe until the document is unlocked after fade-out. */
	pointer-events: auto;
}

html.msuie-boot-enabled,
body.msuie-booting {
	overflow: hidden;
	overscroll-behavior: none;
	touch-action: none;
}

@keyframes msuie-boot-mark {
	from { opacity: 0; transform: scale(0.985); }
	to { opacity: 1; transform: scale(1); }
}

@keyframes msuie-entry-pulse {
	0%, 100% { opacity: 0.26; }
	50% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
	.msuie-entry-gate__prompt {
		animation: none;
		opacity: 0.9;
	}
}

.msuie-hero {
	--msuie-hero-progress: 0;
	--msuie-window-scale: 2.6;
	--msuie-window-y: 0px;
	--msuie-window-frame-opacity: 0;
	--msuie-window-view-left: 21.5%;
	--msuie-window-view-top: 32.25%;
	--msuie-window-view-width: 57.2%;
	--msuie-window-view-height: 47.4%;
	--msuie-video-wash-opacity: 0.62;
	--msuie-content-opacity: 1;
	--msuie-content-shift: 0px;
	position: relative;
	display: block;
	height: 160vh;
	height: calc(100lvh + 60svh);
	overflow: visible;
	background: var(--msuie-paper);
	color: #fff;
	isolation: isolate;
}

.msuie-hero-stage {
	position: sticky;
	z-index: 0;
	top: 0;
	width: 100%;
	height: 100vh;
	height: 100lvh;
	overflow: hidden;
	overflow: clip;
	background: var(--msuie-paper);
	color: #fff;
	backface-visibility: hidden;
}

.msuie-hero-media {
	position: absolute;
	z-index: 0;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background: var(--msuie-paper);
	backface-visibility: hidden;
	transform: translate3d(0, 0, 0);
	will-change: transform;
}

/* Once the camera retreats, this opaque scene sits above hero copy and seals the PNG's transparent outer pixels. */
.msuie-hero.is-pulling-back .msuie-hero-media {
	z-index: 3;
}

.msuie-window-scene {
	position: absolute;
	top: 0;
	left: 50%;
	/* Keep the same phone-width proportion; short screens use height as the safety boundary. */
	width: 88vw;
	max-width: 41.5vh;
	width: min(88vw, 41.5vh);
	width: min(88vw, 41.5svh);
	aspect-ratio: 849 / 1509;
	transform: translate3d(-50%, var(--msuie-window-y), 0) scale(var(--msuie-window-scale));
	transform-origin: 50% 56%;
	will-change: transform, opacity;
	backface-visibility: hidden;
}

.msuie-window-view {
	position: absolute;
	z-index: 0;
	top: var(--msuie-window-view-top);
	left: var(--msuie-window-view-left);
	width: var(--msuie-window-view-width);
	height: var(--msuie-window-view-height);
	overflow: hidden;
	/* The opaque PNG frame supplies the window shape; keep the moving video uncut beneath it. */
	border-radius: 0;
	background: #e5e3dc;
	box-shadow: inset 0 0 0 1px rgba(40, 40, 39, 0.14);
	transform: translate3d(0, 0, 0);
	backface-visibility: hidden;
}

.msuie-window-frame {
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	opacity: var(--msuie-window-frame-opacity);
	pointer-events: none;
	transform: translate3d(0, 0, 0);
	will-change: transform, opacity;
	backface-visibility: hidden;
}

.msuie-hero-video {
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center center;
	transform: translate3d(0, 0, 0);
	will-change: transform;
	backface-visibility: hidden;
}


.msuie-hero-wash {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(8, 18, 25, 0.42) 0%, rgba(8, 18, 25, 0.04) 34%, rgba(8, 18, 25, 0.08) 62%, rgba(8, 18, 25, 0.46) 100%),
		linear-gradient(90deg, rgba(8, 18, 25, 0.32), transparent 62%);
	opacity: var(--msuie-video-wash-opacity);
	pointer-events: none;
	will-change: opacity;
}

.msuie-nav {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 3;
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	min-height: 74px;
	padding: max(10px, env(safe-area-inset-top)) 18px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.26);
	background: linear-gradient(180deg, rgba(6, 7, 6, 0.22), transparent);
}

.msuie-wordmark {
	display: inline-flex;
	align-items: center;
	justify-self: start;
	width: 130px;
	height: 43px;
	overflow: hidden;
}

.msuie-wordmark img {
	width: 130px;
	height: auto;
	object-fit: contain;
	filter: brightness(0) invert(1);
}

.msuie-nav-links {
	display: none;
}

.msuie-bag-button {
	position: relative;
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, 0.46);
	border-radius: 50%;
	background: rgba(20, 22, 19, 0.12);
	color: #fff;
	cursor: pointer;
	backdrop-filter: blur(10px);
}

.msuie-bag-button svg {
	width: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.msuie-cart-count {
	position: absolute;
	top: -2px;
	right: -2px;
	display: grid;
	place-items: center;
	min-width: 17px;
	height: 17px;
	padding: 0 4px;
	border-radius: 99px;
	background: var(--msuie-lime);
	color: #10120e;
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
}

.msuie-cart-count.is-empty {
	display: none;
}

.msuie-hero-content {
	position: absolute;
	z-index: 2;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: flex;
	width: 100%;
	padding: calc(var(--my-themes-header-offset, 74px) + clamp(32px, 6vh, 58px)) 20px max(34px, calc(24px + env(safe-area-inset-bottom)));
	flex-direction: column;
	opacity: var(--msuie-content-opacity);
	pointer-events: none;
	transform: translate3d(0, var(--msuie-content-shift), 0);
	will-change: opacity, transform;
}

.msuie-hero.is-pulling-back .msuie-hero-content {
	visibility: hidden;
}

.msuie-kicker {
	display: flex;
	align-items: center;
	gap: 9px;
	margin-bottom: 18px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	line-height: 1.2;
	text-transform: uppercase;
}

.msuie-kicker::before {
	width: 28px;
	height: 1px;
	background: currentColor;
	content: "";
	opacity: 0.65;
}

.msuie-kicker-dark {
	color: #4d4c49;
}

.msuie-hero h1 {
	max-width: 10.5ch;
	color: #fff;
	font-family: var(--msuie-sans);
	font-size: clamp(50.6px, 14.3vw, 79.2px);
	font-weight: 700;
	letter-spacing: -0.065em;
	line-height: 0.9;
}

.msuie-hero-title-line {
	display: block;
}

.msuie-hero-copy {
	display: block;
	max-width: 30em;
	margin-top: 22px !important;
	color: rgba(255, 255, 255, 0.86);
	font-size: 12.6px;
	line-height: 1.55;
}

.msuie-hero-actions {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-top: auto;
	pointer-events: auto;
}

.msuie-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 50px;
	padding: 13px 21px;
	border: 1px solid transparent;
	border-radius: 0;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1.2;
	text-align: center;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.msuie-button:hover {
	transform: translateY(-2px);
}

.msuie-button[disabled] {
	cursor: not-allowed;
	opacity: 0.54;
	transform: none;
}

.msuie-button-light {
	background: var(--msuie-paper);
	color: var(--msuie-ink);
}

.msuie-button-light:hover {
	background: var(--msuie-lime);
}

.msuie-button-dark {
	background: var(--msuie-ink);
	color: #fff;
}

.msuie-button-dark:hover {
	background: #454543;
}

.msuie-button.is-loading {
	cursor: wait;
	opacity: 0.74;
}

.msuie-text-link {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 8px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.56);
	font-size: 12px;
	font-weight: 600;
}

.msuie-video-toggle {
	position: absolute;
	right: 18px;
	bottom: max(20px, env(safe-area-inset-bottom));
	z-index: 3;
	display: grid;
	width: 42px;
	height: 42px;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, 0.48);
	border-radius: 50%;
	background: rgba(14, 22, 28, 0.34);
	color: #fff;
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.04em;
	cursor: pointer;
	backdrop-filter: blur(10px);
}

.msuie-video-toggle [data-msuie-video-label] {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.msuie-video-toggle svg {
	width: 15px;
	height: 15px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.msuie-video-toggle .msuie-icon-play {
	display: none;
}

.msuie-video-toggle.is-paused .msuie-icon-play {
	display: block;
}

.msuie-video-toggle.is-paused .msuie-icon-pause {
	display: none;
}

.msuie-fact-strip {
	overflow: hidden;
	border-bottom: 1px solid var(--msuie-line);
	background: var(--msuie-lime);
}

.msuie-fact-track {
	display: flex;
	width: max-content;
	min-width: 100%;
	overflow-x: auto;
	scrollbar-width: none;
}

.msuie-fact-track::-webkit-scrollbar {
	display: none;
}

.msuie-fact-track span {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 11px;
	min-height: 54px;
	padding: 0 22px;
	border-right: 1px solid rgba(40, 40, 39, 0.18);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.11em;
	text-transform: uppercase;
}

.msuie-fact-track i {
	width: 6px;
	height: 6px;
	border: 1px solid currentColor;
	border-radius: 50%;
}

/* Continue the completed cabin scene directly into the editorial story. */
.msuie-main {
	position: relative;
	margin-top: -1px;
	background: var(--msuie-paper);
}

.msuie-main > .msuie-intro {
	padding-top: clamp(28px, 7vw, 48px);
}

.msuie-section {
	padding: 76px 20px;
}

.msuie-section-number {
	margin-bottom: 42px;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	opacity: 0.55;
}

.msuie-intro-copy h2,
.msuie-routine h2,
.msuie-product-info h2,
.msuie-transparency h2,
.msuie-reviews h2,
.msuie-faq h2 {
	font-family: var(--msuie-serif);
	font-size: clamp(42px, 12vw, 66px);
	font-weight: 560;
	letter-spacing: -0.055em;
	line-height: 0.94;
}

.msuie-intro-copy > p:last-child {
	max-width: 40em;
	margin-top: 24px !important;
	color: #565b55;
	font-size: 16px;
	line-height: 1.65;
}

.msuie-editorial-image {
	position: relative;
	margin-top: 54px !important;
}

.msuie-editorial-image img {
	width: 100%;
	aspect-ratio: 4 / 5.2;
	object-fit: cover;
}

.msuie-editorial-image figcaption {
	display: flex;
	justify-content: space-between;
	gap: 24px;
	padding-top: 12px;
	border-top: 1px solid var(--msuie-line);
	margin-top: 12px;
	color: #5c615b;
	font-size: 10px;
	letter-spacing: 0.06em;
	line-height: 1.45;
	text-transform: uppercase;
}

.msuie-editorial-image figcaption span {
	white-space: nowrap;
}

.msuie-routine {
	overflow: hidden;
	padding-right: 0;
	background: var(--msuie-paper-deep);
}

.msuie-routine-heading {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 20px;
	padding-right: 20px;
}

.msuie-rail-controls {
	display: flex;
	gap: 6px;
	padding-bottom: 3px;
}

.msuie-rail-controls button {
	display: grid;
	place-items: center;
	width: 39px;
	height: 39px;
	padding: 0;
	border: 1px solid rgba(40, 40, 39, 0.28);
	border-radius: 50%;
	background: transparent;
	color: var(--msuie-ink);
	cursor: pointer;
}

.msuie-card-rail {
	display: grid;
	grid-auto-columns: min(78vw, 340px);
	grid-auto-flow: column;
	gap: 12px;
	overflow-x: auto;
	padding: 38px 20px 18px 0;
	scroll-behavior: smooth;
	scroll-padding-left: 0;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}

.msuie-card-rail::-webkit-scrollbar {
	display: none;
}

.msuie-routine-card {
	position: relative;
	aspect-ratio: 9 / 16;
	overflow: hidden;
	background: #e6e4dd;
	color: #fff;
	scroll-snap-align: start;
}

.msuie-routine-card > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 700ms cubic-bezier(0.22, 1, 0.36, 1);
}

.msuie-routine-card:hover > img {
	transform: scale(1.025);
}

.msuie-card-shade {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(10, 12, 10, 0.03), rgba(10, 12, 10, 0.7));
}

.msuie-card-copy {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
	padding: 25px 20px;
}

.msuie-card-copy > span {
	display: block;
	margin-bottom: 10px;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.14em;
}

.msuie-card-copy h3 {
	font-family: var(--msuie-serif);
	font-size: 33px;
	font-weight: 560;
	letter-spacing: -0.035em;
	line-height: 1;
}

.msuie-card-copy p {
	margin-top: 12px !important;
	color: rgba(255, 255, 255, 0.76);
	font-size: 12px;
	line-height: 1.5;
}

.msuie-routine-card-light {
	background: #f6f5f0;
	color: var(--msuie-ink);
}

.msuie-routine-card-light .msuie-card-copy p {
	color: rgba(40, 40, 39, 0.7);
}

.msuie-card-object {
	position: absolute;
	top: 15%;
	left: 50%;
	display: grid;
	place-items: center;
	width: 43%;
	aspect-ratio: 0.55;
	border-radius: 50% 50% 17% 17% / 18% 18% 8% 8%;
	background: linear-gradient(130deg, #fffefa, #efede7 52%, #d9d7cf);
	box-shadow: 16px 28px 50px rgba(40, 40, 39, 0.14);
	transform: translateX(-50%) rotate(5deg);
}

.msuie-card-object::before {
	position: absolute;
	top: -8%;
	width: 70%;
	height: 10%;
	border-radius: 4px 4px 0 0;
	background: #f7f6f2;
	content: "";
}

.msuie-card-object span {
	font-family: var(--msuie-serif);
	font-size: 38px;
	opacity: 0.65;
}

.msuie-rail-status {
	width: calc(100% - 20px);
	height: 2px;
	margin-top: 10px;
	background: rgba(40, 40, 39, 0.13);
}

.msuie-rail-status span {
	display: block;
	width: 33.333%;
	height: 100%;
	background: var(--msuie-ink);
	transform-origin: left center;
	transition: transform 120ms linear;
}

.msuie-product {
	padding: 0;
	background: var(--msuie-paper);
}

.msuie-product-visual {
	position: relative;
	display: grid;
	place-items: center;
	min-height: 72vh;
	padding: 66px 24px;
	overflow: hidden;
	background:
		radial-gradient(circle at 50% 48%, rgba(255, 255, 255, 0.92) 0 21%, transparent 51%),
		linear-gradient(145deg, #f1f0eb, #faf9f5 58%, #e4e2da);
}

.msuie-product-visual::before {
	position: absolute;
	width: 75vw;
	height: 75vw;
	border: 1px solid rgba(40, 40, 39, 0.1);
	border-radius: 50%;
	content: "";
}

.msuie-product-visual img {
	position: relative;
	z-index: 1;
	width: min(72%, 390px);
	max-height: 62vh;
	object-fit: contain;
	filter: drop-shadow(18px 28px 26px rgba(40, 40, 39, 0.14));
}

.msuie-placeholder-label {
	position: absolute;
	top: 18px;
	left: 18px;
	z-index: 2;
	padding: 7px 9px;
	border: 1px solid rgba(40, 40, 39, 0.24);
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.msuie-product-info {
	padding: 68px 20px 76px;
}

.msuie-product-info .msuie-section-number {
	margin-bottom: 36px;
}

.msuie-product-info h2 {
	max-width: 10ch;
}

.msuie-price {
	margin-top: 16px !important;
	font-size: 16px;
	font-weight: 700;
}

.msuie-price :where(del, ins) {
	background: none;
	color: inherit;
}

.msuie-price-pending {
	color: #6d726c;
	font-size: 13px;
	font-weight: 500;
}

.msuie-product-description {
	max-width: 42em;
	margin-top: 25px !important;
	color: #555b54;
	line-height: 1.65;
}

.msuie-product-meta {
	display: grid;
	grid-template-columns: 1fr 1fr;
	margin-top: 30px !important;
	border-top: 1px solid var(--msuie-line);
	border-bottom: 1px solid var(--msuie-line);
}

.msuie-product-meta div {
	padding: 16px 12px 16px 0;
}

.msuie-product-meta div + div {
	padding-left: 15px;
	border-left: 1px solid var(--msuie-line);
}

.msuie-product-meta dt {
	margin-bottom: 6px;
	color: #737872;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.msuie-product-meta dd {
	font-size: 12px;
	line-height: 1.35;
}

.msuie-product-add {
	display: flex;
	justify-content: space-between;
	width: 100%;
	margin-top: 24px;
}

.msuie-shipping-note {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin-top: 15px !important;
	color: #676c66;
	font-size: 10px;
	line-height: 1.45;
}

.msuie-shipping-note svg {
	flex: 0 0 17px;
	width: 17px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.4;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.msuie-transparency {
	background: var(--msuie-paper-soft);
	color: var(--msuie-ink);
}

.msuie-transparency .msuie-kicker-dark {
	color: #4d4c49;
}

.msuie-transparency-heading h2 {
	max-width: 9ch;
}

.msuie-transparency-grid {
	margin-top: 48px;
	border-top: 1px solid var(--msuie-line);
}

.msuie-transparency-grid article {
	position: relative;
	padding: 25px 0 29px 42px;
	border-bottom: 1px solid var(--msuie-line);
}

.msuie-transparency-grid article > span {
	position: absolute;
	top: 29px;
	left: 0;
	font-size: 9px;
	font-weight: 700;
	opacity: 0.55;
}

.msuie-transparency-grid h3 {
	font-family: var(--msuie-serif);
	font-size: 27px;
	font-weight: 560;
}

.msuie-transparency-grid p {
	margin-top: 8px !important;
	color: rgba(40, 40, 39, 0.68);
	font-size: 13px;
	line-height: 1.6;
}

.msuie-reviews {
	background: var(--msuie-paper-deep);
}

.msuie-reviews-heading > p {
	max-width: 38em;
	margin-top: 18px !important;
	color: #666b65;
	font-size: 12px;
	line-height: 1.55;
}

.msuie-review-grid {
	display: grid;
	gap: 10px;
	margin-top: 42px;
}

.msuie-review {
	padding: 26px 22px;
	background: var(--msuie-paper);
}

.msuie-review-rating {
	margin-bottom: 19px;
	font-size: 12px;
	letter-spacing: 0.13em;
}

.msuie-review blockquote {
	font-family: var(--msuie-serif);
	font-size: 25px;
	font-weight: 520;
	line-height: 1.18;
}

.msuie-review blockquote p + p {
	margin-top: 12px !important;
}

.msuie-review footer {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	margin-top: 27px;
	padding-top: 13px;
	border-top: 1px solid var(--msuie-line);
	font-size: 10px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.msuie-review footer time {
	color: #727771;
}

.msuie-review-empty {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-top: 40px;
	padding: 24px 0;
	border-top: 1px solid var(--msuie-line);
	border-bottom: 1px solid var(--msuie-line);
	color: #5b605a;
	font-size: 13px;
}

.msuie-review-empty > span {
	font-size: 28px;
	font-weight: 300;
}

.msuie-faq {
	background: var(--msuie-paper);
}

.msuie-faq-list {
	margin-top: 50px;
	border-top: 1px solid var(--msuie-line);
}

.msuie-faq details {
	border-bottom: 1px solid var(--msuie-line);
}

.msuie-faq summary {
	display: grid;
	grid-template-columns: 27px 1fr 20px;
	gap: 11px;
	align-items: center;
	min-height: 75px;
	padding: 14px 0;
	list-style: none;
	cursor: pointer;
}

.msuie-faq summary::-webkit-details-marker {
	display: none;
}

.msuie-faq summary > span {
	font-size: 9px;
	font-weight: 700;
	opacity: 0.55;
}

.msuie-faq summary strong {
	font-family: var(--msuie-serif);
	font-size: 20px;
	font-weight: 550;
	line-height: 1.15;
}

.msuie-faq summary i {
	position: relative;
	width: 16px;
	height: 16px;
}

.msuie-faq summary i::before,
.msuie-faq summary i::after {
	position: absolute;
	top: 7px;
	left: 2px;
	width: 12px;
	height: 1px;
	background: currentColor;
	content: "";
	transition: transform 180ms ease;
}

.msuie-faq summary i::after {
	transform: rotate(90deg);
}

.msuie-faq details[open] summary i::after {
	transform: rotate(0deg);
}

.msuie-faq details > div {
	padding: 0 28px 24px 38px;
	color: #626761;
	font-size: 13px;
	line-height: 1.65;
}

.msuie-closing {
	display: grid;
	padding: 55px 20px calc(98px + env(safe-area-inset-bottom));
	gap: 22px;
	background: var(--msuie-paper-deep);
	color: var(--msuie-ink);
}

.msuie-closing h2 {
	max-width: 9ch;
	font-family: var(--msuie-serif);
	font-size: clamp(54px, 15vw, 118px);
	font-weight: 600;
	letter-spacing: -0.055em;
	line-height: 0.88;
}

.msuie-closing .msuie-button {
	justify-self: start;
	margin-top: 16px;
}

.msuie-footer-mark {
	overflow: hidden;
	font-family: var(--msuie-sans);
	font-size: clamp(54px, 18vw, 130px);
	font-weight: 700;
	letter-spacing: -0.075em;
	line-height: 0.78;
	white-space: nowrap;
}

.msuie-footer-mark sup {
	font-size: 10px;
	letter-spacing: 0;
	vertical-align: top;
}

.msuie-footer-grid {
	display: grid;
	gap: 35px;
	margin-top: 55px;
	padding-top: 20px;
	border-top: 1px solid var(--msuie-line);
}

.msuie-footer-grid p {
	font-family: var(--msuie-serif);
	font-size: 24px;
	font-weight: 540;
}

.msuie-footer-grid small {
	display: block;
	max-width: 48em;
	margin-top: 12px;
	font-size: 9px;
	line-height: 1.5;
	opacity: 0.68;
}

.msuie-footer-grid nav {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 24px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.msuie-cart-shell[hidden] {
	display: none !important;
}

.msuie-cart-shell {
	position: fixed;
	inset: 0;
	z-index: 100000;
}

.msuie-cart-backdrop {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	padding: 0;
	border: 0;
	background: rgba(8, 10, 8, 0.58);
	opacity: 0;
	cursor: default;
	transition: opacity 260ms ease;
	backdrop-filter: blur(3px);
}

.msuie-cart-sheet {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	max-height: min(86vh, 720px);
	padding: 25px 20px max(22px, env(safe-area-inset-bottom));
	overflow-y: auto;
	background: var(--msuie-paper);
	color: var(--msuie-ink);
	transform: translateY(102%);
	transition: transform 330ms cubic-bezier(0.22, 1, 0.36, 1);
}

.msuie-cart-shell.is-open .msuie-cart-backdrop {
	opacity: 1;
}

.msuie-cart-shell.is-open .msuie-cart-sheet {
	transform: translateY(0);
}

.msuie-cart-sheet > header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 20px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--msuie-line);
}

.msuie-cart-sheet > header h2 {
	font-family: var(--msuie-serif);
	font-size: 40.7px;
	font-weight: 560;
	letter-spacing: -0.04em;
	line-height: 1;
}

.msuie-cart-sheet > header .msuie-kicker {
	margin-bottom: 7px;
}

.msuie-cart-sheet > header button {
	display: grid;
	place-items: center;
	width: 39px;
	height: 39px;
	padding: 0 0 3px;
	border: 1px solid var(--msuie-line);
	border-radius: 50%;
	background: transparent;
	font-size: 26px;
	font-weight: 300;
	line-height: 1;
	cursor: pointer;
}

.msuie-cart-items {
	display: grid;
	gap: 13px;
	padding: 19px 0;
}

.msuie-cart-items > p {
	padding: 15px 0;
	color: #626761;
	font-size: 11.7px;
}

.msuie-cart-item {
	display: grid;
	grid-template-columns: 72px 1fr auto;
	gap: 13px;
	align-items: center;
}

.msuie-cart-item img {
	width: 72px;
	height: 86px;
	background: var(--msuie-paper-soft);
	object-fit: cover;
}

.msuie-cart-item strong {
	display: block;
	font-family: var(--msuie-serif);
	font-size: 18px;
	font-weight: 540;
	line-height: 1.15;
}

.msuie-cart-item span {
	display: block;
	margin-top: 6px;
	color: #6e736d;
	font-size: 10px;
	text-transform: uppercase;
}

.msuie-cart-item > b {
	font-size: 18px;
	font-weight: 700;
	white-space: nowrap;
}

.msuie-cart-total {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 17px 0;
	border-top: 1px solid var(--msuie-line);
	font-size: 12px;
}

.msuie-cart-total[hidden] {
	display: none;
}

.msuie-cart-total strong {
	font-size: 20px;
}

.msuie-cart-sheet > footer {
	display: grid;
	gap: 13px;
	padding-top: 8px;
}

.msuie-cart-sheet > footer .msuie-button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	text-align: center;
}

.msuie-cart-link {
	justify-self: center;
	padding: 5px;
	border-bottom: 1px solid currentColor;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
}

body.msuie-cart-open {
	overflow: hidden;
}

.msuie-sticky-buy {
	position: fixed;
	right: calc(env(safe-area-inset-right, 0px) + 7.25vw + 0.26px);
	bottom: calc(env(safe-area-inset-bottom, 0px) + 10px);
	left: calc(env(safe-area-inset-left, 0px) + 7.25vw + 0.26px);
	z-index: 9998;
	display: grid;
	grid-template-columns: minmax(0, 1fr) 88px;
	align-items: center;
	gap: 8px;
	width: auto;
	min-width: 0;
	max-width: none;
	min-height: 48px;
	box-sizing: border-box;
	padding: 4px 9px 4px 14px;
	border: 1px solid rgba(255, 255, 255, 0.72);
	border-radius: 22px;
	overflow: hidden;
	background:
		linear-gradient(145deg, rgba(255, 255, 255, 0.34), rgba(250, 249, 245, 0.08));
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.86),
		inset 0 -1px 0 rgba(255, 255, 255, 0.26),
		0 10px 30px rgba(31, 47, 55, 0.14);
	color: var(--msuie-ink);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: none;
	transition: opacity 180ms ease, visibility 0s linear 180ms;
	-webkit-backdrop-filter: saturate(180%) blur(18px) brightness(1.04);
	backdrop-filter: saturate(180%) blur(18px) brightness(1.04);
}

.msuie-sticky-buy.is-visible {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transition-delay: 0s;
}

.msuie-sticky-buy > div {
	min-width: 0;
}

.msuie-sticky-buy > div > span {
	display: block;
	overflow: hidden;
	font-family: var(--msuie-serif);
	font-size: 15px;
	font-weight: 550;
	line-height: 1.1;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.msuie-sticky-buy > div > strong {
	display: block;
	margin-top: 4px;
	font-size: 10px;
	line-height: 1;
}

.msuie-sticky-buy > div :where(del, ins) {
	background: none;
	color: inherit;
}

.msuie-sticky-buy > button,
.msuie-sticky-buy > a {
	display: grid;
	width: 88px;
	min-width: 0;
	height: 34px;
	min-height: 34px;
	place-items: center;
	padding: 0;
	border: 0;
	border-radius: 17px;
	background: var(--msuie-ink);
	box-shadow: none;
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1;
	text-align: center;
	text-transform: uppercase;
	white-space: nowrap;
	cursor: pointer;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1), background-color 180ms ease;
}

.msuie-sticky-buy > button:active,
.msuie-sticky-buy > a:active {
	transform: scale(0.97);
}

.msuie-sticky-buy > button.is-loading {
	opacity: 0.65;
}

@media (min-width: 720px) {
	.msuie-nav {
		grid-template-columns: 1fr auto 1fr;
		min-height: 86px;
		padding-inline: 34px;
	}

	.msuie-nav-links {
		display: flex;
		gap: 30px;
		font-size: 11px;
		font-weight: 600;
		letter-spacing: 0.08em;
		text-transform: uppercase;
	}

	.msuie-bag-button {
		justify-self: end;
	}

	.msuie-hero-content {
		padding-right: 34px;
		padding-left: 34px;
	}

	.msuie-section {
		padding-right: 40px;
		padding-left: 40px;
	}

	.msuie-routine {
		padding-right: 0;
	}

	.msuie-routine-heading {
		padding-right: 40px;
	}

	.msuie-card-rail {
		grid-auto-columns: min(46vw, 390px);
	}

	.msuie-product {
		display: grid;
		grid-template-columns: 1.08fr 0.92fr;
		align-items: stretch;
	}

	.msuie-product-info {
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding: 72px 44px;
	}

	.msuie-review-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.msuie-footer-grid {
		grid-template-columns: 1fr auto;
		align-items: end;
	}

	.msuie-cart-sheet {
		top: 0;
		bottom: 0;
		left: auto;
		width: min(470px, 100%);
		max-height: none;
		padding: 35px 32px;
		transform: translateX(102%);
	}

	.msuie-cart-shell.is-open .msuie-cart-sheet {
		transform: translateX(0);
	}
}

@media (min-width: 1024px) {
	.msuie-hero-content {
		width: min(70vw, 840px);
		padding: 150px 6vw 9vh;
	}

	.msuie-hero h1 {
		font-size: clamp(83.6px, 9.13vw, 145.2px);
	}

	.msuie-hero-copy {
		display: block;
		font-size: 15.3px;
	}

	.msuie-section {
		padding: 118px 7vw;
	}

	.msuie-intro {
		display: grid;
		grid-template-columns: 0.35fr 1.05fr 0.9fr;
		gap: 4vw;
		align-items: start;
	}

	.msuie-intro .msuie-section-number {
		margin: 5px 0 0;
	}

	.msuie-editorial-image {
		margin-top: 0 !important;
	}

	.msuie-routine {
		padding-right: 0;
	}

	.msuie-routine-heading {
		padding-right: 7vw;
	}

	.msuie-card-rail {
		grid-auto-columns: min(28vw, 420px);
		gap: 18px;
		padding-top: 54px;
	}

	.msuie-product-info {
		padding: 8vw;
	}

	.msuie-product-visual {
		min-height: 880px;
	}

	.msuie-transparency {
		display: grid;
		grid-template-columns: 0.9fr 1.1fr;
		gap: 9vw;
	}

	.msuie-transparency-grid {
		margin-top: 0;
	}

	.msuie-reviews-heading {
		display: grid;
		grid-template-columns: 1fr 0.6fr;
		gap: 8vw;
		align-items: end;
	}

	.msuie-reviews-heading > p {
		margin: 0 !important;
	}

	.msuie-review-grid {
		grid-template-columns: repeat(3, 1fr);
		margin-top: 60px;
	}

	.msuie-faq {
		display: grid;
		grid-template-columns: 0.75fr 1.25fr;
		gap: 10vw;
	}

	.msuie-faq-list {
		margin-top: 0;
	}

	.msuie-closing {
		padding: 85px 7vw 120px;
	}

	.msuie-sticky-buy {
		right: 24px;
		bottom: 24px;
		left: auto;
		width: min(470px, calc(100% - 48px));
		padding: 10px;
	}
}

@media (forced-colors: active) {
	.msuie-hero-wash,
	.msuie-card-shade {
		background: transparent;
	}

	.msuie-button,
	.msuie-bag-button,
	.msuie-sticky-buy > button,
	.msuie-sticky-buy > a {
		border: 1px solid ButtonText;
	}
}

/* --------------------------------------------------------------------------
 * Yarbelnn editorial story — page two onward only.
 * The completed hero/cabin scene above this boundary is intentionally untouched.
 * -------------------------------------------------------------------------- */

.msuie-main {
	--msuie-story-paper: #faf9f5;
	--msuie-story-ink: #282827;
	--msuie-story-muted: #666760;
	--msuie-story-line: rgba(40, 40, 39, 0.16);
	--msuie-story-gutter: clamp(1.25rem, 5.13vw, 4.5rem);
	--msuie-story-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--gel-progress: 0;
	isolation: isolate;
	width: 100%;
	overflow: visible;
	background: var(--msuie-story-paper);
	color: var(--msuie-story-ink);
	font-family: "Poppins", sans-serif;
	font-feature-settings: "kern", "ss01", "ss02", "ss03";
	font-kerning: normal;
}

.msuie-main :where(h2, h3, strong, p, li, figcaption, summary, blockquote) {
	font-family: inherit;
}

.msuie-main :where(h2, h3) {
	text-wrap: balance;
}

.msuie-main :where(p) {
	text-wrap: pretty;
}

.msuie-story-section,
.msuie-story-closing {
	position: relative;
	width: min(100%, 90rem);
	margin-inline: auto;
	padding: clamp(6.5rem, 27vw, 11rem) var(--msuie-story-gutter);
	background: transparent;
}

.msuie-story-label {
	display: flex;
	align-items: center;
	gap: 0.8rem;
	max-width: 34rem;
	color: #555650;
	font-size: clamp(0.63rem, 2.55vw, 0.74rem);
	font-weight: 670;
	letter-spacing: 0.15em;
	line-height: 1.35;
	text-transform: uppercase;
}

.msuie-story-label::before {
	flex: 0 0 clamp(1.75rem, 8vw, 4rem);
	width: clamp(1.75rem, 8vw, 4rem);
	height: 1px;
	background: currentColor;
	content: "";
	opacity: 0.62;
}

.msuie-story-heading {
	display: grid;
	gap: clamp(1.2rem, 5vw, 2.1rem);
}

.msuie-story-heading h2,
.msuie-pressure > h2,
.msuie-story-closing h2,
.msuie-gel-story__intro h2,
.msuie-shop__copy h2 {
	max-width: 11ch;
	font-size: clamp(3rem, 13.1vw, 7.8rem);
	font-weight: 560;
	letter-spacing: -0.061em;
	line-height: 0.91;
}

.msuie-story-heading > p:last-child {
	max-width: 36rem;
	color: var(--msuie-story-muted);
	font-size: clamp(0.94rem, 3.85vw, 1.1rem);
	line-height: 1.62;
}

/* Scroll-led gel trail. Product dimensions use viewport proportions so the
 * bottle/nozzle relationship remains stable across compact and tall phones. */
.msuie-gel-story {
	position: relative;
	height: 226vh;
	height: 226svh;
	min-height: 79.6rem;
	min-height: max(79.6rem, calc(70rem + 30vh));
	min-height: max(79.6rem, calc(70rem + 30svh));
	background: var(--msuie-story-paper);
}

.msuie-gel-story__sticky {
	position: sticky;
	top: 0;
	height: 100vh;
	height: 100svh;
	min-height: 32rem;
	overflow: clip;
	background:
		radial-gradient(circle at 50% 48%, rgba(255, 255, 255, 0.48), transparent 42%),
		var(--msuie-story-paper);
	transform: translateZ(0);
	backface-visibility: hidden;
}

.msuie-gel-story__intro {
	position: absolute;
	top: clamp(4.8rem, 10.5svh, 7.5rem);
	right: var(--msuie-story-gutter);
	left: var(--msuie-story-gutter);
	z-index: 5;
	display: grid;
	gap: clamp(1rem, 4vw, 1.7rem);
	pointer-events: none;
	opacity: clamp(0, calc(1 - (var(--gel-progress) * 2.2)), 1);
	transform: translate3d(0, calc(var(--gel-progress) * -2rem), 0);
	will-change: transform, opacity;
}

.msuie-gel-story__intro h2 {
	max-width: 8.5ch;
	font-size: clamp(3rem, 13.7vw, 6.5rem);
}

.msuie-gel-product {
	position: absolute;
	top: 13svh;
	left: 50%;
	z-index: 2;
	height: min(52svh, 118vw);
	pointer-events: none;
	transform: translate3d(-50%, calc(var(--gel-progress) * -2.8svh), 0)
		rotate(calc(-2deg + (var(--gel-progress) * 4deg)))
		scale(calc(1 - (var(--gel-progress) * 0.035)));
	transform-origin: 51% 83%;
	will-change: transform;
}

.msuie-gel-product img {
	width: auto;
	max-width: none;
	height: 100%;
	object-fit: contain;
	filter: drop-shadow(0 1.6rem 1.8rem rgba(40, 40, 39, 0.1));
}

.msuie-gel-path {
	position: absolute;
	inset: 0;
	z-index: 3;
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
	pointer-events: none;
}

.msuie-gel-path [data-msuie-gel-path] {
	fill: none;
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	stroke-linecap: round;
	stroke-linejoin: round;
	vector-effect: non-scaling-stroke;
	will-change: stroke-dashoffset;
}

.msuie-gel-path__shadow {
	stroke: rgba(86, 108, 118, 0.1);
	stroke-width: 16;
}

.msuie-gel-path__body {
	stroke-width: 11;
}

.msuie-gel-path__shine {
	stroke: rgba(255, 255, 255, 0.86);
	stroke-width: 2.2;
	transform: translateX(-2px);
}

.msuie-gel-drop {
	filter: drop-shadow(0 0.35rem 0.45rem rgba(61, 87, 98, 0.12));
	transform: translate3d(200px, 474px, 0);
	will-change: transform;
}

.msuie-gel-drop__body {
	fill: rgba(218, 232, 237, 0.9);
	stroke: rgba(255, 255, 255, 0.72);
	stroke-width: 1;
}

.msuie-gel-drop__shine {
	fill: rgba(255, 255, 255, 0.92);
}

.msuie-gel-node {
	--node-progress: 0;
	position: absolute;
	z-index: 4;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	gap: 0.75rem;
	max-width: min(11.5rem, 47vw);
	color: #454640;
	pointer-events: none;
	opacity: var(--node-progress);
	transform: translate3d(0, calc((1 - var(--node-progress)) * 1rem), 0);
	will-change: transform, opacity;
}

.msuie-gel-node::before {
	position: absolute;
	top: -0.68rem;
	right: 0;
	left: 0;
	height: 1px;
	background: var(--msuie-story-line);
	content: "";
}

.msuie-gel-node > span {
	font-size: 0.59rem;
	font-weight: 670;
	letter-spacing: 0.12em;
	opacity: 0.62;
}

.msuie-gel-node > strong {
	font-size: clamp(0.72rem, 3.1vw, 0.86rem);
	font-weight: 570;
	line-height: 1.22;
}

.msuie-gel-node--one {
	top: 65%;
	left: 9%;
}

.msuie-gel-node--two {
	top: 75.5%;
	right: 7%;
}

.msuie-gel-node--three {
	top: 87.5%;
	left: 13%;
}

.msuie-gel-next {
	position: absolute;
	right: var(--msuie-story-gutter);
	bottom: max(1.35rem, env(safe-area-inset-bottom));
	z-index: 6;
	display: flex;
	align-items: center;
	gap: 0.8rem;
	padding-block: 0.6rem;
	border-bottom: 1px solid currentColor;
	font-size: 0.7rem;
	font-weight: 650;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	opacity: clamp(0, calc((var(--gel-progress) - 0.82) * 6), 1);
	transform: translate3d(0, calc((1 - var(--gel-progress)) * 0.8rem), 0);
	transition: border-color 220ms ease;
	will-change: transform, opacity;
}

.msuie-gel-next:hover {
	border-color: transparent;
}

.msuie-gel-next i {
	font-size: 1rem;
	font-style: normal;
}

/* Pain-led editorial statement and the sole moving marquee. */
.msuie-pressure {
	display: grid;
	gap: clamp(1.6rem, 7vw, 3.5rem);
	padding-top: clamp(8rem, 34vw, 15rem);
}

.msuie-pressure > h2 {
	max-width: 8.2ch;
	font-size: clamp(3.65rem, 16.4vw, 9.4rem);
}

.msuie-pressure__lead {
	max-width: 26rem;
	margin-left: clamp(2.4rem, 18vw, 16rem) !important;
	color: var(--msuie-story-muted);
	font-size: clamp(1.05rem, 4.6vw, 1.45rem);
	line-height: 1.45;
}

.msuie-word-river {
	width: calc(100% + (var(--msuie-story-gutter) * 2));
	margin-block: clamp(1.5rem, 7vw, 3.5rem);
	margin-left: calc(var(--msuie-story-gutter) * -1);
	overflow: hidden;
	border-block: 1px solid var(--msuie-story-line);
}

.msuie-word-river > div {
	display: flex;
	width: max-content;
	padding-block: clamp(0.75rem, 3.4vw, 1.1rem);
	font-size: clamp(0.69rem, 3vw, 0.83rem);
	font-weight: 650;
	letter-spacing: 0.14em;
	line-height: 1;
	white-space: nowrap;
	animation: msuie-story-river 24s linear infinite;
	will-change: transform;
}

.msuie-word-river > div > span {
	padding-right: 1.4em;
}

@keyframes msuie-story-river {
	to {
		transform: translate3d(-50%, 0, 0);
	}
}

.msuie-pressure__answer {
	max-width: 12ch;
	padding-top: clamp(2.5rem, 10vw, 5rem);
	border-top: 1px solid var(--msuie-story-line);
	font-size: clamp(2.3rem, 10.3vw, 6.5rem);
	font-weight: 540;
	letter-spacing: -0.052em;
	line-height: 0.98;
}

/* Benefits, formula and use remain one continuous page: hierarchy comes from
 * rules and whitespace rather than boxed cards. */
.msuie-benefits,
.msuie-formula,
.msuie-use,
.msuie-voices,
.msuie-story-faq {
	display: grid;
	gap: clamp(3.75rem, 16vw, 8rem);
}

.msuie-benefit-list,
.msuie-ingredient-list,
.msuie-use-steps,
.msuie-voice-list,
.msuie-story-faq__list {
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--msuie-story-line);
	list-style: none;
}

.msuie-benefit-list article {
	display: grid;
	grid-template-columns: 2rem minmax(0, 1fr);
	gap: clamp(0.8rem, 4vw, 1.5rem);
	padding: clamp(1.6rem, 7vw, 2.5rem) 0;
	border-bottom: 1px solid var(--msuie-story-line);
}

.msuie-benefit-list article > span,
.msuie-ingredient-list li > span,
.msuie-use-steps article > span {
	padding-top: 0.35rem;
	font-size: 0.61rem;
	font-weight: 670;
	letter-spacing: 0.12em;
	opacity: 0.55;
}

.msuie-benefit-list h3 {
	font-size: clamp(1.55rem, 7vw, 2.35rem);
	font-weight: 560;
	letter-spacing: -0.04em;
	line-height: 1.02;
}

.msuie-benefit-list p {
	max-width: 32rem;
	margin-top: 0.85rem !important;
	color: var(--msuie-story-muted);
	font-size: clamp(0.89rem, 3.72vw, 1rem);
	line-height: 1.58;
}

.msuie-formula .msuie-story-heading > p:last-child {
	padding-top: 0.1rem;
	border-top: 0;
	font-size: clamp(0.74rem, 3.1vw, 0.88rem);
	letter-spacing: 0.02em;
}

.msuie-ingredient-list li {
	display: grid;
	grid-template-columns: 2rem minmax(0, 1fr);
	gap: 0.2rem 0.85rem;
	align-items: baseline;
	padding: clamp(1.2rem, 5.2vw, 1.8rem) 0;
	border-bottom: 1px solid var(--msuie-story-line);
}

.msuie-ingredient-list strong {
	font-size: clamp(1.25rem, 5.8vw, 1.8rem);
	font-weight: 560;
	letter-spacing: -0.032em;
}

.msuie-ingredient-list p {
	grid-column: 2;
	color: var(--msuie-story-muted);
	font-size: 0.82rem;
	line-height: 1.5;
}

.msuie-use-steps article {
	position: relative;
	display: grid;
	grid-template-columns: 2rem minmax(0, 1fr);
	gap: 0.7rem 0.85rem;
	padding: clamp(1.8rem, 8vw, 3rem) 0;
	border-bottom: 1px solid var(--msuie-story-line);
}

.msuie-use-steps h3,
.msuie-use-steps p {
	grid-column: 2;
}

.msuie-use-steps h3 {
	font-size: clamp(1.65rem, 7.3vw, 2.6rem);
	font-weight: 550;
	letter-spacing: -0.045em;
	line-height: 1;
}

.msuie-use-steps p {
	max-width: 27rem;
	color: var(--msuie-story-muted);
	font-size: clamp(0.88rem, 3.65vw, 1rem);
	line-height: 1.58;
}

/* Campaign portraits: tactile horizontal editorial rail on phones, clean
 * three-up composition on larger screens. */
.msuie-portraits {
	overflow: visible;
}

.msuie-portraits .msuie-story-heading {
	margin-bottom: clamp(3rem, 13vw, 6rem);
}

.msuie-portrait-rail {
	display: grid;
	grid-auto-columns: min(78vw, 22rem);
	grid-auto-flow: column;
	gap: clamp(0.7rem, 3vw, 1.2rem);
	width: calc(100% + (var(--msuie-story-gutter) * 2));
	margin-left: calc(var(--msuie-story-gutter) * -1);
	overflow-x: auto;
	padding-inline: var(--msuie-story-gutter);
	scroll-padding-inline: var(--msuie-story-gutter);
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.msuie-portrait-rail::-webkit-scrollbar {
	display: none;
}

.msuie-portrait-rail figure {
	min-width: 0;
	scroll-snap-align: start;
}

.msuie-portrait-rail figure > img {
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	object-position: center;
	background: var(--msuie-story-paper);
	transition: transform 1.1s var(--msuie-story-ease);
}

.msuie-portrait-rail figcaption {
	display: grid;
	gap: 0.55rem;
	padding-top: 0.9rem;
	border-top: 1px solid var(--msuie-story-line);
	margin-top: 0.8rem;
}

.msuie-portrait-rail figcaption span {
	font-size: 0.58rem;
	font-weight: 670;
	letter-spacing: 0.13em;
}

.msuie-portrait-rail figcaption strong {
	max-width: 19ch;
	font-size: clamp(1rem, 4.5vw, 1.25rem);
	font-weight: 550;
	letter-spacing: -0.025em;
	line-height: 1.13;
}

/* Product moment stays airy and object-led, without introducing a new color
 * block into the continuous ivory canvas. */
.msuie-shop {
	display: grid;
	gap: clamp(3.5rem, 14vw, 7rem);
	padding-top: clamp(5rem, 19vw, 9rem);
}

.msuie-shop__visual {
	position: relative;
	display: grid;
	place-items: center;
	min-height: min(41rem, 90svh);
	overflow: clip;
}

.msuie-shop__visual::before {
	position: absolute;
	width: min(82vw, 33rem);
	aspect-ratio: 1;
	border: 1px solid var(--msuie-story-line);
	border-radius: 50%;
	content: "";
	transform: translateY(8%);
}

.msuie-shop__visual img {
	position: relative;
	z-index: 1;
	width: auto;
	max-width: none;
	height: min(76svh, 150vw);
	object-fit: contain;
	filter: drop-shadow(0 2.2rem 2.1rem rgba(40, 40, 39, 0.11));
	transform: rotate(-3deg);
}

.msuie-shop__copy {
	display: grid;
	align-content: start;
	gap: clamp(1.25rem, 5vw, 2rem);
}

.msuie-shop__copy h2 {
	max-width: 9ch;
}

.msuie-shop__lead {
	max-width: 36rem;
	color: var(--msuie-story-muted);
	font-size: clamp(0.98rem, 4vw, 1.12rem);
	line-height: 1.62;
}

.msuie-shop__facts {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-block: 1px solid var(--msuie-story-line);
}

.msuie-shop__facts span {
	display: flex;
	align-items: center;
	min-height: 4.15rem;
	padding: 0.75rem 0.55rem;
	font-size: clamp(0.58rem, 2.55vw, 0.7rem);
	font-weight: 650;
	letter-spacing: 0.08em;
	line-height: 1.3;
	text-transform: uppercase;
}

.msuie-shop__facts span + span {
	padding-left: 0.8rem;
	border-left: 1px solid var(--msuie-story-line);
}

.msuie-shop .msuie-price {
	margin-top: 0 !important;
	font-size: clamp(1.15rem, 5vw, 1.45rem);
	font-weight: 600;
}

.msuie-shop .msuie-product-add {
	margin-top: 0;
}

.msuie-shop .msuie-shipping-note {
	margin-top: -0.35rem !important;
}

/* Genuine reviews, when present, are treated as an editorial list. */
.msuie-voice-list article {
	display: grid;
	gap: 1.2rem;
	padding: clamp(1.7rem, 7vw, 2.5rem) 0;
	border-bottom: 1px solid var(--msuie-story-line);
}

.msuie-voice-list .msuie-review-rating {
	margin: 0;
	font-size: 0.68rem;
}

.msuie-voice-list blockquote {
	max-width: 35rem;
	font-size: clamp(1.45rem, 6.5vw, 2.3rem);
	font-weight: 530;
	letter-spacing: -0.035em;
	line-height: 1.13;
}

.msuie-voice-list footer {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	color: var(--msuie-story-muted);
	font-size: 0.66rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

/* FAQ uses native details for keyboard and no-JS access. */
.msuie-story-faq__list details {
	border-bottom: 1px solid var(--msuie-story-line);
}

.msuie-story-faq__list summary {
	display: grid;
	grid-template-columns: 2rem minmax(0, 1fr) 1.25rem;
	gap: 0.8rem;
	align-items: center;
	min-height: clamp(5rem, 21vw, 6.5rem);
	padding-block: 1rem;
	list-style: none;
	cursor: pointer;
}

.msuie-story-faq__list summary::-webkit-details-marker {
	display: none;
}

.msuie-story-faq__list summary > span {
	font-size: 0.61rem;
	font-weight: 670;
	letter-spacing: 0.12em;
	opacity: 0.55;
}

.msuie-story-faq__list summary strong {
	font-size: clamp(1.15rem, 5.1vw, 1.65rem);
	font-weight: 550;
	letter-spacing: -0.03em;
	line-height: 1.08;
}

.msuie-story-faq__list summary i {
	position: relative;
	width: 1.1rem;
	height: 1.1rem;
}

.msuie-story-faq__list summary i::before,
.msuie-story-faq__list summary i::after {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 0.85rem;
	height: 1px;
	background: currentColor;
	content: "";
	transform: translate(-50%, -50%);
	transition: transform 300ms var(--msuie-story-ease);
}

.msuie-story-faq__list summary i::after {
	transform: translate(-50%, -50%) rotate(90deg);
}

.msuie-story-faq__list details[open] summary i::after {
	transform: translate(-50%, -50%) rotate(0deg);
}

.msuie-story-faq__list details > div {
	max-width: 36rem;
	padding: 0 0 2rem 2.8rem;
	color: var(--msuie-story-muted);
	font-size: clamp(0.9rem, 3.75vw, 1rem);
	line-height: 1.65;
}

.msuie-story-closing {
	display: grid;
	gap: clamp(1.6rem, 7vw, 3rem);
	min-height: 86svh;
	align-content: center;
	padding-top: clamp(8rem, 30vw, 15rem);
	padding-bottom: calc(clamp(8rem, 32vw, 16rem) + env(safe-area-inset-bottom));
	border-top: 1px solid var(--msuie-story-line);
}

.msuie-story-closing h2 {
	max-width: 10ch;
	font-size: clamp(3.5rem, 15vw, 9rem);
}

.msuie-story-closing .msuie-button {
	justify-self: start;
	margin-top: 0.5rem;
}

.msuie-has-landing .my-themes-site-footer {
	background: #faf9f5;
}

/* Motion is enabled only after JavaScript declares the story ready. Content
 * therefore remains readable if scripting, observers or fonts fail. */
.msuie-main.msuie-motion-ready [data-msuie-reveal]:not([data-msuie-split]),
.msuie-motion-ready .msuie-main [data-msuie-reveal]:not([data-msuie-split]) {
	opacity: 0;
	transform: translate3d(0, clamp(1rem, 5vw, 2.3rem), 0);
	transition:
		opacity 760ms var(--msuie-story-ease),
		transform 920ms var(--msuie-story-ease);
	will-change: transform, opacity;
}

.msuie-main.msuie-motion-ready [data-msuie-reveal].is-visible:not([data-msuie-split]),
.msuie-motion-ready .msuie-main [data-msuie-reveal].is-visible:not([data-msuie-split]) {
	opacity: 1;
	transform: translate3d(0, 0, 0);
	will-change: auto;
}

.msuie-main .msuie-word-mask {
	display: inline-block;
	overflow: hidden;
	overflow: clip;
	padding-bottom: 0.1em;
	margin-right: 0.2em;
	margin-bottom: -0.1em;
	vertical-align: top;
}

.msuie-main .msuie-word-mask:last-child {
	margin-right: 0;
}

.msuie-main .msuie-word {
	display: inline-block;
}

.msuie-main.msuie-motion-ready [data-msuie-split] .msuie-word,
.msuie-motion-ready .msuie-main [data-msuie-split] .msuie-word {
	opacity: 0;
	transform: translate3d(0, 112%, 0) rotate(1.5deg);
	transform-origin: left bottom;
	transition:
		opacity 1ms linear 180ms,
		transform 900ms var(--msuie-story-ease);
	transition-delay: calc(var(--msuie-word-index, 0) * 38ms);
	will-change: transform;
}

.msuie-main.msuie-motion-ready [data-msuie-split].is-visible .msuie-word,
.msuie-motion-ready .msuie-main [data-msuie-split].is-visible .msuie-word {
	opacity: 1;
	transform: translate3d(0, 0, 0) rotate(0deg);
	will-change: auto;
}

.msuie-main.msuie-motion-ready .msuie-portrait-rail figure:not(.is-visible) img,
.msuie-motion-ready .msuie-main .msuie-portrait-rail figure:not(.is-visible) img {
	transform: scale(1.04);
}

.msuie-main.msuie-motion-ready .msuie-portrait-rail figure.is-visible img,
.msuie-motion-ready .msuie-main .msuie-portrait-rail figure.is-visible img {
	transform: scale(1);
}

@media (min-width: 48rem) {
	.msuie-story-section,
	.msuie-story-closing {
		padding-inline: clamp(2.5rem, 7vw, 6.5rem);
	}

	.msuie-main {
		--msuie-story-gutter: clamp(2.5rem, 7vw, 6.5rem);
	}

	.msuie-gel-story__intro h2 {
		font-size: clamp(4rem, 8.2vw, 7rem);
	}

	.msuie-gel-product {
		height: min(55svh, 45vw);
	}

	.msuie-gel-node {
		max-width: 15rem;
	}

	.msuie-gel-node--one {
		left: 17%;
	}

	.msuie-gel-node--two {
		right: 16%;
	}

	.msuie-gel-node--three {
		left: 24%;
	}

	.msuie-pressure {
		grid-template-columns: minmax(0, 1.2fr) minmax(16rem, 0.8fr);
		column-gap: 8vw;
	}

	.msuie-pressure > .msuie-story-label,
	.msuie-pressure > h2,
	.msuie-pressure > .msuie-word-river,
	.msuie-pressure > .msuie-pressure__answer {
		grid-column: 1 / -1;
	}

	.msuie-pressure__lead {
		grid-column: 2;
		margin-left: 0 !important;
	}

	.msuie-pressure__answer {
		justify-self: end;
		width: 70%;
	}

	.msuie-benefits,
	.msuie-formula,
	.msuie-use,
	.msuie-voices,
	.msuie-story-faq {
		grid-template-columns: minmax(16rem, 0.78fr) minmax(24rem, 1.22fr);
		column-gap: clamp(4rem, 10vw, 10rem);
	}

	.msuie-benefit-list article {
		grid-template-columns: 2.4rem minmax(0, 1fr);
	}

	.msuie-ingredient-list li {
		grid-template-columns: 2.4rem minmax(10rem, 0.75fr) minmax(12rem, 1fr);
		column-gap: 1.2rem;
	}

	.msuie-ingredient-list p {
		grid-column: 3;
	}

	.msuie-use-steps {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
	}

	.msuie-use-steps article {
		grid-template-columns: 1fr;
		align-content: start;
		padding: 2.3rem clamp(1.1rem, 2.3vw, 2.5rem) 2.6rem;
		border-bottom: 1px solid var(--msuie-story-line);
	}

	.msuie-use-steps article + article {
		border-left: 1px solid var(--msuie-story-line);
	}

	.msuie-use-steps h3,
	.msuie-use-steps p {
		grid-column: 1;
	}

	.msuie-portrait-rail {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		grid-auto-flow: initial;
		gap: clamp(0.9rem, 2vw, 2rem);
		width: 100%;
		margin-left: 0;
		overflow: visible;
		padding-inline: 0;
	}

	.msuie-shop {
		grid-template-columns: minmax(0, 1.05fr) minmax(20rem, 0.95fr);
		align-items: center;
		column-gap: clamp(4rem, 8vw, 9rem);
	}

	.msuie-shop__visual {
		min-height: min(52rem, 88svh);
	}

	.msuie-shop__visual::before {
		width: min(38vw, 35rem);
	}

	.msuie-shop__visual img {
		height: min(78svh, 58rem);
	}

	.msuie-story-faq__list details > div {
		padding-left: 3.6rem;
	}

	.msuie-story-closing {
		min-height: 94svh;
	}
}

@media (min-width: 72rem) {
	.msuie-story-section,
	.msuie-story-closing {
		padding-top: clamp(9rem, 12vw, 13rem);
		padding-bottom: clamp(9rem, 12vw, 13rem);
	}

	.msuie-story-heading h2,
	.msuie-shop__copy h2 {
		font-size: clamp(5.5rem, 7.3vw, 7.8rem);
	}

	.msuie-benefits,
	.msuie-formula,
	.msuie-use,
	.msuie-voices,
	.msuie-story-faq {
		grid-template-columns: minmax(22rem, 0.72fr) minmax(35rem, 1.28fr);
	}
}

@media (max-width: 23rem) {
	.msuie-main {
		--msuie-story-gutter: clamp(1rem, 4.6vw, 1.2rem);
	}

	.msuie-gel-story__intro h2,
	.msuie-story-heading h2,
	.msuie-pressure > h2,
	.msuie-story-closing h2,
	.msuie-shop__copy h2 {
		letter-spacing: -0.055em;
	}

	.msuie-gel-product {
		height: min(49svh, 114vw);
	}

	.msuie-shop__facts span {
		letter-spacing: 0.05em;
	}
}

/* Keep long editorial words inside the grid track on compact 320px phones. */
@media (max-width: 22rem) {
	.msuie-main .msuie-story-closing > * {
		min-width: 0;
		max-width: 100%;
	}

	.msuie-main .msuie-story-closing h2 {
		font-size: clamp(2.75rem, 15vw, 3.25rem);
	}

	.msuie-main .msuie-story-label {
		gap: 0.6rem;
		max-width: 100%;
		font-size: 0.61rem;
		letter-spacing: 0.12em;
	}

	.msuie-main .msuie-story-label::before {
		flex-basis: 1.25rem;
		width: 1.25rem;
	}
}

/* --------------------------------------------------------------------------
 * Editorial type refinement: fewer repeated ornaments, one decisive display
 * tier, quieter reading copy, and annotations that feel drawn rather than boxed.
 * -------------------------------------------------------------------------- */

.msuie-main .msuie-story-label {
	display: block;
	max-width: 28rem;
	color: #70716c;
	font-size: clamp(0.72rem, 3vw, 0.82rem);
	font-weight: 510;
	letter-spacing: 0.035em;
	line-height: 1.4;
	text-transform: none;
}

.msuie-main .msuie-story-label::before {
	display: none;
}

.msuie-main .msuie-story-heading {
	gap: clamp(1rem, 4vw, 1.65rem);
}

.msuie-main :is(.msuie-benefits, .msuie-formula, .msuie-use, .msuie-portraits, .msuie-story-faq) .msuie-story-heading h2,
.msuie-main .msuie-shop__copy h2 {
	max-width: 10.5ch;
	font-size: clamp(2.75rem, 11.8vw, 5.8rem);
	font-weight: 470;
	letter-spacing: -0.047em;
	line-height: 0.96;
}

.msuie-main .msuie-story-heading > p:last-child,
.msuie-main .msuie-shop__lead,
.msuie-main .msuie-pressure__lead {
	font-size: clamp(1rem, 4.15vw, 1.12rem);
	font-weight: 390;
	line-height: 1.55;
}

/* The gel labels read as small annotations along the moving line. */
.msuie-main .msuie-gel-node {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.18rem;
	max-width: min(8.5rem, 37vw);
	color: #3e4140;
}

.msuie-main .msuie-gel-node::before {
	top: 0.38rem;
	right: auto;
	left: -0.82rem;
	display: block;
	width: 0.32rem;
	height: 0.32rem;
	border-radius: 50%;
	background: #7da5b7;
	box-shadow: 0 0 0 0.28rem rgba(125, 165, 183, 0.1);
}

.msuie-main .msuie-gel-node > span {
	color: #81909a;
	font-size: 0.56rem;
	font-weight: 540;
	letter-spacing: 0.08em;
	opacity: 1;
}

.msuie-main .msuie-gel-node > strong {
	font-size: clamp(0.78rem, 3.25vw, 0.9rem);
	font-weight: 480;
	letter-spacing: -0.015em;
	line-height: 1.22;
}

.msuie-main .msuie-gel-next {
	gap: 0.55rem;
	padding-bottom: 0.35rem;
	font-size: 0.68rem;
	font-weight: 540;
	letter-spacing: 0.07em;
	text-transform: none;
}

/* Pain point typography uses three distinct beats instead of a text block. */
.msuie-main .msuie-pressure {
	gap: clamp(1.8rem, 8vw, 4.5rem);
}

.msuie-main .msuie-pressure > h2 {
	display: grid;
	gap: 0;
	max-width: none;
	font-size: clamp(3.65rem, 17vw, 9.5rem);
	font-weight: 480;
	letter-spacing: -0.058em;
	line-height: 0.82;
}

.msuie-main .msuie-pressure > h2 > span {
	display: block;
	transition: transform 950ms var(--msuie-story-ease), opacity 650ms ease;
}

.msuie-main .msuie-pressure > h2 > span:nth-child(2) {
	margin-left: 0.42em;
	color: #4f6975;
	font-weight: 390;
}

.msuie-main .msuie-pressure > h2 > span:nth-child(3) {
	margin-top: 0.18em;
	margin-left: 1.15em;
	font-size: 0.66em;
	font-weight: 430;
	letter-spacing: -0.045em;
}

.msuie-motion-ready .msuie-main .msuie-pressure > h2:not(.is-visible) > span {
	opacity: 0;
	transform: translate3d(0, 0.55em, 0);
}

.msuie-motion-ready .msuie-main .msuie-pressure > h2 > span:nth-child(2) {
	transition-delay: 80ms;
}

.msuie-motion-ready .msuie-main .msuie-pressure > h2 > span:nth-child(3) {
	transition-delay: 160ms;
}

.msuie-main .msuie-pressure__lead {
	max-width: 20rem;
	margin-left: auto !important;
}

.msuie-main .msuie-pressure__answer {
	display: grid;
	gap: clamp(0.75rem, 3vw, 1.15rem);
	max-width: none;
	padding-top: 0;
	border-top: 0;
	letter-spacing: 0;
}

.msuie-main .msuie-pressure__answer > span {
	max-width: 18ch;
	color: var(--msuie-story-muted);
	font-size: clamp(1.05rem, 4.4vw, 1.4rem);
	font-weight: 390;
	letter-spacing: -0.015em;
	line-height: 1.32;
}

.msuie-main .msuie-pressure__answer > strong {
	max-width: 9ch;
	font-size: clamp(3rem, 13.2vw, 7.2rem);
	font-weight: 470;
	letter-spacing: -0.055em;
	line-height: 0.9;
}

/* Rows remain useful, but lose the form-field feeling. */
.msuie-main :is(.msuie-benefit-list, .msuie-ingredient-list, .msuie-use-steps) {
	border-top-color: rgba(40, 40, 39, 0.09);
}

.msuie-main .msuie-benefit-list article {
	grid-template-columns: 1fr;
	gap: 1.2rem;
	padding-block: clamp(2.25rem, 9.5vw, 3.5rem);
	border-bottom-color: rgba(40, 40, 39, 0.1);
}

.msuie-main .msuie-benefit-list article > span,
.msuie-main .msuie-ingredient-list li > span,
.msuie-main .msuie-use-steps article > span {
	padding-top: 0;
	color: #718994;
	font-size: 0.66rem;
	font-weight: 520;
	letter-spacing: 0.06em;
	opacity: 1;
}

.msuie-main .msuie-benefit-list h3 {
	max-width: 12ch;
	font-size: clamp(1.85rem, 7.7vw, 2.65rem);
	font-weight: 480;
	letter-spacing: -0.045em;
	line-height: 0.98;
}

.msuie-main .msuie-benefit-list p {
	max-width: 27rem;
	font-size: clamp(0.98rem, 4vw, 1.08rem);
	line-height: 1.55;
}

.msuie-main .msuie-ingredient-list strong,
.msuie-main .msuie-use-steps h3 {
	font-weight: 480;
}

.msuie-main .msuie-portraits .msuie-story-heading {
	max-width: 37rem;
	margin-bottom: clamp(2.4rem, 10vw, 4.5rem);
}

.msuie-main .msuie-portrait-rail figcaption {
	gap: 0.4rem;
	padding-top: 0.75rem;
	border-top: 0;
}

.msuie-main .msuie-portrait-rail figcaption span {
	color: #717b7e;
	font-size: 0.62rem;
	font-weight: 520;
	letter-spacing: 0.07em;
}

.msuie-main .msuie-portrait-rail figcaption strong {
	font-weight: 470;
	line-height: 1.18;
}

@media (min-width: 48rem) {
	.msuie-main .msuie-benefit-list article {
		grid-template-columns: 3rem minmax(0, 1fr);
	}

	.msuie-main .msuie-pressure__answer {
		width: 72%;
	}
}

@media (max-width: 22rem) {
	.msuie-main :is(.msuie-benefits, .msuie-formula, .msuie-use, .msuie-portraits, .msuie-story-faq) .msuie-story-heading h2,
	.msuie-main .msuie-shop__copy h2 {
		font-size: clamp(2.45rem, 12vw, 2.8rem);
	}

	.msuie-main .msuie-pressure > h2 {
		font-size: clamp(3.15rem, 16vw, 3.6rem);
	}

	.msuie-main .msuie-pressure__answer > strong {
		font-size: clamp(2.75rem, 13vw, 3.2rem);
	}
}

/* --------------------------------------------------------------------------
 * 1.6.1 second-page refinement.
 * The completed hero and aircraft-window scene above remain untouched.
 * -------------------------------------------------------------------------- */

.msuie-main {
	--msuie-story-paper: #f6f3eb;
	--msuie-story-ink: #242523;
	--msuie-story-muted: #666963;
	--msuie-story-line: rgba(36, 37, 35, 0.13);
	background: var(--msuie-story-paper);
}

.msuie-has-landing .my-themes-site-footer {
	background: #ece6da;
}

.msuie-main .msuie-story-section {
	padding-block: clamp(5.5rem, 22vw, 10rem);
}

.msuie-main :is(.msuie-benefits, .msuie-formula, .msuie-use, .msuie-story-faq) .msuie-story-heading h2 {
	max-width: 18ch;
	font-size: clamp(2.05rem, 8.4vw, 4.65rem);
	font-weight: 485;
	letter-spacing: -0.043em;
	line-height: 1;
}

/* Keep the gel guide connected to the gently moving real bottle. The bridge
 * begins inside the opening and is masked by the product PNG itself. */
.msuie-main .msuie-gel-story {
	/*
	 * The visible sticky panel occupies the first 100svh. Reducing the former
	 * 180svh scroll runway by 30% leaves a 126svh runway and a 226svh section.
	 */
	height: 226vh;
	height: 226svh;
	min-height: 79.6rem;
	min-height: max(79.6rem, calc(70rem + 30vh));
	min-height: max(79.6rem, calc(70rem + 30svh));
}

.msuie-main .msuie-gel-story__sticky {
	overflow: hidden;
	overflow: clip;
}

.msuie-main .msuie-gel-cue {
	position: absolute;
	top: clamp(5rem, 11svh, 7.25rem);
	right: var(--msuie-story-gutter);
	left: var(--msuie-story-gutter);
	z-index: 6;
	pointer-events: none;
	opacity: clamp(0, calc(1 - (var(--gel-progress) * 3.2)), 1);
	transform: none;
}

.msuie-main.msuie-motion-ready .msuie-gel-cue.is-visible {
	opacity: clamp(0, calc(1 - (var(--gel-progress) * 3.2)), 1);
}

.msuie-main .msuie-gel-cue .msuie-story-label {
	color: #686b66;
	font-size: clamp(0.68rem, 2.8vw, 0.78rem);
	letter-spacing: 0.04em;
}

.msuie-main .msuie-gel-product {
	top: 13svh;
	z-index: 4;
	height: min(52svh, 118vw);
	transform: translate3d(-50%, calc(var(--gel-progress) * -2.8svh), 0)
		rotate(calc(-2deg + (var(--gel-progress) * 4deg)))
		scale(calc(1 - (var(--gel-progress) * 0.035)));
	transform-origin: 51.335% 82.776%;
}

.msuie-main .msuie-gel-path {
	z-index: 3;
}

.msuie-main .msuie-gel-path :is([data-msuie-gel-path], [data-msuie-gel-bridge], [data-msuie-gel-segment]) {
	fill: none;
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	stroke-linecap: round;
	stroke-linejoin: round;
	vector-effect: non-scaling-stroke;
	will-change: stroke-dashoffset;
}

.msuie-main .msuie-gel-path__shadow {
	stroke: rgba(48, 70, 77, 0.022);
	stroke-width: 20;
	transform: translate(1.55px, 2px);
}

.msuie-main .msuie-gel-path__body {
	stroke-width: 17;
}

.msuie-main .msuie-gel-path__volume {
	stroke: rgba(108, 139, 145, 0.045);
	stroke-width: var(--gel-volume, 21);
	transform: translate(1.1px, 1.55px);
	opacity: 1;
}

.msuie-main .msuie-gel-path__shine {
	opacity: 0;
}

.msuie-main .msuie-gel-bridge.msuie-gel-path__shine {
	stroke: rgba(255, 255, 255, 0.74);
	stroke-width: 1.9;
	transform: translate(-2.4px, -0.9px);
	opacity: 0.64;
}

.msuie-main .msuie-gel-path__specular {
	stroke: rgba(255, 255, 255, 0.78);
	stroke-width: 2.65;
	transform: translate(-2.1px, -1.25px);
	opacity: 0.68;
}

.msuie-main .msuie-gel-path__edge {
	opacity: 0;
}

.msuie-main .msuie-gel-reveal-mask {
	fill: none;
	stroke: #fff;
	stroke-width: 52;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.msuie-main .msuie-gel-ribbon {
	pointer-events: none;
}

.msuie-main .msuie-gel-ribbon__shadow {
	fill: rgba(43, 68, 75, 0.055);
	transform: translate(1.45px, 2px);
}

.msuie-main .msuie-gel-ribbon__body {
	opacity: 1;
}

.msuie-main .msuie-gel-ribbon__glint,
.msuie-main .msuie-gel-ribbon__refraction {
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
	vector-effect: non-scaling-stroke;
}

.msuie-main .msuie-gel-ribbon__glint {
	stroke: rgba(255, 255, 255, 0.82);
	stroke-width: 2.25;
}

.msuie-main .msuie-gel-ribbon__refraction {
	stroke: rgba(83, 119, 126, 0.18);
	stroke-width: 1.05;
}

.msuie-main .msuie-gel-bridge.msuie-gel-path__shadow {
	stroke-width: 12.5;
	transform: translate(0.85px, 1.1px);
}

.msuie-main .msuie-gel-bridge.msuie-gel-path__body {
	stroke-width: 10.5;
}

.msuie-main .msuie-gel-bubble {
	opacity: 0;
	transition: opacity 220ms ease-out;
}

.msuie-main .msuie-gel-bubble.is-visible {
	opacity: 0.88;
}

.msuie-main .msuie-gel-bubble > circle:first-child {
	fill: rgba(255, 255, 255, 0.12);
	stroke: rgba(92, 128, 135, 0.54);
	stroke-width: 0.44;
}

.msuie-main .msuie-gel-bubble__shine {
	fill: rgba(255, 255, 255, 0.9);
	stroke: none;
}

/* 1.6.2 — clear surface-gel optics (reference-matched, no raster tiling). */
.msuie-main .msuie-gel-ribbon__shadow {
	fill: none;
	stroke: rgba(42, 61, 59, 0.048);
	stroke-width: 0.66;
	transform: translate(0.62px, 0.85px);
	stroke-linejoin: round;
	vector-effect: non-scaling-stroke;
}

.msuie-main .msuie-gel-ribbon__body {
	opacity: 1;
}

.msuie-main .msuie-gel-ribbon__pool {
	stroke: rgba(255, 255, 255, 0.44);
	stroke-width: 0.48;
	vector-effect: non-scaling-stroke;
}

.msuie-main .msuie-gel-ribbon__rim {
	fill: none;
	stroke: rgba(255, 255, 255, 0.22);
	stroke-width: 0.42;
	transform: translate(-0.32px, -0.28px);
	stroke-linejoin: round;
	vector-effect: non-scaling-stroke;
}

.msuie-main .msuie-gel-ribbon__glint {
	stroke: rgba(255, 255, 255, 0.84);
	stroke-width: 1.28;
}

.msuie-main .msuie-gel-ribbon__glint--soft {
	stroke: rgba(255, 255, 255, 0.42);
	stroke-width: 0.94;
}

.msuie-main .msuie-gel-ribbon__refraction {
	stroke: rgba(75, 111, 115, 0.18);
	stroke-width: 0.68;
}

.msuie-main .msuie-gel-ribbon__refraction--fine {
	stroke: rgba(66, 98, 101, 0.105);
	stroke-width: 0.38;
}

.msuie-main .msuie-gel-bridge.msuie-gel-path__shadow {
	stroke: rgba(48, 70, 72, 0.03);
	stroke-width: 10.2;
	transform: translate(0.55px, 0.82px);
}

.msuie-main .msuie-gel-bridge.msuie-gel-path__body {
	stroke-width: 9;
}

.msuie-main .msuie-gel-bridge.msuie-gel-path__shine {
	stroke: rgba(255, 255, 255, 0.72);
	stroke-width: 1.1;
	transform: translate(-1.2px, -0.45px);
	opacity: 0.72;
}

.msuie-main .msuie-gel-bridge.msuie-gel-path__edge {
	stroke: rgba(75, 107, 110, 0.2);
	stroke-width: 0.72;
	transform: translate(1px, 0.75px);
	opacity: 0.42;
}

.msuie-main .msuie-gel-bubble.is-visible {
	opacity: 0.78;
}

.msuie-main .msuie-gel-bubble > circle:first-child {
	fill: rgba(255, 255, 255, 0.08);
	stroke: rgba(91, 124, 127, 0.34);
	stroke-width: 0.3;
}

.msuie-main .msuie-gel-bubble__shine {
	fill: rgba(255, 255, 255, 0.78);
}

.msuie-main .msuie-gel-drop {
	opacity: 0;
	filter: none;
}

.msuie-main .msuie-gel-drop__body {
	fill: rgba(213, 228, 230, 0.24);
	stroke: rgba(132, 164, 170, 0.34);
	stroke-width: 0.7;
}

.msuie-main .msuie-gel-drop__shine {
	fill: rgba(255, 255, 255, 0.76);
}

.msuie-main .msuie-gel-node {
	z-index: 5;
	width: min(8.8rem, 36vw);
	max-width: none;
	padding-left: 0.9rem;
	opacity: var(--node-progress);
	transform: none;
	will-change: opacity;
}

.msuie-main .msuie-gel-node::before {
	top: 0.37rem;
	left: 0;
}

.msuie-main .msuie-gel-node--one {
	top: 68.246%;
	left: 21.538%;
}

.msuie-main .msuie-gel-node--two {
	top: 80.213%;
	right: 20.769%;
	left: auto;
	padding-right: 0.9rem;
	padding-left: 0;
	text-align: right;
}

.msuie-main .msuie-gel-node--two::before {
	right: 0;
	left: auto;
}

.msuie-main .msuie-gel-node--three {
	top: 89.218%;
	left: 24.615%;
}

/* Pain points use short signals rather than another dense paragraph block. */
.msuie-main .msuie-pressure {
	gap: clamp(1.55rem, 6.5vw, 3.5rem);
	padding-top: clamp(6.5rem, 26vw, 12rem);
}

.msuie-main .msuie-pressure > h2 {
	font-size: clamp(2.8rem, 12.5vw, 6.8rem);
	line-height: 0.86;
}

.msuie-main .msuie-pressure-signals {
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--msuie-story-line);
	list-style: none;
}

.msuie-main .msuie-pressure-signals li {
	display: grid;
	grid-template-columns: 2rem minmax(0, 1fr) auto;
	align-items: baseline;
	gap: 0.75rem;
	padding-block: clamp(1rem, 4.5vw, 1.45rem);
	border-bottom: 1px solid var(--msuie-story-line);
}

.msuie-main .msuie-pressure-signals span,
.msuie-main .msuie-pressure-signals small {
	color: #72808a;
	font-size: 0.64rem;
	font-weight: 540;
	letter-spacing: 0.055em;
	text-transform: uppercase;
}

.msuie-main .msuie-pressure-signals strong {
	font-size: clamp(1.05rem, 4.35vw, 1.3rem);
	font-weight: 490;
	letter-spacing: -0.025em;
}

.msuie-main .msuie-pressure__lead {
	max-width: 24rem;
	margin-left: 0 !important;
	font-size: clamp(0.96rem, 3.9vw, 1.08rem);
}

.msuie-main .msuie-pressure__answer > strong {
	max-width: 12ch;
	font-size: clamp(2.35rem, 9.5vw, 5.3rem);
	line-height: 0.96;
}

/* Make the benefits scan like an editorial index, not form fields. */
.msuie-main .msuie-benefit-list article {
	grid-template-columns: 2.2rem minmax(0, 1fr);
	gap: 0.85rem;
	padding-block: clamp(1.7rem, 7vw, 2.65rem);
}

.msuie-main .msuie-benefit-list h3 {
	max-width: 17ch;
	font-size: clamp(1.5rem, 6.2vw, 2.2rem);
	line-height: 1.04;
}

.msuie-main .msuie-benefit-list p {
	font-size: clamp(0.9rem, 3.65vw, 1rem);
}

/* Ingredients are self-explanatory through labels plus code-native material
 * marks; no newly generated decorative imagery is used. */
.msuie-main .msuie-formula-layout {
	display: grid;
	gap: clamp(2.4rem, 10vw, 5rem);
}

.msuie-main .msuie-formula-product {
	display: grid;
	place-items: center;
	gap: 0.8rem;
	min-height: 38svh;
	margin: 0;
	padding: 1.2rem 0 1.6rem;
	border-bottom: 1px solid var(--msuie-story-line);
	background: radial-gradient(circle at 50% 52%, rgba(255, 255, 255, 0.7), transparent 54%);
}

.msuie-main .msuie-formula-product img {
	width: auto;
	height: min(34svh, 25rem);
	object-fit: contain;
	filter: drop-shadow(0 1.35rem 1.5rem rgba(52, 57, 55, 0.1));
}

.msuie-main .msuie-formula-product figcaption {
	color: var(--msuie-story-muted);
	font-size: 0.68rem;
	letter-spacing: 0.035em;
}

.msuie-main .msuie-formula-cards {
	border-top: 1px solid var(--msuie-story-line);
}

.msuie-main .msuie-formula-cards article {
	display: grid;
	grid-template-columns: 1.8rem clamp(2.75rem, 13vw, 4.25rem) minmax(0, 1fr);
	grid-template-rows: auto auto;
	align-items: center;
	gap: 0.35rem clamp(0.65rem, 3vw, 1.15rem);
	padding-block: clamp(1.2rem, 5vw, 1.7rem);
	border-bottom: 1px solid var(--msuie-story-line);
}

.msuie-main .msuie-formula-cards article > span {
	grid-row: 1 / 3;
	align-self: start;
	padding-top: 0.25rem;
	color: #718994;
	font-size: 0.62rem;
	font-weight: 540;
}

.msuie-main .msuie-formula-mark {
	position: relative;
	grid-row: 1 / 3;
	width: 100%;
	aspect-ratio: 1;
	overflow: hidden;
	border: 1px solid rgba(95, 132, 148, 0.22);
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.42);
}

.msuie-main .msuie-formula-mark::before,
.msuie-main .msuie-formula-mark::after,
.msuie-main .msuie-formula-mark i {
	position: absolute;
	display: block;
	content: "";
}

.msuie-main .msuie-formula-mark--water::before {
	inset: 21%;
	border: 1px solid rgba(83, 132, 155, 0.42);
	border-radius: 50%;
	box-shadow: 0 0 0 0.38rem rgba(142, 185, 202, 0.1), 0 0 0 0.75rem rgba(142, 185, 202, 0.06);
}

.msuie-main .msuie-formula-mark--water i {
	top: 23%;
	left: 48%;
	width: 18%;
	aspect-ratio: 0.78;
	border-radius: 65% 45% 62% 48%;
	background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(123, 176, 198, 0.65));
	transform: rotate(42deg);
}

.msuie-main .msuie-formula-mark--glycerin::before {
	inset: 27% 17%;
	border-radius: 58% 42% 61% 39% / 44% 60% 40% 56%;
	background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(164, 202, 216, 0.54));
	box-shadow: inset 0.22rem 0.18rem 0.42rem rgba(255, 255, 255, 0.88), 0 0.35rem 0.65rem rgba(80, 116, 132, 0.12);
	transform: rotate(-12deg);
}

.msuie-main .msuie-formula-mark--calm::before,
.msuie-main .msuie-formula-mark--calm::after,
.msuie-main .msuie-formula-mark--calm i {
	right: 15%;
	left: 15%;
	height: 23%;
	border-radius: 999rem;
	background: linear-gradient(90deg, rgba(203, 221, 218, 0.46), rgba(255, 255, 255, 0.92));
}

.msuie-main .msuie-formula-mark--calm::before { top: 22%; }
.msuie-main .msuie-formula-mark--calm i { top: 39%; left: 24%; }
.msuie-main .msuie-formula-mark--calm::after { top: 56%; right: 24%; }

.msuie-main .msuie-formula-cards h3 {
	font-size: clamp(1.02rem, 4.25vw, 1.3rem);
	font-weight: 510;
	letter-spacing: -0.025em;
	line-height: 1.15;
}

.msuie-main .msuie-formula-cards p {
	color: var(--msuie-story-muted);
	font-size: clamp(0.78rem, 3.25vw, 0.9rem);
	line-height: 1.45;
}

.msuie-main .msuie-formula__ingredients {
	display: grid;
	gap: 0.45rem;
	max-width: 42rem;
	padding-top: 1rem;
	border-top: 1px solid var(--msuie-story-line);
	color: var(--msuie-story-muted);
	font-size: clamp(0.73rem, 3vw, 0.84rem);
	line-height: 1.5;
}

.msuie-main .msuie-formula__ingredients span {
	color: var(--msuie-story-ink);
	font-weight: 540;
}

/* A varied moment rail: two human contexts and one water/action texture.
 * Existing site assets only; no new generated imagery. */
.msuie-main .msuie-moment-grid {
	display: grid;
	grid-auto-columns: min(78vw, 21rem);
	grid-auto-flow: column;
	gap: clamp(0.75rem, 3.5vw, 1.25rem);
	width: calc(100% + var(--msuie-story-gutter));
	overflow-x: auto;
	overflow-y: hidden;
	padding: 0 var(--msuie-story-gutter) 0 0;
	scroll-padding-right: var(--msuie-story-gutter);
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.msuie-main .msuie-moment-grid::-webkit-scrollbar { display: none; }

.msuie-main .msuie-moment-grid figure {
	position: relative;
	margin: 0;
	scroll-snap-align: start;
}

.msuie-main .msuie-moment-grid img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	filter: saturate(0.82) contrast(0.96);
	transition: transform 900ms var(--msuie-story-ease), filter 500ms ease;
}

.msuie-main .msuie-moment-grid figure:nth-child(2) img {
	filter: saturate(0.72) contrast(0.94) brightness(1.04);
}

.msuie-main .msuie-moment-grid figcaption {
	display: grid;
	gap: 0.35rem;
	padding-top: 0.75rem;
}

.msuie-main .msuie-moment-grid figcaption span {
	color: #71808a;
	font-size: 0.62rem;
	font-weight: 540;
	letter-spacing: 0.055em;
	text-transform: uppercase;
}

.msuie-main .msuie-moment-grid figcaption strong {
	max-width: 19ch;
	font-size: clamp(1.03rem, 4.25vw, 1.25rem);
	font-weight: 490;
	letter-spacing: -0.025em;
	line-height: 1.2;
}

.msuie-main .msuie-use-steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	border-top: 1px solid var(--msuie-story-line);
	border-bottom: 1px solid var(--msuie-story-line);
}

.msuie-main .msuie-use-steps li {
	display: grid;
	align-content: start;
	gap: 0.65rem;
	min-width: 0;
	padding: clamp(0.9rem, 4vw, 1.35rem) clamp(0.45rem, 2.3vw, 0.85rem);
}

.msuie-main .msuie-use-steps li + li {
	border-left: 1px solid var(--msuie-story-line);
}

.msuie-main .msuie-use-steps span {
	color: #718994;
	font-size: 0.58rem;
	font-weight: 540;
}

.msuie-main .msuie-use-steps strong {
	font-size: clamp(0.76rem, 3.2vw, 0.95rem);
	font-weight: 500;
	letter-spacing: -0.018em;
	line-height: 1.25;
}

/* The old full-screen product-only panel is gone. Buying ends the same long
 * ivory page in one compact, slightly deeper closing field. */
.msuie-main .msuie-story-closing {
	display: grid;
	gap: clamp(1.35rem, 5.5vw, 2.6rem);
	min-height: 76svh;
	align-content: center;
	padding-block: clamp(6.5rem, 26vw, 12rem);
	background: #ece6da;
}

.msuie-main .msuie-story-closing h2 {
	max-width: 15ch;
	font-size: clamp(2.35rem, 9.4vw, 5.5rem);
	font-weight: 480;
	line-height: 0.98;
}

.msuie-main .msuie-closing-product {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1rem;
	padding-block: 1rem;
	border-block: 1px solid rgba(36, 37, 35, 0.14);
}

.msuie-main .msuie-closing-product > div:first-child {
	display: grid;
	gap: 0.25rem;
}

.msuie-main .msuie-closing-product strong {
	font-size: clamp(1rem, 4.2vw, 1.3rem);
	font-weight: 520;
}

.msuie-main .msuie-closing-product span,
.msuie-main .msuie-price {
	color: var(--msuie-story-muted);
	font-size: 0.74rem;
}

.msuie-main .msuie-closing-action {
	display: flex;
}

.msuie-main .msuie-closing-action .msuie-button {
	min-width: min(100%, 18rem);
	justify-content: space-between;
}

.msuie-main .msuie-shipping-note {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	color: var(--msuie-story-muted);
	font-size: clamp(0.648rem, 2.7vw, 0.756rem);
}

.msuie-main .msuie-shipping-note svg {
	width: 1rem;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.5;
}

@media (min-width: 48rem) {
	.msuie-main .msuie-formula-layout {
		grid-template-columns: minmax(16rem, 0.72fr) minmax(24rem, 1.28fr);
		align-items: center;
	}

	.msuie-main .msuie-formula-product {
		border-right: 1px solid var(--msuie-story-line);
		border-bottom: 0;
	}

	.msuie-main .msuie-moment-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		grid-auto-flow: initial;
		width: 100%;
		overflow: visible;
		padding-right: 0;
	}

	.msuie-main .msuie-pressure-signals {
		grid-column: 1 / -1;
	}
}

@media (max-width: 23rem) {
	.msuie-main .msuie-gel-product {
		height: min(52svh, 118vw);
	}

	.msuie-main .msuie-gel-node {
		width: min(7.3rem, 35vw);
	}

	.msuie-main :is(.msuie-benefits, .msuie-formula, .msuie-use, .msuie-story-faq) .msuie-story-heading h2 {
		font-size: clamp(1.9rem, 8.8vw, 2.35rem);
	}

	.msuie-main .msuie-pressure > h2 {
		font-size: clamp(2.55rem, 12.8vw, 3rem);
	}

	.msuie-main .msuie-story-closing h2 {
		font-size: clamp(2.05rem, 9.5vw, 2.5rem);
	}
}

/* --------------------------------------------------------------------------
 * 1.6.3 — continuous ivory canvas and macro clear-gel optics.
 * This remains scoped to .msuie-main so the completed hero/cabin is frozen.
 * -------------------------------------------------------------------------- */

.msuie-has-landing,
.msuie-main,
.msuie-main .msuie-gel-story,
.msuie-main .msuie-story-section,
.msuie-main .msuie-story-closing,
.msuie-has-landing .my-themes-site-footer {
	background-color: #faf9f5;
}

.msuie-main {
	--msuie-story-paper: #faf9f5;
}

.msuie-main .msuie-gel-story__sticky {
	background: #faf9f5;
}

.msuie-main .msuie-formula-product,
.msuie-main .msuie-story-closing {
	background-image: none;
}

.msuie-main .msuie-gel-path {
	shape-rendering: geometricPrecision;
}

.msuie-main .msuie-gel-ribbon__body {
	opacity: 0.96;
}

.msuie-main .msuie-gel-ribbon__shadow {
	fill: none;
	stroke: rgba(54, 77, 78, 0.14);
	stroke-width: 0.9;
	transform: translate(0.92px, 1.24px);
}

.msuie-main .msuie-gel-ribbon__pool {
	stroke: rgba(255, 255, 255, 0.72);
	stroke-width: 0.72;
	filter: drop-shadow(0.65px 0.95px 0.55px rgba(52, 77, 79, 0.13));
}

.msuie-main .msuie-gel-ribbon__rim {
	stroke: rgba(255, 255, 255, 0.62);
	stroke-width: 0.78;
	transform: translate(-0.5px, -0.48px);
}

.msuie-main .msuie-gel-ribbon__glint {
	stroke: rgba(255, 255, 255, 0.96);
	stroke-width: 1.58;
}

.msuie-main .msuie-gel-ribbon__glint--soft {
	stroke: rgba(255, 255, 255, 0.62);
	stroke-width: 1.08;
}

.msuie-main .msuie-gel-ribbon__refraction {
	stroke: rgba(64, 98, 101, 0.3);
	stroke-width: 0.82;
}

.msuie-main .msuie-gel-ribbon__refraction--fine {
	stroke: rgba(60, 91, 94, 0.18);
	stroke-width: 0.46;
}

.msuie-main .msuie-gel-bridge.msuie-gel-path__shadow {
	stroke: rgba(51, 75, 77, 0.13);
	stroke-width: 9.8;
	transform: translate(0.92px, 1.2px);
}

.msuie-main .msuie-gel-bridge.msuie-gel-path__body {
	stroke-width: 8.8;
}

.msuie-main .msuie-gel-bridge.msuie-gel-path__shine {
	stroke: rgba(255, 255, 255, 0.9);
	stroke-width: 1.3;
	transform: translate(-1.4px, -0.62px);
	opacity: 0.92;
}

.msuie-main .msuie-gel-bridge.msuie-gel-path__edge {
	stroke: rgba(59, 92, 95, 0.36);
	stroke-width: 0.72;
	transform: translate(1.12px, 0.86px);
	opacity: 0.78;
}

.msuie-main .msuie-gel-bubble.is-visible {
	opacity: 0.9;
}

.msuie-main .msuie-gel-bubble > circle:first-child {
	fill: rgba(255, 255, 255, 0.13);
	stroke: rgba(70, 105, 108, 0.5);
	stroke-width: 0.36;
	filter: drop-shadow(0.26px 0.36px 0.16px rgba(57, 84, 86, 0.18));
}

.msuie-main .msuie-gel-bubble__shine {
	fill: rgba(255, 255, 255, 0.96);
}

.msuie-main .msuie-gel-drop__body {
	fill: rgba(215, 231, 232, 0.34);
	stroke: rgba(102, 139, 143, 0.5);
}

/* --------------------------------------------------------------------------
 * 1.6.6 — one continuous, whole-ribbon photographic gel stroke.
 * The bottle-to-trail bridge and the full guide share these exact layers and
 * widths. No live SVG filters, variable ribbon outline, pools or bubble DOM.
 * -------------------------------------------------------------------------- */

.msuie-main .msuie-gel-path {
	--msuie-gel-width: clamp(0.95rem, 4.5vw, 1.15rem);
	shape-rendering: auto;
}

.msuie-main .msuie-gel-guide {
	fill: none;
	stroke: none;
	pointer-events: none;
}

.msuie-main .msuie-gel-flow-stroke {
	fill: none;
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	stroke-linecap: round;
	stroke-linejoin: round;
	vector-effect: non-scaling-stroke;
	will-change: stroke-dashoffset;
}

.msuie-main .msuie-gel-flow-stroke--depth {
	stroke: rgba(93, 112, 110, 0.34);
	stroke-width: calc(var(--msuie-gel-width) + 0.16rem);
}

.msuie-main .msuie-gel-flow-stroke--body {
	stroke: rgba(224, 234, 232, 0.9);
	stroke-width: var(--msuie-gel-width);
}

.msuie-main .msuie-gel-flow-stroke--photo {
	stroke: rgba(255, 255, 255, 0.96) !important;
	stroke-width: calc(var(--msuie-gel-width) - 0.38rem);
	stroke-opacity: 1;
}

.msuie-main .msuie-gel-product img[data-msuie-gel-product-image] {
	display: block;
	visibility: visible;
	opacity: 1;
	content-visibility: visible;
}

/* --------------------------------------------------------------------------
 * 1.6.6 — one Canvas 2D photographic renderer on every supported phone.
 * The bright layered SVG remains only as a no-blank emergency fallback.
 * -------------------------------------------------------------------------- */

.msuie-main .msuie-gel-texture-canvas {
	position: absolute;
	inset: 0;
	z-index: 3;
	display: block;
	width: 100%;
	height: 100%;
	pointer-events: none;
	opacity: 0;
	contain: strict;
}

.msuie-main .msuie-gel-story.msuie-gel-texture-ready .msuie-gel-texture-canvas {
	opacity: 1;
}

.msuie-main .msuie-gel-story.msuie-gel-texture-ready .msuie-gel-flow-stroke {
	opacity: 0;
}

/* --------------------------------------------------------------------------
 * 1.7.0 — responsive story from page three onward.
 * The hero and gel-flow sections above are intentionally left untouched.
 * -------------------------------------------------------------------------- */

.msuie-main .msuie-story-flow {
	--msuie-flow-blue: #2e78b7;
	--msuie-flow-blue-deep: #174f7b;
	--msuie-flow-ink: #20211f;
	--msuie-flow-muted: rgba(32, 33, 31, 0.64);
	--msuie-flow-line: rgba(32, 33, 31, 0.14);
	position: relative;
	isolation: isolate;
	margin-top: -1px;
	clip-path: inset(0);
	overflow: clip;
	background:
		linear-gradient(
			180deg,
			#faf9f5 0%,
			#faf9f5 14%,
			#f7f5ef 35%,
			#faf9f5 58%,
			#f5f1e9 82%,
			#ece6da 100%
		);
	font-family: var(--msuie-body-font);
	font-feature-settings: "kern";
	font-kerning: normal;
}

.msuie-main .msuie-story-flow::before {
	position: absolute;
	z-index: -1;
	top: 9rem;
	right: -52%;
	width: 92%;
	height: 76rem;
	border: 1px solid rgba(46, 120, 183, 0.12);
	border-radius: 50%;
	content: "";
	transform: rotate(18deg);
	pointer-events: none;
}

.msuie-main .msuie-story-flow .msuie-story-section,
.msuie-main .msuie-story-flow .msuie-story-closing {
	width: 100%;
	max-width: 48rem;
	min-height: 0;
	padding: clamp(5.25rem, 15svh, 8.5rem) clamp(1rem, 5.2vw, 1.6rem);
	margin-inline: auto;
	background: transparent;
}

.msuie-main .msuie-story-flow .msuie-story-heading {
	display: grid;
	gap: clamp(0.85rem, 3.5vw, 1.35rem);
	max-width: 38rem;
	margin: 0 0 clamp(2.4rem, 10vw, 4.8rem);
}

.msuie-main .msuie-story-flow .msuie-story-label {
	margin: 0;
	color: var(--msuie-flow-blue-deep);
	font-size: clamp(0.64rem, 2.8vw, 0.78rem);
	font-weight: 720;
	letter-spacing: 0.16em;
	line-height: 1.3;
	text-transform: uppercase;
}

.msuie-main .msuie-story-flow .msuie-story-heading h2,
.msuie-main .msuie-story-flow .msuie-story-closing h2 {
	max-width: 100%;
	margin: 0;
	font-family: var(--msuie-title-font);
	font-size: clamp(26.4px, 7.92vw, 35.2px);
	font-weight: 600;
	letter-spacing: -0.025em;
	line-height: 1.08;
	text-wrap: balance;
}

.msuie-main .msuie-story-flow :where(h3) {
	font-family: var(--msuie-title-font);
}

.msuie-main .msuie-story-flow :where(button, .msuie-button, .msuie-shop-direct) {
	font-family: var(--msuie-button-font);
	font-weight: 500;
}

.msuie-landing .msuie-sticky-buy,
.msuie-landing .msuie-cart-sheet {
	font-family: var(--msuie-body-font);
	font-feature-settings: "kern";
	font-kerning: normal;
}

.msuie-landing .msuie-sticky-buy > :where(button, a),
.msuie-landing .msuie-cart-sheet :where(button, .msuie-button, a.msuie-button) {
	font-family: var(--msuie-button-font);
	font-weight: 500;
}

.msuie-landing .msuie-cart-sheet > header h2 {
	font-family: var(--msuie-title-font);
}

.msuie-has-landing .my-themes-site-footer {
	font-family: var(--msuie-body-font);
	font-feature-settings: "kern";
	font-kerning: normal;
}

.msuie-has-landing .my-themes-site-footer :where(h1, h2, h3, strong) {
	font-family: var(--msuie-title-font);
}

.msuie-has-landing .my-themes-site-footer :where(a, button) {
	font-family: var(--msuie-button-font);
	font-weight: 500;
}

.msuie-has-landing .my-themes-site-footer .my-themes-footer-brand p {
	font-size: 0.9rem;
}

.msuie-has-landing .my-themes-site-footer .my-themes-footer-bottom p {
	font-size: 0.5625rem;
}

.msuie-main .msuie-story-flow .msuie-story-heading > p.msuie-story-deck:last-child {
	max-width: 31rem;
	margin: 0;
	color: var(--msuie-flow-muted);
	font-size: clamp(0.9rem, 3.78vw, 1.062rem);
	line-height: 1.55;
}

/* Split labels keep their original rule-and-copy composition without turning
 * every word into a separate flex item. Natural spaces control wrapping. */
.msuie-main .msuie-story-flow .msuie-story-label[data-msuie-split] {
	position: relative;
	display: block;
	padding-left: calc(clamp(1.75rem, 8vw, 4rem) + 0.8rem);
}

.msuie-main .msuie-story-flow .msuie-story-label[data-msuie-split]::before {
	position: absolute;
	top: 0.62em;
	left: 0;
}

.msuie-main .msuie-story-flow [data-msuie-top-exit] .msuie-word-mask {
	margin-right: 0;
}

.msuie-main .msuie-story-flow [data-msuie-top-exit] {
	opacity: 1;
	transform: none;
	transition: none;
}

.msuie-main.msuie-line-edge-ready .msuie-story-flow [data-msuie-top-exit] [data-msuie-split] .msuie-word,
.msuie-line-edge-ready .msuie-main .msuie-story-flow [data-msuie-top-exit] [data-msuie-split] .msuie-word {
	opacity: 1;
	transform: translate3d(0, 112%, 0) rotate(1.5deg);
	transition: transform 800ms cubic-bezier(0.22, 1, 0.36, 1);
	transition-delay: 0ms;
	will-change: transform;
}

.msuie-main.msuie-line-edge-ready .msuie-story-flow [data-msuie-top-exit] [data-msuie-split] .msuie-word-mask.is-msuie-line-visible .msuie-word,
.msuie-line-edge-ready .msuie-main .msuie-story-flow [data-msuie-top-exit] [data-msuie-split] .msuie-word-mask.is-msuie-line-visible .msuie-word {
	transform: translate3d(0, 0, 0) rotate(0deg);
}

.msuie-main.msuie-line-edge-initializing .msuie-story-flow [data-msuie-top-exit] [data-msuie-split] .msuie-word,
.msuie-line-edge-initializing .msuie-main .msuie-story-flow [data-msuie-top-exit] [data-msuie-split] .msuie-word {
	transition: none !important;
}

/* Once the completed aircraft-window transition has handed off to the ivory
 * canvas, the fixed bar uses the exact colour directly beneath its lower edge.
 * JS supplies the matching long-gradient sample on every scroll frame. */
body.msuie-has-landing .my-themes-site-header.msuie-header-surface-sync[data-site-header] {
	color: #20211f !important;
}

body.msuie-has-landing .my-themes-site-header.msuie-header-surface-sync[data-site-header] .my-themes-header-bar,
body.msuie-has-landing .my-themes-site-header.msuie-header-surface-sync[data-site-header] .my-themes-announcement {
	background: var(--msuie-header-surface, #faf9f5) !important;
	border-bottom-color: transparent !important;
	box-shadow: none !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
	transition: none !important;
}

body.msuie-has-landing .my-themes-site-header.msuie-header-surface-sync[data-site-header] .my-themes-brand--header img {
	filter: brightness(0) !important;
}

/* Audience */
.msuie-main .msuie-audience {
	padding-top: clamp(6rem, 18svh, 10rem);
}

.msuie-main .msuie-audience-stage {
	--msuie-card-stage-height: auto;
	--msuie-card-pin-top: 0px;
	position: relative;
	display: block;
	width: 100%;
	height: var(--msuie-card-stage-height);
}

.msuie-main .msuie-audience-cards {
	--msuie-card-depth: 5px;
	position: sticky;
	z-index: 2;
	top: var(--msuie-card-pin-top);
	display: grid;
	justify-items: center;
	gap: 8.6515px;
	gap: clamp(8.6515px, 1.297725vh, 12.1121px);
	gap: clamp(8.6515px, 1.297725svh, 12.1121px);
	width: 100%;
	margin: 0 auto;
}

.msuie-main .msuie-scene-card {
	--msuie-card-scroll-angle: 0deg;
	--msuie-card-click-angle: 0deg;
	--msuie-card-edge: 0;
	--msuie-card-lift: 0px;
	--msuie-card-gloss-x: -72%;
	--msuie-card-gloss-opacity: 0.025;
	--msuie-card-entry-x: 0px;
	--msuie-card-rest-x: 0px;
	--msuie-card-sketch-x: 0px;
	--msuie-card-sketch-size: 38px;
	--msuie-card-half-width: 180px;
	--msuie-card-half-height: 250px;
	--msuie-card-radius: clamp(0.8rem, 4vw, 1.35rem);
	--msuie-card-yaw: 0deg;
	position: relative;
	z-index: 0;
	width: calc(44.444vh - 86.2px);
	max-width: 100%;
	width: min(100%, var(--msuie-card-width, calc(44.444svh - 86.2px)));
	height: calc(33.333vh - 69.2px);
	height: var(--msuie-card-height, calc(33.333svh - 69.2px));
	aspect-ratio: 4 / 3;
	container-type: inline-size;
	perspective: clamp(850px, 235vw, 1180px);
	perspective-origin: 50% 46%;
	touch-action: pan-y;
	-webkit-tap-highlight-color: transparent;
}

.msuie-main .msuie-scene-card__sketch {
	--msuie-card-sketch-mask: url("../images/audience-icon-fitness.webp");
	position: absolute;
	z-index: 1;
	top: 50%;
	left: var(--msuie-card-sketch-x);
	display: block;
	width: var(--msuie-card-sketch-size);
	height: var(--msuie-card-sketch-size);
	color: #4f7894;
	background-color: currentColor;
	-webkit-mask-image: var(--msuie-card-sketch-mask);
	-webkit-mask-position: center;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-image: var(--msuie-card-sketch-mask);
	mask-position: center;
	mask-repeat: no-repeat;
	mask-size: contain;
	opacity: 0;
	pointer-events: none;
	transform: translate3d(-50%, -50%, 0) scale(0.9) rotate(-2deg);
	transform-origin: 50% 50%;
	transition:
		opacity 720ms cubic-bezier(0.22, 1, 0.36, 1) 140ms,
		transform 820ms cubic-bezier(0.22, 1, 0.36, 1) 140ms;
}

.msuie-main .msuie-scene-card[data-msuie-card-index="1"] .msuie-scene-card__sketch {
	--msuie-card-sketch-mask: url("../images/audience-icon-hiking.webp");
	color: #7e8b68;
	transform: translate3d(-50%, -50%, 0) scale(0.9) rotate(2deg);
}

.msuie-main .msuie-scene-card[data-msuie-card-index="2"] .msuie-scene-card__sketch {
	--msuie-card-sketch-mask: url("../images/audience-icon-office.webp");
	color: #aa735e;
}

.msuie-main .msuie-scene-card.is-msuie-card-entry-complete .msuie-scene-card__sketch {
	opacity: 0.76;
	transform: translate3d(-50%, -50%, 0) scale(1) rotate(0deg);
}

.msuie-main .msuie-scene-card__scroll-rotor,
.msuie-main .msuie-scene-card__click-rotor {
	position: absolute;
	z-index: 2;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	inset: 0;
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
}

.msuie-main .msuie-scene-card__scroll-rotor {
	transform: translate3d(var(--msuie-card-entry-x), 0, var(--msuie-card-lift))
		rotateY(var(--msuie-card-yaw))
		rotateX(var(--msuie-card-scroll-angle));
	transform-origin: 50% 50%;
	will-change: transform;
}

.msuie-main .msuie-scene-card__click-rotor {
	transform: rotateX(var(--msuie-card-click-angle));
	transform-origin: 50% 50%;
	will-change: transform;
}

.msuie-main .msuie-scene-card__face {
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	inset: 0;
	display: block;
	overflow: hidden;
	border: 0;
	outline: 0;
	border-radius: var(--msuie-card-radius);
	background: #faf9f5;
	box-shadow: none;
	isolation: isolate;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

.msuie-main .msuie-scene-card__face--front {
	transform: translateZ(calc(var(--msuie-card-depth) / 2));
}

.msuie-main .msuie-scene-card__face--back {
	transform: rotateX(180deg) translateZ(calc(var(--msuie-card-depth) / 2));
	visibility: hidden;
}

.msuie-main .msuie-scene-card[data-msuie-card-visible-face="back"] .msuie-scene-card__face--front {
	visibility: hidden;
}

.msuie-main .msuie-scene-card[data-msuie-card-visible-face="back"] .msuie-scene-card__face--back {
	visibility: visible;
}

.msuie-main .msuie-scene-card__media {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	margin: 0;
	background: #d8d8d2;
}

.msuie-main .msuie-scene-card__media::after {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 34%),
		linear-gradient(0deg, rgba(19, 28, 31, 0.12), transparent 24%);
	content: "";
	pointer-events: none;
}

.msuie-main .msuie-scene-card__media picture,
.msuie-main .msuie-scene-card__media img {
	display: block;
	width: 100%;
	height: 100%;
}

.msuie-main .msuie-scene-card__media img {
	aspect-ratio: 4 / 3;
	object-fit: contain;
}

.msuie-main .msuie-scene-card__copy {
	position: relative;
	z-index: 2;
	display: flex;
	width: 100%;
	height: 100%;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: clamp(0.32rem, 1.4vw, 0.55rem);
	padding: clamp(10px, 3.5vw, 16px);
	padding: clamp(10px, 4.4cqw, 16px);
	background:
		radial-gradient(circle at 91% 9%, rgba(181, 218, 237, 0.24), transparent 38%),
		radial-gradient(circle at 8% 105%, rgba(224, 213, 191, 0.24), transparent 42%),
		linear-gradient(150deg, rgba(255, 255, 255, 0.99), rgba(247, 245, 239, 0.99));
	text-align: center;
}

.msuie-main .msuie-scene-card h3,
.msuie-main .msuie-scene-card p {
	margin: 0;
}

.msuie-main .msuie-scene-card h3 {
	max-width: 18ch;
	font-size: clamp(1.125rem, 6.2vw, 1.6875rem);
	font-size: clamp(1.125rem, 7.8cqw, 1.6875rem);
	font-weight: 600;
	letter-spacing: -0.03em;
	line-height: 1.05;
	text-wrap: balance;
}

.msuie-main .msuie-scene-card p {
	max-width: 32ch;
	color: var(--msuie-flow-muted);
	font-size: clamp(0.8325rem, 3.82vw, 1.0125rem);
	font-size: clamp(0.8325rem, 4.8125cqw, 1.0125rem);
	line-height: 1.32;
	text-wrap: pretty;
}

.msuie-main .msuie-scene-card__gloss {
	position: absolute;
	z-index: 5;
	inset: -28% -52%;
	border-radius: inherit;
	background:
		linear-gradient(108deg, transparent 36%, rgba(255, 255, 255, 0.03) 43%, rgba(255, 255, 255, 0.26) 49%, rgba(255, 255, 255, 0.04) 55%, transparent 64%);
	mix-blend-mode: normal;
	opacity: var(--msuie-card-gloss-opacity);
	transform: translateX(var(--msuie-card-gloss-x));
	pointer-events: none;
	will-change: transform, opacity;
}

.msuie-main .msuie-scene-card__edge {
	position: absolute;
	z-index: 0;
	top: 0.15px;
	right: 0.15px;
	bottom: 0.15px;
	left: 0.15px;
	inset: 0.15px;
	display: block;
	border: 0;
	outline: 0;
	border-radius: calc(var(--msuie-card-radius) - 0.15px);
	background: #d9d5cc;
	box-shadow: none;
	backface-visibility: visible;
	-webkit-backface-visibility: visible;
	pointer-events: none;
}

.msuie-main .msuie-scene-card__edge--top {
	transform: translateZ(-1.5px);
}

.msuie-main .msuie-scene-card__edge--right {
	transform: translateZ(-0.5px);
}

.msuie-main .msuie-scene-card__edge--bottom {
	transform: translateZ(0.5px);
}

.msuie-main .msuie-scene-card__edge--left {
	transform: translateZ(1.5px);
}

.msuie-main .msuie-scene-card__hit {
	position: absolute;
	z-index: 12;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	padding: 0;
	border: 0;
	border-radius: var(--msuie-card-radius);
	background: transparent;
	color: transparent;
	cursor: pointer;
	transform: translate3d(var(--msuie-card-entry-x), 0, 0);
	touch-action: pan-y;
	-webkit-tap-highlight-color: transparent;
	will-change: transform;
}

.msuie-main .msuie-scene-card__hit:focus-visible {
	outline: 2px solid rgba(23, 79, 123, 0.92);
	outline-offset: 0.28rem;
}

.msuie-main .msuie-scene-card.is-msuie-card-clicking {
	z-index: 2;
}

.msuie-main .msuie-audience .msuie-word-river {
	width: calc(100% + 2 * clamp(1rem, 5.2vw, 1.6rem));
	margin: clamp(3.5rem, 14vw, 6rem) calc(-1 * clamp(1rem, 5.2vw, 1.6rem)) 0;
	border-block: 1px solid rgba(46, 120, 183, 0.16);
	color: rgba(23, 79, 123, 0.64);
}

/* Effects */
.msuie-main .msuie-effect-composition {
	display: grid;
	gap: clamp(2.6rem, 11vw, 4.6rem);
}

.msuie-main .msuie-effect-portrait {
	position: relative;
	display: block;
	overflow: hidden;
	width: min(86%, 22rem);
	aspect-ratio: 4 / 5;
	margin: 0 auto;
	border: 1px solid rgba(255, 255, 255, 0.54);
	border-radius: 46% 18% 38% 16% / 24% 14% 30% 18%;
	background: transparent;
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.64),
		0 1.5rem 3.8rem rgba(35, 73, 96, 0.14);
	isolation: isolate;
}

.msuie-main .msuie-use .msuie-effect-portrait {
	border-radius: 18% 46% 16% 38% / 14% 24% 18% 30%;
}

.msuie-main .msuie-effect-portrait::after {
	position: absolute;
	z-index: 2;
	inset: 0;
	border-radius: inherit;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 46%, rgba(24, 61, 84, 0.16)),
		linear-gradient(128deg, rgba(255, 255, 255, 0.28), transparent 28%);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.24);
	content: "";
	pointer-events: none;
}

.msuie-main .msuie-effect-portrait picture {
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	height: 100%;
	transform: none;
	transition: none;
}

.msuie-main .msuie-effect-portrait img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 50%;
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
	.msuie-sticky-buy {
		background: rgba(250, 249, 245, 0.88);
	}
}

.msuie-main .msuie-story-flow .msuie-benefit-list {
	display: grid;
	gap: 0;
}

.msuie-main .msuie-story-flow .msuie-benefit-list article {
	display: grid;
	grid-template-columns: 2.25rem minmax(0, 1fr);
	gap: 0.85rem;
	align-items: start;
	padding: clamp(1.35rem, 5.5vw, 1.8rem) 0;
	border-top: 1px solid var(--msuie-flow-line);
	background: transparent;
}

.msuie-main .msuie-story-flow .msuie-benefit-list article:last-child {
	border-bottom: 1px solid var(--msuie-flow-line);
}

.msuie-main .msuie-story-flow .msuie-benefit-list article > span {
	color: var(--msuie-flow-blue-deep);
	font-size: 0.65rem;
	font-weight: 720;
}

.msuie-main .msuie-story-flow .msuie-benefit-list h3,
.msuie-main .msuie-story-flow .msuie-benefit-list p {
	margin: 0;
}

.msuie-main .msuie-story-flow .msuie-benefit-list h3 {
	font-size: clamp(1.25rem, 5.5vw, 1.65rem);
	letter-spacing: -0.035em;
	line-height: 1.03;
}

.msuie-main .msuie-story-flow .msuie-benefit-list p {
	margin-top: 0.55rem;
	color: var(--msuie-flow-muted);
	font-size: clamp(0.792rem, 3.33vw, 0.9rem);
	line-height: 1.55;
}

.msuie-main .msuie-claim-note,
.msuie-main .msuie-use-note {
	max-width: 27rem;
	padding: 0 0 0 1rem;
	margin: clamp(2rem, 8vw, 3rem) 0 0 auto;
	border: 0;
	border-left: 2px solid rgba(46, 120, 183, 0.42);
	border-radius: 0;
	color: rgba(32, 33, 31, 0.52);
	font-size: 0.648rem;
	line-height: 1.5;
	text-align: left;
}

/* Formula */
.msuie-main .msuie-story-flow .msuie-formula-layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(1.6rem, 7vw, 2.5rem);
}

.msuie-main .msuie-story-flow .msuie-formula-product {
	position: relative;
	display: grid;
	overflow: hidden;
	width: 100%;
	min-height: clamp(27rem, 118vw, 38rem);
	place-items: center;
	margin: 0;
	border: 1px solid rgba(46, 120, 183, 0.14);
	border-radius: clamp(1.5rem, 8vw, 2.5rem);
	background:
		radial-gradient(circle at 50% 45%, rgba(255, 255, 255, 0.96), rgba(225, 237, 241, 0.7) 42%, rgba(250, 249, 245, 0.18) 72%);
}

.msuie-main .msuie-story-flow .msuie-formula-product::before,
.msuie-main .msuie-story-flow .msuie-formula-product::after {
	position: absolute;
	border: 1px solid rgba(46, 120, 183, 0.15);
	border-radius: 50%;
	content: "";
}

.msuie-main .msuie-story-flow .msuie-formula-product::before {
	width: 80%;
	aspect-ratio: 1;
}

.msuie-main .msuie-story-flow .msuie-formula-product::after {
	width: 110%;
	aspect-ratio: 1;
}

.msuie-main .msuie-story-flow .msuie-formula-product picture {
	z-index: 1;
	display: block;
	width: min(65%, 18rem);
	transform: translate3d(0, var(--msuie-float-y, 0), 0) rotate(var(--msuie-float-rotate, 0deg));
	transition: transform 120ms linear;
}

.msuie-main .msuie-story-flow .msuie-formula-product img {
	display: block;
	width: 100%;
	height: auto;
}

.msuie-main .msuie-story-flow .msuie-formula-product figcaption {
	position: absolute;
	z-index: 2;
	right: 1.1rem;
	bottom: 1.1rem;
	left: 1.1rem;
	color: rgba(32, 33, 31, 0.52);
	font-size: 0.64rem;
	letter-spacing: 0.1em;
	text-align: center;
	text-transform: uppercase;
}

.msuie-main .msuie-story-flow .msuie-formula-cards {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.72rem;
}

.msuie-main .msuie-story-flow .msuie-formula-cards article {
	display: flex;
	min-height: 10.5rem;
	padding: clamp(1rem, 4.4vw, 1.3rem);
	border: 1px solid rgba(32, 33, 31, 0.12);
	border-radius: 1.2rem;
	flex-direction: column;
	background: rgba(255, 255, 255, 0.46);
}

.msuie-main .msuie-story-flow .msuie-formula-cards article:last-child {
	grid-column: 1 / -1;
	min-height: 8.5rem;
}

.msuie-main .msuie-story-flow .msuie-formula-cards article > span {
	margin-bottom: auto;
	color: var(--msuie-flow-blue-deep);
	font-size: 0.62rem;
	font-weight: 720;
}

.msuie-main .msuie-story-flow .msuie-formula-cards h3,
.msuie-main .msuie-story-flow .msuie-formula-cards p {
	margin: 0;
}

.msuie-main .msuie-story-flow .msuie-formula-cards h3 {
	font-size: clamp(1rem, 4.3vw, 1.25rem);
	letter-spacing: -0.035em;
	line-height: 1.02;
	overflow-wrap: anywhere;
}

.msuie-main .msuie-story-flow .msuie-formula-cards p {
	margin-top: 0.42rem;
	color: var(--msuie-flow-muted);
	font-size: clamp(0.648rem, 2.79vw, 0.774rem);
	line-height: 1.42;
}

.msuie-main .msuie-formula-trust {
	display: grid;
	overflow: hidden;
	margin-top: clamp(1.7rem, 7vw, 2.8rem);
	border-radius: 1.35rem;
	color: rgba(255, 255, 255, 0.82);
	background: linear-gradient(145deg, #174f7b, #286e9f);
	box-shadow: 0 1.5rem 4rem rgba(23, 79, 123, 0.14);
}

.msuie-main .msuie-formula-trust p {
	padding: clamp(1.25rem, 5vw, 1.65rem);
	margin: 0;
	font-size: clamp(0.702rem, 2.97vw, 0.828rem);
	line-height: 1.55;
}

.msuie-main .msuie-formula-trust p + p {
	border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.msuie-main .msuie-formula-trust span {
	display: block;
	margin-bottom: 0.65rem;
	color: rgba(255, 255, 255, 0.58);
	font-size: 0.6rem;
	font-weight: 720;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.msuie-main .msuie-formula-trust strong {
	display: block;
	color: #fff;
	font-size: clamp(0.882rem, 3.69vw, 1.035rem);
	font-weight: 520;
}

/* Purchase */
.msuie-main .msuie-story-flow .msuie-shop {
	min-width: 0;
	max-width: 52rem;
}

.msuie-main .msuie-shop-card {
	--msuie-shop-button-size: clamp(4.65rem, 23.4vw, 6.5rem);
	--msuie-shop-button-ring: clamp(0.45rem, 2.35vw, 0.7rem);
	--msuie-shop-plate-trim: 10px;
	position: relative;
	isolation: isolate;
	display: block;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	aspect-ratio: 271 / 349;
	overflow: visible;
	margin-top: clamp(3.6rem, 15vw, 5.4rem);
	margin-right: 0;
	margin-bottom: clamp(0.8rem, 3.5vw, 1.2rem);
	margin-left: 0;
	border-radius: 0;
	background: transparent;
}

.msuie-main .msuie-shop-card::before {
	position: absolute;
	z-index: -1;
	inset: 0 0 calc(4.87% + var(--msuie-shop-plate-trim));
	border: 0;
	border-radius: 0;
	background: linear-gradient(16.72deg, #f6f2ea 0%, #faf9f5 100%);
	box-shadow: none;
	clip-path: none;
	-webkit-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNzEgMzMyJyBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSdub25lJz48cGF0aCBmaWxsPSdibGFjaycgZD0nTTE4IDAgQzgwIDAgMTg4IDMxIDI0NyA1MyBDMjYyIDU4IDI3MSA2NiAyNzEgNzYgVjMyNSBDMjcxIDMyOC44NjYgMjY3Ljg2NiAzMzIgMjY0IDMzMiBINyBDMy4xMzQgMzMyIDAgMzI4Ljg2NiAwIDMyNSBWMTggQzAgOCA4IDAgMTggMCBaJy8+PC9zdmc+") center / 100% 100% no-repeat;
	mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNzEgMzMyJyBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSdub25lJz48cGF0aCBmaWxsPSdibGFjaycgZD0nTTE4IDAgQzgwIDAgMTg4IDMxIDI0NyA1MyBDMjYyIDU4IDI3MSA2NiAyNzEgNzYgVjMyNSBDMjcxIDMyOC44NjYgMjY3Ljg2NiAzMzIgMjY0IDMzMiBINyBDMy4xMzQgMzMyIDAgMzI4Ljg2NiAwIDMyNSBWMTggQzAgOCA4IDAgMTggMCBaJy8+PC9zdmc+") center / 100% 100% no-repeat;
	content: "";
}

.msuie-main .msuie-shop-visual {
	position: absolute;
	isolation: isolate;
	inset: 0;
	display: block;
	overflow: visible;
	min-height: 0;
	padding: 0;
	margin: 0;
	background: transparent;
	pointer-events: none;
}

.msuie-main .msuie-shop-visual::before {
	content: none;
}

.msuie-main .msuie-shop-visual::after {
	position: absolute;
	z-index: 1;
	top: 53%;
	left: 17%;
	width: 70%;
	height: 10%;
	border-radius: 50%;
	background: radial-gradient(ellipse at center, rgba(48, 91, 116, 0.16) 0%, rgba(48, 91, 116, 0.055) 48%, transparent 74%);
	content: "";
	filter: blur(0.55rem);
}

.msuie-main .msuie-shop-visual picture {
	position: absolute;
	z-index: 2;
	display: block;
	top: -16.9%;
	left: 50%;
	width: 107.4%;
	max-width: calc(100vw - 1rem);
	margin: 0;
	filter: drop-shadow(0 0.6rem 0.75rem rgba(26, 67, 98, 0.1));
	transform: translateX(-50%);
	transition: none;
}

.msuie-main .msuie-shop-visual img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: contain;
}

.msuie-main .msuie-shop-info {
	position: absolute;
	z-index: 4;
	inset: 0;
	display: block;
	padding: 0;
	margin: 0;
	background: transparent;
	font-family: var(--msuie-body-font);
}

.msuie-main .msuie-shop-info h3 {
	position: absolute;
	top: 62.18%;
	left: 2.6%;
	width: 53.1%;
	margin: 0;
	color: var(--msuie-flow-ink);
	font-family: var(--msuie-body-font);
	font-size: clamp(1.27rem, 6.62vw, 1.78rem);
	font-weight: 520;
	letter-spacing: -0.045em;
	line-height: 0.91;
}

.msuie-main .msuie-shop-info h3 > span {
	display: block;
	white-space: nowrap;
}

.msuie-main .msuie-shop-price,
.msuie-main .msuie-shop-price .price {
	position: absolute;
	top: 67.34%;
	right: 2.6%;
	display: flex;
	align-items: baseline;
	justify-content: flex-end;
	gap: clamp(0.55rem, 3vw, 0.8rem);
	margin: 0;
	font-family: var(--msuie-body-font);
	white-space: nowrap;
}

.msuie-main .msuie-shop-price .price {
	position: static;
}

.msuie-main .msuie-shop-price ins,
.msuie-main .msuie-shop-price > span,
.msuie-main .msuie-shop-price .amount {
	color: var(--msuie-flow-ink);
	font-family: var(--msuie-body-font);
	font-size: clamp(1.35rem, 7.45vw, 1.92rem);
	font-weight: 700;
	letter-spacing: -0.035em;
	text-decoration: none;
}

.msuie-main .msuie-shop-price ins,
.msuie-main .msuie-shop-price ins .amount {
	color: #3986cb;
}

.msuie-main .msuie-shop-price del,
.msuie-main .msuie-shop-price del .amount {
	color: rgba(32, 33, 31, 0.42);
	font-family: var(--msuie-body-font);
	font-size: clamp(0.72rem, 3.75vw, 0.92rem);
	font-weight: 500;
	letter-spacing: -0.02em;
}

.msuie-main .msuie-shop-info .msuie-button {
	position: absolute;
	z-index: 6;
	top: auto;
	right: auto;
	bottom: 0;
	left: 51.85%;
	display: flex;
	flex-direction: column;
	width: var(--msuie-shop-button-size);
	height: var(--msuie-shop-button-size);
	min-height: 0;
	aspect-ratio: 1;
	padding: clamp(0.5rem, 2.7vw, 0.72rem) clamp(0.32rem, 1.7vw, 0.46rem) clamp(0.35rem, 2vw, 0.52rem);
	border: 1px solid rgba(255, 255, 255, 0.78);
	border-radius: 50%;
	background: radial-gradient(circle at 34% 28%, #fff 0%, #fafbfb 58%, #eef0f0 100%);
	box-shadow:
		0 0 0 var(--msuie-shop-button-ring) rgba(250, 249, 245, 0.98),
		inset 1px 1px 1px rgba(255, 255, 255, 0.92),
		inset -1px -1px 2px rgba(46, 55, 61, 0.045);
	color: var(--msuie-flow-ink);
	font-family: var(--msuie-body-font);
	font-size: clamp(0.6rem, 2.7vw, 0.72rem);
	font-weight: 500;
	letter-spacing: 0;
	line-height: 1.08;
	justify-content: center;
	justify-self: auto;
	gap: 5%;
	margin: 0;
	text-transform: uppercase;
	transform: translateX(-50%);
	transition: none;
}

.msuie-main .msuie-shop-info .msuie-product-add::before {
	flex: 0 0 35%;
	width: 31%;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyOCc+PGcgZmlsbD0nbm9uZScgc3Ryb2tlPScjMjAyMTFmJyBzdHJva2Utd2lkdGg9JzEuNzUnIHN0cm9rZS1saW5lY2FwPSdyb3VuZCcgc3Ryb2tlLWxpbmVqb2luPSdyb3VuZCc+PHBhdGggZD0nTTUgOS41aDE0bDEuMiAxNUgzLjhMNSA5LjVaJy8+PHBhdGggZD0nTTguMiA5LjVWNi44YTMuOCAzLjggMCAwIDEgNy42IDB2Mi43Jy8+PC9nPjwvc3ZnPg==") center / contain no-repeat;
	mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyOCc+PGcgZmlsbD0nbm9uZScgc3Ryb2tlPScjMjAyMTFmJyBzdHJva2Utd2lkdGg9JzEuNzUnIHN0cm9rZS1saW5lY2FwPSdyb3VuZCcgc3Ryb2tlLWxpbmVqb2luPSdyb3VuZCc+PHBhdGggZD0nTTUgOS41aDE0bDEuMiAxNUgzLjhMNSA5LjVaJy8+PHBhdGggZD0nTTguMiA5LjVWNi44YTMuOCAzLjggMCAwIDEgNy42IDB2Mi43Jy8+PC9nPjwvc3ZnPg==") center / contain no-repeat;
	content: "";
}

.msuie-main .msuie-shop-info .msuie-product-add > span {
	display: block;
	width: 4.6em;
	max-width: 100%;
	text-align: center;
	white-space: normal;
}

.msuie-main .msuie-shop-info .msuie-product-add:hover,
.msuie-main .msuie-shop-info .msuie-product-add:focus-visible {
	background: radial-gradient(circle at 34% 28%, #fff 0%, #fafbfb 58%, #eef0f0 100%);
	color: var(--msuie-flow-ink);
	transform: translateX(-50%);
}

.msuie-main .msuie-shop-info .msuie-product-add:focus-visible {
	outline: 2px solid rgba(46, 120, 183, 0.62);
	outline-offset: calc(var(--msuie-shop-button-ring) + 2px);
}

.msuie-main .msuie-shop-info .msuie-product-add:active,
.msuie-main .msuie-shop-info .msuie-product-add.is-added {
	background: radial-gradient(circle at 58% 64%, #fff 0%, #f7f8f8 64%, #eef0f0 100%);
	box-shadow:
		0 0 0 var(--msuie-shop-button-ring) rgba(250, 249, 245, 0.98),
		inset 0.5rem 0.56rem 1.13rem rgba(63, 72, 78, 0.14),
		inset -0.5rem -0.5rem 1.06rem rgba(255, 255, 255, 0.96);
	color: var(--msuie-flow-blue);
	opacity: 1;
	transform: translateX(-50%) translateY(1px);
}

.msuie-main .msuie-shop-info .msuie-product-add[disabled] {
	transform: translateX(-50%) translateY(1px);
}

@media (max-width: 22.5rem) {
	.msuie-main .msuie-shop-info {
		grid-template-columns: minmax(0, 1fr) max-content;
	}

	.msuie-main .msuie-shop-price,
	.msuie-main .msuie-shop-price .price {
		grid-column: 2;
		justify-content: flex-end;
	}
}

/* FAQ */
.msuie-main .msuie-story-flow .msuie-story-faq__list {
	border-top: 1px solid var(--msuie-flow-line);
}

.msuie-main .msuie-story-flow .msuie-story-faq details {
	border-bottom: 1px solid var(--msuie-flow-line);
}

.msuie-main .msuie-story-flow .msuie-story-faq summary {
	display: grid;
	grid-template-columns: 2rem minmax(0, 1fr) 1.2rem;
	padding: clamp(1.25rem, 5.3vw, 1.7rem) 0;
	gap: 0.8rem;
	align-items: center;
	list-style: none;
	cursor: pointer;
}

.msuie-main .msuie-story-flow .msuie-story-faq summary::-webkit-details-marker {
	display: none;
}

.msuie-main .msuie-story-flow .msuie-story-faq summary > span {
	color: var(--msuie-flow-blue-deep);
	font-size: 0.64rem;
	font-weight: 720;
}

.msuie-main .msuie-story-flow .msuie-story-faq summary strong {
	font-size: clamp(1rem, 4.3vw, 1.25rem);
	font-weight: 570;
	letter-spacing: -0.025em;
	line-height: 1.18;
}

.msuie-main .msuie-story-flow .msuie-story-faq summary i {
	position: relative;
	width: 1.15rem;
	height: 1.15rem;
}

.msuie-main .msuie-story-flow .msuie-story-faq summary i::before,
.msuie-main .msuie-story-flow .msuie-story-faq summary i::after {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 0.82rem;
	height: 1px;
	background: currentColor;
	content: "";
	transform: translate(-50%, -50%);
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.msuie-main .msuie-story-flow .msuie-story-faq summary i::after {
	transform: translate(-50%, -50%) rotate(90deg);
}

.msuie-main .msuie-story-flow .msuie-story-faq details[open] summary i::after {
	transform: translate(-50%, -50%) rotate(0deg);
}

.msuie-main .msuie-story-flow .msuie-story-faq details > div {
	display: grid;
	grid-template-rows: 0fr;
	opacity: 0;
	transition: grid-template-rows 520ms cubic-bezier(0.22, 1, 0.36, 1), opacity 360ms ease;
}

.msuie-main .msuie-story-flow .msuie-story-faq details[open] > div {
	grid-template-rows: 1fr;
	opacity: 1;
}

.msuie-main .msuie-story-flow .msuie-story-faq details > div > p {
	overflow: hidden;
	max-width: 30rem;
	padding: 0 0 1.5rem 2.8rem;
	margin: 0;
	color: var(--msuie-flow-muted);
	font-size: clamp(0.756rem, 3.24vw, 0.882rem);
	line-height: 1.58;
}

/*
 * Compact chapter rhythm from the audience ticker through FAQ. The same
 * responsive distance is reused at every section boundary so the layout reads
 * as one continuous page instead of a stack of viewport-sized panels.
 */
.msuie-main .msuie-story-flow {
	--msuie-chapter-gap: clamp(3.5rem, 14vw, 6rem);
	--msuie-section-break-gap: calc(var(--msuie-chapter-gap) + clamp(0.75rem, 3vw, 1rem));
	--msuie-row-edge-gap: clamp(1.35rem, 5.5vw, 1.8rem);
	--msuie-heading-content-gap: clamp(2.4rem, 10vw, 4.8rem);
}

.msuie-main .msuie-story-flow .msuie-audience {
	padding-bottom: 0;
}

.msuie-main .msuie-audience .msuie-word-river {
	margin-top: var(--msuie-chapter-gap);
}

.msuie-main .msuie-story-flow :is(.msuie-effects, .msuie-shop, .msuie-story-faq) {
	padding-top: var(--msuie-section-break-gap);
}

.msuie-main .msuie-story-flow :is(.msuie-effects, .msuie-shop) {
	padding-bottom: 0;
}

.msuie-main .msuie-story-flow .msuie-use + .msuie-shop {
	border-top: 0;
}

.msuie-main .msuie-story-flow > .msuie-shop:first-child {
	border-top: 0;
}

.msuie-main .msuie-story-flow .msuie-effects {
	gap: 0;
}

.msuie-main .msuie-story-flow :is(.msuie-claim-note, .msuie-use-note) {
	margin-top: var(--msuie-row-edge-gap);
}

.msuie-main .msuie-story-flow :is(.msuie-shop, .msuie-story-faq) {
	gap: 0;
}

.msuie-main .msuie-story-flow :is(.msuie-shop, .msuie-story-faq) > .msuie-story-heading {
	margin-bottom: var(--msuie-heading-content-gap);
}

.msuie-has-landing .my-themes-site-footer {
	position: relative;
	margin-top: 0;
	background: #ece6da;
}

.msuie-has-landing .my-themes-site-footer .my-themes-footer-brand img {
	opacity: 0;
	filter: brightness(0) blur(7px);
	transform: translate3d(0, 1.4rem, 0) scale(0.94);
	transition: opacity 800ms ease, filter 1000ms ease, transform 1000ms cubic-bezier(0.22, 1, 0.36, 1);
}

.msuie-has-landing .my-themes-site-footer.is-visible .my-themes-footer-brand img {
	opacity: 1;
	filter: brightness(0) blur(0);
	transform: translate3d(0, 0, 0) scale(1);
}

@keyframes msuie-story-pulse {
	0% { box-shadow: 0 0 0 0 rgba(46, 120, 183, 0.28); }
	70%, 100% { box-shadow: 0 0 0 0.7rem rgba(46, 120, 183, 0); }
}

@media (max-width: 22rem) {
	.msuie-main .msuie-story-flow .msuie-story-section,
	.msuie-main .msuie-story-flow .msuie-story-closing {
		padding-inline: 0.9rem;
	}

	.msuie-main .msuie-story-flow .msuie-story-heading h2,
	.msuie-main .msuie-story-flow .msuie-story-closing h2 {
		max-width: 100%;
		font-family: var(--msuie-title-font);
		font-size: clamp(26.4px, 7.92vw, 35.2px);
	}

	.msuie-main .msuie-story-flow .msuie-formula-cards {
		grid-template-columns: 1fr;
	}

	.msuie-main .msuie-story-flow .msuie-formula-cards article:last-child {
		grid-column: auto;
	}

}

@media (max-width: 39.99rem) {
	.msuie-main .msuie-story-flow :is(.msuie-claim-note, .msuie-use-note) {
		box-sizing: border-box;
		width: 100%;
		max-width: none;
		margin-inline: 0;
	}

	.msuie-main .msuie-story-flow .msuie-shop > .msuie-story-heading .msuie-story-label[data-msuie-split] {
		padding-left: calc(1rem + 2px);
	}
}

@media (min-width: 40rem) {
	.msuie-main .msuie-story-flow .msuie-formula-layout {
		grid-template-columns: minmax(0, 1fr) minmax(0, 0.92fr);
		align-items: stretch;
	}

	.msuie-main .msuie-story-flow .msuie-formula-product {
		min-height: 36rem;
	}
}

/* 1.7.36 heading rhythm and gel-label placement. The selectors stay inside
 * the landing composition so the fixed site header and commerce cards retain
 * their established geometry. */
.msuie-hero-content > .msuie-kicker,
.msuie-hero-content > h1,
.msuie-main .msuie-story-flow .msuie-story-heading > .msuie-story-label,
.msuie-main .msuie-story-flow .msuie-story-heading > h2 {
	position: relative;
	top: -10px;
}

.msuie-hero h1 {
	line-height: calc(0.9em + 5px);
}

.msuie-main .msuie-story-flow .msuie-story-heading h2,
.msuie-main .msuie-story-flow .msuie-story-closing h2 {
	line-height: calc(1.08em + 5px);
}

.msuie-hero-copy-line {
	display: block;
}

/* Keep 01 and 02 in their original animated nodes, but move them beyond the
 * gel-side marker. Relative transforms preserve the label row height, dot,
 * reveal progress, and right-aligned 02 layout. */
.msuie-main .msuie-gel-node--one > span,
.msuie-main .msuie-gel-node--two > span {
	width: max-content;
	white-space: nowrap;
}

.msuie-main .msuie-gel-node--one > span {
	justify-self: start;
	transform: translateX(calc(-100% - 1.4rem));
}

.msuie-main .msuie-gel-node--two > span {
	justify-self: end;
	transform: translateX(calc(100% + 1.4rem));
}