/* Buttons */
.v2-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 14px 22px;
	font-size: 15px;
	font-weight: 500;
	border-radius: 999px;
	border: none;
	transition: transform var(--necta-transition), box-shadow var(--necta-transition), opacity var(--necta-transition);
	text-decoration: none;
}

.v2-btn--sm { padding: 10px 18px; font-size: 14px; }
.v2-btn--lg { padding: 16px 28px; font-size: 16px; }

.v2-btn--primary {
	background: linear-gradient(180deg, #f16001 0%, var(--necta-primary) 60%, var(--necta-primary-dark) 100%);
	color: var(--necta-white);
	box-shadow: var(--necta-shadow-btn);
}

.v2-btn--ghost,
.v2-btn--ghost-dark {
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.15);
	color: var(--necta-white);
}

.v2-btn--ghost-light {
	background: var(--necta-white);
	border: 1px solid var(--necta-border);
	color: var(--necta-ink);
}

.v2-btn--invert-dark {
	background: #fff;
	color: #0a0a0a;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.v2-btn--invert-light {
	background: #1a1612;
	color: #fff;
	box-shadow: 0 4px 12px rgba(26, 22, 18, 0.15);
}

.v2-btn__play {
	width: 16px;
	height: 16px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.12);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
	flex-shrink: 0;
	color: #fff;
}

.v2-btn__play svg {
	display: block;
	margin-left: 1px;
}

.v2-btn--ghost-light .v2-btn__play {
	background: rgba(26, 22, 18, 0.08);
	color: #1a1612;
}

.v2-btn--ghost-dark .v2-btn__play {
	background: rgba(255, 255, 255, 0.12);
	color: #fff;
}

.v2-btn__arrow {
	opacity: 0.6;
}

.v2-btn {
	transition: transform 0.18s ease, box-shadow 0.22s ease, background 0.2s ease, filter 0.2s ease, border-color 0.2s ease;
}

.v2-btn--primary:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 34px rgba(232, 80, 2, 0.5);
	filter: brightness(1.08);
}

.v2-btn--invert-dark:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
	background: #f1f0ec;
}

.v2-btn--invert-light:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(26, 22, 18, 0.28);
	background: #2c2822;
}

.v2-btn--ghost-dark:hover {
	background: rgba(255, 255, 255, 0.1);
	border-color: rgba(255, 255, 255, 0.28);
	transform: translateY(-1px);
}

.v2-btn--ghost-light:hover {
	background: rgba(26, 22, 18, 0.06);
	border-color: rgba(26, 22, 18, 0.22);
	transform: translateY(-1px);
}

/* Shine ring */
.v2-btn--shine {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: transparent !important;
}

.v2-btn--shine::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: max(260%, 280px);
	aspect-ratio: 1;
	background: conic-gradient(from 0deg, transparent 0deg, transparent 225deg, rgba(255, 255, 255, 0.85) 275deg, transparent 325deg, transparent 360deg);
	transform: translate(-50%, -50%);
	animation: v2-shine-spin 3.6s linear infinite;
	pointer-events: none;
	z-index: -2;
}

