.sc-hero { padding: 0; }

.sc-hero::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: radial-gradient(42% 70% at 50% 0%, color-mix(in srgb, var(--bleu-600) 11%, transparent), transparent 72%);
}

.sc-hero-cadre {
  position: relative; z-index: 1; isolation: isolate;
  width: 100%; max-width: 62rem; margin: 0 auto;
  padding: clamp(2.25rem, 5vw, 4rem) 24px clamp(2.25rem, 4.5vw, 3.5rem);
  display: flex; flex-direction: column; align-items: center; gap: 1.2rem;
  text-align: center;
}

.sc-hero-filets { display: none; }
@media (min-width: 900px) {
  .sc-hero-filets { display: block; position: absolute; inset: 0; z-index: -1; pointer-events: none; }
  .sc-hero-filets::before,
  .sc-hero-filets::after {
    content: ""; position: absolute; top: 0; bottom: 0; width: 17px;
    background: linear-gradient(to right, var(--bleu-200) 0 1px, transparent 1px 16px, var(--bleu-100) 16px 17px);
    -webkit-mask-image: linear-gradient(to bottom, transparent, var(--ink) 60%);
    mask-image: linear-gradient(to bottom, transparent, var(--ink) 60%);
  }
  .sc-hero-filets::before { left: 24px; }
  .sc-hero-filets::after { right: 24px; transform: scaleX(-1); }
}

.sc-pastille {
  display: inline-flex; align-items: center; gap: .55rem; max-width: 100%;
  padding: .35rem .95rem .35rem .4rem; border-radius: 999px;
  background: var(--paper); border: 1px solid var(--line); box-shadow: var(--shadow-carte);
  font-size: .76rem; font-weight: 680; letter-spacing: .12em; text-transform: uppercase;
  line-height: 1.3; color: var(--bleu-700);
}
.sc-pastille-ic {
  display: grid; place-items: center; flex-shrink: 0;
  width: 1.65rem; height: 1.65rem; border-radius: 50%;
  background: var(--bleu-100); color: var(--bleu-700);
}
.sc-pastille-svg { width: .85rem; height: .85rem; display: block; }

.sc-hero-titre { max-width: 22ch; }

.sc-hero-texte {
  max-width: 52ch; text-wrap: pretty;
  font-size: clamp(1.04rem, 1.5vw, 1.19rem); line-height: 1.6; color: var(--ink-soft);
}

.sc-hero-actions {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch;
  gap: .8rem; margin-top: .7rem;
}
.sc-hero-actions > .btn-shiny,
.sc-hero-lien { min-height: 52px; }
@media (max-width: 620px) {
  .sc-hero-actions { flex-direction: column; align-items: stretch; width: 100%; max-width: 21rem; }
  .sc-hero-lien { font-size: .9rem; }
}


.sc-confiance {
  padding: 1.6rem 0 1.8rem;
  background: var(--paper); border-bottom: 1px solid var(--line-soft);
}
.sc-confiance-kicker {
  text-align: center;
  font-size: .74rem; font-weight: 680; letter-spacing: .14em; text-transform: uppercase;
  color: var(--ink-mute);
}
.sc-confiance-liste {
  list-style: none; margin-top: 1.1rem;
  display: grid; grid-template-columns: minmax(0, 1fr); gap: .8rem;
}
@media (min-width: 640px) {
  .sc-confiance-liste { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem 1.6rem; }
}
@media (min-width: 1000px) {
  .sc-confiance-liste { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
  .sc-confiance-item { justify-content: center; padding: .15rem 1.2rem; }
  .sc-confiance-item + .sc-confiance-item { border-left: 1px solid var(--line); }
}
.sc-confiance-item {
  display: flex; align-items: center; gap: .7rem; min-width: 0;
}
.sc-confiance-ic {
  display: grid; place-items: center; flex-shrink: 0;
  width: 2.25rem; height: 2.25rem; border-radius: 10px;
  background: var(--bleu-100); color: var(--bleu-600);
}
.sc-confiance-svg { width: 1.1rem; height: 1.1rem; display: block; }
.sc-confiance-texte { font-size: .92rem; font-weight: 600; line-height: 1.35; color: var(--marine); }


.sc-portee { background: var(--paper); }

.sc-comparer {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem;
  max-width: 66rem; margin: 0 auto;
}
@media (min-width: 820px) {
  .sc-comparer { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; align-items: stretch; }
}

.sc-colonne {
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; flex-direction: column;
  background: var(--paper); border: 1px solid var(--line); border-radius: 22px;
}
.sc-colonne-oui {
  border-color: var(--bleu-200);
  box-shadow: 0 0 0 4px var(--bleu-50), var(--shadow-carte);
}
.sc-colonne-non {
  background: var(--marine); border-color: transparent;
  box-shadow: var(--shadow-haute);
}
.sc-colonne-non::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(90% 60% at 100% 0%, color-mix(in srgb, var(--bleu-600) 30%, transparent), transparent 70%);
}

