:root{
  --sasal-ui-viewport-width:100vw;
  --sasal-ui-viewport-half-width:50vw;
  --sasal-ui-viewport-height:100vh;
}

/* Full-bleed home sections use the usable layout viewport rather than `vw`,
 * which can include a non-overlay scrollbar. Physical properties come first
 * for engines that predate the logical-property aliases. */
.sasal-home-page{
  width:var(--sasal-ui-viewport-width)!important;
  margin-left:calc(50% - var(--sasal-ui-viewport-half-width))!important;
  margin-right:calc(50% - var(--sasal-ui-viewport-half-width))!important;
  margin-inline:calc(50% - var(--sasal-ui-viewport-half-width))!important;
}

/* The clarity hero deliberately returns to the container width on compact
 * screens; retain that existing mobile layout instead of forcing a breakout. */
@media (min-width:681px){
  .sasal-home-clarity{
    width:var(--sasal-ui-viewport-width)!important;
    margin-left:calc(50% - var(--sasal-ui-viewport-half-width))!important;
    margin-right:calc(50% - var(--sasal-ui-viewport-half-width))!important;
    margin-inline:calc(50% - var(--sasal-ui-viewport-half-width))!important;
  }
}

@media (max-width:680px){
  .sasal-home-clarity{
    width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
    margin-inline:0!important;
  }
}

.sasal-home-capabilities,
.sasal-home-cta-band,
.sasal-home-ecosystem,
.sasal-home-gmv,
.sasal-home-portfolio,
.sasal-home-investors,
.sasal-home-partners,
.sasal-home-testimonials,
.sasal-home-vision,
.sasal-home-quality{
  padding-left:22px!important;
  padding-right:22px!important;
  padding-left:max(22px,calc(var(--sasal-ui-viewport-half-width) - 548px))!important;
  padding-right:max(22px,calc(var(--sasal-ui-viewport-half-width) - 548px))!important;
  padding-inline:max(22px,calc(var(--sasal-ui-viewport-half-width) - 548px))!important;
}

.sasal-home-linkedin{
  padding-left:22px!important;
  padding-right:22px!important;
  padding-left:max(22px,calc(var(--sasal-ui-viewport-half-width) - 850px))!important;
  padding-right:max(22px,calc(var(--sasal-ui-viewport-half-width) - 850px))!important;
  padding-inline:max(22px,calc(var(--sasal-ui-viewport-half-width) - 850px))!important;
}

@media (min-width:901px){
  #sasal-home-page > .sasal-home-section,
  .sasal-home-capabilities,
  .sasal-home-cta-band,
  .sasal-home-ecosystem,
  .sasal-home-gmv,
  .sasal-home-portfolio,
  .sasal-home-investors,
  .sasal-home-partners,
  .sasal-home-testimonials,
  .sasal-home-vision,
  .sasal-home-linkedin{
    padding-left:24px!important;
    padding-right:24px!important;
    padding-left:max(24px,calc(var(--sasal-ui-viewport-half-width) - 640px))!important;
    padding-right:max(24px,calc(var(--sasal-ui-viewport-half-width) - 640px))!important;
    padding-inline:max(24px,calc(var(--sasal-ui-viewport-half-width) - 640px))!important;
  }

  .sasal-home-page .sasal-home-section::after{
    left:24px!important;
    right:24px!important;
    left:max(24px,calc(var(--sasal-ui-viewport-half-width) - 640px))!important;
    right:max(24px,calc(var(--sasal-ui-viewport-half-width) - 640px))!important;
    inset-inline:max(24px,calc(var(--sasal-ui-viewport-half-width) - 640px))!important;
  }
}

