/*
 * KabarLagi V2 visual fixes after screenshot review.
 * Focus: clean spacing, ticker below header, professional single post, recent list,
 * trending topics, author slider and media carousel.
 */

.kl-news-theme {
  --kl-edge-gap: clamp(14px, 2.5vw, 28px);
  --kl-card-pad: clamp(14px, 2vw, 22px);
  --kl-line: rgba(15, 23, 42, .10);
}

.kl-news-theme.kl-header-footer-bleed #page,
.kl-news-theme.kl-header-footer-bleed.kl-layout-mode-full #page {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow-x: clip;
}

.kl-news-theme .container,
.kl-news-theme #main > .container,
.kl-news-theme .top-bar .container,
.kl-news-theme .nav-1 > .container,
.kl-news-theme .nav-2 > .container,
.kl-news-theme #footer > .container,
.kl-news-theme #secondary > .container,
.kl-news-theme .kl-auto-ticker-wrap {
  width: min(calc(100% - (var(--kl-edge-gap) * 2)), var(--kl-container)) !important;
  max-width: var(--kl-container) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box;
}

@media (max-width: 480px) {
  .kl-news-theme {
    --kl-edge-gap: 12px;
  }
}

.kl-news-theme.kl-header-footer-bleed .site-header,
.kl-news-theme.kl-header-footer-bleed .nav-1,
.kl-news-theme.kl-header-footer-bleed .nav-2,
.kl-news-theme.kl-header-footer-bleed #secondary,
.kl-news-theme.kl-header-footer-bleed #footer {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.kl-news-theme .site-header {
  box-shadow: 0 1px 0 var(--kl-border);
}

.kl-news-theme .nav-1 .flex,
.kl-news-theme .nav-2 .flex {
  min-height: 60px;
  gap: clamp(10px, 2vw, 24px);
}

.kl-news-theme .site-branding {
  padding-block: 8px;
  min-width: 0;
}

.kl-news-theme .main-navigation > ul > li > a {
  font-size: 13px;
  white-space: nowrap;
}

.kl-news-theme .utility-links {
  gap: 10px;
}

/* ticker exactly below header */
.kl-news-theme .kl-auto-ticker-wrap {
  margin-top: 10px !important;
  margin-bottom: 0 !important;
}

.kl-news-theme .kl-ticker-news {
  min-height: 42px;
  border-radius: 14px;
  border: 1px solid rgba(var(--kl-orange-rgb), .20);
  background: linear-gradient(90deg, rgba(var(--kl-orange-rgb), .09), rgba(var(--kl-orange-2-rgb), .05)), var(--kl-surface);
  box-shadow: 0 8px 22px rgba(15, 23, 42, .05);
}

.kl-news-theme .kl-ticker-label {
  border-radius: 12px;
  background: linear-gradient(135deg, var(--kl-orange), var(--kl-orange-2));
  color: #fff;
  box-shadow: 0 8px 18px rgba(var(--kl-orange-rgb), .24);
}

.kl-news-theme #header + #main .container,
.kl-news-theme #header + .breadcrumbs-wrap {
  padding-top: 18px !important;
}

/* homepage refinement */
.kl-home-magazine-v2 {
  display: block;
}

.kl-home-hero-v2 {
  grid-template-columns: minmax(0, 1.34fr) minmax(0, .66fr) minmax(0, .66fr);
  grid-auto-rows: minmax(176px, auto);
  gap: 14px;
  margin-bottom: 26px;
}

.kl-home-hero-v2 .kl-hero-main {
  grid-row: span 2;
  min-height: clamp(330px, 44vw, 520px);
}

.kl-home-hero-v2 .kl-hero-side {
  min-height: 170px;
}

.kl-news-theme .kl-card-overlay .kl-card-body {
  background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.10) 18%, rgba(0,0,0,.82) 100%);
}

.kl-news-theme .kl-news-card {
  min-width: 0;
  overflow: hidden;
}

