/* DriveTest homepage custom WPBakery elements.
   Loaded only on the static front page by functions.php. */

.dt-home-builder-row {
  width: min(1180px, calc(100% - 32px));
  margin-right: auto !important;
  margin-left: auto !important;
}

.dt-home-builder-row > .wpb_column > .vc_column-inner {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

.dt-home-builder-row .wpb_content_element {
  margin-bottom: 0;
}

.dt-home-hero,
.dt-home-section,
.dt-home-hero *,
.dt-home-section * {
  box-sizing: border-box;
}

/* Compact full-width homepage alert banner */
.dt-home-hero {
  position: relative;
  left: 50%;
  width: 100vw;
  min-height: 260px;
  margin: 0 0 22px;
  overflow: hidden;
  transform: translateX(-50%);
  background-color: #17304f;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

/* Soft brand-colour tint keeps the photograph tied to the existing site */
.dt-home-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(
      90deg,
      rgba(0, 35, 82, .58) 0%,
      rgba(0, 35, 82, .28) 43%,
      rgba(0, 35, 82, .06) 72%,
      rgba(0, 35, 82, .12) 100%
    );
  pointer-events: none;
}

.dt-home-hero__inner {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  width: min(1180px, calc(100% - 32px));
  min-height: 260px;
  margin: 0 auto;
  padding: 24px 0;
}

.dt-home-hero--left .dt-home-hero__inner {
  justify-content: flex-start;
}

.dt-home-hero--center .dt-home-hero__inner {
  justify-content: center;
}

.dt-home-hero--right .dt-home-hero__inner {
  justify-content: flex-end;
}

/*
 * Smaller translucent blue panel reads as a homepage alert banner,
 * rather than the large black title panel used on secondary pages.
 */
.dt-home-hero__overlay {
  width: min(520px, 48%);
  padding: 24px 28px;
  color: #fff;
  background: linear-gradient(
    135deg,
    rgba(0, 52, 121, .92),
    rgba(0, 38, 91, .82)
  );
  border-left: 5px solid #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .14);
  text-align: left;
}

.dt-home-hero--center .dt-home-hero__overlay {
  text-align: center;
  border-left: 0;
  border-top: 4px solid #fff;
}

.dt-home-hero__label {
  display: inline-block;
  margin-bottom: 9px;
  color: #fff;
  font-size: .78rem;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.dt-home-hero h1 {
  margin: 0 0 10px;
  color: #fff;
  font: inherit;
  font-size: 1.85rem;
  line-height: 1.18;
  font-weight: 600;
}

.dt-home-hero p {
  margin: 0 0 16px;
  color: #fff;
  font-size: .96rem;
  line-height: 1.48;
}

.dt-home-button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 42px;
  padding: 8px 16px;
  border: 2px solid #fff;
  color: #003479 !important;
  background: #fff;
  font-weight: 600;
  text-decoration: none !important;
}

.dt-home-button:hover,
.dt-home-button:focus {
  color: #fff !important;
  background: transparent;
}

.dt-home-section {
  margin: 0 0 14px;
  padding: 26px 28px;
  border: 1px solid #d5dce2;
  background: #fff;
}

.dt-announcements-section {
  background: #f3f5f7;
}

.dt-home-section__heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 18px;
}

.dt-home-section__heading h2 {
  margin: 0;
  color: #222;
  font: inherit;
  font-size: 1.75rem;
  line-height: 1.2;
  font-weight: 500;
}

.dt-home-section__heading p {
  margin: 5px 0 0;
}

.dt-home-section__link {
  margin-top: 5px;
  color: #003479 !important;
  font-weight: 600;
  text-decoration: none !important;
  white-space: nowrap;
}

.dt-services-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

.dt-service-card {
  display: flex;
  min-width: 0;
  min-height: 370px;
  overflow: hidden;
  flex-direction: column;
  border: 1px solid #d5dce2;
  background: #fff;
}

.dt-service-card__image {
  display: block;
  width: 100%;
  height: 128px;
  object-fit: cover;
}

.dt-service-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 16px 14px 14px;
}

.dt-service-card h3 {
  margin: 0 0 10px;
  font: inherit;
  font-size: 1.05rem;
  line-height: 1.28;
  font-weight: 600;
}

.dt-service-card h3 a,
.dt-service-card__action {
  color: #003479 !important;
  text-decoration: none !important;
}

.dt-service-card p {
  margin: 0 0 16px;
  font-size: .95rem;
  line-height: 1.45;
}

.dt-service-card__action {
  margin-top: auto;
  font-weight: 600;
}

.dt-announcement-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.dt-announcement-card {
  display: flex;
  min-height: 205px;
  flex-direction: column;
  padding: 18px;
  border: 1px solid #d5dce2;
  background: #fff;
}

.dt-announcement-card time {
  margin-bottom: 8px;
  color: #555;
  font-size: .875rem;
}

.dt-announcement-card h3 {
  margin: 0 0 10px;
  font: inherit;
  font-size: 1.05rem;
  line-height: 1.28;
  font-weight: 600;
}

.dt-announcement-card h3 a,
.dt-announcement-link {
  color: #003479 !important;
  text-decoration: none !important;
}

.dt-announcement-excerpt {
  margin-bottom: 16px;
  font-size: .95rem;
  line-height: 1.45;
}

.dt-announcement-excerpt p {
  margin: 0;
}

.dt-announcement-link {
  margin-top: auto;
  font-weight: 600;
}

.dt-quick-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.dt-quick-card {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr) 22px;
  align-items: center;
  gap: 16px;
  min-height: 128px;
  padding: 16px 20px;
  border: 1px solid #d5dce2;
  color: #333 !important;
  background: #fff;
  text-decoration: none !important;
}

.dt-quick-card img {
  display: block;
  width: 100px;
  height: 68px;
  object-fit: contain;
}

.dt-quick-card__copy strong {
  display: block;
  margin-bottom: 6px;
  color: #1f6b3a;
  font-size: 1.08rem;
  line-height: 1.2;
  font-weight: 600;
}

.dt-quick-card__copy small {
  display: block;
  color: #333;
  font-size: .82rem;
  line-height: 1.45;
}

.dt-quick-card__arrow {
  justify-self: end;
  color: #003479;
  font-size: 1.7rem;
  font-weight: 600;
}

@media (max-width: 1050px) {
  .dt-services-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }


  .dt-quick-card {
    grid-template-columns: 78px minmax(0, 1fr) 18px;
    gap: 12px;
    padding: 14px;
  }

  .dt-quick-card img {
    width: 72px;
    height: 50px;
  }
}

@media (max-width: 767px) {
  .dt-home-builder-row {
    width: 100%;
  }

  .dt-home-hero {
    left: auto;
    width: 100%;
    min-height: 300px;
    margin-bottom: 14px;
    transform: none;
  }

  .dt-home-hero__inner {
    width: 100%;
    min-height: 300px;
    padding: 20px 16px;
  }

  .dt-home-hero__overlay {
    width: 100%;
    padding: 24px 20px;
    text-align: left;
    background: rgba(15, 15, 15, .78);
  }

  .dt-home-hero h1 {
    font-size: 1.75rem;
  }

  .dt-home-button {
    width: 100%;
  }

  .dt-home-section {
    padding: 22px 16px;
    border-right: 0;
    border-left: 0;
  }

  .dt-home-section__heading {
    align-items: center;
  }

  .dt-home-section__heading h2 {
    font-size: 1.45rem;
  }

  .dt-home-section__heading p {
    display: none;
  }

  .dt-home-section__link {
    margin: 0;
    font-size: .875rem;
  }

  .dt-services-grid,
  .dt-announcement-grid,
  .dt-quick-grid {
    display: block;
  }

  .dt-service-card {
    position: relative;
    display: grid;
    grid-template-columns: 82px 1fr auto;
    align-items: center;
    min-height: 72px;
    margin-bottom: 8px;
  }

  .dt-service-card__image {
    width: 82px;
    height: 72px;
  }

  .dt-service-card__body {
    display: contents;
  }

  .dt-service-card h3 {
    margin: 0;
    padding: 10px 12px;
    font-size: 1rem;
  }

  .dt-service-card h3 a::after {
    content: "";
    position: absolute;
    inset: 0;
  }

  .dt-service-card p,
  .dt-service-card__action {
    display: none;
  }

  .dt-service-card::after {
    content: "\203A";
    padding-right: 14px;
    color: #003479;
    font-size: 1.6rem;
  }

  .dt-announcement-card {
    min-height: 0;
    margin-bottom: 8px;
    padding: 14px;
  }

  .dt-announcement-excerpt {
    display: none;
  }

  .dt-quick-card {
    grid-template-columns: 64px 1fr auto;
    min-height: 68px;
    margin-bottom: 8px;
    padding: 8px 12px;
  }

  .dt-quick-card img {
    width: 58px;
    height: 42px;
  }

  .dt-quick-card__copy strong {
    margin: 0;
    font-size: 1rem;
  }

  .dt-quick-card__copy small {
    display: none;
  }

  .dt-quick-card__arrow {
    font-size: 1.5rem;
  }
}


/* Alert hero responsive refinements */
@media (max-width: 767px) {
  .dt-home-hero {
    min-height: 235px;
    background-position: center;
  }

  .dt-home-hero__inner {
    min-height: 235px;
    padding: 18px 16px;
  }

  .dt-home-hero__overlay {
    width: 100%;
    padding: 20px;
    border-left-width: 4px;
  }

  .dt-home-hero h1 {
    font-size: 1.5rem;
  }

  .dt-home-hero p {
    font-size: .9rem;
  }
}


/* Online Services header CTA: replaces the old View all services link. */
.dt-services-section .dt-home-section__link--centre {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 44px;
  margin-top: 0;
  padding: 9px 16px;
  border: 2px solid #003479;
  color: #003479 !important;
  background: #fff;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none !important;
  white-space: nowrap;
}

.dt-services-section .dt-home-section__link--centre:hover,
.dt-services-section .dt-home-section__link--centre:focus {
  color: #fff !important;
  background: #003479;
}

.dt-home-section__link-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  overflow: hidden;
  font-size: 15px;
  line-height: 1;
}

@media (max-width: 767px) {
  .dt-services-section .dt-home-section__heading {
    align-items: stretch;
    flex-direction: column;
  }

  .dt-services-section .dt-home-section__link--centre {
    width: 100%;
    margin-top: 4px;
  }
}

/* =========================================================
   Alert hero refinement: align with existing interior pages
   ========================================================= */

.dt-home-hero--alert .dt-home-hero__overlay {
  width: min(520px, 48%);
  padding: 22px 26px;
  color: #fff;
  background: rgba(18, 18, 18, .78);
  border-left: 0;
  border-top: 0;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
  text-align: left;
}

