/*
  Science Spark Clean Layout System V57
  Purpose:
  - One width system for the whole website.
  - No transform scaling.
  - No fixed 375px frontend page.
  - Header, slider, services, ISO, and footer share the same frame.
*/

:root{
  --ss-frame-max:1440px;
  --ss-frame-gap-desktop:48px;
  --ss-frame-gap-tablet:32px;
  --ss-frame-gap-mobile:16px;
  --ss-frame-gap-tiny:8px;
  --ss-frame: min(var(--ss-frame-max), calc(100vw - var(--ss-frame-gap-desktop)));
}

html,
body{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:hidden!important;
  background:#fff;
}

/* Remove old scale wrappers if any remained from previous versions */
.ss-stage-scale-shell,
.ss-stage-full-site-shell{
  display:contents!important;
  width:auto!important;
  height:auto!important;
  max-width:none!important;
  overflow:visible!important;
}
.ss-stage-scale-shell > *,
.ss-stage-full-site-shell > *{
  transform:none!important;
  width:auto;
  max-width:100%;
}

/* Universal frontend frame */
.ss-site-frame,
.site-header .header-inner,
.sp-homepage > .sp-section,
.sp-homepage > .sp-impact-wrap,
.sp-homepage > .sp-iso-showcase,
footer.footer > .container,
.footer > .container{
  width:var(--ss-frame)!important;
  max-width:var(--ss-frame-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

/* Header must use the same frame, but header background can stay full-width */
.site-header{
  width:100%!important;
  max-width:100%!important;
  transform:none!important;
}
.site-header .container,
.site-header .container-fluid{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding-left:0!important;
  padding-right:0!important;
}
.site-header .header-inner{
  padding-left:0!important;
  padding-right:0!important;
}

/* Homepage sections use the same frame as slider */
.sp-homepage,
main.sp-homepage{
  width:100%!important;
  max-width:100%!important;
}
.sp-homepage > .sp-section,
.sp-homepage > .sp-impact-wrap,
.sp-homepage > .sp-iso-showcase{
  padding-left:0!important;
  padding-right:0!important;
}
.sp-homepage > .sp-section{
  padding-top:92px!important;
  padding-bottom:92px!important;
}
.sp-homepage > .sp-impact-wrap{
  padding-top:0!important;
  padding-bottom:92px!important;
}
.sp-homepage > .sp-iso-showcase{
  padding-top:42px!important;
  padding-bottom:108px!important;
}

/* Inner components should fill section frame, never exceed it */
.sp-service-editorial,
.sp-impact-gallery,
.sp-iso-horizontal,
.sp-iso-tabs,
.sp-iso-stage,
.sp-center-heading{
  max-width:100%!important;
}
.sp-center-heading{
  width:min(860px,100%)!important;
}

/* Visual slider = exact same frame as sections */
.ssv-slider.ss-home-visual-slider{
  width:var(--ss-frame)!important;
  max-width:var(--ss-frame-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  transform:none!important;
  transform-origin:center center!important;
  box-sizing:border-box!important;
  height:760px!important;
  min-height:560px!important;
  max-height:760px!important;
  border-radius:0!important;
}

/* Bootstrap containers inside these areas should not add another width system */
.sp-homepage .container,
.sp-homepage .container-fluid,
.ssv-slider .container,
.ssv-slider .container-fluid{
  max-width:100%!important;
}

/* Tablet */
@media(max-width:1100px){
  :root{
    --ss-frame:calc(100vw - var(--ss-frame-gap-tablet));
  }

  .ss-site-frame,
  .site-header .header-inner,
  .sp-homepage > .sp-section,
  .sp-homepage > .sp-impact-wrap,
  .sp-homepage > .sp-iso-showcase,
  .ssv-slider.ss-home-visual-slider,
  footer.footer > .container,
  .footer > .container{
    width:var(--ss-frame)!important;
    max-width:none!important;
  }

  .ssv-slider.ss-home-visual-slider{
    height:680px!important;
    min-height:620px!important;
    max-height:none!important;
  }

  .sp-homepage > .sp-section{
    padding-top:72px!important;
    padding-bottom:72px!important;
  }
  .sp-homepage > .sp-impact-wrap{
    padding-bottom:72px!important;
  }
  .sp-homepage > .sp-iso-showcase{
    padding-top:34px!important;
    padding-bottom:82px!important;
  }
}

/* Mobile */
@media(max-width:700px){
  :root{
    --ss-frame:calc(100vw - var(--ss-frame-gap-mobile));
  }

  .site-header .header-inner,
  .sp-homepage > .sp-section,
  .sp-homepage > .sp-impact-wrap,
  .sp-homepage > .sp-iso-showcase,
  .ssv-slider.ss-home-visual-slider,
  footer.footer > .container,
  .footer > .container{
    width:var(--ss-frame)!important;
    max-width:none!important;
  }

  .site-header .header-inner{
    padding-left:0!important;
    padding-right:0!important;
  }

  .ssv-slider.ss-home-visual-slider{
    height:760px!important;
    min-height:720px!important;
    max-height:none!important;
  }

  .sp-homepage > .sp-section{
    padding-top:56px!important;
    padding-bottom:56px!important;
  }
  .sp-homepage > .sp-impact-wrap{
    padding-bottom:56px!important;
  }
  .sp-homepage > .sp-iso-showcase{
    padding-top:26px!important;
    padding-bottom:64px!important;
  }
}

/* Ultra small phones, e.g. 300px */
@media(max-width:340px){
  :root{
    --ss-frame:calc(100vw - var(--ss-frame-gap-tiny));
  }

  .site-header .header-inner,
  .sp-homepage > .sp-section,
  .sp-homepage > .sp-impact-wrap,
  .sp-homepage > .sp-iso-showcase,
  .ssv-slider.ss-home-visual-slider,
  footer.footer > .container,
  .footer > .container{
    width:var(--ss-frame)!important;
  }

  .ssv-slider.ss-home-visual-slider{
    height:735px!important;
    min-height:700px!important;
  }

  .mobile-header{
    gap:4px!important;
  }
  .mobile-btns{
    gap:4px!important;
  }
  .mobile-btns .btn-spark,
  .mobile-btns a{
    min-width:auto!important;
    padding:8px 9px!important;
    font-size:11px!important;
  }
  .mobile-menu-toggle,
  .navbar-toggler{
    width:42px!important;
    min-width:42px!important;
    height:42px!important;
  }
}


/* V58 professional ISO section */

.sp-iso-showcase-head{
  max-width:900px!important;
  margin:0 auto 38px!important;
  text-align:center!important;
}
.sp-iso-horizontal{
  border:1px solid rgba(139,167,199,.26)!important;
  background:rgba(255,255,255,.84)!important;
  box-shadow:0 24px 70px rgba(12,47,98,.08)!important;
  border-radius:24px!important;
  overflow:hidden!important;
  backdrop-filter:blur(12px);
}
.sp-iso-tabs{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:0!important;
  background:linear-gradient(180deg,#ffffff,#f8fbff)!important;
  border-bottom:1px solid rgba(139,167,199,.24)!important;
}
.sp-iso-tab{
  min-height:82px!important;
  padding:18px 16px!important;
  border:0!important;
  border-right:1px solid rgba(139,167,199,.20)!important;
  background:transparent!important;
  text-align:center!important;
  align-items:center!important;
  justify-content:center!important;
  transition:background .25s ease, transform .25s ease, box-shadow .25s ease!important;
}
.sp-iso-tab:last-child{border-right:0!important}
.sp-iso-tab:before{
  height:3px!important;
  top:auto!important;
  bottom:0!important;
  left:18px!important;
  right:18px!important;
  width:auto!important;
  border-radius:999px!important;
  background:transparent!important;
}
.sp-iso-tab strong{
  color:#082b5f!important;
  font-size:13px!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
  line-height:1.25!important;
}
.sp-iso-tab span{
  color:#6d7f95!important;
  font-size:12px!important;
}
.sp-iso-tab:hover{
  background:#f2f7ff!important;
  transform:translateY(-1px);
}
.sp-iso-tab.is-active{
  background:linear-gradient(180deg,#eef6ff,#ffffff)!important;
  box-shadow:inset 0 0 0 1px rgba(11,99,216,.08)!important;
}
.sp-iso-tab.is-active:before{background:#0b63d8!important}
.sp-iso-tab.is-active strong{color:#0b63d8!important}
.sp-iso-stage{
  padding:34px!important;
  background:
    linear-gradient(135deg, rgba(11,99,216,.035), transparent 42%),
    #ffffff!important;
}
.sp-iso-panel-header{
  align-items:center!important;
  padding-bottom:22px!important;
  border-bottom:1px solid rgba(139,167,199,.22)!important;
}
.sp-iso-kicker{
  color:#0b63d8!important;
  letter-spacing:.18em!important;
  font-weight:900!important;
}
.sp-iso-cert-grid,
.sp-cert-grid{
  gap:18px!important;
}
.sp-iso-cert,
.sp-cert-card,
.sp-iso-file{
  border:1px solid rgba(139,167,199,.22)!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#ffffff,#f9fbff)!important;
  box-shadow:0 14px 36px rgba(12,47,98,.07)!important;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease!important;
}
.sp-iso-cert:hover,
.sp-cert-card:hover,
.sp-iso-file:hover{
  transform:translateY(-3px)!important;
  border-color:rgba(11,99,216,.35)!important;
  box-shadow:0 22px 48px rgba(12,47,98,.12)!important;
}
@media(max-width:1100px){
  .sp-iso-tabs{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .sp-iso-tab{border-bottom:1px solid rgba(139,167,199,.20)!important}
}
@media(max-width:700px){
  .sp-iso-horizontal{border-radius:18px!important}
  .sp-iso-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .sp-iso-tab{min-height:72px!important;padding:14px 10px!important}
  .sp-iso-stage{padding:20px!important}
  .sp-iso-panel-header{display:block!important}
}


/* V70 inner pages audit/fix: one hero, one width, white cards, blue brand only */
:root{
  --ss-inner-page-max:var(--ss-frame-max);
  --ss-inner-gap:36px;
}

body{
  background:#fff!important;
}

/* Same frame for all inner page headers and body content */
.ss-hero-wrap,
.ss-shell > .ss-inner,
.ss-shell .pageBody > .ss-inner,
.ss-consult2 .wrap,
.ss-contact .page-content > .container,
.ss-contact .page-content .pt-5 > .container,
.about-subnav-wrap > .container,
#mission-vision > .container,
#what-we-do > .container,
#who-we-serve > .container,
.ss-blog-grid,
.ss-blog-head,
.ss-article-content{
  width:calc(100% - var(--ss-inner-gap))!important;
  max-width:var(--ss-inner-page-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

.ss-hero-wrap{
  width:calc(100% - var(--ss-inner-gap))!important;
  max-width:var(--ss-inner-page-max)!important;
  margin-top:0!important;
  margin-bottom:18px!important;
  border-left:1px solid rgba(215,229,241,.55)!important;
  border-right:1px solid rgba(215,229,241,.55)!important;
}

/* Keep inner pages clean white, no side gradients */
.ss-shell,
.ss-consult2,
.ss-contact,
.ss-blog-page,
section.section,
.page-content,
.pageBody{
  background:#fff!important;
  background-image:none!important;
}

/* Hide old page-wide glow layers that make the sides look dirty */
.ss-shell > .bg,
.ss-consult2 > .bg,
.bg .glow,
.bg .dots,
.bg .wave{
  display:none!important;
}

/* About page: analysis-style hero + clean section pills */
.about-subnav-wrap{
  background:#fff!important;
  padding:0 0 16px!important;
}
.about-subnav{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  align-items:center!important;
  padding:0!important;
}
.about-subnav .btn-portal{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  padding:10px 14px!important;
  border-radius:999px!important;
  border:1px solid #d7e5f1!important;
  background:#fff!important;
  color:#1e293b!important;
  text-decoration:none!important;
  font-weight:700!important;
  line-height:1!important;
  box-shadow:none!important;
  transition:background .18s ease,border-color .18s ease,color .18s ease!important;
}
.about-subnav .btn-portal i{
  color:#3175b9!important;
}
.about-subnav .btn-portal:hover,
.about-subnav .btn-portal.active{
  background:#eef6fc!important;
  border-color:#3175b9!important;
  color:#0f2748!important;
  transform:none!important;
  box-shadow:none!important;
}

/* About cards: remove gold/orange gradients */
#mission-vision .block,
#what-we-do .block{
  background:#fff!important;
  box-shadow:none!important;
}
#mission-vision .block .inner,
#what-we-do .block .inner,
.serve-item{
  background:#fff!important;
  background-image:none!important;
  border:1px solid rgba(139,167,199,.26)!important;
  border-radius:16px!important;
  box-shadow:0 14px 34px rgba(12,47,98,.065)!important;
}
.serve-item:hover,
.serve-item:focus-visible{
  border-color:rgba(49,117,185,.38)!important;
  box-shadow:0 18px 42px rgba(12,47,98,.09)!important;
}
.serve-chip{
  background:#fff!important;
  background-image:none!important;
  color:#3175b9!important;
  border:1px solid #d7e5f1!important;
  box-shadow:0 10px 22px rgba(12,47,98,.07)!important;
}
.serve-copy strong::after{
  background:#3175b9!important;
}

/* Contact page: same white card style and same data width as hero */
.ss-contact .ss-wrap{
  margin-top:0!important;
}
.ss-contact .ss-left,
.ss-contact .ss-card{
  background:#fff!important;
  background-image:none!important;
  color:#14161a!important;
  border:1px solid rgba(139,167,199,.26)!important;
  border-radius:16px!important;
  box-shadow:0 14px 34px rgba(12,47,98,.065)!important;
  overflow:hidden!important;
}
.ss-contact .ss-left .text-white,
.ss-contact .ss-media h5,
.ss-contact .contact-list li,
.ss-contact .contact-list a,
.ss-contact .ss-media span,
.ss-contact .ss-media li,
.ss-contact .ss-media a{
  color:#14161a!important;
}
.ss-contact .contact-list li,
.ss-contact .contact-list a{
  font-weight:600!important;
}
.ss-contact .text-theme,
.ss-contact .ss-ic,
.ss-contact .ss-field label{
  color:#3175b9!important;
}
.ss-contact .ss-field .form-control,
.ss-contact .ss-field .form-select{
  border-color:#d7e5f1!important;
  background:#fff!important;
}
.ss-contact .ss-field .form-control:focus,
.ss-contact .ss-field .form-select:focus{
  border-color:#3175b9!important;
  box-shadow:0 0 0 4px rgba(49,117,185,.12)!important;
}
.ss-contact .btn-theme{
  background:#3175b9!important;
  border-color:#3175b9!important;
  color:#fff!important;
  border-radius:999px!important;
  box-shadow:0 12px 26px rgba(49,117,185,.16)!important;
}
.ss-contact .ss-map iframe{
  border:1px solid rgba(139,167,199,.26)!important;
  box-shadow:0 14px 34px rgba(12,47,98,.065)!important;
}
.ss-contact .ss-social{
  display:none!important;
}

/* Blog: body/cards match the same clean system */
.ss-blog-wrap{
  background:#fff!important;
  padding-top:34px!important;
}
.ss-blog-head{
  max-width:900px!important;
}
.ss-blog-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:24px!important;
}
.ss-blog-card{
  border:1px solid rgba(139,167,199,.26)!important;
  box-shadow:0 14px 34px rgba(12,47,98,.065)!important;
}
.ss-blog-backline{
  width:calc(100% - var(--ss-inner-gap));
  max-width:var(--ss-inner-page-max);
  margin:0 auto 18px;
}

@media(max-width:991px){
  .ss-blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:700px){
  :root{--ss-inner-gap:24px;}
  .about-subnav{gap:8px!important;}
  .about-subnav .btn-portal{width:100%;justify-content:center!important;}
  .ss-blog-grid{grid-template-columns:1fr!important;}
}


/* V91: make every public page use the same frame size as the index page */
:root{
  --ss-inner-page-max:var(--ss-frame-max);
}

/* Standard page frame = same as homepage slider/sections */
.ss-page-frame,
.ss-hero-wrap,
.ss-shell > .ss-inner,
.ss-shell .pageBody > .ss-inner,
.ss-shell .detail > .ss-inner,
.ss-consult2 .wrap,
.ss-contact .page-content > .container,
.ss-contact .page-content .pt-5 > .container,
.about-subnav-wrap > .container,
#mission-vision > .container,
#what-we-do > .container,
#who-we-serve > .container,
.page-hero > .container,
.section-hero > .container,
.services-page > .container,
.ss-section > .container,
.cards-wrap > .container,
.industries-grid-4,
.ss-blog-wrap,
.ss-blog-head,
.ss-blog-grid,
.ss-article-content,
main > .container,
main > .container-fluid,
section > .container,
section > .container-fluid{
  width:var(--ss-frame)!important;
  max-width:var(--ss-frame-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

/* Avoid double Bootstrap side padding inside the unified frame */
.ss-hero-wrap,
.ss-shell > .ss-inner,
.ss-shell .pageBody > .ss-inner,
.ss-shell .detail > .ss-inner,
.ss-consult2 .wrap,
.ss-contact .page-content > .container,
.about-subnav-wrap > .container,
#mission-vision > .container,
#what-we-do > .container,
#who-we-serve > .container,
.page-hero > .container,
.section-hero > .container,
.services-page > .container,
.ss-section > .container,
.cards-wrap > .container,
.industries-grid-4,
.ss-blog-wrap,
.ss-blog-head,
.ss-blog-grid,
.ss-article-content{
  padding-left:0!important;
  padding-right:0!important;
}

/* Hero uses same outside width as index; inner content still has clean spacing */
.ss-hero-wrap{
  width:var(--ss-frame)!important;
  max-width:var(--ss-frame-max)!important;
  border-left:0!important;
  border-right:0!important;
}

/* Same responsive frame rules as index */
@media(max-width:1100px){
  .ss-page-frame,
  .ss-hero-wrap,
  .ss-shell > .ss-inner,
  .ss-shell .pageBody > .ss-inner,
  .ss-shell .detail > .ss-inner,
  .ss-consult2 .wrap,
  .ss-contact .page-content > .container,
  .about-subnav-wrap > .container,
  #mission-vision > .container,
  #what-we-do > .container,
  #who-we-serve > .container,
  .page-hero > .container,
  .section-hero > .container,
  .services-page > .container,
  .ss-section > .container,
  .cards-wrap > .container,
  .industries-grid-4,
  .ss-blog-wrap,
  .ss-blog-head,
  .ss-blog-grid,
  .ss-article-content{
    width:var(--ss-frame)!important;
    max-width:none!important;
  }
}
