/**
 * Company Page Template Styles - Quylo Child Theme
 */

/* ── Shimmer Text (matches FAQ section) ── */
.shimmer-text {
    background: linear-gradient(90deg, #00BFBD 0%, #E0F7FA 40%, #00BFBD 70%, #E0F7FA 100%);
    background-size: 200% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: company-shimmer-wave 3s linear infinite;
}
@keyframes company-shimmer-wave {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* ── Particle effect for banner ── */
.particle {
    position: absolute;
    border-radius: 50%;
    background: rgba(75, 192, 242, 0.15);
    pointer-events: none;
    animation: float-particle linear infinite;
}

@keyframes float-particle {
    0% { transform: translateY(0) scale(1); opacity: 0; }
    10% { opacity: 1; }
    90% { opacity: 1; }
    100% { transform: translateY(-100vh) scale(0.5); opacity: 0; }
}

/* ── Team card hover ── */
.team-card {
    transition: all 0.4s cubic-bezier(.4, 0, .2, 1);
}

.team-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 40px -15px rgba(75, 192, 242, .2);
}

/* Powerhouse team card: white bg, visible light gray border, gradient in footer only */
.powerhouse-team-card {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 20px rgba(0,0,0,.06);
    transition: all 0.4s cubic-bezier(.4, 0, .2, 1);
}

/* Footer area: soft gradient from white to pale cyan/teal (matches inspiration) */
.powerhouse-card-footer {
    background: linear-gradient(180deg, #ffffff 0%, rgba(240,249,255,0.6) 50%, rgba(0,191,189,0.1) 100%);
    border-radius: 0 0 1rem 1rem;
}

.powerhouse-team-card:hover {
    border-color: rgba(75, 192, 242, .3);
    box-shadow: 0 12px 32px -8px rgba(75, 192, 242, .15), 0 4px 20px rgba(0,0,0,.06);
}

/* ── Logo Marquee (auto-moving slider) ── */
.logo-marquee-wrapper {
    overflow: hidden;
    mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}

.logo-marquee-track {
    display: flex;
    align-items: center;
    gap: 3rem;
    width: max-content;
    animation: logo-marquee 30s linear infinite;
}

.logo-marquee-track:hover {
    animation-play-state: paused;
}

.logo-marquee-wrapper .powered-logo-wrap {
    flex-shrink: 0;
    width: 150px;
    height: 100px;
    border: 2px solid #d1d5db;
    border-radius: 0.5rem;
    padding: 1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.logo-marquee-wrapper .powered-logo-wrap img {
    aspect-ratio: 3 / 2;
}

@keyframes logo-marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* ── Who We Are: subtle AI/tech + law inspired bg ── */
.who-we-are-bg {
    background-color: #ffffff;
    background-image:
        linear-gradient(180deg, #ffffff 0%, rgba(255, 255, 255, 0.98) 30%, rgba(240, 249, 255, 0.6) 70%, #ffffff 100%),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cg fill='%234BC0F2' fill-opacity='0.04'%3E%3Ccircle cx='24' cy='24' r='1.5'/%3E%3Ccircle cx='0' cy='0' r='1.5'/%3E%3Ccircle cx='48' cy='0' r='1.5'/%3E%3Ccircle cx='0' cy='48' r='1.5'/%3E%3Ccircle cx='48' cy='48' r='1.5'/%3E%3C/g%3E%3C/svg%3E");
    background-size: 100% 100%, 48px 48px;
}
