/* A connected film in chapters. All essential content remains ordinary Elementor HTML. */
:root{--cinema-night:#102C4C;--cinema-paper:#F7F6F0}
.mayo-site:has(.cinematic-hero) .site-header{position:absolute;inset:0 0 auto;background:transparent;color:var(--text-white);border-color:#ffffff24}
.mayo-site:has(.cinematic-hero) .desktop-navigation .menu>li:last-child>a{border-color:#ffffff70}
.mayo-site:has(.cinematic-hero) .header-inner{min-height:100px}
.mayo-site .cinematic-hero{position:relative;isolation:isolate;min-height:100svh;padding:140px var(--gutter) 0;overflow:hidden;background:var(--cinema-night);color:var(--cinema-paper)}
.cinematic-hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#102c4ce6 0%,#102c4c55 50%,transparent 80%)}
.mayo-site .cinematic-hero .hero-eyebrow{position:relative;z-index:3}
.mayo-site .cinematic-hero .hero-main{display:block;padding:clamp(40px,7vh,90px) 0 55px;position:static;flex:1}
.mayo-site .cinematic-hero .hero-copy{gap:30px;width:100%;max-width:none;z-index:2}
.cinematic-hero .hero-title{font-size:clamp(5rem,12.4vw,13rem);line-height:.87;letter-spacing:-.055em;max-width:1000px}
.cinematic-hero .hero-title em{font-weight:400;color:var(--bright-yellow)}
.cinematic-hero .hero-title em::after{display:none}
.mayo-site .cinematic-hero .hero-description{font-size:15px;max-width:350px;color:#e1e8ef;line-height:1.8;margin-top:15px}
.mayo-site .elementor .cinematic-hero .hero-copy>.hero-description{width:350px;max-width:100%}
.mayo-site .cinematic-hero .elementor-button{color:var(--text-white);border-color:#ffffff65}
.mayo-site .cinematic-hero .elementor-button:hover{color:var(--bright-yellow)}
.mayo-site .cinematic-hero .hero-art{position:absolute;inset:0;width:100%;height:100%;padding:0;z-index:-2;display:block;pointer-events:none}
.mayo-site .cinematic-hero .hero-image{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
.cinematic-hero .hero-image img{width:100%;height:100%;object-fit:cover;object-position:65% 45%;opacity:.65}
.cinematic-hero .hero-image .elementor-widget-container{height:100%}
.mayo-site .cinematic-hero .hero-art-caption{position:absolute;right:var(--gutter);bottom:115px;max-width:210px;font-size:9px;line-height:1.8;color:#e1e8ef;text-align:right;z-index:4}
.mayo-site .cinematic-hero .hero-bottom{position:relative;z-index:4;min-height:75px;border-color:#ffffff40;margin-top:auto}
.cinematic-hero .hero-bottom .hero-footnote{color:#e1e8ef}
.cinematic-hero .hero-location::before{background:var(--bright-yellow)}
.mayo-site .hero-story{padding-block:60px;gap:40px;display:flex;flex-direction:column;width:100%}
.hero-beat{font-family:var(--font-display);font-size:clamp(3.5rem,9vw,10rem);line-height:.95;letter-spacing:-.045em}
.hero-beat em{color:var(--bright-yellow);font-weight:400}
.hero-story-note{font-size:14px;letter-spacing:.04em}
.mayo-site .cinematic-hero.is-pinned-story{height:100svh;min-height:680px;max-height:none}
.mayo-site .is-pinned-story .hero-story{position:absolute;inset:0;padding:0;justify-content:center;pointer-events:none;z-index:3}
.is-pinned-story .hero-beat{position:absolute;left:var(--gutter);right:var(--gutter);top:50%;transform:translateY(-50%);max-width:1100px}
.is-pinned-story .hero-story-note{position:absolute;left:var(--gutter);bottom:120px}
.hero-line{display:block;overflow:clip;padding:.09em 0 .12em;margin:-.09em 0 -.12em}
.hero-line-inner{display:block;transform-origin:0 100%}
.hero-webgl{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero-webgl canvas{display:block;width:100%;height:100%}
.is-webgl .hero-image img{opacity:0}
.story-progress{position:fixed;top:0;left:0;right:0;height:3px;transform-origin:0 50%;background:var(--bright-yellow);z-index:999;pointer-events:none}
.story-scroll-cue{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--bright-yellow);margin-right:10px}

/* A full-viewport editorial breath between the opening and the ledger. */
.mayo-site .cinematic-statement{position:relative;min-height:94svh;display:flex;flex-direction:column;justify-content:center;gap:50px;padding:110px var(--gutter);overflow:hidden}
.cinematic-statement::after{content:"";position:absolute;left:var(--gutter);right:var(--gutter);bottom:70px;height:1px;background:var(--color-border);transform:scaleX(var(--statement-line,1));transform-origin:left}
.cinematic-statement .statement-copy{padding-left:clamp(0px,12vw,200px);width:100%;gap:35px}
.cinematic-statement .statement-title{font-size:clamp(3rem,5.8vw,6.5rem);max-width:1180px;line-height:1.12}
.cinematic-statement .statement-title em{font-style:italic}
.cinematic-statement .statement-description{align-self:flex-end;max-width:440px}

/* Desktop horizontal ledger. The base/accessible layout remains vertical. */
.mayo-site .cinematic-services{position:relative;overflow:clip;background:var(--primary-navy);padding-block:90px}
.cinematic-services .section-heading{align-items:start}
.mayo-site .cinematic-services.is-horizontal-story{height:100svh;min-height:700px;padding:65px var(--gutter) 32px;gap:30px;justify-content:space-between}
.mayo-site .is-horizontal-story .section-heading{display:flex;flex-direction:row;justify-content:space-between;align-items:start;gap:30px}
.is-horizontal-story .section-heading>.section-title{font-size:clamp(3rem,5.5vw,6rem);width:auto;line-height:.95}
.is-horizontal-story .section-heading>.section-title br{display:none}
.is-horizontal-story .section-heading>.section-title em{margin-left:.18em;color:var(--bright-yellow)}
.mayo-site .is-horizontal-story .service-list{display:flex;flex-direction:row;align-items:stretch;gap:0;width:max-content;max-width:none;flex:none}
.mayo-site .is-horizontal-story .service-row{position:relative;display:flex;flex-direction:column;gap:24px;flex:0 0 43vw;width:43vw;max-width:none;min-height:clamp(350px,50vh,540px);border-top:1px solid #ffffff45;border-bottom:0;border-right:1px solid #ffffff30;padding:28px 55px 20px 0;margin-right:55px;justify-content:flex-start;background:var(--primary-navy)}
.is-horizontal-story .service-number{font-family:var(--font-display);font-size:clamp(2.4rem,5vw,5rem);line-height:1;font-weight:400;color:var(--bright-yellow);letter-spacing:-.05em;padding:0}
.is-horizontal-story .service-title{font-size:clamp(2.1rem,3.5vw,4rem);letter-spacing:-.025em;line-height:1.05;max-width:560px}
.is-horizontal-story .service-description{max-width:370px;font-size:14px;padding:0}
.mayo-site .elementor .is-horizontal-story .service-description{width:370px;max-width:100%}
.mayo-site .is-horizontal-story .service-link{margin-top:auto;align-self:flex-end;position:absolute;right:45px;bottom:18px}
.mayo-site .is-horizontal-story .service-link .elementor-button{width:50px;height:50px;border:1px solid #ffffff60;border-radius:50%;justify-content:center;font-size:24px}
.mayo-site .is-horizontal-story .service-disclaimer{align-self:start;max-width:550px;margin-right:220px;font-size:11px}
.service-controls{position:absolute;right:var(--gutter);bottom:28px;display:flex;align-items:center;gap:20px;font-size:11px;color:white;z-index:5}
.service-controls button{width:44px;height:44px;background:none;color:inherit;border:1px solid #ffffff65;border-radius:50%;font-size:20px}
.service-controls button:hover{background:var(--bright-yellow);color:var(--color-ink)}
.service-controls button:disabled{opacity:.45}
.service-progress-line{position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--bright-yellow);transform-origin:left;transform:scaleX(var(--service-progress,0));pointer-events:none}

/* Three-act perspective: the frame opens and the camera keeps moving. */
.mayo-site .cinematic-perspective{min-height:0;isolation:isolate;background:var(--cinema-night);overflow:clip}
.mayo-site .cinematic-perspective .perspective-scene{position:relative;min-height:100svh;padding:65px var(--gutter);gap:50px}
.cinematic-perspective .perspective-title{font-size:clamp(4rem,9.3vw,10rem);margin:0;max-width:1300px;line-height:.97}
.cinematic-perspective .perspective-scene::after{background:linear-gradient(90deg,#102b4df2,#102b4d66 75%)}
.mayo-site .cinematic-perspective .perspective-caption{order:5;max-width:360px}
.mayo-site .elementor .cinematic-perspective .perspective-caption{width:360px;max-width:100%}
.mayo-site .cinematic-perspective.is-perspective-story .perspective-scene{height:100svh;min-height:680px}
.is-perspective-story .perspective-title{position:absolute;top:50%;left:var(--gutter);right:var(--gutter);width:auto;transform:translateY(-50%)}
.mayo-site .is-perspective-story .perspective-caption{margin-top:auto;z-index:2}
.mayo-site .cinematic-perspective .perspective-media{z-index:-2}
.perspective-chapter-dots{position:absolute;left:var(--gutter);bottom:70px;display:flex;gap:12px;z-index:4}
.perspective-chapter-dots i{display:block;width:30px;height:2px;background:#ffffff55;transition:background .25s}
.perspective-chapter-dots i.is-active{background:var(--bright-yellow)}
.mayo-site .cinematic-contact{position:relative;overflow:hidden;isolation:isolate;min-height:90svh;justify-content:space-between;padding-top:60px}
.cinematic-contact .contact-title{font-size:clamp(4rem,11.5vw,12rem);max-width:none}
.mayo-site .cinematic-contact .contact-bottom{padding-top:20px}
.cinematic-contact::before{content:"";position:absolute;inset:0;background:var(--bright-yellow);z-index:-1}

@media(min-width:1025px){
 .mayo-site .featured-section{min-height:95svh;gap:9vw}.featured-image{transform-origin:center}.featured-image img{aspect-ratio:4/5}
 .mayo-site .about-section{min-height:75svh;align-items:center}
 .mayo-site .approach-section{padding-block:120px}.approach-section .section-title{font-size:clamp(3rem,6vw,6.5rem)}
}
@media(min-width:1025px) and (max-height:850px){
 .mayo-site .is-pinned-story .hero-main{padding-block:30px}
 .is-pinned-story .hero-title{font-size:min(11.5vw,17vh)}
 .mayo-site .is-pinned-story .hero-copy{gap:20px}
 .mayo-site .is-pinned-story .hero-description{font-size:14px;margin-top:0}
 .mayo-site .is-pinned-story .hero-art-caption{bottom:95px}
 .is-horizontal-story .service-row{gap:18px}
}
@media(max-width:1024px){
 .mayo-site .cinematic-hero{padding-top:135px;min-height:100svh}
 .cinematic-hero .hero-title{font-size:clamp(5.5rem,14vw,9rem)}
 .mayo-site .cinematic-hero .hero-main{padding-block:70px 45px}
 .cinematic-hero .hero-image img{object-position:62% center;opacity:.5}
 .mayo-site .hero-story{padding-block:45px;gap:35px;border-top:1px solid #ffffff30;flex-direction:row;flex-wrap:wrap;align-items:flex-end}
 .hero-beat{font-size:clamp(2.5rem,6vw,5rem);width:45%}.hero-story-note{width:100%;font-size:12px}
 .mayo-site .cinematic-statement{min-height:80svh;gap:35px;padding-block:80px}.cinematic-statement .statement-copy{padding-left:7vw}.cinematic-statement .statement-title{font-size:clamp(2.8rem,6vw,5rem)}
 .mayo-site .cinematic-perspective .perspective-scene{gap:60px;min-height:950px}.cinematic-perspective .perspective-title{font-size:clamp(3.5rem,8vw,6rem)}
 .mayo-site .cinematic-contact{min-height:75svh}
}
@media(max-width:767px){
 .mayo-site:has(.cinematic-hero) .header-inner{min-height:88px}
 .mayo-site .cinematic-hero{padding-top:115px;min-height:0}
 .cinematic-hero .hero-eyebrow .section-label{font-size:9px}
 .mayo-site .cinematic-hero .hero-main{padding-block:70px 50px}
 .cinematic-hero .hero-title{font-size:clamp(4.3rem,18vw,8rem);max-width:100%;line-height:.95}
 .mayo-site .cinematic-hero .hero-description{max-width:300px;font-size:14px;margin-top:100px}
 .mayo-site .cinematic-hero .hero-art-caption{display:none}
 .cinematic-hero .hero-image img{object-position:60% 20%;opacity:.4}
 .cinematic-hero::after{background:linear-gradient(90deg,#102c4ce6,#102c4c55)}
 .mayo-site .cinematic-hero .hero-bottom{min-height:65px;gap:15px}.cinematic-hero .hero-bottom .hero-footnote{font-size:9px}
 .mayo-site .hero-story{gap:30px 15px;padding-block:35px 45px}.hero-beat{font-size:clamp(2.1rem,8.6vw,3.7rem);width:47%}
 .mayo-site .cinematic-statement{padding-block:75px;gap:35px;min-height:0}.cinematic-statement .statement-copy{padding-left:0}.cinematic-statement .statement-title{font-size:clamp(2.4rem,9.6vw,4rem)}.cinematic-statement::after{bottom:30px}
 .mayo-site .cinematic-services{padding-block:65px}
 .mayo-site .cinematic-perspective .perspective-scene{padding-block:40px;min-height:1000px;gap:65px;justify-content:space-between}.cinematic-perspective .perspective-title{font-size:clamp(2.9rem,11vw,5.4rem);max-width:100%}
 .mayo-site .cinematic-perspective .perspective-caption{max-width:270px}
 .cinematic-perspective .perspective-media img{object-position:70% center}
 .mayo-site .cinematic-contact{min-height:720px;gap:40px}.cinematic-contact .contact-title{font-size:clamp(3.2rem,12vw,5.5rem)}
}
.mayo-editing .cinematic-hero{min-height:100svh}
.mayo-editing .hero-story{position:relative}
.mayo-editing .hero-beat,.mayo-editing .cinematic-perspective .perspective-title{position:relative;transform:none}
@media(prefers-reduced-motion:reduce){.story-progress,.hero-webgl{display:none}.cinematic-hero .hero-image img{opacity:.5}.cinematic-perspective .perspective-title{position:relative;transform:none}.hero-line-inner{transform:none!important}}