/* =========================================================
   Devote — Typography
   Source: Design Home Web 1440 (client export)
   Fonts mapped to assets/fonts/stylesheet.css
   ========================================================= */

@media (min-width: 1400px) {
	.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
		max-width: 1440px;
	}
}

:root {
	--container-width: 1320px;
	--content-max: calc(var(--container-width) / 2 - 20px);

	/* Colors */
	--unnamed-color-ffffff: #ffffff;
	--unnamed-color-3c3c3b: #3c3c3b;
	--unnamed-color-707070: #707070;
	--unnamed-color-27658b: #27658b;
	--unnamed-color-018bc3: #018bc3;
	--unnamed-color-009bd9: #009bd9;
	--unnamed-color-acc8dd: #acc8dd;
	--unnamed-color-e3dddb: #e3dddb;
	--unnamed-color-f6f4f4: #f6f4f4;
	--unnamed-color-3c3c3c: #3c3c3c;
	--unnamed-color-000000: #000000;

	/* Font families — match assets/fonts/stylesheet.css */
	--font-family-avenir: 'Avenir Next', sans-serif;
	--font-family-freight: 'FreightDisp Pro', serif;
	--font-avenir: 'Avenir Next', sans-serif;
	--font-avenir-italic: 'Avenir Next Italic', sans-serif;
	--font-avenir-medium: 'Avenir Next Medium', sans-serif;
	--font-avenir-medium-italic: 'Avenir Next MediumItalic', sans-serif;
	--font-avenir-bold: 'Avenir Next Bold', sans-serif;
	--font-avenir-bold-italic: 'Avenir Next BoldItalic', sans-serif;
	--font-freight: 'FreightDisp Pro', serif;
	--font-freight-italic: 'FreightDisp Pro Italic', serif;
	--font-freight-medium: 'FreightDisp Pro Medium', serif;
	--font-freight-medium-italic: 'FreightDisp Pro MediumItalic', serif;
	--font-freight-bold: 'FreightDisp Pro bold', serif;
	--unnamed-font-family-avenir-next: var(--font-avenir);
	--unnamed-font-family-freightdisp-pro: var(--font-freight-medium-italic);

	/* Font style & weight tokens */
	--unnamed-font-style-normal: normal;
	--unnamed-font-style-italic: italic;
	--unnamed-font-weight-bold: 700;
	--unnamed-font-weight-medium: 500;
	--unnamed-font-weight-normal: 400;

	/*
	 * Font presets — use utility classes (.font-avenir-medium) or apply all 3:
	 *   font-family: var(--font-avenir-medium-family);
	 *   font-weight: var(--font-avenir-medium-weight);
	 *   font-style: var(--font-avenir-medium-style);
	 */

	/* Avenir Next — family name per weight (Option A) */
	--font-avenir-normal-family: var(--font-avenir);
	--font-avenir-normal-weight: normal;
	--font-avenir-normal-style: normal;

	--font-avenir-medium-family: var(--font-avenir-medium);
	--font-avenir-medium-weight: normal;
	--font-avenir-medium-style: normal;

	--font-avenir-bold-family: var(--font-avenir-bold);
	--font-avenir-bold-weight: normal;
	--font-avenir-bold-style: normal;

	--font-avenir-normal-italic-family: var(--font-avenir-italic);
	--font-avenir-normal-italic-weight: normal;
	--font-avenir-normal-italic-style: normal;

	--font-avenir-medium-italic-family: var(--font-avenir-medium-italic);
	--font-avenir-medium-italic-weight: normal;
	--font-avenir-medium-italic-style: normal;

	--font-avenir-bold-italic-family: var(--font-avenir-bold-italic);
	--font-avenir-bold-italic-weight: normal;
	--font-avenir-bold-italic-style: normal;

	/* FreightDisp Pro — family name per weight (Option A) */
	--font-freight-normal-family: var(--font-freight);
	--font-freight-normal-weight: normal;
	--font-freight-normal-style: normal;

	--font-freight-medium-family: var(--font-freight-medium);
	--font-freight-medium-weight: normal;
	--font-freight-medium-style: normal;

	--font-freight-bold-family: var(--font-freight-bold);
	--font-freight-bold-weight: normal;
	--font-freight-bold-style: normal;

	--font-freight-normal-italic-family: var(--font-freight-italic);
	--font-freight-normal-italic-weight: normal;
	--font-freight-normal-italic-style: normal;

	--font-freight-medium-italic-family: var(--font-freight-medium-italic);
	--font-freight-medium-italic-weight: normal;
	--font-freight-medium-italic-style: normal;

	--font-freight-bold-italic-family: var(--font-freight);
	--font-freight-bold-italic-weight: bold;
	--font-freight-bold-italic-style: italic;

	/* Font sizes */
	--unnamed-font-size-16: 16px;
	--unnamed-font-size-18: 18px;
	--unnamed-font-size-20: 20px;
	--unnamed-font-size-24: 24px;
	--unnamed-font-size-28: 28px;
	--unnamed-font-size-34: 34px;
	--unnamed-font-size-52: 52px;
	--unnamed-font-size-64: 64px;
	--unnamed-font-size-76: 76px;
	--unnamed-font-size-80: 80px;

	/* Font size tokens (for .fs-* utilities) */
	--fs-16: var(--unnamed-font-size-16);
	--fs-18: var(--unnamed-font-size-18);
	--fs-20: var(--unnamed-font-size-20);
	--fs-24: var(--unnamed-font-size-24);
	--fs-28: var(--unnamed-font-size-28);
	--fs-34: var(--unnamed-font-size-34);
	--fs-52: var(--unnamed-font-size-52);
	--fs-64: var(--unnamed-font-size-64);
	--fs-76: var(--unnamed-font-size-76);
	--fs-80: var(--unnamed-font-size-80);
	--fs-42: 42px;

	--unnamed-character-spacing-0: 0;
	--unnamed-character-spacing-0-9: 0.9px;
	--unnamed-character-spacing-1-2: 1.2px;
	--unnamed-character-spacing-1-9: 1.9px;
	--unnamed-line-spacing-22: 22px;
	--unnamed-line-spacing-25: 25px;
	--unnamed-line-spacing-27: 27px;
	--unnamed-line-spacing-33: 33px;
	--unnamed-line-spacing-60: 60px;
	--unnamed-line-spacing-65: 65px;
	--unnamed-line-spacing-75: 75px;
	--unnamed-text-transform-uppercase: uppercase;

	/* Short aliases (optional, for theme use) */
	--color-white: var(--unnamed-color-ffffff);
	--color-ink: var(--unnamed-color-3c3c3b);
	--color-ink-alt: var(--unnamed-color-3c3c3c);
	--color-muted: var(--unnamed-color-707070);
	--color-navy: var(--unnamed-color-27658b);
	--color-blue: var(--unnamed-color-018bc3);
	--color-blue-bright: var(--unnamed-color-009bd9);
	--color-blue-soft: var(--unnamed-color-acc8dd);
	--color-beige: var(--unnamed-color-e3dddb);
	--color-grey: var(--unnamed-color-f6f4f4);

	/* Grid */
	--grid-max: 1440px;
	--grid-gutter: 24px;
	--radius-organic: 150px;
}



