/* ----- communs et homepage - hors product list et featured ----- */

:root {
  --oo-rouge: #BF0D3D;
  --oo-dore: #DCBA57;
  --oo-dore-op: #d9c1a1d6;
  --border-dore-op: #f7e3c8d6;
  --oo-bleu: #0A4C6C;
  --txt-dark: #222;
  --txt-light: #cbcbcb;
  --txt-header: #7a7a7a;
  --bg-light-odd: #FFFBF2;
  --bg-light: #FFF7E6;
  --bg-lighter: #fffcf3;
  --bg-very-light: #fffefc;
  --font-serif: 'Vollkorn', Georgia, serif;
  --font-normal: 'Vend Sans', sans-serif;
  --oo-container: 1300px;
}

@font-face {
  font-family: 'Vend Sans';
  src: url('../fonts/vend-sans-latin-wght-normal.woff2') format('woff2-variations'),
    url('../fonts/VendSans-VariableFont_wght.ttf') format('truetype-variations');
  font-weight: 300 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Vend Sans';
  src: url('../fonts/vend-sans-latin-wght-italic.woff2') format('woff2-variations'),
    url('../fonts/VendSans-Italic-VariableFont_wght.ttf') format('truetype-variations');
  font-weight: 300 800;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Vollkorn';
  src: url('../fonts/vollkorn-latin-400-normal.woff2') format('woff2'),
    url('../fonts/vollkorn-latin-400-normal.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Vollkorn';
  src: url('../fonts/vollkorn-latin-600-normal.woff2') format('woff2'),
    url('../fonts/vollkorn-latin-600-normal.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Vollkorn';
  src: url('../fonts/vollkorn-latin-600-italic.woff2') format('woff2'),
    url('../fonts/vollkorn-latin-600-italic.ttf') format('truetype');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Vollkorn';
  src: url('../fonts/vollkorn-latin-700-normal.woff2') format('woff2'),
    url('../fonts/vollkorn-latin-700-normal.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Font Awesome 7 Free';
  font-style: normal;
  font-weight: 700;
  font-display: block;
  src: url('../fontawesome/webfonts/fa-solid-900.woff2') format('woff2');
}

.fa-solid,
.fas {
  font-family: 'Font Awesome 7 Free';
  font-weight: 700;
}

.fa-phone::before {
  content: "\f095";
}

body {
  font-family: 'Vend Sans', sans-serif;
}

.page-content.page-cms ul,
p {
  color: var(--txt-dark);
  font-size: 1.05rem;
  line-height: 1.35;
}

.btn-primary {
  border-radius: 30px;
  -webkit-transition: background-color .3s ease-in-out;
  transition: background-color 0.2s ease-in-out;
}

.btn-primary:hover {
  background-color: var(--oo-dore);
}

.btn-primary.focus,
.btn-primary:focus {
  color: #fff;
  background-color: var(--oo-dore);
  outline: 0;
  outline-offset: 0;
}

a {
  transition: color 0.2s ease-in-out;
}

a:hover {
  color: var(--oo-dore);
  text-decoration: none;
}

a:focus {
  color: var(--oo-dore);
  outline: 0;
  outline-offset: -2px;
  text-decoration: none;
}

body#checkout a:hover {
  color: var(--oo-dore);

}

/* h1, h2, h3, .h1, .h2, .h3 { font-family: 'Vollkorn', Georgia, serif; } */


@media (max-width: 576px) {

  .page-content.page-cms ul,
  p {
    font-size: .95rem;
  }
}

/* ----- HEADER ----- */
#header {
  color: var(--txt-header);
  background: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
  padding-bottom: 0;
}

#header .header-top {
  padding: .6rem 0;
}

#header .logo {
  max-width: 420px;
  height: auto;
}

@media (max-width: 767px) {

  #header #_desktop_logo .logo-wrapper {
    text-align: center;
  }

  #header #_desktop_logo .logo-wrapper img {
    text-align: center;
    max-width: 370px;
    margin: auto;
  }
}

/* ----- Barre du haut - top bar ----- */
#header .oo-topbar {
  background-color: var(--oo-rouge);
  color: white;
  padding: 0.5rem 2rem;
}

