/* =============================================================
   Bud — news card component (.news-card)
   Extracted from the newsroom page so the homepage news blade and
   /company/news share one definition. Tokens only, no new colors
   or fonts (tokens.css + site.css must load first).

   Category jewel tones are used ONLY for categorical tagging,
   never as page/brand-primary — Electric Violet stays the hero.

   Variants:
     .news-card               standard card (thumb + body)
     .news-card.news-featured full-width two-column hero card
     .hn-grid .news-card      compact homepage sizing (see index.html)
   ============================================================= */

/* Category palette — each key sets the chip, thumbnail tint, icon disc */
.news-cat-award         { --cat:#F2C341; --cat-glow:rgba(242,195,65,0.10); --cat-fill:rgba(242,195,65,0.16); --cat-border:rgba(242,195,65,0.32); --cat-disc:rgba(242,195,65,0.14); --cat-disc-border:rgba(242,195,65,0.30); }
.news-cat-partnership   { --cat:#4F86F2; --cat-glow:rgba(79,134,242,0.10); --cat-fill:rgba(79,134,242,0.16); --cat-border:rgba(79,134,242,0.32); --cat-disc:rgba(79,134,242,0.14); --cat-disc-border:rgba(79,134,242,0.30); }
.news-cat-product       { --cat:#B785F4; --cat-glow:rgba(140,51,239,0.12); --cat-fill:rgba(140,51,239,0.16); --cat-border:rgba(183,133,244,0.34); --cat-disc:rgba(140,51,239,0.16); --cat-disc-border:rgba(183,133,244,0.34); }
.news-cat-certification { --cat:#35C88B; --cat-glow:rgba(53,200,139,0.10); --cat-fill:rgba(53,200,139,0.16); --cat-border:rgba(53,200,139,0.32); --cat-disc:rgba(53,200,139,0.14); --cat-disc-border:rgba(53,200,139,0.30); }

/* Shared card shell */
.news-card {
  display: flex; flex-direction: column; color: inherit;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-xl); overflow: hidden;
  transition: border-color var(--duration-md) var(--ease-out-expo),
              transform var(--duration-md) var(--ease-out-expo),
              box-shadow var(--duration-md) var(--ease-out-expo);
}
.news-card:hover { border-color: var(--border-strong); transform: translateY(-3px); box-shadow: var(--shadow-3); }

.news-thumb { position: relative; aspect-ratio: 16 / 9; background: var(--bud-void); overflow: hidden; }
.news-thumb .news-tint { position: absolute; inset: 0; background: radial-gradient(ellipse 75% 75% at 50% 45%, var(--cat-glow), transparent 70%); }
.news-thumb .news-disc { position: absolute; inset: 0; display: grid; place-items: center; }
.news-thumb .news-disc > span {
  width: 60px; height: 60px; border-radius: 14px; display: grid; place-items: center;
  background: var(--cat-disc); border: 1px solid var(--cat-disc-border); color: var(--cat);
}
.news-thumb .news-disc i { width: 28px; height: 28px; }
.news-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

.news-body { padding: 22px; display: flex; flex-direction: column; flex: 1; }
.news-meta { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.news-tag {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 10.5px; font-weight: var(--fw-semibold); letter-spacing: .03em;
  padding: 4px 9px; border-radius: var(--radius-pill);
  background: var(--cat-fill); border: 1px solid var(--cat-border); color: var(--cat);
}
.news-tag i { width: 12px; height: 12px; }
.news-date { font-size: 11.5px; color: var(--fg3); }
.news-body h3 { font-size: 18px; font-weight: var(--fw-semibold); line-height: 1.3; margin: 0 0 10px; }
.news-summary { font-size: 13.5px; color: var(--fg2); line-height: 1.55; margin: 0 0 18px; }
.news-readmore {
  margin-top: auto; display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: var(--fw-semibold); color: var(--accent);
}
.news-readmore i { width: 14px; height: 14px; }

/* Featured variant — full-width two-column */
.news-featured {
  display: grid; grid-template-columns: 1.15fr 1fr;
  border-radius: var(--radius-2xl); box-shadow: var(--shadow-3);
}
.news-featured:hover { box-shadow: var(--shadow-4); }
.news-featured .news-thumb { border-right: 1px solid var(--border); }
.news-featured .news-tint { background: radial-gradient(ellipse 80% 80% at 50% 45%, var(--cat-glow), transparent 70%); }
.news-featured .news-disc > span { width: 88px; height: 88px; border-radius: 16px; }
.news-featured .news-disc i { width: 42px; height: 42px; }
.news-featured-body { padding: 40px 44px; display: flex; flex-direction: column; justify-content: center; }
.news-featured-body .news-meta { gap: 14px; margin-bottom: 18px; }
.news-featured-body .news-tag { font-size: 11px; letter-spacing: .04em; gap: 6px; padding: 5px 11px; }
.news-featured-body .news-tag i { width: 13px; height: 13px; }
.news-featured-body .news-date { font-size: 12px; }
.news-featured-body h2 { font-size: 30px; font-weight: var(--fw-bold); letter-spacing: -0.02em; line-height: 1.18; margin: 0 0 14px; }
.news-featured-body .news-summary { font-size: 15px; color: var(--bud-haze); line-height: 1.6; margin: 0 0 22px; }
.news-featured-body .news-readmore i { width: 15px; height: 15px; }

@media (max-width: 960px) {
  .news-featured { grid-template-columns: 1fr; }
  .news-featured .news-thumb { border-right: 0; border-bottom: 1px solid var(--border); }
  .news-featured-body { padding: 28px 24px; }
}
@media (max-width: 680px) {
  .news-featured-body h2 { font-size: 25px; }
}
@media (prefers-reduced-motion: reduce) {
  .news-card { transition: border-color var(--duration-md); }
  .news-card:hover { transform: none; }
}

/* Light card treatment — light bg, electric-violet link, black body.
   Must stay last: it overrides the dark shell above. */
.news-card { background: #F7F5FC; border-color: rgba(20,18,28,.10); }
.news-card:hover { border-color: var(--accent); }
.news-body h3 { color: #111; font-weight: var(--fw-bold); }
.news-featured-body h2 { color: #111; }
.news-summary { color: #1a1a1a; }
.news-featured-body .news-summary { color: #1a1a1a; }
.news-summary strong { color: #000; }
.news-date { color: #5a5566; }
.news-readmore { color: var(--accent); }
/* darker category tones so tags stay legible on the light card */
.news-card.news-cat-award         { --cat:#9A7400; }
.news-card.news-cat-partnership   { --cat:#2C5FC9; }
.news-card.news-cat-product       { --cat:#7A2BD6; }
.news-card.news-cat-certification { --cat:#1F8F5F; }

/* …but the thumbnail plate stays DARK, so the darkened tone above would make
   the no-image icon disc unreadable. Restore the bright tone inside it.
   Invisible on cards that use a photo; required by the tint + disc variant. */
.news-card.news-cat-award         .news-thumb { --cat:#F2C341; }
.news-card.news-cat-partnership   .news-thumb { --cat:#4F86F2; }
.news-card.news-cat-product       .news-thumb { --cat:#B785F4; }
.news-card.news-cat-certification .news-thumb { --cat:#35C88B; }
