/*!******************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./node_modules/sass-bulk-import-loader/index.js!./web/assets/src/scss/main.scss ***!
  \******************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
/* =========================================================================  */
/* Config */
/* =========================================================================  */
/* =========================================================================  */
/* Imports */
/* =========================================================================  */
/**
 * Settings.
 */
/* =========================================================================  */
/* App variables */
/* =========================================================================  */
/**
* Characters to escape from SVGs
* Source: https://github.com/Threespot/frontline-sass/blob/master/src/functions/_inline-svg.scss
*/
/**
* SVG icon map to be used with the `svg` function
*/
/* =========================================================================  */
/* Neutral colors */
/* =========================================================================  */
/**
 * Shades of grey, from the darkest to the lightest.
 */
/* =========================================================================  */
/* Colors */
/* =========================================================================  */
/* =========================================================================  */
/* Maths */
/* =========================================================================  */
/**
 * Returns a given list with each value multiplied by the given multiplier,
 * and optionnally adjusts the result of each multiplication with
 * the given margin.
 *
 * @param {List} $values - a list of numbers.
 * @param {Int} $multiplier - the multiplier.
 * @param {Int} $margin - A positive/negative number (optional).
 */
/**
 * Returns the value to be set as spacing for the inner element to be positioned
 * where we want it when contained in a wider, touch-friendly area.
 *
 * E.g. for an icon of 16x16, we want the user to be able to tap it easily, so
 * the outer `a` element is set to a width of 44px. We want the icon to be
 * positioned 20px from the viewport edge. The function will return the right
 * value to be set as X position for the `a`, in that case 6px.
 *
 * @param {String} $el-length - the width/height of the visible element.
 * @param {String} - $el-to-edge-distance — the distance between the element
 *     and the edge of the closest positioned parent.
 * @param {String} - $touch-area-length - the width/height of the
 *     touch area (optional).
 */
/* =========================================================================  */
/* List helpers */
/* =========================================================================  */
/**
 * Returns the first element of a given list.
 *
 * @param {List} $list - a list.
 */
/**
 * Returns the last element of a given list.
 *
 * @param {List} $list - a list.
 */
/**
 * Transforms a list into a map, matching a given list of keys
 * with a given list of values.
 *
 * @param {List} $keys-list - a list of keys for the map.
 * @param {List} $values-list - a list of values for the map.
 */
/* =========================================================================  */
/* Units */
/* =========================================================================  */
/**
 * Returns a rem-based value from a px-based input.
 *
 * @param {String} $px-value - eg. 16px.
 * @param {String} $base-font-size - eg. 16px (optional).
 *
 * @requires @function `base-font-size`.
 */
/**
 * Returns an em-based value from a px-based input.
 *
 * @param {String} $px-value - eg. 16px.
 * @param {String} $base-font-size - eg. 16px (optional).
 *
 * @requires @function `base-font-size`.
 */
/* =========================================================================  */
/* Typography */
/* =========================================================================  */
/**
 * Returns the font size defined for the given font map key
 * before any breakpoint kicks in.
 *
 * @param {String} $font-map-key - the key for the target font map in $fonts.
 *
 * @requires @variable $fonts.
 *
 * 1. Get the font map for the given key.
 * 2. Get the font size map.
 * 3. Return the font size using the base
 *    font size.
 */
/**
 * Returns the font size defined for the given font map key
 * at the given breakpoint.
 *
 * @param {String} $font-map-key - the key for the target font map in $fonts.
 * @param {String} $breakpoint - a breakpoint in
 *     $layouts-break-point (optional).
 *
 * @requires @variable $fonts.
 *
 * 1. Get the font map for the given key.
 * 2. Get the font size map.
 * 3. Return the font size using provided breakpoint.
 */
/**
 * Returns the line height defined for the given font map key
 * before any breakpoint kicks in.
 *
 * @param {String} $font-map-key - the key for the target font map in $fonts.
 *
 * @requires @variable $fonts.
 *
 * 1. Get the font map for the given key.
 * 2. Get the line-height map.
 * 3. Return the line height using the base
 *    font size.
 */
/**
 * Returns an em-based value from a unitless value.
 *
 * @param {Int} $unitless-number - a letter spacing value
 *     gotten from a design app.
 */
/* =========================================================================  */
/* Layout */
/* =========================================================================  */
/**
 * Returns a `calc()` that spans the width of a given number of columns.
 * Useful when styling an element that is already inside a column.
 *
 * @param {Int} $cols-wanted - the number of columns that we want.
 * @param {Int} $cols-parent - the number of columns the element sits in.
 * @param {String} $breakpoint - the breakpoint at which function is called.
 *
 * Example
 * To span 4 columns in a 10 columns container at breakpoint `l`:
 * `width: columns-calc(4, 10, 'l');`
 */
/* =========================================================================  */
/* Testing */
/* =========================================================================  */
/* =========================================================================  */
/* SVG */
/* =========================================================================  */
/**
 * URL-encode SVG code
 */
/**
 * Helper to get URL-escaped inline SVG code for use with `background-image`
 */
/* =========================================================================  */
/* Grid */
/* =========================================================================  */
/**
 * @function `grid`.
 * @param {int} columns (required)
 * @param {string} expand (optional) - Possible values: 'narrow', 'wide', 'wider'
 * @param {int} parentColumns (optional)
 *
 * @example: `width: grid(4, wide, 8);`
 * You may want to use the mixin `@include grid-helper` in order to have a visual
 * rendering of the grid.
 */
/* =========================================================================  */
/* Spacings */
/* =========================================================================  */
/**
 * Spacings used by the custom properties (and the mixin `spacing`).
 */
/* =========================================================================  */
/* Wrapper */
/* =========================================================================  */
/* =========================================================================  */
/* Easings */
/* =========================================================================  */
/* =========================================================================  */
/* Durations */
/* =========================================================================  */
/* =========================================================================  */
/* Transitions */
/* =========================================================================  */
/* =========================================================================  */
/* Enablers to keep the default footprint low */
/* =========================================================================  */
/**
 * Image modifiers.
 */
/**
 * Helpers.
 */
/* =========================================================================  */
/* Typography */
/* =========================================================================  */
/* =========================================================================  */
/* Classes */
/* =========================================================================  */
/* =========================================================================  */
/* Values */
/* =========================================================================  */
/**
 * Underline.
 */
/**
 * Video.
 */
/* =========================================================================  */
/* Font Stacks */
/* =========================================================================  */
/**
 * Fonts
 */
/**
 * Main font detection.
 */
/* =========================================================================  */
/* Font weights */
/* =========================================================================  */
/* =========================================================================  */
/* Font maps */
/* =========================================================================  */
/* =========================================================================  */
/* App layers */
/* =========================================================================  */
/* =========================================================================  */
/* Shadows */
/* =========================================================================  */
/* =========================================================================  */
/* Transparency */
/* =========================================================================  */
/* =========================================================================  */
/* Resets */
/* =========================================================================  */
/**
 * Fixes VoiceOver not announcing list properly
 * due to `list-style: none`.
 * See:
 * https://unfetteredthoughts.net/2017/09/26/voiceover-and-list-style-type-none/
 *
 * @param {String} $item-selector - List item selector, either of as a class
 *        (results in nesting) or referrencing the element (E) of
 *        the B__E--M  notation. (optional)
 *
 * 1. Prevents any visual issue on load.
 */
/**
 * Resets list styles.
 *
 * @requires @mixin `list-reset-voiceover-fix`
 *
 * @param {String} $item-selector - List item selector, either of as a class
 *        (results in nesting) or referrencing the element (E) of
 *        the B__E--M  notation. (optional)
 */
/**
 * Resets button styles for a common cross-browser base.
 */
/**
 * Resets input styles for a common cross-browser base.
 */
/* =========================================================================  */
/* Layout */
/* =========================================================================  */
/**
 * Wraps the bracketed @content into a media query matching
 * the given breakpoint key.
 *
 * @param {String} $from - the min-width breakpoint.
 * @param {String} $to - the max-width breakpoint (optional).
 *
 * @requires @variable $layouts-name.
 * @requires @variable $layouts-break-point.
 */
/**
 * Clears floating children elements.
 */
/* =========================================================================  */
/* Breakpoint loops */
/* =========================================================================  */
/**
 * For a given property, outputs the value for a given list of values matching
 * (binding on index) the $layouts-break-point list.
 *
 * @requires @mixin `media-query`.
 * @requries @variable $layouts-name.
 *
 * @requires mixin `media-query`.
 * @requires @variable $layouts-name.
 */
