@font-face{font-family:'Cormorant';src:url('font/CormorantGaramond.woff2') format('woff2');font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:'Cormorant';src:url('font/CormorantGaramond-Italic.woff2') format('woff2');font-weight:300 700;font-style:italic;font-display:swap}
@font-face{font-family:'Jost';src:url('font/Jost.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:'Pinyon';src:url('font/PinyonScript.woff2') format('woff2');font-weight:400;font-display:swap}
:root{--cream:#F7F2E8;--cream-2:#EFE6D6;--white:#FFFDF9;--green:#2C4A3B;--green-deep:#1E372C;--green-soft:#DCE7DC;--gold:#B99659;
--pink:#E39AA2;--pink-soft:#F6DCDE;--red:#C4575F;--peach:#ECAB93;--peach-deep:#D98B6E;--blue-soft:#DCE8F0;--brown:#7A5B44;--ink:#22302A;--soft:#5F6B63;--line:#DED5C5;
--serif:'Cormorant',Georgia,'Times New Roman',serif;--sans:'Jost',system-ui,-apple-system,sans-serif;--script:'Pinyon',cursive;
--wrap:1240px;--gut:24px;--hd:68px;--r:14px;--ease:cubic-bezier(.22,.61,.36,1)}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hd) + 12px);-webkit-text-size-adjust:100%}
body{background:var(--cream) url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22220%22%20height%3D%22220%22%3E%3Cfilter%20id%3D%22n%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%22.9%22%20numOctaves%3D%222%22%20stitchTiles%3D%22stitch%22/%3E%3CfeColorMatrix%20values%3D%220%200%200%200%20.35%200%200%200%200%20.28%200%200%200%200%20.2%200%200%200%20.11%200%22/%3E%3C/filter%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20filter%3D%22url%28%23n%29%22/%3E%3C/svg%3E") repeat;color:var(--ink);font:400 16px/1.6 var(--sans);overflow-x:hidden;font-variant-numeric:lining-nums}
img,video{display:block;max-width:100%}
a{color:inherit}
ol,ul{list-style:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
[hidden]{display:none!important}
input,select{font:inherit;color:inherit}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.i{width:20px;height:20px;flex:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.kicker{font-size:12px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--gold)}
.h2{font-family:var(--serif);font-weight:600;font-size:clamp(36px,4.6vw,56px);line-height:1.02;color:var(--green);margin-top:8px}
.lead{font-size:17px;color:var(--soft);max-width:600px;margin-top:12px}
.sek-hd{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.tangan{font-family:var(--script);color:var(--red);font-size:1.1em;line-height:.8;white-space:nowrap;padding:0 .05em}

/* tombol */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 24px;border-radius:999px;
 font:500 15px/1 var(--sans);letter-spacing:.03em;text-decoration:none;border:1px solid var(--green);color:var(--green);background:transparent;
 transition:transform .35s var(--ease),background .25s,color .25s,box-shadow .35s;white-space:nowrap;cursor:pointer}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px -14px rgba(30,55,44,.6)}
.btn-isi{background:var(--green);color:var(--cream)}
.btn-isi:hover{background:var(--green-deep)}
.btn-krem{background:var(--cream);color:var(--green);border-color:var(--cream)}
.btn-garis-krem{border-color:var(--gold);color:var(--cream)}
.btn-garis-krem:hover{background:rgba(247,242,232,.1)}
.btn .i{transition:transform .35s var(--ease)}
.btn:hover .i.arr{transform:translateX(4px)}
.ikon-btn{width:46px;height:46px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:var(--green);color:var(--cream);
 transition:transform .35s var(--ease),background .25s}
.ikon-btn:hover{transform:translateY(-2px) scale(1.04);background:var(--green-deep)}
.ikon-btn .i{width:22px;height:22px}
.tautan{display:inline-flex;align-items:center;gap:8px;font-weight:500;text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:2px;color:var(--green)}
.tautan:hover{border-color:var(--green)}

/* animasi muncul */
.rv{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}
.rv.in{opacity:1;transform:none}

/* header */
.kepala{position:sticky;top:0;z-index:40;background:rgba(247,242,232,.86);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
 transition:box-shadow .3s,background .3s}
.kepala.turun{box-shadow:0 6px 24px -16px rgba(30,55,44,.5);background:rgba(247,242,232,.96)}
.kepala .wrap{display:flex;align-items:center;gap:22px;height:var(--hd)}
.merk{font-family:var(--serif);font-weight:600;font-size:18px;letter-spacing:.3em;text-transform:uppercase;text-decoration:none;display:flex;align-items:center;gap:12px;color:var(--green)}
.merk img{width:38px;height:38px}
.nav{display:flex;gap:26px;margin-left:auto}
.nav a{font-size:14px;font-weight:500;letter-spacing:.05em;text-decoration:none;color:var(--green);position:relative;padding:4px 0}
.nav a:after{content:'';position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--gold);transition:right .35s var(--ease)}
.nav a:hover:after,.nav a[aria-current]:after{right:0}
@media(max-width:960px){.nav{display:none}.kepala .ikon-btn{display:none}.kepala .wrap{position:relative;justify-content:center}
 .kepala .merk img{position:absolute;left:var(--gut);top:50%;transform:translateY(-50%)}.kepala .merk span{font-size:16px;letter-spacing:.26em}}

