/* Boulder Gardens Fieldstation — Water chapter additions */
.water-page .site-header { position: sticky; }

.water-hero {
  display:grid;
  grid-template-columns:minmax(330px, .82fr) 1.35fr;
  min-height:650px;
  background:var(--paper);
  border-bottom:1px solid var(--line);
}
.water-hero-copy {
  display:flex; flex-direction:column; justify-content:center;
  padding:4.8rem 3.8rem;
  position:relative;
}
.water-hero-copy::before {
  content:"≈"; position:absolute; right:2rem; top:2.2rem;
  font:5rem/1 var(--display); color:var(--sage); opacity:.25;
}
.water-hero h1 { font-size:clamp(4.6rem,7vw,7rem); }
.water-hero .lede { margin:1.4rem 0 0; max-width:31rem; }
.water-hero-photo { margin:0; position:relative; background:#31402c; }
.water-hero-photo img { width:100%; height:100%; min-height:650px; object-fit:cover; filter:saturate(.9) contrast(.97); }
.water-hero-photo::after {
  content:""; position:absolute; inset:auto 0 0; height:42px;
  background:linear-gradient(to top,var(--paper-light),transparent);
}
.water-hero-photo figcaption {
  position:absolute; right:1.2rem; bottom:1.2rem; z-index:2;
  padding:.4rem .7rem; background:rgba(247,241,226,.9);
  font:.9rem/1.25 var(--hand); transform:rotate(-1deg);
}

.water-facts {
  display:grid; grid-template-columns:repeat(4,1fr);
  background:var(--forest); color:#fff;
}
.water-facts div { padding:1.4rem 1.7rem; border-right:1px solid rgba(255,255,255,.18); }
.water-facts strong { display:block; font:600 2.05rem/1 var(--display); color:#fff; }
.water-facts span { display:block; margin-top:.35rem; font:.72rem/1.35 var(--sans); letter-spacing:.04em; color:#dfe6d7; }

.water-section { padding:5rem; border-bottom:1px solid var(--line-soft); }
.water-section.alt { background:var(--paper); }
.water-section-head { max-width:850px; margin:0 auto 2.7rem; text-align:center; }
.water-section-head .kicker { margin-bottom:.5rem; }
.water-section-head p:last-child { color:var(--ink-soft); }

.water-report-card {
  display:grid; grid-template-columns:.95fr 1.05fr; gap:3rem; align-items:center;
  max-width:1080px; margin:0 auto;
}
.water-report-copy { padding:1rem 0; }
.water-report-copy h2 { font-size:clamp(2.8rem,5vw,4.5rem); }
.water-report-copy .report-meta { display:flex; flex-wrap:wrap; gap:.5rem 1rem; margin:1.2rem 0; font:.75rem var(--sans); color:var(--moss); }
.water-report-copy .report-meta span { border-bottom:1px solid var(--line); padding-bottom:.2rem; }
.water-report-photo { margin:0; transform:rotate(.6deg); }
.water-report-photo img { border:10px solid #efe3c6; outline:1px solid var(--line); box-shadow:var(--shadow-soft); }

.photo-strip { display:grid; grid-template-columns:1.25fr .85fr .85fr; gap:1.1rem; margin:3.5rem auto 0; max-width:1120px; }
.photo-strip figure { margin:0; }
.photo-strip img { width:100%; height:310px; object-fit:cover; border:7px solid #f5ecd5; outline:1px solid var(--line); }
.photo-strip figure:nth-child(2) { transform:rotate(-.7deg); }
.photo-strip figure:nth-child(3) { transform:rotate(.6deg); }

.visual-grid {
  display:grid; grid-template-columns:1.1fr .9fr; gap:2rem; align-items:start;
  max-width:1120px; margin:0 auto;
}
.visual-card {
  background:var(--paper-light); border:1px solid var(--line);
  padding:1rem; box-shadow:var(--shadow-soft);
}
.visual-card img { width:100%; }
.visual-card figcaption { padding:.5rem .35rem .15rem; }

.fact-stack { display:grid; gap:1rem; }
.fact-card {
  padding:1.35rem 1.45rem; background:rgba(255,255,255,.23);
  border:1px solid var(--line-soft); border-left:5px solid var(--moss);
}
.fact-card h3 { margin-bottom:.35rem; }
.fact-card p { margin:.2rem 0; color:var(--ink-soft); }
.fact-card strong { color:var(--forest-dark); }

.basin-note {
  max-width:1120px; margin:2rem auto 0; padding:1.25rem 1.5rem;
  border:1px dashed var(--terracotta); background:#f3e8ce;
}
.basin-note strong { color:var(--terracotta); }

.quality-layout { display:grid; grid-template-columns:1.15fr .85fr; gap:2.3rem; max-width:1120px; margin:0 auto; align-items:start; }
.quality-copy h3 { font-size:2rem; }
.quality-copy p { color:var(--ink-soft); }
.caution-box {
  margin-top:1.2rem; padding:1rem 1.2rem; border-left:5px solid var(--terracotta);
  background:#f3e5d5; font-size:.95rem;
}

.water-systems {
  display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; max-width:1120px; margin:0 auto;
}
.system-card {
  padding:1.35rem; background:var(--paper); border:1px solid var(--line);
  min-height:260px;
}
.system-card .icon { font-size:2rem; }
.system-card h3 { margin-top:.55rem; }
.system-card p { color:var(--ink-soft); font-size:.94rem; }
.system-card .status { display:inline-block; margin-top:.6rem; padding:.28rem .55rem; border:1px solid var(--line); font:.68rem var(--sans); color:var(--forest); }

.investigation {
  display:grid; grid-template-columns:.8fr 1.2fr; gap:3rem; max-width:1050px; margin:0 auto;
}
.investigation .hand-note { align-self:start; }
.steps { counter-reset:step; display:grid; gap:.8rem; }
.step {
  counter-increment:step; display:grid; grid-template-columns:42px 1fr; gap:1rem;
  padding:1rem 1.1rem; border-bottom:1px solid var(--line-soft);
}
.step::before {
  content:counter(step); display:grid; place-items:center; width:36px; height:36px; border-radius:50%;
  background:var(--forest); color:#fff; font:700 .85rem var(--sans);
}
.step strong { display:block; color:var(--forest-dark); }
.step span { color:var(--ink-soft); font-size:.94rem; }

.source-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; max-width:1040px; margin:0 auto; }
.source-grid a {
  display:block; padding:1rem 1.1rem; border:1px solid var(--line-soft);
  background:rgba(255,255,255,.22); text-decoration:none; font:.83rem/1.45 var(--sans);
}
.source-grid a strong { display:block; font:600 1.1rem/1.2 var(--display); margin-bottom:.2rem; }

@media (max-width:900px) {
  .water-hero, .water-report-card, .visual-grid, .quality-layout, .investigation { grid-template-columns:1fr; }
  .water-hero-copy { padding:3.5rem 2rem; }
  .water-hero-photo img { min-height:420px; }
  .water-facts { grid-template-columns:repeat(2,1fr); }
  .water-section { padding:3.5rem 1.4rem; }
  .photo-strip { grid-template-columns:1fr; }
  .photo-strip img { height:auto; }
  .water-systems { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px) {
  .water-facts, .water-systems, .source-grid { grid-template-columns:1fr; }
  .water-hero h1 { font-size:4rem; }
}