/* PRUEBA: scroll-driven grapple hand-off between the hero and the next section. */
.scroll-grapple{position:fixed;left:0;top:0;width:0;height:0;z-index:40;pointer-events:none;visibility:hidden;opacity:0;transform-origin:50% 3%;will-change:transform,opacity;filter:drop-shadow(9px 18px 12px #0005)}
.scroll-grapple .grapple-piece{will-change:transform}
.showreel-frame.scroll-reveal{will-change:clip-path,transform}
.scroll-grapple.is-cursor{display:none}

/* Desktop grapple cursor: claw on a steel cable anchored to the top of the viewport. */
.grapple-cursor{position:fixed;inset:0;z-index:9000;pointer-events:none;display:none}
html.grapple-cursor-on .grapple-cursor{display:block}
.grapple-cursor.is-hidden{visibility:hidden}
.grapple-cable{position:absolute;left:0;top:0;width:3px;margin-left:-1.5px;height:0;transform-origin:50% 0;will-change:transform,height;
  background:linear-gradient(90deg,#4b5059,#e9ecf0 45%,#8b919b 60%,#2c3038);box-shadow:2px 0 3px #0003}
.grapple-claw{position:absolute;left:0;top:0;transform-origin:50% 3%;will-change:transform;filter:drop-shadow(4px 8px 5px #0005)}
.grapple-claw .grapple-piece{transition:transform .14s cubic-bezier(.3,.7,.3,1)}
html.grapple-cursor-on,html.grapple-cursor-on *{cursor:none!important}
html.grapple-cursor-on :is(input,textarea,select,[contenteditable],[contenteditable] *){cursor:auto!important}
html.grapple-cursor-on :is(input,textarea,[contenteditable]){cursor:text!important}
/* Grabbable letters and objects. */
body :is(h1,h2,h3) span.grab-word{display:inline-block;white-space:nowrap;color:inherit}
body :is(h1,h2,h3) span.grab-letter{display:inline-block;color:inherit;position:relative}
html.grapple-cursor-on .grab{touch-action:none}
.grab-pile{position:absolute;left:0;top:0;width:0;height:0;z-index:8000;pointer-events:none}
.grab-pile .grab-body{pointer-events:auto;will-change:transform;user-select:none;-webkit-user-drag:none}
.grab-pile .grab-body.is-held{filter:drop-shadow(6px 14px 10px #0004)}
.grapple-reset{position:fixed;left:20px;bottom:20px;z-index:9001;display:none;border:1px solid #111114;background:#fdfdfcea;color:#111114;min-height:38px;padding:0 14px;font:600 10px var(--mono);letter-spacing:.05em;box-shadow:0 5px 15px #0001;backdrop-filter:blur(5px)}
html.grapple-cursor-on .grapple-reset.has-moved{display:block}
.grapple-reset:hover{background:#111114;color:#fff}
/* Keep the claw cursor alive over the MetalCharts iframes (cross-origin frames swallow mouse moves
   and show the system cursor). A transparent shield covers each widget frame while the claw is on;
   the "by MetalCharts" links underneath stay clickable. */
html.grapple-cursor-on .market-widget{position:relative}
html.grapple-cursor-on .market-widget::before{content:'';position:absolute;left:0;right:0;top:0;height:calc(100% - 1.6em);z-index:2;cursor:none}
/* CANDIDATO: full-size hero claw — thick braided steel cable from the top of the viewport. */
.grapple-cursor.is-hero .grapple-cable{
  /* Real braided steel: one twist period cropped from crane-grapple.png, tiled along the full length. */
  background:url(/assets/cable-strip.webp?v=e1) center top/100% auto repeat-y;
  border-radius:0;box-shadow:6px 0 10px #0004}
/* CANDIDATO: no reset button; reloading the page is the only reset. */
.grapple-reset{display:none!important}
.grapple-shadow{position:absolute;left:0;top:0;width:0;height:0;border-radius:50%;background:radial-gradient(closest-side,#0b0d12 0,#0b0d1299 45%,transparent 100%);opacity:0;pointer-events:none;will-change:transform,opacity,filter}
.grapple-cursor:not(.is-hero) .grapple-shadow{display:none}

/* Claw retracts over header/nav/links/buttons; native cursor returns there */
.grapple-cursor .grapple-cable,.grapple-cursor .grapple-claw,.grapple-cursor .grapple-shadow{transition:opacity .18s}
.grapple-cursor.is-ui .grapple-cable,.grapple-cursor.is-ui .grapple-claw,.grapple-cursor.is-ui .grapple-shadow{opacity:0}
html.grapple-cursor-on.grapple-ui,html.grapple-cursor-on.grapple-ui body,html.grapple-cursor-on.grapple-ui :is(header,nav,header *,nav *){cursor:auto!important}
html.grapple-cursor-on.grapple-ui :is(a[href],button,[role="button"],summary,label,select,a[href] *,button *){cursor:pointer!important}
