/*
Theme Name: Worldspun
Description: Marketing site child theme for Worldspun (extends Twenty Twenty-Five).
Author: Worldspun
Template: twentytwentyfive
Version: 1.4.1
Text Domain: worldspun
*/

/*
 * Visual layer: parchment/mist gradients, Cinzel headings, Source Sans body,
 * twilight + ember accents. Complements theme.json tokens.
 */

:root {
	--ws-twilight: #1a3a52;
	--ws-ember: #c45c26;
	--ws-parchment: #f4f1ea;
	--ws-mist: #e3edf5;
	--ws-shadow: rgba(26, 58, 82, 0.12);
}

body.worldspun-marketing {
	font-family: "Source Sans 3", system-ui, sans-serif;
	background:
		radial-gradient(ellipse 100% 80% at 50% -30%, rgba(26, 58, 82, 0.07), transparent 50%),
		linear-gradient(180deg, var(--ws-parchment) 0%, var(--ws-mist) 45%, #d4e0ec 100%);
	color: #1c1917;
	min-height: 100vh;
}

/* Front page: parchment page chrome — hero uses full-bleed art + scrim */
body.worldspun-home.worldspun-marketing {
	background:
		radial-gradient(ellipse 100% 80% at 50% -30%, rgba(26, 58, 82, 0.07), transparent 50%),
		linear-gradient(180deg, var(--ws-parchment) 0%, var(--ws-mist) 45%, #d4e0ec 100%);
}

body.worldspun-marketing .wp-site-blocks {
	overflow-x: clip;
}

/* ——— Header ——— */
body.worldspun-marketing header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 100;
	border-bottom: 1px solid var(--ws-shadow);
	background: rgba(255, 255, 255, 0.78);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.6) inset;
}

/* Logo (theme asset) sits left of site title via ::before — works with default TT5 header markup */
body.worldspun-marketing header.wp-block-template-part .wp-block-site-title {
	display: inline-flex;
	align-items: center;
	flex-wrap: nowrap;
	gap: 0.65rem;
	margin: 0;
}

body.worldspun-marketing header.wp-block-template-part .wp-block-site-title::before {
	content: "";
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	border-radius: 8px;
	background: url("assets/images/site-logo.jpg") center / contain no-repeat;
	box-shadow: 0 2px 8px rgba(12, 10, 8, 0.15);
}

@media (min-width: 600px) {
	body.worldspun-marketing header.wp-block-template-part .wp-block-site-title::before {
		width: 48px;
		height: 48px;
	}
}

body.worldspun-marketing .wp-block-site-title a {
	font-family: "Cinzel", Georgia, serif;
	font-weight: 700;
	font-size: clamp(1.15rem, 2.5vw, 1.45rem);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ws-twilight) !important;
	text-decoration: none;
	transition: color 0.2s ease, opacity 0.2s ease;
}

body.worldspun-marketing .wp-block-site-title a:hover {
	color: var(--ws-ember) !important;
}

/* Header row: allow title + nav to wrap instead of squashing links */
body.worldspun-marketing header.wp-block-template-part .wp-block-group.alignwide {
	flex-wrap: wrap !important;
	row-gap: 0.75rem;
	column-gap: clamp(1rem, 3vw, 2rem);
	align-items: center;
}

body.worldspun-marketing header.wp-block-template-part .wp-block-group:has(.worldspun-inline-nav) {
	flex: 1 1 min(100%, 16rem);
	min-width: 0;
	justify-content: flex-end;
}

/* Curated primary nav (shortcode) */
body.worldspun-marketing header .worldspun-inline-nav {
	width: 100%;
	min-width: 0;
}

body.worldspun-marketing header .worldspun-inline-nav .worldspun-inline-nav__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 0.45rem clamp(0.55rem, 1.6vw, 1.05rem);
	list-style: none;
	margin: 0;
	padding: 0;
}

body.worldspun-marketing header .worldspun-inline-nav .wp-block-navigation-item {
	margin: 0;
}

