/* =====================================================================
   Full Blue – News & articles (listing, article page, article cards, admin)
   Builds on main.css tokens. Load with 'styles' => ['assets/css/news.css'].
   ===================================================================== */

/* ---------- Article card (partials/article-card.php) ---------- */
.article-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,19rem),1fr));gap:1.5rem}
.article-grid>li{display:flex}
.article-card{position:relative;display:flex;flex-direction:column;width:100%;height:100%;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;transition:transform var(--dur) var(--ease),border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.article-card:hover{transform:translateY(-3px);border-color:var(--gold-500);box-shadow:var(--shadow-sm)}
.article-card-media{position:relative;aspect-ratio:16/9;background:var(--navy-900);overflow:hidden}
.article-card-media img{width:100%;height:100%;object-fit:cover;transition:transform 600ms var(--ease)}
.article-card:hover .article-card-media img{transform:scale(1.03)}
.article-card-fallback{position:absolute;inset:0;display:grid;place-items:center;color:var(--gold-400);background:radial-gradient(circle at 78% 22%,var(--navy-700) 0,transparent 55%),linear-gradient(135deg,var(--navy-900),var(--navy-950))}
.article-card-fallback .icon{width:3rem;height:3rem;stroke-width:1.4}
.article-card-body{display:flex;flex-direction:column;flex:1;padding:1.5rem 1.5rem 1.25rem}
.article-card-cat{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:0 0 .6rem;font-size:var(--text-xs);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-text)}
.article-card-badge{display:inline-block;padding:.15rem .55rem;border-radius:999px;background:var(--gold-500);color:var(--navy-950);letter-spacing:.08em}
.article-card-title{font-size:1.3rem;line-height:1.2;margin:0 0 .6rem}
.article-card-link{color:var(--navy-900);text-decoration:none}
.article-card-link::after{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit}
.article-card-link:hover{color:var(--navy-900);text-decoration:underline;text-decoration-color:var(--gold-500);text-decoration-thickness:2px}
.article-card:hover .article-card-link{text-decoration:underline;text-decoration-color:var(--gold-500);text-decoration-thickness:2px}
/* Focus ring on the whole card rather than just the title text */
.article-card:has(.article-card-link:focus-visible){outline:3px solid var(--navy-900);outline-offset:3px}
.article-card-link:focus-visible{outline:none}
@supports not selector(:has(*)){.article-card-link:focus-visible{outline:3px solid var(--navy-900);outline-offset:3px}}
.article-card-excerpt{flex:1;margin:0 0 1.1rem;font-size:var(--text-sm);color:var(--ink-soft)}
.article-card-meta{display:flex;flex-wrap:wrap;gap:.35rem 1.1rem;margin:0;padding-top:.9rem;border-top:1px solid var(--line);font-size:var(--text-xs);font-weight:600;color:var(--muted)}
.article-card-meta>span{display:inline-flex;align-items:center;gap:.35rem}
.article-card-meta .icon{width:1rem;height:1rem;color:var(--navy-700)}

/* Lead (large) card */
.article-card-lead .article-card-title{font-size:clamp(1.6rem,1.2rem + 1.5vw,2.5rem);line-height:1.12;margin-bottom:.9rem}
.article-card-lead .article-card-excerpt{font-size:var(--text-md);flex:0 1 auto;margin-bottom:1.5rem}
.article-card-lead .article-card-body{padding:clamp(1.5rem,3.5vw,3rem);justify-content:center}
@media (min-width:56em){
  .article-card-lead{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
  .article-card-lead .article-card-media{aspect-ratio:auto;min-height:24rem}
  .article-card-lead .article-card-media img{position:absolute;inset:0}
}

/* Cards on dark sections (e.g. homepage "Latest news" on navy) */
.on-dark .article-card{border-color:var(--line-dark)}
.on-dark .article-card p.article-card-excerpt{color:var(--ink-soft)}
.on-dark .article-card p.article-card-cat{color:var(--gold-text)}
.on-dark .article-card p.article-card-meta{color:var(--muted)}
.on-dark .article-card a.article-card-link{color:var(--navy-900)}

/* ---------- Listing ---------- */
.news-toolbar{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:.5rem 2rem}
.news-toolbar .filter-bar{flex:1 1 32rem}
.news-rss{padding-block:0;margin-bottom:1.5rem}
.news-lead{margin-bottom:1.5rem}
.news-empty p:last-child{margin-bottom:0}

.pagination{margin-top:clamp(2.5rem,5vw,3.5rem)}
.pagination ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem}
.pagination a{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-width:44px;min-height:44px;padding:.5rem .9rem;border:1.5px solid var(--line);border-radius:8px;background:var(--white);color:var(--navy-900);font-weight:600;font-size:var(--text-sm);text-decoration:none;transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease)}
.pagination a:hover{border-color:var(--navy-900);color:var(--navy-900)}
.pagination a[aria-current="page"]{background:var(--navy-900);border-color:var(--navy-900);color:var(--white)}
.pagination .icon{width:1rem;height:1rem}

/* ---------- Article page ---------- */
.article-hero{padding-bottom:clamp(3rem,6vw,5rem)}
.article-hero-inner{max-width:52rem}
.article-hero .article-title{max-width:24ch;font-size:clamp(2rem,1.4rem + 2.6vw,3.6rem)}
.article-hero .article-lead{max-width:44rem;margin-bottom:1.5rem}
.article-meta{list-style:none;margin:0;padding:1.25rem 0 0;border-top:1px solid var(--line-dark);display:flex;flex-wrap:wrap;gap:.5rem 1.75rem;font-size:var(--text-sm);color:rgba(255,255,255,.88)}
.article-meta li{display:inline-flex;align-items:center;gap:.45rem}
.article-meta .icon{width:1.05rem;height:1.05rem;color:var(--gold-400)}

