/**
 * Maiyo Donations — Premium frontend design
 */

:root {
	--maiyo-primary: #0c1e3d;
	--maiyo-primary-light: #163a6b;
	--maiyo-accent: #e8b923;
	--maiyo-accent-soft: rgba(232, 185, 35, 0.15);
	--maiyo-accent-glow: rgba(232, 185, 35, 0.45);
	--maiyo-surface: #ffffff;
	--maiyo-glass: rgba(255, 255, 255, 0.92);
	--maiyo-muted: #5c6b7a;
	--maiyo-text: #1a2332;
	--maiyo-bg: #f4f6f9;
	--maiyo-bg-dark: #0a1628;
	--maiyo-radius: 20px;
	--maiyo-radius-sm: 12px;
	--maiyo-shadow: 0 8px 32px rgba(12, 30, 61, 0.1);
	--maiyo-shadow-lg: 0 24px 64px rgba(12, 30, 61, 0.18);
	--maiyo-font: "DM Sans", system-ui, sans-serif;
	--maiyo-font-display: "Outfit", "DM Sans", sans-serif;
}

/* Scoped reset on plugin pages */
.maiyo-donations-page,
.woocommerce-checkout .maiyo-donation-checkout-fields {
	font-family: var(--maiyo-font);
	color: var(--maiyo-text);
}

.maiyo-donation-checkout-fields {
	margin: 1.5rem 0;
	padding: 1.25rem;
	border: 1px solid var(--maiyo-border, #e2e8f0);
	border-radius: 12px;
	background: var(--maiyo-surface, #fff);
}

.maiyo-donation-checkout-fields h3 {
	margin: 0 0 1rem;
	font-family: var(--maiyo-font-display);
	font-size: 1.125rem;
}

.maiyo-container {
	max-width: var(--maiyo-container-max, 1180px);
	margin: 0 auto;
	padding: 0 24px;
	width: 100%;
}

/* Full-bleed sections break out of theme content width */
.maiyo-full-bleed {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	position: relative;
	left: 0;
	right: 0;
}

.maiyo-donations-page.maiyo-width-full .maiyo-archive-body,
.maiyo-donations-page.maiyo-width-full .maiyo-single-body,
.maiyo-donations-page.maiyo-width-full .maiyo-minimal-donate-wrap {
	max-width: var(--maiyo-container-max, min(1600px, 96vw));
	margin-left: auto;
	margin-right: auto;
	padding-left: 24px;
	padding-right: 24px;
}

.maiyo-wc-notices {
	margin: 16px auto 0;
	padding-top: 8px;
}

.maiyo-wc-notices .woocommerce-message,
.maiyo-wc-notices .woocommerce-error,
.maiyo-wc-notices .woocommerce-info {
	border-radius: var(--maiyo-radius-sm);
	margin-bottom: 12px;
}

.maiyo-form-error {
	color: #b91c1c;
	background: #fef2f2;
	padding: 12px 16px;
	border-radius: var(--maiyo-radius-sm);
}

/* ——— Archive hero ——— */
.maiyo-archive-hero {
	position: relative;
	background: linear-gradient(135deg, var(--maiyo-bg-dark) 0%, var(--maiyo-primary) 50%, #1e4a7a 100%);
	color: #fff;
	padding: 88px 0 100px;
	overflow: hidden;
}

.maiyo-archive-hero__pattern {
	position: absolute;
	inset: 0;
	background-image: radial-gradient(circle at 20% 80%, var(--maiyo-accent-glow) 0%, transparent 40%),
		radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.08) 0%, transparent 35%);
	pointer-events: none;
}

.maiyo-archive-hero__inner {
	position: relative;
	text-align: center;
	max-width: 900px;
	margin: 0 auto;
	padding: 0 32px;
}

.maiyo-archive-hero h1 {
	font-family: var(--maiyo-font-display);
	font-size: clamp(2rem, 5vw, 3rem);
	font-weight: 800;
	margin: 16px 0 12px;
	letter-spacing: -0.02em;
}

.maiyo-archive-hero__lead {
	font-size: 1.125rem;
	opacity: 0.88;
	line-height: 1.65;
	margin-bottom: 28px;
}

.maiyo-archive-hero__badges {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
}

.maiyo-archive-hero__badges span {
	background: rgba(255, 255, 255, 0.12);
	backdrop-filter: blur(8px);
	padding: 8px 16px;
	border-radius: 99px;
	font-size: 0.8rem;
	font-weight: 600;
	border: 1px solid rgba(255, 255, 255, 0.2);
}

.maiyo-archive-body {
	margin-top: -48px;
	position: relative;
	z-index: 2;
	padding-bottom: 80px;
}

/* ——— Pills & badges ——— */
.maiyo-pill {
	display: inline-block;
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	padding: 6px 14px;
	border-radius: 99px;
	background: rgba(255, 255, 255, 0.15);
	margin-right: 8px;
	margin-bottom: 8px;
}

.maiyo-pill-gold {
	background: var(--maiyo-accent);
	color: var(--maiyo-primary);
}

.maiyo-pill-light {
	background: rgba(255, 255, 255, 0.2);
	color: #fff;
}

.maiyo-badge {
	position: absolute;
	top: 14px;
	right: 14px;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	background: var(--maiyo-primary);
	color: #fff;
	font-size: 0.65rem;
	font-weight: 800;
	padding: 6px 12px;
	border-radius: 8px;
	letter-spacing: 0.06em;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ——— Campaign list ——— */
.maiyo-campaigns-list {
	display: flex;
	flex-direction: column;
	gap: var(--maiyo-list-gap, 12px);
}

.maiyo-campaign-list-item {
	display: grid;
	grid-template-columns: 120px 1fr auto;
	gap: 16px;
	align-items: center;
	padding: 14px;
	border-radius: var(--maiyo-radius-sm);
	background: #fff;
	border: 1px solid rgba(12, 30, 61, 0.08);
	box-shadow: 0 4px 16px rgba(12, 30, 61, 0.05);
	transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.maiyo-campaign-list-item:hover {
	border-color: rgba(232, 185, 35, 0.35);
	box-shadow: 0 8px 24px rgba(12, 30, 61, 0.1);
}

.maiyo-campaign-list-item__thumb {
	display: block;
	border-radius: 8px;
	overflow: hidden;
}

.maiyo-campaign-list-item__thumb img {
	display: block;
	width: 120px;
	height: 90px;
	object-fit: cover;
}

.maiyo-campaign-list-item__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: 4px;
}

.maiyo-campaign-list-item__badge {
	font-size: 0.65rem;
	font-weight: 700;
	text-transform: uppercase;
	color: var(--maiyo-primary);
	background: var(--maiyo-accent-soft);
	padding: 2px 8px;
	border-radius: 99px;
}

.maiyo-campaign-list-item__cat {
	font-size: 0.7rem;
	color: var(--maiyo-muted);
}

.maiyo-campaign-list-item__title {
	margin: 0 0 6px;
	font-family: var(--maiyo-font-display);
	font-size: 1rem;
	font-weight: 700;
}

.maiyo-campaign-list-item__title a {
	color: var(--maiyo-primary);
	text-decoration: none;
}

.maiyo-campaign-list-item__excerpt {
	margin: 0 0 8px;
	font-size: 0.82rem;
	color: var(--maiyo-muted);
}

.maiyo-campaign-list-item__progress {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 6px;
}

.maiyo-campaign-list-item__progress .maiyo-progress {
	flex: 1;
	max-width: 200px;
}

.maiyo-campaign-list-item__stats {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	font-size: 0.78rem;
}

.maiyo-campaign-list-item__action {
	min-width: 130px;
}

.maiyo-elementor-campaign-content {
	padding: 24px 0 48px;
}

@media (max-width: 720px) {
	.maiyo-campaign-list-item {
		grid-template-columns: 1fr;
	}

	.maiyo-campaign-list-item__thumb img {
		width: 100%;
		height: 160px;
	}
}

/* ——— Campaign grid ——— */
.maiyo-campaigns-grid {
	display: grid;
	grid-template-columns: repeat(var(--maiyo-columns, 3), 1fr);
	gap: var(--maiyo-grid-gap, 28px);
}

@media (max-width: 1024px) {
	.maiyo-campaigns-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px) {
	.maiyo-campaigns-grid {
		grid-template-columns: 1fr;
	}
}

/* ——— Campaign card ——— */
.maiyo-campaign-card {
	background: var(--maiyo-surface);
	border-radius: var(--maiyo-radius);
	box-shadow: var(--maiyo-shadow);
	overflow: hidden;
	transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.35s ease;
	border: 1px solid rgba(12, 30, 61, 0.06);
}

.maiyo-campaign-card:hover {
	transform: translateY(-6px);
	box-shadow: var(--maiyo-shadow-lg);
}

.maiyo-campaign-card__image {
	display: block;
	position: relative;
	aspect-ratio: var(--maiyo-card-image-ratio, 16/10);
	overflow: hidden;
}

.maiyo-campaign-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.maiyo-campaign-card:hover .maiyo-campaign-card__image img {
	transform: scale(1.06);
}

.maiyo-campaign-card__image-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 50%, rgba(12, 30, 61, 0.4) 100%);
}

