/* COOKIE BANNER — styling that matches the SSEC dark/gold palette. Include as: in or copy into main style.css. */ .ssec-consent { position: fixed; left: 20px; right: 20px; bottom: 20px; z-index: 9999; max-width: 720px; margin: 0 auto; padding: 20px 24px; border: 1px solid rgba(236, 232, 220, 0.28); border-radius: 20px; background: #1a1a16; color: #ece8dc; font-family: "IBM Plex Sans", "Segoe UI", sans-serif; font-size: 15px; line-height: 1.55; box-shadow: 0 8px 40px rgba(0, 0, 0, 0.5); transform: translateY(10px); opacity: 0; transition: transform 250ms cubic-bezier(0.22, 1, 0.36, 1), opacity 250ms cubic-bezier(0.22, 1, 0.36, 1); } .ssec-consent[aria-hidden="false"] { transform: translateY(0); opacity: 1; } .ssec-consent__inner { display: flex; flex-direction: column; gap: 16px; } .ssec-consent__title { font-family: "Sora", "Segoe UI", sans-serif; font-weight: 700; font-size: 1.02rem; margin: 0 0 6px; } .ssec-consent__desc { margin: 0; color: #b7b2a0; font-size: 0.9rem; } .ssec-consent__desc a { color: #cd9c50; text-decoration: underline; text-underline-offset: 3px; } .ssec-consent__actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; } .ssec-consent__btn { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 10px 20px; border-radius: 999px; font-family: inherit; font-size: 0.88rem; font-weight: 600; cursor: pointer; border: 1px solid transparent; transition: background 150ms cubic-bezier(0.22, 1, 0.36, 1), transform 150ms cubic-bezier(0.22, 1, 0.36, 1); } .ssec-consent__btn:hover { transform: translateY(-1px); } .ssec-consent__btn:active { transform: translateY(0); } .ssec-consent__btn--secondary { background: transparent; color: #ece8dc; border-color: rgba(236, 232, 220, 0.28); } .ssec-consent__btn--secondary:hover { border-color: rgba(236, 232, 220, 0.5); background: rgba(236, 232, 220, 0.04); } .ssec-consent__btn--primary { background: #cd9c50; color: #1a1a16; } .ssec-consent__btn--primary:hover { background: #e3b46b; } @media (min-width: 640px) { .ssec-consent__inner { flex-direction: row; align-items: center; justify-content: space-between; } .ssec-consent__actions { flex-shrink: 0; } } @media (prefers-reduced-motion: reduce) { .ssec-consent { transition: none; } .ssec-consent__btn { transition: none; } }