@font-face{font-family:Chivo;src:url(font/chivo.woff2) format('woff2-variations');font-weight:300 900;font-display:swap;}
@font-face{font-family:'Chivo Mono';src:url(font/chivomono.woff2) format('woff2-variations');font-weight:300 700;font-display:swap;}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{overflow-x:clip}
body{margin:0}

:root{
  --page:#FBFAF7;
  --ink:#16181A;
  --dim:#565C60;
  --rule:#D3D2CC;
  --rule-2:#E6E5E0;
  --verdict:#0F5A4E;
  --stop:#8C2F1D;
  --m0:13px; --m1:16px; --m2:19px; --m3:25px; --m4:36px; --m5:52px;
}

body{
  font-family:Chivo,'Helvetica Neue',Arial,sans-serif;
  font-size:var(--m1);line-height:1.6;color:var(--ink);background:var(--page);
}
a{color:inherit}
a:focus-visible{
  outline:3px solid var(--ink);outline-offset:2px;
  box-shadow:0 0 0 5px var(--page);scroll-margin:4rem 0;
}

.mock{
  font-family:'Chivo Mono',ui-monospace,monospace;
  background:var(--ink);color:#F1F0EC;font-size:var(--m0);line-height:1.45;
  padding:.6rem 1.25rem;text-align:center;
}

/* narrow single column, book-index proportion */
.col{max-width:44rem;margin:0 auto;padding:0 1.4rem}

.top{padding:3.4rem 0 1.4rem}
.stamp{
  font-family:'Chivo Mono',ui-monospace,monospace;
  font-size:var(--m0);letter-spacing:.1em;text-transform:uppercase;
  color:var(--dim);margin:0 0 1.5rem;
}
.top h1{
  font-size:var(--m4);font-weight:800;line-height:1.12;letter-spacing:-.02em;
  margin:0 0 .8rem;
}
.top p{margin:0 0 .9rem;color:#2B2F32}
.top .jump{
  font-family:'Chivo Mono',ui-monospace,monospace;font-size:var(--m1);
  display:inline-block;padding:.4rem 0;margin-top:.4rem;
  text-underline-offset:5px;text-decoration-thickness:2px;
}

/* ---- the index ---- */
.index{padding:2rem 0 1rem}
.index h2{
  font-family:'Chivo Mono',ui-monospace,monospace;
  font-size:var(--m0);letter-spacing:.14em;text-transform:uppercase;
  color:var(--dim);font-weight:700;margin:2.6rem 0 .3rem;
  border-bottom:2px solid var(--ink);padding-bottom:.4rem;
}
.index h2:first-child{margin-top:0}

.entry{padding:1.15rem 0;border-bottom:1px solid var(--rule-2)}
.entry .line{
  display:flex;align-items:baseline;gap:.5rem;
  font-size:var(--m2);font-weight:700;line-height:1.3;
}
.entry .line .dots{
  flex:1;border-bottom:1.5px dotted var(--rule);
  transform:translateY(-.28em);min-width:1.5rem;
}
.entry .line .cost{
  font-family:'Chivo Mono',ui-monospace,monospace;
  font-weight:700;white-space:nowrap;font-size:var(--m1);
}
.entry p{margin:.35rem 0 0;color:#2B2F32;font-size:var(--m1)}
.entry .verdict{
  font-family:'Chivo Mono',ui-monospace,monospace;
  font-size:var(--m0);letter-spacing:.08em;text-transform:uppercase;font-weight:700;
  margin-top:.5rem;display:inline-block;
  border-left:4px solid var(--verdict);padding:.1rem 0 .1rem .55rem;
  color:var(--verdict);
}
.entry .verdict.no{border-left-color:var(--stop);color:var(--stop)}

/* ---- prose ---- */
.prose{padding:2.6rem 0 1rem}
.prose h2{font-size:var(--m3);font-weight:800;letter-spacing:-.015em;margin:2.4rem 0 .5rem}
.prose h2:first-child{margin-top:0}
.prose p{margin:0 0 1rem}
.prose ul{margin:0 0 1.2rem;padding-left:1.15rem}
.prose li{margin-bottom:.55rem}
.prose .callout{
  border-left:4px solid var(--ink);padding:.2rem 0 .2rem 1.1rem;margin:1.6rem 0;
  font-size:var(--m2);line-height:1.45;
}

.rate{
  width:100%;border-collapse:collapse;margin:1.2rem 0 0;
  font-family:'Chivo Mono',ui-monospace,monospace;font-size:var(--m1);
}
.rate caption{text-align:left;font-family:Chivo,sans-serif;color:var(--dim);font-size:var(--m0);padding-bottom:.6rem}
.rate th,.rate td{text-align:left;padding:.7rem .7rem .7rem 0;border-bottom:1px solid var(--rule-2);vertical-align:top}
.rate thead th{border-bottom:2px solid var(--ink);font-size:var(--m0);letter-spacing:.1em;text-transform:uppercase}
.rate td:last-child,.rate th:last-child{text-align:right;padding-right:0;white-space:nowrap}

/* ---- ending ---- */
.desk{border-top:3px solid var(--ink);margin-top:3rem;padding:2.6rem 0 3.2rem}
.desk h2{font-size:var(--m4);font-weight:800;letter-spacing:-.02em;line-height:1.1;margin:0 0 1rem;max-width:18ch}
.desk .tel{
  font-family:'Chivo Mono',ui-monospace,monospace;
  display:inline-block;font-size:var(--m5);font-weight:700;line-height:1;
  letter-spacing:-.03em;padding:.2rem 0;text-underline-offset:8px;text-decoration-thickness:3px;
}
.desk p{max-width:48ch}
.desk dl{margin:1.6rem 0 0;display:grid;grid-template-columns:8.5rem 1fr;gap:.55rem 1.2rem}
.desk dt{
  font-family:'Chivo Mono',ui-monospace,monospace;
  font-size:var(--m0);letter-spacing:.1em;text-transform:uppercase;color:var(--dim);
  padding-top:.22rem;
}
.desk dd{margin:0}

footer{padding:1.8rem 0 3rem;font-size:var(--m0);color:var(--dim);border-top:1px solid var(--rule-2)}
footer nav a{margin-right:1.3rem;display:inline-block;padding:.35rem 0;font-size:var(--m1);color:var(--ink)}
footer p{max-width:56ch}

@media (max-width:720px){
  :root{--m3:22px;--m4:29px;--m5:38px}
  .entry .line{flex-wrap:wrap}
  .entry .line .dots{display:none}
  .entry .line .cost{width:100%}
  .desk dl{grid-template-columns:1fr;gap:.15rem}
  .desk dt{margin-top:.9rem}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}