/* Quarkora's small presentation layer. Global design choices live in theme.json. */
:root {
	color-scheme: light;
	--quarkora-focus: #665cff;
}

html { scroll-behavior: smooth; }
body { overflow-x: hidden; text-wrap: pretty; }
img { height: auto; }
a, button, input, select, textarea { transition: color var(--wp--custom--transition), background-color var(--wp--custom--transition), border-color var(--wp--custom--transition), transform var(--wp--custom--transition), box-shadow var(--wp--custom--transition); }
a:hover { color: var(--wp--preset--color--quantum); }
:where(a, button, input, select, textarea, [tabindex]):focus-visible { outline: 3px solid var(--quarkora-focus); outline-offset: 3px; }
::selection { color: #fff; background: #665cff; }

.quarkora-header {
	position: relative;
	z-index: 20;
	border-bottom: 1px solid var(--wp--preset--color--border);
	background: color-mix(in srgb, var(--wp--preset--color--canvas) 88%, transparent);
	backdrop-filter: blur(16px);
}
.quarkora-header .wp-block-site-logo img { border-radius: 50%; }
.quarkora-header-actions { gap: .45rem; }
.quarkora-header-search .wp-block-search__inside-wrapper { border: 0; padding: 0; }
.quarkora-header-search .wp-block-search__input { width: 0; min-width: 0; padding: 0; border: 0; opacity: 0; }
.quarkora-header-search:focus-within .wp-block-search__input { width: clamp(8rem,15vw,14rem); padding: .55rem .75rem; border: 1px solid var(--wp--preset--color--border); opacity: 1; }
.quarkora-header-search .wp-block-search__button,
.quarkora-mode-toggle {
	display: inline-grid;
	place-items: center;
	width: 42px;
	height: 42px;
	margin: 0;
	padding: 0;
	color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	cursor: pointer;
}
.quarkora-mode-toggle:hover { transform: translateY(-2px); box-shadow: var(--wp--custom--shadow--soft); }
.quarkora-mode-toggle svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.quarkora-currency-slot:empty { display: none; }
.quarkora-currency-slot select { min-height: 42px; padding: 0 2rem 0 .8rem; color: var(--wp--preset--color--ink); background-color: var(--wp--preset--color--surface); border: 1px solid var(--wp--preset--color--border); border-radius: 999px; }

.quarkora-hero { position: relative; isolation: isolate; min-height: min(780px,82vh); display: grid; align-items: center; }
.quarkora-hero::before { position: absolute; z-index: -1; inset: 8% -20% auto auto; width: 58vw; height: 58vw; max-width: 850px; max-height: 850px; content: ""; background: radial-gradient(circle,rgba(102,92,255,.18),transparent 66%); filter: blur(4px); }
.quarkora-kicker { font-family: var(--wp--preset--font-family--mono); font-weight: 700; letter-spacing: .12em; }
.quarkora-orb { display: grid; width: min(34vw,430px); aspect-ratio: 1; margin-inline: auto; place-items: center; border-radius: 50%; background: var(--wp--preset--gradient--quantum-field); box-shadow: 0 40px 100px rgba(102,92,255,.28); animation: quarkora-float 7s ease-in-out infinite; }
.quarkora-orb p { font-weight: 800; font-size: clamp(4rem,14vw,10rem) !important; line-height: 1; }
@keyframes quarkora-float { 50% { transform: translateY(-14px) rotate(3deg); } }

.quarkora-category-card { min-height: 320px; padding: clamp(1.4rem,3vw,2.5rem); display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; border-radius: var(--wp--custom--radius--large); }
.quarkora-category-card h3 { font-size: clamp(2rem,5vw,4.5rem); }
.quarkora-category-card.is-violet { background: #dcd8ff; }
.quarkora-category-card.is-mint { background: #c9fae9; }
.quarkora-category-card.is-coral { background: #ffd9df; }
.quarkora-category-card:hover { transform: translateY(-5px); box-shadow: var(--wp--custom--shadow--lift); }
.quarkora-card { height: 100%; }
.quarkora-card .wp-block-post-featured-image img { transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.quarkora-card:hover .wp-block-post-featured-image img { transform: scale(1.025); }
.quarkora-image-placeholder { display: grid; min-height: 520px; place-items: center; color: var(--wp--preset--color--muted); background: linear-gradient(145deg,#e9e7ff,#c8f8ea); border-radius: var(--wp--custom--radius--large); }
.quarkora-newsletter { border-radius: var(--wp--custom--radius--large); }
.quarkora-search-result { border-bottom: 1px solid var(--wp--preset--color--border); }
.quarkora-footer a { color: inherit; }
.quarkora-footer .wp-block-navigation { gap: .5rem; }

html[data-color-mode="dark"] { color-scheme: dark; --wp--preset--color--ink: #f2f4f7; --wp--preset--color--canvas: #0d0f14; --wp--preset--color--surface: #171a22; --wp--preset--color--muted: #a4acba; --wp--preset--color--border: #2b303b; --wp--preset--color--quantum: #958dff; --wp--preset--color--photon: #4ee9b8; }
html[data-color-mode="dark"] .quarkora-footer,
html[data-color-mode="dark"] .quarkora-value-strip { background: #08090d !important; }
html[data-color-mode="dark"] .quarkora-category-card { color: #10131a; }
html[data-color-mode="dark"] .quarkora-newsletter,
html[data-color-mode="dark"] .quarkora-image-placeholder { color: #10131a; }

@media (prefers-color-scheme: dark) {
	html:not([data-color-mode]) { color-scheme: dark; --wp--preset--color--ink: #f2f4f7; --wp--preset--color--canvas: #0d0f14; --wp--preset--color--surface: #171a22; --wp--preset--color--muted: #a4acba; --wp--preset--color--border: #2b303b; --wp--preset--color--quantum: #958dff; --wp--preset--color--photon: #4ee9b8; }
	html:not([data-color-mode]) .quarkora-footer, html:not([data-color-mode]) .quarkora-value-strip { background: #08090d !important; }
	html:not([data-color-mode]) .quarkora-category-card, html:not([data-color-mode]) .quarkora-newsletter, html:not([data-color-mode]) .quarkora-image-placeholder { color: #10131a; }
}

@media (max-width: 780px) {
	.quarkora-header-actions { margin-left: auto; }
	.quarkora-header-search { display: none; }
	.quarkora-hero { min-height: auto; text-align: center; }
	.quarkora-hero .wp-block-buttons { justify-content: center; }
	.quarkora-orb { width: min(72vw,340px); }
	.quarkora-category-card { min-height: 230px; }
	.quarkora-image-placeholder { min-height: 340px; }
}
@media (max-width: 520px) {
	.quarkora-header .wp-block-site-title { display: none; }
	.quarkora-currency-slot { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
