:root {
  --fs-sec-q: clamp(1.4375rem, calc(1.21691rem + 0.9412vw), 1.6875rem);
  --sec-panel-pad-x: clamp(1.75rem, calc(-0.29044rem + 8.7059vw), 4.0625rem);
  --sec-panel-pad-y: clamp(2.875rem, calc(1.71691rem + 4.9412vw), 4.1875rem);
  --sec-gap-panels: 1.25rem;
  --sec-gap-lead: clamp(1.25rem, calc(0.91912rem + 1.4118vw), 1.625rem);
  --sec-gap-text: clamp(1.125rem, calc(1.01471rem + 0.4706vw), 1.25rem);
  --sec-gap-list: clamp(1.875rem, calc(1.32353rem + 2.3529vw), 2.5rem);
  --sec-gap-item: clamp(1.75rem, calc(1.30882rem + 1.8824vw), 2.25rem);
  --sec-dot-gap: clamp(0.625rem, calc(0.51471rem + 0.4706vw), 0.75rem);
  --sec-gap-itemtext: clamp(0.75rem, calc(0.63971rem + 0.4706vw), 0.875rem);
  --sec-gap-link: clamp(2.5rem, calc(1.61765rem + 3.7647vw), 3.5rem);
}

@media (min-width: 1280px) {
  :root {
    --sec-panel-pad-x: clamp(6.25rem, calc(-6.25rem + 15.625vw), 9.375rem);
    --sec-panel-pad-y: 6.5625rem;
    --sec-gap-lead: clamp(1.875rem, calc(0.375rem + 1.875vw), 2.25rem);
    --sec-gap-text: clamp(1.375rem, calc(0.375rem + 1.25vw), 1.625rem);
    --sec-gap-list: clamp(3.125rem, calc(-0.875rem + 5vw), 4.125rem);
    --sec-dot-gap: clamp(0.875rem, calc(0.375rem + 0.625vw), 1rem);
    --sec-gap-item: clamp(2.75rem, calc(-1.25rem + 5vw), 3.75rem);
    --sec-gap-itemtext: clamp(1rem, calc(0rem + 1.25vw), 1.25rem);
    --sec-gap-link: clamp(4.125rem, calc(1.125rem + 3.75vw), 4.875rem);
  }
}

.security__card {
  --corner-color: var(--beige-light);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--indigo);
  color: var(--text-white);
  --corner-inset-x: calc(var(--corner-gap) + var(--page-margin));
  --corner-inset-y: var(--corner-gap);
}
.security__inner {
  position: relative; z-index: 1;
  padding-block: var(--sec-pad);
  padding-inline: var(--page-margin);
}

.security__title { text-align: center; }

.security .grid-12 { row-gap: var(--sec-gap-panels); }

.sec-panel--left  { grid-column: 1 / span 6; margin-right: .625rem; }
.sec-panel--right { grid-column: 7 / span 6; margin-left: .625rem; }
.sec-panel {
  background: var(--text-violet);
  border: .0625rem solid color-mix(in srgb, var(--text-white) 10%, transparent);
  border-radius: 1.25rem;
  padding: var(--sec-panel-pad-y) var(--sec-panel-pad-x);
}
.sec-panel__q {
  font-weight: 600; font-style: italic;
  font-size: var(--fs-sec-q);
  text-indent: -.36em;
}
.sec-panel__lead { font-style: italic; font-weight: 700; margin-top: var(--sec-gap-lead); }
.sec-panel__text { color: var(--text-light-lavender); margin-top: var(--sec-gap-text); }
.sec-list { margin-top: var(--sec-gap-list); display: grid; gap: var(--sec-gap-item); }
.sec-item { display: grid; grid-template-columns: auto 1fr; column-gap: var(--sec-dot-gap); }
.sec-item::before {
  content: '';
  grid-column: 1; grid-row: 1;
  width: .75rem; height: .75rem; border-radius: 50%;
  background: var(--accent-secondary);
  margin-top: .38em;
}
.sec-item__title { grid-column: 2; }
.sec-item__text {
  grid-column: 2;
  color: var(--text-light-lavender);
  margin-top: var(--sec-gap-itemtext);
}

.security__link {
  display: block; text-align: center;
  margin-top: var(--sec-gap-link);
  color: var(--accent-secondary);
  transition: color var(--t) ease;
}
.security__link:hover { color: var(--accent-primary-1); }

@media (max-width: 1279px) {
  .sec-panel--left,
  .sec-panel--right { margin-inline: 0; }
}
@media (max-width: 799px) {
  .sec-panel--left,
  .sec-panel--right { grid-column: 1 / span 12; }
}
