.ec-case-sidebar{position:relative}
.ec-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:16px;padding:1rem}
.ec-card-title{margin:.25rem 0 .5rem;font-size:1.05rem}
.ec-snapshot{display:grid;grid-template-columns:auto 1fr;column-gap:.75rem;row-gap:.35rem;font-size:.9rem}
.ec-snapshot dt{color:#475569}
.ec-btn{display:inline-block;padding:.55rem .8rem;border-radius:10px;border:1px solid #e2e8f0;text-decoration:none;background:#fff}
.ec-btn:hover,.ec-btn:focus{background:#fff;box-shadow:0 0 0 2px rgba(0,0,0,.03) inset}
.ec-case-sections { margin: 0 0 1.25rem; }
.ec-h2 { font-size: 1.25rem; margin: 1.25rem 0 .5rem; }
.ec-process { padding-left: 1.1rem; margin: .5rem 0; }
.ec-process li { margin: .25rem 0; }
.ec-quote { border-left: 3px solid #e2e8f0; padding: .5rem 1rem; color: #475569; font-style: italic; margin: 1rem 0; }
.ec-quote footer { font-style: normal; color: #334155; margin-top: .35rem; }

/* ===== Case Studies (scoped to .ec-portfolio wrapper) ===== */
.ec-portfolio .ec-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:10px;
  margin:2px auto;
}

.ec-portfolio .ec-card{
  display:block;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:0;
  overflow:hidden;
  box-shadow:0 2px 6px rgba(2,8,20,.06);
  text-decoration:none;
  color:inherit;
  transition:transform .15s,box-shadow .15s,border-color .15s;
  height:100%;
  padding:0 !important;
}
.ec-portfolio .ec-card:hover{
  transform:translateY(-1px);
  box-shadow:0 5px 11px rgba(2,8,20,.10);
  border:1px solid #191970;
}
.ec-portfolio .ec-card:focus-visible{ outline:2px solid #0ea5e9; outline-offset:2px; }

/* --- Media: fixed 16:9 card; image fully visible (no crop) --- */
.ec-portfolio .ec-card .ec-media{
  position:relative;
  background:#eef2f7;
  overflow:hidden;
  border-radius:inherit;
  aspect-ratio:16/9;                 /* uniform card height */
  display:flex; align-items:center; justify-content:center;
}

/* If image is wrapped in <a>, center the link area too */
.ec-portfolio .ec-card .ec-media > a{
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center;
}

/* HARD RESET: prevent legacy absolute/100% rules from re-zooming */
.ec-portfolio .ec-card .ec-media img{
  position:static !important;
  display:block;
  width:auto !important; height:auto !important;
  max-width:100% !important; max-height:100% !important;
  object-fit:contain !important;           /* show entire photo */
  object-position:center !important;
  transform:none !important;
  transition:transform .35s ease;
  backface-visibility:hidden;
}

/* Gentle hover without cropping */
.ec-portfolio .ec-card:hover .ec-media img{ transform:scale(1.03); }

/* Respect motion preferences */
@media (prefers-reduced-motion: reduce){
  .ec-portfolio .ec-card .ec-media img{ transition:none; }
}

/* Tag + text */
.ec-portfolio .ec-tag{
  position:absolute; top:10px; left:10px;
  background:#d97706; color:#fff; font-weight:700;
  font-size:.72rem; letter-spacing:.02em; text-transform:uppercase;
  padding:.25rem .75rem !important; border-radius:0;
}
.ec-portfolio .ec-body{ padding:.50rem .60rem .60rem; }
.ec-portfolio .ec-title{ margin:.05rem 0 .45rem; font-size:1rem; line-height:1.2; color:#0f172a; }

/* Meta row (small + compressed) */
.ec-portfolio .ec-meta{
  display:flex; flex-wrap:wrap; gap:.25rem;
  color:#475569; font-size:.75rem; line-height:1.05; letter-spacing:-.01em; white-space:nowrap;
}
.ec-portfolio .ec-meta span{ display:inline-block; }
.ec-portfolio .ec-meta .ec-span{
  display:inline-block; transform:scaleX(.95); transform-origin:left center;
}


/* Safety: keep any inner anchors neutral */
.ec-portfolio .ec-card * a{
  color:inherit; text-decoration:none; background:none; border:0; padding:0; margin:0;
  border-radius:0; box-shadow:none;
}

/* 1) Default: never zoom unless hovering */
.ec-portfolio .ec-card .ec-media img{
  transform: none !important;
}

/* 2) Only zoom on pointer hover (remove focus-based zoom) */
.ec-portfolio .ec-card:hover .ec-media img{
  transform: scale(1.03) !important;
}

/* 3) Optional: if some theme rule was scaling on focus, kill it */
.ec-portfolio .ec-card:focus .ec-media img,
.ec-portfolio .ec-card:focus-visible .ec-media img{
  transform: none !important;
}

a.ec-span:hover {
color: #C30000;
}