.pcl-section{
  --pcl-gap:18px;
  --pcl-line:#dedede;
  --pcl-muted:#666;
}

.pcl-list{
  display:grid;
  gap:28px;
}

.pcl-overview-list{
  display:grid;
  gap:18px;
}

.pcl-overview-item{
  border-bottom:1px solid var(--pcl-line);
  padding:0 0 18px;
}

.pcl-overview-item__title{
  margin:0 0 8px;
}

.pcl-overview-item__title a{
  color:inherit;
  text-decoration:none;
}

.pcl-overview-item__title a:hover{
  text-decoration:underline;
}

.pcl-overview-item__short{
  line-height:1.55;
}

.pcl-overview-item__link,
.pcl-back{
  text-align:var(--pcl-readmore-align, left);
}

.pcl-overview-item__link a,
.pcl-back a,
.pcl-readmore-link{
  background:var(--pcl-readmore-bg, transparent);
  border:var(--pcl-readmore-border, 1px solid currentColor);
  border-radius:var(--pcl-readmore-radius, 0);
  color:var(--pcl-readmore-text, inherit);
  display:inline-block;
  font-weight:700;
  line-height:1.2;
  padding:7px 11px;
  text-decoration:none;
}

.pcl-overview-item__link a:hover,
.pcl-back a:hover,
.pcl-readmore-link:hover{
  background:var(--pcl-readmore-hover-bg, #333);
  border:var(--pcl-readmore-hover-border, var(--pcl-readmore-border, 1px solid currentColor));
  color:var(--pcl-readmore-hover-text, #fff);
}

.pcl-item{
  border-bottom:1px solid var(--pcl-line);
  padding:0 0 26px;
}

.pcl-detail__title{
  margin:0 0 12px;
}

.pcl-item__title{
  margin:0 0 8px;
}

.pcl-item__description,
.pcl-item__extra{
  line-height:1.55;
}

.pcl-podcast-grid{
  display:grid;
  gap:var(--pcl-gap);
  grid-template-columns:repeat(var(--pcl-columns,2), minmax(0,1fr));
  margin:18px 0;
}

.pcl-podcast{
  margin:0;
}

.pcl-frame,
.pcl-player-gallery__main{
  background:#f3f3f3;
  border-radius:12px;
  height:var(--pcl-player-height, 352px);
  overflow:hidden;
}

.pcl-frame iframe,
.pcl-player-gallery__main iframe{
  border:0;
  display:block;
  height:100%;
  width:100%;
}

.pcl-podcast figcaption,
.pcl-podcast-card__caption,
.pcl-gallery-thumb span{
  display:block;
  line-height:1.35;
  margin-top:7px;
}

.pcl-podcast-card{
  appearance:none;
  background:transparent;
  border:0;
  color:inherit;
  cursor:pointer;
  font:inherit;
  padding:0;
  position:relative;
  text-align:left;
}

.pcl-podcast-card img{
  border:1px solid var(--pcl-thumbnail-border-color, var(--pcl-line));
  box-sizing:border-box;
}

.pcl-podcast-card img,
.pcl-gallery-thumb img{
  display:block;
  width:100%;
  height:auto;
}

.pcl-play{
  align-items:center;
  background:rgba(0,0,0,.55);
  border-radius:999px;
  display:flex;
  height:54px;
  justify-content:center;
  left:50%;
  position:absolute;
  top:calc(50% - 16px);
  transform:translate(-50%,-50%);
  width:54px;
}

.pcl-play:before{
  border-bottom:13px solid transparent;
  border-left:19px solid #fff;
  border-top:13px solid transparent;
  content:"";
  margin-left:4px;
}

.pcl-player-gallery{
  display:grid;
  gap:14px;
  margin:18px 0;
}

.pcl-player-gallery__thumbs{
  display:grid;
  gap:10px;
}

.pcl-player-gallery--thumbs .pcl-player-gallery__thumbs{
  grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
}

.pcl-gallery-thumb{
  appearance:none;
  background:transparent;
  border:1px solid var(--pcl-thumbnail-border-color, var(--pcl-line));
  color:inherit;
  cursor:pointer;
  font:inherit;
  padding:6px;
  text-align:left;
}

.pcl-gallery-thumb.is-active{
  border-color:var(--pcl-thumbnail-active-border-color, currentColor);
  box-shadow:0 0 0 2px var(--pcl-thumbnail-active-border-color, currentColor);
}

.pcl-frog-gallery{
  margin:18px 0;
  position:relative;
}

.pcl-frog-gallery__grid{
  display:grid;
  gap:var(--pcl-gap);
  grid-template-columns:repeat(var(--pcl-columns,2), minmax(0,1fr));
  position:relative;
  transition:min-height .45s ease;
}

.pcl-frog-card{
  min-width:0;
  position:relative;
  transition:opacity .55s ease, transform .65s cubic-bezier(.2,.8,.2,1);
}

.pcl-frog-card__box{
  aspect-ratio:var(--pcl-aspect-ratio, 16 / 9);
  background:#111;
  border:1px solid var(--pcl-thumbnail-border-color, var(--pcl-line));
  box-sizing:border-box;
  overflow:hidden;
  position:relative;
}

.pcl-frog-card__box:before{
  background:var(--pcl-thumbnail-hover-color, rgba(0,0,0,.5));
  content:"";
  inset:0;
  opacity:0;
  pointer-events:none;
  position:absolute;
  transition:opacity .28s ease;
  z-index:2;
}

.pcl-frog-card__box:hover:before{
  opacity:1;
}

.pcl-frog-card__image{
  display:block;
  height:100%;
  object-fit:cover;
  width:100%;
}

.pcl-frog-card__open{
  appearance:none;
  background:transparent;
  border:0;
  cursor:pointer;
  inset:0;
  padding:0;
  position:absolute;
  z-index:5;
}

.pcl-frog-card__open > .pcl-frog-play{
  left:50%;
  position:absolute;
  top:50%;
  transform:translate(-50%,-50%);
}

.pcl-frog-play{
  align-items:center;
  background:rgba(0,0,0,.62);
  border-radius:999px;
  display:flex;
  height:52px;
  justify-content:center;
  width:52px;
}

.pcl-frog-play:before{
  border-bottom:12px solid transparent;
  border-left:18px solid #fff;
  border-top:12px solid transparent;
  content:"";
  margin-left:4px;
}

.pcl-frog-card__podcast{
  background:#111;
  inset:0;
  opacity:0;
  pointer-events:none;
  position:absolute;
  transition:opacity .35s ease;
  z-index:8;
}

.pcl-frog-card__podcast iframe{
  border:0;
  display:block;
  height:100%;
  width:100%;
}

.pcl-frog-close{
  appearance:none;
  background:#fff;
  border:0;
  color:#111;
  cursor:pointer;
  font:inherit;
  font-weight:700;
  line-height:1;
  opacity:0;
  padding:9px 12px;
  pointer-events:none;
  position:absolute;
  right:10px;
  top:10px;
  transition:opacity .25s ease;
  z-index:10;
}

.pcl-frog-card__info{
  line-height:1.35;
  margin-top:7px;
}

.pcl-frog-gallery.is-animating .pcl-frog-card:not(.is-active){
  opacity:.25;
  transform:scale(.82);
}

.pcl-frog-gallery.is-animating .pcl-frog-card.is-active{
  transform:scale(1.03);
  z-index:9;
}

.pcl-frog-gallery.is-open .pcl-frog-gallery__grid{
  min-height:clamp(280px,56vw,720px);
}

.pcl-frog-gallery.is-open .pcl-frog-card{
  opacity:0;
  pointer-events:none;
}

.pcl-frog-gallery.is-open .pcl-frog-card.is-open{
  inset:0;
  opacity:1;
  pointer-events:auto;
  position:absolute;
  transform:none;
  z-index:12;
}

.pcl-frog-gallery.is-open .pcl-frog-card.is-open .pcl-frog-card__box{
  aspect-ratio:auto;
  height:100%;
}

.pcl-frog-card.is-open .pcl-frog-card__open,
.pcl-frog-card.is-open .pcl-frog-card__image,
.pcl-frog-card.is-open .pcl-frog-card__info{
  opacity:0;
  pointer-events:none;
}

.pcl-frog-card.is-open .pcl-frog-card__podcast,
.pcl-frog-card.is-open .pcl-frog-close{
  opacity:1;
  pointer-events:auto;
}

.pcl-back{
  margin:18px 0 0;
}

.pcl-modal[hidden]{
  display:none;
}

.pcl-modal{
  inset:0;
  position:fixed;
  z-index:9999;
}

.pcl-modal__backdrop{
  background:var(--pcl-modal-backdrop-bg, rgba(0,0,0,.72));
  inset:0;
  position:absolute;
}

.pcl-modal__panel{
  background:#fff;
  border-radius:var(--pcl-modal-panel-radius, 0);
  box-sizing:border-box;
  left:50%;
  max-width:980px;
  padding:var(--pcl-modal-panel-padding, 12px);
  position:absolute;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(92vw,980px);
}

.pcl-modal__close{
  appearance:none;
  background:#fff;
  border:0;
  cursor:pointer;
  font:inherit;
  font-weight:700;
  line-height:1;
  padding:9px 12px;
  position:absolute;
  right:0;
  top:-42px;
}

.pcl-modal-open{
  overflow:hidden;
}

@media (max-width:760px){
  .pcl-podcast-grid,
  .pcl-frog-gallery__grid{
    grid-template-columns:1fr;
  }

  .pcl-frog-gallery.is-open .pcl-frog-gallery__grid{
    min-height:56vw;
  }

}
