/* Header (home) */
header{position:sticky;top:0;z-index:50;background:color-mix(in oklab, var(--bg) 85%, transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav{height:var(--nav-h);display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{height:40px}
header nav{display:flex;align-items:center;gap:6px}
header nav a{padding:10px 14px;border-radius:12px;transition:background .2s ease}
header nav a.active,header nav a:hover{background:color-mix(in oklab, var(--card) 92%, transparent)}

/* przyciski */
.btn{display:inline-flex;gap:10px;align-items:center;background:var(--text);color:var(--card);border:none;padding:12px 18px;border-radius:999px;font-weight:600;cursor:pointer}
.btn-outline{background:transparent;color:var(--text);border:1px solid var(--line)}
.tag{display:inline-block;padding:6px 10px;border-radius:999px;border:1px solid var(--line);color:var(--sub);font-size:12px}
.theme-toggle{width:40px;height:40px;display:inline-grid;place-items:center;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--text);cursor:pointer;padding:0;line-height:1;transition:transform .1s ease, background .2s ease}
.theme-toggle:active{ transform:scale(.96) }
.theme-toggle .icon{font-size:18px}
.theme-toggle[aria-pressed="true"]{background:color-mix(in oklab, var(--card) 90%, transparent)}

/* Sekcje */
section{scroll-margin-top: calc(var(--nav-h) + 12px)}

/* HERO / SLIDER */
.hero{position:relative;border-radius:var(--br);overflow:hidden;margin:18px 0;height:75vh;background:var(--card)}
.hero .slides{position:absolute;inset:0;display:flex;transition:transform 1s ease-in-out}
@media (prefers-reduced-motion: reduce){ .hero .slides{transition:none} }
.hero .slide{min-width:100%;background-size:cover;background-position:center}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.02) 40%, rgba(0,0,0,.10))}
:root[data-theme="dark"] .hero::after{background:linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.1) 40%, rgba(0,0,0,.24))}

/* CAPTION pod slajderem */
.hero-caption-wrap{ position:relative; z-index:5; margin-top:-140px }
@media (max-width:700px){ .hero-caption-wrap{ margin-top:-84px } }
.hero-caption{ margin:0 auto; width:min(960px, 94%); text-align:center; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:20px 22px; box-shadow:0 16px 40px rgba(0,0,0,.10) }
.hero-caption h1{font-size:clamp(28px,5vw,56px);margin:8px 0 6px;text-wrap:balance}
.hero-caption p{color:var(--sub);max-width:78ch;margin:0 auto;line-height:1.55}

/* Grids / karty */
.grid{display:grid;gap:18px}
.grid.cols-3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.grid.cols-2{grid-template-columns:repeat(auto-fit,minmax(360px,1fr))}
.grid.cols-1{grid-template-columns:1fr}

/* Karty linkowane (same kafle z listy przestrzeni) */
.card-link{display:block;border-radius:var(--br);overflow:hidden;border:1px solid var(--line);background:var(--card);transition:transform .35s ease, box-shadow .35s ease;height:100%}
.card-link .img{height:210px;background-size:cover;background-position:center;transition:transform .6s ease}
.card-link .body{ padding:var(--tile-pad) }
.card-link h3{ margin:0 0 8px; font-size:var(--fs-card-title); line-height:1.25 }
.card-link p{ color:var(--sub); font-size:var(--fs-card-text); line-height:1.5 }
.card-link:hover .img, .card-link:focus-visible .img{transform:scale(1.05)}
.card-link:hover, .card-link:focus-visible{box-shadow:0 10px 28px rgba(0,0,0,.12); transform:translateY(-2px)}
.card-link:focus-visible{outline:3px solid var(--text);outline-offset:4px}

