@font-face{
  font-family:"Outfit";
  src:url("/assets/fonts/outfit-400.woff2") format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Outfit";
  src:url("/assets/fonts/outfit-700.woff2") format("woff2");
  font-weight:700; font-style:normal; font-display:swap;
}

:root{
  --paper:#F5F4EF;
  --paper-2:#EFEDE6;
  --ink:#141A20;
  --graphite:#1F2933;
  --muted:#5A6570;
  --rule:#DCD8CE;
  --teal:#0F6E56;
  --teal-lt:#4FC49B;
  --amber:#EF9F27;
  --col:64ch;
  --pad:clamp(1.25rem,5vw,2.5rem);
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--paper);
  color:var(--graphite);
  font:400 17px/1.62 "Outfit",system-ui,-apple-system,"Segoe UI",sans-serif;
  text-rendering:optimizeLegibility;
}

h1,h2,h3{margin:0;font-weight:700;letter-spacing:-.015em;line-height:1.14;color:var(--ink)}
p{margin:0}
a{color:var(--teal);text-underline-offset:.18em;text-decoration-thickness:.08em}
a:hover{color:var(--ink)}
img{display:block;max-width:100%;height:auto}

:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:2px}

.skip{
  position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--paper);
  padding:.7rem 1rem;z-index:10;text-decoration:none;
}
.skip:focus{left:0}

.wrap{width:100%;max-width:1060px;margin-inline:auto;padding-inline:var(--pad)}

/* ---------- pasek górny ---------- */
.bar{border-bottom:1px solid var(--rule);background:var(--paper)}
.bar-in{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding-block:1.15rem}
.brand{display:block;line-height:0}
.brand img{width:119px;height:44px}

/* ---------- hero ---------- */
.hero{padding-block:clamp(3rem,9vw,6rem) clamp(2.5rem,7vw,4.5rem)}
.hero h1{font-size:clamp(2.05rem,5.1vw,3.35rem);max-width:19ch;text-wrap:balance}
.lede{margin-top:1.35rem;max-width:54ch;font-size:clamp(1.02rem,1.9vw,1.19rem);
  line-height:1.58;color:var(--muted)}

.actions{margin-top:2rem;display:flex;flex-wrap:wrap;gap:.75rem}
.btn{
  display:inline-block;padding:.82rem 1.35rem;border-radius:3px;
  background:var(--ink);color:var(--paper);text-decoration:none;font-weight:700;
  font-size:1rem;border:1px solid var(--ink);
}
.btn:hover{background:var(--teal);border-color:var(--teal);color:#fff}
.btn-quiet{background:transparent;color:var(--ink);border-color:var(--rule)}
.btn-quiet:hover{background:transparent;color:var(--teal);border-color:var(--teal)}

/* ---------- sekcje ---------- */
.band{padding-block:clamp(2.75rem,7vw,4.75rem);border-top:1px solid var(--rule)}
.sec-h{font-size:clamp(1.35rem,2.9vw,1.75rem);margin-bottom:1.9rem}
.service-list{margin:0;padding-left:1.2rem;color:var(--muted)}
.service-list li{padding-block:.3rem}

.about p{margin-top:1rem;max-width:var(--col);line-height:1.68}
.about p:first-of-type{margin-top:0}

/* ---------- stopka ---------- */
.foot{background:#0F141A;color:#7D8894;padding-block:2.25rem;font-size:.88rem}
.foot-in{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.75rem}
.foot img{width:95px;height:35px;opacity:.9}
.foot-copy{margin:0}

@media (max-width:420px){
  .btn{width:100%;text-align:center}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
