/**
 * Eventos — guía de conciertos en México.
 */

/* Next-up card: the hero aside on /eventos/. */
.kc-evnext {
	display: grid;
	grid-template-rows: auto 1fr;
	align-content: start;
	background: #fff;
	color: var(--kc-ink);
	text-decoration: none;
	outline: 8px solid var(--kc-red);
	overflow: hidden;
	transition: transform .25s var(--kc-ease);
}
.kc-evnext:hover { transform: translateY(-3px); }
.kc-evnext__media {
	display: block;
	aspect-ratio: 4 / 3;
	background: var(--kc-ink);
}
.kc-evnext__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.kc-evnext__body {
	display: grid;
	gap: .55rem;
	padding: 1.15rem 1.25rem 1.35rem;
}
.kc-evnext__label {
	font: 700 .68rem/1 var(--kc-font-body);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--kc-red);
}
.kc-evnext__date {
	display: flex;
	align-items: flex-end;
	gap: .75rem;
	margin-top: .25rem;
}
.kc-evnext__day {
	font-family: var(--kc-font-display);
	font-weight: 800;
	font-size: clamp(4rem, 10vw, 5.5rem);
	line-height: .8;
	color: var(--kc-red);
}
.kc-evnext__month {
	display: block;
	font: 700 .78rem/1.25 var(--kc-font-body);
	letter-spacing: .1em;
	text-transform: uppercase;
}
.kc-evnext__artist {
	margin-top: .35rem;
	font-family: var(--kc-font-display);
	font-weight: 800;
	font-size: clamp(1.75rem, 3vw, 2.35rem);
	line-height: .9;
	text-transform: uppercase;
}
.kc-evnext__place {
	color: var(--kc-fg-muted);
	font-size: .95rem;
}
.kc-evnext__cta {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	margin-top: .55rem;
	font: 700 .78rem/1 var(--kc-font-body);
	letter-spacing: .08em;
	text-transform: uppercase;
}
.kc-evnext__cta .kc-icon { width: 1em; height: 1em; }

.kc-evsingle__when {
	margin: 0 0 .75rem;
	font: 700 .85rem/1.3 var(--kc-font-body);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--kc-sky);
}
.kc-evsingle__facts {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem 1.5rem;
	margin: 1.25rem 0 0;
}
.kc-evsingle__facts li {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	color: rgba(255,255,255,.86);
}
.kc-evsingle__media {
	margin-top: clamp(1.75rem, 4vw, 3rem);
	overflow: hidden;
	aspect-ratio: 16 / 9;
	outline: 8px solid var(--kc-red);
	background: #0a0a12;
}
.kc-evsingle__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.kc-evtools {
	background: var(--kc-blue-deep);
	color: #fff;
	padding: 1.75rem 0 2.25rem;
	border-top: 1px solid rgba(255,255,255,.08);
}
.kc-evsearch__label {
	display: block;
	margin: 0 0 .65rem;
	font-family: var(--kc-font-display);
	font-weight: 800;
	font-size: clamp(1.35rem, 3vw, 2rem);
	text-transform: uppercase;
}
.kc-evsearch__row {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: .65rem;
	align-items: center;
	padding: .35rem .35rem .35rem .9rem;
	background: #fff;
	color: var(--kc-ink);
	border-radius: 2px;
}
.kc-evsearch__row .kc-icon { color: var(--kc-blue); }
.kc-evsearch__row input {
	width: 100%;
	border: 0;
	background: transparent;
	padding: .7rem 0;
	min-width: 0;
}
.kc-evsearch__row input:focus { outline: none; }
.kc-evsearch__row .kc-btn { white-space: nowrap; }

.kc-evfilters { margin-top: 1.5rem; display: grid; gap: 1.1rem; }
.kc-evfilters__label {
	margin: 0 0 .45rem;
	font: 700 .72rem/1 var(--kc-font-body);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: rgba(255,255,255,.55);
}
.kc-evfilters__chips {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
}
.kc-chip {
	appearance: none;
	border: 1px solid rgba(255,255,255,.22);
	background: transparent;
	color: #fff;
	padding: .45rem .8rem;
	font: 700 .78rem/1 var(--kc-font-body);
	letter-spacing: .04em;
	text-transform: uppercase;
	border-radius: 999px;
}
.kc-chip:hover, .kc-chip.is-on {
	background: var(--kc-red);
	border-color: var(--kc-red);
	color: #fff;
}
.kc-chip--date {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	cursor: pointer;
	position: relative;
}
.kc-chip--date input {
	position: absolute;
	inset: 0;
	opacity: 0;
	cursor: pointer;
	width: 100%;
	height: 100%;
}

