/*
  SENCHI GLOBAL LLC | Animated process cards (2026-11-05)
  An additive layer: applies only to the four process cards and the process note.
  Brand palette: #007474 teal, #C4FFDD mint, #FFFFFF white, #BA6316 copper.
*/
#process .process-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: stretch;
  gap: 16px;
}
#process .process-card {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  min-height: 454px;
  border-radius: 24px;
  padding: 25px 23px 22px;
  background: #FFFFFF !important;
  border: 1px solid rgba(0,116,116,.24) !important;
  box-shadow: 0 14px 38px rgba(0,68,68,.11), 0 3px 8px rgba(0,68,68,.04) !important;
  overflow: visible;
  transition: box-shadow .3s ease, transform .3s ease, border-color .3s ease, opacity .75s ease;
}
#process .process-card:hover {
  transform: translateY(-7px);
  border-color: #007474 !important;
  box-shadow: 0 24px 50px rgba(0,80,78,.19), 0 5px 11px rgba(0,80,78,.07) !important;
}
#process .process-card:not(:last-child)::after {
  content: '→';
  position: absolute;
  right: -14px;
  top: 45%;
  z-index: 4;
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  padding: 0;
  border-radius: 999px;
  border: 1px solid rgba(0,116,116,.2);
  background: #FFFFFF !important;
  color: #007474 !important;
  font-size: 16px;
  font-weight: 800;
}
#process .process-card__top {display:flex;justify-content:space-between;align-items:center;gap:6px;}
#process .process-card__number {font-size:19px;letter-spacing:.14em;font-weight:900;color:#BA6316 !important;}
#process .process-card__tag {
  display:inline-flex;align-items:center;justify-content:center;
  border:1px solid rgba(0,116,116,.23);border-radius:999px;
  padding:5px 9px;background:#C4FFDD;color:#007474;
  font-size:9px;letter-spacing:.13em;font-weight:850;
}
#process .process-card__icon {
  width:76px;height:76px;min-height:76px;
  display:grid;place-items:center;isolation:isolate;position:relative;
  margin:22px 0 20px;border-radius:22px;
  background:#C4FFDD !important;color:#007474 !important;
  border:1px solid rgba(0,116,116,.12);
  box-shadow: 0 9px 24px rgba(0,116,116,.1);
}
#process .process-card__icon .process-icon-svg {
  position:relative;z-index:2;width:38px;height:38px;
  color:#007474 !important;
  animation:senchiProcessFloat 3.8s ease-in-out infinite;
}
#process .process-card--02 .process-icon-svg {animation-delay:-.8s;}
#process .process-card--03 .process-icon-svg {animation-delay:-1.6s;}
#process .process-card--04 .process-icon-svg {animation-delay:-2.4s;}
#process .process-card__halo {
  position:absolute;inset:4px;border:1px solid rgba(0,116,116,.25);
  border-radius:19px;animation:senchiProcessPulse 3.7s ease-in-out infinite;
}
#process .process-card__twinkle {
  position:absolute;right:-10px;top:-11px;color:#BA6316;font-size:20px;
  line-height:1;z-index:3;animation:senchiProcessSparkle 3.5s ease-in-out infinite;
}
#process .process-card h3 {font-size:clamp(18px,1.65vw,23px);line-height:1.22;letter-spacing:-.045em;margin:0 0 12px;color:#007474 !important;}
#process .process-card .process-card__description {
  margin:0 0 19px;font-size:12px;line-height:1.77;color:#007474 !important;
}
#process .process-card__list-label {font-size:9px;line-height:1.3;letter-spacing:.15em;font-weight:900;color:#BA6316;margin-bottom:11px;}
#process .process-card__list {margin:0 0 23px;padding:0;display:grid;gap:10px;list-style:none;}
#process .process-card__list li {display:flex;align-items:flex-start;gap:8px;color:#005e5e;font-size:11.5px;line-height:1.55;}
#process .process-card__list li .icon {
  flex:0 0 15px;width:15px;height:15px;margin-top:1px;
  border-radius:50%;padding:2px;background:#C4FFDD;color:#007474 !important;
}
#process .process-card__outcome {
  display:grid;gap:5px;margin-top:auto;padding:13px 12px;
  background:#C4FFDD;border-radius:12px;
  border-left:3px solid #BA6316;
}
#process .process-card__outcome span {color:#007474;font-size:8px;letter-spacing:.13em;font-weight:850;}
#process .process-card__outcome strong {color:#007474;font-size:11.5px;line-height:1.45;}
#process .process-section__note {
  display:flex;justify-content:space-between;align-items:center;gap:18px;
  margin-top:27px;padding:16px 21px;border-radius:16px;
  background:#FFFFFF;border:1px solid rgba(0,116,116,.18);
}
#process .process-section__note>span {display:flex;gap:10px;align-items:center;color:#007474;font-size:12px;line-height:1.5;}
#process .process-section__note>span .icon {flex-shrink:0;color:#BA6316;}
#process .process-section__note>a {
  flex-shrink:0;display:flex;align-items:center;gap:5px;
  text-decoration:none;color:#007474;font-weight:800;font-size:12px;
  border-bottom:1px solid #BA6316;padding:5px 1px;
}
#process .process-section__note>a:hover {color:#BA6316;}
@keyframes senchiProcessFloat {0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-5px) rotate(4deg)}}
@keyframes senchiProcessPulse {0%,100%{transform:scale(.94);opacity:.45}50%{transform:scale(1.05);opacity:1}}
@keyframes senchiProcessSparkle {0%,100%{transform:rotate(-15deg) scale(.8);opacity:.6}50%{transform:rotate(18deg) scale(1.2);opacity:1}}
@media (max-width: 1100px) {
  #process .process-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
  #process .process-card {min-height:430px;padding:26px;}
  #process .process-card:not(:last-child)::after {display:none;}
  #process .process-card h3 {font-size:22px;}
  #process .process-card .process-card__description {font-size:13px;}
  #process .process-card__list li {font-size:12.5px;}
}
@media (max-width:560px) {
  #process .process-grid {grid-template-columns:1fr;gap:15px;}
  #process .process-card {min-height:0;padding:23px 22px;}
  #process .process-card__icon {width:66px;height:66px;min-height:66px;margin:17px 0 18px;}
  #process .process-card h3 {font-size:22px;}
  #process .process-card__list {gap:9px;}
  #process .process-section__note {align-items:flex-start;flex-direction:column;padding:18px;}
}
@media (prefers-reduced-motion:reduce) {
  #process .process-card__icon .process-icon-svg,
  #process .process-card__halo,
  #process .process-card__twinkle {animation:none!important;}
  #process .process-card:hover {transform:none;}
}