/* ==========================================================================
   info.css -- tagline, phone and address
   --------------------------------------------------------------------------
   Sits directly on the green page background. Column width and centring come
   from layout.css; this file only handles type and vertical rhythm.

   Note on spacing: every element carries `margin-top: var(--stack-gap)` and a
   small `margin-bottom`. Adjacent margins collapse to the larger of the two,
   so the gap between any two lines is a flat 24px -- matching the original,
   which produced the same result the same way.
   ========================================================================== */

.info {
  padding-top: var(--info-pad-top);
  padding-bottom: var(--info-pad-bottom);
}

/* ---------- "Call or come on by!" ---------- */

.info__tagline {
  margin: 0 0 .3em;
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: .02em;
  text-align: center;
  text-transform: uppercase;
  color: var(--ydb-ink);
}

/* ---------- Phone + address ---------- */

.info__contact {
  margin: var(--stack-gap) 0 .3em;
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: .05em;
  text-align: center;
  text-transform: uppercase;
  color: var(--ydb-ink-soft);
}

/* The phone number is a tel: link so it is tappable on a phone, but it is
   styled to be indistinguishable from the surrounding text -- the original
   rendered it as plain text and this must not change a pixel. */
.info__phone {
  color: inherit;
  text-decoration: none;
}