/* ==============================================
   RESPONSIVE FIX - PT Lucky Mitra Abadi
   ============================================== */

/* ---- Prevent horizontal scroll ---- */
html {
    overflow-x: hidden;
}

body {
    max-width: 100%;
}

/*
 * style.css punya "section { overflow-x: hidden }" yang memaksa
 * overflow-y ter-compute jadi "auto" (CSS spec: kalau satu axis
 * non-visible, axis lain tidak boleh visible → dipaksa auto).
 * Efeknya: setiap section jadi scroll container. Kalau ada child
 * posisi:absolute (mis. module_imageBox div.head) yang tingginya
 * melebihi section → muncul scrollbar ke-2 di dalam section.
 *
 * Fix: overflow-x:clip (clip tanpa BFC/scroll container) +
 *      overflow-y:visible (CSS spec izinkan clip+visible berdampingan,
 *      tidak seperti hidden+visible yang tetap ter-compute jadi auto).
 */
section {
    overflow-x: clip !important;
    overflow-y: visible !important;
}

/* ============================================================
   FOOTER
   ============================================================ */

.global_footer {
    padding: 40px 0 0;
    background-color: #f8f8f8;
}

/* CTA konsultasi */
.gfi_cta {
    padding: 20px 0 30px;
    border-bottom: 1px solid #ddd;
}

/* Footer kolom - tampil di mobile */
.global_footer .gf_links-01 {
    display: block !important;
    margin-top: 0;
    padding: 0;
}

.global_footer .gf_links-01 > li {
    width: 100% !important;
    padding: 16px 0;
    border-bottom: 1px solid #e0e0e0;
}

.global_footer .gf_links-01 > li:last-child {
    border-bottom: none;
}

.global_footer .gf_links-01 > li > a {
    display: block;
    font-size: 14px !important;
    font-weight: bold;
    color: #17406F !important;
    text-decoration: none !important;
}

.global_footer .gf_links-01 > li ul {
    margin-top: 10px;
    border-top: 1px solid #ddd;
    padding-top: 10px;
    padding-left: 0 !important;
}

.global_footer .gf_links-01 > li ul li {
    margin-top: 8px;
    padding-left: 0 !important;
    font-size: 13px;
    line-height: 1.6;
    color: #444;
    list-style: none;
}

.global_footer .gf_links-01 > li ul li::before {
    display: none !important;
}

.global_footer .gf_links-01 > li ul a,
.global_footer .gf_links-01 > li ul li a {
    color: #444 !important;
    text-decoration: none !important;
    font-size: 13px;
    line-height: 1.6;
}

/* Social icon links */
.gf_social {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #444 !important;
    text-decoration: none !important;
    font-size: 13px;
    line-height: 1.5;
}

.gf_social img {
    width: 18px;
    height: 18px;
    object-fit: contain;
    flex-shrink: 0;
}

/* Hubungi Kami button tampil di mobile */
.global_footer .gf_information .gfi_button {
    display: block !important;
    margin-top: 16px;
}

/* Copyright - fix dari position:absolute ke normal flow */
.global_footer .gf_copyright {
    position: relative !important;
    left: auto !important;
    bottom: auto !important;
    width: 100% !important;
    margin-top: 10px;
    padding: 14px 0;
    background-color: #17406F;
    text-align: center;
}

.global_footer .gf_copyright .copyright {
    color: #fff;
    font-size: 12px;
    text-align: center;
    margin: 0;
}

.global_footer .gf_copyright a {
    color: #fff !important;
}

.global_footer .gf_copyright .gf_links-02 {
    display: none !important;
}

/* Desktop: kolom 4 berdampingan */
@media (min-width: 768px) {
    .gfi_cta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
    }

    .gfi_cta .top_title-01 {
        margin-bottom: 0 !important;
    }

    .global_footer .gf_links-01 {
        display: flex !important;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-top: 40px;
        gap: 0;
    }

    .global_footer .gf_links-01 > li {
        width: calc(25% - 20px) !important;
        padding: 0;
        border-bottom: none !important;
    }
}

/* ============================================================
   HEADER & NAVIGASI MOBILE
   ============================================================ */


