/* K.A.T 2026 — "bright medical gold" system. Custom classes ported 1:1 from the
   Next.js app globals.css kat-* block; the layout/typography around them is handled
   by Tailwind utilities in the section renderers. Old skin replaced by this. */

.kat-page {
	background-color: #FBFAF4;
	background-image:
		radial-gradient(ellipse 42% 28% at 18% 8%, rgba(255, 245, 199, 0.95), transparent 68%),
		radial-gradient(ellipse 42% 34% at 84% 14%, rgba(215, 237, 245, 0.9), transparent 66%),
		linear-gradient(rgba(32, 41, 64, 0.035) 1px, transparent 1px),
		linear-gradient(90deg, rgba(32, 41, 64, 0.035) 1px, transparent 1px);
	background-size: 100% 100%, 100% 100%, 52px 52px, 52px 52px;
}

.kat-hero {
	background-color: #FBFAF4;
	background-image:
		radial-gradient(ellipse 55% 40% at 18% 18%, rgba(255, 248, 222, 0.98), transparent 72%),
		radial-gradient(ellipse 46% 36% at 82% 22%, rgba(214, 238, 246, 0.86), transparent 72%),
		radial-gradient(ellipse 70% 45% at 50% 100%, rgba(232, 202, 117, 0.24), transparent 72%),
		linear-gradient(rgba(32, 41, 64, 0.035) 1px, transparent 1px),
		linear-gradient(90deg, rgba(32, 41, 64, 0.035) 1px, transparent 1px),
		linear-gradient(145deg, #FFFFFF 0%, #FBFAF4 50%, #FFF2C9 100%);
	background-size: 100% 100%, 100% 100%, 100% 100%, 54px 54px, 54px 54px, 100% 100%;
}

.kat-hero::before,
.kat-section::before,
.kat-white-band::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		linear-gradient(115deg, transparent 0 34%, rgba(197, 161, 90, 0.12) 34.2%, transparent 34.7% 100%),
		linear-gradient(128deg, transparent 0 58%, rgba(255, 255, 255, 0.75) 58.2%, transparent 58.7% 100%);
	opacity: 0.62;
}

.kat-section {
	background:
		radial-gradient(ellipse 38% 26% at 10% 10%, rgba(255, 247, 215, 0.95), transparent 70%),
		radial-gradient(ellipse 32% 26% at 86% 0%, rgba(219, 241, 248, 0.78), transparent 70%),
		linear-gradient(180deg, #FBFAF4 0%, #FFFFFF 100%);
}

.kat-white-band {
	background:
		radial-gradient(ellipse 46% 30% at 50% 0%, rgba(255, 239, 181, 0.56), transparent 72%),
		linear-gradient(180deg, #FFFFFF 0%, #FBFAF4 100%);
}

.kat-card {
	border: 1px solid rgba(255, 255, 255, 0.9);
	border-radius: 1.35rem;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.84), rgba(255, 255, 255, 0.58)),
		radial-gradient(ellipse 72% 46% at 78% 0%, rgba(255, 236, 166, 0.34), transparent 70%);
	box-shadow: 0 22px 70px rgba(139, 103, 27, 0.12);
	backdrop-filter: blur(18px) saturate(145%);
	-webkit-backdrop-filter: blur(18px) saturate(145%);
}

.kat-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	border: 1px solid rgba(212, 172, 98, 0.44);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.7);
	padding: 0.55rem 0.85rem;
	box-shadow: 0 12px 30px rgba(139, 103, 27, 0.09);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
}

