/* =========================================================================
   KONTÉNER — a terv egységesen 1200px + 32px oldalpadding (40 helyen).
   A Kadence alapból 1290px / 24px, ezért felülírjuk, hogy az ALOLDALAK is
   pontosan a tervezett rácson legyenek, ne csak a főoldal.
   ========================================================================= */
:root {
	/*
	 * FONTOS: a terv CSS-e NEM állít box-sizing: border-box-ot (nulla előfordulás),
	 * így nála a 32px oldalpadding a max-width:1200px-en KÍVÜL van — a tartalom
	 * tényleges szélessége 1200px, a keret 1264px. A WordPress viszont globálisan
	 * border-boxot használ, amitől ugyanez 1136px-re szűkült volna (60px-szel
	 * keskenyebb megjelenés, és a fejlécben a logó rálógott a menüre).
	 * A Kadence border-boxban számol, ezért itt a KERET méretét adjuk meg.
	 */
	--global-content-width: 1264px;
	--global-content-edge-padding: 32px;
	--global-content-narrow-width: 964px;   /* a terv 900px szövegoszlopa + 2×32 */
}

/*
 * Konténer-szélesség. A terv 1200px tartalmat ad 32px paddinggal, vagyis a
 * KERET 1264px. Ezt border-boxszal írjuk le (nem content-boxszal): tartalmilag
 * azonos nagy képernyőn, de szűk kijelzőn nem csordul túl — a content-box ott
 * a paddinget a rendelkezésre álló szélességhez ADTA, ami vízszintes csúszást
 * okozott mobilon.
 */
.vs-topbar__inner,
.vs-header__inner,
.vs-hero__inner,
.vs-hero__trust-inner,
.vs-mega__inner,
.vs-phero__inner,
.vs-sec > .vs-wrap,
.vs-sec > .wp-block-group__inner-container,
.vs-footer__wrap,
.vs-footer__cols {
	box-sizing: border-box;
	max-width: 1264px;
	width: 100%;
}

/* A fejlécben a logó és a jobb oldali blokk ne nyomódjon össze: a nowrap
   szövegük kilógna a saját dobozukból, és átfedné a menüt. */
.vs-brand,
.vs-header__actions { flex-shrink: 0; }
.vs-nav { min-width: 0; }
.vs-menu { flex-wrap: nowrap; }
@media (max-width: 720px) {
	:root { --global-content-edge-padding: 20px; }
}


/* =============================================================== TOPBAR ===
   Piros sáv a fejléc fölött. Nem sticky — elgörgethető, a fejléc marad.
   ========================================================================= */