.dt-home-hero--alert .dt-home-hero__label {
  margin-bottom: 8px;
  color: #fff;
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.dt-home-hero--alert h1 {
  margin-bottom: 9px;
  font-size: 1.72rem;
  line-height: 1.18;
}

.dt-home-hero--alert p {
  max-width: 46ch;
  margin-bottom: 12px;
  font-size: .94rem;
  line-height: 1.45;
}

/* Small card-style action instead of a large button */
.dt-home-alert-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 0;
  padding: 0;
  border: 0;
  color: #fff !important;
  background: transparent;
  font-size: .92rem;
  font-weight: 600;
  line-height: 1.3;
  text-decoration: none !important;
}

.dt-home-alert-link:hover,
.dt-home-alert-link:focus {
  color: #fff !important;
  text-decoration: underline !important;
}

.dt-home-alert-link span {
  font-size: 1.15em;
  line-height: 1;
}

@media (max-width: 767px) {
  .dt-home-hero--alert .dt-home-hero__overlay {
    width: 100%;
    padding: 18px;
  }

  .dt-home-hero--alert h1 {
    font-size: 1.45rem;
  }

  .dt-home-hero--alert p {
    font-size: .9rem;
  }

  .dt-home-alert-link {
    font-size: .9rem;
  }
}

/* =========================================================
   Copy weight, centre icon, and alert width refinements
   ========================================================= */

/* Keep all supporting text visually secondary and regular weight. */
.dt-services-section .dt-home-section__heading p,
.dt-service-card p,
.dt-announcement-excerpt,
.dt-announcement-excerpt p,
.dt-quick-card__copy small {
  font-weight: 400 !important;
}

/* Some inherited theme selectors apply bold to paragraph descendants. */
.dt-service-card__body p,
.dt-announcement-card .dt-announcement-excerpt,
.dt-announcement-card .dt-announcement-excerpt *,
.dt-quick-card__copy small {
  font-family: inherit;
  font-style: normal;
  font-weight: 400 !important;
}

