:root {
  --paper-grain: url("data:image/svg+xml,<svg%20xmlns='http://www.w3.org/2000/svg'%20width='180'%20height='180'><filter%20id='p'><feTurbulence%20type='fractalNoise'%20baseFrequency='0.9'%20numOctaves='4'%20stitchTiles='stitch'/><feColorMatrix%20type='saturate'%20values='0'/></filter><rect%20width='180'%20height='180'%20filter='url(%23p)'%20opacity='0.055'/></svg>");
  --paper-grain-size: 180px 180px;

  --paper-bg: #0d1430;
  --paper-bg-hover: #121a3d;
  --paper-bg-sunken: #0a1029;

  --paper-edge: rgba(255, 255, 255, 0.1);
  --paper-edge-hover: rgba(134, 239, 172, 0.34);
  --paper-rule: rgba(255, 255, 255, 0.11);

  --paper-lift:
    inset 0 1px 0 rgba(255, 255, 255, 0.045),
    0 1px 1px rgba(0, 0, 0, 0.3),
    0 12px 24px -20px rgba(0, 0, 0, 0.95);
  --paper-lift-hover:
    inset 0 1px 0 rgba(255, 255, 255, 0.07),
    0 1px 1px rgba(0, 0, 0, 0.32),
    0 22px 40px -26px rgba(0, 0, 0, 1);
}

.sp-card,
.sp-cta,
.sp-special,
.cmp-col,
.cmp-note,
.n2-card,
.ui-card,
.service-card,
.ea-compare-card,
.ic-brief-card,
body .help-card,
body .svc-positioning {
  background-image: var(--paper-grain);
  background-size: var(--paper-grain-size);
  background-repeat: repeat;
  background-position: 0 0;
}

.sp-card {
  background-color: var(--paper-bg);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.sp-card:hover {
  background-color: var(--paper-bg-hover);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.075);
}

.sp-card--open {
  background-color: var(--paper-bg-sunken);
}

.sp-card--open:hover {
  background-color: var(--paper-bg);
}

.sp-grid {
  background: var(--paper-rule);
  border: 1px solid var(--paper-rule);
  box-shadow: var(--paper-lift);
}

.sp-cta,
.sp-special {
  background-color: var(--paper-bg);
  border-color: var(--paper-edge);
  border-top-color: var(--c-green);
  box-shadow: var(--paper-lift);
}

.sp-special-glow,
.sp-cta-glow,
body .svc-positioning-glow {
  display: none;
}

.sp-special-grid {
  opacity: 0.4;
}

.cmp-two {
  border: 1px solid var(--paper-rule);
  background: var(--paper-rule);
  gap: 1px;
  box-shadow: var(--paper-lift);
}

.cmp-col {
  background-color: var(--paper-bg);
}

.cmp-col + .cmp-col {
  border-left: 0;
}

.cmp-note {
  border: 1px solid var(--paper-edge);
  border-left: 3px solid var(--c-green);
  background-color: rgba(34, 197, 94, 0.045);
}

.n2-card {
  background-color: var(--paper-bg);
}

.ui-card,
.service-card,
.ea-compare-card,
body .svc-card,
body .help-card,
body .help-head,
body .svc-positioning,
body .home-refs-card {
  background-color: var(--paper-bg);
  border: 1px solid var(--paper-edge);
  box-shadow: var(--paper-lift);
}

body .svc-card,
body .help-head,
body .home-refs-card {
  background-image: none;
}

body .benefits-section .benefit-card {
  background-color: var(--paper-bg) !important;
  background-image: var(--paper-grain) !important;
  background-size: var(--paper-grain-size) !important;
  background-repeat: repeat !important;
  border: 1px solid var(--paper-edge) !important;
  box-shadow: var(--paper-lift);
}

.ui-card:hover,
.service-card:hover,
.ea-compare-card:hover,
body .svc-card:hover,
body .help-card:hover,
body .help-head:hover,
body .svc-positioning:hover,
body .home-refs-card:hover {
  background-color: var(--paper-bg-hover);
  border-color: var(--paper-edge-hover);
  box-shadow: var(--paper-lift-hover);
}

body .benefits-section .benefit-card:hover {
  background-color: var(--paper-bg-hover) !important;
  border-color: var(--paper-edge-hover) !important;
  box-shadow: var(--paper-lift-hover);
}

body .svc-card:hover,
body .help-card:hover {
  transform: translateY(-3px);
}

body .svc-card:hover,
body .help-head:hover,
body .home-refs-card:hover {
  background-image: none;
}

.ic-brief-card {
  background-color: rgba(34, 197, 94, 0.06);
  border: 1px solid rgba(34, 197, 94, 0.28);
  border-left: 3px solid var(--sp-green, var(--c-green));
  box-shadow: var(--paper-lift);
}

.ic-brief-card:hover,
.ic-brief-card:focus-visible {
  background-color: rgba(34, 197, 94, 0.1);
  border-color: rgba(34, 197, 94, 0.5);
  border-left-color: var(--sp-green, var(--c-green));
  box-shadow: var(--paper-lift-hover);
}

.sp-section--photo {
  background-color: rgba(255, 255, 255, 0.016);
  background-image: var(--paper-grain);
  background-size: var(--paper-grain-size);
  background-repeat: repeat;
  background-position: 0 0;
  border-top: 1px solid var(--paper-edge);
  border-bottom: 1px solid var(--paper-edge);
}

.sp-cta--photo,
.sp-special--photo {
  background-color: var(--paper-bg);
  background-image: var(--paper-grain);
  background-size: var(--paper-grain-size);
  background-repeat: repeat;
  background-position: 0 0;
  border-color: var(--paper-edge);
  border-top-color: var(--c-green);
  box-shadow: var(--paper-lift);
}

.sp-hero-photo {
  opacity: 0.15;
  filter: saturate(0.7) contrast(0.9);
}