/* SaudagarWP Style Extend v1.9.0
   CSS statis untuk panel Customizer "Gaya Tampilan".
   Sumber: assets/source/scss/modules/_extend.scss (tidak di-build; edit keduanya).
   Nilai dinamis dicetak oleh core/helpers/class-style-extend.php (#rt-style-extend) dan Kirki. */

/* ---- Header sticky melayang ----
   Tanpa overflow:hidden: submenu, dropdown menu mobile, dan panel pencarian
   (position:absolute di dalam header) harus bisa keluar dari kotak header.
   Sudut bulat dipasang di induk (untuk bayangan) dan di baris berlatar. */
.rt-header--sticky-floating.is-sticky {
    left: max(15px, calc((100% - var(--theme-container-xl)) / 2));
    right: max(15px, calc((100% - var(--theme-container-xl)) / 2));
    top: var(--rt-sticky-offset, 12px);
    border-radius: var(--theme-border-radius)
}

.rt-header--sticky-floating.is-sticky .rt-header__sticky {
    border-bottom: 0;
    border-radius: inherit
}

.rt-header-mobile--sticky-floating.is-sticky {
    left: 10px;
    right: 10px;
    top: var(--rt-sticky-offset, 8px);
    border-radius: var(--theme-border-radius)
}

.rt-header-mobile--sticky-floating.is-sticky .rt-header-mobile__main {
    border-bottom: 0;
    border-radius: inherit
}

/* ---- Widget menu: dropdown hanya di layar kecil (markup sama untuk semua perangkat) ---- */
@media (min-width:769px) {
    .rt-widget-dropdown--responsive .rt-widget-dropdown__nav {
        display: none
    }

    .rt-widget-dropdown--responsive .rt-widget-dropdown__content {
        display: block !important
    }
}

/* ---- Judul bar sticky produk: kini <div> (bukan <h6>), gaya heading dipertahankan ---- */
.rt-sticky-product__title {
    color: var(--theme-font-color-primary);
    font-family: var(--theme-font-family-primary);
    font-weight: var(--theme-font-weight);
    line-height: var(--theme-heading-line-height, 1.2);
    font-style: var(--theme-heading-font-style, normal)
}

/* ---- Teks khusus pembaca layar & mesin (mis. H1 beranda tersembunyi) ---- */
.rt-sr-only {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0
}

/* H1 beranda yang ditampilkan (Customizer → Front Page Builder → Layout → Judul Utama).
   Jarak, warna latar, perataan, ukuran, dll. ditimpa oleh output Customizer. */
.rt-front-h1-wrap {
    padding-top: 24px;
    padding-bottom: 0
}

.rt-front-h1 {
    margin: 0;
    text-align: center
}

.rt-front-h1-wrap--full .rt-front-h1 {
    padding-left: 15px;
    padding-right: 15px
}

/* Sembunyikan secara visual per perangkat (tetap ada untuk mesin pencari & pembaca layar) */
@media (min-width:769px) {
    .rt-sr-only-desktop {
        position: absolute !important;
        width: 1px;
        height: 1px;
        padding: 0 !important;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0
    }
}

@media (min-width:577px) and (max-width:768px) {
    .rt-sr-only-tablet {
        position: absolute !important;
        width: 1px;
        height: 1px;
        padding: 0 !important;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0
    }
}

@media (max-width:576px) {
    .rt-sr-only-mobile {
        position: absolute !important;
        width: 1px;
        height: 1px;
        padding: 0 !important;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0
    }
}

/* ---- Seksi beranda: lebar & background kustom ---- */
.home-section--wide>.page-container {
    max-width: var(--theme-container-wide, 1400px)
}

.home-section--full>.page-container {
    max-width: 100%
}

.home-section--bg-custom {
    border-top: 0;
    border-bottom: 0
}

/* ---- Skema warna (gelap sudah ada di global-style; ini pelengkapnya) ---- */
.retheme-schema-dark {
    --theme-card-background: #242428;
    color: var(--theme-font-color-secondary)
}

.retheme-schema-light {
    --theme-background-primary: #fff;
    --theme-background-secondary: #f9f9f9;
    --theme-card-background: #fff;
    --theme-font-color-primary: #333;
    --theme-font-color-secondary: #7a7a7a;
    --theme-font-color-tertiary: #999;
    --theme-color-link: #189dee;
    --theme-color-link-active: #189dee;
    --theme-color-border: #ededed;
    color: var(--theme-font-color-secondary)
}

.rt-page-scheme-dark .page-wrapper,
.rt-page-scheme-dark .page-header,
.rt-page-scheme-dark .rt-page-hero {
    --theme-background-primary: #1c1c1f;
    --theme-background-secondary: #161617;
    --theme-card-background: #242428;
    --theme-font-color-primary: #e8e8e9;
    --theme-font-color-secondary: rgba(255, 255, 255, 0.6);
    --theme-font-color-tertiary: rgba(255, 255, 255, 0.4);
    --theme-color-link: var(--theme-font-color-secondary);
    --theme-color-link-active: var(--theme-font-color-primary);
    --theme-color-border: rgba(255, 255, 255, 0.08);
    color: var(--theme-font-color-secondary)
}

