/* The Hero's TideField is the only moving world, shared by the page below it. */
body { background: #03111c; }
#tyturn-world {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background: #03111c;
}
#contenido { position: relative; z-index: 1; }
#contenido > #tyturn-hero-root { position: relative; }

/* Reservas supplies its own contrast through its existing opaque cards. */
#contenido > .reservas-v53 { background: transparent; }

/* Later modules retain their layout and imagery. Only their supporting
   surfaces become translucent so the same canvas remains visible beneath. */
#contenido > section:not(.reservas-v53) {
  --ink-900: #f2f8fa;
  --ink-700: #c8dadd;
  --ink-600: #b5cad1;
  --ink-500: #9eb8c1;
  --teal-600: #68dadd;
  --line: rgba(120,196,207,.24);
  --line-strong: rgba(120,196,207,.36);
  --surface-soft: rgba(8,29,42,.82);
  --surface-muted: rgba(12,39,52,.9);
  color: #f2f8fa;
  background: linear-gradient(180deg,rgba(3,14,24,.18),rgba(3,14,24,.30));
}
#contenido > .pro-section { background: rgba(3,14,24,.29); }
#contenido > .assistant-section,
#contenido > .faq-section { background: rgba(3,14,24,.23); }
#contenido > .final-cta { background: rgba(3,14,24,.14); }

/* Contrast surfaces around real screenshots and existing content. */
#contenido .operation-primary,
#contenido .operation-states,
#contenido .plan-card,
#contenido .plan-card.pro,
#contenido .accordion details {
  background: linear-gradient(155deg,rgba(15,44,57,.94),rgba(5,25,37,.96));
  box-shadow: 0 22px 56px rgba(0,6,13,.2);
}
#contenido .operation-mobile { background: linear-gradient(165deg,rgba(10,35,48,.94),rgba(13,52,64,.94)); }
#contenido .assistant-visual,
#contenido .ready-visual {
  border-color: rgba(120,196,207,.32);
  background: linear-gradient(160deg,rgba(15,44,57,.9),rgba(6,25,37,.94));
}
#contenido .plan-fit.pro-fit { color: #126474; }
#contenido .plan-btn { background: rgba(12,39,52,.9); }
#contenido .plan-btn:hover { background: rgba(17,55,68,.94); }

footer {
  position: relative;
  z-index: 1;
  --ink-600: #b5cad1;
  --ink-500: #9eb8c1;
  --teal-600: #68dadd;
  --line: rgba(120,196,207,.24);
  color: #f2f8fa;
}