.sc-colonne-tete { padding: clamp(1.35rem, 3vw, 1.9rem) clamp(1.2rem, 3vw, 1.9rem) 1.25rem; }
.sc-colonne-rang { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; }
.sc-colonne-titre { font-size: clamp(1.1rem, 1.7vw, 1.3rem); color: var(--ink); }
.sc-colonne-non .sc-colonne-titre { color: var(--paper); }

.sc-colonne-badge {
  display: inline-flex; align-items: center;
  padding: .22rem .6rem; border-radius: 999px;
  font-size: .7rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; line-height: 1.3;
}
.sc-colonne-badge-oui { background: var(--bleu-700); color: var(--paper); }
.sc-colonne-badge-non {
  background: color-mix(in srgb, var(--paper) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--paper) 22%, transparent);
  color: var(--sur-sombre);
}

.sc-colonne-desc { margin-top: .5rem; font-size: .95rem; line-height: 1.5; color: var(--ink-mute); }
.sc-colonne-non .sc-colonne-desc { color: var(--sur-sombre-mute); }

.sc-lignes {
  list-style: none; display: grid; gap: 1.15rem;
  padding: 1.35rem clamp(1.2rem, 3vw, 1.9rem) 1.6rem;
  border-top: 1px solid var(--line-soft);
}
.sc-colonne-non .sc-lignes { border-top-color: color-mix(in srgb, var(--paper) 10%, transparent); }

.sc-ligne { display: grid; grid-template-columns: 1.6rem minmax(0, 1fr); gap: .85rem; align-items: start; }
.sc-ligne-marque {
  display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%;
  margin-top: .05rem;
}
.sc-ligne-marque-oui { background: var(--bleu-600); color: var(--paper); }
.sc-ligne-marque-non {
  background: color-mix(in srgb, var(--paper) 9%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--paper) 18%, transparent);
  color: var(--sur-sombre);
}
.sc-ligne-ic { width: .82rem; height: .82rem; display: block; }

.sc-ligne-titre { display: block; font-size: 1rem; font-weight: 680; line-height: 1.4; color: var(--ink); }
.sc-colonne-non .sc-ligne-titre { color: var(--paper); }
.sc-ligne-texte { margin-top: .2rem; font-size: .93rem; line-height: 1.55; color: var(--ink-soft); }
.sc-colonne-non .sc-ligne-texte { color: var(--sur-sombre-mute); }

.sc-colonne-pied {
  margin-top: auto;
  display: flex; align-items: flex-start; gap: .65rem;
  padding: 1.05rem clamp(1.2rem, 3vw, 1.9rem) 1.15rem;
  background: var(--bleu-50); border-top: 1px solid var(--line-soft);
}
.sc-colonne-non .sc-colonne-pied {
  background: color-mix(in srgb, var(--paper) 5%, transparent);
  border-top-color: color-mix(in srgb, var(--paper) 10%, transparent);
}
.sc-colonne-pied-ic { width: 1.1rem; height: 1.1rem; flex-shrink: 0; margin-top: .12rem; color: var(--bleu-700); }
.sc-colonne-non .sc-colonne-pied-ic { color: var(--vert); }
.sc-colonne-pied-texte { font-size: .9rem; font-weight: 600; line-height: 1.5; color: var(--ink-soft); }
.sc-colonne-non .sc-colonne-pied-texte { color: var(--sur-sombre); }



