/* Lawsone site styles - shared by explainer pages */
* { margin:0; padding:0; box-sizing:border-box; }
:root { --ink:#1A1A1A; --ivory:#F7F4EC; --teal:#1F5F5B; --teal-soft:#8FBDB7; --copper:#A34A24; --hair:rgba(26,26,26,.18); }
@media (prefers-reduced-motion:no-preference) { html { scroll-behavior:smooth; } }
body { font-family:"Segoe UI","Helvetica Neue",Arial,sans-serif; background:var(--ivory); color:var(--ink); font-variant-numeric:tabular-nums; }
.mono { font-family:Consolas,"Courier New",monospace; }
.wrap { max-width:1060px; margin:0 auto; padding:0 28px; }
::selection { background:var(--ink); color:var(--ivory); }
a { color:var(--teal); text-underline-offset:3px; }
a:focus-visible, button:focus-visible { outline:2px solid var(--teal); outline-offset:3px; }
footer a:focus-visible { outline-color:var(--teal-soft); }

.docstrip { font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:rgba(26,26,26,.72); border-bottom:1px solid var(--hair); }
.docstrip .wrap { display:flex; justify-content:space-between; padding:9px 28px; }
.docstrip .c { color:var(--teal); }

header { border-bottom:2.5px solid var(--ink); }
header .wrap { display:flex; justify-content:space-between; align-items:baseline; padding:22px 28px; flex-wrap:wrap; gap:8px 18px; }
.wm { font-size:21px; font-weight:700; letter-spacing:.38em; color:var(--ink); text-decoration:none; }
header .tag { font-size:10.5px; letter-spacing:.16em; color:var(--teal); text-transform:uppercase; }

.crumbs { font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:rgba(26,26,26,.62); padding:16px 0 0; }
.crumbs a { color:var(--teal); text-decoration:none; }
.crumbs a:hover { text-decoration:underline; }

.hero { padding:56px 0 48px; border-bottom:1px solid var(--hair); }
h1 { font-size:38px; font-weight:700; line-height:1.18; letter-spacing:-0.5px; text-wrap:balance; }
h1 em { font-style:normal; color:var(--copper); }
.lede { font-size:16.5px; line-height:1.68; color:rgba(26,26,26,.8); margin-top:20px; max-width:62ch; }
.ctas { margin-top:30px; display:flex; gap:14px; flex-wrap:wrap; }
.btn { display:inline-block; font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:700; padding:14px 24px; text-decoration:none; border:2px solid var(--ink); color:var(--ink); transition:border-color .15s,color .15s,background .15s; }
.btn.solid { background:var(--ink); color:var(--ivory); }
.btn.ghost { border-color:rgba(26,26,26,.35); }
.btn:hover { border-color:var(--teal); color:var(--teal); }
.btn.solid:hover { background:var(--teal); border-color:var(--teal); color:var(--ivory); }

section { padding:48px 0 4px; }
h2 { font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--ink); border-bottom:1px solid var(--hair); padding-bottom:9px; margin-bottom:28px; }
h2 span { color:var(--copper); }
h3 { font-size:16px; font-weight:700; margin:26px 0 8px; }

.body-copy p { font-size:15px; line-height:1.74; color:rgba(26,26,26,.78); max-width:68ch; }
.body-copy p + p { margin-top:14px; }
.body-copy b { color:var(--ink); }
.body-copy ul { margin:10px 0 0 20px; }
.body-copy li { font-size:14.5px; line-height:1.66; color:rgba(26,26,26,.78); margin-bottom:7px; }
.body-copy li b { color:var(--ink); }

