/* Ty Plaisir — refonte gourmande
   Crème lumineuse, chocolat profond, une touche de beurre (le jaune du logo).
   Chargée après ty-plaisir.css et ty-plaisir-refonte.css. */

:root {
  /* Palette gourmande — crème beurrée + chocolat chaud */
  --tp-cream: #F6EBDD;
  --tp-cream-2: #EBD9C4;
  --tp-butter: #E0A83A;
  --tp-butter-soft: #F3D89A;
  --tp-choco: #5C2E14;
  --tp-choco-2: #3D1C0A;
  --tp-ink: #5C2E14;
  --tp-muted: #7A4E32;
  --tp-caramel: #A0673A;
  --tp-on-dark: #F6EBDD;
  --tp-on-dark-muted: #E0C9AE;
  --tp-line: rgba(92, 46, 20, 0.16);
  --tp-line-dark: rgba(246, 235, 221, 0.2);
  --tp-radius: 14px;
  --tp-radius-sm: 10px;
  --tp-wrap: 1240px;
  --tp-gutter: clamp(1rem, 4vw, 2.5rem);
  --tp-section: clamp(2.75rem, 6vw, 5.25rem);
  --header-height: 72px;
  /* Atmosphère */
  --tp-cream-grad: radial-gradient(ellipse 90% 55% at 50% -8%, rgba(243, 216, 154, 0.42), transparent 58%),
                   linear-gradient(180deg, #F8F0E4 0%, var(--tp-cream) 42%, #EFE2D0 100%);
  --tp-choco-grad: linear-gradient(180deg, #6B3A1F 0%, #5C2E14 48%, #452010 100%);
  --tp-shadow-warm: 0 8px 24px rgba(92, 46, 20, 0.12);
  --tp-shadow-glow: 0 10px 28px rgba(92, 46, 20, 0.16), 0 0 0 1px rgba(224, 168, 58, 0.28);
  --tp-grain:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
}

/* L'italique reste réservé à l'expression du titre d'accueil. */
em,
cite,
.logo-text em,
.nav-link:hover,
.nav-link.active,
.chariot-caption,
.form-note {
  font-style: normal;
}

html {
  scroll-padding-top: calc(var(--header-height) + 16px);
}

body {
  background: var(--tp-cream-grad);
  background-attachment: fixed;
  color: var(--tp-ink);
  font-size: 1.0625rem;
  line-height: 1.65;
}

/* Grain papier très léger (atmosphère four / pâtisserie) */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 9998;
  pointer-events: none;
  opacity: 0.04;
  background-image: var(--tp-grain);
  background-size: 180px 180px;
  mix-blend-mode: multiply;
}

h1, h2, h3,
.section-title,
.hero-title {
  text-wrap: balance;
  overflow-wrap: break-word;
  hyphens: manual;
}

p {
  text-wrap: pretty;
}

section[id] {
  scroll-margin-top: calc(var(--header-height) + 16px);
}

/* Décor hérité : reflets, voiles et lueurs retirés */
.offre-card::before,
.offre-card::after,
.presse-card::after,
.value-item::after,
.devis-form-wrapper::after,
.contact-info-item::after,
.hero-img-frame::after,
.apropos-photo-wrapper::after,
.gallery-section::after {
  content: none !important;
}

.hero-img-frame,
.devis-form-wrapper,
.apropos-photo {
  filter: none;
}

.btn,
.btn-primary {
  text-shadow: none;
}

.container {
  max-width: var(--tp-wrap);
  padding-left: var(--tp-gutter);
  padding-right: var(--tp-gutter);
}

/* ── Étiquettes et titres de section ── */
.section-label,
.section-label--light,
.hero-badge {
  justify-self: start;
  width: auto;
  gap: 0.6rem;
  padding: 0;
  border: 0;
  background: none;
  color: var(--tp-caramel);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.16em;
}

.hero-badge::before {
  content: "";
  flex: none;
  width: 26px;
  height: 26px;
  margin: 0;
  border-radius: 0;
  background-color: transparent;
  background-image: url("../gaufre.png");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 1;
}

.section-label::before,
.section-label--light::before {
  content: none;
}

.gallery-section .section-label,
.presse-section .section-label,
.offres-section .section-label,
.carte-section .section-label {
  padding: 0;
  border: 0;
  background: none;
}

/* « ✨ Presse » porte déjà son propre pictogramme */
.presse-section .section-label::before {
  content: none;
}

.section-header {
  max-width: 44rem;
  margin: 0 0 clamp(1.35rem, 2.8vw, 2.1rem);
}

.section-title,
.section-title--light {
  margin: 0.55rem 0 0;
  font-size: clamp(1.8rem, 3.5vw, 2.75rem);
  font-weight: 600;
  line-height: 1.12;
  letter-spacing: -0.025em;
  color: var(--tp-ink);
}

.section-subtitle,
.section-subtitle--light {
  max-width: 38rem;
  margin-top: 0.65rem;
  font-size: clamp(1.05rem, 1.4vw, 1.2rem);
  line-height: 1.6;
  color: var(--tp-muted);
}

/* ── Boutons ──
   Principal : chocolat. Pas de border (évite le filet clair / aliasing à droite).
   Secondaire : contour via box-shadow inset. */
.btn,
.btn.btn-primary,
.btn-primary,
.site-header .btn.btn-primary,
.devis-section .btn.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  min-height: 48px;
  padding: 0.8em 1.6em;
  border: 0;
  border-radius: var(--tp-radius-sm);
  background-color: var(--tp-choco);
  background-image: linear-gradient(180deg, #6B3A1F 0%, var(--tp-choco) 55%, #4A2510 100%);
  background-clip: padding-box;
  color: var(--tp-cream);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  overflow: hidden;
  isolation: isolate;
  box-shadow: 0 6px 16px rgba(92, 46, 20, 0.2);
  transition: box-shadow 0.2s ease, filter 0.2s ease;
  /* Évite le filet clair à droite (aliasing border-radius + translate) */
  transform: none !important;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.btn:hover,
.btn.btn-primary:hover,
.btn-primary:hover,
.site-header .btn.btn-primary:hover,
.devis-section .btn.btn-primary:hover,
.btn:active,
.btn.btn-primary:active,
.btn-primary:active {
  background-color: var(--tp-choco);
  background-image: linear-gradient(180deg, #6B3A1F 0%, var(--tp-choco) 55%, #4A2510 100%);
  color: var(--tp-cream);
  box-shadow: 0 8px 20px rgba(92, 46, 20, 0.28);
  filter: brightness(1.04);
  transform: none !important;
}

.btn-quiet,
.btn.btn-quiet {
  min-height: 48px;
  padding: 0.8em 1.4em;
  border: 0;
  border-radius: var(--tp-radius-sm);
  background-color: transparent;
  background-image: none;
  color: var(--tp-choco);
  box-shadow: inset 0 0 0 2px var(--tp-choco);
  overflow: hidden;
}

.btn:focus-visible,
.btn.btn-primary:focus-visible,
.btn-primary:focus-visible,
.btn-quiet:focus-visible,
.btn.btn-quiet:focus-visible,
a:focus-visible,
button:focus-visible {
  outline: 3px solid var(--tp-butter);
  outline-offset: 3px;
}

.btn-quiet:hover,
.btn.btn-quiet:hover {
  background-color: rgba(92, 46, 20, 0.08);
  background-image: none;
  color: var(--tp-choco);
  box-shadow: inset 0 0 0 2px var(--tp-choco);
  filter: none;
  transform: none;
}

/* Section La carte : CTA en jaune beurre (contraste sur fond chocolat) */
.carte-section .btn.btn-primary,
.carte-section .btn-primary,
.carte-section .btn.btn-primary:hover,
.carte-section .btn-primary:hover {
  border: 0;
  background-color: var(--tp-butter);
  background-image: linear-gradient(180deg, #EBC05A 0%, var(--tp-butter) 52%, #C9922E 100%);
  background-clip: padding-box;
  color: var(--tp-choco);
  box-shadow: 0 6px 16px rgba(92, 46, 20, 0.22);
  overflow: hidden;
  filter: none;
  transform: none;
}

.carte-section .btn-quiet {
  border: 0;
  background: transparent;
  color: var(--tp-on-dark);
  box-shadow: inset 0 0 0 2px var(--tp-on-dark);
}

.carte-section .btn-quiet:hover {
  background-color: var(--tp-on-dark);
  background-image: none;
  color: var(--tp-choco);
  box-shadow: inset 0 0 0 2px var(--tp-on-dark);
}

/* Focus clavier : chocolat sur fond clair, beurre sur fond sombre */
:focus-visible,
.btn:focus-visible {
  outline: 3px solid var(--tp-choco);
  outline-offset: 3px;
}

.carte-section :focus-visible,
.site-footer :focus-visible {
  outline-color: var(--tp-butter);
}

/* ══════════════════════════════════════════
   EN-TÊTE
   ══════════════════════════════════════════ */
.site-header,
.site-header.scrolled {
  height: var(--header-height);
  background: color-mix(in srgb, var(--tp-cream) 92%, #F8F0E4);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid color-mix(in srgb, var(--tp-butter) 25%, transparent);
  box-shadow: 0 4px 18px rgba(92, 46, 20, 0.06);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.site-header.scrolled {
  border-bottom-color: var(--tp-line);
}

.mobile-menu-open .site-header {
  background: var(--tp-cream);
}

/* Logo et bouton de fermeture restent visibles au-dessus du menu ouvert */
.header-inner {
  position: relative;
  z-index: 1995;
  max-width: 1360px;
  padding: 0 var(--tp-gutter);
  gap: 1.5rem;
  justify-content: flex-end;
}

/* Logo dans l'en-tête sur tous les écrans. */
.header-logo,
.header-inner .header-logo {
  display: flex;
  flex-shrink: 0;
}

.header-inner .header-logo .logo-img {
  display: block;
  width: 108px;
  height: auto;
  max-height: 64px;
  object-fit: contain;
}

.header-nav {
  order: 1;
  margin-right: auto;
}

.header-cta {
  order: 2;
}

.hamburger,
.header-inner .hamburger {
  order: 4;
  width: 48px;
  height: 48px;
  padding: 0;
  margin-right: -6px;
  border-radius: 50%;
  gap: 6px;
}

.hamburger-bar,
.header-inner .hamburger-bar,
.site-header.scrolled .hamburger-bar {
  width: 24px;
  height: 2px;
  background: var(--tp-choco);
}

.hamburger[aria-expanded="true"] {
  background: var(--tp-butter);
}

.hamburger[aria-expanded="true"] .hamburger-bar:nth-child(1) {
  transform: translateY(8px) rotate(45deg);
}

.hamburger[aria-expanded="true"] .hamburger-bar:nth-child(3) {
  transform: translateY(-8px) rotate(-45deg);
}

@media (min-width: 1024px) {
  .header-logo {
    margin-right: 0;
  }

  .header-nav {
    overflow: visible;
  }

  .nav-list {
    gap: clamp(0.25rem, 0.9vw, 0.85rem);
  }

  .header-nav .nav-link,
  .nav-link {
    display: inline-block;
    padding: 0.5rem 0.55rem;
    border-radius: 999px;
    font-size: clamp(0.9rem, 0.35vw + 0.72rem, 1rem) !important;
    font-weight: 600;
    font-style: normal;
    color: var(--tp-ink);
    transition: background-color 0.2s ease, color 0.2s ease;
  }

  .nav-link::after {
    content: none;
  }

  .nav-link:hover,
  .site-header.scrolled .nav-link:hover {
    background: color-mix(in srgb, var(--tp-choco) 12%, transparent);
    color: var(--tp-choco);
    font-style: normal;
  }

  .nav-link.active,
  .site-header.scrolled .nav-link.active {
    background: color-mix(in srgb, var(--tp-choco) 18%, transparent);
    color: var(--tp-choco);
    font-style: normal;
  }
}

/* Bouton devis de l'en-tête : style principal, format compact */
.site-header .header-cta {
  min-height: 46px;
  padding: 0.7em 1.35em !important;
  font-size: 0.95rem !important;
  white-space: nowrap;
}

.site-header .btn.header-cta {
  display: none;
}

@media (min-width: 1024px) {
  .site-header .btn.header-cta {
    display: inline-flex;
  }
}

/* Menu mobile */
.mobile-menu {
  background: var(--tp-cream);
  padding: calc(var(--header-height) + 1rem) var(--tp-gutter) calc(1.5rem + env(safe-area-inset-bottom));
  transform: translateY(-8px);
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
}

.mobile-menu.is-open {
  transform: none;
}

.mobile-menu nav {
  min-height: 100%;
}

.mobile-nav-list {
  gap: 0;
  margin-bottom: 1.75rem;
  border-top: 1px solid var(--tp-line);
}

.mobile-nav-list > li {
  width: 100%;
  border-bottom: 1px solid var(--tp-line);
}

.mobile-nav-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 60px;
  padding: 0.65rem 0.25rem;
  font-family: var(--font-menu) !important;
  font-size: clamp(1.6rem, 7vw, 2.1rem);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--tp-ink);
}

.mobile-nav-link::after {
  content: "";
  flex: none;
  width: 10px;
  height: 10px;
  margin-left: 1rem;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
  opacity: 0.45;
}

.mobile-nav-link:hover,
.mobile-nav-link:focus-visible {
  color: var(--tp-caramel);
  transform: none;
}

.mobile-cta,
.site-header .mobile-cta.btn-primary {
  width: 100%;
  min-height: 56px;
  font-size: 1.05rem !important;
}

/* ══════════════════════════════════════════
   1. ACCUEIL
   ══════════════════════════════════════════ */
.hero-section {
  position: relative;
  display: block;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  background: transparent;
}

.hero-section .hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  align-items: center;
  gap: clamp(2rem, 5vw, 4.5rem);
  max-width: var(--tp-wrap);
  min-height: 0;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3.5rem) var(--tp-gutter) clamp(2.5rem, 5vw, 4.5rem);
}

.hero-section .hero-content {
  order: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  max-width: 35rem;
  margin: 0;
  padding: 0;
  text-align: left;
  animation: none;
}

.hero-section .hero-content > * {
  animation: none;
  opacity: 1;
}

.hero-section .hero-title {
  margin: 0 0 1.3rem;
  max-width: 20ch;
  font-family: var(--font-display);
  font-size: clamp(2.15rem, 3.6vw, 3.25rem);
  font-style: normal;
  font-weight: 600;
  line-height: 1.12;
  letter-spacing: -0.025em;
  text-wrap: balance;
  color: var(--tp-ink);
}

.hero-section .hero-title em {
  color: #A86B2E;
  -webkit-text-fill-color: #A86B2E;
  font-style: italic;
  font-weight: inherit;
  background: none;
}

.hero-section .hero-subtitle,
.hero-section .hero-note,
.hero-section .hero-ctas .btn {
  font-family: system-ui, -apple-system, 'Segoe UI', sans-serif !important;
  font-style: normal;
}

.hero-section .hero-subtitle {
  max-width: 41ch;
  margin: 0 0 1.75rem;
  font-size: clamp(1.05rem, 1.4vw, 1.2rem);
  font-weight: 400;
  line-height: 1.65;
  text-wrap: pretty;
  color: var(--tp-muted);
}

.hero-section .hero-ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: flex-start;
  width: 100%;
}

.hero-section .hero-ctas .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  max-width: 100%;
  padding: 0.85rem 1.35rem;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.35;
  text-align: center;
  white-space: normal;
}

