/* ============ Haven Testimonials Slider (Splide) ============ */

.haven-testimonials {
  position: relative;

  /* Arrow vertical anchor (CSS-only).
     This is the Y position (from the top of the slider) where the arrows should be centered.
     Much cleaner than negative offsets from 50%. */
  --arrow-center-y: 70px;
}

/* Center the content (wider overall slide area) */
.haven-testi-slide {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 64px 92px;   /* top padding removed */
  text-align: center;
}

/* Quote typography (constrain actual quote text to ~760px) */
.haven-testi-quote {
  max-width: 760px;
  margin: 0 auto;
  font-size: clamp(24px, 2.4vw, 34px);
  line-height: 1.2;
}

.haven-testi-quote p { margin: 0; }
.haven-testi-quote p + p { margin-top: 14px; }

/* Attribution (16px / 1.4 / 400) */
.haven-testi-attrib {
  margin-top: 22px;
  font-size: 16px;
  line-height: 1.4;
  font-weight: 400;
}

.haven-testi-name { font-weight: 400; }
.haven-testi-location { margin-top: 2px; font-weight: 400; }

/* Icon positioning */
.haven-testi-icon {
  position: absolute;
  bottom: 14px;
  width: 160px;
  height: auto;
  pointer-events: none;
}

/* Alternate icon placement */
.haven-testimonials .splide__slide:nth-child(odd) .haven-testi-icon { left: 26px; }
.haven-testimonials .splide__slide:nth-child(even) .haven-testi-icon { right: 26px; }

/* Pagination dots (inactive white, active #36384C) */
.haven-testimonials .splide__pagination { bottom: 22px; }

.haven-testimonials .splide__pagination__page{
  width: 8px;
  height: 8px;
  margin: 0 6px;
  background: #fff;
  opacity: 1; /* no opacity fade */
}

.haven-testimonials .splide__pagination__page.is-active{
  background: #36384C;
  opacity: 1;
}

/* ==================================================
   Custom arrows — FIXED SIZE + NO CLIPPING + HOVER
   - Always full opacity
   - Vertically anchored via --arrow-center-y
   ================================================== */

.haven-testimonials .splide {
  position: relative; /* positioning context for absolute arrows */
}

.haven-testimonials .splide__arrow {
  position: absolute;

  /* Center arrows on a clean, predictable centerline */
  top: var(--arrow-center-y);
  transform: translateY(-50%);

  width: 180px;
  height: 67px;

  /* Kill Splide defaults that can cause cropping / styling issues */
  border-radius: 0 !important;
  overflow: visible !important;
  box-shadow: none !important;

  /* Force full opacity always (Splide often sets opacity) */
  opacity: 1 !important;
  filter: none !important;

  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;

  cursor: pointer;
  pointer-events: auto;

  /* Smooth interaction (NO opacity changes) */
  transition: transform 0.18s ease;
}

/* Placement */
.haven-testimonials .splide__arrow--prev { left: 28px; }
.haven-testimonials .splide__arrow--next { right: 28px; }

/* Hover / focus interaction (scale only) */
.haven-testimonials .splide__arrow:hover,
.haven-testimonials .splide__arrow:focus-visible {
  transform: translateY(-50%) scale(1.05);
  opacity: 1 !important;
}

/* Active press */
.haven-testimonials .splide__arrow:active {
  transform: translateY(-50%) scale(0.97);
  opacity: 1 !important;
}

/* Disabled (still full opacity per your requirement) */
.haven-testimonials .splide__arrow:disabled {
  cursor: default;
  transform: translateY(-50%);
  opacity: 1 !important;
}

/* =======================
   Mobile adjustments
   ======================= */

/* ==================================================
   Testimonials — <1280px refactor
   Icon centered on top, arrows flanking icon
   ================================================== */

@media (max-width: 1279px) {

  .haven-testimonials{
    /* Tuning knobs */
    --top-cluster-y: 92px;   /* vertical position of icon+arrows */
    --icon-w: 120px;
    --arrow-w: 110px;
    --arrow-h: 44px;
    --arrow-gap: 18px;
	--edge-pad: 20px;
  }

  /* Give room above quote for icon + arrows */
  .haven-testi-slide{
    max-width: 100%;
    padding: calc(var(--top-cluster-y) + var(--icon-w) + 18px) 12px 56px;
  }

  /* ======================
     Icon — top center
     ====================== */
  .haven-testi-icon{
    top: var(--top-cluster-y);
    bottom: auto;
    left: 50% !important;
    right: auto !important;
    width: var(--icon-w);
    transform: translateX(-50%);
  }

  /* Disable alternating icon logic */
  .haven-testimonials
  .splide__slide:nth-child(odd) .haven-testi-icon,
  .haven-testimonials
  .splide__slide:nth-child(even) .haven-testi-icon{
    left: 50% !important;
    right: auto !important;
  }

  /* ======================
     Arrows — flank icon
     ====================== */
.haven-testimonials .splide__arrow{
  top: calc(var(--top-cluster-y) + (var(--icon-w) / 2));
  width: clamp(64px, 18vw, var(--arrow-w));
  height: clamp(30px, 6vw, var(--arrow-h));
  transform: translateY(-50%);

  padding: 0 10px;              /* 8–10px breathing room */
  background-size: contain;
  background-repeat: no-repeat;
}

  /* Prev arrow (left of icon) */
  .haven-testimonials .splide__arrow--prev{
  left: max(
    var(--edge-pad),
    calc(50% - (var(--icon-w) / 2) - var(--arrow-gap) - var(--arrow-w))
  );
    right: auto;
  }

  /* Next arrow (right of icon) */
  .haven-testimonials .splide__arrow--next{
  left: min(
    calc(100% - var(--edge-pad) - var(--arrow-w)),
    calc(50% + (var(--icon-w) / 2) + var(--arrow-gap))
  );
  }
	
	/* Left arrow → push image right */
.haven-testimonials .splide__arrow--prev{
  background-position: center right;
}

/* Right arrow → push image left */
.haven-testimonials .splide__arrow--next{
  background-position: center left;
}

  /* ======================
     Type scaling safety
     ====================== */
  .haven-testi-quote{
    font-size: clamp(22px, 3.2vw, 30px);
	max-width: 980px;  
  }
	
	.haven-testimonials blockquote {
		padding: 0;
	}	
}