/* =====================================================================
   CONSALDI — v6 chrome (topbar + stopka) dla podstron na starym style.css
   Wyizolowane: zmienne rozwinięte do literałów, .wrap zawężony do
   .topbar/.footer, brak globalnych resetów — nie dotyka body podstrony.
   ===================================================================== */

/* ---------- TOPBAR ---------- */
.topbar {
  position: sticky; top: 0; z-index: 80;
  background: color-mix(in srgb, #0e1014 90%, transparent);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border-bottom: 1px solid #282d38;
  color: #f1f1ef;
}
.topbar .wrap { width: 100%; max-width: 1140px; margin-inline: auto; padding-inline: clamp(20px, 5vw, 72px); }
.topbar .topbar-inner { display: flex; align-items: center; gap: 28px; height: 66px; }
.topbar .tb-brand { display: flex; align-items: center; }
.topbar .tb-logo { height: 42px; width: auto; display: block; }
.topbar .tb-nav { display: flex; align-items: center; gap: 24px; margin-left: auto; }
.topbar .tb-nav a { font-size: 13.5px; font-weight: 600; color: #969ba8; text-decoration: none; transition: color .18s; }
.topbar .tb-nav a:hover, .topbar .tb-nav a.active { color: #f1f1ef; }
.topbar .tb-nav .lang { font-family: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: 12px; letter-spacing: .04em; color: #969ba8; }
.topbar .tb-cta { font-size: 13.5px; font-weight: 800; padding: 9px 17px; border-radius: 6px; background: #fef100; color: #14161c; text-decoration: none; display: inline-block; transition: background .18s, transform .18s; }
.topbar .tb-cta:hover { background: #ffe600; transform: translateY(-1px); }
@media (max-width: 980px){ .topbar .tb-nav { display: none; } }

/* ---------- FOOTER ---------- */
.footer { background: #0e1014; color: #f1f1ef; padding-block: clamp(48px, 6vw, 72px) 30px; border-top: 1px solid #282d38; }
.footer .wrap { width: 100%; max-width: 1140px; margin-inline: auto; padding-inline: clamp(20px, 5vw, 72px); }
.footer .footer-top { display: grid; grid-template-columns: 1.5fr 1fr; gap: 40px; align-items: start; padding-bottom: 38px; border-bottom: 1px solid #282d38; }
.footer .footer-brand { display: flex; align-items: center; gap: 16px; }
.footer .footer-logo-img { height: 39px; width: auto; display: block; }
.footer .footer-sub { color: #969ba8; font-size: 13px; margin-top: 8px; }
.footer .footer-desc { color: #969ba8; font-size: 15px; line-height: 1.65; max-width: 56ch; }
.footer .footer-cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; padding-block: 38px; }
.footer .footer-col h4 { font-family: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace; font-weight: 500; letter-spacing: .08em; font-size: 12px; text-transform: uppercase; color: #969ba8; margin: 0 0 16px; }
.footer .footer-col a, .footer .footer-col p { display: block; color: #f1f1ef; font-size: 14.5px; margin-bottom: 10px; text-decoration: none; transition: color .15s; }
.footer .footer-col a:hover { color: #1ec0ff; }
.footer .footer-col .muted { color: #969ba8; }
.footer .footer-bottom { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-top: 26px; flex-wrap: wrap; color: #969ba8; font-size: 13px; }
@media (max-width: 880px){ .footer .footer-top { grid-template-columns: 1fr; } }
@media (max-width: 760px){ .footer .footer-cols { grid-template-columns: 1fr 1fr; } }
.footer .socials { display: flex; gap: 12px; }
.footer .socials a { width: 38px; height: 38px; border: 1px solid #282d38; border-radius: 6px; display: grid; place-items: center; transition: background .2s, color .2s, border-color .2s; }
.footer .socials a:hover { background: #eb008c; color: #fff; border-color: #eb008c; }
.footer .socials svg { width: 17px; height: 17px; }