/* /events (rediseño 2026-11-03, lienzo DNhLbHanGxavSBUx3L4pVw, v3). Prefijo ev-*. Las tarjetas de evento son las de siempre
   (.v-event-card, components.css). Ancho de pagina: --page-max / --page-gutter. Solo tokens. */

.ev-page { background: var(--bg-page); }
.ev-wrap { max-width: var(--page-max); margin: 0 auto; padding-left: var(--page-gutter); padding-right: var(--page-gutter); box-sizing: border-box; }
.ev-wrap--top { padding-top: 32px; display: flex; flex-direction: column; gap: 24px; }
.ev-sections { padding-top: 40px; padding-bottom: 56px; display: flex; flex-direction: column; gap: 44px; }
.ev-sections--end { padding-top: 56px; padding-bottom: 72px; }
.ev-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ev-h2 { margin: 0; font-size: 26px; font-weight: 800; letter-spacing: -.02em; line-height: 1.2; color: var(--text-primary); }
.ev-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.ev-head--wrap { flex-wrap: wrap; }
.ev-link { font-size: 14px; font-weight: 600; color: var(--text-primary); text-decoration: none; }
.ev-link:hover { color: var(--accent-text); }
.ev-note { margin: 12px 0 0; font-size: 13px; color: var(--text-muted); }

/* ── Portada: titulo y buscador ─────────────────────────────── */
.ev-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.ev-eyebrow { margin: 0 0 12px; font-size: var(--text-micro); font-weight: 600; letter-spacing: var(--tracking-wider); text-transform: uppercase; color: var(--accent-text); }
.ev-intro__title { margin: 0 0 12px; font-family: var(--font-serif); font-size: var(--fs-display-2); line-height: var(--lh-tight); font-weight: 500; letter-spacing: var(--tracking-tight); }
.ev-intro__lead { margin: 0; font-size: 16px; line-height: 1.6; color: var(--text-secondary); }
.ev-intro--compact { align-items: center; }
.ev-intro__line { margin: 0; font-family: var(--font-sans); font-size: 18px; font-weight: 400; line-height: 1.5; color: var(--text-secondary); letter-spacing: 0; }
.ev-intro__line b { color: var(--text-primary); font-weight: 700; }
.ev-search {
  display: flex; align-items: center; gap: 10px; width: 460px; max-width: 100%; height: 50px; padding: 0 6px 0 16px; box-sizing: border-box;
  background: var(--bg-card); border: 1px solid var(--border-subtle); border-radius: var(--radius-md); box-shadow: var(--shadow-card); color: var(--text-muted);
}
.ev-search:focus-within { border-color: var(--border-strong); }
.ev-search input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; font-size: 15px; color: var(--text-primary); }
.ev-search__btn { height: 38px; padding: 0 16px; border: 0; border-radius: var(--radius-sm); background: var(--ink); color: var(--surface); font-size: 13px; font-weight: 600; cursor: pointer; }

/* ── Banner de campaña (Admin > Banners) ────────────────────── */
.ev-banner { position: relative; height: 460px; border-radius: var(--radius-lg); overflow: hidden; background: var(--bg-dark); }
.ev-banner__slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .6s var(--ease-standard), visibility 0s linear .6s; }
.ev-banner__slide.is-on { opacity: 1; visibility: visible; transition: opacity .6s var(--ease-standard); }
.ev-banner__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }
.ev-banner__shade { position: absolute; inset: 0; background: linear-gradient(90deg, color-mix(in oklch, var(--ink) 75%, transparent) 0%, color-mix(in oklch, var(--ink) 35%, transparent) 50%, transparent 80%); }
.ev-banner__body { position: relative; height: 100%; box-sizing: border-box; padding: 0 64px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 14px; }
.ev-banner__kicker { display: inline-block; padding: 3px 10px; background: var(--wine-15); color: var(--text-primary); font-size: 15px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.ev-banner__title { margin: 0; display: flex; flex-direction: column; gap: 6px; }
.ev-banner__line > span {
  display: inline; padding: 2px 16px 4px; font-size: 58px; line-height: 1.12; font-weight: 800; letter-spacing: -.02em; text-transform: uppercase;
  color: var(--text-primary); background: linear-gradient(90deg, var(--pine-40), var(--wine-40));
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}
.ev-banner__line--2 { margin-left: 120px; }
.ev-banner__btn {
  display: inline-flex; align-items: center; height: 54px; padding: 0 30px; margin-top: 8px; border-radius: var(--radius-pill);
  background: var(--bg-card); color: var(--text-primary); font-size: 18px; font-weight: 700; text-decoration: none;
}
.ev-banner__btn:hover { background: var(--surface); color: var(--text-primary); }
.ev-banner__dots { position: absolute; left: 64px; bottom: 26px; display: flex; gap: 6px; }
.ev-banner__dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: var(--radius-pill); background: color-mix(in oklch, var(--surface) 45%, transparent); cursor: pointer; transition: width var(--duration-fast) var(--ease-standard); }
.ev-banner__dot.is-on { width: 24px; background: var(--bg-card); }

