/* ------------------------------------------
   STYLES.CSS — TORTUGAS MARINAS (/)
   ------------------------------------------*/

/* TOKENS */
:root {
  --deep:    #0D2B4E;
  --mid:     #1A6B8A;
  --turq:    #00B4D8;
  --turq-lt: #48CAE4;
  --white:   #FFFFFF;
  --radius:  14px;
  --display: 'Playfair Display', Georgia, serif;
  --body:    'Inter', system-ui, sans-serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--body); font-size: 17px; color: var(--white);
  background: linear-gradient(180deg,
    #0D2B4E 0%, #0F3560 8%, #1A6B8A 18%, #0D7FA0 30%,
    #0B6E8C 42%, #0A5C78 54%, #093D58 66%,
    #0A4D6A 78%, #0C3A58 90%, #0D2B4E 100%);
  min-height: 100vh;
}

/* CICLO DE VIDA */
.cycle-list { display: flex; flex-direction: column; gap: 1.25rem; margin-top: 1.75rem; }
.cycle-item {
  display: flex; gap: 1.25rem; align-items: flex-start;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius); padding: 1.25rem 1.5rem;
}
.cycle-num {
  font-family: var(--display); font-size: 1.6rem; font-weight: 700;
  color: var(--turq-lt); flex-shrink: 0; line-height: 1; min-width: 28px;
}
.cycle-item h3 {
  font-family: var(--display); font-size: 1.1rem;
  font-weight: 700; color: var(--white); margin-bottom: .4rem;
}
.cycle-item p {
  font-size: .95rem; color: rgba(255,255,255,.75);
  line-height: 1.65; margin-bottom: 0;
}