/* ============================================================
   STEADY EDDIE — PUBLIC SITE · SHARED DESIGN SYSTEM
   STE-SITE-CSS-001 · R2.15 · 2026-09-05
   R2.15: the header holds one row and fits the screen with the nine longer labels (owner: "tighten so it fits the screen", "only one row high"): smaller type and padding at every width, no wrapping, the burger from 1280 px down.
   R2.14: a looping background video behind a photo hero (.hero-video), shown only with motion allowed; the still stays underneath as poster and fallback.
   R2.13: motion (owner: "energetic - animate it"): a gentle pan on photograph heroes only (renders stay still), scroll-driven drift on photo bands where the browser supports it, kicker bars that draw in on reveal, the overlay boxes drawing themselves, images fading in as they reveal, lifts on link cards, row highlights on tables. Every motion sits under prefers-reduced-motion: no-preference.
   R2.12: cold-eyes pass 2 — captions over photographs carry a shadow; the watermark drawings fade before their edges (the grid's edge read as a seam); five facts fit one row; the fourth "choose" card is marked as the ask; sector-card captions hold two lines so the labels align; tables on phones say they scroll; the footer keeps its side padding on phones; headings balance; the outline button on a photo hero carries a dark fill.
   R2.11: cold-eyes fixes — the lockup shrinks below 1000 px so the Menu button is never clipped (it was, at 390 px); kickers over photographs are white with a red bar (red on a dark frame failed contrast).
   R2.10: the bar with "Intelligence in the Seat" — tagline hidden below 1600 px, tighter nav padding below 1440 and 1180. · site r14 (the go-to-market build)
   R2.9: watermarks — the owner (2026-09-05, ~4:10 am): "i don't see any watermark type vector designs; faint design engineer drawings". Line art derived from
         the STE5-MDL-500-000 R0.6 engineering model (the machine with its sensing sweep, the plan view, the pedal and joystick pods) sits behind
         tint sections, the CTA band and the footer at 8–14% (.wm classes). Ink on white, never a fill; the brand's faint-backdrop rule stretched on the owner's ask.
   R2.8: the owner (2026-09-05, ~3:30 am): "the menu bar and branding is too small, hard to read" — logo 72 px (56 scrolled), menu type 13 px, tagline 11.5 px, the tight breakpoints scaled up with it.
   R2.7: the crisp pass — the owner (2026-09-04, night): "a full and proper branding and logo pass, everything need to be super sharp and crisp".
         The hero pan is off (a moving, scaled photograph is resampled every frame and never sharp); the lockup is the raster master knocked out
         to alpha at 1x/2x/3x, the redrawn SVGs are off the site (they drifted from the artwork, P-087); photographs cut to 3200 for dense screens.
   R2.6: pure white skin — the owner (2026-09-04, evening): "i'd like a pure white skin on the site". Steel Silver is retired from every fill;
         a tint band keeps its place with a hairline, the current item in a menu is marked by a red rule, the ink band on How it works is white.
   R2.5: room between a section heading and a numbered list (h2 + .prin).
   R2.4: .rows-3, a gallery in fixed rows of three at any width (one column on a phone).
   R2.3: a ten-item bar (Plant, Industrial, Agricultural and STE at the top level) —
   tighter spacing below 1440 px so it holds one row at 1280.
   R2.2: gallery tiles at least 340 px wide, three across on a wide screen (the owner: "nice shots, but too small").
   R2.1: lighter scrims on the cinematic hero and the photo band (the owner,
   2026-09-04: "the whole site lacks energy"); the photographs were polished
   at source the same day (_site-r14_BUILD/polish_pool.py). Nothing else moved.
   R2.0: modular type scale, spacing bands, the dark register, cinematic
   hero with media motion, ribbon, proof module, timeline, CTA tiers,
   compact sticky header, responsive pictures. Built on R1.1; tokens kept.
   One stylesheet, every page. Page-specific style goes in that
   page's own <style> block, built on these tokens. Do not fork.

   Brand: STE-BRD-001 R0.3 ISSUED — white skin, Eddie Red as the
   single accent on text, headings, rules and small controls only.
   No large red fills, no large black fills. Steady Ink is text.
   Type is self-hosted (assets/fonts/): Barlow for reading, Barlow
   Condensed for display, the system mono stack for eyebrows —
   the same kit the engineering portal uses, so the two properties
   read as one company.
   ============================================================ */

/* ---------- self-hosted type ---------- */
@font-face{font-family:"Barlow";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/Barlow-400.woff2") format("woff2")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/Barlow-500.woff2") format("woff2")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/Barlow-600.woff2") format("woff2")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/Barlow-700.woff2") format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/BarlowCondensed-600.woff2") format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/BarlowCondensed-700.woff2") format("woff2")}

/* ---------- tokens (STE-BRD-001 §10) ---------- */
:root{
  --ink:#14181A;         /* Steady Ink — text and headings only, never a large fill */
  --graphite:#3C4A42;    /* secondary structure, subheads, technical rules */
  --accent:#C8102E;      /* Eddie Red — the single accent */
  --accent-l:#E01B3A;    /* Eddie Red bright — hover state */
  --silver:#FFFFFF;      /* Steel Silver retired from fills 2026-09-04 (R2.6, pure white skin); the name stays so nothing else moves */
  --paper:#FFFFFF; --card:#FFFFFF; --line:#E2E6E2; --muted:#5E6E66;
  --sans:"Barlow","Helvetica Neue",Helvetica,Arial,sans-serif;
  --disp:"Barlow Condensed","Arial Narrow","Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --wrap:1180px;
  --r:3px;
}

