@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,wght@0,400;0,600;0,700;1,400&family=DM+Sans:wght@300;400;500;600&display=swap');

:root {
  --teal: #2ABFBF;
  --teal-oscuro: #1E9494;
  --coral: #E8573B;
  --coral-claro: #F07A63;
  --gris: #6B7280;
  --grad-teal: linear-gradient(135deg, #1E9494 0%, #2ABFBF 100%);
  --grad-coral: linear-gradient(135deg, #E8573B 0%, #F07A63 100%);
  --grad-hero: linear-gradient(135deg, #1E9494 0%, #2ABFBF 60%, #3DCFCF 100%);
  --teal-suave: #E6F9F9;
  --coral-suave: #FDF0ED;
  --gris-suave: #F3F4F6;
  --gris-borde: #E5E7EB;
  --negro: #1A1E2E;
  --texto-soft: #6B7280;
  --blanco: #FFFFFF;
  --sombra: 0 4px 24px rgba(42,191,191,0.12);
  --sombra-hover: 0 8px 40px rgba(42,191,191,0.22);
  --radio: 16px;
  --radio-sm: 8px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'DM Sans', sans-serif; background: var(--blanco); color: var(--negro); line-height: 1.6; -webkit-font-smoothing: antialiased; }

nav { position: sticky; top: 0; z-index: 100; background: rgba(255,255,255,0.97); backdrop-filter: blur(12px); border-bottom: 1px solid var(--gris-borde); padding: 0 2rem; }
.nav-inner { max-width: 1100px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; height: 100px; gap: 2rem; }
.nav-logo { display: flex; align-items: center; gap: 0.6rem; text-decoration: none; }
.nav-logo img { height: 88px; width: auto; object-fit: contain; }
.nav-logo span { font-family: 'Fraunces', serif; font-size: 1.3rem; font-weight: 700; background: var(--grad-teal); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; letter-spacing: -0.5px; }
.nav-links { display: flex; align-items: center; gap: 0.25rem; list-style: none; }
.nav-links a { text-decoration: none; color: var(--texto-soft); font-size: 0.88rem; font-weight: 500; padding: 0.4rem 0.85rem; border-radius: 100px; transition: all 0.2s; }
.nav-links a:hover, .nav-links a.active { background: var(--teal-suave); color: var(--teal-oscuro); }
.btn-nav { background: linear-gradient(135deg, #1E9494, #2ABFBF) !important; color: white !important; padding: 0.45rem 1.1rem !important; border-radius: 100px !important; -webkit-text-fill-color: white !important; }

footer { background: var(--negro); color: rgba(255,255,255,0.7); padding: 3rem 2rem 2rem; margin-top: 5rem; }
.footer-inner { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 3rem; padding-bottom: 2rem; border-bottom: 1px solid rgba(255,255,255,0.1); }
.footer-brand img { height: 52px; margin-bottom: 0.75rem; }
.footer-brand p { font-size: 0.85rem; line-height: 1.6; max-width: 260px; }
.footer-col h4 { font-family: 'Fraunces', serif; color: white; font-size: 0.95rem; margin-bottom: 1rem; }
.footer-col a { display: block; text-decoration: none; color: rgba(255,255,255,0.6); font-size: 0.85rem; margin-bottom: 0.5rem; transition: color 0.2s; }
.footer-col a:hover { color: var(--teal); }
.footer-bottom { max-width: 1100px; margin: 1.5rem auto 0; display: flex; justify-content: space-between; align-items: center; font-size: 0.8rem; }
.footer-bottom a { color: rgba(255,255,255,0.5); text-decoration: none; }

.btn { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1.75rem; border-radius: 100px; font-family: 'DM Sans', sans-serif; font-size: 0.9rem; font-weight: 600; cursor: pointer; text-decoration: none; transition: all 0.2s; border: none; }
.btn-primary { background: linear-gradient(135deg, #1E9494, #2ABFBF); color: white; box-shadow: 0 4px 16px rgba(42,191,191,0.35); }
.btn-primary:hover { opacity: 0.88; transform: translateY(-1px); box-shadow: 0 6px 24px rgba(42,191,191,0.45); }
.btn-coral { background: linear-gradient(135deg, #E8573B, #F07A63); color: white; box-shadow: 0 4px 16px rgba(232,87,59,0.3); }
.btn-coral:hover { opacity: 0.88; transform: translateY(-1px); }
.btn-outline { background: transparent; color: var(--teal-oscuro); border: 2px solid var(--teal); }
.btn-outline:hover { background: var(--teal-suave); }
.btn-white { background: white; color: var(--teal-oscuro); font-weight: 700; }
.btn-white:hover { background: var(--teal-suave); transform: translateY(-2px); }

.badge { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.3rem 0.85rem; border-radius: 100px; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.5px; text-transform: uppercase; }
.badge-teal { background: var(--teal-suave); color: var(--teal-oscuro); }
.badge-coral { background: var(--coral-suave); color: var(--coral); }
.badge-gris { background: var(--gris-suave); color: var(--gris); }

.card { background: white; border: 1px solid var(--gris-borde); border-radius: var(--radio); padding: 1.5rem; transition: all 0.25s; }
.card:hover { box-shadow: var(--sombra-hover); border-color: var(--teal); transform: translateY(-2px); }

.section { padding: 5rem 2rem; }
.section-inner { max-width: 1100px; margin: 0 auto; }
.section-label { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; color: var(--teal-oscuro); margin-bottom: 0.75rem; display: inline-block; }
.section-title { font-family: 'Fraunces', serif; font-size: clamp(2rem, 4vw, 3rem); font-weight: 700; color: var(--negro); line-height: 1.15; margin-bottom: 1rem; }
.section-sub { font-size: 1.05rem; color: var(--texto-soft); max-width: 560px; line-height: 1.7; }
.sep { height: 3px; background: linear-gradient(90deg, #1E9494, #2ABFBF, #E8573B); border-radius: 2px; margin: 0.5rem 0 1.5rem; width: 60px; }

@media (max-width: 768px) {
  .nav-links { display: none; }
  .footer-inner { grid-template-columns: 1fr; gap: 2rem; }
  .footer-bottom { flex-direction: column; gap: 0.5rem; text-align: center; }
}