.maiyo-campaign-card__body {
	padding: 22px 22px 26px;
}

.maiyo-campaign-card__category {
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--maiyo-accent);
}

.maiyo-campaign-card__title {
	margin: 6px 0 10px;
	font-family: var(--maiyo-font-display);
	font-size: 1.2rem;
	font-weight: 700;
	line-height: 1.3;
}

.maiyo-campaign-card__title a {
	color: var(--maiyo-primary);
	text-decoration: none;
}

.maiyo-campaign-card__title a:hover {
	color: var(--maiyo-primary-light);
}

.maiyo-campaign-card__excerpt {
	color: var(--maiyo-muted);
	font-size: 0.875rem;
	line-height: 1.55;
	margin-bottom: 14px;
}

.maiyo-progress-wrap {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 16px;
}

.maiyo-progress {
	flex: 1;
	height: 10px;
	background: #e8ecf1;
	border-radius: 99px;
	overflow: hidden;
}

.maiyo-progress__bar {
	height: 100%;
	background: linear-gradient(90deg, var(--maiyo-primary), var(--maiyo-accent));
	border-radius: 99px;
	transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.maiyo-progress__label {
	font-size: 0.75rem;
	font-weight: 700;
	color: var(--maiyo-primary);
	white-space: nowrap;
}

.maiyo-campaign-card__stats {
	display: grid;
	grid-template-columns: repeat(var(--maiyo-stat-cols, 3), 1fr);
	gap: 8px;
	margin-bottom: 18px;
}

.maiyo-stat {
	text-align: center;
	padding: 10px 6px;
	background: var(--maiyo-bg);
	border-radius: var(--maiyo-radius-sm);
}

.maiyo-stat strong {
	display: block;
	font-size: 0.95rem;
	color: var(--maiyo-primary);
	font-weight: 700;
}

.maiyo-stat span {
	font-size: 0.65rem;
	color: var(--maiyo-muted);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

/* ——— Donation widget ——— */
.maiyo-donate-widget {
	background: var(--maiyo-glass);
	backdrop-filter: blur(16px);
	border-radius: var(--maiyo-radius);
	border: 1px solid rgba(255, 255, 255, 0.5);
	box-shadow: var(--maiyo-shadow-lg);
}

.maiyo-donate-widget--hero,
.maiyo-donate-widget--panel {
	padding: 28px;
}

.maiyo-donate-widget--compact {
	padding: 0;
	background: transparent;
	border: none;
	box-shadow: none;
	backdrop-filter: none;
	margin-top: 4px;
}

.maiyo-donate-widget__header {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	margin-bottom: 22px;
}

.maiyo-donate-widget__icon {
	width: 52px;
	height: 52px;
	border-radius: 14px;
	background: linear-gradient(135deg, var(--maiyo-primary), var(--maiyo-primary-light));
	color: var(--maiyo-accent);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.maiyo-donate-widget__title {
	font-family: var(--maiyo-font-display);
	font-size: 1.35rem;
	font-weight: 700;
	margin: 0 0 4px;
	color: var(--maiyo-primary);
}

.maiyo-donate-widget--hero .maiyo-donate-widget__title {
	color: #fff;
}

.maiyo-donate-widget--hero .maiyo-donate-widget__subtitle {
	color: rgba(255, 255, 255, 0.75);
}

.maiyo-donate-widget__subtitle {
	margin: 0;
	font-size: 0.875rem;
	color: var(--maiyo-muted);
}

/* ——— Amount chips ——— */
.maiyo-chip-fieldset {
	border: none;
	margin: 0 0 18px;
	padding: 0;
}

.maiyo-chip-legend {
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--maiyo-muted);
	margin-bottom: 12px;
}

.maiyo-donate-widget--hero .maiyo-chip-legend,
.maiyo-donate-widget--hero .maiyo-custom-label {
	color: rgba(255, 255, 255, 0.7);
}

.maiyo-chip-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
}

.maiyo-donation-form--compact .maiyo-chip-grid {
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
}

.maiyo-chip {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 14px 8px;
	min-height: 64px;
	border: 2px solid #e2e8f0;
	border-radius: var(--maiyo-radius-sm);
	background: #fff;
	cursor: pointer;
	transition: all 0.22s cubic-bezier(0.34, 1.2, 0.64, 1);
	font-family: var(--maiyo-font);
	position: relative;
	overflow: hidden;
	margin: 0;
}

.maiyo-chip .maiyo-amount-choice {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	margin: 0;
	padding: 0;
	pointer-events: none;
}

.maiyo-chip:has(.maiyo-amount-choice:checked) {
	border-color: var(--maiyo-accent);
	background: var(--maiyo-accent-soft);
	box-shadow: 0 0 0 3px var(--maiyo-accent-glow), 0 8px 24px rgba(232, 185, 35, 0.25);
	transform: translateY(-2px) scale(1.02);
}

.maiyo-donate-widget--hero .maiyo-chip:has(.maiyo-amount-choice:checked) {
	background: var(--maiyo-accent);
	border-color: var(--maiyo-accent);
	color: var(--maiyo-primary);
}

.maiyo-custom-input {
	-webkit-appearance: textfield;
	appearance: textfield;
}

.maiyo-custom-input:not([readonly]):not(:disabled) {
	cursor: text;
	pointer-events: auto;
}

.maiyo-donate-widget--hero .maiyo-chip {
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.2);
	color: #fff;
}