/* ---------- reset / base ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);font-size:17px;line-height:1.6;min-height:100vh;display:flex;flex-direction:column}
main{flex:1 0 auto}
a{color:inherit}
img,svg,video{display:block;max-width:100%}
img{height:auto}
ul,ol{padding-left:1.25em}
strong,b{font-weight:700}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 clamp(18px,4vw,28px)}
.wrap.narrow{max-width:860px}
h1,h2,h3,h4{font-family:var(--disp);font-weight:700;text-transform:uppercase;letter-spacing:.01em;line-height:.98;color:var(--ink)}
h1,.t-xxl{font-size:clamp(44px,3.6vw + 20px,96px);line-height:.96}
h2,.t-xl{font-size:clamp(32px,2.2vw + 18px,60px);line-height:.98}
h3,.t-lg{font-size:clamp(22px,1vw + 16px,30px);line-height:1.08}
.t-md{font-size:20px;font-weight:600;line-height:1.3}
h4{font-family:var(--sans);font-size:15px;text-transform:uppercase;letter-spacing:.08em;line-height:1.3}
p{max-width:70ch}
.lede{font-size:clamp(18px,1.6vw,21px);line-height:1.5;color:var(--graphite);max-width:60ch;font-weight:500}
.kicker{display:inline-block;font-family:var(--mono);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.2em;color:var(--accent);margin-bottom:14px}
.kicker.ink{color:var(--graphite)}
.mono{font-family:var(--mono)}
.muted{color:var(--muted)}
.red{color:var(--accent)}
hr.rule{border:0;border-top:2px solid var(--accent);width:56px;margin:18px 0 22px}
section{position:relative}
.sec{padding:clamp(96px,10vw,128px) 0}
.sec.band-tight,.sec.tight{padding:clamp(56px,7vw,72px) 0}
.sec.band-std{padding:clamp(96px,10vw,128px) 0}
.sec.band-hero{padding:clamp(140px,16vw,220px) 0}
.tint{background:var(--paper)}
.sec.tint{border-top:1px solid var(--line)}
.status + .sec.tint,.doctrine-band + .sec.tint,.hero + .sec.tint{border-top:0}
.txt h2{margin-bottom:16px}
.sec-head{margin-bottom:clamp(28px,4vw,48px)}
.sec-head h2{margin-bottom:14px}
.sec-head .lede{margin-top:6px}

/* faint engineering-grid backdrop — public site only, ≤7.5 % alpha (STE-BRD-001 §4) */
.blueprint::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(200,16,46,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(200,16,46,.045) 1px,transparent 1px),
    linear-gradient(rgba(200,16,46,.022) 1px,transparent 1px),
    linear-gradient(90deg,rgba(200,16,46,.022) 1px,transparent 1px);
  background-size:96px 96px,96px 96px,24px 24px,24px 24px}
.blueprint>.wrap{position:relative}

/* ---------- reveal (threshold 0 + 1.5 s safety net — see the portal's STE-BOK-UPDATE-125) ---------- */
.rv{opacity:1;transform:none}
html.rv-armed .rv{opacity:0;transform:translateY(12px);transition:opacity .55s cubic-bezier(.2,.7,.3,1),transform .55s cubic-bezier(.2,.7,.3,1)}
html.rv-armed .rv.in{opacity:1;transform:none}
.rv-d1{transition-delay:.08s}.rv-d2{transition-delay:.16s}.rv-d3{transition-delay:.24s}.rv-d4{transition-delay:.32s}

/* ---------- buttons ---------- */
.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.btn{position:relative;display:inline-block;text-decoration:none;font-family:var(--mono);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;padding:14px 26px;border:2px solid var(--ink);color:var(--ink);background:transparent;border-radius:var(--r);transition:border-color .2s,color .2s,background .2s;cursor:pointer;line-height:1.2}
.btn:hover{border-color:var(--accent);color:var(--accent)}
.btn-solid{background:var(--accent);border-color:var(--accent);color:#fff}
.btn-solid:hover{background:var(--accent-l);border-color:var(--accent-l);color:#fff}
.btn-sm{padding:10px 18px;font-size:11px}
.link{color:var(--accent);font-weight:600;text-decoration:none;border-bottom:1px solid transparent}
.link:hover{border-bottom-color:var(--accent)}
.arrow::after{content:" \2192"}
:where(a,button,input,select,textarea,summary):focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- header / nav ---------- */
.hdr{position:sticky;top:0;z-index:200;background:var(--paper);border-bottom:3px solid var(--accent)}
.hdr-in{max-width:1480px;margin:0 auto;padding:0 clamp(14px,2vw,22px);display:flex;align-items:center;gap:18px;min-height:64px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;flex:none}
.brand img{height:72px;width:auto;image-rendering:auto}
.brand .tag{font-family:var(--mono);font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding-left:12px;border-left:1px solid var(--line);white-space:nowrap}
@media (max-width:1180px){.brand .tag{display:none}}
nav.site{margin-left:auto;display:flex;align-items:center;gap:2px}
nav.site a,nav.site .grp-t{font-family:var(--mono);font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--ink);padding:12px 12px;border-radius:var(--r);white-space:nowrap;background:none;border:0;cursor:pointer;line-height:1.2}
nav.site a:hover,nav.site .grp-t:hover{color:var(--accent)}
nav.site a[aria-current="page"]{color:var(--accent);box-shadow:inset 0 -2px 0 var(--accent)}
nav.site .grp{position:relative}
nav.site .grp-t::after{content:" \25BE";font-size:9px}
nav.site .grp-m{position:absolute;top:100%;left:0;min-width:220px;background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--accent);box-shadow:0 12px 30px rgba(20,24,26,.12);padding:8px;display:none;z-index:210}
nav.site .grp.open .grp-m,nav.site .grp:hover .grp-m,nav.site .grp:focus-within .grp-m{display:block}
nav.site .grp-m a{display:block;padding:9px 10px}
nav.site .grp-m a small{display:block;font-family:var(--sans);font-size:12px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--muted);margin-top:2px}
nav.site .enq{border:2px solid var(--accent);color:var(--accent);margin-left:6px;padding:8px 14px}
nav.site .enq:hover{background:var(--accent);color:#fff}
@media (max-width:1400px){.brand .tag{display:none}nav.site a,nav.site .grp-t{padding:10px 7px;font-size:10px;letter-spacing:.06em}nav.site .enq{padding:8px 11px}}
/* (the 1001–1180 desktop-tight rule retired by R2.15: the burger starts at 1280) */
.split>*{min-width:0}
.strip{min-width:0}
.burger{display:none;margin-left:auto;background:none;border:2px solid var(--ink);border-radius:var(--r);padding:8px 10px;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;color:var(--ink)}
@media (max-width:1280px){
  .burger{display:inline-block}
  nav.site{display:none;position:absolute;left:0;right:0;top:100%;background:var(--paper);border-bottom:3px solid var(--accent);flex-direction:column;align-items:stretch;padding:10px 14px 18px;gap:0;max-height:calc(100vh - 70px);overflow:auto}
  nav.site.open{display:flex}
  nav.site a,nav.site .grp-t{display:block;padding:12px 8px;border-bottom:1px solid var(--line);font-size:12px;text-align:left;width:100%}
  nav.site .grp-m{position:static;display:block;border:0;box-shadow:none;padding:0 0 0 14px}
  nav.site .grp-t{display:none}
  nav.site .enq{margin:12px 0 0;text-align:center;border-width:2px}
}

/* ---------- status strip (the honest position, once per page) ---------- */
.status{background:var(--silver);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.status .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;padding-top:10px;padding-bottom:10px}
.status .lbl{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);padding-right:14px;border-right:2px solid var(--accent)}
.status .txt{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--graphite)}
.status .txt b{color:var(--ink)}