.kl-news-theme .kl-card-title {
  overflow-wrap: anywhere;
}

.kl-news-theme .kl-card-media img,
.kl-news-theme .kl-card-placeholder,
.kl-v2-thumb-placeholder {
  background: linear-gradient(135deg, rgba(var(--kl-orange-rgb), .12), rgba(var(--kl-orange-2-rgb), .05));
}

.kl-news-grid-v2,
.kl-v2-flex-grid {
  display: grid;
  grid-template-columns: repeat(var(--kl-home-latest-columns), minmax(0, 1fr));
  gap: 18px;
}

.kl-v2-heading-line {
  align-items: center;
  padding: 0 0 13px;
  border-bottom: 1px solid var(--kl-border);
  margin-bottom: 18px;
}

.kl-v2-heading-line h2 {
  position: relative;
  padding-left: 14px;
}

.kl-v2-heading-line h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: .12em;
  bottom: .12em;
  width: 5px;
  border-radius: 10px;
  background: linear-gradient(180deg, var(--kl-orange), var(--kl-orange-2));
}

.kl-v2-home-strip {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
  gap: 20px;
  margin: 0 0 30px;
}

/* professional recent list like reference image */
.kl-v2-widget {
  background: var(--kl-surface);
  border: 1px solid var(--kl-border);
  border-radius: 18px;
  padding: clamp(16px, 2vw, 24px);
  box-shadow: var(--kl-shadow-sm);
}

.kl-v2-widget-title {
  margin: 0 0 14px;
  color: var(--kl-text);
  font-size: 14px;
  line-height: 1.2;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.kl-v2-widget-title span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.kl-v2-widget-title span::before {
  content: "";
  width: 5px;
  height: 18px;
  border-radius: 8px;
  background: linear-gradient(180deg, var(--kl-orange), var(--kl-orange-2));
}

.kl-v2-recent-list {
  display: grid;
  gap: 0;
}

.kl-v2-recent-item {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  padding: 16px 0;
  border-top: 1px solid var(--kl-border);
}

.kl-v2-recent-item:first-child {
  border-top: 0;
  padding-top: 0;
}

.kl-v2-recent-thumb {
  display: block;
  position: relative;
  aspect-ratio: 4 / 3;
  border-radius: 3px;
  overflow: hidden;
  background: #eee;
}

.kl-v2-recent-thumb img,
.kl-v2-thumb-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.kl-v2-recent-body {
  min-width: 0;
}

.kl-v2-recent-body .kl-post-badge {
  margin-bottom: 6px;
  font-size: 9px;
  padding: 4px 7px;
}

.kl-v2-recent-body h3 {
  margin: 0;
  color: var(--kl-text);
  font-size: clamp(18px, 2.2vw, 28px);
  line-height: 1.24;
  font-weight: 700;
  letter-spacing: -.02em;
}

.kl-v2-recent-body h3 a {
  color: inherit;
}

.kl-v2-recent-body h3 a:hover {
  color: var(--kl-orange);
}

.kl-v2-mini-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 7px;
  color: var(--kl-muted);
  font-size: 11px;
  font-weight: 700;
}

/* trending topics */
.kl-v2-trending {
  align-self: start;
}

.kl-v2-topic-list {
  display: grid;
  gap: 4px;
}

.kl-v2-topic-list a {
  display: flex;
  align-items: center;
  min-height: 42px;
  padding: 8px 0;
  color: var(--kl-text-soft);
  font-size: clamp(17px, 1.7vw, 22px);
  line-height: 1.25;
  font-weight: 800;
}

.kl-v2-topic-list a:hover {
  color: var(--kl-orange);
  transform: translateX(3px);
}

.kl-v2-trending-posts {
  counter-reset: trend;
  list-style: none;
  margin: 0;
  padding: 0;
}

.kl-v2-trending-posts li {
  counter-increment: trend;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  column-gap: 12px;
  padding: 12px 0;
  border-top: 1px solid var(--kl-border);
}

