/*
Theme Name: GAISHA Marketing
Theme URI: https://example.com/gaisha-marketing
Author: GAISHA
Author URI: https://example.com
Description: Child theme for GAISHA marketing landing page, inheriting from Twenty Twenty-Five.
Template: twentytwentyfive
Version: 1.0.0
Text Domain: gaisha-marketing
*/

/* Global atmosphere + tokens (landing layout remains in assets/css/gaisha-landing.css). */

:root {
	--gaisha-bg-deep: #000106;
	--gaisha-bg-base: #040813;
	--gaisha-container-teal: #40a7d7;
	--gaisha-container-purple: #9163ca;
	--gaisha-container-cyan: #30dedc;
	--gaisha-text: #ffffff;
	--gaisha-gradient-text-start: #34e5dd;
	--gaisha-gradient-text-end: #a454ff;
	--gaisha-gradient-text: linear-gradient(
		135deg,
		var(--gaisha-gradient-text-start) 0%,
		var(--gaisha-gradient-text-end) 100%
	);
	--gaisha-gradient-container: linear-gradient(
		135deg,
		rgba(64, 167, 215, 0.22) 0%,
		rgba(145, 99, 202, 0.18) 52%,
		rgba(48, 222, 220, 0.14) 100%
	);
	--gaisha-atmosphere-radials:
		radial-gradient(ellipse 90% 55% at 8% 0%, rgba(64, 167, 215, 0.14), transparent 58%),
		radial-gradient(ellipse 70% 50% at 92% 8%, rgba(48, 222, 220, 0.1), transparent 52%),
		radial-gradient(ellipse 80% 60% at 50% 72%, rgba(145, 99, 202, 0.12), transparent 62%),
		radial-gradient(ellipse 55% 40% at 18% 88%, rgba(64, 167, 215, 0.08), transparent 55%);
	--gaisha-atmosphere-base: linear-gradient(
		180deg,
		var(--gaisha-bg-deep) 0%,
		var(--gaisha-bg-base) 42%,
		#02040a 100%
	);
}

/* Remap landing tokens to darker biotech palette (loads before gaisha-landing.css). */
body.gaisha-marketing {
	--bg: var(--gaisha-bg-deep) !important;
	--surface: rgba(4, 8, 19, 0.94) !important;
	--surface-soft: rgba(4, 8, 19, 0.82) !important;
	--surface-strong: rgba(2, 5, 12, 0.97) !important;
	--border: rgba(64, 167, 215, 0.14) !important;
	--border-soft: rgba(255, 255, 255, 0.08) !important;
	--text: var(--gaisha-text) !important;
	--muted: rgba(255, 255, 255, 0.78) !important;
	--accent-cyan: var(--gaisha-container-cyan) !important;
	--accent-blue: var(--gaisha-container-teal) !important;
	--accent-purple: var(--gaisha-container-purple) !important;
	--gradient-primary: var(--gaisha-gradient-text) !important;
	--gradient-secondary: linear-gradient(
		135deg,
		var(--gaisha-container-teal) 0%,
		var(--gaisha-container-purple) 100%
	) !important;
	--gradient-highlight: linear-gradient(
		90deg,
		var(--gaisha-gradient-text-start) 0%,
		var(--gaisha-container-purple) 50%,
		var(--gaisha-gradient-text-end) 100%
	) !important;
	--shadow: 0 28px 100px rgba(0, 0, 0, 0.55) !important;
	color: var(--gaisha-text);
	background: var(--gaisha-atmosphere-radials), var(--gaisha-atmosphere-base) !important;
}

body.gaisha-marketing.page-template-page-gaisha-landing {
	background:
		radial-gradient(ellipse 85% 50% at 0% 0%, rgba(64, 167, 215, 0.12), transparent 55%),
		radial-gradient(ellipse 75% 45% at 100% 4%, rgba(48, 222, 220, 0.09), transparent 50%),
		radial-gradient(ellipse 70% 55% at 42% 68%, rgba(145, 99, 202, 0.11), transparent 58%),
		radial-gradient(ellipse 50% 35% at 16% 92%, rgba(64, 167, 215, 0.07), transparent 52%),
		var(--gaisha-atmosphere-base) !important;
}

