/*
Theme Name: Twenty Twenty-Five WHC
Theme URI: https://willhenrycreative.com
Description: Child theme for custom Will Henry Creative portfolio design and templates.
Author: Will Henry
Template: twentytwentyfive
Version: 1.0.0
Text Domain: twentytwentyfive-whc
*/

@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,700&family=Space+Grotesk:wght@400;500;600;700&display=swap");

/* Dark mode override */
:root {
	--site-bg: #0c1118;
	--site-surface: #141b24;
	--site-border: #273447;
	--site-text: #e5ebf3;
	--site-muted: #a6b4c7;
	--site-link: #5fe087;
	--site-link-hover: #98f0b4;
}

html,
body,
.wp-site-blocks {
	background: var(--site-bg) !important;
	color: var(--site-text) !important;
}

.wp-site-blocks a {
	color: var(--site-link) !important;
}

.wp-site-blocks a:hover,
.wp-site-blocks a:focus {
	color: var(--site-link-hover) !important;
}

.wp-site-blocks p,
.wp-site-blocks li,
.wp-site-blocks blockquote,
.wp-site-blocks figcaption {
	color: var(--site-text) !important;
}

.wp-site-blocks :is(h1, h2, h3, h4, h5, h6) {
	color: #f5f8fc !important;
}

.wp-site-blocks :is(input, textarea, select, button) {
	background: var(--site-surface) !important;
	border: 1px solid var(--site-border) !important;
	color: var(--site-text) !important;
}

.wp-site-blocks .wp-block-button__link {
	background: #2f9e4d !important;
	color: #ffffff !important;
}

.wp-site-blocks .wp-block-button__link:hover {
	background: #3bb65c !important;
}

.wp-site-blocks :is(table, th, td) {
	border-color: var(--site-border) !important;
}

.wp-site-blocks pre,
.wp-site-blocks code {
	background: #101722 !important;
	color: #d4deea !important;
}

/* Force green accents across Gutenberg/global styles */
:root {
	--wp--preset--color--accent: #5fe087 !important;
	--wp--preset--color--accent-2: #98f0b4 !important;
	--wp--style--color--link: #5fe087 !important;
}

a:where(:not(.wp-element-button)),
.wp-site-blocks a,
.wp-block-navigation a {
	color: #5fe087 !important;
}

a:where(:not(.wp-element-button)):hover,
.wp-site-blocks a:hover,
.wp-block-navigation a:hover {
	color: #98f0b4 !important;
}

.wp-element-button,
.wp-block-button__link,
button,
input[type="submit"] {
	background-color: #2f9e4d !important;
	border-color: #2f9e4d !important;
	color: #ffffff !important;
}

.wp-element-button:hover,
.wp-block-button__link:hover,
button:hover,
input[type="submit"]:hover {
	background-color: #3bb65c !important;
	border-color: #3bb65c !important;
}

/* Portfolio visual system */
:root {
	--whc-bg-0: #070b14;
	--whc-bg-1: #0b1322;
	--whc-surface: #0f1a2c;
	--whc-surface-2: #111f35;
	--whc-border: #304968;
	--whc-text: #eaf1fb;
	--whc-text-muted: #9eb1cc;
	--whc-accent: #4fe08a;
	--whc-accent-2: #93ffc2;
}

