$carousel-transition-duration:       1s;

@keyframes colorefect {
  from {
    filter: contrast(2); }
  to {
    background-image: linear-gradient(#bbceda, #cbeedb); } }

@keyframes slidein {
  from {
    width: 10%; }
  to {
    width: 70%; } }

@keyframes slidelink {
  from {
    width: 10%; }
  to {
    width: 100%; } }

@keyframes slidetop {
  from {
    margin-bottom: -10%; }
  to {
    margin-bottom: 0%; } }

@keyframes fadein {
  from {
    opacity: 30%; }
  to {
    opacity: 100%; } }

@keyframes fadeout {
  from {
    opacity: 100%; }
  to {
    opacity: 50%; } }

@keyframes bn {
  from {
    filter: grayscale(0); }
  to {
    filter: grayscale(100); } }

header {
  grid-area: nav; }

.navbar {
  height: auto; }

.navbar-nav {
  display: inline-block;
  text-align: right;
  direction: row;
  margin-left: 80%; }

.navbar-brand {
  font-size: 2rem; }

.nav-item {
  font-size: 1.5rem;
  margin-left: -10%;
  width: 100%; }

.navbar-toggler {
  font-size: 1rem;
  margin-left: -20%; }

html {
  font-size: 62.5%; }

* {
  margin: 0px;
  padding: 0px; }

* {
  margin: 0px;
  padding: 0px; }

.gridhome {
  display: grid;
  grid-template-areas: "nav"
 "main"
 "footer";
  grid-template-rows: 0.1rem auto auto;
  row-gap: 2%; }

main {
  grid-area: main; }

.container-fluid {
  align-content: center;
  padding: 5%;
  font-size: 2rem; }

h2 {
  margin-top: 1rem;
  color: #151515;
  font-size: 1rem;
  font-weight: lighter; }

ul {
  text-decoration: none; }

a {
  color: blanchedalmond;
  text-decoration: none; }

.enviar {
  font: 2rem sans-serif; }

.icono {
  width: 10px;
  height: 10px; }

.separate {
  margin-top: 5%; }

.separate2 {
  margin-bottom: 10%; }

footer {
  grid-area: footer;
  text-decoration: none;
  background-color: white;
  text-decoration: none; }

.footerflex {
  border-radius: 0.1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 4rem;
  font-size: 1.5rem;
  text-align: center; }

.landingph {
  margin-top: 8%;
  animation-name: fadein;
  animation-duration: 10s;
  margin-bottom: 8%; }

.foto {
  border-radius: 5px;
  margin-bottom: 2%; }

.foto:hover {
  animation-name: bn;
  animation-duration: 4s;
  animation-fill-mode: forwards; }


/* chat gpt agregado

/* ABOUT — blanco, negro, editorial */
.about {
  grid-area: main;
}

.about-section {
  background: #ffffff;
  padding: 6rem 0 7rem;
}

/* texto */
.about-text {
  font-size: clamp(1.7rem, 1.2vw, 2.1rem);
  line-height: 1.85;
  color: #000000;
  text-align: justify;
  text-justify: inter-word;
  max-width: 72ch;
}


/* párrafos */
.about-text p {
  margin: 0 0 2.4rem;
  font-weight: 400;     /* sin negritas */
}

/* anula centrados heredados */
.about * {
  text-align: justify !important;
}

/* links (si aparecen) */
.about a {
  color: #000000;
  text-decoration: underline;
  text-underline-offset: 0.25em;
}


/* ABOUT — aire lateral en mobile */
@media (max-width: 576px) {
  .about-section {
    padding-left: 2.2rem;
    padding-right: 2.2rem;
  }
}