/* Cleaned styles – keep only base font */
html, body { font-family: 'Poppins', sans-serif; }



html, body{
  margin:0;
  padding:0;
  font-family:'Poppins',sans-serif;
}

/* HEADER: tło na full width */
.wt-header{
  position:relative;
  width:100%;
  min-height:220px;                 /* jak w makiecie – większy pas */
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}

/* DELIKATNY overlay (nie “czarna zasłona”) */
.wt-header::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    90deg,
    rgba(0,0,0,.35),
    rgba(0,0,0,.12)
  );
  pointer-events:none;
}

/* kontener 1200 */
.wt-header__inner{
  position:relative;
  max-width:1200px;
  margin:0 auto;
  padding:26px 16px 24px;
}

/* LOGO – osobny rząd, centrum */
.wt-header__top{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:0 0 14px;
}

.wt-header__logo{
  display:flex;
  align-items:center;
  text-decoration:none;
}

.wt-header__logo img{
  height:92px;
  width:auto;
  display:block;
  margin-bottom: 40px
}

/* DÓŁ – menu lewo, przycisk prawo */
.wt-header__bottom{
  display:flex;
  align-items:center;
  gap:24px;
}

/* menu lewo */
.wt-header__nav{
  flex:1 1 auto;
}

.wt-menu{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  gap:44px;
}

.wt-menu a{
  color:rgba(255,255,255,.92);
  text-decoration:none;
  font-weight:300;
  font-size:19px;
}

.wt-menu a:hover{
  color:#d0f20a;
}

/* button prawo */
.wt-header__cta{
  flex:0 0 auto;
  margin-left:auto;
}

.wt-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  padding:10px 28px;
  font-weight:400;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.02em;
}

.wt-btn--primary:hover{
color:#030303;
}

.wt-btn--primary{
  color:#fff;
  background: linear-gradient(180deg, #a6cf39, #5ea313);
  box-shadow: 0 10px 20px rgba(0,0,0,.25);
}

/* mobile */
@media (max-width: 980px){
  .wt-header{ min-height:180px; }
  .wt-menu{ display:none; }
}


/* --- Hamburger + mobile panel --- */
.wt-burger{
  display:none;
  width:46px;
  height:46px;
  border:1px solid rgba(255,255,255,.22);
  background: rgba(0,0,0,.18);
  border-radius:12px;
  position:relative;
  cursor:pointer;
}

.wt-burger span{
  position:absolute;
  left:12px;
  right:12px;
  height:2px;
  background:#fff;
  border-radius:2px;
  transition: transform .2s ease, top .2s ease, opacity .2s ease;
}
.wt-burger span:nth-child(1){ top:15px; }
.wt-burger span:nth-child(2){ top:22px; }
.wt-burger span:nth-child(3){ top:29px; }

/* animacja na X */
.wt-burger.is-open span:nth-child(1){ top:22px; transform: rotate(45deg); }
.wt-burger.is-open span:nth-child(2){ opacity:0; }
.wt-burger.is-open span:nth-child(3){ top:22px; transform: rotate(-45deg); }

.wt-mobile{
  position:relative;
}

.wt-mobile__inner{
  max-width:1200px;
  margin:0 auto;
  padding:12px 16px 18px;
}

.wt-menu--mobile{
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:10px 0 0;
}

.wt-menu--mobile a{
  font-size:20px;
}

.wt-btn--mobile{
  width:100%;
  margin-top:14px;
}

/* breakpoint */
@media (max-width: 980px){
  .wt-menu{ display:none; }               /* ukryj desktop menu */
  .wt-header__cta--desktop{ display:none; } /* ukryj desktop CTA */
  .wt-burger{ display:inline-block; }     /* pokaż hamburger */
}


/* --- FIX: na mobile nie chowaj całego .wt-menu, tylko desktop --- */
@media (max-width: 980px){

  /* chowamy tylko menu w dolnym pasku (desktop) */
  .wt-header__bottom > .wt-header__nav > .wt-menu{
    display: none;
  }

  /* pokazujemy hamburger */
  .wt-burger{
    display: inline-block;
  }

  /* CTA desktop znika */
  .wt-header__cta--desktop{
    display: none;
  }

  /* a MOBILE menu ma być widoczne */
  .wt-mobile .wt-menu--mobile{
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    margin: 0;
    padding: 12px 0 0;
  }

  .wt-mobile .wt-menu--mobile a{
    font-size: 18px;
  }

  /* BUTTON w panelu mobilnym – nie jako wielka belka */
  .wt-btn--mobile{
    width: auto;
    max-width: 240px;
    margin: 14px auto 0;
    padding: 14px 22px;
  }

  /* panel mobilny – trochę czytelniejszy */
  .wt-mobile__inner{
    padding: 12px 16px 18px;
  }
}


.mp-slider{
  position: relative;
}

/* ✅ Slider max 1200px (wyśrodkowany) */
.mp-slider .mp-container{
  max-width: 100%;
  margin: 0 auto;
  padding: 0 0px;
}

/* viewport */
.mp-slider__viewport{
  position: relative;
  overflow: hidden;

  /* ✅ bez zaokrągleń */
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* track */
.mp-slider__track{
  display: flex;
  width: 100%;
  transform: translate3d(0,0,0);
  transition: transform .45s ease;
}

/* slide */
.mp-slider__slide{
  position: relative;
  min-width: 100%;
  height: clamp(320px, 42vw, 520px);
  display: grid;
  align-items: center;

  /* ✅ bez zaokrągleń */
  border-radius: 0 !important;
}

/* obraz */
.mp-slider__media,
.mp-slider__img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.mp-slider__img{
  object-fit: cover;

  /* ✅ bez zaokrągleń */
  border-radius: 0 !important;
}

/* overlay */
.mp-slider__overlay{
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(0,0,0,.55) 0%,
    rgba(0,0,0,.25) 55%,
    rgba(0,0,0,0) 100%
  );
}

/* ✅ content – odsunięty od lewej, żeby nie przykrywała strzałka */
.mp-slider__content{
  position: relative;
  z-index: 4;            /* wyżej niż overlay */
  max-width: 680px;
  color: #fff;

  /* było 34px – teraz większy lewy padding przez strzałkę */
  padding: 34px;
  padding-left: 78px;    /* ✅ tu jest klucz */
}

/* title */
.mp-slider__title{
  margin: 0 0 10px 0;
  font-size: clamp(26px, 3.2vw, 44px);
  line-height: 1.1;
  font-weight: 500;
}

/* text */
.mp-slider__text{
  font-size: clamp(14px, 1.25vw, 18px);
  line-height: 1.6;
  opacity: .95;
  max-width: 56ch;
  font-weight: 200
}

/* button */
.mp-slider__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 18px;
  padding: 12px 20px;
  border-radius: 12px;
  text-decoration: none;
  background: #6fb72f;
  color: #fff;
  font-weight: 400;
}

