/* StalVibe — wspólne style (system: len/greige + ink + terakota, Schibsted Grotesk) */
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; padding: 0; background: #ECEAE4; }
body { font-family: 'Schibsted Grotesk', sans-serif; color: #1B1A17; overflow-x: hidden; -webkit-font-smoothing: antialiased; }
::selection { background: #B85C3B; color: #FCF5EF; }
img { display: block; }

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid #B85C3B; outline-offset: 2px; border-radius: 4px;
}

.sv-skip { position: absolute; left: -9999px; top: 0; background: #1B1A17; color: #ECEAE4; padding: 10px 16px; z-index: 100; }
.sv-skip:focus { left: 12px; top: 12px; }

/* nawigacja */
.sv-nav-link { color: #57544D; text-decoration: none; transition: color .2s; }
.sv-nav-link:hover { color: #B85C3B; }
.sv-nav-link.sv-active { color: #1B1A17; font-weight: 700; }

/* przyciski */
.sv-btn-accent { background: #B85C3B; color: #FCF5EF; transition: background .25s; }
.sv-btn-accent:hover { background: #C96B49; }
.sv-btn-dark { background: #1B1A17; color: #ECEAE4; transition: background .25s; }
.sv-btn-dark:hover { background: #34322C; }
.sv-btn-outline { background: transparent; color: #1B1A17; border: 1px solid rgba(27,26,23,0.22); transition: border-color .25s; }
.sv-btn-outline:hover { border-color: #1B1A17; }
.sv-btn-outline-light { background: transparent; color: #ECEAE4; border: 1px solid rgba(255,255,255,0.28); transition: border-color .25s; }
.sv-btn-outline-light:hover { border-color: #ECEAE4; }

/* linki */
.sv-link-accent { color: #B85C3B; text-decoration: none; font-weight: 600; }
.sv-link-accent:hover { text-decoration: underline; }
.sv-link-underline { color: #1B1A17; text-decoration: none; font-weight: 600; border-bottom: 2px solid #B85C3B; padding-bottom: 2px; transition: color .2s; }
.sv-link-underline:hover { color: #B85C3B; }
.sv-footer-link { color: #847F75; text-decoration: none; transition: color .2s; }
.sv-footer-link:hover { color: #E2A488; }
.sv-phone-tile { transition: border-color .25s; }
.sv-phone-tile:hover { border-color: rgba(184,92,59,0.7) !important; }
.sv-real-cta { transition: border-color .2s, color .2s; }
.sv-real-cta:hover { border-color: #E2A488 !important; color: #E2A488 !important; }
@media (max-width: 600px) {
  [data-dot-label] { display: none; }
}

/* telefon w headerze (życzenie klienta: stale widoczny numer u góry).
   Kontener headera ma max 1280px - pełna etykieta "Jak przygotować się na dostawę"
   wraz z telefonem i CTA nie mieści się w jednym wierszu na żadnej szerokości,
   więc w nawigacji zawsze używamy wersji skróconej. */
.sv-header-phone { transition: border-color .2s; }
.sv-header-phone:hover { border-color: #B85C3B; }
.sv-nav-full { display: none; }
.sv-nav-short { display: inline; }
@media (max-width: 480px) {
  .sv-header-phone { padding: 10px 12px !important; }
  .sv-btn-accent.sv-header-cta { padding: 11px 16px !important; font-size: 14px !important; }
}

/* karty i obrazy */
.sv-card-hover { transition: border-color .25s, transform .25s; }
.sv-card-hover:hover { border-color: #B85C3B !important; transform: translateY(-3px); }
.sv-img-zoom img { transition: transform .45s ease; }
.sv-img-zoom:hover img { transform: scale(1.05); }

/* formularze */
.sv-input { width: 100%; font-family: inherit; font-size: 16px; color: #1B1A17; background: #ECEAE4; border: 1.5px solid rgba(27,26,23,0.16); border-radius: 6px; padding: 13px 14px; transition: border-color .2s; }
.sv-input:focus { outline: none; border-color: #B85C3B; }
select.sv-input { appearance: none; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2357544D' stroke-width='2'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 38px; }
.sv-label { display: block; font-size: 13.5px; font-weight: 600; color: #45433D; margin-bottom: 7px; }
.sv-check { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.5; color: #57544D; cursor: pointer; }
.sv-check input { width: 18px; height: 18px; margin-top: 1px; accent-color: #B85C3B; flex-shrink: 0; }

/* pola wyboru typu (karty) */
.sv-pick { text-align: left; cursor: pointer; background: #ECEAE4; border: 1.5px solid rgba(27,26,23,0.14); border-radius: 8px; padding: 14px 16px; font-family: inherit; transition: border-color .2s, background .2s; }
.sv-pick.sv-on { border-color: #B85C3B; background: #FBEFE7; }

/* ikony liniowe kategorii (zestaw z designu: StalVibe-Ikony) */
.sv-ic .s { fill: none; stroke: #1B1A17; stroke-width: 4; stroke-linejoin: round; stroke-linecap: round; }
.sv-ic .g { stroke: #B85C3B; }
.sv-ic .gr { stroke: #7BA05B; stroke-width: 5; }
.sv-ic-dark .s { stroke: #EDE7DB; }

/* komunikaty formularzy */
.sv-feedback { border-radius: 8px; padding: 13px 16px; font-size: 14.5px; line-height: 1.5; margin-top: 14px; }
.sv-feedback-error { background: #F7E5DC; color: #8A3B1F; border: 1px solid rgba(184,92,59,0.4); }
.sv-feedback-success { background: #EAF0E2; color: #44612C; border: 1px solid rgba(123,160,91,0.5); }