/* Nosotros (template-nosotros.php) */

.about-hero { background-image: url('../images/about-hero-left.png'), url('../images/about-hero-right.png'), radial-gradient(circle at center, #fefaf8 0%, #eaddeb 100%); background-position: left bottom, right bottom, center center; background-repeat: no-repeat, no-repeat, no-repeat; background-size: auto 100%, auto 100%, cover; }
.about-hero-content { text-align: center; max-width: 600px; margin: 0 auto; position: relative; z-index: 2; }
.about-logo { max-width: 250px; margin: 0 auto var(--sp-4); display: block; }
.about-lead { font-size: var(--fs-2xl); color: var(--ink); font-family: var(--title); margin: 0; }
.about-mission-section { padding-bottom: 0; }
.mission-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-5); }
.container.mission-grid { width: 100%; max-width: 100%; padding: 0 42px; }
.mission-card { background-color: #faf5fb; background-image: url('../images/about-mission-bg.png'); background-position: right bottom; background-repeat: no-repeat; background-size: min(55%, 500px) auto; border-radius: var(--r-md); display: flex; justify-content: flex-start; }
.vision-card { background-color: var(--bg-warm); background-image: url('../images/about-vision-bg.png'); background-position: right bottom; background-repeat: no-repeat; background-size: min(55%, 500px) auto; border-radius: var(--r-md); display: flex; justify-content: flex-start; }
.mission-card .card-body { width: 60%; padding: 20px 0 40px 40px; display: flex; flex-direction: column; justify-content: flex-start; }
.vision-card .card-body { width: 60%; padding: 20px 0 40px 40px; display: flex; flex-direction: column; justify-content: flex-start; }
.card-title { font-family: var(--title); font-size: var(--fs-3xl); color: var(--ink); margin-bottom: var(--sp-3); display: flex; align-items: center; gap: var(--sp-2); }
.card-title .icon { width: 28px; height: 28px; color: var(--primary); }
.card-text { color: var(--ink); line-height: 1.6; margin: 0 0 var(--sp-2); font-size: var(--fs-smd); }
.card-text:last-child { margin-bottom: 0; }
.values-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-4); margin-top: var(--sp-5); }
.about-values { padding: 15px 0 0; background-color: #fff; }
.about-values .container, .about-reasons-section .container { width: 100%; max-width: 100%; padding: 0 10%; }
.about-values .section-title { margin-bottom: 15px; }
.about-reasons-section { padding: 15px 0 80px; background-color: #fff; }
.about-reasons-section .section-title { margin-bottom: 15px; }
.about-reasons-section .reasons-grid { margin-top: 0; }
.about-values .values-grid { margin-top: 0; }
.value-card { background: #fff; padding: 32px; border-radius: var(--r-md); border: 1px solid #eee; text-align: center; }
.value-card .feature-icon { margin: 0 auto 20px; }
.reasons-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-4); }
.reason-item { display: flex; align-items: center; gap: var(--sp-3); text-align: left; padding-right: var(--sp-4); position: relative; }
.reason-item:not(:last-child)::after { content: ""; position: absolute; right: 0; top: 15%; height: 70%; width: 1px; background-color: var(--border-light); }
.reason-item:last-child { padding-right: 0; }
.reason-item .feature-icon { margin: 0; }
.reason-title { font-size: var(--fs-lg); color: var(--ink); margin-top: 0; margin-bottom: var(--sp-1); font-weight: bold; }
.reason-desc { color: var(--gray); font-size: var(--fs-sm); margin: 0; }
.cta-banner { background-color: var(--bg-warm); background-image: url('../images/about-cta-left.png'), url('../images/about-cta-right.png'); background-position: left bottom, right bottom; background-repeat: no-repeat, no-repeat; background-size: auto 100%, auto 100%; border-radius: var(--r-lg); padding: 15px 42px; display: flex; align-items: center; justify-content: center; margin-bottom: 0; }
.cta-content { text-align: center; max-width: 600px; z-index: 2; position: relative; }
.cta-title { font-family: var(--title); font-size: var(--fs-5xl); color: var(--ink); margin-top: 0; margin-bottom: var(--sp-4); font-weight: 600; }

/* Bottom feature band (solo Nosotros): icono arriba, texto debajo */
.about-feature-band { background: var(--lavender); padding: var(--sp-6) 0; margin-top: var(--sp-6); }
.about-feature-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-5); }
.about-feature { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--sp-3); color: var(--primary); }
.about-feature .icon { width: 56px; height: 56px; stroke-width: 1.5; }
.about-feature .about-svg { width: 56px; height: 56px; fill: currentColor; stroke: none; }
.about-feature span { font-size: var(--fs-lg); font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; line-height: 1.35; }
@media (max-width: 768px) {
  .about-feature-grid { grid-template-columns: repeat(2, 1fr); gap: var(--sp-5) var(--sp-4); }
}