body.gaisha-marketing .gaisha-landing-shell {
	background:
		radial-gradient(ellipse 85% 50% at 0% 0%, rgba(64, 167, 215, 0.12), transparent 55%),
		radial-gradient(ellipse 75% 45% at 100% 4%, rgba(48, 222, 220, 0.09), transparent 50%),
		radial-gradient(ellipse 70% 55% at 42% 68%, rgba(145, 99, 202, 0.11), transparent 58%),
		var(--gaisha-atmosphere-base) !important;
}

body.gaisha-marketing .gaisha-landing-shell::after {
	background:
		radial-gradient(ellipse 70% 45% at 50% 12%, rgba(48, 222, 220, 0.05), transparent 55%),
		radial-gradient(ellipse 55% 40% at 8% 68%, rgba(145, 99, 202, 0.07), transparent 52%),
		radial-gradient(ellipse 50% 35% at 94% 24%, rgba(64, 167, 215, 0.06), transparent 48%),
		linear-gradient(180deg, rgba(0, 1, 6, 0) 0%, rgba(0, 1, 6, 0.35) 55%, rgba(2, 4, 10, 0.92) 100%) !important;
}

body.gaisha-marketing.page-template-page-gaisha-landing .gaisha-landing-shell::after {
	background:
		radial-gradient(ellipse 70% 45% at 50% 12%, rgba(48, 222, 220, 0.05), transparent 55%),
		radial-gradient(ellipse 55% 40% at 8% 68%, rgba(145, 99, 202, 0.07), transparent 52%),
		radial-gradient(ellipse 50% 35% at 94% 24%, rgba(64, 167, 215, 0.06), transparent 48%),
		linear-gradient(
			180deg,
			transparent 0%,
			transparent 24%,
			rgba(0, 1, 6, 0.2) 48%,
			rgba(2, 4, 10, 0.94) 100%
		) !important;
}

body.gaisha-marketing .gaisha-site-header {
	background: linear-gradient(
		180deg,
		rgba(0, 1, 6, 0.94) 0%,
		rgba(4, 8, 19, 0.72) 100%
	) !important;
	box-shadow:
		0 1px 0 rgba(64, 167, 215, 0.06),
		0 12px 40px rgba(0, 0, 0, 0.45) !important;
}

body.gaisha-marketing .gaisha-site-footer {
	background: rgba(0, 1, 6, 0.82) !important;
	box-shadow: 0 -16px 48px rgba(0, 0, 0, 0.42) !important;
}

body.gaisha-marketing .gaisha-hero {
	background-image:
		radial-gradient(ellipse 90% 70% at 14% 32%, rgba(48, 222, 220, 0.05), transparent 58%),
		radial-gradient(ellipse 70% 55% at 88% 28%, rgba(145, 99, 202, 0.06), transparent 55%) !important;
	box-shadow: none;
}

body.gaisha-marketing.page-template-page-gaisha-landing .gaisha-hero {
	background-image:
		radial-gradient(ellipse 120% 80% at 50% 18%, rgba(48, 222, 220, 0.04), transparent 58%),
		radial-gradient(ellipse 90% 60% at 82% 62%, rgba(145, 99, 202, 0.05), transparent 52%),
		linear-gradient(180deg, rgba(0, 1, 6, 0) 0%, rgba(4, 8, 19, 0.55) 100%) !important;
}

body.gaisha-marketing .gaisha-ecosystem-card,
body.gaisha-marketing .gaisha-assistant-panel {
	background-color: rgba(2, 6, 14, 0.88) !important;
	background-image:
		var(--gaisha-gradient-container),
		radial-gradient(circle at top left, rgba(64, 167, 215, 0.1), transparent 22%),
		radial-gradient(circle at bottom right, rgba(48, 222, 220, 0.06), transparent 28%) !important;
	border-color: rgba(255, 255, 255, 0.07) !important;
	box-shadow:
		0 24px 80px rgba(0, 0, 0, 0.42),
		inset 0 1px 0 rgba(255, 255, 255, 0.04),
		inset 0 0 40px rgba(64, 167, 215, 0.03) !important;
}

