* { box-sizing: border-box; }
:root {
  color-scheme: dark;
  font-family: Inter, Aptos, "Segoe UI", system-ui, sans-serif;
  font-synthesis: none;
  --gutter: clamp(1rem, 4.6vw, 5rem);
  --content: 91rem;
  --mono: "Cascadia Code", "SFMono-Regular", Consolas, monospace;
  --canvas: #161a16;
  --panel: #20271f;
  --panel-strong: #242e23;
  --ink: #f6f7ef;
  --muted: #c4cdbd;
  --rule: #434d40;
  --accent: #dcefa4;
  --on-accent: #1b2411;
}
body { margin: 0; background: var(--canvas); color: var(--ink); }
a { color: inherit; }
img { display: block; width: 100%; height: auto; }
button { color: inherit; font: inherit; }
button, summary { cursor: pointer; }
[hidden] { display: none !important; }
:where(a, button, summary):focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
:where(h1, h2, h3, p, figure, dl, dd, ul) { margin: 0; }
h1, h2, h3 { text-wrap: balance; }
p { line-height: 1.65; }
main [id] { scroll-margin-top: 1rem; }
.wrap { width: min(100%, var(--content)); margin-inline: auto; padding-inline: var(--gutter); }
.mono { color: var(--accent); font: 600 .72rem/1.42 var(--mono); text-transform: uppercase; letter-spacing: .12em; }
.intro { max-width: 54ch; color: var(--muted); font-size: clamp(.96rem, 1.45vw, 1.16rem); }
.arrow { width: 1.05em; height: 1.05em; flex: none; }
.skip-link { position: absolute; z-index: 10; top: .5rem; left: .5rem; transform: translateY(-180%); padding: .7rem 1rem; background: var(--accent); color: var(--on-accent); font-weight: 700; }
.skip-link:focus { transform: none; }

