/* ==========================================================================
   MutuCash — Page de choix MutuCash / SécuCash (portail.html, 09/11/2026)
   --------------------------------------------------------------------------
   Copie identique à la racine (source) et dans web/public/ (servi).
   Couleurs : jetons --mc-* de tokens.css uniquement (thème sombre inclus).
   ========================================================================== */

@keyframes mcFadeUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

.nav-lnk { color: var(--mc-texte-2); }
.nav-lnk:hover { color: var(--mc-sapin); }

.ptl-carte { transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.ptl-carte:hover { transform: translateY(-3px); box-shadow: var(--mc-ombre-carte); border-color: var(--mc-bordure-verte); }
.ptl-carte:hover .ptl-cta { background: var(--mc-sapin-fonce); }
.ptl-carte:hover .ptl-cta--contour { background: var(--mc-survol-sapin); }

/* Coche verte devant chaque point, sans image. */
.ptl-coche { position: relative; padding-left: 26px; }
.ptl-coche::before {
  content: ""; position: absolute; left: 0; top: 2px; width: 17px; height: 17px; border-radius: 50%;
  background: var(--mc-vert);
}
.ptl-coche::after {
  content: ""; position: absolute; left: 5px; top: 6px; width: 7px; height: 4px;
  border-left: 2px solid #FAF6EE; border-bottom: 2px solid #FAF6EE; transform: rotate(-45deg);
}

@media (max-width: 900px) {
  .ptl-grid { grid-template-columns: 1fr !important; }
  .ptl-methode { grid-template-columns: 1fr !important; }
}
@media (max-width: 760px) {
  .ptl-h1 { font-size: 38px !important; letter-spacing: -0.8px !important; }
  .ptl-carte { padding: 24px !important; }
}