/*
 * Pre-M6 shared shell.
 * Header/footer/logo changes stay isolated here, after the legacy site.css.
 */

.cv-header {
	position: relative;
	z-index: 40;
}

.cv-header__bar--menu-search {
	position: relative;
	display: grid;
	grid-template-columns: auto minmax(max-content, 1fr) minmax(320px, 0.95fr);
	align-items: center;
	gap: 22px;
	padding-top: 18px;
	padding-bottom: 18px;
}

.cv-header .cv-header__logo,
.cv-footer__logo {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	white-space: nowrap;
}

.cv-brand-lockup__mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 36px;
	flex: 0 0 48px;
}

.cv-brand-lockup__image {
	display: block;
	width: 48px;
	height: auto;
	max-height: 34px;
	object-fit: contain;
}

.cv-brand-lockup__text {
	font-weight: 800;
	letter-spacing: -0.02em;
}

.cv-header .cv-brand-lockup__text {
	font-size: 24px;
	color: #fff;
}

.cv-footer .cv-brand-lockup__text {
	font-size: 22px;
	color: #fff;
}


.cv-primary-nav {
	display: flex;
	align-items: center;
	gap: 20px;
	min-width: 0;
}

.cv-primary-nav a {
	color: #fff;
	font-size: 14px;
	font-weight: 750;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
}

.cv-primary-nav a:hover,
.cv-primary-nav a:focus-visible {
	color: #dff5ff;
	text-decoration: underline;
	text-underline-offset: 4px;
	outline: none;
}

/* Desktop uses an inline navigation bar. The hamburger is reserved for the
   narrower layouts where the primary links no longer fit comfortably. */
/* Hamburger menu: native <details> keeps the core interaction available
   without requiring JavaScript. */
.cv-menu {
	position: relative;
	display: none;
	flex: 0 0 auto;
}

.cv-menu__toggle {
	list-style: none;
	display: inline-flex;
	align-items: center;
	gap: 9px;
	min-height: 42px;
	padding: 0 12px;
	border-radius: 8px;
	color: #fff;
	font-weight: 750;
	cursor: pointer;
	user-select: none;
}

.cv-menu__toggle::-webkit-details-marker {
	display: none;
}

.cv-menu__toggle:hover,
.cv-menu__toggle:focus-visible,
.cv-menu[open] .cv-menu__toggle {
	background: rgba(255, 255, 255, 0.12);
	outline: none;
}

.cv-menu__hamburger {
	display: grid;
	gap: 4px;
	width: 19px;
}

.cv-menu__hamburger span {
	display: block;
	height: 2px;
	border-radius: 999px;
	background: currentColor;
}

.cv-menu__panel {
	position: absolute;
	top: calc(100% + 12px);
	left: 0;
	display: grid;
	min-width: 250px;
	padding: 10px;
	border: 1px solid #cfd9e6;
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 20px 50px rgba(8, 46, 106, 0.2);
}

.cv-menu__panel a {
	display: block;
	padding: 11px 12px;
	border-radius: 8px;
	color: #14243a;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
}

.cv-menu__panel a:hover,
.cv-menu__panel a:focus-visible {
	background: #eef4fb;
	color: #0b3a7a;
	text-decoration: none;
	outline: none;
}

.cv-menu__divider {
	display: block;
	height: 1px;
	margin: 7px 6px;
	background: #e3e9f1;
}

.cv-header__search {
	max-width: 700px;
	justify-self: stretch;
}

.cv-header__search-input,
.cv-header__search-button {
	min-height: 46px;
}

/* Trust footer */
.cv-footer__inner--trust-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.7fr) repeat(3, minmax(140px, 0.65fr));
	gap: 42px;
	align-items: start;
}

.cv-footer__brand {
	max-width: 560px;
}

.cv-footer__tagline {
	max-width: 520px;
	line-height: 1.65;
}

.cv-footer__nav {
	align-content: start;
}

.cv-footer__bottom {
	display: flex;
	justify-content: space-between;
	gap: 24px;
	margin-top: 30px;
	padding-top: 20px;
	border-top: 1px solid rgba(255, 255, 255, 0.16);
	color: var(--cv-on-dark-muted);
	font-size: 12px;
	line-height: 1.5;
}

