/**
 * Turnaa design tokens
 * ─────────────────────────────────────────────────────────────────────
 * The single place the brand's colour, shape and elevation are written
 * down. Until now every template carried its own hex codes — the same
 * terracotta appears 82 times across twenty files — which is why a
 * palette change was a rewrite rather than an edit. Anything new should
 * read from here.
 *
 * Source: DESIGN.md, "Turnaa Travel Telecom". Where the front-matter and
 * the prose disagree the prose wins, because the component specs are
 * written against it: primary #0e3029, accent #c85a2b, signal #10b981.
 *
 * The hierarchy inverted with this system. Terracotta used to be the
 * brand; it is now a micro-accent reserved for urgency — expiring data,
 * limited offers, checkout. Deep forest green carries the brand: primary
 * buttons, active tabs, navigational anchors.
 */

:root {
	/* ── brand ───────────────────────────────────────────────────── */
	--t-primary:        #0e3029;   /* deep forest emerald: CTAs, active tabs */
	--t-primary-hover:  #16453b;
	--t-primary-ink:    #ffffff;
	--t-primary-soft:   #eef3f1;   /* tint for selected chips and icon tiles */

	--t-accent:         #c85a2b;   /* warm terracotta: urgency only */
	--t-accent-hover:   #b04d23;
	--t-accent-ink:     #ffffff;
	--t-accent-soft:    #fff7ed;

	--t-signal:         #10b981;   /* mint: installed, active, verified */
	--t-signal-bg:      #ecfdf5;
	--t-signal-ink:     #065f46;

	/* ── neutrals ────────────────────────────────────────────────── */
	--t-canvas:         #ffffff;   /* level 0 */
	--t-surface:        #f8f9fa;   /* level 1 */
	--t-surface-2:      #fafaf9;
	--t-line:           #e5e7eb;   /* container perimeter */
	--t-line-2:         #f1f3f5;   /* nested cell separators */
	--t-line-strong:    #d1d5db;
	--t-ink:            #111827;
	--t-muted:          #6b7280;

	/* ── status ──────────────────────────────────────────────────── */
	--t-warn-bg:        #fff7ed;
	--t-warn-ink:       #9a3412;
	--t-error:          #ba1a1a;
	--t-error-bg:       #ffdad6;
	--t-error-ink:      #93000a;

	/* ── shape ───────────────────────────────────────────────────── */
	--t-r-sm:           8px;       /* inputs, small badges */
	--t-r:              12px;      /* plan cards, filters */
	--t-r-lg:           16px;
	--t-r-xl:           24px;      /* sheets, hero wrappers */
	--t-r-pill:         9999px;

	/* ── elevation: hairlines first, shadow only when it lifts ───── */
	--t-e1:             none;
	--t-e2:             0 4px 16px -2px rgba(14, 48, 41, .05), 0 2px 6px -1px rgba(0, 0, 0, .02);
	--t-e3:             0 16px 36px -4px rgba(14, 48, 41, .10), 0 4px 12px -2px rgba(0, 0, 0, .04);
	--t-focus:          0 0 0 3px rgba(14, 48, 41, .08);

	/* ── type ────────────────────────────────────────────────────── */
	--t-font:           'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

	/* ── layout ──────────────────────────────────────────────────── */
	--t-max:            1240px;
	--t-gutter:         1.5rem;
	--t-gutter-mobile:  1rem;
	--t-margin:         2rem;
	--t-margin-mobile:  1rem;
}

/**
 * Numbers people compare — allowances, prices, day counts — line up in a
 * column whatever the digits are. DESIGN.md asks for this specifically.
 */
.t-nums,
.t-nums * {
	font-variant-numeric: tabular-nums;
}