/* t298 (owner): side bar pages (js/pages.js). Black ground, EB Garamond, #C11E1E accents, cream text, faint white
   borders, the site's measure and spacing. Each page is a sheet under the fixed banner. */
html.gate-skip *,
html.gate-skip *::before,
html.gate-skip *::after{transition:none !important;animation:none !important}

.page-layer{
  position:fixed;
  top:calc(var(--banner-h) + var(--side-safe-t, 0px));
  left:0;
  right:0;
  bottom:0;
  z-index:14;
  overflow:hidden;
  pointer-events:none;
  visibility:hidden;
}
html.page-open .page-layer,
.page-layer.is-moving{visibility:visible}
html.page-open,
html.page-open body{overflow:hidden !important}
.page-sheet{
  position:absolute;
  inset:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  background:var(--matte);
  color:var(--ink);
  pointer-events:auto;
  border-top:1px solid rgba(255,255,255,.08);
}
.page-sheet[hidden]{display:none}
.page-inner{
  max-width:var(--measure);
  margin:0 auto;
  padding:2.5rem calc(var(--margin) + var(--side-safe-r, 0px)) calc(4rem + var(--side-safe-b, 0px)) var(--margin);
}
.page-title{
  font-size:clamp(1.8rem, 4vw, 2.4rem);
  font-weight:500;
  line-height:1.15;
  margin:0 0 .9rem;
  display:inline-block;
  border-bottom:3px solid var(--oxide);
  padding-bottom:.2em;
}
.page-title:focus{outline:none}
.page-intro{font-size:clamp(1.15rem, 2.1vw, 1.4rem);line-height:1.45;margin:0 0 1.6rem}
/* t325 (owner): no red and white bands to the left of paragraphs anywhere except the Search's results. About's sections
   lost their 6px red / white left borders (and .page-start its red one); the text sits flush with the page title. */
.page-section{margin:0 0 1.6rem;padding:.2rem 0}
.page-section h2{font-size:1.25rem;font-weight:500;margin:0 0 .35rem}
.page-section p{font-size:1.1rem;line-height:1.5;margin:0 0 .6rem}
.page-section p:last-child{margin-bottom:0}
.page-link,
.page-note a,
.page-sheet .verdict a{color:var(--oxide);text-decoration:underline;text-underline-offset:.18em}
.page-link:hover,.page-link:focus-visible,.page-note a:hover,.page-note a:focus-visible{color:var(--ink)}
.page-actions{margin:1rem 0 .6rem}
.page-button{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:.7rem 1.1rem;
  background:var(--oxide);
  border:2px solid var(--oxide);
  color:var(--name);
  text-decoration:none;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:.95rem;
  font-weight:500;
}
.page-button:hover,.page-button:focus-visible{background:var(--name);border-color:var(--name);color:#000;outline:none}
.page-note{font-size:1.05rem}

.page-tagline{font-size:1.15rem;line-height:1.45;font-weight:500;margin:-.6rem 0 1.6rem}
.page-quote{margin:.9rem 0 1rem;padding:.2rem 0 .2rem 1rem}
.band-exception-about-quote{border-left:4px solid var(--oxide)}
.tagline-weak-link{color:var(--oxide)}
.page-section .page-quote-text{font-style:italic;font-size:1.2rem;line-height:1.45;margin:0 0 .3rem}
.page-section .page-quote-cite{font-style:normal;font-size:.92rem;line-height:1.4;color:rgba(243,238,228,.65);margin:0}
.page-section .page-quote-cite em{font-style:italic;color:inherit;font-weight:inherit}
.page-start .page-actions{display:flex;flex-wrap:wrap;gap:.6rem}

/* Blog: post cards (photo, title, one-line summary) and the stub post pages. */
.page-sample{
  width:fit-content;
  display:block;
  margin:0 0 .7rem;
  padding:.1rem .45rem;
  border:1px solid rgba(255,255,255,.25);
  font-size:.75rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(243,238,228,.75);
}
.page-soon{font-size:1.15rem;color:var(--oxide);font-weight:500;margin:0 0 1.2rem}
.post-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem}
@media (max-width:640px){.post-list{grid-template-columns:1fr}}
.post-card{border:1px solid rgba(255,255,255,.15);background:transparent;transition:border-color .2s ease}
.post-card:hover,.post-card:focus-within{border-color:var(--oxide)}
.post-link{display:flex;flex-direction:column;height:100%;color:var(--ink);text-decoration:none}
.post-link:focus-visible{outline:2px solid var(--oxide);outline-offset:3px}
.post-photo{display:block;aspect-ratio:16 / 9;overflow:hidden;background:#111;border-bottom:3px solid var(--oxide)}
.post-photo img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.9)}
.post-text{display:flex;flex-direction:column;gap:.4rem;padding:.9rem 1rem 1.1rem}
.post-title{font-size:1.25rem;font-weight:500;line-height:1.2}
.post-link:hover .post-title,.post-link:focus-visible .post-title{color:var(--oxide)}
.post-summary{font-size:1.02rem;line-height:1.45;color:rgba(243,238,228,.85)}
.post-meta{display:flex;flex-wrap:wrap;gap:.2rem .6rem;margin:.15rem 0 0;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;color:rgba(243,238,228,.65)}
.post-meta time{color:var(--oxide)}
.post-meta .post-author::before{content:"";display:inline-block;width:.32rem;height:.32rem;margin:0 .6rem .12rem 0;background:var(--oxide);vertical-align:middle}
.page-post .post-meta{margin:0 0 1.4rem}
.post-figure{margin:0 0 1.4rem;aspect-ratio:16 / 9;overflow:hidden;border-bottom:3px solid var(--oxide);background:#111}
.post-figure img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.9)}
.post-body{font-size:1.15rem;line-height:1.55;margin:0 0 1rem}
/* Post sections, price table and points (post 5, t321): subheads with a red rule, the table in the site's faint
   white lines, our own row marked in red. Below 640px each row stacks, each cell with its column name. */