.mp-slider__btn:hover{
  filter: brightness(1.05);
  color: #000
}

/* nav buttons */
.mp-slider__nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  cursor: pointer;

  z-index: 5; /* ✅ nad contentem */
  background: rgba(0,0,0,.35);
  backdrop-filter: blur(6px);
}

/* możesz lekko cofnąć strzałki bliżej krawędzi */
.mp-slider__nav--prev{ left: 12px; }
.mp-slider__nav--next{ right: 12px; }

.mp-slider__nav::before{
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  margin: auto;
  border-right: 3px solid #fff;
  border-bottom: 3px solid #fff;
  transform: rotate(135deg);
}

.mp-slider__nav--next::before{
  transform: rotate(-45deg);
}

/* dots */
.mp-slider__dots{
  position: absolute;
  left: 50%;
  bottom: 14px;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 6;
}

.mp-slider__dot{
  width: 9px;
  height: 9px;
  border-radius: 99px;
  border: 0;
  cursor: pointer;
  background: rgba(255,255,255,.45);
}

.mp-slider__dot.is-active{
  width: 22px;
  background: rgba(255,255,255,.95);
}

/* ✅ mobile */
@media (max-width: 768px){
  .mp-slider .mp-container{
    padding: 0 0px;
  }

  .mp-slider__content{
    padding: 22px;
    padding-left: 22px; /* bo strzałek i tak nie ma */
    max-width: 100%;
  }

  .mp-slider__overlay{
    background: linear-gradient(
      180deg,
      rgba(0,0,0,.20) 0%,
      rgba(0,0,0,.55) 100%
    );
  }

  .mp-slider__nav{
    display: none;
  }
}


.mp-slider__slide{
  height: 700px;
}

@media (max-width: 768px){
  .mp-slider__slide{
    height: 360px; /* albo 420px */
  }
}



/* ===== MP TILES (FINAL) ===== */

.mp-tiles{
  position: relative;
  padding: 70px 0 90px;
  background: #fff;
  overflow: hidden;
}

/* overlay na całą sekcję */
.mp-tiles__overlay{
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,.82);
  pointer-events: none;
  z-index: 1;
}

