@media (min-width: 981px) {
  .hero-grid { align-items: start; }
}
.hero-media { margin: 0; }
.restored-plant-leaves { transform-origin: 202px 699px; animation: restored-plant-sway 3.333333s ease-in-out infinite; }
.caller-popup { opacity: 0; animation: caller-message 6.666667s ease-in-out infinite; }
.caller-popup-two { animation-delay: 2.222222s; }
.caller-popup-three { animation-delay: 4.444444s; }
.caller-popup-one { --popup-fill: #c6f2dc; --popup-border: #37ac78; --popup-ink: #136b46; --popup-badge: #99e3bd; }
.caller-popup-two { --popup-fill: #e4d6ff; --popup-border: #9870db; --popup-ink: #6439a4; --popup-badge: #c9aff3; }
.caller-popup-three { --popup-fill: #ffe4a1; --popup-border: #dfa332; --popup-ink: #885311; --popup-badge: #f7ca68; }
.caller-popup > path:first-child { fill: var(--popup-fill); stroke: var(--popup-border); }
.caller-popup > circle { fill: var(--popup-badge); }
.caller-popup > path:not(:first-child) { stroke: var(--popup-ink); }
@keyframes restored-plant-sway { 0%,100% { transform: rotate(-1.5deg); } 50% { transform: rotate(1.5deg); } }
@keyframes caller-message { 0%,3%,30%,100% { opacity: 0; transform: translateY(9px); } 7%,25% { opacity: 1; transform: translateY(0); } }
.hero { position: relative; isolation: isolate; overflow: hidden; }
.hero-network { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; max-width: none; pointer-events: none; opacity: .72; }
.hero-grid,
.hero .proof-strip { position: relative; z-index: 1; }
.hero-doodle-frame { background: #fbfcfa; cursor: default; min-height: 0; border: 1px solid #e0e8e2; border-radius: 18px; }
.hero-doodle-frame .media-caption { position: relative; inset: auto; margin: 0 16px 16px; }
.hero-doodle { display: block; width: 100%; height: auto; min-height: 0; overflow: hidden; }
.hero-head-response { --head-x: 0px; --head-y: 0px; --head-angle: 0deg; transform: translate(var(--head-x), var(--head-y)) rotate(var(--head-angle)); transform-origin: 284px 168px; transition: transform .22s ease-out; }
.hero-head-response, .hero-head-talk { transform-origin: 314px 206px; }
.hero-head-talk { animation: hero-head-talk 4.2s ease-in-out infinite; }
.hero-face-details { --gaze-x: 0px; --gaze-y: 0px; transform: translate(var(--gaze-x), var(--gaze-y)); transition: transform .18s ease-out; }
.hero-mouth { transform-box: fill-box; transform-origin: center; animation: hero-mouth 1.05s ease-in-out infinite; }
.hero-hand-gesture { transform-origin: 333px 240px; animation: hero-hand-gesture 7.5s ease-in-out infinite; }
.hero-screen-card { transform-box: fill-box; transform-origin: center; animation: hero-screen-pulse 3s ease-in-out infinite; }
.hero-screen-card-two { animation-delay: -.8s; }
.hero-screen-card-three { animation-delay: -1.6s; }
.hero-call-face { transform-box: fill-box; transform-origin: center; animation: hero-blink 5.3s linear infinite; }
.hero-call-face-two { animation-delay: -2.4s; }
.hero-chat-bubble { opacity: 0; transform-origin: 135px 128px; animation: hero-chat 8s ease-in-out infinite; }
.hero-signal rect { transform-box: fill-box; transform-origin: bottom; animation: hero-signal 2.2s ease-in-out infinite; }
.hero-signal .signal-two { animation-delay: -.25s; }
.hero-signal .signal-three { animation-delay: -.5s; }
.hero-signal .signal-four { animation-delay: -.75s; }
.clock-hour { transform-origin: 385px 77px; animation: hero-clock 720s linear infinite; }
.clock-minute { transform-origin: 385px 77px; animation: hero-clock 60s linear infinite; }
.hero-plant { transform-origin: 78px 350px; animation: hero-plant 4.8s ease-in-out infinite; }
.hero-note { transform-box: fill-box; transform-origin: center; animation: hero-note 4s ease-in-out infinite; }
.hero-note-two { animation-delay: -1.3s; }
.hero-note-three { animation-delay: -2.6s; }
.hero-lamp-glow { opacity: .35; animation: hero-lamp 4.5s ease-in-out infinite; }
.hero-notification { opacity: 0; transform-origin: 223px 251px; animation: hero-notification 9s ease-in-out infinite; }
.hero-doodle.is-engaged .hero-chat-bubble { animation-duration: 5.5s; }
@keyframes hero-head-talk { 0%, 100% { transform: rotate(0deg) translateY(0); } 28% { transform: rotate(-1.2deg) translateY(-1px); } 62% { transform: rotate(1deg) translateY(.8px); } }
@keyframes hero-mouth { 0%, 100% { transform: scaleY(.65); } 45% { transform: scaleY(1.25); } 72% { transform: scaleY(.85); } }
@keyframes hero-hand-gesture { 0%, 60%, 100% { transform: rotate(12deg); } 70%, 85% { transform: rotate(-9deg); } 78% { transform: rotate(-2deg); } }
@keyframes hero-screen-pulse { 0%, 100% { opacity: .45; transform: scale(.96); } 50% { opacity: .9; transform: scale(1.03); } }
@keyframes hero-blink { 0%, 44%, 47%, 100% { transform: scaleY(1); } 45%, 46% { transform: scaleY(.08); } }
@keyframes hero-chat { 0%, 18%, 55%, 100% { opacity: 0; transform: translateY(5px) scale(.9); } 24%, 47% { opacity: .88; transform: translateY(0) scale(1); } }
@keyframes hero-signal { 0%, 100% { opacity: .28; transform: scaleY(.55); } 50% { opacity: .9; transform: scaleY(1); } }
@keyframes hero-clock { to { transform: rotate(360deg); } }
@keyframes hero-plant { 0%, 100% { transform: rotate(-.8deg); } 50% { transform: rotate(1deg); } }
@keyframes hero-note { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-2px) rotate(1.5deg); } }
@keyframes hero-lamp { 0%, 100% { opacity: .25; } 50% { opacity: .62; } }
@keyframes hero-notification { 0%, 70%, 100% { opacity: 0; transform: translateY(8px) scale(.92); } 75%, 92% { opacity: 1; transform: translateY(0) scale(1); } }
@media (prefers-reduced-motion: reduce) {
  .hero-network { opacity: .55; }
  .hero-doodle * { animation: none !important; transition: none !important; }
}
@media (max-width: 980px) {
  .hero-doodle { min-height: 0; }
}
@media (max-width: 680px) {
  .hero-doodle { min-height: 0; }
}