/* ---- Hero halaman (produk / artikel / statis) ---- */
.rt-page-hero {
    display: block;
    width: 100%;
    height: 360px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover
}

/* ---- Heading ---- */
h1,
h2,
h3,
h4,
h5,
h6,
.rt-header-block__title {
    letter-spacing: var(--theme-heading-letter-spacing, normal)
}

.rt-upper-h1 h1,
.rt-upper-h2 h2,
.rt-upper-h3 h3,
.rt-upper-h4 h4,
.rt-upper-h5 h5,
.rt-upper-h6 h6 {
    text-transform: uppercase
}

/* ---- Eyebrow (label kecil di atas judul seksi) ---- */
.rt-eyebrow {
    display: block;
    font-size: var(--rt-eyebrow-size, 12px);
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--theme-color-highlight);
    margin-bottom: 8px
}

.rt-eyebrow:before {
    content: "\2014\00a0"
}

/* ---- Sembunyikan seksi per perangkat (breakpoint = Kirki responsif) ---- */
@media (min-width:769px) {
    .rt-hide-desktop {
        display: none !important
    }
}

@media (min-width:577px) and (max-width:768px) {
    .rt-hide-tablet {
        display: none !important
    }
}

@media (max-width:576px) {
    .rt-hide-mobile {
        display: none !important
    }
}

/* ---- Pemberitahuan Toko (WooCommerce store notice) ---- */
.woocommerce-store-notice--sticky {
    position: sticky;
    top: 0;
    z-index: 98
}

.woocommerce-store-notice--upper {
    text-transform: uppercase
}

.woocommerce-store-notice .woocommerce-store-notice__cta {
    margin-left: .35em;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: .2em
}

.woocommerce-store-notice--link-plain a,
.woocommerce-store-notice--link-plain .woocommerce-store-notice__cta {
    text-decoration: none
}

.woocommerce-store-notice .woocommerce-store-notice__cta.is-button {
    display: inline-block;
    padding: .3em .9em;
    margin-left: .6em;
    border-radius: var(--theme-border-radius);
    background-color: rgba(255, 255, 255, .18);
    line-height: 1.4;
    transition: background-color .2s
}

.woocommerce-store-notice .woocommerce-store-notice__cta.is-button:hover {
    background-color: rgba(255, 255, 255, .3)
}

.woocommerce-store-notice .woocommerce-store-notice__dismiss-link.is-icon {
    display: inline-block;
    margin-left: .6em;
    font-size: 1.25em;
    line-height: 1;
    vertical-align: middle;
    text-decoration: none;
    opacity: .8
}

.woocommerce-store-notice .woocommerce-store-notice__dismiss-link.is-icon:hover {
    opacity: 1
}

/* ---- Ikon hamburger SVG (preset) ---- */
.rt-menu-toggle--svg {
    width: auto;
    min-height: 0;
    font-size: var(--rt-toggle-size, 22px);
    line-height: 1;
    color: var(--theme-font-color-secondary)
}

.rt-menu-toggle--svg span {
    display: none
}

.rt-menu-toggle--svg .rt-icon {
    display: block;
    width: 1em;
    height: 1em;
    margin: 0
}

.rt-menu-toggle--svg .rt-icon svg {
    display: block;
    width: 1em;
    height: 1em;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round
}

.rt-menu-toggle--svg .rt-menu-toggle__close,
.rt-menu-toggle--svg.is-active .rt-menu-toggle__open {
    display: none
}

.rt-menu-toggle--svg.is-active .rt-menu-toggle__close {
    display: block
}

