/*
 Theme Name:   bootScore Child
 Description:  bootScore Child Theme
 Author:       bootScore
 Author URI:   https://bootscore.me
 Template:     bootscore-main
 Version:      5.3.0
 Text Domain:  bootscore
*/

/*----Generales----*/
:root {
  --as-primary: #c41b13;
  --as-light-primary: #f22318;
  --as-secondary: #037b3a;
  --as-light-secondary: #5ee099;
  --as-superlight-secondary: #edfcf3;
  --as-dark-gray: #352b32;
  --as-gray: #c5c2c4;
  --as-light-gray: #efecee;
  --as-dark-primary: #78110c;
  --as-dark-secondary: #104729;
}

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

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

@font-face {
  font-family: "Source Sans Pro";
  src: url("fonts/SourceSansPro-Light.woff2") format("woff2"), url("fonts/SourceSansPro-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Source Sans Pro";
}

/*--Textos--*/


h1,
h2,
h3,
h4,
h5,
h6,
a {
  font-family: "Oswald";
}

a {
  color: var(--as-secondary);
}

h1,
h2 {
  text-transform: uppercase;
}



.h2 {
  color: var(--as-secondary);
  font-weight: 600;
}



.lead {
  font-size: 1.7rem;
  line-height: 2.5rem;
}

/*--botones--*/
.btn-primary {
  border: 2px solid var(--as-secondary);
  background-color: transparent;
  color: var(--as-secondary);
  border-radius: 0;
  text-transform: uppercase;
  font-weight: 600;
}

.btn-primary:hover {
  background-color: var(--as-secondary);
  color: #fff;
  border: 2px solid var(--as-secondary);
}

.btn-white {
  border: 2px solid #fff;
  background-color: transparent;
  color: #fff;
  border-radius: 0;
  text-transform: uppercase;
  font-weight: 600;
}

.btn-white:hover {
  background-color: #fff;
  color: var(--as-secondary);
  border: 2px solid var(--as-secondary);
}

/*--Generales--*/
.bg-dark-secondary {
  background: var(--as-dark-secondary);
}

.bg-dark-gray {
  background-color: var(--as-dark-gray);
}

.bg-gray {
  background-color: var(--as-gray);
}

.bg-light-gray {
  background-color: var(--as-light-gray);
}

.h2,
.blog .card .h3,
.que-hacemos .porfolio .tab-content .h3 {
  position: relative;
}

.h2:before,
.blog .card .h3:before,
.que-hacemos .porfolio .tab-content .h3:before {
  position: absolute;
  content: "";
  top: -0.5rem;
  bottom: -0.5rem;
  left: -1rem;
  width: 5px;
  background-color: var(--as-secondary);
}

.move-on-scroll,
.move-on-scroll-x {
  transition: transform 3s ease-out;
}

.search-form {
  border-radius: 50px;
  border: 1px solid var(--as-secondary);
  padding: 0.3rem 0.5rem;
}

.search-form label {
  flex-grow: 1;
}

.search-form input {
  border: 0;
  outline: 0;
  background-color: transparent;
}

.search-form .search-submit {
  background-color: transparent;
  border: 0;
}

/*--Tools--*/

/*----Header----*/
.wpml-ls-legacy-dropdown {
  width: unset !important;
}



.top-menu {
  background-color: var(--as-secondary);
}

.top-menu .custom-html-widget a {
  color: #fff;
  text-decoration: none;
}

#bootscore-navbar .nav-link {
  color: var(--as-secondary);
  position: relative;
  font-size: .9rem;

}

.navbar-brand img {
  max-width: 11rem;
}

.offcanvas-logo img {
  max-width: 9rem;
}

.navbar-nav .menu-item .nav-link {
  color: var(--as-secondary);
  font-weight: bold;

}


#nav-main .dropdown-item {
  color: var(--as-secondary) !important;
  background-color: var(--as-light-gray) !important;
}



#nav-main .dropdown-item:hover {
  color: var(--as-light-gray) !important;
  background-color: var(--as-secondary) !important;
}

#nav-main .dropdown-menu {
  border: none !important;
  background-color: transparent;
}


/*----Home----*/

.home-hero {
  margin-top: 12rem;

}

.hero-grid {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  grid-template-rows: auto 1fr;
  grid-auto-columns: 1fr;
  grid-auto-rows: 1fr;
  gap: 0px 0px;
  grid-auto-flow: column;
}

.hero-info {
  grid-area: 1 / 1 / 2 / 3;
  padding: 2rem;
  text-align: center;
}

.hero-bg {
  grid-area: 2 / 1 / 3 / 3;
  position: relative;
  overflow: clip;
}

.hero-bg img:nth-child(1) {
  filter: saturate(0);
  opacity: 0.2;
  box-shadow: -10px 14px 34px 0px rgba(0, 0, 0, 0.25);
  max-width: 90%;
  display: block;
  margin: 0 auto;
  height: 100%;
  object-fit: cover;
}

.hero-bg img:nth-child(2) {
  position: absolute;
  bottom: 0;
  right: 5rem;
  width: 70%;
}

.hero-bg .move-on-scroll-x {
  position: absolute;
  bottom: 10%;
  left: 50%;
  height: 25%;
  right: 0;
  background-color: var(--as-primary);
  mix-blend-mode: darken;
}

