/* ============================================================
   Unitive CAE — Custom Styles
   ============================================================ */

/* Base */
html {
    scroll-behavior: smooth;
    scroll-padding-top: 4rem;
}
body {
    font-family: 'Plus Jakarta Sans', sans-serif;
    scroll-behavior: smooth;
}

/* Hero overlay */
.hero-overlay {
    background: linear-gradient(to right, rgba(15, 23, 42, 0.95), rgba(15, 23, 42, 0.7));
}

/* ── Custom Brand Colors ── */
.text-brand          { color: #fe5800; }
.bg-brand            { background-color: #fe5800; }
.border-brand        { border-color: #fe5800; }
.hover-bg-brand:hover { background-color: #e65000; }
.focus-border-brand:focus { border-color: #fe5800; }

/* ── Auto-Scroll Logo Strip ── */
.logo-scroll-container {
    -webkit-mask-image: linear-gradient(to right, transparent, black 15%, black 85%, transparent);
    mask-image: linear-gradient(to right, transparent, black 15%, black 85%, transparent);
}
.logo-track {
    animation: scroll-x 30s linear infinite;
    display: flex;
    width: max-content;
}
.logo-track:hover {
    animation-play-state: paused;
}
@keyframes scroll-x {
    0%   { transform: translateX(0); }
    100% { transform: translateX(calc(-50% - 1.5rem)); }
}

/* ── Hero Background Crossfade ── */
.hero-slider {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    background-color: #0f172a;
}
.hero-slider img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    animation: heroFade 15s infinite;
}

/* Stagger the 3 hero images */
.hero-slider img:nth-child(1) { animation-delay: 0s; }
.hero-slider img:nth-child(2) { animation-delay: 5s; }
.hero-slider img:nth-child(3) { animation-delay: 10s; }

@keyframes heroFade {
    0%   { opacity: 0; transform: scale(1.05); }
    10%  { opacity: 0.6; transform: scale(1.02); }
    33%  { opacity: 0.6; transform: scale(1); }
    43%  { opacity: 0; transform: scale(1.05); }
    100% { opacity: 0; }
}