/* Position SNS Mate as a dedicated operations team, without changing the visual system. */
.hero-lead{
  max-width:30em;
  margin:var(--space-5) 0 0;
  color:var(--ink-soft);
  font-size:var(--type-lead);
  font-weight:600;
  line-height:1.85;
  letter-spacing:.01em;
}
.hero-lead span{display:block}
.hero-subline{
  max-width:30em;
  margin:var(--space-3) 0 0;
  color:var(--gold-deep);
  font-size:15px;
  font-weight:800;
  line-height:1.6;
  letter-spacing:.02em;
}
.hero-actions{margin-top:var(--space-7)}
.mobile-copy-break,.mate-selector-mobile-break{display:none}

.hayate-role{width:400px;min-width:0;padding:13px 18px 15px}
.hayate-role .hayate-role-lead{
  margin-top:5px;
  color:#fff;
  font-size:14px;
  font-weight:900;
  letter-spacing:.035em;
}
.hayate-role .hayate-role-detail{
  max-width:300px;
  margin-top:6px;
  color:#c9d3de;
  font-size:12px;
  line-height:1.6;
  letter-spacing:.025em;
}

.mate-selector-head h2{
  margin:0;
  color:#fff;
  font-family:var(--serif);
  font-size:17px;
  line-height:1.45;
}

.hayate-definition{
  max-width:500px;
  margin:28px 0 0;
  color:#cbd4de;
  font-size:13px;
  line-height:1.95;
}
.hayate-definition strong{
  display:block;
  margin-bottom:10px;
  color:#fff;
  font-family:var(--serif);
  font-size:19px;
  line-height:1.55;
}
.hayate-definition span{display:block}

@media(max-width:720px){
  .mobile-copy-break,.mate-selector-mobile-break{display:block}
  .hero-lead{margin-top:var(--space-4);font-size:14px;line-height:1.75}
  .hero-lead span{display:block}
  .hero-subline{margin-top:var(--space-2);font-size:13px;line-height:1.65}
  .hero-actions{margin-top:var(--space-6)}
  .hayate-role{width:calc(100% - 24px);padding:10px 12px 11px}
  .hayate-role .hayate-role-lead{font-size:13px}
  .hayate-role .hayate-role-detail{max-width:258px;font-size:12px;line-height:1.45}
  .mate-selector-head h2{font-size:16px}
  .hayate-definition{margin-top:23px;font-size:12px;line-height:1.9}
  .hayate-definition strong{font-size:16px}
}