@import url('./owner-share.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700&display=swap');

/* Type 06 / Editorial Story. Black, paper and red only;
   the owner's custom green remains exclusive to Type 07. */
body.car-story {
  --sans: 'Noto Sans JP', 'Yu Gothic', Meiryo, sans-serif;
  --story-dark: #101112;
  --story-width: 1160px;
  --story-gutter: clamp(28px, 5vw, 72px);
  font-weight: 400;
}
.car-story-main { background: var(--paper); }
.car-story-main :is(section,article,[id]) { scroll-margin-top: 96px; }
.car-story-main picture { display: block; }
.car-story-main :is(h2,h3,p) { margin-top: 0; }
.car-story-main :is(h2,h3) { line-height: 1.65; text-wrap: pretty; }
.car-story-main h2 { font-size: clamp(25px,2.35vw,34px); font-weight: 600; letter-spacing: .025em; }
.car-story-main h3 { font-size: clamp(20px,1.8vw,26px); font-weight: 600; }
.car-story-main p { font-size: 16px; line-height: 2.1; letter-spacing: .025em; }
.car-story-main a { text-decoration: none; }
.car-story-main a:focus-visible { outline-offset: 4px; }

/* The authentic landscape photograph is retained. Keep its car above the
   lower-left title rather than recreating the generated concept's photo. */