/* hero slider */
.slider{position:relative;height:min(86vh,780px);min-height:560px;overflow:hidden;background:var(--cream)}
.slide{position:absolute;inset:0;display:grid;grid-template-columns:27% 1fr 27%;opacity:0;pointer-events:none;transition:opacity 1s var(--ease)}
.slide.aktif{opacity:1;pointer-events:auto;z-index:1}
.slide .ft{overflow:hidden;background:var(--cream-2)}
.slide .ft img{width:100%;height:100%;object-fit:cover;transform:scale(1.02)}
.slide.aktif .ft img{animation:kb 9s var(--ease) forwards}
@keyframes kb{from{transform:scale(1.02)}to{transform:scale(1.12)}}
.slide .tx{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 36px;position:relative}
.slide .tx>*{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.slide.aktif .tx>*{opacity:1;transform:none}
.slide.aktif .tx>:nth-child(2){transition-delay:.15s}.slide.aktif .tx>:nth-child(3){transition-delay:.3s}
.slide.aktif .tx>:nth-child(4){transition-delay:.42s}.slide.aktif .tx>:nth-child(5){transition-delay:.55s}
.slide h2{font-family:var(--serif);font-weight:600;text-transform:uppercase;font-size:clamp(44px,6.4vw,96px);line-height:.95;letter-spacing:.01em;color:var(--green)}
.slide h2 em{display:block;font-style:italic;font-weight:500;text-transform:none;letter-spacing:0;margin-top:.02em}
.slide h2 em.pink{color:var(--red)}
.slide h2 .tangan{font-size:.92em}.slide h2 em.gold{color:var(--gold)}.slide h2 em.green{color:var(--green)}
.slide .sub{font-weight:500;font-size:clamp(18px,2.1vw,26px);color:var(--brown);margin-top:24px;line-height:1.3;max-width:620px}
.slide .sub.satu{font-size:clamp(16px,1.6vw,23px);max-width:none}
@media(min-width:961px){.slide .sub.satu{white-space:nowrap}}
.slide .aksi{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:30px}
.slide .bintang{position:absolute;width:28px;height:28px;color:var(--gold);right:9%;top:16%;animation:kelip 3s ease-in-out infinite;z-index:0}
.slide .bintang.b{width:16px;height:16px;left:9%;bottom:14%;animation-delay:1.4s}
@keyframes kelip{0%,100%{opacity:.35;transform:scale(.8) rotate(0)}50%{opacity:1;transform:scale(1.1) rotate(20deg)}}
.slider .panah{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:48px;height:48px;border-radius:50%;background:rgba(247,242,232,.85);color:var(--green);
 display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px -8px rgba(0,0,0,.35);transition:background .25s,transform .3s}
.slider .panah:hover{background:var(--cream);transform:translateY(-50%) scale(1.06)}
.slider .kiri{left:18px}.slider .kanan{right:18px}
.titik{position:absolute;bottom:22px;left:0;right:0;display:flex;justify-content:center;gap:8px;z-index:3}
.titik button{width:10px;height:10px;border-radius:50%;background:rgba(44,74,59,.3);transition:background .3s,transform .3s}
.titik button.aktif{background:var(--green);transform:scale(1.25)}
@media(max-width:960px){.slider{height:auto;min-height:0}.slide{position:relative;grid-template-columns:1fr;display:none}.slide.aktif{display:block}
 .slide .ft.kanan{display:none}.slide .ft.kiri{aspect-ratio:4/3;max-height:380px}.slide .tx{padding:36px 20px 64px}
 .slide .bintang{right:6%;top:10%}.slide .bintang.b{left:6%;bottom:9%}.slider .panah{top:auto;bottom:14px;transform:none;width:42px;height:42px}.slider .panah:hover{transform:none}
 .titik{bottom:26px}}

/* kategori */
.kategori{padding:44px 0 10px}
.kategori ul{display:flex;gap:18px;overflow-x:auto;scrollbar-width:none;padding:6px 2px 14px;justify-content:center}
.kategori ul::-webkit-scrollbar{display:none}
.kategori a{display:flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none;flex:none;width:118px;text-align:center}
.kategori .bulat{width:92px;height:92px;border-radius:50%;overflow:hidden;border:3px solid var(--white);box-shadow:0 10px 24px -14px rgba(30,55,44,.6);transition:transform .45s var(--ease)}
.kategori .bulat img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.kategori a:hover .bulat{transform:translateY(-4px)}
.kategori a:hover .bulat img{transform:scale(1.08)}
.kategori span{font-size:13px;font-weight:500;color:var(--green);line-height:1.25}
@media(max-width:760px){.kategori ul{justify-content:flex-start}.kategori a{width:96px}.kategori .bulat{width:76px;height:76px}}

/* marquee */
.marquee{background:var(--green);color:var(--cream);overflow:hidden;padding:14px 0;margin-top:28px}
.marquee .jalur{display:flex;width:max-content;animation:jalan 38s linear infinite}
.marquee:hover .jalur{animation-play-state:paused}
.marquee span{font-family:var(--serif);font-style:italic;font-size:22px;padding:0 22px;display:flex;align-items:center;gap:22px;white-space:nowrap}
.marquee .bintang{width:14px;height:14px;color:var(--gold)}
@keyframes jalan{to{transform:translateX(-50%)}}

/* produk beranda */
.produk{padding:72px 0 10px}
.geser-wrap{position:relative;margin-top:28px}
.track{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:8px 2px 10px;margin:0 -2px}
.track::-webkit-scrollbar{display:none}
.geser{position:absolute;top:34%;z-index:2;width:46px;height:46px;border-radius:50%;background:rgba(247,242,232,.92);color:var(--green);display:flex;align-items:center;justify-content:center;
 box-shadow:0 8px 20px -10px rgba(0,0,0,.4);transition:background .25s,color .25s,transform .3s}
.geser:hover{background:var(--green);color:var(--cream);transform:scale(1.05)}
.geser.kiri{left:-14px}.geser.kanan{right:-14px}
.card{flex:0 0 calc((100% - 66px)/4);scroll-snap-align:start;text-align:center;transition:transform .5s var(--ease)}
.card:hover{transform:translateY(-6px)}
.card .ft{display:block;width:100%;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;position:relative;background:var(--cream-2);cursor:zoom-in;
 box-shadow:0 18px 34px -24px rgba(30,55,44,.55)}
.card .ft img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.card:hover .ft img{transform:scale(1.06)}
.card .kode{position:absolute;left:12px;top:12px;font-size:11px;font-weight:600;letter-spacing:.16em;background:rgba(247,242,232,.9);color:var(--green);padding:5px 9px;border-radius:999px}
.card h4{font-family:var(--serif);font-weight:600;font-size:24px;line-height:1.1;color:var(--green);margin-top:16px;cursor:pointer}
.card .pil{display:flex;justify-content:center;gap:6px;margin-top:12px;flex-wrap:wrap}
.card .pil span{font-size:12px;background:var(--cream-2);color:var(--brown);border-radius:999px;padding:5px 11px;letter-spacing:.04em}
.card .pil span.uk{background:var(--pink-soft);color:var(--red);font-weight:600}
.card .pesan{display:inline-flex;align-items:center;gap:8px;margin-top:12px;font-size:14px;font-weight:500;color:var(--green);text-decoration:none;
 border:1px solid var(--line);border-radius:999px;padding:9px 16px;transition:background .25s,color .25s,border-color .25s}
.card .pesan:hover{background:var(--green);color:var(--cream);border-color:var(--green)}
.card .pesan .i{width:16px;height:16px}
@media(max-width:1100px){.card{flex-basis:calc((100% - 44px)/3)}}
@media(max-width:760px){.track{gap:14px}.card{flex-basis:calc((100% - 14px)/2)}.card h4{font-size:20px}.card .hrg{font-size:15px}
 .card .pil span{font-size:11px;padding:4px 9px}.card .pil span:not(.uk){display:none}.card .pesan{padding:8px 13px;font-size:13px}.geser{display:none}}

/* papan harga money bouquet */
.papan{border-radius:var(--r);background:var(--green);color:var(--cream);padding:30px 32px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:28px;align-items:center;position:relative;overflow:hidden}
.papan .orn{position:absolute;right:-60px;bottom:-70px;width:320px;opacity:.12;transform:scaleX(-1);pointer-events:none}
.papan .kicker{color:var(--gold)}
.papan h4{font-family:var(--serif);font-weight:600;font-size:34px;line-height:1.05;margin-top:6px}
.papan .cat{font-size:14px;color:rgba(247,242,232,.75);margin-top:12px;line-height:1.55;max-width:380px}
.papan ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;position:relative}
.papan li{background:rgba(247,242,232,.08);border:1px solid rgba(247,242,232,.18);border-radius:12px;padding:16px 10px;text-align:center;transition:background .3s}
.papan li:hover{background:rgba(247,242,232,.16)}
.papan .n{font-family:var(--serif);font-size:34px;font-weight:600;line-height:1}
.papan .u{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-top:3px}
.papan .btn{margin-top:18px}
@media(max-width:760px){.papan{grid-template-columns:1fr;padding:22px}.papan ol{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* cara pesan */
.cara{margin-top:64px;padding:72px 0;background:var(--cream-2) url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22220%22%20height%3D%22220%22%3E%3Cfilter%20id%3D%22n%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%22.9%22%20numOctaves%3D%222%22%20stitchTiles%3D%22stitch%22/%3E%3CfeColorMatrix%20values%3D%220%200%200%200%20.35%200%200%200%200%20.28%200%200%200%200%20.2%200%200%200%20.11%200%22/%3E%3C/filter%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20filter%3D%22url%28%23n%29%22/%3E%3C/svg%3E") repeat}
.langkah{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:36px}
.langkah li{background:var(--peach);border-radius:var(--r);padding:28px 22px 30px;text-align:center;transition:transform .5s var(--ease),box-shadow .5s,background .4s}
.langkah li:hover{transform:translateY(-6px);box-shadow:0 24px 40px -30px rgba(122,91,68,.55);background:var(--peach-deep)}
.langkah .no{display:block;font-family:var(--serif);font-size:56px;line-height:1;color:var(--green-deep)}
.langkah .no:after{content:'';display:block;width:28px;height:2px;background:var(--green-deep);opacity:.7;margin:14px auto 0}
.langkah h3{font-family:var(--serif);font-weight:600;font-size:24px;color:var(--green-deep);margin-top:16px;line-height:1.1}
.langkah p{margin-top:8px;font-size:15px;color:#3F3129;line-height:1.6}
.batas{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-top:20px}
.batas div{border:1px solid var(--line);border-radius:var(--r);padding:18px 22px;background:rgba(255,253,249,.6)}
.batas b{font-family:var(--serif);font-weight:600;font-size:22px;color:var(--green);display:block}
.batas p{font-size:15px;color:var(--soft);margin-top:4px}
@media(max-width:960px){.langkah{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.langkah{grid-template-columns:1fr}}

/* tentang */
.tentang{background:var(--green-deep);color:var(--cream);position:relative;overflow:hidden}
.tentang .orn{position:absolute;right:-90px;top:50%;transform:translateY(-50%) rotate(180deg);width:560px;opacity:.1;pointer-events:none}
.tentang .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:center;padding-top:80px;padding-bottom:80px;position:relative}
.tentang .orang{position:relative;max-width:420px;margin:0 auto;width:100%}
.tentang .orang img{width:100%;height:auto;border-radius:var(--r);box-shadow:0 34px 60px -30px rgba(0,0,0,.65)}
.tentang .kicker{color:var(--gold)}
.tentang .h2{color:var(--cream)}
.tentang p{margin-top:18px;line-height:1.75;max-width:600px;color:rgba(247,242,232,.9)}
.tentang p+p{margin-top:12px}
.tentang .tangan{color:var(--pink)}
.tentang .aksi{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
@media(max-width:960px){.tentang .wrap{grid-template-columns:1fr;gap:40px;padding-top:56px;padding-bottom:56px}.tentang .tx{order:-1}
 .tentang .orang{max-width:360px}}

/* toko */
.toko{padding:80px 0}
.klip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:32px}
.klip figure{position:relative;background:var(--cream-2);overflow:hidden;border-radius:var(--r);aspect-ratio:9/16;transition:transform .5s var(--ease)}
.klip figure:hover{transform:translateY(-4px)}
.klip video{width:100%;height:100%;object-fit:cover}
.klip figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 12px;font-size:12px;letter-spacing:.06em;color:#fff;background:linear-gradient(transparent,rgba(30,55,44,.7))}
@media(max-width:760px){.klip{grid-template-columns:1fr 1fr;gap:10px}}

/* lokasi */
.lokasi{padding:0 0 80px}
.lok-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:36px}
.lok{border-radius:var(--r);overflow:hidden;background:var(--white);box-shadow:0 20px 40px -30px rgba(30,55,44,.4);display:grid;grid-template-rows:auto 1fr;transition:transform .5s var(--ease)}
.lok:hover{transform:translateY(-4px)}
.lok .ft{aspect-ratio:3/2;overflow:hidden;background:var(--cream-2)}
.lok .ft .ilus{width:100%;height:100%;display:block}
.lok .ft img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.lok:hover .ft img{transform:scale(1.05)}
.lok .tx{padding:24px 26px 28px}
.lok .jenis{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);font-weight:600}
.lok h3{font-family:var(--serif);font-weight:600;font-size:32px;line-height:1.05;margin-top:6px;color:var(--green)}
.lok .al{margin-top:8px;color:var(--soft)}
.lok .ct{font-size:14px;color:var(--soft);margin-top:12px;line-height:1.55;padding-top:12px;border-top:1px dotted var(--line)}
.lok .aksi{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
@media(max-width:760px){.lok-grid{grid-template-columns:1fr}}

/* kontak */
.kontak{background:var(--green);color:var(--cream);position:relative;overflow:hidden}
.kontak:before{content:'';position:absolute;left:-120px;top:-120px;width:420px;height:420px;border-radius:50%;background:rgba(247,242,232,.06)}
.kontak .wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.2fr);gap:32px;align-items:center;padding-top:64px;padding-bottom:64px;position:relative}
.kontak h2{font-family:var(--serif);font-weight:600;font-size:clamp(34px,3.6vw,48px);line-height:1.05}
.kontak .adm{border-left:1px solid rgba(247,242,232,.3);padding-left:20px}
.kontak .adm b{display:block;font-weight:500;font-size:17px}
.kontak .adm span{display:block;font-size:14px;color:rgba(247,242,232,.7);margin-top:2px}
.kontak .adm a.em{display:block;font-size:17px;color:var(--cream);margin-top:4px;text-decoration:none}
.kontak .adm a.em:hover{color:var(--gold)}
.kontak .adm .btn{margin-top:12px;min-height:42px;padding:0 18px;font-size:14px}
@media(max-width:960px){.kontak .wrap{grid-template-columns:1fr 1fr;padding-top:48px;padding-bottom:48px}.kontak h2{grid-column:1/-1}}
@media(max-width:560px){.kontak .wrap{grid-template-columns:1fr}}

/* syarat */
.syarat{padding:72px 0 80px}
.akordeon{margin-top:28px;border-top:1px solid var(--line)}
.akordeon details{border-bottom:1px solid var(--line)}
.akordeon summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;font-family:var(--serif);font-weight:600;font-size:23px;color:var(--green)}
.akordeon summary::-webkit-details-marker{display:none}
.akordeon summary .plus{width:30px;height:30px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;position:relative;flex:none;transition:transform .4s var(--ease),background .3s}
.akordeon summary .plus:before,.akordeon summary .plus:after{content:'';position:absolute;background:var(--green);width:12px;height:1.5px;transition:transform .4s var(--ease)}
.akordeon summary .plus:after{transform:rotate(90deg)}
.akordeon details[open] summary .plus{transform:rotate(45deg);background:var(--green-soft)}
.akordeon ul{padding:0 0 18px}
.akordeon li{font-size:15px;line-height:1.6;color:var(--soft);padding:5px 0 5px 18px;position:relative}
.akordeon li:before{content:'';position:absolute;left:0;top:14px;width:5px;height:5px;border-radius:50%;background:var(--pink)}

