/* ============================================================================
   Tapahtuman kuvakaruselli — jaetut tyylit (drawer + seurasivu).
   Transform-pohjainen (translateX), 16:9 slidet, pisteet + nuolet.
   Vain --tt-*-tokenit. Ks. event-carousel.js.
   ============================================================================ */
.ecar { position: relative; width: 100%; overflow: hidden; background: var(--tt-bg-warm, #eee); }
.ecar__track {
  display: flex; transition: transform .3s ease; will-change: transform;
  touch-action: pan-y;   /* pystyveto → sivun scroll; vaakaveto → swipe (JS) */
}
.ecar__slide { flex: 0 0 100%; margin: 0; min-width: 0; }
.ecar__slide img { width: 100%; aspect-ratio: 16 / 9; height: auto; object-fit: cover; display: block; pointer-events: none; }

/* Nuolet — vain kun >1 kuva (yksittäinen = .ecar--single, ei nuolia) */
.ecar__nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 38px; height: 38px; border: none; border-radius: 50%;
  background: rgba(20,18,16,0.55); color: #fff; font-size: 22px; line-height: 1;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background .15s; z-index: 3; padding: 0;
}
.ecar__nav:hover { background: rgba(20,18,16,0.8); }
.ecar__nav--prev { left: 10px; }
.ecar__nav--next { right: 10px; }

/* Pisteet */
.ecar__dots {
  position: absolute; bottom: 10px; left: 0; right: 0; z-index: 3;
  display: flex; justify-content: center; gap: 7px;
}
.ecar__dot {
  width: 8px; height: 8px; border-radius: 50%; border: none; padding: 0; cursor: pointer;
  background: rgba(255,255,255,0.55); box-shadow: 0 0 3px rgba(0,0,0,0.4);
  transition: background .15s, transform .15s;
}
.ecar__dot.is-active { background: #fff; transform: scale(1.25); }

@media (prefers-reduced-motion: reduce) {
  .ecar__track { transition: none; }
}

/* Kosketuslaitteilla nuolet piiloon (swipe riittää), pisteet jäävät */
@media (hover: none) {
  .ecar__nav { display: none; }
}