/*
 * Armadillo World: Resources hub.
 * Poster-style black page. One front door: who are you, what's going on, then the programs, deadlines and guides for that need.
 * Brand colors: Outlaw Black, Aqua Dulce, Yellow Rose, Red Headed Stranger, Rolling Paper White, Nine Banded Grey.
 */
@font-face{font-family:'antarctican-mono';font-style:normal;font-weight:500;font-display:swap;src:url(antarctican-mono-500.woff2) format('woff2')}
@font-face{font-family:'antarctican-mono';font-style:normal;font-weight:700;font-display:swap;src:url(antarctican-mono-700.woff2) format('woff2')}

#hub{
  --black:#000000; --aqua:#9BFFF5; --yellow:#FFF200; --red:#FF3300; --white:#FFFFFF; --grey:#939598;
  --panel:#0B0B0B; --panel-2:#141414; --line:#262626;
  --display:'manicotti',Georgia,'Times New Roman',serif;
  --head:'americane-black','americane-regular',Impact,'Arial Narrow',sans-serif;
  --head-2:'americane-regular',Impact,'Arial Narrow',sans-serif;
  --script:'bello-script',Georgia,serif;
  --mono:'antarctican-mono','Courier Prime','Courier New',monospace;
  background:var(--black); color:var(--white); font-family:var(--mono); font-size:15px; line-height:1.6;
  padding:150px 0 90px; min-height:100vh; color-scheme:dark;
}
@media (max-width:980px){#hub{padding-top:128px}}
#hub *,#hub *::before,#hub *::after{box-sizing:border-box}
#hub p{padding:0;margin:0 0 .9em}
#hub h1,#hub h2,#hub h3,#hub h4{color:inherit;padding:0;margin:0;font-weight:400;line-height:1.1}
#hub a{color:var(--aqua);text-decoration:none}
#hub a:hover{text-decoration:underline}
#hub button{font:inherit;color:inherit}
#hub :focus-visible{outline:2px solid var(--yellow);outline-offset:3px}
#hub .hb-wrap{max-width:1180px;margin:0 auto;padding-inline:20px}
#hub .hb-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* headline lockup, same pattern as the rest of the site: script lead-in over a big display word */
#hub .hb-lockup{text-align:center;margin:0 auto 22px}
#hub .hb-lead{display:block;font-family:var(--script);color:var(--red);font-size:clamp(30px,4.4vw,48px);line-height:1}
#hub .hb-word{display:block;font-family:var(--display);color:var(--aqua);font-size:clamp(46px,9.5vw,112px);line-height:.95;letter-spacing:.02em;text-transform:uppercase;text-wrap:balance}
#hub .hb-sub{max-width:62ch;margin:0 auto;text-align:center;color:#d8d8d8;font-size:15.5px}
#hub .hb-sub b{color:var(--yellow);font-weight:700}


/* steps */
#hub .hb-step{margin-top:46px}
#hub .hb-label{font-family:var(--head);color:var(--yellow);letter-spacing:.14em;text-transform:uppercase;font-size:20px;margin-bottom:14px;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
#hub .hb-label small{font-family:var(--mono);color:var(--grey);letter-spacing:.02em;text-transform:none;font-size:13px}

/* chips */
#hub .hb-chips{display:flex;flex-wrap:wrap;gap:8px}
#hub .hb-chip{background:transparent;border:1px solid #3d3d3d;color:var(--white);padding:9px 14px;cursor:pointer;font-family:var(--mono);font-size:14px;line-height:1.3;text-align:left}
#hub .hb-chip small{display:block;color:var(--grey);font-size:12px}
#hub .hb-chip:hover{border-color:var(--aqua)}
#hub .hb-chip[aria-pressed="true"]{background:var(--aqua);border-color:var(--aqua);color:#000}
#hub .hb-chip[aria-pressed="true"] small{color:#1b4c48}
#hub .hb-chip.is-toggle[aria-pressed="true"]{background:var(--yellow);border-color:var(--yellow)}

/* need tiles */
#hub .hb-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:2px;background:var(--line);border:2px solid var(--line)}
#hub .hb-tile{display:flex;flex-direction:column;gap:6px;background:var(--panel);padding:18px 18px 16px;color:var(--white);border-top:3px solid transparent;min-height:168px}
#hub .hb-tile:hover{background:var(--panel-2);border-top-color:var(--yellow);text-decoration:none}
#hub .hb-tile .w{font-family:var(--head);font-size:27px;letter-spacing:.06em;text-transform:uppercase;color:var(--aqua);line-height:1.05}
#hub .hb-tile .a{color:#cfcfcf;font-size:13.5px;line-height:1.45}
#hub .hb-tile .f{margin-top:auto;font-size:12.5px;color:var(--grey);font-variant-numeric:tabular-nums}
#hub .hb-tile .f b{color:var(--yellow);font-weight:500}
#hub .hb-tile.is-crisis{border-left:3px solid var(--red)}
#hub .hb-tile.is-crisis .w{color:var(--red)}

/* upcoming strip */
#hub .hb-soon{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:2px;background:var(--line);border:2px solid var(--line)}
#hub .hb-soon .d{background:var(--panel);padding:14px 16px;display:grid;grid-template-columns:58px minmax(0,1fr);gap:12px;align-items:start}

/* date block */
#hub .hb-date{display:flex;flex-direction:column;align-items:center;border:1px solid var(--yellow);padding:4px 0 6px;line-height:1;font-variant-numeric:tabular-nums}
#hub .hb-date .m{font-family:var(--head);color:var(--yellow);letter-spacing:.12em;font-size:13px}
#hub .hb-date .n{font-family:var(--head);font-size:26px;margin-top:3px}
#hub .hb-dl .t{font-weight:700;line-height:1.3;font-size:14px}
#hub .hb-dl .o{color:var(--grey);font-size:12.5px;line-height:1.35}
#hub .hb-dl .l{color:var(--yellow);font-size:12.5px;line-height:1.35}
#hub .hb-dl .w{color:var(--grey);font-size:12px}

/* guides shelf */
#hub .hb-guides{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:2px;background:var(--line);border:2px solid var(--line)}
#hub .hb-guide{background:var(--panel);padding:18px;display:flex;flex-direction:column;gap:8px;color:var(--white);min-height:150px}
#hub a.hb-guide:hover{background:var(--panel-2);text-decoration:none}
#hub .hb-guide .k{font-family:var(--head);color:var(--yellow);letter-spacing:.14em;font-size:13px;text-transform:uppercase}
#hub .hb-guide .t{font-family:var(--head);font-size:23px;letter-spacing:.04em;text-transform:uppercase;color:var(--aqua);line-height:1.1}
#hub .hb-guide .s{color:#cfcfcf;font-size:13.5px;line-height:1.45}
#hub .hb-guide.is-soon .t{color:var(--white)}
#hub .hb-guide.is-soon .k{color:var(--grey)}

/* search */
#hub .hb-search{display:flex;gap:8px;max-width:640px}
#hub .hb-search input{flex:1;min-width:0;background:#0b0b0b;border:1px solid #3d3d3d;color:var(--white);font:inherit;padding:11px 14px}
#hub .hb-search input::placeholder{color:#7d7f82}
#hub .hb-search input:focus{border-color:var(--aqua);outline:none}

/* need page */
#hub .hb-back{display:inline-block;margin-bottom:18px;font-size:14px}
#hub .hb-intro{max-width:70ch;margin:0 auto 6px;text-align:center;color:#d8d8d8}
#hub .hb-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:36px;align-items:start;margin-top:34px}
@media (max-width:980px){#hub .hb-layout{grid-template-columns:minmax(0,1fr)}}
#hub .hb-ask{border:1px solid var(--line);background:var(--panel);padding:18px 18px 8px}
#hub .hb-ask fieldset{border:0;margin:0 0 14px;padding:0;min-width:0}
#hub .hb-ask legend{font-family:var(--head);color:var(--yellow);letter-spacing:.12em;text-transform:uppercase;font-size:16px;padding:0;margin-bottom:8px}
#hub .hb-count{font-size:14px;color:var(--grey);margin:18px 0 4px;display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline}
#hub .hb-count b{color:var(--white)}
#hub .hb-linkbtn{background:none;border:0;padding:0;color:var(--aqua);cursor:pointer;text-decoration:underline;font-size:14px}
#hub aside.hb-side{position:sticky;top:140px;display:grid;gap:26px}
@media (max-width:980px){#hub aside.hb-side{position:static}}
#hub .hb-side h2{font-family:var(--head);color:var(--yellow);letter-spacing:.14em;text-transform:uppercase;font-size:18px;margin-bottom:10px}
#hub .hb-side ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
#hub .hb-side li{display:grid;grid-template-columns:52px minmax(0,1fr);gap:10px}
#hub .hb-side .hb-date .n{font-size:22px}
#hub .hb-side .none{color:var(--grey);font-size:13.5px}
#hub .hb-side .hb-guide{min-height:0;padding:14px;border:1px solid var(--line)}
#hub .hb-side .hb-guide .t{font-size:19px}

/* program cards */
#hub .hb-list{display:grid}
#hub .hb-card{border-top:1px solid var(--line);padding:20px 0 18px}
#hub .hb-card:first-child{border-top:2px solid var(--aqua)}
#hub .hb-card .org{font-size:12.5px;color:var(--grey);letter-spacing:.06em;text-transform:uppercase;line-height:1.35}
#hub .hb-card h3{font-family:var(--head-2);font-size:23px;letter-spacing:.015em;line-height:1.15;margin:4px 0 8px;color:var(--white)}
#hub .hb-badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
#hub .hb-b{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;padding:2px 8px;border:1px solid var(--grey);color:var(--grey);line-height:1.5}
#hub .hb-b.dl{background:var(--yellow);border-color:var(--yellow);color:#000;font-weight:700}
#hub .hb-b.paused{border-color:var(--red);color:var(--red)}
#hub .hb-b.free{border-color:var(--aqua);color:var(--aqua)}
#hub .hb-card .get{color:#e6e6e6;max-width:75ch}
#hub .hb-card details{margin:2px 0 10px;max-width:75ch}
#hub .hb-card summary{cursor:pointer;color:var(--aqua);font-size:14px;list-style:none}
#hub .hb-card summary::-webkit-details-marker{display:none}
#hub .hb-card summary::before{content:"+ ";font-weight:700}
#hub .hb-card details[open] summary::before{content:"\2212  "}
#hub .hb-card dl{margin:10px 0 0;display:grid;gap:8px}
#hub .hb-card dt{font-family:var(--head);color:var(--yellow);letter-spacing:.12em;text-transform:uppercase;font-size:13px}
#hub .hb-card dd{margin:0;color:#d4d4d4;font-size:14px}
#hub .hb-card .foot{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;font-size:14px}
#hub .hb-go{display:inline-block;border:1px solid var(--aqua);padding:6px 12px;font-weight:700}
#hub .hb-go:hover{background:var(--aqua);color:#000!important;text-decoration:none!important}
#hub .hb-card .contact{color:var(--grey);font-size:13px;overflow-wrap:anywhere}
#hub .hb-card .check{color:var(--grey);font-size:12.5px;font-style:italic}
#hub .hb-more{margin-top:18px;background:transparent;border:1px solid var(--aqua);color:var(--aqua);padding:10px 18px;cursor:pointer;font-family:var(--head);letter-spacing:.12em;text-transform:uppercase;font-size:15px}
#hub .hb-more:hover{background:var(--aqua);color:#000}
#hub .hb-empty{border:1px dashed #3d3d3d;padding:20px;color:#cfcfcf}

/* calendar page */
#hub .hb-month{margin-top:34px}
#hub .hb-month h2{font-family:var(--head);color:var(--yellow);letter-spacing:.14em;text-transform:uppercase;font-size:24px;border-bottom:2px solid var(--yellow);padding-bottom:6px;margin-bottom:6px}
#hub .hb-cal{list-style:none;margin:0;padding:0}
#hub .hb-cal li{display:grid;grid-template-columns:58px minmax(0,1fr);gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}

/* guide pages */
#hub .hb-article{max-width:74ch;margin:0 auto}
#hub .hb-article .kicker{font-family:var(--head);color:var(--yellow);letter-spacing:.14em;text-transform:uppercase;font-size:15px;text-align:center;margin-bottom:6px}
#hub .hb-article h2{font-family:var(--head);color:var(--aqua);letter-spacing:.08em;text-transform:uppercase;font-size:25px;margin:34px 0 10px}
#hub .hb-article ul,#hub .hb-article ol{margin:0 0 1em;padding-left:1.3em}
#hub .hb-article li{margin-bottom:.45em}
#hub .hb-article .fact{border-left:3px solid var(--yellow);padding:4px 0 4px 16px;margin:18px 0;color:#f0f0f0}
#hub .hb-article .fact b{font-family:var(--head);font-weight:400;color:var(--yellow);font-size:30px;letter-spacing:.04em;display:block;line-height:1.1}
#hub .hb-article .draft{border:1px dashed var(--grey);color:var(--grey);padding:10px 14px;font-size:13.5px;margin:0 0 22px;text-align:center}
#hub .hb-article .sources{font-size:13px;color:var(--grey);border-top:1px solid var(--line);padding-top:12px;margin-top:34px}
#hub .hb-checklist{list-style:none;padding:0!important}
#hub .hb-checklist li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;border-top:1px solid var(--line);padding:14px 0;margin:0!important}
#hub .hb-checklist input{width:20px;height:20px;accent-color:var(--aqua);margin-top:3px}
#hub .hb-checklist label{cursor:pointer}
#hub .hb-checklist .t{font-weight:700;color:var(--white)}

/* fine print */
#hub .hb-note{margin-top:60px;border-top:1px solid var(--line);padding-top:16px;color:var(--grey);font-size:13px;max-width:90ch}
#hub .hb-note b{color:#d8d8d8;font-weight:500}

@media (prefers-reduced-motion:reduce){#hub *{scroll-behavior:auto!important;transition:none!important}}

/* AWHQ's own programs and the navigator */
#hub .hb-card.is-awhq{border-left:3px solid var(--red);padding-left:16px;background:linear-gradient(90deg,rgba(255,51,0,.07),transparent 60%)}
#hub .hb-b.awhq{background:var(--red);border-color:var(--red);color:#000;font-weight:700}
#hub .hb-b.soon{border-color:var(--yellow);color:var(--yellow)}
#hub .hb-nav{border-color:var(--yellow);color:var(--yellow)!important}
#hub .hb-nav:hover{background:var(--yellow)}
#hub .hb-navline{text-align:center;margin:18px auto 0;color:#d8d8d8;display:flex;gap:10px 14px;align-items:center;justify-content:center;flex-wrap:wrap}
#hub .hb-navways{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center}
#hub .hb-card .checked{color:#6f7174;font-size:12px;letter-spacing:.04em}
#hub .hb-card .hb-cal li{grid-template-columns:52px minmax(0,1fr);padding:10px 0}

/* "Need help? Email us." call-to-action */
#hub .hb-cta{margin:56px 0 0;padding:26px 0 0;border-top:1px solid #333;text-align:center}
#hub .hb-cta-h{font-family:var(--head);font-size:clamp(24px,3.4vw,36px);letter-spacing:.06em;text-transform:uppercase;color:#fff;line-height:1.15;margin:0 0 8px;font-weight:400}
#hub .hb-cta-h a{color:var(--aqua)}
#hub .hb-cta-addr{margin:0;font-size:15px}
#hub .hb-cta-addr a{color:#d8d8d8}
#hub .hb-cta-draft{margin:8px 0 0;color:var(--grey);font-size:12px}
#hub .hb-crisis-line{text-align:center;color:var(--grey);font-size:14px;margin:22px 0 0}
#hub .hb-crisis-line a{color:#d8d8d8}

/* Accessibility */
#hub .checked{color:#8f9195!important}
#hub .hb-cta-h a,#hub .hb-crisis-line a{text-decoration:underline;text-underline-offset:3px}