/* ---------- Base ---------- */

body {
	font-family: var(--font-avenir-medium);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-normal);
	font-size: var(--unnamed-font-size-24);
	line-height: var(--unnamed-line-spacing-27);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-707070);
	background: var(--unnamed-color-ffffff);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
	margin-top: 0;
}

p {
	margin-top: 0;
}

/* ---------- Character styles (client export) ---------- */

.h1-hero {
	font-family: var(--font-avenir-bold);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-bold);
	font-size: var(--unnamed-font-size-80);
	line-height: var(--unnamed-line-spacing-75);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-3c3c3b);
	text-wrap-mode: nowrap;
}

.h2-hero {
	font-family: var(--unnamed-font-family-freightdisp-pro);
	font-style: var(--unnamed-font-style-italic);
	font-weight: var(--unnamed-font-weight-medium);
	font-size: var(--unnamed-font-size-76);
	line-height: var(--unnamed-line-spacing-65);
	letter-spacing: var(--unnamed-character-spacing-1-9);
	color: var(--unnamed-color-018bc3);
	margin-bottom: 140px;
}

.services {
	font-family: var(--font-avenir-bold);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-bold);
	font-size: var(--unnamed-font-size-18);
	line-height: var(--unnamed-line-spacing-25);
	letter-spacing: var(--unnamed-character-spacing-0-9);
	color: var(--unnamed-color-707070);
	text-transform: var(--unnamed-text-transform-uppercase);
}

