175 lines
3.2 KiB
CSS
175 lines
3.2 KiB
CSS
/* App-specific styles */
|
|
|
|
/* Smooth scroll behavior */
|
|
html {
|
|
scroll-behavior: smooth;
|
|
}
|
|
|
|
/* Selection color */
|
|
::selection {
|
|
background: rgba(203, 244, 0, 0.3);
|
|
color: inherit;
|
|
}
|
|
|
|
/* Focus styles for accessibility */
|
|
*:focus-visible {
|
|
outline: 2px solid #cbf400;
|
|
outline-offset: 2px;
|
|
}
|
|
|
|
/* Image loading placeholder */
|
|
img {
|
|
background: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%);
|
|
}
|
|
|
|
/* Prevent text selection on interactive elements */
|
|
button,
|
|
a {
|
|
-webkit-user-select: none;
|
|
user-select: none;
|
|
}
|
|
|
|
/* Line clamp utilities */
|
|
.line-clamp-2 {
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 2;
|
|
-webkit-box-orient: vertical;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.line-clamp-3 {
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 3;
|
|
-webkit-box-orient: vertical;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.line-clamp-4 {
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 4;
|
|
-webkit-box-orient: vertical;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* Responsive video container */
|
|
.video-container {
|
|
position: relative;
|
|
padding-bottom: 56.25%;
|
|
height: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* ============================================================================
|
|
GLOW BUTTON - Animacoes de brilho
|
|
============================================================================ */
|
|
|
|
/* Pulso de brilho no botao */
|
|
@keyframes glow-pulse {
|
|
0%, 100% {
|
|
box-shadow: 0 0 20px rgba(203, 244, 0, 0.4),
|
|
0 0 40px rgba(203, 244, 0, 0.2),
|
|
0 0 60px rgba(203, 244, 0, 0.1);
|
|
}
|
|
50% {
|
|
box-shadow: 0 0 30px rgba(203, 244, 0, 0.8),
|
|
0 0 60px rgba(203, 244, 0, 0.5),
|
|
0 0 90px rgba(203, 244, 0, 0.3),
|
|
0 0 120px rgba(203, 244, 0, 0.1);
|
|
}
|
|
}
|
|
|
|
/* Aura de brilho ao redor */
|
|
@keyframes glow-aura {
|
|
0%, 100% {
|
|
transform: scale(1);
|
|
opacity: 0.3;
|
|
}
|
|
50% {
|
|
transform: scale(1.15);
|
|
opacity: 0.6;
|
|
}
|
|
}
|
|
|
|
/* Brilho do icone */
|
|
@keyframes sparkle {
|
|
0%, 100% {
|
|
opacity: 1;
|
|
transform: scale(1) rotate(0deg);
|
|
}
|
|
25% {
|
|
opacity: 0.7;
|
|
transform: scale(1.2) rotate(10deg);
|
|
}
|
|
50% {
|
|
opacity: 1;
|
|
transform: scale(1) rotate(0deg);
|
|
}
|
|
75% {
|
|
opacity: 0.8;
|
|
transform: scale(1.1) rotate(-5deg);
|
|
}
|
|
}
|
|
|
|
.animate-glow-pulse {
|
|
animation: glow-pulse 2.5s ease-in-out infinite;
|
|
}
|
|
|
|
.animate-glow-aura {
|
|
animation: glow-aura 3s ease-in-out infinite;
|
|
}
|
|
|
|
.animate-sparkle {
|
|
animation: sparkle 2s ease-in-out infinite;
|
|
}
|
|
|
|
.video-container iframe,
|
|
.video-container video {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
/* Print styles */
|
|
@media print {
|
|
.nav-sticky,
|
|
.progress-bar,
|
|
button[aria-label="Voltar ao topo"] {
|
|
display: none !important;
|
|
}
|
|
|
|
section {
|
|
break-inside: avoid;
|
|
page-break-inside: avoid;
|
|
}
|
|
}
|
|
|
|
/* Reduced motion preferences */
|
|
@media (prefers-reduced-motion: reduce) {
|
|
*,
|
|
*::before,
|
|
*::after {
|
|
animation-duration: 0.01ms !important;
|
|
animation-iteration-count: 1 !important;
|
|
transition-duration: 0.01ms !important;
|
|
scroll-behavior: auto !important;
|
|
}
|
|
|
|
.animate-float,
|
|
.animate-pulse-glow,
|
|
.animate-gradient,
|
|
.animate-marquee {
|
|
animation: none !important;
|
|
}
|
|
}
|
|
|
|
/* High contrast mode support */
|
|
@media (prefers-contrast: high) {
|
|
.glass,
|
|
.glass-dark {
|
|
backdrop-filter: none;
|
|
background: rgba(14, 14, 14, 0.95);
|
|
}
|
|
}
|