/* Older Chromium releases needed the prefixed mask property for the globe. */
.sasal-globe{
  -webkit-mask-image:radial-gradient(circle at 46% 46%,#000 0 66%,rgba(0,0,0,.88) 78%,rgba(0,0,0,0) 100%);
}

/* Make native horizontal rails intentionally compact in Chromium, including
 * Vivaldi releases that ignore the standard scrollbar-width declaration. */
.sasal-home-company-rail:not([data-sasal-slow-rail]),
.sasal-home-deal-rail,
.sasal-home-editorial-grid--carousel{
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;
  scrollbar-color:#9dbab5 transparent;
  scrollbar-width:thin;
}

.sasal-home-company-rail:not([data-sasal-slow-rail])::-webkit-scrollbar,
.sasal-home-deal-rail::-webkit-scrollbar,
.sasal-home-editorial-grid--carousel::-webkit-scrollbar{
  height:8px;
}

.sasal-home-company-rail:not([data-sasal-slow-rail])::-webkit-scrollbar-track,
.sasal-home-deal-rail::-webkit-scrollbar-track,
.sasal-home-editorial-grid--carousel::-webkit-scrollbar-track{
  background:transparent;
}

.sasal-home-company-rail:not([data-sasal-slow-rail])::-webkit-scrollbar-thumb,
.sasal-home-deal-rail::-webkit-scrollbar-thumb,
.sasal-home-editorial-grid--carousel::-webkit-scrollbar-thumb{
  border:2px solid transparent;
  border-radius:999px;
  background:#9dbab5;
  background-clip:padding-box;
}

/* Firefox and older Safari/WebKit versions that do not implement the legacy
 * WebKit line-clamp syntax still keep editorial cards to the intended rhythm. */
.sasal-home-company-card__summary{
  display:block;
  max-height:4.65em;
}

.sasal-home-editorial-card__summary{
  display:block;
  max-height:4.95em;
}

@supports (-webkit-line-clamp:3){
  .sasal-home-company-card__summary,
  .sasal-home-editorial-card__summary{
    display:-webkit-box;
    max-height:none;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;
  }
}

/* `dvh` is preferable where available, but the panels remain usable in older
 * engines that discard declarations containing it. */
.sasal-ai-workspace__panel{height:var(--sasal-ui-viewport-height);}
.sasal-ai-panel{height:calc(var(--sasal-ui-viewport-height) - var(--sasal-ai-panel-top,88px));}
.sasal-ai-inline-panel{height:calc(var(--sasal-ui-viewport-height) - var(--sasal-ai-inline-top));}

@media (min-width:992px){
  .sasal-ai-workspace__panel{height:calc(var(--sasal-ui-viewport-height) - var(--sasal-ai-header-offset))!important;}
}

@media (max-width:991px){
  .sasal-ai-shell.is-open .sasal-ai-trigger{bottom:calc(var(--sasal-ui-viewport-height) - var(--sasal-ai-panel-top,88px) + 10px);}
}

@media (max-width:600px){
  .sasal-ai-panel{height:calc(var(--sasal-ui-viewport-height) - 52px);}
  .sasal-ai-inline-panel{height:calc(var(--sasal-ui-viewport-height) - 48px);}
}

@supports not (height:100dvh){
  .sasal-home-clarity,
  .sasal-brand-hero{min-height:var(--sasal-ui-viewport-height);}
}

/* Graceful sizing for versions released before `aspect-ratio`. Current
 * Firefox and Safari take their normal, native paths; these only prevent an
 * empty globe or collapsed image frame in older engine releases. */
@supports not (aspect-ratio:1 / 1){
  .sasal-brand-mark::before{
    content:"";
    display:block;
    width:100%;
    padding-top:100%;
    grid-area:1 / 1;
  }

  .sasal-globe-shell{
    height:92%;
    grid-area:1 / 1;
  }

  .sasal-home-operator__face{height:78px;}

  .sasal-home-support-card__media,
  .sasal-home-editorial-card__media{
    position:relative;
    height:0;
    padding-top:56.25%;
  }

  .sasal-home-support-card__media video,
  .sasal-home-support-card__media iframe,
  .sasal-home-editorial-card__media img{
    position:absolute;
    inset:0;
  }
}

@supports (height:100dvh){
  .sasal-ai-workspace__panel{height:100dvh;}
  .sasal-ai-panel{height:calc(100dvh - var(--sasal-ai-panel-top,88px));}
  .sasal-ai-inline-panel{height:calc(100dvh - var(--sasal-ai-inline-top));}

  @media (min-width:992px){
    .sasal-ai-workspace__panel{height:calc(100dvh - var(--sasal-ai-header-offset))!important;}
  }

  @media (max-width:991px){
    .sasal-ai-shell.is-open .sasal-ai-trigger{bottom:calc(100dvh - var(--sasal-ai-panel-top,88px) + 10px);}
  }

  @media (max-width:600px){
    .sasal-ai-panel{height:calc(100dvh - 52px);}
    .sasal-ai-inline-panel{height:calc(100dvh - 48px);}
  }
}

/* Resolve sidebar spacing as part of CSS layout. The former JavaScript added
 * a class after DOMContentLoaded, visibly shifting the entire dashboard on a
 * cold load. Modern supported browsers evaluate :has() before first paint. */
@media (min-width:992px){
  .inner-dashboard.container-fluid.left-main:has(.row > .sidebar-wrapper .sidebar){
    padding-left:240px;
  }
}

@media (min-width:1200px){
  .inner-dashboard.container-fluid.left-main:has(.row > .sidebar-wrapper .sidebar){
    padding-left:290px;
  }
}
