:root{--bg:#FBFDF8;--veil:rgba(251,253,248,.28);--panel:rgba(251,253,248,.88);--hveil:rgba(251,253,248,.72);--ink:#12301F;--muted:#4B6455;--green:#1B5E34;--gold:#B8921F;--sky:#CFE6F7;--hill:#5FA55A;--card:#FFFFFF;--on-green:#FFFFFF;
box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0D1F15;--veil:rgba(13,31,21,.42);--panel:rgba(13,31,21,.88);--hveil:rgba(13,31,21,.78);--ink:#EEF5EA;--muted:#A5BBAA;--green:#4FAE6C;--gold:#E0B93F;--sky:#16344A;--hill:#2F6B3A;--card:#14291C;--on-green:#0D1F15}}
:root[data-theme="dark"]{--bg:#0D1F15;--veil:rgba(13,31,21,.42);--panel:rgba(13,31,21,.88);--hveil:rgba(13,31,21,.78);--ink:#EEF5EA;--muted:#A5BBAA;--green:#4FAE6C;--gold:#E0B93F;--sky:#16344A;--hill:#2F6B3A;--card:#14291C;--on-green:#0D1F15}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Figtree,system-ui,sans-serif;font-size:1.0625rem;line-height:1.6}
h1,h2,h3{font-family:'Bricolage Grotesque',system-ui,sans-serif;line-height:1.05;margin:0}
a{color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.wrap{max-width:1040px;margin:0 auto;padding:0 1.25rem}
.top{background:var(--sky);position:relative;overflow:hidden}
.top::after{content:"";position:absolute;left:-10%;right:-10%;bottom:-70px;height:130px;background:var(--hill);border-radius:50% 50% 0 0}
header{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 0}
.logo{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:1.4rem;letter-spacing:.02em;text-decoration:none;color:var(--gold)}
nav a{margin-left:1.25rem;text-decoration:none;font-weight:600}
.hero{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center;padding:2rem 0 6rem;position:relative;z-index:1}
.hero h1{font-size:clamp(2.4rem,6.5vw,4.6rem);font-weight:800;color:var(--ink)}
.hero p{max-width:36ch;font-size:1.2rem;margin:1.25rem 0 2rem}
.btn{display:inline-block;background:var(--green);color:var(--on-green);padding:.9rem 1.6rem;border-radius:999px;font-weight:600;text-decoration:none}
.btn:hover{filter:brightness(1.1)}
.pick{justify-self:center;width:100%;max-width:440px}
.seg{display:flex;gap:.5rem;justify-content:center;margin-top:.9rem}.seg button{font:inherit;font-weight:600;padding:.5rem 1.1rem;border-radius:999px;border:2px solid var(--green);background:transparent;color:var(--green);cursor:pointer}.seg button[aria-pressed="true"]{background:var(--green);color:var(--on-green)}
.bottle{width:100%;max-width:100%;height:auto;justify-self:center;display:block;border-radius:20px}
.fill{animation:fill 2.2s cubic-bezier(.3,.7,.2,1) .3s both}
@keyframes fill{from{transform:translateY(100%)}to{transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){.fill{animation:none}}
.why{padding:4.5rem 0 3rem}
.why h2,.order h2{font-size:clamp(1.8rem,4vw,2.6rem);margin-bottom:2rem}
.points{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem 3rem}
.points h3{font-size:1.4rem;margin-bottom:.4rem;color:var(--green)}
.points p{margin:0;color:var(--muted)}
.order{background:var(--green);color:var(--on-green);padding:3.5rem 0}
.order h2{margin-bottom:1rem}
.info{padding:1rem 0 4rem}.info h2{font-size:clamp(1.8rem,4vw,2.6rem);margin-bottom:1.5rem}.info h3{font-size:1.3rem;margin-bottom:.75rem;color:var(--green)}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:2rem 3rem}
.info table{width:100%;border-collapse:collapse}.info td{padding:.45rem 0;border-bottom:1px solid var(--sky)}.info td+td{text-align:right;font-weight:600}
.note{color:var(--muted);font-size:.9rem;margin:.75rem 0 0}.warn{border-left:4px solid var(--gold);padding-left:.9rem;font-weight:600}
@media (max-width:720px){.cols{grid-template-columns:1fr}}
.order p{max-width:46ch;margin:0 0 1.5rem}
.order .btn{background:var(--gold);color:#12301F}
footer{padding:2rem 0 3rem;color:var(--muted);font-size:.95rem}
@media (max-width:720px){.hero{grid-template-columns:1fr;padding-bottom:5rem}.pick{max-width:340px;order:-1}.points{grid-template-columns:1fr;gap:1.5rem}nav a{margin-left:.9rem}}
.bar{background:var(--green);color:var(--on-green);text-align:center;font-size:.9rem;padding:.5rem 1rem;font-weight:600}
.produk{padding:1rem 0 3rem}.produk h2,.ide h2,.cerita h2{font-size:clamp(1.8rem,4vw,2.6rem);margin-bottom:1rem}.lead{color:var(--muted);margin:0 0 1.5rem;max-width:50ch}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.cards article{background:var(--card);border:2px solid var(--sky);border-radius:18px;padding:1.5rem}.cards h3{font-size:1.5rem;margin-bottom:.5rem;color:var(--green)}.cards p{margin:0 0 .75rem}.price{color:var(--muted);font-size:.95rem}
.cerita{background:var(--sky);padding:4rem 0;margin:1rem 0 3rem}blockquote{margin:0 0 2rem;max-width:44ch;font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(1.3rem,3vw,1.9rem);line-height:1.25;border-left:4px solid var(--gold);padding-left:1.1rem}.cerita h3{font-size:1.3rem;margin-bottom:.5rem;color:var(--green)}.cerita p{margin:0}
.ide{padding:0 0 4rem}.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}.cards3 h3{font-size:1.25rem;color:var(--green);margin-bottom:.3rem}.cards3 p{margin:0;color:var(--muted)}
.resep{padding:0 0 4rem}.resep h2{font-size:clamp(1.8rem,4vw,2.6rem);margin-bottom:1rem}.resep details{border-bottom:1px solid var(--sky)}.resep summary{cursor:pointer;padding:1rem 0;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:1.3rem;color:var(--green);display:flex;flex-wrap:wrap;justify-content:space-between;gap:.25rem 1rem}.resep summary span{font-family:Figtree,system-ui,sans-serif;font-weight:400;font-size:.95rem;color:var(--muted)}.rb{padding:0 0 1.25rem;max-width:60ch}.rb h3{font-size:1.1rem;margin:.75rem 0 .4rem}.rb ul,.rb ol{margin:0;padding-left:1.25rem}.rb li{margin:.3rem 0}.resep .note{margin-top:1rem}
.foot{padding:2.5rem 0 3rem;color:var(--muted)}.fgrid{display:grid;grid-template-columns:1.2fr 1fr 1.4fr;gap:2rem}.fgrid strong{color:var(--ink)}.flogo{font-family:'Bricolage Grotesque',sans-serif;font-size:1.3rem;color:var(--gold)!important}.fgrid p{margin:.4rem 0 0}.foot a{text-decoration:none}.foot a:hover{text-decoration:underline}.copy{margin-top:2rem!important;font-size:.9rem}
@media (max-width:720px){header{flex-direction:column;gap:.4rem}nav a{margin:0 .5rem}.cards,.cards3,.fgrid{grid-template-columns:1fr}}
.mitra{background:#fff;border-radius:14px;padding:.75rem 1rem;display:inline-block;margin:.25rem 0 1rem}.mitra img{display:block;height:auto;width:100%;max-width:340px}
.merch{padding:0 0 4rem}.merch h2{font-size:clamp(1.8rem,4vw,2.6rem);margin-bottom:1.5rem}.mgrid{display:grid;grid-template-columns:1fr 1fr;gap:2rem 3rem;align-items:center}.mgrid img{width:100%;height:auto;border-radius:20px;display:block}.mgrid h3{font-size:1.5rem;color:var(--green);margin-bottom:.5rem}.dim{width:100%;border-collapse:collapse;margin:1rem 0}.dim td{padding:.45rem 0;border-bottom:1px solid var(--sky)}.dim td+td{text-align:right;font-weight:600}@media (max-width:720px){.mgrid{grid-template-columns:1fr}}
body::before{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(var(--veil),var(--veil)),var(--poster) 12% 56px/cover no-repeat}
.mgrid img.tall{width:auto;max-width:100%;max-height:520px;justify-self:center;background:#fff}
.fr{display:flex;gap:.75rem;align-items:flex-end;background:#fff;border-radius:20px;padding:1rem;color:#12301F}.fr figure{margin:0;text-align:center;font-size:.85rem}.fr .f1{flex:0 0 34%}.fr .f2{flex:1}.mgrid .fr img{width:100%;max-height:none;border-radius:0;background:none}
.founder{max-width:62ch;margin-bottom:2.5rem}.founder p{margin:0 0 1rem}.big{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(1.3rem,3vw,1.9rem);line-height:1.25}.steps{counter-reset:s;list-style:none;padding:0;margin:1rem 0 1.5rem}.steps li{counter-increment:s;display:flex;gap:.9rem;align-items:baseline;padding:.5rem 0;border-bottom:1px solid var(--card)}.steps li::before{content:counter(s);font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:var(--gold);min-width:1.5rem}.founder .tag{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:1.25rem;color:var(--green);border-left:4px solid var(--gold);padding-left:1rem;margin:0}
.chk{margin:.75rem 0 1rem;padding-left:1.25rem}.chk li{margin:.35rem 0}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.duo figure{margin:0}.duo img{width:100%;height:auto;border-radius:20px;display:block}.duo figcaption{margin-top:.5rem;color:var(--muted);font-size:.95rem}@media (max-width:520px){.duo{grid-template-columns:1fr}}
.wide{margin:1.5rem 0 0}.wide img{width:100%;height:auto;border-radius:20px;display:block}.wide figcaption{margin-top:.5rem;color:var(--muted);font-size:.95rem}
.duo2{margin-top:1.5rem;align-items:start}.vgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;align-items:start}.vgrid figure{margin:0}.vgrid video{width:100%;height:auto;max-height:70vh;border-radius:20px;background:#000;display:block}.vgrid figcaption{margin-top:.5rem;color:var(--muted);font-size:.95rem}.vwide{grid-column:1/-1}@media (max-width:520px){.vgrid{grid-template-columns:1fr}}
.calc{margin:0 0 2rem}.calc h3{font-size:1.2rem;color:var(--green)}.bars{list-style:none;padding:0;margin:1rem 0}.bars li{display:grid;grid-template-columns:8.5rem 1fr 3rem;gap:.75rem;align-items:center;padding:.4rem 0}.bars .n{font-weight:600}.bars small{display:block;color:var(--muted);font-size:.8rem;font-weight:400}.bars .b{display:block;background:var(--sky);border-radius:999px;height:14px;overflow:hidden}.bars i{display:block;height:100%;background:var(--muted);border-radius:999px}.bars .top i{background:var(--green)}.bars .v{font-weight:800;text-align:right}@media (max-width:520px){.bars li{grid-template-columns:6.5rem 1fr 2.75rem}}
.rb.wide-rb{max-width:none}.gt{overflow-x:auto}.gt table{width:100%;border-collapse:collapse;min-width:30rem}.gt th,.gt td{padding:.5rem .6rem;border-bottom:1px solid var(--sky);text-align:right}.gt th[scope="row"],.gt thead th:first-child{text-align:left}.gt thead th{color:var(--green);font-weight:600}.gt th[scope="row"]{font-weight:400}.gt td{font-weight:600}
.bars.mg li{grid-template-columns:9rem 1fr 4.5rem}@media (max-width:520px){.bars.mg li{grid-template-columns:7rem 1fr 4rem}}
.label{margin:2rem 0 0}.label img{width:100%;height:auto;border-radius:20px;display:block}.label figcaption{margin-top:.5rem;color:var(--muted);font-size:.95rem}

:root{--art-corn:url(media/7a0d90bba4abaa74.jpg);--art-hill:url(media/6a56c70b9df51ff8.jpg);--art-leaf:url(media/ebb55f69ef5a6ed7.jpg);--art-wheat:url(media/71d333654f98a709.jpg)}
:root{--wm:url(media/2db46f11639bac92.png)}
:root{--poster:url(media/f3ddd08917a78090.jpg)}
:root{--art-calf:url(media/e59502fb6d338e8e.jpg)}