/* annual reports css */

/* =========================================
   LUXURY MULTICOLOR REPORTS UI
   ORANGE + BLUE + YELLOW + CYAN
========================================= */

.annual-reports,
.annual-reports * {
    box-sizing: border-box;
}

/* Main Section */

.annual-reports {
    position: relative !important;
    width: 100% !important;
    padding: 85px 30px !important;
    margin-top: 60px !important;
    overflow: hidden !important;
    border-radius: 32px !important;

    background:
        radial-gradient(circle at top left, rgba(249,115,22,0.20), transparent 35%),
        radial-gradient(circle at top right, rgba(250,204,21,0.18), transparent 35%),
        radial-gradient(circle at bottom right, rgba(6,182,212,0.18), transparent 35%),
        radial-gradient(circle at bottom left, rgba(37,99,235,0.18), transparent 35%),
        linear-gradient(135deg, #fff9f2, #fefce8, #eefcff, #eff6ff) !important;

    box-shadow:
        0 12px 45px rgba(37,99,235,0.10),
        0 10px 35px rgba(249,115,22,0.10),
        inset 0 1px 0 rgba(255,255,255,0.7) !important;

    font-family: 'Poppins', sans-serif !important;
}

/* Decorative Glow Effects */

.annual-reports::before,
.annual-reports::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    z-index: 0;
}

.annual-reports::before {
    width: 320px;
    height: 320px;
    background: rgba(250,204,21,0.22);
    top: -120px;
    left: -100px;
}

.annual-reports::after {
    width: 300px;
    height: 300px;
    background: rgba(6,182,212,0.22);
    bottom: -120px;
    right: -100px;
}

/* Content Layer */

.annual-reports > * {
    position: relative;
    z-index: 2;
}

/* Heading */

.annual-reports h2 {
    text-align: center !important;
    font-size: 3rem !important;
    font-weight: 800 !important;
    margin-bottom: 18px !important;

    background: linear-gradient(
        90deg,
        #f97316,
        #facc15,
        #06b6d4,
        #2563eb
    );

    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    letter-spacing: 1px !important;
}

/* Underline */

.annual-reports h2::after {
    content: "";
    display: block;

    width: 130px;
    height: 6px;

    margin: 18px auto 0;

    border-radius: 50px;

    background: linear-gradient(
        90deg,
        #f97316,
        #facc15,
        #06b6d4,
        #2563eb
    );
}

/* Intro Paragraph */

.annual-reports p {
    text-align: center !important;
    color: #475569 !important;

    font-size: 1.05rem !important;
    line-height: 1.9 !important;

    max-width: 860px !important;
    margin: 0 auto 55px !important;
}

/* Grid Layout */

.annual-reports .reports-container {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
    gap: 32px !important;
}

/* Report Card */

.annual-reports .report-card {
    position: relative !important;
    overflow: hidden !important;

    background: rgba(255,255,255,0.82) !important;

    backdrop-filter: blur(15px) !important;

    padding: 32px 26px !important;

    border-radius: 28px !important;

    border: 1px solid rgba(255,255,255,0.45) !important;

    box-shadow:
        0 12px 35px rgba(37,99,235,0.10),
        0 10px 30px rgba(249,115,22,0.08),
        0 8px 25px rgba(6,182,212,0.08),
        inset 0 1px 0 rgba(255,255,255,0.6) !important;

    transition: all 0.45s ease !important;
}

/* Animated Top Border */

.annual-reports .report-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: -100%;

    width: 100%;
    height: 6px;

    background: linear-gradient(
        90deg,
        #f97316,
        #facc15,
        #06b6d4,
        #2563eb,
        #f97316
    );

    transition: 0.6s ease;
}

.annual-reports .report-card:hover::before {
    left: 0;
}

/* Card Hover */

.annual-reports .report-card:hover {
    transform: translateY(-10px) scale(1.02) !important;

    box-shadow:
        0 25px 55px rgba(37,99,235,0.18),
        0 18px 40px rgba(249,115,22,0.16),
        0 14px 35px rgba(6,182,212,0.14) !important;
}

/* Card Title */

.annual-reports .report-card h3 {
    font-size: 1.45rem !important;
    font-weight: 700 !important;

    margin-bottom: 14px !important;

    color: #0f172a !important;
}

/* Card Description */

.annual-reports .report-card p {
    text-align: left !important;

    color: #64748b !important;

    line-height: 1.8 !important;
    font-size: 0.98rem !important;

    margin-bottom: 28px !important;
}

/* Buttons Wrapper */

.annual-reports .report-buttons {
    display: flex !important;
    gap: 15px !important;
    flex-wrap: wrap !important;
}

/* All Buttons */

.annual-reports .report-buttons a,
.annual-reports button {
    position: relative;
    overflow: hidden;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 13px 24px !important;

    border-radius: 16px !important;

    text-decoration: none !important;

    font-size: 0.96rem !important;
    font-weight: 600 !important;

    transition: all 0.35s ease !important;
}

/* Shine Hover Effect */

.annual-reports .report-buttons a::before {
    content: "";

    position: absolute;

    top: 0;
    left: -120%;

    width: 80px;
    height: 100%;

    background: rgba(255,255,255,0.35);

    transform: skewX(-25deg);

    transition: 0.6s;
}

.annual-reports .report-buttons a:hover::before {
    left: 140%;
}

/* View Button */

.annual-reports .view-btn {
    background: linear-gradient(
        135deg,
        #f97316,
        #facc15,
        #06b6d4,
        #2563eb
    ) !important;

    color: white !important;

    box-shadow:
        0 12px 24px rgba(249,115,22,0.22),
        0 10px 22px rgba(6,182,212,0.18),
        0 8px 20px rgba(37,99,235,0.18),
        inset 0 1px 0 rgba(255,255,255,0.3) !important;
}

.annual-reports .view-btn:hover {
    transform: translateY(-4px) scale(1.03) !important;

    box-shadow:
        0 18px 38px rgba(249,115,22,0.28),
        0 15px 32px rgba(6,182,212,0.22),
        0 12px 28px rgba(37,99,235,0.25) !important;
}

/* Download Button */

.annual-reports .download-btn {
    background: rgba(255,255,255,0.75) !important;

    color: #2563eb !important;

    border: 2px solid rgba(6,182,212,0.20) !important;

    backdrop-filter: blur(8px) !important;
}

.annual-reports .download-btn:hover {
    background: linear-gradient(
        135deg,
        #2563eb,
        #06b6d4,
        #facc15,
        #f97316
    ) !important;

    color: white !important;

    border-color: transparent !important;

    transform: translateY(-4px) !important;
}

/* Fade Animation */

.annual-reports .report-card {
    animation: fadeUp 0.8s ease both;
}

@keyframes fadeUp {

    from {
        opacity: 0;
        transform: translateY(35px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Mobile Responsive */

@media (max-width: 768px) {

    .annual-reports {
        padding: 55px 18px !important;
        border-radius: 22px !important;
    }

    .annual-reports h2 {
        font-size: 2.2rem !important;
    }

    .annual-reports p {
        font-size: 0.98rem !important;
    }

    .annual-reports .reports-container {
        gap: 24px !important;
    }

    .annual-reports .report-buttons {
        flex-direction: column !important;
    }

    .annual-reports .report-buttons a,
    .annual-reports button {
        width: 100% !important;
    }
}