.intro-hero {
	font-family: var(--font-avenir-medium);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-medium);
	font-size: var(--unnamed-font-size-24);
	line-height: var(--unnamed-line-spacing-33);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-707070);
}

.button-klein {
	font-family: var(--unnamed-font-family-avenir-next);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-bold);
	font-size: var(--unnamed-font-size-16);
	line-height: var(--unnamed-line-spacing-22);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-3c3c3c);
}

.label {
	font-family: var(--unnamed-font-family-avenir-next);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-bold);
	font-size: var(--unnamed-font-size-18);
	line-height: var(--unnamed-line-spacing-25);
	letter-spacing: var(--unnamed-character-spacing-0-9);
	color: var(--unnamed-color-acc8dd);
	text-transform: var(--unnamed-text-transform-uppercase);
}

.h3 {
	font-family: var(--unnamed-font-family-avenir-next);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-bold);
	font-size: var(--unnamed-font-size-52);
	line-height: var(--unnamed-line-spacing-60);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-3c3c3b);
}

.h4 {
	font-family: var(--unnamed-font-family-avenir-next);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-bold);
	font-size: var(--unnamed-font-size-64);
	line-height: var(--unnamed-line-spacing-60);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-3c3c3b);
}

.expertise {
	font-family: var(--unnamed-font-family-avenir-next);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-bold);
	font-size: var(--unnamed-font-size-24);
	line-height: var(--unnamed-line-spacing-33);
	letter-spacing: var(--unnamed-character-spacing-1-2);
	color: var(--unnamed-color-3c3c3b);
	text-transform: var(--unnamed-text-transform-uppercase);
}

.body {
	font-family: var(--unnamed-font-family-avenir-next);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-normal);
	font-size: var(--unnamed-font-size-20);
	line-height: var(--unnamed-line-spacing-27);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-707070);
}

.body-wit {
	font-family: var(--unnamed-font-family-avenir-next);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-normal);
	font-size: var(--unnamed-font-size-20);
	line-height: var(--unnamed-line-spacing-27);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-ffffff);
}

/* ---------- Theme aliases ---------- */

.hero h1,
.hero2-title,
.text-h1-hero {
	font-family: var(--unnamed-font-family-avenir-next);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-bold);
	font-size: clamp(36px, 8vw, var(--unnamed-font-size-80));
	line-height: var(--unnamed-line-spacing-75);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-3c3c3b);
}

.hero .serif-italic,
.hero2-accent,
.text-h2-hero {
	font-family: var(--unnamed-font-family-freightdisp-pro);
	font-style: var(--unnamed-font-style-italic);
	font-weight: var(--unnamed-font-weight-medium);
	font-size: clamp(76px, 7.5vw, var(--unnamed-font-size-76));
	line-height: var(--unnamed-line-spacing-65);
	letter-spacing: var(--unnamed-character-spacing-1-9);
	color: var(--unnamed-color-018bc3);
}

.hero2-lead,
.hero .lead,
.text-intro-hero {
	font-family: var(--unnamed-font-family-avenir-next);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-medium);
	font-size: clamp(18px, 2.5vw, var(--unnamed-font-size-24));
	line-height: var(--unnamed-line-spacing-33);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-707070);
}

.text-body {
	font-family: var(--unnamed-font-family-avenir-next);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-normal);
	font-size: var(--unnamed-font-size-20);
	line-height: var(--unnamed-line-spacing-27);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-707070);
}

.eyebrow,
.text-label {
	font-family: var(--unnamed-font-family-avenir-next);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-bold);
	font-size: var(--unnamed-font-size-18);
	line-height: var(--unnamed-line-spacing-25);
	letter-spacing: var(--unnamed-character-spacing-0-9);
	color: var(--unnamed-color-acc8dd);
	text-transform: var(--unnamed-text-transform-uppercase);
}

.navbar-nav .nav-link,
.main-nav a,
.text-demi {
	font-family: var(--font-avenir-medium-family);
	font-style: var(--font-avenir-medium-style);
	font-weight: var(--font-avenir-medium-weight);
	font-size: var(--unnamed-font-size-16);
	line-height: var(--unnamed-line-spacing-22);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-3c3c3b);
}

