/* Header y navegacion */
.header{ position: sticky; top:0; z-index: 50; background: color-mix(in hsl, var(--bg-soft), transparent 0%); backdrop-filter: saturate(140%) blur(8px); border-bottom:1px solid rgba(0,0,0,.06); }
.nav{ display:flex; align-items:center; justify-content:space-between; height:64px; }
.brand{ display:flex; align-items:center; gap:.6rem; font-weight:700; }
.nav-links{ display:flex; gap:1rem; align-items:center; }
.nav-toggle{ display:none; }
@media (max-width: 900px){
  .nav-links{ position: fixed; inset: 64px 0 auto 0; display:grid; gap:.75rem; padding:1rem; background: var(--bg-soft); border-bottom:1px solid rgba(0,0,0,.06); transform: translateY(-10%); opacity:0; pointer-events:none; transition: var(--transition); }
  .nav-links.open{ transform: translateY(0); opacity:1; pointer-events:auto; }
  .nav-toggle{ display:inline-flex; }
}

/* Hero */
.hero{ display:grid; gap:1rem; padding: clamp(2rem, 4vw, 4rem) 0; align-items:center; }
.hero-title{ font-size: clamp(1.8rem, 4vw, 3rem); line-height:1.1; }
.hero-sub{ color: var(--muted); }

/* Componentes */
.carousel{ position:relative; overflow:hidden; border-radius: var(--radius); box-shadow: var(--shadow); }
.carousel-track{ display:flex; transition: transform var(--transition); }
.carousel img{ width:100%; aspect-ratio:16/9; object-fit:cover; }
.modal{ position:fixed; inset:0; background: rgba(0,0,0,.5); display:grid; place-items:center; opacity:0; pointer-events:none; transition: var(--transition); }
.modal.open{ opacity:1; pointer-events:auto; }
.modal__dialog{ background: var(--bg-soft); border-radius: var(--radius); padding:1rem; width:min(640px, 92%); }
.toast{ position: fixed; right:1rem; bottom:1rem; background:var(--brand-3); color:#fff; border-radius:12px; padding:.75rem 1rem; box-shadow: var(--shadow); opacity:0; transform: translateY(8px); transition: var(--transition); }
.toast.show{ opacity:1; transform: translateY(0); }
.footer{ padding: 2rem 0; color: var(--muted); }