/* ==========================================================================
   Gulf Pipe Supply & Services — Responsive adjustments
   Loaded after style.css. Bootstrap 5 handles the grid; this file tunes
   custom components at each breakpoint.
   ========================================================================== */

/* Large desktop and up -------------------------------------------------- */
@media (min-width:1400px){
  .gp-hero .carousel-item{height:min(88vh,900px)}
}

/* Below XL — nav collapses to offcanvas ---------------------------------- */
@media (max-width:1199.98px){
  .gp-nav .nav-link{padding:1.35rem .65rem;font-size:.83rem}
  .gp-nav-cta{margin-left:.5rem}
  .gp-nav-cta .btn{padding:.7rem 1.1rem;font-size:.82rem}
}

/* Tablet ---------------------------------------------------------------- */
@media (max-width:991.98px){
  .gp-hero .carousel-item{height:clamp(480px,72vh,640px)}
  .gp-hero-copy{padding-block:4.5rem 7rem}
  .gp-media-frame::after{display:none}
  .gp-float-card{position:static;max-width:none;margin-top:1.25rem;right:auto;bottom:auto}
  .gp-stat{border-right:0;border-bottom:1px solid rgba(255,255,255,.16);padding:1.6rem 1rem}
  .gp-stat:last-child{border-bottom:0}
  .gp-media-frame img,.gp-media-frame--tall img{aspect-ratio:16/10}
}

/* Mobile ---------------------------------------------------------------- */
@media (max-width:767.98px){
  body{font-size:.98rem}
  .gp-section{padding:3rem 0}
  .gp-topbar{font-size:.74rem}
  .gp-topbar-list{gap:.25rem 1rem;justify-content:center}
  .gp-hero .carousel-item{height:auto;min-height:76vh}
  .gp-hero-copy{padding-block:4rem 8rem}
  .gp-hero-copy h1{font-size:clamp(1.9rem,8vw,2.5rem)}
  .gp-hero-copy p{font-size:1rem}
  .gp-hero-actions .btn{flex:1 1 100%;text-align:center}
  .gp-hero .carousel-indicators{bottom:1.35rem;padding-inline:1.5rem}
  .gp-hero .carousel-indicators [data-bs-target]{width:34px}
  .gp-hero .carousel-control-prev,.gp-hero .carousel-control-next{display:none}
  .gp-banner-inner{padding:3rem 0 1.5rem}
  .gp-breadcrumb .breadcrumb{font-size:.76rem}
  .gp-process li{padding-left:3.1rem}
  .gp-process li::before{width:38px;height:38px;font-size:.8rem}
  .gp-process li::after{left:19px;top:38px}
  .gp-reg-num{font-size:1.25rem}
  .gp-lightbox{padding:1rem}
  .gp-lightbox img{max-height:62vh}
  .gp-lb-prev{left:.35rem}
  .gp-lb-next{right:.35rem}
  .gp-lb-btn{width:44px;height:44px;font-size:1.2rem}
  .gp-footer-bottom{text-align:center}
}

/* Small mobile ---------------------------------------------------------- */
@media (max-width:399.98px){
  .gp-brand img{width:44px;height:44px}
  .gp-brand-name{font-size:.9rem}
  .gp-brand-sub{font-size:.6rem;letter-spacing:.12em}
  .gp-card-body{padding:1.25rem 1.15rem 1.4rem}
}

/* Tables become stacked on small screens -------------------------------- */
@media (max-width:767.98px){
  .gp-table-responsive thead{display:none}
  .gp-table-responsive tr{display:block;border:1px solid var(--gp-line);margin-bottom:1rem;padding:.5rem 0}
  .gp-table-responsive td{display:flex;justify-content:space-between;gap:1rem;border:0;padding:.55rem 1rem}
  .gp-table-responsive td::before{
    content:attr(data-label);font-weight:800;font-size:.72rem;letter-spacing:.1em;
    text-transform:uppercase;color:var(--gp-steel);flex:0 0 40%;
  }
}

/* Print ----------------------------------------------------------------- */
@media print{
  .gp-header,.gp-footer,.gp-cta,.gp-hero .carousel-control-prev,
  .gp-hero .carousel-control-next,.gp-hero .carousel-indicators{display:none!important}
  body{color:#000}
  a{color:#000;text-decoration:underline}
}