/* edantra OS — CASE-STUDIES.CSS */

/* HEADER */
.cases-header { padding: calc(var(--nav-h) + 60px) 0 80px; border-bottom: 1px solid var(--border); }
.cases-header .s-inner { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--page-px); }
.cases-h1 {
  font-family: var(--display);
  font-size: clamp(52px, 7vw, 112px);
  font-weight: 500; letter-spacing: -0.035em; line-height: 0.92;
  margin: 20px 0 24px;
}
.cases-h1 .t-serif { color: var(--primary); display: block; }
.cases-intro { font-size: 18px; line-height: 1.75; color: rgba(26,26,26,0.62); max-width: 52ch; }

/* BENTO GRID */
.bento-section {
  padding: 80px 0;
  border-bottom: 1px solid var(--border);
  background: var(--warm-bg);
}
.bento-section .s-inner { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--page-px); }
.bento-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 14px;
}

/* BASE CARD */
.bento-card {
  border-radius: var(--radius);
  padding: 36px 40px;
  transition: transform 0.3s cubic-bezier(0.16,1,0.3,1), box-shadow 0.3s;
}
.bento-card:hover { transform: translateY(-4px); box-shadow: 0 24px 56px rgba(0,0,0,0.10); }
.bento-card--large { grid-column: span 4; }
.bento-card--med   { grid-column: span 2; }
.bento-card--wide  { grid-column: span 6; }

/* COLOUR VARIANTS */
.bento-card--dark {
  background: var(--fg);
  color: var(--bg);
}
.bento-card--warm {
  background: var(--secondary);
}
.bento-card--light {
  background: rgba(253,251,247,0.65);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid rgba(255,255,255,0.7);
  box-shadow: 0 8px 40px rgba(0,0,0,0.06), inset 0 1px 0 rgba(255,255,255,0.8);
}
.bento-card--accent {
  background: rgba(253,251,247,0.65);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid rgba(255,255,255,0.7);
  box-shadow: 0 8px 40px rgba(0,0,0,0.06), inset 0 1px 0 rgba(255,255,255,0.8);
}

/* INNER WRAPPER */
.bento-card-inner { display: flex; flex-direction: column; height: 100%; }
.bento-card-inner--wide {
  flex-direction: row;
  gap: 60px;
  align-items: flex-start;
}
.bento-wide-left { flex: 0 0 380px; }
.bento-wide-right { flex: 1; }

/* TOP ROW */
.bento-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 28px;
  gap: 12px;
}
.bento-industry {
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.2em; text-transform: uppercase;
}
.bento-card--dark  .bento-industry { color: rgba(253,251,247,0.4); }
.bento-card--warm  .bento-industry { color: var(--mid); }
.bento-card--light .bento-industry { color: var(--mid); }
.bento-card--accent .bento-industry { color: var(--mid); }

.bento-tag {
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.12em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 100px;
}
.bento-card--dark  .bento-tag {
  color: rgba(253,251,247,0.5);
  border: 1px solid rgba(253,251,247,0.14);
}
.bento-card--warm  .bento-tag {
  color: var(--mid);
  background: rgba(26,26,26,0.06);
}
.bento-card--light .bento-tag,
.bento-card--accent .bento-tag {
  color: var(--mid);
  background: rgba(255,255,255,0.5);
  border: 1px solid rgba(255,255,255,0.65);
}

/* BODY */
.bento-card-body { flex: 1; }
.bento-stat { margin-bottom: 20px; }
.bento-stat-num {
  font-family: var(--display);
  font-size: clamp(56px, 6vw, 92px);
  font-weight: 500; letter-spacing: -0.04em; line-height: 1;
  display: block;
}
.bento-card--dark  .bento-stat-num { color: var(--primary); }
.bento-card--warm  .bento-stat-num { color: var(--fg); }
.bento-card--light .bento-stat-num { color: var(--fg); }
.bento-card--accent .bento-stat-num { color: var(--primary); }

.bento-stat-label { font-size: 14px; display: block; margin-top: 4px; }
.bento-card--dark  .bento-stat-label { color: rgba(253,251,247,0.45); }
.bento-card--warm  .bento-stat-label { color: var(--mid); }
.bento-card--light .bento-stat-label { color: var(--mid); }
.bento-card--accent .bento-stat-label { color: var(--mid); }

