/*
 * LALA shared theme.
 * Most surfaces are solid ivory, white, blush, or deep rose. Gradients are
 * intentionally reserved for focal elements: the TOP hero, ribbons, the
 * language entrance hero, and Instagram's native brand icon.
 *
 * The earlier Japanese TOP trials remain archived in:
 * - top-theme-ja.css
 * - top-theme-ja-minimal-gradient.css
 */

:root {
	--theme-ink: #392832;
	--theme-muted: #75626c;
	--theme-rose: #76264b;
	--theme-rose-dark: #571733;
	--theme-pink: #b93470;
	--theme-blush: #fce8f0;
	--theme-blush-deep: #f7cadc;
	--theme-border: #e7b8cc;
	--theme-gold: #b88934;
	--theme-ivory: #fff9fb;
	--theme-white: #fff;
}

body {
	--bg: var(--theme-ivory);
	--fg: var(--theme-ink);
	--muted: var(--theme-muted);
	--border: rgba(118, 38, 75, .2);
	--panel: rgba(255, 255, 255, .94);
	--brand: var(--theme-pink);
	--brand2: var(--theme-gold);
	--maroon: var(--theme-blush);
	--maroon2: var(--theme-blush-deep);
	--navy: var(--theme-blush);
	background: var(--theme-ivory);
	color: var(--theme-ink);
	color-scheme: light;
}

#wrapper,
#zoom-content {
	background: var(--theme-ivory);
}

/* Shared header and footer */
#header {
	background: var(--theme-rose);
	box-shadow: 0 8px 24px rgba(75, 20, 46, .2);
}

#header .topbar {
	background: var(--theme-rose);
	border-bottom-color: rgba(255, 255, 255, .16);
}

#header .header-nav {
	background: #5f1d3d;
	border-bottom-color: rgba(255, 255, 255, .18);
}

#header .site-nav__link,
#header .topbar__link,
#header .social__text {
	color: #fff;
	text-shadow: none;
}

#header .site-nav__link:hover,
#header .site-nav__link--active {
	color: #f9ddea;
}

#header .social {
	border-color: rgba(255, 255, 255, .28);
	background: rgba(255, 255, 255, .1);
}

#header .topbar__links {
	border-left-color: rgba(255, 255, 255, .22);
}

#header .brand__sub,
#header .brand__note {
	color: var(--theme-blush-deep);
}

.nav-toggle {
	border-color: rgba(255, 255, 255, .3);
	background: rgba(255, 255, 255, .08);
}

.nav-toggle__bar {
	background: #fff;
}

.mobile-nav {
	background: var(--theme-rose);
	border-bottom-color: rgba(255, 255, 255, .18);
}

.mobile-nav .site-nav__link {
	color: #fff;
	border-color: rgba(255, 255, 255, .24);
	background: rgba(255, 255, 255, .08);
}

#footer.footer-bar {
	color: #fff;
	border-top-color: rgba(255, 255, 255, .2);
	background: var(--theme-rose-dark);
}

#footer .footer-nav__link {
	color: #fff;
	border-color: rgba(255, 255, 255, .24);
	background: rgba(255, 255, 255, .08);
	box-shadow: none;
}

#footer .footer-nav__link:hover {
	color: #fff;
	border-color: rgba(255, 255, 255, .5);
	background: rgba(255, 255, 255, .14);
}

#footer .brand__sub,
#footer .t-muted {
	color: var(--theme-blush-deep);
}

/* Shared light surfaces */
.section__head {
	color: #fff;
	border-color: var(--theme-rose);
	background: var(--theme-rose);
	box-shadow: 0 10px 24px rgba(118, 38, 75, .2);
	text-shadow: none;
}

.section__head::before,
.section__head::after {
	background: #d2a451;
	box-shadow: 0 0 0 4px rgba(255, 255, 255, .12);
}

.panel,
.cardish {
	color: var(--theme-ink);
	border-color: var(--theme-border);
	background: rgba(255, 255, 255, .94);
	box-shadow: 0 14px 34px rgba(118, 38, 75, .1);
}

.t-muted {
	color: var(--theme-muted);
}

.t-accent {
	color: var(--theme-rose);
}

.btn-outline-gold {
	color: #8f2857;
	border-color: var(--theme-pink);
	background: rgba(255, 255, 255, .9);
}

.btn-outline-gold:hover {
	color: #fff;
	background: var(--theme-pink);
}

/* Therapist cards shared by TOP, list, schedule, and ranking. */
.therapist-card {
	padding: .55rem;
	border: 1px solid var(--theme-border);
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 12px 28px rgba(118, 38, 75, .1);
}

