/* ==========================================================================
   GoBeastTV — design tokens and components
   Every value is taken from the delivered nova-stream.html.
   Breakpoints: compact < 1024px, phone < 700px.
   ========================================================================== */

:root {
	--nova-primary: #E50920;
	--nova-primary-hover: #FF3048;
	--nova-bg: #05070D;
	--nova-surface: #0B101A;
	--nova-text: #F7F8FA;
	--nova-muted: #A7AFBE;
	--nova-body: #C4CBD8;
	--nova-subtle: #6C7686;
	--nova-border: rgba(255, 255, 255, 0.12);
	--nova-border-soft: rgba(255, 255, 255, 0.10);
	--nova-border-strong: rgba(255, 255, 255, 0.14);
	--nova-accent-soft: rgba(229, 9, 32, 0.12);
	--nova-accent-border: rgba(229, 9, 32, 0.35);
	--nova-rating: #FF8A98;
	--nova-error: #FF6273;

	--nova-radius-btn: 12px;
	--nova-radius-card: 14px;
	--nova-radius-block: 18px;

	--nova-shadow-red: 0 16px 38px -16px rgba(229, 9, 32, 0.95);
	--nova-shadow-red-sm: 0 12px 30px -14px rgba(229, 9, 32, 0.95);

	--nova-max: 1320px;
	--nova-gutter: clamp(16px, 4vw, 32px);

	--nova-head: 'Poppins', system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
	--nova-body-font: 'Manrope', system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

body.nova-shell,
body.nova-shell *,
body.nova-shell *::before,
body.nova-shell *::after {
	box-sizing: border-box;
}

body.nova-shell {
	font-family: var(--nova-body-font);
	background: var(--nova-bg);
	color: var(--nova-text);
	-webkit-font-smoothing: antialiased;
}

html {
	scroll-behavior: smooth;
}

.nova-shell a {
	color: var(--nova-text);
	text-decoration: none;
}

.nova-shell a:hover {
	color: var(--nova-primary-hover);
}

.nova-shell button,
.nova-shell input,
.nova-shell select,
.nova-shell textarea {
	font-family: inherit;
}

.nova-shell :focus-visible {
	outline: 3px solid var(--nova-primary-hover);
	outline-offset: 3px;
	border-radius: 6px;
}

.nova-shell ::selection {
	background: var(--nova-primary);
	color: #fff;
}

.nova-shell input::placeholder,
.nova-shell textarea::placeholder {
	color: var(--nova-subtle);
}

.nova-shell h1,
.nova-shell h2,
.nova-shell h3 {
	text-wrap: balance;
}

.nova-shell p {
	text-wrap: pretty;
}

.nova-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

@keyframes novaSpin {
	to {
		transform: rotate(360deg);
	}
}

@keyframes novaRise {
	from {
		opacity: 0;
		transform: translateY(14px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

/* --------------------------------------------------------------------------
   Shell
   -------------------------------------------------------------------------- */

.nova-shell__inner {
	width: 100%;
	max-width: var(--nova-max);
	margin: 0 auto;
	padding-left: var(--nova-gutter);
	padding-right: var(--nova-gutter);
}

.nova-shell__inner--narrow {
	max-width: 980px;
}

.nova-main {
	display: block;
}

/* Elementor wrappers must not clip the full-bleed sections. */
.nova-shell .elementor-section,
.nova-shell .e-con,
.nova-shell .e-con-inner,
.nova-shell .elementor-widget-container {
	max-width: none;
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.nova-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	white-space: nowrap;
	min-height: 52px;
	padding: 0 24px;
	border-radius: var(--nova-radius-btn);
	border: 1px solid transparent;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	transition: background 200ms ease, border-color 200ms ease, color 200ms ease, transform 200ms ease;
}

.nova-btn--sm {
	min-height: 44px;
	padding: 0 18px;
	font-size: 14px;
}

.nova-btn--primary {
	background: var(--nova-primary);
	border-color: var(--nova-primary);
	color: #fff;
	box-shadow: var(--nova-shadow-red);
}

.nova-btn--primary:hover,
.nova-btn--primary:focus-visible {
	background: var(--nova-primary-hover);
	border-color: var(--nova-primary-hover);
	color: #fff;
	transform: translateY(-1px);
}

.nova-btn--ghost {
	border-color: var(--nova-border-strong);
	background: rgba(255, 255, 255, 0.04);
	color: var(--nova-text);
	font-weight: 600;
}

.nova-btn--ghost:hover,
.nova-btn--ghost:focus-visible {
	background: rgba(255, 255, 255, 0.10);
	border-color: rgba(255, 255, 255, 0.30);
	color: var(--nova-text);
}

.nova-btn--outline {
	background: transparent;
	border-color: rgba(255, 255, 255, 0.18);
	color: #fff;
}

.nova-btn--outline:hover,
.nova-btn--outline:focus-visible {
	background: var(--nova-primary-hover);
	border-color: var(--nova-primary-hover);
	color: #fff;
}

.nova-btn--glass {
	background: rgba(11, 16, 26, 0.72);
	border-color: rgba(255, 255, 255, 0.16);
	color: var(--nova-text);
	font-weight: 600;
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}

.nova-btn--glass:hover,
.nova-btn--glass:focus-visible {
	background: rgba(255, 255, 255, 0.10);
	border-color: rgba(255, 255, 255, 0.34);
	color: var(--nova-text);
}

.nova-btn--disabled,
.nova-btn[disabled] {
	min-height: 44px;
	padding: 0 16px;
	border: 1px dashed rgba(255, 255, 255, 0.18);
	background: transparent;
	color: var(--nova-subtle);
	font-size: 13.5px;
	font-weight: 600;
	cursor: not-allowed;
	box-shadow: none;
	transform: none;
}

.nova-iconbtn {
	width: 44px;
	height: 44px;
	border-radius: var(--nova-radius-btn);
	border: 1px solid var(--nova-border-strong);
	background: rgba(255, 255, 255, 0.04);
	color: var(--nova-text);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background 200ms ease, border-color 200ms ease;
}

.nova-iconbtn:hover,
.nova-iconbtn:focus-visible {
	background: rgba(255, 255, 255, 0.10);
	border-color: rgba(255, 255, 255, 0.3);
}

/* --------------------------------------------------------------------------
   Skip link and progress bar
   -------------------------------------------------------------------------- */

.nova-skip {
	position: fixed;
	left: 16px;
	top: -80px;
	z-index: 200;
	background: var(--nova-primary);
	color: #fff;
	font-weight: 700;
	font-size: 15px;
	padding: 12px 18px;
	border-radius: 12px;
	transition: top 200ms ease;
}

.nova-skip:focus,
.nova-skip:focus-visible {
	top: 16px;
	color: #fff;
}

.nova-progress {
	position: fixed;
	inset: 0 0 auto 0;
	height: 3px;
	z-index: 120;
	pointer-events: none;
}

.nova-progress__bar {
	display: block;
	height: 100%;
	width: 0;
	opacity: 0;
	background: linear-gradient(90deg, var(--nova-primary), var(--nova-primary-hover));
	transition: width 300ms ease, opacity 300ms ease;
}

.nova-progress.is-loading .nova-progress__bar {
	width: 82%;
	opacity: 1;
}

.nova-progress.is-done .nova-progress__bar {
	width: 100%;
	opacity: 0;
}

/* --------------------------------------------------------------------------
   Announcement strip
   -------------------------------------------------------------------------- */

.nova-strip {
	background: var(--nova-surface);
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.nova-strip__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding-top: 9px;
	padding-bottom: 9px;
}

.nova-strip__left {
	margin: 0;
	display: flex;
	align-items: center;
	gap: 9px;
	font-size: 13px;
	color: var(--nova-muted);
	line-height: 1.4;
}

.nova-strip__right {
	margin: 0;
	font-size: 13px;
	color: var(--nova-subtle);
}

.nova-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: rgba(229, 9, 32, 0.14);
	border: 1px solid rgba(229, 9, 32, 0.42);
	color: var(--nova-primary-hover);
	font-family: var(--nova-head);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.14em;
	padding: 3px 8px;
	border-radius: 999px;
	white-space: nowrap;
}

@media (max-width: 1023.98px) {
	.nova-strip__right {
		display: none;
	}
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */

.nova-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: rgba(5, 7, 13, 0.88);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}

.nova-header__inner {
	height: 82px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
}

.nova-logo {
	display: inline-flex;
	align-items: center;
	gap: 11px;
	flex: 0 0 auto;
}

.nova-logo:hover {
	color: inherit;
}

.nova-logo__mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 10px;
	background: var(--nova-primary);
	box-shadow: 0 8px 22px -10px rgba(229, 9, 32, 0.95);
}

.nova-logo__mark--sm {
	width: 30px;
	height: 30px;
	border-radius: 9px;
	box-shadow: none;
}

.nova-logo__text {
	font-family: var(--nova-head);
	font-weight: 800;
	font-size: clamp(17px, 2vw, 21px);
	letter-spacing: -0.01em;
	white-space: nowrap;
	color: var(--nova-text);
}

.nova-logo__nova {
	color: var(--nova-primary);
}

/* The bar carries seven links plus two calls to action and the language pair,
   and the French labels are the longest set: 646px of link text against a
   1256px content box once the logo and the actions have taken their share.

   The row must not shrink. A shrunken flex item does not shorten `nowrap`
   links, it lets them run over whatever sits next — which put "Contact" under
   the language switch. It keeps its natural width, the type and the gap are
   sized so that width fits, and below the point where it stops fitting the
   burger takes over rather than a squeezed bar. */
.nova-nav {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
}

.nova-nav__link {
	position: relative;
	display: inline-flex;
	align-items: center;
	height: 44px;
	padding: 0 4px;
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
	color: var(--nova-muted);
	transition: color 200ms ease;
}

.nova-nav__link:hover,
.nova-nav__link:focus-visible {
	color: #fff;
}

.nova-nav__underline {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 12px;
	height: 2px;
	border-radius: 2px;
	background: var(--nova-primary);
	opacity: 0;
	transition: opacity 200ms ease;
}

.nova-nav__link.is-current {
	color: #fff;
}

.nova-nav__link.is-current .nova-nav__underline {
	opacity: 1;
}

.nova-header__actions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex: 0 0 auto;
}

.nova-header__actions .nova-btn {
	min-height: 44px;
}

.nova-header__actions .nova-btn--primary {
	box-shadow: var(--nova-shadow-red-sm);
	padding: 0 20px;
}

.nova-burger {
	display: none;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 12px;
	border: 1px solid var(--nova-border-strong);
	background: rgba(255, 255, 255, 0.04);
	color: var(--nova-text);
	cursor: pointer;
}

.nova-burger:hover {
	background: rgba(255, 255, 255, 0.10);
}

@media (max-width: 1299.98px) {
	.nova-header__inner {
		height: 74px;
	}

	.nova-nav,
	.nova-header__actions {
		display: none;
	}

	.nova-burger {
		display: inline-flex;
	}
}

@media (max-width: 699.98px) {
	.nova-header__inner {
		height: 66px;
	}
}

/* --------------------------------------------------------------------------
   Flyout navigation
   -------------------------------------------------------------------------- */

.nova-flyout__veil {
	position: fixed;
	inset: 0;
	z-index: 110;
	background: rgba(5, 7, 13, 0.72);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}

.nova-flyout {
	position: fixed;
	z-index: 111;
	top: 0;
	right: 0;
	bottom: 0;
	width: min(88vw, 380px);
	background: var(--nova-surface);
	border-left: 1px solid var(--nova-border);
	padding: 20px clamp(18px, 5vw, 26px) 28px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	overflow-y: auto;
	animation: novaRise 240ms ease both;
}

.nova-flyout[hidden],
.nova-flyout__veil[hidden] {
	display: none;
}

.nova-flyout__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;
}

.nova-flyout__close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 12px;
	border: 1px solid var(--nova-border-strong);
	background: rgba(255, 255, 255, 0.04);
	color: var(--nova-text);
	cursor: pointer;
}

.nova-flyout__close:hover {
	background: rgba(255, 255, 255, 0.10);
}

.nova-flyout__link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 52px;
	padding: 0 14px;
	border-radius: 12px;
	font-size: 16px;
	font-weight: 600;
	color: var(--nova-muted);
	background: transparent;
	border: 1px solid var(--nova-border-soft);
}

.nova-flyout__link:hover,
.nova-flyout__link:focus-visible {
	background: rgba(255, 255, 255, 0.07);
	color: #fff;
}