h2{
	font-family: var(--font-avenir-bold);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-bold);
	font-size: clamp(52px, 6vw, var(--unnamed-font-size-52));
	line-height: var(--unnamed-line-spacing-65);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-3c3c3b);
}


h3,
.text-h3 {
	font-family: var(--font-avenir-bold);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-bold);
	font-size: clamp(34px, 5vw, var(--unnamed-font-size-34));
	line-height: var(--unnamed-line-spacing-33);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-3c3c3b);
}

h4,
.text-h4 {
	font-family: var(--font-avenir-bold);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-bold);
	font-size: clamp(24px, 6vw, var(--unnamed-font-size-24));
	line-height: var(--unnamed-line-spacing-33);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-3c3c3b);
}

.scol-title,
.text-expertises {
	font-family: var(--unnamed-font-family-avenir-next);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-bold);
	font-size: var(--unnamed-font-size-24);
	line-height: var(--unnamed-line-spacing-33);
	letter-spacing: var(--unnamed-character-spacing-1-2);
	color: var(--unnamed-color-3c3c3b);
	text-transform: var(--unnamed-text-transform-uppercase);
}

.font-freight {
	font-family: var(--font-freight-medium-italic-family);
	font-weight: var(--font-freight-medium-italic-weight);
	font-style: var(--font-freight-medium-italic-style);
}

.font-avenir {
	font-family: var(--font-family-avenir);
}

/* ---------- Font preset utilities ---------- */

.font-avenir-normal {
	font-family: var(--font-avenir-normal-family);
	font-weight: var(--font-avenir-normal-weight);
	font-style: var(--font-avenir-normal-style);
}

.font-avenir-medium {
	font-family: var(--font-avenir-medium-family);
	font-weight: var(--font-avenir-medium-weight);
	font-style: var(--font-avenir-medium-style);
}

.font-avenir-bold {
	font-family: var(--font-avenir-bold-family);
	font-weight: var(--font-avenir-bold-weight);
	font-style: var(--font-avenir-bold-style);
}

.font-avenir-normal-italic {
	font-family: var(--font-avenir-normal-italic-family);
	font-weight: var(--font-avenir-normal-italic-weight);
	font-style: var(--font-avenir-normal-italic-style);
}

.font-avenir-medium-italic {
	font-family: var(--font-avenir-medium-italic-family);
	font-weight: var(--font-avenir-medium-italic-weight);
	font-style: var(--font-avenir-medium-italic-style);
}

.font-avenir-bold-italic {
	font-family: var(--font-avenir-bold-italic-family);
	font-weight: var(--font-avenir-bold-italic-weight);
	font-style: var(--font-avenir-bold-italic-style);
}

.font-freight-normal {
	font-family: var(--font-freight-normal-family);
	font-weight: var(--font-freight-normal-weight);
	font-style: var(--font-freight-normal-style);
}

.font-freight-medium {
	font-family: var(--font-freight-medium-family);
	font-weight: var(--font-freight-medium-weight);
	font-style: var(--font-freight-medium-style);
}

.font-freight-bold {
	font-family: var(--font-freight-bold-family);
	font-weight: var(--font-freight-bold-weight);
	font-style: var(--font-freight-bold-style);
}

.font-freight-normal-italic {
	font-family: var(--font-freight-normal-italic-family);
	font-weight: var(--font-freight-normal-italic-weight);
	font-style: var(--font-freight-normal-italic-style);
}

.font-freight-medium-italic {
	font-family: var(--font-freight-medium-italic-family);
	font-weight: var(--font-freight-medium-italic-weight);
	font-style: var(--font-freight-medium-italic-style);
}

.font-freight-bold-italic {
	font-family: var(--font-freight-bold-italic-family);
	font-weight: var(--font-freight-bold-italic-weight);
	font-style: var(--font-freight-bold-italic-style);
}

/* ---------- Font size utilities ---------- */

.fs-16 { font-size: var(--fs-16); }
.fs-18 { font-size: var(--fs-18); }
.fs-20 { font-size: var(--fs-20); }
.fs-24 { font-size: var(--fs-24); }
.fs-28 { font-size: var(--fs-28); }
.fs-52 { font-size: var(--fs-52); }
.fs-64 { font-size: var(--fs-64); }
.fs-76 { font-size: var(--fs-76); }
.fs-80 { font-size: var(--fs-80); }