/* Modern outline location icon; no emoji rendering differences. */
.dt-home-section__link--centre {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.dt-home-section__link-icon {
  display: inline-flex;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  align-items: center;
  justify-content: center;
  color: #003479;
}

.dt-home-section__link-icon svg {
  display: block;
  width: 19px;
  height: 19px;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Give alerts a little more room without turning the panel into a large hero box. */
.dt-home-hero--alert .dt-home-hero__overlay {
  width: min(610px, 56%);
  padding: 23px 28px;
}

.dt-home-hero--alert p {
  max-width: 58ch;
}

@media (max-width: 900px) and (min-width: 768px) {
  .dt-home-hero--alert .dt-home-hero__overlay {
    width: min(570px, 64%);
  }
}

@media (max-width: 767px) {
  .dt-home-hero--alert .dt-home-hero__overlay {
    width: 100%;
  }

  .dt-home-section__link--centre {
    gap: 7px;
  }

  .dt-home-section__link-icon,
  .dt-home-section__link-icon svg {
    width: 18px;
    height: 18px;
  }
}

/* =========================================================
   Clickable Online Service cards and hover interaction
   ========================================================= */

.dt-service-card {
  position: relative;
  color: #333 !important;
  text-decoration: none !important;
  transition:
    transform .2s ease,
    border-color .2s ease,
    box-shadow .2s ease;
}

.dt-service-card--linked {
  cursor: pointer;
}

.dt-service-card__media {
  display: block;
  width: 100%;
  overflow: hidden;
}

.dt-service-card__image {
  transition: transform .28s ease;
}

.dt-service-card__body {
  color: #333;
}

.dt-service-card h3 {
  color: #003479;
}

.dt-service-card__description {
  display: block;
  margin: 0 0 16px;
  color: #333;
  font-size: .95rem;
  font-style: normal;
  font-weight: 400 !important;
  line-height: 1.45;
}

.dt-service-card__action {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: auto;
  color: #003479 !important;
  font-weight: 600;
  text-decoration: none !important;
}

.dt-service-card__arrow {
  display: inline-block;
  font-size: 1.12em;
  line-height: 1;
  transition: transform .2s ease;
}

.dt-service-card--linked:hover {
  z-index: 2;
  border-color: #7ca6d8;
  box-shadow: 0 10px 24px rgba(0, 52, 121, .14);
  transform: translateY(-4px);
}

.dt-service-card--linked:hover .dt-service-card__image {
  transform: scale(1.035);
}

.dt-service-card--linked:hover .dt-service-card__arrow {
  transform: translateX(3px);
}

.dt-service-card--linked:focus {
  outline: none;
}

.dt-service-card--linked:focus-visible {
  outline: 3px solid #ffbf47;
  outline-offset: 3px;
  border-color: #003479;
  box-shadow: 0 10px 24px rgba(0, 52, 121, .16);
  transform: translateY(-2px);
}

@media (max-width: 767px) {
  .dt-service-card__media {
    width: 82px;
    height: 72px;
  }

  .dt-service-card__body {
    display: contents;
  }

  .dt-service-card__description,
  .dt-service-card__action {
    display: none;
  }

  .dt-service-card h3 {
    margin: 0;
    padding: 10px 12px;
    font-size: 1rem;
  }

  .dt-service-card--linked:hover,
  .dt-service-card--linked:focus-visible {
    box-shadow: none;
    transform: none;
  }

  .dt-service-card--linked:hover .dt-service-card__image {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dt-service-card,
  .dt-service-card__image,
  .dt-service-card__arrow {
    transition: none !important;
  }

  .dt-service-card--linked:hover,
  .dt-service-card--linked:focus-visible,
  .dt-service-card--linked:hover .dt-service-card__image,
  .dt-service-card--linked:hover .dt-service-card__arrow {
    transform: none !important;
  }
}

/* =========================================================
   Open-section layout
   Removes the boxed page-within-a-page appearance while
   preserving borders and hover effects on individual cards.
   ========================================================= */

.dt-home-section {
  position: relative;
  margin: 0;
  padding: 34px 0;
  border: 0;
  background: transparent;
}

/* Gentle separation between the white content sections. */
.dt-services-section {
  padding-top: 38px;
  padding-bottom: 38px;
  border-bottom: 1px solid #d8dee5;
}

.dt-quick-links-section {
  padding-top: 34px;
  padding-bottom: 42px;
  border-top: 1px solid #d8dee5;
}

/*
 * Announcements retain a soft background band, but no visible
 * outer container. The pseudo-element extends the colour across
 * the viewport while the content stays aligned to the site grid.
 */
.dt-announcements-section {
  z-index: 0;
  padding-top: 36px;
  padding-bottom: 38px;
  background: transparent;
}

.dt-announcements-section::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  z-index: -1;
  width: 100vw;
  transform: translateX(-50%);
  background: #f3f5f7;
}

/* Slightly stronger heading rhythm, closer to interior pages. */
.dt-home-section__heading {
  margin-bottom: 20px;
}

.dt-home-section__heading h2 {
  color: #222;
  font-size: 1.8rem;
  font-weight: 500;
}

/* Individual cards remain the only boxed UI. */
.dt-service-card,
.dt-announcement-card,
.dt-quick-card {
  border-color: #d5dce2;
}

/* Remove any inherited panel shadows from the section wrappers. */
.dt-services-section,
.dt-announcements-section,
.dt-quick-links-section {
  box-shadow: none;
}

/* Prevent WPBakery row spacing from recreating large white gaps. */
.dt-home-builder-row {
  margin-bottom: 0 !important;
}

.dt-home-builder-row > .wpb_column > .vc_column-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

@media (max-width: 767px) {
  .dt-home-section {
    padding: 24px 16px;
  }

  .dt-services-section {
    padding-top: 26px;
    padding-bottom: 28px;
  }

  .dt-announcements-section {
    padding-top: 28px;
    padding-bottom: 28px;
  }

  .dt-quick-links-section {
    padding-top: 26px;
    padding-bottom: 32px;
  }

  .dt-announcements-section::before {
    width: 100vw;
  }
}

/* Larger Quick Link icons */
.dt-quick-card {
  grid-template-columns: 130px minmax(0, 1fr) 22px;
}

.dt-quick-card img {
  width: 118px;
  height: 78px;
}

@media (max-width: 1050px) and (min-width: 768px) {
  .dt-quick-card {
    grid-template-columns: 92px minmax(0, 1fr) 18px;
  }

  .dt-quick-card img {
    width: 86px;
    height: 58px;
  }
}

@media (max-width: 767px) {
  .dt-quick-card {
    grid-template-columns: 68px 1fr auto;
  }

  .dt-quick-card img {
    width: 62px;
    height: 46px;
  }
}


/* =========================================================
   Clickable Announcement and Quick Link cards — final responsive version
   ========================================================= */

/* Announcement shortcode now renders the full card as one link. */
.dt-announcement-card {
  display: block;
  min-width: 0;
  min-height: 205px;
  padding: 0;
  overflow: hidden;
  color: #333 !important;
  background: #fff;
  text-decoration: none !important;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    background-color 180ms ease;
}

.dt-announcement-card > article {
  display: flex;
  width: 100%;
  min-width: 0;
  min-height: 205px;
  padding: 20px;
  flex-direction: column;
  box-sizing: border-box;
}

.dt-announcement-card time {
  display: block;
  margin: 0 0 10px;
  color: #555;
  font-size: .875rem;
  font-weight: 600;
}

.dt-announcement-card h3 {
  max-width: 100%;
  margin: 0 0 12px;
  padding: 0 !important;
  color: #003479;
  font: inherit;
  font-size: 1.05rem;
  line-height: 1.32;
  font-weight: 600;
  overflow-wrap: break-word;
  word-break: normal;
}

.dt-announcement-card .dt-announcement-excerpt {
  max-width: 100%;
  margin: 0 0 18px;
  padding: 0 !important;
  color: #333;
  font-size: .95rem;
  line-height: 1.5;
  font-weight: 400;
  overflow-wrap: break-word;
  word-break: normal;
}

.dt-announcement-card .dt-announcement-excerpt p {
  margin: 0;
}

.dt-announcement-card .dt-announcement-link {
  margin-top: auto;
  color: #003479 !important;
  font-weight: 600;
  text-decoration: none !important;
}

/* Quick-link cards are already rendered as full-card links. */
.dt-quick-card {
  min-width: 0;
  color: #333 !important;
  text-decoration: none !important;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    background-color 180ms ease;
}

.dt-quick-card > img {
  max-width: 100%;
  object-fit: contain;
}

.dt-quick-card__copy {
  min-width: 0;
}

.dt-quick-card__copy strong,
.dt-quick-card__copy small {
  overflow-wrap: break-word;
  word-break: normal;
}

/* Desktop pointer interaction only. */
@media (hover: hover) and (pointer: fine) {
  .dt-announcement-card:hover,
  .dt-quick-card:hover {
    z-index: 2;
    border-color: #8ba9c8;
    background: #fff;
    box-shadow: 0 10px 24px rgba(0, 52, 121, .13);
    transform: translateY(-4px);
  }

  .dt-announcement-card:hover h3,
  .dt-quick-card:hover .dt-quick-card__copy strong {
    text-decoration: underline;
    text-underline-offset: 3px;
  }
}

.dt-announcement-card:focus-visible,
.dt-quick-card:focus-visible {
  z-index: 3;
  outline: 3px solid #ffbf47;
  outline-offset: 3px;
  border-color: #003479;
  box-shadow: 0 8px 20px rgba(0, 52, 121, .14);
}

.dt-announcement-card:active,
.dt-quick-card:active {
  background: #f4f8fc;
  border-color: #8ba9c8;
}

/* =========================================================
   Tablet: avoid cramped three-column cards
   ========================================================= */

@media (max-width: 900px) {
  .dt-announcement-grid,
  .dt-quick-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .dt-announcement-card {
    min-height: 0;
    margin: 0;
  }

  .dt-announcement-card > article {
    min-height: 0;
    padding: 20px 22px;
  }

  .dt-announcement-card h3 {
    font-size: 1.08rem;
  }

  .dt-quick-card {
    grid-template-columns: 100px minmax(0, 1fr) 24px;
    gap: 18px;
    width: 100%;
    min-height: 112px;
    margin: 0;
    padding: 16px 18px;
  }

  .dt-quick-card > img {
    width: 92px;
    height: 68px;
    max-height: 68px;
    object-fit: contain;
  }

  .dt-quick-card__copy strong {
    margin-bottom: 6px;
    font-size: 1.05rem;
  }

  .dt-quick-card__copy small {
    display: block;
    font-size: .84rem;
    line-height: 1.4;
  }

  .dt-quick-card__arrow {
    padding: 0;
    font-size: 1.65rem;
  }
}

/* =========================================================
   Phone: compact, uncropped horizontal cards
   ========================================================= */

@media (max-width: 600px) {
  .dt-home-section__heading,
  .dt-announcements-section .dt-home-section__heading,
  .dt-quick-links-section .dt-home-section__heading {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .dt-home-section__heading h2 {
    width: 100%;
    margin: 0;
    font-size: 1.45rem;
    line-height: 1.2;
  }

  .dt-home-section__heading > a,
  .dt-home-section__heading .dt-home-section__link {
    width: auto;
    max-width: 100%;
    margin: 0;
    white-space: normal;
    text-align: left;
    overflow-wrap: break-word;
  }

  .dt-announcement-grid,
  .dt-quick-grid {
    gap: 10px;
  }

  .dt-announcement-card > article {
    padding: 16px 17px;
  }

  .dt-announcement-card time {
    margin-bottom: 9px;
    font-size: .875rem;
  }

  .dt-announcement-card h3 {
    margin-bottom: 12px;
    font-size: 1rem;
    line-height: 1.32;
  }

  .dt-announcement-card .dt-announcement-excerpt {
    display: none;
  }

  .dt-announcement-card .dt-announcement-link {
    margin-top: 4px;
    font-size: .95rem;
  }

  .dt-quick-card {
    grid-template-columns: 76px minmax(0, 1fr) 22px;
    gap: 12px;
    min-height: 86px;
    padding: 10px 12px;
    overflow: hidden;
  }

  .dt-quick-card > img {
    width: 72px;
    height: 58px;
    max-width: 72px;
    max-height: 58px;
    object-fit: contain;
  }

  .dt-quick-card__copy {
    padding: 0;
  }

  .dt-quick-card__copy strong {
    margin: 0;
    font-size: 1rem;
    line-height: 1.25;
  }

  .dt-quick-card__copy small {
    display: none;
  }

  .dt-quick-card__arrow {
    justify-self: end;
    padding: 0;
    font-size: 1.55rem;
  }

  .dt-announcement-card,
  .dt-quick-card {
    transform: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dt-announcement-card,
  .dt-quick-card {
    transition: none !important;
  }

  .dt-announcement-card:hover,
  .dt-quick-card:hover {
    transform: none !important;
  }
}


/* =========================================================
   Final announcement-card inner spacing fix
   Applies padding to the clickable card itself so it works
   whether the shortcode outputs an inner <article> or not.
   ========================================================= */

.dt-announcements-section .dt-announcement-grid .dt-announcement-card {
  display: flex !important;
  min-width: 0;
  min-height: 205px;
  padding: 20px !important;
  overflow: hidden;
  flex-direction: column;
  box-sizing: border-box !important;
}

.dt-announcements-section .dt-announcement-grid .dt-announcement-card > article {
  display: flex !important;
  width: 100%;
  min-width: 0;
  min-height: 100%;
  padding: 0 !important;
  flex: 1;
  flex-direction: column;
  box-sizing: border-box !important;
}

.dt-announcements-section .dt-announcement-grid .dt-announcement-card time,
.dt-announcements-section .dt-announcement-grid .dt-announcement-card h3,
.dt-announcements-section .dt-announcement-grid .dt-announcement-card .dt-announcement-excerpt,
.dt-announcements-section .dt-announcement-grid .dt-announcement-card .dt-announcement-link {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box !important;
}

.dt-announcements-section .dt-announcement-grid .dt-announcement-card h3 {
  margin-top: 0 !important;
  padding: 0 !important;
  overflow-wrap: anywhere;
}

.dt-announcements-section .dt-announcement-grid .dt-announcement-card .dt-announcement-excerpt {
  padding: 0 !important;
  overflow-wrap: anywhere;
}

@media (max-width: 900px) {
  .dt-announcements-section .dt-announcement-grid .dt-announcement-card {
    min-height: 0;
    padding: 20px 22px !important;
  }
}

@media (max-width: 600px) {
  .dt-announcements-section .dt-announcement-grid .dt-announcement-card {
    padding: 17px 18px !important;
  }
}
/* =========================================================
   Homepage v10: rotating service alerts + refined service cards
   Source-level component styling only. No WAVE suppression.
   ========================================================= */

/* ---------- Rotating Alert hero ---------- */
.dt-home-alert-carousel {
  position: relative;
  left: 50%;
  width: 100vw;
  min-height: 310px;
  margin: 0 0 22px;
  overflow: hidden;
  transform: translateX(-50%);
  background: #17304f;
  font-family: inherit;
}

.dt-home-alert-carousel::before {
  display: none;
}

.dt-home-alert-carousel__slides,
.dt-home-alert-carousel__slide {
  width: 100%;
  min-height: 310px;
}

.dt-home-alert-carousel__slide {
  position: relative;
  overflow: hidden;
  background-color: #17304f;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.dt-home-alert-carousel__slide::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    90deg,
    rgba(0, 31, 72, .46) 0%,
    rgba(0, 31, 72, .22) 48%,
    rgba(0, 31, 72, .06) 76%,
    rgba(0, 31, 72, .12) 100%
  );
  pointer-events: none;
}

.dt-home-alert-carousel__slide[hidden] {
  display: none !important;
}

.dt-home-alert-carousel .dt-home-hero__inner {
  position: relative;
  z-index: 2;
  width: min(1180px, calc(100% - 32px));
  min-height: 310px;
  padding: 28px 0;
}

.dt-home-alert-carousel .dt-home-hero__overlay {
  width: min(610px, 56%);
  padding: 25px 28px 24px;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 10px;
  color: #fff;
  background: rgba(12, 27, 44, .86);
  box-shadow: 0 14px 34px rgba(0, 0, 0, .2);
  font-family: inherit;
  text-align: left;
  backdrop-filter: blur(4px);
}

.dt-home-alert-carousel__topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 13px;
}

.dt-home-alert-carousel .dt-home-hero__label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 6px 10px;
  border: 1px solid rgba(255, 255, 255, .38);
  border-radius: 999px;
  color: #fff;
  font-family: inherit;
  font-size: .76rem;
  line-height: 1;
  font-weight: 600;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.dt-home-hero__label-icon {
  display: inline-flex;
  width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
  border: 2px solid #ffb81c;
  border-radius: 50%;
  color: #ffcc55;
  font-size: .72rem;
  line-height: 1;
  font-weight: 700;
}

.dt-home-alert-carousel__count {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  padding: 5px 11px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 6px;
  color: #fff;
  background: rgba(0, 84, 175, .56);
  font-size: .82rem;
  line-height: 1;
  white-space: nowrap;
}

.dt-home-alert-carousel__title,
.dt-home-alert-carousel h1,
.dt-home-alert-carousel h2 {
  margin: 0;
  color: #fff;
  font-family: inherit;
  font-size: clamp(1.75rem, 2.5vw, 2.35rem);
  line-height: 1.14;
  font-weight: 600;
}

.dt-home-alert-carousel__accent {
  display: block;
  width: 48px;
  height: 3px;
  margin: 15px 0 14px;
  background: #ffb81c;
}

.dt-home-alert-carousel p {
  max-width: 52ch;
  margin: 0 0 17px;
  color: #fff;
  font-family: inherit;
  font-size: .97rem;
  line-height: 1.5;
  font-weight: 400;
}

.dt-home-alert-carousel .dt-home-alert-link {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  gap: 18px;
  padding: 9px 16px;
  border: 1px solid #fff;
  border-radius: 4px;
  color: #003479 !important;
  background: #fff;
  font-family: inherit;
  font-size: .92rem;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none !important;
}

.dt-home-alert-carousel .dt-home-alert-link:hover,
.dt-home-alert-carousel .dt-home-alert-link:focus {
  color: #fff !important;
  background: transparent;
  text-decoration: none !important;
}

.dt-home-alert-carousel__controls {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
}

.dt-home-alert-carousel__arrow,
.dt-home-alert-carousel__dot {
  appearance: none;
  border: 0;
  font: inherit;
  cursor: pointer;
}

.dt-home-alert-carousel__arrow {
  display: inline-flex;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, .45);
  border-radius: 50%;
  color: #fff;
  background: rgba(255, 255, 255, .06);
  font-size: 1.35rem;
  line-height: 1;
}

.dt-home-alert-carousel__arrow:hover,
.dt-home-alert-carousel__arrow:focus-visible {
  color: #003479;
  background: #fff;
}

.dt-home-alert-carousel__dots {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.dt-home-alert-carousel__dot {
  width: 10px;
  height: 10px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 50%;
  background: transparent;
}

.dt-home-alert-carousel__dot.is-active {
  background: #fff;
}

.dt-home-alert-carousel__arrow:focus-visible,
.dt-home-alert-carousel__dot:focus-visible,
.dt-home-alert-carousel .dt-home-alert-link:focus-visible {
  outline: 3px solid #ffbf47;
  outline-offset: 3px;
}

.dt-home-alert-carousel__status {
  margin-left: 3px;
  color: rgba(255, 255, 255, .86);
  font-size: .8rem;
}

/* ---------- Refined Online Services cards ---------- */
.dt-services-section .dt-services-grid {
  gap: 15px;
}

.dt-services-section .dt-service-card {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 385px;
  overflow: visible;
  flex-direction: column;
  border: 1px solid #d7e0e8;
  border-radius: 9px;
  color: #333 !important;
  background: #fff;
  box-shadow: 0 3px 12px rgba(0, 52, 121, .07);
  font-family: inherit;
  text-decoration: none !important;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.dt-services-section .dt-service-card__media {
  display: block;
  width: 100%;
  height: 155px;
  overflow: hidden;
  border-radius: 8px 8px 0 0;
  background: #e8edf2;
}

.dt-services-section .dt-service-card__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 8px 8px 0 0;
  transition: transform .3s ease;
}

.dt-services-section .dt-service-card__icon {
  position: absolute;
  top: 132px;
  left: 18px;
  z-index: 2;
  display: inline-flex;
  width: 48px;
  height: 48px;
  align-items: center;
  justify-content: center;
  border: 4px solid #fff;
  border-radius: 50%;
  color: #0757a8;
  background: #f6f9fc;
  box-shadow: 0 4px 12px rgba(0, 52, 121, .14);
}

.dt-services-section .dt-service-card__icon svg {
  display: block;
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.dt-services-section .dt-service-card__body {
  display: flex;
  min-width: 0;
  flex: 1;
  flex-direction: column;
  padding: 31px 17px 16px;
  color: #333;
  font-family: inherit;
}

.dt-services-section .dt-service-card__title {
  display: block;
  margin: 0 0 9px;
  color: #122f52;
  font-family: inherit;
  font-size: 1.04rem;
  line-height: 1.28;
  font-weight: 600;
}

.dt-services-section .dt-service-card__description {
  display: block;
  margin: 0 0 17px;
  color: #333;
  font-family: inherit;
  font-size: .94rem;
  line-height: 1.48;
  font-weight: 400;
}

.dt-services-section .dt-service-card__action {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  padding: 8px 11px;
  border: 1px solid #c9d8e7;
  border-radius: 4px;
  color: #003479 !important;
  background: #fff;
  font-family: inherit;
  font-size: .91rem;
  font-weight: 600;
  line-height: 1.2;
}

@media (hover: hover) and (pointer: fine) {
  .dt-services-section .dt-service-card--linked:hover {
    z-index: 3;
    border-color: #7da7d4;
    box-shadow: 0 14px 28px rgba(0, 52, 121, .15);
    transform: translateY(-5px);
  }

  .dt-services-section .dt-service-card--linked:hover .dt-service-card__image {
    transform: scale(1.035);
  }

  .dt-services-section .dt-service-card--linked:hover .dt-service-card__action {
    color: #fff !important;
    border-color: #003479;
    background: #003479;
  }
}

.dt-services-section .dt-service-card--linked:focus-visible {
  z-index: 4;
  outline: 3px solid #ffbf47;
  outline-offset: 4px;
  border-color: #003479;
  box-shadow: 0 12px 24px rgba(0, 52, 121, .15);
}

@media (max-width: 1050px) and (min-width: 768px) {
  .dt-services-section .dt-services-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .dt-home-alert-carousel,
  .dt-home-alert-carousel__slides,
  .dt-home-alert-carousel__slide,
  .dt-home-alert-carousel .dt-home-hero__inner {
    min-height: 285px;
  }

  .dt-home-alert-carousel {
    left: auto;
    width: 100%;
    margin-bottom: 14px;
    transform: none;
  }

  .dt-home-alert-carousel .dt-home-hero__inner {
    width: 100%;
    align-items: flex-end;
    padding: 18px 16px;
  }

  .dt-home-alert-carousel .dt-home-hero__overlay {
    width: 100%;
    padding: 19px;
    border-radius: 8px;
    background: rgba(12, 27, 44, .9);
    backdrop-filter: none;
  }

  .dt-home-alert-carousel__topline {
    align-items: flex-start;
  }

  .dt-home-alert-carousel__title,
  .dt-home-alert-carousel h1,
  .dt-home-alert-carousel h2 {
    font-size: 1.55rem;
  }

  .dt-home-alert-carousel p {
    font-size: .9rem;
  }

  .dt-home-alert-carousel__status {
    display: none;
  }

  .dt-services-section .dt-services-grid {
    display: block;
  }

  .dt-services-section .dt-service-card {
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr) 22px;
    min-height: 78px;
    margin-bottom: 9px;
    overflow: hidden;
    border-radius: 6px;
    box-shadow: none;
  }

  .dt-services-section .dt-service-card__media {
    width: 88px;
    height: 78px;
    border-radius: 5px 0 0 5px;
  }

  .dt-services-section .dt-service-card__image {
    width: 88px;
    height: 78px;
    border-radius: 5px 0 0 5px;
  }

  .dt-services-section .dt-service-card__icon,
  .dt-services-section .dt-service-card__description,
  .dt-services-section .dt-service-card__action {
    display: none;
  }

  .dt-services-section .dt-service-card__body {
    display: flex;
    min-width: 0;
    justify-content: center;
    padding: 10px 12px;
  }

  .dt-services-section .dt-service-card__title {
    margin: 0;
    font-size: 1rem;
  }

  .dt-services-section .dt-service-card::after {
    content: "\203A";
    align-self: center;
    padding-right: 12px;
    color: #003479;
    font-size: 1.55rem;
    line-height: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dt-home-alert-carousel *,
  .dt-services-section .dt-service-card,
  .dt-services-section .dt-service-card__image {
    scroll-behavior: auto !important;
    transition: none !important;
  }

  .dt-services-section .dt-service-card--linked:hover,
  .dt-services-section .dt-service-card--linked:hover .dt-service-card__image {
    transform: none !important;
  }
}


/* =========================================================
   Alert carousel v11 refinements
   - Stable compact panel height prevents layout flicker
   - Typography follows the existing theme font
   - Controls remain visually compact
   ========================================================= */

.dt-home-alert-carousel,
.dt-home-alert-carousel__slides,
.dt-home-alert-carousel__slide {
  min-height: 288px;
}

.dt-home-alert-carousel .dt-home-hero__inner {
  min-height: 288px;
  padding-top: 20px;
  padding-bottom: 20px;
}

.dt-home-alert-carousel .dt-home-hero__overlay {
  display: flex;
  width: min(575px, 54%);
  min-height: 248px;
  padding: 20px 24px 18px;
  flex-direction: column;
  justify-content: flex-start;
  font-family: inherit !important;
}

.dt-home-alert-carousel__topline {
  margin-bottom: 10px;
}

.dt-home-alert-carousel__title,
.dt-home-alert-carousel h1,
.dt-home-alert-carousel h2 {
  font-family: inherit !important;
  font-size: clamp(1.65rem, 2.15vw, 2.05rem);
  line-height: 1.16;
  font-weight: 500;
  letter-spacing: normal;
}

.dt-home-alert-carousel__accent {
  width: 42px;
  margin: 11px 0 11px;
}

.dt-home-alert-carousel p {
  display: -webkit-box;
  min-height: 3em;
  max-height: 3em;
  margin-bottom: 13px;
  overflow: hidden;
  font-family: inherit !important;
  font-size: .94rem;
  line-height: 1.5;
  font-weight: 400;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.dt-home-alert-carousel .dt-home-alert-link {
  min-height: 38px;
  padding: 7px 14px;
  font-family: inherit !important;
}

.dt-home-alert-carousel__controls {
  margin-top: auto;
  padding-top: 14px;
}

.dt-home-alert-carousel__arrow {
  position: relative;
  z-index: 2;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  touch-action: manipulation;
}

.dt-home-alert-carousel__dot {
  touch-action: manipulation;
}

@media (max-width: 900px) and (min-width: 768px) {
  .dt-home-alert-carousel .dt-home-hero__overlay {
    width: min(560px, 66%);
  }
}

@media (max-width: 767px) {
  .dt-home-alert-carousel,
  .dt-home-alert-carousel__slides,
  .dt-home-alert-carousel__slide,
  .dt-home-alert-carousel .dt-home-hero__inner {
    min-height: 270px;
  }

  .dt-home-alert-carousel .dt-home-hero__overlay {
    width: 100%;
    min-height: 232px;
    padding: 17px 18px 15px;
  }

  .dt-home-alert-carousel__title,
  .dt-home-alert-carousel h1,
  .dt-home-alert-carousel h2 {
    font-size: 1.45rem;
  }

  .dt-home-alert-carousel p {
    min-height: 2.8em;
    max-height: 2.8em;
    font-size: .9rem;
    line-height: 1.4;
  }

  .dt-home-alert-carousel__controls {
    padding-top: 11px;
  }
}

/* =========================================================
   Homepage v12: stable compact alert panel
   - Fixed panel geometry prevents layout movement between alerts.
   - Summary is limited to three lines.
   - Read-more action shares the footer row with carousel controls.
   ========================================================= */
@media (min-width: 768px) {
  .dt-home-alert-carousel,
  .dt-home-alert-carousel__slides,
  .dt-home-alert-carousel__slide,
  .dt-home-alert-carousel .dt-home-hero__inner {
    min-height: 280px;
    height: 280px;
  }

  .dt-home-alert-carousel .dt-home-hero__inner {
    padding-top: 16px;
    padding-bottom: 16px;
  }

  .dt-home-alert-carousel .dt-home-hero__overlay {
    display: flex;
    width: min(580px, 54%);
    height: 248px;
    min-height: 248px;
    padding: 18px 22px;
    flex-direction: column;
    box-sizing: border-box;
  }
}

.dt-home-alert-carousel__topline {
  margin-bottom: 9px;
}

.dt-home-alert-carousel__title,
.dt-home-alert-carousel h1,
.dt-home-alert-carousel h2 {
  display: -webkit-box;
  min-height: 2.28em;
  overflow: hidden;
  font-size: clamp(1.6rem, 2.15vw, 2.05rem);
  line-height: 1.14;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.dt-home-alert-carousel__accent {
  width: 42px;
  margin: 9px 0 9px;
}

.dt-home-alert-carousel p {
  display: -webkit-box;
  min-height: 4.35em;
  max-height: 4.35em;
  margin: 0;
  overflow: hidden;
  font-size: .94rem;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.dt-home-alert-carousel__footer {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: auto;
  padding-top: 12px;
}

.dt-home-alert-carousel__controls {
  min-width: 0;
  margin-top: 0;
  gap: 8px;
}

.dt-home-alert-carousel__arrow {
  width: 32px;
  height: 32px;
}

.dt-home-alert-carousel .dt-home-alert-link {
  min-height: 34px;
  flex: 0 0 auto;
  gap: 9px;
  padding: 6px 12px;
  border-color: rgba(255, 255, 255, .72);
  color: #fff !important;
  background: transparent;
  font-size: .86rem;
  white-space: nowrap;
}

.dt-home-alert-carousel .dt-home-alert-link:hover,
.dt-home-alert-carousel .dt-home-alert-link:focus {
  color: #003479 !important;
  background: #fff;
}

@media (max-width: 767px) {
  .dt-home-alert-carousel .dt-home-hero__overlay {
    display: flex;
    min-height: 250px;
    flex-direction: column;
  }

  .dt-home-alert-carousel__title,
  .dt-home-alert-carousel h1,
  .dt-home-alert-carousel h2 {
    min-height: 2.28em;
  }

  .dt-home-alert-carousel p {
    min-height: 4.35em;
    max-height: 4.35em;
  }

  .dt-home-alert-carousel__footer {
    gap: 10px;
    padding-top: 10px;
  }

  .dt-home-alert-carousel__controls {
    gap: 7px;
  }

  .dt-home-alert-carousel .dt-home-alert-link {
    min-height: 32px;
    padding: 5px 10px;
  }
}

@media (max-width: 420px) {
  .dt-home-alert-carousel__count {
    font-size: .76rem;
  }

  .dt-home-alert-carousel__footer {
    align-items: flex-end;
  }

  .dt-home-alert-carousel__dots {
    gap: 6px;
  }

  .dt-home-alert-carousel__arrow {
    width: 30px;
    height: 30px;
  }
}

/* =========================================================
   Homepage v13: wider, tighter alert card with contained footer
   ========================================================= */
@media (min-width: 768px) {
  .dt-home-alert-carousel .dt-home-hero__overlay {
    width: min(650px, 62%);
    height: 248px;
    min-height: 248px;
    padding: 17px 22px 15px;
    overflow: hidden;
  }
}

.dt-home-alert-carousel__topline {
  flex: 0 0 auto;
  margin-bottom: 7px;
}

.dt-home-alert-carousel__title,
.dt-home-alert-carousel h1,
.dt-home-alert-carousel h2 {
  min-height: 0;
  max-height: 2.28em;
  margin: 0;
  flex: 0 0 auto;
  -webkit-line-clamp: 2;
}

.dt-home-alert-carousel__accent {
  flex: 0 0 auto;
  margin: 7px 0 7px;
}

.dt-home-alert-carousel p {
  min-height: 4.35em;
  max-height: 4.35em;
  margin: 0;
  flex: 0 0 auto;
  -webkit-line-clamp: 3;
}

.dt-home-alert-carousel__footer {
  position: static;
  display: flex;
  width: 100%;
  min-width: 0;
  min-height: 36px;
  margin-top: auto;
  padding: 8px 0 0;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  box-sizing: border-box;
}

.dt-home-alert-carousel__controls {
  position: static;
  min-width: 0;
  margin: 0;
  padding: 0;
  flex: 1 1 auto;
  gap: 8px;
}

.dt-home-alert-carousel .dt-home-alert-link {
  min-height: 32px;
  margin: 0;
  padding: 5px 11px;
  flex: 0 0 auto;
  align-self: center;
  font-size: .84rem;
  line-height: 1.2;
}

@media (max-width: 1050px) and (min-width: 768px) {
  .dt-home-alert-carousel .dt-home-hero__overlay {
    width: min(620px, 70%);
  }
}

@media (max-width: 767px) {
  .dt-home-alert-carousel .dt-home-hero__overlay {
    width: 100%;
    min-height: 250px;
    padding: 16px 18px 14px;
    overflow: hidden;
  }

  .dt-home-alert-carousel__topline {
    margin-bottom: 7px;
  }

  .dt-home-alert-carousel__accent {
    margin: 7px 0;
  }

  .dt-home-alert-carousel__footer {
    min-height: 34px;
    padding-top: 8px;
    gap: 9px;
  }

  .dt-home-alert-carousel__controls {
    gap: 6px;
  }

  .dt-home-alert-carousel .dt-home-alert-link {
    min-height: 30px;
    padding: 4px 9px;
    font-size: .8rem;
  }
	
}

/* =========================================================
   Homepage v14: three complete desktop summary lines
   These rules must remain outside the mobile media query.
   ========================================================= */
.dt-home-alert-carousel p {
  display: -webkit-box;
  min-height: 4.65em;
  max-height: 4.65em;
  margin: 0;
  overflow: hidden;
  font-family: inherit !important;
  font-size: .94rem;
  line-height: 1.5;
  font-weight: 400;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.dt-home-alert-carousel__accent {
  width: 52px;
  height: 3px;
}

@media (min-width: 768px) {
  .dt-home-alert-carousel .dt-home-hero__overlay {
    height: 252px;
    min-height: 252px;
  }
}

@media (max-width: 767px) {
  .dt-home-alert-carousel p {
    min-height: 4.5em;
    max-height: 4.5em;
    font-size: .9rem;
    line-height: 1.5;
  }
}

/* =========================================================
   Homepage typography alignment
   Uses the original DriveTest font family and normal body-text
   size without changing the redesigned homepage layout.
   ========================================================= */

/* Apply the same font stack used throughout the original site. */
.home .dt-home-alert-carousel,
.home .dt-home-alert-carousel *,
.home .dt-home-section,
.home .dt-home-section * {
  font-family: "Open Sans", Helvetica, Arial, sans-serif !important;
}

/* Match the original site's normal 14px content text. */
.home .dt-home-section__heading p,
.home .dt-service-card__description,
.home .dt-service-card p,
.home .dt-announcement-excerpt,
.home .dt-announcement-excerpt p,
.home .dt-quick-card__copy small,
.home .dt-home-alert-carousel p {
  font-size: 14px ;
}

/* Keep normal supporting copy at the original regular weight. */
.home .dt-home-section__heading p,
.home .dt-service-card__description,
.home .dt-service-card p,
.home .dt-announcement-excerpt,
.home .dt-announcement-excerpt p,
.home .dt-quick-card__copy small,
.home .dt-home-alert-carousel p {
  font-style: normal;
  font-weight: 400 !important;
}

/* Retain component-specific heading sizes while using the same
   typeface and natural letter spacing as the rest of the site. */
.home .dt-home-section__heading h2,
.home .dt-service-card__title,
.home .dt-service-card h3,
.home .dt-announcement-card h3,
.home .dt-quick-card__copy strong,
.home .dt-home-alert-carousel__title,
.home .dt-home-alert-carousel h1,
.home .dt-home-alert-carousel h2 {
  font-family: "Open Sans", Helvetica, Arial, sans-serif !important;
  font-style: normal;
  letter-spacing: normal;
}

/* Buttons, labels, dates and carousel controls use the same font too. */
.home .dt-home-section__link,
.home .dt-service-card__action,
.home .dt-announcement-link,
.home .dt-announcement-card time,
.home .dt-home-alert-carousel__count,
.home .dt-home-alert-carousel__status,
.home .dt-home-alert-carousel .dt-home-hero__label,
.home .dt-home-alert-carousel .dt-home-alert-link,
.home .dt-home-alert-carousel__arrow {
  font-family: "Open Sans", Helvetica, Arial, sans-serif !important;
}

/* =========================================================
   Homepage image paint fix
   Real image elements are rendered behind the alert overlay so
   the browser discovers and paints them with the page content.
   ========================================================= */

.dt-home-alert-carousel__slide {
  isolation: isolate;
}

.dt-home-alert-carousel__image {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.dt-home-alert-carousel__slide::before {
  z-index: 1;
}

.dt-home-alert-carousel .dt-home-hero__inner {
  z-index: 2;
}

/* Avoid a white flash while service images decode. */
.dt-services-section .dt-service-card__media {
  background-color: #e8edf2;
}

/* =========================================================
   Services section centre CTA button — current shortcode markup
   The shortcode outputs .dt-centre-cta, so this block styles the
   English and French homepage buttons consistently.
   ========================================================= */

.dt-services-section .dt-home-section__heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}

.dt-services-section .dt-centre-cta {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin-top: 0;
  padding: 9px 16px;
  border: 2px solid #003479;
  border-radius: 4px;
  color: #003479 !important;
  background: #fff;
  font-family: "Open Sans", Helvetica, Arial, sans-serif !important;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 600;
  text-decoration: none !important;
  white-space: nowrap;
  box-shadow: none;
  transition:
    color .18s ease,
    background-color .18s ease,
    border-color .18s ease;
}

.dt-services-section .dt-centre-cta:hover,
.dt-services-section .dt-centre-cta:focus {
  color: #fff !important;
  background: #003479;
  border-color: #003479;
  text-decoration: none !important;
}

.dt-services-section .dt-centre-cta:focus-visible {
  outline: 3px solid #ffbf47;
  outline-offset: 3px;
}

.dt-services-section .dt-centre-cta__icon {
  display: inline-flex;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  align-items: center;
  justify-content: center;
  color: inherit;
}

.dt-services-section .dt-centre-cta__icon svg {
  display: block;
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@media (max-width: 767px) {
  .dt-services-section .dt-home-section__heading {
    align-items: stretch;
    flex-direction: column;
    gap: 14px;
  }

  .dt-services-section .dt-centre-cta {
    width: 100%;
    margin-top: 4px;
    white-space: normal;
  }
}

/* Ensure the centre CTA always uses the DriveTest site font. */
.home .dt-services-section .dt-centre-cta,
.home .dt-services-section .dt-centre-cta span {
  font-family: "Open Sans", Helvetica, Arial, sans-serif !important;
}

.home .dt-services-section .dt-centre-cta__icon {
  color: #4f7ea8;
}

.home .dt-services-section .dt-centre-cta:hover .dt-centre-cta__icon,
.home .dt-services-section .dt-centre-cta:focus .dt-centre-cta__icon {
  color: currentColor;
}

/* =========================================================
   Stable service-alert card layout for long titles
   - Reserves a consistent two-line title area on desktop/tablet
   - Truncates unusually long titles instead of pushing controls down
   - Keeps description and controls in fixed positions
   ========================================================= */

.home .dt-home-alert-carousel .dt-home-hero__overlay {
  overflow: hidden;
}

.home .dt-home-alert-carousel__title,
.home .dt-home-alert-carousel h1,
.home .dt-home-alert-carousel h2 {
  display: -webkit-box;
  min-height: 2.32em;
  max-height: 2.32em;
  overflow: hidden;
  line-height: 1.16;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.home .dt-home-alert-carousel__accent {
  flex: 0 0 auto;
}

.home .dt-home-alert-carousel p {
  flex: 0 0 3em;
  min-height: 3em;
  max-height: 3em;
}

.home .dt-home-alert-carousel__controls {
  flex: 0 0 auto;
  width: 100%;
  margin-top: auto;
}

/* Slightly reduce very long headings on narrower desktop/tablet widths. */
@media (max-width: 1100px) and (min-width: 768px) {
  .home .dt-home-alert-carousel__title,
  .home .dt-home-alert-carousel h1,
  .home .dt-home-alert-carousel h2 {
    font-size: clamp(1.45rem, 2.25vw, 1.9rem);
  }
}

/* Mobile allows three lines but still reserves a stable title area. */
@media (max-width: 767px) {
  .home .dt-home-alert-carousel__title,
  .home .dt-home-alert-carousel h1,
  .home .dt-home-alert-carousel h2 {
    min-height: 3.48em;
    max-height: 3.48em;
    line-height: 1.16;
    -webkit-line-clamp: 3;
  }

  .home .dt-home-alert-carousel p {
    flex-basis: 2.8em;
    min-height: 2.8em;
    max-height: 2.8em;
  }
}

/* =========================================================
   Homepage v18: existing DriveTest theme alignment
   Source references:
   - main.css
   - em-main.css
   - em-responsive.css

   Theme foundations:
   - Open Sans, Helvetica, Arial, sans-serif
   - Body: 14px / 26px / #474747
   - H1: 38px; H2: 36px; H3: 20px; H4: 18px
   - Primary blue: #003479
   - Heading blue: #2676AB
   - Link green: #1E8349
   - Light surface: #ECF0F1
   - Border: #BDC3C7
   ========================================================= */

.home .dt-home-alert-carousel,
.home .dt-home-alert-carousel *,
.home .dt-home-section,
.home .dt-home-section * {
  font-family: "Open Sans", Helvetica, Arial, sans-serif !important;
}

/* Normal homepage copy follows the theme's body treatment. */
.home .dt-home-section,
.home .dt-home-section p,
.home .dt-service-card__description,
.home .dt-service-card p,
.home .dt-announcement-excerpt,
.home .dt-announcement-excerpt p,
.home .dt-quick-card__copy small,
.home .dt-home-alert-carousel p {
  color: #474747;
  font-size: 14px ;
  line-height: 26px;
  font-style: normal;
  font-weight: 400 !important;
}

/* Section headings follow the theme H2 style. */
.home .dt-home-section__heading h2 {
  margin: 0;
  color: #2676AB;
  font-size: 36px;
  line-height: 34px;
  font-weight: 600;
}

/* Card headings follow the theme H3 scale. */
.home .dt-service-card__title,
.home .dt-service-card h3,
.home .dt-announcement-card h3,
.home .dt-quick-card__copy strong {
  color: #2676AB;
  font-size: 20px;
  line-height: 26px;
  font-weight: 600;
}

/* Standard text links follow the established green link colour. */
.home .dt-home-section__link:not(.dt-home-section__link--centre),
.home .dt-announcement-link {
  color: #1E8349 !important;
}

.home .dt-home-section__link:not(.dt-home-section__link--centre):hover,
.home .dt-home-section__link:not(.dt-home-section__link--centre):focus,
.home .dt-announcement-link:hover,
.home .dt-announcement-link:focus {
  color: #1E8349 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* Primary actions retain the established DriveTest blue. */
.home .dt-centre-cta,
.home .dt-service-card__action,
.home .dt-home-alert-carousel .dt-home-alert-link {
  border-color: #003479;
  color: #003479 !important;
}

.home .dt-centre-cta:hover,
.home .dt-centre-cta:focus,
.home .dt-service-card:hover .dt-service-card__action,
.home .dt-service-card:focus-visible .dt-service-card__action {
  border-color: #003479;
  color: #fff !important;
  background: #003479;
}

/* Approved surfaces and borders. */
.home .dt-announcements-section::before {
  background: #ECF0F1;
}

.home .dt-service-card,
.home .dt-announcement-card,
.home .dt-quick-card {
  border-color: #BDC3C7;
  background: #fff;
}

.home .dt-services-section,
.home .dt-quick-links-section {
  border-color: #BDC3C7;
}

/* Hero typography follows the same family and heading rhythm,
   while retaining the compact rotating-alert geometry. */
.home .dt-home-alert-carousel,
.home .dt-home-alert-carousel__slide {
  background-color: #003479;
}

.home .dt-home-alert-carousel__title,
.home .dt-home-alert-carousel h1,
.home .dt-home-alert-carousel h2 {
  color: #fff;
  font-size: clamp(28px, 2.2vw, 36px);
  line-height: 1.16;
  font-weight: 700;
}

.home .dt-home-alert-carousel p {
  color: #fff;
  line-height: 1.5;
}

.home .dt-home-alert-carousel__accent {
  background: #F1C40F;
}

/* Theme focus treatment. */
.home .dt-service-card:focus-visible,
.home .dt-announcement-card:focus-visible,
.home .dt-quick-card:focus-visible,
.home .dt-centre-cta:focus-visible,
.home .dt-home-alert-carousel button:focus-visible,
.home .dt-home-alert-carousel a:focus-visible {
  outline: 4px solid transparent;
  outline-offset: 3px;
  box-shadow: 0 0 0 4px #F1C40F;
}

/* Tablet and phone typography follows the existing responsive scale
   without changing the current card layouts. */
@media (max-width: 900px) {
  .home .dt-home-section__heading h2 {
    font-size: 30px;
    line-height: 36px;
  }

  .home .dt-service-card__title,
  .home .dt-service-card h3,
  .home .dt-announcement-card h3,
  .home .dt-quick-card__copy strong {
    font-size: 18px;
    line-height: 24px;
  }
}

@media (max-width: 600px) {
  .home .dt-home-section__heading h2 {
    font-size: 24px;
    line-height: 31px;
  }

  .home .dt-service-card__title,
  .home .dt-service-card h3,
  .home .dt-announcement-card h3,
  .home .dt-quick-card__copy strong {
    font-size: 16px;
    line-height: 22px;
  }

  .home .dt-home-alert-carousel__title,
  .home .dt-home-alert-carousel h1,
  .home .dt-home-alert-carousel h2 {
    font-size: 24px;
    line-height: 1.2;
  }
}

/* =========================================================
   Homepage v19: mobile header blank-gap correction
   The legacy theme applies 150px top padding through .em-pt.
   On the mobile homepage this leaves an empty block between
   the navigation row and the service-disruptions bar.
   ========================================================= */

@media (max-width: 767px) {
  .home #header .em-pt,
  .home header#header .em-pt {
    padding-top: 0 !important;
  }

  .home #header,
  .home #header .navbar,
  .home #header .navbar > .container {
    min-height: 0 !important;
    margin-bottom: 0 !important;
  }

  .home #header .navbar-collapse {
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
}

/* =========================================================
   Homepage v20: remove legacy mobile offset on disruptions bar
   em-main.css applies margin-top: 86px to the homepage banner.
   The current mobile header no longer needs that offset.
   ========================================================= */

@media screen and (max-width: 767px) {
  body.home #news-banner,
  body.home .dt-disruptions-bar {
    position: relative;
    z-index: 25;
    margin-top: 0 !important;
  }
}

/* =========================================================
   Homepage v21: restore alert Read more action
   The footer controls were consuming more than the available
   width, pushing the action beyond the clipped alert panel.
   ========================================================= */

.dt-home-alert-carousel__footer {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  width: 100%;
  min-width: 0;
  align-items: center;
  gap: 12px;
}

.dt-home-alert-carousel__controls {
  display: flex;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.dt-home-alert-carousel__status {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.home .dt-home-alert-carousel .dt-home-alert-link {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  min-width: max-content;
  max-width: 100%;
  flex: 0 0 auto;
  justify-self: end;
  border: 1px solid rgba(255, 255, 255, .72);
  color: #fff !important;
  background: transparent;
  white-space: nowrap;
}

.home .dt-home-alert-carousel .dt-home-alert-link:hover,
.home .dt-home-alert-carousel .dt-home-alert-link:focus {
  border-color: #fff;
  color: #003479 !important;
  background: #fff;
}

@media (max-width: 600px) {
  .dt-home-alert-carousel__footer {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
  }

  .dt-home-alert-carousel__status {
    display: none;
  }

  .home .dt-home-alert-carousel .dt-home-alert-link {
    min-height: 30px;
    padding: 4px 9px;
    font-size: .8rem;
  }
}

/* =========================================================
   Homepage v22: compact alert title sizing
   ========================================================= */

.home .dt-home-alert-carousel__title,
.home .dt-home-alert-carousel h1,
.home .dt-home-alert-carousel h2 {
  font-size: 26px ;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
}

@media (max-width: 900px) {
  .home .dt-home-alert-carousel__title,
  .home .dt-home-alert-carousel h1,
  .home .dt-home-alert-carousel h2 {
    font-size: 24px ;
    line-height: 1.2 !important;
  }
}

@media (max-width: 600px) {
  .home .dt-home-alert-carousel__title,
  .home .dt-home-alert-carousel h1,
  .home .dt-home-alert-carousel h2 {
    font-size: 22px ;
    line-height: 1.2 !important;
  }
}

/* =========================================================
   Homepage v23: simplified alert card header and text link
   ========================================================= */

.home .dt-home-alert-carousel__topline {
  display: none !important;
}

.home .dt-home-alert-carousel__title,
.home .dt-home-alert-carousel h1,
.home .dt-home-alert-carousel h2 {
  margin-top: 0 !important;
}

.home .dt-home-alert-carousel .dt-home-hero__overlay {
  padding-top: 20px;
}

.home .dt-home-alert-carousel .dt-home-alert-link {
  display: inline-flex !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #fff !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 14px ;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
}

.home .dt-home-alert-carousel .dt-home-alert-link:hover,
.home .dt-home-alert-carousel .dt-home-alert-link:focus {
  color: #fff !important;
  background: transparent !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

@media (max-width: 767px) {
  .home .dt-home-alert-carousel .dt-home-hero__overlay {
    padding-top: 18px;
  }

  .home .dt-home-alert-carousel .dt-home-alert-link {
    font-size: 14px ;
  }
}

/* =========================================================
   Homepage v24: tighter section spacing, text-only card links,
   and removal of section divider lines.
   ========================================================= */

/* Reduce the white space between the alert carousel and Online Services. */
.home .dt-home-alert-carousel {
  margin-bottom: 0 !important;
}

.home .dt-services-section {
  padding-top: 20px !important;
}

/* Remove horizontal divider lines between homepage sections. */
.home .dt-services-section,
.home .dt-quick-links-section {
  border-top: 0 !important;
  border-bottom: 0 !important;
}

.home .dt-services-section::before,
.home .dt-services-section::after,
.home .dt-announcements-section::after,
.home .dt-quick-links-section::before,
.home .dt-quick-links-section::after {
  display: none !important;
}

/* Turn service-card action buttons into simple text links. */
.home .dt-services-section .dt-service-card__action {
  display: inline-flex !important;
  min-height: 0 !important;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  margin-top: auto;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #1E8349 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 14px ;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
}

.home .dt-services-section .dt-service-card:hover .dt-service-card__action,
.home .dt-services-section .dt-service-card:focus-visible .dt-service-card__action {
  color: #1E8349 !important;
  background: transparent !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* Keep the small arrow as part of the text link. */
.home .dt-services-section .dt-service-card__arrow {
  color: inherit;
}

/* Remove any remaining separator rule immediately below service cards. */
.home .dt-services-section + .dt-home-section,
.home .dt-services-section + .vc_row,
.home .dt-services-section + * {
  border-top: 0 !important;
}

@media (max-width: 767px) {
  .home .dt-services-section {
    padding-top: 16px !important;
  }

  .home .dt-services-section .dt-service-card__action {
    display: none !important;
  }
}

/* =========================================================
   Homepage v25: equal English/French section spacing
   and text-only centre CTA.
   ========================================================= */

/*
 * Keep the services section spacing identical in both languages.
 * These rules override language-specific WPBakery/theme margins.
 */
html[lang="en-US"] body.home .dt-services-section,
html[lang="fr-FR"] body.home .dt-services-section,
body.home.en .dt-services-section,
body.home.fr .dt-services-section {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 20px !important;
  padding-bottom: 28px !important;
}

html[lang="en-US"] body.home .dt-services-section .dt-home-section__heading,
html[lang="fr-FR"] body.home .dt-services-section .dt-home-section__heading,
body.home.en .dt-services-section .dt-home-section__heading,
body.home.fr .dt-services-section .dt-home-section__heading {
  margin-top: 0 !important;
  margin-bottom: 20px !important;
}

html[lang="en-US"] body.home .dt-services-section .dt-services-grid,
html[lang="fr-FR"] body.home .dt-services-section .dt-services-grid,
body.home.en .dt-services-section .dt-services-grid,
body.home.fr .dt-services-section .dt-services-grid {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Remove extra WPBakery spacing around the services shortcode row. */
html[lang="en-US"] body.home .dt-services-section .wpb_content_element,
html[lang="fr-FR"] body.home .dt-services-section .wpb_content_element,
body.home.en .dt-services-section .wpb_content_element,
body.home.fr .dt-services-section .wpb_content_element {
  margin-bottom: 0 !important;
}

/* Centre CTA becomes a simple text link, matching card actions. */
.home .dt-services-section .dt-centre-cta,
.home .dt-services-section .dt-home-section__link--centre {
  display: inline-flex !important;
  min-height: 0 !important;
  align-items: center;
  gap: 7px;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #1E8349 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 14px ;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  white-space: normal;
}

.home .dt-services-section .dt-centre-cta:hover,
.home .dt-services-section .dt-centre-cta:focus,
.home .dt-services-section .dt-home-section__link--centre:hover,
.home .dt-services-section .dt-home-section__link--centre:focus {
  color: #1E8349 !important;
  background: transparent !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

.home .dt-services-section .dt-centre-cta .dt-home-section__link-icon,
.home .dt-services-section .dt-home-section__link--centre .dt-home-section__link-icon {
  color: #1E8349 !important;
}

/* Ensure no divider or empty spacer appears below the service cards. */
html[lang="en-US"] body.home .dt-services-section,
html[lang="fr-FR"] body.home .dt-services-section,
body.home.en .dt-services-section,
body.home.fr .dt-services-section {
  border-top: 0 !important;
  border-bottom: 0 !important;
}

@media (max-width: 767px) {
  html[lang="en-US"] body.home .dt-services-section,
  html[lang="fr-FR"] body.home .dt-services-section,
  body.home.en .dt-services-section,
  body.home.fr .dt-services-section {
    padding-top: 16px !important;
    padding-bottom: 22px !important;
  }

  .home .dt-services-section .dt-centre-cta,
  .home .dt-services-section .dt-home-section__link--centre {
    width: auto !important;
  }
}

/* =========================================================
   Homepage v26: accessible carousel indicator touch targets
   Keeps the visible dots at 10px while enlarging the actual
   button target for mouse, touch, and keyboard users.
   ========================================================= */

.home .dt-home-alert-carousel__dots {
  display: inline-flex;
  align-items: center;
  gap: 0;
}

.home .dt-home-alert-carousel__dot {
  position: relative;
  display: inline-flex;
  width: 40px;
  min-width: 40px;
  height: 40px;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
  touch-action: manipulation;
}

.home .dt-home-alert-carousel__dot::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border: 1px solid rgba(255, 255, 255, .78);
  border-radius: 50%;
  background: transparent;
  box-sizing: border-box;
}

.home .dt-home-alert-carousel__dot.is-active::before {
  border-color: #fff;
  background: #fff;
}

.home .dt-home-alert-carousel__dot:hover::before {
  border-color: #fff;
  background: rgba(255, 255, 255, .35);
}

.home .dt-home-alert-carousel__dot.is-active:hover::before {
  background: #fff;
}

.home .dt-home-alert-carousel__dot:focus-visible {
  outline: 3px solid #ffbf47;
  outline-offset: -3px;
  border-radius: 50%;
  box-shadow: none;
}

@media (max-width: 420px) {
  .home .dt-home-alert-carousel__dot {
    width: 36px;
    min-width: 36px;
    height: 36px;
    min-height: 36px;
  }
}

/* =========================================================
   Homepage v28: restore the Find a DriveTest Centre link
   and protect two-line alert-title descenders.
   ========================================================= */

/* Keep the English and French centre links visible even when
   legacy theme rules target nested spans or icon wrappers. */
.home .dt-services-section .dt-home-section__heading > .dt-centre-cta,
.home .dt-services-section .dt-home-section__heading > .dt-home-section__link--centre {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 24px !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  margin: 0 !important;
  padding: 2px 0 !important;
  overflow: visible !important;
  color: #1E8349 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  font-family: "Open Sans", Helvetica, Arial, sans-serif !important;
  font-size: 14px ;
  line-height: 1.4 !important;
  font-weight: 400 !important;
  text-decoration: none !important;
  white-space: normal !important;
}

.home .dt-services-section .dt-centre-cta *,
.home .dt-services-section .dt-home-section__link--centre * {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: inherit !important;
  font: inherit !important;
  line-height: inherit !important;
}

.home .dt-services-section .dt-centre-cta:hover,
.home .dt-services-section .dt-centre-cta:focus,
.home .dt-services-section .dt-home-section__link--centre:hover,
.home .dt-services-section .dt-home-section__link--centre:focus {
  color: #1E8349 !important;
  background: transparent !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* Keep the heading copy from squeezing the centre link out of view. */
.home .dt-services-section .dt-home-section__heading > div:first-child {
  min-width: 0;
  flex: 1 1 auto;
}

.home .dt-services-section .dt-home-section__heading > .dt-centre-cta,
.home .dt-services-section .dt-home-section__heading > .dt-home-section__link--centre {
  flex: 0 1 auto;
}

/* Keep two-line alert titles stable while allowing g/y/p/q descenders. */
.home .dt-home-alert-carousel__title,
.home .dt-home-alert-carousel h1,
.home .dt-home-alert-carousel h2 {
  min-height: 2.5em;
  max-height: 2.5em;
  padding-bottom: 3px;
  box-sizing: border-box;
}

@media (max-width: 767px) {
  .home .dt-services-section .dt-home-section__heading > .dt-centre-cta,
  .home .dt-services-section .dt-home-section__heading > .dt-home-section__link--centre {
    align-self: flex-start;
  }
}


/* =========================================================
   Homepage v29: show more alert message text responsively
   - Desktop: up to 4 lines
   - Tablet: up to 3 lines
   - Mobile: up to 3 lines
   - Small phones: up to 2 lines
   - Keeps carousel/card heights stable to prevent layout jumps
   ========================================================= */

.home .dt-home-alert-carousel p {
  display: -webkit-box !important;
  flex: 0 0 6em !important;
  min-height: 6em !important;
  max-height: 6em !important;
  margin: 0 !important;
  overflow: hidden !important;
  font-size: 14px ;
  line-height: 1.5 !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4 !important;
}

@media (min-width: 1101px) {
  .home .dt-home-alert-carousel,
  .home .dt-home-alert-carousel__slides,
  .home .dt-home-alert-carousel__slide,
  .home .dt-home-alert-carousel .dt-home-hero__inner {
    height: 310px !important;
    min-height: 310px !important;
  }

  .home .dt-home-alert-carousel .dt-home-hero__overlay {
    height: 276px !important;
    min-height: 276px !important;
  }
}

@media (max-width: 1100px) and (min-width: 768px) {
  .home .dt-home-alert-carousel p {
    flex-basis: 4.5em !important;
    min-height: 4.5em !important;
    max-height: 4.5em !important;
    -webkit-line-clamp: 3 !important;
  }

  .home .dt-home-alert-carousel,
  .home .dt-home-alert-carousel__slides,
  .home .dt-home-alert-carousel__slide,
  .home .dt-home-alert-carousel .dt-home-hero__inner {
    height: 295px !important;
    min-height: 295px !important;
  }

  .home .dt-home-alert-carousel .dt-home-hero__overlay {
    height: 263px !important;
    min-height: 263px !important;
  }
}

@media (max-width: 767px) {
  .home .dt-home-alert-carousel p {
    flex-basis: 4.5em !important;
    min-height: 4.5em !important;
    max-height: 4.5em !important;
    font-size: 14px ;
    line-height: 1.5 !important;
    -webkit-line-clamp: 3 !important;
  }

  .home .dt-home-alert-carousel,
  .home .dt-home-alert-carousel__slides,
  .home .dt-home-alert-carousel__slide,
  .home .dt-home-alert-carousel .dt-home-hero__inner {
    height: auto !important;
    min-height: 295px !important;
  }

  .home .dt-home-alert-carousel .dt-home-hero__overlay {
    height: auto !important;
    min-height: 255px !important;
  }
}

@media (max-width: 420px) {
  .home .dt-home-alert-carousel p {
    flex-basis: 3em !important;
    min-height: 3em !important;
    max-height: 3em !important;
    -webkit-line-clamp: 2 !important;
  }
}

/* =========================================================
   Homepage alert — wider message area / tighter desktop layout
   ========================================================= */

@media (min-width: 768px) {

  .home .dt-home-alert-carousel .dt-home-hero__overlay {
    width: min(760px, 68%) !important;
    height: 252px !important;
    min-height: 252px !important;
    padding: 22px 28px 18px !important;
  }

  .home .dt-home-alert-carousel__title,
  .home .dt-home-alert-carousel h1,
  .home .dt-home-alert-carousel h2 {
    max-width: 100% !important;
  }

  .home .dt-home-alert-carousel p {
    width: 100% !important;
    max-width: 720px !important;
    flex: 0 0 4.5em !important;
    min-height: 4.5em !important;
    max-height: 4.5em !important;
    -webkit-line-clamp: 3 !important;
  }

  .home .dt-home-alert-carousel__footer {
    grid-template-columns: auto 1fr auto !important;
    gap: 16px !important;
    padding-top: 10px !important;
  }

  .home .dt-home-alert-carousel__controls {
    width: auto !important;
    flex: 0 0 auto !important;
    overflow: visible !important;
  }

  .home .dt-home-alert-carousel__status {
    width: auto !important;
    min-width: max-content !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  .home .dt-home-alert-carousel .dt-home-alert-link {
    justify-self: end !important;
  }
}

/* =========================================================
   Homepage v30: consistent homepage text-link hierarchy
   - Service-card actions match Announcement "Learn more" links.
   - Find a DriveTest Centre matches "View all announcements".
   - Does NOT alter the Announcement link styles themselves.
   ========================================================= */

/* Online Services card actions: match Announcement "Learn more". */
.home .dt-services-section .dt-service-card__action {
  display: inline-flex !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  margin-top: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #1E8349 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-family: "Open Sans", Helvetica, Arial, sans-serif !important;
  font-size: 14px ;
  line-height: 1.4 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  white-space: normal !important;
}

.home .dt-services-section .dt-service-card__action:hover,
.home .dt-services-section .dt-service-card__action:focus {
  color: #1E8349 !important;
  background: transparent !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

.home .dt-services-section .dt-service-card__arrow {
  color: inherit !important;
  font-size: 1em ;
  line-height: 1 !important;
  font-weight: inherit !important;
}

/*
 * Header CTA: match section-level "View all announcements" link.
 * Keep the location icon, but use the same text size/weight/treatment.
 */
.home .dt-services-section .dt-home-section__heading > .dt-centre-cta,
.home .dt-services-section .dt-home-section__heading > .dt-home-section__link--centre {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  margin: 5px 0 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #1E8349 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-family: "Open Sans", Helvetica, Arial, sans-serif !important;
  font-size: 14px ;
  line-height: 1.4 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

.home .dt-services-section .dt-home-section__heading > .dt-centre-cta *,
.home .dt-services-section .dt-home-section__heading > .dt-home-section__link--centre * {
  visibility: visible !important;
  opacity: 1 !important;
  color: inherit !important;
  font-family: inherit !important;
  font-size: inherit ;
  line-height: inherit !important;
  font-weight: inherit !important;
}

.home .dt-services-section .dt-home-section__heading > .dt-centre-cta:hover,
.home .dt-services-section .dt-home-section__heading > .dt-centre-cta:focus,
.home .dt-services-section .dt-home-section__heading > .dt-home-section__link--centre:hover,
.home .dt-services-section .dt-home-section__heading > .dt-home-section__link--centre:focus {
  color: #1E8349 !important;
  background: transparent !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

.home .dt-services-section .dt-centre-cta__icon,
.home .dt-services-section .dt-home-section__link--centre .dt-home-section__link-icon {
  color: #1E8349 !important;
}

@media (max-width: 767px) {
  .home .dt-services-section .dt-home-section__heading > .dt-centre-cta,
  .home .dt-services-section .dt-home-section__heading > .dt-home-section__link--centre {
    margin-top: 0 !important;
    white-space: normal !important;
  }
}

/* =========================================================
   Homepage v31: honour the site's Text Size accessibility control
   ---------------------------------------------------------
   The global DriveTest text resizer already works across the site.
   Earlier homepage rules used fixed pixel font sizes with !important,
   which prevented the homepage components from following that control.

   This final block keeps the existing visual proportions while making
   homepage typography relative to the inherited/site text size.
   Layout, card geometry, colours, images and spacing are unchanged.
   ========================================================= */

/* Establish a relative typography context without locking the size. */
body.home .dt-home-alert-carousel,
body.home .dt-home-section {
  font-size: inherit ;
}

/* Standard/supporting copy: same size as normal site body text. */
body.home .dt-home-section__heading p,
body.home .dt-service-card__description,
body.home .dt-service-card p,
body.home .dt-announcement-excerpt,
body.home .dt-announcement-excerpt p,
body.home .dt-quick-card__copy small,
body.home .dt-home-alert-carousel p,
body.home .dt-announcement-card time,
body.home .dt-home-section__link,
body.home .dt-centre-cta,
body.home .dt-service-card__action,
body.home .dt-announcement-link,
body.home .dt-home-alert-carousel .dt-home-alert-link,
body.home .dt-home-alert-carousel__status,
body.home .dt-home-alert-carousel__count {
  font-size: 1em ;
}

/* Section heading: 36px when the normal site size is 14px. */
body.home .dt-home-section__heading h2 {
  font-size: 2.571em ;
  line-height: 1.15 !important;
}

/* Service / announcement / quick-link titles: 20px at normal size. */
body.home .dt-service-card__title,
body.home .dt-service-card h3,
body.home .dt-announcement-card h3,
body.home .dt-quick-card__copy strong {
  font-size: 1.429em ;
  line-height: 1.3 !important;
}

/* Alert title: 26px at normal site size. */
body.home .dt-home-alert-carousel__title,
body.home .dt-home-alert-carousel h1,
body.home .dt-home-alert-carousel h2 {
  font-size: 1.857em ;
  line-height: 1.2 !important;
}

/* Carousel arrows should grow with the selected text size as well. */
body.home .dt-home-alert-carousel__arrow {
  font-size: 1.35em ;
}

/* Keep service-card and announcement action links consistent. */
body.home .dt-services-section .dt-service-card__action,
body.home .dt-announcements-section .dt-announcement-link,
body.home .dt-services-section .dt-centre-cta,
body.home .dt-services-section .dt-home-section__link--centre,
body.home .dt-announcements-section .dt-home-section__link {
  font-size: 1em ;
  line-height: 1.4 !important;
}

/* Tablet keeps the same hierarchy, but no longer hard-locks pixels. */
@media (max-width: 900px) {
  body.home .dt-home-section__heading h2 {
    font-size: 2.143em ;
  }

  body.home .dt-service-card__title,
  body.home .dt-service-card h3,
  body.home .dt-announcement-card h3,
  body.home .dt-quick-card__copy strong {
    font-size: 1.286em ;
  }

  body.home .dt-home-alert-carousel__title,
  body.home .dt-home-alert-carousel h1,
  body.home .dt-home-alert-carousel h2 {
    font-size: 1.714em ;
  }
}

/* Phone hierarchy remains compact while still following text resizing. */
@media (max-width: 600px) {
  body.home .dt-home-section__heading h2 {
    font-size: 1.714em ;
  }

  body.home .dt-service-card__title,
  body.home .dt-service-card h3,
  body.home .dt-announcement-card h3,
  body.home .dt-quick-card__copy strong {
    font-size: 1.143em ;
  }

  body.home .dt-home-alert-carousel__title,
  body.home .dt-home-alert-carousel h1,
  body.home .dt-home-alert-carousel h2 {
    font-size: 1.571em ;
  }
}

/*
 * Text enlargement can create additional wrapping.  Do not lock textual
 * components to fixed line-box heights when the accessibility control is
 * active; allow the cards/hero to grow naturally rather than clip text.
 */
body.home .dt-service-card,
body.home .dt-announcement-card,
body.home .dt-announcement-card > article {
  height: auto;
}


/* =========================================================
   Homepage v32: Text Size control compatibility fix
   ---------------------------------------------------------
   IMPORTANT: Do not add !important to homepage font-size rules.
   The site's accessibility font resizer applies runtime/inline
   font sizes to text elements. Inline values cannot override a
   stylesheet font-size declared with !important.

   Homepage font-size defaults above intentionally remain normal
   declarations so the accessibility control can supersede them.
   ========================================================= */

/* =========================================================
   Homepage v33: Accessibility Font Resizer layout compatibility
   ---------------------------------------------------------
   functions.php mirrors the site's existing Accessibility Font
   Resizer scale onto custom homepage span/link text.  These rules
   allow fixed-height homepage components to grow when text is enlarged
   so content is not clipped or forced outside its cards.
   ========================================================= */

body.home.dt-home-font-enlarged .dt-services-section .dt-service-card {
  min-height: 420px;
}

body.home.dt-home-font-xlarge .dt-services-section .dt-service-card {
  min-height: 455px;
}

body.home.dt-home-font-enlarged .dt-announcement-card,
body.home.dt-home-font-enlarged .dt-announcement-card > article,
body.home.dt-home-font-enlarged .dt-quick-card {
  height: auto;
}

/* Let the alert panel grow when the user chooses larger text. */
@media (min-width: 768px) {
  body.home.dt-home-font-enlarged .dt-home-alert-carousel,
  body.home.dt-home-font-enlarged .dt-home-alert-carousel__slides,
  body.home.dt-home-font-enlarged .dt-home-alert-carousel__slide,
  body.home.dt-home-font-enlarged .dt-home-alert-carousel .dt-home-hero__inner {
    height: auto !important;
    min-height: 330px !important;
  }

  body.home.dt-home-font-enlarged .dt-home-alert-carousel .dt-home-hero__overlay {
    height: auto !important;
    min-height: 292px !important;
  }

  body.home.dt-home-font-xlarge .dt-home-alert-carousel,
  body.home.dt-home-font-xlarge .dt-home-alert-carousel__slides,
  body.home.dt-home-font-xlarge .dt-home-alert-carousel__slide,
  body.home.dt-home-font-xlarge .dt-home-alert-carousel .dt-home-hero__inner {
    min-height: 360px !important;
  }

  body.home.dt-home-font-xlarge .dt-home-alert-carousel .dt-home-hero__overlay {
    min-height: 322px !important;
  }

  body.home.dt-home-font-enlarged .dt-home-alert-carousel p {
    flex-basis: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
  }
}

/* At tablet widths the five-card grid already becomes three columns.
   Allow extra vertical room for larger titles/descriptions. */
@media (max-width: 1050px) and (min-width: 768px) {
  body.home.dt-home-font-enlarged .dt-services-section .dt-service-card {
    min-height: 430px;
  }

  body.home.dt-home-font-xlarge .dt-services-section .dt-service-card {
    min-height: 470px;
  }
}

/* Mobile cards are horizontal.  Remove the old fixed-height assumptions
   when enlarged text is active so titles can wrap without clipping. */
@media (max-width: 767px) {
  body.home.dt-home-font-enlarged .dt-services-section .dt-service-card {
    grid-template-columns: 88px minmax(0, 1fr) 28px;
    min-height: 88px;
    height: auto;
  }

  body.home.dt-home-font-xlarge .dt-services-section .dt-service-card {
    min-height: 98px;
  }

  body.home.dt-home-font-enlarged .dt-services-section .dt-service-card__body {
    min-height: inherit;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  body.home.dt-home-font-enlarged .dt-home-alert-carousel,
  body.home.dt-home-font-enlarged .dt-home-alert-carousel__slides,
  body.home.dt-home-font-enlarged .dt-home-alert-carousel__slide,
  body.home.dt-home-font-enlarged .dt-home-alert-carousel .dt-home-hero__inner,
  body.home.dt-home-font-enlarged .dt-home-alert-carousel .dt-home-hero__overlay {
    height: auto !important;
  }

  body.home.dt-home-font-enlarged .dt-home-alert-carousel,
  body.home.dt-home-font-enlarged .dt-home-alert-carousel__slides,
  body.home.dt-home-font-enlarged .dt-home-alert-carousel__slide,
  body.home.dt-home-font-enlarged .dt-home-alert-carousel .dt-home-hero__inner {
    min-height: 315px !important;
  }

  body.home.dt-home-font-enlarged .dt-home-alert-carousel .dt-home-hero__overlay {
    min-height: 275px !important;
  }

  body.home.dt-home-font-enlarged .dt-home-alert-carousel p {
    flex-basis: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
  }
}