Fix localization service retrieval. (#28440)

Story navigation was completely blocked after prerendering the education screens, because somehow the `pointer-events: none;` was not respected and the `amp-story-education` element was acting as a click shield. Hiding it entirely works though, and does not change the animations.

I've also seen race conditions where we try to access the ampdoc too early through the `getLocalizationService` method.

To verify the fix:
1. Open the link in mobile emulation
2. In the console, copy/paste `AMP.viewer.receiveMessage('visibilitychange', {'state': 'visible'})`
3. Try to navigate to the next page

[This story has the fix](https://stamp-storytime-le.firebaseapp.com/examples/s20/body-painting/index.html?amp_js_v=0.1#origin=https://www.google.com&prerenderSize=1&visibilityState=prerender&paddingTop=0&p2r=0&horizontalScrolling=0&csi=1&aoh=15526927198732&viewerUrl=https://www.google.com&history=1&storage=1&cid=1&cap=swipe,navigateTo,cid,fragment,replaceUrl,education)
[This story should fail 80% of the time (no fix)](https://stamp-storytime-le-fail.firebaseapp.com/examples/s20/body-painting/index.html?amp_js_v=0.1#origin=https://www.google.com&prerenderSize=1&visibilityState=prerender&paddingTop=0&p2r=0&horizontalScrolling=0&csi=1&aoh=15526927198732&viewerUrl=https://www.google.com&history=1&storage=1&cid=1&cap=swipe,navigateTo,cid,fragment,replaceUrl,education)

(cherry picked from commit 6f561cb)

extensions/amp-story-education/0.1/amp-story-education.js

@@ -74,8 +74,8 @@ export class AmpStoryEducation extends AMP.BaseElement {
     /** @private {!Element} */
     this.containerEl_ = this.win.document.createElement('div');
 
-    /** @private @const {!../../../src/service/localization.LocalizationService} */
-    this.localizationService_ = Services.localizationForDoc(element);
+    /** @private {?../../../src/service/localization.LocalizationService} */
+    this.localizationService_ = null;
 
     /** @private {?boolean} */
     this.storyPausedStateToRestore_ = null;
@@ -94,7 +94,9 @@ export class AmpStoryEducation extends AMP.BaseElement {
 
   /** @override */
   buildCallback() {
+    this.localizationService_ = Services.localizationForDoc(this.element);
     this.containerEl_.classList.add('i-amphtml-story-education');
+    toggle(this.element, false);
     toggle(this.containerEl_, false);
     this.startListening_();
     // Extra host to reset inherited styles and further enforce shadow DOM style
@@ -198,6 +200,7 @@ export class AmpStoryEducation extends AMP.BaseElement {
         this.storeService_.dispatch(Action.TOGGLE_EDUCATION, false);
         this.mutateElement(() => {
           removeChildren(this.containerEl_);
+          toggle(this.element, false);
           toggle(this.containerEl_, false);
           this.storeService_.dispatch(
             Action.TOGGLE_PAUSED,
@@ -270,6 +273,7 @@ export class AmpStoryEducation extends AMP.BaseElement {
 
     this.mutateElement(() => {
       removeChildren(this.containerEl_);
+      toggle(this.element, true);
       toggle(this.containerEl_, true);
       this.containerEl_.appendChild(template);
     });