/* ============================================================
   Apex Gym Skin — Fully Corrected & Optimized Master Edition
   Pitch-black background, red accent, bold uppercase typography,
   sharp rectangular shapes — combat sports / gym aesthetic.
   Loaded via wp_add_inline_style after the main stylesheet.
   ============================================================ */

/* ── 1. CSS Variables Scope ── */
body.nomad-theme {
	--apex-red:          #e63030;
	--apex-red-rgb:      230, 48, 48;
	--apex-red-light:    #ff6b6b;
	--apex-red-bg:       rgb(230 48 48 / 0.15);
	--apex-red-border:   rgb(230 48 48 / 0.40);
	--apex-bg-dark:      #0d0d0d;
	--apex-border-dark:  rgba(255, 255, 255, 0.07);
	--apex-radius-sm:    3px;
	--apex-radius-card:  4px;
	--apex-ease:         cubic-bezier(0.4, 0, 0.2, 1);
	--apex-glow:         0 0 0 1px var(--apex-red), 0 8px 24px rgb(230 48 48 / 0.18);
}

/* ── 2. Accessibility & Focus Ring ── */
body.nomad-theme :is(a, button):focus-visible {
	outline: 2px solid var(--apex-red) !important;
	outline-offset: 3px !important;
}

/* ── 3. Typography: Grouped Uppercase Heavy Headings ── */
body.nomad-theme :is(
	h1, h2, h3,
	.nt-heading,
	.nt-case-heading,
	.nt-section-heading__title,
	.nt-art-hero__title,
	.nt-blog-page__title
) {
	text-transform: uppercase;
	letter-spacing: 0.04em;
	font-weight: 900;
}

/* ── 4. Buttons & CTAs ── */
body.nomad-theme :is(.nt-btn, .nt-btn--primary, .nt-btn--secondary, .nt-btn--sm) {
	border-radius: var(--apex-radius-sm) !important;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-weight: 800;
	transition: background-color 0.2s var(--apex-ease),
	            border-color 0.2s var(--apex-ease),
	            color 0.2s var(--apex-ease),
	            transform 0.2s var(--apex-ease),
	            box-shadow 0.2s var(--apex-ease);
}

body.nomad-theme .nt-btn--primary:hover {
	background-color: var(--apex-red) !important;
	border-color: var(--apex-red) !important;
	box-shadow: 0 4px 16px rgb(var(--apex-red-rgb) / 0.35);
}

