/* Corridor guides and their hub: /corridor/. Shared by every guide page. */
.corr { max-width: 1040px; margin: 0 auto; padding: 140px clamp(1.25rem, 4vw, 2.5rem) 5rem; }
.corr-head { border-bottom: 2px solid var(--ink); padding-bottom: 2rem; }
.corr-head h1 { font: 700 clamp(3rem, 7.5vw, 6.2rem)/.86 var(--serif); letter-spacing: -.055em; margin: 1rem 0 1.3rem; }
.corr-head h1 em { color: var(--tomato); font-style: normal; }
.dek { font-size: 1.08rem; line-height: 1.7; max-width: 46rem; margin: 0; }
.crumbs { font: 500 .62rem/1.6 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.crumbs a { text-decoration: none; } .crumbs a:hover { text-decoration: underline; }
.figures { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid var(--line); margin: 0 0 2.5rem; }
.figures div { padding: 1.4rem 1.2rem 1.4rem 0; }
.figures div + div { border-left: 1px solid var(--line); padding-left: 1.2rem; }
.figures b { display: block; font: 700 clamp(1.9rem, 3.6vw, 2.8rem)/1 var(--serif); letter-spacing: -.04em; }
.figures div:first-child b { color: var(--tomato); }
.figures div > span { display: block; font-size: .8rem; line-height: 1.5; margin-top: .5rem; opacity: .8; }
.plate { margin: 0; }
.plate a { display: block; border: 1.5px solid var(--ink); background: var(--cream-2); box-shadow: 10px 12px 0 rgba(23,32,27,.08); }
.plate img { display: block; width: 100%; height: auto; }
.plate figcaption { margin-top: 1rem; font-size: .88rem; line-height: 1.6; max-width: 46rem; }
.toc { font: 500 .68rem/2 var(--mono); letter-spacing: .06em; margin: 2rem 0 0; }
.toc a { margin-right: 1rem; }
.section { border-top: 1px solid var(--line); padding: 3rem 0 1rem; margin-top: 3rem; scroll-margin-top: 70px; }
.section-head { display: grid; grid-template-columns: 70px 1fr; gap: 1.2rem; align-items: baseline; margin-bottom: 1.4rem; }
.section-head span { font: 500 .68rem var(--mono); letter-spacing: .1em; }
.section h2 { font: 700 clamp(1.7rem, 3.4vw, 2.5rem)/1 var(--serif); letter-spacing: -.04em; margin: 0; }
.section h3 { font: 700 1.2rem/1.2 var(--serif); letter-spacing: -.02em; margin: 2rem 0 .6rem; }
.prose { margin-left: calc(70px + 1.2rem); max-width: 44rem; }
.prose p, .prose li { line-height: 1.7; font-size: .95rem; }
.prose ul { padding-left: 1.1rem; }
.prose li + li { margin-top: .5rem; }
.tier-tag { display: inline-block; border: 1.5px solid var(--ink); border-radius: 2px; padding: .12rem .45rem; font: 700 .62rem var(--mono); white-space: nowrap; }
.tag-exact { background: #77a65e; } .tag-deli { background: var(--cheese); } .tag-sloppy { background: #d9b98a; } .tag-soggy { background: #a8d1d5; }
.cities { width: 100%; border-collapse: collapse; margin: 1.6rem 0 2.4rem; font-size: .88rem; line-height: 1.5; }
.cities caption { text-align: left; font: 700 1.3rem/1.2 var(--serif); letter-spacing: -.02em; padding-bottom: .7rem; }
.cities thead th { text-align: left; font: 500 .6rem/1.5 var(--mono); letter-spacing: .1em; text-transform: uppercase; opacity: .65; border-bottom: 2px solid var(--ink); padding: .4rem .6rem .4rem 0; }
.cities td, .cities tbody th { text-align: left; vertical-align: top; padding: .55rem .8rem .55rem 0; border-bottom: 1px dashed var(--line); font-weight: 400; }
.cities tbody th a { font-weight: 600; }
.cities tbody th span { display: block; font: .66rem/1.5 var(--mono); opacity: .6; }
.cities td:nth-child(2) { width: 5.5rem; }
.cities .spot { display: block; font-size: .8rem; opacity: .8; }
.cities tr.group th { font: 500 .66rem/1.5 var(--mono); letter-spacing: .12em; text-transform: uppercase; padding-top: 1.4rem; border-bottom: 1px solid var(--ink); }
.twins, .bonus { list-style: none; padding: 0; margin: 1.4rem 0 0; counter-reset: n; }
.twins li { display: grid; grid-template-columns: 1fr auto 1fr 5rem; gap: .2rem 1rem; align-items: baseline; padding: .6rem 0; border-bottom: 1px dashed var(--line); font-size: .92rem; }
.twins li > span { grid-row: 2; font: .66rem/1.4 var(--mono); opacity: .6; }
.twins li > span:nth-of-type(2) { grid-column: 3; }
.twins b { grid-row: 1 / span 2; grid-column: 2; align-self: center; font-weight: 400; }
.twins i { grid-row: 1 / span 2; grid-column: 4; align-self: center; text-align: right; font: normal .72rem var(--mono); }
.bonus li { display: grid; grid-template-columns: 7rem 1fr 1fr; gap: 1rem; align-items: baseline; padding: .7rem 0; border-bottom: 1px dashed var(--line); font-size: .9rem; line-height: 1.5; }
.bonus b { font: italic 700 1.5rem/1 var(--serif); letter-spacing: -.03em; }
.bonus small { display: block; font: .66rem/1.5 var(--mono); opacity: .6; }
.s3-links { line-height: 2; }
.actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2.5rem; }
.method { margin-top: 3rem; font: .7rem/1.8 var(--mono); opacity: .65; max-width: 48rem; }
@media (max-width: 760px) {
  .corr { padding-top: 110px; }
  .figures { grid-template-columns: 1fr 1fr; }
  .figures div:nth-child(3) { border-left: 0; padding-left: 0; }
  .figures div:nth-child(n+3) { border-top: 1px solid var(--line); }
  .section-head { grid-template-columns: 1fr; gap: .4rem; }
  .prose { margin-left: 0; }
  .cities thead { display: none; }
  .cities tr { display: grid; grid-template-columns: 1fr auto; gap: .2rem .8rem; padding: .6rem 0; border-bottom: 1px dashed var(--line); }
  .cities td, .cities tbody th { border: 0; padding: 0; }
  .cities td:nth-child(2) { width: auto; }
  .cities td:last-child { grid-column: 1 / -1; }
  .cities tr.group { display: block; border-bottom: 1px solid var(--ink); }
  .twins li { grid-template-columns: 1fr auto 1fr; }
  .twins i { grid-row: 3; grid-column: 1 / -1; text-align: left; }
  .bonus li { grid-template-columns: 1fr; gap: .2rem; }
}

/* hub */
.hub-list { margin-top: 2.5rem; }
.hub-group { border-left: 3px solid var(--cheese); padding-left: 1.2rem; margin: 1rem 0; }
.hub-card { display: grid; grid-template-columns: 300px 1fr; gap: 1.6rem; align-items: start; padding: 1.6rem 0; border-bottom: 1px dashed var(--line); scroll-margin-top: 80px; }
.hub-card h2 { font: 700 clamp(1.4rem, 2.6vw, 1.9rem)/1.05 var(--serif); letter-spacing: -.035em; margin: 0 0 .6rem; }
.hub-card h2 a { text-decoration: none; }
.hub-card h2 a:hover { text-decoration: underline; }
.hub-card p { margin: 0 0 .6rem; line-height: 1.6; font-size: .95rem; max-width: 40rem; }
.hub-thumb { display: block; border: 1.5px solid var(--ink); background: var(--cream-2); }
.hub-thumb img { display: block; width: 100%; height: auto; }
.hub-facts { font: .7rem/1.7 var(--mono); opacity: .7; }
.none { font-size: .9rem; opacity: .8; }
@media (max-width: 760px) {
  .hub-card { grid-template-columns: 1fr; gap: .8rem; }
}

/* the footer's language links, as on the homepage */
.site-footer .lang-links { grid-column: 1 / -1; display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem 1.4rem; padding-top: 1.2rem; border-top: 1px solid var(--line); font: .66rem/1.6 var(--mono); letter-spacing: .06em; }
.site-footer .lang-links a { opacity: .6; text-decoration: none; }
.site-footer .lang-links a:hover, .site-footer .lang-links a[aria-current] { opacity: 1; text-decoration: underline; }
:lang(zh) .corr-head h1, :lang(zh) .section h2, :lang(zh) .hub-card h2, :lang(zh) .cities caption { letter-spacing: 0; line-height: 1.15; }
