/*
Theme Name: Humans are in Control (storeforge)
Theme URI: https://humansareincontrol.com/
Description: Block child theme of Twenty Twenty-Five generated by storeforge for Humans are in Control. Colours and fonts come from store.yaml theme tokens; regenerate with `storeforge recipe humans`.
Author: storeforge
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Text Domain: humans-theme
*/

/* Azulejo-style tile band used in header/footer (class sf-tile-band). */
.sf-tile-band {
	height: 14px;
	background-color: var(--wp--preset--color--cobalt);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='14' viewBox='0 0 28 14'%3E%3Cpath d='M0 7 L7 0 L14 7 L7 14Z' fill='%23FBF7EE'/%3E%3Ccircle cx='21' cy='7' r='3' fill='%23F2C14E'/%3E%3C/svg%3E");
	background-size: 28px 14px;
	background-repeat: repeat-x;
}

.sf-hero {
	background:
		radial-gradient(circle at 20% 20%, color-mix(in srgb, var(--wp--preset--color--cobalt) 70%, transparent) 0, transparent 55%),
		var(--wp--preset--color--deep-cobalt);
}
.sf-hero .wp-block-heading { letter-spacing: 0.01em; }

.sf-template-note {
	border-left: 4px solid var(--wp--preset--color--gold);
	padding: 0.75rem 1rem;
	background: color-mix(in srgb, var(--wp--preset--color--gold) 8%, transparent);
	font-size: 0.95em;
}

/* WooCommerce touches */
.woocommerce ul.products li.product .price,
.wc-block-components-product-price { color: var(--wp--preset--color--wine); font-weight: 600; }
.woocommerce span.onsale { background: var(--wp--preset--color--wine); }
.woocommerce ul.products li.product a img { border-radius: 6px; }

/* ── synthwave style (templates/styles/synthwave) ─────────────────────────
   Neon on night: Monoton (neon tube), Orbitron (headings), Exo 2 (body),
   VT323 (system notices). Sunset sun, wireframe mountains, palms, tron grid. */
:root {
	--hic-night: #0A0318;
	--hic-indigo: #1B0B3B;
	--hic-violet: #3A136B;
	--hic-magenta: #FF2BD6;
	--hic-cyan: #20E3FF;
	--hic-sunset: #FF7A3D;
	--hic-sun: #FFD23F;
	--hic-chrome: #EDE6FF;
	--hic-haze: #A898D6;
	--hic-glow-m: 0 0 4px #fff3, 0 0 10px var(--hic-magenta), 0 0 24px var(--hic-magenta), 0 0 48px color-mix(in srgb, var(--hic-magenta) 60%, transparent);
	--hic-glow-c: 0 0 4px #fff3, 0 0 10px var(--hic-cyan), 0 0 26px color-mix(in srgb, var(--hic-cyan) 70%, transparent);
	--hic-display: "Monoton", "Orbitron", system-ui, sans-serif;
	--hic-head: "Orbitron", system-ui, sans-serif;
	--hic-mono: "VT323", ui-monospace, monospace;
}

body {
	background:
		radial-gradient(ellipse 120% 60% at 50% 0%, color-mix(in srgb, var(--hic-violet) 55%, transparent), transparent 70%),
		var(--hic-night);
	color: var(--hic-chrome);
}
::selection { background: var(--hic-magenta); color: var(--hic-night); }

h1, h2, h3, h4, h5, h6, .wp-block-heading, .wp-block-post-title {
	font-family: var(--hic-head);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--hic-chrome);
}
h1, .wp-block-post-title { text-shadow: var(--hic-glow-m); }
h2 { color: var(--hic-cyan); text-shadow: var(--hic-glow-c); }
a { text-underline-offset: 3px; }
a:hover { text-shadow: var(--hic-glow-c); }

