/* Burg Fahrzeughandel – Exposé A4 */
@font-face { font-family: "Barlow"; font-weight: 400; font-display: swap; src: url(../fonts/barlow-latin-400-normal.woff2) format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 600; font-display: swap; src: url(../fonts/barlow-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 700; font-display: swap; src: url(../fonts/barlow-latin-700-normal.woff2) format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 300; font-display: swap; src: url(../fonts/barlow-condensed-latin-300-normal.woff2) format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 600; font-display: swap; src: url(../fonts/barlow-condensed-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 700; font-display: swap; src: url(../fonts/barlow-condensed-latin-700-normal.woff2) format("woff2"); }

:root { --navy: #071341; --blue: #1C509F; --sky: #1D71B8; --ice: #EAF1FA; --line: #DDE3EC; --ink: #101828; --muted: #475467; }
* { box-sizing: border-box; }
html, body { margin: 0; }
body { font-family: "Barlow", Arial, sans-serif; color: var(--ink); background: #D9DEE6; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
img, svg { display: block; max-width: 100%; }

/* Werkzeugleiste (nur Bildschirm) */
.ex-bar { position: sticky; top: 0; z-index: 5; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; padding: 10px 16px; background: var(--navy); color: #fff; }
.ex-bar-t { flex: 1; font-weight: 600; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ex-btn { display: inline-flex; align-items: center; min-height: 42px; padding: 0 16px; border-radius: 8px; border: 0; background: #fff; color: var(--navy); font: 700 15px "Barlow", sans-serif; text-decoration: none; cursor: pointer; }
.ex-btn--ghost { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.4); }
.ex-btn--wa { background: #1F8A4C; color: #fff; }
@media (max-width: 640px) { .ex-bar-t { display: none; } .ex-btn { flex: 1 1 auto; justify-content: center; font-size: 14px; padding: 0 10px; } }

.ex-stage { padding: 24px 12px 48px; display: flex; justify-content: center; }
.ex-page { width: 210mm; min-height: 297mm; background: #fff; box-shadow: 0 30px 60px -30px rgba(7,19,65,.5); display: flex; flex-direction: column; overflow: hidden; }

/* Kopf */
.ex-head { background: var(--navy); color: #fff; padding: 9mm 12mm; display: flex; justify-content: space-between; align-items: center; gap: 8mm; }
.logo { display: inline-flex; align-items: center; gap: 10px; }
.logo .mark { width: 16mm; height: 12mm; }
.wm { display: flex; flex-direction: column; line-height: 1; }
.wm-1 { font-family: "Barlow Condensed", sans-serif; font-weight: 300; font-size: 17px; letter-spacing: .3em; color: #fff; }
.wm-2 { font-family: "Barlow Condensed", sans-serif; font-weight: 600; font-size: 18px; color: #7DB8F0; margin-top: 2px; }
.ex-head-r { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; font-size: 11px; color: #C7D3EA; text-align: right; }
.ex-head-r strong { font-family: "Barlow Condensed", sans-serif; font-size: 20px; font-weight: 700; color: #fff; letter-spacing: .02em; }

/* Titel + Preis */
.ex-title { display: flex; justify-content: space-between; align-items: flex-end; gap: 8mm; padding: 8mm 12mm 5mm; }
.ex-make { font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--sky); }
.ex-title h1 { margin: 1mm 0 0; font-family: "Barlow Condensed", sans-serif; font-weight: 700; font-size: 30px; line-height: 1.02; }
.ex-extras { margin: 2mm 0 0; font-size: 12px; color: var(--muted); }
.ex-price { flex: none; background: var(--blue); color: #fff; border-radius: 3mm; padding: 4mm 6mm; text-align: right; display: flex; flex-direction: column; }
.ex-price small { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: #CFE0F5; }
.ex-price strong { font-family: "Barlow Condensed", sans-serif; font-size: 34px; line-height: 1; margin: 1mm 0; }
.ex-price span { font-size: 10px; color: #CFE0F5; }

/* Fotos */
.ex-photos { display: grid; gap: 2.5mm; padding: 0 12mm; height: 88mm; }
.ex-photos--3 { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; }
.ex-photos--3 figure:first-child { grid-row: 1 / 3; }
.ex-photos--2 { grid-template-columns: 1fr 1fr; }
.ex-photos--1 { grid-template-columns: 1fr; }
.ex-photos figure { margin: 0; border-radius: 2.5mm; overflow: hidden; background: var(--ice); min-height: 0; }
.ex-photos img { width: 100%; height: 100%; object-fit: cover; }
.ex-nophoto { display: flex; align-items: center; justify-content: center; }

/* Eckdaten */
.ex-facts { list-style: none; margin: 5mm 12mm 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); gap: 2mm; }
.ex-facts li { background: var(--ice); border-radius: 2.5mm; padding: 3mm 2.5mm; display: flex; flex-direction: column; gap: 1mm; }
.ex-facts small { font-size: 9px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.ex-facts strong { font-size: 12.5px; line-height: 1.15; }

/* Spalten */
.ex-cols { display: grid; grid-template-columns: 1fr 1.15fr; gap: 8mm; padding: 6mm 12mm 0; flex: 1; }
.ex-cols h2 { margin: 0 0 2.5mm; font-family: "Barlow Condensed", sans-serif; font-size: 19px; font-weight: 700; color: var(--navy); border-bottom: 2px solid var(--sky); padding-bottom: 1.5mm; }
.ex-table { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.ex-table th { text-align: left; font-weight: 400; color: var(--muted); padding: 1.6mm 0; }
.ex-table td { text-align: right; font-weight: 600; padding: 1.6mm 0; }
.ex-table tr + tr { border-top: 1px solid var(--line); }
.ex-fin { margin-top: 4mm; border: 1px solid var(--line); border-left: 3px solid var(--sky); border-radius: 2mm; padding: 3mm 4mm; display: flex; flex-direction: column; gap: .5mm; }
.ex-fin small { font-size: 9px; letter-spacing: .12em; text-transform: uppercase; color: var(--sky); font-weight: 700; }
.ex-fin strong { font-family: "Barlow Condensed", sans-serif; font-size: 20px; }
.ex-fin span { font-size: 9px; color: var(--muted); line-height: 1.35; }
.ex-feats { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 5mm; font-size: 11px; }
.ex-feats li { break-inside: avoid; padding: 1mm 0 1mm 4.5mm; position: relative; line-height: 1.3; }
.ex-feats li::before { content: ""; position: absolute; left: 0; top: 2.2mm; width: 2.2mm; height: 1.2mm; border-left: 1.6px solid #1F8A4C; border-bottom: 1.6px solid #1F8A4C; transform: rotate(-45deg); }
.ex-small { font-size: 10px; color: var(--muted); margin: 2mm 0 0; }

/* Online + Kontakt */
.ex-online { margin: 6mm 12mm 0; display: grid; grid-template-columns: 24mm 1fr auto; gap: 5mm; align-items: center; background: var(--ice); border-radius: 3mm; padding: 4mm 5mm; }
.ex-qr { width: 24mm; height: 24mm; background: #fff; padding: 1.5mm; border-radius: 1.5mm; }
.ex-qr svg { width: 100%; height: 100%; }
.ex-online > div { display: flex; flex-direction: column; gap: .8mm; font-size: 11px; color: var(--muted); }
.ex-online strong { font-size: 14px; color: var(--ink); }
.ex-url { color: var(--blue); font-weight: 600; word-break: break-all; }
.ex-contact { text-align: right; }
.ex-contact span { font-size: 14px; color: var(--ink) !important; font-weight: 600; }

.ex-foot { margin-top: 6mm; background: var(--navy); color: #C7D3EA; padding: 4mm 12mm; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1.5mm 6mm; font-size: 10px; }
.ex-foot strong { color: #fff; }
.ex-legal { width: 100%; font-size: 8.5px; color: #8FA0C2; }

@page { size: A4 portrait; margin: 0; }
@media print {
	body { background: #fff; }
	.ex-bar { display: none !important; }
	.ex-stage { padding: 0; display: block; }
	.ex-page { width: 210mm; height: 297mm; min-height: 0; box-shadow: none; zoom: 1 !important; page-break-after: avoid; }
}
