/* Shared article enhancements for smartafiliate */
.page-hero {
  position: relative;
  overflow: hidden;
}
.page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 15% 20%, rgba(234,88,12,0.16), transparent 20%),
    radial-gradient(circle at 85% 18%, rgba(59,130,246,0.22), transparent 24%),
    radial-gradient(circle at 50% 95%, rgba(245,158,11,0.12), transparent 26%);
  pointer-events: none;
}
.page-hero::after {
  content: "";
  position: absolute;
  inset: auto 5% 10% auto;
  width: min(320px, 30vw);
  height: min(320px, 30vw);
  border-radius: 28px;
  background: linear-gradient(135deg, rgba(255,255,255,0.10), rgba(255,255,255,0.02));
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 20px 60px rgba(0,0,0,0.15);
  transform: rotate(-8deg);
  pointer-events: none;
}
.page-hero .container {
  position: relative;
  z-index: 1;
}
.article-body a {
  color: var(--primary-dark);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.article-body a:hover {
  color: var(--primary);
}
.article-links-box,
.official-link-box {
  background: linear-gradient(135deg, rgba(234,88,12,.08), rgba(245,158,11,.10));
  border: 1px solid rgba(234,88,12,.16);
  border-radius: 18px;
  padding: 1rem 1.2rem;
  margin: 1.5rem 0;
}
.article-links-box strong,
.official-link-box strong {
  display: block;
  margin-bottom: .7rem;
}
.article-links-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
}
.article-links-grid a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .75rem 1rem;
  border-radius: 999px;
  background: var(--surface);
  border: 1px solid var(--line);
  text-decoration: none;
}
.article-links-grid a:hover {
  border-color: rgba(234,88,12,.3);
  transform: translateY(-2px);
}
@media (max-width: 1024px) {
  .page-hero::after {
    opacity: .55;
    width: 220px;
    height: 220px;
  }
}
@media (max-width: 640px) {
  .article-links-grid {
    justify-content: center;
  }
  .page-hero::after {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .article-links-grid a:hover {
    transform: none !important;
  }
}