/* 06 Giallo: wet black, crimson and emerald gel. Slow pushes, one sudden snap, titles through a slit. */
[data-world="giallo"] {
  --grain: 0.06;
  --title-style: italic;
  --enter: slow-push 1100ms cubic-bezier(.3, 0, .2, 1);
}
@keyframes slow-push { from { opacity: 0; transform: scale(1.025); } to { opacity: 1; transform: none; } }
@keyframes slit { from { clip-path: inset(49% 0 49% 0); } to { clip-path: inset(-20% -5% -20% -5%); } }
@keyframes rain-fall { to { background-position: -48px 160px; } }

[data-world="giallo"] .hero-title { animation: slit 1200ms cubic-bezier(.6, 0, .2, 1) both; }
[data-world="giallo"] .block.in .block-title { animation: slit 900ms cubic-bezier(.6, 0, .2, 1) both; }
[data-world="giallo"] .rain {
  position: absolute; inset: 0; opacity: 0.08;
  background: repeating-linear-gradient(105deg, transparent 0 15px, var(--ink) 15px 16px, transparent 16px 37px);
  animation: rain-fall 0.9s linear infinite;
}
/* crimson light from one side, emerald from the other */
[data-world="giallo"] .hero-fx::before {
  content: ""; position: absolute; inset: 0; mix-blend-mode: screen;
  background: linear-gradient(90deg, color-mix(in srgb, var(--fill) 30%, transparent), transparent 28%, transparent 72%, color-mix(in srgb, var(--spice) 26%, transparent));
}
/* the one sudden snap: a zoom on the hero still */
[data-world="giallo"] .hero-img img { transition: transform 140ms cubic-bezier(.7, 0, .3, 1); }
[data-world="giallo"] .hero-media:hover .hero-img img { transform: scale(1.06); }
/* black-leather sheen on buttons (kept above the label) */
[data-world="giallo"] .btn { background-image: linear-gradient(180deg, color-mix(in srgb, var(--on-fill) 16%, transparent), transparent 26%); }