.therapist__link {
	border-color: #efcbd9;
	background: var(--theme-blush);
}

.therapist__name {
	color: var(--theme-rose);
}

.therapist__meta {
	color: var(--theme-muted);
}

/* Contact buttons retain each platform's identity while using white faces. */
.cta__btn {
	background: rgba(255, 255, 255, .96);
	box-shadow: 0 8px 18px rgba(70, 31, 50, .12);
	text-shadow: none;
}

.cta__btn:hover {
	background: #fff;
	box-shadow: 0 10px 22px rgba(70, 31, 50, .16), 0 0 12px color-mix(in srgb, var(--cta) 28%, transparent);
}

.cta__btn--x {
	--cta: #242424;
}

.cta__btn--line,
.cta__btn--wechat,
.cta__btn--whatsapp {
	color: #08783d;
}

.cta__btn--telegram {
	color: #116c95;
}

.cta__btn--instagram {
	--cta: #c13584;
	color: #9c2468;
	border-color: #c13584;
	background: #fff;
}

.cta__btn--instagram .cta__platform-icon {
	background:
		radial-gradient(circle at 30% 105%, #fed373 0 24%, transparent 52%),
		linear-gradient(135deg, #4c68d7 0%, #8a3ab9 32%, #cd486b 62%, #fbad50 100%);
}

.cta__btn--tiktok {
	--cta: #242424;
	color: #242424;
	border-color: #242424;
	background: #fff;
}

/* TOP: solid section rhythm with a focused hero. */
#page-index .page-index {
	background: var(--theme-ivory);
}

#page-index .section--pickup {
	background: var(--theme-ivory);
}

#page-index .pickup {
	border-color: var(--theme-border);
	background:
		radial-gradient(circle at 50% 34%, rgba(185, 52, 112, .14), transparent 42%),
		linear-gradient(145deg, #fff 0%, #fff9fb 42%, #f7cadc 100%);
	box-shadow: 0 24px 56px rgba(118, 38, 75, .14);
}

#page-index .pickup .brand__logo {
	filter: drop-shadow(0 12px 20px rgba(118, 38, 75, .24));
}

#page-index .pickup__kicker--mint {
	color: var(--theme-pink);
}

#page-index .pickup__kicker--orange {
	color: #8b5d28;
}

#page-index .pickup__desc .t-strong {
	color: var(--theme-rose);
}

#page-index .ribbon,
#page-index .ribbon::before,
#page-index .ribbon::after {
	background: linear-gradient(180deg, #f9ddea 0%, #efb5ce 52%, #df8fb3 100%);
}

#page-index .ribbon {
	color: #5b1b39;
	border: 1px solid rgba(118, 38, 75, .2);
	box-shadow: 0 10px 24px rgba(118, 38, 75, .18);
}

#page-index .section--therapists,
#page-index .section--facility,
#page-index .section--notes {
	background: var(--theme-blush);
}

#page-index .section--price,
#page-index .section--info,
#page-index .section--about {
	background: #fff;
}

#page-index #features,
#page-index #access {
	background: var(--theme-ivory);
}

#page-index .therapist-btn {
	color: var(--theme-rose);
	background: rgba(255, 255, 255, .76);
	box-shadow: 0 6px 16px rgba(118, 38, 75, .12);
}

#page-index .therapist-progress {
	background: rgba(118, 38, 75, .14);
}

#page-index .therapist-progress__bar {
	background: var(--theme-pink);
}

#page-index .price-system__img {
	border: 1px solid var(--theme-border);
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 18px 42px rgba(118, 38, 75, .13);
}

#page-index .facility__img {
	border: 4px solid #fff;
	box-shadow: 0 12px 26px rgba(118, 38, 75, .14);
}

#page-index .feature {
	background: #fff;
}

#page-index .feature__img {
	border: 1px solid #efcbd9;
}

#page-index .feature .t-strong,
#page-index .story-card__title,
#page-index #access .t-strong {
	color: var(--theme-rose);
}

#page-index #access iframe {
	border: 1px solid var(--theme-border) !important;
	border-radius: 14px;
	box-shadow: 0 14px 30px rgba(118, 38, 75, .12);
}

/* TOP information and standalone information pages. */
#page-index .info-feature {
	color: var(--theme-ink);
	border-color: var(--theme-border);
	background: #fff;
	box-shadow: 0 20px 44px rgba(118, 38, 75, .12);
}

#page-index .info-feature::before,
#page-index .info-feature__rule {
	background: var(--theme-pink);
}

#page-index .info-feature__date {
	color: var(--theme-pink);
}

#page-index .info-feature__title {
	color: #4f2137;
	text-shadow: none;
}

