/* Same HTML across devices: caches never choose which customer surface to serve. */
.myopal-access-guide{display:none}
.myopal-customer-surface{display:flex;flex-direction:column;flex:1;min-width:0}
@media(min-width:48rem){
 body.myopal-site:has(.myopal-access-guide){padding-block-end:0}
 .myopal-customer-surface{display:none}
 .myopal-access-guide{display:grid;position:relative;isolation:isolate;place-items:center;min-height:100svh;padding:4rem 2rem;text-align:center;color:var(--myopal-color-on-dark);background:var(--myopal-color-black)}
 .myopal-access-guide-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
 .myopal-access-guide::before{content:'';position:absolute;inset:0;background:rgb(0 0 0 / .58);z-index:-1}
 .myopal-access-guide-copy{max-width:54rem}.myopal-access-guide-copy>img{margin:0 auto var(--myopal-space-8)}
 .myopal-access-guide h1{font-family:var(--myopal-font-display);font-size:clamp(1.625rem,3.4vw,3rem);font-weight:400;color:inherit;margin-bottom:var(--myopal-space-4)}
 .myopal-access-guide h1 span{white-space:nowrap}
 .myopal-access-guide-copy>.myopal-action{margin-top:var(--myopal-space-8)}
 .myopal-access-guide p{font-size:1.125rem}.myopal-access-guide-address{overflow-wrap:anywhere}
 .myopal-access-guide nav{display:flex;flex-wrap:wrap;justify-content:center;gap:1.5rem;margin-top:2.5rem}.myopal-access-guide nav a{color:inherit}
}