@media (max-width: 1180px) {
	.cv-header__bar--menu-search {
		grid-template-columns: auto auto 1fr;
		gap: 14px;
	}

	.cv-primary-nav {
		display: none;
	}

	.cv-menu {
		display: block;
	}

	.cv-header .cv-brand-lockup__text {
		display: none;
	}

	.cv-footer__inner--trust-grid {
		grid-template-columns: 1.5fr repeat(2, 1fr);
	}

	.cv-footer__inner--trust-grid .cv-footer__nav:last-child {
		grid-column: 2 / 4;
	}
}

@media (max-width: 767px) {
	.cv-header__bar--menu-search {
		grid-template-columns: 1fr auto;
		padding-top: 12px;
		padding-bottom: 12px;
	}

	.cv-header__search {
		grid-column: 1 / -1;
		grid-row: 2;
		max-width: none;
	}

	.cv-menu {
		justify-self: end;
	}

	.cv-menu__panel {
		left: auto;
		right: 0;
		min-width: min(280px, calc(100vw - 32px));
	}

	.cv-footer__inner--trust-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.cv-footer__brand {
		grid-column: 1 / -1;
	}

	.cv-footer__inner--trust-grid .cv-footer__nav:last-child {
		grid-column: auto;
	}

	.cv-footer__bottom {
		flex-direction: column;
	}
}

@media (max-width: 480px) {
	.cv-footer__inner--trust-grid {
		grid-template-columns: 1fr;
	}
	.cv-footer__brand,
	.cv-footer__inner--trust-grid .cv-footer__nav:last-child {
		grid-column: auto;
	}
}

/* ========================================================================
 * R11.2 — Brand contrast hardening
 * Keep the existing CouponVerity mark, but place it on a light plate so the
 * navy parts remain visible against the navy header/footer.
 * ===================================================================== */
.cv-brand-lockup__mark {
	width: 52px;
	height: 36px;
	flex-basis: 52px;
	padding: 4px 6px;
	border: 1px solid rgba(255, 255, 255, 0.72);
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 2px 8px rgba(6, 28, 61, 0.18);
}

.cv-brand-lockup__image {
	width: 40px;
	max-height: 28px;
}

.cv-header .cv-brand-lockup__text {
	font-size: 23px;
	font-weight: 800;
	letter-spacing: -0.025em;
	color: #fff;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.08);
}

.cv-footer .cv-brand-lockup__text {
	font-size: 22px;
	font-weight: 800;
	letter-spacing: -0.025em;
	color: #fff;
}

.cv-primary-nav a {
	font-size: 14px;
	font-weight: 700;
}

@media (max-width: 767px) {
	.cv-brand-lockup__mark {
		width: 48px;
		height: 34px;
		flex-basis: 48px;
		padding: 4px 5px;
	}

	.cv-brand-lockup__image {
		width: 37px;
		max-height: 26px;
	}
}

/* ========================================================================
 * R11.3 — Final brand-lockup polish
 * Keep the contrast fix from R11.2, but make the light plate feel like a
 * protected logo field rather than a large app badge.
 * ===================================================================== */
.cv-header .cv-header__logo,
.cv-footer__logo {
	gap: 9px;
}

.cv-brand-lockup__mark {
	width: 44px;
	height: 32px;
	flex-basis: 44px;
	padding: 3px 5px;
	border: 1px solid rgba(255, 255, 255, 0.46);
	border-radius: 6px;
	background: rgba(255, 255, 255, 0.96);
	box-shadow: none;
}

.cv-brand-lockup__image {
	width: 34px;
	max-height: 24px;
}

.cv-header .cv-brand-lockup__text {
	font-size: 22px;
	letter-spacing: -0.022em;
}

.cv-footer .cv-brand-lockup__text {
	font-size: 20px;
	letter-spacing: -0.022em;
}

@media (max-width: 767px) {
	.cv-brand-lockup__mark {
		width: 42px;
		height: 30px;
		flex-basis: 42px;
		padding: 3px 4px;
	}

	.cv-brand-lockup__image {
		width: 33px;
		max-height: 23px;
	}
}


/* ========================================================================
 * R11.4 — Simple shell-tone logo fix
 * Founder direction: do not change the logo asset and do not put it on a
 * white plate. Instead, make the header/footer blue slightly lighter so the
 * original navy ticket mark remains visible against the shell.
 * ===================================================================== */
.cv-header,
.cv-footer {
	background: #123f73;
}

