/*=== BASE ===*/
* {box-sizing: border-box;margin: 0;padding: 0;}

body {font-family:'Quicksand', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  overflow-x:hidden;width:100%;max-width:100%;}

section {margin: 0;}
section h1, section h2, section h3{ margin-top:0; }

[id^="nosotros"] {scroll-margin-top: 70px;}
[id^="documentos"], [id^="contacto"] {scroll-margin-top: 70px;}
[id^="donar"], [id^="logotipo"] {scroll-margin-top: 60px;}
[id^="programas"], [id^="testimonios"] {scroll-margin-top:90px;}

.nav
.section-cards-inner,
.programas-inner,
.testimonios-inner,
.footer-inner
.docs-cards-inner,
.form-inner {max-width:1100px;margin:0 auto;}

/* === TITULOS (Nosotros / Programas / Testimonios / Form) === */
.section-cards-title,
.programas-title,
.testimonios-title,
.form-info-title{
  color:red;
  text-transform:uppercase;
  letter-spacing:0.12em;
  font-weight:700;
}
.section-cards-header,
.programas-header,
.testimonios-header {text-align:center;}

/* === BOTONES === */
.hero-btn,
.programas-btn,
.testimonios-btn,
.contact-form-btn,
.modal-submit-btn,
.aporte-btn{
  display:inline-block;
  border:none;
  cursor:pointer;
  border-radius:999px;
  background:#6B8E23;
  color:#fff;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.12em;
  text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
  box-shadow:0 8px 18px rgba(0,0,0,0.18);
}
.hero-btn:hover,
.programas-btn:hover,
.testimonios-btn:hover,
.contact-form-btn:hover,
.modal-submit-btn:hover,
.aporte-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(0,0,0,0.25);
  opacity:.96;
}
.hero-btn {padding: 12px 28px;font-size: .9rem;}
.programas-btn {padding: 20px 26px;font-size: 1.2rem;}
.testimonios-btn {padding: 10px 28px;font-size: 0.85rem;}
.contact-form-btn {padding: 11px 32px;font-size: .8rem;}
.modal-submit-btn {padding: 9px 22px;font-size: 0.8rem;}
.aporte-btn {padding: 13px 30px;font-size: 0.9rem;}

/* === CARDS === */
.card-item,
.doc-card,
.testimonio-card,
.programa-card-front,
.programa-card-back{
  background:#E3EBCF;
  border:1px solid #6B8E23;
  border-radius:18px;
}
.card-item:hover, 
.doc-card:hover {transform: translateY(-4px);
                box-shadow:10px 10px 25px rgba(0, 0, 0, 0.14),-10px -10px 25px rgba(255, 255, 255, 0.85);}
.card-item,
.doc-card {box-shadow:8px 8px 16px rgba(107,142,35,.22), -8px -8px 16px rgba(156,192,90,.18);
          transition:transform .25s ease, box-shadow .25s ease;}
.cards-grid,
.docs-cards-grid,
.programas-grid-top,
.programas-grid-bottom {gap:24px;}

/* === MENÚ SUPERIOR === */
.top-bar {width: 100%;background: white;position: fixed;
          top: 0;left: 0;z-index: 1000;}
.nav {max-width: 1200px;margin: 0 auto;padding: 10px 16px;display: flex;
      align-items: center;justify-content: space-between;position: relative;}
.logo-img {height: 70px;display: block;}
.nav-menu {display: flex;align-items: center;
          gap: 35px;flex: 1;justify-content: center;}
.nav-menu a {font-size: 15px;letter-spacing: 0.25em;text-transform: uppercase;
            text-decoration: none;color: black;font-weight: 600;
            transition: color 0.2s ease, transform 0.2s ease;}