body.worldspun-marketing header .worldspun-inline-nav .wp-block-navigation-item__content {
	display: inline-block;
	padding: 0.4rem 0.2rem;
	white-space: nowrap;
	font-weight: 600;
	font-size: clamp(0.8125rem, 1.05vw, 0.9375rem);
	letter-spacing: 0.03em;
	color: var(--ws-twilight);
	text-decoration: none;
	border-radius: 6px;
	transition:
		color 0.2s ease,
		background 0.2s ease,
		box-shadow 0.2s ease;
}

body.worldspun-marketing header .worldspun-inline-nav .wp-block-navigation-item__content:hover {
	color: var(--ws-ember);
	background: rgba(26, 58, 82, 0.06);
}

body.worldspun-marketing header .worldspun-inline-nav .current-menu-item .wp-block-navigation-item__content {
	color: var(--ws-ember);
	background: rgba(196, 92, 38, 0.08);
}

body.worldspun-marketing .wp-block-navigation .wp-block-navigation-item__content {
	font-weight: 600;
	font-size: 0.82rem;
	letter-spacing: 0.03em;
	color: var(--ws-twilight);
}

body.worldspun-marketing .wp-block-navigation .wp-block-navigation-item__content:hover {
	color: var(--ws-ember);
}

body.worldspun-marketing .wp-block-navigation .current-menu-item .wp-block-navigation-item__content {
	color: var(--ws-ember);
}

/* Interior marketing pages: readable measure + spacing */
body.worldspun-marketing:not(.worldspun-home) main.worldspun-main .wp-block-post-content {
	max-width: min(42rem, 100%);
	margin-inline: auto;
	padding-block: clamp(2rem, 5vw, 3.25rem);
	padding-inline: var(--wp--preset--spacing--50, 1.25rem);
}

body.worldspun-marketing:not(.worldspun-home) main.worldspun-main .wp-block-post-content > .wp-block-heading:first-child,
body.worldspun-marketing:not(.worldspun-home) main.worldspun-main .wp-block-post-content > h1:first-child {
	margin-top: 0;
}

body.worldspun-marketing:not(.worldspun-home) main.worldspun-main .wp-block-post-content h1,
body.worldspun-marketing:not(.worldspun-home) main.worldspun-main .wp-block-post-content .wp-block-heading {
	letter-spacing: 0.06em;
}

body.worldspun-marketing:not(.worldspun-home) main.worldspun-main .wp-block-post-content p {
	font-size: 1.0625rem;
	line-height: 1.7;
	color: #292524;
}

/* ——— Main column ——— */
body.worldspun-marketing main.worldspun-main {
	margin-top: 0 !important;
}

body.worldspun-marketing main .wp-block-post-content {
	padding-top: 0;
}

/* ——— Home hero: full-bleed landscape + scrim + copy card ——— */
body.worldspun-home.worldspun-marketing main .worldspun-hero-banner {
	position: relative;
	display: flex;
	align-items: flex-end;
	justify-content: flex-start;
	min-height: min(88vh, 920px);
	padding-left: var(--wp--preset--spacing--50);
	padding-right: var(--wp--preset--spacing--50);
	padding-bottom: clamp(2.5rem, 6vw, 5rem);
	padding-top: clamp(3.5rem, 10vw, 7rem);
	background-color: #141210;
	background-image:
		linear-gradient(
			to top,
			rgba(10, 8, 7, 0.9) 0%,
			rgba(18, 14, 12, 0.58) 38%,
			rgba(28, 24, 22, 0.32) 62%,
			rgba(52, 46, 40, 0.14) 100%
		),
		url("assets/images/home-page-bg.png");
	background-size: cover;
	background-position: 28% center;
	background-repeat: no-repeat;
	border-bottom: 1px solid rgba(255, 255, 255, 0.06);
	box-shadow: 0 28px 60px rgba(0, 0, 0, 0.4);
}

@media (max-width: 782px) {
	body.worldspun-home.worldspun-marketing main .worldspun-hero-banner {
		background-position: right center;
	}
}

body.worldspun-home.worldspun-marketing main .worldspun-hero-banner-inner {
	width: 100%;
	max-width: min(40rem, 100%);
	padding: clamp(1.25rem, 3vw, 1.85rem) clamp(1.35rem, 3.5vw, 2rem);
	background: rgba(244, 241, 234, 0.9);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	border-radius: 14px;
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.45);
	border: 1px solid rgba(255, 255, 255, 0.45);
}

