/*
 Theme Name:   Kadence Child — nicolaswehmeyer.de
 Theme URI:    https://www.nicolaswehmeyer.de
 Description:  Dark, bold personal brand theme for Nicolas Wehmeyer — Tech & Music
 Author:       Nicolas Wehmeyer
 Author URI:   https://www.nicolaswehmeyer.de
 Template:     kadence
 Version:      2.0.0
 Text Domain:  kadence-child-nw
*/

/* ==========================================================================
   1. CSS Custom Properties
   ========================================================================== */

:root {
	/* Core Colors */
	--nw-bg-primary: #050505;
	--nw-bg-secondary: #0c0c0c;
	--nw-bg-tertiary: #151515;
	--nw-bg-card: #0e0e0e;
	--nw-text-primary: #ffffff;
	--nw-text-secondary: #a0a0a0;
	--nw-text-muted: #555555;

	/* Accent — Warm Orange */
	--nw-accent: #ff6b35;
	--nw-accent-light: #ff8c5a;
	--nw-accent-glow: rgba(255, 107, 53, 0.15);
	--nw-accent-glow-strong: rgba(255, 107, 53, 0.3);

	/* Borders */
	--nw-border: rgba(255, 255, 255, 0.06);
	--nw-border-hover: rgba(255, 255, 255, 0.15);
	--nw-border-accent: rgba(255, 107, 53, 0.2);

	/* Typography */
	--nw-font-heading: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
	--nw-font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
	--nw-font-mono: 'JetBrains Mono', 'Fira Code', monospace;

	/* Spacing */
	--nw-section-gap: clamp(5rem, 10vw, 10rem);
	--nw-content-width: 1200px;
	--nw-narrow-width: 800px;

	/* Transitions */
	--nw-transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	--nw-transition-slow: 0.6s cubic-bezier(0.4, 0, 0.2, 1);

	/* Gradients */
	--nw-gradient-hero: radial-gradient(ellipse 80% 50% at 50% 40%, rgba(255, 107, 53, 0.08) 0%, transparent 60%);
	--nw-gradient-card: linear-gradient(145deg, rgba(255, 255, 255, 0.03) 0%, transparent 50%);
	--nw-gradient-section: linear-gradient(180deg, var(--nw-bg-primary) 0%, var(--nw-bg-secondary) 50%, var(--nw-bg-primary) 100%);
}

/* ==========================================================================
   2. Global Reset & Base — Override Kadence
   ========================================================================== */

html {
	scroll-behavior: smooth;
}

