/* Actions voyage sur la photo, en haut à droite. Le flux garde le titre à distance. */
.page-hero--with-voyages {
  display: flex;
  flex-direction: column;
  height: auto;
  min-height: var(--dr-hero-min-height, 480px);
}
.page-hero--itineraire { --dr-hero-min-height: 600px; }
.page-hero--itineraire:not(.page-hero--with-voyages) { height: 600px; }
.page-hero--with-voyages .page-hero-content {
  flex: 1;
  height: auto;
  min-width: 0;
  padding-top: 32px;
}
.page-hero--with-voyages .hero-h1,
.dr-act-hero--with-voyages h1 { overflow-wrap: anywhere; }
.dr-act-hero--with-voyages .dr-act-hero-copy { min-width: 0; }
.page-hero .drv-save-wrap--hero,
.dr-act-hero .drv-save-wrap--hero {
  position: relative;
  z-index: 3;
  align-self: flex-end;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 4px 8px;
  width: fit-content;
  max-width: calc(100% - 96px);
  margin: 24px 48px 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #fffdf9;
}
.drv-save-wrap--hero :is(.drv-save-button, .drv-save-to-trip, .drv-see-wishes) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 44px;
  padding: 8px 12px;
  font: 400 13px/1.4 'DM Sans', Arial, sans-serif;
  white-space: nowrap;
  text-decoration: none;
}
.page-hero .drv-save-wrap--hero .drv-save-button,
.dr-act-hero .drv-save-wrap--hero .drv-save-button {
  border: 1px solid rgba(255, 253, 249, .65);
  border-radius: 2px;
  background: rgba(27, 24, 20, .6);
  color: #fffdf9;
}
.drv-save-wrap--hero .drv-save-button svg { width: 16px; height: 16px; }
.page-hero .drv-save-wrap--hero .drv-save-button:hover,
.dr-act-hero .drv-save-wrap--hero .drv-save-button:hover { background: rgba(27, 24, 20, .8); }
.page-hero .drv-save-wrap--hero .drv-save-button[aria-pressed="true"],
.dr-act-hero .drv-save-wrap--hero .drv-save-button[aria-pressed="true"] {
  border-color: #fffdf9;
  background: #fffdf9;
  color: #754631;
}
.drv-save-wrap--hero .drv-save-button[aria-pressed="true"] svg { fill: currentColor; }
.page-hero .drv-save-wrap--hero .drv-save-to-trip,
.dr-act-hero .drv-save-wrap--hero .drv-save-to-trip {
  border: 1px solid #a94416;
  border-radius: 2px;
  background: #a94416;
  color: #fffdf9;
}
.page-hero .drv-save-wrap--hero .drv-save-to-trip:hover,
.dr-act-hero .drv-save-wrap--hero .drv-save-to-trip:hover { background: #8c3612; border-color: #8c3612; }
.drv-save-wrap--hero .dr-hero-add-icon { font: 400 20px/1 Arial, sans-serif; }
.drv-save-wrap--hero .drv-see-wishes {
  color: #fffdf9;
  text-decoration: underline;
  text-underline-offset: 4px;
  text-shadow: 0 1px 3px rgba(27, 24, 20, .85);
}
.drv-save-wrap--hero :is(button, a):focus-visible { outline: 2px solid #fffdf9; outline-offset: 3px; }
.drv-save-wrap--hero :is(.dr-hero-save-short, .dr-hero-saved-short) { display: none; }
.page-hero .drv-save-wrap--hero .drv-wish-feedback,
.dr-act-hero .drv-save-wrap--hero .drv-wish-feedback {
  max-width: 480px;
  padding: 5px 9px;
  border-radius: 2px;
  background: rgba(27, 24, 20, .9);
  color: #fffdf9;
  font-size: 12px;
  overflow-wrap: anywhere;
  text-align: right;
}
.drv-save-wrap--hero noscript { padding: 5px 9px; background: rgba(27, 24, 20, .9); font-size: 12px; }
.page-hero--with-voyages .hero-badge { right: auto; left: 48px; }
.page-hero--with-voyages .hero-rating {
  position: absolute;
  top: 24px;
  left: 48px;
  z-index: 3;
  color: #fff;
}
.page-hero--with-voyages .hero-badge ~ .hero-rating { top: 64px; }
.dr-act-hero--with-voyages { display: flex; flex-direction: column; }
.dr-act-hero--with-voyages .dr-act-hero-inner { width: 100%; min-height: 0; flex: 1; padding-top: 32px; }
.dr-act-hero .drv-save-wrap--hero { margin-right: 24px; }

/* La météo retrouve sa séparation entre les chapitres, dans la colonne du guide. */
.article-main .dr-meteo-wrap--middle { width: 100%; min-width: 0; margin: 24px 0 32px; }
.article-main .dr-meteo-wrap--middle .dr-meteo-widget {
  margin: 0;
  border-top: 1px solid var(--rule);
  padding: 24px 20px;
}

@media (max-width: 1024px) {
  .page-hero--with-voyages { --dr-hero-min-height: 420px; }
  .page-hero--itineraire { --dr-hero-min-height: 600px; }
  .page-hero .drv-save-wrap--hero,
  .dr-act-hero .drv-save-wrap--hero { max-width: calc(100% - 48px); margin: 20px 24px 0 auto; }
  .page-hero--with-voyages .hero-badge,
  .page-hero--with-voyages .hero-rating,
  .page-hero--with-voyages .hero-badge ~ .hero-rating {
    position: static;
    align-self: flex-start;
    margin: 12px 24px 0;
  }
}
@media (max-width: 640px) {
  .page-hero--with-voyages { --dr-hero-min-height: 340px; }
  .page-hero--itineraire { --dr-hero-min-height: 600px; }
  .page-hero .drv-save-wrap--hero,
  .dr-act-hero .drv-save-wrap--hero { max-width: calc(100% - 32px); margin: 16px 16px 0 auto; padding: 0; gap: 4px 8px; }
  .drv-save-wrap--hero .drv-save-button--compact-label > span:first-of-type {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }
  .drv-save-wrap--hero .drv-save-button:not([aria-pressed="true"]) .dr-hero-save-short,
  .drv-save-wrap--hero .drv-save-button[aria-pressed="true"] .dr-hero-saved-short { display: inline; }
  .drv-save-wrap--hero .drv-see-wishes { flex-basis: 100%; justify-content: flex-end; padding: 0; }
  .page-hero--with-voyages .hero-badge,
  .page-hero--with-voyages .hero-rating,
  .page-hero--with-voyages .hero-badge ~ .hero-rating { margin-left: 16px; }
  .article-main .dr-meteo-wrap--middle .dr-meteo-widget { padding: 20px 12px; }
}
@media print { .drv-save-wrap--hero, .dr-meteo-wrap--middle { display: none !important; } }