/* Fonts já vêm do Google Fonts no */ body { font-family: "Inter", sans-serif; } h1, h2, h3, .title { font-family: "Poppins", sans-serif; } html { scroll-behavior: smooth; } html, body { overflow-x: hidden; } /* ===== Slideshow ===== */ .slideshow { position: relative; aspect-ratio: 16/9; border-radius: 0.75rem; overflow: hidden; } .slideshow-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.04); transition: opacity 0.9s cubic-bezier(0.2, 0.6, 0.2, 1), transform 8s ease-out, filter 0.9s ease; filter: saturate(1.02) contrast(1.02); will-change: opacity, transform, filter; } .slideshow-img.is-active { opacity: 1; transform: scale(1); z-index: 2; } .slideshow-img.is-prev { z-index: 1; } .slideshow-vignette { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.15)); z-index: 3; } /* ===== Provas (carrossel) ===== */ :root { --tile-h: 260px; } @media (min-width: 640px) { :root { --tile-h: 300px; } } @media (min-width: 1024px) { :root { --tile-h: 320px; } } .proof-card { height: var(--tile-h); width: calc(var(--tile-h) * 9 / 16); border-radius: 0.75rem; overflow: hidden; background: #0f172a; position: relative; flex: 0 0 auto; } .proof-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 0.3s ease; } .proof-card.loaded img { opacity: 1; } /* ===== Marquee (letreiro) ===== */ @keyframes v-marquee { 0% { transform: translateX(0%); } 100% { transform: translateX(-50%); } } .animate-v-marquee { animation: v-marquee 60s linear infinite; } /* ===== Micro animação global ===== */ @keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } .animate-fade-in-up { animation: fadeInUp 0.4s ease-out; } /* logos das faculdades */ #faculdades img { transition: transform 0.25s ease, opacity 0.25s ease; opacity: 0.85; } #faculdades img:hover { transform: scale(1.06); opacity: 1; } /* CTA do herói "Quero saber mais!" - respiração suave */ @keyframes breathe { 0%, 100% { transform: translateZ(0) scale(1); } 50% { transform: translateZ(0) scale(1.03); } } .cta-breathe { animation: breathe 3s ease-in-out infinite; }