/*
 * ProvSeal — socle de la refonte.
 * Variables, typographie, boutons, header et footer partagés par toutes les pages.
 * Les scènes propres à une page vont dans assets/scenes/<page>.css.
 * Tant que les pages ne sont pas migrées, ce fichier ne stylise que des classes ps-* :
 * il ne touche ni body ni les éléments globaux de l'ancien site.css.
 */

@font-face {
  font-family: "Satoshi";
  src: url("/assets/fonts/Satoshi-Variable.woff2") format("woff2");
  font-weight: 300 900;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Marque */
  --ps-orange: #f4511e;
  --ps-orange-light: #ff8a3d;
  --ps-orange-dark: #c2410c;
  --ps-peach: #ffb48c;
  --ps-peach-light: #ffd3bd;
  --ps-gradient: linear-gradient(180deg, var(--ps-orange-light), var(--ps-orange));

  /* Ambiance braise (sombre) */
  --ps-ember: #120a06;
  --ps-ember-deep: #0d0704;
  --ps-ember-raised: #160d08;
  --ps-ink: #1c110b;
  --ps-ember-card: #2a1810;
  --ps-text-on-dark: #f6ece6;
  --ps-nav-text: #e4cfc4;
  --ps-muted-dark: #d7c3b8;
  --ps-subtle-dark: #b59a8c;
  --ps-faint-dark: #a98e80;

  /* Ambiance papier (clair) */
  --ps-paper: #f3e8e0;
  --ps-cream: #fffaf6;
  --ps-muted-light: #6b5447;
  --ps-line-light: #ecdcd3;

  /* Lignes et voiles orange */
  --ps-line: rgba(255, 138, 76, 0.18);
  --ps-line-strong: rgba(255, 138, 76, 0.25);
  --ps-hover: rgba(255, 138, 76, 0.1);
  --ps-line-peach: rgba(255, 211, 189, 0.22);
  --ps-divider-peach: rgba(255, 211, 189, 0.12);

  /* Statuts C2PA */
  --ps-status-trusted: #10b981;
  --ps-status-untrusted: #f59e0b;
  --ps-status-invalid: #d6264a;
  --ps-status-none: #94a3b8;

  /* Typographie */
  --ps-font-sans: "Satoshi", ui-sans-serif, system-ui, sans-serif;
  --ps-font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --ps-font-serif: Georgia, "Times New Roman", serif;
  --ps-size-page-title: clamp(46px, 6vw, 104px);
  --ps-size-section-title: clamp(38px, 4.6vw, 72px);

  /* Mise en page */
  --ps-container: 1280px;
  --ps-gutter: 32px;
  --ps-header-height: 72px;

  /* Rayons, ombres, mouvement */
  --ps-radius-pill: 999px;
  --ps-radius-card: 22px;
  --ps-radius-md: 14px;
  --ps-radius-sm: 10px;
  --ps-shadow-cta: 0 22px 44px -14px rgba(244, 81, 30, 0.75);
  --ps-shadow-lift: 0 30px 60px -28px rgba(244, 81, 30, 0.6);
  --ps-shadow-panel: 0 40px 80px -30px rgba(0, 0, 0, 0.8);
  --ps-ease: cubic-bezier(0.23, 1, 0.32, 1);
  --ps-focus: 3px solid rgba(255, 138, 76, 0.55);
}

@media (max-width: 900px) {
  :root {
    --ps-gutter: 20px;
  }
}

/* Les ancres ne passent pas sous le header collant. */
html {
  scroll-padding-top: var(--ps-header-height);
}

/* ---------- Utilitaires ---------- */

.ps-container {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--ps-container);
  margin: 0 auto;
  padding: 0 var(--ps-gutter);
}

.ps-mono {
  font-family: var(--ps-font-mono);
  font-weight: 500;
}

.ps-badge {
  display: inline-flex;
  align-items: center;
  border-radius: var(--ps-radius-pill);
  padding: 2px 8px;
  background: var(--ps-orange-light);
  color: var(--ps-ember);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.5;
}

/* ---------- Boutons ---------- */

.ps-btn {
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 11px 20px;
  border: 1px solid transparent;
  border-radius: var(--ps-radius-pill);
  font-family: var(--ps-font-sans);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.2s var(--ps-ease), box-shadow 0.25s, background-color 0.2s, border-color 0.2s;
}

.ps-btn--primary {
  background: var(--ps-gradient);
  color: #fff;
}

.ps-btn--primary:hover {
  color: #fff;
  transform: translateY(-3px) scale(1.01);
  box-shadow: var(--ps-shadow-cta);
}

/* Reflet qui balaie le bouton principal au survol. */
.ps-btn--primary::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 35%, rgba(255, 255, 255, 0.5) 50%, transparent 65%);
  transform: translateX(-140%);
  transition: transform 0.8s var(--ps-ease);
  pointer-events: none;
}

.ps-btn--primary:hover::after {
  transform: translateX(140%);
}

.ps-btn--secondary {
  background: transparent;
  border-color: var(--ps-line-peach);
  color: var(--ps-peach-light);
}

.ps-btn--secondary:hover {
  border-color: var(--ps-orange-light);
  color: #fff;
}

.ps-btn .ps-btn-tag {
  border-radius: var(--ps-radius-pill);
  padding: 2px 7px;
  background: rgba(18, 10, 6, 0.25);
  font-size: 11px;
  font-weight: 700;
}

.ps-lift {
  transition: transform 0.3s var(--ps-ease), border-color 0.3s, box-shadow 0.3s;
}

.ps-lift:hover {
  transform: translateY(-6px);
  border-color: var(--ps-orange);
  box-shadow: var(--ps-shadow-lift);
}

.ps-btn:focus-visible,
.ps-header a:focus-visible,
.ps-header button:focus-visible,
.ps-header summary:focus-visible,
.ps-footer a:focus-visible,
.ps-footer button:focus-visible {
  outline: var(--ps-focus);
  outline-offset: 3px;
}

/* ---------- Header ---------- */

.ps-header {
  position: sticky;
  top: 0;
  z-index: 50;
  font-family: var(--ps-font-sans);
  line-height: 1.5;
  color: var(--ps-text-on-dark);
  background: rgba(18, 10, 6, 0.92);
  border-bottom: 1px solid var(--ps-line);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  transition: background-color 0.25s, border-color 0.25s;
}

/*
 * Sur les pages migrées (body.ps-page, fond braise), le header est translucide en haut de page
 * et redevient opaque au défilement ou quand un menu est ouvert. Les anciennes pages claires
 * gardent un header opaque.
 */
.ps-page .ps-header:not(.is-solid) {
  background: rgba(18, 10, 6, 0.55);
  border-bottom-color: rgba(255, 138, 76, 0);
}

.ps-header *,
.ps-header *::before,
.ps-header *::after {
  box-sizing: border-box;
}

.ps-header-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  height: var(--ps-header-height);
}

.ps-brand {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 11px;
  min-height: 44px;
  color: #fff;
  text-decoration: none;
}

.ps-brand img {
  display: block;
  width: 34px;
  height: 34px;
}

.ps-brand span {
  font-size: 23px;
  font-weight: 900;
  letter-spacing: -0.04em;
}

