/* Pages under the landing: /docs/*, /changelog, /privacy, /support, /security.
 * They reuse the landing's header, footer, rails, command rows (.am-line), step list (.am-steps),
 * table (.am-table) and method cards (.lp-method). This file only sets the page layout and the
 * one new element, the status notice (.at-note). Tokens are the landing's: --ink, --dim, --faint,
 * --rule, --free, --mono. Content fills its grid column; nothing caps it to a narrower measure. */

.at-page{position:relative;z-index:1;padding:64px 0 96px}
.at-page-head{padding-bottom:8px}
.lp main .at-page-head h1{font-size:clamp(34px,3.6vw,46px);font-weight:500;line-height:1.08;letter-spacing:-.035em;text-wrap:balance}
.at-page-head p{margin-top:14px;font-size:17px;line-height:1.6;color:var(--dim)}
.at-page-head code{font:500 15px/1.5 var(--mono);color:var(--ink);background:#f1f2f4;border-radius:6px;padding:2px 7px}

/* Docs: a contents column and the article. */
.at-docs{display:grid;grid-template-columns:220px minmax(0,1fr);gap:56px;align-items:start}
.at-toc{position:sticky;top:84px;display:flex;flex-direction:column;gap:2px;font-size:14px}
.lp .at-toc h5{margin:22px 0 6px;font-size:12.5px;font-weight:600;color:var(--faint)}
.at-toc>div:first-child>h5{margin-top:0}
.at-toc a{padding:5px 10px;margin-left:-10px;border-radius:8px;color:var(--dim)}
.at-toc a:hover{color:var(--ink);background:#f4f5f7}
.at-toc a[aria-current=page]{color:var(--ink);font-weight:600;background:#f1f2f4}

.at-doc{min-width:0}
.lp main .at-doc h2{margin:44px 0 10px;font-size:22px;font-weight:600;line-height:1.25;letter-spacing:-.015em}
.at-doc h3{margin:26px 0 6px;font-size:16px;font-weight:600}
.at-doc p,.at-doc li{font-size:15.5px;line-height:1.65;color:var(--dim)}
.at-doc p+p{margin-top:10px}
.at-doc ul,.at-doc ol{margin:10px 0 0;padding-left:20px}
.at-doc li+li{margin-top:6px}
.at-doc a:not(.lp-arrow):not(.lp-primary){color:var(--ink);text-decoration:underline;text-decoration-color:#c3c7cf;text-underline-offset:3px}
.at-doc a:not(.lp-arrow):not(.lp-primary):hover{text-decoration-color:var(--free)}
.at-doc strong{color:var(--ink);font-weight:600}
.at-doc :not(pre)>code{font:500 13px/1.5 var(--mono);color:var(--ink);background:#f1f2f4;border-radius:6px;padding:2px 6px;overflow-wrap:anywhere}
.at-doc pre{margin:12px 0 0;padding:14px 16px;border:1px solid var(--rule);border-radius:10px;background:#fafbfc;font:500 13px/1.65 var(--mono);color:var(--ink);overflow-x:auto}
.at-doc pre + p{margin-top:12px}
.at-doc .at-video{display:block;margin:24px 0;max-width:100%}
.at-doc .am-steps,.at-doc .am-table,.at-doc .lp-method,.at-doc .at-note{margin-top:16px}
.at-doc ol.am-steps{padding-left:0}
.at-doc .am-steps>li{grid-template-columns:170px minmax(0,1fr)}
.at-doc .am-steps>li+li{margin-top:0}
.at-meta{margin-top:40px;padding-top:16px;border-top:1px solid var(--rule);font-size:13.5px;color:var(--faint)}

/* From the reference file's narrow-screen rules. */
@media(max-width:640px){
  .at-page{padding:40px 0 64px}
  .at-doc .am-steps>li{grid-template-columns:minmax(0,1fr)}
}
