/* ==========================================================================
   TECNOMATION — PREMIUM LAYER
   Loaded after styles.css. Adds depth, motion and the cinematic components:
   ultra header, stat bar, sliders, cinematic banner, 3D tilt, beams and orbs.
   Nothing here removes or replaces existing content — it only elevates it.
   ========================================================================== */

:root{
  --glow-mint:0 0 0 1px rgba(79,231,143,.25), 0 18px 50px -18px rgba(79,231,143,.55);
  --ring:0 0 0 1px rgba(8,17,13,.06);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
}

/* ---------- Film grain: a single cheap layer that makes flat colour read as film ---------- */
body::after{
  content:"";position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}
@media (prefers-reduced-motion:reduce){ body::after{display:none} }

/* ---------- Ambient orbs & beams ---------- */
.orb{position:absolute;border-radius:50%;filter:blur(70px);pointer-events:none;z-index:0}
.orb-mint{background:radial-gradient(circle,rgba(79,231,143,.45),transparent 68%)}
.orb-deep{background:radial-gradient(circle,rgba(11,42,30,.5),transparent 68%)}
.beam{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.beam::before{
  content:"";position:absolute;top:-40%;left:-10%;width:44%;height:180%;
  background:linear-gradient(102deg,transparent,rgba(79,231,143,.09),transparent);
  transform:rotate(12deg) translateX(-40%);animation:beamsweep 11s var(--ease-out) infinite;
}
@keyframes beamsweep{0%{transform:rotate(12deg) translateX(-60%)}60%,100%{transform:rotate(12deg) translateX(300%)}}

/* Hairline grid on dark sections */
.dark.gridlines::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:74px 74px;
  -webkit-mask-image:radial-gradient(ellipse 80% 65% at 50% 40%,#000,transparent);
  mask-image:radial-gradient(ellipse 80% 65% at 50% 40%,#000,transparent);
}

/* ---------- ULTRA HEADER ---------- */
#nav{--nav-pad:0}
#nav::after{ /* scroll progress rail */
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:linear-gradient(90deg,var(--mint),#8CFFC0 60%,var(--mint));
  transform:scaleX(var(--sp,0));transform-origin:left;
  box-shadow:0 0 14px rgba(79,231,143,.75);transition:opacity .4s;
}
#nav .navin{position:relative}

/* Nav links get a mint underline that draws in */
.navlinks>a,.navdrop>button{position:relative;overflow:visible}
.navlinks>a::after,.navdrop>button::after{
  content:"";position:absolute;left:12px;right:12px;bottom:5px;height:1.5px;border-radius:2px;
  background:linear-gradient(90deg,var(--mint),#8CFFC0);
  transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease-out);
}
.navlinks>a:hover::after,.navdrop>button:hover::after,.navdrop.open>button::after,.navlinks>a.active::after{transform:scaleX(1);transform-origin:left}
.navlinks>a.active{color:#fff}

/* Mega menu */
.dropmenu.mega{
  min-width:560px;left:-140px;padding:14px;
  display:grid;grid-template-columns:1fr 1fr;gap:4px;
  background:linear-gradient(170deg,#0E3323,var(--deep) 62%);
}
.dropmenu.mega::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;
  background:linear-gradient(150deg,rgba(79,231,143,.5),transparent 46%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
}
.dropmenu.mega a:not(.btn){flex-direction:row;align-items:flex-start;gap:12px;padding:12px}
.dropmenu.mega .mm-ico{
  width:34px;height:34px;border-radius:10px;flex:none;display:grid;place-items:center;
  background:rgba(79,231,143,.12);border:1px solid rgba(79,231,143,.22);color:var(--mint);
  transition:transform .45s var(--ease-spring),background .35s;
}
.dropmenu.mega a:hover .mm-ico{transform:translateY(-2px) scale(1.06);background:rgba(79,231,143,.22)}
.dropmenu.mega .mm-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.dropmenu.mega .mm-foot{
  grid-column:1/-1;margin-top:6px;padding:13px 14px;border-radius:12px;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
}
.dropmenu.mega .mm-foot p{font-size:12.6px;color:rgba(255,255,255,.6)}

/* Magnetic / shine on the header CTA */
.btn-shine{position:relative}
.btn-shine::before{
  content:"";position:absolute;top:0;bottom:0;width:38%;left:-50%;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg);animation:btnshine 4.6s var(--ease-out) infinite;
}
@keyframes btnshine{0%{left:-60%}55%,100%{left:140%}}

/* ---------- Section chrome ---------- */
.sec-tag{
  display:inline-flex;align-items:center;gap:10px;padding:6px 14px 6px 6px;border-radius:100px;
  border:1px solid var(--line);background:#fff;box-shadow:var(--sh-1);
  font-family:var(--mono);font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-2);
}
.sec-tag b{
  width:24px;height:24px;border-radius:50%;display:grid;place-items:center;
  background:var(--deep);color:var(--mint);font-family:var(--mono);font-size:9.5px;font-weight:600;
}
.dark .sec-tag{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.13);color:rgba(255,255,255,.78)}
.dark .sec-tag b{background:var(--mint);color:var(--deep)}

/* Heading word-by-word reveal */
.wordwrap{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em;margin-bottom:-.06em}
.word{display:inline-block;will-change:transform,opacity}

/* ---------- Premium cards ---------- */
.card{isolation:isolate}
.card.lift::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;
  background:linear-gradient(160deg,rgba(79,231,143,.16),transparent 52%);
  opacity:0;transition:opacity .5s var(--ease-out);
}
.card.lift:hover::after{opacity:1}
.card.lift:hover{box-shadow:0 30px 70px -28px rgba(8,17,13,.3),0 0 0 1px rgba(79,231,143,.28)}
.dark .card.lift:hover{box-shadow:0 30px 70px -26px rgba(0,0,0,.7),0 0 0 1px rgba(79,231,143,.3)}
.ico{position:relative;overflow:hidden}
.ico::before{
  content:"";position:absolute;inset:0;background:linear-gradient(140deg,rgba(255,255,255,.85),transparent 60%);
  opacity:0;transition:opacity .45s;
}
.card.lift:hover .ico::before{opacity:.6}