.ps-brand:hover {
  color: #fff;
}

.ps-nav-list {
  display: flex;
  align-items: center;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ps-nav-trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  padding: 10px 14px;
  border: 0;
  border-radius: var(--ps-radius-pill);
  background: transparent;
  color: var(--ps-nav-text);
  font: inherit;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s;
}

.ps-nav-trigger:hover,
.ps-nav-trigger[aria-expanded="true"],
.ps-nav-trigger.is-current {
  background: var(--ps-hover);
  color: #fff;
}

.ps-chevron {
  flex: 0 0 auto;
  transition: transform 0.25s var(--ps-ease);
}

.ps-nav-trigger[aria-expanded="true"] .ps-chevron,
.ps-mobile-group[open] .ps-chevron {
  transform: rotate(180deg);
}

.ps-header-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 14px;
}

.ps-ghost-link {
  padding: 10px 4px;
  color: var(--ps-nav-text);
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
}

.ps-ghost-link:hover {
  color: #fff;
}

/* Sélecteur de langue en pastilles (préfixé pour primer sur l'ancien .language-switch). */
.ps-header .ps-lang {
  display: inline-flex;
  align-items: center;
  gap: 0;
  padding: 3px;
  border: 1px solid var(--ps-line-peach);
  border-radius: var(--ps-radius-pill);
  background: transparent;
  box-shadow: none;
  font-size: 13px;
  font-weight: 700;
}

.ps-header .ps-lang a {
  min-width: 0;
  min-height: 0;
  padding: 5px 10px;
  border-radius: var(--ps-radius-pill);
  background: transparent;
  color: var(--ps-muted-dark);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
  text-decoration: none;
}

.ps-header .ps-lang a:hover {
  background: var(--ps-hover);
  color: #fff;
}

.ps-header .ps-lang a[aria-current="page"] {
  background: var(--ps-peach-light);
  color: var(--ps-ember);
}

.ps-burger {
  display: none;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--ps-line-peach);
  border-radius: 12px;
  background: transparent;
  color: #fff;
  cursor: pointer;
}

.ps-burger .ps-burger-close,
.ps-burger[aria-expanded="true"] .ps-burger-open {
  display: none;
}

.ps-burger[aria-expanded="true"] .ps-burger-close {
  display: block;
}

/* Méga-menus */

.ps-panel {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  padding: 0 var(--ps-gutter);
}

.ps-panel[hidden] {
  display: none;
}

.ps-panel-inner {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: 24px;
  width: 100%;
  max-width: 1216px;
  margin: 0 auto;
  padding: 24px;
  border: 1px solid rgba(255, 138, 76, 0.22);
  border-top: 0;
  border-radius: 0 0 var(--ps-radius-card) var(--ps-radius-card);
  background: var(--ps-ink);
  box-shadow: var(--ps-shadow-panel);
  animation: ps-panel-in 0.25s var(--ps-ease);
}

.ps-panel-inner--wide {
  grid-template-columns: minmax(0, 3fr) minmax(0, 1fr);
}