#header .topbar-content .h3 {
  display: none;
}

#header .topbar-content .col-lg-7,
#header .topbar-content .col-md-4 {
  width: 100%;
  padding: 0;
}

#header .topbar-content .nav-contact_oo #footer_sub_menu_8 {
  margin-bottom: 0;
}

#header .topbar-content .col-lg-7 .h3 {
  display: none;
}

#header .topbar-content #footer_sub_menu_8 {
  margin-bottom: 0;
  display: flex;
}

#header .topbar-content #footer_sub_menu_8 li {
  display: inline-block;
  padding: 0 .5rem;
  flex: 1;
}

#footer_sub_menu_8 li:last-child {
  text-align: right;
}

#header .topbar-content #footer_sub_menu_8 li a {
  color: white;
  font-weight: 500;
  letter-spacing: 1px;
  -webkit-transition: color .2s ease-in-out;
  transition: color 0.2s ease-in-out;
  letter-spacing: 1px;
}

#header .topbar-content #footer_sub_menu_8 li a:focus {
  text-decoration: none;
  border: 0;
}

#header .topbar-content #footer_sub_menu_8 li a:hover {
  color: var(--bg-lighter);
}

@media (max-width: 767px) {
  #header .topbar-content #footer_sub_menu_8 {
    flex-direction: column;
  }

  #header .topbar-content #footer_sub_menu_8 li {
    text-align: center !important;
    font-size: .9rem;
    line-height: 1.2;
    padding: 0 1.55rem;
  }
}

/* ----- MENU DROITE RIGHT - contact ----- */
#header .header-top .header-top-right {
  text-align: right;
}

#header .header-top .nav-contact_oo {
  padding: 0 .6rem 0 0;
  line-height: 2.2rem;
  min-height: 2.8rem;
}

#header .header-top .nav-contact_oo .col-lg-7,
#header .header-top .nav-contact_oo .col-md-4 {
  width: 100%;
  text-align: right;
  padding: 0;
}

#header .header-top .nav-contact_oo .col-lg-7 .h3 {
  display: none;
}

#header .header-top .nav-contact_oo #footer_sub_menu_6 {
  margin-bottom: 0;
}

#header .header-top .nav-contact_oo #footer_sub_menu_6 li {
  display: inline-block;
  padding: 0 .5rem;
}

#header .header-top .nav-contact_oo #footer_sub_menu_6 li a {
  color: var(--txt-dark);
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  -webkit-transition: color .2s ease-in-out;
  transition: color 0.2s ease-in-out;
  letter-spacing: 1px;
}

#header .header-top .nav-contact_oo #footer_sub_menu_6 li a:hover {
  color: var(--oo-dore);
}

@media (max-width: 767px) {

  .links .title,
  #footer_sub_menu_6 .links .title {
    display: none;
  }

  #header .header-top .nav-contact_oo #footer_sub_menu_6 {
    width: 98%;
    margin: 1rem auto;
    text-align: center;
    /* display: flex;
    flex-direction: column; */
  }
}

@media (max-width: 576px) {

  #header .header-top .nav-contact_oo #footer_sub_menu_6 li {
    /* display: block; */
    text-align: center;
  }
}

/* ----- MENU DROITE RIGHT - SHOP ICONS ----- */
.ui-autocomplete.searchbar-autocomplete {
  font-family: 'Vend Sans', sans-serif;
  font-size: 1rem;
  font-weight: 500;
}

.ui-autocomplete.searchbar-autocomplete li a,
.ui-autocomplete.searchbar-autocomplete li a.ui-state-focus {
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0;
}

.ui-autocomplete.searchbar-autocomplete li a:hover {
  background-color: var(--bg-light);
}

#search_widget form input {
  border-radius: 30px;
  border: 1px solid #dcba57;
  background-color: #dcba5721;
  color: var(--txt-dark);
  float: none;
}

#search_widget form i {
  color: var(--oo-dore);
}

#search_widget form input::placeholder {
  color: var(--oo-dore);
  opacity: 1;
}

#header .header-top .nav-shop_oo {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

