/*
 * Lingkar Kalteng v3.2.5 — Homepage Motion / Thumbnail Policy
 * Direction: calm, editorial, deliberate.
 * Thumbnail frames use cover + restrained 1.025x zoom; legacy image overrides are removed.
 */
.home-site-main{
  --lk-motion-fast:160ms;
  --lk-motion:180ms;
  --lk-motion-slow:220ms;
  --lk-motion-ease:cubic-bezier(.2,.65,.2,1);
}

/* BREAKING NEWS uses the established ticker animation already defined in main.css. */
.home-site-main .breaking-track a{
  transition:color var(--lk-motion-fast) ease !important;
}

/* Hero: brief opacity-only fade; removing translate motion keeps mobile swipes light. */
.home-site-main .hero-slide{
  transform:none !important;
  transition:opacity 220ms var(--lk-motion-ease),
             visibility 0s linear 220ms !important;
}
.home-site-main .hero-slide.is-active{transform:none !important;transition-delay:0s !important;}
.home-site-main .hero-nav,
.home-site-main .hero-dot,
.home-site-main .highlight-nav,
.home-site-main .home-archive-nav-button,
.home-site-main .index-news-nav-button,
.home-site-main .lk-kda-archive-button,
.home-site-main .jelajah-feature__nav{
  transition:background-color var(--lk-motion-fast) ease,
             color var(--lk-motion-fast) ease,
             border-color var(--lk-motion-fast) ease,
             opacity var(--lk-motion-fast) ease,
             box-shadow var(--lk-motion-fast) ease !important;
}
.home-site-main .hero-nav:hover,
.home-site-main .hero-nav:active,
.home-site-main .highlight-nav:hover,
.home-site-main .highlight-nav:active,
.home-site-main .home-archive-nav-button:hover:not(:disabled),
.home-site-main .home-archive-nav-button:active:not(:disabled),
.home-site-main .index-news-nav-button:hover:not(:disabled),
.home-site-main .index-news-nav-button:active:not(:disabled),
.home-site-main .lk-kda-archive-button:hover,
.home-site-main .lk-kda-archive-button:active,
.home-site-main .jelajah-feature__nav:hover,
.home-site-main .jelajah-feature__nav:active{
  transform:none !important;
}
.home-site-main .hero-dot:hover{
  transform:none !important;
}

/* All linked editorial titles/text turn red on pointer hover, while the text
   itself stays in place. This applies consistently across homepage modules. */
.home-site-main h1 a,
.home-site-main h2 a,
.home-site-main h3 a,
.home-site-main h4 a,
.home-site-main .regional-title-text,
.home-site-main .regional-more-title,
.home-site-main .photo-home-card h3 a,
.home-site-main .lk-kda-story-title a{
  transition:color var(--lk-motion-fast) ease !important;
  transform:none !important;
  top:auto !important;
}
.home-site-main h1:hover > a,
.home-site-main h2:hover > a,
.home-site-main h3:hover > a,
.home-site-main h4:hover > a,
.home-site-main h1 a:hover,
.home-site-main h2 a:hover,
.home-site-main h3 a:hover,
.home-site-main h4 a:hover,
.home-site-main .regional-lead:hover .regional-title-text,
.home-site-main .regional-more:hover .regional-more-title,
.home-site-main .photo-home-card h3:hover a,
.home-site-main .lk-kda-story-title:hover a{
  color:var(--red) !important;
  transform:none !important;
  top:auto !important;
}

/* HERO story cards stay still; the homepage interaction system uses only color/shadow feedback. */
.home-site-main .hero-story-nav-card,
.home-site-main .hero-story-nav-card:hover,
.home-site-main .hero-story-nav-card:focus-visible{
  animation:none !important;
  transform:none !important;
}

/* Cards: hierarchy comes from typography and shadow, not movement. */
.home-site-main .regional-lead,
.home-site-main .regional-more,
.home-site-main .regional-section .regional-strip > .regional-box,
.home-site-main .split-editorial-card,
.home-site-main .popular-feature-card,
.home-site-main .index-news-card,
.home-site-main .feature-story-card,
.home-site-main .insight-feature-card,
.home-site-main .jelajah-small,
.home-site-main .jelajah-feature{
  transform:none !important;
  transition:border-color var(--lk-motion) ease,
             box-shadow var(--lk-motion) ease,
             background-color var(--lk-motion) ease !important;
}
.home-site-main .regional-lead:hover,
.home-site-main .regional-more:hover,
.home-site-main .split-editorial-card:hover,
.home-site-main .popular-feature-card:hover,
.home-site-main .index-news-card:hover,
.home-site-main .feature-story-card:hover,
.home-site-main .insight-feature-card:hover,
.home-site-main .jelajah-small:hover,
.home-site-main .jelajah-feature:hover{
  transform:none !important;
}
.home-site-main .public-feature-card:hover,
.home-site-main .public-feature-card:focus-within,
.home-site-main .pariwisata-feature-card:hover,
.home-site-main .pariwisata-feature-card:focus-within,
.home-site-main .home-lead>.sidebox>.popular-widget .most-read li:hover,
.home-site-main .home-lead>.sidebox>.popular-widget .most-read li:focus-within{
  transform:none !important;
}
.home-site-main .index-news-card:hover,
.home-site-main .feature-story-card:hover,
.home-site-main .insight-feature-card:hover{
  box-shadow:0 5px 14px rgba(11,29,42,.07) !important;
}

