
.hero{
  min-height:calc(100vh - 64px);
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  padding:60px 24px 80px;position:relative;
}
.hero-eyebrow{
  font-size:0.75rem;letter-spacing:4px;text-transform:uppercase;
  color:var(--accent2);margin-bottom:20px;font-weight:500;
  opacity:0;animation:fade-up 0.8s 0.2s forwards;
}
.hero-title{
  font-family:var(--font-display);
  font-size:clamp(2.8rem,8vw,6.5rem);line-height:1.0;font-weight:700;
  color:var(--text);margin-bottom:18px;
  opacity:0;animation:fade-up 0.8s 0.4s forwards;
}
.hero-title em{font-style:normal;color:var(--accent);display:block;}
.hero-sub{
  font-size:clamp(1rem,2vw,1.25rem);color:var(--text2);font-weight:300;
  max-width:520px;line-height:1.7;margin-bottom:40px;
  opacity:0;animation:fade-up 0.8s 0.6s forwards;
}
.hero-actions{
  display:flex;gap:14px;flex-wrap:wrap;justify-content:center;
  opacity:0;animation:fade-up 0.8s 0.8s forwards;
}
.btn-ip{
  display:flex;align-items:center;gap:10px;padding:14px 28px;border-radius:40px;
  background:var(--accent);color:#fff;font-size:1rem;font-weight:600;letter-spacing:0.5px;
  border:none;box-shadow:0 4px 24px color-mix(in srgb, var(--accent) 35%, transparent);
  position:relative;overflow:hidden;transition:filter 0.2s,transform 0.15s;
}
.btn-ip:hover{filter:brightness(1.1);transform:scale(1.02);}

@keyframes fade-up{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}

.scroll-cue{
  position:absolute;bottom:32px;display:flex;flex-direction:column;align-items:center;gap:6px;
  color:var(--text2);font-size:0.72rem;letter-spacing:2px;text-transform:uppercase;
  animation:bob 2s ease-in-out infinite;
}
@keyframes bob{0%,100%{transform:translateY(0);}50%{transform:translateY(6px);}}
.scroll-cue::after{content:'↓';font-size:1.2rem;}