body,
body.site,
.site {
	background-color: var(--nw-bg-primary) !important;
	color: var(--nw-text-primary);
	font-family: var(--nw-font-body);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

/* Override Kadence CSS variables globally — !important to win over inline <style> */
body .site,
body,
:root {
	--global-palette1: #ffffff !important;
	--global-palette2: #b0b0b0 !important;
	--global-palette3: #ff6b35 !important;
	--global-palette4: #ff8c5a !important;
	--global-palette5: #ff6b35 !important;
	--global-palette6: #e55a2b !important;
	--global-palette7: #0a0a0a !important;
	--global-palette8: #0e0e0e !important;
	--global-palette9: #141414 !important;
	--global-palette-highlight: #ff6b35 !important;
	--global-palette-highlight-alt: #ff8c5a !important;
	--global-palette-highlight-alt2: #ff6b35 !important;
	--global-palette-btn-bg: #ff6b35 !important;
	--global-palette-btn-bg-hover: #ff8c5a !important;
	--global-palette-btn: #ffffff !important;
	--global-palette-btn-hover: #ffffff !important;
	--global-body-font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
	--global-heading-font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

::selection {
	background-color: var(--nw-accent);
	color: #ffffff;
}

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

/* ==========================================================================
   3. Typography
   ========================================================================== */

h1, h2, h3, h4, h5, h6,
.wp-block-heading {
	font-family: var(--nw-font-heading) !important;
	color: var(--nw-text-primary) !important;
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.1;
}

h1, .wp-block-heading:where([class*="h1"]) {
	font-size: clamp(2.5rem, 6vw, 4.5rem) !important;
	font-weight: 800;
	letter-spacing: -0.04em;
}

h2, .wp-block-heading:where([class*="h2"]) {
	font-size: clamp(1.8rem, 4vw, 3rem) !important;
	letter-spacing: -0.03em;
}

h3, .wp-block-heading:where([class*="h3"]) {
	font-size: clamp(1.3rem, 2.5vw, 1.8rem) !important;
}

h4 { font-size: 1.2rem; }
h5 { font-size: 1rem; }
h6 { font-size: 0.875rem; }

p,
.entry-content p {
	color: var(--nw-text-secondary);
	line-height: 1.7;
	font-size: 1.05rem;
}

a {
	color: var(--nw-accent);
	text-decoration: none;
	transition: color var(--nw-transition);
}

a:hover,
a:focus {
	color: var(--nw-accent-light);
}

/* Content links — force orange over Kadence inline cyan */
.entry-content a:not(.wp-block-button__link),
.site-main a:not(.wp-block-button__link):not(.wp-block-navigation-item__content),
.wp-site-blocks a:not(.wp-block-button__link):not(.wp-block-navigation-item__content) {
	color: var(--nw-accent) !important;
	text-decoration: none;
}

.entry-content a:not(.wp-block-button__link):hover,
.site-main a:not(.wp-block-button__link):not(.wp-block-navigation-item__content):hover {
	color: var(--nw-accent-light) !important;
}

/* ==========================================================================
   4. Header — Floating Glass Effect
   ========================================================================== */

.site-header,
#masthead {
	background: rgba(5, 5, 5, 0.6) !important;
	backdrop-filter: blur(24px) saturate(180%);
	-webkit-backdrop-filter: blur(24px) saturate(180%);
	border-bottom: 1px solid var(--nw-border) !important;
	transition: background 0.4s ease, box-shadow 0.4s ease !important;
	z-index: 100;
}

/* Sticky header enhancement */
.item-is-stuck .site-header,
.site-header.item-is-stuck,
#masthead.item-is-stuck {
	background: rgba(5, 5, 5, 0.92) !important;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.4);
}

/* Transparent header — when Kadence marks it */
.transparent-header .site-header,
.transparent-header #masthead {
	background: transparent !important;
	border-bottom-color: transparent !important;
}

.transparent-header .item-is-stuck.site-header,
.transparent-header #masthead.item-is-stuck {
	background: rgba(5, 5, 5, 0.92) !important;
	border-bottom: 1px solid var(--nw-border) !important;
}

/* Site branding / logo */
.site-branding .site-title,
.site-branding .site-title a {
	font-size: 1.1rem !important;
	font-weight: 800 !important;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--nw-text-primary) !important;
	transition: color var(--nw-transition);
}

.site-branding .site-title a:hover {
	color: var(--nw-accent) !important;
}

/* Navigation links */
.header-navigation .menu > li > a,
.header-navigation nav > ul > li > a,
.primary-menu-container > ul > li > a,
.main-navigation .primary-menu-container > ul li.menu-item > a {
	color: var(--nw-text-secondary) !important;
	font-size: 0.8rem !important;
	font-weight: 500 !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
	transition: color var(--nw-transition) !important;
	padding: 0.5rem 0.85rem !important;
}

.header-navigation .menu > li > a:hover,
.header-navigation .menu > li.current-menu-item > a,
.header-navigation nav > ul > li > a:hover,
.header-navigation nav > ul > li.current-menu-item > a,
.primary-menu-container > ul > li.current-menu-item > a,
.main-navigation .primary-menu-container > ul li.menu-item > a:hover,
.main-navigation .primary-menu-container > ul li.current-menu-item > a {
	color: var(--nw-text-primary) !important;
}

