/* ==== Minimal Slick layout (no external slick.css) ==== */
.pcps-slider { position: relative; display: block; max-width: 640px; margin: 0 auto; box-sizing: border-box; }
.smag-single-centered .pcps-slider { max-width: 720px; }
.pcps-slider .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; }
.pcps-slider .slick-track { position: relative; top: 0; left: 0; display: flex; align-items: stretch; }
.pcps-slider .slick-slide { border: 1px solid; float: none; height: auto; min-height: 1px; }
.pcps-slider .slick-slide>div { height: 100%; }
/* remove Slick's default icon circles */
.pcps-slider .slick-prev:before,
.pcps-slider .slick-next:before {
  content: none; /* kill Slick defaults */
}

.pcps-slider .pcps-arrow {
  cursor: pointer;
  color: #111;          /* arrow color */
  position: absolute;
  top: 49%;
  transform: translateY(-50%);
  z-index: 2;
}
.pcps-slider .pcps-prev {
  left: -9%;
}
.pcps-slider .pcps-next {
  right: -9%;
}
.pcps-slider .pcps-arrow svg {
  width: 48px;
  height: 24px;
  display: block;
}

.pcps-slider .pcps-prev svg {
  transform: scaleX(-1); /* mirror for left arrow */
}

/* optional hover focus states */
.pcps-slider .pcps-arrow:hover,
.pcps-slider .pcps-arrow:focus { color: #000; }


/* Show slides as blocks once initialized; keeps things tidy if slick.js is late */
.pcps-slider.slick-initialized .slick-slide { display: block; }

/* ==== Card layout & image constraints ==== */
.pcps-slide { outline: none; height: 100%; }
.pcps-card{
  display: grid;
  grid-template-columns: minmax(320px, 320px) 1fr; /* cap image column so it can’t dominate */
  gap: 20px;
  align-items: center;
  /* border: 1px solid #000; */
  background: #fff;
  box-sizing: border-box;
  height: 100%;
}

/* Keep image contained and prevent full-screen takeover */
.pcps-media { overflow: hidden; height: 100%; align-content: center; }
.pcps-media img{
  width: 100%;
  height: 100%;
  max-height: 360px;      /* hard cap; adjust to taste */
  object-fit: cover;      /* crop tall images instead of stretching */
  display: block;
}

/* Copy panel */
.pcps-copy{
  --pcps-txt:#111;
  --pcps-bg:#f2f0e6;
  height: 100%;
  border-left: 1px solid #000;
  color: var(--pcps-txt);
  background: var(--pcps-bg);
  padding: 28px;
  box-sizing: border-box;
}

.pcps-title{
  font-size: clamp(22px, 2.6vw, 30px) !important;
  line-height: 1.2;
  font-weight: 400;
  margin: 0 0 15px;
  color: var(--pcps-txt) !important;
}
.pcps-link {
  color: var(--pcps-txt) !important;
}
.pcps-subtitle{ font-family: 'Inter' !important;  }
.pcps-desc{ margin-bottom: 20px; font-family: 'Inter' !important; }
.pcps-price {
  font-family: 'Inter' !important;
  border: 1px solid;
  padding: 10px;
  width: max-content;
  margin-top: 10px;
}
.pcps-link{ text-decoration: none !important; }
body.single-post article a.pcps-link:hover { font-style: italic !important; }

@media (min-width: 821px){ 
  .pcps-slider .slick-dots {
    display: none !important;
  }
}
@media (max-width: 820px){
  .pcps-slider .pcps-arrow {
    display: none !important;
  }
  .pcps-slider .slick-dots li button:before {
    font-size: 16px;
  }

  .pcps-slider .pcps-arrow {
    /* background: #000; */
    border-radius: 100%;
    height: 20px;
    width: 60px;
    padding: 10px 13px;
    top: 91%;
  }
  .pcps-slider .pcps-prev {
    text-align: right;
    left: -18%;
  }
  .pcps-slider .pcps-next {
    text-align: left;
    right: 20%;
  } 
  .pcps-slider .pcps-next svg {
    color: var(--pcps-txt);
    width: 70px;
    height: 40px;
  }
  .pcps-slider {
    margin-bottom: 70px !important;
  }
  .pcps-slider .slick-dots {
    bottom: -45px;
  }
  .pcps-copy {
    border-left: 0;
    padding-bottom: 23px;
    border-top: 1px solid #000;
  }
  .pcps-slider .pcps-arrow::before {
    font-family: 'FontAwesome';
    font-style: normal;
    font-weight: 400;
    font-size: 30px;
  }
  .pcps-slider .slick-dots li button:hover:before, .pcps-slider .slick-dots li button:focus:before { 
    opacity: 0.25 !important;
  }
  .pcps-slider .slick-dots li.slick-active button:before {
    color: black;
    opacity: 0.75 !important;
  }
  .pcps-slider .pcps-prev::before { content: "\f104"; }
  /* .pcps-slider .pcps-next::before { content: "\f105"; } */
}
/* Mobile */
@media (max-width: 820px){
  .pcps-card{ grid-template-columns: 1fr; gap: 20px; }
  .pcps-media img{ max-height: 360px; }
}

/* Prevent any theme-wide img rules from breaking aspect */
.pcps-slider img { max-width: 100%; height: auto; }

/* Optional: if your theme applies 100vh or fixed heights somewhere, make sure our slider can grow naturally */
.pcps-slider, .pcps-list, .pcps-track { height: auto !important; }