/* Selection layer adapted from React Bits AnimatedList (David Haz, 2026).
   MIT + Commons Clause; see /licenses/react-bits-LICENSE.txt. */
.topic-tabs{display:grid;grid-template-columns:minmax(250px,.85fr) minmax(0,1.65fr);gap:36px;margin-top:48px;align-items:start}
.topic-menu,.topic-panels{min-width:0}
.topic-menu-label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 17px 16px;font-weight:500}
.topic-swipe-hint{display:none}
.topic-tab-list{position:relative;display:flex;flex-direction:column;gap:5px;isolation:isolate}
.topic-tab{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:62px;padding:17px 18px;border:1px solid transparent;border-radius:12px;color:var(--ink);font-size:15px;line-height:1.45;text-decoration:none;transition:color .2s,background .2s}
.topic-tab:hover{background:rgb(255 253 251 / .5)}
.topic-tab-arrow{flex-shrink:0;font-size:20px;color:var(--accent);opacity:.55;transition:opacity .2s}
.topic-tab[aria-selected="true"]{color:var(--accent);font-weight:500;border-color:var(--accent);background:rgb(255 253 251 / .35)}
.topic-tab[aria-selected="true"] .topic-tab-arrow{opacity:1}
.topic-tab:focus-visible{outline-offset:2px}
.topic-selection{display:none;position:absolute;top:0;left:0;z-index:0;pointer-events:none}
.is-enhanced .topic-selection{display:block}
.topic-selection-ring{position:absolute;inset:0;border-radius:12px;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line)}
.topic-panels{display:grid;gap:24px}
.is-enhanced .topic-panels{gap:0}
.is-enhanced .topic-panel{grid-area:1/1;align-self:stretch}
.topic-panel{padding:36px 40px 34px;background:var(--surface);border:1px solid #e8cdc7;border-radius:20px;scroll-margin-top:30px}
.topic-panel:focus-visible{outline:3px solid var(--accent);outline-offset:5px}
.topic-panel-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:30px}
.topic-panel-top .eyebrow{margin:0;font-size:10px;letter-spacing:.09em}
.topic-panel-count{color:var(--muted);font-size:11px;white-space:nowrap;font-variant-numeric:tabular-nums}
.topic-panel h3{font-size:clamp(1.85rem,2.7vw,2.65rem);line-height:1.13;max-width:20ch;text-wrap:pretty}
.topic-panel p:not(.eyebrow){font-size:15px;line-height:1.8}
.topic-panel .topic-panel-intro{margin-top:23px}
.topic-panel h4{font:500 15px/1.5 var(--sans);color:var(--ink);letter-spacing:-.01em;margin:25px 0 9px}
.topic-panel .topic-next{padding:18px 22px;margin-top:26px;background:var(--sage-light);border-left:2px solid var(--sage);border-radius:0 12px 12px 0;font-size:14px;color:var(--text)}
.topic-panel>.text-link{margin-top:23px}
@media(max-width:1100px){.topic-tabs{gap:24px;grid-template-columns:minmax(230px,.9fr) minmax(0,1.6fr)}.topic-tab{font-size:14px;padding:15px}.topic-panel{padding:30px}.topic-panel p:not(.eyebrow){font-size:14px}.topic-panel h3{font-size:32px}}
@media(max-width:768px){
  .topic-tabs{grid-template-columns:1fr;gap:22px;margin-top:30px}
  .topic-menu-label{margin:0 0 14px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;font-size:10px}
  .is-enhanced .topic-swipe-hint{display:inline;font-size:10px;letter-spacing:0;text-transform:none}
  .is-enhanced .topic-menu-scroll{overflow-x:auto;padding:5px 3px 13px;margin:-5px -3px 0;scrollbar-width:thin;scrollbar-color:var(--accent) transparent;overscroll-behavior-x:contain}
  .is-enhanced .topic-tab-list{flex-direction:row;width:max-content;gap:8px}
  .is-enhanced .topic-tab{width:215px;min-height:82px;padding:15px 18px;font-size:13px;background:rgb(255 253 251 / .3)}
  .is-enhanced .topic-tab[aria-selected="true"]{background:transparent}
  .topic-panel{padding:26px 24px;border-radius:16px}
  .topic-panel-top{margin-bottom:24px;gap:12px}
  .topic-panel-top .eyebrow{font-size:9px}
  .topic-panel h3{font-size:30px;max-width:22ch}
  .topic-panel p:not(.eyebrow){font-size:14px;line-height:1.8}
  .topic-panel .topic-next{padding:16px 18px;font-size:13px}
}
@media(max-width:420px){.topic-panel{padding:24px 20px}.topic-panel h3{font-size:27px}.topic-panel-top .eyebrow{max-width:18ch}.topic-panel .text-link{font-size:12px;gap:16px}.topic-panel .topic-next{padding:15px}}
@media(forced-colors:active){.topic-selection{display:none!important}.topic-tab[aria-selected="true"]{border:2px solid Highlight;color:Highlight}.topic-tab-arrow{color:inherit}.topic-panel{border-color:CanvasText}}