/* content 1200px */
.mp-tiles__container{
  position: relative;
  z-index: 2;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

/* ✅ tło na dole, 100% szerokości monitora, bez obcinania */
.mp-tiles::after{
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 100vw;
  height: 360px;                  /* możesz zwiększyć */
  transform: translateX(-50%);

  background-image: var(--mp-tiles-bg);
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: 100%;       /* ✅ bez obcinania */
   opacity: 1.99;
  z-index: 0;
}

/* ===== header ===== */
.mp-tiles__header{
  text-align: center;
  margin-bottom: 44px;
}

.mp-tiles__title{
  margin: 0 0 10px 0;
  font-size: clamp(32px, 3.4vw, 58px);
  line-height: 1.05;
  font-weight: 600;
  color: #0a8c8a;
}

.mp-tiles__title span{ color: #9cc63b; }

.mp-tiles__subtitle{
  margin: 0;
  font-size: clamp(15px, 1.2vw, 20px);
  color: #6b7280;
}

/* ===== grid ===== */
.mp-tiles__grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  background: transparent;
}

.mp-tiles__item{
  padding: 28px 26px 10px;
  text-align: center;
  border-right: 1px solid rgba(0,0,0,.12);
}

.mp-tiles__item:last-child{ border-right: 0; }

.mp-tiles__icon{
  height: 98px;
  display: grid;
  place-items: center;
  margin-bottom: 12px;
}

.mp-tiles__icon img{
  max-height: 102px;
  max-width: 160px;
  width: auto;
  height: auto;
}

.mp-tiles__item-title{
  margin: 0 0 14px 0;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.15;
  color: #1e5f71;
}

.mp-tiles__item-title span{ color: #9cc63b; }

.mp-tiles__text{
  font-size: 14px;
  line-height: 1.6;
  color: #6b7280;
  max-width: 34ch;
  margin: 0 auto;
}

.mp-tiles__linkwrap{
  display: block;
  text-decoration: none;
  color: inherit;
}

.mp-tiles__cta{
  display: flex;
  justify-content: center;
  margin-top: 40px;
}

.mp-tiles__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 16px 34px;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 400;
  color: #fff;
  background: linear-gradient(180deg, #b7df49 0%, #7bb72e 100%);
  box-shadow: 0 10px 22px rgba(0,0,0,.14);
}

.mp-tiles__btn:hover{ filter: brightness(1.05); color: #000 }

/* responsive */
@media (max-width: 992px){
  .mp-tiles__grid{ grid-template-columns: repeat(2, 1fr); }
  .mp-tiles__item:nth-child(2n){ border-right: 0; }
  .mp-tiles__item{ border-bottom: 1px solid rgba(0,0,0,.10); padding-bottom: 24px; }
  .mp-tiles__item:nth-last-child(-n+2){ border-bottom: 0; }
  .mp-tiles::after{ height: 860px;    }
}

@media (max-width: 560px){
  .mp-tiles{ padding: 52px 0 70px; }
  .mp-tiles__grid{ grid-template-columns: 1fr; }
  .mp-tiles__item{ border-right: 0; border-bottom: 0px solid rgba(0,0,0,.10); }
  .mp-tiles__item:last-child{ border-bottom: 0; }
  .mp-tiles::after{ height: 860px;    }
}


.mp-tiles__overlay{
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,.92) 0%,
    rgba(255,255,255,.88) 55%,
    rgba(255,255,255,.25) 100%
  );
}


.mp-tiles::after{
  opacity: 1 !important;   /* było .95 */
}


.mp-tiles__overlay{
  background: linear-gradient(
    180deg,
    rgba(255,255,255,.95) 0%,
    rgba(255,255,255,.85) 50%,
    rgba(255,255,255,.10) 100%
  );
}


/* FOOTER */
.wt-footer{
  position:relative;
  width:100%;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  color:rgba(255,255,255,.92);
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.wt-footer__overlay{
  position:absolute;
  inset:0;
  background: linear-gradient(90deg, rgba(0,0,0,.48), rgba(0,0,0,.22));
  pointer-events:none;
    background-size: cover;
  
}

.wt-footer__inner{
  position:relative;
  max-width:1200px;
  margin:0 auto;
  padding:48px 16px 34px;
  display:grid;
  grid-template-columns: 1.3fr 1fr 1fr 1.2fr;
  gap:36px;
}

.wt-footer__logo{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
  margin-bottom:14px;
}

.wt-footer__logo img{
  height:70px;
  width:auto;
  display:block;
}

.wt-footer__logoText{
  font-weight:800;
  font-size:28px;
  color:#fff;
}

.wt-footer__desc{
  margin:0 0 18px;
  line-height:1.55;
  font-size:14px;
  max-width:420px;
  color:rgba(255,255,255,.85);
}

.wt-footer__h{
  margin:0 0 14px;
  font-weight:300;
  font-size:18px;
  color:#d7e377;
}

.wt-footer__menu{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.wt-footer__menu a{
  color:rgba(255,255,255,.88);
  text-decoration:none;
  font-size:14px;
}

.wt-footer__menu a:hover{ color:#c0f50f; }

.wt-footer__cta{
  display:inline-flex;
  margin-top:8px;
}

/* socials */
.wt-footer__socials{
  display:flex;
  gap:12px;
  align-items:center;
  margin:10px 0 18px;
}

.wt-footer__soc{
  width:44px;
  height:44px;
  border-radius:50%;
  background: rgba(0,0,0,.25);
  border:1px solid rgba(255,255,255,.15);
  display:flex;
  align-items:center;
  justify-content:center;
}

.wt-footer__soc img{
  width:22px;
  height:22px;
  object-fit:contain;
  display:block;
}

/* contact rows */
.wt-footer__contactList{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.wt-footer__contactRow{
  display:flex;
  align-items:center;
  gap:12px;
  font-size:20px;
}

.wt-footer__contactRow a{
  color:rgba(255,255,255,.9);
  text-decoration:none;
  font-size: 14px
}

.wt-footer__contactRow a:hover{ color:#fff; }

/* proste ikonki CSS (bez fontów) */
.wt-ico{
  width:22px;
  height:22px;
  display:inline-block;
  opacity:.9;
  background-size:contain;
  background-repeat:no-repeat;
  background-position:center;
  filter: drop-shadow(0 2px 2px rgba(0,0,0,.25));
}

.wt-ico--phone{ background-image: radial-gradient(circle at 50% 50%, #9ad23b 0 55%, transparent 56%); }
.wt-ico--mail{ background-image: linear-gradient(135deg, #9ad23b, #5ea313); border-radius:4px; }
.wt-ico--pin{ background-image: radial-gradient(circle at 50% 35%, #9ad23b 0 40%, transparent 41%); border-radius:50%; }

/* bottom bar */
.wt-footer__bar{
  position:relative;
  border-top:1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.12);
}

.wt-footer__barInner{
  max-width:1200px;
  margin:0 auto;
  padding:18px 16px;
  display:flex;
  flex-wrap:wrap;
  gap:14px 24px;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:rgba(255,255,255,.75);
  font-size:14px;
}

.wt-footer__links{
  display:flex;
  gap:16px;
}

.wt-footer__links a,
.wt-footer__credit a{
  color:rgba(255,255,255,.78);
  text-decoration:none;
}

.wt-footer__links a:hover,
.wt-footer__credit a:hover{ color:#fff; }

/* responsive */
@media (max-width: 980px){
  .wt-footer__inner{
    grid-template-columns: 1fr;
    gap:28px;
    padding:34px 16px 26px;
  }
  .wt-footer__h{ font-size:16px; }
  .wt-footer__menu a,
  .wt-footer__contactRow{ font-size:14px; }
  .wt-footer__barInner{ font-size:12px; }
}


/* SVG ikonki w footer */
.wt-footer__contactRow{
  display:flex;
  align-items:center;
  gap:12px;
  font-size:14px;
  color:rgba(255,255,255,.9);
}

.wt-footer__svg{
  width:22px;
  height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#9ad23b; /* zielony jak na wzorze */
  filter: drop-shadow(0 2px 2px rgba(0,0,0,.25));
  flex: 0 0 auto;
}

.wt-footer__svg svg{
  width:100%;
  height:100%;
  display:block;
}


/* =========================
   REALIZACJE / Our Recent Projects
   FULL RESET STYLES (jak wzór)
   ========================= */

.wt-projects{
  position: relative;
  padding: 130px 0 120px;
  overflow: hidden;
  background: var(--wt-projects-bg, #0b151b);
  background-size: cover;
  background-position: center;
    background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

/* warstwa przyciemniająca + poświaty (jak na wzorze) */
.wt-projects::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 520px at 55% 35%, rgba(0,255,200,.18), transparent 60%),
    radial-gradient(900px 520px at 25% 65%, rgba(255,210,0,.10), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.70));
  pointer-events:none;
  z-index: 0;
}

/* kontener jak w demo (sekcja nie może być zbyt wąska) */
.wt-projects .wt-container,
.wt-projects__container{
  position: relative;
  z-index: 1;
  max-width: 1260px;
  margin: 0 auto;
  padding: 0 18px;
}

/* nagłówek */
.wt-projects__head{
  text-align: center;
  margin: 0 0 26px;
}

.wt-projects__title{
  margin: 0;
  font-size: clamp(34px, 4.6vw, 48px);
  font-weight: 500;
  line-height: 1.06;
  color: rgba(255,255,255,.95);
  text-shadow: 0 2px 26px rgba(0,0,0,.55);
}

.wt-projects__subtitle{
  margin: 10px auto 0;
  max-width: 600px;
  font-size: clamp(14px, 1.55vw, 20px);
  color: rgba(255,255,255,.78);
  text-shadow: 0 2px 18px rgba(0,0,0,.45);
}

/* ====== GRID KAFELKÓW (KLUCZ) ======
   zamiast grid, robimy FLEX jak w tym wzorze:
   stała szerokość kafli, wyśrodkowane, zawijanie
*/
.wt-projects__grid{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 18px;
  margin: 26px auto 0;
  max-width: 1180px; /* blok kafli nie rozciąga się na całą sekcję */
}

/* kafel jak na wzorze */
.wt-projects__card{
  display: block !important;
  width: 265px;                 /* szerokość kafla jak na screenie */
  height: 345px;                /* wysokość kafla jak na screenie */
  border-radius: 18px;
  overflow: hidden;
  text-decoration: none;
  position: relative;

  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.16);
  box-shadow:
    0 18px 55px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.10);

  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);

  transform: translateZ(0);
}

.wt-projects__card:hover{
  transform: translateY(-2px);
  border-color: rgba(255,255,255,.26);
  box-shadow:
    0 22px 70px rgba(0,0,0,.45),
    inset 0 1px 0 rgba(255,255,255,.12);
}

/* obraz */
.wt-projects__card-media{
  width: 100%;
  height: 100%;
}

.wt-projects__img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  display: block;
  filter: saturate(1.03) contrast(1.05);
}

/* dolny gradient + teksty */
.wt-projects__card-meta{
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 18px 18px 16px;
  background: linear-gradient(180deg,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,.40) 15%,
    rgba(0,0,0,.68) 100%
  );
}

.wt-projects__card-title{
  margin: 0 0 6px;
  font-size: 26px;
  font-weight: 400;
  text-align: center;
  line-height: 1.1;
  color: rgba(255,255,255,.95);
  text-shadow: 0 2px 14px rgba(0,0,0,.55);
}

.wt-projects__card-subtitle{
  margin: 0;
  font-size: 18px;
  font-weight: 300;
  text-align: center;
  color: rgba(190,255,120,.95);
  text-shadow: 0 2px 14px rgba(0,0,0,.60);
}

/* “glow” na dole kafla jak na wzorze */
.wt-projects__card-glow{
  position: absolute;
  left: 14%;
  right: 14%;
  bottom: 10px;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg,
    rgba(140,255,60,0),
    rgba(140,255,60,.75),
    rgba(140,255,60,0)
  );
  opacity: .65;
  pointer-events: none;
}

/* CTA + przycisk */
.wt-projects__cta{
  margin-top: 26px;
  display: flex;
  justify-content: center;
}

.wt-projects__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 360px;
  padding: 14px 26px;

  border-radius: 12px;
  text-decoration: none;

  font-weight: 500;
  letter-spacing: .9px;
  text-transform: uppercase;

  color: rgba(255,255,255,.95);
  background: linear-gradient(180deg, #98d73a 0%, #6cab17 100%);
  border: 1px solid rgba(0,0,0,.25);
  box-shadow:
    0 16px 44px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.25);
}

.wt-projects__btn:hover{
  filter: brightness(1.04);
}

/* responsywność */
@media (max-width: 640px){
  .wt-projects{ padding: 55px 0 65px; }

  .wt-projects__grid{
    gap: 14px;
    padding: 0 6px;
  }

  .wt-projects__card{
    width: min(92vw, 360px);
    height: 320px;
  }

  .wt-projects__btn{
    min-width: min(92vw, 360px);
  }
}


/* KAFEL – tylko obraz (media + img) */
.wt-projects__card-media{
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  border-radius: 18px; /* żeby obraz trzymał zaokrąglenie kafla */
}

/* obraz ma wypełniać kafel i wyglądać "miękko" jak na screenie */
.wt-projects__card-media .wt-projects__img{
  width: 100% !important;
  height: 100% !important;
  display: block;
  object-fit: cover;
  object-position: center;

  /* to daje efekt jak na podglądzie */
  filter: blur(0.2px) saturate(1.05) contrast(1.05) brightness(0.92);
  transform: scale(1.03);
}


.mp-tiles2{
  position: relative;
  padding: 90px 0 70px;
  color: #eaf2f4;
  overflow: hidden;
  background: #081319;
}

/* tło z CSS variable */
.mp-tiles2__bg{
  position: absolute;
  inset: 0;
  background-image: var(--mp-tiles2-bg, none);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  filter: saturate(1.08) contrast(1.06);
  z-index: 0;
}

/* ciemna mgła + neon */
.mp-tiles2__overlay{
  position: absolute;

  
  inset: 0;
  background:
    radial-gradient(900px 420px at 50% 22%, rgba(83,255,231,.18), transparent 60%),
    radial-gradient(900px 420px at 85% 75%, rgba(170,255,79,.16), transparent 60%),
    linear-gradient(180deg, rgba(3,10,14,.84) 0%, rgba(3,10,14,.62) 55%, rgba(3,10,14,.88) 100%);
  z-index: 1;
  
}

.mp-tiles2__container{
  position: relative;
  z-index: 2;
  max-width: 1200px;
  margin: 0 auto;
    padding-top: 40px;
  padding-bottom: 100px;
}

/* header */
.mp-tiles2__header{
  text-align: center;
  max-width: 920px;
  margin: 0 auto 42px;
}

.mp-tiles2__title{
  margin: 0 0 10px;
  font-size: clamp(34px, 3.4vw, 60px);
  line-height: 1.05;
  font-weight: 600;
  color: #dff6f7;
  text-shadow: 0 10px 40px rgba(0,0,0,.45);
}

.mp-tiles2__title span{ color: #9eea4b; }

.mp-tiles2__subtitle{
  margin: 0;
  font-size: clamp(15px, 1.15vw, 20px);
  color: rgba(234,242,244,.78);
}

/* grid */
.mp-tiles2__grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  margin-top: 26px;
}

/* glass card */
.mp-tiles2__card{
  position: relative;
  border-radius: 14px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 18px 45px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.12);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  min-height: 320px;
  overflow: hidden;
}

.mp-tiles2__cardlink{
  display: block;
  padding: 26px 22px 22px;
  color: inherit;
  text-decoration: none;
}

.mp-tiles2__card::after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius: 14px;
  pointer-events:none;
  background: linear-gradient(180deg, rgba(83,255,231,.18), rgba(158,234,75,.10));
  opacity: .55;
  mask: linear-gradient(#000, #000) content-box, linear-gradient(#000,#000);
  -webkit-mask: linear-gradient(#000, #000) content-box, linear-gradient(#000,#000);
  mask-composite: exclude;
  -webkit-mask-composite: xor;
  padding: 1px;
}

.mp-tiles2__iconwrap{
  position: relative;
  width: 186px;
  height: 162px;
  margin: 0 auto 16px;
  display: grid;
  place-items: center;
}

.mp-tiles2__icon{
  max-height: 156px;
  max-width: 186px;
  
  width: auto;
  height: auto;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.45));
}

.mp-tiles2__spark{
  position:absolute;
  right: -6px;
  top: -6px;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255,255,255,1) 0%, rgba(158,234,75,.9) 35%, transparent 70%);
  box-shadow: 0 0 20px rgba(158,234,75,.65);
  opacity: .9;
}

