/* Electric Control identity for portfolio case studies. */
body.ec-project-detail-editorial {
  --pd-navy: #0f1c2e;
  --pd-green: #7dbf2a;
  --pd-graphite: #2b2f38;
  --pd-line: #e6e8eb;
  --pd-muted: #68717e;
  --pd-gutter: clamp(24px, 6vw, 96px);
  color: var(--pd-navy);
  background: #fff;
  background-image: none;
  font-family: "Montserrat", "Open Sans", system-ui, sans-serif;
}

body.ec-project-detail-editorial #proj-hero-section {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: clamp(570px, 78svh, 840px);
  padding: 148px 0 76px;
  overflow: hidden;
  background-color: var(--pd-navy) !important;
  background-image: linear-gradient(90deg, rgba(7,17,31,.94) 0%, rgba(7,17,31,.76) 50%, rgba(7,17,31,.25) 100%), linear-gradient(0deg, rgba(7,17,31,.48), transparent 56%), var(--ec-hero-bg) !important;
  background-position: center, center, center;
  background-size: cover;
}
body.ec-project-detail-editorial #proj-hero-section::before,
body.ec-project-detail-editorial #proj-hero-section::after { display: none; }
body.ec-project-detail-editorial #proj-hero-section .ec-container { width: min(100% - var(--pd-gutter) * 2, 1440px); margin: 0 auto; }
body.ec-project-detail-editorial #proj-hero-section .ec-breadcrumb { margin-bottom: 32px; }
body.ec-project-detail-editorial #proj-hero-section .ec-breadcrumb a,
body.ec-project-detail-editorial #proj-hero-section .ec-breadcrumb span { color: rgba(255,255,255,.72); }
body.ec-project-detail-editorial #proj-hero-section .ec-breadcrumb span:last-child { color: var(--pd-green); }
body.ec-project-detail-editorial #proj-detail-title {
  max-width: 1150px;
  margin: 0 0 27px;
  color: #fff;
  font-size: clamp(3.6rem, 8vw, 7.8rem);
  font-weight: 800;
  line-height: .95;
  letter-spacing: -.07em;
  text-wrap: balance;
}
body.ec-project-detail-editorial #proj-detail-meta { gap: 8px !important; margin-top: 0 !important; }
body.ec-project-detail-editorial #proj-detail-meta > span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.3) !important;
  border-radius: 0 !important;
  background: rgba(15,28,46,.42) !important;
  font-size: .68rem !important;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  backdrop-filter: blur(8px);
}
body.ec-project-detail-editorial #proj-detail-meta > span:first-child { color: var(--pd-green) !important; border-color: rgba(125,191,42,.65) !important; }
body.ec-project-detail-editorial #proj-detail-meta svg { width: 15px; height: 15px; color: var(--pd-green); }

