/* Bristol Taxi — warstwa poza inline'ami z Claude Design.
   Zawiera: dostepnosc, nawigacja mobilna, typografia artykulow, druk.
   Klasy .hvN (stany :hover) sa dopisywane automatycznie przez build.py. */

*,
*::before,
*::after { box-sizing: border-box; }

img { max-width: 100%; }

/* Elementy z inline display:* (jak w eksporcie z designu) ignorowalyby
   atrybut hidden — dlatego wymuszamy go tutaj. */
[hidden] { display: none !important; }

/* --- dostepnosc ---------------------------------------------------------- */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100;
  padding: 12px 18px;
  background: #0e0e0f;
  color: #fff;
  font-weight: 600;
  border-radius: 0 0 10px 0;
}
.skip-link:focus {
  left: 0;
  color: #fff;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
summary:focus-visible,
iframe:focus-visible {
  outline: 3px solid #0e0e0f;
  outline-offset: 2px;
  border-radius: 4px;
}

label:focus-within {
  border-color: #0e0e0f !important;
}

/* --- naglowek ------------------------------------------------------------ */
.burger-bars,
.burger-bars::before,
.burger-bars::after {
  display: block;
  width: 18px;
  height: 2px;
  background: #0e0e0f;
  border-radius: 2px;
  transition: transform .2s ease, opacity .2s ease;
}
.burger-bars::before,
.burger-bars::after {
  content: "";
  position: absolute;
}
.burger-bars::before { transform: translateY(-6px); }
.burger-bars::after { transform: translateY(6px); }
.burger[aria-expanded="true"] .burger-bars { background: transparent; }
.burger[aria-expanded="true"] .burger-bars::before { transform: rotate(45deg); }
.burger[aria-expanded="true"] .burger-bars::after { transform: rotate(-45deg); }
.burger { position: relative; }

.offer-panel,
.mobile-panel { animation: fade .2s ease both; }

/* --- typografia artykulow i stron prawnych ------------------------------- */
.prose h2 { letter-spacing: -0.02em; }
.prose h2:first-child { margin-top: 0 !important; }
.prose p { margin: 0 0 14px; }
.prose p:last-child { margin-bottom: 0; }
.prose a {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.prose ul { margin: 0 0 16px; display: grid; gap: 8px; }
.prose li { padding-left: 18px; position: relative; }
.prose li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent);
}

/* --- formularze ---------------------------------------------------------- */
.bt-form input,
.bt-form textarea {
  font: inherit;
  color: inherit;
}
.bt-form .invalid { border-color: #b3261e !important; }
.bt-form button[disabled] { opacity: .6; cursor: progress; }

/* --- RWD ----------------------------------------------------------------- */
@media (max-width: 1080px) {
  .nav-desktop { gap: 14px; font-size: 14px; }
}

@media (max-width: 980px) {
  .nav-desktop { display: none !important; }
  .offer-panel { display: none !important; }
  .burger { display: inline-flex !important; }
  .head-phone span:not(.burger-bars) { display: inline-block; }
}

@media (max-width: 720px) {
  .topbar { font-size: 11.5px; gap: 10px; }
  .topbar > div:last-child { display: none !important; }
  .head-phone {
    padding: 10px 12px !important;
    font-size: 0 !important;
  }
  .head-phone::after {
    content: "Call";
    font-size: 14.5px;
    font-weight: 600;
  }
}

@media (max-width: 560px) {
  h1 { hyphens: auto; }
  .prose { font-size: 16px !important; }
}

/* --- animacje: szacunek dla preferencji uzytkownika ---------------------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* --- druk ---------------------------------------------------------------- */
@media print {
  .site-head,
  .offer-panel,
  .mobile-panel,
  footer,
  iframe { display: none !important; }
  body { background: #fff; }
  .page { max-width: none !important; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 11px; }
}

/* --- ekrany szersze niz plotno designu (1440 px) -------------------------
   Design zostal zaprojektowany na 1440 px. Zeby na 1920 px i wiecej tla
   sekcji nie konczyly sie w polowie ekranu, plotno rozciaga sie na cala
   szerokosc, a tresc zostaje w kolumnie 1360 px — dokladnie tak jak przy
   1440 px. Klase .bleed dopisuje build.py. */
@media (min-width: 1441px) {
  .page { max-width: none !important; }
  .bleed {
    padding-left: calc((100vw - 1360px) / 2) !important;
    padding-right: calc((100vw - 1360px) / 2) !important;
  }
  .bleed-m {
    margin-left: calc((100vw - 1360px) / 2) !important;
    margin-right: calc((100vw - 1360px) / 2) !important;
  }
}


/* stany :hover przeniesione z Claude Design */
.hv1:hover{filter:brightness(1.08) !important}
.hv2:hover{background:rgba(247,245,241,0.08) !important}
.hv3:hover{transform:translateY(-4px) !important;color:#f7f5f1 !important}
.hv4:hover{transform:translateY(-4px) !important;border-color:rgba(14,14,15,0.3) !important}
.hv5:hover{padding-left:8px !important}
.hv6:hover{background:#2a2a2c !important}
.hv7:hover{border-color:#0e0e0f !important}
.hv8:hover{background:#0e0e0f !important;color:#fff !important}
.hv9:hover{border-color:var(--accent) !important}
.hv10:hover{color:#0e0e0f !important;padding-left:6px !important}
.hv11:hover{padding-left:6px !important}
.hv12:hover{background:rgba(14,14,15,0.08) !important}
.hv13:hover{color:var(--accent) !important}
.hv14:hover{color:#f7f5f1 !important}
.hv15:hover{color:#000 !important}
.hv16:hover{transform:translateY(-3px) !important;border-color:rgba(14,14,15,0.24) !important}
.hv17:hover{transform:translateY(-4px) !important}