/* ==========================================================================
   OMNIX PAGE STYLES (2026-10-18)
   Homepage additions (all products, featured, EV vehicle testing scene),
   Equipment Rental page and About page. Loaded by those pages only.
   ========================================================================== */

/* ---------- Homepage: all products + featured ---------- */
.product-grid-all{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:1240px){.product-grid-all{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:900px){.product-grid-all{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.product-grid-all{grid-template-columns:repeat(2,minmax(0,1fr))}}
.product-tile-cta{border-style:dashed;background:linear-gradient(145deg,#eef5ff,#e4eefb);justify-content:center}
.product-tile-cta .product-visual{display:grid;place-items:center;font:800 54px Manrope,sans-serif;color:#1769e8;background:transparent}
.product-tile-cta .product-visual b{display:block;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.product-tile-cta:hover .product-visual b{transform:rotate(-12deg) scale(1.15)}
.featured-section{background:#f4f7fb}
.feature-chip-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.feature-chip-card{position:relative;display:flex;flex-direction:column;gap:6px;padding:24px 22px 26px;border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden;min-height:132px}
.feature-chip-card b{font:800 16px/1.35 Manrope,sans-serif;color:#0b1830;max-width:88%}
.feature-chip-card small{color:var(--muted);font-size:12px;line-height:1.6}
.feature-chip-card i{position:absolute;right:18px;top:20px;font-style:normal;color:#1769e8;transition:transform .3s}
.feature-chip-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#1769e8,#45c4ff);transform:scaleY(0);transform-origin:top;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.feature-chip-card:hover:before{transform:scaleY(1)}
.feature-chip-card:hover i{transform:translate(4px,-4px)}
.feature-chip-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(12,38,76,.12);border-color:#b8d3f7}
.feature-chip-card{transition:transform .3s,box-shadow .3s,border-color .3s}
@media(max-width:1020px){.feature-chip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.feature-chip-grid{grid-template-columns:1fr}}
.industry-item{display:block;color:inherit}

/* ---------- Homepage: EV vehicle testing scene ---------- */
.evs{position:relative;overflow:hidden;background:#07152b;color:#f4f8ff;padding:100px 0 92px;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.evs:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(85,145,220,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(85,145,220,.055) 1px,transparent 1px);background-size:42px 42px;mask-image:radial-gradient(ellipse at 60% 40%,#000,transparent 75%);animation:gridDrift 18s linear infinite}
.evs .container{position:relative}
.evs-head{max-width:780px}
.evs-head h2{font-size:clamp(36px,4.2vw,60px);line-height:1.06;letter-spacing:-.045em;margin:18px 0 16px}
.evs-head h2 em{font-style:normal;color:#72b1ff}
.evs-head p{color:#b9c9df;line-height:1.8;max-width:640px;margin:0}
.evs-layout{display:grid;grid-template-columns:330px minmax(0,1fr);gap:34px;align-items:start;margin-top:46px}
.evs-steps{display:grid;gap:12px}
.evs-step{position:relative;display:flex;gap:14px;align-items:center;text-align:left;padding:16px 18px;border:1px solid rgba(120,170,240,.2);background:rgba(15,39,69,.5);border-radius:14px;color:#cfe0f5;cursor:pointer;overflow:hidden;font-family:inherit;transition:background .3s,border-color .3s,transform .3s}
.evs-step:hover{border-color:rgba(120,180,255,.55);transform:translateX(4px)}
.evs-step-n{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid rgba(120,180,255,.4);font:800 13px Manrope,sans-serif;transition:background .3s,color .3s,border-color .3s}
.evs-step-t b{display:block;color:#fff;font:800 15px Manrope,sans-serif}
.evs-step-t small{display:block;margin-top:3px;color:#93acc9;font-size:12px;line-height:1.5}
.evs-step-bar{position:absolute;left:0;bottom:0;height:3px;width:0;background:linear-gradient(90deg,#1769e8,#45c4ff)}
.evs-step.is-active{background:rgba(23,105,232,.22);border-color:#4c9cff}
.evs-step.is-active .evs-step-n{background:#1769e8;border-color:#1769e8;color:#fff}
.evs-step.is-active .evs-step-bar{animation:evsFill var(--evs-dur,6s) linear forwards}
.evs.is-held .evs-step.is-active .evs-step-bar,.evs.is-static .evs-step.is-active .evs-step-bar{animation:none;width:100%}
@keyframes evsFill{to{width:100%}}
.evs-cta{margin-top:10px;display:grid;gap:16px;justify-items:start}
.evs-cta .text-link{color:#8fc2ff}

.evs-stage{position:relative;border:1px solid rgba(110,170,240,.22);border-radius:22px;background:radial-gradient(ellipse at 50% 38%,rgba(25,87,147,.34),rgba(8,25,49,.2) 70%),#081a33;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.3)}
.evs-svg{display:block;width:100%;height:auto}
.evs-skyline path{fill:rgba(80,140,220,.10)}
.evs-sky-run{animation:evsSky 30s linear infinite}
@keyframes evsSky{to{transform:translateX(-1000px)}}
.evs-road-edge{stroke:rgba(110,170,240,.5);stroke-width:2}
.evs-road-dash{stroke:rgba(190,220,255,.55);stroke-width:3;stroke-dasharray:46 34;animation:evsRoad .7s linear infinite}
@keyframes evsRoad{to{stroke-dashoffset:-80}}
.evs-charger-body{fill:#0c2447;stroke:rgba(120,180,255,.5);stroke-width:2}
.evs-charger-screen{fill:#06162d;stroke:rgba(120,180,255,.4)}
.evs-charger-wave{fill:none;stroke:#45c4ff;stroke-width:1.6;stroke-linecap:round}
.evs-charger-led{fill:#5de0b3;animation:blinkSignal 1.4s steps(1) infinite}
.evs-cable{fill:none;stroke:rgba(150,200,255,.4);stroke-width:6;stroke-linecap:round}
.evs-flow{fill:none;stroke:#45c4ff;stroke-width:2.6;stroke-dasharray:7 7;stroke-linecap:round;animation:ev-dash 1s linear infinite;opacity:.22;transition:opacity .4s}
.evs-dot{fill:#9be7ff;filter:url(#evsGlow);opacity:0;transition:opacity .4s}
.evs-beam{fill:url(#evsBeam);opacity:0;transition:opacity .5s}
.evs-body{fill:url(#evsBodyFill);stroke:#cfe6ff;stroke-width:2.4;stroke-linejoin:round}
.evs-window{fill:rgba(120,190,255,.10);stroke:rgba(190,225,255,.7);stroke-width:1.6}
.evs-line{fill:none;stroke:rgba(190,225,255,.5);stroke-width:1.5;stroke-linecap:round}
.evs-scan{animation:evsScan 4.8s ease-in-out infinite}
@keyframes evsScan{0%{transform:translateX(0)}100%{transform:translateX(880px)}}
.evs-car{animation:evsBob 2.2s ease-in-out infinite}
@keyframes evsBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.6px)}}
.evs-arch{fill:#081a33;stroke:rgba(190,225,255,.5);stroke-width:2}
.evs-tire{fill:#0a1c36;stroke:#cfe6ff;stroke-width:3}
.evs-rim{fill:none;stroke:rgba(190,225,255,.6);stroke-width:2}
.evs-spoke{stroke:rgba(190,225,255,.75);stroke-width:2.4;fill:none;stroke-linecap:round}
.evs-wheel{animation:evsSpin .9s linear infinite}
.evs-rotor{animation:evsSpin .55s linear infinite}
@keyframes evsSpin{to{transform:rotate(360deg)}}
.evs-part .evs-box{fill:rgba(20,60,110,.35);stroke:rgba(120,180,255,.42);stroke-width:1.6;transition:fill .4s,stroke .4s,filter .4s}
.evs-sym{fill:none;stroke:rgba(150,210,255,.6);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.evs-cells rect{fill:rgba(49,215,177,.55);animation:cell-pulse 1.4s ease-in-out infinite}
.evs-cells rect:nth-child(3n){animation-delay:-.4s}.evs-cells rect:nth-child(3n+1){animation-delay:-.9s}.evs-cells rect:nth-child(5n){animation-delay:-.2s}
.evs-probe{opacity:0;transition:opacity .35s}
.evs-probe circle{fill:#45c4ff}
.evs-probe .evs-ring{fill:none;stroke:#45c4ff;stroke-width:2;transform-box:fill-box;transform-origin:center;animation:evsPing 1.6s ease-out infinite}
@keyframes evsPing{0%{transform:scale(.5);opacity:1}100%{transform:scale(2.3);opacity:0}}
.evs-tag{opacity:0;transform:translateY(6px);transition:opacity .45s,transform .45s;pointer-events:none}
.evs-tag path{stroke:#45c4ff;stroke-width:1.4;stroke-dasharray:4 4;fill:none;animation:ev-dash 1.4s linear infinite}
.evs-tag rect{fill:#0f2c52;stroke:#45c4ff;stroke-width:1.4}
.evs-tag text{fill:#e9f4ff;font:700 12px Manrope,sans-serif;letter-spacing:.04em}

/* stage states: which part lights up, what flows, parked (charging) vs driving */
.evs-stage[data-stage="0"] .probe-0,.evs-stage[data-stage="0"] .tag-0,
.evs-stage[data-stage="1"] .probe-1,.evs-stage[data-stage="1"] .tag-1,
.evs-stage[data-stage="2"] .probe-2,.evs-stage[data-stage="2"] .tag-2,
.evs-stage[data-stage="3"] .probe-3,.evs-stage[data-stage="3"] .tag-3{opacity:1;transform:none}
.evs-stage[data-stage="0"] .part-charge .evs-box,
.evs-stage[data-stage="1"] .part-battery .evs-box,
.evs-stage[data-stage="2"] .part-inverter .evs-box,
.evs-stage[data-stage="3"] .part-motor .evs-box{fill:rgba(69,196,255,.28);stroke:#45c4ff;filter:drop-shadow(0 0 8px rgba(69,196,255,.7))}
.evs-stage[data-stage="0"] .evs-flow-charge,.evs-stage[data-stage="0"] .dot-charge,
.evs-stage[data-stage="1"] .evs-flow-batt,.evs-stage[data-stage="1"] .dot-batt,
.evs-stage[data-stage="2"] .evs-flow-batt,.evs-stage[data-stage="2"] .dot-batt,.evs-stage[data-stage="2"] .evs-flow-inv,.evs-stage[data-stage="2"] .dot-inv,
.evs-stage[data-stage="3"] .evs-flow-inv,.evs-stage[data-stage="3"] .dot-inv,.evs-stage[data-stage="3"] .evs-flow-motor,.evs-stage[data-stage="3"] .dot-motor{opacity:1}
.evs-stage:not([data-stage="0"]) .evs-beam{opacity:.9}
.evs-stage[data-stage="0"] .evs-wheel,.evs-stage[data-stage="0"] .evs-road-dash,.evs-stage[data-stage="0"] .evs-sky-run,.evs-stage[data-stage="0"] .evs-rotor{animation-play-state:paused}

/* instrument panel under the car */
.evs-panels{position:relative;display:grid;padding:24px 28px 30px;border-top:1px solid rgba(110,170,240,.18);background:rgba(6,20,40,.55);min-height:214px}
.evs-panel{grid-area:1/1;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .45s,transform .45s,visibility .45s;max-width:760px}
.evs-panel.is-active{opacity:1;visibility:visible;transform:none}
.evs-panel-top{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:8px}
.evs-brand{padding:4px 9px;border-radius:5px;background:#1769e8;color:#fff;font:800 10px Manrope,sans-serif;letter-spacing:.18em}
.evs-panel h3{margin:0;font:800 19px/1.3 Manrope,sans-serif;color:#fff}
.evs-panel h3 small{font-weight:600;font-size:15px;color:#9fb7d5}
.evs-panel p{margin:0 0 16px;color:#b9c9df;font-size:14px;line-height:1.75}
.evs-readouts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:14px}
.evs-readouts div{padding:12px 14px;border:1px solid rgba(110,170,240,.22);border-radius:12px;background:rgba(15,39,69,.6)}
.evs-readouts small{display:block;color:#8aa4c4;font-size:11px;margin-bottom:4px}
.evs-readouts b{display:block;color:#7fe3ff;font:800 21px Manrope,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.evs-panel .text-link{color:#8fc2ff}
.evs-live{position:absolute;right:26px;bottom:14px;display:flex;align-items:center;gap:8px;color:#a9c2df;font-size:9px;letter-spacing:.13em;text-align:right;max-width:46%}
.evs-live small{display:block;font-size:9px;letter-spacing:0;color:#6e8bab;line-height:1.5}
@media(max-width:1020px){
  .evs-layout{grid-template-columns:1fr}
  .evs-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .evs-cta{grid-column:1/-1}
}
@media(max-width:620px){
  .evs{padding:76px 0 70px}
  .evs-steps{grid-template-columns:1fr}
  .evs-panels{padding:20px 18px 64px}
  .evs-readouts{grid-template-columns:1fr 1fr 1fr;gap:8px}
  .evs-readouts b{font-size:16px}
  .evs-live{left:18px;right:18px;max-width:none;justify-content:flex-start;text-align:left}
}
@media(prefers-reduced-motion:reduce){
  .evs *{animation:none!important}
  .evs-step-bar{display:none}
}

/* ==========================================================================
   EQUIPMENT RENTAL PAGE
   ========================================================================== */
.rt-hero{padding:84px 0 92px}
.rt-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.rt-hero h1{font-family:Manrope,sans-serif;font-size:clamp(42px,5vw,66px);line-height:1.05;letter-spacing:-.05em;margin:20px 0 22px}
.rt-hero h1 em{font-style:normal;color:#78b7ff}
.rt-hero-copy>p{max-width:600px;color:#c7d7e9;font-size:16px;line-height:1.85;margin:0}
.rt-hero .hero-actions{margin-top:28px}
.rt-hero-points{list-style:none;display:flex;flex-wrap:wrap;gap:10px 22px;padding:0;margin:30px 0 0;color:#9fb9d8;font-size:13px}
.rt-hero-points li{display:flex;align-items:center;gap:9px}
.rt-hero-points li:before{content:"";width:7px;height:7px;border-radius:50%;background:#5de0b3;box-shadow:0 0 0 4px rgba(93,224,179,.16)}

/* hero: rack of three instruments */
.rt-rack{position:relative;min-height:500px}
.rt-rack-glow{position:absolute;inset:8% 6%;border-radius:50%;background:radial-gradient(circle,rgba(40,130,255,.35),transparent 65%);filter:blur(30px)}
.rt-dev{position:absolute;width:76%;padding:14px 16px 16px;border:1px solid rgba(130,185,250,.4);border-radius:16px;background:linear-gradient(160deg,rgba(17,45,82,.96),rgba(9,26,50,.96));box-shadow:0 24px 50px rgba(0,0,0,.35);animation:rtFloat 6s ease-in-out infinite;animation-delay:calc(var(--d)*-3s)}
.rt-dev-a{left:0;top:0;z-index:1}
.rt-dev-b{right:0;top:31%;z-index:2}
.rt-dev-c{left:6%;top:62%;z-index:3}
@keyframes rtFloat{0%,100%{translate:0 0}50%{translate:0 -9px}}
.rt-dev-top{display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:.16em;font-weight:800;color:#a9c7ee}
.rt-dev-top i{width:7px;height:7px;border-radius:50%;background:#5de0b3;box-shadow:0 0 10px #5de0b3;animation:blinkSignal 1.6s steps(1) infinite}
.rt-dev-screen{height:84px;margin:12px 0;border-radius:9px;overflow:hidden;background:#06152b;border:1px solid rgba(80,150,230,.35);background-image:linear-gradient(rgba(90,150,230,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(90,150,230,.12) 1px,transparent 1px);background-size:22px 22px}
.rt-dev-screen svg{width:100%;height:100%}
.rt-dev-screen path{fill:none;stroke:#56c8ff;stroke-width:2.4;stroke-linecap:round;stroke-dasharray:240;animation:rtTrace 3.4s linear infinite;animation-delay:calc(var(--d)*-2s)}
.rt-dev-c .rt-dev-screen path{stroke:#5de0b3}
@keyframes rtTrace{from{stroke-dashoffset:480}to{stroke-dashoffset:0}}
.rt-dev-knobs{display:flex;gap:8px;align-items:center}
.rt-dev-knobs b{width:13px;height:13px;border-radius:50%;background:#16355f;border:1px solid #4b86cf}
.rt-dev-knobs em{margin-left:auto;width:46px;height:5px;border-radius:5px;background:linear-gradient(90deg,#1769e8,#45c4ff)}
.rt-dur{position:absolute;right:2%;bottom:0;z-index:4;padding:14px 18px;border-radius:14px;background:#fff;color:#0b1830;box-shadow:0 18px 40px rgba(0,0,0,.3);min-width:176px}
.rt-dur small{display:block;font-size:9px;letter-spacing:.16em;font-weight:800;color:#6c7f98}
.rt-dur b{display:block;font:800 22px Manrope,sans-serif;margin:3px 0 9px;color:#1769e8}
.rt-dur-dots{display:flex;gap:5px}
.rt-dur-dots i{flex:1;height:5px;border-radius:5px;background:#dce7f6;transition:background .4s}
.rt-dur-dots i.on{background:#1769e8}

/* stats */
.rt-stats{background:#fff;border-bottom:1px solid var(--line)}
.rt-stat-grid{list-style:none;margin:0;padding:34px 0;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.rt-stat-grid li{display:flex;align-items:baseline;gap:12px;padding-left:20px;border-left:3px solid #1769e8}
.rt-stat-grid b{font:800 44px Manrope,sans-serif;letter-spacing:-.04em;color:#0b1830;font-variant-numeric:tabular-nums}
.rt-stat-grid span{color:var(--muted);font-size:13px;line-height:1.4}

/* intro */
.rt-intro-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:start}
.rt-intro h2,.rt-process h2,.rt-request h2,.rt-choose-sec h2{font-family:Manrope,sans-serif;font-size:clamp(30px,3.4vw,46px);line-height:1.1;letter-spacing:-.045em;margin:16px 0 20px;color:#0b1830}
.rt-intro p{color:#52657f;line-height:1.9;font-size:15px;max-width:640px}
.rt-intro strong{color:#0b1830}
.rt-why{padding:30px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(160deg,#f7faff,#eef4fc);box-shadow:var(--shadow)}
.rt-why h3{font:800 19px Manrope,sans-serif;margin:0 0 18px;color:#0b1830}
.rt-ticks{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.rt-ticks li{display:flex;gap:12px;align-items:flex-start;color:#26384f;font-size:14px;line-height:1.55;transition:transform .25s}
.rt-ticks li:hover{transform:translateX(5px)}
.rt-tick{flex:none;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#e4eefc}
.rt-tick svg{width:13px;height:13px;fill:none;stroke:#1769e8;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:24}
.mx-in .rt-tick svg,.rt-ticks.mx-in .rt-tick svg,.mx-in.rt-ticks .rt-tick svg{animation:mxDraw .7s ease .3s forwards}
.rt-why.mx-in .rt-tick svg,.rt-choose-grid.mx-in .rt-tick svg,.rt-ticks .mx-in .rt-tick svg{animation:mxDraw .7s ease .3s forwards}

/* equipment grid */
.rt-equip{background:#f4f7fb}
.rt-filters{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 26px}
.rt-chip{padding:10px 18px;border-radius:40px;border:1px solid #cfdcee;background:#fff;color:#26384f;font:700 13px Manrope,sans-serif;cursor:pointer;transition:background .25s,color .25s,border-color .25s,transform .25s}
.rt-chip:hover{transform:translateY(-2px);border-color:#1769e8}
.rt-chip.is-on{background:#1769e8;border-color:#1769e8;color:#fff;box-shadow:0 8px 20px rgba(23,105,232,.3)}
.rt-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.rt-card{position:relative;display:flex;flex-direction:column;border:1px solid #dfe8f4;border-radius:16px;background:#fff;overflow:hidden;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s,opacity .3s}
.rt-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(12,38,76,.14);border-color:#9cc4f7}
.rt-card.is-picked{border-color:#1769e8;box-shadow:0 0 0 3px rgba(23,105,232,.18),0 20px 44px rgba(12,38,76,.12)}
.rt-card.is-off{display:none}
.rt-card.is-in{animation:rtIn .5s cubic-bezier(.2,.7,.2,1) both}
@keyframes rtIn{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
.rt-visual{height:170px;display:grid;place-items:center;background:linear-gradient(145deg,#eef5ff,#e1ecf9);position:relative;overflow:hidden}
.rt-visual:before{content:"";position:absolute;width:170px;height:170px;border:1px solid #a6c6ed50;border-radius:50%;box-shadow:0 0 0 20px #ffffff45,0 0 0 40px #ffffff25;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.rt-card:hover .rt-visual:before{transform:scale(1.18)}
.rt-visual svg{position:relative;width:150px;height:98px;stroke:#3c72ab;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.rt-card:hover .rt-visual svg{transform:scale(1.08) translateY(-3px)}
.rt-card-body{display:flex;flex-direction:column;gap:10px;padding:18px 18px 18px;flex:1}
.rt-tag{align-self:flex-start;padding:4px 9px;border-radius:5px;background:#eaf2ff;color:#2d62b0;font:800 10px Manrope,sans-serif;letter-spacing:.08em}
.rt-card h3{margin:0;font:800 16px/1.35 Manrope,sans-serif;color:#0b1830;flex:1}
.rt-card-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:4px}
.rt-add{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:8px;border:1px solid #cfdcee;background:#fff;color:#0b1830;font:800 12px Manrope,sans-serif;cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.rt-add:hover{border-color:#1769e8;color:#1769e8}
.rt-add-i{position:relative;width:14px;height:14px}
.rt-add-i:before,.rt-add-i:after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;border-radius:2px;background:currentColor;transition:transform .3s}
.rt-add-i:after{transform:rotate(90deg)}
.rt-add[aria-pressed="true"]{background:#1769e8;border-color:#1769e8;color:#fff}
.rt-add[aria-pressed="true"] .rt-add-i:before{transform:rotate(45deg)}
.rt-add[aria-pressed="true"] .rt-add-i:after{transform:rotate(-45deg)}
.rt-more{font:800 12px Manrope,sans-serif;color:#1769e8;white-space:nowrap}
.rt-more span{display:inline-block;transition:transform .25s}
.rt-more:hover span{transform:translate(3px,-3px)}

/* package bar */
.rt-bar{position:sticky;bottom:18px;z-index:40;display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:26px;padding:14px 18px;border-radius:16px;background:rgba(8,24,49,.96);color:#fff;box-shadow:0 22px 54px rgba(5,18,40,.45);border:1px solid rgba(110,170,240,.35);backdrop-filter:blur(10px);transform:translateY(140%);opacity:0;pointer-events:none;transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .4s}
.rt-bar.is-on{transform:none;opacity:1;pointer-events:auto}
.rt-bar-main{flex:1;min-width:220px}
.rt-bar-main b{display:block;font:800 14px Manrope,sans-serif;margin-bottom:8px}
.rt-bar-chips{display:flex;flex-wrap:wrap;gap:6px}
.rt-bar-chips span{padding:4px 10px;border-radius:30px;background:rgba(69,150,255,.2);border:1px solid rgba(110,175,255,.4);font-size:11px;font-weight:700;animation:rtIn .35s both}
.rt-bar-dur{display:grid;gap:4px;font-size:10px;letter-spacing:.1em;font-weight:800;color:#9fb9d8}
.rt-bar-dur select{padding:10px 12px;border-radius:8px;border:1px solid #3c6aa8;background:#0d2a50;color:#fff;font:600 13px Manrope,sans-serif}

/* options */
.rt-options{background:linear-gradient(115deg,#08152b,#0e2a4f);color:#fff;position:relative;overflow:hidden}
.rt-options:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(85,145,220,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(85,145,220,.055) 1px,transparent 1px);background-size:44px 44px;pointer-events:none}
.rt-options .container{position:relative}
.rt-options .section-heading h2{color:#fff}
.rt-options .section-heading p{color:#b9c9df}
.rt-opts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.rt-opt{position:relative;padding:26px 22px 24px;border:1px solid rgba(120,175,245,.25);border-radius:18px;background:rgba(15,39,69,.62);display:flex;flex-direction:column;gap:12px;transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .3s,background .3s}
.rt-opt:hover{transform:translateY(-6px);border-color:rgba(130,190,255,.6)}
.rt-opt h3{margin:6px 0 0;font:800 19px/1.3 Manrope,sans-serif}
.rt-opt p{margin:0;color:#b9c9df;font-size:13px;line-height:1.75;flex:1}
.rt-opt-track{height:8px;border-radius:8px;background:rgba(120,175,245,.18);position:relative;overflow:hidden}
.rt-opt-track i{position:absolute;left:0;top:0;bottom:0;border-radius:8px;background:linear-gradient(90deg,#1769e8,#45c4ff);animation:rtGrow 3.6s ease-in-out infinite}
.rt-opt[data-kind="s"] .rt-opt-track i{width:22%;animation-name:rtSlideS}
.rt-opt[data-kind="l"] .rt-opt-track i{width:100%}
.rt-opt[data-kind="p"] .rt-opt-track i{width:55%;animation-name:rtGrowP}
.rt-opt[data-kind="k"] .rt-opt-track i{width:100%;background:repeating-linear-gradient(90deg,#1769e8 0 22%,transparent 22% 26%);animation-name:rtGrowK}
@keyframes rtGrow{0%{transform:scaleX(0)}70%,100%{transform:scaleX(1)}}
@keyframes rtGrowP{0%{transform:scaleX(0)}60%,100%{transform:scaleX(1)}}
@keyframes rtGrowK{0%{clip-path:inset(0 100% 0 0)}70%,100%{clip-path:inset(0 0 0 0)}}
@keyframes rtSlideS{0%{transform:translateX(-100%)}100%{transform:translateX(360%)}}
.rt-opt-track i{transform-origin:left}
.rt-choose{align-self:flex-start;padding:10px 14px;border-radius:9px;border:1px solid rgba(130,190,255,.5);background:transparent;color:#fff;font:800 12px Manrope,sans-serif;cursor:pointer;transition:background .25s,border-color .25s}
.rt-choose:hover{background:rgba(69,150,255,.25)}
.rt-choose[aria-pressed="true"]{background:#1769e8;border-color:#1769e8}
.rt-opt.is-chosen{border-color:#45c4ff;background:rgba(23,105,232,.28);box-shadow:0 0 0 3px rgba(69,196,255,.18)}

/* process */
.rt-process{background:#fff}
.rt-process-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:start}
.rt-process p{color:#52657f;line-height:1.8;margin:0 0 24px}
.rt-steps{list-style:none;margin:0;padding:0 0 0 0;position:relative;display:grid;gap:18px}
.rt-steps:before{content:"";position:absolute;left:21px;top:22px;bottom:22px;width:2px;background:linear-gradient(#1769e8,#45c4ff);opacity:.35}
.rt-step{position:relative;display:flex;gap:20px;align-items:flex-start;padding:20px 22px;border:1px solid var(--line);border-radius:16px;background:#f9fbfe;transition:transform .3s,box-shadow .3s,border-color .3s}
.rt-step:hover{transform:translateX(6px);box-shadow:0 18px 40px rgba(12,38,76,.1);border-color:#b8d3f7}
.rt-step-n{flex:none;position:relative;z-index:1;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#1769e8;color:#fff;font:800 16px Manrope,sans-serif;box-shadow:0 0 0 6px #fff,0 0 0 7px #cfe0f8}
.rt-step h3{margin:2px 0 6px;font:800 17px Manrope,sans-serif;color:#0b1830}
.rt-step p{margin:0;font-size:14px;line-height:1.7;color:#5a6d86}

/* applications */
.rt-apps{background:#f4f7fb}
.rt-app-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.rt-app-grid li{display:flex;align-items:center;gap:12px;padding:18px 18px;border:1px solid #dfe8f4;border-radius:14px;background:#fff;font:700 14px Manrope,sans-serif;color:#0b1830;transition:transform .3s,background .3s,color .3s,border-color .3s}
.rt-app-grid li:hover{transform:translateY(-4px);background:#1769e8;border-color:#1769e8;color:#fff}
.rt-dot{flex:none;width:10px;height:10px;border-radius:50%;background:#1769e8;box-shadow:0 0 0 5px rgba(23,105,232,.14);transition:background .3s,box-shadow .3s}
.rt-app-grid li:hover .rt-dot{background:#fff;box-shadow:0 0 0 5px rgba(255,255,255,.25)}

/* why choose */
.rt-choose-sec{background:linear-gradient(115deg,#0b1d3a,#103a72);color:#fff}
.rt-choose-sec h2{color:#fff}
.rt-choose-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:start}
.rt-ticks-2{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 26px}
.rt-choose-sec .rt-ticks li{color:#e3eefc;padding:14px 16px;border:1px solid rgba(130,185,250,.22);border-radius:12px;background:rgba(15,39,69,.5);align-items:center}
.rt-choose-sec .rt-tick{background:rgba(69,196,255,.2)}
.rt-choose-sec .rt-tick svg{stroke:#7fe3ff}

/* request */
.rt-request{background:#fff}
.rt-request-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:start}
.rt-request p{color:#52657f;line-height:1.8}
.rt-contact{display:grid;gap:14px;margin-top:28px}
.rt-contact a{display:flex;align-items:center;gap:14px;font:700 15px Manrope,sans-serif;color:#0b1830;transition:transform .25s}
.rt-contact a:hover{transform:translateX(6px)}
.rt-contact small{display:block;font-size:10px;letter-spacing:.14em;color:#7a8ba3;margin-bottom:2px}
.rt-form{padding:32px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:var(--shadow);display:grid;gap:14px}
.rt-form h3{margin:0 0 4px;font:800 22px Manrope,sans-serif;color:#0b1830}
.rt-form label{display:grid;gap:7px;font:700 12px Manrope,sans-serif;color:#26384f}
.rt-form input,.rt-form select,.rt-form textarea{width:100%;padding:13px 14px;border:1px solid #d3deed;border-radius:10px;background:#f9fbfe;font:500 14px 'DM Sans',sans-serif;color:#0b1830;transition:border-color .25s,box-shadow .25s,transform .25s}
.rt-form input:focus,.rt-form select:focus,.rt-form textarea:focus{outline:none;border-color:#1769e8;box-shadow:0 0 0 4px rgba(23,105,232,.15);transform:translateY(-1px);background:#fff}
.rt-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.rt-form .form-note{margin:0;font-size:12px;color:#7a8ba3}
.rt-pack{padding:12px 14px;border:1px dashed #1769e8;border-radius:10px;background:#eef5ff;font-size:13px;color:#16345c;animation:rtIn .4s both}
.rt-pack b{display:block;font:800 12px Manrope,sans-serif;margin-bottom:4px}

@media(max-width:1100px){
  .rt-hero-grid,.rt-intro-grid,.rt-process-grid,.rt-choose-grid,.rt-request-grid{grid-template-columns:1fr;gap:38px}
  .rt-grid,.rt-opts,.rt-app-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rt-rack{min-height:400px;max-width:520px}
}
@media(max-width:640px){
  .rt-hero{padding:56px 0 64px}
  .rt-stat-grid{grid-template-columns:1fr 1fr;gap:18px 14px}
  .rt-stat-grid li{flex-direction:column;gap:2px;padding-left:14px}
  .rt-stat-grid b{font-size:34px}
  .rt-grid,.rt-opts{grid-template-columns:1fr}
  .rt-app-grid{grid-template-columns:1fr 1fr}
  .rt-ticks-2{grid-template-columns:1fr}
  .rt-form{padding:22px 18px}.rt-form .form-row{grid-template-columns:1fr}
  .rt-bar{bottom:10px;padding:12px 14px}
  .rt-rack{min-height:360px}.rt-dev{width:84%}
}
@media(prefers-reduced-motion:reduce){
  .rt-dev,.rt-dev-screen path,.rt-opt-track i{animation:none!important}
  .rt-card.is-in,.rt-pack,.rt-bar-chips span{animation:none}
  .rt-tick svg{stroke-dashoffset:0}
}

/* ==========================================================================
   ABOUT PAGE
   ========================================================================== */
.ab-hero{padding:84px 0 92px}
.ab-hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.ab-hero h1{font-family:Manrope,sans-serif;font-size:clamp(34px,4.2vw,56px);line-height:1.08;letter-spacing:-.045em;margin:20px 0 22px}
.ab-hero h1 em{display:block;font-style:normal;color:#78b7ff;font-size:.72em;letter-spacing:-.03em;margin-top:8px}
.ab-hero-copy p{color:#c7d7e9;font-size:15.5px;line-height:1.85;margin:0 0 14px;max-width:640px}
.ab-hero-copy strong{color:#fff}
.ab-hero .hero-actions{margin-top:26px}
.ab-orbit{position:relative;aspect-ratio:1;max-width:470px;width:100%;justify-self:center}
.ab-ring{position:absolute;border-radius:50%;border:1px dashed rgba(120,180,255,.4)}
.ab-ring-a{inset:4%;animation:heroOrbit 40s linear infinite}
.ab-ring-b{inset:20%;border-style:solid;border-color:rgba(120,180,255,.25);animation:heroOrbit 28s linear infinite reverse}
.ab-ring-c{inset:36%;border-color:rgba(69,196,255,.5);animation:heroOrbit 18s linear infinite}
.ab-core{position:absolute;inset:36%;display:grid;place-items:center;align-content:center;gap:6px;border-radius:50%;background:radial-gradient(circle,#1a63c8,#0c2d5c);box-shadow:0 0 60px rgba(40,130,255,.55);color:#fff}
.ab-core svg{width:44px;height:44px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ab-core b{font:800 13px Manrope,sans-serif;letter-spacing:.2em}
.ab-node{position:absolute;display:grid;place-items:center;width:0;height:0}
.ab-node i{position:absolute;white-space:nowrap;padding:9px 14px;border-radius:30px;background:#fff;color:#0b1830;font:800 12px Manrope,sans-serif;font-style:normal;box-shadow:0 14px 30px rgba(0,0,0,.3);animation:rtFloat 5s ease-in-out infinite}
.ab-node.n1{left:50%;top:2%}.ab-node.n2{left:98%;top:50%}.ab-node.n3{left:50%;top:98%}.ab-node.n4{left:2%;top:50%}
.ab-node.n2 i{animation-delay:-1.2s}.ab-node.n3 i{animation-delay:-2.4s}.ab-node.n4 i{animation-delay:-3.6s}
.ab-node:before{content:"";position:absolute;width:12px;height:12px;border-radius:50%;background:#45c4ff;box-shadow:0 0 0 6px rgba(69,196,255,.25);animation:evsPing 2.4s ease-out infinite}
.ab-pillar-sec{background:#fff;border-bottom:1px solid var(--line)}
.ab-pillars{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.ab-pillars li+li{border-left:1px solid var(--line)}
.ab-pillars a{position:relative;display:block;padding:30px 26px 32px;height:100%;transition:background .3s}
.ab-pillars a:hover{background:#f4f8fe}
.ab-pillars b{display:block;font:800 17px Manrope,sans-serif;color:#0b1830;margin-bottom:8px}
.ab-pillars span{display:block;color:#5a6d86;font-size:13px;line-height:1.7;max-width:230px}
.ab-pillars i{position:absolute;right:22px;top:26px;font-style:normal;color:#1769e8;transition:transform .3s}
.ab-pillars a:hover i{transform:translate(4px,-4px)}
.ab-pillars a:after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:linear-gradient(90deg,#1769e8,#45c4ff);transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.ab-pillars a:hover:after{transform:scaleX(1)}
.ab-body{background:#fff}
.ab-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:64px;align-items:start}
.ab-toc{position:sticky;top:110px}
.ab-toc-in{display:grid;gap:4px;padding-left:18px;border-left:2px solid #e1eaf6;position:relative}
.ab-toc small{font:800 10px Manrope,sans-serif;letter-spacing:.16em;color:#7a8ba3;margin-bottom:10px}
.ab-toc a{padding:8px 0;font:700 13px Manrope,sans-serif;color:#5a6d86;position:relative;transition:color .25s,transform .25s}
.ab-toc a:before{content:"";position:absolute;left:-20px;top:50%;width:2px;height:0;background:#1769e8;transform:translateY(-50%);transition:height .3s}
.ab-toc a:hover{color:#0b1830}
.ab-toc a.is-on{color:#1769e8;transform:translateX(4px)}
.ab-toc a.is-on:before{height:100%}
.ab-content{display:grid;gap:64px}
.ab-sec{scroll-margin-top:110px;padding-bottom:56px;border-bottom:1px solid var(--line)}
.ab-sec:last-child{border-bottom:0;padding-bottom:0}
.ab-sec h2{font-family:Manrope,sans-serif;font-size:clamp(26px,3vw,38px);line-height:1.15;letter-spacing:-.04em;margin:16px 0 18px;color:#0b1830}
.ab-sec p{color:#52657f;font-size:15.5px;line-height:1.9;max-width:760px;margin:0 0 14px}
.ab-sec strong{color:#0b1830}
.ab-list{list-style:none;margin:20px 0 22px;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.ab-list li{display:flex;align-items:center;gap:12px;padding:15px 18px;border:1px solid var(--line);border-radius:12px;background:#f9fbfe;font:700 14px Manrope,sans-serif;color:#0b1830;transition:transform .3s,background .3s,color .3s,border-color .3s}
.ab-list li:before{content:"";flex:none;width:9px;height:9px;border-radius:50%;background:#1769e8;box-shadow:0 0 0 5px rgba(23,105,232,.14)}
.ab-list li:hover{transform:translateX(6px);background:#1769e8;border-color:#1769e8;color:#fff}
.ab-list li:hover:before{background:#fff}
.ab-chips{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:12px}
.ab-chips li{padding:13px 20px;border-radius:40px;border:1px solid #cfdcee;background:#fff;font:800 14px Manrope,sans-serif;color:#0b1830;transition:transform .3s,background .3s,color .3s,border-color .3s}
.ab-chips li:hover{transform:translateY(-4px);background:#1769e8;border-color:#1769e8;color:#fff;box-shadow:0 12px 26px rgba(23,105,232,.3)}
.ab-banner{position:relative;overflow:hidden;background:linear-gradient(115deg,#08152b,#0f3b78);color:#fff;padding:90px 0}
.ab-banner:before{content:"";position:absolute;inset:-40% -10%;background:conic-gradient(from 0deg at 75% 50%,transparent,rgba(120,190,255,.2),transparent 30%);animation:heroOrbit 18s linear infinite}
.ab-banner .container{position:relative;display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap}
.ab-banner h2{margin:0;font:800 clamp(32px,4.4vw,58px)/1.1 Manrope,sans-serif;letter-spacing:-.045em}
.ab-banner h2 em{font-style:normal;color:#78b7ff}
@media(max-width:1000px){
  .ab-hero-grid,.ab-layout{grid-template-columns:1fr;gap:40px}
  .ab-toc{display:none}
  .ab-pillars{grid-template-columns:1fr 1fr}
  .ab-pillars li:nth-child(3){border-left:0}
  .ab-pillars li:nth-child(n+3){border-top:1px solid var(--line)}
  .ab-orbit{max-width:380px}
}
@media(max-width:620px){
  .ab-pillars{grid-template-columns:1fr}.ab-pillars li+li{border-left:0;border-top:1px solid var(--line)}
  .ab-list{grid-template-columns:1fr}
  .ab-node i{font-size:10px;padding:7px 10px}
}
@media(prefers-reduced-motion:reduce){.ab-ring,.ab-node i,.ab-node:before,.ab-banner:before{animation:none}}



/* ==========================================================================
   BRAND PAGES (Hioki, Gossen Metrawatt) + homepage brand band + hero banners
   ========================================================================== */
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.br-hero{position:relative;padding:92px 0 100px;overflow:hidden}
.br-hero-bg{position:absolute;inset:0;background-size:cover;background-position:right center;background-repeat:no-repeat;opacity:.95;transform:scale(1.04);animation:brZoom 18s ease-in-out infinite alternate}
@keyframes brZoom{to{transform:scale(1.12) translateX(-1.5%)}}
.br-hero:before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,rgba(5,16,36,.96) 0%,rgba(5,16,36,.9) 38%,rgba(5,16,36,.45) 70%,rgba(5,16,36,.15) 100%)}
.br-hero .mx-canvas{opacity:.55}
.br-hero-in{position:relative;z-index:1;max-width:1180px}
.br-hero h1{font-family:Manrope,sans-serif;font-size:clamp(40px,5vw,66px);line-height:1.05;letter-spacing:-.05em;margin:20px 0 20px}
.br-hero h1 em{font-style:normal;color:#78b7ff}
.br-hero-gm h1 em{color:#7fe08a}
.br-hero-in>p{max-width:600px;color:#c9d9ec;font-size:16px;line-height:1.85;margin:0}
.br-hero .hero-actions{margin-top:28px}

.br-feat-sec{background:#f4f7fb}
.br-feat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.br-feat{position:relative;display:flex;flex-direction:column;gap:8px;padding:24px 22px 26px;border:1px solid #dfe8f4;border-radius:16px;background:#fff;overflow:hidden;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s}
.br-feat:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#1769e8,#45c4ff);transform:scaleY(0);transform-origin:top;transition:transform .45s}
.br-feat:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(12,38,76,.13);border-color:#9cc4f7}
.br-feat:hover:before{transform:scaleY(1)}
.br-feat small{font:800 10px Manrope,sans-serif;letter-spacing:.14em;color:#2d62b0}
.br-feat b{font:800 26px Manrope,sans-serif;letter-spacing:-.03em;color:#0b1830}
.br-feat p{margin:0;font-size:13px;line-height:1.7;color:#5a6d86;flex:1}
.br-feat i{position:absolute;right:18px;top:20px;font-style:normal;color:#1769e8;transition:transform .3s}
.br-feat:hover i{transform:translate(4px,-4px)}

.br-cats{background:#fff}
.br-tools{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin-bottom:26px}
.br-tools .rt-filters{margin:0}
.br-search input{width:300px;max-width:100%;padding:12px 16px 12px 40px;border:1px solid #cfdcee;border-radius:40px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231769e8' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 14px center/17px;font:500 14px 'DM Sans',sans-serif;color:#0b1830;transition:border-color .25s,box-shadow .25s}
.br-search input:focus{outline:none;border-color:#1769e8;box-shadow:0 0 0 4px rgba(23,105,232,.15)}
.br-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.br-card{display:flex;flex-direction:column;border:1px solid #dfe8f4;border-radius:16px;background:#fff;overflow:hidden;scroll-margin-top:110px;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s}
.br-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(12,38,76,.14);border-color:#9cc4f7}
.br-card.is-off{display:none}
.br-card.is-in{animation:rtIn .5s cubic-bezier(.2,.7,.2,1) both}
.br-card:target{border-color:#1769e8;box-shadow:0 0 0 3px rgba(23,105,232,.2)}
.br-visual{height:130px;display:grid;place-items:center;background:linear-gradient(145deg,#eef5ff,#e1ecf9);position:relative;overflow:hidden}
.br-visual-gm{background:linear-gradient(145deg,#eef8ee,#dcefdc)}
.br-visual:before{content:"";position:absolute;width:150px;height:150px;border:1px solid #a6c6ed60;border-radius:50%;box-shadow:0 0 0 18px #ffffff45,0 0 0 36px #ffffff25;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.br-card:hover .br-visual:before{transform:scale(1.18)}
.br-visual svg{position:relative;width:130px;height:84px;stroke:#3c72ab;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.br-visual-gm svg{stroke:#3f8a4a}
.br-card:hover .br-visual svg{transform:scale(1.08) translateY(-3px)}
.br-body{display:flex;flex-direction:column;gap:9px;padding:18px;flex:1}
.br-tag{align-self:flex-start;padding:4px 9px;border-radius:5px;background:#eaf2ff;color:#2d62b0;font:800 10px Manrope,sans-serif;letter-spacing:.08em}
.br-tag-gm{background:#e6f5e6;color:#2f7a3a}
.br-card h3{margin:0;font:800 16px/1.35 Manrope,sans-serif;color:#0b1830}
.br-card p{margin:0;font-size:13px;line-height:1.7;color:#5a6d86;flex:1}
.br-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;margin-top:6px}
.br-more,.br-ext{font:800 12px Manrope,sans-serif;white-space:nowrap}
.br-more{color:#1769e8}.br-ext{color:#5a6d86}
.br-more span,.br-ext span{display:inline-block;transition:transform .25s}
.br-more:hover span,.br-ext:hover span{transform:translate(3px,-3px)}
.br-empty{padding:26px;border:1px dashed #cfdcee;border-radius:14px;text-align:center;color:#52657f}
.br-empty a{color:#1769e8;font-weight:700}
.br-note{margin:26px 0 0;font-size:12px;color:#7a8ba3;line-height:1.7}

/* homepage: brands band */
.brands-feature{background:#fff}
.bf-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.bf-card{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:330px;padding:34px;border-radius:22px;overflow:hidden;color:#fff;isolation:isolate;box-shadow:0 20px 50px rgba(12,38,76,.18)}
.bf-card:before{content:"";position:absolute;inset:0;z-index:-1;background-size:cover;background-position:right center;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.bf-hioki:before{background-image:linear-gradient(90deg,rgba(5,16,36,.9),rgba(5,16,36,.25)),url(../img/banner-rm3546.jpg)}
.bf-gm:before{background-image:linear-gradient(90deg,rgba(5,16,36,.88),rgba(5,16,36,.2)),url(../img/banner-metracal.jpg)}
.bf-card:hover:before{transform:scale(1.07)}
.bf-card small{font:800 10px Manrope,sans-serif;letter-spacing:.18em;color:#9fc8ff}
.bf-gm small{color:#9be7a4}
.bf-card h3{margin:8px 0 10px;font:800 clamp(28px,3vw,40px)/1.1 Manrope,sans-serif;letter-spacing:-.04em}
.bf-card p{margin:0 0 20px;max-width:430px;color:#d3e0f1;font-size:14px;line-height:1.75}
.bf-card .btn{align-self:flex-start}
@media(max-width:820px){.bf-grid{grid-template-columns:1fr}.bf-card{min-height:280px;padding:26px}}

/* homepage: hero banner slides (uploaded banners join the slider) */
.hero-banner{position:absolute;inset:0;z-index:3;opacity:0;visibility:hidden;transition:opacity .9s ease,visibility .9s;background:#07152b}
.hero-banner.is-active{opacity:1;visibility:visible}
.hero-banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.04)}
.hero-banner.is-active img{animation:hbZoom 8s ease-out forwards}
@keyframes hbZoom{to{transform:scale(1.1)}}
.hero-banner:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,16,36,.78),transparent 48%),linear-gradient(90deg,rgba(5,16,36,.55),transparent 55%)}
.hero-banner-in{position:relative;z-index:1;height:100%;display:flex;align-items:flex-end;padding-bottom:84px}
.hero-banner-cap{max-width:470px;color:#fff;opacity:0;transform:translateY(16px)}
.hero-banner.is-active .hero-banner-cap{animation:slideCopyIn .8s .25s ease both}
.hero-banner-cap small{display:block;font:800 10px Manrope,sans-serif;letter-spacing:.18em;color:#9fd0ff;margin-bottom:8px}
.hero-banner-cap h2{margin:0 0 14px;font:800 clamp(28px,3.4vw,46px)/1.08 Manrope,sans-serif;letter-spacing:-.04em}
.hero-banner-cap h2 em{font-style:normal;color:#78b7ff}
.hero-banner-pos-right .hero-banner-in{justify-content:flex-start}
.hero-banner-pos-right .hero-banner-cap{margin-left:min(52%,640px)}
@media(max-width:780px){.hero-banner-pos-right .hero-banner-cap{margin-left:0}.hero-banner-in{padding-bottom:70px}.hero-banner img{object-position:62% center}}

@media(max-width:1100px){.br-feat-grid,.br-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.br-feat-grid,.br-grid{grid-template-columns:1fr}.br-hero{padding:64px 0 72px}.br-search input{width:100%}.br-search{flex:1;min-width:220px}}
@media(prefers-reduced-motion:reduce){.br-hero-bg,.hero-banner.is-active img{animation:none}.hero-banner-cap{opacity:1;transform:none;animation:none!important}.br-card.is-in{animation:none}}

.hero .hero-art{position:relative}
.hero.has-banner .hero-art{z-index:6}
.hero.has-banner .hero-art>*:not(.hero-slider-controls){opacity:0!important;visibility:hidden;transition:opacity .4s}
.hero.has-banner .hero-bottom-line{opacity:0;transition:opacity .4s}
/* banner slides: park the slider controls bottom-right so they never cover the product */
.hero.has-banner .hero-art{position:static}
.hero.has-banner .hero-slider-controls{left:auto;right:28px;bottom:26px;transform:none;z-index:8}
@media(max-width:780px){.hero.has-banner .hero-slider-controls{right:50%;transform:translateX(50%);bottom:16px}}
/* wide banner shown in full: sharp image centred over a blurred copy of itself */
.hero-banner-fit .hero-banner-bg{object-fit:cover;filter:blur(30px) brightness(.5) saturate(1.1);transform:scale(1.25)}
.hero-banner-fit .hero-banner-main{object-fit:contain!important;object-position:center!important}
.hero-banner-fit.is-active img{animation:none}
.hero-banner-fit:after{background:linear-gradient(180deg,rgba(5,16,36,.55),transparent 28%)}
.hero-banner-fit .hero-banner-in{align-items:flex-start;padding:26px 0 0}
.hero-banner-fit .hero-banner-cap{display:flex;align-items:center;flex-wrap:wrap;gap:6px 28px;max-width:none}
.hero-banner-fit .hero-banner-cap small{width:100%;margin:0}
.hero-banner-fit .hero-banner-cap h2{margin:0;font-size:clamp(24px,2.6vw,36px)}
@media(max-width:780px){.hero-banner-fit .hero-banner-in{padding-top:14px}.hero-banner-fit .hero-banner-cap .btn{display:none}}
/* brand hero layering: image (back) < canvas < dark overlay < content */
.br-hero{isolation:isolate}
.br-hero .br-hero-bg{z-index:-2}
.br-hero .mx-canvas{z-index:-1}
.br-hero:before{z-index:0}

/* ---------- Equipment rental detail pages + 5-column rental menu ---------- */
.rental-columns{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:20px}
.rental-columns .mega-group a{font-size:13px}
.rt-hero-detail{padding:72px 0 80px}
.rt-hero-detail h1{font-size:clamp(34px,4.2vw,56px)}
.rt-rack-one{min-height:300px}
.rt-rack-one .rt-dev-a{left:2%;top:4%;width:88%;z-index:1}
.rt-rack-one .rt-dur{right:4%;bottom:6%}
.rt-rels{display:grid;gap:10px;margin-top:6px}
.rt-rel{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 18px;border:1px solid #dfe8f4;border-radius:12px;background:#f9fbfe;color:#0b1830;font:700 14px Manrope,sans-serif;transition:transform .3s,background .3s,color .3s,border-color .3s}
.rt-rel span{color:#1769e8;transition:transform .3s}
.rt-rel:hover{transform:translateX(6px);background:#1769e8;border-color:#1769e8;color:#fff}
.rt-rel:hover span{color:#fff;transform:translate(3px,-3px)}
@media(max-width:1240px){.rental-columns{grid-template-columns:repeat(3,minmax(0,1fr))!important}}

/* ==========================================================================
   INDUSTRIAL SOFTWARE PAGES
   ========================================================================== */
.sw-hero{padding:80px 0 88px}
.sw-hero h1{font-family:Manrope,sans-serif;font-size:clamp(34px,4.4vw,58px);line-height:1.06;letter-spacing:-.048em;margin:20px 0 22px}
.sw-win{position:relative;width:100%;max-width:560px;justify-self:center;border:1px solid rgba(130,185,250,.4);border-radius:16px;background:linear-gradient(160deg,rgba(17,45,82,.96),rgba(8,24,48,.98));box-shadow:0 30px 60px rgba(0,0,0,.4);overflow:hidden;animation:rtFloat 7s ease-in-out infinite}
.sw-bar{display:flex;align-items:center;gap:7px;padding:12px 16px;border-bottom:1px solid rgba(130,185,250,.2);font:800 10px Manrope,sans-serif;letter-spacing:.16em;color:#a9c7ee}
.sw-bar i{width:9px;height:9px;border-radius:50%;background:#2c568d}.sw-bar i:first-child{background:#ff6b6b}.sw-bar i:nth-child(2){background:#ffcb47}.sw-bar i:nth-child(3){background:#5de0b3}
.sw-bar span{margin-left:8px}.sw-bar em{margin-left:auto;font-style:normal;color:#5de0b3;display:flex;align-items:center;gap:6px}.sw-bar em:before{content:"";width:7px;height:7px;border-radius:50%;background:#5de0b3;box-shadow:0 0 10px #5de0b3;animation:blinkSignal 1.6s steps(1) infinite}
.sw-body{padding:16px}
.sw-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}
.sw-kpi{padding:10px 12px;border:1px solid rgba(110,170,240,.25);border-radius:10px;background:rgba(15,39,69,.7)}
.sw-kpi small{display:block;font:800 9px Manrope,sans-serif;letter-spacing:.14em;color:#8fb2da;margin-bottom:6px}
.sw-kpi svg{width:100%;height:24px}.sw-kpi path{fill:none;stroke:#56c8ff;stroke-width:2;stroke-linecap:round;stroke-dasharray:140;animation:rtTrace 3s linear infinite}
.sw-kpi:nth-child(2) path{stroke:#5de0b3;animation-delay:-1s}.sw-kpi:nth-child(3) path{stroke:#ffcb47;animation-delay:-2s}
.sw-chart{height:130px;border-radius:10px;background:#06152b;border:1px solid rgba(80,150,230,.3);background-image:linear-gradient(90deg,rgba(90,150,230,.1) 1px,transparent 1px);background-size:30px 100%;overflow:hidden}
.sw-chart svg{width:100%;height:100%}
.sw-grid{fill:none;stroke:rgba(90,150,230,.18);stroke-width:1}
.sw-trace{fill:none;stroke:#56c8ff;stroke-width:2.6;stroke-linecap:round;stroke-dasharray:420;animation:rtTrace 4.2s linear infinite}
.sw-bars{display:flex;align-items:flex-end;gap:6px;height:44px;margin-top:12px}
.sw-bars i{flex:1;border-radius:3px 3px 0 0;background:linear-gradient(180deg,#45c4ff,#1769e8);transform-origin:bottom;animation:mxBar 2.4s ease-in-out infinite}
.sw-bars i:nth-child(1){height:50%}.sw-bars i:nth-child(2){height:80%;animation-delay:-.3s}.sw-bars i:nth-child(3){height:60%;animation-delay:-.7s}.sw-bars i:nth-child(4){height:92%;animation-delay:-1.1s}.sw-bars i:nth-child(5){height:45%;animation-delay:-1.5s}.sw-bars i:nth-child(6){height:75%;animation-delay:-.5s}.sw-bars i:nth-child(7){height:55%;animation-delay:-.9s}.sw-bars i:nth-child(8){height:85%;animation-delay:-1.3s}.sw-bars i:nth-child(9){height:65%;animation-delay:-1.7s}.sw-bars i:nth-child(10){height:40%;animation-delay:-.2s}
.sw-plat{background:#f4f7fb}
.sw-plat-intro p{margin:0 0 12px;color:#52657f;line-height:1.85;font-size:15px;max-width:520px}
.sw-plat-intro strong{color:#0b1830}
.sw-plat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.sw-card{padding:30px;border:1px solid #dfe8f4;border-radius:18px;background:#fff;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s}
.sw-card:hover{transform:translateY(-5px);box-shadow:0 24px 50px rgba(12,38,76,.12);border-color:#9cc4f7}
.sw-card-wide{grid-column:1/-1}
.sw-card h3{margin:0 0 14px;font:800 20px Manrope,sans-serif;color:#0b1830}
.sw-card p{margin:0 0 12px;color:#52657f;font-size:14.5px;line-height:1.8}
.sw-card strong{color:#0b1830}
.sw-card .ab-chips{margin:14px 0 16px}
.sw-card .ab-chips li{padding:9px 16px;font-size:13px}
.sw-flow{list-style:none;margin:16px 0 20px;padding:0;display:flex;flex-wrap:wrap;gap:0;align-items:stretch}
.sw-flow li{position:relative;flex:1 1 150px;padding:16px 18px;border:1px solid #cfe0f8;background:#eef5ff;color:#0b1830;font:800 14px Manrope,sans-serif;text-align:center;margin-right:22px;border-radius:12px}
.sw-flow li:last-child{margin-right:0;background:#1769e8;border-color:#1769e8;color:#fff}
.sw-flow li:not(:last-child):after{content:"→";position:absolute;right:-20px;top:50%;transform:translateY(-50%);color:#1769e8;font-weight:800;animation:swNudge 1.4s ease-in-out infinite}
@keyframes swNudge{0%,100%{transform:translate(0,-50%)}50%{transform:translate(4px,-50%)}}
.sw-apps-h{margin:44px 0 18px;font:800 clamp(24px,2.6vw,32px) Manrope,sans-serif;letter-spacing:-.03em;color:#0b1830}
.sw-apps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.sw-app{padding:22px;border:1px solid #dfe8f4;border-radius:16px;background:#fff;transition:transform .3s,box-shadow .3s,border-color .3s}
.sw-app:hover{transform:translateY(-4px);border-color:#9cc4f7;box-shadow:0 18px 40px rgba(12,38,76,.1)}
.sw-app h4{margin:0 0 12px;font:800 16px Manrope,sans-serif;color:#1769e8}
.sw-app ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sw-app li{position:relative;padding-left:16px;font-size:13.5px;color:#34465f;line-height:1.5}
.sw-app li:before{content:"";position:absolute;left:0;top:7px;width:6px;height:6px;border-radius:50%;background:#1769e8}
.sw-chip-h{margin-top:26px}
.sw-process .ab-chips,.rt-process .ab-chips{margin-top:14px}
.sw-light{color:#b9c9df!important;line-height:1.8;margin:0}
.sw-rels-dark .rt-rel{background:rgba(15,39,69,.55);border-color:rgba(130,185,250,.25);color:#fff}
.sw-rels-dark .rt-rel span{color:#7fe3ff}
.sw-rels-dark .rt-rel:hover{background:#1769e8;border-color:#1769e8}
@media(max-width:1100px){.sw-plat-grid{grid-template-columns:1fr}.sw-apps{grid-template-columns:repeat(2,minmax(0,1fr))}.sw-win{max-width:520px}}
@media(max-width:640px){.sw-apps{grid-template-columns:1fr}.sw-flow li{flex-basis:100%;margin:0 0 22px}.sw-flow li:not(:last-child):after{content:"↓";right:auto;left:50%;top:auto;bottom:-22px;transform:translateX(-50%);animation:none}.sw-card{padding:22px}.sw-kpis{gap:6px}}
@media(prefers-reduced-motion:reduce){.sw-win,.sw-kpi path,.sw-trace,.sw-bars i,.sw-flow li:after{animation:none!important}}

/* ---- Hioki product highlights (image left, specs + uses right) ---- */
.hk-spot-sec{background:#fff}
.hk-spots{display:grid;gap:22px}
.hk-spot{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:48px;align-items:center;padding:44px 48px;border:1px solid #e1eaf6;border-radius:20px;background:#f4f7fb;scroll-margin-top:110px;transition:box-shadow .35s,border-color .35s}
.hk-spot:hover{box-shadow:0 24px 56px rgba(12,38,76,.12);border-color:#b8d3f7}
.hk-spot:target{border-color:#1769e8;box-shadow:0 0 0 3px rgba(23,105,232,.18)}
.hk-spot-img{display:grid;place-items:center;min-height:240px}
.hk-spot-ph{position:relative;display:grid;place-items:center;width:100%;max-width:320px;aspect-ratio:1.5;border-radius:16px;background:linear-gradient(145deg,#ffffff,#e5eefb);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.hk-spot:hover .hk-spot-ph{transform:scale(1.04) translateY(-3px)}
.hk-spot-ph svg{width:70%;height:auto;stroke:#3c72ab;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hk-spot-ph img{width:100%;height:100%;object-fit:contain}
.hk-spot-body h3{margin:0 0 26px;font:800 clamp(26px,3vw,40px)/1.12 Manrope,sans-serif;letter-spacing:-.03em;color:#1b2430}
.hk-spot-cols{display:grid;grid-template-columns:1fr 1fr;gap:20px 44px;align-items:start}
.hk-specs{margin:0}
.hk-specs dt{font:800 17px Manrope,sans-serif;color:#1b2430;margin-top:18px}
.hk-specs dt:first-child{margin-top:0}
.hk-specs dd{margin:4px 0 0;font-size:17px;line-height:1.5;color:#5d6f8a}
.hk-uses{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.hk-uses li{position:relative;padding-left:26px;font-size:16px;line-height:1.65;color:#26384f}
.hk-uses li:before{content:"";position:absolute;left:2px;top:.62em;width:9px;height:9px;border-radius:50%;background:#3556c4}
.hk-spot-links{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:30px}
.hk-ext{font:800 13px Manrope,sans-serif;color:#1769e8}
.hk-ext span{display:inline-block;transition:transform .25s}
.hk-ext:hover span{transform:translate(3px,-3px)}
@media(max-width:1000px){.hk-spot{grid-template-columns:1fr;gap:26px;padding:32px 26px}.hk-spot-img{min-height:0}.hk-spot-ph{max-width:260px}}
@media(max-width:640px){.hk-spot-cols{grid-template-columns:1fr}}

/* ---- Product category pages: real product photos ---- */
.hero-photo{display:block;width:100%;max-height:340px;object-fit:contain;filter:drop-shadow(0 22px 30px rgba(0,0,0,.38));animation:rtFloat 6s ease-in-out infinite}
.dash-photo{display:grid;place-items:center;padding:10px 6px}
.signal-photo{display:grid;place-items:center;padding:6px}
.signal-photo .signal-grid,.signal-photo svg{display:none}
.showcase-visual .hero-photo{max-height:380px}
.product-art .hero-photo{max-height:360px;margin:auto}
.spec-photo{margin:6px 0 14px;padding:12px;border-radius:12px;background:linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.03));border:1px solid rgba(130,185,250,.25)}
.spec-photo .hero-photo{max-height:200px;animation:none;filter:drop-shadow(0 12px 18px rgba(0,0,0,.35))}
.hk-desc{margin:0;max-width:560px;font-size:16px;line-height:1.75;color:#5a6d86}
.pd-spots{margin-top:30px}
.pd-spot .hk-spot-ph{max-width:420px;aspect-ratio:1040/694}
.pd-spot .hk-spot-ph img{padding:8px;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.pd-spot:hover .hk-spot-ph img{transform:scale(1.05)}
.pd-spot .hk-spot-links{margin-top:26px}
.product-tile .product-visual img{width:100%;height:100%;object-fit:contain;padding:6px;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.product-tile:hover .product-visual img{transform:scale(1.07) translateY(-3px)}
@media(prefers-reduced-motion:reduce){.hero-photo{animation:none}}
.dash-photo img{display:block;width:100%;max-height:300px;object-fit:contain;filter:drop-shadow(0 18px 26px rgba(0,0,0,.35))}
/* homepage tiles: show the whole product photo (no cropping) */
.product-tile .product-visual{position:relative;display:block;height:auto;aspect-ratio:3/2;padding:0;overflow:hidden}
.product-tile .product-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:10px}
.product-tile-cta .product-visual{display:grid;place-items:center}
.rt-visual img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;padding:8px}
.rt-card:hover .rt-visual img{transform:scale(1.07)}
.rt-visual img{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
/* Gossen listing cards: product image */
.br-visual-img{display:block;height:150px}
.br-visual-img img{position:relative;width:100%;height:100%;object-fit:contain;padding:10px}
.br-visual-img:before{display:none}
/* Gossen product photos are tall: show whole instrument */
.br-visual-img img[src*="Gossen-Metrawatt"]{padding:8px;background:#fff}
.pd-spot .hk-spot-ph img[src*="Gossen-Metrawatt"]{aspect-ratio:auto;max-height:460px;width:auto;margin:0 auto;object-fit:contain;background:#fff}
/* prevent narrow-screen overflow on brand detail pages */
.pd-spot,.pd-spot>*,.product-enquiry-grid>*,.product-enquiry-form>*{min-width:0}
.pd-spot h3,.pd-spot .hk-desc,.br-hero h1{overflow-wrap:anywhere}
.product-enquiry-form input,.product-enquiry-form textarea{max-width:100%}
@media(max-width:640px){.hk-spot-cols{grid-template-columns:1fr}.product-enquiry-form{grid-template-columns:1fr}}
.pd-spot .hk-spot-ph img[src*="Gossen-Metrawatt"]{max-width:100%;height:auto;width:auto}
.pd-spot .hk-spot-ph:has(img[src*="Gossen-Metrawatt"]){aspect-ratio:auto;max-width:100%;overflow:hidden;padding:6px}
@media(max-width:640px){.product-enquiry-form{width:100%;max-width:100%}.product-enquiry-grid{padding-inline:0}}