.maiyo-chip::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, var(--maiyo-accent-soft), transparent);
	opacity: 0;
	transition: opacity 0.2s;
	pointer-events: none;
}

.maiyo-chip:hover {
	border-color: var(--maiyo-accent);
	transform: translateY(-2px);
	box-shadow: 0 6px 20px var(--maiyo-accent-glow);
}

.maiyo-chip:hover::before {
	opacity: 1;
}

.maiyo-chip__currency {
	font-size: 0.7rem;
	font-weight: 600;
	opacity: 0.7;
	line-height: 1;
}

.maiyo-chip__value {
	font-family: var(--maiyo-font-display);
	font-size: 1.05rem;
	font-weight: 800;
	line-height: 1.2;
}

.maiyo-donation-form--compact .maiyo-chip {
	min-height: 52px;
	padding: 10px 6px;
}

.maiyo-donation-form--compact .maiyo-chip__value {
	font-size: 0.9rem;
}

/* ——— Custom amount ——— */
.maiyo-custom-wrap {
	margin-bottom: 18px;
}

.maiyo-custom-label {
	display: block;
	font-size: 0.75rem;
	font-weight: 600;
	margin-bottom: 8px;
	color: var(--maiyo-muted);
}

.maiyo-custom-input-group {
	display: flex;
	align-items: stretch;
	border: 2px solid #e2e8f0;
	border-radius: var(--maiyo-radius-sm);
	overflow: hidden;
	background: #fff;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.maiyo-donate-widget--hero .maiyo-custom-input-group {
	background: rgba(255, 255, 255, 0.1);
	border-color: rgba(255, 255, 255, 0.25);
}

.maiyo-custom-input-group:focus-within {
	border-color: var(--maiyo-accent);
	box-shadow: 0 0 0 4px var(--maiyo-accent-glow);
}

.maiyo-custom-prefix {
	display: flex;
	align-items: center;
	padding: 0 14px;
	font-size: 1.25rem;
	font-weight: 800;
	color: var(--maiyo-primary);
	background: var(--maiyo-bg);
}

.maiyo-donate-widget--hero .maiyo-custom-prefix {
	background: rgba(0, 0, 0, 0.15);
	color: var(--maiyo-accent);
}

