/* Flor & Shine V3.2: interacción de vidrio empañado en fotografía principal. */
.hero-photo-frame{isolation:isolate}
.hero-fog-canvas{
  position:absolute;inset:0;z-index:1;width:100%;height:100%;
  display:none;touch-action:none;cursor:crosshair;
}
.hero-photo-frame.has-fog .hero-fog-canvas{display:block}
.hero-fog-hint{
  position:absolute;z-index:4;top:22px;right:clamp(18px,3.2vw,56px);
  display:flex;align-items:center;gap:10px;max-width:min(330px,calc(100% - 36px));
  padding:12px 17px;color:#174d36;background:rgba(255,254,245,.95);
  border:1px solid rgba(66,121,80,.23);border-radius:999px;
  font-size:12px;font-weight:850;line-height:1.25;letter-spacing:.01em;
  box-shadow:0 10px 30px #244b3127;
  pointer-events:none;
}
.hero-fog-hint[hidden],.hero-fog-actions[hidden]{display:none!important}
.hero-fog-actions{
  position:absolute;z-index:4;bottom:19px;right:clamp(18px,3.2vw,56px);
  display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end;
}
.hero-fog-actions button{
  border:1px solid #ffffff9c;background:rgba(255,254,246,.95);color:#214e39;
  border-radius:999px;padding:11px 15px;font-size:11px;font-weight:800;
  box-shadow:0 7px 20px #152d1a24;cursor:pointer;
}
.hero-fog-actions button:first-child{background:#386e37;color:#fff;border-color:#386e37}
.hero-fog-actions button:hover{filter:brightness(.94)}
.hero-fog-actions button:focus-visible{outline:3px solid #ffce60;outline-offset:3px}
.hero-wipe-cursor{
  display:none;position:absolute;z-index:3;left:0;top:0;pointer-events:none;
  transform:translate(-35%,-40%) rotate(-18deg);
  font-size:38px;filter:drop-shadow(0 4px 3px rgba(11,47,22,.25));
}
.hero-wipe-cursor.is-visible{display:block}
.use-sponge-cursor .hero-wipe-cursor{display:none!important}
/* Evita que el degradado ornamental bloquee el puntero. */
.hero-grid::before{pointer-events:none!important}
@media(max-width:750px){
 .hero-fog-hint{top:auto;bottom:151px;left:12px;right:12px;max-width:none;justify-content:center;font-size:10px;padding:8px 10px}
 .hero-fog-actions{right:12px;bottom:99px;left:12px;justify-content:center}
 .hero-fog-actions button{padding:9px 11px;font-size:10px}
 .hero-wipe-cursor{font-size:30px}
}
@media(prefers-reduced-motion:reduce){.hero-wipe-cursor{transition:none!important}}
/* En móvil la capa del texto ocupaba toda la portada y capturaba los toques.
   Dejamos los enlaces clicables y el espacio libre disponible para la esponja. */
@media(max-width:750px){
 .hero.hero-v28 .hero-copy{pointer-events:none!important}
 .hero.hero-v28 .hero-copy a,.hero.hero-v28 .hero-copy button{pointer-events:auto!important}
}