/* Mobile menu */
.mobile-toggle-open-container .menu-toggle-btn {
	color: var(--nw-text-primary);
}

.mobile-navigation .menu li a {
	color: var(--nw-text-secondary);
	font-size: 1.1rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

/* ==========================================================================
   5. Hero Section — Full Viewport, Bold & Glowing
   ========================================================================== */

.nw-hero,
.nw-hero.wp-block-group {
	min-height: 100vh !important;
	min-height: 100dvh !important;
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
	align-items: center !important;
	text-align: center !important;
	padding: 2rem !important;
	position: relative !important;
	overflow: hidden;
	background: var(--nw-bg-primary) !important;
}

/* Animated gradient glow behind hero */
.nw-hero::before {
	content: '';
	position: absolute;
	top: -20%;
	left: 50%;
	transform: translateX(-50%);
	width: 120%;
	height: 120%;
	background: radial-gradient(ellipse 60% 40% at 50% 50%, rgba(255, 107, 53, 0.07) 0%, transparent 70%);
	pointer-events: none;
	animation: nw-glow-pulse 8s ease-in-out infinite;
}

/* Subtle noise/grain texture overlay */
.nw-hero::after {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse at 20% 80%, rgba(255, 107, 53, 0.04) 0%, transparent 50%),
	            radial-gradient(ellipse at 80% 20%, rgba(255, 255, 255, 0.02) 0%, transparent 50%);
	pointer-events: none;
}

@keyframes nw-glow-pulse {
	0%, 100% { opacity: 0.6; transform: translateX(-50%) scale(1); }
	50% { opacity: 1; transform: translateX(-50%) scale(1.05); }
}

/* Hero heading — Nicolas Wehmeyer */
.nw-hero .wp-block-heading[class*="nw-hero"],
.nw-hero h1,
.nw-hero .nw-hero__title,
h1.nw-hero__title {
	font-size: clamp(3.5rem, 12vw, 9rem) !important;
	font-weight: 900 !important;
	letter-spacing: -0.04em !important;
	line-height: 0.9 !important;
	text-transform: uppercase !important;
	color: var(--nw-text-primary) !important;
	position: relative;
	z-index: 1;
	margin-bottom: 1.5rem !important;
	/* Subtle text shadow glow */
	text-shadow: 0 0 80px rgba(255, 107, 53, 0.15), 0 0 160px rgba(255, 107, 53, 0.05);
}

/* Hero subtitle / tagline */
.nw-hero .nw-hero__subtitle,
.nw-hero p.nw-hero__subtitle {
	font-size: clamp(0.9rem, 1.8vw, 1.2rem) !important;
	color: var(--nw-text-muted) !important;
	font-weight: 400 !important;
	letter-spacing: 0.25em !important;
	text-transform: uppercase !important;
	margin-bottom: 3rem !important;
	position: relative;
	z-index: 1;
}

/* Hero CTA buttons container */
.nw-hero .nw-hero__cta,
.nw-hero .wp-block-buttons {
	position: relative;
	z-index: 1;
	gap: 1rem !important;
}

/* Primary CTA button */
.nw-hero .wp-block-button:first-child .wp-block-button__link,
.nw-btn--primary .wp-block-button__link {
	background: var(--nw-accent) !important;
	color: #ffffff !important;
	font-weight: 600 !important;
	font-size: 0.85rem !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	padding: 1rem 2.5rem !important;
	border-radius: 6px !important;
	border: none !important;
	transition: all var(--nw-transition) !important;
	box-shadow: 0 4px 20px var(--nw-accent-glow);
}

.nw-hero .wp-block-button:first-child .wp-block-button__link:hover {
	background: var(--nw-accent-light) !important;
	box-shadow: 0 6px 30px var(--nw-accent-glow-strong) !important;
	transform: translateY(-2px);
}