.maiyo-custom-input {
	flex: 1;
	border: none;
	font-family: var(--maiyo-font-display);
	font-size: 1.5rem;
	font-weight: 700;
	padding: 14px 16px;
	color: var(--maiyo-primary);
	background: transparent;
	min-width: 0;
}

.maiyo-donate-widget--hero .maiyo-custom-input {
	color: #fff;
}

.maiyo-custom-input:focus {
	outline: none;
}

.maiyo-custom-hint {
	font-size: 0.75rem;
	color: var(--maiyo-muted);
	margin: 8px 0 0;
}

.maiyo-donate-widget--hero .maiyo-custom-hint {
	color: rgba(255, 255, 255, 0.55);
}

/* ——— Checkbox & trust ——— */
.maiyo-checkbox-row {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 0.875rem;
	margin-bottom: 16px;
	cursor: pointer;
}

.maiyo-trust-badge {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 0.8rem;
	color: var(--maiyo-primary-light);
	background: var(--maiyo-accent-soft);
	padding: 10px 14px;
	border-radius: var(--maiyo-radius-sm);
	margin-bottom: 18px;
}

.maiyo-donate-widget--hero .maiyo-trust-badge {
	background: rgba(232, 185, 35, 0.2);
	color: var(--maiyo-accent);
}

/* ——— Buttons ——— */
.maiyo-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 16px 28px;
	border-radius: var(--maiyo-radius-sm);
	font-family: var(--maiyo-font);
	font-weight: 700;
	font-size: 1rem;
	text-decoration: none;
	border: none;
	cursor: pointer;
	transition: all 0.25s ease;
	position: relative;
}

.maiyo-btn-donate {
	background: linear-gradient(135deg, var(--maiyo-accent) 0%, #f0c94a 100%);
	color: var(--maiyo-primary) !important;
	box-shadow: 0 6px 24px var(--maiyo-accent-glow);
}

.maiyo-btn-donate:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 32px var(--maiyo-accent-glow);
	filter: brightness(1.05);
}

.maiyo-btn-donate.is-loading {
	pointer-events: none;
	opacity: 0.85;
}

.maiyo-btn-donate.is-loading .maiyo-btn__loader {
	display: inline-block;
	width: 18px;
	height: 18px;
	border: 2px solid var(--maiyo-primary);
	border-top-color: transparent;
	border-radius: 50%;
	animation: maiyo-spin 0.7s linear infinite;
	margin-left: 8px;
}

.maiyo-btn__loader {
	display: none;
}

@keyframes maiyo-spin {
	to { transform: rotate(360deg); }
}

.maiyo-btn-block {
	width: 100%;
}

.maiyo-payment-icons {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px;
	margin: 14px 0 0;
	font-size: 0.7rem;
	color: var(--maiyo-muted);
}

.maiyo-donate-widget--hero .maiyo-payment-icons {
	color: rgba(255, 255, 255, 0.5);
}

.maiyo-payment-icons__tags {
	font-weight: 600;
}

/* ——— Single campaign hero ——— */
.maiyo-hero {
	position: relative;
	min-height: 520px;
	display: flex;
	align-items: stretch;
	overflow: hidden;
}

.maiyo-hero__bg {
	position: absolute;
	inset: 0;
	background-image: var(--maiyo-hero-image);
	background-size: cover;
	background-position: center;
	pointer-events: none;
}

.maiyo-hero__bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(105deg, rgba(10, 22, 40, 0.92) 0%, rgba(12, 30, 61, 0.85) 45%, rgba(22, 58, 107, 0.75) 100%);
	pointer-events: none;
}

.maiyo-hero__content {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 1fr 420px;
	gap: 48px;
	align-items: center;
	padding: 72px 32px 80px;
	width: 100%;
	max-width: var(--maiyo-container-max, min(1600px, 96vw));
	margin: 0 auto;
}

@media (max-width: 960px) {
	.maiyo-hero__content {
		grid-template-columns: 1fr;
		padding-bottom: 48px;
	}
}

.maiyo-hero__title {
	font-family: var(--maiyo-font-display);
	font-size: clamp(2rem, 4.5vw, 3.25rem);
	font-weight: 800;
	color: #fff;
	margin: 12px 0 16px;
	line-height: 1.15;
	letter-spacing: -0.02em;
}

.maiyo-hero__excerpt {
	font-size: 1.1rem;
	color: rgba(255, 255, 255, 0.85);
	line-height: 1.6;
	max-width: 540px;
	margin-bottom: 28px;
}

.maiyo-hero__metrics {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
	margin-bottom: 20px;
}

.maiyo-metric {
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(8px);
	padding: 16px;
	border-radius: var(--maiyo-radius-sm);
	border: 1px solid rgba(255, 255, 255, 0.12);
}

.maiyo-metric__value {
	display: block;
	font-family: var(--maiyo-font-display);
	font-size: 1.25rem;
	font-weight: 800;
	color: var(--maiyo-accent);
}

.maiyo-metric__label {
	font-size: 0.7rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: rgba(255, 255, 255, 0.65);
}

.maiyo-progress--hero {
	height: 12px;
	background: rgba(255, 255, 255, 0.15);
	margin-top: 8px;
}

.maiyo-hero__donate {
	position: relative;
	z-index: 3;
}

.maiyo-hero__donate .maiyo-donate-widget {
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.18);
	position: relative;
	z-index: 1;
	pointer-events: auto;
}

.maiyo-donate-widget,
.maiyo-donation-form {
	position: relative;
	z-index: 1;
	pointer-events: auto;
}