.rt-menu-toggle--circle,
.rt-menu-toggle--square {
    padding: .4em;
    background-color: var(--theme-color-brand);
    color: var(--theme-btn-primary-color, #fff)
}

.rt-menu-toggle--circle {
    border-radius: 50%
}

.rt-menu-toggle--square {
    border-radius: var(--theme-border-radius)
}

/* ---- Gaya tombol (Global → Button → Gaya Tombol) ----
   Selektor dibungkus :where() → spesifisitas hanya dari kelas body, sehingga aturan
   tombol khusus (kartu produk, sticky bar, mini cart, checkout) tetap menang. */
.rt-btn-preset--bold {
    --rt-btn-radius: 0px;
    --rt-btn-border-width: 2px;
    --rt-btn-border-color: #111;
    --rt-btn-weight: 600;
    --rt-btn-transform: uppercase;
    --rt-btn-spacing: .06em
}

.rt-btn-preset--pill {
    --rt-btn-radius: 999px;
    --rt-btn-weight: 600
}

.rt-btn-preset--soft {
    --rt-btn-radius: 10px;
    --rt-btn-weight: 600
}

.rt-btn-styled :where(.button, .rt-btn),
.rt-btn-styled .rt-form .wpcf7-submit,
.rt-btn-styled .wp-block-button__link:not(.has-background) {
    border-radius: var(--rt-btn-radius, var(--theme-border-radius));
    border-width: var(--rt-btn-border-width, 1px);
    border-style: solid;
    font-weight: var(--rt-btn-weight, 400);
    text-transform: var(--rt-btn-transform, none);
    letter-spacing: var(--rt-btn-spacing, normal)
}

.rt-btn-styled :where(.button, .rt-btn):where(:not(.rt-btn--border)),
.rt-btn-styled .rt-form .wpcf7-submit,
.rt-btn-styled .wp-block-button__link:not(.has-background),
.rt-btn-styled .button.rt-btn--whatsapp.rt-btn--whatsapp {
    border-color: var(--rt-btn-border-color, transparent)
}

.rt-btn-size--compact :where(.button, .rt-btn):where(:not(.rt-btn--sm, .rt-btn--lg, .checkout, .checkout-button, #place_order)),
.rt-btn-size--compact .rt-form .wpcf7-submit {
    padding: 6px 18px;
    font-size: 13px
}

.rt-btn-size--large :where(.button, .rt-btn):where(:not(.rt-btn--sm, .rt-btn--lg, .checkout, .checkout-button, #place_order)),
.rt-btn-size--large .rt-form .wpcf7-submit {
    padding: 11px 30px;
    font-size: 15px
}

.rt-btn-hover--lift :where(.button, .rt-btn, .rt-form .wpcf7-submit):hover {
    transform: translateY(-2px)
}

.rt-btn-hover--hard :where(.button, .rt-btn, .rt-form .wpcf7-submit):hover {
    transform: translate(-2px, -2px);
    box-shadow: 4px 4px 0 var(--rt-btn-border-color, #111)
}

.rt-btn-hover--none :where(.button, .rt-btn, .rt-form .wpcf7-submit):hover,
.rt-btn-hover--hard .rt-product__thumbnail .button:hover {
    box-shadow: none
}

@media (max-width:768px) {
    .rt-btn-tap :where(.button, .rt-btn):where(:not(.rt-btn--sm)),
    .rt-btn-tap .rt-form .wpcf7-submit {
        padding-top: 11px;
        padding-bottom: 11px
    }
}

.retheme-root :where(.button, .rt-btn, .rt-form .wpcf7-submit, .wp-block-button__link):focus-visible {
    outline: 2px solid var(--theme-color-brand);
    outline-offset: 2px
}

body.rt-wa-btn-theme .button.rt-btn--whatsapp.rt-btn--whatsapp {
    color: var(--theme-btn-whatsapp-color);
    background-color: var(--theme-btn-whatsapp-background);
    border-color: var(--rt-btn-border-color, var(--theme-btn-whatsapp-background))
}

body.rt-wa-btn-theme .button.rt-btn--whatsapp.rt-btn--whatsapp:hover {
    color: var(--theme-btn-whatsapp-color-active);
    background-color: var(--theme-btn-whatsapp-background-active);
    border-color: var(--rt-btn-border-color, var(--theme-btn-whatsapp-background-active))
}

.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button,
.woocommerce-message .button:hover,
.woocommerce-info .button:hover,
.woocommerce-error .button:hover {
    border: 0;
    text-transform: none;
    letter-spacing: normal;
    box-shadow: none;
    transform: none
}

/* ---- Seksi loop beranda (produk/blog): kerapatan grid ---- */
.rt-loop-gap--wide .grids {
    grid-column-gap: 24px;
    grid-row-gap: 24px
}

.rt-loop-gap--md .grids {
    grid-column-gap: 16px;
    grid-row-gap: 16px
}

.rt-loop-gap--tight .grids {
    grid-column-gap: 8px;
    grid-row-gap: 8px
}

.rt-loop-gap--flush .grids {
    grid-column-gap: 2px;
    grid-row-gap: 2px
}

@media (max-width:576px) {
    .rt-loop-gap--wide .grids {
        grid-column-gap: 12px;
        grid-row-gap: 12px
    }

    .rt-loop-gap--md .grids {
        grid-column-gap: 10px;
        grid-row-gap: 10px
    }
}

/* ---- Efek gambar & judul kapital (produk/blog) ---- */
.rt-loop-img--gray .rt-product__thumbnail img,
.rt-loop-img--gray .rt-post__thumbnail img,
.rt-loop-img--gray-hover .rt-product__thumbnail img,
.rt-loop-img--gray-hover .rt-post__thumbnail img {
    filter: grayscale(1);
    transition: filter .5s ease, transform .5s ease
}

.rt-loop-img--gray-hover .rt-product:hover .rt-product__thumbnail img,
.rt-loop-img--gray-hover .rt-post:hover .rt-post__thumbnail img {
    filter: grayscale(0)
}

.rt-loop-img--zoom .rt-product__thumbnail img,
.rt-loop-img--zoom .rt-post__thumbnail img {
    transition: transform .6s ease
}

.rt-loop-img--zoom .rt-product:hover .rt-product__thumbnail img,
.rt-loop-img--zoom .rt-post:hover .rt-post__thumbnail img {
    transform: scale(1.06)
}

.rt-loop-title-upper .rt-product__title,
.rt-loop-title-upper .rt-post__title {
    text-transform: uppercase;
    letter-spacing: .02em
}

/* ---- Kartu produk "tile" ---- */
.rt-product--tile {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background-color: var(--theme-card-background)
}

.rt-product--tile:hover {
    position: relative;
    z-index: 1;
    box-shadow: var(--theme-shadow-md)
}

.rt-product--tile .rt-product__thumbnail {
    margin-bottom: 0
}

.rt-product--tile .rt-product__thumbnail img {
    display: block;
    width: 100%;
    aspect-ratio: 1/1;
    object-fit: cover;
    border-radius: 0
}

.rt-product--tile .rt-product__body,
.rt-product--tile.rt-product--center .rt-product__body {
    flex: 1;
    display: flex;
    flex-flow: column nowrap;
    align-items: stretch;
    text-align: left;
    padding: 16px 15px 18px
}

.rt-product--tile .rt-product__title {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
    text-transform: uppercase;
    letter-spacing: .01em
}

.rt-product--tile .rt-product__excerpt {
    font-size: 12.5px;
    line-height: 1.6;
    color: var(--theme-font-color-secondary);
    margin-bottom: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.rt-product--tile .rt-product__body>.rt-product__meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin-block-start: auto;
    padding-top: 14px
}

.rt-product--tile .rt-product__price-label {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--theme-font-color-tertiary)
}

.rt-product--tile .rt-product__meta .price {
    display: inline-block !important;
    margin: 0 0 0 auto;
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
    color: var(--theme-font-color-primary)
}

.rt-product--tile .rt-product__body .button,
.rt-product--tile .rt-product__body .rt-qty,
.rt-product--tile .rt-product__body .quantity {
    display: none !important
}

@media (max-width:576px) {
    .rt-product--tile .rt-product__body {
        padding: 12px 10px 14px
    }

    .rt-product--tile .rt-product__title {
        font-size: 13px
    }

    .rt-product--tile .rt-product__meta {
        flex-wrap: wrap
    }

    .rt-product--tile .rt-product__meta .price {
        font-size: 14px
    }
}

/* ---- Galeri beranda (homebuilder gallery) ---- */
.rt-gallery {
    --rt-gallery-gap: 16px
}

.rt-gallery__item {
    position: relative;
    margin: 0;
    overflow: hidden;
    background: var(--theme-background-secondary)
}

.rt-gallery__link {
    display: block;
    height: 100%;
    line-height: 0
}

.rt-gallery__item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s ease, filter .6s ease
}

.rt-gallery--rounded .rt-gallery__item {
    border-radius: var(--theme-border-radius)
}

.rt-gallery--ratio-auto .rt-gallery__item img {
    height: auto
}

.rt-gallery--ratio-1-1 .rt-gallery__item {
    aspect-ratio: 1/1
}

.rt-gallery--ratio-4-3 .rt-gallery__item {
    aspect-ratio: 4/3
}

.rt-gallery--ratio-3-2 .rt-gallery__item {
    aspect-ratio: 3/2
}

.rt-gallery--ratio-16-9 .rt-gallery__item {
    aspect-ratio: 16/9
}

.rt-gallery__grid {
    display: grid;
    grid-template-columns: repeat(var(--rt-gallery-cols, 4), minmax(0, 1fr));
    gap: var(--rt-gallery-gap)
}

.rt-gallery__marquee {
    overflow: hidden;
    margin-left: -15px;
    margin-right: -15px
}

.rt-gallery__track {
    display: flex;
    gap: var(--rt-gallery-gap);
    width: max-content;
    will-change: transform;
    animation: rt-marquee var(--rt-marquee-speed, 40s) linear infinite
}

.rt-gallery__marquee--right .rt-gallery__track {
    animation-direction: reverse
}

.rt-gallery__marquee.is-pause-hover:hover .rt-gallery__track {
    animation-play-state: paused
}

.rt-gallery--marquee .rt-gallery__item {
    flex: 0 0 auto;
    height: var(--rt-gallery-h, 380px);
    aspect-ratio: auto
}

.rt-gallery--marquee .rt-gallery__item img {
    width: auto;
    height: 100%
}

@keyframes rt-marquee {
    from {
        transform: translate3d(0, 0, 0)
    }

    to {
        transform: translate3d(calc(-50% - var(--rt-gallery-gap) / 2), 0, 0)
    }
}

.rt-gallery__swiper .swiper-slide {
    height: auto
}

.rt-gallery--hover-zoom .rt-gallery__item:hover img,
.rt-gallery--hover-zoom-gray .rt-gallery__item:hover img {
    transform: scale(1.06)
}

.rt-gallery--hover-gray .rt-gallery__item img,
.rt-gallery--hover-zoom-gray .rt-gallery__item img {
    filter: grayscale(1)
}

.rt-gallery--hover-gray .rt-gallery__item:hover img,
.rt-gallery--hover-zoom-gray .rt-gallery__item:hover img {
    filter: grayscale(0)
}

.rt-gallery--hover-lift .rt-gallery__item {
    transition: transform .4s ease, box-shadow .4s ease
}

.rt-gallery--hover-lift .rt-gallery__item:hover {
    transform: translateY(-6px);
    box-shadow: var(--theme-shadow-lg)
}

/* Item disembunyikan sampai masuk layar. Jaring pengaman: bila JS tertunda/gagal
   (mis. "delay JS" LiteSpeed), animasi ini memunculkan item setelah 2,5 s. Aturan
   tidak berlaku lagi begitu .is-inview dipasang, sehingga animasi animate.css jalan. */
.rt-gallery--js[data-entrance] [data-rt-anim]:not(.is-inview) {
    opacity: 0;
    animation: rt-gallery-reveal 0s linear 2.5s forwards
}

.rt-gallery--js[data-entrance] [data-rt-anim].is-inview {
    opacity: 1
}

@keyframes rt-gallery-reveal {
    to {
        opacity: 1
    }
}

@media (prefers-reduced-motion:reduce) {
    .rt-gallery__track {
        animation: none
    }

    .rt-gallery__marquee {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch
    }

    .rt-gallery__item img,
    .rt-gallery--hover-lift .rt-gallery__item {
        transition: none
    }
}

/* Lightbox galeri (dialog) */
.rt-gallery-lightbox {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    max-width: 100vw;
    max-height: 100vh;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 100000
}

.rt-gallery-lightbox[open] {
    display: flex
}

.rt-gallery-lightbox::backdrop {
    background: rgba(0, 0, 0, .9)
}

.rt-gallery-lightbox__figure {
    margin: 0;
    max-width: 92vw;
    max-height: 88vh;
    text-align: center
}

.rt-gallery-lightbox__img {
    max-width: 92vw;
    max-height: 80vh;
    width: auto;
    height: auto;
    object-fit: contain;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .5)
}

.rt-gallery-lightbox__caption {
    color: #fff;
    margin-top: 10px;
    font-size: 14px
}

.rt-gallery-lightbox__close,
.rt-gallery-lightbox__prev,
.rt-gallery-lightbox__next {
    position: fixed;
    border: 0;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    width: 44px;
    height: 44px;
    padding: 0;
    border-radius: 50%;
    cursor: pointer;
    font-size: 22px;
    line-height: 44px;
    text-align: center
}

.rt-gallery-lightbox__close {
    top: 16px;
    right: 16px;
    font-size: 30px
}

.rt-gallery-lightbox__prev {
    left: 12px;
    top: 50%;
    transform: translateY(-50%)
}

.rt-gallery-lightbox__next {
    right: 12px;
    top: 50%;
    transform: translateY(-50%)
}

.rt-gallery-lightbox__counter {
    position: fixed;
    bottom: 14px;
    left: 50%;
    transform: translateX(-50%);
    color: rgba(255, 255, 255, .7);
    font-size: 13px
}

.rt-gallery-lightbox:not(.has-nav) .rt-gallery-lightbox__prev,
.rt-gallery-lightbox:not(.has-nav) .rt-gallery-lightbox__next,
.rt-gallery-lightbox:not(.has-nav) .rt-gallery-lightbox__counter {
    display: none
}

html.rt-gallery-lightbox-open {
    overflow: hidden
}

/* ---- Infobox beranda (Customizer → Front Page Builder → Infobox → Tampilan Box) ----
   Default = tampilan lama. Ukuran ikon & warna latar ikon lewat variabel CSS dari Kirki
   (--rt-ib-icon, --rt-ib-icon-bg) agar tidak berebut spesifisitas. */
#homepage-infobox .rt-infobox__thumbnail img {
    width: var(--rt-ib-icon, 100px)
}

#homepage-infobox .rt-infobox--left .rt-infobox__thumbnail {
    flex: 0 0 auto;
    min-width: var(--rt-ib-icon, 50px);
    max-width: none
}

#homepage-infobox .rt-infobox--left .rt-infobox__thumbnail img {
    width: var(--rt-ib-icon, 50px)
}

