/* The journal inherits the service typography, navigation and footer.
   Existing articles, supplied photographs and native reading links are retained. */
.blog-page {
  --journal-paper: #ffffff;
  --journal-ink: #0f1520;
  --journal-muted: #526071;
  --journal-rule: rgba(10, 35, 66, .14);
  --blog-ink: #0a2342;
  --blog-muted: #526071;
  --blog-line: var(--journal-rule);
  --blog-paper: #f4f6fb;
}
.blog-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.journal-shell { width: min(calc(100% - clamp(2.5rem, 7vw, 5rem)), 1200px); margin: 0 auto; }
.blog-page main > .journal-shell { padding-bottom: clamp(3rem, 7vw, 5rem); }
.journal-page-heading { padding-block: clamp(1.55rem, 3.5vw, 3rem) 1.25rem; }
.journal-page-title { margin: 0; color: #0f1520; font-size: clamp(2.1rem, 1.5rem + 3vw, 3.8rem); font-weight: 780; letter-spacing: -.035em; line-height: 1.06; text-wrap: balance; }
.journal-topics-nav { display: flex; align-items: center; gap: 1rem; margin-bottom: clamp(1.75rem, 3.5vw, 2.75rem); padding-block: .35rem; border-bottom: 1px solid var(--journal-rule); }
.journal-topics-nav__links { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem 1.5rem; }
.journal-topics-nav a { display: inline-flex; align-items: center; min-height: 44px; color: #526071; font-size: .9rem; font-weight: 600; text-decoration: none; }
.journal-topics-nav a:hover, .journal-topics-nav a[aria-current="page"] { color: #0a2342; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .55rem; }
.journal-topics-nav a[aria-current="page"] { font-weight: 750; }
.blog-page button.blog-search-icon { display: grid; place-items: center; width: 44px; height: 44px; flex-shrink: 0; margin-left: auto; padding: 11px; border: 0; border-radius: 6px; background: transparent; color: #0a2342; cursor: pointer; }
.blog-search-icon svg { display: block; width: 22px; height: 22px; }
.blog-page button.blog-search-icon:hover, .blog-page button.blog-search-icon[aria-expanded="true"] { background: #e7ebf0; }
.journal-layout { display: grid; grid-template-columns: minmax(0, 2.28fr) minmax(0, 1fr); gap: clamp(2rem, 4vw, 3.5rem); align-items: start; }
.blog-page .blog-feed { min-width: 0; border: 0; padding: 0; }
.blog-page .blog-feed__heading { display: block; }
.blog-page [data-blog-status]:not(:empty) { margin-bottom: 1.5rem; color: var(--journal-muted); }
.blog-page .blog-empty { display: block; margin: 0; padding: 0; background: none; border-radius: 0; }
.journal-story { min-width: 0; margin-bottom: clamp(2.5rem, 5vw, 4rem); scroll-margin-top: 6rem; }
.journal-story__image-link { display: block; overflow: hidden; background: #f4f6fb; }
.journal-story__image { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 0; }
.journal-story__image.blog-hero__image { aspect-ratio: 1.2844; object-position: 50% 30%; }
.journal-story__copy { padding-top: 1.1rem; text-align: left; }
.journal-story__meta { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem 1rem; margin: 0 0 .65rem; color: #526071; font-size: .82rem; line-height: 1.5; }
.blog-empty .journal-story__meta { max-width: none; }
.journal-story__meta > a { display: inline-flex; align-items: center; min-height: 44px; }
.journal-topic-link, .journal-author-link { text-underline-offset: .22em; }
.journal-topic-link { color: #0a2342; font-weight: 650; text-decoration: none; }
.journal-author-link { text-decoration: underline; }
.journal-topic-link:hover, .journal-author-link:hover { color: #265a94; text-decoration: underline; }
.blog-page .journal-story :is(h2, h3) { margin: 0 0 .9rem; color: #0f1520; font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.65rem); font-weight: 750; letter-spacing: -.025em; line-height: 1.1; text-wrap: balance; overflow-wrap: break-word; }
.journal-story :is(h2, h3) a { text-decoration: none; }
.journal-story :is(h2, h3) a:hover { color: #265a94; }
.blog-page .journal-story__excerpt { max-width: 65ch; margin: 0; color: rgba(15, 21, 32, .68); font-size: clamp(1rem, .95rem + .25vw, 1.08rem); line-height: 1.75; }
.journal-story__link { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; margin-top: 1.3rem; padding: .75rem 1.5rem; border-radius: 6px; background: var(--accent-gradient); color: #ffffff; font-size: .95rem; font-weight: 700; line-height: 1.3; text-decoration: none; }
.journal-story__link:hover { background: var(--accent-gradient-dark); }
.journal-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.75rem 2rem; }
.journal-grid .journal-story { margin-bottom: 0; }
.journal-grid .journal-story__image { aspect-ratio: 5 / 3; }
.blog-page .journal-grid .journal-story :is(h2, h3) { font-size: clamp(1.45rem, 1.15rem + .65vw, 1.8rem); line-height: 1.18; }
.blog-page .journal-grid .journal-story__excerpt { font-size: 1rem; }
.journal-preview-note { margin-top: 2.75rem; padding-top: 1.5rem; border-top: 1px solid var(--journal-rule); color: var(--journal-muted); font-size: .9rem; line-height: 1.6; }
.journal-preview-note p + p { margin-top: .4rem; }
.journal-aside { min-width: 0; }
.journal-about { scroll-margin-top: 6rem; container-type: inline-size; }
.journal-about__welcome { display: flex; flex-direction: column; width: 100%; min-width: 0; background: #0a2342; color: #ffffff; padding: clamp(1rem, 6cqw, 1.5rem); text-align: center; }
.journal-about__campaign { width: 100%; }
.journal-about__campaign-meta { display: flex; justify-content: space-between; align-items: center; gap: .5rem; font-size: clamp(.65rem, 3cqw, .8rem); font-weight: 650; line-height: 1.3; }
.journal-about__campaign-meta :is(a, span) { display: inline-flex; align-items: center; min-height: 44px; white-space: nowrap; }
.journal-about__book { text-decoration: underline; text-underline-offset: .25em; }
.journal-about__headlights { display: block; width: 100%; height: auto; aspect-ratio: 3 / 1; object-fit: contain; }
.journal-about__welcome h2 { margin: .5rem 0 0; color: #ffffff; font-size: clamp(1.75rem, 15.5cqw, 3.8rem); font-weight: 750; letter-spacing: -.035em; line-height: 1.1; }
.journal-about__welcome a:focus-visible { outline-color: #ffffff; }
.journal-social-icons { display: flex; justify-content: center; align-items: center; gap: .5rem; margin-top: 1.25rem; padding: 0; }
.journal-social-icon { display: grid; place-items: center; width: 44px; height: 44px; flex-shrink: 0; color: #ffffff; }
.journal-social-icon svg { display: block; width: 22px; height: 22px; }
.journal-social-icon:hover { opacity: .8; }
.journal-about__copy { margin-top: .5rem; }
.journal-about__copy p { font-size: .95rem; line-height: 1.75; }
.journal-about__copy a { display: inline-flex; align-items: center; min-height: 44px; gap: .5rem; color: #0a2342; font-size: .9rem; font-weight: 600; text-decoration: underline; text-underline-offset: .25em; }
.journal-about__copy svg { width: 16px; height: 16px; flex-shrink: 0; }
.journal-recent, .journal-aside-section { margin-top: 2.5rem; scroll-margin-top: 6rem; }
.journal-recent h2, .journal-aside-section h2, .journal-booking h2 { margin: 0 0 1rem; font-size: clamp(1.35rem, 1.1rem + .55vw, 1.65rem); font-weight: 750; letter-spacing: -.025em; line-height: 1.2; }
.journal-recent ul, .journal-service-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--journal-rule); }
.journal-recent li, .journal-service-list li { border-bottom: 1px solid var(--journal-rule); }
.journal-recent a, .journal-service-list a { display: flex; align-items: center; min-height: 44px; padding-block: 1rem; color: #526071; font-size: .95rem; line-height: 1.6; overflow-wrap: break-word; text-decoration: none; }
.journal-recent a:hover, .journal-service-list a:hover { color: #0a2342; text-decoration: underline; text-underline-offset: .2em; }
.journal-service-list svg { width: 18px; height: 18px; margin-left: auto; flex-shrink: 0; }
.journal-booking { margin-top: 2.5rem; padding: 1.5rem; background: #f4f6fb; }
.journal-booking p { color: #526071; font-size: .95rem; line-height: 1.75; }
.journal-booking a { display: inline-flex; align-items: center; min-height: 44px; margin-top: .75rem; color: #0a2342; font-size: .95rem; font-weight: 650; text-decoration: underline; text-underline-offset: .25em; }
.journal-discover { margin-top: clamp(3rem, 6vw, 4.5rem); padding-top: 2.5rem; border-top: 1px solid var(--journal-rule); }
.journal-discover h2 { margin-bottom: 1.75rem; font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.65rem); font-weight: 750; letter-spacing: -.025em; line-height: 1.1; }
.journal-discover__links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; }
.journal-discover__links a { font-size: 1.2rem; font-weight: 700; line-height: 1.4; text-decoration: none; }
.journal-discover__links img { display: block; width: 100%; height: auto; aspect-ratio: 8 / 5; object-fit: cover; margin-bottom: 1rem; }
.journal-discover__links .journal-discover__fleet-image { object-position: center bottom; }
.journal-discover__links a:hover { color: #265a94; }
.journal-topic-back { margin-bottom: 1.25rem; color: #526071; font-size: .9rem; }
.journal-topic-back a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; text-underline-offset: .25em; }
.blog-page .blog-tools { margin: 0 0 2rem; }
.blog-page .blog-cta { padding-block: clamp(2.5rem, 5vw, 4rem) clamp(4.5rem, 8vw, 6rem); background: #f4f6fb; color: #0f1520; }
.blog-page .blog-cta__layout { width: min(calc(100% - clamp(2.5rem, 7vw, 5rem)), 1200px); margin-inline: auto; }
.blog-page .blog-cta h2 { font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.65rem); font-weight: 750; line-height: 1.1; letter-spacing: -.025em; }
.blog-page .blog-cta p { color: #526071; line-height: 1.75; }
.blog-page .blog-button--light { border-radius: 6px; background: var(--accent-gradient); color: #ffffff; font-weight: 700; text-decoration: none; }
.blog-page .blog-button--light:hover { background: var(--accent-gradient-dark); }
/* Preserve the supplied photographs and their focal points. */
[data-blog-post="benzinpreise-2026"] .journal-story__image { aspect-ratio: 5115 / 6148; }
[data-blog-post="winterreifenpflicht-deutschland-2026"] .journal-story__image { aspect-ratio: 1; }
[data-blog-post="jp-performance"] .journal-story__image { object-position: 50% 12%; }
.journal-topic-page [data-blog-post="e-auto-praemie-2026"] .journal-story__image,
.journal-topic-page [data-blog-post="benzinpreise-2026"] .journal-story__image,
.journal-topic-page [data-blog-post="winterreifenpflicht-deutschland-2026"] .journal-story__image { aspect-ratio: auto; object-fit: contain; }
@media (min-width: 700px) {
  .blog-page:not(.journal-topic-page) .journal-grid > .journal-story:last-child:nth-child(odd) { grid-column: 1 / -1; width: calc((100% - 2rem) / 2); justify-self: center; }
}
@media (max-width: 959px) {
  .journal-shell, .blog-page .blog-cta__layout { width: calc(100% - 2.5rem); }
  .journal-layout { grid-template-columns: minmax(0, 1fr); gap: 3rem; }
  .journal-aside { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 2rem; padding-top: 2rem; border-top: 1px solid var(--journal-rule); }
  .journal-aside > * { margin-top: 0; }
  .journal-story__image.blog-hero__image { max-height: 36rem; }
  .journal-topics-nav__links { gap: .25rem 1.2rem; }
}
@media (max-width: 699px) {
  .journal-shell, .blog-page .blog-cta__layout { width: calc(100% - 2rem); }
  .journal-page-heading { padding-top: 1.5rem; }
  .journal-page-title { font-size: clamp(2.05rem, 9.2vw, 2.85rem); line-height: 1.02; }
  .journal-topics-nav__links { gap: .1rem 1.1rem; }
  .journal-topics-nav { margin-bottom: 1.75rem; }
  .journal-topics-nav a { font-size: .85rem; }
  .journal-story__image.blog-hero__image { aspect-ratio: 4 / 5; max-height: none; }
  .journal-grid, .journal-aside, .journal-discover__links { grid-template-columns: minmax(0, 1fr); }
  .journal-grid { gap: 2.5rem; }
  .journal-story__copy { padding-top: .65rem; }
  .blog-page .journal-grid .journal-story :is(h2, h3) { font-size: 1.75rem; }
  .journal-about { width: min(100%, 24rem); }
  .journal-discover__links { gap: 2rem; }
}