.mp-tiles2__card-title{
  margin: 0 0 12px;
  text-align: center;
  font-size: 18px;
  line-height: 1.15;
  font-weight: 400;
  color: #b3c468;
}

.mp-tiles2__card-title span{ color: #9eea4b; }

.mp-tiles2__text{
  margin: 0;
  text-align: center;
  font-size: 12.5px;
  line-height: 1.7;
  color: rgba(234,242,244,.78);
  max-width: 32ch;
  margin-inline: auto;
}

/* CTA */
.mp-tiles2__cta{
  margin-top: 34px;
  padding-top: 26px;
  display: flex;
  
  justify-content: space-between;
  gap: 18px;
  border-top: 1px solid rgba(255,255,255,.12);
}

.mp-tiles2__cta-text{
  display: grid;
  gap: 6px;
  color: rgba(234,242,244,.86);
}

.mp-tiles2__cta-text strong{
  font-size: clamp(14px, 1.6vw, 19px);
  line-height: 1.2;
  font-weight:300;
  color: #eaf2f4;
  text-align: center;
}

.mp-tiles2__cta-text span{ color: rgba(234,242,244,.72); }

.mp-tiles2__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 26px;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 400;
  letter-spacing: .5px;
  color: #ffffff;
  background: linear-gradient(180deg, #b7df49 0%, #7bb72e 100%);
  box-shadow: 0 14px 28px rgba(0,0,0,.35);
  white-space: nowrap;
}

.mp-tiles2__btn:hover{ filter: brightness(1.06); color: #000 }

/* responsive */
@media (max-width: 1100px){
  .mp-tiles2__grid{ grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 620px){
  .mp-tiles2{ padding: 70px 0 60px; }
  .mp-tiles2__grid{ grid-template-columns: 1fr; }
  .mp-tiles2__cta{
    flex-direction: column;
    align-items: flex-start;
  }
  .mp-tiles2__btn{ width: 80%; }
  .mp-tiles2 {
	  padding-left: 30px;
padding-right: 30px;	  }
}


/* Container 1200px jak ustaliliśmy */
.wt-container{
  max-width:1200px;
  margin:0 auto;
  padding:0 16px;
}

.wt-about{
  position:relative;
  width:100%;
  background-image: var(--wt-about-bg);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  overflow:hidden;
  padding: 106px 0;
}

/* delikatny “film” jak na grafice */
.wt-about__overlay{
  position:absolute;
  inset:0;
  background:
    radial-gradient(1200px 600px at 25% 30%, rgba(255,255,255,.92) 0%, rgba(255,255,255,.55) 35%, rgba(255,255,255,0) 70%),
    linear-gradient(90deg, rgba(255,255,255,.72) 0%, rgba(255,255,255,.08) 55%, rgba(0,0,0,.15) 100%);
  pointer-events:none;
}

.wt-about__container{ position:relative; }

.wt-about__grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 28px;
  align-items:center;
  min-height: 420px;
}

/* LEWA kolumna (tytuł/tekst/button) */
.wt-about__left{
  max-width: 560px;
}

.wt-about__title{
  margin:0 0 14px;
  font-size: 56px;
  line-height: 1.05;
  font-weight: 500;
  color:#08494b; /* zbliżony do wzoru */
}

.wt-about__text{
  font-size: 15px;
  line-height: 1.75;
  color: rgba(10,20,25,.70);
}

.wt-about__cta{ margin-top: 22px; }

/* Prawa kolumna (ikona/obraz) */
.wt-about__right{
  display:flex;
  justify-content:flex-end;
  align-items:flex-end;
  min-height: 420px;
}

.wt-about__icon{
  width: min(520px, 100%);
  height:auto;
  display:block;
  filter: drop-shadow(0 24px 40px rgba(0,0,0,.25));
}

/* Mobile */
@media (max-width: 980px){
  .wt-about{
    padding: 96px 0;
  }
  .wt-about__grid{
    grid-template-columns: 1fr;
    min-height: unset;
  }
  .wt-about__right{
    justify-content:center;
    min-height: unset;
    margin-top: 10px;
  }
  .wt-about__title{
    font-size: 40px;
  }
  .wt-about__text{
    font-size: 18px;
  }
}


/* Contact module */
.wt-contact{
  padding: 70px 0;
}

.wt-container{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
}

.wt-contact__inner{
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 48px;
  align-items: start;
}

.wt-contact__title{
  margin: 0 0 14px;
  font-size: 44px;
  line-height: 1.05;
  font-weight: 800;
  color: #0f5a5e;
}

.wt-contact__text{
  font-size: 16px;
  line-height: 1.75;
  color: #4b4b4b;
  max-width: 540px;
}

.wt-contact__list{
  margin-top: 22px;
  display: grid;
  gap: 14px;
}

.wt-contact__row{
  display: grid;
  grid-template-columns: 26px 1fr;
  gap: 12px;
  align-items: start;
}

.wt-contact__ico{
  width: 22px;
  height: 22px;
  color: #9ad23b;           /* SVG kolor */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
}
.wt-contact__ico svg{
  width: 22px;
  height: 22px;
  display:block;
}

.wt-contact__label{
  font-size: 13px;
  color: #7a7a7a;
  margin-bottom: 2px;
}

.wt-contact__value{
  font-size: 16px;
  color: #1f1f1f;
  text-decoration: none;
}
a.wt-contact__value:hover{
  text-decoration: underline;
}

.wt-contact__right{
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 12px 40px rgba(0,0,0,.08);
  padding: 22px;
}

.wt-contact__form--empty{
  font-size: 14px;
  color: #666;
}

/* Responsive */
@media (max-width: 980px){
  .wt-contact{
    padding: 40px 0;
  }
  .wt-contact__inner{
    grid-template-columns: 1fr;
    gap: 26px;
  }
  .wt-contact__title{
    font-size: 34px;
  }
  .wt-contact__right{
    padding: 18px;
  }
}

.butoaut .wt-about__cta {
display: none;	
	
}


/* ==============================
   CF7 – styl formularza (moduł kontakt)
   ============================== */

/* kontener formularza (prawa kolumna) */
.wt-contact__form .wpcf7{
  width:100%;
}

/* CF7 często wrzuca wszystko w <p> + <br> */
.wt-contact__form .wpcf7 form p{
  margin:0;
}
.wt-contact__form .wpcf7 form br{
  display:none;
}

/* odstępy między polami */
.wt-contact__form .wpcf7-form-control-wrap{
  display:block;
  margin:0 0 14px;
}

/* wspólne dla input/textarea */
.wt-contact__form .wpcf7-form-control{
  width:100%;
  box-sizing:border-box;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.18);
  background: rgba(10,18,28,.45);
  color:#fff;
  font-family:'Poppins', sans-serif;
  font-size:16px;
  line-height:1.2;
  padding:14px 14px;
  outline:none;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

/* textarea */
.wt-contact__form textarea.wpcf7-form-control{
  min-height:140px;
  resize:vertical;
  padding-top:14px;
}

/* placeholder */
.wt-contact__form .wpcf7-form-control::placeholder{
  color: rgba(255,255,255,.65);
}

/* focus */
.wt-contact__form .wpcf7-form-control:focus{
  border-color: rgba(154,210,59,.9);
  box-shadow: 0 0 0 3px rgba(154,210,59,.18);
  background: rgba(10,18,28,.55);
}

/* submit */
.wt-contact__form input.wpcf7-submit{
  width:100%;
  border:0;
  cursor:pointer;
  border-radius:14px;
  padding:16px 18px;
  font-weight:800;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:#fff;
  background: linear-gradient(180deg, #a6cf39, #5ea313);
  box-shadow: 0 10px 20px rgba(0,0,0,.25);
  transition: transform .12s ease, filter .2s ease, box-shadow .2s ease;
}

.wt-contact__form input.wpcf7-submit:hover{
  filter: brightness(1.03);
  box-shadow: 0 12px 26px rgba(0,0,0,.28);
}

.wt-contact__form input.wpcf7-submit:active{
  transform: translateY(1px);
}

/* spinner */
.wt-contact__form .wpcf7-spinner{
  margin-left:10px;
  vertical-align:middle;
}

/* komunikaty / walidacja */
.wt-contact__form .wpcf7-not-valid-tip{
  margin-top:8px;
  font-size:13px;
  color:#ffb3b3;
}

.wt-contact__form .wpcf7-response-output{
  margin:14px 0 0;
  padding:12px 14px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.25);
  color:#fff;
  font-size:14px;
}

/* kolory ramek komunikatów */
.wt-contact__form .wpcf7 form.invalid .wpcf7-response-output{
  border-color: rgba(255,120,120,.55);
}
.wt-contact__form .wpcf7 form.sent .wpcf7-response-output{
  border-color: rgba(154,210,59,.6);
}

/* input error */
.wt-contact__form .wpcf7-not-valid{
  border-color: rgba(255,120,120,.7) !important;
  box-shadow: 0 0 0 3px rgba(255,120,120,.12) !important;
}

/* mobile */
@media (max-width: 820px){
  .wt-contact__form .wpcf7-form-control{
    font-size:15px;
    padding:13px 13px;
  }
  .wt-contact__form input.wpcf7-submit{
    padding:15px 16px;
  }
}



.mp-tiles {
  position: relative;
  overflow: hidden;
  padding: 90px 0 80px;
  background-image: var(--mp-tiles-bg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.mp-tiles__overlay {
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.88);
  pointer-events: none;
}

.mp-tiles__container {
  position: relative;
  z-index: 2;
  max-width: 1500px;
  width: 100%;
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}

.mp-tiles__header {
  text-align: center;
  max-width: 980px;
  margin: 0 auto 50px;
}

.mp-tiles__title {
  margin: 0 0 14px;
  font-size: 58px;
  line-height: 1.08;
  font-weight: 700;
  color: #0e8f95;
}

.mp-tiles__title span {
  color: #9ac43c;
}

.mp-tiles__subtitle {
  margin: 0;
  font-size: 20px;
  line-height: 1.7;
  color: #5f6773;
}

.mp-tiles__grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  align-items: start;
  width: 100%;
}

.mp-tiles__item {
  position: relative;
  text-align: center;
  padding: 0 22px;
  min-width: 0;
}

.mp-tiles__item:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 10px;
  right: 0;
  width: 1px;
  height: calc(100% - 20px);
  background: rgba(0, 0, 0, 0.08);
}

.mp-tiles__linkwrap {
  display: block;
  text-decoration: none;
  color: inherit;
  height: 100%;
}

.mp-tiles__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100px;
  margin-bottom: 18px;
}

