@font-face{font-family:'Source Serif 4';src:url(fonts/sourceserif4.woff2) format('woff2-variations');font-weight:400 700;font-display:swap;font-style:normal}

:root{
  --paper:#faf7f1;
  --ink:#241d16;
  --quiet:#5b5044;
  --rule:#d8cebd;
  --hot:#3d5240;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{overflow-x:clip}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:'Source Serif 4',Georgia,serif;font-size:18px;line-height:1.68;
  font-variation-settings:'opsz' 14;
}
.skip{position:absolute;left:-9999px;padding:10px 14px}
.skip:focus{left:12px;top:12px;z-index:50;background:var(--ink);color:var(--paper);padding:10px 14px}
:focus-visible{outline:3px solid var(--hot);outline-offset:3px}

.mockup{
  max-width:none;margin:0;padding:9px 20px;background:var(--ink);color:#f4efe4;
  font-size:13.5px;line-height:1.45;text-align:center;font-variation-settings:'opsz' 10;
}
.mockup b{font-weight:700}

.sheet{max-width:64rem;margin:0 auto;padding:0 30px}

.opener{padding-top:44px}
.kicker{
  margin:0 0 30px;font-size:13px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--quiet);font-variation-settings:'opsz' 8;
}
.kicker a{color:inherit;text-decoration:none;display:inline-block;padding-block:7px}
h1{
  font-variation-settings:'opsz' 46;
  font-size:clamp(30px,5vw,52px);line-height:1.1;font-weight:400;letter-spacing:-.015em;
  margin:0 0 20px;max-width:19ch;
}
.standfirst{
  font-size:20.5px;line-height:1.55;color:var(--quiet);margin:0 0 8px;max-width:46ch;
}
.byline{margin:22px 0 0;padding:14px 0 0;border-top:2px solid var(--ink);font-size:14.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--quiet);font-variation-settings:'opsz' 8}

.feature{padding:30px 0 10px}
.unit{
  display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);
  gap:0 46px;align-items:start;
}
.unit > p{margin:0 0 20px;max-width:60ch;grid-column:1}
.unit > p.big{font-size:22px;line-height:1.5}
.unit > aside{
  grid-column:2;margin:6px 0 20px;padding:12px 0 0;border-top:2px solid var(--ink);
  font-size:15px;line-height:1.5;color:var(--quiet);font-variation-settings:'opsz' 9;
}
.unit > aside b{
  display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);margin-bottom:5px;font-weight:700;
}
.unit > aside .num{display:block;font-size:27px;line-height:1.15;color:var(--ink);margin:2px 0 4px;font-variation-settings:'opsz' 24}

hr.br{border:0;border-top:1px solid var(--rule);margin:14px 0 26px}

.tail{padding:6px 0 10px;max-width:60ch}
h2{font-variation-settings:'opsz' 30;font-size:26px;font-weight:400;letter-spacing:-.01em;margin:26px 0 10px}
.tail p{margin:0 0 14px}
.tail a{color:var(--ink)}
.callout{
  margin:26px 0 6px;padding:22px 24px;background:#efe9dc;border-left:5px solid var(--hot);
}
.callout p{margin:0 0 8px;max-width:52ch}
.callout p:last-child{margin:0}
.callout .tel{
  font-size:26px;font-weight:700;color:var(--hot);text-decoration:underline;text-underline-offset:5px;
  font-variation-settings:'opsz' 24;
}

footer{margin-top:38px;border-top:1px solid var(--rule)}
footer .sheet{padding-top:22px;padding-bottom:44px}
footer nav{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:12px}
footer nav a{color:var(--ink);padding-block:6px}
footer p{font-size:13.5px;line-height:1.55;color:var(--quiet);margin:0;font-variation-settings:'opsz' 9}

/* interior: ruled list */
.ruled{margin:22px 0 0;padding:0;list-style:none;border-top:2px solid var(--ink)}
.ruled li{padding:16px 0;border-bottom:1px solid var(--rule);display:grid;grid-template-columns:1fr auto;gap:4px 28px;align-items:baseline}
.ruled .what{font-size:20px;font-variation-settings:'opsz' 20}
.ruled .what small{display:block;font-size:15.5px;color:var(--quiet);line-height:1.5;max-width:56ch;margin-top:4px}
.ruled .cost{font-size:20px;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}

@media (max-width:800px){
  .unit{grid-template-columns:1fr;gap:0}
  .unit > p, .unit > aside{grid-column:1}
  .unit > aside{
    border-top:0;border-left:4px solid var(--rule);
    padding:2px 0 2px 16px;margin:0 0 22px;
  }
}
@media (max-width:560px){
  .sheet{padding:0 18px}
  .ruled li{grid-template-columns:1fr}
}