/* Colleges (app/colleges-page.php): the college-town hub, a page per college (both on top of housing.css: .housing2
   .hs-card, .page-head, .kicker), the Schools-page section (.co-scard / #co-near) and the home card (.h3-co).
   Approved design: colleges-mock.html v2. Type colours (validated): university #5a3fb0, community college #2f8fd0,
   career school #b7791f. Every class is co- (or h3-co-) prefixed. */

.colleges2 .hl-chip{display:inline-block;margin-top:10px;font-size:12px;color:var(--muted);background:var(--surface-2);border-radius:999px;padding:3px 10px}
.colleges2 .hs-p{font-size:14.5px;color:var(--copy);max-width:72ch;line-height:1.55}
.colleges2 .hs-p b{color:var(--text)}
.colleges2 .hs-src{font-size:12px;color:var(--faint);margin-top:12px;line-height:1.5}
.colleges2 .hs-card{scroll-margin-top:80px}
.colleges2 h3,.co-h3{font:700 15px/1.3 var(--display);margin:0;color:var(--text)}
.colleges2 .sub{font-size:12.5px;color:var(--muted);margin:2px 0 10px}
.colleges2 .co-h3{margin:22px 0 0}

.co-crumbs{font-size:13px;color:var(--muted);margin:4px 0 8px}
.co-crumbs a{color:var(--muted);text-decoration:none}.co-crumbs a:hover{color:var(--green);text-decoration:underline}
.co-crumbs b{color:var(--text);font-weight:600}
.co-chips{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 2px}
.co-chips>*{font-size:12.5px;padding:3px 10px;border-radius:999px;background:var(--surface-2);color:var(--copy);text-decoration:none}
.co-chips .type{background:color-mix(in srgb,var(--tc) 14%,var(--surface));color:var(--tc);font-weight:700}
.co-chips a:hover{color:var(--green)}

/* hero tiles */
.co-hero{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:16px}
.co-h5{background:var(--surface);border:1px solid var(--line-2);border-radius:16px;padding:14px 16px;min-width:0}
.co-h5 .co-ic{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-size:18px;background:color-mix(in srgb,var(--hc) 16%,var(--surface))}
.co-h5 .k{font-size:12.5px;color:var(--muted);margin-top:8px;font-weight:600}
.co-h5>b{display:block;font:800 30px/1.1 var(--display);letter-spacing:-.03em;color:var(--hc)}
.co-h5>b.nm{font-size:17px;line-height:1.25;letter-spacing:-.01em;margin-top:4px}
.co-h5 .r{font-size:12px;color:var(--copy);margin-top:6px;border-top:1px dashed var(--line-2);padding-top:6px}
.co-meter{display:flex;gap:3px;margin-top:8px;max-width:200px}
.co-meter i{flex:1;height:6px;border-radius:99px;background:var(--line-2)}
.co-meter i.on{background:var(--mc)}

/* hub */
.co-hubmap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:18px;margin-top:12px;align-items:start}
.co-hubmap.nomap{grid-template-columns:minmax(0,1fr)}
.co-map{background:var(--surface-2);border-radius:14px;padding:6px;position:sticky;top:80px}
.co-map svg{width:100%;height:auto;display:block}
.co-map path.ctx{fill:color-mix(in srgb,var(--text) 7%,var(--surface));stroke:var(--surface);stroke-width:1;vector-effect:non-scaling-stroke}
.co-map path.ctx.me{fill:color-mix(in srgb,var(--green) 16%,var(--surface));stroke:var(--green);stroke-width:1.5}
.co-map circle.dot{stroke:var(--surface);stroke-width:2;vector-effect:non-scaling-stroke;opacity:.9;cursor:pointer}
.co-map circle.dot:hover{opacity:1;stroke:var(--text)}
.co-map text{font-family:var(--sans);font-weight:700;font-size:12px;fill:var(--text);paint-order:stroke;stroke:var(--surface);stroke-width:3px;pointer-events:none}
.co-sorts{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.co-sorts button{font:600 12.5px var(--sans);padding:5px 11px;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);color:var(--copy);cursor:pointer}
.co-sorts button.on{background:var(--text);color:var(--surface);border-color:var(--text)}
.co-grid{display:grid;gap:10px}
.co-cc{display:block;border:1px solid var(--line-2);border-left:4px solid var(--tc);border-radius:14px;padding:12px 14px;color:inherit;text-decoration:none;background:var(--surface);transition:border-color .15s,transform .15s}
.co-cc:hover{border-color:var(--tc);transform:translateY(-1px)}
.co-cch b{display:block;font:700 15.5px/1.25 var(--display)}
.co-cch small{font-size:12px;color:var(--muted)}
.co-nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:10px}
.co-nums b{display:block;font:800 18px/1.1 var(--display);color:var(--text)}
.co-nums small{font-size:11.5px;color:var(--muted)}
.co-key{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:12px}
.co-key span{display:inline-flex;align-items:center;gap:6px}.co-key i{width:10px;height:10px;border-radius:50%}