/* Outline CTA button */
.nw-hero .wp-block-button:last-child .wp-block-button__link,
.nw-btn--outline .wp-block-button__link {
	background: transparent !important;
	color: var(--nw-text-primary) !important;
	font-weight: 500 !important;
	font-size: 0.85rem !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	padding: 1rem 2.5rem !important;
	border-radius: 6px !important;
	border: 1px solid var(--nw-border-hover) !important;
	transition: all var(--nw-transition) !important;
}

.nw-hero .wp-block-button:last-child .wp-block-button__link:hover {
	border-color: var(--nw-text-primary) !important;
	background: rgba(255, 255, 255, 0.05) !important;
}

/* Scroll indicator */
.nw-hero__scroll {
	position: absolute;
	bottom: 2.5rem;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
	z-index: 1;
}

.nw-hero__scroll span {
	font-size: 0.65rem;
	font-weight: 500;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--nw-text-muted);
}

.nw-hero__scroll-line {
	width: 1px;
	height: 40px;
	background: linear-gradient(to bottom, var(--nw-accent), transparent);
	animation: nw-scroll-line 2s ease-in-out infinite;
}

@keyframes nw-scroll-line {
	0% { opacity: 0; transform: scaleY(0); transform-origin: top; }
	50% { opacity: 1; transform: scaleY(1); transform-origin: top; }
	100% { opacity: 0; transform: scaleY(0); transform-origin: bottom; }
}

/* ==========================================================================
   5b. Hero — Cover Block Variant (Background Image)
   ========================================================================== */

/* When hero uses wp:cover with a background image, let the image show */
.wp-block-cover.nw-hero {
	background: transparent !important;
	min-height: 100vh !important;
	min-height: 100dvh !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

/* Remove the gradient glow pseudo — the photo IS the visual */
.wp-block-cover.nw-hero::before,
.wp-block-cover.nw-hero::after {
	display: none !important;
}

/* Cover image itself */
.wp-block-cover.nw-hero .wp-block-cover__image-background {
	object-fit: cover;
	filter: brightness(0.55) saturate(1.2);
	transition: filter 1.2s ease;
}

/* Inner container within cover block */
.wp-block-cover.nw-hero .wp-block-cover__inner-container {
	max-width: var(--nw-content-width);
	width: 100%;
	margin: 0 auto;
	position: relative;
	z-index: 2;
}

/* Hero content within cover */
.wp-block-cover.nw-hero .nw-hero__content {
	text-align: left;
	padding: 0;
}

/* Ensure text has strong contrast over the photo */
.wp-block-cover.nw-hero h1.nw-hero__title {
	text-shadow: 0 2px 40px rgba(0, 0, 0, 0.6), 0 0 80px rgba(255, 107, 53, 0.2);
}

.wp-block-cover.nw-hero .nw-hero__subtitle {
	text-shadow: 0 1px 20px rgba(0, 0, 0, 0.5);
}

/* Subtle bottom gradient for cover hero → smooth transition to page */
.wp-block-cover.nw-hero .wp-block-cover__background {
	background: linear-gradient(
		to bottom,
		rgba(5, 5, 5, 0.3) 0%,
		rgba(5, 5, 5, 0.5) 50%,
		rgba(5, 5, 5, 0.95) 100%
	) !important;
}

/* ==========================================================================
   5c. Image Glow Effect
   ========================================================================== */

.nw-image-glow img {
	border-radius: 12px;
	box-shadow:
		0 8px 40px rgba(255, 107, 53, 0.15),
		0 0 80px rgba(255, 107, 53, 0.08);
	transition: box-shadow 0.6s ease, transform 0.6s ease;
}

.nw-image-glow:hover img {
	box-shadow:
		0 12px 60px rgba(255, 107, 53, 0.25),
		0 0 120px rgba(255, 107, 53, 0.12);
	transform: translateY(-4px);
}

.nw-image-glow figure,
figure.nw-image-glow {
	overflow: visible !important;
}

/* About section image column */
.nw-about-image {
	display: flex;
	align-items: center;
}

.nw-about-image img {
	width: 100%;
	height: auto;
	border-radius: 12px;
	object-fit: cover;
}

/* ==========================================================================
   6. Content Sections
   ========================================================================== */

.nw-section,
.nw-section.wp-block-group {
	padding: var(--nw-section-gap) 2rem !important;
	position: relative;
}

/* Inner content constraint */
.nw-section > .wp-block-group__inner-container,
.nw-section > div {
	max-width: var(--nw-content-width);
	margin: 0 auto;
}

/* Section with subtle background variation */
.nw-section--alt {
	background: var(--nw-bg-secondary);
}

/* Section label (small uppercase text above title) */
.nw-section__label,
.nw-label {
	font-size: 0.7rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.3em !important;
	text-transform: uppercase !important;
	color: var(--nw-accent) !important;
	margin-bottom: 1rem !important;
	display: block;
}

/* Section title */
.nw-section__title,
.nw-section .wp-block-heading {
	margin-bottom: 1.5rem !important;
}

/* Separator / divider */
.nw-section__divider,
.wp-block-separator {
	border-color: var(--nw-border) !important;
	opacity: 1;
	margin: 0 !important;
}

/* ==========================================================================
   7. Cards — Glowing Borders, Hover Effects
   ========================================================================== */

.nw-card,
.nw-card.wp-block-column {
	background: var(--nw-bg-card) !important;
	border: 1px solid var(--nw-border) !important;
	border-radius: 12px !important;
	padding: 2.5rem 2rem !important;
	position: relative;
	overflow: hidden;
	transition: border-color 0.4s ease, transform 0.4s ease, box-shadow 0.4s ease !important;
}

/* Gradient shine on cards */
.nw-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(255, 107, 53, 0.3), transparent);
	opacity: 0;
	transition: opacity 0.4s ease;
}

