/* index.css — TOP page v3 */

/* ── Hero ─────────────────────────────────────────────── */
.hero{position:relative;overflow:hidden;width:100%;font-size:0;line-height:0;}
.hero-bg{
  width:100%;height:640px;
  object-fit:cover;object-position:50% 38%;display:block;
}
.hero-scrim{
  position:absolute;inset:0;
  background:
    linear-gradient(115deg,
      rgba(10,15,30,.88) 0%,
      rgba(21,87,208,.60) 48%,
      rgba(77,142,245,.15) 80%,
      transparent 100%
    ),
    linear-gradient(to bottom,
      transparent 55%,
      rgba(10,15,30,.35) 100%
    );
}
.hero-inner{
  position:absolute;inset:0;
  display:flex;flex-direction:column;justify-content:center;
  font-size:15px;line-height:1.8;
}
.hero-inner-content{
  max-width:var(--CW);margin:0 auto;
  padding:0 var(--PX);width:100%;
}

.hero-kicker{
  font-family:var(--mon);font-size:10px;
  color:rgba(77,142,245,.85);
  letter-spacing:.26em;text-transform:uppercase;
  display:flex;align-items:center;gap:10px;
  margin-bottom:24px;
}
.hero-kicker::before{
  content:'';display:block;
  width:20px;height:1.5px;background:#7FD6FF;
}

.hero-h1{
  font-family:var(--ser);
  font-size:58px;font-weight:700;
  color:var(--W);line-height:1.16;
  max-width:680px;margin-bottom:16px;
  letter-spacing:-.03em;
}
.hero-h1 em{font-style:normal;color:#7FD6FF;}

.hero-sub{
  font-size:15.5px;color:rgba(255,255,255,.6);
  line-height:1.9;max-width:460px;margin-bottom:36px;
}
.hero-sub strong{color:rgba(255,255,255,.92);font-weight:700;}

.hero-btns{display:flex;gap:14px;align-items:center;}
.btn-hero-fill{
  display:inline-flex;align-items:center;gap:9px;
  background:var(--A);color:var(--W);
  font-size:14.5px;font-weight:700;
  padding:15px 30px;border-radius:var(--r1);
  letter-spacing:.05em;
  transition:background .2s,transform .15s;
}
.btn-hero-fill:hover{background:var(--AH);transform:translateY(-2px);}

.btn-hero-ghost{
  display:inline-flex;align-items:center;gap:8px;
  border:1.5px solid rgba(255,255,255,.32);color:var(--W);
  font-size:14px;font-weight:500;
  padding:14px 22px;border-radius:var(--r1);
  letter-spacing:.04em;
  transition:border-color .2s,background .2s;
}
.btn-hero-ghost:hover{border-color:rgba(255,255,255,.72);background:rgba(255,255,255,.06);}

/* Mobile */
@media(max-width:768px){
  .hero-bg{height:480px;}
  .hero-inner-content{padding:0 var(--PX-SP);}
  .hero-h1{font-size:32px;letter-spacing:-.02em;}
  .hero-sub{font-size:13.5px;}
  .hero-btns{flex-direction:column;align-items:stretch;}
  .btn-hero-fill,.btn-hero-ghost{justify-content:center;}
}