/* LUKIK Blog listing v1.0.9 — compact top-aligned intro + right-side decorative art */
.lk-blog-page { overflow:hidden; background:#fff; color:var(--lk-navy); }
.lk-blog-page button,.lk-blog-page input,.lk-blog-page select { font:inherit; }
.lk-blog-page a { text-decoration:none; }

.lkb-index {
  padding:20px 0 54px;
  background:var(--lk-page-bg);
}
.lkb-breadcrumbs { display:flex; align-items:center; flex-wrap:wrap; gap:9px; margin:0 0 18px; font-size:13px; color:#8190a8; }
.lkb-breadcrumbs a { color:#71819a; }
.lkb-breadcrumbs a:hover { color:var(--lk-blue); }
.lkb-breadcrumbs i { color:#aab6c7; font-size:9px; }
.lkb-breadcrumbs span { color:#596b87; font-weight:650; }

.lkb-page-intro {
  min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,350px);
  align-items:start;
  gap:38px;
  margin-bottom:30px;
}
.lkb-page-intro__copy { min-width:0; }

/* Override shared UI Foundation max-width only for Blog listing. */
.lk-page-intro.lkb-page-intro { max-width:none; }
.lkb-page-intro__art {
  min-height:0;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  justify-self:end;
  width:100%;
  position:relative;
  isolation:isolate;
}
.lkb-page-intro__art::before {
  content:"";
  position:absolute;
  inset:8% 2% 4%;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(ellipse at 54% 50%,rgba(190,218,255,.32) 0%,rgba(220,236,255,.16) 50%,rgba(238,246,255,0) 78%);
  filter:blur(10px);
}
.lkb-page-intro__art img {
  display:block;
  width:min(100%,340px);
  height:auto;
  margin-left:auto;
  filter:saturate(.96);
  -webkit-mask-image:
    linear-gradient(to right,transparent 0%,#000 7%,#000 93%,transparent 100%),
    linear-gradient(to bottom,transparent 0%,#000 6%,#000 94%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:
    linear-gradient(to right,transparent 0%,#000 7%,#000 93%,transparent 100%),
    linear-gradient(to bottom,transparent 0%,#000 6%,#000 94%,transparent 100%);
  mask-composite:intersect;
}

.lkb-layout { display:grid; grid-template-columns:260px minmax(0,1fr); gap:30px; align-items:start; }
.lkb-sidebar { display:grid; gap:16px; position:sticky; top:92px; }
.lkb-sidebar__card { padding:18px; border:1px solid #dce7f3; border-radius:18px; background:#fff; box-shadow:0 8px 24px rgba(34,77,133,.045); }
.lkb-sidebar__title { display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.lkb-sidebar__title i { width:28px; height:28px; display:grid; place-items:center; border-radius:9px; color:var(--lk-blue); background:#eef6ff; font-size:13px; }
.lkb-sidebar__title h2 { margin:0; color:#0a2456; font-size:17px; line-height:1.2; font-weight:820; letter-spacing:-.015em; }
.lkb-topic-menu { display:grid; gap:5px; }
.lkb-topic-menu a { min-height:40px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 11px; border-radius:11px; color:#536782; font-size:12px; font-weight:680; transition:.16s ease; }
.lkb-topic-menu a i { color:#a5b2c4; font-size:8px; opacity:0; transform:translateX(-3px); transition:.16s ease; }
.lkb-topic-menu a:hover { color:var(--lk-blue); background:#f5f9ff; }
.lkb-topic-menu a:hover i { opacity:1; transform:none; }
.lkb-topic-menu a.is-active { color:#0878f9; background:#eaf4ff; font-weight:780; }
.lkb-topic-menu a.is-active i { opacity:1; color:#7eb8f6; transform:none; }
.lkb-tag-cloud { display:flex; flex-wrap:wrap; gap:8px; }
.lkb-tag-cloud a { padding:7px 10px; border:1px solid #dce7f3; border-radius:9px; color:#62758f; background:#fbfdff; font-size:10.5px; font-weight:700; }
.lkb-tag-cloud a:hover,.lkb-tag-cloud a.is-active { border-color:#b9d7f9; color:var(--lk-blue); background:#edf6ff; }

.lkb-main { min-width:0; }
.lkb-section-heading { margin-bottom:14px; }
.lkb-section-heading--compact { margin-bottom:12px; }
.lkb-heading-line { display:flex; align-items:center; gap:10px; }
.lkb-heading-line > i { color:#ff9c28; font-size:17px; }
.lkb-section-heading h2 { margin:0; color:#0a2456; font-size:23px; line-height:1.2; font-weight:840; letter-spacing:-.02em; }
.lkb-section-heading--split { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:25px; margin-bottom:16px; }
.lkb-section-heading--split > div:first-child { display:flex; align-items:baseline; gap:10px; }
.lkb-count { color:#8a98ab; font-size:11px; font-weight:700; white-space:nowrap; }

.lkb-featured-card { min-height:235px; display:grid; grid-template-columns:minmax(310px,.88fr) minmax(0,1.12fr); overflow:hidden; border:1px solid #dce8f5; border-radius:18px; color:var(--lk-navy); background:#fff; box-shadow:0 10px 28px rgba(31,70,130,.06); transition:.18s ease; }
.lkb-featured-card:hover { border-color:#c9def3; box-shadow:0 16px 36px rgba(31,70,130,.09); transform:translateY(-2px); }
.lkb-featured-card__media { min-height:235px; overflow:hidden; background:linear-gradient(135deg,#eaf5ff,#f7fbff); }
.lkb-featured-card__media img,.lkb-card__media img { width:100%; height:100%; display:block; object-fit:cover; }
.lkb-featured-card__body { position:relative; padding:26px 30px; display:flex; flex-direction:column; align-items:flex-start; }
.lkb-card__labels { display:flex; flex-wrap:wrap; gap:7px; align-items:center; }
.lkb-topic-label { display:inline-flex; align-items:center; padding:5px 9px; border-radius:999px; color:#0878f9; background:#eaf4ff; font-size:9px; font-weight:800; }
.lkb-featured-card h3 { margin:14px 0 9px; color:#0b2457; font-size:25px; line-height:1.22; letter-spacing:-.025em; font-weight:840; }
.lkb-featured-card p { margin:0; max-width:690px; color:#677991; font-size:13px; line-height:1.62; }
.lkb-card__meta { display:flex; flex-wrap:wrap; gap:13px; color:#8291a7; font-size:10px; }
.lkb-featured-card .lkb-card__meta { margin-top:auto; padding-top:17px; }
.lkb-card__meta span,.lkb-card__meta a { display:inline-flex; align-items:center; gap:5px; color:inherit; }
.lkb-card__meta a:hover { color:var(--lk-blue); }
.lkb-featured-card__arrow { position:absolute; right:24px; bottom:23px; width:34px; height:34px; display:grid; place-items:center; border:1px solid #dfe8f3; border-radius:50%; color:#193764; background:#fff; font-size:12px; }

.lkb-sort { position:relative; min-width:235px; height:42px; display:grid; grid-template-columns:auto minmax(0,1fr) 20px; align-items:center; gap:7px; padding:0 10px 0 13px; border:1px solid #dce7f3; border-radius:12px; background:#fff; }
.lkb-sort > span { color:#8190a4; font-size:10.5px; font-weight:700; white-space:nowrap; }
.lkb-sort select { width:100%; border:0; outline:0; appearance:none; color:#243d66; background:transparent; font-size:11px; font-weight:760; cursor:pointer; }
.lkb-sort > i { pointer-events:none; color:#667a95; font-size:9px; text-align:center; }

.lkb-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.lkb-card { min-width:0; overflow:hidden; border:1px solid #e0e9f4; border-radius:16px; background:#fff; box-shadow:0 7px 20px rgba(34,77,133,.045); transition:.18s ease; }
.lkb-card:hover { transform:translateY(-3px); border-color:#ccdeef; box-shadow:0 14px 30px rgba(34,77,133,.09); }
.lkb-card__media { height:145px; display:block; overflow:hidden; background:linear-gradient(135deg,#eaf5ff,#f8fbff); }
.lkb-card__media img { transition:transform .25s ease; }
.lkb-card:hover .lkb-card__media img { transform:scale(1.025); }
.lkb-media-placeholder { width:100%; height:100%; display:grid; place-items:center; color:#84b9f5; font-size:38px; background:linear-gradient(135deg,#eaf5ff,#f7fbff); }
.lkb-card__body { min-height:205px; display:flex; flex-direction:column; align-items:stretch; padding:14px 15px 13px; }
.lkb-card__meta--top { justify-content:space-between; margin:0 0 8px; font-size:9.5px; }
.lkb-card__meta--top a { max-width:50%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#4c7fba; }
.lkb-card h3 { margin:0 0 7px; font-size:15px; line-height:1.38; letter-spacing:-.012em; font-weight:820; }
.lkb-card h3 a { color:#0b2457; }
.lkb-card h3 a:hover { color:var(--lk-blue); }
.lkb-card p { margin:0; color:#6e7c91; font-size:10.5px; line-height:1.58; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.lkb-card__footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:auto; padding-top:13px; color:#8896a9; font-size:9.5px; }
.lkb-card__footer > span { display:inline-flex; align-items:center; gap:5px; }
.lkb-read-link { width:30px; height:30px; display:grid; place-items:center; border-radius:50%; color:#183764; background:#f6f9fd; font-size:10px; transition:.16s ease; }
.lkb-read-link:hover { color:#fff; background:var(--lk-blue); }

.lkb-pagination-row { margin-top:26px; display:flex; align-items:center; justify-content:center; gap:20px; }
.lkb-pagination .pagination { margin:0; gap:6px; }
.lkb-pagination .page-link { min-width:35px; height:35px; display:grid; place-items:center; border:1px solid #dbe7f3; border-radius:10px!important; color:#536782; background:#fff; font-size:10.5px; font-weight:750; }
.lkb-pagination .page-item.active .page-link { border-color:var(--lk-blue); background:var(--lk-blue); color:#fff; }
.lkb-results { color:#8390a4; font-size:10.5px; }
.lkb-empty { min-height:300px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; border:1px dashed #d2dfed; border-radius:20px; background:#fbfdff; }
.lkb-empty__icon { width:62px; height:62px; display:grid; place-items:center; border-radius:18px; color:#74aef0; background:#eaf4ff; font-size:25px; }
.lkb-empty h2 { margin:16px 0 7px; color:#0d2a5a; font-size:23px; }
.lkb-empty p { margin:0; color:#7a899d; font-size:12.5px; }
.lkb-empty a { margin-top:16px; padding:9px 15px; border-radius:11px; background:#eaf4ff; color:var(--lk-blue); font-size:11px; font-weight:750; }

@media (max-width:1250px) {
  .lkb-layout { grid-template-columns:235px minmax(0,1fr); gap:22px; }
  .lkb-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:980px) {
  .lkb-page-intro { grid-template-columns:minmax(0,1fr) 260px; gap:24px; min-height:0; }
  .lkb-page-intro__art img { width:min(100%,255px); }
  .lkb-layout { grid-template-columns:1fr; }
  .lkb-sidebar { position:static; grid-template-columns:1fr 1fr; }
  .lkb-featured-card { grid-template-columns:minmax(280px,.9fr) minmax(0,1.1fr); }
}
@media (max-width:760px) {
  .lkb-index { padding-top:14px; }
  .lkb-page-intro { min-height:0; grid-template-columns:1fr; display:block; }
  .lkb-page-intro__art { display:none; }
  .lkb-breadcrumbs { margin-bottom:18px; font-size:11px; }
  .lkb-page-intro { margin-bottom:20px; }
  .lkb-sidebar { grid-template-columns:1fr; gap:10px; }
  .lkb-sidebar__card { padding:12px; }
  .lkb-sidebar__title { margin-bottom:9px; }
  .lkb-topic-menu { display:flex; gap:8px; overflow-x:auto; overscroll-behavior-inline:contain; scrollbar-width:thin; padding-bottom:2px; }
  .lkb-topic-menu a { flex:0 0 auto; min-height:34px; padding:7px 12px; border:1px solid #dce7f3; border-radius:999px; background:#fff; font-size:12px; }
  .lkb-topic-menu a i { display:none; }
  .lkb-topic-menu a.is-active { border-color:#bfd9fb; }
  .lkb-tag-cloud { flex-wrap:nowrap; overflow-x:auto; overscroll-behavior-inline:contain; scrollbar-width:thin; padding-bottom:2px; }
  .lkb-tag-cloud a { flex:0 0 auto; }
  .lkb-featured-card { grid-template-columns:1fr; }
  .lkb-featured-card__media { min-height:210px; height:210px; }
  .lkb-featured-card__body { padding:21px; }
  .lkb-featured-card h3 { font-size:22px; }
  .lkb-section-heading--split { align-items:flex-start; flex-direction:column; }
  .lkb-sort { width:100%; min-width:0; }
  .lkb-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:520px) {
  .lkb-layout { gap:20px; }
  .lkb-sidebar__card { padding:15px; border-radius:15px; }
  .lkb-grid { grid-template-columns:1fr; }
  .lkb-card__media { height:180px; }
  .lkb-card__body { min-height:0; }
  .lkb-pagination-row { align-items:flex-start; flex-direction:column; }
  .lkb-results { display:none; }
}