/* ENERTECT Icon-System v0.1
   Einsatz: WordPress / Divi / Basis-Layout
   Icons: SVG, 24x24, currentColor, 2px Stroke, runde Linienenden.
*/
:root {
  --enertect-icon-color: #24302f;
  --enertect-icon-bg: #eff6e9;
  --enertect-icon-bg-soft: #f6faef;
  --enertect-card-bg: #ffffff;
  --enertect-card-border: rgba(36, 48, 47, .12);
  --enertect-card-shadow: 0 18px 45px rgba(36, 48, 47, .08);
}

.enertect-icon-section {
  width: 100%;
}

.enertect-icon-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 24px;
}

.enertect-icon-card {
  min-height: 168px;
  padding: 28px 18px;
  border-radius: 16px;
  border: 1px solid var(--enertect-card-border);
  background: var(--enertect-card-bg);
  box-shadow: var(--enertect-card-shadow);
  text-align: center;
  color: var(--enertect-icon-color);
}

.enertect-icon-badge {
  width: 92px;
  height: 92px;
  margin: 0 auto;
  border-radius: 28px;
  background: var(--enertect-icon-bg);
  display: flex;
  align-items: center;
  justify-content: center;
}

.enertect-icon,
.enertect-icon-badge svg {
  width: 48px;
  height: 48px;
  color: currentColor;
  stroke: currentColor;
}

.enertect-icon-card strong {
  display: block;
  margin-top: 18px;
  color: #24302f;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.35;
}

.enertect-icon-card small {
  display: block;
  margin-top: 8px;
  color: rgba(36, 48, 47, .50);
  font-size: 12px;
  line-height: 1.4;
}

.enertect-icon-card.is-green { color: var(--enertect-green, #6f8f3d); }
.enertect-icon-card.is-orange { color: var(--enertect-orange, #d9822b); }
.enertect-icon-card.is-dark { color: var(--enertect-dark, #24302f); }

@media (max-width: 1100px) {
  .enertect-icon-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 780px) {
  .enertect-icon-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 520px) {
  .enertect-icon-grid { grid-template-columns: 1fr; }
  .enertect-icon-card { min-height: 150px; }
}