/* footer */
.kaki{background:var(--green-deep);color:#E6DECF;padding:60px 0 36px}
.kaki .wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1.1fr) minmax(0,1fr);gap:40px}
.kaki .merk{color:var(--cream)}
.kaki .tag{font-family:var(--serif);font-style:italic;font-size:22px;margin-top:14px;color:var(--cream)}
.kaki .sub{font-size:14px;color:rgba(230,222,207,.65);margin-top:8px;max-width:320px}
.kaki h4{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
.kaki li{padding:5px 0}
.kaki li a{text-decoration:none;font-size:15px}
.kaki li a:hover{text-decoration:underline}
.kaki .sosmed{display:flex;gap:10px}
.kaki .sosmed a{width:44px;height:44px;border-radius:50%;border:1px solid rgba(230,222,207,.35);display:flex;align-items:center;justify-content:center;color:var(--cream);transition:background .25s,transform .35s var(--ease)}
.kaki .sosmed a:hover{background:rgba(230,222,207,.12);transform:translateY(-3px)}
.kaki .email{display:inline-block;margin-top:14px;font-size:15px;color:var(--cream);text-decoration:none}
.kaki .email:hover{color:var(--gold)}
.kaki .bayar{display:inline-flex;background:var(--white);border-radius:10px;padding:10px 16px}
.kaki .bayar img{height:28px;width:auto}
.kaki .bayar-ket{font-size:13px;color:rgba(230,222,207,.65);margin-top:10px}
.kaki .bawah{grid-column:1/-1;border-top:1px solid rgba(230,222,207,.18);margin-top:20px;padding-top:20px;font-size:13px;color:rgba(230,222,207,.55);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
@media(max-width:900px){.kaki .wrap{grid-template-columns:1fr 1fr;gap:30px}}
@media(max-width:560px){.kaki .wrap{grid-template-columns:1fr}}

/* dialog produk */
dialog.lihat{border:0;padding:0;background:var(--white);color:var(--ink);width:min(92vw,900px);max-height:92vh;overflow:auto;margin:auto;border-radius:var(--r)}
dialog.lihat::backdrop{background:rgba(30,55,44,.65);backdrop-filter:blur(4px)}
dialog.lihat .isi-dlg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
dialog.lihat img{width:100%;height:100%;aspect-ratio:4/5;object-fit:cover}
dialog.lihat .tx{padding:34px 32px}
dialog.lihat .kode{font-size:12px;letter-spacing:.2em;color:var(--gold);font-weight:600}
dialog.lihat .nm{font-family:var(--serif);font-weight:600;font-size:36px;line-height:1.05;color:var(--green);margin-top:6px}
dialog.lihat .desk{color:var(--soft);margin-top:12px;line-height:1.65}
dialog.lihat .meta{margin-top:14px}
dialog.lihat .uk{font-size:12px;font-weight:600;background:var(--pink-soft);color:var(--red);border-radius:999px;padding:5px 11px}
dialog.lihat .cat{font-size:13px;color:var(--soft);margin-top:8px;font-style:italic}
dialog.lihat .btn{margin-top:22px;width:100%}
dialog.lihat .tutup{position:absolute;top:12px;right:12px;width:40px;height:40px;border-radius:50%;background:rgba(247,242,232,.92);display:flex;align-items:center;justify-content:center;color:var(--green)}
@media(max-width:700px){dialog.lihat .isi-dlg{grid-template-columns:1fr}dialog.lihat img{aspect-ratio:4/4}dialog.lihat .tx{padding:22px 20px 26px}dialog.lihat .nm{font-size:28px}}

/* halaman katalog */
.katalog-hal{padding:28px 0 80px}
.remah{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--soft)}
.remah a{text-decoration:none;color:var(--soft)}
.remah a:hover{color:var(--green)}
.remah span{color:var(--green);font-weight:600}
.judul-row{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-top:18px}
.judul-row h1{font-family:var(--serif);font-weight:600;font-size:clamp(36px,4.4vw,52px);line-height:1.05;color:var(--green);display:inline-block;
 border-bottom:1px solid var(--green);padding-bottom:6px}
.judul-row .jml{display:block;font-size:14px;color:var(--soft);margin-top:10px;letter-spacing:.06em}
.alat{display:flex;gap:10px;align-items:center}
.filter-btn{display:none}
.urut select{appearance:none;-webkit-appearance:none;border:1px solid var(--line);border-radius:12px;padding:12px 44px 12px 16px;background:var(--white) url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%232C4A3B%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%209l6%206%206-6%22/%3E%3C/svg%3E") no-repeat right 14px center/18px;color:var(--green);font-weight:500;cursor:pointer}
.tata{display:grid;grid-template-columns:260px minmax(0,1fr);gap:40px;margin-top:30px;align-items:start}
.aside{position:sticky;top:calc(var(--hd) + 16px)}
.aside .cari span{display:block;font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--green);margin-bottom:8px}
.aside .cari input{width:100%;border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--white)}
.aside details{border-bottom:1px solid var(--line)}
.aside summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:16px 0;font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--green)}
.aside summary::-webkit-details-marker{display:none}
.aside summary .chev{width:18px;height:18px;background:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%232C4A3B%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%209l6%206%206-6%22/%3E%3C/svg%3E") no-repeat center/18px;transition:transform .35s var(--ease)}
.aside details[open] summary .chev{transform:rotate(180deg)}
.aside .opsi{padding:0 0 14px}
.aside .opsi label{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:15px;cursor:pointer;color:var(--ink)}
.aside .opsi label small{margin-left:auto;font-size:12px;color:var(--soft)}
.aside input[type=checkbox]{width:17px;height:17px;accent-color:var(--green);flex:none;cursor:pointer}
.aside .chips{display:flex;flex-wrap:wrap;gap:8px;padding:4px 0 16px}
.aside .chips label{padding:0;cursor:pointer}
.aside .chips input{position:absolute;opacity:0;width:0;height:0}
.aside .chips span{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-size:13px;font-weight:600;letter-spacing:.08em;background:var(--white);transition:background .2s,color .2s,border-color .2s}
.aside .chips input:checked+span{background:var(--green);color:var(--cream);border-color:var(--green)}
.aside .chips input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.aside .tombol{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.aside .tombol .btn{min-height:44px;padding:0 14px}
.aside .tanya{display:inline-flex;align-items:center;gap:8px;margin-top:22px;font-size:14px;font-weight:500;color:var(--green);text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:2px}
.aside .tanya:hover{border-color:var(--green)}
.hasil{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 22px}
.hasil .card{flex:none;width:auto}
.hasil .papan{grid-column:1/-1}
.kosong{grid-column:1/-1;text-align:center;padding:70px 20px;color:var(--soft);font-size:17px}
.kosong .tautan{margin-left:8px}
.katalog-hal .catatan{font-size:14px;font-style:italic;color:var(--soft);margin-top:40px}
@media(max-width:960px){.tata{grid-template-columns:1fr;gap:20px}.aside{position:static;display:none;background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:18px 18px 22px}
 .aside.buka{display:block}.filter-btn{display:inline-flex;min-height:44px;padding:0 16px;font-size:14px}.aside .opsi label{padding:8px 0}.hasil{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}}
@media(max-width:560px){.judul-row h1{font-size:34px}.urut select{padding:10px 40px 10px 14px;font-size:14px}}

/* WA melayang (HP) */
.fab{position:fixed;right:16px;bottom:16px;z-index:35;display:none;width:56px;height:56px;border-radius:50%;background:#25D366;color:#fff;align-items:center;justify-content:center;box-shadow:0 12px 28px -8px rgba(0,0,0,.4)}
.fab .i{width:30px;height:30px}
@media(max-width:960px){.fab{display:flex}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
 .rv{opacity:1;transform:none;transition:none}.slide.aktif .ft img,.marquee .jalur,.slide .bintang{animation:none}
 .slide .tx>*{opacity:1;transform:none;transition:none}.card,.btn,.lok,.langkah li{transition:none}}