.vs-topbar { background: #E30613; color: #FFFFFF; }
.vs-topbar__inner {
	max-width: 1264px;
	margin: 0 auto;
	padding: 7px 32px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
}
.vs-topbar__claim {
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 3px;
	text-transform: uppercase;
}
.vs-topbar__meta { display: flex; gap: 24px; align-items: center; font-size: 13px; }
.vs-topbar__meta span { letter-spacing: 1px; }
.vs-topbar__meta a { color: #FFFFFF; }
.vs-topbar__meta a:hover { color: #FFD7D9; }

/* =========================================================================
   VIKING — fejléc és lábléc
   Az értékek a jóváhagyott prototípusból, 1:1.
   ========================================================================= */

.vs-skip {
	position: absolute; left: -9999px;
	background: #E30613; color: #fff; padding: 12px 20px; z-index: 200;
	font-family: 'Oswald', sans-serif; letter-spacing: 1px;
}
.vs-skip:focus { left: 12px; top: 12px; color: #fff; }

/* =============================================================== FEJLÉC === */
.vs-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: #0A0A0A;
	border-bottom: 1px solid #1E1E1E;
}
.vs-header__inner {
	max-width: 1264px;
	margin: 0 auto;
	padding: 0 32px;
	height: 78px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}

/* ------------------------------------------------------------------- logó */
.vs-brand { display: flex; align-items: center; gap: 13px; }
.vs-brand__mark { height: 42px; width: auto; display: block; }
.vs-brand__text { display: block; }
.vs-brand__name {
	display: block;
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 700;
	font-size: 17px;
	letter-spacing: 1.5px;
	color: #FFFFFF;
	line-height: 1.2;
	white-space: nowrap;
}
.vs-brand__name span { color: #E30613; }
.vs-brand__tag {
	display: block;
	font-size: 9px;
	letter-spacing: 3.5px;
	color: #7A7A7A;
	text-transform: uppercase;
	line-height: 1.6;
	white-space: nowrap;
}
.vs-brand--lg .vs-brand__mark { height: 52px; }
.vs-brand--lg .vs-brand__name { font-size: 22px; }
.vs-brand--lg .vs-brand__tag {
	font-family: 'Oswald', sans-serif; font-weight: 500; font-size: 11px; letter-spacing: 4px;
}

/* -------------------------------------------------------------------- menü */
.vs-menu, .vs-menu-mobile { list-style: none; margin: 0; padding: 0; }
.vs-menu { display: flex; align-items: center; gap: 26px; }
.vs-menu li { position: relative; }
.vs-menu > li > a,
.vs-menu a {
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 500;
	font-size: 13px;
	letter-spacing: 2px;
	color: #E8E8E8;
	text-transform: uppercase;
	white-space: nowrap;
	display: block;
}
.vs-menu > li > a { line-height: 78px; }
.vs-menu a:hover, .vs-menu .current-menu-item > a { color: #E30613; }

/* Legördülő almenü — a „Szolgáltatások ▾" alatt. */
.vs-menu > li.menu-item-has-children > a::after {
	content: " ▾";
	font-size: 11px;
}
.vs-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: -18px;
	min-width: 290px;
	background: #101010;
	border: 1px solid #1E1E1E;
	border-top: 2px solid #E30613;
	padding: 10px 0;
	margin: 0;
	list-style: none;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
.vs-menu > li:hover > .sub-menu,
.vs-menu > li:focus-within > .sub-menu {
	opacity: 1; visibility: visible; transform: translateY(0);
}
.vs-menu .sub-menu a {
	padding: 11px 22px;
	font-size: 12.5px;
	letter-spacing: 1.5px;
	color: #B8B8B8;
	line-height: 1.4;
	white-space: normal;
}
.vs-menu .sub-menu a:hover { color: #E30613; background: #171717; }


/* =============================================================== MEGAMENÜ ==
   A terv szerint a „Szolgáltatások" alatt teljes szélességű panel nyílik,
   nem sima legördülő lista.
   ========================================================================= */
/* A panel a FEJLÉCHEZ igazodjon, ne a menüponthoz -> a li statikus marad. */
.vs-menu > li.has-mega { position: static; }
.vs-menu > li.has-mega > a::after { content: " ▾"; font-size: 11px; }

.vs-mega {
	position: absolute;
	left: 0; right: 0; top: 100%;
	background: #0A0A0A;
	border-top: 1px solid #1E1E1E;
	border-bottom: 3px solid #E30613;
	box-shadow: 0 24px 48px rgba(0,0,0,0.45);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
.vs-menu > li.has-mega:hover > .vs-mega,
.vs-menu > li.has-mega:focus-within > .vs-mega {
	opacity: 1; visibility: visible; transform: translateY(0);
}

.vs-mega__inner {
	box-sizing: border-box;
	max-width: 1264px;
	margin: 0 auto;
	padding: 36px 32px 40px;
	display: grid;
	grid-template-columns: 1fr 2.4fr;
	gap: 48px;
}
.vs-mega__eyebrow {
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 600; font-size: 12px; letter-spacing: 4px;
	color: #E30613; text-transform: uppercase; margin-bottom: 10px;
}
.vs-mega__title {
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 600; font-size: 24px; letter-spacing: 0.5px;
	color: #FFFFFF; text-transform: uppercase; line-height: 1.25; margin-bottom: 12px;
}
.vs-mega__intro p { margin: 0 0 18px; font-size: 13.5px; color: #8A8A8A; line-height: 1.6; }
.vs-menu .vs-mega__all {
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 600; font-size: 12px; letter-spacing: 2px;
	color: #E30613; text-transform: uppercase; line-height: 1.4;
}
.vs-menu .vs-mega__all:hover { color: #C20510; }

.vs-mega__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px 20px;
	align-content: start;
}
.vs-menu .vs-mega__grid a {
	display: flex;
	gap: 12px;
	align-items: baseline;
	padding: 11px 12px;
	border-left: 2px solid #242424;
	line-height: 1.3;
	white-space: normal;
	transition: border-left-color .16s ease, background .16s ease;
}
.vs-menu .vs-mega__grid a:hover { border-left-color: #E30613; background: #141414; }
.vs-mega__num {
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 700; font-size: 12px; color: #E30613; letter-spacing: 1px;
}
.vs-mega__name {
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 500; font-size: 14px; letter-spacing: 1px;
	color: #E8E8E8; text-transform: uppercase; line-height: 1.3;
}

@media (max-width: 1020px) {
	.vs-mega { display: none; }
}

/* ----------------------------------------------------------- jobb oldali rész */
.vs-header__actions { display: flex; align-items: center; gap: 20px; }
.vs-header__phone {
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 600; font-size: 15px; letter-spacing: 1px;
	color: #FFFFFF; white-space: nowrap;
}
.vs-header__phone:hover { color: #E30613; }
.vs-header__cta {
	display: inline-block;
	background: #E30613;
	color: #FFFFFF;
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 600; font-size: 13px; letter-spacing: 2px;
	text-transform: uppercase;
	padding: 12px 24px;
	white-space: nowrap;
	transition: background .18s ease;
}
.vs-header__cta:hover { background: #C20510; color: #FFFFFF; }

/* --------------------------------------------------------------- hamburger */
.vs-burger {
	display: none;
	background: transparent; border: 0; cursor: pointer;
	padding: 8px; width: 40px;
	-webkit-appearance: none; appearance: none;
	box-shadow: none; border-radius: 0;
	color: #FFFFFF;
}
.vs-burger:hover, .vs-burger:active { background: transparent; box-shadow: none; }
/* A böngésző alapértelmezett kék fókuszkerete helyett arculati piros,
   és csak billentyűzetes fókusznál — kattintásnál ne villanjon. */
.vs-burger:focus { outline: none; box-shadow: none; }
.vs-burger:focus-visible { outline: 2px solid #E30613; outline-offset: 3px; }
.vs-burger__bar {
	display: block; height: 2px; background: #FFFFFF; margin: 5px 0;
	transition: transform .2s ease, opacity .2s ease;
}
.vs-burger[aria-expanded="true"] .vs-burger__bar:nth-child(2) { transform: translateY(7px) rotate(45deg); }
.vs-burger[aria-expanded="true"] .vs-burger__bar:nth-child(3) { opacity: 0; }
.vs-burger[aria-expanded="true"] .vs-burger__bar:nth-child(4) { transform: translateY(-7px) rotate(-45deg); }

/* Ha a menü nem fér ki, ő maga görögjön — ne a mögötte lévő tartalom.
   A fejléc 68px magas mobilon, ennyit vonunk le a képernyőmagasságból. */
.vs-mobile-nav {
	background: #0A0A0A;
	border-top: 1px solid #1E1E1E;
	padding: 8px 20px 22px;
	max-height: calc(100vh - 68px);
	max-height: calc(100dvh - 68px);   /* mobil böngészősávot is figyelembe vesz */
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;      /* a görgetés ne "csússzon át" a háttérre */
	/* Bő alsó tér: legörgetve a mobil böngésző alsó sávja ne takarja az
	   utolsó menüpontot. A safe-area a kijelzőkivágásos készülékekhez. */
	padding-bottom: calc( 96px + env( safe-area-inset-bottom, 0px ) );
}

/* Ajánlatkérés + telefon a menü alján */
.vs-mobile-nav__actions {
	display: flex; flex-direction: column; gap: 14px;
	margin-top: 22px; padding-top: 20px;
	border-top: 1px solid #1E1E1E;
}
.vs-mobile-nav__cta {
	display: block; text-align: center;
	background: #E30613; color: #FFFFFF;
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 600; font-size: 15px; letter-spacing: 2px;
	text-transform: uppercase; padding: 16px 20px;
}
.vs-mobile-nav__cta:hover { background: #C20510; color: #FFFFFF; }
.vs-mobile-nav[hidden] { display: none; }
.vs-menu-mobile a {
	display: block;
	padding: 13px 0;
	border-bottom: 1px solid #171717;
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 500; font-size: 14px; letter-spacing: 2px;
	color: #E8E8E8; text-transform: uppercase;
}
.vs-menu-mobile .sub-menu { list-style: none; margin: 0; padding: 0 0 0 16px; }
.vs-menu-mobile .sub-menu a { font-size: 12.5px; color: #9A9A9A; letter-spacing: 1.5px; }
.vs-mobile-nav__phone {
	display: block; text-align: center;
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 600; font-size: 20px; color: #FFFFFF;
	padding: 6px 0;
}
.vs-mobile-nav__phone:hover { color: #E30613; }

/* =============================================================== LÁBLÉC === */
.vs-footer { background: #0A0A0A; border-top: 3px solid #E30613; color: #8A8A8A; }
.vs-footer a { color: #8A8A8A; }
.vs-footer a:hover { color: #E30613; }
/* A piros CTA gomb a láblécben is fehér marad (a .vs-footer a különben elszürkítené). */
.vs-footer a.vs-header__cta { color: #FFFFFF; }
.vs-footer a.vs-header__cta:hover { color: #FFFFFF; }

.vs-footer__top { border-bottom: 1px solid #1E1E1E; }
.vs-footer__wrap {
	max-width: 1264px; margin: 0 auto; padding: 44px 32px;
	display: flex; justify-content: space-between; align-items: center;
	gap: 40px; flex-wrap: wrap;
}
.vs-footer__highlights { display: flex; align-items: center; gap: 36px; flex-wrap: wrap; }
.vs-fstats { display: flex; gap: 28px; }
.vs-fstats > div { text-align: center; }
.vs-fstats strong {
	display: block;
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 700; font-size: 22px; color: #E30613; line-height: 1;
}
.vs-fstats span {
	display: block; font-size: 11px; letter-spacing: 2px;
	color: #7A7A7A; text-transform: uppercase; margin-top: 4px;
}

.vs-footer__cols {
	max-width: 1264px; margin: 0 auto; padding: 56px 32px 0;
	display: grid; grid-template-columns: 1.3fr 1fr 0.8fr 1fr; gap: 48px;
}
.vs-fhead {
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 600; font-size: 13px; letter-spacing: 2px;
	color: #FFFFFF; text-transform: uppercase;
	margin-bottom: 18px; padding-bottom: 10px;
	border-bottom: 2px solid #E30613; display: inline-block;
}
.vs-fintro { margin: 0 0 20px; font-size: 14.5px; color: #8A8A8A; line-height: 1.7; }
.vs-fcontact { display: flex; flex-direction: column; gap: 12px; font-size: 14px; }
.vs-flabel {
	display: block; font-size: 11px; letter-spacing: 2px;
	color: #5A5A5A; text-transform: uppercase;
}
.vs-fvalue { display: block; color: #B8B8B8; margin-bottom: 10px; }
/* Erősebb szelektor kell: a .vs-footer a (0,1,1) különben felülírná. */
.vs-footer a.vs-fphone {
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 600; font-size: 20px; color: #FFFFFF;
}
.vs-footer a.vs-fphone:hover { color: #E30613; }
.vs-flinks { display: flex; flex-direction: column; gap: 9px; }
.vs-flinks a { display: flex; gap: 8px; align-items: baseline; font-size: 13.5px; }
.vs-flinks a span { color: #E30613; font-size: 10px; }
.vs-fbox {
	background: #141414; border: 1px solid #1E1E1E;
	padding: 20px 22px; font-size: 13.5px; color: #8A8A8A; line-height: 1.9;
}
.vs-fbox .vs-fvalue:last-child { margin-bottom: 0; }
.vs-fnote { margin: 14px 0 0; font-size: 12.5px; color: #5A5A5A; line-height: 1.6; }

.vs-footer__bottom { border-top: 1px solid #1E1E1E; margin-top: 48px; }
.vs-footer__bottom .vs-footer__wrap { padding: 20px 32px; font-size: 12.5px; color: #6A6A6A; }
.vs-footer__legal { display: flex; gap: 20px; }
.vs-footer__legal a { color: #6A6A6A; }

/* ============================================================ RESZPONZÍV == */
@media (max-width: 1279px) {
	.vs-menu { gap: 14px; }
	.vs-menu a { font-size: 12px; letter-spacing: 1px; }
	.vs-header__phone { font-size: 13px; }
}
@media (max-width: 1100px) {
	.vs-footer__cols { grid-template-columns: 1fr 1fr; gap: 36px; }
}
/* 1100px: az angol menücímek jóval hosszabbak, ezért a hamburger
   korábban veszi át, mint a magyarnál kellene. */
@media (max-width: 1100px) {
	.vs-nav { display: none; }
	.vs-header__phone { display: none; }
	.vs-burger { display: block; }
	/* A gomb a menübe költözik — a fejlécben nem férne el a menüikonnal
	   együtt, és kiszorítaná azt a képernyőről. */
	.vs-header__cta { display: none; }
	.vs-header__actions { gap: 0; }
}
@media (max-width: 720px) {
	/* Mobilon a fejléc CTA marad — alsó fix hívás-sáv nincs (kérésre). */
	/* A sáv tartalma nem fér ki, üres piros csíkot pedig ne hagyjunk:
	   mobilon az egész felső sáv elmarad. Az elérhetőségek a fejléc
	   hívásgombján és a mobil menüben érhetők el, a nyelvváltó szintén. */
	.vs-topbar { display: none; }

	.vs-header__inner { padding: 0 20px; height: 68px; }
	.vs-brand__mark { height: 34px; }
	.vs-brand__name { font-size: 14px; letter-spacing: 1px; }
	.vs-brand__tag { font-size: 8px; letter-spacing: 2.5px; }
	.vs-header__cta { padding: 10px 16px; font-size: 12px; }
	.vs-menu > li > a { line-height: 68px; }
	.vs-footer__cols { grid-template-columns: 1fr; padding: 40px 20px 0; gap: 32px; }
	.vs-footer__wrap { padding: 32px 20px; }
	.vs-footer__bottom .vs-footer__wrap { padding: 18px 20px; }
	.vs-fstats { gap: 20px; }
}

/* Lábléc bizalmi elemek (a korábbi számsáv helyett) */
.vs-ftrust { display: flex; flex-wrap: wrap; gap: 10px 22px; }
.vs-ftrust span {
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 500; font-size: 12px; letter-spacing: 2px;
	color: #8A8A8A; text-transform: uppercase;
	position: relative; padding-left: 14px;
}
.vs-ftrust span::before {
	content: "▸"; position: absolute; left: 0; color: #E30613; font-size: 9px;
}

/* Nyelvváltó a felső sávban. A még el nem készült nyelv látszik, de nem
   kattintható — halott link sem a látogatónak, sem a keresőnek nem jó. */
.vs-langs { display: inline-flex; align-items: center; gap: 2px; margin-left: 4px; }
.vs-langs__item {
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 500; font-size: 12px; letter-spacing: 1.4px;
	padding: 4px 9px; line-height: 1;
	color: #9A9A9A; text-decoration: none;
	border: 1px solid transparent;
}
.vs-topbar__meta .vs-langs__item { color: #FFFFFF; }
.vs-topbar__meta .vs-langs__item.is-active {
	background: #FFFFFF; color: #E30613; border-color: #FFFFFF; font-weight: 600;
}
.vs-topbar__meta a.vs-langs__item { border-color: rgba(255,255,255,.55); }
.vs-topbar__meta a.vs-langs__item:hover { background: rgba(255,255,255,.18); border-color: #FFFFFF; }
.vs-topbar__meta .vs-langs__item.is-soon { color: rgba(255,255,255,.62); border-color: rgba(255,255,255,.3); }
.vs-langs__item.is-soon { color: #5A5A5A; cursor: not-allowed; }
@media (max-width: 640px) {
	.vs-langs { margin-left: 2px; }
	.vs-langs__item { font-size: 11px; padding: 3px 5px; letter-spacing: 1px; }
}

/* Felső sáv: telefon és e-mail ikonnal. A telefon a fejléc jobb oldaláról
   került ide, hogy a logó és a menü több helyet kapjon. */
.vs-topbar__link { display: inline-flex; align-items: center; gap: 7px; }
.vs-ico { width: 13px; height: 13px; flex-shrink: 0; fill: currentColor; }
.vs-topbar__meta .vs-topbar__link { color: #FFFFFF; }
.vs-topbar__meta .vs-topbar__link:hover { color: #FFE1E3; }
.vs-topbar__meta .vs-topbar__link .vs-ico { opacity: .8; }
@media (max-width: 900px) {
	.vs-topbar__claim { display: none; }
	.vs-topbar__inner { justify-content: center; }
	.vs-topbar__meta { gap: 16px; font-size: 12.5px; }
}

/* Nyelvváltó a mobil menüben — a felső sáv ott nem jelenik meg.
   Sötét háttéren áll, ezért itt világos keret + fehér aktív elem. */
.vs-mobile-nav__mail {
	display: block; text-align: center;
	font-size: 14px; color: #9A9A9A; margin-top: 14px; word-break: break-all;
}
.vs-mobile-nav__mail:hover { color: #FFFFFF; }
.vs-langs--mobile { display: flex; justify-content: center; gap: 8px; margin-top: 18px; }
.vs-langs--mobile .vs-langs__item {
	font-size: 13px; padding: 8px 16px; letter-spacing: 2px;
	border: 1px solid #3A3A3A; color: #B4B4B4;
}
.vs-langs--mobile .vs-langs__item.is-active {
	background: #E30613; border-color: #E30613; color: #FFFFFF; font-weight: 600;
}
.vs-langs--mobile .vs-langs__item.is-soon { color: #6A6A6A; border-color: #2A2A2A; }

/* A lábléc Compliance-oszlopának fejléce link is — maradjon fehér. */
.vs-fhead a { color: #FFFFFF; }
.vs-fhead a:hover { color: #E30613; }
@media (max-width: 1100px) {
	.vs-footer__cols { grid-template-columns: 1fr 1fr; gap: 34px 40px; }
}
@media (max-width: 640px) {
	.vs-footer__cols { grid-template-columns: 1fr; gap: 30px; }
}

/* A menü szélessége nyelvfüggő: az angol címek jóval hosszabbak, és a
   „Request a quote" gomb rácsúszott a menüre. A menü zsugorodhat, a márkanév
   és a gomb nem — a köztes sávokban lépcsőzetesen szűkül a térköz. */
.vs-header__inner { gap: 20px; }
.vs-nav { min-width: 0; flex: 1 1 auto; }
.vs-menu { flex-wrap: nowrap; justify-content: flex-end; }
.vs-menu > li > a { white-space: nowrap; }

@media (max-width: 1420px) {
	.vs-menu { gap: 18px; }
	.vs-menu > li > a { font-size: 12.5px; letter-spacing: 0.8px; }
}
@media (max-width: 1240px) and (min-width: 1101px) {
	.vs-menu { gap: 13px; }
	.vs-menu > li > a { font-size: 11.5px; letter-spacing: 0.4px; }
	.vs-header__cta { padding: 12px 18px; font-size: 12px; letter-spacing: 1px; }
	.vs-brand__tag { display: none; }
}

/* Görgetéskor: lefelé a fejléc felcsúszik, felfelé azonnal visszatér.
   A transform (nem a top) miatt a böngésző nem számol újra elrendezést. */
.vs-header {
	transition: transform .28s cubic-bezier(.4,0,.2,1), box-shadow .28s ease;
	will-change: transform;
}
.vs-header.is-hidden { transform: translateY(-100%); }
.vs-header.is-stuck  { box-shadow: 0 6px 24px rgba(0,0,0,.45); }

/* Aki csökkentett mozgást kért, annak ne ugráljon a fejléc. */
@media (prefers-reduced-motion: reduce) {
	.vs-header { transition: none; }
	.vs-header.is-hidden { transform: none; }
}

/* Horgonyra ugráskor a cím ne kerüljön a fejléc alá. */
:target { scroll-margin-top: 90px; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* =========================================================================
   Süti-hozzájárulás. Egyetlen hangsúlyos gomb, mellette visszafogott
   másodlagos műveletek — a sáv nem nyomja el a tartalmat és nem kényszerít.
   ========================================================================= */
.vs-cc {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 900;
	background: #0A0A0A;
	border-top: 3px solid #E30613;
	box-shadow: 0 -10px 40px rgba(0,0,0,.5);
	animation: vs-cc-in .32s cubic-bezier(.4,0,.2,1) both;
}
@keyframes vs-cc-in { from { transform: translateY(100%); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) { .vs-cc { animation: none; } }

.vs-cc__inner {
	box-sizing: border-box; max-width: 1264px; margin: 0 auto;
	padding: 24px 32px;
	display: grid; grid-template-columns: 1fr auto; gap: 32px; align-items: center;
}
.vs-cc__title {
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 600; font-size: 16px; letter-spacing: 0.6px;
	color: #FFFFFF; text-transform: uppercase; margin-bottom: 8px;
}
.vs-cc__text { margin: 0; font-size: 14px; line-height: 1.65; color: #B4B4B4; max-width: 760px; }

/* Részletes választás */
.vs-cc__prefs { margin-top: 18px; display: grid; gap: 12px; max-width: 760px; }
/* A display: grid felülírná a hidden attribútum display: none-ját, ezért a
   panel a „Beállítások” megnyomása előtt is látszott. */
.vs-cc__prefs[hidden] { display: none; }
.vs-cc [hidden] { display: none; }
.vs-cc__opt {
	display: grid; grid-template-columns: 18px 1fr; gap: 12px; align-items: start;
	padding: 13px 16px; background: #141414; border-left: 2px solid #2A2A2A;
	font-size: 13px; line-height: 1.6; color: #9A9A9A; cursor: pointer;
}
.vs-cc__opt:hover { border-left-color: #E30613; }
.vs-cc__opt.is-locked { cursor: default; opacity: .75; }
.vs-cc__opt input { margin-top: 3px; accent-color: #E30613; }
.vs-cc__opt strong {
	display: block; margin-bottom: 3px;
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 500; font-size: 12.5px; letter-spacing: 1px;
	color: #FFFFFF; text-transform: uppercase;
}

/* Műveletek: egy hangsúlyos gomb, alatta halvány másodlagos sor */
.vs-cc__actions { display: flex; flex-direction: column; align-items: stretch; gap: 10px; min-width: 236px; }
.vs-cc__btn {
	border: 0; cursor: pointer; padding: 15px 34px;
	font-family: 'Oswald', 'Arial Narrow', Arial, sans-serif;
	font-weight: 600; font-size: 14px; letter-spacing: 2px; text-transform: uppercase;
}
.vs-cc__btn--accept { background: #E30613; color: #FFFFFF; }
.vs-cc__btn--accept:hover { background: #C20510; }
.vs-cc__btn--save { background: transparent; color: #FFFFFF; border: 1px solid #4A4A4A; padding: 12px 26px; font-size: 13px; }
.vs-cc__btn--save:hover { border-color: #FFFFFF; }

.vs-cc__minor { display: flex; align-items: center; justify-content: center; gap: 8px; }
.vs-cc__link {
	background: none; border: 0; padding: 2px 0; cursor: pointer;
	font-family: 'Roboto', Arial, sans-serif; font-size: 12.5px;
	color: #7A7A7A; text-decoration: underline; text-underline-offset: 3px;
}
.vs-cc__link:hover { color: #FFFFFF; }
.vs-cc__sep { color: #4A4A4A; font-size: 12px; }
.vs-cc__policy {
	text-align: center; font-size: 11.5px; color: #5A5A5A;
	text-decoration: underline; text-underline-offset: 3px;
}
.vs-cc__policy:hover { color: #9A9A9A; }

/* A mobil hívássáv ne kerüljön a sáv alá. */
body.vs-cc-open .vs-callbar { bottom: 0; }

@media (max-width: 900px) {
	.vs-cc__inner { grid-template-columns: 1fr; gap: 18px; padding: 20px; }
	.vs-cc__actions { min-width: 0; }
	.vs-cc__text { font-size: 13.5px; }
	.vs-cc__title { font-size: 15px; }
	.vs-cc { max-height: 88vh; overflow-y: auto; }
}
