/* TT-NDT typography system.
   Loaded last on every page. Footer rules are intentionally excluded. */
:root {
  --tt-font-display: "Space Mono", monospace;
  --tt-font-body: "Manrope", sans-serif;
  --tt-font-tech: "DotGothic16", sans-serif;
  --tt-type-meta: 10px;
  --tt-type-ui: 12px;
  --tt-type-body: 14px;
  --tt-type-input: 16px;
  --tt-type-lead: clamp(16px, 1.4vw, 18px);
  --tt-type-subheading: 16px;
  --tt-type-section: clamp(20px, 2vw, 28px);
  --tt-type-page: clamp(32px, 4.5vw, 56px);
  --tt-type-display: clamp(40px, calc(4.7619vw + 22.8571px), 80px);
  --tt-lh-display: .96;
  --tt-lh-title: 1.1;
  --tt-lh-body: 1.5;
  --tt-track-ui: .04em;
}

/* The desktop artboard is authored at 1200px and enlarged as a single
   unit by autoscale.js. Freeze the type values here at their 1200px
   computed sizes so viewport units cannot add a second scale factor. */
@media (min-width: 1200px) {
  .tt-stage .tt-stage__inner {
    --tt-type-lead: 16px;
    --tt-type-section: 24px;
    --tt-type-page: 54px;
    --tt-type-display: 80px;
  }
}

/* Readable content: Manrope regular; headings within content: Manrope 800. */
:is(#tt-svc-intro, #tt-ut-what, #tt-ut-why, #tt-ut-process, #tt-ut-applications,
    #tt-ut-related, #tt-vt-receive, #tt-vt-choose, #tt-bp-faq, #tt-request-block,
    .tt-cookie-banner, .tt-cookie-panel) :is(p, li, input, textarea, select) {
  font-family: var(--tt-font-body) !important;
}

:is(#tt-svc-intro, #tt-ut-what, #tt-ut-why, #tt-ut-process, #tt-ut-applications,
    #tt-ut-related, #tt-vt-receive, #tt-vt-choose, #tt-bp-faq) :is(p, li) {
  font-size: var(--tt-type-body) !important;
  font-weight: 400 !important;
  line-height: var(--tt-lh-body) !important;
  letter-spacing: 0 !important;
}

:is(#tt-svc-intro, #tt-ut-what, #tt-ut-why, #tt-ut-process, #tt-ut-applications,
    #tt-ut-related, #tt-vt-receive, #tt-vt-choose, #tt-bp-faq) :is(h3, h4) {
  font-family: var(--tt-font-body) !important;
  font-size: var(--tt-type-subheading) !important;
  font-weight:800 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
}

/* Display and title hierarchy. */
:is(.tt-services-page-hero__title, .tt-hero__title, .tt-home-hero__title,
    .tt-mobile-hero__title, .tt1700-rent__title) {
  font-family: var(--tt-font-display) !important;
  font-size: var(--tt-type-display) !important;
  font-weight: 700 !important;
  line-height: var(--tt-lh-display) !important;
  letter-spacing: -.045em !important;
}

:is(.tt-svc-intro__title, .tt-service-single__title, .tt-request-v2__title,
    .tt-form-success__title) {
  font-family: var(--tt-font-display) !important;
  font-size: var(--tt-type-page) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: -.045em !important;
}

:is(.tt-ut-what__label, .tt-ut-why__label, .tt-ut-process__title,
    .tt-ut-applications__title, .tt-ut-related__title, .tt-vt-receive__title,
    .tt-vt-choose__title, .tt-bp-faq__title, .tt-mobile-services__title,
    .tt-mobile-equipment__title, .tt-mobile-reports__title, .tt-services-label,
    .rent-title, .tt-reports-label, .tt-careers-form__title) {
  font-family: var(--tt-font-display) !important;
  font-size: var(--tt-type-section) !important;
  font-weight: 700 !important;
  line-height: var(--tt-lh-title) !important;
  letter-spacing: -.02em !important;
}

