/*
 * CynoFlo 0.6.3 - Correctif visuel additif (source : 0.6.2)
 * Les 7 couleurs de la charte sont conservees dans theme.json et patch-v062.css.
 * Corrections limitees au hero, aux trois vagues, aux portraits des avis et
 * a la transition vers le rendez-vous. Aucune modification de contenu.
 * Design mobile first, animations respectueuses de prefers-reduced-motion.
 */
:root {
  /* Teintes derivees pour les transitions seulement, PAS une nouvelle palette officielle. */
  --cf-wave-hero-intermediaire: #F0E8E2;
  --cf-wave-avis-depart: #F1EAE5;
  --cf-wave-avis-intermediaire: #EAE0DA;
}
/* La version 0.6.2 utilise deja ces noms et les 7 couleurs exactes. */
.cyno-v06 .cf-hero {
  padding: clamp(2rem, 3.5vw, 4rem) 0 clamp(6.8rem, 9.3vw, 10rem) !important;
  overflow: hidden;
  isolation: isolate;
  position: relative;
}
.cyno-v06 .cf-hero-inner {
  width: min(1740px, calc(100% - clamp(2rem, 5vw, 6rem))) !important;
  max-width: 1740px !important;
  margin-inline: auto !important;
  padding: 0 !important;
  grid-template-columns: minmax(0, 0.94fr) minmax(0, 1.11fr) !important;
  gap: clamp(1.8rem, 3vw, 5rem) !important;
  align-items: center;
  z-index: 2;
}
.cyno-v06 .cf-hero-copy {
  padding-block: clamp(1.6rem, 2.5vw, 3.3rem);
  max-width: 690px;
}
.cyno-v06 .cf-title { max-width: 21ch; }
/* Un seul calque SVG peint les 3 bandes : aucune collision de pseudo-elements. */
.cyno-v06 .cf-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 -1px;
  width: 100%;
  height: clamp(107px, 10.5vw, 167px);
  background: url('../svg/vagues-hero-v063.svg') bottom center / 100% 100% no-repeat;
  opacity: 1;
  transform: none;
  pointer-events: none;
  z-index: 1;
}
/* Rotation et apparition dans le MEME transform pour eviter le saut final. */
.cyno-v06 .cf-hero-visual {
  width: 100%;
  max-width: 900px;
  margin: 0 0 0 auto !important;
  position: relative;
  z-index: 2;
  overflow: hidden;
  border: clamp(14px, 1.75vw, 28px) solid var(--cf-beige);
  border-radius: 18% 10% 19% 13% / 13% 27% 19% 22%;
  background: var(--cf-beige);
  box-shadow: 6px 14px 18px rgba(58,30,63,.14);
  transform: translate3d(0,0,0) rotate(1.5deg);
  animation: cf-v063-hero-reveal .85s cubic-bezier(.2,.67,.24,1) both !important;
  transform-origin: 50% 50%;
  will-change: auto;
}
@keyframes cf-v063-hero-reveal {
  from { opacity: 0; transform: translate3d(0,22px,0) rotate(1.5deg); }
  to { opacity: 1; transform: translate3d(0,0,0) rotate(1.5deg); }
}
.cyno-v06 .cf-hero-img {
  display: block;
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
  overflow: hidden;
  border-radius: inherit;
}
.cyno-v06 .cf-hero-img img {
  display: block;
  width: 100% !important;
  height: clamp(310px, 31vw, 565px) !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: 52% 50%;
  border-radius: 0 !important;
  transform: none !important;
  animation: none !important;
}
/* Quatre portraits parfaitement circulaires, y compris si Gutenberg injecte un style inline. */
.cyno-v06 .cf-review-card figure.wp-block-image.cf-review-avatar,
.cyno-v06 .cf-review-card .cf-review-avatar {
  width: 76px !important;
  height: 76px !important;
  min-width: 76px;
  max-width: 76px !important;
  min-height: 76px;
  max-height: 76px;
  aspect-ratio: 1 / 1;
  display: block;
  flex: 0 0 76px;
  margin: 0 auto 1.2rem !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  clip-path: circle(50% at 50% 50%);
  overflow: hidden !important;
}
.cyno-v06 .cf-review-card .cf-review-avatar > img,
.cyno-v06 .cf-review-card figure.wp-block-image.cf-review-avatar > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 100%;
  min-height: 100%;
  max-width: none !important;
  max-height: none !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 50% !important;
  clip-path: circle(50% at 50% 50%);
  box-shadow: none !important;
}
.cyno-v06 .cf-reviews {
  padding-bottom: clamp(8.5rem, 13vw, 13rem) !important;
  isolation: isolate;
  overflow: hidden;
}
.cyno-v06 .cf-reviews::after {
  content: "";
  position: absolute;
  inset: auto 0 -1px;
  width: 100%;
  height: clamp(115px, 11.2vw, 176px);
  background: url('../svg/vagues-avis-v063.svg') bottom center / 100% 100% no-repeat;
  transform: none;
  opacity: 1;
  pointer-events: none;
  z-index: 0;
}
.cyno-v06 .cf-reviews > .cf-container {position: relative;z-index: 1;}
.cyno-v06 .cf-review-grid { align-items: start !important; }
.cyno-v06 .cf-review-card {
  min-width: 0;
  height: auto;
  align-self: start;
}
.cyno-v06 .cf-review-card:nth-child(2),
.cyno-v06 .cf-review-card:nth-child(4) {margin-top: 1.35rem !important;}
.cyno-v06 .cf-review-card:nth-child(3) {margin-top: .58rem !important;}
.cyno-v06 .cf-bottom-cta {
  position: relative;
  z-index: 2;
  margin-top: clamp(2rem, 4vw, 3.6rem) !important;
}
/* Raccord sans ligne dure : le dernier path SVG devient le fond du bloc suivant. */
.cyno-v06 .cf-booking { background-color: var(--cf-beige); }
@media (max-width: 1024px) {
  .cyno-v06 .cf-hero-inner {
    max-width: 940px !important;
    grid-template-columns: minmax(0,.91fr) minmax(0,1.09fr) !important;
  }
  .cyno-v06 .cf-hero-img img { height: clamp(280px, 33vw, 450px) !important; }
  .cyno-v06 .cf-review-card:nth-child(n) {margin-top: 0 !important;}
}
@media (max-width: 700px) {
  .cyno-v06 .cf-hero { padding: 2rem 0 7rem !important; }
  .cyno-v06 .cf-hero-inner {
    width: min(640px, calc(100% - 2rem)) !important;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 1.4rem !important;
  }
  .cyno-v06 .cf-hero-copy {max-width: none;padding: .3rem 0 0;}
  .cyno-v06 .cf-title {max-width: none;}
  .cyno-v06 .cf-hero-visual {
    width: min(100%, 600px);
    max-width: 100%;
    margin-inline: auto !important;
    border-width: 12px;
    transform: rotate(.7deg);
    animation-name: cf-v063-hero-reveal-mobile !important;
  }
  @keyframes cf-v063-hero-reveal-mobile {
    from { opacity: 0; transform: translate3d(0,16px,0) rotate(.7deg); }
    to { opacity: 1; transform: translate3d(0,0,0) rotate(.7deg); }
  }
  .cyno-v06 .cf-hero-img img {
    height: auto !important;
    aspect-ratio: 1.6 / 1 !important;
    object-fit: cover;
  }
  .cyno-v06 .cf-hero::after {height: 105px;}
  .cyno-v06 .cf-reviews::after {height: 117px;}
  .cyno-v06 .cf-reviews {padding-bottom: 9rem !important;}
  .cyno-v06 .cf-review-card:nth-child(n) {margin-top: 0 !important;}
  .cyno-v06 .cf-review-card figure.wp-block-image.cf-review-avatar {width: 76px !important;height:76px !important;}
}
@media (prefers-reduced-motion: reduce) {
  .cyno-v06 .cf-hero-visual,
  .cyno-v06 .cf-hero-img img {animation: none !important;transition: none !important;}
  .cyno-v06 .cf-hero-visual {opacity:1;transform:rotate(1.5deg);}
}