.hero-section .hero-note {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0;
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
  font-size: 0.9rem;
  font-weight: 650;
  line-height: 1.45;
  letter-spacing: 0;
  color: var(--tp-choco);
}

.hero-section .hero-note li {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}

.hero-section .hero-note li + li::before {
  content: '';
  width: 0.3rem;
  height: 0.3rem;
  margin: 0 0.55rem;
  border-radius: 50%;
  background: #A86B2E;
  flex: 0 0 auto;
}

.hero-section .hero-visual {
  order: 2;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  animation: none;
  opacity: 1;
  transform: none;
}

.hero-section .hero-visual::before {
  content: none;
}

.hero-section .hero-float-wrap {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  align-items: center;
  gap: 1.5rem;
  width: 100%;
  max-width: 620px;
  margin: 0;
}

.hero-section .hero-quote {
  margin: 0;
  padding: 0;
  border: 0;
  font-family: var(--font-body);
  font-size: 1.05rem;
  font-style: normal;
  line-height: 1.7;
  color: var(--tp-muted);
}

.hero-section .hero-quote p {
  margin: 0;
}

.hero-section .hero-quote cite {
  display: block;
  margin-top: 0.85rem;
  font-size: 0.9rem;
  font-style: normal;
  color: var(--tp-caramel);
}

.hero-section .hero-img-frame {
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--tp-radius);
  overflow: hidden;
  background: var(--tp-cream-2);
  box-shadow: var(--tp-shadow-warm);
}

.hero-section .hero-oriana-img {
  display: block;
  width: 100%;
  height: auto;
  min-height: 0;
  max-height: none;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: 52% 22%;
  border-radius: 0;
}

.hero-section .hero-quote {
  text-align: center;
  color: var(--tp-ink);
  line-height: 1.5;
}

.hero-section .hero-quote p {
  position: relative;
  padding: 8px 26px;
  font-size: 0.95rem;
  font-style: italic;
}

.hero-section .hero-quote-mark {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
}

.hero-section .hero-quote-mark:last-child {
  top: auto;
  bottom: 0;
  right: 0;
  left: auto;
}

.hero-section .hero-quote-angle {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}

.hero-section .hero-quote-curly {
  display: inline-block;
  color: var(--tp-caramel);
  font-family: Georgia, serif;
  font-size: 54px;
  font-weight: 400;
  line-height: 1;
}

.hero-section .hero-quote cite {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 12px;
  font-family: var(--font-display);
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.5;
}

.hero-section .hero-quote cite::before,
.hero-section .hero-quote cite::after {
  content: "";
  flex: 1 1 20px;
  max-width: 32px;
  height: 1px;
  background: currentColor;
  opacity: 0.6;
}

