:root{
  --content:#FAFBFC;
  --sidebar:#E8EEF2;
  --ink:#0F172A;
  --link:#1E3A8A;
  --rule:rgba(15,23,42,.14);
  --soft:rgba(15,23,42,.62);
}

*{box-sizing:border-box}

html{scroll-behavior:smooth}

body{
  margin:0;
  background:var(--content);
  color:var(--ink);
  font-family:"Source Sans 3",system-ui,sans-serif;
  font-size:17px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}

a{color:var(--link)}
a:hover{text-decoration:none}

img{max-width:100%;height:auto;display:block}

/* ---------- top bar ---------- */
.topbar{
  position:sticky;
  top:0;
  z-index:20;
  background:var(--sidebar);
  border-bottom:1px solid var(--rule);
}
.topbar-inner{
  max-width:1120px;
  margin:0 auto;
  padding:10px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}
.brand-group{display:flex;align-items:center;gap:10px}
.brand{
  font-weight:700;
  font-size:1.05rem;
  letter-spacing:.01em;
  color:var(--ink);
  text-decoration:none;
}
.docs-chip{
  border:1px solid var(--link);
  color:var(--link);
  border-radius:3px;
  padding:0 7px;
  font-size:.7rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  line-height:1.7;
}
.topbar-phone{margin:0;font-size:.92rem;color:var(--soft)}
.topbar-phone a{font-weight:600}

/* ---------- docs shell ---------- */
.shell{
  max-width:1120px;
  margin:0 auto;
  padding:30px 20px 60px;
  display:grid;
  grid-template-columns:252px minmax(0,1fr);
  column-gap:46px;
  align-items:start;
}
.shell-single{grid-template-columns:minmax(0,1fr)}
.shell > section,
.shell > footer{grid-column:2}
.shell-single > section,
.shell-single > footer{grid-column:1}

/* ---------- TOC ---------- */
.toc{
  grid-column:1;
  grid-row:1 / span 5;
  position:sticky;
  top:72px;
  background:var(--sidebar);
  border:1px solid var(--rule);
  border-radius:4px;
  padding:18px 16px;
}
.toc-title{
  margin:0 0 10px;
  font-size:.7rem;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:var(--soft);
}
.toc-list{list-style:none;margin:0;padding:0}
.toc-list li{border-top:1px solid var(--rule)}
.toc-list li:first-child{border-top:0}
.toc-list a{
  display:flex;
  gap:10px;
  align-items:baseline;
  padding:7px 4px;
  text-decoration:none;
  color:var(--ink);
  font-size:.95rem;
}
.toc-list a:hover{color:var(--link)}
.toc-list a .idx{
  font-family:"Space Mono",ui-monospace,monospace;
  font-weight:700;
  font-size:.72rem;
  color:var(--soft);
  min-width:26px;
}
.toc-list a.is-active{color:var(--link);font-weight:600}
.toc-list a.is-active .idx{color:var(--link)}
.toc-note{
  margin:14px 0 0;
  padding-top:12px;
  border-top:1px solid var(--rule);
  font-size:.82rem;
  color:var(--soft);
}

/* ---------- sections ---------- */
.doc-section{
  padding:6px 0 36px;
  border-bottom:1px solid var(--rule);
  margin-bottom:34px;
  scroll-margin-top:84px;
}
.doc-section:last-of-type{border-bottom:0}
.eyebrow{
  margin:0 0 6px;
  font-size:.7rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--soft);
}
h1{
  font-size:clamp(1.65rem,3.4vw,2.3rem);
  line-height:1.18;
  margin:0 0 14px;
  letter-spacing:-.015em;
}
h2{
  font-size:1.3rem;
  margin:0 0 12px;
  letter-spacing:-.01em;
}
.lede{font-size:1.06rem;margin:0 0 22px;max-width:62ch}
.doc-section p{max-width:68ch}

/* ---------- figures ---------- */
.doc-figure{
  margin:0 0 26px;
  border:1px solid var(--rule);
  border-radius:4px;
  background:var(--sidebar);
  padding:10px;
}
.doc-figure img{border-radius:3px}
.doc-figure figcaption{
  margin-top:8px;
  font-size:.82rem;
  color:var(--soft);
}
.doc-figure.side{margin:0;flex:1 1 280px}

