.about-page { flex: 1; }
.about-page h1, .about-page h2, .about-page h3 { font-family: var(--serif); color: var(--ink); font-weight: 500; }
.about-page h1 { font-size: 48px; line-height: 1.5; margin: 0 0 20px; }
.about-page h2 { font-size: 28px; line-height: 1.7; margin: 0; }
.about-page h3 { font-size: 20px; line-height: 1.7; margin: 0 0 12px; }
.about-page p { margin: 0 0 16px; }
.about-page p:last-child { margin-bottom: 0; }
.about-hero { position: relative; isolation: isolate; border-bottom: 1px solid var(--line); }
.about-hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1; }
.about-hero-inner { max-width: 1240px; margin: auto; min-height: 510px; padding: 52px 40px; display: flex; align-items: center; }
.about-hero-copy { width: 50%; }
.about-page .about-tagline { font: 500 27px/1.8 var(--serif); color: var(--ink); margin-bottom: 24px; }
.about-tagline .phrase, .about-intro .phrase { display: block; }
.about-intro { font-size: 16px; line-height: 1.95; }
.text-start { display: inline-flex; align-items: center; gap: 20px; min-height: 48px; margin-top: 10px; font-size: 16px; text-underline-offset: 7px; color: var(--green); }
.text-start:hover { text-decoration-thickness: 2px; }
.section-inner { max-width: 1160px; margin: auto; padding: 56px 40px; }
.editorial-row { display: grid; grid-template-columns: 235px minmax(0, 1fr); gap: 48px; }
.section-number { display: block; margin-bottom: 12px; font: 400 36px/1 var(--serif); color: #85719f; }
.section-title .phrase { display: block; }
.concept-inner { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 48px; align-items: start; padding-top: 42px; padding-bottom: 42px; }
.concept-inner .section-number { margin: 4px 0 0; }
.concept-copy { font-family: var(--serif); font-size: 19px; line-height: 2; }
.situations .section-inner, .reassurance .section-inner { border-top: 1px solid var(--line); }
.plain-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 0; list-style: none; }
.plain-columns > li { min-width: 0; }
.plain-columns > li + li { border-left: 1px solid var(--line); padding-left: 24px; }
.plain-columns p { font-size: 15px; line-height: 1.9; }
.about-page .section-note { font-size: 14px; line-height: 1.9; margin-top: 28px; }
.themes { background: var(--soft); }
.theme-list { list-style: none; padding: 0; margin: 0; }
.theme-list li { display: grid; grid-template-columns: 28px 150px minmax(0, 1fr); gap: 20px; padding: 20px 0; align-items: baseline; border-bottom: 1px solid var(--line); }
.theme-list li:first-child { padding-top: 0; }
.theme-list li:last-child { padding-bottom: 0; border-bottom: 0; }
.theme-number, .step-number { font: 400 24px/1.5 var(--serif); color: var(--ink); }
.theme-list h3 { margin: 0; }
.theme-list p { font-size: 15px; line-height: 1.9; }
.step-number { display: block; margin-bottom: 10px; }
.reassurance-list { margin: 0; }
.reassurance-list > div { padding: 20px 0; border-bottom: 1px solid var(--line); }
.reassurance-list > div:first-child { padding-top: 0; }
.reassurance-list > div:last-child { padding-bottom: 0; border: 0; }
.reassurance-list dt { font-size: 17px; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.reassurance-list dd { margin: 0; font-size: 15px; line-height: 1.95; }
.closing { background: #f3f1f7; text-align: center; }
.closing h2 { margin: 0 0 24px; }
.closing .btn-start { width: 360px; margin: 0 auto; text-align: left; }
.about-page .closing-note { font-size: 13px; margin-top: 10px; }
@media (max-width: 1100px) {
  .about-page h1 { font-size: 42px; }
  .about-page .about-tagline { font-size: 24px; }
  .about-intro { font-size: 15px; }
  .editorial-row { grid-template-columns: 190px minmax(0, 1fr); gap: 32px; }
  .plain-columns { grid-template-columns: 1fr; gap: 22px; }
  .plain-columns > li + li { padding-left: 0; border-left: 0; padding-top: 22px; border-top: 1px solid var(--line); }
  .theme-list li { grid-template-columns: 28px minmax(0, 1fr); gap: 6px 20px; }
  .theme-list p { grid-column: 2; }
}
@media (min-width: 761px) and (max-height: 700px) {
  .about-hero-inner { min-height: 420px; padding-top: 32px; padding-bottom: 32px; }
}
@media (max-width: 760px) {
  .about-page h1 { font-size: 34px; margin-bottom: 14px; }
  .about-page h2 { font-size: 25px; }
  .about-page h3 { font-size: 20px; }
  .about-hero { display: flex; flex-direction: column; }
  .about-hero-inner { width: 100%; min-height: 0; padding: 32px 24px 22px; }
  .about-hero-copy { width: 100%; }
  .about-page .about-tagline { font-size: 23px; line-height: 1.75; margin-bottom: 18px; }
  .about-intro { font-size: 15px; }
  .about-intro .phrase { display: inline; }
  .about-hero-image { position: relative; inset: auto; height: 180px; order: 2; object-position: right 65%; z-index: 0; }
  .text-start { gap: 12px; font-size: 15px; margin-top: 6px; }
  .section-inner { padding: 36px 24px; }
  .editorial-row, .concept-inner { grid-template-columns: 1fr; gap: 24px; }
  .concept-inner { gap: 14px; }
  .section-number { font-size: 28px; margin-bottom: 10px; }
  .section-title .phrase { display: inline-block; }
  .concept-copy { font-size: 18px; }
  .theme-list li { padding: 18px 0; }
  .closing .btn-start { font-size: 16px; padding: 14px 18px; gap: 12px; }
}
@media (max-width: 360px) {
  .about-page h1 { font-size: 31px; }
  .about-page .about-tagline { font-size: 21px; }
  .about-page h2 { font-size: 23px; }
  .closing .btn-start { font-size: 14px; }
}
@media (max-width: 760px) and (max-height: 650px) {
  .about-hero-inner { padding-top: 20px; padding-bottom: 14px; }
  .about-page h1 { margin-bottom: 8px; }
  .about-page .about-tagline { margin-bottom: 12px; }
  .about-hero-image { height: 105px; }
}