/* ReplySense website.
   Visual rules: warm white page, navy-black ink from the app icon, grey secondary text.
   Colour only comes from soft satin textures inside rounded panels and from the icon's cream,
   which is used as a highlighter on the chosen reply. No flat colour fills. */
:root{
  color-scheme:light;
  --page:#fafaf9;--surface:#fff;--ink:#0f1729;--ink-2:#3d4554;--muted:#646b78;--faint:#868c98;
  --hair:rgba(15,23,41,.08);--hair-2:rgba(15,23,41,.14);--cream:#ffe4a9;--cream-2:#fff3d6;
  --shadow-sm:0 1px 2px rgba(15,23,41,.05);
  --shadow:0 1px 2px rgba(15,23,41,.04),0 18px 40px -18px rgba(15,23,41,.18);
  --shadow-lg:0 2px 4px rgba(15,23,41,.04),0 40px 80px -32px rgba(15,23,41,.32);
  --r-xl:36px;--r-lg:28px;--r-md:20px;--header:64px;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue","PingFang SC","Microsoft YaHei",Roboto,sans-serif;
}
:lang(zh-Hans){--sans:"Inter",-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif}
:lang(zh-Hant){--sans:"Inter",-apple-system,BlinkMacSystemFont,"PingFang TC","Microsoft JhengHei","Noto Sans TC",sans-serif}
:lang(ja){--sans:"Inter",-apple-system,BlinkMacSystemFont,"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic UI",Meiryo,"Noto Sans JP",sans-serif}
:lang(ko){--sans:"Inter",-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic","Noto Sans KR",sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header) + 16px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--page);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"cv11","ss01";overflow-x:hidden}
h1,h2,h3,p,ul,ol,figure{margin:0}
ul,ol{list-style:none;padding:0}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font:inherit;color:inherit}
svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:10px}
.shell{width:min(1200px,calc(100% - 64px));margin:0 auto}
.skip-link{position:fixed;top:-80px;left:12px;z-index:100;background:var(--ink);color:#fff;padding:10px 14px;border-radius:10px}
.skip-link:focus{top:12px}
h1,h2,.hero-sub,.heading>p{text-wrap:balance}
p,li{text-wrap:pretty}
::selection{background:var(--cream);color:var(--ink)}
:lang(ja) h1,:lang(ja) h2,:lang(ja) h3,:lang(ja) .hero-sub{word-break:auto-phrase}
/* Korean breaks between words, not inside them. */
:lang(ko) :is(h1,h2,h3,p,li){word-break:keep-all}

/* Type scale: large, quiet headlines; small grey body copy. */
h1{font-size:clamp(46px,7vw,96px);font-weight:600;letter-spacing:-.045em;line-height:1}
h2{font-size:clamp(32px,4.2vw,56px);font-weight:600;letter-spacing:-.035em;line-height:1.08}
h1 span,h2 span{color:var(--faint)}
h3{font-weight:600;letter-spacing:-.015em}
:lang(zh-Hans) :is(h1,h2,h3),:lang(zh-Hant) :is(h1,h2,h3),:lang(ja) :is(h1,h2,h3),:lang(ko) :is(h1,h2,h3){letter-spacing:-.01em}
:lang(zh-Hans) h1,:lang(zh-Hant) h1,:lang(ja) h1,:lang(ko) h1{line-height:1.12}
:lang(zh-Hans) h2,:lang(zh-Hant) h2,:lang(ja) h2,:lang(ko) h2{line-height:1.25}
.lead{font-size:17px;line-height:1.65;color:var(--muted);margin-top:18px;max-width:440px}

/* Satin texture panels with a faint film grain. */
.tex{position:relative;isolation:isolate;background:#f1efeb var(--tex) center/cover no-repeat}
.tex::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;opacity:.35;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:48px;padding:0 22px;border-radius:999px;font-size:15px;font-weight:500;letter-spacing:-.01em;white-space:nowrap;transition:background .2s,box-shadow .2s,transform .15s}
.btn:active{transform:scale(.98)}
.btn svg{width:19px;height:19px}
.btn-ink{background:var(--ink);color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.12) inset,0 8px 20px -10px rgba(15,23,41,.6)}
.btn-ink:hover{background:#1e2a42}
.btn-ghost{background:#fff;color:var(--ink);box-shadow:0 0 0 1px var(--hair-2) inset}
.btn-ghost:hover{box-shadow:0 0 0 1px rgba(15,23,41,.3) inset}
.btn-sm{height:38px;padding:0 16px;font-size:14px}
.btn-text{height:48px;padding:0 12px;color:var(--ink-2)}
.btn-text:hover{color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.btn-text svg{width:17px;height:17px}
.store-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.qr-anchor{position:relative}
.qr-popover{display:none;position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%);z-index:30;padding:12px 12px 10px;width:172px;border-radius:18px;background:#fff;box-shadow:var(--shadow-lg),0 0 0 1px var(--hair);text-align:center}
.qr-popover:before{content:"";position:absolute;bottom:100%;left:0;right:0;height:14px}
.qr-popover img{width:148px;height:148px;margin:auto;image-rendering:pixelated}
.qr-popover p{font-size:12px;color:var(--muted);margin-top:6px}
@media(hover:hover) and (pointer:fine) and (min-width:761px){.qr-anchor:not([data-qr-dismissed]):hover .qr-popover,.qr-anchor:not([data-qr-dismissed]):focus-within .qr-popover{display:block}}
.text-link{display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:500;color:var(--ink);margin-top:24px}
.text-link svg{width:16px;height:16px;transition:transform .2s}
.text-link:hover svg{transform:translateX(3px)}

/* Header */
.site-header{position:sticky;top:0;z-index:50;height:var(--header);background:rgba(250,250,249,.72);backdrop-filter:saturate(1.6) blur(18px);-webkit-backdrop-filter:saturate(1.6) blur(18px);box-shadow:0 1px 0 transparent;transition:box-shadow .25s}
.site-header.scrolled{box-shadow:0 1px 0 var(--hair)}
.header-inner{height:100%;display:flex;align-items:center;gap:32px}
.brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:600;letter-spacing:-.02em}
.brand img{border-radius:8px}
.main-nav{display:flex;gap:30px;font-size:14px;color:var(--ink-2)}
.main-nav a{transition:color .2s}
.main-nav a:hover{color:var(--ink)}
.header-actions{margin-left:auto;display:flex;align-items:center;gap:6px}
.language-menu{position:relative;font-size:14px}
.language-menu summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:7px;height:38px;padding:0 12px;border-radius:999px;color:var(--ink-2);transition:background .2s}
.language-menu summary:hover,.language-menu[open] summary{background:rgba(15,23,41,.05)}
.language-menu summary svg{width:16px;height:16px}
summary::-webkit-details-marker{display:none}
.language-menu nav{position:absolute;right:0;top:calc(100% + 10px);width:360px;padding:8px;display:grid;grid-template-columns:1fr 1fr;gap:2px;background:#fff;border-radius:18px;box-shadow:var(--shadow-lg),0 0 0 1px var(--hair)}
.language-menu nav a{padding:9px 12px;border-radius:10px;font-size:14px;color:var(--ink-2)}
.language-menu nav a:hover{background:rgba(15,23,41,.04);color:var(--ink)}
.language-menu nav a[aria-current]{color:var(--ink);font-weight:600;background:rgba(15,23,41,.05)}

/* Hero */
.hero{padding:104px 0 56px;text-align:center}
.eyebrow{display:inline-block;font-size:14px;color:var(--muted);letter-spacing:.005em;margin-bottom:22px}
.hero h1 span{display:block}
.hero-sub{max-width:620px;margin:26px auto 34px;font-size:18px;line-height:1.6;color:var(--muted)}
.hero-meta{font-size:13px;color:var(--muted);margin-top:18px}

/* Stage: the live demo */
.stage-wrap{padding-bottom:40px}
.stage{border-radius:var(--r-xl);padding:56px 56px 28px;display:grid;grid-template-columns:240px 1fr;gap:40px;align-items:center;overflow:hidden;box-shadow:0 0 0 1px var(--hair)}
.stage-steps{display:grid;gap:22px;align-self:center}
.stage-steps li{display:grid;gap:4px;font-size:15px;line-height:1.45;color:var(--muted);transition:color .4s}
.stage-steps li span{font-size:12px;font-variant-numeric:tabular-nums;letter-spacing:.04em}
.stage-steps li.on{color:var(--ink);font-weight:500}
.demo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:end;max-width:820px}
.demo-chat,.demo-kb{background:rgba(255,255,255,.88);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:26px;box-shadow:var(--shadow-lg),0 0 0 1px rgba(255,255,255,.7) inset}
.demo-chat{padding:18px 18px 14px;min-height:360px;display:flex;flex-direction:column}
.demo-head{display:flex;align-items:center;gap:10px;font-size:14px;padding-bottom:14px;border-bottom:1px solid var(--hair)}
.demo-head small{margin-left:auto;font-size:11px;color:var(--muted)}
.avatar{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#e9e6df;color:var(--ink-2);font-size:13px;font-weight:600}
.demo-msgs{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;padding:18px 0 14px}
.bubble{max-width:86%;padding:10px 14px;font-size:15px;line-height:1.45;border-radius:18px;transition:opacity .35s,transform .35s}
.bubble.in{align-self:flex-start;background:#f0efec;border-bottom-left-radius:6px}
.bubble.out{align-self:flex-end;background:var(--ink);color:#fff;border-bottom-right-radius:6px}
.bubble.hide{opacity:0;transform:translateY(8px)}
.demo-input{display:flex;align-items:center;gap:6px;min-height:44px;padding:8px 8px 8px 14px;border-radius:22px;background:#f5f4f1;font-size:14px;line-height:1.4}
.demo-typed:empty::before{content:attr(data-placeholder);color:var(--muted)}
.caret{width:1.5px;height:17px;background:var(--ink);animation:caret 1s steps(2) infinite;flex:none}
@keyframes caret{50%{opacity:0}}
.send{margin-left:auto;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--ink);color:#fff;flex:none}
.send svg{width:15px;height:15px;stroke-width:2}
.demo-kb{padding:14px}
.kb-bar{display:flex;align-items:center;gap:10px;padding:2px 4px 12px;font-size:12px;color:var(--muted)}
.kb-bar img{border-radius:6px}
.kb-q{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kb-cards{display:grid;gap:8px}
.kb-card{padding:12px 14px;border-radius:16px;background:#fff;box-shadow:0 0 0 1px var(--hair);transition:box-shadow .35s,background .35s,opacity .35s,transform .35s}
.kb-card .tone{font-size:11px;font-weight:600;letter-spacing:.02em;color:var(--muted)}
.kb-card p{font-size:14px;line-height:1.45;margin-top:4px;color:var(--ink)}
.kb-card.picked{background:linear-gradient(var(--cream-2),var(--cream-2));box-shadow:0 0 0 1.5px #f1c96b}
.kb-card.picked .tone{color:#8a6414}
/* While suggestions are "thinking", cards show as shimmering placeholders. */
.kb-card.wait{background:linear-gradient(100deg,#f2f1ee 30%,#fbfaf8 50%,#f2f1ee 70%) 0 0/220% 100%;box-shadow:none;animation:shimmer 1.3s linear infinite}
.kb-card.wait>*{visibility:hidden}
@keyframes shimmer{to{background-position:-220% 0}}
.stage-tabs{grid-column:1/-1;display:flex;justify-content:center;gap:4px;margin-top:6px}
.stage-tabs button{border:0;background:transparent;height:34px;padding:0 14px;border-radius:999px;font-size:13px;color:var(--muted);cursor:pointer;transition:background .2s,color .2s}
.stage-tabs button:hover{color:var(--ink)}
.stage-tabs button[aria-pressed="true"]{background:rgba(255,255,255,.85);color:var(--ink);box-shadow:var(--shadow-sm),0 0 0 1px var(--hair)}

/* Chat apps row */
.apps{padding:36px 0 8px}
.apps-inner{display:flex;align-items:center;justify-content:center;gap:28px;flex-wrap:wrap}
.apps h2{font-size:14px;font-weight:500;letter-spacing:0;color:var(--muted);line-height:1.4}
.apps ul{display:flex;align-items:center;gap:18px}
.apps li img{width:30px;height:30px;object-fit:contain;filter:grayscale(1);opacity:.55;transition:filter .3s,opacity .3s}
.apps li:hover img{filter:none;opacity:1}
.apps-more{font-size:13px;color:var(--muted)}

/* Sections */
.section{padding:128px 0 0}
.heading{text-align:center;max-width:820px;margin:0 auto 64px}
.heading h2 span{display:block}
.heading>p{font-size:18px;line-height:1.6;color:var(--muted);margin:22px auto 0;max-width:600px}
.heading.left{text-align:left;margin-left:0}
.heading.split{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;max-width:none}
.heading.split .text-link{margin:0 0 8px}

/* Feature rows */
.feature{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:center;margin-top:28px}
.feature+.feature{margin-top:96px}
.feature:nth-of-type(even){grid-template-columns:7fr 5fr}
.feature:nth-of-type(even) .feature-text{order:2}
.kicker{display:block;font-size:13px;font-weight:500;color:var(--muted);margin-bottom:16px}
.feature-text h3{font-size:clamp(28px,3vw,40px);line-height:1.12;letter-spacing:-.03em}
.feature-text>p{font-size:17px;line-height:1.65;color:var(--muted);margin-top:18px;max-width:440px}
.feature-text ul{margin-top:28px;border-top:1px solid var(--hair);max-width:440px}
.feature-text li{font-size:15px;color:var(--ink-2);padding:13px 0;border-bottom:1px solid var(--hair)}
.feature-art{background-image:linear-gradient(rgba(250,250,249,.38),rgba(250,250,249,.38)),var(--tex);height:560px;border-radius:var(--r-xl);overflow:hidden;display:flex;justify-content:center;gap:24px;box-shadow:0 0 0 1px var(--hair)}
.shot{display:block;width:300px;flex:none;line-height:0;border-radius:44px;padding:7px;background:rgba(255,255,255,.9);box-shadow:var(--shadow-lg),0 0 0 1px rgba(15,23,41,.06);transition:transform .4s}
.shot img{width:100%;height:auto;border-radius:37px}
.shot:hover{transform:translateY(-4px)}
.shot.crop-top{align-self:flex-start;margin-top:56px}
.shot.crop-bottom{align-self:flex-end;margin-bottom:56px}
.feature-art.pair .shot{width:250px}
.feature-art.pair .shot+.shot{margin-top:120px}

/* Poster tiles */
.poster-grid{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:20px}
.poster{border-radius:var(--r-lg);padding:32px;min-height:420px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 0 0 1px var(--hair)}
.poster h3{font-size:24px;line-height:1.2;margin-top:auto}
.poster p{font-size:15px;line-height:1.6;color:var(--muted);margin-top:10px;max-width:340px}
.poster-art{flex:1;display:flex;align-items:center;justify-content:center;padding-bottom:28px}
.poster-ink{background:radial-gradient(120% 90% at 20% 0%,#1f2b45 0%,var(--ink) 60%);color:#fff;box-shadow:none}
.poster-ink p{color:rgba(255,255,255,.62)}
.chip-cloud{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:380px}
.chip-cloud span{padding:8px 13px;border-radius:999px;font-size:13px;color:rgba(255,255,255,.72);background:rgba(255,255,255,.06);box-shadow:0 0 0 1px rgba(255,255,255,.1) inset}
.chip-cloud span.on{background:var(--cream);color:var(--ink);box-shadow:none}
.hello-cloud{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;max-width:300px}
.hello-cloud span{padding:9px 14px;border-radius:14px;background:rgba(255,255,255,.85);box-shadow:var(--shadow-sm),0 0 0 1px var(--hair);font-size:15px;font-weight:500}
.hello-cloud span:nth-child(3n+1){transform:rotate(-4deg)}
.hello-cloud span:nth-child(3n+2){transform:rotate(3deg)}
.poster-paper{background:#fff}
.voice-pill{display:flex;align-items:center;gap:14px;height:64px;padding:0 22px 0 8px;border-radius:999px;background:var(--ink);color:#fff;box-shadow:var(--shadow-lg)}
.voice-pill>svg{width:48px;height:48px;padding:13px;border-radius:50%;background:rgba(255,255,255,.1)}
.wave{display:flex;align-items:center;gap:3px;height:28px}
.wave i{width:3px;border-radius:3px;background:#fff;height:var(--h);animation:wave 1.2s ease-in-out infinite;animation-delay:calc(var(--i) * -70ms)}
@keyframes wave{50%{transform:scaleY(.45)}}
.mini-list{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:56px;padding-top:40px;border-top:1px solid var(--hair)}
.mini-list li{display:flex;gap:16px}
.mini-list svg{width:22px;height:22px;color:var(--ink-2);margin-top:2px}
.mini-list h3{font-size:17px}
.mini-list p{font-size:15px;line-height:1.6;color:var(--muted);margin-top:6px}

/* How it works */
.how-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.how-steps li{padding-top:24px;border-top:1px solid var(--hair-2)}
.num{display:block;font-size:44px;font-weight:300;letter-spacing:-.04em;color:var(--faint);font-variant-numeric:tabular-nums;line-height:1}
.how-steps h3{font-size:20px;margin-top:28px}
.how-steps p{font-size:15px;line-height:1.65;color:var(--muted);margin-top:8px;max-width:330px}

/* Privacy band */
.privacy{margin-top:128px;padding:120px 0}
.privacy-inner{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.privacy h2 span{display:block}
.glass{display:grid;gap:4px;padding:10px;border-radius:var(--r-lg);background:rgba(255,255,255,.55);backdrop-filter:blur(24px) saturate(1.3);-webkit-backdrop-filter:blur(24px) saturate(1.3);box-shadow:0 0 0 1px rgba(255,255,255,.75) inset,var(--shadow)}
.glass article{display:flex;gap:16px;padding:20px 18px;border-radius:20px}
.glass article+article{box-shadow:0 -1px 0 var(--hair)}
.glass svg{width:22px;height:22px;color:var(--ink-2);margin-top:1px}
.glass h3{font-size:17px}
.glass p{font-size:15px;line-height:1.6;color:var(--muted);margin-top:4px}

/* Compare teaser */
.compare-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.compare-card{position:relative;display:flex;flex-direction:column;gap:10px;padding:28px 28px 64px;border-radius:var(--r-md);background:#fff;box-shadow:0 0 0 1px var(--hair);transition:box-shadow .25s,transform .25s}
.compare-card:hover{box-shadow:var(--shadow),0 0 0 1px var(--hair-2);transform:translateY(-2px)}
.vs{font-size:19px;font-weight:600;letter-spacing:-.02em}
.vs i{font-style:normal;color:var(--faint);font-weight:400;margin:0 2px}
.compare-card p{font-size:15px;line-height:1.6;color:var(--muted)}
.go{position:absolute;left:28px;bottom:24px;color:var(--ink-2)}

/* FAQ */
.faq-layout{display:grid;grid-template-columns:5fr 7fr;gap:80px}
.faq h2 span{display:block}
.faq-list{border-top:1px solid var(--hair-2)}
.faq-list details{border-bottom:1px solid var(--hair)}
.faq-list summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;font-size:17px;font-weight:500;letter-spacing:-.01em}
.faq-list summary>span{position:relative;width:14px;height:14px;flex:none}
.faq-list summary>span::before,.faq-list summary>span::after{content:"";position:absolute;left:0;top:6.5px;width:14px;height:1.5px;background:var(--ink-2);transition:transform .25s}
.faq-list summary>span::after{transform:rotate(90deg)}
.faq-list details[open] summary>span::after{transform:rotate(0)}
.faq-list details>p{font-size:15px;line-height:1.75;color:var(--muted);padding:0 40px 24px 0;max-width:640px}

/* Closing */
.closing{padding:128px 0 96px}
.closing-card{border-radius:var(--r-xl);padding:96px 32px 72px;text-align:center;overflow:hidden;box-shadow:0 0 0 1px var(--hair)}
.closing-icon{margin:0 auto 28px;border-radius:17px;box-shadow:var(--shadow-lg)}
.closing h2{font-size:clamp(34px,5vw,64px);max-width:860px;margin:auto}
.closing-card>p{font-size:18px;color:var(--muted);margin-top:18px}
.badges{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:4px 14px;margin-top:36px}
.badges img{height:44px;width:auto}
.badges .play img{height:65px;margin:-10px -9px}
.apk-link{display:inline-flex;align-items:center;gap:7px;margin-top:16px;font-size:14px;color:var(--ink-2)}
.apk-link svg{width:16px;height:16px}
.apk-link:hover{color:var(--ink);text-decoration:underline}
.closing-qr{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:28px;font-size:13px;color:var(--muted)}
.closing-qr img{width:72px;height:72px;border-radius:10px;padding:5px;background:#fff;box-shadow:0 0 0 1px var(--hair);image-rendering:pixelated}

/* Footer */
.site-footer{padding:72px 0 40px;border-top:1px solid var(--hair)}
.footer-top{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;padding-bottom:48px}
.footer-mark{display:flex;align-items:center;gap:14px;font-size:30px;font-weight:600;letter-spacing:-.03em}
.footer-mark img{border-radius:11px}
.footer-top p{max-width:380px;font-size:15px;line-height:1.65;color:var(--muted)}
.footer-cols{display:grid;grid-template-columns:1fr 1.2fr 1.2fr 1.6fr;gap:32px}
.footer-cols nav{display:flex;flex-direction:column;align-items:flex-start;gap:2px;font-size:14px;color:var(--muted)}
.footer-cols strong{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:10px}
.footer-cols a{padding:5px 0;transition:color .2s;overflow-wrap:anywhere}
.footer-cols a:hover{color:var(--ink)}
.footer-langs{display:grid!important;grid-template-columns:1fr 1fr;column-gap:20px}
.footer-langs strong{grid-column:1/-1}
.footer-langs a[aria-current]{color:var(--ink)}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;margin-top:56px;padding-top:24px;border-top:1px solid var(--hair);font-size:12px;color:var(--muted)}

/* Comparison pages */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.cmp-hero{padding:56px 0 24px}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:13px;color:var(--muted);margin-bottom:56px}
.crumbs a:hover{color:var(--ink)}
.cmp-hero .eyebrow{margin-bottom:18px}
.cmp-hero h1{font-size:clamp(42px,6vw,80px);max-width:900px}
.cmp-hero h1 span{display:block}
.vs-word{display:inline!important;color:var(--faint);font-weight:400}
.cmp-intro{font-size:18px;line-height:1.7;color:var(--muted);max-width:720px;margin:28px 0 34px}
.cmp-hero .store-buttons{justify-content:flex-start}
.byline{font-size:13px;color:var(--muted);margin-top:22px}
.cmp-section{padding-top:96px}
.cmp-h2{font-size:clamp(28px,3vw,40px);margin-bottom:32px}
.choose{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.choose article{border-radius:var(--r-lg);padding:36px;box-shadow:0 0 0 1px var(--hair)}
.choose-them{background:#fff}
.choose h2{font-size:22px;letter-spacing:-.02em;margin-bottom:22px}
.choose li{display:flex;gap:12px;font-size:16px;line-height:1.55;color:var(--ink-2);padding:12px 0;border-top:1px solid var(--hair)}
.choose li svg{width:18px;height:18px;margin-top:3px;color:var(--ink)}
.table-wrap{overflow-x:auto;border-radius:var(--r-md);background:#fff;box-shadow:0 0 0 1px var(--hair)}
.cmp-table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.55;min-width:640px}
.cmp-table th,.cmp-table td{text-align:left;vertical-align:top;padding:18px 22px;border-bottom:1px solid var(--hair)}
.cmp-table tbody tr:last-child>*{border-bottom:0}
.cmp-table thead th{font-size:14px;font-weight:600;padding-top:20px;padding-bottom:16px}
.cmp-table thead th.us{display:flex;align-items:center;gap:8px}
.cmp-table thead img{border-radius:6px}
.cmp-table tbody th{width:22%;font-weight:500;color:var(--ink)}
.cmp-table td{width:39%;color:var(--muted)}
.cmp-table td.us{color:var(--ink);background:rgba(255,228,169,.18)}
.fine{font-size:12px;line-height:1.7;color:var(--muted);margin-top:16px;max-width:900px}
.fine a{text-decoration:underline;text-underline-offset:2px}
.fine a:hover{color:var(--ink)}
.diff-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.diff-grid article{padding-top:24px;border-top:1px solid var(--hair-2)}
.diff-grid h3{font-size:20px;margin-top:24px}
.diff-grid p{font-size:15px;line-height:1.65;color:var(--muted);margin-top:8px}
.strong{display:grid;grid-template-columns:5fr 7fr;gap:80px}
.strong .lead{margin-top:-12px}
.strong ul{border-top:1px solid var(--hair-2)}
.strong li{font-size:16px;line-height:1.6;color:var(--ink-2);padding:18px 0;border-bottom:1px solid var(--hair)}
.compare-page .closing{padding-top:112px}
.closing-buttons{margin-top:32px}
.trademark{text-align:center;margin:24px auto 0}
@media(max-width:860px){
  .choose,.strong{grid-template-columns:1fr;gap:20px}
  .diff-grid{grid-template-columns:1fr;gap:28px}
}
@media(max-width:640px){
  .crumbs{margin-bottom:36px}
  .cmp-intro{font-size:16px}
  .choose article{padding:26px}
  .cmp-section{padding-top:72px}
}

/* Hero entrance: a short staggered rise on first paint. */
@keyframes rise{from{opacity:0;transform:translateY(14px)}}
.hero h1,.hero-sub,.hero .store-buttons,.hero-meta,.stage{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
.hero-sub{animation-delay:.08s}.hero .store-buttons{animation-delay:.16s}.hero-meta{animation-delay:.22s}.stage{animation-delay:.3s}

/* FAQ answers open smoothly where the browser supports animating to auto height. */
@supports selector(::details-content){
  .faq-list details{interpolate-size:allow-keywords}
  .faq-list details::details-content{height:0;overflow:clip;transition:height .35s cubic-bezier(.2,.7,.2,1),content-visibility .35s allow-discrete}
  .faq-list details[open]::details-content{height:auto}
}

/* Reveal on scroll, only when JS is running. */
.js .reveal{opacity:0;transform:translateY(16px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.js .reveal.in{opacity:1;transform:none}

@media(max-width:1080px){
  .main-nav{display:none}
  .stage{grid-template-columns:minmax(0,1fr);padding:40px 32px 24px}
  .stage-steps{grid-template-columns:repeat(3,1fr);gap:16px}
  .demo{max-width:none}
  .feature{gap:40px}
  .feature-art{height:500px}
  .footer-cols{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
  .feature{grid-template-columns:1fr}
  .feature:nth-of-type(even){grid-template-columns:1fr}
  .feature:nth-of-type(even) .feature-text{order:0}
  .feature+.feature{margin-top:72px}
  .poster-grid,.compare-cards{grid-template-columns:1fr}
  .poster{min-height:360px}
  .mini-list,.how-steps{grid-template-columns:1fr;gap:28px}
  .privacy-inner,.faq-layout{grid-template-columns:1fr;gap:40px}
  .heading.split{flex-direction:column;align-items:flex-start}
  .footer-top{flex-direction:column;gap:20px}
}
@media(max-width:640px){
  :root{--header:58px;--r-xl:28px;--r-lg:24px}
  .shell{width:calc(100% - 32px)}
  .header-inner{gap:10px}
  .brand{font-size:17px}
  .lang-current{display:none}
  .language-menu summary{padding:0 10px}
  .language-menu nav{position:fixed;left:16px;right:16px;top:calc(var(--header) - 4px);width:auto}
  .btn-sm{padding:0 14px;font-size:13px}
  .hero{padding:64px 0 36px}
  h1{font-size:clamp(40px,12vw,54px)}
  .hero-sub{font-size:16px;margin:20px auto 26px}
  .btn{height:46px;padding:0 18px;font-size:14px}
  .stage{padding:20px 14px 16px}
  .stage-steps{display:none}
  .demo{grid-template-columns:minmax(0,1fr);gap:12px}
  .demo-chat{min-height:0}
  .demo-msgs{min-height:150px}
  .kb-card:nth-child(3){display:none}
  .stage-tabs{flex-wrap:wrap}
  .apps-inner{flex-direction:column;gap:14px}
  .section{padding-top:96px}
  .heading{margin-bottom:40px}
  .heading>p{font-size:16px}
  .feature-text>p{font-size:16px}
  .feature-art{height:440px}
  .shot{width:250px;border-radius:38px;padding:6px}
  .shot img{border-radius:32px}
  .shot.crop-top{margin-top:36px}
  .shot.crop-bottom{margin-bottom:36px}
  .feature-art.pair .shot{width:200px}
  .feature-art.pair .shot+.shot{margin-left:-60px;margin-top:90px}
  .feature-art.pair{gap:0}
  .poster{padding:26px;min-height:330px}
  .privacy{margin-top:96px;padding:80px 0}
  .closing{padding:96px 0 64px}
  .closing-card{padding:64px 20px 48px}
  .closing-qr{display:none}
  .footer-cols{grid-template-columns:1fr 1fr;gap:28px 20px}
  .footer-langs{grid-column:1/-1}
  .footer-bottom{flex-direction:column;gap:6px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .caret,.wave i,.kb-card.wait,.hero h1,.hero-sub,.hero .store-buttons,.hero-meta,.stage{animation:none}
  .faq-list details::details-content{transition:none}
  .js .reveal{opacity:1;transform:none;transition:none}
  .shot:hover,.compare-card:hover{transform:none}
}