.nova-flyout__link.is-current {
	color: #fff;
	background: rgba(229, 9, 32, 0.14);
	border-color: rgba(229, 9, 32, 0.42);
}

.nova-flyout__actions {
	display: grid;
	gap: 10px;
	margin-top: 16px;
}

.nova-flyout__actions .nova-btn {
	min-height: 50px;
	width: 100%;
}

/* --------------------------------------------------------------------------
   Typography helpers
   -------------------------------------------------------------------------- */

.nova-overline {
	margin: 0 0 12px;
	font-family: var(--nova-head);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.22em;
	color: var(--nova-primary-hover);
}

.nova-h2 {
	margin: 0;
	font-family: var(--nova-head);
	font-weight: 700;
	font-size: clamp(27px, 3.4vw, 42px);
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--nova-text);
}

.nova-h2--sm {
	font-size: clamp(24px, 3vw, 36px);
	margin-bottom: 22px;
}

.nova-h2--tight {
	margin-bottom: 6px;
}

.nova-h2--spaced {
	margin-bottom: clamp(26px, 3vw, 44px);
}

.nova-section {
	padding: clamp(56px, 7vw, 104px) 0;
}

.nova-section--panel {
	background: var(--nova-surface);
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	padding: clamp(48px, 6vw, 88px) 0;
}

.nova-section--flush {
	padding: clamp(36px, 4.4vw, 64px) 0 clamp(30px, 4vw, 52px);
}

.nova-section--notes {
	padding: 0 0 clamp(30px, 4vw, 52px);
}

.nova-section--band {
	padding: clamp(30px, 4vw, 52px) 0;
}

.nova-section--tail {
	padding: 0 0 clamp(56px, 7vw, 104px);
}

.nova-section--devices {
	padding: clamp(44px, 5.5vw, 80px) 0 clamp(24px, 3vw, 40px);
}

.nova-section--setup {
	padding: clamp(30px, 4vw, 56px) 0 clamp(44px, 5.5vw, 80px);
}

.nova-section--diag {
	padding: clamp(44px, 5.5vw, 80px) 0;
	border-bottom: 0;
}

.nova-section--faq {
	padding: clamp(40px, 5vw, 72px) 0 clamp(56px, 7vw, 96px);
}

.nova-section--faqnarrow .nova-shell__inner--narrow {
	max-width: 880px;
}

.nova-section__lead {
	margin: 0 0 clamp(26px, 3vw, 40px);
	color: var(--nova-muted);
	font-size: 16px;
	line-height: 1.6;
}

.nova-sectionhead {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: clamp(24px, 3vw, 40px);
}

.nova-sectionhead__text {
	margin: 0;
	max-width: 34em;
	color: var(--nova-muted);
	font-size: 16px;
	line-height: 1.6;
}

.nova-sectionhead--family {
	gap: 20px;
}

.nova-sectionhead__copy {
	max-width: 44ch;
}

.nova-sectionhead__copy .nova-h2 {
	margin-bottom: 14px;
}

.nova-footnote {
	margin: 32px 0 0;
	font-size: 13.5px;
	color: var(--nova-subtle);
	line-height: 1.6;
	max-width: 70ch;
}

.nova-count {
	margin: 0 0 16px;
	font-size: 14px;
	color: var(--nova-muted);
}

/* --------------------------------------------------------------------------
   Hero slider
   -------------------------------------------------------------------------- */

.nova-hero {
	position: relative;
	height: clamp(560px, 74vh, 820px);
	overflow: hidden;
	background: var(--nova-bg);
	outline-offset: -4px;
}

.nova-hero__stage {
	position: absolute;
	inset: 0;
}

.nova-hero__slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	z-index: 1;
	transition: opacity 620ms ease;
}

.nova-hero__slide.is-active {
	opacity: 1;
	z-index: 2;
}

.nova-shell .nova-hero__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 70% 50%;
}

.nova-hero__veil-x {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, #05070D 0%, rgba(5, 7, 13, 0.94) 30%, rgba(5, 7, 13, 0.55) 58%, rgba(5, 7, 13, 0.10) 100%);
}

.nova-hero__veil-y {
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, #05070D 2%, rgba(5, 7, 13, 0.55) 26%, rgba(5, 7, 13, 0) 62%);
}

.nova-hero__inner {
	position: relative;
	z-index: 6;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding-bottom: 26px;
}

.nova-hero__text {
	max-width: 640px;
	opacity: 1;
	transform: none;
	transition: opacity 320ms ease, transform 320ms ease;
}

.nova-hero__text[hidden] {
	display: none;
}

.nova-hero__text.is-entering {
	opacity: 0;
	transform: translateY(10px);
}

.nova-hero__over {
	margin: 0 0 14px;
	font-family: var(--nova-head);
	font-size: clamp(11px, 1.1vw, 13px);
	font-weight: 700;
	letter-spacing: 0.24em;
	color: var(--nova-primary-hover);
}

.nova-hero__title {
	margin: 0 0 16px;
	font-family: var(--nova-head);
	font-weight: 800;
	font-size: clamp(34px, 5.4vw, 64px);
	line-height: 1.04;
	letter-spacing: -0.025em;
	color: var(--nova-text);
}

.nova-hero__lead {
	margin: 0 0 28px;
	font-size: clamp(15px, 1.4vw, 18px);
	line-height: 1.6;
	color: var(--nova-muted);
	max-width: 30em;
}

.nova-hero__lead-short {
	display: none;
}

.nova-hero__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.nova-hero__tabs {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 4px;
	margin-top: 40px;
	border-top: 1px solid rgba(255, 255, 255, 0.14);
	padding-top: 4px;
}

.nova-hero__tab {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 10px;
	background: none;
	border: 0;
	border-top: 2px solid transparent;
	margin-top: -3px;
	color: var(--nova-muted);
	cursor: pointer;
	text-align: left;
	transition: color 200ms ease, border-color 200ms ease;
}

.nova-hero__tab:hover {
	color: #fff;
}

.nova-hero__tab.is-active {
	border-top-color: var(--nova-primary);
	color: #fff;
}

.nova-shell .nova-hero__thumb {
	width: 54px;
	height: 34px;
	object-fit: cover;
	object-position: 70% 50%;
	border-radius: 6px;
	opacity: 0.55;
	transition: opacity 200ms ease;
	flex: 0 0 auto;
}

.nova-hero__tab.is-active .nova-hero__thumb {
	opacity: 1;
}

.nova-hero__tablabel {
	font-family: var(--nova-head);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.nova-hero__dots {
	display: none;
	align-items: center;
	gap: 10px;
	margin-top: 28px;
}

.nova-hero__dot {
	width: 46px;
	height: 46px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: none;
	border: 0;
	cursor: pointer;
	padding: 0;
}

.nova-hero__dot span {
	display: block;
	width: 14px;
	height: 4px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.30);
	transition: width 260ms ease, background 260ms ease;
}

.nova-hero__dot.is-active span {
	width: 30px;
	background: var(--nova-primary);
}

.nova-hero__controls {
	position: absolute;
	inset: 0;
	z-index: 7;
	pointer-events: none;
}

.nova-hero__controls > * {
	pointer-events: auto;
}

.nova-hero__arrow {
	position: absolute;
	top: 45%;
	width: 48px;
	height: 48px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	background: rgba(5, 7, 13, 0.62);
	color: var(--nova-text);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	transition: background 200ms ease, border-color 200ms ease;
}

.nova-hero__arrow:hover,
.nova-hero__arrow:focus-visible {
	background: var(--nova-primary);
	border-color: var(--nova-primary);
	color: #fff;
}

.nova-hero__arrow--prev {
	left: clamp(8px, 2vw, 26px);
}

.nova-hero__arrow--next {
	right: clamp(8px, 2vw, 26px);
}

.nova-hero__play {
	position: absolute;
	right: clamp(8px, 2vw, 26px);
	bottom: 22px;
	min-width: 44px;
	height: 44px;
	padding: 0 14px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	background: rgba(5, 7, 13, 0.62);
	color: var(--nova-muted);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	font-weight: 600;
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}

.nova-hero__play:hover,
.nova-hero__play:focus-visible {
	color: #fff;
	border-color: rgba(255, 255, 255, 0.4);
}

@media (max-width: 1023.98px) {
	.nova-hero__inner {
		padding-bottom: clamp(72px, 14vw, 110px);
	}

	.nova-hero__tabs {
		display: none;
	}

	.nova-hero__dots {
		display: flex;
	}

	.nova-hero__controls {
		inset: auto clamp(16px, 4vw, 32px) 22px auto;
		display: flex;
		align-items: center;
		gap: 8px;
	}

	.nova-hero__arrow,
	.nova-hero__play {
		position: static;
		width: 44px;
		height: 44px;
		background: rgba(5, 7, 13, 0.72);
	}

	.nova-hero__play {
		width: auto;
	}
}

@media (max-width: 699.98px) {
	.nova-hero__img {
		object-position: 76% 46%;
	}

	.nova-hero__lead-full {
		display: none;
	}

	.nova-hero__lead-short {
		display: inline;
	}
}

/* --------------------------------------------------------------------------
   Category cards
   -------------------------------------------------------------------------- */

.nova-shell .nova-catgrid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
	gap: clamp(14px, 1.6vw, 22px);
}

.nova-cat {
	position: relative;
	display: block;
	border-radius: 16px;
	overflow: hidden;
	border: 1px solid var(--nova-border-soft);
	background: var(--nova-surface);
	aspect-ratio: 3 / 2;
	transition: border-color 240ms ease, transform 240ms ease, box-shadow 240ms ease;
}

.nova-cat:hover,
.nova-cat:focus-visible {
	border-color: rgba(229, 9, 32, 0.6);
	transform: translateY(-4px);
	box-shadow: 0 26px 50px -30px rgba(229, 9, 32, 0.85);
}

.nova-shell .nova-cat__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.nova-cat__veil {
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, rgba(5, 7, 13, 0.96) 6%, rgba(5, 7, 13, 0.55) 42%, rgba(5, 7, 13, 0.10) 100%);
}

.nova-cat__body {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 20px;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 14px;
}

.nova-cat__title {
	display: block;
	font-family: var(--nova-head);
	font-weight: 700;
	font-size: 19px;
	color: var(--nova-text);
	margin-bottom: 5px;
}

.nova-cat__desc {
	display: block;
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--nova-muted);
	max-width: 26em;
}

.nova-cat__arrow {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.20);
	background: rgba(5, 7, 13, 0.6);
	color: var(--nova-text);
}

/* --------------------------------------------------------------------------
   Rails and poster cards
   -------------------------------------------------------------------------- */

.nova-rail__block {
	margin-bottom: clamp(36px, 4vw, 56px);
}

.nova-rail__block--last {
	margin-bottom: 0;
}

.nova-rail__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 16px;
}

.nova-rail__title {
	margin: 0;
	font-family: var(--nova-head);
	font-weight: 700;
	font-size: clamp(18px, 2vw, 23px);
	color: var(--nova-text);
}

.nova-rail__arrows {
	display: flex;
	gap: 8px;
}

.nova-shell .nova-rail {
	list-style: none;
	margin: 0;
	padding: 0 0 12px;
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: clamp(150px, 21vw, 216px);
	gap: clamp(12px, 1.4vw, 18px);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: thin;
	scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
}

.nova-rail::-webkit-scrollbar {
	height: 8px;
}

.nova-rail::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.22);
	border-radius: 999px;
}

.nova-rail__item {
	scroll-snap-align: start;
}

.nova-poster {
	display: block;
	width: 100%;
	padding: 0;
	background: none;
	border: 0;
	cursor: pointer;
	text-align: left;
	color: inherit;
}

.nova-poster__frame {
	position: relative;
	display: block;
	border-radius: var(--nova-radius-card);
	overflow: hidden;
	border: 1px solid var(--nova-border-soft);
	aspect-ratio: 2 / 3;
	background: var(--nova-bg);
	transition: border-color 240ms ease, transform 240ms ease;
}

.nova-poster:hover .nova-poster__frame,
.nova-poster:focus-visible .nova-poster__frame {
	border-color: rgba(229, 9, 32, 0.65);
	transform: translateY(-4px);
}

/* `.elementor img { height: auto }` has the same specificity as a plain
   `.nova-poster__frame img`, so every image rule is scoped to the shell to
   stay ahead of the theme and of Elementor's reset. */
.nova-shell .nova-poster__frame img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	border-radius: 0;
}

