/* GENERATED by wordpress/tools/export.py from design/src/css/tokens.css — DO NOT EDIT. */
/* ==========================================================================
   MOB Community Services — design tokens
   Every value the design uses lives here as a --mob-* custom property.
   The prefix is not decoration: this file is later injected into a
   WordPress page that already carries Astra's and Elementor's stylesheets,
   and bare names (--ink, --line, .btn) collide silently. Lesson carried
   over from the ORA Reizen build.
   Brand hexes are SAMPLED from the client's own logo files, not guessed:
     navy  #0A2339  (logo "MOB" + left stroke of the M)
     olive #535D2B  (logo "COMMUNITY" + right stroke of the M)
     sage  #BFCC8B  (logo light variant)
     ember #FC702C  (logo tagline accent, MOB_logo_fresh.png)
   ========================================================================== */
:root {
	/* brand */
	--mob-navy-950: #061729;
	--mob-navy-900: #0A2339;
	--mob-navy-800: #112F4B;
	--mob-navy-700: #1B4063;
	--mob-navy-300: #9FB2C6;
	--mob-navy-100: #E4EAF1;
	--mob-navy-50:  #F2F5F9;

	--mob-olive-800: #3A4220;
	--mob-olive-700: #465024;
	--mob-olive-600: #535D2B;
	--mob-olive-500: #6B7838;
	--mob-sage-300:  #BFCC8B;
	--mob-sage-200:  #D8E0B5;
	--mob-sage-100:  #EDF1DF;

	--mob-ember-600: #E25A17;
	--mob-ember-500: #FC702C;
	--mob-ember-300: #FDB48A;
	--mob-ember-100: #FFEBDD;
	--mob-gold-400:  #F2A93B;

	/* neutrals */
	--mob-ink:      #0A2339;   /* headings = brand navy */
	--mob-body:     #37414C;   /* running text, 10.6:1 on white */
	--mob-muted:    #66717D;   /* captions, 4.9:1 on white */
	--mob-line:     #E2E6E3;
	--mob-line-2:   #CFD6D2;
	--mob-paper:    #FFFFFF;
	--mob-mist:     #F5F7F3;   /* alternate section tint: sage-grey, NOT cream */
	--mob-charcoal: #15191E;

	/* type */
	--mob-f-display: "Bricolage Grotesque", "Figtree", system-ui, sans-serif;
	--mob-f-body:    "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;

	--mob-fs-hero: clamp(2.85rem, 1.2rem + 6.2vw, 6.4rem);
	--mob-fs-h2:   clamp(2.15rem, 1.25rem + 3.3vw, 4rem);
	--mob-fs-h3:   clamp(1.35rem, 1.1rem + .9vw, 1.85rem);
	--mob-fs-lead: clamp(1.08rem, 1rem + .35vw, 1.3rem);
	--mob-fs-body: 1.0625rem;
	--mob-fs-sm:   .9375rem;
	--mob-fs-xs:   .8125rem;

	/* space — 8px system */
	--mob-s1: .5rem;  --mob-s2: 1rem;   --mob-s3: 1.5rem; --mob-s4: 2rem;
	--mob-s5: 2.5rem; --mob-s6: 3rem;   --mob-s8: 4rem;   --mob-s10: 5rem;
	--mob-section: clamp(5rem, 3rem + 7vw, 9.5rem);
	--mob-wrap: 1280px;
	--mob-gutter: clamp(1rem, .5rem + 2.4vw, 2.5rem);

	/* shape + depth */
	--mob-r-sm: 10px;
	--mob-r:    18px;
	--mob-r-lg: 28px;
	--mob-r-xl: 40px;
	--mob-shadow-1: 0 1px 2px rgba(10,35,57,.06), 0 4px 14px rgba(10,35,57,.06);
	--mob-shadow-2: 0 2px 6px rgba(10,35,57,.06), 0 18px 44px -12px rgba(10,35,57,.22);
	--mob-shadow-3: 0 30px 80px -20px rgba(6,23,41,.45);

	/* motion */
	--mob-ease: cubic-bezier(.16, 1, .3, 1);
	--mob-ease-io: cubic-bezier(.65, 0, .35, 1);
	--mob-dur: .9s;
}