/* AOJ MEDICAL - logo sizing aligned with the group site (main / health / rpm).
 *
 * The Astro bundle sizes the logo with compound selectors (".brand .brand-logo",
 * "footer.site .fbrand-logo"), so a bare class rule would lose on specificity.
 * These mirror the bundle's own selector shape and are loaded after it, which
 * puts them ahead of both the desktop rule and the bundle's mobile override.
 *
 * Indices match the rendered logo box measured on /, /health/ and /rpm/:
 *
 *              desktop   mobile
 *   header       46px     32px
 *   footer       52px     42px
 *
 * The bundle only sets height (width stays auto), so the aspect ratio is kept.
 */
.brand .brand-logo {
	height: 46px;
}

footer.site .fbrand-logo {
	height: 52px;
}

@media (max-width: 760px) {
	.brand .brand-logo {
		height: 32px;
	}

	footer.site .fbrand-logo {
		height: 42px;
	}
}

/* ------------------------------------------------------------------ */
/* 2026-10-20 16:24  layout refinements from client feedback           */
/* ------------------------------------------------------------------ */

/* Category strip: widen the spacing between entries. The bundle's desktop
   rule spaces links with a 1.2rem flex gap; the client asked for more air.
   Gap is used only on desktop (the <=760px overflow-scroll rules replace it
   with per-link margins), so this stays a desktop-only change. */
header.site .cat-strip nav {
	gap: 2.4rem;
}

/* Hero carousel: the bundle centers the copy (.wrap{margin:0 auto} inside
   the flex-row .slide), which at 1440px puts the headline 336px from the
   left edge. The client asked for the copy to sit further left. Aligning
   the wrap's left edge with the site-wide container (same formula the base
   .wrap uses) puts it at 100px, matching the category strip and footer
   columns; on narrower viewports the max() keeps a 24px gutter. */
.hero-carousel .slide .wrap {
	margin-left: max(24px, calc((100% - 1240px) / 2));
}
