/* About / terms / contact */
.in-hero { position: relative; overflow: hidden; isolation: isolate; color: var(--cream-hi); padding: 42px 0 100px;
    background: radial-gradient(90% 140% at 80% 0%, var(--espresso-3), var(--espresso) 70%); }
.in-hero::before { content: ''; position: absolute; z-index: -1; width: 560px; height: 560px; left: -140px; top: -260px; border-radius: 50%;
    background: radial-gradient(circle, rgba(243,217,139,.18), transparent 65%); }
.crumbs { display: flex; gap: 8px; align-items: center; font-size: 12.5px; color: rgba(251,246,234,.55); margin-bottom: 12px; }
.crumbs a { color: var(--gold); }
.in-hero h1 { margin: 0; font-size: 32px; font-weight: 900; background: linear-gradient(120deg, var(--gold-hi), var(--gold) 55%, var(--gold-2)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.in-hero .lead { margin: 12px 0 0; max-width: 640px; font-size: 15.5px; line-height: 2; color: rgba(251,246,234,.78); }

.in-body { margin-top: -64px; padding-bottom: 80px; position: relative; z-index: 2; }
.in-body.has-toc { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 24px; align-items: start; }
.in-toc { position: sticky; top: 90px; display: flex; flex-direction: column; gap: 2px; padding: 18px; border-radius: 22px; background: var(--bg-alt); border: 1px solid var(--line); box-shadow: 0 20px 50px -34px rgba(46,32,21,.5); }
.in-toc b { font-size: 13px; margin-bottom: 8px; color: var(--ink); }
.in-toc a { padding: 7px 10px; border-radius: 10px; font-size: 13.5px; color: var(--ink-soft); }
.in-toc a:hover { background: #FBF3E3; color: var(--bronze); }
.in-card { max-width: 860px; padding: 34px 38px; border-radius: 28px; background: var(--bg-alt); border: 1px solid var(--line); box-shadow: 0 24px 60px -36px rgba(46,32,21,.5); }
.prose { font-size: 15px; line-height: 2.15; color: var(--ink-soft); }
.prose h2 { margin: 30px 0 10px; font-size: 20px; font-weight: 900; color: var(--ink); scroll-margin-top: 90px; display: flex; align-items: center; gap: 10px; }
.prose h2::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 5px rgba(201,162,75,.18); }
.prose h2:first-child { margin-top: 0; }
.prose h3 { margin: 22px 0 8px; font-size: 16.5px; color: var(--ink); }
.prose p { margin: 0 0 14px; }
.prose ul { margin: 0 0 16px; padding: 0 22px 0 0; }
.prose li { margin-bottom: 6px; }
.prose li::marker { color: var(--gold); }
.prose strong { color: var(--ink); }
.in-upd { margin: 26px 0 0; font-size: 12.5px; color: var(--muted); }

.ct-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; margin-bottom: 22px; }
.ct { display: flex; flex-direction: column; gap: 2px; padding: 18px; border-radius: 20px; background: #fff; border: 1px solid var(--line); transition: transform .2s, box-shadow .2s, border-color .2s; }
.ct:hover { transform: translateY(-3px); border-color: #E3CFA8; box-shadow: 0 16px 30px -20px rgba(46,32,21,.5); }
.ct .ic { font-size: 24px; margin-bottom: 6px; }
.ct small { font-size: 12px; color: var(--muted); }
.ct b { font-size: 15px; color: var(--ink); text-align: right; }
.ct-dl { margin: 0 0 22px; display: flex; flex-direction: column; gap: 10px; }
.ct-dl div { padding: 14px 16px; border-radius: 16px; background: #FFFBF3; border: 1px solid #F1E4CB; }
.ct-dl dt { font-size: 13px; font-weight: 800; color: var(--ink); margin-bottom: 4px; }
.ct-dl dd { margin: 0; font-size: 14px; line-height: 1.9; color: var(--ink-soft); }
.ct-cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.btn-ghost-light { display: inline-flex; align-items: center; padding: 12px 20px; border-radius: 30px; font-size: 14px; font-weight: 700; color: var(--bronze); border: 1.5px solid #E3CFA8; background: #fff; }
.btn-ghost-light:hover { border-color: var(--bronze); }

@media (max-width: 900px) {
    .in-body.has-toc { grid-template-columns: 1fr; }
    .in-toc { position: static; flex-direction: row; flex-wrap: wrap; gap: 6px; }
    .in-toc b { width: 100%; margin-bottom: 2px; }
    .in-toc a { background: #FBF3E3; }
}
@media (max-width: 560px) {
    .in-hero { padding: 28px 0 86px; }
    .in-hero h1 { font-size: 25px; }
    .in-card { padding: 24px 18px; border-radius: 22px; }
    .prose { font-size: 14.5px; }
}

/* 404 */
.nf-hero { padding: 70px 0 90px; text-align: center; }
.nf-hero .lead { margin: 12px auto 0; }
.nf-code { font-size: clamp(80px, 22vw, 150px); font-weight: 900; line-height: 1; opacity: .9;
    background: linear-gradient(120deg, #FFF1C9, #F3D98B 45%, #C9A24B); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nf-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 28px; }
.nf-a { display: inline-flex; align-items: center; padding: 13px 20px; border-radius: 30px; font-size: 14.5px; font-weight: 700; color: var(--cream-hi); border: 1.5px solid rgba(216,185,138,.35); }
.nf-a:hover { color: var(--gold-hi); border-color: var(--gold); }