/* ENHEBRADOS · Galerías de imágenes pares y en movimiento · 03/11/2026 */
.hero-gallery.photo-cycle {
  position:relative!important; height:auto!important; width:100%; max-width:630px;
  display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px; align-content:center; perspective:none; isolation:isolate;
}
.hero-gallery .hero-photo.motion-tile {
  position:relative!important; inset:auto!important; width:100%!important; height:auto!important;
  aspect-ratio:1/1; display:block; transform:none!important; border:4px solid #fffaf5;
  border-radius:22px; overflow:hidden; background:#f5e9de;
  box-shadow:0 15px 34px #4f2f2940; animation:tile-arrive .85s both;
  animation-delay:calc(var(--tile-index) * .11s);
}
.hero-gallery .hero-photo:nth-child(2),.hero-gallery .hero-photo:nth-child(5){border-radius:105px 105px 22px 22px}
.hero-gallery .hero-photo:nth-child(3),.hero-gallery .hero-photo:nth-child(6){border-radius:22px 22px 105px 105px}
.motion-tile {position:relative; isolation:isolate; overflow:hidden;}
.motion-tile img.layer-one, .motion-tile img.layer-two {
  display:block; position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:opacity 1.25s ease,filter .7s ease, transform 1.35s ease;
  animation:photo-drift 13s ease-in-out infinite alternate;
  animation-delay:calc(var(--tile-index) * -.8s);
}
.motion-tile img.layer-one{opacity:1}
.motion-tile img.layer-two{opacity:0}
.photo-cycle.is-phase-two .motion-tile img.layer-one{opacity:0}
.photo-cycle.is-phase-two .motion-tile img.layer-two{opacity:1}
.photo-cycle.is-phase-two .motion-tile img {animation-direction:alternate-reverse}
.hero-gallery .hero-photo>span {position:absolute;bottom:8px;left:50%;transform:translateX(-50%);
  z-index:3;white-space:nowrap; font-size:clamp(.58rem,1.5vw,.84rem);font-weight:700;
  padding:5px 10px;color:#fff;border-radius:30px;background:#452b31ad;
  text-shadow:0 1px 5px #302024;}
.motion-tile:hover img{filter:saturate(1.12) brightness(1.03);transform:scale(1.11) rotate(.5deg)!important}
.hero-gallery .hero-photo:hover {box-shadow:0 20px 44px #5c3b3d68; border-color:#d4b696}
.hero-gallery .hero-photo:focus-visible{outline:3px solid #85545b;outline-offset:4px}
.collection-grid .collection-card {border-radius:25px;overflow:hidden}
.collection-grid .col-photo.photo-cycle{
  height:auto!important;aspect-ratio:2/1;display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;
  position:relative; isolation:isolate; background:#eaded0;
}
.collection-grid .card-photo-tile{aspect-ratio:1/1; min-width:0;}
.collection-grid .col-photo .col-count{position:absolute;z-index:5;left:12px;top:12px;
  background:#fff8eced;color:#65424a;border-radius:20px;padding:6px 12px;font-size:.67rem;letter-spacing:.08em;
  box-shadow:0 4px 14px #51403620;}
.collection-grid .col-photo.photo-cycle .motion-tile img{width:100%;height:100%;object-fit:cover;}
.collection-card:hover .col-photo .motion-tile img{filter:contrast(1.02) saturate(1.06)}
/* Sutil luz animada; no tapa textos ni cambia enlaces. */
.hero-gallery .hero-photo::after, .collection-grid .card-photo-tile::after {
  content:"";position:absolute;z-index:2;inset:0;pointer-events:none;
  background:linear-gradient(118deg,transparent 20%,#ffffff6b 48%,transparent 68%);
  transform:translateX(-150%);animation:glimmer 9s linear infinite;
  animation-delay:calc(var(--tile-index) * 1.1s);
}
@keyframes photo-drift{from{transform:scale(1.015) translate(-1%,-.8%)}to{transform:scale(1.14) translate(1%,.9%)}}
@keyframes glimmer{0%,35%{transform:translateX(-150%)}50%,100%{transform:translateX(160%)}}
@keyframes tile-arrive{from{opacity:0;transform:translateY(32px) scale(.93)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:780px){
 .hero-gallery.photo-cycle{width:min(490px,100%);grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;
   margin:18px auto 0;height:auto!important}
 .hero-gallery .hero-photo.motion-tile{border-radius:17px!important; border-width:3px}
 .hero-gallery .hero-photo>span{font-size:.75rem;bottom:7px;padding:4px 10px}
 .collection-grid .col-photo.photo-cycle{height:auto!important}
}
@media(max-width:530px){
 .hero-gallery.photo-cycle{width:min(370px,100%);gap:9px;height:auto!important}
 .collection-grid .col-photo.photo-cycle{height:auto!important}
 .collection-grid .collection-card{border-radius:23px}
}
@media(prefers-reduced-motion:reduce){
 .motion-tile img.layer-one,.motion-tile img.layer-two{animation:none!important;transition:none!important}
 .hero-gallery .hero-photo.motion-tile,.hero-gallery .hero-photo::after,.collection-grid .card-photo-tile::after{animation:none!important}
 .motion-tile:hover img{transform:none!important}
}

/* 03/11: transiciones individuales sin salto de todas las fotografías */
.motion-tile img.layer-one,.motion-tile img.layer-two {transition:opacity 2.1s cubic-bezier(.3,0,.25,1),filter 1.3s ease,transform 1.5s ease;animation-duration:19s;animation-timing-function:ease-in-out}
.photo-cycle .motion-tile.is-phase-two img.layer-one {opacity:0}
.photo-cycle .motion-tile.is-phase-two img.layer-two {opacity:1}
.photo-cycle .motion-tile.is-phase-two img {animation-direction:alternate-reverse}
/* El área ya no cambia de fase: cada mosaico controla sus propias fotografías. */
@keyframes photo-drift {from {transform:scale(1.018) translate(-.45%,-.35%)}to {transform:scale(1.075) translate(.45%,.45%)}}
.hero-gallery .hero-photo::after,.collection-grid .card-photo-tile::after {animation-duration:16s;opacity:.55}
@media (min-width:781px) and (max-width:1100px){
 .header .nav-toggle {display:flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;border:1px solid #d8c3b1;border-radius:10px;background:#fff9f1}
 .header .nav-toggle span {width:21px;height:2px;background:#785a51;align-self:center}
 .header nav {position:absolute;top:91px;left:0;right:0;padding:20px 25px 28px;display:none;flex-direction:column;align-items:stretch;gap:18px;background:#fffbf7;box-shadow:0 18px 35px #4c333b24}
 .header nav.open {display:flex}
}
