/* Brochure-only subset of app/src/index.css. Loaded after govuk-frontend.min.css
   so these rules, and the @font-face overrides below, win. Signed-in-screen
   rules are deliberately not copied — keep this file to what public pages use. */

/* ---- FONT TOGGLE: Overpass instead of GDS Transport -----------------------
   GDS Transport is crown copyright, licensed only for real GOV.UK services.
   Overpass (SIL Open Font License, road-signage heritage like Transport) is a
   free, self-hosted stand-in. These rules remap the "GDS Transport" family to
   Overpass so the whole site uses it. To go back to GDS Transport, delete this
   block; to fall back to Arial instead, swap the src for local("Arial"). */
@font-face {
  font-family: "GDS Transport";
  font-style: normal;
  font-weight: 400;
  font-display: fallback;
  src: url("/static/fonts/overpass/overpass-400.woff2") format("woff2");
}
@font-face {
  font-family: "GDS Transport";
  font-style: normal;
  font-weight: 700;
  font-display: fallback;
  src: url("/static/fonts/overpass/overpass-700.woff2") format("woff2");
}
/* -------------------------------------------------------------------------- */

/* Matches the app's container width so the brochure and the signed-in screens
   line up when a user crosses between them. */
.govuk-width-container {
  max-width: 1100px;
}

/* App name in the header: white and larger, like the GOV.UK product name. */
.govuk-header__logotype-text {
  color: #ffffff;
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.1;
}
.govuk-header__link--homepage,
.govuk-header__link--homepage:link,
.govuk-header__link--homepage:visited,
.govuk-header__link--homepage:hover,
.govuk-header__link--homepage:active {
  color: #ffffff;
  text-decoration: none;
}
.govuk-header__link--homepage:hover {
  text-decoration: underline;
  text-decoration-thickness: 3px;
}

/* Inner-page service nav: a clearer light blue than the near-white default.
   The full-width background stays edge to edge; the hairlines above and below
   are drawn on the inner width-container so they align to the content column
   (matching the GOV.UK Design System header), not the whole viewport. */
.app-service-nav.govuk-service-navigation {
  background-color: #f4f8fb;
  border-bottom: 0;
}
.app-service-nav > .govuk-width-container {
  border-top: 1px solid #b1c7dd;
  border-bottom: 1px solid #b1c7dd;
}

/* Home page: full brand-blue nav that merges with the header and the hero,
   separated by a faint white rule top and bottom (also content-width). */
.app-service-nav--brand.govuk-service-navigation {
  background-color: #0b2d5c;
}
.app-service-nav--brand > .govuk-width-container {
  border-top-color: rgba(255, 255, 255, 0.35);
  border-bottom-color: rgba(255, 255, 255, 0.35);
}
.app-service-nav--brand .govuk-service-navigation__link,
.app-service-nav--brand .govuk-service-navigation__link:link,
.app-service-nav--brand .govuk-service-navigation__link:visited,
.app-service-nav--brand .govuk-service-navigation__link:hover {
  color: #ffffff;
}
.app-service-nav--brand .govuk-service-navigation__item--active {
  border-color: #ffffff;
}
.app-service-nav--brand .govuk-service-navigation__item--active .govuk-service-navigation__link {
  color: #ffffff;
}

/* Active service-nav item shows a blue underline. Keep the yellow focus box for
   keyboard users (:focus-visible) but drop it after a mouse click so the active
   item is not double-marked yellow and blue at the same time. */
.govuk-service-navigation__link:focus:not(:focus-visible) {
  background-color: transparent;
  box-shadow: none;
  outline: none;
  color: #1d70b8;
}
.govuk-service-navigation__item--active .govuk-service-navigation__link:focus:not(:focus-visible) {
  color: #0b0c0c;
}

/* Full-bleed hero on the public home page. */
.app-hero {
  background: #0b2d5c;
  color: #ffffff;
  padding: 45px 0 40px;
  margin-bottom: 10px;
}
.app-hero__title {
  color: #ffffff;
  margin-bottom: 20px;
}
.app-hero__lead {
  color: #ffffff;
  font-size: 1.5rem;
  line-height: 1.3;
  margin-bottom: 30px;
  max-width: 30em;
}
.app-hero__actions {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}
.app-hero__start.govuk-button {
  margin-bottom: 0;
  background: #ffffff;
  color: #0b2d5c;
  box-shadow: 0 2px 0 #0b3d63;
}
.app-hero__start.govuk-button:hover {
  background: #dbe4eb;
  color: #0b2d5c;
}
.app-hero__start .govuk-button__start-icon {
  fill: currentColor;
}
/* Sign in: a secondary hero action, white outline button on the blue band. */
.app-hero__signin.govuk-button,
.app-hero__signin.govuk-button:link,
.app-hero__signin.govuk-button:visited {
  margin-bottom: 0;
  background: transparent;
  color: #ffffff;
  box-shadow: inset 0 0 0 2px #ffffff;
}
.app-hero__signin.govuk-button:hover {
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff;
}

.app-footer-nav {
  margin-bottom: 15px;
}

/* Focus lands here from the skip link. The container is not keyboard reachable
   in its own right, so GOV.UK suppresses the outline on skip-link targets too —
   showing one would be noise, not a focus cue. */
#main-content:focus {
  outline: none;
}

/* The mark sits beside the wordmark, which is real text — so the image carries
   empty alt and a screen reader announces the name once, not twice. */
.app-header-mark {
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
  margin-top: -3px;
}

/* govuk-frontend ships a blue masthead. Left alone it stacks a second, lighter
   blue above our navy nav and hero, which reads as an accident rather than a
   palette. */
.govuk-header {
  background: #0b2d5c;
  border-bottom: 0;
}