/*
 * Authored site overrides — post-migration design changes that are NOT part of
 * the carried WordPress CSS. Loaded after the frozen head (and after
 * a11y-overrides.css) so these rules win. Safe to edit; keep it small.
 */

/* ---------------------------------------------------------------------------
 * Header tagline (client amend, 2026-09)
 * "Conservation, Restoration and Heritage" sits with the email + phone in the
 * header's top row. The logo lettering is outlined serif capitals with wide
 * tracking, so the tagline echoes that with a system serif stack — no web font
 * is loaded (a third-party font request would break pre-consent silence).
 * Tweak the look with the custom properties below.
 * ------------------------------------------------------------------------ */
:root {
  --esr-tagline-font: Cambria, 'Hoefler Text', 'Iowan Old Style', 'Palatino Linotype', Georgia, 'Times New Roman', serif;
  --esr-tagline-color: #7b7b7b; /* the logo's grey ("STONE · REPAIRS") */
  --esr-tagline-size: 14px; /* px on purpose: the theme sets the root font-size to 62.5% */
  --esr-tagline-tracking: 0.2em;
}

.esr-header-tagline {
  font-family: var(--esr-tagline-font);
  font-size: var(--esr-tagline-size);
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: var(--esr-tagline-tracking);
  text-transform: uppercase;
  color: var(--esr-tagline-color);
}

/* Desktop: tagline on its own line above the email + phone, all right-aligned
   to the same edge (the links carry 20px side padding, so the tagline does too;
   the tracking adds trailing space after the last letter, hence the offset). */
#brxe-c19f4c {
  flex-wrap: wrap;
  justify-content: flex-end;
  row-gap: 0;
}

#brxe-c19f4c .esr-header-tagline {
  flex: 0 0 100%;
  text-align: right;
  padding: 0 calc(20px - var(--esr-tagline-tracking)) 0 20px;
}

/* Keep the header's height in check now the group has two lines. */
#brxe-c19f4c .fr-header-foxtrot__phone {
  padding-top: 4px;
  padding-bottom: 4px;
}

/* Tablet / mobile: the carried CSS hides the whole contact group below 1101px
   (the burger takes over). Bring the group back as a slim centred strip under
   the logo row, showing only the tagline. */
@media (max-width: 1100px) {
  .fr-header-foxtrot__top-inner {
    flex-wrap: wrap;
    row-gap: 6px;
  }

  #brxe-c19f4c {
    display: flex;
    order: 3;
    flex: 0 0 100%;
    justify-content: center;
  }

  #brxe-c19f4c .fr-header-foxtrot__phone {
    display: none;
  }

  #brxe-c19f4c .esr-header-tagline {
    text-align: center;
    padding: 0;
    /* centre optically: drop the trailing tracking space */
    margin-right: calc(-1 * var(--esr-tagline-tracking));
    font-size: 11px;
    letter-spacing: 0.16em;
  }
}