/* 3D tilt */
[data-tilt]{transform-style:preserve-3d;will-change:transform;transition:transform .7s var(--ease-out)}
[data-tilt].tilting{transition:transform .18s linear}
[data-tilt] .tilt-lift{transform:translateZ(38px);transform-style:preserve-3d}
[data-tilt] .tilt-lift-sm{transform:translateZ(18px)}

/* ---------- STAT BAR ---------- */
.statbar{
  position:relative;overflow:hidden;border-radius:var(--r-xl);background:var(--deep);
  display:grid;grid-template-columns:repeat(4,1fr);
  box-shadow:0 30px 80px -34px rgba(6,26,18,.7);
}
.statbar::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(70% 130% at 12% 0%,rgba(79,231,143,.18),transparent 60%),
             radial-gradient(60% 120% at 92% 100%,rgba(79,231,143,.12),transparent 62%);
}
.statbar .st{position:relative;padding:clamp(20px,2.4vw,32px);border-right:1px solid rgba(255,255,255,.09)}
.statbar .st:last-child{border-right:0}
.statbar .st .k{font-family:var(--mono);font-size:9.4px;letter-spacing:.16em;text-transform:uppercase;color:var(--mint)}
.statbar .st .v{font-family:var(--display);font-weight:700;font-size:clamp(28px,3.4vw,42px);letter-spacing:-.022em;color:#fff;line-height:1;margin-top:12px}
.statbar .st .d{font-size:12.6px;color:rgba(255,255,255,.5);margin-top:7px;line-height:1.45}
.statbar .st .spark{height:3px;border-radius:3px;background:rgba(255,255,255,.1);margin-top:14px;overflow:hidden}
.statbar .st .spark i{display:block;height:100%;width:0;border-radius:3px;background:linear-gradient(90deg,var(--mint),#8CFFC0);transition:width 1.5s var(--ease-out)}

/* ---------- SLIDER ---------- */
.slider{position:relative}
.slider-vp{overflow:hidden;cursor:grab;-webkit-mask-image:linear-gradient(90deg,transparent,#000 2%,#000 98%,transparent);mask-image:linear-gradient(90deg,transparent,#000 2%,#000 98%,transparent)}
.slider-vp.drag{cursor:grabbing}
.slider-track{display:flex;gap:clamp(12px,1.6vw,20px);will-change:transform;transition:transform .7s var(--ease-out)}
.slider-track.nosnap{transition:none}
.slider-track>*{flex:0 0 auto}
.slider-head{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:22px}
.slider-btns{display:flex;gap:8px}
.sbtn{
  width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#fff;cursor:pointer;
  display:grid;place-items:center;color:var(--ink);transition:all .35s var(--ease-out);
}
.sbtn:hover{background:var(--deep);border-color:var(--deep);color:#fff;transform:translateY(-2px)}
.sbtn[disabled]{opacity:.32;cursor:default;transform:none;background:#fff;border-color:var(--line);color:var(--ink)}
.dark .sbtn{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.16);color:#fff}
.dark .sbtn:hover{background:var(--mint);border-color:var(--mint);color:var(--deep)}
.slider-dots{display:flex;gap:6px;justify-content:center;margin-top:22px}
/* A 24x24 TARGET WITH A 7px DOT IN IT.
   WCAG 2.5.8 asks for 24x24, or 24px of clearance. These were 7x7 buttons
   with 13px between centres -- four failures, and only on desktop, because
   the hit-area rule further down is inside a touch-only media query. The
   button is the target now and a pseudo-element is the dot, so the row is
   wider to aim at and identical to look at. */
.slider-dots button{
  width:24px;height:24px;padding:0;border:0;background:none;
  display:grid;place-items:center;cursor:pointer;
}
.slider-dots button::before{
  content:"";width:7px;height:7px;border-radius:50%;
  background:var(--line);transition:all .4s var(--ease-out);
}
.slider-dots button.on{width:32px}
.slider-dots button.on::before{width:26px;border-radius:100px;background:var(--mint)}
.dark .slider-dots button::before{background:rgba(255,255,255,.2)}
.dark .slider-dots button.on::before{background:var(--mint)}

/* Industry slide sizing */
.ind-slide{width:clamp(210px,22vw,268px)}

/* ---------- CINEMATIC BANNER ---------- */
.cine{position:relative;border-radius:var(--r-xl);overflow:hidden;background:var(--deep);height:clamp(420px,46vw,540px);box-shadow:0 40px 100px -44px rgba(6,26,18,.8)}
.cine-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity 1.1s var(--ease-out),visibility 1.1s}
.cine-slide.on{opacity:1;visibility:visible}
.cine-slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.14);transition:transform 9s linear}
.cine-slide.on img{transform:scale(1)}
.cine-slide .ov{position:absolute;inset:0;background:linear-gradient(100deg,rgba(6,26,18,.93) 6%,rgba(6,26,18,.72) 44%,rgba(6,26,18,.25) 100%)}
.cine-body{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center;gap:16px;padding:clamp(26px,4vw,64px);max-width:640px}
.cine-body h3{color:#fff}
.cine-body p{color:rgba(255,255,255,.76)}
.cine-nav{position:absolute;right:clamp(20px,3vw,40px);bottom:clamp(20px,3vw,36px);z-index:4;display:flex;gap:8px}
.cine-idx{position:absolute;left:clamp(26px,4vw,64px);bottom:clamp(22px,3vw,38px);z-index:4;display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;color:rgba(255,255,255,.55)}
.cine-idx .rail{width:110px;height:2px;background:rgba(255,255,255,.18);border-radius:2px;overflow:hidden}
.cine-idx .rail i{display:block;height:100%;background:var(--mint);width:0;transition:width .6s var(--ease-out)}

/* ---------- Marquee variants ---------- */
.marq-xl{padding-block:clamp(26px,3vw,44px);border-block:1px solid var(--line);background:var(--paper-2)}
.marq-xl .marq-item{font-size:12px;color:var(--ink-2)}
.marq-xl .marq-item svg{color:var(--green-ink);opacity:1}
.marq-track.rev{animation-direction:reverse}

/* ---------- Section divider beam ---------- */
.divider{position:relative;height:1px;background:var(--line);overflow:visible}
.divider::before{
  content:"";position:absolute;left:0;top:-1px;height:3px;width:180px;border-radius:3px;
  background:linear-gradient(90deg,transparent,var(--mint),transparent);
  animation:divslide 7s linear infinite;
}
@keyframes divslide{0%{transform:translateX(-200px)}100%{transform:translateX(calc(100vw + 200px))}}

/* ---------- Scroll cue ---------- */
.scrollcue{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:9.6px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted-2)}
.scrollcue i{display:block;width:1px;height:34px;background:linear-gradient(180deg,var(--mint),transparent);position:relative;overflow:hidden}
.scrollcue i::after{content:"";position:absolute;inset:0;background:var(--mint);animation:cue 2.2s var(--ease-out) infinite}
@keyframes cue{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}

/* ---------- Hero polish ---------- */
.hero-media{transform-style:preserve-3d}
.hero-media::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);
}
.hero-badge{position:relative;overflow:hidden}
.hero-badge::after{
  content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;
  background:linear-gradient(100deg,transparent,rgba(79,231,143,.28),transparent);
  animation:btnshine 5.4s var(--ease-out) infinite;
}

/* ---------- Pill / tag polish ---------- */
.pill{backdrop-filter:blur(6px)}
.pill-mint{box-shadow:0 0 0 3px rgba(79,231,143,.09)}

/* ---------- Price strip cinematic ---------- */
.price-strip{isolation:isolate}
.price-strip::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(60% 120% at 82% 20%,rgba(79,231,143,.2),transparent 62%),
             radial-gradient(50% 100% at 10% 90%,rgba(79,231,143,.12),transparent 66%);
}
.price-strip .inner{position:relative;z-index:2}
.pricebig .num{background:linear-gradient(180deg,#fff 40%,#9BFFC8);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- Plan card premium ---------- */
.plan.featured{transform:translateY(-10px);box-shadow:0 44px 100px -42px rgba(8,17,13,.42)}
.plan.featured .ptop{background:linear-gradient(170deg,var(--mint-wash),#fff 72%)}

/* ---------- Table polish ---------- */
.cmp tbody tr{transition:background .3s}
.cmp tbody tr:hover{background:var(--paper-2)}
.cmp .featcol{position:relative}

/* ---------- Footer polish ---------- */
footer.site{position:relative;isolation:isolate}
footer.site::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(50% 60% at 50% 0%,rgba(79,231,143,.12),transparent 64%);
}
footer.site>.wrap{position:relative;z-index:2}
.footmark{background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.01));-webkit-background-clip:text;background-clip:text;color:transparent}

/* ==========================================================================
   RESPONSIVE STANDARDISATION
   Measured fixes from a breakpoint audit run at 1440 / 1024 / 768 / 390 / 360
   across all seven pages. No redesign — this sets consistent floors for
   legibility, reading measure and touch ergonomics.
   ========================================================================== */

/* --- 1. Micro-type floor. Nothing renders below ~10px anywhere on the site.
       Uppercase mono at 9px reads as texture, not text. --- */
.eyebrow{font-size:10.6px}
.pill{font-size:10.2px}
.mono{font-size:11.4px}
.card-num{font-size:10.6px}
.scrollcue{font-size:10.2px}
#annbar .ablink{font-size:10.2px}
.hero-badge .go{font-size:10px}
.hero-meta small{font-size:10px}
.hero-media .cap .mono{font-size:10.2px}
.float-card .mono{font-size:10.2px}
.field label{font-size:10.2px}
.caphead .mono,.capgrid .mono,#cap-cycle{font-size:10.2px}
.statbar .st .k{font-size:10.2px}
.statbar .st .d{font-size:12.8px}
.svc-item .stag{font-size:10px}
.svc-cat b{font-size:10.2px}
.techchip .tlogo{font-size:10px}
.tech-tab i{font-size:11.4px}
.marq-item{font-size:10.8px}
.cine-idx{font-size:10.6px}
.lgstep .mono{font-size:10.2px}
.step .idx{font-size:10.6px}
.cmp thead th{font-size:10.2px}
footer.site h4{font-size:10.2px}
.foot-bottom,.foot-bottom a{font-size:12.2px}
.tiny{font-size:12px}

/* --- 2. Reading measure. Long paragraphs were running 100–190 characters on
       wide screens; 60–80 is the comfortable band. --- */
.lede{max-width:72ch}
.sub{max-width:68ch}
.tiny{max-width:82ch}
.acc-body .inner{max-width:74ch}
.cine-body .lede{max-width:56ch}
/* keep centred blocks centred once they are constrained */
.center>.lede,.center>.sub,.center>.tiny,
.sec-head.center>.lede,.sec-head.center>.sub,
.lede.center,.sub.center,.tiny.center{margin-inline:auto}

/* --- 3. Wrapping. Headings break more evenly, paragraphs avoid orphans.
       Ignored by browsers that don't support it. --- */
h1,h2,h3,h4{text-wrap:balance}
p,li{text-wrap:pretty}

/* --- 4. Touch ergonomics: 40px minimum on anything tappable.
       Inline links inside sentences are exempt, per WCAG 2.2 target-size. --- */
@media (hover:none),(max-width:820px){
  .txtlink{min-height:40px}
  .brand{padding-block:9px}
  .hero-badge .go{height:26px}
  .checkline input{width:20px;height:20px}
  .langmenu button{min-height:40px}
  .svc-cat{height:38px}
  .chip span{height:38px}
  .sbtn{width:42px;height:42px}
  .acc-item>button{padding-block:20px}
  /* grow the hit area without moving anything on screen */
  #annbar .abclose{position:absolute}
  #annbar .abclose::after{content:"";position:absolute;inset:-9px}
  #annbar .ablink{position:relative}
  #annbar .ablink::before{content:"";position:absolute;inset:-11px -8px}
  .hero-badge .go{position:relative}
  .hero-badge .go::before{content:"";position:absolute;inset:-8px -4px}
  .slider-dots button{position:relative}
  .slider-dots button::after{content:"";position:absolute;inset:-14px -6px}
}

/* ---------- Responsive ---------- */
@media (max-width:1024px){
  .dropmenu.mega{min-width:0;left:-8px;grid-template-columns:1fr}
  .statbar{grid-template-columns:repeat(2,1fr)}
  .statbar .st:nth-child(2){border-right:0}
  .statbar .st:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.09)}
}
@media (max-width:768px){
  .cine{height:auto;min-height:460px}
  .cine-body{max-width:none;padding:26px 20px 96px}
  .cine-slide .ov{background:linear-gradient(180deg,rgba(6,26,18,.6) 0%,rgba(6,26,18,.92) 62%)}
  .cine-nav{right:20px;bottom:20px}
  .cine-idx{left:20px;bottom:26px}
  .cine-idx .rail{width:70px}
  .ind-slide{width:200px}
  .sbtn{width:40px;height:40px}
  .plan.featured{transform:none}
  .slider-vp{-webkit-mask-image:none;mask-image:none}
  .scrollcue{display:none}
  .orb{filter:blur(52px);opacity:.5!important}
  .dark.gridlines::before{background-size:52px 52px}
  /* the mono floor must survive the mobile type step-down */
  .eyebrow{font-size:10.2px}
  .statbar .st .d{font-size:12.4px}
}
/* Stat bar keeps two columns down to 600px — one column on a tablet is a waste */
@media (max-width:600px){
  .statbar{grid-template-columns:1fr;border-radius:var(--r-lg)}
  .statbar .st{border-right:0;border-bottom:1px solid rgba(255,255,255,.09)}
  .statbar .st:last-child{border-bottom:0}
}
@media (max-width:480px){
  .ind-slide{width:172px}
  .statbar .st .v{font-size:30px}
}
@media (prefers-reduced-motion:reduce){
  .beam::before,.divider::before,.btn-shine::before,.hero-badge::after,.scrollcue i::after{animation:none;display:none}
  .cine-slide img{transition:none;transform:none}
  [data-tilt]{transform:none!important}
}