.sc-bento { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.1rem; }
@media (min-width: 720px) {
  .sc-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sc-tuile-large { grid-column: span 2; }
}
@media (min-width: 1040px) {
  .sc-bento { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
}

.sc-tuile {
  position: relative; isolation: isolate;
  display: flex; flex-direction: column; gap: 1.5rem;
  padding: clamp(1.35rem, 3vw, 1.9rem);
  background:
    radial-gradient(60% 70% at 18% 0%, var(--bleu-50), transparent 72%),
    var(--paper);
  border: 1px solid var(--line); border-radius: 22px;
  transition: border-color .3s ease, box-shadow .3s ease;
}
.sc-tuile:hover { border-color: var(--bleu-200); box-shadow: 0 18px 40px rgba(8, 42, 102, .08); }

.reveler-actif .sc-tuile[data-reveler] {
  transition:
    opacity .6s cubic-bezier(.22, 1, .36, 1) calc(var(--rang, 0) * 70ms),
    transform .6s cubic-bezier(.22, 1, .36, 1) calc(var(--rang, 0) * 70ms),
    border-color .3s ease,
    box-shadow .3s ease;
}

@media (min-width: 720px) {
  .sc-tuile-large {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: stretch; gap: clamp(1.5rem, 3vw, 2.5rem);
  }
  .sc-tuile-large > .sc-tuile-texte { align-self: center; }
  .sc-tuile-large > .sc-visuel { padding: clamp(1rem, 2.4vw, 1.6rem); }
}

.sc-tuile-projecteur {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  border-radius: inherit; opacity: 0; transition: opacity .3s ease;
  background: radial-gradient(circle 220px at var(--sc-mx, 50%) var(--sc-my, 0%), color-mix(in srgb, var(--bleu-600) 9%, transparent), transparent 70%);
}
.sc-tuile:hover .sc-tuile-projecteur { opacity: 1; }

.sc-mire {
  position: absolute; z-index: 2; pointer-events: none;
  width: 14px; height: 14px; color: var(--bleu-200);
}
.sc-mire-haut { top: 0; left: 0; transform: translate(-50%, -50%); }
.sc-mire-bas { bottom: 0; right: 0; transform: translate(50%, 50%); }

.sc-tuile-texte, .sc-visuel { position: relative; z-index: 1; min-width: 0; }

.sc-tuile-ic {
  display: grid; place-items: center;
  width: 2.6rem; height: 2.6rem; border-radius: 12px;
  background: var(--bleu-100); color: var(--bleu-600);
  border: 1px solid transparent;
  transition: border-color .3s ease, background-color .3s ease;
}
.sc-tuile:hover .sc-tuile-ic { border-color: var(--bleu-200); background: var(--paper); }
.sc-tuile-svg { width: 1.25rem; height: 1.25rem; display: block; }

.sc-tuile-titre { margin-top: 1rem; font-size: clamp(1.08rem, 1.7vw, 1.3rem); color: var(--ink); }
.sc-tuile-corps { margin-top: .5rem; font-size: .95rem; line-height: 1.6; color: var(--ink-soft); }

.sc-visuel {
  display: grid; gap: .6rem; align-content: center;
  padding: 1rem; border-radius: 16px;
  background: var(--bleu-50); border: 1px solid var(--line);
}

.sc-champ {
  display: grid; gap: .35rem;
  padding: .7rem .8rem; border-radius: 12px;
  background: var(--paper); border: 1px solid var(--line);
}
.sc-champ-label {
  font-size: .68rem; font-weight: 680; letter-spacing: .1em; text-transform: uppercase;
  color: var(--ink-soft);
}
.sc-champ-valeur { display: flex; align-items: center; gap: .5rem; min-height: 1.4rem; }
.sc-champ-points { font-size: 1rem; letter-spacing: .14em; line-height: 1; color: var(--marine); overflow: hidden; white-space: nowrap; }
.sc-curseur {
  width: 2px; height: 1.05rem; border-radius: 1px; background: var(--bleu-600);
  animation: sc-clignote 1.1s steps(1) infinite;
}
@keyframes sc-clignote { 50% { opacity: 0; } }

.sc-passage { display: flex; align-items: center; gap: .55rem; padding-left: .8rem; }
.sc-passage-ic {
  display: grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%;
  background: var(--bleu-600); color: var(--paper); flex-shrink: 0;
}
.sc-passage-svg { width: .8rem; height: .8rem; display: block; }
.sc-passage-texte { font-size: .82rem; font-weight: 640; color: var(--bleu-700); }

.sc-champ-base { border-color: var(--bleu-200); }
.sc-barres {
  position: relative; overflow: hidden; flex: 1; min-width: 0;
  display: flex; align-items: center; gap: .35rem; height: 1.1rem;
}
.sc-barre {
  display: block; flex: 0 0 var(--sc-l); height: .55rem; border-radius: 999px;
  background: var(--bleu-200);
}
.sc-barres::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: -40%; width: 40%;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--paper) 85%, transparent), transparent);
  animation: sc-reflet 3.2s cubic-bezier(.45, 0, .55, 1) infinite;
}
@keyframes sc-reflet { to { left: 110%; } }
.sc-champ-cadenas { width: .9rem; height: .9rem; flex-shrink: 0; color: var(--bleu-700); }