.nova-poster__overlay {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	background: linear-gradient(0deg, rgba(5, 7, 13, 0.94), rgba(5, 7, 13, 0.55));
	opacity: 0;
	transition: opacity 240ms ease;
}

.nova-poster:hover .nova-poster__overlay,
.nova-poster:focus-visible .nova-poster__overlay {
	opacity: 1;
}

.nova-poster__play {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 999px;
	background: var(--nova-primary);
	color: #fff;
	box-shadow: 0 14px 30px -12px rgba(229, 9, 32, 0.95);
}

.nova-poster__label {
	font-family: var(--nova-head);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: var(--nova-text);
}

.nova-poster__overlay--flat {
	display: flex;
	flex-direction: row;
	align-items: flex-end;
	justify-content: flex-start;
	padding: 14px;
	background: linear-gradient(0deg, rgba(5, 7, 13, 0.92), rgba(5, 7, 13, 0.12) 65%);
	font-family: var(--nova-head);
	font-size: 13px;
	font-weight: 700;
	color: var(--nova-text);
}

.nova-poster__title {
	display: block;
	margin-top: 12px;
	font-family: var(--nova-head);
	font-size: 15px;
	font-weight: 600;
	color: var(--nova-text);
}

.nova-poster__meta {
	display: block;
	margin-top: 4px;
	font-size: 12.5px;
	color: var(--nova-muted);
}

.nova-poster--family .nova-poster__frame {
	border-color: var(--nova-border);
	background: var(--nova-surface);
}

.nova-poster--family .nova-poster__title {
	margin-top: 10px;
	font-size: 14.5px;
}

.nova-poster--family .nova-poster__meta {
	margin-top: 3px;
}

/* --------------------------------------------------------------------------
   Benefits
   -------------------------------------------------------------------------- */

.nova-shell .nova-benefits {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
	gap: clamp(14px, 1.6vw, 22px);
}

.nova-benefit {
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-soft);
	border-radius: 16px;
	padding: clamp(22px, 2.4vw, 30px);
}

.nova-benefit__icon,
.nova-device__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 12px;
	background: var(--nova-accent-soft);
	border: 1px solid rgba(229, 9, 32, 0.32);
	color: var(--nova-primary-hover);
	margin-bottom: 18px;
}

.nova-benefit__title {
	margin: 0 0 8px;
	font-family: var(--nova-head);
	font-weight: 600;
	font-size: 18px;
	color: var(--nova-text);
}

.nova-benefit__text {
	margin: 0;
	color: var(--nova-muted);
	font-size: 14.5px;
	line-height: 1.6;
}

/* --------------------------------------------------------------------------
   Connection selector and plan cards
   -------------------------------------------------------------------------- */

.nova-plans__intro {
	text-align: center;
	max-width: 640px;
	margin: 0 auto clamp(26px, 3vw, 38px);
}

.nova-plans__intro .nova-h2 {
	margin-bottom: 12px;
}

.nova-plans__intro p {
	margin: 0;
	color: var(--nova-muted);
	font-size: 16px;
	line-height: 1.6;
}

.nova-conn {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	margin-bottom: clamp(26px, 3vw, 40px);
}

.nova-conn__label {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--nova-muted);
}

/* Segmented control with a sliding red indicator: same red, same radii and the
   same 260ms travel as the hero dots, so the control reads as part of the set. */
.nova-conn__segmented {
	position: relative;
	/* Grid, not flex: the columns must be exactly equal for the sliding
	   indicator to line up, and "screen" is narrower than "screens". */
	display: inline-grid;
	grid-auto-flow: column;
	grid-auto-columns: 1fr;
	padding: 6px;
	gap: 0;
	border-radius: 16px;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0)) , var(--nova-surface);
	border: 1px solid var(--nova-border);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 40px -32px rgba(0, 0, 0, 0.9);
}

.nova-conn__indicator {
	position: absolute;
	top: 6px;
	bottom: 6px;
	left: 6px;
	width: calc((100% - 12px) / var(--nova-conn-count, 4));
	border-radius: 11px;
	background: linear-gradient(160deg, var(--nova-primary-hover) 0%, var(--nova-primary) 62%);
	box-shadow: 0 12px 26px -12px rgba(229, 9, 32, 0.95);
	transform: translateX(calc(var(--nova-conn-index, 0) * 100%));
	transition: transform 260ms ease;
	pointer-events: none;
}

.nova-conn__btn {
	position: relative;
	z-index: 1;
	grid-row: 1;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1px;
	min-width: 92px;
	min-height: 50px;
	padding: 0 18px;
	border-radius: 11px;
	border: 0;
	background: transparent;
	color: var(--nova-muted);
	cursor: pointer;
	transition: color 200ms ease;
}

.nova-conn__num {
	font-family: var(--nova-head);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.1;
}

.nova-conn__unit {
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	opacity: 0.72;
}

.nova-conn__btn:hover,
.nova-conn__btn:focus-visible {
	color: var(--nova-text);
}

.nova-conn__btn.is-active {
	color: #fff;
}

.nova-conn__btn.is-active .nova-conn__unit {
	opacity: 0.85;
}

.nova-conn__selectwrap {
	display: none;
	position: relative;
	width: min(100%, 340px);
}

.nova-conn__select {
	width: 100%;
	min-height: 54px;
	padding: 0 44px 0 16px;
	border-radius: 14px;
	background: var(--nova-surface);
	color: var(--nova-text);
	border: 1px solid var(--nova-border-strong);
	font-family: var(--nova-head);
	font-size: 15px;
	font-weight: 600;
	appearance: none;
	-webkit-appearance: none;
}

.nova-conn__select:focus {
	border-color: var(--nova-primary-hover);
	outline: none;
}

.nova-conn__chevron {
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%) rotate(90deg);
	color: var(--nova-primary-hover);
	pointer-events: none;
	display: inline-flex;
}

.nova-conn__live {
	margin: 0;
	font-size: 13.5px;
	color: var(--nova-subtle);
}

@media (max-width: 699.98px) {
	.nova-conn__segmented {
		display: none;
	}

	.nova-conn__selectwrap {
		display: block;
	}
}

@media (prefers-reduced-motion: reduce) {
	.nova-conn__indicator {
		transition: none;
	}
}

.nova-shell .nova-plans {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 268px), 1fr));
	gap: clamp(16px, 1.8vw, 24px);
	align-items: start;
}

.nova-plan {
	position: relative;
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-soft);
	border-radius: var(--nova-radius-block);
	padding: clamp(26px, 2.8vw, 34px);
	display: flex;
	flex-direction: column;
	height: 100%;
}

.nova-plans--dark .nova-plan {
	background: var(--nova-bg);
}

.nova-plan--best {
	border-color: rgba(229, 9, 32, 0.65);
}

.nova-plan__badge {
	position: absolute;
	top: -13px;
	left: 50%;
	transform: translateX(-50%);
	background: var(--nova-primary);
	color: #fff;
	font-family: var(--nova-head);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.1em;
	padding: 6px 14px;
	border-radius: 999px;
	white-space: nowrap;
	box-shadow: 0 12px 26px -12px rgba(229, 9, 32, 0.95);
}

.nova-plan__name {
	margin: 0 0 10px;
	font-family: var(--nova-head);
	font-size: 19px;
	font-weight: 600;
	color: var(--nova-text);
}

.nova-plan__price {
	margin: 0 0 4px;
	font-family: var(--nova-head);
	font-size: clamp(32px, 3.4vw, 42px);
	font-weight: 800;
	letter-spacing: -0.03em;
	line-height: 1;
	color: var(--nova-text);
}

.nova-plan__permonth {
	margin: 0 0 6px;
	font-size: 13.5px;
	color: var(--nova-muted);
}

.nova-plan__conn {
	margin: 0 0 22px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	align-self: flex-start;
	padding: 6px 12px;
	border-radius: 999px;
	background: var(--nova-accent-soft);
	border: 1px solid rgba(229, 9, 32, 0.32);
	font-size: 12.5px;
	font-weight: 600;
	color: var(--nova-rating);
}

.nova-plan__features {
	list-style: none;
	margin: 0 0 26px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 11px;
}

.nova-plan__features li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 14px;
	line-height: 1.55;
	color: var(--nova-body);
}

.nova-plan__check {
	flex: 0 0 auto;
	color: var(--nova-primary-hover);
	margin-top: 2px;
	display: inline-flex;
}

.nova-plan__cta {
	margin-top: auto;
	width: 100%;
}

.nova-plans__footnote {
	margin: 22px 0 0;
	text-align: center;
	font-size: 13.5px;
	color: var(--nova-subtle);
}

/* --------------------------------------------------------------------------
   Family grid
   -------------------------------------------------------------------------- */

.nova-section--family {
	background: radial-gradient(120% 90% at 12% 0%, rgba(229, 9, 32, 0.14) 0%, rgba(5, 7, 13, 0) 58%), var(--nova-bg);
}

.nova-shell .nova-familygrid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 168px), 1fr));
	gap: clamp(12px, 1.4vw, 20px);
}

/* --------------------------------------------------------------------------
   Devices + CTA duo
   -------------------------------------------------------------------------- */

.nova-duo {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
	gap: clamp(18px, 2vw, 28px);
	align-items: stretch;
}

.nova-duo__image {
	position: relative;
	border-radius: var(--nova-radius-block);
	overflow: hidden;
	border: 1px solid var(--nova-border-soft);
	min-height: 320px;
}

.nova-shell .nova-duo__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.nova-duo__veil {
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, rgba(5, 7, 13, 0.94) 8%, rgba(5, 7, 13, 0.30) 70%);
}

.nova-duo__body {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: clamp(22px, 2.6vw, 32px);
}

.nova-duo__title {
	margin: 0 0 10px;
	font-family: var(--nova-head);
	font-weight: 700;
	font-size: clamp(22px, 2.4vw, 30px);
	line-height: 1.15;
	color: var(--nova-text);
}

.nova-duo__text {
	margin: 0 0 20px;
	color: var(--nova-muted);
	font-size: 15px;
	line-height: 1.6;
	max-width: 40ch;
}

.nova-duo__cta {
	border-radius: var(--nova-radius-block);
	border: 1px solid rgba(229, 9, 32, 0.42);
	background: linear-gradient(140deg, rgba(229, 9, 32, 0.22) 0%, rgba(11, 16, 26, 0.9) 52%), var(--nova-surface);
	padding: clamp(26px, 3vw, 40px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	box-shadow: 0 40px 80px -50px rgba(229, 9, 32, 0.9);
}

.nova-duo__ctatitle {
	margin: 0 0 14px;
	font-family: var(--nova-head);
	font-weight: 700;
	font-size: clamp(26px, 3vw, 38px);
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--nova-text);
}

.nova-duo__ctatext {
	margin: 0 0 26px;
	color: var(--nova-body);
	font-size: 16px;
	line-height: 1.65;
	max-width: 36ch;
}

.nova-duo__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.nova-duo__buttons .nova-btn {
	min-height: 50px;
	padding: 0 22px;
}

/* --------------------------------------------------------------------------
   Page heroes
   -------------------------------------------------------------------------- */

.nova-pagehero {
	position: relative;
	overflow: hidden;
	border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}

.nova-shell .nova-pagehero__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 70% 50%;
}

.nova-pagehero__veil-x {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, #05070D 0%, rgba(5, 7, 13, 0.92) 36%, rgba(5, 7, 13, 0.45) 68%, rgba(5, 7, 13, 0.12) 100%);
}

