/* MUH 3633 — shared base styles for the homepage and weekly pages.
   "Blue Note" design: Reid Miles–style label modernism — vinyl black,
   off-white paper, Session Blue accent, Hard-Bop Orange highlights.
   Display: Archivo Black · Body: Archivo · Labels: IBM Plex Mono.
   Page-specific rules remain in each page's inline <style>. */
:root{
  --ink:#101318;
  --ink-2:#4a4d52;
  --teal:#101318;            /* header/footer ground = vinyl black */
  --teal-2:#183c8c;
  --rust:#2456c9;            /* primary accent = session blue */
  --rust-dark:#183c8c;
  --cream:#f4f2ec;           /* page ground = sleeve off-white */
  --paper:#f4f2ec;
  --sand:#eae7dd;
  --line:#d8d4c8;
  --pale:#eae7dd;
  --notice:#e7ebf8;
  --underline:#f26d21;       /* hover highlight = hard-bop orange */
  --max:1180px;
  --display:"Archivo Black","Archivo","Segoe UI",Arial,sans-serif;
  --body-font:"Archivo","Segoe UI",Arial,sans-serif;
  --mono:"IBM Plex Mono",Consolas,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  background:var(--cream);
  font-family:var(--body-font);
  font-size:17px;
  line-height:1.58;
}
img{max-width:100%;display:block}
a{
  color:var(--rust-dark);
  text-decoration-thickness:.08em;
  text-underline-offset:.18em;
}
a:hover{color:var(--rust)}
a:focus-visible,
button:focus-visible,
summary:focus-visible{
  outline:3px solid var(--rust);
  outline-offset:4px;
}
.skip-link{
  position:fixed;
  left:1rem;
  top:1rem;
  transform:translateY(-180%);
  z-index:999;
  padding:.65rem .9rem;
  color:var(--cream);
  background:var(--ink);
  font-weight:800;
}
.skip-link:focus{transform:none}
.shell{
  width:min(var(--max),calc(100% - 2rem));
  margin-inline:auto;
}
.site-header{
  position:sticky;
  top:0;
  z-index:100;
  color:var(--cream);
  background:var(--ink);
  border-bottom:3px solid var(--rust);
}
.header-inner{
  min-height:4rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.5rem;
}
.brand{
  color:var(--cream);
  font-family:var(--display);
  font-size:1.15rem;
  font-weight:400;
  letter-spacing:-.02em;
  text-decoration:none;
  white-space:nowrap;
}
.brand small{
  margin-left:.65rem;
  padding-left:.8rem;
  border-left:1px solid rgba(244,242,236,.5);
  font-family:var(--mono);
  font-size:.72rem;
  font-weight:400;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.primary-nav ul{
  display:flex;
  flex-wrap:wrap;
  gap:.15rem 1.2rem;
  margin:0;
  padding:0;
  list-style:none;
}
.primary-nav a{
  display:inline-block;
  padding:1.2rem 0 .9rem;
  color:var(--cream);
  border-bottom:3px solid transparent;
  font-size:.85rem;
  font-weight:650;
  letter-spacing:.05em;
  text-transform:uppercase;
  text-decoration:none;
}
.primary-nav a:hover,
.primary-nav a[aria-current="page"]{
  border-color:var(--underline);
  color:var(--cream);
}
/* Full-bleed album-cover hero: blue block + black side panel */
.hero{
  color:var(--cream);
  background:var(--ink);
  border-bottom:3px solid var(--ink);
}
.hero-wide{
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(21rem,1fr);
}
.hero-block{
  position:relative;
  overflow:hidden;
  padding:3rem clamp(1rem,4vw,3.5rem) 2.6rem;
  background:var(--rust);
}
.hero-kicker{
  margin:0 0 1.3rem;
  font-family:var(--mono);
  font-size:.78rem;
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#dfe6f8;
}
.hero-block h1 .knock{color:var(--ink)}
.hero-block .dek{
  max-width:34rem;
  margin:1.5rem 0 0;
  font-size:1.05rem;
  color:#e8ecf8;
}
.hero-groove{
  position:absolute;
  right:-140px;
  bottom:-140px;
  width:340px;
  height:340px;
  border-radius:50%;
  border:1.5px solid rgba(244,242,236,.35);
  pointer-events:none;
}
.hero-groove::before,
.hero-groove::after{
  content:"";
  position:absolute;
  inset:38px;
  border-radius:50%;
  border:1.5px solid rgba(244,242,236,.28);
}
.hero-groove::after{inset:76px;border-color:rgba(244,242,236,.2)}
.hero-side{
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:1.15rem;
  padding:2rem clamp(1rem,3vw,2rem) 2.2rem;
  background:var(--ink);
}
.hero-side dl{
  margin:0;
  display:grid;
  grid-template-columns:auto 1fr;
  gap:.35rem 1rem;
  font-size:.9rem;
}
.hero-side dt{
  font-family:var(--mono);
  font-size:.7rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#9aa0ab;
  align-self:baseline;
}
.hero-side dd{margin:0}
.eyebrow{
  margin:0 0 .7rem;
  color:var(--rust);
  font-family:var(--mono);
  font-size:.76rem;
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
}
h1,h2,h3{
  font-family:var(--display);
  font-weight:400;
  line-height:1.05;
  text-wrap:balance;
}
h1{
  max-width:16ch;
  margin:0;
  font-size:clamp(2.3rem,5vw,3.9rem);
  letter-spacing:-.03em;
  text-transform:uppercase;
  line-height:.95;
}
.lede{
  max-width:42rem;
  margin:1.2rem 0 0;
  font-size:1.05rem;
  color:#e8ecf8;
}
.course-meta{
  display:flex;
  flex-wrap:wrap;
  gap:.6rem 1.5rem;
  margin-top:1.7rem;
  padding-top:1.25rem;
  border-top:2px solid var(--cream);
  font-family:var(--mono);
  font-size:.82rem;
  font-weight:500;
}
.actions{
  display:flex;
  flex-wrap:wrap;
  gap:.8rem;
  margin-top:1.6rem;
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:2.7rem;
  padding:.62rem 1.1rem;
  border:2px solid var(--ink);
  color:var(--ink);
  background:transparent;
  font-weight:750;
  font-size:.85rem;
  letter-spacing:.05em;
  text-transform:uppercase;
  text-decoration:none;
}
.button.primary{
  color:var(--cream);
  background:var(--ink);
  border-color:var(--ink);
}
.button:hover,
.button.primary:hover{
  color:var(--ink);
  background:var(--underline);
  border-color:var(--underline);
}
/* On the blue hero, buttons knock out to paper */
.hero .button{border-color:var(--cream);color:var(--cream)}
.hero .button.primary{background:var(--cream);border-color:var(--cream);color:var(--ink)}
.hero .button:hover,
.hero .button.primary:hover{
  background:var(--underline);
  border-color:var(--underline);
  color:var(--ink);
}
figure{margin:0}
.hero-image{
  width:100%;
  aspect-ratio:4/2.45;
  object-fit:cover;
  object-position:center 34%;
  filter:grayscale(100%) contrast(1.08);
  border:3px solid var(--cream);
}
figcaption{
  margin-top:.6rem;
  color:var(--ink-2);
  font-size:.76rem;
  line-height:1.45;
}
.hero figcaption,
.hero figcaption a{color:#dfe6f8}
.main-grid{
  display:grid;
  grid-template-columns:1.2fr .72fr .76fr;
  border-bottom:1px solid var(--line);
}
.panel{
  padding:2.4rem clamp(1.2rem,2.9vw,2.6rem) 2.7rem 0;
  border-right:1px solid var(--line);
  line-height:1.65;
}
.panel + .panel{padding-left:clamp(1.2rem,2.9vw,2.6rem)}
.panel:last-child{border-right:0;padding-right:0}
.section-label{
  margin:0 0 1rem;
  color:var(--ink-2);
  font-family:var(--mono);
  font-size:.74rem;
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.section-label::after{
  content:"";
  display:block;
  width:1.8rem;
  height:3px;
  margin-top:.55rem;
  background:var(--rust);
}
.panel h2{
  margin:.1rem 0 .45rem;
  font-size:1.7rem;
  letter-spacing:-.01em;
  text-transform:uppercase;
}
.panel h3{
  margin:.1rem 0 .35rem;
  font-size:1rem;
}
.week-days{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin-top:1.1rem;
  padding-top:1rem;
  border-top:1px solid var(--line);
}
.day{
  padding:0 .9rem;
  border-right:1px solid var(--line);
}
.day:first-child{padding-left:0}
.day:last-child{border-right:0;padding-right:0}
.day strong{
  display:block;
  color:var(--rust);
  font-family:var(--mono);
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.day span{font-size:.86rem}
.simple-list{
  margin:0;
  padding:0;
  list-style:none;
}
.simple-list li{
  padding:1.05rem 0;
  border-bottom:1px solid var(--line);
}
.simple-list li:last-child{border-bottom:0}
.simple-list strong{display:block}
.weights{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:.75rem 1rem;
  font-size:.92rem;
  line-height:1.55;
}
.weights span:nth-child(even){
  text-align:right;
  font-family:var(--mono);
  font-weight:500;
  color:var(--rust-dark);
}
.text-link{
  display:inline-block;
  margin-top:1rem;
  font-size:.84rem;
  font-weight:750;
  letter-spacing:.03em;
  text-transform:uppercase;
  color:var(--ink);
  text-decoration-color:var(--underline);
  text-decoration-thickness:3px;
}
.text-link:hover{color:var(--rust)}
.section{
  padding:2.6rem 0;
  background:var(--paper);
  border-bottom:1px solid var(--line);
}
.section.alt{background:var(--sand)}
.section-heading{
  margin:0 0 1.35rem;
  color:var(--ink);
  font-size:1.15rem;
  letter-spacing:0;
  text-transform:uppercase;
}
.tools-layout{
  display:grid;
  grid-template-columns:1.35fr .85fr;
  gap:3rem;
}
.tool-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
}
.tool{
  padding:0 1.05rem;
  border-right:1px solid var(--line);
}
.tool:first-child{padding-left:0}
.tool:last-child{border-right:0}
.tool h3{
  margin:0 0 .45rem;
  font-size:.95rem;
}
.tool p{
  margin:0;
  color:var(--ink-2);
  font-size:.88rem;
  line-height:1.6;
}
.journey{
  border-left:1px solid var(--line);
  padding-left:2.3rem;
}
details{
  border-bottom:1px solid var(--line);
}
summary{
  padding:.75rem 0;
  cursor:pointer;
  font-weight:700;
  letter-spacing:.02em;
}
summary::marker{color:var(--rust)}
details p{
  margin:.1rem 0 1rem;
  color:var(--ink-2);
  font-size:.9rem;
}
.info-footer{
  padding:1.5rem 0;
  background:var(--sand);
  border-bottom:1px solid var(--line);
}
.info-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:2rem;
}
.info-grid h2{
  margin:0 0 .35rem;
  font-family:var(--mono);
  font-size:.74rem;
  font-weight:500;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--rust-dark);
}
.info-grid p{margin:0;font-size:.88rem}
.site-footer{
  padding:1rem 0;
  color:var(--cream);
  background:var(--ink);
  font-size:.76rem;
}
.site-footer .footer-inner span:first-child{
  font-family:var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.footer-inner{
  display:flex;
  justify-content:space-between;
  gap:2rem;
}
.site-footer a{color:var(--cream)}
.site-footer a:hover{color:var(--underline)}

/* Weekly page */
.week-layout{
  display:grid;
  grid-template-columns:230px minmax(0,1fr);
  min-height:calc(100vh - 4rem);
}
.week-sidebar{
  padding:2.2rem 1.5rem;
  background:var(--paper);
  border-right:1px solid var(--line);
}
.week-sidebar .week-number{
  color:var(--rust);
  font-family:var(--mono);
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.week-sidebar h1{
  margin:.5rem 0 1.7rem;
  font-size:1.8rem;
}
.side-nav{
  margin:0;
  padding:0;
  list-style:none;
}
.side-nav li{margin:.2rem 0}
.side-nav a{
  display:block;
  padding:.48rem .6rem;
  color:var(--ink);
  border-left:3px solid transparent;
  font-size:.86rem;
  text-decoration:none;
}
.side-nav a:hover,
.side-nav a[aria-current="true"]{
  border-color:var(--rust);
  color:var(--rust-dark);
}
.week-main{
  padding:2.2rem clamp(1.3rem,4vw,4rem) 0;
}
.week-top{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);
  gap:3rem;
  align-items:start;
}
.week-title h1{
  max-width:none;
  font-size:clamp(2rem,4.5vw,3.2rem);
}
.week-title .date-line{
  margin:.2rem 0 .55rem;
  color:var(--rust-dark);
  font-family:var(--mono);
  font-size:.74rem;
  font-weight:500;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.week-title .summary{
  max-width:58ch;
  margin:.85rem 0 0;
  color:var(--ink-2);
}
.deadline-box{
  padding:1.25rem 1.35rem;
  color:var(--cream);
  background:var(--ink);
  border:2px solid var(--ink);
  border-top:6px solid var(--rust);
}
.deadline-box h2{
  margin:0 0 .65rem;
  color:var(--underline);
  font-family:var(--mono);
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.deadline-box ul{
  margin:0;
  padding:0;
  list-style:none;
}
.deadline-box li{
  padding:.85rem 0;
  border-bottom:1px solid rgba(244,242,236,.28);
  font-size:.86rem;
  line-height:1.5;
}
.deadline-box li:last-child{border-bottom:0}
.deadline-box a{color:#dfe6f8}
.deadline-box .text-link{color:var(--cream)}
/* Week-page body: single vertical column (sections stack, matching the
   bluenote-week mockup — no side-by-side content). */
.content-row{
  display:block;
  margin-top:2rem;
  max-width:66rem;
}
.content-row > div{display:contents;}
.academic-section{
  padding:1.5rem 0;
  border-top:3px solid var(--ink);
  line-height:1.65;
}
.academic-section h2{
  margin:0 0 .8rem;
  font-family:var(--display);
  font-size:1.05rem;
  letter-spacing:.01em;
  text-transform:uppercase;
}
.academic-section p{margin:.5rem 0}
.meeting{
  display:grid;
  grid-template-columns:84px minmax(0,1fr) auto;
  gap:1rem;
  padding:1.2rem 0;
  border-top:1px solid var(--line);
}
.meeting:first-of-type{border-top:0}
.meeting-date{
  color:var(--rust);
  font-family:var(--mono);
  font-size:.76rem;
  font-weight:500;
  letter-spacing:.06em;
  text-transform:uppercase;
}
/* Mon/Wed/Fri sessions read as record sides A/B/C */
.meeting:nth-of-type(1) .meeting-date::before{content:"Side A"}
.meeting:nth-of-type(2) .meeting-date::before{content:"Side B"}
.meeting:nth-of-type(3) .meeting-date::before{content:"Side C"}
.meeting-date::before{
  display:block;
  margin-bottom:.15rem;
  font-family:var(--display);
  font-size:1rem;
  color:var(--ink);
  letter-spacing:0;
}
.meeting h3{
  margin:0 0 .2rem;
  font-family:var(--body-font);
  font-size:.98rem;
  font-weight:700;
}
.meeting p{
  margin:.3rem 0 0;
  color:var(--ink-2);
  font-size:.84rem;
  line-height:1.55;
}
.meeting a{
  font-size:.8rem;
  font-weight:750;
  white-space:nowrap;
}
.resource{
  padding:1.05rem 0;
  border-top:1px solid var(--line);
  line-height:1.6;
}
.resource:first-of-type{border-top:0}
.resource h3{
  margin:0 0 .2rem;
  font-family:var(--body-font);
  font-size:.9rem;
  font-weight:700;
}
.resource p{
  margin:0;
  color:var(--ink-2);
  font-size:.82rem;
}
/* Reading deadline flag — sits beside the reading title */
.due-badge{
  display:inline-block;
  margin-left:.5rem;
  padding:.1rem .5rem .14rem;
  background:var(--underline);
  color:var(--ink);
  font-family:var(--mono);
  font-size:.66rem;
  font-weight:500;
  letter-spacing:.06em;
  text-transform:uppercase;
  white-space:nowrap;
  vertical-align:middle;
}
.complete-strip{
  margin-top:2rem;
  padding:1.1rem 0;
  background:var(--sand);
  border-top:1px solid var(--line);
}
.complete-inner{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1.5rem;
}
.complete-inner h2{
  grid-column:1/-1;
  margin:0;
  font-family:var(--mono);
  font-size:.74rem;
  font-weight:500;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.complete-item{
  font-size:.82rem;
}
.complete-item::before{
  content:"□";
  margin-right:.45rem;
  color:var(--rust);
  font-weight:800;
}

@media(max-width:900px){
  .hero-grid,.week-top,.content-row,.tools-layout{grid-template-columns:1fr}
  .main-grid{grid-template-columns:1fr}
  .panel,.panel + .panel{
    padding:1.7rem 0;
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .panel:last-child{border-bottom:0}
  .tool-grid{grid-template-columns:repeat(2,1fr)}
  .tool{padding:1rem;border-bottom:1px solid var(--line)}
  .tool:nth-child(2){border-right:0}
  .journey{border-left:0;padding-left:0}
  .week-layout{grid-template-columns:1fr}
  .week-sidebar{border-right:0;border-bottom:1px solid var(--line)}
  .side-nav{display:flex;flex-wrap:wrap}
  .week-sidebar h1{margin-bottom:.8rem}
}
@media(max-width:650px){
  body{font-size:16px}
  .header-inner{display:block;padding:.8rem 0}
  .brand small{display:none}
  .primary-nav ul{margin-top:.4rem;gap:.1rem .8rem}
  .primary-nav a{padding:.45rem 0}
  .week-days,.info-grid,.complete-inner{grid-template-columns:1fr}
  .day{padding:.7rem 0;border-right:0;border-bottom:1px solid var(--line)}
  .tool-grid{grid-template-columns:1fr}
  .tool{border-right:0}
  .meeting{grid-template-columns:1fr}
  .footer-inner{display:block}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}
@media print{
  .site-header,.week-sidebar,.actions,.site-footer{display:none}
  .week-layout,.week-top,.content-row{display:block}
  body{background:#fff;color:#000}
}

/* ---- Homepage: "Now playing" strip ---- */
.now{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(17rem,1fr);
  gap:0 clamp(1.5rem,3vw,3rem);
  border-bottom:1px solid var(--line);
}
.now-main{
  padding:2.2rem clamp(1.2rem,2.9vw,2.6rem) 2.5rem 0;
  border-right:1px solid var(--line);
}
.now-title{
  margin:0 0 .6rem;
  font-size:clamp(1.4rem,3.2vw,2.1rem);
  letter-spacing:-.02em;
  text-transform:uppercase;
  line-height:1.02;
}
.now-title .wkno{color:var(--rust)}
.now-main > p{max-width:38rem;color:var(--ink-2);margin:.4rem 0 1rem}
.mwf{
  list-style:none;
  margin:1.1rem 0;
  padding:0;
  display:grid;
  gap:.45rem;
  max-width:36rem;
}
.mwf li{
  display:grid;
  grid-template-columns:7.5rem 1fr;
  gap:.8rem;
  align-items:baseline;
  font-size:.92rem;
  border-top:1px solid var(--line);
  padding-top:.45rem;
}
.mwf li strong{
  font-family:var(--mono);
  font-size:.74rem;
  font-weight:500;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--rust);
}
.link-arrow{
  display:inline-block;
  font-weight:700;
  text-decoration:none;
  font-size:.9rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--ink);
  border-bottom:3px solid var(--underline);
}
.link-arrow:hover{background:var(--underline);color:var(--ink)}
.now-side{
  padding:2.2rem 0 2.5rem;
}
.side-heading{
  margin:0 0 1rem;
  font-size:1.05rem;
  text-transform:uppercase;
}
.assess{margin-top:1.8rem}
.assess-row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:.15rem .6rem;
  font-size:.85rem;
  padding:.34rem 0 .45rem;
  border-top:1px solid var(--line);
  align-items:center;
}
.assess-row .pct{
  font-family:var(--mono);
  font-weight:500;
  color:var(--rust-dark);
}
.assess-bar{
  grid-column:1/-1;
  height:6px;
  background:var(--line);
}
.assess-bar i{display:block;height:100%;background:var(--rust)}

/* ---- Homepage: catalog series (course schedule) ---- */
.catalog-heading{
  font-size:clamp(1.5rem,4vw,2.3rem);
  letter-spacing:-.02em;
}
.unit{
  --accent:var(--rust);
  display:grid;
  grid-template-columns:minmax(10rem,.55fr) minmax(0,1.6fr);
  gap:1.2rem;
  border-top:3px solid var(--ink);
  padding:1.4rem 0 1.7rem;
}
.unit.u2{--accent:#f26d21}
.unit.u3{--accent:#1e8a5a}
.unit.u4{--accent:#d33a2c}
.unit-label .chip{
  display:inline-block;
  background:var(--accent);
  color:var(--cream);
  font-family:var(--display);
  font-size:.95rem;
  text-transform:uppercase;
  padding:.45rem .7rem .4rem;
  letter-spacing:.01em;
}
.unit-label .range{
  display:block;
  margin-top:.55rem;
  font-family:var(--mono);
  font-size:.74rem;
  color:var(--ink-2);
}
.unit.now-playing .range::after{
  content:"● Now playing";
  display:block;
  margin-top:.35rem;
  color:var(--accent);
  font-weight:500;
}
.unit-body p{
  margin:0 0 .9rem;
  color:var(--ink-2);
  font-size:.92rem;
  max-width:44rem;
}
.wk-list{list-style:none;margin:0;padding:0}
.wk-list li{
  display:grid;
  grid-template-columns:8.6rem 1fr;
  gap:.9rem;
  align-items:baseline;
  border-top:1px solid var(--line);
  padding:.5rem 0;
}
.wk-list .no{
  font-family:var(--mono);
  font-size:.76rem;
  font-weight:500;
  letter-spacing:.04em;
  color:var(--accent);
}
.wk-list a{
  text-decoration:none;
  font-weight:600;
  font-size:.95rem;
  color:var(--ink);
}
.wk-list a:hover{color:var(--accent);text-decoration:underline}

/* ---- Homepage: tool tiles (invert on hover) ---- */
a.tool{
  --accent:var(--rust);
  display:block;
  padding:1.4rem 1.05rem 1.5rem;
  text-decoration:none;
  color:var(--ink);
}
a.tool:nth-child(2){--accent:#f26d21}
a.tool:nth-child(3){--accent:#1e8a5a}
a.tool:nth-child(4){--accent:#d33a2c}
a.tool:first-child{padding-left:0}
a.tool .eyebrow{margin-bottom:.35rem;color:var(--accent)}
a.tool:hover{background:var(--accent);color:var(--cream);padding-left:1.05rem}
a.tool:hover .eyebrow,
a.tool:hover p{color:inherit}

@media(max-width:900px){
  .hero-wide,.now,.unit{grid-template-columns:1fr}
  .now-main{border-right:0;border-bottom:1px solid var(--line)}
}
@media(max-width:560px){
  .mwf li,.wk-list li{grid-template-columns:1fr;gap:.1rem}
}

/* Accessibility and mobile refinements */
[id] { scroll-margin-top: 6rem; }
a, button, summary { touch-action: manipulation; }
.primary-nav a { min-height: 2.75rem; display: inline-flex; align-items: center; }
.text-link { min-height: 2.25rem; display: inline-flex; align-items: center; }
img { height: auto; }
figcaption { max-width: 72ch; }
.main-grid > *, .hero-grid > *, .week-top > *, .content-row > * { min-width: 0; }
@media (max-width: 650px) {
  .site-header { position: static; }
  [id] { scroll-margin-top: 1rem; }
  .primary-nav ul { gap: .2rem .9rem; }
  .primary-nav a { min-height: 2.75rem; padding: .55rem 0; }
  h1 { overflow-wrap: break-word; }
  .actions .button { width: 100%; }
  .local-nav { gap: .3rem .8rem; }
  .local-nav a { min-height: 2.5rem; display: inline-flex; align-items: center; }
}