/* ==========================================================================
   Nova Cat Header CSS
   Figma: 01-header (1920x120), m-header (375x76), x-menu-375 (375x812)
   ========================================================================== */

.nc-header {
	position: fixed;
	top: 0;
	inset-inline-start: 0;
	width: 100%;
	height: var(--nc-header-h, 120px);
	background: rgba(252, 254, 255, 0.4);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	z-index: 1000;
	transition: transform 0.3s var(--nc-ease), background 0.3s var(--nc-ease), box-shadow 0.3s var(--nc-ease);
}

.nc-header.is-scrolled {
	background: rgba(252, 254, 255, 0.85);
	box-shadow: 0 2px 20px rgba(22, 21, 65, 0.06);
}

.nc-header.is-hidden {
	transform: translateY(-100%);
}

.nc-header__container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 100%;
}

/* Left: Logo & Language */
.nc-header__left {
	display: flex;
	align-items: center;
	gap: clamp(24px, 6.25vw, 120px);
}

.nc-header__logo {
	display: block;
	width: clamp(52px, 4.583vw, 88px);
	height: clamp(44px, 3.906vw, 75px);
	flex-shrink: 0;
	transition: opacity 0.2s var(--nc-ease);
}

.nc-header__logo:hover {
	opacity: 0.85;
}

.nc-header__logo svg {
	width: 100%;
	height: 100%;
}

/* Language Switcher */
.nc-header__lang {
	position: relative;
}

.nc-header__lang-toggle {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	background: none;
	border: none;
	padding: 4px 8px;
	font-family: var(--nc-font);
	font-weight: 500;
	font-size: 17px;
	line-height: 1.1;
	color: var(--nc-ink);
	cursor: pointer;
	border-radius: var(--nc-radius-s);
	transition: background 0.2s var(--nc-ease);
}

.nc-header__lang-toggle:hover {
	background: rgba(23, 15, 73, 0.05);
}

.nc-header__lang-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	transform: rotate(90deg);
	transition: transform 0.25s var(--nc-ease);
}

.nc-header__lang.is-open .nc-header__lang-arrow {
	transform: rotate(-90deg);
}

.nc-header__lang-menu {
	display: none;
	position: absolute;
	top: calc(100% + 6px);
	inset-inline-start: 0;
	min-width: 130px;
	background: var(--nc-white);
	border: 1px solid var(--nc-line);
	border-radius: var(--nc-radius-s);
	box-shadow: 0 4px 16px rgba(23, 15, 73, 0.08);
	padding: 6px;
	z-index: 10;
}

.nc-header__lang.is-open .nc-header__lang-menu {
	display: block;
}

.nc-header__lang-item a {
	display: block;
	padding: 8px 12px;
	font-size: 15px;
	font-weight: 500;
	color: var(--nc-ink);
	border-radius: 6px;
	transition: background 0.2s var(--nc-ease);
}

.nc-header__lang-item.is-current a,
.nc-header__lang-item a:hover {
	background: var(--nc-cyan);
}

/* Nav Menu */
.nc-header__nav {
	display: flex;
	align-items: center;
}

.nc-header__menu {
	display: flex;
	align-items: center;
	gap: clamp(16px, 1.562vw, 30px);
	list-style: none;
	padding: 0;
	margin: 0;
}

.nc-header__link {
	font-family: var(--nc-font);
	font-weight: 500;
	font-size: 17px;
	line-height: 1.1;
	color: var(--nc-ink);
	white-space: nowrap;
	padding: 8px 0;
	position: relative;
	transition: color 0.2s var(--nc-ease);
}

.nc-header__link:hover {
	color: var(--nc-navy);
}

.nc-header__link::after {
	content: "";
	position: absolute;
	bottom: 2px;
	inset-inline: 0;
	height: 2px;
	background: var(--nc-navy);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform 0.25s var(--nc-ease);
}

.nc-header__link.is-active::after {
	transform: scaleX(1);
}

/* Interactive Demo pill style */
.nc-header__link--pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px 16px;
	background: #fcfeff;
	border: 0.5px solid var(--nc-navy);
	border-radius: var(--nc-radius-s);
	transition: background 0.25s var(--nc-ease), border-color 0.25s var(--nc-ease);
}

