/* v70_light2 additions. Loaded after v70l.css. */

/* ---------- Platform: the model becomes the place as the page scrolls ---------- */
.scrub { position: relative; height: 320svh; background: var(--night); }
.scrub-s { position: sticky; top: 0; height: 100svh; min-height: 520px; overflow: hidden; }
.scrub-f { position: absolute; inset: 0; }
.scrub-f > canvas, .scrub-b, .scrub-b > img { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.scrub-b > img { object-fit: cover; }
.scrub-f > canvas { z-index: 1; display: none; }
.scrub-f > canvas.is-on { display: block; }
/* a shade only where the words stand: pale while the model shows, Night once the place is real */
.scrub-s::before, .scrub-s::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 64%; z-index: 2; pointer-events: none; transition: opacity 700ms linear; }
.scrub-s::before { background: linear-gradient(to top, color-mix(in srgb, var(--limestone) 84%, transparent) 0%, color-mix(in srgb, var(--limestone) 44%, transparent) 34%, transparent 62%); }
.scrub-s::after { background: linear-gradient(to top, color-mix(in srgb, var(--night) 86%, transparent) 0%, color-mix(in srgb, var(--night) 44%, transparent) 32%, transparent 60%); opacity: 0; }
.scrub.is-b .scrub-s::before { opacity: 0; }
.scrub.is-b .scrub-s::after { opacity: 1; }
.scrub-t { position: absolute; left: 0; right: 0; bottom: calc(var(--hero-f) + var(--hero-pb)); z-index: 3; color: var(--night); --fg-2: var(--text-2); transition: color 700ms linear; }
.scrub.is-b .scrub-t { color: var(--limestone); --fg-2: var(--text-2-dark); }
.scrub-t .t-label + * { margin-top: var(--s4); }
.scrub-t h2 { display: grid; }
.scrub-t h2 > .sc-l { grid-area: 1 / 1; transition: opacity 500ms linear, translate 900ms var(--e-out); }
.scrub-t h2 > .sc-l:not(.is-on) { opacity: 0; translate: 0 14px; }
.scrub-t h2 + .t-lead { margin-top: var(--s5); max-width: 40ch; }
html.still .scrub { height: auto; }
html.still .scrub-s { position: relative; }
html.still .scrub-t h2 > .sc-l { grid-area: auto; opacity: 1; translate: none; }
@media (max-width: 809px) { .scrub { height: 260svh; } .scrub-s::before, .scrub-s::after { height: 74%; } }

/* ---------- one-line drawings (gallery «Hercinia One Line»): one stroke, Night on light grounds, Limestone on dark ---------- */
.ol { color: var(--fg); margin: 0; }
.ol svg { display: block; width: 100%; height: auto; overflow: visible; }
.ol path { vector-effect: non-scaling-stroke; stroke-width: 1.5px; }
.ol.ol-wait svg { clip-path: inset(0 100% 0 0); }
.ol.ol-wait.is-in svg { clip-path: inset(0 0 0 0); transition: clip-path 2600ms var(--e-out); }
html.still .ol svg { clip-path: none !important; transition: none !important; }
/* About, Seat and structure: beside the title */
.intro > .ol-aside { grid-column: 9 / -1; grid-row: 1 / span 2; align-self: end; width: 100%; }
/* Careers and Contact: under the text of a column */
.ol-spot { width: 100%; max-width: 520px; }
.empty > .ol-spot { margin-top: var(--s8); }
.ct-a > .ol-barge { margin-top: var(--s4); }
/* 404: on the right of the empty hero, standing on the line of the buttons */
.hero-g > .ol-hero { grid-column: 8 / -1; grid-row: 1; align-self: end; z-index: 1; color: var(--limestone); }
@media (max-width: 1199px) {
  .intro > .ol-aside { grid-column: 1 / -1; grid-row: auto; margin-top: var(--s7); max-width: 480px; }
  .ct-a > .ol-barge { grid-column: 1 / -1; max-width: 420px; }
  .hero-g > .ol-hero { grid-column: 1 / -1; align-self: start; margin-top: calc(var(--s9, 96px) + 40px); max-width: 480px; }
}

/* ---------- Atlas, At a glance: contour lines as a quiet ground (Motion Lab N° 12) ---------- */
#findings { isolation: isolate; }
#findings > .topo { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; display: block; }

/* ---------- Atlas, the 35 materials: imported share in red (Rea, 3 Nov 2026) ---------- */
.rd { --dep-imp: #C0503F; }
[data-s="limestone"] .rd, [data-s="lichen"] .rd { --dep-imp: #A63B2C; }