/* KING COM 2027 · green brand layer over the Elementor build */
:root{--kc-bottle:#0F5132;--kc-deep:#0A2418;--kc-banana:#FFD400;--kc-glow:#3DDC84;--kc-ink:#0B0F0C}
/* buttons become banana: the one thing you click */
.elementor-button,.elementor-form .elementor-button,.e-form__buttons .elementor-button{background-color:var(--kc-banana)!important;color:var(--kc-deep)!important;box-shadow:0 10px 26px rgba(15,81,50,.28);transition:transform .35s cubic-bezier(.2,.9,.3,1.4),box-shadow .35s,background-color .3s!important}
.elementor-button .elementor-button-text,.elementor-button-icon svg{color:var(--kc-deep)!important;fill:var(--kc-deep)!important}
.elementor-button:hover{transform:translateY(-3px) scale(1.04);box-shadow:0 0 0 7px rgba(61,220,132,.25),0 18px 36px rgba(15,81,50,.35)}
.elementor-button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--kc-glow)!important;outline-offset:3px}
/* footer and dark bands: deep jungle */
footer .elementor-section,.elementor-location-footer .elementor-section[data-settings*="classic"]{background-color:var(--kc-deep)}
/* gorilla heads come alive on hover */
.elementor-widget-image-box img,.elementor-widget-image img{transition:transform .45s cubic-bezier(.2,.9,.3,1.3),filter .45s}
.elementor-widget-image-box:hover img{transform:translateY(-8px) rotate(-3deg) scale(1.05);filter:drop-shadow(0 16px 18px rgba(15,81,50,.35))}
/* hide Elementor's preloader transition, ours replaces it */
e-page-transition{display:none!important}
/* banana journey: scroll progress */
#kc-journey{position:fixed;inset-inline:0;top:0;height:4px;z-index:99998;pointer-events:none;background:rgba(15,81,50,.15)}
#kc-journey i{position:absolute;inset-block:0;inset-inline-start:0;width:0;background:linear-gradient(90deg,var(--kc-glow),var(--kc-banana))}
#kc-journey img{position:absolute;top:-9px;width:22px;height:auto;transform:translateX(50%) rotate(-30deg);inset-inline-start:0}
/* page transition */
#kc-tx{position:fixed;inset:0;z-index:99999;pointer-events:none;visibility:hidden}
#kc-tx .p{position:absolute;inset:0;background:var(--kc-bottle);transform:translateX(105%);will-change:transform}
#kc-tx .h{position:absolute;top:56%;left:0;width:min(620px,80vw);height:auto;transform:translate(-62%,-50%) scaleX(-1);filter:drop-shadow(0 20px 30px rgba(0,0,0,.35))}
#kc-tx .p::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 60% at 50% 50%,rgba(61,220,132,.22),transparent 70%)}
#kc-tx .c{position:absolute;left:50%;top:50%;width:min(260px,52vw);transform:translate(-50%,-50%) scale(.3);opacity:0;text-align:center}
#kc-tx .c img{width:100%;height:auto}
#kc-tx .c b{display:block;font-family:"Cabin Sketch","Secular One",cursive;color:#fff;font-size:clamp(34px,5vw,60px);line-height:1;margin-top:6px;letter-spacing:.02em}
#kc-tx.on{visibility:visible;pointer-events:auto}
#kc-tx.in .p{transition:transform .55s cubic-bezier(.7,0,.3,1);transform:translateX(0)}
#kc-tx.in .c{transition:transform .45s .35s cubic-bezier(.2,.9,.3,1.5),opacity .3s .35s;transform:translate(-50%,-50%) scale(1);opacity:1}
#kc-tx.cover .p{transform:translateX(0)}
#kc-tx.cover .c{transform:translate(-50%,-50%) scale(1);opacity:1}
#kc-tx.out .p{transition:transform .6s .15s cubic-bezier(.7,0,.3,1);transform:translateX(-110%)}
#kc-tx.out .c{transition:transform .35s,opacity .3s;transform:translate(-50%,-50%) scale(1.2);opacity:0}
/* WhatsApp roar button */
#kc-wa{position:fixed;z-index:99990;bottom:calc(18px + env(safe-area-inset-bottom,0px));left:calc(18px + env(safe-area-inset-left,0px));display:flex;align-items:center;gap:8px;background:var(--kc-bottle);color:#fff;font-family:"Secular One",sans-serif;font-size:15px;padding:10px 16px 10px 12px;border-radius:999px;box-shadow:0 12px 30px rgba(10,36,24,.35);text-decoration:none;transition:transform .3s cubic-bezier(.2,.9,.3,1.4)}
#kc-wa:hover{transform:translateY(-3px) scale(1.04);color:#fff}
#kc-wa svg{width:22px;height:22px;flex:none}
/* banana cursor */
#kc-cur{position:fixed;left:0;top:0;width:26px;z-index:99997;pointer-events:none;opacity:0;transition:opacity .2s}
@media (hover:none){#kc-cur{display:none}}
@media (prefers-reduced-motion:reduce){#kc-tx{display:none!important}.elementor-widget-image-box:hover img{transform:none}}

html.kc-arrive::after{content:"";position:fixed;inset:0;background:#0F5132;z-index:100000}
#kc-tx.in .h{animation:kcHand .85s cubic-bezier(.7,0,.3,1) forwards}
#kc-tx.cover .h,#kc-tx.out .h{opacity:0}
@keyframes kcHand{0%,55%{opacity:1}100%{opacity:0;margin-left:-14vw}}
