/*
 * Ovisual "Trading Desk" look: the parts theme.json cannot express.
 * Colours come from the theme.json palette (--wp--preset--color--*), so a
 * palette change in theme.json carries through here.
 */

:root {
	--ovs-bg: var(--wp--preset--color--base);
	--ovs-surface: var(--wp--preset--color--base-2);
	--ovs-card: #131820;
	--ovs-line: var(--wp--preset--color--accent-5);
	--ovs-line-2: #2A3340;
	--ovs-text: var(--wp--preset--color--contrast);
	--ovs-muted: var(--wp--preset--color--contrast-2);
	--ovs-faint: var(--wp--preset--color--contrast-3);
	--ovs-accent: var(--wp--preset--color--accent);
	--ovs-ink: var(--wp--preset--color--accent-ink);
	--ovs-flip: var(--wp--preset--color--accent-2);
	--ovs-put: var(--wp--preset--color--accent-3);
	--ovs-call: var(--wp--preset--color--accent-4);
}

/* ---------- header ---------- */
.ovs-header {
	position: sticky;
	top: 0;
	z-index: 50;
	border-bottom: 1px solid var(--ovs-line);
}
/* The frosted background sits on a layer behind the header: backdrop-filter on the header
   itself would make it the containing block for position:fixed children, which clips the
   navigation overlay (and the phone search field) to the header box. */
.ovs-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: rgba(14, 17, 22, 0.88);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}
.admin-bar .ovs-header { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 600px) { .admin-bar .ovs-header { top: 0; } }

.ovs-brand a {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
}
.ovs-brand a::before {
	content: "";
	width: 30px;
	height: 30px;
	flex: none;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Ccircle cx='15' cy='15' r='13' fill='none' stroke='%232DD4BF' stroke-width='2.5'/%3E%3Crect x='9' y='13' width='3' height='8' fill='%232DD4BF'/%3E%3Crect x='14' y='8' width='3' height='13' fill='%232DD4BF'/%3E%3Crect x='19' y='11' width='3' height='10' fill='%232DD4BF'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ovs-nav .wp-block-navigation-item__content { padding: 0.6rem 0.2rem; }
.ovs-nav .current-menu-item > .wp-block-navigation-item__content { color: var(--ovs-text); }
.ovs-header-actions .wp-block-button__link { padding: 0.7rem 1.1rem; font-size: 0.95rem; }
@media (max-width: 1099px) { .ovs-header-actions .is-style-outline { display: none; } }

/* ---------- shared bits ---------- */
.ovs-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ovs-accent);
}
.ovs-eyebrow::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--ovs-accent);
	animation: ovs-blink 1.4s ease-in-out infinite;
}
.ovs-lede { color: var(--ovs-muted); font-size: 1.15rem; line-height: 1.6; max-width: 34rem; }
.ovs-muted { color: var(--ovs-muted); }
.ovs-section-head { gap: 1rem; align-items: flex-end; }
.ovs-section-head p { margin: 0.5rem 0 0; color: var(--ovs-muted); }
.ovs-more a { font-weight: 700; text-decoration: none; }

/* body.paged = page 2+ of the post list: show only the posts there */
body.paged .ovs-home-only { display: none; }

/* ---------- hero ---------- */
.ovs-hero { align-items: center; }
.ovs-hero > * { min-width: 0; }
.ovs-hero-copy { flex: 1 1 26rem; }
.ovs-hero-visual { flex: 1.3 1 34rem; }
.ovs-hero-title { font-size: clamp(2.5rem, 5.2vw, 4.25rem); margin-top: 1rem; }

