.journal-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; padding:0 0 80px; }
.journal-card { min-width:0; border-top:1px solid var(--dark-line); padding-top:18px; }
.journal-image { position:relative; display:block; aspect-ratio:4/3; overflow:hidden; background:#dce2e8; border-radius:12px; }
.journal-image img { width:100%;height:100%;object-fit:cover;transition:transform .4s ease; }
.journal-image.vehicle img { object-fit:contain;padding:22px; }
.journal-image:hover img { transform:scale(1.04); }
.journal-image>span { display:none; }
.journal-copy { padding:25px 0; }
.journal-copy h2 { font:500 clamp(1.35rem,1.8vw,1.9rem)/1.25 var(--sans);letter-spacing:-.04em;margin:16px 0; }
.journal-copy h2 a:hover { color:var(--blue); }
.journal-copy>p:not(.eyebrow) { font-size:.88rem;line-height:1.8;color:#54595f;margin-bottom:18px; }
.journal-date { display:block;margin:-5px 0 19px;font:.68rem/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#747b82; }
.reading .page-intro { max-width:1000px; }
.article-byline { margin-top:24px;font:500 .72rem/1.6 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:#66707a; }
.article-hero-image { width:min(1120px,100%);margin:0 0 58px;border-radius:16px;overflow:hidden;background:#dce2e8; }
.article-hero-image img { display:block;width:100%;height:auto;max-height:680px;object-fit:cover; }
.article-content-image { width:100%;margin:0 0 42px;border-radius:14px;overflow:hidden;background:#dce2e8; }
.article-content-image img { display:block;width:100%;height:auto;max-height:460px;object-fit:contain; }
.article-gallery { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0 0 42px; }
.article-gallery.is-single { grid-template-columns:1fr; }
.article-gallery figure { margin:0;aspect-ratio:16/10;border-radius:14px;overflow:hidden;background:#dce2e8; }
.article-gallery img { display:block;width:100%;height:100%;object-fit:cover; }
.reading-layout { display:grid;grid-template-columns:240px minmax(0,860px);gap:60px;border-top:1px solid var(--dark-line);padding-top:45px; }
.reading-nav { align-self:start;position:sticky;top:calc(var(--header-height, 64px) + 31px); }
.reading-nav nav { margin:24px 0; }
.reading-nav nav a { display:flex;gap:14px;padding:15px 0;border-bottom:1px solid var(--dark-line);font-size:.8rem;line-height:1.5; }
.reading-nav nav a>span:first-child { font:.65rem/1.8 var(--mono);color:var(--blue); }
.reading-body section { scroll-margin-top:100px;margin-bottom:42px; }
.reading-body { max-width:80ch; }
.reading-body h2 { font-size:clamp(1.4rem,2.2vw,2rem);font-weight:500;letter-spacing:-.035em;line-height:1.28;margin:2.15em 0 .8em; }
.reading-body > h2:first-child,
.reading-body > section:first-child h2:first-child { margin-top:0; }
.reading-body h3 { font-size:clamp(1.08rem,1.6vw,1.35rem);font-weight:600;letter-spacing:-.025em;line-height:1.35;margin:28px 0 10px;color:var(--navy); }
.reading-body p { font-size:1rem;line-height:1.9;color:#454c54;margin:0 0 1.65em; }
.reading-body p:last-child { margin-bottom:0; }
.reading-body p + h2 { margin-top:2.15em; }
.reading-body p + h3 { margin-top:1.75em; }
.reading-body ul { margin:18px 0 30px;padding-left:22px;color:#454c54; }
.reading-body li { margin:9px 0;font-size:1rem;line-height:1.75; }
.reading-body .line-space-14 { line-height:1.4; }
.reading-body .line-space-16 { line-height:1.6; }
.reading-body .line-space-18 { line-height:1.8; }
.reading-body .line-space-20 { line-height:2; }
.reading-body .line-space-22 { line-height:2.2; }
.article-highlight { margin:30px 0 42px;padding:24px 26px;border-left:4px solid var(--blue);background:rgba(36,82,164,.07);border-radius:0 12px 12px 0;color:var(--navy);line-height:1.75; }
.faq-list { border-top:1px solid var(--dark-line); }
.faq-item { margin:0!important;padding:25px 0;border-bottom:1px solid var(--dark-line); }
.faq-item h3 { margin-top:0; }
.faq-item p:last-child { margin-bottom:0; }
.reading-cta { background:var(--blue);color:#fff;border-radius:14px;padding:30px;margin-top:40px; }
.reading-cta h2 { margin-bottom:25px; }
.next-reading { margin:65px 0;padding:30px 0;border-top:1px solid var(--dark-line); }
.next-reading>a { display:flex;justify-content:space-between;gap:25px;font-size:clamp(1.3rem,2.8vw,2.5rem);letter-spacing:-.035em;line-height:1.3;margin-top:20px; }
@media(max-width:1100px) { .reading-layout { grid-template-columns:190px minmax(0,1fr);gap:35px; } }
@media(max-width:960px) { .journal-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:680px) {
 .journal-grid { grid-template-columns:1fr;gap:18px;padding-bottom:35px; }
 .journal-copy h2 { font-size:1.7rem; }
 .reading-layout { grid-template-columns:1fr;gap:30px;padding-top:25px; }
 .reading-nav { position:static; }
 .reading-body p { font-size:.94rem; }
 .reading-cta { padding:25px; }
 .reading .page-intro h1 { font-size:clamp(2.2rem,9vw,3.5rem); }
 .article-hero-image { margin-bottom:36px;border-radius:10px; }
 .article-content-image { margin-bottom:30px;border-radius:10px; }
 .article-gallery { grid-template-columns:1fr;gap:12px;margin-bottom:30px; }
 .article-gallery figure { border-radius:10px; }
}
@media(prefers-reduced-motion:reduce) { .journal-image img { transition:none; } }

/* Article index: keep the complete introduction and cards within one desktop viewport. */
.article-index-page {
  width:100%;
  max-width:100vw;
  overflow-x:hidden;
}
.article-index-page .about-main {
  box-sizing:border-box;
  width:100%;
  min-height:100vh;
  min-height:100svh;
  padding:calc(var(--header-height, 72px) + clamp(16px,2.4vh,28px)) var(--page-gutter) clamp(18px,2.5vh,28px);
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  align-content:start;
}
.article-index-page .breadcrumb,
.article-index-page .page-intro .eyebrow,
.article-index-page .page-intro .page-lead {
  display:none;
}
.article-index-page .page-intro {
  max-width:none;
  padding:clamp(16px,2.5vh,28px) 0 clamp(18px,3vh,34px);
}
.article-index-page .page-intro h1 {
  margin:0;
  font-size:clamp(2.15rem,4.4vw,5rem);
  line-height:1;
  white-space:nowrap;
  text-wrap:nowrap;
}
.article-index-page .journal-grid {
  align-items:start;
  gap:clamp(18px,2vw,28px);
  padding:0;
}
.article-index-page .journal-card {
  padding-top:clamp(10px,1.5vh,16px);
}
.article-index-page .journal-image {
  height:clamp(180px,29vh,310px);
  aspect-ratio:auto;
}
.article-index-page .journal-copy {
  padding:clamp(12px,1.8vh,20px) 0 0;
}
.article-index-page .journal-copy h2 {
  margin:clamp(8px,1.1vh,12px) 0;
  font-size:clamp(1.2rem,1.55vw,1.7rem);
  line-height:1.2;
}
.article-index-page .journal-copy>p:not(.eyebrow) {
  margin-bottom:clamp(8px,1.2vh,13px);
  font-size:.82rem;
  line-height:1.55;
}
.article-index-page .journal-date {
  margin:0 0 clamp(9px,1.3vh,14px);
}

@media(max-width:680px) {
  .article-index-page .about-main {
    min-height:100svh;
    display:block;
    padding-top:calc(var(--header-height, 62px) + 18px);
  }
  .article-index-page .page-intro {
    padding:16px 0 24px;
  }
  .article-index-page .page-intro h1 {
    font-size:clamp(2.15rem,10vw,3.25rem);
    line-height:1.04;
    white-space:normal;
    text-wrap:balance;
  }
  .article-index-page .journal-image {
    height:auto;
    aspect-ratio:4/3;
  }
  .article-index-page .journal-copy h2 {
    font-size:1.55rem;
  }
}

/* Article detail: balanced title wrapping and consistent reading rhythm. */
.article-detail-page .reading .page-intro {
  max-width:100%;
}
.article-detail-page .reading .page-intro h1 {
  width:min(100%,1600px);
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
  text-wrap:balance;
  font-size:clamp(2.6rem,4.6vw,5rem);
  line-height:1.05;
}
.article-detail-page .reading-body p {
  margin:0 0 1.2em;
  font-size:1rem;
  line-height:1.85;
}
.article-detail-page .reading-body h2 {
  margin:clamp(42px,5vw,64px) 0 clamp(14px,1.6vw,22px);
  line-height:1.22;
}
.article-detail-page .reading-body h2 + p,
.article-detail-page .reading-body p:first-child {
  margin-top:0;
}
.article-detail-page .reading-body section {
  margin-bottom:clamp(34px,4vw,52px);
}
.article-detail-page .reading-body section > h2:first-child {
  margin-top:0;
}
.article-detail-page .reading-body .reading-cta {
  margin-top:clamp(38px,5vw,58px);
}
.article-detail-page .reading-body .reading-cta h2 {
  margin:0 0 25px;
}

@media(max-width:680px) {
  .article-detail-page .reading .page-intro h1 {
    font-size:clamp(2.15rem,9.5vw,3.4rem);
    overflow-wrap:normal;
  }
  .article-detail-page .reading-body p {
    font-size:.96rem;
    line-height:1.8;
  }
  .article-detail-page .reading-body h2 {
    margin-top:38px;
  }
}