/* ---------- doctrine strip ---------- */
.doctrine{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 0;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);text-align:center}
.doctrine .dv{color:var(--accent);padding:0 14px}
.doctrine-band{padding:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper)}

/* ---------- hero ---------- */
.hero{position:relative;background:var(--silver)}
.hero .ph{position:relative;min-height:clamp(380px,58vh,640px);overflow:hidden}
.hero .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.hero .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.92) 0%,rgba(255,255,255,.55) 38%,rgba(255,255,255,0) 70%)}
.hero .plate{position:relative;z-index:2;max-width:var(--wrap);margin:0 auto;padding:clamp(40px,7vw,96px) clamp(18px,4vw,28px)}
.hero .plate-in{max-width:640px}
.hero h1{margin:6px 0 18px}
.hero .lede{color:var(--ink)}
.hero .cap{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--graphite);padding:10px clamp(18px,4vw,28px);max-width:var(--wrap);margin:0 auto}
.hero.stack .ph{min-height:clamp(300px,42vh,480px)}
.hero.stack .ph::after{background:linear-gradient(180deg,rgba(255,255,255,0) 40%,rgba(255,255,255,.9) 100%)}
.hero.stack .plate{margin-top:-120px}
.hero.stack .plate-in{max-width:760px;background:var(--paper);padding:clamp(24px,4vw,40px);border-top:3px solid var(--accent)}
@media (max-width:760px){.hero .ph::after{background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,.92))}.hero .ph{min-height:320px}}

/* ---------- cards / grids ---------- */
.grid{display:grid;gap:clamp(16px,2.2vw,26px)}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:clamp(20px,2.4vw,28px);position:relative}
.card.on-tint{background:var(--paper)}
.card .k{display:block;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:10px}
.card h3{margin-bottom:10px}
.card p{font-size:16px;color:var(--graphite)}
.card p+p{margin-top:10px}
.card.rule-top{border-top:3px solid var(--accent)}
a.card{text-decoration:none;color:inherit;display:block}
a.card:hover{border-color:var(--accent)}
.grid.g1{grid-template-columns:1fr}
.card .n{position:absolute;top:18px;right:20px;font-family:var(--disp);font-weight:700;font-size:28px;line-height:1;color:var(--line)}

/* ---------- steps ---------- */
.steps{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));counter-reset:step}
.step{border-top:2px solid var(--line);padding-top:16px}
.step .num{font-family:var(--disp);font-weight:700;font-size:40px;line-height:1;color:var(--accent);margin-bottom:8px}
.step h3{font-size:19px;margin-bottom:8px}
.step p{font-size:15.5px;color:var(--graphite)}

/* ---------- split (text + figure) ---------- */
.split{display:grid;gap:clamp(24px,4vw,56px);grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));align-items:center}
.split.text-first .txt{order:0}
.split .txt h2{margin-bottom:16px}
.split .txt p+p{margin-top:14px}

/* ---------- figures & photography ---------- */
figure.ph{margin:0;position:relative}
figure.ph img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r);background:var(--silver)}
figure.ph.wide img{aspect-ratio:21/9}
figure.ph.tall img{aspect-ratio:4/3}
figure.ph figcaption{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--graphite);margin-top:8px;line-height:1.5}
figure.ph figcaption b{color:var(--accent)}
.ph-tag{position:absolute;top:10px;left:10px;background:rgba(255,255,255,.94);border-left:3px solid var(--accent);font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);padding:5px 8px;border-radius:2px}
.gallery{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr))}
.strip{display:flex;gap:12px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.strip figure.ph{flex:0 0 260px;scroll-snap-align:start}
.strip figure.ph img{aspect-ratio:4/3}

/* ---------- tables ---------- */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--paper)}
table.tbl{width:100%;border-collapse:collapse;font-size:15px;min-width:560px}
table.tbl th,table.tbl td{padding:12px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
table.tbl th{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--graphite);background:var(--silver)}
table.tbl tr:last-child td{border-bottom:0}
table.tbl td.k{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--accent);white-space:nowrap}
table.tbl td b{color:var(--ink)}
.yes{color:var(--ink);font-weight:700}
.no{color:var(--accent);font-weight:700}

