/* =====================================================================
   /activitati/ decorative layers (generated by _build/decor/activitati.py)
   Every layer sits in an absolutely positioned .dz-act wrapper, behind the
   section content, clipped to its own section.
   ===================================================================== */
.dz-act { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.dz-act svg { position: absolute; display: block; pointer-events: none; }

.activities > .container,
.pmosaic--dark > .container,
.around > .container,
.cta-band > .container { position: relative; z-index: 1; }

/* ---------- page intro: pale ridges melting into the cream section ---------- */
.page-intro .dz-act-intro { z-index: -1; top: auto; height: clamp(120px, 17vw, 240px); }
.dz-act-intro__ridges {
  -webkit-mask-image: linear-gradient(90deg, #000 0, #000 22%, transparent 30%, transparent 70%, #000 78%, #000 100%);
          mask-image: linear-gradient(90deg, #000 0, #000 22%, transparent 30%, transparent 70%, #000 78%, #000 100%); }
.dz-act-intro__ridges { left: 0; bottom: -1px; width: 100%; height: 100%; }
.dz-act-intro__front { left: 0; bottom: -1px; width: 100%; height: clamp(22px, 3.4vw, 50px); }

/* ---------- activities (cream) ---------- */
.dz-act-acts__lake { top: clamp(60px, 7vw, 110px); right: max(-20px, calc(50% - 680px)); width: clamp(280px, 30vw, 440px); height: auto; aspect-ratio: 420 / 200; }
.dz-act-acts__topo { left: -120px; bottom: calc(var(--sec) + var(--ridge) - 40px); width: clamp(220px, 24vw, 360px); height: auto; aspect-ratio: 1; }
.dz-act-acts__sprig { left: max(-14px, calc(50% - 760px)); top: 18px; width: clamp(70px, 7vw, 110px); height: auto; aspect-ratio: 150 / 220; opacity: .28; transform: rotate(-8deg); }
.dz-act-acts__band { left: 0; bottom: 0; width: 100%; height: calc(var(--sec) + var(--ridge) - 16px); }

/* ---------- photo mosaic (dark) ---------- */
.dz-act-pm__sky { top: calc(var(--ridge) + 10px); right: max(0px, calc(50% - 640px)); width: clamp(260px, 42vw, 600px); height: auto; aspect-ratio: 600 / 260; }
.dz-act-pm__topo { top: 0; right: -120px; width: min(900px, 80vw); height: 100%; }
.dz-act-pm__band { left: 0; bottom: 0; width: 100%; height: calc(var(--sec) + var(--ridge) - 16px); }

/* ---------- around: topographic map ---------- */
.dz-act-around__map { top: clamp(30px, 3vw, 50px); right: max(0px, calc(50% - 700px)); width: min(520px, calc(100% - 920px)); height: auto; aspect-ratio: 560 / 460; }
.dz-act-around__rose { top: clamp(50px, 5vw, 90px); right: max(16px, calc(50% - 620px)); width: clamp(110px, 11vw, 170px); height: auto; aspect-ratio: 160 / 175; }
.dz-act-line { fill: none; stroke: #c99a5b; stroke-width: 1; opacity: .7; }
.dz-act-line .fill { fill: #c99a5b; fill-opacity: .35; stroke: none; }
.dz-act-around__band { left: 0; bottom: 0; width: 100%; height: calc(var(--sec) + var(--ridge) - 10px); }

/* ---------- CTA band (dark) ---------- */
.dz-act-cta__sky { left: 0; top: 0; width: 100%; height: 55%; }
.dz-act-cta__band { left: 0; bottom: 0; width: 100%; height: calc(var(--band) + var(--ridge) * 1.5 + 10px); }

/* ---------- small screens: keep corners clear of text ---------- */
@media (max-width: 1100px) {
  .dz-act .dz-act-intro__ridges { display: none; }
  .dz-act-acts__lake { top: 6px; right: -40px; width: 230px; opacity: .45; }
  .dz-act .dz-act-around__map { display: none; }
}
@media (max-width: 760px) {
  .dz-act-acts__lake { width: 190px; }
  .dz-act .dz-act-acts__sprig, .dz-act .dz-act-acts__topo { display: none; }
  .dz-act-intro__front { height: 16px; }
  .dz-act-cta__band { height: calc(var(--band) + var(--ridge) - 6px); }
  .dz-act-pm__sky { top: calc(var(--ridge) - 6px); width: 240px; }
  .dz-act-around__rose { top: 14px; right: 10px; width: 64px; }
}

/* ---------- motion ---------- */
@media (prefers-reduced-motion: no-preference) {
  .dz-act .tw0 { animation: dzActTw 5.5s ease-in-out infinite; }
  .dz-act .tw1 { animation: dzActTw 7s ease-in-out 1.6s infinite; }
  .dz-act .tw2 { animation: dzActTw 8.5s ease-in-out 3.1s infinite; }
  .dz-act .dz-act-mist { animation: dzActMist 28s ease-in-out infinite alternate; }
  .dz-act .dz-act-mist--b { animation-duration: 36s; animation-direction: alternate-reverse; }
  .dz-act .dz-act-shimmer { animation: dzActShim 9s ease-in-out infinite alternate; }
}
@keyframes dzActTw { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }
@keyframes dzActMist { from { transform: translateX(-60px); } to { transform: translateX(60px); } }
@keyframes dzActShim { from { opacity: .1; transform: translateX(-12px); } to { opacity: .26; transform: translateX(12px); } }
