/* Gorilla Gardening – offline landing page. Layout matches the live Elementor page. */
:root{--dark:#12353d;--green:#53be95}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:#fff}
img{max-width:100%;height:auto;vertical-align:middle}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Full-screen hero with photo + dark gradient overlay */
.hero{position:relative;min-height:100vh;overflow:hidden;display:flex;align-items:center;background:var(--dark) url(../images/background.webp) center/cover no-repeat}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#12353d00 0%,var(--dark) 57%);opacity:.8;mix-blend-mode:multiply}
.hero__content{position:relative;width:100%;padding:10px;text-align:center}

/* Gorilla + blurred shadow, overlapping the top of the circle */
.monkey{position:absolute;top:0;left:0;right:0;z-index:1}
.monkey--shadow{padding:9px 0 0 21px}
.monkey--shadow img{opacity:.65;filter:brightness(0) blur(7.7px)}
.monkey img{width:355px}
.circle{width:505px;max-width:100%;aspect-ratio:1;margin:54px auto 0;border-radius:50%;background:var(--dark)}
.logo{display:block;width:691px;margin:55px auto 0}

.social{display:flex;justify-content:center;gap:11px;margin:29px 0 0;padding:0;list-style:none}
.social a{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10%;background:var(--green);color:#fff}
.social svg{height:18px;width:auto;fill:currentColor}

@media (max-width:1250px){
  .monkey img{width:211px}
  .circle{width:307px;margin-top:26px}
  .logo{width:607px}
}
@media (max-width:767px){
  .monkey img{width:175px}
  .circle{width:241px}
  .logo{width:275px}
}

/* Entrance animations (Elementor "slow" = 2s) */
.anim{animation-duration:2s;animation-fill-mode:both}
.fade-in{animation-name:fadeIn}
.zoom-in{animation-name:zoomIn}
.fade-in-up{animation-name:fadeInUp}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes zoomIn{from{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}
@keyframes fadeInUp{from{opacity:0;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.anim{animation:none}}