body .about-view .about-hero {
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.9fr);
  gap: 32px;
  padding: clamp(22px, 4vw, 48px);
  align-items: start;
}
body .about-view .about-hero h1 { font-size: clamp(2rem, 3.7vw, 3.25rem); line-height: 1.12; letter-spacing: -0.035em; }
body .about-view .homepage-trust { color: #155c4c; font-weight: 700; margin-top: 18px; }
body .about-view .homepage-disclaimer { font-size: 0.85rem; margin-top: 18px; }
.quick-target { padding: 24px; border-radius: 14px; border: 1px solid #cdded7; background: #f2f8f5; min-width: 0; }
body .about-view .quick-target h2 { font-size: 1.35rem; line-height: 1.35; margin-bottom: 12px; }
body .about-view .quick-target p { font-size: 0.85rem; line-height: 1.6; }
.quick-target-inputs { display: grid; gap: 8px; margin: 18px 0; }
.quick-target-inputs label { font-weight: 600; }
.quick-target-inputs input { width: 100%; min-width: 0; background: #fff; }
.quick-target-result output { display: block; color: #155c4c; font-size: clamp(1.6rem, 3vw, 2.2rem); font-weight: 750; overflow-wrap: anywhere; }
.homepage-benefits, .homepage-start, .homepage-wellbeing { padding: clamp(22px, 4vw, 40px); background: #fff; border: 1px solid #dbe5e1; border-radius: 16px; }
.homepage-benefits h2, .homepage-start h2, .homepage-wellbeing h2 { font-size: clamp(1.4rem, 2.4vw, 2rem); margin-bottom: 20px; }
.homepage-benefit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.homepage-benefit-grid h3 { font-size: 1.05rem; margin-bottom: 10px; }
.homepage-benefit-grid p, .homepage-start li, .homepage-start p, .homepage-wellbeing p { color: #526575; line-height: 1.7; }
.homepage-start ol { padding-left: 22px; margin: 0 0 24px; }
.homepage-start li + li { margin-top: 12px; }
.homepage-start p { font-size: 0.85rem; margin-top: 12px; }
.homepage-wellbeing a { display: inline-block; margin-top: 12px; }
@media (max-width: 800px) {
  body .about-view .about-hero, .homepage-benefit-grid { grid-template-columns: minmax(0, 1fr); }
  .quick-target { padding: 20px; }
}

.homepage-tool { display: grid; gap: 24px; min-width: 0; }
.homepage-intro h1 { font-size: clamp(2rem, 4vw, 3rem); margin-bottom: 12px; }
.homepage-intro p { color: #526575; line-height: 1.7; }
.homepage-choices { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.homepage-choices a { padding: 10px 18px; border: 1px solid #cdded7; border-radius: 8px; background: #fff; color: #155c4c; font-weight: 650; }
.homepage-tool, .homepage-wellbeing { scroll-margin-top: 100px; }
.homepage-tool-heading { font-size: clamp(1.6rem, 3vw, 2.3rem); margin: 0; }
body .about-view .about-hero h3 { font-size: clamp(1.8rem, 3.7vw, 3rem); line-height: 1.15; margin-bottom: 20px; }
.homepage-guide { padding: clamp(22px, 4vw, 40px); border: 1px solid #dbe5e1; background: #fff; border-radius: 16px; }
.homepage-guide h2 { color: #132644; font-size: clamp(1.4rem, 2.4vw, 2rem); line-height: 1.3; margin-bottom: 20px; }
.homepage-guide p { color: #526575; line-height: 1.7; margin: 12px 0; }
.homepage-guide a { display: inline-block; color: #155c4c; font-weight: 700; line-height: 1.6; margin-top: 8px; text-decoration: underline; text-underline-offset: 3px; }
.homepage-guide a:focus-visible { outline: 2px solid #155c4c; outline-offset: 4px; }
.homepage-wellbeing { border-top: 4px solid #16705b; }
@media (max-width: 800px) {
  body .mobile-tab-bar { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  body .mobile-tab-bar a { font-size: 0.68rem; }
}
