/* Shared verbatim family hero geometry, reused by the apps hub. */
.hero .app-info{container-type:inline-size;min-width:0}
.hero{display:grid;gap:64px;align-items:center;padding:56px 48px}
.hero.has-preview{grid-template-columns:minmax(220px,.8fr) minmax(0,1fr)}
.hero.text-led .app-info{max-width:780px;margin:auto}.hero.text-led{padding:72px}
.app-identity{display:flex;align-items:center;gap:20px;margin-bottom:38px}.app-identity :is(p,h2){margin:0;font-weight:620;font-size:1.5rem;letter-spacing:-.035em}
.app-icon{display:block;object-fit:contain;width:88px;height:88px;filter:drop-shadow(0 6px 14px #24182b14)}
.hero .app-description{font-size:clamp(1.25rem,2.1vw,1.5rem);line-height:1.5;letter-spacing:-.012em}
.hero .app-promise{color:var(--wtk-color-page-title);font-size:clamp(2rem,12cqi,4.25rem);font-weight:700;line-height:1.12;letter-spacing:-.035em;text-wrap:balance;margin:20px 0 24px}
.iphone-preview{position:relative}.hero-pro-label{position:absolute;inset:calc(100% + 10px) 0 auto;margin:0;text-align:center;font-size:0.8125rem;font-weight:620;line-height:1.4;color:var(--wtk-color-page-muted)}
@media(max-width:992px){.hero{gap:36px;padding:40px 32px}.hero.has-preview{grid-template-columns:minmax(180px,.7fr) minmax(0,1fr)}}
@media(max-width:768px){.hero,.hero.text-led{padding:32px 24px;gap:36px}.hero.has-preview{grid-template-columns:1fr}.app-identity{margin-bottom:28px;gap:16px}.app-icon{width:64px;height:64px}.app-identity :is(p,h2){font-size:1.375rem}.hero .app-promise{font-size:clamp(2rem,12cqi,2.75rem)}.hero .app-description{font-size:1.25rem}}
@media(max-width:460px){.hero,.hero.text-led{padding:28px 20px}.app-identity :is(p,h2){font-size:1.25rem}}

.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}.button{display:inline-flex;gap:18px;align-items:center;justify-content:center;border-radius:999px;padding:13px 23px;font-size:0.9375rem;font-weight:620;text-decoration:none;min-height:48px}
.button-primary:hover{text-decoration:none}
@media(max-width:768px){.hero .app-info{grid-row:1}.hero:has(.hero-pro-label){padding-bottom:64px}}
@media(max-width:460px){.hero .actions{align-items:stretch}.hero .button{padding:12px 18px}}