/* Leinen los – Ergänzungen zu eure-reise.css: Segelboot, Wellen, Entwurfs-Hinweis */

.ll-draft-note {
  max-width: 34rem;
  margin: 2.4rem auto 0;
  padding: 1.2rem 1.4rem;
  border: 1px dashed var(--gold);
  border-radius: var(--radius);
  background: rgba(200, 162, 74, 0.06);
  text-align: left;
  font-size: 0.95rem;
}

.ll-draft-note strong {
  display: block;
  margin-bottom: 0.4rem;
  color: var(--gold-deep);
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.ll-draft-note p {
  color: var(--muted);
}

/* Das Meer wird zum Ende hin leicht tiefer */
.reise-page .reise-journey {
  background: linear-gradient(to bottom, transparent, rgba(9, 50, 42, 0.06));
}

/* --- Segelboot (sitzt in der Linien-Grafik, Position setzt leinen-los.js) --- */
.reise-line .ll-boat path {
  stroke: var(--deep-green);
  stroke-width: 2;
  stroke-linejoin: round;
}

.reise-line .ll-boat-hull {
  fill: var(--deep-green);
}

.reise-line .ll-boat-sail {
  fill: var(--ivory);
}

.reise-line .ll-boat-sail-small {
  fill: var(--gold);
  stroke: var(--gold-deep);
}

.reise-line .ll-boat-wave {
  fill: none;
  stroke: var(--gold);
}

/* Sanftes Schaukeln auf den Wellen */
.ll-boat {
  transform-box: fill-box;
  transform-origin: 50% 100%;
  animation: ll-rock 3.2s ease-in-out infinite;
}

@keyframes ll-rock {
  0%, 100% { transform: rotate(-4deg); }
  50% { transform: rotate(4deg); }
}

/* --- Wellenband vor dem Abschluss --- */
/* Oberhalb der Welle Meer, unterhalb Land: der Farbton endet genau auf der Wellenlinie */
.ll-waves {
  overflow: hidden;
  height: 40px;
  margin-bottom: 2rem;
  background: linear-gradient(to bottom, rgba(9, 50, 42, 0.06) 50%, transparent 50%);
}

.ll-waves svg {
  width: 200%;
  height: 100%;
  animation: ll-drift 14s linear infinite;
}

.ll-waves path {
  fill: none;
  stroke: var(--gold);
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

@keyframes ll-drift {
  to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .ll-boat,
  .ll-waves svg {
    animation: none;
  }
}