@media (max-width: 767px) {
  .hero-section .hero-inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    padding: 22px 20px 16px;
  }

  .hero-section .hero-content {
    display: contents;
  }

  .hero-section .hero-title {
    max-width: none;
    grid-row: 1;
    min-width: 0;
    width: 100%;
    margin: 0 0 14px;
    font-size: clamp(24px, 7.2vw, 31px);
    line-height: 1.1;
    text-align: center;
    text-wrap: balance;
  }

  .hero-section .hero-title em {
    display: block;
  }

  .hero-section .hero-subtitle {
    grid-row: 4;
    max-width: none;
    margin-bottom: 12px;
    font-size: 0.9rem;
    line-height: 1.4;
  }

  .hero-section .hero-ctas {
    grid-row: 5;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    align-items: stretch;
    gap: 10px;
  }

  .hero-section .hero-ctas .btn {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: 48px;
    padding: 12px 8px;
    border-radius: var(--tp-radius-sm);
    font-size: clamp(13px, 3.5vw, 15px);
    line-height: 1.3;
    white-space: nowrap;
    box-shadow: none;
  }

  .hero-section .hero-ctas .btn-quiet {
    min-height: 48px;
    background: none;
    box-shadow: inset 0 0 0 2px var(--tp-choco);
    color: var(--tp-choco);
    text-decoration: none;
  }

  .hero-section .hero-ctas .btn-quiet:hover {
    background: rgba(92, 46, 20, 0.06);
    box-shadow: inset 0 0 0 2px var(--tp-choco);
  }

  .hero-section .hero-note {
    grid-row: 6;
    justify-content: flex-start;
    margin-top: 10px;
    font-size: 0.8125rem;
    line-height: 1.4;
  }

  .hero-section .hero-note li + li::before {
    width: 0.25rem;
    height: 0.25rem;
    margin-inline: 0.45rem;
  }

  .hero-section .hero-visual {
    display: contents;
  }

  .hero-section .hero-float-wrap {
    display: contents;
  }

  .hero-section .hero-img-frame {
    grid-row: 2;
    width: fit-content;
    max-width: 100%;
    justify-self: center;
    margin-bottom: 10px;
    border-radius: 16px;
    box-shadow: none;
  }

  /* Le format naturel conserve le visage et les gaufres sans recadrage. */
  .hero-section .hero-oriana-img {
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: clamp(110px, calc(100svh - 490px), 240px);
    aspect-ratio: auto;
    object-fit: contain;
  }

  .hero-section .hero-quote {
    grid-row: 3;
    position: static;
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    margin: 0 0 18px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    color: var(--tp-ink);
    font-size: 15.5px;
    line-height: 1.5;
    text-align: center;
    text-shadow: none;
    overflow-wrap: anywhere;
  }

  .hero-section .hero-quote p {
    position: relative;
    padding: 8px 26px;
    font-family: var(--font-body);
    font-size: 14px;
    font-style: italic;
    line-height: inherit;
  }

  .hero-section .hero-quote cite {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 12px;
    color: var(--tp-caramel);
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.5;
  }

  .hero-section .hero-quote::before {
    content: none;
  }

  .hero-section .hero-quote-mark {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
  }

  .hero-section .hero-quote-mark:last-child {
    top: auto;
    bottom: 0;
    right: 0;
    left: auto;
  }

  .hero-section .hero-quote-mark::before {
    content: none;
  }

  .hero-section .hero-quote-angle {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
  }

  .hero-section .hero-quote-curly {
    display: inline-block;
    color: var(--tp-caramel);
    font-family: Georgia, serif;
    font-size: 54px;
    font-weight: 400;
    line-height: 1;
    vertical-align: baseline;
  }

  .hero-section .hero-quote cite::before,
  .hero-section .hero-quote cite::after {
    content: "";
    flex: 1 1 20px;
    max-width: 32px;
    height: 1px;
    background: currentColor;
    opacity: 0.6;
  }
}
/* ══════════════════════════════════════════
   2. GALERIE — mosaïque
   ══════════════════════════════════════════ */

/* Transition entre sections : le changement de couleur suffit (pas de vague) */
.gallery-bridge {
  display: none !important;
}

.gallery-section {
  position: relative;
  /* Couleur de la première version, demandée par Oriana */
  background: #ECD9BF;
  padding: var(--tp-section) 0;
}

.gallery-section > .container {
  padding-top: 0;
}

.gallery-section .section-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  max-width: none;
}

/* Phrase d'accroche juste sous « Mon univers gourmand » */
.gallery-section .section-subtitle {
  max-width: 34rem;
  margin: 0.85rem 0 0;
  color: var(--tp-muted);
}

.gallery-section .gallery-accroche {
  display: inline-block;
  margin-bottom: 0.2rem;
  font-size: 1.12em;
  font-weight: 700;
  color: var(--tp-choco);
}

/*
  Galerie éditoriale :
  [ grande photo ] [ 2 ] [ 3 ]
  [              ] [ 4 ] [ 5 ]
*/
.gallery-section .gallery-grid,
.gallery-size--small .gallery-grid,
.gallery-size--large .gallery-grid,
.gallery-ratio--square .gallery-grid,
.gallery-ratio--portrait .gallery-grid,
.gallery-ratio--landscape .gallery-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) repeat(2, minmax(0, 1fr));
  grid-auto-rows: clamp(170px, 19vw, 240px);
  gap: 12px;
  max-width: none;
  margin: 0;
  width: 100%;
}

.gallery-section .gallery-item,
.gallery-ratio--mixed .gallery-item {
  position: relative;
  grid-column: auto !important;
  grid-row: auto !important;
  aspect-ratio: auto !important;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  border-radius: var(--tp-radius);
  overflow: hidden;
  background: var(--tp-cream);
  order: 0;
}

.gallery-item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallery-zoom {
  display: block;
  width: 100%;
  height: 100%;
  cursor: zoom-in;
}

.gallery-zoom:focus-visible {
  outline-offset: -4px;
}

.gallery-dialog {
  position: fixed;
  inset: 0;
  width: fit-content;
  max-width: calc(100vw - 24px);
  max-height: calc(100svh - 24px);
  margin: auto;
  padding: 56px 8px 8px;
  border: 0;
  border-radius: 14px;
  background: var(--tp-cream);
  overflow: auto;
}

.gallery-dialog::backdrop {
  background: rgba(30, 15, 8, 0.88);
}

.gallery-dialog img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: calc(100svh - 88px);
  object-fit: contain;
}

.gallery-dialog-close {
  position: absolute;
  top: 4px;
  right: 4px;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--tp-choco);
  font-size: 32px;
  line-height: 1;
  cursor: pointer;
}

html.gallery-dialog-open {
  overflow: hidden;
}

/* Photo principale à gauche */
.gallery-section .gallery-grid > .gallery-item--1 {
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
}

.gallery-section .gallery-grid > .gallery-item--2 {
  grid-column: 2 !important;
  grid-row: 1 !important;
}

.gallery-section .gallery-grid > .gallery-item--3 {
  grid-column: 3 !important;
  grid-row: 1 !important;
}

.gallery-section .gallery-grid > .gallery-item--4 {
  grid-column: 2 !important;
  grid-row: 2 !important;
}

.gallery-section .gallery-grid > .gallery-item--5 {
  grid-column: 3 !important;
  grid-row: 2 !important;
}

/* Photos supplémentaires (après « Voir toutes ») */
.gallery-section .gallery-grid > .gallery-item--6 {
  grid-column: 1 !important;
  grid-row: 3 !important;
}

.gallery-section .gallery-grid > .gallery-item--7 {
  grid-column: 2 !important;
  grid-row: 3 !important;
}

.gallery-section .gallery-grid > .gallery-item--8 {
  grid-column: 3 !important;
  grid-row: 3 !important;
}

.gallery-section.is-collapsed .gallery-item--extra {
  display: none !important;
}

.gallery-more {
  display: flex;
  justify-content: center;
  margin-top: clamp(1.25rem, 2.5vw, 1.75rem);
}

.gallery-more[hidden] {
  display: none;
}

/* Recadrages : gaufres et visages préservés */
.gallery-item--1 img { object-position: 50% 45%; }
.gallery-item--2 img { object-position: 50% 40%; }
.gallery-item--3 img { object-position: 50% 45%; }
.gallery-item--4 img { object-position: 45% 55%; }
.gallery-item--5 img { object-position: 40% 30%; }
.gallery-item--6 img { object-position: 50% 40%; }
.gallery-item--7 img { object-position: 50% 45%; }
.gallery-item--8 img { object-position: 50% 50%; }

/* Tablette : 2 colonnes — la grande photo occupe 2 rangées (évite le chevauchement) */
@media (max-width: 900px) {
  .gallery-section .gallery-grid,
  .gallery-size--small .gallery-grid,
  .gallery-size--large .gallery-grid,
  .gallery-ratio--square .gallery-grid,
  .gallery-ratio--portrait .gallery-grid,
  .gallery-ratio--landscape .gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    grid-auto-rows: minmax(180px, 28vw);
    min-height: 0;
    gap: 10px;
  }

  .gallery-section .gallery-grid > .gallery-item--1 {
    grid-column: 1 / -1 !important;
    grid-row: span 2 !important;
    min-height: 0;
    height: 100%;
  }

  .gallery-section .gallery-grid > .gallery-item--2,
  .gallery-section .gallery-grid > .gallery-item--3,
  .gallery-section .gallery-grid > .gallery-item--4,
  .gallery-section .gallery-grid > .gallery-item--5,
  .gallery-section .gallery-grid > .gallery-item--6,
  .gallery-section .gallery-grid > .gallery-item--7,
  .gallery-section .gallery-grid > .gallery-item--8 {
    grid-column: auto !important;
    grid-row: auto !important;
    min-height: 0;
  }
}