.sc-boite {
  display: flex; align-items: center; gap: .65rem;
  padding: .65rem .8rem; border-radius: 12px;
  background: var(--paper); border: 1px solid var(--line);
}
.sc-boite-ic {
  display: grid; place-items: center; flex-shrink: 0;
  width: 2rem; height: 2rem; border-radius: 9px;
  background: var(--bleu-100); color: var(--bleu-700);
}
.sc-boite-ic-cle { background: var(--marine); color: var(--paper); }
.sc-boite-svg { width: 1rem; height: 1rem; display: block; }
.sc-boite-nom { font-size: .88rem; font-weight: 640; color: var(--marine); }

.sc-separation {
  position: relative; display: flex; justify-content: center; padding: .55rem 0;
}
.sc-separation::before {
  content: ""; position: absolute; top: 0; bottom: 0; left: 50%;
  border-left: 1.5px dashed var(--bleu-200);
}
.sc-separation-texte {
  position: relative; padding: .2rem .65rem; border-radius: 999px;
  background: var(--bleu-50); border: 1px solid var(--bleu-200);
  font-size: .72rem; font-weight: 660; color: var(--bleu-700);
}

.sc-masque {
  display: flex; align-items: center; justify-content: space-between; gap: .8rem;
  padding: .75rem .85rem; border-radius: 12px;
  background: var(--paper); border: 1px solid var(--line);
}
.sc-masque-qui { display: inline-flex; align-items: center; gap: .5rem; font-size: .88rem; font-weight: 640; color: var(--marine); }
.sc-masque-svg { width: 1rem; height: 1rem; color: var(--bleu-600); flex-shrink: 0; }
.sc-masque-logo { width: 16px; height: auto; display: block; flex-shrink: 0; }
.sc-masque-valeur { font-size: .95rem; letter-spacing: .14em; line-height: 1; color: var(--ink-soft); white-space: nowrap; }