body.worldspun-home.worldspun-marketing main .worldspun-hero-banner-inner h1 {
	font-family: "Cinzel", Georgia, serif;
	font-weight: 700;
	font-size: clamp(1.75rem, 4vw, 2.85rem);
	line-height: 1.12;
	letter-spacing: 0.02em;
	color: var(--ws-twilight);
	margin-bottom: 1rem;
	max-width: none;
}

body.worldspun-home.worldspun-marketing main .worldspun-hero-banner-inner .has-large-font-size {
	font-size: clamp(1.05rem, 2vw, 1.15rem) !important;
	line-height: 1.65;
	color: #292524;
	max-width: 52ch;
}

/* Store + beta CTAs (HTML block) */
body.worldspun-marketing .worldspun-store-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem 0.75rem;
	margin: 1.25rem 0 0.75rem;
	max-width: 52rem;
}

body.worldspun-marketing .worldspun-beta-row {
	margin: 0 0 0.25rem;
	max-width: 52rem;
}

body.worldspun-marketing .worldspun-store-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.65rem;
	padding: 0.55rem 1.15rem;
	font-family: "Source Sans 3", sans-serif;
	font-weight: 700;
	font-size: 0.9rem;
	letter-spacing: 0.03em;
	text-decoration: none !important;
	border-radius: 999px;
	transition:
		transform 0.15s ease,
		box-shadow 0.2s ease,
		background 0.2s ease,
		border-color 0.2s ease;
	border: 2px solid transparent;
}

body.worldspun-marketing .worldspun-store-btn.worldspun-store-web {
	background: linear-gradient(165deg, #234a68 0%, var(--ws-twilight) 100%);
	color: #fff !important;
	box-shadow: 0 6px 18px -6px rgba(26, 58, 82, 0.55);
}

body.worldspun-marketing .worldspun-store-btn.worldspun-store-google,
body.worldspun-marketing .worldspun-store-btn.worldspun-store-apple {
	background: rgba(255, 255, 255, 0.95);
	color: var(--ws-twilight) !important;
	border-color: rgba(26, 58, 82, 0.35);
	box-shadow: 0 4px 14px -8px rgba(26, 58, 82, 0.35);
}

body.worldspun-marketing .worldspun-store-btn.worldspun-store-beta.is-secondary {
	background: transparent;
	color: var(--ws-twilight) !important;
	border: 2px dashed rgba(196, 92, 38, 0.65);
	box-shadow: none;
	margin-top: 0.35rem;
}

body.worldspun-marketing .worldspun-store-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 26px -10px rgba(26, 58, 82, 0.5);
}

body.worldspun-marketing .worldspun-store-btn:focus-visible {
	outline: 2px solid var(--ws-ember);
	outline-offset: 3px;
}

/* Contact Form 7 on /beta/ */
body.worldspun-marketing .wpcf7-form label {
	display: block;
	margin-bottom: 1rem;
	font-weight: 600;
	color: var(--ws-twilight);
}

body.worldspun-marketing .wpcf7-form input[type="text"],
body.worldspun-marketing .wpcf7-form input[type="email"],
body.worldspun-marketing .wpcf7-form textarea,
body.worldspun-marketing .wpcf7-form select {
	width: 100%;
	max-width: 36rem;
	margin-top: 0.35rem;
	padding: 0.65rem 0.85rem;
	border: 1px solid var(--ws-shadow);
	border-radius: 10px;
	font: inherit;
	background: rgba(255, 255, 255, 0.9);
}

