/*
 * Tawasol shared layout system
 * Loaded last on every route. This is the canonical source for page gutters,
 * responsive typography, section rhythm and repeatable card distribution.
 */
:root {
  --site-max: 1180px;
  --site-gutter: 32px;
  --site-shell: min(var(--site-max), calc(100vw - (var(--site-gutter) * 2)));
  --site-section: clamp(72px, 7vw, 104px);
  --site-card-gap: 14px;
  --site-touch-target: 44px;
}

/* One container contract for the shared mobile suite in all locales. */
.ms-shell {
  width: var(--site-shell);
}

/* Homepage hero — one composition, isolated from the shared layout rules. */
body.home-page .home-hero-v2 {
  min-height: 0;
  padding: 76px 0 86px;
  overflow: hidden;
  background:
    radial-gradient(circle at 88% 38%, rgba(178, 238, 99, .18), transparent 27%),
    linear-gradient(135deg, #fbfdf8 0%, #f6faf4 52%, #eef8f1 100%);
}

body.home-page .home-hero-v2::before {
  opacity: .34;
  background-size: 28px 28px;
  mask-image: linear-gradient(90deg, transparent 52%, #000 100%);
}

body.home-page .home-hero-v2::after {
  display: none;
}

body.home-page .home-hero-v2-grid {
  width: var(--site-shell);
  min-height: 620px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(0, 520px) minmax(0, 1fr);
  gap: 64px;
  align-items: center;
}

body.home-page .home-hero-v2-copy,
body.home-page .home-hero-v2-copy h1 {
  width: 100%;
  max-width: 520px;
}

body.home-page .home-hero-v2-copy {
  position: relative;
  z-index: 6;
  padding: 0;
}

body.home-page .home-hero-v2-copy > .eyebrow {
  margin: 0 0 22px;
  padding: 7px 12px;
  border-color: rgba(8, 166, 87, .28);
  background: rgba(255, 255, 255, .78);
  box-shadow: 0 8px 24px rgba(11, 81, 52, .06);
}

body.home-page .home-hero-v2-copy h1 {
  position: relative;
  isolation: isolate;
  margin: 0;
  font-size: clamp(47px, 3.55vw, 52px);
  font-weight: 650;
  line-height: .96;
  letter-spacing: -.058em;
  text-wrap: initial;
}

body.home-page .home-hero-v2-copy h1::before {
  display: none;
}

body.home-page .home-hero-v2-copy h1 > span,
body.home-page .home-hero-v2-copy h1 > em {
  position: relative;
  z-index: 1;
  display: block;
  white-space: nowrap !important;
  color: #073c2a;
}

body.home-page .home-hero-v2-copy h1 > span {
  font-size: max(14px, 1em) !important;
  line-height: inherit;
  letter-spacing: inherit;
}

body.home-page .home-hero-v2-copy h1 > span::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: 1px;
  height: .5em;
  border-radius: 999px;
  background: rgba(186, 242, 99, .72);
}

body.home-page .home-hero-v2-copy h1 > span:first-child::after {
  left: 31%;
  right: 0;
}

body.home-page .home-hero-v2-copy h1 > span:nth-child(2)::after {
  left: 15%;
  width: 62%;
  background: rgba(177, 238, 94, .84);
}

body.home-page .home-hero-v2-copy h1 > span + span {
  margin-top: 4px;
}

body.home-page .home-hero-v2-copy h1 > em {
  width: max-content;
  margin-top: 16px;
  padding: 5px 14px 8px;
  border-radius: 12px;
  background: #baf263;
  color: #073c2a;
  font-size: max(14px, .94em);
  line-height: .94;
  font-style: normal;
  transform: none;
  box-shadow: 0 8px 22px rgba(82, 157, 61, .12);
}

body.home-page .home-hero-v2-copy > p {
  width: 100%;
  max-width: 500px;
  margin: 25px 0 0;
  color: #50695f;
  font-size: 17px;
  line-height: 1.58;
  text-wrap: pretty;
}

body.home-page .home-hero-v2-copy .hero-actions {
  margin-top: 28px;
  gap: 10px;
}

body.home-page .home-hero-v2-copy .button {
  min-height: 50px;
  padding-inline: 20px;
  border-radius: 12px;
}

body.home-page .home-hero-proof {
  margin-top: 24px;
  padding-top: 18px;
  gap: 10px 16px;
}

body.home-page .home-product-stage {
  width: 100%;
  min-height: 570px;
  margin: 0;
  transform: none;
}

body.home-page .home-product-stage::before {
  inset: 50px -80px 10px 28px;
  border-radius: 38px;
  background: linear-gradient(145deg, #dff7bb 0%, #9de1b2 48%, #50bf88 100%);
  box-shadow: inset 0 0 0 1px rgba(6, 100, 57, .08), 0 28px 70px rgba(11, 85, 54, .13);
}

body.home-page .home-product-stage::after,
body.home-page .home-product-orbit {
  display: none;
}

body.home-page .home-product-tabs {
  left: 56px;
  right: -24px;
  top: 16px;
  padding: 5px;
  border-radius: 15px;
  box-shadow: 0 16px 34px rgba(8, 72, 47, .11);
}

body.home-page .home-product-tabs button {
  min-height: 43px;
  border-radius: 10px;
}

body.home-page .home-dashboard-device {
  left: 28px;
  right: -54px;
  top: 92px;
  border-radius: 18px;
  transform: perspective(1200px) translate(var(--stage-x), var(--stage-y)) rotateY(-2deg);
  box-shadow: 0 28px 64px rgba(4, 62, 39, .2);
}

body.home-page .home-dashboard-device > img {
  max-height: 420px;
}

body.home-page .home-phone-device {
  left: -22px;
  bottom: -6px;
  width: 148px;
  transform: translate(calc(var(--stage-x) * -.45), calc(var(--stage-y) * -.45)) rotate(-4deg);
}

body.home-page .home-phone-device:hover {
  transform: translate(calc(var(--stage-x) * -.45), calc(var(--stage-y) * -.45 - 6px)) rotate(-2deg);
}

body.home-page .home-phone-device > span {
  display: none;
}

body.home-page .home-product-caption {
  right: -22px;
  bottom: 4px;
  width: 260px;
  padding: 16px 18px;
  border-radius: 15px;
}

body.home-page .home-reach-signal {
  right: -16px;
  top: 120px;
  transform: scale(.9);
  transform-origin: top right;
}

@media (max-width: 1100px) {
  body.home-page .home-hero-v2-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 46px;
  }

  body.home-page .home-hero-v2-copy,
  body.home-page .home-hero-v2-copy h1 {
    max-width: 680px;
  }

  html[lang="en"] body.home-page .home-hero-v2-copy h1 {
    font-size: clamp(57px, 4.2vw, 62px);
  }

  body.home-page .home-product-stage {
    width: min(760px, 100%);
    margin-inline: auto;
  }
}

@media (max-width: 680px) {
  body.home-page .home-hero-v2 {
    padding: 46px 0 58px;
  }

  body.home-page .home-hero-v2-grid {
    width: calc(100vw - 32px);
    min-height: 0;
    gap: 34px;
  }

  body.home-page .home-hero-v2-copy h1 {
    font-size: clamp(38px, 11vw, 47px) !important;
    line-height: .98 !important;
  }

  body.home-page .home-hero-v2-copy h1 > span {
    white-space: normal !important;
    font-size: max(14px, 1em) !important;
    line-height: inherit;
  }

  body.home-page .home-hero-v2-copy h1 > em {
    margin-top: 12px;
    white-space: nowrap !important;
  }

  body.home-page .home-hero-v2-copy h1::before {
    display: none;
  }

  body.home-page .home-hero-v2-copy > p {
    margin-top: 21px;
    font-size: 17px;
    line-height: 1.55;
  }

  body.home-page .home-hero-v2-copy .hero-actions {
    display: grid;
    grid-template-columns: 1fr;
    margin-top: 24px;
  }

  body.home-page .home-product-stage {
    min-height: 390px;
  }

  body.home-page .home-product-stage::before {
    inset: 38px -24px 4px 8px;
    border-radius: 24px;
  }

  body.home-page .home-product-tabs {
    left: 12px;
    right: 0;
    top: 0;
  }

  body.home-page .home-dashboard-device {
    left: 8px;
    right: -18px;
    top: 64px;
  }

  body.home-page .home-phone-device {
    left: -4px;
    bottom: 0;
    width: 92px;
  }

  body.home-page .home-product-caption {
    right: 0;
    bottom: -4px;
    width: 205px;
    padding: 12px 14px;
  }

  body.home-page .home-reach-signal {
    display: none;
  }
}

@media (max-width: 350px) {
  .story-design-broadcast .product-story-copy h1 {
    font-size: 28px !important;
  }
}

/* Late route-specific desktop grid declarations were overriding their own
   mobile breakpoint and squeezing Arabic headings into 16-36px columns. */
@media (max-width: 760px) {
  .sec17-heading,
  .why-deployment-heading {
    grid-template-columns: minmax(0, 1fr);
  }

  .sec17-heading > div,
  .why-deployment-heading > div {
    min-inline-size: 0;
  }
}

@media (max-width: 680px) {
  body.home-page .home-hero-v2-copy h1 > span {
    font-size: 32px !important;
    line-height: 1.12 !important;
  }

  .dashboard-v3-head h2,
  .app-intro-v2-heading h2 {
    font-size: 28px !important;
    line-height: 1.12 !important;
  }

  .blog-hero h1 {
    font-size: 30px !important;
    line-height: 1.1 !important;
  }

  .article-hero h1 {
    font-size: 32px !important;
    line-height: 1.12 !important;
    max-inline-size: none;
  }

  .article-body h2 {
    font-size: 28px !important;
    line-height: 1.16 !important;
  }

  .article-next h2 {
    font-size: 26px !important;
    line-height: 1.2 !important;
  }

  .product-story-copy h1,
  .sv-app-hero-copy h1,
  .sx-hero-copy h1 {
    font-size: 30px !important;
    line-height: 1.12 !important;
  }

  .sx-section-head h2,
  .sx-targeting h2,
  .sx-closing h2,
  .sv-app-alive h2,
  .sv-app-closing h2 {
    font-size: 30px !important;
    line-height: 1.16 !important;
  }
}

/* English app accessibility and final mobile hub repair. */
.skip-link {
  position: fixed;
  z-index: 10000;
  left: 16px;
  top: 12px;
  padding: 12px 16px;
  border-radius: 10px;
  background: #092f24;
  color: #fff;
  font-weight: 800;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform .18s ease;
}

.skip-link:focus {
  transform: translateY(0);
  outline: 3px solid #b9f065;
  outline-offset: 3px;
}

.app-hub .hub-connection h2 {
  max-width: 620px;
  font-size: clamp(42px, 4.1vw, 56px);
}

@media (max-width: 680px) {
  .menu-button {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
  }

  .app-hub .product-hub-hero > .section-shell {
    width: calc(100% - 28px);
    max-width: calc(100% - 28px);
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 30px;
  }

  .app-hub .hub-copy h1 {
    max-width: 340px;
    font-size: 36px !important;
    line-height: 1.04 !important;
  }

  .app-hub .hub-stage {
    width: 100%;
    min-height: 0;
    padding: 24px 10px 10px;
    overflow: hidden;
  }

  .app-hub .hub-phone {
    width: min(225px, 72vw);
    margin-inline: auto;
    transform: rotate(2deg);
  }

  .app-hub .hub-stage > aside {
    position: relative;
    inset: auto;
    width: 100%;
    margin-top: 14px;
    padding: 18px;
    box-sizing: border-box;
  }

  .app-hub .hub-route-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .app-hub .hub-route-grid > button,
  .app-hub .hub-route-grid > button.active {
    grid-column: 1 !important;
    min-height: 210px;
  }
}

/* Arabic dashboard parity repair. Shared layouts remain the source of truth;
   these rules reverse placement and raise Arabic readability without DOM-wide
   runtime property swaps. */
html[lang="ar"] #app .ar-readable-microcopy {
  font-size: 14px !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html[lang="ar"] :is(.product-story-dashboard, .dashboard-hub) button,
html[lang="ar"] :is(.product-story-dashboard, .dashboard-hub) button :is(span, b, em, small, p, h3) {
  text-align: start !important;
}

html[lang="ar"] .product-story-dashboard .story-contexts article,
html[lang="ar"] .product-story-dashboard .story-contexts article :is(span, b, em, small, p, h3) {
  text-align: start !important;
}

html[lang="ar"] .product-story-dashboard :is(
  .product-story-screen > div,
  .screen-signal,
  .story-hero-proof b,
  .story-card-grid article > span,
  .story-stepper button span,
  .story-stepper button small,
  .story-step-panels article > span,
  .story-step-panels article > b,
  .story-insight em,
  .story-contexts article > span,
  .story-contexts article > small,
  .story-contexts article > em,
  .story-contexts article > b,
  .story-objection-list button,
  .faq-item button,
  label,
  small
) {
  font-size: 14px !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
}

html[lang="ar"] .product-story-dashboard :is(
  .story-card-grid p,
  .story-step-panels p,
  .story-contexts p,
  .story-objection-list p,
  .faq-item p
) {
  font-size: 17px !important;
  line-height: 1.75 !important;
}

@media (min-width: 981px) {
  html[lang="ar"] body.arabic-mirrored-page.product-story-page .product-story-dashboard .product-story-copy h1 {
    max-width: 540px !important;
    font-size: clamp(38px, 2.9vw, 42px) !important;
    line-height: 1.25 !important;
    text-wrap: balance;
  }

  html[lang="ar"] body.arabic-mirrored-page.product-story-page .story-design-event .product-story-copy h1 {
    font-size: 36px !important;
  }

  html[lang="ar"] body.arabic-mirrored-page .dashboard-hub .hub-copy h1 {
    font-size: 48px !important;
    line-height: 1.15 !important;
    text-wrap: balance;
  }

  html[lang="ar"] body.arabic-mirrored-page .dashboard-hub :is(.hub-selector h2, .hub-connection h2) {
    max-width: 760px !important;
    font-size: clamp(42px, 3.5vw, 50px) !important;
    line-height: 1.2 !important;
    text-wrap: balance;
  }
}

/* App-page hero type now follows the dashboard-page scale in every locale. */
@media (min-width:681px){
  html[lang="en"] .product-story-app .product-story-copy h1{
    font-size:clamp(39px,3vw,44px)!important;
    line-height:1!important;
    letter-spacing:-.055em!important;
  }
  html[lang="pl"] .product-story-app .product-story-copy h1{
    font-size:clamp(31px,2.4vw,36px)!important;
    line-height:1!important;
    letter-spacing:-.045em!important;
  }
  html[lang="ar"] .product-story-app .product-story-copy h1{
    font-size:clamp(38px,2.9vw,42px)!important;
    line-height:1.25!important;
    letter-spacing:0!important;
  }
  html:is([lang="en"],[lang="pl"],[lang="ar"]) .app-hub .hub-copy h1{
    font-size:48px!important;
    line-height:1.15!important;
  }
}

@media (max-width:680px){
  html:is([lang="en"],[lang="pl"]) .product-story-app .product-story-copy h1{
    font-size:34px!important;
    line-height:1.05!important;
    letter-spacing:-.035em!important;
  }
  html[lang="ar"] .product-story-app .product-story-copy h1{
    font-size:25px!important;
    line-height:1.35!important;
    letter-spacing:0!important;
  }
  html:is([lang="en"],[lang="pl"],[lang="ar"]) .app-hub .hub-copy h1{
    font-size:30px!important;
    line-height:1.25!important;
  }
}

/* The app suite uses standalone page systems, so target their real hero headings. */
@media (min-width:681px){
  html[lang="en"] :is(.sv-app-hero,.c9-hero,.cv-hero,.ep-hero,.lb-hero,.fr-hero,.ms-hero) h1{font-size:clamp(39px,3vw,44px)!important;line-height:1!important;letter-spacing:-.055em!important}
  html[lang="pl"] :is(.sv-app-hero,.c9-hero,.cv-hero,.ep-hero,.lb-hero,.fr-hero,.ms-hero) h1{font-size:clamp(31px,2.4vw,36px)!important;line-height:1!important;letter-spacing:-.045em!important}
  html[lang="ar"] :is(.sv-app-hero,.c9-hero,.cv-hero,.ep-hero,.lb-hero,.fr-hero,.ms-hero) h1{font-size:clamp(38px,2.9vw,42px)!important;line-height:1.25!important;letter-spacing:0!important}
}
@media (max-width:680px){
  html:is([lang="en"],[lang="pl"]) :is(.sv-app-hero,.c9-hero,.cv-hero,.ep-hero,.lb-hero,.fr-hero,.ms-hero) h1{font-size:34px!important;line-height:1.05!important;letter-spacing:-.035em!important}
  html[lang="ar"] :is(.sv-app-hero,.c9-hero,.cv-hero,.ep-hero,.lb-hero,.fr-hero,.ms-hero) h1{font-size:25px!important;line-height:1.35!important;letter-spacing:0!important}
}

/* English and Polish dashboard hero titles: exactly one line per title segment. */
@media (min-width: 681px) {
  html:is([lang="en"],[lang="pl"]) .dashboard-shawts-hero .product-story-copy h1 {
    width: 100% !important;
    max-width: none !important;
    line-height: 1 !important;
  }

  html:is([lang="en"],[lang="pl"]) .dashboard-shawts-hero .product-story-copy h1 > :is(span,em) {
    display: block !important;
    width: max-content !important;
    max-width: none !important;
    white-space: nowrap !important;
  }

  html:is([lang="en"],[lang="pl"]) body.product-story-page .shawts-page .sx-hero-copy h1 {
    width: 100% !important;
    max-width: none !important;
    line-height: 1 !important;
  }

  html:is([lang="en"],[lang="pl"]) body.product-story-page .shawts-page .sx-hero-copy h1 > :is(span,em) {
    display: block !important;
    width: max-content !important;
    max-width: none !important;
    white-space: nowrap !important;
  }

  html[lang="en"] .dashboard-shawts-hero .product-story-copy h1 {
    font-size: clamp(42px, 3.25vw, 47px) !important;
    letter-spacing: -.055em !important;
  }

  html[lang="en"] body.product-story-page .shawts-page .sx-hero-copy h1 {
    font-size: clamp(42px, 3.25vw, 47px) !important;
    letter-spacing: -.055em !important;
  }

  html[lang="pl"] .dashboard-shawts-hero .product-story-copy h1 {
    font-size: clamp(34px, 2.65vw, 39px) !important;
    letter-spacing: -.045em !important;
  }


  html[lang="pl"] body.product-story-page .shawts-page .sx-hero-copy h1 {
    font-size: clamp(34px, 2.65vw, 39px) !important;
    letter-spacing: -.045em !important;
  }
}

@media (min-width: 981px) {
  html:is([lang="en"],[lang="pl"]) .dashboard-shawts-hero .product-story-hero > .section-shell {
    grid-template-columns: minmax(0, 590px) minmax(0, 1fr) !important;
  }
}

@media (max-width: 680px) {
  .product-story-dashboard .product-story-screen > img {
    width: 100% !important;
    max-width: 100% !important;
    transform: none !important;
  }

  .product-story-dashboard p {
    max-width: 100% !important;
  }

  html[lang="ar"] body.arabic-mirrored-page.product-story-page .product-story-dashboard .product-story-copy h1 {
    max-width: 100% !important;
    font-size: 25px !important;
    line-height: 1.35 !important;
    text-wrap: balance;
  }

  html[lang="ar"] body.arabic-mirrored-page .dashboard-hub .hub-copy h1 {
    font-size: 30px !important;
    line-height: 1.25 !important;
    text-wrap: balance;
  }

  html[lang="ar"] body.arabic-mirrored-page.product-story-page .product-story-dashboard :is(
    .story-block-head h2,
    .story-objections header h2,
    .story-faq header h2
  ) {
    max-width: 100% !important;
    font-size: 23px !important;
    line-height: 1.3 !important;
    text-wrap: balance;
  }

  html[lang="ar"] .product-story-dashboard .product-story-nav > .section-shell::after {
    content: "مرّر للوحدات ←";
    right: auto;
    left: 0;
    background: linear-gradient(270deg, rgba(251,252,245,0), #fbfcf5 24%);
    font-size: 14px;
  }

  .story-design-moderation .queue-filter-bar {
    position: relative !important;
    inset: auto !important;
    width: auto !important;
    margin: 8px !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    overflow: visible !important;
  }

  .story-design-moderation .queue-filter-bar button {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 58px !important;
    flex: none !important;
  }

  .story-design-moderation .queue-filter-bar button:last-child {
    grid-column: 1 / -1;
  }

  html[lang="ar"] .product-story-dashboard :is(
    .library-context-destinations,
    .events-context-panels,
    .events-context-panels > article
  ) {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    box-sizing: border-box !important;
  }

  html[lang="ar"] .product-story-dashboard :is(
    .library-context-experience,
    .events-context-stage
  ) {
    min-width: 0 !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html[lang="ar"] .product-story-dashboard :is(
    .library-context-destinations,
    .events-context-panels
  ) {
    min-width: 0 !important;
  }

  html[lang="ar"] .product-story-dashboard .events-context-panels {
    position: relative !important;
    inset: auto !important;
  }

  html[lang="ar"] .story-design-broadcast .capability-note > p {
    width: auto !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
  }

  html[lang="ar"] .story-design-broadcast .capability-note {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html[lang="ar"] .story-design-broadcast .capability-note > p {
    width: 100% !important;
  }
}

/* Shawts hero final structure: protected copy and image columns. */
.product-story-dashboard.story-design-broadcast .product-story-hero > .section-shell {
  display: grid !important;
  width: var(--site-shell) !important;
  max-width: var(--site-max) !important;
  min-height: 680px !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 34px !important;
  align-items: center !important;
}

@media (min-width: 981px) {
  .product-story-dashboard.story-design-broadcast .section-shell,
  .product-story-dashboard.story-design-broadcast .product-story-block > .section-shell {
    width: var(--site-shell) !important;
    max-width: var(--site-max) !important;
    margin-inline: auto !important;
  }
}

.product-story-dashboard.story-design-broadcast .product-story-copy {
  position: relative;
  z-index: 2;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.product-story-dashboard.story-design-broadcast .product-story-copy .story-index {
  display: block !important;
  position: absolute !important;
  left: -16px !important;
  top: -94px !important;
  color: color-mix(in srgb, var(--accent) 13%, transparent) !important;
  font: 700 152px/1 "Space Grotesk", sans-serif !important;
  letter-spacing: -.09em !important;
  pointer-events: none !important;
  user-select: none !important;
}

.product-story-dashboard.story-design-broadcast .product-story-copy h1 {
  width: 100% !important;
  max-width: 100% !important;
  font-size: clamp(29px, 8.4vw, 34px) !important;
  line-height: .98 !important;
}

.product-story-dashboard.story-design-broadcast .product-story-copy > .eyebrow {
  font-size: 14px !important;
  padding: 9px 14px !important;
}

.product-story-dashboard.story-design-broadcast .product-story-copy > p {
  max-width: 590px !important;
  font-size: 20px !important;
  line-height: 1.62 !important;
}

.product-story-dashboard.story-design-broadcast .product-story-copy .button {
  min-height: 52px !important;
  padding-inline: 22px !important;
  font-size: 14px !important;
}

.product-story-dashboard.story-design-broadcast .story-hero-proof {
  max-width: 620px !important;
  gap: 9px !important;
}

.product-story-dashboard.story-design-broadcast .story-hero-proof > span {
  min-height: 66px !important;
  padding: 12px !important;
}

.product-story-dashboard.story-design-broadcast .story-hero-proof b {
  font-size: 14px !important;
}

.product-story-dashboard.story-design-broadcast .product-story-copy h1 > span {
  display: block !important;
  max-width: 100% !important;
  white-space: nowrap !important;
}

.product-story-dashboard.story-design-broadcast .product-story-hero-visual {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 12px !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

.product-story-dashboard.story-design-broadcast .product-story-screen {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  transform: none !important;
}

@media (min-width: 820px) {
  .product-story-dashboard.story-design-broadcast .product-story-hero > .section-shell {
    grid-template-columns: minmax(0, 1.03fr) minmax(0, .97fr) !important;
    gap: clamp(42px, 4vw, 58px) !important;
  }

  .product-story-dashboard.story-design-broadcast .product-story-copy h1 {
    font-size: clamp(34px, 4.05vw, 58px) !important;
    letter-spacing: -.055em !important;
  }

  .product-story-dashboard.story-design-broadcast .product-story-hero-visual {
    padding: 20px !important;
  }
}

@media (max-width: 819px) {
  .product-story-dashboard.story-design-broadcast .product-story-hero > .section-shell {
    width: calc(100% - 28px) !important;
    max-width: calc(100% - 28px) !important;
  }

  .product-story-dashboard.story-design-broadcast .product-story-hero > .section-shell {
    min-height: 0 !important;
  }

  .product-story-dashboard.story-design-broadcast .product-story-copy > p {
    font-size: 17px !important;
  }

}

@media (max-width: 680px) {
  .product-story-dashboard.story-design-broadcast .product-story-copy .story-index {
    left: -16px !important;
    top: -65px !important;
    font-size: 100px !important;
  }
}

@media (max-width: 350px) {
  .product-story-dashboard.story-design-broadcast .product-story-copy h1 {
    font-size: 27px !important;
  }
}

html,
body {
  max-width: 100%;
  overflow-x: clip;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

/* One horizontal alignment line for navigation, content and page journeys. */
.nav-shell,
.hero-grid,
.section-shell,
.journey-shell,
.breadcrumbs,
.why-page .why-shell,
.institutional-page .ip-shell,
.product-story-page .section-shell,
.dashboard-page .section-shell,
.product-hub .section-shell,
body.home-page .section-shell,
body.home-page .dashboard-v3 > .section-shell {
  width: var(--site-shell);
  margin-inline: auto;
  min-width: 0;
}

/* Headings wrap by phrase, never by forced narrow-word columns. */
:where(main) h1,
:where(main) h2,
:where(main) h3 {
  max-width: 100%;
  text-wrap: balance;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

:where(main) p,
:where(main) li,
:where(main) blockquote {
  overflow-wrap: break-word;
  word-break: normal;
  text-wrap: pretty;
}

.home-page .home-hero-v2-copy,
.home-page .home-hero-v2-copy h1 {
  width: 100%;
  max-width: 540px;
}

.home-page .home-hero-v2-copy h1 {
  font-size: clamp(52px, 4.25vw, 60px);
  line-height: 0.94;
  letter-spacing: -0.05em;
}

.home-page .home-hero-v2-copy h1 > span,
.home-page .home-hero-v2-copy h1 > em {
  white-space: normal !important;
}

.home-page .home-hero-v2-copy h1 > span {
  display: block;
  white-space: nowrap !important;
  font-size: max(14px, 1em) !important;
  line-height: inherit;
  letter-spacing: inherit;
}

.home-page .home-hero-v2-copy h1 > em {
  display: inline-block;
  width: max-content;
  margin-top: 14px;
  padding: 5px 14px 8px;
  border-radius: 14px 20px 16px 10px;
  font-size: max(14px, 1em);
  line-height: 0.92;
  transform: none;
}

.home-page .home-hero-v2-copy > p {
  max-width: 520px;
  margin-top: 24px;
  font-size: 17px;
  line-height: 1.55;
  text-wrap: pretty;
}

@media (min-width: 1101px) {
  .home-page .home-hero-v2-grid {
    width: min(1180px, calc(100vw - 64px));
    grid-template-columns: minmax(0, 540px) minmax(0, 1fr);
    gap: 44px;
  }

  .home-page .home-product-stage {
    min-height: 610px;
    transform: none;
  }

  .home-page .home-phone-device {
    left: -34px;
  }
}

/* Homepage hero typography: preserve the authored line structure and use a
   quiet underline wash instead of hard marker blocks. */
body.home-page .home-hero-v2-copy h1 > span::after {
  display: none;
}

body.home-page .home-hero-v2-copy h1 > em {
  position: relative;
  z-index: 1;
  display: block;
  width: max-content;
  margin-top: 9px;
  padding: 0 2px 3px;
  border-radius: 0;
  background: none;
  box-shadow: none;
  transform: none;
}

body.home-page .home-hero-v2-copy h1 > em::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: -3px;
  right: -5px;
  bottom: .08em;
  display: block;
  height: .18em;
  border-radius: 55% 45% 52% 48% / 60% 46% 54% 40%;
  background: rgba(174, 235, 88, .34);
  filter: blur(.7px);
  transform: rotate(-.35deg) scaleX(1.01);
  transform-origin: center;
}

@media (min-width: 1101px) {
  body.home-page .home-hero-v2-copy h1 {
    max-width: 620px;
    font-size: clamp(58px, 4.35vw, 64px);
    line-height: .94;
    letter-spacing: -.058em;
  }

  body.home-page .home-hero-v2-copy h1 > span,
  body.home-page .home-hero-v2-copy h1 > em {
    display: block !important;
    width: max-content !important;
    max-width: 100% !important;
    white-space: nowrap !important;
  }

  body.home-page .home-hero-v2-copy h1 > span + span::before,
  body.home-page .home-hero-v2-copy h1 > em::before {
    content: none !important;
  }

  html:not([lang="ar"]) body.home-page .home-product-stage {
    transform: translateX(28px);
  }

  html[lang="ar"] body.home-page .home-hero-v2-copy h1 {
    font-size: clamp(58px, 4.55vw, 67px);
    line-height: 1.18 !important;
    letter-spacing: 0;
  }
}

.dashboard-hub .product-hub-hero > .section-shell,
.app-hub .product-hub-hero > .section-shell,
.dash-overview-hero > .section-shell {
  grid-template-columns: minmax(0, 570px) minmax(0, 1fr);
  gap: 44px;
}

.dashboard-hub .hub-copy h1,
.app-hub .hub-copy h1,
.dashboard-overview .dash-hero-copy h1 {
  font-size: clamp(50px, 4vw, 58px);
  line-height: 0.98;
}

.home-page .app-intro-v2 h2 span,
.home-page .app-intro-v2 h2 em,
.product-story-copy h1,
.hub-copy h1,
.institutional-page h1,
.why-page h1,
.dashboard-page h1 {
  white-space: normal !important;
}

/* Repeatable content grids use equal tracks and equal-height cards. */
.cost-grid,
.fit-grid,
.structure-results,
.component-grid,
.story-card-grid,
.hub-route-grid,
.home-page .why-v2-grid {
  align-items: stretch;
  grid-auto-rows: 1fr;
}

.cost-grid > *,
.fit-grid > *,
.structure-results > *,
.component-grid > *,
.story-card-grid > *,
.hub-route-grid > *,
.home-page .why-v2-grid > * {
  height: 100%;
  min-width: 0;
}

/* Homepage cards are a clean, even system instead of a masonry puzzle. */
.home-page .why-v2-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--site-card-gap);
}

.home-page .why-v2-grid article:nth-child(n) {
  grid-column: auto;
  min-height: 248px;
  padding: 25px;
}

.home-page .why-v2-grid article:nth-child(6) {
  padding-right: 25px;
}

/* Product hubs show every module with equal visual weight. */
.product-hub .hub-route-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--site-card-gap);
}

.app-hub .hub-route-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.product-hub .hub-route-grid > button,
.product-hub .hub-route-grid > button.active,
.app-hub .hub-route-grid > button,
.app-hub .hub-route-grid > button.active {
  grid-column: auto;
  min-height: 250px;
  padding: 24px;
  border: 1px solid rgba(9, 82, 51, 0.16);
  border-radius: 22px;
  background: #fff;
  color: #092f24;
  font: inherit;
  transform: none;
}

.product-hub .hub-route-grid > button:nth-child(even) {
  background: #eef8e9;
}

.product-hub .hub-route-grid > button.active,
.app-hub .hub-route-grid > button.active {
  border-color: #092f24;
  background: #092f24;
  color: #fff;
}

/* The duplicated ticker set is decorative; one balanced four-item set is clearer. */
.home-page .proof-track {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  animation: none;
}

.home-page .proof-track > div {
  width: auto;
  min-width: 0;
}

.home-page .proof-track > div:nth-child(n + 5) {
  display: none;
}

.product-hub .hub-route-grid > button:hover {
  transform: translateY(-5px);
}

/* Shawts hero: reserve a hard gap between the headline and product screen. */
@media (min-width: 1101px) {
  .story-design-broadcast .product-story-hero > .section-shell {
    grid-template-columns: minmax(0, 460px) minmax(0, 1fr);
    gap: 82px;
  }

  .story-design-broadcast .product-story-copy,
  .story-design-broadcast .product-story-copy h1 {
    width: 100%;
    max-width: 460px;
  }

  .story-design-broadcast .product-story-copy h1 {
    font-size: clamp(50px, 4vw, 59px);
    line-height: .96;
    text-wrap: balance;
    overflow-wrap: normal;
  }
}

@media (min-width: 981px) and (max-width: 1100px) {
  .story-design-broadcast .product-story-hero > .section-shell {
    grid-template-columns: minmax(0, 1fr);
    gap: 48px;
  }

  .story-design-broadcast .product-story-copy {
    max-width: 680px;
  }

  .story-design-broadcast .product-story-screen {
    max-width: 820px;
    margin-inline: auto;
  }
}

/* Protect major two-column layouts from creating narrow text columns. */
.dash-overview-hero > .section-shell,
.dash-module-hero > .section-shell,
.product-hub-hero > .section-shell,
.product-story-hero > .section-shell,
.why-hero-grid,
.institutional-page .ip-hero > .ip-shell {
  min-width: 0;
}

.dash-hero-copy,
.module-identity,
.hub-copy,
.product-story-copy,
.why-hero-copy,
.ip-hero-copy,
.story-block-head,
.section-heading,
.dash-section-head {
  min-width: 0;
  max-width: 100%;
}

/* Footer uses the same outer margins as the pages above it. */
footer {
  padding-inline: max(var(--site-gutter), calc((100vw - var(--site-max)) / 2));
}

@media (max-width: 980px) {
  :root {
    --site-gutter: 22px;
    --site-section: clamp(64px, 8vw, 84px);
  }

  .home-page .why-v2-grid,
  .product-hub .hub-route-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-hub-hero > .section-shell,
  .dash-overview-hero > .section-shell,
  .dash-module-hero > .section-shell,
  .product-story-hero > .section-shell,
  .why-hero-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .home-page .home-hero-v2-copy,
  .home-page .home-hero-v2-copy h1 {
    max-width: 720px;
  }

  .home-page .home-hero-v2-copy h1 > span {
    white-space: normal !important;
    font-size: 42px !important;
  }

  .hub-copy,
  .dash-hero-copy,
  .module-identity,
  .product-story-copy,
  .why-hero-copy {
    max-width: 720px;
  }
}

@media (max-width: 680px) {
  :root {
    --site-gutter: 16px;
    --site-section: 64px;
    --site-card-gap: 10px;
  }

  .nav-shell,
  .hero-grid,
  .section-shell,
  .journey-shell,
  .breadcrumbs,
  .why-page .why-shell,
  .institutional-page .ip-shell,
  .product-story-page .section-shell,
  .dashboard-page .section-shell,
  .product-hub .section-shell,
  body.home-page .section-shell,
  body.home-page .dashboard-v3 > .section-shell {
    width: calc(100vw - 32px);
    max-width: calc(100vw - 32px);
  }

  /* Manual desktop line breaks are allowed to reflow naturally on phones. */
  :where(
    .home-hero-v2-copy,
    .why-v2-heading,
    .dash-hero-copy,
    .why-hero-copy,
    .why-heading,
    .why-scale-copy,
    .why-owner-intro,
    .ip-hero-copy,
    .section-heading,
    .story-block-head,
    .closing,
    .story-closing
  ) h1 br,
  :where(
    .home-hero-v2-copy,
    .why-v2-heading,
    .dash-hero-copy,
    .why-hero-copy,
    .why-heading,
    .why-scale-copy,
    .why-owner-intro,
    .ip-hero-copy,
    .section-heading,
    .story-block-head,
    .closing,
    .story-closing
  ) h2 br {
    display: initial;
  }

  :where(
    .home-hero-v2-copy,
    .dash-hero-copy,
    .module-identity,
    .hub-copy,
    .product-story-copy,
    .why-hero-copy,
    .ip-hero-copy,
    .hero-copy
  ) h1 {
    width: 100%;
    max-width: 100%;
    font-size: clamp(36px, 10.6vw, 43px) !important;
    line-height: 1.01 !important;
    letter-spacing: -0.045em !important;
  }

  :where(
    .why-v2-heading,
    .dashboard-v3-head,
    .app-intro-v2,
    .dash-section-head,
    .story-block-head,
    .section-heading,
    .why-heading,
    .why-thesis,
    .why-deploy-copy,
    .why-scale-copy,
    .why-owner-intro,
    .ip-heading,
    .ip-section-copy,
    .closing,
    .story-closing
  ) h2 {
    width: 100%;
    max-width: 100%;
    font-size: clamp(31px, 8.8vw, 38px) !important;
    line-height: 1.04 !important;
    letter-spacing: -0.035em !important;
  }

  .product-story-copy,
  .story-block-head,
  .story-block-intro,
  .institutional-page .ip-heading,
  .institutional-page .ip-hero-copy,
  .why-page .why-hero-copy,
  .dashboard-page .dash-hero-copy,
  .dashboard-page .module-identity,
  .product-hub .hub-copy {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .home-page .home-hero-v2-copy > p,
  .product-hub .hub-copy > p,
  .product-story-copy > p,
  .dashboard-page .dash-hero-copy > p,
  .dashboard-page .module-identity > p,
  .institutional-page .ip-hero-copy > p,
  .why-page .why-hero-copy > p {
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
  }

  .home-page .home-hero-v2-copy h1 > span,
  .home-page .home-hero-v2-copy h1 > em {
    white-space: normal !important;
  }

  .home-page .home-hero-v2-copy h1 {
    font-size: clamp(42px, 11vw, 50px) !important;
    line-height: 1.02;
  }

  .home-page .home-hero-v2-copy h1 > span {
    font-size: 36px !important;
    line-height: 1.12;
  }

  .home-page .home-hero-v2-copy h1 > em {
    margin-top: 10px;
    font-size: max(14px, 1em);
    padding: 6px 14px 9px;
  }

  .home-page .why-v2-grid,
  .product-hub .hub-route-grid,
  .cost-grid,
  .fit-grid,
  .structure-results,
  .story-card-grid,
  .component-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .home-page .proof-track {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-page .proof-track > div {
    min-height: 96px;
    padding: 18px;
  }

  .home-page .proof-track span {
    font-size: 14px;
    line-height: 1.35;
  }

  .home-page .why-v2-grid article:nth-child(n),
  .product-hub .hub-route-grid > button,
  .product-hub .hub-route-grid > button.active,
  .story-card-grid > article:nth-child(n) {
    grid-column: 1 !important;
    transform: none;
  }

  .home-page .why-v2-grid article:nth-child(n) {
    min-height: 0;
    padding: 22px;
  }

  .product-hub .hub-route-grid > button,
  .product-hub .hub-route-grid > button.active {
    min-height: 220px;
    padding: 22px;
  }

  .story-card-grid > article:nth-child(n) {
    min-height: 0;
    padding: 22px;
  }

  footer {
    padding-inline: var(--site-gutter);
  }

  .footer-top,
  .footer-grid,
  .footer-bottom {
    min-width: 0;
  }
}

/* Explicit language control shared by English and Arabic navigation. */
.language-switch {
  min-height: var(--site-touch-target);
  padding: 0 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(8, 166, 87, .3);
  border-radius: 999px;
  background: rgba(255, 255, 255, .72);
  color: #087b47;
  font-size: 14px;
  font-weight: 800;
  white-space: nowrap;
  transition: background .2s, color .2s, border-color .2s;
}

.menu-button,
.related a,
.lb-search-bar > button,
.lb-search-suggestions button {
  min-inline-size: var(--site-touch-target);
  min-block-size: var(--site-touch-target);
}

.related a {
  display: inline-flex;
  align-items: center;
}

.language-switch:hover {
  border-color: #08a657;
  background: #e8f8ed;
  color: #092f24;
}

.mobile-language-switch {
  display: none;
}

@media (max-width: 980px) {
  .mobile-language-switch {
    display: flex;
  }
}

/* Dashboard hub mobile repair, loaded after the shared product styles. */
@media (max-width: 680px) {
  .dashboard-hub .product-hub-hero > .section-shell {
    width: calc(100% - 28px);
    max-width: calc(100% - 28px);
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 30px;
  }

  .dashboard-hub .hub-copy h1 {
    font-size: 36px !important;
    line-height: 1.04 !important;
  }

  .dashboard-hub .hub-stage {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-width: 100%;
    padding: 10px;
    overflow: hidden;
  }

  .dashboard-hub .hub-stage > aside {
    position: relative;
    inset: auto;
    width: 100%;
    margin-top: 10px;
    padding: 18px;
    border-radius: 15px;
    box-shadow: none;
  }

  .dashboard-hub .hub-route-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px;
  }

  .dashboard-hub .hub-route-grid > button,
  .dashboard-hub .hub-route-grid > button.active {
    grid-column: span 1 !important;
    min-height: 180px;
    padding: 16px;
  }

  .dashboard-hub .hub-route-grid > button p {
    display: none;
  }

  .dashboard-hub .hub-route-grid > button.active {
    grid-column: 1 / -1 !important;
    min-height: 210px;
  }

  .dashboard-hub .hub-route-grid > button.active p {
    display: block;
    font-size: 17px;
  }
}

@media (max-width: 350px) {
  .dashboard-hub .hub-route-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .dashboard-hub .hub-route-grid > button,
  .dashboard-hub .hub-route-grid > button.active {
    grid-column: 1 !important;
  }
}

/* Shawts hero: two intentional headline lines with a protected image column. */
.story-design-broadcast .product-story-copy .story-index {
  display: none !important;
}

.story-design-broadcast .product-story-copy h1 > span {
  display: block;
  white-space: nowrap;
}

.story-design-broadcast .product-story-copy,
.story-design-broadcast .product-story-hero-visual {
  min-width: 0;
}

.story-design-broadcast .product-story-hero-visual {
  overflow: hidden;
  padding: 28px;
  border-radius: 32px;
}

.story-design-broadcast .product-story-hero-visual::before {
  inset: 0 !important;
}

.story-design-broadcast .product-story-screen,
.story-design-broadcast .product-story-screen::before {
  max-width: 100%;
  transform: none;
}

.story-design-broadcast .product-story-screen::before {
  inset: 0;
}

.story-design-broadcast .product-story-hero-visual .screen-signal.s1 {
  right: 12px;
}

.story-design-broadcast .product-story-hero-visual .screen-signal.s2 {
  left: 12px;
}

@media (min-width: 1101px) {
  .story-design-broadcast .product-story-hero > .section-shell {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
    gap: 64px;
  }

  .story-design-broadcast .product-story-copy,
  .story-design-broadcast .product-story-copy h1 {
    width: 100%;
    max-width: 100%;
  }

  .story-design-broadcast .product-story-copy h1 {
    font-size: clamp(40px, 3.2vw, 48px);
    line-height: .98;
  }
}

@media (min-width: 681px) and (max-width: 1100px) {
  .story-design-broadcast .product-story-copy h1 {
    width: min(100%, 650px);
    max-width: 650px;
    font-size: clamp(40px, 4.8vw, 50px);
    line-height: .98;
  }

  .story-design-broadcast .product-story-hero-visual {
    padding: 22px;
  }
}

@media (max-width: 680px) {
  .story-design-broadcast .product-story-copy h1 {
    font-size: clamp(31px, 9vw, 34px) !important;
    line-height: 1.04 !important;
  }

  .story-design-broadcast .product-story-hero-visual {
    margin-top: 4px;
    padding: 14px;
    border-radius: 22px;
  }
}

@media (max-width: 350px) {
  .story-design-broadcast .product-story-copy h1 {
    font-size: 28px !important;
  }
}

@media (max-width: 680px) {
  .product-story-dashboard .product-story-copy h1,
  .product-story-app .product-story-copy h1 {
    font-size: 29px !important;
    line-height: 1.13 !important;
  }

  .ab4-origin-question h2,
  .ab4-heading h2 {
    font-size: 28px !important;
    line-height: 1.16 !important;
  }

  .case-studies-hero h1,
  .cv-hero-copy h1,
  .why-hero-copy h1,
  .why-closing h2 {
    font-size: 34px !important;
    line-height: 1.14 !important;
  }

  .sec2-proof h2 {
    font-size: 30px !important;
    line-height: 1.16 !important;
  }

  .article-next h2 {
    font-size: 22px !important;
    line-height: 1.2 !important;
  }

  .ep-faq-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 24px !important;
  }
}

@media (min-width: 1101px) {
  .article-hero h1 {
    max-width: 900px;
    font-size: 40px !important;
  }
}

/* Dashboard heroes: keep all eight localized product images large, centered and fully contained. */
html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-hero > .section-shell {
  align-items: center !important;
}

html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-hero-visual {
  min-height: 0 !important;
  padding: 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
}

html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-hero-visual::before {
  inset: 8px !important;
  border-radius: 42px 22px !important;
}

html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-screen {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: 680px !important;
  margin: 0 auto !important;
  transform: none !important;
  overflow: visible !important;
}

html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-screen > img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  transform: none !important;
}

@media (min-width: 981px) {
  html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-hero > .section-shell {
    width: min(1320px, calc(100vw - 64px)) !important;
    max-width: 1320px !important;
    grid-template-columns: minmax(440px, 520px) minmax(0, 1fr) !important;
    gap: clamp(48px, 4vw, 64px) !important;
  }

  html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-hero-visual {
    width: 100% !important;
    padding: 20px !important;
  }

  html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-screen {
    max-width: 780px !important;
  }

  html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page .sx-hero > .sx-shell {
    width: min(1320px, calc(100vw - 64px)) !important;
    max-width: 1320px !important;
    grid-template-columns: minmax(440px, 520px) minmax(0, 1fr) !important;
    gap: clamp(48px, 4vw, 64px) !important;
  }

  html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page .sx-browser {
    max-width: 780px !important;
  }
}

html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page .sx-product-stage {
  min-height: 0 !important;
  padding: 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page .sx-product-stage::before {
  inset: 8px !important;
  border-radius: 42px 22px !important;
}

html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page .sx-browser {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  width: 100% !important;
  max-width: 680px !important;
  transform: none !important;
}

@media (max-width: 680px) {
  html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-hero,
  html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page .sx-hero {
    overflow: hidden !important;
  }

  html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-hero > .section-shell,
  html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page .sx-hero > .sx-shell {
    width: calc(100vw - 28px) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 28px) !important;
    margin-inline: auto !important;
  }

  html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-copy .hero-actions,
  html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-copy .story-hero-proof,
  html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page :is(.sx-actions,.sx-hero-proof) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero :is(.product-story-copy,.product-story-copy h1,.product-story-copy h1 span,.product-story-copy h1 em),
  html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page :is(.sx-hero-copy,.sx-hero-copy h1,.sx-hero-copy h1 span,.sx-hero-copy h1 em) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-hero-visual,
  html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page .sx-product-stage {
    padding: 14px !important;
    overflow: visible !important;
  }

  html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-screen,
  html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page .sx-browser {
    width: calc(100% - 10px) !important;
    max-width: calc(100% - 10px) !important;
  }

  html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .product-story-hero-visual::before,
  html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page .sx-product-stage::before {
    inset: 0 !important;
    border-radius: 24px 14px !important;
  }

  html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .screen-signal,
  html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page .sx-float {
    max-width: calc(100% - 16px) !important;
    white-space: normal !important;
  }

  html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .screen-signal.s1,
  html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page .sx-float-a {
    inset-inline: 8px auto !important;
  }

  html:is([lang="en"],[lang="ar"],[lang="pl"]) .dashboard-shawts-hero .screen-signal.s2,
  html:is([lang="en"],[lang="ar"],[lang="pl"]) body.product-story-page .shawts-page .sx-float-b {
    inset-inline: auto 8px !important;
  }
}
/* Site footer v2 */
.site-footer-v2{position:relative;padding:0;background:#052d22;color:#fff;border-top:0;overflow:hidden}
.site-footer-v2:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 10% 25%,rgba(105,255,116,.13),transparent 27%),radial-gradient(circle at 88% 8%,rgba(185,240,101,.16),transparent 24%),linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:auto,auto,52px 52px,52px 52px;pointer-events:none}
.site-footer-v2 .sf-shell{position:relative;width:min(1180px,calc(100vw - 48px));margin:auto;padding:30px 0 24px}
.site-footer-v2 .sf-cta{min-height:285px;padding:46px 50px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:52px;align-items:center;border:1px solid rgba(185,240,101,.42);border-radius:30px 30px 9px 30px;background:radial-gradient(circle at 82% 20%,rgba(199,255,91,.22),transparent 28%),linear-gradient(135deg,#0a5038,#087646);box-shadow:0 28px 70px rgba(0,13,9,.28),inset 0 1px rgba(255,255,255,.12)}
.site-footer-v2 .sf-kicker{display:flex;align-items:center;gap:10px;color:#c7ff5b;font-size:14px;font-weight:800;letter-spacing:.14em}.site-footer-v2 .sf-kicker i{width:8px;height:8px;border-radius:50%;background:#c7ff5b;box-shadow:0 0 0 6px rgba(199,255,91,.13)}
.site-footer-v2 .sf-cta h2{max-width:760px;margin:16px 0 0;color:#fff;font-family:"Space Grotesk","DM Sans",sans-serif;font-size:clamp(44px,4.4vw,64px);font-weight:600;line-height:.98;letter-spacing:-.052em;text-wrap:balance}
.site-footer-v2 .sf-cta p{max-width:700px;margin:20px 0 0;color:#c4dbd1;font-size:17px;line-height:1.65}
.site-footer-v2 .sf-actions{display:grid;gap:10px;min-width:210px}.site-footer-v2 .sf-button{min-height:52px;padding:0 19px;display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid rgba(255,255,255,.26);border-radius:14px 14px 5px 14px;color:#fff;font-size:14px;font-weight:800;transition:.22s}.site-footer-v2 .sf-button span{font-size:17px}.site-footer-v2 .sf-button:hover{transform:translateY(-2px);border-color:#c7ff5b;background:rgba(255,255,255,.08)}.site-footer-v2 .sf-button-primary{border-color:#c7ff5b;background:#c7ff5b;color:#073c2b;box-shadow:0 16px 34px rgba(2,30,19,.25)}.site-footer-v2 .sf-button-primary:hover{background:#d5ff8b}
.site-footer-v2 .sf-main{padding:66px 0 54px;display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);gap:80px;border-bottom:1px solid rgba(255,255,255,.12)}
.site-footer-v2 .sf-brand>a{display:inline-flex}.site-footer-v2 .sf-brand img{width:118px;height:auto;filter:brightness(0) invert(1)}.site-footer-v2 .sf-brand>p{max-width:390px;margin:25px 0;color:#a9c4b8;font-size:17px;line-height:1.7}.site-footer-v2 .sf-badges{display:flex;flex-wrap:wrap;gap:7px}.site-footer-v2 .sf-badges span{padding:8px 10px;display:flex;align-items:center;gap:7px;border:1px solid rgba(185,240,101,.2);border-radius:999px;background:rgba(255,255,255,.04);color:#d3e4dc;font-size:14px;font-weight:700}.site-footer-v2 .sf-badges i{width:5px;height:5px;border-radius:50%;background:#c7ff5b}
.site-footer-v2 .sf-links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px}.site-footer-v2 .sf-links>div{display:flex;flex-direction:column;gap:11px}.site-footer-v2 .sf-links strong{margin-bottom:8px;color:#c7ff5b;font-size:14px;letter-spacing:.12em;text-transform:uppercase}.site-footer-v2 .sf-links a{display:flex;justify-content:space-between;gap:8px;color:#d0e0d9;font-size:14px;line-height:1.4}.site-footer-v2 .sf-links a span{opacity:0;transform:translate(-5px,3px);color:#c7ff5b;transition:.2s}.site-footer-v2 .sf-links a:hover{color:#fff}.site-footer-v2 .sf-links a:hover span{opacity:1;transform:translate(0,0)}.site-footer-v2 .sf-contact>a{color:#fff;font-weight:700}.site-footer-v2 .sf-contact p{margin:5px 0 0;color:#91afa2;font-size:17px;line-height:1.6}
.site-footer-v2 .sf-signature{padding:29px 0 24px;display:flex;align-items:flex-end;justify-content:space-between;gap:30px;border-bottom:1px solid rgba(255,255,255,.12)}.site-footer-v2 .sf-signature>span{color:#c7ff5b;font-family:"Space Grotesk",sans-serif;font-size:clamp(68px,11vw,150px);font-weight:600;line-height:.72;letter-spacing:-.075em;opacity:.94}.site-footer-v2 .sf-signature small{max-width:260px;color:#88a89a;font-size:14px;font-weight:700;line-height:1.5;text-align:end;text-transform:uppercase;letter-spacing:.1em}
.site-footer-v2 .sf-bottom{padding-top:22px;display:flex;align-items:center;justify-content:space-between;gap:24px;color:#7f9f91;font-size:14px}.site-footer-v2 .sf-bottom>div{display:flex;gap:22px}.site-footer-v2 .sf-bottom a{color:#a9c1b7}.site-footer-v2 .sf-bottom a:hover{color:#c7ff5b}
html[dir="rtl"] .site-footer-v2 .sf-cta{border-radius:30px 30px 30px 9px}html[dir="rtl"] .site-footer-v2 .sf-button{border-radius:14px 14px 14px 5px}html[dir="rtl"] .site-footer-v2 .sf-kicker{letter-spacing:0}html[dir="rtl"] .site-footer-v2 .sf-cta h2{font-family:"IBM Plex Sans Arabic",sans-serif;letter-spacing:0;line-height:1.25}html[dir="rtl"] .site-footer-v2 .sf-links strong{letter-spacing:0}html[dir="rtl"] .site-footer-v2 .sf-links a span{transform:translate(5px,3px)}html[dir="rtl"] .site-footer-v2 .sf-links a:hover span{transform:none}
@media(max-width:900px){.site-footer-v2 .sf-cta{grid-template-columns:1fr;padding:40px;gap:30px}.site-footer-v2 .sf-actions{grid-template-columns:1fr 1fr}.site-footer-v2 .sf-main{grid-template-columns:1fr;gap:44px}.site-footer-v2 .sf-links{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.site-footer-v2 .sf-shell{width:calc(100vw - 28px);padding-top:14px}.site-footer-v2 .sf-cta{min-height:0;padding:30px 22px;border-radius:23px 23px 7px 23px}.site-footer-v2 .sf-cta h2{font-size:34px;line-height:1.04}.site-footer-v2 .sf-cta p{font-size:17px}.site-footer-v2 .sf-actions{grid-template-columns:1fr}.site-footer-v2 .sf-main{padding:48px 4px 40px}.site-footer-v2 .sf-links{gap:34px 24px}.site-footer-v2 .sf-links a{font-size:14px}.site-footer-v2 .sf-signature{display:block;padding:25px 0}.site-footer-v2 .sf-signature>span{font-size:max(14px, 20vw);line-height:.78}.site-footer-v2 .sf-signature small{display:block;margin-top:22px;text-align:start}.site-footer-v2 .sf-bottom{align-items:flex-start;flex-direction:column-reverse}.site-footer-v2 .sf-bottom>div{gap:18px}html[dir="rtl"] .site-footer-v2 .sf-cta{border-radius:23px 23px 23px 7px}}
/* Compact site footer v3 */
.site-footer-v3{position:relative;padding:0;background:#063326;color:#fff;border-top:1px solid #20c96d;overflow:hidden}.site-footer-v3:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 88% 0,rgba(185,240,101,.1),transparent 31%),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);background-size:auto,72px 100%;pointer-events:none}.site-footer-v3 .sf3-shell{position:relative;width:min(1180px,calc(100vw - 48px));margin:auto;padding:48px 0 22px}.site-footer-v3 .sf3-top{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(440px,1.2fr);gap:80px;align-items:center}.site-footer-v3 .sf3-brand img{width:112px;height:auto;filter:brightness(0) invert(1)}.site-footer-v3 .sf3-brand p{max-width:450px;margin:18px 0 0;color:#a8c4b8;font-size:17px;line-height:1.65}.site-footer-v3 .sf3-invite{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 24px;align-items:center;padding-inline-start:28px;border-inline-start:1px solid rgba(185,240,101,.3)}.site-footer-v3 .sf3-invite>span{grid-column:1;color:#b9f065;font-size:14px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.site-footer-v3 .sf3-invite>span i{display:inline-block;width:6px;height:6px;margin-inline-end:8px;border-radius:50%;background:#b9f065;box-shadow:0 0 0 5px rgba(185,240,101,.1)}.site-footer-v3 .sf3-invite strong{max-width:560px;font-family:"Space Grotesk","DM Sans",sans-serif;font-size:clamp(28px,2.6vw,38px);line-height:1.03;letter-spacing:-.045em;text-wrap:balance}.site-footer-v3 .sf3-invite>a{grid-column:2;grid-row:1/3;min-width:174px;min-height:50px;padding:0 17px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-radius:12px 12px 4px 12px;background:#b9f065;color:#073728;font-size:14px;font-weight:800;box-shadow:0 15px 34px rgba(0,20,12,.24);transition:.2s}.site-footer-v3 .sf3-invite>a:hover{transform:translateY(-2px);background:#ccff7f}.site-footer-v3 .sf3-invite b{font-size:16px}.site-footer-v3 .sf3-rule{height:1px;margin:40px 0;background:linear-gradient(90deg,rgba(255,255,255,.15),rgba(185,240,101,.42),rgba(255,255,255,.08))}.site-footer-v3 .sf3-middle{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:70px}.site-footer-v3 .sf3-links{display:grid;grid-template-columns:repeat(3,1fr);gap:42px}.site-footer-v3 .sf3-links>div{display:flex;flex-direction:column;gap:9px}.site-footer-v3 .sf3-links strong,.site-footer-v3 .sf3-contact>span{margin-bottom:7px;color:#b9f065;font-size:14px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.site-footer-v3 .sf3-links a{width:max-content;max-width:100%;color:#d1e1da;font-size:14px;line-height:1.5;transition:.18s}.site-footer-v3 .sf3-links a:hover{color:#b9f065;transform:translateX(3px)}.site-footer-v3 .sf3-contact{padding-inline-start:28px;border-inline-start:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;align-items:flex-start;gap:8px}.site-footer-v3 .sf3-contact>a[dir]{color:#fff;font-size:14px;font-weight:700}.site-footer-v3 .sf3-contact p{margin:0;color:#86a699;font-size:17px}.site-footer-v3 .sf3-talk{margin-top:9px;color:#b9f065;font-size:14px;font-weight:800}.site-footer-v3 .sf3-talk b{margin-inline-start:12px}.site-footer-v3 .sf3-trust{margin-top:38px;padding:18px 0;display:flex;align-items:center;justify-content:space-between;gap:30px;border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}.site-footer-v3 .sf3-trust>div{display:flex;flex-wrap:wrap;gap:18px}.site-footer-v3 .sf3-trust span{display:flex;align-items:center;gap:7px;color:#b6ccc2;font-size:14px;font-weight:700}.site-footer-v3 .sf3-trust i{width:5px;height:5px;border-radius:50%;background:#b9f065}.site-footer-v3 .sf3-trust small{color:#789b8c;font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.site-footer-v3 .sf3-bottom{padding-top:19px;display:flex;align-items:center;justify-content:space-between;gap:22px;color:#759789;font-size:14px}.site-footer-v3 .sf3-bottom>div{display:flex;gap:20px}.site-footer-v3 .sf3-bottom a{color:#9db8ad}.site-footer-v3 .sf3-bottom a:hover{color:#b9f065}html[dir="rtl"] .site-footer-v3 .sf3-invite strong{font-family:"IBM Plex Sans Arabic",sans-serif;letter-spacing:0;line-height:1.25}html[dir="rtl"] .site-footer-v3 .sf3-invite>span,html[dir="rtl"] .site-footer-v3 .sf3-links strong,html[dir="rtl"] .site-footer-v3 .sf3-contact>span{letter-spacing:0}html[dir="rtl"] .site-footer-v3 .sf3-links a:hover{transform:translateX(-3px)}html[dir="rtl"] .site-footer-v3 .sf3-invite>a{border-radius:12px 12px 12px 4px}
@media(max-width:850px){.site-footer-v3 .sf3-top{grid-template-columns:1fr;gap:34px}.site-footer-v3 .sf3-invite{padding-inline-start:0;border:0}.site-footer-v3 .sf3-middle{grid-template-columns:1fr;gap:36px}.site-footer-v3 .sf3-contact{padding:24px 0 0;border-inline-start:0;border-top:1px solid rgba(255,255,255,.1)}}
@media(max-width:600px){.site-footer-v3 .sf3-shell{width:calc(100vw - 32px);padding:38px 0 19px}.site-footer-v3 .sf3-brand p{font-size:17px}.site-footer-v3 .sf3-invite{display:flex;align-items:flex-start;flex-direction:column;gap:13px}.site-footer-v3 .sf3-invite strong{font-size:30px}.site-footer-v3 .sf3-invite>a{width:100%;margin-top:5px}.site-footer-v3 .sf3-rule{margin:34px 0}.site-footer-v3 .sf3-links{grid-template-columns:1fr 1fr;gap:31px 24px}.site-footer-v3 .sf3-contact{padding-top:25px}.site-footer-v3 .sf3-trust{align-items:flex-start;flex-direction:column;gap:16px}.site-footer-v3 .sf3-trust>div{gap:10px 16px}.site-footer-v3 .sf3-bottom{align-items:flex-start;flex-direction:column-reverse}.site-footer-v3 .sf3-bottom>div{gap:17px}}

/* Keep every English and Polish dashboard hero title to its two authored lines. */
@media (min-width: 681px) {
  html:is([lang="en"],[lang="pl"]) .dashboard-shawts-hero .product-story-copy h1,
  html:is([lang="en"],[lang="pl"]) body.product-story-page .shawts-page .sx-hero-copy h1 {
    width: 100% !important;
    max-width: none !important;
    line-height: 1 !important;
  }

  html:is([lang="en"],[lang="pl"]) .dashboard-shawts-hero .product-story-copy h1 > :is(span,em),
  html:is([lang="en"],[lang="pl"]) body.product-story-page .shawts-page .sx-hero-copy h1 > :is(span,em) {
    display: block !important;
    width: max-content !important;
    max-width: none !important;
    white-space: nowrap !important;
  }

  html[lang="en"] .dashboard-shawts-hero .product-story-copy h1,
  html[lang="en"] body.product-story-page .shawts-page .sx-hero-copy h1 {
    font-size: clamp(39px, 3vw, 44px) !important;
    letter-spacing: -.055em !important;
  }

  html[lang="pl"] .dashboard-shawts-hero .product-story-copy h1,
  html[lang="pl"] body.product-story-page .shawts-page .sx-hero-copy h1 {
    font-size: clamp(31px, 2.4vw, 36px) !important;
    letter-spacing: -.045em !important;
  }
}

@media (min-width: 981px) {
  html:is([lang="en"],[lang="pl"]) .dashboard-shawts-hero .product-story-hero > .section-shell,
  html:is([lang="en"],[lang="pl"]) body.product-story-page .shawts-page .sx-hero > .sx-shell {
    width: min(1180px, calc(100vw - 48px)) !important;
    max-width: 1180px !important;
    grid-template-columns: minmax(0, 520px) minmax(0, 1fr) !important;
    gap: 40px !important;
  }
}
/* Arabic hero parity: mirror complete compositions, controls, and copy alignment. */
html[lang="ar"] :is(.taw-static-copy,.hero-copy,.why-hero-copy,.product-story-copy,.hub-copy,.sx-hero-copy,.ms-hero-copy,.sv-app-hero-copy,.cv-hero-copy,.c9-hero-copy,.ep-hero-copy,.lb-hero-copy,.fr-hero-copy,.case-studies-hero-copy,.contact-hero-copy){text-align:right!important}
html[lang="ar"] :is(.taw-static-actions,.hero-actions,.sx-actions,.product-story-actions){direction:rtl;justify-content:flex-start}
html[lang="ar"] .taw-static-shell{direction:rtl}
html[lang="ar"] .taw-static-copy,html[lang="ar"] .taw-static-copy h1,html[lang="ar"] .taw-static-copy>p{width:100%;max-width:100%}
html[lang="ar"] :is(.hero-actions,.sx-actions,.taw-static-actions) a span[aria-hidden="true"]{display:inline-block;transform:scaleX(-1)}
@media(min-width:1101px){html[lang="ar"] body.product-story-page .shawts-page .sx-hero-copy,html[lang="ar"] body.product-story-page .story-design-structure .product-story-copy{padding-inline-start:70px;box-sizing:border-box}}
@media(max-width:680px){html[lang="ar"] :is(.taw-static-shell,.product-story-hero>.section-shell,.product-hub-hero>.section-shell,.sx-hero>.sx-shell,.ms-hero>.ms-shell){direction:rtl}html[lang="ar"] :is(.taw-static-copy,.product-story-copy,.hub-copy,.sx-hero-copy,.ms-hero-copy,.sv-app-hero-copy,.cv-hero-copy,.c9-hero-copy,.ep-hero-copy,.lb-hero-copy,.fr-hero-copy){text-align:right!important}}

/* Final app/dashboard hero-heading parity. */
@media (min-width:681px){
  html[lang="en"] .product-story-app .product-story-copy h1{font-size:clamp(39px,3vw,44px)!important;line-height:1!important;letter-spacing:-.055em!important}
  html[lang="pl"] .product-story-app .product-story-copy h1{font-size:clamp(31px,2.4vw,36px)!important;line-height:1!important;letter-spacing:-.045em!important}
  html[lang="ar"] .product-story-app .product-story-copy h1{font-size:clamp(38px,2.9vw,42px)!important;line-height:1.25!important;letter-spacing:0!important}
  html:is([lang="en"],[lang="pl"],[lang="ar"]) .app-hub .hub-copy h1{font-size:48px!important;line-height:1.15!important}
}
@media (max-width:680px){
  html:is([lang="en"],[lang="pl"]) .product-story-app .product-story-copy h1{font-size:34px!important;line-height:1.05!important;letter-spacing:-.035em!important}
  html[lang="ar"] .product-story-app .product-story-copy h1{font-size:25px!important;line-height:1.35!important;letter-spacing:0!important}
  html:is([lang="en"],[lang="pl"],[lang="ar"]) .app-hub .hub-copy h1{font-size:30px!important;line-height:1.25!important}
}

/* Final standalone app hero sizes — matches dashboard headings. */
@media (min-width:681px){
  html[lang="en"] :is(.sv-app-hero,.c9-hero,.cv-hero,.ep-hero,.lb-hero,.fr-hero,.ms-hero) h1{font-size:clamp(39px,3vw,44px)!important;line-height:1!important;letter-spacing:-.055em!important}
  html[lang="pl"] :is(.sv-app-hero,.c9-hero,.cv-hero,.ep-hero,.lb-hero,.fr-hero,.ms-hero) h1{font-size:clamp(31px,2.4vw,36px)!important;line-height:1!important;letter-spacing:-.045em!important}
  html[lang="ar"] :is(.sv-app-hero,.c9-hero,.cv-hero,.ep-hero,.lb-hero,.fr-hero,.ms-hero) h1{font-size:clamp(38px,2.9vw,42px)!important;line-height:1.25!important;letter-spacing:0!important}
}
@media (max-width:680px){
  html:is([lang="en"],[lang="pl"]) :is(.sv-app-hero,.c9-hero,.cv-hero,.ep-hero,.lb-hero,.fr-hero,.ms-hero) h1{font-size:34px!important;line-height:1.05!important;letter-spacing:-.035em!important}
  html[lang="ar"] :is(.sv-app-hero,.c9-hero,.cv-hero,.ep-hero,.lb-hero,.fr-hero,.ms-hero) h1{font-size:25px!important;line-height:1.35!important;letter-spacing:0!important}
}
/* Arabic homepage hero: true geometric mirror of the English product scene. */
html[lang="ar"] body.home-page .taw-static-hero .home-product-stage:before{inset:50px 28px 10px -80px!important;border-radius:38px!important}
html[lang="ar"] body.home-page .taw-static-hero .home-product-tabs{left:-24px!important;right:56px!important}
html[lang="ar"] body.home-page .taw-static-hero .home-dashboard-device{left:-54px!important;right:28px!important;transform:perspective(1200px) translate(var(--stage-x),var(--stage-y)) rotateY(2deg)!important}
html[lang="ar"] body.home-page .taw-static-hero .home-phone-device{left:auto!important;right:-22px!important;transform:translate(calc(var(--stage-x) * .45),calc(var(--stage-y) * -.45)) rotate(4deg)!important}
html[lang="ar"] body.home-page .taw-static-hero .home-phone-device:hover{transform:translate(calc(var(--stage-x) * .45),calc(var(--stage-y) * -.45 - 6px)) rotate(2deg)!important}
html[lang="ar"] body.home-page .taw-static-hero .home-reach-signal{left:-16px!important;right:auto!important;transform-origin:top left!important}
html[lang="ar"] body.home-page .taw-static-hero .home-product-caption{left:-22px!important;right:auto!important;border-radius:15px 15px 15px 5px!important}
@media(max-width:680px){html[lang="ar"] body.home-page .taw-static-hero .home-product-stage:before{inset:38px 14px 5px -20px!important}html[lang="ar"] body.home-page .taw-static-hero .home-product-tabs{left:4px!important;right:12px!important}html[lang="ar"] body.home-page .taw-static-hero .home-dashboard-device{left:0!important;right:12px!important;transform:none!important}html[lang="ar"] body.home-page .taw-static-hero .home-phone-device{left:auto!important;right:-6px!important;transform:rotate(3deg)!important}html[lang="ar"] body.home-page .taw-static-hero .home-product-caption{left:0!important;right:auto!important}}
@media(min-width:1101px){html[lang="ar"] body.home-page .taw-static-hero .home-product-stage{transform:translateX(-28px)!important}}

/* Homepage hero container discipline: every language uses the same page margins. */
body.home-page .taw-static-hero .taw-static-shell{
  width:min(1320px,100%)!important;
  max-width:1320px!important;
  box-sizing:border-box;
}
body.home-page .taw-static-hero .home-product-stage{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box;
}
@media(min-width:1101px){
  body.home-page .taw-static-hero .home-product-stage{transform:none!important}
  body.home-page .taw-static-hero .home-product-stage:before{inset:50px 0 10px 28px!important}
  body.home-page .taw-static-hero .home-product-tabs{left:56px!important;right:0!important}
  body.home-page .taw-static-hero .home-dashboard-device{left:28px!important;right:0!important}
  body.home-page .taw-static-hero .home-dashboard-device{transform:translate(var(--stage-x),var(--stage-y))!important}
  body.home-page .taw-static-hero .home-phone-device{left:12px!important}
  body.home-page .taw-static-hero .home-reach-signal{right:0!important}
  body.home-page .taw-static-hero .home-product-caption{right:0!important}

  html[lang="ar"] body.home-page .taw-static-hero .home-product-stage{transform:none!important}
  html[lang="ar"] body.home-page .taw-static-hero .home-product-stage:before{inset:50px 28px 10px 0!important}
  html[lang="ar"] body.home-page .taw-static-hero .home-product-tabs{left:0!important;right:56px!important}
  html[lang="ar"] body.home-page .taw-static-hero .home-dashboard-device{left:0!important;right:28px!important;transform:translate(var(--stage-x),var(--stage-y))!important}
  html[lang="ar"] body.home-page .taw-static-hero .home-phone-device{left:auto!important;right:12px!important}
  html[lang="ar"] body.home-page .taw-static-hero .home-reach-signal{left:0!important;right:auto!important}
  html[lang="ar"] body.home-page .taw-static-hero .home-product-caption{left:0!important;right:auto!important}
}
@media(max-width:680px){
  body.home-page .taw-static-hero{padding-inline:16px!important}
  body.home-page .taw-static-hero .taw-static-shell{width:100%!important;max-width:100%!important}
  body.home-page .taw-static-hero :is(.taw-static-copy,.home-product-stage){width:calc(100vw - 32px)!important;max-width:calc(100vw - 32px)!important;min-width:0!important}
  body.home-page .taw-static-hero .home-product-stage:before{inset:38px 0 4px 8px!important}
  body.home-page .taw-static-hero .home-product-tabs{left:12px!important;right:0!important}
  body.home-page .taw-static-hero .home-dashboard-device{left:8px!important;right:0!important;transform:none!important}
  body.home-page .taw-static-hero .home-phone-device{left:8px!important}
  body.home-page .taw-static-hero .home-product-caption{right:0!important}

  html[lang="ar"] body.home-page .taw-static-hero .home-product-stage:before{inset:38px 8px 4px 0!important}
  html[lang="ar"] body.home-page .taw-static-hero .home-product-tabs{left:0!important;right:12px!important}
  html[lang="ar"] body.home-page .taw-static-hero .home-dashboard-device{left:0!important;right:8px!important}
  html[lang="ar"] body.home-page .taw-static-hero .home-phone-device{left:auto!important;right:8px!important}
  html[lang="ar"] body.home-page .taw-static-hero .home-product-caption{left:0!important;right:auto!important}
  html[lang="ar"] body.home-page .taw-static-hero .taw-static-shell>.home-product-stage{width:calc(100vw - 32px)!important;max-width:calc(100vw - 32px)!important;justify-self:end!important}
}

/* Mobile audit: keep editable text at a readable size on phones. */
@media(max-width:680px){
  html body #app :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),textarea,select){font-size:16px!important}
}
/* ---------------------------------------------------------------------------
   Mobile nav sheet height fix.
   .site-header has backdrop-filter: blur(18px), which makes it a containing
   block for position:fixed descendants. So .nav-links { inset:68px 0 0 }
   resolved against the 75px-tall header instead of the viewport, leaving a
   ~44px tall menu that showed one link. Viewport units sidestep the containing
   block; scoped to .menu-open so only the open mobile sheet is affected.
   --------------------------------------------------------------------------- */
body.menu-open .nav-links,
html body.menu-open .nav-links {
  top: 68px !important;
  bottom: auto !important;
  height: calc(100dvh - 68px) !important;
  max-height: calc(100dvh - 68px) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
}
@supports not (height: 100dvh) {
  body.menu-open .nav-links,
  html body.menu-open .nav-links {
    height: calc(100vh - 68px) !important;
    max-height: calc(100vh - 68px) !important;
  }
}

/* ---------------------------------------------------------------------------
   Mobile header + menu sheet.
   .nav-shell is a 3-column grid; on phones .nav-actions is hidden, so the
   hamburger was left sitting in column 2 right beside the logo. Flex with
   space-between puts it at the far end and mirrors correctly in RTL.
   --------------------------------------------------------------------------- */
@media (max-width: 1080px) {
  .nav-shell {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
  }
  .nav-shell > .menu-button { margin-inline-start: auto !important; order: 9 !important; }

  /* A real icon button instead of two hairlines. */
  .menu-button {
    width: 44px !important;
    height: 44px !important;
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    padding: 0 !important;
    border: 1px solid rgba(8,101,61,.20) !important;
    border-radius: 12px !important;
    background: rgba(255,255,255,.72) !important;
  }
  /* Bars are positioned absolutely so the open/close geometry is exact and does
     not depend on whatever gap or margins the base stylesheet applies. */
  .menu-button { position: relative !important; }
  .menu-button i {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 18px !important;
    height: 2px !important;
    margin: -1px 0 0 -9px !important;
    border-radius: 2px !important;
    background: #0d3b2a !important;
    transition: transform .22s ease, background-color .22s ease;
  }
  .menu-button i:first-child { transform: translateY(-4px); }
  .menu-button i:last-child  { transform: translateY(4px); }
  /* Open state morphs the two bars into a close (X) icon. */
  body.menu-open .menu-button { background: #0d3b2a !important; border-color: #0d3b2a !important; }
  body.menu-open .menu-button i { background: #fff !important; }
  body.menu-open .menu-button i:first-child { transform: rotate(45deg); }
  body.menu-open .menu-button i:last-child  { transform: rotate(-45deg); }

  /* Sheet: start at the top instead of vertically centring the links. */
  body.menu-open .nav-links {
    justify-content: flex-start !important;
    align-content: flex-start !important;
    gap: 2px !important;
    padding: 14px 20px 32px !important;
  }
}

/* The open sheet lives inside .site-header, which is its own stacking context
   (backdrop-filter). On RTL pages some hero content painted above it, so the
   menu was invisible even though it was laid out correctly. Raise the header
   while the menu is open. */
body.menu-open .site-header { z-index: 9999 !important; }
body.menu-open .nav-links { z-index: 1 !important; }

/* RTL pages set overflow:hidden on .site-header to guard against horizontal
   scroll. Combined with backdrop-filter (which makes the header the containing
   block for the fixed sheet) that CLIPS the menu to the 75px header box, so the
   Arabic menu opened but was invisible. Un-clip only while the menu is open. */
body.menu-open .site-header { overflow: visible !important; }

/* Decisive fix: while the menu is open, drop backdrop-filter on the header.
   That is what made the header the containing block for the fixed sheet AND
   let its overflow:hidden clip it. Without it the sheet resolves against the
   viewport and nothing can clip it. */
body.menu-open .site-header {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: visible !important;
  background: #f7faf7 !important;
}
body.menu-open .nav-links { z-index: 9999 !important; }