/* A shared motion rhythm for the homepage. All effects have a static fallback. */
.home { --motion-ease:cubic-bezier(.22,1,.36,1); }
.home .hero { padding-top:64px; padding-bottom:72px; overflow:clip; }
.home .hero h1 { line-height:1.16; letter-spacing:-.057em; }
.home .hero h1>span { color:var(--brand); }
.home .hero h1>span:after { bottom:-7px; height:9px; border-width:2px; width:99%; opacity:.35; }
.home .hero-copy { animation:hero-copy-arrive 1.05s var(--motion-ease) both; }
.home .device { animation:hero-device-arrive 1.35s var(--motion-ease) both; }
.home .hero-stage { isolation:isolate; }
.home .hero-art { overflow:visible; }
.home .hero-stage:before { content:''; position:absolute; pointer-events:none; z-index:-1; inset:9% -4% 18%; background:radial-gradient(ellipse at 50% 48%,color-mix(in srgb,var(--brand) 13%,transparent),transparent 68%); }
.home .art-orbit { border:1px solid color-mix(in srgb,var(--brand) 18%,transparent); background:radial-gradient(ellipse at 30% 24%,color-mix(in srgb,var(--brand) 12%,var(--bg)),color-mix(in srgb,var(--lavender) 60%,var(--bg)) 62%); box-shadow:inset 0 0 50px color-mix(in srgb,var(--surface) 40%,transparent); }
.home .art-orbit:after { border-color:color-mix(in srgb,var(--brand) 13%,transparent); inset:-22px; }
.home .art-orbit:before { content:''; position:absolute; inset:26px -43px; border:1px solid color-mix(in srgb,var(--brand) 10%,transparent); border-radius:50%; transform:rotate(-32deg); }
.home .floating-note { border:1px solid color-mix(in srgb,var(--brand) 14%,var(--line)); background:color-mix(in srgb,var(--surface) 92%,transparent); backdrop-filter:blur(12px); border-radius:17px 17px 17px 5px; box-shadow:0 13px 28px -22px #30245266; padding:15px 18px; }
.home .floating-note .tiny-dot { box-shadow:0 0 0 4px color-mix(in srgb,#7b9d82 12%,transparent); }
.home .floating-brand { gap:10px; }
.home .floating-brand img { width:66px; height:66px; border-radius:21px; box-shadow:0 12px 22px -17px #36295588,inset 0 1px #ffffff40; }
.home .floating-brand>span { border:1px solid color-mix(in srgb,var(--brand) 14%,var(--line)); box-shadow:0 8px 20px -19px #30245277; }
.home .art-star { color:color-mix(in srgb,var(--brand) 65%,var(--bg)); font-size:64px; }
.home .demo-scenarios { padding:6px; border-color:color-mix(in srgb,var(--brand) 16%,var(--line)); box-shadow:0 12px 26px -21px #30244955,inset 0 1px color-mix(in srgb,var(--surface) 60%,transparent); }
.home .demo-scenarios button { transition:background .4s var(--motion-ease),color .4s,box-shadow .4s; }
.home .motion-toggle { transition:background .3s,color .3s,transform .45s var(--motion-ease); }
.home .motion-toggle>span { width:18px; height:18px; line-height:0; align-items:center; justify-content:center; }
.home .motion-toggle .pause-icon { display:flex; }
.home .motion-toggle .play-icon { display:none; }
.home .motion-toggle[aria-pressed=true] .pause-icon { display:none; }
.home .motion-toggle[aria-pressed=true] .play-icon { display:flex; }
.home .motion-toggle .icon { display:block; width:16px; height:16px; vertical-align:initial; }
.home .demo-scenarios button[aria-pressed=true] { box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 16%,transparent),0 2px 6px -4px #36306033; }
.home .hero-buttons .button { box-shadow:0 8px 20px -13px #5d53dfb3,inset 0 1px #ffffff52; }
.home .button { transition:transform .4s var(--motion-ease),box-shadow .4s var(--motion-ease),filter .4s; }
.home .button:before { transition:transform .9s var(--motion-ease); }
.home .button .icon,.home .text-link .icon { transition:transform .4s var(--motion-ease); }
.home .feature-visual { border:1px solid color-mix(in srgb,var(--brand) 7%,transparent); box-shadow:inset 0 1px color-mix(in srgb,var(--surface) 28%,transparent); }
.home .feature-visual>span,.home .feature-visual>div { transition:transform .7s var(--motion-ease); }
.home .news-read>span { transition:background .35s,color .35s,border-color .35s,transform .5s var(--motion-ease); }

/* Ambient movement uses individual transforms to preserve the art's rotations. */
.home[data-motion-ready=true] .art-orbit { animation:orbit-breathe 16s ease-in-out infinite; animation-play-state:paused; }
.home .hero-stage.is-motion-visible .art-orbit { animation-play-state:running; }
.home .floating-note { animation:note-drift 11s ease-in-out infinite; }
.home .floating-brand { animation:brand-drift 13s ease-in-out infinite; }
.home .art-star { animation:star-sway 19s ease-in-out infinite; }
.home[data-hero-motion=paused] .hero-art *, .home[data-hero-motion=paused] .hero-art *:before, .home[data-hero-motion=paused] .hero-art *:after { animation-play-state:paused!important; }
.home[data-motion-ready=true] .expression-sticker { animation:sticker-hover 10s ease-in-out infinite; animation-play-state:paused; }
.home .expression-preview.is-motion-visible .expression-sticker { animation-play-state:running; }
.home[data-motion-ready=true] .cta-message,.home[data-motion-ready=true] .cta-brand { animation:conversation-hover 12s ease-in-out infinite; animation-play-state:paused; }
.home[data-motion-ready=true] .cta-message-reply { animation-delay:-4s; }
.home[data-motion-ready=true] .cta-brand { animation-delay:-7s; }
.home .conversation-cta.is-motion-visible .cta-message,.home .conversation-cta.is-motion-visible .cta-brand { animation-play-state:running; }
.home[data-motion=paused] *, .home[data-motion=paused] *:before, .home[data-motion=paused] *:after { animation-play-state:paused!important; }
.home.intro-complete .device,.home.intro-complete .hero-copy,.home.intro-complete .hero h1>span:after { animation:none; }
@keyframes hero-copy-arrive { from { transform:translateY(16px); } to { transform:translateY(0); } }
@keyframes hero-device-arrive { from { translate:0 27px; rotate:3deg; scale:.98; } to { translate:0 0; rotate:0deg; scale:1; } }
@keyframes orbit-breathe { 0%,100% { rotate:0deg; scale:1; } 50% { rotate:7deg; scale:1.035; } }
@keyframes star-sway { 0%,100% { rotate:0deg; } 50% { rotate:38deg; } }
@keyframes sticker-hover { 0%,100% { translate:0 0; } 50% { translate:0 -5px; } }
@keyframes conversation-hover { 0%,100% { translate:0 0; } 50% { translate:0 -4px; } }

@media(hover:hover) and (pointer:fine) {
  .home .hero-buttons .button:hover { transform:translateY(-3px); box-shadow:0 16px 29px -17px #5b50dccc,inset 0 1px #ffffff65; }
  .home .button:active { transition-duration:.14s; }
}
@media(hover:none),(pointer:coarse) {
  .home .button:hover,.home .expression-choices button:hover,.home .motion-toggle:hover { transform:none; filter:none; }
  .home .button:hover:before { transform:translateX(-120%); }
}
@media(max-width:1100px) {
  .home .hero { padding-top:43px; padding-bottom:58px; }
  .home .floating-brand img { width:60px; height:60px; border-radius:20px; }
}
@media(max-width:700px) {
  .home .hero { padding-top:33px; padding-bottom:35px; }
  .home .hero-art { overflow:clip; }
  .home .hero h1 { line-height:1.2; }
  .home .hero-stage:before { inset:8% 0 16%; }
  .home .art-orbit:before { inset:25px -17px; }
  .home .art-orbit:after { inset:-13px; }
  .home .floating-note { padding:12px 14px; font-size:10px; }
  .home .floating-brand img { width:55px; height:55px; border-radius:18px; }
  .home .floating-brand { gap:7px; }
  .home .floating-brand>span { padding:11px 12px; }
  .home .art-star { font-size:53px; }
  .home[data-motion-ready=true] .art-orbit { animation:none; }
}
@media(prefers-reduced-motion:reduce) {
  .home *, .home *:before, .home *:after { animation:none!important; transition:none!important; }
  .home .device,.home .hero-copy,.home .device-rig { transform:none; }
  .home .button:hover,.home .button:active { transform:none; filter:none; }
}

/* Integrated product panels and a calmer editorial hierarchy. */
.home .features .section-heading { align-items:flex-end; margin-bottom:33px; }
.home .section-heading h2 { font-size:40px; line-height:1.22; letter-spacing:-.05em; }
.home .section-heading .eyebrow { font-size:9px; letter-spacing:.15em; }
.home .features-grid { gap:22px; align-items:stretch; }
.home .features-grid .feature-card { --feature-accent:var(--brand); padding:0; border:1px solid var(--line); border-radius:28px; overflow:clip; background:var(--surface); box-shadow:0 8px 24px -23px #32264755,inset 0 1px #ffffff08; }
.home .features-grid .feature-people { --feature-accent:#507e73; }
.home .features-grid .feature-event { --feature-accent:#997249; }
[data-theme=dark] .home .feature-people { --feature-accent:#9cc8bb; }
[data-theme=dark] .home .feature-event { --feature-accent:#d4b18b; }
.home .feature-card .feature-visual { margin:11px 11px 0; height:232px; border-radius:19px; border:0; }
.home .feature-body { padding:20px 25px 24px; }
.home .feature-body .feature-top { margin:0 0 15px; min-height:32px; }
.home .feature-body .feature-top>span { font-size:9px; letter-spacing:.13em; color:var(--muted); }
.home .feature-body .feature-top>.icon { position:static; width:32px; height:32px; padding:7px; border-radius:11px; color:var(--feature-accent); background:color-mix(in srgb,var(--feature-accent) 9%,var(--surface)); border:1px solid color-mix(in srgb,var(--feature-accent) 13%,transparent); }
.home .feature-body h3 { font-size:25px; letter-spacing:-.04em; margin-bottom:13px; }
.home .feature-body p { font-size:14px; line-height:1.85; max-width:none; min-height:104px; }
.home .feature-body .feature-detail { margin-top:22px; padding-top:18px; font-size:10px; line-height:1.7; color:var(--feature-accent); }
.home .visual-chat { background:color-mix(in srgb,var(--lavender) 86%,var(--bg)); }
.home .visual-people { background:color-mix(in srgb,#9ac3b3 22%,var(--bg)); }
.home .visual-event { background:color-mix(in srgb,#d7b18a 19%,var(--bg)); }
.home .sample-reaction { border-color:color-mix(in srgb,var(--lavender) 86%,var(--bg)); }
.home .people-portrait { border-color:color-mix(in srgb,#9ac3b3 22%,var(--bg)); }
.home .interest { border-color:color-mix(in srgb,var(--line) 80%,transparent); box-shadow:0 4px 12px -10px #263f3544; }
.home .sample-ticket { border:1px solid color-mix(in srgb,#a78c70 12%,var(--line)); box-shadow:0 13px 26px -21px #5b463c66; }
.home .ticket-confirmation { box-shadow:0 6px 17px -15px #5b463c55; }

.home .expression-surface { border-radius:29px; border-color:var(--line); grid-template-columns:1fr 1fr; overflow:clip; box-shadow:0 14px 33px -32px #30234f66; }
.home .expression-copy { padding:45px 39px; }
.home .expression-copy h2 { font-size:37px; line-height:1.24; letter-spacing:-.05em; }
.home .expression-copy>p { font-size:14px; line-height:1.9; min-height:106px; }
.home .expression-choices { gap:7px; }
.home .expression-choices button { background:transparent; border:1px solid var(--line); border-radius:11px; min-height:44px; padding-inline:12px; font-size:11px; }
.home .expression-choices button[aria-pressed=true] { background:var(--lavender); border-color:color-mix(in srgb,var(--brand) 25%,var(--line)); }
.home .expression-preview { display:flex; flex-direction:column; align-items:stretch; justify-content:center; background:linear-gradient(145deg,color-mix(in srgb,var(--lavender) 85%,var(--bg)),var(--lavender)); border-left:1px solid color-mix(in srgb,var(--brand) 10%,var(--line)); }
.expression-thread { display:flex; align-items:center; gap:12px; margin:0 25px; min-height:73px; padding-top:5px; border-bottom:1px solid color-mix(in srgb,var(--brand) 12%,transparent); }
.thread-avatars { display:flex; align-items:center; width:69px; padding-left:6px; flex-shrink:0; }
.thread-avatars>i { display:block; position:relative; width:28px; height:28px; border:3px solid var(--lavender); border-radius:50%; background:#b5a5df; margin-left:-6px; overflow:hidden; }
.thread-avatars>i:after { content:''; position:absolute; inset:6px -8px -8px 9px; border-radius:50%; background:#ddd0f7; transform:rotate(35deg); }
.thread-avatars>i:nth-child(2) { background:#81afa5; }
.thread-avatars>i:nth-child(2):after { background:#c2e5d6; inset:2px 8px -5px -9px; }
.thread-avatars>i:nth-child(3) { background:#bda079; }
.thread-avatars>i:nth-child(3):after { background:#efd8ae; inset:10px -2px -9px 2px; }
.expression-thread>div:nth-child(2) { min-width:0; }
.expression-thread strong { display:block; font-size:11px; font-weight:650; line-height:1.5; }
.expression-thread div>span { display:block; color:var(--muted); font-size:9px; margin-top:3px; line-height:1.5; }
.thread-more { color:var(--muted); margin-left:auto; font-size:20px; line-height:1; letter-spacing:2px; }
.home .expression-panel { width:100%; height:376px; }
.home .expression-preview:before { inset:98px 25px 30px; }
.home .expression-chat-note { top:28px; font-size:10px; padding:12px 15px; border-radius:13px 13px 13px 3px; box-shadow:0 6px 18px -17px #30234f66; }
.home .expression-sticker { top:92px; width:157px; height:161px; border-width:6px; border-radius:39px; box-shadow:0 19px 31px -24px #36234e99,0 2px 0 #dcd8ef; }
.home .expression-sticker img { width:140px; height:140px; }
.home .expression-pack-label { top:250px; padding:8px 12px; font-size:9px; }
.home .expression-mini-message { bottom:27px; font-size:10px; padding:13px 15px; }
.home .voice-sample { top:126px; }
.home .voice-answer { top:255px; }
.home .reaction-message { top:91px; }
.home .reaction-samples { top:209px; }
.home .reaction-caption { bottom:37px; }

.home .news-grid { gap:24px; align-items:stretch; }
.home .news-card { min-width:0; }
.home .news-card>a { border:1px solid var(--line); border-radius:27px; background:var(--surface); overflow:clip; padding-bottom:22px; }
.home .news-card .story-art { flex-shrink:0; margin:11px 11px 0; height:266px; border-radius:18px; }
.home .news-card .news-meta { margin:23px 25px 0; gap:13px; font-size:10px; }
.home .news-card .news-meta>span { background:var(--lavender); border-radius:6px; padding:4px 7px; font-size:9px; }
.home .news-card h3 { margin:15px 25px 0; font-size:25px; line-height:1.32; }
.home .news-card p { margin:14px 25px 0; font-size:14px; line-height:1.85; max-width:none; }
.home .news-card .news-read { margin:23px 25px 0; padding-top:15px; font-size:11px; }
.home .news-card .news-read>span { width:31px; height:31px; }
.home .news-card a:hover { border-color:color-mix(in srgb,var(--brand) 35%,var(--line)); }

@media(max-width:1100px) {
  .home .features-grid { gap:17px; }
  .home .feature-card .feature-visual { height:210px; margin:9px 9px 0; }
  .home .feature-body { padding:18px 21px 23px; }
  .home .feature-body h3 { font-size:23px; }
  .home .feature-body p { font-size:13px; min-height:115px; }
  .home .feature-body .feature-detail { font-size:9px; }
  .home .expression-copy { padding:35px 29px; }
  .home .expression-copy h2 { font-size:32px; }
  .home .expression-copy>p { font-size:13px; }
  .home .news-card h3 { font-size:23px; }
  .home .news-card p { font-size:13px; }
}
@media(max-width:850px) and (min-width:701px) {
  .home .section-heading h2 { font-size:33px; }
  .home .features-grid { gap:13px; }
  .home .features-grid .feature-card { border-radius:23px; }
  .home .feature-card .feature-visual { height:185px; border-radius:16px; }
  .home .feature-body { padding:15px 17px 21px; }
  .home .feature-body h3 { font-size:21px; min-height:54px; line-height:1.3; }
  .home .feature-body p { font-size:12px; min-height:133px; }
  .home .feature-body .feature-top>span { font-size:8px; }
  .home .feature-body .feature-top>.icon { width:27px; height:27px; padding:5px; border-radius:9px; }
  .home .feature-body .feature-detail { font-size:9px; }
  .home .expression-copy { padding:29px 25px; }
  .home .expression-copy h2 { font-size:29px; }
  .home .expression-choices button { font-size:10px; padding-inline:10px; }
  .expression-thread { margin-inline:20px; gap:8px; }
  .thread-avatars { width:61px; }
  .expression-thread div>span { font-size:8px; }
  .home .news-card h3 { font-size:22px; margin-inline:21px; }
  .home .news-card p,.home .news-card .news-meta,.home .news-card .news-read { margin-inline:21px; }
}
@media(max-width:700px) {
  .home .features .section-heading { margin-bottom:25px; }
  .home .section-heading h2 { font-size:32px; }
  .home .features-grid { gap:20px; }
  .home .feature-card .feature-visual { height:225px; margin:10px 10px 0; }
  .home .features-grid .feature-card { border-radius:25px; }
  .home .feature-body { padding:18px 23px 24px; }
  .home .feature-body .feature-top { margin-bottom:14px; }
  .home .feature-body h3 { font-size:26px; min-height:0; margin-bottom:13px; }
  .home .feature-body p { font-size:14px; min-height:0; line-height:1.85; }
  .home .feature-body .feature-detail { font-size:10px; margin-top:20px; padding-top:17px; }
  .home .expression-surface { grid-template-columns:1fr; border-radius:25px; }
  .home .expression-copy { padding:29px 25px; }
  .home .expression-copy h2 { font-size:31px; }
  .home .expression-copy>p { min-height:0; font-size:13px; margin-top:18px; }
  .home .expression-choices button { font-size:11px; }
  .home .expression-preview { border-left:0; border-top:1px solid color-mix(in srgb,var(--brand) 10%,var(--line)); }
  .expression-thread { min-height:66px; margin-inline:22px; gap:10px; }
  .home .expression-panel { height:357px; }
  .home .expression-preview:before { inset:90px 20px 25px; }
  .home .expression-chat-note { top:23px; left:21px; font-size:9px; }
  .home .expression-sticker { top:88px; width:149px; height:153px; border-radius:35px; }
  .home .expression-sticker img { width:132px; height:132px; }
  .home .expression-pack-label { top:235px; }
  .home .expression-mini-message { bottom:22px; right:20px; font-size:9px; }
  .home .voice-sample { top:119px; }
  .home .voice-answer { top:242px; left:21px; font-size:10px; }
  .home .reaction-message { top:82px; }
  .home .reaction-samples { top:200px; }
  .home .reaction-caption { bottom:32px; font-size:10px; }
  .home .news-grid { gap:22px; }
  .home .news-card>a { border-radius:25px; padding-bottom:20px; }
  .home .news-card .story-art { margin:10px 10px 0; height:229px; }
  .home .news-card h3 { margin:14px 22px 0; font-size:24px; }
  .home .news-card .news-meta { margin:20px 22px 0; font-size:9px; }
  .home .news-card p { margin:13px 22px 0; font-size:13px; }
  .home .news-card .news-read { margin:20px 22px 0; }
}
@media(max-width:370px) {
  .home .section-heading h2 { font-size:29px; }
  .home .feature-card .feature-visual { height:211px; }
  .home .feature-body { padding-inline:20px; }
  .home .feature-body h3 { font-size:24px; }
  .home .feature-body p { font-size:13px; }
  .home .feature-body .feature-detail { font-size:9px; }
  .home .expression-copy { padding:27px 21px; }
  .home .expression-copy h2 { font-size:28px; }
  .home .expression-choices { gap:6px; }
  .home .expression-choices button { padding-inline:10px; font-size:10px; }
  .expression-thread { margin-inline:17px; gap:7px; }
  .expression-thread strong { font-size:10px; }
  .expression-thread div>span { font-size:8px; }
  .home .news-card h3 { margin-inline:20px; font-size:22px; }
  .home .news-card p,.home .news-card .news-meta,.home .news-card .news-read { margin-inline:20px; }
  .home .news-card .mini-browser { width:220px; height:165px; }
}