/* ── Evento destacado (sin banner vigente) ──────────────────── */
.ev-featured { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); border-radius: var(--radius-lg); overflow: hidden; background: var(--bg-card); border: 1px solid var(--border-subtle); text-decoration: none; color: var(--text-primary); }
.ev-featured:hover { color: var(--text-primary); box-shadow: var(--shadow-card); }
.ev-featured__photo { position: relative; min-height: 340px; background: var(--surface); }
.ev-featured__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ev-featured__body { padding: 36px; display: flex; flex-direction: column; justify-content: center; gap: 12px; }
.ev-featured__kicker { align-self: flex-start; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: 5px 12px; border-radius: var(--radius-pill); background: var(--wine-15); color: var(--accent-text); }
.ev-featured__title { font-size: 34px; line-height: 1.12; font-weight: 800; letter-spacing: -.02em; }
.ev-featured__meta { display: flex; align-items: center; gap: 8px; font-size: 15px; color: var(--text-secondary); }
.ev-featured__foot { display: flex; align-items: center; gap: 18px; margin-top: 8px; flex-wrap: wrap; }
.ev-featured__price { font-size: 15px; color: var(--text-secondary); }
.ev-featured__price b { font-size: 18px; color: var(--text-primary); }
.ev-featured__btn { display: inline-flex; align-items: center; height: 46px; padding: 0 22px; border-radius: var(--radius-pill); background: var(--accent-primary); color: var(--text-on-accent); font-size: 15px; font-weight: 700; }

/* ── Explora por categoria: una fila con flechas ────────────── */
.ev-cats { display: flex; flex-direction: column; gap: 16px; }
.ev-arrows { display: flex; gap: 8px; }
.ev-arrow {
  width: 40px; height: 40px; border-radius: var(--radius-pill); border: 1px solid var(--border-subtle); background: var(--bg-card); color: var(--text-primary);
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font-size: 14px;
}
.ev-arrow:disabled { color: var(--border-strong); cursor: default; }
.ev-rail { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; }
.ev-rail::-webkit-scrollbar { display: none; }
.ev-cat {
  position: relative; display: block; flex: none; width: calc((100% - 3 * 14px) / 4); height: 140px; border-radius: var(--radius-lg); overflow: hidden;
  background: var(--bg-dark); color: var(--text-on-accent); text-decoration: none; scroll-snap-align: start;
}
.ev-cat img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform var(--duration-base) var(--ease-standard); }
.ev-cat:hover img { transform: scale(1.04); }
.ev-cat:hover { color: var(--text-on-accent); }
.ev-cat__shade { position: absolute; inset: 0; background: linear-gradient(to top, color-mix(in oklch, var(--ink) 90%, transparent) 0%, color-mix(in oklch, var(--ink) 45%, transparent) 45%, transparent 75%); }
.ev-cat__name { position: absolute; left: 16px; right: 90px; bottom: 14px; font-size: 18px; font-weight: 800; line-height: 1.2; }
.ev-cat__count { position: absolute; right: 16px; bottom: 14px; font-size: 13px; color: var(--surface); white-space: nowrap; }
/* Sin foto (categoria sin pagina): color de la paleta. */
.ev-cat--wine { background: var(--wine); }
.ev-cat--pine { background: var(--pine); }
.ev-cat--moss { background: var(--moss); }
.ev-cat--ink { background: var(--ink); }
.ev-cat--wine .ev-cat__shade, .ev-cat--pine .ev-cat__shade, .ev-cat--moss .ev-cat__shade, .ev-cat--ink .ev-cat__shade { display: none; }