#page-index .info-feature__summary {
	color: var(--theme-muted);
}

#page-index .info-feature__button {
	color: #9f2d61;
	border-color: rgba(185, 52, 112, .72);
	background: #fff;
}

#page-index .info-feature__button:hover {
	color: #fff;
	border-color: var(--theme-pink);
	background: var(--theme-pink);
}

#page-index .info-feature__media {
	border-color: var(--theme-border);
	background: #fff;
	box-shadow: 0 14px 30px rgba(118, 38, 75, .14);
}

#page-info .page-info,
#page-info-detail .page-info {
	background: var(--theme-blush);
}

#page-info .section--info-list,
#page-info-detail .section--info-detail {
	background: var(--theme-blush);
}

#page-info .info-list__item {
	color: var(--theme-ink);
	border-color: var(--theme-border);
	background: #fff;
	box-shadow: 0 8px 20px rgba(118, 38, 75, .08);
}

#page-info .info-list__item:hover {
	border-color: var(--theme-pink);
	background: #fff;
}

#page-info .info-list__date,
#page-info-detail .info-detail__kind {
	color: var(--theme-pink);
}

#page-info .info-list__title,
#page-info-detail .info-detail__title,
#page-info-detail .info-detail__body {
	color: var(--theme-ink);
}

#page-info .info-list__more {
	color: #9f2d61;
}

#page-info-detail .info-detail {
	color: var(--theme-ink);
	border-color: var(--theme-border);
	background: #fff;
	box-shadow: 0 14px 34px rgba(118, 38, 75, .1);
}

#page-info-detail .info-detail__date {
	color: var(--theme-muted);
}

#page-info-detail .info-detail__img {
	border-color: var(--theme-border);
	background: var(--theme-ivory);
}

#page-info-detail .info-detail__body a {
	color: #9f2d61;
}

/* Therapist list, schedule, ranking, and profile pages. */
#page-therapists .page-therapists,
#page-schedule .page-schedule,
#page-ranking .page-therapists,
#page-therapist .page-therapist {
	background: var(--theme-blush);
}

#page-therapists .therapist-card,
#page-schedule .therapist-card,
#page-ranking .therapist-card {
	position: relative;
	padding-right: calc(var(--bs-gutter-x) * .5);
	padding-left: calc(var(--bs-gutter-x) * .5);
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

#page-therapists .therapist-card::before,
#page-schedule .therapist-card::before,
#page-ranking .therapist-card::before {
	content: "";
	position: absolute;
	z-index: 0;
	inset: 0 calc(var(--bs-gutter-x) * .5);
	border: 1px solid var(--theme-border);
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 12px 28px rgba(118, 38, 75, .1);
}

#page-therapists .therapist-card > *,
#page-schedule .therapist-card > *,
#page-ranking .therapist-card > * {
	position: relative;
	z-index: 1;
}

#page-therapists .therapist__name,
#page-schedule .therapist__name,
#page-ranking .therapist__name,
#page-therapists .therapist__meta,
#page-schedule .therapist__meta,
#page-ranking .therapist__meta {
	padding-right: .55rem;
	padding-left: .55rem;
}

#page-therapists .therapist__meta,
#page-schedule .therapist__meta,
#page-ranking .therapist__meta {
	padding-bottom: .65rem;
}

#page-therapists .date-link,
#page-schedule .date-link {
	--neon: var(--theme-rose);
	color: var(--theme-rose);
	border-color: var(--theme-border);
	background: #fff;
	box-shadow: 0 8px 18px rgba(118, 38, 75, .1);
	text-shadow: none;
}

#page-therapists .date-link:hover,
#page-schedule .date-link:hover {
	border-color: var(--theme-pink);
	box-shadow: 0 10px 22px rgba(118, 38, 75, .14);
}

#page-therapists .date-link.is-active,
#page-schedule .date-link.is-active {
	--neon: #fff;
	color: #fff;
	border-color: var(--theme-pink);
	background: var(--theme-pink);
}

#page-therapist .therapist-gallery {
	border-color: var(--theme-border);
	background: #fff;
	box-shadow: 0 14px 34px rgba(118, 38, 75, .1);
}

#page-therapist .therapist-gallery__main,
#page-therapist .therapist-gallery__thumb {
	border-color: var(--theme-border);
	background: var(--theme-ivory);
}

#page-therapist .therapist-gallery__thumb.is-active {
	border-color: var(--theme-pink);
	box-shadow: 0 0 0 2px rgba(185, 52, 112, .18);
}

#page-therapist .therapist-pr {
	color: #5b3447;
}

