.topicsHub{
  --topics-gold:#b58a35;
  --topics-red:#a51f23;
  --topics-ink:#24211f;
  --topics-muted:#65605a;
  --topics-line:#ddd8d1;
  --topics-soft:#f5f4f1;
  --topics-serif:Georgia,"Times New Roman",serif;
  --topics-sans:Arial,Helvetica,sans-serif;
  padding:3px 0 8px;
}
.topicsHubIntro{max-width:850px;padding:4px 0 32px;border-bottom:1px solid var(--topics-line)}
.topicsHubKicker,
.topicsSectionHeading>span,
.topicsGroupHead>span,
.topicsClosing>div>span{
  display:block;
  margin-bottom:10px;
  color:var(--topics-red);
  font:800 10px/1 var(--topics-sans);
  letter-spacing:.14em;
}
.topicsHubIntro h1{
  margin:0;
  color:var(--topics-ink);
  font:600 clamp(38px,5vw,56px)/1.01 var(--topics-serif);
  letter-spacing:-.035em;
}
.topicsHubIntro p{
  max-width:800px;
  margin:15px 0 0;
  color:var(--topics-muted);
  font-size:16px;
  line-height:1.72;
}
.topicsFeatured{padding:34px 0 39px;border-bottom:1px solid var(--topics-line)}
.topicsSectionHeading{display:grid;grid-template-columns:150px minmax(0,1fr);gap:24px;align-items:start;margin-bottom:21px}
.topicsSectionHeading>span{margin:7px 0 0;color:#77716a}
.topicsSectionHeading h2,
.topicsGroupHead h2,
.topicsClosing h2{
  margin:0;
  color:var(--topics-ink);
  font-family:var(--topics-serif);
  font-weight:600;
  letter-spacing:-.025em;
}
.topicsSectionHeading h2{max-width:660px;font-size:30px;line-height:1.08}
.topicsFeaturedGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:4px solid var(--topics-gold);border-bottom:1px solid #d7d3cc;background:var(--topics-soft)}
.topicsFeature{display:flex;flex-direction:column;min-height:255px;padding:23px 22px 22px;color:inherit;text-decoration:none}
.topicsFeature+.topicsFeature{border-left:1px solid #d7d3cc}
.topicsFeature:hover{background:#fff}
.topicsFeatureNumber{margin-bottom:24px;color:var(--topics-gold);font:800 11px/1 var(--topics-sans);letter-spacing:.08em}
.topicsFeature h3{margin:0;color:#292522;font:600 23px/1.08 var(--topics-serif);letter-spacing:-.02em}
.topicsFeature p{margin:12px 0 20px;color:#625d57;font-size:13px;line-height:1.58}
.topicsFeature strong{margin-top:auto;color:var(--topics-red);font:800 10px/1.2 var(--topics-sans);letter-spacing:.055em;text-transform:uppercase}
.topicsGroups{padding-top:3px}
.topicsGroup{display:grid;grid-template-columns:minmax(190px,.42fr) minmax(0,1fr);gap:34px;padding:35px 0 37px;border-bottom:1px solid var(--topics-line)}
.topicsGroupHead>span{margin:3px 0 11px;color:var(--topics-gold)}
.topicsGroupHead h2{max-width:310px;font-size:25px;line-height:1.12}
.topicsLinkList{border-top:1px solid #d9d5ce}
.topicsLinkList>a{display:grid;grid-template-columns:minmax(0,1fr) 28px;gap:18px;align-items:center;padding:17px 4px 17px 0;border-bottom:1px solid #e4e0da;text-decoration:none}
.topicsLinkList>a:hover strong{color:var(--topics-red)}
.topicsLinkList>a:hover b{transform:translateX(3px);color:var(--topics-red)}
.topicsLinkList span{display:block;min-width:0}
.topicsLinkList strong{display:block;color:#302c29;font:600 18px/1.16 var(--topics-serif);transition:color .15s ease}
.topicsLinkList small{display:block;margin-top:5px;color:#716b65;font:400 12px/1.5 var(--topics-sans)}
.topicsLinkList b{justify-self:end;color:#9a9288;font:400 20px/1 var(--topics-sans);transition:transform .15s ease,color .15s ease}
.topicsGroupSelling{border-bottom:0}
.topicsClosing{display:grid;grid-template-columns:minmax(240px,.72fr) minmax(0,1fr);gap:38px;margin:8px 0 10px;padding:28px 29px;background:#efefed;border-top:4px solid var(--topics-gold)}
.topicsClosing>div>span{margin-bottom:8px}
.topicsClosing h2{font-size:25px;line-height:1.1}
.topicsClosing p{margin:1px 0 0;color:#5d5852;font-size:13px;line-height:1.65}
@media(max-width:900px){
  .topicsFeaturedGrid{grid-template-columns:1fr}
  .topicsFeature{min-height:0}
  .topicsFeature+.topicsFeature{border-left:0;border-top:1px solid #d7d3cc}
}
@media(max-width:760px){
  .topicsHubIntro{padding-bottom:25px}
  .topicsFeatured{padding:28px 0 31px}
  .topicsSectionHeading{grid-template-columns:1fr;gap:4px}
  .topicsSectionHeading>span{margin:0}
  .topicsSectionHeading h2{font-size:27px}
  .topicsGroup{grid-template-columns:1fr;gap:19px;padding:29px 0 31px}
  .topicsGroupHead h2{max-width:none}
  .topicsClosing{grid-template-columns:1fr;gap:15px;padding:23px 21px}
}
@media(prefers-reduced-motion:reduce){
  .topicsLinkList b{transition:none}
}
