/* ============================================================
   PROJECT DETAIL — EpoxyOn (engineering). 1:1 with FkBEF. Fluid / rem. Dark.
   ============================================================ */

/* Case hero */
.epd-hero{ min-height:27.5rem; display:flex; flex-direction:column; justify-content:flex-end; background-size:cover; background-position:center; }
.epd-hero-body{ display:flex; flex-direction:column; gap:0.625rem; padding-block:0 2.75rem; max-width:52rem; }
.epd-crumb{ font-family:var(--font-display); font-weight:700; font-size:0.719rem; letter-spacing:.1em; color:#B9C2B0; margin:0; }
.epd-eyebrow{ font-family:var(--font-display); font-weight:700; font-size:0.719rem; letter-spacing:.12em; color:rgba(255,255,255,.8); margin:0; }
.epd-title{ font-family:var(--font-display); font-weight:800; font-size:2.5rem; letter-spacing:-.01em; line-height:1.08; color:#fff; max-width:51.25rem; margin:0; }
.epd-hero-meta{ font-family:var(--font-display); font-weight:600; font-size:0.719rem; letter-spacing:.07em; color:rgba(255,255,255,.69); margin:0; }

/* Facts */
.epd-facts{ display:flex; align-items:center; gap:2.75rem; padding-block:1.875rem; border-bottom:1px solid var(--line); }
.epd-fact{ flex:1 1 0; display:flex; flex-direction:column; gap:0.3125rem; }
.epd-fact-v{ font-family:var(--font-display); font-weight:800; font-size:1.0625rem; color:var(--text-primary); }
.epd-fact-l{ font-family:var(--font-display); font-weight:700; font-size:0.656rem; letter-spacing:.09em; color:var(--text-secondary); }
.epd-fact-sep{ flex:none; align-self:center; width:1px; height:2.75rem; background:var(--line); }

/* Challenge / approach / result */
.epd-car{ display:flex; gap:2.75rem; padding-block:3.5rem; }
.epd-car-block{ flex:1 1 0; display:flex; flex-direction:column; gap:0.75rem; }
.epd-car-h{ font-family:var(--font-display); font-weight:800; font-size:0.813rem; letter-spacing:.09em; color:var(--text-primary); }
.epd-car-bar{ display:block; width:2.25rem; height:2px; background:var(--brand-accent); }
.epd-car-d{ font-size:0.875rem; line-height:1.6; color:var(--text-secondary); margin:0; }

/* Gallery */
.epd-gallery{ display:flex; gap:1.125rem; padding-block:0 3.5rem; }
.epd-g{ display:block; height:23.75rem; background-size:cover; background-position:center; border-radius:0.25rem; }
.epd-g1{ flex:1 1 0; }
.epd-g2{ flex:0 0 32.5rem; }

/* System used */
.epd-system{ background:var(--surface); }
.epd-system-inner{ display:flex; align-items:center; justify-content:space-between; gap:2rem; padding-block:2.25rem; }
.epd-system-l{ display:flex; flex-direction:column; gap:0.375rem; }
.epd-system-e{ font-family:var(--font-display); font-weight:700; font-size:0.688rem; letter-spacing:.12em; color:var(--text-secondary); }
.epd-system-n{ font-family:var(--font-display); font-weight:800; font-size:1.25rem; color:var(--text-primary); }
.epd-system-d{ font-size:0.844rem; line-height:1.5; color:var(--text-secondary); }
.epd-system-btn{ flex:none; background:transparent; border:1.4px solid var(--text-primary); color:var(--text-primary); }
.epd-system-btn:hover{ background:rgba(255,255,255,.08); }

/* More projects */
.epd-more{ display:flex; flex-direction:column; gap:0.875rem; padding-block:3rem 3.5rem; }
.epd-more-t{ font-family:var(--font-display); font-weight:700; font-size:0.719rem; letter-spacing:.12em; color:var(--text-secondary); }
.epd-more-row{ display:flex; flex-wrap:wrap; gap:2.75rem; }
.epd-more-l{ font-family:var(--font-display); font-weight:700; font-size:0.9375rem; color:var(--text-primary); }
.epd-more-l:hover{ color:var(--brand); }

/* CTA */
.epd-cta{ display:flex; flex-direction:column; align-items:center; gap:1.125rem; background:#171B17; padding:3.75rem 3rem; text-align:center; }
.epd-cta-eyebrow{ font-family:var(--font-display); font-weight:700; font-size:0.75rem; letter-spacing:.1em; color:rgba(255,255,255,.65); margin:0; }
.epd-cta-h{ font-family:var(--font-display); font-weight:800; font-size:1.875rem; color:#fff; max-width:44rem; margin:0; }
.epd-cta-btn{ margin-top:0.5rem; }

/* Responsive */
@media (max-width:1000px){
  .epd-title{ font-size:2rem; }
  .epd-car{ flex-direction:column; gap:2rem; }
  .epd-gallery{ flex-direction:column; }
  .epd-g{ height:18rem; }
  .epd-g2{ flex-basis:auto; }
  .epd-system-inner{ flex-direction:column; align-items:flex-start; gap:1.25rem; }
}
@media (max-width:700px){
  .epd-facts{ flex-wrap:wrap; gap:1.5rem; }
  .epd-fact-sep{ display:none; }
  .epd-fact{ flex:1 1 40%; }
}