/* Language controls preserve the existing navigation and English typography. */
/* Keep the original announcement centered, with language tabs at the right edge. */
.announce:has(.language-switch),body:not(.inner)>.announce:has(.language-switch),.native-chrome>.announce:has(.language-switch){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,auto) minmax(0,1fr);align-items:center;gap:4px 20px;padding:6px max(20px,calc((100% - 1224px)/2))}
.announce>.announcement-copy{display:block;grid-column:2;min-width:0;font-size:14px;line-height:1.6;text-align:center;overflow-wrap:anywhere}
.announce>.language-switch{grid-column:3;justify-self:end}
@media(max-width:1000px){
 .announce:has(.language-switch),body:not(.inner)>.announce:has(.language-switch),.native-chrome>.announce:has(.language-switch){grid-template-columns:minmax(0,1fr) auto;gap:4px 16px}
 .announce>.announcement-copy{grid-column:1;text-align:left}
 .announce>.language-switch{grid-column:2}
}
.language-switch{display:inline-flex;align-items:center;gap:3px;flex:0 0 auto;font-family:'DM Sans','Noto Sans Devanagari',Arial,sans-serif;font-size:14px;line-height:1.5;letter-spacing:0;text-transform:none}
.language-switch svg{width:16px;height:16px;margin-right:4px;flex:0 0 auto}
.language-switch a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:52px;padding:3px 8px;border-radius:6px;color:inherit;text-decoration:none;white-space:nowrap}
.language-switch a[aria-current="true"]{background:#ffffff30;box-shadow:inset 0 0 0 1px currentColor}
.language-switch a:hover{text-decoration:underline}
.language-switch a:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.language-scope-note{font-size:12px;line-height:1.75;text-align:center;padding:8px 20px;background:#F4F6FB;color:#414B5D;margin:0}
/* Hindi needs its own shaping, line heights and wrapping; English rules stay untouched. */
html[lang="hi-IN"] body,html[lang="hi-IN"] button,html[lang="hi-IN"] input,html[lang="hi-IN"] select,html[lang="hi-IN"] textarea{font-family:'Noto Sans Devanagari','Nirmala UI',Mangal,system-ui,sans-serif;line-height:1.65}
html[lang="hi-IN"] h1,html[lang="hi-IN"] h2,html[lang="hi-IN"] h3,html[lang="hi-IN"] h4,html[lang="hi-IN"] em,html[lang="hi-IN"] .serif{font-family:'Noto Sans Devanagari','Nirmala UI',Mangal,system-ui,sans-serif;line-height:1.35;letter-spacing:0;font-style:normal}
html[lang="hi-IN"] .hero.center h1{font-size:clamp(34px,4.1vw,63px);max-width:1120px;line-height:1.4}
html[lang="hi-IN"] .eyebrow,html[lang="hi-IN"] .kicker,html[lang="hi-IN"] .section-label{letter-spacing:0;text-transform:none}
html[lang="hi-IN"] .btn,html[lang="hi-IN"] .carousel-tab,html[lang="hi-IN"] .module-tab,html[lang="hi-IN"] .billing-controls button{white-space:normal;line-height:1.65}
html[lang="hi-IN"] .home-composed .module-tab .module-label>span{white-space:normal;overflow-wrap:anywhere}
html[lang="hi-IN"] .module-tab{min-width:0}
html[lang="hi-IN"] .navlinks{gap:22px}
html[lang="hi-IN"] .nav summary{font-size:13px}
html[lang="hi-IN"] .phone-frame,html[lang="hi-IN"] .mini-window,html[lang="hi-IN"] .desktop-window{min-width:0}
html[lang="hi-IN"] .bubble,html[lang="hi-IN"] .ui-message,html[lang="hi-IN"] .wa-name,html[lang="hi-IN"] .app-sidebar,html[lang="hi-IN"] .dashboard-sidebar{overflow-wrap:anywhere;line-height:1.6}
html[lang="hi-IN"] .price-card h3,html[lang="hi-IN"] .billing-description,html[lang="hi-IN"] .faq-item{overflow-wrap:anywhere}
html[lang="hi-IN"] .module-panel p,html[lang="hi-IN"] .home-demo p,html[lang="hi-IN"] .faq-item p{line-height:1.85}
@media(max-width:760px){
 .announce:has(.language-switch),body:not(.inner)>.announce:has(.language-switch),.native-chrome>.announce:has(.language-switch){grid-template-columns:minmax(0,1fr);gap:4px;padding:8px 12px}
 .announce>.announcement-copy{grid-column:1;text-align:center}
 .announce>.language-switch{grid-column:1;justify-self:end}
 html[lang="hi-IN"] .hero.center h1{font-size:clamp(29px,7.7vw,44px);line-height:1.45}
 html[lang="hi-IN"] .carousel-tabs .carousel-tab{font-size:12px;padding-left:5px;padding-right:5px}
 html[lang="hi-IN"] .hero-carousel .carousel-navigation{height:auto}
 html[lang="hi-IN"] .hero p{font-size:16px}
 html[lang="hi-IN"] .home-composed .module-tab{font-size:14px}
 html[lang="hi-IN"] .language-scope-note{padding:7px 14px}
}
/* Do not crop longer Hindi conversation examples into fixed English art heights. */
html[lang="hi-IN"] .hero-carousel .home-demo .product-art{height:auto;min-height:430px;overflow:visible;padding-bottom:28px}
html[lang="hi-IN"] .hero-carousel .home-demo .desktop-art{height:auto;min-height:430px;overflow:visible}
@media(max-width:760px){html[lang="hi-IN"] .hero-carousel .home-demo .product-art,html[lang="hi-IN"] .hero-carousel .home-demo .desktop-art{min-height:0}}
@media(max-width:900px){html[lang="hi-IN"] .hero.center .hero-carousel .carousel-tabs .carousel-tab{font-size:12px;line-height:1.65}}
/* Full-site Hindi UI must wrap at small phone widths without changing English layout. */
html[lang="hi-IN"] .native-main{font-family:'Noto Sans Devanagari','Nirmala UI',Mangal,system-ui,sans-serif}
html[lang="hi-IN"] .native-main :is(button,label,select,input,textarea){font-family:inherit}
html[lang="hi-IN"] .native-main :is(button,label,h1,h2,h3,p){overflow-wrap:anywhere}
html[lang="hi-IN"] .native-main :is(button,select){line-height:1.65}
html[lang="hi-IN"] :is(.card,.price,.feature-card,.ui-window,.phone-screen){min-width:0}
html[lang="hi-IN"] :is(.breadcrumb,.card h3,.price p,.footer a,.nav a){overflow-wrap:anywhere}
@media(max-width:430px){html[lang="hi-IN"] .native-main :is(h1,h2){line-height:1.45}html[lang="hi-IN"] .native-main button{white-space:normal}}

/* Inner Instagram mockups keep Hindi shaping and full profile labels. */
html[lang="hi-IN"] .ig-screen{font-family:'Noto Sans Devanagari','Nirmala UI',Mangal,system-ui,sans-serif;line-height:1.65}
html[lang="hi-IN"] .ig-profile-name strong{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;line-height:1.6}

/* Shared homepage platform tab alignment. Numbers span both label rows. */
.home-composed .module-tab{align-items:center}
.home-composed .module-tab .module-step{grid-row:1/3;align-self:center;margin-right:0}
.home-composed .module-tab .module-label>span:last-child{grid-column:2}
