/* Vitalis — design tokens. Calm clinical light: ice white, medical navy, teal & trust blue. */
:root {
	/* ---- surfaces ---- */
	--v-bg:     #f6f9fb;   /* ice white page          */
	--v-bg-2:   #ffffff;   /* card                    */
	--v-bg-3:   #eaf2f6;   /* tinted panel            */
	--v-bg-4:   #e0edf2;   /* hover tint              */
	--v-ink-panel: #0e2a3b;/* dark section (rare)     */
	--v-line:   rgba( 15, 43, 61, 0.10 );
	--v-line-2: rgba( 15, 43, 61, 0.18 );

	/* ---- ink ---- */
	--v-ink:    #0f2b3d;   /* deep medical navy       */
	--v-muted:  #55707f;   /* slate                   */
	--v-faint:  #8aa1ad;   /* tertiary                */

	/* ---- brand ---- */
	--v-teal:      #0fb5a6;  /* medical teal           */
	--v-teal-deep: #0a8d81;  /* teal for text on light */
	--v-blue:      #2f7cf6;  /* trust blue             */
	--v-blue-deep: #1f5fd0;
	--v-mint:      #6fe3c4;
	--v-coral:     #ff7a6b;  /* accent / care (sparing)*/
	--v-accent:    var( --v-teal );
	--v-grad:      linear-gradient( 100deg, #0fb5a6, #2f7cf6 );
	--v-grad-soft: linear-gradient( 135deg, #e6fbf6, #eaf3ff );
	--v-glow:      0 18px 44px -22px rgba( 15, 129, 152, 0.5 );

	/* ---- type ---- */
	--v-f-display: 'Sora', system-ui, -apple-system, sans-serif;
	--v-f-body:    'Manrope', system-ui, -apple-system, sans-serif;
	--v-f-mono:    'IBM Plex Mono', ui-monospace, monospace;

	--fs-50:  0.8rem;
	--fs-100: 0.9rem;
	--fs-200: 1.0rem;
	--fs-300: 1.2rem;
	--fs-400: 1.5rem;
	--fs-500: 2.0rem;
	--fs-600: clamp( 1.9rem, 4.2vw, 2.9rem );
	--fs-700: clamp( 2.4rem, 5.4vw, 4rem );
	--fs-800: clamp( 2.9rem, 7vw, 5.6rem );

	/* ---- spacing (8px) ---- */
	--sp-1: 0.5rem;
	--sp-2: 1rem;
	--sp-3: 1.5rem;
	--sp-4: 2.25rem;
	--sp-5: 3.5rem;
	--sp-6: 5.5rem;
	--sp-7: 8rem;

	--v-wrap: 1200px;
	--v-wrap-wide: 1420px;
	--v-measure: 66ch;

	/* ---- radii (soft, clinical) ---- */
	--r-sm:  10px;
	--r:     16px;
	--r-lg:  24px;
	--r-xl:  32px;
	--r-pill: 999px;

	/* ---- motion ---- */
	--ease:    cubic-bezier( 0.22, 1, 0.36, 1 );
	--ease-io: cubic-bezier( 0.7, 0, 0.3, 1 );
	--dur:     0.5s;

	--v-shadow:    0 24px 60px -32px rgba( 15, 43, 61, 0.28 );
	--v-shadow-sm: 0 12px 30px -20px rgba( 15, 43, 61, 0.22 );
	--v-blur: saturate( 140% ) blur( 12px );
}