.kl-v2-trending-posts li::before {
  content: counter(trend, decimal-leading-zero);
  color: var(--kl-orange);
  font-weight: 900;
}

.kl-v2-trending-posts a {
  color: var(--kl-text);
  font-weight: 800;
  line-height: 1.35;
}

.kl-v2-trending-posts span {
  grid-column: 2;
  color: var(--kl-muted);
  font-size: 11px;
  font-weight: 700;
}

/* author and media carousel */
.kl-v2-carousel-section {
  margin: 34px 0;
  padding: clamp(18px, 2.5vw, 28px);
  background: var(--kl-surface);
  border: 1px solid var(--kl-border);
  border-radius: 22px;
  box-shadow: var(--kl-shadow-sm);
}

.kl-v2-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--kl-border);
  margin-bottom: 18px;
}

.kl-v2-section-head h2 {
  margin: 0;
  color: var(--kl-text);
  font-size: clamp(22px, 2.4vw, 30px);
  line-height: 1.15;
  font-weight: 900;
  letter-spacing: -.03em;
  text-transform: uppercase;
}

.kl-v2-section-head p {
  margin: 9px 0 0;
  color: var(--kl-text-soft);
  font-size: 16px;
  line-height: 1.45;
}

.kl-v2-carousel-actions {
  display: flex;
  gap: 8px;
  flex: 0 0 auto;
}

.kl-v2-carousel-actions button {
  width: 36px;
  height: 36px;
  padding: 0 !important;
  border-radius: 50%;
  font-size: 22px;
  line-height: 1;
  display: inline-grid;
  place-items: center;
}

.kl-v2-scroll-row {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(260px, 31%);
  gap: 18px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: inline mandatory;
  scrollbar-width: thin;
  padding-bottom: 8px;
}

.kl-v2-scroll-row > * {
  scroll-snap-align: start;
}

.kl-v2-author-card {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 14px;
  min-height: 130px;
  padding: 18px;
  border: 1px solid var(--kl-border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--kl-surface) 82%, var(--kl-orange) 4%);
}

.kl-v2-author-avatar img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
}

.kl-v2-author-info h3 {
  margin: 0 0 8px;
  color: var(--kl-text);
  font-size: 18px;
  font-weight: 900;
  line-height: 1.2;
}

.kl-v2-author-info p {
  margin: 0;
  color: var(--kl-text-soft);
  font-size: 15px;
  line-height: 1.48;
}

.kl-v2-author-info span {
  display: inline-flex;
  margin-top: 10px;
  color: var(--kl-orange);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.kl-v2-media-row {
  grid-auto-columns: minmax(230px, 28%);
}

.kl-v2-media-card {
  min-width: 0;
}

.kl-v2-media-thumb {
  position: relative;
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border-radius: 16px;
  background: #111;
}

.kl-v2-media-thumb img,
.kl-v2-media-thumb .kl-v2-thumb-placeholder {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .25s ease;
}

.kl-v2-media-thumb:hover img {
  transform: scale(1.04);
}

.kl-v2-play-badge {
  position: absolute;
  left: 14px;
  bottom: 14px;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  color: #fff;
  background: rgba(var(--kl-orange-rgb), .92);
  box-shadow: 0 10px 26px rgba(0,0,0,.25);
  font-size: 15px;
}

.kl-v2-media-card h3 {
  margin: 12px 0 0;
  color: var(--kl-text);
  font-size: 17px;
  line-height: 1.28;
  font-weight: 900;
}

/* single post news website layout */
.single.kl-news-theme #primary,
.single.kl-news-theme #sidebar {
  text-align: left;
}

.single.kl-news-theme #primary:not(.full-width) {
  width: min(100%, 72%) !important;
}

.single.kl-news-theme #sidebar {
  width: 28% !important;
}

.single.kl-news-theme #content > article,
.single.kl-news-theme .entry-header {
  max-width: none;
}