/* Careers application heading is intentionally display-sized. */
#tt-careers-form .tt-careers-form__title {
  font-size: var(--tt-type-display) !important;
}

/* The equipment block uses a display-scale heading, not a section label. */
html body .rent-equipment-block .rent-title {
  font-size: var(--tt-type-display) !important;
  font-weight:800 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

/* UI remains monospaced and compact. */
:is(#tt-request-block button, .tt-cta, .tt-services-page-hero__service,
    .tt-cookie-button, .tt-cookie-banner__link, .tt-cookie-panel__close,
    .tt-request-v2__submit) {
  font-family: var(--tt-font-display) !important;
  font-weight: 700 !important;
}

:is(.tt-services-page-hero__service, .tt-cookie-button, .tt-cookie-banner__link,
    .tt-request-v2__submit, .tt-request-ui label, .tt-request-kits__label) {
  font-size: var(--tt-type-ui) !important;
  line-height: 1.2 !important;
  letter-spacing: var(--tt-track-ui) !important;
}

/* Submit controls use one desktop type treatment across every form. */
html body :is(.tt-request-submit, .tt-careers-form__submit, .tt-request-v2__submit) {
  font-family: "Space Mono", monospace !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

/* Technical labels use DotGothic16 only. */
:is(.tt-ut-what__tag, .tt-vt-choose__tag, .tt-vt-receive__num,
    .tt-cookie-banner__eyebrow, .tt-cookie-panel__eyebrow,
    .tt-cookie-category__name, .tt-cookie-category__status,
    .tt-cookie-toggle__label, .tt-cookie-details summary) {
  font-family: var(--tt-font-tech) !important;
  font-size: var(--tt-type-meta) !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  letter-spacing: var(--tt-track-ui) !important;
}

/* Cookie copy is readable content; technical labels above retain their role. */
:is(.tt-cookie-banner__copy, .tt-cookie-panel__intro, .tt-cookie-category__description,
    .tt-cookie-detail-row, .tt-cookie-panel__note) {
  font-family: var(--tt-font-body) !important;
  font-size: var(--tt-type-body) !important;
  font-weight: 400 !important;
  line-height: var(--tt-lh-body) !important;
  letter-spacing: 0 !important;
}

/* Home, equipment and careers: the same body scale outside their service blocks. */
:is(.tt1700-rent__subtitle, .tt-home-intro__copy, .tt-reports-copy,
    .tt-kits__desc, .tt-careers-intro, .tt-careers-form__hint,
    .tt-careers-form__body) {
  font-family: var(--tt-font-body) !important;
  font-size: var(--tt-type-body) !important;
  font-weight: 400 !important;
  line-height: var(--tt-lh-body) !important;
  letter-spacing: 0 !important;
}

/* Inputs remain 16px so iOS does not zoom on focus. */
:is(.tt-f-control input, .tt-f-control textarea, .tt-request-ui input,
    .tt-request-ui textarea) {
  font-family: var(--tt-font-body) !important;
  font-size: var(--tt-type-input) !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  letter-spacing: 0 !important;
}

:is(.tt-kits__title, .tt-careers-form__railtitle, .tt-rep__title,
    .tt-mobile-report-system__body h3, .tt-mobile-reports__copy h3) {
  font-family: var(--tt-font-body) !important;
  font-size: var(--tt-type-subheading) !important;
  font-weight:800 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
}

:is(.tt-kits__btn, .tt-f-label, .tt-mobile-report-system__tabs button,
    .tt-report-options button, .tt-mobile-report-system__actions button) {
  font-family: var(--tt-font-display) !important;
  font-size: var(--tt-type-ui) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: var(--tt-track-ui) !important;
}

:is(.tt1700-rent__mail-label, .tt-careers-intro__caption, .tt-reports-kicker,
    .tt-mobile-reports__kicker, .tt-mobile-report-system__status,
    .tt-rep__hint, .tt-request-diagram-meta) {
  font-family: var(--tt-font-tech) !important;
  font-size: var(--tt-type-meta) !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  letter-spacing: var(--tt-track-ui) !important;
}

/* Standalone legal pages retain their layout but use the same reading hierarchy. */
.wrap :is(p, li) {
  font-family: var(--tt-font-body) !important;
  font-size: var(--tt-type-body) !important;
  font-weight: 400 !important;
  line-height: var(--tt-lh-body) !important;
  letter-spacing: 0 !important;
}

.wrap h1 {
  font-family: var(--tt-font-display) !important;
  font-size: var(--tt-type-page) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: -.045em !important;
}

.wrap :is(h2, h3) {
  font-family: var(--tt-font-display) !important;
  font-size: var(--tt-type-section) !important;
  font-weight: 700 !important;
  line-height: var(--tt-lh-title) !important;
  letter-spacing: -.02em !important;
}

@media (max-width: 1199.98px) {
  /* Native responsive type scale. Desktop keeps its independent 1200px
     artboard values above this breakpoint. */
  :root {
    --fs-display-responsive: clamp(40px, calc(4.7619vw + 22.8571px), 80px);
    --fs-page-responsive: clamp(27px, 8.2vw, 44px);
    --fs-section-responsive: clamp(20px, 2.6vw, 28px);
    --fs-subheading-responsive: 16px;
    --fs-lead-responsive: 16px;
    --fs-body-responsive: 14px;
    --fs-ui-responsive: 12px;
    --fs-meta-responsive: 12px;
    --fs-input-responsive: 16px;
  }

  /* Reading, forms, and compact interface roles. */
  :is(.tt1700-rent__subtitle, .tt-home-intro__copy, .tt-reports-copy,
      .tt-kits__desc, .tt-careers-intro, .tt-careers-form__hint,
      .tt-careers-form__body, .tt-mobile-reports__copy p) {
    font-size: var(--fs-body-responsive) !important;
  }

  :is(.tt-kits__title, .tt-careers-form__railtitle, .tt-rep__title,
      .tt-mobile-report-system__body h3, .tt-mobile-reports__copy h3) {
    font-size: var(--fs-subheading-responsive) !important;
  }

  :is(.tt-f-control input, .tt-f-control textarea, .tt-request-ui input,
      .tt-request-ui textarea, #tt-careers-form input, #tt-careers-form textarea,
      #tt-careers-form select) {
    font-size: var(--fs-input-responsive) !important;
  }

  :is(.tt-request-ui label, .tt-request-kits__label, .tt-f-label,
      .tt-kits__btn, .tt-mobile-report-system__tabs button,
      .tt-report-options button, .tt-mobile-report-system__actions button) {
    font-size: var(--fs-ui-responsive) !important;
  }

  :is(.tt-reports-kicker, .tt-mobile-reports__kicker) {
    font-size: var(--fs-lead-responsive) !important;
  }

  :is(.tt1700-rent__mail-label, .tt-careers-intro__caption,
      .tt-mobile-report-system__status, .tt-rep__hint,
      .tt-request-diagram-meta) {
    font-size: var(--fs-meta-responsive) !important;
  }

  /* Large native headings use only the responsive display scale. */
  html body :is(.tt-mobile-hero__title, .tt-mobile-services__title,
      .tt-mobile-reports__title, .tt-mobile-equipment__title,
      .tt1700-rent__title, .tt-careers-form__title) {
    font-size: var(--fs-display-responsive) !important;
  }

  /* Header eyebrow/contact stay compact UI rather than becoming headings. */
  .tt-mobile-menu__eyebrow,
  .tt-mobile-menu__contact {
    font-size: var(--fs-meta-responsive) !important;
  }

  :is(#tt-svc-intro, #tt-ut-what, #tt-ut-why, #tt-ut-process, #tt-ut-applications,
      #tt-ut-related, #tt-vt-receive, #tt-vt-choose, #tt-bp-faq) :is(p, li) {
    font-size: var(--fs-body-responsive) !important;
    line-height: var(--tt-lh-body) !important;
  }
}

@media (max-width: 1199.98px) {
  .tt-mobile-reports__kicker {
    font-size: 16px !important;
  }

  .tt-mobile-equipment__note,
  .tt-mobile-equipment__mark {
    font-size: 12px !important;
  }

  .tt-mobile-reports__benefits span {
    font-size: 12px !important;
  }

  html body #tt-request-block .tt-f-label {
    font-size: 12px !important;
  }

  html body #tt-request-block .tt-request-privacy {
    font-size: 12px !important;
  }
}