/* Placeholder obrazka */
.img.placeholder{display:grid;place-items:center;background:repeating-linear-gradient(45deg,#e9ebf5,#e9ebf5 12px,#f6f7fb 12px,#f6f7fb 24px);color:#7f8596;font-size:14px}

/* Oferta (bloki poziome) */
.offer-row {display:flex;flex-direction:column;gap:20px}
.offer-block {display:flex;gap:20px;background:var(--card);border-radius:var(--br);overflow:hidden;border:1px solid var(--line)}
.offer-block .img {width:40%;background-size:cover;background-position:center}
.offer-block .body {padding:20px;display:flex;flex-direction:column;justify-content:center;width:60%}
.offer-block h3 {margin:0 0 8px}
.offer-block p {color:var(--sub);font-size:14px;line-height:1.5}
@media (max-width: 768px) {
  .offer-block {flex-direction:column}
  .offer-block .img,.offer-block .body {width:100%}
  .offer-block .img {height:200px}
}

/* === Kontakt: layout, separator i spacing (v3) === */
.contact-grid{
  display:grid;
  /* dwie elastyczne kolumny – wejdą już na ~700px */
  grid-template-columns: minmax(300px,1fr) minmax(300px,1fr);
  column-gap:28px;
  align-items:start;
}
.contact-grid > .left,
.contact-grid > .right{
  padding:24px;
}

/* pełna wysokość separatora: na prawej kolumnie */
.contact-grid > .right{ border-left:1px solid var(--line); }
@media (max-width:700px){
  .contact-grid{ grid-template-columns:1fr; row-gap:16px; }
  .contact-grid > .right{ border-left:0; border-top:1px solid var(--line); }
}

/* szersze ekrany – lewa 420px, reszta elastyczna */
@media (min-width:1280px){
  .contact-grid{
    grid-template-columns: 420px 1fr;
    column-gap:36px;
  }
}

/* typografia po lewej – równe odstępy */
.contact-grid .left h3{ margin:0 0 10px; }
.contact-grid .left p{  margin:0 0 14px; line-height:1.55; }
.contact-grid .left p:last-child{ margin-bottom:0; }

/* formularz: siatka pól + odstępy */
#contactForm .form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:16px;
  row-gap:14px;
}
#contactForm .field{ margin-bottom:14px; }
#contactForm .field label{ font-weight:600; margin-bottom:6px; }
#contactForm textarea{ min-height:170px; }
@media (max-width:700px){
  #contactForm .form-grid{ grid-template-columns:1fr; row-gap:12px; }
}

/* checkbox i przyciski */
.field.consent{ margin-top:14px; }
.checkbox{ align-items:center; }
.checkbox .box{ margin-top:0; }
#contactForm .actions{ margin-top:16px; gap:12px; }


/* Formularz + przełącznik zgody */
.switch{display:flex;align-items:center;gap:12px;color:var(--sub);font-size:14px;user-select:none}
.switch input{position:absolute;opacity:0;width:1px;height:1px;overflow:hidden}
.switch .track{position:relative;width:46px;height:26px;border-radius:999px;border:1px solid var(--line);background:color-mix(in oklab, var(--card) 92%, transparent);transition:background .25s ease, border-color .25s ease, box-shadow .25s ease;flex:0 0 46px}
.switch .thumb{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--card);box-shadow:0 1px 2px rgba(0,0,0,.15);transition:transform .25s ease, background .25s ease}
.switch input:checked + .track{background:var(--text);border-color:color-mix(in oklab, var(--text) 70%, var(--line))}
.switch input:checked + .track .thumb{transform:translateX(20px);background:#0c1020}
.switch input:focus-visible + .track{box-shadow:0 0 0 4px color-mix(in oklab, var(--text) 30%, transparent);outline:none}
.checkbox{
  display:flex; align-items:flex-start; gap:12px;
  font-size:14px; color:var(--sub); user-select:none; cursor:pointer;
}
.checkbox input{ position:absolute; opacity:0; pointer-events:none; }
.checkbox .box{
  width:22px; height:22px; margin-top:2px; flex:0 0 22px;
  border:1.8px solid var(--line); border-radius:6px;
  background:color-mix(in oklab, var(--card) 95%, transparent);
  display:inline-grid; place-items:center;
  transition:border-color .2s, background .2s, box-shadow .2s;
}
.checkbox .box::after{
  content:""; width:12px; height:6px;
  border:2px solid transparent;
  border-left-color:var(--card); border-bottom-color:var(--card);
  transform:rotate(-45deg) scale(.6); opacity:0;
  transition:opacity .12s, transform .2s ease;
}
.checkbox input:checked + .box{
  background:var(--text);
  border-color:color-mix(in oklab, var(--text) 70%, var(--line));
}
.checkbox input:checked + .box::after{
  opacity:1; transform:rotate(-45deg) scale(1);
}
.checkbox input:focus-visible + .box{
  box-shadow:0 0 0 3px color-mix(in oklab, var(--text) 25%, transparent);
}
.checkbox .label{ color:var(--text); line-height:1.5; }
.hint{ display:block; margin:6px 0 0; font-size:12px; color:var(--sub); }

/* Walidacja zgody */
.field.consent .error{ display:none; margin-top:6px; font-size:12px; color:#d33; }
.field.consent.invalid .error{ display:block; }
.field.consent.invalid .box{
  border-color:#d33; box-shadow:0 0 0 3px color-mix(in oklab, #d33 25%, transparent);
}

/* Pola formularza */
.field{display:flex;flex-direction:column;gap:6px}
.field input,.field textarea,.field select{background:color-mix(in oklab, var(--card) 96%, transparent);border:1px solid var(--line);border-radius:12px;padding:12px;color:var(--text);outline:none;appearance:none}
.field select{cursor:pointer}
.field input:focus,.field textarea:focus,.field select:focus{border-color:color-mix(in oklab, var(--text) 70%, var(--line));box-shadow:0 0 0 3px color-mix(in oklab, var(--text) 25%, transparent)}

.map-embed{position:relative;width:100%;aspect-ratio:16/9;border-top:1px solid var(--line)}
.map-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:0 0 var(--br) var(--br)}

/* Responsywność headera */
@media (min-width:1024px){
  :root{ --nav-h:80px }
  .brand img{ height:56px }
}