.single.kl-news-theme .entry-header {
  margin-bottom: 18px;
}

.single.kl-news-theme .single-post-title,
.single.kl-news-theme .entry-full .entry-title {
  max-width: 980px;
  margin: 0 0 14px !important;
  color: var(--kl-text);
  font-size: clamp(32px, 4.5vw, var(--kl-single-title-size)) !important;
  line-height: 1.08 !important;
  font-weight: 900 !important;
  letter-spacing: -.045em;
}

.single.kl-news-theme .entry-sub-title {
  max-width: 820px;
  color: var(--kl-text-soft);
  font-size: clamp(17px, 1.6vw, 21px);
  line-height: 1.48;
}

.single.kl-news-theme .single-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  max-width: 980px;
  padding: 12px 0 18px;
  margin: 0;
  border-bottom: 1px solid var(--kl-border);
  color: var(--kl-muted);
}

.single.kl-news-theme .single-meta .meta-grid,
.single.kl-news-theme .meta-row,
.single.kl-news-theme .meta-row li {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin: 0;
  padding: 0;
}

.single.kl-news-theme .single-meta img.avatar,
.single.kl-news-theme .meta-grid img.avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
}

.single.kl-news-theme .single-meta a {
  color: var(--kl-text);
  font-weight: 800;
}

.single.kl-news-theme .social-grid {
  display: flex;
  align-items: center;
  gap: 8px;
}

.single.kl-news-theme .social-grid a {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--kl-surface) 86%, var(--kl-orange) 7%);
  color: var(--kl-orange);
}

.single.kl-news-theme .entry-header .wp-post-image,
.single.kl-news-theme .entry-header .format-content img,
.single.kl-news-theme article > .post-thumbnail img,
.single.kl-news-theme .entry-media img,
.single.kl-news-theme .article-body > figure:first-child img {
  width: 100%;
  border-radius: var(--kl-single-featured-radius);
  box-shadow: 0 16px 42px rgba(15, 23, 42, .12);
}

.single.kl-news-theme .article-body {
  max-width: var(--kl-single-content-width);
  color: var(--kl-text-soft);
  font-size: var(--kl-single-text-size) !important;
  line-height: 1.82 !important;
  letter-spacing: -.005em;
}

.single.kl-news-theme .article-body p {
  margin-bottom: 1.35em;
}

.single.kl-news-theme .article-body h2,
.single.kl-news-theme .article-body h3,
.single.kl-news-theme .article-body h4 {
  color: var(--kl-text);
  font-weight: 900;
  line-height: 1.22;
  letter-spacing: -.025em;
}

.single.kl-news-theme .article-body img {
  border-radius: 14px;
  height: auto;
}

.single.kl-news-theme .tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 24px 0;
  padding: 0;
  list-style: none;
}

.single.kl-news-theme .tag-list li,
.single.kl-news-theme .tag-list a {
  display: inline-flex;
}

.single.kl-news-theme .tag-list a {
  padding: 7px 11px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--kl-surface) 80%, var(--kl-orange) 10%);
  color: var(--kl-orange);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.single.kl-news-theme .related-posts,
.single.kl-news-theme .post-navigation,
.single.kl-news-theme .comments-area,
.single.kl-news-theme .author-box {
  max-width: 980px;
}

/* sidebar polish */
.kl-news-theme #sidebar .widget,
.kl-news-theme #sidebar-b .widget {
  background: var(--kl-surface);
  border: 1px solid var(--kl-border);
  border-radius: 18px;
  padding: 18px;
  box-shadow: var(--kl-shadow-sm);
  margin-bottom: 18px;
}

.kl-news-theme #sidebar .widget-title,
.kl-news-theme #sidebar-b .widget-title {
  margin-bottom: 14px;
  color: var(--kl-text);
}

.kl-news-theme #sidebar ul,
.kl-news-theme #sidebar-b ul {
  margin-left: 0;
  list-style: none;
}