/* Body selebar box agar perataan judul/teks terlihat (juga di Stack Center) */
#homepage-infobox .rt-infobox:not(.rt-infobox--left) .rt-infobox__body {
    align-self: stretch
}

#homepage-infobox .rt-infobox--left .rt-infobox__body {
    flex: 1 1 auto;
    min-width: 0
}

/* Inline Left: ikon di tengah tinggi teks */
#homepage-infobox.rt-ib-valign--center .rt-infobox--left {
    align-items: center
}

#homepage-infobox.rt-ib-valign--center .rt-infobox--left .rt-infobox__thumbnail {
    margin-bottom: 0
}

/* Jarak antar box dipilih (preset/kustom): buang margin bawah bawaan box */
#homepage-infobox[class*="rt-loop-gap--"] .rt-infobox {
    margin-bottom: 0
}

/* Kartu carousel sama tinggi (slide sudah sama tinggi lewat rt-swiper--stretch) */
#homepage-infobox .rt-swiper--stretch .swiper-slide>.rt-infobox--card {
    height: calc(100% - 20px)
}

#homepage-infobox[class*="rt-loop-gap--"] .rt-swiper--stretch .swiper-slide>.rt-infobox--card {
    height: 100%
}

/* Latar ikon: lingkaran / kotak membulat */
#homepage-infobox.rt-ib-icon--circle .rt-infobox__thumbnail img,
#homepage-infobox.rt-ib-icon--rounded .rt-infobox__thumbnail img {
    display: block;
    box-sizing: content-box;
    padding: 16px;
    max-width: calc(100% - 32px);
    background-color: var(--rt-ib-icon-bg, rgba(127, 127, 127, .12))
}