.home-page .somos {
  margin-top: 3rem;
  margin-bottom: 3rem;
  position: relative;
}

.home-page .somos:after {
  position: absolute;
  content: "";
  background: radial-gradient(circle, var(--as-dark-gray) 25%, transparent 26%);
  background-size: 3em 3em;
  opacity: 0.05;
  bottom: 0;
  right: 0;
  width: 250px;
  height: 400px;
}

.home-page .somos .h2 {
  position: relative;
}

.home-page .somos .somos-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(3, 1fr);
  gap: 1rem;
}

.home-page .somos .somos-grid figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-page .somos .somos-grid figure:first-child {
  grid-area: 1/1/2/2;
}

.home-page .somos .somos-grid figure:nth-child(2) {
  grid-area: 1/3/3/2;
  position: relative;
}

/*
.home-page .somos .somos-grid figure:nth-child(2):after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--as-light-primary);
  mix-blend-mode: color-dodge;
}*/

.home-page .somos .somos-grid figure:nth-child(3) {
  grid-area: 2/2/4/1;
  position: relative;
}

.home-page .somos .somos-grid figure:nth-child(3):after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--as-secondary);
  mix-blend-mode: screen;
}

.home-page .somos .somos-grid figure:last-child {
  grid-area: 3/3/4/2;
}

.home-page .que-nos-mueve {
  padding-top: 5rem;
  padding-bottom: 5rem;
  background-color: var(--as-light-gray);
  clip-path: polygon(100% 100%, 0% 100%, 0% 0%, 50% 7%, 100% 0%);
  position: relative;
}

.home-page .que-nos-mueve:after {
  position: absolute;
  content: "";
  background: radial-gradient(circle, var(--as-dark-gray) 25%, transparent 26%);
  background-size: 3em 3em;
  opacity: 0.05;
  bottom: 10%;
  left: 0;
  width: 400px;
  height: 300px;
}

.home-page .que-nos-mueve figure {
  position: relative;
  z-index: 1;
}

.home-page .que-nos-mueve figure:after {
  position: absolute;
  content: "";
  inset: 0;
  background: url("img/que-nos-mueve.jpg");
  opacity: 0.4;
  filter: grayscale(1);
  transform: translate(-4rem, 3rem);
  z-index: -1;
}

.home-page .que-nos-mueve figure .move-on-scroll {
  position: absolute;
  height: 100%;
  width: 33%;
  bottom: -33%;
  left: 10%;
  background-color: var(--as-secondary);
  mix-blend-mode: darken;
}

.home-page .actualidad {
  padding-top: 5rem;
  padding-bottom: 5rem;
  background: url("img/fondo-desierto.jpg");
  background-color: #fffe;
  background-repeat: no-repeat;
  background-blend-mode: color;
  background-size: cover;
}

.home-page .actualidad .card {
  color: #fff;
}

.home-page .actualidad .card-img-overlay {
  background: linear-gradient(0deg, rgba(53, 43, 50, 1) 0%, rgba(255, 255, 255, 0) 50%);
}

.home-page .actualidad .card .categoria {
  font-size: 1.2rem;
  color: #fff;
  position: relative;
  z-index: 1;
  font-weight: 600;
}

.home-page .actualidad .card .categoria:before {
  position: absolute;
  content: "";
  left: -16px;
  top: -5px;
  bottom: -5px;
  right: 30%;
  background-color: var(--as-secondary);
  z-index: -1;
  mix-blend-mode: multiply;
}

.home-page .actualidad .card {
  border-radius: 0;
  border: none;
}

.home-page .actualidad .card img {
  aspect-ratio: 2/3;
  object-fit: cover;
  border-radius: 0;
}

.home-page .actualidad .card .h3 {
  color: #fff;
  position: relative;
}

.home-page .actualidad .card .h3:before {
  position: absolute;
  background-color: #fff;
  content: "";
  top: -3px;
  bottom: -3px;
  left: -0.5rem;
  width: 3px;
  z-index: 2;
}

.home-page .actualidad .post:nth-child(4) {
  display: block;
}

.home-page .cta {
  color: #fff;
  position: relative;
}

.home-page .cta .contenido {
  padding-top: 8rem;
  padding-bottom: 8rem;
}

.home-page .cta .contenido>* {
  position: relative;
  z-index: 2;
}

.home-page .cta:after {
  position: absolute;
  content: "";
  background: radial-gradient(circle, var(--as-secondary) 25%, transparent 26%);
  background-size: 3em 3em;
  opacity: 0.4;
  bottom: 0;
  right: 50%;
  width: 400px;
  height: 400px;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
}

.home-page .cta .h2 {
  position: relative;
  color: #fff;
}

.home-page .cta .h2:before {
  position: absolute;
  content: "";
  top: -0.5rem;
  bottom: -0.5rem;
  left: -1rem;
  width: 5px;
  background-color: #fff;
}