body.gaisha-marketing .gaisha-ecosystem-card:hover,
body.gaisha-marketing .gaisha-assistant-panel:hover {
	box-shadow:
		0 32px 96px rgba(0, 0, 0, 0.5),
		inset 0 1px 0 rgba(255, 255, 255, 0.06),
		inset 0 0 48px rgba(48, 222, 220, 0.04) !important;
	border-color: rgba(48, 222, 220, 0.12) !important;
}

body.gaisha-marketing .gaisha-ecosystem-diagram .gaisha-ecosystem-icon,
body.gaisha-marketing .gaisha-ecosystem-diagram .gaisha-ecosystem-card-icon {
	background: none !important;
	border: none !important;
	box-shadow: none !important;
}

body.gaisha-marketing .gaisha-text-gradient,
body.gaisha-marketing .gaisha-hero h1 .gaisha-text-gradient {
	background: var(--gaisha-gradient-text) !important;
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.gaisha-gradient-text,
body.gaisha-marketing .gaisha-gradient-text {
	background: var(--gaisha-gradient-text);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

body.gaisha-marketing .gaisha-lead,
body.gaisha-marketing .gaisha-hero h1,
body.gaisha-marketing .gaisha-section h2,
body.gaisha-marketing .gaisha-ecosystem-card h3,
body.gaisha-marketing .gaisha-roadmap-point-title {
	color: var(--gaisha-text);
}

/* Roadmap — straight horizontal timeline (full-width scroll) */
body.gaisha-marketing .gaisha-section.gaisha-roadmap {
	position: relative;
	overflow-x: clip;
	overflow-y: visible;
}

body.gaisha-marketing .gaisha-section.gaisha-roadmap::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		radial-gradient(ellipse 70% 55% at 12% 88%, rgba(48, 222, 220, 0.1), transparent 58%),
		radial-gradient(ellipse 55% 45% at 88% 12%, rgba(255, 159, 47, 0.08), transparent 52%);
	opacity: 0.95;
}

body.gaisha-marketing .gaisha-section.gaisha-roadmap .gaisha-container {
	position: relative;
	z-index: 1;
	max-width: none;
}

body.gaisha-marketing .gaisha-roadmap-header {
	text-align: center;
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
}

body.gaisha-marketing .gaisha-roadmap {
	position: relative;
	z-index: 1;
	width: 100%;
	margin-top: 0.5rem;
}

body.gaisha-marketing .gaisha-roadmap-nav {
	display: flex;
	justify-content: flex-end;
	gap: 0.5rem;
	max-width: 1440px;
	margin: 0 auto;
	padding: 0 clamp(1.25rem, 3vw, 2.5rem) 0.65rem;
	box-sizing: border-box;
}

body.gaisha-marketing .gaisha-roadmap-arrow {
	display: grid;
	place-items: center;
	width: 2.25rem;
	height: 2.25rem;
	padding: 0;
	border: 1px solid rgba(166, 201, 255, 0.22);
	border-radius: 50%;
	background: rgba(4, 12, 28, 0.65);
	color: rgba(244, 249, 255, 0.9);
	font-size: 1rem;
	line-height: 1;
	cursor: pointer;
	transition: border-color 0.2s ease, background 0.2s ease;
}

body.gaisha-marketing .gaisha-roadmap-arrow:hover {
	border-color: rgba(48, 222, 220, 0.45);
	background: rgba(4, 12, 28, 0.85);
}

body.gaisha-marketing .gaisha-roadmap-scroll {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	overflow-x: auto;
	overflow-y: hidden;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scroll-snap-type: x proximity;
	scrollbar-width: thin;
	scrollbar-color: rgba(48, 222, 220, 0.35) transparent;
	padding: 0 clamp(1.25rem, 3vw, 2.5rem) 0.5rem;
	box-sizing: border-box;
}

body.gaisha-marketing .gaisha-roadmap-scroll::-webkit-scrollbar {
	height: 6px;
}

body.gaisha-marketing .gaisha-roadmap-scroll::-webkit-scrollbar-thumb {
	background: linear-gradient(90deg, rgba(48, 222, 220, 0.35), rgba(255, 159, 47, 0.35));
	border-radius: 999px;
}

body.gaisha-marketing .gaisha-roadmap-track {
	--roadmap-col: 240px;
	--roadmap-gap: 36px;
	--roadmap-line-top: 28px;
	position: relative;
	display: grid;
	grid-template-columns: repeat(9, var(--roadmap-col));
	gap: var(--roadmap-gap);
	width: max-content;
	min-width: calc(9 * var(--roadmap-col) + 8 * var(--roadmap-gap));
	box-sizing: border-box;
	padding: 8px 0 0.5rem;
}

body.gaisha-marketing .gaisha-roadmap-track::before {
	content: "";
	position: absolute;
	top: var(--roadmap-line-top);
	left: calc(var(--roadmap-col) / 2);
	width: calc(9 * var(--roadmap-col) + 8 * var(--roadmap-gap) - var(--roadmap-col));
	height: 2px;
	border-radius: 999px;
	background: linear-gradient(
		90deg,
		#30dedc,
		#40a7d7,
		#5aa7ff,
		#7b6cff,
		#a454ff,
		#34e5dd,
		#5aa7ff,
		#9163ca,
		#ff9f2f
	);
	pointer-events: none;
	z-index: 0;
}

body.gaisha-marketing .gaisha-roadmap-point,
body.gaisha-marketing .gaisha-roadmap-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	min-width: 0;
	text-align: center;
	scroll-snap-align: start;
	background: transparent;
}