.v2-btn--shine::after {
	content: '';
	position: absolute;
	inset: 1.8px;
	border-radius: inherit;
	background: var(--v2-btn-inner-bg, #fff);
	z-index: -1;
}

@keyframes v2-shine-spin {
	to { transform: translate(-50%, -50%) rotate(360deg); }
}

/* Cards */
.necta-card {
	background: var(--necta-white);
	border: 1px solid var(--necta-border);
	border-radius: var(--necta-radius-md);
	padding: 22px 24px;
}

.necta-card--dark {
	background: linear-gradient(180deg, var(--necta-dark) 0%, var(--necta-dark-2) 100%);
	color: var(--necta-white);
	border-color: rgba(255, 255, 255, 0.06);
}

/* Wordmark */
.necta-wordmark {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-weight: 600;
	letter-spacing: -0.02em;
}

.necta-wordmark__icon {
	width: auto;
	height: 1em;
}

/* Nav */
.necta-nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px var(--necta-page-pad);
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

.necta-nav--sticky {
	position: sticky;
	top: 0;
	z-index: 50;
	backdrop-filter: blur(24px);
	background: rgba(250, 245, 237, 0.82);
	border-bottom: 1px solid rgba(26, 22, 18, 0.05);
	max-width: 100%;
	margin: 0 auto;
}

.necta-nav--sticky .necta-nav__brand {
	flex-shrink: 0;
}

.necta-nav--sticky .necta-nav__actions {
	flex-shrink: 0;
}

/*
 * Center link pill on the viewport — not between brand/actions widths.
 * Sides keep natural width; pill sits at 50% of the nav bar.
 * Sticky nav keeps position:sticky (plugin landings); only embedded/dark use relative.
 */
.necta-nav--embedded,
.necta-nav--dark:not(.necta-nav--embedded):not(.necta-nav--floating) {
	position: relative;
}

.necta-nav--sticky:not(.necta-nav--floating) .necta-nav__brand,
.necta-nav--sticky:not(.necta-nav--floating) .necta-nav__actions,
.necta-nav--embedded .necta-nav__brand,
.necta-nav--embedded .necta-nav__actions,
.necta-nav--dark:not(.necta-nav--embedded):not(.necta-nav--floating) .necta-nav__brand,
.necta-nav--dark:not(.necta-nav--embedded):not(.necta-nav--floating) .necta-nav__actions {
	position: relative;
	z-index: 2;
	flex-shrink: 0;
}

.necta-nav--sticky:not(.necta-nav--floating) .necta-nav__pill:not(.necta-nav__pill--compact),
.necta-nav--embedded .necta-nav__pill,
.necta-nav--dark:not(.necta-nav--embedded):not(.necta-nav--floating) .necta-nav__pill:not(.necta-nav__pill--compact) {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 3;
	flex: none;
	margin: 0;
	white-space: nowrap;
}

.necta-nav--sticky:not(.necta-nav--floating) .necta-nav__toggle,
.necta-nav--embedded .necta-nav__toggle,
.necta-nav--dark:not(.necta-nav--embedded):not(.necta-nav--floating) .necta-nav__toggle {
	position: relative;
	z-index: 2;
	margin-left: auto;
}

.necta-nav--dark:not(.necta-nav--embedded):not(.necta-nav--floating) {
	background: rgba(10, 10, 10, 0.78);
	border-bottom: 1px solid rgba(255, 255, 255, 0.05);
	color: var(--necta-white);
}

.necta-nav--embedded {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 6;
	padding: 20px 36px;
	background: transparent;
	transition: opacity 260ms ease, transform 380ms cubic-bezier(0.2, 0.7, 0.2, 1);
	align-items: center;
}

.necta-nav--embedded .necta-nav__brand {
	padding: 6px 8px;
	border-radius: 10px;
}

.necta-nav--embedded .necta-nav__pill,
.necta-nav--embedded .necta-nav__actions {
	align-self: center;
}

.necta-nav--embedded.is-hidden {
	opacity: 0;
	transform: translateY(-6px);
	pointer-events: none;
}

.necta-nav--floating {
	position: fixed;
	top: 14px;
	left: 50%;
	z-index: 100;
	width: auto;
	max-width: calc(100vw - 28px);
	padding: 8px 8px 8px 18px;
	background: rgba(12, 12, 12, 0.72);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 999px;
	backdrop-filter: blur(22px) saturate(140%);
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.32), 0 2px 6px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.06);
	gap: 18px;
	opacity: 0;
	transform: translate(-50%, -16px);
	pointer-events: none;
	transition: opacity 320ms ease, transform 460ms cubic-bezier(0.2, 0.7, 0.2, 1);
}

.necta-nav--floating.is-visible {
	opacity: 1;
	transform: translate(-50%, 0);
	pointer-events: auto;
}

.admin-bar .necta-nav--floating {
	top: 46px;
}

.necta-nav--floating .necta-nav__brand {
	padding: 2px 2px 2px 4px;
	border-radius: 10px;
}

.necta-nav__brand {
	display: flex;
	align-items: center;
	flex-shrink: 0;
}

.necta-nav__brand .necta-wordmark {
	text-decoration: none;
	color: inherit;
}

