/* ============================================================
   ALDACO BV — css/pages/projects.css
   ============================================================ */
.projects-hero{background:var(--black);padding:calc(var(--nav-h) + 80px) 0 100px;position:relative;overflow:hidden}
.projects-hero::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(184,147,90,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(184,147,90,0.05) 1px,transparent 1px);background-size:80px 80px}
.projects-hero-inner{position:relative;z-index:1;max-width:760px}
.projects-hero h1{font-size:clamp(2.8rem,6vw,5rem);color:var(--warm-off-white);font-weight:300;line-height:1.1;margin-bottom:24px}
.projects-hero h1 em{font-style:italic;color:var(--gold-light)}
.projects-hero p{font-size:1.1rem;color:rgba(246,242,234,0.65);max-width:520px;line-height:1.75}

.projects-intro{background:var(--warm-off-white);padding:110px 0 60px;position:relative}
.projects-intro-inner{display:grid;grid-template-columns:5fr 7fr;gap:80px;align-items:center}
.projects-intro h2{font-size:clamp(2rem,3.5vw,3rem);color:var(--black);font-weight:300}
.projects-intro p{font-size:1rem;color:var(--text-muted);line-height:1.8;margin-bottom:16px}

.projects-grid-section{background:var(--warm-off-white);padding:0 0 90px}
.projects-filter{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:48px}
.filter-btn{padding:9px 20px;border-radius:2px;border:1px solid var(--border);background:transparent;font-family:var(--font-body);font-size:0.76rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-muted);cursor:pointer;transition:all 0.2s}
.filter-btn:hover,.filter-btn.active{background:var(--gold);border-color:var(--gold);color:var(--white)}
.proj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.proj-card{position:relative;cursor:pointer;overflow:hidden;border-radius:2px}
.proj-card-visual{width:100%;padding-bottom:75%;background:linear-gradient(135deg,var(--charcoal) 0%,#3d3a2a 100%);position:relative;overflow:hidden;transition:transform 0.6s var(--ease)}
.proj-card-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.proj-card:hover .proj-card-visual{transform:scale(1.03)}
.proj-card-visual::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(25,24,15,0.8) 0%,rgba(25,24,15,0) 60%)}
.proj-card-body{position:absolute;bottom:0;left:0;right:0;padding:28px 24px;z-index:2}
.proj-card-cat{font-size:0.65rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold-light);margin-bottom:6px}
.proj-card-title{font-family:var(--font-display);font-size:1.3rem;color:var(--warm-off-white);font-weight:400}
.proj-card-meta{font-size:0.78rem;color:rgba(246,242,234,0.55);margin-top:4px}
.proj-card.large{grid-column:span 2}
.proj-card.large .proj-card-visual{padding-bottom:50%}

.commitment{background:var(--charcoal);padding:110px 0;position:relative}
.commitment-inner{text-align:center;max-width:680px;margin:0 auto}
.commitment h2{font-size:clamp(2rem,4vw,3.2rem);color:var(--warm-off-white);font-weight:300;line-height:1.3;margin-bottom:20px}
.commitment h2 em{font-style:italic;color:var(--gold-light)}
.commitment-points{display:flex;justify-content:center;gap:40px;margin-top:40px;flex-wrap:wrap}
.cp{font-family:var(--font-display);font-size:1.1rem;font-style:italic;color:rgba(246,242,234,0.6);display:flex;align-items:center;gap:10px}
.cp::before{content:'';width:6px;height:6px;background:var(--gold);border-radius:50%;flex-shrink:0}

.project-types{background:var(--cream);padding:110px 0;position:relative}
.project-types-header{margin-bottom:48px}
.project-types-header h2{font-size:clamp(2rem,3.5vw,2.8rem);color:var(--black);font-weight:300;margin-top:12px}
.type-pills{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.type-pill{padding:14px 28px;border:1px solid var(--border);border-radius:2px;background:var(--white);font-size:0.88rem;color:var(--charcoal);transition:all 0.3s}
.type-pill:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-2px)}

@media(max-width:900px){
  .projects-intro-inner{grid-template-columns:1fr;gap:40px}
  .proj-grid{grid-template-columns:1fr 1fr}
  .proj-card.large{grid-column:span 1}
  .proj-card.large .proj-card-visual{padding-bottom:75%}
}
@media(max-width:640px){
  .projects-hero{padding:calc(var(--nav-h) + 40px) 0 72px}
  .commitment-points{gap:20px}
}
@media(max-width:560px){
  .proj-grid{grid-template-columns:1fr}
  .type-pill{padding:12px 20px;font-size:0.82rem}
}