.seal-process {
  padding: 50px 0 50px;
  background: linear-gradient(180deg, #fff, #f7faff);
}
.seal-process-header { max-width: 1040px; margin: 0 auto 44px; text-align: center; }
.seal-process-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 20px;
  color: #e7492c;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.seal-process-eyebrow::before,
.seal-process-eyebrow::after { content: ""; height: 1px; width: 48px; background: currentColor; }
.seal-process-header h2 {
  font-family: var(--font_poppins), sans-serif;
  font-size: clamp(28px, 3.1vw, 42px);
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: -1px;
  color: #07224b;
}
.seal-process-header p { max-width: 810px; margin: 20px auto 0; font-size: 17px; line-height: 1.8; color: #52647b; }
.seal-process-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 36px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.seal-process-step { position: relative; text-align: center; min-width: 0; }
.seal-process-step:not(:last-child)::after {
  content: "";
  position: absolute;
  width: 50px;
  height: 12px;
  top: 64px;
  left: calc(100% - 7px);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 12'%3E%3Cpath d='M0 6h46' stroke='%23b9c8d8' stroke-width='2' stroke-dasharray='4 4'/%3E%3Cpath d='m42 1 5 5-5 5' fill='none' stroke='%23b9c8d8' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
}
.seal-process-visual {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 140px;
  height: 140px;
  margin: 0 auto 22px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #f4faff, #dfedfc);
  box-shadow: inset 0 0 0 1px #07224b04;
  transition: transform 300ms ease, box-shadow 300ms ease;
}
.seal-process-step:nth-child(2) .seal-process-visual { background: radial-gradient(circle at 35% 30%, #fffaf1, #f9ecdb); }
.seal-process-step:nth-child(3) .seal-process-visual { background: radial-gradient(circle at 35% 30%, #f1fff9, #daf5e9); }
.seal-process-step:nth-child(4) .seal-process-visual { background: radial-gradient(circle at 35% 30%, #faf9ff, #e8e5fc); }
.seal-process-visual > i { font-size: 50px; color: #285c91; filter: drop-shadow(0 3px 0 #07224b12); }
.seal-process-number {
  position: absolute;
  top: 0;
  left: 0;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: #e7492c;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 5px 14px #e7492c1a;
}
.seal-process-mini {
  position: absolute;
  bottom: 10px;
  right: 8px;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: #fff;
  color: #285c91;
  font-size: 18px;
  box-shadow: 0 8px 20px #07224b14;
  transform: rotate(-8deg);
}
.seal-process-step h3 { font-family: var(--font_poppins), sans-serif; font-size: 21px; font-weight: 700; line-height: 1.4; margin: 0 auto 14px; color: #07224b; }
.seal-process-step p { font-size: 15px; line-height: 1.8; color: #52647b; max-width: 295px; margin: 0 auto; }
.seal-process-step.is-revealed { animation: seal-process-reveal 700ms both; }
@keyframes seal-process-reveal { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@media (hover: hover) {
  .seal-process-step:hover .seal-process-visual { transform: translateY(-6px); box-shadow: 0 16px 30px #07224b0d; }
}
@media (max-width: 1199px) {
  .seal-process-grid { gap: 28px; }
  .seal-process-visual { width: 128px; height: 128px; }
  .seal-process-visual > i { font-size: 46px; }
  .seal-process-step:not(:last-child)::after { top: 58px; width: 36px; left: calc(100% - 4px); }
  .seal-process-step h3 { font-size: 18px; }
  .seal-process-mini { bottom: 6px; right: 4px; }
}
@media (max-width: 991px) {
  .seal-process { padding: 68px 0; }
  .seal-process-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 44px 32px; }
  .seal-process-step:not(:last-child)::after { display: none; }
  .seal-process-header { margin-bottom: 44px; }
}
@media (max-width: 575px) {
  .seal-process { padding: 52px 0; }
  .seal-process-grid { grid-template-columns: 1fr; gap: 36px; }
  .seal-process-header p { font-size: 15px; }
  .seal-process-eyebrow { gap: 12px; font-size: 12px; }
  .seal-process-eyebrow::before, .seal-process-eyebrow::after { width: 28px; }
  .seal-process-visual { margin-bottom: 20px; }
  .seal-process-step h3 { max-width: 300px; font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .seal-process-step.is-revealed { animation: none; }
  .seal-process-visual { transition: none; }
  .seal-process-step:hover .seal-process-visual { transform: none; }
}