/* =============================================================
   XC Sport Partner — zdieľané štýly (dizajn podľa style-guide.md,
   akcent = značková modrá #005B99 z loga klienta)
   ============================================================= */

/* ---------- Font: Bahnschrift + self-hosted fallback (Barlow, OFL) ---------- */
@font-face { font-family: "Bahnschrift Fallback"; font-style: normal; font-weight: 300; font-display: swap;
  src: url("/assets/fonts/barlow-latin-300.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD; }
@font-face { font-family: "Bahnschrift Fallback"; font-style: normal; font-weight: 300; font-display: swap;
  src: url("/assets/fonts/barlow-latin-ext-300.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Bahnschrift Fallback"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/assets/fonts/barlow-latin-400.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD; }
@font-face { font-family: "Bahnschrift Fallback"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/assets/fonts/barlow-latin-ext-400.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Bahnschrift Fallback"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("/assets/fonts/barlow-latin-700.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD; }
@font-face { font-family: "Bahnschrift Fallback"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("/assets/fonts/barlow-latin-ext-700.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

/* ---------- Tokens & base ---------- */
:root {
  --ease-sine: cubic-bezier(0.39, 0.575, 0.565, 1);
  --ease-io:   cubic-bezier(0.445, 0.05, 0.55, 0.95);
  --ease-cub:  cubic-bezier(0.645, 0.045, 0.355, 1);
  --ease-back: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
html { scroll-behavior: smooth; }
body { font-weight: 300; }
::selection { background: #005B99; color: #fff; }
:focus-visible { outline: 2px solid #005B99; outline-offset: 3px; }

/* ---------- Typo helpers ---------- */
.eyebrow { font-size: 11px; font-weight: 400; letter-spacing: .2em; text-transform: uppercase; }
.display { font-weight: 700; letter-spacing: -0.05em; line-height: 1.05; }
.h2 { font-size: clamp(2rem, 4.2vw, 2.5rem); }
.stat-num { font-size: clamp(1.9rem, 3.5vw, 2.2rem); font-weight: 700; letter-spacing: -0.03em; }

/* ---------- Buttons (BTN-3 zo style-guide, ostré rohy) ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
  font-size: 13px; font-weight: 400; letter-spacing: .18em; text-transform: uppercase;
  padding: 14px 42px; border: 1px solid #005B99; background: #005B99; color: #fff; cursor: pointer;
  transition: background .3s var(--ease-sine), border-color .3s var(--ease-sine), color .3s var(--ease-sine), transform .3s var(--ease-sine); }
.btn:hover { background: #00456F; border-color: #00456F; }
.btn:active { transform: translateY(1px); }
.btn--ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.35); }
.btn--ghost:hover { background: #005B99; border-color: #005B99; color: #fff; }
.btn--ink { background: transparent; color: #0f0f0f; border-color: #0f0f0f; }
.btn--ink:hover { background: #0f0f0f; color: #fff; border-color: #0f0f0f; }

/* ---------- Nav link s podčiarknutím (line sweep) ---------- */
.navlink { position: relative; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; padding: 6px 0;
  color: #0f0f0f; transition: color .3s var(--ease-sine); }
.navlink::after { content: ""; position: absolute; left: 0; bottom: 0; height: 1px; width: 100%;
  background: #005B99; transform: scaleX(0); transform-origin: left center; transition: transform .3s var(--ease-io); }
.navlink:hover, .navlink[aria-current="page"] { color: #005B99; }
.navlink:hover::after, .navlink[aria-current="page"]::after { transform: scaleX(1); }

/* ---------- Loader (column wipe + loaderLine) ---------- */
@keyframes loaderLine { 0% { transform: translateX(-100%); } 99.9% { transform: translateX(100%); } 100% { transform: translateX(-100%); } }
.loader { position: fixed; inset: 0; z-index: 100; display: flex; pointer-events: none; }
.no-js .loader { display: none; }
.loader__col { flex: 1 1 0; background: #0f0f0f; transform: translateY(0); transition: transform .7s var(--ease-io); }
.loader.is-done .loader__col { transform: translateY(-101%); }
.loader.is-done .loader__col:nth-child(1) { transition-delay: 0ms; }
.loader.is-done .loader__col:nth-child(2) { transition-delay: 60ms; }
.loader.is-done .loader__col:nth-child(3) { transition-delay: 120ms; }
.loader.is-done .loader__col:nth-child(4) { transition-delay: 180ms; }
.loader.is-done .loader__col:nth-child(5) { transition-delay: 240ms; }
.loader__bar { position: absolute; top: 0; left: 0; right: 0; height: 2px; overflow: hidden; }
.loader__bar::before { content: ""; position: absolute; inset: 0; background: #005B99; animation: loaderLine 1.1s var(--ease-io) infinite; }
.loader.is-done .loader__bar { display: none; }
.loader__mark { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 11px; letter-spacing: .34em; text-transform: uppercase; opacity: 1; transition: opacity .3s var(--ease-sine); }
.loader.is-done .loader__mark { opacity: 0; }
.is-loading { overflow: hidden; }

/* ---------- Scroll reveal ---------- */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .7s var(--ease-sine), transform .7s var(--ease-sine); transition-delay: var(--d, 0ms); }
.reveal.is-in { opacity: 1; transform: translateY(0); }
.no-js .reveal { opacity: 1; transform: none; }

/* ---------- Hero ---------- */
.vline { width: 2px; background: #005B99; }
@keyframes bounceY { 0% { transform: translateY(0); } 50% { transform: translateY(30%); } 100% { transform: translateY(0); } }
.scroll-hint svg { animation: bounceY 1.6s var(--ease-io) infinite; }

/* ---------- Dlaždice ---------- */
.tile { position: relative; overflow: hidden; display: flex; background: #0f0f0f; }
.tile__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .82;
  transform: scale(1.001); transition: transform .7s var(--ease-io), opacity .7s var(--ease-io); }
.tile:hover .tile__img, .tile:focus-visible .tile__img { transform: scale(1.06); opacity: .6; }
.tile__shade { position: absolute; inset: 0;
  background:
    radial-gradient(120% 55% at 50% 52%, rgba(15,15,15,.5) 0%, rgba(15,15,15,0) 70%),
    linear-gradient(180deg, rgba(15,15,15,.42) 0%, rgba(15,15,15,.28) 45%, rgba(15,15,15,.62) 100%); }
.tile__word { font-size: clamp(2.4rem, 4.6vw, 4.2rem); text-transform: uppercase; text-wrap: balance; }
.tile__line { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; overflow: hidden; }
.tile__line::before { content: ""; position: absolute; inset: 0; background: #005B99; transform: translateX(-100%); }
@keyframes lineSweep { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
.tile:hover .tile__line::before, .tile:focus-visible .tile__line::before { animation: lineSweep .8s var(--ease-io) forwards; }
.tile__mini { display: flex; flex-direction: column; align-items: center; gap: .55rem; }
.tile__mini::after { content: ""; width: 1px; height: 34px; background: rgba(255,255,255,.55); }

/* ---------- Riadky / partneri ---------- */
.rowline { position: relative; }
.rowline::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: #005B99;
  transform: scaleX(0); transform-origin: left center; transition: transform .4s var(--ease-io); }
.rowline:hover::after { transform: scaleX(1); }
.partner { display: flex; align-items: center; justify-content: center; background: #fff; color: #0f0f0f;
  padding: 2rem 1.5rem; min-height: 7rem; transition: background .3s var(--ease-sine); }
.partner:hover { background: #f6f6f6; }
.partner img { max-height: 3.75rem; width: auto; max-width: 100%; object-fit: contain; }

/* ---------- Mobilné menu ---------- */
.mnav { position: fixed; inset: 0; z-index: 80; background: #0f0f0f; display: flex; flex-direction: column;
  justify-content: center; padding: 2rem; visibility: hidden; opacity: 0; transition: opacity .4s var(--ease-sine), visibility 0s linear .4s; }
.mnav.is-open { visibility: visible; opacity: 1; transition-delay: 0s; }
.mnav__item { opacity: 0; transform: translateY(18px); transition: opacity .3s var(--ease-io), transform .3s var(--ease-io); }
.mnav.is-open .mnav__item { opacity: 1; transform: translateY(0); }
.mnav.is-open .mnav__item:nth-child(1) { transition-delay: .10s; }
.mnav.is-open .mnav__item:nth-child(2) { transition-delay: .16s; }
.mnav.is-open .mnav__item:nth-child(3) { transition-delay: .22s; }
.mnav.is-open .mnav__item:nth-child(4) { transition-delay: .28s; }
.mnav.is-open .mnav__item:nth-child(5) { transition-delay: .34s; }

/* ---------- Dropdown ---------- */
.dd { position: relative; }
.dd__panel { position: absolute; top: 100%; left: 50%; transform: translate(-50%, 8px); background: #fff;
  border: 1px solid #ebebeb; box-shadow: 0 18px 40px rgba(15,15,15,.08); min-width: 240px; padding: .5rem 0;
  opacity: 0; visibility: hidden; transition: opacity .3s var(--ease-sine), transform .3s var(--ease-sine), visibility 0s linear .3s; }
.dd:hover .dd__panel, .dd:focus-within .dd__panel, .dd.is-open .dd__panel {
  opacity: 1; visibility: visible; transform: translate(-50%, 0); transition-delay: 0s; }

/* ---------- Cookie lišta ---------- */
.cookiebar { position: fixed; z-index: 90; left: 1rem; right: 1rem; bottom: 1rem; max-width: 460px;
  background: #0f0f0f; color: #fff; border-top: 2px solid #005B99; padding: 1.5rem;
  transform: translateY(calc(100% + 2rem)); transition: transform .5s var(--ease-back); }
.cookiebar.is-visible { transform: translateY(0); }
.ck-toggle { position: relative; width: 40px; height: 22px; border-radius: 4em; background: #667481; cursor: pointer;
  transition: background .25s var(--ease-sine); flex: none; appearance: none; }
.ck-toggle:checked { background: #005B99; }
.ck-toggle::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%;
  background: #fff; transition: transform .25s var(--ease-io); }
.ck-toggle:checked::after { transform: translateX(18px); }
.ck-toggle:disabled { background: #d5dee2; cursor: not-allowed; }

/* ---------- Kontaktný formulár ---------- */
.f-label { display: block; font-size: 11px; font-weight: 400; letter-spacing: .18em; text-transform: uppercase; color: #949494; margin-bottom: 8px; }
.f-input { width: 100%; border: 1px solid #ebebeb; background: #fff; padding: 13px 16px; font-size: 15px;
  font-family: inherit; color: #0f0f0f; transition: border-color .3s var(--ease-sine); }
.f-input:focus { outline: none; border-color: #005B99; }
.pill-wrap { display: block; }
.pill { display: flex; align-items: center; justify-content: center; gap: .5rem; border: 1px solid #ebebeb;
  padding: 15px 18px; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; text-align: center;
  cursor: pointer; color: #0f0f0f; transition: background .3s var(--ease-sine), border-color .3s var(--ease-sine), color .3s var(--ease-sine); }
.pill:hover { border-color: #005B99; color: #005B99; }
.pill-wrap input:checked + .pill { background: #005B99; border-color: #005B99; color: #fff; }
.pill-wrap input:focus-visible + .pill { outline: 2px solid #005B99; outline-offset: 3px; }
/* Honeypot — vizuálne aj pre čítačky neexistuje, boti ho vyplnia */
.hp-field { position: absolute !important; left: -9999px !important; top: auto !important;
  width: 1px !important; height: 1px !important; overflow: hidden !important; }
#cf-status.is-ok { color: #005B99; }
#cf-status.is-err { color: #c81e3c; }

/* ---------- Tabuľka zmlúv ---------- */
.ztable th { font-size: 11px; font-weight: 400; letter-spacing: .2em; text-transform: uppercase; color: #949494; text-align: left; padding: 1rem 1.2rem; }
.ztable td { padding: 1.35rem 1.2rem; border-top: 1px solid #ebebeb; font-size: 15px; vertical-align: top; }
.ztable tbody tr { transition: background .3s var(--ease-sine); }
.ztable tbody tr:hover { background: #f6f6f6; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .loader { display: none !important; }
  .reveal { opacity: 1 !important; transform: none !important; }
  .cookiebar { transition: none; }
}