/* ─── Ethereal Engineer — Main Theme Stylesheet ─────────────────────────── */

/* Base */
html.dark body,
body {
    background-color: #0c0e12;
    color: #f6f6fc;
    font-family: 'Inter', sans-serif;
    overflow-x: hidden;
    scroll-behavior: smooth;
}

/* Selection */
::selection {
    background-color: rgba(151, 169, 255, 0.3);
    color: #97a9ff;
}

/* ─── Utility Classes ───────────────────────────────────────────────────── */

.glass-card {
    backdrop-filter: blur(20px);
    background: rgba(23, 26, 31, 0.6);
    transition: background 0.3s ease;
}

.gradient-text {
    background: linear-gradient(135deg, #97a9ff 0%, #bf81ff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.wp-gradient-text {
    background: linear-gradient(135deg, #6236ff 0%, #9c42f4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.premium-shadow {
    box-shadow: 0 20px 60px rgba(246, 246, 252, 0.04);
}

/* Material Symbols */
.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    vertical-align: middle;
}

/* ─── Animations ────────────────────────────────────────────────────────── */

@keyframes float {
    0%,  100% { transform: translateY(0)     scale(1);    }
    50%        { transform: translateY(-20px) scale(1.05); }
}

.ethereal-float          { animation: float 10s ease-in-out infinite; }
.ethereal-float-delayed  { animation: float 12s ease-in-out infinite -2s; }

/* Scroll Reveal */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* Skill Cards */
.skill-card {
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1),
                border-color 0.3s ease,
                box-shadow 0.3s ease;
}
.skill-card:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 10px 40px -10px rgba(98, 54, 255, 0.3);
}

/* Project Lines */
.project-detail-line {
    width: 0;
    transition: width 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
.group:hover .project-detail-line {
    width: 100%;
}

/* Logic Reveal */
.logic-reveal {
    clip-path: inset(0 100% 0 0);
    transition: clip-path 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
.group:hover .logic-reveal {
    clip-path: inset(0 0 0 0);
}

/* Color Transitions */
.tonal-transition {
    transition: background-color 0.5s ease, border-color 0.5s ease;
}

/* ─── WordPress Core Fixes ──────────────────────────────────────────────── */

/* Remove WP admin bar gap */
#wpadminbar { z-index: 100000; }
.admin-bar nav.fixed { top: 32px; }
@media screen and (max-width: 782px) {
    .admin-bar nav.fixed { top: 46px; }
}

/* Hide WordPress default elements we don't need */
.wp-caption, .wp-caption-text, .gallery, .alignleft, .alignright, .aligncenter { display: none; }

/* Ensure images are responsive by default */
img { max-width: 100%; height: auto; }