@keyframes ps-panel-in {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.ps-panel-items {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ps-panel-columns {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.ps-panel-column {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.ps-panel-column--aside {
  padding-left: 20px;
  border-left: 1px solid var(--ps-line);
}

.ps-panel-column ul {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ps-panel-title {
  display: block;
  padding: 0 12px 6px;
  color: var(--ps-orange-light);
  font-size: 12px;
  font-weight: 600;
}

.ps-item {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 12px;
  border-radius: var(--ps-radius-md);
  text-decoration: none;
  transition: background-color 0.2s;
}

.ps-item:hover,
.ps-item:focus-visible,
.ps-item[aria-current="page"] {
  background: var(--ps-hover);
}

.ps-item-title {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
}

.ps-item-text {
  color: var(--ps-subtle-dark);
  font-size: 13px;
  line-height: 1.4;
}

.ps-link {
  display: block;
  padding: 8px 12px;
  border-radius: var(--ps-radius-sm);
  color: var(--ps-nav-text);
  font-size: 15px;
  text-decoration: none;
  transition: background-color 0.2s, color 0.2s;
}

.ps-link:hover,
.ps-link:focus-visible,
.ps-link[aria-current="page"] {
  background: var(--ps-hover);
  color: #fff;
}

.ps-feature {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 170px;
  padding: 20px;
  border: 1px solid var(--ps-line-strong);
  border-radius: 16px;
  background:
    radial-gradient(ellipse 90% 80% at 100% 0%, rgba(244, 81, 30, 0.35), transparent 65%),
    var(--ps-ember-card);
  text-decoration: none;
  transition: border-color 0.25s, transform 0.25s var(--ps-ease);
}

a.ps-feature:hover {
  border-color: var(--ps-orange-light);
  transform: translateY(-2px);
}

.ps-feature-eyebrow {
  color: var(--ps-orange-light);
  font-size: 12px;
  font-weight: 600;
}

.ps-feature-title {
  color: #fff;
  font-size: 20px;
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.ps-feature-text {
  color: var(--ps-muted-dark);
  font-size: 13px;
}

.ps-feature-more {
  margin-top: auto;
  color: var(--ps-peach);
  font-size: 14px;
  font-weight: 600;
}

/* Menu mobile */

.ps-mobile {
  max-height: calc(100vh - var(--ps-header-height));
  max-height: calc(100dvh - var(--ps-header-height));
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 8px 24px 24px;
  border-top: 1px solid var(--ps-line);
  background: var(--ps-ember-raised);
}

.ps-mobile[hidden] {
  display: none;
}

.ps-mobile-group {
  border-bottom: 1px solid rgba(255, 138, 76, 0.15);
}

.ps-mobile-group summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 44px;
  padding: 16px 0;
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  list-style: none;
  cursor: pointer;
}

.ps-mobile-group summary::-webkit-details-marker {
  display: none;
}

.ps-mobile-group ul {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 4px 0 12px;
  list-style: none;
}

.ps-mobile-group .ps-link {
  min-height: 44px;
  padding: 11px 12px;
}

.ps-mobile-actions {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-top: 16px;
}

.ps-mobile-actions .ps-btn {
  min-height: 48px;
  padding: 14px 20px;
}

.ps-mobile-actions .ps-ghost-link {
  padding: 10px;
  color: var(--ps-peach-light);
  font-weight: 600;
  text-align: center;
}

.ps-header .ps-mobile-actions .ps-lang {
  align-self: center;
}

.ps-header .ps-mobile-actions .ps-lang a {
  min-height: 44px;
  padding: 11px 18px;
}

html.ps-menu-open {
  overflow: hidden;
}

@media (max-width: 1100px) {
  .ps-nav,
  .ps-header-actions,
  .ps-panel {
    display: none;
  }

  .ps-burger {
    display: inline-flex;
  }
}

@media (min-width: 1101px) {
  .ps-mobile {
    display: none;
  }
}

/* ---------- Footer ---------- */

.ps-footer {
  background: var(--ps-ember-deep);
  color: var(--ps-faint-dark);
  font-family: var(--ps-font-sans);
  font-size: 14px;
  line-height: 1.5;
}

.ps-footer *,
.ps-footer *::before,
.ps-footer *::after {
  box-sizing: border-box;
}

.ps-footer-inner {
  display: flex;
  flex-direction: column;
  gap: 48px;
  padding-top: 72px;
  padding-bottom: 36px;
}

.ps-footer-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1.6fr) repeat(5, minmax(0, 1fr));
  gap: 36px;
}

.ps-footer-brand {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.ps-footer-brand .ps-brand {
  gap: 10px;
  align-self: flex-start;
}

.ps-footer-brand .ps-brand img {
  width: 30px;
  height: 30px;
}

.ps-footer-brand .ps-brand span {
  font-size: 20px;
  letter-spacing: -0.03em;
}

.ps-footer-brand p {
  margin: 0;
}

.ps-footer-partners {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ps-footer-partner {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 6px 12px 6px 8px;
  border: 1px solid var(--ps-divider-peach);
  border-radius: var(--ps-radius-pill);
  color: var(--ps-muted-dark);
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition: border-color 0.2s, color 0.2s;
}

.ps-footer-partner:hover {
  border-color: var(--ps-orange-light);
  color: var(--ps-peach-light);
}

/* Pastille claire : les logos partenaires sont sombres. */
.ps-footer-partner img {
  display: block;
  width: auto;
  height: 24px;
  padding: 3px;
  border-radius: 6px;
  background: var(--ps-text-on-dark);
}

.ps-footer-nav {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ps-footer-heading {
  margin: 0;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
}

.ps-footer-nav ul {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ps-footer-nav a {
  color: var(--ps-subtle-dark);
  font-size: 14px;
  text-decoration: none;
}

.ps-footer-nav a:hover,
.ps-footer-nav a[aria-current="page"] {
  color: var(--ps-peach-light);
}

.ps-external::after {
  content: " ↗";
}

.ps-footer-legal {
  margin: 0;
  padding-top: 24px;
  border-top: 1px solid var(--ps-divider-peach);
  font-size: 12px;
  line-height: 1.6;
}

/* La ligne du bas accueille aussi le bouton « Cookies » ajouté par site.js. */
.ps-footer .footer-bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: -24px;
  padding-top: 0;
  border-top: 0;
  color: var(--ps-faint-dark);
  font-size: 12px;
}

.ps-footer .footer-cookie-link {
  min-height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ps-subtle-dark);
  font: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

.ps-footer .footer-cookie-link:hover {
  color: var(--ps-peach-light);
}

@media (max-width: 1100px) {
  .ps-footer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ps-footer-brand {
    grid-column: 1 / -1;
    max-width: 520px;
  }
}

@media (max-width: 640px) {
  .ps-footer-inner {
    padding-top: 56px;
  }

  .ps-footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px 20px;
  }

  .ps-footer-nav a {
    display: inline-block;
    padding: 4px 0;
  }
}

/* ---------- Mobile et mouvement réduit ---------- */

@media (max-width: 900px), (hover: none) {
  .ps-header {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background: rgba(18, 10, 6, 0.92);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ps-btn,
  .ps-btn--primary::after,
  .ps-lift,
  .ps-header,
  .ps-nav-trigger,
  .ps-chevron,
  .ps-item,
  .ps-link,
  .ps-feature,
  .ps-footer-partner {
    transition: none;
  }

  .ps-panel-inner {
    animation: none;
  }

  .ps-btn--primary:hover,
  .ps-lift:hover,
  a.ps-feature:hover {
    transform: none;
  }
}

/* =====================================================================
 * Pages migrées (body.ps-page) : base, sections et composants partagés.
 * ===================================================================== */

.ps-page {
  margin: 0;
  overflow-x: clip;
  background: var(--ps-ember);
  color: var(--ps-text-on-dark);
  font-family: var(--ps-font-sans);
  font-size: 17px;
  line-height: 1.5;
}

.ps-page h1,
.ps-page h2,
.ps-page h3 {
  margin: 0;
  font-family: var(--ps-font-sans);
  text-wrap: balance;
}

.ps-page p {
  margin: 0;
}

/* Couleur des liens selon le fond : pêche sur braise (par défaut), orange foncé puis encre sur papier.
   Les zones claires et sombres redéfinissent --ps-link et --ps-link-hover (voir plus bas). */
.ps-page main a {
  color: var(--ps-link, var(--ps-peach));
}

.ps-page main a:hover {
  color: var(--ps-link-hover, var(--ps-peach-light));
}

.ps-page main :is(.ps-section--paper, .ps-section--cream, .f-paper, .sl-hero, .dc-body, .bl-site, .cn-paper, .ar-paper, .gl-paper, .gd-paper, .ps-form, .in-r) {
  --ps-link: var(--ps-orange-dark);
  --ps-link-hover: var(--ps-ink);
}

.ps-page main :is(.ps-section--ember, .f-dark, .sl-hero--lg, .sl-hero--pb, .sl-hero--ag, .sl-hero--br, .sl-hero--gn, .sl-hero--ap, .pk-logo--dark) {
  --ps-link: var(--ps-peach);
  --ps-link-hover: var(--ps-peach-light);
}

/* Sélection lisible partout, y compris sur les mots en contour (remplissage transparent). */
.ps-page ::selection {
  background: var(--ps-orange);
  color: #fff;
  -webkit-text-fill-color: #fff;
  -webkit-text-stroke-color: transparent;
}

.ps-page main a:focus-visible,
.ps-page main button:focus-visible,
.ps-page main input:focus-visible,
.ps-page main select:focus-visible,
.ps-page main textarea:focus-visible,
.ps-page main summary:focus-visible {
  outline: var(--ps-focus);
  outline-offset: 3px;
}

/* Sections : braise (sombre), papier et crème (clairs). */

.ps-section {
  padding: 120px 0;
}

.ps-section--ember {
  background:
    radial-gradient(ellipse 50% 65% at var(--ps-glow-x, 90%) 0%, rgba(244, 81, 30, 0.24), transparent 68%),
    var(--ps-ember);
  color: var(--ps-text-on-dark);
}

.ps-section--paper {
  background:
    radial-gradient(ellipse 45% 60% at var(--ps-glow-x, 90%) 0%, rgba(244, 81, 30, 0.1), transparent 70%),
    #f6ece6;
  color: var(--ps-ink);
}

.ps-section--cream {
  background:
    radial-gradient(ellipse 45% 60% at var(--ps-glow-x, 90%) 0%, rgba(244, 81, 30, 0.08), transparent 70%),
    #fffaf7;
  color: var(--ps-ink);
}

.ps-section--paper a:not(.ps-btn):not(.ps-card):not(.ps-row),
.ps-section--cream a:not(.ps-btn):not(.ps-card):not(.ps-row) {
  color: var(--ps-orange-dark);
}

.ps-container--narrow {
  max-width: 1180px;
}

.ps-stack {
  display: flex;
  flex-direction: column;
  gap: 56px;
}

.ps-stack--lg {
  gap: 64px;
}

.ps-split {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}

.ps-split > .ps-h2 {
  flex: 1 1 560px;
}

.ps-split > .ps-lead {
  flex: 1 1 300px;
}

/* Typographie */

.ps-h2 {
  max-width: 16em;
  font-size: clamp(40px, 4.8vw, 72px);
  font-weight: 900;
  line-height: 0.95;
  letter-spacing: -0.045em;
}

.ps-section--ember .ps-h2 {
  color: #fff;
}

.ps-h2--xl {
  max-width: none;
  font-size: clamp(44px, 5.6vw, 88px);
  line-height: 0.9;
  letter-spacing: -0.05em;
}

.ps-h2--wide {
  max-width: 18em;
}

.ps-h2--sm {
  font-size: clamp(36px, 4.2vw, 64px);
  line-height: 0.96;
}

.ps-lead {
  max-width: 30em;
  font-size: 19px;
  line-height: 1.55;
  color: var(--ps-muted-light);
}

.ps-lead--wide {
  max-width: 38em;
}

.ps-section--ember .ps-lead {
  color: var(--ps-muted-dark);
}

.ps-small {
  font-size: 15px;
  color: var(--ps-muted-light);
}

.ps-section--ember .ps-small {
  font-size: 14px;
  color: var(--ps-faint-dark);
}

.ps-eyebrow {
  color: var(--ps-orange-light);
  font-size: 14px;
  font-weight: 500;
}

.ps-eyebrow--light {
  color: var(--ps-orange-dark);
  font-weight: 600;
}

.ps-badge--lg {
  align-self: flex-start;
  padding: 4px 12px;
  font-size: 13px;
}

/* Boutons : variantes */

.ps-btn--xl {
  min-height: 58px;
  padding: 18px 30px;
  font-size: 18px;
  font-weight: 600;
  box-shadow: 0 14px 30px -10px rgba(244, 81, 30, 0.7);
}

.ps-btn--dark {
  align-self: flex-start;
  min-height: 52px;
  padding: 15px 24px;
  background: var(--ps-ink);
  color: #fff;
  font-size: 16px;
  font-weight: 600;
}

.ps-page main .ps-btn--dark,
.ps-page main .ps-btn--primary,
.ps-page main .ps-btn--dark:hover,
.ps-page main .ps-btn--primary:hover {
  color: #fff;
}

.ps-btn--dark:hover {
  transform: translateY(-3px);
  box-shadow: 0 22px 44px -14px rgba(28, 17, 11, 0.55);
}

.ps-btn--block {
  width: 100%;
  min-height: 56px;
  margin-top: 4px;
  border-radius: 12px;
  font-size: 18px;
}

/* Apparition des mots et des blocs */

@keyframes ps-word {
  0% {
    opacity: 0;
    transform: translateY(30px) scale(1.2);
    filter: blur(10px);
  }

  100% {
    opacity: 1;
    transform: none;
    filter: blur(0);
  }
}

@keyframes ps-fade {
  from {
    opacity: 0;
    transform: translateY(18px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.ps-word {
  display: inline-block;
  opacity: 0;
  animation: ps-word 0.8s cubic-bezier(0.2, 0.9, 0.25, 1) forwards;
}

.ps-w1 { animation-delay: 0.1s; }
.ps-w2 { animation-delay: 0.24s; }
.ps-w3 { animation-delay: 0.38s; }
.ps-w4 { animation-delay: 0.66s; }
.ps-w5 { animation-delay: 0.8s; }
.ps-w6 { animation-delay: 0.94s; }

.ps-fade {
  opacity: 0;
  animation: ps-fade 0.9s var(--ps-ease) forwards;
}

.ps-d1 { animation-delay: 1.15s; }
.ps-d2 { animation-delay: 1.3s; }
.ps-d3 { animation-delay: 1.45s; }

/* Apparition au défilement : Chrome et Edge l'animent, les autres affichent l'état final. */
@supports (animation-timeline: view()) {
  .ps-rev {
    animation: ps-fade linear both;
    animation-timeline: view();
    animation-range: entry 5% entry 40%;
  }

  .ps-stampin {
    animation: ps-word linear both;
    animation-timeline: view();
    animation-range: entry 20% cover 42%;
  }
}

/* Cartes métiers (calques qui s'écartent au survol) */

.ps-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 18px;
}

.ps-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 26px;
  border: 1px solid var(--ps-line-light);
  border-radius: var(--ps-radius-card);
  background: #fff;
  color: var(--ps-ink);
  text-decoration: none;
  transition: transform 0.35s var(--ps-ease), border-color 0.3s, box-shadow 0.35s;
}

.ps-page main .ps-card,
.ps-page main .ps-card:hover {
  color: var(--ps-ink);
}

.ps-card:hover {
  transform: translateY(-6px);
  border-color: var(--ps-orange);
  box-shadow: 0 34px 60px -30px rgba(244, 81, 30, 0.55);
}

.ps-card-scene {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 130px;
  margin: -6px -6px 6px;
  border-radius: 16px;
  background:
    radial-gradient(ellipse 70% 80% at 50% 80%, rgba(255, 150, 100, 0.35), transparent 70%),
    #fbefe8;
}

/* Miniatures : chaque carte reprend en petit la scène du hero de sa page métier. */

.ps-mini {
  --mn-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.ps-mini .mn-bar {
  display: block;
  flex: 1 1 auto;
  height: 5px;
  border-radius: 3px;
  background: #ecd9cd;
}

.ps-mini img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Rédactions : fil d'agence + une à la une. */
.mn-feed {
  width: 92px;
  height: 92px;
  overflow: hidden;
  padding: 8px;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 14px 26px -16px rgba(90, 30, 8, 0.45);
}

.mn-feed-rows {
  display: flex;
  flex-direction: column;
  gap: 9px;
  transition: transform 0.9s var(--mn-ease);
}

.mn-row {
  display: flex;
  align-items: center;
  gap: 6px;
}

.mn-paper {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 96px;
  margin-left: -10px;
  padding: 8px;
  border-radius: 6px;
  background: #fffaf5;
  box-shadow: 0 18px 30px -16px rgba(90, 30, 8, 0.5);
  transform: translateY(6px);
  transition: transform 0.5s var(--mn-ease);
}

.mn-paper-img {
  height: 46px;
  overflow: hidden;
  border-radius: 3px;
}

.mn-paper .mn-bar {
  flex: none;
  width: 70%;
}

.mn-paper .mn-bar--head {
  width: 100%;
  height: 7px;
  background: var(--ps-ink);
}

.mn-pill {
  position: absolute;
  top: -9px;
  right: -14px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 6px 14px -6px rgba(90, 30, 8, 0.45);
  color: var(--ps-ink);
  font-size: 10px;
  font-weight: 700;
  opacity: 0;
  transform: scale(0.6);
  transition: opacity 0.3s 0.15s, transform 0.45s cubic-bezier(0.2, 1.6, 0.4, 1) 0.15s;
}

.ps-card:is(:hover, :focus-visible) .mn-feed-rows {
  transform: translateY(-42px);
}

.ps-card:is(:hover, :focus-visible) .mn-paper {
  transform: translateY(0);
}

.ps-card:is(:hover, :focus-visible) .mn-pill {
  opacity: 1;
  transform: scale(1);
}

/* Agences : calques + visuel, le BAT tombe au survol. */
.mn-app {
  display: flex;
  gap: 6px;
  width: 190px;
  padding: 7px;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 16px 28px -16px rgba(90, 30, 8, 0.45);
}

.mn-layers {
  display: flex;
  flex: 0 0 62px;
  flex-direction: column;
  gap: 5px;
}

.mn-layer {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 3px;
  border-radius: 4px;
  transition: background 0.3s;
}

.mn-ico {
  display: grid;
  place-items: center;
  width: 12px;
  height: 12px;
  border-radius: 3px;
  background: #f6e8df;
  color: #8a7266;
  font-size: 8px;
  line-height: 1;
}

.mn-layer--ai .mn-ico {
  background: var(--ps-orange);
  color: #fff;
}

.mn-canvas {
  position: relative;
  flex: 1 1 auto;
  height: 82px;
  overflow: hidden;
  border-radius: 5px;
}

.mn-stamp {
  position: absolute;
  right: 6px;
  bottom: 8px;
  padding: 2px 6px;
  border: 2px solid var(--ps-orange-dark);
  border-radius: 4px;
  background: rgba(255, 250, 245, 0.85);
  color: var(--ps-orange-dark);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.06em;
  opacity: 0;
  transform: scale(1.8);
  transition: opacity 0.2s 0.1s, transform 0.4s cubic-bezier(0.3, 1.5, 0.5, 1) 0.1s;
}

.ps-card:is(:hover, :focus-visible) .mn-layer--ai {
  background: #fde7da;
}

.ps-card:is(:hover, :focus-visible) .mn-stamp {
  opacity: 1;
  transform: scale(1);
}

/* Générateurs IA : prompt, image qui se révèle, étiquette IA. */
.mn-gen {
  display: flex;
  flex-direction: column;
  gap: 7px;
  width: 170px;
}

.mn-prompt {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 20px;
  padding: 0 8px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 8px 16px -10px rgba(90, 30, 8, 0.4);
  color: var(--ps-orange-dark);
  font-size: 11px;
}

.mn-typed {
  width: 30%;
  height: 4px;
  border-radius: 2px;
  background: #e2c9bb;
  transition: width 0.7s steps(8);
}

.mn-frame {
  position: relative;
  height: 74px;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: 0 16px 26px -16px rgba(90, 30, 8, 0.5);
}

.mn-frame-img {
  display: block;
  height: 100%;
  filter: blur(5px) saturate(0.6);
  transform: scale(1.08);
  transition: filter 0.6s 0.35s, transform 0.6s 0.35s;
}

.mn-label {
  position: absolute;
  bottom: 6px;
  left: 6px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 7px 2px 3px;
  border-radius: 999px;
  background: #fff;
  color: var(--ps-ink);
  font-size: 10px;
  font-weight: 700;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.3s 0.8s, transform 0.4s var(--mn-ease) 0.8s;
}

.ps-mini .mn-label img {
  width: 14px;
  height: 14px;
}

.ps-card:is(:hover, :focus-visible) .mn-typed {
  width: 85%;
}

.ps-card:is(:hover, :focus-visible) .mn-frame-img {
  filter: none;
  transform: none;
}

.ps-card:is(:hover, :focus-visible) .mn-label {
  opacity: 1;
  transform: none;
}

/* Conformité : dossier d'audit qui se coche. */
.mn-sheet {
  display: flex;
  flex-direction: column;
  gap: 7px;
  width: 150px;
  padding: 9px 10px;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 16px 28px -16px rgba(90, 30, 8, 0.45);
  transition: transform 0.5s var(--mn-ease);
}

.mn-sheet-head {
  color: var(--ps-orange-dark);
  font-size: 10px;
}

.mn-check {
  display: flex;
  align-items: center;
  gap: 7px;
}

.mn-tick {
  display: grid;
  flex: none;
  place-items: center;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #e9dcd3;
  color: #fff;
  font-size: 8px;
  font-weight: 900;
  line-height: 1;
  transition: background 0.25s, transform 0.35s cubic-bezier(0.2, 1.6, 0.4, 1);
}

.mn-check:nth-of-type(2) .mn-tick { transition-delay: 0.05s; }
.mn-check:nth-of-type(3) .mn-tick { transition-delay: 0.15s; }
.mn-check:nth-of-type(4) .mn-tick { transition-delay: 0.25s; }
.mn-check:nth-of-type(5) .mn-tick { transition-delay: 0.35s; }

.ps-card:is(:hover, :focus-visible) .mn-sheet {
  transform: translateY(-3px);
}

.ps-card:is(:hover, :focus-visible) .mn-tick {
  background: #16a34a;
  transform: scale(1.15);
}

.ps-card:is(:hover, :focus-visible) .mn-tick--todo {
  background: var(--ps-orange);
}

.ps-card-number {
  color: var(--ps-orange-dark);
  font-size: 12px;
}

.ps-card-title {
  font-size: 26px;
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.03em;
}

.ps-card-text {
  flex: 1 1 auto;
  color: var(--ps-muted-light);
  font-size: 16px;
}

.ps-card-trail {
  padding-top: 12px;
  border-top: 1px dashed #ecd4c8;
  color: #9a7d6f;
  font-size: 12px;
}

.ps-card-more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--ps-orange-dark);
  font-size: 15px;
  font-weight: 600;
}

.ps-arrow {
  display: inline-block;
  transition: transform 0.3s var(--ps-ease);
}

.ps-card:hover .ps-arrow {
  transform: translateX(6px);
}

/* Index des métiers */

.ps-index {
  display: flex;
  flex-wrap: wrap;
  gap: 32px 64px;
  padding-top: 24px;
}

.ps-index-intro {
  display: flex;
  flex: 1 1 260px;
  flex-direction: column;
  gap: 12px;
  max-width: 22em;
  color: var(--ps-muted-light);
  font-size: 16px;
}

.ps-index-title {
  color: var(--ps-ink);
  font-size: 30px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.03em;
}

.ps-index-list {
  display: grid;
  flex: 3 1 560px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  column-gap: 40px;
  min-width: 0;
  border-bottom: 1px solid #ecd4c8;
}

.ps-row {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 44px;
  padding: 20px 8px;
  overflow: hidden;
  border-top: 1px solid #ecd4c8;
  color: var(--ps-ink);
  text-decoration: none;
}

.ps-page main .ps-row,
.ps-page main .ps-row:hover {
  color: var(--ps-ink);
}

.ps-row::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, #fde6da, #fff3ec);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.45s var(--ps-ease);
}

.ps-row:hover::before,
.ps-row:focus-visible::before {
  transform: scaleX(1);
}

.ps-row-number {
  width: 28px;
  color: #b08a78;
  font-size: 13px;
}

.ps-row-label {
  flex: 1 1 auto;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.ps-row-arrow {
  color: var(--ps-orange);
  font-size: 20px;
  opacity: 0.4;
  transform: translateX(-8px);
  transition: transform 0.3s var(--ps-ease), opacity 0.3s;
}

.ps-row:hover .ps-row-arrow,
.ps-row:focus-visible .ps-row-arrow {
  opacity: 1;
  transform: none;
}

/* FAQ éditoriale */

.ps-faq-list {
  border-bottom: 1px solid #e4d6cd;
}

.ps-faq {
  padding: 22px 0;
  border-top: 1px solid #e4d6cd;
}

.ps-faq summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 44px;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.015em;
  list-style: none;
  cursor: pointer;
}

.ps-faq summary::-webkit-details-marker {
  display: none;
}

.ps-faq summary:hover {
  color: var(--ps-orange-dark);
}

.ps-faq-plus {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #fbefe8;
  color: var(--ps-orange-dark);
  font-size: 20px;
  font-weight: 500;
  transition: transform 0.3s var(--ps-ease);
}

.ps-faq[open] .ps-faq-plus {
  transform: rotate(45deg);
}

.ps-faq p {
  max-width: 46em;
  margin-top: 14px;
  color: var(--ps-muted-light);
  font-size: 17px;
}

/* Formulaire */

.ps-form {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 34px;
  border-radius: var(--ps-radius-card);
  background: #fff;
  color: var(--ps-ink);
  box-shadow: 0 40px 80px -30px rgba(0, 0, 0, 0.7);
}

.ps-form h3 {
  font-size: 24px;
  font-weight: 900;
  letter-spacing: -0.02em;
}

.ps-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.ps-field label {
  font-size: 14px;
  font-weight: 600;
}

.ps-field input,
.ps-field select,
.ps-field textarea {
  box-sizing: border-box;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid #d9ccc4;
  border-radius: var(--ps-radius-sm);
  background: #fff;
  color: var(--ps-ink);
  font: inherit;
}

.ps-field textarea {
  resize: vertical;
}

.ps-field input:focus,
.ps-field select:focus,
.ps-field textarea:focus {
  border-color: var(--ps-orange);
}

.ps-field input[aria-invalid="true"] {
  border-color: var(--ps-status-invalid);
}

.ps-form-note {
  color: #7a675e;
  font-size: 13px;
}

.ps-form-status {
  padding: 12px 14px;
  border-radius: var(--ps-radius-sm);
  background: #fbefe8;
  color: var(--ps-ink);
  font-size: 14px;
}

.ps-page main .ps-form a {
  color: var(--ps-orange-dark);
}


/* Programme pilote (accueil et /pilot) : texte, liste et contact par e-mail. */

.ps-pilot {
  background:
    radial-gradient(ellipse 60% 60% at 20% 20%, rgba(244, 81, 30, 0.3), transparent 65%),
    var(--ps-ember);
}

.ps-pilot-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 56px;
}

.ps-pilot-copy {
  display: flex;
  flex: 1 1 460px;
  flex-direction: column;
  gap: 26px;
  min-width: 0;
}

.ps-pilot-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin: 0;
  padding: 24px 0 0;
  border-top: 1px solid rgba(255, 211, 189, 0.18);
  font-size: 17px;
  list-style: none;
}

.ps-pilot-list li {
  display: flex;
  align-items: baseline;
  gap: 12px;
}

.ps-pilot-list li::before {
  content: "→";
  color: var(--ps-orange-light);
  font-weight: 700;
}

/* Contact du pilote : pas de formulaire, l'adresse et un bouton qui ouvre la messagerie. */
.ps-pilot-contact {
  box-sizing: border-box;
  display: flex;
  flex: 1 1 380px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  min-width: 0;
  padding: 32px;
  border: 1px solid rgba(255, 138, 76, 0.35);
  border-radius: var(--ps-radius-card);
}

.ps-page .ps-pilot-contact h3 {
  margin: 0;
  color: #fff;
  font-size: 24px;
  font-weight: 900;
  letter-spacing: -0.02em;
}

.ps-page .ps-pilot-contact p {
  margin: 0;
  color: var(--ps-muted-dark);
  font-size: 17px;
  line-height: 1.55;
}

.ps-page main .ps-pilot-mail {
  color: var(--ps-orange-light);
  font-size: 22px;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
}

.ps-page main .ps-pilot-mail:hover {
  color: #fff;
}

/* Étapes de déploiement numérotées. */

.ps-deploy {
  display: flex;
  flex-wrap: wrap;
  gap: 28px 40px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ps-deploy li {
  display: flex;
  flex: 1 1 260px;
  align-items: flex-start;
  gap: 16px;
  min-width: 0;
}

.ps-deploy-number {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--ps-orange);
  color: #fff;
  font-weight: 900;
}

.ps-deploy-copy {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: var(--ps-muted-light);
  font-size: 16px;
}

.ps-deploy-title {
  color: var(--ps-ink);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

/* Section FAQ : intro à gauche, questions à droite. */

.ps-faq-section {
  display: flex;
  flex-wrap: wrap;
  gap: 48px 72px;
}

.ps-faq-section-intro {
  display: flex;
  flex: 1 1 320px;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
}

.ps-faq-section-intro .ps-h2 {
  max-width: 10em;
}

.ps-faq-section-intro .ps-lead {
  font-size: 17px;
}

.ps-page main .ps-faq-section-more {
  align-self: flex-start;
  color: var(--ps-ink);
  font-size: 17px;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 6px;
}

.ps-page main .ps-faq-section-more:hover {
  color: var(--ps-orange-dark);
}

.ps-faq-section .ps-faq-list {
  flex: 2 1 560px;
  min-width: 0;
}

/* Pastilles de statut C2PA */

.ps-status-dot {
  flex: 0 0 auto;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

.ps-status-dot--trusted {
  background: var(--ps-status-trusted);
  box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.2);
}

.ps-status-dot--untrusted {
  background: var(--ps-status-untrusted);
  box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.2);
}

.ps-status-dot--invalid {
  background: var(--ps-status-invalid);
  box-shadow: 0 0 0 4px rgba(214, 38, 74, 0.2);
}

.ps-status-dot--none {
  background: var(--ps-status-none);
  box-shadow: 0 0 0 4px rgba(148, 163, 184, 0.2);
}

@media (max-width: 900px) {
  .ps-section {
    padding: 88px 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ps-word,
  .ps-fade,
  .ps-rev,
  .ps-stampin {
    animation: none;
    opacity: 1;
    transform: none;
    filter: none;
  }

  .ps-card,
  .ps-mini *,
  .ps-row::before,
  .ps-arrow,
  .ps-row-arrow,
  .ps-faq-plus,
  .ps-btn--dark {
    transition: none;
  }
}

/* Bandeau de consentement (créé par site.js) : carte braise compacte en bas à gauche,
   « Refuser » et « Accepter » de même poids, comme l'exige la CNIL. */
.cookie-consent {
  position: fixed;
  right: auto;
  bottom: 20px;
  left: 20px;
  z-index: 120;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
  width: min(400px, calc(100% - 40px));
  padding: 20px;
  border: 1px solid var(--ps-line-peach);
  border-radius: 20px;
  background: var(--ps-ember-card);
  box-shadow: 0 30px 70px -20px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(0, 0, 0, 0.2);
  color: #fff;
  font-family: var(--ps-font-sans);
  backdrop-filter: none;
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.35s var(--ps-ease), transform 0.45s var(--ps-ease);
}

.cookie-consent.is-open {
  opacity: 1;
  transform: none;
}

.cookie-consent[hidden] {
  display: none;
}

.cookie-consent-head {
  display: flex;
  align-items: center;
  gap: 10px;
}

.cookie-consent-seal {
  display: grid;
  flex: none;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 2px var(--ps-orange);
}

.cookie-consent-seal img {
  width: 20px;
  height: 20px;
}

.cookie-consent .cookie-consent-title {
  margin: 0;
  color: #fff;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.cookie-consent .cookie-consent-text {
  margin: 0;
  color: #d9c2b5;
  font-size: 14px;
  line-height: 1.55;
}

.cookie-consent .cookie-consent-text a {
  color: var(--ps-peach);
  text-underline-offset: 3px;
}

.cookie-consent .cookie-consent-text a:hover {
  color: var(--ps-peach-light);
}

.cookie-consent .cookie-consent-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 4px;
}

.cookie-consent-btn {
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid var(--ps-line-peach);
  border-radius: 999px;
  background: transparent;
  color: #fff;
  font: 600 15px/1 var(--ps-font-sans);
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s, transform 0.2s var(--ps-ease);
}

.cookie-consent-btn:hover {
  border-color: var(--ps-peach);
  transform: translateY(-1px);
}

.cookie-consent-accept {
  border-color: var(--ps-orange);
  background: var(--ps-orange);
}

.cookie-consent-accept:hover {
  border-color: var(--ps-orange-light);
  background: var(--ps-orange-light);
}

.cookie-consent-btn:focus-visible,
.cookie-consent a:focus-visible {
  outline: var(--ps-focus);
  outline-offset: 3px;
}

@media (max-width: 560px) {
  .cookie-consent {
    right: 12px;
    bottom: 12px;
    left: 12px;
    width: auto;
    padding: 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cookie-consent,
  .cookie-consent-btn {
    transition: none;
  }
}

/* Pastilles partenaires sur une ligne, juste au-dessus de la mention légale (trait rapproché). */
.ps-footer-partners--row {
  gap: 12px;
  margin-top: 8px;
}

.ps-footer-partners--row .ps-footer-partner {
  min-height: 48px;
  padding: 8px 18px 8px 10px;
  gap: 10px;
  font-size: 15px;
}

.ps-footer-partners--row .ps-footer-partner img {
  height: 30px;
  padding: 4px;
  border-radius: 8px;
}

.ps-footer-partners--row + .ps-footer-legal {
  margin-top: -36px;
  padding-top: 16px;
}

/* ---------- Règles de la revue de l'accueil, appliquées à toutes les pages ----------
   Satoshi partout (le mono reste réservé au vrai code), une seule taille de titre de section
   et une seule taille de sous-titre. */
:root {
  --ps-h2-size: clamp(44px, 5.6vw, 88px);
  --ps-lead-size: 19px;
}

.ps-page main {
  --ps-font-mono: var(--ps-font-sans);
}

.ps-page main :is(pre, code, kbd, samp, .hw-codebox, .pk-type-mono, .pk-sw-hex, [class*="-code"]) {
  --ps-font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

.ps-page main :is(pre, code, kbd, samp, [class*="-code"]) {
  font-family: var(--ps-font-mono);
}

.ps-page main h2:is(.ps-h2, .f-big) {
  max-width: 14em;
  font-size: var(--ps-h2-size);
  line-height: 0.92;
  letter-spacing: -0.05em;
}

.ps-page main :is(.ps-lead, .f-lead) {
  font-size: var(--ps-lead-size);
  line-height: 1.55;
}

/* Animations d'apparition plus rapides : le contenu est là dès qu'il entre à l'écran. */
.ps-d1 { animation-delay: 0.15s; }
.ps-d2 { animation-delay: 0.3s; }
.ps-d3 { animation-delay: 0.45s; }

@supports (animation-timeline: view()) {
  .ps-rev {
    animation-range: entry 0% entry 25%;
  }

  .ps-stampin,
  .ps-page main .f-stamp {
    animation-range: entry 0% entry 30%;
  }
}

/* ---------- Appel final commun à toutes les pages ----------
   Titre de section, une phrase, le bouton orange, puis « Voir aussi » en liens soulignés. */
.ps-endcta-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  padding-top: 120px;
  padding-bottom: 120px;
}

.ps-endcta h2 {
  color: #fff;
}

.ps-endcta-lead {
  max-width: 34em;
  margin: 0;
  color: var(--ps-muted-dark);
  font-size: var(--ps-lead-size);
  line-height: 1.55;
}

.ps-endcta-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 28px;
  margin-top: 8px;
}

.ps-endcta-related {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 28px;
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 180, 140, 0.18);
}

.ps-endcta-label {
  color: var(--ps-faint-dark);
  font-size: 15px;
  font-weight: 600;
}

.ps-page main .ps-endcta-related a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: #fff;
  font-size: 17px;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 6px;
}

.ps-page main .ps-endcta-related a:hover {
  color: var(--ps-peach);
}

@media (max-width: 900px) {
  .ps-endcta-inner {
    padding-top: 88px;
    padding-bottom: 88px;
  }
}

/* Pied de page : le logo ProvSeal est centré sur la ligne des titres de colonnes. */
@media (min-width: 1101px) {
  .ps-footer-brand .ps-brand {
    margin-top: -10px;
  }
}


/* ---------- Composants communs issus de la revue (référence : enterprise.html) ---------- */

/* Une tache orange par section, alternée droite / gauche. */
.ps-page main > section:nth-of-type(odd) { --ps-glow-x: 90%; }
.ps-page main > section:nth-of-type(even) { --ps-glow-x: 8%; }

/* Statuts : pastilles teintées et droites, jamais de tampon incliné. */
.ps-page main .f-stamp {
  padding: 6px 14px;
  border: 0;
  border-radius: var(--ps-radius-pill);
  font-family: var(--ps-font-sans);
  font-size: 14px;
  letter-spacing: 0.04em;
  white-space: nowrap;
  transform: none;
}

.ps-page main .f-stamp--available { background: rgba(4, 120, 87, 0.12); }
.ps-page main .f-stamp--pilot { background: rgba(244, 81, 30, 0.12); }
.ps-page main .f-stamp--planned { background: rgba(87, 83, 78, 0.12); }

@keyframes ps-pill-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}

