/*======================
   ARENA LIBRE — PIE DE PÁGINA
   Estilo: tropical elegante
   (arena · mar profundo · turquesa · dorado)
=======================*/

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;1,9..144,500&family=Outfit:wght@400;500;600;700&display=swap');

:root{

    --arena-50:#FDFAF4;
    --arena-100:#FBF5E9;
    --arena-200:#F1E3C6;

    --mar-900:#0D3B4A;
    --mar-700:#125067;

    --turquesa-500:#1FA6A0;
    --turquesa-400:#3FBFB4;

    --dorado-500:#C9A24B;
    --dorado-300:#E3C783;

}

.footer{

    position:relative;
    background:
        radial-gradient(120% 160% at 100% 0%, rgba(63,191,180,.35) 0%, transparent 55%),
        linear-gradient(160deg,var(--mar-900) 0%,var(--mar-700) 100%);
    color:var(--arena-100);
    margin-top:100px;
    font-family:'Outfit',sans-serif;

}

.footer-container{

    max-width:1400px;
    margin:auto;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:50px;
    padding:70px 8%;

}

.footer-col h2{

    font-family:'Fraunces',serif;
    font-weight:600;
    font-size:30px;
    color:var(--dorado-300);
    margin-bottom:20px;

}

.footer-col h3{

    font-family:'Fraunces',serif;
    font-weight:600;
    margin-bottom:20px;
    font-size:21px;
    color:var(--arena-50);

}

.footer-col p{

    color:var(--arena-100);
    opacity:.85;
    line-height:1.8;

}

.footer-col span{

    color:var(--arena-200);

}

.footer-col ul{

    list-style:none;

}

.footer-col ul li{

    margin-bottom:15px;

}

.footer-col ul li a{

    color:var(--arena-100);
    opacity:.85;
    text-decoration:none;
    transition:.3s;

}

.footer-col ul li a:hover{

    color:var(--turquesa-400);
    opacity:1;
    padding-left:8px;

}

.footer-col i{

    margin-right:10px;
    color:var(--turquesa-400);

}

/* Redes Sociales */

.social-footer{

    display:flex;
    gap:15px;
    margin-top:20px;

}

.social-footer a{

    width:45px;
    height:45px;
    border-radius:50%;
    display:flex;
    justify-content:center;
    align-items:center;
    background:rgba(255,255,255,.12);
    color:#fff;
    text-decoration:none;
    transition:.4s;

}

.social-footer a:hover{

    background:var(--dorado-300);
    color:var(--mar-900);
    transform:translateY(-6px);

}

/* Colores de marca por red social */

.social-footer a img{
    width:22px;
    height:22px;
    object-fit:contain;
}

.social-footer a.fb{ background:#1877F2; }
.social-footer a.wa{ background:#25D366; }
.social-footer a.tt{ background:#000000; }
.social-footer a.yt{ background:#FF0000; }
.social-footer a.ig{ background:linear-gradient(45deg,#f9ce34,#ee2a7b,#6228d7); }

.social-footer a.fb:hover,
.social-footer a.wa:hover,
.social-footer a.tt:hover,
.social-footer a.yt:hover,
.social-footer a.ig:hover{

    color:#fff;
    filter:brightness(1.15);
    transform:translateY(-6px);
    background-color:inherit;

}

/* Línea inferior */

.footer-bottom{

    text-align:center;
    padding:25px;
    border-top:1px solid rgba(255,255,255,.15);
    font-size:14.5px;
    color:var(--arena-200);
    opacity:.8;

}

/*==========================
      RESPONSIVE
===========================*/

@media(max-width:1000px){

.footer-container{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:650px){

.footer-container{

grid-template-columns:1fr;
text-align:center;

}

.social-footer{

justify-content:center;

}

}