/* Topic (chapter) page: head, one pick, guides grouped by sub, other chapters. */
.tpc{padding:20px 0 56px}
.tpc-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:18px 0 28px}
.tpc-head h1{font-size:clamp(34px,4.4vw,54px);line-height:1.04;letter-spacing:-.02em;margin:8px 0 10px;max-width:18ch}
.tpc-lead{margin:0;font-size:18px;line-height:1.5;color:var(--ink-soft);max-width:56ch}
.tpc-ic{flex:none;width:96px;height:96px;display:grid;place-items:center;border-radius:50%;background:var(--mint);color:var(--aqua)}
.tpc-ic svg{width:48px;height:48px;stroke-width:1.4}
.tpc-pick{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:0;border:1px solid var(--rule);border-radius:16px;overflow:hidden;background:#fff;color:var(--ink)!important;text-decoration:none!important;box-shadow:0 1px 2px rgba(7,62,73,.04);transition:transform .16s var(--ease),box-shadow .16s}
.tpc-pick:hover{transform:translateY(-2px);box-shadow:0 14px 28px -14px rgba(7,62,73,.32)}
.tpc-pick-ph{display:block;position:relative;aspect-ratio:1.6;overflow:hidden;background:var(--mint)}
.tpc-pick-ph img{width:100%;height:100%;object-fit:cover}
.tpc-pick-tile{position:absolute;left:14px;bottom:14px;width:150px;border-radius:8px;overflow:hidden;box-shadow:0 10px 24px -8px rgba(7,62,73,.5)}
.tpc-pick-tile .sv-thumbnail{box-shadow:none}
.tpc-pick-tile .sv-thumbnail::before{display:none}
.tpc-pick-th{display:block;aspect-ratio:1.6}
.tpc-pick-th .sv-thumbnail{border-radius:0;box-shadow:none;height:100%}
.tpc-pick-th .sv-thumbnail::before{display:none}
.tpc-pick-b{display:flex;flex-direction:column;justify-content:center;gap:10px;padding:28px 32px}
.tpc-pick-b b{font-family:var(--serif);font-weight:700;font-size:clamp(22px,2.2vw,28px);line-height:1.15;font-variation-settings:"opsz" 36}
.tpc-pick-b small{font-size:15.5px;line-height:1.5;color:var(--ink-soft)}
.tpc-group{margin-top:40px}
.tpc-group h2{font-size:24px;margin:0 0 4px;font-variation-settings:"opsz" 36}
.tpc-group .fd-results{margin-top:16px}
.tpc-others{margin-top:56px;padding-top:28px;border-top:1px solid var(--rule)}
.tpc-others ul{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.tpc-others a{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--rule-soft);border-radius:12px;background:#fff;color:var(--ink)!important;text-decoration:none!important;transition:border-color .16s,transform .16s}
.tpc-others a:hover{border-color:var(--ink);transform:translateY(-1px)}
.tpc-others a>span:not(.tpc-o-ic){display:flex;flex-direction:column;flex:1;line-height:1.3}
.tpc-others b{font-size:16px}
.tpc-others small{font-size:13.5px;color:var(--ink-mute)}
.tpc-o-ic{flex:none;width:40px;height:40px;display:grid;place-items:center;border-radius:10px;background:var(--mint);color:var(--aqua-deep)}
.tpc-o-ic svg{width:22px;height:22px;stroke-width:1.6}
.tpc-others a>svg{width:16px;height:16px;fill:none;stroke:var(--ink-mute);stroke-width:2}
@media (max-width:860px){.tpc-pick{grid-template-columns:1fr}.tpc-pick-b{padding:18px 18px 20px}}
@media (max-width:760px){
 .tpc{padding:14px 0 40px}
 .tpc-head{margin:14px 0 20px}
 .tpc-ic{display:none}
 .tpc-head h1{font-size:clamp(30px,8.6vw,38px)}
 .tpc-lead{font-size:16px}
 .tpc-group{margin-top:28px}
 .tpc-group h2{font-size:21px}
 .tpc-others ul{grid-template-columns:1fr}
}