.home-page .cta .columna-bg {
  background: url("img/ayudanos-a-defender-2.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom;
  min-height: 400px;
}

/* ----  Asociación ---- */
.asociacion .hero {
  margin-top: 10rem;
  margin-bottom: 10rem;
}

.asociacion .hero figure {
  position: relative;
}

.asociacion .hero figure .move-on-scroll {
  position: absolute;
  top: -5%;
  width: 33%;
  bottom: -5%;
  left: 10%;
  background-color: var(--as-light-primary);
  mix-blend-mode: darken;
}

.asociacion .nuestra-trayectoria {
  background-color: var(--as-light-gray);
  padding-top: 5rem;
  padding-bottom: 9rem;
  position: relative;
}

.asociacion .nuestra-trayectoria>* {
  position: relative;
  z-index: 1;
}

.asociacion .nuestra-trayectoria:after {
  position: absolute;
  content: "";
  background: radial-gradient(circle, var(--as-dark-gray) 25%, transparent 26%);
  background-size: 3em 3em;
  opacity: 0.05;
  top: 10%;
  right: 0%;
  width: 400px;
  height: 400px;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
}

.asociacion .nuestra-trayectoria figure {
  position: relative;
  z-index: 1;
}

.asociacion .nuestra-trayectoria figure:after {
  position: absolute;
  content: "";
  inset: 0;
  background: url("img/asociacion-nuestra-trayectoria.jpg");
  opacity: 0.4;
  filter: grayscale(1);
  transform: translate(-4rem, 3rem);
  z-index: -1;
}

.asociacion .nuestra-trayectoria figure .move-on-scroll {
  position: absolute;
  height: 100%;
  width: 33%;
  bottom: -5%;
  left: 10%;
  background-color: var(--as-secondary);
  mix-blend-mode: darken;
}

.asociacion .nuestros-propositos {
  padding-top: 7rem;
  padding-bottom: 5rem;
  clip-path: polygon(100% 100%, 0% 100%, 0% 0%, 50% 7%, 100% 0%);
  background: white;
  margin-top: -7rem;

  background: url("img/fondo-desierto.jpg");
  background-color: #fffe;
  background-repeat: no-repeat;
  background-blend-mode: color;
  background-size: cover;
}

.asociacion .nuestros-propositos .grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
}

.asociacion .nuestros-propositos figure {
  position: relative;
}

.asociacion .nuestros-propositos figure:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(53, 43, 50, 1) 0%, rgba(255, 255, 255, 0) 90%);
  padding: 2rem;
  border-radius: 0;
}

.asociacion .nuestros-propositos figure .h3 {
  position: absolute;
  bottom: 1rem;
  left: 1rem;
  right: 1rem;
  color: #fff;
  z-index: 2;
}

.asociacion .nuestros-propositos .grid img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 1;
}



.asociacion .el-equipo {
  position: relative;
}

.asociacion .el-equipo .contenido>* {
  position: relative;
  z-index: 1;
}

.asociacion .el-equipo:after {
  position: absolute;
  content: "";
  background: radial-gradient(circle, var(--as-dark-gray) 25%, transparent 26%);
  background-size: 3em 3em;
  opacity: 0.05;
  bottom: 0%;
  right: 0%;
  width: 400px;
  height: 400px;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
}

.asociacion .el-equipo img {
  aspect-ratio: 1;
  object-fit: cover;
}

/* ---- Organización ---- */
.organizacion .hero {
  padding-top: 7rem;
  padding-bottom: 4rem;
}

.organizacion .hero figure {
  position: relative;
}

.organizacion .hero figure .move-on-scroll-x {
  position: absolute;
  top: 20%;
  left: 0;
  height: 50%;
  right: 0;
  background-color: var(--as-secondary);
  mix-blend-mode: darken;
}

.organizacion .organigrama {
  padding-top: 3rem;
  padding-bottom: 5rem;
}

.organizacion .grid-organigrama {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: 2fr 2fr 1fr;
  gap: 2.5rem;
}

.organizacion .grid-organigrama>div {
  padding: 1rem;
}

.organizacion .grid-organigrama .h3 {
  font-family: "Oswald";
}

.organizacion .grid-organigrama .grupos-trabajo {
  position: relative;
  grid-area: 1/1/2/2;
  border: 1px solid var(--as-secondary);
  background-color: var(--as-superlight-secondary);
}

.organizacion .grid-organigrama .grupos-trabajo:after {
  position: absolute;
  content: "\2191";
  top: 104%;
  left: 50%;
  font-size: 3rem;
  transform: translate(-50%, -40%);
  font-weight: 600;
  color: var(--as-secondary);
}

.organizacion .grid-organigrama .grupos-trabajo>div>div {
  font-weight: 600;
  font-size: clamp(0.9rem, 2vw, 1rem);
}

.organizacion .grid-organigrama .areas {
  position: relative;
  grid-area: 1/2/2/4;
  border: 1px solid var(--as-dark-gray);
  font-size: clamp(0.9rem, 2vw, 1rem);
  line-height: 1.2rem;
  background-color: var(--as-light-gray);
}

.asamblea-general {
  position: relative;
}

.asamblea-general::before {
  position: absolute;
  content: "\2191";
  bottom: 323%;
  left: 67%;
  font-size: 3rem;
  transform: translate(-43%, -10%);
  font-weight: 600;
  color: var(--as-secondary);
}

.asamblea-general::after {
  position: absolute;
  content: '';
  bottom: 112%;
  left: 67%;
  transform: translateX(0px);
  font-weight: 600;
  background: var(--as-secondary);
  width: 4px;
  height: 18rem;
}

