/**
 * Design tokens and global typography.
 * Everything else (components, patterns) reads from these variables,
 * so a brand change is a one-file edit.
 */

@font-face {
	font-family: "Gustolle";
	src: url("../fonts/Gustolle.woff") format("woff");
	font-display: swap;
}

:root {
	/* Colors */
	--gala-blue: #0077c1;
	--gala-navy: #003051;
	--gala-sky: #8ab3bf;
	--gala-pale: #e0ecf0;
	--gala-ink: #010101;
	--gala-white: #fff;

	/* Fonts */
	--gala-font-display: "filson-soft", sans-serif;
	--gala-font-body: "Nunito", sans-serif;
	--gala-font-ui: "Mulish", sans-serif;
	--gala-font-script: "Gustolle", cursive;

	/* Layout */
	--gala-content-width: 640px;
	--gala-space: 1.25rem;
	--gala-gutter: 29px;

	/* Watercolor splashes: a = top-left (hero), b = tall one behind the
	   speaker/program/venue sections. Positions are tuned per breakpoint. */
	--gala-splash-a-pos: -287px -115px;
	--gala-splash-b-pos: -270px 0;
}

@media (min-width: 768px) {
	:root {
		--gala-splash-a-pos: -405px -360px;
		--gala-splash-b-pos: -540px 0;
	}
}

@media (min-width: 1025px) {
	:root {
		--gala-splash-a-pos: -601px -544px;
		--gala-splash-b-pos: -478px 0;
	}
}

html {
	scroll-behavior: smooth;
}

body {
	background-image: url("../img/watercolor-paper-min-scaled.jpg");
	color: var(--gala-navy);
	font-family: var(--gala-font-body);
}

/* Added for the sponsorship cards. */
:root {
	--gala-mist: #b7d7e9;
	--gala-tier-blue: #0074c7;
	--gala-tier-eyebrow: #a1c5ca;
}