/* ==========================================================================
   HANDOVER V2 — sitewide rules (client developer package 17 Oct 2026,
   19 Oct clarifications). Enqueued LAST (after home.css / pages.css), so at
   equal specificity these rules win. New components are namespaced .v2-* and
   .enq-* so they never collide with the legacy stylesheets.
   ========================================================================== */

/* ---------- SPACE: 1200 container, 24 / 16 gutters ---------- */
:root{--container:1200px;--gutter:16px;--v2-sec:32px;--v2-gap:16px}
@media (min-width:768px){:root{--gutter:24px;--v2-sec:48px;--v2-gap:24px}}

/* ---------- TYPE: body 16–18px, line-height 1.5–1.65, measure 55–75ch ---------- */
body{font-size:16px;line-height:1.6}
@media (min-width:1200px){body{font-size:17px}}
main p{max-width:72ch}
/* Justified body text at >=768px with a left-aligned last line. Left alignment
   below 768px, and in narrow columns (cards, captions, form help, lists of
   facts) where justification opens rivers of word spacing. */
@media (min-width:768px){
  main p{text-align:justify;text-align-last:left}
  main :is(figcaption,.eframe-cap,.field-help,.enq-notice,.enq-status,.crumb,.v2-cd,.v2-card,.v2-tag,.nj,.cta-note,.p-note,.lb-cap,.lead,.v2-lead,.v2-cert) ,
  main :is(.v2-card,.nj,.v2-cert) p{text-align:left;text-align-last:auto}
}
.v2-h1{font-size:clamp(28px,3.4vw,46px);line-height:1.1;margin-top:14px;max-width:24ch}
.v2-h2{font-size:clamp(22px,2.2vw,30px);line-height:1.18;margin-bottom:16px}
.v2-h3{font-family:var(--f-dsp);font-weight:600;font-size:clamp(18px,1.5vw,20px);line-height:1.3;margin-bottom:8px;letter-spacing:-.01em}
.v2-lead{margin-top:16px;font-size:clamp(16px,1.25vw,18px);line-height:1.6;max-width:68ch;color:var(--tx-l-dim)}

/* ---------- section + hero shells ---------- */
.v2-sec{padding-block:var(--v2-sec)}
.v2-sec + .v2-sec{padding-top:0}
.v2-sec.alt{background:var(--tint)}
.v2-sec.alt + .v2-sec, .v2-sec + .v2-sec.alt{padding-top:var(--v2-sec)}
.v2-hero{padding-top:calc(var(--hdr-h) + 24px);padding-bottom:var(--v2-sec)}
.v2-hero .crumb{margin-bottom:0}

/* ---------- MOTION: content is visible by default ----------
   The legacy reveal hid [data-fade] (and captions, accents) at opacity 0 until
   an IntersectionObserver added .in. Reveal is now transform only, so nothing
   essential is ever invisible: not without JS, not if the observer never fires,
   not in a full-page capture, not in print. */
.js [data-fade]{opacity:1}
.js .eframe-cap,.js .la-accent{opacity:1}
@media (prefers-reduced-motion:reduce){
  .js [data-fade],.js .eframe-cap,.js .la-accent{transform:none!important;transition:none!important}
}
@media print{
  *,*::before,*::after{opacity:1!important;transform:none!important;transition:none!important;animation:none!important}
  .hdr,.mnav,.navtoggle,.foot-bg{display:none!important}
  .v2-hero,.p-hero{padding-top:0!important}
}