.organizacion .grid-organigrama .areas:after {
  position: absolute;
  content: "\2191";
  top: 104%;
  left: 75%;
  font-size: 3rem;
  transform: translate(-50%, -12%);
  font-weight: 600;
  color: var(--as-secondary);
}

.organizacion .grid-organigrama .areas p {
  margin-bottom: 0.5rem;
}

.organizacion .grid-organigrama .asamblea-permanente {
  position: relative;
  grid-area: 2/1/3/3;
  border: 1px solid var(--as-dark-gray);
  font-weight: 600;
  background-color: var(--as-gray);
}

.organizacion .grid-organigrama .asamblea-permanente:after {
  position: absolute;
  content: "\2191";
  top: 104%;
  left: 50%;
  font-size: 3rem;
  transform: translate(-50%, -40%);
  font-weight: 600;
  color: var(--as-secondary);
}

.organizacion .grid-organigrama .asamblea-permanente .p {
  font-size: clamp(0.9rem, 2vw, 1rem);
}

.organizacion .grid-organigrama .role {
  position: relative;
  grid-area: 2/3/3/3;
  border: 1px solid var(--as-secondary);
  font-weight: 600;
  font-size: clamp(0.9rem, 2vw, 1rem);
  background-color: var(--as-superlight-secondary);
}

.organizacion .grid-organigrama .role:after {
  position: absolute;
  content: "\2191";
  top: 104%;
  left: 50%;
  font-size: 3rem;
  transform: translate(-50%, -40%);
  font-weight: 600;
  color: var(--as-secondary);
}

.organizacion .grid-organigrama .asamblea-general {
  grid-area: 3/1/4/4;
  border: 1px solid var(--as-dark-gray);
  font-weight: 600;
  background-color: var(--as-light-gray);
}

.organizacion .auditorias {
  padding-top: 5rem;
  padding-bottom: 5rem;

  background: url("img/fondo-desierto.jpg");
  background-color: #fffe;
  background-repeat: no-repeat;
  background-blend-mode: color;
  background-size: cover;
  background-position: center;
}

.organizacion .auditorias .h3 {
  color: var(--as-secondary);
  font-weight: 600;
  font-size: 1.45rem;
}

.organizacion .documento:nth-child(2n + 1) {
  background-color: #e6e6e6;
}

/* ---- Qué hacemos ---- */
.que-hacemos .hero {
  padding-top: 10rem;
  padding-bottom: 10rem;
}

.que-hacemos .hero figure {
  position: relative;
}

.que-hacemos .hero figure .move-on-scroll {
  position: absolute;
  top: -33%;
  width: 33%;
  bottom: -33%;
  right: 10%;
  background-color: var(--as-light-primary);
  mix-blend-mode: darken;
}

.que-hacemos .porfolio {
  padding-top: 10rem;
  padding-bottom: 10rem;
  position: relative;
}

.que-hacemos .porfolio:after {
  position: absolute;
  content: "";
  background: radial-gradient(circle, var(--as-dark-gray) 25%, transparent 26%);
  background-size: 3em 3em;
  opacity: 0.05;
  top: 10%;
  right: 0;
  width: 300px;
  height: 300px;

}

.que-hacemos .porfolio .tab-content .h3,
.que-hacemos .porfolio .tab-content p {
  color: #fff;
}

.que-hacemos .porfolio .tab-content .h3 {
  text-transform: uppercase;
  font-family: 'Oswald';
  display: block;
  font-size: 1.15rem;
}

.que-hacemos .porfolio .tab-content .h3:before {
  background-color: #fff;
  top: -3px;
  bottom: -3px;
  left: -0.5rem;
  width: 3px;
}

.que-hacemos .porfolio .nav-pills .nav-link {
  border-radius: 0;
}

.que-hacemos .porfolio .nav-pills .nav-link.active,
.que-hacemos .porfolio .nav-pills .nav-link:hover {
  background: var(--as-secondary);
  border: 1px solid var(--as-secondary);
  color: #fff;
}

.que-hacemos .porfolio .card {
  border-radius: 0;
  box-shadow: 20px 24px 24px 0px rgba(0, 0, 0, 0.25);
}



.que-hacemos .porfolio .card .card-img-overlay {
  background: linear-gradient(13deg, rgb(35 34 35 / 79%) 0%, rgba(255, 255, 255, 0) 50%);
  padding: 1rem;
  border-radius: 0;
}

.que-hacemos .porfolio img {
  aspect-ratio: 3/4;
  object-fit: cover;
  border-radius: 0;
}

.que-hacemos .porfolio .categoria {
  position: relative;
  padding: 0.5rem;
  padding-left: 2rem;
  left: -2rem;
  bottom: 1rem;
  font-size: 1.2rem;
  position: relative;
  z-index: 1;
  font-weight: 600;
  color: #fff;
  background-color: var(--as-secondary);
}

.que-hacemos .porfolio .modal .h3 {
  color: var(--as-secondary);
}

.que-hacemos .porfolio .modal p {
  color: var(--as-dark-gray);
}

.que-hacemos .porfolio .modal-body img {
  aspect-ratio: unset;
  width: 100%;
  height: 100%;
}

