/*!*********************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[2].use[3]!./src/scss/reveal.scss ***!
  \*********************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
/*
 * Anything that pops: a drop-down, a popover, a panel that is there before it is
 * wanted. One pair of mixins for the whole theme, so a country list and a menu
 * arrive and leave the same way.
 *
 *   .panel          { @include popover; }
 *   .is-open .panel { @include popover-open; }
 *
 * Three decisions worth knowing before overriding any of it:
 *
 * `visibility` carries the exit. It is what keeps a closed panel out of the tab
 * order, and transitioning it means the panel stays on screen until the fade has
 * finished instead of vanishing on the first frame. `display: none` cannot do
 * that without `transition-behavior: allow-discrete`, which the W3C validator
 * still reports as an error.
 *
 * Leaving is quicker than arriving. The exit duration lives on the closed state
 * and the open state overrides it — a transition is read from the state being
 * moved *to*, so this is what makes the two directions differ without a second
 * selector.
 *
 * Only opacity and transform move, so neither direction costs layout.
 */
/*
 * Entrances are slower than interface transitions on purpose — something
 * arriving from off screen needs the distance — so they have their own named
 * set here rather than literals scattered through the file. Where a value is
 * already on the theme's scale it is the token, not a copy of its number.
 */
/*
 * Entrance system. Mark anything with `data-reveal` and reveal.ts brings it in
 * on scroll.
 *
 * The failsafe matters: a visitor whose JavaScript never arrives would be left
 * staring at a page of invisible elements, so the stylesheet uncovers them on
 * its own after four seconds — but only while the script has not announced
 * itself with .has-reveal-js.
 */
[data-reveal] {
  opacity: 0;
  transform: translateY(2.5rem) scale(0.985);
}

.reveal-word {
  display: inline-block;
  opacity: 0;
  transform: translateY(0.5em);
}

/* Rows: the container is marked, the children are found at run time. */
[data-reveal-stagger] > * {
  opacity: 0;
  transform: translateY(2rem) scale(0.985);
}

:root:not(.has-reveal-js) [data-reveal],
:root:not(.has-reveal-js) [data-reveal-stagger] > *,
:root:not(.has-reveal-js) .reveal-word {
  animation: reveal-failsafe 600ms ease 4s forwards;
}

[data-reveal].is-revealed {
  opacity: 1;
  transform: none;
  animation: none;
  transition: opacity 800ms cubic-bezier(0.22, 1, 0.36, 1), transform 800ms cubic-bezier(0.22, 1, 0.36, 1);
}

[data-reveal-stagger] > .is-revealed {
  opacity: 1;
  transform: none;
  animation: none;
  transition: opacity 700ms cubic-bezier(0.22, 1, 0.36, 1), transform 700ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* Words carry their own rise, so a line reads as it assembles rather than
   arriving all at once. */
.reveal-word.is-revealed {
  opacity: 1;
  transform: none;
  animation: none;
  transition: opacity 620ms cubic-bezier(0.22, 1, 0.36, 1), transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

/*
 * `rise` starts below the fold and glides up into place. The distance is a slice
 * of the viewport rather than a pixel count, so it reads as coming from
 * off-screen on a laptop and on a phone alike, and the long decelerating curve
 * keeps a travel that far from looking like a jump.
 */
[data-reveal=rise] {
  transform: translateY(min(46vh, 28.75rem));
}

[data-reveal=rise].is-revealed {
  transition: opacity 900ms cubic-bezier(0.16, 1, 0.3, 1), transform 1200ms cubic-bezier(0.16, 1, 0.3, 1);
}

/*
 * `rise-solid` is the same travel with the fade left out, for the element that
 * is the page's largest paint — the hero picture. A browser does not count an
 * element at `opacity: 0` as painted, so fading the hero in means the Largest
 * Contentful Paint is not recorded until the animation runs: the metric ends up
 * measuring the animation rather than the loading. Moving alone keeps the
 * picture on screen from the first frame and still arrives.
 */
[data-reveal=rise-solid] {
  opacity: 1;
  transform: translateY(min(28vh, 17.5rem));
}

[data-reveal=rise-solid].is-revealed {
  transform: none;
  transition: transform 1200ms cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes reveal-failsafe {
  to {
    opacity: 1;
    transform: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-reveal],
  [data-reveal-stagger] > *,
  .reveal-word {
    opacity: 1;
    transform: none;
    animation: none;
    transition: none;
  }
}

/*# sourceMappingURL=reveal.css.map*/