.post-head{font-size:1.45rem;font-weight:500;line-height:1.25;margin:2rem 0 .7rem;padding-left:0}
.post-points{margin:0 0 1rem;padding-left:1.3rem;font-size:1.15rem;line-height:1.55}
.post-points li{margin:0 0 .55rem}
.post-points li::marker{color:var(--oxide)}
.post-table-wrap{margin:0 0 .6rem;border:1px solid rgba(255,255,255,.15)}
.post-table{width:100%;border-collapse:collapse;font-size:.98rem;line-height:1.42}
.post-table th,.post-table td{padding:.65rem .7rem;text-align:left;vertical-align:top;border-bottom:1px solid rgba(255,255,255,.1);overflow-wrap:break-word;hyphens:none}
.post-table a{word-break:break-all}
@media (min-width:960px){.post-table-wrap{position:relative;left:50%;width:min(60rem, calc(100vw - 4rem));transform:translateX(-50%)}}
.post-table thead th{font-size:.78rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--oxide);border-bottom:1px solid rgba(255,255,255,.25)}
.post-table tbody th{font-weight:500;color:var(--ink)}
.post-table tbody tr:last-child th,.post-table tbody tr:last-child td{border-bottom:0}
.post-table tr.is-us th,.post-table tr.is-us td{background:rgba(193,30,30,.12)}
.post-note{font-size:.9rem;color:rgba(243,238,228,.7);margin:0 0 1.4rem}
@media (max-width:640px){
  .post-table thead{display:none}
  .post-table,.post-table tbody,.post-table tr,.post-table th,.post-table td{display:block;width:auto}
  .post-table tr{border-bottom:1px solid rgba(255,255,255,.15);padding:.35rem 0}
  .post-table tbody tr:last-child{border-bottom:0}
  .post-table th,.post-table td{border-bottom:0;padding:.3rem .8rem}
  .post-table tbody th{font-size:1.08rem;padding-top:.55rem}
  .post-table td::before{content:attr(data-label);display:block;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(243,238,228,.6)}
  .post-table tr.is-us{background:rgba(193,30,30,.12)}
  .post-table tr.is-us th,.post-table tr.is-us td{background:none;box-shadow:none}
}
/* Post navigation (t322, owner): the site's triangular clip, turned to point left (Back, to the Blog) and right
   (Next, the next post in the Blog's card order), with a small red label under each. 48px tap targets. */
.post-nav{display:flex;justify-content:space-between;align-items:flex-start;margin:-1rem 0 1rem;min-height:3.6rem}
.post-nav a{display:flex;flex-direction:column;align-items:center;gap:.1rem;min-width:3rem;min-height:3.4rem;padding:.2rem .25rem;
  color:var(--oxide);text-decoration:none;-webkit-tap-highlight-color:transparent;border-radius:4px}
