/* ============================================================
   Bellevue V3 — « la pâtisserie »
   Miremont est une pâtisserie de 1872 et Biarritz est une ville
   d'arcades Belle Époque : le site passe des angles vifs aux
   courbes généreuses, avec des photos verticales en arche qui
   rappellent les baies vitrées face à l'océan.
   Chargé après v2.css, ne modifie pas la maquette Webflow.
   ============================================================ */
:root {
  --v3-r-xs: 10px;
  --v3-r-sm: 16px;
  --v3-r: 24px;
  --v3-r-lg: 34px;
  /* arche : plein cintre en haut, presque droit en bas */
  --v3-arch: 48% 48% 20px 20px / 30% 30% 4% 4%;
  --v3-arch-in: 47% 47% 12px 12px / 29% 29% 3% 3%;
  /* ombres chaudes et superposées, jamais de gris */
  --v3-sh: 0 2px 6px rgba(74, 51, 18, .05), 0 14px 30px rgba(74, 51, 18, .10);
  --v3-sh-hi: 0 6px 14px rgba(74, 51, 18, .09), 0 28px 54px rgba(74, 51, 18, .18);
  --v3-hairline: inset 0 0 0 1px rgba(196, 138, 45, .30);
}

/* ---------- 1. HERO : cadres arrondis, deux arches ---------- */
.hg_box {
  border-radius: var(--v3-r);
  box-shadow: var(--v3-sh);
}
.hg_box .hg_img-wrapper,
.hg_box .hg_img,
.hg_box .hg_img-overlay {
  border-radius: 12px;
}
.hg_box .hg_img-wrapper { box-shadow: var(--v3-hairline); }

/* les deux photos verticales prennent l'arche */
.hg_img-left-1,
.hg_img-right-1 { border-radius: var(--v3-arch); }
.hg_img-left-1 .hg_img-wrapper,
.hg_img-left-1 .hg_img,
.hg_img-left-1 .hg_img-overlay,
.hg_img-right-1 .hg_img-wrapper,
.hg_img-right-1 .hg_img,
.hg_img-right-1 .hg_img-overlay { border-radius: var(--v3-arch-in); }
/* le liseré du voile au survol suit la courbe */
.hg_img-left-1 .hg_img-overlay::after,
.hg_img-right-1 .hg_img-overlay::after { border-radius: 44% 44% 6px 6px / 26% 26% 2% 2%; }
.hg_img-overlay::after { border-radius: 6px; }

/* panneau doré du menu et cartouche du logo */
.hg_box-menu,
.hg_box-right-logo { border-radius: var(--v3-r); }
.hg_box-logo-wrapper { border-radius: var(--v3-r-xs); }
/* le panneau doré « Menu » à l'intérieur du cadre suit les photos */
.hg_box .hg_box-overlay { border-radius: 12px; }

/* ---------- 2. GALERIE ---------- */
.tambour-gallery-img,
.home-new-gallery_content img {
  border-radius: var(--v3-r);
  box-shadow: var(--v3-sh);
}

/* ---------- 3. ÉVÉNEMENTS PRIVÉS ---------- */
.hpe_green-box {
  border-radius: var(--v3-r-lg);
  box-shadow: var(--v3-sh);
}
.hpe-img {
  border-radius: var(--v3-r);
  box-shadow: var(--v3-sh);
}
.hpe-img-full { border-radius: var(--v3-r-lg); }

/* ---------- 4. TÉMOIGNAGES ---------- */
.testimonial_card img,
.testimonials_content img {
  border-radius: var(--v3-r);
  box-shadow: var(--v3-sh);
}

/* ---------- 5. ENCART CTA ---------- */
.cta_box,
.cta_box > img,
.cta_box .bg_img {
  border-radius: var(--v3-r-lg);
  overflow: hidden;
}

/* ---------- 6. BOUTONS EN PASTILLE ---------- */
.button,
.button.is-secondary,
.w-button { border-radius: 999px; }

/* ---------- 7. FRISE INSTAGRAM (V2) ---------- */
.v2-ig-track > a { border-radius: var(--v3-r-sm); }
.v2-ig-track > a > .ig-img,
.v2-ig-track > a > .ig-img img,
.v2-ig-track > a > .ig-img video,
.v2-ig-track > a > .ig_img-overlay { border-radius: 9px; }

/* ---------- 8. LECTEUR SPOTIFY ---------- */
.section_home-playlist iframe { border-radius: var(--v3-r); }

/* ---------- 9. PLUS DE RELIEF AU SURVOL ---------- */
@media (prefers-reduced-motion: no-preference) {
  .hg_box:hover,
  .v2-ig-track > a:hover { box-shadow: var(--v3-sh-hi); }
  .hpe-img, .tambour-gallery-img, .testimonial_card img {
    transition: transform .5s cubic-bezier(.2, .7, .3, 1), box-shadow .5s ease;
  }
  .hpe-img:hover, .tambour-gallery-img:hover, .testimonial_card img:hover {
    transform: translateY(-4px);
    box-shadow: var(--v3-sh-hi);
  }
}

/* ---------- 10. COMPLÉMENTS ---------- */
/* photos des avis clients */
.testimonial_row-img {
  border-radius: var(--v3-r);
  box-shadow: var(--v3-sh);
}
/* carrousel de la galerie */
.box-style-img,
.box-challenges-carousel { border-radius: var(--v3-r); }

/* la grande photo de pâtisserie : emblème de la maison, elle prend
   l'arche comme les deux verticales du hero */
.tambour-col2-img {
  border-radius: var(--v3-arch);
  box-shadow: var(--v3-sh);
}

/* ---------- 11. PANNEAUX DORÉS : LISIBILITÉ ---------- */
/* la photo d'angle passait sous le texte blanc et le rendait
   illisible : voile doré dégradé entre la photo et le texte */
.hpe_green-box::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(112deg,
    rgb(196, 138, 45) 40%,
    rgba(196, 138, 45, .92) 58%,
    rgba(196, 138, 45, .35) 82%,
    rgba(196, 138, 45, .08) 100%);
}
.hpe_green-box-content {
  position: relative;
  z-index: 2;
}

/* ---------- 12. BOUTON « RÉSERVER » FIXE ---------- */
.tambour-lb {
  border-radius: var(--v3-r-sm);
  box-shadow: var(--v3-sh);
  overflow: hidden;
}

/* ---------- 13. FORMULAIRE EN CARTE ---------- */
/* le formulaire flottait sur le fond crème : on le pose sur une
   carte claire aux mêmes courbes que le reste du site */
.form-container {
  background: linear-gradient(180deg, rgba(255, 255, 255, .55), rgba(253, 254, 238, .35));
  border: 1px solid rgba(196, 138, 45, .28);
  border-radius: var(--v3-r-lg);
  box-shadow: var(--v3-sh);
  padding: 2.5rem clamp(1.25rem, 4vw, 3rem);
}
@media (max-width: 767px) {
  .form-container { padding: 1.75rem 1.1rem; border-radius: var(--v3-r); }
}

/* ---------- 14. CASE « MENU » SUR PETITS ÉCRANS ---------- */
/* sous 992px, la photo voisine disparaît et la case se tasse à la
   largeur du mot : « Menu » se retrouvait coupé. Largeur plancher. */
@media (max-width: 991px) {
  .hg_box-menu { min-width: 8rem; }
}
