/**
 * ==========================================================================
 * File: assets/css/hero.css
 * Description: Styling & Reset Spacing untuk Hero Section / Carousel Slider
 * Project: RSU Universitas Tadulako
 * ==========================================================================
 */

/* ==========================================================================
   1. RESET SPACING & HEADER-HERO SEAMLESS FIX
   (Penghilang Jarak/Celah Putih Antara Header dan Hero Section)
   ========================================================================== */

#primary.site-main,
main.site-main {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.site-header,
header,
#site-navigation,
.main-navigation,
.header-main {
    margin-bottom: 0 !important;
}

/* ==========================================================================
   2. HERO SECTION CONTAINER
   ========================================================================== */

.hero-section {
    background: linear-gradient(135deg, #eef5fc 0%, #ffffff 100%);
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
    margin-top: 0 !important;
    overflow: hidden;
}

/* ==========================================================================
   3. TYPOGRAPHY & ELEMENTS
   ========================================================================== */

.hero-title {
    color: #093C71;
    font-size: 2.75rem;
    line-height: 1.2;
    letter-spacing: -0.5px;
}

.hero-desc {
    color: #4a5568 !important; /* Warna teks deskripsi dibuat lebih tegas */
    font-size: 1.05rem;
    line-height: 1.6;
    max-width: 540px;
}

/* ==========================================================================
   4. HERO IMAGE & BADGE
   ========================================================================== */

.hero-image-wrapper {
    position: relative;
    display: inline-block;
}

.hero-image-wrapper img {
    width: 100%;
    max-width: 520px;
    height: auto;
    object-fit: cover;
}

/* Badge 'Sehat Bersama UNTAD' Melingkar */
.hero-badge-seal {
    width: 110px;
    height: 110px;
    background-color: #00A896 !important;
    color: #ffffff;
    bottom: -15px !important;
    right: -15px !important;
    border: 4px solid #ffffff;
    box-shadow: 0 10px 25px rgba(0, 168, 150, 0.3);
}