/* ORN — rangkaian bunga lukis: pojok section, bingkai foto, kelopak jatuh.
   Tiap rangkaian = 2 lapis gambar: .lf (daun/ranting) tumbuh dulu dari pojok, lalu .bl (bunga) mekar memantul + kilau cahaya.
   Setelah masuk: daun bergoyang lebar, bunga "bernapas" dengan tempo lain, seluruhnya melayang pelan. */
.hbq{isolation:isolate;clip-path:inset(-14px -100vw -100vh -100vw)}.hbf{position:relative}
.bq{position:absolute;z-index:-1;pointer-events:none;width:min(58vw,270px);aspect-ratio:1}
.bqi{position:relative;width:100%;height:100%;animation:bqf 8s ease-in-out var(--d,0s) infinite alternate}
.bq img,.bq .glow{position:absolute;left:-42.3%;top:-42.3%;width:153.8%;height:153.8%;max-width:none;display:block;opacity:0}
.bq img.lf{transform-origin:42.5% 42.5%}.bq img.bl{transform-origin:51% 51%}
.bq .glow{background:radial-gradient(circle at 51% 51%,#fffbe8 0,#ffe7b07a 9%,#ffd9a022 20%,#0000 32%);transform-origin:51% 51%}
.bq.in img.lf{animation:lfIn 1.6s cubic-bezier(.2,.8,.2,1) both,lfSw 6.5s ease-in-out 1.6s infinite alternate}
.bq.in img.bl{animation:blIn 1.4s cubic-bezier(.3,1.45,.5,1) .55s both,blBr 4.6s ease-in-out 1.95s infinite alternate}
.bq.in .glow{animation:glw 2s ease-out .75s both}
@keyframes lfIn{0%{opacity:0;scale:.12;rotate:-42deg}45%{opacity:1}100%{opacity:1;scale:1;rotate:0deg}}
@keyframes lfSw{0%{opacity:1;scale:1;rotate:0deg}100%{opacity:1;scale:1.035;rotate:3.5deg}}
@keyframes blIn{0%{opacity:0;scale:0;rotate:40deg}60%{opacity:1}100%{opacity:1;scale:1;rotate:0deg}}
@keyframes blBr{0%{opacity:1;scale:1;rotate:0deg;translate:0 0}100%{opacity:1;scale:1.06;rotate:2.5deg;translate:0 -4px}}
@keyframes glw{0%{opacity:0;scale:.3}30%{opacity:1}100%{opacity:0;scale:1.5}}
@keyframes bqf{from{translate:0 0}to{translate:0 -6px}}
/* posisi: pojok kiri-atas / kanan-atas section (dicerminkan) */
.bq.tl{left:-30px;top:-8px}
.bq.tr{right:-30px;top:-8px;transform:scaleX(-1)}
/* bingkai foto: kanan-atas & kiri-bawah */
.bq.fr{width:68%;right:-22%;top:-9%;transform:scaleX(-1);z-index:3}
.bq.fb{width:52%;left:-20%;bottom:-4%;transform:scaleY(-1);z-index:3}
.bq.hb{width:min(52vw,250px);right:-22px;bottom:-30px;transform:scale(-1,-1);z-index:1}
.orn-pt{position:fixed;left:0;top:0;width:100vw;height:max(100vh,100lvh);pointer-events:none;z-index:6;will-change:transform}
@media(prefers-reduced-motion:reduce){.bqi,.bq.in img,.bq.in .glow{animation:none!important}.bq img{opacity:1}}
/* ornamen flourish satu warna (ORN.orna) */
.orn{position:absolute;z-index:-1;pointer-events:none;width:min(54vw,240px);aspect-ratio:1;color:var(--orn-c,var(--gold,#a8844f))}
.orn svg{display:block;width:100%;height:100%;overflow:visible;transform-origin:0 0}
.orn.o-tl{left:6px;top:6px}.orn.o-tr{right:6px;top:6px;transform:scaleX(-1)}
.orn.o-fr{width:62%;right:-14%;top:-7%;transform:scaleX(-1);z-index:3}
.orn.o-fb{width:50%;left:-12%;bottom:-6%;transform:scaleY(-1);z-index:3}
.orn .mk path{stroke-dasharray:1 1;stroke-dashoffset:1}
.orn.in .mk path{animation:odraw var(--du) cubic-bezier(.45,.1,.3,1) var(--dl) forwards}
@keyframes odraw{to{stroke-dashoffset:0}}
.orn .ol,.orn .of{transform-box:view-box;opacity:0}
.orn .ofs{transform-box:fill-box;transform-origin:50% 50%}
.orn.in .ol{animation:opop .7s cubic-bezier(.3,1.6,.5,1) var(--dl) both}
.orn.in .of{animation:obl 1.2s cubic-bezier(.3,1.45,.5,1) var(--dl) both}
.orn.in .ofs{animation:ospin 18s linear 3s infinite}
.orn.in svg{animation:osw 7s ease-in-out 3s infinite alternate}
@keyframes opop{from{opacity:0;scale:0}to{opacity:1;scale:1}}
@keyframes obl{from{opacity:0;scale:0;rotate:-70deg}to{opacity:1;scale:1;rotate:0deg}}
@keyframes ospin{to{rotate:360deg}}
@keyframes osw{from{rotate:-1.2deg}to{rotate:1.6deg}}
@media(prefers-reduced-motion:reduce){.orn .mk path{stroke-dashoffset:0;animation:none}.orn .ol,.orn .of{opacity:1;animation:none}.orn svg,.orn .ofs{animation:none}}
.orn{width:min(48vw,210px)}
.has-orn{padding-top:clamp(140px,40vw,175px)!important}