/* Fondo amazónico optimizado: textura vectorial estática, sin filtros ni animaciones. */
:root {
  --jungle-leaves: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='300' viewBox='0 0 420 300'%3E%3Cg fill='none' stroke='%23073f46' stroke-width='1.1' opacity='.32'%3E%3Cpath d='M-18 246C40 220 78 174 101 112M18 226c20-1 38 8 49 25M45 204c-1-19 6-36 21-50M66 178c20 2 34 13 43 30M82 148c-2-17 4-31 17-43'/%3E%3Cpath d='M286 324c1-80 30-147 87-202M310 265c-21-13-43-15-65-6M325 226c24-4 45 2 62 19M340 188c-16-17-36-25-59-24M361 151c18 3 34 13 47 29'/%3E%3Cpath d='M153 31c25 3 43 20 48 45-24 1-43-15-48-45Zm3 4 43 38M230 145c31-4 55 10 68 42-30 8-55-6-68-42Zm5 2 59 37M111 278c25-24 55-28 87-10-20 27-49 31-87 10Zm6-1 76-8'/%3E%3C/g%3E%3Cg fill='none' stroke='%23a77d3e' stroke-width='.8' opacity='.22'%3E%3Cpath d='M389 22c-28 17-45 41-49 73M376 35c-15-3-28 0-39 10M363 50c7 12 8 25 3 39M213 238c-9-32-2-60 21-84M220 216c13-2 24 2 33 11M225 192c-11-7-18-17-20-30'/%3E%3C/g%3E%3C/svg%3E");
}
body {
  background-color: #e9ece5 !important;
  background-image:
    radial-gradient(ellipse at 12% 18%, rgba(208,226,211,.12) 0 3%, transparent 3.4%),
    radial-gradient(ellipse at 84% 36%, rgba(209,180,115,.09) 0 2.6%, transparent 3%),
    radial-gradient(ellipse at 32% 72%, rgba(117,161,132,.1) 0 3.2%, transparent 3.6%),
    linear-gradient(rgba(7,50,52,.38),rgba(7,50,52,.38)),
    url('img/jungle-bg.jpg?v=1');
  background-position: 0 0, 0 0, 0 0, center top, center top;
  background-size: 310px 360px, 390px 430px, 470px 520px, cover, cover;
  background-repeat: repeat, repeat, repeat, no-repeat, no-repeat;
  background-attachment: scroll;
}

.intro,
.public-subdivisions,
.projects,
.public-video,
.contact {
  position: relative;
  z-index: 0;
}
.intro::before,
.public-subdivisions::before,
.projects::before,
.public-video::before,
.contact::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: var(--jungle-pattern-opacity, 1);
  background-image:
    var(--jungle-leaves),
    radial-gradient(ellipse at 18% 35%, rgba(52,105,83,.16) 0 2.5%, transparent 3.2%),
    radial-gradient(ellipse at 78% 68%, rgba(181,143,75,.14) 0 2.2%, transparent 3%);
  background-size: 420px 300px, 320px 370px, 390px 440px;
  background-repeat: repeat;
}
.intro { background-color: rgba(255,253,248,.88) !important; }
.public-subdivisions { background-color: rgba(244,242,236,.86) !important; }
.projects { background-color: rgba(247,244,237,.88) !important; }
.public-video { background-color: rgba(255,253,248,.89) !important; }
.contact {
  position: relative;
  background-color: rgba(238,232,220,.76) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.45), inset 0 -1px rgba(7,63,70,.08);
}
.contact > * { position: relative; z-index: 1; }
.public-subdivisions,
.projects { position: relative; overflow: hidden; }

/* Textura subida por el usuario (Contenido web): misma técnica que el patrón de hojas,
   pintada sobre el color propio de cada sección para que no quede tapada por su fondo opaco. */
.intro::after,
.public-subdivisions::after,
.projects::after,
.public-video::after,
.contact::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: var(--bg-texture-opacity, 0);
  background-image: none;
  background-size: 340px 340px;
  background-repeat: repeat;
}

/* Desactiva capas decorativas que generaban trabajo permanente de CPU/GPU. */
.hero,
.hero::before,
.hero::after,
.territory-live::before {
  animation: none !important;
  filter: none !important;
}
.hero::before,
.hero::after,
.territory-live::before { display: none !important; }

@media (max-width: 700px) {
  body {
    background-image:
      radial-gradient(ellipse at 15% 20%, rgba(208,226,211,.1) 0 3%, transparent 3.5%),
      radial-gradient(ellipse at 82% 65%, rgba(209,180,115,.08) 0 2.5%, transparent 3%),
      linear-gradient(rgba(7,50,52,.4),rgba(7,50,52,.4)),
      url('img/jungle-bg-mobile.jpg?v=1');
    background-size: 260px 320px, 360px 420px, cover, cover;
    background-repeat: repeat, repeat, no-repeat, no-repeat;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}
