/* Introductory video and contact interface. */
.intro{
  background:var(--softwood);
  padding-block:clamp(60px,5vw,72px) clamp(32px,5vw,64px);
}
.intro__inner{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  max-width:calc(var(--wrap) + 120px);
  margin-inline:auto;
  padding-inline:var(--gut);
}
.intro__eyebrow{
  margin:0 0 20px;padding:10px 28px;border-radius:999px;
  background:var(--ink);color:var(--lime);text-align:center;
  font:var(--type-label-sm);letter-spacing:var(--type-label-sm-ls);
  text-transform:uppercase;
}
.intro__media{
  position:relative;width:100%;aspect-ratio:16/9;
  overflow:hidden;border-radius:var(--r-lg);background:var(--ink);
}
.intro__video{display:block;width:100%;height:100%;object-fit:contain}
.intro__play{
  display:none;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:clamp(64px,8vw,96px);height:clamp(64px,8vw,96px);
  padding:0;border:0;border-radius:50%;background:var(--lime);color:var(--softwood);
  cursor:pointer;place-items:center;
}
.intro__play svg{width:38%;height:38%;margin-left:5%}
.intro__play:hover{background:#c4fa52}
.intro__play.is-visible{display:grid}
.intro__form{
  width:100%;max-width:660px;margin:24px 0 0;padding:26px 30px;
  border-radius:var(--r);background:var(--paper);color:var(--softwood);
}
.intro__title{font:700 clamp(24px,2.5vw,30px)/1.15 var(--font-sans);letter-spacing:-.02em}
.intro__description{margin:6px 0 18px;font:var(--type-body)}
.intro__field{display:block;margin-top:10px;font:500 var(--fs-body)/1.4 var(--font-sans)}
.intro__input{
  display:block;width:100%;min-width:0;min-height:48px;margin-top:4px;padding:10px 18px;
  border:1px solid var(--iron);border-radius:10px;background:var(--white);
  color:var(--softwood);font:400 var(--fs-body)/1.4 var(--font-sans);
}
.intro__input::placeholder{color:var(--stormcloud);opacity:1}
.intro__submit{width:100%;margin-top:24px;font-weight:700}
@media(max-width:640px){
  .intro__title{font-size:24px;line-height:1.15}
  .intro__eyebrow{padding:9px 14px;font-size:var(--fs-caps)}
  .intro__media{border-radius:var(--r)}
  .intro__form{padding:24px 20px}
}

.intro__phone{
  display:grid;
  grid-template-columns:minmax(0,140px) minmax(0,1fr);
  gap:8px;
}
.intro__country{padding-inline:8px}
@media(max-width:640px){
  .intro__phone{grid-template-columns:110px minmax(0,1fr)}
  .intro__phone input{padding-inline:10px}
}