/*
 * style.css punya "img[src$=".svg"] { width: 100% }" yang
 * bikin logo SVG di header ikut membesar jadi 100%.
 * SVG logo tidak punya width/height attribute, jadi width:auto
 * bisa render 0px. Fix dengan height eksplisit + width auto.
 */
.global_header .gh_logo a span img {
    width: auto !important;
    height: 44px !important;
    max-width: none !important;
    max-height: none !important;
    display: block;
}

@media (max-width: 767px) {
    .global_header .gh_logo a span img {
        height: 32px !important;
    }
}

/* ============================================================
   TOMBOL (module_button) MOBILE
   ============================================================ */

@media (max-width: 767px) {
    .module_button-02,
    .module_button-01 {
        margin: 0 8px !important;
        min-width: 130px !important;
        padding: 0.75em 1.5em !important;
        font-size: 13px !important;
    }
}

/* ============================================================
   SECTION PADDING MOBILE
   ============================================================ */

@media (max-width: 767px) {
    section {
        padding: 40px 0 !important;
        /* JANGAN overflow-x:hidden di section — menyebabkan double scroll */
    }

    .local_inner,
    .global_inner {
        padding: 0 20px !important;
    }

    /* Header inner harus tetap padding:0 — jangan terimbas override di atas */
    .global_header > .global_inner {
        padding: 0 !important;
    }
}

/* ============================================================
   IMAGE BOX (module_imageBox-01)
   ============================================================ */

/* Desktop: batasi tinggi gambar agar tidak melewati batas section */
.module_imageBox-01 div.head img {
    display: block;
    width: 100%;
    max-height: 480px;
    object-fit: cover;
}

/* MOBILE */

@media (max-width: 767px) {
    /* Reset absolute layout → normal stacked flow (image on top, text below) */
    .module_imageBox-01 {
        display: block !important;
        padding-top: 0 !important;
    }

    .module_imageBox-01 div.head {
        position: relative !important;
        width: 100% !important;
        right: auto !important;
        left: auto !important;
        top: auto !important;
    }

    .module_imageBox-01 div.head img {
        width: 100%;
        height: 200px;
        object-fit: cover;
        display: block;
    }

    .module_imageBox-01 div.body,
    .module_imageBox-01._order div.body {
        margin-right: 0 !important;
        margin-left: 0 !important;
        padding: 20px !important;
        width: 100% !important;
    }

    .module_imageBox-01 div.body p {
        font-size: 2rem !important;
        margin-top: 0 !important;
    }

    .module_imageBox-01 div.body h5 {
        margin-top: 0 !important;
        font-size: 14px !important;
    }
}

/* ============================================================
   TESTIMONI GALLERY MOBILE
   ============================================================ */

@media (max-width: 767px) {
    .module_gallery-03 ul.gallery {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }

    .module_gallery-03 ul.gallery li {
        margin: 0 !important;
    }

    .module_gallery-03 ul.gallery li img {
        width: 100%;
        height: 140px;
        object-fit: cover;
    }
}

/* ============================================================
   POINT LIST (Visi Misi) MOBILE
   ============================================================ */

@media (max-width: 767px) {
    .module_pointList-01 {
        padding: 0 !important;
    }

    .module_pointList-01 li a {
        padding: 16px !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .module_pointList-01 li .label {
        margin-bottom: 8px;
    }
}

/* ============================================================
   COLUMN 2 (Tim Kami) MOBILE
   ============================================================ */

@media (max-width: 767px) {
    .module_column-col2._one_column {
        flex-direction: column !important;
    }

    .module_column-col2._one_column .col {
        width: 100% !important;
    }

    .module_column-col2._one_column .col .img img {
        max-width: 180px;
        margin: 0 auto;
        display: block;
        border-radius: 50%;
    }
}

/* ============================================================
   SLIDER / MAIN VISUAL MOBILE
   ============================================================ */

@media (max-width: 767px) {
    .global_mainVisual {
        min-height: 200px;
    }

    .gm_title {
        font-size: 18px !important;
        padding: 10px 16px !important;
    }
}

/* ============================================================
   FLOATING WA - hindari overlap content
   ============================================================ */

@media (max-width: 600px) {
    .floating-wa {
        bottom: 16px !important;
        right: 14px !important;
    }
}