/**
 * parafit LP — 専用スタイル
 *
 * @package Mouton
 */

.site-main--parafit {
	max-width: none;
	padding: 0;

	--parafit-text: #2a2a2a;
	--parafit-text-muted: #5c5c5c;
	--parafit-accent: #8b7355;
	--parafit-border: rgba( 0, 0, 0, 0.08 );
	--parafit-card: #fff;
}

.parafit-page {
	color: var( --parafit-text );
}

.parafit-page__container {
	max-width: 920px;
	margin-inline: auto;
	padding-inline: clamp( 1.25rem, 4vw, 2rem );
}

.parafit-page__container--wide {
	max-width: 1100px;
}

.parafit-page__section {
	padding: clamp( 4rem, 10vw, 6rem ) 0;
}

.parafit-page__section--texture {
	background-color: #f0eeeb;
	background-image: var( --parafit-bg-texture );
	background-repeat: repeat;
	background-size: 420px auto;
	background-position: center top;
}

.parafit-page__heading {
	margin: 0 0 2rem;
	font-size: clamp( 1.6rem, 4vw, 2.2rem );
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: 0.06em;
}

.parafit-page__heading em {
	font-style: normal;
	color: var( --parafit-accent );
}

.parafit-page__heading--center {
	text-align: center;
}

.parafit-page__section-heading {
	margin: 0 0 3rem;
	font-family: "Noto Sans JP", sans-serif;
	font-size: clamp( 1.6rem, 4vw, 2rem );
	font-weight: 700;
	text-align: center;
	letter-spacing: 0.05em;
	position: relative;
}

.parafit-page__section-heading::after {
	content: "";
	display: block;
	width: 60px;
	height: 4px;
	background: #2c3e50;
	margin: 1.25rem auto 0;
}

.parafit-page__lead {
	margin: 0 0 1.5rem;
	font-size: clamp( 1rem, 2.2vw, 1.1rem );
	line-height: 1.9;
	color: var( --parafit-text-muted );
}

/* Hero */
.parafit-page__hero {
	position: relative;
	min-height: 100vh;
	min-height: 100svh;
	overflow: hidden;
	display: grid;
	place-items: center;
	color: #fff;
}

.parafit-page__hero-bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
	filter: brightness( 1.12 ) saturate( 1.05 );
}

.parafit-page__hero-overlay {
	position: absolute;
	inset: 0;
	background:
		linear-gradient( 90deg, rgba( 0, 0, 0, 0.32 ) 0%, rgba( 0, 0, 0, 0.1 ) 45%, rgba( 0, 0, 0, 0.04 ) 100% ),
		linear-gradient( 180deg, rgba( 0, 0, 0, 0.08 ) 0%, transparent 40%, rgba( 0, 0, 0, 0.14 ) 100% );
}

.parafit-page__hero-inner {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: var( --wide-max );
	margin-inline: auto;
	padding: clamp( 2rem, 6vh, 4rem ) clamp( 1.5rem, 5vw, 3rem );
	display: grid;
	grid-template-columns: auto minmax( 0, 1fr ) minmax( 0, 1fr );
	align-items: center;
	gap: clamp( 1.5rem, 4vw, 3rem );
	min-height: inherit;
}

.parafit-page__hero-catch {
	margin: 0;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	font-size: clamp( 1.35rem, 3.2vw, 2rem );
	font-weight: 500;
	letter-spacing: 0.28em;
	line-height: 1.9;
	color: #fff;
	text-shadow: 0 2px 24px rgba( 0, 0, 0, 0.45 );
	white-space: nowrap;
}

.parafit-page__hero-brand {
	justify-self: start;
	align-self: center;
	max-width: min( 100%, 40rem );
}

.parafit-page__hero-category {
	margin: 0 0 1.25rem;
	font-size: clamp( 1rem, 2.4vw, 1.35rem );
	font-weight: 500;
	letter-spacing: 0.35em;
	color: rgba( 255, 255, 255, 0.92 );
}

.parafit-page__hero-logo-wrap {
	margin: 0;
	line-height: 0;
}

.parafit-page__hero-logo {
	width: min( 100%, 30rem );
	height: auto;
	display: block;
	filter: brightness( 0 ) invert( 1 ) drop-shadow( 0 4px 24px rgba( 0, 0, 0, 0.35 ) );
}

.parafit-page__hero-product {
	margin: 0;
	justify-self: end;
	align-self: center;
	max-width: min( 100%, 22rem );
}

.parafit-page__hero-product-img {
	width: 100%;
	height: auto;
	max-height: min( 72vh, 28rem );
	display: block;
	object-fit: contain;
	filter: drop-shadow( 0 1.5rem 3rem rgba( 0, 0, 0, 0.45 ) );
}

