/* =========================================================================
   FEUILLE DE PAGE : CONTACT
   Chargee par `contact.html` SEULEMENT, apres `styles.css`.
   Les quatre autres pages de la tranche (rendez-vous, CGV, mentions legales,
   404) n'ont besoin de rien qui ne soit pas dans les fondations : elles ne
   chargent donc pas cette feuille.

   Ce que cette feuille ne fait pas, et ne doit jamais faire (fondations 1.11) :
   redefinir un jeton de `:root`, reecrire `.carte`, `.carte-visuel`,
   `.carte-formulaire`, `.entete` ou le fondu partage. Elle n'agit que sur le
   modificateur `.carte-visuel--contact`, qui ne porte AUCUNE regle partagee
   (verifie : `grep carte-visuel--contact styles.css` ne rend rien).

   La bordure aurore de 12 s, le systeme de cartes, les entrees `data-anim` et
   le fondu affine du bas de bandeau viennent tous des fondations : ils ne sont
   ni recopies ni surcharges ici.
   ========================================================================= */

/* --- La carte des coordonnees en PANNEAU DE VERRE (decision A.7) ----------
   Mesure de depart : la carte etait `rgba(10, 17, 50, 0.88)` posee sur un
   bandeau `#0a1132`, c'est-a-dire la meme couleur a 12 % de transparence
   pres : elle ne se detachait pas de son fond. Le verre inverse le rapport,
   il ECLAIRCIT au lieu d'assombrir. Trois couches, de l'arriere vers l'avant :

     1. le verre lui-meme, un blanc a 6 % pose sur l'arriere-plan floute ;
     2. le reflet interieur, un blanc tres leger qui s'eteint avant la moitie
        haute du panneau, la ou seul passe le signe du combine (decoratif) ;
     3. le filet clair de 1 px, qui dessine l'arete du panneau.

   Le repli, lu par un navigateur qui ignore `backdrop-filter`, monte le verre
   a 10 % : sans le flou, seule l'opacite detache encore le panneau du fond.
   Les deux cas sont mesures en contraste (journal 12, section 2.1).

   Le flou est nu, sans `saturate()`. J'avais ecrit `blur(18px) saturate(1.2)`
   au premier jet : mesure faite, la saturation ne change le panneau que de
   2,6/255 en moyenne par canal, sous le seuil du perceptible. Elle ne gagnait
   pas sa place. */

.carte-visuel--contact {
  /* Le reflet interieur. Pose en `background-image` et le verre en
     `background-color`, pour que le bloc `@supports` ci-dessous n'ait que la
     couleur a changer au lieu de recopier le degrade. */
  background-image: linear-gradient(180deg,
    rgba(255, 255, 255, 0.11) 0%,
    rgba(255, 255, 255, 0.035) 26%,
    rgba(255, 255, 255, 0) 48%);
  background-color: rgba(255, 255, 255, 0.10);
  border-color: rgba(255, 255, 255, 0.20);
  /* Une ombre portee sous le panneau : c'est elle qui dit « pose devant »
     plutot que « decoupe dedans ». Sur fond nuit, une ombre se lit par sa
     densite, pas par sa couleur. */
  box-shadow: 0 26px 56px -30px rgba(3, 7, 22, 0.78);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .carte-visuel--contact {
    background-color: rgba(255, 255, 255, 0.06);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
  }
}

/* --- Ce que le verre coute en lisibilite, et comment il est paye -----------
   Mesure, pas supposition. Le fond du panneau n'est plus opaque : la lueur du
   bandeau (`.entete::before`, centree a 78 % 74 %, donc EXACTEMENT derriere
   cette carte, qui vit a droite) traverse desormais le verre. Contraste
   releve texte par texte, en prelevant le fond REEL derriere chaque
   rectangle de texte (capture du panneau avec les textes rendus invisibles) :

     texte                    ancienne carte opaque   verre 6 %   repli 10 %
     intitules  --nuit-texte           ~7,5:1        5,0 a 7,6     4,4 a 6,7
     valeurs    --jour                 ~14:1         7,1 a 13,7    6,3 a 12,2
     liens      --accent-clair          ~6,5:1       3,0 a 4,2     2,6 a 3,7

   Deux textes tombaient donc sous 4,5:1, et ce sont les deux LIENS, alignes a
   droite, c'est-a-dire pile sur le point le plus clair de la lueur ; le
   quatrieme intitule passait a 4,42:1 dans le repli a 1280. Le seuil n'est pas
   negociable : ce sont les textes qui montent, jamais le seuil qui descend.

   1. Les intitules prennent `--nuit-texte-fort`. Ce jeton existe pour ca, et
      styles.css le dit : « le seul texte qui traverse la lueur d'un bandeau ».
      La hierarchie ne tient pas a la couleur ici (11,5 px en capitales
      espacees de graisse 800 contre 16 px de graisse 700) : elle survit.
   2. Les deux liens passent au blanc et prennent un SOULIGNEMENT permanent
      en bleu clair. Le blanc tient partout ; et un lien qui ne se signalait
      que par sa couleur se signale maintenant par sa forme, ce qui est un
      gain et non un pis-aller. L'accent bleu de Kairos reste present dans le
      trait, qui tient son propre seuil d'indicateur non textuel (3:1). */

.carte-visuel--contact .coordonnees__intitule { color: var(--nuit-texte-fort); }

.carte-visuel--contact .coordonnees__valeur a {
  color: var(--jour);
  text-decoration: underline;
  text-decoration-color: var(--phase-1-clair);
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}
.carte-visuel--contact .coordonnees__valeur a:hover,
.carte-visuel--contact .coordonnees__valeur a:focus-visible {
  text-decoration-color: var(--jour);
}