/* Vail Valley Challenge practice promotion (ECL Core 0.8.1).
 * ECL palette: forest green #1F4A47 / #122E2C, cream #F4F2EC, gold #F2D27A (the Challenge's
 * celebration gold). Fixed position, so it never shifts page layout (no CLS). */
.ecl-promo {
	position: fixed; z-index: 99990;
	left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px));
	max-width: 400px; margin: 0 auto; box-sizing: border-box;
	padding: 16px 16px 16px; padding-right: 52px;
	background: #1F4A47; color: #F4F2EC;
	border-radius: 14px; border-top: 4px solid #F2D27A;
	box-shadow: 0 10px 30px rgba(18, 46, 44, .35);
	font: 15px/1.45 "Libre Franklin", system-ui, -apple-system, "Segoe UI", sans-serif;
	transform: translateY(20px); opacity: 0;
	transition: transform .28s ease-out, opacity .28s ease-out;
	max-height: calc(100vh - 24px); overflow-y: auto;
}
.ecl-promo.is-in { transform: none; opacity: 1; }
.ecl-promo p { margin: 0; }
.ecl-promo__eyebrow { color: #F2D27A; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.ecl-promo__title { margin-top: 4px !important; color: #FFFFFF; font: 500 21px/1.2 "Newsreader", Georgia, serif; }
.ecl-promo__text { margin-top: 6px !important; color: #F4F2EC; }
.ecl-promo__meta { margin-top: 8px !important; color: #DCE7E5; font-size: 13px; font-weight: 600; }
.ecl-promo__fact { white-space: nowrap; }
.ecl-promo__go {
	display: flex; align-items: center; justify-content: center; min-height: 46px; margin-top: 12px;
	padding: 0 18px; border-radius: 8px;
	background: #F2D27A; color: #122E2C; text-decoration: none;
	font: 700 15px/1 "Libre Franklin", system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase;
}
.ecl-promo__go:hover { background: #F7DF98; color: #122E2C; }
.ecl-promo__close {
	position: absolute; top: 6px; right: 6px; width: 44px; height: 44px;
	display: grid; place-items: center; padding: 0; border: 0; border-radius: 8px;
	background: transparent; color: #F4F2EC; cursor: pointer;
}
.ecl-promo__close:hover { background: rgba(255, 255, 255, .1); }
.ecl-promo__close svg { width: 20px; height: 20px; }
.ecl-promo a:focus-visible, .ecl-promo button:focus-visible { outline: 3px solid #F2D27A; outline-offset: 2px; }
.ecl-promo .ecl-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Small phones: tighter, still all content. */
@media (max-width: 360px) {
	.ecl-promo { padding: 14px 48px 14px 14px; }
	.ecl-promo__title { font-size: 19px; }
	.ecl-promo__text { font-size: 14px; }
}
/* Short landscape screens: drop the supporting sentence, keep headline, facts and button. */
@media (max-height: 480px) {
	.ecl-promo__text { display: none; }
}
/* Larger screens: a card in the bottom-right corner, clear of the content column. */
@media (min-width: 700px) {
	.ecl-promo { left: auto; right: 24px; bottom: 24px; width: 360px; margin: 0; }
	.ecl-promo__go { display: inline-flex; }
}
/* Installed app: sit above the tab bar (matches the other invitations). */
html.ecl-app .ecl-promo { bottom: calc(var(--ecl-tabbar-h, 60px) + 12px + env(safe-area-inset-bottom, 0px)); }
/* Never taller than the space between the app bar and the tab bar, so neither is covered. */
html.ecl-app .ecl-promo { max-height: calc(100vh - var(--ecl-app-top, 56px) - var(--ecl-tabbar-h, 60px) - env(safe-area-inset-bottom, 0px) - 24px); }
@media (prefers-reduced-motion: reduce) { .ecl-promo { transition: none; transform: none; } }
@media print { .ecl-promo { display: none !important; } }