.ovs-window {
	background: var(--ovs-card);
	border: 1px solid var(--ovs-line);
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
	animation: ovs-rise 1s cubic-bezier(.2, .8, .2, 1) both;
	font-size: 0.82rem;
}
.ovs-window__bar {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 16px;
	border-bottom: 1px solid var(--ovs-line);
	color: var(--ovs-faint);
}
.ovs-window__dot { width: 11px; height: 11px; border-radius: 50%; background: var(--ovs-line-2); }
.ovs-window__title { margin-left: 10px; color: var(--ovs-text); font-weight: 600; }
.ovs-window__meta { margin-left: auto; }
.ovs-window__body { display: flex; flex-wrap: wrap; }
.ovs-window__chart { flex: 3 1 20rem; min-width: 0; }
.ovs-window__chart svg { display: block; width: 100%; height: auto; }
.ovs-window__side {
	flex: 1 1 10rem;
	border-left: 1px solid var(--ovs-line);
	padding: 16px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.ovs-window__side strong { color: var(--ovs-text); }
.ovs-window__strategy { background: var(--ovs-bg); border: 1px solid var(--ovs-line); border-radius: 10px; padding: 12px; color: var(--ovs-faint); }
.ovs-window__state { margin-top: 6px; display: flex; align-items: center; gap: 6px; color: var(--ovs-accent); font-weight: 700; }
.ovs-window__state::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--ovs-accent); animation: ovs-blink 1.4s ease-in-out infinite; }
.ovs-window__row { display: flex; justify-content: space-between; gap: 8px; color: var(--ovs-faint); }
.ovs-window__row span:last-child { color: var(--ovs-text); }
.ovs-last { animation: ovs-tick 2.4s ease-in-out infinite; }
@media (max-width: 600px) { .ovs-window__meta { display: none; } .ovs-window__side { border-left: 0; border-top: 1px solid var(--ovs-line); } }

/* ---------- process strip ---------- */
.ovs-steps {
	border: 1px solid var(--ovs-line);
	border-radius: 16px;
	overflow: hidden;
	gap: 0 !important;
}
.ovs-step { padding: 1.75rem; border-right: 1px solid var(--ovs-line); border-bottom: 1px solid var(--ovs-line); margin: 0 -1px -1px 0; }
.ovs-step h3 { font-size: 1.25rem; margin: 0.6rem 0 0.4rem; }
.ovs-step p { margin: 0; color: var(--ovs-muted); font-size: 0.95rem; }
.ovs-step .ovs-step__num { margin: 0; font-family: var(--wp--preset--font-family--heading); font-size: 0.85rem; font-weight: 700; color: var(--ovs-accent); }

/* ---------- cards ---------- */
.ovs-card {
	position: relative;
	background: var(--ovs-card);
	border: 1px solid var(--ovs-line);
	border-radius: 14px;
	padding: 1.5rem;
	transition: border-color .2s, background-color .2s, transform .2s;
}
.ovs-card:hover { border-color: var(--ovs-accent); background: #18202A; }
.ovs-card h3 { font-size: 1.2rem; margin: 0; }
.ovs-card p { margin: 0.75rem 0 0; color: var(--ovs-muted); font-size: 0.95rem; }
.ovs-card h3 a { color: inherit; text-decoration: none; }
.ovs-card h3 a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.ovs-card__head { gap: 0.75rem; }
.ovs-card .ovs-tag {
	margin: 0;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--ovs-text);
	background: var(--ovs-line-2);
	border-radius: 6px;
	padding: 4px 8px;
}
.ovs-card .ovs-tag--accent { color: var(--ovs-ink); background: var(--ovs-accent); }

/* ---------- GEX panel ---------- */
.ovs-panel {
	background: var(--ovs-card);
	border: 1px solid var(--ovs-line);
	border-radius: 20px;
	padding: clamp(1.5rem, 3vw, 2.25rem);
	align-items: center;
}
.ovs-panel > * { min-width: 0; }
.ovs-panel__copy { flex: 1 1 20rem; }
.ovs-panel__data { flex: 1.4 1 28rem; }

/* ---------- research grid ---------- */
.ovs-post-card {
	position: relative;
	height: 100%;
	background: var(--ovs-card);
	border: 1px solid var(--ovs-line);
	border-radius: 14px;
	overflow: hidden;
	transition: border-color .2s, background-color .2s;
}
.ovs-post-card:hover { border-color: var(--ovs-accent); background: #18202A; }
.ovs-post-card .wp-block-post-featured-image { margin: 0; border-radius: 0; }
.ovs-post-card .wp-block-post-featured-image img { border-radius: 0; }
.ovs-post-card__body { padding: 1rem 1.1rem 1.25rem; }
.ovs-post-card__body > * + * { margin-top: 0.5rem; }
.ovs-post-card .wp-block-post-date { font-size: 0.8rem; }
.ovs-post-card .wp-block-post-title { font-size: 1.05rem; line-height: 1.35; letter-spacing: -0.01em; }
.ovs-post-card .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; }
.ovs-research .wp-block-query-pagination { margin-top: 2rem; font-weight: 600; }