.necta-nav__dropdown {
	display: inline-flex;
	align-items: center;
	position: relative;
}

.necta-nav__plugins-trigger {
	border-radius: 999px;
}

.necta-nav__plugin-icon {
	width: 28px;
	height: 28px;
	border-radius: 7px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.06);
	color: var(--necta-primary);
	font-size: 13px;
}

.necta-nav:not(.necta-nav--dark) .necta-nav__plugin-icon {
	background: rgba(232, 80, 2, 0.08);
	border-color: rgba(232, 80, 2, 0.18);
}

.necta-nav__plugin-item strong {
	display: block;
	font-size: 13px;
	font-weight: 500;
	color: #1a1612;
}

.necta-nav__plugin-item small {
	display: block;
	font-size: 11px;
	color: #8a6a4a;
	margin-top: 1px;
}

.necta-nav__pill {
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	gap: 0;
	padding: 4px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.5);
	border: 1px solid rgba(26, 22, 18, 0.06);
}

.necta-nav--dark .necta-nav__pill {
	background: rgba(255, 255, 255, 0.03);
	border-color: rgba(255, 255, 255, 0.06);
}

.necta-nav--floating .necta-nav__pill,
.necta-nav__pill--compact {
	background: transparent;
	border: none;
	padding: 0;
}

.necta-nav__pill-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 8px 16px;
	border-radius: 999px;
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.2;
	color: #3a2a1a;
	background: transparent;
	border: none;
	cursor: pointer;
	text-decoration: none;
	font-family: inherit;
	transition: background 0.15s ease;
	white-space: nowrap;
}

.necta-nav--dark .necta-nav__pill-link {
	color: #d7d7d7;
}

.necta-nav--floating .necta-nav__pill-link {
	font-size: 12.5px;
	padding: 6px 10px;
	color: #fff;
}

.necta-nav__pill-link:hover {
	background: rgba(26, 22, 18, 0.04);
}

.necta-nav--dark .necta-nav__pill-link:hover {
	background: rgba(255, 255, 255, 0.05);
}

.necta-nav__actions {
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	gap: 14px;
}

.necta-nav__actions .v2-btn {
	flex-shrink: 0;
	margin: 0;
}

.necta-nav__signin {
	display: inline-flex;
	align-items: center;
	line-height: 1.2;
	white-space: nowrap;
}

.necta-nav--floating .necta-nav__actions {
	gap: 10px;
}

.necta-nav__signin {
	font-size: 13.5px;
	color: #3a2a1a;
	text-decoration: none;
}

.necta-nav--dark .necta-nav__signin {
	color: #a7a7a7;
}

.necta-nav__dropdown-footer {
	grid-column: 1 / -1;
	margin-top: 4px;
	padding: 10px 14px;
	border-top: 1px solid rgba(26, 22, 18, 0.06);
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 12px;
	color: #5a4a3a;
}

.necta-nav__dropdown-footer a {
	color: var(--necta-primary);
	font-weight: 500;
}

.necta-nav__links {
	display: flex;
	align-items: center;
	gap: 8px;
}

.necta-nav__dropdown {
	position: relative;
}

.necta-nav__dropdown-panel {
	display: none;
	position: absolute;
	top: calc(100% + 4px);
	left: 50%;
	transform: translateX(-50%);
	width: min(480px, calc(100vw - 28px));
	padding: 8px;
	background: rgba(255, 255, 255, 0.98);
	border: 1px solid rgba(26, 22, 18, 0.08);
	border-radius: 14px;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	box-shadow: 0 24px 48px rgba(0, 0, 0, 0.15);
	grid-template-columns: 1fr 1fr;
	gap: 4px;
	z-index: 200;
	color: #1a1612;
}

/* Dark hero nav — panel MUST stay dark (later rules used to override with white). */
.necta-nav--dark .necta-nav__dropdown-panel,
.necta-nav__dropdown-panel.necta-nav__dropdown-panel--dark {
	background: rgba(16, 16, 16, 0.95);
	border-color: rgba(255, 255, 255, 0.06);
	box-shadow: 0 24px 48px rgba(0, 0, 0, 0.4);
	color: #fff;
}

