:root{color-scheme:light;--ink:#223d32;--green:#236849;--pale:#eef7f0;--line:#c7d8ca}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:1rem}body{margin:0;background:#fff;color:var(--ink)}a{color:#176039;text-underline-offset:4px}a:hover{text-decoration-thickness:3px}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #926100;outline-offset:4px}.traffic-section-header,main,.traffic-section-footer{max-width:1160px;margin:auto;padding:24px}.traffic-section-header{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-bottom:1px solid var(--line)}.brand{font-size:24px;font-weight:800;text-decoration:none}.brand span{display:block;font-size:14px;font-weight:400}.traffic-section-header nav{display:flex;gap:18px;flex-wrap:wrap;align-items:center}h1{font-size:clamp(32px,5vw,54px);line-height:1.4;letter-spacing:.03em}h2{font-size:30px;line-height:1.5}h3{font-size:23px;line-height:1.6}h4{font-size:21px}p{margin:.7em 0}section{padding:24px 0 36px;border-bottom:1px solid var(--line);scroll-margin-top:16px}.hero{background:var(--pale);border-radius:26px;padding:40px;margin-top:25px}.eyebrow,.tag{font-weight:700;color:var(--green)}.lead{font-size:21px}.notice{border:2px solid #a88736;background:#fffbed;padding:16px;border-radius:12px}.button,button{display:inline-block;border:0;background:var(--green);color:#fff;border-radius:12px;padding:12px 22px;font-size:18px;font-weight:700;text-decoration:none;cursor:pointer}label{display:block;font-weight:600}input,select{display:block;width:100%;font:inherit;padding:12px;border:1px solid #718f79;border-radius:10px;background:white;color:var(--ink);margin:6px 0 16px;min-height:48px}input[type=search]{font-size:23px;padding:18px}.filter-grid,.cards,.money-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));gap:18px}article,.money-grid>div{border:1px solid var(--line);border-radius:18px;padding:22px;background:#fcfefc}article h3{margin:8px 0 18px}article dl div{display:flex;flex-wrap:wrap;gap:4px 15px;justify-content:space-between}dd{margin:0;font-weight:750}dt{font-size:16px}.small{font-size:14px;overflow-wrap:anywhere}.tag{font-size:15px;margin:0}.metric{font-size:52px;font-weight:bold;color:var(--green)}small{font-size:18px}details{padding:18px 0;border-top:1px solid var(--line)}summary{cursor:pointer;font-weight:700}ul{padding-left:1.4em}li,.traffic-section-footer{overflow-wrap:anywhere}.skip{position:absolute;top:-100px;left:16px;background:white;padding:12px;z-index:10}.skip:focus{top:8px}[hidden]{display:none!important}.traffic-section-footer{background:var(--pale);border-radius:20px;font-size:16px;margin-top:32px}#simulator{max-width:550px}@media(max-width:600px){body{font-size:18px}.traffic-section-header,main,.traffic-section-footer{padding:18px}.hero{padding:24px 18px}.traffic-section-header nav{gap:10px 18px;font-size:16px}.lead{font-size:19px}.cards{grid-template-columns:1fr}h2{font-size:26px}.notice{font-size:16px}article{padding:18px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}@media print{form,nav,.button{display:none}.hero{padding:0}body{font-size:12pt}article{break-inside:avoid}}

.catalog-row{margin:22px 0;overflow-wrap:anywhere}.catalog-row h2{font-size:24px}form,select,input{max-width:100%}main{min-width:0}

/* R5: allow narrow grid children and long conditions to wrap. */
.filter-grid>*,.cards>*,.money-grid>*,input,select{min-width:0}h1,h2,h3,p,label{overflow-wrap:anywhere}

/* MOTORCAR_TRAFFIC_TYPOGRAPHY_SYNC_20261023_V2
   BODY typography inherits /assets/css/site.css; shared Header/Footer untouched.
   UI readability sizes apply inside the new division main only. */
main input[type="search"]{font-size:1rem}
main input,main select,main button{font-size:1rem}
main small{font-size:.875em}


/* MOTORCAR_TRAFFIC_UX_V1 — section-local, no shared header/footer changes */
#motorcar-legal-reference-notice.mc-traffic-legal{max-width:1040px;margin:12px auto 20px;padding:0 18px;background:transparent;color:#44505c;border:0;box-sizing:border-box;font-size:13px;line-height:1.7}
.mc-traffic-legal details{border:1px solid #dce2e7;border-radius:8px;background:#f8fafb;padding:10px 14px}
.mc-traffic-legal summary{cursor:pointer;line-height:1.7;list-style:revert}
.mc-traffic-legal summary strong{color:#20262d}
.mc-traffic-legal .mc-traffic-more{display:inline-block;margin-left:10px;color:#b91e30;text-decoration:underline;text-underline-offset:3px}
.mc-traffic-legal .mc-traffic-legal-detail{border-top:1px solid #e0e4e8;margin-top:10px;padding-top:10px;font-size:13px;line-height:1.8}
.mc-traffic-legal .mc-traffic-legal-detail p{margin:.5em 0}
.mc-traffic-legal .mc-traffic-legal-detail a{overflow-wrap:anywhere}
.mc-traffic-pages{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap;margin:26px auto 34px;padding:12px}
.mc-traffic-pages a{border:1px solid #b9c9c0;border-radius:6px;padding:8px 16px;text-decoration:none;color:#176039;font-weight:700}
.mc-traffic-pages a:hover{background:#eef7f0}
.mc-traffic-pages span{font-weight:700;color:#34413a}
.mc-traffic-intro-note{border-left:3px solid #bdc8cf;padding:10px 14px;color:#46515c;background:#f7f9fa}
@media(max-width:600px){#motorcar-legal-reference-notice.mc-traffic-legal{padding:0 12px}.mc-traffic-legal details{padding:10px}.mc-traffic-pages{gap:8px}}

/* MOTORCAR_TRAFFIC_SOURCE_TIDY_V2: unobtrusive source attribution */
.catalog-row > p:last-child{font-size:11px;line-height:1.6;color:#69727b;margin-top:12px;overflow-wrap:anywhere}
.catalog-row > p:last-child a{font-size:inherit;color:#687482;text-decoration:underline;text-underline-offset:2px}
.catalog-row > p:last-child a:hover{color:#b91e30}

/* MOTORCAR_TRAFFIC_PUBLIC_CLEANUP_V1 */
#sources .mc-traffic-sources{border:1px solid #dbe6de;border-radius:12px;padding:12px 16px;margin-top:16px;background:#f9fcfa;}
#sources .mc-traffic-sources summary{cursor:pointer;font-weight:600;}
#sources .mc-traffic-sources ul{margin:14px 0 8px;padding-left:22px;}
#sources .mc-traffic-source-small{font-size:12px;color:#56655c;}

/* MOTORCAR_SOURCE_SMALL_V2 */
#main section ul:has(a[href^="https://"]) {
    font-size: 11px !important;
    line-height: 1.6;
    color: #84908a;
}
#main section ul:has(a[href^="https://"]) a {
    color: #84908a !important;
    text-decoration: none !important;
}
#main section ul:has(a[href^="https://"]) a:hover {
    color: #236849 !important;
    text-decoration: underline !important;
}


/* MOTORCAR_TRAFFIC_HERO_V1 */
.mc-traffic-hero {
    box-sizing: border-box;
    display: block !important;
    width: min(1120px, calc(100% - 32px));
    max-width: 1120px !important;
    margin: 24px auto 34px !important;
    padding: 28px 24px 24px !important;
    background: linear-gradient(125deg,#fff9f9,#fff1f2 65%,#fff9f9);
    border: 1px solid #f3e1e3;
    border-radius: 20px;
    box-shadow: 0 10px 28px rgba(80,40,40,.055);
}

.mc-hero-heading {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 0 12px 26px;
}

.mc-hero-book {
    flex: 0 0 104px;
    width: 104px;
    height: 116px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px 15px 15px 10px;
    background: linear-gradient(145deg,#ff555e,#bf001b 65%,#8e0015);
    color: white;
    box-shadow: 7px 9px 0 #e4c5c7, 10px 13px 20px rgba(130,0,20,.17);
    transform: rotate(-5deg);
    position: relative;
}

.mc-hero-book:after {
    content: "";
    position: absolute;
    left: 9px;
    top: 0;
    bottom: 0;
    width: 3px;
    background: rgba(255,255,255,.28);
}

.mc-hero-book-symbol {
    font-size: 49px;
    line-height: 1;
    color: #fff;
}

.mc-hero-title-wrap {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.mc-traffic-hero .mc-hero-title {
    font-size: clamp(27px,3.7vw,48px) !important;
    font-weight: 850 !important;
    letter-spacing: .035em;
    line-height: 1.25;
    color: #252c33 !important;
    text-decoration: none !important;
}

.mc-hero-english {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .22em;
    color: #78828b;
}

.mc-hero-description {
    margin: 0 0 0 auto !important;
    padding: 10px 0 10px 22px;
    max-width: 250px;
    border-left: 1px solid #e1c6c9;
    font-size: 15px;
    line-height: 1.9;
    color: #34404a;
}

.mc-hero-navigation {
    display: grid !important;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 12px;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
}

.mc-traffic-hero .mc-hero-nav-card {
    box-sizing: border-box;
    min-width: 0;
    display: flex !important;
    align-items: center;
    gap: 10px;
    min-height: 88px;
    padding: 13px 12px !important;
    border: 1px solid #efd5d7;
    border-radius: 13px;
    background: rgba(255,255,255,.94);
    text-decoration: none !important;
    color: #252c33 !important;
    box-shadow: 0 2px 5px rgba(80,40,40,.035);
    transition: border-color .15s,transform .15s,box-shadow .15s;
}

.mc-traffic-hero .mc-hero-nav-card:hover,
.mc-traffic-hero .mc-hero-nav-card:focus-visible {
    border-color: #d72d40;
    transform: translateY(-2px);
    box-shadow: 0 5px 14px rgba(150,30,45,.10);
}

.mc-hero-nav-icon {
    flex: 0 0 35px;
    height: 35px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #fff0f1;
    color: #d8233b;
    font-size: 13px;
    font-weight: 800;
}

.mc-hero-nav-copy {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

.mc-hero-nav-copy strong {
    font-size: 15px;
    line-height: 1.35;
    color: #202831;
}

.mc-hero-nav-copy small {
    font-size: 11px;
    line-height: 1.45;
    color: #65717c;
}

.mc-hero-nav-arrow {
    margin-left: auto;
    color: #d8233b;
    font-size: 27px;
    font-weight: 300;
}

@media(max-width:900px) {
    .mc-hero-heading {
        flex-wrap: wrap;
    }
    .mc-hero-description {
        margin-left: 0 !important;
        max-width: none;
        flex-basis: 100%;
        border-left: 0;
        border-top: 1px solid #e1c6c9;
        padding: 12px 0 0;
    }
    .mc-hero-navigation {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media(max-width:540px) {
    .mc-traffic-hero {
        width: calc(100% - 20px);
        padding: 20px 13px !important;
        border-radius: 16px;
    }
    .mc-hero-heading {
        gap: 16px;
        padding: 0 4px 20px;
    }
    .mc-hero-book {
        flex-basis: 65px;
        width: 65px;
        height: 76px;
    }
    .mc-hero-book-symbol {
        font-size: 32px;
    }
    .mc-traffic-hero .mc-hero-title {
        font-size: 27px !important;
    }
    .mc-hero-english {
        font-size: 8px;
        letter-spacing: .08em;
    }
    .mc-hero-navigation {
        grid-template-columns: 1fr;
        gap: 9px;
    }
    .mc-traffic-hero .mc-hero-nav-card {
        min-height: 68px;
    }
}

/* MOTORCAR_TRAFFIC_NAV_POLISH_V1 */
.mc-traffic-hero .mc-hero-book-symbol {
  font-size: 48px !important; line-height: 1; color: #fff;
  transform: rotate(5deg); display: inline-block;
  filter: grayscale(1) brightness(0) invert(1);
}
.mc-traffic-back-card {
  display: inline-flex !important; align-items: center; gap: 12px;
  min-height: 62px; padding: 9px 16px 9px 10px !important;
  border: 1px solid #e1e9e3; border-radius: 14px;
  background: #f9fbf9; text-decoration: none !important;
  color: #26362e !important; box-shadow: 0 2px 9px rgba(35,65,45,.035);
  transition: background .16s, border-color .16s, box-shadow .16s;
}
.mc-traffic-back-card:hover, .mc-traffic-back-card:focus-visible {
  background: #f1f8f3; border-color: #91bba3;
  box-shadow: 0 4px 14px rgba(35,65,45,.08);
}
.mc-traffic-back-arrow {
  display: grid; place-items: center; width: 40px; height: 40px;
  flex: 0 0 40px; border-radius: 10px; background: #e7f1ea;
  color: #246a47; font-size: 21px;
}
.mc-traffic-back-copy {display: flex; flex-direction: column; gap: 3px; text-align: left;}
.mc-traffic-back-copy strong {font-size: 14px; color: #25372d;}
.mc-traffic-back-copy small {font-size: 11px; color: #75847b;}
.mc-traffic-back-chevron {margin-left: 8px; color: #8ba698; font-size: 22px;}
@media(max-width:540px) {
 .mc-traffic-hero .mc-hero-book-symbol {font-size: 29px !important;}
 .mc-traffic-back-card {max-width: 100%; box-sizing: border-box;}
}


/* MOTORCAR_TRAFFIC_BACK_ALIGN_V1 */

/* Only the catalog navigation wrapper */
main :has(> a.mc-traffic-back-card) {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    text-align: left !important;
    margin-top: 12px !important;
    margin-bottom: 18px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Keep the card at the left */
main a.mc-traffic-back-card {
    margin-left: 0 !important;
    margin-right: auto !important;
    align-self: flex-start !important;
}

/* Reduce spacing before the catalog heading */
main:has(a.mc-traffic-back-card) h1 {
    margin-top: 22px !important;
}


/* MOTORCAR_TRAFFIC_BACK_ALIGN_V2 */

/* Catalog only: header immediately before the main content */
.traffic-section-header:has(+ main#main) {
    width: 100% !important;
    max-width: 1160px !important;
    margin: 0 auto !important;
    padding: 12px 24px 0 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    text-align: left !important;
    border-bottom: 0 !important;
}

/* Left-align the return card */
.traffic-section-header:has(+ main#main) > .mc-traffic-back-card {
    margin: 0 !important;
    align-self: flex-start !important;
}

/* Reduce gap before catalog heading */
.traffic-section-header:has(+ main#main) + main#main {
    padding-top: 10px !important;
}

.traffic-section-header:has(+ main#main) + main#main > h1:first-child {
    margin-top: 14px !important;
}

@media (max-width: 600px) {
    .traffic-section-header:has(+ main#main) {
        padding: 12px 16px 0 !important;
    }
}