/*-Qué hacemos galería-*/
.que-hacemos .porfolio .modal .carousel-indicators {
  position: relative;
  all: unset;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.que-hacemos .porfolio .modal .carousel-indicators button {
  all: unset;
  width: 22%;
  transition: .3s ease-in-out;
}

.que-hacemos .porfolio .modal .carousel-indicators button:hover {
  cursor: pointer;
  filter: brightness(.5);
}


/*-Qué hacemos galería-*/
.que-hacemos .porfolio .modal-content {
  border-radius: 0;
}

.que-hacemos .ejemplos {
  padding-top: 15rem;
  padding-bottom: 5rem;
  overflow: clip;
  background-color: #fff;
  position: relative;
}

.que-hacemos .ejemplos::after {
  content: '';
  position: absolute;
  top: 0;
  width: 100%;
  left: 0;
  height: 10rem;
  clip-path: polygon(0 0, 50% 100%, 100% 0);
  background-color: var(--as-light-gray);
  ;
}

.que-hacemos .ejemplos .encabezado .contenido {
  padding-bottom: 7rem;
  position: relative;
}

.que-hacemos .ejemplos .encabezado .contenido:after {
  position: absolute;
  content: "";
  background: radial-gradient(circle, var(--as-dark-gray) 25%, transparent 26%);
  background-size: 3em 3em;
  opacity: 0.05;
  bottom: 0%;
  left: 100%;
  width: 300px;
  height: 300px;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
}

.que-hacemos .ejemplos .h3 {
  font-size: 2.2rem;
}

.que-hacemos .ejemplos p {
  text-transform: none !important;
  font-size: 1.2rem;
}

.que-hacemos .ejemplos a:not(.btn-white) {
  color: var(--as-light-secondary);
}

.que-hacemos .ejemplos .h3,
.que-hacemos .ejemplos p {
  color: #fff;
  text-transform: uppercase;
}

.que-hacemos .ejemplos .columna-bg-1 {
  background: url("img/que-hacemos-ejemplo-1.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  aspect-ratio: 4/3;
  position: relative;
  z-index: 3;
}

.que-hacemos .ejemplos .ejemplo:first-child {
  position: relative;
}

.que-hacemos .ejemplos .ejemplo:first-child:after {
  position: absolute;
  content: "";
  background: radial-gradient(circle, var(--as-secondary) 25%, transparent 26%);
  background-size: 3em 3em;
  opacity: 0.4;
  bottom: 0%;
  left: 0%;
  width: 400px;
  height: 400px;
}

.que-hacemos .ejemplos .ejemplo:nth-child(2) {
  position: relative;
}

.que-hacemos .ejemplos .ejemplo:nth-child(2):after {
  position: absolute;
  content: "";
  background: radial-gradient(circle, var(--as-gray) 25%, transparent 26%);
  background-size: 3em 3em;
  opacity: 0.4;
  bottom: 0%;
  right: 0%;
  width: 400px;
  height: 400px;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
}

.que-hacemos .ejemplos .ejemplo .contenido {
  position: relative;
  z-index: 1;
}

/* ---- Participa ---- */
.participa .hero figure {
  position: relative;
  padding-top: 12rem;
  padding-bottom: 5rem;
}

.participa .hero figure img {
  aspect-ratio: 5/4;
  object-fit: cover;
}

.participa .hero figure .move-on-scroll {
  position: absolute;
  top: -20%;
  width: 33%;
  bottom: 0;
  left: 10%;
  background-color: var(--as-primary);
  mix-blend-mode: darken;
}

.participa .contribuir {
  padding-top: 8rem;
}

.participa .contribuir .como-contribuir .shado-b {
  box-shadow: 10px 14px 34px 0px rgba(0, 0, 0, 0.25);
}

.participa .apoya-nuestra-causa {
  margin-top: 7rem;
  padding-top: 8rem;
  padding-bottom: 8rem;
  background-color: var(--as-dark-secondary);
  color: #fff;

  position: relative;
}

.participa .apoya-nuestra-causa:after {
  position: absolute;
  content: "";
  background: radial-gradient(circle, var(--as-gray) 25%, transparent 26%);
  background-size: 3em 3em;
  opacity: 0.05;
  bottom: 100%;
  right: 0%;
  width: 400px;
  height: 150px;
}

.participa .apoya-nuestra-causa:before {
  position: absolute;
  content: "";
  background: radial-gradient(circle, var(--as-secondary) 25%, transparent 26%);
  background-size: 3em 3em;
  opacity: 0.4;
  top: 0%;
  right: 0%;
  width: 400px;
  height: 300px;
}

.participa .apoya-nuestra-causa .h2 {
  color: #fff;
}

.participa .apoya-nuestra-causa .h2:before {
  background-color: #fff;
}

.participa .apoya-nuestra-causa>* {
  position: relative;
  z-index: 1;
}

 .receipt-header-top-wrap {
  background: red !important;
}

.participa .apoya-nuestra-causa .donacion-100-segura {
  background-color: #fff;
  color: var(--as-secondary);
  border-radius: 50px;
  display: inline-block;
  padding: 0.25rem 2rem;
  font-weight: 600;
  font-family: "Oswald";
}

.participa .faq {
  padding-top: 6rem;
  padding-bottom: 6rem;
  background: url("img/fondo-desierto.jpg");
  background-color: #fffe;
  background-repeat: no-repeat;
  background-blend-mode: color;
  background-position: center;
}

.participa .faq .accordion-button:not(.collapsed) {
  background-color: var(--as-light-gray);
}

.participa .faq #accordionSahara,
.participa .faq #accordionSahara .accordion-item,
.participa .faq #accordionSahara .accordion-item .accordion-header,
.participa .faq #accordionSahara .accordion-item .accordion-header .accordion-button.collapsed {
  background-color: transparent;
}

.participa .faq .accordion-body {
  background-color: white;
}

/* ---- La R.A.S.D ---- */
.rasd .hero {
  margin-top: 5rem;
  margin-bottom: 5rem;
  background: #fff;
}

.rasd .hero .grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(3, 1fr);
  gap: 1rem;
}

