:root{
  /* Glass material */
  --kf-glass-blur: 22px;
  --kf-glass-sat: 155%;
  --kf-glass-contrast: 108%;
  --kf-glass-base-alpha: 0.08;     /* base milkiness of glass */
  --kf-glass-border-alpha: 0.16;   /* edge highlight strength */
  --kf-glass-inner-alpha: 0.14;    /* inner top rim */

  /* Tint film */
  --kf-tint-opacity: 0.16;         /* main “theme reminder” dial */
  --kf-tint-mode: normal;          /* normal | color | overlay */
}

/* Section bg (unchanged) */
.dnd-section:has(.sec_key_figures){
  background: var(--primary-color-hex);
}

.sec_key_figures__heading{ text-align:center; }
.sec_key_figures__heading h2{ margin-bottom:90px; }

/* Key figures */
.sec_key_figures__container{
  position:relative;
  margin-top:20px;
}

/* =========================================================
   KEY NUMBERS — Base sizing (unchanged)
========================================================= */
.key_numbers{
  border-radius: 35px;
  padding: 32px 24px 40px 24px;
  scale: 0.88;
}

/* Legacy theme styles kept (they’re overridden by the glass system below) */
.key_numbers.cyberdefense{
  box-shadow: 5px 10px 16px #B4007C4F;
  background: linear-gradient(90deg, #B4007C 0%, #572CD5 50%, #011633 100%);
}
.key_numbers.cloud{
  background: linear-gradient(90deg, #E05C4C 0%, #A60350 50%, #011633 100%);
  box-shadow: 5px 10px 16px #E05C4C4F;
}
.key_numbers.modernisation{
  background: linear-gradient(90deg, #01C5B8 0%, #0099A8 50%, #011633 100%);
  box-shadow: 5px 10px 16px #01C5B84F;
}
.key_numbers.infrastructure{
  background: linear-gradient(90deg, #0CC6E4 0%, #0C9AC1 50%, #011633 100%);
  box-shadow: 5px 10px 16px #0CC6E44F;
}
.key_numbers.other_blue{
  background: linear-gradient(90deg, #0CC6E4 0%, #001633 100%);
  box-shadow: 1px 0px 7px #0097A7;
}

/* =========================================================
   Rounds (unchanged)
========================================================= */
.key-figures__round.cyberdefense{ box-shadow: inset 0px 3px 20px #572CD5; }
.key-figures__round.cloud{ box-shadow: inset 0px 3px 20px #E05C4C; }
.key-figures__round.modernisation{ box-shadow: inset 0px 3px 20px #01C5B8; }
.key-figures__round.infrastructure{ box-shadow: inset 0px 3px 20px #0CC6E4; }
.key-figures__round.other_blue{ box-shadow: inset 0px 3px 20px #0CC6E4; }

.key-figures__grid{
  display:grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto auto auto;
  row-gap: 20px;
}

.key-figures__item--row1-col1{ grid-column:1; grid-row:1; }
.key-figures__item--row1-col2{ grid-column:1; grid-row:2; }
.key-figures__item--row2-col1{ grid-column:1; grid-row:3; }
.key-figures__item--row2-col2{ grid-column:1; grid-row:4; }

.key-figures__round{
  position:absolute;
  width:148px;
  height:148px;
  border-radius:50%;
  top:-74px;
  right: calc(50% - 74px);
  background: var(--primary-color-hex);
  border: 8px solid var(--primary-color-hex);
  overflow:hidden;

  display:flex;
  align-items:center;
  justify-content:center;
  scale:0.85;
}

.key-figures__round img{
  width:70%;
  height:auto;
  margin:0 auto;
  scale:0.8;
  translate: 0.5% -4%;
}

.key-figures__round p{
  text-align:center;
  padding:12px;
  margin-bottom:0;
}

.sec_key_figures__logos{
  display:flex;
  align-items:center;
  justify-content:center;
  margin-top:30px;
}
.sec_key_figures__logos figure{
  height:auto;
  width:180px;
}
.sec_key_figures__logos p{
  margin-bottom:0;
  margin-inline:50px;
}

/* =========================================================
   Responsive (unchanged)
========================================================= */
@media (max-width:992px){
  .key-figures__grid{ text-align:center; }

  .key-figures__text.hs_cos_wrapper_type_rich_text h4,
  .key-figures__text.hs_cos_wrapper_type_rich_text h5{
    font-size:16px;
  }

  .sec_key_figures__container{ padding-inline:23px; }
  .key-figures__round p{ font-style: italic; }
}
  .sec_key_figures{
    margin-block: 42px;
  }

.key_numbers{
  border-radius: 35px;
  padding: 92px 24px 40px 24px;
  scale: 0.94;
}

.key-figures__round{
  top:-54px;
}

.key-figures__grid{
justify-content: center;
text-align: center:
}

@media (min-width:992px){
  .sec_key_figures__heading h2{ margin-bottom:186px; }

  .sec_key_figures__container{
    margin-top:20px;
    scale:0.75;
  }

  .key_numbers{
    border-radius:86px;
    padding:66px 70px;
  }

  .sec_key_figures__logos{ margin-top:60px; }

  .key_numbers.cyberdefense{ box-shadow: 5px 10px 16px #572CD54F; }
  .key_numbers.other_blue{ box-shadow: 5px 10px 16px #0CC6E44F; }

  .key-figures__grid{
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: auto auto;
    row-gap:46px;
  }

  .key-figures__item--row1-col1{ grid-column:1; grid-row:1; }
  .key-figures__item--row1-col2{ grid-column:4; grid-row:1; }

  .key-figures__item--row2-col1{
    grid-column: 1 / 3;
    grid-row: 2;
    text-align:center;
    margin-right:10px;
  }

  .key-figures__item--row2-col2{
    grid-column: 3 / 5;
    grid-row: 2;
    margin-left:10px;
  }

  .key-figures__round{
    width:293px;
    height:291px;
    top:-90px;
    right: calc(50% - 145px);
    border:16px solid var(--primary-color-hex);
  }
}

/* =========================================================
   KEY FIGURES — TRUE GLASS PILL (NO LINES)
   This overrides the legacy gradient fills above.
========================================================= */

/* Base pill: remove any painted gradients */
.key_numbers,
.key_numbers.cyberdefense,
.key_numbers.cloud,
.key_numbers.modernisation,
.key_numbers.infrastructure,
.key_numbers.other_blue{
  position:relative;
  overflow:hidden;
  isolation:isolate;

  /* kill gradient fill from legacy theme rules */
  background: transparent !important;
  background-image: none !important;

  /* glass optics */
  -webkit-backdrop-filter: blur(var(--kf-glass-blur)) saturate(var(--kf-glass-sat)) contrast(var(--kf-glass-contrast));
  backdrop-filter: blur(var(--kf-glass-blur)) saturate(var(--kf-glass-sat)) contrast(var(--kf-glass-contrast));

  border: 1px solid rgba(255,255,255,var(--kf-glass-border-alpha));

  /* keep your existing box-shadow intent, but make it glassy */
  box-shadow:
    0 14px 34px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,var(--kf-glass-inner-alpha));
}

/* Layer 1: glass body (no texture, no lines) */
.key_numbers::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;

  background: linear-gradient(
    180deg,
    rgba(255,255,255,calc(var(--kf-glass-base-alpha) + 0.05)),
    rgba(255,255,255,var(--kf-glass-base-alpha))
  );
}

/* Layer 2: tint film */
.key_numbers::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;

  opacity: var(--kf-tint-opacity);
  mix-blend-mode: var(--kf-tint-mode);

  /* default tint if theme missing */
  background: linear-gradient(90deg, rgba(255,255,255,1), rgba(255,255,255,1));
}

/* Keep pill content above layers */
.key_numbers > *{
  position:relative;
  z-index:1;
}

/* Theme tint gradients (ONLY tint film, NOT fill) */
.key_numbers.cyberdefense::after{
  background: linear-gradient(90deg,
    rgba(180,0,124,1) 0%,
    rgba(87,44,213,1) 55%,
    rgba(1,22,51,1) 100%
  );
}
.key_numbers.cloud::after{
  background: linear-gradient(90deg,
    rgba(224,92,76,1) 0%,
    rgba(166,3,80,1) 55%,
    rgba(1,22,51,1) 100%
  );
}
.key_numbers.modernisation::after{
  background: linear-gradient(90deg,
    rgba(1,197,184,1) 0%,
    rgba(0,153,168,1) 55%,
    rgba(1,22,51,1) 100%
  );
}
.key_numbers.infrastructure::after{
  background: linear-gradient(90deg,
    rgba(12,198,228,1) 0%,
    rgba(12,154,193,1) 55%,
    rgba(1,22,51,1) 100%
  );
}
.key_numbers.other_blue::after{
  background: linear-gradient(90deg,
    rgba(12,198,228,1) 0%,
    rgba(0,22,51,1) 100%
  );
}

/* Accessibility / perf fallback */
@media (prefers-reduced-transparency: reduce){
  .key_numbers{
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
  }
}