/* White title bands and a prominent coral CTA, inspired by the supplied reference. */
.motto-hero{--hero-coral:#c3475b;--hero-ink:#263c43;min-height:850px;color:#fff}
.motto-hero .hero-content{width:min(1180px,calc(100% - 120px));padding-top:clamp(135px,17vh,195px);padding-bottom:100px}
.hero-message{width:550px;max-width:100%}
.hero-kicker{font-size:13px;font-weight:700;letter-spacing:.12em;margin:0 0 17px;text-shadow:0 1px 8px #0008}
.motto-hero h1{display:flex;align-items:flex-start;flex-direction:column;gap:8px;font-family:'Zen Kaku Gothic Antique','Noto Sans JP',sans-serif;font-size:42px;font-weight:700;line-height:1.35;letter-spacing:.025em;margin:0 0 20px}
.hero-title-line{display:block;width:max-content;max-width:100%;padding:4px 15px 7px;background:#fff;color:var(--hero-ink)}
.motto-hero .hero-title-emphasis{font-family:'Noto Sans JP','Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;font-size:68px;font-weight:700;color:#fff;background:linear-gradient(100deg,#2EC4B6 0%,#4C8DFF 100%);font-style:normal;letter-spacing:.015em;padding:4px 18px 9px;line-height:1.3;white-space:nowrap}
.motto-hero .hero-subtitle{display:flex;flex-direction:column;align-items:flex-start;gap:5px;font-size:16px;line-height:1.65;letter-spacing:.055em;font-weight:700;margin:0 0 23px}
.motto-hero .hero-subtitle>span{background:#294a56;padding:2px 10px 3px;box-decoration-break:clone}
.hero-highlights{display:flex;gap:16px;align-items:center;margin:0 0 17px}
.hero-highlight{display:flex;flex-direction:column;align-items:center;justify-content:center;width:126px;height:126px;flex:0 0 126px;border-radius:50%;background:#fffffff5;color:var(--hero-ink);border:1px solid #ebd5b3;box-shadow:0 3px 14px #0001;line-height:1.45;letter-spacing:.02em}
.hero-highlight>span{font-size:10px;font-weight:700}
.hero-highlight strong{display:flex;align-items:baseline;gap:3px;font-family:Georgia,serif;font-size:46px;line-height:1.25;font-weight:400;letter-spacing:-.04em}
.hero-highlight strong small{font-family:'Noto Sans JP',sans-serif;font-size:12px;font-weight:700;letter-spacing:0}
.hero-highlight-support{border-color:#dba6af}
.hero-highlight-support strong{color:var(--hero-coral)}
.hero-tools{display:inline-block;background:#fff;color:var(--hero-ink);padding:3px 10px;margin:0 0 28px;font-size:13px;font-weight:700;line-height:1.7;letter-spacing:.035em}
.hero-tools>span{color:#8b9da1;margin-inline:2px}
.motto-hero .hero-actions{align-items:flex-start;gap:9px}
.hero-cta-wrap{position:relative;width:460px;max-width:100%;padding-top:11px}
.hero-cta-note{position:absolute;z-index:3;left:50%;top:0;transform:translateX(-50%);display:block;white-space:nowrap;border:1.5px solid var(--hero-coral);border-radius:99px;background:#fff;color:var(--hero-coral);font-size:11px;font-weight:700;line-height:1.7;padding:3px 15px;letter-spacing:.035em}
.motto-hero .hero-primary{display:flex;justify-content:center;gap:30px;width:100%;min-width:0;min-height:73px;border-radius:6px;padding:19px 25px 14px;background:var(--hero-coral);color:#fff;border:1px solid var(--hero-coral);font-size:18px;font-weight:700;box-shadow:0 5px 0 #8e3040;letter-spacing:.04em}
.motto-hero .hero-primary:hover{background:#aa3549;border-color:#aa3549}
.hero-secondary{display:flex;align-items:center;justify-content:center;gap:18px;width:460px;max-width:100%;min-height:39px;font-size:12px;font-weight:700;text-shadow:0 1px 8px #000a;text-decoration:underline;text-underline-offset:5px}
.hero-secondary:hover{text-decoration-thickness:2px}
.hero-footnote{font-size:9px;line-height:1.6;text-shadow:0 1px 5px #000c;letter-spacing:.02em;margin:2px 0 0}
.motto-hero a:focus-visible,.motto-hero button:focus-visible{outline:3px solid #fff;outline-offset:5px}
@media(min-width:1600px){.motto-hero .hero-content{padding-top:18vh}.motto-hero h1{font-size:44px}}
@media(max-width:1150px){.motto-hero .hero-content{width:calc(100% - 80px)}.hero-message{width:500px}.motto-hero h1{font-size:38px}}
@media(max-width:700px){
  .motto-hero{height:auto;min-height:max(820px,100svh);max-height:none}
  .motto-hero .hero-content{width:calc(100% - 40px);padding-top:155px;padding-bottom:88px}
  .hero-message{width:100%}
  .hero-kicker{font-size:10px;margin-bottom:13px;letter-spacing:.08em}
  .motto-hero h1{font-size:clamp(23px,6.7vw,38px);gap:7px;margin-bottom:17px;letter-spacing:0}
  .hero-title-line{padding:4px 10px 6px}
  .motto-hero .hero-title-emphasis{font-size:clamp(36px,11.8vw,64px);padding:4px 12px 8px}  .motto-hero .hero-subtitle{font-size:clamp(11px,3.25vw,16px);gap:4px;margin-bottom:21px;letter-spacing:.025em}
  .motto-hero .hero-subtitle>span{padding:3px 7px}
  .hero-highlights{gap:10px;margin-bottom:17px}
  .hero-highlight{width:96px;height:96px;flex-basis:96px}
  .hero-highlight>span{font-size:8px}
  .hero-highlight strong{font-size:36px}
  .hero-highlight strong small{font-size:10px}
  .hero-tools{font-size:11px;padding:3px 7px;margin-bottom:26px}
  .hero-cta-wrap,.hero-secondary{width:100%}
  .hero-cta-note{font-size:10px;padding-inline:11px}
  .motto-hero .hero-primary{width:100%;min-width:0;font-size:16px;min-height:68px;padding-inline:15px;gap:15px}
  .hero-secondary{font-size:11px;min-height:40px}
  .hero-footnote{font-size:8px}
}
@media(max-width:360px){.motto-hero .hero-content{width:calc(100% - 32px)}.hero-highlights{gap:7px}.hero-highlight{width:90px;height:90px;flex-basis:90px}.hero-highlight>span{font-size:7.5px}.hero-cta-note{font-size:9px}}
