@font-face { font-family: Fredoka; font-style: normal; font-weight: 300 700; font-display: swap; src: url('./assets/fredoka-variable.ttf') format('truetype'); }
.fiestas-letter { display: inline-block; transform-origin: 50% 85%; }
.pet-photo { container-type: inline-size; }
.pet-v3 .pet-letter-title { position: absolute; inset: 0; z-index: 1; margin: 0; color: #fff0d0; font-family: Fredoka,'DM Sans',sans-serif; font-weight: 700; font-size: 18.6cqw; line-height: 1; letter-spacing: -.055em; pointer-events: none; }
.pet-letter-place { position: absolute; left: var(--x); top: var(--y); transform: translateX(-50%) rotate(var(--angle)); }
.pet-letter { display: block; transform-origin: 50% 85%; }
.pet-foreground { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; z-index: 2; pointer-events: none; }
.pet-breath-canvas { z-index: 3; }
.pet-foreground,.pet-breath-canvas { mask-image: url('./assets/mejoras-v3/mascotas-primer-plano-v2.webp'); mask-size: 100% 100%; mask-repeat: no-repeat; }
.pet-photo.is-alive .pet-foreground { opacity: 0; }
.pet-v3 .pet-copy { left: 7.5%; width: 34%; }
.others-v3 .other-copy { left: 6.5%; top: 16%; width: 38%; }
.others-v3 .other-copy h2 { font: 700 clamp(66px,7.7vw,150px)/.98 'DM Sans',sans-serif; letter-spacing: -.06em; margin: 0 0 30px; max-width: none; }
.other-word { display: block; white-space: nowrap; }
.other-letter { display: inline-block; }
.others-v3 .other-copy .eyebrow { margin-bottom: 23px; font-size: clamp(14px,1.2vw,21px); }
.others-v3 .scene-detail p { max-width: 27ch; font-size: clamp(15px,1.4vw,24px); }
.other-lamp-light { z-index: 1; opacity: .7; background: radial-gradient(ellipse 14% 19% at 88% 46%,#ffd38350,transparent 72%); mix-blend-mode: screen; }
@media(min-width:1101px) { .watch-v3 .watch-copy { left: 6.5%; width: 44%; } }
@media(max-width:760px),(max-width:1100px) and (max-aspect-ratio:1/1) {
  .pet-v3 { background: #df7008; }
  .pet-photo .pet-photo-source { mask-image: linear-gradient(transparent,#000 22%); }
  .pet-v3 .pet-photo { width: min(250%,1100px); left: calc(50% - min(167.5vw,737px)); }
  .pet-v3 .pet-letter-title { inset: auto; top: 9%; left: 6%; width: 88%; height: 15%; font-size: min(19vw,110px); }
  .pet-v3 .pet-copy { left: 8%; width: 84%; }
  .world-frame .others-v3 { display: flex; flex-direction: column; height: auto; min-height: 100svh; padding: 100px 0 70px; }
  .others-v3 .other-copy { position: relative; top: auto; left: auto; width: 82%; margin: 0 auto; order: 1; }
  .others-v3 .other-photo { position: relative; inset: auto; width: min(250vw,1100px); height: auto; flex: none; aspect-ratio: 2; margin: 28px 0 0 calc(50% - min(167.5vw,737px)); order: 2; }
  .others-v3 .other-photo .scene-bg { mask-image: linear-gradient(transparent,#000 12%); }
  .others-v3 .other-copy h2 { font-size: clamp(54px,15.5vw,100px); line-height: .94; margin-bottom: 20px; }
  .others-v3 .other-copy .eyebrow { font-size: 14px; margin-bottom: 16px; }
  .others-v3 .scene-detail p { font-size: 14px; }
}
@media(prefers-reduced-motion:reduce) {
  .pet-photo.is-alive .pet-foreground { opacity: 1; }
}