html,
body,
.wp-site-blocks {
	background:
		radial-gradient(900px 520px at 78% 12%, rgba(79, 224, 138, 0.14), transparent 62%),
		radial-gradient(820px 460px at 8% 20%, rgba(60, 120, 220, 0.13), transparent 68%),
		linear-gradient(180deg, #08111f 0%, #050b16 76%) !important;
	color: var(--whc-text) !important;
	font-family: "Space Grotesk", "Segoe UI", sans-serif !important;
}

.wp-site-blocks {
	position: relative;
}

.wp-site-blocks::before {
	content: none;
}

.wp-site-blocks :is(h1, h2, h3, h4) {
	font-family: "Fraunces", Georgia, serif !important;
	font-weight: 700 !important;
	letter-spacing: -0.01em;
	line-height: 1.08;
}

.wp-site-blocks h1 {
	font-size: clamp(2.15rem, 4.2vw, 4.05rem) !important;
	max-width: 15ch;
	line-height: 1.03;
}

.wp-site-blocks h2 {
	font-size: clamp(1.6rem, 3.2vw, 2.5rem) !important;
}

.wp-site-blocks p {
	color: var(--whc-text-muted) !important;
	font-size: clamp(1rem, 1.02vw, 1.1rem);
	line-height: 1.62;
}

/* Header */
.wp-site-blocks > .wp-block-group.alignfull:first-child {
	position: sticky;
	top: 0;
	z-index: 30;
	background: rgba(7, 11, 20, 0.82);
	backdrop-filter: blur(12px);
	border-bottom: 1px solid rgba(79, 224, 138, 0.14);
}

.wp-block-site-title a {
	font-size: clamp(1.6rem, 2.5vw, 2.3rem);
	font-weight: 700;
	letter-spacing: -0.02em;
}

.wp-block-navigation .wp-block-navigation-item__content {
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 0.84rem;
	color: #d2e4fb !important;
}

.wp-block-navigation .wp-block-navigation-item__content:hover {
	color: var(--whc-accent-2) !important;
}

.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content,
.wp-block-navigation .current-menu-ancestor > .wp-block-navigation-item__content {
	color: #e9fff3 !important;
	text-decoration: underline;
	text-underline-offset: 0.35em;
	text-decoration-thickness: 1px;
}

/* Main rhythm */
.whc-front-page {
	position: relative;
	z-index: 1;
	padding-left: clamp(1rem, 3vw, 2rem);
	padding-right: clamp(1rem, 3vw, 2rem);
	display: grid;
	gap: clamp(1.6rem, 3.2vw, 2.65rem);
}

.whc-hero {
	position: relative;
	max-width: 70rem;
	margin: 0 auto;
}

.whc-hero::after {
	content: "";
	position: absolute;
	width: min(34vw, 300px);
	height: min(34vw, 300px);
	right: 6%;
	top: 4%;
	background: radial-gradient(circle, rgba(147, 255, 194, 0.2) 0%, rgba(147, 255, 194, 0.01) 72%);
	filter: blur(10px);
	z-index: -1;
}

.whc-hero > p.has-small-font-size {
	color: var(--whc-accent-2) !important;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	font-size: 0.78rem !important;
	font-weight: 600;
}

.whc-hero-subhead {
	max-width: 46ch;
	font-size: clamp(1.02rem, 1.32vw, 1.18rem) !important;
	color: #d7e8ff !important;
	line-height: 1.48;
	margin-bottom: 0.1rem;
}

.whc-feature-stack {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: clamp(1rem, 2vw, 1.35rem);
}

.whc-feature-section {
	display: grid;
	gap: clamp(0.85rem, 1.6vw, 1.25rem);
	padding: clamp(0.9rem, 1.4vw, 1.2rem);
	border: 1px solid rgba(85, 126, 170, 0.2);
	border-radius: 14px;
	background: linear-gradient(180deg, rgba(12, 21, 35, 0.45), rgba(12, 21, 35, 0.2));
	grid-column: span 4;
}

.whc-feature-section > .wp-block-heading {
	font-size: clamp(1.25rem, 2.2vw, 1.8rem) !important;
	letter-spacing: -0.01em;
}

/* Cards and CTA bands */
.whc-case-card,
.whc-cta-band {
	background: linear-gradient(160deg, rgba(17, 31, 53, 0.9), rgba(14, 25, 43, 0.95));
	border: 1px solid var(--whc-border) !important;
	border-radius: 14px;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 10px 24px rgba(0, 0, 0, 0.22);
	transition: transform 200ms ease, border-color 200ms ease, box-shadow 200ms ease;
}

.whc-case-card:hover,
.whc-cta-band:hover {
	transform: translateY(-3px);
	border-color: rgba(147, 255, 194, 0.55) !important;
	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.3);
}

.whc-case-card > p.has-small-font-size {
	display: inline-flex;
	width: fit-content;
	font-size: 0.7rem !important;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-weight: 700;
	color: #c8ffe0 !important;
	background: rgba(80, 186, 129, 0.2);
	border: 1px solid rgba(147, 255, 194, 0.35);
	padding: 0.32rem 0.58rem;
	border-radius: 999px;
}

.whc-case-card .wp-block-heading {
	margin-top: 0.25rem;
}

.whc-case-card .wp-block-buttons {
	margin-top: 0.45rem;
}

.whc-cta-band {
	grid-column: 1 / -1;
	margin-top: 0.2rem;
}

/* Buttons */
.wp-site-blocks .wp-block-button__link {
	background: linear-gradient(135deg, #34b866, #2a9e56) !important;
	border: 1px solid rgba(147, 255, 194, 0.35) !important;
	border-radius: 999px !important;
	padding: 0.84rem 1.35rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.01em;
}

.wp-site-blocks .wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent !important;
	color: #c9ffdf !important;
	border: 1px solid rgba(147, 255, 194, 0.5) !important;
}

.wp-site-blocks .wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: rgba(79, 224, 138, 0.15) !important;
}

/* Footer */
.whc-site-footer {
	margin-top: clamp(3rem, 7vw, 5rem);
	border-top: 1px solid rgba(79, 224, 138, 0.18);
	background: rgba(5, 10, 19, 0.65);
}

.whc-site-footer__tagline {
	font-size: 0.95rem !important;
	letter-spacing: 0.02em;
}

@media (max-width: 900px) {
	.whc-front-page {
		gap: clamp(1.5rem, 5vw, 2.4rem);
	}

	.whc-feature-stack {
		grid-template-columns: 1fr;
	}

	.whc-feature-section {
		padding: 0.9rem;
		grid-column: 1 / -1;
	}

	.whc-case-card,
	.whc-cta-band {
		border-radius: 14px;
	}
}

@media (max-width: 600px) {
	.wp-block-navigation .wp-block-navigation-item__content {
		letter-spacing: 0.04em;
		font-size: 0.78rem;
	}

	.whc-hero::after {
		width: 220px;
		height: 220px;
		right: -8%;
		top: 8%;
	}

	.whc-case-card .wp-block-button__link,
	.whc-cta-band .wp-block-button__link {
		width: 100%;
		text-align: center;
		padding-top: 0.95rem !important;
		padding-bottom: 0.95rem !important;
	}
}
