/*
 * SIMPES 4.0 - Stage 24R Website Home Final Polish
 * Scope: public website only. No database, route, middleware, RoleAccess, or controller changes.
 */

/* 1) Hero readability after overlay is reduced/removed */
#heroCarousel .hero-card,
.hero-card,
.hero-slide .hero-card,
.hero-slide [class*="hero-card"] {
    position: relative;
    max-width: min(780px, 92vw);
    padding: clamp(22px, 3vw, 42px) clamp(24px, 4vw, 52px);
    border-radius: 28px;
    background: linear-gradient(135deg, rgba(0, 80, 48, .70), rgba(0, 0, 0, .32));
    border: 1px solid rgba(255, 255, 255, .18);
    box-shadow: 0 22px 70px rgba(0, 0, 0, .24);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

#heroCarousel .hero-card::before,
.hero-card::before,
.hero-slide .hero-card::before,
.hero-slide [class*="hero-card"]::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: radial-gradient(circle at 16% 10%, rgba(255, 255, 255, .18), transparent 38%);
    pointer-events: none;
}

#heroCarousel .hero-card > *,
.hero-card > *,
.hero-slide .hero-card > *,
.hero-slide [class*="hero-card"] > * {
    position: relative;
    z-index: 1;
}

#heroCarousel .hero-card h1,
#heroCarousel .hero-card h2,
.hero-card h1,
.hero-card h2,
.hero-slide .hero-card h1,
.hero-slide .hero-card h2,
.hero-slide [class*="hero-card"] h1,
.hero-slide [class*="hero-card"] h2 {
    color: #fff !important;
    text-shadow: 0 4px 18px rgba(0, 0, 0, .42), 0 1px 2px rgba(0, 0, 0, .45);
    letter-spacing: .01em;
}

#heroCarousel .hero-card p,
.hero-card p,
.hero-slide .hero-card p,
.hero-slide [class*="hero-card"] p {
    color: rgba(255, 255, 255, .94) !important;
    text-shadow: 0 2px 10px rgba(0, 0, 0, .36);
    line-height: 1.75;
}

#heroCarousel .hero-card .btn,
.hero-card .btn,
.hero-slide .hero-card .btn,
.hero-slide [class*="hero-card"] .btn {
    box-shadow: 0 12px 26px rgba(0, 0, 0, .18);
}

/* 2) Make homepage 'Semua' links behave like CTA button position/effect */
.simpes-home-card-polished {
    position: relative !important;
    padding-bottom: 74px !important;
}

.simpes-home-more-btn,
.simpes-home-card-polished a.simpes-home-more-btn,
a.simpes-home-more-btn {
    position: absolute !important;
    left: 24px !important;
    right: auto !important;
    bottom: 22px !important;
    top: auto !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 38px;
    padding: 9px 18px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #006b3b, #008b55) !important;
    color: #fff !important;
    font-weight: 700 !important;
    font-size: .92rem !important;
    text-decoration: none !important;
    box-shadow: 0 12px 28px rgba(0, 95, 55, .24) !important;
    border: 1px solid rgba(255, 255, 255, .20) !important;
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
    z-index: 2;
}

.simpes-home-more-btn::after {
    content: "→";
    font-weight: 900;
    line-height: 1;
    transform: translateY(-1px);
}

.simpes-home-more-btn:hover,
.simpes-home-card-polished a.simpes-home-more-btn:hover {
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 16px 34px rgba(0, 95, 55, .30) !important;
    filter: saturate(1.08);
}

/* 3) PSB button/nav: make the public PSB CTA stronger but not disruptive */
.simpes-psb-portal-link,
a.simpes-psb-portal-link,
.navbar a.simpes-psb-portal-link,
header a.simpes-psb-portal-link {
    background: linear-gradient(135deg, #006b3b, #008b55) !important;
    color: #fff !important;
    border-radius: 999px !important;
    padding: 10px 20px !important;
    font-weight: 800 !important;
    box-shadow: 0 12px 28px rgba(0, 95, 55, .22) !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    text-decoration: none !important;
}

.simpes-psb-portal-link:hover,
a.simpes-psb-portal-link:hover {
    color: #fff !important;
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(0, 95, 55, .30) !important;
}

@media (max-width: 768px) {
    #heroCarousel .hero-card,
    .hero-card,
    .hero-slide .hero-card,
    .hero-slide [class*="hero-card"] {
        padding: 20px 22px;
        border-radius: 22px;
    }

    .simpes-home-card-polished {
        padding-bottom: 68px !important;
    }

    .simpes-home-more-btn,
    .simpes-home-card-polished a.simpes-home-more-btn,
    a.simpes-home-more-btn {
        left: 18px !important;
        bottom: 18px !important;
        min-height: 36px;
        padding: 8px 16px !important;
    }
}