.nova-pagehero--support .nova-pagehero__veil-x {
	background: linear-gradient(90deg, #05070D 0%, rgba(5, 7, 13, 0.93) 40%, rgba(5, 7, 13, 0.5) 70%, rgba(5, 7, 13, 0.14) 100%);
}

.nova-pagehero__veil-y {
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, #05070D 1%, rgba(5, 7, 13, 0) 55%);
}

.nova-pagehero__inner {
	position: relative;
	padding-top: clamp(56px, 7vw, 104px);
	padding-bottom: clamp(40px, 5vw, 72px);
}

.nova-pagehero__title {
	margin: 0 0 16px;
	font-family: var(--nova-head);
	font-weight: 800;
	font-size: clamp(32px, 4.6vw, 58px);
	line-height: 1.05;
	letter-spacing: -0.025em;
	max-width: 16ch;
	color: var(--nova-text);
}

.nova-pagehero--support .nova-pagehero__title {
	font-size: clamp(30px, 4.4vw, 56px);
	max-width: 18ch;
	margin-bottom: 24px;
}

.nova-pagehero__text {
	margin: 0 0 28px;
	color: var(--nova-muted);
	font-size: clamp(15px, 1.3vw, 18px);
	line-height: 1.6;
	max-width: 46ch;
}

.nova-pricehero {
	padding: clamp(52px, 6vw, 96px) 0 clamp(30px, 4vw, 52px);
	background: radial-gradient(90% 80% at 50% 0%, rgba(229, 9, 32, 0.18) 0%, rgba(5, 7, 13, 0) 62%), var(--nova-bg);
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	text-align: center;
}

.nova-pricehero__title {
	margin: 0 auto 16px;
	font-family: var(--nova-head);
	font-weight: 800;
	font-size: clamp(32px, 4.4vw, 54px);
	line-height: 1.06;
	letter-spacing: -0.025em;
	max-width: 18ch;
	color: var(--nova-text);
}

.nova-pricehero__text {
	margin: 0 auto;
	color: var(--nova-muted);
	font-size: clamp(15px, 1.3vw, 18px);
	line-height: 1.6;
	max-width: 56ch;
}

/* --------------------------------------------------------------------------
   Search fields, chips, filters
   -------------------------------------------------------------------------- */

.nova-search {
	position: relative;
	max-width: 560px;
	margin-bottom: 20px;
}

.nova-search__icon {
	position: absolute;
	left: 16px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--nova-subtle);
	display: inline-flex;
	pointer-events: none;
}

.nova-search input {
	width: 100%;
	min-height: 54px;
	padding: 0 18px 0 48px;
	border-radius: var(--nova-radius-card);
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-strong);
	color: var(--nova-text);
	font-size: 16px;
}

.nova-search input:focus {
	border-color: var(--nova-primary-hover);
	outline: none;
}

.nova-search--lg {
	max-width: 620px;
	margin-bottom: 0;
}

.nova-search--lg .nova-search__icon {
	left: 20px;
}

.nova-search--lg input {
	min-height: 62px;
	padding: 0 20px 0 54px;
	border-radius: 16px;
	background: rgba(11, 16, 26, 0.92);
	border-color: rgba(255, 255, 255, 0.16);
}

.nova-search--inline {
	max-width: none;
	margin-bottom: 0;
}

.nova-search--inline .nova-search__icon {
	left: 15px;
}

.nova-search--inline input {
	min-height: 52px;
	padding: 0 16px 0 44px;
	border-radius: 12px;
	font-size: 15px;
}

.nova-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 22px;
}

.nova-chip {
	min-height: 46px;
	padding: 0 18px;
	border-radius: 999px;
	border: 1px solid var(--nova-border-strong);
	background: rgba(255, 255, 255, 0.04);
	color: var(--nova-muted);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: background 200ms ease, color 200ms ease, border-color 200ms ease;
}

.nova-chip:hover {
	border-color: rgba(255, 255, 255, 0.34);
}

.nova-chip.is-active {
	background: var(--nova-primary);
	border-color: var(--nova-primary);
	color: #fff;
}

.nova-filters {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr));
	gap: 12px;
	margin-bottom: 22px;
}

.nova-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.nova-field__label {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--nova-subtle);
}

.nova-field select {
	min-height: 52px;
	padding: 0 14px;
	border-radius: 12px;
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-strong);
	color: var(--nova-text);
	font-size: 15px;
	font-weight: 500;
}

.nova-field select:focus {
	border-color: var(--nova-primary-hover);
	outline: none;
}

.nova-segment {
	display: inline-flex;
	padding: 5px;
	border-radius: var(--nova-radius-card);
	background: var(--nova-surface);
	border: 1px solid var(--nova-border);
	gap: 4px;
	margin-bottom: 24px;
	max-width: 100%;
	flex-wrap: wrap;
}

.nova-segment__btn {
	min-height: 46px;
	padding: 0 22px;
	border-radius: 10px;
	border: 1px solid transparent;
	background: transparent;
	color: var(--nova-muted);
	font-family: var(--nova-head);
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	transition: background 200ms ease, color 200ms ease;
}

.nova-segment__btn:hover {
	color: #fff;
}

.nova-segment__btn.is-active {
	background: var(--nova-primary);
	border-color: var(--nova-primary);
	color: #fff;
}

.nova-countrow {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 22px;
}

.nova-countrow .nova-count {
	margin: 0;
}

.nova-reset {
	min-height: 44px;
	padding: 0 16px;
	border-radius: 10px;
	border: 1px solid var(--nova-border-strong);
	background: transparent;
	color: var(--nova-muted);
	font-size: 13.5px;
	font-weight: 600;
	cursor: pointer;
}

.nova-reset:hover {
	color: #fff;
	border-color: rgba(255, 255, 255, 0.32);
}

.nova-empty {
	padding: clamp(30px, 4vw, 50px);
	border-radius: 16px;
	border: 1px dashed rgba(255, 255, 255, 0.16);
	text-align: center;
	margin-bottom: 24px;
}

.nova-empty p {
	margin: 0 0 16px;
	color: var(--nova-muted);
	font-size: 15px;
}

.nova-empty p:last-child {
	margin-bottom: 0;
}

.nova-notice {
	margin: 0 0 24px;
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 16px 18px;
	border-radius: var(--nova-radius-card);
	background: rgba(229, 9, 32, 0.08);
	border: 1px solid rgba(229, 9, 32, 0.28);
	color: var(--nova-body);
	font-size: 14px;
	line-height: 1.6;
}

.nova-notice__icon {
	flex: 0 0 auto;
	color: var(--nova-primary-hover);
	display: inline-flex;
	margin-top: 1px;
}

/* --------------------------------------------------------------------------
   Channels
   -------------------------------------------------------------------------- */

.nova-countries__title {
	margin: 0 0 14px;
	font-family: var(--nova-head);
	font-weight: 600;
	font-size: 16px;
	color: var(--nova-text);
}

.nova-shell .nova-countries {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr));
	gap: 12px;
	margin-bottom: 26px;
}

.nova-country {
	display: flex;
	align-items: center;
	gap: 13px;
	min-height: 66px;
	padding: 12px 15px;
	border-radius: var(--nova-radius-card);
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-soft);
	color: var(--nova-text);
	cursor: pointer;
	text-align: left;
	transition: border-color 200ms ease, background 200ms ease;
}

.nova-country:hover {
	border-color: rgba(255, 255, 255, 0.34);
}

.nova-country.is-active {
	background: rgba(229, 9, 32, 0.14);
	border-color: rgba(229, 9, 32, 0.65);
	color: #fff;
}

.nova-country__code {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 32px;
	border-radius: 7px;
	background: var(--nova-bg);
	border: 1px solid var(--nova-border-strong);
	color: var(--nova-primary-hover);
	font-family: var(--nova-head);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.04em;
}

.nova-country__copy {
	min-width: 0;
}

.nova-country__name {
	display: block;
	font-family: var(--nova-head);
	font-size: 14.5px;
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.nova-country__count {
	display: block;
	margin-top: 3px;
	font-size: 12.5px;
	color: var(--nova-muted);
}

.nova-shell .nova-channels {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr));
	gap: clamp(12px, 1.4vw, 18px);
}

.nova-channel {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px;
	border-radius: var(--nova-radius-card);
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-soft);
	transition: border-color 220ms ease, transform 220ms ease;
}

.nova-channel:hover {
	border-color: rgba(229, 9, 32, 0.5);
	transform: translateY(-3px);
}

.nova-channel[hidden] {
	display: none;
}

.nova-channel__badge {
	flex: 0 0 auto;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 13px;
	background: var(--nova-bg);
	border: 1px solid var(--nova-border);
	color: var(--nova-primary-hover);
	font-family: var(--nova-head);
	font-weight: 800;
	font-size: 15px;
	letter-spacing: 0.02em;
}

.nova-channel__rings {
	position: absolute;
	inset: 0;
	opacity: 0.28;
}

.nova-channel__copy {
	min-width: 0;
}

.nova-channel__name {
	display: block;
	font-family: var(--nova-head);
	font-size: 15px;
	font-weight: 600;
	color: var(--nova-text);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.nova-channel__meta {
	display: block;
	margin-top: 3px;
	font-size: 12.5px;
	color: var(--nova-muted);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.nova-more {
	display: flex;
	justify-content: center;
	margin-top: 32px;
}

.nova-more .nova-btn {
	padding: 0 26px;
}

/* --------------------------------------------------------------------------
   Catalogue grid
   -------------------------------------------------------------------------- */

.nova-shell .nova-catgrid-posters {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 176px), 1fr));
	gap: clamp(12px, 1.5vw, 22px);
}

.nova-catgrid-posters__item[hidden] {
	display: none;
}

/* --------------------------------------------------------------------------
   Devices, setup and diagnostics
   -------------------------------------------------------------------------- */

.nova-shell .nova-devices {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 232px), 1fr));
	gap: clamp(12px, 1.5vw, 20px);
}

.nova-device {
	padding: clamp(20px, 2.2vw, 26px);
	border-radius: 16px;
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-soft);
}

.nova-device__icon {
	width: 44px;
	height: 44px;
	margin-bottom: 16px;
}

.nova-device__title {
	margin: 0 0 7px;
	font-family: var(--nova-head);
	font-size: 17px;
	font-weight: 600;
	color: var(--nova-text);
}

.nova-device__text {
	margin: 0;
	color: var(--nova-muted);
	font-size: 14px;
	line-height: 1.6;
}

.nova-setup__tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 24px;
}

.nova-setup__tab {
	min-height: 48px;
	padding: 0 20px;
	border-radius: 12px;
	border: 1px solid var(--nova-border-strong);
	background: rgba(255, 255, 255, 0.04);
	color: var(--nova-muted);
	font-size: 14.5px;
	font-weight: 600;
	cursor: pointer;
	transition: background 200ms ease, color 200ms ease, border-color 200ms ease;
}

.nova-setup__tab:hover {
	border-color: rgba(255, 255, 255, 0.32);
}

.nova-setup__tab.is-active {
	background: var(--nova-primary);
	border-color: var(--nova-primary);
	color: #fff;
}

.nova-setup__panel {
	padding: clamp(24px, 3vw, 36px);
	border-radius: var(--nova-radius-block);
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-soft);
}

.nova-setup__panel[hidden] {
	display: none;
}

.nova-setup__title {
	margin: 0 0 8px;
	font-family: var(--nova-head);
	font-size: clamp(19px, 2vw, 24px);
	font-weight: 700;
	color: var(--nova-text);
}

.nova-setup__text {
	margin: 0 0 26px;
	color: var(--nova-muted);
	font-size: 15px;
	line-height: 1.6;
}

.nova-shell .nova-steps {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
	gap: clamp(14px, 1.6vw, 20px);
}

.nova-step {
	display: flex;
	gap: 14px;
	padding: 18px;
	border-radius: var(--nova-radius-card);
	background: var(--nova-bg);
	border: 1px solid rgba(255, 255, 255, 0.08);
}

.nova-step__n {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 999px;
	background: rgba(229, 9, 32, 0.14);
	border: 1px solid rgba(229, 9, 32, 0.4);
	color: var(--nova-primary-hover);
	font-family: var(--nova-head);
	font-size: 14px;
	font-weight: 700;
}

.nova-step__text {
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--nova-body);
}

.nova-setup__warning {
	margin: 24px 0 0;
	font-size: 13.5px;
	color: var(--nova-subtle);
	line-height: 1.6;
}

.nova-shell .nova-diag {
	list-style: none;
	margin: 0 0 32px;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
	gap: clamp(12px, 1.5vw, 20px);
}

.nova-diag__item {
	padding: 22px;
	border-radius: 16px;
	background: var(--nova-bg);
	border: 1px solid var(--nova-border-soft);
}

.nova-diag__title {
	margin: 0 0 8px;
	font-family: var(--nova-head);
	font-size: 16px;
	font-weight: 600;
	color: var(--nova-text);
}

.nova-diag__text {
	margin: 0;
	color: var(--nova-muted);
	font-size: 14px;
	line-height: 1.6;
}

/* --------------------------------------------------------------------------
   FAQ accordion
   -------------------------------------------------------------------------- */

.nova-accordion {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.nova-acc {
	border-radius: var(--nova-radius-card);
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-soft);
	overflow: hidden;
}

.nova-acc[hidden] {
	display: none;
}

.nova-acc__h {
	margin: 0;
}

