/*  
	Theme Name: Kala 
	Version: 1.0 2025
	Author: hctr
*/

/*********************************************************************************/
/************************************************************************* RESET */
/*********************************************************************************/

h1,
h2,
h3,
h4,
h5 {
  text-wrap: balance;
}

p {
  text-wrap: pretty;
}

figure {
  margin: 0;
}

/*********************************************************************************/
/************************************************************************* FONTS */
/*********************************************************************************/

@font-face {
  font-family: "Ceraph";
  src:
    url("./fonts/CeraphTrial-Regular.woff2") format("woff2"),
    url("./fonts/CeraphTrial-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "PP Neue Montreal";
  src: url("./fonts/PPNeueMontreal-Medium.eot");
  src:
    url("./fonts/PPNeueMontreal-Medium.eot?#iefix") format("embedded-opentype"),
    url("./fonts/PPNeueMontreal-Medium.woff2") format("woff2"),
    url("./fonts/PPNeueMontreal-Medium.woff") format("woff"),
    url("./fonts/PPNeueMontreal-Medium.ttf") format("truetype"),
    url("./fonts/PPNeueMontreal-Medium.svg#PPNeueMontreal-Medium") format("svg");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "PP Neue Montreal Book";
  src: url("./fonts/PPNeueMontreal-Book.eot");
  src:
    url("./fonts/PPNeueMontreal-Book.eot?#iefix") format("embedded-opentype"),
    url("./fonts/PPNeueMontreal-Book.woff2") format("woff2"),
    url("./fonts/PPNeueMontreal-Book.woff") format("woff"),
    url("./fonts/PPNeueMontreal-Book.ttf") format("truetype"),
    url("./fonts/PPNeueMontreal-Book.svg#PPNeueMontreal-Book") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/*********************************************************************************/
/*********************************************************************** GENERAL */
/*********************************************************************************/

:root {
  --color--white: rgb(255, 255, 255);
  --color--light: #fffdf5;
  --color--blue: rgb(65, 97, 173);
  --font--ceraph: "Ceraph", sans-serif;
  --font--pp: "PP Neue Montreal";
  --size--20: clamp(14px, 2vw, 2rem);
  --size--22: clamp(16px, 2vw, 2.2rem);
  --size--25: clamp(16px, 2vw, 2.5rem);
  --size--36: clamp(22px, 2vw, 3.6rem);
  --size--38: clamp(22px, 2vw, 3.8rem);
  --size--40: clamp(24px, 2vw, 4rem);
  --size--43: clamp(25px, 2vw, 4.3rem);
  --size--50: clamp(26px, 3vw, 5rem);
  --size--55: clamp(28px, 3vw, 5.5rem);
  --size--70: clamp(30px, 4vw, 7rem);
}

* {
  box-sizing: border-box;
  position: relative;
  margin: 0;
  padding: 0;
  font-family: "PP Neue Montreal Book";
  -webkit-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -ms-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}

html {
  font-size: 10px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "kern", "liga";
}

@media (min-width: 2559px) {
  html {
    font-size: 13.2px;
  }
}

@media (max-width: 1919px) {
  html {
    font-size: 7.5px;
  }
}

@media (max-width: 1279px) {
  html {
    font-size: 8px;
  }
}

@media (max-width: 959px) {
  html {
    font-size: 7px;
  }
}

@media (max-width: 799px) {
  html {
    font-size: 6px;
  }
}

@media (max-width: 639px) {
  html {
    font-size: 5.5px;
  }
}

@media (max-width: 479px) {
  html {
    font-size: 5px;
  }
}

body {
  min-height: 100dvh;
  margin: 0;
  padding: 0;
  background-color: var(--color--light);
  font-variant-ligatures: common-ligatures;
  font-feature-settings:
    "liga" 1,
    "clig" 1;
}

.fade-in {
  opacity: 0;
  transition: opacity 1s ease-out;
}

.appear {
  opacity: 1;
}

/*********************************************************************************/
/*********************************************************************** CLASSES */
/*********************************************************************************/

/* MAIN */

main.blue {
  background: var(--color--blue);
}

.mainBlog {
  padding-top: 21.91rem;
}

/* CABECERA */

.cabecera {
  width: 100%;
  height: 100vh;
  min-height: 87.5rem;
  padding: 0 0 7.4rem 0;
}

.cabecera__container {
  width: 100%;
  height: calc(100% - 10.45rem);
  min-height: 100vh;
  padding: 0;
  display: flex;
  flex-direction: column-reverse;
  justify-content: flex-start;
  align-items: center;
}

.cabecera__contenido {
  flex: 0.22 1 0;
  min-height: 0;
  width: 100%;
  padding: 7.4rem 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  align-items: center;
  row-gap: 25.4rem;
}

.cabecera__contenido h1 {
  order: 1;
  flex: 0.33 0.33 33%;
  font-family: var(--font--ceraph);
  font-size: var(--size--36);
  font-weight: normal;
  color: white;
  text-transform: uppercase;
  text-align: center;
}

.cabecera__contenido p,
.cabecera__texto--movil {
  order: 4;
  flex: 1 1 100%;
  width: 100%;
  font-family: var(--font--ceraph);
  font-size: var(--size--38);
  font-style: italic;
  color: white;
  text-align: center;
}

.cabecera__texto--movil {
  display: none;
}

.cabecera__contenido div {
  order: 2;
  flex: 0.33 0.33 33%;
  max-width: 50.9rem;
  aspect-ratio: 509 / 145;
  background-image: url("./img/kala-logo-light.svg");
  background-size: cover;
  background-repeat: no-repeat;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap;
}

.cabecera__contenido ul {
  order: 3;
  flex: 0.33 0.33 33%;
  list-style: none;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 3rem;
}

.cabecera__contenido li {
  font-size: var(--size--20);
  text-transform: uppercase;
  color: white;
  display: flex;
  align-items: center;
  gap: 3rem;
}

.cabecera__contenido li::after {
  content: "/";
  color: white;
}

.cabecera__contenido li:last-child:after {
  content: "";
  display: none;
}

.cabecera__imagen {
  flex: 0.78 1 0;
  min-height: 0;
  width: 100%;
}

.cabecera__imagen picture {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 1855 / 749;
}

.cabecera__imagen picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 959px) {
  .cabecera__contenido div {
    max-width: 20rem;
  }
}
@media (max-width: 799px) {
  .cabecera {
    height: auto;
    min-height: auto;
  }
  .cabecera__container {
    height: auto;
    min-height: auto;
    flex-direction: column;
  }
  .cabecera__imagen {
    flex: 1;
    width: 100%;
    height: auto;
  }
  .cabecera__imagen picture {
    aspect-ratio: 4 / 3;
  }
  .cabecera__contenido {
    flex: 1;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    row-gap: 4rem;
    padding: 2rem 0;
  }
  .cabecera__contenido h1 {
    order: 2;
  }
  .cabecera__contenido div {
    order: 1;
    width: 100%;
    max-width: 25rem;
  }
  .cabecera__contenido p {
    display: none;
  }
  .cabecera__texto--movil {
    display: block;
    padding: 4rem 3rem 0 3rem;
  }
}
@media (max-width: 479px) {
  .cabecera__imagen picture {
    aspect-ratio: 1 / 1;
  }
  .cabecera__contenido li {
    font-size: 12px;
  }
}
@media (max-width: 479px) {
  .cabecera__container {
    gap: 3rem;
  }
  .cabecera__imagen picture {
    aspect-ratio: 3 / 4;
  }
  .cabecera__texto--movil {
    padding-top: 3rem;
  }
}

/* PRESENTACIÓN */

.presentacion {
  width: 100%;
  padding: 5.8rem 0 13.9rem 0;
}

.presentacion__container {
  width: 100%;
  padding: 0 2.95rem;
}

.presentacion p {
  width: 100%;
  font-family: var(--font--ceraph);
  font-size: var(--size--38);
  font-style: italic;
  color: white;
  text-align: center;
}

@media (max-width: 799px) {
  .presentacion {
    display: none;
  }
}

/* NOSOTROS */

.nosotros {
  width: 100%;
  padding: 0 10.3rem;
}

.nosotros__container {
  width: 100%;
  padding: 12.2rem 7.4rem 10.5rem 7.4rem;
  border-top: 0.1rem solid white;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 5%;
}

.nosotros__contenido {
  flex: 0.55 0.55 55%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.nosotros__contenido h2 {
  order: 3;
  max-width: 52.2rem;
  font-family: var(--font--ceraph);
  font-size: var(--size--50);
  font-weight: normal;
  font-style: italic;
  line-height: 1;
  color: white;
  text-align: center;
  margin-bottom: 8.3rem;
}

.nosotros__contenido h3 {
  order: 1;
  max-width: 52.2rem;
  font-family: var(--font--ceraph);
  font-size: var(--size--70);
  font-weight: normal;
  line-height: 1;
  text-transform: uppercase;
  color: white;
  text-align: center;
  margin-bottom: 6.5rem;
}

.nosotros__contenido span {
  order: 2;
  max-width: 52.2rem;
  width: 4.27rem;
  height: 3.68rem;
  background-image: url(./img/kala-espiral.svg);
  background-size: cover;
  background-repeat: no-repeat;
  margin-bottom: 4.7rem;
}

.nosotros__contenido p {
  order: 4;
  max-width: 52.2rem;
  font-size: var(--size--25);
  color: white;
  line-height: 1.4;
  text-align: justify;
  hyphens: auto;
  text-align-last: center;
}

.nosotros__imagen {
  flex: 0.45 0.45 45%;
}

.nosotros__imagen picture {
  display: block;
  width: 100%;
  aspect-ratio: 664 / 843;
}

.nosotros__imagen picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 1279px) {
  .nosotros__container {
    padding: 12.2rem 0 10.5rem 0;
  }
}
@media (max-width: 799px) {
  .nosotros__container {
    flex-direction: column-reverse;
    row-gap: 10rem;
  }
}

/* EXPERIENCIAS */

.experiencia {
  width: 100%;
  padding: 0 10.3rem;
}

.experiencia__container {
  width: 100%;
  padding: 15.3rem 0;
  border-top: 0.1rem solid white;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.experiencia h2 {
  flex: 0.1 1 0;
  max-width: 55rem;
  margin: auto auto 15.6rem auto;
  font-family: var(--font--ceraph);
  font-size: var(--size--70);
  font-weight: normal;
  text-transform: uppercase;
  text-align: center;
  line-height: 1;
  color: white;
  white-space: break-spaces;
}

.experiencia__columnas {
  flex: 0.9 1 0;
  width: 100%;
  padding: 0 25.2rem;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8%;
}

.experiencia__columna {
  flex: 1 0.3 30%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.experiencia__columna:nth-child(2) {
  /*margin-top: 34.7rem;*/
}

.experiencia__columna:nth-child(3) {
  /*margin-top: 64.5rem;*/
}

.experiencia__columna picture {
  width: 100%;
  display: block;
  line-height: 0;
  aspect-ratio: 332 / 390;
  border-top-left-radius: 100rem;
  border-top-right-radius: 100rem;
  overflow: hidden;
}

.experiencia__columna picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.experiencia__columna h3 {
  min-height: 20.6rem;
  font-family: var(--font--ceraph);
  font-size: var(--size--43);
  font-weight: normal;
  font-style: italic;
  line-height: 1;
  color: white;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}

.experiencia__columna p {
  flex: 0.2 1 0;
  font-size: var(--size--22);
  color: white;
  line-height: 1.4;
  text-align: justify;
  hyphens: auto;
  text-align-last: center;
}

@media (max-width: 1279px) {
  .experiencia__columnas {
    padding: 0;
  }
}
@media (max-width: 799px) {
  .experiencia__columnas {
    flex-direction: column;
    row-gap: 10rem;
  }
  .experiencia__columna:nth-child(2) {
    margin-top: 0;
  }
  .experiencia__columna:nth-child(3) {
    margin-top: 0;
  }
}

/* DESCUBRE */

.descubre {
  width: 100%;
  background-color: var(--color--light);
}

.descubre picture {
  display: block;
  width: 100%;
  aspect-ratio: 1920 / 556;
}

.descubre picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.descubre__contenido {
  width: 100%;
  max-width: 75rem;
  padding: 16.8rem 2.95rem 18.7rem 2.95rem;
  margin: auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}

.descubre h3 {
  font-family: var(--font--ceraph);
  font-size: var(--size--70);
  font-weight: normal;
  line-height: 1;
  text-transform: uppercase;
  color: var(--color--blue);
  text-align: center;
  margin-bottom: 7rem;
}

.descubre h4 {
  font-family: var(--font--ceraph);
  font-size: var(--size--50);
  font-weight: normal;
  font-style: italic;
  line-height: 1;
  color: var(--color--blue);
  text-align: center;
  text-wrap: auto;
  margin-bottom: 8.8rem;
}

.descubre a {
  font-size: var(--size--25);
  text-transform: uppercase;
  color: var(--color--blue);
  text-decoration: none;
}

@media (max-width: 799px) {
  .descubre picture {
    aspect-ratio: 4 / 3;
  }
}
@media (max-width: 479px) {
  .descubre picture {
    aspect-ratio: 1 / 1;
  }
}

/* ENCUENTRANOS */

.encuentranos {
  width: 100%;
  background-color: var(--color--light);
}

.encuentranos__cabecera {
  width: 100%;
  padding: 0 10.3rem;
}

.encuentranos__cabecera h3 {
  font-family: var(--font--ceraph);
  font-size: var(--size--70);
  font-weight: normal;
  line-height: 1;
  text-transform: uppercase;
  color: var(--color--blue);
  text-align: center;
  margin-bottom: 16.6rem;
  padding-top: 12.9rem;
  border-top: 0.1rem solid var(--color--blue);
}

.encuentranos__columnas {
  width: 100%;
}

.encuentranos__columna h4 {
  font-family: var(--font--pp);
  font-size: var(--size--25);
  font-weight: normal;
  line-height: 1;
  color: var(--color--blue);
  text-transform: uppercase;
  margin-bottom: 1rem;
}

.encuentranos__columna:first-child h4 {
  padding-left: 2.1rem;
}

.encuentranos__columna p {
  font-size: var(--size--25);
  text-transform: uppercase;
  line-height: 1;
  color: var(--color--blue);
  margin-bottom: 2.1rem;
}

.encuentranos__columna:first-child p {
  padding-left: 2.1rem;
}

.encuentranos__columna picture {
  display: block;
  width: 100%;
  aspect-ratio: 630 / 797;
}

.encuentranos__columna picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
  color: var(--color--blue);
}

.swiper-button-next {
  right: 2.1rem !important;
}

.swiper-button-prev {
  left: 2.1rem !important;
}

@media (max-width: 799px) {
  .swiper-button-next:after,
  .swiper-button-prev:after {
    font-size: var(--size--40) !important;
  }
}
@media (max-width: 479px) {
  .encuentranos__columna h4 {
    padding-left: 2.1rem;
  }
  .encuentranos__columna p {
    padding-left: 2.1rem;
  }
}

/* CONTACTO */

.contacto {
  width: 100%;
  padding: 0 10.3rem;
  background-color: var(--color--light);
}

.contacto__container {
  width: 100%;
  max-width: 82rem;
  margin: auto;
  padding: 20.5rem 0 11.6rem 0;
}

.contacto h3 {
  font-family: var(--font--ceraph);
  font-size: var(--size--70);
  font-weight: normal;
  line-height: 1;
  text-transform: uppercase;
  color: var(--color--blue);
  text-align: center;
  margin-bottom: 16.6rem;
  margin-bottom: 7.5rem;
}

.contacto h4 {
  font-family: var(--font--ceraph);
  font-size: var(--size--50);
  font-weight: normal;
  font-style: italic;
  line-height: 1;
  color: var(--color--blue);
  text-align: center;
  margin-bottom: 8rem;
}

.contacto h4 span {
  font-family: var(--font--ceraph);
  font-size: var(--size--50);
  font-style: italic;
  display: inline-block;
  transform: rotate(180deg);
  transform-origin: center;
  margin-right: -1rem;
}

.contacto__texto {
  width: 100%;
  margin-bottom: 13rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
}

.contacto__texto p {
  font-size: var(--size--25);
  text-transform: uppercase;
  color: var(--color--blue);
  border-bottom: 0.1rem solid var(--color--blue);
  padding-bottom: 0.25rem;
}

.contacto__texto span {
  font-size: var(--size--25);
  text-transform: uppercase;
  color: var(--color--blue);
}

.contacto__texto a {
  font-size: var(--size--25);
  text-transform: uppercase;
  text-decoration: none;
  color: var(--color--blue);
  padding-bottom: 0.25rem;
}

.contacto__texto a:hover {
  border-bottom: 0.1rem solid var(--color--blue);
}

.contacto form p {
  margin-bottom: 6.4rem;
}

.contacto form label {
  font-size: var(--size--25);
  text-transform: uppercase;
  color: var(--color--blue);
  border-bottom: 0.1rem solid var(--color--blue);
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.contacto form span {
  width: calc(100% - 15rem);
}

.contacto form input {
  appearance: none;
  background: transparent;
  border: 0;
  width: 100%;
  font-size: var(--size--25);
  color: var(--color--blue);
}

.contacto form input:hover,
.contacto form input:focus,
.contacto form input:active,
.contacto form input:focus-visible {
  outline: none;
}

.contacto form textarea {
  appearance: none;
  background: transparent;
  border: 0;
  width: 100%;
  max-height: 12.9rem;
  resize: none;
  font-size: var(--size--25);
  color: var(--color--blue);
}

.contacto form textarea:hover,
.contacto form textarea:focus,
.contacto form textarea:active,
.contacto form textarea:focus-visible {
  outline: none;
}

.contacto form input[type="submit"] {
  appearance: none;
  background: transparent;
  border: 0;
  width: fit-content;
  display: flex;
  justify-content: center;
  margin: 10rem auto auto auto;
  font-size: var(--size--25);
  color: var(--color--blue);
  text-transform: uppercase;
  border-bottom: 0.1rem solid var(--color--blue);
  cursor: pointer;
}

.contacto .wpcf7-spinner {
  display: none;
}

/* FOOTER */

.footer {
  width: 100%;
  padding: 6.2rem 0;
  background-color: var(--color--blue);
}

.footer__container {
  width: 100%;
  padding: 0 8.4rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 9%;
}

.footer h2 {
  order: 3;
  flex: 0.5 0.5 calc(50% - 12.4rem);
  font-family: var(--font--ceraph);
  font-size: var(--size--55);
  font-weight: normal;
  line-height: 1;
  text-transform: uppercase;
  text-align: right;
  color: white;
}

.footer__logo {
  order: 2;
  width: 24.8rem;
  min-width: 24.8rem;
  aspect-ratio: 1 / 1;
  background-image: url("./img/kala-logo-circle-light.svg");
  background-repeat: no-repeat;
  background-size: cover;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

.footer__enlaces {
  order: 1;
  flex: 0.5 0.5 calc(50% - 12.4rem);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.footer__enlaces ul {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.5rem;
  row-gap: 0.5rem;
}

.footer__enlaces ul:first-child {
  margin-bottom: 1rem;
}

.footer__enlaces li {
  display: flex;
  gap: 1.5rem;
}

.footer__enlaces li::before {
  content: " / ";
  color: white;
  font-size: var(--size--20);
}

.footer__enlaces li:first-child:before {
  content: "";
  display: none;
}

.footer__enlaces li a {
  font-size: var(--size--20);
  text-transform: uppercase;
  color: white;
  text-decoration: none;
}

.footer__enlaces__instagram {
  border-bottom: 0.1rem solid white;
  padding-bottom: 0.2rem;
}

@media (max-width: 799px) {
  .footer__container {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 5rem;
  }
  .footer h2 {
    order: 2;
    text-align: center;
  }
  .footer__logo {
    order: 1;
  }
  .footer__enlaces {
    order: 3;
    align-items: center;
  }
  .footer__enlaces ul {
    align-items: center;
  }
}
@media (max-width: 479px) {
  .footer__enlaces ul:last-child {
    flex-direction: column;
    row-gap: 1rem;
  }
  .footer__enlaces ul:last-child li::before {
    display: none;
  }
}

/* HEADER */

.header {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  padding: 2rem 15%;
  display: flex;
  justify-content: space-around;
  align-items: center;
  background-color: var(--color--light);
}

.header__home {
  position: fixed;
  top: -21.91rem;
}

.header__fixed {
  position: fixed;
  top: 0 !important;
}

.header__blog {
  background-color: var(--color--blue) !important;
}

.header div {
  order: 2;
  width: 22.94rem;
  aspect-ratio: 416 / 159;
  background-image: url("./img/kala-logo-dark-2.svg");
  background-repeat: no-repeat;
  background-size: cover;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

.header__blog div {
  background-image: url("./img/kala-logo-light-2.svg");
}

.header div a {
  display: block;
  width: 100%;
  height: 100%;
}

.header div a.active {
  border-bottom: 0.1rem solid var(--color--blue);
  padding-bottom: 0.2rem;
}

.header a:nth-child(2) {
  order: 1;
  font-family: var(--font--pp);
  font-size: var(--size--22);
  color: var(--color--blue);
  text-decoration: none;
  text-transform: uppercase;
}

.header a:nth-child(3) {
  order: 3;
  font-family: var(--font--pp);
  font-size: var(--size--22);
  color: var(--color--blue);
  text-decoration: none;
  text-transform: uppercase;
}

.header__blog a:nth-child(2),
.header__blog a:nth-child(3) {
  color: var(--color--light);
}

.header__blog a.active {
  border-bottom: 0.1rem solid var(--color--light);
  padding-bottom: 0.2rem;
}

@media (max-width: 799px) {
  .header {
    padding: 2rem 2.95rem;
  }
  .header div {
    order: 1;
  }
  .header a:nth-child(2) {
    order: 2;
    margin: auto 3rem auto auto;
  }
  .header a:nth-child(3) {
    order: 3;
  }
}

/* BLOG CABECERA */

.blogCabecera {
  width: 100%;
  padding: 14.9rem 0 14.5rem 0;
}

.blogCabecera__container {
  width: 100%;
  padding: 0 10.3rem;
}

.blogCabecera h1 {
  font-family: var(--font--ceraph);
  font-size: var(--size--70);
  font-weight: normal;
  line-height: 1;
  text-transform: uppercase;
  color: var(--color--blue);
  text-align: center;
  margin-bottom: 7.5rem;
}

.blogCabecera__significado {
  max-width: 139.1rem;
  margin: auto auto 7.6rem auto;
  font-family: var(--font--ceraph);
  font-size: var(--size--40);
  font-style: italic;
  color: var(--color--blue);
  text-align: center;
}

.blogCabecera__significado span {
  font-family: Helvetica, sans-serif;
  font-size: var(--size--36);
  font-weight: 300;
  font-style: normal;
}

.blogCabecera__texto {
  max-width: 89rem;
  margin: auto;
  font-size: var(--size--25);
  text-align: justify;
  hyphens: auto;
  text-align-last: center;
  color: var(--color--blue);
}

/* BLOG CONTNEIDO */

.blogContenido {
  width: 100%;
  padding: 0 0 12.4rem 0;
}

.blogContenido__container {
  width: 100%;
  padding: 0 10.3rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 5%;
  row-gap: 8.7rem;
}

.blogContenido__post {
  flex: 0.3 0.3 30%;
  max-width: 30%;
}

.blogContenido__post a {
  display: block;
  text-decoration: none;
}

.blogContenido__post picture {
  display: block;
  width: 100%;
  aspect-ratio: 532 / 676;
  margin-bottom: 3rem;
}

.blogContenido__post picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.blogContenido__post h2 {
  font-family: var(--font--ceraph);
  font-size: var(--size--70);
  font-weight: normal;
  line-height: 1;
  text-transform: uppercase;
  color: var(--color--blue);
  text-align: center;
  margin-bottom: 5.9rem;
}

.blogContenido__post p {
  font-family: var(--font--ceraph);
  font-size: var(--size--40);
  font-weight: normal;
  font-style: italic;
  line-height: 1;
  text-align: center;
  margin-bottom: 4.1rem;
  color: var(--color--blue);
}

.blogContenido__leer {
  font-size: var(--size--25);
  font-weight: normal;
  text-decoration: none;
  text-transform: uppercase;
  text-align: center;
  color: var(--color--blue);
}

.blogContenido__paginado {
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 1.5rem;
}

.blogContenido__paginado * {
  font-size: var(--size--25);
  color: var(--color--blue);
}

.blogContenido__paginado a {
  color: var(--color--blue);
  text-decoration: none;
}

@media (max-width: 799px) {
  .blogContenido__post {
    flex: 0.47 0.47 47.5%;
    max-width: 47.5%;
  }
}
@media (max-width: 639px) {
  .blogContenido__post {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

/* POST */

.post {
  width: 100%;
  padding: 12.4rem 0;
}

.post__container {
  width: 100%;
  max-width: 102.4rem;
  padding: 0 10.3rem;
  margin: auto;
}

.post h1 {
  font-family: var(--font--ceraph);
  font-size: var(--size--70);
  font-weight: normal;
  line-height: 1;
  text-transform: uppercase;
  text-align: center;
  color: var(--color--blue);
  margin-bottom: 2.5rem;
}

.post__excerpt {
  font-family: var(--font--ceraph);
  font-size: var(--size--40);
  font-weight: normal;
  font-style: italic;
  text-align: center;
  line-height: 1;
  color: var(--color--blue);
  margin-bottom: 5.5rem;
}

.post__contenido * {
  font-size: var(--size--25);
  line-height: 1.5;
  color: var(--color--blue);
  text-align: justify;
  hyphens: auto;
}

/* PAGE */

.page {
  width: 100%;
  padding: 12.4rem 2.95rem;
}

.page__container {
  width: 100%;
  max-width: 144rem;
  padding: 5rem 0;
  margin: auto;
}

.page__container h1 {
  font-family: var(--font--ceraph);
  font-size: var(--size--70);
  font-weight: normal;
  line-height: 1;
  text-transform: uppercase;
  text-align: center;
  color: var(--color--blue);
  margin-bottom: 5.5rem;
}

.page__container h2 {
  font-family: var(--font--ceraph);
  font-size: var(--size--50);
  font-weight: normal;
  line-height: 1;
  color: var(--color--blue);
  margin-bottom: 5.5rem;
}

.page__container h3 {
  font-size: var(--size--40);
  font-weight: normal;
  line-height: 1;
  text-transform: uppercase;
  color: var(--color--blue);
  margin-bottom: 5.5rem;
}

.page__container p {
  font-size: var(--size--25);
  line-height: 1.5;
  color: var(--color--blue);
  text-align: justify;
  hyphens: auto;
  margin-bottom: 5.5rem;
}

.page__container ul,
.page__container ol {
  margin-left: 5rem;
  margin-bottom: 5.5rem;
}

.page__container ul {
  list-style: disc;
}

.page__container ol {
  list-style: decimal;
}

.page__container ul li,
.page__container ol li {
  font-size: var(--size--25);
  line-height: 1.5;
  color: var(--color--blue);
  text-align: justify;
  hyphens: auto;
}

.page__container a {
  text-decoration: underline;
  color: var(--color--blue);
}
