/*
 * Website v2 — kerangka (docs/ui/RENCANA_WEBSITE_V2.md). Semua selektor berawalan body.wv2, dibungkus @media screen.
 * Wadah halaman non-beranda: #main-page > #main-content > #inner-main-content > #page-outer > h1#page-title + #page-content.
 * Acuan recoding: #page-outer padding 24px 0 32px, jarak judul–isi 16px, judul 24px/600 warna heading tanpa kotak,
 * #page-content tanpa kotak besar (isi berupa kartu-kartu di atas kanvas).
 * Pemilik: agen kerangka+komponen.
 */
@media screen {
    /* Lebar kontainer: tetap .container bootstrap (1170/970/750), gutter 15px — sama dengan recoding.
       Lawan legacy web.css `body.not-home #main-content { margin-top: -50px }` dan min-height 250px. */
    body.wv2.not-home #main-page {
        max-width: 100%;
    }

    body.wv2.not-home #main-content {
        margin-top: 0 !important;
        min-height: 0;
    }

    body.wv2.not-home #inner-main-content {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        background-color: transparent !important;
        box-shadow: none !important;
    }

    /* Tata letak boxed: kotak putih #main-page milik tema tetap, isinya diberi ruang samping. */
    body.wv2.not-home.boxed-layout #main-content #inner-main-content {
        padding: 0 20px !important;
    }

    body.wv2.not-home #page-outer {
        display: block;
        width: 100%;
        min-width: 0;
        padding: 24px 0 32px;
    }

    /* Judul halaman: tegas, warna heading, tanpa kotak/garis. Lawan h1 bootstrap 36px/500 dan
       ThemeBuilder `body.not-home #page-outer #page-title { font-weight: 700 }`. */
    body.wv2.not-home #page-outer > #page-title {
        margin: 0 0 16px !important;
        padding: 0 !important;
        font-size: 24px !important;
        font-weight: 600 !important;
        line-height: 1.35 !important;
        letter-spacing: 0;
        text-align: left;
        text-transform: none;
        color: var(--wv-heading) !important;
        background: none !important;
        border: 0 none !important;
        box-shadow: none !important;
        overflow-wrap: anywhere;
    }

    /* Area isi: bukan satu kotak besar bergaris (lawan new-theme.css #page-content border/padding/bg/shadow). */
    body.wv2.not-home #page-outer > #page-content {
        display: block;
        min-width: 0;
        margin: 0 !important;
        padding: 0 !important;
        color: var(--wv-ink);
        background-color: transparent !important;
        border: 0 none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    /* Clearfix: legacy memakai float (col-*, inline-block) — jaga agar padding bawah #page-outer terasa. */
    body.wv2.not-home #page-outer > #page-content::after {
        content: "";
        display: table;
        clear: both;
    }

    /* Tombol gulir ke atas: kotak membulat warna brand, bayangan kartu. */
    body.wv2.not-home #scroll-to-top-btn {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        right: 24px;
        width: 44px;
        height: 44px;
        padding: 0 !important;
        color: #fff !important;
        background-color: var(--wv-brand) !important;
        border: 0 none !important;
        border-radius: var(--wv-radius-lg) !important;
        box-shadow: var(--wv-shadow-card) !important;
        transition: bottom 0.3s ease, background-color 0.15s ease;
    }

    body.wv2.not-home #scroll-to-top-btn:hover,
    body.wv2.not-home #scroll-to-top-btn:focus {
        background-color: var(--wv-brand-hover) !important;
    }

    body.wv2.not-home #scroll-to-top-btn:focus-visible {
        outline: 2px solid var(--wv-brand);
        outline-offset: 2px;
    }

    body.wv2.not-home #scroll-to-top-btn .fa {
        top: 0;
        font-size: 16px;
        line-height: 1;
        color: #fff !important;
    }

    @media (max-width: 991px) {
        body.wv2.not-home #page-outer {
            padding: 20px 0 28px;
        }

        body.wv2.not-home #page-outer > #page-title {
            font-size: 22px !important;
        }
    }

    @media (max-width: 767px) {
        body.wv2.not-home #page-outer {
            padding: 16px 0 24px;
        }

        body.wv2.not-home #page-outer > #page-title {
            margin-bottom: 12px !important;
            font-size: 20px !important;
        }

        body.wv2.not-home.boxed-layout #main-content #inner-main-content {
            padding: 0 12px !important;
        }

        body.wv2.not-home #scroll-to-top-btn {
            right: 16px;
            width: 40px;
            height: 40px;
            border-radius: var(--wv-radius-md) !important;
        }
    }

    @media (prefers-reduced-motion: reduce) {
        body.wv2.not-home #scroll-to-top-btn {
            transition: none;
        }
    }
}