*{box-sizing:border-box}

html,body{
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  overflow:hidden;
  background:#000;
  font-family:Arial,Helvetica,sans-serif;
  font-weight:400;
}

body{
  cursor:default;
  -webkit-tap-highlight-color:transparent;
}

.site,.image-field{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
}

.image-field{
  overflow:hidden;
  background:#000;
}

.hero-image{
  position:absolute;
  inset:0;
  z-index:1;
}

.hero-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  user-select:none;
  -webkit-user-drag:none;
}

.stack{
  position:absolute;
  inset:0;
  z-index:10;
  pointer-events:none;
}

.card{
  position:absolute;
  overflow:hidden;
  width:34vw;
  max-width:560px;
  opacity:0;
  transform:translate3d(0,24px,0) scale(.985);
  transition:
    opacity 650ms cubic-bezier(.2,.7,.2,1),
    transform 850ms cubic-bezier(.2,.7,.2,1);
  box-shadow:0 12px 40px rgba(0,0,0,.18);
  cursor:default;
}

.card img{
  display:block;
  width:100%;
  height:auto;
  max-height:72vh;
  object-fit:contain;
  user-select:none;
  -webkit-user-drag:none;
  cursor:default;
}

.card.is-visible{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
}

.intro{
  position:fixed;
  z-index:100;
  top:50%;
  left:50%;
  width:min(92vw,720px);
  transform:translate(-50%,-50%);
  color:#fff;
  text-align:center;
  pointer-events:none;
  text-shadow:0 1px 8px rgba(0,0,0,.2);
}

.practice-name{
  margin:0 0 54px;
  font-size:60px;
  line-height:1.05;
  letter-spacing:0;
}

.contact{
  font-size:20px;
  line-height:1.35;
}

.contact div{
  margin:0;
}

.contact a{
  color:#fff;
  text-decoration:none;
  pointer-events:auto;
  cursor:pointer;
}

.contact .instagram{
  pointer-events:auto;
  cursor:pointer;
}

@media(max-width:700px){

  .practice-name{
    font-size:40px;
    margin-bottom:30px;
  }

  .contact{
    font-size:16px;
    line-height:1.32;
  }

  .card{
    width:64vw;
    max-width:360px;
  }

  .card img{
    max-height:64vh;
  }
}

@media(prefers-reduced-motion:reduce){

  .card{
    transition:opacity 300ms ease;
    transform:none;
  }

  .card.is-visible{
    transform:none;
  }
}