/* Remove the R11.2/R11.3 white logo plate completely. */
.cv-brand-lockup__mark {
	width: 40px;
	height: 30px;
	flex-basis: 40px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

.cv-brand-lockup__image {
	width: 40px;
	max-height: 28px;
}

.cv-header .cv-header__logo,
.cv-footer__logo {
	gap: 9px;
}

@media (max-width: 767px) {
	.cv-brand-lockup__mark {
		width: 38px;
		height: 28px;
		flex-basis: 38px;
		padding: 0;
	}

	.cv-brand-lockup__image {
		width: 38px;
		max-height: 27px;
	}
}

/* ========================================================================
 * PRE-M6 R12.2 — Header interaction placement + compact footer
 * Mobile/tablet: brand left, search center/below, menu at the far right.
 * Footer keeps Legal on the same navigation row on tablet/desktop.
 * ===================================================================== */
@media (max-width: 1180px) and (min-width: 768px) {
	.cv-header__bar--menu-search {
		grid-template-columns: auto minmax(260px, 1fr) auto;
		gap: 14px 18px;
	}

	.cv-header .cv-header__logo {
		grid-column: 1;
		grid-row: 1;
	}

	.cv-header__search {
		grid-column: 2;
		grid-row: 1;
		max-width: none;
	}

	.cv-menu {
		grid-column: 3;
		grid-row: 1;
		justify-self: end;
	}

	.cv-menu__panel {
		left: auto;
		right: 0;
	}

	.cv-footer__inner--trust-grid {
		grid-template-columns: minmax(240px, 1.45fr) minmax(110px, .7fr) minmax(150px, .9fr) minmax(110px, .65fr);
		gap: 24px;
	}

	.cv-footer__inner--trust-grid .cv-footer__nav:last-child {
		grid-column: auto;
	}
}

@media (max-width: 767px) {
	.cv-header__bar--menu-search {
		grid-template-columns: auto minmax(0, 1fr) auto;
		gap: 8px 10px;
	}

	.cv-header .cv-header__logo {
		grid-column: 1;
		grid-row: 1;
	}

	.cv-menu {
		grid-column: 3;
		grid-row: 1;
		justify-self: end;
	}

	.cv-header__search {
		grid-column: 1 / -1;
		grid-row: 2;
	}
}

/* Compact the footer without removing trust/legal information. */
.cv-footer {
	margin-top: 52px;
	padding-bottom: 26px;
}

.cv-footer__explore {
	padding-top: 24px;
	padding-bottom: 24px;
}

.cv-footer__inner {
	padding-top: 24px;
}

.cv-footer__bottom {
	margin-top: 22px;
	padding-top: 14px;
}

@media (max-width: 767px) {
	.cv-footer {
		margin-top: 42px;
		padding-bottom: 22px;
	}

	.cv-footer__explore {
		padding-top: 22px;
		padding-bottom: 22px;
	}
}

/* ========================================================================
 * PRE-M6 R12.3 — Header balance / brand visibility
 * ===================================================================== */
@media (min-width: 1181px) {
	.cv-header__bar--menu-search {
		grid-template-columns: auto minmax(max-content, 1fr) minmax(320px, 460px);
		gap: 20px;
	}
	.cv-header__search {
		width: 100%;
		max-width: 460px;
		justify-self: end;
	}
}

@media (max-width: 1180px) and (min-width: 768px) {
	.cv-header__bar--menu-search {
		grid-template-columns: max-content minmax(280px, 420px) max-content;
		justify-content: space-between;
		gap: 14px 18px;
	}
	.cv-header .cv-brand-lockup__text {
		display: inline;
		font-size: 20px;
	}
	.cv-header__search {
		width: 100%;
		max-width: 420px;
		justify-self: center;
	}
}

@media (max-width: 767px) {
	.cv-header__bar--menu-search {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 9px 12px;
	}
	.cv-header .cv-header__logo {
		grid-column: 1;
		grid-row: 1;
		min-width: 0;
	}
	.cv-header .cv-brand-lockup__text {
		display: inline;
		font-size: 19px;
	}
	.cv-menu {
		grid-column: 2;
		grid-row: 1;
	}
	.cv-header__search {
		grid-column: 1 / -1;
		grid-row: 2;
		width: 100%;
		max-width: none;
	}
	.cv-header__search-input,
	.cv-header__search-button {
		min-height: 42px;
	}
}

@media (max-width: 420px) {
	.cv-header .cv-brand-lockup__text {
		font-size: 17px;
	}
	.cv-header .cv-header__logo {
		gap: 7px;
	}
	.cv-menu__toggle {
		padding-left: 9px;
		padding-right: 9px;
	}
}


/* ========================================================================
 * PRE-M6 R12.6 — Header inner-shell balance
 * Keep the brand/menu optically aligned with body cards and stop Store search
 * from dominating the navigation row.
 * ===================================================================== */
@media (min-width: 1181px) {
	.cv-header__bar--menu-search {
		grid-template-columns: auto minmax(max-content, 1fr) minmax(300px, 410px);
		gap: 22px;
	}

	.cv-header__search {
		max-width: 410px;
	}
}

@media (max-width: 1180px) and (min-width: 768px) {
	.cv-header__bar--menu-search {
		grid-template-columns: max-content minmax(280px, 380px) max-content;
		padding-left: 28px;
		padding-right: 28px;
	}

	.cv-header__search {
		max-width: 380px;
	}
}

@media (max-width: 767px) {
	.cv-header__bar--menu-search {
		padding-left: 24px;
		padding-right: 24px;
	}
}

@media (max-width: 420px) {
	.cv-header__bar--menu-search {
		padding-left: 18px;
		padding-right: 18px;
	}
}

/* ========================================================================
 * PRE-M6 R12.7 — Brand presence + visual logo normalization
 * Presentation-only. Strengthen brand/merchant identity without changing
 * source logo files, Store/Offer data, routing, or business behavior.
 * ===================================================================== */
.cv-header .cv-header__logo,
.cv-footer__logo {
	gap: 10px;
}

.cv-brand-lockup__mark {
	width: 44px;
	height: 32px;
	flex-basis: 44px;
}

.cv-brand-lockup__image {
	width: 44px;
	max-height: 31px;
}

.cv-header .cv-brand-lockup__text {
	font-size: 23px;
	font-weight: 820;
	letter-spacing: -0.026em;
}

.cv-footer .cv-brand-lockup__text {
	font-size: 21px;
	font-weight: 800;
}

@media (max-width: 1180px) and (min-width: 768px) {
	.cv-header .cv-brand-lockup__text {
		font-size: 21px;
	}
}

@media (max-width: 767px) {
	.cv-brand-lockup__mark {
		width: 42px;
		height: 30px;
		flex-basis: 42px;
	}

	.cv-brand-lockup__image {
		width: 42px;
		max-height: 29px;
	}

	.cv-header .cv-brand-lockup__text {
		font-size: 20px;
	}
}

@media (max-width: 420px) {
	.cv-header .cv-brand-lockup__text {
		font-size: 18px;
	}
}


/* ========================================================================
 * PRE-M6 R12.8 — Final brand/header alignment
 * Presentation-only. Keep the locked shell tone while giving the brand a
 * slightly stronger anchor and keeping header controls inside the same visual
 * content rhythm as the page below.
 * ===================================================================== */
@media (min-width: 1181px) {
	.cv-header__bar--menu-search {
		grid-template-columns: auto minmax(max-content, 1fr) minmax(300px, 400px);
		gap: 24px;
	}

	.cv-header__search {
		max-width: 400px;
	}

	.cv-brand-lockup__mark {
		width: 46px;
		height: 33px;
		flex-basis: 46px;
	}

	.cv-brand-lockup__image {
		width: 46px;
		max-height: 32px;
	}

	.cv-header .cv-brand-lockup__text {
		font-size: 24px;
	}
}

@media (max-width: 1180px) and (min-width: 768px) {
	.cv-header__bar--menu-search {
		grid-template-columns: max-content minmax(260px, 360px) max-content;
	}

	.cv-header__search {
		max-width: 360px;
	}
}

@media (max-width: 767px) {
	.cv-header__bar--menu-search {
		padding-left: 22px;
		padding-right: 22px;
	}

	.cv-header .cv-brand-lockup__text {
		font-size: 20px;
	}
}

@media (max-width: 420px) {
	.cv-header__bar--menu-search {
		padding-left: 16px;
		padding-right: 16px;
	}

	.cv-header .cv-brand-lockup__text {
		font-size: 18px;
	}
}