/* ==========================================================================
   NAA Lean - chrome for Astra-rendered views
   Loaded on everything that is not one of the two lean page templates: the
   shop, single products, LearnDash courses, checkout, blog.

   lean-redesign.css already styles .naa-lean-header and .naa-lean-footer -
   those rules are not scoped to the homepage - but its design tokens live on
   .naa-lean-home. This re-declares them on .naa-lean-chrome and tidies the seam
   where the lean shell meets Astra's content.

   Deliberately narrow: WooCommerce and LearnDash markup is left alone and only
   inherits the typeface and colours.
   ========================================================================== */

.naa-lean-chrome {
	--naa-brand: #163b2c;
	--naa-brand-dark: #0f2a1f;
	--naa-brand-soft: #ecf4f0;
	--naa-brand-fg: #f9fdfb;
	--naa-fg: #09140f;
	--naa-muted: #4b5953;
	--naa-border: rgba(22, 59, 44, 0.12);
	--naa-radius: 16px;
	--naa-max: 1200px;
	--naa-font: "SeasonSans", system-ui, sans-serif;
	--naa-section-pad: 96px;
}

/* The typeface carries most of the family resemblance. Astra's own sizing and
   spacing stay as they are, so Woo and LearnDash layouts do not shift. */
.naa-lean-chrome,
.naa-lean-chrome button,
.naa-lean-chrome input,
.naa-lean-chrome select,
.naa-lean-chrome textarea,
.naa-lean-chrome h1,
.naa-lean-chrome h2,
.naa-lean-chrome h3,
.naa-lean-chrome h4,
.naa-lean-chrome h5,
.naa-lean-chrome h6 {
	font-family: var(--naa-font);
}

.naa-lean-chrome h1,
.naa-lean-chrome h2,
.naa-lean-chrome h3,
.naa-lean-chrome h4 {
	color: var(--naa-brand);
	letter-spacing: -0.4px;
}

/* Breathing room between the dark header, the content and the footer. */
.naa-lean-chrome #content.site-content {
	padding-block: 56px;
	background: #fff;
}

/* Astra draws its own boxed page background; the lean shell is edge to edge. */
.naa-lean-chrome #page.site {
	background: #fff;
}

/* The footer is full width even where Astra boxes the layout. */
.naa-lean-chrome .naa-lean-footer,
.naa-lean-chrome .naa-lean-header {
	max-width: none;
}

/* Astra hides its own breadcrumb bar behind classes we no longer render;
   anything left over should not add a stray gap above the content. */
.naa-lean-chrome .ast-above-header-wrap,
.naa-lean-chrome .ast-below-header-wrap,
.naa-lean-chrome .ast-mobile-header-wrap {
	display: none;
}

@media (max-width: 767px) {
	.naa-lean-chrome #content.site-content {
		padding-block: 32px;
	}
}

/* --------------------------------------------------------------------------
   Content container
   The lean design puts every band inside width: min(100% - 48px, 1280px)
   (see .naa-lean-header__inner / .naa-lean-footer__grid in lean-redesign.css).
   Astra's .ast-container on this install is full bleed - max-width: 100% with
   no padding - so shop, single product and LearnDash content ran to the window
   edges while the header and footer stayed in the 1280px column. Same formula
   here so the whole page shares one gutter. Scoped under #content so it can
   never touch the lean header or footer.
   -------------------------------------------------------------------------- */
.naa-lean-chrome #content .ast-container {
	width: min(100% - 48px, 1280px);
	max-width: none;
	margin-inline: auto;
	padding-inline: 0;
}