/* pw-hero — a lightweight slider for the homepage hero (replacing Tilda's custom JS reassembler).
   Slides are the original Tilda 396 zero-blocks; atom positioning is handled by t396. */
.pw-hero {
  position: relative;
  overflow: hidden;
  width: 100%;
  background-color: #141414;
}
.pw-hero__track {
  display: flex;
  width: 100%;
  transition: transform 0.5s ease;
  will-change: transform;
}
.pw-hero__slide {
  flex: 0 0 100%;
  max-width: 100%;
  min-width: 0;
}
/* The slide's zero-block takes the full slide width */
.pw-hero__slide > .t-rec {
  width: 100%;
}

/* Arrows — like in t-slds: a thin white chevron with no background, turning red on hover.
   The shape comes from an SVG mask (27x50); the color is background-color (recolored on hover). */
.pw-hero__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  width: 27px;
  height: 50px;
  padding: 0;
  border: none;
  background-color: #fff;
  cursor: pointer;
  transition: background-color 0.2s;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
.pw-hero__arrow:hover { background-color: #e62e45; }
.pw-hero__arrow--prev {
  left: 30px;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 50'%3E%3Cpath d='M25 2 3 25 25 48' fill='none' stroke='%23000' stroke-width='4'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 50'%3E%3Cpath d='M25 2 3 25 25 48' fill='none' stroke='%23000' stroke-width='4'/%3E%3C/svg%3E");
}
.pw-hero__arrow--next {
  right: 30px;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 50'%3E%3Cpath d='M2 2 24 25 2 48' fill='none' stroke='%23000' stroke-width='4'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 50'%3E%3Cpath d='M2 2 24 25 2 48' fill='none' stroke='%23000' stroke-width='4'/%3E%3C/svg%3E");
}

/* Dot navigation */
.pw-hero__dots {
  position: absolute;
  left: 0; right: 0;
  bottom: 20px;
  z-index: 10;
  display: flex;
  justify-content: center;
  gap: 10px;
}
.pw-hero__dot {
  width: 10px; height: 10px;
  border-radius: 50%;
  border: none;
  padding: 0;
  background: rgba(255, 255, 255, 0.5);
  cursor: pointer;
  transition: background 0.2s;
}
.pw-hero__dot[aria-selected="true"] { background: #e62e45; }

@media screen and (max-width: 640px) {
  .pw-hero__arrow { width: 16px; height: 30px; }
  .pw-hero__arrow--prev { left: 12px; }
  .pw-hero__arrow--next { right: 12px; }
}