.nw-card:hover::before {
	opacity: 1;
}

.nw-card:hover {
	border-color: var(--nw-border-accent) !important;
	transform: translateY(-4px);
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3), 0 0 60px var(--nw-accent-glow);
}

/* Card icon/emoji */
.nw-card__icon {
	font-size: 2.5rem;
	margin-bottom: 1.5rem;
	display: block;
}

/* Card title */
.nw-card h3,
.nw-card .wp-block-heading {
	font-size: 1.4rem !important;
	font-weight: 700 !important;
	margin-bottom: 0.75rem !important;
	color: var(--nw-text-primary) !important;
}

/* Card text */
.nw-card p {
	color: var(--nw-text-secondary) !important;
	font-size: 0.95rem !important;
	line-height: 1.65 !important;
}

/* Card grid / columns */
.nw-card-grid,
.nw-card-grid.wp-block-columns {
	gap: 1.5rem !important;
}

.nw-card-grid > .wp-block-column {
	margin-left: 0 !important;
}

/* ==========================================================================
   8. Buttons (Global)
   ========================================================================== */

.wp-block-button .wp-block-button__link {
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	font-size: 0.85rem;
	border-radius: 6px;
	transition: all var(--nw-transition);
	padding: 0.9rem 2rem;
}

/* Kadence button backgrounds */
.wp-block-button:not(.is-style-outline) .wp-block-button__link {
	background: var(--nw-accent) !important;
	color: #ffffff !important;
	border: none !important;
	box-shadow: 0 2px 12px var(--nw-accent-glow);
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
	background: var(--nw-accent-light) !important;
	box-shadow: 0 4px 20px var(--nw-accent-glow-strong) !important;
	transform: translateY(-1px);
}

.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent !important;
	color: var(--nw-text-primary) !important;
	border: 1px solid var(--nw-border-hover) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	border-color: var(--nw-accent) !important;
	color: var(--nw-accent) !important;
	background: rgba(255, 107, 53, 0.05) !important;
}

