/* ==========================================================================
   ba-site.css - BallaAuto publikus oldal, közös alaprétege
   Forrás: design/Weboldal.dc.html (Claude Design prototípus). Minden szín / sugár / méret a prototípusból.
   Névtér: bs-  (a régi Bootstrap-CSS-sel nem ütközik). Dokumentáció: docs/SITE-FOUNDATION.md
   ========================================================================== */

/* ---------- 1. Tokenek ---------- */
:root {
	/* színek */
	--bs-black: #000;
	--bs-ink: #1d1d1f;            /* szöveg, sötét kártyák, sötét gomb */
	--bs-panel: #272729;          /* sötétszürke szekció (Központ) */
	--bs-bg: #f5f5f7;             /* világosszürke szekció */
	--bs-white: #fff;
	--bs-orange: #f58220;         /* márkaszín */
	--bs-orange-hi: #ff9a3d;      /* hover / sötét hátteren a szöveges link */
	--bs-orange-ink: #b85600;     /* világos hátteren a link-szín */
	--bs-orange-ink-hover: #8f4300;
	--bs-orange-soft: #fff1e3;    /* ikon-háttér */
	--bs-orange-note: #fff6ee;    /* figyelmeztető sáv */
	--bs-silver: #e8e8ed;
	--bs-text-2: #333;            /* folyó szöveg */
	--bs-muted: #6e6e73;          /* másodlagos szöveg világoson */
	--bs-muted-dark: #a1a1a6;     /* másodlagos szöveg sötéten */
	--bs-muted-2: #8e8e93;
	--bs-light-text: #ccc;        /* leírás sötéten */
	--bs-border: #e0e0e0;         /* kártya-keret */
	--bs-border-hi: #d2d2d7;
	--bs-line: #f0f0f0;           /* belső elválasztó */
	--bs-line-dark: rgba(255,255,255,.1);
	--bs-input-border: rgba(0,0,0,.14);
	--bs-green: #30d158;
	--bs-green-ink: #1f7a3a;
	--bs-green-bg: #e8f6ec;
	--bs-danger: #c4001a;
	--bs-danger-bg: #fdecee;
	--bs-glass-bg: rgba(40,40,44,.62);
	--bs-nav-bg: rgba(0,0,0,.86);
	/* sugarak */
	--bs-r-sm: 8px;  --bs-r-input: 12px; --bs-r-md: 14px; --bs-r-card: 18px; --bs-r-lg: 22px; --bs-r-xl: 24px; --bs-r-pill: 999px;
	/* árnyékok */
	--bs-shadow-modal: 0 30px 80px rgba(0,0,0,.3);
	--bs-shadow-float: 0 20px 50px rgba(0,0,0,.25);
	--bs-shadow-pop: 0 18px 50px rgba(0,0,0,.28);
	--bs-focus-ring: 0 0 0 3px rgba(245,130,32,.2);
	--bs-car-shadow: drop-shadow(3px 5px 18px rgba(0,0,0,.18));
	/* tipográfia */
	--bs-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", system-ui, sans-serif;
	--bs-font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter", sans-serif;
	/* elrendezés */
	--bs-max: 1200px;
	--bs-gutter: 32px;
	--bs-nav-h: 52px;
}

/* ---------- 2. Alap (csak a .bs-site body alatt) ---------- */
html { margin: 0; scroll-behavior: smooth; }
.bs-bar { scroll-margin-top: 72px; }
body.bs-site {
	margin: 0;
	background: #fff;
	font-family: var(--bs-font);
	-webkit-font-smoothing: antialiased;
	color: var(--bs-ink);
	font-size: 16px;
	line-height: normal;
	padding: 0 !important;
}
.bs-site *, .bs-site *::before, .bs-site *::after { box-sizing: border-box; }
.bs-site img { border: 0; }
:where(.bs-site) a { color: var(--bs-orange-ink); text-decoration: none; }
:where(.bs-site) a:hover { color: var(--bs-orange-ink-hover); text-decoration: none; }
:where(.bs-site) h1, :where(.bs-site) h2, :where(.bs-site) h3, :where(.bs-site) h4, :where(.bs-site) p { margin: 0; }
.bs-site button { font-family: inherit; }
.bs-site [hidden] { display: none !important; }

@keyframes baPulse  { 0%{box-shadow:0 0 0 0 rgba(245,130,32,.6)}  70%{box-shadow:0 0 0 8px rgba(245,130,32,0)} 100%{box-shadow:0 0 0 0 rgba(245,130,32,0)} }
@keyframes baPulseG { 0%{box-shadow:0 0 0 0 rgba(48,209,88,.55)}   70%{box-shadow:0 0 0 8px rgba(48,209,88,0)}  100%{box-shadow:0 0 0 0 rgba(48,209,88,0)} }
@keyframes baFloat  { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
@keyframes baIn     { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:none} }

