/* Shared rhythm for the two educational overviews, each with its own demonstration. */
#sr-landing .sr-topic-hero { padding-block:85px 52px; }
#sr-landing .sr-topic-hero h1 { max-width:1130px; font-size:clamp(46px,6.2cqw,86px); font-weight:400; letter-spacing:-.055em; line-height:1.06; }
#sr-landing .sr-topic-lead { margin-top:30px; max-width:670px; font-size:21px; line-height:1.55; color:var(--sr-muted); }
#sr-landing .sr-topic-hero-foot { display:flex; justify-content:space-between; align-items:center; gap:25px; border-top:1px solid var(--sr-line); margin-top:58px; padding-top:22px; }
#sr-landing .sr-topic-hero-foot > p { font-size:14px; color:#b7bfbc; }
#sr-landing .sr-topic-hero-foot > p span { margin-inline:17px; color:#ad8e74; }
#sr-landing .sr-topic-feature { padding-block:82px 0; background:#121617; }
#sr-landing .sr-topic-feature h2, #sr-landing .sr-topic-depth h2 { font-size:clamp(34px,4cqw,54px); line-height:1.1; }
#sr-landing .sr-topic-section-lead { margin-top:25px; max-width:660px; font-size:18px; line-height:1.65; color:var(--sr-muted); }
#sr-landing .sr-topic-depth { padding-block:85px; }
#sr-landing .sr-topic-reading { margin-top:43px; }
#sr-landing .sr-topic-reading > a { display:grid; grid-template-columns:55px minmax(0,1fr) 25px; gap:25px; padding-block:29px; border-top:1px solid var(--sr-line); }
#sr-landing .sr-topic-reading > a:last-child { border-bottom:1px solid var(--sr-line); }
#sr-landing .sr-topic-reading .sr-mono { color:#bda087; padding-top:6px; }
#sr-landing .sr-topic-reading h3 { font-size:29px; font-weight:400; line-height:1.25; letter-spacing:-.03em; }
#sr-landing .sr-topic-reading p { margin-top:9px; font-size:16px; line-height:1.65; color:var(--sr-muted); max-width:780px; }
#sr-landing .sr-topic-reading-arrow { font-size:24px; transition:transform .2s; }
#sr-landing .sr-topic-reading a:hover .sr-topic-reading-arrow { color:var(--sr-orange); transform:translate(3px,-3px); }
#sr-landing .sr-topic-reading a:hover h3 { text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:7px; text-decoration-color:#8c796a; }
#sr-landing .sr-topic-invitation { margin-top:65px; padding:48px; background:#191d1e; }
#sr-landing .sr-topic-invitation h3 { font-size:clamp(29px,3.3cqw,44px); font-weight:400; line-height:1.1; letter-spacing:-.04em; }
#sr-landing .sr-topic-invitation > p { margin-top:22px; max-width:620px; font-size:17px; line-height:1.65; color:var(--sr-muted); }
#sr-landing .sr-topic-invitation > .sr-primary { margin-top:28px; }
#sr-landing .sr-topic-faq { padding-block:70px 90px; }
#sr-landing .sr-topic-faq-inner { max-width:920px; margin-inline:auto; }
#sr-landing .sr-topic-faq h2 { font-size:clamp(34px,4cqw,50px); }
#sr-landing .sr-topic-faq .sr-faq { margin-top:35px; }
#sr-landing .sr-topic-faq details { padding-block:23px; border-color:var(--sr-line); }
#sr-landing .sr-topic-faq details p { max-width:760px; color:var(--sr-muted); }
#sr-landing .sr-topic-faq details[open] summary { color:#e9bb98; }
@container (max-width:760px) {
  #sr-landing .sr-topic-hero { padding-block:58px 38px; }
  #sr-landing .sr-topic-hero h1 { font-size:clamp(42px,7.2cqw,60px); }
  #sr-landing .sr-topic-lead { font-size:19px; }
  #sr-landing .sr-topic-hero-foot { margin-top:40px; }
  #sr-landing .sr-topic-feature { padding-top:55px; }
  #sr-landing .sr-topic-section-lead { font-size:17px; }
  #sr-landing .sr-topic-depth { padding-block:55px; }
  #sr-landing .sr-topic-reading > a { grid-template-columns:30px 1fr 22px; gap:15px; padding-block:25px; }
  #sr-landing .sr-topic-reading h3 { font-size:25px; }
  #sr-landing .sr-topic-invitation { padding:32px; margin-top:40px; }
  #sr-landing .sr-topic-faq { padding-block:55px 65px; }
}
@container (max-width:480px) {
  #sr-landing .sr-topic-hero h1 { font-size:43px; }
  #sr-landing .sr-topic-hero-foot { align-items:flex-start; flex-direction:column; gap:14px; }
  #sr-landing .sr-topic-lead br, #sr-landing .sr-topic-section-lead br { display:none; }
  #sr-landing .sr-topic-reading > a { grid-template-columns:22px 1fr 18px; gap:12px; }
  #sr-landing .sr-topic-reading h3 { font-size:24px; }
  #sr-landing .sr-topic-invitation { padding:30px 24px; }
  #sr-landing .sr-topic-invitation .sr-primary { gap:12px; font-size:14px; }
}
