/*
Theme Name: AURORA
Theme URI: https://yantracore.com/store/product/aurora-wp
Author: YantraCore
Author URI: https://yantracore.com
Description: AURORA is a studio-grade WordPress block theme (full-site editing) for modern studios, agencies and editorial blogs. Refined editorial layouts, a tasteful Fraunces + Inter type system, an accessible deep-slate palette with a violet→cyan accent, fluid typography and a clean block-editor experience for non-technical owners.
Requires at least: 6.6
Tested up to: 7.0
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: aurora
Tags: full-site-editing, block-patterns, blog, portfolio, editorial, two-columns, custom-colors, custom-logo, featured-images, block-styles, wide-blocks, accessibility-ready, translation-ready

AURORA WordPress Block Theme, (C) 2026 YantraCore.
AURORA is distributed under the terms of the GNU GPL v2 or later.
*/

/*
 * Block themes are configured primarily via theme.json. The styles below are
 * a thin layer of progressive enhancement that the block editor / theme.json
 * cannot express on their own (focus-visible, tasteful motion, small UI refinements).
 * Everything here is reduced-motion-gated and degrades to a usable static state.
 */

/* --- Accessible focus ring across the whole theme --- */
:where(a, button, input, textarea, select, summary, .wp-block-button__link):focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
	border-radius: 3px;
}

/* Skip link — visually hidden until focused, then pinned top-left */
.skip-link.screen-reader-text {
	position: absolute;
	top: -100px;
	left: 1rem;
	z-index: 1000;
	display: inline-block;
	padding: 0.7rem 1.1rem;
	font-family: var(--wp--preset--font-family--accent);
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
	border-radius: 8px;
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
	box-shadow: 0 6px 24px rgba(16, 20, 28, 0.18);
	transition: top 160ms ease;
}
.skip-link.screen-reader-text:focus {
	top: 0.75rem;
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}

/* --- Sticky, glassy header --- */
.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 100;
	background: color-mix(in srgb, var(--wp--preset--color--base) 86%, transparent);
	-webkit-backdrop-filter: saturate(140%) blur(12px);
	backdrop-filter: saturate(140%) blur(12px);
	border-bottom: 1px solid var(--wp--preset--color--hairline);
}

/* Nav link underline grow */
.wp-block-navigation .wp-block-navigation-item__content {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0 0.2rem;
}
.wp-block-navigation .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1.5px;
	background: var(--wp--preset--color--accent);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}
.wp-block-navigation .wp-block-navigation-item__content:hover::after,
.wp-block-navigation .current-menu-item .wp-block-navigation-item__content::after {
	transform: scaleX(1);
}

/* --- Buttons: tasteful lift --- */
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	transition: transform 280ms cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 280ms cubic-bezier(0.22, 1, 0.36, 1),
		background-color 200ms ease;
	will-change: transform;
}

.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
}

.aurora-demo-notice {
	margin: calc(-1 * var(--wp--preset--spacing--30)) calc(-1 * var(--wp--style--root--padding-right, 1.5rem)) var(--wp--preset--spacing--20);
	padding: 0.55rem var(--wp--style--root--padding-right, 1.5rem);
	background: var(--wp--preset--color--slate);
	color: var(--wp--preset--color--slate-fg);
	text-align: center;
	font-family: var(--wp--preset--font-family--accent);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.02em;
}

.aurora-demo-notice p {
	margin: 0;
}
.wp-block-button__link:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px -12px color-mix(in srgb, var(--wp--preset--color--accent) 70%, transparent);
}

/* --- Editorial post cards: hover lift on the query loop --- */
.wp-block-post-template li.wp-block-post {
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}
.wp-block-post-template li.wp-block-post:hover {
	transform: translateY(-4px);
}
.wp-block-post-featured-image img {
	transition: transform 600ms cubic-bezier(0.22, 1, 0.36, 1);
}
.wp-block-post-featured-image:hover img {
	transform: scale(1.04);
}

/* Eyebrow / kicker utility (used in patterns) */
.is-style-aurora-kicker {
	font-family: var(--wp--preset--font-family--accent);
	text-transform: uppercase;
	letter-spacing: 0.18em;
	font-size: 0.78rem;
	font-weight: 600;
	color: var(--wp--preset--color--accent);
}

/* Drop-cap-ish lead paragraph used in single posts */
.is-style-aurora-lead {
	font-size: clamp(1.15rem, 1rem + 0.6vw, 1.4rem);
	line-height: 1.6;
	color: var(--wp--preset--color--ink-soft);
}

