/* ============================================================
   SYNTHWAVE — retro-future styling on top of Twenty Twenty-Five
   ============================================================ */

:root {
	--sw-pink: #ff2bd6;
	--sw-cyan: #00f0ff;
	--sw-violet: #7b2cff;
	--sw-gold: #ffb020;
	--sw-orange: #ff5f3d;
	--sw-void: #0b0221;
	--sw-deep: #160a3d;
	--sw-dusk: #22125a;
	--sw-glow-pink: 0 0 6px rgba(255,43,214,.9), 0 0 18px rgba(255,43,214,.55), 0 0 40px rgba(255,43,214,.3);
	--sw-glow-cyan: 0 0 6px rgba(0,240,255,.9), 0 0 18px rgba(0,240,255,.5), 0 0 40px rgba(0,240,255,.25);
}

html { scrollbar-color: var(--sw-violet) var(--sw-void); }
body {
	background:
		radial-gradient(ellipse at 50% -10%, rgba(123,44,255,.35), transparent 60%),
		radial-gradient(ellipse at 80% 110%, rgba(255,43,214,.18), transparent 55%),
		var(--sw-void);
	background-attachment: fixed;
	position: relative;
}

/* Starfield */
body::before {
	content: "";
	position: fixed; inset: 0; z-index: -1; pointer-events: none;
	background-image:
		radial-gradient(1px 1px at 12% 18%, #fff 60%, transparent 61%),
		radial-gradient(1px 1px at 33% 42%, #fff 60%, transparent 61%),
		radial-gradient(1.5px 1.5px at 57% 12%, #fff 60%, transparent 61%),
		radial-gradient(1px 1px at 72% 66%, #fff 60%, transparent 61%),
		radial-gradient(1px 1px at 88% 28%, #fff 60%, transparent 61%),
		radial-gradient(1.5px 1.5px at 20% 80%, #fff 60%, transparent 61%),
		radial-gradient(1px 1px at 44% 92%, #fff 60%, transparent 61%),
		radial-gradient(1px 1px at 93% 84%, #fff 60%, transparent 61%),
		radial-gradient(1px 1px at 5% 55%, #fff 60%, transparent 61%),
		radial-gradient(1.5px 1.5px at 65% 38%, #fff 60%, transparent 61%);
	opacity: .55;
	animation: sw-twinkle 6s ease-in-out infinite alternate;
}
@keyframes sw-twinkle { from { opacity: .35 } to { opacity: .75 } }

/* CRT scanlines */
body::after {
	content: "";
	position: fixed; inset: 0; z-index: 9999; pointer-events: none;
	background: repeating-linear-gradient(0deg, rgba(0,0,0,.14) 0 1px, transparent 1px 3px);
	mix-blend-mode: multiply;
	opacity: .6;
}

::selection { background: var(--sw-pink); color: var(--sw-void); }

/* ------------------------------------------------------------
   Header
   ------------------------------------------------------------ */
.sw-header {
	border-bottom: 1px solid rgba(0,240,255,.25);
	backdrop-filter: blur(8px);
	background: linear-gradient(180deg, rgba(11,2,33,.85), rgba(11,2,33,.4));
	position: sticky; top: 0; z-index: 50;
}
.sw-header .wp-block-site-title a {
	font-family: 'Orbitron', sans-serif;
	font-weight: 900;
	letter-spacing: .12em;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
	text-shadow: var(--sw-glow-pink);
	transition: text-shadow .2s;
}
.sw-header .wp-block-site-title a:hover { text-shadow: var(--sw-glow-cyan); }
.sw-header .wp-block-navigation a {
	font-family: 'Orbitron', sans-serif;
	font-size: .72rem;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--sw-cyan);
	position: relative;
	padding: .3em 0;
}
.sw-header .wp-block-navigation a::after {
	content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 1px;
	background: var(--sw-pink); box-shadow: var(--sw-glow-pink); transition: right .25s;
}
.sw-header .wp-block-navigation a:hover::after { right: 0; }
.sw-header .wp-block-navigation a:hover { color: #fff; }

/* ------------------------------------------------------------
   Hero: sun + grid horizon
   ------------------------------------------------------------ */
.sw-hero {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	min-height: 78vh;
	display: flex; align-items: center; justify-content: center;
	text-align: center;
	background: linear-gradient(180deg, var(--sw-void) 0%, var(--sw-dusk) 55%, #3a0b5e 75%, #ff2bd6 100%);
}
/* Sun */
.sw-hero::before {
	content: "";
	position: absolute; z-index: -2;
	left: 50%; bottom: 22%;
	width: min(48vw, 420px); aspect-ratio: 1;
	transform: translateX(-50%);
	border-radius: 50%;
	background: linear-gradient(180deg, #fff6a3 0%, var(--sw-gold) 25%, var(--sw-orange) 55%, var(--sw-pink) 100%);
	box-shadow: 0 0 60px rgba(255,176,32,.55), 0 0 140px rgba(255,43,214,.45);
	animation: sw-sunrise 1.8s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes sw-sunrise { from { transform: translateX(-50%) translateY(30%); opacity: 0 } to { transform: translateX(-50%); opacity: 1 } }
/* Sun stripes overlay */
.sw-hero .sw-sun-stripes {
	position: absolute; z-index: -1;
	left: 50%; bottom: 22%;
	width: min(48vw, 420px); aspect-ratio: 1;
	transform: translateX(-50%);
	border-radius: 50%;
	background: linear-gradient(180deg, transparent 0 58%, rgba(34,18,90,.95) 58% 61%, transparent 61% 68%, rgba(34,18,90,.95) 68% 72%, transparent 72% 78%, rgba(34,18,90,.95) 78% 83%, transparent 83% 88%, rgba(34,18,90,.95) 88% 94%, transparent 94% 100%);
	pointer-events: none;
}
/* Perspective grid floor */
.sw-hero .sw-grid {
	position: absolute; z-index: -1;
	left: -50%; right: -50%; bottom: 0; height: 38%;
	background-image:
		linear-gradient(90deg, rgba(0,240,255,.55) 1px, transparent 1px),
		linear-gradient(0deg,  rgba(0,240,255,.55) 1px, transparent 1px);
	background-size: 80px 80px;
	transform-origin: 50% 0;
	transform: perspective(500px) rotateX(62deg);
	mask-image: linear-gradient(180deg, transparent 0%, #000 25%, #000 100%);
	animation: sw-grid-scroll 3s linear infinite;
	filter: drop-shadow(0 0 6px rgba(0,240,255,.6));
}
.sw-hero .sw-grid::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(180deg, var(--sw-pink) 0, transparent 30%);
	opacity: .35;
}
@keyframes sw-grid-scroll { from { background-position: 0 0 } to { background-position: 0 80px } }
/* Horizon haze line */
.sw-hero .sw-horizon {
	position: absolute; left: 0; right: 0; bottom: 38%; height: 2px; z-index: -1;
	background: var(--sw-pink);
	box-shadow: var(--sw-glow-pink), 0 -30px 60px 20px rgba(255,43,214,.35);
}
.sw-hero .sw-hero-inner { position: relative; z-index: 1; padding: 4rem 1.5rem; }
.sw-hero .sw-kicker {
	font-family: 'JetBrains Mono', monospace;
	font-size: .8rem; letter-spacing: .35em; text-transform: uppercase;
	color: var(--sw-cyan); text-shadow: var(--sw-glow-cyan);
	margin: 0 auto 1.25rem; display: inline-block; padding: .45em 1.1em; background: rgba(11,2,33,.72); border: 1px solid rgba(0,240,255,.45); border-radius: 999px; backdrop-filter: blur(4px); text-shadow: 0 0 6px rgba(0,240,255,.9), 0 2px 10px rgba(11,2,33,.95), 0 0 2px #000;
}
.sw-hero h1 {
	font-family: 'Orbitron', sans-serif;
	font-weight: 900;
	font-size: clamp(2.6rem, 9vw, 6.5rem);
	line-height: .95;
	letter-spacing: .05em;
	text-transform: uppercase;
	margin: 0;
	/* Chrome text */
	background: linear-gradient(180deg, #fff 0%, #dcd0ff 38%, #7b2cff 50%, #ff2bd6 52%, #ffd3f5 72%, #fff 100%);
	-webkit-background-clip: text; background-clip: text;
	color: transparent;
	filter: drop-shadow(0 0 12px rgba(255,43,214,.7)) drop-shadow(0 4px 0 rgba(0,0,0,.6));
}
.sw-hero .sw-tagline {
	font-family: 'Space Grotesk', sans-serif;
	color: #f4f0ff;
	font-size: clamp(1rem, 2vw, 1.3rem);
	max-width: 42ch; margin: 1.5rem auto 0;
	text-shadow: 0 2px 12px rgba(0,0,0,.6);
}

/* ------------------------------------------------------------
   Post grid cards
   ------------------------------------------------------------ */
.sw-section-title {
	font-family: 'Orbitron', sans-serif !important;
	font-size: .8rem !important; letter-spacing: .4em; text-transform: uppercase;
	color: var(--sw-cyan) !important;
	display: flex; align-items: center; gap: 1rem;
}
.sw-section-title::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, var(--sw-cyan), transparent); }

.sw-card {
	position: relative;
	background: linear-gradient(160deg, rgba(34,18,90,.75), rgba(22,10,61,.6));
	border: 1px solid rgba(123,44,255,.45);
	border-radius: 6px;
	padding: 1.5rem !important;
	transition: transform .25s, border-color .25s, box-shadow .25s;
	overflow: hidden;
	height: 100%;
}
.sw-card::before {
	content: ""; position: absolute; left: 0; top: 0; right: 0; height: 2px;
	background: linear-gradient(90deg, var(--sw-pink), var(--sw-violet), var(--sw-cyan));
	opacity: .8;
}
.sw-card::after {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: linear-gradient(120deg, transparent 40%, rgba(255,255,255,.06) 50%, transparent 60%);
	transform: translateX(-120%); transition: transform .6s;
}
.sw-card:hover { transform: translateY(-4px); border-color: var(--sw-pink); box-shadow: 0 0 0 1px rgba(255,43,214,.4), 0 12px 40px rgba(255,43,214,.25); }
.sw-card:hover::after { transform: translateX(120%); }
.sw-card .wp-block-post-title { font-size: 1.15rem; line-height: 1.3; letter-spacing: .02em; }
.sw-card .wp-block-post-title a { color: #fff; text-decoration: none; }
.sw-card .wp-block-post-title a:hover { color: var(--sw-cyan); text-shadow: var(--sw-glow-cyan); }
.sw-card .wp-block-post-date { font-family: 'JetBrains Mono', monospace; font-size: .72rem; letter-spacing: .15em; color: var(--sw-pink); text-transform: uppercase; }
.sw-card .wp-block-post-date a { color: inherit; text-decoration: none; }
.sw-card .wp-block-post-excerpt { color: #b9a8e6; font-size: .95rem; }
.sw-card .wp-block-post-excerpt__more-link { color: var(--sw-cyan); font-family: 'Orbitron', sans-serif; font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; text-decoration: none; }
.sw-card .wp-block-post-featured-image img { border-radius: 4px; }

/* Pagination */
.wp-block-query-pagination a, .wp-block-query-pagination span {
	font-family: 'Orbitron', sans-serif; font-size: .75rem; letter-spacing: .2em; text-transform: uppercase;
}
.wp-block-query-pagination-numbers .current { color: var(--sw-pink); text-shadow: var(--sw-glow-pink); }

/* ------------------------------------------------------------
   Single post / page
   ------------------------------------------------------------ */
.sw-single-header { text-align: center; padding: 4rem 1rem 2rem; position: relative; }
.sw-single-header .wp-block-post-title {
	font-size: clamp(2rem, 5vw, 3.5rem);
	background: linear-gradient(180deg, #fff 0%, #dcd0ff 45%, #ff2bd6 55%, #fff 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
	filter: drop-shadow(0 0 10px rgba(255,43,214,.5));
}
.sw-single-header .sw-meta {
	font-family: 'JetBrains Mono', monospace; font-size: .75rem; letter-spacing: .2em; text-transform: uppercase;
	color: var(--sw-cyan); justify-content: center;
}
.sw-single-header .sw-meta a { color: inherit; text-decoration: none; }
.sw-single-header .sw-meta a:hover { color: var(--sw-pink); }
.sw-neon-rule {
	width: 120px; height: 2px; margin: 1.5rem auto 0; border: 0 !important;
	background: linear-gradient(90deg, transparent, var(--sw-pink), transparent) !important;
	box-shadow: var(--sw-glow-pink);
}
.entry-content { font-size: 1.08rem; color: #e6e0f5; }
.entry-content h2, .entry-content h3 { color: #fff; margin-top: 2.2em; }
.entry-content h2 { text-shadow: 0 0 14px rgba(0,240,255,.35); }
.entry-content a { text-decoration-color: rgba(0,240,255,.5); text-underline-offset: .2em; }
.entry-content img { border-radius: 6px; box-shadow: 0 0 0 1px rgba(123,44,255,.5), 0 10px 40px rgba(0,0,0,.5); }
.entry-content pre, .entry-content code { font-family: 'JetBrains Mono', monospace; }
.entry-content :not(pre) > code { background: rgba(0,240,255,.1); color: var(--sw-cyan); padding: .1em .35em; border-radius: 3px; font-size: .9em; }
.entry-content blockquote { font-style: italic; }
.entry-content blockquote p::before { content: "// "; color: var(--sw-pink); font-style: normal; font-family: 'JetBrains Mono', monospace; }

.wp-block-post-navigation-link a, .post-navigation-link-previous a, .post-navigation-link-next a {
	font-family: 'Orbitron', sans-serif; font-size: .75rem; letter-spacing: .15em; text-transform: uppercase; text-decoration: none;
}

/* Buttons glow */
.wp-block-button__link { transition: all .2s; }
.wp-block-button__link:hover { box-shadow: var(--sw-glow-cyan); }

/* Search */
.wp-block-search__input {
	background: rgba(11,2,33,.8) !important; color: #fff !important;
	border: 1px solid var(--sw-violet) !important; font-family: 'JetBrains Mono', monospace;
}
.wp-block-search__input:focus { outline: none; border-color: var(--sw-cyan) !important; box-shadow: var(--sw-glow-cyan); }
.wp-block-search__button { font-family: 'Orbitron', sans-serif; letter-spacing: .15em; text-transform: uppercase; font-size: .7rem; }

/* ------------------------------------------------------------
   Footer
   ------------------------------------------------------------ */
.sw-footer {
	position: relative;
	border-top: 1px solid rgba(255,43,214,.35);
	background: linear-gradient(180deg, transparent, rgba(255,43,214,.08));
	overflow: hidden;
}
.sw-footer::before {
	content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px;
	background: var(--sw-pink); box-shadow: var(--sw-glow-pink);
}
.sw-footer, .sw-footer p { font-family: 'JetBrains Mono', monospace; font-size: .78rem; letter-spacing: .12em; color: #7e6bb5; }
.sw-footer a { color: var(--sw-cyan); text-decoration: none; }
.sw-footer a:hover { color: var(--sw-pink); }
.sw-footer .sw-blink { animation: sw-blink 1.1s steps(2) infinite; color: var(--sw-pink); }
@keyframes sw-blink { to { visibility: hidden } }

/* 404 */
.sw-404 { font-family: 'Orbitron', sans-serif; font-size: clamp(5rem, 22vw, 14rem); font-weight: 900; line-height: 1; color: transparent; -webkit-text-stroke: 2px var(--sw-cyan); text-shadow: var(--sw-glow-cyan); animation: sw-flicker 4s infinite; }
@keyframes sw-flicker { 0%,93%,100% { opacity: 1 } 94% { opacity: .3 } 96% { opacity: 1 } 98% { opacity: .5 } }

@media (prefers-reduced-motion: reduce) {
	.sw-hero .sw-grid, body::before, .sw-hero::before, .sw-404, .sw-footer .sw-blink { animation: none !important; }
}
