/* Public landing only: two font families, compact catalogue and optional community image. */
/* Feather the actual image bounds, not the letterboxed container; keep subjects crisp. */
body .final-card .final-cta-image{width:min(100%,400px);height:auto;max-height:none;aspect-ratio:2/3;object-fit:contain;filter:none;border-radius:0;--edge-x:12%;--edge-y:9%}
body .community-picture img{width:auto;max-width:100%;height:auto;max-height:100%;left:50%;top:50%;transform:translate(-50%,-50%);background:transparent;--edge-x:15%;--edge-y:8%}
body .community-picture:after{display:none}
body #masalah .media-wrap{background:transparent}
body #masalah .media-wrap img{--edge-x:7%;--edge-y:6%}
body #produk .product-image img{--edge-x:4%;--edge-y:5%;filter:none}
body .final-card .final-cta-image,body .community-picture img,body #masalah .media-wrap img,body #produk .product-image img{-webkit-mask-image:linear-gradient(90deg,transparent,#000 var(--edge-x),#000 calc(100% - var(--edge-x)),transparent),linear-gradient(transparent,#000 var(--edge-y),#000 calc(100% - var(--edge-y)),transparent);mask-image:linear-gradient(90deg,transparent,#000 var(--edge-x),#000 calc(100% - var(--edge-x)),transparent),linear-gradient(transparent,#000 var(--edge-y),#000 calc(100% - var(--edge-y)),transparent);-webkit-mask-composite:source-in;mask-composite:intersect}
@media(max-width:680px){body .final-card .final-cta-image{width:min(100%,260px)}body .community-picture img{--edge-x:13%;--edge-y:8%}}
.brand-preloader[hidden]{display:none}.brand-preloader{position:fixed;inset:0;z-index:11000;background:#fff8fc;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:18px;pointer-events:none;animation:loader-safety 1.4s forwards}.brand-preloader img{width:220px;height:auto}.preloader-heart{font:64px/1 'Nunito',sans-serif;color:#ae77cf;animation:welcome-heart .6s ease-in-out 2}@keyframes welcome-heart{50%{transform:scale(1.16);color:#de8eb7}}@keyframes loader-safety{99%{visibility:visible}100%{visibility:hidden}}
.client-quote-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.client-quote{margin:0;padding:24px;border:1px solid #eadcf0;border-radius:24px;background:linear-gradient(135deg,#fff,#fff7fb)}.quote-mark{font:58px/.8 'Patrick Hand',cursive;color:#a375c5}.client-quote blockquote{margin:10px 0 18px;font-size:16px;line-height:1.75}.client-quote figcaption{display:flex;gap:8px;align-items:center;font-weight:800;color:#784bb2}.client-gallery-title{font:400 32px/1.2 'Patrick Hand',sans-serif;margin:36px 0 20px}.client-event-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.client-event{margin:0;background:#fff;border:1px solid #eadcf0;border-radius:20px;overflow:hidden}.client-event img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}.client-event figcaption{padding:14px 16px;font-weight:700;font-size:15px}
@media(max-width:680px){.client-quote-grid,.client-event-grid{grid-template-columns:1fr}.client-quote{padding:20px}}
@media(prefers-reduced-motion:no-preference){.hero .floating-card strong{position:relative}.hero .floating-card strong:after{content:'';display:block;height:4px;width:65%;border-radius:100%;background:#efb2d1;transform-origin:left;animation:caption-underline 1.2s ease-out 1}.hero-doodles path{transform-box:fill-box;transform-origin:center;animation:doodle-breathe 3.2s ease-in-out 3}.hero-doodles path:nth-child(2n){animation-delay:.4s}.hero .floating-card>.icon{animation:doodle-breathe 2.4s ease-in-out 3}@keyframes doodle-breathe{50%{transform:scale(1.12) rotate(5deg)}}@keyframes caption-underline{from{transform:scaleX(0)}to{transform:scaleX(1)}}}
@media(prefers-reduced-motion:reduce){.brand-preloader{display:none}.hero-doodles path,.hero .floating-card>.icon,.hero .floating-card strong:after{animation:none!important}}
body{--font-body:'Nunito',sans-serif;--font-display:'Nunito',sans-serif;--font-heading:'Patrick Hand','Nunito',sans-serif;font-family:var(--font-body);font-size:16px;line-height:1.65;color:#49364f}
.hero .title,.section .title,.final-card .title,.learning-formats .mini-card h3,.milkijoy-community h2,.hero .floating-card strong{font-family:var(--font-heading);font-weight:400;letter-spacing:0;line-height:1.15}
.hero .title{font-size:clamp(44px,5vw,68px)}
.section .title{font-size:clamp(34px,3.5vw,46px)}
.learning-formats .mini-card h3{font-size:28px;color:#624180}
.learning-formats .mini-card p{display:block;font-size:16px;line-height:1.65;margin-bottom:0}
.learning-doodle{display:block;margin:0 auto 12px;width:84px;height:84px}
.hero .floating-card strong{font-size:27px}
.hero .floating-card{width:min(310px,75%)}
.hero .subtitle,.section .subtitle{font-size:17px;line-height:1.7}
.eyebrow,.btn,.badge,.price{font-family:var(--font-body)}
.section{padding-block:40px}
.hero .title{font-weight:700;color:#493051}
#produk .products{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;align-items:stretch}
#produk .products>.product-card{display:flex;flex-direction:column;flex:0 1 calc((100% - 48px)/3);grid-row:auto;min-height:0;padding:20px;gap:0;transform:none}
#produk .product-card>h3{font-family:var(--font-body);font-size:23px;line-height:1.3;font-weight:800;margin:14px 0 8px;min-height:0}
#produk .product-card>p{font-size:16px;line-height:1.6;min-height:0;margin:0;max-width:none}
#produk .products>.product-card>.price-row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 10px;min-height:0;padding:12px 14px;margin:18px 0;border-radius:16px;grid-template-rows:none}
#produk .product-card .price-row>.price{font-size:34px;line-height:1.15;flex:1 0 100%;order:-1}
#produk .product-card .price-row>.old-price,#produk .product-card .price-row>.save{font-size:13px}
#produk .product-card>.features{margin:0 0 18px;padding:0;gap:10px;display:grid;grid-template-columns:1fr}
#produk .product-card .features li{font-size:15px;line-height:1.5}
#produk .product-card>.product-contents-trigger{margin-top:auto;margin-bottom:12px;flex-shrink:0}
#produk .product-card>.buy-btn{margin:0;min-height:48px;white-space:normal;text-align:center;font-size:15px;flex-shrink:0}
#produk .product-card>noscript{display:none}
#produk .products>.product-card[data-featured=true]{flex-basis:100%;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-template-areas:'image badge' 'image title' 'image copy' 'image price' 'image features' 'image contents' 'image buy';column-gap:30px;row-gap:0;padding:28px;border-color:#d3b15c;background:linear-gradient(120deg,#fff9ed,#fff 48%,#fff7fc)}
#produk [data-featured=true]>.product-image{grid-area:image;height:auto;max-height:none;aspect-ratio:3/2;margin:0;align-self:center}
#produk .products>.product-card[data-featured=true]{grid-template-rows:repeat(7,auto)}
#produk [data-featured=true]>.product-image img{object-fit:contain}
#produk [data-featured=true]>.badge{grid-area:badge;align-self:start}
#produk [data-featured=true]>h3{grid-area:title;font-size:30px}
#produk [data-featured=true]>p{grid-area:copy}
#produk [data-featured=true]>.price-row{grid-area:price}
#produk [data-featured=true]>.features{grid-area:features;grid-template-columns:repeat(2,minmax(0,1fr))}
#produk [data-featured=true]>.product-contents-trigger{grid-area:contents}
#produk [data-featured=true]>.buy-btn{grid-area:buy}
.community-with-visual{display:grid;grid-template-columns:minmax(220px,.7fr) minmax(0,1.3fr);grid-template-areas:'visual eyebrow' 'visual title' 'visual options' 'visual privacy';column-gap:28px;overflow:hidden}
.community-with-visual>.community-picture{grid-area:visual;display:block;align-self:stretch;min-height:360px;margin:-32px 0 -32px -32px;position:relative;overflow:hidden}
.community-picture img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;position:absolute;background:#fbf4f4}
.community-picture:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 70%,#fcf5fc)}
.community-with-visual>.eyebrow{grid-area:eyebrow;justify-self:start;align-self:start}
.community-with-visual>h2{grid-area:title;font-size:36px}
body .community-with-visual>h2{font-size:36px;font-weight:400}
.community-with-visual>.community-options{grid-area:options;grid-template-columns:1fr}
.community-with-visual>.community-privacy{grid-area:privacy}
@media(min-width:681px) and (max-width:1080px){#produk .products>.product-card{flex-basis:calc((100% - 24px)/2)}#produk .products>.product-card[data-featured=true]{flex-basis:100%;column-gap:22px;padding:22px}#produk [data-featured=true]>h3{font-size:26px}.community-with-visual{grid-template-columns:minmax(200px,.6fr) minmax(0,1fr);column-gap:20px}}
@media(max-width:680px){
 .hero .title{font-size:clamp(40px,11vw,46px)}.section .title{font-size:34px}.hero .subtitle,.section .subtitle{font-size:16px}.hero .floating-card strong{font-size:24px}.hero .floating-card{width:235px}.section{padding-block:30px}
 #produk .products>.product-card,#produk .products>.product-card[data-featured=true]{flex-basis:100%;display:flex;padding:18px;grid-template-areas:none;min-width:0}
 #produk .product-card>.product-image,#produk [data-featured=true]>.product-image{width:100%;height:auto;max-height:none;aspect-ratio:3/2;margin:12px 0 0;grid-row:auto}
 #produk .product-card>h3,#produk [data-featured=true]>h3{font-size:24px;margin-top:14px}
 #produk [data-featured=true]>.features{grid-template-columns:1fr}
 #produk .product-card>.product-contents-trigger{margin-top:0}
 .community-with-visual{display:flex;flex-direction:column;padding:20px}
 .community-with-visual>.community-picture{min-height:0;height:230px;flex:none;margin:-20px -20px 20px;width:calc(100% + 40px);align-self:auto}
 .community-picture img{object-position:center}.community-picture:after{background:linear-gradient(transparent 85%,#fcf5fc)}
 .community-with-visual>h2{font-size:32px}.community-with-visual>.eyebrow{align-self:flex-start}
}
#produk .product-card>h3,#produk [data-featured=true]>h3{font-family:var(--font-heading);font-weight:700}
.footer-action-row{display:flex;flex-wrap:nowrap;justify-content:safe center;gap:10px;overflow-x:auto;padding:20px 2px 12px;scrollbar-width:thin;scrollbar-color:#baa0d5 transparent}
@media(min-width:681px){#produk .products>.product-slug-modul-flange-fitting:not([hidden]){flex-basis:100%;width:100%;max-width:none;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);grid-template-rows:repeat(7,auto);grid-template-areas:'image badge' 'image title' 'image copy' 'image price' 'image features' 'image contents' 'image buy';gap:0 30px;padding:28px}#produk .products>.product-slug-modul-flange-fitting>.product-image{grid-area:image;width:100%;height:auto;margin:0;align-self:center}#produk .products>.product-slug-modul-flange-fitting>.product-image img{width:100%;height:auto;object-fit:contain}#produk .products>.product-slug-modul-flange-fitting>.badge{grid-area:badge}#produk .products>.product-slug-modul-flange-fitting>h3{grid-area:title}#produk .products>.product-slug-modul-flange-fitting>p{grid-area:copy}#produk .products>.product-slug-modul-flange-fitting>.price-row{grid-area:price}#produk .products>.product-slug-modul-flange-fitting>.features{grid-area:features;grid-template-columns:1fr 1fr;gap:8px}#produk .products>.product-slug-modul-flange-fitting>.product-contents-trigger{grid-area:contents}#produk .products>.product-slug-modul-flange-fitting>.buy-btn{grid-area:buy}}
.footer-action-row a{flex:none;display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:10px 15px;border:1px solid #e7dcef;border-radius:30px;background:#fff;color:#694789;font:800 14px/1.3 'Nunito',sans-serif;white-space:nowrap;transition:background .18s,color .18s,box-shadow .18s,translate .18s}
.footer-action-row .icon{flex:none}.footer-action-row a:focus-visible{outline:3px solid #9868c5;outline-offset:2px}
.btn,.buy-btn,.product-contents-trigger,details>summary{transition:background-color .2s,box-shadow .2s,translate .2s}
@media(hover:hover){.footer-action-row a:hover{background:#784bb2;color:#fff;translate:0 -2px;box-shadow:0 6px 16px #784bb222}.btn:hover,.buy-btn:hover,.product-contents-trigger:hover{translate:0 -2px;box-shadow:0 8px 20px #784bb22b}details>summary:hover{background:#f4ebfb;color:#694789}}
.page-load-indicator{position:fixed;z-index:10000;inset:0 0 auto;height:3px;background:linear-gradient(90deg,#784bb2,#f5b5ce,#d8bcf2);pointer-events:none;transform-origin:left;animation:page-arrive .85s ease-out forwards}
@keyframes page-arrive{0%{transform:scaleX(.05);opacity:1}80%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
@media(prefers-reduced-motion:no-preference){.hero .hero-img{animation:mother-float 5s ease-in-out 2}.hero .floating-card{animation:caption-float 4.5s ease-in-out 2}@keyframes mother-float{0%,100%{translate:0 0}50%{translate:0 -7px}}@keyframes caption-float{0%,100%{translate:0 0}50%{translate:0 -9px}}}
@media(prefers-reduced-motion:reduce){.page-load-indicator{display:none}.hero .hero-img,.hero .floating-card{animation:none!important}.btn,.buy-btn,.product-contents-trigger,.footer-action-row a,details>summary{transition:none;translate:none!important}}
@media(prefers-reduced-motion:reduce){.hero-doodles,.learning-formats .mini-card,.community-with-visual{animation:none!important}}