/* Default. Values Change under 600px; */

.body {
    width: 90%; /* Adjust as needed */
    margin: 0 auto;
    text-align: center; /* Optionally centers text within the body */
background: #FFFFFF;

}

h1 {

  font-size: 8.0vw; 
  font-family: futura-pt, Helvetica Neue, Arial, Helvetica, sans-serif; 
  font-weight: 900; 
  letter-spacing: -0.11em; 
  text-transform: uppercase;
  margin-bottom: 0;
  margin-top: 0;
  line-height: 0.9;
background: #037EDC;
background: linear-gradient(to right, #037EDC 0%, #BD11DF 39%, #7C1DE9 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

h2 {

  font-size: 4.5vw; 
  font-family: futura-pt, Helvetica Neue, Arial, Helvetica, sans-serif; 
  font-weight: 700; 
  letter-spacing: -0.02em; 
  text-transform: none;
  margin-top: -2.05em;
  margin-bottom: -2.05em;
  padding-bottom: -2.05em;
  color: #343333;
  line-height: 1.2;
  text-align:center;

}

h3 {

  font-size: 2.5vw; 
  font-family: futura-pt, Helvetica Neue, Arial, Helvetica, sans-serif; 
  font-weight: 700; 
  letter-spacing: -0.04em; 
  text-transform: uppercase;
  margin-top: 5em;
  margin-bottom: 0;
  color: #B2B2B2;
  width: 80%;
  text-align: center;
  margin-left: 10%;
  opacity: 0; /* Invisible at the start */
  animation: fadeIn 2s forwards; /* 'forwards' keeps it visible at the end */
  animation-delay: 6s; /* Wait 6 seconds before starting */

}

/* Animation */

.line-1{
    position: relative;
    top: 40%;  
    width: 24em;
    margin: 0 auto;
    margin-top: 0.45em;
    font-size: 3.5vw;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    transform: translateY(-50%);  
    margin-bottom: -0.45em;
    padding-bottom: -0.45em; 
   
}

.anim-typewriter{
  animation: typewriter 1.5s steps(44) 1s 1 normal both,
             blinkTextCursor 500ms steps(44) infinite normal;
}
@keyframes typewriter{
  from{width: 0;}
  to{width: 20em;}
}
@keyframes blinkTextCursor{
  from{border-right-color: rgba(255,255,255,.75);}
  to{border-right-color: transparent;}
}


p {

  font-size:1vw; 
  font-family: Helvetica Neue, Arial, Helvetica, sans-serif; 
  font-weight: 400; 
  letter-spacing: .05em; 
  text-align: left;
  color: #242424;

}

p.top-index {

  font-size:1.5vw; 
  font-family: Helvetica Neue, Arial, Helvetica, sans-serif; 
  font-weight: 400; 
  letter-spacing: .05em; 
  text-align: left;
  color: #242424;
  display: grid;
  place-items: center; /* Centers horizontally and vertically */
  max-width: 70%;
  margin: auto;
  opacity: 0; /* Invisible at the start */
  animation: fadeIn 2s forwards; /* 'forwards' keeps it visible at the end */
  animation-delay: 3s; /* Wait 3 seconds before starting */
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.location {

  font-size: 4.0vw; 
  font-family: futura-pt, Helvetica Neue, Arial, Helvetica, sans-serif; 
  font-weight: 700; 
  letter-spacing: -0.04em; 
  text-transform: uppercase;
  margin-top: 0.5em;
  margin-bottom: 0;
  color: #841d1d;
  width: 80%;
  text-align: center;
  margin-left: 10%;
  opacity: 0; /* Invisible at the start */
  animation: fadeIn 2s forwards; /* 'forwards' keeps it visible at the end */
  animation-delay: 4s; /* Wait 3 seconds before starting */

}

.footer {
text-align: center; 
padding-top: 10em;
}