/* Rounded media + hairline frame block style */
.is-style-aurora-framed img,
.is-style-aurora-framed {
	border-radius: 16px;
	overflow: hidden;
}

/* Quote pattern emphasis */
.wp-block-quote.is-style-aurora-pull {
	border: 0;
	padding-inline-start: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.25rem);
	line-height: 1.25;
}

/* --- FAQ / details accordion --- */
.wp-block-details {
	background: var(--wp--preset--color--surface);
	transition: border-color 200ms ease, box-shadow 200ms ease;
}
.wp-block-details > summary {
	cursor: pointer;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: 1.125rem;
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}
.wp-block-details > summary::-webkit-details-marker {
	display: none;
}
/* Custom +/– marker that flips when open */
.wp-block-details > summary::after {
	content: "+";
	font-family: var(--wp--preset--font-family--accent);
	font-weight: 400;
	font-size: 1.5rem;
	line-height: 1;
	color: var(--wp--preset--color--accent);
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}
.wp-block-details[open] > summary::after {
	transform: rotate(45deg);
}
.wp-block-details[open] {
	border-color: color-mix(in srgb, var(--wp--preset--color--accent) 40%, var(--wp--preset--color--hairline));
}
.wp-block-details > summary:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 4px;
	border-radius: 6px;
}
.aurora-faq .wp-block-details + .wp-block-details {
	margin-top: var(--wp--preset--spacing--20);
}

/* --- Patterns' real forms (contact + newsletter) --- */
.aurora-form {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin: 0;
}
.aurora-form .aurora-form__row {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	margin: 0;
}
.aurora-form label {
	font-family: var(--wp--preset--font-family--accent);
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-soft);
}
.aurora-form input,
.aurora-form textarea {
	box-sizing: border-box;
	width: 100%;
	font: inherit;
	color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--base);
	border: 1.5px solid var(--wp--preset--color--hairline);
	border-radius: 12px;
	padding: 0.7rem 0.9rem;
	transition: border-color 180ms ease, box-shadow 180ms ease;
}

.aurora-form input,
.aurora-form button {
	min-height: 44px;
}

.aurora-form__status {
	min-height: 1.5em;
	margin: 0;
	color: var(--wp--preset--color--ink-soft);
	font-size: 0.875rem;
}
.aurora-form input::placeholder,
.aurora-form textarea::placeholder {
	color: var(--wp--preset--color--ink-soft);
	opacity: 0.7;
}
.aurora-form input:focus-visible,
.aurora-form textarea:focus-visible {
	outline: none;
	border-color: var(--wp--preset--color--accent);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--wp--preset--color--accent) 22%, transparent);
}
.aurora-form textarea {
	resize: vertical;
	min-height: 7rem;
}
.aurora-form .aurora-form__actions {
	margin: 0.25rem 0 0;
}
.aurora-form button[type="submit"] {
	cursor: pointer;
	border: 0;
	font-family: var(--wp--preset--font-family--accent);
	font-weight: 600;
	font-size: 0.875rem;
	letter-spacing: 0.01em;
	color: var(--wp--preset--color--base);
	background: var(--wp--preset--color--ink);
	border-radius: 999px;
	padding: 0.9rem 1.6rem;
	transition: background-color 200ms ease, transform 200ms ease;
}
.aurora-form button[type="submit"]:hover {
	background: var(--wp--preset--color--accent);
	transform: translateY(-1px);
}
.aurora-form button[type="submit"]:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}
.aurora-form .aurora-form__note {
	margin: 0;
	font-size: 0.8rem;
	color: var(--wp--preset--color--ink-soft);
}
/* Inline (newsletter) variant: email + submit on one line */
.aurora-form--inline {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 0.5rem;
}
.aurora-form--inline input {
	flex: 1 1 12rem;
}
.aurora-form--inline button[type="submit"] {
	flex: 0 0 auto;
}

/* --- Single post: estimated read time --- */
.aurora-readtime {
	font-family: var(--wp--preset--font-family--accent);
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-soft);
}

/* --- Single post: reading-experience refinements --- */
/* A slightly more generous measure + rhythm inside the article body. */
.aurora-has-progress .wp-block-post-content {
	font-size: clamp(1.05rem, 1rem + 0.3vw, 1.18rem);
	line-height: 1.75;
}
.aurora-has-progress .wp-block-post-content > p {
	margin-block: 0 1.35em;
}
/* Headings inside the article get a touch more space above. */
.aurora-has-progress .wp-block-post-content > :is(h2, h3, h4) {
	margin-top: 1.8em;
}
/* Pull quote inside an article: hang slightly into the margin on wide screens. */
.aurora-has-progress .wp-block-post-content .wp-block-pullquote {
	margin-block: var(--wp--preset--spacing--40);
	padding-block: var(--wp--preset--spacing--30);
}
.aurora-has-progress .wp-block-post-content .wp-block-pullquote p {
	font-size: clamp(1.5rem, 1.2rem + 1.4vw, 2.1rem);
	line-height: 1.22;
}