.nc-header__link--pill::after {
	display: none;
}

.nc-header__link--pill:hover {
	background: var(--nc-cyan);
}

/* Right: CTA & Burger */
.nc-header__right {
	display: flex;
	align-items: center;
	gap: 16px;
}

.nc-header__burger {
	display: none;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
}

.nc-header__burger svg {
	width: 36px;
	height: 36px;
}

/* ==========================================================================
   Fullscreen Mobile Menu (Figma x-menu-375)
   ========================================================================== */
.nc-header__mobile-menu {
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100vh;
	height: 100dvh;
	background: #fcfeff;
	z-index: 1001;
	overflow-y: auto;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 0.3s var(--nc-ease), visibility 0.3s var(--nc-ease);
}

.nc-header__mobile-menu.is-open {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.nc-header__mobile-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 76px;
	padding-inline: 20px;
	background: rgba(252, 254, 255, 0.4);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

.nc-header__mobile-logo {
	display: block;
	width: 52px;
	height: 44px;
}

.nc-header__mobile-logo svg {
	width: 100%;
	height: 100%;
}

.nc-header__mobile-close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
}

.nc-header__mobile-close svg {
	width: 36px;
	height: 36px;
}

.nc-header__mobile-panel {
	position: relative;
	max-width: 335px;
	margin: 20px auto 40px;
	padding: 60px 20px 30px;
	background: rgba(252, 254, 255, 0.4);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-radius: 20px;
	box-shadow: 0 4px 24px rgba(23, 15, 73, 0.05);
	overflow: hidden;
}

.nc-header__mobile-rays {
	position: absolute;
	top: -60px;
	left: 50%;
	transform: translateX(-50%);
	width: 293px;
	height: 293px;
	opacity: 0.45;
	pointer-events: none;
}

.nc-header__mobile-nav {
	position: relative;
	z-index: 1;
}

.nc-header__mobile-list {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	list-style: none;
	padding: 0;
	margin: 0;
}

.nc-header__mobile-link {
	font-family: var(--nc-font);
	font-size: 27px;
	font-weight: 400;
	line-height: 1.1;
	color: var(--nc-navy);
	text-align: center;
	transition: color 0.2s var(--nc-ease);
}

.nc-header__mobile-link--pill {
	text-decoration: underline;
	text-underline-offset: 4px;
}

.nc-header__mobile-actions {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: 48px;
	position: relative;
	z-index: 1;
}

.nc-header__mobile-btn {
	display: flex;
	width: 100%;
	gap: 2px;
	align-items: stretch;
}

.nc-header__mobile-btn .nc-btn__label {
	flex: 1;
	font-size: 17px;
	font-weight: 500;
	min-height: 52px;
	padding: 0 20px;
}

.nc-header__mobile-btn .nc-btn__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	min-height: 52px;
	border-radius: var(--nc-radius-s);
	border: 1px solid var(--nc-navy);
	background: var(--nc-navy);
}

.nc-header__mobile-btn--secondary .nc-btn__label {
	background: rgba(252, 254, 255, 0.4);
	color: var(--nc-navy);
}

.nc-header__mobile-btn--secondary .nc-btn__icon {
	background: rgba(252, 254, 255, 0.4);
	border: 1px solid var(--nc-navy);
}

.nc-header__mobile-btn .nc-btn__icon svg {
	width: 24px;
	height: 24px;
}

.nc-header__mobile-lang {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-top: 24px;
	font-size: 16px;
	font-weight: 500;
	color: var(--nc-muted);
	position: relative;
	z-index: 1;
}

.nc-header__mobile-lang-link {
	color: var(--nc-muted);
	transition: color 0.2s var(--nc-ease);
}

.nc-header__mobile-lang-link.is-active,
.nc-header__mobile-lang-link:hover {
	color: var(--nc-navy);
	font-weight: 600;
}

/* ==========================================================================
   Responsive Breakpoints
   ========================================================================== */
@media (max-width: 1023px) {
	.nc-header {
		height: 76px;
	}

	.nc-header__nav,
	.nc-header__cta,
	.nc-header__lang {
		display: none;
	}

	.nc-header__burger {
		display: flex;
	}
}