/* =========================================== BANDEAU EBOOK SAVADOU À inclure dans le ou fichier CSS principal =========================================== */ /* Bandeau fixe en haut */ .ebook-banner { position: fixed; top: 0; left: 0; width: 100%; background: linear-gradient(135deg, #1a5276 0%, #2980b9 100%); color: #ffffff; padding: 12px 20px; display: flex; justify-content: center; align-items: center; gap: 15px; z-index: 99999; box-shadow: 0 2px 10px rgba(0,0,0,0.2); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif; transform: translateY(-100%); transition: transform 0.4s ease-out; } .ebook-banner.visible { transform: translateY(0); } /* Icône livre */ .ebook-banner-icon { font-size: 24px; flex-shrink: 0; } /* Texte principal */ .ebook-banner-text { font-size: 14px; line-height: 1.4; } .ebook-banner-text strong { color: #f39c12; } /* Bouton CTA */ .ebook-banner-cta { background-color: #e67e22; color: #ffffff; padding: 8px 20px; border-radius: 5px; text-decoration: none; font-weight: 600; font-size: 14px; white-space: nowrap; transition: background-color 0.2s ease, transform 0.2s ease; flex-shrink: 0; } .ebook-banner-cta:hover { background-color: #d35400; transform: scale(1.05); color: #ffffff; text-decoration: none; } /* Bouton fermer */ .ebook-banner-close { background: none; border: none; color: #ffffff; font-size: 20px; cursor: pointer; padding: 5px 10px; opacity: 0.7; transition: opacity 0.2s ease; flex-shrink: 0; } .ebook-banner-close:hover { opacity: 1; } /* Décaler le contenu du site quand bandeau visible */ body.has-ebook-banner { padding-top: 60px; } /* Si header fixe existant, le décaler aussi */ body.has-ebook-banner .site-header, body.has-ebook-banner header, body.has-ebook-banner #masthead, body.has-ebook-banner .navbar-fixed-top { top: 50px !important; } /* =========================================== RESPONSIVE =========================================== */ @media (max-width: 768px) { .ebook-banner { flex-wrap: wrap; padding: 10px 15px; gap: 10px; } .ebook-banner-icon { display: none; } .ebook-banner-text { font-size: 13px; text-align: center; flex: 1 1 100%; order: 1; } .ebook-banner-cta { font-size: 13px; padding: 8px 15px; order: 2; } .ebook-banner-close { position: absolute; top: 5px; right: 5px; order: 3; } body.has-ebook-banner { padding-top: 80px; } } @media (max-width: 480px) { .ebook-banner-text { font-size: 12px; } .ebook-banner-text br { display: none; } } /* =========================================== ANIMATION OPTIONNELLE - Pulse sur le CTA =========================================== */ @keyframes pulse-cta { 0% { box-shadow: 0 0 0 0 rgba(230, 126, 34, 0.7); } 70% { box-shadow: 0 0 0 10px rgba(230, 126, 34, 0); } 100% { box-shadow: 0 0 0 0 rgba(230, 126, 34, 0); } } .ebook-banner-cta { animation: pulse-cta 2s infinite; } .ebook-banner-cta:hover { animation: none; }