.nova-acc__btn {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 64px;
	padding: 14px 20px;
	background: none;
	border: 0;
	color: var(--nova-text);
	font-family: var(--nova-head);
	font-size: 15.5px;
	font-weight: 600;
	text-align: left;
	cursor: pointer;
}

.nova-acc__btn:hover {
	color: var(--nova-primary-hover);
}

.nova-acc__btn[aria-expanded="true"] {
	color: #fff;
}

.nova-acc__chevron {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.16);
	color: var(--nova-primary-hover);
	transform: none;
	transition: transform 240ms ease;
}

.nova-acc__btn[aria-expanded="true"] .nova-acc__chevron {
	transform: rotate(90deg);
}

.nova-acc__panel {
	padding: 0 20px 20px;
}

.nova-acc__panel[hidden] {
	display: none;
}

.nova-acc__answer {
	margin: 0 0 12px;
	color: var(--nova-muted);
	font-size: 14.5px;
	line-height: 1.7;
}

.nova-acc__topic {
	margin: 0;
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--nova-subtle);
	font-weight: 600;
}

.nova-section--faqnarrow .nova-acc__btn {
	min-height: 62px;
}

/* --------------------------------------------------------------------------
   Comparison table
   -------------------------------------------------------------------------- */

.nova-tablewrap {
	overflow-x: auto;
	border-radius: 16px;
	border: 1px solid var(--nova-border-soft);
}

.nova-table {
	width: 100%;
	min-width: 640px;
	border-collapse: collapse;
	background: var(--nova-bg);
}

.nova-table thead th {
	text-align: center;
	padding: 16px 18px;
	font-family: var(--nova-head);
	font-size: 14px;
	font-weight: 700;
	color: var(--nova-text);
	border-bottom: 1px solid var(--nova-border-soft);
	white-space: nowrap;
}

.nova-table thead th:first-child {
	text-align: left;
	font-size: 13px;
	font-weight: 600;
	color: var(--nova-muted);
}

.nova-table tbody th {
	text-align: left;
	padding: 15px 18px;
	font-size: 14px;
	font-weight: 500;
	color: var(--nova-body);
	border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.nova-table tbody td {
	text-align: center;
	padding: 15px 18px;
	font-size: 14px;
	color: var(--nova-text);
	border-bottom: 1px solid rgba(255, 255, 255, 0.07);
	white-space: nowrap;
}

.nova-table__yes {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: var(--nova-primary-hover);
	font-size: 13px;
	font-weight: 600;
}

.nova-table__price {
	font-family: var(--nova-head);
	font-weight: 700;
}

/* --------------------------------------------------------------------------
   Cards, notes and CTA band
   -------------------------------------------------------------------------- */

.nova-notes {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
	gap: 16px;
}

.nova-card {
	padding: clamp(22px, 2.6vw, 30px);
	border-radius: var(--nova-radius-block);
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-soft);
}

.nova-notes .nova-card {
	padding: 20px 22px;
	border-radius: var(--nova-radius-card);
}

.nova-card--dashed {
	background: rgba(11, 16, 26, 0.6);
	border: 1px dashed rgba(255, 255, 255, 0.16);
}

.nova-notes .nova-card--dashed {
	background: rgba(11, 16, 26, 0.5);
	border-style: dashed;
	border-color: rgba(255, 255, 255, 0.18);
}

.nova-card__title {
	margin: 0 0 16px;
	font-family: var(--nova-head);
	font-weight: 700;
	font-size: 19px;
	color: var(--nova-text);
}

.nova-card__title--sm {
	margin-bottom: 8px;
	font-size: 15px;
	font-weight: 600;
}

.nova-card__title--muted {
	color: var(--nova-muted);
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 10px;
}

.nova-card__text {
	margin: 0 0 14px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--nova-muted);
}

.nova-card__text--subtle {
	color: var(--nova-subtle);
	margin-bottom: 12px;
}

.nova-card__text:last-child {
	margin-bottom: 0;
}

.nova-ctaband {
	margin-top: clamp(36px, 4.5vw, 60px);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	padding: clamp(24px, 3vw, 34px);
	border-radius: var(--nova-radius-block);
	border: 1px solid rgba(229, 9, 32, 0.42);
	background: linear-gradient(120deg, rgba(229, 9, 32, 0.20), rgba(11, 16, 26, 0.9) 60%), var(--nova-surface);
}

.nova-section--band .nova-ctaband {
	margin-top: 0;
}

.nova-ctaband__title {
	margin: 0 0 8px;
	font-family: var(--nova-head);
	font-weight: 700;
	font-size: clamp(20px, 2.2vw, 26px);
	color: var(--nova-text);
}

.nova-ctaband__text {
	margin: 0;
	color: var(--nova-body);
	font-size: 15px;
	line-height: 1.6;
	max-width: 52ch;
}

.nova-ctaband .nova-btn {
	min-height: 50px;
	padding: 0 22px;
}

/* --------------------------------------------------------------------------
   Contact form
   -------------------------------------------------------------------------- */

.nova-contact {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
	gap: clamp(20px, 2.6vw, 40px);
	align-items: start;
}

.nova-form {
	padding: clamp(24px, 3vw, 36px);
	border-radius: var(--nova-radius-block);
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-soft);
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.nova-form__title {
	margin: 0;
	font-family: var(--nova-head);
	font-weight: 700;
	font-size: clamp(21px, 2.3vw, 27px);
	color: var(--nova-text);
}

.nova-form__label {
	display: flex;
	flex-direction: column;
	gap: 7px;
	font-size: 14px;
	font-weight: 600;
	color: var(--nova-text);
}

.nova-form__optional {
	font-weight: 400;
	color: var(--nova-subtle);
}

.nova-form input[type="text"],
.nova-form input[type="email"],
.nova-form select,
.nova-form textarea {
	min-height: 52px;
	padding: 0 16px;
	border-radius: 12px;
	background: var(--nova-bg);
	border: 1px solid var(--nova-border-strong);
	color: var(--nova-text);
	font-size: 15px;
	font-weight: 400;
	width: 100%;
}

.nova-form textarea {
	padding: 14px 16px;
	line-height: 1.6;
	resize: vertical;
	min-height: 140px;
}

.nova-form input:focus,
.nova-form select:focus,
.nova-form textarea:focus {
	border-color: var(--nova-primary-hover);
	outline: none;
}

.nova-form [aria-invalid="true"] {
	border-color: var(--nova-primary-hover);
}

.nova-form__error {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 13px;
	font-weight: 500;
	color: var(--nova-error);
}

.nova-form__error[hidden] {
	display: none;
}

.nova-form__consent {
	display: block;
}

.nova-form__check {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--nova-body);
	cursor: pointer;
	font-weight: 400;
}

.nova-form__check input {
	width: 22px;
	height: 22px;
	margin: 1px 0 0;
	accent-color: var(--nova-primary);
	flex: 0 0 auto;
	min-height: 0;
}

.nova-form__consent .nova-form__error {
	margin-top: 8px;
}

.nova-form__submit {
	min-height: 54px;
	box-shadow: 0 16px 38px -18px rgba(229, 9, 32, 0.95);
}

.nova-form__spinner {
	display: inline-block;
	width: 17px;
	height: 17px;
	border-radius: 999px;
	border: 2px solid rgba(255, 255, 255, 0.35);
	border-top-color: #fff;
	animation: novaSpin 700ms linear infinite;
}

.nova-form__spinner[hidden] {
	display: none;
}

.nova-form__live {
	margin: 0;
	min-height: 1px;
}

.nova-form__live span {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 15px 17px;
	border-radius: 12px;
	font-size: 14px;
	line-height: 1.6;
}

.nova-form__live .is-success {
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.18);
	color: var(--nova-text);
}

.nova-form__live .is-error {
	background: rgba(229, 9, 32, 0.10);
	border: 1px solid rgba(229, 9, 32, 0.42);
	color: #FFC2C9;
}

.nova-form__note {
	margin: 0;
	font-size: 12.5px;
	color: var(--nova-subtle);
	line-height: 1.6;
}

.nova-contact__side {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.nova-reach {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.nova-reach dt {
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--nova-subtle);
	font-weight: 600;
	margin-bottom: 5px;
}

.nova-reach dd {
	margin: 0;
	font-size: 15px;
	color: var(--nova-muted);
}

/* --------------------------------------------------------------------------
   Detail modal
   -------------------------------------------------------------------------- */

.nova-modal {
	position: fixed;
	inset: 0;
	z-index: 130;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: clamp(12px, 3vw, 32px);
}

.nova-modal[hidden] {
	display: none;
}

.nova-modal__veil {
	position: absolute;
	inset: 0;
	background: rgba(5, 7, 13, 0.82);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}

.nova-modal__panel {
	position: relative;
	width: min(760px, 100%);
	max-height: 88vh;
	overflow-y: auto;
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-strong);
	border-radius: var(--nova-radius-block);
	box-shadow: 0 60px 120px -50px rgba(0, 0, 0, 0.9);
	animation: novaRise 240ms ease both;
}

.nova-modal__close {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	width: 44px;
	height: 44px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	background: rgba(5, 7, 13, 0.8);
	color: var(--nova-text);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.nova-modal__close:hover,
.nova-modal__close:focus-visible {
	background: var(--nova-primary);
	border-color: var(--nova-primary);
	color: #fff;
}

.nova-modal__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
	gap: 0;
}

.nova-shell .nova-modal__img {
	width: 100%;
	height: 100%;
	max-height: 420px;
	object-fit: cover;
	border-radius: var(--nova-radius-block) 0 0 var(--nova-radius-block);
}

.nova-modal__img[hidden] {
	display: none;
}

.nova-modal__body {
	padding: clamp(22px, 3vw, 34px);
}

.nova-modal__type {
	margin: 0 0 10px;
	font-family: var(--nova-head);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.2em;
	color: var(--nova-primary-hover);
}

.nova-modal__title {
	margin: 0 0 12px;
	font-family: var(--nova-head);
	font-weight: 700;
	font-size: clamp(22px, 2.6vw, 30px);
	line-height: 1.15;
	color: var(--nova-text);
}

.nova-modal__pills {
	margin: 0 0 18px;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.nova-pill {
	display: inline-flex;
	align-items: center;
	padding: 5px 11px;
	border-radius: 999px;
	border: 1px solid var(--nova-border-strong);
	background: rgba(255, 255, 255, 0.04);
	font-size: 12.5px;
	color: var(--nova-body);
}

.nova-pill--rating {
	border-color: rgba(229, 9, 32, 0.4);
	background: var(--nova-accent-soft);
	color: var(--nova-rating);
}

.nova-modal__desc {
	margin: 0 0 24px;
	color: var(--nova-muted);
	font-size: 15px;
	line-height: 1.65;
}

.nova-modal__body .nova-btn {
	min-height: 50px;
	padding: 0 22px;
}

.nova-modal__note {
	margin: 16px 0 0;
	font-size: 12.5px;
	color: var(--nova-subtle);
	line-height: 1.5;
}

/* --------------------------------------------------------------------------
   Cookie bar
   -------------------------------------------------------------------------- */

.nova-cookies {
	position: fixed;
	z-index: 125;
	left: clamp(12px, 3vw, 24px);
	right: clamp(12px, 3vw, 24px);
	bottom: clamp(12px, 3vw, 24px);
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-strong);
	border-radius: 16px;
	padding: clamp(18px, 2vw, 22px);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	justify-content: space-between;
	box-shadow: 0 40px 80px -40px rgba(0, 0, 0, 0.9);
}

/* Room for the consent bar while it is up, so the end of the page never sits
   under it out of reach. */
body.nova-shell.has-cookie-bar {
	padding-bottom: 140px;
}

.nova-cookies[hidden] {
	display: none;
}

.nova-cookies p {
	margin: 0;
	font-size: 14px;
	color: var(--nova-muted);
	line-height: 1.6;
	max-width: 62ch;
}

.nova-cookies__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.nova-cookies__actions .nova-btn {
	min-height: 46px;
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.nova-footer {
	background: var(--nova-surface);
	border-top: 1px solid rgba(255, 255, 255, 0.10);
	padding: clamp(46px, 5vw, 72px) 0 26px;
}

.nova-footer__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));
	gap: clamp(24px, 3vw, 40px);
}

.nova-footer__logo {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 16px;
}

.nova-footer__wordmark {
	font-family: var(--nova-head);
	font-weight: 800;
	font-size: 19px;
	color: var(--nova-text);
}