/* ---------- definition blocks ---------- */
.defs{margin:0}
.def{
  border:1px solid var(--rule);
  border-left:3px solid var(--link);
  border-radius:4px;
  background:#fff;
  padding:18px 20px;
  margin-bottom:16px;
}
.def dt{
  font-weight:700;
  font-size:1.07rem;
  margin-bottom:6px;
}
.def dd{margin:0}
.def dd p{margin:0 0 12px}

.fields{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.fields li,
.fields > div{
  display:grid;
  grid-template-columns:96px minmax(0,1fr);
  gap:10px;
  padding:6px 0;
  border-bottom:1px solid var(--rule);
}
.fields li:last-child,
.fields > div:last-child{border-bottom:0}
.k{
  font-size:.72rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--soft);
  font-weight:600;
  margin:0;
}
.v{font-size:.95rem;margin:0}

/* ---------- callout ---------- */
.callout{
  background:var(--sidebar);
  border:1px solid var(--rule);
  border-left:3px solid var(--ink);
  border-radius:4px;
  padding:14px 18px;
  margin:0 0 18px;
}
.callout-line{margin:0;font-weight:600}

/* ---------- quote ---------- */
.quote-row{
  display:flex;
  gap:24px;
  align-items:flex-start;
  flex-wrap:wrap;
}
.pull{
  margin:0;
  flex:2 1 320px;
  border-top:2px solid var(--link);
  padding-top:14px;
}
.pull p{
  margin:0 0 10px;
  font-size:1.18rem;
  line-height:1.45;
}
.pull cite{
  font-style:normal;
  font-size:.85rem;
  color:var(--soft);
  letter-spacing:.04em;
}

/* ---------- reviews ---------- */
.reviews{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:14px;
}
.reviews li{
  border:1px solid var(--rule);
  border-radius:4px;
  background:#fff;
  padding:14px 16px;
}
.reviews li p{margin:0}
.rev-src{
  margin-top:8px !important;
  font-size:.78rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--soft);
}

/* ---------- contact ---------- */
.contact-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:28px;
  margin-top:18px;
}
.contact-fields{border-top:1px solid var(--rule)}
.form{
  background:var(--sidebar);
  border:1px solid var(--rule);
  border-radius:4px;
  padding:18px;
}
.field{margin-bottom:12px}
.field label{
  display:block;
  font-size:.72rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--soft);
  font-weight:600;
  margin-bottom:4px;
}
.field input,
.field textarea{
  width:100%;
  font:inherit;
  color:var(--ink);
  background:#fff;
  border:1px solid var(--rule);
  border-radius:3px;
  padding:8px 10px;
}
.field input:focus,
.field textarea:focus{
  outline:2px solid var(--link);
  outline-offset:1px;
  border-color:var(--link);
}
.field input.invalid,
.field textarea.invalid{border-color:var(--link);background:#fff}
.consent{
  display:flex;
  gap:8px;
  align-items:flex-start;
  font-size:.88rem;
  margin-bottom:14px;
}
.form button{
  font:inherit;
  font-weight:600;
  background:var(--link);
  color:#fff;
  border:1px solid var(--link);
  border-radius:3px;
  padding:9px 18px;
  cursor:pointer;
}
.form button:hover{background:var(--ink);border-color:var(--ink)}
.form-status{
  margin:10px 0 0;
  font-size:.88rem;
  min-height:1.2em;
  color:var(--link);
}

/* ---------- footer ---------- */
.doc-footer{
  border-top:1px solid var(--rule);
  padding-top:18px;
  margin-top:10px;
  color:var(--soft);
  font-size:.9rem;
}
.foot-brand{margin:0 0 8px;color:var(--ink);font-weight:600}
.foot-links{margin:0 0 6px;display:flex;flex-wrap:wrap;gap:16px}
.foot-note{margin:0}
.back-link{margin-top:26px}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .shell{
    display:flex;
    flex-direction:column;
    column-gap:0;
    padding-top:22px;
  }
  .toc{
    order:-1;
    position:static;
    margin-bottom:26px;
    padding:14px;
  }
  .toc-list{
    display:flex;
    gap:8px;
    overflow-x:auto;
    padding-bottom:4px;
  }
  .toc-list li{border-top:0}
  .toc-list a{
    white-space:nowrap;
    border:1px solid var(--rule);
    border-radius:999px;
    background:#fff;
    padding:6px 12px;
  }
  .contact-grid{grid-template-columns:minmax(0,1fr)}
}

@media (max-width:520px){
  body{font-size:16px}
  .fields li,
  .fields > div{grid-template-columns:minmax(0,1fr);gap:2px}
  .def{padding:16px}
}