@font-face{font-family:Nunito;font-weight:500 800;font-display:swap;src:url(/fonts/nunito-latin.woff2)format("woff2")}@font-face{font-family:Playpen Sans;font-weight:500 800;font-display:swap;src:url(/fonts/playpen-sans-latin.woff2)format("woff2")}:root{--canvas:#fffaf2;--stone:#f1ebe1;--graphite:#4a4744;--midnight:#1f1b16;--ash:#6f6a64;--blue:#49bddf;--blue-ink:#0e7599;--blue-soft:#dff3fb;--yellow:#fcd535;--yellow-ink:#8a6500;--yellow-soft:#fff3c4;--yellow-edge:#d9ab00;--pink:#ff6fb1;--pink-ink:#b8185f;--pink-soft:#ffe3f0;--green:#2fcf6b;--green-ink:#15803d;--green-soft:#ddf8e6;--violet:#a468ff;--violet-ink:#6d28d9;--violet-soft:#efe4ff;--orange:#ff7a45;--orange-ink:#c2410c;--orange-soft:#ffe7dc;--display:"Playpen Sans", "Nunito", system-ui, sans-serif;--ui:"Nunito", system-ui, sans-serif;--r:20px;--r-lg:32px;--bounce:cubic-bezier(.34, 1.56, .64, 1);--t:.22s var(--bounce)}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;scroll-padding-top:76px}body{font:600 16px/1.55 var(--ui);color:var(--graphite);background:var(--canvas) radial-gradient(#eadfcd 1.3px, transparent 1.6px) 0 0 / 26px 26px;overflow-x:hidden}img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}a,button,summary{cursor:pointer;transition:color var(--t), background var(--t), transform var(--t), box-shadow var(--t)}:focus-visible{outline:3px dashed var(--pink);outline-offset:4px;border-radius:8px}.wrap{width:min(1200px,100% - 32px);margin-inline:auto}section{padding-block:clamp(64px,9vw,110px);position:relative}.title{font:700 clamp(30px, 4.2vw, 46px)/1.15 var(--display);letter-spacing:-.02em;color:var(--blue-ink);text-align:center}.title:after{content:"";background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 130 16'%3E%3Cpath d='M3 10c12-8 20-8 30 0s20 8 30 0 20-8 30 0 20 8 34-2' fill='none' stroke='%23fcd535' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") 50%/contain no-repeat;width:130px;height:16px;margin:10px auto 0;display:block}.btn-donasi{background:var(--yellow);color:var(--midnight);font:700 15px var(--display);border:2.5px solid var(--midnight);box-shadow:0 4px 0 var(--midnight);border-radius:999px;align-items:center;gap:8px;padding:8px 22px;display:inline-flex}.btn-donasi:hover{box-shadow:0 6px 0 var(--midnight);background:#ffe05a;transform:translateY(-2px)rotate(-2deg)}.btn-donasi:active{box-shadow:0 1px 0 var(--midnight);transform:translateY(3px)}.btn-lg{margin-top:32px;padding:14px 32px;font-size:18px}.nav{z-index:50;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:2.5px dashed var(--stone);background:#fffaf2e0;position:sticky;top:0}.nav-in{justify-content:space-between;align-items:center;gap:16px;height:76px;display:flex}.logo{font:800 24px var(--display);color:var(--blue-ink);letter-spacing:-.02em}.logo span{color:var(--pink)}.logo:hover{transform:rotate(-3deg)scale(1.04)}.nav nav{font:600 15px var(--display);color:var(--midnight);align-items:center;gap:clamp(8px,2vw,16px);display:flex}.nav nav a:not(.btn-donasi){border-radius:999px;padding:6px 14px}.nav nav a:first-child:hover{background:var(--blue-soft);color:var(--blue-ink)}.nav nav a:nth-child(2):hover{background:var(--pink-soft);color:var(--pink-ink)}.nav nav a:nth-child(3):hover{background:var(--green-soft);color:var(--green-ink)}.nav nav a:nth-child(4):hover{background:var(--violet-soft);color:var(--violet-ink)}.hero{padding-block:clamp(40px,6vw,80px) clamp(48px,6vw,72px)}.hero-in{grid-template-columns:1.1fr 1fr;align-items:center;gap:clamp(40px,6vw,80px);display:grid}.hero h1{font:800 clamp(38px, 4.8vw, 64px)/1.12 var(--display);letter-spacing:-.03em;color:var(--midnight)}.hl{color:var(--pink);white-space:nowrap;position:relative}.hl:after{content:"";background:var(--yellow);z-index:-1;border-radius:999px;height:.32em;position:absolute;bottom:.02em;left:-4px;right:-4px;transform:rotate(-1.5deg)}.hero p{color:var(--graphite);margin-top:20px;font-size:clamp(17px,1.6vw,20px);line-height:1.5}.hero-art{padding:20px;position:relative}.hero-art:before{content:"";background:var(--yellow);border-radius:42% 58% 55% 45%/52% 44% 56% 48%;position:absolute;inset:4% -2% -2% 6%;transform:rotate(6deg)}.hero-img{aspect-ratio:4/3.5;object-fit:cover;object-position:35% 40%;border:6px solid #fff;border-radius:58% 42% 48% 52%/46% 54%;width:100%;position:relative;box-shadow:0 18px 40px #1f1b161f}.hero-art{padding-right:18%}.ig-phone{z-index:2;filter:drop-shadow(0 18px 24px #1f1b1640);width:34%;transition:transform .6s var(--bounce), rotate .6s var(--bounce), filter .6s ease;position:absolute;bottom:-4%;right:0;rotate:7deg}.ig-phone:hover{filter:drop-shadow(0 28px 32px #1f1b164d);transform:translateY(-12px)scale(1.04)rotate(2deg)}.ig-phone img{width:100%}.doodle{stroke:currentColor;fill:none;width:clamp(34px,4vw,54px);animation:4s ease-in-out infinite float;position:absolute}.dg1{color:var(--orange);fill:var(--yellow);animation-delay:-1s;top:-2%;left:2%}.dg2{color:var(--pink);fill:var(--pink-soft);width:clamp(40px,5vw,64px);animation-delay:-2s;bottom:6%;left:-4%}.dg3{color:var(--orange);width:clamp(46px,5.5vw,72px);animation:14s linear infinite spin;top:-6%;right:8%}.dg4{color:var(--green);stroke-width:2.4px;width:clamp(60px,7vw,96px);animation-delay:-3s;bottom:-4%;right:10%}.dg5{color:var(--blue);animation-delay:-1.5s;top:40%;right:-5%}@keyframes float{0%,to{transform:translateY(0)rotate(-6deg)}50%{transform:translateY(-10px)rotate(6deg)}}@keyframes spin{to{transform:rotate(360deg)}}:root{--toys-h:clamp(170px, 15vw, 220px)}.toys{z-index:3;height:var(--toys-h);margin-top:8px;margin-bottom:calc(-1 * var(--toys-h));pointer-events:none;position:relative;overflow:hidden}.toys:before{content:"";background:var(--canvas) radial-gradient(#eadfcd 1.3px, transparent 1.6px) 0 0 / 26px 26px;border-radius:0 0 50% 50%/0 0 40px 40px;height:60px;position:absolute;inset:0 0 auto}.rope{width:100%;height:50px;position:absolute;inset:0 0 auto;overflow:visible}.rope path{fill:none;stroke:#a47c52;stroke-width:3px;vector-effect:non-scaling-stroke}.flag{left:calc(var(--x) * 100%);top:calc(var(--y) * 1px);aspect-ratio:1;width:clamp(16px,2.4vw,30px);translate:-50%;rotate:calc((1 - 2 * var(--x)) * 8deg);clip-path:polygon(0 0,100% 0,50% 90%);background:var(--yellow);position:absolute}.flag:nth-of-type(3n+2){background:var(--pink)}.flag:nth-of-type(3n){background:var(--blue)}.toys img{z-index:1;pointer-events:auto;left:calc(var(--x) * 100%);top:calc(var(--y) * 1px);transform-origin:37% 0;width:clamp(64px,10vw,150px);animation:2.4s ease-in-out infinite swing;position:absolute;translate:-37%}.toys img:nth-of-type(2n){animation-delay:-1.2s}.toys img:hover{animation-duration:.5s}@keyframes swing{0%,to{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}.tahukah:after,.footer:before{content:"";z-index:1;background:radial-gradient(circle at 22px 0, var(--canvas) 21px, transparent 22px) 0 0 / 44px 22px repeat-x;height:22px;position:absolute;left:0;right:0}.footer:before{top:0}.tahukah:after{bottom:0;transform:scaleY(-1)}.tahukah{padding-top:calc(var(--toys-h) - 24px);color:#fff;background:url(/images/tahukah-bg.jpg) 50%/cover;overflow:hidden}.tahukah h2{text-align:center;font:800 clamp(30px, 4.2vw, 46px)/1.15 var(--display);letter-spacing:-.02em;margin-bottom:28px}.tahukah h2:after{content:"";background:repeating-linear-gradient(90deg, var(--yellow) 0 18px, var(--pink) 18px 36px, var(--green) 36px 54px, var(--blue) 54px 72px);border-radius:999px;width:110px;height:8px;margin:12px auto 0;display:block}.facts{z-index:2;grid-template-columns:1fr 1.4fr 1fr;grid-template-areas:"a c b""d c e";align-items:center;gap:28px 24px;width:min(980px,100% - 32px);margin-inline:auto;display:grid;position:relative}.facts p{text-align:center;border-radius:var(--r);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:transform var(--t);background:#ffffff1a;border:2.5px dashed #ffffff59;padding:22px 20px;font-size:15px;line-height:1.6}.facts p:hover{transform:scale(1.04)rotate(-1deg)}.facts p:first-of-type{grid-area:a;rotate:-2deg}.facts p:nth-of-type(2){grid-area:b;rotate:2deg}.facts p:nth-of-type(3){grid-area:d;rotate:1.5deg}.facts p:nth-of-type(4){grid-area:e;rotate:-1.5deg}.facts b{color:var(--yellow);font:800 1.15em var(--display)}.facts .center{grid-area:c;width:100%;animation:5s ease-in-out infinite float}.deco{z-index:2;width:clamp(70px,8vw,110px);animation:4.5s ease-in-out infinite float;position:absolute}.d1{top:calc(var(--toys-h) + 24px);left:3%}.d2{top:calc(var(--toys-h) + 32px);animation-delay:-1.5s;right:3%}.d3{animation-delay:-3s;bottom:44px;left:2%}.d4{width:clamp(80px,10vw,140px);animation-delay:-2s;bottom:32px;right:2%}.matahari{pointer-events:none;width:clamp(110px,14vw,200px);animation:6s ease-in-out infinite float;position:absolute;top:20px;left:0}.kat-grid{grid-template-columns:repeat(4,1fr);gap:28px;width:min(1000px,100% - 32px);margin-top:56px;display:grid}.kat{--bg:var(--yellow-soft);--ink:var(--yellow-ink);--edge:var(--yellow);border-radius:var(--r-lg);background:var(--bg);border:3px solid var(--edge);box-shadow:0 6px 0 var(--edge);font:800 clamp(19px, 1.9vw, 24px) var(--display);color:var(--ink);justify-items:center;gap:14px;padding:28px 16px 24px;display:grid;rotate:-2deg}.kat:nth-child(2){--bg:var(--pink-soft);--ink:var(--pink-ink);--edge:var(--pink);rotate:2deg}.kat:nth-child(3){--bg:var(--green-soft);--ink:var(--green-ink);--edge:var(--green);rotate:-1.5deg}.kat:nth-child(4){--bg:var(--violet-soft);--ink:var(--violet-ink);--edge:var(--violet);rotate:2.5deg}.kat img{width:min(140px,100%);transition:transform var(--t);border:5px solid #fff;border-radius:50%}.kat:hover{box-shadow:0 12px 0 var(--edge);transform:translateY(-8px)scale(1.04)rotate(0)}.kat:hover img{animation:.5s ease-in-out wiggle}@keyframes wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-10deg)}75%{transform:rotate(10deg)}}.berita{background:var(--blue-soft)}.berita:before,.berita:after{content:"";background:radial-gradient(circle at 22px 0, var(--canvas) 21px, transparent 22px) 0 0 / 44px 22px repeat-x;height:22px;position:absolute;left:0;right:0}.berita:before{top:0}.berita:after{bottom:0;transform:scaleY(-1)}.berita-grid{grid-template-columns:repeat(3,1fr);gap:32px;margin-top:56px;display:grid}.card{border-radius:var(--r);transition:transform var(--t), rotate var(--t), box-shadow var(--t);background:#fff;flex-direction:column;align-items:flex-start;padding:14px 14px 26px;display:flex;position:relative;rotate:-1.5deg;box-shadow:0 10px 24px #0e75991f}.card:nth-child(2){rotate:1.2deg}.card:nth-child(3){rotate:-.8deg}.card:before{content:"";background:#fcd535bf;border-radius:3px;width:90px;height:26px;position:absolute;top:-12px;left:50%;translate:-50%;rotate:-4deg}.card:nth-child(2):before{background:#ff6fb199;rotate:3deg}.card:nth-child(3):before{background:#2fcf6b8c}.card:hover{transform:translateY(-6px);box-shadow:0 18px 36px #0e75992e}.card img{aspect-ratio:3/2;object-fit:cover;border-radius:14px;width:100%}.card>:not(img){margin-inline:8px}.date{background:var(--yellow-soft);color:var(--yellow-ink);border-radius:999px;margin-top:18px;padding:4px 12px;font-size:12px;font-weight:800}.card:nth-child(2) .date{background:var(--pink-soft);color:var(--pink-ink)}.card:nth-child(3) .date{background:var(--green-soft);color:var(--green-ink)}.card h3{font:700 19px/1.3 var(--display);color:var(--midnight);margin-top:12px}.card p{color:var(--ash);margin-top:8px;font-size:14px;line-height:1.55}.more{font:700 14px var(--display);color:var(--blue-ink);border-bottom:2.5px dashed;align-items:center;gap:6px;margin-top:16px;padding-bottom:2px;display:inline-flex}.more:hover{color:var(--pink-ink);gap:10px}.steps{grid-template-columns:repeat(4,1fr);gap:clamp(32px,5vw,64px);margin-top:56px;list-style:none;display:grid}.step{justify-items:center;gap:18px;display:grid;position:relative}.step:not(:last-child):after{content:"";background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 16'%3E%3Cpath d='M2 8h28' stroke='%230e7599' stroke-width='3' stroke-dasharray='5 4' stroke-linecap='round'/%3E%3Cpath d='M28 2l9 6-9 6z' fill='%230e7599'/%3E%3C/svg%3E") 50%/contain no-repeat;width:clamp(24px,3.4vw,40px);height:16px;position:absolute;top:42%;left:calc(100% + clamp(4px,.8vw,12px))}.step-card{aspect-ratio:1;border-radius:var(--r-lg);border:3px solid var(--midnight);width:100%;box-shadow:0 6px 0 var(--midnight);transition:transform var(--t), rotate var(--t), box-shadow var(--t);background:var(--blue) radial-gradient(#ffffff40 2px, transparent 2.5px) 0 0 / 22px 22px;place-items:center;display:grid;position:relative;rotate:-2deg}.step:nth-child(2n) .step-card{rotate:2deg}.step-card img{width:82%}.step:hover .step-card{box-shadow:0 12px 0 var(--midnight);transform:translateY(-6px)}.step:hover .step-card img{animation:.5s ease-in-out wiggle}.step-num{background:var(--yellow);width:44px;height:44px;color:var(--midnight);border:3px solid var(--midnight);font:800 20px var(--display);border-radius:50%;place-items:center;display:grid;position:absolute;top:-16px;left:-16px}.step-label{font:800 clamp(18px, 1.9vw, 22px) var(--display);color:var(--blue-ink)}.tabs{border:2.5px solid var(--midnight);width:fit-content;box-shadow:0 4px 0 var(--midnight);background:#fff;border-radius:999px;gap:6px;margin:28px auto 32px;padding:6px;display:flex}.tabs button{font:700 15px var(--display);color:var(--ash);background:0 0;border:0;border-radius:999px;padding:8px 22px}.tabs button.on{background:var(--yellow);color:var(--midnight)}.tabs button:not(.on):hover{background:var(--blue-soft);color:var(--blue-ink)}.panel{border-radius:var(--r-lg);border:3px solid var(--midnight);width:min(1000px,100%);box-shadow:0 8px 0 var(--midnight);background:var(--blue) radial-gradient(#ffffff59 2.5px, transparent 3px) 0 0 / 28px 28px;grid-template-columns:.8fr 1.2fr;align-items:center;gap:clamp(20px,4vw,48px);margin-inline:auto;padding:clamp(20px,4vw,44px);display:grid}.panel-intro{color:#fff}.panel-intro img{width:clamp(110px,14vw,170px);margin-bottom:12px;animation:5s ease-in-out infinite float}.panel-intro h3{font:800 clamp(22px, 2.4vw, 28px)/1.2 var(--display);text-shadow:2px 2px 0 var(--midnight), -1px -1px 0 var(--midnight), 1px -1px 0 var(--midnight), -1px 1px 0 var(--midnight)}.panel-intro p{color:#0a3345;margin-top:12px;font-size:16px;font-weight:700;line-height:1.55}.form{border-radius:var(--r);border:3px solid var(--midnight);background:#fff;grid-template-columns:1fr 1fr;gap:16px;padding:clamp(18px,3vw,28px);display:grid;rotate:.6deg}.field{border:0;gap:6px;min-width:0;display:grid}.field.full,.form .full{grid-column:1/-1}.field-label{font:700 14px var(--display);color:var(--midnight);padding:0}.field-label small{font:600 12px var(--ui);color:var(--ash);margin-left:6px}.field input,.field textarea{width:100%;font:600 15px var(--ui);color:var(--midnight);background:var(--canvas);transition:border-color var(--t), box-shadow var(--t), background var(--t);resize:vertical;border:2px solid #ddd5c8;border-radius:12px;padding:10px 14px}.field input::placeholder,.field textarea::placeholder{color:#a39d95}.field input:focus,.field textarea:focus{border-color:var(--blue-ink);box-shadow:0 0 0 4px var(--blue-soft);background:#fff;outline:none}:is(.field input:user-invalid,.field textarea:user-invalid){border-color:var(--pink-ink);box-shadow:0 0 0 4px var(--pink-soft)}.chips{flex-wrap:wrap;gap:8px;margin-top:6px;display:flex}.chip input{opacity:0;width:1px;height:1px;position:absolute}.chip span{cursor:pointer;background:var(--canvas);font:700 14px var(--ui);color:var(--graphite);transition:background var(--t), border-color var(--t), transform var(--t);border:2px solid #ddd5c8;border-radius:999px;padding:7px 16px;display:inline-block}.chip span:hover{border-color:var(--blue);transform:translateY(-2px)}.chip input:checked+span{background:var(--yellow);border-color:var(--midnight);color:var(--midnight);box-shadow:0 3px 0 var(--midnight)}.chip input:disabled+span{cursor:not-allowed;background:var(--stone);color:#9a938a;border-style:dashed;transform:none}.chip span small{background:var(--orange-soft);color:var(--orange-ink);border-radius:999px;margin-left:6px;padding:1px 7px;font-size:11px;font-weight:800}.chip input:focus-visible+span{outline:3px dashed var(--pink);outline-offset:3px}.form .btn-donasi{justify-content:center;margin-top:4px;padding:12px 22px;font-size:16px}.form.sent{justify-items:start;gap:10px;display:grid}.sent-title{font:800 24px var(--display);color:var(--green-ink)}.btn-ghost{border:2px solid var(--midnight);font:700 14px var(--display);background:#fff;border-radius:999px;padding:8px 18px}.btn-ghost:hover{background:var(--blue-soft)}.faq{padding-top:0}.sub{text-align:center;color:var(--ash);margin-top:10px;font-size:18px}.faq-list{gap:16px;width:min(820px,100% - 32px);margin-top:44px;display:grid}details{--edge:var(--blue);border-radius:var(--r);border:2.5px solid var(--edge);box-shadow:0 5px 0 var(--edge);transition:transform var(--t);background:#fff;padding:18px 24px}details:nth-child(2){--edge:var(--pink)}details:nth-child(3){--edge:var(--green)}details:hover{transform:translateY(-2px)}summary{font:700 17px var(--display);color:var(--midnight);justify-content:space-between;align-items:center;gap:12px;list-style:none;display:flex}summary::-webkit-details-marker{display:none}.chev{background:var(--edge);color:#fff;width:34px;height:34px;transition:transform var(--t);border-radius:50%;flex:none;padding:8px}details[open] .chev{transform:rotate(180deg)}details p{color:var(--graphite);margin-top:12px;font-size:15px;line-height:1.6}:root{interpolate-size:allow-keywords}details::details-content{opacity:0;block-size:0;transition:block-size .4s ease, opacity .3s ease, content-visibility .4s allow-discrete;overflow:hidden}details[open]::details-content{opacity:1;block-size:auto}.footer{color:#fff;text-align:center;background:linear-gradient(#0b4f6999,#0b4f6999),url(/images/footer-bg.jpg) 50%/cover;justify-items:center;gap:24px;padding:64px 16px 24px;display:grid;position:relative}.footer .logo{color:var(--yellow);font-size:30px}.footer .logo span{color:#fff}.footer nav{font:600 16px var(--display);flex-wrap:wrap;justify-content:center;gap:12px clamp(24px,6vw,72px);display:flex}.footer nav a:hover{color:var(--yellow);transform:rotate(-4deg)}.soc{gap:14px;display:flex}.soc a{width:44px;height:44px;color:var(--midnight);background:var(--yellow);border:2.5px solid var(--midnight);box-shadow:0 3px 0 var(--midnight);border-radius:50%;place-items:center;display:grid}.soc a:nth-child(2){background:var(--pink)}.soc a:nth-child(3){background:var(--green)}.soc a:hover{transform:translateY(-3px)rotate(-8deg)}.footer small{opacity:.85;font-size:13px}@media (width<=900px){.hero-in{grid-template-columns:1fr}.hero-art{width:min(560px,100%);margin-inline:auto}.hero-img{aspect-ratio:3/2}.facts{grid-template-columns:1fr 1fr;grid-template-areas:"c c""a b""d e"}.facts .center{width:min(360px,100%);margin-inline:auto}.deco{display:none}.berita-grid{grid-template-columns:1fr 1fr}.card:last-child:nth-child(odd){grid-column:1/-1;justify-self:center;width:calc(50% - 16px)}.steps{gap:20px}.step:not(:last-child):after{display:none}.step-num{width:38px;height:38px;font-size:17px;top:-12px;left:-8px}.panel{grid-template-columns:1fr}.panel-intro{text-align:center;max-width:520px;margin-inline:auto}.panel-intro img{margin-inline:auto}.form{width:min(620px,100%);margin-inline:auto}}@media (width<=640px){.nav-in{height:64px}.nav nav a:not(.btn-donasi),.hero p br{display:none}:root{--toys-h:150px}.toys img{width:19vw}.kat-grid{grid-template-columns:repeat(2,1fr);gap:20px;margin-top:44px}.matahari{width:90px;top:0}.berita-grid{grid-template-columns:1fr;max-width:440px}.card:last-child:nth-child(odd){grid-column:auto;width:auto}.steps{grid-template-columns:repeat(2,1fr);gap:36px 24px}details{padding:16px 18px}}@media (width<=480px){.facts{grid-template-columns:1fr;grid-template-areas:"c""a""b""d""e"}.kat{padding:18px 10px}.form{grid-template-columns:1fr;rotate:0deg}.doodle{width:32px}.tabs button{padding:8px 16px;font-size:14px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}html{scroll-behavior:auto}}