/* ==========================================================================
   Mariama Palace — thème "soft & moderne, chic malien"
   Charte : terracotta / or sur fond ivoire, typographie serif élégante
   (assortie au logo) + Poppins pour le texte courant.
   Ce fichier se charge APRÈS css/style.css et le surcharge volontairement.
   ========================================================================== */

:root {
  --ink: #241a12;
  --ink-soft: #5c4d40;
  --cream: #fefaf3;
  --cream-deep: #fbe9cf;
  --terracotta: #e2592b;
  --terracotta-dark: #b8431c;
  --gold: #f0a93d;
  --green: #2f8f62;
  --line: rgba(36, 26, 18, 0.09);
  --shadow-soft: 0 20px 45px -20px rgba(36, 26, 18, 0.28);
}

/* ---- base ---- */
body {
  /* background: var(--cream); */
  color: var(--ink-soft);
  line-height: 1.75;
}
p {
  line-height: 1.75;
}

h1, h2, h3, h4, h5,
.h1, .h2, .h3, .h4, .h5,
.heading-section h2,
.ftco-heading-2 {
  font-family: "Playfair Display", "Poppins", Arial, serif;
  color: var(--ink);
}

/* section rhythm — replaces the blanket !important that was breaking
   .ftco-no-pt / .ftco-no-pb across the whole site */
.ftco-section {
  padding: 5em 0;
  position: relative;
}
.ftco-no-pt { padding-top: 0; }
.ftco-no-pb { padding-bottom: 0; }
.ftco-section.bg-light,
section.ftco-section:nth-of-type(even) {
  /* background: var(--cream-deep) !important; */
}

/* kicker + title, toned down from the 100px/50px vendor defaults so it
   reads as "soft" instead of shouting on every section */
.heading-section {
  text-align: center;
}
.heading-section .subheading {
  font-size: 42px;
  color: var(--terracotta);
}
.heading-section .subheading:after {
  content: '';
  display: block;
  width: 46px;
  height: 2px;
  margin: 14px auto 0;
  background: var(--gold);
}
.heading-section h2 {
  font-size: 32px;
  font-weight: 700;
  margin-top: 6px;
}
@media (max-width: 767.98px) {
  .heading-section .subheading { font-size: 34px; }
  .heading-section h2 { font-size: 26px; }
}

/* ---- top info bar ---- */
.top {
  background: var(--ink) !important;
  color: rgba(255, 255, 255, 0.85);
}
.top .icon {
  color: var(--gold);
}
.top .register-link span {
  color: rgba(255, 255, 255, 0.85);
}

/* ---- main nav : passe d'une barre noire opaque à une barre ivoire,
   toujours solide (plus fiable que l'effet transparent-sur-hero d'origine,
   qui était de toute façon cassé par la classe bg-dark sur le <nav>) ---- */
#ftco-navbar {
  background: var(--cream) !important;
  position: relative;
  top: 30px;
  border-bottom: 1px solid var(--line);
  padding: 3px 0;
  box-shadow: 0 6px 24px -18px rgba(36, 26, 18, 0.35);
}
#ftco-navbar .navbar-brand img {
  filter: none;
}
#ftco-navbar .container {
  max-width: 1280px;
}
#ftco-navbar .navbar-nav > .nav-item > .nav-link {
  color: var(--ink) !important;
  font-size: 12.5px;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-weight: 500;
  padding-left: 14px !important;
  padding-right: 14px !important;
  white-space: nowrap;
}
#ftco-navbar .navbar-nav > .nav-item > .nav-link:hover {
  color: var(--terracotta) !important;
}
#ftco-navbar .navbar-nav > .nav-item.active > a {
  color: var(--terracotta) !important;
}
#ftco-navbar .navbar-nav > .nav-item.cta > a {
  background: var(--terracotta) !important;
  color: #fff !important;
  border-radius: 30px;
  padding-left: 22px !important;
  padding-right: 22px !important;
}
#ftco-navbar .navbar-nav > .nav-item.cta > a:hover {
  background: var(--terracotta-dark) !important;
}
#ftco-navbar .navbar-toggler {
  color: var(--ink) !important;
}
@media (max-width: 991.98px) {
  #ftco-navbar .navbar-collapse {
    background: var(--cream);
  }
}

/* ---- buttons : coins doux, ombre légère ---- */
.btn {
  border-radius: 30px;
  letter-spacing: .02em;
}
.btn.btn-primary {
  background: var(--terracotta) !important;
  border-color: var(--terracotta) !important;
}
.btn.btn-primary:hover {
  color: var(--terracotta) !important;
}

/* ---- cartes menus / services / staff / blog : ombres douces, coins arrondis,
   et surtout un vrai padding pour que rien ne colle aux bordures ---- */
.menus,
.services,
.staff,
.blog-entry,
.block-18 {
  border-radius: 12px;
  overflow: hidden;
}
.menus {
  background: #fff;
  box-shadow: var(--shadow-soft);
}
.menus .menu-img {
  border-radius: 0;
}