.nova-footer__tagline {
	margin: 0 0 18px;
	color: var(--nova-muted);
	font-size: 14.5px;
	line-height: 1.65;
	max-width: 30ch;
}

.nova-footer__socials {
	display: flex;
	gap: 8px;
}

.nova-social {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 10px;
	border: 1px dashed rgba(255, 255, 255, 0.18);
	color: var(--nova-subtle);
	font-size: 11px;
	font-weight: 700;
	font-family: var(--nova-head);
}

.nova-footer__title {
	margin: 0 0 14px;
	font-family: var(--nova-head);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--nova-text);
}

.nova-footer__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.nova-footer__list a {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	color: var(--nova-muted);
	font-size: 14.5px;
}

.nova-footer__list a:hover {
	color: var(--nova-primary-hover);
}

.nova-footer__note {
	margin: 12px 0 0;
	font-size: 12.5px;
	color: var(--nova-subtle);
	line-height: 1.5;
}

.nova-lang {
	display: inline-flex;
	padding: 4px;
	border-radius: 12px;
	background: var(--nova-bg);
	border: 1px solid var(--nova-border);
	gap: 4px;
}

.nova-lang__btn {
	min-width: 56px;
	min-height: 40px;
	border-radius: 9px;
	border: 0;
	background: transparent;
	color: var(--nova-muted);
	font-family: var(--nova-head);
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
}

.nova-lang__btn.is-active {
	background: var(--nova-primary);
	color: #fff;
}

.nova-footer__bottom {
	margin-top: clamp(30px, 3.4vw, 48px);
	padding-top: 22px;
	border-top: 1px solid rgba(255, 255, 255, 0.10);
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
	justify-content: space-between;
}

.nova-footer__bottom p {
	margin: 0;
	font-size: 13px;
	color: var(--nova-subtle);
}

@media (max-width: 699.98px) {
	.nova-footer__grid {
		grid-template-columns: 1fr;
	}
}

/* --------------------------------------------------------------------------
   WooCommerce pages (product, cart, checkout, account)

   The design only specifies the marketing pages; this keeps the shop legible
   on the dark shell and reuses the same buttons and fields.
   -------------------------------------------------------------------------- */

.nova-shell.woocommerce-page .nova-main,
.nova-shell.single-product .nova-main {
	max-width: var(--nova-max);
	margin: 0 auto;
	padding: clamp(32px, 5vw, 64px) var(--nova-gutter) clamp(48px, 7vw, 96px);
}

.nova-shell.woocommerce-page h1,
.nova-shell.woocommerce-page h2,
.nova-shell.woocommerce-page h3,
.nova-shell.single-product h1 {
	font-family: var(--nova-head);
	letter-spacing: -0.02em;
	color: var(--nova-text);
}

.nova-shell .woocommerce-Price-amount,
.nova-shell .price {
	font-family: var(--nova-head);
	font-weight: 700;
	color: var(--nova-text);
}

.nova-shell .woocommerce div.product form.cart .variations,
.nova-shell .woocommerce table,
.nova-shell .woocommerce-cart-form {
	color: var(--nova-body);
}

.nova-shell .woocommerce div.product form.cart .variations label {
	color: var(--nova-text);
	font-weight: 600;
}

.nova-shell .woocommerce select,
.nova-shell .woocommerce input[type="text"],
.nova-shell .woocommerce input[type="email"],
.nova-shell .woocommerce input[type="tel"],
.nova-shell .woocommerce input[type="password"],
.nova-shell .woocommerce input[type="number"],
.nova-shell .woocommerce textarea {
	min-height: 48px;
	padding: 0 14px;
	border-radius: 12px;
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-strong);
	color: var(--nova-text);
}

.nova-shell .woocommerce textarea {
	padding: 12px 14px;
}

.nova-shell .woocommerce select:focus,
.nova-shell .woocommerce input:focus,
.nova-shell .woocommerce textarea:focus {
	border-color: var(--nova-primary-hover);
	outline: none;
}

.nova-shell .woocommerce a.button,
.nova-shell .woocommerce button.button,
.nova-shell .woocommerce input.button,
.nova-shell .woocommerce #respond input#submit,
.nova-shell .woocommerce a.button.alt,
.nova-shell .woocommerce button.button.alt {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 0 24px;
	border-radius: var(--nova-radius-btn);
	background: var(--nova-primary);
	border: 1px solid var(--nova-primary);
	color: #fff;
	font-family: var(--nova-body-font);
	font-size: 15px;
	font-weight: 700;
	box-shadow: var(--nova-shadow-red);
	transition: background 200ms ease, border-color 200ms ease, transform 200ms ease;
}

.nova-shell .woocommerce a.button:hover,
.nova-shell .woocommerce button.button:hover,
.nova-shell .woocommerce input.button:hover,
.nova-shell .woocommerce a.button.alt:hover,
.nova-shell .woocommerce button.button.alt:hover {
	background: var(--nova-primary-hover);
	border-color: var(--nova-primary-hover);
	color: #fff;
	transform: translateY(-1px);
}

.nova-shell .woocommerce .woocommerce-message,
.nova-shell .woocommerce .woocommerce-info,
.nova-shell .woocommerce .woocommerce-error {
	background: var(--nova-surface);
	border-top-color: var(--nova-primary);
	color: var(--nova-body);
}

.nova-shell .woocommerce ul.products li.product a img {
	border-radius: var(--nova-radius-card);
}

/* --------------------------------------------------------------------------
   WooCommerce Blocks (cart, checkout, order confirmation)

   The rules above only reach the classic shortcode markup. The cart and the
   checkout are block-based, ship their own light design, and their stylesheets
   are printed after this file — so every selector here is anchored on
   `body.nova-shell` to outweigh them on specificity rather than with
   `!important`.
   -------------------------------------------------------------------------- */

body.nova-shell .wp-block-woocommerce-cart,
body.nova-shell .wp-block-woocommerce-checkout,
body.nova-shell .wc-block-components-order-confirmation {
	color: var(--nova-body);
	font-family: var(--nova-body-font);
}

/* Hello Elementor wraps these pages in its own header/content shell. */
body.nova-shell #content.site-main {
	max-width: var(--nova-max);
	margin: 0 auto;
	padding: 0 var(--nova-gutter);
}

body.nova-shell .page-header .entry-title,
body.nova-shell .woocommerce-products-header__title {
	font-family: var(--nova-head);
	font-weight: 800;
	letter-spacing: -0.02em;
	color: var(--nova-text);
}

/* Headings and labels ---------------------------------------------------- */

body.nova-shell .wc-block-components-title,
body.nova-shell .wc-block-components-checkout-step__title,
body.nova-shell .wc-block-components-order-summary__title-text {
	font-family: var(--nova-head);
	color: var(--nova-text);
}

body.nova-shell .wc-block-components-checkout-step__description,
body.nova-shell .wc-block-components-product-metadata,
body.nova-shell .wc-block-components-totals-item__label {
	color: var(--nova-body);
}

body.nova-shell .wc-block-components-product-name,
body.nova-shell .wc-block-components-totals-item__value,
body.nova-shell .wc-block-components-formatted-money-amount,
body.nova-shell .wc-block-components-product-price {
	color: var(--nova-text);
}

body.nova-shell .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
body.nova-shell .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	color: var(--nova-text);
	font-family: var(--nova-head);
	font-weight: 700;
}

/* Links inside the blocks: the Elementor kit prints a bare `a { color }`
   rule after this file, which would otherwise win here too. */
body.nova-shell .wp-block-woocommerce-cart a,
body.nova-shell .wp-block-woocommerce-checkout a,
body.nova-shell .wc-block-components-button.is-link {
	color: var(--nova-primary-hover);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Panels, sidebar and separators ----------------------------------------- */

body.nova-shell .wc-block-components-sidebar,
body.nova-shell .wc-block-cart__sidebar,
body.nova-shell .wc-block-checkout__sidebar {
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-strong);
	border-radius: var(--nova-radius-block);
	padding: 20px;
}

body.nova-shell .wc-block-components-panel.has-border,
body.nova-shell .wc-block-cart-items,
body.nova-shell .wc-block-cart-items td,
body.nova-shell .wc-block-components-order-summary-item {
	border-color: var(--nova-border-strong);
}

body.nova-shell .wc-block-components-panel__button {
	color: var(--nova-text);
}

/* Form controls ---------------------------------------------------------- */

body.nova-shell .wc-block-components-text-input input[type="text"],
body.nova-shell .wc-block-components-text-input input[type="email"],
body.nova-shell .wc-block-components-text-input input[type="tel"],
body.nova-shell .wc-block-components-text-input input[type="number"],
body.nova-shell .wc-block-components-text-input input[type="password"],
body.nova-shell .wc-block-components-text-input input[type="url"],
body.nova-shell .wc-block-components-textarea,
body.nova-shell .wc-block-components-select .wc-block-components-select__select,
body.nova-shell .wc-block-components-combobox-control input {
	background-color: rgba(255, 255, 255, 0.04);
	border: 1px solid var(--nova-border-strong);
	border-radius: var(--nova-radius-btn);
	color: var(--nova-text);
}

body.nova-shell .wc-block-components-text-input input:focus,
body.nova-shell .wc-block-components-textarea:focus,
body.nova-shell .wc-block-components-select .wc-block-components-select__select:focus {
	border-color: var(--nova-primary-hover);
	outline: none;
}

body.nova-shell .wc-block-components-text-input label,
body.nova-shell .wc-block-components-select label,
body.nova-shell .wc-block-components-checkbox__label,
body.nova-shell .wc-block-components-radio-control__label {
	color: var(--nova-body);
}

body.nova-shell .wc-block-components-quantity-selector,
body.nova-shell .wc-block-components-quantity-selector input {
	background: rgba(255, 255, 255, 0.04);
	border-color: var(--nova-border-strong);
	color: var(--nova-text);
}

body.nova-shell .wc-block-components-radio-control-accordion-option,
body.nova-shell .wc-block-components-radio-control__option {
	border-color: var(--nova-border-strong);
}

/* Buttons ---------------------------------------------------------------- */

body.nova-shell .wc-block-components-button:not(.is-link) {
	min-height: 52px;
	padding: 0 24px;
	border-radius: var(--nova-radius-btn);
	background-color: var(--nova-primary);
	border: 1px solid var(--nova-primary);
	color: #fff;
	font-family: var(--nova-body-font);
	font-weight: 700;
	box-shadow: var(--nova-shadow-red-sm);
}

body.nova-shell .wc-block-components-button:not(.is-link):hover {
	background-color: var(--nova-primary-hover);
	border-color: var(--nova-primary-hover);
	color: #fff;
}

body.nova-shell .wc-block-components-button:not(.is-link) .wc-block-components-button__text {
	color: #fff;
}

/* Notices ---------------------------------------------------------------- */

body.nova-shell .wc-block-components-notice-banner {
	background: var(--nova-surface);
	border-color: var(--nova-border-strong);
	color: var(--nova-body);
}

body.nova-shell .wc-block-components-notice-banner.is-error {
	border-color: var(--nova-error);
}

/* --------------------------------------------------------------------------
   Classic checkout (one-step order form)

   The checkout page runs the shortcode form so the plan fields sit next to the
   name and e-mail. Two columns on desktop, one below the tablet breakpoint.
   -------------------------------------------------------------------------- */

body.nova-shell .woocommerce-checkout .woocommerce {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
	gap: clamp(24px, 4vw, 48px);
	align-items: start;
}

body.nova-shell .woocommerce-checkout form.checkout {
	display: contents;
}

body.nova-shell .woocommerce-checkout #customer_details {
	grid-column: 1;
}

body.nova-shell .woocommerce-checkout h3#order_review_heading,
body.nova-shell .woocommerce-checkout #order_review {
	grid-column: 2;
}

body.nova-shell .woocommerce-checkout .woocommerce-billing-fields > h3,
body.nova-shell .woocommerce-checkout .woocommerce-additional-fields > h3,
body.nova-shell .woocommerce-checkout h3#order_review_heading {
	font-family: var(--nova-head);
	font-size: clamp(20px, 2.2vw, 24px);
	font-weight: 700;
	letter-spacing: -0.015em;
	color: var(--nova-text);
	margin: 0 0 18px;
}

body.nova-shell .woocommerce-checkout .form-row label {
	display: block;
	margin-bottom: 8px;
	font-size: 14px;
	font-weight: 600;
	color: var(--nova-body);
}

body.nova-shell .woocommerce-checkout .form-row .required {
	color: var(--nova-primary-hover);
	text-decoration: none;
}

