/* Focus landings and homepage B (Nov 12). One template for Academics, Campus life, Food, Getting around and Money on
   every guide: the area's tool or live visual first, then the next dates, the live campus modules, featured guides with
   their own facts, and every guide in the area. Built by scripts/focus-landings.mjs. School red stays on the mark. */
.fl{--fl-ink:#1f1f1f;--fl-ink-2:#3b3b3b;--fl-muted:#6a6a6a;--fl-line:#e6e3df;--fl-well:#f6f5f2;--fl-r:18px;
  max-width:1240px;margin:0 auto;padding:8px clamp(16px,3.2vw,40px) 80px;color:var(--fl-ink);font-family:Figtree,system-ui,-apple-system,sans-serif}
main.fl,.fl *{box-sizing:border-box}
/* Guides style main differently (100% width, or a flex item in a column body): the landing fills the column and never
   grows to its widest child (the date strip scrolls inside it). */
main.fl{width:100%!important;min-width:0!important}
.fl-dates,.fl-datelist,.fl-hero-copy,.fl-hero-visual{min-width:0}
.fl a{color:inherit}
.fl .fl-crumb{margin:14px 0 0}

/* hero */
.fl-hero{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(24px,4.5vw,64px);align-items:center;padding:22px 0 44px}
.fl-hero.is-text{grid-template-columns:minmax(0,1fr)}
.fl-hero-copy{min-width:0}
.fl-kicker{display:inline-flex;align-items:center;gap:8px;margin:0 0 16px;font-size:15px;font-weight:650;color:var(--fl-ink-2)}
.fl-kicker svg{width:22px;height:22px}
html:is(.ds3,.gw-ds3) main.fl h1{font-size:clamp(36px,4.8vw,60px)!important;line-height:1.02!important;letter-spacing:-.035em!important;font-weight:800!important;margin:0 0 18px!important;text-wrap:balance;max-width:14ch}
.fl-lead{margin:0;font-size:clamp(17px,1.45vw,20px);line-height:1.5;color:var(--fl-ink-2);max-width:44ch}
.fl-lead b{color:var(--fl-ink);font-weight:700}
.fl-actions{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 0}
html:is(.ds3,.gw-ds3) main.fl a.fl-btn{display:inline-flex;align-items:center;min-height:46px;padding:0 20px;border-radius:999px;background:var(--fl-ink);color:#fff;font-weight:650;font-size:15px;text-decoration:none}
html:is(.ds3,.gw-ds3) main.fl a.fl-btn.is-quiet{background:#fff;color:var(--fl-ink);box-shadow:inset 0 0 0 1px #d6d2cd}
html:is(.ds3,.gw-ds3) main.fl a.fl-btn:hover{box-shadow:0 0 0 3px rgb(31 31 31/.12)}
html:is(.ds3,.gw-ds3) main.fl a.fl-btn.is-quiet:hover{box-shadow:inset 0 0 0 1px var(--fl-ink)}
.fl-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));margin:30px 0 0;border-top:1px solid var(--fl-line)}
.fl-stats>div{display:block!important;min-width:0;padding:14px 18px 0 0}
.fl-stats dt,.fl-stats dd{display:block!important}
.fl-stats>div+div{padding-left:18px;border-left:1px solid var(--fl-line)}
.fl-stats a{display:block!important;text-decoration:none}
.fl-stats dt{font-size:13px;color:var(--fl-muted);margin:0}
.fl-stats dd{margin:3px 0 0;font-size:clamp(20px,2vw,26px);font-weight:750;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap}
.fl-stats a:hover dd{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px}
.fl-hero-visual{min-width:0}
.fl-hero-visual .mf{margin:0!important;padding:0!important;max-width:none!important}
.fl-hero-visual .mf-map{height:clamp(340px,40vw,540px)!important;border-radius:var(--fl-r)!important;overflow:hidden}
.fl-hero-visual .mf-full,.fl-hero-visual .mf-open{top:auto!important;right:auto!important;bottom:12px!important;left:12px!important}
.fl-hero-visual .mf-cite{font-size:12px;color:var(--fl-muted);margin:10px 2px 0}

/* credited campus photo as the hero visual (.tech) */
.fl-photo{margin:0}
.fl-photo img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:var(--fl-r)}
.fl-photo figcaption{margin:8px 2px 0;font-size:12px;color:var(--fl-muted)}
.fl-photo figcaption a{color:inherit}
.fl-lifted .rp-sec{margin:0}