.article-figure-wrap{position:relative;z-index:1}
.article-figure{margin:clamp(-3rem,-4vw,-1.5rem) 0 0;border-radius:var(--radius-lg);overflow:hidden;background:var(--navy-800);box-shadow:var(--shadow-md);border:1px solid var(--line)}
.article-figure img{width:100%;height:auto;max-height:44rem;object-fit:cover}

.article-layout{display:grid;grid-template-columns:minmax(0,46rem) minmax(13rem,17rem);justify-content:space-between;gap:2rem clamp(2rem,6vw,5rem);padding-block:clamp(2.5rem,6vw,4.5rem) var(--section)}
@media (max-width:56em){.article-layout{grid-template-columns:minmax(0,1fr)}}
.article-body{font-size:clamp(1.0625rem,1rem + .2vw,1.1875rem);line-height:1.75}
.article-body p,.article-body li{color:var(--ink)}
.article-body h2{font-size:clamp(1.5rem,1.25rem + .9vw,2rem)}
.article-body h3{font-size:clamp(1.2rem,1.1rem + .4vw,1.4rem)}
.article-body h4{font-size:1.1rem;font-family:var(--font-body)}
.article-body a{color:var(--navy-800);text-decoration-color:var(--gold-500);text-decoration-thickness:2px}
.article-body a:hover{color:var(--blue-500)}
.article-body ol{padding-left:1.6rem}
.article-body ol li::marker{font-weight:700;color:var(--navy-900)}
.article-body ul li::marker{color:var(--gold-600)}
.article-body blockquote{margin:2rem 0;padding:1.25rem 1.5rem 1.25rem 1.75rem;border-left:4px solid var(--gold-500);background:var(--blue-50);border-radius:0 var(--radius) var(--radius) 0;font-family:var(--font-display);font-size:1.25rem;line-height:1.5;color:var(--navy-900)}
.article-body blockquote p{color:var(--navy-900);margin-bottom:.6em}
.article-body blockquote p:last-child{margin-bottom:0}
.article-back{margin:2.5rem 0 0;padding-top:1.25rem;border-top:1px solid var(--line)}

.article-aside{align-self:start}
@media (min-width:56.01em){.article-aside{position:sticky;top:calc(var(--header-h) + 1.5rem)}}
.article-share{padding:1.5rem;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--white)}
.article-aside-title{font-family:var(--font-body);font-size:var(--text-xs);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--navy-900);margin:0 0 1rem}
.article-share ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
@media (max-width:56em){.article-share ul{grid-template-columns:repeat(auto-fit,minmax(9rem,1fr))}}
.share-link{display:flex;align-items:center;gap:.65rem;min-height:44px;padding:.5rem .85rem;border:1.5px solid var(--line);border-radius:8px;color:var(--navy-900);font-weight:600;font-size:var(--text-sm);text-decoration:none;transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease),color var(--dur) var(--ease)}
.share-link:hover{border-color:var(--navy-900);background:var(--navy-900);color:var(--white)}
.share-link .icon{width:1.15rem;height:1.15rem;flex:none}

.news-related .article-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,18rem),1fr))}

/* Admin preview banner (shown above the public template) */
.news-preview-banner{background:var(--gold-500);color:var(--navy-950);border-bottom:1px solid var(--gold-600)}
.news-preview-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem 1.5rem;padding-block:.75rem}
.news-preview-inner p{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;font-size:var(--text-sm)}
.news-preview-inner .icon{width:1.1rem;height:1.1rem}
.news-preview-inner .btn-navy:hover{background:var(--navy-950)}

/* ---------- Admin (news list and form) ---------- */
.news-admin-title{display:flex;align-items:center;gap:.75rem}
.news-admin-thumb{width:4.5rem;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:6px;border:1px solid var(--line);background:var(--navy-900);flex:none}
.news-admin-thumb-empty{display:grid;place-items:center;color:var(--gold-400)}
.news-admin-thumb-empty .icon{width:1.1rem;height:1.1rem}
.status-draft{background:#e5e7eb;color:#374151}
.status-published{background:var(--success-bg);color:var(--success)}
.status-scheduled{background:var(--blue-100);color:var(--navy-900)}
.news-admin-actions{display:flex;flex-wrap:wrap;gap:.5rem}
.news-format-hint{margin:-.15rem 0 .5rem;font-size:var(--text-sm);color:var(--muted)}
.news-format-hint ul{list-style:none;margin:.35rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem .5rem}
.news-format-hint code{display:inline-block;padding:.1rem .45rem;border-radius:5px;background:var(--blue-50);border:1px solid var(--line);color:var(--navy-900);font-size:.8125rem}
.news-image-current{display:grid;grid-template-columns:minmax(0,14rem) 1fr;gap:1rem;align-items:start;margin-bottom:1.25rem;padding:1rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--blue-50)}
@media (max-width:40em){.news-image-current{grid-template-columns:1fr}}
.news-image-current img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:6px;background:var(--navy-900)}
.news-image-current p{margin:0 0 .5rem;font-size:var(--text-sm)}
.news-image-current .field{margin-bottom:0}
.field input[type="file"]{padding:.55rem .7rem}

@media (prefers-reduced-motion:reduce){
  .article-card:hover{transform:none}
  .article-card:hover .article-card-media img{transform:none}
}
@media (forced-colors:active){
  .article-card,.share-link,.pagination a,.article-share{border:1px solid CanvasText}
  .pagination a[aria-current="page"]{forced-color-adjust:none;background:Highlight;color:HighlightText}
}
@media print{
  .article-aside,.news-related,.news-preview-banner,.pagination,.news-toolbar{display:none!important}
  .article-layout{grid-template-columns:1fr}
}