body.nova-shell .woocommerce-checkout .form-row {
	margin-bottom: 18px;
}

body.nova-shell .woocommerce-checkout #order_review {
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-strong);
	border-radius: var(--nova-radius-block);
	padding: 22px;
	position: sticky;
	top: 96px;
}

body.nova-shell .woocommerce-checkout .shop_table {
	width: 100%;
	border: 0;
	border-collapse: collapse;
}

body.nova-shell .woocommerce-checkout .shop_table th,
body.nova-shell .woocommerce-checkout .shop_table td {
	padding: 12px 0;
	border-bottom: 1px solid var(--nova-border-soft);
	text-align: left;
	color: var(--nova-body);
}

body.nova-shell .woocommerce-checkout .shop_table thead th,
body.nova-shell .woocommerce-checkout .shop_table .order-total th,
body.nova-shell .woocommerce-checkout .shop_table .order-total td {
	color: var(--nova-text);
	font-family: var(--nova-head);
	font-weight: 700;
}

body.nova-shell .woocommerce-checkout .shop_table td:last-child,
body.nova-shell .woocommerce-checkout .shop_table th:last-child {
	text-align: right;
}

body.nova-shell .woocommerce-checkout #payment {
	background: transparent;
	border-radius: 0;
	margin-top: 20px;
}

body.nova-shell .woocommerce-checkout #payment ul.payment_methods {
	padding: 0;
	margin: 0 0 18px;
	border: 0;
	list-style: none;
}

body.nova-shell .woocommerce-checkout #payment ul.payment_methods li {
	padding: 14px 16px;
	border: 1px solid var(--nova-border-strong);
	border-radius: var(--nova-radius-btn);
	color: var(--nova-text);
}

body.nova-shell .woocommerce-checkout #payment div.payment_box {
	background: rgba(255, 255, 255, 0.04);
	border-radius: var(--nova-radius-btn);
	color: var(--nova-body);
	font-size: 15px;
}

body.nova-shell .woocommerce-checkout #payment div.payment_box::before {
	display: none;
}

body.nova-shell .woocommerce-checkout #place_order {
	width: 100%;
	float: none;
}

/* Reassurance strip printed after the form. */
.nova-checkout-trust {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 32px;
	margin: 28px 0 0;
	padding: 18px 0 0;
	border-top: 1px solid var(--nova-border-soft);
	list-style: none;
}

.nova-checkout-trust li {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 14px;
	color: var(--nova-subtle);
}

.nova-checkout-trust__icon {
	display: inline-flex;
	color: var(--nova-primary-hover);
}

@media (max-width: 1023.98px) {
	body.nova-shell .woocommerce-checkout .woocommerce {
		grid-template-columns: minmax(0, 1fr);
	}

	body.nova-shell .woocommerce-checkout #customer_details,
	body.nova-shell .woocommerce-checkout h3#order_review_heading,
	body.nova-shell .woocommerce-checkout #order_review {
		grid-column: 1;
	}

	body.nova-shell .woocommerce-checkout #order_review {
		position: static;
	}
}

/* --------------------------------------------------------------------------
   Poster cards built with Elementor's image box

   Scoped to `.nova-poster-card` rather than `.nova-native-grid-card`: the six
   category cards share the latter, sit three per row with a full sentence, and
   must keep their larger title.
   -------------------------------------------------------------------------- */

body.nova-shell .nova-poster-card .elementor-image-box-title {
	margin: 0 0 4px;
	font-family: var(--nova-head);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.01em;
	text-wrap: balance;
}

body.nova-shell .nova-poster-card .elementor-image-box-description {
	margin: 0;
	font-size: 13px;
	line-height: 1.45;
	color: var(--nova-subtle);
}

/* Keep every poster on the same 2:3 frame whatever the source file. */
body.nova-shell .nova-poster-card .elementor-image-box-img {
	margin-bottom: 12px;
}

body.nova-shell .nova-poster-card .elementor-image-box-img img {
	width: 100%;
	aspect-ratio: 2 / 3;
	object-fit: cover;
	border-radius: 10px;
	display: block;
}

/* The whole card reacts, so it reads as one target. */
body.nova-shell .nova-poster-card [data-nova-modal] {
	display: block;
	cursor: pointer;
}

body.nova-shell .nova-poster-card [data-nova-modal]:focus-visible {
	outline: 3px solid var(--nova-primary-hover);
	outline-offset: 4px;
	border-radius: 12px;
}

body.nova-shell .nova-poster-card .elementor-image-box-img img {
	transition: transform 240ms ease;
}

body.nova-shell .nova-poster-card:hover .elementor-image-box-img img {
	transform: scale(1.03);
}

@media (max-width: 699.98px) {
	body.nova-shell .nova-poster-card .elementor-image-box-title {
		font-size: 15px;
	}
}

/* --------------------------------------------------------------------------
   Category cards ("Explore every world")

   Same idea as the poster cards, different proportions: three per row on a
   3:2 landscape visual, so the title stays larger than the 16px used on the
   posters. These cards are navigation — the link is kept, no modal.
   -------------------------------------------------------------------------- */

body.nova-shell .nova-category-card .elementor-image-box-title {
	margin: 0 0 6px;
	font-family: var(--nova-head);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -0.015em;
}

body.nova-shell .nova-category-card .elementor-image-box-description {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
	color: var(--nova-muted);
}

body.nova-shell .nova-category-card .elementor-image-box-img {
	margin-bottom: 14px;
}

body.nova-shell .nova-category-card .elementor-image-box-img img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-radius: 10px;
	display: block;
	transition: transform 240ms ease;
}

body.nova-shell .nova-category-card:hover .elementor-image-box-img img {
	transform: scale(1.03);
}

/* The card is a link: make the whole surface feel like one. */
body.nova-shell .nova-category-card a {
	text-decoration: none;
}

body.nova-shell .nova-category-card a:focus-visible {
	outline: 3px solid var(--nova-primary-hover);
	outline-offset: 4px;
	border-radius: 10px;
}

@media (max-width: 699.98px) {
	body.nova-shell .nova-category-card .elementor-image-box-title {
		font-size: 18px;
	}
}

/* --------------------------------------------------------------------------
   Recommended gear (affiliate block)
   -------------------------------------------------------------------------- */

.nova-gear {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
	margin: 28px 0 0;
	padding: 0;
	list-style: none;
}

.nova-gear__item {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: 18px;
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-strong);
	border-radius: var(--nova-radius-card);
}

.nova-gear__badge {
	position: absolute;
	top: 12px;
	right: 12px;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--nova-accent-soft);
	border: 1px solid var(--nova-accent-border);
	color: var(--nova-primary-hover);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.nova-gear__frame {
	display: block;
	width: 100%;
	background: rgba(255, 255, 255, 0.04);
	border-radius: 10px;
	overflow: hidden;
}

.nova-gear__frame img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: contain;
	display: block;
}

/* Stand-in for a device with no photograph yet: the card keeps its shape and
   reads as deliberate, where an empty frame reads as a failed image. */
.nova-gear__frame--mono {
	display: grid;
	place-items: center;
	aspect-ratio: 4 / 3;
	background:
		radial-gradient(120% 120% at 50% 0%, rgba(229, 9, 32, 0.16), transparent 62%),
		rgba(255, 255, 255, 0.03);
	border: 1px solid var(--nova-border-soft);
}

.nova-gear__mono {
	font-family: var(--nova-head);
	font-size: clamp(28px, 4vw, 40px);
	font-weight: 800;
	letter-spacing: 0.04em;
	color: rgba(255, 255, 255, 0.34);
}

.nova-gear__name {
	margin: 0;
	font-family: var(--nova-head);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--nova-text);
}

.nova-gear__pitch {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
	color: var(--nova-body);
}

.nova-gear__cta {
	margin-top: auto;
	align-self: stretch;
}

.nova-gear__disclosure {
	margin: 20px 0 0;
	font-size: 13px;
	line-height: 1.5;
	color: var(--nova-subtle);
}

.nova-gear__empty {
	padding: 18px;
	border: 1px dashed var(--nova-border-strong);
	border-radius: var(--nova-radius-card);
	color: var(--nova-subtle);
}

@media (max-width: 1023.98px) {
	.nova-gear {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 699.98px) {
	.nova-gear {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* --------------------------------------------------------------------------
   Centred section headings

   Three pieces stacked and centred: a small letterspaced overline, a heavy
   two-tone title, then one line of supporting text. Applied to the marketing
   pages only — the legal pages use the same heading levels for their clauses
   and stay left aligned.
   -------------------------------------------------------------------------- */

/* The overline runs in the body face, not the heading one: the contrast
   between a light letterspaced grotesque and the heavy geometric title is
   what makes the pair read as two distinct levels.

   `.elementor-element` is in the chain on purpose. Elementor writes its
   per-widget typography with four classes
   (.elementor-608 .elementor-element.elementor-element-00000107 .elementor-heading-title);
   without it these rules lose on specificity and only the spacing gets through. */
body.nova-shell .elementor-element.nova-section-overline .elementor-heading-title {
	display: block;
	margin-bottom: 14px;
	font-family: var(--nova-body-font);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--nova-primary);
	text-align: center;
}

body.nova-shell .elementor-element.nova-section-title .elementor-heading-title {
	font-family: var(--nova-head);
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.05;
	text-align: center;
	text-wrap: balance;
}

/* The accent word. Set on the span so it beats the colour Elementor writes
   on the heading itself. */
body.nova-shell .nova-accent {
	color: var(--nova-primary);
}

body.nova-shell .nova-section-lead {
	text-align: center;
}

body.nova-shell .nova-section-lead p {
	max-width: 62ch;
	margin-left: auto;
	margin-right: auto;
}

/* Calls to action sitting under a centred title. */
body.nova-shell .nova-centered-row {
	justify-content: center;
}

@media (max-width: 699.98px) {
	body.nova-shell .nova-section-overline .elementor-heading-title {
		font-size: 11px;
		letter-spacing: 0.18em;
	}
}

/* Widgets that print their own <section> never got the heading classes above —
   the FAQ, the testimonials, the devices grid, the recommended gear and the
   setup and diagnostics blocks all escape their title, so no accent span can
   be injected into it. Centre them the same way, minus the accent word, so a
   band rendered by a widget reads like one authored in Elementor.

   Only the section furniture moves: headings, the lead paragraph and the note
   underneath. The cards keep their left alignment — a centred paragraph inside
   a card has no edge to line up against and looks accidental. */
/* A widget-rendered band opens on the same red overline as an Elementor one.
   `.nova-overline` on its own is the left-aligned variant used inside cards and
   heroes, so the type is restated here to match the Elementor pair exactly:
   body face against the heavy geometric title, and the primary red rather than
   the lighter hover tint. */
body.nova-shell .nova-section--faq .nova-overline,
body.nova-shell .nova-section--gear .nova-overline,
body.nova-shell .nova-section--devices .nova-overline,
body.nova-shell .nova-section--setup .nova-overline,
body.nova-shell .nova-section--diag .nova-overline,
body.nova-shell .nova-section--testimonials .nova-overline {
	margin: 0 0 14px;
	font-family: var(--nova-body-font);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	text-align: center;
	color: var(--nova-primary);
}

@media (max-width: 699.98px) {
	body.nova-shell .nova-section--faq .nova-overline,
	body.nova-shell .nova-section--gear .nova-overline,
	body.nova-shell .nova-section--devices .nova-overline,
	body.nova-shell .nova-section--setup .nova-overline,
	body.nova-shell .nova-section--diag .nova-overline,
	body.nova-shell .nova-section--testimonials .nova-overline {
		font-size: 11px;
		letter-spacing: 0.18em;
	}
}

body.nova-shell .nova-section--faq .nova-h2,
body.nova-shell .nova-section--gear .nova-h2,
body.nova-shell .nova-section--devices .nova-h2,
body.nova-shell .nova-section--setup .nova-h2,
body.nova-shell .nova-section--diag .nova-h2 {
	font-family: var(--nova-head);
	font-weight: 800;
	letter-spacing: -0.02em;
	text-align: center;
	text-wrap: balance;
}

body.nova-shell .nova-section--faq .nova-chips,
body.nova-shell .nova-section--faq .nova-count {
	justify-content: center;
	text-align: center;
}

body.nova-shell .nova-section--faq .nova-section__lead,
body.nova-shell .nova-section--gear .nova-section__lead,
body.nova-shell .nova-section--devices .nova-section__lead,
body.nova-shell .nova-section--setup .nova-section__lead,
body.nova-shell .nova-section--diag .nova-section__lead,
body.nova-shell .nova-section--testimonials .nova-section__lead {
	max-width: 62ch;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

/* The affiliate notice closes the gear band, so it follows the same axis as
   the title it sits under. */
body.nova-shell .nova-section--gear .nova-gear__disclosure {
	max-width: 70ch;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

/* --------------------------------------------------------------------------
   Vertical rhythm of the marketing bands

   Every band on these pages is an Elementor container that already carries its
   own top and bottom padding. A nova widget dropped inside one used to add a
   second helping of padding on top of that, which is what opened the 200 to
   300 pixel holes between the bands. The container owns the rhythm; the
   embedded section contributes nothing.
   -------------------------------------------------------------------------- */

body.nova-shell .elementor-widget-container > .nova-section {
	padding-top: 0;
	padding-bottom: 0;
}

/* "Where to buy" opens a second block inside the devices band, under the call
   to action that closes the first one. It is the one embedded section that
   still needs a separation of its own — the container's flex gap alone would
   run the two blocks together. */
body.nova-shell .elementor-widget-container > .nova-section--gear {
	padding-top: clamp(40px, 4.5vw, 64px);
}

/* The pricing and slider scripts ride in an Elementor HTML widget. The widget
   paints nothing, but it still takes a slot in the container's flex flow and
   drags one gap of dead space into the band with it. Taking it out of the flow
   does not stop the script inside from running — the parser has already run it
   by the time this rule applies. */
body.nova-shell .nova-script-only {
	display: none;
}

/* --------------------------------------------------------------------------
   Testimonials
   -------------------------------------------------------------------------- */

body.nova-shell .nova-section--testimonials .nova-h2 {
	font-family: var(--nova-head);
	font-weight: 800;
	letter-spacing: -0.02em;
	text-align: center;
	text-wrap: balance;
}

.nova-quotes {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	margin: 28px 0 0;
	padding: 0;
	list-style: none;
}

.nova-quote {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 22px;
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-strong);
	border-radius: var(--nova-radius-card);
}

/* The screenshot, when one is attached. Portrait phone captures are tall, so
   the frame caps the height and the full size opens in a new tab. */
.nova-quote__shot {
	display: block;
	max-height: 320px;
	overflow: hidden;
	border-radius: 10px;
	border: 1px solid var(--nova-border-strong);
	background: rgba(255, 255, 255, 0.03);
}

.nova-quote__shot img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
	object-position: top center;
}

.nova-quote__shot:focus-visible {
	outline: 3px solid var(--nova-primary-hover);
	outline-offset: 3px;
}

.nova-quote__stars {
	margin: 0;
	font-size: 15px;
	letter-spacing: 0.12em;
	color: var(--nova-primary);
}

.nova-quote__stars-off {
	color: var(--nova-border-strong);
}

.nova-quote__text {
	margin: 0;
	font-size: 16px;
	line-height: 1.6;
	color: var(--nova-text);
	quotes: none;
}

.nova-quote__author {
	margin: auto 0 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding-top: 12px;
	border-top: 1px solid var(--nova-border-soft);
}

.nova-quote__name {
	font-family: var(--nova-head);
	font-weight: 700;
	font-size: 15px;
	color: var(--nova-text);
}

.nova-quote__context {
	font-size: 13px;
	color: var(--nova-subtle);
}

/* Slider variant. Nothing advances on its own: the reader scrolls, swipes or
   uses the arrows, so no card is ever pulled away mid-sentence. */
.nova-quotes__arrows {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	margin: 20px 0 -8px;
}

.nova-quotes--rail {
	display: flex;
	grid-template-columns: none;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding-left: 2px;
	padding-bottom: 8px;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
}

/* Same treatment as the poster rails: without a colour the browser paints its
   own light scrollbar, which reads as a white rule across the dark band. */
.nova-quotes--rail::-webkit-scrollbar {
	height: 8px;
}

.nova-quotes--rail::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.22);
	border-radius: 999px;
}

