/* ==========================================================================
   Lokoinvest.pl — style globalne
   Układ i typografia sekcji są w atrybutach style w HTML (1:1 z projektem).
   Tutaj: fonty (hostowane lokalnie — bez wysyłania danych do Google),
   zmienne, stany hover/focus, menu mobilne, formularz i responsywność.
   ========================================================================== */

/* ---------- Fonty (SIL Open Font License, licencje w /assets/fonts) ---------- */
@font-face {
  font-family: 'Schibsted Grotesk';
  font-style: normal;
  font-display: swap;
  font-weight: 400 900;
  src: url(../fonts/schibsted-grotesk-latin-ext-wght-normal.woff2) format('woff2-variations'),
       url(../fonts/schibsted-grotesk-latin-ext-wght-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Schibsted Grotesk';
  font-style: normal;
  font-display: swap;
  font-weight: 400 900;
  src: url(../fonts/schibsted-grotesk-latin-wght-normal.woff2) format('woff2-variations'),
       url(../fonts/schibsted-grotesk-latin-wght-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(../fonts/geist-mono-latin-ext-400-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(../fonts/geist-mono-latin-400-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(../fonts/geist-mono-latin-ext-500-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(../fonts/geist-mono-latin-500-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- Zmienne i podstawy ---------- */
:root {
  --accent: #2F4DF5;   /* kolor akcentu — zmień tutaj, by przemalować całą stronę */
  --ink: #0E0E0E;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: 'Schibsted Grotesk', 'Helvetica Neue', Arial, sans-serif;
  color: #0E0E0E;
  background: #FFFFFF;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.lk { overflow-x: hidden; }
a { color: #0E0E0E; }
img { max-width: 100%; height: auto; }
[id] { scroll-margin-top: 24px; }

/* ---------- Dostępność ---------- */
.lk-skip {
  position: absolute; left: 16px; top: -80px; z-index: 100;
  padding: 12px 18px; background: #0E0E0E; color: #FFFFFF;
  font-weight: 600; text-decoration: none;
}
.lk-skip:focus { top: 16px; }
.lk a:focus-visible, .lk button:focus-visible, .lk input:focus-visible,
.lk textarea:focus-visible, .lk-skip:focus-visible, .lk [tabindex]:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 3px;
}

/* ---------- Nawigacja ---------- */
.lk-navlink:hover { text-decoration: underline !important; text-decoration-thickness: 2px !important; text-underline-offset: 8px !important; }
.lk-menu[hidden] { display: none !important; }
html.lk-locked, html.lk-locked body { overflow: hidden; }

/* ---------- Przyciski i linki ---------- */
.lk-btn, .lk-btn-inv { transition: background-color .2s ease, color .2s ease, border-color .2s ease; }
.lk-btn svg, .lk-btn-inv svg, .lk-tlink svg { transition: transform .2s ease; }
.lk-btn:hover { background: var(--accent) !important; border-color: var(--accent) !important; color: #FFFFFF !important; }
.lk-btn-inv:hover { background: #0E0E0E !important; border-color: #0E0E0E !important; color: #FFFFFF !important; }
.lk-btn:hover svg, .lk-btn-inv:hover svg, .lk-tlink:hover svg { transform: translateX(4px); }
.lk-tlink:hover { text-decoration-thickness: 2px !important; }
.lk-flink:hover { text-decoration: underline !important; text-underline-offset: 4px; }
.lk-big:hover { text-decoration-color: var(--accent) !important; }

/* Wiersze usług i karty „Zobacz też” */
.lk-row { transition: background-color .25s ease, color .25s ease; }
.lk-row:hover { background: #0E0E0E !important; color: #FFFFFF !important; }
.lk-row:hover .lk-muted { color: #C4C4C0 !important; }
.lk-row .lk-arrow { transition: transform .25s ease, background-color .25s ease, border-color .25s ease; }
.lk-row:hover .lk-arrow { transform: rotate(-45deg); background: var(--accent) !important; border-color: var(--accent) !important; color: #FFFFFF !important; }
.lk-tile { transition: background-color .25s ease; }
.lk-tile:hover { background: var(--accent) !important; }

/* Karty realizacji */
.lk-card .lk-media { transition: transform .5s ease; }
.lk-card:hover .lk-media { transform: scale(1.04); }
.lk-card:hover .lk-card-title { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }

/* Pasek z kanałami (przewijany) */
.lk-marquee { animation: lk-marquee 48s linear infinite; }
.lk-marquee:hover { animation-play-state: paused; }
@keyframes lk-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ---------- Formularz ---------- */
.lk-chip input { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); border: 0; }
.lk-chip span { transition: background-color .15s ease, color .15s ease, border-color .15s ease; }
.lk-chip span:hover { border-color: #0E0E0E !important; }
.lk-chip input:checked + span { background: #0E0E0E !important; color: #FFFFFF !important; border-color: #0E0E0E !important; }
.lk-chip input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.lk-field { border-radius: 0; -webkit-appearance: none; appearance: none; }
.lk-field:focus { border-bottom-color: var(--accent) !important; }
.lk-field::placeholder { color: #8A8A86; }
.lk-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
/* Komunikaty po wysłaniu (adres /kontakt/#wyslano lub #blad) */
.lk-thanks, .lk-error { display: none !important; }
.lk-thanks:target { display: flex !important; }
.lk-thanks:target ~ form { display: none !important; }
.lk-error:target { display: block !important; }

/* ---------- Strona tekstowa (polityka prywatności) ---------- */
.lk-prose h2 { margin: 48px 0 16px; font-size: clamp(24px, 2.4vw, 32px); font-weight: 700; letter-spacing: -0.03em; line-height: 1.15; }
.lk-prose p, .lk-prose li { font-size: 18px; line-height: 1.7; color: #3D3D3B; }
.lk-prose p { margin: 0 0 16px; }
.lk-prose ul { margin: 0 0 16px; padding-left: 22px; }
.lk-prose li { margin-bottom: 8px; }

/* ---------- Responsywność ---------- */
@media (max-width: 1100px) {
  .lk-nav, .lk-header-cta { display: none !important; }
  .lk-burger { display: inline-flex !important; }
}
@media (max-width: 640px) {
  /* lista usług na stronie głównej */
  .lk-svc { column-gap: 16px !important; padding-left: 4px !important; padding-right: 4px !important; }
  .lk-svc > span:nth-child(1) { flex: 0 0 28px !important; }
  .lk-svc > span:nth-child(2) { flex: 1 1 0 !important; min-width: 0; }
  .lk-svc > span:nth-child(3) { flex: 1 1 100% !important; }
  .lk-svc .lk-arrow { display: none !important; }
  /* ciemne paski z kanałami pod nagłówkami podstron */
  .lk-strip { justify-content: flex-start !important; gap: 10px 18px !important; font-size: 12px !important; }
}

/* ---------- Ograniczenie animacji ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .lk-marquee { animation: none; }
  .lk-btn, .lk-btn-inv, .lk-btn svg, .lk-btn-inv svg, .lk-tlink svg, .lk-row, .lk-row .lk-arrow,
  .lk-tile, .lk-card .lk-media, .lk-chip span { transition: none; }
}