body.worldspun-marketing .wpcf7-form input[type="submit"] {
	background: linear-gradient(165deg, #234a68 0%, var(--ws-twilight) 100%);
	color: #fff;
	border: none;
	border-radius: 999px;
	padding: 0.75rem 1.75rem;
	font-weight: 700;
	cursor: pointer;
	margin-top: 0.5rem;
}

body.worldspun-marketing .wpcf7 form .wpcf7-response-output {
	margin-top: 1rem;
	border-radius: 8px;
}

/* ——— Sections ——— */
body.worldspun-marketing main .wp-block-post-content .wp-block-heading:not(h1) {
	font-family: "Cinzel", Georgia, serif;
	color: var(--ws-twilight);
	margin-top: 0;
}

body.worldspun-marketing main .wp-block-post-content h2.wp-block-heading {
	font-size: clamp(1.5rem, 3vw, 2rem);
	margin-bottom: 1.5rem;
	padding-bottom: 0.35rem;
	border-bottom: 2px solid rgba(196, 92, 38, 0.35);
	display: inline-block;
}

body.worldspun-marketing main .wp-block-post-content h3.wp-block-heading {
	font-size: clamp(1.1rem, 2vw, 1.25rem);
	margin-bottom: 0.5rem;
}

body.worldspun-marketing main .worldspun-infinity-heading .worldspun-infinity-icon {
	display: inline-block;
	margin-right: 0.35em;
	font-family: "Cinzel", Georgia, serif;
	font-weight: 700;
	font-size: 1.25em;
	line-height: 1;
	color: var(--ws-ember);
	vertical-align: -0.06em;
	letter-spacing: 0;
}

/* Pillars — full-width band with gutters */
body.worldspun-marketing main .worldspun-pillars-section {
	max-width: none !important;
	box-sizing: border-box;
	padding-left: clamp(1rem, 3vw, 2.5rem);
	padding-right: clamp(1rem, 3vw, 2.5rem);
}

body.worldspun-marketing main .worldspun-pillars-section.alignfull {
	width: 100%;
}

/* Old home markup: pillars group without alignfull stayed inside ~720px content — cards ~240px wide */
body.worldspun-marketing main .wp-block-post-content .worldspun-pillars-section:not(.alignfull) {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* Inner columns: use full band width (alignwide was still capping the row) */
body.worldspun-marketing main .worldspun-pillars-section .worldspun-pillar-grid.alignwide,
body.worldspun-marketing main .worldspun-pillars-section .worldspun-pillar-grid.alignfull {
	width: 100% !important;
	max-width: none !important;
}

/*
 * Why Worldspun cards: keep columns equal-width; row width comes from full section + theme wideSize.
 */
body.worldspun-marketing main .worldspun-pillar-grid {
	gap: 1.25rem 1.5rem !important;
}

body.worldspun-marketing main .worldspun-pillar-grid > .wp-block-column {
	max-width: none !important;
}

body.worldspun-marketing main .worldspun-pillar-grid .wp-block-column {
	background: rgba(255, 255, 255, 0.72);
	border: 1px solid var(--ws-shadow);
	border-radius: 14px;
	padding: 1.5rem clamp(1.35rem, 2.5vw, 2.35rem) 1.65rem !important;
	box-shadow: 0 8px 24px -12px rgba(26, 58, 82, 0.15);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	min-width: 0;
}

body.worldspun-marketing main .worldspun-pillar-grid .wp-block-column:hover {
	transform: translateY(-3px);
	box-shadow: 0 16px 32px -16px rgba(26, 58, 82, 0.22);
}

body.worldspun-marketing main .worldspun-pillar-art {
	width: fit-content;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0.65rem;
}

body.worldspun-marketing main .worldspun-pillar-art img {
	display: block;
	border-radius: 12px;
	box-shadow: 0 8px 20px -12px rgba(26, 58, 82, 0.25);
	background: rgba(255, 255, 255, 0.5);
}

@media (min-width: 782px) {
	body.worldspun-marketing main .worldspun-pillar-grid .wp-block-column {
		flex: 1 1 0 !important;
	}

	body.worldspun-marketing main .worldspun-pillar-grid .wp-block-column .wp-block-paragraph {
		max-width: none;
	}
}

/* Ruleset strip */
body.worldspun-marketing main .wp-block-post-content .wp-block-group.has-background {
	border-radius: 8px;
}

/* ——— Buttons ——— */
body.worldspun-marketing .wp-block-button .wp-block-button__link {
	font-family: "Source Sans 3", sans-serif;
	font-weight: 700;
	font-size: 0.95rem;
	letter-spacing: 0.04em;
	border: none;
	transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
	box-shadow: 0 4px 14px -4px rgba(26, 58, 82, 0.45);
}

body.worldspun-marketing .wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color) {
	background: linear-gradient(165deg, #234a68 0%, var(--ws-twilight) 100%);
	color: #fff !important;
}

body.worldspun-marketing .wp-block-button .wp-block-button__link:hover {
	transform: translateY(-1px);
	box-shadow: 0 8px 24px -6px rgba(26, 58, 82, 0.55);
}

body.worldspun-marketing .wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent !important;
	color: var(--ws-twilight) !important;
	border: 2px solid var(--ws-twilight) !important;
	box-shadow: none;
}

body.worldspun-marketing .wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: rgba(26, 58, 82, 0.06) !important;
	color: var(--ws-ember) !important;
	border-color: var(--ws-ember) !important;
}

