/* SoyGrowth · CSS accessibility commun (a11y) Inclure via dans le de chaque page */ /* ─── Skip to content link (visible UNIQUEMENT au focus clavier) ─── */ .skip-to-content { position: absolute; top: -100px; left: 16px; z-index: 9999; padding: 14px 24px; background: var(--gold, #F0B429); color: var(--bg, #07070F); font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: 14px; text-decoration: none; border-radius: var(--radius, 16px); box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5); transition: top 0.2s ease-out; } .skip-to-content:focus, .skip-to-content:focus-visible { top: 16px; outline: 3px solid var(--gold-light, #FFD166); outline-offset: 2px; } /* ─── Focus visible global · ring gold sur navigation clavier ─── */ *:focus { outline: none; } a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible { outline: 3px solid var(--gold, #F0B429); outline-offset: 3px; border-radius: 4px; } /* Variation : focus visible sur les CTAs principaux (ring gold + glow) */ .hero-cta:focus-visible, .join-cta-pill:focus-visible, .cta-btn:focus-visible, .pricing-cta:focus-visible, .premium-cta:focus-visible, .application-submit:focus-visible { outline: 3px solid var(--gold-light, #FFD166); outline-offset: 4px; box-shadow: 0 0 0 6px rgba(240, 180, 41, 0.18); } /* Inputs focus · ring discret */ .form-input:focus-visible { outline: 2px solid var(--gold, #F0B429); outline-offset: 1px; } /* ─── Visually hidden · label invisible pour screen readers ─── */ .visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } /* Show visually-hidden on focus (skip nav pattern) */ .visually-hidden:focus, .visually-hidden:focus-within { position: static !important; width: auto !important; height: auto !important; margin: 0 !important; overflow: visible !important; clip: auto !important; white-space: normal !important; }