/* ==================================================================
 * Selborne Legal Consulting: content pages.
 * work.html, insights/index.html, insights/<slug>.html, contact.html, terms.html.
 * Load after site.css. Uses the tokens from site.css only.
 * ================================================================== */

/* ---------- shared ---------- */
.page-h1.is-long{font-size:clamp(30px,3.9vw,56px);line-height:1.04;max-width:24ch}
.chips .chip-n{color:var(--ink-3)}
.chips button[aria-pressed="true"] .chip-n{color:inherit}

/* ---------- work: filter bar ---------- */
.wk-tools{display:flex;justify-content:space-between;align-items:end;gap:16px 28px;flex-wrap:wrap;margin-bottom:14px}
.wk-fields{display:flex;gap:12px;flex-wrap:wrap;align-items:end}
.wk-field{display:grid;gap:6px;color:var(--ink-3)}
.wk-field .mono{font-size:9.5px}
.wk-field select,.wk-field input,.ct-f input,.ct-f select,.ct-f textarea{
  font:inherit;font-size:15px;color:var(--ink);background:rgba(255,255,255,.55);
  border:1px solid var(--faint);border-radius:0;padding:9px 10px;min-width:0;width:100%;
  transition:border-color .2s,background .2s;
}
.wk-field select,.ct-f select{appearance:none;-webkit-appearance:none;padding-right:30px;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink-2) 50%),linear-gradient(135deg,var(--ink-2) 50%,transparent 50%);
  background-position:right 14px top 50%,right 9px top 50%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.wk-field select{min-width:140px}
.wk-q{width:min(280px,100%)}
.wk-field select:hover,.wk-field input:hover,.ct-f input:hover,.ct-f select:hover,.ct-f textarea:hover{border-color:var(--ink-3)}
.wk-field select:focus-visible,.wk-field input:focus-visible,.ct-f input:focus-visible,.ct-f select:focus-visible,.ct-f textarea:focus-visible{outline:1px solid var(--accent);outline-offset:0;border-color:var(--accent);background:#fff}
.wk-status{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:30px;margin-bottom:6px;color:var(--ink-3)}
.wk-reset{border:0;background:none;padding:4px 0;color:var(--accent);cursor:pointer;font-size:10px}
.wk-reset:hover{text-decoration:underline;text-underline-offset:3px}
.wk-empty{padding:28px 0;border-bottom:1px solid var(--faint);color:var(--ink-2);display:flex;gap:14px;align-items:baseline;flex-wrap:wrap}
.wk-empty[hidden]{display:none}
.wk-note{margin-top:18px;color:var(--ink-2);font-size:10px;line-height:1.6}
.wk-cnote{color:var(--ink-3);font-size:10px}

/* ---------- insights: register of sheets ---------- */
.reg-tools{display:flex;justify-content:space-between;align-items:center;gap:12px 24px;flex-wrap:wrap;margin-bottom:22px;color:var(--ink-3)}
.reg-head,.reg-row{display:grid;grid-template-columns:96px minmax(0,1fr) 160px 110px 24px;gap:20px;align-items:baseline}
.reg-head{padding:10px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);color:var(--ink-3);font-size:9.5px}
.reg-head span:last-child{grid-column:4}
.register{list-style:none;margin:0;padding:0}
.reg-row{position:relative;padding:22px 0;border-bottom:1px solid var(--faint);transition:background .25s}
.reg-row[hidden]{display:none}
.reg-row:hover{background:rgba(255,255,255,.45)}
.reg-row:focus-within{outline:1px solid var(--accent);outline-offset:-1px}
.reg-no{display:flex;gap:12px;align-items:flex-start;color:var(--ink-3);font-size:10.5px;align-self:start}
.reg-g{width:30px;height:39px;flex:none}
.reg-main h3{font-size:clamp(19px,1.8vw,24px);font-weight:400;letter-spacing:-.02em;line-height:1.2;max-width:40ch}
.reg-main p{margin-top:8px;font-size:14.5px;color:var(--ink-2);max-width:62ch}
.reg-by{display:block;margin-top:10px;color:var(--ink-3);font-size:9.5px}
.reg-link{text-decoration:none}
.reg-link::after{content:"";position:absolute;inset:0}
.reg-link:focus-visible{outline:0}
.reg-cat,.reg-date{color:var(--ink-2);font-size:10px}
.reg-arr{color:var(--ink-3);text-align:right;transition:color .2s,transform .25s}
.reg-row:hover .reg-arr,.reg-row:focus-within .reg-arr{color:var(--accent);transform:translateX(3px)}
.reg-row:hover .reg-no,.reg-row:hover h3{color:var(--accent)}
.reg-row:hover .reg-g .ln{stroke:var(--accent)}