.nav-menu a:hover {color: red;transform: translateY(-1px);}
.nav-right {display: flex;align-items: center;gap: 20px;}
.nav-divider {width: 1px;height: 30px;background: #346fb0;}

.btn-donar {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 15px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  border: none;
  background: none;
  color: red;
  cursor: pointer;
  font-weight: 600;
  text-decoration: none !important;
}
.btn-donar:hover {transform: translateY(-1px);}
.btn-donar-circle {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #6b8e23;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: white;
}
.nav-donar-mobile {
  display: none;                
  width: 100%;
  margin-top: 10px;
  padding: 10px 0;
  border-radius: 999px;
  background: #6B8E23;
  color: #ffffff !important;
  justify-content: center;
  font-size: 0.85rem;
  letter-spacing: 0.18em;
}

/* === BOTÓN HAMBURGUESA === */
.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  border: 1px solid white;
  background: #ffffff;
  cursor: pointer;
  padding: 0;
}
.nav-toggle span {
  display: block;
  width: 16px;
  height: 2px;
  border-radius: 999px;
  background: black;
  margin: 0 auto;
  transition: transform 0.3s ease, opacity 0.3s ease;
}
/* Animación a X */
.nav-toggle.is-open span:nth-child(1) {transform: translateY(6px) rotate(45deg);}
.nav-toggle.is-open span:nth-child(2) {opacity: 0;}
.nav-toggle.is-open span:nth-child(3) {transform: translateY(-6px) rotate(-45deg);}

@media (max-width: 900px) {
  .nav {padding: 10px 16px;}
  .nav-toggle {display: flex;}
  .nav-menu {
    position: fixed !important;
    top: 90px;                
    left: 0;
    right: 0;
    width: 100%;
    background: #ffffff;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    padding: 16px 20px;
    border-bottom: 1px solid #eee;
    display: none;
    overflow: hidden !important;
    z-index: 9999;
  }
  .nav-menu.is-open {display: flex !important;}
  .nav-menu a {font-size: 14px;width: 100%;}
  .nav-right {display: none;}
  .nav-donar-mobile {display: flex;width:42%;padding: 2px 20px;}
}


/* === SLIDER PRINCIPAL === */
.hero-slider {position: relative;width: 100%;height: 100vh;
              min-height: 380px;max-height: 750px;overflow: hidden;}
.hero-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  opacity: 0;
  transform: scale(1.02);
  transition: opacity 0.8s ease, transform 0.8s ease;
}
.hero-slide.hero-active {opacity: 1;transform: scale(1);}
.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg,rgba(0, 0, 0, 0.45),rgba(0, 0, 0, 0.15));
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 20px;
}
.hero-content {max-width: 700px;color: #ffffff;}
.hero-title {font-size: 3.2rem;margin-bottom: 10px;font-weight: 600;font-family: 'Courgette', cursive;}
.hero-text {font-size: 1.3rem;margin-bottom: 22px;line-height: 1.6;font-weight: 900}

.hero-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: none;
  background: rgba(255, 255, 255, 0.4);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  color: #666;
  transition: background 0.2s ease, transform 0.2s ease;
}
.hero-arrow:hover {background: #ffffff;transform: translateY(-50%) scale(1.05);}
.hero-arrow.hero-prev {left: 20px;}
.hero-arrow.hero-next {right: 20px;}
.hero-dots {position: absolute;bottom: 18px;left: 50%;
            transform: translateX(-50%);display: flex;gap: 8px;}
.hero-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  border: 1px solid #ffffff;
  background: transparent;
  cursor: pointer;
  opacity: 0.6;
  transition: background 0.2s ease, opacity 0.2s ease, transform 0.2s ease;
}
.hero-dot.hero-dot-active {background: #ffffff;opacity: 1;transform: scale(1.1);}

@media (max-width: 768px) {
  .hero-slider {height: 55vh;min-height: 320px;}
  .hero-overlay {padding: 0 10px;}
  .hero-content {max-width: 90%;padding-top: 90px;}
  .hero-title {font-size: 1.1rem;margin-bottom: 8px;}
  .hero-text {font-size: .6rem;line-height: 1.4;margin-bottom: 16px;padding: 0 6px;}
  .hero-btn {padding: 10px 20px;font-size: 0.5rem;}
  .hero-dots {bottom: 10px;}
}

/* === NOSOTROS === */
.section-cards {padding: 60px 40px;}
.section-cards-inner {padding-top: 20px;}
.section-cards-header {margin-bottom: 60px;}
.section-cards-title {font-size: 3rem;margin-bottom: 30px;}
.section-cards-subtitle {font-size: 1.7rem;color: black;}
.cards-grid {display: grid;grid-template-columns: repeat(3, 1fr);}
.card-item {padding: 24px 22px;display: flex;flex-direction: column;gap: 14px;}

.card-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #6b8e23;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: #fff;
}
.card-title {font-size: 1.6rem;color: red;font-weight: 600;margin: 0;}
.card-text {font-size: 0.95rem;color: black;line-height: 1.6;}
.card-centrado {display: flex;align-items: center;gap: 12px;  }