.post-nav-next{margin-left:auto}
.post-nav-clip{display:block;width:2.8rem;height:2.6rem;overflow:hidden}
.post-nav-clip img{display:block;width:3.5rem;height:3.5rem;margin:-.45rem -.35rem;object-fit:cover;pointer-events:none;
  transform:rotate(90deg);transition:transform .35s cubic-bezier(.76,0,.18,1)}
.post-nav-next .post-nav-clip img{transform:rotate(-90deg)}
.post-nav-back:hover .post-nav-clip img,.post-nav-back:focus-visible .post-nav-clip img{transform:translateX(-3px) rotate(90deg)}
.post-nav-next:hover .post-nav-clip img,.post-nav-next:focus-visible .post-nav-clip img{transform:translateX(3px) rotate(-90deg)}
.post-nav-label{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;line-height:1;color:var(--oxide)}
.post-nav a:focus-visible{outline:2px solid var(--oxide);outline-offset:2px}
@media (prefers-reduced-motion: reduce){.post-nav-clip img{transition:none}}
/* Post FAQ (t299): questions as subheads, answers under them; a red rule above the block. */
.post-faq{margin:2.2rem 0 0;padding-top:1.4rem;border-top:1px solid rgba(255,255,255,.15)}
.post-faq .faq-title{font-size:.9rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--oxide);margin:0 0 1rem}
.faq-item{padding:.9rem 0;border-bottom:1px solid rgba(255,255,255,.1)}
.faq-item:last-child{border-bottom:0}
.faq-q{font-size:1.2rem;font-weight:500;line-height:1.3;margin:0 0 .4rem;color:var(--ink)}
.faq-a{font-size:1.08rem;line-height:1.55;margin:0;color:rgba(243,238,228,.88)}
/* More posts: the other posts' titles at the foot of a post. */
.post-more{margin:2.2rem 0 0;padding-top:1.4rem;border-top:1px solid rgba(255,255,255,.15)}
.post-more-title{font-size:.9rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:rgba(243,238,228,.65);margin:0 0 .6rem}
.post-more ul{list-style:none;margin:0;padding:0}
.post-more li{border-bottom:1px solid rgba(255,255,255,.1)}
.post-more a{display:block;padding:.75rem 0;min-height:44px;box-sizing:border-box;color:var(--ink);text-decoration:none;font-size:1.08rem;line-height:1.35}
.post-more a:hover,.post-more a:focus-visible{color:var(--oxide);outline:none}

/* Booking: the site's own call box (js/finder.js), black on this page only. */
.booking-finder.finder{min-height:0;max-width:none;margin:0;padding:0;display:block}
.page-booking #report-card.card{
  --plate:#f3eee4;
  --cream:#000;
  --name:#000;
  margin:.4rem 0 0;
  background:#000;
  color:#f3eee4;
  border:1px solid rgba(255,255,255,.15);
}
.page-booking #report-card .finder-gate .ph{color:rgba(243,238,228,.7)}
.page-booking #report-card input,
.page-booking #report-card textarea{background:transparent;color:#f3eee4;border:1px solid rgba(255,255,255,.35)}
.page-booking #report-card input:focus,
.page-booking #report-card textarea:focus{border-color:var(--oxide)}
.page-booking #report-card .cal-wd{color:rgba(243,238,228,.8)}
.page-booking #report-card button.cal-day,
.page-booking #report-card button.cal-time{background:transparent;color:#f3eee4;border:1px solid rgba(255,255,255,.35)}
.page-booking #report-card button.cal-day:disabled,
.page-booking #report-card button.cal-day:disabled:hover{border-color:rgba(255,255,255,.12);color:rgba(243,238,228,.35)}
.page-booking #report-card button.cal-day:not(:disabled):hover,
.page-booking #report-card button.cal-time:hover{border-color:var(--oxide);color:#f3eee4}
.page-booking #report-card button.cal-day[aria-pressed="true"],
.page-booking #report-card button.cal-day[aria-pressed="true"]:hover,
.page-booking #report-card button.cal-time[aria-pressed="true"],
.page-booking #report-card button.cal-time[aria-pressed="true"]:hover{background:var(--oxide);border-color:var(--oxide);color:#f3eee4}
.page-booking #report-card .cal-times{background:rgba(255,255,255,.05)}
.page-booking #report-card #g-send.send-mail,
.page-booking #report-card button.primary,
.page-booking #report-card #confirm-send.send-mail{background:var(--oxide);border-color:var(--oxide);color:#f3eee4}
.page-booking #report-card #g-send.send-mail:hover,
.page-booking #report-card #g-send.send-mail:focus-visible,
.page-booking #report-card button.primary:hover,
.page-booking #report-card button.primary:focus-visible,
.page-booking #report-card #confirm-send.send-mail:hover,
.page-booking #report-card #confirm-send.send-mail:focus-visible{background:#f3eee4;border-color:#f3eee4;color:#000}
.page-booking #report-card button.report-only,
.page-booking #report-card #confirm-back{color:#f3eee4;border-color:rgba(255,255,255,.35)}
.page-booking #report-card .mail-preview,
.page-booking #report-card .opt-mark{background:transparent;border-color:rgba(255,255,255,.35)}
.page-booking #report-card .mail-body{border-top-color:rgba(255,255,255,.15)}
.page-booking #report-card .char-count{color:rgba(243,238,228,.7)}
/* No Search result yet: no report to email, so the call is the only choice. */
#report-card.booking-only #g-report-only,
#report-card.booking-only #g-book-too,
#report-card.booking-only .gate-head + .gsub{display:none !important}