/* This report subtitle is a UI label, so it follows the display typeface. */
.tt-mobile-reports__kicker {
  font-family: var(--tt-font-display) !important;
}

/* Native tablet/mobile forms need labels sized for their unscaled layout. */
@media (max-width: 1199.98px) {
  html body #tt-request-block .tt-f-label,
  html body #tt-request-block .tt-request-kits__label,
  #tt-careers-form .tt-careers-form__field > label:not(.tt-careers-form__file),
  #tt-careers-form .tt-careers-form__field > legend,
  #tt-careers-form .tt-careers-form__legend {
    font-size: 16px !important;
  }
}

/* Keep the equipment heading centered on tablets and phones. */
@media (min-width: 480px) and (max-width: 1199.98px) {
  .tt-mobile-equipment__title {
    left: 50% !important;
    right: auto !important;
    width: max-content !important;
    transform: translateX(-50%) !important;
  }
}

@media (max-width: 1199.98px) {
  .tt-mobile-reports__kicker {
    font-size: 16px !important;
  }

  .tt-mobile-reports__benefits,
  .tt-mobile-reports__benefits span,
  .tt-mobile-report-system__data dt,
  .tt-mobile-report-fields span,
  .tt-mobile-report-fields small,
  .tt-mobile-option > span {
    font-size: 12px !important;
  }

  .tt-mobile-reports__copy p {
    font-size: 14px !important;
  }

  /* Form copy and editable values use one readable Manrope size. */
  html body #tt-request-block :is(.tt-request-intro, .tt-request-privacy,
      .tt-request-state, .tt-f-err, .tt-inline-error__text, input, textarea, select),
  html body #tt-careers-form :is(.tt-careers-form__notes p, .tt-careers-form__hint,
      .tt-careers-form__filelist, .tt-careers-form__privacy, input, textarea, select) {
    font-size: 14px !important;
  }
}