#header .header-top .nav-shop_oo .blockcart .header,
#header .header-top .nav-shop_oo a {
  flex-direction: column;
  display: flex;
  text-align: center;
  align-items: center;
  color: var(--txt-dark);
}

#header .header-top .nav-shop_oo .blockcart .hidden-sm-down,
#header .header-top .nav-shop_oo a span {
  font-size: .75rem;
}

#header .header-top .nav-shop_oo .blockcart .header {
  position: relative;
}

#header .header-top .nav-shop_oo .blockcart .cart-products-count {
  position: absolute;
  right: -4px;
  top: -9px;
  background-color: var(--oo-rouge);
  color: white;
  border-radius: 50%;
  font-size: .8rem;
  width: 17px;
  height: 19px;
  padding: 0 3px;
}


@media (max-width: 776px) {
  #header .header-top .nav-shop_oo {
    justify-content: center;
  }
}

/* ----- MAIN MENU ----- */
#header .header-nav {
  max-height: initial;
  border: 0;
}

#header .menuoo-wrapper {
  text-align: center;
}

#header .menuoo-wrapper .menu-oo_text {
  text-align: center;
  color: var(--txt-dark);
  font-size: 1.1rem;
}

#header .menuoo-wrapper .menuoo-border {
  display: inline-block;
  min-width: 60%;
  margin: 0 auto -1px;
  padding: 1.2rem 0 0;
  border-top: 1px solid var(--oo-dore);
  border-bottom: 1px solid var(--oo-dore);
}

#header .menu {
  /*width: 100%;*/
  text-align: center;
}

.top-menu {
  position: relative;
}

.top-menu .sub-menu {
  background-color: white;
  width: 100%;
  min-width: initial;
  max-width: initial;
  margin-left: 0;
  padding: 1.1rem 0 .2rem;
  border: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-top: 2px solid var(--oo-dore);
  border-bottom: 1px solid var(--oo-dore);
  -webkit-transition: opacity .25s ease, visibility .25s ease;
  transition: opacity .25s ease, visibility .25s ease;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  box-shadow: 0px 1px 6px 0 #e7d9c752;
}


@media (max-width: 776px) {
  #header .menuoo-wrapper .menuoo-border {
    border-top: 0;
    border-bottom: 0;
  }

  #header .menuoo-wrapper .menuoo-border .menu-oo_text,
  .mobile .menu-oo_text {
    display: none !important;
  }
}

/* ----- MAIN MENU LINK ----- */
#header a {
  transition: color 0.15s ease-in-out;
}

#header a:hover {
  color: var(--oo-dore);
  text-decoration: none;
}

.top-menu[data-depth="0"] {
  display: flex;
  padding-bottom: .8rem;
}

#header .top-menu a[data-depth="0"] {
  padding: 1.2rem 1rem .6rem;
  font-size: 1.1rem;
}

#header .top-menu a[data-depth="0"]:hover {
  color: var(--oo-rouge);
  text-decoration: none;
}


#header .top-menu a.dropdown-submenu {
  color: var(--txt-dark);
  text-transform: none;
  font-size: 1.05rem;
  padding: .4rem .9rem;
  display: block;
}

#header .top-menu a.dropdown-submenu:hover {
  color: var(--oo-dore);
  text-decoration: none;
}

/* ---- Burger ---- */
.oo-menu-toggle {
  background: none;
  border: none;
  padding: .35rem .5rem;
  margin-left: .75rem;
  font-size: 1.5rem;
  color: var(--txt-dark, #1a1a1a);
  cursor: pointer;
  vertical-align: middle;
}

.oo-menu-toggle:focus-visible {
  outline: 3px solid var(--oo-dore, #DCBA57);
  outline-offset: 2px;
}

/* ---- Overlay ---- */
.oo-mobile-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .45);
  z-index: 1040;
  opacity: 0;
  transition: opacity .3s ease;
}

.oo-mobile-overlay.is-open {
  opacity: 1;
}

/* ---- Panneau off-canvas ---- */
.oo-mobile-nav {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 85%;
  max-width: 340px;
  background: #fff;
  z-index: 1050;
  transform: translateX(-100%);
  transition: transform .3s ease;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  box-shadow: 2px 0 12px rgba(0, 0, 0, .15);
}

