/* JelajahiJogja — responsive styles derived from the supplied Figma design */

:root{
    --jj-maroon:#800000;
    --jj-brown:#3d2b1f;
    --jj-gold:#c5a059;
    --jj-cream:#f5f0e1;
    --jj-ivory:#fdfbf0;
    --jj-soft:#f6f4e9;
    --jj-border:#e5d3b3;
    --jj-copy:#5a413d;
    --jj-muted:#705a4c;
    --jj-white:#fff;
    --jj-radius:12px;
    --jj-shadow:0 4px 20px rgba(61,43,31,.07);
}

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    background:var(--jj-ivory);
    color:var(--jj-brown);
    font-family:'Plus Jakarta Sans',sans-serif;
    font-size:16px;
    line-height:1.6;
}

img{
    max-width:100%;
    height:auto;
}

a{
    color:inherit;
    text-decoration:none;
}

button,
input,
textarea,
select{
    font:inherit;
}

button{
    cursor:pointer;
}

.screen-reader-text{
    position:absolute!important;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
}

.jj-container{
    width:min(1152px,calc(100% - 48px));
    margin-inline:auto;
}

.jj-narrow{
    max-width:896px;
}

.jj-site-content{
    min-height:55vh;
}

h1,h2,h3,h4{
    font-family:'Literata',serif;
    line-height:1.18;
    margin:0;
    color:var(--jj-brown);
}

p{
    margin:0;
}

.jj-kicker{
    font-size:12px;
    letter-spacing:.04em;
    color:var(--jj-muted);
}


/* =========================================================
   HEADER
========================================================= */

.jj-site-header{
    height:80px;
    background:rgba(253,251,240,.96);
    border-bottom:1px solid var(--jj-border);
    position:sticky;
    top:0;
    z-index:100;
    backdrop-filter:blur(10px);
}

.admin-bar .jj-site-header{
    top:32px;
}

.jj-header-inner{
    width:min(1280px,100%);
    height:100%;
    padding:0 48px;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
}

.jj-brand{
    font-family:'Literata',serif;
    font-size:24px;
    color:var(--jj-maroon);
    font-weight:600;
    white-space:nowrap;
}

.jj-brand .custom-logo{
    max-height:50px;
    width:auto;
}

.jj-brand .custom-logo-link{
    display:block;
}

.jj-desktop-nav{
    margin-left:auto;
}

.jj-nav-list,
.jj-mobile-nav-list{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    align-items:center;
    gap:26px;
}

.jj-nav-list a{
    font-size:14px;
    font-weight:600;
    color:var(--jj-brown);
    padding:10px 0;
    border-bottom:2px solid transparent;
}

.jj-nav-list a:hover,
.jj-nav-list .current-menu-item>a,
.jj-nav-list .current_page_item>a{
    color:var(--jj-maroon);
    border-color:var(--jj-maroon);
}

.jj-header-actions{
    display:flex;
    align-items:center;
    gap:12px;
}

.jj-cart-link{
    font-size:13px;
    border:1px solid var(--jj-border);
    border-radius:8px;
    padding:8px 11px;
    background:var(--jj-cream);
}

.jj-cart-link span{
    display:inline-grid;
    place-items:center;
    background:var(--jj-maroon);
    color:#fff;
    border-radius:50%;
    min-width:18px;
    height:18px;
    margin-left:4px;
    font-size:10px;
}

.jj-admin-btn,
.jj-menu-toggle{
    border:0;
    background:var(--jj-maroon);
    color:#fff;
    border-radius:8px;
    padding:9px 14px;
    font-weight:600;
    font-size:13px;
}

.jj-menu-toggle{
    display:none;
}

.jj-mobile-menu{
    position:absolute;
    left:0;
    right:0;
    background:var(--jj-ivory);
    border-bottom:1px solid var(--jj-border);
    padding:14px 24px;
    box-shadow:var(--jj-shadow);
}

.jj-mobile-nav-list{
    display:block;
}

.jj-mobile-nav-list li+li{
    border-top:1px solid rgba(229,211,179,.55);
}

.jj-mobile-nav-list a{
    display:block;
    padding:12px 4px;
    font-weight:600;
}


/* =========================================================
   HOMEPAGE
========================================================= */

.jj-hero{
    height:640px;
    position:relative;
    display:flex;
    align-items:center;
    background:linear-gradient(135deg,#765d49,#bea77d 55%,#e7c982);
    overflow:hidden;
}

.jj-hero.has-image{
    background-image:var(--jj-hero-image);
    background-size:cover;
    background-position:center;
}

.jj-hero-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(
        90deg,
        rgba(61,43,31,.88) 0%,
        rgba(61,43,31,.48) 52%,
        rgba(61,43,31,.05) 100%
    );
}

.jj-hero-content{
    position:relative;
    color:#fff;
}

.jj-hero h1{
    font-size:48px;
    line-height:56px;
    letter-spacing:-.02em;
    color:#fff;
    max-width:670px;
}

.jj-hero p{
    font-size:18px;
    line-height:28px;
    color:var(--jj-cream);
    max-width:670px;
    margin-top:14px;
}

.jj-hero-actions{
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    margin-top:28px;
}

.jj-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:8px;
    padding:12px 22px;
    font-size:14px;
    font-weight:650;
    border:1px solid transparent;
    min-height:44px;
}

.jj-btn-primary{
    background:var(--jj-maroon);
    color:#fff;
}

.jj-btn-light{
    background:var(--jj-cream);
    color:var(--jj-brown);
    border-color:var(--jj-border);
}

.jj-btn-soft{
    width:100%;
    background:var(--jj-cream);
    border-color:var(--jj-border);
    color:var(--jj-brown);
    padding:8px 12px;
    min-height:38px;
}

.jj-btn-outline{
    border-color:var(--jj-brown);
    color:var(--jj-brown);
    background:transparent;
}

.jj-btn-gold{
    background:var(--jj-gold);
    color:#1b1c16;
}

