/* Betancur Studio — capa de interacciones (fx) · compartida por las 4 landings.
   Usa las variables --gold/--hair/etc. ya definidas en cada página.
   Todo respeta prefers-reduced-motion. */

/* ── Líneas doradas que se dibujan al revelar la sección ── */
.sec-head .sec-rule{width:0;transition:width .9s cubic-bezier(.22,.61,.36,1) .15s}
.sec-head.in .sec-rule{width:44px}
.hero-meta .rule{width:0;transition:width .9s cubic-bezier(.22,.61,.36,1) .1s}
.hero-meta.in .rule,.hero-meta.rv.in .rule{width:52px}

/* ── Botones: barrido de brillo al pasar el cursor/tap ── */
.btn,.nav-cta,.sticky-cta a{position:relative;overflow:hidden;isolation:isolate}
.btn::after,.nav-cta::after,.sticky-cta .sc-main::after{
  content:'';position:absolute;top:0;left:-120%;width:60%;height:100%;z-index:-1;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg);transition:left .6s ease}
.btn:hover::after,.nav-cta:hover::after,.sticky-cta .sc-main:hover::after{left:130%}

/* ── Filas del ledger de fugas: cobran vida al pasar por encima ── */
.ledger-row{transition:background .3s,padding-left .3s;position:relative}
.ledger-row::before{content:'';position:absolute;left:0;top:0;bottom:0;width:0;
  background:linear-gradient(var(--gold),transparent);transition:width .3s}
.ledger-row:hover{background:rgba(201,169,110,.05);padding-left:14px}
.ledger-row:hover::before{width:2px}
.ledger-row:hover .amt{text-shadow:0 0 26px rgba(201,169,110,.45)}
.ledger-row .amt{transition:text-shadow .35s}

/* ── Pasos / casos de uso / ateliers / reglas: lift + acento dorado ── */
.step,.scol,.use{transition:transform .3s,background .3s,box-shadow .3s}
.step:hover,.scol:hover,.use:hover{transform:translateY(-4px)}
.use:hover,.step:hover{box-shadow:0 14px 40px rgba(0,0,0,.35)}
.step .n,.scol .si,.use .ui{transition:transform .3s}
.step:hover .n,.scol:hover .si,.use:hover .ui{transform:scale(1.12)}

/* ── Lista "qué incluye" + reglas do/dont: subrayado que respira ── */
.inc,.rcol li{transition:color .25s,transform .25s,border-color .3s}
.inc:hover,.rcol li:hover{transform:translateX(6px);border-color:var(--gold-dim)}
.inc:hover strong,.rcol li:hover{color:var(--text)}

/* ── Galería (fotografía): borde dorado y zoom ya presente ── */
.gitem{transition:border-color .35s,box-shadow .35s}
.gitem:hover{border-color:var(--gold-dim);box-shadow:0 12px 40px rgba(0,0,0,.45);z-index:3}

/* ── Antes/Después: el "After" resalta ── */
.ba-card{transition:transform .35s,box-shadow .35s}
.ba-card.after:hover{transform:scale(1.015);box-shadow:0 16px 50px rgba(201,169,110,.12)}

/* ── Números que cuentan (contador) ── */
.cup{font-variant-numeric:tabular-nums}
.counting{opacity:.92}

/* ── Enlaces de servicio: flecha que empuja ── */
.slink{transition:letter-spacing .3s}
.slink:hover{letter-spacing:.24em}

@media (prefers-reduced-motion: reduce){
  .sec-head .sec-rule{width:44px;transition:none}
  .hero-meta .rule{width:52px;transition:none}
  .btn::after,.nav-cta::after,.sticky-cta .sc-main::after{display:none}
  .step,.scol,.use,.inc,.rcol li,.ledger-row,.ba-card,.gitem{transition:none}
  .step:hover,.scol:hover,.use:hover,.ba-card.after:hover{transform:none}
}