/* ==========================================================
   PREMIUM MOTION + ALIGNMENT QA — 09 SEP 2026
   Final override layer. Keeps layout geometry consistent across
   pages/browsers and adds lightweight premium motion without blur.
   ========================================================== */
:root{
  --pm-max:1320px;
  --pm-content:1040px;
  --pm-copy:760px;
  --pm-gutter:clamp(22px,4.8vw,76px);
  --pm-red:#d51f32;
  --pm-black:#080808;
  --pm-paper:#f8f6f1;
  --pm-line:rgba(8,8,8,.11);
  --pm-spring:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box}
html,body{max-width:100%;overflow-x:clip}
main,.content-page,.content-flow,section{min-width:0;max-width:100%}
img,svg,video{max-width:100%}

/* ---------- Cross-browser sharp motion ---------- */
.reveal,
.reveal.reveal-left,
.reveal.reveal-right,
.reveal.reveal-scale{
  filter:none!important;
  opacity:0;
  transform:translate3d(0,26px,0) scale(.992);
  transition:opacity .72s ease,transform .82s var(--pm-spring)!important;
}
.reveal.visible,.reveal.motion-in{opacity:1;transform:translate3d(0,0,0) scale(1)}

/* ---------- Global long-form geometry ---------- */
.story-section{
  width:100%!important;
  grid-template-columns:126px minmax(0,var(--pm-content))!important;
  justify-content:center!important;
  gap:clamp(34px,4.4vw,66px)!important;
  padding-left:var(--pm-gutter)!important;
  padding-right:var(--pm-gutter)!important;
  align-items:start!important;
}
.story-aside{width:126px!important;min-width:0!important;align-self:start!important}
.story-main{width:100%!important;max-width:var(--pm-content)!important;min-width:0!important;margin:0!important}
.story-main>h2{max-width:920px!important;margin-left:0!important;margin-right:0!important}
.story-body{width:100%!important;max-width:var(--pm-content)!important;min-width:0!important;margin-left:0!important;margin-right:0!important}
.story-body>p,.story-main>p{max-width:var(--pm-copy)!important}
.story-body>ul:not(.premium-list){max-width:var(--pm-copy)}
.story-body>*{min-width:0}
.story-actions{align-items:center}

/* ---------- Hero alignment ---------- */
@media(min-width:901px){
  .content-hero-copy{padding-left:var(--pm-gutter)!important;padding-right:clamp(28px,4vw,64px)!important}
  .content-hero-copy h1{max-width:900px!important}
  .content-hero-copy>p{max-width:var(--pm-copy)!important}
  .page-internal .content-hero-media{margin-right:var(--pm-gutter)!important}
}

/* ---------- Visual blocks use the full content column ---------- */
.sa-quick-grid,.sa-stagger-flow,.sa-tree-visual,.sa-touchpoint-grid,.sa-experience-grid,
.sa-check-grid,.sa-proof-grid,.impact-ribbon-track,.impact-case-bands,.impact-mini-grid,
.impact-overview-grid,.impact-client-panel,.steps-grid.premium-roadmap,
.premium-capability-tree,.premium-business-bands{width:100%!important;max-width:100%!important}

