/* Purpose-specific professional icons for every capability. */
.capIcon{position:relative;font-size:0}.capIcon:before{content:"";width:25px;height:25px;background:#fff;filter:drop-shadow(0 2px 2px rgba(0,0,0,.14))}
.capabilityCard:nth-child(1) .capIcon:before{-webkit-mask:url("assets/cap-universal.svg") center/contain no-repeat;mask:url("assets/cap-universal.svg") center/contain no-repeat}
.capabilityCard:nth-child(2) .capIcon:before{-webkit-mask:url("assets/cap-context.svg") center/contain no-repeat;mask:url("assets/cap-context.svg") center/contain no-repeat}
.capabilityCard:nth-child(3) .capIcon:before{-webkit-mask:url("assets/cap-review.svg") center/contain no-repeat;mask:url("assets/cap-review.svg") center/contain no-repeat}
.capabilityCard:nth-child(4) .capIcon:before{-webkit-mask:url("assets/cap-change.svg") center/contain no-repeat;mask:url("assets/cap-change.svg") center/contain no-repeat}
.capabilityCard:nth-child(5) .capIcon:before{-webkit-mask:url("assets/cap-family.svg") center/contain no-repeat;mask:url("assets/cap-family.svg") center/contain no-repeat}
.capabilityCard:nth-child(6) .capIcon:before{-webkit-mask:url("assets/cap-routing.svg") center/contain no-repeat;mask:url("assets/cap-routing.svg") center/contain no-repeat}
.capabilityCard:nth-child(7) .capIcon:before{-webkit-mask:url("assets/cap-source.svg") center/contain no-repeat;mask:url("assets/cap-source.svg") center/contain no-repeat}
.capabilityCard:nth-child(8) .capIcon:before{-webkit-mask:url("assets/cap-calendar.svg") center/contain no-repeat;mask:url("assets/cap-calendar.svg") center/contain no-repeat}
.capabilityCard:nth-child(9) .capIcon:before{-webkit-mask:url("assets/cap-multi-action.svg") center/contain no-repeat;mask:url("assets/cap-multi-action.svg") center/contain no-repeat}
.capabilityCard:nth-child(10) .capIcon:before{-webkit-mask:url("assets/cap-follow-through.svg") center/contain no-repeat;mask:url("assets/cap-follow-through.svg") center/contain no-repeat}
.capabilityCard:nth-child(11) .capIcon:before{-webkit-mask:url("assets/cap-duplicates.svg") center/contain no-repeat;mask:url("assets/cap-duplicates.svg") center/contain no-repeat}
.capabilityCard:nth-child(12) .capIcon:before{-webkit-mask:url("assets/cap-handoff.svg") center/contain no-repeat;mask:url("assets/cap-handoff.svg") center/contain no-repeat}
.capabilityCard:nth-child(9) .capIcon{background:linear-gradient(145deg,#367ef5,#245fc5)}.capabilityCard:nth-child(10) .capIcon{background:linear-gradient(145deg,#28c4a6,#138d78)}.capabilityCard:nth-child(11) .capIcon{background:linear-gradient(145deg,#9665e4,#653ab7)}.capabilityCard:nth-child(12) .capIcon{background:linear-gradient(145deg,#ff8b4c,#dc5a24)}

/* Matching real icons for the concrete input examples. */
.exampleChip i{position:relative;font-size:0}.exampleChip i:before{content:"";width:18px;height:18px;background:currentColor}
.exampleChip:nth-child(1) i:before{-webkit-mask:url("assets/example-newsletter.svg") center/contain no-repeat;mask:url("assets/example-newsletter.svg") center/contain no-repeat}
.exampleChip:nth-child(2) i:before{-webkit-mask:url("assets/example-flyer.svg") center/contain no-repeat;mask:url("assets/example-flyer.svg") center/contain no-repeat}
.exampleChip:nth-child(3) i:before{-webkit-mask:url("assets/example-text.svg") center/contain no-repeat;mask:url("assets/example-text.svg") center/contain no-repeat}
.exampleChip:nth-child(4) i:before{-webkit-mask:url("assets/example-schedule.svg") center/contain no-repeat;mask:url("assets/example-schedule.svg") center/contain no-repeat}
.exampleChip:nth-child(5) i:before{-webkit-mask:url("assets/example-voice.svg") center/contain no-repeat;mask:url("assets/example-voice.svg") center/contain no-repeat}
.exampleChip:nth-child(6) i:before{-webkit-mask:url("assets/example-appointment.svg") center/contain no-repeat;mask:url("assets/example-appointment.svg") center/contain no-repeat}

/* Realistic fictional family avatars inside the hero phone. */
.familyRow span>i{width:34px!important;height:34px!important;border:2px solid rgba(255,255,255,.76);color:transparent!important;font-size:0!important;background-color:transparent!important;background-image:url("assets/family-avatar-sprite.png")!important;background-size:400% 100%!important;background-repeat:no-repeat!important;box-shadow:0 4px 10px rgba(0,0,0,.28)}
.familyRow span:nth-child(1)>i{background-position:0 50%!important}.familyRow span:nth-child(2)>i{background-position:33.333% 50%!important}.familyRow span:nth-child(3)>i{background-position:66.666% 50%!important}.familyRow span:nth-child(4)>i{background-position:100% 50%!important}

/* Early-access form: useful segmentation without making signup feel invasive. */
#signup{grid-template-columns:1fr 1fr;gap:16px 14px}#signup label{margin:0}#signup .formFull,#signup button,#signup #success{grid-column:1/-1}#signup label>small{display:inline;margin:0 0 0 5px;color:#8a98aa;font-weight:500}textarea{display:block;width:100%;min-height:92px;margin-top:7px;padding:12px;border:1px solid var(--line);border-radius:10px;font:inherit;resize:vertical;color:var(--ink)}textarea:focus,input:focus,select:focus{outline:3px solid rgba(52,120,255,.16);border-color:#6f9fff}@media(max-width:620px){#signup{grid-template-columns:1fr}#signup .formFull,#signup button,#signup #success{grid-column:auto}}