/* =========================================================================  */
/* Typography */
/* =========================================================================  */
/**
 * Outputs the font-family rule with the fallbak to start with and the webfont
 * once loaded.
 *
 * @param {String} $type - the type of font.
 *
 * @requires @variable $sans-serif-fallback
 * @requires @variable $sans-serif
 * @requires @variable $sans-serif-fallback
 * @requires @variable $sans-serif
 */
/**
 * Outputs all properties and values for each breakpoint in a given font map.
 *
 * @param {String} $font-map-key - the key to a font map in $fonts.
 *
 * @requires @mixin `responsive`.
 * @requires @variable $fonts.
 */
/**
 * Outputs font size for each breakpoint in a given font map.
 *
 * @param {String} $font-map-key - the key to a font map in $fonts.
 *
 * @requires @mixin `responsive`.
 * @requires @variable $fonts.
 *
 * 1. Get the font map.
 * 2. Get the font size map.
 * 3. Run the responsive mixin with `font-size`
 *    as property and ``$fs-responsive-map` as map.
 */
/**
 * Outputs a font property value from a given property and breakpoint
 * e.g. : margin: font-property-value('body-sans', 'line-height', 'main');
 *
 * @param {String} $font-map-key - the key to a font map in $fonts.
 * @param {String} $property - the property needed (font-size or line-height).
 * @param {String} $breakpoint - a breakpoint in $layouts-break-point.
 *
 * @requires @variable $fonts.
 *
 * 1. Get the font map.
 * 2. Get the property map.
 * 3. Return the value at a specific breakpoint
 */
/**
 * Outputs all properties for a given font map at a specific breakpoint.
 *
 * @param {String} $font-map-key - the key to a font map in $fonts.
 * @param {String} $breakpoint - a breakpoint in $layouts-break-point.
 *
 * @requires @mixin `responsive`.
 * @requires @mixin `font-family`.
 * @requires @variable $fonts.
 * @requires @variable $layouts-break-point.
 */
/* =========================================================================  */
/* Visibility */
/* =========================================================================  */
/**
 * Hide only visually, but have it available for screen readers:
 * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 *
 * 1. For long content, line feeds are not interpreted as spaces and small width
 *    causes content to wrap 1 word per line:
 *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 * 2. Extends the  class to allow the element to be focusable when navigated
 *    to via the keyboard: https://www.drupal.org/node/897638
 */
/**
 * Reverts visibility of visually hidden element.
 */
/* =========================================================================  */
/* Interactivity */
/* =========================================================================  */
/**
 * @mixin `interaction`
 *
 * Outputs bracketed @content as focus state, as well as
 * breakpoint-based hover state.
 *
 * @param {map} $config
 *    @property {string} altering-element - a CSS selector for the element
 *        that will inherit the rules, space-prefixed if not pseudo-element.
 *    @property {bool} remove-outline - whether to remove the outline or not.
 *
 * @requires mixin `media-query`.
 * @requires @variable $layouts-break-point.
 */
/**
 * Expands the target area of the inner link to the boundaries
 * of the current CSS selector.
 *
 * @param {map} $config
 *    @property {string} link-selector - a CSS selector for the inner link (optional).
 *    @property {string} pseudo-element - `before` or `after` (optional).
 *    @property {int} z-ghost-link - the z-index to apply to the pseudo element (optional).
 */
/* =========================================================================  */
/* Decoration */
/* =========================================================================  */
/**
 * Prevents jump when underline is applied on interaction by presetting the
 * bottom padding.
 *
 * @requires global @variable $underline-bottom-padding.
 */
/**
 * Underlines text using the background-image technique.
 *
 * @param {map} $config
 *     @property {bool} keep-padding - Set to true to keep previously defined bottom padding. (optional)
 *     @property {string} y-pos - the position of the underline on the Y axis only if $keep-padding is true (optional).
 *     @property {string} display - the type of CSS display (optional).
 *     @property {string} color - the color of the underline (optional).
 *     @property {string} padding-bottom - the padding added to the bottom of the text string (optional).
 *
 * @requires global @variable $underline-bottom-padding.
 * @requires global @variable $underline-thickness.
 */
/**
 * Sets the color of the underline.
 *
 * @param {String} $color - the color of the underline.
 */
/**
 * Sets the position of the underline on the Y axis.
 *
 * @param {String} $y-pos - the position of the underline on the Y axis.
 */
/* =========================================================================  */
/* Spacings */
/* =========================================================================  */
/**
 * Define a margin using the predefined margins
 *
 * @param {String} $value - The value of the margin selected
 * @param {String} $property - List item selector, either of as a class
 */
/* =========================================================================  */
/* Grid */
/* =========================================================================  */
/**
 * @mixin `grid-helper`
 * @param {string} pseudo (optional) - Possible values: 'before', 'after'
 *
 * Renders visually the grid function on the element.
 */
/* =========================================================================  */
/* Shared element styles */
/* =========================================================================  */
/**
 * Vendors.
 */
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type=checkbox],
[type=radio] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type=search] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none;
}

/**
 * Base.
 */
/* =========================================================================  */
/* Base styles */
/* =========================================================================  */
/**
 * 1. Cross-OS-friendly font stack (during FOUT).
 */
html {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-y: scroll;
  color: #515151;
}

html.is-smooth {
  scroll-behavior: smooth;
}

*, *:before, *:after {
  box-sizing: inherit;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
  margin: 0;
}

p {
  margin: 0;
}

/**
 * 1. Make sure long email addresses break on small screens.
 */
a {
  color: inherit;
  text-decoration: none;
  word-wrap: break-word; /* [1] */
}

em, i {
  font-style: italic;
}

abbr,
abbr[title] {
  text-decoration: none;
  cursor: inherit;
}

small {
  font-size: 100%;
}

img {
  max-width: 100%;
  vertical-align: top;
}

address {
  font-style: normal;
}

/* =========================================================================  */
/* Form elements */
/* =========================================================================  */
fieldset {
  padding: 0;
  margin: 0;
  border: none;
}

figure {
  margin: 0;
}

/**
 * 1. Project-specific styles.
 */
button {
  -webkit-appearance: none !important;
     -moz-appearance: none !important;
          appearance: none !important;
  background-color: transparent;
  border: none;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  text-decoration: none;
  color: inherit;
  font: inherit;
  cursor: pointer;
  /* [1] */
}

/* =========================================================================  */
/* State-specific */
/* =========================================================================  */
/**
 * Disabled the scroll within the page.
 */