.necta-nav--dark .necta-nav__dropdown-panel .necta-nav__plugin-item strong,
.necta-nav__dropdown-panel--dark .necta-nav__plugin-item strong {
	color: #fff;
}

.necta-nav--dark .necta-nav__dropdown-panel .necta-nav__plugin-item small,
.necta-nav__dropdown-panel--dark .necta-nav__plugin-item small {
	color: #7a7a7a;
}

.necta-nav--dark .necta-nav__dropdown-panel .necta-nav__dropdown-footer,
.necta-nav__dropdown-panel--dark .necta-nav__dropdown-footer {
	border-top-color: rgba(255, 255, 255, 0.06);
	color: #a7a7a7;
}

.necta-nav--dark .necta-nav__dropdown-panel .necta-nav__plugin-icon,
.necta-nav__dropdown-panel--dark .necta-nav__plugin-icon {
	background: rgba(255, 255, 255, 0.04);
	border-color: rgba(255, 255, 255, 0.06);
}

.necta-nav--dark .necta-nav__dropdown-panel .necta-nav__plugin-item:hover,
.necta-nav__dropdown-panel--dark .necta-nav__plugin-item:hover {
	background: rgba(232, 80, 2, 0.1);
}

.necta-nav--dark .necta-nav__dropdown-panel .necta-nav__plugin-item.is-active,
.necta-nav__dropdown-panel--dark .necta-nav__plugin-item.is-active {
	background: rgba(232, 80, 2, 0.1);
}

.necta-nav__dropdown:hover .necta-nav__dropdown-panel,
.necta-nav__dropdown.is-open .necta-nav__dropdown-panel {
	display: grid;
}

.necta-nav__dropdown.is-open .necta-nav__plugins-trigger,
.necta-nav__dropdown:hover .necta-nav__plugins-trigger {
	background: rgba(26, 22, 18, 0.06);
}

.necta-nav--dark .necta-nav__dropdown.is-open .necta-nav__plugins-trigger,
.necta-nav--dark .necta-nav__dropdown:hover .necta-nav__plugins-trigger {
	background: rgba(255, 255, 255, 0.06);
}

.necta-nav__dropdown.is-open .necta-nav__plugins-trigger svg,
.necta-nav__dropdown:hover .necta-nav__plugins-trigger svg {
	transform: rotate(180deg);
}

.necta-nav__plugins-trigger svg {
	transition: transform 0.2s ease;
}

.necta-nav__plugin-item {
	display: flex;
	gap: 12px;
	align-items: center;
	min-height: 44px;
	padding: 10px 12px;
	border-radius: 8px;
	text-decoration: none;
	color: inherit;
}

.necta-nav__plugin-item.is-active {
	background: rgba(232, 80, 2, 0.08);
}

.necta-nav__plugin-item:hover {
	background: rgba(232, 80, 2, 0.08);
}

/* Hero scene — detailed styles in home.css */

/* Footer */
.necta-footer {
	padding: var(--necta-section-pad);
	background: var(--necta-dark);
	color: var(--necta-gray);
}

.necta-footer a:hover { color: var(--necta-white); }

.necta-footer__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 32px;
	max-width: 1200px;
	margin: 0 auto;
}

/* Layout */
.necta-container {
	width: min(1280px, 100% - 28px);
	margin-left: auto;
	margin-right: auto;
}

.necta-section {
	padding: var(--necta-section-pad) var(--necta-page-pad);
}

@media (max-width: 900px) {
	.necta-nav__links--desktop { display: none; }
	.necta-nav__toggle { display: flex; }

	.necta-nav.is-mobile-open .necta-nav__dropdown-panel {
		position: static;
		transform: none;
		width: 100%;
		margin-top: 4px;
		box-shadow: none;
		border: 1px solid rgba(26, 22, 18, 0.08);
	}

	.necta-nav--dark.is-mobile-open .necta-nav__dropdown-panel {
		background: rgba(16, 16, 16, 0.98);
		border-color: rgba(255, 255, 255, 0.08);
	}
}

@media (min-width: 901px) {
	.necta-nav__toggle { display: none; }
}