.nova-quotes--rail .nova-quote {
	flex: 0 0 clamp(260px, 31%, 380px);
	scroll-snap-align: start;
}

@media (max-width: 1023.98px) {
	.nova-quotes {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.nova-quotes--rail .nova-quote {
		flex-basis: clamp(240px, 46%, 340px);
	}
}

@media (max-width: 699.98px) {
	.nova-quotes {
		grid-template-columns: minmax(0, 1fr);
	}

	.nova-quotes--rail .nova-quote {
		flex-basis: 82%;
	}

	.nova-quotes__arrows {
		display: none;
	}
}

/* The devices grid sits inside a band that already carries a title, so its own
   heading is left empty. Hide it rather than repeat the wording — an empty
   heading in the page would still be announced by a screen reader. */
body.nova-shell .nova-devices-inline .nova-h2:empty {
	display: none;
}

body.nova-shell .nova-devices-inline .nova-section {
	padding-top: 0;
	padding-bottom: 0;
}

body.nova-shell .nova-devices-inline .nova-devices {
	justify-content: center;
}

/* --------------------------------------------------------------------------
   Channel browser

   Two panes over one list. The left pane is the index of countries, the right
   one the channels of whichever country is selected. Both panes scroll inside
   themselves rather than growing the page: the directory runs to hundreds of
   entries and the two searches have to stay within reach of the reader.
   -------------------------------------------------------------------------- */

.nova-stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: clamp(26px, 3vw, 40px) 0 clamp(20px, 2.4vw, 32px);
	padding: 0;
	list-style: none;
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-strong);
	border-radius: var(--nova-radius-card);
	overflow: hidden;
}

.nova-stat {
	padding: clamp(18px, 2.2vw, 28px) clamp(16px, 2vw, 26px);
	text-align: center;
}

.nova-stat + .nova-stat {
	border-left: 1px solid var(--nova-border-soft);
}

.nova-stat__value {
	display: block;
	font-family: var(--nova-head);
	font-size: clamp(30px, 4vw, 46px);
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.02em;
	color: var(--nova-primary);
	font-variant-numeric: tabular-nums;
}

.nova-stat__label {
	display: block;
	margin-top: 6px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--nova-subtle);
}

.nova-browser__filters {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(14px, 1.8vw, 24px);
	margin: 0 0 clamp(18px, 2.2vw, 28px);
	padding: clamp(16px, 2vw, 24px);
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-strong);
	border-radius: var(--nova-radius-card);
}

.nova-field__input {
	width: 100%;
	height: 52px;
	padding: 0 16px;
	font-size: 15px;
	color: var(--nova-text);
	background: var(--nova-bg);
	border: 1px solid var(--nova-border-strong);
	border-radius: 12px;
	transition: border-color 180ms ease, box-shadow 180ms ease;
}

.nova-field__input::placeholder {
	color: var(--nova-subtle);
}

.nova-field__input:focus {
	outline: none;
	border-color: var(--nova-primary);
	box-shadow: 0 0 0 3px rgba(229, 9, 32, 0.22);
}

.nova-browser {
	display: grid;
	grid-template-columns: minmax(0, 340px) minmax(0, 1fr);
	gap: clamp(14px, 1.8vw, 24px);
	align-items: start;
}

.nova-browser__pane {
	padding: clamp(16px, 2vw, 24px);
	background: var(--nova-surface);
	border: 1px solid var(--nova-border-strong);
	border-radius: var(--nova-radius-card);
}

.nova-browser__kicker {
	margin: 0 0 10px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--nova-primary);
}

.nova-browser__h {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	margin: 0 0 14px;
	font-family: var(--nova-head);
	font-size: clamp(22px, 2.4vw, 30px);
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--nova-text);
}

.nova-browser__badge {
	font-family: var(--nova-body-font);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--nova-subtle);
}

.nova-bcats {
	max-height: 560px;
	margin: 0;
	padding: 0 6px 0 0;
	list-style: none;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
}

.nova-bcats::-webkit-scrollbar {
	width: 8px;
}

.nova-bcats::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.22);
	border-radius: 999px;
}

.nova-bcat {
	display: flex;
	color: var(--nova-text);
	align-items: center;
	gap: 12px;
	width: 100%;
	padding: 12px 14px;
	text-align: left;
	background: transparent;
	border: 1px solid transparent;
	border-left: 3px solid transparent;
	border-radius: 12px;
	cursor: pointer;
	transition: background-color 160ms ease, border-color 160ms ease;
}

.nova-bcat:hover {
	background: rgba(255, 255, 255, 0.04);
}

.nova-bcat.is-active {
	background: rgba(229, 9, 32, 0.10);
	border-color: rgba(229, 9, 32, 0.32);
	border-left-color: var(--nova-primary);
}

.nova-bcat:focus-visible {
	outline: 3px solid var(--nova-primary-hover);
	outline-offset: 2px;
}

.nova-bcat__code {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border-radius: 10px;
	background: rgba(229, 9, 32, 0.14);
	border: 1px solid rgba(229, 9, 32, 0.28);
	font-family: var(--nova-head);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.06em;
	color: var(--nova-primary-hover);
}

.nova-bcat__code--lg {
	width: 56px;
	height: 56px;
	border-radius: 14px;
	font-size: 17px;
}

.nova-bcat__copy {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.nova-bcat__name {
	font-family: var(--nova-head);
	font-size: 15px;
	font-weight: 700;
	color: var(--nova-text);
}

.nova-bcat__meta {
	font-size: 12.5px;
	color: var(--nova-subtle);
}

.nova-browser__head {
	display: flex;
	align-items: center;
	gap: 14px;
	padding-bottom: 16px;
	margin-bottom: 4px;
	border-bottom: 1px solid var(--nova-border-soft);
}

/* While a search spans every country the code tile means nothing, so it steps
   aside and the title carries the state on its own. */
.nova-browser__head.is-searching .nova-bcat__code--lg {
	display: none;
}

.nova-browser__headcopy {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.nova-browser__title {
	font-family: var(--nova-head);
	font-size: clamp(22px, 2.6vw, 32px);
	font-weight: 800;
	letter-spacing: -0.01em;
	line-height: 1.1;
	color: var(--nova-text);
}

.nova-browser__sub {
	font-size: 13px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--nova-subtle);
}

.nova-browser__channels {
	max-height: 560px;
	margin: 0;
	padding: 4px 6px 0 0;
	list-style: none;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
}

.nova-browser__channels::-webkit-scrollbar {
	width: 8px;
}

.nova-browser__channels::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.22);
	border-radius: 999px;
}

.nova-bch {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 4px;
	border-bottom: 1px solid var(--nova-border-soft);
}

.nova-bch:last-child {
	border-bottom: 0;
}

/* The row carries its own display, which beats the browser default for the
   hidden attribute — without this the script hides nothing and every country
   stays on screen at once. Same guard as .nova-channel and .nova-acc. */
.nova-bch[hidden] {
	display: none;
}

.nova-bcats > li[hidden] {
	display: none;
}

.nova-browser__empty[hidden] {
	display: none;
}

.nova-bch__mono {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid var(--nova-border-strong);
	font-family: var(--nova-head);
	font-size: 15px;
	font-weight: 800;
	letter-spacing: 0.04em;
	color: rgba(255, 255, 255, 0.55);
}

.nova-bch__copy {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.nova-bch__name {
	font-family: var(--nova-head);
	font-size: clamp(16px, 1.6vw, 19px);
	font-weight: 700;
	color: var(--nova-text);
}

.nova-bch__meta {
	font-size: 12.5px;
	letter-spacing: 0.04em;
	color: var(--nova-subtle);
}

.nova-browser__empty {
	margin: 16px 0 0;
	padding: 16px;
	border: 1px dashed var(--nova-border-strong);
	border-radius: 12px;
	text-align: center;
	color: var(--nova-subtle);
}

@media (max-width: 1023.98px) {
	.nova-browser {
		grid-template-columns: minmax(0, 1fr);
	}

	.nova-bcats {
		max-height: 320px;
	}
}

@media (max-width: 699.98px) {
	.nova-stats {
		grid-template-columns: minmax(0, 1fr);
	}

	.nova-stat + .nova-stat {
		border-left: 0;
		border-top: 1px solid var(--nova-border-soft);
	}

	.nova-browser__filters {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* --------------------------------------------------------------------------
   Reduced motion
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	.nova-shell *,
	.nova-shell *::before,
	.nova-shell *::after {
		animation-duration: 1ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 1ms !important;
	}
}