.wp-element-button, .wp-block-button__link, .wc-block-components-button:not(.is-link),
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button {
	font-family: var(--hic-head) !important;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-size: 0.85rem;
	border-radius: 2px !important;
	background: color-mix(in srgb, var(--hic-night) 78%, transparent) !important;
	color: var(--hic-chrome) !important;
	border: 2px solid var(--hic-magenta) !important;
	backdrop-filter: blur(3px);
	box-shadow: 0 0 12px color-mix(in srgb, var(--hic-magenta) 55%, transparent), inset 0 0 12px color-mix(in srgb, var(--hic-magenta) 35%, transparent);
	transition: background .2s, box-shadow .2s, color .2s;
}
.wp-element-button:hover, .wp-block-button__link:hover, .wc-block-components-button:not(.is-link):hover,
.woocommerce a.button:hover, .woocommerce button.button:hover {
	background: var(--hic-magenta) !important;
	color: var(--hic-night) !important;
	box-shadow: 0 0 22px var(--hic-magenta), 0 0 60px color-mix(in srgb, var(--hic-magenta) 50%, transparent);
	text-shadow: none;
}
.hic-btn-cyan .wp-block-button__link { border-color: var(--hic-cyan) !important;
	box-shadow: 0 0 12px color-mix(in srgb, var(--hic-cyan) 55%, transparent), inset 0 0 12px color-mix(in srgb, var(--hic-cyan) 30%, transparent); }
.hic-btn-cyan .wp-block-button__link:hover { background: var(--hic-cyan) !important; box-shadow: 0 0 22px var(--hic-cyan); }

/* ── system ticker ─────────────────────────────────────────────────────── */
.hic-ticker {
	overflow: hidden; white-space: nowrap;
	background: #000; color: var(--hic-cyan);
	font-family: var(--hic-mono); font-size: 1.15rem; line-height: 1.9;
	border-bottom: 1px solid color-mix(in srgb, var(--hic-cyan) 45%, transparent);
	text-shadow: 0 0 6px var(--hic-cyan);
}
.hic-ticker__track { display: inline-block; animation: hic-ticker 60s linear infinite; padding-left: 100%; }
.hic-ticker b { color: var(--hic-magenta); font-weight: normal; text-shadow: 0 0 6px var(--hic-magenta); }
@keyframes hic-ticker { to { transform: translateX(-100%); } }

