/* Noticias, redes sociales y llamado a agendar reunión. */

/* Noticias */
.news {
  padding-block: clamp(4rem, 7vw, 6rem);
  background: var(--ink-900);
}

.news__head,
.social__head {
  display: grid;
  gap: 1.5rem;
  align-items: end;
}

.news__note {
  max-width: 44ch;
  color: var(--text-muted);
}

.news__note em {
  color: var(--text-faint);
}

.news__grid {
  display: grid;
  gap: 1.5rem;
  margin-top: 3rem;
}

.post {
  display: grid;
  align-content: start;
  gap: 0.75rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--line);
}

.post__photo {
  aspect-ratio: 16 / 10;
  margin-bottom: 0.5rem;
  overflow: hidden;
  border-radius: 1rem;
}

.post__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(0.3);
  transition: transform 0.9s var(--ease), filter 0.6s var(--ease);
}

.post:hover .post__photo img {
  transform: scale(1.05);
  filter: grayscale(0);
}

.post__tag {
  justify-self: start;
  padding: 0.3rem 0.75rem;
  border: 1px solid rgb(232 136 43 / 0.5);
  border-radius: 999px;
  color: var(--orange);
  font-family: var(--font-sans);
  font-size: 0.75rem;
  font-weight: 600;
}

.post__title {
  font-family: var(--font-sans);
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.25;
}

.post__meta {
  color: var(--text-faint);
  font-size: 0.8125rem;
}

@media (min-width: 64em) {
  .news__head,
  .social__head {
    grid-template-columns: 1.4fr 1fr;
    gap: 4rem;
  }

  .news__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Redes sociales */
.social {
  padding-block: clamp(4rem, 7vw, 6rem);
}

.social__links {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.social__link {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding: 0.8rem 1.25rem 0.8rem 0.9rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--text-muted);
  font-size: 0.875rem;
  text-decoration: none;
  transition: border-color 0.3s var(--ease), transform 0.3s var(--ease);
}

.social__link:hover {
  border-color: var(--orange);
  transform: translateY(-2px);
}

.social__link svg {
  width: 2.5rem;
  height: 2.5rem;
  padding: 0.6rem;
  border-radius: 50%;
  background: var(--orange);
  fill: none;
  stroke: var(--ink-950);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.social__link strong {
  display: block;
  color: var(--white);
  font-family: var(--font-sans);
  font-size: 1rem;
}

.social__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
  margin-top: 3rem;
}

.tile {
  position: relative;
  display: block;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 1rem;
}

.tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.9s var(--ease);
}

.tile::after {
  content: 'Ver en Instagram';
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgb(18 19 21 / 0.6);
  color: var(--white);
  font-family: var(--font-sans);
  font-size: 0.875rem;
  font-weight: 600;
  opacity: 0;
  transition: opacity 0.4s var(--ease);
}

.tile:hover img,
.tile:focus-visible img {
  transform: scale(1.08);
}

.tile:hover::after,
.tile:focus-visible::after {
  opacity: 1;
}

@media (min-width: 48em) {
  .social__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 80em) {
  .social__grid {
    grid-template-columns: repeat(6, 1fr);
  }
}

/* Agendar reunión: centrado con resplandor e imagen en movimiento detrás */
.cta {
  position: relative;
  padding-block: clamp(8rem, 15vw, 13rem);
  overflow: hidden;
  isolation: isolate;
  text-align: center;
  background: var(--teal-950);
}

.cta__media {
  position: absolute;
  inset: 0;
  z-index: -2;
}

.cta__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  animation: cta-drift 24s ease-in-out infinite alternate;
}

.cta__media::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(60% 70% at 50% 50%, rgb(7 26 31 / 0.72), rgb(7 26 31 / 0.94)),
    linear-gradient(180deg, var(--ink-950), transparent 20%, transparent 80%, var(--ink-950));
}

@keyframes cta-drift {
  from { transform: scale(1.08) translate(-2%, -1%); }
  to { transform: scale(1.22) translate(2%, 2%); }
}

.cta__glow {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: -1;
  width: 42rem;
  aspect-ratio: 1;
  translate: -50% -50%;
  border-radius: 50%;
  background: radial-gradient(circle, rgb(232 136 43 / 0.32), transparent 65%);
  filter: blur(20px);
  animation: cta-glow 6s ease-in-out infinite alternate;
}

@keyframes cta-glow {
  from { opacity: 0.7; transform: scale(0.92); }
  to { opacity: 1; transform: scale(1.08); }
}

.cta__inner {
  display: grid;
  justify-items: center;
  gap: 2rem;
}

.cta__title {
  max-width: 20ch;
  font-family: var(--font-sans);
  font-size: clamp(2.25rem, 1rem + 4vw, 4.5rem);
  font-weight: 600;
  line-height: 1.02;
  letter-spacing: -0.03em;
}

.cta__title em {
  color: var(--orange);
  font-style: normal;
}

.cta__text {
  max-width: 50ch;
  color: var(--text-muted);
}

.btn--glow {
  border-radius: 0.75rem;
  box-shadow: 0 12px 40px -10px rgb(232 136 43 / 0.8);
}