/* Primary headings share one fluid display scale across every breakpoint. */
html body #tt-hero .tt-hero__title,
html body .tt-mobile-hero__title,
html body #tt-services-block .tt-services-label,
html body .tt-mobile-services__title,
html body #tt-reports-block .tt-reports-label,
html body .tt-mobile-reports__title,
html body .rent-equipment-block .rent-title,
html body .tt-mobile-equipment__title,
html body #tt-request-block .tt-request-title,
html body #tt-services-page-hero .tt-services-page-hero__title,
html body .tt1700-rent .tt1700-rent__title,
html body #tt-careers-form .tt-careers-form__title {
  font-size: clamp(40px, calc(4.7619vw + 22.8571px), 80px) !important;
}

/* Confirmed native responsive typography corrections. Keep the 1200px
   artboards and autoscale composition independent above this breakpoint. */
@media (max-width: 1199.98px) {
  html body .tt-svc-intro__sub {
    font-size: var(--tt-type-section) !important;
  }

  html body :is(input, textarea, select) {
    font-size: var(--fs-input-responsive) !important;
  }

  html body .tt-kits__title {
    font-size: var(--tt-type-section) !important;
  }

  html body .tt1700-rent__subtitle {
    font-size: var(--fs-body-responsive) !important;
  }

  html body #tt-careers-form :is(input, textarea, select) {
    font-size: var(--fs-input-responsive) !important;
  }
}

/* Intro and careers section headings share the same compact heading size on
   native layouts. The 1200px artboard already resolves these headings to 16px. */
@media (min-width: 360px) and (max-width: 1199.98px) {
  html body :is(
      #tt-home-intro-title,
      #tt-careers-intro .tt-careers-intro__lead,
      #tt-careers-form .tt-careers-form__railtitle) {
    font-size: 16px !important;
  }
}

