/* Hereda de global.css el reset, tipografía, color y line-height general.
   Variables globales para contenedor, blanco y radios; selectores exclusivos. */
.events {
  padding: 1.875rem 0;
  background: radial-gradient(ellipse at 78% 100%, #007cbc55, transparent 55%), linear-gradient(110deg, #064b82, #043267 65%, #034876);
  border-block: 0.0625rem solid #66ceef;
}
.events__container { width: min(var(--container-width-fluid), var(--container-width)); margin-inline: auto; }
.events__layout { display: flex; flex-wrap: wrap; gap: 2rem; align-items: center; }
.events__intro { flex: 1 1 21rem; min-width: 0; }
.events__title { font-size: clamp(1.6rem, 2.65vw, 2.2rem); line-height: 1.2; letter-spacing: -.035em; margin-bottom: 0.75rem; }
.events__title span { color: #00c5ef; }
.events__description { max-width: 35ch; font-size: 0.9375rem; line-height: 1.45; color: #e2edf7; }
.events__cta { display: inline-flex; align-items: center; gap: 1.25rem; margin-top: 1.125rem; padding: 0.75rem 1.5rem; border-radius: 1.75rem; background: #00a7ed; color: var(--color-white); text-decoration: none; font-size: 0.875rem; font-weight: 600; box-shadow: 0 0 1.125rem #00aeff40; }
.events__cta span { font-size: 1.4375rem; line-height: 1; }
.events__carousel { flex: 2 1 39rem; min-width: 0; max-width: 100%; }
.events__cards { display: flex; gap: .8125rem; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: var(--color-primary-light) transparent; padding: .375rem .25rem .875rem; }
.events__controls:not([hidden]) { display: flex; justify-content: flex-end; align-items: center; gap: .5rem; margin-top: .5rem; }
.events__controls button { min-height: 2.75rem; padding: .5rem .875rem; border: .0625rem solid #ffffff66; border-radius: var(--radius-sm); background: #ffffff12; color: var(--color-white); cursor: pointer; font-size: .8125rem; }
.events__controls button:hover { background: #ffffff26; }
.events__card { flex: 0 0 calc((100% - 1.625rem) / 3); scroll-snap-align: start; min-width: 0; overflow: hidden; border-radius: 0.375rem; background: var(--color-white); border: 0.0625rem solid #8cd8f7; box-shadow: 0 0 0.8125rem #14bcff38; color: #064777; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }
.events__photo { width: 100%; aspect-ratio: 218 / 142; height: auto; object-fit: cover; background: #d6e8f4; }
.events__card-body { display: flex; align-items: flex-start; gap: 0.5625rem; padding: 0.875rem 0.75rem 1rem; }
.events__card-body > div { flex: 1; min-width: 0; }
.events__calendar { flex-shrink: 0; width: 1.25rem; height: 1.25rem; color: #009cd7; }
.events__card h3 { font-size: 0.8125rem; line-height: 1.35; font-weight: 800; margin-bottom: 0.3125rem; }
.events__card p { color: #52738b; font-size: 0.6875rem; }
.events__arrow { color: #009cd7; font-size: 1.5rem; line-height: .8; }
.events__card:hover { transform: translateY(-0.25rem); box-shadow: 0 0.375rem 1.25rem #00aaff50; }
.events :is(a, button, summary, [tabindex]):focus-visible { outline: 0.1875rem solid #ffdc80; outline-offset: 0.25rem; }
.events__agenda { margin-top: 1.5rem; border-top: 0.0625rem solid #ffffff40; padding-top: 0.875rem; color: #e2edf7; font-size: 0.875rem; }
.events__agenda summary { cursor: pointer; font-weight: 600; }
.events__agenda p { margin-top: 0.625rem; }
.events__agenda:not([open]) { margin-top: 1rem; padding-top: 0; border: 0; }
.events__agenda:not([open]) summary { font-size: 0.75rem; }
@media (max-width: 65.625rem) {
  .events__layout { flex-direction: column; align-items: stretch; gap: 1.5rem; }
  .events__intro, .events__carousel { flex-basis: auto; }
  .events__description { max-width: 62ch; }
  .events__card h3 { font-size: 0.9375rem; }
  .events__card p { font-size: 0.8125rem; }
}
.events__upcoming { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 1rem; }
.events__upcoming article { flex: 1 1 16rem; padding: 1rem; border: .0625rem solid #ffffff40; border-radius: var(--radius-sm); background: #ffffff0d; }
.events__upcoming h3 { font-size: 1rem; }
.events__upcoming p { color: #7de4ff; }
@media (max-width: 48rem) {
  .events__card { flex-basis: calc((100% - .8125rem) / 2); }
}
@media (max-width: 37.5rem) {
  .events { padding-block: 2rem; }
  .events__card { flex-basis: 85%; }
  .events__card-body { padding: 1.125rem; }
  .events__title { font-size: 1.75rem; }
}
@media (prefers-reduced-motion: reduce) {
  .events__card { transition: none; }
  .events__card:hover { transform: none; }
}

/* Vista previa compacta: texto arriba y mosaico fijo de cinco fotos debajo.
   Las filas flexibles ajustan las imágenes a la altura disponible, sin scroll. */
button.events__card { text-align: left; cursor: pointer; }
.events-modal { margin: auto; width: min(92vw, 38rem); height: min(36rem, 92dvh); max-height: none; padding: clamp(.875rem, 2.5vw, 1.5rem); border: 0; border-radius: var(--radius-lg); background: #f8fbff; color: #123566; overflow: hidden; box-shadow: 0 1.5rem 5rem #00152c55; }
.events-modal[open] { display: flex; flex-direction: column; gap: .625rem; }
.events-modal::backdrop { background: #061525b3; backdrop-filter: blur(.25rem); }
.events-modal__close { position: absolute; top: .625rem; right: .625rem; width: 2.75rem; height: 2.75rem; border: .0625rem solid #dbe6ef; border-radius: 50%; background: var(--color-white); color: #123566; font-size: 1.75rem; cursor: pointer; }
.events-modal__category { align-self: flex-start; max-width: calc(100% - 3rem); padding: .25rem .625rem; border-radius: 2rem; color: #007ed5; background: #e1f2ff; font-size: .75rem; font-weight: 700; }
.events-modal h2 { padding-right: 1rem; font-size: clamp(1.375rem, 4vw, 2rem); line-height: 1.15; letter-spacing: -.035em; }
.events-modal__description { color: #536b83; font-size: .875rem; line-height: 1.4; }
.events-modal__gallery { flex: 1; min-height: 0; display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: .375rem; margin-top: .25rem; }
.events-modal__gallery img { width: 100%; height: 100%; min-height: 0; object-fit: cover; border-radius: .5rem; background: #e1eaf3; }
.events-modal__gallery img:first-child { grid-row: span 2; }
.events-modal button:focus-visible { outline: .1875rem solid #007ed5; outline-offset: .125rem; }
@media (max-width: 37.5rem) and (min-height: 30rem) {
  .events-modal { height: min(34rem, 90dvh); }
  .events-modal__gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: 2fr 1fr; }
  .events-modal__gallery img:first-child { grid-column: 1 / -1; grid-row: auto; }
}
@media (max-height: 30rem) {
  .events-modal[open] { gap: .375rem; }
  .events-modal h2 { font-size: 1.25rem; }
  .events-modal__description { font-size: .8125rem; }
}
