/* Full-width page backgrounds with a centered, consistently sized content area. */
@media(min-width:768px){
  .wer-landing,.wer-thankyou,.wer-video-timeline{width:100%;max-width:none;margin:0;padding-left:max(4vw,calc((100% - 1200px)/2));padding-right:max(4vw,calc((100% - 1200px)/2))}
  .wer-landing-inner,.wer-thankyou-inner,.wer-thankyou .wer-thankyou-legal{width:100%;max-width:1200px;margin-left:auto;margin-right:auto}
  .wer-landing .wer-logo,.wer-thankyou .wer-thankyou-logo,.wer-intro .wer-intro-logo{left:max(4vw,calc((100% - 1200px)/2));right:auto}
  .wer-intro{width:100%;max-width:none;margin:0}
  .wer-intro .wer-intro-skip{right:max(4vw,calc((100% - 1200px)/2))}
  .wer-intro .wer-intro-sound{left:max(4vw,calc((100% - 1200px)/2))}
}

/* The cube logo needs a bounded portrait box, rather than the old wide-logo sizing. */
.wer-landing .wer-logo,
.wer-thankyou .wer-thankyou-logo,
.wer-intro .wer-intro-logo{top:20px;width:84px!important;height:94px!important;display:block;line-height:0}
.wer-landing .wer-logo img,
.wer-thankyou .wer-thankyou-logo img,
.wer-intro .wer-intro-logo img{display:block;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain;margin:0}
.wer-landing,.wer-thankyou{padding-top:138px}
@media(max-width:767px){
  .wer-landing .wer-logo,.wer-thankyou .wer-thankyou-logo,.wer-intro .wer-intro-logo{top:20px;left:24px;right:auto;width:72px!important;height:80px!important}
  .wer-landing,.wer-thankyou{padding-top:124px}
}

/* Mobile landing: brand/title, character, introduction, then the email form. */
@media(max-width:767px){
  .wer-landing{display:grid;grid-template-columns:72px minmax(0,1fr);column-gap:18px;row-gap:24px;align-content:start;padding:20px 24px 36px}
  .wer-landing .wer-landing-inner,.wer-landing .wer-content{display:contents}
  .wer-landing .wer-logo{position:static;grid-column:1;grid-row:1;align-self:center;width:72px!important;height:80px!important}
  .wer-landing h1{grid-column:2;grid-row:1;align-self:center;font-size:20px!important;line-height:1.12!important;margin:0;overflow-wrap:normal}
  .wer-landing .wer-art{grid-column:1/-1;grid-row:2;justify-self:center;align-self:center;width:100%;max-width:360px;margin:0}
  .wer-landing .wer-art img{width:100%;height:auto;opacity:50%;}
  .wer-landing .wer-welcome{grid-column:1/-1;grid-row:3;font-size:17px!important;line-height:1.45!important;margin:0;position:relative;top:-100px;z-index:99}
  .wer-landing .wer-signal{grid-column:1/-1;grid-row:4;margin:0;min-width:0;position:relative;top:-95px;}
}
@media(max-width:360px){
  .wer-landing{padding-left:18px;padding-right:18px;column-gap:14px}
  .wer-landing h1{font-size:20px!important}
}

/* Remove theme/page-builder spacing above the standalone landing screen. */
body.wer-landing-page #ajax-content-wrap,
body.wer-landing-page .container-wrap,
body.wer-landing-page .container.main-content,
body.wer-landing-page .container.main-content>.row,
body.wer-landing-page .wpb_row:has(.wer-landing),
body.wer-landing-page .row_col_wrap_12:has(.wer-landing),
body.wer-landing-page .wpb_column:has(.wer-landing),
body.wer-landing-page .vc_column-inner:has(.wer-landing),
body.wer-landing-page .wpb_wrapper:has(.wer-landing),
body.wer-landing-page .wpb_raw_html:has(.wer-landing){margin-top:0!important;padding-top:0!important}

/* Fit the complete standalone desktop screen, including expanded registration. */
@media(min-width:768px){
  html:has(body.wer-fit-page),body.wer-fit-page{overflow:hidden!important}
  .wer-landing.wer-fit-screen,.wer-thankyou.wer-fit-screen{position:fixed;inset:var(--wer-screen-top,0px) 0 auto;width:100%;height:var(--wer-screen-height,100dvh);min-height:0;padding:0!important;overflow:hidden;z-index:100}
  .wer-fit-content{position:relative;box-sizing:border-box;width:100%;padding:132px max(4vw,calc((100% - 1200px)/2)) 24px;transform-origin:top center}
  .wer-fit-screen .wer-landing-inner,.wer-fit-screen .wer-thankyou-inner{min-height:0}
  .wer-fit-screen .wer-thankyou-legal{margin-top:24px}
  .wer-fit-screen .wer-logo,.wer-fit-screen .wer-thankyou-logo{top:20px}
}