/* Cartes communes aux propositions Signature photo et film. */
.signature-experiences {
  width: min(700px, calc(100% - 2rem));
  margin: clamp(2.6rem, 6vw, 4.5rem) auto;
  color: #241f29;
  font-family: inherit;
  scroll-margin-top: 110px;
}

.signature-experiences__heading {
  max-width: 620px;
  margin: 0 auto 1.1rem;
  text-align: center;
}

.signature-experiences__eyebrow {
  display: inline-block;
  margin-bottom: 0.48rem;
  color: #916a2e;
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.signature-experiences__heading h2 {
  margin: 0;
  color: #211b27;
  font-family: inherit;
  font-size: clamp(1.65rem, 3.2vw, 2.2rem);
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.08;
}

.signature-experiences__heading p {
  margin: 0.62rem auto 0;
  color: #746d80;
  font-size: 0.9rem;
  line-height: 1.5;
}

.signature-carousel { position: relative; }
.signature-carousel__viewport { box-sizing: border-box; overflow: hidden; padding: 5px; border-radius: 22px; transition: height 320ms ease; }
.signature-carousel__track { display: flex; align-items: flex-start; transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1); will-change: transform; }
.signature-carousel__slide { display: flex; min-width: 100%; align-items: flex-start; padding: 0.1rem; box-sizing: border-box; }

.signature-offer-card {
  display: grid;
  width: min(100%, 400px);
  min-height: 0;
  grid-template-columns: 1fr;
  margin: 0 auto;
  align-self: flex-start;
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: 20px;
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(145deg, #9c7839 0%, #f3dda3 45%, #b58a3d 100%) border-box;
  box-shadow: 0 15px 34px rgba(56, 42, 67, 0.12), 0 4px 14px rgba(0, 0, 0, 0.08);
}

.signature-offer-card__identity {
  position: relative;
  display: grid;
  justify-items: center;
  padding: 1.35rem 1.45rem 0.95rem;
  background: #fff;
  color: #241f29;
  text-align: center;
}

.signature-offer-card__identity::after {
  position: absolute;
  right: 8%;
  bottom: 0;
  left: 8%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(177, 133, 61, 0.48), transparent);
  content: "";
}

.signature-offer-card__label {
  align-self: auto;
  margin-bottom: 0.72rem;
  padding: 0.38rem 0.62rem;
  border: 1px solid rgba(166, 125, 56, 0.42);
  border-radius: 999px;
  color: #79571f;
  background: #fffaf0;
  font-size: 0.61rem;
  font-weight: 850;
  letter-spacing: 0.085em;
  line-height: 1.15;
  text-transform: uppercase;
}

.signature-offer-card h3 {
  margin: 0;
  color: #211b27;
  font-family: inherit;
  font-size: clamp(1.65rem, 4vw, 2.15rem);
  font-style: normal;
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.05;
}

.signature-offer-card__promise {
  max-width: 42ch;
  margin: 0.52rem 0 0;
  color: #746d80;
  font-size: 0.82rem;
  line-height: 1.45;
}

.signature-offer-card__price {
  margin: 0.8rem 0 0;
  color: #655ff6;
  font-family: inherit;
  font-size: clamp(2.05rem, 5vw, 2.7rem);
  font-weight: 850;
  letter-spacing: -0.045em;
  line-height: 1;
}

