/* Shared by static marketing documents and app routes before either can paint. */
/* Fade into the destination canvas, including before the async shell stylesheet. */
html[data-funnel-theme=light]{--page-canvas:#efefea;color-scheme:light}
html[data-funnel-theme=dark]{--page-canvas:#121313;color-scheme:dark}
html[data-funnel-theme][data-vos-page]{--page-canvas:var(--cv-canvas)}
html[data-funnel-theme],html[data-funnel-theme] :is(body,#root,.v13-app){background:var(--page-canvas)}
@view-transition{navigation:auto}
:root{--page-out:180ms;--page-in:420ms;--page-ease:cubic-bezier(.2,.7,.2,1)}
html::view-transition-group(root){animation-duration:var(--page-in);animation-timing-function:var(--page-ease)}
html::view-transition-old(root){animation:converze-page-out var(--page-out) ease-in both;mix-blend-mode:normal}
html::view-transition-new(root){animation:converze-page-in var(--page-in) var(--page-ease) both;mix-blend-mode:normal}
/* Keep the outgoing snapshot visible while an async app page becomes ready. */
html[data-transition-pending]::view-transition-group(*),html[data-transition-pending]::view-transition-old(*),html[data-transition-pending]::view-transition-new(*){animation-play-state:paused!important}
@keyframes converze-page-out{from{opacity:1;filter:blur(0)}to{opacity:0;filter:blur(8px)}}
@keyframes converze-page-in{from{opacity:0;filter:blur(8px)}to{opacity:1;filter:blur(0)}}
/* Freeze navigation geometry. Only its existing light/dark colours crossfade. */
html:not([data-team-native=true]) :is(.header159,body>.topbar){view-transition-name:converze-navigation}
html::view-transition-group(converze-navigation){animation:none!important}
html::view-transition-old(converze-navigation){animation:converze-nav-out var(--page-in) ease both}
html::view-transition-new(converze-navigation){animation:converze-nav-in var(--page-in) ease both}
@keyframes converze-nav-out{to{opacity:0}}
@keyframes converze-nav-in{from{opacity:0}}
/* A native document transition owns arrival: do not run a second inner animation. */
html[data-cross-document] .v13-app>main,html[data-cross-document] .v13-app>footer{animation:none!important;filter:none!important;opacity:1!important;transform:none!important;pointer-events:auto}
/* Same-document routes use the same blur without moving the page vertically. */
html[data-route-transition=out] .v13-app>main,html[data-route-transition=out] .v13-app>footer{pointer-events:none;filter:blur(8px);opacity:0;transition:filter var(--route-out-duration,180ms) ease-in,opacity var(--route-out-duration,180ms) ease-in}
html:is([data-route-transition=enter],[data-route-transition=initial]) .v13-app>main{animation:converze-page-in var(--route-enter-duration,420ms) var(--page-ease) both}
html:is([data-route-transition=enter],[data-route-transition=initial]) .v13-app>footer{animation:converze-page-in var(--route-enter-duration,420ms) var(--page-ease) both}
/* Unsupported browsers retain a complete departure and static-page arrival. */
html[data-shell-leaving=true] body>main{animation:none!important;opacity:0;filter:blur(8px);transition:opacity var(--page-out) ease-in,filter var(--page-out) ease-in}
html[data-document-arriving] body>main{animation:converze-page-in var(--page-in) var(--page-ease) both}
@media(prefers-reduced-motion:reduce){
 @view-transition{navigation:none}
 html::view-transition-group(*),html::view-transition-old(*),html::view-transition-new(*){animation:none!important}
 html:is([data-shell-leaving],[data-document-arriving],[data-route-transition]) :is(body>main,.v13-app>main,.v13-app>footer){animation:none!important;transition:none!important;filter:none!important;opacity:1!important;transform:none!important;pointer-events:auto}
}
html[data-motion=off]::view-transition-group(*),html[data-motion=off]::view-transition-old(*),html[data-motion=off]::view-transition-new(*){animation:none!important}
html[data-motion=off] :is(body>main,.v13-app>main,.v13-app>footer){animation:none!important;transition:none!important;filter:none!important;opacity:1!important;transform:none!important;pointer-events:auto}

/* Use balanced, compositor-only crossfades instead of a blank blurred midpoint. */
@keyframes converze-snapshot-out{from{opacity:1}to{opacity:0}}
@keyframes converze-snapshot-in{from{opacity:0}to{opacity:1}}
html::view-transition-old(root){animation:converze-snapshot-out 260ms ease both;filter:none}
html::view-transition-new(root){animation:converze-snapshot-in 260ms ease both;filter:none}
html[data-route-snapshot-capable=true]:not([data-motion=off])[data-route-transition=out] .v13-app>main,
html[data-route-snapshot-capable=true]:not([data-motion=off])[data-route-transition=out] .v13-app>footer,
html[data-route-snapshot] .v13-app>main,html[data-route-snapshot] .v13-app>footer{animation:none!important;transition:none!important;filter:none!important;opacity:1!important;transform:none!important}
html[data-vos-page] .header159-end>.header159-motion{display:inline-flex}
/* The menu retains a labelled setting, with no isolated circular pause glyph. */
html[data-vos-page] .header159-panel .header159-motion{width:auto;gap:7px;padding-inline:12px;border-radius:12px}
html[data-vos-page] .header159-panel .header159-motion-label{display:inline}
.vos-motion-preference{display:block;width:max-content;min-height:44px;margin:20px 0 0;padding:0;background:none;border:0;color:inherit;font:inherit;font-size:12px;text-align:left;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.vos-motion-preference:focus-visible{outline:2px solid currentColor;outline-offset:5px;border-radius:4px}
.vos-motion-preference:disabled{cursor:default;text-decoration:none}
@media(prefers-reduced-motion:reduce){html::view-transition-old(root),html::view-transition-new(root){animation:none!important}}
html[data-motion=off]::view-transition-old(root),html[data-motion=off]::view-transition-new(root){animation:none!important}

html::view-transition-group(root){animation-duration:260ms}
html::view-transition-old(converze-navigation),html::view-transition-new(converze-navigation){animation-duration:260ms}
html[data-route-snapshot-capable=true][data-route-transition=enter] .v13-app>main,html[data-route-snapshot-capable=true][data-route-transition=enter] .v13-app>footer{animation:none!important;filter:none!important;opacity:1!important;transform:none!important}

/* V52 navigation follows the existing document and app transition lifecycle. */
html[data-funnel-theme] {
  --page-out: 110ms;
  --page-in: 280ms;
  --v52-nav-glass: color-mix(in srgb, var(--cv-panel, #fafaf7) 88%, transparent);
  --v52-nav-highlight: color-mix(in srgb, var(--cv-ink, #262725) 9%, transparent);
  --v52-nav-press: color-mix(in srgb, var(--cv-ink, #262725) 15%, transparent);
}

html[data-funnel-theme=dark] {
  --v52-nav-glass: color-mix(in srgb, var(--cv-panel, #191c19) 88%, transparent);
  --v52-nav-highlight: color-mix(in srgb, var(--cv-ink, #eef1eb) 10%, transparent);
  --v52-nav-press: color-mix(in srgb, var(--cv-ink, #eef1eb) 16%, transparent);
}

html[data-funnel-theme] :is(body.theme-concierge > .topbar, .v13-app .header159, body[data-editorial] > header.nav) {
  background: var(--v52-nav-glass) !important;
  box-shadow: inset 0 1px color-mix(in srgb, white 12%, transparent), 0 12px 36px var(--cv-shadow, #00000016) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.25);
  backdrop-filter: blur(22px) saturate(1.25);
}

html[data-funnel-theme] :is(.topbar > nav, .header159-desktop, body[data-editorial] > header.nav > nav) {
  gap: clamp(2px, .6vw, 10px);
}

html[data-funnel-theme] :is(.topbar > nav, .header159-desktop, body[data-editorial] > header.nav > nav) > a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 clamp(8px, 1vw, 15px);
  border-radius: 999px;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color 180ms var(--page-ease), transform 150ms var(--page-ease);
}

html[data-funnel-theme] :is(.topbar > nav, .header159-desktop, body[data-editorial] > header.nav > nav) > a:is(:focus-visible,[aria-current=page]) {
  background-color: var(--v52-nav-highlight);
}

@media (hover: hover) and (pointer: fine) {
  html[data-funnel-theme] :is(.topbar > nav, .header159-desktop, body[data-editorial] > header.nav > nav) > a:hover {
    background-color: var(--v52-nav-highlight);
  }
}

html[data-funnel-theme] :is(.topbar > nav, .header159-desktop, body[data-editorial] > header.nav > nav) > a:active {
  background-color: var(--v52-nav-press);
  transform: scale(.965);
}

html[data-funnel-theme] :is(.topbar .top-actions > .pill, .header159-end > .header159-start, body[data-editorial] > header.nav > .button) {
  transition: filter 170ms var(--page-ease), transform 170ms var(--page-ease);
}

html[data-funnel-theme] :is(.topbar .top-actions > .pill, .header159-end > .header159-start, body[data-editorial] > header.nav > .button):active {
  transform: scale(.975);
}

html[data-funnel-theme] body[data-editorial] > header.nav {
  min-height: 66px;
  padding: 9px 12px 9px 24px;
}

@media (min-width: 801px) {
  html[data-funnel-theme] body[data-editorial] > header.nav > nav {
    margin-inline-start: auto;
  }
}

@media (max-width: 800px) {
  html[data-funnel-theme] body[data-editorial] > header.nav {
    gap: 6px 10px;
    padding: 8px 10px 6px 16px;
  }
  html[data-funnel-theme] body[data-editorial] > header.nav > nav {
    flex-basis: 100%;
    order: 3;
    justify-content: space-between;
    flex-wrap: nowrap;
    border: 0;
    padding: 0;
  }
  html[data-funnel-theme] body[data-editorial] > header.nav > nav > a {
    font-size: clamp(10px, 3.1vw, 13px);
    padding-inline: clamp(4px, 1.25vw, 10px);
  }
}

/* Scope the obsolete control to Semmy's large homepage portrait. */
body.theme-concierge .hero .touch-play {
  display: none !important;
}

body.theme-concierge > .help-dock .dock-guide {
  padding-inline-start: 12px;
}
body.theme-concierge > .help-dock .dock-guide > .dock-icon + span {
  margin-inline-start: 4px;
}

/* A small header response accompanies the existing document transition. */
html::view-transition-old(converze-navigation) {
  animation: v52-nav-out var(--page-out) ease-in both;
}
html::view-transition-new(converze-navigation) {
  animation: v52-nav-in var(--page-in) var(--page-ease) both;
}
@keyframes v52-nav-out {
  to { opacity: 0; transform: translateY(-2px) scale(.994); }
}
@keyframes v52-nav-in {
  from { opacity: 0; transform: translateY(3px) scale(.994); }
  to { opacity: 1; transform: none; }
}
@keyframes converze-page-out {
  from { opacity: 1; filter: blur(0); }
  to { opacity: 0; filter: blur(3px); }
}
@keyframes converze-page-in {
  from { opacity: 0; filter: blur(3px); }
  to { opacity: 1; filter: blur(0); }
}

@media (prefers-reduced-motion: reduce) {
  html[data-funnel-theme] :is(.topbar, .header159, body[data-editorial] > header.nav) :is(a,button) {
    transition: none !important;
    transform: none !important;
  }
}
html[data-motion=off] :is(.topbar, .header159, body[data-editorial] > header.nav) :is(a,button) {
  transition: none !important;
  transform: none !important;
}

/* V53: retain the approved sage dark palette, including on image overlays. */
html[data-funnel-theme=dark]{
 --v53-overlay:linear-gradient(135deg,#242a24ef,#171c18f5);
 --v53-overlay-ink:#eef1e9;
 --v53-overlay-muted:#bcc5b8;
 --v53-overlay-line:#d8e6d224;
 --v53-pill:#1d241f;
 --v53-pill-selected:#334237;
}
/* Shared company, marketing and vTeam photo captions. */
html[data-funnel-theme=dark] body :is(.cv-photo-label,.cv-scene-note,.cv-recording-tag,.welcome-caption,.portrait-caption,.portrait-category,.voice-control,.movement-control,.discovery-category,.co-expand-label,.vp-human-check){
 background:var(--v53-overlay)!important;
 color:var(--v53-overlay-ink)!important;
 border:1px solid var(--v53-overlay-line);
 box-shadow:inset 0 1px #ffffff06,0 8px 28px #00000026!important;
 -webkit-backdrop-filter:blur(16px);
 backdrop-filter:blur(16px);
}
html[data-funnel-theme=dark] body :is(.cv-photo-label,.welcome-caption,.portrait-caption) :is(strong,b,h2,h3,svg){color:var(--v53-overlay-ink)!important}
html[data-funnel-theme=dark] body :is(.cv-photo-label,.welcome-caption,.portrait-caption) :is(small,p){color:var(--v53-overlay-muted)!important}
html[data-funnel-theme=dark] body :is(.welcome-caption,.portrait-caption) .circle-button{
 background:#ffffff05!important;color:var(--v53-overlay-ink)!important;border-color:#d8e6d238!important;
}
html[data-funnel-theme=dark] body :is(.cv-photo-label,.voice-control,.movement-control,.co-expand-label):is(:hover,:focus-visible){
 background:linear-gradient(135deg,#303a31f5,#222b24fa)!important;border-color:#d8e6d250;
}
/* Image wrappers retain a dark fallback while the existing pictures load. */
html[data-funnel-theme=dark] body :is(.portrait,.work-card-frame){background-color:#171c18!important}
/* Secondary pills and tabs keep a visible selected state without a pale fill. */
html[data-funnel-theme=dark] body :is(.scenario-tabs,.p13-segments,.agent-sample-tabs,.detail15-tabs,.services-lenses,.client-demo-tabs,.rl-tabs,.cv-work-tabs,.tabs.case-tabs,.tabs.stage-tabs) button{
 background:var(--v53-pill)!important;color:var(--v53-overlay-muted)!important;border-color:var(--v53-overlay-line)!important;
}
html[data-funnel-theme=dark] body :is(.scenario-tabs,.p13-segments,.agent-sample-tabs,.detail15-tabs,.services-lenses,.client-demo-tabs,.rl-tabs,.cv-work-tabs,.tabs.case-tabs,.tabs.stage-tabs) button:is([aria-pressed=true],[aria-selected=true],.active,.is-active){
 background:var(--v53-pill-selected)!important;color:#f2f5ee!important;border-color:#b4c9b35c!important;box-shadow:inset 0 1px #ffffff0b;
}
html[data-funnel-theme=dark] body :is(.scenario-tabs,.p13-segments,.agent-sample-tabs,.detail15-tabs,.services-lenses,.client-demo-tabs,.rl-tabs,.cv-work-tabs,.tabs.case-tabs,.tabs.stage-tabs) button:is(:hover,:focus-visible){
 background:#2a352d!important;color:#f2f5ee!important;border-color:#b4c9b35c!important;
}
/* The original Allegory silver wave is restrained behind the example, not its copy. */
html[data-funnel-theme=dark] body.theme-concierge .work-section{background:linear-gradient(155deg,#161c17,#101512)!important}
html[data-funnel-theme=dark] body.theme-concierge .demo.section-demo{
 isolation:isolate;background:linear-gradient(130deg,#1b221ddd,#111714f5)!important;
 border-color:#cfdfca2c!important;box-shadow:inset 0 1px #ffffff08,0 24px 64px #00000030!important;
}
html[data-funnel-theme=dark] body.theme-concierge .demo.section-demo::before{
 content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:url('/release-v76-20261104/assets/v53/allegory-empty.jpg') 65% 65%/cover no-repeat;
 opacity:.065;filter:saturate(.55);border-radius:inherit;
}
html[data-funnel-theme=dark] body.theme-concierge .demo .scenario-tabs button{
 background:#1d2620!important;color:#c1cbbd!important;border-color:#d7e3cf28!important;
}
html[data-funnel-theme=dark] body.theme-concierge .demo .scenario-tabs button[aria-pressed=true]{
 background:#334237!important;color:#f1f5ed!important;border-color:#c5d7be66!important;
}
html[data-funnel-theme=dark] body.theme-concierge .demo .stage-tabs{background:transparent!important}
html[data-funnel-theme=dark] body.theme-concierge .demo .stage-tabs .active-stage{
 background:#334237!important;border:1px solid #c5d7be38!important;box-shadow:inset 0 1px #ffffff0a;
}
html[data-funnel-theme=dark] body.theme-concierge .demo .stage-tabs button{background:transparent!important;color:#bbc6b7!important}
html[data-funnel-theme=dark] body.theme-concierge .demo .stage-tabs button[aria-pressed=true]{color:#f0f4ea!important}
html[data-funnel-theme=dark] body.theme-concierge .demo .scenario-tabs button:is(:hover,:focus-visible){background:#2a372e!important;color:#f0f4ea!important}
html[data-funnel-theme=dark] body :is(.cv-photo-label,.cv-scene-note,.cv-recording-tag,.welcome-caption,.portrait-caption,.voice-control,.movement-control):focus-visible{
 outline:2px solid #cfdfc3;outline-offset:4px;
}
@media(forced-colors:active){
 html[data-funnel-theme=dark] body :is(.cv-photo-label,.cv-scene-note,.cv-recording-tag,.welcome-caption,.portrait-caption,.portrait-category,.voice-control,.movement-control,.discovery-category,.vp-human-check){background:Canvas!important;color:CanvasText!important;border-color:CanvasText!important;box-shadow:none!important}
 html[data-funnel-theme=dark] body.theme-concierge .demo.section-demo::before{display:none}
}

/* Keep the vTeam subnav, hero and section content on the existing section rail. */
html[data-funnel-theme] body.theme-concierge:has(.welcome-nav) {
  --vteam-content-inset: max(30px, calc((100% - 1220px) / 2));
  --vteam-section-gap: clamp(58px, 7vw, 96px);
}

html[data-funnel-theme] body.theme-concierge:has(.welcome-nav) .welcome-nav {
  inset-inline: var(--vteam-content-inset);
}

html[data-funnel-theme] body.theme-concierge:has(.welcome-nav) .welcome-hero {
  min-height: 0;
  padding-inline: var(--vteam-content-inset);
  padding-block-end: var(--vteam-section-gap);
}

html[data-funnel-theme] body.theme-concierge:has(.welcome-nav) .welcome-hero:has(+ .agents-section) {
  padding-block-end: calc(var(--vteam-section-gap) - 24px);
}

html[data-funnel-theme] body.theme-concierge:has(.welcome-nav) .welcome-hero + .agents-section {
  padding-block-start: 24px;
}

@media (min-width: 801px) {
  html[data-funnel-theme] body.theme-concierge:has(.welcome-nav) .welcome-hero {
    align-items: start;
    padding-block-start: 178px;
  }

  html[data-funnel-theme] body.theme-concierge:has(.welcome-nav) .welcome-copy {
    padding-block-start: 0;
  }

  html[data-funnel-theme] body.theme-concierge:has(.welcome-nav) .welcome-portrait {
    margin-block-start: 0;
  }
}

@media (max-width: 900px) {
  html[data-funnel-theme] body.theme-concierge:has(.welcome-nav) {
    --vteam-content-inset: 24px;
  }
}

@media (max-width: 650px) {
  html[data-funnel-theme] body.theme-concierge:has(.welcome-nav) {
    --vteam-content-inset: 20px;
  }
}

/* Match the homepage hero to the adjacent work and team sections at laptop widths. */
@media (801px <= width <= 1100px) {
  html[data-funnel-theme] body.theme-concierge .hero.hero-concierge {
    padding-inline: 6.5%;
  }
}

/* Follow the Services catalogue rail on the overview and shared detail template. */
@media (min-width: 761px) {
  html[data-funnel-theme] main.solutions15.services-upgrade > :is(.intro15, .detail15-work, .services-roles) {
    padding-inline: 7vw;
  }

  html[data-funnel-theme] main.solutions15.services-upgrade > :is(.solutions15-example, .detail15-inputs) {
    padding-inline: calc(7vw + max(0px, (100vw - 1540px) / 2));
  }
}

@media (max-width: 760px) {
  html[data-funnel-theme] main.solutions15.services-upgrade > :is(.solutions15-catalog, .solutions15-example) {
    padding-inline: 24px;
  }
}

/* Pulse Aurora colors from studio-src/components/studio/your-turn.css. */
@property --semmy-aura-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

.hero .portrait-caption-action::after {
  content: "";
  position: absolute;
  inset: 0;
  padding: 1.5px;
  border-radius: inherit;
  pointer-events: none;
  background: conic-gradient(from var(--semmy-aura-angle),
    #8ee6ff00 0deg 175deg, #8ee6ff95 220deg,
    #ab8aff 260deg, #f7a0d7 295deg, #8ee6ff9c 322deg, #8ee6ff00 360deg);
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  opacity: .78;
  animation: semmy-aura-orbit 5s linear infinite;
  transition: opacity 180ms ease;
}

@keyframes semmy-aura-orbit {
  to { --semmy-aura-angle: 360deg; }
}

html[data-funnel-theme] body.theme-concierge .hero .portrait-caption-action:is(:hover,:focus-visible) {
  box-shadow: 0 0 4px #8ee6ff80, 0 0 17px #ab8aff52, 0 0 25px #f7a0d729,
    0 12px 28px #0004 !important;
}

.hero .portrait-caption-action:is(:hover,:focus-visible)::after {
  opacity: 1;
  filter: brightness(1.27);
}

.hero .portrait-caption-action .circle-button {
  transition: transform 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
}

.hero .portrait-caption-action:is(:hover,:focus-visible) .circle-button {
  transform: translateX(2px);
  background: #ab8aff28 !important;
  box-shadow: inset 0 0 0 1px #ab8aff62, 0 0 12px #ab8aff42;
}

.hero .portrait-caption-action:active .circle-button {
  transform: translateX(2px) scale(.92);
}

html[data-motion=off] .hero .portrait-caption-action::after {
  animation: none;
  transition: none;
}

html[data-motion=off] .hero .portrait-caption-action .circle-button {
  transform: none;
  transition: none;
}

@media (prefers-reduced-motion: reduce) {
  .hero .portrait-caption-action::after {
    animation: none;
    transition: none;
  }
  .hero .portrait-caption-action .circle-button {
    transform: none;
    transition: none;
  }
}

@media (forced-colors: active) {
  .hero .portrait-caption-action::after { display: none; }
}

/* Size the SVG artwork inside the existing home link and navigation geometry. */
html body header:is(.topbar, .header159) > a:is(.brand, .header159-brand)[data-converze-wordmark]::before {
  inset-inline-end: auto;
  inline-size: calc((100% - 8.875px) * 0.9);
}

html body header.oi7-header > a[data-converze-wordmark]::before {
  inset-inline-end: auto;
  inline-size: 90%;
}

html body header.nav > a.wordmark[href="/"] {
  mask-size: 90% auto;
  mask-position: left center;
}

/* The photographs explain the service; the caption remains selectable page text. */
.lp35-visual.lp35-service-photo > img {
  object-position: center;
  object-fit: cover;
  padding: 0;
  background: transparent;
}
.lp35-visual.lp35-service-photo figcaption {
  max-width: calc(100% - 32px);
  padding: 12px 16px;
  border-radius: 18px;
  background: #f7f8f0ed;
  color: #252d27;
  border: 1px solid #1d281f1c;
  backdrop-filter: blur(12px);
  line-height: 1.5;
}
html[data-funnel-theme=dark] .lp35-visual.lp35-service-photo figcaption {
  background: #1a231dec;
  color: #eef1e9;
  border-color: #d8e6d22b;
}
@media(max-width:760px){
  .lp35-visual.lp35-service-photo { aspect-ratio: 1; max-height: none; }
}