.car-story .mag-cover { height: min(92svh,840px); min-height: 720px; }
.car-story .mag-cover-media > img { object-position: center 38%; }
.car-story .mag-cover-copy { left: var(--story-gutter); bottom: 62px; right: 48px; max-width: 680px; }
.car-story .mag-cover-copy h1 { font-size: clamp(36px,3.4vw,49px); line-height: 1.4; margin: 16px 0 18px; }
.car-story .mag-cover-copy h1 span { display: block; }
.car-story .mag-cover-copy .hero-lead { font-size: 14px; line-height: 1.95; max-width: 540px; }
.car-story .mag-cover-copy .hero-meta { margin-top: 20px; gap: 8px 18px; font-size: 8px; }
.car-story .mag-cover-copy .hero-credit { display: inline; margin: 0; font: inherit; }
.car-story .mag-cover-copy .hero-cat { font-size: 9px; color: #ef786b; }
.car-story .mag-cover::after { z-index: 2; }
.car-story .mag-scroll-cue { bottom: 32px; }

/* Shallow chapter navigation leaves the reading canvas open. */
.story-route { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: clamp(20px,2.9vw,44px); min-height: 64px; padding: 0 var(--story-gutter); background: var(--paper); border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: thin; }
.story-route a { position: relative; display: flex; align-items: center; min-height: 64px; flex: 0 0 auto; border-bottom: 2px solid transparent; color: #525252; font: 600 13px/1.5 Montserrat,var(--sans); letter-spacing: .02em; }
.story-route a:hover,.story-route a[aria-current] { border-bottom-color: var(--red); color: #101112; }
.car-story-body { width: 100%; }
.story-section { width: min(var(--story-width),calc(100% - var(--story-gutter) * 2)); margin: 0 auto; padding: 84px 0; border-bottom: 1px solid var(--line); }
.car-story-main .story-kicker { margin: 0 0 30px; color: var(--story-dark); font: 600 10px/1.6 Montserrat,var(--sans); letter-spacing: .12em; }
.story-section-heading { margin-bottom: 32px; }
.story-section-heading .en,.car-story-main .story-label { display: block; margin: 0 0 14px; color: var(--red); font: 500 10px/1.65 Montserrat,var(--sans); letter-spacing: .09em; }
.story-section-heading h2 { margin-bottom: 0; }
.story-copy { max-width: 720px; margin: 0 auto 30px; }
.story-copy p { margin: 0 0 1.6em; }
.story-copy p:last-child { margin-bottom: 0; }
.story-copy strong { font-weight: 600; }
.story-copy a { border-bottom: 1px solid #a9a6a0; text-underline-offset: .2em; }
.story-copy a:hover { color: var(--red); border-color: var(--red); }

/* An open editorial introduction replaces the former beige verdict box. */
.story-introduction { display: grid; grid-template-columns: 160px minmax(0,720px); align-items: start; justify-content: center; column-gap: clamp(36px,5vw,80px); }
.story-intro-heading { display: contents; }
.story-intro-heading > .story-kicker { grid-column: 1; grid-row: 1 / span 4; }
.story-intro-heading > :not(.story-kicker) { grid-column: 2; }
.story-introduction > .story-copy { grid-column: 2; margin: 30px 0 0; }
.story-introduction .story-intro-title { margin: 20px 0 26px; font-size: clamp(25px,2.3vw,33px); }
.story-introduction .story-deck { font-size: 14px; color: var(--muted); margin-bottom: 0; }
.story-introduction .lead { font: inherit; }

/* Historical photographs form a real spread, with credit below both images. */
.story-history-spread { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,1fr); gap: 28px clamp(28px,4vw,64px); align-items: start; margin-bottom: 38px; }
.story-history-media,.story-history-media .story-photo-pair { display: contents; }
.story-history-media .story-photo-pair > :first-child { grid-column: 1; grid-row: 1 / 3; align-self: center; }
.story-history-media .story-photo-pair > :last-child { grid-column: 2; grid-row: 2; width: 80%; justify-self: end; }
.story-history-heading { grid-column: 2; grid-row: 1; }
.story-history-heading .story-copy { margin: 0; }
.story-history-media .story-caption { grid-column: 1 / -1; grid-row: 3; margin: 0; }
.story-generations { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 36px; margin: 36px 0; padding: 0; }
.story-generations > div { border-top: 1px solid var(--line); padding: 22px 0; }
.story-generations dt { font-size: 16px; font-weight: 600; }
.story-generations dd { margin: 10px 0 0; font-size: 14px; color: var(--muted); line-height: 1.85; }
.story-history > .story-copy { max-width: 800px; }

/* Wide image interludes and fixed-width reading measures. */
.story-photo { margin: 40px 0; }
.story-photo img,.story-photo-pair img { width: 100%; height: auto; display: block; }
.story-photo-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; align-items: start; margin: 40px 0; }
@media(min-width:761px){
  [data-article="jimny-unique"] #chapter-07 .story-photo-pair { grid-template-columns: minmax(0,959fr) minmax(0,714fr); }
}
.car-story-main .story-caption { margin: 12px 0 28px; color: var(--muted); font-size: 11px; line-height: 1.8; }
.story-detail { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.55fr); gap: clamp(32px,5vw,72px); padding: 36px 0; border-top: 1px solid var(--line); }
.story-detail h3 { margin: 0; font-size: 21px; line-height: 1.85; }
.story-detail .story-copy { max-width: none; margin: 0; }
.story-engineering > .story-section-heading { background: var(--story-dark); color: #fff; padding: 42px 48px; }
.story-engineering > .story-section-heading .en { color: #ff9586; }
.story-engineering > .story-photo { margin-top: 32px; }
.story-culture > .story-section-heading,.story-global > .story-section-heading,.story-interior > .story-section-heading,.story-future > .story-section-heading { max-width: 860px; }
.story-global > .story-photo { max-width: 1020px; margin-inline: auto; }
.story-quote { margin: 60px 0 0; padding: 38px 0; border-block: 1px solid var(--line); text-align: center; }
.car-story-main .story-quote p { margin: 0; font-size: clamp(22px,2.1vw,30px); font-weight: 600; line-height: 1.9; }
.story-closing { margin-top: 52px; padding: 54px; background: var(--story-dark); color: #fff; text-align: center; }
.story-closing h3 { margin: 0 0 26px; font-size: clamp(24px,2.4vw,34px); }
.story-closing p { margin: 0; font-size: 15px; color: #e3e1dd; }

/* Native disclosures: no old warning/callout rectangles. */
.story-faq > .story-section-heading { margin-bottom: 24px; }
.story-faq > .story-section-heading .en { margin-bottom: 8px; }
.car-story-main .story-faq h2 { font-size: clamp(24px,2vw,28px); line-height: 1.5; }
.story-faq-item { border-top: 1px solid var(--line); }
.story-faq-item:last-child { border-bottom: 1px solid var(--line); }
.story-faq-item summary { padding: 22px 8px; cursor: pointer; font-size: 16px; font-weight: 500; line-height: 1.85; }
.story-faq-item summary::marker { color: var(--red); }
.story-faq-answer { padding: 0 28px 24px; max-width: 820px; }
.story-faq-answer p { margin: 0; font-size: 15px; }

.story-related { padding: 72px var(--story-gutter); }
.story-related-inner { max-width: var(--story-width); margin: auto; }
.story-related .sec-h2 { margin: 0 0 30px; font: 500 22px/1.5 Montserrat,var(--sans); }
.story-related .slash { color: var(--red); margin-right: 10px; }
.story-related-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 38px 24px; }
.story-related-card { min-width: 0; display: block; }
.story-related-image { overflow: hidden; aspect-ratio: 3/2; background: #dedbd5; }
.story-related-image :is(picture,img) { width: 100%; height: 100%; }
.story-related-image img { object-fit: cover; transition: transform .25s ease; }
.story-related-card:hover img { transform: scale(1.025); }
.story-related-copy { padding-top: 16px; }
.story-related-category { margin-bottom: 8px; color: var(--red); font: 500 9px/1.5 Montserrat,var(--sans); }
.story-related-title { font-size: 15px; font-weight: 500; line-height: 1.8; }
.story-cta { background: #101112; color: #fff; padding: 64px var(--story-gutter); text-align: center; }
.story-cta-label { margin-bottom: 18px; color: #ef786b; font: 500 10px/1.6 Montserrat,var(--sans); letter-spacing: .1em; }
.story-cta-title { font-size: clamp(26px,2.7vw,38px); line-height: 1.6; font-weight: 600; margin-bottom: 20px; }
.story-cta-desc { font-size: 14px; line-height: 2; color: #ddd; }
.story-cta-link { display: inline-flex; align-items: center; min-height: 50px; margin-top: 28px; padding: 14px 24px; border: 1px solid #666; font-size: 13px; }
.story-cta-link:hover { background: #fff; color: #101112; }
.car-story .owner-share { padding-block: 50px; }
.car-story .site-footer { padding-top: 48px; gap: 20px 34px; }
.car-story .site-footer .footer-logo { font-size: 25px; }
.car-story .site-footer nav a { font-size: 10px; min-height: 44px; }

@media(min-width:1600px) {
  .car-story .mag-cover-media > img { object-position: center 48%; }
}
@media(max-width:1050px) {
  .car-story { --rail: 88px; }
  .story-introduction { display: block; }
  .story-intro-heading { display: block; }
  .story-intro-heading,.story-introduction > .story-copy { max-width: 720px; width: 100%; margin-inline: auto; }
  .story-introduction > .story-copy { margin-top: 30px; }
  .story-history-spread { grid-template-columns: 1fr; }
  .story-history-heading { grid-column: 1; grid-row: 1; padding-top: 0; }
  .story-history-media .story-photo-pair > :first-child { grid-column: 1; grid-row: 2; }
  .story-history-media .story-photo-pair > :last-child { grid-column: 1; grid-row: 3; width: 80%; }
  .story-history-media .story-caption { grid-row: 4; }
  .story-detail { grid-template-columns: 1fr; gap: 20px; }
  .story-related-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media(max-width:760px) {
  .car-story { --rail: 0px; --story-gutter: 24px; }
  .car-story .issue-rail { height: 64px; }
  .car-story .mag-main { padding-top: 64px; }
  .car-story .mag-cover { height: auto; min-height: 0; padding-top: 74%; }
  .car-story .mag-cover-media { bottom: auto; height: auto; aspect-ratio: 4/3; }
  .car-story .mag-cover-media > img { object-fit: cover; object-position: 30% center; }
  .car-story .mag-cover-shade { bottom: auto; height: 90px; background: #0003; }
  .car-story .mag-cover-copy { position: relative; inset: auto; max-width: none; padding: 24px 28px 62px; }
  .car-story .mag-cover-copy h1 { font-size: clamp(28px,7.4vw,34px); margin: 14px 0 16px; line-height: 1.55; }
  .car-story .mag-cover-copy .hero-cat { font-size: 8px; margin: 0; }
  .car-story .mag-cover-copy .hero-lead { font-size: 13px; line-height: 1.95; margin-top: 0; }
  .car-story .mag-cover-copy .hero-lead br { display: none; }
  .car-story .mag-cover-copy .hero-meta { gap: 6px 14px; margin-top: 18px; font-size: 7px; }
  .car-story .mag-scroll-cue { bottom: 24px; right: 28px; font-size: 7px; }
  .car-story .mag-cover::after { inset: 12px; }
  .story-route { top: 64px; gap: 24px; min-height: 52px; }
  .story-route a { min-height: 52px; font-size: 13px; }
  .car-story-main :is(section,article,[id]) { scroll-margin-top: 136px; }
  .story-section { padding: 52px 0; }
  .car-story-main h2 { font-size: 25px; line-height: 1.75; }
  .car-story-main p { font-size: 15px; line-height: 2.05; }
  .car-story-main .story-kicker { font-size: 9px; margin-bottom: 22px; }
  .car-story-main .story-label,.story-section-heading .en { font-size: 9px; }
  .story-introduction .story-intro-title { font-size: 25px; }
  .story-introduction .story-deck { font-size: 14px; }
  .story-introduction .story-intro-title br { display: none; }
  .story-history-spread { gap: 24px; }
  .story-history-media .story-photo-pair { gap: 10px; }
  .story-generations { grid-template-columns: 1fr; margin-block: 24px; }
  .story-generations > div { padding-block: 18px; }
  .story-generations dt { font-size: 15px; }
  .story-generations dd { font-size: 13px; }
  .story-photo { margin: 28px 0; }
  .car-story-main .story-caption { font-size: 10px; line-height: 1.9; margin-bottom: 22px; }
  .story-detail { padding: 28px 0; gap: 16px; }
  .story-detail h3 { font-size: 20px; }
  .story-engineering > .story-section-heading { padding: 30px 24px; margin-inline: -24px; }
  .story-interior .story-photo-pair { grid-template-columns: 1fr; gap: 20px; }
  .story-quote { margin-top: 32px; padding: 28px 0; text-align: left; }
  .car-story-main .story-quote p { font-size: 22px; }
  .story-closing { margin-top: 34px; margin-inline: -24px; padding: 36px 24px; text-align: left; }
  .story-closing h3 { font-size: 24px; }
  .story-closing p { font-size: 14px; }
  .story-faq-item summary { font-size: 15px; padding-block: 20px; }
  .story-faq-answer { padding: 0 8px 22px; }
  .story-related { padding-block: 48px; }
  .story-related-grid { gap: 28px 16px; }
  .story-related-copy { padding-top: 12px; }
  .story-related-title { font-size: 13px; }
  .story-related-category { font-size: 8px; }
  .story-cta { padding-block: 48px; }
  .story-cta-title { font-size: 27px; }
  .story-cta-desc { font-size: 13px; }
  .car-story .site-footer { margin-left: 0; padding-inline: 24px; }
}
@media(prefers-reduced-motion:reduce) {
  .car-story { scroll-behavior: auto; }
  .story-related-image img { transition: none; }
}