/* live feed as the hero card (Campus life) */
.fl-feedcard{display:block!important;border:1px solid var(--fl-line);border-radius:var(--fl-r);padding:22px 24px 8px;background:#fff;box-shadow:0 1px 2px rgb(0 0 0/4%),0 18px 40px -24px rgb(0 0 0/22%)}
.fl-feedcard .fg-feed__col{margin:0}

/* cost breakdown (Money) */
.fl-cost{margin:0;border:1px solid var(--fl-line);border-radius:var(--fl-r);padding:26px 28px 22px;background:#fff;box-shadow:0 1px 2px rgb(0 0 0/4%),0 18px 40px -24px rgb(0 0 0/22%)}
.fl-cost figcaption{display:grid;gap:2px;margin:0 0 20px}
.fl-cost figcaption span{font-size:14px;color:var(--fl-muted)}
.fl-cost figcaption b{font-size:clamp(40px,5vw,56px);line-height:1;font-weight:800;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.fl-cost ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.fl-cost li{display:grid;grid-template-columns:minmax(0,9.5em) minmax(0,1fr) auto;gap:14px;align-items:center;font-size:15px}
.fl-cost li span{color:var(--fl-ink-2)}
.fl-cost li b{font-variant-numeric:tabular-nums;font-weight:700;min-width:5.2em;text-align:right}
.fl-cost li svg{display:block;width:100%;height:12px}
.fl-cost li rect{fill:var(--fl-ink)}
.fl-cost li rect.bg{fill:var(--fl-well)}
.fl-cost .fl-note{margin:18px 0 0}

/* section heads */
.fl-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin:0 0 16px}
html:is(.ds3,.gw-ds3) main.fl .fl-head h2,html:is(.ds3,.gw-ds3) main.fl .fl-other h2{font-size:24px!important;line-height:1.2!important;letter-spacing:-.02em!important;font-weight:750!important;margin:0!important}
.fl-head a{font-size:15px;font-weight:650;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.fl-note{font-size:14px;color:var(--fl-muted);margin:10px 0 0}

/* coming up */
.fl-dates{margin:0 0 52px}
.fl-datelist{list-style:none;margin:0;padding:2px 0 6px;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(200px,1fr);gap:12px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}
.fl-datelist::-webkit-scrollbar{display:none}
.fl-datelist li{scroll-snap-align:start;display:grid;grid-template-columns:52px minmax(0,1fr);gap:14px;align-items:start;padding:14px 16px 14px 14px;border:1px solid var(--fl-line);border-radius:14px;background:#fff}
.fl-datelist li[hidden]{display:none}
.fl-datelist time{display:grid;justify-items:center;padding:7px 0 6px;border-radius:10px;background:var(--fl-well)}
.fl-datelist time span{font-size:11px;font-weight:750;letter-spacing:.08em;text-transform:uppercase;color:var(--fl-ink-2)}
.fl-datelist time b{font-size:24px;line-height:1.05;font-weight:800;font-variant-numeric:tabular-nums}
.fl-datelist time i{font-style:normal;font-size:11px;color:var(--fl-muted)}
.fl-datelist p{margin:2px 0 0;font-size:15px;line-height:1.35;font-weight:600}
.fl-datelist li:first-child{border-color:var(--fl-ink);box-shadow:inset 0 0 0 1px var(--fl-ink)}
.fl-datelist li:first-child time{background:var(--fl-ink)}
.fl-datelist li:first-child time span,.fl-datelist li:first-child time b,.fl-datelist li:first-child time i{color:#fff}

/* live campus modules */
.fl-modules{margin:0 0 56px!important}
html:is(.ds3,.gw-ds3) main.fl .fl-modules.fg-feed{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 48px}
html:is(.ds3,.gw-ds3) main.fl .fl-modules.fg-feed.is-one{grid-template-columns:minmax(0,640px)}
.fl-wide{margin:0 0 56px}

/* start here */
.fl-start{margin:0 0 56px}
.fl-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.fl-cards a{text-align:left!important;align-items:flex-start;display:flex;flex-direction:column;gap:8px;height:100%;padding:20px 20px 22px;border:1px solid var(--fl-line);border-radius:var(--fl-r);text-decoration:none;background:#fff;transition:border-color .15s,box-shadow .15s}
.fl-cards a:hover{border-color:#bdb8b2;box-shadow:0 14px 34px -22px rgb(0 0 0/30%)}
.fl-big{font-size:30px;line-height:1;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums;margin-bottom:4px}
.fl-cards strong{font-size:17px;line-height:1.3;font-weight:700}
.fl-cards span{font-size:14.5px;line-height:1.45;color:var(--fl-muted);display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}

/* every guide */
.fl-all{margin:0 0 64px}
.fl-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 40px}
html:is(.ds3,.gw-ds3) main.fl .fl-group h3{display:flex;align-items:baseline;gap:8px;font-size:13px!important;line-height:1.3!important;font-weight:750!important;letter-spacing:.07em;text-transform:uppercase;color:var(--fl-ink-2);margin:0 0 6px!important;padding-bottom:10px;border-bottom:1px solid var(--fl-ink)}
.fl-group h3 span{font-size:12px;color:var(--fl-muted);letter-spacing:0}
.fl-group ul{list-style:none;margin:0;padding:0}
.fl-group li{padding:11px 0;border-bottom:1px solid var(--fl-line)}
.fl-group li a{font-size:16px;font-weight:650;line-height:1.3;text-decoration:none}
.fl-group li a:hover{text-decoration:underline;text-underline-offset:3px}
.fl-group li p{margin:4px 0 0;font-size:14px;line-height:1.4;color:var(--fl-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

html:is(.ds3,.gw-ds3) main.fl .fl-more summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:15px;font-weight:650;text-decoration:underline;text-underline-offset:3px}
.fl-more summary::-webkit-details-marker{display:none}
.fl-more summary::after{content:"";width:8px;height:8px;border-right:1.7px solid currentColor;border-bottom:1.7px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.fl-more[open] summary{display:none}

/* the other areas */
.fl-other{padding-top:32px;border-top:1px solid var(--fl-line)}
.fl-other h2{margin:0 0 16px!important}
.fl-other ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.fl-other a{display:grid!important;grid-template-columns:minmax(0,1fr)!important;align-content:start;gap:6px;height:100%;padding:18px;border-radius:16px;background:var(--fl-well);text-decoration:none;text-align:left!important}
.fl-other strong,.fl-other span{display:block}
.fl-other a:hover{background:#efede9}
.fl-other svg{width:24px;height:24px}
.fl-other strong{font-size:16px}
.fl-other span{font-size:14px;line-height:1.4;color:var(--fl-muted)}

/* homepage B: the guide's areas above the apartment list */
.fl-strip{display:flex;gap:8px;margin:0 0 20px;overflow-x:auto;scrollbar-width:none;padding:2px}
.fl-strip::-webkit-scrollbar{display:none}
.fl-strip a{flex:none;display:flex;align-items:center;gap:10px;padding:10px 16px 10px 12px;border:1px solid #dedad5;border-radius:14px;text-decoration:none;color:#1f1f1f;background:#fff}
.fl-strip a:hover{border-color:#1f1f1f}
.fl-strip svg{width:22px;height:22px;flex:none}
.fl-strip span{display:grid;line-height:1.2}
.fl-strip strong{font-size:14.5px;font-weight:700}
.fl-strip small{font-size:12.5px;color:#6a6a6a;white-space:nowrap}

/* homepage B on a DS3 directory (College Station): the home's title above the directory's own live count */
.fl-home-head{max-width:1440px;margin:0 auto;padding:18px clamp(16px,3vw,40px) 4px}
.fl-home-kicker{margin:0;font-size:16px;font-weight:650;color:#3b3b3b}

/* category nav: six areas */
.ds3-categories.fl-nav{justify-content:center}
.ds3-categories.fl-nav a::before{content:none!important;display:none!important}

@media (max-width:1100px){.fl-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.fl-other ul{grid-template-columns:repeat(3,minmax(0,1fr))}.fl-groups{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){
  .fl{padding-bottom:56px}
  .fl-hero{grid-template-columns:minmax(0,1fr);gap:22px;padding:10px 0 32px}
  html:is(.ds3,.gw-ds3) main.fl h1{font-size:36px!important;max-width:none}
  .fl-kicker{margin-bottom:10px}
  .fl-actions{margin-top:20px}
  html:is(.ds3,.gw-ds3) main.fl a.fl-btn{flex:1 1 auto;justify-content:center}
  .fl-stats dd{font-size:20px}
  .fl-stats>div{padding-right:10px}.fl-stats>div+div{padding-left:12px}
  .fl-hero-visual .mf-map{height:320px!important}
  .fl-cost{padding:20px}
  .fl-cost li{grid-template-columns:minmax(0,7.4em) minmax(0,1fr) auto;gap:10px;font-size:14px}
  .fl-datelist{grid-auto-columns:minmax(220px,78%);margin:0 calc(-1 * clamp(16px,3.2vw,40px));padding-left:clamp(16px,3.2vw,40px);padding-right:clamp(16px,3.2vw,40px);scroll-padding-left:clamp(16px,3.2vw,40px)}
  .fl-cards{grid-template-columns:minmax(0,1fr)}
  .fl-groups{grid-template-columns:minmax(0,1fr);gap:28px}
  .fl-other ul{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fl-head h2{font-size:21px!important}
  html:is(.ds3,.gw-ds3) main.fl .fl-modules.fg-feed{grid-template-columns:minmax(0,1fr);gap:28px}
  .fl-strip{margin:0 -16px 16px;padding:2px 16px}
  .fl-strip a{padding:9px 14px 9px 10px;border-radius:999px}
  .fl-strip small{display:none}
  .fl-strip svg{width:20px;height:20px}
}