/* ==========================================================================
   9. Social Links
   ========================================================================== */

.nw-socials {
	display: flex;
	gap: 1.5rem;
	align-items: center;
}

.nw-socials a {
	color: var(--nw-text-muted);
	font-size: 1.2rem;
	transition: color var(--nw-transition), transform var(--nw-transition);
}

.nw-socials a:hover {
	color: var(--nw-accent);
	transform: translateY(-2px);
}

.nw-social-list {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 2rem;
	list-style: none;
	padding: 0;
	margin: 0;
}

.nw-social-list a {
	font-size: 0.85rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--nw-text-muted);
	transition: color var(--nw-transition);
}

.nw-social-list a:hover {
	color: var(--nw-accent);
}

/* ==========================================================================
   10. Music / DJ Section
   ========================================================================== */

.nw-music-embed {
	background: var(--nw-bg-secondary);
	border: 1px solid var(--nw-border);
	border-radius: 12px;
	overflow: hidden;
	margin-bottom: 1.5rem;
}

.nw-music-embed iframe {
	display: block;
	width: 100%;
	border: none;
}

.nw-event-item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 1.5rem 0;
	border-bottom: 1px solid var(--nw-border);
	transition: padding-left var(--nw-transition);
}

.nw-event-item:hover {
	padding-left: 1rem;
}

.nw-event-item__date {
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--nw-accent);
	min-width: 120px;
}

.nw-event-item__venue {
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--nw-text-primary);
	flex: 1;
}

.nw-event-item__location {
	font-size: 0.85rem;
	color: var(--nw-text-secondary);
}

/* ==========================================================================
   11. About / Bio Section
   ========================================================================== */

.nw-bio {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4rem;
	align-items: start;
}

.nw-bio__image {
	border-radius: 8px;
	overflow: hidden;
	aspect-ratio: 3/4;
	position: relative;
}

.nw-bio__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: grayscale(20%);
	transition: filter var(--nw-transition-slow);
}

.nw-bio__image:hover img {
	filter: grayscale(0%);
}

/* ==========================================================================
   12. Tech / Skills
   ========================================================================== */

.nw-skill-tag {
	display: inline-block;
	padding: 0.4rem 1rem;
	background: var(--nw-bg-tertiary);
	border: 1px solid var(--nw-border);
	border-radius: 100px;
	font-size: 0.8rem;
	font-weight: 500;
	color: var(--nw-text-secondary);
	letter-spacing: 0.05em;
	margin: 0.25rem;
	transition: all var(--nw-transition);
}

.nw-skill-tag:hover {
	border-color: var(--nw-accent);
	color: var(--nw-accent);
}

/* ==========================================================================
   13. Contact Section
   ========================================================================== */

.nw-contact-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4rem;
}

/* Form fields */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
textarea,
select {
	background: var(--nw-bg-secondary) !important;
	border: 1px solid var(--nw-border) !important;
	color: var(--nw-text-primary) !important;
	padding: 0.9rem 1rem;
	border-radius: 6px;
	font-family: var(--nw-font-body);
	font-size: 0.95rem;
	transition: border-color var(--nw-transition);
	width: 100%;
}

input:focus,
textarea:focus,
select:focus {
	border-color: var(--nw-accent) !important;
	outline: none;
	box-shadow: 0 0 0 3px var(--nw-accent-glow);
}

input::placeholder,
textarea::placeholder {
	color: var(--nw-text-muted);
}

label {
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--nw-text-secondary);
	display: block;
	margin-bottom: 0.5rem;
}

/* ==========================================================================
   14. Footer
   ========================================================================== */

.site-footer,
footer.site-footer {
	background: var(--nw-bg-primary) !important;
	border-top: 1px solid var(--nw-border) !important;
	padding: 3rem 2rem !important;
}