/* Prev / next post navigation: space the two links apart, animate the arrow. */
.wp-block-post-navigation-link {
	display: inline-flex;
}
.wp-site-blocks main > .wp-block-group.alignwide:has(> .wp-block-post-navigation-link) {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
}
.wp-block-post-navigation-link a {
	font-family: var(--wp--preset--font-family--accent);
	font-weight: 600;
	font-size: 0.9rem;
	text-decoration: none;
	color: var(--wp--preset--color--ink);
	transition: color 180ms ease;
}
.wp-block-post-navigation-link a:hover {
	color: var(--wp--preset--color--accent);
}

/* --- Drop-cap block style (opt-in on a paragraph) --- */
.is-style-aurora-dropcap::first-letter {
	float: left;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 400;
	font-size: 3.6em;
	line-height: 0.78;
	padding: 0.06em 0.12em 0 0;
	margin-top: 0.06em;
	color: var(--wp--preset--color--accent);
}

/* --- Section-eyebrow block style: a hairline rule before a kicker label --- */
.is-style-aurora-eyebrow {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	font-family: var(--wp--preset--font-family--accent);
	text-transform: uppercase;
	letter-spacing: 0.16em;
	font-size: 0.78rem;
	font-weight: 600;
	color: var(--wp--preset--color--accent);
}
.is-style-aurora-eyebrow::before {
	content: "";
	width: 2.5rem;
	height: 1.5px;
	background: currentColor;
	flex: 0 0 auto;
}

/* --- Overlap hero: glass stat panel pulled up over the image --- */
.aurora-overlap__panel.is-style-aurora-glass {
	position: relative;
	z-index: 2;
	margin-top: calc(-1 * var(--wp--preset--spacing--40));
	margin-inline: clamp(0px, 4vw, 3.5rem);
	box-shadow: var(--wp--preset--shadow--raised);
}
@media (max-width: 600px) {
	.aurora-overlap__panel.is-style-aurora-glass {
		margin-top: calc(-1 * var(--wp--preset--spacing--30));
		margin-inline: 0;
	}
}

/* --- Case-study card: media lift + animated title underline --- */
.aurora-case .aurora-case__media img {
	transition: transform 700ms cubic-bezier(0.22, 1, 0.36, 1);
}
.aurora-case:hover .aurora-case__media img {
	transform: scale(1.04);
}
.aurora-case__link {
	color: inherit;
	text-decoration: none;
	background-image: linear-gradient(var(--wp--preset--color--accent), var(--wp--preset--color--accent));
	background-repeat: no-repeat;
	background-position: left 100%;
	background-size: 0% 2px;
	transition: background-size 360ms cubic-bezier(0.22, 1, 0.36, 1);
	padding-bottom: 2px;
}
.aurora-case:hover .aurora-case__link,
.aurora-case__link:hover,
.aurora-case__link:focus-visible {
	background-size: 100% 2px;
}

/* --- Capabilities marquee (kinetic accent; motion-gated) --- */
.aurora-marquee {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.aurora-marquee__track {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	width: max-content;
	white-space: nowrap;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.25rem, 1rem + 1.4vw, 2rem);
	font-weight: 400;
	letter-spacing: -0.01em;
	color: var(--wp--preset--color--ink);
}
.aurora-marquee__dot {
	color: var(--wp--preset--color--accent);
}

/* --- Slate bands: variation-proof legible headings --- *
 * Slate-band patterns colour headings `base` (near-white in the default
 * theme). In the Dark variation `base` resolves to near-black, which would
 * make those headings vanish on the dark slate band. This guard remaps any
 * `base`-coloured heading sitting on a slate background to the dedicated
 * `--wp--custom--on-slate` token — a crisp near-white that each variation
 * can tune, verified 14–19:1 on slate across all five styles. Result: slate
 * sections stay crisp AND WCAG AA in every variation.                     */
.has-slate-background-color .wp-block-heading.has-base-color,
.has-slate-background-color.has-base-color .wp-block-heading {
	color: var(--wp--custom--on-slate, var(--wp--preset--color--slate-fg));
}