.oo-mobile-nav.is-open {
  transform: translateX(0);
}

.oo-mobile-nav__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid #eee;
  background: var(--oo-rouge, #BF0D3D);
}

.oo-mobile-nav__title {
  color: #fff;
  font-family: 'Vollkorn', serif;
  font-size: 1.2rem;
}

.oo-mobile-nav__close {
  background: none;
  border: none;
  color: #fff;
  font-size: 1.4rem;
  cursor: pointer;
  padding: .25rem .5rem;
}

/* ---- Liste ---- */
.oo-mobile-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.oo-mobile-item {
  border-bottom: 1px solid #f0f0f0;
  text-align: left;
}

.oo-mobile-parent {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: none;
  border: none;
  padding: 1rem 1.25rem;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--txt-dark, #1a1a1a);
  cursor: pointer;
  text-align: left;
}

.oo-mobile-chevron {
  transition: transform .25s ease;
  font-size: .85rem;
}

.oo-mobile-parent[aria-expanded="true"] .oo-mobile-chevron {
  transform: rotate(180deg);
}

/* Sous-menu fermé par défaut */
.oo-mobile-sub {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s ease;
  background: var(--bg-light, #faf6ee);
}

.oo-mobile-sub.is-open {
  max-height: 1000px;
}

.oo-mobile-link {
  display: block;
  padding: .8rem 1.25rem .8rem 2rem;
  color: var(--txt-dark, #1a1a1a);
  text-decoration: none;
  font-size: 1rem;
}

.oo-mobile-link--solo {
  padding-left: 1.25rem;
  font-weight: 600;
}

.oo-mobile-link:active,
.oo-mobile-link:focus-visible {
  background: #fff;
  outline: 2px solid var(--oo-dore, #DCBA57);
  outline-offset: -2px;
}

/* Verrou du scroll body quand le menu est ouvert */
body.oo-mobile-open {
  overflow: hidden;
}

@media (max-width: 776px) {
  #_mobile_top_menu {
    padding: 0 .4rem;
  }

  #mobile_top_menu_wrapper {
    background: transparent;
  }

  #mobile_top_menu_wrapper #top-menu {
    padding: 0 .4rem;
    text-align: center;
    margin-bottom: 0;
  }

  #mobile_top_menu_wrapper #top-menu li {
    display: inline-block;
  }

  #header .top-menu a[data-depth="0"] {
    padding: .35rem;
    font-size: .95rem;
    color: var(--txt-dark);
  }

  #header .top-menu a[data-depth="0"] .fa-solid {
    font-size: .6rem;
  }
}

/* ----- SECTION MAIN MENU - PSEUDO MEGA MENU ----- */
#header .menu>ul>li .sub-megamenu[data-depth="1"] {
  max-width: 1200px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.8rem 1rem;
  margin: 0 auto;
  padding: 0.2rem;
  list-style: none;
}

#header .menu>ul>li:last-child .sub-megamenu[data-depth="1"] {
  max-width: 1200px;
  display: block;
  column-count: 4;
  column-gap: 1rem;
  margin: 0 auto;
  padding: 0.2rem;
}

.top-menu .sub-megamenu[data-depth="1"] li {
  font-size: 1rem;
  text-transform: none;
  font-weight: 600;
  text-align: left;
}

.top-menu.sub-megamenu[data-depth="1"]>.category.child {
  min-width: 0;
  /* évite le débordement des textes longs */
  break-inside: avoid;
  /* empêche un bloc d'être coupé entre 2 colonnes */
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  /* vieux WebKit */
  display: inline-block;
  /* nécessaire pour que break-inside marche partout */
  width: 100%;
  margin-bottom: .8rem;
}

#header .sub-megamenu a {
  padding: .3rem .9rem;
  line-height: 1.2rem;
  text-wrap-mode: wrap;
  font-size: .95rem;
  display: block;
}

#header .menu>ul>li.parent>a {
  text-transform: uppercase;
  font-size: 1.1rem;
  letter-spacing: 1px;
}

