:root{
  --blue: #0796d1;
  --blue-dark: #066ba3;
  --gray: #545454;
  --font-head: 'Sora', sans-serif;
  --font-body: 'Inter', sans-serif;
}
*,*::before,*::after{ box-sizing:border-box; }
body{
  margin:0;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--font-body);
  color:#fff;
  position:relative;
  overflow:hidden;
}
.bg{
  position:fixed; inset:0;
  background:url('../images/hero.jpg') center/cover;
  z-index:-2;
}
.bg::after{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(120deg, rgba(15,25,30,.9) 0%, rgba(7,150,209,.65) 100%);
}
.card{
  text-align:center;
  max-width:560px;
  padding:56px 40px;
  position:relative;
  z-index:1;
}
.logo{ height:340px; width:auto; margin-bottom:24px; }
.eyebrow{
  font-weight:600; letter-spacing:.02em; color:#cdeaf7;
  margin:0 0 10px; font-size:.95rem;
}
h1{
  font-family:var(--font-head);
  font-size:clamp(1.9rem,4vw,2.6rem);
  margin:0 0 16px;
  line-height:1.2;
}
p.lead{
  color:#eaf5fb;
  font-size:1.05rem;
  line-height:1.6;
  margin:0 0 32px;
}
.dots{ display:flex; gap:8px; justify-content:center; margin-bottom:32px; }
.dots span{
  width:8px; height:8px; border-radius:50%;
  background:#fff; opacity:.35; animation:pulse 1.4s infinite ease-in-out;
}
.dots span:nth-child(2){ animation-delay:.2s; }
.dots span:nth-child(3){ animation-delay:.4s; }
@keyframes pulse{
  0%,80%,100%{ opacity:.35; transform:scale(1); }
  40%{ opacity:1; transform:scale(1.3); }
}
.social{
  display:inline-flex; align-items:center; gap:10px;
  padding:12px 24px; border:1px solid rgba(255,255,255,.4);
  border-radius:4px; color:#fff; font-weight:600; font-size:.95rem;
  transition:background .15s ease, border-color .15s ease;
}
.social:hover{ background:var(--blue); border-color:var(--blue); }
.actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.btn-primary{
  display:inline-flex; align-items:center; gap:10px;
  padding:12px 24px; border-radius:4px; font-weight:700; font-size:.95rem;
  background:#fff; color:var(--blue-dark); transition:background .15s ease, transform .15s ease;
}
.btn-primary:hover{ background:#eaf6fc; }
.contact{
  margin-top:28px; font-size:.85rem; color:#d7ebf4;
}
.contact a{ color:#fff; text-decoration:underline; }
@media (prefers-reduced-motion: reduce){
  .dots span{ animation:none; opacity:.7; }
}