@media (max-width: 900px) {
  .cards-grid {grid-template-columns: repeat(2, 1fr);}
  .section-cards-title {font-size: 1.7rem}.section-cards-subtitle {font-size: 0.9rem;}
  .card-title {font-size: 1rem;}.card-text {font-size: 0.7rem;}.card-icon{width: 38px;height: 38px;font-size: 18px;}
}

@media (max-width: 640px) {.cards-grid {grid-template-columns: 1fr;}}

/* === CARRUSEL TIPO POSTERS CENTRADO === */

.poster-carousel-section {padding: 80px 40px;background: white;text-align: center;
                          overflow: hidden;position: relative;}
.poster-title {font-size: 1.5rem;color: black;margin-bottom: 24px;
              text-transform: uppercase;letter-spacing: 0.08em;}
.poster-slider {max-width: 1000px;margin: 80px auto 24px;
                display: flex;align-items: center;justify-content: space-between;}
.poster-stage {position: relative;flex: 1;height: 260px;overflow: visible;}

.poster-item {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 450px;
  height: 260px;
  border-radius: 18px;
  object-fit: cover;
  box-shadow: 0 12px 24px rgba(0,0,0,0.28);
  transform: translate(-50%, -50%) scale(0.7);
  opacity: 0;
  filter: grayscale(0.3);
  transition:
    transform 0.5s ease,
    opacity 0.5s ease,
    filter 0.5s ease,
    box-shadow 0.5s ease;
}
.poster-arrow {
  border: none;
  background: #6B8E23;
  color: white;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  margin: 0 10px;
  transition: background 0.2s ease, transform 0.2s ease;
  position: relative;
  overflow: visible;
}
.poster-arrow:hover {transform: scale(1);}
.poster-next{position: absolute;right: -120px; top: 50%;transform: translateY(-50%);}
.poster-prev{position: absolute;left: -120px; top: 50%;transform: translateY(-50%);}

@media (max-width: 767px) {
  .poster-slider {max-width: 100%;position: relative;margin: 1px auto 1px;}
  .poster-stage {overflow: hidden;height: 200px}

  .poster-item {
    width: 280px;
    max-width: 1200px;
    height: 150px;
    transform: translate(-50%, -50%) scale(1) !important;
    opacity: 1 !important;
    filter: none !important;
    pointer-events: auto !important;
    z-index: 10 !important;
    box-shadow: 0 8px 20px rgba(0,0,0,0.2);
    transition: transform 0.3s ease;
  }
  .poster-item:not([style*="opacity: 1"]) {
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translate(-50%, -50%) scale(0.8) !important;
  }
  .poster-next {right: 1px;top: 50%;}
  .poster-prev {left: 1px;top: 50%;}
  .poster-arrow {
    width: 20px;
    height: 20px;
    font-size: .8rem;
    background: rgba(107, 142, 35, 0.9);
    z-index: 20;
    margin: 0;
  }
  .poster-title {font-size: .7rem;margin-bottom: 16px;padding: 0 10px;}
  .poster-carousel-section {padding: 0px 0px 0px;}
}