.maiyo-chip::before {
	pointer-events: none;
}

/* ——— Single body ——— */
.maiyo-single-body {
	padding: 48px 24px 80px;
}

.maiyo-single-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
	gap: 28px;
	align-items: start;
}

.maiyo-single-layout--narrow {
	grid-template-columns: 1fr;
}

.maiyo-single-layout__main {
	min-width: 0;
}

.maiyo-single-sidebar {
	display: flex;
	flex-direction: column;
	gap: 24px;
	position: sticky;
	top: 24px;
	overflow: visible;
	min-width: 0;
}

.maiyo-sidebar-panel {
	padding: 28px 24px;
}

.maiyo-sidebar-panel .maiyo-section-title {
	font-size: 1.2rem;
	margin-bottom: 12px;
}

/* ——— Sidebar funding visual ——— */
.maiyo-sidebar-funding__title {
	font-family: var(--maiyo-font-display);
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--maiyo-primary);
	margin: 0 0 8px;
}

.maiyo-sidebar-funding__intro {
	color: var(--maiyo-muted);
	font-size: 0.9rem;
	line-height: 1.5;
	margin: 0 0 20px;
}

.maiyo-sidebar-funding__graphic {
	display: flex;
	justify-content: center;
	margin-bottom: 22px;
}

.maiyo-funding-chart {
	position: relative;
	width: 168px;
	height: 168px;
}

.maiyo-funding-chart__svg {
	display: block;
	width: 100%;
	height: 100%;
}

.maiyo-funding-chart__track {
	opacity: 0.9;
}

.maiyo-funding-chart__ring-progress {
	transition: stroke-dasharray 0.6s ease;
}

.maiyo-funding-chart__center {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	pointer-events: none;
}

.maiyo-funding-chart__pct {
	font-family: var(--maiyo-font-display);
	font-size: 1.75rem;
	font-weight: 800;
	color: var(--maiyo-primary);
	line-height: 1.05;
	letter-spacing: -0.02em;
}

.maiyo-funding-chart__label {
	margin-top: 2px;
	font-size: 0.68rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--maiyo-muted);
}

.maiyo-sidebar-funding__legend {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.maiyo-sidebar-funding__row {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 8px 12px;
	align-items: baseline;
	padding: 12px 14px;
	border-radius: var(--maiyo-radius-sm);
	background: linear-gradient(135deg, var(--maiyo-bg) 0%, #fff 100%);
	border: 1px solid rgba(12, 30, 61, 0.08);
}

.maiyo-sidebar-funding__row dt {
	margin: 0;
	font-size: 0.78rem;
	font-weight: 600;
	color: var(--maiyo-muted);
	line-height: 1.35;
}

.maiyo-sidebar-funding__row dd {
	margin: 0;
	font-family: var(--maiyo-font-display);
	font-size: 1.05rem;
	font-weight: 800;
	color: var(--maiyo-primary);
	text-align: right;
}

.maiyo-sidebar-funding__row--raised dd {
	color: hsl(var(--hue-a, 210) 70% 38%);
}

.maiyo-sidebar-funding__row--remain dd {
	color: var(--maiyo-accent);
}

@media (max-width: 960px) {
	.maiyo-single-layout {
		grid-template-columns: 1fr;
	}

	.maiyo-single-sidebar {
		position: static;
		order: 2;
	}

	.maiyo-single-layout__main {
		order: 1;
	}
}

.maiyo-glass {
	background: var(--maiyo-surface);
	border-radius: var(--maiyo-radius);
	padding: 36px 40px;
	box-shadow: var(--maiyo-shadow);
	border: 1px solid rgba(12, 30, 61, 0.06);
}

.maiyo-section-title {
	font-family: var(--maiyo-font-display);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--maiyo-primary);
	margin: 0 0 20px;
}

.maiyo-prose {
	line-height: 1.75;
	color: var(--maiyo-text);
}

.maiyo-prose p {
	margin-bottom: 1em;
}

.maiyo-compliance-notice,
.maiyo-field-notice {
	background: #f0f7ff;
	border-left: 4px solid var(--maiyo-primary);
	padding: 12px 16px;
	margin: 16px 0;
	font-size: 0.9rem;
	border-radius: 0 var(--maiyo-radius-sm) var(--maiyo-radius-sm) 0;
}

/* Hero layout: centered */
.maiyo-hero-layout-centered .maiyo-hero__content {
	grid-template-columns: 1fr;
	text-align: center;
	max-width: 920px;
}

.maiyo-hero-layout-centered .maiyo-hero__excerpt {
	margin-left: auto;
	margin-right: auto;
}

.maiyo-hero-layout-centered .maiyo-hero__donate {
	max-width: 480px;
	margin: 0 auto;
}

/* Hero layout: minimal */
.maiyo-hero-layout-minimal .maiyo-hero {
	min-height: 300px;
}

.maiyo-hero-layout-minimal .maiyo-hero__content {
	grid-template-columns: 1fr;
}

.maiyo-minimal-donate-wrap {
	margin-top: -40px;
	position: relative;
	z-index: 3;
	padding-bottom: 32px;
}

/* Card style variants */
.maiyo-campaign-card.maiyo-cards-flat,
.maiyo-cards-flat .maiyo-campaign-card {
	box-shadow: none;
	border: 1px solid #e8ecf1;
}

.maiyo-campaign-card.maiyo-cards-bordered,
.maiyo-cards-bordered .maiyo-campaign-card {
	box-shadow: none;
	border: 2px solid rgba(12, 30, 61, 0.12);
}

.maiyo-campaign-card.maiyo-cards-bordered:hover,
.maiyo-cards-bordered .maiyo-campaign-card:hover {
	border-color: var(--maiyo-accent);
}

/* Blank shell (no theme header) */
body.maiyo-shell-blank {
	margin: 0;
	padding: 0;
}

/* ——— Social share ——— */
.maiyo-share {
	margin: 20px 0;
}

.maiyo-share--hero {
	margin: 16px 0 24px;
}

.maiyo-share__label {
	display: block;
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin-bottom: 10px;
	color: rgba(255, 255, 255, 0.75);
}

.maiyo-share--inline .maiyo-share__label {
	color: var(--maiyo-muted);
}

.maiyo-share__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.maiyo-share-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 16px;
	border-radius: 99px;
	font-size: 0.85rem;
	font-weight: 600;
	text-decoration: none;
	border: none;
	cursor: pointer;
	transition: transform 0.2s, box-shadow 0.2s;
	font-family: var(--maiyo-font);
	background: rgba(255, 255, 255, 0.12);
	color: #fff;
	backdrop-filter: blur(6px);
	border: 1px solid rgba(255, 255, 255, 0.2);
}