/* Mobile : principale pleine largeur sur 2 rangées, puis 2 colonnes */
@media (max-width: 600px) {
  .gallery-section .gallery-grid,
  .gallery-size--small .gallery-grid,
  .gallery-size--large .gallery-grid,
  .gallery-ratio--square .gallery-grid,
  .gallery-ratio--portrait .gallery-grid,
  .gallery-ratio--landscape .gallery-grid {
    grid-auto-rows: minmax(140px, 36vw);
    gap: 8px;
  }

  .gallery-section .gallery-grid > .gallery-item--1 {
    grid-row: span 2 !important;
    min-height: 0;
  }
}

/* ══════════════════════════════════════════
   3. PRESTATIONS — fond chocolat, cartes crème
   ══════════════════════════════════════════ */
.offres-section {
  position: relative;
  background: var(--tp-choco-grad);
  color: var(--tp-on-dark);
  padding: calc(var(--tp-section) * 2 / 3) 0 var(--tp-section);
}

/* Vague douce entre la galerie et les prestations (comme la V1) */
.offres-section .offres-vague {
  position: absolute;
  left: 0;
  bottom: calc(100% - 1px);
  width: 100%;
  height: clamp(36px, 5vw, 72px);
  line-height: 0;
  pointer-events: none;
}

.offres-section .offres-vague svg {
  display: block;
  width: 100%;
  height: 100%;
}

.offres-section .offres-vague path {
  fill: #6B3A1F;
}

.offres-section .section-header {
  max-width: 46rem;
}

/* Comme la galerie : titre à gauche, intro à droite */
@media (min-width: 900px) {
  .offres-section .section-header {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    column-gap: 4rem;
    align-items: end;
    max-width: none;
  }

  .offres-section .section-label {
    grid-column: 1 / -1;
  }

  .offres-section .section-subtitle {
    margin: 0 0 0.35rem;
  }
}

.offres-section .section-label,
.offres-section .section-label--light {
  color: var(--tp-butter-soft);
}

.offres-section .section-label::before,
.offres-section .section-label--light::before {
  background-color: transparent;
  filter: brightness(1.15);
}

.offres-section .section-title,
.offres-section .section-title--light {
  color: var(--tp-on-dark);
}

.offres-section .section-subtitle,
.offres-section .section-subtitle--light {
  color: var(--tp-on-dark-muted);
}

.offres-section .offres-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(1rem, 2vw, 1.4rem);
  max-width: none;
  margin: 0;
}

.offres-section .offre-card,
.offres-section .offre-card--featured {
  display: grid;
  /* Colonne photo en auto : la taille vient du bloc image (largeur + hauteur) */
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: auto;
  grid-template-areas: "photo content";
  column-gap: clamp(1.1rem, 2.5vw, 2rem);
  align-items: center;
  height: auto;
  box-sizing: border-box;
  padding: 8px clamp(1rem, 2.2vw, 1.5rem) 8px 8px;
  border: 1px solid color-mix(in srgb, var(--tp-butter) 35%, transparent);
  box-shadow: var(--tp-shadow-warm);
  /* !important : le préréglage « cartes plates » du personnaliseur force un angle droit */
  border-radius: var(--tp-radius) !important;
  background: linear-gradient(165deg, #FFF8EE 0%, var(--tp-cream) 48%, var(--tp-cream-2) 100%);
  overflow: visible;
  text-align: left;
  color: var(--tp-ink);
  transition: box-shadow 0.22s ease, border-color 0.22s ease, transform 0.22s ease;
}

.offres-section .offre-card:nth-child(even) {
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "content photo";
  padding: 8px 8px 8px clamp(1rem, 2.2vw, 1.5rem);
}

.offres-section .offre-card:hover,
.offres-section .offre-card--featured:hover {
  background: linear-gradient(165deg, #FFFDF8 0%, #F8EEDC 55%, #F0DFC6 100%);
  border-color: color-mix(in srgb, var(--tp-butter) 55%, transparent);
  box-shadow: var(--tp-shadow-glow);
  transform: translateY(-2px);
}

.offres-section .offre-card-photo {
  grid-area: photo;
  align-self: center;
  justify-self: start;
  /* Taille proportionnelle (largeur + hauteur), cadrage 3/2 */
  width: clamp(286px, 34vw, 468px);
  max-width: 100%;
  margin: 0;
  aspect-ratio: 3 / 2;
  min-height: 0;
  height: auto;
  border-radius: var(--tp-radius);
  overflow: hidden;
}

.offres-section .offre-card:nth-child(even) .offre-card-photo {
  justify-self: end;
}

.offres-section .offre-card-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Cadrages : entreprise, privés, marchés */
.offres-section .offre-card:first-child .offre-card-photo img {
  object-position: 50% 48%;
}

.offres-section .offre-card--featured .offre-card-photo img {
  object-position: 50% 30%;
}

/* Marchés & salons : chariot et bocaux */
.offres-section .offre-card:nth-child(3) .offre-card-photo img {
  object-position: 50% 58%;
}

.offres-section .offre-card-content {
  grid-area: content;
  max-width: 30rem;
  padding: 8px 0;
  min-width: 0;
}

.offres-section .offre-card-heading {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 0.85rem;
  align-items: start;
  margin: 0 0 0.55rem;
}

.offres-section .offre-card-num {
  margin-top: 0.2rem;
  font-family: var(--font-display, Georgia, serif);
  font-size: clamp(1.1rem, 1.7vw, 1.35rem);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.04em;
  color: color-mix(in srgb, var(--tp-caramel) 55%, transparent);
  user-select: none;
}

.offres-section .offre-card-title {
  margin: 0;
  font-size: clamp(1.55rem, 2.5vw, 2.1rem);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.025em;
  color: var(--tp-ink);
  text-align: left;
}

.offres-section .offre-card-title-link {
  position: relative;
  display: inline-block;
  max-width: 100%;
  padding-right: 1.35em;
  color: inherit;
  text-decoration: none;
  text-underline-offset: 0.18em;
  transition: color 0.18s ease;
}

.offres-section .offre-card-title-link:hover,
.offres-section .offre-card-title-link:focus-visible {
  color: var(--tp-choco);
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-decoration-color: color-mix(in srgb, var(--tp-caramel) 70%, transparent);
  outline: none;
}

.offres-section .offre-card-title-arrow {
  position: absolute;
  top: 0.12em;
  right: 0;
  color: var(--tp-caramel);
  font-size: 0.72em;
  font-weight: 500;
  line-height: 1;
  opacity: 0.55;
  transition: transform 0.18s ease, opacity 0.18s ease;
}

.offres-section .offre-card-title-link:hover .offre-card-title-arrow,
.offres-section .offre-card-title-link:focus-visible .offre-card-title-arrow {
  opacity: 1;
  transform: translateX(3px);
}

.offres-section .offre-card-title span:not(.offre-card-title-arrow) {
  display: block;
  margin-top: 0.3rem;
  font-size: max(1rem, 0.62em);
  font-style: normal;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--tp-caramel);
}

.offres-section .offre-card-text {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.6;
  color: var(--tp-muted);
}

.offres-section .offres-menu-ctas {
  display: flex;
  justify-content: center;
  margin-top: clamp(1.5rem, 3vw, 2.25rem);
  padding-top: clamp(1.15rem, 2.5vw, 1.75rem);
  border-top: 1px solid var(--tp-line-dark);
}

.offres-section .offres-menu-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  max-width: 100%;
  padding: 0.95rem 1.35rem;
  border: 1.5px solid transparent;
  border-radius: var(--tp-radius);
  background: var(--tp-cream);
  color: #5C2E14;
  font-size: clamp(0.98rem, 1.5vw, 1.08rem);
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  transition: border-color 0.18s ease, background-color 0.18s ease, color 0.18s ease;
}

.offres-section .offres-menu-link-text {
  min-width: 0;
}

.offres-section .offres-menu-link-arrow {
  flex: none;
  color: var(--tp-caramel);
  transition: transform 0.18s ease;
}

.offres-section .offres-menu-link:hover,
.offres-section .offres-menu-link:focus-visible {
  border-color: var(--tp-choco);
  background: #fff;
  color: var(--tp-choco);
  outline: none;
}

.offres-section .offres-menu-link:hover .offres-menu-link-arrow,
.offres-section .offres-menu-link:focus-visible .offres-menu-link-arrow {
  transform: translateX(3px);
}

@media (max-width: 800px) {
  .offres-section .offre-card,
  .offres-section .offre-card--featured,
  .offres-section .offre-card:nth-child(even) {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
    grid-template-areas:
      "photo"
      "content";
    padding: 8px 8px 14px;
  }

  .offres-section .offres-grid {
    gap: 1rem;
  }

  .offres-section .offre-card-photo,
  .offres-section .offre-card:nth-child(even) .offre-card-photo {
    width: min(100%, 546px);
    max-width: 100%;
    aspect-ratio: 3 / 2;
    justify-self: center;
    margin-inline: auto;
    margin-bottom: 10px;
  }

  .offres-section .offre-card-content {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
  }

  .offres-section .offres-menu-link {
    width: 100%;
  }
}

/* ══════════════════════════════════════════
   4. DEVIS & CONTACT
   ══════════════════════════════════════════ */
.devis-section {
  /* Couleur de la première version, comme la galerie */
  background: #ECD9BF;
  color: var(--tp-ink);
  padding: var(--tp-section) 0;
}