/* Publisher band (dark group at bottom) */
body.worldspun-marketing main .wp-block-group.alignfull.has-contrast-background-color {
	border-radius: 0;
	margin-bottom: 0 !important;
	box-shadow: 0 -20px 40px -24px rgba(0, 0, 0, 0.35);
}

body.worldspun-marketing main .wp-block-group.has-contrast-background-color .wp-block-heading {
	color: #fff !important;
	border-bottom: none;
}

body.worldspun-marketing main .wp-block-group.has-contrast-background-color .wp-block-button .wp-block-button__link {
	box-shadow: 0 4px 20px -4px rgba(0, 0, 0, 0.4);
}

/* FAQ details */
body.worldspun-marketing .wp-block-details {
	border: 1px solid var(--ws-shadow);
	border-radius: 10px;
	padding: 0.75rem 1rem;
	margin-bottom: 0.65rem;
	background: rgba(255, 255, 255, 0.7);
}

body.worldspun-marketing .wp-block-details summary {
	font-weight: 700;
	color: var(--ws-twilight);
	cursor: pointer;
}

body.worldspun-marketing .wp-block-details[open] {
	background: rgba(255, 255, 255, 0.95);
	border-color: rgba(196, 92, 38, 0.35);
}

/* ——— Footer ——— */
body.worldspun-marketing footer.wp-block-template-part {
	border-top: 1px solid var(--ws-shadow);
	margin-top: 0 !important;
	background: rgba(26, 58, 82, 0.04);
}

/* Bottom meta row: theme credit | Privacy & Terms | WordPress */
body.worldspun-marketing footer .worldspun-footer-meta-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	gap: 0.75rem 1rem;
	align-items: center;
	width: 100%;
}

body.worldspun-marketing footer .worldspun-footer-meta-row > p:first-of-type {
	justify-self: start;
	margin: 0;
}

body.worldspun-marketing footer .worldspun-footer-meta-row .worldspun-footer-meta-row__legal {
	justify-self: center;
	min-width: 0;
}

body.worldspun-marketing footer .worldspun-footer-meta-row > p:last-of-type {
	justify-self: end;
	margin: 0;
	text-align: right;
}

body.worldspun-marketing .worldspun-footer-legal-nav__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem 1.25rem;
	justify-content: center;
	align-items: center;
	font-size: 0.9375rem;
}

@media (max-width: 640px) {
	body.worldspun-marketing footer .worldspun-footer-meta-row {
		grid-template-columns: 1fr;
		justify-items: center;
	}

	body.worldspun-marketing footer .worldspun-footer-meta-row > p:first-of-type,
	body.worldspun-marketing footer .worldspun-footer-meta-row > p:last-of-type {
		justify-self: center;
		text-align: center;
	}
}

body.worldspun-marketing .worldspun-footer-legal-nav__link {
	color: var(--ws-ember);
	text-decoration: none;
	font-weight: 600;
}

body.worldspun-marketing .worldspun-footer-legal-nav__link:hover {
	text-decoration: underline;
}

/* ——— Lists ——— */
body.worldspun-marketing .wp-block-list li {
	margin-bottom: 0.35rem;
}

/* ——— Accessibility ——— */
body.worldspun-marketing .wp-block-button .wp-block-button__link:focus {
	outline: 2px solid var(--ws-ember);
	outline-offset: 3px;
}

body.worldspun-marketing .wp-block-navigation .wp-block-navigation-item__content:focus {
	outline: 2px solid var(--ws-ember);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	body.worldspun-marketing .worldspun-pillar-grid .wp-block-column:hover,
	body.worldspun-marketing .wp-block-button .wp-block-button__link:hover,
	body.worldspun-marketing .worldspun-store-btn:hover {
		transform: none;
	}
}
