/* Sumber Mulyo — warm clay, real materials, editorial typography. */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Serif+Display:ital@0;1&display=swap');
:root{--bata:#a54730;--bata-tua:#873723;--bata-pekat:#642b1f;--bata-muda:#e9a286;--bata-lembut:#f3e6dc;--tanah:#b96243;--ink:#302820;--ink-2:#44362c;--muted:#71665d;--paper:#f8f4ed;--sand:#eee6da;--white:#fffdf9;--line:#ded4c7;--r-sm:6px;--r:10px;--r-lg:12px;--r-pill:6px;--shadow:0 12px 40px -28px #30282044;--shadow-lg:0 24px 50px -30px #30282044;--font-body:'DM Sans',sans-serif;--font-head:'DM Serif Display',Georgia,serif;--wrap:1240px}
body{font-size:16px;line-height:1.75;overflow-x:clip;background:var(--paper)}
h1,h2,h3{font-weight:400;line-height:1.12;letter-spacing:-.025em;text-transform:none}
.wrap{padding-inline:32px}.section{padding:96px 0;scroll-margin-top:90px}.h2{font-size:clamp(2.1rem,3.7vw,3.25rem);line-height:1.12;text-transform:none}.lead{font-size:1rem;line-height:1.85;max-width:48ch}.section-head{gap:32px;margin-bottom:38px;align-items:end}.section-head>.lead{max-width:410px}.eyebrow{font-family:var(--font-body);font-size:.68rem;letter-spacing:.18em;font-weight:700;gap:12px}.eyebrow::before{width:22px;height:1px}.eyebrow--terang{color:#efb69e}.strip-bata{height:1px;background:none;border:0;border-top:1px solid var(--line)}
.btn{min-height:50px;padding:13px 22px;border-width:1px;border-radius:5px;font-family:var(--font-body);font-size:.84rem;letter-spacing:.01em;font-weight:600;gap:12px;box-shadow:none;line-height:1.5;transition:background .2s,transform .2s,color .2s}.btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px -12px #30282066}.btn--bata{--bg:var(--bata);border:1px solid var(--bata)}.btn--bata:hover{--bg:var(--bata-tua);box-shadow:none}.btn--putih{--bg:var(--paper);--fg:var(--ink)}.btn--garis{--bg:transparent;--fg:var(--bata);--bd:var(--line)}.btn--garis:hover{background:var(--bata-lembut);color:var(--bata-tua);border-color:var(--bata)}.btn--sm{padding:10px 15px;min-height:44px;font-size:.8rem}.btn .dot{box-shadow:none;width:7px;height:7px;background:#76ae83}.btn--block{width:100%}
.topbar{background:var(--bata-pekat);font-size:.7rem;letter-spacing:.04em}.topbar__row{animation:none;width:auto;max-width:1240px;margin:auto;padding:8px 32px;justify-content:space-between;gap:20px;white-space:normal}.topbar__row span{opacity:1}.topbar__row span:nth-child(n+4){display:none}
.nav{background:rgba(248,244,237,.97);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}.nav__inner{min-height:88px;gap:24px}.logo{font-family:var(--font-body);font-size:1.05rem;letter-spacing:.05em;font-weight:700;gap:12px}.logo small{font-size:.52rem;letter-spacing:.15em;font-weight:500;margin-top:7px}.logo__mark{width:44px;height:44px;border-radius:5px;background:var(--bata);box-shadow:none}.logo__mark svg{width:26px;height:26px}.nav__links{gap:3px}.nav__links a{font-size:.8rem;font-weight:500;padding:10px 12px;border-radius:5px}.nav__links .nav__cta{color:white;padding:12px 18px;margin-left:14px}.nav__links .nav__cta:hover{background:var(--bata-tua);color:white}.burger{border-radius:5px;background:transparent}.progress{background:var(--bata);height:2px}
.hero{background:var(--paper);color:var(--ink);overflow:hidden;border-bottom:1px solid var(--line)}.hero::before,.hero::after{display:none}.hero__grid{grid-template-columns:1.03fr 1fr;gap:64px;padding:68px 32px 70px;align-items:center}.hero__tag{background:none;border:0;padding:0;border-radius:0;color:var(--bata);font-size:.65rem;font-weight:700;letter-spacing:.12em;line-height:1.7}.hero__tag .dot{background:var(--bata);animation:none;width:6px;height:6px}.hero h1{font-size:clamp(3.05rem,4.65vw,4.4rem);font-weight:400;line-height:1.08;text-transform:none;letter-spacing:-.035em;margin:23px 0 23px}.hero h1 em{color:var(--bata);font-weight:400;font-style:italic}.hero__lead{font-size:1rem;color:var(--muted);max-width:47ch;line-height:1.85}.hero__btns{margin:28px 0;gap:12px}.hero .btn--putih{background:var(--bata);color:white}.hero .btn--putih:hover{background:var(--bata-tua)}.hero .btn--garis{color:var(--ink);border-color:#b5a79a}.hero .btn--garis:hover{background:var(--bata-lembut);color:var(--bata)}.hero__facts{display:flex;gap:0;padding-top:23px;border-top:1px solid var(--line);margin-top:28px}.hero__facts li{background:none;border:0;border-radius:0;padding:0 18px;font-size:.68rem;color:var(--muted);font-weight:400;line-height:1.6}.hero__facts li:first-child{padding-left:0}.hero__facts li+li{border-left:1px solid var(--line)}.hero__facts strong{display:block;color:var(--ink);font-size:1.02rem;font-weight:600;margin-bottom:2px}
.hero__art{position:relative;min-height:0;display:block;padding:0 0 20px 0;order:0}.hero-visual{margin:0;position:relative;border-radius:110px 8px 8px 8px;overflow:hidden;background:var(--sand)}.hero-visual>img{width:100%;height:535px;object-fit:cover;object-position:center 53%;display:block}.hero-visual::after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#21170fcc);pointer-events:none}.hero-visual figcaption{position:absolute;bottom:25px;left:28px;right:24px;z-index:1;color:white;display:flex;justify-content:space-between;align-items:end;gap:20px}.hero-visual figcaption small{display:block;font-size:.62rem;text-transform:uppercase;letter-spacing:.16em;color:#f3d8c3;margin-bottom:5px}.hero-visual figcaption strong{font-family:var(--font-head);font-size:1.7rem;font-weight:400}.hero-visual figcaption>span:last-child{font-size:.7rem;text-align:right;color:#f5e9dd}.hero-tile{position:absolute;right:-18px;bottom:-4px;z-index:2;width:165px;padding:7px;background:var(--white);border:1px solid var(--line);box-shadow:var(--shadow-lg);transform:rotate(4deg)}.hero-tile img{width:100%;height:120px;object-fit:cover}.hero-tile span{display:block;font-size:.59rem;letter-spacing:.08em;text-align:center;text-transform:uppercase;padding:6px 0 0}.material-label{position:absolute;top:22px;right:20px;z-index:2;background:rgba(248,244,237,.94);padding:9px 14px;font-size:.63rem;color:var(--bata-pekat);letter-spacing:.1em;text-transform:uppercase}
.band{padding:0;background:var(--bata);color:white}.band__row{width:auto;max-width:1240px;margin:auto;animation:none;display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding:23px 32px}.band__row span{font-family:var(--font-body);font-size:.78rem;text-transform:none;font-weight:500;letter-spacing:.01em;text-align:center;border-right:1px solid #ffffff33;white-space:normal;line-height:1.5}.band__row span:last-child{border:0}.band__row span:nth-child(even){color:white}.band__row small{display:block;color:#ffe5d6;font-size:.65rem;margin-top:4px;font-weight:400}.band__row i{display:none}
.grid-produk{gap:24px}.card{border:1px solid var(--line);border-radius:8px;background:var(--white);box-shadow:none}.card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.card__art{aspect-ratio:4/3;background:var(--sand)}.card__art img{object-fit:cover;transition:transform .45s}.card:hover .card__art img{transform:scale(1.025)}.card__label{left:16px;top:16px;border-radius:3px;background:var(--paper);color:var(--bata-pekat);font-family:var(--font-body);font-size:.61rem;font-weight:600;letter-spacing:.1em;padding:5px 11px;z-index:1}.card__body{padding:25px;gap:13px}.card h3{font-size:1.65rem;text-transform:none;line-height:1.2}.card__desc{font-size:.86rem;line-height:1.8}.harga{margin:7px 0 0;gap:7px}.harga b{font-family:var(--font-body);font-size:1.6rem;font-weight:600;letter-spacing:-.04em}.harga span{font-size:.73rem;font-weight:400}.card__foot{padding-top:18px}.harga-aksi{grid-template-columns:1.4fr 1fr}.product-spec{padding:0;margin:0;list-style:none;border-top:1px solid var(--line)}.product-spec li{font-size:.76rem;padding:7px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:15px;color:var(--muted)}.product-spec b{font-weight:500;color:var(--ink);text-align:right}.price-note{font-size:.75rem;color:var(--muted);margin:18px 0 0}
.kotak-grosir{margin-top:34px;padding:30px 34px;border-radius:8px;background:var(--bata-pekat);grid-template-columns:1fr auto;gap:40px}.kotak-grosir::after{display:none}.kotak-grosir h3{font-size:1.9rem;text-transform:none;font-weight:400}.kotak-grosir p{font-size:.88rem;max-width:68ch;color:#f3dbcf}.kotak-info{gap:24px;margin-top:24px}.kotak-info div{background:transparent;box-shadow:none;border:0;border-top:1px solid var(--line);border-radius:0;padding:23px 0}.kotak-info b{font-family:var(--font-body);font-size:.66rem;letter-spacing:.13em;font-weight:700;margin-bottom:10px}.kotak-info span{font-size:.84rem;line-height:1.8}
.story{background:var(--sand);border-bottom:1px solid var(--line)}.story-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:76px;align-items:center}.story-photo{margin:0;position:relative}.story-photo img{width:100%;height:490px;object-fit:cover;border-radius:6px 90px 6px 6px}.story-photo figcaption{font-size:.72rem;color:var(--muted);margin-top:14px;display:flex;justify-content:space-between;gap:16px}.story-copy h2{margin:16px 0 22px}.story-copy p{color:var(--muted);font-size:.94rem;line-height:1.85;margin-top:16px}.story-points{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:28px;padding-top:25px;border-top:1px solid #d0c2b3}.story-points b{font-size:.79rem;display:block;color:var(--bata-tua)}.story-points span{font-size:.8rem;color:var(--muted);display:block;margin-top:5px}.text-link{display:inline-block;margin-top:24px;padding-bottom:5px;color:var(--bata-tua);font-size:.83rem;font-weight:600;border-bottom:1px solid var(--bata)}
.proses{gap:70px;align-items:start;grid-template-columns:1.15fr .85fr}.langkah{gap:0;margin-top:25px}.langkah li{grid-template-columns:40px 1fr;gap:20px;padding:17px 0;border-top:1px solid var(--line)}.langkah .angka{width:36px;height:36px;border-radius:0;background:none;color:var(--bata);font-family:var(--font-head);font-weight:400;font-size:1.55rem}.langkah b{font-size:.89rem;font-weight:600;color:var(--ink)}.langkah span{font-size:.85rem}.media-utama{width:100%;max-width:390px;justify-self:end;border-radius:8px;box-shadow:none;background:var(--bata-pekat);border:0}.media-utama video{max-height:545px;object-fit:contain}.media-utama figcaption{font-size:.75rem;font-weight:400;line-height:1.7;padding:17px 20px}.pengiriman{background:#342a23}.pengiriman::before{display:none}.media-grid{gap:20px}.media{border-radius:6px;border-color:#695248;background:#211a16;box-shadow:none}.media video{aspect-ratio:464/700;object-fit:cover;width:100%;height:auto}.media figcaption{padding:15px;font-size:.73rem;font-weight:400;background:#403128}.kirim-info{gap:10px;margin-top:28px}.kirim-info span{font-size:.73rem;border-radius:4px;padding:9px 14px;border-color:#806455;background:transparent}
.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.guide-card{padding:28px;border:1px solid var(--line);border-radius:7px;background:var(--white)}.guide-card .index{font-family:var(--font-head);font-size:2rem;color:var(--bata);display:block;margin-bottom:18px}.guide-card h3{font-size:1.6rem;margin-bottom:15px}.guide-card p{font-size:.87rem;color:var(--muted)}.guide-card ul{padding-left:18px;color:var(--muted);font-size:.82rem;margin:16px 0 0}.guide-card li+li{margin-top:8px}.order-strip{margin-top:30px;padding:28px 32px;border-left:3px solid var(--bata);background:var(--sand);display:flex;align-items:center;gap:35px;justify-content:space-between}.order-strip h3{font-size:1.6rem;margin-bottom:8px}.order-strip p{font-size:.87rem;color:var(--muted);max-width:76ch}.order-strip .btn{flex-shrink:0}
.faq-section{background:var(--sand)}.faq-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px}.faq-intro p{color:var(--muted);font-size:.92rem;margin-top:22px}.faq-intro h2{margin-top:16px}.faq-list details{border-bottom:1px solid #cfc2b4;padding:0}.faq-list details:first-child{border-top:1px solid #cfc2b4}.faq-list summary{list-style:none;cursor:pointer;font-size:.93rem;font-weight:500;padding:21px 38px 21px 0;position:relative;color:var(--ink)}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary::after{content:'+';position:absolute;right:4px;top:17px;font-size:1.3rem;font-weight:400;color:var(--bata)}.faq-list details[open] summary::after{content:'−'}.faq-list details p{font-size:.85rem;line-height:1.85;color:var(--muted);padding:0 26px 23px 0}.faq-list summary:focus-visible{outline-offset:1px}
.kontak{gap:35px;grid-template-columns:1fr 1fr;align-items:start}.panel{border-radius:7px;padding:32px;box-shadow:none;background:var(--white)}.info-list{gap:22px}.info-list .ico{width:38px;height:38px;border-radius:5px;background:var(--bata-lembut)}.info-list b{font-size:.85rem;font-weight:600}.info-list span,.info-list a{font-size:.83rem}.kontak-aksi{gap:10px}.map{margin:0;border-radius:7px;aspect-ratio:4/3;box-shadow:none}.map iframe{filter:saturate(.65)}
footer.site{background:#30261f;margin-top:0;padding:60px 0 24px}footer.site::before{display:none}.foot{padding-top:0;gap:50px}.foot .logo{font-size:.94rem}.foot .logo small{font-size:.48rem}.foot p{font-size:.85rem}footer.site h4{font-family:var(--font-body);font-weight:500;font-size:.67rem;letter-spacing:.15em;color:#edb39b;margin-top:0}footer.site li,footer.site a{font-size:.8rem}.foot__bottom{font-size:.69rem;margin-top:45px;padding-top:22px;color:#ccbdb1}.floatwa{background:var(--bata-pekat);border-radius:6px;padding:12px 18px;font-size:.8rem;box-shadow:0 5px 22px #21170f26;bottom:18px;right:20px;font-weight:500}.floatwa .dot{width:7px;height:7px;box-shadow:none;background:#84c391}.skip-link{position:fixed;left:12px;top:-100px;z-index:200;background:var(--bata-pekat);color:#fff;padding:12px 20px;border-radius:4px}.skip-link:focus{top:12px}html.js [data-reveal]{opacity:1;transform:none;transition:none}
@media(min-width:901px){.grid-produk{grid-template-columns:repeat(3,1fr)}.kotak-info{grid-template-columns:repeat(3,1fr)}}
@media(max-width:1100px){.hero__grid{gap:34px}.hero h1{font-size:3.5rem}.hero-visual>img{height:500px}.nav__links a{padding:10px 8px}.nav__links .nav__cta{margin-left:4px}.hero__facts li{padding-inline:12px}.story-grid{gap:40px}.faq-grid{gap:45px}.proses{gap:40px}.kontak-aksi{grid-template-columns:1fr}.media-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:900px){.wrap{padding-inline:24px}.nav__inner{min-height:76px;flex-wrap:nowrap}.burger{display:block;flex-shrink:0}.nav__links{display:none;position:absolute;top:100%;left:0;right:0;margin:0;padding:18px 24px;background:var(--paper);border-bottom:1px solid var(--line);border-radius:0;box-shadow:0 20px 25px #30282015;align-items:stretch}.nav__links.is-open{display:flex;flex-direction:column}.nav__links a{padding:12px}.nav__links .nav__cta{margin:8px 0 0;justify-content:center}.hero__grid{grid-template-columns:1fr 1fr;padding:48px 24px;gap:30px}.hero h1{font-size:3rem}.hero__tag{font-size:.57rem}.hero__lead{font-size:.91rem}.hero__btns{flex-direction:column;align-items:stretch}.hero__facts{gap:10px 16px}.hero__facts li{padding:0}.hero__facts li+li{border:0}.hero__facts strong{font-size:.95rem}.hero-visual>img{height:505px}.hero-tile{width:130px;right:-7px}.hero-tile img{height:100px}.hero-visual figcaption{left:20px;bottom:55px}.hero-visual figcaption>span:last-child{display:none}.material-label{font-size:.55rem;padding:6px 10px;right:12px}.section{padding:72px 0}.section-head>.lead{max-width:100%}.grid-produk{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.card__body{padding:19px}.card h3{font-size:1.42rem}.harga-aksi{grid-template-columns:1fr}.card__desc{font-size:.81rem}.kotak-grosir{gap:24px}.kotak-info{grid-template-columns:repeat(3,1fr);gap:22px}.story-grid{grid-template-columns:.9fr 1.1fr;gap:30px}.story-photo img{height:510px}.story-points{grid-template-columns:1fr;gap:15px}.proses{grid-template-columns:1.1fr .9fr;gap:30px}.media-grid{grid-template-columns:repeat(2,1fr)}.media video{aspect-ratio:464/620}.guide-grid{gap:16px}.guide-card{padding:23px}.guide-card h3{font-size:1.4rem}.order-strip{align-items:start;flex-direction:column;gap:22px}.faq-grid{gap:35px;grid-template-columns:.8fr 1.2fr}.kontak{gap:24px}.panel{padding:24px}.foot{grid-template-columns:1.2fr 1fr;gap:32px}.foot>div:first-child{grid-column:1/-1}.foot p{max-width:65ch!important}}
@media(max-width:680px){.wrap{padding-inline:22px}.topbar__row{padding:7px 22px;justify-content:center;font-size:.63rem}.topbar__row span:not(:first-child){display:none}.logo{font-size:.89rem;gap:9px}.logo small{font-size:.45rem;letter-spacing:.08em;margin-top:5px}.logo__mark{width:37px;height:37px}.nav__inner{min-height:72px;gap:10px}.burger{width:42px;height:42px}.hero__grid{grid-template-columns:1fr;padding:40px 22px 39px;gap:34px}.hero h1{font-size:clamp(2.85rem,10vw,4rem);max-width:540px;margin:19px 0}.hero__tag{font-size:.57rem;letter-spacing:.08em}.hero__lead{font-size:.92rem;max-width:54ch}.hero__btns{flex-direction:row;gap:9px;margin:23px 0}.hero__btns .btn{padding:12px 15px;font-size:.75rem;flex:1}.hero__facts{margin-top:22px;padding-top:19px;justify-content:space-between;gap:10px}.hero__facts li{font-size:.62rem;padding:0 8px 0 0}.hero__facts li+li{border-left:1px solid var(--line);padding-left:12px}.hero__facts strong{font-size:1rem}.hero__art{max-width:530px;width:100%;margin:auto;padding-bottom:16px}.hero-visual{border-top-left-radius:80px}.hero-visual>img{height:390px;object-position:50% 55%}.hero-visual figcaption{bottom:24px}.hero-tile{bottom:-2px;right:6px;width:130px}.hero-tile img{height:95px}.hero-tile span{font-size:.5rem}.material-label{right:16px;top:17px}.band__row{grid-template-columns:1fr 1fr;padding:10px 22px}.band__row span{font-size:.7rem;padding:12px 8px}.band__row span:nth-child(2){border-right:0}.band__row span:nth-child(-n+2){border-bottom:1px solid #ffffff33}.band__row small{font-size:.61rem}.section{padding:59px 0}.section-head{gap:18px;margin-bottom:28px}.h2{font-size:2.25rem}.lead{font-size:.91rem;line-height:1.85}.section-head>.lead{max-width:100%}.grid-produk{grid-template-columns:1fr;gap:25px}.card__art{aspect-ratio:4/3}.card__body{padding:25px}.card h3{font-size:1.8rem}.card__desc{font-size:.88rem}.harga-aksi{grid-template-columns:1.5fr 1fr}.kotak-grosir{grid-template-columns:1fr;padding:27px;gap:20px}.kotak-grosir h3{font-size:1.8rem}.kotak-grosir p{font-size:.86rem}.kotak-info{grid-template-columns:1fr;gap:0}.kotak-info div{padding:20px 0}.story-grid,.proses,.faq-grid,.kontak{grid-template-columns:1fr;gap:32px}.story-photo img{height:360px}.story-photo figcaption{font-size:.65rem}.story-copy p{font-size:.9rem}.story-points{grid-template-columns:1fr 1fr;gap:20px}.story-copy h2{margin-top:15px}.media-utama{max-width:100%;justify-self:stretch}.media-utama video{height:430px;width:100%;object-fit:contain}.media-grid{gap:12px}.media video{aspect-ratio:464/720}.media figcaption{font-size:.65rem;padding:12px}.kirim-info{display:grid;grid-template-columns:1fr;gap:8px}.kirim-info span{font-size:.72rem}.guide-grid{grid-template-columns:1fr;gap:16px}.guide-card{padding:27px}.guide-card h3{font-size:1.65rem}.guide-card .index{margin-bottom:12px}.order-strip{padding:25px}.faq-list summary{font-size:.86rem}.faq-grid{gap:28px}.kontak-aksi{grid-template-columns:1fr}.panel{padding:25px}.map{aspect-ratio:1.2}.foot{grid-template-columns:1fr;gap:30px}.foot>div:first-child{grid-column:auto}.foot__bottom{padding-bottom:60px;gap:10px}.floatwa{right:12px;bottom:12px;padding:11px 15px;font-size:.75rem}footer.site{padding-top:45px}.foot .logo small{font-size:.46rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}