:root {
  --color-primary: #12243d;
  --color-primary-light: #20406b;
  --color-primary-dark: #0a1626;
  --color-accent: #2e8bc0;
  --color-accent-dark: #1f6e9c;
  --color-accent2: #e8541e;
  --color-ink: #0b0f17;
}

:root {
  --navy: var(--color-primary);
  --navy-d: var(--color-primary-dark);
  --navy-l: var(--color-primary-light);
  --accent: var(--color-accent);
  --accent-d: var(--color-accent-dark);
  --ink: #10151d;
  --bg: #ffffff;
  --soft: #f4f6f9;
  --line: #e5e9ef;
  --muted: #6b7686;
  --wrap: 1280px;
  --ease: cubic-bezier(.22,.68,.36,1);
  --shadow: 0 20px 50px -20px rgba(16,21,29,.22);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; font-family:'Manrope',system-ui,sans-serif; color:var(--ink); background:var(--bg); font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased; }
h1,h2,h3 { margin:0; font-weight:800; letter-spacing:-.03em; line-height:1.02; }
p { margin:0; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
.wrap { width:100%; max-width:var(--wrap); margin:0 auto; padding:0 32px; }
.wrap--narrow { max-width:820px; }

/* --- buttons --- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:600; font-size:1rem; padding:14px 26px; border-radius:14px; border:1.5px solid transparent; cursor:pointer; transition:transform .3s var(--ease), background .25s, box-shadow .3s var(--ease), color .25s; }
.btn--lg { padding:17px 34px; font-size:1.05rem; }
.btn--block { width:100%; }
.btn--solid { background:var(--accent); color:#fff; }
.btn--solid:hover { background:var(--accent-d); transform:translateY(-2px); box-shadow:0 14px 30px -10px color-mix(in srgb,var(--accent) 55%,transparent); }
.btn--outline { background:transparent; border-color:rgba(255,255,255,.5); color:#fff; }
.btn--outline:hover { background:rgba(255,255,255,.12); border-color:#fff; }
.btn--white { background:#fff; color:var(--navy); }
.btn--white:hover { transform:translateY(-2px); box-shadow:0 14px 30px -12px rgba(0,0,0,.3); }

/* --- sticky call --- */
.sticky-call { position:fixed; bottom:16px; left:16px; right:16px; z-index:90; display:none; align-items:center; justify-content:center; gap:8px; background:var(--accent); color:#fff; font-weight:700; padding:15px; border-radius:14px; box-shadow:var(--shadow); }

/* ============ HERO (full-bleed, asymetryczna typografia) ============ */
.hero { position:relative; min-height:100vh; display:flex; flex-direction:column; color:#fff; overflow:hidden; }
.hero::before { content:""; position:absolute; inset:0; z-index:-2; background:var(--hero-img) center/cover no-repeat; }
.hero::after { content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg, rgba(10,16,26,.55) 0%, rgba(10,16,26,.25) 35%, rgba(10,16,26,.65) 100%); }

.hero__nav { position:relative; z-index:3; padding-top:26px; }
.hero__nav-inner { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { font-weight:800; font-size:1.4rem; letter-spacing:-.03em; color:#fff; }
.hero__links { display:flex; gap:34px; }
.hero__links a { font-weight:500; font-size:.98rem; color:rgba(255,255,255,.9); transition:color .2s; }
.hero__links a:hover { color:#fff; }
.hero__phone { font-weight:700; font-size:1.05rem; color:#fff; padding:9px 18px; border:1.5px solid rgba(255,255,255,.4); border-radius:12px; transition:.25s; }
.hero__phone:hover { background:#fff; color:var(--navy); }

/* wielka asymetryczna typografia - jeden naglowek lewo-gora, drugi prawo-dol */
.hero__stage { position:relative; z-index:2; flex:1; display:flex; flex-direction:column; justify-content:center; max-width:var(--wrap); width:100%; margin:0 auto; padding:40px 32px; }
.hero__big { font-size:clamp(3.2rem, 9vw, 8rem); font-weight:800; text-shadow:0 4px 40px rgba(0,0,0,.3); }
.hero__big--tl { align-self:flex-start; }
.hero__br { align-self:flex-end; text-align:right; max-width:min(560px, 90%); margin-top:clamp(20px,5vw,60px); }
.hero__big--br { margin-bottom:20px; }
.hero__sub { font-size:1.15rem; color:rgba(255,255,255,.9); margin-bottom:26px; max-width:44ch; margin-left:auto; }
.hero__cta { display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap; }

.hero__trust { position:relative; z-index:2; border-top:1px solid rgba(255,255,255,.18); background:rgba(10,16,26,.35); backdrop-filter:blur(6px); }
.hero__trust-inner { display:flex; flex-wrap:wrap; gap:14px 40px; padding:20px 32px; justify-content:center; }
.hero__trust span { font-weight:600; font-size:.95rem; color:rgba(255,255,255,.92); position:relative; padding-left:24px; }
.hero__trust span::before { content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); width:14px; height:14px; border-radius:50%; background:var(--accent); }

/* nav mobile */
.nav-toggle { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px; }
.nav-toggle span { width:26px; height:2px; background:#fff; border-radius:2px; transition:.3s var(--ease); }
.nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
.mnav { display:none; flex-direction:column; gap:2px; padding:12px 32px 20px; }
.mnav a:not(.btn){ padding:13px 4px; color:#fff; font-weight:500; border-bottom:1px solid rgba(255,255,255,.15); }
.mnav .btn { margin-top:12px; }
.mnav.open { display:flex; }

/* ============ BLOCKS ============ */
.block { padding:clamp(72px,10vw,140px) 0; }
.block--soft { background:var(--soft); }
.block--dark { background:var(--navy); color:#fff; }
.head { max-width:720px; margin-bottom:clamp(40px,6vw,72px); }
.eyebrow { display:inline-block; font-size:.8rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); margin-bottom:16px; }
.eyebrow--light { color:var(--accent); opacity:.95; }
.h2 { font-size:clamp(2rem,4.5vw,3.4rem); }
.h2--light { color:#fff; }
.lead { font-size:1.15rem; color:var(--muted); margin-top:18px; }
.lead--light { color:rgba(255,255,255,.8); }
.ticks { list-style:none; padding:0; margin:26px 0 30px; display:grid; gap:13px; }
.ticks li { position:relative; padding-left:30px; font-weight:500; }
.ticks li::before { content:""; position:absolute; left:0; top:8px; width:16px; height:16px; border-radius:5px; background:color-mix(in srgb,var(--accent) 18%,transparent); box-shadow:inset 0 0 0 2px var(--accent); }

/* uslugi - asymetryczna siatka, numerowane */
.svc-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:2px; background:var(--line); border:1px solid var(--line); border-radius:20px; overflow:hidden; }
.svc { display:flex; flex-direction:column; background:#fff; padding:38px 34px; transition:background .3s var(--ease); min-height:230px; }
.svc:hover { background:var(--soft); }
.svc__no { font-size:.9rem; font-weight:700; color:var(--accent); letter-spacing:.05em; }
.svc__title { font-size:1.4rem; margin:14px 0 10px; letter-spacing:-.02em; }
.svc__desc { color:var(--muted); font-size:.98rem; }
.svc__more { margin-top:auto; padding-top:18px; font-weight:600; color:var(--navy); font-size:.95rem; }
.svc:hover .svc__more { color:var(--accent); }

/* split - naprzemienne obraz/tekst */
.split { display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(40px,6vw,80px); align-items:center; }
.split__media { border-radius:22px; overflow:hidden; box-shadow:var(--shadow); }
.split__media img { width:100%; height:100%; min-height:420px; object-fit:cover; }

/* proces */
.steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:clamp(24px,4vw,48px); }
.step__no { display:inline-flex; align-items:center; justify-content:center; width:54px; height:54px; border-radius:16px; background:color-mix(in srgb,var(--accent) 20%,transparent); color:var(--accent); font-size:1.4rem; font-weight:800; margin-bottom:20px; }
.step__title { font-size:1.35rem; color:#fff; margin-bottom:10px; }
.step__desc { color:rgba(255,255,255,.7); }

/* galeria */
.gal { display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:240px; gap:16px; }
.gal__item { margin:0; border-radius:18px; overflow:hidden; box-shadow:var(--shadow); }
.gal__item img { width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.gal__item:hover img { transform:scale(1.06); }
.gal__item--big { grid-column:span 2; grid-row:span 2; }

/* opinie */
.quotes { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:24px; }
.quote { margin:0; background:#fff; border:1px solid var(--line); border-radius:20px; padding:36px 32px; box-shadow:var(--shadow); }
.quote p { font-size:1.25rem; font-weight:600; line-height:1.45; letter-spacing:-.01em; }
.quote cite { display:block; margin-top:18px; color:var(--muted); font-style:normal; font-weight:500; font-size:.92rem; }

/* pasek awaryjny */
.emergency { background:var(--accent); color:#fff; padding:clamp(40px,6vw,64px) 0; }
.emergency__inner { display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.emergency__tag { display:inline-block; font-weight:800; font-size:.85rem; letter-spacing:.1em; text-transform:uppercase; background:rgba(255,255,255,.2); padding:5px 14px; border-radius:999px; margin-bottom:8px; }
.emergency__text { font-size:clamp(1.3rem,2.6vw,1.9rem); font-weight:700; letter-spacing:-.02em; }

/* faq */
.faq { display:grid; gap:12px; }
.faq__item { border:1px solid var(--line); border-radius:16px; overflow:hidden; background:#fff; transition:box-shadow .25s; }
.faq__item[open] { box-shadow:var(--shadow); }
.faq__item summary { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:22px 26px; cursor:pointer; font-weight:700; font-size:1.1rem; list-style:none; }
.faq__item summary::-webkit-details-marker { display:none; }
.faq__i { position:relative; width:16px; height:16px; flex-shrink:0; }
.faq__i::before,.faq__i::after { content:""; position:absolute; background:var(--accent); border-radius:2px; transition:.3s var(--ease); }
.faq__i::before { top:7px; left:0; width:16px; height:2px; }
.faq__i::after { top:0; left:7px; width:2px; height:16px; }
.faq__item[open] .faq__i::after { transform:rotate(90deg); opacity:0; }
.faq__a { padding:0 26px 24px; }
.faq__a p { color:var(--muted); }

/* kontakt */
.contact { display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,80px); align-items:center; }
.contact__phone { display:block; font-size:clamp(2rem,4vw,2.8rem); font-weight:800; color:#fff; letter-spacing:-.03em; margin:8px 0 4px; }
.contact__mail { display:block; color:rgba(255,255,255,.85); font-weight:500; margin-bottom:14px; }
.contact__addr { color:rgba(255,255,255,.6); font-size:.92rem; }
.contact__form { display:grid; gap:12px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius:22px; padding:32px; backdrop-filter:blur(6px); }
.contact__form input,.contact__form textarea { padding:15px 18px; border:1px solid rgba(255,255,255,.2); border-radius:12px; font:inherit; background:rgba(255,255,255,.08); color:#fff; }
.contact__form input::placeholder,.contact__form textarea::placeholder { color:rgba(255,255,255,.55); }
.contact__form input:focus,.contact__form textarea:focus { outline:none; border-color:var(--accent); background:rgba(255,255,255,.14); }

/* footer */
.foot { background:var(--navy-d); color:rgba(255,255,255,.75); padding:56px 0; }
.foot__inner { display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.brand--foot { color:#fff; margin-bottom:8px; }
.foot__meta { display:flex; flex-direction:column; gap:6px; text-align:right; }
.foot__meta a { color:rgba(255,255,255,.85); }

/* --- podstrona uslugi --- */
.btn--dark { background:var(--navy); color:#fff; }
.btn--dark:hover { background:var(--navy-d); transform:translateY(-2px); }
.svc-nav { border-bottom:1px solid var(--line); position:sticky; top:0; z-index:50; background:color-mix(in srgb,#fff 90%,transparent); backdrop-filter:blur(10px); }
.svc-nav__inner { display:flex; align-items:center; justify-content:space-between; height:74px; gap:20px; }
.brand--dark { color:var(--navy); }
.svc-nav__links { display:flex; gap:30px; }
.svc-nav__links a { color:var(--muted); font-weight:500; font-size:.95rem; }
.svc-nav__links a:hover { color:var(--ink); }
.svc-hero { padding:clamp(50px,7vw,90px) 0 clamp(40px,5vw,60px); background:var(--soft); }
.crumbs { font-size:.85rem; color:var(--muted); margin-bottom:22px; }
.crumbs a:hover { color:var(--accent); }
.svc-hero__title { font-size:clamp(2.2rem,5vw,3.4rem); margin-bottom:18px; max-width:16ch; }
.svc-hero__lead { font-size:1.15rem; color:var(--muted); max-width:60ch; margin-bottom:26px; }
.svc-grid2 { display:grid; grid-template-columns:1.5fr 1fr; gap:clamp(40px,5vw,64px); align-items:start; }
.svc-card { background:var(--soft); border:1px solid var(--line); border-radius:20px; padding:32px; position:sticky; top:98px; }
.svc-card h3 { font-size:1.35rem; margin-bottom:8px; }
.svc-card > p { color:var(--muted); margin-bottom:18px; }
.svc-card__phone { display:block; font-size:1.7rem; font-weight:800; color:var(--navy); letter-spacing:-.02em; }
.svc-card__mail { display:block; color:var(--muted); font-size:.92rem; margin:4px 0 18px; }
@media (max-width:820px){ .svc-grid2 { grid-template-columns:1fr; } .svc-card { position:static; } .svc-nav__links { display:none; } }

/* reveal */
.js-anim .reveal { opacity:0; transform:translateY(30px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.js-anim .reveal.in { opacity:1; transform:none; }

/* responsive */
@media (max-width:980px){
  .split,.contact { grid-template-columns:1fr; }
  .split__media { order:-1; }
  .gal { grid-template-columns:repeat(2,1fr); grid-auto-rows:180px; }
}
@media (max-width:720px){
  .hero__links,.hero__phone { display:none; }
  .nav-toggle { display:flex; }
  .sticky-call { display:flex; }
  body { padding-bottom:78px; }
  .hero__br { text-align:left; max-width:100%; }
  .hero__sub { margin-left:0; }
  .hero__cta { justify-content:flex-start; }
  .hero__big--br { margin-top:10px; }
  .svc-grid { grid-template-columns:1fr; }
  .foot__meta { text-align:left; }
}
@media (prefers-reduced-motion:reduce){ *{transition:none!important; scroll-behavior:auto;} .js-anim .reveal{opacity:1;transform:none;} }