#homepage-infobox.rt-ib-icon--circle .rt-infobox--left .rt-infobox__thumbnail img,
#homepage-infobox.rt-ib-icon--rounded .rt-infobox--left .rt-infobox__thumbnail img {
    padding: 10px;
    max-width: none
}

#homepage-infobox.rt-ib-icon--circle .rt-infobox__thumbnail img {
    border-radius: 50%
}

#homepage-infobox.rt-ib-icon--rounded .rt-infobox__thumbnail img {
    border-radius: 16px
}

/* Efek hover (hanya perangkat berkursor; dimatikan untuk kurangi-animasi) */
#homepage-infobox.rt-ib-hover--lift .rt-infobox,
#homepage-infobox.rt-ib-hover--shadow .rt-infobox {
    transition: transform .25s ease, box-shadow .25s ease
}

#homepage-infobox.rt-ib-hover--lift .swiper {
    padding-top: 6px;
    margin-top: -6px
}

@media (hover:hover) {
    #homepage-infobox.rt-ib-hover--lift .rt-infobox:hover {
        transform: translateY(-4px);
        box-shadow: 0 14px 28px -14px rgba(0, 0, 0, .3)
    }

    #homepage-infobox.rt-ib-hover--shadow .rt-infobox:hover {
        box-shadow: 0 10px 30px rgba(0, 0, 0, .1)
    }
}

