/* =========================================================
   AHDEV.ID GLOBAL SECTION SYSTEM - SAFE VERSION
   Fungsi:
   - Hanya mengatur tinggi section utama
   - Aktif hanya untuk desktop/laptop landscape
   - Tidak mengubah font, warna, card, gambar, zoom, scale
   - Tidak merusak tablet/HP/portrait
========================================================= */

:root {
    --global-header-height: var(--header-height, 82px);
    --global-section-height: 100dvh;
    --global-section-x: var(--section-padding-x, 8%);
    --global-section-y: clamp(28px, 4.5vh, 72px);
}

/* Section utama saja, bukan section bersarang */
html body section:not(:where(section section)) {
    position: relative;
    box-sizing: border-box;
    scroll-margin-top: var(--global-header-height);
}

/* =========================================================
   DESKTOP / LAPTOP LANDSCAPE SAJA
   Contoh: 1920x1080, 1366x768
========================================================= */

@media (min-width: 1024px) and (orientation: landscape) {
    html body section:not(:where(section section)) {
        min-height: var(--global-section-height) !important;
        height: var(--global-section-height) !important;
        max-height: var(--global-section-height) !important;

        padding-top: var(--global-section-y) !important;
        padding-bottom: var(--global-section-y) !important;
        padding-left: var(--global-section-x) !important;
        padding-right: var(--global-section-x) !important;

        overflow: hidden !important;
    }
}

/* =========================================================
   LANDSCAPE PENDEK
   Hanya kurangi padding section, jangan kecilkan isi global
========================================================= */

@media (min-width: 1024px) and (orientation: landscape) and (max-height: 760px) {
    :root {
        --global-section-y: clamp(14px, 2.8vh, 34px);
    }
}

@media (min-width: 1024px) and (orientation: landscape) and (max-height: 680px) {
    :root {
        --global-section-y: 12px;
    }
}

/* =========================================================
   TABLET / HP / PORTRAIT
   Global section tidak memaksa tinggi 1 layar
   Biarkan CSS masing-masing section yang mengatur
========================================================= */

@media (max-width: 1023px), (orientation: portrait) {
    html body section:not(:where(section section)) {
        min-height: auto !important;
        height: auto !important;
        max-height: none !important;

        overflow: visible !important;
    }
}