/* ==========================================================================
   TreatmentCosts — Design Tokens (single source of visual truth)
   Refined clinical teal + warm coral. Confident, modern, trustworthy.
   ========================================================================== */
:root {
	/* --- Brand: teal scale --- */
	--tc-primary:        #0e8a8f;
	--tc-primary-600:    #0c757a;
	--tc-primary-700:    #0a5c61;
	--tc-primary-800:    #08474b;
	--tc-primary-100:    #e2f4f4;
	--tc-primary-50:     #f0faf9;

	/* --- Accent: coral (CTAs) + amber (highlights) --- */
	--tc-accent:         #ff6a3d;
	--tc-accent-600:     #f0532a;
	--tc-accent-100:     #ffe9e1;
	--tc-amber:          #f5a524;
	--tc-amber-100:      #fdf0d5;

	/* --- Ink / neutrals --- */
	--tc-ink:            #0c1f28;   /* headings */
	--tc-ink-700:        #2b3f49;   /* body */
	--tc-ink-soft:       #4d626c;
	--tc-muted:          #74878f;
	--tc-line:           #e4ebed;
	--tc-line-soft:      #eef3f4;

	/* --- Surfaces --- */
	--tc-bg:             #ffffff;
	--tc-bg-alt:         #f4f8f8;
	--tc-bg-tint:        #eef6f6;
	--tc-bg-deep:        #07343a;   /* footer / dark sections */

	/* --- Semantic --- */
	--tc-success:        #18A058;
	--tc-success-100:    #e3f5ea;
	--tc-warning:        #c9820a;
	--tc-danger:         #d8453f;
	--tc-verified:       #18A058;
	--tc-from:           #c9820a;

	/* --- Gradients (the "wow") --- */
	--tc-grad-hero:      radial-gradient(1200px 600px at 85% -10%, #d7f1f0 0%, rgba(215,241,240,0) 55%),
	                     radial-gradient(900px 500px at 5% 0%, #e9f0ff 0%, rgba(233,240,255,0) 50%),
	                     linear-gradient(180deg, #f7fbfb 0%, #ffffff 70%);
	--tc-grad-primary:   linear-gradient(135deg, #12a0a0 0%, #0a5c61 100%);
	--tc-grad-accent:    linear-gradient(135deg, #ff7d4f 0%, #f0532a 100%);
	--tc-grad-dist:      linear-gradient(90deg, #8fded8 0%, #12a0a0 50%, #0a5c61 100%);

	/* --- Typography --- */
	--tc-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--tc-font-num:  "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	--tc-fs-eyebrow: 0.78rem;
	--tc-fs-xs:   0.78rem;
	--tc-fs-sm:   0.875rem;
	--tc-fs-base: 1rem;
	--tc-fs-md:   1.125rem;
	--tc-fs-lg:   1.375rem;
	--tc-fs-xl:   1.75rem;
	--tc-fs-2xl:  2.25rem;
	--tc-fs-3xl:  2.9rem;
	--tc-fs-4xl:  3.6rem;

	--tc-lh-tight: 1.12;
	--tc-lh-snug:  1.35;
	--tc-lh-base:  1.65;

	--tc-tracking-tight: -0.02em;
	--tc-tracking-wide:  0.08em;

	/* --- Spacing scale (4px base) --- */
	--tc-sp-1: 0.25rem;
	--tc-sp-2: 0.5rem;
	--tc-sp-3: 0.75rem;
	--tc-sp-4: 1rem;
	--tc-sp-5: 1.5rem;
	--tc-sp-6: 2rem;
	--tc-sp-7: 2.5rem;
	--tc-sp-8: 3rem;
	--tc-sp-10: 4rem;
	--tc-sp-12: 6rem;
	--tc-sp-14: 8rem;

	/* --- Radii --- */
	--tc-radius-sm: 8px;
	--tc-radius:    14px;
	--tc-radius-lg: 22px;
	--tc-radius-xl: 30px;
	--tc-radius-pill: 999px;

	/* --- Elevation (layered, soft) --- */
	--tc-shadow-xs: 0 1px 2px rgba(8, 35, 40, .06);
	--tc-shadow-sm: 0 2px 8px rgba(8, 35, 40, .06);
	--tc-shadow:    0 8px 24px -6px rgba(8, 35, 40, .12), 0 2px 6px rgba(8, 35, 40, .05);
	--tc-shadow-lg: 0 22px 48px -12px rgba(8, 35, 40, .22), 0 6px 14px rgba(8, 35, 40, .08);
	--tc-shadow-primary: 0 12px 26px -8px rgba(14, 138, 143, .45);
	--tc-shadow-accent:  0 12px 26px -8px rgba(255, 106, 61, .45);

	/* --- Focus ring --- */
	--tc-ring: 0 0 0 3px rgba(14, 138, 143, .35);

	/* --- Layout --- */
	--tc-container: 1160px;
	--tc-container-narrow: 760px;

	/* --- Motion --- */
	--tc-ease: cubic-bezier(.22, 1, .36, 1);
	--tc-dur:  .22s;
}

/* Breakpoints (reference): sm 480 · md 768 · lg 1024 · xl 1160 */