.jj-btn-outline-light{
    border-color:#f8dac8;
    color:#f8dac8;
}

.jj-btn.is-disabled{
    opacity:.55;
    pointer-events:none;
}

.jj-discovery-wrap{
    position:relative;
    margin-top:-66px;
    z-index:5;
}

.jj-discovery{
    width:min(1152px,calc(100% - 48px));
    margin:auto;
    background:#fff;
    border:1px solid var(--jj-border);
    border-radius:12px;
    padding:28px 32px;
    box-shadow:0 4px 10px rgba(61,43,31,.08);
    text-align:center;
}

.jj-discovery h2{
    font-size:24px;
}

.jj-chips{
    display:flex;
    justify-content:center;
    gap:10px;
    flex-wrap:wrap;
    margin:16px 0;
}

.jj-chips a,
.jj-faq-cats button{
    border:1px solid var(--jj-border);
    background:var(--jj-cream);
    padding:7px 14px;
    border-radius:999px;
    font-size:13px;
    color:var(--jj-brown);
}

.jj-chips a.is-active{
    background:var(--jj-gold);
    border-color:var(--jj-gold);
    color:#fff;
}

.jj-search-row{
    display:flex;
    gap:12px;
}

.jj-search-row input,
.jj-blog-tools input{
    flex:1;
    background:var(--jj-cream);
    border:1px solid var(--jj-border);
    border-radius:8px;
    padding:13px 16px;
    color:var(--jj-brown);
    outline:none;
}

.jj-search-row input:focus,
.jj-blog-tools input:focus,
.jj-contact-form input:focus,
.jj-contact-form textarea:focus{
    border-color:var(--jj-gold);
    box-shadow:0 0 0 3px rgba(197,160,89,.14);
}

.jj-search-row button{
    border:0;
    border-radius:8px;
    background:var(--jj-maroon);
    color:#fff;
    padding:0 32px;
}

.jj-home-products{
    padding:100px 0 70px;
    background:var(--jj-soft);
}

.jj-section-heading{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:28px;
}

.jj-section-heading h2{
    font-size:32px;
}

.jj-section-heading p{
    color:var(--jj-copy);
    margin-top:4px;
}

.jj-section-heading>a{
    color:var(--jj-maroon);
    font-size:14px;
    white-space:nowrap;
}


/* =========================================================
   PRODUK CARD
========================================================= */

.jj-product-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:22px;
}

.jj-product-card{
    background:#fff;
    border:1px solid var(--jj-border);
    border-radius:8px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    min-width:0;
}

.jj-product-image{
    display:block;
    aspect-ratio:1/1;
    background-size:cover;
    background-position:center;
    background-color:#e7e3d7;
}

.jj-product-image.is-empty{
    background:linear-gradient(135deg,#f1e8d3,#e7ddc7);
    display:grid;
    place-items:center;
    text-align:center;
    padding:24px;
    color:var(--jj-muted);
    font-size:12px;
}

.jj-product-body{
    padding:16px;
    display:flex;
    flex-direction:column;
    gap:7px;
    height:100%;
}

.jj-product-body h3{
    font:500 15px/1.5 'Plus Jakarta Sans',sans-serif;
    min-height:46px;
}

.jj-product-body h3 a:hover{
    color:var(--jj-maroon);
}

.jj-price{
    font-family:'Literata',serif;
    color:var(--jj-maroon);
    margin:auto 0 5px;
    font-size:16px;
}


/* =========================================================
   STORY
========================================================= */

.jj-story-strip{
    padding:64px 0;
    background:var(--jj-ivory);
}

.jj-story-strip .jj-container{
    display:grid;
    grid-template-columns:1.2fr 1fr auto;
    gap:30px;
    align-items:center;
}

.jj-story-strip h2{
    font-size:30px;
    margin-top:6px;
}

.jj-story-strip p{
    color:var(--jj-muted);
}


/* =========================================================
   FOOTER
========================================================= */

.jj-footer{
    background:var(--jj-brown);
    color:var(--jj-cream);
}

.jj-footer-inner{
    width:min(1152px,calc(100% - 48px));
    margin:auto;
    padding:48px 0;
    display:grid;
    grid-template-columns:1.4fr repeat(3,1fr);
    gap:32px;
}

.jj-footer h4{
    font:600 13px/1.4 'Plus Jakarta Sans',sans-serif;
    color:var(--jj-gold);
    letter-spacing:.05em;
}

.jj-footer a{
    display:block;
    color:#e5d3b3;
    margin-top:9px;
    font-size:14px;
}

.jj-footer-brand>a{
    font:600 24px/1.2 'Literata',serif;
    color:var(--jj-gold);
    margin:0;
}

.jj-footer-brand p{
    font-size:13px;
    color:rgba(245,240,225,.78);
    max-width:290px;
    margin-top:12px;
}

.jj-copyright{
    text-align:center;
    border-top:1px solid rgba(229,211,179,.14);
    padding:20px 24px;
    font-size:12px;
    color:rgba(245,240,225,.62);
}


/* =========================================================
   BLOG / ARTIKEL ARCHIVE
========================================================= */

.jj-page-hero{
    padding:72px 0 42px;
    text-align:center;
}

.jj-page-hero h1{
    font-size:48px;
    color:var(--jj-maroon);
}

.jj-page-hero p{
    max-width:680px;
    margin:10px auto 0;
    color:var(--jj-muted);
    font-size:17px;
}

.jj-blog-hero{
    text-align:left;
    padding-bottom:26px;
}

.jj-blog-hero p{
    margin-left:0;
}

.jj-blog-main{
    padding:0 0 80px;
}

.jj-blog-tools{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    margin-bottom:28px;
}

.jj-blog-tools form{
    width:min(385px,100%);
}

.jj-blog-tools .jj-chips{
    margin:0;
}

.jj-article-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:28px;
}

.jj-article-card{
    border:1px solid var(--jj-border);
    background:#fff;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 1px 2px rgba(0,0,0,.04);
}