/* ---------------------------------------------------------------------------
   THE SCROLL REVEAL: POSITION ONLY, NEVER OPACITY
   ---------------------------------------------------------------------------
   It used to fade each block in from opacity 0, with one GSAP ScrollTrigger
   per element. Two costs, both measured:

   CONTRAST. An accessibility audit samples the page while the animation is
   running, and text at 35% opacity over white is not 5:1 against it. Fourteen
   items on every run, all of them content that was simply mid-fade -- caught
   in the act at #availability .sec-head, opacity 0.35.

   LAYOUT. Creating a ScrollTrigger measures where its element sits, which
   forces a synchronous layout. 151 of them against a 4,767-element DOM came
   to 2.8 seconds of layout under a 4x CPU throttle, and a Total Blocking Time
   that swung between 0 and 3,770 ms from one run to the next.

   An IntersectionObserver measures nothing synchronously, and a transform is
   composited rather than laid out. The gesture is the same: it rises, or it
   scales, or it comes in from the left. It just does not fade while it does. */
.js-rv [data-rv] {
  transform: translateY(26px);
  transition: transform .9s cubic-bezier(.22, .61, .36, 1);
}
.js-rv [data-rv="fade"]  { transform: translateY(12px); }
.js-rv [data-rv="scale"] { transform: scale(.965); }
.js-rv [data-rv="left"]  { transform: translateX(-26px); }
.js-rv [data-rv="hold"]  { transform: scale(.98); }

/* The hero is still GSAP's: it runs on load rather than on a scroll, and the
   wrapper it sits in is also [data-tilt], which writes its own transform. */
.js-rv #hero [data-rv] { transform: none; transition: none; }

.js-rv [data-rv].rv-in { transform: none; }

@media (prefers-reduced-motion: reduce) {
  .js-rv [data-rv] { transform: none; transition: none; }
}