/* Fixed header: lang badge left, logo centre, Menu right. */
.site-header {
	position: fixed; inset: 0 0 auto 0; z-index: 100;
	height: var(--header-h);
	display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
	padding-inline: var(--gutter);
	color: var(--rp-ink);
	transition: color var(--dur);
}
.site-header.is-on-brand { color: var(--rp-on-brand); }

.lang { display: inline-flex; gap: .35rem; justify-self: start; }
.lang__item {
	display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 6px;
	font-size: var(--fs-micro); font-weight: 600; text-transform: capitalize;
	background: rgba(30, 42, 51, .08); color: var(--rp-ink);
	transition: background var(--dur-fast), transform var(--dur-fast) var(--ease-out);
}
.lang__item.is-current { background: var(--rp-red); color: #fff; }
.lang__item:hover { transform: translateY(-1px); }

.site-logo { display: grid; justify-items: center; gap: .25rem; }
.site-logo svg { width: 40px; height: 40px; border-radius: 9px; box-shadow: 0 6px 18px rgba(227, 0, 27, .25); transition: transform var(--dur) var(--ease-out); }
.site-logo:hover svg { transform: translateY(-2px) rotate(-4deg); }
.site-logo__word { font-size: var(--fs-small); font-weight: 700; letter-spacing: -.01em; }
.site-logo__word:not(.is-visible) { display: none; }

.menu-toggle { justify-self: end; font-weight: 700; font-size: 1.0625rem; display: inline-flex; align-items: center; gap: .6rem; position: relative; }
.menu-toggle__label { display: inline-grid; }
.menu-toggle__label span { grid-area: 1 / 1; transition: opacity var(--dur-fast), transform var(--dur-fast) var(--ease-out); }
.menu-toggle__label span:last-child { opacity: 0; transform: translateY(6px); }
.menu-toggle[aria-expanded="true"] .menu-toggle__label span:first-child { opacity: 0; transform: translateY(-6px); }
.menu-toggle[aria-expanded="true"] .menu-toggle__label span:last-child { opacity: 1; transform: none; }

/* Full-screen overlay */
.menu-overlay {
	position: fixed; inset: 0; z-index: 95;
	background: var(--rp-red); color: #fff;
	display: grid; grid-template-rows: 1fr auto; padding: calc(var(--header-h) + var(--space-3)) var(--gutter) var(--space-4);
	clip-path: inset(0 0 100% 0);
	visibility: hidden;
	transition: clip-path var(--dur-slow) var(--ease-in-out), visibility 0s var(--dur-slow);
}
.menu-overlay.is-open { clip-path: inset(0 0 0 0); visibility: visible; transition: clip-path var(--dur-slow) var(--ease-in-out), visibility 0s; }
body.menu-open .site-header { color: #fff; }
body.menu-open .lang__item { background: rgba(255, 255, 255, .18); color: #fff; }
body.menu-open .lang__item.is-current { background: #fff; color: var(--rp-red); }

.menu-overlay__nav { align-self: center; }
.menu-overlay__nav ul { display: grid; gap: .25em; }
.menu-overlay__nav a {
	display: inline-block; font-size: clamp(2.5rem, 7vw, 5.5rem); font-weight: 700; letter-spacing: -.03em; line-height: 1.05;
	opacity: 0; transform: translateY(40px);
	transition: opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out), color var(--dur-fast);
}
.menu-overlay.is-open .menu-overlay__nav a { opacity: 1; transform: none; }
.menu-overlay.is-open .menu-overlay__nav li:nth-child(1) a { transition-delay: .25s; }
.menu-overlay.is-open .menu-overlay__nav li:nth-child(2) a { transition-delay: .32s; }
.menu-overlay.is-open .menu-overlay__nav li:nth-child(3) a { transition-delay: .39s; }
.menu-overlay.is-open .menu-overlay__nav li:nth-child(4) a { transition-delay: .46s; }
.menu-overlay.is-open .menu-overlay__nav li:nth-child(5) a { transition-delay: .53s; }
.menu-overlay__nav a:hover, .menu-overlay__nav .current-menu-item a { color: var(--rp-ink); }

.menu-overlay__foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-3); font-size: var(--fs-small); opacity: 0; transition: opacity var(--dur) .5s; }
.menu-overlay.is-open .menu-overlay__foot { opacity: 1; }
.menu-overlay__foot .eyebrow { color: rgba(255, 255, 255, .7); margin-bottom: .4rem; }
.menu-overlay__social { display: flex; gap: .5rem; }

/* Preloader (first visit per session) */
.preloader { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; background: var(--rp-white); color: var(--rp-red); }
.preloader__num { font-size: clamp(4rem, 12vw, 9rem); font-weight: 800; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.preloader.is-done { animation: preloader-out .7s var(--ease-in-out) forwards; }
@keyframes preloader-out { to { clip-path: inset(0 0 100% 0); visibility: hidden; } }
