@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@500;600;700&display=swap");

/* RESET */
*{border:0;margin:0;padding:0}
*,:after,:before{box-sizing:border-box}:after,:before{display:inline-block}
body,html{height:100%;scroll-behavior: smooth;}
body{line-height:1;scrollbar-gutter:stable;-ms-text-size-adjust:100%;-moz-text-size-adjust:100%;-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Poppins;font-size:1rem;color:#000;min-width:20rem;}
button,input,textarea{background-color:transparent;color:inherit;font-family:inherit;font-size:inherit;line-height:inherit}
input,textarea{width:100%}
label{display:inline-block}
button,option,select{cursor:pointer}
a{color:inherit;display:inline-block;text-decoration:none}
ul li{list-style:none}
img{height:auto;max-width:100%;vertical-align:middle}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}

/* WRAPPER */
.wrapper{display:flex;flex-direction:column;min-height:100%;overflow:clip;background:#f8f8f8;}
.wrapper>main{flex:1 1 auto}
.wrapper>*{min-width:0}
[class*=__container]{margin:0 auto;max-width:79.375rem;padding-left:.9375rem;padding-right:.9375rem}

/* HEADER */
.header{}
.header__container{pointer-events:auto}
.header__body{align-items:center;display:flex;padding-block:1.3125rem;justify-content: space-between;gap: 1rem;}
.header__logo,.header__link-logo{color:#000;font-size:2.375rem;font-weight:700}
.header__logo{max-width:156px;}
.header__logo img{width:100%;height:auto;object-fit:cover;}
.menu__list{align-items:center;color:#000;display:flex;gap:1.875rem;justify-content:center;flex-wrap:wrap}
.menu__link{font-size:1.125rem;font-weight:500;line-height:100%;padding:.625rem}
.icon-menu{display:none}
.button{display:inline-flex;padding:0}
.button--fw{width:100%}

.logo{display:flex;justify-content:space-between;align-items:center;gap:1rem;}
.header__logo-title{color:#a01b1b;font-size:40px;font-weight:700}
/* BUTTONS */
.btn{border-radius:.625rem;color:#fff;cursor:pointer;padding:1.25rem 1.875rem}
.btn-primary,.btn-secondary{background:#a01b1b}
.btn-secondary{border:.0625rem solid rgba(160,27,27,.7);color:#fff}
.btn:hover{color:#fff}

/* HERO */
.page__hero{min-height:100%;padding-top:3.75rem}
.hero .container__hero{align-items:center;display:flex;gap:1.875rem;justify-content:space-between;flex-wrap:wrap;padding-bottom:2rem;}
.hero__content-left{max-width:35rem;flex:1 1 300px}
.hero__content-right{align-self:flex-end;flex:1 1 300px}
.hero__actions{display:flex;gap:.9375rem;flex-wrap:wrap}
.head__title{color:#000}
.head__title--big{font-weight:700;line-height:1.3;font-size:clamp(1.5rem,.95rem + 2.73vw,3.125rem)}
.head__text{color:#000;font-size:1.25rem;font-weight:500;padding-top:.625rem;padding-bottom:2.5rem;line-height:1.875rem;}
.hero__content-right{display:flex;align-items:flex-end;gap:1rem;position:relative;}
.hero__image:nth-child(1){box-shadow: -15px 0px 20px rgba(0, 0, 0, 0.3);}
.hero__image:nth-child(2){box-shadow: 15px 0px 20px rgba(0, 0, 0, 0.3);transform: translateX(-2rem);}
.hero__image{overflow: hidden;clip-path: polygon(15% 0%, 100% 0%, 85% 100%, 0% 100%);}
.hero__image-deco{max-width:4rem;position:absolute}
.hero__image-deco img{height:100%;object-fit:cover;width:100%;}
.decor-item-1{left:6%;top:9%}
.decor-item-2{bottom:10%;left:40%}
.decor-item-2 img{transform:rotate(-45deg)}
.decor-item-3{bottom:50%;right:1%}
.hero__image-picture{object-fit:cover;width:100%;}
.hero__facts{gap:3.125rem;justify-content:center;align-items:center;padding-top:2.5rem;display:flex;flex-wrap:wrap}
.hero__facts-item{display:flex;flex-direction:column;align-items:center;gap:.625rem}
.item-fact{transition: transform 250ms ease-in-out}
.item-fact:hover{transform: scale(1.1)}
.item-fact__title{color:#a01b1b;font-family:Avenir;font-size:1.875rem;font-weight:900;line-height:3.75rem}
.item-fact__description{display:flex;flex-direction:column;align-items:center;justify-content:center}
.item-fact__image{max-width:4rem}
.item-fact__image picture img{width:100%;height:100%;object-fit:cover}
.item-fact__label{color:#000;padding-top:.625rem}

.hero__footer{align-items:center;background:hsla(0,0%,75%,.2);display:flex;font-size:1.375rem;gap:3.125rem;overflow:hidden;padding-block:1.25rem;white-space:nowrap;flex-wrap:wrap;}
.hero__footer-item{align-items:center;display:flex;gap:.625rem}
.hero__footer-item__image{max-width:3.125rem}
.hero__footer-item__image img{filter:invert(17%) sepia(77%) saturate(7495%) hue-rotate(355deg) brightness(88%) contrast(98%);height:100%;object-fit:contain;width:100%}

/* SEKCJE USŁUGI */
.section{padding-block:1rem 3rem}
.subtitle{font-size:2rem;margin-bottom:1rem;color:#a01b1b;position:relative;display: inline-block}
.subtitle::after{content:"";position:absolute;bottom:-30%;left:0;background-color:#a01b1b;height:.25rem;width:60px; transition: width .5s ease}
.subtitle:hover.subtitle::after{width: 100%}
.section-lead{margin-bottom:2rem;font-weight:500;font-size:1.125rem; line-height:1.325rem;margin-top:1rem;}
.grid.services{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem}
.card{background:#fff;padding:1.5rem;border-radius:.625rem;box-shadow:0 5px 20px rgba(0,0,0,.15);display: flex;flex-direction: column;justify-content: space-between;gap:2rem; transition: transform 350ms ease-in-out}
.card:hover{transform: scale(1.05)}
.card-title{font-size:1.25rem;color:#a01b1b;}
.card-description{line-height:1.7rem;margin-top:1rem;}
.card-list{display:flex;flex-wrap:wrap;flex-direction: column;gap:1.5rem}
.card h3{font-size:1.25rem;margin-bottom:.5rem}
/*.card p{margin-bottom:2rem}*/
.list li{margin-bottom:.5rem}

/* DLACZEGO MY */
.grid.reasons{display:flex;gap:2rem;flex-wrap:wrap;justify-content:center;margin-top:2rem}
.reason{display:flex;flex-direction:column;align-items:center;text-align:center}
.kpi{font-size:2rem;font-weight:700;color:#a01b1b;margin-bottom:.5rem}

/* OPINIE */
.grid.testimonials{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-top:1rem}
.quote{background:#fff;padding:1.5rem;border-radius:.625rem;box-shadow:0 5px 20px rgba(0,0,0,.15)}
.quote p{line-height:1.5rem;}
.quote footer{margin-top:1rem;font-weight:500;font-size:.875rem;color:#555}

/* KONTAKT */
.contact{display:flex;flex-wrap:wrap;gap:2rem}
.contact__content{display:flex;align-items: center;gap: 2rem;}
.contact__image{max-width: 96px;}
.contact__image img{width:100%;height:100%;object-fit:cover}
.contact-text{flex:1;min-width:250px}
.contact-text h2{font-size:2rem;margin-bottom:1rem;margin-left:1rem;}
.form{flex:1;min-width:250px;display:flex;flex-direction:column;gap:1rem;max-width: 700px;margin: 0 auto;}
.form p label{font-size:1rem;margin-bottom:0.75rem;font-weight:600;}
.form input,.form textarea{padding:.75rem;border:1px solid #ccc;border-radius:.625rem;font-size:1rem; background-color:#ffffff; }
.form__input-message {resize: none;}
.form__input-message::placeholder {padding-top: 0.25rem;}
.trust{display:flex;flex-direction:column;gap:1rem;padding-top:1rem;flex-wrap:wrap;}
.subtitle-napisz{margin-bottom: 2rem;display: flex;justify-content: center}
.napisz__header{display: flex;align-items: center; justify-content: center;margin-bottom: 1rem;}
.subtitle-napisz::after{content: unset;}
.napisz__subtitle-decor{max-width: 285px;animation: shake 1.5s ease-in-out infinite;}
.napisz__subtitle-decor img{width:100%;height:auto;object-fit:cover}
.trust li{font-size:.875rem;font-weight:500}
.napisz__content{display: flex;align-items:center;justify-content: space-evenly;}
/* Kontakt-logo*/
.kontakt-logo{width:96px;margin-top:1rem;}
.kontakt-logo img{width:100%;object-fit:cover;}
.flash-message {
  background: #a01b1b;
  padding: 20px 30px;
  font-size: 20px;
  font-weight: 700;
  color: #ffffff;
  border-radius: 6px;
  margin: 20px auto;
  width: fit-content;
  text-align: center;
  box-shadow:0 15px 20px rgba(0,0,0,.25);
  animation: fadeIn 0.3s ease-in-out;
}
.d-none{display: none;}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* FOOTER */
.footer{background:#a01b1b;color:#fff;padding:2rem 0;}

/* MEDIA QUERIES */
@media (max-width:47.99875em){
  .page__hero{min-height:100svh; padding-top: unset;}
  .menu__body{left:100%;overflow:auto;padding:3.125rem .9375rem 1.875rem}
  .menu__body,.menu__body:before{position:fixed;top:0;transition:left .3s;width:100%}
  .menu__body:before{content:"";height:4.375rem;left:-100%;z-index:2}
  [data-fls-menu-open] .menu__body,[data-fls-menu-open] .menu__body:before{left:0}
  .icon-menu{display:block;height:1.125rem;position:relative;width:1.875rem;z-index:5}
  .icon-menu span,.icon-menu:after,.icon-menu:before{background-color:#000;content:"";height:.125rem;position:absolute;right:0;transition:all .3s ease 0s;width:100%}
  .icon-menu:before{top:0}
  .icon-menu:after{bottom:0}
  .icon-menu span{top:calc(50% - .0625rem)}
  [data-fls-menu-open] .icon-menu span{width:0}
  [data-fls-menu-open] .icon-menu:before{top:calc(50% - .0625rem);transform:rotate(-45deg)}
  [data-fls-menu-open] .icon-menu:after{bottom:calc(50% - .0625rem);transform:rotate(45deg)}

  .hero .container__hero{flex-direction:column;align-items:center; gap:unset; }
  .header__logo-title{font-size:20px;text-align: right}
  .hero__content-left,.hero__content-right{max-width:100%;flex:1 1 auto;text-align:center}
  .hero__actions{justify-content:center}
  .hero__footer{flex-direction:column;gap:1rem;font-size:1rem}
  .grid.services,.grid.testimonials{grid-template-columns:1fr}
  .grid.reasons{flex-direction:column;gap:1.5rem}
  .contact{flex-direction:column}
  .form,input,textarea{width:100%}
  .kontakt-logo{margin:1rem auto 0;}
  .napisz__content{flex-direction:column; gap:2rem}
  .napisz__subtitle-decor{max-width: 126px;}
  .hero__content-right{display:flex;align-items:flex-end;gap:1rem;flex-direction:column;width:100%}
  .hero__image:first-child{box-shadow: unset;align-self: flex-start;}
  .hero__image:last-child{box-shadow: unset;}
  .hero__image{max-width: 320px;}
}
@media (max-width:20em){.head__title--big{font-size:1.5rem}

}

@keyframes shake {
  0%, 100% { transform: rotate(0deg); }
  20% { transform: rotate(6deg); }
  40% { transform: rotate(-6deg); }
  60% { transform: rotate(1deg); }
  80% { transform: rotate(-1deg); }
}

/* GALLERY SLIDER */
.gallery-section{padding-block:3rem;overflow:hidden;background:#f8f8f8}
.gallery__container{max-width:100%;padding:0}
.gallery-slider{position:relative;width:100%;overflow:hidden}
.gallery-track{display:flex;gap:1.5rem;animation:scroll 80s linear infinite;will-change:transform}
.gallery-track:hover{animation-play-state:paused}
.gallery-slide{flex:0 0 auto;width:clamp(250px,30vw,400px);height:clamp(200px,25vw,320px);border-radius:.625rem;overflow:hidden;box-shadow:0 5px 20px rgba(0,0,0,.15);transition:transform .3s ease}
.gallery-slide:hover{transform:scale(1.05);box-shadow:0 8px 30px rgba(160,27,27,.3)}
.gallery-slide img{width:100%;height:100%;object-fit:cover;display:block}

@keyframes scroll{
  0%{transform:translateX(0)}
  100%{transform:translateX(calc(-1 * (clamp(250px,30vw,400px) + 1.5rem) * 20))}
}

@media (max-width:47.99875em){
  .gallery-slide{width:clamp(200px,60vw,300px);height:clamp(160px,50vw,240px)}
  @keyframes scroll{
    0%{transform:translateX(0)}
    100%{transform:translateX(calc(-1 * (clamp(200px,60vw,300px) + 1.5rem) * 20))}
  }
}