/* ─── Tymora landing — static port ───────────────────────────────────────── */

:root {
  --mt-navy: #0f2e53;
  --mt-teal: #3bb3a9;
  --mt-teal-fg: #0f6e56;
  --mt-teal-tint: #e8f4f2;
  --mt-bg: #fafaf7;
  --mt-bg-soft: #fcfcf9;
  --mt-muted-text: #5a6478;
  --mt-soft-text: #8a93a3;
  --mt-border: rgba(15, 46, 83, 0.08);
  --mt-border-strong: rgba(15, 46, 83, 0.12);
}

html,
body {
  margin: 0;
  padding: 0;
  background: var(--mt-bg);
  color: var(--mt-navy);
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

* {
  box-sizing: border-box;
}

a {
  text-decoration: none;
}

.font-sans {
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}

.font-serif {
  font-family: "Playfair Display", Georgia, serif;
}

.font-mono {
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

/* ─── Animations ──────────────────────────────────────────────────────────── */

@keyframes mt-nav-slide {
  0% {
    opacity: 0;
    transform: translateY(-6px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes mt-fade-up {
  0% {
    opacity: 0;
    transform: translateY(12px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes mt-word-appear {
  0% {
    opacity: 0;
    transform: translateY(24px) scale(0.96);
    filter: blur(8px);
  }
  60% {
    opacity: 0.9;
    transform: translateY(4px) scale(0.99);
    filter: blur(1px);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}

@keyframes mt-pill-pulse {
  0%,
  100% {
    opacity: 0.7;
    transform: scale(1);
  }
  50% {
    opacity: 1;
    transform: scale(1.25);
  }
}

@keyframes mt-mockup-rise {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes mt-marker-draw {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(1);
  }
}

.mt-nav-slide {
  opacity: 0;
  animation: mt-nav-slide 0.6s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.mt-fade-up {
  opacity: 0;
  animation: mt-fade-up 0.8s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.mt-word {
  display: inline-block;
  opacity: 0;
  animation: mt-word-appear 0.9s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.mt-pill-dot {
  animation: mt-pill-pulse 2s ease-in-out infinite;
}

.mt-mockup {
  opacity: 0;
  animation: mt-mockup-rise 1.2s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.mt-marker {
  position: absolute;
  left: -4px;
  right: -4px;
  top: 18%;
  bottom: 15%;
  z-index: 0;
  background: var(--mt-teal);
  opacity: 0.28;
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: left center;
  animation: mt-marker-draw 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) 1.9s forwards;
}

/* ─── Bento grid ──────────────────────────────────────────────────────────── */

.mt-bento {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

@media (min-width: 768px) {
  .mt-bento {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(4, minmax(180px, auto));
  }
}

.bento-cell {
  position: relative;
  background: #ffffff;
  border: 0.5px solid rgba(15, 46, 83, 0.1);
  border-radius: 16px;
  padding: 24px;
  transition: border-color 0.3s ease;
}

.bento-cell:hover {
  border-color: rgba(59, 179, 169, 0.4);
}

@media (prefers-reduced-motion: reduce) {
  .mt-nav-slide,
  .mt-fade-up,
  .mt-word,
  .mt-pill-dot,
  .mt-mockup,
  .mt-marker,
  .mt-soon-dot {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }
}

/* ─── Próximamente: typing dots ───────────────────────────────────────────── */

@keyframes mt-soon-dot-pulse {
  0%,
  80%,
  100% {
    opacity: 0.25;
    transform: scale(0.75);
  }
  40% {
    opacity: 1;
    transform: scale(1.1);
  }
}

.mt-soon-dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--mt-teal);
  animation: mt-soon-dot-pulse 1.4s ease-in-out infinite both;
}
