/* Likelihoods page specific tweaks */

/* Slightly larger spacing between tiles */
.tiles-light .feature{ margin-bottom:.4rem; }

/* Add breathing room between the page hero and the first row of tiles */
.page-hero + .feature-grid{ margin-top: 1.2rem; }
@media (max-width: 680px){
  .page-hero + .feature-grid{ margin-top: .9rem; }
}

/* Style article links list injected by the builder as boxed tiles */
.link-list{ list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1rem; }
.link-list li{ border:1px solid rgba(2,6,23,0.08); background:#fff; border-radius:.9rem; padding:1rem; box-shadow:0 10px 20px rgba(2,6,23,0.06); }
.link-list a{ text-decoration:none; background: var(--accent-gradient); -webkit-background-clip:text; background-clip:text; color:transparent; font-weight:700; }

/* Make plots in article pages a bit smaller by default */
.article-content img{
  width: min(80%, 760px);
  max-width: 100%;
  height: auto;
  display: block;
  margin: .5rem auto; /* center */
}

/* Give article section headings the gradient look used elsewhere */
.article-content h2,
.article-content h3 {
  background: var(--accent-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Collapsible boxes (details/summary) */
details.box.collapsible { padding: 0; }
details.box.collapsible summary { display:block; cursor:pointer; padding:.9rem 1.1rem; user-select:none; list-style:none; }
details.box.collapsible summary::-webkit-details-marker{ display:none; }
details.box.collapsible summary::marker{ display:none; }
details.box.collapsible summary::after{ content:'▾'; float:right; opacity:.7; transition: transform .2s ease; }
details.box.collapsible[open] summary::after{ transform: rotate(180deg); }
details.box.collapsible .box-heading{ font-weight:800; font-size:1.1rem; }
details.box.collapsible .tile-eyebrow{ margin:.1rem 0 .2rem 0; }
details.box.collapsible .box-body{ padding:1rem 1.1rem; }
/* Gradient title text in collapsible banners so it doesn't look black */
details.box.collapsible summary .box-heading{
  /* Solid brand color for banner titles (no gradient) */
  color: #2F6F69;
  font-weight: 800;
}

/* Consistent tinted boxes in likelihood articles */
.article-content .box{
  background: linear-gradient(180deg, rgba(14,165,168,0.12), rgba(245,158,11,0.10)), #ffffff;
  border:1px solid rgba(2,6,23,0.10);
  box-shadow:0 6px 16px rgba(2,6,23,0.06);
}
.article-content .box.tint-strong{
  background: linear-gradient(180deg, rgba(14,165,168,0.22), rgba(245,158,11,0.18)), #ffffff;
}
/* We now set first-box strength explicitly in pages; fallback removed */
/* Moderate tint for article page hero when class 'tint' is present */
.light-page .page-hero.tint{
  border:1px solid rgba(2,6,23,0.10);
  background: linear-gradient(180deg, rgba(14,165,168,0.14), rgba(245,158,11,0.12)), rgba(255,255,255,0.96);
  border-radius:1.2rem; box-shadow:0 30px 60px rgba(2,6,23,0.07), 0 6px 14px rgba(2,6,23,0.06);
  padding:1.6rem 1.4rem 1.2rem;
}
/* Style the back link inside the hero to use brand colors and no underline */
.light-page .page-hero .back-link{
  text-decoration: none;
  background: transparent; /* no background */
  color: #475569; /* lighter slate tone for readability */
  padding: 0; /* no pill padding */
  border: 0;
  font-weight: 600;
}
.light-page .page-hero .back-link:hover{
  color: #334155; /* slightly deeper on hover */
}

/* Page-specific: Gaussian article - no tint for content boxes */
.gaussian-page .article-content .box{
  background:#ffffff;
  border:1px solid rgba(2,6,23,0.10);
  box-shadow:0 6px 16px rgba(2,6,23,0.06);
}

/* Page-specific: Poisson article - match Gaussian box styling */
.poisson-page .article-content .box{
  background:#ffffff;
  border:1px solid rgba(2,6,23,0.10);
  box-shadow:0 6px 16px rgba(2,6,23,0.06);
}

/* Global: make all likelihood article boxes white for consistency */
.likelihood-page .article-content .box{
  background:#ffffff;
  border:1px solid rgba(2,6,23,0.10);
  box-shadow:0 6px 16px rgba(2,6,23,0.06);
}

/* Shared helper for subsection separators within articles */
.article-content .subsection-heading{
  font-size:1.1rem;
  font-weight:600;
  margin:1.2rem 0 .55rem;
  padding-bottom:.35rem;
  border-bottom:2px solid rgba(14,165,168,0.25);
  color:inherit;
  letter-spacing:.01em;
}

/* Mesh overrides: distinct banner tints like Likelihoods */
.article-content details.box.collapsible{
  background:#ffffff; /* override generic .box tint */
  border:1px solid rgba(2,6,23,0.10);
  border-radius:.9rem;
  box-shadow:0 6px 16px rgba(2,6,23,0.06);
  overflow:hidden;
}
.article-content details.box.collapsible summary{
  background:#ffffff; /* banners below hero are white */
  border-bottom:1px solid rgba(2,6,23,0.08);
}
.article-content details.box.collapsible:first-of-type summary{
  background:#ffffff; /* ensure the first banner is white too */
}
.article-content details.box.collapsible .box-body{
  background:#ffffff;
}