:root { --fee-blue: #156ba3; --fee-blue-deep: #0c4269; --fee-accent: #176b87; --fee-sky: #eaf6fd; --fee-line: #cce2f0; --fee-ink: #163246; --fee-orange: #ef7d2d; }
.fee-hero { position: relative; min-height: 640px; display: grid; overflow: hidden; background: #dceef8; }
.fee-hero__image, .fee-hero__shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.fee-hero__image { object-fit: cover; object-position: center center; }
.fee-hero__shade { background: linear-gradient(90deg, rgba(255,255,255,.98) 0%, rgba(247,252,255,.94) 34%, rgba(240,249,254,.68) 52%, rgba(255,255,255,.06) 74%); }
.fee-hero__inner { position: relative; z-index: 1; padding-top: 34px; padding-bottom: 72px; display: flex; flex-direction: column; }
.fee-hero .breadcrumbs { margin: 0 0 auto; }
.fee-hero__copy { max-width: 590px; padding-top: 64px; color: var(--fee-ink); }
.fee-kicker { margin: 0 0 14px; color: var(--fee-blue); font-size: 13px; font-weight: 800; letter-spacing: .1em; }
.fee-hero h1 { margin: 0; color: var(--fee-blue-deep); font-size: clamp(42px, 5vw, 68px); line-height: 1.2; letter-spacing: -.03em; }
.fee-hero h1 em { color: var(--fee-orange); font-style: normal; }
.fee-hero__lead { margin: 24px 0 12px; color: var(--fee-blue-deep); font-size: clamp(21px, 2.2vw, 29px); font-weight: 800; line-height: 1.5; }
.fee-hero__copy > p:last-child { max-width: 550px; margin: 0; font-size: 14px; line-height: 2; }
.fee-section { padding: 96px 0; }
#reason { padding-top: 48px; }
.fee-section--tint { background: linear-gradient(180deg, #f4faff, #eaf6fd); }
.fee-media { display: grid; grid-template-columns: minmax(0,1.06fr) minmax(0,.94fr); gap: clamp(48px,6vw,88px); align-items: center; }
.fee-media--reverse .fee-photo { order: 2; }
.fee-photo { margin: 0; overflow: hidden; background: #eaf6fd; border-radius: 6px 36px 6px 6px; box-shadow: 0 18px 48px rgba(19,83,126,.14); }
.fee-media--reverse .fee-photo { border-radius: 36px 6px 6px 6px; }
.fee-photo img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.fee-photo figcaption { padding: 12px 18px; color: #587286; background: #fff; font-size: 11px; }
#costs .fee-photo figcaption { color: var(--fee-accent); font-weight: 700; }
.fee-copy h2, .fee-heading h2, .fee-life h2, .fee-contact h2 { margin: 0 0 24px; color: var(--fee-blue-deep); font-size: clamp(29px,3.3vw,45px); line-height: 1.4; letter-spacing: -.02em; }
#about .fee-copy h2, #reason .fee-heading h2, #estimate .fee-heading h2, #costs .fee-copy h2, #support .fee-heading h2 { color: var(--fee-accent); }
.fee-copy p, .fee-heading p, .fee-life p, .fee-contact p { font-size: 15px; line-height: 2; }
.fee-highlight { margin-top: 28px; padding: 22px 24px; display: grid; gap: 5px; background: #f1f9fe; border-left: 4px solid var(--fee-orange); border-radius: 4px; }
.fee-highlight strong { color: var(--fee-blue-deep); font-size: 21px; }
.fee-highlight span { color: #527087; font-size: 12px; }
.fee-heading { max-width: 800px; margin-bottom: 48px; }
.fee-heading--center { margin-right: auto; margin-left: auto; text-align: center; }
.fee-diagram-scroll { max-width: 1200px; margin: 0 auto; overflow-x: auto; overflow-y: hidden; background: #fff; border: 1px solid #d7e7f1; border-radius: 8px; box-shadow: 0 10px 28px rgba(27,94,136,.08); overscroll-behavior-inline: contain; scrollbar-color: #8dbbd5 #edf6fb; }
.fee-diagram-scroll:focus-visible { outline: 3px solid rgba(21,107,163,.32); outline-offset: 4px; }
.fee-diagram-image { width: 100%; max-width: 1536px; height: auto; display: block; margin: 0 auto; object-fit: contain; }
.fee-diagram-hint { display: none; }
.fee-estimates { max-width: 970px; margin: 0 auto; display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.fee-estimates article { padding: 21px 22px; display: grid; gap: 8px; background: #fff; border: 1px solid var(--fee-line); border-radius: 10px; box-shadow: 0 8px 24px rgba(22,89,131,.06); }
.fee-estimates span { color: #527087; font-size: 12px; }
.fee-estimates strong { color: var(--fee-blue-deep); font-size: 24px; }
.fee-estimates__note { max-width: 970px; margin: 12px auto 0; color: #6a8192; font-size: 11px; }
.fee-zero { max-width: 760px; margin: 34px auto 0; padding: 28px 34px; display: grid; justify-items: center; gap: 6px; color: var(--fee-blue-deep); text-align: center; background: linear-gradient(135deg,#f7fcff,#eaf6fd); border: 1px solid var(--fee-line); border-top: 5px solid var(--fee-blue); border-radius: 12px; box-shadow: 0 14px 38px rgba(12,66,105,.12); }
.fee-zero__kicker { font-size: 13px; font-weight: 800; letter-spacing: .05em; }
.fee-zero strong { font-size: clamp(26px,3vw,38px); line-height: 1.25; white-space: nowrap; }
.fee-zero b { color: var(--fee-orange); font-size: 1.45em; }
.fee-zero p { margin: 3px 0 0; color: #527087; font-size: 13px; line-height: 1.7; }
.cost-list { margin: 28px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; list-style: none; }
.cost-list li { min-width: 0; padding: 12px; display: flex; align-items: center; gap: 10px; color: var(--fee-blue-deep); background: #fff; border: 1px solid var(--fee-line); border-radius: 7px; font-size: 12px; font-weight: 700; }
.cost-list span { flex: 0 0 34px; height: 34px; display: grid; place-items: center; color: #fff; background: #68a9ce; border-radius: 50%; font-weight: 900; }
.support-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.support-grid article { padding: 30px 22px; text-align: center; background: #fff; border: 1px solid var(--fee-line); border-radius: 14px; box-shadow: 0 10px 30px rgba(22,89,131,.07); }
.support-grid span { width: 58px; height: 58px; margin: 0 auto 18px; display: grid; place-items: center; color: #fff; background: linear-gradient(145deg, #74b9dc, #277eaf); border-radius: 18px 18px 18px 5px; font-size: 21px; font-weight: 900; }
.support-grid h3 { margin: 0 0 10px; color: var(--fee-blue-deep); font-size: 17px; }
.support-grid p { margin: 0; color: #5d7688; font-size: 12px; line-height: 1.8; }
.fee-section--life { padding: 0; overflow: hidden; color: #fff; background: var(--fee-blue-deep); }
.fee-life { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); align-items: stretch; }
.fee-life__copy { padding: 82px 60px 82px 0; align-self: center; }
.fee-life h2 { color: #fff; }
.fee-life figure { min-height: 540px; margin: 0; width: calc(100% + (100vw - min(1180px, calc(100vw - 40px))) / 2); }
.fee-life img { width: 100%; height: 100%; display: block; object-fit: cover; }
.life-tags { margin: 28px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 9px; list-style: none; }
.life-tags li { padding: 7px 13px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.22); border-radius: 99px; font-size: 11px; }
.fee-contact { padding: 84px 0; color: #fff; background: linear-gradient(135deg, #1875ad, #0b4d76); }
.fee-contact__inner { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(300px,.75fr); gap: 60px; align-items: center; }
.fee-contact .fee-kicker { color: #bce5ff; }
.fee-contact h2 { color: #fff; }
.fee-contact__actions { display: grid; gap: 10px; }
.fee-contact__actions .button { width: 100%; min-height: 54px; justify-content: center; }
.fee-contact__button { color: #fff; background: transparent; border: 1px solid rgba(255,255,255,.62); }
.fee-contact__phone { padding-top: 11px; display: grid; justify-items: center; color: #fff; text-decoration: none; }
.fee-contact__phone small, .fee-contact__phone span { font-size: 10px; }
.fee-contact__phone strong { font: 700 25px Arial,sans-serif; }
.sp-only { display: none; }
@media (max-width: 900px) {
  .fee-hero { min-height: 590px; }
  .fee-hero__image { object-position: 61% center; }
  .fee-hero__shade { background: linear-gradient(90deg, rgba(255,255,255,.98) 0%, rgba(247,252,255,.91) 48%, rgba(247,252,255,.34) 76%); }
  .fee-hero__copy { max-width: 515px; padding-top: 46px; }
  .fee-section { padding: 76px 0; }
  #reason { padding-top: 38px; }
  .fee-media { gap: 38px; }
  .support-grid { grid-template-columns: repeat(2,1fr); }
  .fee-life__copy { padding-right: 40px; }
  .fee-contact__inner { gap: 36px; }
}
@media (max-width: 640px) {
  .fee-hero { min-height: auto; padding-bottom: 0; background: #fff; }
  .fee-hero__image { position: relative; order: 2; height: auto; aspect-ratio: 16 / 10; object-position: 67% center; }
  .fee-hero__shade { display: none; }
  .fee-hero__inner { padding-top: 20px; padding-bottom: 32px; }
  .fee-hero__copy { padding-top: 28px; }
  .fee-hero h1 { font-size: clamp(38px,12vw,50px); }
  .fee-hero__lead { margin-top: 18px; font-size: 20px; }
  .fee-hero__copy > p:last-child { font-size: 13px; line-height: 1.9; }
  .fee-section { padding: 62px 0; }
  #reason { padding-top: 31px; }
  .fee-media, .fee-media--reverse { grid-template-columns: 1fr; gap: 32px; }
  .fee-media--reverse .fee-photo { order: 0; }
  .fee-photo, .fee-media--reverse .fee-photo { border-radius: 5px 24px 5px 5px; }
  .fee-copy h2, .fee-heading h2, .fee-life h2, .fee-contact h2 { margin-bottom: 18px; font-size: 30px; }
  .fee-copy p, .fee-heading p, .fee-life p, .fee-contact p { font-size: 14px; line-height: 1.9; }
  .fee-heading { margin-bottom: 32px; text-align: left; }
  .fee-diagram-scroll { margin-inline: 0; border-radius: 6px; }
  .fee-diagram-image { width: 820px; max-width: none; }
  .fee-diagram-hint { margin: 10px 0 0; display: block; color: #5f788a; font-size: 11px; text-align: center; }
  .fee-estimates { grid-template-columns: 1fr 1fr; gap: 9px; }
  .fee-estimates article { padding: 17px 14px; }
  .fee-estimates strong { font-size: 20px; }
  .fee-zero { margin-top: 26px; padding: 21px 15px; gap: 4px; }
  .fee-zero strong { font-size: clamp(25px,8vw,32px); }
  .fee-zero p { max-width: 290px; font-size: 12px; }
  .cost-list { grid-template-columns: 1fr; }
  .support-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
  .support-grid article { padding: 22px 12px; }
  .support-grid h3 { font-size: 15px; }
  .fee-life { grid-template-columns: 1fr; }
  .fee-life__copy { padding: 60px 0 42px; }
  .fee-life figure { min-height: 0; width: 100%; margin-bottom: 0; }
  .fee-life img { aspect-ratio: 16 / 10; }
  .fee-contact { padding: 62px 0 88px; }
  .fee-contact__inner { grid-template-columns: 1fr; gap: 28px; }
  .sp-only { display: block; }
}
