
/*------------------------------------------------------------------------------
    GENERAL
------------------------------------------------------------------------------*/

:root {

    /* Figma design colors */

    --brand-dark-green: #002519;
    --brand-dark-green-text: #104231;

    --brand-light-green: #28a28d;
    --brand-light-green-text: #add5cc;

    --brand-light-green-card: #e1f0ed;
    --brand-light-green-card-alt: #def1ed;

    --brand-very-light-green: #f8fffd;

    --brand-white: #ffffff;
    --brand-yellow: #f1d25e;

    /* Figma typography */

    --font-heading: 'Lora', serif;
    --font-body: 'Roboto', Arial, sans-serif;

    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-semibold: 600;

    --font-size-h1: 64px;
    --font-size-h2: 48px;
    --font-size-h3: 36px;
    --font-size-h4: 28px;
    --font-size-heading-small: 22px;

    --font-size-small: 12px;
    --font-size-label: 14px;
    --font-size-button: 16px;
    --font-size-footer: 16px;
    --font-size-nav: 18px;
    --font-size-body: 20px;

    --line-height-tight: 1;
    --line-height-snug: 1.2;
    --line-height-normal: 1.5;
    --line-height-relaxed: 1.75;
    --line-height-loose: 2;

    /* Figma layout */
    --layout-design-width: 1440px;
    --layout-container-max: 1320px;
    --layout-desktop-gutter: 60px;

    /* Figma section spacing */
    --section-gap-desktop: 180px;

    /* Component spacing */
    --card-padding: 40px;

    /* Temporary compatibility aliases */

    --brand-accent: var(--brand-dark-green-text);
    --brand-main-green: var(--brand-light-green);
    --brand-medium-turquoise: var(--brand-light-green);
    --brand-lighter-green: var(--brand-light-green-text);
}

/*------------------------------------------------------------------------------
    TYPOGRAPHY
------------------------------------------------------------------------------*/

/* H1 / page hero heading */
.fls-heading-1 {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-h1);
    line-height: var(--line-height-tight);
    letter-spacing: 0;
}

/* H2 / major section heading */
.fls-heading-2 {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-h2);
    line-height: var(--line-height-tight);
    letter-spacing: 0;
}

/* H3 / smaller section or card heading */
.fls-heading-3 {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-h3);
    line-height: var(--line-height-tight);
    letter-spacing: 0;
}

/* Small Lora headings */
.fls-heading-small {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-heading-small);
    line-height: var(--line-height-tight);
    letter-spacing: 0;
}

/* Standard body copy */
.fls-body {
    font-family: var(--font-body);
    font-weight: var(--font-weight-light);
    font-size: var(--font-size-body);
    line-height: var(--line-height-tight);
    letter-spacing: 0;
}

/* Small section label / eyebrow */
.fls-eyebrow {
    font-family: var(--font-body);
    font-weight: var(--font-weight-light);
    font-size: var(--font-size-label);
    line-height: var(--line-height-tight);
    letter-spacing: 0;

    color: var(--brand-dark-green-text);

    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-color: var(--brand-yellow);
    text-decoration-thickness: 2px;
    text-underline-offset: 8px;
}

.fls-eyebrow--light {
    color: var(--brand-light-green-text);
    text-decoration-color: var(--brand-yellow);
}

/* Header navigation */
.fls-nav-text {
    font-family: var(--font-body);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-nav);
    line-height: var(--line-height-tight);
    letter-spacing: 0;
}

/* Buttons / CTA text */
.fls-button-text {
    font-family: var(--font-body);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-button);
    line-height: var(--line-height-tight);
    letter-spacing: 0;
    text-transform: uppercase;
}

/* Footer links and small footer copy */
.fls-footer-text {
    font-family: var(--font-body);
    font-weight: var(--font-weight-light);
    font-size: var(--font-size-footer);
    line-height: var(--line-height-tight);
    letter-spacing: 0;
}

/*------------------------------------------------------------------------------
    BUTTONS
------------------------------------------------------------------------------*/

.fls-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: fit-content;
    padding: 10px 26px;
    border: 1px solid transparent;
    border-radius: 4px;
    background: var(--brand-light-green);
    color: var(--brand-white) !important;
    font-family: var(--font-body);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-button);
    line-height: var(--line-height-tight);
    letter-spacing: 0;
    text-transform: uppercase;
    text-decoration: none !important;
    white-space: nowrap;
    cursor: pointer;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease;
}

/* Standard light-green button ------------*/

