/* ==========================================================================
   Projects (listing + detail) — Page-specific styles
   Loaded after style.css; responsive.css loads last and wins overrides.
   Reuses .project-card / .project-status / .projects-track from style.css
   for the listing grid — only new patterns are defined here.
   ========================================================================== */

/* ---------- Projects Hero ---------- */
.projects-hero{
  position:relative;min-height:40vh;display:flex;align-items:flex-end;
  overflow:hidden;background:var(--navy-950);padding-top:var(--header-h);
}
.projects-hero-media{position:absolute;inset:0;z-index:0;}
.projects-hero-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.05);}
.projects-hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(5,10,19,.6) 0%,rgba(5,10,19,.78) 55%,rgba(5,10,19,.96) 100%);
}
.projects-hero-content{position:relative;z-index:2;padding:52px 0 44px;}
.projects-hero-title{font-size:clamp(30px,4.4vw,50px);color:var(--paper-0);max-width:720px;margin:14px 0 12px;}
.projects-hero-sub{font-size:15.5px;color:rgba(255,255,255,.78);max-width:560px;line-height:1.7;}

/* ---------- Listing toolbar ---------- */
.projects-toolbar{padding:44px 0 10px;background:var(--paper-0);}
.projects-toolbar-row{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;}
.projects-sort-note{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--grey-500);}
.projects-sort-note i{color:var(--gold-500);}

.projects-listing{padding:20px 0 110px;background:var(--paper-0);}
.project-card.hidden-card{display:none;}
.project-date-chip{
  display:flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;color:var(--grey-500);
  margin-bottom:10px;
}
.project-date-chip i{color:var(--gold-500);}
.projects-empty{text-align:center;padding:60px 20px;color:var(--grey-500);display:none;}
.projects-empty.visible{display:block;}

/* ==========================================================================
   PROJECT DETAILS PAGE
   ========================================================================== */
.project-hero{
  position:relative;min-height:56vh;display:flex;align-items:flex-end;
  overflow:hidden;background:var(--navy-950);padding-top:var(--header-h);
}
.project-hero-media{position:absolute;inset:0;z-index:0;}
.project-hero-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.05);}
.project-hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(5,10,19,.5) 0%,rgba(5,10,19,.75) 60%,rgba(5,10,19,.97) 100%);
}
.project-hero-content{position:relative;z-index:2;padding:52px 0 46px;}
.project-hero-badges{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px;}
.project-hero-badges .job-badge{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);color:var(--paper-0);}
.project-hero-badges .job-badge i{color:var(--gold-400);}
.project-hero-title{font-size:clamp(28px,4.4vw,46px);color:var(--paper-0);max-width:840px;margin:16px 0 0;line-height:1.25;}

/* ---------- Quick spec bar ---------- */
.project-spec-bar{background:var(--gold-500);padding:26px 0;}
.project-spec-row{display:flex;flex-wrap:wrap;gap:0;}
.project-spec-item{flex:1;min-width:150px;padding:0 24px;border-left:1px solid rgba(255,255,255,.25);}
.project-spec-item:first-child{border-left:none;padding-left:0;}
.project-spec-item span{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:rgba(255,255,255,.8);margin-bottom:6px;}
.project-spec-item strong{display:block;font-size:15px;color:var(--paper-0);}

/* ---------- Body + sidebar ---------- */
.project-section{padding:80px 0 120px;background:var(--paper-0);}
.project-grid{display:grid;grid-template-columns:1fr 340px;gap:64px;align-items:start;}

.project-body h2{font-size:22px;color:var(--navy-900);margin:0 0 16px;}
.project-body > p{font-size:16.5px;color:var(--navy-800);line-height:1.85;margin-bottom:20px;}
.project-scope{margin:8px 0 44px;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px 20px;}
.project-scope li{display:flex;gap:10px;font-size:14.5px;color:var(--navy-800);line-height:1.6;}
.project-scope li i{color:var(--gold-500);font-size:12px;margin-top:5px;flex-shrink:0;}

.project-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:44px;}
.project-gallery-item{border-radius:var(--radius-md);overflow:hidden;cursor:zoom-in;position:relative;height:200px;}
.project-gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease);}
.project-gallery-item:hover img{transform:scale(1.08);}
.project-gallery-item::after{
  content:"\f00e";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:20px;opacity:0;
  background:rgba(10,18,32,.35);transition:opacity .3s var(--ease);
}
.project-gallery-item:hover::after{opacity:1;}

.project-map-card{border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line-100);box-shadow:var(--shadow-sm);margin-bottom:12px;}
.project-map-card iframe{width:100%;height:340px;display:block;border:0;filter:grayscale(.15) contrast(1.05);}
.project-map-link{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;color:var(--navy-900);margin-bottom:44px;}
.project-map-link i{font-size:12px;color:var(--gold-500);}

/* ---------- Sidebar ---------- */
.project-sidebar{position:sticky;top:calc(var(--header-h) + 24px);display:flex;flex-direction:column;gap:24px;}
.sidebar-card{background:var(--paper-50);border:1px solid var(--line-100);border-radius:var(--radius-lg);padding:26px;}
.sidebar-card h4{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--gold-500);margin-bottom:16px;}
.project-specs-card h4{margin-bottom:18px;}
.project-specs-list{display:flex;flex-direction:column;gap:16px;}
.project-specs-list li{display:flex;justify-content:space-between;gap:12px;font-size:13.5px;border-bottom:1px solid var(--line-100);padding-bottom:14px;}
.project-specs-list li:last-child{border-bottom:none;padding-bottom:0;}
.project-specs-list span{color:var(--grey-500);}
.project-specs-list strong{color:var(--navy-900);text-align:right;}

.project-pdf-card{background:var(--navy-950);border:none;}
.project-pdf-card h4{color:var(--gold-400);}
.project-pdf-inner{display:flex;gap:14px;align-items:flex-start;margin-bottom:18px;}
.project-pdf-icon{
  width:46px;height:46px;border-radius:12px;background:rgba(255,255,255,.08);color:var(--gold-400);
  display:flex;align-items:center;justify-content:center;font-size:19px;flex-shrink:0;
}
.project-pdf-inner strong{display:block;color:var(--paper-0);font-size:14.5px;line-height:1.4;margin-bottom:4px;}
.project-pdf-inner span{font-size:12px;color:rgba(255,255,255,.55);}
.project-pdf-btn{width:100%;justify-content:center;}

.related-projects-list{display:flex;flex-direction:column;gap:16px;}
.related-project-item{display:flex;gap:12px;align-items:flex-start;}
.related-project-item img{width:64px;height:64px;border-radius:10px;object-fit:cover;flex-shrink:0;}
.related-project-item h5{font-size:13.5px;color:var(--navy-900);line-height:1.4;margin-bottom:4px;}
.related-project-item span{font-size:11.5px;color:var(--grey-500);}