/* Well Water Clarity — affiliate "Treatment options" box
   Used on articles (after styles.css/theme.css) and on tools (after tools.css).
   Colors use the site's own variables, with fallbacks for pages that don't define them. */

.wwc-options {
  margin: 2.2rem 0;
  padding: 22px 24px;
  border: 1px solid var(--line, #dce3e8);
  border-top: 4px solid var(--blue, #2e6f9e);
  border-radius: var(--radius, 8px);
  background: var(--blue-soft, #e8f1f8);
}
.wwc-options h2,
.wwc-options h3 { margin: 0 0 .4rem; }
.wwc-options .wwc-disclosure {
  margin: 0 0 1rem;
  font-size: .9rem;
  line-height: 1.5;
  color: var(--muted, #5c6b78);
}
.wwc-options .wwc-note { margin: 0 0 1rem; }

.wwc-option-list {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}
.wwc-option-list > li { margin: 0; }
.wwc-option {
  display: flex;
  flex-direction: column;
  gap: .45rem;
  height: 100%;
  padding: 16px;
  border: 1px solid var(--line, #dce3e8);
  border-radius: var(--radius, 8px);
  background: #fff;
}
.wwc-option strong { font-size: 1.02rem; line-height: 1.3; }
.wwc-option span { font-size: .95rem; line-height: 1.5; }
.wwc-option a.wwc-btn {
  margin-top: auto;
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 16px;
  border-radius: var(--radius, 8px);
  background: var(--blue, #2e6f9e);
  color: #fff;
  font-weight: 700;
  font-size: .95rem;
  text-decoration: none;
}
.wwc-option a.wwc-btn:hover,
.wwc-option a.wwc-btn:focus-visible { background: var(--blue-dark, #24587f); color: #fff; }
.wwc-options .wwc-fine {
  margin: 1rem 0 0;
  font-size: .85rem;
  line-height: 1.5;
  color: var(--muted, #5c6b78);
}

@media (max-width: 600px) {
  .wwc-options { padding: 18px 16px; }
}
@media print {
  .wwc-options { display: none; }
}

/* Inside article prose: drop the section-divider line on the box heading and the list indent */
.prose .wwc-options h2 { margin-top: 0; padding-top: 0; border-top: 0; font-size: 1.6rem; }
.prose .wwc-options .wwc-option-list { padding-left: 0; margin: 0; }
.prose .wwc-options .wwc-option-list > li { margin: 0; }