/* /var/www/html/certto/site/assets/css/style.css */

/* Custom Utilities for Glassmorphism & Liquid Digital Feel */
.glass-panel {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.navbar-scrolled {
    background: rgba(255, 255, 255, 0.7) !important;
    backdrop-filter: blur(25px) saturate(180%);
    -webkit-backdrop-filter: blur(25px) saturate(180%);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
}

.navbar-scrolled .nav-link {
    color: #1f5293 !important;
}

.navbar-scrolled .nav-link:hover {
    color: #e77817 !important;
}

/* Estado Ativo (Luxuoso) */
.nav-link.active {
    color: white !important;
    background-color: #1f5293 !important;
}

.navbar-scrolled #mobile-menu-btn {
    color: #1f5293 !important;
}

/* Chrome-like focus glow */
.focus-glow-blue:focus {
    box-shadow: 0 0 20px rgba(31, 82, 147, 0.4);
}

/* Perspective for 3D Tilt */
.perspective-1000 {
    perspective: 1000px;
}

.tilt-element {
    transition: transform 0.1s ease-out;
    transform-style: preserve-3d;
}

/* Typing Effect Cursor */
.terminal-cursor {
    display: inline-block;
    width: 8px;
    height: 1.2em;
    background-color: #e77817;
    vertical-align: middle;
    animation: blink 1s step-end infinite;
    margin-left: 2px;
}

@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}

/* Syntax Highlighting Colors for the PHP Typing string */
.php-tag { color: #569CD6; }
.php-keyword { color: #C586C0; }
.php-func { color: #DCDCAA; }
.php-string { color: #CE9178; }
.php-var { color: #9CDCFE; }
.php-comment { color: #6A9955; font-style: italic; }
.php-op { color: #D4D4D4; }

/* Reveal Animations */
.reveal-up {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-left {
    opacity: 0;
    transform: translateX(-30px);
    transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-right {
    opacity: 0;
    transform: translateX(30px);
    transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-visible {
    opacity: 1;
    transform: translate(0, 0);
}

/* Smooth Scrolling Offset for Navbar */
html {
    scroll-padding-top: 100px;
}

/* Staggered Delay Utilities */
.delay-100 { transition-delay: 0.1s !important; }
.delay-200 { transition-delay: 0.2s !important; }
.delay-300 { transition-delay: 0.3s !important; }
.delay-400 { transition-delay: 0.4s !important; }
.delay-500 { transition-delay: 0.5s !important; }