/* Money: the Throughput Converter (js/money.js), wording unchanged, in the brand. */
.page-money .page-inner{max-width:72rem}
.money{color:var(--ink)}
.money .kicker{letter-spacing:.12em;text-transform:uppercase;font-size:.82rem;font-weight:500;color:var(--oxide)}
.money h1{font-size:clamp(1.8rem, 4vw, 2.4rem);font-weight:500;line-height:1.15;margin:.35rem 0 .7rem}
.money h1:focus{outline:none}
.money .card h2:focus{outline:none}
.money td.num input.amt{text-align:right;font-variant-numeric:tabular-nums;min-width:7rem}
/* 28 Oct (owner): the lead and the privacy line run the full width of the content column, so both edges line up with the
   heading and the cards below. They were capped at 40rem and stopped short inside the 72rem Money column. */
.money .tool-lead{margin-bottom:1.2rem;font-size:1.15rem;line-height:1.45;max-width:none}
.money .privacy-strong{max-width:none;margin:.8rem 0 1.2rem;font-size:1.05rem;line-height:1.45}
.money .verdict .privacy-strong{margin:.75rem 0 0}
.money .muted{color:rgba(243,238,228,.8);margin-bottom:1.2rem;line-height:1.45}
.money .card{background:transparent;border:1px solid rgba(255,255,255,.15);padding:1.1rem 1.1rem 1.3rem;margin:1rem 0}
.money .card h2{margin:0 0 .5rem;font-weight:500;font-size:1.3rem}
.money button{
  cursor:pointer;
  min-height:44px;
  font-size:.9rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-weight:500;
  border:2px solid var(--ink);
  background:transparent;
  color:var(--ink);
  padding:.7rem .75rem;
}
.money button:hover,.money button:focus-visible{border-color:var(--oxide);color:var(--oxide);outline:none}
.money button.primary{background:var(--oxide);border-color:var(--oxide);color:var(--name)}
.money button.primary:hover,.money button.primary:focus-visible{background:var(--name);border-color:var(--name);color:#000}
.money .goal-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.2rem}
.money input,
.money textarea,
.money select{font:inherit;background:transparent;color:var(--ink);border:1px solid rgba(255,255,255,.35);padding:.5rem .65rem;width:100%;min-height:44px}
.money select option{background:#000;color:var(--ink)}
.money input[type=file]{padding:.55rem .65rem}
.money input[type=file]::file-selector-button{font:inherit;background:transparent;color:var(--ink);border:1px solid rgba(255,255,255,.35);padding:.3rem .7rem;margin-right:.75rem;cursor:pointer}
.money textarea{min-height:14rem;margin:.7rem 0;font-size:.95rem;line-height:1.4}
.money textarea::placeholder{color:rgba(243,238,228,.45)}
.money input:focus,.money textarea:focus,.money select:focus{outline:none;border-color:var(--oxide)}
.money .gerr{color:var(--oxide);margin-top:.5rem}
.money .gnote{color:rgba(243,238,228,.7);font-size:.9rem;margin-top:.5rem}
.money .hidden{display:none}
.money table{width:100%;border-collapse:collapse;margin:1rem 0;font-size:1rem}
.money th,.money td{border:1px solid rgba(255,255,255,.15);padding:.5rem .6rem;text-align:left;vertical-align:top}
.money select{min-width:11rem}
.money th{background:transparent;color:var(--oxide);font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;font-weight:500}
.money td.num{text-align:right;font-variant-numeric:tabular-nums}
.money-desk.split{display:grid;gap:1rem}
@media (min-width:1100px){
  .money-desk.split{grid-template-columns:minmax(20rem,5fr) minmax(24rem,7fr);align-items:start}
}
.money .metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:1rem 0}
.money .metric{border:1px solid rgba(255,255,255,.15);padding:1rem}
.money .metric .label{letter-spacing:.04em;font-size:.95rem;color:var(--oxide);font-weight:500}
.money .metric .term{color:var(--ink);font-weight:400;letter-spacing:0}
.money .metric .value{font-size:1.85rem;line-height:1.15;font-weight:500;margin:.4rem 0;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.money .metric .note{font-size:.95rem;line-height:1.4;color:rgba(243,238,228,.8)}
/* 28 Oct (owner): the three numbers stand out with a brand red border; every other box keeps the grey hairline. */
.money .metric.core{border-color:var(--oxide)}
/* What the three numbers tell you: small, worked out live from the three boxes. */
.money .money-derived{margin:1.2rem 0 .4rem}
.money .money-derived:empty{display:none}
.money .money-derived h3{margin:0 0 .6rem;font-weight:500;font-size:1.1rem}
/* Three figures under the three boxes: same three columns and gap as the boxes above, one column on narrow screens. */
.money .derived-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.money .derived{border:1px solid rgba(255,255,255,.15);padding:.7rem .85rem}
.money .derived .d-name{font-size:.9rem;letter-spacing:.04em;color:rgba(243,238,228,.8);font-weight:500}
.money .derived .d-value{font-size:1.35rem;line-height:1.2;font-weight:500;margin:.2rem 0;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.money .derived .d-how{font-size:.9rem;font-style:italic;color:rgba(243,238,228,.8)}
.money .derived .d-note{font-size:.9rem;line-height:1.4;color:rgba(243,238,228,.8);margin-top:.15rem}
.money .verdict{padding:.75rem 0;margin:1rem 0}
.money .verdict h3{margin:0 0 .5rem;font-weight:500}
.money .verdict p{margin:0 0 .75rem;line-height:1.45}
.money .verdict p:last-child{margin-bottom:0}
.money #money-results{scroll-margin-top:0}
@media (max-width:800px){
  .money .metrics{grid-template-columns:1fr}
  .money .derived-list{grid-template-columns:1fr}
  .money table{border:0}
  .money tr{display:grid;grid-template-columns:1fr auto;gap:.2rem .75rem;padding:.75rem 0;border-bottom:1px solid rgba(255,255,255,.15)}
  .money tr:first-child{display:none}
  .money td{border:0;padding:.1rem 0}
  .money td:first-child{grid-column:1 / -1;font-weight:500}
  .money td.num{text-align:left}
  .money td:last-child{min-width:11rem}
  .money select{width:100%;min-width:11rem}
}

/* The current page in the side bar. */
.side-nav a[aria-current="page"]{color:var(--oxide)}

@media (prefers-reduced-motion: reduce){
  .page-sheet{transition:none !important;animation:none !important}
}
@media print{
  .page-layer{display:none !important}
}

/* t325 (owner): the call box on the Booking page loses its left bands (the preview, the times and the confirmation).
   In the Search's results the same box keeps them (css/gate.css is untouched). */
#booking-slot #report-card .sample-preview,
#booking-slot #report-card .cal-times,
#booking-slot #report-card .call-confirm,
#booking-slot .call-box{border-left:0;padding-left:0}

/* t325 (owner): links inside the posts: cream text, a red underline, red on hover and focus. */
.post-inlink{color:var(--ink);text-decoration:underline;text-decoration-color:var(--oxide);text-decoration-thickness:2px;text-underline-offset:.2em;transition:color .15s ease}
.post-inlink:hover,.post-inlink:focus-visible{color:var(--oxide)}
.post-inlink:focus-visible{outline:2px solid var(--oxide);outline-offset:3px;border-radius:2px}
@media (prefers-reduced-motion: reduce){.post-inlink{transition:none}}

/* t327 (owner): the banner logo is a real link to the main page from every page. It was a plain span; the red clip over its
   middle was the only clickable part. js/pages.js keeps the story behaviour on the main page and the page transition elsewhere. */
a.banner-stamp{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
body.gate-open a.banner-stamp{pointer-events:auto;cursor:pointer}
a.banner-stamp:focus-visible{outline:2px solid var(--oxide);outline-offset:3px;border-radius:2px}