.mp-tiles__icon img {
  display: block;
  max-width: 84px;
  max-height: 84px;
  width: auto;
  height: auto;
  margin: 0 auto;
}

.mp-tiles__item-title {
  margin: 0 0 14px;
  font-size: 19px;
  line-height: 1.25;
  font-weight: 700;
  color: #1e5d78;
}

.mp-tiles__item-title span {
  color: #9ac43c;
}

.mp-tiles__text {
  font-size: 15px;
  line-height: 1.55;
  color: #6a7079;
}

.mp-tiles__text p {
  margin: 0;
}

.mp-tiles__cta {
  margin-top: 50px;
  text-align: center;
}

.mp-tiles__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 190px;
  min-height: 58px;
  padding: 14px 34px;
  border-radius: 14px;
  background: #9ac43c;
  color: #ffffff;
  text-decoration: none;
  font-size: 17px;
  font-weight: 700;
  transition: all 0.3s ease;
}

.mp-tiles__btn:hover {
  background: #86ae2d;
  color: #ffffff;
  transform: translateY(-2px);
}

@media (max-width: 1400px) {
  .mp-tiles__container {
    max-width: 1350px;
  }

  .mp-tiles__item {
    padding: 0 18px;
  }

  .mp-tiles__title {
    font-size: 50px;
  }

  .mp-tiles__item-title {
    font-size: 18px;
  }

  .mp-tiles__text {
    font-size: 14px;
  }
}