/* ── header ───────────────────────────────────────────────────────────── */
.hic-header {
	background: linear-gradient(to bottom, #000c, transparent);
	border-bottom: 1px solid color-mix(in srgb, var(--hic-magenta) 40%, transparent);
	box-shadow: 0 1px 18px color-mix(in srgb, var(--hic-magenta) 25%, transparent);
}
.hic-header .wp-block-site-title, .hic-header .wp-block-site-title a {
	font-family: var(--hic-display) !important; font-weight: 400 !important;
	color: #ffe4fb !important; text-decoration: none; text-transform: uppercase;
	text-shadow: var(--hic-glow-m); letter-spacing: 0.04em; word-spacing: .3em;
	animation: hic-flicker 7s infinite;
}
.hic-header .wp-block-site-tagline {
	font-family: var(--hic-mono); font-size: 1.05rem !important; color: var(--hic-cyan);
	letter-spacing: 0.08em; text-shadow: 0 0 6px var(--hic-cyan);
}
.hic-header .wp-block-navigation { font-family: var(--hic-head); text-transform: uppercase; letter-spacing: 0.14em; font-size: 0.82rem !important; }
.hic-header .wp-block-navigation a { color: var(--hic-chrome); }
.hic-header .wp-block-navigation a:hover { color: var(--hic-cyan); }
.hic-header svg { fill: var(--hic-chrome); }
.wp-block-navigation__responsive-container.is-menu-open { background: var(--hic-night) !important; color: var(--hic-chrome) !important; }

@keyframes hic-flicker {
	0%, 18%, 20%, 52%, 54%, 100% { opacity: 1; }
	19%, 53% { opacity: 0.55; }
}

/* ── front page ───────────────────────────────────────────────────────── */
.home main .wp-block-post-content > * { margin-block-start: 0; }
.hic-hero {
	position: relative; overflow: hidden; isolation: isolate;
	min-height: min(92vh, 860px);
	display: grid; place-items: start center;
	padding: clamp(3rem, 8vh, 6rem) 16px 0;
	background: linear-gradient(to bottom, #07021a 0%, #1b0b3b 28%, #5a1670 52%, #c2306e 64%, #ff7a3d 70%, #07021a 70.2%);
	text-align: center;
}
.hic-stars { position: absolute; inset: 0 0 35% 0; z-index: -3;
	background-image:
		radial-gradient(1px 1px at 12% 18%, #fff, transparent), radial-gradient(1px 1px at 28% 42%, #fffa, transparent),
		radial-gradient(1.5px 1.5px at 44% 12%, #fff, transparent), radial-gradient(1px 1px at 61% 30%, #fff9, transparent),
		radial-gradient(1px 1px at 77% 9%, #fff, transparent), radial-gradient(1.5px 1.5px at 88% 36%, #fffc, transparent),
		radial-gradient(1px 1px at 6% 52%, #fff8, transparent), radial-gradient(1px 1px at 93% 58%, #fff8, transparent);
	animation: hic-twinkle 5s ease-in-out infinite alternate; }
@keyframes hic-twinkle { to { opacity: 0.55; } }
.hic-sun {
	position: absolute; z-index: -2; left: 50%; bottom: 30%; translate: -50% 0;
	width: min(62vw, 520px); aspect-ratio: 1; border-radius: 50%;
	background: linear-gradient(to bottom, var(--hic-sun) 8%, var(--hic-sunset) 48%, var(--hic-magenta) 88%);
	box-shadow: 0 0 80px color-mix(in srgb, var(--hic-sunset) 60%, transparent), 0 0 200px color-mix(in srgb, var(--hic-magenta) 45%, transparent);
	-webkit-mask-image: linear-gradient(to bottom, #000 50%, transparent 50% 53%, #000 53% 61%, transparent 61% 65%, #000 65% 72%, transparent 72% 77%, #000 77% 83%, transparent 83% 89%, #000 89% 93%, transparent 93%);
	mask-image: linear-gradient(to bottom, #000 50%, transparent 50% 53%, #000 53% 61%, transparent 61% 65%, #000 65% 72%, transparent 72% 77%, #000 77% 83%, transparent 83% 89%, #000 89% 93%, transparent 93%);
}
.hic-mountains { position: absolute; z-index: -1; left: 0; right: 0; bottom: 30%; width: 100%; height: 22%; }
.hic-palm { position: absolute; z-index: 1; bottom: 26%; height: 62%; width: auto; filter: drop-shadow(0 0 6px #ff2bd655); }
.hic-palm--l { left: -2%; }
.hic-palm--l2 { left: 12%; height: 44%; bottom: 29%; opacity: .9; }
.hic-palm--r { right: -3%; transform: scaleX(-1); height: 70%; }
.hic-grid {
	position: absolute; z-index: 0; left: -50%; right: -50%; bottom: 0; height: 30%;
	perspective: 260px; perspective-origin: 50% 0;
	border-top: 2px solid var(--hic-magenta); box-shadow: 0 -2px 26px var(--hic-magenta);
}
.hic-grid::before {
	content: ""; position: absolute; inset: 0 0 -100% 0; transform-origin: 50% 0; transform: rotateX(62deg);
	background-image:
		linear-gradient(to right, color-mix(in srgb, var(--hic-magenta) 85%, transparent) 2px, transparent 2px),
		linear-gradient(to bottom, color-mix(in srgb, var(--hic-cyan) 75%, transparent) 2px, transparent 2px);
	background-size: 64px 64px;
	animation: hic-grid 1.6s linear infinite;
}
.hic-grid::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, #07021a 0%, transparent 45%); }
@keyframes hic-grid { to { background-position: 0 64px; } }
.hic-scan { position: absolute; inset: 0; z-index: 3; pointer-events: none;
	background: repeating-linear-gradient(to bottom, #0000 0 2px, #0003 2px 4px); mix-blend-mode: multiply; }

.hic-hero__copy { position: relative; z-index: 4; max-width: 980px; }
.hic-kicker { font-family: var(--hic-mono); color: var(--hic-cyan); font-size: clamp(1.05rem, 2.4vw, 1.4rem);
	letter-spacing: 0.22em; text-shadow: 0 0 8px var(--hic-cyan); margin: 0 0 1rem; }
.hic-title {
	font-family: var(--hic-display); font-weight: 400; text-transform: uppercase;
	font-size: clamp(2.3rem, 8.2vw, 6.4rem); line-height: 1.02; letter-spacing: 0.02em;
	color: #ffe4fb; text-shadow: var(--hic-glow-m); margin: 0;
	animation: hic-flicker 9s infinite;
}
.hic-title span { display: block; }
.hic-title .hic-c { color: #e0fbff; text-shadow: var(--hic-glow-c); }
.hic-calm { display: inline-block; padding: .5rem 1.4rem; border-radius: 6px;
	background: color-mix(in srgb, #07021a 72%, transparent); backdrop-filter: blur(4px);
	margin: 1.6rem auto 0; font-family: var(--hic-mono); font-size: clamp(1.3rem, 3vw, 1.9rem);
	color: var(--hic-chrome); text-shadow: 0 0 8px #fff8; line-height: 1.35; }
.hic-calm span { display: block; opacity: 0; animation: hic-in .9s ease forwards; }
.hic-calm span:nth-child(1) { animation-delay: .6s; }
.hic-calm span:nth-child(2) { animation-delay: 1.9s; }
.hic-calm span:nth-child(3) { animation-delay: 3.2s; color: var(--hic-sun); text-shadow: 0 0 10px var(--hic-sunset); }
@keyframes hic-in { from { opacity: 0; filter: blur(4px); } to { opacity: 1; filter: none; } }
.hic-cta { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; margin-top: 2rem; }

/* transmission (front-page video) */
.hic-band { position: relative; padding: clamp(3rem, 7vw, 5.5rem) 16px; }
.hic-band--dark { background: linear-gradient(to bottom, #07021a, var(--hic-indigo)); }
.hic-section-title { text-align: center; margin: 0 0 .4rem; }
.hic-sub { text-align: center; font-family: var(--hic-mono); color: var(--hic-haze); font-size: 1.25rem; margin: 0 0 2rem; letter-spacing: .08em; }
.hic-crt {
	position: relative; max-width: 960px; margin: 0 auto; aspect-ratio: 16 / 9;
	border-radius: 22px; padding: 14px; background: linear-gradient(145deg, #2a1650, #0c0420);
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--hic-cyan) 60%, transparent), 0 0 40px color-mix(in srgb, var(--hic-cyan) 35%, transparent), inset 0 0 30px #000;
}
.hic-crt video, .hic-crt .hic-static { display: block; width: 100%; height: 100%; border-radius: 12px; object-fit: cover; background: #000; }
.hic-crt::after { content: ""; position: absolute; inset: 14px; border-radius: 12px; pointer-events: none;
	background: repeating-linear-gradient(to bottom, #0000 0 2px, #0002 2px 3px), radial-gradient(ellipse at center, transparent 60%, #0008); }
.hic-static { display: grid !important; place-content: center; text-align: center; overflow: hidden; position: relative;
	background: repeating-radial-gradient(circle at 17% 32%, #fff1 0 1px, #0000 1px 3px), radial-gradient(ellipse at center, #1b0b3b, #000) !important; }
.hic-static::before { content: ""; position: absolute; inset: -50%; background: repeating-linear-gradient(0deg, #fff1 0 1px, #0000 1px 4px); animation: hic-roll 3s linear infinite; }
@keyframes hic-roll { to { transform: translateY(25%); } }
.hic-static p { position: relative; margin: .2rem 0; font-family: var(--hic-mono); color: var(--hic-cyan); font-size: clamp(1.2rem, 3vw, 2rem); text-shadow: 0 0 8px var(--hic-cyan); }
.hic-static p.hic-blink { color: var(--hic-magenta); text-shadow: 0 0 8px var(--hic-magenta); animation: hic-blink 1.2s steps(2) infinite; }
@keyframes hic-blink { 50% { opacity: 0; } }

/* public notices */
.hic-notices { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); max-width: 1180px; margin: 0 auto; }
.hic-notice { border: 1px solid color-mix(in srgb, var(--hic-cyan) 55%, transparent); background: color-mix(in srgb, var(--hic-indigo) 70%, transparent);
	padding: 1.4rem 1.4rem 1.2rem; border-radius: 4px; box-shadow: inset 0 0 24px color-mix(in srgb, var(--hic-cyan) 12%, transparent); }
.hic-notice small { display: block; font-family: var(--hic-mono); color: var(--hic-magenta); font-size: 1.1rem; letter-spacing: .14em; }
.hic-notice h3 { margin: .3rem 0 .6rem; font-size: 1.05rem; color: var(--hic-chrome); text-shadow: none; }
.hic-notice p { margin: 0; color: var(--hic-haze); }
.hic-fine { text-align: center; font-family: var(--hic-mono); color: var(--hic-haze); font-size: 1.05rem; margin-top: 2.2rem; }

/* products */
.hic-products { max-width: 1240px; margin: 0 auto; }
.woocommerce ul.products li.product, .wc-block-grid__product, .wc-block-product {
	background: color-mix(in srgb, var(--hic-indigo) 75%, transparent);
	border: 1px solid color-mix(in srgb, var(--hic-magenta) 45%, transparent);
	border-radius: 4px; padding: 12px !important; transition: box-shadow .2s, transform .2s;
}
.woocommerce ul.products li.product:hover, .wc-block-product:hover { box-shadow: 0 0 22px color-mix(in srgb, var(--hic-magenta) 55%, transparent); transform: translateY(-2px); }
.woocommerce ul.products li.product .woocommerce-loop-product__title, .wc-block-components-product-name {
	font-family: var(--hic-head); font-size: .9rem !important; letter-spacing: .06em; text-transform: uppercase; color: var(--hic-chrome); }
.woocommerce ul.products li.product .price, .wc-block-components-product-price, .woocommerce div.product p.price, .woocommerce div.product span.price {
	color: var(--hic-cyan) !important; font-family: var(--hic-mono); font-size: 1.35rem; text-shadow: 0 0 6px var(--hic-cyan); }
.woocommerce span.onsale { background: var(--hic-magenta); color: var(--hic-night); }
.woocommerce-info, .woocommerce-message, .wc-block-components-notice-banner {
	background: var(--hic-indigo) !important; color: var(--hic-chrome) !important; border-color: var(--hic-cyan) !important; }
input, select, textarea, .wc-block-components-text-input input, .wc-block-components-combobox input {
	background: #0006 !important; color: var(--hic-chrome) !important; border-color: color-mix(in srgb, var(--hic-cyan) 50%, transparent) !important; }
.wc-block-mini-cart__drawer .components-modal__content, .wc-block-mini-cart__drawer { background: var(--hic-night); color: var(--hic-chrome); }

/* footer */
.hic-footer { background: #000; border-top: 2px solid var(--hic-magenta); box-shadow: 0 -2px 24px color-mix(in srgb, var(--hic-magenta) 45%, transparent); }
.hic-footer .wp-block-site-title, .hic-footer .wp-block-site-title a { font-family: var(--hic-display) !important; font-weight: 400; text-transform: uppercase; color: #ffe4fb; text-shadow: var(--hic-glow-m); text-decoration: none; word-spacing: .35em; }
.hic-footer h4 { color: var(--hic-cyan) !important; text-shadow: none; font-size: .85rem !important; letter-spacing: .18em; }
.hic-footer a { color: var(--hic-chrome) !important; }
.hic-footer .hic-mono { font-family: var(--hic-mono); font-size: 1.1rem; color: var(--hic-haze); }
.hic-footer-grid { height: 70px; background-image: linear-gradient(to right, color-mix(in srgb, var(--hic-magenta) 70%, transparent) 1px, transparent 1px),
	linear-gradient(to bottom, color-mix(in srgb, var(--hic-cyan) 50%, transparent) 1px, transparent 1px);
	background-size: 40px 40px; -webkit-mask-image: linear-gradient(to bottom, transparent, #000); mask-image: linear-gradient(to bottom, transparent, #000); }

.sf-template-note { border-left-color: var(--hic-magenta); background: color-mix(in srgb, var(--hic-magenta) 10%, transparent); }

@media (max-width: 640px) {
	.hic-palm--l2 { display: none; }
	.hic-palm--l { left: -18%; height: 46%; }
	.hic-palm--r { right: -20%; height: 50%; }
	.hic-sun { width: 78vw; }
}
@media (prefers-reduced-motion: reduce) {
	.hic-ticker__track, .hic-grid::before, .hic-title, .hic-header .wp-block-site-title, .hic-stars, .hic-static::before, .hic-blink { animation: none !important; }
	.hic-ticker__track { padding-left: 0; }
	.hic-calm span { animation: none; opacity: 1; }
}