/* ---------- FOOTER: four divisions, company links, contact, one enquiry link ---------- */
.foot-lede{align-items:center}
.foot-enq{display:inline-flex;align-items:center;min-height:44px;padding:10px 22px;border:1px solid rgba(255,255,255,.55);
  border-radius:4px;color:#fff;font-weight:600;font-size:.95rem;line-height:1.2;white-space:nowrap;transition:border-color .2s,background .2s}
.foot-enq:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.foot-enq:focus-visible{outline:2px solid var(--brand-lift);outline-offset:3px}
.foot-brand{grid-column:span 3}
.foot-col{grid-column:span 2}
.foot-col.foot-co{grid-column:span 4}
.foot-col.foot-co ul{display:grid;grid-template-columns:1fr 1fr;column-gap:24px}
.foot-col.contact{grid-column:span 3}
@media (max-width:1000px){
  .foot-brand{grid-column:span 12}
  .foot-col,.foot-col.foot-co,.foot-col.contact{grid-column:span 6}
}
@media (max-width:640px){
  .foot-col,.foot-col.foot-co,.foot-col.contact{grid-column:span 12}
  .foot-lede{grid-template-columns:1fr;gap:20px}
  .foot-enq{justify-self:start}
}

/* ---------- THE ENQUIRY FORM (/contact-us/#enquiry) ---------- */
.v2-contact-grid{display:grid;gap:40px}
@media (min-width:960px){.v2-contact-grid{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:64px;align-items:start}}
.enq-form{display:grid;gap:22px}
.enq-row{display:grid;gap:22px}
@media (min-width:640px){.enq-row{grid-template-columns:1fr 1fr;gap:28px}}
.enq-form .field label{font-size:.8rem;letter-spacing:.06em;margin-bottom:8px;color:var(--tx-l-dim)}
.enq-form .field input,.enq-form .field select,.enq-form .field textarea{font-size:1rem;padding:10px 0;min-height:44px}
.enq-form .field select{appearance:auto;background:transparent}
.enq-form .field textarea{min-height:140px}
.enq-form input[type=file]{border:1px dashed var(--hair-l);border-radius:4px;padding:10px;min-height:48px;font-size:.92rem}
.enq-form :is(input,select,textarea):focus-visible{outline:2px solid var(--brand-graphic);outline-offset:2px}
.enq-form [aria-invalid=true]{border-bottom-color:#9B1C1C!important}
.field-help{display:block;margin-top:8px;font-size:.875rem;line-height:1.45;color:var(--tx-l-dim)}
.enq-notice{font-size:.9rem;line-height:1.5;color:var(--tx-l-dim);margin:0}
.enq-notice a{color:var(--brand-ink);text-decoration:underline;text-underline-offset:2px}
.enq-submit{justify-self:start;border:0;cursor:pointer;min-height:48px}
.enq-submit[disabled]{opacity:.7;cursor:progress}
.enq-status{margin:0;padding:14px 16px;border-radius:4px;font-size:.95rem;line-height:1.5;max-width:none}
.enq-status.ok{background:#E8F3EC;color:#03542D}
.enq-status.err{background:#FBECEC;color:#9B1C1C}
.v2-cd{list-style:none;margin:0;padding:0;display:grid;gap:20px}
.v2-cd li{display:grid;gap:4px}
.v2-cd-k{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--tx-l-dim)}
.v2-cd a{color:var(--brand-ink);font-weight:600;font-size:1.05rem;display:inline-block;padding-block:4px}
.v2-cd address{font-style:normal;line-height:1.55}

/* ---------- the ONE division enquiry block (end of each division page) ----------
   A tinted panel inside a white section, so it never merges with a tinted section
   above it. */
.v2-sec.v2-enq{padding-block:var(--v2-sec);background:var(--white)}
.v2-sec.alt + .v2-sec.v2-enq{padding-top:var(--v2-sec)}
.v2-enq-in{display:grid;gap:20px;align-items:center}
.v2-enq .v2-enq-in > *{min-width:0}
.v2-enq .wrap.v2-enq-in{background:var(--tint);border-radius:6px;padding:28px var(--gutter)}
@media (min-width:768px){.v2-enq .wrap.v2-enq-in{padding:36px 40px;max-width:calc(var(--container) - 2 * var(--gutter))}}
.v2-enq-in p{margin:0}
.v2-enq .v2-h2{margin-bottom:8px}
@media (min-width:900px){.v2-enq-in{grid-template-columns:minmax(0,1fr) auto;gap:48px}}
.v2-hero + .v2-sec{padding-top:0}

/* ==========================================================================
   PHASE 2+ components
   ========================================================================== */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.v2-head{max-width:72ch}
.v2-head + *{margin-top:20px}
.v2-head p{margin:0}
.v2-head .v2-h2:last-child{margin-bottom:0}
.v2-stack{display:grid;gap:22px;margin-top:20px}
.v2-stack p{margin:0}
/* text + figure, side by side from 900px; flip puts the figure first */
.v2-split{display:grid;gap:28px;align-items:center}
@media (min-width:900px){
  .v2-split{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:56px}
  .v2-split.flip > :first-child{order:2}
}
/* two equal text columns */
.v2-two{display:grid;gap:32px;align-items:start}
@media (min-width:900px){.v2-two{grid-template-columns:1fr 1fr;gap:56px}}
.v2-two > * > .v2-fig{margin-top:24px}

/* cards — fixed column counts, never auto-fill (orphan rule) */
.v2-cards{display:grid;gap:var(--v2-gap);grid-template-columns:1fr}
@media (min-width:640px){.v2-cards.c2,.v2-cards.c3,.v2-cards.c4{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){.v2-cards.c3{grid-template-columns:repeat(3,1fr)}.v2-cards.c4{grid-template-columns:repeat(4,1fr)}}
.v2-card{background:var(--tint);border-radius:6px;overflow:hidden;display:flex;flex-direction:column}
.v2-sec.alt .v2-card{background:var(--white)}
.v2-card-b{padding:20px 22px 22px}
.v2-card-b p{margin:0}
.v2-card .v2-fig{margin:0}
.v2-card .v2-fig figcaption{display:none}   /* the card title names the image */
.v2-card .v2-frame{border-radius:0;border:0}

/* figures: uniform 4:3 frame; cover or contain decided per image */
.v2-fig{margin:0;width:100%;max-width:var(--nw,100%)}
.v2-split > .v2-fig{justify-self:center;max-width:min(var(--nw),480px)}
.v2-frame{display:block;position:relative;border-radius:6px;overflow:hidden;background:#fff;border:1px solid rgba(12,13,15,.08)}
.v2-fig-43 .v2-frame{aspect-ratio:4/3}
.v2-fig-43 img{position:absolute;inset:0;width:100%;height:100%}
.v2-fig.fit-cover img{object-fit:cover}
.v2-fig.fit-contain .v2-frame{display:flex;align-items:center;justify-content:center;padding:4%}
/* a contained image is never drawn above its own pixels: no upscaling */
.v2-fig-43.fit-contain img{position:static;width:auto;height:auto;max-width:min(100%,var(--nw));max-height:100%;object-fit:contain}
.v2-fig.fit-contain .v2-frame{background:var(--fbg,#fff)}
.v2-fig-nat .v2-frame{aspect-ratio:auto}
.v2-fig-nat img{display:block;width:100%;height:auto}
.v2-fig-nat{margin-top:24px;margin-inline:auto}
.v2-fig figcaption{margin-top:10px;font-size:.875rem;line-height:1.45;color:var(--tx-l-dim)}
.v2-figrow{display:grid;gap:var(--v2-gap);margin-top:24px;grid-template-columns:1fr}
@media (min-width:640px){.v2-figrow.c2,.v2-figrow.c4{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){.v2-figrow.c4{grid-template-columns:repeat(4,1fr)}}
.v2-figrow .v2-fig.fit-contain{max-width:none}
.v2-figrow .v2-fig.fit-cover{justify-self:center}

/* compact labels */
.v2-tags{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.v2-head + .v2-tags{margin-top:20px}
.v2-tag{padding:8px 14px;border:1px solid var(--hair-l);border-radius:999px;font-size:.95rem;line-height:1.3;background:var(--white)}
.v2-sec:not(.alt) .v2-tag{background:var(--tint);border-color:transparent}

/* certificate */
.v2-cert{display:grid;gap:24px;align-items:start}
@media (min-width:640px){.v2-cert{grid-template-columns:minmax(0,1fr) 150px}}
.v2-cert-thumb{display:block;border:1px solid var(--hair-l);border-radius:4px;overflow:hidden;max-width:180px}
.v2-cert-thumb img{display:block;width:100%;height:auto}
.v2-link{display:inline-block;margin-top:14px;padding-block:10px;color:var(--brand-ink);font-weight:600;text-decoration:underline;text-underline-offset:3px}
#warranty,#quality,#components,#tool-range,#technology{scroll-margin-top:calc(var(--hdr-h) + 16px)}

/* download */
.v2-dl{display:inline-grid;gap:2px;margin-top:24px;padding:14px 20px;border:1.5px solid var(--brand-ink);border-radius:4px;color:var(--brand-ink);min-height:48px}
.v2-dl:hover{background:rgba(4,105,56,.06)}
.v2-dl-t{font-weight:600}
.v2-dl-m{font-size:.85rem;color:var(--tx-l-dim)}

/* technology partners (Automation only) */
.v2-partners{display:grid;gap:28px;margin-top:28px}
@media (min-width:900px){.v2-partners{grid-template-columns:1fr 1fr;gap:28px 48px}}
.v2-pg-h{font-family:var(--f-body);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--brand-ink);font-weight:600;margin:0 0 12px}
.v2-pl{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.v2-pl li{display:grid;grid-template-columns:200px minmax(0,1fr);gap:18px;align-items:center;background:var(--white);border-radius:6px;padding:14px 18px;min-height:72px}
.v2-pl-logo{display:flex;align-items:center;justify-content:center;height:36px}
.v2-pl-logo img{max-height:36px;max-width:100%;width:auto;height:auto}
.v2-pl-d{font-size:.95rem;line-height:1.4}
@media (max-width:420px){.v2-pl li{grid-template-columns:110px minmax(0,1fr);gap:14px}}

/* awards */
.v2-awards{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:10px}
.v2-awards li{display:flex;gap:14px;align-items:baseline}
.v2-awards b{font-family:var(--f-dsp);color:var(--brand-ink);min-width:3.2em}

/* division hero: the bleed hero keeps its animated model; tighten its height */
.p-hero-bleed .p-hero-copy h1{max-width:20ch}

/* single-paragraph sections: heading left, text right, so the row is filled */
@media (min-width:900px){
  .v2-rowsec .v2-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:56px;max-width:none;align-items:start}
  .v2-rowsec .v2-head .v2-h2{margin:0}
}
.v2-fig-nat.narrow{max-width:min(var(--nw),860px)}

/* ==========================================================================
   PHASE 3 components
   ========================================================================== */
/* Home hero: two small facts and four equal image tiles */
.v2-facts{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 24px;font-size:.92rem;color:var(--tx-l-dim)}
.v2-facts li{display:flex;align-items:center;gap:8px}
.v2-facts li::before{content:"";width:6px;height:6px;background:var(--brand);border-radius:1px}
.v2-tiles{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:var(--v2-gap);grid-template-columns:1fr 1fr}
@media (min-width:1000px){.v2-tiles{grid-template-columns:repeat(4,1fr)}}
.v2-tiles a{display:block;color:inherit}
.v2-tiles .v2-fig{max-width:none}
.v2-tile-n{display:block;margin-top:10px;font-weight:600;font-size:.98rem;line-height:1.3}
.v2-tiles a:hover .v2-tile-n,.v2-tiles a:focus-visible .v2-tile-n{color:var(--brand-ink);text-decoration:underline;text-underline-offset:3px}
.v2-tags-link{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.v2-tags-link a.v2-tag{display:inline-flex;align-items:center;min-height:44px;color:var(--tx-l)}
.v2-tags-link a.v2-tag:hover{border-color:var(--brand-ink);color:var(--brand-ink)}
.v2-sub{margin-top:32px}
.v2-card-b .v2-link{margin-top:10px}
.v2-card .v2-h3 a{color:inherit}
.v2-card .v2-h3 a:hover{color:var(--brand-ink);text-decoration:underline;text-underline-offset:3px}

/* About: regional presence + approach steps */
.v2-dl-list{margin:20px 0 0;display:grid;gap:14px}
.v2-dl-list > div{display:grid;gap:2px}
.v2-dl-list dt{font-weight:600}
.v2-dl-list dd{margin:0;color:var(--tx-l-dim)}
.v2-steps{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:var(--v2-gap);counter-reset:st;grid-template-columns:1fr}
@media (min-width:640px){.v2-steps{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){.v2-steps{grid-template-columns:repeat(4,1fr)}}
.v2-steps li{counter-increment:st;background:var(--white);border-radius:6px;padding:20px 22px}
.v2-steps li::before{content:counter(st,decimal-leading-zero);display:block;font-family:var(--f-dsp);font-weight:600;color:var(--brand-ink);margin-bottom:8px}
.v2-steps p{margin:0;text-align:left}

/* Gallery */
.v2-filter{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px}
.v2-filter .cat-btn{min-height:44px;padding:10px 18px;border:1px solid var(--hair-l);border-radius:999px;background:var(--white);font:inherit;font-size:.95rem;cursor:pointer;color:var(--tx-l)}
.v2-filter .cat-btn.on,.v2-filter .cat-btn[aria-pressed=true]{background:var(--brand-ink);border-color:var(--brand-ink);color:#fff}
.v2-filter .cat-btn:focus-visible{outline:2px solid var(--brand-graphic);outline-offset:2px}
.v2-gallery{list-style:none;margin:0;padding:0;display:grid;gap:var(--v2-gap);grid-template-columns:1fr 1fr}
@media (min-width:1000px){.v2-gallery{grid-template-columns:repeat(4,1fr)}}
.v2-gallery li[hidden]{display:none}
.v2-gallery .gal-item{display:block;width:100%;padding:0;border:0;background:none;text-align:left;cursor:zoom-in;font:inherit;color:inherit}
.v2-gallery .gal-item:focus-visible{outline:2px solid var(--brand-graphic);outline-offset:3px;border-radius:6px}
.v2-gallery .v2-fig{max-width:none}

/* FAQ — native details/summary */
.v2-faq{display:grid;gap:12px;max-width:880px}
.v2-q{background:var(--tint);border-radius:6px}
.v2-q summary{list-style:none;cursor:pointer;padding:18px 52px 18px 22px;position:relative;min-height:44px}
.v2-q summary::-webkit-details-marker{display:none}
.v2-q summary::after{content:"+";position:absolute;right:22px;top:50%;transform:translateY(-50%);font-size:1.4rem;line-height:1;color:var(--brand-ink)}
.v2-q[open] summary::after{content:"\2212"}
.v2-q summary:focus-visible{outline:2px solid var(--brand-graphic);outline-offset:2px;border-radius:6px}
.v2-q-h{font-family:var(--f-dsp);font-weight:600;font-size:clamp(17px,1.4vw,19px);line-height:1.35;margin:0}
.v2-q-a{padding:0 22px 20px}
.v2-q-a p{margin:0}
@media print{.v2-q > :not(summary){display:block!important}}

/* Blog listing + article */
.v2-kicker{display:block;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--brand-ink);font-weight:600;margin-bottom:8px}
.v2-hero .v2-kicker{margin-top:16px;margin-bottom:0}
.v2-date{margin-top:12px;color:var(--tx-l-dim);font-size:.92rem}
.v2-article{max-width:72ch}
.v2-article p{margin:0 0 16px}
.v2-article h2{font-size:clamp(20px,1.9vw,26px);line-height:1.25;margin:28px 0 12px}
.v2-article-div{margin-top:12px}
.v2-related{list-style:none;margin:20px 0 16px;padding:0;display:grid;gap:4px}
.v2-related a{display:inline-block;padding-block:8px;color:var(--brand-ink);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* fix: a tinted section directly after a hero keeps its top padding (the zeroing
   rule above is only for two WHITE sections in a row) */
.v2-hero + .v2-sec.alt{padding-top:var(--v2-sec)}
/* justified text: allow conservative hyphenation so half-width columns do not open
   rivers; below 1100px, half-width columns are narrow and go left-aligned */
/* REVISED after the 768/1024 sweep: automatic hyphenation split words mid-line
   ("manufac-turing"), which the client has rejected before. No hyphenation. Text in
   half-width columns (splits, two-up, cards) is a narrow column in the handover's
   sense and stays left-aligned at every width; full-width text is justified. */
main p{hyphens:manual;-webkit-hyphens:manual}
main :is(.v2-split,.v2-two,.v2-cert,.mcard,.svc,.pv-a,.pseq,.p-steps,.vbleed,.p-gallery) p{text-align:left;text-align-last:auto}
@media (prefers-reduced-motion:reduce){.hdr{transition:none!important}}

/* Phase 4 sweep fixes */
@media (min-width:960px){.v2-contact-details{position:sticky;top:calc(var(--hdr-h) + 24px)}}
@media (min-width:900px){.v2-cert{grid-template-columns:minmax(0,1fr) 220px;gap:56px}.v2-cert-thumb{max-width:220px}}
.v2-cert .v2-head{max-width:72ch}

/* 19 Oct fix round — natural-shape frames for contained images: the picture fills
   its frame edge to edge; nothing sits small inside a larger box. */
.v2-fig.fit-contain .v2-frame{padding:0;display:block;background:transparent}
.v2-fig-nat.fit-contain img{position:static;display:block;width:100%;height:auto;max-width:none;padding:0}
.v2-card .v2-fig-nat{margin:0;max-width:none}
.v2-card .v2-fig-nat .v2-frame{border-bottom:1px solid rgba(12,13,15,.06)}
.v2-figrow .v2-fig-nat,.v2-gallery .v2-fig-nat{margin-top:0}
.v2-figrow,.v2-gallery,.v2-tiles{align-items:start}
.v2-split > .v2-fig-nat{margin-top:0}
.v2-pl li.logo-only{grid-template-columns:1fr;justify-items:center}
.v2-pl li.logo-only .v2-pl-logo{width:200px}
@media (min-width:640px){
  .v2-figrow.eqh{display:flex;flex-wrap:wrap;gap:var(--v2-gap)}
  .v2-figrow.eqh .v2-fig{flex:0 1 auto;width:calc(var(--ar) * 244px);max-width:100%}
}

/* ==========================================================================
   VISUAL RESTORE (19 Oct) — frames sized for the layout
   ========================================================================== */
.v2-fig,.v2-split > .v2-fig,.v2-figrow .v2-fig,.v2-gallery .v2-fig,.v2-card .v2-fig{max-width:none}
.v2-split > .v2-fig{justify-self:stretch}
.v2-fig-43.fit-contain .v2-frame{display:block;padding:0;background:var(--fbg,#fff)}
.v2-fig-43.fit-contain img{position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;padding:0;object-fit:contain}
.v2-fig-nat{max-width:none}
.v2-fig-nat.narrow{max-width:860px}
/* Home hero (restored): tiles and facts on the dark ground */
.v2-hero-f .hero-f-in h1{max-width:20ch;font-size:clamp(32px,4.4vw,60px);line-height:1.06}
.v2-hero-f .hero-f-in .lead{text-align:left}
.v2-facts-dark{color:#C6CBCF}
.v2-facts-dark li::before{background:var(--brand-lift)}
.v2-tiles-dark{margin-top:clamp(24px,3vw,40px)}
.v2-tiles-dark .v2-frame{border-color:rgba(255,255,255,.12)}
.v2-tiles-dark .v2-tile-n{color:#fff}
.v2-tiles-dark a:hover .v2-tile-n,.v2-tiles-dark a:focus-visible .v2-tile-n{color:var(--brand-lift)}
.v2-hero-f{min-height:0;justify-content:flex-start}
.v2-hero-f .hero-f-in{padding-block:clamp(56px,7vw,96px) clamp(36px,4vw,56px)}
/* (Home industries grid override removed 19 Oct addendum: the original accordion is restored.) */
/* Gallery restored to large tiles: three per row on desktop */
@media (min-width:1000px){.v2-gallery{grid-template-columns:repeat(3,1fr);gap:24px}}
.v2-figrow.c3{grid-template-columns:1fr}
@media (min-width:640px){.v2-figrow.c3{grid-template-columns:repeat(3,1fr)}}
.v2-two > div > .v2-fig{margin-top:24px}
/* drawing accent above v2 headings: draws on when the heading reveals */
.v2-head .la-accent{margin-bottom:8px}
.v2-head.in .la-accent path{stroke-dashoffset:0;transition:stroke-dashoffset .9s var(--ease)}
.js .v2-head .la-accent{opacity:1}
@media (prefers-reduced-motion:reduce){.js .v2-head .la-accent path{stroke-dashoffset:0;transition:none}}
@media print{.v2-head .la-accent path{stroke-dashoffset:0}}
/* explorer: the panel caption carries the handover group copy, so it reads as text */
.pv-a .pv-a-panel .eframe-cap{font-family:var(--f-body);text-transform:none;letter-spacing:0;font-size:1rem;line-height:1.55;color:var(--tx-l);max-width:62ch;margin-top:14px}
.pv-a .pv-a-panel .eframe-cap::before{display:none}
/* explorer: non-active panels hidden only when scripting runs (no layout shift); no-JS shows all */
.js .pv-a-panel:not(.on){display:none}
.pv-a-panel + .pv-a-panel{margin-top:24px}
.js .pv-a-panel + .pv-a-panel{margin-top:0}
/* Gear deck (restored): on mobile and under reduced motion the four division cards
   STACK vertically, every card readable (19 Oct addendum). */
@media (max-width:999px){
  .mech .mech-deck{display:block;overflow:visible;margin-inline:0;padding-inline:0}
  .mech .mcard,.mech .mcard + .mcard{flex:none;width:auto}
  .mech .mcard + .mcard{margin-top:16px}
}
@media (prefers-reduced-motion:reduce){
  .js .mech .mech-deck{display:block}
  .js .mech .mcard{grid-area:auto;transform:none!important;box-shadow:none}
  .js .mech .mcard + .mcard{margin-top:20px}
}
.p-hero-bleed,.v2-hero-f{overflow:hidden}
/* pinned gear stage fills the viewport, so no page ground shows beneath it */
@media (min-width:1000px){.js .mech{min-height:100vh;background:var(--white)}.js .mech .mech-stage{min-height:100vh}}
@media (min-width:1000px) and (prefers-reduced-motion:reduce){.js .mech,.js .mech .mech-stage{min-height:0}}

/* ==== 19 Oct polish ==== */
/* Industries accordion: collapsed tiles carry a VERTICAL label (reads bottom-up), so
   no label is ever truncated; the expanded (hovered / focused) tile turns it level. */
@media (hover:hover) and (pointer:fine) and (min-width:1000px){
  .inds-e .inds-tile h3,.inds-e .inds-tile:first-child h3{writing-mode:vertical-rl;transform:rotate(180deg);
    left:14px;right:auto;top:16px;bottom:16px;max-height:calc(100% - 32px);font-size:clamp(.95rem,1.05vw,1.1rem);
    line-height:1.15;white-space:normal;overflow:visible;text-overflow:clip;hyphens:manual;transition:none}
  .inds-e .inds-tile:hover h3,.inds-e .inds-tile:focus-visible h3{writing-mode:horizontal-tb;transform:none;
    top:auto;right:16px;bottom:18px;max-height:none;font-size:clamp(1.05rem,1.3vw,1.3rem)}
}
/* Bearings explorer: the active group's description sits under its tab (no void) */
.pv-a-desc-list .pv-a-panel .eframe-cap{display:none}
.pv-a-desc{margin:6px 0 14px 22px;font-size:1rem;line-height:1.55;color:var(--tx-l-dim);max-width:44ch}
/* all three descriptions stay visible under their tabs (the active one in full
   colour), so the list column carries content to match the photograph's height */
.pv-a-desc-list .pv-a-list li:not(:has(.pv-a-item.on)) .pv-a-desc{color:var(--tx-l-dim);opacity:.85}
.pv-a-desc-list .pv-a-list li:has(.pv-a-item.on) .pv-a-desc{color:var(--tx-l)}
@media (min-width:900px){
  .pv-a-desc-list .pv-a-grid{grid-template-columns:1fr 1fr;align-items:center}
  .pv-a-desc-list .pv-a-stage{position:static;align-self:center}
}
/* Home gear deck: contained images sit whole on a white ground (no crop, no dark plate) */
.mech .mcard-shot.fit-contain{background:#fff}
.mech .mcard-shot.fit-contain::before{display:none}
.mech .mcard-shot.fit-contain img{object-fit:contain;padding:4%}

/* Our Customers (client instruction, 20 Oct): one uniform logo height, even spacing,
   centred rows on the page's white ground; transparent marks, no panel. */
.v2-customers{background:var(--white)}
.v2-logos{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:36px 56px}
.v2-logo{display:flex;align-items:center;justify-content:center;height:44px}
.v2-logo img{height:40px;width:auto;max-width:none;display:block}
@media (max-width:1100px){.v2-logos{gap:32px 44px}.v2-logo{height:40px}.v2-logo img{height:36px}}
@media (max-width:640px){.v2-logos{gap:26px 32px}.v2-logo{height:34px}.v2-logo img{height:28px}}
@media (max-width:380px){.v2-logos{gap:22px 26px}.v2-logo img{height:26px}}

/* ==========================================================================
   §OCT20 — Bhavana's change list, 20 Oct (latest client word; overrides the
   handover footer CTA and the 19 Oct WhatsApp removal — handover-v2-log.md)
   ========================================================================== */
/* 1 · Header logo larger so "Falcon Group" under the mark reads. High-resolution
   lockups (432x420, from Branding/white.png). The bar grows with it; the header is
   fixed and every hero pads by --hdr-h, so nothing shifts after load. Declared AFTER
   app.css's own :root + @media tokens, so the base here would also beat app.css's
   mobile value — hence the mobile value is restated below. */
:root{--hdr-h:120px;--logo-h:104px}
@media (max-width:960px){:root{--hdr-h:96px;--logo-h:80px}}

/* 6 · Customer logos turn brand green on hover and keyboard focus. The green copy is
   a CSS mask of the same file, cross-faded over the resting mark. */
.v2-logo{position:relative;border-radius:4px;outline:none}
.v2-logo-box{position:relative;display:block;line-height:0}
.v2-logo-box img{transition:opacity .35s var(--ease)}
.v2-logo-ink{position:absolute;inset:0;background:var(--brand);opacity:0;pointer-events:none;
  -webkit-mask:var(--logo) center/100% 100% no-repeat;mask:var(--logo) center/100% 100% no-repeat;
  transition:opacity .35s var(--ease)}
.v2-logo:hover .v2-logo-ink,.v2-logo:focus-visible .v2-logo-ink{opacity:1}
.v2-logo:hover img,.v2-logo:focus-visible img{opacity:0}
.v2-logo:focus-visible{outline:2px solid var(--brand);outline-offset:8px}
@media (prefers-reduced-motion:reduce){.v2-logo-box img,.v2-logo-ink{transition:none}}

/* 8 · Sticky WhatsApp button, every page. 56px, bottom corner, brand green with a
   white ring so it separates from dark sections. The footer carries bottom padding so
   the button never sits over the last line of the page; hidden while the mobile menu
   is open and in print. */
.v2-wa{position:fixed;right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));
  z-index:30;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;
  background:var(--brand);color:#fff;box-shadow:0 0 0 2px #fff,0 6px 18px rgba(0,0,0,.28);
  transition:transform .25s var(--ease),background-color .25s var(--ease)}
.v2-wa svg{width:28px;height:28px;display:block}
.v2-wa:hover{background:var(--brand-deep);transform:translateY(-2px)}
.v2-wa:focus-visible{outline:3px solid var(--brand-lift);outline-offset:4px}
body:has(.mnav.open) .v2-wa{display:none}
.foot{padding-bottom:104px}
@media (prefers-reduced-motion:reduce){.v2-wa{transition:none}.v2-wa:hover{transform:none}}
@media print{.v2-wa{display:none}}

/* 17 · ENCORE logo on the Cutting Tools page (vector, transparent) */
.v2-brandmark{display:block;height:40px;width:auto;max-width:100%;margin:0 0 22px}
@media (max-width:640px){.v2-brandmark{height:32px}}

/* 18 · Gallery: 47 images (and 13 / 17 / 9 / 8 per filter) never divide evenly by the
   column count, so a grid left a short last row beside empty cells. Centred flex rows
   with the SAME tile width: a partial last row sits centred, no void. */
.v2-gallery{display:flex;flex-wrap:wrap;justify-content:center}
.v2-gallery > li{flex:0 0 calc((100% - var(--v2-gap)) / 2);min-width:0}
@media (min-width:1000px){.v2-gallery > li{flex-basis:calc((100% - 48px) / 3)}}

/* Found in the 20 Oct 1024 check: `.svc-grid.c4` (four capability cards on Precision
   Machining) was never defined, so at <=1079px the generic 3-track rule left the fourth
   card alone on a second row. 4 / 2 / 2 divides four with no orphan; declared at every
   breakpoint because the generic media rules are (0,1,0) and this is (0,2,0). */
.svc-grid.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1079px){ .svc-grid.c4{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:760px){ .svc-grid.c4{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* §OCT20b — division hero photographs made clearly visible (Abhay, 20 Oct, after
   Bhavana's item 2). The photo was at .34 under a uniform dark scrim, so the new images
   barely showed. Now the photo is ~.6 and the scrim is dark ONLY on the text side:
   desktop — dark under the copy column (left), opening up behind the drawing (right);
   phone — copy spans the width, so the scrim is vertical: dark behind the text, lighter
   at the foot where the drawing stacks. Per-hero opacity tuned by eye; headline and lead
   contrast re-measured over the composited pixels (hero-aa.sh). */
.p-hero-bleed.has-model .phb-media{opacity:var(--hm-photo,.6)}
.p-hero-bleed.has-model .phb-scrim{background:
  linear-gradient(90deg,rgba(8,9,10,.94) 0%,rgba(8,9,10,.91) 46%,rgba(8,9,10,.6) 60%,
                        rgba(8,9,10,.34) 76%,rgba(8,9,10,.26) 100%)}
.p-hero-bleed.hm-machining{--hm-photo:.6}
.p-hero-bleed.hm-tool{--hm-photo:.55}   /* sparks: the brightest frame */
.p-hero-bleed.hm-bearing{--hm-photo:.6}
.p-hero-bleed.hm-automation{--hm-photo:.6}
@media (max-width:999px){
  .p-hero-bleed.has-model .phb-scrim{background:
    linear-gradient(180deg,rgba(8,9,10,.92) 0%,rgba(8,9,10,.92) 62%,rgba(8,9,10,.55) 80%,rgba(8,9,10,.3) 100%)}
}

/* §FIT — /cutting-tools/ follow-up (Bhavana, 20 Oct: "please fit this properly").
   1 · Standard Tools: the image is now her UNCROPPED square original. Below 900px it is
   a full-width square. From 900px (where the split goes two-column) the figure stretches
   to the text column's height and the photo covers it anchored centre-bottom, so the bench
   and every tool base stay and there is no empty band under the image. Measured before
   writing this: text column 550 x image column 510 at 1440 (cover trims 3.6% per side) and
   540 x 428 at 1024 (10.4% per side); her tools span 13%–87% of the frame, so nothing is
   cut at either width. */
#tool-range .v2-split > .v2-fig .v2-frame{aspect-ratio:1/1}
#tool-range .v2-split > .v2-fig img{object-position:50% 100%}
@media (min-width:900px){
  #tool-range .v2-split{align-items:stretch}
  #tool-range .v2-split > .v2-fig{display:flex;flex-direction:column;height:100%}
  #tool-range .v2-split > .v2-fig .v2-frame{aspect-ratio:auto;flex:1 1 auto;min-height:0}
}
/* 2 · Hot Tapping and Pipe Cutting: uniform 1:1 frames re-exported from her originals.
   Three across from 560px; below that two-up with the third centred (no orphan cell).
   The hover lift is a transform, so neighbours never move and nothing shifts. */
.p-gallery.sq{grid-template-columns:repeat(3,minmax(0,1fr))}
.p-gallery.sq .eframe{aspect-ratio:1/1}
@media (max-width:559px){
  .p-gallery.sq{grid-template-columns:repeat(2,minmax(0,1fr))}
  .p-gallery.sq > .eshot:last-child:nth-child(odd){grid-column:1/-1;justify-self:center;width:calc(50% - 6px)}
}
/* At <=400px "HOT-TAPPING CUTTER" wrapped in its 158px tile and dropped its caption 18px
   below "PILOT DRILLS" (measured at 360). 11px (the site's floor) at .06em keeps all three
   captions on one line, so they share a baseline. */
@media (max-width:400px){.p-gallery.sq .eframe-cap{font-size:11px;letter-spacing:.06em}}

/* §FOLLOWUP2 (20 Oct) — Bearings gallery rebuilt from the named zip (11 images): same
   large 4:3 tiles, 3 across from 1000px, 2 across below; centred flex rows so the short
   last row sits centred instead of beside an empty cell. */
.p-gallery.ctr{display:flex;flex-wrap:wrap;justify-content:center}
.p-gallery.ctr > .eshot{flex:0 0 calc((100% - var(--pg-gap,22px)) / 2);min-width:0}
.p-gallery.ctr{--pg-gap:clamp(14px,1.6vw,22px);gap:var(--pg-gap)}
@media (min-width:1000px){.p-gallery.ctr > .eshot{flex-basis:calc((100% - 2 * var(--pg-gap)) / 3)}}
@media (max-width:760px){.p-gallery.ctr{--pg-gap:12px}}