/* ---------- quote band, CTA ---------- */
.ovs-quote { border-top: 1px solid var(--ovs-line); border-bottom: 1px solid var(--ovs-line); }
.ovs-quote p { font-family: var(--wp--preset--font-family--heading); font-size: clamp(1.4rem, 2.6vw, 2.1rem); line-height: 1.3; letter-spacing: -0.02em; max-width: 52rem; margin-inline: auto; }
.ovs-cta {
	background: var(--ovs-accent);
	border-radius: 24px;
	padding: clamp(2rem, 5vw, 3.5rem);
	color: var(--ovs-ink);
	align-items: center;
}
.ovs-cta > * { min-width: 0; }
.ovs-cta h2 { color: var(--ovs-ink); margin: 0; }
.ovs-cta p { margin: 0.75rem 0 0; color: var(--ovs-ink); max-width: 36rem; }
.ovs-cta .wp-block-button__link { background: var(--ovs-bg); border-color: var(--ovs-bg); color: var(--ovs-text); }
.ovs-cta .wp-block-button__link:hover, .ovs-cta .wp-block-button__link:focus { background: #000; border-color: #000; color: #fff; }

/* ---------- brokers strip ---------- */
.ovs-brokers { border-top: 1px solid var(--ovs-line); border-bottom: 1px solid var(--ovs-line); padding: 1.25rem 0; gap: 1rem 2rem; align-items: center; }
.ovs-brokers__label { margin: 0; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ovs-faint); }
.ovs-broker-logo { margin: 0; }
.ovs-broker-logo img { height: 28px !important; width: auto !important; }

/* ---------- footer ---------- */
.ovs-footer { border-top: 1px solid var(--ovs-line); background: #0A0D11; }
.ovs-footer p { margin: 0; }
.ovs-footer a:not(.wp-element-button) { color: var(--ovs-muted); text-decoration: none; }
.ovs-footer a:not(.wp-element-button):hover { color: var(--ovs-text); }
.ovs-footer h2 { margin: 0 0 0.9rem; font-family: var(--wp--preset--font-family--body); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ovs-faint); }
.ovs-footer__status { padding: 1.1rem 0; border-bottom: 1px solid var(--ovs-line); }
.ovs-footer__cols { padding: var(--wp--preset--spacing--40) 0; }
.ovs-footer__brand { flex: 1 1 18rem; max-width: 26rem; }
.ovs-footer__brand .wp-block-site-tagline { margin: 0; line-height: 1.5; }
.ovs-footer__brand .wp-block-buttons { margin-top: 0.4rem; }
.ovs-footer__links { flex: 2 1 32rem; justify-content: flex-end; }
.ovs-footer__col { min-width: 9rem; }
.ovs-footer__col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.6rem; }
.ovs-footer__col li { margin: 0; }
.ovs-footer__col a { font-size: 0.95rem; }
.ovs-footer__col .ovs-footer__cats { margin-top: 0.6rem; }
.ovs-footer__bottom { padding-top: var(--wp--preset--spacing--20); border-top: 1px solid var(--ovs-line); align-items: flex-start; }
.ovs-footer__disclaimer { flex: 1 1 28rem; max-width: 46rem; line-height: 1.6; }
.ovs-footer__legal { align-items: center; }
@media (max-width: 1023px) { .ovs-footer__links { justify-content: flex-start; } }

