/* ============================================================
   YXLabs Creative — Brand tokens & polish
   Ditambahkan setelah tema, tidak menimpa file tema inti.
   ============================================================ */
:root {
    --yxl-primary: #1159a7;
    --yxl-primary-dark: #0b2e63;
    --yxl-accent: #16be45;
    --yxl-ink: #1c2331;
    --yxl-radius: 14px;
    --yxl-shadow: 0 10px 30px rgba(17, 89, 167, .12);
    --yxl-transition: .25s ease;
}

/* Tipografi heading lebih tegas */
h1, .display-6 { letter-spacing: -.5px; }

/* Tombol brand */
.btn-primary {
    background-color: var(--yxl-primary);
    border-color: var(--yxl-primary);
    box-shadow: 0 6px 18px rgba(17, 89, 167, .25);
    transition: transform var(--yxl-transition), box-shadow var(--yxl-transition);
}
.btn-primary:hover {
    background-color: var(--yxl-primary-dark);
    border-color: var(--yxl-primary-dark);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(17, 89, 167, .35);
}
.btn-success { background-color: var(--yxl-accent); border-color: var(--yxl-accent); }

/* Navbar: sedikit blur + shadow saat scroll (kelas .is-fixed via bootstrap scroll) */
.navbar-landing { transition: background-color var(--yxl-transition), box-shadow var(--yxl-transition); }
.navbar-landing.nav-sticky { box-shadow: 0 6px 24px rgba(0, 0, 0, .06); }

/* Kartu portofolio: hover angkat + zoom halus */
.explore-box { border-radius: var(--yxl-radius); overflow: hidden; transition: transform var(--yxl-transition), box-shadow var(--yxl-transition); }
.explore-box:hover { transform: translateY(-6px); box-shadow: var(--yxl-shadow); }
.explore-box .explore-img,
.explore-box picture img { transition: transform .4s ease; width: 100%; height: 220px; object-fit: cover; }
.explore-box:hover .explore-img,
.explore-box:hover picture img { transform: scale(1.06); }

/* Logo klien: berwarna saat hover */
.client-images picture img,
.client-images img { transition: filter var(--yxl-transition), opacity var(--yxl-transition); opacity: .75; }
.client-images:hover picture img,
.client-images:hover img { filter: grayscale(0) !important; opacity: 1; }

/* Layanan: kartu lebih hidup */
#services .d-flex.p-3 { border-radius: var(--yxl-radius); transition: background-color var(--yxl-transition), box-shadow var(--yxl-transition); }
#services .d-flex.p-3:hover { background: #fff; box-shadow: var(--yxl-shadow); }

/* Aksen judul section */
.section .text-success { color: var(--yxl-accent) !important; }

/* Aksesibilitas: fokus terlihat */
a:focus-visible, .btn:focus-visible { outline: 3px solid rgba(22, 190, 69, .5); outline-offset: 2px; }