/* deco-in.fr : etats hover et focus visibles pour les huit roles interactifs.
   Palette du brief : papier #ffffff, encre #373737, accent framboise #a70092,
   filet #d8ccc2. Aucun deplacement de mise en page. Aucun envoi, aucune donnee. */

:root {
  --dd-paper: #ffffff;
  --dd-ink: #373737;
  --dd-accent: #a70092;
  --dd-accent-2: #a70092;
  --dd-line: #d8ccc2;
}

/* 1. Fil d'Ariane */
.dn-breadcrumb a[href] {
  transition: color 140ms ease, text-decoration-color 140ms ease;
}
.dn-breadcrumb a[href]:hover {
  color: var(--dd-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dn-breadcrumb a[href]:focus-visible {
  outline: 2px solid var(--dd-accent);
  outline-offset: 3px;
  border-radius: 2px;
}

/* 2. Lien auteur (byline et carte auteur) */
.dn-article-author[href],
.dn-author-card h2 a[href],
.dn-author-card__portrait[href] {
  transition: color 140ms ease, opacity 140ms ease;
}
.dn-article-author[href]:hover,
.dn-author-card h2 a[href]:hover {
  color: var(--dd-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dn-author-card__portrait[href]:hover {
  opacity: 0.82;
}
.dn-article-author[href]:focus-visible,
.dn-author-card h2 a[href]:focus-visible,
.dn-author-card__portrait[href]:focus-visible {
  outline: 2px solid var(--dd-accent);
  outline-offset: 3px;
  border-radius: 2px;
}

/* 3. Cartes editoriales (titre et visuel), y compris la home u26 */
.dn-stream-card h2 a[href],
.dn-stream-card h3 a[href],
.dn-archive-card h2 a[href],
.dn-archive-card h3 a[href],
.dn-more-card h2 a[href],
.dn-more-card h3 a[href],
.dn-related-card h2 a[href],
.dn-related-card h3 a[href],
.dn-lead h2 a[href],
.dn-lead h3 a[href],
.dn-u26-card h2 a[href],
.dn-u26-card h3 a[href],
.dn-u26-card a[href] {
  transition: color 140ms ease;
}
.dn-stream-card h2 a[href]:hover,
.dn-stream-card h3 a[href]:hover,
.dn-archive-card h2 a[href]:hover,
.dn-archive-card h3 a[href]:hover,
.dn-more-card h2 a[href]:hover,
.dn-more-card h3 a[href]:hover,
.dn-related-card h2 a[href]:hover,
.dn-related-card h3 a[href]:hover,
.dn-lead h2 a[href]:hover,
.dn-lead h3 a[href]:hover,
.dn-u26-card h2 a[href]:hover,
.dn-u26-card h3 a[href]:hover {
  color: var(--dd-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dn-stream-card a[href]:focus-visible,
.dn-archive-card a[href]:focus-visible,
.dn-more-card a[href]:focus-visible,
.dn-related-card a[href]:focus-visible,
.dn-lead a[href]:focus-visible,
.dn-u26-card a[href]:focus-visible {
  outline: 2px solid var(--dd-accent);
  outline-offset: 3px;
  border-radius: 2px;
}
.dn-stream-card__media[href]:hover,
.dn-archive-card__media[href]:hover,
.dn-more-card__media[href]:hover,
.dn-related-card__media[href]:hover,
.dn-lead__media[href]:hover,
.dn-u26-card__media[href]:hover {
  opacity: 0.86;
}

/* 4. Boutons et CTA */
.dn-form-submit,
.dn-trust__button[href] {
  transition: background-color 140ms ease, color 140ms ease, border-color 140ms ease;
}
.dn-form-submit:hover,
.dn-trust__button[href]:hover {
  background-color: var(--dd-accent);
  color: var(--dd-paper);
  border-color: var(--dd-accent);
}
.dn-form-submit:focus-visible,
.dn-trust__button[href]:focus-visible {
  outline: 2px solid var(--dd-ink);
  outline-offset: 3px;
}

/* 5. Pagination */
.dn-pagination a[href] {
  transition: color 140ms ease, background-color 140ms ease, border-color 140ms ease;
}
.dn-pagination a[href]:hover {
  color: var(--dd-paper);
  background-color: var(--dd-accent);
  border-color: var(--dd-accent);
}
.dn-pagination a[href]:focus-visible {
  outline: 2px solid var(--dd-accent);
  outline-offset: 3px;
}

/* 6. Liens de footer */
.dn-fleet-footer__links a[href],
.dn-fleet-footer__sections a[href],
.dn-fleet-footer__base a[href] {
  transition: color 140ms ease;
}
.dn-fleet-footer__links a[href]:hover,
.dn-fleet-footer__sections a[href]:hover,
.dn-fleet-footer__base a[href]:hover {
  color: var(--dd-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dn-fleet-footer__links a[href]:focus-visible,
.dn-fleet-footer__sections a[href]:focus-visible,
.dn-fleet-footer__base a[href]:focus-visible {
  outline: 2px solid var(--dd-paper);
  outline-offset: 3px;
}

/* 7. Liens de partage d'article */
.dn-share__link[href] {
  transition: color 140ms ease, border-color 140ms ease, background-color 140ms ease;
}
.dn-share__link[href]:hover {
  color: var(--dd-paper);
  background-color: var(--dd-accent);
  border-color: var(--dd-accent);
}
.dn-share__link[href]:focus-visible {
  outline: 2px solid var(--dd-accent);
  outline-offset: 3px;
}

/* 8. Liens sociaux du footer */
.dn-fleet-footer__social a[href] {
  transition: color 140ms ease, border-color 140ms ease, background-color 140ms ease;
}
.dn-fleet-footer__social a[href]:hover {
  color: var(--dd-paper);
  background-color: var(--dd-accent);
  border-color: var(--dd-accent);
}
.dn-fleet-footer__social a[href]:focus-visible {
  outline: 2px solid var(--dd-paper);
  outline-offset: 3px;
}

/* Bloc de partage : mise en page aeree, alignee sur le footer d'article. */
.dn-share {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 20px 0 4px;
}
.dn-share__label {
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--dd-accent);
}
.dn-share__link[href] {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 6px 14px;
  border: 1px solid var(--dd-accent);
  border-radius: 999px;
  font-size: 14px;
  color: var(--dd-ink);
  text-decoration: none;
}

/* Liens sociaux du footer : tailles exploitables (14 px minimum). */
.dn-fleet-footer__social {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  padding: 0 0 18px;
}
.dn-fleet-footer__social a[href] {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 6px 14px;
  border: 1px solid rgba(255, 255, 255, 0.42);
  border-radius: 999px;
  font-size: 14px;
  color: var(--dd-paper);
  text-decoration: none;
}

/* Bloc commercial de Contact : flex robuste au <p> vide injecte, pour que le
   contenu utile occupe la largeur et ne laisse pas de colonne morte. */
.dn-trust__contact-commercial {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: clamp(24px, 5vw, 54px);
}
.dn-trust__contact-commercial > .dn-trust__marketplace-logo {
  flex: 0 0 auto;
  width: 210px;
  max-width: 210px;
}
.dn-trust__contact-commercial > div {
  flex: 1 1 420px;
  min-width: 0;
}
.dn-trust__contact-commercial > p:empty {
  display: none;
}
@media (max-width: 820px) {
  .dn-trust__contact-commercial {
    flex-direction: column;
    align-items: flex-start;
  }
  .dn-trust__contact-commercial > .dn-trust__marketplace-logo {
    width: 150px;
    max-width: 150px;
  }
  .dn-trust__contact-commercial > div {
    flex: 1 1 auto;
    width: 100%;
  }
}
body .dn-trust .dn-trust__contact-commercial {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  grid-template-columns: none !important;
  gap: clamp(24px, 5vw, 54px) !important;
}
body .dn-trust .dn-trust__contact-commercial > .dn-trust__marketplace-logo {
  flex: 0 0 auto !important;
  width: 210px !important;
  max-width: 210px !important;
}
body .dn-trust .dn-trust__contact-commercial > div {
  flex: 1 1 420px !important;
  min-width: 0 !important;
  width: auto !important;
}
body .dn-trust .dn-trust__contact-commercial > p:empty {
  display: none !important;
}

/* Formulaires de confiance : une seule colonne, largeur utile complete. */
.dn-contact-form {
  width: 100%;
  max-width: 100%;
}
@media (max-width: 820px) {
  .dn-contact-form,
  .dn-contact-form input:not([type="hidden"]),
  .dn-contact-form textarea,
  .dn-contact-form select {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
}

/* --- Correctifs de geometrie (gates forms_layout, commercial_layout,
   vertical_rhythm). Aucun deplacement de contenu, aucune image. --- */

/* Fil d'Ariane : jamais colle au bas du header sur une page sans bandeau. */
.dn-breadcrumb {
  margin-top: 18px !important;
}

/* Formulaire de confiance : centre dans le conteneur editorial. */
.dn-contact {
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 38px !important;
}

/* Bloc commercial : padding mesure pour que le contenu utile tienne le cadre. */
.dn-trust__contact-commercial {
  padding: clamp(16px, 3vw, 28px) !important;
}

/* Consentement : la case garde sa taille native, le libelle reste lisible. */
.dn-form-consent {
  width: 100% !important;
  height: auto !important;
}
.dn-form-consent label {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  width: 100% !important;
  height: auto !important;
}
.dn-form-consent input[type="checkbox"],
.dn-form-consent input[type="radio"] {
  width: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
  height: 20px !important;
  flex: 0 0 20px !important;
  margin: 2px 0 0 !important;
}
.dn-form-consent label > span {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  hyphens: none !important;
}
@media (max-width: 820px) {
  .dn-contact-form input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
  .dn-contact-form textarea,
  .dn-contact-form select {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }
}

/* Carte auteur : portrait a l'echelle, CTA degage, bio non tronquee. */
.dn-team-card__portrait,
.dn-author-card__portrait {
  display: block !important;
  width: min(208px, 42vw) !important;
  height: auto !important;
  margin: 0 auto 22px !important;
}
.dn-team-card__portrait img,
.dn-author-card__portrait img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 50%;
}
.dn-team-card__body,
.dn-author-card {
  padding-bottom: 26px !important;
}
.dn-team-card__link,
.dn-author-card__link {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  margin-top: 16px !important;
}

/* En 390 px l'encart RankSource empile logo, titre, corps et CTA entiers. */
@media (max-width: 820px) {
  .dn-trust__marketplace {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
    justify-items: start !important;
    align-items: start !important;
  }
  .dn-trust__marketplace > .dn-trust__marketplace-logo,
  .dn-trust__marketplace > .dn-trust__marketplace-logo img {
    width: min(150px, 60%) !important;
    max-width: 150px !important;
    height: auto !important;
  }
  .dn-trust__marketplace > div {
    width: 100% !important;
    min-width: 0 !important;
  }
  .dn-trust__marketplace > p {
    width: 100% !important;
    margin: 0 !important;
  }
  .dn-trust__marketplace .dn-trust__button {
    justify-self: start !important;
    max-width: 100% !important;
    text-align: left;
  }
}
.dn-trust__marketplace > div {
  min-width: 0 !important;
}
.dn-trust__marketplace > div p,
.dn-trust__marketplace > div h2 {
  overflow-wrap: break-word;
}

/* Encart RankSource desktop : colonnes a la hauteur de ligne, contenu centre. */
@media (min-width: 821px) {
  .dn-trust__marketplace {
    align-items: stretch !important;
  }
  .dn-trust__marketplace > .dn-trust__marketplace-logo {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }
  .dn-trust__marketplace > div {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    width: 100% !important;
  }
  .dn-trust__marketplace > p {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
  }
}

/* Rail publicitaire d'article : present mais strictement vide et neutre. */
.dn-article-rail,
.dn-article-rail__slot {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
