/* Karsten for Council — static build */
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html,body{overflow-x:hidden;max-width:100%}
body{margin:0;background:#fff;color:#111;font-family:"Libre Franklin",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;text-wrap:pretty}
img,svg,video{max-width:100%}
input,textarea,select,button{font:inherit;color:inherit;max-width:100%}
a{color:#C6000D;text-decoration-thickness:1.5px;text-underline-offset:3px}
a:hover{color:#111}

/* conditional regions — transparent to layout when shown */
[data-if]{display:none}
[data-if][data-on]{display:contents}

/* header nav */
.navlink{display:inline-flex;align-items:center;min-height:44px;padding-bottom:2px;text-decoration:none;color:#111;border-bottom:2px solid transparent}
.navlink:hover{color:#C6000D}
.navlink[data-on]{color:#C6000D;border-bottom-color:#C6000D}
.panellink{display:flex;align-items:center;min-height:54px;padding:0 clamp(16px,4.2vw,22px);border-bottom:1px solid #E6E2DD;border-left:5px solid transparent;font-family:Oswald,"Arial Narrow",sans-serif;font-weight:600;font-size:17px;letter-spacing:.09em;color:#111;background:#fff;text-decoration:none}
.panellink:hover{color:#C6000D}
.panellink[data-on]{color:#C6000D;border-left-color:#C6000D}

/* volunteer role chips */
.role{padding:12px 16px;border:2px solid #111;background:#fff;color:#111;font-family:Oswald,"Arial Narrow",sans-serif;font-weight:500;font-size:14px;letter-spacing:.06em;cursor:pointer}
.role[data-on]{background:#111;color:#fff}

/* hero media */
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.hero-img--home{object-position:62% 50%}
.ov{position:absolute;inset:0}
.ov--home{background:linear-gradient(95deg,rgba(8,8,8,.9) 0%,rgba(8,8,8,.76) 26%,rgba(8,8,8,.42) 45%,rgba(8,8,8,.08) 60%,rgba(8,8,8,0) 72%)}
.ov--about{background:linear-gradient(92deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.92) 26%,rgba(255,255,255,.62) 44%,rgba(255,255,255,.12) 62%,rgba(255,255,255,0) 74%)}
.ov--platform{background:linear-gradient(94deg,rgba(255,255,255,.86) 0%,rgba(255,255,255,.7) 28%,rgba(255,255,255,.28) 50%,rgba(255,255,255,0) 70%)}
@media (max-width:767px){
  .hero-img--home{object-position:68% 38%}
  .ov--home{background:linear-gradient(180deg,rgba(8,8,8,.84) 0%,rgba(8,8,8,.6) 46%,rgba(8,8,8,.8) 100%)}
  .ov--about{background:linear-gradient(180deg,rgba(255,255,255,.93) 0%,rgba(255,255,255,.8) 52%,rgba(255,255,255,.5) 100%)}
  .ov--platform{background:linear-gradient(0deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.84) 48%,rgba(255,255,255,.4) 100%)}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* skip link + keyboard focus */
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:#111;color:#fff;padding:12px 18px;font-family:Oswald,"Arial Narrow",sans-serif;font-weight:600;letter-spacing:.08em;text-decoration:none}
.skip:focus{left:8px;top:8px}
main:focus{outline:none}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,.role:focus-visible,.navlink:focus-visible,.panellink:focus-visible,[data-menu]:focus-visible{outline:3px solid #C6000D;outline-offset:2px}

/* hover states lifted from the design */
.hv1:hover{background:#111111 !important}
.hv2:hover{background:#111111 !important}
.hv3:hover{background:#111111 !important;color:#FFFFFF !important}
.hv4:hover{background:#FFFFFF !important;color:#C6000D !important}
.hv5:hover{background:#FFFFFF !important;color:#111111 !important}
.hv6:hover{background:#000000 !important}
.hv7:hover{color:#C6000D !important;background:#F4F3F1 !important}
.hv8:hover{color:#C6000D !important;background:#F4F3F1 !important}
.hv9:hover{color:#C6000D !important;background:#F4F3F1 !important}
.hv10:hover{color:#C6000D !important;background:#F4F3F1 !important}
.hv11:hover{color:#C6000D !important;background:#F4F3F1 !important}
.hv12:hover{color:#C6000D !important;background:#F4F3F1 !important}
.hv13:hover{color:#C6000D !important;background:#F4F3F1 !important}
.hv14:hover{color:#C6000D !important;background:#F4F3F1 !important}
.hv15:hover{background:#F4F3F1 !important;color:#C6000D !important}
.hv16:hover{background:#F4F3F1 !important;color:#C6000D !important}
.hv17:hover{background:#F4F3F1 !important;color:#C6000D !important}
.hv18:hover{background:#F4F3F1 !important;color:#C6000D !important}
.hv19:hover{background:#F4F3F1 !important;color:#C6000D !important}
.hv20:hover{background:#F4F3F1 !important;color:#C6000D !important}
.hv21:hover{background:#F4F3F1 !important;color:#C6000D !important}
.hv22:hover{background:#F4F3F1 !important;color:#C6000D !important}
.hv23:hover{background:#F4F3F1 !important;color:#C6000D !important}
.hv24:hover{background:#F4F3F1 !important;color:#C6000D !important}
.hv25:hover{background:#F4F3F1 !important;color:#C6000D !important}
.hv26:hover{background:#F4F3F1 !important;color:#C6000D !important}
.hv27:hover{background:#F4F3F1 !important;color:#C6000D !important}
.hv28:hover{background:#F4F3F1 !important;color:#C6000D !important}
.hv29:hover{color:#111111 !important;border-color:#111111 !important}
.hv30:hover{background:#111111 !important;color:#FFFFFF !important}
.hv31:hover{background:#FFFFFF !important;color:#C6000D !important}
.hv32:hover{background:#FFFFFF !important;color:#111111 !important}
.hv33:hover{background:#C6000D !important}
.hv34:hover{background:#111111 !important;color:#FFFFFF !important}
.hv35:hover{background:#111111 !important;color:#FFFFFF !important}
.hv36:hover{background:#111111 !important;color:#FFFFFF !important}
.hv37:hover{background:#111111 !important}
.hv38:hover{background:#C6000D !important;border-color:#C6000D !important;color:#FFFFFF !important}
.hv39:hover{background:#C6000D !important;border-color:#C6000D !important;color:#FFFFFF !important}
.hv40:hover{background:#C6000D !important;border-color:#C6000D !important;color:#FFFFFF !important}
.hv41:hover{background:#C6000D !important;border-color:#C6000D !important;color:#FFFFFF !important}
.hv42:hover{background:#FFFFFF !important;color:#111111 !important}
.hv43:hover{color:#C6000D !important}
.hv44:hover{color:#C6000D !important}
.hv45:hover{color:#C6000D !important}
.hv46:hover{color:#C6000D !important}
.hv47:hover{color:#C6000D !important}
.hv48:hover{color:#C6000D !important}
.hv49:hover{background:#C6000D !important;border-color:#C6000D !important}
.hv50:hover{background:#C6000D !important;border-color:#C6000D !important}
.hv51:hover{background:#C6000D !important;border-color:#C6000D !important}
.hv52:hover{background:#C6000D !important;border-color:#C6000D !important}

/* media page */
.kr-dl:hover{background:#111;color:#fff}
.kr-copy:hover{background:#111!important;color:#fff!important}
.kr-copy[data-done]{background:#C6000D!important;border-color:#C6000D!important;color:#fff!important}
.kr-soc:hover{border-color:#fff!important;background:#1A1A1A;color:#fff}
#media .hv34,#media .hv35,#media .hv36{}
.kr-redbar:hover{background:#A3000B!important}
.kr-planbox:hover,.kr-planbox:focus-within{background:#FFFFFF!important;color:#C6000D!important}
