/* Native home title treatment and animation, scoped to the visual study. */
/* A three-face reel rotates upward without changing the headline's layout box. */
/* Native logo treatment: stacked white/gold letters with scaled extrusion. */
.mario-study .reference-title-roulette {
 /* Triangular reel depth = its fixed two-line height / (2 * sqrt(3)). */
 --headline-depth: .62065em;
 position: relative; width: 100%; height: 2.15em; perspective: 800px; perspective-origin: 50% 50%;
 font-size: min(52px, calc((100vw - 64px) / 6.6));
 font-family: var(--sb-display); font-weight: 800; letter-spacing: -.02em; text-shadow: none;
}
.mario-study .reference-title-rotor {
 position: relative; display: block; width: 100%; height: 100%; transform-style: preserve-3d;
 transform: translateZ(calc(-1 * var(--headline-depth))) rotateX(0deg);
}
.mario-study .reference-title-face {
 position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
 backface-visibility: hidden; -webkit-backface-visibility: hidden; opacity: 0;
}
.mario-study .reference-title-line {
 display: flex; flex-direction: column; align-items: center; gap: .06em; padding-bottom: .12em;
 line-height: .88; white-space: nowrap; transform: translateZ(0);
 backface-visibility: hidden; -webkit-backface-visibility: hidden;
}
.mario-study .reference-title-top {
 display: block; color: #fff;
 text-shadow: 0 .024em 0 #dfe8ff, 0 .048em 0 #bccbf3, 0 .072em 0 #9aafe0,
  0 .096em 0 #7690c9, 0 .12em 0 #5670ad, 0 .21em .33em rgba(0,10,50,.45);
}
.mario-study .reference-title-bottom {
 display: block; color: hsl(50,100%,48%);
 text-shadow: 0 .024em 0 hsl(50,100%,28%), 0 .048em 0 hsl(50,100%,28%),
  0 .072em 0 hsl(50,100%,28%), 0 .096em 0 hsl(50,100%,28%),
  0 .12em 0 rgba(0,0,0,.35), 0 .21em .33em rgba(0,10,50,.45);
}
.mario-study .reference-title-face:nth-child(1) { transform: rotateX(0deg) translateZ(var(--headline-depth)); opacity: 1; }
.mario-study .reference-title-face:nth-child(2) { transform: rotateX(-120deg) translateZ(var(--headline-depth)); }
.mario-study .reference-title-face:nth-child(3) { transform: rotateX(-240deg) translateZ(var(--headline-depth)); }
.mario-study :is(.reference-title-roulette,.opening-title-roulette).is-ready .reference-title-rotor { animation: reference-title-roll 9s cubic-bezier(.22,.75,.3,1) infinite; animation-play-state: paused; }
/* Hide the idle back faces completely to prevent thin rasterized text edges. */
.mario-study :is(.reference-title-roulette,.opening-title-roulette).is-ready .reference-title-face { animation: reference-title-face-visibility 9s steps(1,end) infinite; animation-play-state: paused; }
.mario-study :is(.reference-title-roulette,.opening-title-roulette).is-ready .reference-title-face:nth-child(2) { animation-delay: -6s; }
.mario-study :is(.reference-title-roulette,.opening-title-roulette).is-ready .reference-title-face:nth-child(3) { animation-delay: -3s; }
.mario-study :is(.reference-title-roulette,.opening-title-roulette).is-ready.is-rolling :is(.reference-title-rotor,.reference-title-face) { animation-play-state: running; }
@keyframes reference-title-roll {
 0%,26% { transform: translateZ(calc(-1 * var(--headline-depth))) rotateX(0deg); }
 33.333333%,59.333333% { transform: translateZ(calc(-1 * var(--headline-depth))) rotateX(120deg); }
 66.666667%,92.666667% { transform: translateZ(calc(-1 * var(--headline-depth))) rotateX(240deg); }
 100% { transform: translateZ(calc(-1 * var(--headline-depth))) rotateX(360deg); }
}
@keyframes reference-title-face-visibility {
 0%,92.666667%,100% { opacity: 1; }
 33.333333% { opacity: 0; }
}
@media (min-width: 768px) { .mario-study .reference-title-roulette { font-size: 76px; } }
@media (prefers-reduced-motion: reduce) {
 .mario-study :is(.reference-title-roulette,.opening-title-roulette) :is(.reference-title-rotor,.reference-title-face) { animation: none !important; }
}

/* Fit the original title inside the existing heading column. */
.game-section .section-heading > div { flex:1; min-width:0; container-type:inline-size; }
@media (min-width:768px) { .mario-study .reference-title-roulette { font-size:min(76px,calc(100cqi / 6.6)); } }

/* Give the supporting copy a clear payoff and a compact reading rhythm. */
.mario-study .reference-game-tagline {
 display:grid; justify-items:center; gap:9px;
 color:#fff; font:500 clamp(16px,1.5vw,19px)/1.45 "geologica-variable",sans-serif;
 letter-spacing:-.02em; text-transform:none; text-shadow:none; text-wrap:balance;
 margin:24px auto 0; max-width:600px; text-align:center;
}
.mario-study .game-tagline-intro { max-width:30ch; }
.mario-study .game-tagline-prize {
 display:block; color:var(--yellow);
 font-size:clamp(24px,6.5vw,40px); font-weight:900; line-height:1.12; letter-spacing:-.04em;
 text-transform:uppercase; transform:rotate(-1.5deg); text-shadow:0 3px 0 rgba(3,40,99,.4);
}
.mario-study .game-tagline-action {
 max-width:30ch; margin-top:10px; color:#e9f3ff;
 font-size:clamp(16px,1.4vw,18px); font-weight:450; line-height:1.5;
}
.mario-study .game-tagline-action strong { display:block; color:#fff; font-weight:800; }

/* The opening card keeps its existing Geologica heading and paragraph typography. */
.mario-study .opening-title-roulette {
 --headline-depth:.62354em;
 position:relative; width:100%; height:2.16em; perspective:800px; perspective-origin:50% 50%;
}
.mario-study .opening-title-roulette .reference-title-line { line-height:1.08; gap:0; padding-bottom:0; }
.mario-study .opening-title-roulette .reference-title-top { color:#1d1d1d; text-shadow:none; }
.mario-study .opening-title-roulette .reference-title-bottom { color:hsl(50,100%,48%); text-shadow:none; }

/* The standalone flip title borrows the oversized, flat lettering of “Só mais uma!”. */
.mario-study #game-title {
 font-family:"geologica-variable",sans-serif; font-weight:900;
 font-size:min(clamp(75px,13vw,190px),calc(100cqi / 6));
 letter-spacing:-.04em; color:#f0f0f0; transform:rotate(-3deg);
}
.mario-study #game-title .reference-title-line { line-height:1; gap:0; padding-bottom:0; }
.mario-study #game-title :is(.reference-title-top,.reference-title-bottom) { color:inherit; text-shadow:none; }
.mario-study #game-title .reference-title-bottom { color:var(--yellow); }
@media (min-width:768px) {
 .mario-study #game-title {
  width:90%; margin-inline:auto;
  font-size:min(clamp(75px,13vw,190px),calc(90cqi / 6));
 }
}