/* ==========================================
   Technology Page — Tablet Styles (768px - 991px)
   ==========================================
   Minimal overrides to bridge mobile and PC
   ========================================== */

@media screen and (min-width: 768px) and (max-width: 991px) {

  /* ----- Hero ----- */
  .tl-hero {
    height: 340px;
    margin-top: 66px;
  }

  .tl-hero-en {
    font-size: 52px;
  }

  .tl-hero-text {
    padding-bottom: 45px;
  }

  /* ----- Intro ----- */
  .tl-intro {
    padding-top: 80px;
    padding-bottom: 80px;
    flex-direction: row;
    gap: 40px;
  }

  .tl-intro-text {
    flex: 0 0 50%;
  }

  .tl-intro-lead {
    font-size: 20px;
  }

  /* ----- Products ----- */
  .tl-products {
    padding-bottom: 80px;
  }

  .tl-product-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }

  .tl-product-wide {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
  }

  .tl-product-wide .tl-product-image {
    height: 100%;
    min-height: 200px;
  }

  .tl-product-body {
    padding: 28px;
  }

  /* ----- Research & Development ----- */
  .tl-research {
    padding: 80px 0;
    margin-bottom: 80px;
  }

  .tl-research-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }

  /* ----- Partners ----- */
  .tl-partners {
    padding-bottom: 80px;
  }
}