.site-footer,
.site-footer a,
.site-footer p,
.site-footer .footer-widget-area,
.footer-navigation a {
	color: var(--nw-text-muted) !important;
	font-size: 0.85rem;
}

.site-footer a:hover,
.footer-navigation a:hover {
	color: var(--nw-accent) !important;
}

.footer-navigation a {
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* ==========================================================================
   15. Kadence Block Overrides — Deep
   ========================================================================== */

/* Remove ALL Kadence content backgrounds */
.entry-content,
.site-container,
.site-main,
.content-wrap,
.site-container .site-inner-wrap,
.content-style-unboxed .entry-content {
	background: transparent !important;
}

/* Group blocks */
.wp-block-group {
	background: transparent;
}

/* Columns */
.wp-block-columns {
	gap: 1.5rem;
}

/* Kadence row layouts */
.wp-block-kadence-rowlayout {
	background: transparent;
}

/* Separator */
.wp-block-separator {
	border-color: var(--nw-border) !important;
	opacity: 1;
}

/* Quote */
.wp-block-quote {
	border-left: 3px solid var(--nw-accent);
	color: var(--nw-text-secondary);
	padding-left: 1.5rem;
}

.wp-block-quote cite {
	color: var(--nw-text-muted);
	font-size: 0.85rem;
}

/* Code */
.wp-block-code,
pre {
	background: var(--nw-bg-secondary) !important;
	border: 1px solid var(--nw-border);
	color: var(--nw-text-primary);
	font-family: var(--nw-font-mono);
	border-radius: 8px;
	padding: 1.5rem;
}

code {
	font-family: var(--nw-font-mono);
	background: var(--nw-bg-tertiary);
	padding: 0.15em 0.4em;
	border-radius: 4px;
	font-size: 0.9em;
}

/* Table */
.wp-block-table table {
	border-color: var(--nw-border);
}

.wp-block-table td,
.wp-block-table th {
	border-color: var(--nw-border);
	color: var(--nw-text-secondary);
	padding: 0.75rem 1rem;
}

.wp-block-table th {
	color: var(--nw-text-primary);
	font-weight: 600;
}

/* ==========================================================================
   16. Stats / Numbers Section
   ========================================================================== */

.nw-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 3rem;
	text-align: center;
	padding: 4rem 0;
	border-top: 1px solid var(--nw-border);
	border-bottom: 1px solid var(--nw-border);
}

.nw-stat__number {
	font-size: clamp(2.5rem, 5vw, 4rem);
	font-weight: 800;
	color: var(--nw-accent);
	letter-spacing: -0.03em;
	line-height: 1;
	margin-bottom: 0.5rem;
}

.nw-stat__label {
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--nw-text-muted);
}

/* ==========================================================================
   17. Scroll Animations (Fade-in)
   ========================================================================== */

.nw-fade-in {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.8s ease, transform 0.8s ease;
}

.nw-fade-in.is-visible {
	opacity: 1;
	transform: translateY(0);
}

/* Stagger children */
.nw-fade-in .nw-card:nth-child(1) { transition-delay: 0s; }
.nw-fade-in .nw-card:nth-child(2) { transition-delay: 0.15s; }
.nw-fade-in .nw-card:nth-child(3) { transition-delay: 0.3s; }
.nw-fade-in .nw-card:nth-child(4) { transition-delay: 0.45s; }

/* ==========================================================================
   18. Scrollbar
   ========================================================================== */

::-webkit-scrollbar {
	width: 6px;
}

::-webkit-scrollbar-track {
	background: var(--nw-bg-primary);
}

::-webkit-scrollbar-thumb {
	background: var(--nw-bg-tertiary);
	border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
	background: var(--nw-text-muted);
}

/* Firefox */
html {
	scrollbar-width: thin;
	scrollbar-color: var(--nw-bg-tertiary) var(--nw-bg-primary);
}

/* ==========================================================================
   19. Utilities
   ========================================================================== */

