.about-page { min-height: 100vh; background: #fff; color: #17324a; }
.about-nav { background: #fff; border-bottom-color: #d5e1ea; }
.about-nav .wordmark b { color: #12304a; }
.about-nav .wordmark small { color: #557087; }
.about-nav .nav-wa { margin-left: auto; background: #12304a; color: #fff; }
.about-main { max-width: 1180px; margin: auto; padding: 46px 5vw 90px; }
.about-back { display: inline-block; margin-bottom: 38px; color: #c92d35; font-size: 11px; font-weight: 700; }
.about-hero { max-width: 760px; padding-bottom: 58px; border-bottom: 1px solid #d5e1ea; }
.about-hero h1 { margin: 0; color: #12304a; font: 700 clamp(68px, 10vw, 132px)/.76 'Barlow Condensed'; text-transform: uppercase; }
.about-hero h1 i { color: #c92d35; font-style: normal; }
.about-hero > p:last-child { max-width: 530px; margin: 25px 0 0; color: #45637b; font-size: 14px; line-height: 1.7; }
.about-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 28px; }
.about-card { padding: 28px; border: 1px solid #d5e1ea; background: #edf5fb; }
.about-card--notice { border-top: 4px solid #c92d35; background: #fffaf0; }
.about-card__label { margin: 0 0 18px; color: #c99a35; font-size: 10px; font-weight: 700; letter-spacing: .16em; }
.about-card h2 { margin: 0 0 18px; color: #12304a; font: 700 39px/.85 'Barlow Condensed'; text-transform: uppercase; }
.about-card p { margin: 0 0 14px; color: #345872; font-size: 12px; line-height: 1.7; }
.about-card p:last-child { margin-bottom: 0; }
.about-card a { color: #c92d35; font-weight: 700; }
.about-contact { display: flex; justify-content: space-between; align-items: center; gap: 25px; margin-top: 28px; padding: 23px 25px; border-left: 4px solid #c99a35; background: #12304a; color: #fff; }
.about-contact strong { font-size: 14px; }
.about-contact p { margin: 7px 0 0; color: #dce8f0; font-size: 12px; }
.about-contact a { flex: 0 0 auto; color: #f0c75e; font-size: 11px; font-weight: 700; }
.about-footer { margin-top: 0; }
.about-footer .footer__bottom { color: #fff; }
.about-footer .footer__bottom a { color: #f0c75e; }
@media (max-width: 760px) {
  .about-main { padding: 30px 20px 70px; }
  .about-nav { padding: 15px 20px; }
  .about-nav .nav-wa { max-width: 44px; overflow: hidden; padding: 11px 12px; font-size: 0; white-space: nowrap; }
  .about-nav .nav-wa span { font-size: 17px; }
  .about-hero { padding-bottom: 42px; }
  .about-hero h1 { font-size: clamp(64px, 18vw, 88px); }
  .about-grid { grid-template-columns: 1fr; }
  .about-card { padding: 22px; }
  .about-card h2 { font-size: 35px; }
  .about-contact { display: block; padding: 20px; }
  .about-contact a { display: inline-block; margin-top: 16px; }
}