/* ═══════════════════════════════════════════════════════════════
   PROJECTS PAGE
   BG #0A0A0A · Card #161616 · Accent #FF8A3D · Border #222
═══════════════════════════════════════════════════════════════ */

/* ── GLOBAL ──────────────────────────────────────────────────── */
html,body { background:#0A0A0A !important; color:#FFFFFF !important; }
.page-wrap::before { display:none !important; }

/* ── NAVBAR ──────────────────────────────────────────────────── */
.projects-page #mainNavbar,
.projects-page #mainNavbar.navbar {
  background:#0D0D0D !important;
  border-bottom:1px solid #222 !important;
  box-shadow:none !important;
}
.projects-page #mainNavbar .brand-text { color:#FFFFFF !important; }
.projects-page #mainNavbar .nav-link { color:#B0B0B0 !important; background:none !important; }
.projects-page #mainNavbar .nav-link::after { background:#FF8A3D !important; }
.projects-page #mainNavbar .nav-link:hover { color:#FF8A3D !important; background:rgba(255,138,61,.07) !important; }
.projects-page #mainNavbar .nav-link.active { color:#FF8A3D !important; background:rgba(255,138,61,.08) !important; }
.projects-page #mainNavbar .navbar-toggler { border-color:#333 !important; filter:invert(1); }