/* ---------- 3. Oldalváz ---------- */
.bs-page { min-height: 100vh; display: flex; flex-direction: column; min-width: 0; }
.bs-main { flex: 1; display: flex; flex-direction: column; }
.bs-container { max-width: var(--bs-max); margin: 0 auto; padding: 0 var(--bs-gutter); width: 100%; }
.bs-container--narrow { max-width: 880px; margin: 0 auto; padding: 0 var(--bs-gutter); width: 100%; }
.bs-sec { padding: 96px var(--bs-gutter); }
.bs-sec--black { background: #000; color: #fff; }
.bs-sec--gray  { background: var(--bs-bg); }
.bs-sec--white { background: #fff; }
.bs-sec--panel { background: var(--bs-panel); color: #fff; }
.bs-sec--hero-top { padding: 80px var(--bs-gutter) 64px; background: #000; color: #fff; }   /* aloldali fekete fejléc */
.bs-sec--hero-top .bs-container, .bs-sec--hero-top .bs-container--narrow { display: flex; flex-direction: column; gap: 12px; padding: 0; }
.bs-stack { display: flex; flex-direction: column; }
.bs-row { display: flex; align-items: center; }
.bs-gap-6{gap:6px}.bs-gap-8{gap:8px}.bs-gap-10{gap:10px}.bs-gap-12{gap:12px}.bs-gap-14{gap:14px}.bs-gap-16{gap:16px}.bs-gap-20{gap:20px}.bs-gap-24{gap:24px}
.bs-between { justify-content: space-between; }
.bs-center { align-items: center; justify-content: center; text-align: center; }
.bs-grid-2, .bs-grid-3, .bs-grid-4 { display: grid; gap: 20px; }
.bs-grid-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.bs-grid-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.bs-grid-4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
.bs-grid-4--tight { gap: 16px; }

/* ---------- 4. Tipográfia ---------- */
.bs-display   { font-family: var(--bs-font-display); font-size: 80px; line-height: 1.04; font-weight: 600; letter-spacing: -.025em; }
.bs-title-xl  { font-size: 64px; font-weight: 600; letter-spacing: -.025em; line-height: 1.1; }    /* aloldali h1 */
.bs-title-lg  { font-size: 48px; font-weight: 600; letter-spacing: -.02em; }
.bs-title-md  { font-size: 34px; font-weight: 600; letter-spacing: -.02em; }
.bs-title-sm  { font-size: 28px; font-weight: 600; letter-spacing: -.02em; }
.bs-title-xs  { font-size: 21px; font-weight: 600; }
.bs-lead      { font-size: 21px; color: var(--bs-muted); }
.bs-lead--light { color: var(--bs-light-text); }
.bs-text-17   { font-size: 17px; }
.bs-text-15   { font-size: 15px; }
.bs-text-14   { font-size: 14px; }
.bs-text-13   { font-size: 13px; }
.bs-text-12   { font-size: 12px; }
.bs-muted     { color: var(--bs-muted); }
.bs-muted-dark{ color: var(--bs-muted-dark); }
.bs-accent    { color: var(--bs-orange); }
.bs-eyebrow   { font-size: 14px; color: var(--bs-orange-hi); letter-spacing: .08em; text-transform: uppercase; }
.bs-group-label { font-size: 12px; font-weight: 600; color: var(--bs-muted); letter-spacing: .04em; text-transform: uppercase; }
.bs-prose { font-size: 17px; line-height: 1.6; color: var(--bs-text-2); }
.bs-prose > * + * { margin-top: 14px; }
.bs-link { color: var(--bs-orange-ink); cursor: pointer; }
.bs-link:hover { color: var(--bs-orange-ink-hover); }
.bs-link--dark { color: var(--bs-orange-hi); }

/* ---------- 5. Státuszpont, jelvény, chip ---------- */
.bs-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex-shrink: 0; background: var(--bs-muted-dark); }
.bs-dot--green  { background: var(--bs-green); animation: baPulseG 2s infinite; }
.bs-dot--orange { background: var(--bs-orange); animation: baPulse 2s infinite; }
.bs-dot--gray   { background: var(--bs-muted-dark); }
.bs-dot--red    { background: #ff453a; }
.bs-dot--still  { animation: none; }
.bs-status { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.bs-badge { display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px; border-radius: var(--bs-r-pill); background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); font-size: 14px; color: var(--bs-silver); }
.bs-pill { font-size: 11px; font-weight: 600; padding: 3px 9px; border-radius: var(--bs-r-pill); background: var(--bs-green-bg); color: var(--bs-green-ink); }
.bs-pill--orange { background: var(--bs-orange-soft); color: var(--bs-orange-ink); }
.bs-pill--gray { background: var(--bs-bg); color: var(--bs-muted); }
.bs-chip { display: inline-block; padding: 9px 16px; border-radius: var(--bs-r-pill); font-size: 14px; cursor: pointer; background: rgba(255,255,255,.06); color: var(--bs-silver); border: 1px solid rgba(255,255,255,.14); }
.bs-chip:hover { color: #fff; border-color: rgba(255,255,255,.3); }
.bs-chip.is-active { background: var(--bs-orange); color: var(--bs-ink); border-color: var(--bs-orange); }
.bs-chip__count { opacity: .6; }
.bs-seg { display: flex; gap: 4px; padding: 3px; border-radius: 10px; background: var(--bs-silver); font-size: 13px; }
.bs-seg > * { padding: 6px 12px; border-radius: var(--bs-r-sm); cursor: pointer; white-space: nowrap; color: var(--bs-ink); }
.bs-seg > .is-active { background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.12); }

/* ---------- 6. Gombok ---------- */
.bs-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-family: inherit; font-size: 17px; line-height: normal; padding: 12px 26px; border-radius: var(--bs-r-pill); border: 0; cursor: pointer; text-align: center; white-space: nowrap; background: none; color: var(--bs-ink); transition: background .15s, color .15s, border-color .15s; }
.bs-btn--primary { background: var(--bs-orange); color: var(--bs-ink); }
.bs-btn--primary:hover { background: var(--bs-orange-hi); color: var(--bs-ink); }
.bs-btn--ghost { color: var(--bs-orange-hi); border: 1px solid var(--bs-orange-hi); padding: 11px 25px; }          /* sötét hátteren */
.bs-btn--ghost:hover { background: rgba(255,154,61,.12); color: var(--bs-orange-hi); }
.bs-btn--outline { color: var(--bs-orange-ink); border: 1px solid var(--bs-orange-ink); padding: 11px 23px; }       /* világos hátteren */
.bs-btn--outline:hover { background: rgba(184,86,0,.06); color: var(--bs-orange-ink-hover); }
.bs-btn--dark { background: var(--bs-ink); color: #fff; border: 1px solid #3a3a3c; border-radius: var(--bs-r-sm); font-size: 13px; padding: 7px 15px; }
.bs-btn--dark:hover { background: #2c2c2e; color: #fff; }
.bs-btn--light { background: var(--bs-bg); color: var(--bs-ink); }
.bs-btn--sm { font-size: 15px; padding: 10px 22px; }
.bs-btn--block { display: flex; width: 100%; }
.bs-btn[disabled], .bs-btn.is-disabled { opacity: .5; pointer-events: none; }

/* ---------- 7. Kártyák ---------- */
.bs-card { background: #fff; border: 1px solid var(--bs-border); border-radius: var(--bs-r-card); padding: 24px; display: flex; flex-direction: column; gap: 14px; }
.bs-card--lg { border-radius: var(--bs-r-lg); padding: 28px; }
.bs-card--hover { transition: transform .2s; cursor: pointer; color: inherit; }
.bs-card--hover:hover { transform: translateY(-4px); border-color: var(--bs-border-hi); color: inherit; }
.bs-card--selectable { cursor: pointer; }
.bs-card.is-selected { border: 2px solid var(--bs-orange); }
.bs-card--dark { background: var(--bs-ink); color: #fff; border: 0; border-radius: var(--bs-r-xl); padding: 24px; }
.bs-card--glass-dark { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); color: #fff; border-radius: var(--bs-r-card); padding: 32px; display: flex; flex-direction: column; gap: 14px; }
.bs-card__icon { font-size: 26px; color: var(--bs-orange); }
.bs-note { background: var(--bs-orange-note); border-radius: 10px; padding: 10px 14px; font-size: 14px; line-height: 1.43; }

/* ---------- 8. Űrlap ---------- */
.bs-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.bs-label { font-size: 13px; color: var(--bs-muted); }
.bs-hint  { font-size: 12px; color: var(--bs-muted-2); }
.bs-input, .bs-select, .bs-textarea {
	width: 100%; height: 46px; border-radius: var(--bs-r-input); border: 1px solid var(--bs-input-border); padding: 0 14px;
	font-size: 17px; font-family: inherit; color: var(--bs-ink); background: #fff; outline: none; box-sizing: border-box; margin: 0; transition: border-color .15s, box-shadow .15s;
}
.bs-input:focus, .bs-select:focus, .bs-textarea:focus { border-color: var(--bs-orange); box-shadow: var(--bs-focus-ring); }
.bs-input--sm, .bs-select--sm { height: 44px; }
.bs-input[readonly] { background: var(--bs-bg); }
.bs-textarea { height: auto; min-height: 80px; padding: 12px 14px; font-size: 15px; resize: vertical; }
.bs-textarea--lg { min-height: 200px; font-size: 17px; }
.bs-select { appearance: none; -webkit-appearance: none; padding-right: 38px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%238e8e93' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; }
.bs-input.is-invalid, .bs-select.is-invalid, .bs-textarea.is-invalid { border-color: var(--bs-danger); }
.bs-field-error { font-size: 13px; color: var(--bs-danger); }
.bs-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px 14px; }
.bs-form-grid .bs-span-all { grid-column: 1 / -1; }
.bs-form-group { display: flex; flex-direction: column; gap: 12px; }
.bs-form-actions { display: flex; justify-content: flex-end; align-items: center; gap: 12px; border-top: 1px solid var(--bs-line); padding-top: 20px; }
/* egyedi checkbox: <label class="bs-check"><input type="checkbox"><span class="bs-check__box"><i class="fa fa-check"></i></span>Szöveg</label> */
.bs-check { display: flex; gap: 10px; align-items: center; cursor: pointer; user-select: none; font-size: 15px; position: relative; }
.bs-check input { position: absolute; opacity: 0; width: 0; height: 0; }
.bs-check__box { width: 20px; height: 20px; border-radius: 6px; background: #fff; border: 1px solid var(--bs-border-hi); color: var(--bs-ink); display: flex; align-items: center; justify-content: center; font-size: 11px; flex-shrink: 0; }
.bs-check__box .fa { opacity: 0; }
.bs-check input:checked + .bs-check__box { background: var(--bs-orange); border-color: var(--bs-orange); }
.bs-check input:checked + .bs-check__box .fa { opacity: 1; }
.bs-check input:focus-visible + .bs-check__box { box-shadow: var(--bs-focus-ring); border-color: var(--bs-orange); }
.bs-alert { display: flex; gap: 10px; align-items: flex-start; border-radius: var(--bs-r-md); padding: 14px 16px; font-size: 15px; line-height: 1.45; }
.bs-alert--success { background: var(--bs-green-bg); color: var(--bs-green-ink); }
.bs-alert--error   { background: var(--bs-danger-bg); color: var(--bs-danger); }
.bs-alert--info    { background: var(--bs-bg); color: var(--bs-muted); }
.bs-alert--warning { background: var(--bs-orange-note); color: var(--bs-orange-ink); }
.bs-alert .fa { margin-top: 3px; }

/* ---------- 9. Globális NAV ---------- */
.bs-nav { position: sticky; top: 0; z-index: 30; height: var(--bs-nav-h); background: var(--bs-nav-bg); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); color: var(--bs-silver); }
.bs-nav__inner { max-width: var(--bs-max); margin: 0 auto; padding: 0 var(--bs-gutter); height: var(--bs-nav-h); display: flex; align-items: center; justify-content: space-between; box-sizing: border-box; }
.bs-nav__logo { display: block; flex-shrink: 0; }
.bs-nav__logo img { height: 26px; width: auto; display: block; }
.bs-nav__links { display: flex; gap: 30px; font-size: 13px; }
.bs-nav__link, :where(.bs-site) .bs-nav__link { cursor: pointer; color: var(--bs-light-text); padding: 6px 0; border-bottom: 2px solid transparent; white-space: nowrap; }
.bs-nav__link:hover, .bs-nav__link.is-active { color: #fff; }
.bs-nav__link.is-active { border-bottom-color: var(--bs-orange); }
.bs-nav__right { display: flex; gap: 10px; align-items: center; font-size: 13px; }
.bs-nav__burger { display: none; }
.bs-nav__panel { display: contents; }
.bs-cur { display: flex; padding: 2px; border-radius: var(--bs-r-pill); background: rgba(255,255,255,.08); }
.bs-cur a, :where(.bs-site) .bs-cur a { padding: 4px 10px; border-radius: var(--bs-r-pill); cursor: pointer; color: var(--bs-light-text); background: transparent; }
.bs-cur a.is-active { background: #fff; color: var(--bs-ink); }
.bs-cur a:not(.is-active):hover { color: #fff; }
.bs-menu { position: relative; }
.bs-menu__btn { padding: 5px 10px; border-radius: var(--bs-r-pill); background: rgba(255,255,255,.08); cursor: pointer; color: var(--bs-silver); border: 0; font-size: 13px; display: inline-flex; align-items: center; gap: 6px; line-height: 1.2; }
.bs-menu__btn:hover { background: rgba(255,255,255,.14); color: #fff; }
.bs-menu__btn--plain { background: none; padding: 0; color: #fff; gap: 8px; }
.bs-menu__btn--plain:hover { background: none; }
.bs-menu__list { position: absolute; right: 0; top: calc(100% + 10px); min-width: 170px; background: rgba(40,40,44,.96); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); border: 1px solid rgba(255,255,255,.14); border-radius: var(--bs-r-md); padding: 6px; display: none; z-index: 40; box-shadow: var(--bs-shadow-pop); }
.bs-menu.is-open .bs-menu__list { display: block; }
.bs-menu__item, :where(.bs-site) .bs-menu__item { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 10px; color: var(--bs-silver); font-size: 13px; cursor: pointer; white-space: nowrap; }
.bs-menu__item:hover { background: rgba(255,255,255,.1); color: #fff; }
.bs-menu__item.is-active { color: #fff; }
.bs-menu__sep { height: 1px; background: rgba(255,255,255,.12); margin: 6px 4px; }
.bs-avatar { width: 26px; height: 26px; border-radius: 50%; background: var(--bs-orange); color: var(--bs-ink); display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 600; flex-shrink: 0; }
.bs-avatar--lg { width: 44px; height: 44px; background: var(--bs-ink); color: #fff; font-size: 16px; }
.bs-lang-flag { width: 18px; height: auto; border-radius: 2px; display: block; }

/* ---------- 10. Flash üzenetek ---------- */
.bs-flash { position: fixed; top: calc(var(--bs-nav-h) + 14px); left: 50%; transform: translateX(-50%); z-index: 55; width: min(560px, calc(100% - 32px)); display: flex; flex-direction: column; gap: 10px; }
.bs-flash .bs-alert { box-shadow: var(--bs-shadow-pop); animation: baIn .25s ease-out; background: #fff; border: 1px solid var(--bs-border); }
.bs-flash .bs-alert--success { background: var(--bs-green-bg); border-color: #cfe9d6; }
.bs-flash .bs-alert--error   { background: var(--bs-danger-bg); border-color: #f5c6cc; }
.bs-flash .bs-alert__text { flex: 1; }
.bs-flash .bs-alert__close { background: none; border: 0; cursor: pointer; color: inherit; opacity: .6; font-size: 14px; padding: 2px 4px; }
.bs-flash .bs-alert__close:hover { opacity: 1; }

/* ---------- 11. Modal ---------- */
.bs-modal { position: fixed; inset: 0; z-index: 60; background: rgba(0,0,0,.4); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); display: none; align-items: center; justify-content: center; padding: 16px; overflow-y: auto; }
.bs-modal.is-open { display: flex; }
.bs-modal__panel { width: 420px; max-width: 100%; background: rgba(255,255,255,.96); border-radius: 26px; padding: 32px; display: flex; flex-direction: column; gap: 14px; box-shadow: var(--bs-shadow-modal); animation: baIn .2s ease-out; margin: auto; }
.bs-modal__head { display: flex; justify-content: space-between; align-items: center; }
.bs-modal__head img { height: 26px; width: auto; }
.bs-modal__close { width: 30px; height: 30px; border-radius: 50%; background: #f0f0f2; display: flex; align-items: center; justify-content: center; cursor: pointer; border: 0; color: var(--bs-ink); padding: 0; font-size: 14px; }
.bs-modal__close:hover { background: var(--bs-silver); }
.bs-modal__title { font-size: 28px; font-weight: 600; letter-spacing: -.02em; margin-top: 8px; }
.bs-modal__foot { border-top: 1px solid var(--bs-silver); padding-top: 14px; font-size: 15px; color: var(--bs-muted); text-align: center; }
.bs-modal form { display: flex; flex-direction: column; gap: 14px; margin: 0; }
.bs-modal .bs-btn { width: 100%; }

/* ---------- 12. HERO (főoldal) ---------- */
.bs-hero { position: relative; background: #000; color: #fff; padding: 72px var(--bs-gutter) 0; display: flex; flex-direction: column; align-items: center; text-align: center; overflow: visible; }
.bs-hero--left { align-items: stretch; text-align: left; }
.bs-hero--left .bs-hero__inner { align-items: flex-start; }
.bs-hero__bg { position: absolute; inset: 0; overflow: hidden; z-index: 0; }
.bs-hero__bg img, .bs-hero__bg video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bs-hero__overlay { position: absolute; inset: 0; background: #000; }
.bs-hero__inner { position: relative; z-index: 1; width: 100%; max-width: var(--bs-max); display: flex; flex-direction: column; align-items: center; }
.bs-hero h1 { margin: 28px 0 0; font-family: var(--bs-font-display); font-size: 80px; line-height: 1.04; font-weight: 600; letter-spacing: -.025em; max-width: 1000px; text-wrap: balance; }
.bs-hero h1 .bs-accent { color: var(--bs-orange); }
.bs-hero__sub { margin: 20px 0 0; font-size: 24px; font-weight: 300; line-height: 1.4; color: var(--bs-light-text); max-width: 720px; }
.bs-hero__cta { display: flex; gap: 16px; margin-top: 32px; flex-wrap: wrap; justify-content: center; }
.bs-hero--left .bs-hero__cta { justify-content: flex-start; }
.bs-hero__stage { position: relative; width: 100%; max-width: 1040px; height: 480px; margin-top: 24px; }
.bs-hero__glow { position: absolute; left: 50%; top: 50%; width: 900px; height: 360px; max-width: 100%; transform: translate(-50%,-50%); background: radial-gradient(closest-side, rgba(245,130,32,.22), rgba(245,130,32,0)); filter: blur(10px); }
.bs-hero__car { position: absolute; left: 50%; top: 0; width: 820px; max-width: 100%; margin-left: -410px; animation: baFloat 6s ease-in-out infinite; }
.bs-hero--nostage .bs-hero__stage { display: none; }
.bs-hero--cover .bs-hero__stage { display: none; }
.bs-hero--nobar { padding-bottom: 72px; }
.bs-hero--nobar .bs-hero__stage { margin-bottom: 0; }

/* üveg foglaló sáv */
.bs-bar { position: relative; width: 100%; max-width: 1222px; margin-top: -110px; transform: translateY(64px); background: var(--bs-glass-bg); -webkit-backdrop-filter: saturate(180%) blur(24px); backdrop-filter: saturate(180%) blur(24px); border: 1px solid rgba(255,255,255,.14); border-radius: 28px; padding: 10px; text-align: left; z-index: 5; display: flex; flex-direction: column; gap: 6px; }
.bs-hero--cover .bs-bar, .bs-hero--nostage .bs-bar { margin-top: 56px; }
.bs-bar__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr auto; align-items: stretch; }
.bs-bar.has-return .bs-bar__grid { grid-template-columns: 1.2fr 1.2fr 1fr 1fr 1fr auto; }
.bs-bar__cell { padding: 12px 20px; display: flex; flex-direction: column; gap: 6px; border-right: 1px solid rgba(255,255,255,.1); position: relative; min-width: 0; cursor: pointer; text-align: left; background: none; border-top: 0; border-bottom: 0; border-left: 0; color: inherit; font: inherit; margin: 0; }
.bs-bar__cell--last { border-right: 0; }
.bs-bar__cell[hidden] { display: none; }
.bs-bar__label { font-size: 12px; color: var(--bs-muted-dark); }
.bs-bar__value { font-size: 17px; color: #fff; white-space: nowrap; display: flex; justify-content: space-between; gap: 8px; align-items: center; min-width: 0; }
.bs-bar__value .fa { color: var(--bs-muted-dark); }
.bs-bar__value-text { overflow: hidden; text-overflow: ellipsis; }
.bs-bar select { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; font-size: 16px; }
.bs-bar select option { color: var(--bs-ink); }
.bs-bar__go { display: flex; align-items: center; justify-content: center; gap: 10px; background: var(--bs-orange); color: var(--bs-ink); border-radius: 20px; padding: 0 28px; font-size: 17px; cursor: pointer; border: 0; font-family: inherit; }
.bs-bar__go:hover { background: var(--bs-orange-hi); }
.bs-bar__toggle { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--bs-light-text); padding: 2px 20px 6px; cursor: pointer; user-select: none; position: relative; align-self: flex-start; }
.bs-bar__toggle input { position: absolute; opacity: 0; width: 0; height: 0; }
.bs-bar__toggle-box { width: 16px; height: 16px; border-radius: 4px; border: 1px solid rgba(255,255,255,.4); background: transparent; display: flex; align-items: center; justify-content: center; color: var(--bs-ink); font-size: 10px; }
.bs-bar__toggle-box .fa { opacity: 0; }
.bs-bar__toggle input:checked + .bs-bar__toggle-box { border: 0; background: var(--bs-orange); }
.bs-bar__toggle input:checked + .bs-bar__toggle-box .fa { opacity: 1; }
.bs-bar__toggle input:focus-visible + .bs-bar__toggle-box { box-shadow: 0 0 0 3px rgba(245,130,32,.4); }
.bs-bar__details { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 0 10px 8px; }
.bs-bar__details[hidden] { display: none; }
.bs-bar__details label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--bs-muted-dark); }
.bs-bar__details input, .bs-bar__details select { height: 40px; border-radius: 10px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.06); color: #fff; font-size: 15px; padding: 0 12px; font-family: inherit; outline: none; width: 100%; position: static; opacity: 1; }
.bs-bar__details select option { color: var(--bs-ink); }
.bs-bar__details input:focus, .bs-bar__details select:focus { border-color: var(--bs-orange); }
.bs-bar__error { padding: 2px 20px 8px; font-size: 13px; color: #ff6b6b; }

/* dátum / idő felugró (a foglaló sávban) */
.bs-pop { position: absolute; z-index: 50; background: #fff; color: var(--bs-ink); border-radius: 20px; box-shadow: var(--bs-shadow-pop); padding: 14px; display: none; gap: 12px; text-align: left; top: calc(100% + 10px); left: 0; }
.bs-pop.is-open { display: flex; animation: baIn .15s ease-out; }
.bs-pop__cal { width: 272px; }
.bs-pop__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; font-size: 15px; font-weight: 600; text-transform: capitalize; }
.bs-pop__nav { width: 28px; height: 28px; border-radius: 50%; border: 0; background: var(--bs-bg); cursor: pointer; color: var(--bs-ink); display: flex; align-items: center; justify-content: center; padding: 0; }
.bs-pop__nav:hover { background: var(--bs-silver); }
.bs-pop__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; font-size: 13px; text-align: center; }
.bs-pop__dow { color: var(--bs-muted-2); font-size: 11px; padding: 4px 0; }
.bs-pop__day { height: 34px; border-radius: 50%; border: 0; background: none; cursor: pointer; font-size: 14px; color: var(--bs-ink); padding: 0; font-family: inherit; }
.bs-pop__day:hover:not(:disabled):not(.is-selected) { background: var(--bs-bg); }
.bs-pop__day.is-today { box-shadow: inset 0 0 0 1px var(--bs-border-hi); }
.bs-pop__day.is-selected { background: var(--bs-orange); color: var(--bs-ink); font-weight: 600; }
.bs-pop__day.is-range { background: var(--bs-orange-soft); border-radius: 0; }
.bs-pop__day:disabled { color: #c7c7cc; cursor: default; background: none; }
.bs-pop__times { width: 92px; max-height: 292px; overflow-y: auto; display: flex; flex-direction: column; gap: 2px; border-left: 1px solid var(--bs-line); padding-left: 10px; }
.bs-pop__time { border: 0; background: none; border-radius: 10px; padding: 8px 6px; cursor: pointer; font-size: 14px; font-family: inherit; color: var(--bs-ink); }
.bs-pop__time:hover { background: var(--bs-bg); }
.bs-pop__time.is-selected { background: var(--bs-orange); font-weight: 600; }
.bs-pop__empty { font-size: 13px; color: var(--bs-muted); padding: 8px 4px; }

/* ---------- 13. Főoldal szekciói ---------- */
.bs-home-fleet { background: var(--bs-bg); padding: 144px var(--bs-gutter) 96px; }
.bs-home-fleet__inner { max-width: var(--bs-max); margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 48px; }
.bs-sec-head { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.bs-sec-head h2 { font-size: 48px; font-weight: 600; letter-spacing: -.02em; }
.bs-sec-head p { font-size: 21px; color: var(--bs-muted); }
.bs-car-card { position: relative; background: #fff; border: 1px solid var(--bs-border); border-radius: var(--bs-r-card); padding: 0; overflow: hidden; display: flex; flex-direction: column; gap: 0; cursor: pointer; transition: transform .2s; color: var(--bs-ink); }
:where(.bs-site) a.bs-car-card:hover { color: var(--bs-ink); }
.bs-car-card:hover { transform: translateY(-4px); border-color: var(--bs-border-hi); }
/* kategória + állapot: címkék a fotó sarkaiban */
.bs-car-card__top { position: absolute; top: 12px; left: 12px; right: 12px; z-index: 1; display: flex; justify-content: space-between; align-items: center; font-size: 12px; gap: 8px; pointer-events: none; }
.bs-car-card__top > span { background: rgba(255,255,255,.92); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); padding: 5px 10px; border-radius: 999px; font-weight: 500; color: var(--bs-ink); box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.bs-car-card__top .bs-status { color: var(--bs-ink); }
/* fotó a kártya teljes szélességében, 4:3 */
.bs-car-card__img { order: -1; display: block; aspect-ratio: 4 / 3; overflow: hidden; background: #ececef; }
.bs-car-card__img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.bs-car-card:hover .bs-car-card__img img { transform: scale(1.04); }
.bs-car-card__body { display: flex; flex-direction: column; gap: 4px; padding: 18px 22px 18px; }
.bs-car-card__brand { font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--bs-muted); line-height: 1.2; }
.bs-car-card__name { font-size: 19px; font-weight: 600; letter-spacing: -.3px; line-height: 1.3; }
.bs-car-card__name .bs-nw { white-space: nowrap; }
.bs-car-card__spec { font-size: 15px; color: var(--bs-muted); }
/* alsó antracit csík: fehér ár + narancs körben nyíl */
.bs-car-card__bottom { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: auto; padding: 14px 20px; background: #2a2a2d; color: #fff; transition: background .2s; }
.bs-car-card:hover .bs-car-card__bottom { background: #333337; }
.bs-car-card__price { font-size: 20px; font-weight: 600; letter-spacing: -.01em; color: #fff; white-space: nowrap; min-width: 0; }
.bs-car-card__price small { font-size: 13px; font-weight: 400; letter-spacing: 0; color: rgba(255,255,255,.65); }
.bs-car-card__more { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: var(--bs-orange); color: #fff; font-size: 15px; transition: transform .2s, background .2s; }
.bs-car-card:hover .bs-car-card__more { background: var(--bs-orange-hi); transform: translateX(3px); }
.bs-car-card__more-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.bs-center-link { font-size: 17px; color: var(--bs-orange-ink); cursor: pointer; }
.bs-about { background: var(--bs-panel); color: #fff; padding: 112px var(--bs-gutter); }
.bs-about__inner { max-width: var(--bs-max); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.bs-about__title { font-size: 72px; font-weight: 300; letter-spacing: -.03em; line-height: 1; }
.bs-about__title b { font-weight: 600; color: var(--bs-orange); }
.bs-about__text { font-size: 21px; line-height: 1.55; color: var(--bs-light-text); }
.bs-about__features { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; margin-top: 16px; }
.bs-feature__title { font-size: 21px; font-weight: 600; }
.bs-feature__text { font-size: 17px; line-height: 1.47; color: var(--bs-muted-dark); }
.bs-newsletter { background: #fff; padding: 96px var(--bs-gutter); display: flex; flex-direction: column; align-items: center; gap: 28px; text-align: center; }
.bs-newsletter h3 { font-size: 40px; font-weight: 600; letter-spacing: -.02em; max-width: 820px; text-wrap: balance; }
.bs-newsletter form { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; margin: 0; }
.bs-newsletter .bs-pillinput { height: 48px; border-radius: var(--bs-r-pill); border: 1px solid var(--bs-input-border); padding: 0 22px; font-size: 17px; font-family: inherit; outline: none; box-sizing: border-box; color: var(--bs-ink); background: #fff; }
.bs-newsletter .bs-pillinput:focus { border-color: var(--bs-orange); box-shadow: var(--bs-focus-ring); }
.bs-newsletter .bs-pillinput--name { width: 240px; }
.bs-newsletter .bs-pillinput--email { width: 300px; }
.bs-newsletter .bs-btn { height: 48px; padding: 0 26px; }
.bs-newsletter__done { display: flex; align-items: center; gap: 10px; font-size: 17px; color: var(--bs-green-ink); animation: baIn .3s; }
.bs-newsletter__err { font-size: 14px; color: var(--bs-danger); }
.bs-newsletter__err:empty { display: none; }

/* ---------- 14. FOOTER ---------- */
.bs-footer { background: #000; color: #fff; }
.bs-footer__top { max-width: var(--bs-max); margin: 0 auto; padding: 56px var(--bs-gutter) 32px; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; box-sizing: border-box; }
.bs-footer__brand { display: flex; flex-direction: column; gap: 14px; }
.bs-footer__brand img { height: 30px; width: auto; align-self: flex-start; }
.bs-footer__phone { font-size: 28px; font-weight: 600; letter-spacing: -.02em; color: #fff; }
:where(.bs-site) a.bs-footer__phone:hover { color: #fff; }
.bs-footer__col { display: flex; flex-direction: column; gap: 10px; font-size: 14px; color: var(--bs-light-text); }
.bs-footer__col b { color: #fff; font-size: 13px; }
.bs-footer__col a, :where(.bs-site) .bs-footer__col a { color: var(--bs-light-text); cursor: pointer; }
.bs-footer__col a:hover { color: #fff; }
.bs-footer__bottom { max-width: var(--bs-max); margin: 0 auto; padding: 20px var(--bs-gutter) 28px; border-top: 1px solid rgba(255,255,255,.1); display: flex; justify-content: space-between; gap: 16px; font-size: 12px; color: var(--bs-muted-dark); box-sizing: border-box; }
.bs-footer__bottom a, :where(.bs-site) .bs-footer__bottom a { color: var(--bs-orange-hi); cursor: pointer; }

/* ---------- 15. Reszponzív ---------- */
@media (max-width: 1099px) {
	:root { --bs-gutter: 24px; }
	.bs-display, .bs-hero h1 { font-size: 60px; }
	.bs-title-xl { font-size: 52px; }
	.bs-hero__sub { font-size: 21px; }
	.bs-hero__stage { height: 380px; }
	.bs-hero__car { width: 640px; margin-left: -320px; }
	.bs-hero__glow { width: 700px; height: 300px; }
	.bs-bar { margin-top: -80px; }
	.bs-bar__grid, .bs-bar.has-return .bs-bar__grid { grid-template-columns: 1fr 1fr; }
	.bs-bar__cell { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.1); }
	.bs-bar__go { padding: 16px 28px; margin-top: 8px; grid-column: 1 / -1; }
	.bs-bar__cell--last { border-bottom: 0; }
	.bs-home-fleet { padding: 150px var(--bs-gutter) 80px; }
	.bs-grid-4 { grid-template-columns: repeat(2, minmax(0,1fr)); }
	.bs-grid-3 { grid-template-columns: repeat(2, minmax(0,1fr)); }
	.bs-about__inner { grid-template-columns: 1fr; gap: 32px; }
	.bs-about__title { font-size: 56px; }
	.bs-about__features { grid-template-columns: 1fr; }
	.bs-footer__top { grid-template-columns: 1fr 1fr; }
	.bs-sec-head h2 { font-size: 40px; }

	/* nav: hamburger */
	.bs-nav__burger { display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; background: none; border: 0; color: #fff; font-size: 20px; cursor: pointer; padding: 0; margin-right: -8px; }
	.bs-nav__panel { display: none; position: absolute; left: 0; right: 0; top: var(--bs-nav-h); background: #000; padding: 8px var(--bs-gutter) 22px; flex-direction: column; gap: 4px; max-height: calc(100vh - var(--bs-nav-h)); overflow-y: auto; }
	.bs-nav.is-open .bs-nav__panel { display: flex; }
	.bs-nav__links { flex-direction: column; gap: 0; font-size: 17px; }
	.bs-nav__link { padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.1); }
	.bs-nav__link.is-active { border-bottom-color: var(--bs-orange); }
	.bs-nav__right { flex-wrap: wrap; padding-top: 14px; gap: 12px; }
	.bs-nav__panel .bs-menu__list { position: static; display: block; background: none; border: 0; box-shadow: none; padding: 0; }
	.bs-nav__panel .bs-menu .bs-menu__btn { display: none; }
	.bs-nav__panel .bs-menu--user .bs-menu__btn { display: inline-flex; }
	.bs-nav__panel .bs-menu--user .bs-menu__list { position: static; display: block; }
	.bs-nav__panel .bs-menu--lang { display: flex; gap: 6px; }
	.bs-nav__panel .bs-menu--lang .bs-menu__list { display: flex; gap: 6px; }
	.bs-nav__panel .bs-menu--lang .bs-menu__item { background: rgba(255,255,255,.08); border-radius: var(--bs-r-pill); padding: 5px 12px; }
	.bs-nav__panel .bs-menu--lang .bs-menu__item.is-active { background: #fff; color: var(--bs-ink); }
}
@media (max-width: 767px) {
	:root { --bs-gutter: 16px; }
	.bs-display, .bs-hero h1 { font-size: 38px; }
	.bs-hero { padding-top: 40px; }
	.bs-hero h1 { margin-top: 20px; }
	.bs-hero__sub { font-size: 17px; margin-top: 14px; }
	.bs-hero__cta { gap: 10px; margin-top: 22px; }
	.bs-hero__cta .bs-btn { font-size: 16px; padding: 11px 20px; }
	.bs-hero__cta .bs-btn--ghost { padding: 10px 19px; }
	.bs-hero__stage { height: 230px; margin-top: 8px; }
	.bs-hero__car { width: 440px; margin-left: -220px; }
	.bs-hero__glow { width: 100%; height: 200px; }
	.bs-badge { font-size: 13px; padding: 7px 14px; }
	.bs-bar { margin-top: -30px; transform: translateY(40px); border-radius: 22px; }
	.bs-bar__grid, .bs-bar.has-return .bs-bar__grid { grid-template-columns: 1fr; }
	.bs-bar__cell { padding: 12px 16px; }
	.bs-bar__toggle { padding: 2px 16px 6px; }
	.bs-bar__details { grid-template-columns: 1fr; }
	.bs-bar__go { grid-column: auto; padding: 15px; margin-top: 4px; }
	.bs-pop { position: fixed; left: 12px !important; right: 12px; top: 90px !important; flex-direction: column; max-height: calc(100vh - 110px); overflow-y: auto; }
	.bs-pop__cal { width: 100%; }
	.bs-pop__times { width: 100%; max-height: none; flex-direction: row; flex-wrap: wrap; border-left: 0; padding-left: 0; border-top: 1px solid var(--bs-line); padding-top: 10px; }
	.bs-home-fleet { padding: 90px var(--bs-gutter) 56px; }
	.bs-home-fleet__inner { gap: 32px; }
	.bs-sec-head h2 { font-size: 32px; }
	.bs-sec-head p { font-size: 17px; }
	.bs-grid-4, .bs-grid-3, .bs-grid-2 { grid-template-columns: 1fr; }
	.bs-about { padding: 64px var(--bs-gutter); }
	.bs-about__title { font-size: 40px; }
	.bs-about__text { font-size: 17px; }
	.bs-newsletter { padding: 64px var(--bs-gutter); }
	.bs-newsletter h3 { font-size: 28px; }
	.bs-newsletter .bs-pillinput--name, .bs-newsletter .bs-pillinput--email { width: 100%; }
	.bs-newsletter form { width: 100%; }
	.bs-newsletter .bs-btn { width: 100%; }
	.bs-footer__top { grid-template-columns: 1fr; gap: 28px; padding-top: 40px; }
	.bs-footer__bottom { flex-direction: column; gap: 8px; }
	.bs-title-xl { font-size: 38px; }
	.bs-title-lg { font-size: 34px; }
	.bs-title-md { font-size: 28px; }
	.bs-lead { font-size: 18px; }
	.bs-sec { padding: 56px var(--bs-gutter); }
	.bs-sec--hero-top { padding: 48px var(--bs-gutter) 40px; }
	.bs-form-grid { grid-template-columns: 1fr; }
	.bs-modal__panel { padding: 24px; border-radius: 22px; }
	.bs-nav__logo img { height: 22px; }
}

/* Hero "scene" mód: asztalon a kép (a szélei és a teteje a képbe sütve feketébe tűnik) az aljára igazítva, a szöveg a fekete felső részen áll;
   mobilon a kép a CTA és a kereső kártya közé kerül (nem takarja el a kártya) */
.bs-hero__bg picture { position: absolute; inset: 0; display: block; }
.bs-hero__scene-m { display: none; }
.bs-hero--scene { background: #0e0e0f; min-height: calc(500px + 0.2031 * min(100vw, 2200px)); }
.bs-hero--scene .bs-hero__bg img { object-fit: contain; object-position: 50% 100%; }
.bs-hero--scene .bs-hero__inner { flex: 1 1 auto; }
.bs-hero--scene .bs-hero__inner > .bs-bar { margin-top: auto; }
.bs-hero--scene .bs-hero__cta { margin-bottom: 56px; }
@media (max-width: 720px) {
	.bs-hero--scene { min-height: 0; }
	.bs-hero--scene .bs-hero__bg { display: none; }
	.bs-hero--scene .bs-hero__cta { margin-bottom: 0; }
	.bs-hero__scene-m { display: block; position: relative; width: calc(100% + 2 * var(--bs-gutter)); margin: 8px calc(-1 * var(--bs-gutter)) 0; aspect-ratio: 4 / 3.15; overflow: hidden; }
	.bs-hero__scene-m img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 83%; display: block; -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 22%, #000 80%, transparent 100%); mask-image: linear-gradient(to bottom, transparent 0, #000 22%, #000 80%, transparent 100%); }
	.bs-hero--scene .bs-hero__inner > .bs-bar { margin-top: -96px; }
}
/* Hero scene: ultraszéles képernyőn a kép nem nő tovább (különben az autók a szöveg fölé emelkednének) */
@media (min-width: 721px) {
	.bs-hero--scene .bs-hero__bg picture { left: 50%; right: auto; width: 112%; max-width: 2464px; transform: translateX(-50%); }
}

/* Tesztüzem: zárt foglalás */
.bs-notice { background: #fff4e6; color: #5a2e00; font-size: 14px; line-height: 1.4; text-align: center; padding: 10px var(--bs-gutter); border-bottom: 1px solid #f3d9b8; }
.bs-notice__dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--bs-orange); margin-right: 10px; vertical-align: middle; }
.bs-bar--closed { flex-direction: row; align-items: center; gap: 16px; padding: 22px 28px; color: #fff; }
.bs-bar--closed > i { font-size: 26px; color: var(--bs-orange); }
.bs-bar--closed strong { display: block; font-size: 17px; font-weight: 600; margin-bottom: 2px; }
.bs-bar--closed span { display: block; font-size: 14px; color: rgba(255,255,255,.78); line-height: 1.45; }
.bs-quick-closed { display: flex; gap: 10px; align-items: flex-start; padding: 14px 16px; border-radius: 14px; background: #fff4e6; color: #5a2e00; font-size: 14px; line-height: 1.45; }
.bs-quick-closed i { color: var(--bs-orange); margin-top: 2px; }

.bs-about__text .bs-count { color: var(--bs-orange); font-weight: 600; }

/* ======================================================================
   UJ: fooldali app-letoltes szekcio (.bs-home-app) + fejlec App-pirula / mobilpanel kartya
   Terv: design/app-letoltes-terv.html. Torespontok: <=1099 koztes+hamburger, <=767 mobil.
   ====================================================================== */
.bs-nav__app, :where(.bs-site) .bs-nav__app { display: inline-flex; align-items: center; gap: 7px; color: #fff; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; padding: 5px 12px 5px 9px; font-size: 13px; white-space: nowrap; line-height: 1.2; }
.bs-nav__app:hover { color: #fff; border-color: rgba(255,255,255,.45); background: rgba(255,255,255,.08); }
.bs-nav__app svg { width: 15px; height: 15px; color: var(--bs-orange); flex-shrink: 0; }
.bs-panel__app, :where(.bs-site) .bs-panel__app { display: none; }

#app { scroll-margin-top: var(--bs-nav-h); }
.bs-home-app { background: #fff; padding: 112px 24px; overflow: hidden; }
.bs-home-app__in { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: minmax(0,1.04fr) minmax(0,.96fr); grid-template-areas: "head visual" "body visual"; column-gap: 72px; align-items: center; }
.bs-home-app__head { grid-area: head; align-self: end; }
.bs-home-app__body { grid-area: body; align-self: start; }
.bs-home-app__visual { grid-area: visual; }
.bs-app-eyebrow { display: inline-flex; align-items: center; gap: 12px; }
.bs-app-eyebrow img { width: 46px; height: 46px; border-radius: 11px; box-shadow: 0 4px 14px rgba(0,0,0,.18); }
.bs-app-eyebrow b { display: block; font-size: 15px; font-weight: 600; line-height: 1.2; }
.bs-app-eyebrow small { display: block; font-size: 13px; color: var(--bs-muted); }
.bs-home-app h2 { margin: 24px 0 0; font-size: 48px; line-height: 1.08; font-weight: 600; letter-spacing: -.022em; text-wrap: balance; }
.bs-home-app__sub { margin: 16px 0 0; font-size: 21px; line-height: 1.45; color: var(--bs-muted); max-width: 520px; }
.bs-app-list { list-style: none; margin: 36px 0 0; padding: 0; display: grid; gap: 18px; }
.bs-app-list li { display: grid; grid-template-columns: 40px 1fr; gap: 16px; align-items: start; }
.bs-app-list .ic { width: 40px; height: 40px; border-radius: 50%; background: var(--bs-orange-soft); color: var(--bs-orange-ink); display: flex; align-items: center; justify-content: center; }
.bs-app-list .ic svg { width: 20px; height: 20px; }
.bs-app-list b { display: block; font-size: 17px; font-weight: 600; line-height: 1.3; }
.bs-app-list li span:not(.ic) { display: block; font-size: 15px; line-height: 1.45; color: var(--bs-muted); margin-top: 2px; }
.bs-app-get { margin-top: 36px; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.bs-app-badges { display: flex; gap: 10px; flex-wrap: wrap; }
.bs-app-badges a, :where(.bs-site) .bs-app-badges a { display: block; border-radius: 9px; transition: transform .15s; }
.bs-app-badges a:hover { transform: translateY(-1px); }
.bs-app-badges img { height: 48px; width: auto; display: block; }
.bs-app-qr { display: flex; align-items: center; gap: 12px; padding-left: 20px; border-left: 1px solid var(--bs-border); }
.bs-app-qr__code { width: 84px; height: 84px; padding: 6px; background: #fff; border: 1px solid var(--bs-border); border-radius: 12px; display: flex; align-items: center; justify-content: center; box-sizing: border-box; }
.bs-app-qr__code img { width: 70px; height: 70px; display: block; }
.bs-app-qr > span { font-size: 13px; line-height: 1.4; color: var(--bs-muted); max-width: 118px; }
.bs-app-note { margin: 14px 0 0; font-size: 13px; color: var(--bs-muted); }
/* telefon-latvany */
.bs-app-visual { position: relative; height: 620px; }
.bs-app-visual__panel { position: absolute; left: 0; right: 0; bottom: 0; height: 68%; border-radius: 24px; background: var(--bs-orange); overflow: hidden; }
.bs-app-visual__panel::before { content: ""; position: absolute; right: -60px; bottom: -80px; width: 360px; height: 360px; border-radius: 50%; background: rgba(255,255,255,.12); }
.bs-app-visual__panel::after { content: ""; position: absolute; left: -40px; top: -90px; width: 220px; height: 220px; border-radius: 50%; background: rgba(0,0,0,.06); }
.phone { --w: 270px; position: absolute; width: var(--w); padding: calc(var(--w) * .03); background: #0d0d0f; border-radius: calc(var(--w) * .15); box-shadow: 0 30px 60px rgba(0,0,0,.28), 0 0 0 1px rgba(255,255,255,.06) inset; box-sizing: border-box; }
.phone__screen { position: relative; width: 100%; aspect-ratio: 652 / 1424; overflow: hidden; border-radius: calc(var(--w) * .125); background: #000; }
.phone__screen img { width: 100%; height: 100%; object-fit: cover; display: block; }
.phone--front { --w: 272px; right: 12%; top: 0; z-index: 2; }
.phone--back { --w: 236px; left: 6%; top: 70px; transform: rotate(-7deg); z-index: 1; }
.bs-app-toast { position: absolute; z-index: 3; left: 0; top: 300px; width: 300px; display: flex; gap: 12px; align-items: flex-start; background: rgba(255,255,255,.96); border-radius: 18px; padding: 12px 14px; box-shadow: 0 18px 40px rgba(0,0,0,.22); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-sizing: border-box; }
.bs-app-toast img { width: 36px; height: 36px; border-radius: 9px; flex: none; }
.bs-app-toast__txt { flex: 1; min-width: 0; }
.bs-app-toast small { display: flex; justify-content: space-between; font-size: 12px; color: var(--bs-muted); }
.bs-app-toast b { display: block; font-size: 14px; font-weight: 600; line-height: 1.3; margin-top: 1px; }
.bs-app-toast__txt > span { display: block; font-size: 13px; color: #333; line-height: 1.3; }

@media (max-width: 1099px) {
	.bs-nav__app { display: none; }
	.bs-nav__panel .bs-panel__app, :where(.bs-site) .bs-nav__panel .bs-panel__app { display: flex; align-items: center; gap: 12px; margin-top: 14px; padding: 12px 14px; border: 1px solid rgba(255,255,255,.14); border-radius: 14px; color: #fff; font-size: 15px; }
	.bs-panel__app img { width: 36px; height: 36px; border-radius: 9px; flex-shrink: 0; }
	.bs-panel__app span { flex: 1; min-width: 0; }
	.bs-panel__app b { display: block; font-weight: 600; }
	.bs-panel__app small { display: block; color: var(--bs-muted-dark); font-size: 12px; }
	.bs-panel__app i { color: var(--bs-orange-hi); font-size: 22px; }
}
@media (min-width: 768px) and (max-width: 1099px) {
	.bs-home-app__in { column-gap: 40px; }
	.bs-home-app h2 { font-size: 40px; }
}
@media (max-width: 767px) {
	.bs-home-app { padding: 64px 20px 72px; }
	.bs-home-app__in { grid-template-columns: 1fr; grid-template-areas: "head" "visual" "body"; }
	.bs-app-eyebrow img { width: 40px; height: 40px; border-radius: 10px; }
	.bs-home-app h2 { margin-top: 20px; font-size: 32px; line-height: 1.12; }
	.bs-home-app__sub { margin-top: 12px; font-size: 17px; }
	.bs-app-visual { height: 450px; margin-top: 32px; }
	.bs-app-visual__panel { height: 62%; border-radius: 22px; }
	.phone--front { --w: 200px; right: 7%; }
	.phone--back { --w: 172px; left: 4%; top: 52px; }
	.bs-app-toast { left: auto; right: 6px; top: auto; bottom: 22px; width: 236px; padding: 10px 12px; border-radius: 16px; }
	.bs-app-toast img { width: 30px; height: 30px; border-radius: 8px; }
	.bs-app-list { margin-top: 32px; gap: 16px; }
	.bs-app-list b { font-size: 16px; }
	.bs-app-list li span:not(.ic) { font-size: 14px; }
	.bs-app-get { margin-top: 28px; }
	.bs-app-badges { gap: 8px; width: 100%; }
	.bs-app-qr { display: none; }
}

/* bs-home-app: QR a jelvenyek mellett egy sorban (asztal), kozepes savban rejtve */
.bs-app-get { gap: 16px; }
.bs-app-qr { padding-left: 16px; }
.bs-app-qr > span { max-width: 96px; font-size: 12px; }
@media (min-width: 1240px) {
	.bs-app-get { flex-wrap: nowrap; }
	.bs-app-badges { flex-wrap: nowrap; flex: none; }
	.bs-app-qr { flex: none; }
}
@media (min-width: 768px) and (max-width: 1239px) {
	.bs-app-qr { display: none; }
}