/* ========================= */
/* CONFIGURACION GENERAL */
/* ========================= */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html, body{
    width:100%;
    overflow-x:hidden;
}

body{
    background-color:#050505;
    font-family:'Playfair Display', serif;
    color:white;
}

/* ========================= */
/* CONTENEDOR */
/* ========================= */

.Contenedor{

    width:100%;

    min-height:100vh;

    display:flex;

    flex-direction:column;

    align-items:center;

    background:
    linear-gradient(rgba(0,0,0,0.92), rgba(0,0,0,0.95)),
    url('https://i.ibb.co/1f9zNcX6/images.png');

    background-repeat:repeat-y;

    background-position:center;

    background-size:180px;

    padding-bottom:60px;
}

/* ========================= */
/* HEADER */
/* ========================= */

.Header{

    width:100%;

    display:flex;

    justify-content:center;

    align-items:center;

    gap:25px;

    padding:30px 20px;

    border-bottom:2px solid #d4af37;

    background-color:#0d0d0d;
}

.logo img{

    width:120px;

    height:120px;

    object-fit:cover;

    border-radius:50%;

    border:3px solid #d4af37;
}

.titulo{

    text-align:center;
}

.titulo h1{

    font-size:65px;

    color:#d4af37;

    font-family:'Cinzel', serif;

    letter-spacing:4px;

    text-shadow:3px 3px 10px black;
}

.titulo p{

    margin-top:10px;

    color:#e4c96e;

    font-size:20px;
}

/* ========================= */
/* MENU NAVEGACION */
/* ========================= */

.MenuNav{

    width:100%;

    display:flex;

    justify-content:center;

    flex-wrap:wrap;

    gap:18px;

    padding:20px;

    background-color:#111;
}

.MenuNav a{

    text-decoration:none;

    color:#d4af37;

    border:2px solid #d4af37;

    padding:10px 24px;

    border-radius:10px;

    font-size:16px;

    transition:0.3s;

    font-family:'Cinzel', serif;

    background-color:#181818;
}

.MenuNav a:hover{

    background-color:#d4af37;

    color:black;
}

/* ========================= */
/* CARTA */
/* ========================= */

.Carta{

    width:90%;

    max-width:1300px;

    margin-top:50px;

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:40px;
}

/* ========================= */
/* COLUMNAS */
/* ========================= */

.Columna{

    background-color:rgba(15,15,15,0.92);

    border:2px solid #d4af37;

    border-radius:25px;

    padding:40px;

    box-shadow:0px 0px 25px rgba(212,175,55,0.15);
}

/* ========================= */
/* SECCIONES */
/* ========================= */

.Seccion{

    margin-bottom:50px;
}

.Seccion h2{

    text-align:center;

    color:#d4af37;

    font-size:42px;

    margin-bottom:35px;

    font-family:'Cinzel', serif;

    border-bottom:2px solid #d4af37;

    padding-bottom:10px;
}

/* ========================= */
/* ITEMS */
/* ========================= */

.Item{

    margin-bottom:30px;
}

.Item h3{

    color:#f1d57a;

    font-size:25px;

    margin-bottom:8px;

    text-align:center;
}

.Item p{

    color:#dddddd;

    font-size:16px;

    text-align:center;

    line-height:1.7;
}

/* ========================= */
/* RESPONSIVE */
/* ========================= */

@media screen and (max-width:900px){

    .Carta{

        grid-template-columns:1fr;
    }

    .titulo h1{

        font-size:45px;
    }

    .Seccion h2{

        font-size:34px;
    }

}

@media screen and (max-width:600px){

    .Header{

        flex-direction:column;
    }

    .logo img{

        width:90px;

        height:90px;
    }

    .titulo h1{

        font-size:34px;
    }

    .titulo p{

        font-size:15px;
    }

    .MenuNav{

        gap:10px;
    }

    .MenuNav a{

        font-size:13px;

        padding:8px 14px;
    }

    .Carta{

        width:95%;
    }

    .Columna{

        padding:25px;
    }

    .Seccion h2{

        font-size:28px;
    }

    .Item h3{

        font-size:20px;
    }

    .Item p{

        font-size:14px;
    }

}