.security-section {
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at 86% 8%, rgb(21 134 243 / 12%), transparent 24%), linear-gradient(135deg, #f9fdff 0%, #edf8ff 54%, #f8fcff 100%);
  color: #071333;
}
.security-section::before,
.security-section::after {
  position: absolute;
  border: 1px solid rgb(8 103 234 / 16%);
  border-radius: 50%;
  content: '';
  pointer-events: none;
}
.security-section::before { width: 33vw; height: 33vw; top: 16%; left: -25vw; }
.security-section::after { width: 24vw; height: 24vw; right: -17vw; bottom: 5%; }
.security-section__inner { position: relative; z-index: 1; padding: clamp(78px, 7vw, 120px) 0 clamp(72px, 6vw, 106px); }
.security-section__header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(210px, .42fr); align-items: center; gap: clamp(34px, 7vw, 110px); }
.security-section__header .tetis-eyebrow { margin: 0 0 17px; color: #3456ad; font-weight: 700; letter-spacing: 3px; }
.security-section__header h2 { max-width: 880px; margin: 0; font: 700 clamp(42px, 4.35vw, 72px)/1.04 Arial, Helvetica, sans-serif; letter-spacing: -.055em; }
.security-section__header h2 span { display: block; color: #1267e8; }
.security-section__header > div:first-child > p:last-child { max-width: 835px; margin: 18px 0 0; color: #405db4; font: 400 clamp(16px, 1.35vw, 22px)/1.32 Arial, Helvetica, sans-serif; letter-spacing: -.025em; }
.security-section__visual { display: grid; width: min(100%, 255px); aspect-ratio: 1; justify-self: end; place-items: center; border: 1px solid rgb(81 209 255 / 72%); border-radius: 34px; background: radial-gradient(circle at 50% 25%, #4dd5ff 0%, #126ce8 32%, #062c79 78%); box-shadow: 0 0 0 12px rgb(72 196 255 / 7%), 0 0 42px rgb(19 143 243 / 28%), inset 0 1px 24px rgb(232 255 255 / 27%); }
.security-section__visual svg { width: 72%; height: 72%; fill: none; stroke: #fff; stroke-linecap: round; stroke-linejoin: round; stroke-width: 5; filter: drop-shadow(0 5px 10px rgb(0 21 72 / 32%)); }
.security-section__pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: clamp(42px, 5vw, 76px) 0 0; padding: 0; list-style: none; }
.security-section__pillars li { display: grid; grid-template-columns: 70px minmax(0, 1fr); align-items: start; min-height: 172px; gap: 18px; border: 1px solid rgb(201 229 248 / 95%); border-radius: 18px; background: rgb(255 255 255 / 86%); padding: 25px; box-shadow: 0 12px 28px rgb(13 80 151 / 7%); transition: transform 180ms var(--tetis-ease), border-color 180ms var(--tetis-ease), box-shadow 180ms var(--tetis-ease); }
.security-section__pillars li:hover { border-color: #68caff; box-shadow: 0 16px 32px rgb(13 80 151 / 13%); transform: translateY(-3px); }
.security-section__icon { display: grid; width: 64px; height: 64px; place-items: center; border-radius: 15px; background: linear-gradient(145deg, #ecf9ff, #d9effc); color: #0767ed; }
.security-section__icon svg { width: 38px; height: 38px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.7; }
.security-section__pillars h3 { margin: 3px 0 8px; color: #081332; font: 700 clamp(17px, 1.35vw, 21px)/1.13 Arial, Helvetica, sans-serif; letter-spacing: -.04em; }
.security-section__pillars p { margin: 0; color: #405db4; font: 400 clamp(14px, 1.08vw, 17px)/1.28 Arial, Helvetica, sans-serif; letter-spacing: -.02em; }
.security-section__closing { margin: clamp(38px, 5vw, 64px) 0 0; border-left: 3px solid #087dff; padding: 9px 0 9px 26px; color: #173f90; font: 600 clamp(19px, 1.65vw, 28px)/1.26 Arial, Helvetica, sans-serif; letter-spacing: -.025em; }
@media (max-width: 1024px) {
  .security-section__header { grid-template-columns: minmax(0, 1fr) 190px; gap: 36px; }
  .security-section__visual { width: 190px; border-radius: 28px; }
  .security-section__pillars { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .security-section__inner { padding-top: 76px; padding-bottom: 72px; }
  .security-section__header { grid-template-columns: 1fr; gap: 28px; }
  .security-section__header h2 { font-size: clamp(39px, 11.2vw, 51px); }
  .security-section__header > div:first-child > p:last-child { font-size: 16px; }
  .security-section__visual { justify-self: start; width: 168px; border-radius: 26px; }
  .security-section__pillars { grid-template-columns: 1fr; gap: 13px; margin-top: 36px; }
  .security-section__pillars li { grid-template-columns: 60px minmax(0, 1fr); min-height: 0; gap: 15px; padding: 20px; }
  .security-section__icon { width: 54px; height: 54px; border-radius: 13px; }
  .security-section__icon svg { width: 33px; height: 33px; }
  .security-section__closing { margin-top: 34px; padding-left: 20px; font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .security-section__pillars li { transition: none; }
  .security-section__pillars li:hover { transform: none; }
}