@font-face{font-family:"Poppins";src:url("../assets/fonts/poppins-light.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap;}
@font-face{font-family:"Poppins";src:url("../assets/fonts/poppins-regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Poppins";src:url("../assets/fonts/poppins-medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap;}

:root{
  --navy:#071a33;
  --blue:#38b1f4;
  --muted:#5c6b7c;
  --hair:#e7ebef;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box;}

html,body{
  margin:0; padding:0; width:100%; min-height:100%;
  background:#ffffff;
  font-family:"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important; transition-duration:.001ms !important;}
}

.page{
  min-height:100vh;
  min-height:100svh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:8vh 6vw;
}

.card{
  width:100%;
  max-width:620px;
  text-align:center;
  opacity:0;
  transform:translateY(14px);
  animation:rise .9s var(--ease) forwards;
  animation-delay:.05s;
}

@keyframes rise{
  to{ opacity:1; transform:translateY(0); }
}

.logo{
  width:clamp(150px, 22vw, 210px);
  height:auto;
  margin:0 auto clamp(48px, 8vh, 72px);
  display:block;
}

.headline{
  margin:0 0 22px;
  color:var(--navy);
  font-weight:400;
  font-size:clamp(24px, 3.4vw, 34px);
  line-height:1.35;
  letter-spacing:.002em;
}

.lede{
  margin:0 auto;
  max-width:480px;
  color:var(--muted);
  font-weight:300;
  font-size:clamp(15px, 1.6vw, 17px);
  line-height:1.75;
}

.divider{
  width:44px;
  height:1px;
  background:var(--hair);
  margin:clamp(40px, 6vh, 56px) auto;
}

.assist{
  margin:0 auto 34px;
  max-width:440px;
  color:var(--muted);
  font-weight:300;
  font-size:clamp(14px, 1.4vw, 15.5px);
  line-height:1.7;
}

.contacts{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:14px clamp(28px, 5vw, 56px);
}

.contact{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  text-decoration:none;
  padding:4px 2px;
}

.contact__label{
  color:var(--muted);
  font-weight:400;
  font-size:11.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.contact__value{
  color:var(--navy);
  font-weight:500;
  font-size:clamp(15.5px, 1.7vw, 17px);
  letter-spacing:.01em;
  position:relative;
}

.contact__value::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-3px;
  height:1px;
  background:var(--blue);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .35s var(--ease);
}

.contact:hover .contact__value::after,
.contact:focus-visible .contact__value::after{
  transform:scaleX(1);
}

.contact:focus-visible{
  outline:2px solid var(--blue);
  outline-offset:6px;
  border-radius:2px;
}

.sep{
  width:1px;
  height:34px;
  background:var(--hair);
}

@media (max-width:520px){
  .sep{ display:none; }
  .contacts{ flex-direction:column; gap:26px; }
}