@media (max-width: 1200px) {
  .mp-tiles {
    padding: 80px 0 70px;
  }

  .mp-tiles__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 35px 0;
  }

  .mp-tiles__item::after {
    display: none !important;
  }

  .mp-tiles__title {
    font-size: 44px;
  }

  .mp-tiles__subtitle {
    font-size: 18px;
  }
}

@media (max-width: 991px) {
  .mp-tiles {
    padding: 70px 0 60px;
  }

  .mp-tiles__header {
    margin-bottom: 40px;
  }

  .mp-tiles__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px;
  }

  .mp-tiles__item {
    padding: 0 14px;
  }

  .mp-tiles__title {
    font-size: 38px;
  }

  .mp-tiles__item-title {
    font-size: 20px;
  }

  .mp-tiles__text {
    font-size: 15px;
  }
}

@media (max-width: 767px) {
  .mp-tiles {
    padding: 60px 0 50px;
  }

  .mp-tiles__header {
    margin-bottom: 34px;
  }

  .mp-tiles__title {
    font-size: 32px;
    line-height: 1.15;
  }

  .mp-tiles__subtitle {
    font-size: 16px;
    line-height: 1.6;
  }

  .mp-tiles__grid {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .mp-tiles__item {
    padding: 0;
    max-width: 420px;
    margin: 0 auto;
  }

  .mp-tiles__icon {
    min-height: auto;
    margin-bottom: 14px;
  }

  .mp-tiles__icon img {
    max-width: 78px;
    max-height: 78px;
  }

  .mp-tiles__item-title {
    font-size: 22px;
    margin-bottom: 10px;
  }

  .mp-tiles__text {
    font-size: 15px;
  }

  .mp-tiles__cta {
    margin-top: 34px;
  }

  .mp-tiles__btn {
    min-width: 180px;
    min-height: 54px;
    padding: 12px 28px;
    font-size: 16px;
  }
}