.rasd .hero .grid figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rasd .hero .grid figure:first-child {
  grid-area: 1/1/2/2;
}

.rasd .hero .grid figure:nth-child(2) {
  grid-area: 1/3/3/2;
  position: relative;
}

/*
.rasd .hero .grid figure:nth-child(2):after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--as-light-primary);
  mix-blend-mode: color-dodge;
}
*/
.rasd .hero .grid figure:nth-child(3) {
  grid-area: 2/2/4/1;
  position: relative;
}

.rasd .hero .grid figure:nth-child(3):after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--as-secondary);
  mix-blend-mode: screen;
}

.rasd .hero .grid figure:last-child {
  grid-area: 3/3/4/2;
}

.rasd .historia {
  padding-top: 5rem;
  padding-bottom: 10rem;
  background-color: var(--as-light-gray);
}

.rasd .historia .h3 {
  color: var(--as-secondary);
}

.rasd .historia .tarjeta>ul>li {
  list-style: none;
}

.rasd .historia .accordion-button {
  background-color: var(--as-light-gray);
}

.rasd .historia .accordion-body {
  background-color: var(--as-light-gray);
}

.rasd .accordion-item {
  border-width: 2px;
  border-color: var(--as-gray);
}

.rasd .tarjetas {
  position: relative;
  z-index: 1;
}

.rasd .tarjetas:before {
  position: absolute;
  content: "";
  top: 10%;
  bottom: 10%;
  left: 50%;
  width: 1px;
  border-left: 1px dashed var(--as-secondary);
  z-index: -1;
}

.rasd .tarjeta {
  box-shadow: 10px 14px 34px 0px rgba(0, 0, 0, 0.25);
}

.rasd .campamentos,
.rasd .territorios-ocupados,
.rasd .territorios-liberados {
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.rasd .campamentos {
  padding-top: 10rem;
  clip-path: polygon(100% 100%, 0% 100%, 0% 0%, 50% 2%, 100% 0%);
  margin-top: -6rem;
}

/* ----  contacto  ---- */
.contacto .hero {
  padding-top: 10rem;
  padding-bottom: 10rem;
}

.contacto .hero figure {
  position: relative;
}

.contacto .hero figure .move-on-scroll {
  position: absolute;
  top: -33%;
  width: 33%;
  bottom: -33%;
  right: 10%;
  background-color: var(--as-secondary);
  mix-blend-mode: darken;
}

.contacto .hero svg {
  border: 1px solid var(--as-secondary);
  border-radius: 50%;
  padding: 0.4rem;
}

.contacto .hero a {
  text-decoration: none;
  font-size: 1.2rem;
}

.contacto .formulario {
  background-color: var(--as-light-gray);
  padding-top: 5rem;
  padding-bottom: 6rem;
}

/*Formulario*/
#nf-form-1-cont {
  margin-top: 4rem;
  margin-bottom: 4rem;
  background-color: #fff;
  padding: 2rem;
  border: 1px solid var(--as-secondary);
  box-shadow: 10px 14px 34px 0px rgba(0, 0, 0, 0.25);
}

#nf-form-1-cont label {
  font-weight: 600;
  font-family: "Oswald";
}

.nf-form-content .list-select-wrap .nf-field-element>div,
.nf-form-content input:not([type="button"]),
.nf-form-content textarea {
  border-radius: 24px !important;
  background-color: transparent !important;
  border: 1px solid var(--as-secondary) !important;
}

.nf-form-content .list-select-wrap .nf-field-element>div:focus,
.nf-form-content input:not([type="button"]):focus,
.nf-form-content textarea:focus {
  background: white !important;
}

.nf-field-label .nf-label-span,
.nf-field-label label {
  color: var(--as-secondary);
  font-weight: 500 !important;
}

#nf-field-4,
.nf-form-content input[type=submit] {
  font-family: "Oswald";
  background-color: transparent !important;
  color: var(--as-secondary) !important;
  border: 2px solid var(--as-secondary) !important;
  border-radius: 0 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1rem !important;
  line-height: 1rem !important;

  padding-left: 2rem;
  padding-right: 2rem;
}

.form-wrap .nf-form-content input[type="submit"]:hover {
  background-color: var(--as-primary) !important;
  color: white !important;
  border: 2px solid var(--as-primary) !important;
}

.nf-form-fields-required {
  display: none !important;
}