.maiyo-share--inline .maiyo-share-btn {
	background: var(--maiyo-bg);
	color: var(--maiyo-primary);
	border-color: #e2e8f0;
}

.maiyo-share-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
	color: inherit;
}

.maiyo-share-btn__icon {
	width: 18px;
	height: 18px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.maiyo-share-btn--whatsapp .maiyo-share-btn__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2325D366'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.435 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E"); }
.maiyo-share-btn--facebook .maiyo-share-btn__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231877F2'%3E%3Cpath d='M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z'/%3E%3C/svg%3E"); }
.maiyo-share-btn--twitter .maiyo-share-btn__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z'/%3E%3C/svg%3E"); }
.maiyo-share-btn--gmail .maiyo-share-btn__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23EA4335' d='M24 5.457v13.909c0 .904-.732 1.636-1.636 1.636h-3.819V11.73L12 16.64l-6.545-4.91v9.273H1.636A1.636 1.636 0 0 1 0 19.366V5.457c0-2.023 2.309-3.178 3.927-1.964L12 9.548l8.073-6.055C21.69 2.28 24 3.434 24 5.457z'/%3E%3C/svg%3E"); }
.maiyo-share-btn--instagram .maiyo-share-btn__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0%25' y1='100%25' x2='100%25' y2='0%25'%3E%3Cstop stop-color='%23FD5949'/%3E%3Cstop offset='.5' stop-color='%23D6249F'/%3E%3Cstop offset='1' stop-color='%23285AEB'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23g)' d='M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.052.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98C8.333 23.986 8.741 24 12 24c3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 100 12.324 6.162 6.162 0 000-12.324zM12 16a4 4 0 110-8 4 4 0 010 8zm6.406-11.845a1.44 1.44 0 100 2.881 1.44 1.44 0 000-2.881z'/%3E%3C/svg%3E"); }

.maiyo-share-btn.is-copied {
	background: var(--maiyo-accent-soft) !important;
	border-color: var(--maiyo-accent) !important;
}

/* ——— Donor wall (compact) ——— */
.maiyo-donor-wall {
	margin-top: 0;
}

.maiyo-donor-wall--sidebar {
	margin-top: 16px;
	padding: 14px 14px 12px;
	border: 1px solid rgba(12, 30, 61, 0.08);
	border-radius: var(--maiyo-radius-sm);
	background: #fff;
	box-shadow: 0 4px 20px rgba(12, 30, 61, 0.05);
}

.maiyo-donor-wall--inline {
	margin-top: 24px;
	padding: 20px;
	width: 100%;
	box-sizing: border-box;
}

.maiyo-donor-wall__head {
	margin: 0 0 10px;
}

.maiyo-donor-wall__head-row {
	display: flex;
	align-items: center;
	gap: 10px;
}

.maiyo-donor-wall__faces {
	display: flex;
	flex-shrink: 0;
	align-items: center;
}

.maiyo-donor-wall__face {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	margin-left: calc(var(--maiyo-face-i, 0) * -8px);
	border-radius: 50%;
	border: 2px solid #fff;
	font-size: 0.95rem;
	line-height: 1;
	box-shadow: 0 1px 4px rgba(12, 30, 61, 0.1);
	position: relative;
	z-index: calc(12 - var(--maiyo-face-i, 0));
}

.maiyo-donor-wall__face:first-child {
	margin-left: 0;
}

.maiyo-donor-wall__face--tone-0 { background: #e8f5e9; }
.maiyo-donor-wall__face--tone-1 { background: #fff8e1; }
.maiyo-donor-wall__face--tone-2 { background: #e3f2fd; }
.maiyo-donor-wall__face--tone-3 { background: #fce4ec; }
.maiyo-donor-wall__face--tone-4 { background: #f3e5f5; }
.maiyo-donor-wall__face--tone-5 { background: #e0f7fa; }
.maiyo-donor-wall__face--tone-6 { background: #fff3e0; }
.maiyo-donor-wall__face--tone-7 { background: #ede7f6; }

.maiyo-donor-wall__titles {
	min-width: 0;
	flex: 1;
}

.maiyo-donor-wall__title {
	margin: 0;
	font-family: var(--maiyo-font-display);
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--maiyo-primary);
	line-height: 1.3;
	display: flex;
	align-items: center;
	gap: 6px;
}

.maiyo-donor-wall__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.35rem;
	height: 1.35rem;
	padding: 0 5px;
	font-size: 0.7rem;
	font-weight: 700;
	color: var(--maiyo-primary);
	background: var(--maiyo-accent-soft);
	border-radius: 999px;
}

.maiyo-donor-wall__empty {
	margin: 0;
	padding: 10px 12px;
	font-size: 0.8rem;
	line-height: 1.45;
	color: var(--maiyo-muted);
	background: var(--maiyo-bg);
	border-radius: 8px;
	text-align: center;
}

.maiyo-donor-wall-fallback {
	margin-top: 24px;
	padding-bottom: 40px;
}

.maiyo-donor-wall__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
	max-height: min(52vh, 420px);
	overflow-y: auto;
	scrollbar-width: thin;
}

.maiyo-support-msg {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 10px 10px 9px;
	border-radius: 10px;
	background: var(--maiyo-bg);
	border: 1px solid rgba(12, 30, 61, 0.06);
}

.maiyo-support-msg__avatar {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	font-size: 1.05rem;
	line-height: 1;
	border: 1px solid rgba(255, 255, 255, 0.9);
	box-shadow: 0 2px 6px rgba(12, 30, 61, 0.08);
}

.maiyo-support-msg__avatar--tone-0 { background: linear-gradient(145deg, #e8f5e9, #c8e6c9); }
.maiyo-support-msg__avatar--tone-1 { background: linear-gradient(145deg, #fff8e1, #ffecb3); }
.maiyo-support-msg__avatar--tone-2 { background: linear-gradient(145deg, #e3f2fd, #bbdefb); }
.maiyo-support-msg__avatar--tone-3 { background: linear-gradient(145deg, #fce4ec, #f8bbd0); }
.maiyo-support-msg__avatar--tone-4 { background: linear-gradient(145deg, #f3e5f5, #e1bee7); }
.maiyo-support-msg__avatar--tone-5 { background: linear-gradient(145deg, #e0f7fa, #b2ebf2); }
.maiyo-support-msg__avatar--tone-6 { background: linear-gradient(145deg, #fff3e0, #ffe0b2); }
.maiyo-support-msg__avatar--tone-7 { background: linear-gradient(145deg, #ede7f6, #d1c4e9); }

.maiyo-support-msg__body {
	flex: 1;
	min-width: 0;
}

.maiyo-support-msg__top {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 4px 8px;
	margin-bottom: 3px;
}

.maiyo-support-msg__name {
	font-size: 0.78rem;
	font-weight: 600;
	color: var(--maiyo-primary);
}

.maiyo-support-msg__amount {
	font-size: 0.7rem;
	font-weight: 700;
	color: var(--maiyo-accent);
	white-space: nowrap;
}

.maiyo-support-msg__quote {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 0.82rem;
	line-height: 1.45;
	color: var(--maiyo-text);
	font-style: normal;
}

.maiyo-support-msg__date {
	display: block;
	margin-top: 4px;
	font-size: 0.68rem;
	color: var(--maiyo-muted);
}

/* ——— Campaign milestones (compact → expand on hover) ——— */
.maiyo-milestones {
	margin-top: 20px;
	padding: 16px 14px 14px;
}

.maiyo-milestones__header {
	margin-bottom: 12px;
}

.maiyo-milestones__title {
	margin: 0 0 4px;
	font-family: var(--maiyo-font-display);
	font-size: 1rem;
	font-weight: 700;
	color: var(--maiyo-primary);
	line-height: 1.3;
}

.maiyo-milestones__lead {
	margin: 0;
	font-size: 0.78rem;
	line-height: 1.45;
	color: var(--maiyo-muted);
}

.maiyo-milestones__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.maiyo-milestone {
	position: relative;
}

.maiyo-milestone__panel {
	position: relative;
	border-radius: 10px;
	border: 1px solid rgba(12, 30, 61, 0.07);
	background: #fff;
	outline: none;
	transition:
		border-color 0.2s ease,
		box-shadow 0.25s ease,
		background 0.2s ease;
}

.maiyo-milestone__panel:hover,
.maiyo-milestone__panel:focus-visible {
	border-color: rgba(232, 185, 35, 0.45);
	box-shadow: 0 10px 28px rgba(12, 30, 61, 0.12);
	background: #fff;
	z-index: 8;
}

.maiyo-milestone__summary {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 42px;
	padding: 8px 10px;
}

.maiyo-milestone__dot {
	flex-shrink: 0;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--maiyo-accent);
}

.maiyo-milestone__date {
	flex-shrink: 0;
	font-size: 0.68rem;
	font-weight: 600;
	color: var(--maiyo-muted);
	white-space: nowrap;
}

.maiyo-milestone__summary .maiyo-milestone__title {
	flex: 1;
	min-width: 0;
	margin: 0;
	font-family: var(--maiyo-font-display);
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--maiyo-primary);
	line-height: 1.35;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.maiyo-milestone__thumb {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	border-radius: 6px;
	object-fit: cover;
	border: 1px solid rgba(12, 30, 61, 0.08);
	transition: opacity 0.2s ease;
}

.maiyo-milestone__expanded {
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	padding: 0 12px;
	transition:
		max-height 0.35s ease,
		opacity 0.25s ease,
		padding 0.25s ease;
}

.maiyo-milestone__panel:hover .maiyo-milestone__expanded,
.maiyo-milestone__panel:focus-visible .maiyo-milestone__expanded,
.maiyo-milestone__panel:focus-within .maiyo-milestone__expanded {
	max-height: 520px;
	opacity: 1;
	padding: 0 12px 12px;
}

.maiyo-milestone__panel:hover .maiyo-milestone__thumb,
.maiyo-milestone__panel:focus-visible .maiyo-milestone__thumb,
.maiyo-milestone__panel:focus-within .maiyo-milestone__thumb {
	opacity: 0;
	width: 0;
	margin: 0;
	padding: 0;
	border: 0;
}

.maiyo-milestone__title--full {
	display: none;
	margin: 0 0 6px;
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--maiyo-primary);
	line-height: 1.3;
}

.maiyo-milestone__panel:hover .maiyo-milestone__title--full,
.maiyo-milestone__panel:focus-visible .maiyo-milestone__title--full,
.maiyo-milestone__panel:focus-within .maiyo-milestone__title--full {
	display: block;
}

.maiyo-milestone__panel:hover .maiyo-milestone__summary .maiyo-milestone__title,
.maiyo-milestone__panel:focus-visible .maiyo-milestone__summary .maiyo-milestone__title,
.maiyo-milestone__panel:focus-within .maiyo-milestone__summary .maiyo-milestone__title {
	opacity: 0;
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
}

.maiyo-milestone__text {
	margin: 0 0 10px;
	font-size: 0.82rem;
	line-height: 1.5;
	color: var(--maiyo-text);
}

.maiyo-milestone__figure {
	margin: 0;
	border-radius: 8px;
	overflow: hidden;
	border: 1px solid rgba(12, 30, 61, 0.08);
	aspect-ratio: 16 / 10;
	background: rgba(12, 30, 61, 0.04);
}

.maiyo-milestone__img {
	display: block;
	width: 100%;
	height: 100%;
	max-height: none;
	object-fit: cover;
	object-position: center;
}

/* ——— Milestones: horizontal timeline ——— */
.maiyo-milestones--timeline-h .maiyo-milestones__list {
	position: relative;
	flex-direction: row;
	flex-wrap: nowrap;
	gap: 12px;
	padding: 28px 4px 8px;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
}

.maiyo-milestones--timeline-h .maiyo-milestones__list::before {
	content: "";
	position: absolute;
	top: 14px;
	left: 8px;
	right: 8px;
	height: 2px;
	background: linear-gradient(90deg, var(--maiyo-accent) 0%, rgba(232, 185, 35, 0.25) 100%);
	border-radius: 2px;
	pointer-events: none;
}

.maiyo-milestones--timeline-h .maiyo-milestone {
	flex: 0 0 min(200px, 78vw);
	scroll-snap-align: start;
}

.maiyo-milestones--timeline-h .maiyo-milestone__panel {
	height: 100%;
}

.maiyo-milestones--timeline-h .maiyo-milestone__summary {
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	min-height: 88px;
	padding-top: 10px;
}

.maiyo-milestones--timeline-h .maiyo-milestone__dot {
	position: absolute;
	top: -22px;
	left: 50%;
	transform: translateX(-50%);
	width: 10px;
	height: 10px;
	border: 2px solid #fff;
	box-shadow: 0 0 0 1px rgba(232, 185, 35, 0.5);
}

.maiyo-milestones--timeline-h .maiyo-milestone__date {
	white-space: normal;
}

.maiyo-milestones--timeline-h .maiyo-milestone__summary .maiyo-milestone__title {
	white-space: normal;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.maiyo-milestones--timeline-h .maiyo-milestone__panel:hover .maiyo-milestone__expanded,
.maiyo-milestones--timeline-h .maiyo-milestone__panel:focus-visible .maiyo-milestone__expanded,
.maiyo-milestones--timeline-h .maiyo-milestone__panel:focus-within .maiyo-milestone__expanded {
	max-height: 680px;
}

.maiyo-milestones--timeline-h .maiyo-milestone__figure {
	aspect-ratio: 4 / 3;
}

/* ——— Milestones: vertical timeline ——— */
.maiyo-milestones--timeline-v .maiyo-milestones__list {
	position: relative;
	padding-left: 22px;
	gap: 10px;
}

.maiyo-milestones--timeline-v .maiyo-milestones__list::before {
	content: "";
	position: absolute;
	left: 5px;
	top: 12px;
	bottom: 12px;
	width: 2px;
	background: linear-gradient(180deg, var(--maiyo-accent) 0%, rgba(232, 185, 35, 0.2) 100%);
	border-radius: 2px;
}

.maiyo-milestones--timeline-v .maiyo-milestone {
	position: relative;
}

.maiyo-milestones--timeline-v .maiyo-milestone__dot {
	position: absolute;
	left: -21px;
	top: 16px;
	width: 10px;
	height: 10px;
	border: 2px solid #fff;
	box-shadow: 0 0 0 1px rgba(232, 185, 35, 0.45);
	z-index: 2;
}

.maiyo-milestones--timeline-v .maiyo-milestone__summary {
	padding-left: 4px;
}

.maiyo-milestones--timeline-v .maiyo-milestone__panel:hover .maiyo-milestone__expanded,
.maiyo-milestones--timeline-v .maiyo-milestone__panel:focus-visible .maiyo-milestone__expanded,
.maiyo-milestones--timeline-v .maiyo-milestone__panel:focus-within .maiyo-milestone__expanded {
	max-height: 600px;
}

@media (max-width: 640px) {
	.maiyo-milestones--timeline-h .maiyo-milestone {
		flex-basis: min(260px, 88vw);
	}
}

@media (prefers-reduced-motion: reduce) {
	.maiyo-milestone__panel,
	.maiyo-milestone__expanded,
	.maiyo-milestone__thumb {
		transition: none;
	}
}

/* Touch: first tap focuses panel (expand); no hover on pure touch devices */
@media (hover: none) {
	.maiyo-milestone__panel:focus-within .maiyo-milestone__expanded {
		max-height: 520px;
		opacity: 1;
		padding: 0 12px 12px;
	}
}