/* =========================================
   Pinklitter PET CARDS FORCE v40
   Fix the empty outer side by filling it with
   the same black panel color, while keeping
   each card content at 75vw and aligned.
========================================= */

body.home section.plx-pet-cards-section,
body.home .plx-pet-cards-section{
  width:100vw !important;
  max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  padding:96px 0 !important;
  background:#fff !important;
  overflow:hidden !important;
}

body.home .plx-pet-cards-section .plx-pet-cards{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:88px !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
}

body.home .plx-pet-cards-section .plx-pet-card{
  --plx-pet-black:#050505;
  --plx-pet-black-2:#0b0b0b;
  --plx-pet-card-w:75vw;
  --plx-pet-side-fill:25vw;
  --plx-pet-media-w:34%;
  --plx-pet-copy-w:66%;
  position:relative !important;
  width:var(--plx-pet-card-w) !important;
  max-width:var(--plx-pet-card-w) !important;
  min-height:clamp(360px,32vw,500px) !important;
  display:grid !important;
  gap:0 !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:var(--plx-pet-black) !important;
  overflow:visible !important;
  transform:none !important;
  isolation:isolate !important;
}

body.home .plx-pet-card.plx-pet-card-dog{
  grid-template-columns:var(--plx-pet-copy-w) var(--plx-pet-media-w) !important;
  grid-template-areas:"copy media" !important;
  margin-left:auto !important;
  margin-right:0 !important;
  justify-self:end !important;
}

body.home .plx-pet-card.plx-pet-card-cat{
  grid-template-columns:var(--plx-pet-media-w) var(--plx-pet-copy-w) !important;
  grid-template-areas:"media copy" !important;
  margin-left:0 !important;
  margin-right:auto !important;
  justify-self:start !important;
}

/* Fill the outer blank side with the same black panel color */
body.home .plx-pet-card.plx-pet-card-dog::before,
body.home .plx-pet-card.plx-pet-card-cat::after{
  content:"" !important;
  position:absolute !important;
  top:0 !important;
  bottom:0 !important;
  width:var(--plx-pet-side-fill) !important;
  background:
    radial-gradient(circle at 50% 48%, rgba(255,255,255,.045) 0, rgba(255,255,255,0) 34%),
    radial-gradient(circle at 52% 50%, rgba(255,112,25,.10) 0, rgba(255,112,25,0) 20%),
    linear-gradient(180deg,var(--plx-pet-black) 0%,var(--plx-pet-black-2) 45%,var(--plx-pet-black) 100%) !important;
  z-index:0 !important;
  pointer-events:none !important;
}
body.home .plx-pet-card.plx-pet-card-dog::before{ right:100% !important; }
body.home .plx-pet-card.plx-pet-card-cat::after{ left:100% !important; }

/* Remove any old decorative pseudo elements */
body.home .plx-pet-card-copy::before,
body.home .plx-pet-card-copy::after,
body.home .plx-pet-card-media::before,
body.home .plx-pet-card-media::after{
  content:none !important;
  display:none !important;
}

body.home .plx-pet-card-media,
body.home .plx-pet-card-copy{
  position:relative !important;
  z-index:1 !important;
}

