/* Dedicated shared inbox preview. Flat surfaces, clear hierarchy, one sequenced motion. */
.hero .inbox-preview{--preview-ink:#173d30;--preview-muted:#74867b;--preview-paper:#fff;--preview-line:#e1e8df;color:var(--preview-ink)}
.hero .inbox-preview .reminder-badge{font-size:9px;letter-spacing:1.5px;border-color:var(--preview-line)}
.hero .inbox-preview .reminder-flow{height:530px}
.hero .inbox-preview .reminder-window{height:530px;border-radius:20px;border-color:var(--preview-line);box-shadow:0 16px 48px #143b2a0c}
.hero .inbox-preview .reminder-browser{height:48px;background:#f6f7f3;border-color:var(--preview-line);padding:12px 18px}
.hero .inbox-preview .reminder-browser>span{border:0;background:transparent;font-size:9px;color:var(--preview-muted)}
.hero .inbox-preview .reminder-browser:after{display:none}
.hero .inbox-preview .reminder-browser>b{margin-left:auto;font:8px monospace;letter-spacing:1px;color:#7e9182}
.hero .inbox-preview .reminder-content{height:482px;padding:24px}
.hero .inbox-preview .inbox-overline{display:block;font-size:8px;letter-spacing:1.5px;color:#728578;margin-bottom:6px}
.hero .inbox-preview .reminder-title h3{font-size:25px;font-weight:600;letter-spacing:-.8px}
.hero .inbox-preview .reminder-title>span{padding:6px 9px;background:#edf7ef;color:#34764c;font-size:9px}
.hero .inbox-preview .reminder-content>p{font-size:11px;margin:7px 0 18px}
.hero .inbox-preview .inbox-thread-head{display:flex;align-items:center;gap:10px;padding:13px 0;border-top:1px solid var(--preview-line)}
.hero .inbox-preview .inbox-person-avatar{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#e7eee4;color:#365b40;font-size:10px;font-weight:600}
.hero .inbox-preview .inbox-thread-head>div{display:grid;gap:4px}
.hero .inbox-preview .inbox-person-name{font-size:12px;font-weight:600}
.hero .inbox-preview .inbox-person-channel{font-size:9px;color:var(--preview-muted)}
.hero .inbox-preview .inbox-assignment{margin-left:auto;font-size:9px;color:#728578}
.hero .inbox-preview .reminder-progress{height:3px;background:#ecf0e9;margin:0 0 15px}
.hero .inbox-preview .reminder-template{height:98px;margin:0;padding:14px 16px;background:#f3f5ef;border:1px solid #e7ece2;border-radius:3px 14px 14px;box-shadow:none!important}
.hero .inbox-preview .reminder-template small{font-size:8px;letter-spacing:1px;color:#7b8e7d}
.hero .inbox-preview .reminder-template p{font-size:12px;line-height:1.5;margin:9px 0;color:var(--preview-ink)}
.hero .inbox-preview .reminder-template>span{font-size:8px;color:#62816b}
.hero .inbox-preview .inbox-reply-preview{display:flex;gap:8px;justify-content:flex-end;align-items:center;margin-top:12px;opacity:0;transform:translateY(6px);transition:opacity .4s ease,transform .4s ease}
.hero .inbox-preview[data-inbox-phase=ready] .inbox-reply-preview{opacity:1;transform:none}
.hero .inbox-preview .inbox-reply-preview>span{color:#9aae9b}
.hero .inbox-preview .inbox-reply-preview p{margin:0;background:#e5f4e7;color:#2c5638;padding:12px 14px;border-radius:12px 3px 12px 12px;font-size:11px}
.hero .inbox-preview .inbox-reply-preview small{display:flex;justify-content:space-between;gap:30px;margin-top:8px;font-size:8px;color:#719176}
.hero .inbox-preview .reminder-metrics{bottom:22px;left:24px;right:24px;gap:9px;grid-template-columns:repeat(3,minmax(0,1fr)) 36px;border-top:1px solid var(--preview-line);padding-top:14px}
.hero .inbox-preview .reminder-metrics>div{height:52px;border:0;border-radius:0;background:transparent!important;padding:0;text-align:left}
.hero .inbox-preview .reminder-metrics small{font-size:7px;letter-spacing:1px;color:#7c8d80}
.hero .inbox-preview .reminder-metrics strong{display:block;font-size:21px;font-weight:500;letter-spacing:-.5px;color:var(--preview-ink)}
.hero .inbox-preview .reminder-metrics>div:last-of-type strong{font-size:17px;line-height:1.9}
.hero .inbox-preview .reminder-send{width:36px;height:36px;animation:none;border-radius:10px;background:#1b4935}
.hero .inbox-preview .reminder-send svg{width:20px;height:20px}
.hero .inbox-preview .reminder-channels{height:510px;gap:20px}
.hero .inbox-preview .reminder-channel{height:112px;padding:15px 17px;border-radius:15px;border-color:var(--preview-line);box-shadow:0 4px 12px #143b2a04;animation:none;transition:border-color .4s,box-shadow .4s}
.hero .inbox-preview .reminder-channel.channel-syncing{transform:none;border-color:#82c998;box-shadow:0 0 0 3px #1bc45b0a,0 8px 24px #143b2a09}
.hero .inbox-preview .reminder-channel small{font-size:7px;letter-spacing:1px;color:#8b9b8d;animation:none}
.hero .inbox-preview .reminder-channel p{background:transparent;padding:6px 0 0;margin:5px 0 0;white-space:normal;min-height:0;font-size:11px;line-height:1.5}
.hero .inbox-preview .reminder-channel p b{margin-right:5px;font-weight:600;color:#476551}
.hero .inbox-preview .reminder-channel p span{color:#7b897e}
.hero .inbox-preview .brand-icon{display:grid!important;place-items:center;width:29px;height:29px;flex-shrink:0;background:transparent!important}
.hero .inbox-preview .brand-instagram{color:#d34389!important}
.hero .inbox-preview .brand-whatsapp{color:#14b857!important}
.hero .inbox-preview .brand-facebook{color:#1877f2!important}
.hero .inbox-preview .brand-telegram{color:#24a6dc!important}
.hero .inbox-preview .reminder-checks{gap:14px}
.hero .inbox-preview .rsvp-card{height:156px;border-color:var(--preview-line);border-radius:18px;padding:16px 10px;animation:none}
.hero .inbox-preview .routing-mark{display:grid;width:32px;height:32px;place-items:center;margin:0 auto 12px;border-radius:10px;background:#1b4935;color:white;font-size:23px;font-weight:600;letter-spacing:-2px}
.hero .inbox-preview .rsvp-card small{font-size:8px;letter-spacing:1px}
.hero .inbox-preview .rsvp-card strong{font-size:28px;line-height:1.4;letter-spacing:-1px}
.hero .inbox-preview .rsvp-card>span:last-child{font-size:7px;letter-spacing:1px}
.hero .inbox-preview .checks-card{height:154px;border-color:var(--preview-line);border-radius:15px;box-shadow:none!important;padding:17px 15px}
.hero .inbox-preview .checks-card small{font-size:7px;letter-spacing:.8px}
.hero .inbox-preview .checks-card p{animation:none;color:#809081;transition:color .4s;font-size:11px}
.hero .inbox-preview[data-inbox-phase=ready] .checks-card p{color:#277848}
.hero .inbox-preview .reminder-connector path{stroke:#d7e6d8;stroke-width:1.5}
.hero .inbox-preview .reminder-connector .reminder-signal{animation:none;opacity:0;stroke:#1bc45b;stroke-width:3;stroke-dasharray:18 282}
.hero .inbox-preview[data-inbox-phase=routing] .reminder-signal.is-active{animation:preview-route 1.4s ease-in-out both;opacity:1}
@keyframes preview-route{0%{stroke-dashoffset:300;opacity:0}15%{opacity:1}85%{opacity:1}100%{stroke-dashoffset:0;opacity:0}}
.hero .inbox-preview[data-inbox-phase=received] .reminder-template{animation:preview-message-enter .45s ease both;background:#f3f5ef}
@keyframes preview-message-enter{from{opacity:.3;transform:translateY(7px)}to{opacity:1;transform:none}}
.hero .inbox-preview .reminder-bottom{border-color:var(--preview-line);background:transparent;box-shadow:none}
.hero .inbox-preview .reminder-bottom p{font-size:14px;font-family:inherit}
.hero .inbox-preview .reminder-bottom:after{display:none}
.hero .inbox-preview .reminder-bottom>small{margin-left:auto;font:7px monospace;letter-spacing:1px;color:#91a08f}
html[data-theme=dark] .hero .inbox-preview{--preview-ink:#e0ecdf;--preview-muted:#a0b59f;--preview-paper:#1b3324;--preview-line:#39523c}
html[data-theme=dark] .hero .inbox-preview :is(.reminder-window,.reminder-channel,.rsvp-card,.checks-card){background:#1b3324!important}
html[data-theme=dark] .hero .inbox-preview :is(.reminder-browser,.reminder-template){background:#243d2a!important}
html[data-theme=dark] .hero .inbox-preview .inbox-reply-preview p{background:#2b5134;color:#dcf0dc}
@media(min-width:761px) and (max-width:1150px){.hero .inbox-preview .reminder-content{padding:18px 14px}.hero .inbox-preview .reminder-title h3{font-size:21px}.hero .inbox-preview .reminder-title>span{display:none}.hero .inbox-preview .reminder-channel{padding:13px 10px}.hero .inbox-preview .reminder-channel strong{font-size:11px}.hero .inbox-preview .reminder-channel p{font-size:10px}.hero .inbox-preview .reminder-metrics{left:14px;right:14px;grid-template-columns:repeat(3,minmax(0,1fr))}.hero .inbox-preview .reminder-send{display:none}.hero .inbox-preview .inbox-assignment{display:none}}
@media(max-width:760px){.hero .inbox-preview .reminder-flow{height:auto;row-gap:26px}.hero .inbox-preview .reminder-window{height:530px}.hero .inbox-preview .reminder-content{height:482px;padding:22px 18px}.hero .inbox-preview .reminder-metrics{left:18px;right:18px;grid-template-columns:repeat(3,minmax(0,1fr))}.hero .inbox-preview .reminder-channel{height:102px;padding:12px}.hero .inbox-preview .reminder-channels{height:438px;grid-template-rows:repeat(4,102px);gap:10px}.hero .inbox-preview .reminder-connector{height:438px}.hero .inbox-preview .reminder-channel p{font-size:10px}.hero .inbox-preview .reminder-channel strong{font-size:11px}.hero .inbox-preview .reminder-bottom>small{display:none}.hero .inbox-preview .rsvp-card small{font-size:6px}.hero .inbox-preview .checks-card{padding:14px 8px}.hero .inbox-preview .checks-card p{font-size:9px}.hero .inbox-preview .routing-mark{margin-bottom:9px}.hero .inbox-preview .rsvp-card>span:last-child{font-size:6px}}
@media(prefers-reduced-motion:reduce){.hero .inbox-preview *{animation:none!important;transition:none!important}.hero .inbox-preview .inbox-reply-preview{opacity:1;transform:none}}

/* Recognisable channel chat windows and the application's conversation rail. */
@media(min-width:761px){.hero .inbox-preview .reminder-flow{grid-template-columns:minmax(0,600fr) minmax(0,250fr) minmax(0,70fr) minmax(0,340fr);height:648px}.hero .inbox-preview .reminder-checks{padding-left:35px}.hero .inbox-preview .reminder-checks:after{width:30px}}
.hero .inbox-preview .reminder-window{position:relative;height:648px}
.hero .inbox-preview .reminder-content{height:600px;margin-left:122px;padding:20px 18px}
.hero .inbox-preview .preview-conversation-list{position:absolute;left:0;top:48px;bottom:0;width:122px;padding:17px 8px;border-right:1px solid var(--preview-line);background:#fafbf7;text-align:left}
.hero .inbox-preview .preview-conversation-list>strong{font-size:10px;display:flex;align-items:center;gap:6px;letter-spacing:-.3px}
.hero .inbox-preview .preview-conversation-list>strong>b{font-size:8px;border-radius:4px;padding:3px;background:#e5efdf}
.hero .inbox-preview .preview-list-search{margin:14px 0 10px;padding:8px 5px;border:1px solid var(--preview-line);border-radius:6px;font-size:8px;color:#879785;background:#fff}
.hero .inbox-preview .preview-list-filter{font-size:7px;color:#45754e;background:#e7f1e2;padding:4px 6px;border-radius:9px}
.hero .inbox-preview .preview-conversation{display:flex;gap:5px;align-items:center;margin:10px -8px 0;padding:12px 7px;border-left:2px solid transparent;border-bottom:1px solid var(--preview-line);transition:background .4s,border-color .4s}
.hero .inbox-preview .preview-conversation.is-selected{background:#e7f2e3;border-left-color:#1bc45b}
.hero .inbox-preview .preview-conversation .brand-icon{width:17px;height:17px}
.hero .inbox-preview .preview-conversation svg{width:15px;height:15px}
.hero .inbox-preview .preview-conversation b{font-size:9px;display:block}
.hero .inbox-preview .preview-conversation small{font-size:7px;color:#7b8e7b;display:block;margin-top:5px}
.hero .inbox-preview .preview-thread-tabs{display:flex;gap:15px;font-size:9px;padding:9px 0 10px;color:#809080}
.hero .inbox-preview .preview-thread-tabs b{font-weight:600;color:#1b4935}
.hero .inbox-preview .reminder-template{margin-top:15px;height:110px}
.hero .inbox-preview .inbox-reply-preview{margin-top:18px}
.hero .inbox-preview .preview-inbox-composer{position:absolute;bottom:120px;left:18px;right:18px;padding:13px 11px;border:1px solid var(--preview-line);border-radius:9px;display:flex;align-items:center;justify-content:space-between;font-size:9px;color:#8b9b8d}
.hero .inbox-preview .preview-inbox-composer b{padding:7px 9px;border-radius:6px;background:#1bc45b;color:#fff;font-size:8px}
.hero .inbox-preview .reminder-metrics{left:18px;right:18px}
.hero .inbox-preview .reminder-channels{height:648px;grid-template-rows:repeat(4,150px);gap:16px}
.hero .inbox-preview .reminder-connector{height:648px}
.hero .inbox-preview .reminder-channel{height:150px;padding:0;overflow:hidden;background:#f4f7f0}
.hero .inbox-preview .reminder-channel>div:first-child{height:40px;padding:8px 13px;background:#fff;border-bottom:1px solid var(--preview-line);gap:8px}
.hero .inbox-preview .reminder-channel .brand-icon{width:23px;height:23px}
.hero .inbox-preview .reminder-channel svg{width:22px;height:22px}
.hero .inbox-preview .reminder-channel p.social-chat-bubble{background:#fff;margin:8px 38px 5px 12px;border:1px solid #e3e8df;border-radius:0 10px 10px;padding:7px 10px;line-height:1.35;position:relative;min-height:57px}
.hero .inbox-preview .social-chat-bubble>b{font-size:8px;display:block;margin-bottom:3px}
.hero .inbox-preview .social-chat-bubble>span{font-size:10px;display:block;color:#35503e}
.hero .inbox-preview .social-chat-bubble time{font-size:6px;display:block;text-align:right;color:#8b9b90;margin-top:3px}
.hero .inbox-preview .social-chat-bubble time i{font-style:normal;color:#34a9d7}
.hero .inbox-preview .social-chat-composer{display:flex;justify-content:space-between;align-items:center;margin:0 10px;border-radius:14px;padding:4px 8px;background:#fff;color:#94a193;font-size:8px;height:22px}
.hero .inbox-preview .social-chat-composer b{color:#319454;font-size:12px}
.hero .inbox-preview [data-platform=whatsapp]>div:first-child{background:#1b4935;color:#fff}
.hero .inbox-preview [data-platform=whatsapp]>div:first-child strong{color:#fff}
.hero .inbox-preview [data-platform=whatsapp]>div:first-child small{color:#bcdac7}
.hero .inbox-preview [data-platform=instagram]{background:#faf5fa}
.hero .inbox-preview [data-platform=instagram] p.social-chat-bubble{border-radius:13px;background:#f1eaf5;border-color:#eadfed}
.hero .inbox-preview [data-platform=instagram] .social-chat-composer{border:1px solid #eadfed}
.hero .inbox-preview [data-platform=facebook]{background:#f4f7fc}
.hero .inbox-preview [data-platform=facebook] p.social-chat-bubble{background:#eaf1fc;border-color:#dfe8f8;border-radius:13px}
.hero .inbox-preview [data-platform=facebook] .social-chat-composer b{color:#1877f2}
.hero .inbox-preview [data-platform=telegram]{background:#eef6f9}
.hero .inbox-preview [data-platform=telegram] .social-chat-composer b{color:#24a6dc}
html[data-theme=dark] .hero .inbox-preview .preview-conversation-list{background:#172d20}
html[data-theme=dark] .hero .inbox-preview .preview-conversation.is-selected{background:#2c4c31}
html[data-theme=dark] .hero .inbox-preview .reminder-channel>div:first-child,html[data-theme=dark] .hero .inbox-preview p.social-chat-bubble,html[data-theme=dark] .hero .inbox-preview .social-chat-composer{background:#243d2a!important;color:#cfe1cd;border-color:#39523c}
html[data-theme=dark] .hero .inbox-preview .social-chat-bubble>span{color:#d0e4cf}
@media(min-width:761px) and (max-width:1100px){.hero .inbox-preview .preview-conversation-list{display:none}.hero .inbox-preview .reminder-content{margin-left:0}.hero .inbox-preview .reminder-checks{padding-left:20px}.hero .inbox-preview .checks-card p{font-size:9px}.hero .inbox-preview .reminder-channel strong{font-size:10px}}
@media(max-width:760px){.hero .inbox-preview .reminder-window{height:590px}.hero .inbox-preview .reminder-content{height:542px;margin-left:0}.hero .inbox-preview .preview-conversation-list{display:none}.hero .inbox-preview .reminder-channels{height:608px;grid-template-rows:repeat(4,140px);gap:16px}.hero .inbox-preview .reminder-channel{height:140px}.hero .inbox-preview .reminder-connector{height:608px}.hero .inbox-preview .reminder-channel p.social-chat-bubble{margin-right:12px;padding:6px 8px;min-height:54px}.hero .inbox-preview .social-chat-bubble>span{font-size:9px}.hero .inbox-preview .reminder-channel>div:first-child{height:36px;padding:6px 9px}.hero .inbox-preview .reminder-channel strong{font-size:10px}.hero .inbox-preview .reminder-channel .brand-icon{width:21px;height:21px}.hero .inbox-preview .preview-inbox-composer{bottom:115px}}
@media(max-width:760px){.hero .inbox-preview .reminder-window{height:648px}.hero .inbox-preview .reminder-content{height:600px}.hero .inbox-preview .preview-inbox-composer{bottom:115px}}

/* One social conversation at a time, synchronised with the shared inbox. */
.hero .inbox-preview .reminder-channels{position:relative;display:block;height:420px;align-self:center}
.hero .inbox-preview .reminder-channel{position:absolute;inset:0;height:420px;opacity:0;visibility:hidden;transform:translateY(12px)!important;transition:opacity .45s ease,transform .45s ease,visibility .45s;pointer-events:none;display:flex;flex-direction:column}
.hero .inbox-preview[data-active-channel=whatsapp] [data-platform=whatsapp],.hero .inbox-preview[data-active-channel=instagram] [data-platform=instagram],.hero .inbox-preview[data-active-channel=facebook] [data-platform=facebook],.hero .inbox-preview[data-active-channel=telegram] [data-platform=telegram]{opacity:1;visibility:visible;transform:none!important;pointer-events:auto}
.hero .inbox-preview .reminder-channel>div:first-child{height:64px;flex-shrink:0;padding:14px 18px}
.hero .inbox-preview .reminder-channel>div:first-child strong{font-size:14px}
.hero .inbox-preview .reminder-channel>div:first-child small{font-size:8px}
.hero .inbox-preview .reminder-channel .brand-icon{width:30px;height:30px}
.hero .inbox-preview .reminder-channel svg{width:28px;height:28px}
.hero .inbox-preview .reminder-channel p.social-chat-bubble{margin:30px 30px 0 17px;padding:14px;min-height:110px}
.hero .inbox-preview .social-chat-bubble>b{font-size:11px;margin-bottom:10px}
.hero .inbox-preview .social-chat-bubble>span{font-size:13px;line-height:1.6}
.hero .inbox-preview .social-chat-bubble time{font-size:8px;margin-top:14px}
.hero .inbox-preview .social-chat-composer{margin: auto 14px 15px;height:38px;padding:9px 13px;font-size:11px}
.hero .inbox-preview .reminder-connector svg>path:first-child,.hero .inbox-preview .reminder-connector svg>g{display:none}
.hero .inbox-preview .reminder-connector:before{content:'';position:absolute;top:50%;left:0;right:0;height:1px;background:#bfdac5}
.hero .inbox-preview .reminder-connector .reminder-signal{d:path('M0 324C25 324 55 324 80 324')}
.hero .inbox-preview:not([data-active-channel]) [data-platform=whatsapp]{opacity:1;visibility:visible;transform:none!important}
@media(max-width:760px){.hero .inbox-preview .reminder-channels{height:360px}.hero .inbox-preview .reminder-channel{height:360px}.hero .inbox-preview .reminder-connector{height:360px}.hero .inbox-preview .reminder-channel>div:first-child{height:55px;padding:10px}.hero .inbox-preview .reminder-channel>div:first-child strong{font-size:12px}.hero .inbox-preview .reminder-channel p.social-chat-bubble{margin:20px 12px 0;padding:12px;min-height:120px}.hero .inbox-preview .social-chat-bubble>span{font-size:11px}.hero .inbox-preview .social-chat-composer{margin: auto 10px 12px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.hero .inbox-preview .reminder-channel{transition:none!important}}