@media (prefers-reduced-motion:reduce) {
    #homepage-infobox .rt-infobox {
        transition: none
    }

    #homepage-infobox.rt-ib-hover--lift .rt-infobox:hover {
        transform: none
    }
}

/* ---- Images Slider beranda (Customizer → Front Page Builder → Images Slider) ----
   Slide yang hanya gambar tidak terpengaruh: aturan teks & tombol hanya berlaku di
   bawah .rt-hs (slider yang punya slide berteks). Selektor gambar diawali
   #homepage-slider agar mengalahkan critical CSS inline (class-speed.php). */

/* Rasio slide per perangkat (--rt-hs-ratio dari Kirki) + titik fokus per slide */
#homepage-slider.rt-hs--ratio .rt-slide__media {
    aspect-ratio: var(--rt-hs-ratio, auto);
    overflow: hidden
}

#homepage-slider.rt-hs--ratio .rt-slide__media img {
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%
}

#homepage-slider.rt-hs--ratio .rt-slide--focal-top .rt-slide__media img {
    object-position: 50% 0
}

#homepage-slider.rt-hs--ratio .rt-slide--focal-bottom .rt-slide__media img {
    object-position: 50% 100%
}

#homepage-slider.rt-hs--ratio .rt-slide--focal-left .rt-slide__media img {
    object-position: 0 50%
}

#homepage-slider.rt-hs--ratio .rt-slide--focal-right .rt-slide__media img {
    object-position: 100% 50%
}

/* Pagination garis */
#homepage-slider.rt-hs--pag-bars .swiper-pagination-bullet {
    width: 22px;
    height: 4px;
    border-radius: 2px;
    transition: width .3s ease, background-color .3s ease
}

#homepage-slider.rt-hs--pag-bars .swiper-pagination-bullet-active {
    width: 36px
}

/* Lapisan teks */
#homepage-slider.rt-hs .rt-slide {
    --rt-hs-ov: var(--rt-hs-overlay, rgba(0, 0, 0, .55))
}

#homepage-slider.rt-hs .rt-slide--dark {
    --rt-hs-ov: rgba(255, 255, 255, .75)
}

#homepage-slider.rt-hs .rt-slide__media {
    border-radius: var(--theme-border-radius)
}

#homepage-slider.rt-hs .rt-slide--has-content .rt-slide__media::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none
}

#homepage-slider.rt-hs--ov-none .rt-slide--has-content .rt-slide__media::after {
    display: none
}

#homepage-slider.rt-hs--ov-solid .rt-slide--has-content .rt-slide__media::after {
    background-color: var(--rt-hs-ov);
    opacity: .7
}

#homepage-slider.rt-hs--ov-gradient .rt-slide--has-content .rt-slide__media::after {
    background: linear-gradient(90deg, var(--rt-hs-ov) 0%, transparent 72%)
}

#homepage-slider.rt-hs--ov-gradient .rt-slide--h-right .rt-slide__media::after {
    background: linear-gradient(270deg, var(--rt-hs-ov) 0%, transparent 72%)
}