.jj-article-card.is-featured{
    grid-column:1/-1;
    display:grid;
    grid-template-columns:1.5fr 1fr;
}

.jj-article-card.is-featured .jj-article-image{
    aspect-ratio:16/8;
}

.jj-article-image{
    display:block;
    aspect-ratio:1.35/1;
    background-size:cover;
    background-position:center;
    background-color:#e4e3d8;
}

.jj-article-image.is-empty{
    background:linear-gradient(135deg,#d8cbb1,#ad9677);
}

.jj-article-body{
    padding:22px;
    display:flex;
    flex-direction:column;
    gap:8px;
}

.jj-article-body h2{
    font-size:23px;
    color:var(--jj-maroon);
}

.jj-article-card.is-featured h2{
    font-size:30px;
}

.jj-article-body p{
    color:var(--jj-muted);
    font-size:14px;
}

.jj-article-body time{
    font-size:12px;
    color:#8e706c;
    border-top:1px solid rgba(229,211,179,.5);
    padding-top:12px;
    margin-top:auto;
}

.jj-pagination{
    display:flex;
    justify-content:center;
    margin-top:36px;
}

.jj-pagination .nav-links{
    display:flex;
    gap:7px;
}

.jj-pagination a,
.jj-pagination span{
    min-width:38px;
    height:38px;
    border:1px solid var(--jj-border);
    border-radius:7px;
    display:grid;
    place-items:center;
}

.jj-pagination .current{
    background:var(--jj-maroon);
    color:#fff;
    border-color:var(--jj-maroon);
}


/* =========================================================
   SINGLE ARTIKEL
========================================================= */

.jj-single{
    padding:48px 0 20px;
}

.jj-single-head{
    padding-top:10px;
}

.jj-breadcrumb{
    font-size:12px;
    color:var(--jj-muted);
    display:flex;
    gap:8px;
    margin-bottom:15px;
}

.jj-pill{
    display:inline-block;
    background:var(--jj-cream);
    border:1px solid var(--jj-border);
    border-radius:999px;
    padding:5px 12px;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.jj-single-head h1{
    color:var(--jj-maroon);
    font-size:48px;
    max-width:900px;
    margin:12px 0;
}

.jj-post-meta{
    display:flex;
    gap:15px;
    border-bottom:1px solid var(--jj-border);
    padding-bottom:22px;
    color:var(--jj-muted);
    font-size:13px;
}

.jj-single-hero{
    margin-top:24px;
}

.jj-single-hero img{
    width:100%;
    max-height:560px;
    object-fit:cover;
    border-radius:12px;
    border:1px solid var(--jj-border);
}


/* DESKTOP:
   isi artikel + sidebar oleh-oleh */
.jj-single-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 280px;
    gap:28px;
    align-items:start;
    padding-top:42px;
}

.jj-toc,
.jj-article-side{
    position:sticky;
    top:110px;
    background:#fff;
    border:1px solid var(--jj-border);
    border-radius:12px;
    padding:20px;
}

.jj-toc h3,
.jj-article-side h3{
    font-size:20px;
    margin-bottom:13px;
}

.jj-toc p,
.jj-article-side p{
    font-size:12px;
    color:var(--jj-muted);
}

.jj-toc nav{
    display:flex;
    flex-direction:column;
    gap:9px;
    margin-bottom:18px;
}

.jj-toc nav a{
    font-size:12px;
    font-weight:600;
    color:var(--jj-copy);
}

.jj-toc nav a.is-sub{
    padding-left:12px;
    border-left:2px solid var(--jj-border);
}

.jj-share{
    border-top:1px solid var(--jj-border);
    padding-top:16px;
    display:flex;
    flex-direction:column;
    gap:8px;
    font-size:11px;
}

.jj-share button{
    border:1px solid var(--jj-border);
    background:var(--jj-cream);
    border-radius:8px;
    padding:8px;
}

.jj-article-content{
    font-size:18px;
    line-height:1.72;
    color:#1b1c16;
}

.jj-article-content>*{
    margin-top:0;
    margin-bottom:25px;
}

.jj-article-content h2{
    font-size:32px;
    color:var(--jj-maroon);
    margin-top:36px;
}

.jj-article-content h3{
    font-size:24px;
    margin-top:30px;
}

.jj-article-content blockquote{
    margin:32px 0;
    padding:28px 32px;
    border-left:4px solid var(--jj-gold);
    background:#fcfaef;
    border-radius:0 12px 12px 0;
    font:italic 22px/1.5 'Literata',serif;
}

.jj-article-content figure img{
    border-radius:12px;
}

.jj-article-side .jj-product-grid{
    grid-template-columns:1fr;
}

.jj-article-side .jj-product-card{
    border:0;
}

.jj-article-side .jj-product-body{
    padding:10px 0;
}

.jj-promo-box{
    margin-top:20px;
    background:var(--jj-maroon);
    color:#fff;
    border-radius:12px;
    padding:20px;
    display:flex;
    flex-direction:column;
    text-align:center;
}

.jj-promo-box span{
    font-size:12px;
    opacity:.8;
    margin-top:4px;
}


/* Artikel terkait */

.jj-related{
    padding:34px 0 70px;
    border-top:1px solid var(--jj-border);
}

.jj-related-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px;
}

.jj-related-grid article{
    background:#fff;
    border:1px solid var(--jj-border);
    border-radius:12px;
    overflow:hidden;
}

.jj-related-grid img{
    width:100%;
    aspect-ratio:1.5/1;
    object-fit:cover;
}

.jj-related-grid h3{
    font-size:18px;
    color:var(--jj-maroon);
    padding:15px 15px 0;
}

.jj-related-grid p{
    font-size:13px;
    color:var(--jj-muted);
    padding:7px 15px 18px;
}


/* =========================================================
   ABOUT
========================================================= */

.jj-about-hero{
    padding:70px 0 80px;
}

.jj-about-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:48px;
    align-items:center;
}

.jj-about-hero h1{
    font-size:58px;
}

.jj-about-hero h1 span{
    display:block;
    color:var(--jj-maroon);
}