.menu-icon-chevron {
  color: var(--oo-rouge);
  font-size: .9rem;
}

.top-menu .sub-menu ul[data-depth="1"]>li {
  margin: 0 .65rem;
}

.top-menu .sub-menu ul[data-depth="1"]>li a:hover {
  background-color: var(--bg-light);
}


/* ----- SECTION TITLES ----- */
.title-row {
  text-align: center;
  margin-bottom: 2rem;
}

.title-row h2 {
  color: var(--txt-dark);
  font-family: 'Vollkorn', Georgia, serif;
  font-size: 2.3rem;
  font-weight: 600;
  margin: .5rem 0 2rem;
  text-align: center;
  text-transform: none;
}

.title-row h3 {
  color: var(--oo-dore);
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 600;
}

@media (max-width: 767px) {
  .title-row {
    margin-bottom: .4rem;
    padding: 0 .4rem;
  }

  .title-row h2 {
    font-size: 1.8rem;
  }

  .title-row h3 {
    font-size: 1rem;
  }
}

@media (max-width: 576px) {
  .title-row h2 {
    font-size: 1.45rem;
  }

  .title-row h3 {
    font-size: .8rem;
  }
}

/* ----- BOOTSTRAP RESET PAGE ----- */
#wrapper {
  padding-top: 0;
  background-color: transparent;
  overflow-x: hidden;
}

.page-search #wrapper {
  background-color: var(--bg-light-odd);
}

@media (min-width:1200px) {
  .container {
    width: var(--oo-container);
    max-width: 100%
  }
}

main {
  background-color: var(--bg-very-light);
  overflow: hidden;
}

.page-index #main .page-footer {
  display: none;
}

/* ----- SECTION BOUTIQUE ----- */
.boutique-section {
  padding: 4rem 0;
  background-color: var(--bg-fffefc);
  background-image: url('../img/m_oo_icon_motif.svg');
  background-repeat: repeat;
  background-size: 110px 110px;
  box-shadow: 0px 1px 9px 2px #d9c1a16e;
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  z-index: 4;
}

.boutique-section .row.boutique-content {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}

.boutique-section #custom-text {
  padding: 2.8rem 6.5rem 2.8rem 2.4rem;
  width: 64%;
  margin-bottom: .5rem;
  text-align: center;
  background: #fff;
  border-radius: 2px;
  box-shadow: 2px 2px 8px 2px #cba66f61;
}

.boutique-photo {
  margin: 40px 0 0 -58px;
  width: 34%;
}

.boutique-section #custom-text h2 {
  color: var(--txt-dark);
  font-family: 'Vollkorn', Georgia, serif;
  font-size: 2rem;
  font-weight: 600;
  text-align: left;
  text-transform: none;
  margin-bottom: .9rem;
}

.boutique-section #custom-text h3 {
  color: var(--oo-dore);
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 600;
  text-align: left;
}

.boutique-txt .metro-icon,
.boutique-section #custom-text .metro-icon {
  padding-left: 2rem;
  line-height: 1.5;
  background: url('../img/Paris_metro_4.svg') no-repeat left center;
  background-size: 22px 22px;
}

.boutique-txt .jour,
.boutique-section #custom-text .jour {
  text-align: right;
  float: left;
  width: 30%;
  padding-right: 2%;
}

.boutique-txt .horaire .boutique-section #custom-text .horaire {
  float: left;
  width: 68%;
}

.boutique-section h4 {
  color: var(--oo-rouge);
  font-weight: 600;
  font-size: 1.2rem;
  text-align: left;
}

.boutique-section#custom-text .page-content.page-cms ul,
.boutique-section #custom-text p,
.page-content.page-cms #custom-text ul {
  font-size: 1.1rem;
  text-align: left;
  line-height: 1.5;
  margin-bottom: 1.5rem;
}

.devanture,
.boutique-photo img {
  border: 4px solid white;
  box-shadow: 2px 2px 9px 2px #99784654;
  transform: rotate(1.7deg);
}


@media (max-width: 999px) {
  .boutique-section .row.boutique-content {
    flex-direction: column-reverse;
  }

  .boutique-section #custom-text {
    padding: 4rem 2rem 2rem;
    width: 94%;
  }

  .boutique-photo {
    width: 50%;
    margin: 20px auto -40px;
  }

}