html.js[data-locked=true] {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

html.js[data-locked=true] body,
html.js[data-locked=true] .u-fixed {
  padding-right: var(--sb) !important;
}

/* =========================================================================  */
/* Accessibility */
/* =========================================================================  */
/**
 * 1. When the user doesn’t use the keyboard, let’s remove the focus ring.
 * 2. For accessibility reasons, we sometimes need to focus an item
 *    with `tabindex="-1"`. Thus, voiceover reads the content, yet we don’t
 *    need the focus ring here.
 */
html[data-whatintent]:not([data-whatintent=keyboard]) *:focus,
[tabindex="-1"]:focus {
  outline: none;
}

[hidden] {
  display: none !important;
}

/* =========================================================================  */
/* Custom properties */
/* =========================================================================  */
:root {
  --vh: 1vh;
  --margin-s: 1.8rem;
  --margin-m: 2.2rem;
  --margin-l: 4.4rem;
  --margin-xl: 8.8rem;
}
@media only screen and (min-width: 44em) {
  :root {
    --margin-s: 2.2rem;
    --margin-m: 4.4rem;
    --margin-l: 8.8rem;
    --margin-xl: 13.6rem;
  }
}

/* =========================================================================  */
/* Root elements layout */
/* =========================================================================  */
/* =========================================================================  */
/* Base typography */
/* =========================================================================  */
/**
 * 1. Prevents IE and Edge to compile it, as they don’t manage well `calc(62.5%)`.
 */
html {
  font-size: 62.5%;
}
@supports (background-blend-mode: multiply) {
  html { /* [1] */ }
}

body {
  font-family: "Noto Sans", Helvetica, Arial, sans-serif;
  font-size: 1.3rem;
  line-height: 1.9230769231;
}
@media only screen and (min-width: 60em) {
  body {
    font-size: 1.3rem;
    line-height: 1.6923076923;
  }
}

/* =========================================================================  */
/* Webfonts */
/* =========================================================================  */
@font-face {
  font-family: "Noto Sans";
  src: url(23e70cfbbe0783c66804.ttf) format("truetype");
  font-display: swap;
  font-weight: 800;
}
@font-face {
  font-family: "Noto Sans";
  src: url(a4c42b7a92bf0fdb8ec1.ttf) format("truetype");
  font-display: swap;
  font-weight: 700;
}
@font-face {
  font-family: "Noto Sans";
  src: url(eae34fa8f1e0c4c6d797.ttf) format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "Noto Sans";
  src: url(99df72e26c72877cb1f9.ttf) format("truetype");
  font-display: swap;
  font-weight: 600;
}
/**
 * Plugins.
 */
/**
 * Layous
 */
.l-center {
  text-align: center;
}

/* =========================================================================  */
/* Wrapper */
/* =========================================================================  */
/**
 * 1. Firefox
 * 2. Apple
 */
.l-wrapper {
  padding-left: 3rem;
  padding-right: 3rem;
}
@media only screen and (min-width: 44em) {
  .l-wrapper {
    padding-left: 4.8rem;
    padding-right: 4.8rem;
  }
}
@media only screen and (min-width: 1300px) {
  .l-wrapper {
    padding-left: calc((100% - 120rem) / 2);
    padding-right: calc((100% - 120rem) / 2);
  }
}

.l-wrapper-contained {
  padding-left: 3rem;
  padding-right: 3rem;
}
@media only screen and (min-width: 44em) {
  .l-wrapper-contained {
    padding-left: 4.8rem;
    padding-right: 4.8rem;
  }
}
@media only screen and (min-width: 1300px) {
  .l-wrapper-contained {
    max-width: 120rem;
    margin-left: auto;
    margin-right: auto;
  }
}

/**
 * Objects.
 */
.o-btn {
  border: 1px solid #FFFFFF;
  padding: 0.8rem 4rem 0.8rem 2.5rem;
  position: relative;
  display: inline-block;
  transition: 0.15s ease-out;
  font-size: 1.3rem;
  font-weight: 400;
  line-height: 2.6rem;
  letter-spacing: 0.01em;
}
.o-btn:after {
  content: url("data:image/svg+xml, %3Csvg%20width=%277%27%20height=%2712%27%20xmlns=%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cpath%20d=%27M6.11%205.958a.588.588%200%200%200-.17-.367L1.157.703A.663.663%200%200%200%20.951.56a.71.71%200%200%200-.73.097.618.618%200%200%200-.156.19.573.573%200%200%200%20.105.673L4.553%206%20.17%2010.48a.583.583%200%200%200-.17.441c.01.162.09.314.22.422a.7.7%200%200%200%20.48.156.688.688%200%200%200%20.458-.202L5.94%206.41a.603.603%200%200%200%20.135-.21.566.566%200%200%200%20.036-.241Z%27%20fill=%27%23fff%27%2F%3E%3C%2Fsvg%3E");
  position: absolute;
  top: 50%;
  right: 2.4rem;
  margin-top: -1.2rem;
}

.o-btn:focus,
.o-btn:hover {
  color: #025E3F;
  background: #FFFFFF;
}
.o-btn:focus:after,
.o-btn:hover:after {
  content: url("data:image/svg+xml, %3Csvg%20width=%277%27%20height=%2712%27%20xmlns=%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cpath%20d=%27M6.11%205.958a.588.588%200%200%200-.17-.367L1.157.703A.663.663%200%200%200%20.951.56a.71.71%200%200%200-.73.097.618.618%200%200%200-.156.19.573.573%200%200%200%20.105.673L4.553%206%20.17%2010.48a.583.583%200%200%200-.17.441c.01.162.09.314.22.422a.7.7%200%200%200%20.48.156.688.688%200%200%200%20.458-.202L5.94%206.41a.603.603%200%200%200%20.135-.21.566.566%200%200%200%20.036-.241Z%27%20fill=%27%23025E3F%27%2F%3E%3C%2Fsvg%3E");
}

.c-nav.is-sticky .o-btn:focus,
.c-nav.is-sticky .o-btn:hover {
  color: #FFFFFF;
  background: #17C183;
}
.c-nav.is-sticky .o-btn:focus:after,
.c-nav.is-sticky .o-btn:hover:after {
  content: url("data:image/svg+xml, %3Csvg%20width=%277%27%20height=%2712%27%20xmlns=%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cpath%20d=%27M6.11%205.958a.588.588%200%200%200-.17-.367L1.157.703A.663.663%200%200%200%20.951.56a.71.71%200%200%200-.73.097.618.618%200%200%200-.156.19.573.573%200%200%200%20.105.673L4.553%206%20.17%2010.48a.583.583%200%200%200-.17.441c.01.162.09.314.22.422a.7.7%200%200%200%20.48.156.688.688%200%200%200%20.458-.202L5.94%206.41a.603.603%200%200%200%20.135-.21.566.566%200%200%200%20.036-.241Z%27%20fill=%27%23fff%27%2F%3E%3C%2Fsvg%3E");
}

.o-btn--green {
  border-color: #17C183;
}

.o-btn--fill {
  background: #FFFFFF;
  color: #025E3F;
  border: none;
}
.o-btn--fill:after {
  content: url("data:image/svg+xml, %3Csvg%20width=%277%27%20height=%2712%27%20xmlns=%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cpath%20d=%27M6.11%205.958a.588.588%200%200%200-.17-.367L1.157.703A.663.663%200%200%200%20.951.56a.71.71%200%200%200-.73.097.618.618%200%200%200-.156.19.573.573%200%200%200%20.105.673L4.553%206%20.17%2010.48a.583.583%200%200%200-.17.441c.01.162.09.314.22.422a.7.7%200%200%200%20.48.156.688.688%200%200%200%20.458-.202L5.94%206.41a.603.603%200%200%200%20.135-.21.566.566%200%200%200%20.036-.241Z%27%20fill=%27%23025E3F%27%2F%3E%3C%2Fsvg%3E");
}

.o-btn--fill:focus,
.o-btn--fill:hover {
  color: #FFFFFF;
  background: #025E3F;
}
.o-btn--fill:focus:after,
.o-btn--fill:hover:after {
  content: url("data:image/svg+xml, %3Csvg%20width=%277%27%20height=%2712%27%20xmlns=%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cpath%20d=%27M6.11%205.958a.588.588%200%200%200-.17-.367L1.157.703A.663.663%200%200%200%20.951.56a.71.71%200%200%200-.73.097.618.618%200%200%200-.156.19.573.573%200%200%200%20.105.673L4.553%206%20.17%2010.48a.583.583%200%200%200-.17.441c.01.162.09.314.22.422a.7.7%200%200%200%20.48.156.688.688%200%200%200%20.458-.202L5.94%206.41a.603.603%200%200%200%20.135-.21.566.566%200%200%200%20.036-.241Z%27%20fill=%27%23fff%27%2F%3E%3C%2Fsvg%3E");
}

.o-btn--fill-green {
  background: #17C183;
  color: #FFFFFF;
  border: none;
}
.o-btn--fill-green:after {
  content: url("data:image/svg+xml, %3Csvg%20width=%277%27%20height=%2712%27%20xmlns=%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cpath%20d=%27M6.11%205.958a.588.588%200%200%200-.17-.367L1.157.703A.663.663%200%200%200%20.951.56a.71.71%200%200%200-.73.097.618.618%200%200%200-.156.19.573.573%200%200%200%20.105.673L4.553%206%20.17%2010.48a.583.583%200%200%200-.17.441c.01.162.09.314.22.422a.7.7%200%200%200%20.48.156.688.688%200%200%200%20.458-.202L5.94%206.41a.603.603%200%200%200%20.135-.21.566.566%200%200%200%20.036-.241Z%27%20fill=%27%23fff%27%2F%3E%3C%2Fsvg%3E");
}

.o-btn--fill-green:focus,
.o-btn--fill-green:hover {
  background: #025E3F;
}

.o-image,
.o-image img {
  display: inline-block;
  width: 100%;
  height: auto;
}

/**
 * Hide the image following the noscript tag holding the image fallback if there is not javascript
 */
html:not(.js) noscript + .o-image {
  display: none;
}

/**
 * If JS is available, don't show the image contained in the noscript tag.
 */
.js noscript .o-image {
  display: none;
}

/* =========================================================================  */
/* Modifier: fit */
/* =========================================================================  */
/* =========================================================================  */
/* Modifier: fit in square */
/* =========================================================================  */
.o-list {
  margin: 0;
  padding-left: 0;
  list-style: none;
}
.o-list > li:before {
  content: "​";
  position: absolute; /* [1] */
  opacity: 0; /* [1] */
}

.o-rich-text p,
.o-rich-text h2,
.o-rich-text h3,
.o-rich-text ul,
.o-rich-text ol {
  margin-top: 2.4rem;
}

/* =========================================================================  */
/* Lists */
/* =========================================================================  */
.o-rich-text ul ul,
.o-rich-text ul ol,
.o-rich-text ol ol,
.o-rich-text ol ul {
  margin-top: 0;
}

.o-rich-text ul,
.o-rich-text ol {
  list-style-position: inside;
  list-style: none;
  padding: 0;
  margin-bottom: 0;
}

.o-rich-text li {
  margin-left: 2.4rem;
  position: relative;
}

.o-rich-text ul li::before,
.o-rich-text ol li::before {
  display: inline-block;
  position: absolute;
  left: -0.8rem;
  -webkit-transform: translateX(-100%);
          transform: translateX(-100%);
}

.o-rich-text ul li::before {
  content: "•";
}

.o-rich-text ol {
  counter-reset: li-number;
}

.o-rich-text ol li::before {
  content: counter(li-number) ".";
  counter-increment: li-number;
}

.o-rich-text ol ol {
  counter-reset: li-char;
}

.o-rich-text ol ol li::before {
  content: counter(li-char, lower-alpha) ".";
  counter-increment: li-char;
}

/* =========================================================================  */
/* Links */
/* =========================================================================  */
.o-rich-text a {
  display: inline-block;
  background-image: linear-gradient(to bottom, currentColor, currentColor);
  background-size: 100% 1px;
  background-origin: content-box;
  background-repeat: no-repeat;
  background-position: 0 100%;
  display: inline;
}

/* =========================================================================  */
/* Not modifier: in flow */
/* =========================================================================  */
/**
 * 1. We never use a margin-top by default. The first margin should be specified
 *    by the type of tags (h2, p, ul,...).
 */
.o-rich-text:not(.o-rich-text--in-flow) > *:first-child { /* [1] */
  margin-top: 0;
}

/* =========================================================================  */
/* Exceptions */
/* =========================================================================  */
.o-rich-text--legals {
  font-size: 1.3rem;
  line-height: 1.9230769231;
  letter-spacing: 0.01em;
}
@media only screen and (min-width: 60em) {
  .o-rich-text--legals {
    font-size: 1.6rem;
    line-height: 1.875;
    font-weight: 700;
  }
}

.o-rich-text--legals h3 {
  font-weight: 800;
}

/* =========================================================================  */
/* Skip link */
/* =========================================================================  */
/**
 * 1. Fallback IE.
 */
.o-skip-link {
  padding: 1.2rem 1.6rem;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transform: translateX(-100%);
          transform: translateX(-100%); /* [1] */
  -webkit-transform: translateX(calc(-100% - 1rem));
          transform: translateX(calc(-100% - 1rem));
  text-align: center;
  background: #FFFFFF;
  border: 1px solid #000000;
  z-index: 100;
}

.o-skip-link:focus {
  -webkit-transform: translateX(0);
          transform: translateX(0);
}

.o-f-h0 {
  font-size: 2.4rem;
  line-height: 1.25;
  font-weight: 600;
}
@media only screen and (min-width: 60em) {
  .o-f-h0 {
    font-size: 4rem;
    line-height: 1.25;
  }
}

.o-f-h1 {
  font-size: 2.4rem;
  line-height: 1.25;
  font-weight: 600;
}
@media only screen and (min-width: 60em) {
  .o-f-h1 {
    font-size: 3rem;
    line-height: 1.2666666667;
  }
}

.o-f-h2 {
  font-size: 2rem;
  line-height: 1.5;
  font-weight: 600;
}
@media only screen and (min-width: 60em) {
  .o-f-h2 {
    font-size: 2.4rem;
    line-height: 1.5;
  }
}

.o-f-h3 {
  font-size: 2rem;
  line-height: 1.5;
  font-weight: 600;
}
@media only screen and (min-width: 60em) {
  .o-f-h3 {
    font-size: 1.6rem;
    line-height: 1.5;
    font-weight: 800;
  }
}

.o-f-intro {
  font-size: 1.3rem;
  line-height: 1.9230769231;
  letter-spacing: 0.01em;
}
@media only screen and (min-width: 60em) {
  .o-f-intro {
    font-size: 1.6rem;
    line-height: 1.875;
    font-weight: 700;
  }
}

/**
 * Groups
 */
.g-audience {
  padding-bottom: 4rem;
  padding-top: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-audience {
    padding-bottom: 10rem;
    padding-top: 10rem;
  }
}

.g-audience.u-bg-light-green {
  padding-bottom: 0;
}

@media only screen and (min-width: 60em) {
  .g-audience__header {
    display: flex;
  }
}

@media only screen and (min-width: 60em) {
  .g-audience__content {
    width: 34.3333333333%;
    margin-left: 8.5833333333%;
  }
}

.g-audience__services {
  margin-top: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-audience__services {
    margin-top: 0;
    width: 42.9166666667%;
    margin-left: 5.5833333333%;
  }
}

.g-audience__services-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 2rem;
  grid-row-gap: 3rem;
}
@media only screen and (min-width: 60em) {
  .g-audience__services-list {
    grid-column-gap: 4rem;
  }
}