.nw-text-center { text-align: center; }
.nw-text-left { text-align: left; }
.nw-text-accent { color: var(--nw-accent) !important; }
.nw-text-muted { color: var(--nw-text-muted) !important; }
.nw-mt-0 { margin-top: 0 !important; }
.nw-mb-0 { margin-bottom: 0 !important; }
.nw-hidden { display: none !important; }

/* Accent line decoration */
.nw-accent-line {
	display: inline-block;
	width: 40px;
	height: 2px;
	background: var(--nw-accent);
	margin-bottom: 1.5rem;
}

/* Grid layouts */
.nw-grid {
	display: grid;
	gap: 1.5rem;
}

.nw-grid--2 { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.nw-grid--3 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }

/* ==========================================================================
   20. Responsive — Tablet (max-width: 1024px)
   ========================================================================== */

@media (max-width: 1024px) {
	.nw-hero h1,
	.nw-hero .nw-hero__title,
	h1.nw-hero__title {
		font-size: clamp(3rem, 10vw, 6rem) !important;
	}

	.nw-bio {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.nw-contact-grid {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	/* About two-column → stack on tablet */
	.nw-section .wp-block-columns:has(.nw-about-image) {
		flex-direction: column !important;
	}

	.nw-section .wp-block-columns:has(.nw-about-image) > .wp-block-column {
		flex-basis: 100% !important;
	}

	.nw-about-image {
		max-width: 560px;
		margin: 0 auto 2rem;
	}
}

/* ==========================================================================
   21. Responsive — Mobile (max-width: 768px)
   ========================================================================== */

@media (max-width: 768px) {
	:root {
		--nw-section-gap: clamp(3rem, 8vw, 5rem);
	}

	.nw-hero,
	.nw-hero.wp-block-group {
		padding: 1.5rem !important;
	}

	/* Cover hero on mobile — center text */
	.wp-block-cover.nw-hero .nw-hero__content {
		text-align: center;
	}

	.wp-block-cover.nw-hero .wp-block-buttons {
		justify-content: center !important;
	}

	.nw-hero h1,
	.nw-hero .nw-hero__title,
	h1.nw-hero__title {
		font-size: clamp(2.5rem, 12vw, 4.5rem) !important;
	}

	.nw-hero .nw-hero__subtitle,
	.nw-hero p.nw-hero__subtitle {
		letter-spacing: 0.12em !important;
		font-size: 0.8rem !important;
	}

	.nw-hero .wp-block-buttons {
		flex-direction: column !important;
		width: 100%;
		max-width: 320px;
	}

	.nw-hero .wp-block-button {
		width: 100%;
	}

	.nw-hero .wp-block-button__link {
		width: 100% !important;
		justify-content: center;
	}

	.nw-card-grid,
	.nw-card-grid.wp-block-columns {
		flex-direction: column !important;
	}

	.nw-card-grid > .wp-block-column {
		flex-basis: 100% !important;
	}

	.nw-card,
	.nw-card.wp-block-column {
		padding: 2rem 1.5rem !important;
	}

	.nw-section {
		padding-left: 1.25rem !important;
		padding-right: 1.25rem !important;
	}

	.nw-stats {
		grid-template-columns: repeat(2, 1fr);
		gap: 2rem;
	}
}

/* ==========================================================================
   22. Responsive — Small Mobile (max-width: 480px)
   ========================================================================== */

@media (max-width: 480px) {
	.nw-hero h1,
	.nw-hero .nw-hero__title,
	h1.nw-hero__title {
		font-size: 2.5rem !important;
	}

	.nw-stats {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   23. Print
   ========================================================================== */

@media print {
	body { background: #fff !important; color: #000 !important; }
	.site-header, .site-footer, .nw-hero::before, .nw-hero::after { display: none; }
	a { color: #000 !important; text-decoration: underline; }
	.nw-card { border-color: #ccc !important; box-shadow: none !important; }
}
