/* PIXEL HIVE — site preloader overlay（ヘッダー先頭で読み込み） */

.ph-preloader,
.ph-preloader *,
.ph-preloader *::before,
.ph-preloader *::after {
	box-sizing: border-box;
}

.ph-preloader {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: grid;
	place-items: center;
	padding: clamp(24px, 6vw, 48px);
	overflow: hidden;
	transition: opacity 0.65s ease, visibility 0.65s ease;
	font-family:
		"Hiragino Sans",
		"Hiragino Kaku Gothic ProN",
		"Noto Sans JP",
		-apple-system,
		BlinkMacSystemFont,
		sans-serif;
	/* カスタマイザーの背景／色へ接続（template-parts/preloader.php で付与） */
	--hive-gold-soft: #fff4d6;
	--hive-gold: #f5c842;
	--hive-gold-rich: #e0aa16;
	--hive-gold-deep: #c99812;
	--preloader-ink: #333333;
	--preloader-loading: rgba(51, 51, 51, 0.5);
}

.ph-preloader.is-done {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.ph-preloader__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	background-color: var(--ph-preloader-fallback-bg, #dfeef8);
	background-image: var(--ph-preloader-bg);
	background-repeat: no-repeat;
	background-position: center 38%;
	background-size: cover;
	transform: scale(1.025);
	filter: saturate(1.03);
	animation: ph-preloader-bg-drift 96s ease-in-out infinite alternate;
}

@keyframes ph-preloader-bg-drift {
	0% {
		transform: scale(1.025) translate(0, 0);
	}
	100% {
		transform: scale(1.04) translate(-0.35%, 0.2%);
	}
}

.ph-preloader__wash {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background:
		radial-gradient(
			ellipse 120% 90% at 18% 8%,
			rgba(255, 255, 255, 0.88) 0%,
			rgba(255, 255, 255, 0.35) 38%,
			transparent 62%
		),
		radial-gradient(circle at 88% 12%, rgba(255, 255, 255, 0.32) 0%, transparent 45%),
		linear-gradient(
			180deg,
			rgba(255, 255, 255, 0.74) 0%,
			rgba(255, 255, 255, 0.48) 36%,
			rgba(255, 255, 255, 0.42) 70%,
			rgba(252, 254, 255, 0.58) 100%
		);
}

.ph-preloader__panel {
	position: relative;
	z-index: 3;
	max-width: min(94vw, 720px);
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.ph-preloader__brand {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: clamp(14px, 3vw, 28px);
	margin-bottom: clamp(18px, 3.6vw, 30px);
	width: 100%;
	max-width: min(92vw, 560px);
	margin-left: auto;
	margin-right: auto;
}

.ph-preloader__symbol-wrap {
	display: grid;
	place-items: center;
	width: min(36vw, 132px);
	max-width: 100%;
}

.ph-preloader__symbol {
	display: block;
	width: 100%;
	height: auto;
	max-height: min(24vh, 132px);
	object-fit: contain;
	object-position: center;
	user-select: none;
	-webkit-user-drag: none;
}

.ph-preloader__wordmark-wrap {
	display: grid;
	place-items: center;
	width: min(88vw, 420px);
	max-width: 100%;
}

.ph-preloader__wordmark {
	display: block;
	width: 100%;
	height: auto;
	max-height: min(14vh, 72px);
	object-fit: contain;
	object-position: center;
	user-select: none;
	-webkit-user-drag: none;
}

.ph-preloader__dots {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	gap: clamp(10px, 2.8vw, 16px);
	margin-bottom: 12px;
	min-height: 22px;
	margin-top: clamp(4px, 1.2vw, 10px);
}

.ph-preloader__dots span {
	width: clamp(12px, 3.2vw, 18px);
	height: clamp(12px, 3.2vw, 18px);
	border-radius: 50%;
	background: radial-gradient(
		circle at 38% 32%,
		var(--hive-gold-soft),
		var(--hive-gold) 46%,
		var(--hive-gold-rich) 82%,
		var(--hive-gold-deep) 100%
	);
	box-shadow:
		0 2px 14px rgba(229, 176, 35, 0.28),
		0 1px 6px rgba(212, 160, 30, 0.18),
		inset 0 2px 0 rgba(255, 255, 255, 0.55);
	animation: ph-preloader-dot 2.6s cubic-bezier(0.42, 0.04, 0.4, 0.96) infinite both;
}

.ph-preloader__dots span:nth-child(2) {
	animation-delay: 0.32s;
}

.ph-preloader__dots span:nth-child(3) {
	animation-delay: 0.64s;
}

@keyframes ph-preloader-dot {
	0%,
	84%,
	100% {
		transform: translateY(4px) scale(0.9);
		opacity: 0.48;
	}
	44% {
		transform: translateY(-8px) scale(1.04);
		opacity: 1;
	}
}

.ph-preloader__loading {
	margin: 0;
	font-size: clamp(14px, 3.8vw, 17px);
	font-weight: 700;
	font-style: italic;
	color: var(--preloader-loading);
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.ph-preloader__loading--plain {
	text-transform: none;
	font-style: normal;
	letter-spacing: 0.08em;
	animation: ph-preloader-plain-pulse 2.2s ease-in-out infinite;
}

@keyframes ph-preloader-plain-pulse {
	0%,
	100% {
		opacity: 0.72;
	}
	50% {
		opacity: 1;
		color: var(--hive-gold-rich);
	}
}

.ph-preloader__loading span {
	display: inline-block;
	animation: ph-preloader-letter 4.4s ease-in-out infinite;
}

.ph-preloader__loading span:nth-child(1) {
	animation-delay: 0s;
}
.ph-preloader__loading span:nth-child(2) {
	animation-delay: 0.22s;
}
.ph-preloader__loading span:nth-child(3) {
	animation-delay: 0.44s;
}
.ph-preloader__loading span:nth-child(4) {
	animation-delay: 0.66s;
}
.ph-preloader__loading span:nth-child(5) {
	animation-delay: 0.88s;
}
.ph-preloader__loading span:nth-child(6) {
	animation-delay: 1.1s;
}
.ph-preloader__loading span:nth-child(7) {
	animation-delay: 1.32s;
}
.ph-preloader__loading span:nth-child(8) {
	animation-delay: 1.54s;
}
.ph-preloader__loading span:nth-child(9) {
	animation-delay: 1.76s;
}
.ph-preloader__loading span:nth-child(10) {
	animation-delay: 1.98s;
}

@keyframes ph-preloader-letter {
	0%,
	100% {
		transform: translateY(2px);
		opacity: 0.58;
	}
	40% {
		transform: translateY(-4px);
		opacity: 1;
		color: var(--hive-gold-rich);
	}
}

@media (prefers-reduced-motion: reduce) {
	.ph-preloader {
		transition: opacity 0.35s ease, visibility 0.35s ease;
	}

	.ph-preloader__bg,
	.ph-preloader__dots span,
	.ph-preloader__loading span,
	.ph-preloader__loading--plain {
		animation: none !important;
	}

	.ph-preloader__dots span {
		opacity: 0.92;
		transform: translateY(0);
	}
}

@media (max-width: 720px) {
	.ph-preloader__panel {
		max-width: none;
		transform: scale(0.5);
		transform-origin: center center;
	}

	.ph-preloader:has(.ph-preloader__symbol) .ph-preloader__panel {
		transform: scale(0.72);
	}
}
