/* ============================================================
   Halaman depan publik `/` (desain dari Metronic demo13 landing).
   Terjemahan polos dari templates/metronic/demo13/src/sass/components/_landing.scss,
   yang TIDAK ikut dikompilasi ke style.bundle.css aplikasi. Dimuat hanya oleh
   resources/views/layouts/landing.blade.php, jadi tidak menyentuh halaman lain.
   Warna gelap disesuaikan dengan biru brand (lihat brand-theme.css).
   ============================================================ */
:root {
    --landing-dark: #063a5e;
    --landing-dark-border: #2a5f86;
    --landing-header-height: 100px;
    --landing-header-sticky-height: 70px;
}

.landing-dark-bg {
    background-color: var(--landing-dark);
}

.landing-dark-color {
    color: var(--landing-dark);
}

.landing-dark-border {
    border: 1px dashed var(--landing-dark-border);
}

.landing-dark-separator {
    border-top: 1px dashed var(--landing-dark-border);
}

.landing-curve {
    position: relative;
}

.landing-curve svg {
    position: relative;
    top: 0;
    display: block;
}

/* ---------- Header ---------- */
.landing-header {
    display: flex;
    align-items: center;
    height: var(--landing-header-height);
}

.landing-header .menu .menu-link.active {
    color: #fff;
}

[data-kt-sticky-landing-header="on"] .landing-header {
    padding: 0;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 100;
    background-color: #fff;
    box-shadow: 0 10px 30px 0 rgba(82, 63, 105, .05);
    height: var(--landing-header-sticky-height);
}

[data-kt-sticky-landing-header="on"] .landing-header .menu .menu-link.active {
    color: var(--bs-primary);
    background-color: rgba(239, 242, 245, .4);
}

/* Tombol Masuk di header gelap: garis putih; saat header menempel (putih) ikut warna biasa. */
.landing-header .btn-landing-outline {
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .5);
}

[data-kt-sticky-landing-header="on"] .landing-header .btn-landing-outline {
    color: var(--bs-primary);
    border-color: var(--bs-primary);
}

body[data-kt-sticky-landing-header="on"] {
    padding-top: var(--landing-header-height);
}

@media (max-width: 991.98px) {
    .landing-header {
        height: 70px;
    }

    .landing-header .menu .menu-link.active {
        color: var(--bs-primary);
        background-color: rgba(239, 242, 245, .4);
    }

    body[data-kt-sticky-landing-header="on"] {
        padding-top: 70px;
    }
}

/* ---------- Merek di header ---------- */
.landing-brand-name {
    color: #fff;
    transition: color .2s ease;
}

[data-kt-sticky-landing-header="on"] .landing-header .landing-brand-name {
    color: var(--bs-gray-900);
}

/* Logo unggahan bisa berwarna apa saja; diberi alas putih supaya tetap terbaca di header gelap. */
.landing-logo-chip {
    display: inline-flex;
    align-items: center;
    background: #fff;
    border-radius: .65rem;
    padding: .35rem .6rem;
}

/* ---------- Gambar hero & tentang kami ---------- */
.landing-hero-img,
.landing-about-img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 1rem;
    object-fit: cover;
}

.landing-hero-img {
    max-height: 420px;
    box-shadow: 0 25px 50px rgba(0, 0, 0, .3);
}

.landing-about-img {
    max-height: 460px;
    box-shadow: 0 20px 45px rgba(0, 0, 0, .14);
}

/* ---------- Kartu produk ---------- */
.landing-product {
    overflow: hidden;
    transition: transform .2s ease;
}

.landing-product:hover {
    transform: translateY(-4px);
}

.landing-product-img {
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bs-gray-100);
}

.landing-product-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.landing-product-name {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}