/* Colonne gauche (titre + contacts) alignée en haut avec le formulaire */
.devis-section > .container {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  column-gap: clamp(2rem, 5vw, 5rem);
  row-gap: 2rem;
  align-items: stretch;
}

.devis-section .devis-left {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  min-width: 0;
}

.devis-section .section-header {
  position: relative;
  max-width: none;
  margin: 0;
  /* Place pour « Devis gratuit » au-dessus du titre / du formulaire */
  padding-top: 0;
}

/* Label au-dessus : le titre H2 s’aligne sur le haut du formulaire */
.devis-section .section-header .section-label {
  position: absolute;
  left: 0;
  bottom: calc(100% + 0.55rem);
  display: inline-flex;
  align-items: center;
  margin: 0;
}

.devis-section .section-header .section-title,
.devis-section .section-title {
  margin-top: 0;
  /* Un peu plus compact : la colonne garde la hauteur du formulaire */
  font-size: clamp(1.9rem, 3.2vw, 2.65rem);
}

.devis-title .devis-title-line {
  display: block;
}

.devis-title .devis-title-line--em {
  margin-top: 0.15em;
  font-style: normal;
  font-weight: 500;
  color: var(--tp-caramel);
}

@media (max-width: 960px) {
  .devis-section > .container {
    grid-template-columns: minmax(0, 1fr);
  }

  .devis-section .devis-left {
    display: contents;
  }

  .devis-section .section-header {
    order: 1;
    /* Sur mobile, garder le label dans le flux au-dessus du titre */
    padding-top: calc(22px + 0.55rem);
  }

  .devis-section .devis-form-wrapper {
    order: 2;
    height: auto;
    align-self: start;
  }

  .devis-section .contact-info-col {
    order: 3;
  }
}

/* Formulaire */
.devis-section .devis-form-wrapper {
  position: relative;
  align-self: stretch;
  height: 100%;
  box-sizing: border-box;
  padding: clamp(1.5rem, 3.5vw, 2.75rem) clamp(1.5rem, 3.5vw, 2.75rem) clamp(1.25rem, 2.5vw, 1.85rem);
  border: 1px solid color-mix(in srgb, var(--tp-butter) 40%, var(--tp-line));
  border-radius: calc(var(--tp-radius) + 6px);
  background: linear-gradient(165deg, #FFFDF8 0%, var(--tp-cream) 100%);
  box-shadow: var(--tp-shadow-warm);
  overflow: visible;
}

.devis-section .devis-form-wrapper::before {
  content: none;
}

.devis-steps-form {
  padding: 0;
  background: transparent;
  box-shadow: none;
  border: 0;
}

.dsf-progress-wrap {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 0 0 1.75rem;
}

.dsf-progress-track {
  flex: 1;
  height: 8px;
  border-radius: 999px;
  background: var(--tp-cream-2);
  overflow: hidden;
}

.dsf-progress-fill {
  height: 100%;
  border-radius: 999px;
  background: var(--tp-choco);
  transition: width 0.3s ease;
}

.dsf-counter {
  padding: 0.3rem 0.75rem;
  border-radius: 999px;
  background: var(--tp-butter);
  color: var(--tp-choco);
  font-size: 0.85rem;
  font-weight: 700;
}

.dsf-question {
  margin: 0 0 1.25rem;
  font-size: clamp(1.4rem, 2.2vw, 1.75rem);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.015em;
  color: var(--tp-ink);
}

.dsf-question--sub {
  margin-top: 1.75rem;
  font-size: clamp(1.15rem, 1.7vw, 1.3rem);
}

.dsf-choices,
.dsf-choices--list {
  gap: 0.6rem;
  margin-bottom: 1.5rem;
}

.dsf-choice-inner,
.dsf-choices--list .dsf-choice-inner {
  position: relative;
  flex-direction: row;
  justify-content: flex-start;
  min-height: 56px;
  padding: 0.75rem 2.75rem 0.75rem 1rem;
  border: 1.5px solid rgba(92, 46, 20, 0.22);
  border-radius: 12px;
  background: #FFFDF8;
  text-align: left;
  font-size: 1rem;
  transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.dsf-choice-inner strong {
  font-size: 1rem;
  font-weight: 600;
  color: var(--tp-ink);
  line-height: 1.25;
}

/* Pastille d'état à droite de chaque choix */
.dsf-choice-inner::after {
  content: "";
  position: absolute;
  right: 1rem;
  top: 50%;
  width: 18px;
  height: 18px;
  margin-top: -9px;
  border: 1.5px solid rgba(92, 46, 20, 0.35);
  border-radius: 50%;
  background: transparent;
}

.dsf-choice:hover .dsf-choice-inner {
  border-color: var(--tp-choco);
  background: #FFFFFF;
}

.dsf-choice input:checked + .dsf-choice-inner {
  border-color: var(--tp-choco);
  background: var(--tp-choco);
  box-shadow: none;
}

.dsf-choice input:checked + .dsf-choice-inner strong {
  color: var(--tp-cream);
}

.dsf-choice input:checked + .dsf-choice-inner::after {
  border-color: #DFA83A;
  background: #DFA83A;
}

.dsf-choice input:focus-visible + .dsf-choice-inner {
  outline: 3px solid var(--tp-caramel);
  outline-offset: 2px;
}

.dsf-fields {
  gap: 1rem;
  margin-bottom: 1.25rem;
}

.dsf-field label {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--tp-ink);
}

.devis-section .dsf-input,
.devis-section .dsf-field input,
.devis-section .dsf-field textarea {
  min-height: 50px;
  padding: 0.75rem 0.95rem;
  border: 1.5px solid rgba(92, 46, 20, 0.22);
  border-radius: 10px;
  background: #FFFDF8;
  color: var(--tp-ink);
  font-size: 1rem;
}

.devis-section .dsf-input:focus,
.devis-section .dsf-field input:focus,
.devis-section .dsf-field textarea:focus {
  border-color: var(--tp-choco);
  outline: 3px solid var(--tp-butter);
  outline-offset: 1px;
}

.dsf-nav {
  justify-content: space-between;
  flex-wrap: wrap;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--tp-line);
}

.dsf-nav .btn {
  margin-left: auto;
}

.dsf-btn-back {
  min-height: 44px;
  padding: 0.5rem 0.25rem;
  border-radius: 8px;
  color: var(--tp-caramel);
  font-size: 1rem;
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}

.dsf-btn-back:hover {
  color: var(--tp-choco);
}

.dsf-success h3 {
  color: var(--tp-ink);
}

.dsf-success p {
  color: var(--tp-muted);
}

@media (max-width: 600px) {
  /* Étape 1 : grille de 2 colonnes pour raccourcir la liste des événements */
  .dsf-choices--list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
  }

  .dsf-choices--list .dsf-choice-inner {
    min-height: 60px;
    padding: 0.6rem 2.1rem 0.6rem 0.75rem;
  }

  .dsf-choices--list .dsf-choice-inner strong {
    font-size: 0.95rem;
  }

  .dsf-choices--list .dsf-choice-inner::after {
    right: 0.65rem;
    width: 16px;
    height: 16px;
    margin-top: -8px;
  }

  .dsf-choices--small {
    grid-template-columns: minmax(0, 1fr);
  }

  .dsf-nav .btn {
    flex: 1 1 auto;
  }
}

/* Coordonnées et réseaux */
.devis-section .contact-info-col {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 0;
}

.devis-section .contact-info-block {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 0;
  border-top: 1px solid rgba(92, 46, 20, 0.18);
}

.devis-section .contact-info-item {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 0;
  padding: 0.75rem 0.25rem;
  border: 0;
  border-bottom: 1px solid rgba(92, 46, 20, 0.18);
  border-radius: 0;
  background: transparent;
  color: var(--tp-ink);
  text-decoration: none;
}

.devis-section .contact-info-item--link {
  transition: background-color 0.15s ease;
}

.devis-section .contact-info-item--link:hover {
  background: rgba(255, 253, 248, 0.6);
  box-shadow: none;
}

.devis-section .contact-info-icon,
.devis-section .contact-info-icon--instagram,
.devis-section .contact-info-icon--facebook {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 28px;
  height: 28px;
  min-width: 28px;
  border: 0;
  border-radius: 0;
  background: transparent;
  /* Caramel chocolaté : lisible sur fond crème */
  color: var(--tp-caramel);
  box-shadow: none;
}

.devis-section .contact-info-icon svg {
  width: 24px;
  height: 24px;
  stroke-width: 2.4;
}

.devis-section .contact-info-item--link:hover .contact-info-icon,
.devis-section .contact-info-item:hover .contact-info-icon {
  background: transparent;
  color: var(--tp-caramel);
  filter: none;
}

.devis-section .contact-info-item--link:focus-visible,
.devis-section .contact-info-link:focus-visible {
  outline: 3px solid var(--tp-butter);
  outline-offset: 3px;
}

.devis-section .contact-info-label {
  margin: 0 0 0.1rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--tp-choco);
}

.devis-section .contact-info-link {
  font-size: 1.08rem;
  font-weight: 600;
  color: var(--tp-choco);
  overflow-wrap: anywhere;
}

.btn-google-review,
.devis-section .btn-google-review,
.devis-section .btn-google-review--large {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  margin: 0;
  padding: 0.75em 1.5em;
  border: 2px solid var(--tp-choco);
  border-radius: 8px;
  background: var(--tp-choco);
  color: var(--tp-cream);
  font-weight: 700;
  box-shadow: none;
  text-decoration: none;
}

