/* ===== Camada de movimento (V1 "Mágica delicada") ===== */
.hero { overflow: hidden; }
.glitter { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.trail { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 20; /* camada: rastro de brilho */ }
.hero__line { display: block; }
.hero__title .ch { display: inline-block; white-space: pre; }
.hero__media { perspective: 1200px; }
.hero__media img { transition: transform 1s var(--ease); will-change: transform; }

/* cartas que orbitam a foto */
.orbit-card {
  position: absolute; width: clamp(54px, 6vw, 82px); aspect-ratio: 5 / 7; border-radius: 10px;
  background: #fff5fa; border: 2px solid var(--accent); box-shadow: 0 18px 40px -12px rgb(237 40 145 / .55);
  display: grid; place-items: center; color: var(--accent); pointer-events: none;
}
.orbit-card b { position: absolute; top: 6px; left: 8px; font-size: clamp(12px, 1.2vw, 16px); font-weight: 700; line-height: 1; }
.orbit-card i { font-style: normal; font-size: clamp(24px, 2.6vw, 36px); line-height: 1; }
.orbit-card--1 { top: 8%; left: -6%; --r: -14deg; }
.orbit-card--2 { bottom: 10%; right: -5%; --r: 12deg; }
.orbit-card--3 { top: -5%; right: 18%; --r: 6deg; color: #1a0712; border-color: #1a0712; }
@media (max-width: 899px) { .orbit-card--1 { left: 2%; } .orbit-card--2 { right: 2%; } .orbit-card--3 { top: 2%; } }

/* cartões dos shows com brilho que segue o mouse */
.tile::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; border-radius: inherit; background: radial-gradient(380px circle at var(--mx, 50%) var(--my, 0%), rgb(244 150 191 / .22), transparent 45%); opacity: 0; transition: opacity .4s; }
.tile:hover::before { opacity: 1; }

@media (prefers-reduced-motion: no-preference) {
  .js .hero__title .ch { opacity: 0; transform: translateY(.45em) rotate(6deg); filter: blur(12px); animation: letra 1.1s var(--ease) forwards; animation-delay: calc(.15s + var(--c) * 45ms); }
  .js .hero__title strong .ch { animation-name: letra, brilho; animation-duration: 1.1s, 3.2s; animation-delay: calc(.15s + var(--c) * 45ms), calc(1.6s + var(--c) * 80ms); animation-iteration-count: 1, infinite; animation-timing-function: var(--ease), ease-in-out; }
  @keyframes letra { to { opacity: 1; transform: none; filter: none; } }
  @keyframes brilho { 0%, 70%, 100% { text-shadow: none; } 80% { text-shadow: 0 0 18px rgb(255 214 236 / .95), 0 0 2px #fff; } }
  .orbit-card { animation: flutua 6s ease-in-out infinite; }
  .orbit-card--2 { animation-duration: 7.5s; animation-delay: -2s; }
  .orbit-card--3 { animation-duration: 5.2s; animation-delay: -3.5s; }
  @keyframes flutua { 0%, 100% { transform: translate3d(0, 0, 0) rotate(var(--r)); } 50% { transform: translate3d(6px, -16px, 0) rotate(calc(var(--r) * -1)); } }
  .js .masonry img { clip-path: inset(100% 0 0 0); transition: clip-path 1.2s var(--ease), transform 1s var(--ease); }
  .js .masonry button.is-in img { clip-path: inset(0 0 0 0); }
}

/* a foto do Sobre cresce no efeito de paralaxe: recorta dentro da moldura */
.about__media { overflow: hidden; border-radius: var(--r-media); }

/* celular: área de toque confortável nos contatos */
.contact__list a { min-height: 44px; padding: 0 6px; }
