/* Car Dealers EU public course. Edit alongside src/content/courses/what-cars-to-avoid.html. */
:root { --course-ink:#20211f; --course-muted:#686962; --course-line:#dedfd7; --course-gold:#8a641d; --course-paper:#f7f7f2; }
html { scroll-behavior:smooth; }
body.avoid-course { margin:0; color:var(--course-ink); background:#fff; font-family:"Inter Variable",Inter,ui-sans-serif,system-ui,sans-serif; line-height:1.65; }
.avoid-course * { box-sizing:border-box; }
.avoid-course [hidden] { display:none!important; }
.avoid-course a { color:inherit; text-underline-offset:4px; }
.avoid-course button,.avoid-course input { font:inherit; }
.avoid-course button,.avoid-course summary { cursor:pointer; }
.avoid-course :focus-visible { outline:2px solid #8a641d; outline-offset:5px; }
.avoid-course ::selection { background:#f6cf78; color:#20211f; }
.avoid-course [id] { scroll-margin-top:100px; }
.course-header { display:flex; align-items:center; gap:22px; padding:24px max(24px,calc((100vw - 1280px)/2)); border-bottom:1px solid var(--course-line); background:white; }
.course-header img { width:182px; height:auto; }
.course-header > span { border-left:1px solid #d9dbd4; padding-left:22px; color:var(--course-muted); font-size:13px; }
.course-header .header-link { margin-left:auto; font-size:13px; font-weight:600; text-decoration:none; }
.header-link span { margin-left:20px; }
.avoid-hero { position:relative; min-height:610px; overflow:hidden; color:white; background:#252a24; isolation:isolate; }
.hero-photo { position:absolute; z-index:-2; width:100%; height:100%; object-fit:cover; object-position:65% 58%; }
.hero-shade { position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(17,22,18,.95) 0%,rgba(17,22,18,.83) 30%,rgba(17,22,18,.18) 74%),linear-gradient(0deg,rgba(17,22,18,.8),transparent 35%); }
.hero-inner { max-width:1280px; margin:auto; padding:54px 0 88px; }
.hero-meta { font-size:12px; color:#d2d7cd; margin:0 0 30px; }
.avoid-hero h1 { font-size:clamp(68px,7.6vw,108px); line-height:1.02; letter-spacing:-.04em; font-weight:680; margin:0; }
.hero-deck { font-size:18px; line-height:1.65; color:#f1f2eb; margin:26px 0; }
.course-button { display:inline-flex; align-items:center; justify-content:space-between; gap:28px; padding:16px 20px; background:#f6cf78; color:#20211f!important; font-size:14px; font-weight:650; border-radius:7px; text-decoration:none; transition:background-color 160ms,transform 180ms; }
.course-button:hover { background:#edbd58; transform:translateY(-2px); }
.hero-note { font-size:12px; line-height:1.8; color:#cbd1c4; margin:22px 0 0; }
.hero-credit { position:absolute; bottom:16px; right:28px; left:28px; text-align:right; font-size:10px; color:#e1e4dc; }
.hero-credit a { text-decoration:underline; }
.course-layout { display:grid; grid-template-columns:180px minmax(0,1fr); gap:72px; max-width:1280px; margin:auto; padding-inline:0; }
.course-sidebar { padding-top:84px; }
.course-sidebar nav { display:flex; flex-direction:column; position:sticky; top:32px; gap:16px; }
.course-sidebar nav a { font-size:12px; color:var(--course-muted); text-decoration:none; transition:color 150ms; }
.course-sidebar nav a:hover { color:var(--course-gold); }
.course-sidebar > p { border-top:1px solid var(--course-line); padding-top:20px; font-size:12px; line-height:1.8; color:var(--course-muted); margin-top:36px; }
.course-body { min-width:0; }
.course-section { padding:84px 0; border-bottom:1px solid var(--course-line); }
.course-section h2 { font-size:clamp(32px,3.2vw,46px); line-height:1.12; letter-spacing:-.035em; font-weight:680; margin:0 0 26px; text-wrap:balance; }
.course-section p { font-size:14px; line-height:1.85; margin:0 0 18px; max-width:75ch; }
.course-section .lead { font-size:19px; line-height:1.7; max-width:65ch; color:#42443e; }
.three-rules { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; margin-top:42px; }
.three-rules > div > span { color:var(--course-gold); font-size:12px; font-variant-numeric:tabular-nums; }
.three-rules h3 { font-size:17px; letter-spacing:-.02em; font-weight:650; margin:10px 0; }
.three-rules p { font-size:13px; color:var(--course-muted); }
.stop-rule { padding:22px 26px; margin-top:28px; background:#f7f2e8; border-radius:8px; }
.stop-rule strong { font-size:14px; font-weight:650; }
.stop-rule p { margin:8px 0 0; font-size:13px; color:#665539; max-width:none; }
.section-heading { display:flex; justify-content:space-between; gap:28px; align-items:end; margin-bottom:30px; }
.section-heading h2 { margin:0; }
.section-heading > p { font-size:12px; line-height:1.8; color:var(--course-muted); margin:0 0 3px; flex-shrink:0; }
.dossier-controls { margin-top:32px; padding:24px 0 16px; border-block:1px solid var(--course-line); display:flex; flex-wrap:wrap; gap:18px; align-items:end; }
.course-search { display:block; font-size:12px; font-weight:600; flex:1; min-width:240px; }
.course-search input { display:block; width:100%; margin-top:7px; padding:12px 14px; min-height:46px; border:1px solid #d9dbd4; border-radius:7px; background:#fdfdfb; font-size:14px; outline-offset:3px; }
.risk-filters { display:flex; gap:5px; flex-wrap:wrap; }
.risk-filters button { border:0; padding:11px 12px; min-height:44px; border-radius:6px; background:transparent; color:#686962; font-size:12px; white-space:nowrap; transition:background-color 150ms,color 150ms; }
.risk-filters button:hover { background:#f2f2ec; }
.risk-filters button[aria-pressed="true"] { background:#20211f; color:#fff; }
#risk-count { width:100%; font-size:11px; color:var(--course-muted); margin:0; }
.course-section .photo-scope { font-size:11px; color:var(--course-muted); margin:14px 0 0; }
.risk-dossier { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr); gap:28px 32px; padding:42px 0; border-bottom:1px solid var(--course-line); }
.risk-dossier > figure { margin:0; min-width:0; }
.risk-dossier > figure > img { width:100%; height:auto; aspect-ratio:16/11; object-fit:cover; border-radius:7px; background:#f1f1eb; }
.risk-dossier figcaption { margin-top:8px; font-size:10px; color:#686962; line-height:1.6; overflow-wrap:anywhere; }
.dossier-index { display:flex; align-items:center; gap:16px; margin-bottom:16px; font-size:11px; color:var(--course-muted); }
.dossier-index > span:first-child { color:var(--course-gold); font-variant-numeric:tabular-nums; font-weight:600; }
.dossier-copy h3 { font-size:26px; line-height:1.18; letter-spacing:-.03em; font-weight:650; margin:0 0 12px; text-wrap:balance; }
.dossier-copy .variant { font-size:12px; color:var(--course-muted); margin:0 0 18px; }
.dossier-copy > p { font-size:13px; }
.source-ref { font-size:11px; font-weight:600; color:var(--course-gold)!important; text-decoration:none; white-space:nowrap; }
.source-ref:hover { text-decoration:underline; }
.dossier-copy .buying-gate { font-size:14px; font-weight:650; margin:20px 0 0; padding-top:16px; border-top:1px solid #e8e8e1; }
.dossier-details { grid-column:1/-1; margin-top:0; }
.dossier-details summary { display:flex; align-items:center; justify-content:space-between; gap:14px; font-size:13px; font-weight:600; list-style:none; padding:14px 0; }
.dossier-details summary::-webkit-details-marker { display:none; }
.dossier-details summary > span { font-size:22px; line-height:1; font-weight:400; color:var(--course-gold); transition:transform 180ms; }
.dossier-details[open] summary > span { transform:rotate(45deg); }
.details-body { display:grid; grid-template-columns:1fr 1fr; gap:36px; padding:16px 0 0; }
.details-body h4 { font-size:13px; font-weight:700; margin:22px 0 8px; }
.details-body h4:first-child { margin-top:0; }
.details-body p,.details-body li { font-size:13px; line-height:1.85; color:#565952; }
.details-body ul { padding-left:18px; list-style:disc; }
.details-body li { margin-bottom:8px; }
#risk-empty { padding:36px 0; }
.course-section .section-footnote { font-size:12px; color:var(--course-muted); margin-top:26px; }
.market-signals { display:grid; grid-template-columns:1fr 1fr; gap:40px; margin:36px 0 44px; }
.market-signals > div { padding-top:20px; border-top:2px solid #ba8828; }
.market-place { font-size:11px; color:var(--course-muted); display:block; }
.market-signals strong { display:block; font-size:64px; line-height:1.2; letter-spacing:-.04em; font-weight:600; margin-top:14px; font-variant-numeric:tabular-nums; }
.market-signals h3 { font-size:17px; font-weight:650; margin:10px 0; }
.market-signals p { font-size:13px; color:#565952; }
.subheading { font-size:24px; line-height:1.25; letter-spacing:-.025em; font-weight:650; margin:0 0 18px; }
.price-watch { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:28px 0 12px; }
.price-watch figure { margin:0; min-width:0; }
.price-watch img { width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; border-radius:6px; }
.price-watch figcaption { margin-top:12px; font-size:13px; }
.price-watch figcaption > span { display:block; font-weight:600; }
.price-watch figcaption > strong { display:block; margin-top:4px; font-size:27px; font-weight:550; letter-spacing:-.03em; }
.price-watch small { display:block; margin-top:8px; font-size:9px; line-height:1.6; color:var(--course-muted); overflow-wrap:anywhere; }
.course-section .market-source { font-size:11px; color:var(--course-muted); }
.market-practice,.local-test { margin-top:42px; }
.market-practice h3,.local-test h3 { font-size:24px; line-height:1.3; letter-spacing:-.025em; font-weight:650; margin:0 0 18px; }
.market-practice ol { padding-left:20px; list-style:decimal; }
.market-practice li { padding-left:8px; margin-bottom:18px; font-size:14px; line-height:1.85; }
.table-scroll { overflow-x:auto; }
.local-test table { width:100%; text-align:left; border-collapse:collapse; min-width:500px; font-size:12px; }
.local-test th { padding:14px; background:#f4f4ee; font-weight:650; }
.local-test td { padding:16px 14px; border-bottom:1px solid var(--course-line); vertical-align:top; line-height:1.8; }
.local-test td:first-child { width:45%; }
.bid-workspace { display:grid; grid-template-columns:1.4fr 1fr; gap:36px; padding:28px; background:#f4f4ee; border-radius:10px; margin-top:30px; }
.example-label { font-size:11px!important; color:var(--course-muted); }
.bid-inputs { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.bid-inputs label { font-size:11px; font-weight:600; line-height:1.6; }
.bid-inputs input { display:block; width:100%; min-width:0; background:white; border:1px solid #d3d5c9; border-radius:6px; min-height:44px; padding:10px 12px; font-size:16px; margin-top:7px; font-variant-numeric:tabular-nums; }
.bid-result { display:flex; flex-direction:column; justify-content:center; border-left:1px solid #d7d9cd; padding-left:30px; }
.bid-result > p:first-child { font-size:12px; font-weight:600; }
.bid-result output { font-size:48px; font-weight:650; line-height:1.2; letter-spacing:-.04em; margin-bottom:20px; font-variant-numeric:tabular-nums; }
.bid-result #bid-stress { font-size:12px; color:#686962; }
.bid-result a { margin-top:18px; font-size:12px; font-weight:600; color:var(--course-gold); }
.viewing-list { padding:0; margin:32px 0 0; list-style:none; }
.viewing-list li { display:grid; grid-template-columns:20px 30px minmax(0,1fr); gap:16px; padding:24px 0; border-top:1px solid var(--course-line); }
.viewing-list input { width:20px; height:20px; accent-color:#8a641d; margin-top:4px; cursor:pointer; }
.viewing-list li > span { color:var(--course-gold); font-size:12px; line-height:28px; font-variant-numeric:tabular-nums; }
.viewing-list label { font-size:15px; font-weight:650; cursor:pointer; }
.viewing-list p { margin:6px 0 0; font-size:13px; color:var(--course-muted); }
.viewing-list li:has(input:checked) label { text-decoration:line-through; color:#686962; }
.text-button { padding:10px 0; background:transparent; border:0; color:var(--course-gold); font-size:12px; text-decoration:underline; text-underline-offset:4px; }
.sources-section > p { color:var(--course-muted); }
.methodology,.image-credits { border-block:1px solid var(--course-line); margin:24px 0; }
.methodology summary,.image-credits summary { font-size:14px; font-weight:650; padding:18px 0; }
.methodology > div,.image-credits > div { padding:0 0 20px; }
.methodology p,.image-credits p,.image-credits li { font-size:12px; color:var(--course-muted); }
.image-credits li { margin-bottom:16px; overflow-wrap:anywhere; }
.sources-list { list-style:none; padding:0; margin:30px 0; }
.sources-list li { display:grid; grid-template-columns:30px minmax(0,1fr); gap:12px; padding:16px 0; border-bottom:1px solid #e9e9e3; }
.sources-list li > span { font-size:11px; color:var(--course-gold); }
.sources-list a { font-size:12px; font-weight:600; }
.sources-list p { font-size:11px; color:var(--course-muted); margin:5px 0 0; }
.course-footer { padding:44px 0 64px; display:flex; flex-wrap:wrap; align-items:center; gap:28px; }
.course-footer img { width:160px; height:auto; }
.course-footer p { font-size:13px; color:var(--course-muted); margin:0; }
.course-footer > a { margin-left:auto; font-size:12px; }
@media(prefers-reduced-motion:no-preference) { .hero-inner { animation:course-arrive 650ms cubic-bezier(.16,1,.3,1) both; } .dossier-details[open] .details-body { animation:course-arrive 220ms cubic-bezier(.16,1,.3,1); } }
@keyframes course-arrive { from{opacity:.55;transform:translateY(12px);} to{opacity:1;transform:translateY(0);} }
@media(max-width:1350px) { .hero-inner { padding-inline:32px; } .course-layout { padding-inline:32px; gap:44px; grid-template-columns:155px minmax(0,1fr); } }
@media(max-width:1050px) { .course-layout { grid-template-columns:minmax(0,1fr); } .course-sidebar { padding-top:28px; } .course-sidebar nav { flex-direction:row; flex-wrap:wrap; gap:10px 24px; position:static; } .course-sidebar > p { display:none; } .course-section { padding-block:64px; } .course-layout { gap:0; } }
@media(max-width:700px) {
 .course-header { padding:20px; gap:14px; } .course-header img { width:145px; } .course-header > span { font-size:11px; padding-left:14px; } .course-header .header-link { display:none; }
 .avoid-hero { min-height:620px; } .hero-photo { object-position:64% 50%; } .hero-shade { background:linear-gradient(90deg,rgba(17,22,18,.92),rgba(17,22,18,.6)),linear-gradient(0deg,rgba(17,22,18,.8),transparent); }
 .hero-inner { padding:40px 22px 94px; } .hero-meta { font-size:10px; max-width:32ch; margin-bottom:30px; } .avoid-hero h1 { font-size:64px; } .hero-deck { font-size:16px; margin-top:24px; } .hero-credit { font-size:9px; text-align:left; left:22px; right:22px; bottom:18px; }
 .course-layout { padding-inline:22px; } .course-sidebar nav { gap:10px 18px; } .course-sidebar nav a { font-size:11px; }
 .course-section { padding-block:50px; } .course-section h2 { font-size:34px; } .course-section .lead { font-size:17px; } .section-heading { display:block; } .section-heading > p { margin-top:18px; }
 .three-rules { grid-template-columns:1fr; gap:16px; margin-top:30px; } .three-rules > div { border-top:1px solid #e5e6dd; padding-top:16px; } .three-rules h3 { display:inline-block; margin-left:16px; } .three-rules p { margin-top:2px; }
 .stop-rule { padding:20px; } .dossier-controls { gap:14px; } .risk-filters { gap:2px; width:100%; } .risk-filters button { padding-inline:11px; } .risk-dossier { grid-template-columns:minmax(0,1fr); gap:22px; padding-block:32px; } .risk-dossier > figure > img { aspect-ratio:16/10; } .dossier-copy h3 { font-size:25px; } .dossier-index { margin-bottom:12px; }
 .details-body { grid-template-columns:1fr; gap:18px; } .dossier-details { margin-top:-8px; } .dossier-details summary { font-size:12px; }
 .market-signals { grid-template-columns:1fr; gap:28px; } .market-signals strong { font-size:58px; } .price-watch { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 14px; } .price-watch figcaption > strong { font-size:26px; }
 .bid-workspace { grid-template-columns:minmax(0,1fr); padding:22px; gap:24px; } .bid-inputs { grid-template-columns:1fr; gap:15px; } .bid-result { border-left:0; border-top:1px solid #d7d9cd; padding:24px 0 0; } .bid-result output { font-size:46px; }
 .viewing-list li { grid-template-columns:20px 22px minmax(0,1fr); gap:12px; } .viewing-list label { font-size:14px; } .course-footer { gap:20px; } .course-footer > a { margin-left:0; }
}
@media(prefers-reduced-motion:reduce) { html {scroll-behavior:auto;} .course-button,.dossier-details summary > span {transition:none;} .course-button:hover {transform:none;} }
@media print {
 @page {size:A4;margin:18mm;} html {scroll-behavior:auto;} .course-header,.course-sidebar,.dossier-controls,.course-button,.text-button {display:none!important;} .avoid-hero {min-height:210mm; break-after:page; print-color-adjust:exact; -webkit-print-color-adjust:exact;} .hero-inner {padding:20mm 12mm;} .avoid-hero h1 {font-size:60pt;} .hero-photo {height:100%;} .course-layout {display:block;padding:0;} .course-section {padding:10mm 0; break-inside:auto;} .course-section h2 {font-size:26pt;} .course-section p,.details-body p,.details-body li {font-size:10pt;} .risk-dossier {break-before:page; display:block;} .risk-dossier > figure {max-width:135mm;margin-bottom:6mm;} .risk-dossier figure img {max-height:72mm;width:100%;object-fit:cover;} .dossier-copy h3 {font-size:23pt;} details > :not(summary) {display:block!important;} .details-body {columns:2;column-gap:10mm;} .details-body > div {break-inside:avoid;} .dossier-details summary {display:none;} .risk-dossier[hidden] {display:block!important;} .market-section,.bid-section,.viewing-section,.sources-section {break-before:page;} .price-watch {grid-template-columns:repeat(4,1fr);} .market-signals strong {font-size:38pt;} .bid-workspace {display:block;} .bid-result {border:0;padding:8mm 0 0;} .bid-inputs {grid-template-columns:1fr 1fr;} .table-scroll {overflow:visible;} .local-test table {min-width:0;} .source-ref {font-size:8pt;} .sources-list li {break-inside:avoid;} .course-footer {display:none;}
}