/* =============================================
   ENTERTAINMENT GOALS — Página Nosotros
   Extiende inicio.css
   ============================================= */

.logo {
  display: inline-flex;
  align-items: center;
}

.logo-img {
  display: block;
  height: 120px;
  width: auto;
  object-fit: contain;
}

.footer-brand {
  display: inline-flex;
  align-items: center;
  margin-bottom: 12px;
}

.footer-logo {
  display: block;
  height: 140px;
  width: auto;
  object-fit: contain;
}

/* ── Hero centrado ── */
.about-hero {
  padding-block: 80px 72px;
  background: var(--gray-50);
}

.about-hero-inner {
  display: grid;
  justify-items: center;
  text-align: center;
  gap: 20px;
  max-width: 720px;
}

.about-hero-inner .tag {
  align-self: center;
}

.about-hero-inner h1 {
  font-size: clamp(2rem, 4vw, 2.75rem);
  font-weight: 800;
  line-height: 1.2;
  color: var(--navy);
  letter-spacing: -0.02em;
}

.about-hero-inner p {
  font-size: 1rem;
  line-height: 1.75;
  color: var(--gray-500);
  max-width: 600px;
}

/* ── Nuestra historia ── */
.history {
  padding-block: 80px;
  background: var(--white);
}

.history-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 56px;
}

.history-image img {
  width: 100%;
  height: 400px;
  object-fit: cover;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
}

.history-content {
  display: grid;
  gap: 20px;
}

.history-content h2 {
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 800;
  color: var(--navy);
  letter-spacing: -0.02em;
}

.history-content p {
  font-size: 0.95rem;
  line-height: 1.75;
  color: var(--gray-500);
}

.history-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: 8px;
}

.history-stat {
  padding: 20px 24px;
  background: var(--blue-badge);
  border: 1px solid var(--blue-light);
  border-radius: var(--radius-md);
}

.history-stat h3 {
  font-size: 1.75rem;
  font-weight: 800;
  color: var(--blue);
  line-height: 1;
  margin-bottom: 6px;
}

.history-stat p {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--navy);
}

/* ── Misión y Visión ── */
.mission-vision {
  padding-block: 80px;
  background: var(--gray-50);
}

.mv-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.mv-card {
  display: grid;
  gap: 16px;
  padding: 36px 32px;
  background: var(--white);
  border: 1px solid var(--gray-100);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  transition: box-shadow var(--transition), transform var(--transition);
}

.mv-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

.mv-icon {
  width: 48px;
  height: 48px;
  background: var(--blue-badge);
  border: 1px solid var(--blue-light);
  border-radius: var(--radius-sm);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 24px;
}

.mv-icon--rocket {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%232563eb' stroke-width='1.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15.59 14.37a6 6 0 01-5.84 7.38v-4.8m5.84-2.58a14.98 14.98 0 006.16-12.12A14.98 14.98 0 009.631 8.41m5.96 5.96a14.926 14.926 0 01-5.841 2.58m-.119-8.54a6 6 0 00-7.381 5.84h4.8m2.581-5.84a14.927 14.927 0 00-2.58 5.84m2.699 2.7c-.103.021-.207.041-.311.06a15.09 15.09 0 01-2.448-2.448 14.9 14.9 0 01.06-.312m-2.24 2.39a4.493 4.493 0 00-1.757 4.635 4.493 4.493 0 004.635-1.757l-2.878-2.878zm0 0l5.83 5.83'/%3E%3C/svg%3E");
}

.mv-icon--eye {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%232563eb' stroke-width='1.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M2.036 12.322a1.012 1.012 0 010-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178z'/%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15 12a3 3 0 11-6 0 3 3 0 016 0z'/%3E%3C/svg%3E");
}

.mv-card h3 {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--navy);
}

.mv-card p {
  font-size: 0.9rem;
  line-height: 1.75;
  color: var(--gray-500);
}

/* ── Valores ── */
.values {
  padding-block: 80px;
  background: var(--white);
}

.values .container {
  display: grid;
  gap: 48px;
}

.values h2 {
  text-align: center;
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  font-weight: 800;
  color: var(--navy);
  letter-spacing: -0.02em;
}

.values .section-text {
  margin-top: -32px;
}

.values-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