#page-therapist .therapist-sns__link {
	color: var(--theme-rose);
	border-color: var(--theme-border);
	background: #fff;
}

#page-therapist .therapist-sns__link img {
	filter: none;
}

#page-therapist .therapist-schedule__row {
	border-color: var(--theme-border);
	background: var(--theme-ivory);
}

#page-therapist .therapist-schedule__date {
	color: var(--theme-pink);
}

#page-therapist .therapist-schedule__time {
	color: var(--theme-ink);
}

/* Shared language and age entrance. This full-screen panel is a focal hero. */
#page-entrance #wrapper {
	padding-top: 0 !important;
	background: var(--theme-ivory);
}

#page-entrance .entrance {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2rem 1rem;
	background:
		radial-gradient(circle at 50% 18%, rgba(255, 255, 255, .98), transparent 38%),
		linear-gradient(145deg, #fff9fb 0%, #fce8f0 64%, #f7cadc 100%);
}

#page-entrance .entrance-card {
	max-width: 720px;
	width: 100%;
	padding: 40px 48px;
	text-align: center;
	color: var(--theme-ink);
	border: 1px solid var(--theme-border);
	border-radius: 24px;
	background: rgba(255, 255, 255, .96);
	box-shadow: 0 24px 64px rgba(118, 38, 75, .16);
}

#page-entrance .entrance-logo {
	max-width: 350px;
	margin: 0 auto 20px;
	filter: drop-shadow(0 10px 16px rgba(118, 38, 75, .2));
}

#page-entrance .entrance-title {
	color: var(--theme-rose);
	font-family: "Montserrat", sans-serif;
	font-weight: 800;
	letter-spacing: .08em;
	margin-bottom: 12px;
}

#page-entrance .entrance-meta {
	color: var(--theme-muted);
	margin-bottom: 12px;
}

#page-entrance .entrance-age {
	display: grid;
	gap: 4px;
	color: var(--theme-pink);
	font-weight: 700;
	margin: 24px 0 20px;
}

#page-entrance .entrance-actions {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 12px;
}

#page-entrance .entrance-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 64px;
	padding: 12px 18px;
	color: var(--theme-rose);
	font-weight: 700;
	letter-spacing: .02em;
	text-align: center;
	text-transform: none;
	text-decoration: none;
	border: 2px solid var(--theme-pink);
	border-radius: 999px;
	background: #fff;
	box-shadow: 0 8px 18px rgba(118, 38, 75, .1);
}

#page-entrance .entrance-btn:hover {
	color: #fff;
	background: var(--theme-pink);
	box-shadow: 0 10px 22px rgba(118, 38, 75, .16);
}

/* Standalone error page. */
#page-error #wrapper {
	min-height: 100vh;
	display: grid;
	place-items: center;
	padding: 2rem 1rem;
	background: var(--theme-blush);
}

#page-error .error-card {
	width: min(100%, 620px);
	min-height: 0;
	padding: 2.5rem;
	text-align: center;
	border: 1px solid var(--theme-border);
	border-radius: 24px;
	background: #fff;
	box-shadow: 0 20px 52px rgba(118, 38, 75, .14);
}

#page-error .error-logo {
	width: min(280px, 80%);
	margin: 0 auto 1.5rem;
}

#page-error .error-status {
	color: var(--theme-pink);
	font-family: "Montserrat", sans-serif;
	font-size: clamp(2.5rem, 8vw, 5rem);
	font-weight: 900;
	line-height: 1;
}

#page-error .error-title {
	margin: 1rem 0 1.5rem;
	color: var(--theme-rose);
	font-size: 1.4rem;
	font-weight: 700;
}

@media (min-width: 768px) and (max-width: 991.98px) {
	#header .topbar__inner,
	#header .topbar__links {
		flex-wrap: nowrap !important;
	}

	#header .social__text {
		display: none;
	}

	#header .social {
		padding: .4rem;
	}
}

@media (max-width: 767.98px) {
	.page-entrance-root,
	.page-error-root {
		font-size: 16px;
	}

	#page-index .pickup {
		border-radius: 20px;
	}

	.section__head {
		box-shadow: 0 8px 18px rgba(118, 38, 75, .18);
	}

	#page-entrance .entrance {
		padding: 1rem;
	}

	#page-entrance .entrance-card {
		padding: 2rem 1.25rem;
	}

	#page-entrance .entrance-actions {
		grid-template-columns: 1fr 1fr;
	}

	#page-error .error-card {
		padding: 2rem 1.25rem;
	}
}

@media (max-width: 420px) {
	#page-entrance .entrance-actions {
		grid-template-columns: 1fr;
	}
}