@media (min-width: 768px) {.poster-item {width: 450px;height: 260px;}}

/* === SECCIÓN PROGRAMAS SOCIALES === */
.programas-section {padding: 60px 20px 40px;}
.programas-header {margin-bottom: 20px;}
.programas-title {font-size: 3rem;margin-bottom: 12px;}
.programas-text {max-width: 1100px;margin: 0 auto;font-size: 1.3rem;color: #111;line-height: 1.5;}
.programas-pill-group {display: grid;grid-template-columns: 1fr;gap: 30px;margin-top: 38px;margin-bottom: 38px;}

.programas-pill {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 14px;
  border-radius: 16px;
  background: #E3EBCF;    
  border: 1px solid #6B8E23;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.12);
  color: black;
}
.pill-icon {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid #6B8E23;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: #6B8E23;
}

.pill-icon span {font-size: 20px;}
.pill-text {font-size: 1.1rem;line-height: 1.4;}
.programas-btn-wrapper {text-align: center;margin-top: 10px;}

.flip-hint {font-size: 1rem;color: #6B8E23;text-align: center;
            margin-top: -6px;margin-bottom: 8px;font-weight: 600;opacity: 0.9;}

@media (max-width: 768px){
  .programas-title {font-size: 1.5rem;} .programas-text{font-size: .8rem}
  .pill-text{font-size: .8rem} .programas-btn{font-size: .8rem}
}

/* === SECCIÓN PROGRAMAS2 === */
.programas2-section {padding: 40px 20px 60px;}

.programas-grid-top {display: grid;
                    grid-template-columns: repeat(3, minmax(0, 1fr));
                    max-width: 1200px;margin: 0 auto 24px;}
.programas-grid-bottom {
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  max-width: 900px;
  margin: 0 auto;      
}
.programa-card {perspective: 1200px;}
.programa-card-inner {position: relative;width: 100%;height: 300px;             
                      transform-style: preserve-3d;transition: transform 0.8s ease;}
.programa-card-face {
  position: absolute;
  inset: 0;
  border-radius: 16px;
  overflow: hidden;
  backface-visibility: hidden;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
}
.programa-card-front {display: flex;flex-direction: column;}
.programa-card-front img {width: 100%;height: 70%;object-fit: cover;}

.programa-card-front h3 {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 12px;
  font-size: 1rem;
  text-align: center;
  color: black;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.programa-card-back {
  color: black;
  transform: rotateY(180deg);
  padding: 18px 18px 16px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.programa-card-back p {font-size: 0.9rem;line-height: 1.8;font-weight: 800;}

@media (hover: hover) and (pointer: fine) {
  .programa-card:hover .programa-card-inner {
    transform: rotateY(180deg);
  }}
/* ======= Responsivo ======= */
@media (max-width: 1024px) {
  .programas-grid-top {
    grid-template-columns: repeat(2, minmax(0, 1fr));}
  .programas-grid-bottom {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 700px;}
}
@media (max-width: 768px) {
  .programas2-section {padding: 32px 16px 20px;}
  .programas-grid-top,
  .programas-grid-bottom {grid-template-columns: 1fr;max-width: 420px;}
  .programa-card-inner {height: 220px;}
  .programa-card {min-width: 200px;}
  .programa-card-front h3 {font-size: .8rem}
  .programa-card-back p {font-size: .6rem}
}
/*=== MODALES === */
.modal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  backdrop-filter: blur(3px);
  justify-content: center;
  align-items: center;
  z-index: 99999;
}
.modal-content {
  background: #E3EBCF;
  max-width: 800px;
  width: 90%;
  padding: 24px 28px;
  border-radius: 18px;
  border: 3px solid #6B8E23;
  box-shadow: 0px 8px 30px rgba(0,0,0,0.25);
  position: relative;
  animation: modalShow 0.3s ease;
  font-size: 1.3rem;
}
.modal-close {position: absolute;top: 8px;right: 14px;font-size: 1.2rem;cursor: pointer;color: black;}

@keyframes modalShow {
  from { transform: translateY(-20px); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}

@media (max-width: 768px) {
  .programa-card.is-flipped .programa-card-inner {transform: rotateY(180deg);}
  .modal-content{font-size: 0.6rem}}

.programa-mas {
  margin-top: 12px;
  display: inline-block;
  font-weight: 400;
  cursor: pointer;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 1rem;
}
.programa-mas:hover {
  text-decoration: underline;}

/* === TESTIMONIOS === */
.testimonios-section {padding: 100px 40px;background: white;}
.testimonios-header {margin-bottom: 50px;}
.testimonios-title {font-size: 3rem;}
.testimonios-carousel-viewport {overflow: hidden;margin: 28px 0 24px;}
.testimonios-track {display: inline-flex;gap: 16px;animation: testimonios-scroll 45s linear infinite;}
.testimonios-track.paused {animation-play-state: paused;}

@keyframes testimonios-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

.testimonio-card {
  min-width: 260px;
  max-width: 280px;
  padding: 18px 16px 20px;
  box-shadow: 0 8px 18px rgba(0,0,0,0.10);
  flex-shrink: 0;
}
.testimonio-stars {color: #FFD700;font-size: 1.5rem;letter-spacing: 2px;margin-bottom: 6px;}
.testimonio-nombre {font-size: 1.5rem;font-weight: 700;margin-bottom: 8px;color: black;}
.testimonio-texto {font-size: 1.1rem;line-height: 1.5;color: #222;text-align: left;}
.testimonios-cta {text-align: center;margin-top: 40px;}
.testimonios-cta-text {font-size: 1.3rem;margin-bottom: 30px;color: black;}

@media (max-width: 768px) {
  .testimonio-card {min-width: 220px;max-width: 230px;padding: 14px 12px 16px;}
  .testimonios-track {animation-duration: 30s;}
  .testimonios-title{font-size: 1.8rem}
  .testimonios-section{padding: 40px 20px 70px;}
  .testimonio-nombre {font-size: 1.1rem;}
  .testimonio-texto {font-size: .9rem;}
}

/* === MODAL TESTIMONIO === */
.modal-testimonio {
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 2000;
}
.modal-testimonio.is-open {display: flex;}
.modal-testimonio-backdrop {position: absolute;inset: 0;background: rgba(0,0,0,0.55);}

.modal-testimonio-dialog {
  position: relative;
  background: #ffffff;
  border-radius: 18px;
  padding: 22px 22px 20px;
  max-width: 420px;
  width: 90%;
  box-shadow: 0 16px 40px rgba(0,0,0,0.25);
  z-index: 1;
}
.modal-testimonio-close {
  position: absolute;
  top: 8px;
  right: 10px;
  border: none;
  background: none;
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
  color: #666;
}
.modal-testimonio-title {font-size: 2.4rem;margin-bottom: 12px;color: black;}
.modal-testimonio-form {display: flex;flex-direction: column;gap: 14px;}

.modal-field label,
.modal-label {
  font-size: 0.9rem;
  font-weight: 600;
  color: #333;
  margin-bottom: 4px;
  display: block;
}
.modal-stars {display: flex;flex-direction: row-reverse;justify-content: flex-start;gap: 4px;}
.modal-stars input {display: none;}
.modal-stars label {font-size: 1.6rem;color: #ccc;cursor: pointer;transition: color 0.15s ease;}
.modal-stars input:checked ~ label {color: #FFD700;}
.modal-stars label:hover,
.modal-stars label:hover ~ label {color: #FFD700;}

.modal-field input,
.modal-field textarea {
  width: 100%;
  border-radius: 999px;
  border: 1px solid #6B8E23;
  padding: 8px 12px;
  font-size: 0.9rem;
  font-family: inherit;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.modal-field textarea {border-radius: 12px;resize: vertical;min-height: 90px;}
.modal-field input:focus,
.modal-field textarea:focus {border-color: #39aaff;box-shadow: 0 0 0 2px rgba(57,170,255,0.20);}
.char-counter {font-size: 0.75rem;color: #777;display: block;text-align: right;margin-top: 2px;}

@media (max-width: 480px) {
  .modal-testimonio-dialog {padding: 18px 16px 16px;}
}
/* === BANNER DOCUMENTOS === */
.banner-documentos {
  position: relative;
  width: 100%;
  height: 30vh;                
  min-height: 120px;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.banner-documentos::before {  content: "";  position: absolute;  inset: 0;  background: rgba(0, 0, 0, 0.35);}

.banner-documentos h2 {
  position: relative;
  color: #ffffff;
  font-size: 3.2rem;
  font-weight: 1000;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: center;
  font-family: 'Courgette',cursive;
}

@media (max-width: 768px) {
  .banner-documentos {height: 20vh;}
  .banner-documentos h2 {  font-size: 1.5rem;} .programa-mas{font-size: .6rem}
}
/* === DOCUMENTOS === */
.docs-cards-section {padding: 70px 20px;background:white;}
.docs-cards-header {text-align: center;margin-bottom: 35px;}
.docs-cards-header h2 {font-size: 2rem;color: red;text-transform: uppercase;letter-spacing: 0.12em;font-weight: 700;}
.docs-cards-grid {display: grid;grid-template-columns: repeat(2, 1fr);}
.doc-card {overflow: hidden;}
.doc-card a {  display: block;  text-decoration: none;  color: inherit;}
.doc-card-preview {  width: 100%;  height: 190px;  overflow: hidden;  background: #e5f3ff;}
.doc-card-preview img {  width: 100%;  height: 100%;  object-fit: cover;}
.doc-card-body {  padding: 18px 18px 20px;}
.doc-card-title { font-size: 1.05rem;  font-weight: 700;  color: #444b6e;  margin-bottom: 6px;}
.doc-card-meta {  font-size: 0.85rem;  color: #9b9fb8;  margin-bottom: 14px;}

.doc-card-download {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: red;
}
.doc-card-download-icon {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #6B8E23;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
  color: #fff;
}

@media (max-width: 768px) {
  .docs-cards-grid {grid-template-columns: 1fr;}
  .docs-cards-section {padding: 70px 30px;}
  .doc-card-title { font-size: .8rem;}.doc-card-meta {font-size: 0.7rem;}.doc-card-download{font-size: 0.6rem;}
}

/* === SECCIÓN FORMULARIO === */
.form-section {padding: 40px 16px;}
.form-inner {display: grid;grid-template-columns: 1.1fr 1fr;gap: 50px;align-items: center;}
.form-info-title {font-size: 4rem; margin-bottom: 10px;}
.form-info-subtitle {  font-size: 1.2rem;  color: black;  line-height: 1.6;  margin-bottom: 20px;}
.form-highlight {  font-size: 1.1rem;  color: #71922C ;  font-weight: 600;}
.contact-form {padding: 1px 8px;}
.contact-form-row { margin-bottom: 16px;}
.contact-form-label {  display: block;  font-size: .9rem;color: black;  margin-bottom: 6px;}

.contact-form-input,
.contact-form-textarea {
  width: 100%;
  border-radius: 999px;
  border: 1px solid red;
  padding: 8px 10px;
  font-size: 0.8rem;
  font-family: inherit;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.contact-form-textarea {  border-radius: 16px;  min-height: 80px;  resize: vertical;}
.contact-form-input:focus,
.contact-form-textarea:focus {border-color: #39aaff;  box-shadow: 0 0 0 3px rgba(57,170,255,0.18);}
.contact-form-small {  font-size: 0.8rem;  color: #9b9fb8;}

@media (max-width: 900px) {
  .form-section { padding: 40px 16px;  }
  .form-inner {    grid-template-columns: 1fr;    max-width: 600px;    margin: 0 auto;    gap: 32px;  }
  .form-info-title { font-size: 2.5rem; text-align: center;  }
  .form-info-subtitle,
  .form-highlight { font-size: 1.1rem; text-align: center;  }
  .contact-form {    padding: 20px 18px;  }
}
@media (max-width: 600px) {
  .form-section {  padding: 32px 12px;  }
  .form-info-title {  font-size: 1.6rem;  }
  .form-info-subtitle { font-size: .9rem;  }
  .form-highlight { font-size: 0.9rem;  }
  .contact-form-label { font-size: 0.95rem;  }
  .contact-form-input,
  .contact-form-textarea {   font-size: 0.9rem;   padding: 9px 12px; }
  .contact-form-btn { width: 100%; text-align: center; font-size: .8rem; padding: 10px 20px;  }
}

/* === SECCIÓN DE APORTES === */
.aporte-section {
  position: relative;
  width: 100%;
  padding: 60px 20px;
  background-size: cover;
  background-position: center;
  color: #ffffff;
  height: 50vh;
}
.aporte-overlay {position: absolute;inset: 0;background: linear-gradient(120deg, rgba(0,0,0,0.55),rgba(0,0,0,0.20));}
.aporte-content {position: relative;max-width: 900px;margin: 0 auto;text-align: center;z-index: 2;}
.aporte-title {font-size: 2.4rem;font-weight: 700;line-height: 1.3;margin-bottom: 20px;}
.aporte-subtitle {font-size: 1.2rem;font-weight: 500;margin-bottom: 20px;color: #ffe5e5;letter-spacing: 0.03em;}
.aporte-buttons {display: flex;justify-content: center;gap: 20px;flex-wrap: wrap;margin-bottom: 35px;}
.aporte-btn:nth-child(2) {background: #71922C;color: white;}
.aporte-btn:nth-child(3) {background: #71922C;color: white;}

@media (max-width: 768px) {
  .aporte-title {font-size: 1.4rem;}
  .aporte-subtitle {font-size: .9rem;}
  .aporte-btn {width: 40%;max-width: 260px;font-size: .5rem;}
}

/* === FOOTER === */
.footer {padding: 0px 20px 10px; margin-top: 60px;}
.footer-inner { display: grid;  grid-template-columns: 1.2fr 1fr 1fr;  gap: 40px;}
.footer-logo img {  width: 150px;  display: block;  margin-bottom: 12px;}
.footer-text { font-size: 0.95rem;  color: black;  line-height: 1.4;  max-width: 300px;}
.footer-title {  font-size: 1.2rem;  font-weight: 700;  color: red;  margin-bottom: 14px;}
.footer-list {  list-style: none;  padding: 0;  margin: 0;}
.footer-list li {  margin-bottom: 10px;}
.footer-list a {  text-decoration: none;  color: black;  font-size: 0.95rem;  transition: color 0.2s ease;}
.footer-list a:hover {  color: #007bff;}
.footer-social {  margin-top: 20px;  display: flex; gap: 12px;}

.footer-social a {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  transition: background 0.2s ease, transform 0.2s ease;
}
.footer-social a:hover {  color: #ffffff;transform: translateY(-2px);}
.footer-social img{width: 35px;}
.footer-bottom {margin-top: 15px;padding-top: 10px;border-top: 1px solid #e6e2f4;
                text-align: center;font-size: 0.85rem;color: #9b9fb8;}

@media (max-width: 900px) {
  .footer-inner {grid-template-columns: 1fr 1fr;}
}
@media (max-width: 700px) {
  .footer-inner {grid-template-columns: 1fr;text-align: center;}
  .footer-logo img { margin: 0 auto 12px;}
  .footer-text {margin: 0 auto;}
  .footer-social {justify-content: center;}
}

/*============= ANIMACIÓN GENERAL ===========*/
.reveal-up {
  opacity: 0;
  transform: translateY(25px);
  transition: opacity 1.3s ease-out, transform 1.3s ease-out;
}
.reveal-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* === SECCIÓN FULL SCREEN (SNAP) === */
.cv-section{
  min-height: 100vh;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  padding:15px 16px 32px;
}
/* === CONTENEDOR GENERAL === */
.cv-container{
  width: min(1200px, 100%);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* === TEXTO === */
.cv-text{margin-bottom: 32px;}
.cv-text .testimonios-title{margin: 0 0 12px 0;line-height: 1.1;}
.cv-text .section-cards-subtitle{margin: 0 auto;max-width: 60ch;opacity: 0.95;}

/* === GRID DE VIDEOS === */
.cv-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  width: 100%;
  max-width: 900px;
  justify-items: center;
}

@media (max-width: 992px){
  .cv-grid{grid-template-columns: repeat(2, 1fr);}
}

@media (max-width: 576px){
  .cv-grid{grid-template-columns: 1fr;max-width: 340px;}
}

/* === TARJETA VIDEO === */
.cv-card{
  border: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  width: 100%;
  max-width: 220px;
  box-shadow: 0 12px 30px rgba(0,0,0,.15);
  transition: transform .15s ease, box-shadow .15s ease;
}
.cv-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 18px 45px rgba(0,0,0,.22);
}

/* === VIDEO VERTICAL === */
.cv-video{
  width: 100%;
  aspect-ratio: 9 / 16;
  object-fit: cover;
  display: block;
}

/* === BOTÓN "VER EN GRANDE" === */
.cv-playhint{
  position: absolute;
  left: 50%;
  bottom: 14px;
  transform: translateX(-50%);
  background: rgba(0,0,0,.6);
  color: #fff;
  padding: 6px 14px;
  border-radius: 999px;
  font-size: .85rem;
  line-height: 1;
  backdrop-filter: blur(6px);
}
/* === MODAL === */
.cv-modal{position: fixed;inset: 0;display: none;z-index: 9999;}
.cv-modal.is-open{display: block;}
.cv-modal__backdrop{position: absolute;inset: 0;background: rgba(0,0,0,.65);}

.cv-modal__panel{
   position: relative;
  z-index: 1;
  width: fit-content;          
  max-width: 92vw;             
  margin: 8vh auto;
  background: transparent;     
  border-radius: 18px;
  overflow: visible;           
  box-shadow: none;            
}
.cv-modal__videoWrap{
  background: #000;            
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
}

@media (max-width: 576px){
  .cv-modal__panel{
    width: fit-content;
    max-width: 96vw;
    margin: 6vh auto;
    background: transparent;
  }
  .cv-modal__videoWrap{
    background: transparent;   
    box-shadow: none;
    border-radius: 14px;
  }
  .cv-modal__video{
    width: auto;
    max-width: 96vw;
    max-height: 70vh;           
    height: auto;
    object-fit: contain;
    background: #000;          
    border-radius: 14px;
  }

  .cv-modal__close{top: -12px;right: -12px;}
}
.cv-modal__close{
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 3;
  border: 0;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: rgba(255,255,255,.12);
  color: #fff;
  font-size: 18px;
  cursor: pointer;
}
.cv-modal__video{
  width: auto;               
  max-width: 92vw;            
  max-height: 75vh;            
  display: block;
  object-fit: contain;
  background: #000;
}
/* === ACCESIBILIDAD === */
.cv-card:focus,
.cv-modal__close:focus{
  outline: 2px solid rgba(255,255,255,.75);
  outline-offset: 2px;
}

/* En desktop: 4 visibles */
@media (min-width: 993px){
  #creciendo-en-valores .cv-grid{
    grid-template-columns: repeat(4, 1fr);
    max-width: 980px;
  }
}

/* Transición suave al cambiar grupo */
#cvGalleryGrid{ transition: opacity .22s ease; }
#cvGalleryGrid.is-fading{ opacity: 0; }