.faq-copy{background:#f5f0e8;color:#211832;overflow:hidden}
body{font-family:Manrope,Arial,sans-serif}
h1,h2,h3{font-family:"Plus Jakarta Sans",Manrope,sans-serif}
.btn{position:relative;border-width:2px;border-color:#20105f;border-radius:18px 7px 18px 7px;box-shadow:5px 5px 0 #ffc857;transform:rotate(-.45deg);transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s cubic-bezier(.16,1,.3,1)}
.btn.primary{border-color:#20105f;background:#30207d;box-shadow:5px 5px 0 #ffc857}
.btn.light{border-color:#20105f;box-shadow:5px 5px 0 #f06aa8}
.btn.outline{border-color:currentColor;box-shadow:5px 5px 0 #f06aa8}
.btn:hover{transform:rotate(.15deg) translate(3px,3px);box-shadow:2px 2px 0 #ffc857}
.btn.light:hover,.btn.outline:hover{box-shadow:2px 2px 0 #f06aa8}
.btn:active{transform:translate(5px,5px);box-shadow:0 0 0 transparent}
.btn:disabled{cursor:wait;opacity:.68;transform:none;box-shadow:2px 2px 0 #ffc857}
.links .btn{min-height:44px;padding:9px 16px;box-shadow:3px 3px 0 #ffc857}
.form .btn,.calc .btn,.links .btn{transform:none}
.card a,.need a,.after-note a,footer nav a{display:inline-flex;min-height:44px;align-items:center}
.card.core .badge{color:#20105f}
.need span{color:#30207d}
.hero .pack{background-image:url('assets/campaign/hero-full-product-ecosystem-v6.png')!important;background-position:center 58%!important;background-size:cover!important}
.culture-strip{position:relative;z-index:6}
.culture-strip{white-space:nowrap;contain:paint}
.culture-combined .culture-strip{margin-top:clamp(48px,6vw,80px);border-radius:12px;overflow:hidden}
.culture-track{gap:0;animation:marquee 26s linear infinite;animation-iteration-count:infinite;will-change:transform}
.culture-sequence{display:flex;flex:none;align-items:center;gap:28px;padding-right:28px}
.culture-strip:hover .culture-track,.culture-strip.is-paused .culture-track,.culture-strip.is-page-hidden .culture-track{animation-play-state:paused}
@keyframes marquee{to{transform:translate3d(-50%,0,0)}}
.bandung-origin{position:relative;overflow:hidden;padding:clamp(88px,9vw,128px) 0;background:#f5f0e8;color:#211832}
.bandung-origin:before{content:"";position:absolute;width:440px;height:440px;left:-220px;bottom:-260px;border:2px solid #2864dc2e;border-radius:50%;background:#2864dc0c;pointer-events:none}
.bandung-geometry{position:absolute;inset:0;pointer-events:none}
.origin-orbit{position:absolute;width:180px;height:180px;right:4%;top:6%;border:2px solid #f06aa84d;border-radius:50%;animation:originFloat 8s ease-in-out infinite}
.origin-orbit:after{content:"";position:absolute;width:18px;height:18px;right:17px;top:22px;border-radius:50%;background:#f06aa8}
.origin-cross{position:absolute;left:3%;top:18%;color:#2864dc;font:800 3.5rem/1 "Plus Jakarta Sans";transform:rotate(12deg);animation:originFloat 7s ease-in-out -2s infinite}
.origin-dot{position:absolute;width:16px;height:16px;left:44%;bottom:9%;border-radius:50%;background:#ffc857;box-shadow:0 0 0 12px #ffc8572e}
@keyframes originFloat{50%{transform:translate3d(0,16px,0) rotate(8deg)}}
.bandung-grid{position:relative;display:grid;grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr);gap:clamp(42px,6vw,82px);align-items:center}
.bandung-copy h2{max-width:12ch;margin:0 0 26px;font-size:clamp(3rem,5.3vw,5.5rem);line-height:.94;letter-spacing:-.04em}
.bandung-copy>p{max-width:62ch;margin:0;color:#5c5365;line-height:1.75}
.bandung-notes{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:30px 0 34px}
.bandung-notes span{padding-top:14px;border-top:2px solid #30207d;color:#30207d;font-size:.84rem;font-weight:800;line-height:1.45}
.bandung-map{--map-x:0px;--map-y:0px;--map-scroll:0px;position:relative;isolation:isolate;min-height:clamp(620px,60vw,700px);margin:0;overflow:hidden;border:2px solid #20105f;border-radius:48px 12px 48px 12px;background:#dce7ff;box-shadow:14px 18px 0 #20105f,0 34px 80px #20105f26}
.map-grid{position:absolute;inset:-24px;z-index:-1;transform:translate3d(calc(0px - var(--map-x)),calc(0px - var(--map-y)),0)}
.west-java-map{position:absolute;z-index:1;width:88%;height:auto;left:8%;top:50%;filter:grayscale(1) contrast(.86) sepia(.15);mix-blend-mode:multiply;transform:translate3d(var(--map-x),calc(-50% + var(--map-y) + var(--map-scroll)),0) rotate(-2deg);transition:transform .18s cubic-bezier(.16,1,.3,1)}
.map-geo{position:absolute;z-index:2;pointer-events:none;transition:transform .22s cubic-bezier(.16,1,.3,1)}
.map-geo-ring{width:190px;height:190px;right:-58px;top:-56px;border:16px solid #f06aa8;border-radius:50%;transform:translate3d(calc(0px - var(--map-x)),calc(0px - var(--map-y) - var(--map-scroll)),0)}
.map-geo-diamond{width:76px;height:76px;left:7%;bottom:24%;border:3px solid #30207d;background:#ffc857;transform:translate3d(calc(0px - var(--map-x)),calc(0px - var(--map-y) - var(--map-scroll)),0) rotate(18deg);animation:mapDiamond 6s ease-in-out infinite}
.map-geo-star{right:9%;bottom:27%;color:#30207d;font:800 clamp(2.5rem,6vw,5.5rem)/1 "Plus Jakarta Sans";transform:translate3d(var(--map-x),calc(var(--map-y) + var(--map-scroll)),0) rotate(-9deg);animation:mapStar 5s ease-in-out -1s infinite}
@keyframes mapDiamond{50%{rotate:8deg;scale:1.08}}
@keyframes mapStar{50%{rotate:14deg;scale:.9}}
.map-label{position:absolute;z-index:3;display:grid;gap:2px;padding:10px 13px;border:2px solid #20105f;background:#f9f4ed;color:#20105f;box-shadow:5px 5px 0 #20105f;transform:translate3d(var(--map-x),var(--map-y),0)}
.map-label small{font:800 .65rem/1.1 Manrope,sans-serif;letter-spacing:.14em}
.map-label strong{font:800 .86rem/1.1 "Plus Jakarta Sans",Manrope,sans-serif}
.map-label-jabar{left:6%;top:7%;background:#20105f;color:#fff;box-shadow:5px 5px 0 #ffc857}
.map-label-bandung{right:7%;top:43%;padding-left:32px}
.map-label-bandung:before{content:"";position:absolute;width:88px;right:100%;top:56%;border-top:2px solid #20105f;transform:rotate(13deg);transform-origin:right center}
.map-label-bandung>span{position:absolute;width:12px;height:12px;left:12px;top:50%;border-radius:50%;background:#f06aa8;box-shadow:0 0 0 7px #f06aa83d;translate:0 -50%;animation:mapPulse 2.8s ease-out infinite}
@keyframes mapPulse{50%{box-shadow:0 0 0 13px #f06aa800}}
.bandung-pin{position:absolute;z-index:4;width:24px;height:24px;left:53.4%;top:51.8%;border:2px solid #fff;border-radius:50%;background:#f06aa8;box-shadow:0 0 0 8px #f06aa845,0 0 0 16px #f06aa81f;transform:translate3d(calc(-50% + var(--map-x)),calc(-50% + var(--map-y) + var(--map-scroll)),0);animation:mapPulse 2.8s ease-out infinite}
.bandung-pin:after{content:"BANDUNG";position:absolute;left:28px;top:-5px;padding:7px 9px;background:#20105f;color:#fff;font:800 .68rem/1 Manrope,sans-serif;letter-spacing:.08em;white-space:nowrap}
.bandung-pin i{position:absolute;width:2px;height:46px;left:10px;bottom:20px;background:#20105f;transform:rotate(23deg);transform-origin:bottom}
.bandung-zoom{position:absolute;z-index:5;width:250px;right:22px;top:24px;margin:0;overflow:hidden;border:2px solid #20105f;background:#f9f4ed;box-shadow:8px 10px 0 #20105f;transform:translate3d(calc(0px - var(--map-x)),calc(0px - var(--map-y)),0)}
.bandung-zoom>div{display:flex;justify-content:space-between;gap:10px;padding:10px 12px;background:#20105f;color:#fff}
.bandung-zoom>div span{color:#ffc857;font-size:.62rem;font-weight:800;letter-spacing:.12em}
.bandung-zoom>div strong{font:800 .7rem/1.1 "Plus Jakarta Sans",Manrope,sans-serif}
.bandung-zoom-crop{position:relative;display:block;height:150px;overflow:hidden;background:#dce7ff}
.bandung-zoom-crop:after{content:"";position:absolute;width:82px;height:82px;left:50%;top:50%;border:3px solid #f06aa8;border-radius:50%;box-shadow:0 0 0 7px #f06aa821;transform:translate(-50%,-50%)}
.bandung-zoom img{display:block;width:400%;max-width:none;height:auto;filter:grayscale(1) contrast(.9);transform:translate(-39.1%,-42.2%)}
.coverage-layer{position:absolute;inset:0;z-index:4;pointer-events:none;transform:translate3d(var(--map-x),calc(var(--map-y) + var(--map-scroll)),0);transition:transform .18s cubic-bezier(.16,1,.3,1)}
.coverage-point{position:absolute;width:11px;height:11px;left:var(--x);top:var(--y);border:2px solid #fff;border-radius:50%;background:#2864dc;box-shadow:0 0 0 5px #2864dc24,0 0 20px #2864dc9e;translate:-50% -50%;pointer-events:auto;cursor:help}
.coverage-point.coverage-home{width:23px;height:23px;background:#f06aa8;box-shadow:0 0 0 10px #f06aa842,0 0 34px #f06aa8d9;animation:mapPulse 2.8s ease-out infinite}
.coverage-point.coverage-high{width:17px;height:17px;background:#ffc857;border-color:#20105f;box-shadow:0 0 0 8px #ffc85738,0 0 28px #ffc857c2}
.coverage-point.coverage-mid{width:12px;height:12px;background:#2864dc;box-shadow:0 0 0 6px #2864dc29,0 0 23px #2864dcb8}
.coverage-point.coverage-low{width:9px;height:9px;background:#fff;border-color:#7453d6;box-shadow:0 0 0 4px #7453d621,0 0 14px #7453d680}
.coverage-point i{position:absolute;display:none;min-width:118px;left:50%;bottom:calc(100% + 9px);padding:8px 9px;border:1px solid #20105f;border-radius:8px;background:#fff;color:#20105f;box-shadow:0 10px 24px #20105f2b;translate:-50% 0;font:800 .62rem/1.2 Manrope,sans-serif;font-style:normal;text-align:left;white-space:nowrap}
.coverage-point:is(:hover,:focus-visible) i{display:block}
.coverage-point:focus-visible{outline:3px solid #ffc857;outline-offset:3px}
.coverage-cluster{position:absolute;padding:5px 7px;border-radius:6px;background:#20105f;color:#fff;box-shadow:0 6px 16px #20105f40;font:800 .54rem/1 Manrope,sans-serif;letter-spacing:.05em;white-space:nowrap}
.cluster-jakarta{left:17%;top:22%}.cluster-bandung{left:55%;top:50%}.cluster-bekasi{left:35%;top:27%}.cluster-cirebon{right:9%;top:38%}
.coverage-card{position:absolute;z-index:5;display:grid;width:190px;right:20px;top:22px;gap:7px;padding:13px 14px;border:2px solid #20105f;border-radius:12px;background:#fff;box-shadow:7px 9px 0 #20105f;color:#20105f}
.coverage-card strong{margin-bottom:2px;font:800 .72rem/1.1 "Plus Jakarta Sans",Manrope,sans-serif;letter-spacing:.06em}
.coverage-card span{display:flex;align-items:center;gap:7px;font-size:.62rem;font-weight:750}
.coverage-card i{width:10px;height:10px;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #20105f}
.coverage-card .legend-home{background:#f06aa8}.coverage-card .legend-high{background:#ffc857}.coverage-card .legend-mid{background:#2864dc}.coverage-card .legend-low{background:#fff;border-color:#7453d6}
.bandung-data{position:absolute;z-index:5;right:20px;bottom:72px;left:20px;display:grid;grid-template-columns:1.08fr .92fr 1.2fr;background:#20105ff2;color:#fff;backdrop-filter:blur(8px)}
.bandung-data>div{display:grid;grid-template-columns:1fr;gap:9px;align-content:center;padding:18px 20px}
.bandung-data>div+div{border-left:1px solid #ffffff36}
.bandung-data strong{color:#ffc857;font:800 clamp(.78rem,1.2vw,1rem)/1.1 "Plus Jakarta Sans",Manrope,sans-serif;letter-spacing:.06em}
.bandung-data span{max-width:24ch;font-size:.7rem;font-weight:750;line-height:1.35}
.bandung-data small{color:#ffffffa8;font-size:.62rem;font-weight:600}
.bandung-data-source{position:absolute;z-index:5;right:22px;bottom:38px;left:22px;margin:0;color:#312647;font-size:.66rem;line-height:1.35}
.bandung-data-source a{color:#30207d;text-decoration:underline;text-underline-offset:2px}
.bandung-map figcaption{position:absolute;z-index:4;right:20px;bottom:55px;left:20px;display:flex;justify-content:space-between;gap:18px;padding:18px 22px;background:#20105fe8;color:#fff;backdrop-filter:blur(8px)}
.bandung-map figcaption strong{font-family:"Plus Jakarta Sans",Manrope,sans-serif}
.bandung-map figcaption span{color:#ffffffb8;font-size:.82rem}
.map-credit{position:absolute;z-index:4;right:22px;bottom:13px;left:22px;margin:0;color:#312647;font-size:.7rem;line-height:1.35}
.map-credit a{color:#30207d;text-decoration:underline;text-underline-offset:2px}
.bandung-map.is-paused :is(.map-geo-diamond,.map-geo-star,.bandung-pin,.coverage-home),.bandung-map.is-page-hidden :is(.map-geo-diamond,.map-geo-star,.bandung-pin,.coverage-home),.bandung-origin:has(.bandung-map.is-paused) :is(.origin-orbit,.origin-cross){animation-play-state:paused}
.trust{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(100deg,#fff 0 46%,#fff8f0 68%,#edf3ff 100%)}
.trust:after{content:"";position:absolute;z-index:-1;width:26%;height:3px;left:-30%;top:0;background:linear-gradient(90deg,transparent,#f06aa8,#2864dc,transparent);animation:trustSignal 8s cubic-bezier(.16,1,.3,1) infinite}
@keyframes trustSignal{55%,100%{transform:translate3d(500%,0,0)}}
.light-decorated{--ornament-shift:0px;position:relative;isolation:isolate;overflow:hidden;background-color:#fff9f4;background-image:radial-gradient(circle at 12% 14%,#f06aa80d,transparent 22%),radial-gradient(circle at 88% 84%,#2864dc0d,transparent 24%)}
.light-decorated.white{background-color:#fff}
.light-decorated>.wrap{position:relative;z-index:2}
.light-ornaments{position:absolute;z-index:1;inset:0;overflow:hidden;pointer-events:none}
.light-ornaments>span{position:absolute;display:block;will-change:transform}
.o-orbit{width:clamp(170px,18vw,290px);height:clamp(170px,18vw,290px);border:2px solid #30207d24;border-radius:50%;transform:translate3d(0,var(--ornament-shift),0);animation:ornamentOrbit 18s linear infinite}
.o-orbit i{position:absolute;width:18px;height:18px;left:8%;top:18%;border:3px solid #fff;border-radius:50%;background:#f06aa8;box-shadow:0 8px 22px #f06aa84d}
.o-beam{width:260px;height:28px;border:2px solid #30207d;background:#ffc857;clip-path:polygon(0 28%,92% 0,100% 72%,8% 100%);transform:translate3d(0,calc(0px - var(--ornament-shift)),0) rotate(-8deg);animation:ornamentBeam 7s ease-in-out infinite}
.o-spark{width:52px;height:52px;transform:translate3d(0,var(--ornament-shift),0) rotate(45deg);border:3px solid #2864dc;background:#f5f0e8;animation:ornamentSpark 6s ease-in-out -1.5s infinite}
.o-spark:before,.o-spark:after{content:"";position:absolute;background:#f06aa8}
.o-spark:before{width:3px;height:76px;left:22px;top:-15px}
.o-spark:after{width:76px;height:3px;left:-15px;top:22px}
.o-dots{width:12px;height:12px;border-radius:50%;background:#30207d;box-shadow:28px 18px 0 #f06aa8,58px -8px 0 #ffc857,82px 26px 0 #2864dc;transform:translate3d(0,calc(0px - var(--ornament-shift)),0);animation:ornamentDots 5.5s ease-in-out -2s infinite}
.ornament-a .o-orbit{right:-90px;top:12%}.ornament-a .o-beam{left:42%;top:-9px}.ornament-a .o-spark{right:9%;bottom:10%}.ornament-a .o-dots{left:5%;bottom:9%}
.ornament-b .o-orbit{left:-110px;bottom:-100px}.ornament-b .o-beam{right:-65px;top:28%}.ornament-b .o-spark{left:44%;top:7%}.ornament-b .o-dots{right:12%;bottom:5%}
.ornament-c .o-orbit{right:-130px;top:26%}.ornament-c .o-beam{left:-80px;bottom:14%}.ornament-c .o-spark{right:22%;top:8%}.ornament-c .o-dots{left:7%;top:13%}
.ornament-d .o-orbit{left:34%;top:-170px}.ornament-d .o-beam{right:4%;bottom:8%}.ornament-d .o-spark{left:4%;bottom:12%}.ornament-d .o-dots{right:4%;top:10%}
.light-decorated:not(.is-ornament-active) .light-ornaments>span,.light-decorated.is-page-hidden .light-ornaments>span{animation-play-state:paused}
@keyframes ornamentOrbit{to{rotate:1turn}}
@keyframes ornamentBeam{50%{translate:0 9px;rotate:2deg}}
@keyframes ornamentSpark{50%{scale:.86;rotate:8deg}}
@keyframes ornamentDots{50%{translate:12px -8px}}
.hero h1{max-width:680px;margin-bottom:18px;font-size:clamp(3.3rem,5.2vw,4.9rem);line-height:.98}
.hero> .wrap p:not(.eyebrow){font-size:1rem}
.hero .visual{min-width:0;height:clamp(520px,calc(100svh - 150px),650px)}
.hero .pack{width:min(90%,470px);height:auto;aspect-ratio:4/5;right:2%;top:50%;translate:0 -50%;border-radius:42% 14% 38% 16%/24% 36% 18% 40%;box-shadow:inset 0 0 0 2px #ffffff2b,0 42px 90px #09021e7a;transform:rotate(1.5deg)}
.hero .ring{width:min(92%,520px);height:auto;aspect-ratio:1;right:-1%;left:auto;top:50%;translate:0 -50%}
.after-hours{padding:clamp(78px,8vw,110px) 0}
.after-grid{grid-template-columns:minmax(260px,.618fr) minmax(0,1fr);align-items:start;gap:clamp(28px,4vw,56px);margin-top:48px}
.after-grid>div:first-child h2{font-size:clamp(2.4rem,4.6vw,4.8rem)}
.after-intro{max-width:520px;color:#ffffffbd}
.uniform-card{grid-column:2;grid-row:1/3;margin:0;padding:0;overflow:hidden;border-radius:42px 12px 42px 12px;transform:rotate(.6deg);box-shadow:18px 24px 0 #2864dc66}
.uniform-photo{display:block;width:100%;height:auto;aspect-ratio:1.618/1;object-fit:cover;object-position:center 45%}
.uniform-card figcaption{padding:22px 24px 25px}
.uniform-card h3{margin:0 0 8px;font-size:1.45rem}
.uniform-card p{margin:0;color:#ffffffb8}
.after-note{grid-column:1;grid-row:2;align-self:end;border-radius:28px 8px 28px 8px}
.after-note a{display:inline-block;margin-top:18px;color:#ffc857;font-weight:800}
.pareto .wrap{grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr);gap:clamp(42px,6vw,80px)}
.flavour-stack{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;min-height:590px;align-items:start}
.flavour{position:relative;inset:auto;width:auto;height:540px;padding:0;display:block;overflow:hidden;isolation:isolate;border-radius:36px 12px 36px 12px;box-shadow:0 32px 70px #0007;transform:none!important;background:#251450;color:#fff}
.flavour.red{margin-top:50px;background:#7b3219}
.flavour img,.flavour.green img,.flavour.red img{position:absolute;inset:0;width:100%;height:100%;z-index:0;object-fit:cover;object-position:74% center;transition:transform .65s cubic-bezier(.16,1,.3,1)}
.flavour:after,.flavour.green:after,.flavour.red:after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 42%,#0d0529e8 76%,#0d0529 100%)}
.flavour:hover img{transform:scale(1.035)}
.flavour-meta{position:absolute;inset:auto 0 0;z-index:2;display:grid;gap:8px;padding:72px 24px 24px}
.flavour-meta span{justify-self:start;padding:6px 9px;border-radius:8px;background:#fff;color:#20105f;font:800 .68rem/1 Manrope,sans-serif;letter-spacing:.08em}
.flavour-meta strong{color:#fff;font:800 clamp(1.75rem,2.5vw,2.55rem)/1.02 "Plus Jakarta Sans",Manrope,sans-serif;letter-spacing:-.035em}
.flavour-meta small{color:#ffffffc7;font-size:.78rem;font-weight:700;letter-spacing:.03em;text-transform:none}
.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:clamp(28px,5vw,72px);padding-bottom:42px}
.footer-brand p{max-width:330px;color:#ffffffa8}
footer nav{display:flex;height:auto;min-height:0;flex-direction:column;align-items:flex-start;gap:4px}
footer nav h2{margin:0 0 10px;color:#fff;font:800 .76rem/1.2 "Plus Jakarta Sans";letter-spacing:.12em;text-transform:uppercase}
footer nav a{color:#ffffffb5;font-size:.9rem}
footer nav a:hover{color:#ffc857}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:24px;border-top:1px solid #ffffff24;color:#ffffff80}
.footer-bottom a{color:#ffc857;font-size:.85rem;font-weight:700}
.footer-bottom a{display:inline-flex;min-height:44px;align-items:center}
.footer-legal{flex-direction:row;align-items:center;gap:16px;flex-wrap:wrap}
.downloads-page{background:#f5f0e8}
.downloads-page .footer-grid{grid-template-columns:1.5fr 1fr 1fr}
.downloads-page header nav{justify-content:space-between}
.downloads-page header .logo{width:142px;height:46px;display:block;font-size:0;background:var(--pd)!important;-webkit-mask:url('assets/flavorich-logo.webp') center/contain no-repeat;mask:url('assets/flavorich-logo.webp') center/contain no-repeat}
.download-hero{display:flex;align-items:center;min-height:620px;padding:90px 0;background:#20105f;color:#fff}
.download-hero h1{margin:.25em 0;font-size:clamp(4rem,9vw,8rem);line-height:.88}
.download-hero h1 span{color:#ffc857}
.download-hero p:last-child{max-width:620px;color:#ffffffbd;font-size:1.1rem}
.download-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.download-grid article{display:flex;min-height:480px;padding:34px;flex-direction:column;border:2px solid #20105f;border-radius:42px 12px;background:#fff}
.download-grid article>span{color:#7453d6;font:800 .72rem monospace;letter-spacing:.12em}
.download-grid h2{font-size:clamp(2.2rem,4vw,4rem);margin:50px 0 14px}
.download-grid img{width:220px;height:90px;margin:10px 0;object-fit:contain;object-position:left center}
.download-grid .btn{align-self:flex-start;margin-top:auto}
.asset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:42px}
.asset-grid figure{margin:0;overflow:hidden;border-radius:32px 10px;background:#fff;color:#20105f}
.asset-grid img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.downloads-page .asset-grid img{height:clamp(250px,30vw,360px);padding:12px;object-fit:contain;background:#f5f0e8}
.asset-grid img[src*="/products/"]{object-fit:contain;background:#f5f0e8}
.asset-grid figcaption{display:flex;justify-content:space-between;gap:12px;padding:18px;font-weight:800}
.asset-grid figcaption a{color:#7453d6}
.asset-note{max-width:720px;margin-top:28px;color:#ffffff9c;font-size:.8rem}
.next-steps{display:grid;gap:16px;margin:32px 0 0;padding:0;list-style:none;counter-reset:sample-step}
.next-steps li{display:grid;grid-template-columns:36px 1fr;column-gap:12px;counter-increment:sample-step}
.next-steps li:before{content:counter(sample-step);grid-row:1/3;display:grid;width:32px;height:32px;place-items:center;border:1px solid #ffffff5c;border-radius:50%;color:#ffc857;font-weight:800}
.next-steps strong{line-height:1.35}
.next-steps span{color:#ffffffa8;font-size:.88rem;line-height:1.5}
.form-help{margin:0 0 22px;color:#5c5365;font-size:.88rem}
.form :is(input,select){width:100%;border:1px solid #cfc5d6;background:#fff;color:#151122;font:inherit}
.form :is(input,select):hover{border-color:#7453d6}
.form :is(input,select):user-invalid{border-color:#b42318;background:#fff6f4}
.form .is-error{color:#a11b15;font-weight:700}
.form .is-success{color:#23643a;font-weight:700}
.faq-copy .wrap{position:relative}
.faq-heading{max-width:720px;margin-left:7%}
.faq-heading h2{max-width:620px;margin:.35rem 0 1rem}
.faq-heading>p:last-child{max-width:540px;color:#5c5365}
.faq-grid{display:grid;grid-template-columns:1.08fr .92fr 1fr;gap:clamp(1.5rem,4vw,4.5rem);margin-top:clamp(3rem,7vw,6.5rem)}
.faq-grid article{position:relative;padding:1.4rem .25rem 0;border-top:2px solid currentColor}
.faq-grid article:nth-child(2){translate:0 2.8rem}
.faq-grid article:nth-child(3){translate:0 -1.4rem}
.faq-grid span{display:inline-block;margin-bottom:2.5rem;color:#7453d6;font:700 .76rem/1 var(--font-mono,monospace);letter-spacing:.12em}
.faq-grid h3{max-width:320px;margin:0 0 1rem;font-size:clamp(1.2rem,2vw,1.7rem);line-height:1.08}
.faq-grid p{max-width:360px;margin:0;color:#5c5365;line-height:1.65}
.faq-cta{margin:clamp(3rem,7vw,6rem) 0 0 7%}
@media(max-width:760px){.faq-heading,.faq-cta{margin-left:0}.faq-grid{grid-template-columns:1fr;gap:2.2rem;margin-top:3rem}.faq-grid article:nth-child(2),.faq-grid article:nth-child(3){translate:none}.faq-grid span{margin-bottom:1.25rem}.faq-cta{margin-top:2.5rem}}
@media(max-width:760px){.hero .visual{display:none!important}.hero-grid{min-height:auto;padding-block:clamp(64px,15vw,92px)!important}}
@media(prefers-reduced-motion:reduce){.btn{transition:none;transform:none}.btn:hover,.btn:active{transform:none}.flavour img{transition:none}.flavour:hover img{transform:none}.culture-track{animation:none;transform:none;will-change:auto}.bandung-origin *{animation:none!important;transition:none!important}.west-java-map,.map-geo,.map-label{transform:none}.west-java-map{translate:0 -50%;rotate:-2deg}.trust:after,.light-ornaments>span{animation:none!important;transform:none!important;will-change:auto}}

/* Hero video � full-bleed brand footage with a resilient static-poster fallback. */
.hero{min-height:clamp(620px,calc(100svh - 76px),820px);isolation:isolate;background:#14083f url('assets/media/hero-background-poster.jpg') center 48%/cover no-repeat}
.hero:before{z-index:1;inset:0;width:auto;height:auto;min-width:0;min-height:0;border:0;border-radius:0;background:linear-gradient(90deg,rgba(13,5,41,.95) 0%,rgba(20,8,63,.84) 40%,rgba(20,8,63,.36) 72%,rgba(13,5,41,.16) 100%);transform:none;pointer-events:none}
.hero:after{z-index:1;background:linear-gradient(180deg,rgba(13,5,41,.12) 0%,rgba(13,5,41,.06) 56%,rgba(13,5,41,.58) 100%)!important}
.hero-video{position:absolute;z-index:0;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 48%;background:#14083f url('assets/media/hero-background-poster.jpg') center 48%/cover no-repeat;pointer-events:none}
.hero-video.is-poster-only{visibility:hidden}
.hero-grid{grid-template-columns:minmax(0,730px);justify-content:start;min-height:clamp(620px,calc(100svh - 76px),820px);gap:0}
.hero-content{position:relative;padding-block:clamp(76px,10vw,118px);text-shadow:0 2px 24px rgba(9,2,30,.38)}
.hero-content>p:not(.eyebrow){max-width:620px;color:#fff;font-size:clamp(1rem,1.45vw,1.15rem);text-shadow:0 2px 18px rgba(9,2,30,.72)}
.hero .wrap .hero-content>p.hero-tagline{max-width:none;margin:16px 0 0;color:#ffffffa3;font-size:.8rem;font-style:italic;letter-spacing:.02em;text-shadow:none}
.hero .eyebrow{color:#f6a3cb}
.hero .btn.outline{border-color:rgba(255,255,255,.74);background:rgba(13,5,41,.2);color:#fff;text-shadow:none}
.hero .chip{border-color:rgba(255,255,255,.48);background:rgba(13,5,41,.24);color:#fff;text-shadow:none}
@media(max-width:900px){.hero:before{background:linear-gradient(90deg,rgba(13,5,41,.94) 0%,rgba(20,8,63,.78) 58%,rgba(20,8,63,.32) 100%)}.hero-video{object-position:56% center}.hero-grid{grid-template-columns:minmax(0,680px)}}
@media(max-width:760px){.hero{min-height:calc(100svh - 76px)}.hero:before{background:linear-gradient(180deg,rgba(13,5,41,.82) 0%,rgba(20,8,63,.68) 52%,rgba(13,5,41,.9) 100%)}.hero-video{object-position:52% center}.hero-grid{min-height:calc(100svh - 76px);padding-block:0!important}.hero-content{align-self:end;padding-block:clamp(80px,17vh,150px) clamp(54px,9vh,82px)}.hero h1{max-width:10ch;font-size:clamp(3rem,14vw,4.5rem)}.hero-content>p:not(.eyebrow){max-width:52ch}.hero .actions{max-width:440px}}
@media(prefers-reduced-motion:reduce){.hero-video{visibility:hidden}.hero{background:#14083f url('assets/media/hero-background-poster.jpg') center 48%/cover no-repeat}}

/* Download center task flow: quick access, verified metadata, consistent actions. */
.downloads-page .section{padding-block:clamp(72px,8vw,108px)}
.downloads-page .light-ornaments{display:none}
.download-hero{min-height:clamp(480px,64svh,620px);padding-block:clamp(64px,8vw,96px)}
.download-intro{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr);gap:clamp(40px,7vw,96px);align-items:center}
.download-hero h1{max-width:720px;margin:0 0 24px;font-size:clamp(3.7rem,7.5vw,7rem);letter-spacing:-.04em}
.download-hero p:last-child{margin:0}
.download-shortcuts{display:grid;height:auto;gap:10px}
.download-shortcuts a{display:grid;grid-template-columns:1fr auto;min-height:74px;padding:16px 18px;align-items:center;gap:10px;border:1px solid #ffffff45;border-radius:14px;background:#ffffff0f;color:#fff;transition:border-color .2s ease,background .2s ease}
.download-shortcuts a:hover,.download-shortcuts a:focus-visible{border-color:#ffc857;background:#ffffff1a}
.download-shortcuts strong{font:800 1rem/1.2 "Plus Jakarta Sans",Manrope,sans-serif}
.download-shortcuts span{color:#ffffffb8;font-size:.78rem;font-weight:700}
.download-section-heading{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:34px}
.download-section-heading h2{max-width:720px;margin:0}
.download-section-heading p{max-width:520px;margin:0;color:#655f70}
.download-assets .download-section-heading p{color:#ffffffb8}
.downloads-page .download-grid{gap:20px}
.downloads-page .resource-card{min-width:0;border-radius:16px}
.downloads-page .download-grid .resource-card{display:flex;min-height:0;padding:clamp(26px,3.4vw,40px);flex-direction:column;border:1px solid #d9d0de;background:#fff}
.resource-label{color:#7453d6;font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.downloads-page .download-grid h3{max-width:15ch;margin:28px 0 14px;font-size:clamp(2rem,3.5vw,3.6rem);line-height:1.02}
.resource-card-main>p{max-width:55ch;color:#5c5365}
.resource-card-main>img{display:block;width:220px;height:94px;margin:22px 0 2px;object-fit:contain;object-position:left center}
.resource-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:28px 0 0;border-block:1px solid #e6dfe9}
.resource-meta div{min-width:0;padding:13px 8px 13px 0}
.resource-meta dt{color:#655f70;font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.resource-meta dd{margin:3px 0 0;overflow-wrap:anywhere;color:#20105f;font-weight:800}
.resource-usage{min-height:3.2em;margin:18px 0;color:#5c5365;font-size:.88rem}
.download-action{align-self:flex-start;min-width:180px;min-height:48px;margin-top:auto}
.download-action[aria-disabled="true"]{opacity:.65;cursor:wait}
.downloads-page .asset-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.downloads-page .asset-card{display:grid;margin:0;overflow:hidden;border:1px solid #ffffff24;background:#fff;color:#20105f}
.downloads-page .asset-card>img{width:100%;height:clamp(260px,34vw,430px);padding:16px;object-fit:contain;background:#f5f0e8}
.asset-preview-missing{display:grid;width:100%;min-height:260px;padding:24px;place-items:center;background:#eee8e0;color:#655f70;font-weight:800;text-align:center}
.downloads-page .asset-card figcaption{display:grid;min-width:0;padding:clamp(22px,3vw,30px);gap:18px}
.downloads-page .asset-card h3{margin:0;font-size:clamp(1.5rem,2.4vw,2.2rem)}
.downloads-page .asset-card figcaption p{margin:8px 0 0;color:#655f70;font-weight:500}
.downloads-page .asset-card .resource-meta{width:100%;margin:0}
.downloads-page .asset-card .download-action{color:#20105f;border-color:#d9d0de;background:#fff9f4}
.download-status{position:fixed;z-index:120;right:20px;bottom:20px;display:flex;max-width:min(440px,calc(100% - 40px));min-height:52px;padding:13px 16px;align-items:center;gap:14px;border-radius:12px;background:#fff;color:#20105f;box-shadow:0 16px 44px #09021e4a;font-weight:700}
.download-status[hidden]{display:none}
.download-status.is-error{background:#fff0f2;color:#71152b}
.download-retry{min-height:44px;margin-left:auto;display:inline-flex;align-items:center;color:inherit;text-decoration:underline;font-weight:800}
@media(max-width:800px){.download-intro{grid-template-columns:1fr}.download-hero{min-height:0}.download-section-heading{display:block}.download-section-heading p{margin-top:12px}.downloads-page .asset-grid{grid-template-columns:1fr}}
@media(max-width:650px){.downloads-page header nav{gap:14px}.downloads-page header .btn{padding-inline:14px;font-size:.78rem}.download-hero h1{font-size:clamp(3.1rem,15vw,4.8rem)}.download-shortcuts a{grid-template-columns:1fr;min-height:72px}.downloads-page .download-grid{grid-template-columns:1fr}.resource-meta{grid-template-columns:1fr 1fr}.download-status{right:12px;bottom:12px;max-width:calc(100% - 24px)}}

/* Brand accent tokens shared by product category surfaces */
:root{--accent-creamer:#98275f;--accent-syrup:#2864dc;--accent-puree:#c65312;--accent-powder:#6035b2}
.category-cta{margin-top:56px;text-align:center}
.category-cta p{margin:0 0 20px;color:var(--muted);font-size:1.125rem;font-weight:600}

/* Product category detail routes � shared editorial system with category-specific surfaces. */
.product-detail-page{--product-surface:#dce8e4;--product-soft:#f2f7f5;--product-ink:#174c42;--product-accent:#257666;background:#fff;color:#171222}
.product-detail-syrup{--product-surface:#f7dce9;--product-soft:#fff1f7;--product-ink:#6f1f4c;--product-accent:#b32f76}
.product-detail-puree-syrup{--product-surface:#f4e4cc;--product-soft:#fff7ec;--product-ink:#704018;--product-accent:#b96824}
.product-detail-powder{--product-surface:#dcd9fa;--product-soft:#f3f1ff;--product-ink:#30207d;--product-accent:#6754c7}
.product-detail-page header{background:#fff9f4f2}
.product-detail-hero{padding:clamp(44px,6vw,88px) 0 clamp(64px,8vw,112px);background:linear-gradient(90deg,#fff 0 51%,var(--product-soft) 51%)}
.product-detail-grid{display:grid;grid-template-columns:minmax(0,.78fr) minmax(460px,1.22fr);align-items:center;gap:clamp(44px,7vw,104px)}
.product-detail-copy{position:relative;z-index:1}
.product-detail-copy h1{max-width:9ch;margin:clamp(34px,5vw,70px) 0 24px;font-size:clamp(4rem,8vw,6rem);letter-spacing:-.04em;text-wrap:balance}
.product-detail-copy .product-lead{max-width:34ch;margin:0;color:#211a2d;font-size:clamp(1.25rem,2vw,1.7rem);font-weight:700;line-height:1.4}
.product-detail-copy .product-descriptor{max-width:54ch;margin:22px 0 36px;color:#5b5365;font-size:1rem}
.product-back{display:inline-flex;min-height:44px;align-items:center;color:var(--product-ink);font-weight:800;text-decoration:underline;text-decoration-color:var(--product-accent);text-underline-offset:7px;text-decoration-thickness:2px}
.product-detail-media{position:relative;height:clamp(540px,60vw,720px);margin:0;overflow:hidden;border-radius:16px;background:var(--product-surface)}
.product-detail-media:before{content:"";position:absolute;z-index:0;width:42%;aspect-ratio:1;right:-12%;top:-9%;border:1px solid color-mix(in srgb,var(--product-ink) 20%,transparent);border-radius:50%}
.product-media-index{position:absolute;z-index:2;right:24px;bottom:18px;color:var(--product-ink);font-size:.72rem;font-weight:800;letter-spacing:.13em}
.product-detail-media img{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:cover}
.product-detail-page.product-detail-page .product-detail-media img[src*="creamer"],.product-detail-page.product-detail-page .product-detail-media img[src*="powder"]{object-fit:contain;padding:clamp(24px,4vw,54px)}
.product-media-duo{position:absolute;z-index:1;inset:clamp(24px,4vw,54px);display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:12px}
.product-detail-page .product-media-duo img{width:100%;height:auto;padding:0;object-fit:contain}
.product-detail-syrup .product-detail-media,.product-detail-puree-syrup .product-detail-media{display:grid;place-items:center}
.product-detail-syrup .product-detail-media>img{width:min(72%,399px);height:auto;max-height:88%;object-fit:contain}
.product-detail-puree-syrup .product-detail-media>img{width:min(64%,335px);height:auto;max-height:88%;object-fit:contain}
.product-application-band{background:var(--product-ink);color:#fff}
.product-application-band>.wrap{display:grid;grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr);align-items:stretch;gap:clamp(36px,7vw,90px)}
.application-intro{padding:clamp(42px,6vw,72px) 0}
.application-intro h2{margin:0 0 14px;font-size:clamp(2rem,3.8vw,3.7rem)}
.application-intro p{max-width:36ch;margin:0;color:#ffffffc7}
.product-application-band ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;padding:0;list-style:none;border-left:1px solid #ffffff32}
.product-application-band li{display:flex;min-height:190px;padding:28px;align-items:flex-end;border-right:1px solid #ffffff32;font-size:clamp(1.15rem,2vw,1.65rem);font-weight:800}
.product-decision{background:#fff}
.product-decision-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(380px,.72fr);gap:clamp(54px,9vw,140px);align-items:start}
.product-decision h2{max-width:12ch;margin:0 0 26px;font-size:clamp(3rem,5.8vw,5.6rem);text-wrap:balance}
.product-decision p{max-width:60ch;margin:0;color:#5b5365;font-size:1.08rem}
.product-decision ul{margin:10px 0 0;padding:0;list-style:none;border-top:1px solid #d9d2de}
.product-decision li{position:relative;padding:24px 0 24px 32px;border-bottom:1px solid #d9d2de;color:#272033;font-size:1.08rem;font-weight:700}
.product-decision li:before{content:"";position:absolute;top:31px;left:2px;width:10px;height:10px;border:2px solid var(--product-accent);border-radius:50%}
.product-next-step{background:var(--product-ink);color:#fff}
.product-next-step-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:50px}
.product-next-step h2{max-width:17ch;margin:0 0 20px;font-size:clamp(3rem,5.5vw,5.3rem);text-wrap:balance}
.product-next-step p{max-width:62ch;margin:0;color:#fff}
.product-next-step .btn{min-width:250px}
.related-categories{background:var(--product-soft)}
.related-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.5fr);align-items:end;gap:40px;margin-bottom:42px}
.related-heading h2{max-width:13ch;margin:0;font-size:clamp(2.8rem,5vw,4.8rem)}
.related-heading p{margin:0;color:#5b5365}
.related-category-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid color-mix(in srgb,var(--product-ink) 22%,transparent)}
.related-category-links a{display:flex;min-height:110px;padding:24px 4px;align-items:center;justify-content:space-between;border-bottom:1px solid color-mix(in srgb,var(--product-ink) 22%,transparent);color:var(--product-ink);font-size:1.18rem;font-weight:800;transition:color .2s ease,transform .25s cubic-bezier(.16,1,.3,1)}
.related-category-links a:not(:last-child){margin-right:26px}
.related-category-links a:is(:hover,:focus-visible){color:var(--product-accent);transform:translateX(6px)}
.related-category-links b{font-size:1.35rem}
@media(max-width:980px){.product-detail-hero{background:#fff}.product-detail-grid,.product-decision-grid{grid-template-columns:1fr}.product-detail-media{height:600px}.product-detail-copy{max-width:720px}.product-application-band>.wrap{grid-template-columns:1fr}.application-intro{padding-bottom:16px}.product-application-band ul{border-top:1px solid #ffffff32}.product-next-step-grid{grid-template-columns:1fr;align-items:start}.product-next-step .btn{justify-self:start}.related-heading{grid-template-columns:1fr}.related-category-links{grid-template-columns:1fr}.related-category-links a:not(:last-child){margin-right:0}}
@media(max-width:620px){.product-detail-hero{padding-top:28px}.product-detail-copy h1{margin-top:28px;font-size:clamp(3.6rem,18vw,5.2rem)}.product-detail-media{height:430px}.product-media-duo{inset:18px 10px;gap:6px}.product-media-index{right:16px;bottom:12px}.product-application-band ul{grid-template-columns:1fr;border-left:0}.product-application-band li{min-height:92px;padding:22px 0;border-right:0;border-bottom:1px solid #ffffff32}.product-next-step .btn{width:100%;min-width:0}.related-category-links a{min-height:88px}}
@media(prefers-reduced-motion:reduce){.related-category-links a{transition:none}.related-category-links a:is(:hover,:focus-visible){transform:none}}

/* === Impeccable Aesthetic Enhancements === */

/* Hero Gradient & Glassmorphism Chips */
.hero-content h1 span {
  background: linear-gradient(135deg, #f59e0b 0%, #fbbf24 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
}
.hero-content .chips .chip {
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  transition: transform 0.25s ease, background 0.25s ease;
}
.hero-content .chips .chip:hover {
  background: rgba(255, 255, 255, 0.15);
  transform: translateY(-2px);
}

/* Trust bar: main claim as visual anchor + 4 capability stat-cards (issue #79) */
.trust .wrap{display:flex;flex-direction:column;align-items:center;gap:26px;padding:48px 0}
.trust-claim{margin:0;max-width:32ch;color:var(--pd);font-family:"Plus Jakarta Sans",Inter,sans-serif;font-size:clamp(1.35rem,2.3vw,1.85rem);font-weight:800;line-height:1.2;text-align:center;letter-spacing:-.01em}
.trust-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;width:100%}
.trust-card{display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px 14px;background:#fff;border:1px solid #e8e3ea;border-radius:16px;box-shadow:0 2px 8px rgba(0,0,0,.03);text-align:center;transition:transform .2s ease,box-shadow .2s ease}
.trust-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.06)}
.trust-card svg{color:var(--p)}
.trust-card strong{font-size:.86rem;font-weight:700;line-height:1.3;color:var(--ink)}
@media(max-width:900px){.trust-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.trust .wrap{padding:36px 0;gap:20px}.trust-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.trust-card{transition:none}.trust-card:hover{transform:none}}

/* Category Catalog Micro-Motion */
.product-category {
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease;
}
.product-category:hover {
  transform: translateY(-6px);
}
.product-category figure img {
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.product-category:hover figure img {
  transform: scale(1.04);
}

/* Articles Aspect Ratio & Category Pill */
.articles-grid .article-card figure {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 12px;
}
.articles-grid .article-card figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}
.articles-grid .article-card:hover figure img {
  transform: scale(1.05);
}
.article-category {
  display: inline-block;
  background: rgba(180, 35, 24, 0.08);
  color: #b42318;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 100px;
  margin-bottom: 8px;
}

/* Events Dark Glassmorphism & Pulsing Dot */
.events-grid .event-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  backdrop-filter: blur(8px);
  transition: transform 0.3s ease, border-color 0.3s ease;
}
.events-grid .event-card:hover {
  transform: translateY(-4px);
  border-color: rgba(255, 255, 255, 0.2);
}
.event-status.upcoming {
  position: relative;
  padding-left: 14px;
}
.event-status.upcoming::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 7px;
  height: 7px;
  background-color: #12b76a;
  border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(18, 183, 106, 0.6);
  animation: pulse-dot 2s infinite;
}
@keyframes pulse-dot {
  0% { box-shadow: 0 0 0 0 rgba(18, 183, 106, 0.6); }
  70% { box-shadow: 0 0 0 6px rgba(18, 183, 106, 0); }
  100% { box-shadow: 0 0 0 0 rgba(18, 183, 106, 0); }
}

/* FAQ Typography & Card Container */
.faq-grid article {
  background: #fff;
  border: 1px solid #eae5ed;
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.02);
  transition: transform 0.25s ease, border-color 0.25s ease;
}
.faq-grid article:hover {
  transform: translateY(-3px);
  border-color: #d0c5d6;
}
.faq-grid article span {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 2.2rem;
  font-weight: 700;
  color: #b42318;
  opacity: 0.85;
  display: block;
  margin-bottom: 8px;
}

/* Sample Form Progress & Input Focus Glow */
.form-step-fill {
  transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.form input:focus-visible,
.form select:focus-visible {
  outline: none;
  border-color: #b42318;
  box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.15);
}

/* Kategori section — dark theme, 2x2 card grid (blob-masked imagery per category) */
.kategori-section{
  --kategori-bg:#170B36;
  --kategori-bg-raised:#241454;
  --kategori-ink:#FFFFFF;
  --kategori-ink-soft:#B9AFDA;
  --kategori-steel:#8B7FB0;
  --kategori-line:#3A2A66;
  --kategori-accent-syrup:var(--accent-syrup);
  --kategori-accent-krimer:var(--accent-creamer);
  --kategori-accent-powder:var(--accent-powder);
  --kategori-accent-puree:var(--accent-puree);
  --kategori-display:"Plus Jakarta Sans",Manrope,sans-serif;
  --kategori-body:"Inter",Manrope,sans-serif;
  --kategori-mono:"IBM Plex Mono",monospace;
  overflow:hidden;
  background:var(--kategori-bg);
  color:var(--kategori-ink);
}
.kategori-section>:first-child{margin-top:0}
.kategori-section>:last-child{margin-bottom:0}

.kategori-section{padding:72px 0}
.kategori-heading{max-width:1160px;margin:0 auto 32px;padding:0 40px}
.kategori-heading .eyebrow{color:var(--kategori-steel)}
.kategori-heading h2{margin:0;max-width:32ch;font-family:var(--kategori-display);font-size:clamp(1.9rem,3.4vw,2.75rem);color:var(--kategori-ink)}
.kategori-heading p{margin:10px 0 0;max-width:56ch;color:var(--kategori-ink-soft);font-size:1.05rem;line-height:1.6}
.kategori-shared-spec{display:inline-block;max-width:56ch;margin-top:14px;padding:9px 18px;border:1px solid var(--kategori-line);border-radius:999px;color:var(--kategori-ink-soft);font-size:.85rem}
.kategori-shared-spec strong{color:var(--kategori-ink);font-weight:600}

.kategori-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;max-width:1160px;margin:0 auto;padding:0 40px}

.kategori-card{display:flex;flex-direction:column;align-items:center;min-height:540px;padding:28px 26px;border-radius:24px 8px 24px 8px;background:var(--kategori-bg-raised);box-shadow:0 0 70px -8px var(--kategori-glow,transparent),0 25px 55px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.08);text-align:center}

.kategori-card--01{--kategori-glow:var(--kategori-accent-syrup)}
.kategori-card--02{--kategori-glow:var(--kategori-accent-krimer)}
.kategori-card--03{--kategori-glow:var(--kategori-accent-powder)}
.kategori-card--04{--kategori-glow:var(--kategori-accent-puree)}

/* .kategori-media is an unclipped wrapper so .kategori-badge (positioned at its
   corner) never gets cut by the blob mask below — only .kategori-media-mask is
   clipped. See issue #74/#75: circular/blob masks eat their box's corners. */
.kategori-media{position:relative;flex-shrink:0;width:190px;height:190px;margin-bottom:22px}
.kategori-media-mask{width:100%;height:100%;overflow:hidden;border-radius:50%;background:var(--kategori-bg)}
.kategori-media-mask img{display:block;width:100%;height:100%;object-fit:cover}
.kategori-badge{position:absolute;top:-4px;left:-4px;font-family:var(--kategori-mono);font-size:.62rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:#fff;padding:5px 11px;border-radius:999px;box-shadow:0 8px 20px rgba(0,0,0,.35);z-index:2}

.kategori-card--01 .kategori-media-mask{clip-path:url(#kategoriBlob1)}
.kategori-card--02 .kategori-media-mask{clip-path:url(#kategoriBlob2)}
.kategori-card--03 .kategori-media-mask{clip-path:url(#kategoriBlob3)}
.kategori-card--04 .kategori-media-mask{clip-path:url(#kategoriBlob4)}

/* Category photos (issue #73) are now single-bottle/single-pack crops, each
   already composed with its label centered in frame, so the default
   object-position:50% 50% (from .kategori-media-mask img above) keeps the
   blob mask's safe zone on the product without per-card tuning. */

.kategori-card--01 .kategori-badge{background:var(--kategori-accent-syrup)}
.kategori-card--02 .kategori-badge{background:var(--kategori-accent-krimer)}
.kategori-card--03 .kategori-badge{background:var(--kategori-accent-powder)}
.kategori-card--04 .kategori-badge{background:var(--kategori-accent-puree);color:#000}

.kategori-body{display:flex;flex-direction:column;align-items:center;width:100%;flex:1}

.kategori-body h3{margin:0 0 10px;max-width:30ch;font-family:var(--kategori-display);font-weight:500;font-size:21px;line-height:1.3;letter-spacing:-.005em;color:var(--kategori-ink)}
.kategori-body p{margin:0 0 18px;max-width:36ch;font-family:var(--kategori-body);font-size:14px;line-height:1.65;color:var(--kategori-ink-soft)}

.kategori-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:22px}
.kategori-tag{padding:5px 12px;border:1px solid var(--kategori-line);border-radius:20px;color:var(--kategori-ink-soft);font-size:12px}

.kategori-cta{display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding:12px 20px;border-radius:999px;background:#fff;color:var(--kategori-bg);font-family:var(--kategori-display);font-weight:700;font-size:14px;text-decoration:none;box-shadow:5px 5px 0 var(--kategori-accent-syrup);transition:transform .15s ease,box-shadow .15s ease}
.kategori-cta:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 var(--kategori-accent-syrup)}
.kategori-cta:active{transform:translate(4px,4px);box-shadow:1px 1px 0 var(--kategori-accent-syrup)}
.kategori-cta:focus-visible{outline:2px solid #fff;outline-offset:3px}
.kategori-cta svg{width:14px;height:14px;flex-shrink:0}
.kategori-cta--02{box-shadow:5px 5px 0 var(--kategori-accent-krimer)}
.kategori-cta--02:hover{box-shadow:3px 3px 0 var(--kategori-accent-krimer)}
.kategori-cta--02:active{box-shadow:1px 1px 0 var(--kategori-accent-krimer)}
.kategori-cta--03{box-shadow:5px 5px 0 var(--kategori-accent-powder)}
.kategori-cta--03:hover{box-shadow:3px 3px 0 var(--kategori-accent-powder)}
.kategori-cta--03:active{box-shadow:1px 1px 0 var(--kategori-accent-powder)}
.kategori-cta--04{box-shadow:5px 5px 0 var(--kategori-accent-puree)}
.kategori-cta--04:hover{box-shadow:3px 3px 0 var(--kategori-accent-puree)}
.kategori-cta--04:active{box-shadow:1px 1px 0 var(--kategori-accent-puree)}

@media(max-width:640px){
  .kategori-heading{margin-bottom:32px;padding:0 24px}
  .kategori-grid{grid-template-columns:1fr;gap:24px;padding:0 24px}
  .kategori-card{min-height:0;padding:28px 24px}
}

@media(prefers-reduced-motion:reduce){
  .kategori-cta{transition:none}
}