.sh20-page {
    --sh20-ink: var(--v2-text-heading, #171a1d);
    --sh20-blue: var(--v2-primary-500, #2967d3);
    --sh20-header-offset: 74px;
    --mount-header-offset: var(--sh20-header-offset);
    background: #fff;
    color: var(--sh20-ink);
    font-family: var(--v2-font-family-base, sans-serif);
    font-size: 18px;
    line-height: 1.75;
}
.sh20-page * { box-sizing: border-box; }
.sh20-page h1, .sh20-page h2, .sh20-page h3, .sh20-page p,
.sh20-page figure, .sh20-page dl, .sh20-page dd { margin: 0; }
.sh20-page h1, .sh20-page h2, .sh20-page h3 { color: inherit; }
.sh20-page p { color: inherit; }
.sh20-page p.sh20-kicker { color: var(--sh20-blue); }
.sh20-page img { display: block; max-width: 100%; width: 100%; height: auto; }
.sh20-page picture { display: block; }
.sh20-page strong { font-weight: 700; }
.sh20-container { width: min(1240px, calc(100% - 64px)); margin: 0 auto; }
.sh20-page section[id] { scroll-margin-top: calc(var(--sh20-header-offset) + 24px); }
.sh20-page #sh20-title { scroll-margin-top: calc(var(--sh20-header-offset) + 24px); }
.sh20-page a:focus-visible, .sh20-page button:focus-visible {
    outline: 3px solid var(--v2-primary-500);
    outline-offset: 5px;
}
.sh20-page button:focus-visible { outline: 3px solid var(--v2-primary-500) !important; }
.sh20-section { padding-top: 96px; padding-bottom: 96px; }
.sh20-section-muted { background: var(--v2-bg-functional, #f4f6f9); }
.sh20-control-section, .sh20-structure-section { background: #fcfefc; }
.sh20-section-heading { margin-bottom: 40px; }
.sh20-section-heading h2 { font-size: clamp(34px, 3.6vw, 52px); line-height: 1.2; font-weight: 750; letter-spacing: -.03em; }
.sh20-section-heading h2:lang(en) { text-wrap: balance; }
.sh20-section-heading h2:lang(en) .sh20-section-title-break { display: none; }
.sh20-section-heading h3 { font-size: 25px; font-weight: 700; line-height: 1.5; margin-top: 24px; }
.sh20-section-heading p:not(.sh20-kicker) { margin-top: 12px; max-width: 660px; }
.sh20-kicker { color: var(--sh20-blue); font-size: 17px; font-weight: 650; margin-bottom: 12px !important; }
.sh20-center { text-align: center; }
.sh20-button { display: inline-flex; min-height: 46px; align-items: center; gap: 20px; padding: 10px 24px; border-radius: 8px; font-weight: 650; font-size: 16px; text-decoration: none; }
.sh20-button-light { background: #fff; color: #171a1d; }
.sh20-button-light:hover { background: #d4e9ff; color: #171a1d; }
.sh20-text-link { display: inline-block; color: var(--sh20-blue); font-weight: 650; text-decoration: underline; text-underline-offset: 5px; }
.sh20-text-link:hover { color: #184aad; }

.sh20-hero { position: relative; isolation: isolate; min-height: 690px; height: min(56vw, 900px); background: #050813; color: #fff; }
.sh20-hero-media { position: absolute; inset: 0; z-index: -1; background-size: cover; background-position: center; background-repeat: no-repeat; }
.sh20-hero-content { height: 100%; position: relative; display: flex; align-items: center; padding: 100px 0 92px; }
.sh20-hero-copy { max-width: 53%; }
.sh20-brand { font-size: 20px; font-weight: 650; line-height: 1.4; margin-bottom: 30px !important; }
.sh20-brand span { display: block; font-size: 16px; letter-spacing: .12em; }
.sh20-eyebrow { font-size: 17px; font-weight: 600; color: #d9e0e8; margin-bottom: 8px !important; }
.sh20-hero h1 { font-size: clamp(48px, 5.2vw, 80px); font-weight: 750; letter-spacing: -.045em; line-height: 1.08; white-space: nowrap; }
.sh20-hero-type { margin-top: 18px !important; font-size: 30px; font-weight: 650; }
.sh20-hero-description { margin: 22px 0 30px !important; font-size: clamp(17px, 1.7vw, 23px); line-height: 1.65; color: #ecf0f5; }
.sh20-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; font-size: 14px; position: absolute; left: 0; bottom: 24px; color: #ddd; }
.sh20-breadcrumb a { color: #fff; text-decoration: none; }
.sh20-breadcrumb a:hover { text-decoration: underline; }
.sh20-hero > .sh20-breadcrumb { left: max(32px, calc((100% - 1240px) / 2)); }


.sh20-overview-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: 64px; }
.sh20-gallery { min-width: 0; }
.sh20-gallery-main { border-radius: 16px; background: #fff; border: 1px solid #edf0f3; }
.sh20-gallery-main img { aspect-ratio: 1; object-fit: contain; border-radius: inherit; }
.sh20-gallery-thumbs:not([hidden]) { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
.sh20-gallery-thumb { background: #fff; padding: 3px; border: 1px solid #d8dee6; border-radius: 8px; cursor: pointer; }
.sh20-gallery-thumb img { border-radius: 6px; }
.sh20-gallery-thumb:hover, .sh20-gallery-thumb.is-active { border-color: var(--sh20-blue); box-shadow: 0 0 0 1px var(--sh20-blue); }
.sh20-gallery-thumb:disabled { opacity: .5; cursor: wait; }
.sh20-gallery-status { font-size: 14px; color: #9a2525; margin-top: 10px !important; }
.sh20-gallery-status:empty { display: none; }
.sh20-summary h3 { font-size: 29px; line-height: 1.4; font-weight: 700; margin: 0 0 24px; }
.sh20-summary dl { margin-bottom: 26px; }
.sh20-summary dl > div { display: grid; grid-template-columns: 128px minmax(0,1fr); gap: 18px; padding: 12px 0; border-bottom: 1px solid #e3e8f0; font-size: 16px; line-height: 1.65; }
.sh20-summary dt { color: #6e6e73; font-weight: 500; overflow-wrap: anywhere; }
.sh20-summary dd { color: #171a1d; overflow-wrap: anywhere; }

.sh20-advantage-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.sh20-advantage { display: grid; position: relative; color: #fff; background: #155971; border-radius: 12px; overflow: hidden; text-decoration: none; }
.sh20-advantage:hover { color: #fff; box-shadow: 0 4px 18px #062b4330; }
.sh20-advantage > picture { grid-area: 1 / 1; }
.sh20-advantage img { width: 100%; height: 100%; object-fit: cover; }
.sh20-advantage-copy { grid-area: 1 / 1; position: relative; display: flex; flex-direction: column; justify-content: center; padding: 16px 26px; font-size: 18px; line-height: 1.5; }
.sh20-advantage-copy strong { font-size: 23px; line-height: 1.35; }
.sh20-align-right .sh20-advantage-copy { text-align: right; }
.sh20-drive-panel { display: grid; grid-template-columns: .85fr 1.4fr; gap: 48px; align-items: center; padding: 48px; background: #d4d5d6; border-radius: 20px; }
.sh20-drive-media { min-width: 0; }
.sh20-drive-points { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 30px 28px; counter-reset: sh20-drive-point; }
.sh20-drive-points h3 {
    display: grid;
    grid-template-columns: 1.625rem minmax(0, 1fr);
    align-items: start;
    gap: .5rem;
    font-size: 20px;
    line-height: 1.5;
    font-weight: 750;
    margin-bottom: 8px;
}
.sh20-drive-points h3::before {
    content: counter(sh20-drive-point);
    counter-increment: sh20-drive-point;
    display: grid;
    place-items: center;
    height: 1.625rem;
    border-radius: 50%;
    background: var(--v2-primary-600, #184aad);
    color: #fff;
    font-size: .875rem;
    line-height: 1;
}
.sh20-drive-points p { font-size: 18px; line-height: 1.85; }
.sh20-control-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.sh20-control-card { display: grid; container-type: inline-size; border-radius: 14px; overflow: hidden; background: #0b0c0e; color: #fff; }
.sh20-control-card > picture { grid-area: 1 / 1; position: relative; }
/* Reserve the artwork's 2:1 ratio while allowing localized copy to grow the card. */
.sh20-control-card > picture::before { content: ""; display: block; aspect-ratio: 2 / 1; }
.sh20-control-card > picture img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--sh20-control-art-edge, right) center; }
.sh20-control-card > picture::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to var(--sh20-control-art-edge, right), #0b0c0e 5%, #0b0c0eb3 42%, transparent 62%); }
.sh20-control-card > div { grid-area: 1 / 1; position: relative; align-self: center; width: 52%; padding: clamp(12px, 3cqw, 24px); overflow-wrap: anywhere; }
.sh20-control-card.sh20-copy-right { --sh20-control-art-edge: left; }
.sh20-copy-right > div { justify-self: end; }
.sh20-control-card--hand-controller { background: #0c0c0c; }
.sh20-control-card h3 { font-size: clamp(16px,4cqw,26px); line-height: 1.4; font-weight: 700; margin-bottom: 2cqw; }
.sh20-control-card p { font-size: clamp(14px,3.4cqw,20px); line-height: 1.6; }
.sh20-payload-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 44px; align-items: center; background: #050505; color: #fff; padding: 46px; border-radius: 20px; }
.sh20-payload-numbers { display: flex; gap: 30px; margin-bottom: 26px; }
.sh20-payload-numbers p { display: flex; flex-direction: column; font-size: 14px; color: #c2c6cb; }
.sh20-payload-numbers strong { font-size: clamp(36px,3.2vw,50px); line-height: 1.25; letter-spacing: -.04em; font-weight: 700; color: #fff; }
.sh20-payload-numbers strong span { font-size: 20px; letter-spacing: 0; margin-left: 6px; }
.sh20-payload-copy > p { font-size: 18px; }
.sh20-payload-copy > picture { margin-top: 20px; max-width: 420px; }
.sh20-safety-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.sh20-safety-card { display: grid; grid-template-columns: 1fr 1fr; align-items: center; overflow: hidden; border-radius: 12px; color: #fff; background: #2e2e30; }
.sh20-safety-card > div { padding: 24px; }
.sh20-safety-card h3 { font-size: 23px; font-weight: 700; line-height: 1.45; margin-bottom: 12px; }
.sh20-safety-card p { font-size: 17px; line-height: 1.85; }
.sh20-safety-card figure { align-self: center; background: #08080a; }
.sh20-safety-card--collision figure { align-self: stretch; display: grid; }
.sh20-safety-card--collision img { height: 100%; object-fit: cover; }
.sh20-safety-wide { grid-column: 1 / -1; }
.sh20-safety-wide figure { padding: 18px 0; }
.sh20-safety-wide figcaption { padding: 12px 24px 0; font-size: 14px; text-align: center; line-height: 1.7; }
.sh20-craft-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.sh20-craft-card { display: grid; position: relative; container-type: inline-size; overflow: hidden; border-radius: 16px; }
.sh20-craft-card > picture { grid-area: 1 / 1; }
.sh20-craft-card > picture img { height: 100%; object-fit: cover; }
.sh20-craft-copy { grid-area: 1 / 1; position: relative; margin: 7% 5% 7% auto; align-self: center; width: 59%; display: flex; flex-direction: column; justify-content: center; padding: 24px; border-radius: 8px; background: rgba(255,255,255,.86); color: #151515; }
.sh20-craft-left .sh20-craft-copy { margin-left: 5%; margin-right: auto; }
.sh20-craft-copy h3 { font-size: clamp(16px,4.2cqw,24px); line-height: 1.4; font-weight: 750; margin-bottom: 1.5cqw; hyphens: auto; overflow-wrap: anywhere; }
.sh20-craft-copy p { font-size: clamp(14px,3.4cqw,18px); line-height: 1.6; }
.sh20-craft-copy p + h3 { margin-top: 3.6cqw; }
.sh20-note { font-size: clamp(10px,2.3cqw,14px) !important; margin-top: 2.6cqw !important; }
.sh20-mode-intro { display: flex; justify-content: space-between; gap: 32px; align-items: center; }
.sh20-mode-controls { display: flex; gap: 14px; align-items: end; padding-bottom: 35px; }
.sh20-mode-controls picture:first-child { width: 100px; }
.sh20-mode-controls picture:last-child { width: 70px; }
.sh20-mode-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.sh20-mode-grid article { min-width: 0; overflow-wrap: anywhere; display: flex; flex-direction: column; padding: 32px; border-radius: 14px; background: #08080b; color: #fff; }
.sh20-mode-grid h3 { font-size: 28px; text-align: center; line-height: 1.4; font-weight: 700; margin-bottom: 8px; }
.sh20-mode-grid img { max-height: 640px; object-fit: contain; }
.sh20-mode-grid p { padding-top: 24px; font-size: 20px; }
.sh20-convenience-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 48px 32px; }
.sh20-convenience-grid h3 { font-size: 26px; font-weight: 700; margin-bottom: 18px; line-height: 1.5; }
.sh20-convenience-grid figure { position: relative; container-type: inline-size; overflow: hidden; border-radius: 12px; }
.sh20-convenience-grid figcaption { position: absolute; inset: 5% 0 auto; display: grid; grid-template-columns: 1fr 1fr; font-size: clamp(12px,3.6cqw,22px); font-weight: 700; color: #fff; text-align: center; }
.sh20-convenience-grid p { font-size: 18px; margin-top: 20px; }
.sh20-structure-grid { display: grid; gap: 16px; max-width: 700px; margin-inline: auto; }
.sh20-structure-grid figure { display: grid; grid-template-rows: auto 1fr; align-items: center; padding-bottom: 20px; border-radius: 12px; overflow: hidden; background: #fff; color: var(--sh20-ink); }
.sh20-structure-grid figcaption { text-align: center; font-weight: 700; padding: 20px 16px 12px; }
.sh20-diagram-preview .mfp-figure::after { background-color: #fff; }
.sh20-package-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.8fr); align-items: center; gap: 80px; }
.sh20-package-grid figure { border: 1px solid #e3e8f0; border-radius: 16px; overflow: hidden; }
.sh20-package-grid ul { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; font-size: 20px; }
.sh20-package-grid li { display: flex; align-items: baseline; gap: 12px; overflow-wrap: anywhere; }
.sh20-package-grid li span { color: var(--sh20-blue); }
.sh20-spec-table { width: 100%; border-collapse: collapse; border: 1px solid #d4dce6; background: #fff; font-size: 17px; line-height: 1.75; table-layout: fixed; }
.sh20-spec-table th, .sh20-spec-table td { border-bottom: 1px solid #d4dce6; padding: 17px 24px; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.sh20-spec-table thead { background: #e9edf3; }
.sh20-spec-table th { font-weight: 650; }
.sh20-spec-table th:first-child { width: 27%; }
.sh20-spec-table tbody tr:nth-child(even) { background: #fafbfc; }


@media (min-width: 768px) {
    .sh20-section-title-break { display: none; }
}
@media (min-width: 768px) and (max-width: 1719px) {
    .sh20-page .mount-nav-menu:not([open]) > summary {
        display: grid;
        place-items: center;
        width: 32px;
        min-height: 44px;
        padding: 0;
    }
    .sh20-page .mount-nav-collapsed { gap: 0; font-size: 0; }
    .sh20-page .mount-nav-collapsed i { font-size: 15px; }
}
@media (min-width: 1024px) {
    .sh20-structure-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; max-width: none; }
}
@media (min-width: 768px) and (max-width: 1100px) {
    .sh20-hero { height: 620px; min-height: 620px; }
    .sh20-hero-media { background-position: 55% center; }
    .sh20-hero-copy { max-width: 44%; }
    .sh20-hero h1 { font-size: clamp(36px, 4.8vw, 49px); }
    .sh20-overview-grid { gap: 32px; }
    .sh20-summary dl > div { grid-template-columns: 116px minmax(0,1fr); gap: 12px; }
    .sh20-drive-panel { padding: 32px; grid-template-columns: 1fr; }
    .sh20-drive-media { max-width: 600px; margin: 0 auto !important; }
    .sh20-control-grid { grid-template-columns: 1fr; max-width: 850px; }
    .sh20-safety-grid { grid-template-columns: 1fr; }
    .sh20-craft-grid { grid-template-columns: 1fr; max-width: 800px; margin: 0 auto; }
    .sh20-payload-panel { padding: 32px; gap: 28px; }
    .sh20-payload-numbers { flex-direction: column; gap: 20px; }
    .sh20-package-grid { gap: 40px; }
    .sh20-package-grid ul { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 767px) {
    .sh20-page { font-size: 16px; --sh20-header-offset: 64px; }
    .sh20-container { width: calc(100% - 32px); }
    .sh20-page section[id] { scroll-margin-top: calc(var(--sh20-header-offset) + 64px); }
    .sh20-page .mount-detail-nav {
        position: sticky;
        top: 48px;
        bottom: auto;
        padding: 8px 16px;
        background: var(--v2-bg-primary, #fff);
    }
    .sh20-page .mount-nav-menu:not([open]) > summary {
        width: fit-content;
        min-height: 44px;
        border-radius: 8px;
    }
    .sh20-page .mount-nav-menu[open] {
        width: 100%;
        max-height: 65dvh;
        border: 1px solid var(--v2-bg-divider);
        border-radius: 10px;
    }
    .sh20-section { padding-top: 36px; padding-bottom: 36px; }
    .sh20-section-heading { margin-bottom: 22px; }
    .sh20-section-heading h2 { font-size: clamp(29px, 8.4vw, 40px); overflow-wrap: anywhere; }
    .sh20-section-heading h3 { font-size: 19px; margin-top: 18px; }
    .sh20-kicker { font-size: 14px; margin-bottom: 8px !important; }
    .sh20-hero { display: flex; flex-direction: column; height: auto; min-height: 0; overflow: hidden; }
    .sh20-hero-media { --sh20-ban-bg: url('/assets/image/banner/sh20-ban-bg_mo.webp'); position: relative; inset: auto; order: 1; width: 100%; aspect-ratio: 1500 / 2800; margin-block: -79vw -8vw; }
    .sh20-hero-content { position: relative; inset: auto; display: block; order: 0; height: auto; padding: calc(var(--sh20-header-offset) + 4px) 0 0; text-align: center; }
    .sh20-hero-copy { max-width: 100%; }
    .sh20-brand { font-size: 19px; margin-bottom: 18px !important; line-height: 1.3; }
    .sh20-brand span { font-size: 15px; margin-top: 4px; }
    .sh20-eyebrow { font-size: 15px; margin-bottom: 10px !important; }
    .sh20-eyebrow::after { content: 'NEW' / ''; display: inline-block; margin-inline-start: 7px; padding: 2px 6px; border-radius: 4px; background: linear-gradient(120deg, #a63417, #a46205); color: #fff; font-size: 10px; line-height: 1.5; vertical-align: middle; }
    .sh20-hero h1 { font-size: clamp(35px, 11.2vw, 72px); letter-spacing: -.04em; }
    .sh20-hero-type { display: inline-block; max-width: 100%; padding: 2px 22px; border-radius: 30px; margin-top: 12px !important; background: var(--v2-primary-500); font-size: clamp(18px,5vw,26px); overflow-wrap: anywhere; }
    .sh20-hero-description { font-size: 15px; margin: 14px 0 0 !important; white-space: normal; overflow-wrap: anywhere; }
    .sh20-hero .sh20-button { display: none; }
    .sh20-breadcrumb { gap: 8px; bottom: 14px; font-size: 12px; text-align: left; }
    .sh20-hero > .sh20-breadcrumb { left: 16px; }
    .sh20-page #overview { padding-top: 18px; }
    .sh20-page #overview .sh20-section-heading { margin-bottom: 12px; }
    .sh20-page #overview h2:not(:lang(en)) { font-size: clamp(21px, 6vw, 28px); }
    .sh20-page .mount-overview-body { padding: 12px; }
    .sh20-page .mount-overview > summary { min-height: 48px; padding: 10px 12px; }
    .sh20-overview-grid { grid-template-columns: 1fr; gap: 20px; reading-flow: grid-rows; }
    .sh20-summary { grid-row: 1; min-width: 0; }
    .sh20-summary h3 { font-size: 20px; margin-bottom: 12px; }
    .sh20-summary dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin-bottom: 16px; }
    .sh20-summary dl > div { display: block; padding: 0; border: 1px solid #e3e8f0; font-size: 13px; line-height: 1.45; }
    .sh20-summary dl > div:nth-child(1),
    .sh20-summary dl > div:nth-child(6),
    .sh20-summary dl > div:nth-child(9) { grid-column: 1 / -1; }
    .sh20-summary dt { padding: 5px 7px; background: #171a1d; color: #fff; }
    .sh20-summary dd { padding: 5px 7px; }
    .sh20-gallery-main { max-width: 230px; margin-inline: auto; }
    .sh20-gallery-thumbs:not([hidden]) { max-width: 260px; margin-inline: auto; }
    .sh20-advantage-grid { grid-template-columns: 1fr; gap: 8px; }
    .sh20-advantage { border-radius: 8px; }
    .sh20-advantage-copy { padding: 8px 18px; font-size: 13px; }
    .sh20-advantage-copy strong { font-size: 17px; }
    .sh20-drive-panel { grid-template-columns: 1fr; padding: 24px; gap: 28px; border-radius: 12px; background: #d4d5d6 url('/assets/image/product/SH20/detail/drive-panel-background-mobile.webp') top center / 100% auto no-repeat; }
    .sh20-drive-points { grid-template-columns: 1fr; gap: 26px; }
    .sh20-drive-points h3 { font-size: 18px; margin-bottom: 8px; }
    .sh20-drive-points p { font-size: 15px; }
    .sh20-control-grid { grid-template-columns: 1fr; gap: 10px; }
    .sh20-control-card { border-radius: 8px; }
    .sh20-payload-panel { grid-template-columns: 1fr; gap: 24px; padding: 24px; border-radius: 12px; }
    .sh20-payload-numbers { gap: 20px; justify-content: space-between; }
    .sh20-payload-numbers strong { font-size: 34px; }
    .sh20-payload-numbers strong span { font-size: 17px; }
    .sh20-payload-numbers p { font-size: 12px; }
    .sh20-payload-copy > p { font-size: 15px; }
    .sh20-safety-grid { grid-template-columns: 1fr; gap: 12px; }
    .sh20-safety-card { border-radius: 8px; }
    .sh20-safety-card > div { padding: 16px; }
    .sh20-safety-card h3 { font-size: 17px; margin-bottom: 10px; }
    .sh20-safety-card p { font-size: 14px; line-height: 1.75; }
    .sh20-safety-card:nth-child(even) > figure { grid-column: 2; grid-row: 1; }
    .sh20-safety-card:nth-child(even) > div { grid-column: 1; grid-row: 1; }
    .sh20-safety-wide { grid-template-columns: 1fr; }
    .sh20-safety-wide figcaption { font-size: 12px; padding-right: 16px; padding-left: 16px; }
    .sh20-safety-wide > div { padding-top: 8px; }
    .sh20-craft-grid { grid-template-columns: 1fr; gap: 14px; }
    .sh20-craft-card { border-radius: 10px; }
    .sh20-craft-copy { padding: 4%; }
    .sh20-mode-intro { gap: 12px; align-items: start; }
    .sh20-mode-intro .sh20-section-heading { flex: 1; min-width: 0; }
    .sh20-mode-intro .sh20-section-heading h2:not(:lang(en)) { font-size: 29px; }
    .sh20-mode-intro .sh20-section-heading h3 { font-size: 17px; }
    .sh20-mode-intro .sh20-section-heading p { font-size: 14px; }
    .sh20-mode-controls { gap: 8px; padding-top: 28px; padding-bottom: 0; }
    .sh20-mode-controls picture:first-child { width: 45px; }
    .sh20-mode-controls picture:last-child { width: 30px; }
    .sh20-mode-grid { gap: 12px; }
    .sh20-mode-grid article { padding: 16px 12px; border-radius: 8px; }
    .sh20-mode-grid h3 { font-size: 17px; }
    .sh20-mode-grid p { font-size: 14px; padding-top: 14px; }
    .sh20-mode-grid img { max-height: 270px; }
    .sh20-convenience-grid { grid-template-columns: 1fr; gap: 34px; }
    .sh20-convenience-grid h3 { font-size: 21px; margin-bottom: 14px; }
    .sh20-convenience-grid p { font-size: 15px; margin-top: 14px; }
    .sh20-convenience-grid figure { border-radius: 8px; }
    .sh20-package-grid { grid-template-columns: minmax(0,1fr); gap: 24px; }
    .sh20-package-grid ul { font-size: 16px; gap: 16px; }
    .sh20-package-grid li { gap: 8px; }
    .sh20-spec-table { font-size: 14px; line-height: 1.75; }
    .sh20-spec-table th, .sh20-spec-table td { padding: 12px; }
    .sh20-spec-table th:first-child { width: 34%; }
}
@media (max-width: 375px) {
    .sh20-advantage-copy { padding: 4px 14px; }
    .sh20-advantage-copy strong { font-size: 16px; }
    .sh20-safety-card--collision > div { padding-block: 10px; }
    .sh20-safety-card--collision p { line-height: 1.55; }
}
@media (prefers-reduced-motion: reduce) {
    .sh20-page * { transition: none !important; }
}