/* page-methodology.css — unique styles for systems/methodology.html */

/* Inline link colour inside main body copy */
main a { color: var(--hvb-teal); text-decoration: none; }
main a:hover { text-decoration: underline; }

/* Textured hero (circular-flow pattern — this page does NOT use .site-hero) */
.hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(1100px 520px at 15% 10%, rgba(233,169,35,.14), rgba(233,169,35,0) 62%),
    linear-gradient(180deg, rgba(14,59,46,.10), rgba(14,59,46,.02)),
    url("/assets/textures/tx_circular-flow_tile.svg");
  background-repeat: no-repeat, no-repeat, repeat;
  background-size: cover, cover, 560px 560px;
  border-bottom: 1px solid rgba(14,59,46,.10);
}
.hero-inner { padding: 38px 0 18px; }

/* Amber callout (left-border + white bg variant — distinct from wappingers variant) */
.callout {
  border-left: 5px solid rgba(233,169,35,.75);
  background: #fff;
  border-radius: 14px;
  padding: 14px;
  border-top: 1px solid rgba(14,59,46,.10);
  border-right: 1px solid rgba(14,59,46,.10);
  border-bottom: 1px solid rgba(14,59,46,.10);
  box-shadow: var(--shadow-1);
  margin-top: 14px;
}
.callout strong { color: var(--hvb-black); }