/* TraduLive public website: one editorial identity. No product/app UI selectors. */
html[data-brand-experience]{scroll-padding-top:100px;--brand-ease:cubic-bezier(.22,1,.36,1);--brand-display:clamp(30px,3.35vw,48px);--brand-radius:20px;--brand-space:clamp(56px,7vw,112px)}
body[data-brand-page]{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body[data-brand-page] .topbar{position:sticky;top:0;z-index:45;border-bottom:1px solid #ffffff24}
body[data-brand-page] .topbar .brand{display:inline-flex;align-items:center;gap:10px;min-width:0;white-space:nowrap}
body[data-brand-page] .topbar .brand::before{content:"";display:block;flex:none;width:32px;height:32px;background:url('/img/tradulive-brand.webp') center/contain no-repeat}
body[data-brand-page] .topbar .links a{text-underline-offset:7px;transition:color .2s ease}
body[data-brand-page] .topbar .links a:hover{text-decoration:underline;text-decoration-color:#00f19f}
body[data-brand-page] .btn,body[data-brand-page] .back{transition:background-color .2s ease,color .2s ease,border-color .2s ease}
body[data-brand-page]::before{content:"";position:fixed;z-index:60;inset:0 0 auto;height:2px;background:#00f19f;transform-origin:left;transform:scaleX(var(--brand-progress,0));pointer-events:none}
body[data-brand-page] a:focus-visible,body[data-brand-page] button:focus-visible,body[data-brand-page] summary:focus-visible{outline:2px solid currentColor;outline-offset:5px}
/* Marketing pages inherit the same rhythm without rewriting any content. */
body[data-brand-page=home]>.wrap,body[data-brand-page=feature]>.wrap,body[data-brand-page=meeting]>.wrap{max-width:80rem;padding-inline:clamp(20px,3vw,40px)}
body[data-brand-page=home] .hero{gap:clamp(32px,4vw,64px);padding-block:clamp(40px,5vw,80px) clamp(56px,7vw,104px)}
body[data-brand-page=home] .hero h1{font-size:clamp(30px,4.1vw,58px);line-height:1.1;letter-spacing:.01em;text-wrap:balance}
body[data-brand-page=home] .hero .copy{gap:26px}
body[data-brand-page=home] .hero .lede{font-size:clamp(19px,1.6vw,23px);line-height:1.5}
body[data-brand-page=home] .hero .fine{max-width:38rem}
body[data-brand-page=home]>.wrap>section,body[data-brand-page=feature]>.wrap>section,body[data-brand-page=meeting]>.wrap>section{padding-block:var(--brand-space)}
body[data-brand-page=home] .head,body[data-brand-page=feature] .head,body[data-brand-page=meeting] .head{gap:18px;max-width:54rem;margin-bottom:clamp(32px,4vw,56px)}
body[data-brand-page=home] .head h2,body[data-brand-page=feature] .head h2,body[data-brand-page=meeting] .head h2{font-size:var(--brand-display);line-height:1.14;letter-spacing:.055em;text-wrap:balance}
body[data-brand-page=home] .head>.lede,body[data-brand-page=feature] .head>.lede,body[data-brand-page=meeting] .head>.lede{font-size:clamp(18px,1.6vw,22px);font-weight:500;line-height:1.65;max-width:48rem}
body[data-brand-page=home] .eyebrow,body[data-brand-page=feature] .eyebrow,body[data-brand-page=meeting] .eyebrow{letter-spacing:.14em}
body[data-brand-page=home] .vc-row{margin-top:44px}
body[data-brand-page=home] #demo .demo{border-radius:var(--brand-radius);padding:clamp(22px,3vw,40px);box-shadow:0 24px 64px #00000012}
body[data-brand-page=home] #demo .demo-bar{gap:16px;align-items:end}
body[data-brand-page=home] #demo .demo-out{gap:28px}
body[data-brand-page=home] #speed .speed{padding:clamp(20px,3vw,36px);background:var(--sunk);border-radius:var(--brand-radius)}
body[data-brand-page=home] #speed .speed .row{padding-block:24px}
body[data-brand-page=home] #speed .speed .val{font-size:clamp(26px,3vw,40px);letter-spacing:-.02em}
body[data-brand-page=home] #problem .cards{gap:18px}
body[data-brand-page=home] #problem .card{padding:30px 26px;border-radius:var(--brand-radius)}
body[data-brand-page=home] #problem .cards.two{margin-top:24px}
body[data-brand-page=home] #problem .cards.two h3{font-size:clamp(22px,2vw,28px);line-height:1.35}
body[data-brand-page=home] #problem .cards.two p{font-size:16px;line-height:1.7}
body[data-brand-page=home] .crowd,body[data-brand-page=feature] .crowd{border-radius:var(--brand-radius);padding:clamp(26px,4vw,52px)}
body[data-brand-page=home] .crowd .head h2,body[data-brand-page=feature] .crowd .head h2{font-size:clamp(26px,2.7vw,38px)}
body[data-brand-page=home] .hear-photo{overflow:hidden;border-radius:var(--brand-radius);margin-bottom:32px}
body[data-brand-page=home] .hear-photo img{border-radius:inherit}
body[data-brand-page=home] #languages .picker{border-radius:var(--brand-radius)}
body[data-brand-page=home] #languages .picker-search{padding-inline:22px}
body[data-brand-page=home] #languages .row{padding:14px 22px}
body[data-brand-page=home] .spk{gap:24px}
body[data-brand-page=home] .spk-side{gap:24px}
body[data-brand-page=home] .spk-shot,body[data-brand-page=home] .spk-shot img,body[data-brand-page=home] .spk-facts,body[data-brand-page=home] .spk-pick{border-radius:var(--brand-radius)}
body[data-brand-page=home] .plans{gap:18px}
body[data-brand-page=home] .plan{padding:30px 24px 26px;border-radius:var(--brand-radius);min-height:300px}
body[data-brand-page=home] .plan .price{font-size:clamp(40px,3.5vw,56px);letter-spacing:-.02em}
body[data-brand-page=home] .plan h3{font-size:18px}
body[data-brand-page=home] .plan p{line-height:1.65}
body[data-brand-page=home] #faq .faq{max-width:58rem;margin-inline:auto}
body[data-brand-page=home] #faq details{padding-block:25px}
body[data-brand-page=home] #faq summary{font-size:clamp(16px,1.45vw,20px);line-height:1.55}
body[data-brand-page=home] #faq details p{font-size:16px;line-height:1.8}
body[data-brand-page=home] .reads{gap:24px}
body[data-brand-page=home] .read{border-radius:var(--brand-radius)}
body[data-brand-page=home] .readbody{padding:25px 24px}
body[data-brand-page=home] .readbody h3{font-size:23px;line-height:1.35}
body[data-brand-page] footer .wrap{padding-top:80px;padding-bottom:44px}
body[data-brand-page] .foot-mark{font-size:28px;letter-spacing:.1em}
body[data-brand-page] .foot-top{gap:32px}
body[data-brand-page] .foot-seo,body[data-brand-page] .foot-priv li{color:#aab3b8;line-height:1.8}
body[data-brand-page] .foot-col a{font-size:14px}
body[data-brand-page] .foot-lang-links a{padding:9px 14px}
body[data-brand-page] .foot-bottom{color:#aab3b8;line-height:1.75}
/* Editorial pages: readable articles, confident covers, no moving paragraphs. */
body[data-brand-page=editorial] .band .in,body[data-brand-page=editorial] .hero .in{padding-block:clamp(64px,8vw,120px)}
body[data-brand-page=editorial] .band h1,body[data-brand-page=editorial] .hero h1{font-size:clamp(30px,4.2vw,60px);line-height:1.1;letter-spacing:.02em}
body[data-brand-page=editorial] .posts{gap:28px;padding-block:56px 88px}
body[data-brand-page=editorial] .post{border-radius:20px;overflow:hidden}
body[data-brand-page=editorial] article p,body[data-brand-page=editorial] article li{line-height:1.85}
body[data-brand-page=editorial] article h2{line-height:1.3;margin-top:2.4em}
/* About, support and legal retain every word, anchor and form. */
html[data-brand-experience]:has(body[data-brand-page=document]){color-scheme:light dark;background:light-dark(#fff,#000)}
body[data-brand-page=document]{--brand-paper:light-dark(#fff,#000);--brand-text:light-dark(#14191d,#eef2f3);--brand-muted:light-dark(#525d63,#aab3b8);font-family:"Montserrat",system-ui,sans-serif;font-size:16px;font-weight:500;line-height:1.8;max-width:820px;margin:0 auto;padding:clamp(28px,6vw,76px) 24px 90px;background:var(--brand-paper);color:var(--brand-text)}
body[data-brand-page=document] h1{font-size:clamp(30px,4.2vw,48px);line-height:1.16;letter-spacing:-.015em;margin:36px 0 28px;text-wrap:balance}
body[data-brand-page=document] h2{font-size:clamp(21px,2.4vw,28px);line-height:1.35;margin-top:2.2em;margin-bottom:.7em;text-wrap:balance}
body[data-brand-page=document] p,body[data-brand-page=document] li{line-height:1.85}
body[data-brand-page=document] a{color:light-dark(#006c49,#5ee5b6);text-underline-offset:4px}
body[data-brand-page=document] .home,body[data-brand-page=document]>.muted:first-child{border-bottom:1px solid light-dark(#e4e4e4,#283339);padding-bottom:24px;font-size:14px}
body[data-brand-page=document] .home a,body[data-brand-page=document]>.muted:first-child a{display:inline-flex;align-items:center;gap:10px;color:var(--brand-text);font-weight:700;text-decoration:none}
body[data-brand-page=document] .home a::before,body[data-brand-page=document]>.muted:first-child a::before{content:"";width:30px;height:30px;flex:none;background:url('/img/tradulive-brand.webp') center/contain no-repeat}
body[data-brand-page=document] .muted,body[data-brand-page=document] .updated{color:var(--brand-muted);opacity:1}
body[data-brand-page=document] input,body[data-brand-page=document] textarea,body[data-brand-page=document] button{font:inherit;max-width:100%;min-height:44px}
@media(max-width:1024px){
 body[data-brand-page] .topbar nav{gap:16px}
 body[data-brand-page=home] #problem .cards.four{grid-template-columns:repeat(2,minmax(0,1fr))}
 body[data-brand-page=home] .plan{min-height:280px}
}
@media(max-width:760px){
 html[data-brand-experience]{scroll-padding-top:110px;--brand-space:64px;--brand-display:clamp(28px,5.7vw,40px)}
 body[data-brand-page] .topbar .brand{font-size:15px;letter-spacing:.1em}
 body[data-brand-page] .topbar .brand::before{width:28px;height:28px}
 body[data-brand-page=home] .hero{padding-block:36px 60px}
 body[data-brand-page=home] .hero h1{font-size:clamp(30px,6.8vw,44px)}
 body[data-brand-page=home] .hero .copy{gap:22px}
 body[data-brand-page=home] .spk,body[data-brand-page=home] .spk-side{gap:16px}
 body[data-brand-page=home] .head>.lede,body[data-brand-page=feature] .head>.lede,body[data-brand-page=meeting] .head>.lede{font-size:18px;line-height:1.65}
 body[data-brand-page=home] .readbody h3{font-size:21px}
 body[data-brand-page] footer .wrap{padding-top:60px}
 body[data-brand-page] .foot-mark{font-size:24px}
 body[data-brand-page] .topbar .bar{gap:12px}
}
@media(max-width:480px){
 body[data-brand-page=home] #problem .cards.four{grid-template-columns:1fr}
 body[data-brand-page=home] .plan{min-height:0;padding:28px 24px}
 body[data-brand-page=home] #demo .demo{padding:22px 18px}
 body[data-brand-page=home] #speed .speed{padding:20px 16px}
 body[data-brand-page=home] #speed .speed .row{padding-block:19px}
 body[data-brand-page=home] .hero h1{font-size:30px;line-height:1.16}
 body[data-brand-page=home] .hero .lede{font-size:19px}
 body[data-brand-page=document]{padding-inline:20px;font-size:16px}
}
@media(prefers-reduced-motion:reduce){
 html[data-brand-experience]{scroll-behavior:auto}
 body[data-brand-page] *,body[data-brand-page] *::before,body[data-brand-page] *::after{transition:none!important}
}

/* Compact product entry points sit inside the footer's brand information. */
body[data-brand-page] .topbar .brand{flex-shrink:0}
body[data-brand-page] .topbar .links{flex-wrap:nowrap}
body[data-brand-page] .footer-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;max-width:300px;margin:18px 0 0;padding:0;box-sizing:border-box}
body[data-brand-page] .footer-actions .footer-action{display:flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:8px 10px;box-sizing:border-box;border:1px solid #ffffff45;border-radius:8px;background:#151b1b;color:#fff;text-decoration:none;font:700 12px/1.3 var(--words,sans-serif);letter-spacing:0;text-transform:none;white-space:nowrap}
body[data-brand-page] .footer-action svg{width:18px;height:18px;flex:none}
body[data-brand-page] .footer-actions .footer-action-meeting{grid-column:1/-1;background:#00e69a;border-color:#00e69a;color:#04130d}
body[data-brand-page] .footer-action:hover{filter:brightness(1.15)}
body[data-brand-page] .topbar>.wrap>nav{flex-wrap:nowrap}
body[data-brand-page] .topbar>.wrap>nav>.links{flex-basis:auto;min-width:0}