/* ---------- Impact ribbon: fix red block/text collision ---------- */
.impact-ribbon-track{display:grid!important;gap:16px!important;margin:24px 0 0!important}
.impact-ribbon-card,
.impact-ribbon-card:nth-child(odd),
.impact-ribbon-card:nth-child(even){
  position:relative!important;
  width:100%!important;
  min-height:126px!important;
  margin:0!important;
  padding:24px 30px 24px 180px!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid var(--pm-line)!important;
  box-shadow:0 16px 42px rgba(0,0,0,.045)!important;
}
.impact-ribbon-card::after{
  content:""!important;
  position:absolute!important;
  z-index:0!important;
  inset:0 auto 0 0!important;
  width:142px!important;
  background:linear-gradient(145deg,#d51f32,#d51f32)!important;
}
.impact-ribbon-card::before{
  z-index:2!important;
  left:42px!important;
  top:50%!important;
  width:58px!important;
  height:58px!important;
  transform:translateY(-50%)!important;
  background:#fff!important;
  color:#111!important;
  border:0!important;
  box-shadow:0 8px 22px rgba(0,0,0,.10)!important;
}
.impact-ribbon-card>*{position:relative;z-index:1}
.impact-ribbon-card b{margin:0 0 7px!important;color:var(--pm-red)!important;font-size:10px!important;letter-spacing:.14em!important}
.impact-ribbon-card h3{margin:0 0 7px!important;font-size:clamp(22px,2vw,32px)!important;line-height:1.08!important}
.impact-ribbon-card p{max-width:720px!important;margin:0!important;font-size:14px!important;line-height:1.6!important;color:rgba(8,8,8,.7)!important}

/* ---------- Impact case bands: same alignment discipline ---------- */
.impact-case-bands{display:grid!important;gap:12px!important;margin-top:20px!important}
.impact-band,
.impact-band:nth-child(2),
.impact-band:nth-child(3),
.impact-band--red,
.impact-band--cream{
  position:relative!important;
  width:100%!important;
  min-height:112px!important;
  margin:0!important;
  padding:20px 26px 20px 150px!important;
  overflow:hidden!important;
  border-radius:20px!important;
  background:#fff!important;
  border:1px solid var(--pm-line)!important;
  box-shadow:0 12px 32px rgba(0,0,0,.04)!important;
}
.impact-band::after{
  content:"";
  position:absolute;
  z-index:0;
  inset:0 auto 0 0;
  width:112px;
  background:#111;
}
.impact-band--red::after{background:var(--pm-red)}
.impact-band--cream::after{background:#e9e3d9}
.impact-band::before{
  z-index:2!important;
  left:33px!important;
  top:50%!important;
  width:46px!important;
  height:46px!important;
  transform:translateY(-50%)!important;
  background:#fff!important;
  color:#111!important;
}
.impact-band>*{position:relative;z-index:1}
.impact-band b{color:var(--pm-red)!important;margin:0 0 6px!important}
.impact-band h3{margin:0 0 7px!important}
.impact-band p{max-width:720px!important;margin:0!important}

/* ---------- Service Architect visual alignment ---------- */
.sa-stagger-flow{max-width:940px!important;margin:24px 0 0!important;padding:12px 76px!important}
.sa-stagger-flow::before{left:50%!important}
.sa-stagger-card{width:calc(50% - 34px)!important;min-height:148px!important;padding:22px 24px!important}
.sa-stagger-card:nth-child(odd){justify-self:start!important}
.sa-stagger-card:nth-child(even){justify-self:end!important}
.sa-stagger-card:nth-child(odd)::before{right:-34px!important;width:34px!important}
.sa-stagger-card:nth-child(even)::before{left:-34px!important;width:34px!important}
.sa-stagger-card:nth-child(odd)::after{right:-60px!important}
.sa-stagger-card:nth-child(even)::after{left:-60px!important}

.sa-tree-visual{max-width:940px!important;margin:26px 0 0!important;padding-inline:14px!important}
.sa-tree-grid{gap:18px 88px!important}
.sa-tree-card{min-height:122px!important;padding:21px 25px!important;border-radius:30px!important}
.sa-tree-card h3{margin-bottom:6px!important}
.sa-tree-card p{max-width:390px!important}

.sa-quick-grid{gap:14px!important;margin-top:24px!important}
.sa-quick-card,.sa-break-card,.sa-layer-card,.sa-touch-card,.sa-experience-card,
.impact-overview-card,.impact-story-card,.impact-mini-card,.sa-check-panel,.sa-quote-panel,.sa-proof-card{
  height:100%;
}

/* ---------- Homepage & other grids: consistent edges ---------- */
.home-lab-choice__head,.home-lab-choice__grid,.route-choice-head,.route-choice-grid,
.real-session-gallery-head,.real-session-masonry,.client-logos-head,.testimonials-head{
  max-width:var(--pm-max)!important;
}
.home-lab-choice__head,.home-lab-choice__grid{margin-left:auto!important;margin-right:auto!important}
.route-choice-head{margin-left:auto!important;margin-right:auto!important}
.route-choice-grid{margin-left:auto!important;margin-right:auto!important}

/* ---------- Footer ---------- */
footer{padding-left:var(--pm-gutter)!important;padding-right:var(--pm-gutter)!important;align-items:start!important}
footer .footer-brand img{max-width:min(310px,100%)!important;height:auto!important}

/* ==========================================================
   Premium motion v2 — lightweight on all capable devices
   ========================================================== */
.premium-motion-v2 .pm-reveal{
  opacity:0;
  transform:translate3d(0,24px,0);
  transition:opacity .68s ease,transform .78s var(--pm-spring),box-shadow .45s ease,border-color .45s ease;
  transition-delay:var(--pm-delay,0ms);
}
.premium-motion-v2 .pm-reveal.pm-from-left{transform:translate3d(-26px,10px,0)}
.premium-motion-v2 .pm-reveal.pm-from-right{transform:translate3d(26px,10px,0)}
.premium-motion-v2 .pm-reveal.pm-scale{transform:translate3d(0,18px,0) scale(.975)}
.premium-motion-v2 .pm-reveal.pm-in{opacity:1;transform:translate3d(0,0,0) scale(1)}

.premium-motion-v2 .story-main>h2.pm-reveal{
  transform:translate3d(0,30px,0);
  transition-duration:.82s;
}
.premium-motion-v2 .story-main>h2.pm-in{transform:none}

.premium-motion-v2 .pm-line-draw{position:relative}
.premium-motion-v2 .pm-line-draw::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-12px;
  width:min(130px,26%);
  height:2px;
  background:var(--pm-red);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .72s .16s var(--pm-spring);
}
.premium-motion-v2 .pm-line-draw.pm-in::after{transform:scaleX(1)}
.story-section--red .pm-line-draw::after{background:#fff!important}

/* Cards rise individually; no blur, no continuous GPU load. */
.premium-motion-v2 .pm-card{
  transition:transform .42s var(--pm-spring),box-shadow .42s ease,border-color .42s ease,background .42s ease!important;
}
@media(hover:hover) and (pointer:fine){
  .premium-motion-v2 .pm-card:hover{
    transform:translate3d(0,-5px,0)!important;
    box-shadow:0 20px 52px rgba(0,0,0,.085)!important;
    border-color:rgba(213,31,50,.28)!important;
  }
  .premium-motion-v2 .story-section--dark .pm-card:hover,
  .premium-motion-v2 .story-section--red .pm-card:hover{box-shadow:0 22px 58px rgba(0,0,0,.24)!important}
  .premium-motion-v2 .home-lab-choice__card:hover .home-lab-choice__photo{transform:scale(1.035)!important}
  .premium-motion-v2 .button:hover span:last-child,
  .premium-motion-v2 a:hover .arrow{transform:translateX(4px)}
}

/* Nav micro-interactions */
.desktop-nav>a,.nav-dropdown-trigger{position:relative}
.desktop-nav>a::after,.nav-dropdown-trigger::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-8px;
  height:1px;
  background:var(--pm-red);
  transform:scaleX(0);
  transform-origin:right center;
  transition:transform .34s var(--pm-spring);
}
.desktop-nav>a:hover::after,.desktop-nav>a.active::after,.desktop-nav>a[aria-current="page"]::after,
.nav-dropdown:hover .nav-dropdown-trigger::after,.nav-dropdown.active .nav-dropdown-trigger::after{
  transform:scaleX(1);transform-origin:left center;
}

/* Section aside number settles with the section, not continuously. */
.premium-motion-v2 .story-section.pm-section-in .story-aside>span{
  animation:pmNumberSettle .62s var(--pm-spring) both;
}
@keyframes pmNumberSettle{
  0%{opacity:.18;transform:translateY(18px) scale(.92)}
  70%{opacity:1;transform:translateY(-2px) scale(1.02)}
  100%{opacity:1;transform:none}
}

/* Subtle image entrance */
.premium-motion-v2 .pm-image-reveal{overflow:hidden}
.premium-motion-v2 .pm-image-reveal img{
  transform:scale(1.025);
  transition:transform 1.05s var(--pm-spring),opacity .72s ease!important;
  opacity:.86;
}
.premium-motion-v2 .pm-image-reveal.pm-in img{transform:scale(1);opacity:1}

/* ---------- Tablet / mobile ---------- */
@media(max-width:1100px) and (min-width:901px){
  .story-section{grid-template-columns:104px minmax(0,1fr)!important;justify-content:stretch!important;gap:34px!important}
  .story-aside{width:104px!important}
  .sa-stagger-flow{padding-inline:64px!important}
}
@media(max-width:900px){
  :root{--pm-gutter:22px}
  .story-section{grid-template-columns:minmax(0,1fr)!important;gap:22px!important;padding-left:var(--pm-gutter)!important;padding-right:var(--pm-gutter)!important}
  .story-aside{width:100%!important;display:flex!important;align-items:center!important;gap:12px!important;padding-top:0!important}
  .story-aside>span{margin:0!important;flex:none!important;font-size:44px!important}
  .story-aside .eyebrow{margin:0!important;max-width:none!important}
  .story-main,.story-body{max-width:100%!important}
  .story-main>h2{max-width:100%!important}
  .story-body>p,.story-main>p{max-width:100%!important}

  .impact-ribbon-card,.impact-ribbon-card:nth-child(odd),.impact-ribbon-card:nth-child(even){
    min-height:112px!important;padding:20px 20px 20px 118px!important;border-radius:20px!important
  }
  .impact-ribbon-card::after{width:92px!important}
  .impact-ribbon-card::before{left:24px!important;width:44px!important;height:44px!important;font-size:11px!important}
  .impact-ribbon-card h3{font-size:23px!important}

  .impact-band,.impact-band:nth-child(2),.impact-band:nth-child(3){padding:18px 18px 18px 106px!important;min-height:104px!important}
  .impact-band::after{width:82px!important}
  .impact-band::before{left:20px!important;width:40px!important;height:40px!important}

  .sa-stagger-flow{padding:8px 0 8px 62px!important}
  .sa-stagger-flow::before{left:20px!important;transform:none!important}
  .sa-stagger-card,.sa-stagger-card:nth-child(odd),.sa-stagger-card:nth-child(even){width:100%!important;justify-self:stretch!important;min-height:0!important}
  .sa-stagger-card::before{left:-42px!important;right:auto!important;width:42px!important}
  .sa-stagger-card::after{left:-62px!important;right:auto!important;width:42px!important;height:42px!important;font-size:10px!important}

  .sa-tree-visual{padding:0!important}
  .sa-tree-trunk{left:18px!important;transform:none!important;width:7px!important}
  .sa-tree-grid{grid-template-columns:1fr!important;gap:14px!important;padding-left:46px!important}
  .sa-tree-card{border-radius:22px!important;min-height:0!important}
  .sa-tree-card::before{left:-46px!important;right:auto!important;width:46px!important}

  .premium-motion-v2 .pm-reveal,
  .premium-motion-v2 .pm-reveal.pm-from-left,
  .premium-motion-v2 .pm-reveal.pm-from-right,
  .premium-motion-v2 .pm-reveal.pm-scale{
    transform:translate3d(0,16px,0) scale(.995);
    transition-duration:.5s,.58s;
  }
  .premium-motion-v2 .pm-reveal.pm-in{transform:none}
}
@media(max-width:600px){
  :root{--pm-gutter:18px}
  .story-section{padding-left:18px!important;padding-right:18px!important}
  .story-aside>span{font-size:40px!important}
  .impact-ribbon-card,.impact-ribbon-card:nth-child(odd),.impact-ribbon-card:nth-child(even){padding:18px 16px 18px 100px!important}
  .impact-ribbon-card::after{width:76px!important}
  .impact-ribbon-card::before{left:18px!important;width:40px!important;height:40px!important}
  .impact-ribbon-card b{font-size:9px!important}
  .impact-ribbon-card h3{font-size:21px!important}
  .impact-ribbon-card p{font-size:13px!important}
  .impact-band,.impact-band:nth-child(2),.impact-band:nth-child(3){padding-left:94px!important}
  .impact-band::after{width:70px!important}
  .impact-band::before{left:15px!important;width:38px!important;height:38px!important}
}

@media(prefers-reduced-motion:reduce){
  .premium-motion-v2 .pm-reveal,
  .premium-motion-v2 .pm-image-reveal img,
  .premium-motion-v2 .pm-card,
  .desktop-nav>a::after,.nav-dropdown-trigger::after{
    opacity:1!important;transform:none!important;transition:none!important;animation:none!important
  }
  .premium-motion-v2 .pm-line-draw::after{transform:scaleX(1)!important;transition:none!important}
  .premium-motion-v2 .story-section.pm-section-in .story-aside>span{animation:none!important}
}

/* Requested homepage strategy heading correction */
#strategist-consultancy-layer .story-main > h2{
  color:#080808 !important;
  -webkit-text-fill-color:#080808 !important;
}

/* Partners section — centered heading alignment */
.client-logos .client-logos-head{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  text-align:center!important;
}
.client-logos .client-logos-head h2{
  width:100%!important;
  max-width:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}