/* ========================================================================== FOOTER GLOBAL — ARKEO Diagnostics Inclure via dans . footer.js injecte le HTML et définit openLegal / closeLegal. ========================================================================== */ /* ── En-têtes de colonnes nav ─────────────────────────────────────────────── */ .ftr-col-label { font-size: 0.75rem; font-weight: 500; color: rgba(255, 255, 255, 0.35); margin-bottom: 0.875rem; padding-bottom: 0.625rem; border-bottom: 1px solid rgba(255, 255, 255, 0.08); } /* ── Grille 4 colonnes ────────────────────────────────────────────────────── */ .ftr-grid { display: grid; grid-template-columns: 1fr; gap: 2.5rem; } @media (min-width: 640px) { .ftr-grid { grid-template-columns: repeat(2, 1fr); gap: 2.5rem 3rem; } } @media (min-width: 1024px) { .ftr-grid { grid-template-columns: repeat(4, 1fr); gap: 2rem 3rem; } } /* ── Logo footer ─────────────────────────────────────────────────────────── */ #site-footer .ftr-logo { max-height: 90px; width: auto; } /* ── Liens footer avec animation slide-in ────────────────────────────────── */ .ftr-link { position: relative; padding-left: 0; text-decoration: none; color: rgba(255, 255, 255, 0.62); transition: padding-left 0.3s cubic-bezier(0.4, 0, 0.2, 1), color 0.3s; } .ftr-link::before { content: ''; position: absolute; left: 0; top: 50%; width: 0; height: 1px; background: rgba(255, 255, 255, 0.5); transform: translateY(-50%); transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1); } .ftr-link:hover { color: #fff; padding-left: 14px; } .ftr-link:hover::before { width: 8px; } /* ── Ligne d'accent (haut du footer) ─────────────────────────────────────── */ .ftr-accent-line { height: 1px; background: linear-gradient(90deg, #2c4c3b, rgba(255, 255, 255, 0.08) 50%, transparent); } /* ── Modales légales ──────────────────────────────────────────────────────── */ .legal-modal { display: none; position: fixed; inset: 0; z-index: 100; align-items: center; justify-content: center; padding: 1rem; background: rgba(10, 37, 30, 0); opacity: 0; transition: opacity 0.25s ease, background 0.25s ease; } .legal-modal.legal-visible { display: flex; } .legal-modal.legal-open { opacity: 1; background: rgba(10, 37, 30, 0.55); backdrop-filter: blur(3px); } .legal-panel { background: #fff; border-radius: 1rem; max-width: 720px; width: 100%; max-height: 85vh; overflow-y: auto; box-shadow: 0 25px 80px -20px rgba(10, 37, 30, 0.35); transform: translateY(20px) scale(0.98); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); } .legal-modal.legal-open .legal-panel { transform: translateY(0) scale(1); } .legal-head { position: sticky; top: 0; background: #fff; padding: 1.5rem 2rem 1rem; border-bottom: 1px solid #f3f4f6; display: flex; justify-content: space-between; align-items: center; z-index: 1; } .legal-head h3 { font-family: 'Playfair Display', serif; font-size: 1.5rem; font-weight: 700; color: #0a251e; margin: 0; } .legal-close { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #6b7280; cursor: pointer; flex-shrink: 0; transition: background 0.2s, color 0.2s; border: none; background: none; } .legal-close:hover { background: #f3f4f6; color: #0a251e; } .legal-body { padding: 1.5rem 2rem 2rem; color: #4b5563; font-size: 0.9rem; line-height: 1.7; } .legal-body h4 { color: #0a251e; font-weight: 700; font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.08em; margin-top: 1.5rem; margin-bottom: 0.5rem; } .legal-body h4:first-child { margin-top: 0; } .legal-body p, .legal-body ul { margin-bottom: 0.75rem; } .legal-body ul { padding-left: 1.2rem; list-style: disc; } .legal-body a { color: #2c4c3b; text-decoration: underline; } /* ── Rendu autonome (sans Tailwind) : opacité du texte + espacement liste ── */ #site-footer { background: #0a251e; color: #fff; } #site-footer .text-white\/65 { color: rgba(255, 255, 255, 0.62); } #site-footer .text-white\/85 { color: rgba(255, 255, 255, 0.80); } #site-footer .text-white\/60 { color: rgba(255, 255, 255, 0.55); } #site-footer .text-white\/35 { color: rgba(255, 255, 255, 0.42); } #site-footer .space-y-2\.5 > * + * { margin-top: 0.625rem; }