/* =============================================================================
   TestKav · pages/articles-luxe.css — LUXE skin for article_list + article_detail
   Loads alongside pages-luxe.css (which provides the shared .page-* system).
   Article-specific: post cards, pagination, chips, article body, related.
   ========================================================================== */
.article-deco{display:none !important}

/* ---------- list: post cards ---------- */
.posts-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:4px}
.post-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:#fff;transition:border-color .4s var(--ease),box-shadow .4s var(--ease),transform .4s var(--ease)}
.post-card:hover{border-color:var(--gold-soft);box-shadow:0 30px 64px -40px rgba(20,17,13,.34);transform:translateY(-4px)}
.post-cover{display:block;aspect-ratio:16/9;background:linear-gradient(150deg,var(--paper-2),#fff);overflow:hidden;position:relative}
.post-cover img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.post-card:hover .post-cover img{transform:scale(1.04)}
.post-cover:empty::after,.post-cover:not(:has(img))::after{content:"\F45F";font-family:"bootstrap-icons";position:absolute;inset:0;display:grid;place-items:center;font-size:2rem;color:var(--gold-soft)}
.post-body{display:flex;flex-direction:column;flex:1;padding:18px 18px 20px}
.post-title{font-family:var(--ff-d);font-weight:800;font-size:1.08rem;line-height:1.6;margin:0 0 10px}
.post-title a{color:var(--ink);transition:color .3s}
.post-card:hover .post-title a{color:var(--gold-deep)}
.post-excerpt{font-size:.86rem;color:var(--ink-2);line-height:1.85;margin-bottom:14px}
.post-excerpt p{margin:0}
.post-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:auto;font-size:.78rem;color:var(--ink-3)}
.post-meta .article-time,.post-meta .article-reading-time{display:inline-flex;align-items:center;gap:5px;margin:0}
.post-meta i{color:var(--gold-deep)}
.chip{display:inline-flex;align-items:center;gap:5px;font-size:.74rem;font-weight:600;color:var(--gold-deep);background:var(--gold-faint);border:1px solid var(--gold-soft);border-radius:999px;padding:4px 10px;transition:.3s var(--ease)}
a.chip:hover{background:var(--gold);color:#1c1402;border-color:transparent}
.post-actions{margin-top:14px}
.btn-list{display:inline-flex;align-items:center;gap:7px;font-family:var(--ff-d);font-weight:800;font-size:.84rem;color:var(--ink);background:#fff;border:1px solid var(--line-2);border-radius:11px;padding:9px 16px;box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease),background .3s var(--ease)}
.btn-list::after{content:"\F12F";font-family:"bootstrap-icons";color:var(--gold-deep);transition:transform .35s var(--ease)}
.btn-list:hover{border-color:var(--gold);color:var(--gold-deep);background:var(--paper-2);transform:translateY(-2px);box-shadow:0 10px 22px -12px var(--gold-soft)}
.btn-list:hover::after{transform:translateX(-4px)}
.btn-list:active{transform:translateY(0);box-shadow:var(--shadow-sm)}
.btn-list:focus-visible{outline:0;border-color:var(--gold);box-shadow:var(--ring)}

/* pagination */
.pagination{margin-top:30px}
.pagination-inner{display:flex;align-items:center;justify-content:center;gap:16px}
.page-link{display:inline-flex;align-items:center;gap:7px;font-size:.86rem;font-weight:600;color:var(--ink);border:1px solid var(--line-2);border-radius:11px;padding:9px 18px;background:#fff;box-shadow:var(--shadow-sm);transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease),background .3s var(--ease)}
.page-link:hover{border-color:var(--gold);color:var(--gold-deep);background:var(--paper-2);transform:translateY(-2px);box-shadow:0 10px 22px -12px var(--gold-soft)}
.page-link:active{transform:translateY(0);box-shadow:var(--shadow-sm)}
.page-link:focus-visible{outline:0;border-color:var(--gold);box-shadow:var(--ring)}
.page-info{font-size:.84rem;color:var(--ink-3)}
.empty-state{text-align:center;padding:50px 20px;border:1px dashed var(--line-2);border-radius:var(--r-md);color:var(--ink-3)}
.empty-state a{color:var(--gold-deep);text-decoration:underline;text-underline-offset:3px}

/* ---------- detail: figure + body ---------- */
.post-figure{margin:0 0 22px;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);background:var(--paper-2)}
.post-figure img,.post-figure video{width:100%;height:auto;display:block}
.post-content{font-size:1rem;color:var(--ink-2);line-height:2.05}
.post-content>*:first-child{margin-top:0}
.post-content p{margin:0 0 16px}
.post-content h2,.post-content h3,.post-content h4{font-family:var(--ff-d);font-weight:800;color:var(--ink);line-height:1.55;margin:30px 0 13px}
.post-content h2{font-size:1.4rem}.post-content h3{font-size:1.2rem}.post-content h4{font-size:1.05rem}
.post-content ul,.post-content ol{margin:0 0 16px;padding-inline-start:1.5em}
.post-content li{margin:0 0 9px}
.post-content a{color:var(--gold-deep);text-decoration:underline;text-underline-offset:3px}
.post-content strong,.post-content b{color:var(--ink);font-weight:700}
.post-content img{max-width:100%;height:auto;border-radius:var(--r-md);border:1px solid var(--line);margin:8px 0}
.post-content blockquote{margin:0 0 16px;padding:14px 18px;border-inline-start:3px solid var(--gold);background:var(--paper-2);border-radius:8px;color:var(--ink-2)}
.post-content pre{background:#14110d;color:#f4f1ea;border-radius:12px;padding:16px;overflow:auto;font-size:.85rem;margin:0 0 16px;direction:ltr}
.post-content code{background:var(--paper-2);border:1px solid var(--line);border-radius:6px;padding:1px 6px;font-size:.86em;direction:ltr}
.post-content pre code{background:none;border:0;padding:0}
.post-content table{width:100%;border-collapse:collapse;margin:0 0 16px;font-size:.9rem}
.post-content th,.post-content td{border:1px solid var(--line);padding:9px 12px;text-align:start}
.post-content th{background:var(--paper-2);font-family:var(--ff-d);font-weight:700;color:var(--ink)}

/* detail aside: meta + tags + related */
.side-card2 .simple-list>li{padding:7px 0}
.tag-cloud{display:flex;flex-wrap:wrap;gap:7px;margin-top:4px}
.articles-related{display:flex;align-items:center;gap:11px;border-top:1px solid var(--line);padding:12px 0 !important}
.articles-related.is-last{padding-bottom:0 !important}
.articles-related img{width:58px;height:46px;flex:none;object-fit:cover;border-radius:9px;border:1px solid var(--line)}
.articles-related .list-link{border:0 !important;padding:0 !important;color:var(--ink-2);line-height:1.6}
.articles-related .list-link:hover{color:var(--gold-deep);padding:0 !important}

/* ---------- responsive ---------- */
@media (max-width:900px){.posts-grid{grid-template-columns:1fr}}
@media (max-width:560px){.searchbar .search-btn{flex:1}}