/* Thumbnail media rules are centralized in main.css. */

.home-site-main .video-preview{
  display:block !important;
  position:relative !important;
  width:100% !important;
  height:100% !important;
  overflow:hidden !important;
}

/* Red line accents stay static; they no longer grow/scale on hover. */
.home-site-main .index-news-card::before,
.home-site-main .jelajah-small::before{
  transform:none !important;
  transition:opacity var(--lk-motion-fast) ease !important;
}

/* Feature Story: clean, five-card desktop rail matching the supplied visual. */
.home-site-main .feature-story-section{margin-bottom:28px;}
.home-site-main .feature-story-card{
  flex-basis:calc((100% - 40px)/5) !important;
  min-width:0;
  overflow:hidden;
  border:1px solid #e1e6e9;
  border-radius:3px;
  background:#fff;
  box-shadow:0 2px 9px rgba(11,29,42,.035);
}
.home-site-main .feature-story-card__image{
  display:block;
  width:100%;
  aspect-ratio:16 / 9;
  overflow:hidden;
  background:#eef1f3;
}
.home-site-main .feature-story-card__image picture,
.home-site-main .feature-story-card__image > img,
.home-site-main .feature-story-card__image > .video-preview{
  display:block;width:100%;height:100%;
}
.home-site-main .feature-story-card__image img{
  width:100%;height:100%;object-fit:cover;
}
.home-site-main .feature-story-card__body{padding:7px 8px 8px;}
.home-site-main .feature-story-card__category{
  min-height:9px;color:var(--red);font-size:7px;line-height:1.1;
  font-weight:900;letter-spacing:.095em;text-transform:uppercase;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.home-site-main .feature-story-card h3{
  margin:4px 0 0;font-family:var(--lk-font-ui,Inter,system-ui,sans-serif);
  font-size:11.5px;line-height:1.17;font-weight:800;letter-spacing:-.006em;
  min-height:2.34em;max-height:2.34em;display:-webkit-box;
  -webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;
}
.home-site-main .feature-story-card h3 a{color:var(--ink);}
.home-site-main .feature-story-card h3 a:hover{color:var(--red);}



/* BERITA POPULER: one canonical title-hover rule. */
.home-site-main .home-lead > .sidebox > .popular-feature-card .jelajah-feature__overlay h3 > a{
  color:#fff !important;
  transition:color .18s ease !important;
}
.home-site-main .home-lead > .sidebox > .popular-feature-card .jelajah-feature__overlay h3 > a:hover,
.home-site-main .home-lead > .sidebox > .popular-feature-card .jelajah-feature__overlay h3 > a:focus-visible,
.home-site-main .home-lead > .sidebox > .popular-feature-card .jelajah-feature__overlay h3 > a:focus{
  color:var(--red) !important;
}

/* Loading states: no spinning graphics. */
.home-site-main .index-news-nav-button.is-loading::after{
  content:'…' !important;
  width:auto !important;height:auto !important;
  border:0 !important;border-radius:0 !important;
  animation:none !important;
}

/* Mobile menu/backdrop: keep the existing slide behavior but remove the extra
   keyframe layer so opening the menu reads as one clean motion. */
.home-site-main .nav-backdrop:not([hidden]){
  animation:none !important;
  opacity:1 !important;
}

@media(max-width:1100px){
  .home-site-main .feature-story-card{flex-basis:calc((100% - 20px)/3) !important;}
}
@media(max-width:760px){
  .home-site-main .feature-story-card{flex-basis:calc((100% - 10px)/2) !important;}
}
@media(max-width:560px){
  .home-site-main .feature-story-card{flex-basis:100% !important;}
}

@media(prefers-reduced-motion:reduce){
  .home-site-main *,
  .home-site-main *::before,
  .home-site-main *::after{
    scroll-behavior:auto !important;
  }
  .home-site-main .breaking-track,
  .home-site-main .hero-slide,
  .home-site-main .home-archive-track,
  .home-site-main .index-news-track,
  .home-site-main .hero-story-nav-card,
  .home-site-main .feature-story-card,
  .home-site-main .insight-feature-card{
    transition:none !important;
  }
}


/* v3.1.42 — Compact Popular list; avoid promoting rows for disabled translate motion. */
.home-site-main .home-lead > .sidebox > .popular-widget .most-read li {
  grid-template-columns: 23px minmax(0, 1fr) !important;
  gap: 3px !important;
  will-change: auto !important;
  transition:background-color var(--lk-motion-fast) ease,box-shadow var(--lk-motion-fast) ease !important;
}

/* Editorial title hover: use the theme red only while the title itself is targeted. */
.home-site-main .sidebar > .kalteng-hari-ini-feature-card[data-jelajah-carousel="kalteng-hari-ini"] .jelajah-feature__overlay h3:hover > a,
.home-site-main .sidebar > .kalteng-hari-ini-feature-card[data-jelajah-carousel="kalteng-hari-ini"] .jelajah-feature__overlay h3 > a:hover,
.home-site-main .sidebar > .kalteng-hari-ini-feature-card[data-jelajah-carousel="kalteng-hari-ini"] .jelajah-feature__overlay h3:focus-within > a,
.home-site-main .sidebar > .kalteng-hari-ini-feature-card[data-jelajah-carousel="kalteng-hari-ini"] .jelajah-feature__overlay h3 > a:focus-visible,
.home-site-main .sidebar > .kalteng-sepekan-feature-card[data-jelajah-carousel="kalteng-sepekan"] .jelajah-feature__overlay h3:hover > a,
.home-site-main .sidebar > .kalteng-sepekan-feature-card[data-jelajah-carousel="kalteng-sepekan"] .jelajah-feature__overlay h3 > a:hover,
.home-site-main .sidebar > .kalteng-sepekan-feature-card[data-jelajah-carousel="kalteng-sepekan"] .jelajah-feature__overlay h3:focus-within > a,
.home-site-main .sidebar > .kalteng-sepekan-feature-card[data-jelajah-carousel="kalteng-sepekan"] .jelajah-feature__overlay h3 > a:focus-visible,
.home-site-main .sidebar > .osint-feature-card[data-jelajah-carousel="osint"] .jelajah-feature__overlay h3:hover > a,
.home-site-main .sidebar > .osint-feature-card[data-jelajah-carousel="osint"] .jelajah-feature__overlay h3 > a:hover,
.home-site-main .sidebar > .osint-feature-card[data-jelajah-carousel="osint"] .jelajah-feature__overlay h3:focus-within > a,
.home-site-main .sidebar > .osint-feature-card[data-jelajah-carousel="osint"] .jelajah-feature__overlay h3 > a:focus-visible,
.home-site-main .sidebar > .documents-feature-card[data-jelajah-carousel="dokumen-publik"] .jelajah-feature__overlay h3:hover > a,
.home-site-main .sidebar > .documents-feature-card[data-jelajah-carousel="dokumen-publik"] .jelajah-feature__overlay h3 > a:hover,
.home-site-main .sidebar > .documents-feature-card[data-jelajah-carousel="dokumen-publik"] .jelajah-feature__overlay h3:focus-within > a,
.home-site-main .sidebar > .documents-feature-card[data-jelajah-carousel="dokumen-publik"] .jelajah-feature__overlay h3 > a:focus-visible,
.home-site-main .humaniora-suara-grid > .split-editorial-panel .split-editorial-card--humaniora .split-editorial-card__body h3:hover > a,
.home-site-main .humaniora-suara-grid > .split-editorial-panel .split-editorial-card--humaniora .split-editorial-card__body h3 > a:hover,
.home-site-main .humaniora-suara-grid > .split-editorial-panel .split-editorial-card--humaniora .split-editorial-card__body h3:focus-within > a,
.home-site-main .humaniora-suara-grid > .split-editorial-panel .split-editorial-card--humaniora .split-editorial-card__body h3 > a:focus-visible,
.home-site-main .humaniora-suara-grid > .split-editorial-panel .split-editorial-card--suara-warga .split-editorial-card__body h3:hover > a,
.home-site-main .humaniora-suara-grid > .split-editorial-panel .split-editorial-card--suara-warga .split-editorial-card__body h3 > a:hover,
.home-site-main .humaniora-suara-grid > .split-editorial-panel .split-editorial-card--suara-warga .split-editorial-card__body h3:focus-within > a,
.home-site-main .humaniora-suara-grid > .split-editorial-panel .split-editorial-card--suara-warga .split-editorial-card__body h3 > a:focus-visible {
  color: var(--red, #d61f2c) !important;
  transition: color 180ms ease !important;
}
