/* ======================================================================
 * Archegon — Fig. 1, EGS section
 *
 * Flat vector illustration. The reference idiom is a drawn diagram with
 * rounded strata, crisp two-tone conduits, and numbered badges, so this
 * is authored as SVG rather than rendered in WebGL.
 * ====================================================================== */

.egs{
  display:block;
  width:100%; height:auto;
  background:transparent;
}

/* ── strata ──────────────────────────────────────────────────────────── */
.egs .sky      { fill:#e2e9ee; }
.egs .soil     { fill:#b9b3a6; }
.egs .sed-a    { fill:#6f7278; }
.egs .sed-b    { fill:#4a4e55; }
.egs .basement { fill:#2a2e35; }

.egs .contact{
  fill:none; stroke:#242a31; stroke-opacity:.30; stroke-width:1.1;
}

/* the stimulated volume tint */
.egs .halo{ fill:url(#egsHalo); }

/* ── engineered fractures ────────────────────────────────────────────── */
.egs .frac{
  fill:none; stroke:#cfd6dc; stroke-opacity:.62;
  stroke-width:1.5; stroke-linecap:round;
}
.egs .frac-minor{ stroke-opacity:.34; stroke-width:1; }

/* ── wells ───────────────────────────────────────────────────────────── */
.egs .well{
  fill:none; stroke-linecap:round; stroke-linejoin:round;
}
.egs .well-cold{ stroke:#5b7f9c; stroke-width:7; }
.egs .well-hot { stroke:#d66b35; stroke-width:7; }

/* casing highlight down the middle of each leg */
.egs .well-core{
  fill:none; stroke:#ffffff; stroke-opacity:.24; stroke-width:2;
  stroke-linecap:round;
}

/* travelling flow dashes */
.egs .flow{
  fill:none; stroke:#ffffff; stroke-opacity:.55;
  stroke-width:2.2; stroke-linecap:round;
  stroke-dasharray:2 26;
}
.egs .flow-cold{ animation:egsFlowDown 3.4s linear infinite; }
.egs .flow-hot { animation:egsFlowUp   3.4s linear infinite; }

@keyframes egsFlowDown{ to{ stroke-dashoffset:-280; } }
@keyframes egsFlowUp  { to{ stroke-dashoffset: 280; } }

/* ── surface plant ───────────────────────────────────────────────────── */
.egs .plant     { fill:#39404a; }
.egs .plant-2   { fill:#5b646f; }
.egs .plant-hot { fill:#d66b35; }
.egs .pipe{
  fill:none; stroke:#d66b35; stroke-width:4.5; stroke-linecap:round;
}
.egs .pipe-return{ stroke:#5b7f9c; }
.egs .pylon{ fill:none; stroke:#39404a; stroke-width:1.6; }

/* ── callouts ────────────────────────────────────────────────────────── */
.egs .badge      { fill:#f5f1ea; stroke:#242a31; stroke-opacity:.28; }
.egs .badge-text {
  fill:#101418; font:600 11px Inter,system-ui,sans-serif;
  text-anchor:middle; dominant-baseline:central;
}
.egs .leader{
  fill:none; stroke:#242a31; stroke-opacity:.34;
  stroke-width:1; stroke-dasharray:2 3;
}
.egs .tag{
  fill:#3d444c; font:600 10px Inter,system-ui,sans-serif;
  letter-spacing:.12em; text-transform:uppercase;
}
.egs .tag-light{ fill:#e8eef2; }
.egs .depth{
  fill:#8f9aa4; font:500 10px Inter,system-ui,sans-serif;
}

@media (prefers-reduced-motion:reduce){
  .egs .flow-cold, .egs .flow-hot{ animation:none; }
}