.site-header { position: relative; z-index: 2; background: #111510; border-bottom: 1px solid #374133; }
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: .65rem 1.5rem; min-height: 4.45rem; }
.brand { display: inline-flex; align-items: center; gap: .57rem; min-width: 0; text-decoration: none; font-size: clamp(.97rem, 2.45vw, 1.19rem); font-weight: 800; letter-spacing: -.045em; }
.mark { width: 6.4rem; height: 3.4rem; flex: none; }
.nav-wide { display: flex; align-items: center; gap: clamp(.9rem, 2.45vw, 2.65rem); }
.nav-wide a, .nav-narrow a { font-size: .88rem; font-weight: 650; text-decoration: none; }
.nav-wide a:hover:not(.action), .nav-narrow a:hover { text-decoration: underline; text-underline-offset: .3em; }
.mobile-nav { display: none; }
.mobile-nav summary { list-style: none; }
.mobile-nav summary::-webkit-details-marker { display: none; }
.mobile-nav summary svg { width: 1.1rem; height: 1.1rem; }
.nav-narrow { padding: .5rem var(--gutter) .8rem; background: #111510; border-block: 1px solid var(--rule); }
.nav-narrow a { display: flex; align-items: center; min-height: 2.8rem; }
.nav-narrow a + a { border-top: 1px solid var(--rule); }
.action, .text-link { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; min-height: 2.9rem; line-height: 1.3; font-size: .88rem; font-weight: 750; text-decoration: none; }
.action { padding: .55rem 1rem; color: var(--on-accent); background: var(--accent); border: 1px solid transparent; text-align: center; }
.action:hover { background: #edf8cd; }
.action.outline { color: var(--accent); background: transparent; border-color: #79876a; }
.action.outline:hover { background: var(--panel-strong); }
.text-link { width: fit-content; text-align: left; }
.text-link:hover { text-decoration: underline; text-underline-offset: .25em; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .35rem 1.12rem; align-items: center; margin-top: 1.4rem; }

.terrain-hero { position: relative; isolation: isolate; background: #1b2219; overflow: clip; }
.terrain-visual { position: absolute; z-index: -1; inset: 0; }
.terrain-image { width: 82%; height: 100%; margin-left: auto; object-fit: cover; object-position: 61% 48%; }
.terrain-visual::before {
  position: absolute; inset: 0; content: "";
  background: linear-gradient(90deg,#1b2219 2%,#1b2219f7 18%,#182018d4 39%,#17201642 67%,transparent 85%),
    linear-gradient(0deg,#121612a6,transparent 24%);
}
.terrain-hero .wrap { position: relative; min-height: clamp(27rem, 43vw, 42rem); padding-top: clamp(3.2rem, 7.8vw, 8rem); padding-bottom: clamp(3.7rem, 7.8vw, 8rem); }
.hero-label { display: flex; align-items: center; gap: .7rem; margin-bottom: 1.05rem; }
.hero-label::before { content: ""; display: block; flex: 0 0 1.6rem; height: 1px; background: currentColor; }
.terrain-hero h1 { max-width: 13ch; margin-bottom: 1.15rem; font-size: clamp(2.65rem, 7.1vw, 7.25rem); line-height: .95; letter-spacing: -.078em; text-wrap: unset; }
.terrain-hero h1 span { display: block; color: var(--accent); }
.terrain-hero .intro { max-width: 43ch; color: #e6edde; }
.terrain-hero .image-caption { position: absolute; right: max(var(--gutter), calc((100% - var(--content)) / 2 + var(--gutter))); bottom: 1.15rem; padding: .45rem .62rem; background: #171e15e3; color: var(--ink); font: 600 .69rem/1.35 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.terrain-index { background: #20281e; border-block: 1px solid #46513c; }
.terrain-index .wrap { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); }
.terrain-index a { display: flex; align-items: center; min-height: 4.25rem; gap: .65rem 1rem; padding: .55rem .45rem .55rem 0; text-decoration: none; font-size: clamp(.83rem, 1.3vw, 1rem); font-weight: 700; }
.terrain-index a + a { border-left: 1px solid #46513c; padding-left: clamp(.75rem, 2vw, 2rem); }
.terrain-index a:hover span:last-child { text-decoration: underline; text-underline-offset: .25em; }

.section { padding-block: clamp(2.6rem, 6.1vw, 5.7rem); }
.section-head { margin-bottom: clamp(1.15rem, 2.3vw, 2rem); }
.section-head .mono { margin-bottom: .45rem; }
.section-head h2, .block-heading h2, .contact h2 { font-size: clamp(1.95rem, 4.5vw, 3.7rem); line-height: 1.04; letter-spacing: -.055em; }
.vehicle-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: clamp(.9rem, 1.7vw, 1.5rem); }
.vehicle-card { display: flex; flex-direction: column; min-width: 0; background: var(--panel); border: 1px solid var(--rule); text-decoration: none; }
.vehicle-card:hover { border-color: #7b896d; }
.vehicle-card img { aspect-ratio: 3/2; object-fit: cover; }
.vehicle-copy { display: flex; flex: 1; flex-direction: column; padding: clamp(.95rem, 2vw, 1.48rem); }
.vehicle-copy .mono { margin-bottom: .52rem; }
.vehicle-copy h3 { margin-bottom: .45rem; font-size: clamp(1.28rem, 2.15vw, 1.76rem); letter-spacing: -.038em; line-height: 1.1; text-wrap: unset; }
.vehicle-copy .text-link { margin-top: auto; color: var(--accent); }
.vehicle-card:is(:hover, :focus-visible) .text-link { text-decoration: underline; text-underline-offset: .25em; }

.technology { background: #20271f; border-block: 1px solid var(--rule); }
.technology-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.94fr); align-items: center; gap: 1.35rem clamp(1.5rem,5.4vw,5rem); }
.technology-photo { padding: .55rem; border: 1px solid var(--rule); background: #151a15; }
.technology-photo img { aspect-ratio: 3/2; object-fit: cover; }
.technology .block-heading { margin-bottom: 1.2rem; }
.technology-description { max-width: 60ch; color: var(--muted); font-size: clamp(1rem, 1.25vw, 1.1rem); }
.technology-description p { line-height: 1.55; text-wrap: pretty; }
.technology-description p + p { margin-top: .8rem; }

.gallery-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: clamp(.8rem, 1.7vw, 1.45rem); }
.vehicle-gallery { grid-template-columns: repeat(5,minmax(0,1fr)); }
.gallery-link { position: relative; display: flex; flex-direction: column; height: 100%; background: var(--panel); text-decoration: none; border: 1px solid var(--rule); }
.gallery-link:hover { border-color: #7b896d; }
.gallery-link img { aspect-ratio: 3/2; object-fit: cover; }
.gallery-index, .gallery-zoom { position: absolute; top: .45rem; color: var(--ink); background: #131a13e8; }
.gallery-index { left: .45rem; padding: .3rem .4rem; }
.gallery-zoom { right: .45rem; width: 1.7rem; height: 1.7rem; padding: .27rem; }
.vehicle-gallery .gallery-link:is(:hover, :focus-visible) .gallery-zoom { color: #151a15; background: var(--accent); }
.gallery-caption { display: flex; flex: 1; align-items: center; justify-content: space-between; gap: .6rem; min-height: 2.8rem; padding: .64rem .78rem; font-size: .83rem; line-height: 1.35; }
.gallery-caption svg { width: .95rem; height: .95rem; flex: none; color: var(--accent); }
.gallery-dialog { width: min(72rem, calc(100% - 1.25rem)); max-width: none; max-height: calc(100% - 1.25rem); padding: 0; border: 1px solid #61705b; background: #121712; color: var(--ink); }
.gallery-dialog::backdrop { background: #090d09d9; }
.lightbox-toolbar { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .42rem .65rem; }
.lightbox-toolbar .mono { margin-left: .25rem; }
.lightbox-button { display: grid; place-items: center; min-width: 2.75rem; min-height: 2.75rem; border: 1px solid var(--rule); background: var(--panel); }
.lightbox-button:hover { background: var(--panel-strong); }
.lightbox-button svg { width: 1.12rem; height: 1.12rem; }
.lightbox-image { width: 100%; max-height: min(69vh, 50rem); object-fit: contain; background: #0d110d; }
.lightbox-footer { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: .4rem .8rem; padding: .55rem .65rem; }
.lightbox-caption { grid-column: 2; color: var(--muted); font-size: .86rem; text-align: center; }

.breadcrumb { padding-block: .85rem; border-bottom: 1px solid var(--rule); color: var(--muted); font-size: .82rem; }
.breadcrumb .wrap { display: flex; align-items: center; flex-wrap: wrap; gap: .28rem .58rem; }
.breadcrumb a { display: inline-flex; align-items: center; min-height: 2rem; text-underline-offset: .25em; }
.vehicle-hero { border-bottom: 1px solid var(--rule); background: radial-gradient(ellipse at right 25%,#283525,#1b211a 65%,#191e18); }
.vehicle-hero .wrap { display: grid; grid-template-columns: minmax(0,.89fr) minmax(0,1.11fr); gap: clamp(1.2rem,4vw,4rem); align-items: center; padding-block: clamp(2rem,4.6vw,4.5rem); }
.vehicle-hero h1 { margin: .58rem 0 .8rem; font-size: clamp(2.35rem,5.15vw,5.65rem); line-height: .99; letter-spacing: -.067em; text-wrap: unset; }
.vehicle-cover { border: 1px solid var(--rule); }
.vehicle-cover img { aspect-ratio: 3/2; object-fit: cover; }
.details-grid { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); align-items: start; gap: clamp(.8rem,1.7vw,1.45rem); }
.details-grid > section { min-width: 0; min-height: 6.5rem; padding: clamp(1rem,2vw,1.6rem); border: 1px solid var(--rule); background: var(--panel); }
.details-grid .block-heading { margin-bottom: .8rem; }
.details-grid .block-heading h2 { font-size: clamp(1.4rem,2.8vw,2.2rem); }
.vehicle-description p { color: var(--muted); }
.vehicle-description p + p { margin-top: .7rem; }
.vehicle-description h3 { margin-block: 1.15rem .4rem; font-size: 1.03rem; }
.vehicle-description .vehicle-source { margin-top: 1.1rem; padding-top: .75rem; border-top: 1px solid var(--rule); font-size: .86rem; }
.vehicle-source a { color: var(--accent); text-underline-offset: .23em; }
.spec-table { width: 100%; border-collapse: collapse; background: var(--panel); font-size: clamp(.82rem,1.4vw,.96rem); line-height: 1.45; }
.spec-table th, .spec-table td { padding: .78rem clamp(.7rem,1.8vw,1.15rem); text-align: left; vertical-align: top; border-bottom: 1px solid var(--rule); overflow-wrap: anywhere; }
.spec-table thead th, .spec-table .spec-group th { background: var(--panel-strong); color: var(--accent); }
.spec-table .spec-group th { padding-block: .55rem; }
.spec-table tbody th[scope="row"] { width: 43%; font-weight: 600; color: var(--muted); }
.vehicle-gallery-section { background: #1b211a; border-block: 1px solid var(--rule); }
.related { padding-block: clamp(1.8rem,4.3vw,3.5rem); }
.related .mono { margin-bottom: .6rem; }
.related-links { display: flex; align-items: center; flex-wrap: wrap; gap: .28rem 1.45rem; }

/* The supplied badge strip is reused without altering its artwork. */
.certification { background: #1b211a; border-top: 1px solid var(--rule); }
.certificates { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: clamp(.8rem,1.55vw,1.4rem); padding: 0; list-style: none; }
.certificate { min-width: 0; border: 1px solid var(--rule); background: var(--panel); }
.certificate-visual { display: grid; place-items: center; min-height: 6.5rem; padding: .72rem; background: #fdfdfd; }
.certificate-mark {
  display: block;
  width: min(100%, var(--badge-width, 5rem));
  aspect-ratio: var(--badge-ratio);
  background: url("img/certyfikacja-moto-truck.png") var(--badge-position) / var(--badge-scale) auto no-repeat;
}
.certificate-mark--ncage { --badge-ratio: 444/263; --badge-scale: 461.261%; --badge-position: 3.429% 39.130%; --badge-width: 8.35rem; }
.certificate-mark--iso-9001 { --badge-ratio: 265/265; --badge-scale: 772.830%; --badge-position: 30.735% 39.560%; --badge-width: 5.1rem; }
.certificate-mark--aqap { --badge-ratio: 279/266; --badge-scale: 734.050%; --badge-position: 48.332% 39.779%; --badge-width: 5.1rem; }
.certificate-mark--iso-45001 { --badge-ratio: 267/266; --badge-scale: 767.041%; --badge-position: 65.020% 39.779%; --badge-width: 5.1rem; }
.certificate-mark--iso-14001 { --badge-ratio: 437/250; --badge-scale: 468.650%; --badge-position: 90.006% 36.548%; --badge-width: 8.35rem; }
.certificate-copy { padding: .88rem .85rem 1.02rem; }
.certificate-copy h3 { font-size: clamp(.95rem, 1.4vw, 1.14rem); letter-spacing: -.025em; text-wrap: unset; }

.contact { padding-block: clamp(2.4rem,5vw,4.7rem); border-top: 1px solid var(--rule); background: var(--panel-strong); }
.contact .wrap { display: flex; align-items: center; justify-content: space-between; gap: 1rem 2rem; }
.contact .mono { margin-bottom: .5rem; }
.contact-actions { display: flex; flex-wrap: wrap; gap: .45rem 1.1rem; }
.contact-actions a { overflow-wrap: anywhere; }
.site-footer { border-top: 1px solid var(--rule); background: #111510; padding-block: 1.3rem; }
.site-footer .wrap { display: flex; align-items: center; justify-content: space-between; gap: .65rem 1.25rem; flex-wrap: wrap; }
.site-footer .mark { width: 1.8rem; height: 1.8rem; }
.site-footer p { color: var(--muted); font-size: .83rem; }
.site-footer a:not(.brand) { text-underline-offset: .23em; }

@media (max-width: 70rem) {
  .vehicle-grid, .gallery-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 67rem) {
  .certificates { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 55rem) {
  .contact .wrap { align-items: start; flex-direction: column; }
}
@media (max-width: 47rem) {
  .site-header .wrap { min-height: 3.85rem; }
  .site-header .brand span { overflow-wrap: anywhere; }
  .nav-wide { display: none; }
  .mobile-nav { display: block; flex: none; }
  .mobile-nav summary { display: inline-flex; align-items: center; gap: .35rem; min-height: 2.75rem; padding: .38rem .65rem; border: 1px solid var(--rule); font-size: .79rem; font-weight: 700; }
  .nav-narrow { position: absolute; inset: 100% 0 auto; }
  .terrain-hero .wrap { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; min-height: clamp(24rem, 104vw, 33rem); padding-block: 2.7rem 3.35rem; }
  .terrain-hero h1 { font-size: clamp(2.35rem, 8.8vw, 4.7rem); overflow-wrap: anywhere; }
  .terrain-visual::before {
    background: linear-gradient(180deg,#151c1517 0%,#111a1199 36%,#131a13e8 100%),
      linear-gradient(90deg,#111a1166,#111a1114 70%,transparent);
  }
  .terrain-image { width: 100%; object-position: 42% 50%; }
  .terrain-hero .image-caption { bottom: .62rem; }
  .terrain-index .wrap { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .terrain-index a { min-height: 3.15rem; gap: .5rem; }
  .terrain-index a span:last-child { overflow-wrap: anywhere; }
  .terrain-index a:nth-child(odd) { padding-left: 0; border-left: 0; }
  .terrain-index a:nth-child(n+3) { border-top: 1px solid #46513c; }
  .technology-grid, .vehicle-hero .wrap, .details-grid { grid-template-columns: minmax(0,1fr); }
  .technology-photo { grid-row: 2; }
  .vehicle-hero h1 { font-size: clamp(2.32rem,8.7vw,4.45rem); }
}
@media (max-width: 38rem) {
  .certificates { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 34rem) {
  .vehicle-grid { grid-template-columns: minmax(0,1fr); }
  .gallery-grid { gap: .65rem; }
  .gallery-caption { padding: .58rem; }
  .gallery-caption svg { display: none; }
  .lightbox-footer { padding-inline: .4rem; }
}
@media (prefers-reduced-motion: no-preference) {
  :where(a, button, summary) { transition: background-color .18s, border-color .18s; }
  html { scroll-behavior: smooth; }
}
@media print {
  :root { color-scheme: light; --canvas: white; --panel: white; --panel-strong: #eee; --ink: #111; --muted: #333; --accent: #252525; --rule: #ccc; }
  .site-header, .breadcrumb, .site-footer, .contact, .related, .vehicle-gallery-section, .hero-actions, .skip-link { display: none; }
  .vehicle-hero { background: white; }
  .vehicle-hero .wrap { grid-template-columns: 1fr 1fr; }
  .vehicle-hero h1 { font-size: 27pt; }
  .section { padding-block: 1.1rem; }
  .details-grid { display: block; }
  .specification { margin-top: 1.1rem; }
  .spec-table tr { break-inside: avoid; }
}