/* ═══════════════════════════════════════════
   INDUSTRIES — Responsive Grid Layout
   ═══════════════════════════════════════════ */
.ind-header{padding:0 80px}

/* Grid instead of horizontal scroll */
.ind-grid-wrap{padding:0 80px}
.ind-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}

.ind-card{position:relative;border-radius:var(--radius-lg);overflow:hidden;aspect-ratio:4/5;cursor:default;box-shadow:var(--shadow-lg);transition:all .5s var(--ease);border:1px solid var(--border3)}
.ind-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-xl)}
.ind-card img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease),filter .5s;filter:brightness(0.75) saturate(0.85)}
.ind-card:hover img{transform:scale(1.1);filter:brightness(0.4) saturate(0.6)}

.ind-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(17,24,39,0.92) 0%,rgba(17,24,39,0.35) 45%,transparent 100%)}

.ind-content{position:absolute;bottom:0;left:0;right:0;padding:32px;z-index:2}
.ind-name{font-size:20px;font-weight:700;line-height:1.2;transition:color .4s;color:#fff}
.ind-desc{font-size:13px;color:rgba(255,255,255,0.55);line-height:1.7;font-weight:400;margin-top:8px;max-height:0;overflow:hidden;transition:max-height .5s var(--ease),margin-top .5s}
.ind-card:hover .ind-desc{max-height:80px;margin-top:12px}

.ind-line{height:2px;background:var(--gradient);width:0;margin-top:14px;transition:width .5s var(--ease);border-radius:1px}
.ind-card:hover .ind-line{width:100%}

@media(max-width:1024px){
  .ind-header{padding:0 40px}
  .ind-grid-wrap{padding:0 40px}
  .ind-grid{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:768px){
  .ind-header{padding:0 28px}
  .ind-grid-wrap{padding:0 28px}
  .ind-grid{gap:16px}
  .ind-card{aspect-ratio:3/4}
  .ind-content{padding:28px}
  .ind-name{font-size:18px}
}

@media(max-width:640px){
  .ind-header{padding:0 20px}
  .ind-grid-wrap{padding:0 20px}
  .ind-grid{grid-template-columns:1fr 1fr;gap:14px}
  .ind-card{border-radius:18px;aspect-ratio:3/4}
  .ind-card:hover{transform:none}
  .ind-card img,.ind-card:hover img{transform:none;filter:brightness(0.68) saturate(0.85)}
  .ind-content{padding:20px}
  .ind-name{font-size:16px}
  .ind-desc{max-height:none;margin-top:8px;color:rgba(255,255,255,0.72);font-size:12px}
  .ind-line{width:100%}
}

@media(max-width:420px){
  .ind-grid{grid-template-columns:1fr}
  .ind-card{aspect-ratio:3/2}
  .ind-content{padding:22px}
}