/* lists (nearby, Schools section) */
.co-list{display:grid;gap:6px;margin-top:10px}
.co-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:12px;background:var(--surface-2);color:inherit;text-decoration:none;border:1px solid transparent}
a.co-row{transition:border-color .15s,transform .15s}
a.co-row:hover{border-color:var(--tc);transform:translateY(-1px)}
.co-row .chev{width:12px;flex:none;font:700 20px/1 var(--sans);color:var(--green);text-align:right}
.co-row.nolink{background:transparent;border:1px dashed var(--line-2)}
.co-row.nolink .nm b{font-weight:600;color:var(--copy)}
.co-row .sw{width:10px;height:10px;border-radius:50%;background:var(--tc);flex:none}
.co-row .nm{flex:1;min-width:0}
.co-row .nm b{display:block;font:700 14px/1.3 var(--display)}
.co-row .nm small{font-size:12px;color:var(--muted)}
.co-row .v{text-align:right;font-size:12px;color:var(--muted);white-space:nowrap}
.co-row .v b{display:block;font:800 15px var(--display);color:var(--text)}
.co-cta{display:inline-block;margin-top:12px;font-weight:700;color:var(--green);text-decoration:none}
.co-cta:hover{text-decoration:underline}

/* getting in */
.co-adm{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:22px;margin-top:10px;align-items:start}
.co-adm .big{font:800 44px/1 var(--display);color:var(--tc,#5a3fb0);letter-spacing:-.03em}
.co-adm .big small{display:block;font:600 13px var(--sans);color:var(--muted);letter-spacing:0;margin-top:4px}
.co-dots{display:grid;grid-template-columns:repeat(10,1fr);gap:5px;max-width:240px;margin-top:12px}
.co-dots i{aspect-ratio:1;border-radius:50%;background:var(--line-2)}
.co-dots i.on{background:#5a3fb0}
.co-rng .ln{display:grid;grid-template-columns:110px minmax(0,1fr) 70px;gap:10px;align-items:center;margin-bottom:10px}
.co-rng .ln>b{font-size:13px}
.co-rng .bar{position:relative;height:12px;border-radius:99px;background:var(--surface-2)}
.co-rng .bar i{position:absolute;top:0;bottom:0;border-radius:99px;background:#5a3fb0}
.co-rng .scale{display:flex;justify-content:space-between;font-size:10.5px;color:var(--faint);margin-top:2px}
.co-rng .v{font:800 15px var(--display);text-align:right}
.co-ghost{padding:14px;border-radius:12px;border:1px dashed var(--line-2);color:var(--copy);font-size:14px}

/* cost */
.co-cost{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;margin-top:10px}
.co-cost+.hs-p{margin-top:14px}
.co-stack{display:flex;height:34px;border-radius:10px;overflow:hidden;gap:2px}
.co-stack>div{display:grid;place-items:center;color:#fff;font:700 12px var(--sans);min-width:0;overflow:hidden;white-space:nowrap}
.co-skey{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12.5px;color:var(--copy);margin-top:8px}
.co-skey span{display:inline-flex;align-items:center;gap:6px}.co-skey i{width:10px;height:10px;border-radius:3px;flex:none}
.co-inc{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;height:150px;align-items:end}
.co-inc .c{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;gap:4px}
.co-inc .c b{font:800 14px var(--display)}
.co-inc .c i{width:100%;max-width:46px;background:#0e9f57;border-radius:4px 4px 0 0}
.co-incx{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;font-size:11px;color:var(--muted);text-align:center;margin-top:4px;border-top:1px solid var(--line-2);padding-top:4px}

/* students */
.co-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;margin-top:12px}
.co-split{display:flex;height:22px;border-radius:8px;overflow:hidden;gap:2px}
.co-split i{min-width:3px}
.co-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:16px}
.co-facts>div{background:var(--surface-2);border-radius:12px;padding:10px 12px}
.co-facts b{display:block;font:800 22px var(--display)}
.co-facts small{font-size:12px;color:var(--muted)}

/* majors */
.co-maj{display:grid;gap:8px;margin-top:10px}
.co-maj .ln{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 92px;gap:12px;align-items:center}
.co-maj .nm b{display:block;font:700 14px/1.3 var(--display)}
.co-maj .nm small{font-size:12px;color:var(--muted)}
.co-maj .bg{height:10px;border-radius:99px;background:var(--surface-2);overflow:hidden}
.co-maj .bg i{display:block;height:100%;border-radius:99px;background:#0e9f57}
.co-maj .v{font:800 15px var(--display);text-align:right}
.co-maj .v small{display:block;font:500 11px var(--sans);color:var(--muted)}

/* outcomes */
.co-out{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:10px}
.co-out .o{background:var(--surface-2);border-radius:14px;padding:12px 14px;min-width:0}
.co-out .k{font-size:12.5px;font-weight:600;color:var(--muted)}
.co-out b{display:block;font:800 26px/1.15 var(--display);color:var(--text)}
.co-out .vs{font-size:12px;color:var(--copy);margin-top:6px}
.co-rpy{display:flex;gap:12px;align-items:baseline}
.co-rpy b{font:800 30px var(--display);color:#0e9f57}
.co-rpy span{font-size:13.5px;color:var(--copy)}
.co-einc .ln{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) 72px;gap:10px;align-items:center;margin-bottom:8px;font-size:13px}
.co-einc .bg{height:10px;border-radius:99px;background:var(--surface-2);overflow:hidden}
.co-einc .bg i{display:block;height:100%;background:#5a3fb0;border-radius:99px}
.co-einc b{text-align:right;font:800 14px var(--display)}

/* living in town */
.co-live{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-top:12px}
.co-live .lv{display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line);color:inherit;text-decoration:none}
.co-live .lv:hover{border-color:var(--green)}
.co-live .ic{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-size:18px;background:var(--surface);margin-bottom:8px}
.co-live b{font:800 22px var(--display)}
.co-live b small{font:600 12px var(--sans);color:var(--muted)}
.co-live small{font-size:12px;color:var(--muted)}
.co-live .go{font-size:12.5px;font-weight:700;color:var(--green);margin-top:auto;padding-top:4px}
.co-nearl{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.co-nearl>*{font-size:13px;padding:4px 11px;border-radius:999px;background:var(--surface-2);color:var(--text);text-decoration:none;border:1px solid var(--line)}
.co-nearl a:hover{border-color:#5a3fb0}
.co-nearl a i{font-style:normal;font-weight:700;color:var(--green)}
.co-nearl .nolink{background:transparent;border-style:dashed;color:var(--copy)}
.co-nearl small{color:var(--muted)}

.co-tt{position:fixed;pointer-events:none;background:var(--text);color:var(--surface);font-size:12.5px;padding:7px 10px;border-radius:9px;z-index:60;opacity:0;transition:opacity .08s;max-width:260px;line-height:1.4}
.co-tt b{color:inherit}

/* home card */
.home3 .h3-co-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:14px 22px;padding:2px 18px 16px;align-items:start}
.home3 .h3-co-big{display:flex;gap:14px;align-items:flex-start}
.home3 .h3-co-big>span{font:800 44px/1 var(--display);color:#5a3fb0;letter-spacing:-.03em}
.home3 .h3-co-big p,.home3 .h3-co-p{font-size:14px;color:var(--copy);margin:0;line-height:1.5}
.home3 .h3-co-qs{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.home3 .h3-co-q{display:flex;flex-direction:column;gap:4px;padding:12px 13px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line);color:inherit;text-decoration:none;transition:border-color .15s,transform .15s}
.home3 .h3-co-q:hover{border-color:#5a3fb0;transform:translateY(-1px)}
.home3 .h3-co-q b{font:800 22px/1 var(--display);letter-spacing:-.02em;color:#5a3fb0}
.home3 .h3-co-q .qq{font:700 14px/1.25 var(--display)}
.home3 .h3-co-q small{font-size:12px;color:var(--muted);margin-top:auto}
.home3 .h3-co-q small::after{content:" →";white-space:nowrap;color:var(--green);font-weight:700}
.home3 .h3-co .h3-vfoot{border-top:1px solid var(--line);padding-top:12px}
@media (max-width:980px){.home3 .h3-co-in{grid-template-columns:minmax(0,1fr)}}

@media (max-width:1100px){.co-hero{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:860px){.co-hubmap{grid-template-columns:minmax(0,1fr)}.co-map{position:static}}
@media (max-width:760px){
  .co-hero{grid-template-columns:1fr 1fr}
  .co-hero>.co-h5:last-child:nth-child(odd){grid-column:1/-1}
  .co-h5>b{font-size:24px}
  .co-adm,.co-cost,.co-two{grid-template-columns:minmax(0,1fr)}
  .co-out,.co-facts{grid-template-columns:1fr 1fr}
  .co-nums{grid-template-columns:1fr 1fr}
  .co-maj .ln{grid-template-columns:minmax(0,1fr) 84px}.co-maj .bg{display:none}
  .co-rng .ln{grid-template-columns:90px minmax(0,1fr) 62px}
  .co-incx{font-size:10px}
}