.kat-cta {
	background: linear-gradient(135deg, #FFE69A 0%, #E5BF58 46%, #C5A15A 100%);
	box-shadow: 0 0 34px rgba(229, 191, 88, 0.42), 0 16px 34px rgba(139, 103, 27, 0.18);
	transition: transform 0.2s ease, box-shadow 0.3s ease;
}

.kat-cta:hover {
	transform: translateY(-1px);
	box-shadow: 0 0 50px rgba(229, 191, 88, 0.58), 0 16px 34px rgba(139, 103, 27, 0.18);
}

.kat-gold-text {
	color: #202940;
	text-shadow:
		0 0 18px rgba(255, 230, 154, 0.64),
		0 0 54px rgba(197, 161, 90, 0.34);
}

.kat-gold-beam {
	background: linear-gradient(90deg, transparent, rgba(197, 161, 90, 0.9), rgba(255, 230, 154, 0.85), transparent);
}

.kat-visual {
	isolation: isolate;
}

.kat-circuit {
	opacity: 0.58;
	background-image:
		linear-gradient(rgba(32, 41, 64, 0.06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(32, 41, 64, 0.06) 1px, transparent 1px),
		radial-gradient(circle at 18% 28%, rgba(197, 161, 90, 0.32) 0 2px, transparent 2.5px),
		radial-gradient(circle at 76% 64%, rgba(197, 161, 90, 0.28) 0 2px, transparent 2.5px),
		radial-gradient(circle at 58% 18%, rgba(117, 170, 185, 0.26) 0 2px, transparent 2.5px);
	background-size: 42px 42px, 42px 42px, 100% 100%, 100% 100%, 100% 100%;
}

.kat-gold-wave {
	background:
		radial-gradient(ellipse 56% 32% at 48% 48%, rgba(255, 255, 255, 0.96), transparent 58%),
		conic-gradient(from 228deg at 50% 50%, transparent 0deg, rgba(255, 221, 116, 0.72) 18deg, rgba(255, 255, 255, 0.76) 30deg, transparent 48deg),
		conic-gradient(from 42deg at 50% 50%, transparent 0deg, rgba(197, 161, 90, 0.38) 18deg, rgba(255, 255, 255, 0.7) 34deg, transparent 54deg);
	filter: blur(0.1px);
}

.kat-orbit {
	box-shadow:
		0 0 70px rgba(229, 191, 88, 0.34),
		inset 0 0 50px rgba(255, 255, 255, 0.86);
}

.kat-core {
	box-shadow:
		inset 0 0 32px rgba(255, 230, 154, 0.42),
		0 16px 54px rgba(139, 103, 27, 0.16);
}

.kat-agenda-row {
	display: grid;
	grid-template-columns: 8rem 1fr;
	gap: 1rem;
	align-items: stretch;
}

.kat-time {
	align-self: start;
	border: 1px solid rgba(212, 172, 98, 0.5);
	border-radius: 1rem;
	background: rgba(255, 255, 255, 0.68);
	padding: 0.9rem 1rem;
	color: #202940;
	font-size: 0.82rem;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
	text-align: center;
	box-shadow: 0 12px 30px rgba(139, 103, 27, 0.09);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}

.kat-lab-pattern {
	opacity: 0.5;
	background:
		linear-gradient(135deg, transparent 0 42%, rgba(197, 161, 90, 0.16) 42.2%, transparent 42.8% 100%),
		radial-gradient(ellipse 44% 34% at 86% 0%, rgba(255, 230, 154, 0.42), transparent 70%),
		linear-gradient(rgba(32, 41, 64, 0.035) 1px, transparent 1px),
		linear-gradient(90deg, rgba(32, 41, 64, 0.035) 1px, transparent 1px);
	background-size: 100% 100%, 100% 100%, 34px 34px, 34px 34px;
}

.kat-portrait {
	background:
		radial-gradient(ellipse at 50% 32%, rgba(255, 230, 154, 0.55), transparent 54%),
		linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(255, 248, 226, 0.72));
}

@media (max-width: 720px) {
	.kat-agenda-row { grid-template-columns: 1fr; gap: 0.75rem; }
	.kat-time { width: fit-content; text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
	.kat-cta,
	.kat-cta:hover { transform: none; }
}

/* Preflight is off theme-wide, so Tailwind's --tw-transform vars are uninitialised;
   initialise them so the visual's -translate-*-1/2 centering and hover lifts work. */
.amlab-kat-page * {
	--tw-translate-x: 0;
	--tw-translate-y: 0;
	--tw-rotate: 0;
	--tw-skew-x: 0;
	--tw-skew-y: 0;
	--tw-scale-x: 1;
	--tw-scale-y: 1;
}

/* Hide the redundant global footer membership band (KAT ends with its own CTA). */
.amlab-kat-page .amlab-home-cta { display: none; }

/* KAT sections sit flush — no inherited top margin between bands. */
.amlab-kat-page section {
	margin-top: 0px;
}