.kc-evsec__title {
	margin: 0 0 1.5rem;
	font-size: clamp(2rem, 5vw, 3.6rem);
	line-height: .88;
	max-width: 16ch;
}
.kc-evagenda {
	background: var(--kc-canvas);
	padding-block: clamp(3rem, 7vw, 5.5rem);
}
.kc-evagenda__head { margin-bottom: 1.5rem; max-width: 42rem; }
.kc-evagenda__note {
	margin: -.5rem 0 0;
	max-width: 46ch;
	color: var(--kc-fg-muted);
}
.kc-elist--guide .kc-eitem { background: #fff; border-color: transparent; margin-bottom: 2px; }
.kc-elist--guide .kc-eitem__link {
	padding: 1rem 1rem;
	grid-template-columns: 4.5rem 7.5rem 1fr auto;
	gap: 1rem;
	align-items: center;
}
.kc-elist--guide .kc-eitem__link:hover { background: var(--kc-lemon); }
.kc-elist--guide .kc-eitem__media {
	width: 7.5rem;
	height: 5.5rem;
	overflow: hidden;
	background: var(--kc-ink);
}
.kc-elist--guide .kc-eitem__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.kc-elist--guide .kc-eitem__event {
	margin: .2rem 0 0;
	color: var(--kc-fg-muted);
	font-size: .95rem;
}
.kc-elist--guide .kc-eitem.is-hidden { display: none; }
@media (max-width: 640px) {
	.kc-elist--guide .kc-eitem__link {
		grid-template-columns: 3.75rem 1fr auto;
		grid-template-areas:
			"date body arrow"
			"media media media";
	}
	.kc-elist--guide .kc-eitem__date { grid-area: date; }
	.kc-elist--guide .kc-eitem__media {
		grid-area: media;
		width: 100%;
		height: 9rem;
	}
	.kc-elist--guide .kc-eitem__body { grid-area: body; }
	.kc-elist--guide .kc-eitem__arrow { grid-area: arrow; }
}
.kc-evlist__count {
	margin: 1rem 0 0;
	font: 700 .78rem/1 var(--kc-font-body);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--kc-red);
}
.kc-evfeat, .kc-evlist { display: none; }
.kc-evedit { padding-block: clamp(3rem, 7vw, 5.5rem); }
.kc-evcal { background: var(--kc-ink); color: #fff; padding-block: clamp(3rem, 7vw, 5.5rem); }
.kc-evcal .kc-evsec__title { color: #fff; margin-bottom: 0; }
.kc-evcal .kc-eyebrow { color: rgba(255,255,255,.7); }

.kc-evcal__head, .kc-evcal__nav {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}
.kc-evcal__views {
	display: flex;
	gap: .25rem;
	padding: .2rem;
	background: rgba(255,255,255,.08);
}
.kc-evcal__views button {
	appearance: none;
	border: 0;
	background: transparent;
	color: rgba(255,255,255,.7);
	padding: .5rem .9rem;
	font: 800 .8rem/1 var(--kc-font-display);
	letter-spacing: .08em;
	text-transform: uppercase;
}
.kc-evcal__views button[aria-selected="true"] {
	background: var(--kc-red);
	color: #fff;
}
.kc-evcal__nav { margin: 1.25rem 0 1.5rem; }
.kc-evcal__navbtn {
	appearance: none;
	border: 1px solid rgba(255,255,255,.2);
	background: transparent;
	color: #fff;
	width: 2.6rem;
	height: 2.6rem;
	display: grid;
	place-items: center;
}
.kc-evcal__label {
	margin: 0;
	font-family: var(--kc-font-display);
	font-weight: 800;
	font-size: clamp(1.5rem, 3vw, 2.2rem);
	text-transform: uppercase;
}
.kc-evcal__grid {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: 1px;
	background: rgba(255,255,255,.12);
	border: 1px solid rgba(255,255,255,.12);
}
.kc-evcal__dow {
	padding: .55rem .3rem;
	font: 700 .65rem/1 var(--kc-font-body);
	letter-spacing: .1em;
	text-transform: uppercase;
	text-align: center;
	color: rgba(255,255,255,.5);
	background: var(--kc-ink);
}
.kc-evcal__day {
	min-height: 5.5rem;
	padding: .4rem;
	background: #111218;
	display: flex;
	flex-direction: column;
	gap: .25rem;
	align-items: stretch;
	text-align: left;
	appearance: none;
	border: 0;
	color: inherit;
	font: inherit;
}
.kc-evcal__day.is-out { opacity: .35; }
.kc-evcal__day.is-today { outline: 2px solid var(--kc-red); outline-offset: -2px; }
.kc-evcal__num {
	font-family: var(--kc-font-display);
	font-weight: 800;
	font-size: 1.05rem;
}
.kc-evcal__pill {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	padding: .15rem .35rem;
	background: var(--kc-red);
	color: #fff;
	font: 700 .65rem/1.3 var(--kc-font-body);
	letter-spacing: .02em;
	text-transform: uppercase;
	border: 0;
	text-align: left;
}
.kc-evcal__week {
	display: grid;
	grid-template-columns: repeat(7, minmax(8rem, 1fr));
	gap: 1px;
	overflow-x: auto;
	background: rgba(255,255,255,.12);
}
.kc-evcal__wcol {
	min-height: 14rem;
	background: #111218;
	padding: .7rem .55rem;
}
.kc-evcal__wcol strong {
	display: block;
	margin-bottom: .6rem;
	font-size: .72rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: rgba(255,255,255,.55);
}
.kc-evcal__tolist {
	margin: 0;
	padding: 1.5rem;
	background: #111218;
	color: rgba(255,255,255,.8);
}
.kc-evcal__tolist a { color: #fff; }

.kc-evfeat__grid, .kc-evcards {
	display: grid;
	gap: 1.25rem;
	list-style: none;
	margin: 0;
	padding: 0;
}
.kc-evcard {
	background: var(--kc-canvas);
	display: grid;
}
.kc-evcard article { display: grid; }
.kc-evcard__media {
	display: block;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--kc-blue);
	color: #fff;
}
.kc-evcard__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .45s var(--kc-ease);
}
.kc-evcard:hover .kc-evcard__media img { transform: scale(1.04); }
.kc-evcard__ph {
	display: grid;
	place-items: center;
	height: 100%;
	min-height: 12rem;
}
.kc-evcard__body { padding: 1.15rem 1.15rem 1.35rem; }
.kc-evcard__cat {
	margin: 0 0 .35rem;
	font: 700 .7rem/1.2 var(--kc-font-body);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--kc-red);
}
.kc-evcard__title {
	font-size: clamp(1.6rem, 3vw, 2.35rem);
	line-height: .9;
}
.kc-evcard__title a { text-decoration: none; }
.kc-evcard__event {
	margin: .35rem 0 0;
	color: var(--kc-fg-muted);
}
.kc-evcard__meta {
	display: grid;
	gap: .45rem;
	margin: 1rem 0 0;
	font-size: .92rem;
}
.kc-evcard__meta dt {
	font: 700 .68rem/1.2 var(--kc-font-body);
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--kc-fg-muted);
}
.kc-evcard__meta dd { font-weight: 600; }
.kc-evcard__actions {
	display: flex;
	flex-wrap: wrap;
	gap: .6rem;
	margin: 1.15rem 0 0;
}
.kc-evcard.is-featured { background: var(--kc-blue); color: #fff; }
.kc-evcard.is-featured .kc-evcard__event,
.kc-evcard.is-featured .kc-evcard__meta dt { color: rgba(255,255,255,.7); }
.kc-evcard.is-featured .kc-btn--ghost { --b-fg: #fff; --b-bd: #fff; }

.kc-evsoon {
	padding: clamp(2.5rem, 6vw, 4.5rem) 0;
	max-width: 36rem;
}
.kc-evsoon__kicker {
	margin: 0 0 .5rem;
	font: 700 .72rem/1 var(--kc-font-body);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--kc-red);
}
.kc-evsoon__title {
	font-size: clamp(2.8rem, 8vw, 5rem);
	margin: 0;
}
.kc-evsoon__text {
	margin: 1rem 0 0;
	font-size: 1.08rem;
	color: var(--kc-fg-muted);
	max-width: 38ch;
	text-align: justify;
	text-align-last: left;
	text-justify: inter-word;
	hyphens: none;
	-webkit-hyphens: none;
	overflow-wrap: break-word;
}

.kc-evedit { background: var(--kc-canvas); }
.kc-evedit__text {
	max-width: 48ch;
	text-align: justify;
	text-align-last: left;
	text-justify: inter-word;
	hyphens: none;
	-webkit-hyphens: none;
	overflow-wrap: break-word;
}
.kc-evdir h3 {
	margin: 0 0 .6rem;
	font-size: 1.15rem;
}
.kc-evdir ul { display: grid; gap: .35rem; margin: 0 0 1.4rem; }
.kc-evdir a { text-decoration: none; }
.kc-evdir a:hover { color: var(--kc-red); }
.kc-evedit__back { margin-top: 1.5rem; }

.kc-evfaq {
	background: #fff;
	padding-block: clamp(3rem, 7vw, 5.5rem);
}

.kc-evinfo { padding-block: clamp(2.5rem, 6vw, 4.5rem); background: #fff; }
.kc-evtable {
	width: 100%;
	border-collapse: collapse;
	max-width: 52rem;
}
.kc-evtable th,
.kc-evtable td {
	text-align: left;
	padding: .85rem 0;
	border-bottom: 1px solid var(--kc-line);
	vertical-align: top;
}
.kc-evtable th {
	width: 11rem;
	font: 700 .72rem/1.3 var(--kc-font-body);
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--kc-fg-muted);
}
.kc-evtable td { font-weight: 600; }

.kc-evdialog {
	border: 0;
	padding: 0;
	max-width: min(32rem, calc(100vw - 2rem));
	width: 100%;
	background: #fff;
	color: var(--kc-ink);
}
.kc-evdialog::backdrop { background: rgba(1, 7, 97, .72); }
.kc-evdialog__inner { padding: 1.5rem 1.35rem 1.6rem; position: relative; }
.kc-evdialog__close {
	position: absolute;
	top: .7rem;
	right: .7rem;
	appearance: none;
	border: 0;
	background: transparent;
	color: inherit;
}
.kc-evdialog .kc-evcard__media { aspect-ratio: 16 / 10; margin: 0 -1.35rem 1rem; }
.kc-evdialog h3 { font-size: 2rem; margin: 0; }

.kc-evcard.is-hidden { display: none; }
.kc-evempty { margin: 1.5rem 0 0; max-width: 40ch; color: var(--kc-fg-muted); }
.kc-evempty strong { display: block; color: var(--kc-ink); margin-bottom: .35rem; font-family: var(--kc-font-display); font-size: 1.6rem; text-transform: uppercase; }

@media (max-width: 699px) {
	.kc-evsearch__row { grid-template-columns: auto 1fr; }
	.kc-evsearch__row .kc-btn { grid-column: 1 / -1; }
	.kc-evcal__day { min-height: 3.4rem; padding: .25rem; }
	.kc-evcal__pill { display: none; }
	.kc-evcal__day.has-events .kc-evcal__num::after {
		content: "";
		display: inline-block;
		width: .4rem;
		height: .4rem;
		margin-left: .25rem;
		border-radius: 50%;
		background: var(--kc-red);
		vertical-align: middle;
	}
	.kc-evtable th { width: 7.5rem; }
}

@media (min-width: 700px) {
	.kc-evcards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.kc-evfeat__grid { grid-template-columns: 1.15fr .85fr; }
	.kc-evcard.is-featured:first-child { grid-row: span 2; }
	.kc-evcard.is-featured:first-child .kc-evcard__media { aspect-ratio: auto; min-height: 100%; }
}

@media (min-width: 1080px) {
	.kc-evcards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.kc-evcards--related { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.kc-evedit__grid {
		display: grid;
		grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
		gap: clamp(2rem, 5vw, 4.5rem);
		align-items: start;
	}
}