/* ── Lo que mas se busca ────────────────────────────────────── */
.ev-popular { display: flex; flex-direction: column; gap: 20px; }
.ev-tabs { display: flex; gap: 28px; border-bottom: 1px solid var(--border-subtle); overflow-x: auto; scrollbar-width: none; }
.ev-tab { border: 0; border-bottom: 2px solid transparent; background: transparent; padding: 10px 0; margin-bottom: -1px; font-size: 16px; font-weight: 600; color: var(--text-secondary); cursor: pointer; white-space: nowrap; }
.ev-tab[aria-selected="true"] { border-bottom-color: var(--accent-primary); color: var(--text-primary); font-weight: 700; }
.ev-tab:focus-visible { outline: 2px solid var(--accent-primary); outline-offset: 2px; }
.ev-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.ev-row__item { min-width: 0; display: flex; }
.v-event-card__rank {
  position: absolute; top: 10px; left: 10px; width: 44px; height: 44px; border-radius: var(--radius-pill); background: var(--ink); color: var(--text-on-accent);
  display: inline-flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 800; box-shadow: 0 0 0 3px var(--bg-card);
}
.v-event-card__cat--right { left: auto; right: 12px; }

/* ── Todos los eventos ──────────────────────────────────────── */
.ev-all { display: flex; flex-direction: column; gap: 20px; scroll-margin-top: 88px; }
.ev-all__title { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ev-chip-filter {
  display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 12px; border: 0; border-radius: var(--radius-pill);
  background: var(--ink); color: var(--surface); font-size: 13px; font-weight: 600; cursor: pointer;
}
.ev-dates { display: inline-flex; padding: 4px; background: var(--bg-card); border: 1px solid var(--border-subtle); border-radius: var(--radius-pill); }
.ev-date { border: 0; border-radius: var(--radius-pill); padding: 8px 16px; font-size: 13px; font-weight: 600; background: transparent; color: var(--text-secondary); cursor: pointer; white-space: nowrap; }
.ev-date.is-on { background: var(--ink); color: var(--surface); }
.ev-date:focus-visible { outline: 2px solid var(--accent-primary); outline-offset: 2px; }
.v-events-grid__item.is-later { display: none; }
.ev-more { display: flex; justify-content: center; }
.ev-more__btn { height: 46px; padding: 0 24px; border-radius: var(--radius-pill); border: 1px solid var(--border-strong); background: var(--bg-card); color: var(--text-primary); font-size: 15px; font-weight: 700; cursor: pointer; }
/* Mientras se busca, la cuadricula sube: se esconden las secciones de arriba. */
.ev-page.is-searching [data-ev-hide-on-search] { display: none; }

/* ── Comprar es asi de facil: franja lavanda a todo lo ancho, animada ── */
.ev-steps { background: var(--surface); padding: 56px 0; }
.ev-steps__inner { display: flex; flex-direction: column; gap: 30px; }
.ev-steps__head { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.ev-steps__title { font-size: 30px; }
.ev-steps__sub { margin: 0; font-size: 15px; color: var(--text-secondary); }
.ev-steps__list { position: relative; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ev-steps__line { position: absolute; top: 31px; left: 16.6%; right: 16.6%; height: 0; border-top: 2px dashed var(--border-strong); }
.ev-steps__line span { position: absolute; top: -2px; left: 0; height: 2px; width: 100%; background: var(--accent-primary); }
.ev-step { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; padding: 0 12px; min-width: 0; }
.ev-step__icon {
  position: relative; z-index: 1; width: 64px; height: 64px; border-radius: var(--radius-pill); background: var(--bg-card); border: 2px solid var(--accent-primary);
  color: var(--accent-text); display: inline-flex; align-items: center; justify-content: center; font-size: 22px;
}
.ev-step__text { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.ev-step__num { font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }
.ev-step__title { font-size: 19px; color: var(--text-primary); }
.ev-step__desc { font-size: 15px; line-height: 1.55; color: var(--text-secondary); max-width: 30ch; }
.ev-trust { display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; padding-top: 22px; border-top: 1px solid var(--border-subtle); }
.ev-trust__item { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-secondary); }
.ev-trust__item .fa-lock { color: var(--status-success); }
.ev-trust__sep { width: 1px; height: 22px; background: var(--border-subtle); margin: 0 6px; }
/* Dos grupos (pago y Wallet): en una fila en computadora; en celular cada uno en su renglon, las pildoras juntas. */
.ev-trust__group { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ev-trust__pills { display: inline-flex; gap: 8px; flex-wrap: wrap; }
.ev-pill { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: var(--radius-pill); background: var(--bg-card); border: 1px solid var(--border-subtle); font-size: 13px; font-weight: 600; color: var(--text-primary); }
/* Animacion (6 s por vuelta): la linea naranja avanza; cada paso late al llegar. Solo cuando se ve (.is-playing) y sin
   "reducir movimiento"; quieta, la franja se ve completa. */
@keyframes evFill { 0% { width: 0; opacity: 1; } 66% { width: 100%; opacity: 1; } 90% { width: 100%; opacity: 1; } 100% { width: 100%; opacity: 0; } }
@keyframes evFillV { 0% { height: 0; opacity: 1; } 66% { height: 100%; opacity: 1; } 90% { height: 100%; opacity: 1; } 100% { height: 100%; opacity: 0; } }
@keyframes evNode {
  0% { transform: scale(1); box-shadow: 0 0 0 0 color-mix(in oklch, var(--accent-primary) 0%, transparent); background: var(--bg-card); }
  6% { transform: scale(1.1); box-shadow: 0 0 0 12px color-mix(in oklch, var(--accent-primary) 16%, transparent); background: var(--wine-15); }
  14% { transform: scale(1); box-shadow: 0 0 0 0 color-mix(in oklch, var(--accent-primary) 0%, transparent); background: var(--wine-15); }
  88% { background: var(--wine-15); }
  100% { transform: scale(1); background: var(--bg-card); }
}
@keyframes evLabel { 0%, 4% { color: var(--text-muted); } 8%, 90% { color: var(--accent-text); } 100% { color: var(--text-muted); } }
@media (prefers-reduced-motion: no-preference) {
  .ev-steps.is-playing .ev-steps__line span { animation: evFill 6s linear infinite both; }
  .ev-steps.is-playing .ev-step__icon { animation: evNode 6s ease-out infinite both; }
  .ev-steps.is-playing .ev-step__num { animation: evLabel 6s linear infinite both; }
  .ev-steps.is-playing .ev-step--1 .ev-step__icon, .ev-steps.is-playing .ev-step--1 .ev-step__num { animation-delay: 2s; }
  .ev-steps.is-playing .ev-step--2 .ev-step__icon, .ev-steps.is-playing .ev-step--2 .ev-step__num { animation-delay: 4s; }
}

/* ── Blog ───────────────────────────────────────────────────── */
.ev-blog { display: flex; flex-direction: column; gap: 16px; }
.ev-blog__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.ev-post { display: flex; flex-direction: column; gap: 10px; text-decoration: none; color: var(--text-primary); min-width: 0; }
.ev-post:hover { color: var(--text-primary); }
.ev-post:hover .ev-post__title { text-decoration: underline; }
.ev-post__photo { display: block; aspect-ratio: 3 / 2; border-radius: var(--radius-lg); overflow: hidden; background: var(--surface); }
.ev-post__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ev-post__body { display: flex; flex-direction: column; gap: 6px; }
.ev-post__kicker { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--accent-text); }
.ev-post__title { font-size: 18px; font-weight: 800; line-height: 1.3; }
.ev-post__date { font-size: 13px; color: var(--text-muted); }

/* ── Organizadores ──────────────────────────────────────────── */
.ev-org { background: var(--bg-dark); color: var(--text-on-dark); border-radius: var(--radius-lg); padding: 34px 38px; display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.ev-org > div { display: flex; flex-direction: column; gap: 8px; max-width: 60ch; }
.ev-org__eyebrow { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--accent-primary); }
.ev-org__title { margin: 0; font-size: 26px; font-weight: 800; letter-spacing: -.02em; color: var(--text-on-accent); }
.ev-org__text { margin: 0; font-size: 15px; line-height: 1.6; color: var(--text-on-dark); }
.ev-org__btn { display: inline-flex; align-items: center; height: 48px; padding: 0 26px; border-radius: var(--radius-pill); background: var(--accent-primary); color: var(--text-on-accent); font-size: 15px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.ev-org__btn:hover { background: var(--accent-primary-hover); color: var(--text-on-accent); }

/* ── Pagina de una categoria (/events/{slug}, 2026-11-04, lienzo "Pagina por categoria A") ── */
.ev-cathero { position: relative; height: 380px; border-radius: var(--radius-lg); overflow: hidden; background: var(--bg-dark); color: var(--text-on-accent); }
.ev-cathero__pic, .ev-cathero__img { position: absolute; inset: 0; width: 100%; height: 100%; }
.ev-cathero__img { object-fit: cover; }
.ev-cathero__shade { position: absolute; inset: 0; background: linear-gradient(90deg, color-mix(in oklch, var(--ink) 80%, transparent) 0%, color-mix(in oklch, var(--ink) 40%, transparent) 55%, transparent 85%); }
.ev-cathero--color .ev-cathero__shade { display: none; }
.ev-cathero__body { position: relative; height: 100%; box-sizing: border-box; padding: 0 64px; display: flex; flex-direction: column; justify-content: center; gap: 16px; }
.ev-cathero__text { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.ev-cathero__crumbs { display: flex; gap: 8px; font-size: 13px; color: var(--surface); }
.ev-cathero__crumbs a { color: var(--surface); text-decoration: none; }
.ev-cathero__crumbs a:hover { color: var(--text-on-accent); text-decoration: underline; }
.ev-cathero__crumbs [aria-current] { color: var(--text-on-accent); font-weight: 600; }
.ev-cathero__lead { margin: 0; max-width: 52ch; font-size: 17px; line-height: 1.55; color: var(--text-on-accent); }
.ev-cathero__meta { font-size: 14px; font-weight: 600; color: var(--surface); }
/* Punto de enfoque de la foto (Admin › Categorias): el recorte deja a la vista lo importante. Vale para la portada, la
   tarjeta de "Explora por categoria" y los recortes de la vista previa del Admin. */
.ev-focus-tl img { object-position: 20% 15%; }  .ev-focus-tc img { object-position: 50% 15%; }  .ev-focus-tr img { object-position: 80% 15%; }
.ev-focus-ml img { object-position: 20% 50%; }  .ev-focus-mc img { object-position: 50% 50%; }  .ev-focus-mr img { object-position: 80% 50%; }
.ev-focus-bl img { object-position: 20% 85%; }  .ev-focus-bc img { object-position: 50% 85%; }  .ev-focus-br img { object-position: 80% 85%; }
.ev-catsearch { display: flex; justify-content: flex-end; }
.ev-all__count { font-size: 14px; color: var(--text-muted); }
.ev-catempty { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 32px; background: var(--bg-card); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); }
.ev-catempty p { margin: 0; font-size: 15px; color: var(--text-secondary); }
.ev-about { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: start; }
.ev-about--faq { grid-template-columns: minmax(0, 760px); }
.ev-about__text { display: flex; flex-direction: column; gap: 12px; }
.ev-about__text p { margin: 0; max-width: 62ch; font-size: 15px; line-height: 1.7; color: var(--text-secondary); }
.ev-about__faq { display: flex; flex-direction: column; gap: 10px; }
.ev-about__h3 { margin: 0 0 4px; font-size: 17px; font-weight: 800; color: var(--text-primary); }
/* Preguntas: las mismas de /organizer/pricing (.pr-q). */
.ev-faq { background: var(--bg-card); border: 1px solid var(--border-subtle); border-radius: var(--radius-md); }
.ev-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 17px 22px; cursor: pointer; list-style: none; font-size: 15px; font-weight: 600; color: var(--text-primary); }
.ev-faq summary::-webkit-details-marker { display: none; }
.ev-faq summary::after { content: "+"; font-size: 20px; font-weight: 400; color: var(--accent-primary); line-height: 1; flex-shrink: 0; }
.ev-faq[open] summary::after { content: "\2013"; }
.ev-faq summary:focus-visible { outline: 2px solid var(--accent-primary); outline-offset: -2px; }
.ev-faq p { margin: 0; padding: 0 22px 19px; font-size: 14px; line-height: 1.65; color: var(--text-secondary); }

/* ── Tableta ─────────────────────────────────────────────────── */
@media (max-width: 1023px) {
  .ev-banner__line > span { font-size: 44px; }
  .ev-banner__body { padding: 0 40px; }
  .ev-banner__dots { left: 40px; }
  .ev-cat { width: calc((100% - 2 * 14px) / 3); }
  .ev-featured { grid-template-columns: minmax(0, 1fr); }
  .ev-featured__photo { min-height: 260px; }
}

/* ── Celular (lienzo "v3 en celular") ───────────────────────── */
@media (max-width: 760px) {
  .ev-wrap { padding-left: var(--space-4); padding-right: var(--space-4); }
  .ev-wrap--top { padding-top: 16px; gap: 16px; }
  .ev-sections { padding-top: 28px; padding-bottom: 32px; gap: 32px; }
  .ev-sections--end { padding-top: 32px; padding-bottom: 40px; }
  .ev-h2 { font-size: 21px; }
  .ev-intro { gap: 16px; }
  .ev-intro__title { font-size: 34px; }
  .ev-intro__line { font-size: 15px; }
  .ev-search { width: 100%; height: 50px; }
  .ev-search input { font-size: 16px; }
  .ev-banner { height: 440px; }
  .ev-banner__shade { background: linear-gradient(to top, color-mix(in oklch, var(--ink) 85%, transparent) 0%, color-mix(in oklch, var(--ink) 35%, transparent) 55%, color-mix(in oklch, var(--ink) 10%, transparent) 100%); }
  .ev-banner__body { padding: 0 22px 48px; justify-content: flex-end; }
  .ev-banner__kicker { font-size: 13px; }
  .ev-banner__line > span { font-size: 30px; padding: 2px 10px 3px; }
  .ev-banner__line--2 { margin-left: 0; }
  .ev-banner__btn { height: 48px; padding: 0 22px; font-size: 15px; }
  .ev-banner__dots { left: 22px; bottom: 18px; }
  .ev-featured__body { padding: 18px; gap: 8px; }
  .ev-featured__photo { min-height: 200px; }
  .ev-featured__title { font-size: 22px; }
  .ev-featured__foot { justify-content: space-between; }
  .ev-arrows { display: none; }
  /* Filas que se deslizan de orilla a orilla */
  .ev-rail, .ev-tabs, .ev-dates { margin: 0 calc(-1 * var(--space-4)); padding-left: var(--space-4); padding-right: var(--space-4); }
  .ev-cat { width: 230px; height: 120px; }
  .ev-row { display: flex; gap: 12px; overflow-x: auto; margin: 0 calc(-1 * var(--space-4)); padding: 0 var(--space-4) 6px; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .ev-row__item { flex: none; width: 270px; scroll-snap-align: start; }
  .ev-dates { display: flex; gap: 8px; overflow-x: auto; border: 0; background: transparent; border-radius: 0; scrollbar-width: none; }
  .ev-date { flex: none; height: 40px; border: 1.5px solid var(--border-subtle); background: var(--bg-card); color: var(--text-primary); font-size: 14px; }
  .ev-date.is-on { border-color: var(--ink); }
  .ev-more__btn { width: 100%; height: 48px; }
  .ev-steps { padding: 32px 0; }
  .ev-steps__head { align-items: flex-start; text-align: left; gap: 4px; }
  .ev-steps__title { font-size: 22px; }
  .ev-steps__sub { font-size: 14px; }
  .ev-steps__list { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .ev-steps__line { top: 28px; bottom: 28px; left: 27px; right: auto; width: 0; height: auto; border-top: 0; border-left: 2px dashed var(--border-strong); }
  .ev-steps__line span { top: 0; left: -2px; width: 2px; height: 100%; }
  .ev-step { flex-direction: row; align-items: flex-start; text-align: left; gap: 14px; padding: 0; }
  .ev-step__icon { flex: none; width: 56px; height: 56px; font-size: 20px; }
  .ev-step__text { align-items: flex-start; gap: 4px; padding-top: 4px; }
  .ev-step__title { font-size: 17px; }
  .ev-trust { flex-direction: column; align-items: flex-start; gap: 16px; }
  .ev-trust__group { flex-direction: column; align-items: flex-start; gap: 8px; }
  .ev-trust__pills { flex-wrap: nowrap; }
  .ev-pill { white-space: nowrap; }
  .ev-trust__sep { display: none; }
  .ev-blog__grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .ev-post { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 14px; align-items: center; }
  .ev-post__photo { aspect-ratio: auto; height: 76px; border-radius: var(--radius-md); }
  .ev-post__kicker { display: none; }
  .ev-post__title { font-size: 15px; }
  .ev-org { padding: 26px 22px; flex-direction: column; align-items: stretch; }
  .ev-org__title { font-size: 22px; }
  .ev-org__btn { justify-content: center; }
  .ev-cathero { height: 430px; }
  .ev-cathero__shade { background: linear-gradient(to top, color-mix(in oklch, var(--ink) 92%, transparent) 0%, color-mix(in oklch, var(--ink) 55%, transparent) 50%, color-mix(in oklch, var(--ink) 10%, transparent) 100%); }
  .ev-cathero__body { padding: 18px 20px 22px; justify-content: space-between; }
  .ev-cathero__text { gap: 12px; }
  .ev-cathero .ev-banner__kicker { font-size: 13px; }
  .ev-cathero .ev-banner__line > span { font-size: 32px; padding: 2px 10px 3px; }
  .ev-cathero__lead { font-size: 15px; line-height: 1.5; }
  .ev-cathero__meta { font-size: 13px; }
  .ev-catsearch { justify-content: stretch; }
  .ev-about { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .ev-catempty { padding: 22px; }
}
@media (max-width: 760px) and (prefers-reduced-motion: no-preference) {
  .ev-steps.is-playing .ev-steps__line span { animation-name: evFillV; }
}

/* Banner en version celular a la fuerza: la vista previa del Admin (Banner/Edit). Repite las reglas del banner de arriba
   (@media max-width 760px); si cambian alla, cambiarlas aqui. */
.ev-banner--phone { height: 440px; }
.ev-banner--phone .ev-banner__shade { background: linear-gradient(to top, color-mix(in oklch, var(--ink) 85%, transparent) 0%, color-mix(in oklch, var(--ink) 35%, transparent) 55%, color-mix(in oklch, var(--ink) 10%, transparent) 100%); }
.ev-banner--phone .ev-banner__body { padding: 0 22px 48px; justify-content: flex-end; }
.ev-banner--phone .ev-banner__kicker { font-size: 13px; }
.ev-banner--phone .ev-banner__line > span { font-size: 30px; padding: 2px 10px 3px; }
.ev-banner--phone .ev-banner__line--2 { margin-left: 0; }
.ev-banner--phone .ev-banner__btn { height: 48px; padding: 0 22px; font-size: 15px; }

/* Portada de categoria en version celular a la fuerza (vista previa del Admin). Repite las reglas de arriba
   (@media max-width 760px); si cambian alla, cambiarlas aqui. */
.ev-cathero--phone { height: 430px; }
.ev-cathero--phone .ev-cathero__shade { background: linear-gradient(to top, color-mix(in oklch, var(--ink) 92%, transparent) 0%, color-mix(in oklch, var(--ink) 55%, transparent) 50%, color-mix(in oklch, var(--ink) 10%, transparent) 100%); }
.ev-cathero--phone .ev-cathero__body { padding: 18px 20px 22px; justify-content: space-between; }
.ev-cathero--phone .ev-cathero__text { gap: 12px; }
.ev-cathero--phone .ev-banner__kicker { font-size: 13px; }
.ev-cathero--phone .ev-banner__line > span { font-size: 32px; padding: 2px 10px 3px; }
.ev-cathero--phone .ev-cathero__lead { font-size: 15px; line-height: 1.5; }
.ev-cathero--phone .ev-cathero__meta { font-size: 13px; }
