/* Only what the vendored original stylesheets do not already provide.
 * Everything else (typography, colours, grid, menu, pricing, footer) comes
 * verbatim from the site's own CSS, so it needs no restating here.
 *
 * This file replaces revolution/css/settings.css for the hero. All numbers
 * below were measured off the archived page at 1425x790:
 *   grid 1170x790 | dwell 9s | Ken Burns scale 1 -> 1.2 over 10s
 *   headline  70/90  Raleway 600, right-aligned, nowrap, centre +20px
 *   desc      20/40  Open Sans 400, nowrap,               centre +90px
 *   button    16px, padding 12/35, radius 3px, #277a7a,   centre +142px
 *   arrows    70x70 circle, rgba(0,0,0,.5), inset 20px, vertically centred
 * The headline and description really are `nowrap` and really do clip at both
 * edges on the original -- that is reproduced here, not fixed.
 */

.rs-hero {
  position: relative;
  width: 100%;
  /* 790/1170 = 67.5214vw: matches Slider Revolution fullwidth scaling */
  height: min(790px, 67.5214vw);
  overflow: hidden;
  background: #000;
  outline: none;
}

.rs-slide {
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .75s ease-in-out, visibility 0s linear .75s;
}
.rs-slide.is-active {
  opacity: 1;
  visibility: visible;
  z-index: 2;
  transition: opacity .75s ease-in-out, visibility 0s;
}

.rs-slide__bg {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  transform-origin: 0 0;
}
.rs-slide.is-active .rs-slide__bg { animation: rs-kenburns 10s linear forwards; }

@keyframes rs-kenburns {
  from { transform: scale(1); }
  to   { transform: scale(1.2); }
}

.rs-layers {
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  z-index: 3;
}
.rs-layers > * {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 0;
  color: #fff;
  white-space: nowrap;
}

.rs-headline {
  transform: translate(-50%, -50%) translateY(min(20px, 1.7094vw));
  font-family: 'Raleway', sans-serif;
  font-size: min(70px, 5.9829vw);
  line-height: min(90px, 7.6923vw);
  font-weight: 600;
  text-align: right;
  letter-spacing: 0;
}

.rs-desc {
  transform: translate(-50%, -50%) translateY(min(90px, 7.6923vw));
  font-family: 'Open Sans', sans-serif;
  font-size: min(20px, 1.7094vw);
  line-height: min(40px, 3.4188vw);
  font-weight: 400;
}

.rs-cta {
  transform: translate(-50%, -50%) translateY(min(142px, 12.1368vw));
  font-family: 'Open Sans', sans-serif;
  font-size: min(16px, 1.3675vw);
  line-height: 24px;
  font-weight: 400;
  padding: min(12px, 1.0256vw) min(35px, 2.9915vw);
  border-radius: 3px;
  text-decoration: none;
  cursor: pointer;
}
.rs-cta:hover, .rs-cta:focus { color: #fff; text-decoration: none; }

/* "erinyen" arrows. The revicons webfont was never archived, so the chevron
   is drawn as inline SVG at the same 20px optical size. */
.rs-arrow {
  position: absolute;
  top: 50%;
  margin-top: -35px;
  width: 70px;
  height: 70px;
  border: 0;
  padding: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, .5);
  color: #fff;
  cursor: pointer;
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .3s;
}
.rs-arrow:hover, .rs-arrow:focus { background: var(--temarenk); outline: none; }
.rs-arrow svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.5; }
.rs-arrow-left  { left: 20px; }
.rs-arrow-right { right: 20px; }

@media (max-width: 767px) {
  .rs-arrow { width: 44px; height: 44px; margin-top: -22px; }
  .rs-arrow svg { width: 14px; height: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .rs-slide, .rs-slide.is-active { transition: none; }
  .rs-slide.is-active .rs-slide__bg { animation: none; }
}

/* Static-copy notice shown when a form would have posted to the old backend. */
.form-notice { font-size: 13px; line-height: 20px; margin: 0; }