.jj-about-hero p{
    font-size:17px;
    color:var(--jj-muted);
    margin-top:18px;
}

.jj-photo-slot{
    height:480px;
    border-radius:12px;
    overflow:hidden;
    background:linear-gradient(135deg,#d5c3a7,#9d7958);
    box-shadow:0 10px 20px rgba(0,0,0,.09);
    display:grid;
    place-items:center;
    color:#fff;
    text-align:center;
}

.jj-photo-slot img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.jj-photo-slot span{
    max-width:260px;
}

.jj-about-story{
    padding:0 0 70px;
}

.jj-about-story>h2,
.jj-values h2{
    text-align:center;
    color:var(--jj-maroon);
    font-size:32px;
    margin-bottom:30px;
}

.jj-bento{
    display:grid;
    grid-template-columns:2fr 1fr;
    grid-template-rows:1fr 1fr;
    gap:22px;
    min-height:500px;
}

.jj-bento-large{
    grid-row:1/3;
    background:linear-gradient(
        to top,
        rgba(61,43,31,.92),
        rgba(61,43,31,.25)
    ),
    linear-gradient(135deg,#8a725e,#c8aa79);
    border-radius:12px;
    padding:32px;
    display:flex;
    flex-direction:column;
    justify-content:end;
    color:#fff;
}

.jj-bento-large h3{
    color:#fff;
    font-size:24px;
}

.jj-bento-large p{
    font-size:14px;
    opacity:.88;
}

.jj-bento-card{
    background:var(--jj-cream);
    border:1px solid var(--jj-border);
    border-radius:12px;
    padding:25px;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.jj-bento-card h3{
    font-size:20px;
}

.jj-bento-card p{
    color:var(--jj-muted);
    font-size:14px;
    margin-top:8px;
}

.jj-bento-card.is-image{
    background:
        linear-gradient(rgba(253,251,240,.74),rgba(253,251,240,.74)),
        linear-gradient(135deg,#8b765e,#e1c98b);
}

.jj-values{
    padding:52px 0;
    background:linear-gradient(100deg,#f6f4e9,#f8e7dd);
}

.jj-values-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:28px;
}

.jj-values article{
    text-align:center;
    background:rgba(255,255,255,.68);
    border:1px solid var(--jj-border);
    border-radius:12px;
    padding:28px;
}

.jj-value-icon{
    width:58px;
    height:58px;
    border-radius:50%;
    display:grid;
    place-items:center;
    margin:0 auto 12px;
    background:var(--jj-cream);
    color:var(--jj-maroon);
    font-family:'Literata',serif;
}

.jj-values h3{
    font-size:20px;
}

.jj-values p{
    font-size:14px;
    color:var(--jj-muted);
    margin-top:7px;
}

.jj-strong-cta{
    margin:70px 0;
    background:linear-gradient(100deg,var(--jj-maroon) 45%,#a62118);
    border-radius:16px;
    color:#fff;
    padding:56px;
    overflow:hidden;
    position:relative;
}

.jj-strong-cta:after{
    content:'';
    position:absolute;
    width:420px;
    height:420px;
    right:-100px;
    top:-180px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(197,160,89,.5),rgba(197,160,89,0) 70%);
}

.jj-strong-cta>div{
    position:relative;
    z-index:2;
    max-width:540px;
}

.jj-strong-cta h2{
    color:#fff;
    font-size:32px;
}

.jj-strong-cta p{
    color:#f8dac8;
    margin-top:12px;
}


/* =========================================================
   FAQ
========================================================= */

.jj-faq-section{
    padding:0 0 70px;
}

.jj-faq-layout{
    display:grid;
    grid-template-columns:300px 1fr;
    gap:32px;
    align-items:start;
}

.jj-faq-cats,
.jj-faq-card{
    background:#fff;
    border:1px solid var(--jj-border);
    border-radius:8px;
    padding:24px;
}

.jj-faq-cats{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.jj-faq-cats h2{
    font-size:24px;
    color:var(--jj-maroon);
    padding-bottom:14px;
    border-bottom:1px solid var(--jj-border);
    margin-bottom:4px;
}

.jj-faq-cats button{
    text-align:left;
    border:0;
    border-radius:6px;
    background:transparent;
    color:var(--jj-muted);
    font-weight:600;
}

.jj-faq-cats button.is-active{
    background:var(--jj-cream);
    color:var(--jj-maroon);
}

.jj-faq-card>h2{
    font-size:24px;
    margin-bottom:12px;
}

.jj-faq-item{
    border-bottom:1px solid var(--jj-border);
}

.jj-faq-item>button{
    width:100%;
    border:0;
    background:transparent;
    padding:18px 0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    text-align:left;
    font:500 17px/1.4 'Literata',serif;
    color:#1b1c16;
}

.jj-chevron{
    color:var(--jj-gold);
    font-family:sans-serif;
    font-size:20px;
    transition:.2s;
}

.jj-faq-item.is-open .jj-chevron{
    transform:rotate(180deg);
}

.jj-faq-answer{
    padding:0 0 18px;
    color:var(--jj-muted);
    font-size:14px;
}

.jj-support-card{
    margin-top:30px;
    text-align:center;
    background:var(--jj-cream);
    border:1px solid var(--jj-border);
    border-radius:8px;
    padding:34px;
}

.jj-support-icon{
    width:52px;
    height:52px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:#f8dac8;
    color:var(--jj-maroon);
    font:700 24px 'Literata',serif;
    margin:auto;
}

.jj-support-card h2{
    font-size:24px;
    margin-top:10px;
}

.jj-support-card p{
    color:var(--jj-muted);
    margin:7px 0 18px;
}


/* =========================================================
   CONTACT
========================================================= */

.jj-contact-hero{
    min-height:400px;
    display:grid;
    place-items:center;
    text-align:center;
    background:linear-gradient(180deg,#cfb080 0%,#fdfbf0 92%);
    position:relative;
    overflow:hidden;
}

.jj-contact-hero.has-image{
    background-image:
        linear-gradient(to bottom,rgba(253,251,240,.35),var(--jj-ivory)),
        var(--jj-contact-image);
    background-size:cover;
    background-position:center;
}

.jj-contact-hero h1{
    font-size:48px;
}

.jj-contact-hero p{
    max-width:680px;
    margin:10px auto 0;
    color:var(--jj-muted);
    font-size:17px;
}

.jj-contact-main{
    padding:48px 0 64px;
}

.jj-contact-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:72px;
}

.jj-contact-info>h2,
.jj-contact-form-card>h2{
    font-size:24px;
    padding-bottom:13px;
    border-bottom:1px solid var(--jj-border);
    margin-bottom:20px;
}

.jj-contact-line{
    display:flex;
    flex-direction:column;
    margin:18px 0;
    padding-left:62px;
    min-height:48px;
    position:relative;
}

.jj-contact-line:before{
    content:'';
    position:absolute;
    left:0;
    top:0;
    width:48px;
    height:48px;
    border-radius:50%;
    background:var(--jj-cream);
}

.jj-contact-line strong{
    font-size:13px;
}

.jj-contact-line span,
.jj-contact-line a{
    font-size:14px;
    color:var(--jj-muted);
}

.jj-contact-line a{
    color:var(--jj-maroon);
}

.jj-hours>div{
    display:flex;
    justify-content:space-between;
    color:var(--jj-muted);
    padding:4px 0;
    font-size:14px;
}

.jj-hours dt,
.jj-hours dd{
    margin:0;
}

.jj-contact-form-card{
    background:#fff;
    border:1px solid var(--jj-border);
    box-shadow:var(--jj-shadow);
    border-radius:12px;
    padding:30px;
}

.jj-contact-form{
    display:flex;
    flex-direction:column;
    gap:17px;
}

.jj-contact-form label{
    display:flex;
    flex-direction:column;
    gap:5px;
    font-size:12px;
    font-weight:600;
    color:var(--jj-muted);
}

.jj-contact-form input,
.jj-contact-form textarea{
    width:100%;
    background:var(--jj-cream);
    border:1px solid var(--jj-border);
    border-radius:8px;
    padding:12px 14px;
    outline:none;
    color:var(--jj-brown);
    resize:vertical;
}

.jj-two-fields{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
}

.jj-contact-form .jj-btn{
    width:100%;
}

.jj-hp{
    position:absolute!important;
    left:-9999px!important;
}

.jj-notice{
    padding:11px 13px;
    border-radius:7px;
    margin-bottom:15px;
    font-size:13px;
}

.jj-notice.success{
    background:#edf8ee;
    color:#245c2b;
}

.jj-notice.error{
    background:#fff0ef;
    color:#8a1b17;
}


/* =========================================================
   BASIC PAGE
========================================================= */

.jj-basic-page{
    padding:64px 0 80px;
}

.jj-basic-page h1{
    font-size:44px;
    color:var(--jj-maroon);
    margin-bottom:28px;
}

.entry-content{
    max-width:100%;
}

.entry-content a{
    color:var(--jj-maroon);
    text-decoration:underline;
}

.entry-content h2{
    font-size:30px;
    margin:32px 0 12px;
}

.entry-content h3{
    font-size:23px;
    margin:28px 0 10px;
}

.jj-index-item,
.jj-search-results article{
    background:#fff;
    border:1px solid var(--jj-border);
    padding:24px;
    border-radius:10px;
    margin-bottom:16px;
}

.jj-index-item h2,
.jj-search-results h2{
    font-size:25px;
    color:var(--jj-maroon);
}

.jj-empty-state{
    text-align:center;
    padding:70px 24px;
}

.jj-empty-state h1,
.jj-empty-state h2{
    margin:10px 0;
}

.jj-empty-state p{
    color:var(--jj-muted);
    margin-bottom:20px;
}


/* =========================================================
   WOOCOMMERCE
========================================================= */

.jj-woo-page{
    padding:54px 0 80px;
}

.jj-shop-head{
    text-align:center;
    margin-bottom:36px;
}

.jj-shop-head h1{
    font-size:48px;
    color:var(--jj-maroon);
}

.jj-shop-head p{
    color:var(--jj-muted);
    margin-top:7px;
}

.woocommerce .woocommerce-breadcrumb{
    font-size:12px;
    color:var(--jj-muted);
    margin-bottom:24px;
}

.woocommerce .woocommerce-result-count{
    color:var(--jj-muted);
    font-size:13px;
}

.woocommerce .woocommerce-ordering select{
    background:var(--jj-cream);
    border:1px solid var(--jj-border);
    border-radius:8px;
    padding:10px 14px;
}

.woocommerce ul.products{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:22px;
    margin:30px 0!important;
}

.woocommerce ul.products:before,
.woocommerce ul.products:after{
    display:none!important;
}

.woocommerce ul.products li.product{
    float:none!important;
    width:auto!important;
    margin:0!important;
    background:#fff;
    border:1px solid var(--jj-border);
    border-radius:10px;
    overflow:hidden;
    padding-bottom:16px;
    display:flex;
    flex-direction:column;
}

.woocommerce ul.products li.product a img{
    margin:0!important;
    width:100%;
    aspect-ratio:1/1;
    object-fit:cover;
    background:#e4e3d8;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title{
    font:500 15px/1.45 'Plus Jakarta Sans',sans-serif!important;
    color:var(--jj-brown);
    padding:14px 15px 6px!important;
}

.woocommerce ul.products li.product .price{
    font:400 16px/1.5 'Literata',serif!important;
    color:var(--jj-maroon)!important;
    padding:0 15px;
    margin-top:auto;
}

.woocommerce ul.products li.product .button{
    margin:10px 15px 0!important;
    background:var(--jj-cream)!important;
    color:var(--jj-brown)!important;
    border:1px solid var(--jj-border)!important;
    border-radius:7px!important;
    text-align:center;
    font-size:13px;
}

.woocommerce span.onsale{
    background:var(--jj-gold)!important;
}

.woocommerce div.product{
    display:grid;
    grid-template-columns:1fr 1fr;
    column-gap:48px;
}

.woocommerce div.product .woocommerce-product-gallery{
    width:auto!important;
    float:none!important;
}

.woocommerce div.product div.summary{
    width:auto!important;
    float:none!important;
    margin:0!important;
}

.woocommerce div.product .product_title{
    font-size:42px;
    color:var(--jj-brown);
}

.woocommerce div.product p.price,
.woocommerce div.product span.price{
    color:var(--jj-maroon)!important;
    font:400 26px 'Literata',serif;
}

.woocommerce div.product form.cart{
    display:flex;
    gap:12px;
    align-items:center;
    margin:26px 0!important;
}

.woocommerce .quantity .qty{
    border:1px solid var(--jj-border);
    background:var(--jj-cream);
    border-radius:999px;
    padding:10px;
    width:74px;
}

.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce button.button,
.woocommerce a.button{
    background:var(--jj-maroon);
    color:#fff;
    border-radius:8px;
}


/* =========================================================
   RESPONSIVE TABLET
========================================================= */

@media(max-width:1024px){

    .jj-header-inner{
        padding:0 24px;
    }

    .jj-desktop-nav,
    .jj-admin-btn{
        display:none;
    }

    .jj-menu-toggle{
        display:inline-flex;
    }

    .jj-container{
        width:min(100% - 40px,900px);
    }

    .jj-hero{
        height:520px;
    }

    .jj-hero h1{
        font-size:42px;
        line-height:1.15;
    }

    .jj-discovery-wrap{
        margin-top:24px;
    }

    .jj-discovery{
        width:calc(100% - 40px);
    }

    .jj-home-products{
        padding-top:64px;
    }

    .jj-product-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .jj-story-strip .jj-container{
        grid-template-columns:1fr 1fr;
    }

    .jj-story-strip .jj-btn{
        grid-column:1/-1;
        justify-self:start;
    }

    .jj-footer-inner{
        grid-template-columns:1.4fr 1fr 1fr;
        gap:25px;
    }

    .jj-footer-inner>div:last-child{
        grid-column:2;
    }

    .jj-article-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .jj-article-card.is-featured{
        grid-template-columns:1fr 1fr;
    }

    .jj-single-head h1{
        font-size:42px;
    }

    /* Artikel + produk tetap 2 kolom di tablet */
    .jj-single-layout{
        grid-template-columns:minmax(0,1fr) 220px;
    }

    /* Produk HARUS tetap tampil */
    .jj-article-side{
        display:block!important;
    }

    .jj-about-hero h1{
        font-size:48px;
    }

    .jj-faq-layout{
        grid-template-columns:230px 1fr;
    }

    .jj-contact-grid{
        gap:40px;
    }

    .woocommerce ul.products{
        grid-template-columns:repeat(2,1fr);
    }

    .woocommerce div.product{
        column-gap:30px;
    }
}


@media(max-width:782px){

    .admin-bar .jj-site-header{
        top:46px;
    }

}


/* =========================================================
   RESPONSIVE MOBILE
========================================================= */

@media(max-width:700px){

    .jj-site-header{
        height:auto;
        box-shadow:0 1px 8px rgba(61,43,31,.06);
    }

    .jj-header-inner{
        height:auto;
        min-height:64px;
        padding:8px 12px 0;
        gap:8px 10px;
        flex-wrap:wrap;
    }

    .jj-brand{
        font-size:18px;
        line-height:1;
    }

    .jj-header-actions{
        gap:7px;
        margin-left:auto;
    }

    .jj-admin-btn{
        display:none;
    }

    .jj-cart-link{
        font-size:11px!important;
        padding:7px 9px;
        border-radius:999px;
        background:#fff;
    }

    .jj-cart-link:before{
        content:none!important;
    }

    .jj-cart-link span{
        margin-left:3px;
    }

    .jj-desktop-nav{
        display:block!important;
        order:3;
        width:calc(100% + 24px);
        margin:0 -12px;
        padding:0 12px;
        overflow-x:auto;
        background:var(--jj-ivory);
        scrollbar-width:none;
        border-top:1px solid rgba(229,211,179,.55);
    }

    .jj-desktop-nav::-webkit-scrollbar{
        display:none;
    }

    .jj-nav-list{
        width:max-content;
        min-width:100%;
        justify-content:flex-start;
        flex-wrap:nowrap;
        white-space:nowrap;
        gap:18px;
    }

    .jj-nav-list a{
        font-size:12px;
        padding:10px 0 9px;
    }

    .jj-menu-toggle,
    .jj-mobile-menu{
        display:none!important;
    }

    .jj-container{
        width:calc(100% - 28px);
    }

    .jj-hero{
        height:520px;
        align-items:end;
        padding-bottom:36px;
    }

    .jj-hero-overlay{
        background:linear-gradient(
            0deg,
            rgba(61,43,31,.85),
            rgba(61,43,31,.2) 80%
        );
    }

    .jj-hero h1{
        font-size:34px;
        line-height:1.08;
    }

    .jj-hero p{
        font-size:14px;
        line-height:1.5;
    }

    .jj-hero-actions{
        display:grid;
        grid-template-columns:1fr;
        width:100%;
        gap:8px;
        margin-top:20px;
    }

    .jj-hero-actions .jj-btn{
        width:100%;
    }

    .jj-discovery{
        padding:20px 12px;
    }

    .jj-discovery h2{
        font-size:21px;
    }

    .jj-search-row{
        display:grid;
        grid-template-columns:1fr;
    }

    .jj-search-row button{
        padding:11px;
    }

    .jj-home-products{
        padding:46px 0;
    }

    .jj-section-heading{
        align-items:start;
    }

    .jj-section-heading h2{
        font-size:27px;
    }

    .jj-section-heading p{
        font-size:12px;
    }

    .jj-section-heading>a{
        font-size:11px;
    }

    .jj-product-grid{
        grid-template-columns:1fr;
        gap:16px;
    }

    .jj-product-image{
        aspect-ratio:1.2/1;
    }

    .jj-product-body h3{
        min-height:0;
    }

    .jj-story-strip .jj-container{
        grid-template-columns:1fr;
        gap:16px;
    }

    .jj-story-strip .jj-btn{
        grid-column:auto;
    }

    .jj-footer-inner{
        grid-template-columns:repeat(3,1fr);
        padding:34px 0;
        gap:14px;
    }

    .jj-footer-brand{
        grid-column:1/-1;
    }

    .jj-footer-brand p{
        font-size:11px;
    }

    .jj-footer h4{
        font-size:10px;
    }

    .jj-footer a{
        font-size:10px;
    }

    .jj-page-hero{
        padding:48px 0 30px;
    }

    .jj-page-hero h1{
        font-size:34px;
    }

    .jj-page-hero p{
        font-size:14px;
    }

    .jj-blog-tools{
        align-items:stretch;
        flex-direction:column;
    }

    .jj-blog-tools form{
        width:100%;
    }

    .jj-blog-tools .jj-chips{
        justify-content:start;
        overflow-x:auto;
        flex-wrap:nowrap;
    }

    .jj-article-grid{
        grid-template-columns:1fr;
    }

    .jj-article-card.is-featured{
        grid-column:auto;
        display:block;
    }

    .jj-article-card.is-featured h2{
        font-size:23px;
    }


    /* =============================================
       SINGLE ARTICLE MOBILE
       Isi artikel → Oleh-oleh → Artikel terkait
    ============================================= */

    .jj-single{
        padding-top:34px;
    }

    .jj-single-head h1{
        font-size:34px;
    }

    .jj-post-meta{
        flex-wrap:wrap;
    }

    .jj-single-layout{
        display:flex!important;
        flex-direction:column!important;

        width:calc(100% - 28px)!important;
        margin-left:auto!important;
        margin-right:auto!important;

        padding-top:28px!important;
        gap:0!important;
    }

    .jj-single-layout > .jj-article-content{
        display:flow-root!important;

        width:100%!important;
        max-width:100%!important;
        min-width:0!important;

        order:1!important;

        font-size:16px;
    }

    .jj-article-content h2{
        font-size:28px;
    }


    /* OLEH-OLEH PILIHAN MOBILE */
    .jj-single-layout > .jj-article-side{
        display:block!important;
        visibility:visible!important;
        opacity:1!important;

        position:static!important;
        float:none!important;
        clear:both!important;

        width:100%!important;
        max-width:100%!important;

        height:auto!important;
        max-height:none!important;

        overflow:visible!important;

        order:2!important;

        margin:40px 0 0!important;
        padding:20px!important;

        background:#fff!important;
        border:1px solid var(--jj-border)!important;
        border-radius:12px!important;
    }

    .jj-single-layout > .jj-article-side .jj-product-grid{
        display:grid!important;
        grid-template-columns:1fr!important;
        width:100%!important;
        max-width:100%!important;
    }

    .jj-single-layout > .jj-article-side .jj-product-card{
        display:flex!important;
        flex-direction:column!important;
        width:100%!important;
        max-width:100%!important;
    }

    .jj-single-layout > .jj-article-side .jj-product-image{
        display:block!important;
        width:100%!important;
        height:auto!important;
        aspect-ratio:1.2/1;
    }

    .jj-single-layout > .jj-article-side .jj-product-body{
        display:flex!important;
        flex-direction:column!important;
    }

    .jj-single-layout > .jj-article-side .jj-promo-box{
        display:flex!important;
        width:100%!important;
    }


    /* ARTIKEL TERKAIT MOBILE */
    .jj-related{
        clear:both!important;
        position:static!important;
        margin-top:48px;
    }

    .jj-related-grid{
        grid-template-columns:1fr;
    }


    .jj-about-grid{
        grid-template-columns:1fr;
    }

    .jj-about-hero{
        padding:45px 0;
    }

    .jj-about-hero h1{
        font-size:40px;
    }

    .jj-photo-slot{
        height:360px;
    }

    .jj-bento{
        grid-template-columns:1fr;
        grid-template-rows:auto;
    }

    .jj-bento-large{
        grid-row:auto;
        min-height:330px;
    }

    .jj-values-grid{
        grid-template-columns:1fr;
    }

    .jj-strong-cta{
        padding:34px 24px;
        margin:44px 0;
    }

    .jj-faq-layout{
        grid-template-columns:1fr;
    }

    .jj-faq-cats{
        display:none;
    }

    .jj-faq-card{
        padding:18px;
    }

    .jj-faq-item>button{
        font-size:15px;
    }

    .jj-contact-hero{
        min-height:330px;
    }

    .jj-contact-hero h1{
        font-size:36px;
    }

    .jj-contact-grid{
        grid-template-columns:1fr;
        gap:34px;
    }

    .jj-contact-form-card{
        padding:20px;
    }

    .jj-two-fields{
        grid-template-columns:1fr;
    }

    .jj-basic-page{
        padding:45px 0;
    }

    .jj-basic-page h1{
        font-size:36px;
    }

    .woocommerce ul.products{
        grid-template-columns:1fr;
    }

    .woocommerce div.product{
        display:block;
    }

    .woocommerce div.product .product_title{
        font-size:34px;
        margin-top:24px;
    }

    .woocommerce div.product form.cart{
        flex-wrap:wrap;
    }

    .jj-woo-page{
        padding-top:35px;
    }

    .jj-shop-head h1{
        font-size:36px;
    }

}


/* =========================================================
   DESTINASI
========================================================= */

.jj-destination-hero{
    text-align:center;
}

.jj-destination-hero .jj-kicker{
    color:var(--jj-gold);
    font-weight:700;
}

.jj-destination-archive{
    padding:10px 0 80px;
}

.jj-destination-filters{
    margin:0 0 30px;
}

.jj-destination-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:24px;
}

.jj-destination-card{
    background:#fff;
    border:1px solid var(--jj-border);
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 1px 2px rgba(61,43,31,.04);
}

.jj-destination-image{
    display:block;
    aspect-ratio:1.35/1;
    background-size:cover;
    background-position:center;
    background-color:#e4e3d8;
}

.jj-destination-image.is-empty{
    background:linear-gradient(135deg,var(--jj-cream),#e5d3b3);
}

.jj-destination-body{
    padding:20px;
}

.jj-destination-body h2{
    font-size:22px;
    color:var(--jj-maroon);
    margin:6px 0 8px;
}

.jj-destination-body>p{
    font-size:14px;
    color:var(--jj-muted);
    margin-top:8px;
}

.jj-destination-location{
    color:var(--jj-copy)!important;
    font-weight:600;
}

.jj-text-link{
    display:inline-block;
    color:var(--jj-maroon);
    font-weight:700;
    font-size:13px;
    margin-top:14px;
}

.jj-destination-single-head{
    min-height:520px;
    position:relative;
    display:flex;
    align-items:end;
    background:linear-gradient(135deg,#806b58,#d1b77c);
}

.jj-destination-single-bg,
.jj-destination-single-overlay{
    position:absolute;
    inset:0;
}

.jj-destination-single-bg{
    background-size:cover;
    background-position:center;
}

.jj-destination-single-overlay{
    background:linear-gradient(
        0deg,
        rgba(61,43,31,.9),
        rgba(61,43,31,.15) 75%
    );
}

.jj-destination-single-copy{
    position:relative;
    color:#fff;
    padding-bottom:55px;
}

.jj-destination-single-copy h1{
    font-size:52px;
    color:#fff;
    margin:12px 0;
}

.jj-destination-detail-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) 330px;
    gap:48px;
    padding-top:55px;
    padding-bottom:70px;
}

.jj-destination-content{
    font-size:17px;
    line-height:1.8;
}

.jj-destination-content h2{
    font-size:32px;
    color:var(--jj-maroon);
    margin:32px 0 14px;
}

.jj-destination-content h3{
    font-size:24px;
    margin:26px 0 12px;
}

.jj-destination-content p{
    margin:0 0 18px;
}

.jj-destination-info-card{
    position:sticky;
    top:110px;
    align-self:start;
    background:#fff;
    border:1px solid var(--jj-border);
    border-radius:12px;
    padding:24px;
    box-shadow:var(--jj-shadow);
}


@media(max-width:1024px){

    .jj-destination-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .jj-destination-detail-grid{
        grid-template-columns:minmax(0,1fr) 280px;
        gap:30px;
    }

    .jj-destination-single-copy h1{
        font-size:44px;
    }

}


@media(max-width:700px){

    .jj-destination-grid{
        grid-template-columns:1fr;
    }

    .jj-destination-single-head{
        min-height:460px;
    }

    .jj-destination-single-copy{
        padding-bottom:32px;
    }

    .jj-destination-single-copy h1{
        font-size:36px;
    }

    .jj-destination-detail-grid{
        grid-template-columns:1fr;
        padding-top:35px;
    }

    .jj-destination-info-card{
        position:static;
    }

    .jj-destination-content{
        font-size:16px;
    }

    .jj-destination-content h2{
        font-size:28px;
    }

}


/* =========================================================
   V2.1
========================================================= */

.jj-elementor-page,
.jj-full-width-page{
    width:100%;
    min-height:1px;
}

.jj-elementor-page>.elementor,
.jj-full-width-page>.elementor{
    width:100%;
}

.jj-site-content{
    min-height:180px;
}

.jj-brand .custom-logo-link{
    display:flex;
    align-items:center;
}

.jj-brand .custom-logo{
    display:block;
    width:auto;
    max-width:220px;
    max-height:58px;
    object-fit:contain;
}

.jj-product-image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.jj-product-grid.jj-cols-1{
    grid-template-columns:1fr;
}

.jj-product-grid.jj-cols-2{
    grid-template-columns:repeat(2,minmax(0,1fr));
}

.jj-product-grid.jj-cols-3{
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.jj-product-grid.jj-cols-4{
    grid-template-columns:repeat(4,minmax(0,1fr));
}

.jj-product-profile{
    margin:20px 0 4px;
    padding-top:18px;
    border-top:1px solid var(--jj-border);
}

.jj-product-profile h2{
    margin:0 0 10px;
    font:600 15px/1.4 'Plus Jakarta Sans',sans-serif;
    color:var(--jj-brown);
}

.jj-product-profile-links{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

.jj-product-profile-link{
    display:inline-flex;
    align-items:center;
    min-height:36px;
    padding:7px 12px;
    border:1px solid var(--jj-border);
    border-radius:999px;
    background:var(--jj-cream);
    color:var(--jj-maroon);
    font-size:12px;
    font-weight:700;
}

.jj-product-profile-link:hover{
    border-color:var(--jj-gold);
    background:#fff;
}

.wc-block-cart,
.wc-block-checkout{
    color:var(--jj-brown);
    font-family:'Plus Jakarta Sans',sans-serif;
}

.wc-block-components-button:not(.is-link){
    border:0!important;
    border-radius:8px!important;
    background:var(--jj-maroon)!important;
    color:#fff!important;
}

.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout{
    max-width:1152px;
    margin-right:auto;
    margin-left:auto;
    padding-right:24px;
    padding-left:24px;
}


@media(max-width:1024px){

    .jj-product-grid.jj-cols-3,
    .jj-product-grid.jj-cols-4{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

}


@media(max-width:700px){

    .jj-brand .custom-logo{
        max-width:150px;
        max-height:42px;
    }

    .jj-product-grid.jj-cols-2,
    .jj-product-grid.jj-cols-3,
    .jj-product-grid.jj-cols-4{
        grid-template-columns:1fr;
    }

    .wp-block-woocommerce-cart,
    .wp-block-woocommerce-checkout{
        padding-right:14px;
        padding-left:14px;
    }

}