.btn-google-review:hover,
.devis-section .btn-google-review:hover {
  background: var(--tp-choco-2);
  border-color: var(--tp-choco-2);
  color: var(--tp-cream);
  transform: none;
  box-shadow: none;
}

.devis-section .btn-google-review,
.devis-section .btn-google-review--large {
  border: 1px solid var(--tp-choco);
  background: var(--tp-cream);
  color: var(--tp-choco);
  font-weight: 600;
}

.devis-section .btn-google-review:hover,
.devis-section .btn-google-review--large:hover,
.devis-section .btn-google-review:focus-visible {
  background: var(--tp-cream-2);
  border-color: var(--tp-choco);
  color: var(--tp-choco);
}

/* ══════════════════════════════════════════
   5. MON HISTOIRE
   ══════════════════════════════════════════ */
.apropos-section {
  background:
    radial-gradient(ellipse 60% 40% at 90% 20%, rgba(224, 168, 58, 0.12), transparent 50%),
    transparent;
  padding: var(--tp-section) 0;
}

.apropos-section .apropos-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(2.5rem, 6vw, 6rem);
  align-items: center;
}

.apropos-section .apropos-media {
  position: relative;
  justify-self: center;
  width: 100%;
  max-width: 340px;
  padding: 0;
}

.apropos-section .apropos-media::before {
  content: none;
}

.apropos-section .apropos-photo-wrapper {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--tp-radius);
  overflow: hidden;
  aspect-ratio: auto;
  background: var(--tp-cream-2);
  box-shadow: none;
}

.apropos-section .apropos-photo {
  display: block;
  width: 100%;
  height: auto;
  max-width: none;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  /* Portrait très vertical : visage et buste gardés dans le cadre */
  object-position: 50% 12%;
  border: 0;
  border-radius: 0;
}

.apropos-section .apropos-content {
  max-width: 36rem;
  text-align: left;
}

.apropos-section .apropos-quote {
  margin: 1.25rem 0 1.5rem;
  padding: 0;
  border: 0;
  color: var(--tp-muted);
  font-family: var(--font-body);
  font-size: 1.1rem;
  font-style: normal;
  line-height: 1.7;
}

.apropos-section .apropos-quote cite {
  display: block;
  margin-top: 0.75rem;
  font-size: 0.95rem;
  font-style: normal;
  color: var(--tp-caramel);
}

.apropos-section .section-title {
  font-size: clamp(2rem, 3.8vw, 3.2rem);
}

.apropos-title .apropos-title-name {
  display: block;
  font-style: normal;
  font-weight: 500;
  color: var(--tp-caramel);
}

.apropos-title .apropos-title-line {
  display: block;
  margin-top: 0.1em;
}

.apropos-section .apropos-text {
  display: block;
  margin: 1.75rem 0 0;
}

.apropos-section .apropos-text p {
  margin: 0 0 1rem;
  font-size: 1.08rem;
  line-height: 1.75;
  color: var(--tp-muted);
  text-align: left;
}

.apropos-section .apropos-text p:first-child {
  font-size: clamp(1.15rem, 1.5vw, 1.3rem);
  line-height: 1.6;
  color: var(--tp-ink);
}

@media (max-width: 860px) {
  .apropos-section .apropos-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .apropos-section .apropos-media {
    justify-self: center;
    max-width: 280px;
  }

  .apropos-section .apropos-photo {
    aspect-ratio: 4 / 5;
    object-position: 50% 12%;
  }
}

/* ══════════════════════════════════════════
   6. MON AGENDA — dates à gauche, carte à droite (fond chocolat)
   ══════════════════════════════════════════ */
.carte-section {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(ellipse 45% 40% at 0% 100%, rgba(224, 168, 58, 0.1), transparent 60%),
    var(--tp-choco-grad);
  color: var(--tp-on-dark);
  padding: var(--tp-section) 0;
}

/* Même vague que les prestations, entre le devis et l'agenda. */
.devis-section + .carte-section {
  overflow: visible;
}

.carte-section .agenda-vague {
  position: absolute;
  left: 0;
  bottom: calc(100% - 1px);
  width: 100%;
  height: clamp(36px, 5vw, 72px);
  line-height: 0;
  pointer-events: none;
}

.carte-section .agenda-vague svg {
  display: block;
  width: 100%;
  height: 100%;
}

.carte-section .agenda-vague path {
  fill: #6B3A1F;
}

/* Quadrillage de gaufre très discret en fond */
.carte-section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(246, 235, 221, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(246, 235, 221, 0.035) 1px, transparent 1px);
  background-size: 28px 28px;
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent);
  mask-image: linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent);
}

.carte-section > .container {
  position: relative;
}

.carte-section .section-header {
  max-width: 44rem;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.carte-section .section-label {
  color: var(--tp-butter);
}

.carte-section .section-title {
  color: var(--tp-on-dark);
}

.carte-section .section-title em {
  color: var(--tp-butter-soft);
  -webkit-text-fill-color: var(--tp-butter-soft);
}

.carte-section .section-subtitle {
  color: var(--tp-on-dark-muted);
}

/* Deux colonnes de même hauteur, en-têtes sur la même ligne */
.carte-section .carte-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 380px);
  gap: clamp(2rem, 5vw, 4rem);
  align-items: stretch;
}

.carte-section .agenda-col {
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin: 0;
}

.carte-section .agenda-col-head {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-height: 2.5rem;
  margin: 0 0 1rem;
  padding-bottom: 0.9rem;
  border-bottom: 1px solid var(--tp-line-dark);
}

.carte-section .agenda-col-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.2rem, 1.8vw, 1.4rem);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--tp-on-dark);
}

.carte-section .agenda-col-count {
  margin-left: auto;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--tp-on-dark-muted);
  white-space: nowrap;
}

/* Dates */
.carte-section .dates-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.carte-section .date-card {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.9rem 1rem;
  border: 1px solid var(--tp-line-dark);
  border-left: 3px solid var(--tp-butter);
  border-radius: var(--tp-radius);
  background: rgba(246, 235, 221, 0.06);
  box-shadow: none;
  transition: transform 0.25s ease, border-color 0.25s ease, background-color 0.25s ease;
  animation: tp-agenda-in 0.6s cubic-bezier(0.16, 1, 0.3, 1) backwards;
  animation-delay: calc(var(--i, 0) * 0.08s);
}

.carte-section .date-card:hover {
  transform: translateX(6px);
  border-color: color-mix(in srgb, var(--tp-butter) 55%, transparent);
  border-left-color: var(--tp-butter);
  background: rgba(246, 235, 221, 0.11);
  box-shadow: none;
}

.carte-section .date-card-date {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: none;
  min-width: 4.5rem;
  padding: 0.55em 0.7em;
  border-radius: var(--tp-radius-sm);
  background: var(--tp-butter);
  box-shadow: none;
  color: var(--tp-choco);
  line-height: 1.1;
  text-align: center;
  transition: transform 0.25s ease;
}

.carte-section .date-card:hover .date-card-date {
  transform: rotate(-4deg) scale(1.05);
}

.carte-section .date-day-name,
.carte-section .date-month {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--tp-choco);
}

.carte-section .date-day-num {
  font-family: var(--font-display);
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--tp-choco);
}

.carte-section .date-card-info {
  flex: 1;
  min-width: 0;
}

.carte-section .date-card-title {
  margin: 0 0 0.25em;
  font-size: 1.08rem;
  color: var(--tp-on-dark);
}

.carte-section .date-card-heure,
.carte-section .date-card-adresse {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
  font-size: 0.92rem;
  color: var(--tp-on-dark-muted);
}

.carte-section .date-card-heure svg,
.carte-section .date-card-adresse svg {
  flex: none;
  color: var(--tp-butter);
}

.carte-section .date-card-maps {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  flex: none;
  padding: 0.5rem 0.85rem;
  border: 1px solid var(--tp-butter);
  border-radius: var(--tp-radius-sm);
  background: var(--tp-butter);
  color: var(--tp-choco);
  font-size: 0.88rem;
  font-weight: 700;
  text-decoration: none;
  text-shadow: none;
  box-shadow: none;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.carte-section .date-card-maps:hover {
  background: var(--tp-butter-soft);
  border-color: var(--tp-butter-soft);
}

/* Aucune date : le bloc remplit la colonne, à la hauteur de la carte */
.carte-section .dates-empty {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: clamp(1.75rem, 4vw, 3rem) clamp(1.25rem, 3vw, 2.5rem);
  border: 1px dashed color-mix(in srgb, var(--tp-butter) 55%, transparent);
  border-radius: var(--tp-radius);
  background: rgba(246, 235, 221, 0.05);
  text-align: center;
  animation: tp-agenda-in 0.6s cubic-bezier(0.16, 1, 0.3, 1) backwards;
}

.carte-section .dates-empty-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background: color-mix(in srgb, var(--tp-butter) 18%, transparent);
  color: var(--tp-butter);
  animation: tp-agenda-bob 3.2s ease-in-out infinite;
}

.carte-section .dates-empty-title {
  margin: 1.1rem 0 0.5rem;
  font-family: var(--font-display);
  font-size: clamp(1.3rem, 2.2vw, 1.6rem);
  font-weight: 600;
  color: var(--tp-on-dark);
}

