/* assets/css/site/base.css */

/* ROOT */
:root {
	--ca-accent-green: #CCE732;
	--ca-accent-orange: #FF9A55;
	--ca-accent-red: #FF5C70;
	--ca-black: #000000;
	--ca-border: #E8EAF0;
	--ca-dark: #05060A;
	--ca-ease: ease;
	--ca-grey-100: #F5F7FA;
	--ca-grey-200: #EEF0F6;
	--ca-grey-300: #DFE0E3;
	--ca-grey-400: #C5C6C8;
	--ca-grey-500: #8B90A3;
	--ca-r-l: 1.2rem;
	--ca-r-m: .9rem;
	--ca-r-pill: 50rem;
	--ca-r-s: .5rem;
	--ca-shadow-1: 0 10px 30px rgba(12, 14, 22, .06);
	--ca-space-x: 1rem;
	--ca-space-y: 1rem;
	--ca-speed: .2s;
	--ca-text: #1A1E2B;
	--ca-white: #FFFFFF;
}

* {
	box-sizing: border-box;
}

html,
body {
	height: 100%;
}

body {
	-webkit-font-smoothing: antialiased;
	color: var(--ca-text);
	font-family: 'Eina 01', Arial, sans-serif;
	font-size: 1rem;
	line-height: 1.55;
	margin: 0;
	-moz-osx-font-smoothing: grayscale;
}

img {
	display: block;
	max-width: 100%;
}

a {
	color: inherit;
	text-decoration: none;
	transition: all var(--ca-speed) var(--ca-ease);
}

a:hover {
	text-decoration: none;
}

button {
	cursor: pointer;
}

p {
	margin: 0;
}


/* TYPE */
h1,
h2,
h3,
h4,
h5,
h6 {
	color: var(--ca-black);
	font-family: 'CASSwebfont', Arial, sans-serif;
	letter-spacing: -.02em;
	margin: 0;
}


/* GLOBAL TRANSITIONS */
a,
button,
input,
select,
textarea,
.nav--toggler,
.card--wrapper {
	transition: all var(--ca-speed) var(--ca-ease);
}


/* FONT RENDERING */
.header--main,
.nav--main,
.offcanvas--menu {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: geometricPrecision;
}


/* FONT FAMILIES */
.btn,
.btn--darkpill,
.btn--features-primary,
.btn--features-secondary,
.btn--pill,
.btn--primary,
.btn--reviewpill,
.btn--secondary,
.header__link--help,
.nav--main,
.nav--main a,
.offcanvas--menu,
.offcanvas--menu a {
	font-family: 'CASSwebfont', Arial, sans-serif;
}


/* HELPERS */
.bg--grey {
	background: var(--ca-grey-100);
}

.text--muted {
	color: var(--ca-grey-500);
}


/* WRAPPERS */
.card--inner {
	border-radius: var(--ca-r-m);
	padding: 1rem;
}

.card--wrapper {
	background: var(--ca-white);
	border: 1px solid var(--ca-border);
	border-radius: var(--ca-r-l);
	box-shadow: var(--ca-shadow-1);
	padding: 1rem;
}


/* MEDIA BOXES */
.img--box,
.logo--box {
	border-radius: var(--ca-r-l);
	overflow: hidden;
	position: relative;
}

.img--box img,
.logo--box img {
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}


/* BUTTONS */
.btn,
.btn--darkpill,
.btn--features-primary,
.btn--features-secondary,
.btn--pill,
.btn--primary,
.btn--reviewpill,
.btn--secondary {
	font-weight: 900;
	letter-spacing: -.01em;
}

/*
.btn--pill {
	align-items: center;
	border-radius: var(--ca-r-pill);
	display: inline-flex;
	font-size: 1.125rem;
	font-weight: 900;
	gap: .5rem;
	justify-content: center;
	letter-spacing: -.01em;
	padding: .6rem 1rem;
	white-space: nowrap;
}
*/

.btn--pill {
	align-items: center;
	border-radius: var(--ca-r-pill);
	display: inline-flex;
	font-size: 1.25rem;
	font-weight: 900;
	gap: .5rem;
	justify-content: center;
	letter-spacing: -.01em;
	line-height: 1.15;
	padding: .72rem 1.25rem .78rem 1.25rem;
	white-space: nowrap;
}

.btn--primary {
	background: var(--ca-black);
	border: 2px solid var(--ca-black);
	color: var(--ca-white);
}

.btn--primary:hover {
	background: var(--ca-white);
	border-color: #101425;
	color: var(--ca-black);
}

.btn--secondary {
	background: transparent;
	border: 2px solid var(--ca-border);
	color: var(--ca-black);
}

.btn--secondary:hover {
	background: var(--ca-grey-100);
	border-color: var(--ca-grey-200);
	color: var(--ca-black);
}

.btn:focus,
button:focus {
	box-shadow: none;
	outline: 0;
}


/* SECTIONS */
.section--block {
	padding: var(--ca-space-y) 0;
}