.fls-button:hover {
    border-color: var(--brand-light-green);
    background: var(--brand-white);
    color: var(--brand-dark-green-text) !important;
    text-decoration: none !important;
}

/* Dark button ----------------------------*/

.fls-button--dark {
    background: var(--brand-dark-green-text);
    color: var(--brand-white) !important;
}

.fls-button--dark:hover {
    background: var(--brand-light-green);
    color: var(--brand-white) !important;
}

/* Outline button -------------------------*/

.fls-button.fls-button--outline {
    border-color: var(--brand-light-green) !important;
    background: transparent !important;
    color: var(--brand-light-green) !important;
    text-decoration: none !important;
}

.fls-button.fls-button--outline:hover {
    border-color: var(--brand-light-green) !important;
    background: var(--brand-light-green) !important;
    color: var(--brand-white) !important;
    text-decoration: none !important;
}

/* Keyboard focus -------------------------*/

.fls-button:focus-visible {
    outline: 2px solid var(--brand-dark-green-text);
    outline-offset: 3px;
}

/*------------------------------------------------------------------------------
    LAYOUT
------------------------------------------------------------------------------*/

.fls-container {
    width: calc(100% - (2 * var(--layout-desktop-gutter)));
    max-width: var(--layout-container-max);
    margin-left: auto;
    margin-right: auto;
}

.fls-section {
    width: 100%;
    position: relative;
}

/*------------------------------------------------------------------------------
    SPLIT SECTION
------------------------------------------------------------------------------*/

.fls-split-section {
    box-sizing: border-box;
    width: calc(100% - (2 * var(--layout-desktop-gutter)));
    max-width: var(--layout-container-max);
    margin-left: auto;
    margin-right: auto;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.fls-split-section__copy {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.fls-split-section__content {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.fls-split-section__media {
    flex: 0 1 650px;
    width: min(49.25%, 650px);
}

.fls-split-section__media img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 650 / 407;
    object-fit: cover;
    border-radius: 4px;
}

/* Mission split section */

.fls-split-section--mission .fls-split-section__copy {
    flex: 0 1 626px;
    width: min(47.42%, 626px);
}

.fls-split-section--mission .fls-split-section__content {
    flex: 0 0 458px;
    width: 458px;
}

/* Expertise split section */

.fls-split-section--expertise .fls-split-section__copy {
    flex: 0 0 650px;
    width: 650px;
}

.fls-split-section--expertise .fls-split-section__content {
    flex: 0 0 484px;
    width: 484px;
}

.padding-row-sm {padding: 24px 0;}
.padding-row-md {padding: 48px 0;}
.padding-row-lg {padding: 96px 0;}
.padding-row-xl {padding: 144px 0;}

#main {padding: 0;}

/*------------------------------------------------------------------------------
    GLOBAL TYPOGRAPHY DEFAULTS
------------------------------------------------------------------------------*/

/* Headings */
h1,
.h1 {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-h1);
    line-height: var(--line-height-tight);
    letter-spacing: 0;
}

h2,
.h2 {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-h2);
    line-height: var(--line-height-tight);
    letter-spacing: 0;
}

h3,
.h3 {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-h3);
    line-height: var(--line-height-tight);
    letter-spacing: 0;
}

/* Default body copy */
body {
    font-family: var(--font-body);
    font-weight: var(--font-weight-light);
    color: var(--brand-dark-green-text);
}

p {
    font-family: var(--font-body);
    font-weight: var(--font-weight-light);
    font-size: var(--font-size-body);
    line-height: var(--line-height-tight);
    letter-spacing: 0;
}

/* Lists inherit the surrounding typography */
ul,
ol,
li {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

/* Emphasis */
strong,
b {
    font-family: inherit;
    font-weight: var(--font-weight-semibold);
}


.btn-round-corner a {border-radius: 8px !important;}
.img-round-corner img {border-radius: 12px;}
.col-round-corner .vc_column-inner {border-radius: 16px;}
.title-size {font-size: 56px; line-height: 64px;}
.txt-green {color: var(--brand-dark-green);}

.inner-page-main-title h1 {font-size: calc(32px + 2vw) !important; line-height: 1.1 !important; color: #ffffff;}
.inner-page-main-title h1::after {
    content: '';
    width: 160%;
    height: 2px;
    background-color: var(--brand-yellow);
    display: block;
    position: absolute;
    margin-top: 24px;
    left: -600px;
}
.inner-page-main-title p {font-size: 24px !important; line-height: 36px !important; color: #ffffff !important;}

/*----------------------------------------------------------------------------*/