.contacto .localizanos {
  clip-path: polygon(100% 100%, 0% 100%, 0% 0%, 50% 7%, 100% 0%);
  padding-top: 9rem;
  margin-top: -6rem;
}

.contacto .map-container {
  background-color: var(--as-gray);
  mix-blend-mode: luminosity;
}

/*----Blog----*/
.articles.blog {
  position: relative;
}

.blog .articles:before {
  position: absolute;
  content: "";
  background: radial-gradient(circle, var(--as-dark-gray) 25%, transparent 26%);
  background-size: 3em 3em;
  opacity: 0.05;
  bottom: 0;
  left: 0;
  width: 250px;
  height: 400px;
}

.blog .hero {
  padding-top: 10rem;
}

.blog #category-dropdown {
  border: 1px solid var(--as-secondary);
  border-radius: 50px;
  color: var(--as-secondary);
  font-weight: 600;
}

.blog .card {
  color: #fff;
  border-radius: 0;
  box-shadow: 20px 24px 24px 0px rgba(0, 0, 0, 0.25);
}

.blog .card img {
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: 0;
  border: 0;
}

.blog .card .card-img-overlay {
  background: linear-gradient(0deg, #1a1a1abd 40%, rgb(255 255 255 / 0%) 85%);
  padding: 2rem;
  border-radius: 0;
}

.blog .card .h3::before {
  background-color: #fff;
  width: 3px;
}

.blog .card .categoria {
  font-size: 1.2rem;
  position: relative;
  z-index: 1;
  font-weight: 600;
}

.blog .card .categoria:before {
  position: absolute;
  content: "";
  left: -2rem;
  top: -5px;
  bottom: -5px;
  right: 30%;
  background-color: var(--as-secondary);
  z-index: -1;
  mix-blend-mode: multiply;
}

.pagination .page-item .page-link {
  color: var(--as-secondary);
  border: 1px solid var(--as-secondary);
}

.pagination .page-item.active .page-link {
  background-color: var(--as-secondary);
  color: #fff;
}

/*----  Legales  ----*/
.page-template-legales-php #content {
  padding-top: 10rem !important;
}

/* ---- Agenda ---- */
.agenda {
  padding-top: 8rem;
}

.agenda .h2:before {
  content: none;
}

.agenda img {
  aspect-ratio: 5/3;
  object-fit: cover;
}

.agenda .article {
  margin-bottom: 7rem !important;
}

.agenda .article div:first-child {
  margin-bottom: 10rem;
}

.agenda .article figure {
  position: relative;
}

.agenda .article figure img:first-child {
  position: relative;
  z-index: 2;
}

.agenda .article figure img:last-child {
  position: absolute;
  top: 2rem;
  left: -3rem;
  opacity: 0.4;
  filter: grayscale(1);
}

.agenda .article figure .move-on-scroll {
  position: absolute;
  height: 100%;
  width: 33%;
  bottom: -33%;
  left: 10%;
  background-color: var(--as-secondary);
  mix-blend-mode: darken;
  z-index: 3;
}

.agenda .article:nth-child(2n + 1) figure .move-on-scroll {
  background-color: var(--as-secondary);
}

.agenda .article:nth-child(2n) figure .move-on-scroll {
  background-color: var(--as-primary);
}

.agenda .article .fecha-evento {
  text-transform: capitalize;
  font-size: 3rem;
}

/* ---- Single blog  ---- */
.single .hero {
  padding-top: 10rem;
  padding-bottom: 5rem;
}

.single .hero img {
  aspect-ratio: 2;
  object-fit: cover;
}

.single .entry-footer img {
  object-fit: cover;
  aspect-ratio: 5/3;
}

.single .entry-footer #commentsubmit {
  border: 2px solid var(--as-secondary);
  background-color: transparent;
  color: var(--as-secondary);
  border-radius: 0;
  text-transform: uppercase;
  font-weight: 600;
}

.single .entry-footer #commentsubmit:hover {
  background-color: var(--as-secondary);
  color: #fff;
}

/* ---- single agenda ---- */
.single-agenda .hero .overlay {
  position: relative;
}

.single-agenda .hero .overlay:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(53, 43, 50, 1) 0%, rgba(255, 255, 255, 0) 50%);
}

.single-agenda .fecha-evento {
  position: absolute;
  bottom: 10%;
  left: 10%;
  color: #fff;
  z-index: 1;
  text-transform: uppercase;
  font-family: "Oswald";
  font-size: 3rem;
}

.single-agenda .fecha-evento:before {
  background-color: #fff;
}

/* ---- Calendario de eventos -  area privada ----*/
.calendario .h3 {
  font-family: "Oswald";
}

.calendario .hero {
  padding-top: 9rem;
  padding-bottom: 5rem;
}

.calendario .actas-memorias {
  padding-top: 5rem;
  padding-bottom: 8rem;
  background-color: #f0ecec;
}

.calendario .documentos {
  clip-path: polygon(100% 100%, 0% 100%, 0% 0%, 50% 7%, 100% 0%);
  margin-top: -5rem;
  padding-top: 8rem;
  padding-bottom: 5rem;

  position: relative;
  background-color: #fff;
  z-index: 1;
}

.calendario .documentos:after {
  position: absolute;
  content: "";
  background: radial-gradient(circle, var(--as-dark-gray) 25%, transparent 26%);
  background-size: 3em 3em;
  opacity: 0.1;
  top: -25%;
  right: 0;
  width: 250px;
  height: 400px;
}

