:root {
  --sand: #f5ede3;
  --sand-light: #fbf6ef;
  --sand-deep: #ebdecd;
  --ink: #12343d;
  --ink-soft: #4a6168;
  --sun: #e0692f;
  --sun-text: #c1531f;
  color-scheme: light;
}

* { box-sizing: border-box; margin: 0; }

body {
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  background: radial-gradient(120% 80% at 50% 0%, var(--sand-light) 0%, var(--sand) 55%, var(--sand-deep) 100%);
  color: var(--ink);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  -webkit-font-smoothing: antialiased;
}

.stage {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 48px 20px 24px;
}

.horizon { width: min(220px, 56vw); height: auto; margin-bottom: 28px; }
.sun { fill: var(--sun); }
.sea { stroke: var(--ink); stroke-width: 2.5; stroke-linecap: round; }
.sea-2 { opacity: .45; }
.sea-3 { opacity: .2; }

.eyebrow {
  font-size: .78rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin-bottom: 14px;
}

.mark {
  font-family: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  font-weight: 500;
  font-size: clamp(3rem, 13vw, 6.5rem);
  letter-spacing: -.02em;
  line-height: 1;
  margin-bottom: 26px;
}
.tld { color: var(--sun-text); }

.line {
  font-size: clamp(1rem, 2.6vw, 1.15rem);
  line-height: 1.6;
  max-width: 44ch;
}
.line-es { color: var(--ink-soft); font-style: italic; margin-top: 4px; }

.foot {
  text-align: center;
  padding: 24px 16px 32px;
  font-size: .8rem;
  color: var(--ink-soft);
}

@media (prefers-reduced-motion: no-preference) {
  .sun { animation: rise 2.4s cubic-bezier(.2, .7, .2, 1) both; }
  @keyframes rise {
    from { transform: translateY(44px); }
    to { transform: none; }
  }
}