/* viktoriaibp.com: additions to the Webflow export.
   The three other stylesheets in this folder come from the export as the designer left it and
   were not changed in this build. Everything changed or added by hand lives here. */

/* 1. Montserrat, served from this site (SIL Open Font License 1.1, see fonts/OFL.txt).
      Replaces the Google Fonts loader, so no visitor data goes to Google for fonts. */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/montserrat-latin-ext-wght-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/montserrat-latin-wght-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* 2. Text selection. The export switched selection off for the whole page, which also
      stopped visitors from copying the email address. It now stays off only where
      dragging happens (the sliders) and on the round buttons. */
.w-slider,
.w-slider *,
.btn,
.btn * {
  -webkit-user-select: none;
  user-select: none;
}

/* 3. Booking fallback: a "Book a call" link in place of the calendar.
      Hidden while the Calendly calendar works. Shown when js/site.js adds .no-calendly to <html>
      (the calendar could not be loaded) and for visitors without JavaScript (no .w-mod-js). */
.calendly-fallback {
  display: none;
}

html.no-calendly .calendly-inline-widget,
html:not(.w-mod-js) .calendly-inline-widget {
  display: none;
}

html.no-calendly .calendly-fallback,
html:not(.w-mod-js) .calendly-fallback {
  grid-row-gap: 1vw;
  flex-flow: column;
  align-items: flex-start;
  padding-top: 5vw;
  display: flex;
}

.calendly-fallback .btn {
  margin: 1vw 0 0;
}

.calendly-fallback a:not(.btn) {
  color: var(--bold-text);
  font-weight: 600;
}

/* 4. Portrait tablets and very tall windows. The hero video and its dark overlay start below the
      menu bar but are as tall as the whole hero, so they stick out under it by the height of the
      menu bar. The stats row hides most of that; when the stats row is shorter than the menu bar,
      a dark strip showed below it. Giving the next section the page background hides the rest. */
.sint-section {
  background-color: var(--bg);
}

@media screen and (max-width: 479px) {
  /* 5. Phones with a short screen (in-app browsers such as LinkedIn's). The hero was fixed at one
        screen height while its content is taller, so the round button hung over the stats row.
        The hero is still at least one screen high, and now grows when its content needs more. */
  .hero._1 {
    height: auto;
    min-height: 100vh;
  }

  .background-video-mob {
    height: 100%;
  }

  /* 6. Calendly's snippet asks for at least 320px, which is wider than a 320px screen minus the
        page padding and made the page scroll sideways. */
  .calendly-inline-widget {
    min-width: 0 !important;
  }

  html.no-calendly .calendly-fallback,
  html:not(.w-mod-js) .calendly-fallback {
    grid-row-gap: 4vw;
    align-items: center;
    padding-top: 8vw;
  }

  .calendly-fallback .card-left-text {
    text-align: center;
  }

  .calendly-fallback .btn {
    margin: 4vw auto 0;
  }
}