@font-face {
  font-family: 'gotham-medium';
  src: url('../font/Gotham-Medium.woff2') format('woff2'),
       url('../font/Gotham-Medium.woff') format('woff');   
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* mejora rendimiento y evita bloqueos */
}

    @font-face {
  font-family: 'gotham-book';
  src: url('../font/Gotham-Book.woff2') format('woff2'),
       url('../font/Gotham-Book.woff') format('woff');   
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* mejora rendimiento y evita bloqueos */
} 

    @font-face {
  font-family: 'pink-champagne';
  src: url('../font/Pink\ Champagne.woff2') format('woff2'),
       url('../font/Pink\ Champagne.woff') format('woff');   
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* mejora rendimiento y evita bloqueos */
} 

    @font-face {
  font-family: 'pink-champagne-oblique';
  src: url('../font/Pink\ Champagne\ Oblique.woff2') format('woff2'),
       url('../font/Pink\ Champagne\ Oblique.woff') format('woff');   
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* mejora rendimiento y evita bloqueos */
} 

    body { 
        font-family: 'gotham-book', sans-serif;
        color:#333; 
    }

    h1 {
        font-family: 'gotham-book', sans-serif;
        font-size:3rem;
        letter-spacing:2px;
        padding-top: 15%; 
    }
    h2 {
        font-family: 'gotham-medium', sans-serif;
        font-size:2rem;
       
    }

    h3 {
        font-family: 'gotham-book', sans-serif;
        font-size:1.5rem;
        margin-top:20px;
    }
    .hero { 
        background:url('../img/principal.jpg') center/cover no-repeat;
        height:100vh;
        display:flex;
        align-items:center;
        justify-content:center;
        color:#fff;
        text-shadow:0 2px 6px rgba(0,0,0,.6);
    }
    .collage img {
        border-radius:8px;
        box-shadow:0 4px 10px rgba(0,0,0,.1);
    }
    .gallery img {
        margin-bottom:15px;
        border-radius:6px;
    }
    footer {
        background:#111;
        color:#fff;
        padding:40px 0;
        text-align:center;
    }
    .btn-pandora { 
        background:#d4a373;
        color:#fff;
        font-weight:600;
        padding:12px 30px;
        border-radius:30px;
    }

    .img-block img { 
        border-radius:8px;
        width:100%;
    }
    .content-block { 
        margin-bottom:4rem;
    }

    .head_exp{

    top:0;

    background-color: #000000;

    padding: 0.3em;

    position: fixed;

    display: block;

    width: 100%;

    border-bottom-color: #000000;

    border-right-width: 1px;

    border-bottom-style:solid;

    z-index: 99;

    -webkit-transition: background-color 0.5s ease-out; -moz-transition: 

  background-color 0.5s ease-out; -o-transition: background-color 0.5s ease-out; transition: background-color 0.5s ease-out;

}

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

        h1 {
        font-family: 'gotham-book', sans-serif;
        font-size:1.8rem;
        letter-spacing:2px;
        padding-top: 75%; 
    }

        h2 {
        font-family: 'gotham-medium', sans-serif;
        font-size:1.5rem;
       
    }

    h3 {
        font-family: 'gotham-book', sans-serif;
        font-size:0.8rem;
        margin-top:20px;
    }

}