.g-audience__intro {
  margin-top: 0.5rem;
}
@media only screen and (min-width: 60em) {
  .g-audience__intro {
    margin-top: 1.5rem;
  }
}

.g-audience__service-item {
  padding-bottom: 1.7rem;
  border-bottom: 2px solid #17C183;
}
.g-audience__service-item--extra {
  color: #17C183;
}

.g-audience__cover {
  padding-bottom: 4rem;
  padding-top: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-audience__cover {
    padding-bottom: 10rem;
    padding-top: 10rem;
  }
}

@media only screen and (max-width: 59.99em) {
  .g-audience__cover-split {
    padding-top: 4rem;
  }
  .g-audience__cover-split > img:not(:first-of-type) {
    display: none;
  }
}
@media only screen and (min-width: 60em) {
  .g-audience__cover-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 2rem;
    padding-top: 10rem;
  }
}

.g-audience__text {
  margin-top: 4rem;
  margin-bottom: 4rem;
}
.g-audience__text h2 {
  margin-bottom: 0.5rem;
}
@media only screen and (min-width: 60em) {
  .g-audience__text {
    margin-top: 10rem;
    margin-bottom: 10rem;
  }
  .g-audience__text h2 {
    margin-bottom: 1.5rem;
  }
}

.g-audience__cover + .g-audience__text {
  margin-top: 0;
}

.g-audience__text-wrapper {
  scroll-margin-top: 10rem;
}
@media only screen and (min-width: 60em) {
  .g-audience__text-wrapper {
    width: 74.25%;
    margin-left: 17.1666666667%;
  }
}

.g-audience__text-wrapper + .g-audience__text-wrapper {
  margin-top: 4rem;
}

.g-audience__icons-list {
  background: #FFFFFF;
  border: 1px solid #E4E4E4;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  padding: 2rem;
}
@media only screen and (min-width: 60em) {
  .g-audience__icons-list {
    grid-template-columns: repeat(3, 1fr);
    padding: 5rem 2rem;
  }
}

.g-audience__icons-item {
  padding: 2rem 0rem;
  text-align: center;
}
.g-audience__icons-item svg {
  width: 8rem;
  margin-bottom: 1rem;
}
@media only screen and (max-width: 59.99em) {
  .g-audience__icons-item:nth-child(odd) {
    border-right: 1px solid #e4e4e4;
    padding-right: 2rem;
  }
  .g-audience__icons-item:nth-child(even) {
    padding-left: 2rem;
  }
  .g-audience__icons-item:nth-child(n+3) {
    border-top: 1px solid #e4e4e4;
    padding-bottom: 2rem;
  }
  .g-audience__icons-item:nth-child(n+2) {
    padding-top: 2rem;
  }
}
@media only screen and (min-width: 60em) {
  .g-audience__icons-item {
    padding: 5rem 1rem;
    font-size: 2rem;
    line-height: 1.5;
    font-weight: 600;
  }
}
@media only screen and (min-width: 60em) and (min-width: 60em) {
  .g-audience__icons-item {
    font-size: 1.6rem;
    line-height: 1.5;
    font-weight: 800;
  }
}
@media only screen and (min-width: 60em) {
  .g-audience__icons-item:not(:nth-child(3n+1)) {
    border-left: 1px solid #E4E4E4;
  }
}
@media only screen and (min-width: 60em) {
  .g-audience__icons-item svg {
    margin-bottom: 3rem;
    width: 16rem;
  }
}
@media only screen and (min-width: 60em) {
  .g-audience__icons-item:nth-child(n+4) {
    border-top: 1px solid #E4E4E4;
  }
}