.sc-ecran {
  border-radius: 12px; overflow: hidden;
  background: var(--paper); border: 1px solid var(--line);
  box-shadow: 0 10px 24px rgba(8, 42, 102, .06);
}
.sc-ecran-barre {
  display: flex; align-items: center; gap: .35rem;
  padding: .55rem .75rem; border-bottom: 1px solid var(--line-soft); background: var(--paper);
}
.sc-ecran-point { display: block; width: 7px; height: 7px; border-radius: 50%; background: var(--line); }
.sc-ecran-adresse {
  margin-left: .45rem; flex: 1; min-width: 0;
  padding: .18rem .6rem; border-radius: 999px; background: var(--bleu-50);
  font-size: .72rem; color: var(--ink-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sc-ecran-corps { display: grid; gap: .75rem; padding: .9rem .85rem 1rem; }

.sc-fichier {
  display: flex; align-items: center; gap: .65rem;
  padding: .6rem .7rem; border-radius: 10px; border: 1px solid var(--line);
}
.sc-fichier-type {
  display: grid; place-items: center; flex-shrink: 0;
  width: 2.1rem; height: 2.4rem; border-radius: 7px;
  background: var(--bleu-100); color: var(--bleu-700);
  font-size: .62rem; font-weight: 780; letter-spacing: .04em;
}
.sc-fichier-nom { font-size: .86rem; font-weight: 640; color: var(--ink); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.sc-etats { display: flex; flex-wrap: wrap; gap: .45rem; }
.sc-etat {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .28rem .65rem; border-radius: 999px;
  background: var(--bleu-50); border: 1px solid var(--line);
  font-size: .76rem; font-weight: 620; color: var(--ink-soft);
}
.sc-etat-point { display: block; width: 7px; height: 7px; border-radius: 50%; background: var(--vert); flex-shrink: 0; }
.sc-etat-svg { width: .8rem; height: .8rem; flex-shrink: 0; color: var(--bleu-700); }


.sc-details {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.1rem;
  margin-top: 1.1rem;
}
@media (min-width: 900px) {
  .sc-details { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; margin-top: 1.25rem; }
  .sc-detail-long { grid-column: 2; grid-row: 1 / span 2; }
}
.sc-detail {
  padding: clamp(1.35rem, 3vw, 1.9rem);
  background: var(--paper); border: 1px solid var(--line); border-radius: 22px;
}
.sc-detail-ic {
  display: grid; place-items: center;
  width: 2.6rem; height: 2.6rem; border-radius: 12px;
  background: var(--bleu-100); color: var(--bleu-600);
}
.sc-detail-svg { width: 1.25rem; height: 1.25rem; display: block; }
.sc-detail-titre { margin-top: 1rem; font-size: clamp(1.08rem, 1.7vw, 1.25rem); color: var(--ink); }
.sc-detail-texte { margin-top: .6rem; font-size: .95rem; line-height: 1.6; color: var(--ink-soft); }
.sc-detail-appel { font-weight: 600; color: var(--ink); }

.sc-detail-liste { list-style: none; display: grid; gap: .55rem; margin-top: .6rem; }
.sc-detail-point {
  position: relative; padding-left: 1.15rem;
  font-size: .95rem; line-height: 1.6; color: var(--ink-soft);
}
.sc-detail-point::before {
  content: ""; position: absolute; left: .1rem; top: .66em;
  width: 6px; height: 6px; border-radius: 50%; background: var(--bleu-600);
}
.sc-detail-note { margin-top: 1rem; padding-top: .9rem; border-top: 1px solid var(--line-soft); }


.sc-sortie { background: var(--paper); }

.sc-sortie-grille { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2.4rem; }
@media (min-width: 940px) {
  .sc-sortie-grille { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2.5rem, 5vw, 4.5rem); align-items: center; }
}

.sc-sortie-intro { margin-top: 1rem; font-size: 1.06rem; line-height: 1.65; color: var(--ink-soft); max-width: 46ch; }

.sc-points { list-style: none; display: grid; gap: 1.1rem; margin-top: 1.6rem; }
.sc-point { display: grid; grid-template-columns: 1.6rem minmax(0, 1fr); gap: .85rem; align-items: start; }
.sc-point-marque {
  display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%;
  background: var(--bleu-100); color: var(--bleu-700); margin-top: .05rem;
}
.sc-point-svg { width: .82rem; height: .82rem; display: block; }
.sc-point-titre { display: block; font-size: 1rem; font-weight: 680; line-height: 1.4; color: var(--ink); }
.sc-point-texte { margin-top: .2rem; font-size: .94rem; line-height: 1.55; color: var(--ink-soft); }

.sc-frise-carte {
  padding: clamp(1.35rem, 3.2vw, 2.1rem);
  background: var(--paper); border: 1px solid var(--line); border-radius: 22px;
  box-shadow: var(--shadow-carte);
}
.sc-frise-kicker {
  font-size: .76rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase;
  color: var(--bleu-700); margin-bottom: 1.4rem;
}
.sc-frise { list-style: none; display: flex; flex-direction: column; }
.sc-frise-etape { display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: 1.05rem; }
.sc-frise-rail { display: flex; flex-direction: column; align-items: center; }
.sc-frise-noeud {
  display: grid; place-items: center; flex-shrink: 0;
  width: 2.75rem; height: 2.75rem; border-radius: 50%;
  background: var(--bleu-50); border: 1px solid var(--bleu-200); color: var(--bleu-600);
}
.sc-frise-noeud-fin { background: var(--vert); border-color: var(--vert); color: var(--paper); }
.sc-frise-svg { width: 1.1rem; height: 1.1rem; display: block; }
.sc-frise-trait { flex: 1; width: 0; min-height: 1.2rem; margin: .35rem 0; border-left: 1.5px dashed var(--bleu-200); }

.sc-frise-contenu { padding: .45rem 0 1.7rem; }
.sc-frise-etape:last-child > .sc-frise-contenu { padding-bottom: 0; }
.sc-frise-titre { font-size: clamp(1rem, 1.3vw, 1.08rem); color: var(--ink); }
.sc-frise-texte { margin-top: .25rem; font-size: .93rem; line-height: 1.55; color: var(--ink-soft); }


.sc-limites {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.4rem;
  margin-top: clamp(2rem, 4vw, 3rem);
  padding: clamp(1.35rem, 3.2vw, 2.1rem);
  background: var(--bleu-50); border: 1px solid var(--bleu-100); border-radius: 22px;
}
@media (min-width: 900px) {
  .sc-limites { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2rem, 4vw, 3.5rem); }
}
.sc-limite-titre { font-size: clamp(1rem, 1.4vw, 1.12rem); color: var(--ink); }
.sc-limite-liste { list-style: none; display: grid; gap: .6rem; margin-top: .75rem; }
.sc-limite-point {
  position: relative; padding-left: 1.15rem;
  font-size: .94rem; line-height: 1.6; color: var(--ink-soft);
}
.sc-limite-point::before {
  content: ""; position: absolute; left: .1rem; top: .66em;
  width: 6px; height: 6px; border-radius: 50%; background: var(--marine);
}
.sc-limite-texte { margin-top: .75rem; font-size: .94rem; line-height: 1.6; color: var(--ink-soft); }


.sc-fin { background: var(--paper); }
.sc-fin-cadre {
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; flex-direction: column; align-items: center; gap: 1rem;
  padding: clamp(2.2rem, 6vw, 4rem) clamp(1.25rem, 5vw, 3rem);
  border-radius: 22px; text-align: center;
  background: linear-gradient(135deg, var(--marine) 55%, var(--marine-2) 100%);
}
.sc-fin-cadre::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(60% 90% at 50% 0%, color-mix(in srgb, var(--bleu-600) 32%, transparent), transparent 70%);
}
.sc-fin-cadre::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image:
    linear-gradient(to right, color-mix(in srgb, var(--paper) 7%, transparent) 1px, transparent 1px),
    linear-gradient(to bottom, color-mix(in srgb, var(--paper) 7%, transparent) 1px, transparent 1px);
  background-size: 32px 32px;
  -webkit-mask-image: radial-gradient(ellipse at 50% 0%, var(--ink) 10%, transparent 70%);
  mask-image: radial-gradient(ellipse at 50% 0%, var(--ink) 10%, transparent 70%);
}
.sc-fin-titre { max-width: 24ch; font-size: clamp(1.55rem, 3.4vw, 2.3rem); color: var(--paper); }
.sc-fin-texte { max-width: 50ch; font-size: clamp(1rem, 1.4vw, 1.08rem); line-height: 1.6; color: var(--sur-sombre); }
.sc-fin-action { margin-top: .6rem; }
.sc-fin-action > .btn-shiny { --fond: var(--bleu-900); --fond-subtil: var(--bleu-800); }


@media (prefers-reduced-motion: reduce) {
  .sc-curseur, .sc-barres::after { animation: none; }
  .sc-barres::after { display: none; }
  .sc-tuile-projecteur { display: none; }
  .sc-tuile, .sc-tuile-ic { transition: none; }
}