/* ---------- Atomic utilities (mix & match) ---------- */

/* Line height */
.lh-22 { line-height: var(--unnamed-line-spacing-22); }
.lh-25 { line-height: var(--unnamed-line-spacing-25); }
.lh-27 { line-height: var(--unnamed-line-spacing-27); }
.lh-33 { line-height: var(--unnamed-line-spacing-33); }
.lh-60 { line-height: var(--unnamed-line-spacing-60); }
.lh-65 { line-height: var(--unnamed-line-spacing-65); }
.lh-75 { line-height: var(--unnamed-line-spacing-75); }

/* Letter spacing */
.ls-0 { letter-spacing: var(--unnamed-character-spacing-0); }
.ls-09 { letter-spacing: var(--unnamed-character-spacing-0-9); }
.ls-12 { letter-spacing: var(--unnamed-character-spacing-1-2); }
.ls-19 { letter-spacing: var(--unnamed-character-spacing-1-9); }

/* Font family */
.ff-avenir { font-family: var(--font-family-avenir); }
.ff-freight { font-family: var(--font-family-freight); }

/* Font weight */
.fw-normal { font-weight: var(--unnamed-font-weight-normal); }
.fw-medium { font-weight: var(--unnamed-font-weight-medium); }
.fw-bold { font-weight: var(--unnamed-font-weight-bold); }

/* Font style */
.fst-normal { font-style: var(--unnamed-font-style-normal); }
.fst-italic { font-style: var(--unnamed-font-style-italic); }

/* Text transform */
.tt-uppercase { text-transform: var(--unnamed-text-transform-uppercase); }
.tt-none { text-transform: none; }

/* Text color */
.c-white { color: var(--unnamed-color-ffffff); }
.c-ink { color: var(--unnamed-color-3c3c3b); }
.c-ink-alt { color: var(--unnamed-color-3c3c3c); }
.c-muted { color: var(--unnamed-color-707070); }
.c-navy { color: var(--unnamed-color-27658b); }
.c-blue { color: var(--unnamed-color-018bc3); }
.c-blue-bright { color: var(--unnamed-color-009bd9); }
.c-blue-soft { color: var(--unnamed-color-acc8dd); }
.c-beige { color: var(--unnamed-color-e3dddb); }
.c-grey { color: var(--unnamed-color-f6f4f4); }

/* button utilities */
.btn,
.btn-primary,
.navbar .btn,
.text-button {
	font-family: var(--font-avenir-medium);
	font-style: var(--unnamed-font-style-normal);
	font-weight: var(--unnamed-font-weight-medium);
	font-size: var(--unnamed-font-size-16);
	line-height: var(--unnamed-line-spacing-22);
	letter-spacing: var(--unnamed-character-spacing-0);
	color: var(--unnamed-color-3c3c3c);
	padding: 9px 24px;
}

.btn-primary{
	background: var(--unnamed-color-acc8dd);
	color: #3C3C3C;
}
.btn-primary:hover{
	background: var(--unnamed-color-018bc3);
	color: #fff;
}
.btn-primary .fa{
	color: #fff;
}

.btn .fa{
	margin-left: 50px;
	font-size: 19px
}

.btn-gray{
	background:var(--unnamed-color-e3dddb);
}
.btn-gray .fa
{
	color: var(--unnamed-color-018bc3);

}

.btn-gray:hover{
	background:var(--unnamed-color-009bd9);
	color:#fff;
}
.btn-gray:hover .fa{
	color:#fff;
}
.btn-outline .fa {
	color: #ACC8DD;
}
.btn-outline {
	border-radius: 0;
	border: 0;
	border-bottom: 2px solid #E3DDDB;
	padding-left: 0 !important;
	padding-right: 0 !important;
}
.btn-outline:hover{
	border-bottom: 2px solid #009bd9;
	color:#009bd9
}
.btn-outline:hover .fa{
	color:#009bd9
}

.mb-lg-100{
	margin-bottom: 100px;
}


.bg-gray{
	background-color: rgb(246 244 244 / 60%) ;
}


.rounded-top{
	border-radius:150px 0 0 0 !important;
}
.rounded-top-right{
	border-radius:0px 150px 0 0 !important;
}

.rounded-bottom-right{
	border-radius:0 0 150px 0 !important;
}

.rounded-bottom{
	border-radius:0px 0 0 150px !important;
}
