/* ESPECIALISTA SEO ANGOLA — Custom Styles */

/* ========== HERO SECTION ========== */
.hero-section {
    animation: fadeInUp 0.8s ease-out;
}

.hero-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: radial-gradient(circle at 20% 50%, rgba(232, 119, 34, 0.05) 0%, transparent 50%),
                radial-gradient(circle at 80% 80%, rgba(30, 144, 255, 0.05) 0%, transparent 50%);
    pointer-events: none;
}

/* ========== ACCORDION STYLING ========== */
.accordion-button {
    padding: 20px;
    font-weight: 600;
    transition: all 0.25s ease;
}

.accordion-button:not(.collapsed) {
    background: #0D1F38;
    color: #E87722;
    border-bottom: 1px solid rgba(232, 119, 34, 0.25);
    box-shadow: none;
}

.accordion-button:focus {
    border-color: #E87722;
    box-shadow: 0 0 0 0.25rem rgba(232, 119, 34, 0.25);
}

.accordion-button::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23E87722'%3e%3cpath fill-rule='evenodd' d='M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14zm3.21-7.97a.75.75 0 0 0-1.042-.018l-. -1.068V5.75a.75.75 0 0 0-1.5 0v2.69L5.75 6.75a.75.75 0 0 0-1.06 1.061l2.5 2.5a.75.75 0 0 0 1.06 0l2.5-2.5a.75.75 0 0 0-.02-1.042z'/%3e%3c/svg%3e");
    transform: rotate(0deg);
}

.accordion-button:not(.collapsed)::after {
    transform: rotate(-180deg);
}

/* ========== CARD HOVER EFFECTS ========== */
[style*="background: #0D1F38"] {
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

[style*="background: #0D1F38"]:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 50px rgba(232, 119, 34, 0.15);
    border-color: rgba(232, 119, 34, 0.5) !important;
}

/* ========== BUTTON STYLES ========== */
a[href*="wa.me"] {
    position: relative;
    overflow: hidden;
}

a[href*="wa.me"]::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    transform: translate(-50%, -50%);
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    transition: width 0.6s, height 0.6s;
}

a[href*="wa.me"]:hover::before {
    width: 300px;
    height: 300px;
}

a[style*="border: 2px solid rgba(255, 255, 255, 0.3)"] {
    transition: all 0.25s ease;
}

a[style*="border: 2px solid rgba(255, 255, 255, 0.3)"]:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: #E87722 !important;
    color: #E87722 !important;
}

.accordion-button:not(.collapsed) .accordion-icon::before {
  content: "\f2ea"; /* bi-dash-circle */
}

/* ========== ANIMATIONS ========== */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(40px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(40px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* Staggered animations */
.col-lg-5 > * {
    animation: fadeInUp 0.8s ease-out backwards;
}

.col-lg-5 > *:nth-child(1) { animation-delay: 0.1s; }
.col-lg-5 > *:nth-child(2) { animation-delay: 0.2s; }
.col-lg-5 > *:nth-child(3) { animation-delay: 0.3s; }
.col-lg-5 > *:nth-child(4) { animation-delay: 0.4s; }

/* ========== MOBILE RESPONSIVENESS ========== */
@media (max-width: 768px) {
    /* Hero section mobile */
    .hero-section {
        min-height: 120vh !important;
        padding: 40px 0;
    }
    
    /* Scale decorative elements on mobile */
    [style*="position: absolute"] {
        transform: scale(0.65) !important;
        transform-origin: center;
    }
    
    /* Position adjustments for small screens */
    .col-lg-7 {
        margin-top: 40px;
    }
    
    /* Hero decorative elements repositioned */
    [style*="top: 24px; right: 24px"] {
        top: 12px !important;
        right: 12px !important;
        transform: scale(0.65) !important;
    }
    
    [style*="bottom: 24px; left: 24px"] {
        bottom: 12px !important;
        left: 12px !important;
        transform: scale(0.65) !important;
    }
    
    /* Gradient circles on mobile */
    [style*="position: absolute; top: -10%"] {
        width: 250px !important;
        height: 250px !important;
    }
    
    [style*="position: absolute; bottom: 5%"] {
        width: 300px !important;
        height: 300px !important;
    }
    
    /* Grid layout mobile */
    [style*="display: grid; grid-template-columns"] {
        grid-template-columns: 1fr !important;
    }
    
    /* Text sizing mobile */
    h1 {
        font-size: 2rem !important;
    }
    
    h2 {
        font-size: 1.5rem !important;
    }
    
    p {
        font-size: 0.95rem !important;
    }
    
    /* Button layout mobile */
    [style*="display: flex; gap: 16px"] {
        flex-direction: column;
    }
    
    [style*="display: flex; gap: 16px"] a {
        width: 100%;
        text-align: center;
    }
    
    /* Stats mobile */
    [style*="display: flex; gap: 24px"] {
        flex-direction: column;
        gap: 16px !important;
    }
    
    [style*="border-left: 1px solid rgba(255, 255, 255, 0.1)"] {
        border-left: none !important;
        padding-left: 0 !important;
    }
    
    /* Card grid mobile */
    [style*="display: grid; grid-template-columns: repeat(auto-fit"] {
        grid-template-columns: 1fr !important;
    }
    
    /* Accordion mobile */
    .accordion-button {
        padding: 16px !important;
        font-size: 0.95rem !important;
    }
    
    .accordion-body {
        padding: 16px !important;
        font-size: 0.9rem !important;
    }
    
    /* Section padding mobile */
    section {
        padding: 64px 0 !important;
    }
    
    /* Container mobile */
    .container {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

/* ========== REDUCED MOTION SUPPORT ========== */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* ========== PRINT STYLES ========== */
@media print {
    .navbar,
    footer,
    [style*="display: flex; gap: 16px"],
    [class*="btn"] {
        display: none !important;
    }
    
    section {
        page-break-inside: avoid;
    }
}