/* Site header to the boards (Offers.html, HomeCalm.html, HomeCalmPhone.html).
   Loads after style.css, which holds the base header rules. */

/* Desktop: brand, search, then Offers / Businesses / Events / Log in / List
   your business, as on the boards. The city segment stays in the search. */
.cul-sitebar { padding: 14px 0; }
.cul-sitebar__inner { max-width: var(--ui-wrap, 1280px); gap: 20px; }
.cul-brand { font-size: 1.35rem; font-weight: 600; }
.cul-finder { max-width: 460px; }
.cul-sitebar__nav { gap: 24px; }
.cul-sitebar__nav a,
.cul-sitebar__nav a:link,
.cul-sitebar__nav a:visited { color: #fff !important; font-size: 15px !important; }
.cul-sitebar__nav a:hover { color: #fff !important; text-decoration: underline !important; text-underline-offset: 4px; }
.cul-sitebar__nav .cul-sitebar__cta,
.cul-sitebar__nav .cul-sitebar__cta:hover { text-decoration: none !important; font-weight: 600; padding: 0 14px; }

/* Phone: brand on its own row (menu button beside it), the search full
   width underneath, 46px tall, as on HomeCalmPhone. */
@media (max-width: 900px) {
	.cul-sitebar { padding: 14px 0 16px; }
	.cul-sitebar__inner { flex-wrap: wrap; row-gap: 12px; padding: 0 18px; }
	.cul-brand { font-size: 1.2rem; min-height: 32px; }
	.cul-sitebar__burger { order: 2; min-height: 36px; padding: 4px 0 4px 8px; }
	.cul-sitebar--tool .cul-sitebar__burger { order: 0; }
	.cul-finder { order: 3; flex: 1 0 100%; max-width: none; }
	.cul-finder__seg,
	.cul-finder__query input { min-height: 46px; }
	/* With the whole row to itself there is room for the city name again. */
	.cul-finder__cityname { display: inline; }
	.cul-finder__query input { font-size: 16px !important; } /* no iOS zoom on focus */
	.cul-sitebar__nav a { font-size: 16px !important; }
}
@media (max-width: 360px) {
	.cul-finder__cityname { display: none; }
}