/* =========================================
FOOTER BASE (ESTRUCTURA GENERAL)
-----------------------------------------
- Fondo oscuro corporativo
- Grid de 3 columnas en desktop
========================================= */

.main-footer{
  background:#071a2c;
  color:#c7d6e7;
  padding:80px 0 0 0;
  border-top:1px solid rgba(255,255,255,.05);
}


/* =========================================
GRID PRINCIPAL
-----------------------------------------
Desktop:
- Marca
- Navegación
- Contacto
========================================= */

.footer-grid{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:60px;
  align-items:start;
}


/* =========================================
BLOQUE MARCA
========================================= */

.footer-brand{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:14px;
  text-align:left;
}

.footer-title{
  font-family:'IvyJournal', serif;
  font-size:22px;
  font-weight:500;
  letter-spacing:-0.3px;
  color:#ffffff;
  margin:0;
}

.footer-desc{
  font-family:'Bodoni Moda', serif;
  font-size:15px;
  line-height:1.6;
  color:#8aa0b6;
  max-width:420px;
  margin:0;
}

.footer-advisor{
  font-family:'IvyJournal', serif;
  font-size:18px;
  letter-spacing:-0.2px;
  color:#ffffff;
  margin:6px 0 0 0;
}

.footer-advisor span{
  display:block;
  font-family:Arial, sans-serif;
  font-size:12px;
  letter-spacing:1.6px;
  text-transform:uppercase;
  color:#8fa7c0;
  margin-top:6px;
}


/* =========================================
NAVEGACIÓN
========================================= */

.footer-nav h4,
.footer-contact h4{
  font-size:11px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:#8fa7c0;
  margin:0 0 16px 0;
}

.footer-nav ul{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.footer-nav a,
.footer-contact a{
  text-decoration:none;
  color:#cfe3ff;
  font-size:15px;
  letter-spacing:.3px;
  transition:color .25s ease, opacity .25s ease;
}

.footer-nav a:hover,
.footer-contact a:hover{
  color:white;
}


/* =========================================
CONTACTO
========================================= */

.footer-contact a{
  font-size:16px;
}

/* =========================================
FOOTER BOTTOM (COPYRIGHT)
========================================= */

.footer-bottom{
  border-top:1px solid rgba(255,255,255,.05);
  margin-top:60px;
  padding:26px 0;
}

.footer-bottom p{
  margin:0;
  font-size:14px;
  color:rgba(180,210,235,.78);
}

.footer-bottom a,
.footer-bottom a:visited,
.footer-bottom a:active{
  color:rgba(180,210,235,.78) !important;
  text-decoration:none;
}

.footer-bottom a:hover{
  color:#ffffff !important;
  opacity:.85;
}

.footer-separator{
  margin:0 6px;
  color:rgba(180,210,235,.45);
}


/* =========================================
TABLET GRANDE (<=1024px)
========================================= */

@media (max-width:1024px){

  .footer-grid{
    gap:40px;
  }

  .footer-desc{
    max-width:360px;
  }

}


/* =========================================
TABLET + MOBILE (<=900px)
-----------------------------------------
- Cambia a 1 columna
- Centrado completo
========================================= */

@media (max-width:900px){

  .footer-grid{
    grid-template-columns:1fr;
    gap:42px;
    text-align:center;
  }

  .footer-brand{
    align-items:center;
    text-align:center;
  }

  .footer-desc{
    margin:auto;
    max-width:420px;
  }

  .footer-nav ul{
    align-items:center;
  }

  .footer-contact{
    margin-top:0;
  }

}


/* =========================================
MOBILE (<=600px)
========================================= */

@media (max-width:600px){

  .main-footer{
    padding:50px 0 0 0;
  }

  .footer-grid{
    gap:34px;
  }

  .footer-title{
    font-size:20px;
  }

  .footer-desc{
    font-size:14px;
    line-height:1.6;
    letter-spacing:0.2px;
    text-align:center;
    max-width:320px;
    margin:6px auto 0 auto;
  }

  .footer-brand{
    gap:10px;
  }

  .footer-advisor{
    font-size:16px;
    color:#cfe3ff;
  }

  .footer-advisor span{
    font-size:11px;
  }

  .footer-nav h4,
  .footer-contact h4{
    font-size:10px;
    margin-bottom:14px;
  }

  .footer-nav ul{
    gap:9px;
  }

  .footer-nav a,
  .footer-contact a{
    font-size:14px;
  }

  .footer-bottom{
    margin-top:40px;
    padding:20px 0;
  }

  .footer-bottom p{
    font-size:12px;
    text-align:center;
  }

}