.fishon-page { --case-surface: #fbf4f7; }
.fishon-page .fishon-intro { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: clamp(28px, 4.5vw, 64px); }
.fishon-intro .case-figure { margin: 0; }
.fishon-intro .case-copy { margin-top: 22px; max-width: 39ch; }
.fishon-intro .text-link { margin-top: 24px; }
.fishon-section + .fishon-section, .fishon-end { border-top: 1px solid var(--line); }
.fishon-page .case-image-button { background: #fff; }
.fishon-page .case-image-button img { height: auto; transform: none; }
.fishon-feature { display: grid; grid-template-columns: 1fr 1fr; gap: 9%; align-items: center; margin-top: 48px; }
.fishon-feature .fishon-phone { width: min(100%, 330px); margin: 0 auto; }
.fishon-feature-copy { max-width: 470px; }
.fishon-section h3 { font-size: clamp(27px, 2.7vw, 38px); font-weight: 700; line-height: 1.2; letter-spacing: -1.1px; margin-bottom: 24px; }
.fishon-record-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 9%; align-items: center; margin-top: 48px; }
.fishon-record-layout .case-figure { margin: 0; }
.fishon-catch .case-image-button { padding: clamp(24px, 4vw, 52px); background: #f4f9fa; }
.fishon-catch img { max-width: 360px; margin-inline: auto; }
.fishon-record-link { margin-top: 24px; border: 0; border-bottom: 1px solid var(--ink); background: transparent; }
.fishon-community-grid, .fishon-identity-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(24px, 3vw, 40px); margin-top: 44px; }
.fishon-community-grid .case-figure, .fishon-identity-grid .case-figure { margin: 0; }
.fishon-specimen .case-image-button { height: 730px; padding: 28px; display: flex; align-items: center; justify-content: center; background: #f4f9fa; }
.fishon-specimen img { width: min(100%, 330px); max-height: 673px; object-fit: contain; }
.fishon-identity-grid { grid-template-columns: 1.3fr 1fr; }
.fishon-identity-grid .case-image-button { height: 640px; padding: 28px; display: flex; align-items: center; justify-content: center; }
.fishon-welcome img { width: min(100%, 300px); max-height: 580px; object-fit: contain; }
.fishon-logo img { width: min(100%, 450px); }
.fishon-end { padding-block: 36px 64px; }
.fishon-end .case-end { margin-top: 0; }
.fishon-icons { margin-top: clamp(64px, 8vw, 104px); scroll-margin-top: var(--case-nav-height); }
.fishon-icon-board { margin-top: 36px; border: 1px solid var(--case-line); border-radius: 18px; padding: clamp(24px, 4vw, 48px); background: #fff; }
.fishon-icon-family + .fishon-icon-family { margin-top: 40px; padding-top: 32px; border-top: 1px solid var(--line); }
.fishon-icon-family h4 { margin: 0 0 28px; font-size: 14px; font-weight: 600; }
.fishon-icon-grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 28px 16px; }
.fishon-icon-grid--weather { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.fishon-icon-grid li { display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; color: var(--muted); font-size: 12px; line-height: 1.5; }
.fishon-icon-grid img { width: 40px; height: 40px; object-fit: contain; }
.fishon-icon-grid--weather img { width: 48px; height: 48px; }
@media (min-width: 761px) and (max-width: 1000px) {
 .fishon-icon-grid--weather { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
 .fishon-page .fishon-intro { grid-template-columns: 1fr; gap: 30px; }
 .fishon-feature, .fishon-record-layout { grid-template-columns: 1fr; gap: 32px; margin-top: 32px; }
 .fishon-feature-copy { max-width: none; }
 .fishon-feature .fishon-phone { order: 2; }
 .fishon-community-grid, .fishon-identity-grid { grid-template-columns: 1fr; gap: 32px; margin-top: 32px; }
 .fishon-specimen .case-image-button, .fishon-identity-grid .case-image-button { height: auto; padding: 24px; }
 .fishon-logo .case-image-button { min-height: 260px; padding: 12px; }
 .fishon-section h3 { font-size: 28px; margin-bottom: 18px; }
 .fishon-end { padding-block: 30px 48px; }
 .fishon-icon-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 12px; }
 .fishon-icon-family h4 { font-size: 13px; }
 .fishon-icon-grid li { font-size: 11px; }
 .fishon-icon-grid img { width: 36px; height: 36px; }
 .fishon-icon-grid--weather { grid-template-columns: repeat(4, minmax(0, 1fr)); }
 .fishon-icon-grid--weather img { width: 40px; height: 40px; }
}
