/* =====================================================
   VENUE — address, map, getting there.
   ===================================================== */

.venue-block {padding:70px 0;}
.venue-block.bg-white {background:#fff;}
.venue-block.bg-light-gray {background:#f4f4f4;}
.venue-block.bg-dark-blue {background:var(--color-headline); color:#fff;}
.venue-block.bg-dark-blue .headline {color:#fff;}
.venue-block.bg-dark-blue .headline::before {content:url('../../img/icon-white.svg');}

.venue-block .venue-grid {
	display:grid;
	grid-template-columns:repeat(2, minmax(0, 1fr));
	gap:48px;
	align-items:start;
	margin-top:30px;
}
.venue-block.no-map .venue-grid {grid-template-columns:minmax(0, 1fr);}

/* Map left: swap visually, keep the address first in the DOM. */
.venue-block.map-left .venue-detail {order:2;}
.venue-block.map-left .venue-map {order:1;}

.venue-block .venue-detail h3 {
	margin:0 0 10px;
	font-size:24px;
	font-weight:bold;
	text-transform:uppercase;
	letter-spacing:.02em;
	color:var(--color-headline);
}
.venue-block.bg-dark-blue .venue-detail h3 {color:#fff;}

.venue-block .address p {margin:0 0 2px; font-size:16px; line-height:1.6em;}

.venue-block .directions {margin:16px 0 0;}
.venue-block .directions a {
	font-size:14px;
	font-weight:bold;
	letter-spacing:.04em;
	text-transform:uppercase;
	color:var(--color-brand);
	text-decoration:none;
	border-bottom:1px solid currentColor;
	padding-bottom:2px;
}
.venue-block.bg-dark-blue .directions a {color:var(--color-brand-light);}

.venue-block .venue-facts {margin:26px 0 0;}
.venue-block .venue-facts .fact {
	padding:14px 0;
	border-top:1px solid rgba(0, 42, 58, .14);
}
.venue-block.bg-dark-blue .venue-facts .fact {border-top-color:rgba(255, 255, 255, .18);}

.venue-block .venue-facts dt {
	font-size:12px;
	font-weight:bold;
	letter-spacing:.1em;
	text-transform:uppercase;
	color:var(--color-brand);
	margin:0 0 5px;
}
.venue-block.bg-dark-blue .venue-facts dt {color:var(--color-brand-light);}

.venue-block .venue-facts dd {margin:0;}
.venue-block .venue-facts dd p {margin:0; font-size:15px; line-height:1.55em;}

.venue-block .venue-map {position:relative; overflow:hidden; aspect-ratio:4/3; background:#e7ecee;}
.venue-block .venue-map img,
.venue-block .venue-map iframe {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	object-fit:cover;
	border:0;
}

@media (max-width:900px) {
	.venue-block {padding:50px 0;}
	.venue-block .venue-grid {grid-template-columns:minmax(0, 1fr); gap:28px;}
	/* Address before the map on a phone, whichever side it takes on desktop. */
	.venue-block.map-left .venue-detail,
	.venue-block .venue-detail {order:1;}
	.venue-block.map-left .venue-map,
	.venue-block .venue-map {order:2;}
	.venue-block .venue-map {aspect-ratio:16/10;}
}
