.portfolio-service-intro-cue { display:none; }
/* The two service-page introductions collapse once after the first scroll. */
 html.service-intro-enabled .portfolio-service-intro-track { --service-intro-header:calc(48px + 4.2vw);--service-intro-height:calc(100svh - var(--service-intro-header));--service-intro-range:0px;position:relative;height:calc(var(--service-intro-height) + var(--service-intro-range));background:var(--service-intro-background,#38383b);overflow-anchor:none;padding-top:var(--service-intro-header); }
 html.service-intro-enabled .portfolio-service-intro-track .portfolio-service-intro-panel { position:sticky!important;top:var(--service-intro-header);height:var(--service-intro-height);min-height:0!important;display:block!important;padding:0!important;overflow:clip;background:var(--service-intro-background,#38383b)!important; }
 html.service-intro-enabled .portfolio-service-intro-panel > .section-border { clip-path:none!important; }
 html.service-intro-enabled .portfolio-service-intro-panel .section-background { background:var(--service-intro-background,#38383b)!important; }
 html.service-intro-enabled .portfolio-service-intro-panel > .content-wrapper { margin:0!important;position:relative;transform:translate(var(--service-intro-x,0px),var(--service-intro-y,0px))!important;will-change:transform; }
 html.service-intro-enabled body .portfolio-service-intro-track .portfolio-service-intro-panel h2,html.service-intro-enabled body .portfolio-service-intro-track .portfolio-service-intro-panel h2 span { color:var(--service-intro-heading,#fff)!important; }
 html.service-intro-enabled body .portfolio-service-intro-track .portfolio-service-intro-panel .portfolio-lead-copy { color:var(--service-intro-copy,#fff)!important; }
 html.service-intro-enabled .portfolio-service-intro-panel .migration-brush { translate:0 var(--service-intro-brush-offset,40px); }
/* Move the concept frame with its image so the lower stroke clears the image mask. */
 html.service-intro-enabled .portfolio-service-intro-panel .migration-brush[data-brush="concept"] { translate:none; }
 html.service-intro-enabled .portfolio-service-intro-panel .fe-block:has(.migration-brush[data-brush="concept"]) { translate:0 var(--service-intro-brush-offset,40px); }
/* Move the production artwork's whole frame so its mask keeps all three strokes. */
 html.service-intro-enabled .portfolio-service-intro-panel .migration-brush[data-brush="prod"] { translate:none; }
 html.service-intro-enabled .portfolio-service-intro-panel .fe-block:has(.migration-brush[data-brush="prod"]) { translate:0 var(--service-intro-prod-brush-offset,0px); }
/* Production copy must size its own stack instead of overflowing a saved 108px frame. */
 .portfolio-service-intro-panel:has([data-brush="prod"]) .stack-child-container { --child-fixed-height:auto!important;height:auto!important;min-height:0;min-width:0; }
 .portfolio-service-intro-panel:has([data-brush="prod"]) h2 { word-break:normal;overflow-wrap:normal;hyphens:none; }
@media(max-width:767px) {
 .portfolio-service-intro-panel:has([data-brush="prod"]) .fluid-engine { grid-template-rows:clamp(100px,22vw,150px) auto auto;row-gap:24px; }
 .portfolio-service-intro-panel:has([data-brush="prod"]) .fluid-engine > .fe-block:has(.sqs-stack-container) { grid-row:2; }
 .portfolio-service-intro-panel:has([data-brush="prod"]) .fluid-engine > .fe-block:has([data-brush="prod"]) { grid-row:1; }
 .portfolio-service-intro-panel:has([data-brush="prod"]) .fluid-engine > .fe-block:has(hr.portfolio-rule) { grid-row:3;padding-block:24px 12px; }
 .portfolio-service-intro-panel:has([data-brush="prod"]) .stack-child-container { width:100%; }
 .portfolio-service-intro-panel:has([data-brush="prod"]) h2 { font-size:clamp(30px,9vw,64px); }
}
 html.service-intro-enabled .portfolio-service-intro-panel hr.portfolio-rule { clip-path:inset(0 100% 0 0);transition:clip-path 420ms cubic-bezier(.2,.7,.2,1); }
 html.service-intro-enabled .portfolio-service-intro-track.is-inverted .portfolio-service-intro-panel hr.portfolio-rule { clip-path:inset(0); }
 html.service-intro-enabled .portfolio-service-intro-cue { position:absolute;z-index:5;bottom:18px;left:calc(50% - 24px);display:grid;place-items:center;width:48px;height:48px;border:0;background:none;color:#fff;cursor:pointer;transition:opacity 160ms ease; }
 html.service-intro-enabled .portfolio-service-intro-cue svg { width:24px;height:15px;fill:none;stroke:currentColor;stroke-width:2.25;stroke-linecap:square;stroke-linejoin:miter; }
 html.service-intro-enabled .portfolio-service-intro-cue.is-idle svg { animation:portfolio-service-intro-bob 1400ms ease-in-out infinite; }
 html.service-intro-enabled .portfolio-service-intro-cue:focus-visible { outline:2px solid currentColor;outline-offset:3px; }
 html.service-intro-enabled .portfolio-service-intro-cue.is-dismissed { opacity:0;pointer-events:none; }
@keyframes portfolio-service-intro-bob { 0%,100%{transform:translateY(0)}50%{transform:translateY(7px)} }
 html.service-intro-enabled:has(.portfolio-service-intro-track) { overflow-anchor:none; }
 html.service-intro-enabled body:has(.portfolio-service-intro-track) #header .header-inner { height:48px; }
@media only screen and (pointer:coarse) and (max-width:1024px),screen and (max-width:799px) {
 html.service-intro-enabled .portfolio-service-intro-track { --service-intro-header:calc(44px + 12vw); }
 html.service-intro-enabled body:has(.portfolio-service-intro-track) #header .header-inner { height:44px; }
}
@media(prefers-reduced-motion:reduce) {
 html.service-intro-enabled .portfolio-service-intro-track { height:auto!important;background:#fff;padding-top:var(--service-intro-header); }
 html.service-intro-enabled .portfolio-service-intro-track .portfolio-service-intro-panel { position:relative!important;top:0!important;height:auto!important;background:#fff!important;--service-intro-background:#fff;--service-intro-heading:#38383b;--service-intro-copy:#555558; }
 html.service-intro-enabled .portfolio-service-intro-panel > .content-wrapper { transform:none!important; }
 html.service-intro-enabled .portfolio-service-intro-panel .migration-brush { translate:0 8px; }
 html.service-intro-enabled .portfolio-service-intro-panel .fe-block:has(.migration-brush[data-brush="concept"]),
 html.service-intro-enabled .portfolio-service-intro-panel .fe-block:has(.migration-brush[data-brush="prod"]) { translate:0 8px; }
 html.service-intro-enabled .portfolio-service-intro-panel hr.portfolio-rule { clip-path:none;transition:none; }
 html.service-intro-enabled .portfolio-service-intro-cue { display:none; }
}