/* ── FOOTER ──────────────────────────────────────────────────── */
.projects-page .site-footer { background:#080808 !important; border-top:1px solid #222 !important; color:#B0B0B0 !important; }
.projects-page .site-footer .fw-bold,
.projects-page .site-footer h6 { color:#fff !important; }
.projects-page .site-footer a { color:#888 !important; }
.projects-page .site-footer a:hover { color:#FF8A3D !important; }
.projects-page .site-footer .text-warning { color:#FF8A3D !important; }
.projects-page .site-footer .foot-small,
.projects-page .site-footer .foot-list li { color:#666 !important; }
.projects-page .site-footer .social a { border-color:#333 !important; background:#111 !important; color:#888 !important; }
.projects-page .site-footer .social a:hover { color:#FF8A3D !important; border-color:#FF8A3D !important; }


/* ══════════════════════════════════════════════════════════════
   HERO TITLE
══════════════════════════════════════════════════════════════ */
.proj-hero {
  padding:6rem 0 4rem;
  background:#0A0A0A;
  position:relative;
}

.proj-hero-kicker {
  display:flex;
  align-items:center;
  gap:.7rem;
  font-size:.72rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.26em;
  color:rgba(255,255,255,.45);
  margin-bottom:1.4rem;
}
.proj-hero-dot {
  width:7px;
  height:7px;
  background:#FF8A3D;
  flex-shrink:0;
  box-shadow:0 0 10px #FF8A3D;
}

.proj-hero-title {
  font-family:'Montserrat',sans-serif;
  font-size:clamp(3.5rem,8vw,7rem);
  font-weight:900;
  color:#FFFFFF;
  line-height:.95;
  letter-spacing:-3px;
  margin:0;
}
.proj-hero-accent { color:#FF8A3D; }

/* Right column */
.proj-hero-right {
  padding-bottom:.5rem;
}
.proj-hero-desc {
  font-size:.95rem;
  color:#888;
  line-height:1.8;
  margin-bottom:1.8rem;
  max-width:320px;
}
.proj-hero-badge {
  display:inline-flex;
  align-items:baseline;
  gap:.6rem;
  border-left:3px solid #FF8A3D;
  padding-left:1rem;
}
.proj-hero-badge-num {
  font-family:'Montserrat',sans-serif;
  font-size:2rem;
  font-weight:900;
  color:#FF8A3D;
  line-height:1;
}
.proj-hero-badge-label {
  font-size:.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:rgba(255,255,255,.45);
}

/* Bottom border line */
.proj-hero-border {
  height:1px;
  background:linear-gradient(90deg, #FF8A3D 0%, rgba(255,138,61,.3) 40%, transparent 100%);
  margin-top:4rem;
}

@media(max-width:991.98px){
  .proj-hero { padding:4rem 0 3rem; }
  .proj-hero-title { font-size:clamp(2.8rem,10vw,5rem); letter-spacing:-2px; }
  .proj-hero-right { padding-top:2rem; }
  .proj-hero-desc { max-width:100%; }
}


/* ══════════════════════════════════════════════════════════════
   FEATURED GRID — 12-COLUMN ASYMMETRIC
══════════════════════════════════════════════════════════════ */
.proj-featured { padding:60px 0 0; }

.proj-feat-grid {
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  grid-template-rows:520px 440px;
  gap:20px;
}

/* Column mapping as specified */
.pf-big-left  { grid-column:1/8;  grid-row:1; }
.pf-sm-right  { grid-column:8/13; grid-row:1; }
.pf-text-card { grid-column:1/6;  grid-row:2; }
.pf-big-right { grid-column:6/13; grid-row:2; }

/* ── Base image card ── */
.proj-feat-item {
  position:relative;
  overflow:hidden;
  background:#161616;
}
.proj-feat-item img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .8s cubic-bezier(.25,.46,.45,.94);
}
.proj-feat-item:hover img { transform:scale(1.05); }

/* ── Gradient overlay ── */
.pf-overlay {
  position:absolute;
  inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.93) 0%, rgba(0,0,0,.5) 40%, rgba(0,0,0,.1) 100%);
  z-index:1;
}
.pf-overlay--sm {
  background:linear-gradient(to top, rgba(0,0,0,.8) 0%, rgba(0,0,0,.2) 60%, transparent 100%);
}

/* ── Body text ── */
.pf-body {
  position:absolute;
  bottom:0; left:0; right:0;
  z-index:2;
  padding:2.5rem;
}
.pf-body--br { padding:2rem; }

/* ── Tags ── */
.pf-tags {
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  margin-bottom:1.1rem;
}
.pf-tag {
  font-size:.68rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.1em;
  padding:.3rem .75rem;
  background:rgba(255,255,255,.1);
  color:rgba(255,255,255,.7);
  backdrop-filter:blur(4px);
  border:1px solid rgba(255,255,255,.12);
}
.pf-tag--loc { background:rgba(255,138,61,.15); border-color:rgba(255,138,61,.3); color:#FF8A3D; }

/* ── Titles ── */
.pf-title {
  font-family:'Montserrat',sans-serif;
  font-size:clamp(1.6rem,2.8vw,2.4rem);
  font-weight:900;
  color:#fff;
  margin:0 0 .8rem;
  line-height:1.05;
  letter-spacing:-.5px;
}
.pf-title--md { font-size:clamp(1.2rem,2vw,1.8rem); }

.pf-desc {
  font-size:.88rem;
  color:rgba(255,255,255,.65);
  line-height:1.75;
  margin:0;
  max-width:500px;
}

/* ── Number badge (top-right corner) ── */
.pf-num-badge {
  position:absolute;
  top:1.5rem;
  left:1.5rem;
  z-index:3;
  font-family:'Montserrat',sans-serif;
  font-size:3.5rem;
  font-weight:900;
  color:rgba(255,255,255,.08);
  line-height:1;
  letter-spacing:-.1em;
  pointer-events:none;
}
.pf-num-badge--right { left:auto; right:1.5rem; }

/* ── Small image label ── */
.pf-sm-label {
  position:absolute;
  bottom:1.5rem;
  right:1.5rem;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:.15rem;
}
.pf-sm-label span {
  font-size:.7rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:rgba(255,255,255,.5);
  line-height:1.2;
}

/* ── Text card (C) ── */
.pf-text-card { background:#0D0D0D; border:1px solid #222; overflow:visible; }
.pf-text-inner {
  height:100%;
  padding:3rem 2.5rem;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.pf-text-num {
  font-family:'Montserrat',sans-serif;
  font-size:4rem;
  font-weight:900;
  color:rgba(255,138,61,.12);
  line-height:1;
  margin-bottom:.5rem;
  letter-spacing:-.1em;
}
.pf-text-title {
  font-family:'Montserrat',sans-serif;
  font-size:clamp(1.2rem,2vw,1.7rem);
  font-weight:900;
  color:#FFFFFF;
  line-height:1.1;
  margin:0 0 1.2rem;
  letter-spacing:-.3px;
}
.pf-text-desc {
  font-size:.875rem;
  color:#888;
  line-height:1.8;
  margin:0 0 1.5rem;
}
.pf-caption { display:flex; gap:.9rem; align-items:flex-start; }
.pf-caption-bar {
  flex-shrink:0;
  width:3px;
  height:100%;
  min-height:2.5rem;
  background:#FF8A3D;
  margin-top:.15rem;
}
.pf-caption-text {
  font-size:.78rem;
  color:#555;
  line-height:1.65;
  margin:0;
  font-style:italic;
}

/* Hover border for text card */
.pf-text-card:hover { border-color:#333; }

/* ── Responsive ── */
@media(max-width:991.98px){
  .proj-feat-grid {
    grid-template-columns:1fr 1fr;
    grid-template-rows:340px 280px 360px;
    gap:16px;
  }
  .pf-big-left  { grid-column:1/3; grid-row:1; }
  .pf-sm-right  { grid-column:1;   grid-row:2; }
  .pf-text-card { grid-column:2;   grid-row:2; }
  .pf-big-right { grid-column:1/3; grid-row:3; }
}
@media(max-width:575.98px){
  .proj-feat-grid {
    grid-template-columns:1fr;
    grid-template-rows:300px 220px 300px 320px;
    gap:12px;
  }
  .pf-big-left,.pf-sm-right,.pf-text-card,.pf-big-right { grid-column:1; grid-row:auto; }
}


/* ══════════════════════════════════════════════════════════════
   MINI PROJECT GRID
══════════════════════════════════════════════════════════════ */
.proj-mini-section { padding:80px 0 60px; }

.proj-mini-header { text-align:center; margin-bottom:0; }
.proj-mini-kicker {
  font-size:.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.28em;
  color:#FF8A3D;
  margin-bottom:.5rem;
}
.proj-mini-title {
  font-family:'Montserrat',sans-serif;
  font-size:clamp(1.6rem,2.5vw,2.2rem);
  font-weight:900;
  color:#FFFFFF;
  margin:0;
}

/* Grid border */
.proj-mini-grid { border:1px solid #222; }

.proj-mini-card {
  border-right:1px solid #222;
  height:100%;
  transition:background .3s;
}
.col-md-4:last-child .proj-mini-card { border-right:none; }
.proj-mini-card:hover { background:#0D0D0D; }

.proj-mini-img-wrap {
  position:relative;
  height:220px;
  overflow:hidden;
}
.proj-mini-img-wrap img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .7s cubic-bezier(.25,.46,.45,.94);
}
.proj-mini-card:hover .proj-mini-img-wrap img { transform:scale(1.06); }

.proj-mini-img-overlay {
  position:absolute;
  inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.6) 0%, transparent 60%);
}

.proj-mini-body {
  padding:1.8rem;
  border-top:1px solid #1E1E1E;
}
.proj-mini-num {
  display:block;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.22em;
  color:#FF8A3D;
  text-transform:uppercase;
  margin-bottom:.5rem;
}
.proj-mini-name {
  font-family:'Montserrat',sans-serif;
  font-size:.95rem;
  font-weight:800;
  color:#FFFFFF;
  text-transform:uppercase;
  letter-spacing:.04em;
  margin:0 0 .6rem;
}
.proj-mini-desc {
  font-size:.83rem;
  color:#666;
  line-height:1.75;
  margin:0;
}

@media(max-width:767.98px){
  .proj-mini-card { border-right:none; border-bottom:1px solid #222; }
  .col-md-4:last-child .proj-mini-card { border-bottom:none; }
}


/* ══════════════════════════════════════════════════════════════
   STATS BAR
══════════════════════════════════════════════════════════════ */
.proj-stats-section {
  background:#000;
  border-top:1px solid #1A1A1A;
  border-bottom:1px solid #1A1A1A;
}
.proj-stats-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:#1A1A1A;
}
.proj-stat-item {
  background:#000;
  padding:3.5rem 2rem;
  text-align:center;
  transition:background .3s;
}
.proj-stat-item:hover { background:#080808; }
.proj-stat-num {
  font-family:'Montserrat',sans-serif;
  font-size:clamp(2.4rem,5vw,3.5rem);
  font-weight:900;
  color:#fff;
  line-height:1;
  margin-bottom:.55rem;
  letter-spacing:-.5px;
  transition:color .3s;
}
.proj-stat-item:hover .proj-stat-num { color:#FF8A3D; }
.proj-stat-label {
  font-size:.8rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:rgba(255,255,255,.4);
}
.proj-stat-item--accent { background:#FF8A3D !important; }
.proj-stat-item--accent .proj-stat-num { color:#0A0A0A !important; }
.proj-stat-item--accent .proj-stat-label { color:rgba(0,0,0,.55) !important; }
.proj-stat-item--accent:hover { background:#ff7920 !important; }

@media(max-width:575.98px){
  .proj-stats-grid { grid-template-columns:1fr; }
  .proj-stat-item { padding:2.2rem 1.5rem; }
}


/* ══════════════════════════════════════════════════════════════
   CTA STRIP
══════════════════════════════════════════════════════════════ */
.proj-cta-section {
  background:#0D0D0D;
  border-top:1px solid #1A1A1A;
}
.proj-cta-topline {
  height:3px;
  background:linear-gradient(90deg, transparent, #FF8A3D 30%, #FF8A3D 70%, transparent);
}
.proj-cta-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2.5rem;
  padding:4rem 0;
  flex-wrap:wrap;
}
.proj-cta-heading {
  font-family:'Montserrat',sans-serif;
  font-size:clamp(1.4rem,2.8vw,2.2rem);
  font-weight:900;
  color:#FFFFFF;
  margin:0 0 .5rem;
  letter-spacing:.04em;
  line-height:1.2;
}
.proj-cta-sub { font-size:.9rem; color:#555; margin:0; }
.proj-cta-btn {
  display:inline-flex;
  align-items:center;
  flex-shrink:0;
  padding:.9rem 2.2rem;
  font-size:.85rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.1em;
  background:#FF8A3D;
  color:#0A0A0A;
  text-decoration:none;
  transition:background .2s, transform .2s;
  border:none;
}
.proj-cta-btn:hover { background:#ff7920; transform:translateY(-2px); color:#0A0A0A; }

@media(max-width:767.98px){
  .proj-cta-inner { flex-direction:column; text-align:center; padding:3rem 0; }
}