/* ── 5. Navigation & Header ── */
body.nomad-theme .nt-site-header {
	padding: 0;
	background: var(--apex-bg-dark);
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

body.nomad-theme .nt-site-header__inner {
	background: transparent !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	padding: 0.875rem 1.5rem !important;
}

body.nomad-theme .nt-pill-nav__list {
	background: transparent !important;
	border-radius: 0 !important;
	gap: 0.25rem;
}

body.nomad-theme .nt-pill-nav__list > li > a {
	border-radius: 0 !important;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 0.8125rem;
	font-weight: 700;
	padding: 0.5rem 1rem;
	transition: background-color 0.2s var(--apex-ease), color 0.2s var(--apex-ease);
}

body.nomad-theme .nt-pill-nav__list > li:is(:hover, .current-menu-item, .current_page_item) > a {
	background: var(--apex-red-bg) !important;
	color: var(--apex-red) !important;
	box-shadow: none !important;
}

/* Nav Action Buttons */
body.nomad-theme .nt-actions-nav > li > a {
	border-radius: 0;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 0.8125rem;
	font-weight: 700;
	transition: color 0.2s var(--apex-ease), background-color 0.2s var(--apex-ease);
}

body.nomad-theme .nt-actions-nav > li:is(.button, .nav-cta) > a {
	border-radius: var(--apex-radius-sm) !important;
	background-color: var(--apex-red) !important;
	color: #ffffff !important;
	font-weight: 800;
	letter-spacing: 0.08em;
	padding: 0.5rem 1.25rem;
}

body.nomad-theme .nt-actions-nav > li:is(.button, .nav-cta) > a:hover {
	box-shadow: 0 4px 16px rgb(var(--apex-red-rgb) / 0.4) !important;
}

/* ── 6. Grouped Cards Base & Glow Hover ── */
body.nomad-theme :is(
	.nt-card,
	.nt-pricing-card,
	.nt-blog-card,
	.nt-team-card,
	.nt-team__member,
	.nt-comparison-callout__card
) {
	border-radius: var(--apex-radius-card) !important;
	border: 1px solid var(--apex-border-dark);
	transition: border-color 0.25s var(--apex-ease),
	            box-shadow 0.25s var(--apex-ease),
	            transform 0.25s var(--apex-ease);
}

body.nomad-theme :is(
	.nt-card,
	.nt-blog-card,
	.nt-team-card,
	.nt-team__member
):hover {
	border-color: var(--apex-red);
	box-shadow: var(--apex-glow) !important;
	transform: translateY(-2px);
}

/* ── 7. Grouped Badges, Unit Tags & Markers ── */
body.nomad-theme :is(
	.nt-badge,
	.nt-icon-list__marker,
	.nt-team__unit-tag,
	.nt-team-card__tag,
	.nt-team-card__role,
	.nt-team__role
) {
	background: var(--apex-red-bg) !important;
	border: 1px solid var(--apex-red-border) !important;
	color: var(--apex-red-light) !important;
	border-radius: var(--apex-radius-sm) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.08em !important;
	font-weight: 800 !important;
	font-size: 0.725rem !important;
	padding: 0.25rem 0.65rem !important;
	display: inline-block;
}

body.nomad-theme .nt-icon-list__marker {
	color: var(--apex-red) !important;
}

/* ── 8. Section Headings, FAQ & Features ── */
body.nomad-theme .nt-section-heading__eyebrow {
	color: var(--apex-red);
	letter-spacing: 0.15em;
	font-weight: 800;
	text-transform: uppercase;
}

body.nomad-theme .nt-faq__question {
	text-transform: uppercase;
	letter-spacing: 0.04em;
	font-size: 0.9rem;
	font-weight: 800;
}

body.nomad-theme .nt-faq__icon {
	color: var(--apex-red);
}

/* ── 9. Pricing & Featured Callouts ── */
body.nomad-theme .nt-pricing-card--featured {
	border-color: var(--apex-red) !important;
	box-shadow: 0 0 0 2px var(--apex-red), 0 12px 32px rgb(var(--apex-red-rgb) / 0.2) !important;
}

/* ── 10. Grouped Full Red Bands (Analytics, CTAs) ── */
body.nomad-theme :is(
	.nt-analytics-bar,
	.nt-cta-wrap,
	.nt-section--dark .nt-cta-banner
) {
	background: var(--apex-red) !important;
}

body.nomad-theme .nt-analytics-bar :is(.nt-stat__value, .nt-stat__label) {
	color: #ffffff !important;
}

body.nomad-theme .nt-stat__label {
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-size: 0.7rem;
	font-weight: 800;
}

body.nomad-theme .nt-stat__value {
	font-weight: 900;
}

body.nomad-theme .nt-section--border {
	border-top-color: var(--apex-red-bg);
}

/* ── 11. Masonry Grid Protection & Restoration ── */
body.nomad-theme :is(
	.nt-masonry,
	.nt-grid--masonry,
	.nt-blog-grid--masonry,
	.nt-cards-grid--masonry,
	[data-masonry]
) {
	align-items: flex-start !important;
}

body.nomad-theme :is(
	.nt-masonry,
	.nt-grid--masonry,
	.nt-blog-grid--masonry,
	.nt-cards-grid--masonry,
	[data-masonry]
) > :is(.nt-card, .nt-blog-card, .nt-team-card, .nt-portfolio-card) {
	height: auto !important;
	break-inside: avoid !important;
	-webkit-column-break-inside: avoid !important;
	margin-bottom: 1.5rem;
}

body.nomad-theme :is(
	.nt-masonry,
	.nt-grid--masonry,
	.nt-blog-grid--masonry,
	.nt-cards-grid--masonry
) > :is(.nt-card, .nt-blog-card, .nt-team-card):hover {
	transform: none !important;
	border-color: var(--apex-red) !important;
	box-shadow: var(--apex-glow) !important;
}

/* ── 12. Media Queries ── */
@media (max-width: 859px) {
	body.nomad-theme .nt-site-header__inner {
		border-radius: 0 !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.nomad-theme * {
		animation-duration: 0.01ms !important;
		transition-duration: 0.01ms !important;
	}
}

/* ── Section tint — visible contrast on dark background ─── */
body.nomad-theme .nt-section--tint {
	background: rgba(255,255,255,.04);
}

/* ── Article content — white text on dark background ─────── */
body.nomad-theme .nt-article-content {
	color: var(--nt-slate-text);
}
body.nomad-theme .nt-article-content code {
	background: rgba(255,255,255,.08);
	color: #f5f5f5;
}
body.nomad-theme .nt-article-content blockquote {
	background: rgba(255,255,255,.04);
	border-left-color: var(--apex-red);
}
body.nomad-theme .nt-article-author {
	border-top-color: rgba(255,255,255,.08);
}
body.nomad-theme .nt-comments__list .comment-body {
	border-bottom-color: rgba(255,255,255,.08);
}

/* ── Sunken panels ───────────────────────────────────────── */
body.nomad-theme .nt-sunken {
	background: rgba(255,255,255,.04);
	box-shadow: inset 1px 1px 4px rgba(0,0,0,.3), inset -1px -1px 4px rgba(255,255,255,.03);
}

/* ── Badges — ensure readable on dark ───────────────────── */
body.nomad-theme .nt-badge {
	background: var(--apex-red-bg) !important;
	border-color: var(--apex-red-border) !important;
	color: var(--apex-red-light) !important;
}

/* ── Section border ──────────────────────────────────────── */
body.nomad-theme .nt-section--border {
	border-top-color: rgba(255,255,255,.06);
}
