/* Berita Rekomendasi — homepage-only presentation. */
.pe-m6-recommendation{
  margin:var(--pe-m6-d-section-top,34px) 0 var(--pe-m6-d-section-bottom,36px);
  font-family:var(--pe-font-family);
}
.pe-m6-section-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  column-gap:14px;
  align-items:baseline;
  margin-bottom:20px;
}
.pe-m6-section-head .pe-global-heading{margin:0}
.pe-m6-heading{display:contents}
.pe-m6-title-desktop{display:inline}
.pe-m6-title-mobile{display:none}
.pe-m6-section-head .pe-global-heading h2{
  grid-column:1;
  grid-row:1;
  box-sizing:border-box;
  min-width:0;
  margin:0 0 13px;
  line-height:1.18!important;
}
.pe-m6-section-head .pe-global-heading h2,.pe-m6-section-head .pe-global-heading h2 span{
  font-family:var(--pe-font-family)!important;
  font-size:var(--pe-font-section-desktop)!important;
  font-weight:var(--pe-font-weight-section-desktop)!important;
}
.pe-m6-section-head .pe-heading-first{color:var(--pe-color-section-first)!important}
.pe-m6-section-head .pe-heading-rest{color:var(--pe-color-section-rest)!important}
.pe-m6-section-head .pe-heading-rule{
  grid-column:1/-1;
  grid-row:2;
  width:100%;
  height:var(--pe-m6-section-rule-height,2px)!important;
  background:var(--pe-color-section-rule)!important;
}
.pe-m6-section-head .pe-heading-rule span{
  display:block;
  width:var(--pe-m6-section-accent-width,72px)!important;
  height:var(--pe-m6-section-accent-height,3px)!important;
  background:var(--pe-color-section-first)!important;
}
.pe-m6-index-link{
  grid-column:2;
  grid-row:1;
  align-self:baseline;
  display:inline-flex;
  align-items:center;
  gap:var(--pe-m6-index-arrow-gap-d,6px);
  min-width:0;
  margin:0 0 13px;
  text-decoration:none;
  color:var(--pe-color-meta-accent)!important;
  font-family:var(--pe-font-family);
  font-size:var(--pe-font-meta-desktop);
  font-weight:var(--pe-font-weight-meta-desktop);
  line-height:1.18;
  white-space:nowrap;
}
.pe-m6-index-label-mobile{display:none}
.pe-m6-index-link svg{
  width:var(--pe-m6-index-arrow-size-d,15px);
  height:var(--pe-m6-index-arrow-size-d,15px);
  fill:currentColor;
  flex:0 0 auto;
}
.pe-m6-index-link:hover,.pe-m6-index-link:focus-visible{color:var(--pe-color-title-hover)!important}
.pe-m6-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--pe-m6-d-col-gap,22px);row-gap:var(--pe-m6-d-row-gap,28px)}
.pe-m6-card{min-width:0;margin:0;padding:var(--pe-m6-d-card-padding,0);border-radius:var(--pe-m6-d-radius,8px);background:var(--pe-color-surface);overflow:hidden}
.pe-m6-thumb{display:block;position:relative;width:100%;aspect-ratio:var(--pe-m6-d-ratio,16 / 9);overflow:hidden;border-radius:var(--pe-image-radius);background:var(--pe-color-media);text-decoration:none}
.pe-m6-thumb img{display:block;width:100%!important;height:100%!important;object-fit:cover!important;transition:transform var(--pe-image-zoom-duration) var(--pe-image-motion-ease)}
.pe-m6-category-overlay{display:none}
.pe-m6-card:hover .pe-m6-thumb img,.pe-m6-card:focus-within .pe-m6-thumb img{transform:scale(var(--pe-image-zoom-scale))}
.pe-m6-card-copy{margin-top:var(--pe-m6-d-thumb-meta-gap,10px)}
.pe-m6-meta{display:flex;align-items:center;flex-wrap:wrap;gap:5px;min-width:0;font-family:var(--pe-font-family);font-size:var(--pe-font-meta-desktop);font-weight:var(--pe-font-weight-meta-desktop);line-height:1.3}
.pe-m6-category{color:var(--pe-color-meta-accent)}
.pe-m6-time,.pe-m6-dot{color:var(--pe-color-meta)}
.pe-m6-card-title{margin:var(--pe-m6-d-meta-title-gap,6px) 0 0;padding:0;font-family:var(--pe-font-family);font-size:var(--pe-font-layout-desktop);font-weight:var(--pe-font-weight-layout-desktop);line-height:var(--pe-m6-headline-lh-d,1.35);letter-spacing:-.12px}
.pe-m6-card-title a{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:var(--pe-m6-headline-lines-d,3);overflow:hidden;color:var(--pe-color-title)!important;text-decoration:none}
.pe-m6-card-title a:hover,.pe-m6-card-title a:focus-visible{color:var(--pe-color-title-hover)!important}
/* Floating Rekomendasi */
.pe-m6-floating{position:fixed;left:50%;bottom:max(var(--pe-m6-float-bottom-d,18px),calc(var(--pe-m4-network-notice-occupied-bottom,0px) + var(--pe-m6-network-stack-gap,8px)));z-index:1200;width:min(var(--pe-m6-float-width-d,520px),calc(100% - 28px));transform:translate3d(-50%,calc(100% + var(--pe-m6-float-travel,40px)),0);opacity:0;visibility:hidden;pointer-events:none;transition:transform var(--pe-m6-float-enter,.32s) cubic-bezier(.22,.61,.36,1),opacity var(--pe-m6-float-exit,.28s) ease,visibility var(--pe-m6-float-exit,.28s) ease;will-change:transform,opacity;font-family:var(--pe-font-family)}
.pe-m6-floating.is-visible{transform:translate3d(-50%,0,0);opacity:1;visibility:visible;pointer-events:auto}
html.pe-m4-network-notice-active .pe-m6-floating:not(.is-visible){transform:translate3d(-50%,0,0)}
.pe-m6-floating-inner{display:flex;align-items:center;min-height:var(--pe-m6-float-min-height-d,58px);padding:var(--pe-m6-float-pad-y-d,8px) var(--pe-m6-float-pad-x-d,14px);border:var(--pe-m6-float-border-width,1px) solid var(--pe-color-border);border-radius:var(--pe-m6-float-radius,8px);background:var(--pe-color-surface-alt);box-shadow:0 4px var(--pe-m6-float-shadow-blur,18px) rgba(0,0,0,var(--pe-m6-float-shadow-opacity,.18))}
.pe-m6-floating-copy{display:flex;align-items:center;gap:7px;min-width:0;margin-right:auto;color:var(--pe-color-title);font-size:var(--pe-m6-float-text-size-d,13px);font-weight:var(--pe-m6-float-text-weight,600);line-height:1.25;white-space:nowrap}
.pe-m6-floating-title{display:block;min-width:0;max-width:var(--pe-m6-float-title-max-width-d,260px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pe-m6-floating-button{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;margin-left:var(--pe-m6-float-gap,12px);padding:var(--pe-m6-float-btn-py-d,10px) var(--pe-m6-float-btn-px-d,14px);border-radius:var(--pe-m6-float-button-radius,6px);background:var(--pe-color-section-first);color:var(--pe-m6-float-button-text,#fff)!important;text-decoration:none;font-size:var(--pe-m6-float-button-size-d,12px);font-weight:var(--pe-m6-float-button-weight,700);line-height:1;white-space:nowrap}
.pe-m6-floating-button:hover,.pe-m6-floating-button:focus-visible{background:var(--pe-color-title-hover);color:var(--pe-m6-float-button-text,#fff)!important}
.pe-m6-megaphone{width:var(--pe-m6-float-icon-size,17px);height:var(--pe-m6-float-icon-size,17px);fill:none;stroke:var(--pe-m6-float-icon,#e32636);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.pe-m6-floating-close{display:flex;align-items:center;justify-content:center;flex:0 0 auto;width:34px;height:34px;margin-left:5px;padding:0;border:0;background:transparent;color:var(--pe-color-title);font:400 var(--pe-m6-float-close-size,24px)/1 Arial,sans-serif;cursor:pointer}
.pe-m6-floating-close:hover,.pe-m6-floating-close:focus-visible{color:#555}
@media(max-width:767px){
  .pe-m6-recommendation{margin-top:var(--pe-m6-m-section-top,28px);margin-bottom:var(--pe-m6-m-section-bottom,30px)}
  .pe-m6-section-head{column-gap:10px;margin-bottom:16px}
  .pe-m6-title-desktop{display:none}
  .pe-m6-title-mobile{display:inline}
  .pe-m6-section-head .pe-global-heading h2,.pe-m6-section-head .pe-global-heading h2 span{font-family:var(--pe-font-family)!important;font-size:var(--pe-font-section-mobile)!important;font-weight:var(--pe-font-weight-section-mobile)!important}
  .pe-m6-section-head .pe-heading-first{color:var(--pe-color-section-first)!important}
  .pe-m6-section-head .pe-heading-rest{color:var(--pe-color-section-rest)!important}
  .pe-m6-index-label-desktop{display:none}
  .pe-m6-index-label-mobile{display:inline}
  .pe-m6-index-link{gap:var(--pe-m6-index-arrow-gap-m,6px);color:var(--pe-color-meta-accent)!important;font-family:var(--pe-font-family);font-size:var(--pe-font-meta-mobile);font-weight:var(--pe-font-weight-meta-mobile)}
  .pe-m6-index-link svg{width:var(--pe-m6-index-arrow-size-m,14px);height:var(--pe-m6-index-arrow-size-m,14px)}
  .pe-m6-index-link:hover,.pe-m6-index-link:focus-visible{color:var(--pe-color-title-hover)!important}
  .pe-m6-grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--pe-m6-m-col-gap,12px);row-gap:var(--pe-m6-m-row-gap,22px)}
  .pe-m6-card{padding:var(--pe-m6-m-card-padding,0);border-radius:var(--pe-m6-m-radius,7px);background:var(--pe-color-surface)}
  .pe-m6-thumb{aspect-ratio:var(--pe-m6-m-ratio,16 / 9);border-radius:var(--pe-image-radius)}
  .pe-m6-card-copy{margin-top:var(--pe-m6-m-thumb-meta-gap,8px)}
  .pe-m6-meta{font-family:var(--pe-font-family);font-size:var(--pe-font-meta-mobile);font-weight:var(--pe-font-weight-meta-mobile);gap:4px}
  .pe-m6-category{color:var(--pe-color-meta-accent)}
  .pe-m6-card.has-mobile-category-overlay .pe-m6-thumb::after{content:"";position:absolute;left:0;right:0;bottom:0;height:var(--pe-m6-m-category-gradient-height,58%);z-index:1;background:linear-gradient(to top,var(--pe-m6-m-category-gradient-light,#000),transparent);opacity:var(--pe-m6-m-category-gradient-opacity,.68);pointer-events:none}
  .pe-m6-card.has-mobile-category-overlay .pe-m6-category-overlay{display:block;position:absolute;left:var(--pe-m6-m-category-overlay-left,8px);bottom:var(--pe-m6-m-category-overlay-bottom,7px);z-index:2;max-width:calc(100% - (var(--pe-m6-m-category-overlay-left,8px) * 2));color:var(--pe-m6-m-category-overlay-text-light,#fff);font-family:var(--pe-font-family);font-size:var(--pe-m6-m-category-overlay-size,10px);font-weight:var(--pe-m6-m-category-overlay-weight,500);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 2px rgba(0,0,0,.35)}
  .pe-m6-card.has-mobile-category-overlay .pe-m6-meta .pe-m6-category,.pe-m6-card.has-mobile-category-overlay .pe-m6-meta .pe-m6-dot{display:none}
  .pe-m6-time,.pe-m6-dot{color:var(--pe-color-meta)}
  .pe-m6-card-title{margin-top:var(--pe-m6-m-meta-title-gap,5px);font-family:var(--pe-font-family);font-size:var(--pe-font-layout-mobile);font-weight:var(--pe-font-weight-layout-mobile);line-height:var(--pe-m6-headline-lh-m,1.32)}
  .pe-m6-card-title a{-webkit-line-clamp:var(--pe-m6-headline-lines-m,3);color:var(--pe-color-title)!important}
  .pe-m6-card-title a:hover,.pe-m6-card-title a:focus-visible{color:var(--pe-color-title-hover)!important}
  .pe-m6-floating{bottom:max(var(--pe-m6-float-bottom-m,14px),calc(var(--pe-m4-network-notice-occupied-bottom,0px) + var(--pe-m6-network-stack-gap,8px)));width:calc(100% - (var(--pe-m6-float-side-m,11px) * 2))}
  .pe-m6-floating-inner{min-height:var(--pe-m6-float-min-height-m,54px);padding:var(--pe-m6-float-pad-y-m,7px) var(--pe-m6-float-pad-x-m,10px)}
  .pe-m6-floating-copy{flex:1 1 auto;font-size:var(--pe-m6-float-text-size-m,12px);gap:6px}
  .pe-m6-floating-title{flex:1 1 auto;max-width:none}
  .pe-m6-floating-button{margin-left:8px;padding:var(--pe-m6-float-btn-py-m,9px) var(--pe-m6-float-btn-px-m,10px);font-size:var(--pe-m6-float-button-size-m,11px)}
  .pe-m6-floating-close{width:29px;height:32px;margin-left:2px}
}
@media(prefers-reduced-motion:reduce){
  .pe-m6-thumb img,.pe-m6-floating{transition:none!important}
  .pe-m6-card:hover .pe-m6-thumb img,.pe-m6-card:focus-within .pe-m6-thumb img{transform:none!important}
}



/* Phase 4 runtime alignment: recommendation media consumes Global Image Zoom. */
.pe-m6-thumb>img{transform:scale(1);transform-origin:center center;transition:transform var(--pe-image-zoom-duration) var(--pe-image-motion-ease)!important;will-change:transform}
.pe-m6-card:hover .pe-m6-thumb>img,.pe-m6-card:focus-within .pe-m6-thumb>img{transform:scale(var(--pe-image-zoom-scale))!important}
@media(prefers-reduced-motion:reduce){.pe-m6-thumb>img,.pe-m6-card:hover .pe-m6-thumb>img,.pe-m6-card:focus-within .pe-m6-thumb>img{transition:none!important;transform:none!important;will-change:auto}}
