/* ============================================================================ PIED DE PAGE PUBLIC ET APPLICATIF — LA SEULE DÉFINITION ============================================================================ ⚠️ Sorti de `footer.php` pour que le BLOG puisse s'en servir : ses articles vivent à `/blog/` et n'incluaient donc ni `header.php` ni `footer.php`, ce qui leur avait donné un troisième pied de page. Le markup est dans `partial_footer_public.php`. ➡️ Ne pas redéfinir ces classes ailleurs. ============================================================================ */ /* ⚠️ CHAQUE `var()` PORTE UN REPLI, et ce n'est pas de la coquetterie. Cette feuille est chargée par des pages qui n'ont PAS `stamova-theme.css` (le blog a son propre ). Sans repli, `color: var(--stm-ink-4)` y est une déclaration INVALIDE : la propriété est ignorée, la couleur est héritée, et l'entrée active du menu cesse de se distinguer des autres — c'est exactement le défaut signalé sur « Blog ». Les valeurs de repli sont celles du thème CLAIR. */ /* ============================================================================ PIED DE PAGE - commun ============================================================================ */ .stm-foot { clear: both; color: var(--stm-ink-4, #475569); font-size: .85rem; } /* Un filet dégradé qui s'éteint sur les bords : une bordure pleine coupe la page en deux, celle-ci la termine. */ .stm-foot::before { content: ""; display: block; height: 1px; background: linear-gradient(90deg, transparent, rgba(15, 23, 42, 0.029) 22%, rgba(15, 23, 42, 0.029) 78%, transparent); } .stm-foot a { color: var(--stm-ink-4, #475569); text-decoration: none; transition: color .15s ease; } .stm-foot a:hover { color: var(--stm-ink-2, #1e293b); } /* ============================================================================ VERSION APPLICATIVE - une ligne, et rien de plus ============================================================================ */ .stm-foot-app { background: transparent; margin-top: 2.5rem; } .stm-foot-line { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; padding: .9rem 1.5rem; font-size: .8rem; } .stm-foot-mark img { height: 17px; width: auto; opacity: .55; display: block; } .stm-foot-copy { color: var(--stm-ink-5, #64748b); } .stm-foot-legal { display: flex; gap: 1rem; flex-wrap: wrap; } .stm-foot-legal a { color: var(--stm-ink-5, #64748b); } .stm-foot-legal a:hover { color: var(--stm-ink-3, #334155); } .stm-foot-help { margin-left: auto; display: inline-flex; align-items: center; gap: .35rem; color: var(--stm-ink-5, #64748b); } .stm-foot-help:hover { color: var(--stm-accent, #4f46e5); } /* ============================================================================ VERSION PUBLIQUE ============================================================================ */ .stm-foot-public { /* Le fond monte depuis la transparence : le pied de page se pose sur la page au lieu d'y être collé. */ background: linear-gradient(180deg, transparent 0%, rgba(255, 255, 255, 0.88) 38%, #ffffff 100%); padding-top: 4rem; } .stm-foot-public::before { margin-bottom: 3.5rem; } .stm-foot-inner { max-width: 1180px; margin: 0 auto; padding: 0 1.5rem 1.5rem; } .stm-foot-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr); gap: 2.5rem; align-items: start; } .stm-foot-logo { height: 24px; width: auto; opacity: .85; margin-bottom: .9rem; display: block; } .stm-foot-tag { color: var(--stm-ink-4, #475569); line-height: 1.6; margin: 0 0 1rem; max-width: 34ch; } .stm-foot-tag strong { color: var(--stm-accent, #4f46e5); font-weight: 600; } .stm-foot-points { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .4rem; } .stm-foot-points li { display: flex; align-items: baseline; gap: .5rem; color: var(--stm-ink-4, #475569); font-size: .82rem; } .stm-foot-points i { color: var(--stm-success, #047857); font-size: .8rem; flex: 0 0 auto; } /* Un libellé de section, pas un titre : petit, espacé, sans soulignement. */ .stm-foot-h { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--stm-ink-5, #64748b); margin: 0 0 .9rem; } .stm-foot-col ul { list-style: none; padding: 0; margin: 0; } .stm-foot-col li { margin-bottom: .5rem; } .stm-foot-col a { font-size: .86rem; } /* Le seul élément appelant du pied de page. Un seul, sinon aucun ne ressort. */ .stm-foot-cta { display: inline-flex; align-items: center; gap: .45rem; padding: .5rem .9rem; margin-bottom: 1.1rem; border: 1px solid var(--stm-line-strong, rgba(15, 23, 42, 0.18)); border-radius: 2rem; color: var(--stm-ink-2, #1e293b) !important; font-size: .84rem; font-weight: 500; transition: border-color .15s ease, background .15s ease; } .stm-foot-cta:hover { border-color: rgba(165,180,252,.55); background: rgba(102,126,234,.12); } .stm-foot-plain li { margin-bottom: .45rem; } .stm-foot-plain a { font-size: .82rem; color: var(--stm-ink-5, #64748b); } .stm-foot-plain a:hover { color: var(--stm-ink-3, #334155); } .stm-foot-bottom { margin-top: 2.5rem; padding-top: 1.1rem; border-top: 1px solid var(--stm-line, rgba(15, 23, 42, 0.112)); font-size: .8rem; color: var(--stm-ink-5, #64748b); } .stm-foot-bottom strong { color: var(--stm-ink-4, #475569); font-weight: 600; } /* ============================================================================ ADAPTATIONS D'ÉCRAN ============================================================================ */ @media (max-width: 767.98px) { .stm-foot-grid { grid-template-columns: 1fr; gap: 2rem; } .stm-foot-tag { max-width: none; } .stm-foot-public { padding-top: 3rem; } .stm-foot-public::before { margin-bottom: 2.5rem; } .stm-foot-line { justify-content: center; text-align: center; gap: .75rem; padding: 1rem; } .stm-foot-help { margin-left: 0; } } @media (prefers-reduced-motion: reduce) { .stm-foot a, .stm-foot-cta { transition: none; } }