.cards { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.file { border:1px solid rgba(26,26,26,.3); }
.file .ctrl { display:flex; justify-content:space-between; flex-wrap:wrap; gap:5px 14px; font-size:10px; letter-spacing:.16em; text-transform:uppercase; padding:10px 14px; border-bottom:1px solid var(--hair); color:rgba(26,26,26,.68); }
.file .ctrl .id { color:var(--teal); font-weight:700; }
.file .body { padding:18px 20px 20px; }
.file .t { font-size:16.5px; font-weight:700; margin-bottom:8px; }
.file .t a { color:var(--ink); text-decoration:none; }
.file .t a:hover { color:var(--teal); }
.file p { font-size:13.5px; line-height:1.62; color:rgba(26,26,26,.76); max-width:72ch; }
.file .go { margin-top:12px; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--teal); font-weight:700; }

.items { list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:0 30px; }
.items li { font-size:14.5px; line-height:1.58; color:rgba(26,26,26,.8); padding:13px 0; border-bottom:1px solid var(--hair); }
.items li b { color:var(--ink); }

.step { display:flex; gap:20px; padding:16px 0; border-bottom:1px solid var(--hair); }
.step .n { font-size:13px; font-weight:700; color:var(--teal); font-family:Consolas,monospace; padding-top:2px; flex-shrink:0; width:34px; }
.step .s { font-size:14px; font-weight:700; flex-shrink:0; width:130px; padding-top:1px; }
.step p { font-size:13.5px; line-height:1.6; color:rgba(26,26,26,.72); max-width:72ch; }

.spec { margin-top:28px; border:1px solid rgba(26,26,26,.3); }
.spec .sh { display:flex; justify-content:space-between; flex-wrap:wrap; gap:4px 14px; font-size:10px; letter-spacing:.14em; text-transform:uppercase; padding:10px 14px; border-bottom:1px solid var(--hair); color:rgba(26,26,26,.68); }
.spec .sh .r { color:var(--copper); }
.spec table { width:100%; border-collapse:collapse; }
.spec th { font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:rgba(26,26,26,.68); text-align:left; padding:8px 14px; border-bottom:1px solid var(--hair); font-weight:700; }
.spec td { font-size:12.5px; padding:9px 14px; border-bottom:1px solid var(--hair); color:rgba(26,26,26,.8); vertical-align:top; }
.spec tr:last-child td { border-bottom:none; }

.qa { border-bottom:1px solid var(--hair); padding:18px 0; }
.qa .q { font-size:15.5px; font-weight:700; margin-bottom:8px; }
.qa .a { font-size:14px; line-height:1.66; color:rgba(26,26,26,.76); max-width:72ch; }

.note { margin-top:26px; font-size:13px; line-height:1.65; color:rgba(26,26,26,.76); border:1px solid rgba(26,26,26,.3); padding:14px 16px; }
.taglist { display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.taglist a { font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; font-weight:700; color:var(--teal); border:1px solid rgba(31,95,91,.45); padding:7px 12px; text-decoration:none; }
.taglist a:hover { border-color:var(--teal); background:var(--teal); color:var(--ivory); }

footer { background:var(--ink); color:var(--ivory); margin-top:56px; }
footer .wrap { padding:46px 28px 40px; }
.ftop .wm { font-size:23px; letter-spacing:.38em; color:var(--ivory); }
.ftop .sub { font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:rgba(247,244,236,.62); margin-top:7px; }
.fctas { margin-top:28px; display:flex; gap:14px; flex-wrap:wrap; }
.fctas .btn { border-color:var(--ivory); color:var(--ivory); }
.fctas .btn:hover { border-color:var(--teal-soft); color:var(--teal-soft); }
.fmeta { margin-top:34px; padding-top:16px; border-top:1px solid rgba(247,244,236,.25); display:flex; justify-content:space-between; flex-wrap:wrap; gap:6px 18px; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:rgba(247,244,236,.55); }
.fmeta a { color:rgba(247,244,236,.75); }

@media (max-width:820px) {
  h1 { font-size:29px; }
  .cards, .items { grid-template-columns:1fr; }
  .step .s { width:auto; }
  .docstrip .wrap { gap:6px 16px; flex-wrap:wrap; }
}