@media only screen and (min-width: 60em) {
  .g-audience__icons-item--empty {
    display: none;
  }
}

.g-audience__icons--dark {
  background: linear-gradient(transparent calc(100% - 10rem), #025E3F calc(100% - 10rem));
}

@media only screen and (max-width: 59.99em) {
  .g-audience.u-bg-light-green .g-audience__cover {
    padding-left: 0;
    padding-right: 0;
  }
}

.g-contact {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-contact {
    width: 82.8333333333%;
    margin-left: 8.5833333333%;
    padding-top: 8rem;
    padding-bottom: 9rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: flex-start;
  }
}

.g-contact__title {
  color: #FFFFFF;
  text-align: center;
}
@media only screen and (min-width: 60em) {
  .g-contact__title {
    text-align: left;
    width: 37.84%;
    margin-right: 3.6%;
    margin-top: 10rem;
  }
}

.g-contact__form {
  margin-top: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-contact__form {
    margin-top: 0;
    width: 58.56%;
  }
}

.g-form {
  background: #FFFFFF;
  padding: 3rem;
}
@media only screen and (min-width: 60em) {
  .g-form {
    padding: 4rem;
  }
}

@media only screen and (min-width: 60em) {
  .g-form__row {
    display: flex;
    gap: 2rem;
  }
}

.g-form__row + .g-form__row {
  margin-top: 3rem;
}

.g-form__field {
  display: block;
}
@media only screen and (min-width: 60em) {
  .g-form__field {
    flex-basis: 50%;
    flex-grow: 1;
  }
}

@media only screen and (max-width: 59.99em) {
  .g-form__field + .g-form__field {
    margin-top: 3rem;
  }
}

.g-form__label {
  display: block;
  color: #025E3F;
  font-size: 1rem;
}

.g-form__input {
  width: 100%;
  color: #757575;
  border: none;
  border-bottom: 1px solid #BCBCBC;
  padding: 0.2rem 0 1rem;
}
textarea.g-form__input {
  resize: vertical;
  min-height: 9em;
  height: 9rem;
}

.g-home__intro {
  padding-top: 4rem;
  padding-bottom: 4rem;
  display: flex;
  flex-direction: column;
  background-image: linear-gradient(#17C183 calc(100% - 15rem), #FFFFFF calc(100% - 15rem));
}
@media only screen and (min-width: 44em) {
  .g-home__intro {
    padding-top: 3.4rem;
    padding-bottom: 2rem;
    flex-direction: row;
    background-image: linear-gradient(#17C183 calc(100% - 4rem), #FFFFFF calc(100% - 4rem));
  }
}
@media only screen and (min-width: 88em) {
  .g-home__intro {
    background-image: linear-gradient(#17C183 calc(100% - 8rem), #FFFFFF calc(100% - 8rem));
  }
}

.g-home__intro-cover {
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  order: 1;
  position: relative;
}
.g-home__intro-cover .o-image {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media only screen and (min-width: 44em) {
  .g-home__intro-cover {
    height: auto;
    padding-bottom: 0;
    width: calc(57.0833333333% + 4.8rem);
    margin-left: -4.8rem;
    order: 0;
  }
  .g-home__intro-cover .o-image {
    position: relative;
    height: auto;
  }
}
@media only screen and (min-width: 1300px) {
  .g-home__intro-cover {
    width: calc(57.0833333333% + (100vw - var(--sb) - 120rem) / 2);
    margin-left: calc((100vw - var(--sb) - 120rem) / -2);
  }
}

.g-home__intro-text {
  color: #FFFFFF;
  order: 0;
  padding-bottom: 4rem;
}
@media only screen and (min-width: 44em) {
  .g-home__intro-text {
    width: 39.9166666667%;
    margin-left: 3%;
    padding-top: 3rem;
    padding-bottom: 3rem;
    order: 1;
  }
}
@media only screen and (min-width: 69em) {
  .g-home__intro-text {
    width: 28.75%;
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
}
@media only screen and (min-width: 88em) {
  .g-home__intro-text {
    margin-left: 8.5833333333%;
    padding-top: 10rem;
    padding-bottom: 10rem;
  }
}

.g-home__subtitle {
  margin-top: 1rem;
}

.g-home__quote-cta {
  margin-top: 1.5rem;
}
@media only screen and (min-width: 60em) {
  .g-home__quote-cta {
    margin-top: 1rem;
  }
}

.g-home__about {
  padding-top: 4rem;
  padding-bottom: 4rem;
  color: #757575;
}
@media only screen and (min-width: 60em) {
  .g-home__about {
    padding-top: 10rem;
    padding-bottom: 10rem;
  }
}

.g-home__about-title {
  color: #025E3F;
}
@media only screen and (min-width: 60em) {
  .g-home__about-title {
    width: 65.6666666667%;
    margin-left: 17.1666666667%;
  }
}

.g-home__about-intro {
  margin-top: 0.5rem;
}
@media only screen and (min-width: 60em) {
  .g-home__about-intro {
    margin-top: 1rem;
    width: 65.6666666667%;
    margin-left: 17.1666666667%;
  }
}

.g-home__about-rule {
  border: none;
  border-top: 1px solid #BCBCBC;
  margin: 4rem 0;
}
@media only screen and (min-width: 60em) {
  .g-home__about-rule {
    width: 82.8333333333%;
    margin: 5rem 8.5833333333%;
  }
}

@media only screen and (min-width: 60em) {
  .g-home__about-blocks {
    display: flex;
  }
}

.g-home__about-block {
  flex-basis: 31.3333333333%;
}
.g-home__about-block .o-f-h3 {
  color: #025E3F;
}
.g-home__about-block .o-rich-text {
  margin-top: 0.5rem;
}
@media only screen and (min-width: 60em) {
  .g-home__about-block .o-rich-text {
    margin-top: 1rem;
  }
}

.g-home__about-block + .g-home__about-block {
  border-top: 1px solid #BCBCBC;
  margin-top: 4rem;
  padding-top: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-home__about-block + .g-home__about-block {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
    margin-left: 3%;
  }
}

.g-home__services {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-home__services {
    padding-top: 10rem;
    padding-bottom: 10rem;
  }
}

.g-home__services-title {
  color: #FFFFFF;
}
@media only screen and (min-width: 60em) {
  .g-home__services-title {
    width: 65.6666666667%;
    margin-left: 17.1666666667%;
  }
}

.g-home__services-intro {
  color: #FFFFFF;
  margin-top: 0.5rem;
  font-weight: 800;
}
@media only screen and (min-width: 60em) {
  .g-home__services-intro {
    margin-top: 1rem;
    width: 65.6666666667%;
    margin-left: 17.1666666667%;
  }
}

.g-home__services-blocks {
  margin-top: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-home__services-blocks {
    display: flex;
    width: 82.8333333333%;
    margin-left: 8.5833333333%;
    margin-top: 5rem;
  }
}

.g-home__services-block {
  padding: 3rem;
  color: #FFFFFF;
  font-weight: 800;
  border: 2px solid #025E3F;
  align-items: center;
}
.g-home__services-block svg {
  flex-shrink: 0;
  width: 6rem;
  height: auto;
}
.g-home__services-block .o-f-h3 {
  margin-bottom: 0.2rem;
}
.g-home__services-block:first-child {
  border-bottom: none;
}
@media only screen and (min-width: 60em) {
  .g-home__services-block {
    display: flex;
    width: 50%;
    border-left: none;
    padding: 3.4rem 4rem;
  }
  .g-home__services-block:first-child {
    border-bottom: 2px solid #025E3F;
    border-left: 2px solid #025E3F;
  }
}

.g-home__services-block-text {
  margin-top: 1.5rem;
}
@media only screen and (min-width: 60em) {
  .g-home__services-block-text {
    margin-top: 0rem;
    margin-left: 4rem;
  }
}

.g-home__services-cta {
  margin: 4rem auto 0;
}
@media only screen and (min-width: 60em) {
  .g-home__services-cta {
    margin: 5rem auto 0;
  }
}

.g-home__quote {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
.g-home__quote svg {
  display: block;
  width: 7rem;
  height: auto;
}
@media only screen and (min-width: 60em) {
  .g-home__quote {
    width: 65.6666666667%;
    margin-left: 17.1666666667%;
    padding-top: 10rem;
    padding-bottom: 10rem;
  }
  .g-home__quote svg {
    margin-left: auto;
    margin-right: auto;
    width: 11rem;
  }
}

.g-home__quote-text {
  margin: 2rem 0 0 0;
}
@media only screen and (min-width: 60em) {
  .g-home__quote-text {
    margin: 5rem 0 0 0;
  }
}

.g-home__quote-author {
  margin-top: 1.5rem;
  color: #17C183;
  font-weight: 600;
}
.g-home__quote-author:before {
  content: "";
  display: inline-block;
  width: 12rem;
  height: 2px;
  background: #17C183;
  vertical-align: middle;
  margin-right: 1.5rem;
}

.g-home__projects {
  margin-bottom: 4rem;
  padding-top: 4rem;
  border-top: 1px solid #BCBCBC;
  text-align: center;
}
.g-home__projects .o-f-h2 {
  max-width: 20rem;
  color: #025E3F;
  text-align: left;
}
.g-home__projects .o-btn {
  margin-top: 2rem;
  margin-left: auto;
  margin-right: auto;
}
.g-home__projects .c-card-project {
  text-align: left;
}
.g-home__projects .c-card-project + .c-card-project {
  margin-top: 2rem;
}
@media only screen and (min-width: 60em) {
  .g-home__projects {
    display: flex;
    margin-bottom: 10rem;
    border-top: none;
    text-align: left;
  }
  .g-home__projects .o-f-h2 {
    margin-top: 6rem;
    margin-left: 21.44%;
  }
  .g-home__projects .o-btn {
    margin-top: 1rem;
    margin-left: 21.44%;
  }
  .g-home__projects .c-card-project + .c-card-project {
    margin-top: 4rem;
  }
}

.g-home__projects-left {
  margin-top: 2rem;
}
@media only screen and (min-width: 60em) {
  .g-home__projects-left {
    margin-top: 0;
    width: 39.9166666667%;
    margin-left: 8.5833333333%;
    padding-top: 10rem;
  }
}

.g-home__projects-right {
  margin-top: 2rem;
}
@media only screen and (min-width: 60em) {
  .g-home__projects-right {
    margin-left: 3%;
    width: 39.9166666667%;
  }
}

.g-legals__title {
  padding-top: 3rem;
  padding-bottom: 3rem;
  text-align: center;
}
@media only screen and (min-width: 60em) {
  .g-legals__title {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
}

.g-legals__text {
  margin-top: 3rem;
  padding-bottom: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-legals__text {
    padding-bottom: 10rem;
    width: 65.6666666667%;
    margin-left: 17.1666666667%;
  }
}

.g-pictures {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-pictures {
    width: 82.8333333333%;
    margin-left: 8.5833333333%;
    padding-top: 10rem;
    padding-bottom: 10rem;
  }
}

@media only screen and (min-width: 60em) {
  .g-pictures__row:first-child {
    margin-top: 2rem;
  }
}

@media only screen and (min-width: 60em) {
  .g-pictures__list {
    display: grid;
    grid-row-gap: 4rem;
  }
}

.g-pictures__item {
  margin-top: 2rem;
  overflow: hidden;
}
.g-pictures__item img {
  transition: 0.6s ease-out;
}
.g-pictures__item:hover img {
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}
@media only screen and (min-width: 60em) {
  .g-pictures__item {
    margin-top: 0rem;
  }
}

@media only screen and (min-width: 60em) {
  .g-pictures__row--two {
    display: grid;
    grid-template-columns: 48.2% 48.2%;
    grid-column-gap: 3.6%;
    grid-row-gap: 4rem;
  }
}

@media only screen and (min-width: 60em) {
  .g-pictures--border {
    padding-top: 0;
  }
  .g-pictures--border::before {
    content: "";
    display: inline-block;
    width: 100%;
    height: 2px;
    background: #BCBCBC;
    opacity: 0.4;
    margin-bottom: 10rem;
  }
}

.g-project__title {
  background: #17C183;
  color: #FFFFFF;
  text-align: center;
  padding-top: 4rem;
  padding-bottom: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-project__title {
    padding-top: 8rem;
    padding-bottom: 8rem;
  }
}

.g-project__cover {
  background: linear-gradient(#17C183 50%, #FFFFFF 50%);
}
@media only screen and (max-width: 59.99em) {
  .g-project__cover .g-project__cover-figure {
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    position: relative;
  }
  .g-project__cover .o-image {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
}

.g-project__info {
  margin-top: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-project__info {
    margin-left: 8.5833333333%;
    width: 82.8333333333%;
    margin-top: 10rem;
    margin-bottom: 10rem;
    display: flex;
  }
}

@media only screen and (min-width: 60em) {
  .g-project__info-main {
    width: 62.16%;
  }
}

.g-project__info-title {
  max-width: 45rem;
}

.g-project__info-text {
  margin-top: 0.5rem;
}
@media only screen and (min-width: 60em) {
  .g-project__info-text {
    margin-top: 1.5rem;
  }
}

.g-project__info-side {
  background: #17C183;
  color: #FFFFFF;
  margin-top: 4rem;
  padding: 4rem 3rem 6rem;
}
.g-project__info-side .o-f-h3:not(:first-child) {
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px solid rgba(255, 255, 255, 0.3);
  margin-bottom: 0.5rem;
}
@media only screen and (min-width: 60em) {
  .g-project__info-side {
    margin-top: 0;
    width: 31.08%;
    margin-left: 6.76%;
    padding: 4rem 3rem 7rem;
  }
}

.g-projects-list {
  margin-bottom: 4rem;
  margin-top: 2.4rem;
  background: linear-gradient(#17C183 10rem, #FFFFFF 10rem);
}
@media only screen and (min-width: 60em) {
  .g-projects-list {
    margin-bottom: 10rem;
    margin-top: 4rem;
  }
}

@media only screen and (min-width: 60em) {
  .g-projects-list__list {
    display: grid;
    grid-template-columns: repeat(3, 31.3333333333%);
    grid-column-gap: 3%;
    grid-row-gap: 3rem;
  }
}

.g-projects-list__item + .g-projects-list__item {
  margin-top: 2rem;
}
@media only screen and (min-width: 60em) {
  .g-projects-list__item + .g-projects-list__item {
    margin-top: 0;
  }
}

.g-projects {
  background: #17C183;
  color: #FFFFFF;
}

.g-projects__title {
  text-align: center;
  padding-top: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-projects__title {
    padding-top: 8rem;
  }
}

.g-projects__filters {
  margin-top: 6rem;
  border-bottom: 2px solid rgba(255, 255, 255, 0.2);
}
@media only screen and (min-width: 60em) {
  .g-projects__filters {
    margin-top: 7.5em;
  }
}

.g-projects__filter {
  margin-bottom: -2px;
  display: inline-block;
}

.g-projects__filter + .g-projects__filter {
  margin-left: 3rem;
}
@media only screen and (min-width: 60em) {
  .g-projects__filter + .g-projects__filter {
    margin-left: 4rem;
  }
}

.g-projects__filter:hover,
.g-projects__filter:focus,
.g-projects__filter.is-active {
  color: #025E3F;
  border-bottom: 2px solid #025E3F;
}

.g-related-projects {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-related-projects {
    padding-top: 10rem;
    padding-bottom: 10rem;
  }
}

.g-related-projects__list {
  margin-top: 2rem;
}
@media only screen and (min-width: 60em) {
  .g-related-projects__list {
    display: flex;
    gap: 3%;
  }
}

.g-related-projects__item {
  flex-basis: 31.3333333333%;
}
@media only screen and (max-width: 59.99em) {
  .g-related-projects__item + .g-related-projects__item {
    margin-top: 2rem;
  }
}

.g-services {
  background: #17C183;
  color: #FFFFFF;
}

.g-services__title {
  text-align: center;
  padding-top: 4rem;
}
@media only screen and (min-width: 60em) {
  .g-services__title {
    padding-top: 8rem;
  }
}

.g-services__private-cover {
  background: linear-gradient(#17C183 50%, #FFFFFF 50%);
  padding-top: 8rem;
}
@media only screen and (max-width: 59.99em) {
  .g-services__private-cover {
    padding-top: 4rem;
  }
  .g-services__private-cover .g-services__private-cover-figure {
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    position: relative;
  }
  .g-services__private-cover .o-image {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
}

/**
 * Components.
 */
.c-card-project {
  position: relative;
  z-index: 0;
  display: grid;
  grid-template-areas: "card";
  overflow: hidden;
}
.c-card-project a::after {
  content: " ";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
}
.c-card-project:focus .c-card-project__title:before, .c-card-project:hover .c-card-project__title:before {
  background-color: #025E3F;
}

.c-card-project__thumbnail {
  position: relative;
  grid-area: card;
}
.c-card-project__thumbnail:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.4) 100%);
  z-index: 1;
}

.c-card-project__title {
  grid-area: card;
  z-index: 2;
  color: #FFFFFF;
  margin-top: auto;
  padding-left: 2rem;
  padding-bottom: 2rem;
  padding-right: 2rem;
}
.c-card-project__title:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 6.8rem;
  height: 6.8rem;
  background: #17C183;
  background-image: url("data:image/svg+xml, %3Csvg%20width=%277%27%20height=%2712%27%20xmlns=%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cpath%20d=%27M6.11%205.958a.588.588%200%200%200-.17-.367L1.157.703A.663.663%200%200%200%20.951.56a.71.71%200%200%200-.73.097.618.618%200%200%200-.156.19.573.573%200%200%200%20.105.673L4.553%206%20.17%2010.48a.583.583%200%200%200-.17.441c.01.162.09.314.22.422a.7.7%200%200%200%20.48.156.688.688%200%200%200%20.458-.202L5.94%206.41a.603.603%200%200%200%20.135-.21.566.566%200%200%200%20.036-.241Z%27%20fill=%27%23fff%27%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 2rem;
  transition: 0.15s ease-out;
}

.c-card-project--small .c-card-project__title {
  font-size: 2rem;
  line-height: 1.5;
  font-weight: 600;
}
@media only screen and (min-width: 60em) {
  .c-card-project--small .c-card-project__title {
    font-size: 1.6rem;
    line-height: 1.5;
    font-weight: 800;
  }
}

.c-contact-us {
  color: white;
  background: #025E3F;
  padding-top: 4rem;
}
.c-contact-us iframe {
  width: 100%;
}
@media only screen and (min-width: 60em) {
  .c-contact-us {
    padding-top: 10rem;
    padding-bottom: 10rem;
    display: flex;
    align-items: center;
  }
}

@media only screen and (min-width: 60em) {
  .c-contact-us__info {
    width: 31.3333333333%;
    margin-left: 8.5833333333%;
  }
}

.c-contact-us__map {
  margin-top: 4rem;
  font-size: 0;
}
@media only screen and (max-width: 59.99em) {
  .c-contact-us__map {
    margin-left: -3rem;
    width: calc(100% + 3rem + 3rem);
  }
}
@media only screen and (min-width: 60em) {
  .c-contact-us__map {
    margin-top: 0;
    margin-left: 3%;
    width: 48.5%;
  }
}

.c-contact-us__address {
  margin-top: 1rem;
  margin-bottom: 1.5rem;
}
@media only screen and (min-width: 60em) {
  .c-contact-us__address {
    margin-top: 2rem;
    margin-bottom: 0rem;
  }
  .c-contact-us__address:after {
    content: "";
    display: block;
    width: 27rem;
    height: 2px;
    background: #17C183;
    margin-top: 2rem;
    opacity: 0.4;
  }
}

.c-contact-us__link {
  border-top: 2px solid rgba(23, 193, 131, 0.4);
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.c-contact-us__link:focus, .c-contact-us__link:hover {
  color: #17C183;
}
@media only screen and (min-width: 60em) {
  .c-contact-us__link {
    margin-top: 2rem;
    border-top: none;
    padding: 0;
  }
}

.c-footer {
  background: #02432D;
  color: #FFFFFF;
  display: flex;
  justify-content: center;
  align-items: baseline;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
@media only screen and (max-width: 59.99em) {
  .c-footer {
    font-size: 0.9rem;
    letter-spacing: 0.01em;
    line-height: 2.5rem;
    padding-top: 2.8rem;
    padding-bottom: 2.8rem;
  }
}

.c-footer__link {
  color: #17C183;
  padding-right: 1rem;
}
.c-footer__link:before {
  content: "|";
  margin-right: 1rem;
  color: #17C183;
}
p + .c-footer__link {
  margin-left: 1rem;
}
.c-footer__link:focus, .c-footer__link:hover {
  color: #FFFFFF;
}
@media only screen and (min-width: 60em) {
  .c-footer__link {
    padding-right: 1.5rem;
  }
  .c-footer__link:before {
    margin-right: 1.5rem;
  }
  p + .c-footer__link {
    margin-left: 1.5rem;
  }
}

.c-language-switcher {
  position: relative;
  color: #025E3F;
  margin-left: 3.6rem;
  text-transform: uppercase;
  transition: 0.15s ease-out;
}

.c-language-switcher:focus,
.c-language-switcher:hover {
  color: #FFFFFF;
}
.c-language-switcher:focus .c-language-switcher__lang:after,
.c-language-switcher:hover .c-language-switcher__lang:after {
  content: url("data:image/svg+xml, %3Csvg%20width=%2712%27%20height=%278%27%20xmlns=%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cpath%20d=%27M5.653%207.054a.588.588%200%200%200%20.367-.17l4.889-4.781a.663.663%200%200%200%20.142-.208.71.71%200%200%200-.097-.73.619.619%200%200%200-.19-.156.573.573%200%200%200-.673.106l-4.48%204.383-4.48-4.383A.582.582%200%200%200%20.69.945a.593.593%200%200%200-.422.22.7.7%200%200%200-.156.479c.009.176.081.34.202.459l4.888%204.78c.061.06.132.107.21.136.077.029.16.041.241.035Z%27%20fill=%27%23fff%27%2F%3E%3C%2Fsvg%3E");
}

.c-nav.is-sticky .c-language-switcher:focus,
.c-nav.is-sticky .c-language-switcher:hover {
  color: #17C183;
}
.c-nav.is-sticky .c-language-switcher:focus .c-language-switcher__lang:after,
.c-nav.is-sticky .c-language-switcher:hover .c-language-switcher__lang:after {
  content: url("data:image/svg+xml, %3Csvg%20width=%2712%27%20height=%278%27%20xmlns=%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cpath%20d=%27M5.653%207.054a.588.588%200%200%200%20.367-.17l4.889-4.781a.663.663%200%200%200%20.142-.208.71.71%200%200%200-.097-.73.619.619%200%200%200-.19-.156.573.573%200%200%200-.673.106l-4.48%204.383-4.48-4.383A.582.582%200%200%200%20.69.945a.593.593%200%200%200-.422.22.7.7%200%200%200-.156.479c.009.176.081.34.202.459l4.888%204.78c.061.06.132.107.21.136.077.029.16.041.241.035Z%27%20fill=%27%2317C183%27%2F%3E%3C%2Fsvg%3E");
}

.c-language-switcher__lang {
  padding: 1rem;
  display: inline-block;
  text-transform: uppercase;
}
.c-language-switcher__lang:after {
  content: url("data:image/svg+xml, %3Csvg%20width=%2712%27%20height=%278%27%20xmlns=%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cpath%20d=%27M5.653%207.054a.588.588%200%200%200%20.367-.17l4.889-4.781a.663.663%200%200%200%20.142-.208.71.71%200%200%200-.097-.73.619.619%200%200%200-.19-.156.573.573%200%200%200-.673.106l-4.48%204.383-4.48-4.383A.582.582%200%200%200%20.69.945a.593.593%200%200%200-.422.22.7.7%200%200%200-.156.479c.009.176.081.34.202.459l4.888%204.78c.061.06.132.107.21.136.077.029.16.041.241.035Z%27%20fill=%27%23025E3F%27%2F%3E%3C%2Fsvg%3E");
  margin-left: 0.5rem;
}

.c-language-switcher__select {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.c-nav.u-bg-dark-green:not(.is-sticky) .c-language-switcher {
  color: #17C183;
}
.c-nav.u-bg-dark-green:not(.is-sticky) .c-language-switcher .c-language-switcher__lang:after {
  content: url("data:image/svg+xml, %3Csvg%20width=%2712%27%20height=%278%27%20xmlns=%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cpath%20d=%27M5.653%207.054a.588.588%200%200%200%20.367-.17l4.889-4.781a.663.663%200%200%200%20.142-.208.71.71%200%200%200-.097-.73.619.619%200%200%200-.19-.156.573.573%200%200%200-.673.106l-4.48%204.383-4.48-4.383A.582.582%200%200%200%20.69.945a.593.593%200%200%200-.422.22.7.7%200%200%200-.156.479c.009.176.081.34.202.459l4.888%204.78c.061.06.132.107.21.136.077.029.16.041.241.035Z%27%20fill=%27%2317C183%27%2F%3E%3C%2Fsvg%3E");
}

.c-nav {
  background: #17C183;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 90;
  transition: 0.15s ease-out;
}

.c-nav__wrapper {
  display: flex;
  align-items: center;
  position: relative;
  z-index: 2;
  padding-top: 2rem;
  padding-bottom: 1.6rem;
}
@media only screen and (max-width: 59.99em) {
  .c-nav__wrapper {
    padding-bottom: 0;
    background-color: #025E3F;
    background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2));
    background-size: 100% 2px;
    background-position: left bottom;
    background-repeat: no-repeat;
    background-origin: content-box;
  }
}

.c-nav__home {
  font-size: 0;
  margin-right: 3%;
  padding-bottom: 2rem;
}
.c-nav__home svg {
  width: 9.7rem;
  height: auto;
}
@media only screen and (max-width: 59.99em) {
  .c-nav__home .logo-bat-eco-icon {
    fill: #FFFFFF;
    transition: 0.15s ease-out;
  }
}
@media only screen and (min-width: 60em) {
  .c-nav__home {
    padding-bottom: 0rem;
  }
  .c-nav__home svg {
    width: 11.7rem;
  }
}

.c-nav__links {
  margin-left: auto;
  font-size: 1.3rem;
  line-height: 2.6rem;
  letter-spacing: 0.01em;
  font-weight: 600;
  display: flex;
  align-items: center;
}

.c-nav__list {
  color: #FFFFFF;
  display: flex;
}

.c-nav__item + .c-nav__item {
  margin-left: 2rem;
}

.c-nav__link:not(.o-btn) {
  display: inline-block;
  padding: 0.8rem;
  transition: 0.15s ease-out color;
  text-decoration-thickness: 2px;
  text-underline-offset: 0.75em;
  -webkit-text-decoration-color: #025E3F;
          text-decoration-color: #025E3F;
}

.c-nav__link:not(.c-nav__link--quote).is-active,
.c-nav__link:not(.c-nav__link--quote):focus,
.c-nav__link:not(.c-nav__link--quote):hover {
  color: #025E3F;
  -webkit-text-decoration-line: underline;
          text-decoration-line: underline;
}

.c-nav.u-bg-dark-green:not(.is-sticky) .c-nav__link:not(.c-nav__link--quote).is-active,
.c-nav.u-bg-dark-green:not(.is-sticky) .c-nav__link:not(.c-nav__link--quote):focus,
.c-nav.u-bg-dark-green:not(.is-sticky) .c-nav__link:not(.c-nav__link--quote):hover {
  color: #17C183;
}

.c-nav__link--quote {
  margin-left: 1rem;
}

.c-nav__mobile {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  height: calc(var(--vh) * 100);
  color: white;
  overflow: auto;
  background: #025E3F;
  display: flex;
  flex-direction: column;
  text-align: center;
}

.c-nav__burger {
  padding-bottom: 2rem;
  font-size: 0;
  margin-left: auto;
  margin-right: -1rem;
  margin-top: -1rem;
}

.c-nav__mobile-langs {
  margin-top: auto;
  font-weight: 600;
  display: flex;
  justify-content: center;
}
.c-nav__mobile-langs a {
  font-size: 1.8rem;
  padding: 1.2rem;
  opacity: 0.5;
}
.c-nav__mobile-langs a.is-active {
  opacity: 1;
}
.c-nav__mobile-langs li + li:before {
  content: "";
  display: inline-block;
  background: #FFFFFF;
  border-radius: 5px;
  width: 5px;
  height: 5px;
  opacity: 1;
  position: relative;
  top: -0.4rem;
}

.c-nav__mobile-contact {
  display: flex;
  justify-content: center;
  border-top: 2px solid rgba(255, 255, 255, 0.2);
  margin-top: 2rem;
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}
.c-nav__mobile-contact p + p {
  margin-left: 3rem;
}

.c-nav__mobile-list {
  flex-basis: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-top: 10rem;
}
.c-nav__mobile-list .o-btn {
  margin-top: 2rem;
}

.c-nav__mobile-item {
  font-size: 2.4rem;
  font-weight: 600;
}

.c-nav__mobile {
  transition: 0.2s ease-out opacity, 0s visibility, 0.3s ease-out transform;
}

.c-nav.is-closed .c-nav__wrapper {
  background-color: transparent;
}
.c-nav.is-closed .logo-bat-eco-icon {
  fill: #025E3F;
}
.c-nav.is-closed .c-nav__mobile {
  transition: 0.2s ease-out opacity, 0s 0.3s visibility, 0.3s ease-out transform;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translateY(-3rem);
          transform: translateY(-3rem);
}

.c-nav.u-bg-dark-green:not(.is-sticky) .logo-bat-eco-icon {
  fill: #FFFFFF;
}

/* IS STICKY */
.c-nav.is-sticky {
  background: #FFFFFF;
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.06);
}
.c-nav.is-sticky .c-nav__wrapper {
  background-image: none;
}
.c-nav.is-sticky .c-nav__list {
  color: #757575;
}
.c-nav.is-sticky .c-nav__link--quote {
  color: #17C183;
  border-color: #17C183;
}
.c-nav.is-sticky .c-nav__link--quote:after {
  content: url("data:image/svg+xml, %3Csvg%20width=%277%27%20height=%2712%27%20xmlns=%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cpath%20d=%27M6.11%205.958a.588.588%200%200%200-.17-.367L1.157.703A.663.663%200%200%200%20.951.56a.71.71%200%200%200-.73.097.618.618%200%200%200-.156.19.573.573%200%200%200%20.105.673L4.553%206%20.17%2010.48a.583.583%200%200%200-.17.441c.01.162.09.314.22.422a.7.7%200%200%200%20.48.156.688.688%200%200%200%20.458-.202L5.94%206.41a.603.603%200%200%200%20.135-.21.566.566%200%200%200%20.036-.241Z%27%20fill=%27%2317C183%27%2F%3E%3C%2Fsvg%3E");
}
.c-nav.is-sticky .logo-bat-eco-name {
  fill: #025E3F;
}
.c-nav.is-sticky .logo-bat-eco-construct {
  fill: #515151;
}
.c-nav.is-sticky .c-nav__burger path {
  fill: #025E3F;
}

/**
 * Scopes.
 */
/**
 * Utilities.
 */
.u-light-green {
  color: #EFF5F3;
}

.u-green {
  color: #17C183;
}

.u-dark-green {
  color: #025E3F;
}

.u-very-dark-green {
  color: #02432D;
}

.u-white {
  color: #FFFFFF;
}

.u-bg-light-green {
  background-color: #EFF5F3;
}

.u-bg-green {
  background-color: #17C183;
}

.u-bg-dark-green {
  background-color: #025E3F;
}

.u-bg-very-dark-green {
  background-color: #02432D;
}

/* =========================================================================  */
/* Text */
/* =========================================================================  */
/* =========================================================================  */
/* Overflow */
/* =========================================================================  */
.u-dont-wrap {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

/* =========================================================================  */
/* Typesetting */
/* =========================================================================  */
/**
 * Hides content visually.
 *
 * Eg. @mixin visually-hidden();
 */
.u-visually-hidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap; /* [1] */
}
.u-visually-hidden.is-focusable:active, .u-visually-hidden.is-focusable:focus { /* [2] */
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
  white-space: inherit;
}

/**
 * Visibility based on the breakpoint.
 *
 */
@media only screen and (max-width: 59.99em) {
  .u-desktop-only {
    display: none;
  }
}

@media only screen and (min-width: 60em) {
  .u-mobile-only {
    display: none;
  }
}

/**
 * Hide text while making it readable for screen readers
 * 1. Needed in WebKit-based browsers because of an implementation bug;
 *    See: https://code.google.com/p/chromium/issues/detail?id=457146
 */
.u-hide-text {
  overflow: hidden;
  padding: 0; /* [1] */
  text-indent: 101%;
  white-space: nowrap;
}

.hidden {
  display: none;
}

/**
 * Elements that should be visible only if JavaScript is not available.
 */
.js .u-no-js {
  display: none;
}

/* =========================================================================  */
/* Progressive enhancement */
/* =========================================================================  */