/* ============================================================
   Silicon — CMS custom styles
   Stacked on top of theme.min.css (Bootstrap 5 + Silicon theme)
   ============================================================ */

/* ── Scroll reveal ────────────────────────────────────────── */
.si-reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .6s cubic-bezier(.22,1,.36,1), transform .6s cubic-bezier(.22,1,.36,1);
  will-change: opacity, transform;
}
.si-reveal.visible { opacity: 1; transform: none; will-change: auto; }

/* Stagger delays for card grids */
.si-reveal-stagger > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .5s cubic-bezier(.22,1,.36,1), transform .5s cubic-bezier(.22,1,.36,1);
  will-change: opacity, transform;
}
.si-reveal-stagger.visible > *:nth-child(1) { transition-delay: .05s; }
.si-reveal-stagger.visible > *:nth-child(2) { transition-delay: .12s; }
.si-reveal-stagger.visible > *:nth-child(3) { transition-delay: .19s; }
.si-reveal-stagger.visible > *:nth-child(4) { transition-delay: .26s; }
.si-reveal-stagger.visible > *:nth-child(5) { transition-delay: .33s; }
.si-reveal-stagger.visible > *:nth-child(6) { transition-delay: .40s; }
.si-reveal-stagger.visible > * { opacity: 1; transform: none; will-change: auto; }

@media (prefers-reduced-motion: reduce) {
  .si-reveal, .si-reveal-stagger > * {
    opacity: 1 !important; transform: none !important; transition: none !important;
  }
}

/* ── Hero entrance (cascade) ──────────────────────────────── */
.si-hero { overflow: hidden; }
.si-hero .si-hero-badge,
.si-hero .si-hero-heading,
.si-hero .si-hero-excerpt,
.si-hero .si-hero-ctas {
  opacity: 0;
  animation: si-hero-in .7s cubic-bezier(.22,1,.36,1) both;
}
.si-hero .si-hero-badge  { animation-delay: .15s; }
.si-hero .si-hero-heading{ animation-delay: .28s; }
.si-hero .si-hero-excerpt{ animation-delay: .40s; }
.si-hero .si-hero-ctas   { animation-delay: .52s; }

@keyframes si-hero-in {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .si-hero .si-hero-badge,
  .si-hero .si-hero-heading,
  .si-hero .si-hero-excerpt,
  .si-hero .si-hero-ctas { animation: none; opacity: 1; }
}

/* ── Section titles ───────────────────────────────────────── */
.si-section-title-wrap {
  display: flex; align-items: center; gap: .65rem;
  margin-bottom: 1.25rem;
}
.si-section-dot {
  flex-shrink: 0; width: 10px; height: 10px; border-radius: 50%;
  background: var(--si-primary, var(--bs-primary));
  box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb), .18);
}

/* ── Card enhancements ────────────────────────────────────── */
.card {
  transition: transform .25s ease, box-shadow .25s ease;
}
@media (hover: hover) {
  .card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 32px rgba(0,0,0,.1) !important;
  }
}

/* ── Section spacing & container guards ──────────────────── */
html { overflow-x: hidden; }
section, .si-section { overflow-x: hidden; }
main img, main table, main iframe { max-width: 100%; }

/* ── Rich CMS content ─────────────────────────────────────── */
.cms-prose table,
.article-content table {
  width: 100%;
  margin: 1.25rem 0;
  border-collapse: collapse;
  vertical-align: middle;
}
.cms-prose th,
.cms-prose td,
.article-content th,
.article-content td {
  padding: .75rem;
  border: 1px solid var(--bs-border-color);
}
.cms-prose th,
.article-content th {
  font-weight: 700;
  color: var(--bs-heading-color);
  background-color: var(--bs-secondary-bg);
}
.cms-prose blockquote,
.article-content blockquote {
  margin: 1.25rem 0;
  padding: .25rem 0 .25rem 1.25rem;
  border-left: 3px solid var(--bs-primary);
  color: var(--bs-secondary-color);
  font-style: italic;
}

/* ── CTA group in hero ────────────────────────────────────── */
.si-hero-ctas {
  display: flex; flex-wrap: wrap; gap: .75rem; margin-top: .25rem;
}
.si-hero-ctas .btn {
  min-height: 48px; font-weight: 600; letter-spacing: .01em;
}
@media (max-width: 575.98px) {
  .si-hero-ctas { flex-direction: column; }
  .si-hero-ctas .btn { width: 100%; justify-content: center; }
}