/**
 * Travel 2Borders - design tokens.
 *
 * Change a colour or font here and it updates across the whole site.
 *
 * Colours that are also used see-through (with opacity) have a matching
 * -rgb variable holding the same colour as "R, G, B". When you change such a
 * colour, update both lines, e.g.:
 *   --t2b-color-bg: #F9F7F3;
 *   --t2b-color-bg-rgb: 249, 247, 243;
 * Usage: color: var(--t2b-color-primary);
 *        border-color: rgba(var(--t2b-color-ink-rgb), 0.12);
 */

:root {
	/* Fonts */
	--t2b-font-sans: Archivo, Helvetica, sans-serif;

	/* Brand */
	--t2b-color-primary: #D33B51;               /* Buttons, eyebrows, accents */
	--t2b-color-primary-rgb: 211, 59, 81;
	--t2b-color-primary-dark: #B32F43;          /* Primary button hover */
	--t2b-color-primary-dark-rgb: 179, 47, 67;
	--t2b-color-primary-light: #EE7B88;         /* Accent on dark backgrounds */
	--t2b-color-primary-light-rgb: 238, 123, 136;
	--t2b-color-secondary: #0E332F;             /* Deep green: dark sections, secondary buttons */
	--t2b-color-secondary-rgb: 14, 51, 47;
	--t2b-color-secondary-light: #14544D;       /* Links, final steps */
	--t2b-color-secondary-light-rgb: 20, 84, 77;

	/* Backgrounds */
	--t2b-color-bg: #F9F7F3;                    /* Page background (cream) */
	--t2b-color-bg-rgb: 249, 247, 243;
	--t2b-color-bg-alt: #EFECE5;                /* Alternate section / card background (sand) */
	--t2b-color-bg-alt-rgb: 239, 236, 229;
	--t2b-color-bg-sand: #E4DED1;               /* Darker sand panels */
	--t2b-color-bg-sand-rgb: 228, 222, 209;
	--t2b-color-placeholder: #DEE3E0;           /* Image placeholder behind photos */
	--t2b-color-placeholder-rgb: 222, 227, 224;

	/* Dark surfaces and overlays */
	--t2b-color-dark: #061A18;                  /* Hero / image section background */
	--t2b-color-dark-rgb: 6, 26, 24;
	--t2b-color-dark-alt: #072220;              /* Dark panels, overlay gradients */
	--t2b-color-dark-alt-rgb: 7, 34, 32;
	--t2b-color-dark-forest: #0E241B;           /* Dark forest panel */
	--t2b-color-dark-forest-rgb: 14, 36, 27;
	--t2b-color-dark-film: #14110E;             /* Video placeholder background */
	--t2b-color-dark-film-rgb: 20, 17, 14;
	--t2b-color-dark-stone: #3E382F;            /* Stone accent */
	--t2b-color-dark-stone-rgb: 62, 56, 47;
	--t2b-color-overlay: #041514;               /* Photo overlay gradients */
	--t2b-color-overlay-rgb: 4, 21, 20;
	--t2b-color-overlay-deep: #051A18;          /* Photo overlay gradients */
	--t2b-color-overlay-deep-rgb: 5, 26, 24;
	--t2b-color-overlay-green: #0B2D2A;         /* Photo overlay gradients */
	--t2b-color-overlay-green-rgb: 11, 45, 42;

	/* Text */
	--t2b-color-heading: #0F2422;               /* Headings and strong text */
	--t2b-color-heading-rgb: 15, 36, 34;
	--t2b-color-text: #3D4A48;                  /* Body text */
	--t2b-color-text-rgb: 61, 74, 72;
	--t2b-color-text-muted: #4C5957;            /* Secondary text */
	--t2b-color-text-muted-rgb: 76, 89, 87;
	--t2b-color-text-soft: #5F6C6A;             /* Captions, labels */
	--t2b-color-text-soft-rgb: 95, 108, 106;
	--t2b-color-text-subtle: #6B7674;           /* Small print */
	--t2b-color-text-subtle-rgb: 107, 118, 116;
	--t2b-color-text-faint: #7B8886;            /* Faint labels */
	--t2b-color-text-faint-rgb: 123, 136, 134;
	--t2b-color-ink: #07211F;                   /* Lines and borders on light backgrounds (used with opacity) */
	--t2b-color-ink-rgb: 7, 33, 31;

	/* On dark backgrounds */
	--t2b-color-mint: #D3E5E1;                  /* Highlight text on dark */
	--t2b-color-mint-rgb: 211, 229, 225;
	--t2b-color-mint-light: #E9F2F0;            /* Body text on dark */
	--t2b-color-mint-light-rgb: 233, 242, 240;
	--t2b-color-white: #FFFFFF;                 /* White */
	--t2b-color-white-rgb: 255, 255, 255;
}