body.gaisha-marketing .gaisha-roadmap-point-marker {
	position: relative;
	z-index: 1;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	margin: 0 0 28px;
	flex-shrink: 0;
	background: transparent;
}

body.gaisha-marketing .gaisha-roadmap-point-number,
body.gaisha-marketing .gaisha-roadmap-number {
	position: relative;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	margin-left: auto;
	margin-right: auto;
	border-radius: 50%;
	border: none;
	background: var(--roadmap-color, #30dedc);
	color: #041018;
	font-size: 0.92rem;
	font-weight: 700;
	line-height: 1;
	box-shadow: none;
	text-shadow: none;
	filter: none;
}

body.gaisha-marketing .gaisha-roadmap-point-body,
body.gaisha-marketing .gaisha-roadmap-content {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	max-width: 100%;
	padding: 0 0.35rem;
	text-align: center;
	background: transparent;
	gap: 10px;
}

body.gaisha-marketing .gaisha-roadmap-point-title {
	margin: 0;
	font-size: 0.92rem;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: color-mix(in srgb, var(--roadmap-color, #30dedc) 15%, #ffffff);
}

body.gaisha-marketing .gaisha-roadmap-point-status {
	margin: 0;
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--roadmap-color, #30dedc);
}

body.gaisha-marketing .gaisha-roadmap-point-year {
	margin: 0;
	font-size: 0.72rem;
	font-weight: 600;
	color: rgba(244, 249, 255, 0.5);
}

body.gaisha-marketing .gaisha-roadmap-point-bullets,
body.gaisha-marketing .gaisha-roadmap-content ul {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	margin: 0 auto;
	padding: 0;
	list-style: none;
	text-align: left;
}

body.gaisha-marketing .gaisha-roadmap-point-bullets li {
	position: relative;
	padding-left: 0.75rem;
	margin: 0 0 0.26rem;
	color: rgba(244, 249, 255, 0.7);
	font-size: 0.76rem;
	line-height: 1.45;
}

body.gaisha-marketing .gaisha-roadmap-point-bullets li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--roadmap-color, #30dedc);
	box-shadow: none;
}

@media (max-width: 900px) {
	body.gaisha-marketing .gaisha-roadmap-track {
		--roadmap-col: 200px;
		--roadmap-gap: 28px;
	}

	body.gaisha-marketing .gaisha-roadmap-point-bullets {
		font-size: 0.72rem;
	}
}

body.gaisha-marketing .wp-site-blocks > header,
body.gaisha-marketing header.wp-block-template-part {
	display: none !important;
}

body.gaisha-marketing .gaisha-site-main {
	max-width: 1200px;
	margin: 0 auto;
	padding: 2.6rem 4vw 4rem;
}

body.gaisha-marketing .gaisha-site-main .entry-title,
body.gaisha-marketing .gaisha-site-main .entry-content,
body.gaisha-marketing .gaisha-site-main a {
	color: inherit;
}