/* One Display role on native layouts. The desktop artboard and its animation
   rules remain untouched at 1200px and above. */
@media (max-width: 1199.98px) {
  html body :is(
      #tt-hero .tt-hero__title,
      .tt-mobile-hero__title,
      #tt-services-block .tt-services-label,
      .tt-mobile-services__title,
      .rent-equipment-block .rent-title,
      .tt-mobile-equipment__title,
      #tt-reports-block .tt-reports-label,
      .tt-mobile-reports__title,
      #tt-request-block .tt-request-title,
      #tt-services-page-hero .tt-services-page-hero__title,
      .tt1700-rent .tt1700-rent__title,
      #tt-careers-form .tt-careers-form__title) {
    font-family: "Space Mono", monospace !important;
    font-size: clamp(40px, calc(4.7619vw + 22.8571px), 80px) !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: 0px !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  /* Existing child spans must allow the heading's natural word boundaries. */
  html body .tt-mobile-hero__title-line,
  html body #tt-request-block .tt-request-title span,
  html body .tt1700-rent__title span,
  html body #tt-services-page-hero .tt-services-page-hero__title span {
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  /* Let phrases wrap only at their regular word spaces. On native layouts the
     brackets are generated on the word itself, so source-code whitespace can
     never create a visual gap and neither bracket can wrap on its own. */
  html body .tt1700-rent .tt1700-rent__title,
  html body #tt-services-page-hero .tt-services-page-hero__title {
    display: block !important;
  }

  /* The visible opening bracket sits on the shared 20 px page axis. Hero
     wrappers use fluid padding, so compensate that padding and the Space Mono
     bracket's left side-bearing only for the title. */
  html body:has(#tt-kits) .tt1700-rent .tt1700-rent__title {
    margin-left: calc(20px - var(--tt-equipment-page-gutter, 20px) - .236em) !important;
  }

  html body:has(#tt-careers-intro) .tt1700-rent .tt1700-rent__title {
    margin-left: calc(20px - var(--tt-careers-gutter, 20px) - .236em) !important;
  }

  html body #tt-services-page-hero .tt-services-page-hero__title {
    margin-left: -.236em !important;
  }

  html body .tt1700-rent__title .tt1700-rent__word,
  html body #tt-services-page-hero .tt-services-page-hero__word {
    display: inline !important;
    margin-inline: 0 !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  html body .tt1700-rent.tt1700-rent .tt1700-rent__title .tt1700-rent__bracket,
  html body.tt-service-single-dom .tt-stage .tt-stage__inner
    #tt-services-page-hero#tt-services-page-hero.tt-services-page-hero
    .tt-services-page-hero__title .tt-services-page-hero__bracket {
    display: none !important;
  }

  html body .tt1700-rent__title .tt1700-rent__word::before,
  html body #tt-services-page-hero .tt-services-page-hero__word::before {
    content: "[";
  }

  html body .tt1700-rent__title .tt1700-rent__word::after,
  html body #tt-services-page-hero .tt-services-page-hero__word::after {
    content: "]";
  }

  /* Chrome clips only the first line of an animated inline clip-path.
     Keep the word's opacity animation and the bracket motion, while letting
     every wrapped line remain visible after the reveal. */
  html body .tt1700-rent__title .tt1700-rent__word {
    clip-path: none !important;
  }

  /* The service hero has a highly specific responsive layout declaration. */
  html body.tt-service-single-dom .tt-stage .tt-stage__inner
    #tt-services-page-hero#tt-services-page-hero .tt-services-page-hero__title {
    font-family: "Space Mono", monospace !important;
    font-size: clamp(40px, calc(4.7619vw + 22.8571px), 80px) !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: 0px !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    display: block !important;
  }

  html body #tt-request-block.tt-request-block[id] .tt-request-title,
  html body:has(#tt-services-page-hero)
    #tt-request-block.tt-request-block[id] .tt-request-title {
    font-family: "Space Mono", monospace !important;
    font-size: clamp(40px, calc(4.7619vw + 22.8571px), 80px) !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: 0px !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }
}