/* ============================================================
   Secondary pages (legal, about, blog, case studies)
   Share the nav + footer of index.html, add document styles.
   ============================================================ */

.doc-wrap{max-width:780px;margin:0 auto;padding:60px 28px 40px}

.doc-head{margin-bottom:40px;padding-bottom:24px;border-bottom:1px dashed var(--line)}
.doc-head .eyebrow{margin-bottom:14px}
.doc-head h1{
  font-family:'Fraunces',serif;font-weight:400;
  font-size:clamp(36px, 4.6vw, 54px);line-height:1.05;letter-spacing:-.03em;
  margin:0;
}
.doc-head h1 em{font-style:italic;color:var(--forest)}
.doc-head .lead{
  margin:18px 0 0;color:var(--ink-soft);font-size:17px;line-height:1.6;max-width:56ch;
}
.doc-head .meta{
  margin-top:18px;font-size:12.5px;color:var(--ink-soft);
  letter-spacing:.02em;font-family:'JetBrains Mono',ui-monospace,monospace;
}

.doc-body{font-size:15.5px;line-height:1.72;color:var(--ink)}
.doc-body h2{
  font-family:'Fraunces',serif;font-weight:500;font-size:26px;letter-spacing:-.02em;
  margin:46px 0 14px;line-height:1.2;
}
.doc-body h3{
  font-family:'Fraunces',serif;font-weight:500;font-size:20px;letter-spacing:-.015em;
  margin:30px 0 10px;
}
.doc-body p{margin:0 0 14px}
.doc-body ul, .doc-body ol{margin:0 0 16px;padding-left:22px}
.doc-body li{margin-bottom:6px}
.doc-body a{color:var(--terracotta);text-decoration:underline;text-decoration-color:rgba(185,83,46,.35);text-underline-offset:3px}
.doc-body a:hover{text-decoration-color:var(--terracotta)}
.doc-body hr{border:0;border-top:1px dashed var(--line);margin:36px 0}
.doc-body strong, .doc-body b{color:var(--ink);font-weight:600}

.doc-body blockquote{
  margin:22px 0;padding:16px 22px;
  background:var(--card);border-left:3px solid var(--ochre);border-radius:0 10px 10px 0;
  font-size:14.5px;color:var(--ink-soft);font-style:italic;
}

.doc-back{
  display:inline-flex;align-items:center;gap:6px;
  margin-bottom:22px;
  font-size:13px;color:var(--ink-soft);font-weight:500;
  padding:7px 14px 7px 10px;border-radius:999px;
  border:1px solid var(--line-soft);background:var(--card);
  transition:all .15s;
}
.doc-back:hover{border-color:var(--ink);color:var(--ink)}
.doc-back svg{width:14px;height:14px;stroke-width:1.8}

/* Post/case-study summary blocks used on blog & case-success indexes */
.doc-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:2px}
.doc-list li{
  padding:22px 0;border-bottom:1px dashed var(--line-soft);
  display:grid;grid-template-columns:120px 1fr auto;gap:22px;align-items:start;
}
.doc-list li:last-child{border-bottom:0}
.doc-list .date{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:11.5px;color:var(--ink-soft);padding-top:3px;
  letter-spacing:.02em;
}
.doc-list .title{font-family:'Fraunces',serif;font-size:20px;font-weight:500;letter-spacing:-.015em;margin:0 0 6px;line-height:1.2}
.doc-list .title a{color:var(--ink);text-decoration:none}
.doc-list .title a:hover{color:var(--terracotta)}
.doc-list .excerpt{color:var(--ink-soft);font-size:14px;line-height:1.55;margin:0;max-width:60ch}
.doc-list .tag{
  font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;font-weight:600;
  color:var(--terracotta);padding-top:4px;white-space:nowrap;
}

/* Case-study KPI row */
.kpi-row{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
  margin:24px 0 32px;
}
.kpi-row > div{
  background:var(--card);border:1px solid var(--line-soft);border-radius:12px;
  padding:18px 20px;
}
.kpi-row .n{
  font-family:'Fraunces',serif;font-size:30px;font-weight:500;letter-spacing:-.02em;
  color:var(--forest);line-height:1;font-variant-numeric:tabular-nums;
}
.kpi-row .l{
  font-size:11px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--ink-soft);font-weight:600;margin-top:8px;
}

/* Final inline CTA block for sub-pages */
.doc-cta{
  margin-top:60px;padding:32px 36px;
  background:linear-gradient(135deg,#f2dfd1 0%,#f1e3c3 100%);
  border-radius:16px;position:relative;overflow:hidden;
}
.doc-cta .eyebrow{margin-bottom:10px}
.doc-cta h3{
  font-family:'Fraunces',serif;font-weight:400;font-size:26px;letter-spacing:-.02em;
  margin:0 0 8px;
}
.doc-cta h3 em{font-style:italic;color:var(--forest)}
.doc-cta p{color:var(--ink-soft);margin:0 0 18px;max-width:50ch}

@media (max-width:640px){
  .doc-list li{grid-template-columns:1fr;gap:6px}
  .doc-list .date{order:2;padding-top:0}
  .doc-list .tag{order:3;padding-top:0}
  .kpi-row{grid-template-columns:1fr}
}