/* =========================================================
   Svetlý moderný vzhľad podľa bistro.sk (október 2026)
   Svetlé pozadie #fdfdfb, plávajúca biela lišta, hrubé kurzívne
   nadpisy, biele karty s béžovými ikonami, béžová pätička.
   Načítava sa po style.css a prepisuje tmavý body.landing.
   ========================================================= */

body.landing.light {
  --dark: #242e30;
  --dark-soft: #5b6669;
  --gray: #8a8580;
  --gray-light: #f3efe9;
  --line: #ece6dc;
  --bg: #fdfdfb;
  --cream: #f6efe4;
  --sand: #f5e9d8;
  --orange: #f36805;
  --orange-hover: #d95c00;
  --orange-light: #fff1e4;
  --green: #1a8682;
  --green-light: #e5f4f3;
  --shadow: 0 2px 10px rgba(36, 46, 48, 0.06);
  --shadow-lg: 0 18px 40px rgba(36, 46, 48, 0.10);
  background: #fdfdfb;
  color: #242e30;
}

/* ---------- Nadpisy v štýle Bistra: hrubé, kurzíva ---------- */
body.landing.light h1,
body.landing.light .section-title {
  font-style: italic;
  font-weight: 800;
  letter-spacing: -0.02em;
}
body.landing.light .section-title { color: #242e30; font-size: clamp(28px, 3.4vw, 40px); }
body.landing.light #ako .section-title { color: #242e30; }
body.landing.light .section-lead, body.landing.light #ako .section-lead { color: #5b6669; }

/* ---------- Plávajúca biela lišta ---------- */
body.landing.light .site-header {
  position: sticky; top: 12px; z-index: 50;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(36, 46, 48, 0.06);
  box-shadow: 0 8px 28px rgba(36, 46, 48, 0.10);
  margin: 12px 16px 0; border-radius: 999px;
}
body.landing.light .header-login { color: #242e30; border-color: #e3ddd3; background: #fff; }
body.landing.light .nav-toggle { border-color: #e3ddd3; }
body.landing.light .nav-toggle span { background: #242e30; }
body.landing.light .lang-trigger { background: #fff; color: #242e30; border-color: #e3ddd3; }
body.landing.light .logo .logo26-by { color: #8a8580; border-left-color: #e3ddd3; }

/* ---------- Úvod: svetlý s oranžovou kartou kuriéra ---------- */
body.landing.light .hero { background: #fdfdfb; padding: 56px 0 72px; }
body.landing.light .hero::before {
  background: radial-gradient(circle, rgba(243, 104, 5, 0.10) 0%, rgba(243, 104, 5, 0) 70%);
  top: -160px; right: -160px; left: auto;
}
body.landing.light .hero::after { display: none; }
body.landing.light .hero h1 { color: #242e30; font-size: clamp(40px, 5.4vw, 68px); line-height: 1.02; }
body.landing.light .hero h1 .hero-accent { color: #242e30; }
body.landing.light .hero .hero-sub { color: #5b6669; font-size: 18px; max-width: 28em; }
body.landing.light .hero-badge { background: #fff1e4; color: #c65000; border-color: #ffd7b5; }
body.landing.light .hero-badge-dot { background: #1a8682; }
body.landing.light .hero-copy { max-width: 560px; }
body.landing.light .btn-primary { background: #f36805; color: #fff; border-radius: 999px; box-shadow: 0 10px 24px rgba(243, 104, 5, 0.28); }
body.landing.light .btn-primary:hover { background: #d95c00; color: #fff; }
body.landing.light .btn-outline { background: #fff; color: #242e30; border-color: #242e30; border-radius: 999px; }
body.landing.light .btn-outline:hover { border-color: #f36805; color: #f36805; }

body.landing.light .hero-media { display: flex; align-items: center; }
body.landing.light .hero-panel {
  position: relative; width: 100%;
  background: linear-gradient(150deg, #ff8a1f 0%, #f36805 55%, #e05800 100%);
  border-radius: 32px; padding: 40px 28px 30px;
  box-shadow: 0 30px 60px -20px rgba(243, 104, 5, 0.45);
  overflow: hidden;
}
body.landing.light .hero-panel::before {
  content: ""; position: absolute; inset: auto -60px -80px auto; width: 260px; height: 260px;
  border-radius: 50%; background: rgba(255, 255, 255, 0.10);
}
body.landing.light .hero-sticker { color: #fff; text-shadow: 4px 4px 0 #c65000; position: relative; z-index: 1; }
body.landing.light .hero-panel-brand { position: relative; z-index: 1; }

body.landing.light .hero-stats li { background: #fff; border: 1px solid #ece6dc; box-shadow: 0 10px 26px rgba(36, 46, 48, 0.07); border-radius: 18px; }
body.landing.light .hero-stats .stat-value { color: #242e30; }
body.landing.light .hero-stats .stat-label { color: #8a8580; }

/* Animovaný kuriér */
.courier-anim { width: 100%; max-width: 420px; height: auto; display: block; margin: 6px auto 0; position: relative; z-index: 1; overflow: visible; }
.courier-anim .veh { opacity: 0; animation: veh26 12s infinite; }
.courier-anim .veh-2 { animation-delay: 4s; }
.courier-anim .veh-3 { animation-delay: 8s; }
@keyframes veh26 {
  0% { opacity: 0; transform: translateX(-90px); }
  6% { opacity: 1; transform: translateX(0); }
  28% { opacity: 1; transform: translateX(0) translateY(0); }
  30% { transform: translateX(0) translateY(-2px); }
  32% { opacity: 1; transform: translateX(0) translateY(0); }
  37% { opacity: 0; transform: translateX(110px); }
  100% { opacity: 0; transform: translateX(110px); }
}
.courier-anim .wheel { animation: spin26 0.7s linear infinite; }
@keyframes spin26 { to { transform: rotate(360deg); } }
.courier-anim .road-dash { animation: road26 0.8s linear infinite; }
@keyframes road26 { to { stroke-dashoffset: -48; } }
.courier-anim .speed line { animation: speed26 1.2s ease-in-out infinite; }
.courier-anim .speed line:nth-child(2) { animation-delay: .2s; }
.courier-anim .speed line:nth-child(3) { animation-delay: .4s; }
@keyframes speed26 { 0%, 100% { opacity: .2; transform: translateX(10px); } 50% { opacity: 1; transform: translateX(-6px); } }
.courier-caption { position: relative; z-index: 1; width: 100%; height: 28px; margin: 4px 0 6px; text-align: center; }
.courier-caption span { position: absolute; left: 0; right: 0; opacity: 0; color: #fff; font-weight: 800; font-style: italic; font-size: 20px; animation: cap26 12s infinite; }
.courier-caption .c2 { animation-delay: 4s; }
.courier-caption .c3 { animation-delay: 8s; }
@keyframes cap26 { 0% { opacity: 0; } 6%, 30% { opacity: 1; } 36%, 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .courier-anim .veh, .courier-anim .wheel, .courier-anim .road-dash, .courier-anim .speed line, .courier-caption span { animation: none; }
  .courier-anim .veh-1, .courier-caption .c1 { opacity: 1; }
}

/* ---------- Sekcie: svetlé, striedanie bielej a béžovej ---------- */
body.landing.light .section { background: #fdfdfb; border-color: transparent; }
body.landing.light .section-cream, body.landing.light #benefity { background: #f6efe4; }
body.landing.light #benefity .section-title { color: #242e30; }
body.landing.light #benefity .section-lead { color: #5b6669; }

/* Karty: biele, jemný tieň, béžový kruh s ikonou */
body.landing.light .card,
body.landing.light #benefity .card {
  background: #fff; border: 1px solid #efe9df; box-shadow: 0 10px 28px rgba(36, 46, 48, 0.06); border-radius: 18px;
}
body.landing.light .card h3, body.landing.light .benefit-card h3, body.landing.light #benefity .benefit-card h3 { color: #242e30; }
body.landing.light .card p, body.landing.light #benefity .benefit-card p { color: #5b6669; }
body.landing.light .card:hover { border-color: #ffd7b5; box-shadow: 0 16px 36px rgba(36, 46, 48, 0.09); }
body.landing.light .benefit-icon,
body.landing.light .info-icon,
body.landing.light #benefity .benefit-icon {
  background: #f5e9d8; color: #242e30; box-shadow: none; border-radius: 50%; width: 52px; height: 52px; font-size: 24px;
}

/* Kroky */
body.landing.light .step-card { background: transparent; border: 0; box-shadow: none; }
body.landing.light .step-card .step-num { background: #fff; border: 2.5px solid #f36805; color: #f36805; border-radius: 50%; box-shadow: none; }
body.landing.light .step-card h3 { color: #242e30; }
body.landing.light .step-card p { color: #5b6669; }
body.landing.light .step-tag { background: #fff1e4; color: #c65000; }

/* Bonusy */
body.landing.light #bonus-grid .card:first-child { background: linear-gradient(135deg, #ff8a1f 0%, #f36805 100%); border-color: transparent; box-shadow: 0 18px 36px -12px rgba(243, 104, 5, 0.5); }
body.landing.light #bonus-grid .card:first-child h3, body.landing.light #bonus-grid .card:first-child p { color: #fff; }

/* Návod (teasery) */
body.landing.light .teaser-more { color: #f36805; }

/* Mestá */
body.landing.light .city-card { background: #fff; border: 1px solid #ece6dc; box-shadow: none; }
body.landing.light .city-card .city-name { color: #242e30; }
body.landing.light .city-card.city-open { background: #fff; border-color: #bfe3e0; }
body.landing.light .city-card.city-open .city-status { color: #1a8682; }
body.landing.light .city-card.city-open .veh-pill { border-color: #d6ebe9; color: #1f5e5b; background: #f1f9f8; }
body.landing.light .veh-pill { background: #f6f3ee; border-color: #ece6dc; color: #5b6669; }
body.landing.light .city-card.city-closed { background: #faf8f5; }
body.landing.light .city-card.city-closed .city-name { color: #9a958f; }
body.landing.light .city-card.city-closed .soon { background: #f3efe9; color: #8a8580; }
body.landing.light .city-note { color: #8a8580; }

/* Pomoc */
body.landing.light .info-help-card a, body.landing.light #fleet-phone a, body.landing.light #fleet-email a { color: #f36805; }

/* Registračný formulár */
body.landing.light #registracia { background: #f6efe4; }
body.landing.light .form-card { background: #fff; border: 1px solid #efe9df; box-shadow: 0 24px 50px -24px rgba(36, 46, 48, 0.25); border-radius: 26px; }
body.landing.light .field label { color: #242e30; }
body.landing.light .field input,
body.landing.light .field select,
body.landing.light .field textarea { background: #fff; border: 1.5px solid #e3ddd3; color: #242e30; border-radius: 12px; }
body.landing.light .field input:focus,
body.landing.light .field select:focus,
body.landing.light .field textarea:focus { border-color: #f36805; box-shadow: 0 0 0 4px rgba(243, 104, 5, 0.14); outline: none; }
body.landing.light .field input::placeholder, body.landing.light .field textarea::placeholder { color: #a9a39b; }
body.landing.light .vehicle-chip { background: #fff; border-color: #e3ddd3; color: #242e30; }
body.landing.light .vehicle-chip.selected { background: #fff1e4; border-color: #f36805; color: #c65000; box-shadow: 0 0 0 3px rgba(243, 104, 5, 0.12); }
body.landing.light .gdpr label { color: #5b6669; }
body.landing.light .form-error { color: #b11a29; }
body.landing.light .modal { background: #fff; color: #242e30; }

/* Banner termobox */
body.landing.light .section-banner { background: #fdfdfb; }
body.landing.light .thermobox-banner { box-shadow: 0 20px 40px -18px rgba(243, 104, 5, 0.55); }

/* Flotila */
body.landing.light #fleet-grid .card h3 { color: #c65000; }
body.landing.light #fleet-grid .card p { color: #242e30; }

/* FAQ ako na bistro.sk: svetlé riadky */
body.landing.light .faq-item { background: #f6f3ee; border: 0; border-radius: 12px; box-shadow: none; }
body.landing.light .faq-item summary { color: #242e30; }
body.landing.light .faq-answer { color: #5b6669; }

/* Pätička: béžová ako na bistro.sk */
body.landing.light .site-footer { background: #f5e9d8; color: #5b6669; border-top: 0; }
body.landing.light .footer-col h4 { color: #242e30; }
body.landing.light .footer-col a, body.landing.light .footer-col li { color: #3f4a4d; }
body.landing.light .footer-col a:hover { color: #f36805; }
body.landing.light .footer-legal { color: #5b6669; }
body.landing.light .footer-bottom { border-top-color: rgba(36, 46, 48, 0.10); }
body.landing.light #footer-copyright, body.landing.light .footer-admin { color: #8a8580; }

/* Mobil */
@media (max-width: 900px) {
  body.landing.light .hero-copy { max-width: none; }
  body.landing.light .site-header { margin: 8px 10px 0; top: 8px; }
}

/* ===== Doladenie podľa UI UX Pro Max (kontrast, ikony, dotykové plochy) ===== */
body.landing.light { color-scheme: light; --muted-aa: #625d58; }
/* Kontrast ≥ 4,5 : 1 pre malý text */
body.landing.light .hero-stats .stat-label,
body.landing.light .city-note,
body.landing.light #footer-copyright,
body.landing.light .footer-admin,
body.landing.light .city-card.city-closed .soon,
body.landing.light .logo .logo26-by { color: #625d58; }
body.landing.light .city-card.city-closed .city-name { color: #6f6a64; }
body.landing.light .teaser-more,
body.landing.light .info-help-card a,
body.landing.light #fleet-phone a,
body.landing.light #fleet-email a { color: #b84a00; }
body.landing.light .hero-badge { color: #a84300; }

/* Vektorové ikony */
.ico { width: 1em; height: 1em; display: inline-block; vertical-align: -0.15em; flex: none; }
body.landing.light .benefit-icon, body.landing.light .info-icon { color: #c65000; }
body.landing.light .benefit-icon .ico, body.landing.light .info-icon .ico { width: 24px; height: 24px; }
.veh-pill, .vehicle-chip { display: inline-flex; align-items: center; gap: 6px; }
.veh-pill .ico { width: 15px; height: 15px; }
.vehicle-chip .ico { width: 18px; height: 18px; }

/* Dotykové plochy ≥ 44 px a viditeľný fokus */
body.landing.light .vehicle-chip { min-height: 44px; padding: 0 16px; }
body.landing.light .header-login, body.landing.light .nav-toggle, body.landing.light .lang-trigger { min-height: 44px; }
body.landing.light .gdpr input[type="checkbox"] { width: 20px; height: 20px; }
body.landing.light .gdpr label { padding: 6px 0; }
body.landing.light .faq-item summary { min-height: 52px; display: flex; align-items: center; }
body.landing.light a:focus-visible, body.landing.light button:focus-visible, body.landing.light summary:focus-visible,
body.landing.light input:focus-visible, body.landing.light select:focus-visible, body.landing.light textarea:focus-visible {
  outline: 3px solid #f36805; outline-offset: 2px;
}
/* Stav pri stlačení bez posunu rozloženia */
body.landing.light .btn:active, body.landing.light .vehicle-chip:active { transform: none; filter: brightness(0.94); }

/* Odkrývanie sekcií bez pohybu, ak používateľ nechce animácie */
@media (prefers-reduced-motion: reduce) {
  body.landing .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}
/* Textové odkazy: väčšia dotyková plocha bez zmeny vzhľadu */
body.landing.light .teaser-more,
body.landing.light .info-help-card p > a,
body.landing.light #fleet-phone a,
body.landing.light #fleet-email a,
body.landing.light .footer-admin { display: inline-flex; align-items: center; min-height: 44px; }
body.landing.light .info-help-card p { margin-bottom: 0 !important; }

/* ===== Realistické video kuriéra v úvode ===== */
body.landing.light .hero-panel--video {
  padding: 0; min-height: 440px; aspect-ratio: 4 / 4.4; background: #242e30;
  display: block; isolation: isolate;
}
body.landing.light .hero-panel--video::before { display: none; }
body.landing.light .hero-panel--video::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,0.30) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 62%, rgba(243,104,5,0.55) 100%);
}
.hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; z-index: 0; }
body.landing.light .hero-panel--video .hero-sticker {
  position: absolute; z-index: 2; top: 22px; left: 50%; transform: translateX(-50%) rotate(-4deg);
  white-space: nowrap; margin: 0; text-shadow: 3px 3px 0 #c65000, 0 6px 20px rgba(0,0,0,0.25);
}
.hero-video-badge {
  position: absolute; z-index: 2; left: 50%; bottom: 22px; transform: translateX(-50%);
  display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 999px;
  background: rgba(243, 104, 5, 0.92); box-shadow: 0 10px 24px rgba(0,0,0,0.18); white-space: nowrap;
}
.hero-video-badge img { height: 26px; width: auto; display: block; }
.hero-video-badge span { color: #fff; font-weight: 800; font-size: 13px; letter-spacing: 0.04em; }
@media (max-width: 900px) { body.landing.light .hero-panel--video { min-height: 0; aspect-ratio: 4 / 3.6; } }
body.landing.light .hero-panel--video .hero-sticker { left: 22px; right: auto; transform: rotate(-4deg); font-size: clamp(24px, 2.6vw, 34px); }

/* ===== Kontaktný formulár (krok 1), postup, návody, podmienky ===== */
body.landing.light .section-contact { background: #fff8f1; }
.flow-steps { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0 0 22px; }
.flow-steps li { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px 7px 7px; border-radius: 999px; background: #fff; border: 1.5px solid #ece5da; font-size: 14px; font-weight: 600; color: #6b6560; }
.flow-steps li span { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #f1ece4; color: #242e30; font-size: 13px; }
.flow-steps li.is-current { border-color: #f36805; color: #242e30; }
.flow-steps li.is-current span { background: #f36805; color: #fff; }
.hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.contact-done { background: #fff; border: 1.5px solid #f36805; border-radius: 18px; padding: 22px 24px; max-width: 720px; }
.contact-done-title { font-size: 20px; font-weight: 800; color: #242e30; margin: 0 0 6px; }
#contact-form .field textarea { min-height: 90px; width: 100%; padding: 12px 14px; font: inherit; resize: vertical; }
#contact-form .gdpr a, #registracia .gdpr a { color: #d95c00; text-decoration: underline; }
.guide-flow { counter-reset: gf; list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; max-width: 820px; }
.guide-flow li { counter-increment: gf; position: relative; padding: 16px 18px 16px 62px; background: #fff; border: 1.5px solid #ece5da; border-radius: 16px; line-height: 1.55; }
.guide-flow li::before { content: counter(gf); position: absolute; left: 16px; top: 14px; width: 32px; height: 32px; border-radius: 50%; background: #f36805; color: #fff; font-weight: 800; display: grid; place-items: center; }
.doc-guides { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.doc-guide { background: #fff; border: 1.5px solid #ece5da; border-radius: 16px; padding: 18px; }
.doc-guide h3 { margin: 0 0 8px; font-size: 17px; color: #242e30; }
.doc-guide p { margin: 0 0 6px; font-size: 15px; line-height: 1.55; color: #4a4542; }
.doc-where { color: #242e30 !important; }
.legal-text { max-width: 820px; line-height: 1.65; color: #3d3836; }
.legal-text h2 { font-size: 21px; margin: 28px 0 8px; color: #242e30; }
.legal-text ul { padding-left: 20px; }
.legal-text li { margin-bottom: 6px; }
.legal-text a { color: #d95c00; }

#kontakt, #registracia, #doklady, #postup { scroll-margin-top: 96px; }

/* ===== Úvod rozdelený na polovicu: text vľavo, video vpravo cez celú výšku ===== */
body.landing.light .hero.hero-split { padding: 0 0 64px; }
.hero-split-grid { display: grid; grid-template-columns: 1fr 1fr; min-height: clamp(540px, calc(100vh - 110px), 860px); margin-bottom: 40px; }
.hero-split-copy { display: flex; align-items: center; justify-content: flex-end; padding: 48px clamp(28px, 4.5vw, 72px) 48px 24px; }
.hero-split-copy .hero-copy { width: 100%; max-width: 560px; }
.hero-split-media { position: relative; overflow: hidden; background: #242e30; border-radius: 40px 0 0 40px; isolation: isolate; }
.hero-split-media::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,0.28) 0%, rgba(0,0,0,0) 26%, rgba(0,0,0,0) 64%, rgba(243,104,5,0.5) 100%);
}
.hero-split-media .hero-video { object-position: 50% 35%; }
.hero-split-media .hero-sticker { position: absolute; z-index: 2; top: 28px; left: 28px; margin: 0; transform: rotate(-4deg); white-space: nowrap; font-size: clamp(26px, 2.8vw, 40px); text-shadow: 3px 3px 0 #c65000, 0 6px 20px rgba(0,0,0,0.25); }
.hero-split-media .hero-video-badge { left: 28px; bottom: 28px; transform: none; }
.hero-split-media .hero-video-badge img { height: 30px; }
@media (max-width: 900px) {
  .hero-split-grid { grid-template-columns: 1fr; min-height: 0; margin-bottom: 28px; }
  .hero-split-copy { justify-content: flex-start; padding: 28px 20px 24px; }
  .hero-split-media { margin: 0 16px; border-radius: 24px; aspect-ratio: 4 / 4.6; max-height: 72vh; }
  .hero-split-media .hero-sticker { top: 18px; left: 18px; font-size: 26px; }
  .hero-split-media .hero-video-badge { left: 18px; bottom: 18px; }
}

/* Diagonálny rez ako pôvodne na bistro.sk: vpravo video, oranžový pás na hrane */
@media (min-width: 901px) {
  .hero-split-grid { position: relative; overflow: hidden; }
  .hero-split-grid::before {
    content: ""; position: absolute; top: 0; bottom: 0; right: 0; width: calc(50% + 6vw + 18px); z-index: 0;
    background: linear-gradient(160deg, #f79a4d 0%, #ee8434 60%, #e07020 100%);
    clip-path: polygon(18% 0, 100% 0, 100% 100%, 0 100%);
  }
  .hero-split-copy { position: relative; z-index: 2; }
  .hero-split-media { z-index: 1; margin-left: -6vw; border-radius: 0; clip-path: polygon(18% 0, 100% 0, 100% 100%, 0 100%); }
  .hero-split-media .hero-sticker { left: 26%; top: 34px; }
  .hero-split-media .hero-video-badge { left: 10%; bottom: 34px; }
}

/* Kontaktná osoba – vždy viditeľný telefón a e-mail */
.contact-person { max-width: 720px; margin: 16px auto 0; text-align: center; font-size: 15px; color: #4a4542; }
.contact-person a { color: #d95c00; font-weight: 700; text-decoration: none; white-space: nowrap; }
.contact-person a:hover { text-decoration: underline; }

.field-hint { display: block; margin-top: 6px; font-size: 12.5px; line-height: 1.4; color: #6b6560; }