/* ---------- motion ---------- */
@keyframes ovs-rise { from { opacity: 0; transform: translateY(24px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes ovs-tick { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes ovs-blink { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }
@media (prefers-reduced-motion: reduce) {
	.ovs-window, .ovs-last, .ovs-eyebrow::before, .ovs-window__state::before { animation: none; }
	.ovs-card, .ovs-post-card { transition: none; }
}

/* ---------- content pages (templates/page-desk.html) ---------- */
.ovs-desk-page .ovs-hero-title { margin: 0; }
.ovs-lede--wide { max-width: 46rem; }
.wp-block-post-content > .ovs-page-section { margin-top: var(--wp--preset--spacing--40); }
.ovs-page-section > h2 { margin: 0 0 1.5rem; }
.ovs-cta a:not(.wp-block-button__link) { color: var(--ovs-ink); text-decoration: underline; }
.ovs-cta a:not(.wp-block-button__link):hover { color: #000; }
.ovs-step .ovs-step__num + p { margin-top: 0.6rem; }
.ovs-note {
	background: var(--ovs-card);
	border: 1px solid var(--ovs-line);
	border-radius: 16px;
	padding: clamp(1.5rem, 3vw, 2.25rem);
}
.ovs-note p { margin: 0; color: var(--ovs-muted); max-width: 52rem; }
.ovs-tile { background: var(--ovs-bg); border: 1px solid var(--ovs-line); border-radius: 12px; padding: 1.1rem 1.2rem; }
.ovs-tile .ovs-tile__label { margin: 0; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ovs-accent); }
.ovs-tile h3 { margin: 0.35rem 0 0.25rem; font-size: 1.15rem; }
.ovs-tile p:not(.ovs-tile__label) { margin: 0; font-size: 0.92rem; color: var(--ovs-muted); }
.ovs-broker-card { display: flex; flex-direction: column; }
.ovs-broker-card .is-logo-tile { margin: 0; }
.ovs-broker-card .is-logo-tile img { height: 44px; width: auto; }
.ovs-broker-card .wp-block-buttons { margin-top: auto; padding-top: 1.25rem; }

/* anchors land below the sticky header */
[id] { scroll-margin-top: 96px; }

/* ---------- long-form document (privacy policy) ---------- */
.ovs-chip { display: inline-block; margin: 1rem 0 0; padding: 0.35rem 0.8rem; border: 1px solid var(--ovs-line-2); border-radius: 999px; font-size: 0.85rem; color: var(--ovs-muted); }
.ovs-chip em { font-style: normal; }
.ovs-doc { align-items: flex-start; }
.ovs-toc {
	flex: 0 1 15rem;
	position: sticky;
	top: 100px;
	background: var(--ovs-card);
	border: 1px solid var(--ovs-line);
	border-radius: 14px;
	padding: 1.1rem 1rem;
}
.admin-bar .ovs-toc { top: 132px; }
.ovs-toc .ovs-toc__label { margin: 0 0 0.6rem 0.5rem; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ovs-faint); }
.ovs-toc ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.ovs-toc li { margin: 0; }
.ovs-toc a { display: block; padding: 0.4rem 0.5rem; border-radius: 8px; font-size: 0.9rem; line-height: 1.35; color: var(--ovs-muted); text-decoration: none; }
.ovs-toc a:hover, .ovs-toc a:focus { background: var(--ovs-line); color: var(--ovs-text); text-decoration: none; }
.ovs-prose { flex: 999 1 30rem; min-width: 0; max-width: 46rem; }
.ovs-prose > * { margin-top: 0; }
.ovs-prose h2 { font-size: 1.45rem; margin: 2.25rem 0 0.75rem; padding-top: 2rem; border-top: 1px solid var(--ovs-line); }
.ovs-prose h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.ovs-prose p { margin: 0 0 1rem; color: var(--ovs-muted); line-height: 1.75; }
.ovs-prose strong { color: var(--ovs-text); }
@media (max-width: 900px) {
	.ovs-toc { position: static; flex-basis: 100%; }
	.ovs-toc ul { flex-direction: row; flex-wrap: wrap; gap: 6px; }
	.ovs-toc a { background: var(--ovs-bg); border: 1px solid var(--ovs-line); padding: 0.35rem 0.7rem; font-size: 0.85rem; }
}

/* ---------- single posts (templates/single.html) ---------- */
.ovs-post-meta { gap: 0.6rem 1rem; align-items: center; font-size: 0.9rem; }
.ovs-post-cats a {
	display: inline-block;
	padding: 4px 10px;
	border-radius: 6px;
	background: var(--ovs-accent);
	color: var(--ovs-ink);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
}
.ovs-post-cats a:hover { background: #5EEAD4; color: var(--ovs-ink); text-decoration: none; }
.ovs-post-cats .wp-block-post-terms__separator { display: none; }
.ovs-post-meta .wp-block-post-date { font-size: 0.9rem; }
.ovs-post-title { margin: 1rem 0 0; max-width: 60rem; font-size: clamp(2rem, 4.2vw, 3.4rem); line-height: 1.08; letter-spacing: -0.03em; }
.ovs-post-feature { margin: 0 0 var(--wp--preset--spacing--40); }
.ovs-post-feature img { border-radius: 16px; border: 1px solid var(--ovs-line); }

.ovs-post-body { font-size: 1.075rem; }
.ovs-post-body p, .ovs-post-body li { color: #CBD3DE; line-height: 1.75; }
.ovs-post-body strong { color: var(--ovs-text); }
.ovs-post-body h2 { margin-top: 2.75rem; font-size: clamp(1.5rem, 2.6vw, 2rem); }
.ovs-post-body h3 { margin-top: 2rem; font-size: 1.3rem; }
.ovs-post-body h2 + *, .ovs-post-body h3 + * { margin-top: 0.75rem; }
.ovs-post-body a:not(.wp-element-button) { text-decoration: underline; text-decoration-color: rgba(45, 212, 191, 0.45); text-underline-offset: 3px; }
.ovs-post-body a:not(.wp-element-button):hover { text-decoration-color: currentColor; }
.ovs-post-body ul, .ovs-post-body ol { padding-left: 1.4rem; }
.ovs-post-body li + li { margin-top: 0.4rem; }
.ovs-post-body li::marker { color: var(--ovs-accent); }
.ovs-post-body :not(pre) > code { padding: 0.1em 0.35em; border-radius: 4px; background: var(--ovs-line-2); color: var(--ovs-text); font-size: 0.9em; }
.ovs-post-body hr.wp-block-separator { border-color: var(--ovs-line); margin-block: var(--wp--preset--spacing--40); }
.ovs-post-body .wp-block-embed iframe { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border-radius: 14px; border: 1px solid var(--ovs-line); background: #000; }
.ovs-post-body .wp-block-embed { margin-block: 0 var(--wp--preset--spacing--30); }
.ovs-post-body .wp-block-table { overflow-x: auto; margin-block: 1.75rem; background: var(--ovs-card); border: 1px solid var(--ovs-line); border-radius: 14px; }
.ovs-post-body .wp-block-table table { width: 100%; border-collapse: collapse; font-size: 0.95rem; font-variant-numeric: tabular-nums; }
.ovs-post-body .wp-block-table th, .ovs-post-body .wp-block-table td { padding: 0.7rem 1rem; text-align: left; border: 0; border-bottom: 1px solid var(--ovs-line); }
.ovs-post-body .wp-block-table thead { border: 0; }
.ovs-post-body .wp-block-table th { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ovs-faint); }
.ovs-post-body .wp-block-table td { color: #CBD3DE; }
.ovs-post-body .wp-block-table tr:last-child td { border-bottom: 0; }
.ovs-post-body .wp-block-table figcaption { padding: 0.6rem 1rem; color: var(--ovs-faint); }
.ovs-post-body .wp-block-quote { border: 1px solid var(--ovs-line); background: var(--ovs-card); }
.ovs-post-body .ovisual-rp404-notice { border: 1px solid var(--ovs-accent); border-radius: 14px; background: var(--ovs-card); opacity: 1; }
.ovs-post-tags { margin-top: var(--wp--preset--spacing--30); }
.ovs-post-tags:empty { display: none; }

.ovs-post-nav > * {
	position: relative;
	flex: 1 1 18rem;
	min-width: 0;
	margin: 0;
	padding: 1.1rem 1.25rem;
	border: 1px solid var(--ovs-line);
	border-radius: 14px;
	background: var(--ovs-card);
	transition: border-color .2s, background-color .2s;
}
.ovs-post-nav > *:hover { border-color: var(--ovs-accent); background: #18202A; }
.ovs-post-nav a { color: var(--ovs-text); text-decoration: none; font-family: var(--wp--preset--font-family--heading); font-weight: 600; line-height: 1.35; }
.ovs-post-nav a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.ovs-post-nav .post-navigation-link__label { display: block; margin-bottom: 0.3rem; font-family: var(--wp--preset--font-family--body); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ovs-faint); }
.ovs-post-nav [class*="__arrow"] { color: var(--ovs-accent); }
@media (prefers-reduced-motion: reduce) { .ovs-post-nav > * { transition: none; } }
/* video summary box (aside.ovs-summary in post content) */
.ovs-post-body .ovs-summary {
	box-sizing: border-box;
	margin-block: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	padding: clamp(1.25rem, 3vw, 1.75rem);
	background: var(--ovs-card);
	border: 1px solid var(--ovs-line);
	border-radius: 16px;
}
.ovs-post-body .ovs-summary::before {
	content: "Summary";
	display: block;
	margin-bottom: 0.6rem;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ovs-accent);
}
.ovs-post-body .ovs-summary p { margin: 0; }
.ovs-post-body .ovs-summary .ovs-credit { margin-top: 1rem; padding-top: 0.9rem; border-top: 1px solid var(--ovs-line); font-size: 0.85rem; color: var(--ovs-faint); }

/* ---------- archives (templates/archive.html) ---------- */
.ovs-archive .ovs-hero-title { margin-bottom: 0; }
.ovs-archive .wp-block-term-description { margin-top: 1rem; }
.ovs-archive .wp-block-term-description p { margin: 0; }
.ovs-cat-nav { margin-top: var(--wp--preset--spacing--30); gap: 8px; align-items: center; }
.ovs-cat-nav p, .ovs-cat-nav ul { margin: 0; }
.ovs-cat-nav ul { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; list-style: none; }
.ovs-cat-nav li { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 0 12px 0 0; border: 1px solid var(--ovs-line-2); border-radius: 999px; background: var(--ovs-card); color: var(--ovs-faint); font-size: 0.85rem; }
.ovs-cat-nav .ovs-cat-all a, .ovs-cat-nav li a { display: inline-block; padding: 8px 4px 8px 14px; color: var(--ovs-muted); font-size: 0.85rem; font-weight: 600; text-decoration: none; }
.ovs-cat-nav .ovs-cat-all a { padding: 8px 14px; border: 1px solid var(--ovs-line-2); border-radius: 999px; background: var(--ovs-card); }
.ovs-cat-nav li:hover, .ovs-cat-nav .ovs-cat-all a:hover { border-color: var(--ovs-accent); }
.ovs-cat-nav li a:hover, .ovs-cat-nav .ovs-cat-all a:hover { color: var(--ovs-text); text-decoration: none; }
.ovs-cat-nav li.current-cat { background: var(--ovs-accent); border-color: var(--ovs-accent); color: var(--ovs-ink); }
.ovs-cat-nav li.current-cat a { color: var(--ovs-ink); }

/* ---------- search form (search page, 404 page, random-post notice) ---------- */
.wp-block-search .wp-block-search__inside-wrapper {
	max-width: 36rem;
	padding: 5px;
	border: 1px solid var(--ovs-line-2);
	border-radius: 12px;
	background: var(--ovs-card);
}
.wp-block-search .wp-block-search__inside-wrapper:focus-within { border-color: var(--ovs-accent); }
.wp-block-search .wp-block-search__input {
	min-height: 44px;
	padding: 0 0.9rem;
	border: 0;
	border-radius: 8px;
	background: transparent;
	color: var(--ovs-text);
	font: inherit;
	font-size: 1rem;
}
.wp-block-search .wp-block-search__input::placeholder { color: var(--ovs-faint); opacity: 1; }
.wp-block-search .wp-block-search__input:focus { outline: none; }
.wp-block-search .wp-block-search__button { margin-left: 5px; padding: 0.6rem 1.1rem; border-radius: 8px; }
.ovs-search { margin-top: var(--wp--preset--spacing--30); }
.ovs-search-page .ovs-hero-title { overflow-wrap: anywhere; }

/* ---------- 404 + empty results ---------- */
.ovs-404-code {
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: clamp(4.5rem, 12vw, 9rem);
	font-weight: 700;
	line-height: 0.9;
	letter-spacing: -0.05em;
	color: var(--ovs-accent);
}
.ovs-note h2 { margin: 0 0 0.6rem; font-size: 1.5rem; }
.ovs-note .ovs-cat-nav { margin-top: 1.25rem; }

/* ---------- header search (core/search, icon button, field opens over the menu) ---------- */
.ovs-header-tools { align-items: center; }
.ovs-header-search { margin: 0; }
.ovs-header-search .wp-block-search__inside-wrapper {
	position: relative;
	max-width: none;
	padding: 0;
	border: 0;
	background: none;
	overflow: visible !important;
}
.ovs-header-search .wp-block-search__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0;
	padding: 0;
	border: 1px solid var(--ovs-line-2);
	border-radius: 10px;
	background: var(--ovs-surface);
	color: var(--ovs-text);
}
.ovs-header-search .wp-block-search__button:hover,
.ovs-header-search .wp-block-search__button:focus-visible,
.ovs-header-search .wp-block-search__button[aria-expanded="true"] { border-color: var(--ovs-accent); background: var(--ovs-surface); color: var(--ovs-accent); }
.ovs-header-search .wp-block-search__button svg { width: 20px; height: 20px; min-width: 0; min-height: 0; fill: currentColor; }
.ovs-header-search .wp-block-search__input {
	position: absolute;
	top: 50%;
	right: calc(100% + 8px);
	z-index: 60;
	width: min(20rem, calc(100vw - 6rem)) !important;
	height: 44px;
	margin: 0;
	padding: 0 0.9rem !important;
	border: 1px solid var(--ovs-accent) !important;
	border-radius: 10px;
	background: var(--ovs-card);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45);
	transform: translateY(-50%);
	transition: opacity .15s ease, transform .15s ease;
}
.ovs-header-search.wp-block-search__searchfield-hidden .wp-block-search__input {
	opacity: 0;
	pointer-events: none;
	transform: translateY(-50%) translateX(8px);
}
@media (prefers-reduced-motion: reduce) { .ovs-header-search .wp-block-search__input { transition: none; } }

/* Tablet and phone header: the full menu plus search and the CTA do not fit below ~960px,
   so switch the navigation to its overlay (WordPress's own breakpoint is 600px) and lay
   the bar out as  brand | search + CTA | menu  on one row. */
@media (max-width: 959px) {
	.ovs-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.ovs-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
	.ovs-header .alignwide > .ovs-nav { order: 3; }
	.ovs-header .ovs-header-tools { margin-left: auto; }
	/* the search field opens as a full-width bar under the header instead of to the left */
	.ovs-header-search .wp-block-search__input {
		position: fixed;
		top: 86px;
		left: 16px;
		right: 16px;
		width: auto !important;
		transform: none;
	}
	.ovs-header-search.wp-block-search__searchfield-hidden .wp-block-search__input { transform: translateY(-6px); }
}
@media (min-width: 601px) and (max-width: 959px) {
	.admin-bar .ovs-header-search .wp-block-search__input { top: calc(86px + var(--wp-admin--admin-bar--height, 46px)); }
}
@media (max-width: 480px) {
	.ovs-header .alignwide { gap: 8px; }
	.ovs-header .ovs-header-tools { gap: 8px; }
	.ovs-header-actions .wp-block-button__link { padding: 0.5rem 0.7rem; font-size: 0.82rem; }
	.ovs-header-search .wp-block-search__button { width: 40px; height: 40px; }
	.ovs-header-search .wp-block-search__input { top: 78px; }
}
@media (max-width: 359px) { .ovs-header .ovs-header-actions { display: none; } }

/* Single-post reading column: 760px (set in theme.json styles.css), centred, with the post
   header centred above it; videos, images and code listings keep the wide width. */
.ovs-post-head { text-align: center; }
.ovs-post-head .ovs-post-meta { justify-content: center; }
.ovs-post-head .ovs-post-title { margin-inline: auto; }
.single .ovs-post-body.is-layout-constrained > :is(.wp-block-embed, .wp-block-image, .wp-block-video, .fv-code, .fv-code-label) {
	max-width: var(--wp--style--global--wide-size);
}
.single .ovs-post-body.is-layout-constrained > :is(.wp-block-embed, .wp-block-image, .wp-block-video, .wp-block-table, .fv-code, .fv-code-label) { box-sizing: border-box; }
/* the code listing label is an inline-block tab: pin it to the code block's (wide, centred) left edge */
.single .ovs-post-body.is-layout-constrained > .fv-code-label {
	display: block;
	width: fit-content;
	margin-left: max(0px, calc((100% - var(--wp--style--global--wide-size)) / 2)) !important;
	margin-right: auto !important;
}

/* ---------- search box in the ☰ menu (core/search inside navigation 6, class ovs-menu-search) ----------
   Hidden in the inline desktop menu, shown at the top of the open overlay. */
.ovs-nav .ovs-menu-search,
.ovs-nav li:has(> .ovs-menu-search) { display: none; }
.ovs-nav .is-menu-open li:has(> .ovs-menu-search) { display: block; width: 100%; }
.ovs-nav .is-menu-open .ovs-menu-search { display: block; width: 100%; margin: 0 0 1.25rem; }
.ovs-nav .is-menu-open .ovs-menu-search .wp-block-search__inside-wrapper { max-width: none; }
.ovs-nav .is-menu-open .ovs-menu-search .wp-block-search__input { font-size: 1rem; }
