/*
Theme Name: Calx System
Theme URI: https://calxsystem.com
Author: Calx System
Description: Multinational virtual assistant & business support company theme. 100% ACF-driven — every headline, section, color and card is editable from the WordPress dashboard.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
Text Domain: calx-system
Tags: business, corporate, virtual-assistant, outsourcing, acf
*/

/* ==========================================================================
   TYPOGRAPHY SYSTEM OVERRIDES - PREMIUM ENTERPRISE
   ========================================================================== */

/* 1. Main Headings (DM Sans) */
h1, h2, h3, h4, h5, h6, 
.calx-hero-stats strong, 
.calx-global-metrics strong, 
.calx-plan-price strong {
    font-family: var(--calx-font-heading) !important;
}
h1 { font-weight: 700 !important; }
h2 { font-weight: 600 !important; }
h3, h4, h5, h6 { font-weight: 600 !important; }

/* 2. Body Text (Inter) */
body, p, li, .calx-sec-sub, .calx-hero-sub {
    font-family: var(--calx-font-body) !important;
    font-weight: 400; 
}
strong, b {
    font-weight: 600 !important;
}

/* 3. Navigation & UI (Manrope) */
.calx-menu a {
    font-family: var(--calx-font-ui) !important;
    font-weight: 600 !important;
}

/* 4. Buttons (Manrope) */
.calx-btn {
    font-family: var(--calx-font-ui) !important;
    font-weight: 600 !important;
}

/* 5. Small Labels / Eyebrows (Manrope) */
.calx-eyebrow, 
.calx-hero-panel-head, 
.calx-logos-title, 
.calx-steps em, 
.calx-plan-badge {
    font-family: var(--calx-font-ui) !important;
    font-weight: 600 !important;
    letter-spacing: 0.05em !important; 
    text-transform: uppercase !important;
}

/* 6. Leadership Cards */
.calx-person h3 {
    font-family: var(--calx-font-heading) !important;
    font-weight: 600 !important;
}
.calx-person p, 
.calx-person small {
    font-family: var(--calx-font-body) !important;
    font-weight: 500 !important;
}
.calx-person small {
    font-weight: 400 !important;
}

/* 7. Blog (DM Sans titles, Inter body, Manrope metadata) */
.calx-post h3 {
    font-family: var(--calx-font-heading) !important;
    font-weight: 600 !important;
}
.calx-post p {
    font-family: var(--calx-font-body) !important;
    font-weight: 400 !important;
}
.calx-post-date {
    font-family: var(--calx-font-ui) !important;
    font-weight: 500 !important;
}


/* ==========================================================================
   ENTERPRISE DESIGN SYSTEM ENHANCEMENTS
   ========================================================================== */

/* 1. Global Page Transition */
@keyframes calxPageEnter {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}
body {
    animation: calxPageEnter 0.4s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

/* 2. Generous Spacing */
.calx-section {
    padding: clamp(5rem, 10vw, 8rem) 0 !important;
}

/* 3. Cards & Shadows (Restrained, subtle) */
.calx-card, .calx-tile, .calx-post {
    border-radius: 4px !important;
    border: 1px solid var(--calx-mist) !important;
    box-shadow: 0 4px 12px rgba(15, 27, 61, 0.02) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    overflow: hidden;
}
.calx-card:hover, .calx-post:hover {
    box-shadow: 0 12px 30px rgba(15, 27, 61, 0.06) !important;
    transform: translateY(-2px) !important;
}

/* 4. Images (Hover scale) */
.calx-img img, .calx-team-photo img, .calx-post-img img {
    transition: transform 0.4s ease !important;
}
.calx-card:hover .calx-img img, .calx-post:hover .calx-post-img img {
    transform: scale(1.02) !important;
}

/* 5. Buttons */
.calx-btn {
    border-radius: 4px !important;
    transition: all 0.25s ease !important;
}
.calx-btn:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(15, 27, 61, 0.08) !important;
}

/* 6. Navigation (Subtle hover) */
.calx-menu a {
    transition: color 0.2s ease !important;
}

/* 7. Reduced Motion Fallback */
@media (prefers-reduced-motion: reduce) {
    body, .calx-card, .calx-btn, .calx-img img {
        animation: none !important;
        transition: none !important;
        transform: none !important;
    }
}


/* 8. Scroll Animations */
.calx-fade-up {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s cubic-bezier(0.25, 1, 0.5, 1), transform 0.6s cubic-bezier(0.25, 1, 0.5, 1) !important;
}
.calx-fade-up.calx-in-view {
    opacity: 1;
    transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
    .calx-fade-up {
        transition: none !important;
        transform: none !important;
        opacity: 1 !important;
    }
}