/* ---------- callouts / notes ---------- */
.callout{border-left:3px solid var(--accent);padding:6px 0 6px 22px;margin:22px 0}
.callout p{font-size:clamp(18px,1.5vw,21px);line-height:1.5;color:var(--ink);max-width:66ch}
.callout .src{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:10px}
.note{background:var(--paper);border:1px solid var(--line);border-left:3px solid var(--graphite);border-radius:var(--r);padding:20px 24px;margin:22px 0}
.note .k{display:block;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--graphite);margin-bottom:8px}
.note p{font-size:15.5px;color:var(--ink)}
.note.honest{border-left-color:var(--accent);background:var(--paper);border:1px solid var(--line);border-left:3px solid var(--accent)}
.quote{font-family:var(--disp);font-weight:600;font-size:clamp(22px,2.6vw,32px);line-height:1.15;text-transform:none;color:var(--ink);max-width:24ch}
.quote+.src{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:12px}

/* ---------- definition list (facts) ---------- */
.facts{display:grid;gap:14px 28px;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.facts div{border-top:2px solid var(--line);padding-top:10px}
.facts dt{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:6px}
.facts dd{font-size:16px;color:var(--ink);margin:0}
.facts dd small{display:block;color:var(--muted);font-size:13px;margin-top:4px}

/* ---------- lists ---------- */
ul.tick{list-style:none;padding:0}
ul.tick li{position:relative;padding-left:26px;margin-bottom:10px;color:var(--ink)}
ul.tick li::before{content:"";position:absolute;left:0;top:.62em;width:12px;height:2px;background:var(--accent)}
ul.tick.refuse li::before{width:10px;height:10px;top:.5em;border:2px solid var(--accent);background:transparent;border-radius:50%}
.two-col{columns:2;column-gap:40px}
@media (max-width:760px){.two-col{columns:1}}

/* ---------- CTA band ---------- */
.cta-band{background:var(--silver);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cta-band .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;padding-top:clamp(36px,5vw,56px);padding-bottom:clamp(36px,5vw,56px)}
.cta-band h2{font-size:clamp(26px,3.4vw,40px);max-width:22ch}
.cta-band .cta-row{margin-top:0}

/* ---------- forms ---------- */
.form{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.form .full{grid-column:1/-1}
.form label{display:block;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--graphite);margin-bottom:6px}
.form label .req{color:var(--accent)}
.form input,.form select,.form textarea{width:100%;font:inherit;font-size:16px;color:var(--ink);background:var(--paper);border:1px solid #C9D1CC;border-radius:var(--r);padding:12px 14px}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px rgba(200,16,46,.14)}
.form [aria-invalid="true"]{border-color:var(--accent)}
.form textarea{min-height:130px;resize:vertical}
.form .help{font-size:13px;color:var(--muted);margin-top:6px}
.form .hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}
.se-status{font-size:15px;margin-top:6px;min-height:1.4em}
.se-status.ok{color:var(--ink);font-weight:600}
.se-status.err{color:var(--accent);font-weight:600}

/* ---------- footer ---------- */
.ftr{background:var(--silver);border-top:3px solid var(--accent);margin-top:auto}
.ftr .top{padding:clamp(36px,5vw,56px) 0 28px;display:grid;gap:28px 32px;grid-template-columns:1.5fr repeat(3,1fr)}
@media (max-width:1100px){.ftr .top{grid-template-columns:1fr 1fr 1fr}.ftr .brandcol{grid-column:1/-1}}
@media (max-width:900px){.ftr .top{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.ftr .top{grid-template-columns:1fr}}
.ftr .brandcol img{height:60px;width:auto}
.ftr .logo-plate{display:inline-block;background:#fff;padding:10px 14px;border-radius:var(--r);margin-bottom:14px}
.ftr .brandcol p{font-size:14.5px;color:var(--graphite);max-width:40ch}
.ftr h4{margin-bottom:12px;color:var(--ink)}
.ftr ul{list-style:none;padding:0}
.ftr li{margin-bottom:8px}
.ftr li a{font-size:14.5px;color:var(--graphite);text-decoration:none}
.ftr li a:hover{color:var(--accent)}
.ftr .doct{padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ftr .legal{padding:20px 0 28px;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--muted);line-height:1.7}
.ftr .legal p{max-width:none}
.ftr .legal .origin{font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);margin-bottom:8px}
.ftr .legal a{color:var(--graphite)}

/* ---------- utilities ---------- */
.mt0{margin-top:0}.mt1{margin-top:12px}.mt2{margin-top:24px}.mt3{margin-top:40px}
.mb1{margin-bottom:12px}.mb2{margin-bottom:24px}
.center{text-align:center}
.center p{margin-left:auto;margin-right:auto}
.small{font-size:14px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media print{.hdr,.burger,.cta-band,.btn{display:none!important}body{font-size:12pt}a::after{content:""}}


/* ============================================================
   R1.1 · 2026-09-03 · engineering expansion additions
   ============================================================ */
/* skip link (keyboard users) */
.skip{position:absolute;left:-9999px;top:10px;z-index:300;background:var(--paper);color:var(--accent);padding:10px 14px;border:2px solid var(--accent);border-radius:var(--r);font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;text-decoration:none}
.skip:focus{left:12px}

/* menu group: wide variant, and the trigger when a child page is current */
nav.site .grp-m.wide{min-width:300px}
nav.site .grp.has-current .grp-t{color:var(--accent);box-shadow:inset 0 -2px 0 var(--accent)}
nav.site .grp-m a[aria-current="page"]{background:var(--paper);box-shadow:inset 3px 0 0 var(--accent)}

/* status pills — the honesty device on the engineering pages.
   Every engineering block says which it is: built, design, or open. */
.pill{display:inline-block;font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:4px 8px;border-radius:2px;border:1px solid var(--line);color:var(--graphite);background:var(--paper);line-height:1.2;vertical-align:middle;white-space:nowrap}
.pill.built{border-color:var(--ink);color:var(--ink)}
.pill.design{border-color:var(--graphite);color:var(--graphite)}
.pill.open{border-color:var(--accent);color:var(--accent)}
.pill.inherit{border-style:dashed}
.pill-row{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0}
.card .pill-row{margin-top:14px}
.legend{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;font-size:14px;color:var(--graphite);margin-top:14px}
.legend .pill{margin-right:6px}

/* on-this-page sub-navigation */
.subnav{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);margin-bottom:clamp(24px,3vw,36px)}
.subnav .lbl{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
.subnav a{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--graphite);text-decoration:none;padding:4px 0;border-bottom:2px solid transparent}
.subnav a:hover{color:var(--accent);border-bottom-color:var(--accent)}
h2[id],h3[id]{scroll-margin-top:84px}

/* inline SVG diagrams — brand palette only: ink, graphite, red strokes, silver fills.
   Red is a stroke and a marker, never a fill of any size. */
.dg-wrap{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(14px,2vw,24px);overflow-x:auto}
.tint .dg-wrap{background:var(--paper)}
.dg{display:block;width:100%;height:auto;max-width:100%}
.dg text{font-family:var(--sans);fill:var(--ink);font-size:13px}
.dg .tk{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;fill:var(--accent)}
.dg .tg{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;fill:var(--graphite)}
.dg .th{font-family:var(--disp);font-weight:700;font-size:17px;text-transform:uppercase;fill:var(--ink)}
.dg .tb{font-size:12px;fill:var(--graphite)}
.dg .tm{font-family:var(--mono);font-size:10px;fill:var(--graphite)}
.dg .tw{fill:var(--paper)}
.dg .bx{fill:var(--paper);stroke:var(--ink);stroke-width:1.5}
.dg .bxs{fill:var(--silver);stroke:var(--line);stroke-width:1}
.dg .bxr{fill:var(--paper);stroke:var(--accent);stroke-width:2}
.dg .bxi{fill:var(--ink);stroke:var(--ink)}
.dg .ln{stroke:var(--ink);stroke-width:1.5;fill:none}
.dg .lnr{stroke:var(--accent);stroke-width:2;fill:none}
.dg .lnd{stroke:var(--graphite);stroke-width:1.2;stroke-dasharray:4 4;fill:none}
.dg .lnl{stroke:var(--line);stroke-width:1;fill:none}
.dg .dot{fill:var(--accent)}
.dg .doti{fill:var(--ink)}
.dg .hatch{fill:url(#hatchr)}
figure.dgf{margin:0}
figure.dgf figcaption{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--graphite);margin-top:10px;line-height:1.5}

/* glossary */
.gloss{display:grid;gap:0;grid-template-columns:1fr}
.gloss div{display:grid;grid-template-columns:minmax(160px,220px) 1fr;gap:12px 24px;padding:14px 0;border-top:1px solid var(--line)}
.gloss div:last-child{border-bottom:1px solid var(--line)}
.gloss dt{font-family:var(--disp);font-weight:700;font-size:19px;text-transform:uppercase;line-height:1.1;color:var(--ink)}
.gloss dt small{display:block;font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.14em;color:var(--accent);margin-top:4px}
.gloss dd{margin:0;font-size:15.5px;color:var(--graphite)}
@media (max-width:640px){.gloss div{grid-template-columns:1fr;gap:6px}}
.az{display:flex;flex-wrap:wrap;gap:4px;margin:12px 0 0}
.az a{font-family:var(--mono);font-size:11px;font-weight:700;padding:6px 9px;border:1px solid var(--line);border-radius:var(--r);text-decoration:none;color:var(--ink)}
.az a:hover{border-color:var(--accent);color:var(--accent)}

/* spec-style rows: term · status · plain words */
table.tbl td .pill{margin:0}
table.tbl.spec td:nth-child(2){white-space:nowrap}

/* numbered principle list */
ol.prin{list-style:none;padding:0;counter-reset:pr}
ol.prin li{position:relative;padding-left:56px;margin-bottom:18px;counter-increment:pr}
ol.prin li::before{content:counter(pr,decimal-leading-zero);position:absolute;left:0;top:-2px;font-family:var(--disp);font-weight:700;font-size:30px;line-height:1;color:var(--accent)}
ol.prin li b{display:block;font-family:var(--disp);font-weight:700;font-size:20px;text-transform:uppercase;line-height:1.05;margin-bottom:4px;color:var(--ink)}
ol.prin li p{font-size:15.5px;color:var(--graphite)}

/* aside box for "engineers: how to get the set" */
.aside-box{border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:var(--r);padding:20px 22px;background:var(--paper)}
.aside-box .k{display:block;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
.aside-box p{font-size:15px;color:var(--graphite)}
.aside-box p+p{margin-top:8px}

/* print: keep diagrams and pills legible */
@media print{.subnav,.skip{display:none!important}.dg-wrap{border:1px solid #999}.pill{border-color:#444;color:#000}}


/* ============================================================
   R2.0 · 2026-09-03 · the go-to-market build
   ============================================================ */
/* ---------- the dark register: at most one per page; red only as rule, numeral, divider ---------- */
.sec.dark{background:var(--ink);color:rgba(255,255,255,.92)}
.sec.dark h1,.sec.dark h2,.sec.dark h3,.sec.dark .quote{color:#fff}
.sec.dark .lede,.sec.dark p{color:rgba(255,255,255,.86)}
.sec.dark .kicker{color:var(--accent-l)}
.sec.dark .doctrine{color:#fff}
.sec.dark .btn{border-color:#fff;color:#fff}
.sec.dark .btn:hover{border-color:var(--accent-l);color:var(--accent-l)}
.sec.dark .btn-solid{background:var(--accent);border-color:var(--accent);color:#fff}
.sec.dark .card{background:transparent;border-color:rgba(255,255,255,.18)}
.sec.dark .card p{color:rgba(255,255,255,.8)}
.sec.dark .card .k{color:var(--accent-l)}
.sec.dark hr.rule{border-top-color:var(--accent-l)}
.sec.dark .facts div{border-top-color:rgba(255,255,255,.22)}
.sec.dark .facts dd,.sec.dark .facts dd small{color:rgba(255,255,255,.86)}
.sec.dark ul.tick li{color:rgba(255,255,255,.9)}
.sec.dark .subnav a{color:rgba(255,255,255,.8)}
.sec.dark .rv{transform:none}

/* ---------- full-bleed photograph section ---------- */
.sec.photo{position:relative;min-height:clamp(420px,60vh,720px);display:flex;align-items:flex-end;padding:0;overflow:hidden;background:var(--ink)}
.sec.photo .media,.sec.photo picture,.sec.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.sec.photo .scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,24,26,0) 40%,rgba(20,24,26,.62) 100%)}
.sec.photo .wrap{position:relative;z-index:2;padding-top:clamp(40px,6vw,80px);padding-bottom:clamp(36px,5vw,64px);color:#fff}
.sec.photo h2{color:#fff}
.sec.photo p{color:rgba(255,255,255,.9)}
.sec.photo .kicker{color:var(--accent-l)}
.sec.photo .cap{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.7);margin-top:14px}

/* ---------- cinematic hero ---------- */
.hero.cine{background:var(--ink);position:relative;overflow:hidden}
.hero.cine .hero-media{position:absolute;inset:0;z-index:0}
.hero.cine .hero-media img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.hero.cine .hero-media.motion-pan img{animation:none;transform:none}  /* R2.7: pan retired for sharpness; the keyframes stay below for the record */
@keyframes hero-pan{from{transform:scale(1.02) translate3d(0,0,0)}to{transform:scale(1.10) translate3d(-1.5%,-1%,0)}}
@media (prefers-reduced-motion:reduce){.hero.cine .hero-media.motion-pan img{animation:none;transform:none}}
.hero.cine .scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(20,24,26,.70) 0%,rgba(20,24,26,.42) 40%,rgba(20,24,26,.06) 75%)}
.hero.cine .hero-plate{position:relative;z-index:2;max-width:1600px;margin:0 auto;padding:clamp(72px,12vw,180px) clamp(18px,4vw,40px) clamp(56px,9vw,120px);min-height:clamp(520px,82vh,860px);display:flex;flex-direction:column;justify-content:flex-end}
.hero.cine .plate-in{max-width:760px}
.hero.cine .kicker{color:var(--accent-l)}
.hero.cine h1{color:#fff;margin:8px 0 22px}
.hero.cine .lede{color:rgba(255,255,255,.92);max-width:58ch}
.hero.cine .btn{border-color:#fff;color:#fff}
.hero.cine .btn:hover{border-color:var(--accent-l);color:var(--accent-l)}
.hero.cine .btn-solid{background:var(--accent);border-color:var(--accent);color:#fff}
.hero.cine .btn-solid:hover{background:var(--accent-l);border-color:var(--accent-l)}
.hero.cine .cap{position:relative;z-index:2;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.7);max-width:1600px;margin:0 auto;padding:0 clamp(18px,4vw,40px) 18px}
@media (max-width:760px){
  .hero.cine .scrim{background:linear-gradient(180deg,rgba(20,24,26,.18) 0%,rgba(20,24,26,.82) 70%)}
  .hero.cine .hero-plate{min-height:78vh;padding-top:48vh}
}
/* product hero: cut-out render on white, text beside */
.hero.product{background:var(--paper)}
.hero.product .wrap{display:grid;gap:clamp(24px,4vw,56px);grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));align-items:center;padding-top:clamp(48px,7vw,96px);padding-bottom:clamp(40px,6vw,72px)}
.hero.product img{width:100%;height:auto;max-height:640px;object-fit:contain}
.hero.product h1{margin:8px 0 18px}

/* ---------- ribbon: the status line, one per page ---------- */
.ribbon{background:var(--paper);border-top:3px solid var(--accent);border-bottom:1px solid var(--line)}
.ribbon .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;padding-top:14px;padding-bottom:14px}
.ribbon .lbl{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);padding-right:14px;border-right:2px solid var(--accent)}
.ribbon .txt{font-family:var(--sans);font-size:15px;font-weight:600;color:var(--ink)}
.ribbon .txt b{color:var(--accent)}
.ribbon a{color:var(--graphite);font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;margin-left:auto}
.ribbon a:hover{color:var(--accent)}

/* ---------- proof module: a real, dated fact ---------- */
.proof{border-top:3px solid var(--accent);padding-top:18px}
.proof .big{font-family:var(--disp);font-weight:700;font-size:clamp(32px,2.2vw + 18px,60px);line-height:.98;text-transform:uppercase;color:var(--ink)}
.proof .src{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:10px}
.proof p{font-size:16px;color:var(--graphite);margin-top:12px}
.sec.dark .proof .big{color:#fff}.sec.dark .proof .src{color:rgba(255,255,255,.6)}

/* ---------- timeline: real dates only ---------- */
.timeline{list-style:none;padding:0;margin:0;border-left:2px solid var(--line)}
.timeline .tl{position:relative;padding:0 0 30px 32px}
.timeline .tl::before{content:"";position:absolute;left:-7px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--paper);border:2px solid var(--accent)}
.timeline .tl.now::before{background:var(--accent)}
.timeline .tl-date{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:6px}
.timeline .tl-h{font-family:var(--disp);font-weight:700;font-size:clamp(20px,1.2vw + 14px,28px);text-transform:uppercase;line-height:1.05;color:var(--ink);margin-bottom:6px}
.timeline .tl-p{font-size:16px;color:var(--graphite);max-width:62ch}
.sec.dark .timeline{border-left-color:rgba(255,255,255,.22)}
.sec.dark .timeline .tl::before{background:var(--ink)}
.sec.dark .timeline .tl-h{color:#fff}.sec.dark .timeline .tl-p{color:rgba(255,255,255,.82)}

/* ---------- CTA tiers ---------- */
.btn-text{border:0;padding:0;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);text-decoration:none}
.btn-text::after{content:" \2192"}
.btn-text:hover{color:var(--accent-l)}
.cta-band .btn:not(.btn-solid){border-color:var(--graphite);color:var(--graphite)}

/* ---------- responsive pictures ---------- */
picture{display:block}
figure.ph picture img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r);background:var(--silver)}
figure.ph.tall picture img{aspect-ratio:4/3}
figure.ph.wide picture img{aspect-ratio:21/9}
figure.ph.natural picture img{aspect-ratio:auto;object-fit:contain;background:var(--paper)}
.gallery figure.ph picture img{aspect-ratio:3/2}

/* ---------- compact sticky header ---------- */
.hdr{transition:box-shadow .2s}
.hdr-in{transition:min-height .2s}
html.scrolled .hdr{box-shadow:0 6px 24px rgba(20,24,26,.08)}
html.scrolled .hdr-in{min-height:54px}
html.scrolled .brand img{height:56px}
html.scrolled .brand .tag{display:none}
.brand img{transition:height .2s}

/* ---------- comparison module (what changed) ---------- */
.compare{display:grid;gap:clamp(14px,2vw,24px);grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.compare .col{border:1px solid var(--line);border-radius:var(--r);padding:clamp(18px,2.2vw,26px);background:var(--paper)}
.compare .col.now{border-top:3px solid var(--accent)}
.compare .col .k{display:block;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--graphite);margin-bottom:10px}
.compare .col.now .k{color:var(--accent)}
.compare .col h3{margin-bottom:10px}
.compare .col p,.compare .col li{font-size:15.5px;color:var(--graphite)}

/* ---------- footer capture and legal ---------- */
.ftr .cap-form{display:flex;gap:8px;margin-top:10px}
.ftr .cap-form input{flex:1 1 auto;min-width:0;font:inherit;font-size:14px;padding:9px 11px;border:1px solid #C9D1CC;border-radius:var(--r);background:var(--paper)}
.ftr .cap-form button{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:9px 12px;border:2px solid var(--accent);background:var(--accent);color:#fff;border-radius:var(--r);cursor:pointer}
.ftr .cap-form button:hover{background:var(--accent-l);border-color:var(--accent-l)}
.ftr .cap-note{font-size:13px;color:var(--muted);margin-top:8px}
.ftr .legal p{max-width:none}

/* ---------- breadcrumb ---------- */
.crumb{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
.crumb a{color:var(--graphite);text-decoration:none}
.crumb a:hover{color:var(--accent)}
.crumb .sep{padding:0 8px;color:var(--accent)}

/* ---------- accessibility: touch targets in the mobile menu ---------- */
@media (max-width:1280px){nav.site a,nav.site .grp-t{padding:14px 8px}nav.site .grp-m a{padding:12px 10px}}
@media (max-width:480px){.ftr .top{grid-template-columns:1fr}}
@media (max-width:1600px){.brand .tag{display:none}}
@media (max-width:1440px){nav.site a,nav.site .grp-t{padding:11px 7px;font-size:11px;letter-spacing:.05em}}
.rows-3{grid-template-columns:repeat(3,1fr)}
@media (max-width:760px){.rows-3{grid-template-columns:1fr}}
h2 + ol.prin, .sec-head + ol.prin{margin-top:clamp(24px,3.5vw,44px)}

/* ---------- R2.9 · engineering-drawing watermarks (line art from the R0.6 model; ink on white, multiplied onto the skin) ---------- */
.wm{position:relative;overflow:hidden}
.wm>.wrap{position:relative;z-index:1}
.wm::before{content:"";position:absolute;inset:0;pointer-events:none;background-repeat:no-repeat;background-size:auto 118%;background-position:right -6% center;mix-blend-mode:multiply;opacity:.12}
.wm.wm-sweep::before{background-image:url("../img/wm-machine-sweep-1400.webp")}
.wm.wm-plan::before{background-image:url("../img/wm-machine-plan-1400.webp");background-position:left -8% center;background-size:auto 124%}
.wm.wm-pedal::before{background-image:url("../img/wm-pedal-pod-1400.webp");background-size:auto 132%;background-position:right -4% center}
.wm.wm-joystick::before{background-image:url("../img/wm-joystick-pod-1400.webp");background-size:auto 126%;background-position:right -2% center;opacity:.10}
.cta-band.wm::before{opacity:.16}
.ftr.wm::before{background-image:url("../img/wm-joystick-pod-1400.webp");background-size:auto 122%;background-position:right -4% top;opacity:.08}
.ftr.wm>.wrap{position:relative;z-index:1}
@media (max-width:760px){.wm::before{background-size:auto 72%;opacity:.08}}

/* ---------- R2.11 · cold-eyes review 2026-09-05 ---------- */
@media (max-width:1280px){.brand img,html.scrolled .brand img{height:44px}}
@media (max-width:480px){.brand img,html.scrolled .brand img{height:38px}.hdr-in{gap:10px}}
.hero.cine .kicker,.sec.photo .kicker{color:#fff;opacity:.94}
.hero.cine .kicker::before,.sec.photo .kicker::before{content:"";display:inline-block;width:18px;height:2px;background:var(--accent-l);vertical-align:middle;margin:0 10px 2px 0}

/* ---------- R2.12 · cold-eyes review, pass 2 · 2026-09-05 ---------- */
.sec.photo .cap{text-shadow:0 1px 2px rgba(0,0,0,.6)}
.sec.photo h2,.sec.photo p{text-shadow:0 1px 3px rgba(0,0,0,.35)}
.wm::before{-webkit-mask-image:radial-gradient(ellipse 78% 88% at 50% 50%,#000 42%,transparent 100%);mask-image:radial-gradient(ellipse 78% 88% at 50% 50%,#000 42%,transparent 100%)}
.facts{grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}
.choose .card:last-child{border-top:3px solid var(--accent)}
.grid.g3 .card figure.ph figcaption{min-height:32px}
@media (max-width:760px){.tbl-wrap::before{content:"Swipe sideways for the whole table";display:block;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:10px 14px 0}}
.ftr .wrap.top{padding-left:clamp(18px,4vw,28px);padding-right:clamp(18px,4vw,28px)}
h1,h2,h3{text-wrap:balance}
.hero.cine .btn:not(.btn-solid){background:rgba(20,24,26,.32)}

/* ---------- R2.13 · motion · 2026-09-05 ---------- */
@media (prefers-reduced-motion:no-preference){
  /* photograph heroes pan gently; render heroes (STE 5.0, Models, How it works, AI, Foreman, Enquiries, Safety) stay still for sharpness */
  body[data-page="home"] .hero.cine .hero-media.motion-pan img,body[data-page="programs"] .hero.cine .hero-media.motion-pan img,body[data-page="industrial"] .hero.cine .hero-media.motion-pan img,body[data-page="civil"] .hero.cine .hero-media.motion-pan img,body[data-page="agricultural"] .hero.cine .hero-media.motion-pan img,body[data-page="company"] .hero.cine .hero-media.motion-pan img,body[data-page="careers"] .hero.cine .hero-media.motion-pan img,body[data-page="machines"] .hero.cine .hero-media.motion-pan img,body[data-page="sectors"] .hero.cine .hero-media.motion-pan img{animation:ste-kb 28s cubic-bezier(.4,0,.6,1) infinite alternate both;transform-origin:56% 44%;will-change:transform}
  @keyframes ste-kb{from{transform:scale(1.0)}to{transform:scale(1.045)}}
  /* photo bands drift as they scroll through the viewport, where the browser can drive an animation from scroll */
  @supports (animation-timeline:view()){
    .sec.photo picture img,.sec.photo>img{animation:ste-band linear both;animation-timeline:view();animation-range:entry 0% exit 100%;will-change:transform}
    @keyframes ste-band{from{transform:scale(1.10) translateY(-4%)}to{transform:scale(1.0) translateY(4%)}}
  }
  /* section kickers: the red bar draws in when the block reveals */
  .sec-head .kicker::before,.txt>.kicker::before{content:"";display:inline-block;width:18px;height:2px;background:var(--accent);vertical-align:middle;margin:0 10px 2px 0;transform-origin:left center;transition:transform .55s cubic-bezier(.2,.7,.2,1) .12s}
  html.rv-armed .rv:not(.in) .kicker::before{transform:scaleX(0)}
  /* the perception overlay draws its boxes as the section reveals */
  .see .bx{stroke-dasharray:2700;stroke-dashoffset:2700}
  html:not(.rv-armed) .see .bx,html.rv-armed .see.in .bx{animation:ste-draw 1.5s cubic-bezier(.2,.7,.2,1) forwards}
  .see .bx:nth-of-type(2){animation-delay:.15s}.see .bx:nth-of-type(3){animation-delay:.3s}.see .bx:nth-of-type(4){animation-delay:.45s}
  @keyframes ste-draw{to{stroke-dashoffset:0}}
  /* images inside revealing blocks fade up */
  html.rv-armed .rv img{opacity:0;transition:opacity .9s ease .1s}
  html.rv-armed .rv.in img{opacity:1}
  /* link cards lift; buttons and text links move a little */
  a.card{transition:transform .22s ease,box-shadow .22s ease,border-color .22s}
  a.card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(20,24,26,.10)}
  .btn{transition:transform .15s ease,background .2s,color .2s,border-color .2s}
  .btn:hover{transform:translateY(-1px)}
  .btn-text::after{display:inline-block;transition:transform .2s ease}
  .btn-text:hover::after{transform:translateX(4px)}
  table.tbl tbody tr{transition:background .15s}
  table.tbl tbody tr:hover{background:rgba(200,16,46,.035)}
  .brand img{transition:height .2s,transform .2s}
  .brand:hover img{transform:translateY(-1px)}
}

/* ---------- R2.14 · hero video (owner: "make this hero more? rotate, dig, walk?") ---------- */
.hero.cine .hero-video{display:none}
@media (prefers-reduced-motion:no-preference){
  .hero.cine .hero-video{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 55%;z-index:1;pointer-events:none}
  .hero.cine .hero-video+.scrim{z-index:1}
}

/* downloads (product sheets, 2026-09-05) */
.hero .dl{margin-top:16px}
.hero.cine .dl .btn-text{color:#fff}
.hero.cine .dl .btn-text:hover{color:var(--accent-l)}
.dl-list li{margin-bottom:10px}

/* ---------- R2.15 · one-row header ---------- */
nav.site{flex-wrap:nowrap;white-space:nowrap}
nav.site a,nav.site .grp-t{font-size:12px;letter-spacing:.05em;padding:11px 8px}
nav.site .enq{padding:9px 12px}
.brand img{height:64px}
html.scrolled .brand img{height:52px}
@media (max-width:1800px){.brand .tag{display:none}nav.site a,nav.site .grp-t{font-size:11.5px;letter-spacing:.04em;padding:11px 7px}}
@media (max-width:1600px){nav.site a,nav.site .grp-t{font-size:11px;letter-spacing:.035em;padding:10px 6px}.brand img{height:58px}html.scrolled .brand img{height:50px}}
@media (max-width:1440px){nav.site a,nav.site .grp-t{font-size:10.5px;letter-spacing:.03em;padding:10px 5px}nav.site .enq{padding:8px 10px}.brand img{height:52px}html.scrolled .brand img{height:46px}}
@media (max-width:1280px){nav.site{display:none}.burger{display:inline-block}.brand img,html.scrolled .brand img{height:44px}}

/* ── R2.16 (2026-09-05) — the owner: "make this drop menu open to the left so it stays within the screen width". The Company group is the last
   drop-down before Enquiries; its panel now anchors to the group's right edge, so it grows leftwards into the bar instead of past the viewport. ── */
nav.site .grp[data-nav-group="company"] .grp-m{left:auto;right:0}