#homepage-slider.rt-hs--ov-gradient .rt-slide--h-center .rt-slide__media::after {
    background: linear-gradient(0deg, var(--rt-hs-ov) 0%, transparent 78%)
}

#homepage-slider.rt-hs--ov-gradient .rt-slide--h-center.rt-slide--v-top .rt-slide__media::after {
    background: linear-gradient(180deg, var(--rt-hs-ov) 0%, transparent 78%)
}

#homepage-slider.rt-hs--ov-gradient .rt-slide--h-center.rt-slide--v-middle .rt-slide__media::after {
    background: var(--rt-hs-ov);
    opacity: .65
}

#homepage-slider.rt-hs .rt-slide__content {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(16px, 5%, 56px)
}

#homepage-slider.rt-hs .rt-slide--v-top .rt-slide__content {
    justify-content: flex-start
}

#homepage-slider.rt-hs .rt-slide--v-bottom .rt-slide__content {
    justify-content: flex-end
}

#homepage-slider.rt-hs .rt-slide__inner {
    display: flex;
    width: 100%
}

#homepage-slider.rt-hs .rt-slide--h-center .rt-slide__inner {
    justify-content: center;
    text-align: center
}

#homepage-slider.rt-hs .rt-slide--h-right .rt-slide__inner {
    justify-content: flex-end;
    text-align: right
}

#homepage-slider.rt-hs .rt-slide__box {
    max-width: var(--rt-hs-w, 560px)
}

#homepage-slider.rt-hs .rt-slide--light .rt-slide__box,
#homepage-slider.rt-hs .rt-slide--light .rt-slide__title {
    color: #fff
}

#homepage-slider.rt-hs .rt-slide--dark .rt-slide__box,
#homepage-slider.rt-hs .rt-slide--dark .rt-slide__title {
    color: #161616
}

#homepage-slider.rt-hs--box-none .rt-slide--light .rt-slide__box {
    text-shadow: 0 1px 14px rgba(0, 0, 0, .35)
}

#homepage-slider.rt-hs .rt-slide__eyebrow {
    margin: 0 0 .6em;
    font-size: .8125rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: .12em;
    text-transform: uppercase;
    opacity: .9
}

#homepage-slider.rt-hs .rt-slide__title {
    margin: 0 0 .45em;
    font-size: var(--rt-hs-title, clamp(1.5rem, 1.1rem + 1.6vw, 2.5rem));
    line-height: 1.15
}

#homepage-slider.rt-hs .rt-slide__title a,
#homepage-slider.rt-hs .rt-slide__title a:hover {
    color: inherit;
    text-decoration: none
}

#homepage-slider.rt-hs .rt-slide:hover .rt-slide__title a,
#homepage-slider.rt-hs .rt-slide__title a:focus-visible {
    text-decoration: underline;
    text-underline-offset: .15em
}

/* Satu tautan per slide: tautan judul membentang ke seluruh slide (tanpa tautan bersarang) */
#homepage-slider.rt-hs .rt-slide__link::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1
}

#homepage-slider.rt-hs .rt-slide__text {
    margin: 0 0 1.2em;
    font-size: var(--rt-hs-text, 1rem);
    line-height: 1.6
}

#homepage-slider.rt-hs .rt-slide__box>:last-child {
    margin-bottom: 0
}

#homepage-slider.rt-hs .rt-slide__buttons {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px
}

#homepage-slider.rt-hs .rt-slide--h-center .rt-slide__buttons {
    justify-content: center
}

#homepage-slider.rt-hs .rt-slide--h-right .rt-slide__buttons {
    justify-content: flex-end
}

/* Slide tanpa judul: gambar yang menjadi tautan, klik area teks diteruskan ke gambar */
#homepage-slider.rt-hs .rt-slide--media-link .rt-slide__content {
    pointer-events: none
}

#homepage-slider.rt-hs .rt-slide--media-link .rt-slide__content a {
    pointer-events: auto
}

/* Kotak teks */
#homepage-slider.rt-hs--box-shade .rt-slide__box,
#homepage-slider.rt-hs--box-card .rt-slide__box {
    padding: clamp(16px, 3vw, 32px);
    border-radius: var(--theme-border-radius)
}

#homepage-slider.rt-hs--box-shade .rt-slide--light .rt-slide__box {
    background-color: rgba(0, 0, 0, .45)
}

#homepage-slider.rt-hs--box-shade .rt-slide--dark .rt-slide__box {
    background-color: rgba(255, 255, 255, .8)
}

#homepage-slider.rt-hs--box-card .rt-slide .rt-slide__box {
    background-color: var(--theme-background-primary, #fff);
    color: var(--theme-font-color-secondary, #444);
    box-shadow: 0 12px 32px rgba(0, 0, 0, .14);
    text-shadow: none
}

#homepage-slider.rt-hs--box-card .rt-slide .rt-slide__title {
    color: var(--theme-font-color-primary, #161616)
}

/* Tombol slide (warna dasar tema: rt-btn--primary/--second/--action/--whatsapp) */
#homepage-slider .rt-btn.rt-slide-btn--light {
    color: #161616;
    background-color: #fff;
    border-color: #fff
}

