/* ============================================
   PRIME MÍDIA — Custom Styles
   Complementa as classes do Tailwind CSS
   ============================================ */

/* Base */
body {
    font-family: 'Inter', sans-serif;
    background-color: #f5f5f4;
    color: #00254d;
    overflow-x: hidden;
}

.font-display {
    font-family: 'Oswald', sans-serif;
}

::selection {
    background-color: #F39241;
    color: white;
}

/* ── Reveal Animations ──────────────────────── */
.reveal {
    opacity: 0;
    transform: translateY(2rem);
    transition: all 1s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

.text-reveal-wrapper {
    overflow: hidden;
    display: inline-block;
    vertical-align: bottom;
    padding: 0.1em 0.3em;
    margin: -0.1em -0.3em;
}

.text-reveal-content {
    transform: translateY(110%);
    opacity: 0;
    transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1), opacity 1.2s ease;
    display: block;
}

.reveal-active .text-reveal-content {
    transform: translateY(0);
    opacity: 1;
}

/* ── Transition Delays ──────────────────────── */
.delay-100 { transition-delay: 0.1s; }
.delay-200 { transition-delay: 0.2s; }
.delay-300 { transition-delay: 0.3s; }
.delay-500 { transition-delay: 0.5s; }
.delay-700 { transition-delay: 0.7s; }
.delay-900 { transition-delay: 0.9s; }

/* ── Marquee Animation ──────────────────────── */
.marquee-container {
    display: flex;
    overflow: hidden;
    user-select: none;
}

.marquee-content {
    flex-shrink: 0;
    display: flex;
    justify-content: space-around;
    min-width: 100%;
    animation: scroll 40s linear infinite;
}

@keyframes scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-100%); }
}

/* ── Iconify alignment fix ──────────────────── */
iconify-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
}