/* Each campaign step occupies exactly the usable browser viewport. */
:root{--vp-screen:100vh}
@supports(height:100dvh){:root{--vp-screen:100dvh}}
html{height:100%;overflow:hidden}
body{--vp-frame:var(--vp-screen);position:relative;height:var(--vp-frame);min-height:0;max-height:var(--vp-frame);overflow:hidden}
body.admin-bar{--vp-frame:calc(var(--vp-screen) - 32px)}
.site-main{flex:none;width:100%;height:100%;min-height:0;overflow:hidden}
.site-main>.view{height:100%;min-height:0;max-height:100%;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.site-header.container{position:absolute;z-index:5;top:0;left:50%;width:min(calc(100% - 2 * var(--gutter)),1280px);height:0;margin:0;transform:translateX(-50%)}
.site-header .brand{width:clamp(160px,47vw,235px);margin:clamp(27px,6vh,65px) auto 0}
.site-footer.container{position:absolute;z-index:3;right:0;bottom:0;left:0;width:100%;max-width:none;height:29px;margin:0;padding:0 var(--gutter);background:transparent}
.site-footer .footer-links{height:100%;font-size:10px}
.site-footer .footer-links a{min-height:26px}
.english-kicker,.player-heading h2,.player-heading p,.audio-player .player-time,.social-handle bdi{font-family:var(--font-latin)}

/* Home: the image box keeps its native ratio, so the masked lamp stays aligned. */
.home-view{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;align-items:center;justify-items:center;padding:clamp(105px,17vh,175px) var(--gutter) 36px}
.home-view>.hero{grid-row:1;grid-column:1;align-self:center;justify-self:center;width:auto;height:100%;min-width:0;min-height:0;max-width:100%;max-height:133.94vw;aspect-ratio:1600/2143;margin:0}
.hero__image,.hero__light-image{width:100%;height:100%;min-height:0;object-fit:contain}
.home-view>.campaign-layout{grid-row:2;grid-column:1;display:flex;flex-direction:column;justify-content:flex-end;width:min(100%,600px);min-height:0;margin:0;padding:0}
.campaign-copy{padding:0}
.campaign-title{font-size:clamp(22px,min(7vw,5vh),40px);line-height:1.3}
.campaign-action{width:100%;min-height:clamp(43px,7vh,56px);margin-top:clamp(8px,2vh,22px);font-size:clamp(16px,3.5vw,22px)}

/* Registration: scale spacing with height before allowing internal scrolling. */
.registration-view{position:relative}
.registration-layout.container{display:flex;flex-direction:column;justify-content:flex-start;gap:clamp(7px,1.3vh,18px);width:min(calc(100% - 2 * var(--gutter)),1170px);height:100%;min-height:0;padding:clamp(15px,3vh,35px) 0 36px}
.registration-aside{order:-1;flex:none;min-height:0;margin-top:auto;padding:0}
.road-art{height:clamp(43px,8vh,75px)}
.road-art__chevrons{top:0;bottom:0;left:0;right:auto;display:flex;align-items:center;justify-content:center;height:100%;font-size:clamp(38px,8vh,55px);line-height:1;letter-spacing:-11px;transform:none}
.road-art__scooter{height:100%}
.road-art svg,.road-art svg path,.route-decoration--register,.route-decoration--register path{animation:none!important;transform:none!important;stroke-dashoffset:0!important}
.english-kicker{margin-top:clamp(5px,1.2vh,12px)}
.english-kicker strong{font-size:clamp(26px,4.7vh,42px)}
.english-kicker span{font-size:clamp(12px,2.4vh,20px)}
.aside-title{width:min(100%,540px);margin:clamp(11px,2.5vh,27px) auto 0;font-size:clamp(20px,4.2vh,37px);line-height:1.37;direction:rtl;text-align:center;text-wrap:balance;word-spacing:normal;letter-spacing:normal}
.registration-content{flex:none;min-width:0;margin-bottom:auto;padding:0}
.registration-form{gap:clamp(5px,1vh,11px);margin-top:0}
.input-wrap{height:clamp(43px,6.2vh,55px);min-height:0;direction:rtl;flex-direction:row}
.privacy-assurance{gap:6px;margin:clamp(3px,.6vh,8px) 0 0;font-size:clamp(11px,2.1vh,15px);line-height:1.35}
.privacy-assurance .icon{width:20px;height:20px}
.consent-row,.consent-label{min-height:0}
.consent-label{font-size:clamp(10px,1.7vh,12px);line-height:1.35}
.registration-submit{min-height:clamp(43px,6.2vh,55px);margin-top:clamp(2px,.6vh,8px)}
.form-privacy{font-size:clamp(9px,1.5vh,11px);line-height:1.35}
.route-decoration--register{position:absolute;z-index:0;right:0;bottom:0;left:0;width:100%;height:clamp(60px,13vh,110px);margin:0;opacity:.28}
.registration-layout{position:relative;z-index:1}

@media(max-width:699px){
  .registration-layout.container{width:min(calc(100% - 2 * clamp(24px,13vw,54px)),600px)}
  .aside-title .mobile-only{display:block;width:100%;text-align:center;text-wrap:balance}
  .registration-view .consent-field,.registration-view .form-privacy{display:none}
  .privacy-assurance a{color:inherit;text-decoration:none}
  .privacy-assurance a:focus-visible{text-decoration:underline;outline:2px solid currentColor;outline-offset:3px}
}
@media(max-width:699px) and (min-height:740px){
  .registration-layout.container{gap:clamp(25px,4vh,38px);padding-top:clamp(60px,11vh,92px);padding-bottom:0}
  .registration-aside{margin-top:0}
  .registration-content{margin-bottom:0}
  .road-art{height:70px}
  .road-art__chevrons{font-size:42px}
  .road-art__scooter{left:clamp(40px,10vw,52px);width:95px}
  .road-art svg{left:clamp(125px,30vw,145px);right:0;top:19px;width:auto;height:54px}
  .english-kicker{margin-top:6px}
  .english-kicker strong{font-size:31px}
  .english-kicker span{font-size:14px}
  .aside-title{width:100%;margin-top:32px;font-size:clamp(22px,3vh,26px);line-height:1.3}
  .registration-form{gap:17px}
  .input-wrap{height:44px}
  .privacy-assurance{margin:4px 0 0;font-size:14px;line-height:1.4}
  .registration-submit{min-height:44px;margin-top:clamp(20px,4vh,34px)}
  .route-decoration--register{height:145px;opacity:.75}
}

/* Music: the player and actions fit in one view on ordinary mobile screens. */
.music-view.container{position:relative;display:flex;flex-direction:column;justify-content:flex-start;width:100%;max-width:1180px;height:100%;min-height:0;margin-inline:auto;padding:clamp(16px,3vh,36px) var(--gutter) 35px}
.music-heading{position:relative;z-index:1;flex:none;margin-top:auto}
.music-heading::before{width:clamp(54px,10vh,88px);height:clamp(54px,10vh,88px);margin-bottom:clamp(6px,1.3vh,14px);background-size:48%}
.music-heading h1{font-size:clamp(22px,3.5vh,31px);line-height:1.35}
.music-heading p{margin-top:clamp(3px,.7vh,8px);font-size:clamp(14px,2.6vh,22px);line-height:1.4}
.media-layout{position:relative;z-index:1;flex:none;width:min(100%,700px);margin:clamp(10px,1.8vh,22px) auto auto}
.audio-player{min-height:0;gap:clamp(3px,.6vh,7px) 8px;padding:clamp(9px,1.7vh,16px)}
.audio-player .player-toggle{width:clamp(35px,5.2vh,44px);height:clamp(35px,5.2vh,44px)}
.waveform{height:clamp(18px,3.5vh,30px);margin-top:0}
.audio-player .download-button{height:clamp(28px,4.5vh,38px);font-size:clamp(10px,1.7vh,13px)}
.steps-list{margin-top:clamp(8px,1.4vh,16px)}
.step-card{min-height:clamp(65px,10vh,105px);padding:6px 5px;gap:3px}
.step-card__action{width:clamp(27px,4.2vh,35px);height:clamp(27px,4.2vh,35px)}
.step-card__action .icon{width:clamp(22px,3.6vh,29px);height:clamp(22px,3.6vh,29px)}
.video-card{height:clamp(36px,6vh,50px);margin-top:clamp(7px,1.2vh,13px)}
.instagram-action{min-height:clamp(43px,6.5vh,56px);margin-top:clamp(10px,2vh,26px)}
.route-decoration--music{position:absolute;z-index:0;right:0;bottom:0;left:0;width:100%;height:clamp(60px,13vh,110px);margin:0;opacity:.28}

@media(min-width:700px){
  .site-header .brand{width:clamp(190px,21vw,245px);margin-top:clamp(17px,3.5vh,40px)}
  .home-view{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);column-gap:clamp(16px,4vw,70px);padding:clamp(85px,13vh,135px) var(--gutter) 36px}
  .home-view>.hero{grid-row:1;grid-column:1;max-height:min(80vh,60vw);float:none}
  .home-view>.campaign-layout{grid-row:1;grid-column:2;align-self:center;width:100%;min-height:0;max-width:560px;margin:0;padding:0}
  .campaign-title{font-size:clamp(32px,min(4vw,6vh),62px);text-align:right}
  .campaign-action{max-width:430px;margin-top:clamp(20px,4vh,40px)}
  .registration-layout.container{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);align-items:center;gap:clamp(26px,7vw,100px);padding:clamp(38px,7vh,72px) 0 38px}
  .registration-aside{grid-column:2;grid-row:1;order:0;margin:0;padding:0}
  .registration-content{grid-column:1;grid-row:1;margin:0;padding:0}
  .road-art{height:clamp(70px,13vh,110px)}
  .aside-title{font-size:clamp(25px,4.5vh,42px)}
  .registration-form{max-width:520px;gap:clamp(8px,1.5vh,16px)}
  .input-wrap{height:clamp(48px,8vh,62px)}
  .music-view.container{justify-content:flex-start;padding-top:clamp(35px,6vh,60px)}
  .music-heading::before{width:clamp(75px,13vh,110px);height:clamp(75px,13vh,110px)}
  .music-heading h1{font-size:clamp(29px,4.5vh,48px)}
  .music-heading p{font-size:clamp(18px,3.5vh,28px)}
  .audio-player{min-height:0;padding:clamp(14px,2.3vh,22px)}
  .steps-list{margin-top:clamp(12px,2vh,23px)}
  .step-card{min-height:clamp(88px,14vh,145px)}
}
@media(max-height:650px){
  .home-view{padding-top:clamp(88px,15vh,110px);padding-bottom:30px}
  .registration-layout.container{padding-top:9px;padding-bottom:31px}
  .music-view.container{padding-top:10px;padding-bottom:31px}
  .route-decoration{opacity:.18}
}
@media(max-height:500px){
  .site-footer.container{height:24px}
  .site-footer .footer-links a{min-height:22px}
  .registration-layout.container{padding-top:6px;padding-bottom:27px}
  .registration-form{gap:4px}
  .registration-form .input-wrap{height:40px}
  .registration-submit{min-height:40px;margin-top:2px}
  .registration-aside .road-art{height:40px}
  .registration-aside .aside-title{margin-top:8px;font-size:22px}
  .privacy-assurance{margin:2px 0 0;font-size:11px}
  .music-view.container{padding-top:7px;padding-bottom:27px}
  .music-heading::before{width:42px;height:42px;margin-bottom:4px}
  .music-heading h1{font-size:21px}
  .music-heading p{font-size:13px}
  .media-layout{margin-top:7px}
  .audio-player{padding:7px;gap:2px 6px}
  .waveform{height:15px}
  .steps-list{margin-top:5px}
  .step-card{min-height:55px}
  .video-card{height:32px;margin-top:5px}
  .instagram-action{min-height:39px;margin-top:7px}
  .route-decoration{display:none}
}
@media(max-width:782px){body.admin-bar{--vp-frame:calc(var(--vp-screen) - 46px)}}