.bento-card-h2 {
  font-family: var(--display);
  font-size: clamp(17px, 1.9vw, 26px);
  font-weight: 500; letter-spacing: -0.02em; line-height: 1.2;
  margin-bottom: 12px;
}
.bento-card--dark  .bento-card-h2 { color: var(--bg); }
.bento-card--warm  .bento-card-h2 { color: var(--fg); }
.bento-card--light .bento-card-h2 { color: var(--fg); }
.bento-card--accent .bento-card-h2 { color: var(--fg); }

.bento-card-p { font-size: 15px; line-height: 1.68; }
.bento-card--dark  .bento-card-p { color: rgba(253,251,247,0.58); }
.bento-card--warm  .bento-card-p { color: rgba(26,26,26,0.62); }
.bento-card--light .bento-card-p { color: rgba(26,26,26,0.62); }
.bento-card--accent .bento-card-p { color: rgba(26,26,26,0.62); }

/* BOTTOM ROW */
.bento-card-bottom { display: flex; align-items: center; justify-content: space-between; margin-top: 28px; }
.bento-layers { display: flex; flex-wrap: wrap; gap: 6px; }
.bento-layers span {
  font-size: 10px; font-weight: 500; letter-spacing: 0.15em; text-transform: uppercase;
  padding: 4px 9px; border-radius: 100px;
}
.bento-card--dark  .bento-layers span {
  color: rgba(253,251,247,0.5);
  border: 1px solid rgba(253,251,247,0.14);
}
.bento-card--warm  .bento-layers span,
.bento-card--light .bento-layers span,
.bento-card--accent .bento-layers span {
  color: rgba(26,26,26,0.55);
  background: rgba(255,255,255,0.5);
  border: 1px solid rgba(255,255,255,0.65);
}

.bento-arrow svg {
  width: 20px; height: 20px;
  opacity: 0.35;
  stroke: currentColor;
}
.bento-card--dark .bento-arrow svg { stroke: var(--bg); }

/* STATS STRIP */
.cases-stats-section {
  padding: 80px 0;
  border-bottom: 1px solid var(--border);
  background: var(--warm-bg);
}
.cases-stats-section .s-inner { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--page-px); }
.cases-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.cases-stat-cell {
  padding: 36px 32px;
  background: rgba(253,251,247,0.65);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,0.65);
  border-radius: 20px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.05), inset 0 1px 0 rgba(255,255,255,0.75);
  transition: transform 0.3s, box-shadow 0.3s;
}
.cases-stat-cell:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.08), inset 0 1px 0 rgba(255,255,255,0.8);
}
.cases-stat-num {
  font-family: var(--display);
  font-size: clamp(40px, 4vw, 62px);
  font-weight: 500; letter-spacing: -0.03em; line-height: 1;
  color: var(--primary); margin-bottom: 10px; display: block;
}
.cases-stat-label { font-size: 14px; line-height: 1.55; color: var(--mid); }

/* DARK CTA */
.cases-cta-section { padding: 80px 0; }
.cases-cta-section .s-inner { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--page-px); }
.cases-cta-block {
  background: var(--fg);
  border-radius: var(--radius);
  padding: 64px 72px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 32px; flex-wrap: wrap;
}
.cases-cta-h2 {
  font-family: var(--display);
  font-size: clamp(28px, 3.5vw, 56px);
  font-weight: 500; letter-spacing: -0.03em; line-height: 1.05;
  color: var(--bg); max-width: 22ch;
}

/* RESPONSIVE */
@media (max-width: 1100px) {
  .bento-card--large { grid-column: span 6; }
  .bento-card--med   { grid-column: span 3; }
  .bento-card-inner--wide { flex-direction: column; gap: 32px; }
  .bento-wide-left { flex: none; }
}
@media (max-width: 768px) {
  .bento-grid { grid-template-columns: 1fr; }
  .bento-card--large, .bento-card--med, .bento-card--wide { grid-column: span 1; }
  .bento-card { padding: 28px 24px; }
  .cases-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .cases-cta-block { padding: 40px 28px; flex-direction: column; align-items: flex-start; }
}