/* services : icônes rondes (elles n'avaient pas de taille fixe et
   s'étiraient en ovales), 3 couleurs vives en rotation */
.services.block-6 {
  background: #fff;
  box-shadow: var(--shadow-soft);
  padding: 44px 30px;
  border-radius: 12px;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.services.block-6 .icon {
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  background: var(--cream-deep);
  color: var(--terracotta);
}
.services.block-6 .icon span {
  font-size: 40px !important;
}
.col-md-4:nth-of-type(2) .services.block-6 .icon {
  background: rgba(240, 169, 61, 0.18);
  color: var(--gold);
}
.col-md-4:nth-of-type(2) .services.block-6 .icon span {
  color: var(--gold);
}
.col-md-4:nth-of-type(3) .services.block-6 .icon {
  background: rgba(47, 143, 98, 0.15);
  color: var(--green);
}
.col-md-4:nth-of-type(3) .services.block-6 .icon span {
  color: var(--green);
}

.staff {
  box-shadow: var(--shadow-soft);
  background: #fff;
}
.staff .img {
  border-radius: 12px 12px 0 0;
}
.staff .text {
  padding: 20px 22px 26px;
}

.blog-entry {
  box-shadow: var(--shadow-soft);
  background: #fff;
}

/* compteurs : hauteur égale sur toute la ligne, contenu bien centré,
   vraie marge intérieure au lieu de 10px collés aux bords */
.counter-wrap {
  display: flex;
}
.block-18 {
  background: #fff;
  box-shadow: var(--shadow-soft);
  padding: 34px 20px;
  width: 100%;
  min-height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.block-18 .number {
  color: var(--terracotta);
}
.counter-wrap:nth-of-type(4n+2) .block-18 .number { color: var(--gold); }
.counter-wrap:nth-of-type(4n+3) .block-18 .number { color: var(--green); }
.counter-wrap:nth-of-type(4n+4) .block-18 .number { color: var(--terracotta-dark); }

/* ---- footer : brun espresso chaud + accent or, correction du bug de
   contraste sur .ftco-heading-2 (texte noir sur fond quasi-noir) ---- */
.ftco-footer {
  background: #1d1510;
  border-top: 3px solid var(--gold);
}
.ftco-footer .ftco-heading-2 {
  color: var(--gold) !important;
  font-family: "Playfair Display", serif;
}
.ftco-footer a:hover {
  color: var(--terracotta) !important;
}

/* ---- Plats du Jour : visible sans scroller, juste sous le héro raccourci ---- */
.platdujour-section {
  background: #fff;
  padding: 18px 0 16px;
  position: relative;
  z-index: 1;
}
.heading-section-sm .subheading {
  font-size: 22px;
  color: var(--terracotta);
  font-family: "Great Vibes", cursive;
  display: block;
  margin-bottom: 0;
  line-height: 1;
}
.heading-section-sm h2 {
  font-size: 19px;
  font-weight: 700;
  margin: 2px 0 0;
}
.platdujour-card {
  height: 128px;
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;
  margin-bottom: 16px;
  box-shadow: var(--shadow-soft);
  transition: transform .25s ease, box-shadow .25s ease;
}
.platdujour-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 40px -16px rgba(36, 26, 18, 0.4);
}
.platdujour-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}
#recipeCarousel .carousel-control-prev,
#recipeCarousel .carousel-control-next {
  top: 50%;
  width: 38px;
  height: 38px;
  transform: translateY(-50%);
  background: var(--terracotta);
  border-radius: 50%;
  opacity: .85;
}
#recipeCarousel .carousel-control-prev { left: -10px; }
#recipeCarousel .carousel-control-next { right: -10px; }
#recipeCarousel .carousel-control-prev:hover,
#recipeCarousel .carousel-control-next:hover {
  opacity: 1;
}
#recipeCarousel .carousel-control-prev-icon,
#recipeCarousel .carousel-control-next-icon {
  width: 16px;
  height: 16px;
}
.platdujour-modal-content {
  background: transparent;
  border: none;
}
.platdujour-modal-content .close {
  position: absolute;
  top: -34px;
  right: 0;
  color: #fff;
  opacity: 1;
  text-shadow: none;
  font-size: 30px;
  z-index: 2;
}
.platdujour-modal-content img {
  border-radius: 10px;
}

/* ---- reservation form over photo ---- */
.makereservation {
  border-radius: 14px;
  box-shadow: var(--shadow-soft);
  position: relative;
  z-index: 1;
}
section.ftco-section.img:has(.makereservation) {
  position: relative;
}
section.ftco-section.img:has(.makereservation):before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  background: rgba(20, 14, 9, 0.45);
}

/* ---- testimonials ---- */
.testimony-section {
  background: var(--cream-deep) !important;
}
.testimony-wrap .text {
  background: #fff;
  border-radius: 12px;
  box-shadow: var(--shadow-soft);
  padding: 34px 30px !important;
  height: 470px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
}
@media (max-width: 767.98px) {
  .testimony-wrap .text {
    height: auto;
  }
}
.testimony-wrap .user-img .quote {
  background: var(--terracotta);
}