/* rama.css - naglowek i stopka serwisu dla stron statycznych. Etap 2, pilot 3.1 (11.09.2026).
   Zrodlo: CSS ramy ze strony glownej /index.html (produkcja 10.09.2026), regula po regule, w tej samej kolejnosci.
   Zmiany wzgledem zrodla - tylko techniczne, wyglad ma byc identyczny:
   - kazdy selektor zawezony do .site-header / .site-footer (klasy .btn, .container, .nav wystepuja tez w tresci stron);
     reguly, ktore na stronie glownej trafiaja w oba miejsca (.logo, .logo em), maja oba zawezenia;
   - to, co na stronie glownej rama dziedziczy z body i regul globalnych (font, wielkosc, interlinia, box-sizing,
     img, a), zapisane jawnie na ramie;
   - barwy wylacznie tokenami z tokens.css, bez zapasowych literalow w var();
   - zbroja !important wg docs/ZBROJA-IMPORTANT.md: color i text-decoration w ramie, display tylko w @media.
   Plik laczony na koncu <head>, po stylach strony. */

.site-header,.site-footer{font-family:var(--font-ui);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.site-header{color:var(--ink)}
.site-header,.site-header *,.site-header ::before,.site-header ::after,.site-footer,.site-footer *,.site-footer ::before,.site-footer ::after{box-sizing:border-box}
.site-header img,.site-footer img{max-width:100%;height:auto;display:block}
.site-header a,.site-footer a{color:inherit;text-decoration:none}
.site-header .container,.site-footer .container{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.site-header .sr-only{position:absolute;left:0;top:0;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.site-header .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;font:inherit;font-weight:600;border-radius:var(--r-pill);padding:15px 28px;border:1px solid transparent;position:relative;isolation:isolate;transition:transform .15s ease,box-shadow .2s ease,background .2s ease}
.site-header .btn:active{transform:scale(.98)}
.site-header .btn:focus-visible{outline:2px solid var(--fiber-deep);outline-offset:3px}
.site-header .btn-primary{background:transparent;color:var(--bg-white);font-weight:700;border-color:transparent;text-shadow:var(--btn-primary-text-shadow);box-shadow:var(--btn-primary-shadow)}
.site-header .btn-primary::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-2;pointer-events:none;background:var(--btn-primary-rim);border:1px solid var(--btn-primary-rim-border)}
.site-header .btn-primary::after{content:"";position:absolute;inset:5px;border-radius:inherit;z-index:-1;pointer-events:none;background:var(--btn-primary-fill);box-shadow:var(--btn-primary-fill-shadow)}
.site-header .btn-primary:hover{transform:translateY(-2px);box-shadow:var(--btn-primary-shadow-hover)}
.site-header .btn-primary:hover::after{filter:brightness(1.06)}

.site-header{position:sticky;top:0;z-index:90;background:var(--header-bg);border-bottom:1px solid var(--glass-border)}
@supports (backdrop-filter:blur(12px)){.site-header{backdrop-filter:blur(12px);background:var(--header-bg-blur)}}
.site-header .header-in{display:flex;align-items:center;justify-content:space-between;gap:18px;height:68px}
.site-header .logo,.site-footer .logo{display:flex;align-items:baseline;gap:7px;font-size:19px;font-weight:700;letter-spacing:-.01em}
.site-header .logo em,.site-footer .logo em{font-family:var(--font-accent);font-style:italic;font-weight:400;color:var(--fiber-strong)}
.site-header .nav{display:flex;gap:26px;font-size:14.5px;color:var(--ink-soft)}
.site-header .nav a:hover{color:var(--fiber-strong)}
.site-header .header-cta{display:flex;align-items:center;gap:14px}
.site-header .tel-link{display:inline-flex;align-items:center;gap:8px;font-weight:650;font-size:15px;color:var(--ink)}
.site-header .tel-link svg{color:var(--fiber)}
.site-header .nav-toggle{display:none}

.site-footer{background:var(--bg-white);border-top:1px solid var(--glass-border);padding:46px 0 30px;font-size:14px;color:var(--ink-soft)}
.site-footer .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:26px;margin-bottom:30px}
.site-footer .footer-grid .fh{font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-mute);margin:0 0 12px}
.site-footer .footer-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.site-footer .footer-grid a:hover{color:var(--fiber-strong)}
.site-footer .footer-bottom{border-top:1px solid var(--glass-border);padding-top:18px;display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;font-size:12.5px;color:var(--ink-mute)}
.site-footer .footer-trademarks{border-top:1px solid var(--glass-border);margin-top:22px;padding-top:16px;font-size:11px;line-height:1.6;color:var(--ink-mute);max-width:980px}
.site-footer .footer-trademarks strong{color:var(--ink-soft);font-weight:600}

@media (max-width:980px){
.site-footer .footer-grid{grid-template-columns:1fr 1fr}
.site-header{position:relative;z-index:100}
.site-header .nav{display:none}
.site-header .header-cta .btn{display:none}
.site-header .header-cta{gap:10px}
.site-header .nav-toggle{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;background:0 0;border:1px solid var(--glass-border);border-radius:var(--r-sm);cursor:pointer;color:var(--ink)}
.site-header .nav.open{display:grid;position:absolute;top:68px;left:0;right:0;background:var(--bg-white);padding:18px 22px;gap:14px;border-bottom:1px solid var(--glass-border);box-shadow:var(--shadow-glass)}
}
@media (max-width:640px){.site-header .header-in{height:58px}}

.site-header .telv{gap:8px}
.site-header .telv svg{width:20px;height:20px;color:var(--fiber-strong)}
.site-header .telv .telv-t{display:flex;flex-direction:column;line-height:1.18}
.site-header .telv small{font-size:12.5px;font-weight:700;color:var(--telv-label);white-space:nowrap;letter-spacing:.1px}
.site-header .telv b{font-size:21px;font-weight:800;letter-spacing:.2px;color:var(--fiber-strong);white-space:nowrap}
.site-header .nav{gap:18px}
.site-header .nav a,.site-header .header-cta .btn{white-space:nowrap}
@media (max-width:1365px){.site-header .telv small{display:none}.site-header .telv b{font-size:17px}}
@media (max-width:980px){.site-header .header-cta .tel-link{display:none!important}}

/* zbroja: barwy i podkreslenia ramy niezalezne od regul tresci strony (a{...}, a:hover{...}, p{...}) */
.site-header a,.site-footer a{text-decoration:none!important}
.site-header .logo{color:var(--ink)!important}
.site-header .logo em,.site-footer .logo em{color:var(--fiber-strong)!important}
.site-header .nav a{color:var(--ink-soft)!important}
.site-header .nav a:hover{color:var(--fiber-strong)!important}
.site-header .tel-link{color:var(--ink)!important}
.site-header .telv svg,.site-header .telv b{color:var(--fiber-strong)!important}
.site-header .telv small{color:var(--telv-label)!important}
.site-header .btn-primary{color:var(--bg-white)!important}
@media (max-width:980px){.site-header .nav-toggle{color:var(--ink)!important}}
.site-footer a,.site-footer p{color:inherit!important}
.site-footer .footer-grid a:hover{color:var(--fiber-strong)!important}
.site-footer .footer-grid .fh{color:var(--ink-mute)!important}
.site-footer .footer-trademarks strong{color:var(--ink-soft)!important}
