/* Full-width image banner with a white fact-card strip overlapping its lower edge. */
.section-showcase {
  --showcase-image: none;
  position: relative;
  isolation: isolate;
  padding: clamp(3.25rem, 5vw, 5rem) 0 clamp(3.25rem, 5vw, 4.5rem);
  background: #f4f6f7;
}

.section-showcase::before {
  content: "";
  position: absolute;
  z-index: -2;
  inset: 0 0 auto;
  height: clamp(300px, 29vw, 390px);
  background-image:
    linear-gradient(90deg, rgba(48, 4, 8, .96) 0%, rgba(83, 8, 13, .82) 38%, rgba(14, 28, 39, .26) 76%, rgba(14, 28, 39, .1) 100%),
    var(--showcase-image);
  background-position: center;
  background-size: cover;
}

.section-showcase::after {
  content: "";
  position: absolute;
  z-index: -3;
  inset: clamp(300px, 29vw, 390px) 0 0;
  background: linear-gradient(180deg, #f4f6f7, #fff);
}

.section-showcase > .container { position: relative; }

.section-showcase > .container > .section-title,
.section-showcase > .container > .text-center .section-title {
  color: #fff;
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  text-align: left !important;
}

.section-showcase > .container > .text-center {
  max-width: none !important;
  text-align: left !important;
}

.section-showcase .showcase-panel {
  margin-top: clamp(7rem, 10vw, 9rem) !important;
  padding: 0;
  overflow: hidden;
  border: 1px solid #e0e5e8;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 45px rgba(17, 39, 53, .14);
}

.section-showcase .fact-box,
.section-showcase .process-step {
  min-height: 128px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.section-showcase .showcase-panel .row {
  --bs-gutter-x: 0;
  --bs-gutter-y: 0;
}

.section-showcase .showcase-panel [class*="col-"] {
  border-right: 1px solid #e1e6e9;
}

.section-showcase .showcase-panel [class*="col-"]:last-child { border-right: 0; }

.section-showcase .showcase-panel [class*="col-"]:nth-child(odd) .fact-box,
.section-showcase .process-step:nth-of-type(4n+1) {
  background: #fff7f7;
}

.section-showcase .showcase-panel [class*="col-"]:nth-child(even) .fact-box,
.section-showcase .process-step:nth-of-type(4n+3) {
  background: #fffaf0;
}

.section-showcase .fact-box .icon-circle,
.section-showcase .process-step .step-circle {
  background: #f8f0e1;
  color: var(--ttsl-maroon);
}

.section-showcase .process-flow {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 0;
  align-items: stretch;
}

.section-showcase .process-step {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1rem .6rem;
  border-right: 1px solid #e1e6e9;
}

.section-showcase .process-step:last-of-type { border-right: 0; }
.section-showcase .process-step .step-circle { border: 0; }
.section-showcase .process-arrow { display: none; }

.products-showcase { --showcase-image: url('../images/ttsl/banners/Products.png'); }
.services-showcase { --showcase-image: url('../images/ttsl/banners/TTSL-Services-Hero-HD-2400x480.png'); }
.careers-showcase { --showcase-image: url('../images/ttsl/banners/Careers.png'); }

/* Services: engineering process directly overlaps the main hero, matching the About trust strip. */
.services-process-strip {
  position: relative;
  z-index: 5;
  margin-top: -44px;
  padding: 0 0 1.5rem;
  background: linear-gradient(180deg, transparent 0 44px, #f3f6f8 44px 100%);
}

.services-process-strip > .container {
  padding-right: 0;
  padding-left: 0;
  overflow: hidden;
  border: 1px solid #e0e5e8;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 45px rgba(17, 39, 53, .14);
}

.services-process-strip .process-flow {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 0;
}

.services-process-strip .process-step {
  display: flex;
  min-width: 0;
  min-height: 150px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1rem .65rem;
  border-right: 1px solid #dfe5e8;
  text-align: center;
}

.services-process-strip .process-step:last-child { border-right: 0; }
.services-process-strip .process-step:nth-child(odd) { background: #fff7f7; }
.services-process-strip .process-step:nth-child(even) { background: #fffaf0; }

.services-process-strip .step-circle {
  display: flex;
  width: 64px;
  height: 64px;
  align-items: center;
  justify-content: center;
  margin: 0 auto .8rem;
  border: 0;
  border-radius: 50%;
  background: #f8f0e1;
  color: var(--ttsl-maroon);
  font-size: 1.55rem;
}

.services-process-strip .step-label {
  color: var(--ttsl-text-dark);
  font-family: var(--font-heading);
  font-size: .82rem;
  font-weight: 700;
  line-height: 1.35;
}

/* Products: one hero only, with the existing four facts overlapping beneath it. */
.products-fact-strip {
  position: relative;
  z-index: 5;
  margin-top: -44px;
  padding: 0 0 1.5rem;
  background: linear-gradient(180deg, transparent 0 44px, #f3f6f8 44px 100%);
}

.products-fact-strip > .container {
  padding-right: 0;
  padding-left: 0;
  overflow: hidden;
  border: 1px solid #e0e5e8;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 45px rgba(17, 39, 53, .14);
}

.products-fact-strip .fact-box {
  min-height: 128px;
  justify-content: center;
  padding: 1.25rem;
  border: 0;
  border-right: 1px solid #dfe5e8;
  border-radius: 0;
  background: #fff;
}

.products-fact-strip [class*="col-"]:last-child .fact-box { border-right: 0; }
.products-fact-strip [class*="col-"]:nth-child(odd) .fact-box { background: #fff7f7; }
.products-fact-strip [class*="col-"]:nth-child(even) .fact-box { background: #fffaf0; }
.products-fact-strip .icon-circle { background: #f8f0e1; color: var(--ttsl-maroon); }

/* Careers: the unchanged application steps overlap the single main hero. */
.careers-fact-strip {
  position: relative;
  z-index: 5;
  margin-top: -44px;
  padding: 0 0 1.5rem;
  background: linear-gradient(180deg, transparent 0 44px, #f3f6f8 44px 100%);
}

.careers-page main > .careers-fact-strip {
  margin-top: -44px !important;
  padding: 0 0 1.5rem !important;
  background: linear-gradient(180deg, transparent 0 44px, #f3f6f8 44px 100%) !important;
}

.careers-fact-strip > .container {
  padding-right: 0;
  padding-left: 0;
  overflow: hidden;
  border: 1px solid #e0e5e8;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 45px rgba(17, 39, 53, .14);
}

.careers-page .careers-fact-strip .fact-box {
  min-height: 128px;
  height: 100%;
  justify-content: center;
  flex-direction: row;
  gap: 14px;
  padding: 1.25rem;
  border: 0;
  border-right: 1px solid #dfe5e8;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
  text-align: left;
}

.careers-page .careers-fact-strip [class*="col-"]:last-child .fact-box { border-right: 0; }
.careers-page .careers-fact-strip [class*="col-"]:nth-child(odd) .fact-box { background: #fff7f7; }
.careers-page .careers-fact-strip [class*="col-"]:nth-child(even) .fact-box { background: #fffaf0; }
.careers-page .careers-fact-strip .icon-circle { margin: 0; background: #f8f0e1; color: var(--ttsl-maroon); }

@media (max-width: 991.98px) {
  .careers-page .careers-fact-strip [class*="col-"]:nth-child(2n) .fact-box { border-right: 0; }
  .careers-page .careers-fact-strip [class*="col-"]:nth-child(-n+2) .fact-box { border-bottom: 1px solid #dfe5e8; }
}

@media (max-width: 575.98px) {
  .careers-page main > .careers-fact-strip { margin-top: -28px !important; background: linear-gradient(180deg, transparent 0 28px, #f3f6f8 28px 100%) !important; }
  .careers-fact-strip > .container { border-radius: 12px; }
  .careers-page .careers-fact-strip .fact-box { min-height: 104px; justify-content: flex-start; border-right: 0; border-bottom: 1px solid #dfe5e8; }
  .careers-page .careers-fact-strip [class*="col-"]:nth-child(-n+2) .fact-box { border-bottom: 1px solid #dfe5e8; }
  .careers-page .careers-fact-strip [class*="col-"]:last-child .fact-box { border-bottom: 0; }
}

/* Contact: details form an About-style strip beneath the main hero. */
.contact-info-strip {
  display: block !important;
  position: relative;
  z-index: 5;
  margin-top: -44px;
  padding: 0 0 1.5rem;
  background: linear-gradient(180deg, transparent 0 44px, #f3f6f8 44px 100%);
}

.contact-info-strip > .container {
  padding-right: 0;
  padding-left: 0;
  overflow: hidden;
  border: 1px solid #e0e5e8;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 45px rgba(17, 39, 53, .14);
}

.contact-page .contact-info-strip .contact-info-item {
  min-height: 138px;
  height: 100%;
  margin: 0;
  padding: 1.25rem;
  border: 0;
  border-right: 1px solid #dfe5e8;
  border-radius: 0;
  background: #fff;
}

.contact-page .contact-info-strip .contact-info-item h4 {
  margin-bottom: .2rem;
  font-size: .78rem;
}

.contact-page .contact-info-strip .contact-info-item p {
  margin: 0;
  font-size: .78rem;
  line-height: 1.4;
}

.contact-page .contact-info-strip [class*="col-"]:last-child .contact-info-item { border-right: 0; }
.contact-page .contact-info-strip [class*="col-"]:nth-child(odd) .contact-info-item { background: #fff7f7; }
.contact-page .contact-info-strip [class*="col-"]:nth-child(even) .contact-info-item { background: #fffaf0; }
.contact-page .contact-info-strip .icon-circle { background: #f8f0e1; color: var(--ttsl-maroon); }

.contact-page .contact-main-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
}

.contact-page .contact-main-grid > .col-12 {
  width: auto !important;
  max-width: none !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  padding: 0 !important;
}

.contact-page .contact-main-grid > .contact-location-wrap {
  width: auto !important;
  max-width: none !important;
  grid-column: 1 !important;
  grid-row: 2 !important;
  padding: 0 !important;
}

@media (max-width: 991.98px) {
  .contact-page .contact-info-strip [class*="col-"]:nth-child(2n) .contact-info-item { border-right: 0; }
  .contact-page .contact-info-strip [class*="col-"]:nth-child(-n+2) .contact-info-item { border-bottom: 1px solid #dfe5e8; }
}

@media (max-width: 575.98px) {
  .contact-info-strip { margin-top: -28px; background: linear-gradient(180deg, transparent 0 28px, #f3f6f8 28px 100%); }
  .contact-info-strip > .container { border-radius: 12px; }
  .contact-page .contact-info-strip .contact-info-item { min-height: 104px; border-right: 0; border-bottom: 1px solid #dfe5e8; }
  .contact-page .contact-info-strip [class*="col-"]:nth-child(-n+2) .contact-info-item { border-bottom: 1px solid #dfe5e8; }
  .contact-page .contact-info-strip [class*="col-"]:last-child .contact-info-item { border-bottom: 0; }
}

/* Contact form and compact supporting-card sidebar. */
.contact-page .contact-content-layout {
  background: linear-gradient(180deg, #f3f6f8, #fff);
}

.contact-page .contact-content-layout .contact-form-panel {
  width: 100%;
  height: auto;
}

.contact-page .contact-sidebar-stack {
  display: grid;
  gap: 1rem;
  align-content: start;
}

.contact-page .contact-sidebar-stack .contact-map-panel {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-areas: "heading" "map" "qr";
  gap: .85rem;
  padding: 1.1rem;
}

.contact-page .contact-sidebar-stack .contact-map-heading { grid-area: heading; }
.contact-page .contact-sidebar-stack .map-frame {
  grid-area: map;
  width: 100%;
  height: 190px !important;
  margin: 0 !important;
}
.contact-page .contact-sidebar-stack .contact-map-qr {
  grid-area: qr;
  margin: 0;
}

.contact-page .contact-sidebar-stack .brochure-card {
  display: flex;
  min-height: 0;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  border-radius: 10px;
}

.contact-page .contact-sidebar-stack .brochure-card img {
  width: 72px;
  height: 82px;
  flex: 0 0 72px;
  object-fit: cover;
  border-radius: 6px;
}

.contact-page .contact-sidebar-stack .brochure-card img[src*="qr-brochure"] {
  width: 76px !important;
  height: 76px;
  flex-basis: 76px;
  object-fit: contain;
}

.contact-page .contact-sidebar-stack .brochure-card h4 {
  margin-bottom: .35rem;
  font-size: .9rem;
}

.contact-page .contact-sidebar-stack .brochure-card p {
  margin-bottom: .65rem;
  font-size: .76rem;
  line-height: 1.5;
}

.contact-page .contact-sidebar-stack .brochure-card .btn {
  padding: .45rem .7rem;
  font-size: .72rem;
}

@media (max-width: 991.98px) {
  .contact-page .contact-content-layout { padding-top: 2.5rem !important; }
  .contact-page .contact-sidebar-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .contact-page .contact-sidebar-stack .contact-map-panel { grid-column: 1 / -1; }
}

@media (max-width: 575.98px) {
  .contact-page .contact-content-layout { padding-top: 2rem !important; }
  .contact-page .contact-sidebar-stack { grid-template-columns: 1fr; }
  .contact-page .contact-sidebar-stack .contact-map-panel { grid-column: auto; }
  .contact-page .contact-sidebar-stack .map-frame { height: 220px !important; }
  .contact-page .contact-sidebar-stack .brochure-card { align-items: flex-start; }
}

@media (max-width: 991.98px) {
  .products-fact-strip [class*="col-"]:nth-child(2n) .fact-box { border-right: 0; }
  .products-fact-strip [class*="col-"]:nth-child(-n+2) .fact-box { border-bottom: 1px solid #dfe5e8; }
}

@media (max-width: 575.98px) {
  .products-fact-strip { margin-top: -28px; background: linear-gradient(180deg, transparent 0 28px, #f3f6f8 28px 100%); }
  .products-fact-strip > .container { border-radius: 12px; }
  .products-fact-strip .fact-box { min-height: 104px; justify-content: flex-start; border-right: 0; border-bottom: 1px solid #dfe5e8; }
  .products-fact-strip [class*="col-"]:nth-child(-n+2) .fact-box { border-bottom: 1px solid #dfe5e8; }
  .products-fact-strip [class*="col-"]:last-child .fact-box { border-bottom: 0; }
}

@media (max-width: 1199.98px) {
  .services-process-strip .process-flow { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .services-process-strip .process-step:nth-child(4n) { border-right: 0; }
  .services-process-strip .process-step:nth-child(-n+4) { border-bottom: 1px solid #dfe5e8; }
}

@media (max-width: 575.98px) {
  .services-process-strip { margin-top: -28px; background: linear-gradient(180deg, transparent 0 28px, #f3f6f8 28px 100%); }
  .services-process-strip > .container { border-radius: 12px; }
  .services-process-strip .process-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .services-process-strip .process-step { min-height: 128px; border-bottom: 1px solid #dfe5e8; }
  .services-process-strip .process-step:nth-child(2n) { border-right: 0; }
  .services-process-strip .process-step:nth-last-child(-n+2) { border-bottom: 0; }
}

/* Products keeps its existing overview copy on the banner and places only its facts in the overlapping strip. */
.products-showcase .showcase-panel {
  margin-top: 0 !important;
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.products-showcase .showcase-panel > .row { display: block; }

.products-showcase .showcase-panel > .row > .col-lg-6:first-child {
  width: min(720px, 66%);
  padding: 0;
  border: 0;
  color: #fff;
}

.products-showcase .section-eyebrow,
.products-showcase .section-title,
.products-showcase .showcase-panel > .row > .col-lg-6:first-child p { color: #fff; }
.products-showcase .section-title { color: #fff !important; }
.products-showcase .section-title { font-size: clamp(1.8rem, 3vw, 2.8rem); }

.products-showcase .showcase-panel > .row > .col-lg-6:last-child {
  width: 100%;
  margin-top: clamp(3rem, 6vw, 5rem);
  overflow: hidden;
  border: 1px solid #e0e5e8;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 45px rgba(17, 39, 53, .14);
}

.products-showcase .showcase-panel > .row > .col-lg-6:last-child .col-sm-6 { width: 25%; }
.products-showcase .showcase-panel > .row > .col-lg-6:last-child .row > .col-sm-6:nth-child(odd) .fact-box { background: #fff7f7; }
.products-showcase .showcase-panel > .row > .col-lg-6:last-child .row > .col-sm-6:nth-child(even) .fact-box { background: #fffaf0; }

/* Contact information follows the same banner/overlap pattern inside its existing page column. */
.contact-showcase {
  isolation: isolate;
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.contact-showcase::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 auto;
  height: 210px;
  border-radius: 12px 12px 0 0;
  background:
    linear-gradient(90deg, rgba(48,4,8,.95), rgba(115,16,22,.68), rgba(17,32,43,.2)),
    url('../images/ttsl/banners/Contact-Us.png') center/cover;
}

.contact-showcase > .section-eyebrow,
.contact-showcase > .h4,
.contact-showcase > .title-bar { margin-left: clamp(1.25rem, 3vw, 2rem); margin-right: clamp(1.25rem, 3vw, 2rem); }
.contact-showcase > .section-eyebrow { padding-top: 2rem; color: #fff; }
.contact-showcase > .h4 { color: #fff; }
.contact-showcase > .mt-3 {
  margin-top: 4.75rem !important;
  padding: .75rem;
  overflow: hidden;
  border: 1px solid #e0e5e8;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 16px 40px rgba(17,39,53,.14);
}

.contact-page .contact-showcase .contact-info-item {
  margin: 0;
  padding: .85rem;
  border: 0;
  border-bottom: 1px solid #e1e6e9;
  border-radius: 0;
}
.contact-page .contact-showcase .contact-info-item:last-child { border-bottom: 0; }
.contact-page .contact-showcase .contact-info-item:nth-child(odd) { background: #fff7f7; }
.contact-page .contact-showcase .contact-info-item:nth-child(even) { background: #fffaf0; }

@media (max-width: 1199.98px) {
  .section-showcase .process-flow { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .section-showcase .process-step:nth-of-type(4) { border-right: 0; }
}

@media (max-width: 991.98px) {
  .section-showcase .showcase-panel [class*="col-"]:nth-child(2n) { border-right: 0; }
  .products-showcase .showcase-panel > .row > .col-lg-6:first-child { width: 100%; }
  .products-showcase .showcase-panel > .row > .col-lg-6:last-child .col-sm-6 { width: 50%; }
}

@media (max-width: 575.98px) {
  .section-showcase { padding-top: 2.75rem; padding-bottom: 3rem; }
  .section-showcase::before { height: 330px; }
  .section-showcase::after { inset-block-start: 330px; }
  .section-showcase .showcase-panel { margin-top: 7rem !important; border-radius: 14px; }
  .section-showcase .process-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .section-showcase .process-step:nth-of-type(2n) { border-right: 0; }
  .products-showcase .showcase-panel { margin-top: 0 !important; }
  .products-showcase .showcase-panel > .row > .col-lg-6:last-child { margin-top: 3rem; border-radius: 14px; }
  .products-showcase .showcase-panel > .row > .col-lg-6:last-child .col-sm-6 { width: 100%; border-right: 0; }
  .products-showcase .fact-box { min-height: 100px; }
  .contact-showcase > .mt-3 { margin-top: 4rem !important; }
}

/* Unified About-style banner fact strips */
.services-process-strip,
.products-fact-strip,
.careers-fact-strip,
.careers-page main > .careers-fact-strip,
.contact-info-strip {
  padding-bottom: 1rem !important;
  background: linear-gradient(180deg, transparent 0 44px, #fff 44px 100%) !important;
}

.services-process-strip .process-step.odd,
.products-fact-strip .fact-box.odd,
.careers-page .careers-fact-strip .fact-box.odd,
.contact-page .contact-info-strip .contact-info-item.odd {
  background: #fbefef !important;
}

.services-process-strip .process-step.even,
.products-fact-strip .fact-box.even,
.careers-page .careers-fact-strip .fact-box.even,
.contact-page .contact-info-strip .contact-info-item.even {
  background: #fff8e5 !important;
}

.services-process-strip .process-step.odd:hover,
.products-fact-strip .fact-box.odd:hover,
.careers-page .careers-fact-strip .fact-box.odd:hover,
.contact-page .contact-info-strip .contact-info-item.odd:hover {
  background: #f7e2e3 !important;
}

.services-process-strip .process-step.even:hover,
.products-fact-strip .fact-box.even:hover,
.careers-page .careers-fact-strip .fact-box.even:hover,
.contact-page .contact-info-strip .contact-info-item.even:hover {
  background: #fff2c9 !important;
}

.services-process-strip > .container,
.products-fact-strip > .container,
.careers-fact-strip > .container,
.contact-info-strip > .container {
  border-color: #e6eaed;
  border-radius: 16px;
  box-shadow: 0 16px 36px rgba(18, 37, 53, .10);
}

.products-fact-strip .fact-box,
.careers-page .careers-fact-strip .fact-box {
  min-height: 126px;
}

@media (max-width: 575.98px) {
  .services-process-strip,
  .products-fact-strip,
  .careers-fact-strip,
  .careers-page main > .careers-fact-strip,
  .contact-info-strip {
    padding-bottom: .75rem !important;
    background: linear-gradient(180deg, transparent 0 28px, #fff 28px 100%) !important;
  }
}