body.ec-project-detail-editorial [data-ec-page] > .ec-section { padding: clamp(60px, 8vw, 112px) 0; background: #fff; }
body.ec-project-detail-editorial [data-ec-page] > .ec-section > .ec-container { width: min(100% - var(--pd-gutter) * 2, 1240px) !important; margin: 0 auto; }
body.ec-project-detail-editorial #project-engineering-hud {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: -146px 0 74px;
  border: 1px solid rgba(15,28,46,.1);
  background: #fff;
  box-shadow: 0 24px 70px rgba(15,28,46,.13);
}
body.ec-project-detail-editorial .ec-hud-tile { min-height: 144px; padding: 24px 22px; border-right: 1px solid var(--pd-line); background: #fff; }
body.ec-project-detail-editorial .ec-hud-tile:last-child { border-right: 0; }
body.ec-project-detail-editorial .ec-hud-tile__label { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; color: #66717e; font-size: .64rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
body.ec-project-detail-editorial .ec-hud-tile__label svg { color: #6a9e28; }
body.ec-project-detail-editorial .ec-hud-tile__value { color: var(--pd-navy); font-size: .98rem; font-weight: 800; line-height: 1.4; }
body.ec-project-detail-editorial .ec-hud-tile__sub { margin-top: 8px; color: var(--pd-muted); font-size: .73rem; line-height: 1.5; }
body.ec-project-detail-editorial #proj-detail-desc { margin-bottom: 58px !important; }
body.ec-project-detail-editorial .ec-tech-card {
  border: 1px solid var(--pd-line) !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}
body.ec-project-detail-editorial .ec-tech-card:hover { transform: none; box-shadow: 0 14px 34px rgba(15,28,46,.08) !important; }
body.ec-project-detail-editorial .ec-tech-card__header { padding: 24px 28px 20px; border-bottom: 1px solid var(--pd-line); }
body.ec-project-detail-editorial .ec-tech-card__icon { color: #689b2b; background: rgba(125,191,42,.12); }
body.ec-project-detail-editorial .ec-tech-card__title { color: var(--pd-navy); font-weight: 800; letter-spacing: -.02em; }
body.ec-project-detail-editorial .ec-tech-card__body { padding: 24px 28px; color: #505a66; font-size: 1rem; line-height: 1.85; }
body.ec-project-detail-editorial #proj-detail-sections { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px !important; padding: 1px; background: var(--pd-line); }
body.ec-project-detail-editorial #proj-detail-sections > .ec-tech-card { min-height: 100%; }
body.ec-project-detail-editorial #proj-detail-sections > .ec-tech-card[style*="grid-column"] { grid-column: 1 / -1; }
body.ec-project-detail-editorial .ec-hardware-chip { border: 1px solid #dce2e7; border-radius: 0; color: var(--pd-navy); background: #f7f8f9 !important; font-weight: 700; }
body.ec-project-detail-editorial .ec-hardware-chip__dot { background: var(--pd-green) !important; box-shadow: none !important; }

body.ec-project-detail-editorial .ec-coverflow-section { margin-top: 12px; padding: clamp(30px,5vw,66px); border: 0; border-top: 4px solid var(--pd-green); border-radius: 0; background: var(--pd-navy); }
body.ec-project-detail-editorial .ec-coverflow-label { color: var(--pd-green); letter-spacing: .14em; }
body.ec-project-detail-editorial .ec-coverflow-title { color: #fff; font-size: clamp(2rem,4vw,3.4rem); letter-spacing: -.055em; }
body.ec-project-detail-editorial .ec-coverflow-subtitle { color: rgba(255,255,255,.68); }
body.ec-project-detail-editorial .ec-coverflow-pill { border-radius: 0; }
body.ec-project-detail-editorial .ec-coverflow-pill.active { color: var(--pd-navy); background: var(--pd-green); border-color: var(--pd-green); }
body.ec-project-detail-editorial .ec-coverflow-btn { border-radius: 0; color: var(--pd-navy); background: var(--pd-green); border-color: var(--pd-green); }
body.ec-project-detail-editorial .ec-coverflow-counter { color: rgba(255,255,255,.82); }
body.ec-project-detail-editorial .ec-coverflow-details { border-color: rgba(255,255,255,.18); }
body.ec-project-detail-editorial .ec-coverflow-details__title { color: #fff; }
body.ec-project-detail-editorial .ec-coverflow-details__desc { color: rgba(255,255,255,.68); }
body.ec-project-detail-editorial #proj-detail-sections iframe,
body.ec-project-detail-editorial #proj-detail-sections video { border-radius: 0 !important; }

body.ec-project-detail-editorial .ec-page-cta { padding: 74px 0; background: #f4f6f7; }
body.ec-project-detail-editorial .ec-page-cta h2 { color: var(--pd-navy); }
body.ec-project-detail-editorial .ec-page-cta .ec-btn { border-radius: 0; font-weight: 800; letter-spacing: .04em; }
body.ec-project-detail-editorial .ec-page-cta .ec-btn-primary { color: var(--pd-navy); background: var(--pd-green); border-color: var(--pd-green); }

@media (max-width: 900px) {
  body.ec-project-detail-editorial #project-engineering-hud { grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: -92px; margin-bottom: 52px; }
  body.ec-project-detail-editorial .ec-hud-tile:nth-child(2) { border-right: 0; }
  body.ec-project-detail-editorial .ec-hud-tile:nth-child(-n+2) { border-bottom: 1px solid var(--pd-line); }
}
@media (max-width: 600px) {
  body.ec-project-detail-editorial #proj-hero-section { min-height: 620px; padding: 124px 0 56px; background-image: linear-gradient(90deg, rgba(7,17,31,.9), rgba(7,17,31,.52)), linear-gradient(0deg, rgba(7,17,31,.52), transparent 68%), var(--ec-hero-bg) !important; background-position: center,center,58% center; }
  body.ec-project-detail-editorial #proj-hero-section .ec-container { width: calc(100% - 40px); }
  body.ec-project-detail-editorial #proj-detail-title { font-size: clamp(3rem,14vw,4.7rem); }
  body.ec-project-detail-editorial #proj-detail-meta > span { padding: 8px 9px !important; font-size: .58rem !important; }
  body.ec-project-detail-editorial [data-ec-page] > .ec-section > .ec-container { width: calc(100% - 40px) !important; }
  body.ec-project-detail-editorial #project-engineering-hud { margin-top: -48px; margin-bottom: 40px; }
  body.ec-project-detail-editorial .ec-hud-tile { min-height: 0; padding: 17px 14px; }
  body.ec-project-detail-editorial .ec-hud-tile__label { font-size: .57rem; }
  body.ec-project-detail-editorial .ec-hud-tile__value { font-size: .82rem; }
  body.ec-project-detail-editorial #proj-detail-sections { grid-template-columns: 1fr; }
  body.ec-project-detail-editorial #proj-detail-sections > .ec-tech-card[style*="grid-column"] { grid-column: auto; }
  body.ec-project-detail-editorial .ec-tech-card__header { padding: 19px 18px 16px; }
  body.ec-project-detail-editorial .ec-tech-card__body { padding: 18px; }
  body.ec-project-detail-editorial .ec-coverflow-section { width: calc(100% + 40px); margin-left: -20px; padding: 32px 20px; }
}