/*
 * Motyw „Montaż – przemysł” – TK.W CMS
 * Autor: Tomasz Skubela <skubelat@gmail.com>
 *
 * Warstwa wyglądu nakładana na style motywu Domyślnego (ładowane wcześniej).
 * Charakter: granat stalowy, niebieski akcent, kroje Barlow, ścięte narożniki,
 * cienka siatka techniczna na ciemnych sekcjach. Układ i działanie bloków
 * są wspólne z motywem Domyślnym, więc każdy nowy blok ma style od razu.
 *
 * Kontrasty (WCAG 2.1 AA) dla domyślnej palety:
 *   tekst #1b2836 na #fff ........ 15,0:1
 *   niebieski #1a5fc0 na #fff .... 6,1:1  (biały na niebieskim: 6,1:1)
 *   granat #0f2137 na #fff ....... 16,2:1
 *   jasny niebieski #6db8ff na #0a1727 ... 8,5:1
 *   tekst słaby #4a5a6b na #fff .. 7,1:1
 */

:root {
    --kolor-glowny: #1a5fc0;
    --kolor-glowny-ciemny: #1656b0;
    --kolor-granat: #0f2137;
    --kolor-akcent: #6db8ff;
    --kolor-tekst: #1b2836;
    --kolor-tekst-slaby: #4a5a6b;
    --kolor-tlo: #ffffff;
    --kolor-tlo-jasne: #f2f5f8;
    --kolor-tlo-ciemne: #0a1727;
    --kolor-obramowanie: #d9e0e8;
    --kolor-stal: #8796a8;
    --kolor-menu-rozwijane: #0f2137;
    --promien: 2px;
    --szerokosc: 1240px;
    --rozmiar-bazowy: 17px;
    --cien: 0 1px 2px rgba(15, 33, 55, .05), 0 8px 24px rgba(15, 33, 55, .07);
    --cien-mocny: 0 20px 48px rgba(15, 33, 55, .18);
    --font-naglowki: var(--font);
    --mt-sciecie: 14px;
    --mt-przejscie: .22s cubic-bezier(.2, .6, .2, 1);
    --mt-siatka: repeating-linear-gradient(0deg, rgba(255, 255, 255, .045) 0 1px, transparent 1px 44px),
                 repeating-linear-gradient(90deg, rgba(255, 255, 255, .045) 0 1px, transparent 1px 44px);
}

/* --------------------------------------------------------------- podstawy */

body { line-height: 1.65; color: var(--kolor-tekst); }

h1, h2, h3, h4, h5,
.mt-logo__l1, .tkw-liczba__licznik, .tkw-pakiet__cena, .tkw-odliczanie__liczba {
    font-family: var(--font-naglowki);
    color: var(--kolor-granat);
}
h1, h2, h3, h4 { font-weight: 700; line-height: 1.1; letter-spacing: .005em; }
h1, h2 { text-transform: uppercase; }
h1 { font-size: clamp(2.3rem, 5vw, 3.8rem); }
h2 { font-size: clamp(1.9rem, 3.6vw, 2.75rem); }
h3 { font-size: 1.5rem; line-height: 1.2; }
h4 { font-size: 1.2rem; }

a { color: var(--kolor-glowny); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--kolor-glowny-ciemny); text-decoration-thickness: 2px; }

