/* =========================
   INDUSTRIES PREMIUM
========================= */

.industries-section{
  position:relative;
  padding:90px 24px 120px;
  background:
  radial-gradient(circle at top right,
  rgba(0,168,168,0.08),
  transparent 30%),
  #f7fbfc;
  overflow:hidden;
}

.industries-container{
  max-width:1280px;
  margin:auto;
}

.industries-header{
  max-width:850px;
  margin:0 auto 70px;
  text-align:center;
}

.industries-header h2{
  font-size:clamp(44px,6vw,88px);
  line-height:0.95;
  letter-spacing:-0.06em;
  font-weight:950;
  color:#07142b;
  margin:0 0 28px;
}

.industries-header p{
  font-size:20px;
  line-height:1.8;
  color:#5c667d;
}

.industries-layout{
  display:grid;
  grid-template-columns:1.35fr 0.9fr;
  gap:26px;
}

.industry-stack{
  display:grid;
  gap:26px;
}

.industry-card{
  position:relative;
  overflow:hidden;
  border-radius:34px;
  text-decoration:none;
  isolation:isolate;
  display:flex;
  align-items:flex-end;
  transition:0.45s ease;
  background:#071321;
}

.industry-card:hover{
  transform:translateY(-10px);
}

.big-card{
  min-height:760px;
  padding:50px;
}

.small-card{
  min-height:367px;
  padding:40px;
}

.industry-card::before{
  content:"";
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  transition:0.8s ease;
  z-index:1;
}

.industry-card:hover::before{
  transform:scale(1.08);
}

.medical-card::before{
  background-image:url("https://staffwear.ma/wp-content/uploads/2026/04/BLOUSES.jpg");
}

.spa-card::before{
  background-image:url("https://staffwear.ma/wp-content/uploads/2026/04/BLOUSES.jpg");
}

.resto-card::before{
  background-image:url("https://staffwear.ma/wp-content/uploads/2026/04/BLOUSES.jpg");
}

.industry-overlay{
  position:absolute;
  inset:0;
  background:
  linear-gradient(
  180deg,
  rgba(7,19,33,0.08) 0%,
  rgba(7,19,33,0.88) 100%);
  z-index:2;
}

.industry-content{
  position:relative;
  z-index:3;
}

.industry-tag{
  display:inline-flex;
  margin-bottom:22px;
  padding:12px 18px;
  border-radius:999px;
  background:rgba(255,255,255,0.12);
  backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,0.12);
  color:white;
  font-size:12px;
  font-weight:900;
  letter-spacing:0.12em;
}

.industry-content h3{
  color:white;
  font-size:clamp(34px,3vw,58px);
  line-height:0.96;
  letter-spacing:-0.05em;
  font-weight:950;
  margin:0 0 18px;
}

.small-card h3{
  font-size:42px;
}

.industry-content p{
  color:rgba(255,255,255,0.84);
  font-size:18px;
  line-height:1.8;
  max-width:620px;
}

.industries-bottom{
  margin-top:32px;
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}

.mini-industry{
  padding:16px 22px;
  border-radius:999px;
  background:white;
  border:1px solid rgba(7,19,33,0.06);
  text-decoration:none;
  color:#0a1730;
  font-weight:800;
  transition:0.3s ease;
  box-shadow:0 8px 30px rgba(10,26,47,0.04);
}

.mini-industry:hover{
  background:#0d9488;
  color:white;
  transform:translateY(-3px);
}

/* MOBILE */

@media(max-width:980px){

  .industries-section{
    padding:90px 18px;
  }

  .industries-header{
    text-align:left;
    margin-bottom:42px;
  }

  .industries-header h2{
    font-size:52px;
  }

  .industries-header p{
    font-size:17px;
  }

  .industries-layout{
    grid-template-columns:1fr;
  }

  .big-card{
    min-height:520px;
    padding:30px;
  }

  .small-card{
    min-height:260px;
    padding:28px;
  }

  .industry-content h3{
    font-size:42px;
  }

  .small-card h3{
    font-size:34px;
  }

  .industry-content p{
    font-size:16px;
  }

  .industries-bottom{
    gap:10px;
  }

  .mini-industry{
    font-size:14px;
    padding:14px 18px;
  }

}