.carte-section .dates-empty-text {
  max-width: 26rem;
  margin: 0;
  color: var(--tp-on-dark-muted);
}

/* Carte affichée en entier, sans recadrage ni cadre */
.carte-section .carte-figure {
  width: 100%;
}

.carte-section .carte-zoom {
  position: relative;
  display: block;
  border-radius: var(--tp-radius);
  box-shadow: 0 18px 40px rgba(20, 10, 6, 0.3);
  cursor: zoom-in;
}

.carte-section .carte-zoom img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--tp-radius);
}

.carte-section .carte-zoom-icon {
  position: absolute;
  left: 0.75rem;
  bottom: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--tp-choco);
  color: var(--tp-butter);
}

@keyframes tp-agenda-in {
  from { opacity: 0; transform: translateY(14px); }
}

@keyframes tp-agenda-bob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}

/* Agrandissement */
.carte-dialog {
  width: min(100vw - 2rem, 1000px);
  max-width: none;
  max-height: calc(100dvh - 2rem);
  margin: auto;
  padding: 0;
  border: 0;
  border-radius: var(--tp-radius);
  background: var(--tp-cream);
  overflow: auto;
  overscroll-behavior: contain;
}

.carte-dialog::backdrop {
  background: rgba(20, 10, 6, 0.82);
}

.carte-dialog img {
  display: block;
  width: 100%;
  height: auto;
}

/* Fixe dans la fenêtre : reste accessible quel que soit le défilement */
.carte-dialog-close {
  position: fixed;
  z-index: 1;
  top: 1rem;
  right: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  margin: 0;
  border: 2px solid var(--tp-on-dark);
  border-radius: 50%;
  background: var(--tp-choco);
  color: var(--tp-on-dark);
  cursor: pointer;
}

.carte-dialog-close:hover {
  background: var(--tp-butter);
  color: var(--tp-choco);
}

.carte-dialog-close:focus-visible {
  outline: 3px solid var(--tp-butter);
}

html.carte-dialog-open {
  overflow: hidden;
}

@media (max-width: 860px) {
  .carte-section .carte-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
  }

  .carte-section .carte-figure {
    max-width: 420px;
  }
}

@media (max-width: 560px) {
  .carte-section .date-card {
    flex-wrap: wrap;
  }

  .carte-section .date-card-maps {
    width: 100%;
    justify-content: center;
  }
}

/* Petits écrans : carte en plein écran, à double largeur, à parcourir au doigt */
@media (max-width: 700px) {
  .carte-dialog {
    width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    border-radius: 0;
  }

  .carte-dialog img {
    width: 200%;
    max-width: none;
  }
}

/* ══════════════════════════════════════════
   7. PRESSE
   ══════════════════════════════════════════ */
.presse-section {
  background: var(--tp-cream);
  padding: var(--tp-section) 0;
}

.presse-section .section-header {
  margin-bottom: clamp(1.35rem, 2.8vw, 2.1rem);
}

.presse-section .section-subtitle,
.presse-section .section-subtitle--light {
  margin-top: 0.75rem;
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2.6vw, 2.1rem);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--tp-ink);
}

.presse-section .presse-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1rem, 2.5vw, 1.75rem);
  max-width: none;
  margin: 0;
}

.presse-section .presse-card {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 1.5rem;
  align-items: start;
  padding: clamp(1.5rem, 3vw, 2.25rem);
  border: 1px solid var(--tp-line);
  border-radius: var(--tp-radius);
  background: var(--tp-cream-2);
  color: var(--tp-ink);
  text-decoration: none;
  box-shadow: none;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.presse-section .presse-card:hover,
.presse-section .presse-card:focus-visible {
  border-color: var(--tp-choco);
  background: #fff;
  box-shadow: none;
  transform: none;
}

/* Logo du journal centré verticalement face à l'extrait */
.presse-section .presse-card-logo {
  align-self: center;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 96px;
  height: 96px;
  margin: 0;
  padding: 0;
  border-radius: var(--tp-radius);
  background: #FFFFFF;
  overflow: hidden;
}

.presse-section .presse-card-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Logo Ouest-France (wordmark + symbole) : proportions horizontales */
.presse-section .presse-card-logo--of {
  padding: 0.85rem 0.65rem;
}

.presse-section .presse-card-logo--of img {
  width: 100%;
  height: auto;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
}

.presse-section .presse-card-logo-fallback {
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
  font-family: var(--font-display);
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.15;
  text-align: center;
  color: var(--tp-ink);
}

.presse-section .presse-card-extrait {
  margin: 0 0 1rem;
  font-family: var(--font-body);
  font-size: clamp(1.1rem, 1.5vw, 1.25rem);
  font-style: normal;
  line-height: 1.5;
  color: var(--tp-ink);
}

.presse-section .presse-card-lire {
  font-weight: 700;
  color: var(--tp-caramel);
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}

@media (max-width: 860px) {
  .presse-section .presse-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 480px) {
  .presse-section .presse-card {
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
  }

  /* Mobile : logo centré au-dessus de l'extrait */
  .presse-section .presse-card-logo {
    justify-self: center;
    width: 88px;
    height: 88px;
  }
}

/* ══════════════════════════════════════════
   PIED DE PAGE
   ══════════════════════════════════════════ */
.site-footer {
  background: var(--tp-choco-grad);
  color: var(--tp-on-dark);
  padding: clamp(3.5rem, 7vw, 5rem) 0 0;
}

.site-footer .footer-inner {
  max-width: var(--tp-wrap);
  margin: 0 auto;
  padding: 0 var(--tp-gutter) clamp(2.5rem, 5vw, 3.5rem);
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 4rem);
}

.site-footer .footer-logo-text {
  font-family: var(--font-display);
  font-size: clamp(2.2rem, 4vw, 3rem);
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--tp-on-dark);
}

.site-footer .footer-tagline {
  margin-top: 1rem;
  font-size: 1.05rem;
  line-height: 1.6;
  color: var(--tp-on-dark-muted);
}

.site-footer .footer-tagline span {
  color: var(--tp-butter);
  font-weight: 600;
}

.site-footer .footer-nav-title {
  margin: 0 0 1rem;
  font-size: 0.78rem !important;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--tp-butter);
}

.site-footer .footer-nav ul {
  display: grid;
  gap: 0.15rem;
  margin: 0;
  padding: 0;
}

.site-footer .footer-nav a {
  display: inline-block;
  padding: 0.3rem 0;
  color: var(--tp-on-dark);
  text-decoration: none;
}

.site-footer .footer-nav a:hover,
.site-footer .social-link:hover {
  color: var(--tp-butter);
}

.site-footer .social-links {
  display: grid;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
}

.site-footer .social-link {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  min-height: 44px;
  color: var(--tp-on-dark);
  font-weight: 600;
  text-decoration: none;
  background: none;
  box-shadow: none;
}

.site-footer .footer-contact-cta {
  color: var(--tp-butter);
}

.site-footer .footer-contact-cta:hover,
.site-footer .footer-contact-cta:focus-visible {
  color: var(--tp-on-dark);
}

.site-footer .footer-contact-cta svg {
  flex: none;
}

.site-footer .btn-google-review {
  border-color: var(--tp-butter);
  background: transparent;
  color: var(--tp-butter);
}

.site-footer .btn-google-review:hover {
  background: var(--tp-butter);
  color: var(--tp-choco);
}

.site-footer .footer-bottom {
  border-top: 1px solid var(--tp-line-dark);
  background: transparent;
}

.site-footer .footer-bottom-inner {
  max-width: var(--tp-wrap);
  margin: 0 auto;
  padding: 1.25rem var(--tp-gutter) calc(1.25rem + env(safe-area-inset-bottom));
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.75rem 2rem;
}

.site-footer .footer-copyright,
.site-footer .footer-made {
  margin: 0;
  font-size: 0.92rem;
  color: var(--tp-on-dark-muted);
}

.site-footer .footer-copyright a {
  color: var(--tp-on-dark-muted);
}

.site-footer .footer-copyright a:hover {
  color: var(--tp-butter);
}

@media (max-width: 760px) {
  .site-footer .footer-inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .site-footer .footer-brand {
    grid-column: 1 / -1;
  }
}

@media (max-width: 420px) {
  .site-footer .footer-inner {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ── Mobile : vides verticaux resserrés (≈ 40 px par côté de section) ── */
@media (max-width: 600px) {
  .gallery-section {
    padding-bottom: 2.5rem;
  }

  .offres-section,
  .devis-section,
  .apropos-section,
  .carte-section,
  .dates-section,
  .presse-section {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }

  .offres-section {
    padding-top: calc(2.5rem * 2 / 3);
  }

  .site-footer {
    padding-top: 2.5rem;
  }

  .section-header {
    margin-bottom: 1.5rem;
  }

  .apropos-section .apropos-text p:last-child,
  .presse-section .presse-card-extrait {
    margin-bottom: 0.75rem;
  }

  .apropos-section .apropos-text p:last-child {
    margin-bottom: 0;
  }

  /* Page « Choisissez vos gaufres » : le retour arrive juste sous l'en-tête */
  main.menu-gaufres-page .menu-gaufres-content {
    padding-top: 0.5rem;
    padding-bottom: 2.5rem;
  }

  .menu-gaufres-page .menu-gaufres-header {
    margin-bottom: 1.25rem;
  }

  .menu-gaufres-page .menu-gaufres-header .section-title {
    margin-top: 0.25rem;
  }
}

/* ── Mouvement réduit ── */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}

/* ══════════════════════════════════════════
   PAGE « CHOISISSEZ VOS GAUFRES » (/menu-gaufres/)
   Les deux fiches de l'offre événementielle, encadrées
   ══════════════════════════════════════════ */
.menu-gaufres-page {
  background: var(--tp-choco-grad);
  color: var(--tp-on-dark);
}

.menu-gaufres-page .menu-gaufres-content {
  padding: clamp(1.5rem, 4vw, 3rem) 0 clamp(3rem, 6vw, 5rem);
}

.menu-gaufres-header {
  max-width: calc(1080px + 4rem + 2 * var(--tp-gutter));
  margin: 0 auto clamp(1.75rem, 4vw, 2.75rem);
  text-align: center;
}

.menu-gaufres-back {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--tp-butter-soft);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}

