/* Public landing page */
.wrap { max-width: 1080px; margin: 0 auto; padding: 0 var(--gutter); }

.hero { padding: 72px 0 40px; }
.hero__sign { max-width: 880px; }
.hero__sign .sign__face { padding: 34px 36px 38px; }
.hero h1 {
  font-size: clamp(2.4rem, 7vw, 4.4rem);
  font-weight: 800;
  letter-spacing: -0.01em;
  line-height: 1;
}
.hero__dest { font-size: clamp(1.2rem, 3vw, 1.65rem); font-weight: 600; margin-top: 14px; }
.hero__lede { font-size: var(--step-0); margin-top: 18px; max-width: 52ch; opacity: .92; }
.hero__where { font-size: var(--step--1); font-weight: 600; opacity: .85; margin-top: 24px; }

/* The exit tab on top of the sign is the client login */
.sign__tab {
  position: absolute;
  top: -40px;
  right: 40px;
  background: var(--sign);
  color: var(--sign-ink);
  font-weight: 800;
  font-size: var(--step-0);
  text-decoration: none;
  padding: 8px 8px 0;
  border-radius: 10px 10px 0 0;
}
.sign__tab span {
  display: block;
  border: 3px solid var(--sign-ink);
  border-bottom: 0;
  border-radius: 6px 6px 0 0;
  padding: 6px 16px 8px;
}
.sign__tab:hover span { background: var(--sign-deep); }

.section { padding: 48px 0; border-top: 1px solid var(--seam); }
.section__grid { display: grid; grid-template-columns: minmax(180px, 1fr) 2.4fr; gap: 24px 48px; }
.section h2 { font-size: var(--step-2); }
.prose p { max-width: 64ch; color: var(--ink); }
.prose p + p { margin-top: 14px; }
.prose .quiet { color: var(--ink-2); }

.services { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 40px; margin: 0; }
.services div { border-top: 3px solid var(--sign); padding-top: 12px; }
.services dt { font-weight: 800; font-size: var(--step-1); }
.services dd { margin: 6px 0 0; color: var(--ink-2); max-width: 48ch; }

.steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; counter-reset: step; }
.steps li { display: grid; grid-template-columns: 52px 1fr; gap: 14px; align-items: start; counter-increment: step; }
.steps li::before {
  content: counter(step);
  font-weight: 800; font-size: var(--step-2); line-height: 1;
  color: var(--sign-ink); background: var(--sign);
  width: 52px; height: 52px; border-radius: 8px;
  display: grid; place-items: center;
  box-shadow: inset 0 0 0 3px var(--sign), inset 0 0 0 5px var(--sign-ink);
}
.steps strong { display: block; font-size: var(--step-1); }
.steps span { color: var(--ink-2); }

.contact-lines { display: grid; gap: 8px; font-size: var(--step-1); font-weight: 600; }
.contact-lines a { text-decoration: none; }
.contact-lines a:hover { text-decoration: underline; }

.foot { padding: 28px 0 40px; color: var(--ink-3); font-size: var(--step--1); border-top: 1px solid var(--seam); }
.foot .wrap { display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: space-between; }

@media (max-width: 760px) {
  .hero { padding-top: 64px; }
  .hero__sign .sign__face { padding: 24px 20px 26px; }
  .sign__tab { right: 20px; }
  .section__grid { grid-template-columns: 1fr; }
  .services { grid-template-columns: 1fr; }
}
.contact-note { margin-top: 16px; }