/* Central extension point for lightweight, reusable visual tweaks. */

:root {
  --spread-growth-accent: #1f6f8b;
}

/* Keep page introductions a bit more breathable. */
.md-content h1 {
  margin-bottom: 0.5rem;
}

.md-content > p:first-of-type {
  font-size: 1.05rem;
  max-width: 68ch;
}

/* Subtle polish for Material buttons used across docs. */
.md-button {
  border-radius: 0.35rem;
}

.spread-growth-hover-button {
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.spread-growth-hover-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 0.3rem 0.9rem rgba(31, 111, 139, 0.22);
}

/* Reusable responsive embed wrapper for iframes and maps. */
.spread-growth-embed {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  border-radius: 0.5rem;
  overflow: hidden;
  box-shadow: 0 0.2rem 0.8rem rgba(0, 0, 0, 0.12);
}

.spread-growth-embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}