/* ==========================================================================
   Design tokens - a one-to-one transcription of freshground.co.uk.

   Source: freshground.co.uk/wp-content/themes/freshground/assets/main.min.css
   (v1.7.11). Every value below was read out of that stylesheet; nothing here
   is an approximation. This file IS the design contract - if a component needs
   a value that is not here, the value is wrong.
   ========================================================================== */

:root {
	/* ---- Palette: Fresh Ground's :root, verbatim ------------------------- */
	--mx-site-bg:             #f7f6f6;  /* page canvas - NEVER pure white */
	--mx-white-bg:            #fff;     /* white is a BAND, used alternately */
	--mx-dark-bg:             #2d2d2d;
	--mx-text-title:          #000;
	--mx-text-body:           #212427;
	--mx-text-light:          #fff;
	--mx-accent:              #dc6362;
	--mx-accent-hover:        #ab2829;
	--mx-accent-contrast:     #fff;
	--mx-btn-accent:          #b52b2b;
	--mx-btn-accent-hover:    #000;
	--mx-light-grey-bg:       #d9d8d9;
	--mx-light-grey-contrast: #b4b4b4;
	--mx-success:             #13a713;

	/* ---- Extended palette (Fresh Ground's 01-0x utility scale) ----------- */
	--mx-grey-01:         #4f4f49;
	--mx-grey-02:         #6b6b64;
	--mx-grey-03:         #71716a;
	--mx-grey-04:         #f2f1f1;
	--mx-cream:           #e6e2d5;
	--mx-beige:           #c4a27f;
	--mx-hairline:        #cfcfcf;  /* accordion rules */
	--mx-hairline-strong: #000;     /* grid col-border rules */
	--mx-hairline-soft:   #d4d3d4;  /* footer strip rules */

	/* ---- Semantic aliases ------------------------------------------------ */
	--mx-bg:       var(--mx-site-bg);
	--mx-band-alt: var(--mx-white-bg);
	--mx-text:     var(--mx-text-body);
	--mx-heading:  var(--mx-text-title);
	--mx-scrim:    rgba(0, 0, 0, .4);   /* hero video overlay */
	--mx-overlay:  rgba(0, 0, 0, .5);   /* link-card title strip */

	/* ---- Typefaces ------------------------------------------------------- */
	--mx-font-heading: 'Playfair Display', Georgia, 'Times New Roman', serif;
	--mx-font-body: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;

	/* ---- Type scale ------------------------------------------------------
	   Headings are LIGHT-WEIGHT SERIF (400). Body is sans. This inversion is
	   the loudest single signal of the Fresh Ground system - do not "fix" it
	   by bolding headings. Scale carries the weight, not the stroke. */
	--mx-h1: clamp(2.5rem, 5vw, 5rem);
	--mx-h2: clamp(1.7rem, 3vw, 3rem);
	--mx-h3: clamp(1.25rem, 3vw, 1.75rem);
	--mx-h4: clamp(1.125rem, 2.4vw, 1.5rem);
	--mx-heading-track: -.025em;
	--mx-heading-lh: 1.1;
	--mx-heading-weight: 400;

	--mx-body:           1rem;
	--mx-body-lh:        1.375rem;
	--mx-text-small:     .875rem;
	--mx-text-small-lh:  1rem;
	--mx-text-xsmall:    .75rem;
	--mx-text-xsmall-lh: .875rem;
	--mx-text-medium:    1.125rem;
	--mx-text-medium-lh: 1.5rem;
	--mx-text-large:     1.375rem;
	--mx-text-large-lh:  1.625rem;

	/* Article bodies are the ONE place bold serif appears (h2 at 700). */
	--mx-prose:    clamp(1rem, 3vw, 1.125rem);
	--mx-prose-lh: 1.4;
	--mx-prose-h2: clamp(1.5rem, 3vw, 2rem);
	--mx-prose-h3: clamp(1rem, 3vw, 1.5rem);

	/* ---- Buttons --------------------------------------------------------- */
	--mx-btn-bg:     #000;
	--mx-btn-fg:     #fff;
	--mx-btn-size:   .75rem;
	--mx-btn-weight: 700;
	--mx-btn-track:  .1em;
	--mx-btn-min-h:  3.5rem;
	--mx-btn-pad:    .9375rem 2.5rem;
	--mx-btn-min-w:  15.625rem;
	--mx-btn-radius: 0;          /* SQUARE. Fresh Ground is not rounded. */

	/* ---- Layout ---------------------------------------------------------- */
	--mx-wrapper:        87.5rem;   /* 1400px */
	--mx-wrapper-medium: 68.75rem;  /* 1100px */
	--mx-wrapper-small:  50rem;     /* 800px  */
	--mx-wrapper-prose:  56.25rem;  /* 900px  */
	--mx-gutter:         2.5rem;    /* 40px desktop */
	--mx-gutter-mobile:  1.25rem;   /* 20px mobile  */

	--mx-w-large:       1440px;
	--mx-w-base:        1220px;
	--mx-w-base-medium: 1060px;
	--mx-w-medium:      980px;

	--mx-grid-gap:        1.875rem;  /* 30px - the universal grid gap */
	--mx-grid-gap-row-lg: 3.75rem;   /* 60px - large-vertical-gap */
	--mx-block-pad:       1.875rem;  /* sb-root inner-block block padding */

	/* ---- Hero padding steps (vh-root pad-25/50/75/100) ------------------- */
	--mx-hero-pad-25:   3.4375rem;
	--mx-hero-pad-50:   6.875rem;
	--mx-hero-pad-75:   10.3125rem;
	--mx-hero-pad-100:  13.75rem;
	--mx-hero-textarea: 43.75rem;  /* 700px centred lede */

	/* ---- Card geometry --------------------------------------------------- */
	--mx-card-media-h: 17.5rem;   /* blog/link/product card image height */
	--mx-card-pad:     1.25rem;
	--mx-icon-bubble:  11.25rem;  /* circular icon-text-card max-width */
	--mx-lottie-icon:  6.25rem;

	/* ---- Motion ---------------------------------------------------------- */
	--mx-transition: .3s;
	--mx-easing:     ease-in-out;
	--mx-motion:     .3s ease-in-out;

	/* ---- Focus ----------------------------------------------------------- */
	--mx-focus-ring:      0 0 0 3px rgba(0, 0, 0, .35);
	--mx-focus-ring-dark: 0 0 0 3px rgba(255, 255, 255, .6);

	/* ---- Breakpoints (documented; media queries cannot read custom props) -
	   567 | 768/769 | 910/911 (nav switch) | 1024 | 1100 | 1375 | 1400 | 1620 */
	--mx-bp-xs:  35.4375rem;  /* 567  */
	--mx-bp-sm:  48rem;       /* 768  */
	--mx-bp-nav: 56.875rem;   /* 910  */
	--mx-bp-md:  64rem;       /* 1024 */
	--mx-bp-lg:  68.75rem;    /* 1100 */
	--mx-bp-xl:  87.5rem;     /* 1400 */
}

