/* FR Carousel — v1.2.1 */
/* Desktop tiles: 264×396 (cover). Mobile tiles: 185×277 (70%).
   Gap: 2px.
*/

.frc-wrap{
  --fr-gap: 2px;
  --fr-tile-w: 264px;
  --fr-tile-h: 396px;
}

.frc-slider{
  position: relative;
  width: 100%;
  height: var(--fr-tile-h);
  overflow: hidden;
  touch-action: pan-y;
  cursor: grab;
}
.frc-slider:active{ cursor: grabbing; }

.frc-track{
  display: flex;
  align-items: center;
  height: 100%;
  gap: var(--fr-gap);
  will-change: transform;
  transition: transform .25s linear;
}

.frc-slide{
  flex: 0 0 var(--fr-tile-w);
  width: var(--fr-tile-w);
  height: var(--fr-tile-h);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.frc-img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  user-select: none;
}

/* Hide legacy UI */
.frc-rail,
.frc-edge-fade,
.frc-swipe-hint{ display:none !important; }

/* Optional dots */
.frc-dots{ display:flex; justify-content:center; gap:10px; margin-top:12px; }
.frc-dots .frc-dot{
  width:8px; height:8px; border-radius:50%;
  background:#aaa; opacity:.9; border:0;
}
.frc-dots .frc-dot[aria-selected="true"]{ background:#222; opacity:1; }

/* Mobile: EXACT 70% of desktop */
@media (max-width: 768px){
  .frc-wrap{
    --fr-tile-w: 132px; /* 264 * 0.5 = 132 */
    --fr-tile-h: 198px; /* 396 * 0.5 = 198 */
  }
}


/* === v1.3.0: optional desktop bleed widths === */
@media (min-width: 1025px){
  /* Slightly wider than content column */
  .frc-wrap.frc-bleed-soft{
    width: calc(100% + 8vw);
    margin-left: -4vw;
    margin-right: -4vw;
  }
  /* A bit more */
  .frc-wrap.frc-bleed-med{
    width: calc(100% + 12vw);
    margin-left: -6vw;
    margin-right: -6vw;
  }
  /* Full-bleed to viewport width */
  .frc-wrap.frc-bleed-full{
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
  }
}
