/* Label Delice shell: fonts, base type, container and grid, header and menu, social icons, breadcrumb band, map band,
   footer, scroll reveal, 404 page and holding page. Selector groups SG-01 to SG-09 and SG-22 of section-spec.md.
   Fonts and images are shipped next to this file in ../fonts/ and ../images/. Page sections of the other slices are not here. */

/* ---- SG-01 fonts ---- */
@font-face {
  font-family: 'broken vessels';
  src: url('../fonts/kgbrokenvesselssketch-webfont.woff2') format('woff2'),
       url('../fonts/kgbrokenvesselssketch-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'communist sb';
  src: url('../fonts/COMMSB__-webfont.woff') format('woff'),
       url('../fonts/COMMSB__-webfont.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'amatic';
  src: url('../fonts/amaticsc-regular_0-webfont.woff2') format('woff2'),
       url('../fonts/amaticsc-regular_0-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'montserrat light';
  src: url('../fonts/montserrat-light-webfont.woff2') format('woff2'),
       url('../fonts/montserrat-light-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'montserrat';
  src: url('../fonts/montserrat-regular-webfont.woff2') format('woff2'),
       url('../fonts/montserrat-regular-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.woff2') format('woff2'),
       url('../fonts/fontawesome-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'icomoon';
  src: url('../fonts/icomoon.woff') format('woff'),
       url('../fonts/icomoon.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Cambo';
  src: url('../fonts/cambo-latin-ext.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Cambo';
  src: url('../fonts/cambo-latin.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---- SG-01 base type (the source's framework base, on top of the Cassiopeia reset) ---- */
html {
  background: #fff;
  overflow-x: clip;
}
body {
  display: block;
  position: static;
  min-height: 0;
  margin: 0;
  padding: 0;
  font: 400 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #444;
  background: #fff;
  overflow-x: clip;
}
a {
  color: #07d;
  text-decoration: none;
}
a:hover,
a:focus {
  color: #059;
  text-decoration: underline;
}
img {
  max-width: 100%;
  height: auto;
  border: 0;
  vertical-align: middle;
}
ul,
ol {
  padding-left: 30px;
}
p {
  margin: 0;
  padding: 0;
  font: 400 14px/18px 'montserrat';
  color: #525C66;
}
h1, h2, h3, h4, h5 {
  margin: 0;
  padding: 0;
  font-family: 'communist sb';
  font-weight: 400;
  text-transform: uppercase;
  color: #525C66;
}
h1 { font-size: 24px; line-height: 42px; }
h2 { font-size: 24px; line-height: 30px; }
h3 { font-size: 18px; line-height: 24px; }
h4 { font-size: 16px; line-height: 22px; }
h5 { font-size: 14px; line-height: 20px; }
h3.ld-amatic {
  margin-top: 10px;
  margin-bottom: 40px;
  color: #C0A372;
  font-size: 24px;
}
.ld-amatic { font-family: 'amatic'; }
.ld-light { font-family: 'montserrat light'; }
.ld-center { text-align: center; }
.ld-right { text-align: right; }
@media (max-width: 767px) {
  .ld-hide-small { display: none !important; }
}

/* ---- SG-07 container, grid, main content row ---- */
.ld-container {
  box-sizing: border-box;
  max-width: 980px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 25px;
}
.ld-container::before,
.ld-container::after {
  content: "";
  display: table;
}
.ld-container::after { clear: both; }
@media (min-width: 1220px) {
  .ld-container {
    max-width: 1200px;
    padding: 0 35px;
  }
}
.ld-grid {
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 0 -25px;
  padding: 0;
  list-style: none;
}
.ld-grid::before,
.ld-grid::after {
  content: "";
  display: block;
  overflow: hidden;
}
.ld-grid::after { clear: both; }
.ld-grid > * {
  box-sizing: border-box;
  flex: none;
  float: left;
  width: 100%;
  margin: 0;
  padding-left: 25px;
}
.ld-grid > * > :last-child { margin-bottom: 0; }
@media (min-width: 1220px) {
  .ld-grid { margin-left: -35px; }
  .ld-grid > * { padding-left: 35px; }
}
@media (min-width: 960px) {
  .ld-col--1-2 { width: 50%; }
  .ld-col--1-3 { width: 33.333%; }
  .ld-col--4-10 { width: 40%; }
  .ld-col--6-10 { width: 60%; }
}
.ld-panel {
  display: block;
  position: relative;
}
.ld-panel::before,
.ld-panel::after {
  content: "";
  display: table;
}
.ld-panel::after { clear: both; }

/* Cassiopeia's page grid becomes plain stacked rows in the source's order */
.site-grid {
  display: block;
  margin: 0;
  padding: 0;
}
.site-grid > [class^="container-"],
.site-grid > [class*=" container-"] {
  display: block;
  width: auto;
  max-width: none;
  margin: 0;
  padding: 0;
}
.site-grid .grid-child {
  display: block;
  max-width: none;
  margin: 0;
  padding: 0;
}
.site-grid .container-top-a > *,
.site-grid .container-top-b > *,
.site-grid .container-bottom-a > *,
.site-grid .container-bottom-b > *,
.site-grid .container-component > * {
  margin: 0;
}
.container-component nav { position: static; }

/* the article area (source #articles) */
.site-grid .container-component > main {
  display: block;
  max-width: 1270px;
  margin: 30px auto 0;
}
body.ld-news .site-grid .container-component > main,
body.ld-brands .site-grid .container-component > main,
body.ld-contact .site-grid .container-component > main { margin-bottom: 40px; }
body.ld-home .site-grid .container-component > main {
  max-width: 100%;
  margin-top: 20px;
  border-top: 1px dashed #525C66;
}
@media (max-width: 667px) {
  .site-grid .container-component > main { padding: 0 20px; }
}
.ld-article { display: block; }

/* ---- SG-02 header and menu ---- */
.container-header {
  position: relative;
  z-index: 10;
  margin: 0;
  padding: 0;
  background: #525C66;
  box-shadow: none;
}
.container-header .grid-child {
  display: block;
  max-width: none;
  margin: 0;
  padding: 0;
}
.container-header .container-nav {
  position: relative;
  min-height: 75px;
  padding: 0;
  text-align: center;
  background: #525C66;
}
.container-header .container-nav::before,
.container-header .container-nav::after {
  content: "";
  display: table;
}
.container-header .container-nav::after { clear: both; }
.container-header .mod-custom { position: static; }
.container-header nav { margin: 0; padding: 0; }
@media (max-width: 667px) {
  .container-header .container-nav { min-height: 40px; }
}

.ld-nav { display: block; }
.container-header .ld-nav .mod-menu {
  display: block;
  float: none;
  margin: 0;
  padding: 0;
  list-style: none;
}
.container-header .ld-nav .mod-menu > li {
  display: inline-block;
  position: relative;
  float: none;
  margin: 0;
  padding: 0;
}
.container-header .ld-nav .mod-menu > li::after { content: none; }
.container-header .ld-nav .mod-menu > li > a {
  display: block;
  box-sizing: border-box;
  height: 40px;
  margin: 0;
  padding: 0 15px;
  font: 400 14px/75px 'communist sb';
  text-transform: uppercase;
  text-decoration: none;
  color: #fff;
  background: transparent;
}
.container-header .ld-nav .mod-menu > li.active > a,
.container-header .ld-nav .mod-menu > li:hover > a,
.container-header .ld-nav .mod-menu > li > a:focus {
  color: #C0A372;
  background: transparent;
  outline: 0;
}
.ld-nav .ld-nav__logo {
  max-width: 110px;
  height: auto;
}

.ld-nav-toggle {
  display: none;
  box-sizing: border-box;
  float: left;
  height: 40px;
  margin: 0;
  padding: 0 15px;
  border: 0;
  background: transparent;
  font-size: 18px;
  line-height: 40px;
  color: #fff;
  cursor: pointer;
}
.ld-nav-toggle:hover,
.ld-nav-toggle:focus {
  color: #C0A372;
  outline: 0;
}
.ld-nav-toggle__icon::after {
  content: "\f0c9";
  font-family: 'FontAwesome';
  vertical-align: middle;
}
@media (max-width: 767px) {
  .ld-nav-toggle { display: block; }
  .ld-nav { display: none; }
}

.ld-offcanvas {
  display: block;
  visibility: hidden;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1000;
  background: rgba(0, 0, 0, .1);
  text-align: left;
  transition: visibility 0s .3s;
}
.ld-offcanvas.is-open {
  visibility: visible;
  transition-delay: 0s;
}
@media (min-width: 768px) {
  .ld-offcanvas { display: none; }
}
.ld-offcanvas__bar {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 1001;
  width: 270px;
  max-width: 100%;
  overflow-y: auto;
  background: #525c66;
  transform: translateX(-100%);
  transition: transform .3s ease-in-out;
}
.ld-offcanvas.is-open .ld-offcanvas__bar { transform: translateX(0); }
.ld-offcanvas__list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.ld-offcanvas__list > li > a {
  display: block;
  padding: 10px 15px;
  font-family: 'communist sb';
  color: #ccc;
  text-decoration: none;
}
.ld-offcanvas__list > li > a:hover,
.ld-offcanvas__list > li > a:focus {
  background: #404040;
  color: #fff;
  outline: 0;
}
.ld-offcanvas__list > li.active > a {
  background: #1a1a1a;
  color: #fff;
}
html.ld-offcanvas-open { overflow: hidden; }
html.ld-offcanvas-open body {
  margin-left: 270px;
  overflow: hidden;
}
body { transition: margin-left .3s ease-in-out; }

/* ---- SG-03 icons and social buttons ---- */
.ld-icon {
  display: inline-block;
  font: normal 400 14px/1 'FontAwesome';
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.ld-icon,
.ld-icon:focus,
.ld-icon:hover { text-decoration: none; }
.ld-icon--facebook::before { content: "\f09a"; }
.ld-icon--twitter::before { content: "\f099"; }
.ld-icon--linkedin::before { content: "\f0e1"; }
.ld-icon--google-plus::before { content: "\f0d5"; }
.ld-icon--home::before { content: "\f015"; }

.ld-social {
  position: absolute;
  top: 0;
  right: 0;
  text-align: left;
}
.ld-social ul {
  margin: 0 20px;
  padding-left: 0;
}
.ld-social ul li {
  display: inline-block;
  padding: 0 5px;
  line-height: 75px;
  list-style: none;
}
.ld-social ul li a {
  color: rgba(255, 255, 255, .8);
  font-size: 18px;
}
.ld-social ul li a:hover {
  color: rgba(255, 255, 255, 1);
  transition: all ease .3s 0s;
}
@media (max-width: 885px) {
  .ld-social { display: none; }
}

.ld-footer__social ul {
  margin: 15px 0 0;
  padding-left: 0;
}
.ld-footer__social ul li {
  display: inline-block;
  padding: 0 5px;
  text-align: center;
  list-style: none;
}
footer.footer .ld-footer__social ul li a {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: #525C66;
  color: #fff;
  font-size: 19px;
  line-height: 45px;
  transition: all ease .3s 0s;
}
footer.footer .ld-footer__social ul li a:hover { color: #C0A372; }
@media (max-width: 667px) {
  .ld-footer__social { padding-top: 15px; }
}

/* ---- SG-04 breadcrumb band ---- */
.ld-breadcrumbs {
  padding: 50px 0;
  background: #525C66 url('../images/background-breadcrumbs.jpg') 50% 0 / cover no-repeat;
}
body.ld-news .ld-breadcrumbs { background-image: url('../images/background-breadcrumbs-actus.jpg'); }
body.ld-contact .ld-breadcrumbs { background-image: url('../images/background-breadcrumbs-contact.jpg'); }
body.ld-brands .ld-breadcrumbs { background-image: url('../images/background-breadcrumbs-2.jpg'); }
.ld-breadcrumbs__inner {
  box-sizing: border-box;
  max-width: 980px;
  padding: 0 25px;
}
.ld-breadcrumbs__inner::before,
.ld-breadcrumbs__inner::after {
  content: "";
  display: table;
}
.ld-breadcrumbs__inner::after { clear: both; }
@media (min-width: 1220px) {
  .ld-breadcrumbs__inner {
    max-width: 1200px;
    padding: 0 35px;
  }
}
.ld-breadcrumbs__list {
  margin: 0 0 15px;
  padding-left: 30px;
  list-style: none;
}
.ld-breadcrumbs__list li {
  display: inline-block;
  font: 400 18px/20px 'communist sb';
  text-transform: uppercase;
  color: #fff;
}
.ld-breadcrumbs__list li a {
  display: inline;
  color: #fff;
  font-family: 'communist sb';
  font-size: 18px;
  line-height: 20px;
}
.ld-breadcrumbs__home a::before {
  display: inline-block;
  font: normal 400 18px/1 'FontAwesome';
  font-size: 250%;
  vertical-align: -22%;
}
.ld-breadcrumbs__sep {
  display: inline-block;
  width: 9px;
  height: 9px;
  background: url('../images/breadcrumb-arrow.png') center / 9px 9px no-repeat;
  vertical-align: middle;
}

/* ---- SG-05 map band ---- */
.ld-map-band {
  background: url('../images/map-labeldelice.jpg') 0 110px / cover no-repeat;
  text-align: center;
}
.ld-map-band__label {
  display: inline-block;
  padding: 40px 90px;
  background: #fff;
  box-shadow: 0 -4px 11px -3px rgba(0, 0, 0, .2);
}

/* ---- SG-06 footer and copyright ---- */
footer.container-footer.footer {
  margin: 0;
  padding: 40px 0 0;
  background: #DBDDDF;
  border-bottom: 30px solid #525C66;
  color: #444;
}
footer.container-footer.footer .grid-child {
  display: block;
  max-width: none;
  margin: 0;
  padding: 0;
}
.ld-footer p,
.ld-footer ul li,
.ld-copyright p {
  font-family: 'montserrat light';
}
.ld-footer ul {
  margin: 15px 0 0;
  padding-left: 0;
}
.ld-footer ul li { list-style: none; }
.ld-footer ul li span {
  font-family: 'montserrat';
  text-transform: uppercase;
  color: #C0A372;
}
.ld-footer .ld-form { text-align: center; }
.ld-copyright {
  padding-bottom: 10px;
  border-bottom: 4px solid #C0A372;
  text-align: center;
}
footer.footer .ld-copyright a { color: #07d; text-decoration: none; }
footer.footer .ld-copyright a:hover { color: #059; text-decoration: underline; }
@media (max-width: 667px) {
  .ld-copyright { margin-top: 25px; }
  .ld-copyright p,
  .ld-copyright a { font-size: 12px; }
}

/* ---- SG-22 scroll reveal: the markup keeps the source timing through js/shell.js; nothing here ---- */

/* ---- SG-08 error page (system error.css of the source) ---- */
body.ld-error,
body.ld-error * {
  font-family: helvetica, arial, sans-serif;
  font-size: 11px;
  line-height: normal;
  color: #5F6565;
}
html:has(body.ld-error) { height: 100%; margin-bottom: 1px; }
body.ld-error {
  height: 100%;
  margin: 0;
  padding: 0;
  background: #fff;
  font-weight: normal;
}
.ld-error-page {
  box-sizing: content-box;
  width: 900px;
  margin: 0 auto;
  padding: 60px 0;
  background: #fff;
}
.ld-error-page__box {
  box-sizing: content-box;
  width: 900px;
  margin: 0;
  padding: 0;
  border: 1px solid #000;
}
.ld-error-page__head {
  box-sizing: content-box;
  width: 900px;
  margin: 0;
  padding: 0;
  background: #E44249;
  border-bottom: 1px solid #000;
  text-align: center;
}
body.ld-error .ld-error-page__head {
  color: #fff;
  font-weight: bold;
  font-size: 12px;
  line-height: 22px;
}
.ld-error-page__body {
  margin: 0;
  padding: 10px;
  text-align: left;
}
body.ld-error p,
body.ld-error ol,
body.ld-error ul {
  margin: 1em 0;
  padding: 0;
  font-weight: normal;
}
body.ld-error ol,
body.ld-error ul { padding-left: 40px; }
body.ld-error li { display: list-item; }
body.ld-error strong { font-weight: bold; }
body.ld-error a { text-decoration: underline; }
body.ld-error #techinfo {
  margin: 10px;
  padding: 10px;
  text-align: left;
  border: 1px solid #ccc;
  color: #ccc;
}
body.ld-error #techinfo p { color: #ccc; margin: 1em 0; }

/* ---- SG-09 holding page (offline.css of the source) ---- */
body.ld-offline,
html:has(body.ld-offline) { height: 100vh; }
body.ld-offline {
  margin: 0;
  padding: 0;
  background: #fff;
  color: #504747;
  text-align: center;
  font: 400 16px/normal 'Cambo', serif;
}
body.ld-offline h1 {
  margin: .67em 0;
  font: 500 40px/normal 'broken vessels';
  text-transform: uppercase;
  color: #504747;
}
body.ld-offline h2 {
  margin: .83em 0;
  font: 500 30px/normal 'broken vessels';
  text-transform: uppercase;
  color: #c0a473;
}
body.ld-offline h3 {
  margin: 1em 0;
  font: 400 18.72px/normal 'broken vessels';
  text-transform: uppercase;
  color: #c0a473;
}
body.ld-offline [class^="icon-"],
body.ld-offline [class*=" icon-"] {
  font-family: 'icomoon' !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  speak: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-iphone::before { content: "\e900"; }
.icon-croix::before { content: "\e901"; }
.icon-logo .path1::before { content: "\e902"; color: rgb(192, 164, 115); }
.icon-logo .path2::before { content: "\e903"; margin-left: -1.46875em; color: rgb(192, 164, 115); }
.icon-logo .path3::before { content: "\e904"; margin-left: -1.46875em; color: rgb(192, 164, 115); }
.icon-logo .path4::before { content: "\e905"; margin-left: -1.46875em; color: rgb(80, 71, 71); }
.icon-logo .path5::before { content: "\e906"; margin-left: -1.46875em; color: rgb(192, 164, 115); }
.icon-logo .path6::before { content: "\e907"; margin-left: -1.46875em; color: rgb(80, 71, 71); }
.icon-logo .path7::before { content: "\e908"; margin-left: -1.46875em; color: rgb(80, 71, 71); }
.icon-logo .path8::before { content: "\e909"; margin-left: -1.46875em; color: rgb(255, 255, 255); }
.icon-logo .path9::before { content: "\e90a"; margin-left: -1.46875em; color: rgb(255, 255, 255); }
.icon-logo .path10::before { content: "\e90b"; margin-left: -1.46875em; color: rgb(255, 255, 255); }
.icon-logo .path11::before { content: "\e90c"; margin-left: -1.46875em; color: rgb(80, 71, 71); }
.icon-logo .path12::before { content: "\e90d"; margin-left: -1.46875em; color: rgb(80, 71, 71); }
.icon-logo .path13::before { content: "\e90e"; margin-left: -1.46875em; color: rgb(255, 255, 255); }
.icon-logo .path14::before { content: "\e90f"; margin-left: -1.46875em; color: rgb(255, 255, 255); }
.icon-lotus .path1::before { content: "\e910"; color: rgb(192, 164, 115); }
.icon-lotus .path2::before { content: "\e911"; margin-left: -2.470703125em; color: rgb(255, 255, 255); }
.icon-lotus .path3::before { content: "\e912"; margin-left: -2.470703125em; color: rgb(80, 71, 71); }
.icon-lotus .path4::before { content: "\e913"; margin-left: -2.470703125em; color: rgb(80, 71, 71); }
body.ld-offline h1 .icon-croix { color: #c0a473; font-size: 26px; }
#ld-offline-head {
  display: flex;
  height: 60%;
}
#ld-offline-head > div { margin: auto; }
.ld-offline__logo > span { font-size: 280px; }
.ld-offline__logo h3 {
  text-transform: uppercase;
  font-weight: 500;
}
.ld-offline__address p {
  margin: 19px 0;
  font: 400 19px/normal 'broken vessels';
  color: #504747;
}
.ld-offline__login { display: block; }
.ld-offline__login fieldset {
  margin: 0;
  padding: 0;
  border: none;
}
.ld-offline__login form { margin: 0; padding: 0; }
.ld-offline__login fieldset input {
  display: inline-block;
  max-width: 150px;
}
div#eapps-instagram-feed-1 { margin-bottom: 10vh; }
.ld-offline__contacts {
  position: fixed;
  bottom: 0;
  width: 100%;
  background: #504747;
}
.ld-offline__contacts h3 {
  text-transform: uppercase;
  font-weight: 400;
}
.ld-offline__contacts p {
  margin: 17px 0;
  font: 400 17px/26px 'Cambo', serif;
  color: #c0a473;
}
.ld-offline__contacts p > span { color: #fff; }
.ld-offline__contacts p > span.icon-lotus {
  padding: 0 10px;
  font-size: 26px;
}
/* Home slice (SG-10 to SG-14). Fonts, base type, container, grid and the page wrappers belong to shell.css,
   which is merged before this file; the images are the template images shell ships to ../images/. */

/* SG-10 hero: .headerhome */
.ld-hero {
  position: relative;
  display: flex;
  min-height: 50vh;
  background: url(../images/home-head4.jpg) center / cover;
}
.ld-hero::before,
.ld-hero::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 1px;
  border-top: 1px dashed #fff;
}
.ld-hero::before { top: 20px; }
.ld-hero::after { bottom: 20px; }
.ld-hero__title {
  position: relative;
  margin: auto;
  font: 24px/42px "broken vessels";
  letter-spacing: 2px;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
}
.ld-hero__title::after {
  content: "";
  position: absolute;
  bottom: -50px;
  left: 0;
  width: 100%;
  height: 58px;
  background: url(../images/deco-white-ld.png) center / contain no-repeat;
}

/* SG-11 products: #top-b */
.ld-products { padding: 40px 0; }
.ld-products__grid {
  display: grid;
  gap: 25px;
}
.ld-product__media {
  position: relative;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 15px;
  overflow: hidden;
  text-align: center;
}
.ld-product__media img {
  display: block;
  max-width: 100%;
  height: auto;
  transition: transform 0.3s ease-out;
}
.ld-product__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.3s ease-out;
}
.ld-product__media:hover img { transform: scale(1.1); }
.ld-product__media:hover::after { opacity: 1; }
.ld-product__title {
  position: relative;
  margin: 10px 0 0;
  font: 18px/24px "communist sb";
  text-align: center;
  text-transform: uppercase;
  color: #525c66;
}
.ld-product__title::after,
.ld-flexy__desc h3::after {
  content: "";
  position: absolute;
  bottom: -15px;
  left: 0;
  width: 100%;
  height: 11px;
  background: url(../images/deco-colo-ld.svg) center / contain no-repeat;
}

/* SG-12 categories: #top-c, a full-width texture band holding two white rows */
.ld-categories {
  padding: 120px 0;
  background: url(../images/fond-labeldelice.jpg);
}
.ld-flexy {
  display: flex;
  max-width: 1170px;
  margin: 0 auto;
  background: #fff;
}
.ld-flexy > * {
  flex: 1;
  margin: auto;
  background: #fff;
}
.ld-flexy__image img {
  max-width: 100%;
  height: auto;
}
.ld-flexy__desc { position: relative; }
.ld-flexy__desc h3 {
  position: relative;
  margin: 0 0 35px;
  padding: 0 20px;
  font: 18px/24px "communist sb";
  text-align: center;
  text-transform: uppercase;
  color: #525c66;
}
.ld-flexy__desc p {
  padding: 0 20px;
  font-size: 13px;
}
.ld-flexy__desc::before {
  content: "";
  position: absolute;
  top: 44%;
  width: 0;
  height: 0;
  border-style: solid;
}
.ld-flexy:first-child .ld-flexy__desc::before {
  left: -10px;
  border-width: 10px 10px 10px 0;
  border-color: transparent #fff transparent transparent;
}
.ld-flexy:nth-child(2) .ld-flexy__desc::before {
  right: -3%;
  border-width: 10px 0 10px 10px;
  border-color: transparent transparent transparent #fff;
}

/* SG-13 intro: #articles on the home page; its top margin, dashed rule and 667 side padding are on `main` in shell.css */

/* SG-14 brands strip: #bottom-a, the slideset as a static strip (1 logo below 768, 3 to 1219, 6 above) */
.ld-brands-strip { padding: 40px 0; }
.ld-slideset {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 0 15px -10px;
  padding: 0;
  list-style: none;
}
.ld-slideset__item {
  box-sizing: border-box;
  flex: none;
  width: 100%;
  padding-left: 10px;
}
.ld-slideset__item:nth-child(n + 2) { display: none; }
.ld-panel--box {
  padding: 15px;
  border: 1px solid #c0a372;
  border-radius: 0;
  background: transparent;
}
.ld-panel--box > .ld-panel__teaser { margin: -15px -15px 0; }
.ld-panel--box .ld-panel__teaser img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  border-radius: 2px 2px 0 0;
}

@media (min-width: 768px) {
  .ld-slideset__item { width: 33.333%; }
  .ld-slideset__item:nth-child(-n + 3) { display: block; }
}
@media (min-width: 960px) {
  .ld-products__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1220px) {
  .ld-products__grid { column-gap: 35px; }
  .ld-slideset__item { width: 16.666%; }
  .ld-slideset__item:nth-child(n) { display: block; }
}
@media (max-width: 667px) {
  .ld-categories { padding: 0; }
  .ld-flexy { flex-direction: column; }
  .ld-flexy__image img { margin: 20px 0; }
  .ld-flexy:nth-child(2) > :first-child { margin-top: 20px; }
}
/* Label Delice, slice inner: about + RIV.K band (SG-15), brands (SG-16), news (SG-17), legal (SG-18).
   Fonts, base type, container, grid and the main content row come from the shell fragment. */

/* SG-15: about page and RIV.K band */
.ld-article--about h3:not(.ld-amatic) { padding-top: 15px; }

.ld-rivk { margin: 80px 0 50px; padding: 0; background-color: #DBDDDF; }
.ld-rivk__grid {
  display: flex;
  background: url(../images/bateau.jpg) 0 -80px / cover repeat;
}
.ld-rivk__grid > .ld-col { margin: auto; }
.ld-rivk .ld-rivk__text { padding: 110px 50px; background-color: rgba(82, 92, 102, .2); }
.ld-rivk h2,
.ld-rivk p { color: #034663; }
.ld-rivk p { line-height: 20px; }
.ld-rivk img { box-sizing: content-box; height: auto; padding-bottom: 30px; vertical-align: middle; }

/* Space below the content row (source `.actus #articles`, `.marques #articles`, `.mentions #articles`); the row itself is the shell's
   `main`, so the selector has to be at least as specific as the shell's `.site-grid .container-component > main`. */
body.ld-news .site-grid .container-component > main,
body.ld-brands .site-grid .container-component > main { margin-bottom: 40px; }
body.ld-legal .site-grid .container-component > main { padding-top: 20px; padding-bottom: 40px; }

/* SG-16: brands page */

.ld-tabs {
  display: flow-root;
  margin: 15px 0;
  border-bottom: 1px solid #C0A372;
  font: 400 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
}
.ld-tabs .ld-tabs__list {
  display: flex;
  justify-content: center;
  margin: 20px 0 0;
  padding: 0;
  overflow: visible; /* the dropdown hangs below the row; Cassiopeia clips lists inside articles */
  list-style: none;
}
.ld-tabs__item { position: relative; flex: none; margin-bottom: -1px; }
.ld-tabs__item + .ld-tabs__item > a { margin-left: 5px; }
.ld-tabs__item > a,
.ld-tabs__toggle {
  display: block;
  padding: 8px 12px;
  border: 1px solid transparent;
  border-bottom-width: 0;
  color: #C0A372;
  text-decoration: none;
}
.ld-tabs__item--active > a,
.ld-tabs__toggle {
  border-color: #C0A372;
  background: #fff;
  color: #525C66;
}
.ld-tabs__item > a:hover,
.ld-tabs__item > a:focus,
.ld-tabs__toggle:hover,
.ld-tabs__toggle:focus {
  border: none;
  background: transparent;
  color: #525C66;
  outline: 0;
}
.ld-tabs__item:not(.ld-tabs__item--active) > a:hover,
.ld-tabs__item:not(.ld-tabs__item--active) > a:focus { margin-bottom: 1px; padding-bottom: 7px; }

/* Below the width the tabs need, one toggle opens them as a list (inner.js builds it). */
.ld-tabs__responsive { display: none; position: relative; margin-bottom: -1px; }
.ld-tabs--collapsed > .ld-tabs__list > .ld-tabs__item { display: none; }
.ld-tabs--collapsed > .ld-tabs__list > .ld-tabs__responsive { display: block; }
.ld-tabs__toggle {
  margin: 0;
  font: inherit;
  text-transform: inherit;
  cursor: pointer;
  appearance: none;
}
.ld-tabs__toggle::before { content: "\f0c9\00a0"; font-family: FontAwesome; }
.ld-tabs__responsive--open > .ld-tabs__toggle { border: none; background: transparent; }
.ld-tabs__dropdown {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1020;
  box-sizing: border-box;
  min-width: 150px;
  margin-top: 5px;
  padding: 5px;
  border: 1px solid rgba(0, 0, 0, .1);
  background: #f5f5f5;
  color: #444;
  text-align: left;
  white-space: nowrap;
}
.ld-tabs__responsive--open > .ld-tabs__dropdown { display: block; }
.ld-tabs__options { margin: 0 -5px; padding: 0; list-style: none; }
.ld-tabs__options a { display: block; padding: 5px 15px; color: #444; text-decoration: none; }
.ld-tabs__option--active > a { color: #37a5e5; }
.ld-tabs__options a:hover,
.ld-tabs__options a:focus { background: #00a8e6; color: #fff; outline: 0; }

.ld-products-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
@media (min-width: 768px) { .ld-products-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 960px) { .ld-products-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1220px) { .ld-products-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.ld-card { transition: opacity .3s; }
.ld-card--out { opacity: 0; }
.ld-card--gone { display: none; }
.ld-card__brand { margin: 0 0 15px; color: #444; font: 400 18px/24px "communist sb"; text-align: center; text-transform: uppercase; }
.ld-card__media { margin: 15px 0; border: 1px solid #C0A372; text-align: center; }
.ld-card__media img { max-width: 100%; height: auto; vertical-align: middle; }
.ld-card__name { margin: 0; color: #C0A372; font-family: "montserrat light"; text-align: center; }

/* SG-17: news list and news article */
.ld-article--news p,
.ld-blog p { font-family: "montserrat light"; }
.ld-blog__title { text-align: center; }
.ld-blog__image { display: block; margin: 0 0 40px; padding: 5px; border: 1px solid #C0A372; }
.ld-blog__image img { display: block; width: 100%; height: auto; }
.ld-blog__row { margin-top: 40px; }
@media (min-width: 768px) { .ld-blog__row > .ld-col { width: 33.3333%; } }

.ld-card-news {
  box-sizing: content-box;
  min-height: 400px;
  max-height: 400px;
  padding: 30px;
  overflow: auto;
  border: 1px solid #C0A372;
}
.ld-card-news:hover { box-shadow: 0 0 5px 2px rgba(0, 0, 0, .1); transition: all ease .3s 0s; }
.ld-card-news__title { font-size: 18px; line-height: 22px; text-align: center; }
.ld-card-news p { font-size: 13px; transition: all ease .3s 0s; }
.ld-card-news__more { margin-top: 20px; text-align: center; }
.ld-btn { padding: 10px 30px; background-color: #525C66; color: #fff; text-decoration: none; }
.ld-btn:hover,
.ld-btn:focus { color: #fff; text-decoration: none; }
@media (max-width: 667px) { .ld-blog__row > .ld-col > .ld-card-news { margin-bottom: 20px; } }

/* SG-18: legal page */
.ld-article--legal h2 { text-align: center; }
.ld-article--legal h3 { margin: 10px 0; color: #C0A372; text-align: center; }
.ld-article--legal p { font-family: "montserrat light"; }
/* Contact slice: SG-19 contact page columns, SG-20 find-us band and map, SG-21 both RSForm forms (modern style). */

/* SG-19 the article area of the contact page keeps the source's 40px bottom margin (.contact #articles) */
body.ld-contact .site-grid .container-component > main { margin-bottom: 40px; }

/* SG-19 contact details and page headings */
.ld-article--contact h2,
.ld-find-us h2 { padding-bottom: 15px; }
.ld-article--contact h3 { padding-top: 20px; }
.ld-article--contact p,
.ld-details li { font-family: 'montserrat light'; }
.ld-article--contact strong { font-family: 'montserrat'; color: #C0A372; }
.ld-details { border-right: 1px solid #C0A372; }
.ld-details ul { position: relative; margin: 15px 0; padding: 0 0 0 50px; }
.ld-details li { list-style: none; }
.ld-details ul::before {
  content: ''; position: absolute; top: 0; left: 0; width: 42px; height: 39px;
  background: url('../images/ble-labeldelice.svg') center / contain no-repeat;
}

/* SG-20 find-us band: heading, ornament, bordered map frame */
.ld-find-us { margin-bottom: 40px; }
.ld-find-us__map { margin-top: 30px; }
.ld-map { box-sizing: content-box; height: 400px; padding: 5px; border: 1px solid #C0A372; }
.ld-map > div { width: 99.2% !important; height: 97.2% !important; }

/* SG-21 RSForm, both forms: 5px gap between fields, 4px radius, 48px fields and button */
#userForm {
  --ld-form-gold: #C0A372; --ld-form-slate: #525C66; --ld-form-error: #CF4D4D;
  --ld-form-height: 48px; --ld-form-gap: 5px; --ld-form-radius: 4px;
  margin: 0;
}
#userForm .formContainer { margin: 0; padding: 0; border: 0; }
#userForm .rsform-block { margin: 0 0 var(--ld-form-gap); }
#userForm .formControlLabel {
  display: block; float: none; width: auto; margin: 0 0 var(--ld-form-gap); padding: 0;
  font-family: 'montserrat light'; font-size: 14px; line-height: 20px; text-align: left;
}
#userForm .formControlLabel:empty { display: none; }
#userForm .rsform-block-envoi { margin-bottom: 0; }
#userForm .formControls { margin: 0; }
#userForm .formBody { float: none; width: 100%; }
#userForm :is(.rsform-input-box, .rsform-select-box, .rsform-text-box) {
  display: block; box-sizing: border-box; width: 100%; height: var(--ld-form-height); margin: 0; padding: 4px 12px;
  border: 1px solid #ccc; border-radius: var(--ld-form-radius); box-shadow: none;
  background: #fff; color: #555; font-family: 'montserrat'; font-size: 13px; line-height: 18px;
  transition: border-color .3s, box-shadow .3s;
}
#userForm .rsform-select-box { font-family: 'montserrat light'; border-color: #bbb; }
#userForm .rsform-text-box { height: 100px; resize: vertical; }
#userForm :is(input, select, textarea):focus {
  border-color: var(--ld-form-gold); outline: 0; box-shadow: 0 0 0 1px var(--ld-form-gold);
}

/* the select keeps the source's label-left row above 650px (RSForm stacks it below), 230px wide as on the source */
@media (min-width: 651px) {
  #userForm .rsform-block-objet { display: flex; align-items: center; }
  #userForm .rsform-block-objet .formControlLabel { margin: 0 15px 0 0; white-space: nowrap; }
  #userForm .rsform-block-objet .formControls { flex: 0 0 230px; }
}
#userForm .rsform-error { border-color: var(--ld-form-error); }
#userForm .formValidation { display: block; }
#userForm .formValidation .formError {
  display: block; margin-top: 2px;
}
#userForm .formRed { margin: 0 0 var(--ld-form-gap); }
#userForm .rsform-block-captcha .formBody { font: 12px/16px 'montserrat light'; }
#userForm .rsform-block-captcha iframe { max-width: 100%; }
#userForm :is(button[type="submit"], input[type="submit"]) {
  display: inline-block; box-sizing: border-box; width: auto; height: var(--ld-form-height); margin: 0; padding: 0 30px;
  border: 0; border-radius: var(--ld-form-radius); box-shadow: none; text-shadow: none;
  background: var(--ld-form-gold); color: #fff; cursor: pointer;
  font-family: 'communist sb'; font-size: 16px; line-height: 18px; text-transform: uppercase;
  transition: background-color .3s;
}
#userForm :is(button[type="submit"], input[type="submit"]):hover { background: var(--ld-form-slate); }
#userForm :is(button[type="submit"], input[type="submit"]):focus-visible { outline: 2px solid var(--ld-form-slate); outline-offset: 2px; }

/* footer form: centred submit, the column holds the fields at full width */
.ld-form #userForm { text-align: center; }
.ld-form #userForm .rsform-text-box { height: 64px; }
.ld-form #userForm .rsform-block-captcha .formBody { text-align: left; }