/* =====================================================================
   Fondos por sección · kit Indera Tradición v3.4 (06-Fondos, 04-Ilustraciones)
   v2: menos carga. Secciones 02 y 03 comparten UN solo paisaje continuo:
   arriba solo cielo, y los cerros aparecen detrás del «1500».
   El fondo va en ::before, detrás del contenido (isolation: isolate).
   ===================================================================== */
#portales, #seccion-terroir, #curva-tueste, #tostaduria, #seccion-percha, #sedes, body > footer {
  position: relative; isolation: isolate;
}
#portales::before, #seccion-terroir::before, #curva-tueste::before, #tostaduria::before,
#seccion-percha::before, #sedes::before, body > footer::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  opacity: var(--fondo-op, 1); background-repeat: no-repeat; background-size: cover;
}

/* 02 + 03 · un solo cielo continuo: la 02 es solo cielo y los cerros
   aparecen abajo de la 03, detrás del «1500», y se apagan hacia la noche de la 04 */
#portales, #seccion-terroir { background: #F8F1E0 !important; }
#seccion-terroir { border-top: 0 !important; }
#portales::before { display: none; }
#seccion-terroir::before {
  background: #F8F1E0 url(/fondos/terroir-amanecer.webp) center bottom / 100% auto no-repeat;
  opacity: .62; filter: saturate(.6);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, transparent 25%, #000 60%);
          mask-image: linear-gradient(to bottom, transparent 0%, transparent 25%, #000 60%);
}
#seccion-terroir::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 140px; z-index: -1; pointer-events: none;
  background: linear-gradient(to bottom, rgba(21,17,0,0), #151100); }
#seccion-terroir + div { background: #151100 !important; height: 40px !important; }

/* 04 · Curva de tueste: casi negro, con rayos verde oliva apenas visibles */
#curva-tueste::before { background-image: linear-gradient(rgba(21,17,0,.62), rgba(21,17,0,.62)), url(/fondos/curva-verde-rayos.webp); background-position: center 75%; filter: saturate(.8); }

/* 05 · Tostaduría: el mismo verde, más profundo */
#tostaduria::before { background-image: linear-gradient(rgba(21,17,0,.66), rgba(21,17,0,.74)), url(/fondos/tostaduria-verde.webp); background-position: center; filter: saturate(.8); }

/* 06 · Catálogo: papel con surcos topográficos, suave */
#seccion-percha { --fondo-op: .5; }
#seccion-percha::before { background-image: url(/fondos/percha-surcos.webp); background-position: center top; }

/* 07 · Sedes: cielo claro y la panorámica de Loja y El Cisne al pie */
#sedes { padding-bottom: calc(80px + 12.8vw) !important; }
#sedes::before { --fondo-op: .4; background-image: linear-gradient(to bottom, #FAF7F2 0%, rgba(250,247,242,0) 60%), url(/fondos/sedes-amanecer.webp); background-position: center 85%; filter: saturate(.7); }
#sedes::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 12.8vw; z-index: -1; pointer-events: none;
  background: url(/fondos/sedes-panorama.webp) center bottom / 100% auto no-repeat; opacity: .92; }

/* Pie */
body > footer::before { background-image: linear-gradient(rgba(21,17,0,.7), rgba(21,17,0,.7)), url(/fondos/pie-verde.webp); background-position: center; }

/* las curvas de nivel de la 03 ya no cortan el cielo con la 02 */
#seccion-terroir .terroir-contour-overlay { opacity: .14 !important;
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 45%); mask-image: linear-gradient(to bottom, transparent, #000 45%); }
