/* CSS Personalizado para o Cover */
.hero-banner {
  background-image: url("./assets/banner-eduardo-di-lauro.png");
  background-size: cover;
  background-position: center;
  min-height: 75vh;
  position: relative;
}

.playfair-display-sc-regular {
  font-family: "Playfair Display", serif;
  font-weight: 200;
  font-style: normal;
}

.playfair-display-sc-bold {
  font-family: "Playfair Display SC", serif;
  font-weight: 700;
  font-style: normal;
}

.playfair-display-sc-black {
  font-family: "Playfair Display SC", serif;
  font-weight: 900;
  font-style: normal;
}

.playfair-display-sc-regular-italic {
  font-family: "Playfair Display", serif;
  font-weight: 400;
  font-style: italic;
}

.playfair-display-sc-bold-italic {
  font-family: "Playfair Display SC", serif;
  font-weight: 700;
  font-style: italic;
}

.playfair-display-sc-black-italic {
  font-family: "Playfair Display SC", serif;
  font-weight: 900;
  font-style: italic;
}


.playfair-display-sc-black-italic {
  font-family: "Playfair Display SC", serif;
  font-weight: 900;
  font-style: italic;
}


.lora-text {
  font-family: "Lora", serif;
  font-optical-sizing: auto;
  font-weight: 400; /* Peso fixado aqui */
  font-style: normal;
}

body {
        overflow-x: hidden; /* Evita rolagem lateral indesejada */
      }

      /* --- CONFIGURAÇÃO DO HERO BANNER (A FOTO DO ESCRITOR) --- */
      .hero-banner {
        background-image: url("./assets/banner-eduardo-di-lauro.png");
        background-size: cover;
        position: relative;
        width: 100%;
      }

      /* Comportamento no MOBILE (Celular) */
      .hero-banner {
        /* Foca em 25% da largura da imagem (onde está o rosto geralmente) */
        background-position: 35% center;
        min-height: 60vh; /* Altura um pouco menor no celular */
      }

      /* Gradiente para o texto ficar legível no celular */
      .hero-overlay-mobile {
        background: linear-gradient(to top, rgba(0, 0, 0, 0.9), transparent);
        padding-bottom: 2rem;
      }

      /* Comportamento no DESKTOP (Telas maiores que 768px) */
      @media (min-width: 768px) {
        .hero-banner {
          background-position: center center;
          min-height: 85vh; /* Altura total e imponente no Desktop */
        }
        .hero-overlay-mobile {
          background: none; /* Remove o fundo escuro no desktop */
          padding-bottom: 0;
        }
      }

      /* --- TIPOGRAFIA --- */
      .playfair-display-sc-bold-italic {
        font-family: "Playfair Display SC", serif;
        font-weight: 700;
        font-style: italic;
      }

      .playfair-display-regular-italic {
        font-family: "Playfair Display", serif;
        font-weight: 400;
        font-style: italic;
      }

      .lora-text {
        font-family: "Lora", serif;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
      }