/* ==========================================================================
   Astra + Elementor global colour override.

   Astra paints residual chrome (comments, pagination, archive furniture) from
   its own custom properties, and any Elementor content still in the database
   paints from --e-global-color-*. Re-pointing both at our palette here means
   leftovers inherit the Fresh Ground system instead of clashing with it,
   without touching the parent theme or any plugin.

   Deleting this block hands colour control back to the Customizer.
   ========================================================================== */

:root {
	--ast-global-color-0: var(--mx-text-title);
	--ast-global-color-1: var(--mx-grey-01);
	--ast-global-color-2: var(--mx-text-title);
	--ast-global-color-3: var(--mx-text-body);
	--ast-global-color-4: var(--mx-site-bg);
	--ast-global-color-5: var(--mx-white-bg);
	--ast-global-color-6: var(--mx-grey-03);
	--ast-global-color-7: var(--mx-grey-04);
	--ast-global-color-8: var(--mx-site-bg);

	--ast-global-color-primary: var(--mx-text-title);
	--ast-global-color-secondary: var(--mx-grey-01);
	--ast-border-color: var(--mx-hairline);

	--e-global-color-astglobalcolor0: var(--mx-text-title);
	--e-global-color-astglobalcolor1: var(--mx-grey-01);
	--e-global-color-astglobalcolor2: var(--mx-text-title);
	--e-global-color-astglobalcolor3: var(--mx-text-body);
	--e-global-color-astglobalcolor4: var(--mx-site-bg);
	--e-global-color-astglobalcolor5: var(--mx-white-bg);
	--e-global-color-astglobalcolor6: var(--mx-grey-03);
	--e-global-color-astglobalcolor7: var(--mx-grey-04);
	--e-global-color-astglobalcolor8: var(--mx-site-bg);
}

html,
body {
	background-color: var(--mx-site-bg);
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--mx-transition: .01ms;
		--mx-motion: .01ms linear;
	}
}
