/* 2026-10-25 — Bhavana 25 Oct change list. Enqueued after v2.css. */

/* 3 · Our Customers — the logo itself turns brand green (front-page.php, #sacom-brand-ink).
   Overrides v2.css §OCT20 6: the ink layer is now an <img> with an SVG filter, so the old
   background + mask declarations are cleared. Hover, focus (incl. a tap on touch) and
   focus-visible all trigger; the outline stays keyboard-only. */
.v2-ink-defs{position:absolute;width:0;height:0;overflow:hidden}
.v2-logo .v2-logo-ink{position:absolute;inset:0;width:100%;height:100%;max-width:none;background:none;-webkit-mask:none;mask:none;
  filter:url(#sacom-brand-ink);opacity:0;pointer-events:none;transition:opacity .2s var(--ease)}
.v2-logo-box img:not(.v2-logo-ink){transition:opacity .2s var(--ease)}
.v2-logo:hover .v2-logo-ink,.v2-logo:focus .v2-logo-ink,.v2-logo:focus-visible .v2-logo-ink{opacity:1}
.v2-logo:hover img:not(.v2-logo-ink),.v2-logo:focus img:not(.v2-logo-ink),.v2-logo:focus-visible img:not(.v2-logo-ink){opacity:0}
.v2-logo{cursor:default}
@media (prefers-reduced-motion:reduce){.v2-logo .v2-logo-ink,.v2-logo-box img:not(.v2-logo-ink){transition:none}}

/* 7 · ENCORE Tool Management Systems (Cutting Tools) — a full section, the photograph whole
   at its own 16:9: no crop, no overlay. Text beside it >=900px, above it below. */
.o25-encore-in{display:grid;gap:24px;align-items:center}
@media (min-width:900px){.o25-encore-in{grid-template-columns:minmax(0,.8fr) minmax(0,1.35fr);gap:56px}}
.o25-encore-fig{margin:0}
.o25-encore-fig img{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:6px;border:1px solid rgba(12,13,15,.08)}
.o25-encore-fig figcaption{margin-top:10px;font-size:.875rem;line-height:1.45;color:var(--tx-l-dim)}

/* 8 · Automation hero arm (REF-11): ONE box at a time, so nothing can overlap. The box
   rides in from the left on the conveyor, stops under the gripper, is picked (lifted to
   the gripper), held, placed back down, and is carried away to the right, fading out at
   the end of the conveyor before the next box arrives. 5.6 s per cycle, calm easing,
   transform/opacity only. Overrides pages.css hm-pick (11 s, two boxes). Reduced motion
   keeps pages.css's rule: animation none, one box held under the gripper. */
@keyframes hm-pick1{
  0%{transform:translate(-185%,95%);opacity:0;animation-timing-function:cubic-bezier(.33,0,.25,1)}
  7%{opacity:1}
  30%{transform:translate(0,95%);animation-timing-function:cubic-bezier(.45,0,.3,1)}
  40%{transform:translate(0,0)}
  56%{transform:translate(0,0);animation-timing-function:cubic-bezier(.45,0,.3,1)}
  66%{transform:translate(0,95%);animation-timing-function:cubic-bezier(.45,0,.55,1)}
  92%{transform:translate(88%,95%);opacity:1}
  100%{transform:translate(88%,95%);opacity:0}}
.motion .hm-box{animation:hm-pick1 5.6s linear 1s infinite both}
.hm-box-b{display:none}
/* the conveyor rail moved down with the box (95% of a box height below the gripper), so the
   box clears the underside of the arm base on its way in; rail top = box bottom */
.hmodel-automation .hm-line{top:88.9%}

/* 10 · Localisation Through Industrial Collaboration (/vision-2030/) — numbered 2x2 grid,
   large display numerals in brand ink, one CTA (client-requested). Stacks below 760px. */
.o25-loc-head{max-width:760px}
.o25-loc-head .v2-h2{margin-bottom:10px}
.o25-loc-head .o25-loc-sub{font-family:var(--f-dsp);font-weight:600;font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.4;color:var(--brand-ink);margin:0 0 14px}
.o25-loc-grid{list-style:none;margin:clamp(28px,3vw,40px) 0 0;padding:0;display:grid;gap:var(--v2-gap);grid-template-columns:1fr;counter-reset:none}
@media (min-width:760px){.o25-loc-grid{grid-template-columns:1fr 1fr}}
.o25-loc-card{position:relative;background:var(--tint);border:1px solid rgba(12,13,15,.07);border-radius:6px;padding:clamp(22px,2.4vw,32px)}
.o25-loc-n{display:block;font-family:var(--f-dsp);font-weight:700;font-size:clamp(2.6rem,4.2vw,3.6rem);line-height:1;letter-spacing:-.02em;color:var(--brand-ink);margin-bottom:14px;font-variant-numeric:tabular-nums}
.o25-loc-card .v2-h3{margin:0 0 8px}
.o25-loc-card p{margin:0}
.o25-loc-cta{margin:clamp(28px,3vw,40px) 0 0}

/* 12 · About — company timeline. Dark engineering ground + the mandate's drawing field,
   brand-lift green on dark. ONE ordered list is the content; the axis is decoration.
   Desktop (>=900px): horizontal — seven equal columns, nodes on one axis, icons above,
   year + milestones below. Phones: a vertical axis on the left, same draw-in.
   Motion (assets/js/oct25.js) sets --p (0..1) and .lit per item; ONLY transform and
   opacity change, so nothing reflows (zero layout shift). The dimmed resting state exists
   only under .tl-on, which the script adds — no script, no-JS or reduced motion = static,
   fully lit. */
.o25-tl{position:relative;overflow:hidden;padding-block:calc(var(--v2-sec) * 1.4)}
.o25-tl-field{position:absolute;inset:0;pointer-events:none;color:var(--brand-lift);opacity:.10;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 25%,#000 75%,transparent);mask-image:linear-gradient(180deg,transparent,#000 25%,#000 75%,transparent)}
.o25-tl-field .la-field{position:absolute;left:-5%;top:-20%;width:110%;height:140%}
.o25-tl-field .la-field circle,.o25-tl-field .la-field path{fill:none;stroke:currentColor;stroke-width:1;vector-effect:non-scaling-stroke}
.o25-tl-field .la-field .la-fine{stroke-width:.6;opacity:.7}
.o25-tl .wrap{position:relative}
.o25-tl-head .v2-h2{color:#fff}
.o25-tl-body{position:relative;margin-top:clamp(28px,3.5vw,52px)}
.o25-tl-list{list-style:none;margin:0;padding:0;position:relative}
.o25-tl-item{position:relative}
.o25-tl-icons .o25-ico{width:30px;height:30px;color:var(--brand-lift);display:block}
.o25-tl-icons{display:flex;gap:10px}
.o25-tl-year{font-family:var(--f-dsp);font-weight:700;letter-spacing:-.03em;line-height:1;color:#fff;
  font-size:clamp(2.1rem,3vw,2.9rem);margin:0 0 10px;font-variant-numeric:tabular-nums}
.o25-tl-ms{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.o25-tl-ms li{font-size:.9rem;line-height:1.45;color:var(--tx-d-dim)}
.o25-tl-node{position:absolute;width:18px;height:18px;border-radius:50%;border:1.5px solid var(--brand-lift);background:var(--ink);z-index:2}
.o25-tl-node i{position:absolute;inset:3.5px;border-radius:50%;background:var(--brand-lift)}
.o25-tl-axis{position:absolute;pointer-events:none;z-index:1}
.o25-tl-track,.o25-tl-fill{position:absolute;inset:0;display:block}
.o25-tl-track{background:repeating-linear-gradient(90deg,rgba(255,255,255,.22) 0 1px,transparent 1px 12px);opacity:.9}
.o25-tl-fill{background:var(--brand-lift)}
.o25-tl-break{position:absolute;width:24px;height:24px;fill:none;stroke:var(--brand-lift);stroke-width:1.4;stroke-linecap:round;background:var(--ink);z-index:1}

/* horizontal */
@media (min-width:900px){
  .o25-tl-list{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:0 clamp(12px,1.6vw,24px)}
  .o25-tl-item{display:grid;grid-template-rows:44px 46px auto auto;align-content:start}
  .o25-tl-icons{grid-row:1;align-self:end}
  .o25-tl-node{top:calc(44px + 14px);left:0}
  .o25-tl-year{grid-row:3}
  .o25-tl-ms{grid-row:4}
  /* the axis runs from the first node's centre to the last node's centre */
  .o25-tl-axis{left:9px;right:calc((100% - (var(--n) - 1) * clamp(12px,1.6vw,24px)) / var(--n) - 9px);top:calc(44px + 14px + 8px);height:2px}
  .o25-tl-track{background:repeating-linear-gradient(90deg,rgba(255,255,255,.26) 0 6px,transparent 6px 10px)}
  .o25-tl-fill{transform-origin:0 50%}
  .o25-tl-break{left:calc(100% / (var(--n) - 1) / 2 - 12px);top:-11px}
}
/* vertical (phones, small tablets) */
@media (max-width:899px){
  .o25-tl-list{display:grid;gap:30px}
  .o25-tl-item{padding-left:44px;min-height:60px}
  .o25-tl-node{left:0;top:4px}
  .o25-tl-icons{margin-bottom:8px}
  .o25-tl-icons .o25-ico{width:26px;height:26px}
  .o25-tl-axis{left:8px;top:13px;bottom:0;width:2px}
  .o25-tl-track{background:repeating-linear-gradient(180deg,rgba(255,255,255,.26) 0 6px,transparent 6px 10px)}
  .o25-tl-fill{transform-origin:50% 0}
  .o25-tl-break{left:-11px;top:calc(var(--brk,60px) - 12px);transform:rotate(90deg)}
  .o25-tl-ms li{font-size:.95rem}
}
/* motion (script-armed only) */
.o25-tl.tl-on .o25-tl-fill{transform:scaleX(var(--p,0))}
@media (max-width:899px){.o25-tl.tl-on .o25-tl-fill{transform:scaleY(var(--p,0))}}
.o25-tl.tl-on .o25-tl-item > :not(.o25-tl-node){opacity:.28;transition:opacity .6s var(--ease)}
.o25-tl.tl-on .o25-tl-node i{opacity:0;transform:scale(.3);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.o25-tl.tl-on .o25-tl-item.lit > :not(.o25-tl-node){opacity:1}
.o25-tl.tl-on .o25-tl-item.lit .o25-tl-node i{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.o25-tl .o25-tl-fill{transform:none!important}.o25-tl .o25-tl-item > *{opacity:1!important}}

/* 13 · About — Falcon Group's Vision & Mission (side by side) and Values (icon grid) */
.o25-vm-grid{display:grid;gap:var(--v2-gap);margin-top:clamp(20px,2.4vw,32px)}
@media (min-width:860px){.o25-vm-grid{grid-template-columns:1fr 1fr}}
.o25-vm-card{background:var(--white);border:1px solid rgba(12,13,15,.07);border-radius:6px;padding:clamp(22px,2.6vw,36px)}
.o25-vm-k{display:block;font-family:var(--f-dsp);font-weight:700;font-size:clamp(1.5rem,2.2vw,2rem);letter-spacing:-.02em;color:var(--brand-ink);margin-bottom:12px}
.o25-vm-card p{margin:0}
.o25-vm-close{margin:clamp(20px,2.4vw,32px) 0 0;max-width:72ch}
.o25-vals-grid{list-style:none;margin:clamp(20px,2.4vw,32px) 0 0;padding:0;display:grid;gap:var(--v2-gap);grid-template-columns:1fr}
@media (min-width:620px){.o25-vals-grid{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){.o25-vals-grid{grid-template-columns:repeat(3,1fr)}}
.o25-val{background:var(--white);border:1px solid rgba(12,13,15,.07);border-radius:6px;padding:clamp(20px,2.2vw,30px)}
.o25-val .o25-ico{width:40px;height:40px;color:var(--brand-ink);margin-bottom:14px}
.o25-val .v2-h3{margin:0 0 6px;letter-spacing:.04em}
.o25-val p{margin:0}

/* 9 · Engineering Insights — Falcon Group posts. Listing: lead card full width, then a
   3/2/1 grid (24 cards: no short row). Images whole (contain) on the tint, since most
   covers carry type; 16:10 frame. Article: featured image whole, byline, source line. */
.o25-posts{list-style:none;margin:clamp(20px,2.4vw,32px) 0 0;padding:0;display:grid;gap:var(--v2-gap);grid-template-columns:1fr}
@media (min-width:640px){.o25-posts{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){.o25-posts{grid-template-columns:repeat(3,1fr)}}
.o25-post{min-width:0}
.o25-post-a{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none;background:var(--white);border:1px solid rgba(12,13,15,.08);border-radius:6px;overflow:hidden;transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.o25-post-a:hover,.o25-post-a:focus-visible{transform:translateY(-2px);box-shadow:0 10px 28px rgba(12,13,15,.08)}
.o25-post-media{display:block;aspect-ratio:16/10;background:var(--tint);overflow:hidden}
.o25-post-media img{display:block;width:100%;height:100%;object-fit:contain}
.o25-post-b{display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px}
.o25-post-t{font-family:var(--f-dsp);font-weight:600;font-size:1.02rem;line-height:1.35;letter-spacing:-.01em}
.o25-post-a:hover .o25-post-t,.o25-post-a:focus-visible .o25-post-t{color:var(--brand-ink);text-decoration:underline;text-underline-offset:3px}
.o25-post-m{font-size:.85rem;color:var(--tx-l-dim);margin-top:auto}
@media (min-width:640px){.o25-post.is-lead{grid-column:1/-1}}
@media (min-width:900px){
  .o25-post.is-lead .o25-post-a{flex-direction:row;align-items:stretch}
  .o25-post.is-lead .o25-post-media{flex:0 0 56%;aspect-ratio:auto;min-height:300px}
  .o25-post.is-lead .o25-post-b{justify-content:center;padding:28px 32px}
  .o25-post.is-lead .o25-post-t{font-size:clamp(1.3rem,1.9vw,1.7rem)}
}
.o25-art-fig{margin:0 0 clamp(20px,2.4vw,32px);max-width:820px}
.o25-art-fig img{display:block;width:100%;height:auto;border-radius:6px;border:1px solid rgba(12,13,15,.08)}
.o25-src{margin-top:clamp(20px,2.4vw,32px);font-size:.95rem;color:var(--tx-l-dim)}
.o25-by{font-weight:600}

/* Home, phones: the WhatsApp button waits until the hero tiles have scrolled past it
   (assets/js/oct25.js adds body.wa-hold while the hero's bottom is still on screen). */
.v2-wa{transition:opacity .25s var(--ease),transform .25s var(--ease),background-color .25s var(--ease),visibility 0s linear 0s}
body.wa-hold .v2-wa{opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .25s var(--ease),transform .25s var(--ease),visibility 0s linear .25s}
@media (prefers-reduced-motion:reduce){.v2-wa,body.wa-hold .v2-wa{transition:none}}

/* Narrow cards opened rivers under the sitewide justify rule (v2.css, >=768px): the
   house exception — cards and lists are left-aligned — extended to this sprint's cards. */
@media (min-width:768px){
  main :is(.o25-loc-card,.o25-vm-card,.o25-val,.o25-tl-ms,.o25-post,.pseq-step) p,
  main :is(.o25-loc-card,.o25-vm-card,.o25-val,.o25-tl-ms,.o25-post){text-align:left;text-align-last:auto}
}

/* Bearings gallery: ten images after the Inspection move — 5 + 5 from 1000px (2-up below),
   so no row is ever short. */
@media (min-width:1000px){.p-gallery.ctr.c5 > .eshot{flex-basis:calc((100% - 4 * var(--pg-gap)) / 5)}}