/* AFDES Civic Academy — Electoral College */
.aca-electoral-module {
    --electoral-blue: #0d6f9f;
    --electoral-selected: #159c91;
    --electoral-selected-hover: #0f7f78;
    --electoral-selected-shadow: rgba(21,156,145,.24);
}

.aca-electoral-module .aca-electoral-ballot-svg,
.aca-electoral-module .aca-electoral-step-svg,
.aca-electoral-module .aca-electoral-note-svg {
    display: block;
    width: 100%;
    height: 100%;
    fill: currentColor;
    stroke: currentColor;
}

.aca-electoral-hero {
    position: relative;
    overflow: hidden;
    padding: 54px 0 72px;
    background: #ffffff;
}

.aca-electoral-hero-grid {
    display: grid;
    grid-template-columns: minmax(0,1.04fr) minmax(390px,.96fr);
    gap: clamp(42px,7vw,94px);
    align-items: center;
}

.aca-electoral-hero h1 {
    margin: 12px 0 18px;
    color: var(--academy-navy);
    font-family: Georgia,"Times New Roman",serif;
    font-size: clamp(2.7rem,6vw,5.2rem);
    letter-spacing: -.05em;
    line-height: .98;
}
.aca-electoral-hero p { max-width: 780px; margin: 0; color: #526879; font-size: 1.1rem; line-height: 1.72; }
.aca-electoral-hero .academy-btn { margin-top: 28px; }

.aca-electoral-hero-map {
    position: relative;
    width: min(100%, 760px);
    aspect-ratio: 850.62 / 538.58;
    min-height: 0;
    display: grid;
    place-items: center;
}
.aca-electoral-us {
    position: absolute;
    left: 0;
    top: 7%;
    width: 91%;
    max-width: 100%;
    height: auto;
    opacity: .72;
    filter: drop-shadow(0 16px 30px rgba(15,23,42,.07));
}
.aca-electoral-270 { position: absolute; right: 0; top: 7%; display: grid; width: 150px; height: 150px; place-items: center; align-content: center; border: 1px solid rgba(13,111,159,.25); border-radius: 50%; background: rgba(255,255,255,.96); box-shadow: 0 18px 46px rgba(15,23,42,.08); text-align: center; }
.aca-electoral-270 strong { color: var(--academy-navy); font-family: Georgia,"Times New Roman",serif; font-size: 3.4rem; line-height: .95; }
.aca-electoral-270 small { max-width: 92px; margin-top: 7px; color: #64788a; font-size: .65rem; font-weight: 850; text-transform: uppercase; }
.aca-electoral-ballot { position: absolute; right: 7%; bottom: 7%; width: 78px; height: 78px; color: var(--academy-navy); opacity: .92; }


.aca-electoral-process { padding-top: 42px; padding-bottom: 64px; }
.aca-electoral-rail { display: grid; grid-template-columns: repeat(5,1fr); gap: 0; margin-top: 30px; border-top: 1px solid var(--academy-border); border-bottom: 1px solid var(--academy-border); }
.aca-electoral-step { position: relative; display: grid; min-width: 0; min-height: 150px; justify-items: center; align-content: center; gap: 7px; border: 0; border-right: 1px solid var(--academy-border); background: transparent; color: #8493a0; cursor: pointer; font: inherit; text-align: center; transition: .2s ease; }
.aca-electoral-step:last-child { border-right: 0; }
.aca-electoral-step:hover { background: #fbfdfe; color: var(--electoral-blue); }
.aca-electoral-step.is-active { background: rgba(13,111,159,.055); color: var(--electoral-blue); }
.aca-electoral-step-icon { width: 44px; height: 44px; }
.aca-electoral-step-number { position: absolute; top: 12px; left: 12px; color: #9aa9b5; font-size: .62rem; font-weight: 900; letter-spacing: .08em; }
.aca-electoral-step b { max-width: 145px; color: var(--academy-navy); font-family: Georgia,"Times New Roman",serif; font-size: .82rem; line-height: 1.18; }
.aca-electoral-process-copy { min-height: 172px; padding: 30px 2px 0; }
.aca-electoral-process-copy article { animation: acaElectoralIn .25s ease both; }
@keyframes acaElectoralIn { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }
.aca-electoral-process-copy h3 { margin: 7px 0 10px; color: var(--academy-navy); font-family: Georgia,"Times New Roman",serif; font-size: clamp(1.8rem,3vw,2.6rem); }
.aca-electoral-process-copy p { max-width: 900px; margin: 0; color: #5b6f80; line-height: 1.72; }

.aca-electoral-builder { border-top: 1px solid var(--academy-border); padding-top: 62px; padding-bottom: 68px; }
.aca-electoral-builder-heading { display: grid; grid-template-columns: minmax(0,1fr) 260px; gap: 46px; align-items: end; }
.aca-electoral-builder-heading h2 { margin: 7px 0 10px; color: var(--academy-navy); font-family: Georgia,"Times New Roman",serif; font-size: clamp(2rem,3.6vw,3rem); }
.aca-electoral-builder-heading p { max-width: 840px; margin: 0; color: #607283; line-height: 1.7; }
.aca-electoral-score { display: grid; justify-items: end; text-align: right; }
.aca-electoral-score small { color: #7c8d9c; font-size: .65rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.aca-electoral-score strong { margin-top: 4px; color: var(--academy-navy); font-family: Georgia,"Times New Roman",serif; font-size: 2.8rem; }
.aca-electoral-score em { color: #8a9aa7; font-family: inherit; font-size: 1rem; font-style: normal; }
.aca-electoral-score > span { color: #748696; font-size: .76rem; }
.aca-electoral-score.is-majority strong,
.aca-electoral-score.is-majority > span { color: #237e5b; }

.aca-electoral-meter { position: relative; height: 8px; margin: 26px 0 22px; overflow: hidden; border-radius: 999px; background: #e6edf2; }
.aca-electoral-meter span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--electoral-blue),#42acd0); transition: width .25s ease; }
.aca-electoral-meter i { position: absolute; left: 50.19%; top: -5px; width: 2px; height: 18px; background: var(--electoral-selected); }

.aca-electoral-map-wrap { margin-top: 28px; }
.aca-electoral-map-scroll { width: 100%; max-width: 100%; overflow: visible; }
.aca-electoral-map-stage {
    position: relative;
    width: 100%;
    max-width: 1040px;
    min-width: 0;
    margin: 0 auto;
    padding: 8px 0 2px;
}
.aca-electoral-interactive-svg {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    overflow: visible;
    touch-action: manipulation;
}
.aca-electoral-interactive-svg .electoral-state {
    fill: #dce5eb;
    stroke: #fff;
    stroke-width: 1.35px;
    vector-effect: non-scaling-stroke;
    cursor: pointer;
    transition: fill .16s ease, filter .16s ease, opacity .16s ease;
    outline: none;
}
.aca-electoral-interactive-svg .electoral-state:hover,
.aca-electoral-interactive-svg .electoral-state.is-hovered {
    fill: #b9d6e2;
    filter: drop-shadow(0 3px 4px rgba(13,111,159,.18));
}
.aca-electoral-interactive-svg .electoral-state.is-selected {
    fill: var(--electoral-selected);
    filter: drop-shadow(0 3px 5px var(--electoral-selected-shadow));
}
.aca-electoral-interactive-svg .electoral-state.is-selected:hover,
.aca-electoral-interactive-svg .electoral-state.is-selected.is-hovered {
    fill: var(--electoral-selected-hover);
}
.aca-electoral-interactive-svg .electoral-state:focus-visible {
    stroke: var(--academy-navy);
    stroke-width: 3px;
}
.aca-electoral-interactive-svg #DC.electoral-state {
    stroke: var(--academy-navy);
    stroke-width: 2.6px;
}
.aca-electoral-map-tooltip {
    position: absolute;
    z-index: 4;
    display: grid;
    min-width: 150px;
    gap: 2px;
    padding: 10px 12px;
    border: 1px solid rgba(11,36,55,.10);
    border-radius: 10px;
    background: rgba(255,255,255,.98);
    box-shadow: 0 14px 30px rgba(15,23,42,.12);
    pointer-events: none;
    transform: translate(-50%, calc(-100% - 12px));
}
.aca-electoral-map-tooltip[hidden] { display: none; }
.aca-electoral-map-tooltip strong { color: var(--academy-navy); font-family: Georgia,"Times New Roman",serif; font-size: .88rem; }
.aca-electoral-map-tooltip span { color: #64788a; font-size: .72rem; }
.aca-electoral-map-tooltip b { color: var(--electoral-blue); font-size: .8rem; }
.aca-electoral-map-key {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 22px;
    align-items: center;
    justify-content: center;
    margin-top: 18px;
    color: #6e8191;
    font-size: .72rem;
}
.aca-electoral-map-key span { display: inline-flex; gap: 7px; align-items: center; }
.aca-electoral-map-key i { width: 12px; height: 12px; border-radius: 3px; border: 1px solid rgba(11,36,55,.08); background: #dce5eb; }
.aca-electoral-map-key i.is-selected { background: var(--electoral-selected); }
.aca-electoral-map-instruction { color: #8a99a6; }
.aca-electoral-map-error { margin: 34px 0; color: #8a5960; text-align: center; }


.aca-electoral-builder-controls { display: flex; gap: 26px; align-items: center; margin-top: 22px; }
.aca-electoral-builder-controls p { max-width: 850px; margin: 0; color: #6a7d8d; font-size: .82rem; line-height: 1.6; }
.aca-electoral-note { display: grid; grid-template-columns: 60px 1fr; gap: 24px; border-top: 1px solid var(--academy-border); padding-top: 60px; padding-bottom: 64px; }
.aca-electoral-note-icon { width: 50px; height: 50px; color: var(--electoral-blue); }
.aca-electoral-note h2 { margin: 7px 0 12px; color: var(--academy-navy); font-family: Georgia,"Times New Roman",serif; font-size: clamp(1.9rem,3.3vw,2.8rem); }
.aca-electoral-note p { max-width: 900px; margin: 0; color: #607283; line-height: 1.72; }

@media (max-width: 1100px) {
    .aca-electoral-hero-grid { grid-template-columns: 1fr; }
    .aca-electoral-hero-map { max-width: 760px; width: 100%; }
}
@media (max-width: 760px) {
    .aca-electoral-hero { padding: 42px 0 54px; }
    .aca-electoral-hero-map { width: 100%; }
    .aca-electoral-270 { width: clamp(92px, 24vw, 118px); height: clamp(92px, 24vw, 118px); }
    .aca-electoral-270 strong { font-size: 2.7rem; }
    .aca-electoral-rail { grid-template-columns: 1fr; border-bottom: 0; }
    .aca-electoral-step { min-height: 88px; grid-template-columns: 46px 1fr; justify-items: start; align-content: center; text-align: left; padding: 12px 42px 12px 14px; border-right: 0; border-bottom: 1px solid var(--academy-border); }
    .aca-electoral-step-icon { grid-row: 1 / 3; }
    .aca-electoral-step b { max-width: none; }
    .aca-electoral-step-number { left: auto; right: 14px; top: 50%; transform: translateY(-50%); }
    .aca-electoral-builder-heading { grid-template-columns: 1fr; gap: 22px; }
    .aca-electoral-score { justify-items: start; text-align: left; }
    .aca-electoral-builder-controls { align-items: flex-start; flex-direction: column; }
    .aca-electoral-note { grid-template-columns: 44px 1fr; }
}
@media (max-width: 640px) {
    .aca-electoral-hero-grid { gap: 30px; }
    .aca-electoral-hero-map { aspect-ratio: 850.62 / 538.58; }
    .aca-electoral-us { width: 94%; top: 5%; }
    .aca-electoral-270 { right: 1%; top: 2%; }
    .aca-electoral-270 strong { font-size: clamp(2.05rem, 10vw, 2.7rem); }
    .aca-electoral-270 small { max-width: 76px; font-size: .58rem; }
    .aca-electoral-ballot { right: 5%; bottom: 4%; width: clamp(48px, 14vw, 68px); height: clamp(48px, 14vw, 68px); }

    .aca-electoral-map-scroll {
        width: 100%;
        max-width: 100%;
        overflow: visible;
        padding-bottom: 0;
    }
    .aca-electoral-map-stage {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }
    .aca-electoral-interactive-svg {
        width: 100%;
        max-width: 100%;
        height: auto;
    }
    .aca-electoral-interactive-svg .electoral-state { stroke-width: 1px; }
    .aca-electoral-interactive-svg #DC.electoral-state { stroke-width: 2px; }
    .aca-electoral-map-tooltip { min-width: 132px; padding: 8px 10px; }
    .aca-electoral-map-key { justify-content: flex-start; }
    .aca-electoral-map-instruction { flex-basis: 100%; }
}

@media (max-width: 420px) {
    .aca-electoral-map-wrap { margin-top: 20px; }
    .aca-electoral-map-key { gap: 9px 16px; font-size: .68rem; }
    .aca-electoral-map-tooltip { min-width: 120px; }
}