body.home .plx-pet-card-media{
  grid-area:media !important;
  width:100% !important;
  min-height:clamp(360px,32vw,500px) !important;
  overflow:hidden !important;
  background:var(--plx-pet-black) !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

body.home .plx-pet-card-poster,
body.home .plx-pet-card-video,
body.home .plx-pet-card > img.plx-pet-card-poster,
body.home .plx-pet-card > video.plx-pet-card-video{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  object-fit:cover !important;
  border-radius:0 !important;
  box-shadow:none !important;
  pointer-events:none !important;
}

/* Show a little more of each animal */
body.home .plx-pet-card-dog .plx-pet-card-poster,
body.home .plx-pet-card-dog .plx-pet-card-video{
  object-position:78% center !important;
}

body.home .plx-pet-card-cat .plx-pet-card-poster,
body.home .plx-pet-card-cat .plx-pet-card-video{
  object-position:22% center !important;
}

body.home .plx-pet-card-copy{
  grid-area:copy !important;
  width:100% !important;
  max-width:none !important;
  min-height:clamp(360px,32vw,500px) !important;
  margin:0 !important;
  padding:clamp(34px,4.3vw,76px) !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  overflow:hidden !important;
  background:
    radial-gradient(circle at 50% 48%, rgba(255,255,255,.045) 0, rgba(255,255,255,0) 34%),
    radial-gradient(circle at 52% 50%, rgba(255,112,25,.10) 0, rgba(255,112,25,0) 20%),
    linear-gradient(180deg,var(--plx-pet-black) 0%,var(--plx-pet-black-2) 45%,var(--plx-pet-black) 100%) !important;
  color:#fff !important;
}

body.home .plx-pet-card-dog .plx-pet-card-copy{
  align-items:flex-start !important;
  text-align:left !important;
}

body.home .plx-pet-card-cat .plx-pet-card-copy{
  align-items:flex-end !important;
  text-align:right !important;
}

body.home .plx-pet-card-text-frame{
  position:relative !important;
  z-index:2 !important;
  width:100% !important;
  max-width:clamp(520px,48vw,860px) !important;
}

body.home .plx-pet-card-dog .plx-pet-card-text-frame{ margin-right:auto !important; }
body.home .plx-pet-card-cat .plx-pet-card-text-frame{ margin-left:auto !important; }

body.home .plx-pet-card-text-frame::before,
body.home .plx-pet-card-text-frame::after{
  content:"" !important;
  position:absolute !important;
  height:1px !important;
  display:block !important;
  background:
    radial-gradient(circle, rgba(255,141,42,.95) 0, rgba(255,141,42,.58) 8%, rgba(255,141,42,.22) 16%, rgba(255,141,42,0) 34%),
    linear-gradient(90deg, rgba(255,141,42,0), rgba(255,141,42,.55), rgba(255,141,42,0)) !important;
  filter:drop-shadow(0 0 8px rgba(255,112,25,.70)) !important;
  opacity:.95 !important;
  pointer-events:none !important;
}

body.home .plx-pet-card-dog .plx-pet-card-text-frame::before,
body.home .plx-pet-card-dog .plx-pet-card-text-frame::after{ left:0 !important; right:8% !important; }
body.home .plx-pet-card-cat .plx-pet-card-text-frame::before,
body.home .plx-pet-card-cat .plx-pet-card-text-frame::after{ left:8% !important; right:0 !important; }
body.home .plx-pet-card-text-frame::before{ top:-38px !important; }
body.home .plx-pet-card-text-frame::after{ bottom:-42px !important; }

body.home .plx-pet-card-copy h2{
  color:#f7f4ee !important;
  font-family:'Orbitron', var(--plx-font-modern-caps), sans-serif !important;
  font-size:clamp(2rem,3.3vw,3.9rem) !important;
  font-weight:800 !important;
  line-height:1.05 !important;
  letter-spacing:.04em !important;
  text-transform:uppercase !important;
  margin:0 0 1rem !important;
  text-shadow:0 0 18px rgba(255,255,255,.10) !important;
}

body.home .plx-pet-card-copy p{
  color:rgba(255,255,255,.86) !important;
  font-family:'Quicksand', var(--plx-font-body-clean), sans-serif !important;
  font-size:clamp(.92rem,1.05vw,1.12rem) !important;
  font-weight:500 !important;
  line-height:1.5 !important;
  letter-spacing:.02em !important;
  margin:0 0 1.55rem !important;
}

body.home .plx-pet-card-cat .plx-pet-card-copy h2,
body.home .plx-pet-card-cat .plx-pet-card-copy p{
  white-space:nowrap !important;
  max-width:none !important;
}

body.home .plx-pet-card-copy .plx-pet-card-cta{
  min-height:44px !important;
  padding:.84rem 1.14rem !important;
  border-radius:999px !important;
  background:#fff !important;
  border:1px solid rgba(255,255,255,.55) !important;
  color:#061326 !important;
  font-family:'Orbitron', var(--plx-font-modern-caps), sans-serif !important;
  font-size:.78rem !important;
  font-weight:800 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  box-shadow:0 12px 26px rgba(0,0,0,.18) !important;
}

body.home .plx-pet-card-copy .plx-pet-card-cta:hover,
body.home .plx-pet-card-copy .plx-pet-card-cta:focus-visible{
  background:#b93055 !important;
  border-color:#b93055 !important;
  color:#fff !important;
}

body.home .plx-pet-card:hover,
body.home .plx-pet-card:focus-within{ transform:none !important; box-shadow:none !important; }
body.home .plx-pet-card:hover .plx-pet-card-poster,
body.home .plx-pet-card:hover .plx-pet-card-video{ transform:scale(1.02) !important; }

@media (max-width:1024px){
  body.home .plx-pet-cards-section .plx-pet-card{
    --plx-pet-card-w:86vw;
    --plx-pet-side-fill:14vw;
    --plx-pet-media-w:36%;
    --plx-pet-copy-w:64%;
  }

  body.home .plx-pet-card-copy h2{ font-size:clamp(1.8rem,4vw,3.15rem) !important; }
  body.home .plx-pet-card-cat .plx-pet-card-copy h2,
  body.home .plx-pet-card-cat .plx-pet-card-copy p{ white-space:normal !important; }
}

@media (max-width:767px){
  body.home .plx-pet-cards-section{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding:48px 0 !important;
  }

  body.home .plx-pet-cards-section .plx-pet-cards{ gap:44px !important; }

  body.home .plx-pet-cards-section .plx-pet-card{
    --plx-pet-card-w:100%;
    --plx-pet-side-fill:0vw;
    width:100% !important;
    max-width:100% !important;
    grid-template-columns:1fr !important;
    grid-template-areas:"media" "copy" !important;
    min-height:0 !important;
    margin:0 !important;
    justify-self:stretch !important;
  }

  body.home .plx-pet-card.plx-pet-card-dog::before,
  body.home .plx-pet-card.plx-pet-card-cat::after{ display:none !important; }

  body.home .plx-pet-card-copy,
  body.home .plx-pet-card-media{
    width:100% !important;
    min-height:280px !important;
  }

  body.home .plx-pet-card-copy{ padding:30px 20px !important; }
  body.home .plx-pet-card-cat .plx-pet-card-copy,
  body.home .plx-pet-card-dog .plx-pet-card-copy{
    align-items:flex-start !important;
    text-align:left !important;
  }
  body.home .plx-pet-card-cat .plx-pet-card-copy h2,
  body.home .plx-pet-card-cat .plx-pet-card-copy p{ white-space:normal !important; }
}
