@font-face{font-family:'MVC Poppins';src:url('assets/poppins-medium.ttf') format('truetype');font-weight:500;font-style:normal;font-display:block}
/* Metro Vein Centers case study */
.mvc-page{color-scheme:light;--bg:#C4ECFF;--text:#12222b;--muted:#425966;--accent:#155c7c;--line:#12222b30;background:#C4ECFF}
.mvc-hero{padding-top:72px;padding-bottom:48px}.mvc-hero h2{font-weight:700;font-size:clamp(52px,6.8vw,100px);max-width:1100px;line-height:1.02;margin:24px 0 30px}.mvc-hero h2 em{font-family:inherit;font-style:normal;font-weight:inherit;color:inherit}.mvc-hero .case-deck{max-width:660px;font-size:19px;line-height:1.65}.mvc-placeholder{color:var(--muted)!important}
.mvc-cover .mvc-artwork{margin:0;border-radius:8px;overflow:hidden;background:transparent}.mvc-cover{max-width:1240px}.mvc-cover img{width:100%;height:auto}
.mvc-page .story .mvc-artwork{padding:0;background:transparent;border-radius:6px}.mvc-page .story .mvc-artwork img{width:100%;height:auto;max-height:none;border-radius:6px}.mvc-page .story .mvc-artwork figcaption{margin-top:14px}.mvc-page .story h2{font-weight:600}
.mvc-context{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:32px}.mvc-context-card{padding:32px;border:0;border-radius:var(--card-radius);background:#aedeF7;box-shadow:0 6px 20px #1944590b}.mvc-context-card>h3{font-size:24px;font-weight:700;letter-spacing:-.65px;line-height:1.2;margin:0 0 12px}.mvc-context-card>p{margin:0;max-width:390px;font-size:16px;line-height:1.6;color:var(--muted)}
.mvc-palette{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:32px}.mvc-palette>div{background:var(--swatch);color:#12222b;border-radius:6px;min-height:120px;padding:24px;display:flex;flex-direction:column;justify-content:flex-end}.mvc-palette span{font-size:16px;font-weight:600}.mvc-palette small{font-size:12px;letter-spacing:.06em;margin-top:4px}
.mvc-impact{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:32px}.mvc-impact>div{padding:32px;border:0;border-radius:var(--card-radius);background:#aedeF7;box-shadow:0 6px 20px #1944590b}.mvc-impact h3{font-size:24px;font-weight:700;line-height:1.2;letter-spacing:-.65px;margin:24px 0 12px}.mvc-impact>div>p:last-child{margin:0;font-size:16px;color:var(--muted);line-height:1.6}
@media(max-width:700px){.mvc-hero{padding-top:40px}.mvc-hero .case-deck{font-size:17px}.mvc-context,.mvc-impact{grid-template-columns:1fr;gap:16px}.mvc-palette{grid-template-columns:repeat(2,1fr)}.mvc-palette>div{padding:18px;min-height:110px}.mvc-impact>div{padding:24px}}

.mvc-logo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:36px}.mvc-logo-grid img{display:block;width:100%;height:auto;border-radius:6px}
@media(max-width:700px){.mvc-logo-grid{grid-template-columns:minmax(0,1fr);gap:16px}}

.mvc-page .case-deck,.mvc-page .story>p:not(.eyebrow){color:var(--muted)}
.mvc-page .contact-link,.mvc-page .pill{border-color:#12222b70}

/* Scroll cover, using the same settle motion as the Food Network case study. */
.mvc-page>.site-header{position:absolute;inset:0 0 auto;z-index:5;border-bottom:0}
.mvc-motion-cover{height:100svh;min-height:560px;position:relative}
.mvc-cover-caption{position:absolute;bottom:86px;width:100%;padding:0 24px;text-align:center}
.mvc-cover-caption h1{font-size:clamp(24px,2.5vw,40px);font-weight:600;margin-top:12px}
.mvc-cover-next{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);padding:10px;color:var(--text)}
.mvc-hero-grid{display:grid;grid-template-columns:1.08fr 1fr;align-items:center;gap:5%;padding:10px 0 40px}
.mvc-hero-grid h2{font-size:clamp(40px,4.6vw,72px);line-height:1.07;letter-spacing:-1px}
.mvc-photo-slot,.mvc-motion-photo{aspect-ratio:1.15;width:100%}
.mvc-motion-photo{position:relative;isolation:isolate;transform-origin:top left}
.mvc-motion-photo img{position:absolute;width:44%;height:auto;display:block;border-radius:8px;box-shadow:0 18px 40px #17303c38;transform:rotate(var(--angle));transform-origin:center}
.mvc-motion-photo img:nth-child(1){left:7%;top:6%;--angle:-12deg;--delay:0s;z-index:1}
.mvc-motion-photo img:nth-child(2){left:49%;top:7%;--angle:12deg;--delay:.3s;z-index:2}
.mvc-motion-photo img:nth-child(3){left:28%;top:14%;--angle:-3deg;--delay:.6s;z-index:3}
.mvc-motion-photo.is-floating{position:fixed;left:0;top:0;z-index:4;pointer-events:none;will-change:transform}
.mvc-motion-photo.is-loading img{opacity:0}
.mvc-motion-photo.is-ready img{animation:mvcPhotoReveal .3s ease-out var(--delay) both}
@keyframes mvcPhotoReveal{from{opacity:0;transform:translateY(30px) rotate(var(--angle)) scale(.96)}to{opacity:1;transform:translateY(0) rotate(var(--angle)) scale(1)}}
@media(max-width:700px){.mvc-hero-grid{grid-template-columns:1fr;gap:28px;padding-bottom:24px}.mvc-hero-grid h2{font-size:42px}.mvc-photo-slot{width:min(100%,420px);justify-self:center}.mvc-cover-caption{bottom:90px}}
@media(prefers-reduced-motion:reduce){.mvc-motion-cover{display:none}.mvc-page>.site-header{position:relative}.mvc-motion-photo img,.mvc-motion-photo.is-ready img{animation:none;opacity:1}}

/* Decorative flower stays behind the case study as it scrolls. */
.mvc-page{position:relative;isolation:isolate}




.mvc-original-flower{position:fixed;inset:0;z-index:-1;pointer-events:none;background:url("assets/mvc/flower.png.webp") no-repeat right -100px bottom -180px;background-size:auto 72.45vh}
@media(max-width:700px){.mvc-original-flower{background-position:right -180px bottom -80px;background-size:auto 56.7vh}}

.mvc-palette>.mvc-swatch-wide{grid-column:span 2;min-height:60px;padding:12px 24px;justify-content:center}
.mvc-palette>.mvc-swatch-dark{color:#fff}
@media(max-width:700px){.mvc-palette>.mvc-swatch-wide{grid-column:span 1;min-height:55px;padding:10px 18px}}

.mvc-comparison>.eyebrow{margin-bottom:20px}.mvc-comparison>.mvc-artwork+.eyebrow{margin-top:48px}

.mvc-reveal-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}
.mvc-reveal-toggle{font:inherit;font-size:13px;color:var(--text);background:transparent;border:1px solid var(--line);border-radius:30px;padding:8px 14px;cursor:pointer}
.mvc-reveal{position:relative;isolation:isolate}
.mvc-reveal img{display:block}
.mvc-comparison.is-ready .mvc-reveal-before{animation:mvcBeforeReveal 8s ease-in-out infinite}
.mvc-reveal .mvc-reveal-after{position:absolute;inset:0;clip-path:inset(0 100% 0 0)}
.mvc-comparison.is-ready .mvc-reveal-after{animation:mvcAfterReveal 8s ease-in-out infinite}
@keyframes mvcBeforeReveal{0%,15%,95%,100%{clip-path:inset(0 0 0 0)}45%,65%{clip-path:inset(0 0 0 100%)}}
@keyframes mvcAfterReveal{0%,15%,95%,100%{clip-path:inset(0 100% 0 0)}45%,65%{clip-path:inset(0 0 0 0)}}
.mvc-comparison.is-paused .mvc-reveal img{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.mvc-comparison.is-ready .mvc-reveal-before{animation:none;visibility:hidden}.mvc-comparison.is-ready .mvc-reveal-after{animation:none;clip-path:none}.mvc-reveal-toggle{display:none}}

.mvc-reveal-heading{max-width:1080px;margin-inline:auto}.mvc-reveal-controls{display:flex;justify-content:center;margin-top:24px}

.mvc-branding-intro #mvc-logo{border-bottom:0}

.mvc-story-motion{position:relative;width:100%;aspect-ratio:1080/727;overflow:hidden}
.mvc-story-canvas{position:absolute;left:0;top:0;width:1080px;height:727px;transform-origin:top left}
.mvc-story-desktop{position:absolute;left:50px;top:76px;width:680px;height:601px;overflow:hidden;border-radius:0 0 10px 10px;background:#f5fafc;box-shadow:0 2px 4px #0002}
.mvc-page .story .mvc-artwork .mvc-story-desktop-page{width:680px;height:900.056px;border-radius:0;animation:mvcStoryDesktop 20s linear infinite}
.mvc-page .story .mvc-artwork .mvc-story-nav{position:absolute;left:0;top:0;width:680px;height:42.5px;border-radius:0}
.mvc-page .story .mvc-artwork .mvc-story-browser{position:absolute;left:50px;top:50px;width:680px;height:26px;border-radius:0}
.mvc-story-mobile{position:absolute;left:783px;top:135px;width:235px;height:480px;overflow:hidden;border-radius:0 0 21px 21px;background:#fff}
.mvc-page .story .mvc-artwork .mvc-story-mobile-page{width:235px;height:814.04px;border-radius:0;animation:mvcStoryMobile 20s linear infinite}
.mvc-story-status{position:absolute;left:783px;top:110px;width:235px;height:25px;background:white;border-radius:21px 21px 0 0}
.mvc-page .story .mvc-artwork .mvc-story-phone{position:absolute;left:770px;top:98px;width:260px;height:530px;border-radius:0;pointer-events:none}
.mvc-story-time{position:absolute;left:800px;top:118px;font:600 9.124px Arial;color:#000;letter-spacing:-.365px}
.mvc-page .story .mvc-artwork .mvc-story-battery{position:absolute;left:985px;top:120px;width:15.0285px;height:7.51423px;border-radius:0}
.mvc-page .story .mvc-artwork .mvc-story-notch{position:absolute;left:858px;top:110px;width:84px;height:16px;border-radius:0}
.mvc-page .story .mvc-artwork .mvc-story-notch-left{position:absolute;left:851px;top:110px;width:7px;height:7px;border-radius:0}
.mvc-page .story .mvc-artwork .mvc-story-notch-right{position:absolute;left:942px;top:110px;width:7px;height:7px;border-radius:0;transform:scaleX(-1)}
@keyframes mvcStoryDesktop{0%,10%,100%{transform:translateY(-56px)}75%,85%{transform:translateY(-299.056px)}}
@keyframes mvcStoryMobile{0%,10%,100%{transform:translateY(-37px)}75%,85%{transform:translateY(-334.04px)}}
.mvc-story-controls{display:flex;justify-content:center;margin-top:16px}
.mvc-story-toggle{font:inherit;font-size:13px;color:var(--text);background:transparent;border:1px solid var(--line);border-radius:30px;padding:8px 14px;cursor:pointer}
.mvc-page .story .mvc-artwork .mvc-story-motion.is-paused img{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.mvc-page .story .mvc-artwork .mvc-story-desktop-page{animation:none;transform:translateY(-56px)}.mvc-page .story .mvc-artwork .mvc-story-mobile-page{animation:none;transform:translateY(-37px)}.mvc-story-controls{display:none}}

.mvc-story-mobile-nav{position:absolute;left:0;top:0;width:235px;height:71px;overflow:hidden;background:#fff}
.mvc-page .story .mvc-artwork .mvc-story-mobile-nav img{position:absolute;left:0;top:-37px;width:235px;height:814.04px;border-radius:0}

.mvc-doctor-stage{position:relative;isolation:isolate}
.mvc-page .story .mvc-artwork .mvc-doctor-detail{position:absolute;inset:0;animation:mvcDoctorDetail 12s infinite}
.mvc-doctor-cursor{position:absolute;left:18.4%;top:69.6%;width:clamp(18px,2.6vw,28px);pointer-events:none;filter:drop-shadow(0 2px 2px #0003);animation:mvcDoctorCursor 12s infinite}
.mvc-doctor-cursor svg{display:block;width:100%;height:auto}
.mvc-doctor-tap{position:absolute;left:84.3%;top:63.5%;width:3%;aspect-ratio:1;border:2px solid white;border-radius:50%;background:#fd7b7b88;pointer-events:none;animation:mvcDoctorTap 12s infinite}
.mvc-doctor-hotspot{position:absolute;border:0;background:transparent;cursor:pointer;padding:0;border-radius:6px;animation:mvcDoctorHotspot 12s infinite}
.mvc-doctor-hotspot-desktop{left:10.3%;top:39.3%;width:16.2%;height:33.5%}
.mvc-doctor-hotspot-mobile{left:73.7%;top:53.3%;width:19.4%;height:14.3%}
.mvc-doctor-hotspot:focus-visible{outline:3px solid #155c7c;outline-offset:2px}
.mvc-doctor-controls{display:flex;gap:12px;justify-content:center;margin-top:16px}
.mvc-doctor-controls button{font:inherit;font-size:13px;color:var(--text);background:transparent;border:1px solid var(--line);border-radius:30px;padding:8px 14px;cursor:pointer}
@keyframes mvcDoctorDetail{0%,30%{opacity:0}34%,88%{opacity:1}94%,100%{opacity:0}}
@keyframes mvcDoctorCursor{0%,8%{opacity:0;transform:translate(110px,70px)}12%{opacity:1;transform:translate(110px,70px)}25%,28%{opacity:1;transform:translate(0,0) scale(1)}30%{opacity:1;transform:translate(0,0) scale(.8)}33%{opacity:1;transform:translate(0,0) scale(1)}36%,100%{opacity:0;transform:translate(0,0)}}
@keyframes mvcDoctorTap{0%,27%{opacity:0;transform:translate(-50%,-50%) scale(.5)}30%{opacity:1;transform:translate(-50%,-50%) scale(1)}36%,100%{opacity:0;transform:translate(-50%,-50%) scale(1.8)}}
@keyframes mvcDoctorHotspot{0%,30%,94%,100%{visibility:visible}34%,88%{visibility:hidden}}
.mvc-page .story .mvc-doctor-demo.is-paused *{animation-play-state:paused}
.mvc-page .story .mvc-artwork.is-detail .mvc-doctor-detail{animation:none;opacity:1}
.mvc-doctor-demo.is-detail .mvc-doctor-cursor,.mvc-doctor-demo.is-detail .mvc-doctor-tap,.mvc-doctor-demo.is-detail .mvc-doctor-hotspot{display:none}
@media(prefers-reduced-motion:reduce){.mvc-page .story .mvc-doctor-demo *{animation:none}.mvc-page .story .mvc-artwork .mvc-doctor-detail{opacity:0}.mvc-doctor-cursor,.mvc-doctor-tap,.mvc-doctor-toggle{display:none}.mvc-page .story .mvc-artwork.is-detail .mvc-doctor-detail{opacity:1}}

.mvc-doctor-stage{container-type:inline-size}
.mvc-doctor-learn{position:absolute;display:flex;align-items:center;justify-content:center;background:#000;color:#fff;border-radius:999px;font-family:Arial,sans-serif;font-weight:500;line-height:1;pointer-events:none;opacity:0;animation:mvcDoctorLearn 12s infinite}
.mvc-doctor-learn-desktop{left:16.02%;top:68.57%;width:4.75%;height:2.32%;font-size:.54cqw}
.mvc-doctor-learn-mobile{left:81.2%;top:62.05%;width:6.25%;height:2.98%;font-size:.72cqw}
@keyframes mvcDoctorLearn{0%,23%{opacity:0}25%,31%{opacity:1}34%,100%{opacity:0}}
.mvc-doctor-hotspot-desktop:hover~.mvc-doctor-learn-desktop,.mvc-doctor-hotspot-desktop:focus-visible~.mvc-doctor-learn-desktop,.mvc-doctor-hotspot-mobile:hover~.mvc-doctor-learn-mobile,.mvc-doctor-hotspot-mobile:focus-visible~.mvc-doctor-learn-mobile{animation:none;opacity:1}
.mvc-doctor-demo.is-detail .mvc-doctor-learn{display:none}
@media(prefers-reduced-motion:reduce){.mvc-doctor-learn{animation:none}}

/* Shared Food Network demo controls, using the Metro palette. */
.mvc-page .mvc-demo-control{display:inline-flex;align-items:center;gap:8px;margin-top:0;padding:8px 17px;border:1px solid rgba(18,34,43,.22);border-radius:30px;background:transparent;color:#425966;font:inherit;font-size:14px;cursor:pointer}
.mvc-page .mvc-demo-control:hover{color:#12222b;border-color:#425966;background:rgba(223,245,255,.4)}
.mvc-page .mvc-demo-control:focus-visible{outline:2px solid #155c7c;outline-offset:4px}
.mvc-page .mvc-demo-control[hidden]{display:none}
@media(prefers-reduced-motion:reduce){.mvc-page .mvc-doctor-toggle,.mvc-page .mvc-reveal-toggle{display:none}}

.mvc-booking-stage{position:relative;container-type:inline-size}
.mvc-page .story .mvc-artwork .mvc-booking-stage>img{display:block;width:100%;height:auto;max-height:none}
.mvc-page .story .mvc-artwork .mvc-booking-stage .mvc-booking-success{position:absolute;inset:0;opacity:0;z-index:1;transition:opacity 200ms ease}
.mvc-booking-stage.is-success .mvc-booking-success{opacity:1!important}
.mvc-booking-field{position:absolute;background:#fff;color:#000;display:none;align-items:center;font:500 .72cqw/1.5 'MVC Poppins',sans-serif;white-space:nowrap;overflow:hidden}
.mvc-booking-field.mobile{font-size:1cqw}
.mvc-booking-cursor{position:absolute;width:2%;height:auto;left:54%;top:47%;opacity:0;transition:left .6s ease,top .6s ease,opacity .2s}
.mvc-booking-stage.is-clicking .mvc-booking-cursor{opacity:1;left:51.2%;top:48%}
.mvc-booking-controls{display:flex;justify-content:center;margin-top:16px}

/* Soft pink wash behind the landing header. */
.mvc-page{background-image:radial-gradient(ellipse 65vw 85vh at 0% 0%,rgba(255,216,228,.72) 0%,rgba(255,225,233,.3) 42%,rgba(255,225,233,0) 75%);background-repeat:no-repeat}

.mvc-care-stage{position:relative;aspect-ratio:792/727;filter:drop-shadow(0 2px 4px #0002)}
.mvc-care-frame{container-type:inline-size;position:absolute;left:7.0707%;top:6.8776%;width:85.8586%;height:86.2448%;background:#f6fbfe;overflow:hidden;mask:url('assets/mvc/care-motion/mask.svg') center/100% 100% no-repeat}
.mvc-page .story .mvc-artwork .mvc-care-page{position:absolute;left:0;top:7.6555%;width:100%;height:auto;object-fit:contain;border-radius:0;animation:mvcCareScroll 20s linear infinite;animation-play-state:paused}
.mvc-page .story .mvc-artwork .mvc-care-nav{position:absolute;left:0;top:4.1467%;width:100%;height:6.7783%;border-radius:0}
.mvc-page .story .mvc-artwork .mvc-care-browser{position:absolute;left:0;top:0;width:100%;height:4.1467%;border-radius:0}
.mvc-care-demo.is-ready.is-visible:not(.is-paused) .mvc-care-page{animation-play-state:running}
.mvc-care-controls{display:flex;justify-content:center;margin-top:16px}
@keyframes mvcCareScroll{0%,10%,100%{transform:translateY(0)}75%,85%{transform:translateY(calc(-100% + 85.14706cqw))}}
@media(prefers-reduced-motion:reduce){.mvc-page .story .mvc-artwork .mvc-care-page{animation:none}.mvc-care-controls{display:none}}

.mvc-collaboration{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-top:28px;font-size:14px;color:#363131}.mvc-collaboration img{display:block;width:90px;height:auto;flex-shrink:0}.mvc-collaboration a{color:inherit;font-weight:500;text-underline-offset:4px}.mvc-collaboration a:hover{color:var(--accent)}

.mvc-context-card-wide{grid-column:1 / -1}.mvc-context-card-wide>p{max-width:none}

.mvc-cover.mvc-comparison{max-width:1080px}

.mvc-comparison-intro{padding:0 0 36px;border-bottom:0}

/* Account for the empty space below the devices inside each artwork. */
.mvc-page .mvc-reveal-controls,.mvc-page .mvc-story-controls,.mvc-page .mvc-doctor-controls,.mvc-page .mvc-booking-controls{position:relative;margin-top:calc(20px - 4.62963%)}
.mvc-page .mvc-care-controls{position:relative;margin-top:calc(20px - 6.31313%)}
.mvc-page .mvc-quiz-controls{margin-top:20px}

.mvc-comparison .mvc-reveal-heading{justify-content:center;text-align:center;margin-bottom:calc(20px - 4.62963%);position:relative;z-index:2}

/* Match CNN impact-card lift on the goal and results tiles. */
@media(hover:hover) and (pointer:fine){
 .mvc-context-card,.mvc-impact>div{transition:transform 180ms ease,box-shadow 180ms ease}
 .mvc-context-card:hover,.mvc-impact>div:hover{transform:translateY(-3px);box-shadow:0 8px 20px #00000018}
}
@media(prefers-reduced-motion:reduce){.mvc-context-card:hover,.mvc-impact>div:hover{transform:none}}

.mvc-context-card,.mvc-impact>div,.mvc-context-card:hover,.mvc-impact>div:hover{box-shadow:none}

/* Branding artwork grows from its center on hover. */
.mvc-logo-grid img{transform-origin:center center;transition:transform 200ms ease;position:relative}
@media(hover:hover){.mvc-logo-grid img:hover{transform:scale(1.04);z-index:1}}
@media(prefers-reduced-motion:reduce){.mvc-logo-grid img{transition:none}}

/* Keep all five social posts in one row; scroll horizontally on small screens. */
.mvc-social-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;margin-top:36px}
.mvc-social-grid .mvc-social-post{display:block;width:100%;height:auto;aspect-ratio:1;border-radius:8px}
@media(max-width:1000px){.mvc-social-grid{grid-template-columns:repeat(5,28vw);gap:20px;overflow-x:auto;padding-bottom:12px;scroll-snap-type:x proximity}.mvc-social-post{scroll-snap-align:start}}
@media(max-width:700px){.mvc-social-grid{grid-template-columns:repeat(5,240px);margin-top:28px}}

/* Dark footer marks on the light MVC page, at every breakpoint. */
.mvc-page footer .wordmark img,.mvc-page footer .linkedin-link img,.mvc-page .site-header .nav-linkedin img,.mvc-page .site-header .wordmark img{filter:brightness(0)}

@media(max-width:700px){.mvc-page .mvc-social{display:none}}
