/*
Theme Name: Chapter Theme
Theme URI: https://example.com/chapter-theme
Author: Chapter
Author URI: https://example.com
Description: Chapter Theme is a GeneratePress child theme for the Chapter New Site project. Landing styles live in WindPress volumes (wp-content/uploads/windpress/data/).
Template: generatepress
Version: 1.1.0
Requires at least: 6.0
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: chapter-theme
Tags: custom-colors, custom-menu, custom-logo, featured-images, threaded-comments, translation-ready
*/

/* Landing component CSS is compiled by WindPress from
   wp-content/uploads/windpress/data/*.css — do not duplicate it here. */

/* Minimal page chrome for non-landing pages only. */
body {
	margin: 0;
}

/* Branded not-found page for routes outside the landing templates. */
.chapter-404 {
	--chapter-404-purple: var(--purple, #5E3895);
	--chapter-404-ink: var(--ink, #04081F);
	--chapter-404-muted: var(--muted, #6B6880);
	position: relative;
	display: grid;
	min-height: min(760px, 78vh);
	overflow: hidden;
	place-items: center;
	padding: clamp(56px, 8vw, 104px) var(--gutter, 24px);
	background:
		radial-gradient(ellipse at 18% 35%, rgba(218, 120, 176, .1), transparent 34%),
		radial-gradient(ellipse at 82% 65%, rgba(94, 56, 149, .09), transparent 36%),
		#fff;
	color: var(--chapter-404-ink);
}
.chapter-404__inner {
	display: grid;
	grid-template-columns: minmax(240px, .9fr) minmax(0, 1.1fr);
	align-items: center;
	gap: clamp(36px, 8vw, 112px);
	width: min(100%, 1080px);
	margin: 0 auto;
}
.chapter-404__visual {
	position: relative;
	display: grid;
	width: min(100%, 430px);
	aspect-ratio: 1;
	place-items: center;
	justify-self: center;
}
.chapter-404__code {
	position: relative;
	z-index: 1;
	font-size: clamp(7rem, 17vw, 13rem);
	font-weight: 700;
	letter-spacing: -.095em;
	line-height: 1;
	background: linear-gradient(135deg, #6A0BCA 8%, #A233B3 58%, #FF5C71 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.chapter-404__orbit {
	position: absolute;
	border: 1px solid rgba(94, 56, 149, .16);
	border-radius: 50%;
}
.chapter-404__orbit--outer {
	inset: 8%;
	transform: rotate(-24deg) scaleY(.58);
}
.chapter-404__orbit--inner {
	inset: 17%;
	border-color: rgba(218, 120, 176, .24);
	transform: rotate(28deg) scaleY(.57);
}
.chapter-404__spark {
	position: absolute;
	z-index: 2;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: #DA78B0;
	box-shadow: 0 0 0 7px rgba(218, 120, 176, .12), 0 0 28px rgba(218, 120, 176, .45);
}
.chapter-404__spark--one {
	top: 23%;
	right: 16%;
}
.chapter-404__spark--two {
	bottom: 23%;
	left: 13%;
	width: 8px;
	height: 8px;
	background: #6E69AF;
	box-shadow: 0 0 0 6px rgba(110, 105, 175, .12), 0 0 24px rgba(110, 105, 175, .35);
}
.chapter-404__copy {
	max-width: 560px;
}
.chapter-404__eyebrow {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--chapter-404-purple);
}
.chapter-404__eyebrow::before {
	width: 28px;
	height: 1px;
	background: linear-gradient(90deg, #7A3FD6, #DA78B0);
	content: "";
}
.chapter-404__copy h1 {
	margin: 18px 0 0;
	font-size: clamp(2.4rem, 4.5vw, 4rem);
	font-weight: 600;
	letter-spacing: -.055em;
	line-height: 1.08;
}
.chapter-404__message {
	max-width: 34em;
	margin: 18px 0 0;
	font-size: 1rem;
	line-height: 1.7;
	color: var(--chapter-404-muted);
}
.chapter-404__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 24px;
	margin-top: 28px;
}
.chapter-404__home {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-height: 52px;
	padding: 0 23px;
	border-radius: 999px;
	background: linear-gradient(100deg, #6A0BCA, #A233B3 68%, #FF5C71);
	color: #fff;
	font-size: .875rem;
	font-weight: 600;
	text-decoration: none;
	transition: transform .2s ease, box-shadow .2s ease;
}
.chapter-404__home:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px -14px rgba(94, 56, 149, .7);
	color: #fff;
}
.chapter-404__home svg {
	width: 18px;
	height: 18px;
}
.chapter-404__search {
	margin-top: 34px;
	padding-top: 22px;
	border-top: 1px solid #ECE4F5;
}
.chapter-404__search > p {
	margin: 0 0 12px;
	font-size: .8125rem;
	font-weight: 500;
	color: var(--chapter-404-muted);
}
.chapter-404__search .search-form {
	display: flex;
	max-width: 440px;
	gap: 8px;
}
.chapter-404__search .search-field {
	flex: 1 1 auto;
	width: 100%;
	min-width: 0;
	min-height: 48px;
	padding: 0 15px;
	border: 1px solid #E5DDED;
	border-radius: 8px;
	background: #fff;
	color: var(--chapter-404-ink);
	font: inherit;
}
.chapter-404__search .search-field:focus {
	border-color: var(--chapter-404-purple);
	outline: 2px solid rgba(94, 56, 149, .14);
	outline-offset: 1px;
}
.chapter-404__search .search-submit {
	min-height: 48px;
	padding: 0 18px;
	border: 0;
	border-radius: 8px;
	background: #F3EDF8;
	color: var(--chapter-404-purple);
	font: inherit;
	font-size: .875rem;
	font-weight: 600;
	cursor: pointer;
	transition: background .2s ease, color .2s ease;
}
.chapter-404__search .search-submit:hover {
	background: var(--chapter-404-purple);
	color: #fff;
}
@media (max-width: 760px) {
	.chapter-404 {
		min-height: auto;
		padding-block: 48px 64px;
	}
	.chapter-404__inner {
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
	}
	.chapter-404__visual {
		width: min(68vw, 290px);
	}
	.chapter-404__copy {
		margin: 0 auto;
	}
	.chapter-404__copy h1 {
		font-size: clamp(2.25rem, 9vw, 3.25rem);
	}
}
@media (max-width: 420px) {
	.chapter-404__search .search-form {
		flex-direction: column;
	}
	.chapter-404__search .search-submit {
		width: 100%;
	}
}
@media (prefers-reduced-motion: reduce) {
	.chapter-404__home,
	.chapter-404__search .search-submit {
		transition: none;
	}
}

/* Keep inline social SVGs compact and aligned even before WindPress rebuilds. */
.footer-b__social > a {
	display:inline-flex;
	align-items:center;
	gap:10px;
}
.footer-b__social {
	flex-wrap:nowrap;
}
.footer-b__social > a > svg {
	display:block;
	width:20px;
	height:20px;
	flex:0 0 20px;
}
@media (max-width:520px) {
	.footer-b__social { flex-wrap:wrap; }
}

/* ============================================================
   HERO BACKGROUND IMAGE (LCP)
   Kept out of WindPress so it survives volume regeneration.
   The <img> replaces the old inline CSS background, which lets
   the browser discover, preload and size the LCP resource.
   ============================================================ */
.hero__bg{
	position:absolute;
	inset:0;
	z-index:0;
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
	pointer-events:none;
}

/* ============================================================
   HERO OVERRIDES — intentionally kept in the theme, NOT in the
   WindPress volumes. WindPress re-writes ALL data/*.css volumes
   on every editor "Save", which has repeatedly reverted the hero
   pill sizing and copy spacing. These unlayered rules override
   WindPress' @layer output regardless of source order, so the
   hero stays correct even if a future volume regeneration drops
   the rules again. Keep in sync with data/hero.css.
   ============================================================ */
.hero__ctas{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:36px}
.hero__method{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:44px}
.hero__method span{margin-right:0}
.hero__method button{position:relative;isolation:isolate;display:grid;place-items:center;flex:none;box-sizing:border-box;width:30px;height:30px;padding:0;border:1px solid rgba(255,255,255,.3);border-radius:9px;color:#fff;background:rgba(255,255,255,.1);font-size:14px;font-weight:600;line-height:1;text-align:center;cursor:pointer;transition:background .25s,border-color .25s,box-shadow .25s}
.hero__method button:hover{border-color:transparent;background:rgba(255,255,255,.16);box-shadow:0 0 0 3px rgba(255,255,255,.1)}
.hero__method button:focus-visible{outline:2px solid var(--blush);outline-offset:3px}
.hero__rail button.pill-key-c247{display:grid;place-items:center;box-sizing:border-box;line-height:1;text-align:center}
.hero__rail button.pill-key-c247:hover{color:#fff;background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.85);box-shadow:0 0 0 3px rgba(255,255,255,.1)}
.hero__rail button.pill-key-c247.is-on:hover{color:var(--purple);background:#fff;border-color:#fff}

/* Shared animated gradient border for CTA and compact button controls. */
.btn,.connect__btn,.header__burger,.footer-switch button,.case-deck__arrow,.hero__method button {
	position:relative;
	isolation:isolate;
}
.btn::before,.connect__btn::before,.header__burger::before,
.footer-switch button::before,.case-deck__arrow::before,.hero__method button::before {
	content:"";
	position:absolute;
	inset:-2px;
	padding:2px;
	border-radius:inherit;
	background-image:linear-gradient(90deg,#7A1FFF 0%,#F44FAD 40.91%,#F0B535 68.99%,#EE2528 100%);
	background-size:300% 100%;
	background-position:0% 50%;
	-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
	-webkit-mask-composite:xor;
	mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
	mask-composite:exclude;
	opacity:0;
	transition:opacity .2s ease;
	pointer-events:none;
}
.btn:hover::before,.connect__btn:hover::before,.header__burger:hover::before,
.footer-switch button:hover::before,.case-deck__arrow:hover::before,.hero__method button:hover::before {
	opacity:1;
	animation:button-border-slide 1.4s ease-in-out infinite alternate;
}
@keyframes button-border-slide { to { background-position:100% 50%; } }
@media (prefers-reduced-motion:reduce) {
	.btn:hover::before,.connect__btn:hover::before,.header__burger:hover::before,
	.footer-switch button:hover::before,.case-deck__arrow:hover::before,.hero__method button:hover::before { animation:none; }
}
.section-head__link { font-size:14px; }
.section-head__link:hover {
	background-position:0 0,100% 0;
	animation:section-border-slide 1.4s ease-in-out infinite alternate;
}
@keyframes section-border-slide {
	from { background-position:0 0,0 0; }
	to { background-position:0 0,100% 0; }
}
@media (prefers-reduced-motion:reduce) {
	.section-head__link:hover { animation:none; }
}