/* ===== Footer base ===== */
.footer{
  margin-top: 2rem;
  position: relative;
  color: #eaf1f0;
  background:
    radial-gradient(1000px 600px at 80% -10%, rgba(31,142,140,.18), transparent 60%),
    linear-gradient(180deg, #0e1319 0%, #0a1016 100%);
  border-top: 1px solid rgba(255,255,255,.06);
  overflow: hidden;
}

.footer__grid{
  display:grid; gap:2rem;
  grid-template-columns: repeat(auto-fit, minmax(260px,1fr));
  padding: 2.2rem 0 1.6rem;
}

.footer__title{
  font-size:1.05rem; font-weight:800; letter-spacing:.3px;
  margin:0 0 .6rem 0; color: #fff;
}

.footer__subtitle{
  font-size:.95rem; font-weight:700; letter-spacing:.3px;
  margin:0 0 .6rem 0; color: var(--bone-50, #e6f0ee);
}

.footer__text{
  color:#cfe7e4;
  margin:0 0 1rem 0;
}

.footer__links, .footer__contact{
  list-style:none; padding:0; margin:0; display:grid; gap:.5rem;
}

.footer__links a, .footer__contact a{
  color:#e6f0ee; text-decoration:none; opacity:.9;
  transition: opacity .2s ease, transform .2s ease, text-shadow .2s ease;
}
.footer__links a:hover, .footer__contact a:hover{
  opacity:1; transform: translateX(2px);
  text-shadow:0 0 12px rgba(212,175,55,.35);
}

/* CTA */
.footer__cta{ margin-top:.6rem; }

/* Social */
.footer__social{ display:flex; gap:.6rem; margin-top:1rem; }
.footer__social .ico{ display:inline-grid; place-items:center; width:36px; height:36px;
  border-radius:10px; background: rgba(255,255,255,.06);
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease; }
.footer__social .ico svg{ width:18px; height:18px; fill:#e6f0ee; opacity:.9; }
.footer__social .ico:hover{
  transform: translateY(-2px); background: rgba(212,175,55,.18);
  box-shadow: 0 8px 20px rgba(0,0,0,.25);
}

/* Copy */
.footer__copy{
  text-align:center; font-size:.9rem; color:#86b9b5;
  padding: .9rem 0 1.2rem;
  border-top: 1px solid rgba(255,255,255,.06);
}

/* ===== Ornamentación maya/azteca ===== */
/* Borde superior: línea dorada animada con “pasos” tipo pirámide */
.footer__top-ornament{
  position:absolute; inset:0 0 auto 0; height:8px; pointer-events:none;
  background:
    linear-gradient(90deg, rgba(212,175,55,.0), rgba(212,175,55,.85), rgba(212,175,55,.0));
  filter: blur(.3px) saturate(1.1);
  /* máscara con escalones piramidales */
  -webkit-mask: repeating-linear-gradient(
    to right,
    #000 0 12px, transparent 12px 14px
  );
          mask: repeating-linear-gradient(
    to right,
    #000 0 12px, transparent 12px 14px
  );
  animation: ornament-sheen 4s ease-in-out infinite;
}

/* Banda inferior con patrón geométrico (step-fret) */
.footer__bottom-ornament{
  position:absolute; inset:auto 0 0 0; height:24px; pointer-events:none;
  background: linear-gradient(180deg, rgba(212,175,55,.18), rgba(31,142,140,.12));
  -webkit-mask: url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 24' preserveAspectRatio='none'>\
    <path d='M0 24h12v-6h12v-6h12v-6h12V0h12v6h12v6h12v6h12v6h12v-6h12v-6h12v-6h12V0h12v24H0z' fill=\"black\"/>\
  </svg>") center/cover no-repeat;
          mask: url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 24' preserveAspectRatio='none'>\
    <path d='M0 24h12v-6h12v-6h12v-6h12V0h12v6h12v6h12v6h12v6h12v-6h12v-6h12v-6h12V0h12v24H0z' fill=\"black\"/>\
  </svg>") center/cover no-repeat;
  opacity:.7;
}

/* Brillo suave que recorre el borde superior */
@keyframes ornament-sheen{
  0%{ background-position:-200px 0; }
  50%{ background-position:200px 0; }
  100%{ background-position:-200px 0; }
}

/* ===== Accesibilidad de movimiento ===== */
@media (prefers-reduced-motion: reduce){
  .footer__social .ico,
  .footer__links a,
  .footer__contact a{ transition:none; }
  .footer__top-ornament{ animation:none; }
}

/* ===== Responsive ===== */
@media (max-width: 960px){
  .footer__grid{ gap:1.4rem; }
}

/* Social icons */
.footer__social{ display:flex; gap:.6rem; margin-top:1rem; }
.footer__social .ico{
  display:inline-grid; place-items:center;
  width:40px; height:40px; border-radius:50%;
  background: rgba(255,255,255,.06);
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}
.footer__social .ico svg{ width:20px; height:20px; fill:#e6f0ee; opacity:.9; }
.footer__social .ico:hover{ transform:translateY(-2px); box-shadow:0 8px 20px rgba(0,0,0,.25); }

/* WhatsApp */
.footer__social .ico--whatsapp:hover{
  background:#25D366; /* verde oficial */
}
.footer__social .ico--whatsapp:hover svg{ fill:#fff; opacity:1; }

/* Facebook */
.footer__social .ico--facebook:hover{
  background:#1877F2; /* azul oficial */
}
.footer__social .ico--facebook:hover svg{ fill:#fff; opacity:1; }