.menu-gaufres-back:hover {
  color: var(--tp-on-dark);
}

.menu-gaufres-header .section-title {
  margin: 0.5rem auto 0;
  max-width: 22ch;
  font-size: clamp(1.9rem, 4vw, 3rem);
  text-align: center;
  color: var(--tp-on-dark);
}

.menu-gaufres-page .menu-gaufres-grid {
  grid-template-columns: repeat(2, minmax(0, 540px));
  gap: clamp(1.25rem, 3vw, 2.5rem);
  align-items: stretch;
  max-width: calc(1080px + 4rem + 2 * var(--tp-gutter));
}

/* Cadre : passe-partout crème, liseré beurre, filet chocolat */
.menu-gaufres-page .menu-gaufres-card {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  max-width: 100%;
  padding: clamp(10px, 1.5vw, 16px);
  border: 2px solid var(--tp-butter);
  border-radius: calc(var(--tp-radius) + 8px);
  background: #FFFDF8;
  box-shadow: 0 0 0 6px rgba(246, 235, 221, 0.18), 0 0 0 7px rgba(246, 235, 221, 0.35);
  overflow: hidden;
}

.menu-gaufres-page .menu-gaufres-card img {
  max-width: 100%;
  border-radius: var(--tp-radius);
}

.menu-gaufres-cta {
  display: flex;
  justify-content: center;
  margin-top: clamp(2rem, 4vw, 3rem);
}

@media (max-width: 768px) {
  .menu-gaufres-page .menu-gaufres-grid {
    grid-template-columns: minmax(0, 540px);
    gap: 1.75rem;
  }

  /* Mobile : la fiche prend la largeur de l'écran, cadre réduit à un simple liseré */
  .menu-gaufres-page .menu-gaufres-grid {
    width: 100%;
  }

  .menu-gaufres-page .menu-gaufres-card {
    width: 100%;
    max-width: 100%;
    padding: 0;
    border-width: 2px;
    border-radius: var(--tp-radius);
    box-shadow: none;
  }

  .menu-gaufres-page .menu-gaufres-card img {
    width: 100%;
    max-width: 100%;
    border-radius: calc(var(--tp-radius) - 2px);
  }

  .menu-gaufres-cta .btn {
    width: 100%;
    max-width: 540px;
  }
}

/* En-tête mobile et tablette : logo à gauche, menu à droite. */
@media (max-width: 1023px) {
  .header-inner {
    justify-content: space-between;
  }

  .header-inner .header-logo {
    display: flex;
    flex-shrink: 0;
    margin-right: auto;
  }

  .header-inner .header-logo .logo-img {
    display: block;
    width: 108px;
    height: auto;
    max-height: 64px;
    object-fit: contain;
  }

}

/* ------------------------------------------
   8. FAQ
   ------------------------------------------ */
.faq-section {
  background: var(--tp-cream-2);
  padding: var(--tp-section) 0;
}

.faq-section .section-header {
  margin-bottom: clamp(1.5rem, 3vw, 2.25rem);
}

.faq-section .section-title {
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
}

.faq-section .section-subtitle {
  margin-top: 0.75rem;
  max-width: 38rem;
  color: var(--tp-muted);
}

/* Comme les contacts du devis : pas de cadre, un simple filet sous chaque question */
.faq-list {
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--tp-line);
}

.faq-item {
  border-bottom: 1px solid var(--tp-line);
}

.faq-question {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
}

.faq-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  margin: 0;
  padding: 1.15rem 0;
  border: 0;
  background: transparent;
  color: var(--tp-ink);
  font-family: inherit;
  font-size: 1.02rem;
  font-weight: 600;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
}

.faq-trigger:hover,
.faq-trigger:focus-visible {
  color: var(--tp-caramel);
  outline: none;
}

.faq-trigger-text {
  flex: 1;
  min-width: 0;
}

.faq-trigger-icon {
  position: relative;
  flex: none;
  width: 1.15rem;
  height: 1.15rem;
}

.faq-trigger-icon::before,
.faq-trigger-icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: currentColor;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.faq-trigger-icon::before {
  width: 100%;
  height: 2px;
  transform: translate(-50%, -50%);
}

.faq-trigger-icon::after {
  width: 2px;
  height: 100%;
  transform: translate(-50%, -50%);
}

.faq-trigger[aria-expanded="true"] .faq-trigger-icon::after {
  opacity: 0;
  transform: translate(-50%, -50%) rotate(90deg);
}

.faq-panel {
  padding: 0 2.25rem 1.25rem 0;
}

.faq-panel[hidden] {
  display: none;
}

.faq-panel p,
.faq-panel li {
  margin: 0;
  color: var(--tp-muted);
  font-size: 0.98rem;
  line-height: 1.65;
}

.faq-panel p + p,
.faq-panel ul + p {
  margin-top: 0.75rem;
}

.faq-panel ul {
  margin: 0.5rem 0 0;
  padding-left: 1.2rem;
  list-style: disc;
}

.faq-panel li + li {
  margin-top: 0.3rem;
}

.faq-panel li::marker {
  color: var(--tp-caramel);
}

.faq-panel strong {
  color: var(--tp-ink);
  font-weight: 700;
}

.faq-inline-link {
  color: var(--tp-caramel);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.faq-inline-link:hover,
.faq-inline-link:focus-visible {
  color: var(--tp-choco);
}

/* Lecture : le hero et le lettrage du logo conservent leur typographie. */
body *:not(:where(.hero-section, .hero-section *, .header-logo, .header-logo *, .logo-text, .logo-text *)) {
  font-style: normal !important;
}

:is(.offres-section, .devis-section, .dates-section, .carte-section, .faq-section, .presse-section) :is(p, li, blockquote) {
  font-family: system-ui, -apple-system, 'Segoe UI', sans-serif !important;
  font-size: 1rem;
  line-height: 1.6;
}

:is(.offres-section, .devis-section, .dates-section, .carte-section, .faq-section, .presse-section) :is(p, li, blockquote) :where(em, i, cite, span, a, strong, b) {
  font-family: inherit;
}

.faq-section .faq-trigger-text {
  font-family: system-ui, -apple-system, 'Segoe UI', sans-serif;
  line-height: 1.5;
}

.faq-section .faq-panel :is(p, li),
.devis-section .form-note,
.carte-section :is(.date-card-heure, .date-card-adresse, .dates-empty-text),
.dates-section :is(.date-card-heure, .date-card-adresse, .dates-empty-text) {
  font-size: 1rem;
  line-height: 1.6;
}


/* Légende de la photo d’accueil sur mobile. */
@media (max-width: 767px) {
.hero-section .hero-float-wrap {
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 8px;
}
.hero-section .hero-quote {
  color: var(--tp-muted);
  text-align: left;
  line-height: 1.45;
}
.hero-section .hero-quote p {
  padding: 0;
  line-height: 1.45;
}
.hero-section .hero-quote cite {
  display: block;
  margin-top: 4px;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.4;
  color: var(--tp-muted);
}
.hero-section .hero-quote cite::before,
.hero-section .hero-quote cite::after {
  content: none;
}
@media (max-width: 767px) {
  .hero-section .hero-float-wrap { display: contents; }
  .hero-section .hero-img-frame { margin-bottom: 6px; }
  .hero-section .hero-quote {
    margin-bottom: 14px;
    text-align: center;
  }
}
/* Une légende compacte, équilibrée sous la photo, sans couper le texte. */
.hero-section .hero-quote p {
  max-width: 64ch;
  margin-inline: auto;
  text-align: center;
  text-wrap: balance;
}
.hero-section .hero-quote cite {
  font-size: 9px;
  text-align: center;
}
@media (max-width: 767px) {
  .hero-section .hero-quote p {
    max-width: none;
    line-height: 1.4;
  }
  .hero-section .hero-quote cite {
    font-size: 9px;
    margin-top: 3px;
  }
}
}

/* PC : une citation mise en avant à côté du portrait. */
@media (min-width: 768px) {
  .hero-section .hero-quote p {
    padding: 14px 30px;
    font-size: 15px;
    line-height: 1.5;
  }

  .hero-section .hero-quote-curly {
    font-size: 72px;
  }
}

/* Sur mobile, conserver les guillemets simples dans la légende compacte. */
@media (max-width: 767px) {
  .hero-section .hero-quote-mark {
    position: static;
    display: inline;
  }

  .hero-section .hero-quote-angle {
    position: static;
    width: auto;
    height: auto;
    overflow: visible;
    clip-path: none;
  }

  .hero-section .hero-quote-curly {
    display: none;
  }
}