/* ----- SECTION REASSURANCE ----- */
section.reassurance-section {
  padding: 4.2rem 0 1.4rem;
  width: 100vw;
  position: relative;
  background-color: var(--bg-light);
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  z-index: 2;
}

@media (max-width: 776px) {
  .reassurance-row {
    margin: 0 .2rem 0 .8rem;
  }

  section.reassurance-section {
    padding: 2.4rem 0 1.2rem;
  }
}

.reassurance-item h4 {
  color: var(--oo-dore);
  font-family: 'Vollkorn', Georgia, serif;
  font-weight: 600;
  font-size: 1.2rem;
}

.reassurance-item {
  padding-left: 85px;
  margin-bottom: 2rem;
}

.reassurance-item.livraison {
  background: url('../img/m_oo_icon_livraison.svg') no-repeat left top;
  background-size: 74px 47px;
}

.reassurance-item.artisans {
  background: url('../img/m_oo_icon_soutien.svg') no-repeat left top;
  background-size: 67px 56px;
}

.reassurance-item.paris {
  background: url('../img/m_oo_icon_paris.svg') no-repeat left top;
  background-size: 76px 79px;
}

.reassurance-item.secure {
  background: url('../img/m_oo_icon_secure.svg') no-repeat left top;
  background-size: 71px 62px;
}

/* ----- FOOTER ----- */
#footer {
  padding-top: 0;
}

#footer a {
  transition: color 0.2s ease-in-out;
  color: inherit;
}

#footer a:hover {
  color: var(--oo-dore);
}

.footer-container {
  background-color: var(--oo-bleu);
  color: white;
  padding-top: 2.7rem;
}

.footer-container .container-fluid {
  max-width: 1350px;
}

.footer-nl {
  background-color: var(--oo-rouge);
  color: white;
  padding: 2.1rem 0 .5rem;
}

/* ----- NEWSLETTER & réseaux sociaux social icons ----- */

.block_newsletter {
  background: transparent;
}

.block_newsletter .row {
  max-width: 600px;
  font-size: 1.1rem;
  margin: auto;
}

.footer-nl .block_newsletter form input[type=email] {
  border-radius: 20px;
  padding: 10px 14px;
  border: 0;
  line-height: 1.2;
}

.footer-nl .block_newsletter form input[type=email]::placeholder {
  color: var(--oo-rouge);
}

#footer .block_newsletter p {
  color: white;
  line-height: 1.25;
  text-align: center;
  font-size: .9rem;
}

.footer-nl h3 {
  font-family: 'Vollkorn', Georgia, serif;
  font-size: 1.65rem;
  color: white;
  font-weight: 500;
  text-transform: none;
  text-align: center;
  width: 90%;
  margin: 8px auto 15px;
}

.footer-nl .btn-primary,
.footer-nl .btn-primary:hover {
  color: #fff;
  background-color: var(--oo-bleu);
  border-color: transparent;
  transition: all 0.2s ease-in-out;
  border-radius: 20px;
}

.footer-nl .btn-primary:hover {
  background-color: var(--oo-dore);
}

.footer-social-wrapper {
  padding-bottom: 1rem;
}

.footer-nl .nl-social-icons {
  font-size: 2.2rem;
  justify-content: center;
}

.block-social ul li {
  /* display: inline-block;
  width: 2.5rem;
  height: 2.5rem;
  margin: .125rem;
  cursor: pointer;*/
  color: white;
  background-color: transparent;
  transition: all .15s ease-in;
  background-image: none !important;
  width: auto;
  height: auto;
}

.block-social ul li a {
  color: white;
  overflow: visible;
  text-indent: initial;
  white-space: initial;
}

.block-social ul li a:hover,
.block-social ul li:hover {
  color: var(--oo-dore);
}

.facebook::before,
.instagram::before,
.block-social ul li a::before {
  background-image: none !important;
}

.footer-container .h3 {
  font-family: 'Vollkorn', Georgia, serif;
  font-size: 1.7rem;
  color: white;
  font-weight: 500;
  text-transform: none;
}

