:host { display:block; }
.header { background-color:#ffffff; padding:16px 60px; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid #e5e5e5; box-shadow:0 2px 8px rgba(0,0,0,0.04); transition:all .3s ease; position:fixed; top:0; left:0; right:0; z-index:1000; }
.header.scrolled { padding:10px 60px; box-shadow:0 4px 16px rgba(0,0,0,0.08); }
.logo-section { display:flex; align-items:center; gap:48px; }
.vote-logo { width:15em; }
.election-badge { display:flex; align-items:center; gap:16px; padding:12px 24px; background:linear-gradient(135deg,#e31e24 0%,#b71c1c 100%); border-radius:8px; box-shadow:0 4px 12px rgba(227,30,36,0.2); transition:transform .2s ease; }
.ballot-icon { font-size:28px; filter:drop-shadow(0 2px 4px rgba(0,0,0,0.1)); }
.election-info { color:#fff; }
.election-title { font-size:10px; font-weight:600; letter-spacing:.5px; text-transform:uppercase; line-height:1.3; opacity:.95; }
.graduados-title { font-size:36px; font-weight:300; color:#e31e24; letter-spacing:-.5px; }
.fesc-logo { height:70px; }
.titulo-evento { font-size:1.5rem; font-weight:700; color:#c40000; text-align:center; margin:0; }
.subtitulo-evento { font-size:.9rem; color:#555; margin:0; }
.countdown { display:flex; justify-content:center; gap:10px; }
.time-box { background-color:#b81817; font-weight:bolder; color:#fff; text-align:center; border-radius:8px; box-shadow:0 4px 8px rgba(0,0,0,0.1); padding:2px; width:2.2em; }
@media(max-width:768px){ .header{flex-direction:column; gap:24px; padding:20px;} .logo-section{flex-direction:column; gap:20px;} }