/* --- Sticky intro column block style (e.g. services left rail on desktop) --- */
@media (min-width: 782px) {
	.wp-block-column.is-style-aurora-sticky {
		position: sticky;
		top: clamp(5rem, 12vh, 7rem);
		align-self: start;
	}
}

/* --- Reading progress bar (single posts) --- */
.aurora-readbar {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	z-index: 200;
	background: transparent;
	pointer-events: none;
}
.aurora-readbar > span {
	display: block;
	height: 100%;
	transform: scaleX(0);
	transform-origin: left;
	background: var(--wp--preset--gradient--aurora, linear-gradient(120deg, var(--wp--preset--color--accent), var(--wp--preset--color--accent-2)));
}

/* ============================================================ *
 *  Scroll-craft — motion only (gated)                          *
 *  CSS-first via animation-timeline: view(); the reveal.js     *
 *  IntersectionObserver covers browsers without that support.  *
 * ============================================================ */
@media (prefers-reduced-motion: no-preference) {

	/* JS/IO fallback reveal */
	.aurora-reveal {
		opacity: 0;
		transform: translateY(18px);
		animation: aurora-rise 720ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
	}
	@keyframes aurora-rise {
		to {
			opacity: 1;
			transform: none;
		}
	}

	/* Native scroll-driven reveal for the front-page sections + cards.
	   Where supported this runs without JS; @supports keeps it isolated. */
	@supports (animation-timeline: view()) {
		.wp-site-blocks .wp-block-group.is-style-aurora-card,
		.wp-site-blocks .aurora-case,
		.wp-site-blocks main > .wp-block-group > section > .wp-block-columns,
		.wp-site-blocks main > section > .wp-block-group,
		[data-aurora-reveal] {
			animation: aurora-rise-native both;
			animation-timeline: view();
			animation-range: entry 2% cover 22%;
		}
		@keyframes aurora-rise-native {
			from {
				opacity: 0;
				transform: translateY(26px);
			}
			to {
				opacity: 1;
				transform: none;
			}
		}

		/* The IO-driven class is redundant when native timelines run. */
		.aurora-reveal {
			animation-name: aurora-rise-native;
		}

		/* Marquee drift, tied to page scroll progress (no infinite loop). */
		.aurora-marquee__track {
			animation: aurora-marquee-drift linear both;
			animation-timeline: scroll(root block);
		}
		@keyframes aurora-marquee-drift {
			from { transform: translateX(0); }
			to { transform: translateX(-50%); }
		}
	}

	/* Where scroll timelines are NOT supported, keep a gentle infinite
	   marquee so the strip still feels alive. */
	@supports not (animation-timeline: view()) {
		.aurora-marquee__track {
			animation: aurora-marquee-loop 38s linear infinite;
		}
		@keyframes aurora-marquee-loop {
			from { transform: translateX(0); }
			to { transform: translateX(-50%); }
		}
		.aurora-marquee:hover .aurora-marquee__track {
			animation-play-state: paused;
		}
	}
}

/* Respect reduced motion everywhere (this block wins; placed last) */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		animation-timeline: auto !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
	.wp-block-post-template li.wp-block-post:hover,
	.wp-block-button__link:hover,
	.aurora-case:hover .aurora-case__media img {
		transform: none;
	}
	/* Static marquee: collapse the duplicated track to a single, readable line. */
	.aurora-marquee {
		-webkit-mask-image: none;
		mask-image: none;
		text-align: center;
	}
	.aurora-marquee__track {
		animation: none !important;
		transform: none !important;
		flex-wrap: wrap;
		justify-content: center;
		width: auto;
		white-space: normal;
	}
	/* No reading bar churn without motion. */
	.aurora-readbar {
		display: none;
	}
	/* Ensure native-timeline reveals never leave content hidden. */
	.aurora-reveal,
	[data-aurora-reveal],
	.wp-block-group.is-style-aurora-card,
	.aurora-case {
		opacity: 1 !important;
		transform: none !important;
	}
}

/* Evolution pass wave 5: the violet accent was 3.9-4.2:1 in both directions. Base accent
   darkened to #6A48F5 (passes on cream and as button bg); accent-soft (#9D85FF) carries
   accent text on dark slate sections. Mirrored into the snapshot via data-yc-ovx. */
.aurora-footer a:not(.wp-element-button) { color: var(--wp--preset--color--accent-soft); }
.has-slate-background-color .is-style-aurora-kicker { color: var(--wp--preset--color--accent-soft); }