#homepage-slider .rt-btn.rt-slide-btn--light:hover {
    color: #161616;
    background-color: rgba(255, 255, 255, .86);
    border-color: transparent
}

#homepage-slider .rt-btn.rt-slide-btn--outline-light {
    color: #fff;
    background-color: transparent;
    border-color: rgba(255, 255, 255, .9)
}

#homepage-slider .rt-btn.rt-slide-btn--outline-light:hover {
    color: #161616;
    background-color: #fff;
    border-color: #fff
}

#homepage-slider .rt-btn.rt-slide-btn--outline-dark {
    color: #161616;
    background-color: transparent;
    border-color: #161616
}

#homepage-slider .rt-btn.rt-slide-btn--outline-dark:hover {
    color: #fff;
    background-color: #161616;
    border-color: #161616
}

#homepage-slider.rt-hs--box-card .rt-btn.rt-slide-btn--light {
    border-color: var(--theme-color-border, #ddd)
}

#homepage-slider.rt-hs--box-card .rt-btn.rt-slide-btn--outline-light {
    color: var(--theme-font-color-primary, #161616);
    border-color: currentColor
}

#homepage-slider.rt-hs--box-card .rt-btn.rt-slide-btn--outline-light:hover {
    color: var(--theme-background-primary, #fff);
    background-color: var(--theme-font-color-primary, #161616);
    border-color: var(--theme-font-color-primary, #161616)
}

#homepage-slider .rt-slide-btn--link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 2px;
    font-weight: 600;
    color: inherit;
    text-decoration: none
}

#homepage-slider .rt-slide-btn--link:hover {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: .2em
}

#homepage-slider .rt-slide-btn__arrow {
    display: inline-block;
    transition: transform .2s ease
}

#homepage-slider .rt-slide-btn--link:hover .rt-slide-btn__arrow {
    transform: translateX(3px)
}

#homepage-slider .rt-slide-btn--wa .rt-slide-btn__icon {
    width: 1.15em;
    height: 1.15em;
    margin-right: 6px;
    vertical-align: -.2em
}

/* Panah navigasi tidak menutupi teks */
@media (min-width:577px) {
    #homepage-slider.rt-hs--nav .rt-slide__content {
        padding-left: max(64px, 5%);
        padding-right: max(64px, 5%)
    }
}

/* HP: teks di bawah gambar (default) atau di atas gambar */
@media (max-width:576px) {
    #homepage-slider.rt-hs--m-below .rt-slide__content {
        position: static;
        display: block;
        padding: 14px 2px 2px
    }

    #homepage-slider.rt-hs--m-below .rt-slide--has-content .rt-slide__media::after {
        display: none
    }

    #homepage-slider.rt-hs--m-below .rt-slide .rt-slide__box {
        max-width: none;
        padding: 0;
        background: none;
        box-shadow: none;
        text-shadow: none;
        color: var(--theme-font-color-secondary, #444)
    }

    #homepage-slider.rt-hs--m-below .rt-slide .rt-slide__title {
        color: var(--theme-font-color-primary, #161616)
    }

    #homepage-slider.rt-hs--m-below .rt-btn.rt-slide-btn--light {
        color: var(--theme-background-primary, #fff);
        background-color: var(--theme-font-color-primary, #161616);
        border-color: var(--theme-font-color-primary, #161616)
    }

    #homepage-slider.rt-hs--m-below .rt-btn.rt-slide-btn--outline-light {
        color: var(--theme-font-color-primary, #161616);
        background-color: transparent;
        border-color: currentColor
    }

    /* Slider berteks di HP: geser untuk berpindah slide; panah tidak menutupi teks/tombol */
    #homepage-slider.rt-hs .swiper-button-next,
    #homepage-slider.rt-hs .swiper-button-prev {
        display: none
    }

    #homepage-slider.rt-hs--m-overlay .rt-slide__content {
        padding: 16px
    }
}

/* Animasi teks: hanya setelah pergantian slide pertama (kelas rt-anim-ready dari
   retheme-swiper.js), sehingga teks slide pertama tidak pernah disembunyikan. */
@keyframes rt-hs-rise {
    from {
        opacity: 0;
        transform: translateY(14px)
    }

    to {
        opacity: 1;
        transform: none
    }
}

@media (prefers-reduced-motion:no-preference) {
    #homepage-slider.rt-hs--anim .rt-anim-ready .swiper-slide-active .rt-slide__box>* {
        animation: rt-hs-rise .6s cubic-bezier(.2, .7, .2, 1) both
    }

    #homepage-slider.rt-hs--anim .rt-anim-ready .swiper-slide-active .rt-slide__box>:nth-child(2) {
        animation-delay: .08s
    }

    #homepage-slider.rt-hs--anim .rt-anim-ready .swiper-slide-active .rt-slide__box>:nth-child(3) {
        animation-delay: .16s
    }

    #homepage-slider.rt-hs--anim .rt-anim-ready .swiper-slide-active .rt-slide__box>:nth-child(4) {
        animation-delay: .24s
    }
}