/* ---------- posts ---------- */
.post-by{color:var(--ink-3);font-size:10.5px;padding-bottom:14px;border-bottom:1px solid var(--faint)}
.post-body h4{font-size:17px;font-weight:500;letter-spacing:-.01em;margin:1.6em 0 0}
.post-body h4+*{margin-top:.5em}
.post-body ol>li::marker{font-family:var(--mono);font-size:.8em}
.post-fn{font-size:14px;color:var(--ink-2)}
.post-missing{font-size:10px;line-height:1.6;color:var(--ink-3);padding:12px 14px;border:1px dashed var(--faint)}
.post-link{text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px}
.post-link:hover{color:var(--accent)}
.prose-aside .btn{justify-self:start}

/* ---------- contact ---------- */
.ct-layout{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,80px);align-items:start}
.ct-addr{font-style:normal;line-height:1.5}
.ct-link{text-decoration:none;border-bottom:1px solid var(--faint);transition:color .2s,border-color .2s}
.ct-link:hover{color:var(--accent);border-color:var(--accent)}
.ct-link .arr{font-size:11px}
.ct-cities{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 16px}
.ct-cities li{white-space:nowrap}
.ct-aside{margin-top:22px;font-size:14px;color:var(--ink-2);max-width:44ch}
.ct-aside a{text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px}
.ct-form{padding:clamp(18px,3vw,32px)}
.ct-form fieldset{border:0;margin:0;padding:0;min-width:0;display:grid;gap:16px}
.ct-form fieldset[disabled]{opacity:.55}
.ct-form legend{padding:0;margin-bottom:18px;color:var(--ink-2)}
.ct-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.ct-f{display:grid;gap:6px;color:var(--ink-3)}
.ct-f .mono{font-size:9.5px}
.ct-f i{font-style:normal;color:var(--accent)}
.ct-f textarea{resize:vertical;min-height:140px;line-height:1.5}
.ct-f :user-invalid{border-color:var(--accent)}
.ct-submit{display:flex;align-items:center;gap:14px 20px;flex-wrap:wrap;margin-top:4px}
.ct-submit .mono{color:var(--ink-3);font-size:9.5px}
.ct-status{padding:14px 16px;border-left:1px solid var(--accent);background:var(--accent-soft);color:var(--ink);font-size:15px}
.ct-status[hidden]{display:none}
.om-fig{margin:0}
.om-wrap{padding:clamp(8px,2vw,24px)}
.om .om-ax{font-size:9px;fill:var(--ink-3)}
.om .om-l{font-size:10px;letter-spacing:.1em;paint-order:stroke;stroke:var(--paper);stroke-width:5px;stroke-linejoin:round}
.om .om-hq{fill:var(--accent)}
.om .om-arc{stroke:var(--ink-2);stroke-width:.8}
.om-key{display:inline-flex;align-items:center;gap:8px}
.om-key i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent)}

/* ---------- terms ---------- */
.ph-flag{display:inline-block;padding:8px 12px;border:1px dashed var(--accent);color:var(--accent);font-size:10.5px;line-height:1.5}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .reg-head,.reg-row{grid-template-columns:80px minmax(0,1fr) 130px 24px}
  .reg-head span:nth-child(3),.reg-cat{display:none}
  .reg-head span:last-child{grid-column:3}
}
@media (max-width:900px){
  .ct-layout{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  .wk-tools,.wk-fields{display:grid;grid-template-columns:minmax(0,1fr)}
  .wk-q,.wk-field select{width:100%}
  .reg-head{display:none}
  .register{border-top:1px solid var(--ink)}
  .reg-row{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;padding:18px 0}
  .reg-no{grid-column:1;grid-row:1;align-items:center}
  .reg-g{width:18px;height:24px}
  .reg-date{grid-column:2;grid-row:1;text-align:right}
  .reg-main{grid-column:1/-1;grid-row:2}
  .reg-arr{display:none}
  .ct-row{grid-template-columns:minmax(0,1fr)}
  .om .om-l{font-size:20px}
  .om .om-ax{display:none}
}
@media (prefers-reduced-motion:reduce){
  .reg-row:hover .reg-arr{transform:none}
}

/* contact: call panel (replaces the form on the live site) */
.ct-call{padding:clamp(24px,3vw,36px);display:flex;flex-direction:column;gap:14px;align-self:start}
.ct-call__k{color:var(--accent)}
.ct-call__phone{font-size:clamp(34px,4vw,54px);letter-spacing:-.03em;line-height:1;text-decoration:none}
.ct-call__phone:hover{color:var(--accent)}
.ct-call p{color:var(--ink-2);max-width:40ch}
.ct-call__note{color:var(--ink-3)!important}

/* work.html: ten matters per page */
.wk-pager{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--faint);color:var(--ink-3);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase}
.wk-pager[hidden]{display:none}
.wk-pg{font:inherit;letter-spacing:inherit;text-transform:inherit;border:1px solid var(--faint);background:transparent;color:var(--ink);padding:9px 14px;cursor:pointer;transition:border-color .2s,color .2s}
.wk-pg:hover:not(:disabled),.wk-pg:focus-visible{border-color:var(--accent);color:var(--accent);outline:0}
.wk-pg:disabled{color:var(--ink-3);cursor:default;opacity:.5}
.wk-pg-n{color:var(--ink-2)}