.footer-container p {
  color: white;
  margin-bottom: .5rem;
}

.footer-container .links {
  margin-bottom: .15rem;
}

.footer-container .links li {
  margin-bottom: .75rem;
}

.block-contact,
.footer-container .links li a {
  font-size: 1rem;
  color: white;
}

.footer-container .links li a:hover {
  color: var(--oo-dore);
}

.footer-logo {
  width: 100%;
  margin-bottom: 1rem;
}

.footer-logo-img {
  max-width: 320px;
  height: auto;
  padding-bottom: .8rem;
}

.footer-container .links .contact-icons li {
  padding: 0 0 .2rem;
  margin-bottom: .2rem;
}

.footer-container .links .contact-icons li.footer-boutique {
  margin-bottom: 0 !important;
}

.footer-container .links .contact-icons .footer-horaires .col-jour {
  width: 40%;
  float: left;
  text-align: right;
}

.footer-container .links .contact-icons .footer-horaires .col-horaire {
  width: 59%;
  float: left;
  text-align: left;
}

.footer-container .links .contact-icons .footer-phone p,
.footer-container .links .contact-icons .footer-maps p,
.footer-container .links .contact-icons .boutique-icon p {
  padding-left: 2rem;
  line-height: 1.6;
  position: relative;
}

.footer-container .links .contact-icons .footer-maps p a {
  line-height: 2.5;
}

.footer-container .links .contact-icons .footer-phone p::before {
  font-family: 'Font Awesome 7 Free';
  font-weight: 700;
  /* obligatoire pour les icônes solid */
  content: "\f095";
  /* fa-location-dot (marqueur d'adresse) */
  position: absolute;
  left: 0;
  top: 0;
  /* ajuste l'alignement vertical */
  font-size: 20px;
  color: white;
  /* ou la couleur que tu veux */
}

.footer-container .links .contact-icons .boutique-icon p::before {
  font-family: 'Font Awesome 7 Free';
  font-weight: 700;
  /* obligatoire pour les icônes solid */
  content: "\f54e";
  /* fa-location-dot (marqueur d'adresse) */
  position: absolute;
  left: 0;
  top: 0;
  /* ajuste l'alignement vertical */
  font-size: 20px;
  color: white;
  /* ou la couleur que tu veux */
}

.footer-container .links .contact-icons .footer-maps p::before {
  font-family: 'Font Awesome 7 Free';
  font-weight: 700;
  /* obligatoire pour les icônes solid */
  content: "\f5a0";
  /* fa-location-dot (marqueur d'adresse) */
  position: absolute;
  left: 0;
  top: 0.15em;
  /* ajuste l'alignement vertical */
  font-size: 22px;
  color: white;
  /* ou la couleur que tu veux */
}

.footer-container .links .contact-icons .metro-icon p {
  padding-left: 2rem;
  line-height: 1.5;
  background: url('../img/Paris_metro_4.svg') no-repeat left center;
  background-size: 22px 22px;
}

.footer-container .links .contact-icons .bus-icon p {
  padding-left: 2rem;
  line-height: 1.5;
  background: url('../img/bus_paris.svg') no-repeat left center;
  background-size: 22px 22px;
}

.footer-bottom-bar p {
  color: white;
  letter-spacing: 1px;
  font-size: .8rem;
}

.footer-bottom-bar {
  border-top: 1px solid rgba(255, 255, 255, 0.25);
  padding: 13px 0 0;
  color: white;
}

.footer-social-icons {
  text-align: right;
  font-size: 1.5rem;
}

.footer-oo {
  margin: 2.2rem 0 .2rem;
}

.footer-oo h3 {
  font-family: 'Vollkorn', Georgia, serif;
  font-size: 1.4rem;
  color: white;
  font-weight: 500;
  text-transform: none;
}

