@import url("brand.css");
:root{--ink:#171819;--blue:#3D4246;--blue-d:#3D4246;--line:#D9DADC;--mute:#62666A;--bg:#F5F5F5}
*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;font-family:"Avenir Next",Avenir,"Segoe UI",sans-serif;color:var(--ink);background:#fff;overflow-x:hidden;font-size:16px;line-height:1.6}
a{color:var(--blue-d)}button,input,select,textarea{font:inherit}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
header.top{background:#111315;color:#fff;position:sticky;top:0;z-index:5}
.bar{max-width:1000px;margin:auto;padding:0 16px;height:60px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.logo{display:block;width:220px;height:55px;font-size:0;font-weight:900;letter-spacing:-1.5px;color:transparent;text-decoration:none;white-space:nowrap;background:url("branding/crossingcar-horizontal-white.png") left center/contain no-repeat}.logo span{color:transparent}
.bar nav{display:flex;gap:16px;font-size:14px}.bar nav a{color:#cfe6fb}
main{max-width:1000px;margin:auto;padding:24px 16px 80px}
h1{font-size:clamp(30px,7vw,52px);letter-spacing:-1.5px;line-height:1.05;margin:8px 0 12px}
h2{font-size:22px;margin:0 0 12px}
.eyebrow{font-size:12px;letter-spacing:2px;text-transform:uppercase;font-weight:700;color:#3D4246}
.lead{color:var(--mute);line-height:1.6;max-width:640px}
.card{border:1px solid var(--line);border-radius:16px;padding:20px;margin:20px 0;background:#fff}
.card.dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.field{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1 1 220px}
.field label{font-size:13px;font-weight:700}
.field input,.field select,.field textarea{border:1px solid #b9c4cf;border-radius:10px;padding:12px;width:100%;background:#fff;color:var(--ink);min-height:46px}
.field textarea{min-height:90px;resize:vertical}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:#b3261e}
.err{color:#b3261e;font-size:12px;min-height:0}
.pend input{background:#f1f5f9;border-style:dashed}
.btn{border:0;border-radius:6px;padding:13px 22px;font-weight:700;cursor:pointer;background:#171819;color:#fff;min-height:46px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
.btn.alt{background:#fff;color:var(--ink);border:1px solid var(--ink)}.btn.ghost{background:transparent;color:#171819;border:1px solid #3D4246}
.btn:disabled{opacity:.55;cursor:not-allowed}
.status{padding:12px 14px;border-radius:10px;margin:12px 0;font-size:14px;line-height:1.5;border-left:4px solid var(--blue);background:#eaf5ff}
.status.error{background:#fdecea;border-color:#b3261e;color:#7a1510}.status.ok{background:#e8f6ee;border-color:#1b7f4b;color:#0f4d2d}.status.warn{background:#fff6e0;border-color:#b57800;color:#5e4000}
.status[hidden]{display:none}
.status:not(.warn):not(.error):not(.ok){border-color:#3D4246;background:#F5F5F5;color:#3D4246}
.badge.blue{background:#F5F5F5;border-color:#B5B8BC;color:#3D4246}
.bar nav a{color:#E5E6E7}
.logo span{color:transparent!important}
.badges{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.badge{font-size:12px;font-weight:800;padding:6px 10px;border-radius:999px;border:1px solid var(--ink)}
.badge.blue{background:var(--blue);border-color:var(--blue);color:#fff}
.meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px;font-size:13px;color:var(--mute);margin:10px 0}
.meta b{color:var(--ink);display:block}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.skel{height:14px;border-radius:6px;background:linear-gradient(90deg,#e6ebf0,#f4f7fa,#e6ebf0);background-size:200% 100%;animation:sk 1.2s infinite;margin:10px 0}
@keyframes sk{to{background-position:-200% 0}}
.list{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.list li{border:1px solid var(--line);border-radius:12px;padding:12px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center;overflow-wrap:anywhere}
.check{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.5;margin:14px 0}.check input{width:20px;height:20px;margin-top:2px;flex:none}
.hp{position:absolute;left:-9999px}
.note{font-size:13px;color:var(--mute);line-height:1.55}.dark .note{color:#b8c7d6}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media(max-width:600px){.bar nav a:not(:last-child){display:none}.btn{width:100%}.row .btn{flex:1 1 100%}}
@media(prefers-reduced-motion:reduce){.skel{animation:none}}