.value-item {
  display: grid;
  justify-items: center;
  text-align: center;
  gap: 14px;
  padding: 8px;
}

.value-icon {
  width: 52px;
  height: 52px;
  background: var(--blue-badge);
  border: 1px solid var(--blue-light);
  border-radius: var(--radius-sm);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 24px;
}

.value-icon--ethics {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%232563eb' stroke-width='1.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M9 12.75L11.25 15 15 9.75m-3-7.036A11.959 11.959 0 013.598 6 11.99 11.99 0 003 9.749c0 5.592 3.824 10.29 9 11.623 5.176-1.332 9-6.03 9-11.622 0-1.31-.21-2.571-.598-3.751h-.152c-3.196 0-6.1-1.248-8.25-3.285z'/%3E%3C/svg%3E");
}

.value-icon--trust {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%232563eb' stroke-width='1.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M21 8.25c0-2.485-2.099-4.5-4.688-4.5-1.935 0-3.597 1.126-4.312 2.733-.715-1.607-2.377-2.733-4.313-2.733C5.1 3.75 3 5.765 3 8.25c0 7.22 9 12 9 12s9-4.78 9-12z'/%3E%3C/svg%3E");
}

.value-icon--innovation {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%232563eb' stroke-width='1.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M12 18v-5.25m0 0a6.01 6.01 0 001.5-.189m-1.5.189a6.01 6.01 0 01-1.5-.189m3.75 7.478a12.06 12.06 0 01-4.5 0m3.75 2.383a14.406 14.406 0 01-3 0M14.25 18v-.192c0-.983.658-1.823 1.508-2.316a7.5 7.5 0 10-7.517 0c.85.493 1.509 1.333 1.509 2.316V18'/%3E%3C/svg%3E");
}

.value-icon--commitment {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%232563eb' stroke-width='1.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15 19.128a9.38 9.38 0 002.625.372 9.337 9.337 0 004.121-.952 4.125 4.125 0 00-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 018.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0111.964-3.07M12 6.375a3.375 3.375 0 11-6.75 0 3.375 3.375 0 016.75 0zm8.25 2.25a2.625 2.625 0 11-5.25 0 2.625 2.625 0 015.25 0z'/%3E%3C/svg%3E");
}

.value-item h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--navy);
}

.value-item p {
  font-size: 0.875rem;
  line-height: 1.65;
  color: var(--gray-500);
}

/* ── CTA oscuro ── */
.cta-dark {
  padding-block: 80px;
  background: var(--navy);
}

.cta-dark-inner {
  display: grid;
  gap: 20px;
  justify-items: center;
  text-align: center;
}

.cta-dark-inner h2 {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 800;
  color: var(--white);
  letter-spacing: -0.02em;
}

.cta-dark-inner p {
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.65);
  max-width: 520px;
}

.cta-dark-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
  margin-top: 8px;
}

.btn-blue {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 28px;
  background: var(--blue);
  color: var(--white);
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: var(--radius-sm);
  border: 2px solid var(--blue);
  transition: background var(--transition), transform var(--transition);
}

.btn-blue:hover {
  background: #1d4ed8;
  border-color: #1d4ed8;
  transform: translateY(-1px);
}

.btn-outline-light {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 28px;
  background: transparent;
  color: var(--white);
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: var(--radius-sm);
  border: 2px solid rgba(255, 255, 255, 0.5);
  transition: background var(--transition), border-color var(--transition);
}

.btn-outline-light:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: var(--white);
}

/* ── Responsive ── */
@media (max-width: 1024px) {
  .values-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
  }

  .history-image img {
    height: 340px;
  }
}

@media (max-width: 768px) {
  .about-hero {
    padding-block: 56px 48px;
  }

  .history,
  .mission-vision,
  .values,
  .cta-dark {
    padding-block: 56px;
  }

  .history-grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .history-image {
    order: -1;
  }

  .history-image img {
    height: 260px;
  }

  .mv-grid {
    grid-template-columns: 1fr;
  }

  .values-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

@media (max-width: 480px) {
  .history-stats {
    grid-template-columns: 1fr;
  }

  .cta-dark-buttons {
    flex-direction: column;
    width: 100%;
  }

  .cta-dark-buttons .btn-blue,
  .cta-dark-buttons .btn-outline-light {
    width: 100%;
  }
}