@media (max-width: 767px) {
  .footer-container .links ul {
    background-color: transparent;
  }

  .footer-container .links ul>li {
    font-weight: 500;
    padding: .3rem .6rem;
    border-bottom: 1px solid #efeaea26;
  }

  .footer-container .links {
    padding: 0 1.5rem;
  }

  .footer-container .links .h3 {
    font-size: 1.5rem;
    line-height: 1.5;
    margin-bottom: .4rem;
    padding-left: .6rem;
    ;
  }

  .footer-logo {
    text-align: center;
    padding-top: .6rem;
  }

  .links.block-contact .title {
    display: none;
  }

  .footer-social-wrapper {
    padding-top: 1rem;
  }

  /* .footer-container .links .contact-icons li {
    text-align: center;
  } */
  .footer-nl .block_newsletter form input[type=email]::placeholder {
    font-size: .95rem;
  }
}

@media (max-width: 576px) {
  .footer-nl h3 {
    width: 100%;
    font-size: 1.25rem;
  }

  .footer-oo {
    text-align: center;
    margin: 1.7rem 0 .7rem;
  }

  .footer-container .links .contact-icons .footer-horaires .col-horaire,
  .footer-container .links .contact-icons .footer-horaires .col-jour {
    width: 50%;
  }
}

/* ----- PRODUCTS RESET PAGE ----- */
.products article .wishlist-button-add {
  background: transparent;
  box-shadow: none;
}

.product-miniature .thumbnail-container {
  width: 100%;
}

/* ----- BANNERS ----- */

/* ----- SECTION HOMEPAGE BANNERS ----- */
.home-banners {
  padding: 1.4rem 0 2.4rem;
}

.home-banners .row {
  display: grid;
  grid-template-columns: 53% 1fr;
  /* gauche ~53%, droite le reste */
  grid-template-rows: 1fr 1fr;
  /* deux rangées égales à droite */
  gap: 2rem;
}

.oohb-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  grid-auto-rows: minmax(230px, 1fr);
  gap: 1.5rem;
  max-width: 1240px;
  margin: 0 auto;
  padding: 2rem 1rem;
}

.oohb-card--large {
  grid-column: 1;
  grid-row: 1 / 3;
}

.oohb-card--top {
  grid-column: 2;
  grid-row: 1;
}

.oohb-card--bottom {
  grid-column: 2;
  grid-row: 2;
}

.oohb-card {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  min-height: 230px;
}

.oohb-link {
  display: block;
  height: 100%;
  text-decoration: none;
}

.oohb-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
}

.oohb-card:hover .oohb-img {
  transform: scale(1.04);
}

.oohb-caption {
  position: absolute;
  left: 0;
  bottom: 1.5rem;
  max-width: 88%;
  padding: .9rem 1.4rem;
  background: var(--oo-rouge, #BF0D3D);
  color: #fff;
}

.oohb-card--top .oohb-caption,
.oohb-card--bottom .oohb-caption {
  left: initial;
  right: 0;
}

.oohb-title {
  font-family: 'Vollkorn', serif;
  font-size: 1.35rem;
  margin: 0 0 .25rem;
  color: #fff;
}

.oohb-desc {
  margin: 0;
  font-size: .95rem;
  line-height: 1.35;
  color: #fff;
}

.oohb-link:focus-visible {
  outline: 3px solid var(--oo-dore, #DCBA57);
  outline-offset: 2px;
}


@media (max-width: 999px) {
  .oohb-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
  }

  .oohb-card--large,
  .oohb-card--top,
  .oohb-card--bottom {
    grid-column: 1;
    grid-row: auto;
  }

  .oohb-caption {
    left: initial;
    right: 0;
  }
}

@media (max-width: 767px) {
  .oohb-caption {
    bottom: 1.3rem;
    max-width: 100%;
    width: 100%;
    padding: .5rem .8rem;
  }

  .oohb-title {
    font-size: 1.2rem;
  }

  .oohb-desc {
    font-size: 1rem;
  }

  .oohb-grid {
    padding: .4rem .4rem 1rem;
  }

  .home-banners {
    padding: .2rem 0 2.4rem;
  }
}

@media (max-width: 576px) {
  .oohb-caption {
    bottom: 1rem;
    padding: .5rem .7rem;
  }

  .oohb-title {
    font-size: 1.05rem;
  }

  .oohb-desc {
    font-size: .85rem;
  }
}