.calendario .actas-memorias .h3,
.calendario .documentos .h3 {
  color: var(--as-secondary);
  font-weight: 600;
  font-size: 1.45rem;
}

.calendario .actas-memorias .documento:nth-child(2n + 1) {
  background-color: #e6e6e6;
}

/*----Recursos----*/

#documentacion img {
  object-fit: cover;

}








/* ---- categoria - archive ----*/
.categoria img {
  aspect-ratio: 5/3;
}

/* ---- search page ----*/
.search-page img {
  aspect-ratio: 5/3;
}

/* --- 404 ---*/
.error-404 {
  padding: 10rem 0;

  background-repeat: no-repeat;
  background-size: cover;
  background-blend-mode: screen;
  background-position: center bottom;
  color: var(--ve-primary-light);
  animation: fadeIn 1s ease-in-out;
}

.error-404 .h1 {
  color: var(--as-secondary);
  font-weight: 600;
  animation: bounceIn 1.5s;
  font-size: 6rem;
}

.error-404 .display-4,
.error-404 .display-5 {
  color: #000;
}

.error-404 img {
  border-radius: 500px 57%;
}

/* .error-404 .btn-cta {
  background-color: var(--ve-primary);
  border: 1px solid var(--ve-primary);
  color: var(--ve-light-cream);
  max-width: 400px;
} */

/* .error-404 .btn-cta:hover {
  background-color: var(--ve-primary-light);
  border: 1px solid var(--ve-primary-light);
} */

/*----privacidad----*/

/*----Footer----*/

.footer {
  margin-top: 3rem;
  padding-top: 3rem;
  font-family: "Oswald";
  border: 1px solid #000;
}

.footer .top-button {
  color: #fff;
  font-size: 2rem;
  right: 30px;
  position: fixed;
  bottom: 50px;
}

.footer .top-button i {
  background-color: var(--as-secondary);
  padding: 0.5rem;

}

.footer h2 {
  color: var(--as-secondary);
}

.footer hr {
  border: 0;
  height: 3px;
  background-color: var(--as-secondary);
  opacity: 1;
}

.footer ul {
  list-style: none;
  padding-left: 0;
}

.footer ul li {
  margin-bottom: 0.5rem;
}

.footer ul li a {
  text-decoration: none;
  color: #000;
}

#colophon {
  background: var(--as-dark-gray);
  color: var(--as-gray);
  display: flex;
  justify-content: center;
}

.footer #caronte-svg {
  max-height: 1.5rem;
  fill: #fff;
}

#colophon {
  margin-top: 5rem;
}

#colophon a,
#colophon small {
  color: var(--as-light-gray);
  text-decoration: none;
}

#colophon svg {
  width: 1.5rem;
  height: 1.5rem;
}

#colophon svg path {
  fill: var(--as-light-gray);
}


.social-sidebar {
  width: 50px;
  top: 50%;
  transition: all 0.2s;
  z-index: 99;
}

.social-sidebar span {
  position: absolute;
  bottom: 100%;
  left: 50%;
  display: block;
  width: 3px;
  background-color: var(--as-secondary);
}

.social-sidebar span:first-child {
  height: 150%;
  margin-bottom: 1rem;
}

.social-sidebar span:last-child {
  height: 50%;
  top: 100%;
  margin-top: 1rem;
}

.social-sidebar.disappear {
  transform: translateX(-100%);
  transition: all 0.2s;
}

/*----Plugins----*/
/*----MQ----*/

/*sm*/

@media (min-width: 576px) {}

/*md*/
@media (min-width: 768px) {
  .rasd .tarjetas {
    position: relative;
    z-index: 1;
  }

  .rasd .tarjetas:after {
    position: absolute;
    content: "";
    left: 10%;
    right: 10%;
    top: 50%;
    height: 1px;
    border-bottom: 1px dashed var(--as-secondary);
    z-index: -1;
  }

  .rasd .tarjetas:before {
    display: none;
  }
}

/*lg*/
@media (min-width: 992px) {
  .home-hero {
    margin-top: 0rem;

  }

  .hero-grid {
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(3, 1fr);
    grid-auto-columns: 1fr;
    grid-auto-rows: 1fr;
    gap: 0px 0px;
    grid-auto-flow: column;
  }

  .asociacion .hero figure .move-on-scroll {
    top: -33%;
    bottom: -33%;
  }

  .asociacion .nuestra-trayectoria figure .move-on-scroll {
    bottom: -33%;
  }

  .home-page .actualidad .post:nth-child(4) {
    display: none;
  }

  .hero-info {
    grid-area: 2 / 2 / 3 / 4;
    text-align: start;
    padding: 0;
  }

  .hero-bg {
    grid-area: 1 / 3 / 4 / 8;
    position: relative;
  }

  .participa .hero .row {
    padding-top: 6rem;
  }
}

/*xl*/
@media (min-width: 1200px) {
  .desplaza-2 {
    top: 2rem;
  }

  .home-hero {
    padding-top: 5rem;
  }



}

/*xxl*/
@media (min-width: 1400px) {
  .participa .hero .row {
    padding-top: 0rem;
  }
}