/* Supplied HowItWorks design adapted to semantic HTML: pinned notes and a moving dashed route. */
.voice-build { padding:clamp(4rem,8vw,8rem) clamp(1.25rem,6vw,6rem); background:#eef4ff; color:#0d2545; }
.voice-build__inner { max-width:68rem; margin:auto; }
.voice-build h2 { max-width:20ch; margin:0 0 2rem; font-size:clamp(2.5rem,4.5vw,4.5rem); line-height:1.08; letter-spacing:-.04em; }
.voice-build p { max-width:65ch; margin:0; color:#395575; font-size:clamp(1.05rem,1.5vw,1.2rem); line-height:1.8; }
.voice-build__detail { margin-top:3rem; padding-top:2rem; border-top:1px solid #c8d6e9; }
.voice-build__detail h3 { margin:0 0 1rem; font-size:clamp(1.5rem,2.5vw,2rem); line-height:1.2; letter-spacing:-.025em; }
.voice-systems { grid-column:1/-1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.5rem; }
.voice-systems article { padding:1.75rem; border-radius:16px; background:#edf4ff; }
.voice-systems article:nth-child(2) { background:#eee5fc; }
.voice-systems article:nth-child(3) { background:#e2f4eb; }
.voice-systems article:nth-child(4) { background:#fff4d9; }
.voice-systems h3 { margin:0 0 1rem; font-size:1.35rem; letter-spacing:-.02em; }
.voice-systems p { margin:0; color:#395575; font-size:1rem; line-height:1.7; }
@media(max-width:1000px) { .voice-systems { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:560px) { .voice-systems { grid-template-columns:1fr; } }
.call-recovery { margin-top: 7rem; padding: clamp(3rem,6vw,6rem) clamp(1rem,4vw,4rem); background: white; color: #0d2545; border-radius: 24px; scroll-margin-top: 90px; }
.call-recovery__intro { max-width: 780px; margin: 0 auto 4rem; text-align: center; }
.call-recovery__intro h2 { margin: 0 0 1.5rem; font-size: clamp(2.5rem,4.7vw,4.7rem); line-height: 1.06; letter-spacing: -.035em; text-wrap: balance; }
.call-recovery__intro h2 span { color: #1766f5; }
.call-recovery__intro p { max-width: 65ch; margin: auto; color: #395575; font-size: 1.05rem; line-height: 1.7; }
.call-recovery__board { position: relative; max-width: 1000px; margin: auto; }
.call-recovery__path { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.call-recovery__path path { fill: none; stroke: #9aaac1; stroke-width: 2; stroke-dasharray: 8 6; animation: recovery-route 3s linear infinite; }
.call-recovery__steps { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 0 12%; list-style: none; margin: 0; padding: 0 4%; }
.call-recovery__card { --note: #edf4ff; --accent: #1957bd; position: relative; width: 100%; padding: 12px; background: #fff; border-radius: 25px; box-shadow: 0 10px 24px #17304d1c; transform: rotate(4deg); transition: transform .25s ease-out; }
.call-recovery__card:nth-child(odd) { grid-column: 1; }
.call-recovery__card:nth-child(1) { grid-row: 1; }
.call-recovery__card:nth-child(2) { grid-row: 2; }
.call-recovery__card:nth-child(3) { grid-row: 3; }
.call-recovery__card:nth-child(4) { grid-row: 4; }
.call-recovery__card:nth-child(5) { grid-row: 5; }
.call-recovery__card:nth-child(even) { grid-column: 2; transform: rotate(-4deg); }
.call-recovery__card:not(:first-child) { margin-top: -75px; }
.call-recovery__card:hover { transform: rotate(0deg) scale(1.025); z-index: 1; }
.call-recovery__card--orange { --note: #fff1df; --accent: #a95308; }
.call-recovery__card--purple { --note: #f1e8ff; --accent: #7140ba; }
.call-recovery__pin { display: block; width: 28px; height: 28px; margin: 2px auto 14px; fill: none; stroke: var(--accent); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.call-recovery__paper { background: var(--note); padding: 24px; border-radius: 15px; }
.call-recovery__number { display: block; color: var(--accent); font-size: 2.3rem; font-weight: 650; margin-bottom: 16px; }
.call-recovery__paper h3 { font-size: 1.5rem; line-height: 1.15; letter-spacing: -.025em; margin: 0 0 12px; }
.call-recovery__paper p { margin: 0; color: #39506c; font-size: .98rem; line-height: 1.65; }
@keyframes recovery-route { to { stroke-dashoffset: -140; } }
@media (max-width: 760px) {
  .call-recovery { margin-top: 3rem; padding: 2rem .75rem; }
  .call-recovery__intro { margin-bottom: 1.75rem; }
  .call-recovery__intro h2 { margin-bottom: 1rem; font-size: clamp(2.1rem, 9vw, 3rem); }
  .call-recovery__intro p { font-size: .92rem; line-height: 1.5; }
  .call-recovery__steps { grid-template-columns: 1fr; gap: 1.25rem; padding: 0; }
  .call-recovery__card:nth-child(n) { grid-column: 1; margin-top: 0; transform: none; }
  .call-recovery__path { display: none; }
  .call-recovery__card { padding: 8px; border-radius: 20px; }
  .call-recovery__card:not(:last-child)::after { content: ""; position: absolute; bottom: -1.25rem; left: 50%; height: 1.25rem; border-left: 2px dashed #9aaac1; }
  .call-recovery__pin { width: 22px; height: 22px; margin: 0 auto 8px; }
  .call-recovery__paper { padding: 16px; border-radius: 12px; }
  .call-recovery__number { margin-bottom: 8px; font-size: 1.85rem; }
  .call-recovery__paper h3 { margin-bottom: 8px; font-size: 1.18rem; line-height: 1.08; }
  .call-recovery__paper p { font-size: .88rem; line-height: 1.45; }
}
@media (prefers-reduced-motion: reduce) {
  .call-recovery__path path { animation: none; }
  .call-recovery__card { transition: none; }
}
