/* Ambiance « Aube » : doux, lumineux, contemplatif.
   Reprend marche.css et n’en change que ce qui diffère, le temps que la famille choisisse.
   Si Aube est retenue, fondre les deux fichiers en un seul (et retirer les polices de Marché indien). */
@import url("marche.css");
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@1,500;1,600&family=Mulish:ital,wght@0,400;0,600;0,700;1,400&display=swap");

:root {
  --fond: #FBF6EF;
  --fond-creme: #F5E7DC;
  --carte: #FFFFFF;
  --texte: #3A2A22;
  --texte-doux: #7A6258;
  --ligne: #EADBCF;

  --safran: #E3A857;
  --rose: #B84A5E;
  --vert: #8BA66A;
  --terre: #C2724A;
  --turquoise: #B48AB0;
  --indigo: #5E3B56; /* prune : liens actifs, focus */
  --rose-doux: #F7E1DE;

  --lien: #A23E52;
  --ombre: 0 1px 2px rgba(58, 42, 34, .05), 0 8px 24px rgba(58, 42, 34, .07);

  --police-titre: "Cormorant Garamond", Georgia, serif;
  --police-texte: "Mulish", system-ui, sans-serif;
}

/* Les encres sont choisies pour un contraste d’au moins 4,5:1. */
.couleur-1 { --c: #E3A857; --c-encre: var(--texte); }
.couleur-2 { --c: #D4A52C; --c-encre: var(--texte); }
.couleur-3 { --c: #8BA66A; --c-encre: var(--texte); }
.couleur-4 { --c: #C2724A; --c-encre: #1F130D; }
.couleur-5 { --c: #B48AB0; --c-encre: var(--texte); }
.couleur-6 { --c: #B84A5E; --c-encre: #fff; }

body {
  background: linear-gradient(180deg, #F9D9C9 0, #FBE6E0 12rem, var(--fond) 32rem) no-repeat, var(--fond);
  font-size: 1.1rem;
}
h1, h2, h3 { font-style: italic; font-weight: 600; line-height: 1.1; }
h1 { font-size: clamp(2.6rem, 6.5vw, 4rem); }
h2 { font-size: clamp(1.9rem, 4vw, 2.5rem); }
h3 { font-size: 1.55rem; }

.bandeau-couleurs { display: none; }

.logo-marche { display: none; }
.logo-aube { display: block; }
.logo .t0 { fill: #E3A857; }
.logo .t1 { fill: #E6A0A8; }
.logo .t2 { fill: #B84A5E; }

.entete { border-bottom: 0; }
.marque-nom { font-size: 1.9rem; font-style: italic; font-weight: 600; }
.navigation a { font-weight: 600; }
.navigation a:hover { background: rgba(255, 255, 255, .6); }
.navigation a[aria-current="page"] { background: var(--carte); color: var(--lien); box-shadow: var(--ombre); }

/* Accueil : texte posé sur le dégradé, photo en arche */
.accueil {
  background: rgba(255, 255, 255, .5);
  border: 1px solid rgba(234, 219, 207, .8);
  border-radius: 2.5rem;
}
.accueil h1 { font-size: clamp(3.2rem, 9vw, 6rem); }
.accueil .surtitre { color: var(--lien); }
.accueil-origine { font-weight: 400; font-style: italic; }
.accueil-photo {
  width: min(16rem, 62vw); aspect-ratio: 4 / 5; overflow: hidden;
  border-radius: 999px 999px 1.5rem 1.5rem;
  border: .5rem solid var(--carte);
  box-shadow: 0 0 0 1px var(--ligne), var(--ombre);
}
.accueil-photo img,
.accueil-photo-vide {
  width: 100%; height: 100%; aspect-ratio: auto;
  border: 0; border-radius: 0; box-shadow: none; margin: 0;
}
/* pompon.jpg est déjà détouré en rond sur fond orange : on agrandit pour que l’arche n’en montre pas les coins. */
.accueil-photo img { transform: scale(1.3); transform-origin: 50% 30%; }
.accueil-photo-vide { background: var(--rose-doux); font-weight: 600; }
.bouton-clair { background: var(--carte); border: 1px solid var(--ligne); }
.bouton-clair:hover { background: var(--fond-creme); }

/* Cartes thèmes : blanches, avec une pastille de la couleur du thème */
.carte-theme {
  background: var(--carte); color: var(--texte);
  border: 1px solid var(--ligne); box-shadow: var(--ombre);
}
.carte-theme::before {
  content: ""; position: relative;
  width: 1.4rem; height: 1.4rem; margin-bottom: 1rem;
  border-radius: 50%; background: var(--c);
  box-shadow: 0 0 0 .35rem color-mix(in srgb, var(--c) 22%, transparent);
}
.carte-theme:hover { transform: translateY(-4px); }
.carte-theme-entrer { color: var(--lien); }
.carte-theme-image { opacity: .12; }
.carte-theme-reste { border: 2px dashed var(--ligne); box-shadow: none; background: transparent; }
.carte-theme-reste::before { display: none; }
.carte-theme-reste .carte-theme-entrer { color: var(--lien); }

/* Radio Pompon : encart rose doux */
.radio-bandeau { background: none; color: var(--texte); }
.radio-bandeau-interieur {
  background: var(--rose-doux); border-radius: 2.5rem;
  padding-inline: clamp(1.5rem, 5vw, 3.5rem);
}
.lien-safran { color: var(--lien); }
.pastille-antenne { color: #fff; }
.radio-carte { background: var(--carte); box-shadow: var(--ombre); }
.radio-carte .surtitre { color: var(--lien); }
.radio-carte-titre { font-style: italic; font-weight: 600; }
.radio-carte-dedicace { background: #FBEDE3; }
.radio-carte .rond-grand:hover { background: #A23E52; }

.radio { background: none; color: var(--texte); }
.radio-interieur { background: var(--rose-doux); border-radius: 2.5rem; padding: clamp(1.25rem, 4vw, 2.5rem); }
.radio-titre { color: var(--lien); font-style: italic; font-weight: 600; }
.radio .dedicace { border-left-color: var(--rose); }
.radio .badge-exemple { background: var(--texte); color: var(--fond); }
.rond { border-color: var(--texte); color: var(--texte); }
.rond:hover { background: rgba(255, 255, 255, .6); }
.rond-grand { background: var(--rose); border-color: var(--rose); color: #fff; }
.rond-grand:hover { background: #A23E52; }
.radio :focus-visible { outline-color: var(--indigo); }
.ecran { background: #3A2A22; }
.ecran-attente { background: repeating-linear-gradient(45deg, #5E3B56, #5E3B56 18px, #563550 18px, #563550 36px); }

.bouton-plein:hover { background: #E9B872; }
.tag-entete-plein { border-radius: 0 0 3rem 3rem; }
.intro-theme-image { border-radius: 999px 999px 1.5rem 1.5rem; aspect-ratio: 4 / 5; }
.encart h2, .encart h3 { font-weight: 600; }
.fiche-meta dt { color: var(--lien); }
.carte-texte { border-top-color: var(--safran); }
.programme li::before { font-style: italic; font-weight: 600; font-size: 1.6rem; }

.pied { background: #4A362D; }
.pied .logo .coeur { fill: #4A362D; }
.pied a { color: #F3C98F; }
.pied :focus-visible { outline-color: #F3C98F; }