/* Power Auto Racing mobile-only layout correction. Desktop CSS untouched. */
@media screen and (max-width: 767px) {
  /* 'hidden' on html/body creates a sideways scrolling box and can break a sticky header. */
  html, body { width:100%; max-width:100%; overflow-x:clip !important; }
  body { margin:0; }
  main, footer { max-width:100%; overflow-x:clip; }
  main *, footer * { box-sizing:border-box; }
  main .container, main .container-fluid, main .row, main [class*="col-"] { min-width:0; }
  main img, main video, main iframe { max-width:100%; height:auto; }
  main h1, main h2, main h3, main h4, main p { overflow-wrap:break-word; }
  /* Shared 16:9 photos: use a landscape hero rather than a tall square crop. */
  .slider-area, .slider-area .slider-active, .slider-area .slick-list,
  .slider-area .slick-track { max-width:100%; }
  .slider-area .single-slider.slider-height,
  .slider-area .single-slider.slider-height2 {
    width:100% !important; max-width:100% !important;
    min-height:0 !important; height:auto !important;
    aspect-ratio: 16 / 10 !important;
    background-size:cover !important;
    background-position:center center !important;
    background-repeat:no-repeat !important;
    overflow:hidden;
    display:flex !important;
    align-items:flex-end !important;
    padding:108px 0 18px !important;
  }
  .slider-area .single-slider > .container { width:100%; max-width:100%; min-width:0; }
  .slider-area .hero-cap { padding-top:0 !important; margin:0 !important; }
  .slider-area .hero-cap h1 { font-size:clamp(25px, 8vw, 36px) !important; line-height:1.1 !important; margin-bottom:8px !important; }
  .slider-area .hero-cap .breadcrumb { margin-bottom:0 !important; flex-wrap:wrap; }
  .slider-area .hero-cap .breadcrumb-item { font-size:clamp(13px, 4vw, 18px) !important; }
  /* Homepage: retain both the animated slogan and CONTROL, without offscreen text. */
  .slider-area .hero__caption { width:100% !important; max-width:100% !important; min-width:0; padding:0 !important; margin:0 !important; }
  .slider-area .hero__caption h1 {
    display:block; width:100% !important; max-width:100% !important;
    font-size:clamp(22px, 6.2vw, 31px) !important;
    line-height:1.13 !important; white-space:normal !important;
    overflow-wrap:normal !important; word-break:normal !important;
    margin:0 0 8px !important;
  }
  .slider-area .hero__caption .stock-text {
    position:relative !important; width:100% !important; max-width:100% !important;
    height:clamp(37px, 11vw, 50px) !important;
    top:auto !important; left:auto !important; margin:0 !important;
  }
  .slider-area .hero__caption .stock-text h2 {
    font-size:clamp(37px, 10.5vw, 49px) !important;
    line-height:1 !important; left:0 !important; top:0 !important;
    white-space:nowrap !important; max-width:100%;
  }
  .slider-area .hero__caption .hero-text2 { margin-top:0 !important; }
  /* Do not allow wide decorative typography or cards to enlarge the viewport. */
  .support-company-area, .support-company-area .support-wrapper,
  .services-area1, .services-area1 .single-service-cap { max-width:100%; }
  .support-company-area .support-wrapper { overflow-x:clip; }
  .support-company-area .left-content { width:100% !important; max-width:100% !important; min-width:0 !important; }
  .support-company-area .section-tittle, .support-company-area .front-text { max-width:100%; min-width:0; }
  .support-company-area .stock-text { max-width:100%; overflow:hidden; }
  /* Header remains fixed once the existing scroll handler adds .sticky. */
  .header-area .header-sticky.sticky-bar.sticky {
    position:fixed !important; top:0 !important; left:0 !important;
    right:0 !important; width:100% !important; max-width:100% !important;
    z-index:9999 !important;
  }
  .header-area .header-bottom, .header-area .header-bottom .container-fluid { max-width:100%; }
}