/* ==========================================================================
   Adaptations propres à WordPress (les feuilles de la démo restent telles quelles à côté).
   ========================================================================== */

/* Les parties de gabarit (en-tête, pied de page) n'ajoutent aucune boîte : l'en-tête fixe et le
   pied de page de la démo gardent leur comportement. */
.wp-block-template-part.oriq-partie { display: contents; }

/* Conteneurs de WordPress autour du contenu : aucune marge ni espacement ajouté entre les blocs. */
.oriq-page, .oriq-page > .wp-block-post-content { margin: 0; padding: 0; max-width: none; }
.oriq-page :where(.is-layout-flow) > * { margin-block: 0; }
:where(.wp-site-blocks) > * { margin-block-start: 0; }
.wp-site-blocks { padding: 0; }

/* Barre d'administration (connecté) : l'en-tête fixe passe dessous. */
body.admin-bar .site-header { top: var(--wp-admin--admin-bar--height, 32px); }
body.admin-bar .mobile-menu { top: var(--wp-admin--admin-bar--height, 32px); }

/* Formulaires branchés (contact, portes ouvertes, entreprise) : champ piège, consentement,
   alerte d'envoi, bouton pendant l'envoi. */
.ins-piege { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.ins-champ--accord { gap: 0.3rem; }
.ins-champ .ins-accord {
  display: flex; align-items: flex-start; gap: 0.75rem; min-height: 44px; padding: 0.35rem 0;
  font-weight: 500; font-size: var(--step--1); line-height: 1.45; cursor: pointer;
}
.ins-champ .ins-accord input[type='checkbox'] {
  flex: none; width: 24px; min-height: 24px; height: 24px; margin: 0.1rem 0 0; padding: 0;
  border-radius: 6px; accent-color: var(--navy); box-shadow: none;
}
.ins-champ--accord.is-erreur .ins-accord input { outline: 2px solid var(--pink); outline-offset: 2px; }
.ins-form__alerte {
  margin: 0; padding: 0.8rem 1rem; border-radius: var(--radius-m); background: #FCE8EE; color: #8A0F31;
  font-weight: 600; font-size: var(--step--1);
}
.ins-form__alerte[hidden] { display: none; }
.ins-form__alerte a { color: inherit; text-decoration: underline; }
.ins-form__lien-donnees { margin: 0; font-size: var(--step--1); }
.ins-form__lien-donnees a { display: inline-flex; align-items: center; min-height: 44px; color: var(--navy); font-weight: 600; text-decoration: underline; text-underline-offset: 0.15em; }
.ins-form [type='submit'][aria-busy='true'] { opacity: 0.7; cursor: progress; }

/* Bouton d'accessibilité de l'en-tête (ordinateur) ; sous 1280 px, il est dans le menu compact. */
.a11y-entete {
  position: relative; display: inline-grid; place-items: center; width: 44px; height: 44px; flex: none;
  border-radius: 50%; background: var(--bg-raised); color: var(--navy);
  box-shadow: inset 0 0 0 1px var(--line-strong); transition: box-shadow var(--dur-fast) linear;
}
.a11y-entete svg { width: 24px; height: 24px; }
.a11y-entete:hover, .a11y-entete[aria-expanded='true'] { box-shadow: inset 0 0 0 2px var(--navy); }
.a11y-entete:focus-visible { outline: 3px solid var(--navy); outline-offset: 2px; }
.a11y-entete[data-actif='true']::after {
  content: ''; position: absolute; top: 2px; right: 2px; width: 11px; height: 11px; border-radius: 50%;
  background: var(--teal, #329B8D); box-shadow: 0 0 0 2px var(--bg-raised);
}
@media (max-width: 1279px) { .a11y-entete { display: none; } }
/* Entre 1280 et 1359 px, l'en-tête tient sur une ligne avec ce bouton en serrant un peu les actions
   (souris : la cible de 40 px reste confortable). */
@media (min-width: 1280px) and (max-width: 1359px) {
  .header-actions { gap: 0.35rem; }
  .a11y-entete { width: 40px; height: 40px; }
}

/* Passage d'une page à l'autre : fondu natif du navigateur entre deux pages complètes (View
   Transitions entre documents ; Chrome, Edge et Safari récents, ignoré ailleurs). Chaque page reste
   une vraie page chargée par le serveur : rien ne change pour le référencement, l'historique, le
   focus ni les lecteurs d'écran. Désactivé si le visiteur réduit les animations (système ou module
   d'accessibilité). Voir RESTE-A-FAIRE.md, « Navigation sans rechargement ». */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  ::view-transition-old(root), ::view-transition-new(root) { animation-duration: 0.22s; animation-timing-function: ease-out; }
}
html.a11y-immobile::view-transition-group(*),
html.a11y-immobile::view-transition-old(*),
html.a11y-immobile::view-transition-new(*) { animation: none !important; }
