/* DigLTBlue holding template — the "Under Construction" canvas, in artboard
   order: 1 Message band · 2 Direct line. The chrome above and the footer below
   are the shared partials; nothing here is new visual language — navy /
   orange, Oswald + Montserrat, the 2px rule, the 96px band rhythm, zero radius.

   Desktop values are the 1440 artboard's literals; the <640px block at the end
   is the 400 artboard. Everything between is fluid. */

/* ══ 1 Message band ═══════════════════════════════════════════════════ */
/* Full bleed, flat navy, no photo. The drawn height (860 / 720) is what makes
   it fill the first screen under the in-flow chrome; the copy sits at the
   bottom of it, exactly as the hero's does, and the band grows rather than
   let a wrapped headline climb. */
.lt-holding {
  min-height: 860px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 48px var(--pad-x) 64px;
}

/* The artboard pads to the frame edge; on wider screens the copy is capped at
   the same inner column every other section uses so a 60px headline never
   drifts away from the logo above it. */
.lt-holding__inner {
  width: 100%;
  max-width: var(--content-max);
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.lt-holding__kicker {
  color: var(--color-orange);
  font-size: var(--fs-nav);
  letter-spacing: var(--ls-kicker);
}

/* 60px, not the 88px hero scale — this headline explains, it does not sell.
   Doubled selector so it out-ranks .lt-heading--hero regardless of sheet
   order. */
.lt-holding .lt-holding__heading {
  max-width: 900px;
  font-size: 60px;
  line-height: var(--lh-hero);
  color: var(--color-white);
}

.lt-holding__text {
  margin: 0;
  max-width: 720px;
  font-size: var(--fs-lead);
  line-height: 1.6;
  color: var(--color-on-navy-body);
  text-wrap: pretty;
}

.lt-holding__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 8px;
}

/* The outline button flips to white and fills orange through
   .lt-section--navy in base.css; nothing to restate here. */

/* ══ 2 Direct line ════════════════════════════════════════════════════ */
/* The closing CTA's centred stack on the wash: heading, 200px rule, the
   office number in display type. */
.lt-direct__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  text-align: center;
}

.lt-direct__heading {
  color: var(--color-navy);
}

.lt-direct__phone {
  margin-top: 8px;
  font-family: var(--font-display);
  font-weight: var(--weight-display);
  font-size: 28px;
  line-height: 1.15;
  letter-spacing: var(--ls-display);
  color: var(--color-navy);
}

.lt-direct__phone:hover {
  color: var(--color-orange);
}

/* ══ <640px — the 400 artboard ════════════════════════════════════════ */
/* Kicker (12px), lead (14px) and line-height (1.08) already step down through
   tokens.css; only the band's own literals are restated here. */
@media (max-width: 639px) {
  .lt-holding {
    min-height: 720px;
    padding-top: 32px;
    padding-bottom: 32px;
  }

  .lt-holding__inner {
    gap: 16px;
  }

  .lt-holding .lt-holding__heading {
    font-size: 44px;
  }

  .lt-holding__actions {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    margin-top: 4px;
  }

  .lt-holding__actions .lt-btn {
    display: block;
    width: 100%;
  }

  .lt-direct__inner {
    gap: 20px;
  }

  .lt-direct__phone {
    margin-top: 4px;
    font-size: 24px;
  }
}