/* ============================================================
   PODSTRONA: aluminium-slim-sliding (wersja 2)
   Tylko komponenty, których nie ma we wspólnym adp-v2.css.
   Prefiks .ss- = "slim sliding". Żadnych nowych efektów ruchu:
   wejścia robią wspólne .rv / .rv-open, stan .fx-static obsługuje adp-v2.css.
   ============================================================ */

/* Hero: drugi przycisk obok CTA (wspólny .hero__ctas jest dla hero głównej) */
.ss-ctas{display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin-top:6px}
.ss-ctas .link{color:#fff;border-color:rgba(255,255,255,.4)}

/* Pasek dowodu: komórka tekstowa (showroom), liczba zastąpiona kodem pocztowym */
.ss-proof-txt{letter-spacing:-.03em}

/* Proces w 3 krokach (survey / render / fit): wspólny .process ma 4 kolumny */
.process.ss-process3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:960px){.process.ss-process3{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.process.ss-process3{grid-template-columns:1fr}}

/* Notka pod kartami konfiguracji: dwie opcje bez własnej karty */
.ss-note{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:28px;padding-top:20px;border-top:1px solid var(--line);font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3)}
.ss-note b{font-weight:500;color:var(--text)}

/* Nagłówek nad tabelą spec: nagłówek lewo, lead prawo, jak .sec-head--split */
.ss-spec-foot{margin-top:22px;font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3)}

/* Ta sama rodzina materiału: trzy linki w ramie z hairline (bez zdjęć, bo ich nie ma) */
.ss-next{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);margin-top:clamp(56px,7vw,96px)}
.ss-next__lbl{grid-column:1/-1;padding:18px 0 4px}
.ss-next a{display:grid;gap:6px;padding:22px clamp(16px,2vw,28px) 24px 0;border-right:1px solid var(--line);transition:color var(--t-mid) var(--ease)}
.ss-next a+a{padding-left:clamp(16px,2vw,28px)}
.ss-next a:last-child{border-right:0}
.ss-next a b{font-family:var(--f-display);font-weight:700;font-size:clamp(19px,1.7vw,24px);letter-spacing:-.015em;display:flex;align-items:center;gap:10px}
.ss-next a span{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3)}
.ss-next a .btn__arrow{width:16px;transition:transform var(--t-mid) var(--ease)}
.ss-next a:hover b{color:var(--cyan)}
.ss-next a:hover .btn__arrow{transform:translateX(4px)}
@media(max-width:760px){
  .ss-next{grid-template-columns:1fr}
  .ss-next a,.ss-next a+a{padding-left:0;border-right:0;border-bottom:1px solid var(--line)}
}
@media(prefers-reduced-motion:reduce){.ss-next a .btn__arrow{transition:none}}

/* Hero: <picture> z kadrem mobilnym musi wypełnić .phero__media jak samo <img> */
.phero__media picture{display:block;width:100%;height:100%}
