/* Compact phone layout */
@media (max-width:600px){
 :root{--pad:18px}
 body{font-size:15.5px;line-height:1.45}
 h2{font-size:clamp(24px,7.4vw,30px)!important;line-height:1.05}
 h3{font-size:clamp(18px,5.4vw,22px)}
 .wrap{padding-top:34px!important;padding-bottom:34px!important}
 .lead,.hero p{font-size:15.5px!important}
 .btn{padding:12px 18px;font-size:15px}
 .tag{font-size:12px}
 /* heroes */
 .hero{padding-top:22px!important;padding-bottom:30px!important}
 .hero h1{font-size:clamp(40px,13vw,54px)!important;line-height:.9!important;margin-bottom:14px!important}
 .hero .in{gap:18px!important}
 .hero .cta{gap:8px}
 .fan{width:100%!important;transform:rotate(-3deg)}
 .fan img{width:104%!important;margin-left:-2%!important}
 /* RushUp 4 varian: 2x2, satu layar */
 #produk .grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;margin:18px 0 0!important;overflow:visible!important;padding:0!important}
 #produk .grid>*{flex:none!important}
 #produk .card{padding:10px!important;border-radius:14px!important}
 #produk .card .pic{margin:0 0 6px!important;padding:4px 0 0!important}
 #produk .card .pic img.tray{display:none!important}
 #produk .card .pic img:not(.tray){width:100%!important;position:static!important;opacity:1!important;transform:none!important}
 #produk .card h3{font-size:14px!important;line-height:1.15!important;margin:0 0 8px!important;min-height:2.3em}
 #produk .card p{display:none!important}
 #produk .card .more{width:100%;padding:8px 6px!important;font-size:12px!important;min-height:36px!important;text-align:center;margin:0!important}
 .lauks{display:flex!important;overflow-x:auto;gap:10px!important;max-width:none!important;margin:0 calc(var(--pad)*-1)!important;padding:0 var(--pad) 8px;scroll-snap-type:x mandatory;scrollbar-width:none}
 .lauks::-webkit-scrollbar{display:none}
 .lauks img{flex:0 0 58%;width:58%!important;scroll-snap-align:start}
 .pouches{grid-template-columns:1fr 1fr!important;gap:10px!important;padding:16px 12px 12px!important}
 .pouches img{width:min(100%,130px)!important}
 .pouches figcaption{font-size:13px}
 .line-card{padding:16px!important;gap:12px!important}
 .two{margin-top:22px!important;gap:12px!important}
 /* exploded view smaller */
 .kit{--s:.58}
 .kit .in{gap:18px!important}
 /* steps */
 .how h2,.kit h2{margin-bottom:6px}
 /* siapmakan / retort */
 .hv{width:min(230px,62vw)!important}
 .aio ul,.ret .ben ul{grid-template-columns:1fr 1fr!important;gap:10px!important;margin:18px 0 22px!important}
 .aio li,.ret .ben li{padding:13px!important;gap:5px!important;font-size:13px!important}
 .aio li b,.ret .ben li b{font-size:15px!important}
 .aio li span,.ret .ben li span{font-size:12.5px;line-height:1.35}
 .ret .pic{max-width:300px;margin:0 auto}
 .ret .ben{margin-top:26px!important}
 .ret .lead{font-size:15px!important}
 .stats{padding-bottom:22px!important}
 .stats b{font-size:22px!important}
 .stats li{font-size:13px}
 /* big decorative images */
 .rwrap img,.hero img{max-height:240px;width:auto;max-width:100%}
 /* footer */
 footer{padding-top:28px!important;padding-bottom:28px!important}

 .hero h1:has(em){font-size:clamp(30px,9vw,38px)!important;line-height:1.04!important}
 .stp .panel,.stp .pn,.panel{min-height:0!important}
 .stp .pn{padding:14px!important}
 .rail button{padding:10px 12px}
 .whos{gap:10px!important;margin-top:18px!important}
 .whos>div{padding:14px!important;flex-direction:row!important;align-items:center;gap:12px!important}
 .whos .ic{width:40px!important;height:40px!important;flex:none}
 .whos .ic svg{width:22px!important;height:22px!important}
 .whos h3{font-size:17px!important}
 .bgrid{display:flex!important;overflow-x:auto;gap:10px!important;margin:18px calc(var(--pad)*-1) 0!important;padding:0 var(--pad) 6px;scroll-snap-type:x mandatory;scrollbar-width:none}
 .bgrid::-webkit-scrollbar{display:none}
 .bgrid figure{flex:0 0 62%;scroll-snap-align:start}
 .bgrid .im{min-height:0!important;padding:10px!important}
 .bgrid img{max-height:190px!important}
 .logos{gap:10px!important}
 .logos div{min-height:0!important;padding:14px!important}
 .logos img{max-height:56px!important}
 .cert .seal{width:110px!important}
 .cert .seal b{font-size:28px!important}
 .izs li,.izin li{font-size:14px}
 footer p,footer li{font-size:14px}
 .calc .side{display:none!important}

 /* simpler + smaller */
 body{font-size:14.5px!important;line-height:1.42}
 .brandbar .bi{display:none!important}
 .brandbar small{display:none}
 .brandbar a{padding:13px 10px 11px!important;font-size:11.5px!important;letter-spacing:.05em!important}
 h2{font-size:clamp(21px,6.4vw,26px)!important}
 h3{font-size:clamp(16px,4.8vw,19px)!important}
 .lead,.hero p,p{font-size:14px!important;line-height:1.45}
 .hero h1{font-size:clamp(34px,11vw,44px)!important}
 .hero h1:has(em){font-size:clamp(26px,7.8vw,32px)!important}
 .btn{padding:10px 16px!important;font-size:14px!important}
 .tag{font-size:11px!important}
 .wrap{padding-top:28px!important;padding-bottom:28px!important}
 .tagf,.steam,.strip,.mq,.marq{display:none!important}
 .stats b{font-size:19px!important}
 li{font-size:14px}
 .stp .rail button .t,.how li,.how p{font-size:14px}
 footer,footer a,footer p{font-size:13px!important}

 /* hide secondary sections on phones */
 #isi,#fasilitas,.brands,.mkt,section:has(.whos),section:has(.bgrid){display:none!important}
 section.wrap:has(.vs),section.wrap:has(.cmp){display:none!important}
 #retort .pic,#retort .in:first-child .lead+.lead{display:none!important}
 #retort .in:first-child{display:block!important}

 /* RushUp tutorial: video first, compact steps */
 #cara .in{display:flex!important;flex-direction:column;gap:12px!important}
 #cara .in>div{display:contents}
 #cara h2{order:0;margin:0}
 #cara .lead{order:1;margin:0}
 #cara video{order:2;max-height:210px;object-fit:cover;border-radius:10px!important}
 #cara .steps{order:3;margin-top:4px!important}
 #cara .warn{order:4;padding:12px 14px!important;margin-top:4px}
 #cara .warn h3{margin:0 0 4px!important;font-size:14px!important}
 #cara .warn li{font-size:12.5px!important;margin:0 0 2px}
 .steps li{grid-template-columns:26px 1fr!important;padding:8px 0!important;gap:0 6px!important}
 .steps span{font-size:20px!important;grid-row:span 1!important}
 .steps strong{font-size:14px!important}
 .steps p{font-size:12.5px!important;line-height:1.35;grid-column:2}
 /* Fuuds calculator compact */
 #kalkulator .lead,#kalkulator .facts,#kalkulator .packs,#kalkulator .side,#kalkulator #fp{display:none!important}
 #kalkulator h2{margin:0 0 8px!important}
 #kalkulator .in{gap:10px!important}
 #kalkulator .cbox{padding:12px!important;border-radius:14px!important}
 #kalkulator .goals{display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important}
 #kalkulator .goals button{padding:8px 10px!important;font-size:13px!important;min-height:0!important}
 #kalkulator .goals small{display:none!important}
 #kalkulator .lb{font-size:11px!important;margin:6px 0 4px!important}
 #kalkulator .res{padding:10px 0 0!important;margin-top:8px!important}
 #kalkulator .big b{font-size:34px!important}
 #kalkulator .res p{font-size:12.5px!important;margin:4px 0!important}
 #kalkulator .rn{font-size:11px!important;line-height:1.35}

 /* RushUp quick steps: small */
 .claims{display:none!important}
 .trust li{padding:9px 12px!important;font-size:11.5px!important;line-height:1.3}
 .trust b{font-size:12.5px!important;line-height:1.15;margin-bottom:2px}
 .trust li:after{height:3px}
}