.signature-offer-card__price--words { color: #79571f; font-size: clamp(1.55rem, 4vw, 2rem); }

.signature-offer-card__saving {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.16rem 0.42rem;
  margin: 0.72rem 0 0;
  color: #7d7580;
  font-size: 0.7rem;
  line-height: 1.4;
}

.signature-offer-card__saving strong { color: #684b20; font-size: inherit; }

.signature-offer-card__content {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: flex-start;
  padding: 1.05rem 1.45rem 1.4rem;
  background: #fff;
}

.signature-offer-card__benefits,
.signature-options-list { display: grid; gap: 0.72rem; margin: 0; padding: 0; list-style: none; }
.signature-offer-card__benefits li { position: relative; display: grid; gap: 0.15rem; padding-left: 1.45rem; }

.signature-offer-card__benefits li::before {
  position: absolute;
  top: 0.12rem;
  left: 0;
  display: grid;
  width: 0.9rem;
  height: 0.9rem;
  place-items: center;
  border: 1px solid #c69e53;
  border-radius: 50%;
  color: #987135;
  content: "✓";
  font-size: 0.54rem;
  font-weight: 900;
}

.signature-offer-card__benefits strong,
.signature-options-list strong { color: #2d2430; font-size: 0.86rem; }
.signature-offer-card__benefits span,
.signature-options-list span { color: #746d80; font-size: 0.76rem; line-height: 1.42; }

/* Une seule différence décisive attire l'œil sur chaque carte, sans ajouter de bloc. */
.signature-offer-card__benefits li.signature-benefit--spotlight {
  isolation: isolate;
  overflow: hidden;
  padding: 0.58rem 0.68rem 0.58rem 1.9rem;
  border: 1px solid rgba(111, 83, 212, 0.22);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(244, 241, 255, 0.96), rgba(255, 246, 253, 0.96));
  box-shadow: 0 6px 15px rgba(91, 61, 180, 0.07);
}

.signature-offer-card__benefits li.signature-benefit--spotlight::before {
  top: 0.62rem;
  left: 0.58rem;
  z-index: 2;
  border-color: #7657e8;
  color: #fff;
  background: linear-gradient(135deg, #7153e8, #a254d2);
  box-shadow: 0 0 0 3px rgba(113, 83, 232, 0.1);
}

.signature-offer-card__benefits li.signature-benefit--spotlight::after {
  position: absolute;
  top: -35%;
  bottom: -35%;
  left: 0;
  z-index: 0;
  width: 18%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.88), transparent);
  content: "";
  opacity: 0;
  transform: translateX(-150%) rotate(10deg);
}

.signature-benefit--spotlight strong,
.signature-benefit--spotlight span { position: relative; z-index: 1; }
.signature-benefit--spotlight strong { color: #50347f; }

.signature-carousel__slide.is-active .signature-benefit--spotlight::before {
  animation: signature-spotlight-pulse 2.8s ease-in-out infinite;
}

.signature-carousel__slide.is-active .signature-benefit--spotlight::after {
  animation: signature-spotlight-glint 5.2s ease-in-out infinite;
}

.signature-offer-card__deliverables {
  margin: 0.9rem 0;
  padding: 0.68rem 0;
  border-top: 1px solid #eee9e1;
  border-bottom: 1px solid #eee9e1;
  color: #655d68;
  font-size: 0.72rem;
  font-weight: 650;
  line-height: 1.5;
  text-align: center;
}

.signature-offer-card__deliverables span { margin: 0 0.22rem; color: #b28843; }
.signature-offer-card__deliverable-link { color: #765321; font-weight: 850; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
.signature-offer-card__deliverable-link:hover { color: #5c3e12; }

.signature-offer-card__cta {
  display: inline-flex;
  width: fit-content;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  align-self: center;
  box-sizing: border-box;
  padding: 0.72rem 1.05rem;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, #6847ef, #a149da);
  box-shadow: 0 8px 20px rgba(96, 61, 184, 0.18);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.signature-offer-card__cta:hover { box-shadow: 0 11px 26px rgba(96, 61, 184, 0.25); transform: translateY(-2px); }
.signature-offer-card__content > small { margin-top: 0.52rem; color: #8b818d; font-size: 0.64rem; line-height: 1.35; text-align: center; }
.signature-offer-card__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.65rem 0.9rem; }

.signature-options-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.6rem; }
.signature-options-list li { display: grid; align-content: start; gap: 0.25rem; padding: 0.78rem; border: 1px solid rgba(171, 132, 66, 0.2); border-radius: 12px; background: #fffaf2; }
.signature-offer-card--options .signature-offer-card__cta { margin-top: 0.9rem; }

.signature-carousel__controls {
  display: grid;
  width: min(100%, 520px);
  grid-template-columns: 40px minmax(0, 1fr) 40px;
  align-items: center;
  justify-content: stretch;
  gap: 0.65rem;
  margin: 1rem auto 0;
}

.signature-experiences:not(.signature-experiences--film) .signature-carousel__controls { width: min(100%, 330px); }

.signature-carousel__arrow {
  display: grid;
  width: 40px;
  height: 40px;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(139, 103, 47, 0.3);
  border-radius: 12px;
  background: #fff;
  color: #5e4623;
  cursor: pointer;
  font-size: 1rem;
  transition: transform 180ms ease, background 180ms ease;
}

.signature-carousel__arrow:hover { background: #fffaf0; transform: translateY(-1px); }

.signature-carousel__dots {
  display: grid;
  align-items: stretch;
  grid-template-columns: repeat(6, 58px);
  justify-content: center;
  gap: 0.48rem;
}

.signature-experiences:not(.signature-experiences--film) .signature-carousel__dots { grid-template-columns: repeat(3, 58px); }

.signature-carousel__dots button {
  position: static;
  display: grid;
  width: 58px;
  height: 58px;
  min-width: 0;
  min-height: 0;
  align-content: center;
  justify-items: center;
  gap: 0.12rem;
  padding: 0.3rem;
  border: 1px solid #e7e1d8;
  border-radius: 50%;
  background: #fff;
  color: #746d80;
  cursor: pointer;
  font-family: inherit;
  text-align: center;
  transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.signature-carousel__dots button::before { display: none; content: none; }

.signature-carousel__dots button span { color: #a17a39; font-size: 0.55rem; font-weight: 850; line-height: 1; }
.signature-carousel__dots button strong { max-width: 100%; overflow: hidden; color: #4b4350; font-size: 0.56rem; line-height: 1.05; text-overflow: ellipsis; white-space: nowrap; }
.signature-carousel__dots button:hover { border-color: rgba(177, 133, 61, 0.55); background: #fffdf8; }
.signature-carousel__dots button.is-active { border-color: #b58a3d; background: #fffaf0; box-shadow: 0 5px 14px rgba(126, 91, 35, 0.11); }
.signature-carousel__dots button.is-active strong { color: #5f4218; }
.signature-carousel__counter { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.signature-carousel :focus-visible { outline: 3px solid rgba(177, 133, 61, 0.42); outline-offset: 2px; }

@keyframes signature-spotlight-pulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(113, 83, 232, 0.1); transform: scale(1); }
  50% { box-shadow: 0 0 0 6px rgba(113, 83, 232, 0.02); transform: scale(1.06); }
}

@keyframes signature-spotlight-glint {
  0%, 28% { opacity: 0; transform: translateX(-150%) rotate(10deg); }
  34% { opacity: 0.8; }
  58% { opacity: 0.8; transform: translateX(650%) rotate(10deg); }
  65%, 100% { opacity: 0; transform: translateX(650%) rotate(10deg); }
}

/* La carte Signature reste claire, y compris lorsque l’ancien thème sombre de la page est actif. */
[data-theme="dark"] .signature-experiences .signature-offer-card,
[data-theme="dark"] .signature-experiences .signature-offer-card__content { background: #fff; }
[data-theme="dark"] .signature-experiences .signature-offer-card__benefits strong { color: #2d2430; }
[data-theme="dark"] .signature-experiences .signature-offer-card__benefits span,
[data-theme="dark"] .signature-experiences .signature-offer-card__deliverables { color: #746d80; }

@media (max-width: 780px) {
  .signature-experiences { width: min(100% - 0.9rem, 680px); margin-block: 2.6rem; scroll-margin-top: 86px; }
  .signature-experiences__heading { margin-bottom: 1.05rem; padding-inline: 0.65rem; }
  .signature-experiences__heading h2 { font-size: clamp(1.55rem, 7vw, 2rem); }
  .signature-experiences__heading p { font-size: 0.82rem; }
  .signature-carousel__viewport { border-radius: 19px; }
  .signature-offer-card { border-radius: 17px; }
  .signature-offer-card__identity { padding: 1.35rem 1.15rem 0.95rem; }
  .signature-offer-card h3 { font-size: clamp(1.55rem, 7vw, 1.95rem); }
  .signature-offer-card__content { padding: 1rem 1.15rem 1.35rem; }
  .signature-offer-card__benefits { gap: 0.65rem; }
  .signature-options-list { grid-template-columns: 1fr; }
  .signature-offer-card__cta { width: 100%; }
  .signature-offer-card__actions { display: grid; }
  .signature-carousel__controls { grid-template-columns: 36px minmax(0, 1fr) 36px; gap: 0.4rem; }
  .signature-experiences:not(.signature-experiences--film) .signature-carousel__controls { width: min(100%, 290px); }
  .signature-carousel__arrow { width: 36px; height: 36px; border-radius: 10px; }
  .signature-carousel__dots { grid-template-columns: repeat(3, 52px); gap: 0.35rem; }
  .signature-experiences:not(.signature-experiences--film) .signature-carousel__dots { grid-template-columns: repeat(3, 52px); }
  .signature-carousel__dots button { width: 52px; height: 52px; padding: 0.25rem; border-radius: 50%; }
  .signature-carousel__dots button strong { font-size: 0.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  .signature-carousel__track,
  .signature-offer-card__cta,
  .signature-carousel__arrow,
  .signature-carousel__dots button { transition: none; }
  .signature-benefit--spotlight::before,
  .signature-benefit--spotlight::after { animation: none !important; }
}