/* Pain */
.parafit-page__pain {
	padding-top: clamp( 3rem, 8vw, 5rem );
}

.parafit-page__pain .parafit-page__container {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.parafit-page__pain-heading {
	margin: 0 0 clamp( 4rem, 9vw, 5.5rem );
	text-align: center;
}

.parafit-page__pain-heading-inner {
	display: inline-block;
	transform: rotate( -4deg );
	font-size: clamp( 1.75rem, 4.5vw, 2.6rem );
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.04em;
	background: linear-gradient( transparent 68%, #ffe566 68%, #ffe566 88%, transparent 88% );
	padding: 0 0.15em;
}

.parafit-page__pain-heading em {
	font-style: normal;
	color: #e53935;
}

.parafit-page__pain-bubbles {
	list-style: none;
	position: relative;
	margin: clamp( 2rem, 5vw, 3rem ) auto 0;
	padding: 0;
	width: min( 960px, 100% );
	min-height: clamp( 210px, 30vw, 275px );
}

.parafit-page__pain-bubble {
	--parafit-tilt: 0deg;
	position: absolute;
	width: max-content;
	max-width: min( 300px, 34vw );
	padding: 0.85rem 1.25rem;
	font-size: clamp( 1.05rem, 2.4vw, 1.22rem );
	line-height: 1.5;
	font-weight: 500;
	text-align: center;
	background: #fff;
	border-radius: 2.5rem 2.8rem 2.4rem 2.7rem / 2.8rem 2.4rem 2.7rem 2.5rem;
	box-shadow: 0 6px 24px rgba( 0, 0, 0, 0.08 );
	opacity: 0;
	will-change: opacity;
	transition: opacity 0.8s cubic-bezier( 0.16, 1, 0.3, 1 );
}

.parafit-page__pain-bubble-text {
	display: inline;
}

.parafit-page__pain-bubble:not( .is-visible ) {
	transform: translate3d( 0, 16px, 0 ) rotate( var( --parafit-tilt ) ) scale( 0.94 );
}

.parafit-page__pain-bubble.is-visible {
	opacity: 1;
	transform: translate3d( 0, 0, 0 ) rotate( var( --parafit-tilt ) );
	animation: parafit-bubble-float 5s ease-in-out 0.9s infinite;
	will-change: transform;
}

/* 2段の波型配置（左右対称グリッドではなく、横にずらして散らす） */
.parafit-page__pain-bubble:nth-child( 1 ) {
	--parafit-tilt: -1.5deg;
	top: 0;
	left: 0;
	max-width: 232px;
	border-radius: 2.6rem 3rem 2.5rem 2.8rem / 2.7rem 2.5rem 2.9rem 2.4rem;
}

.parafit-page__pain-bubble:not( .is-visible ):nth-child( 1 ) {
	transform: translate3d( -10px, 18px, 0 ) rotate( var( --parafit-tilt ) ) scale( 0.92 );
}

.parafit-page__pain-bubble:nth-child( 2 ) {
	--parafit-tilt: 1deg;
	top: 7rem;
	left: 7%;
	max-width: 282px;
	border-radius: 2.8rem 2.5rem 3rem 2.6rem / 2.5rem 2.9rem 2.4rem 2.7rem;
}

.parafit-page__pain-bubble:not( .is-visible ):nth-child( 2 ) {
	transform: translate3d( 8px, 20px, 0 ) rotate( var( --parafit-tilt ) ) scale( 0.9 );
}

.parafit-page__pain-bubble:nth-child( 3 ) {
	--parafit-tilt: -0.8deg;
	top: 0.35rem;
	left: 30%;
	max-width: 222px;
	border-radius: 2.4rem 2.9rem 2.6rem 2.7rem / 3rem 2.4rem 2.6rem 2.8rem;
}

.parafit-page__pain-bubble:not( .is-visible ):nth-child( 3 ) {
	transform: translate3d( -6px, 22px, 0 ) rotate( var( --parafit-tilt ) ) scale( 0.93 );
}

.parafit-page__pain-bubble:nth-child( 4 ) {
	--parafit-tilt: 1.2deg;
	top: 6.75rem;
	left: 41%;
	max-width: 240px;
	border-radius: 2.9rem 2.6rem 2.7rem 2.5rem / 2.4rem 2.8rem 2.5rem 3rem;
}

.parafit-page__pain-bubble:not( .is-visible ):nth-child( 4 ) {
	transform: translate3d( 10px, 18px, 0 ) rotate( var( --parafit-tilt ) ) scale( 0.91 );
}

.parafit-page__pain-bubble:nth-child( 5 ) {
	--parafit-tilt: 0.9deg;
	top: 0;
	left: 62%;
	max-width: 282px;
	border-radius: 2.7rem 2.5rem 2.9rem 2.4rem / 2.6rem 3rem 2.4rem 2.8rem;
}

.parafit-page__pain-bubble:not( .is-visible ):nth-child( 5 ) {
	transform: translate3d( -8px, 16px, 0 ) rotate( var( --parafit-tilt ) ) scale( 0.92 );
}

.parafit-page__pain-bubble:nth-child( 6 ) {
	--parafit-tilt: -1.1deg;
	top: 6.9rem;
	right: 0;
	max-width: 250px;
	border-radius: 2.5rem 2.8rem 2.4rem 3rem / 2.8rem 2.5rem 2.7rem 2.4rem;
}

.parafit-page__pain-bubble:not( .is-visible ):nth-child( 6 ) {
	transform: translate3d( 12px, 20px, 0 ) rotate( var( --parafit-tilt ) ) scale( 0.9 );
}

.parafit-page__pain-bubble:nth-child( 1 ).is-visible { animation-duration: 4.6s; animation-delay: 0.9s; }
.parafit-page__pain-bubble:nth-child( 2 ).is-visible { animation-duration: 5.4s; animation-delay: 0.9s; }
.parafit-page__pain-bubble:nth-child( 3 ).is-visible { animation-duration: 4.9s; animation-delay: 0.9s; }
.parafit-page__pain-bubble:nth-child( 4 ).is-visible { animation-duration: 5.8s; animation-delay: 0.9s; }
.parafit-page__pain-bubble:nth-child( 5 ).is-visible { animation-duration: 5.1s; animation-delay: 0.9s; }
.parafit-page__pain-bubble:nth-child( 6 ).is-visible { animation-duration: 5.6s; animation-delay: 0.9s; }

.parafit-page__pain-bubble em {
	font-style: normal;
	font-weight: 700;
}

.parafit-page__pain-bubble--pink em { color: #e85d7a; }
.parafit-page__pain-bubble--purple em { color: #8b5cf6; }
.parafit-page__pain-bubble--orange em { color: #f59e0b; }
.parafit-page__pain-bubble--blue em { color: #3b82f6; }
.parafit-page__pain-bubble--green em { color: #22c55e; }
.parafit-page__pain-bubble--olive em { color: #84a318; }

@keyframes parafit-bubble-float {
	0%,
	100% {
		transform: translate3d( 0, 0, 0 ) rotate( var( --parafit-tilt ) );
	}

	50% {
		transform: translate3d( 0, -5px, 0 ) rotate( var( --parafit-tilt ) );
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.parafit-page__pain-bubble {
		opacity: 1;
		transform: none;
		transition: none;
	}

	.parafit-page__pain-bubble.is-visible {
		animation: none;
	}
}

/* Solution */
.parafit-page__solution {
	position: relative;
	overflow-x: clip;
	overflow-y: visible;
	padding-top: clamp( 5rem, 12vw, 7rem );
	background: linear-gradient( 180deg, #e8f6fc 0%, #f0faff 40%, #f5fcff 100% );
}

.parafit-page__solution-arrow {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX( -50% );
	width: 0;
	height: 0;
	border-left: clamp( 2.5rem, 8vw, 4rem ) solid transparent;
	border-right: clamp( 2.5rem, 8vw, 4rem ) solid transparent;
	border-top: clamp( 1.75rem, 5vw, 2.5rem ) solid #f0eeeb;
	z-index: 2;
}

.parafit-page__solution-watermark {
	position: absolute;
	left: 0;
	top: 50%;
	margin: 0;
	padding: 0;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	transform: translateY( -50% );
	font-family: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
	font-size: clamp( 4.5rem, 11vw, 8.5rem );
	font-weight: 300;
	letter-spacing: 0.12em;
	line-height: 1;
	white-space: nowrap;
	color: rgba( 45, 143, 174, 0.1 );
	pointer-events: none;
	user-select: none;
	z-index: 0;
}

.parafit-page__solution-grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: minmax( 0, 1fr ) minmax( 0, 1fr );
	gap: clamp( 2rem, 5vw, 4rem );
	align-items: center;
}

.parafit-page__solution-copy {
	max-width: 26rem;
	font-family: "Noto Sans JP", sans-serif;
}

.parafit-page__solution-heading {
	margin: 0 0 1.25rem;
	font-family: "Noto Sans JP", sans-serif;
	font-size: clamp( 1.6rem, 4vw, 2.2rem );
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.04em;
}

.parafit-page__solution-heading-line {
	display: block;
	white-space: nowrap;
}

.parafit-page__solution-heading-line--em {
	color: #2d8fae;
}

.parafit-page__solution-logo {
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
}

.parafit-page__solution-lead {
	margin: 1.25rem 0 0;
	font-family: "Noto Sans JP", sans-serif;
	font-size: clamp( 0.95rem, 2.1vw, 1.05rem );
	font-weight: 400;
	line-height: 2;
	letter-spacing: 0.04em;
	color: #444;
}

.parafit-page__solution-cta {
	margin-top: 1.5rem;
	background: #2d8fae;
	font-family: "Noto Sans JP", sans-serif;
}

.parafit-page__solution-product {
	margin: 0;
	text-align: center;
}

.parafit-page__solution-product-img {
	width: min( 100%, 18rem );
	height: auto;
	filter: drop-shadow( 0 1rem 2rem rgba( 0, 0, 0, 0.12 ) );
}

/* Fade-in (scroll reveal) */
.parafit-page__fade-in {
	opacity: 0;
	transform: translateY( 30px );
	transition: opacity 0.8s ease, transform 0.8s ease;
}

.parafit-page__fade-in.is-visible {
	opacity: 1;
	transform: translateY( 0 );
}

/* Points — Hover Expand */
.parafit-page__points {
	background: #f9f9f9;
	padding: clamp( 4rem, 10vw, 5rem ) 0;
}


.parafit-page__points-expand {
	display: flex;
	height: 450px;
	gap: 15px;
}

.parafit-page__points-item {
	flex: 1;
	position: relative;
	border-radius: 16px;
	overflow: hidden;
	transition: flex 0.6s cubic-bezier( 0.25, 1, 0.5, 1 );
	cursor: pointer;
	color: #fff;
	display: flex;
	align-items: flex-end;
	padding: 40px 30px;
	box-shadow: 0 10px 30px rgba( 0, 0, 0, 0.1 );
	background-color: #34495e;
	background-image:
		linear-gradient( rgba( 44, 62, 80, 0.7 ), rgba( 44, 62, 80, 0.9 ) ),
		var( --parafit-point-bg, none );
	background-size: cover;
	background-position: center;
}

.parafit-page__points-item--blue:hover,
.parafit-page__points-item--blue.is-open {
	background-image:
		linear-gradient( rgba( 52, 152, 219, 0.8 ), rgba( 41, 128, 185, 0.9 ) ),
		var( --parafit-point-bg, none );
}

.parafit-page__points-item--green:hover,
.parafit-page__points-item--green.is-open {
	background-image:
		linear-gradient( rgba( 46, 204, 113, 0.8 ), rgba( 39, 174, 96, 0.9 ) ),
		var( --parafit-point-bg, none );
}

.parafit-page__points-item--purple:hover,
.parafit-page__points-item--purple.is-open {
	background-image:
		linear-gradient( rgba( 155, 89, 182, 0.8 ), rgba( 142, 68, 173, 0.9 ) ),
		var( --parafit-point-bg, none );
}

.parafit-page__points-item:hover,
.parafit-page__points-item.is-open {
	flex: 3;
}

.parafit-page__points-item::before {
	content: "0" attr( data-num );
	position: absolute;
	top: 25px;
	left: 25px;
	font-size: 2.25rem;
	font-weight: 900;
	opacity: 0.3;
	font-family: Arial, sans-serif;
	transition: opacity 0.4s ease;
}

.parafit-page__points-item:hover::before,
.parafit-page__points-item.is-open::before {
	opacity: 0.8;
}

.parafit-page__points-short-title {
	position: absolute;
	bottom: 40px;
	left: 30px;
	margin: 0;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 1.25rem;
	font-weight: 700;
	transition: opacity 0.3s ease;
	white-space: nowrap;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	letter-spacing: 0.1em;
}

.parafit-page__points-item:hover .parafit-page__points-short-title,
.parafit-page__points-item.is-open .parafit-page__points-short-title {
	opacity: 0;
}

.parafit-page__points-content {
	opacity: 0;
	transform: translateY( 20px );
	transition: opacity 0.4s ease 0.2s, transform 0.4s ease 0.2s;
	white-space: nowrap;
	overflow: hidden;
	width: 100%;
}

.parafit-page__points-item:hover .parafit-page__points-content,
.parafit-page__points-item.is-open .parafit-page__points-content {
	opacity: 1;
	transform: translateY( 0 );
	white-space: normal;
}

.parafit-page__points-content h3 {
	margin: 0 0 15px;
	font-family: "Noto Sans JP", sans-serif;
	font-size: clamp( 1.35rem, 2.5vw, 1.75rem );
	font-weight: 700;
	border-bottom: 2px solid rgba( 255, 255, 255, 0.3 );
	padding-bottom: 10px;
	display: inline-block;
}

.parafit-page__points-content p {
	margin: 0;
	font-family: "Noto Sans JP", sans-serif;
	font-size: clamp( 0.9rem, 1.8vw, 1rem );
	line-height: 1.8;
	opacity: 0.9;
}

/* Variants */
.parafit-page__variants {
	padding-top: clamp( 2.5rem, 5.5vw, 3.5rem );
	padding-bottom: clamp( 4rem, 10vw, 6rem );
	background: linear-gradient( 180deg, #f5f0e8 0%, #ede8df 100% );
}

.parafit-page__variants .parafit-page__section-heading {
	margin-bottom: clamp( 2.5rem, 5.5vw, 3.5rem );
}

.parafit-page__variants-grid {
	display: grid;
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	gap: 1.5rem;
}

.parafit-page__variant-card {
	background: var( --parafit-card );
	border: 1px solid var( --parafit-border );
	border-radius: 4px;
	overflow: hidden;
	box-shadow: 0 4px 20px rgba( 0, 0, 0, 0.04 );
}

.parafit-page__variant-media {
	margin: 1.25rem auto 0;
	text-align: center;
}

.parafit-page__variant-img {
	display: block;
	width: auto;
	max-width: min( 185px, 36vw );
	height: auto;
	max-height: min( 245px, 48vw );
	object-fit: contain;
	margin: 0 auto;
}

.parafit-page__variant-body {
	padding: 1.5rem;
}

.parafit-page__variant-name {
	margin: 0 0 0.25rem;
	font-size: 1.4rem;
	font-weight: 700;
}

.parafit-page__variant-label {
	margin: 0 0 0.75rem;
	font-size: 0.8rem;
	letter-spacing: 0.15em;
	color: var( --parafit-accent );
	text-transform: uppercase;
}

.parafit-page__variant-desc {
	margin: 0;
	font-size: 0.95rem;
	line-height: 1.8;
	color: var( --parafit-text-muted );
}

/* Testimonials */
.parafit-page__testimonials {
	background: #f3f3f3;
}

.parafit-page__testimonials-header {
	text-align: center;
	margin-bottom: 2.5rem;
}

.parafit-page__testimonials-label-ja {
	margin: 0 0 0.35rem;
	font-size: 0.95rem;
	font-weight: 700;
}

.parafit-page__testimonials-label-en {
	margin: 0;
	font-size: clamp( 2.5rem, 7vw, 4rem );
	font-weight: 800;
	line-height: 1;
}

.parafit-page__testimonials-grid {
	display: grid;
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	gap: 1.25rem;
}

.parafit-page__testimonial-card {
	background: #fff;
	border-radius: 6px;
	padding: 1.75rem;
	box-shadow: 0 4px 20px rgba( 0, 0, 0, 0.06 );
}

.parafit-page__testimonial-quote {
	margin: 0 0 1.25rem;
	font-size: 0.92rem;
	line-height: 1.9;
	color: #333;
}

.parafit-page__testimonial-name {
	display: block;
	font-style: normal;
	font-weight: 700;
	font-size: 0.85rem;
	color: #3d8fae;
}

.parafit-page__testimonial-role {
	display: block;
	font-size: 0.78rem;
	color: #666;
	margin-top: 0.15rem;
}

/* Ambassadors — Split-Motion Reveal */
.parafit-page__ambassadors {
	--parafit-amb-bg: #0f172a;
	--parafit-amb-text: #f8fafc;
	--parafit-amb-muted: #cbd5e1;
	--parafit-amb-accent: #38bdf8;
	--parafit-amb-card: #1e293b;
	padding-top: clamp( 2.5rem, 5.5vw, 3.5rem );
	padding-bottom: clamp( 4rem, 10vw, 6rem );
	background: var( --parafit-amb-bg );
	color: var( --parafit-amb-text );
}

.parafit-page__ambassadors .parafit-page__section-heading {
	margin-bottom: clamp( 2.5rem, 5.5vw, 3.5rem );
}

.parafit-page__ambassadors .parafit-page__section-heading::after {
	background: rgba( 255, 255, 255, 0.45 );
}

.parafit-page__ambassadors-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: clamp( 1.5rem, 4vw, 2.5rem );
}

.parafit-page__ambassador-reveal {
	position: relative;
	width: 100%;
	max-width: 450px;
	height: 650px;
	border-radius: 16px;
	overflow: hidden;
	background: var( --parafit-amb-bg );
	box-shadow: 0 20px 50px rgba( 0, 0, 0, 0.6 );
	cursor: pointer;
	transition: box-shadow 0.3s ease;
}

.parafit-page__ambassador-reveal:hover,
.parafit-page__ambassador-reveal.is-open,
.parafit-page__ambassador-reveal:focus-within {
	box-shadow: 0 30px 70px rgba( 0, 0, 0, 0.8 );
}

.parafit-page__ambassador-reveal-img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 20%;
	filter: grayscale( 100% ) contrast( 1.1 );
	transition:
		height 0.7s cubic-bezier( 0.33, 1, 0.68, 1 ),
		top 0.7s cubic-bezier( 0.33, 1, 0.68, 1 ),
		filter 0.8s ease;
	z-index: 1;
}

.parafit-page__ambassador-reveal-img--placeholder {
	background: linear-gradient( 160deg, #334155 0%, #1e293b 100% );
}

.parafit-page__ambassador-reveal:hover .parafit-page__ambassador-reveal-img,
.parafit-page__ambassador-reveal.is-open .parafit-page__ambassador-reveal-img,
.parafit-page__ambassador-reveal:focus-within .parafit-page__ambassador-reveal-img {
	height: 40%;
	filter: grayscale( 0% );
}

.parafit-page__ambassador-reveal-name {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 150px;
	background: linear-gradient( to top, rgba( 15, 23, 42, 1 ) 30%, rgba( 15, 23, 42, 0 ) );
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 30px;
	z-index: 2;
	transition: opacity 0.4s ease;
}

.parafit-page__ambassador-reveal:hover .parafit-page__ambassador-reveal-name,
.parafit-page__ambassador-reveal.is-open .parafit-page__ambassador-reveal-name,
.parafit-page__ambassador-reveal:focus-within .parafit-page__ambassador-reveal-name {
	opacity: 0;
}

.parafit-page__ambassador-reveal-name h3 {
	margin: 0 0 5px;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 2rem;
	font-weight: 700;
	letter-spacing: 0.05em;
}

.parafit-page__ambassador-reveal-name span {
	display: block;
	color: var( --parafit-amb-accent );
	font-size: 0.9rem;
	text-transform: uppercase;
	letter-spacing: 0.15em;
}

.parafit-page__ambassador-reveal-info {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 60%;
	background: var( --parafit-amb-card );
	transition: top 0.7s cubic-bezier( 0.33, 1, 0.68, 1 );
	display: flex;
	flex-direction: column;
	z-index: 0;
}

.parafit-page__ambassador-reveal:hover .parafit-page__ambassador-reveal-info,
.parafit-page__ambassador-reveal.is-open .parafit-page__ambassador-reveal-info,
.parafit-page__ambassador-reveal:focus-within .parafit-page__ambassador-reveal-info {
	top: 40%;
}

.parafit-page__ambassador-reveal-scroll {
	padding: 30px;
	overflow-y: auto;
	opacity: 0;
	transform: translateY( 20px );
	transition: opacity 0.5s ease 0.3s, transform 0.5s ease 0.3s;
	flex-grow: 1;
}

.parafit-page__ambassador-reveal:hover .parafit-page__ambassador-reveal-scroll,
.parafit-page__ambassador-reveal.is-open .parafit-page__ambassador-reveal-scroll,
.parafit-page__ambassador-reveal:focus-within .parafit-page__ambassador-reveal-scroll {
	opacity: 1;
	transform: translateY( 0 );
}

.parafit-page__ambassador-reveal-scroll::-webkit-scrollbar {
	width: 5px;
}

.parafit-page__ambassador-reveal-scroll::-webkit-scrollbar-track {
	background: rgba( 255, 255, 255, 0.03 );
}

.parafit-page__ambassador-reveal-scroll::-webkit-scrollbar-thumb {
	background: var( --parafit-amb-accent );
	border-radius: 3px;
}

.parafit-page__ambassador-reveal-info-header {
	margin-bottom: 25px;
	padding-bottom: 15px;
	border-bottom: 1px solid rgba( 255, 255, 255, 0.1 );
}

.parafit-page__ambassador-reveal-info-header h3 {
	margin: 0 0 3px;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 1.6rem;
	font-weight: 700;
}

.parafit-page__ambassador-reveal-info-header span {
	display: block;
	color: var( --parafit-amb-accent );
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.15em;
}

.parafit-page__ambassador-reveal-testimonial {
	margin-bottom: 30px;
}

.parafit-page__ambassador-reveal-testimonial p {
	margin: 0 0 15px;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 0.9rem;
	line-height: 1.8;
	color: var( --parafit-amb-text );
}

.parafit-page__ambassador-reveal-testimonial p:last-child {
	margin-bottom: 0;
}

.parafit-page__ambassador-reveal-profile h4 {
	margin: 0 0 10px;
	font-size: 0.8rem;
	font-weight: 700;
	color: rgba( 255, 255, 255, 0.6 );
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.parafit-page__ambassador-reveal-profile p {
	margin: 0 0 10px;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 0.8rem;
	line-height: 1.7;
	color: var( --parafit-amb-muted );
}

.parafit-page__ambassador-reveal-profile p:last-child {
	margin-bottom: 0;
}

/* Howto */
.parafit-page__howto {
	padding-top: clamp( 2.5rem, 5.5vw, 3.5rem );
	padding-bottom: clamp( 4rem, 10vw, 6rem );
}

.parafit-page__howto .parafit-page__section-heading {
	margin-bottom: clamp( 2.5rem, 5.5vw, 3.5rem );
}

.parafit-page__howto-steps {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	gap: 1.5rem;
}

.parafit-page__howto-step {
	display: flex;
	flex-direction: column;
	background: var( --parafit-card );
	border: 1px solid var( --parafit-border );
	border-radius: 4px;
	overflow: hidden;
	box-shadow: 0 4px 20px rgba( 0, 0, 0, 0.04 );
}

.parafit-page__howto-media {
	aspect-ratio: 16 / 10;
	background: rgba( 0, 0, 0, 0.03 );
	display: grid;
	place-items: center;
}

.parafit-page__howto-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.parafit-page__howto-num {
	font-size: 2.5rem;
	font-weight: 300;
	color: var( --parafit-accent );
	opacity: 0.4;
}

.parafit-page__howto-copy {
	padding: 1.25rem 1.5rem 1.5rem;
}

.parafit-page__howto-title {
	margin: 0 0 0.5rem;
	font-size: 1.05rem;
	font-weight: 700;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.parafit-page__howto-step-num {
	font-size: 0.8rem;
	color: var( --parafit-accent );
	letter-spacing: 0.1em;
}

.parafit-page__howto-body {
	margin: 0;
	font-size: 0.92rem;
	line-height: 1.8;
	color: var( --parafit-text-muted );
}

/* Purchase */
.parafit-page__purchase-grid {
	display: grid;
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	align-items: stretch;
	gap: clamp( 2rem, 5vw, 3rem );
}

.parafit-page__purchase-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	height: 100%;
}

.parafit-page__purchase-img {
	display: block;
	width: auto;
	max-width: min( 150px, 30vw );
	height: auto;
	max-height: min( 200px, 40vw );
	object-fit: contain;
	margin: 0 auto 1.25rem;
	flex-shrink: 0;
}

.parafit-page__purchase-body {
	display: flex;
	flex-direction: column;
	align-items: center;
	flex: 1;
	width: 100%;
	max-width: 22rem;
	gap: 0.5rem;
}

.parafit-page__purchase-name {
	margin: 0;
	font-size: 1.35rem;
	font-weight: 700;
}

.parafit-page__purchase-label {
	margin: 0;
	font-size: 0.8rem;
	letter-spacing: 0.12em;
	color: var( --parafit-accent );
	text-transform: uppercase;
}

.parafit-page__purchase-desc {
	margin: 0;
	font-size: 0.92rem;
	line-height: 1.8;
	color: var( --parafit-text-muted );
	flex: 1;
}

.parafit-page__purchase-price {
	margin: 0;
	font-size: 1.1rem;
	font-weight: 700;
}

.parafit-page__purchase-body .parafit-page__button {
	align-self: center;
	margin-top: auto;
	padding-top: 1rem;
}

.parafit-page__button {
	display: inline-block;
	margin-top: 0.75rem;
	padding: 0.85rem 1.75rem;
	font-weight: 700;
	font-size: 0.9rem;
	text-decoration: none;
	border-radius: 4px;
	text-align: center;
	transition: filter 0.15s ease;
	align-self: flex-start;
}

.parafit-page__button--primary {
	color: #fff;
	background: var( --parafit-accent );
}

.parafit-page__button:hover,
.parafit-page__button:focus-visible {
	filter: brightness( 1.08 );
	color: #fff;
}

/* Precautions */
.parafit-page__precautions {
	background: #ebe9e6;
}

.parafit-page__precautions-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}

.parafit-page__precautions-list li {
	position: relative;
	padding-left: 1rem;
	font-size: 0.82rem;
	line-height: 1.75;
	color: var( --parafit-text-muted );
}

.parafit-page__precautions-list li::before {
	content: "・";
	position: absolute;
	left: 0;
}

.parafit-page__precautions-storage {
	margin-top: 2.5rem;
	padding-top: 2rem;
	border-top: 1px solid var( --parafit-border );
}

.parafit-page__precautions-subheading {
	margin: 0 0 1rem;
	font-size: 1rem;
	font-weight: 700;
}

.parafit-page__editor {
	max-width: var( --wide-max );
	margin-inline: auto;
	padding: var( --space-section ) clamp( 1rem, 4vw, 2rem );
	border-top: 1px solid var( --parafit-border );
}

@media ( max-width: 900px ) {
	.parafit-page__solution-grid,
	.parafit-page__variants-grid,
	.parafit-page__purchase-grid,
	.parafit-page__howto-steps {
		grid-template-columns: 1fr;
	}

	.parafit-page__pain-bubbles {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-content: flex-start;
		column-gap: 0.75rem;
		row-gap: 0.65rem;
		min-height: auto;
		padding-bottom: 0.5rem;
	}

	.parafit-page__pain-bubble,
	.parafit-page__pain-bubble:nth-child( n ) {
		position: static;
		width: auto;
		max-width: min( 280px, 100% );
		flex: 0 1 auto;
	}

	.parafit-page__pain-bubble:nth-child( 2 ),
	.parafit-page__pain-bubble:nth-child( 4 ),
	.parafit-page__pain-bubble:nth-child( 6 ) {
		margin-top: 0.35rem;
	}

	.parafit-page__pain-bubble:nth-child( 3 ),
	.parafit-page__pain-bubble:nth-child( 5 ) {
		margin-left: 0.5rem;
	}

	.parafit-page__pain-bubble:not( .is-visible ),
	.parafit-page__pain-bubble:not( .is-visible ):nth-child( n ) {
		transform: translate3d( 0, 16px, 0 ) rotate( var( --parafit-tilt ) ) scale( 0.94 );
	}

	.parafit-page__pain-bubble.is-visible,
	.parafit-page__pain-bubble.is-visible:nth-child( n ) {
		transform: translate3d( 0, 0, 0 ) rotate( var( --parafit-tilt ) );
	}

	.parafit-page__testimonials-grid {
		grid-template-columns: 1fr;
	}

	.parafit-page__ambassador-reveal {
		height: 550px;
	}

	.parafit-page__ambassador-reveal-name h3 {
		font-size: 1.6rem;
	}

	.parafit-page__ambassador-reveal:hover .parafit-page__ambassador-reveal-img,
	.parafit-page__ambassador-reveal.is-open .parafit-page__ambassador-reveal-img,
	.parafit-page__ambassador-reveal:focus-within .parafit-page__ambassador-reveal-img {
		height: 35%;
	}

	.parafit-page__ambassador-reveal:hover .parafit-page__ambassador-reveal-info,
	.parafit-page__ambassador-reveal.is-open .parafit-page__ambassador-reveal-info,
	.parafit-page__ambassador-reveal:focus-within .parafit-page__ambassador-reveal-info {
		top: 35%;
		height: 65%;
	}

	.parafit-page__points-expand {
		flex-direction: column;
		height: auto;
		min-height: 700px;
	}

	.parafit-page__points-item,
	.parafit-page__points-item:hover,
	.parafit-page__points-item.is-open {
		flex: 1 !important;
		min-height: 200px;
		padding: 30px 20px;
		align-items: center;
	}

	.parafit-page__points-short-title {
		display: none;
	}

	.parafit-page__points-item::before {
		top: 15px;
		left: 15px;
		font-size: 1.5rem;
		opacity: 0.5;
	}

	.parafit-page__points-content,
	.parafit-page__points-item:hover .parafit-page__points-content,
	.parafit-page__points-item.is-open .parafit-page__points-content {
		opacity: 1;
		transform: translateY( 0 );
		white-space: normal;
		text-align: center;
	}

	.parafit-page__points-content h3 {
		font-size: 1.35rem;
		margin-bottom: 10px;
	}

	.parafit-page__points-content p {
		font-size: 0.9rem;
	}
}

@media ( max-width: 768px ) {
	.parafit-page__hero-inner {
		grid-template-columns: 1fr;
		grid-template-rows: auto auto auto;
		justify-items: center;
		text-align: center;
		padding-top: clamp( 3rem, 12vh, 5rem );
	}

	.parafit-page__hero-catch {
		writing-mode: horizontal-tb;
		white-space: normal;
		letter-spacing: 0.12em;
		font-size: clamp( 1.1rem, 4.5vw, 1.35rem );
		order: 3;
		align-self: end;
		padding-bottom: 1rem;
	}

	.parafit-page__hero-brand {
		justify-self: center;
		order: 1;
	}

	.parafit-page__hero-product {
		order: 2;
		justify-self: center;
		max-width: min( 70vw, 14rem );
	}

	.parafit-page__hero-logo {
		width: min( 100%, 20rem );
		margin-inline: auto;
	}

	.parafit-page__hero-category {
		font-size: clamp( 0.95rem, 4vw, 1.15rem );
	}

	.parafit-page__solution-watermark {
		font-size: clamp( 3rem, 14vw, 5rem );
	}

	.parafit-page__solution-copy {
		max-width: none;
		text-align: center;
	}

	.parafit-page__solution-logo,
	.parafit-page__solution-cta {
		margin-inline: auto;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.parafit-page__fade-in {
		opacity: 1;
		transform: none;
		transition: none;
	}
}