/* The land: the cited geologic timeline (issue #117). Loaded after site.css, on land.html only.
   Every class starts with geo-, so nothing here touches site.css (its .timeline classes are the Status page's).
   Sandstone ochre (--sand) marks the Hickory Sandstone Member and the sandy soil weathered from it; the rest is the paper's neutrals, and the aquifer's water a muted green.
   Without JavaScript the section is an ordered list of stages and a list of sources; timeline.js adds the figure. */
.geo{--geo-gneiss:#d5cdbd;--geo-gneiss-mark:#a89d8b;--geo-granite:#ebe5d8;--geo-granite-mark:#9c917f;--geo-riley:#cbc4b5;--geo-wilberns:#c2bbac;--geo-ellen:#b9b2a3;--geo-lime-mark:#9a917f;--geo-cret:#e0dace;--geo-cret-mark:#b4ab9b;--geo-hickory-mark:#8f6646;--geo-soil:#6f4a2f;--geo-water-mark:#a59b8a;--geo-scale:#e2dbcc;padding-top:4rem;padding-bottom:6rem;border-top:1px solid var(--paper-line)}
.geo-head{display:grid;gap:1.5rem}.geo-head h2{margin-bottom:1.5rem}.geo-intro{max-width:30rem;font-size:1rem;color:var(--paper-muted)}
.geo-body{margin-top:3rem}.geo-stages{list-style:none;margin:0;padding:0}
.geo-stage{display:grid;gap:1.25rem;min-width:0;padding-block:2.25rem;border-top:1px solid var(--paper-line);scroll-margin-top:2rem}.geo-stage:last-child{border-bottom:1px solid var(--paper-line)}.geo-when,.geo-text{min-width:0}
.geo-index{font-size:.6875rem;font-weight:500;letter-spacing:.15em;color:var(--paper-muted)}
.geo-age{margin-top:.6rem;font-family:var(--serif);font-size:1.625rem;line-height:1.2}
.geo-certainty{margin-top:.75rem;max-width:24rem;font-size:.875rem;line-height:1.6;color:var(--paper-muted)}
.geo-text h3{font-size:clamp(2rem,3.4vw,2.75rem);margin-bottom:1.1rem}.geo-text p{max-width:38rem;font-size:1.0625rem;line-height:1.8}
/* A citation's number is a larger target than it looks: padded around, with the padding's width given back as margin, so neither the line nor the spacing moves. */
.geo-cite{font-size:.68em;line-height:0;letter-spacing:.02em;white-space:nowrap}.geo-cite a{padding:.35em .3em;margin-inline:-.22em;color:var(--paper-muted);text-decoration:none}.geo-cite a:hover{color:var(--paper-ink);text-decoration:underline}
.geo-sources{display:grid;gap:1.5rem;margin-top:4rem}.geo-sources h3{font-size:2rem}
.geo-source-list{margin:0;padding-left:1.75rem;max-width:46rem;font-size:.875rem;line-height:1.6}.geo-source-list li{padding:.35rem .5rem .35rem .25rem;overflow-wrap:anywhere;scroll-margin-top:2rem}.geo-source-list li::marker{color:var(--paper-muted);font-variant-numeric:tabular-nums}.geo-source-list li:target{background:#e5dece}.geo-source-list cite{font-style:italic}
.geo-sources-note{margin-top:1.5rem;max-width:40rem;font-size:.8125rem;line-height:1.6;color:var(--paper-muted)}

/* The figure (timeline.js): a schematic section, a time scale, a key and the Earlier/Later steps. */
.geo-figure{min-width:0;margin:0 0 2.5rem}.geo-svg{display:block;width:100%;height:auto;border:1px solid var(--paper-line);background:var(--bone)}
.geo-scale{margin-top:1rem}.geo-scale-bar{position:relative;height:6px;background:var(--geo-scale)}.geo-scale-span{position:absolute;top:0;bottom:0;background:var(--paper-line)}.geo-scale-span.geo-on{z-index:1;background:var(--paper-ink)}
.geo-scale-ticks{position:relative;height:1.3rem;margin-top:.35rem;font-size:.6875rem;color:var(--paper-muted);font-variant-numeric:tabular-nums}.geo-scale-ticks span{position:absolute;top:0;transform:translateX(-50%);white-space:nowrap}.geo-scale-ticks span:first-child{transform:none}.geo-scale-ticks span:last-child{transform:translateX(-100%)}
.geo-scale-unit{font-size:.6875rem;letter-spacing:.04em;color:var(--paper-muted)}
.geo-now{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem 1rem;margin-top:1.25rem}.geo-now-title{font-family:var(--serif);font-size:1.75rem;line-height:1.1;color:var(--paper-ink)}.geo-now-age{font-size:.875rem;color:var(--paper-muted)}
.geo-note{margin-top:.75rem}.geo-key{display:flex;flex-wrap:wrap;gap:.35rem 1.1rem;margin:.9rem 0 0;padding:0;list-style:none;font-size:.75rem;line-height:1.5;color:var(--paper-ink)}.geo-key li{display:flex;align-items:center;gap:.45rem}
.geo-swatch{flex:0 0 auto;width:16px;height:10px;border:1px solid var(--geo-gneiss-mark)}.geo-sw-gneiss{background:var(--geo-gneiss)}.geo-sw-granite{background:var(--geo-granite)}.geo-sw-hickory{background:var(--sand)}.geo-sw-later{background:var(--geo-wilberns)}.geo-sw-cret{background:var(--geo-cret)}.geo-sw-water{background:repeating-linear-gradient(180deg,var(--bone) 0 3px,var(--geo-water-mark) 3px 4px)}.geo-sw-soil{background:radial-gradient(circle,var(--geo-soil) 0 1.4px,transparent 1.8px) 0 0/5px 5px,var(--sand)}.geo-sw-aquifer,.geo-sw-unconformity{height:0;border:0;border-top:2px dashed var(--paper-ink)}.geo-sw-fault{width:2px;height:12px;margin-inline:7px;border:0;background:var(--paper-ink)}.geo-sw-grus{background:radial-gradient(circle,var(--paper-muted) 0 1.3px,transparent 1.7px) 0 0/5px 5px,var(--geo-granite)}.geo-sw-cobble{width:10px;margin-inline:3px;border-color:var(--paper-ink);border-radius:50%;background:var(--geo-granite)}.geo-sw-inflow,.geo-sw-shore{height:0;border:0;border-top:2px solid var(--paper-ink)}.geo-sw-inflow{border-top-color:var(--geo-hickory-mark)}
.geo-controls{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1.25rem;border-top:1px solid var(--paper-line)}
.geo-step{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:.5rem 0;border:0;background:none;color:var(--paper-ink);font:inherit;font-size:.875rem;cursor:pointer}.geo-step:hover{text-decoration:underline;text-underline-offset:.3em}.geo-step:focus-visible{outline:2px solid var(--wine);outline-offset:4px}.geo-step[aria-disabled="true"]{color:var(--paper-muted);opacity:.55;cursor:default;text-decoration:none}
.geo-count{font-size:.75rem;letter-spacing:.15em;color:var(--paper-muted);font-variant-numeric:tabular-nums}
.geo-live{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* The drawing's layers: fills and the marks of their patterns. */
.geo-f-gneiss{fill:var(--geo-gneiss)}.geo-m-gneiss{fill:none;stroke:var(--geo-gneiss-mark);stroke-width:.8}.geo-f-granite{fill:var(--geo-granite)}.geo-m-granite{fill:none;stroke:var(--geo-granite-mark);stroke-width:.9}
.geo-f-hickory{fill:var(--sand)}.geo-m-hickory{fill:var(--geo-hickory-mark)}.geo-f-riley{fill:var(--geo-riley)}.geo-f-wilberns{fill:var(--geo-wilberns)}.geo-f-ellen{fill:var(--geo-ellen)}.geo-m-lime{fill:none;stroke:var(--geo-lime-mark);stroke-width:.6}
.geo-f-cret{fill:var(--geo-cret)}.geo-m-cret{fill:none;stroke:var(--geo-cret-mark);stroke-width:.6}.geo-f-water{fill:var(--bone)}.geo-m-water{fill:none;stroke:var(--geo-water-mark);stroke-width:.7}
.geo-layer{stroke:#282b2459;stroke-width:.6;stroke-linejoin:round}.geo-sky{fill:var(--bone)}.geo-ground{fill:none;stroke:var(--paper-ink);stroke-width:1.3;stroke-linejoin:round}.geo-sea{fill:none;stroke:var(--paper-muted);stroke-width:1}
.geo-unconformity{fill:none;stroke:var(--paper-ink);stroke-width:1;stroke-dasharray:5 3}.geo-fault{fill:none;stroke:var(--paper-ink);stroke-width:1.4}.geo-soil{fill:var(--geo-soil)}.geo-aquifer{fill:none;stroke:var(--paper-ink);stroke-width:1.4;stroke-dasharray:7 5}.geo-arrow{fill:var(--paper-ink);stroke:var(--paper-ink);stroke-width:1.2}.geo-grus{fill:var(--paper-muted)}.geo-cobble{fill:var(--geo-granite);stroke:var(--paper-ink);stroke-width:.7}.geo-inflow{fill:var(--geo-hickory-mark);stroke:var(--geo-hickory-mark);stroke-width:1.6}

@media(min-width:700px){.geo{padding-top:5rem;padding-bottom:7rem}.geo-head{grid-template-columns:1fr 2fr;gap:7vw}.geo-eyebrow{padding-top:.5rem}.geo-stage{grid-template-columns:1fr 2fr;column-gap:7vw;padding-block:2.75rem}.geo-sources{grid-template-columns:1fr 2fr;gap:7vw}}
@media(min-width:1000px),(min-width:700px) and (min-height:520px) and (orientation:landscape){.geo-body.geo-has-figure{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:5vw;align-items:start}.geo-has-figure .geo-figure{position:sticky;top:1.5rem;margin-bottom:0}.geo-has-figure .geo-stage{grid-template-columns:1fr;row-gap:1rem}.geo-has-figure .geo-certainty{max-width:34rem}.geo-has-figure .geo-current{border-top-color:var(--paper-ink)}}
/* A new stage fades in; never when the reader asks for less motion (site.css also stops all animation then). */
@media(prefers-reduced-motion:no-preference){.geo-art{animation:geo-in .45s ease-out both}}
@keyframes geo-in{from{opacity:.5}to{opacity:1}}
@media print{.geo-controls,.geo-live{display:none}.geo-has-figure .geo-figure{position:static}.geo-stage,.geo-figure{break-inside:avoid}.geo-source-list li:target{background:none}}
/* The aquifer in its own colour, so the key tells it from the unconformity. */
.geo-aquifer{stroke:#5b716a}.geo-sw-aquifer{border-top-color:#5b716a}
/* The base-Cretaceous unconformity, a second one, dotted so the key tells it from the Great Unconformity; and, in stage 6, the dome's top worn away before the Cretaceous, a faint outline. */
.geo-kbase{fill:none;stroke:var(--paper-ink);stroke-width:1.6;stroke-dasharray:.1 3;stroke-linecap:round}.geo-sw-kbase{height:0;border:0;border-top:3px dotted var(--paper-ink)}
.geo-worn{fill:none;stroke:var(--paper-muted);stroke-width:1;stroke-dasharray:2 2}.geo-sw-worn{height:0;border:0;border-top:1px dashed var(--paper-muted)}
/* A short screen with the figure beside the text (an unfolded phone turned on its side, a short laptop): the key and the note set closer, so the stuck figure's tallest stage still fits the screen. */
@media(min-width:700px) and (max-height:640px) and (orientation:landscape){.geo-has-figure .geo-figure .geo-key{gap:.2rem 1rem;margin-top:.6rem;line-height:1.35}.geo-has-figure .geo-figure .geo-note{margin-top:.5rem;line-height:1.4}}

/* Where the figure stays in view, scrolling steps the drawing; a phone held upright gets this too. The figure becomes a short panel stuck to the top of the screen (the drawing, eight progress marks, the stage's name, two small buttons that stay put), and each stage's key moves into the stage.
   Nothing here applies without JavaScript: every rule needs .geo-has-figure or an element timeline.js makes (.geo-hint, .geo-progress, .geo-stage-key, .geo-step). */
/* One quiet line above the figure, in the eyebrow's voice, made by timeline.js. */
.geo-hint{margin:0 0 1rem;font-size:.6875rem;font-weight:500;letter-spacing:.15em;line-height:1.55;text-transform:uppercase;color:var(--paper-muted)}
/* Eight equal marks: the series, and where in it the drawing is. */
.geo-progress{display:flex;gap:3px;margin:.6rem 0 0;padding:0;list-style:none}.geo-progress li{flex:1;height:3px;background:var(--geo-scale)}.geo-progress li.geo-past{background:var(--paper-line)}.geo-progress li.geo-on{background:var(--paper-ink)}
.geo-stage-key{display:none}
/* A tapped button keeps no hover underline on a touch screen. */
@media(hover:none){.geo-step:hover{text-decoration:none}}
/* A phone held upright: the same query as timeline.js's "tall". Screens only, and taller than wide, so a printed page and a phone on its side keep the figure in the flow. */
@media screen and (max-width:999px) and (min-height:520px) and (orientation:portrait){
  .geo-has-figure .geo-figure{position:sticky;top:0;z-index:3;margin:0 -7vw;padding:.6rem 7vw .35rem;background:var(--bone);border-bottom:1px solid var(--paper-line);box-shadow:0 6px 14px -12px #282b2466}.geo-has-figure .geo-svg{border-color:#b1a79799}
  /* The panel keeps only what is read while the stage text scrolls under it. */
  .geo-has-figure .geo-scale,.geo-has-figure .geo-figure .geo-key,.geo-has-figure .geo-note,.geo-has-figure .geo-now-age{display:none}
  .geo-has-figure .geo-figure figcaption{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.75rem;margin-top:.15rem}.geo-has-figure .geo-now{display:block;min-width:0;margin:0}.geo-has-figure .geo-now-title{display:block;overflow:hidden;font-size:1.3rem;white-space:nowrap;text-overflow:ellipsis}
  .geo-has-figure .geo-controls{gap:.15rem;margin:0;border:0}.geo-has-figure .geo-step{justify-content:center;gap:0;width:44px;height:44px;padding:0;font-size:0}.geo-has-figure .geo-step span{font-size:1.25rem;line-height:1}.geo-has-figure .geo-count{min-width:3.6em;text-align:center;font-size:.6875rem;letter-spacing:.12em}
  /* The stage's top lands just under the panel when a button scrolls to it; timeline.js measures the panel into --geo-panel. */
  .geo-has-figure .geo-stage{scroll-margin-top:calc(var(--geo-panel,240px) + .5rem)}.geo-has-figure .geo-stage-key{display:flex;margin-top:1rem}.geo-has-figure .geo-current .geo-index{color:var(--paper-ink)}
  /* The citation links the keyboard focuses in the list, and the stage headings, stop just under the panel when scrolled into view (WCAG 2.4.11). */
  .geo-has-figure .geo-stages a,.geo-has-figure .geo-stages h3{scroll-margin-top:calc(var(--geo-panel,240px) + 1rem)}
}
/* On a wide screen (the same query as timeline.js's "wide": 1000px and up, or a screen at least 700 by 520 held
   wider than tall, such as an unfolded Galaxy Fold) the time scale shows the stage, and the hint spans the grid, just above the figure and the list. */
@media(min-width:1000px),(min-width:700px) and (min-height:520px) and (orientation:landscape){.geo-progress{display:none}.geo-body.geo-has-figure{row-gap:1rem}.geo-has-figure .geo-hint{grid-column:1/-1;margin-bottom:0}}
@media print{.geo-hint,.geo-progress{display:none}.geo-has-figure .geo-figure{position:static;box-shadow:none}}