::selection { background: var(--kolor-glowny); color: #fff; }

blockquote { border-left: 4px solid var(--kolor-glowny); }
hr { border-top-color: var(--kolor-obramowanie); }

:focus-visible { outline: 3px solid var(--kolor-glowny); outline-offset: 3px; border-radius: 2px; }
.tkw-tlo--ciemne :focus-visible, .mt-stopka :focus-visible, .mt-pasek :focus-visible, .mt-tytul :focus-visible,
.tkw-menu__podmenu :focus-visible, .tkw-baner :focus-visible, .tkw-blok--obraz-tla :focus-visible {
    outline-color: var(--kolor-akcent);
}
.tkw-main:focus { outline: none; }

.mt-sr {
    position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

.tkw-pomin { background: var(--kolor-granat); color: #fff; font-weight: 600; text-decoration: none; }
.tkw-pomin:focus { left: 0; outline-color: var(--kolor-akcent); }
.mt-pomin-menu:focus { left: 180px; }

/* ---------------------------------------------------------- pasek górny */

.mt-pasek { background: var(--kolor-tlo-ciemne); color: #c4cfdb; font-size: .9rem; letter-spacing: .01em; }
.mt-pasek__wnetrze { display: flex; align-items: center; gap: 24px; min-height: 42px; flex-wrap: wrap; }
.mt-pasek__haslo {
    margin: 0; display: inline-flex; align-items: center; gap: 10px;
    font-family: var(--font-naglowki); font-weight: 600; text-transform: uppercase; letter-spacing: .12em; font-size: .85rem;
}
.mt-pasek__znacznik { width: 8px; height: 8px; background: var(--kolor-akcent); display: inline-block; }
.mt-pasek__odstep { flex: 1 1 auto; }
.mt-pasek__pozycja { display: inline-flex; align-items: center; gap: 8px; color: #fff; text-decoration: none; white-space: nowrap; }
.mt-pasek__pozycja svg { color: var(--kolor-akcent); }
.mt-pasek__pozycja:hover { color: var(--kolor-akcent); text-decoration: underline; }

/* ---------------------------------------------------------------- nagłówek */

.mt-naglowek { background: var(--kolor-tlo); border-bottom: 1px solid var(--kolor-obramowanie); }
.mt-naglowek.jest-przewiniety { box-shadow: 0 8px 28px rgba(15, 33, 55, .12); border-bottom-color: transparent; }
.mt-naglowek .tkw-naglowek__wnetrze { min-height: 88px; gap: 24px; }

.mt-logo { gap: 13px; text-decoration: none; color: var(--kolor-granat); align-items: center; }
.mt-logo:hover { text-decoration: none; }
.mt-logo__znak { width: 50px; height: auto; flex: 0 0 50px; }
.mt-logo__obraz { max-height: 60px; width: auto; }
.mt-logo__tekst { display: grid; line-height: 1; }
.mt-logo__l1 {
    font-family: var(--font-naglowki); font-weight: 700; font-size: 2rem; letter-spacing: .04em; color: var(--kolor-granat);
    text-transform: uppercase;
}
.mt-logo__l2 {
    font-family: var(--font-naglowki); font-size: .82rem; font-weight: 600; text-transform: uppercase;
    letter-spacing: .27em; color: var(--kolor-glowny); margin-top: 5px;
}

/* Menu: wersaliki w kroju Barlow, pod aktywną pozycją niebieska belka */
.mt-naglowek .tkw-menu { gap: 2px; align-items: center; }
.mt-naglowek .tkw-menu > .tkw-menu__pozycja { display: flex; align-items: center; }
.mt-naglowek .tkw-menu__pozycja > a {
    position: relative; border-radius: 0; padding: 14px 13px; color: var(--kolor-granat);
    font-family: var(--font-naglowki); font-size: 1.12rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em;
    text-decoration: none; background: none; white-space: nowrap;
}
.mt-naglowek .tkw-menu > .tkw-menu__pozycja > a::after {
    content: ''; position: absolute; left: 13px; right: 13px; bottom: 5px; height: 3px;
    background: var(--kolor-glowny); transform: scaleX(0); transform-origin: left; transition: transform var(--mt-przejscie);
}
.mt-naglowek .tkw-menu > .tkw-menu__pozycja > a:hover { color: var(--kolor-glowny); background: none; }
.mt-naglowek .tkw-menu > .tkw-menu__pozycja > a:hover::after { transform: scaleX(1); }
.mt-naglowek .tkw-menu > .tkw-menu__pozycja.jest-aktywna > a { color: var(--kolor-glowny); }
.mt-naglowek .tkw-menu > .tkw-menu__pozycja.jest-aktywna > a::after { transform: scaleX(1); }
.mt-naglowek .tkw-menu > .ma-podmenu > a { padding-right: 4px; }
.mt-naglowek .tkw-menu > .ma-podmenu > a::after { right: 4px; }

.mt-naglowek .tkw-menu__rozwin {
    display: inline-flex; position: relative; width: 26px; height: 34px; border: 0; background: none; cursor: pointer;
    color: var(--kolor-granat); padding: 0; margin-right: 4px; border-radius: 2px;
}
.mt-naglowek .tkw-menu__rozwin::before {
    content: ''; position: absolute; top: 12px; left: 9px; width: 7px; height: 7px;
    border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
    transform: rotate(45deg); transition: transform var(--mt-przejscie);
}
.mt-naglowek .tkw-menu__rozwin[aria-expanded="true"]::before { transform: rotate(225deg); top: 15px; }

.mt-naglowek .tkw-menu__podmenu {
    top: calc(100% + 2px); left: 0; min-width: 330px; padding: 6px 0; border: 0; border-radius: 0;
    background: var(--kolor-menu-rozwijane); box-shadow: 0 24px 48px rgba(6, 12, 22, .35);
    border-top: 3px solid var(--kolor-glowny);
}
.mt-naglowek .tkw-menu__pozycja.jest-rozwinieta > .tkw-menu__podmenu { opacity: 1; visibility: visible; transform: none; }
.mt-naglowek .tkw-menu__podmenu .tkw-menu__pozycja + .tkw-menu__pozycja { border-top: 1px solid rgba(255, 255, 255, .07); }
.mt-naglowek .tkw-menu__podmenu a {
    color: #e6ecf3; padding: 13px 22px; border-radius: 0; font-size: 1rem; text-decoration: none; display: block;
    font-family: var(--font); text-transform: none; letter-spacing: 0; font-weight: 500;
    transition: background var(--mt-przejscie), padding var(--mt-przejscie), color var(--mt-przejscie);
}
.mt-naglowek .tkw-menu__podmenu a { white-space: normal; line-height: 1.35; }
.mt-naglowek .tkw-menu__podmenu { max-width: min(440px, 92vw); }
.mt-naglowek .tkw-menu__podmenu a::after { display: none; }
.mt-naglowek .tkw-menu__podmenu a:hover,
.mt-naglowek .tkw-menu__podmenu a:focus-visible { background: rgba(109, 184, 255, .1); color: #fff; padding-left: 28px; }
.mt-naglowek .tkw-menu__podmenu .jest-aktywna > a { color: var(--kolor-akcent); font-weight: 600; }
.mt-naglowek .tkw-menu__podmenu .tkw-menu__rozwin { display: none; }

.mt-szukaj-przycisk {
    width: 44px; height: 44px; display: grid; place-items: center; border-radius: 2px;
    border: 1px solid var(--kolor-obramowanie); background: var(--kolor-tlo); color: var(--kolor-granat); cursor: pointer;
    transition: background var(--mt-przejscie), color var(--mt-przejscie), border-color var(--mt-przejscie);
}
.mt-szukaj-przycisk:hover, .mt-szukaj-przycisk[aria-expanded="true"] { background: var(--kolor-granat); color: #fff; border-color: var(--kolor-granat); }
.mt-szukaj-panel { border-top: 1px solid var(--kolor-obramowanie); background: var(--kolor-tlo-jasne); padding: 18px 0; }
.mt-szukaj, .mt-szukaj-mobilne { display: flex; gap: 10px; }
.mt-szukaj input, .mt-szukaj-mobilne input {
    flex: 1 1 auto; min-width: 0; font: inherit; padding: 12px 16px; border: 1px solid #98a6b6; border-radius: var(--promien);
    background: #fff; color: var(--kolor-tekst);
}
.mt-szukaj-mobilne { display: none; }

.tkw-hamburger { color: var(--kolor-granat); border-color: var(--kolor-obramowanie); width: 46px; height: 46px; border-radius: 2px; }

/* ---------------------------------------------------------------- przyciski */

.tkw-przycisk {
    border-radius: var(--promien); padding: 14px 28px; font-family: var(--font-naglowki); font-weight: 700; font-size: 1.1rem;
    letter-spacing: .08em; text-transform: uppercase; text-decoration: none; border-width: 2px;
}
.tkw-przycisk:hover { text-decoration: none; }
.tkw-przycisk--glowny { background: var(--kolor-glowny); border-color: var(--kolor-glowny); color: #fff; }
.tkw-przycisk--glowny:hover { background: var(--kolor-glowny-ciemny); border-color: var(--kolor-glowny-ciemny); color: #fff; }
.tkw-przycisk--obrys { background: transparent; border-color: var(--kolor-granat); color: var(--kolor-granat); }
.tkw-przycisk--obrys:hover { background: var(--kolor-granat); border-color: var(--kolor-granat); color: #fff; }
.tkw-przycisk--jasny { background: #fff; border-color: #fff; color: var(--kolor-granat); }
.tkw-przycisk--jasny:hover { background: var(--kolor-akcent); border-color: var(--kolor-akcent); color: var(--kolor-granat); }
.tkw-przycisk--tekstowy { color: var(--kolor-glowny); padding-left: 0; padding-right: 0; text-decoration: underline; text-underline-offset: 5px; }
.tkw-tlo--ciemne .tkw-przycisk--obrys, .tkw-blok--obraz-tla .tkw-przycisk--obrys, .tkw-baner .tkw-przycisk--obrys { border-color: #fff; color: #fff; }
.tkw-tlo--ciemne .tkw-przycisk--obrys:hover, .tkw-blok--obraz-tla .tkw-przycisk--obrys:hover, .tkw-baner .tkw-przycisk--obrys:hover { background: #fff; color: var(--kolor-granat); }

/* Ścięty narożnik (prawy dolny) – znak rozpoznawczy motywu */
.mt-scieta .tkw-przycisk:not(.tkw-przycisk--obrys):not(.tkw-przycisk--tekstowy) {
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%);
    padding-right: 34px;
}

/* --------------------------------------------------------- nagłówki sekcji */

.tkw-nadtytul {
    color: var(--kolor-glowny); text-transform: uppercase; letter-spacing: .2em; font-size: .92rem; font-weight: 700;
    font-family: var(--font-naglowki); display: inline-flex; align-items: center; gap: 12px; margin-bottom: 14px;
}
.tkw-nadtytul::before { content: ''; width: 12px; height: 12px; background: var(--kolor-glowny); flex: 0 0 12px; }
.tkw-tekst--srodek .tkw-nadtytul { justify-content: center; }
.tkw-tytul-sekcji { color: var(--kolor-granat); }
.tkw-opis-sekcji { color: var(--kolor-tekst-slaby); font-size: 1.05rem; }
.tkw-naglowek-sekcji { margin-bottom: 44px; }

.tkw-tlo--ciemne, .tkw-tlo--ciemne.tkw-blok { background-color: var(--kolor-granat); position: relative; }
.tkw-tlo--ciemne::before {
    content: ''; position: absolute; inset: 0; background: var(--mt-siatka); pointer-events: none;
}
.tkw-tlo--ciemne > .tkw-kontener { position: relative; }
.tkw-tlo--ciemne .tkw-nadtytul, .tkw-blok--obraz-tla .tkw-nadtytul { color: var(--kolor-akcent); }
.tkw-tlo--ciemne .tkw-nadtytul::before { background: var(--kolor-akcent); }
.tkw-tlo--ciemne h1, .tkw-tlo--ciemne h2, .tkw-tlo--ciemne h3, .tkw-tlo--ciemne .tkw-tytul-sekcji { color: #fff; }
.tkw-tlo--ciemne .tkw-opis-sekcji, .tkw-tlo--ciemne .tkw-kafel__opis { color: #c4cfdb; }
.tkw-tlo--ciemne a:not(.tkw-przycisk) { color: var(--kolor-akcent); }
.tkw-tlo--jasne { background: var(--kolor-tlo-jasne); }
.tkw-tlo--akcent { background: var(--kolor-glowny); }
.tkw-tlo--akcent .tkw-nadtytul { color: #fff; }
.tkw-tlo--akcent .tkw-nadtytul::before { background: #fff; }

/* ----------------------------------------------------------- baner (hero) */

.tkw-baner {
    position: relative; overflow: hidden; display: flex; align-items: center; color: #fff;
    background-size: cover; background-position: center; background-color: var(--kolor-granat);
}
.tkw-baner--sredni { min-height: 460px; }
.tkw-baner--wysoki { min-height: clamp(560px, 78vh, 760px); }
.tkw-baner::before {
    content: ''; position: absolute; inset: 0; z-index: 0;
    background: linear-gradient(100deg, rgba(10, 23, 39, .94) 0%, rgba(15, 33, 55, .82) 42%, rgba(15, 33, 55, .35) 100%);
}
.tkw-baner::after {
    content: ''; position: absolute; inset: 0; z-index: 0; background: var(--mt-siatka); pointer-events: none;
    -webkit-mask-image: linear-gradient(100deg, #000 0%, transparent 70%); mask-image: linear-gradient(100deg, #000 0%, transparent 70%);
}
.tkw-baner > .tkw-kontener { position: relative; z-index: 1; padding-top: 72px; padding-bottom: 130px; }
.tkw-baner__tresc { max-width: 760px; }
.tkw-baner .tkw-nadtytul { color: var(--kolor-akcent); opacity: 1; }
.tkw-baner .tkw-nadtytul::before { background: var(--kolor-akcent); }
.tkw-baner__tytul {
    color: #fff; font-size: clamp(2.5rem, 6.2vw, 4.9rem); text-transform: uppercase; line-height: .98; letter-spacing: .005em;
    margin: 0 0 22px; text-wrap: balance;
}
.tkw-baner__tytul::after { content: ''; display: block; width: 92px; height: 5px; background: var(--kolor-glowny); margin-top: 26px; }
.tkw-baner__opis { color: #dbe4ee; font-size: clamp(1.08rem, 1.6vw, 1.3rem); max-width: 620px; margin: 0 0 32px; line-height: 1.55; }
.mt-animacje-hero .tkw-baner { animation: mt-hero-zoom 22s ease-out both; background-size: 106%; }
@keyframes mt-hero-zoom { from { background-size: 112%; } to { background-size: 100%; } }
@media (prefers-reduced-motion: reduce) { .mt-animacje-hero .tkw-baner { animation: none; background-size: cover; } }

/* Pas z liczbami wsuwany na dolną krawędź baneru */
.mt-pas-liczb { margin-top: -78px; position: relative; z-index: 3; }
.mt-pas-liczb .tkw-liczby {
    background: #fff; box-shadow: var(--cien-mocny); border-top: 5px solid var(--kolor-glowny); gap: 0;
    padding: 6px 0;
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 22px), calc(100% - 22px) 100%, 0 100%);
}
.mt-pas-liczb .tkw-liczba { padding: 26px 18px 24px; text-align: left; position: relative; }
.mt-pas-liczb .tkw-liczba + .tkw-liczba::before {
    content: ''; position: absolute; left: 0; top: 24px; bottom: 24px; width: 1px; background: var(--kolor-obramowanie);
}
.tkw-liczba__licznik {
    color: var(--kolor-granat); font-size: clamp(2.4rem, 4.4vw, 3.4rem); font-weight: 700; line-height: 1; letter-spacing: .005em;
    display: flex; align-items: baseline; gap: 6px;
}
.tkw-liczba__sufiks { font-size: .5em; color: var(--kolor-glowny); text-transform: uppercase; letter-spacing: .06em; }
.tkw-liczba__etykieta { color: var(--kolor-tekst-slaby); font-size: .98rem; line-height: 1.35; margin-top: 10px; }

/* ----------------------------------------------------- pasek tytułu podstron */

.mt-tytul {
    position: relative; overflow: hidden; color: #fff; padding: 64px 0 68px;
    background:
        linear-gradient(115deg, rgba(10, 23, 39, .35), transparent 55%),
        linear-gradient(135deg, #12294a 0%, var(--kolor-granat) 55%, #08111f 100%);
}
.mt-tytul::before { content: ''; position: absolute; inset: 0; background: var(--mt-siatka); pointer-events: none; }
.mt-tytul::after {
    content: ''; position: absolute; right: max(3vw, calc((100vw - var(--szerokosc)) / 2)); top: 50%;
    width: 210px; height: 220px; transform: translateY(-50%);
    background: url("img/znak-kontur.svg") center / contain no-repeat; opacity: .07; pointer-events: none;
}
.mt-tytul--zdjecie { background: var(--kolor-granat) var(--mt-tlo-tytulu) center / cover no-repeat; }
.mt-tytul--zdjecie::before { background: linear-gradient(95deg, rgba(10, 23, 39, .95) 0%, rgba(15, 33, 55, .8) 60%, rgba(15, 33, 55, .55) 100%); }
.mt-tytul > .tkw-kontener { position: relative; z-index: 1; }
.mt-tytul__nad {
    margin: 0 0 10px; color: var(--kolor-akcent); text-transform: uppercase; letter-spacing: .2em; font-size: .92rem; font-weight: 700;
    font-family: var(--font-naglowki);
}
.mt-tytul__naglowek { color: #fff; margin: 0; max-width: 980px; font-size: clamp(2.2rem, 4.8vw, 3.7rem); }
.mt-tytul__naglowek::after { content: ''; display: block; width: 72px; height: 5px; background: var(--kolor-glowny); margin-top: 20px; }
.mt-tytul__opis { color: #d3dde8; max-width: 760px; margin: 20px 0 0; font-size: 1.15rem; }

.tkw-okruszki { font-size: .92rem; margin-bottom: 20px; }
.tkw-okruszki ol { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0; padding: 0; }
.tkw-okruszki li { display: inline-flex; align-items: center; gap: 6px; }
.tkw-okruszki li + li::before { content: '/'; opacity: .55; }
.mt-tytul .tkw-okruszki a { color: #e6eaf1; text-decoration: none; }
.mt-tytul .tkw-okruszki a:hover { color: #fff; text-decoration: underline; }
.mt-tytul .tkw-okruszki [aria-current] { color: var(--kolor-akcent); }
.mt-okruszki-pas { background: var(--kolor-tlo-jasne); border-bottom: 1px solid var(--kolor-obramowanie); padding: 14px 0 0; }
.mt-okruszki-pas .tkw-okruszki { margin-bottom: 14px; }
.mt-okruszki-pas .tkw-okruszki a { color: var(--kolor-granat); }

/* ------------------------------------------------------------------- karty */

.tkw-wpis, .tkw-kafel--karta, .tkw-opinia, .tkw-pakiet {
    border: 1px solid var(--kolor-obramowanie); border-radius: var(--promien); background: #fff;
    transition: box-shadow var(--mt-przejscie), transform var(--mt-przejscie), border-color var(--mt-przejscie);
}
.tkw-wpis:hover, .tkw-kafel--karta:hover { box-shadow: var(--cien-mocny); transform: translateY(-3px); border-color: #b9c5d3; }
.tkw-wpis__link { text-decoration: none; color: inherit; }
.tkw-wpis__link:hover { text-decoration: none; }
.tkw-wpis__media { overflow: hidden; }
.tkw-wpis__obraz { transition: transform .6s ease; }
.tkw-wpis:hover .tkw-wpis__obraz { transform: scale(1.04); }
.tkw-wpis__tytul { color: var(--kolor-granat); }
.tkw-wpis__link:hover .tkw-wpis__tytul { text-decoration: underline; text-decoration-color: var(--kolor-glowny); text-underline-offset: 4px; }
.tkw-wpis__data, .tkw-wpis__meta { color: var(--kolor-tekst-slaby); font-size: .9rem; }
.tkw-wpis__kategoria { color: var(--kolor-glowny); font-weight: 700; }
.tkw-wpis__wiecej { color: var(--kolor-glowny); font-weight: 700; }
.tkw-kafel__ikona { color: var(--kolor-glowny); background: color-mix(in srgb, var(--kolor-glowny) 9%, #fff); border-radius: 2px; }
.tkw-kafel__tytul { color: var(--kolor-granat); font-size: 1.4rem; }

.tkw-filtr {
    border: 1px solid var(--kolor-obramowanie); background: #fff; color: var(--kolor-granat); text-decoration: none;
    border-radius: 2px; padding: 8px 16px; font-weight: 600;
}
.tkw-filtr:hover { border-color: var(--kolor-granat); text-decoration: none; }
.tkw-filtr.jest-aktywny, .tkw-filtr[aria-pressed="true"] { background: var(--kolor-granat); border-color: var(--kolor-granat); color: #fff; }
.tkw-paginacja a, .tkw-paginacja span { border-radius: 2px; }
.tkw-paginacja .jest-aktywna { background: var(--kolor-granat); color: #fff; border-color: var(--kolor-granat); }

/* Siatka stron (moduł „Siatka stron”) – karty usług */
.sk-siatka--karta .sk-kafel, .sk-siatka--obrys .sk-kafel { border-radius: 0; border-color: var(--kolor-obramowanie); position: relative; }
.mt-scieta .sk-siatka .sk-kafel { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 18px), calc(100% - 18px) 100%, 0 100%); }
.mt-scieta .sk-siatka .sk-kafel { border: 0; box-shadow: none; background: #fff; filter: drop-shadow(0 1px 0 var(--kolor-obramowanie)); }
.sk-kafel__tresc { padding: 20px 22px 24px !important; }
.sk-kafel__tytul {
    font-family: var(--font-naglowki); font-weight: 700; font-size: 1.45rem !important; line-height: 1.15;
    text-transform: uppercase; letter-spacing: .01em; color: var(--kolor-granat); display: block; text-align: left;
}
.sk-kafel__opis { color: var(--kolor-tekst-slaby); }
.sk-siatka--tekst-srodek .sk-kafel__tresc { text-align: left; }
a.sk-kafel, a.sk-kafel:hover { text-decoration: none; }
a.sk-kafel::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--kolor-glowny);
    transform: scaleX(0); transform-origin: left; transition: transform var(--mt-przejscie);
}
a.sk-kafel:hover::after, a.sk-kafel:focus-visible::after { transform: scaleX(1); }
a.sk-kafel:hover { box-shadow: var(--cien-mocny); border-color: transparent; }
a.sk-kafel:hover .sk-kafel__tytul { color: var(--kolor-glowny); }
.sk-kafel__tresc::after { content: '→'; display: block; margin-top: 12px; font-family: var(--font); font-weight: 700; color: var(--kolor-glowny); }

/* Tekst ze zdjęciem – ramka kątowa za zdjęciem */
.tkw-duo__media { position: relative; }
.tkw-duo__media::before {
    content: ''; position: absolute; left: -14px; bottom: -14px; width: 46%; height: 46%; z-index: 0;
    border-left: 5px solid var(--kolor-glowny); border-bottom: 5px solid var(--kolor-glowny);
}
.tkw-duo--prawo .tkw-duo__media::before { left: auto; right: -14px; border-left: 0; border-right: 5px solid var(--kolor-glowny); }
.tkw-duo__media img { position: relative; z-index: 1; border-radius: 0; }
.mt-scieta .tkw-duo__media img { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 26px), calc(100% - 26px) 100%, 0 100%); }
.tkw-duo__tresc h2 { margin-bottom: .5em; }

/* Galeria */
.tkw-galeria__pozycja { border-radius: 0; background: var(--kolor-granat); position: relative; }
.tkw-galeria__pozycja::after {
    content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(10, 23, 39, .5));
    opacity: 0; transition: opacity var(--mt-przejscie); pointer-events: none;
}
.tkw-galeria__pozycja:hover::after { opacity: 1; }

.tkw-cytat--karta { border-left: 5px solid var(--kolor-glowny); }
.tkw-cta {
    background: var(--kolor-granat); color: #fff; border-radius: 0; position: relative; overflow: hidden; padding: clamp(34px, 5vw, 60px);
}
.mt-scieta .tkw-cta { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 26px), calc(100% - 26px) 100%, 0 100%); }
.tkw-cta::before { content: ''; position: absolute; inset: 0; background: var(--mt-siatka); pointer-events: none; }
.tkw-cta::after {
    content: ''; position: absolute; right: -20px; bottom: -30px; width: 250px; height: 260px;
    background: url("img/znak-kontur.svg") center / contain no-repeat; opacity: .07;
}
.tkw-cta > * { position: relative; z-index: 1; }
.tkw-cta__tytul { color: #fff; }
.tkw-cta__opis { color: #d3dde8; }

.tkw-os__znacznik { background: var(--kolor-glowny); }
.tkw-akordeon__pytanie { color: var(--kolor-granat); }

/* Kroki: duże numery w kroju technicznym */
.tkw-krok__numer {
    background: var(--kolor-glowny); color: #fff; border-radius: 0; font-family: var(--font-naglowki); font-weight: 700; font-size: 1.5rem;
    width: 48px; height: 48px; display: grid; place-items: center; flex: 0 0 48px;
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%);
}
.tkw-krok__tytul { font-family: var(--font-naglowki); font-size: 1.4rem; text-transform: uppercase; color: var(--kolor-granat); }
.tkw-tlo--ciemne .tkw-krok__tytul { color: #fff; }
.tkw-tlo--ciemne .tkw-krok__opis { color: #c4cfdb; }
.tkw-kroki--poziomy { position: relative; }

/* Checklisty i listy w treści */
.tkw-checklista svg { color: var(--kolor-glowny); }
.tkw-tlo--ciemne .tkw-checklista svg { color: var(--kolor-akcent); }
.tkw-tresc ul:not(.tkw-checklista) { list-style: none; padding-left: 0; }
.tkw-tresc ul:not(.tkw-checklista) > li { position: relative; padding-left: 24px; margin-bottom: .55em; }
.tkw-tresc ul:not(.tkw-checklista) > li::before {
    content: ''; position: absolute; left: 0; top: .62em; width: 9px; height: 9px; background: var(--kolor-glowny);
}

/* Lista klientów: kafle z nazwami */
.mt-klienci ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.mt-klienci ul > li {
    padding: 22px 20px !important; border: 1px solid rgba(255, 255, 255, .16); background: rgba(255, 255, 255, .04);
    font-family: var(--font-naglowki); font-weight: 600; font-size: 1.35rem; letter-spacing: .04em; text-transform: uppercase; color: #fff;
    display: flex; align-items: center; margin: 0 !important; line-height: 1.15;
}
.mt-klienci ul > li::before { display: none !important; }

/* Realizacje: tabela w stylu karty technicznej */
.tkw-tabela { border-collapse: collapse; width: 100%; }
.tkw-tabela thead th, .tkw-tabela th { background: var(--kolor-granat); color: #fff; font-family: var(--font-naglowki); text-transform: uppercase; letter-spacing: .08em; font-size: 1.05rem; text-align: left; }
.tkw-tabela th, .tkw-tabela td { padding: 15px 18px; vertical-align: top; }
.tkw-tabela tr:nth-child(even) td { background: var(--kolor-tlo-jasne); }
.tkw-tabela td:first-child { font-weight: 700; color: var(--kolor-granat); width: 32%; }

.tkw-formularz input, .tkw-formularz textarea, .tkw-formularz select, .tkw-kontrolka { border-color: #98a6b6; border-radius: var(--promien); }
.tkw-formularz input:focus, .tkw-formularz textarea:focus, .tkw-formularz select:focus {
    border-color: var(--kolor-granat); box-shadow: 0 0 0 3px color-mix(in srgb, var(--kolor-glowny) 24%, transparent);
}
.tkw-szukajka input { border-color: #98a6b6; }

.tkw-tresc h2, .tkw-waska-tresc h2 { margin-top: 1.5em; }
.tkw-tresc h2:first-child { margin-top: 0; }
.tkw-tresc a, .tkw-waska-tresc a { font-weight: 500; }

/* Kontakt: karty osób i biura */
.mt-kontakt-karta { border-left: 5px solid var(--kolor-glowny); background: var(--kolor-tlo-jasne); padding: 26px 28px; height: 100%; }
.mt-kontakt-karta h3 { font-size: 1.5rem; text-transform: uppercase; margin-bottom: .5em; }
.mt-kontakt-karta p { margin-bottom: .6em; }
.mt-kontakt-karta a { font-weight: 600; }

/* ---------------------------------------------------------------- stopka */

.mt-stopka { background: var(--kolor-tlo-ciemne); color: #c4cfdb; padding-top: 0; position: relative; }
.mt-stopka::before { content: ''; position: absolute; inset: 0; background: var(--mt-siatka); pointer-events: none; opacity: .7; }
.mt-stopka > * { position: relative; }
.mt-stopka__wezwanie { background: var(--kolor-glowny); padding: 22px 0; text-align: center; }
.mt-stopka__wezwanie p {
    margin: 0; font-family: var(--font-naglowki); font-weight: 700; font-size: clamp(1.15rem, 2.2vw, 1.6rem); color: #fff;
    text-transform: uppercase; letter-spacing: .06em; line-height: 1.2;
}
.mt-stopka__siatka { padding: 60px 0 44px; }
.mt-stopka__marka .mt-logo__l1 { color: #fff; }
.mt-stopka__marka .mt-logo__l2 { color: var(--kolor-akcent); }
.mt-stopka__marka { display: flex; align-items: center; gap: 13px; margin-bottom: 18px; }
.mt-stopka__marka .mt-logo__znak { width: 54px; flex-basis: 54px; filter: brightness(0) invert(1); }
.mt-stopka__marka .mt-logo__obraz { max-height: 64px; background: #fff; padding: 6px; }
.mt-stopka__naglowek {
    color: #fff; font-size: 1.15rem; margin: 0 0 18px; font-family: var(--font-naglowki); font-weight: 700;
    text-transform: uppercase; letter-spacing: .14em;
}
.mt-stopka__naglowek::after { content: ''; display: block; width: 34px; height: 4px; background: var(--kolor-glowny); margin-top: 10px; }
.mt-stopka a { color: #fff; text-decoration: none; }
.mt-stopka a:hover { color: var(--kolor-akcent); text-decoration: underline; }
.mt-stopka .tkw-stopka__opis { color: #b3c0cf; }
.mt-stopka .tkw-stopka__lista svg { color: var(--kolor-akcent); }
.mt-stopka .tkw-stopka__dol { color: #98a8ba; border-top-color: rgba(255, 255, 255, .1); }
.mt-stopka .tkw-menu-stopka a, .mt-stopka .tkw-menu-prawne a { color: #e3e9f0; }

/* ---------------------------------------------------------------- 404 */

.mt-404__znak { margin: 0 auto 18px; width: 84px; }
.mt-404__opis { color: var(--kolor-tekst-slaby); max-width: 520px; margin: 0 auto 26px; }
.mt-404 .tkw-szukajka { max-width: 460px; margin: 0 auto 24px; }

/* -------------------------------------------------------------- animacje */

@media (prefers-reduced-motion: no-preference) {
    .mt-animacje .mt-odslon { opacity: 0; transform: translateY(16px); transition: opacity .8s ease, transform .8s cubic-bezier(.2, .6, .2, 1); }
    .mt-animacje .mt-odslon.jest-widoczny { opacity: 1; transform: none; }
    .mt-animacje .mt-odslon-dzieci > * { opacity: 0; transform: translateY(12px); transition: opacity .7s ease, transform .7s ease; }
    .mt-animacje .mt-odslon-dzieci.jest-widoczny > * { opacity: 1; transform: none; }
    .mt-animacje .mt-odslon-dzieci.jest-widoczny > *:nth-child(2) { transition-delay: .08s; }
    .mt-animacje .mt-odslon-dzieci.jest-widoczny > *:nth-child(3) { transition-delay: .16s; }
    .mt-animacje .mt-odslon-dzieci.jest-widoczny > *:nth-child(4) { transition-delay: .24s; }
    .mt-animacje .mt-odslon-dzieci.jest-widoczny > *:nth-child(n+5) { transition-delay: .3s; }
}
.dc-bez-animacji .mt-odslon, .dc-bez-animacji .mt-odslon-dzieci > * { opacity: 1 !important; transform: none !important; transition: none !important; }

/* ------------------------------------------------------------ responsywność */

@media (max-width: 1280px) {
    .mt-naglowek .tkw-naglowek__wnetrze { gap: 14px; }
    .mt-naglowek .tkw-menu > .tkw-menu__pozycja > a { padding-left: 9px; padding-right: 9px; font-size: 1.05rem; }
    .mt-naglowek .tkw-menu > .tkw-menu__pozycja > a::after { left: 9px; right: 9px; }
    .mt-naglowek .tkw-menu__rozwin { width: 22px; margin-right: 0; }
    .mt-naglowek .tkw-menu__rozwin::before { left: 7px; }
}

@media (max-width: 1100px) {
    .tkw-hamburger { display: flex; }
    .tkw-nawigacja {
        position: fixed; inset: var(--mt-nav-top, 76px) 0 0; padding: 22px; margin: 0;
        transform: translateX(100%); transition: transform .24s ease; overflow-y: auto; z-index: 55;
        visibility: hidden;
    }
    .tkw-nawigacja.jest-otwarta { transform: none; visibility: visible; }
    .tkw-menu { flex-direction: column; gap: 2px; }
    .tkw-nawigacja__mobilne { display: grid; gap: 10px; margin-top: 22px; }
    .tkw-naglowek__cta { display: none; }
    .mt-naglowek .tkw-naglowek__wnetrze { min-height: 74px; }
    .mt-pasek__haslo { display: none; }
    .mt-pasek__wnetrze { justify-content: center; min-height: 38px; gap: 18px; }
    .mt-pasek__odstep { display: none; }

    .tkw-nawigacja {
        top: var(--mt-nav-top, 76px); bottom: 0; left: 0; right: 0; inset: var(--mt-nav-top, 76px) 0 0;
        background: var(--kolor-tlo); border-top: 1px solid var(--kolor-obramowanie);
    }
    .mt-naglowek .tkw-menu { align-items: stretch; }
    .mt-naglowek .tkw-menu > .tkw-menu__pozycja { display: block; position: relative; border-bottom: 1px solid var(--kolor-obramowanie); }
    .mt-naglowek .tkw-menu__pozycja > a { padding: 15px 56px 15px 6px; font-size: 1.3rem; }
    .mt-naglowek .tkw-menu > .tkw-menu__pozycja > a::after { display: none; }
    .mt-naglowek .tkw-menu__rozwin {
        position: absolute; right: 0; top: 6px; width: 46px; height: 46px; margin: 0;
        border: 1px solid var(--kolor-obramowanie); border-radius: 2px;
    }
    .mt-naglowek .tkw-menu__rozwin::before { top: 17px; left: 18px; }
    .mt-naglowek .tkw-menu__rozwin[aria-expanded="true"]::before { top: 21px; }
    .mt-naglowek .tkw-menu__podmenu {
        position: static; opacity: 1; visibility: visible; transform: none; display: none;
        background: var(--kolor-menu-rozwijane); border-radius: 0; margin: 0 0 12px; min-width: 0; box-shadow: none;
    }
    .mt-naglowek .tkw-menu__pozycja.jest-rozwinieta > .tkw-menu__podmenu { display: block; }
    .mt-naglowek .tkw-menu__podmenu a { padding: 14px 18px; }
    .mt-szukaj-mobilne { display: flex; }
    .mt-szukaj-przycisk { display: none; }
    .mt-szukaj-panel { display: none; }
    .mt-tytul { padding: 44px 0 46px; }
    .mt-tytul::after { width: 110px; height: 115px; opacity: .06; }
    .mt-klienci ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mt-pas-liczb .tkw-liczby { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mt-pas-liczb .tkw-liczba:nth-child(3)::before { display: none; }
    .mt-pas-liczb .tkw-liczba:nth-child(n+3) { border-top: 1px solid var(--kolor-obramowanie); }
}

@media (max-width: 820px) {
    .tkw-baner > .tkw-kontener { padding-top: 48px; padding-bottom: 110px; }
    .mt-pas-liczb { margin-top: -64px; }
    .tkw-duo__media::before { display: none; }
}

@media (max-width: 620px) {
    :root { --rozmiar-bazowy: 16.5px; }
    .mt-logo__znak { width: 42px; flex-basis: 42px; }
    .mt-logo__l1 { font-size: 1.6rem; }
    .mt-logo__l2 { font-size: .7rem; letter-spacing: .2em; }
    .mt-pasek__pozycja span { font-size: .84rem; }
    .mt-stopka__wezwanie p { font-size: 1.1rem; }
    .tkw-przycisk { width: 100%; text-align: center; justify-content: center; }
    .tkw-przyciski { display: grid; }
    .mt-klienci ul { grid-template-columns: 1fr; }
    .mt-pas-liczb .tkw-liczba { padding: 20px 14px 18px; }
    .mt-pas-liczb .tkw-liczba__etykieta { font-size: .86rem; }
}

@media (max-width: 380px) {
    .mt-logo__l2 { display: none; }
}

@media print {
    .mt-pasek, .mt-szukaj-panel { display: none !important; }
    .mt-tytul { background: none; color: #000; padding: 0; }
    .mt-tytul__naglowek { color: #000; }
}

@media (max-width: 1100px) {
    .mt-szukaj-mobilne .tkw-przycisk { width: auto; flex: 0 0 auto; }
    .tkw-nawigacja { padding-bottom: 96px; }
}