/* footer full background without odd left/right card padding */
.kl-news-theme #footer {
  background: #09090d !important;
  color: rgba(255,255,255,.72);
  border-top: 0 !important;
  margin-top: clamp(34px, 5vw, 72px);
  padding: 0 !important;
}

.kl-news-theme #footer .container {
  padding-top: 26px !important;
  padding-bottom: 26px !important;
}

.kl-news-theme #secondary {
  background: var(--kl-surface);
}

/* mobile */
@media (max-width: 1023px) {
  .kl-home-hero-v2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .kl-home-hero-v2 .kl-hero-main {
    grid-column: 1 / -1;
    min-height: 340px;
  }
  .kl-news-grid-v2,
  .kl-v2-flex-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .kl-v2-home-strip {
    grid-template-columns: 1fr;
  }
  .single.kl-news-theme #primary,
  .single.kl-news-theme #sidebar {
    float: none !important;
    width: 100% !important;
  }
  .single.kl-news-theme #sidebar {
    margin-top: 24px;
  }
}

@media (max-width: 768px) {
  .kl-news-theme .nav-1 .flex,
  .kl-news-theme .nav-2 .flex {
    min-height: 56px;
  }
  .kl-home-hero-v2,
  .kl-news-grid-v2,
  .kl-v2-flex-grid {
    grid-template-columns: 1fr;
  }
  .kl-home-hero-v2 .kl-hero-main,
  .kl-home-hero-v2 .kl-hero-side {
    min-height: 250px;
  }
  .kl-v2-recent-item {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 12px;
  }
  .kl-v2-recent-body h3 {
    font-size: 18px;
  }
  .kl-v2-scroll-row {
    grid-auto-columns: minmax(240px, 82%);
  }
  .kl-v2-section-head {
    align-items: flex-start;
  }
  .single.kl-news-theme .single-meta {
    display: grid;
    gap: 10px;
  }
  .single.kl-news-theme .article-body {
    max-width: 100%;
  }
}

@media (max-width: 480px) {
  .kl-news-theme .container,
  .kl-news-theme #main > .container,
  .kl-news-theme .top-bar .container,
  .kl-news-theme .nav-1 > .container,
  .kl-news-theme .nav-2 > .container,
  .kl-news-theme #footer > .container,
  .kl-news-theme #secondary > .container,
  .kl-news-theme .kl-auto-ticker-wrap {
    width: min(calc(100% - 24px), var(--kl-container)) !important;
  }
  .kl-v2-recent-item {
    grid-template-columns: 86px minmax(0, 1fr);
  }
  .kl-news-theme .kl-ticker-label {
    display: none;
  }
}

/* Existing custom KabarLagi footer/header blocks: force full-bleed background but aligned inner content. */
.kl-news-theme .kl-footer-full,
.kl-news-theme footer .kl-footer-full,
.kl-news-theme #footer .kl-footer-full {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  border-radius: 0 !important;
  box-sizing: border-box;
}

.kl-news-theme .kl-footer-full > *,
.kl-news-theme .kl-footer-top,
.kl-news-theme .kl-footer-bottom,
.kl-news-theme .kl-footer-inner {
  width: min(calc(100% - (var(--kl-edge-gap) * 2)), var(--kl-container));
  max-width: var(--kl-container);
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box;
}

.kl-news-theme .kl-footer-full .kl-footer-top,
.kl-news-theme .kl-footer-full .kl-footer-bottom {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.kl-news-theme .kl-footer-full iframe,
.kl-news-theme .kl-footer-full .map,
.kl-news-theme .kl-footer-full .google-map {
  max-width: 100%;
  border-radius: 14px;
}

.kl-news-theme .fixed-widget-bar,
.kl-news-theme .qalam-sharing-container.fixed,
.kl-news-theme .floating-share,
.kl-news-theme .share-floating {
  max-width: 44px;
  z-index: 29;
}