@supports (animation-timeline: view()) {
  .ps-page main .f-stamp { animation-name: ps-pill-in; }
}

/* Textes de cartes et de lignes : taille des sous-titres ; titres de cartes : 26 px. */
.ps-page main :is(.f-led-text, .f-rules-text) {
  font-size: var(--ps-lead-size);
  line-height: 1.55;
}

.ps-page main .f-rules-text { color: #d7c3b8; }
.ps-page main .f-paper .f-rules-text { color: var(--ps-muted-light); }

.ps-page main .f-rules-title {
  font-size: 26px;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.03em;
}

.ps-page main .f-rules li:not(:has(.f-rules-number)) {
  grid-template-columns: minmax(0, 1fr);
}

/* Liste « ce que ce n'est pas » : pastille ✕ neutre + texte en gras, jamais de texte barré. */
.ps-nots {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid #e3cfc4;
  list-style: none;
}

.ps-nots li {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 20px 0;
  border-top: 1px solid #e3cfc4;
}

.ps-not-ico {
  display: grid;
  flex: none;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #f1e4dc;
  color: #8a7266;
  font-size: 15px;
  font-weight: 700;
}

.ps-not-text {
  color: var(--ps-ink);
  font-size: 26px;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.03em;
}

:is(.f-dark, .ps-section--ember) .ps-nots,
:is(.f-dark, .ps-section--ember) .ps-nots li { border-color: rgba(255, 180, 140, 0.2); }
:is(.f-dark, .ps-section--ember) .ps-not-ico { background: rgba(255, 255, 255, 0.08); color: #c7ab9d; }
:is(.f-dark, .ps-section--ember) .ps-not-text { color: #fff; }

/* Petites notes : pastille à coche, comme sous le titre de l'accueil. */
.ps-note {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin: 0;
  padding: 0;
  color: var(--ps-muted-light);
  font-size: 16px;
  list-style: none;
}

.ps-note li {
  display: inline-flex;
  align-items: flex-start;
  gap: 8px;
  max-width: 46em;
}

.ps-note li::before {
  content: "✓";
  display: grid;
  flex: none;
  place-items: center;
  width: 18px;
  height: 18px;
  margin-top: 2px;
  border-radius: 50%;
  background: rgba(244, 81, 30, 0.14);
  color: var(--ps-orange-dark);
  font-size: 11px;
  font-weight: 700;
}

:is(.f-dark, .ps-section--ember) .ps-note { color: var(--ps-faint-dark); }
:is(.f-dark, .ps-section--ember) .ps-note li::before { background: rgba(244, 81, 30, 0.18); color: var(--ps-peach); }

/* Lien secondaire : forme « Voir le process » (souligné, sans flèche). */
.ps-page main .ps-link {
  align-self: flex-start;
  color: var(--ps-ink);
  font-size: 17px;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 6px;
}

.ps-page main .ps-link:hover { color: var(--ps-orange-dark); }
.ps-page main :is(.f-dark, .ps-section--ember) .ps-link { color: #fff; }
.ps-page main :is(.f-dark, .ps-section--ember) .ps-link:hover { color: var(--ps-peach); }

/* Dans une rangée d'actions (bouton + lien), le lien se centre sur le bouton. */
.ps-page main [class*="-actions"] > .ps-link {
  align-self: center;
}

/* En-tête de section produit : titre puis sous-titre, toujours empilés. */
.ps-page main .f-head {
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
}

.ps-page main .f-head > p {
  flex: none;
  max-width: 34em;
  font-size: var(--ps-lead-size);
  line-height: 1.55;
}

/* Réponses de FAQ : plus de retrait pour un numéro, taille des sous-titres. */
.ps-page main .f-q p {
  margin-left: 0;
  font-size: var(--ps-lead-size);
  line-height: 1.55;
}

/* Fil des étapes produit : apparition rapide. */
@supports (animation-timeline: view()) {
  .ps-page main .f-step .f-node,
  .ps-page main .f-step .f-num {
    animation-range: entry 0% entry 40%;
  }
}

/* .ps-link existe aussi pour les liens du menu : dans le contenu, on annule ce style. */
.ps-page main .ps-link,
.ps-page main .ps-link:hover {
  display: inline-flex;
  align-items: center;
  padding: 0;
  border-radius: 0;
  background: none;
}

/* Étapes de déploiement : mêmes tailles que les cartes. */
.ps-page main .ps-deploy-title {
  font-size: 26px;
  font-weight: 800;
  line-height: 1.15;
}

.ps-page main .ps-deploy-copy {
  font-size: var(--ps-lead-size);
  line-height: 1.55;
}

/* Lien secondaire sur fond clair : encre, même dans une section papier. Les :not() en plus donnent
   la priorité sur la règle des liens orange de product.css (.f-paper a:not(.ps-btn):not(.ps-row):not(.ps-card)). */
.ps-page main :is(.f-paper, .ps-section--paper, .ps-section--cream) a.ps-link:not(.ps-btn):not(.ps-row):not(.ps-card) {
  color: var(--ps-ink);
}

.ps-page main :is(.f-paper, .ps-section--paper, .ps-section--cream) a.ps-link:not(.ps-btn):not(.ps-row):not(.ps-card):hover {
  color: var(--ps-orange-dark);
}

/* Bouton principal du haut de page : un seul gabarit sur tout le site. */
.ps-page main > :first-child .ps-btn:not(.ps-btn--block),
.ps-page main .ps-endcta .ps-btn:not(.ps-btn--block) {
  min-height: 56px;
  padding: 0 28px;
  font-family: var(--ps-font-sans);
  font-size: 17px;
  font-weight: 700;
  line-height: 1;
  border-radius: var(--ps-radius-pill);
}

/* Titre principal (h1) : une seule taille sur toutes les pages, celle du slogan de l'accueil.
   Si un titre devient trop long, on le raccourcit ; on ne réduit jamais la taille.
   Exceptions : la documentation (.dc-title) et les articles (.ar-title, .cn-h1), au gabarit
   classique d'une doc et d'une page de lecture. */
:root {
  --ps-h1-size: clamp(46px, 6.4vw, 104px);
}

.ps-page main h1:not(.hm-title):not(.bl-sr):not(.visually-hidden):not(.dc-title):not(.ar-title):not(.cn-h1):not(.gl-h1):not(.gd-word):not(.fq-title):not(.ab-h1):not(.ct-h1) {
  font-size: var(--ps-h1-size);
  line-height: 0.92;
  letter-spacing: -0.05em;
}

/* Pages de lecture (articles, fiches du glossaire) : à partir de 1100 px, le texte occupe la
   largeur utile et une colonne collante (sommaire + carte extension) remplit la droite. */
.ar-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 56px;
}

.ar-side {
  display: none;
}

@media (min-width: 1100px) {
  .ar-layout {
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 72px;
  }

  .ar-layout > * {
    max-width: none;
  }

  .ar-side {
    position: sticky;
    top: 120px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-self: start;
    padding-bottom: 96px;
  }
}

.ar-toc {
  padding-top: 14px;
  border-top: 1.5px solid var(--ps-ink);
}

.ps-page .ar-toc-title,
.ps-page .ar-side-title {
  margin: 0 0 12px;
  color: var(--ps-ink);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.ar-toc-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ps-page main .ar-toc-list a {
  display: block;
  padding: 8px 12px;
  border-radius: 10px;
  color: var(--ps-muted-light);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.ps-page main .ar-toc-list a:hover,
.ps-page main .ar-toc-list a[aria-current="true"] {
  background: rgba(244, 81, 30, 0.12);
  color: var(--ps-orange-dark);
}

/* Encart latéral : pas de fond blanc, même traitement que le sommaire (filet en haut, fond de la page). */
.ar-side-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-top: 12px;
  padding: 14px 0 0;
  border-top: 1.5px solid var(--ps-ink);
  background: transparent;
}

.ps-page .ar-side-title {
  font-size: 19px;
  letter-spacing: -0.02em;
  text-transform: none;
}

.ps-page .ar-side-text {
  margin: 0 0 14px;
  color: var(--ps-muted-light);
  font-size: 15px;
  line-height: 1.55;
}

.ps-page main .ar-side-card .ps-link {
  font-size: 15px;
}

.ar-wide > *,
.ar-head > .ar-title {
  max-width: 1080px;
}

/* La ligne de métadonnées traverse les deux colonnes (texte + sommaire). */
.ar-head > .ar-meta {
  max-width: none;
}