.elementor-kit-11{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-11 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ----- KAFELKI USŁUG (WSPÓLNA KLASA) ----- */
.elementor-element.service-card {
  position: relative;
  overflow: hidden;
  cursor: pointer;
  border-radius: 8px;         /* zaokrąglenie rogów */
  transition: transform 0.3s ease;
}

/* ----- OBRAZEK ----- */
.elementor-element.service-card img,
.elementor-element.service-card .elementor-image img {
  display: block;
  width: 100%;
  height: 280px;              /* wysokość zdjęcia */
  object-fit: cover;          /* dopasowanie bez rozciągania */
  aspect-ratio: 1 / 1;        /* kwadratowy kształt */
  transform-origin: center;
  transition: transform .9s ease, filter .4s ease;
}

/* ----- PRZYCIEMNIENIE + RAMKA ----- */
.elementor-element.service-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0);
  outline: 2px solid rgba(255,255,255,0);
  outline-offset: -32px;
  transition: background .4s ease, outline-color .8s ease;
  z-index: 2;
  pointer-events: none;
}

/* ----- NAPIS z data-title (różny per kafelek) ----- */
.elementor-element.service-card::after {
  content: attr(data-title);
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-weight: 600;
  text-align: center;
  font-size: clamp(18px, 2.2vw, 36px);
  letter-spacing: .4px;
  line-height: 1.2;
  z-index: 3;
  transition: transform .8s ease, opacity .6s ease;
  pointer-events: none;

  /* --- NOWE: czarna lekka obwódka dla czytelności --- */
  text-shadow:
    -1px -1px 2px rgba(0,0,0,0.8),
     1px -1px 2px rgba(0,0,0,0.8),
    -1px  1px 2px rgba(0,0,0,0.8),
     1px  1px 2px rgba(0,0,0,0.8);
}

/* ----- HOVER ----- */
.elementor-element.service-card:hover img,
.elementor-element.service-card:hover .elementor-image img {
  transform: scale(1.08);
  filter: brightness(.6);
}

.elementor-element.service-card:hover::before {
  background: rgba(0,0,0,.25);
  outline-color: #fff;
}

.elementor-element.service-card:hover::after {
  transform: translate(-50%, -45%);
  /* nadal z lekką obwódką, ale możesz ją rozjaśnić jeśli chcesz */
}

/* ----- BONUS: Responsywność ----- */
@media (max-width: 1024px) {
  .elementor-element.service-card img {
    height: 240px;
  }
}

@media (max-width: 767px) {
  .elementor-element.service-card img {
    height: 200px;
  }
}
/* Link w Image widget ma wypełniać cały kafelek */
.elementor-element.service-card .elementor-image a,
.elementor-element.service-card a {
  display: block;
  width: 100%;
  height: 100%;
}

/* Upewniamy się, że kontener obrazka nie ogranicza wysokości */
.elementor-element.service-card .elementor-widget-container{
  height: 100%;
}/* End custom CSS */