.tr-finder-page { min-block-size: 70vh; padding-block-end: var(--tr-space-20); background: var(--tr-bg); }
.tr-finder-hero { padding-block: clamp(56px, 8vw, 100px); background: var(--tr-near-black); color: var(--tr-white); }
.tr-finder-hero__inner { max-inline-size: 900px; }
.tr-finder-hero .tr-eyebrow { color: var(--tr-brand-primary-border); }
.tr-finder-hero h1 { max-inline-size: 760px; margin-block-end: var(--tr-space-4); }
.tr-finder-hero p:last-child { max-inline-size: 720px; margin: 0; color: var(--tr-footer-text); font-size: 1.1rem; }
.tr-finder-layout { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(280px, .75fr); gap: var(--tr-space-8); margin-block-start: -40px; align-items: start; }
.tr-finder-card, .tr-finder-help, .tr-vehicle-result { border: 1px solid var(--tr-border); border-radius: var(--tr-radius-lg); background: var(--tr-surface); box-shadow: var(--tr-shadow-card); }
.tr-finder-card { padding: clamp(24px, 4vw, 48px); }
.tr-finder-card__header { display: flex; justify-content: space-between; gap: var(--tr-space-4); align-items: start; }
.tr-finder-card__header h2 { margin: 0; }
.tr-link-button, .tr-finder-unsure { min-block-size: 44px; border: 0; background: transparent; color: var(--tr-brand-primary); font-weight: 750; text-decoration: underline; text-underline-offset: 4px; }
.tr-finder-progress { block-size: 5px; margin-block: var(--tr-space-6); overflow: hidden; border-radius: 99px; background: var(--tr-surface-2); }
.tr-finder-progress span { display: block; inline-size: 20%; block-size: 100%; border-radius: inherit; background: var(--tr-brand-primary); transition: inline-size var(--tr-transition); }
.tr-finder-status { min-block-size: 24px; margin-block-end: var(--tr-space-4); color: var(--tr-text-2); }
.tr-finder-error { padding: var(--tr-space-4); margin-block-end: var(--tr-space-4); border: 1px solid var(--tr-error-border); border-radius: var(--tr-radius-sm); background: var(--tr-error-bg); color: var(--tr-error); }
.tr-finder-step { margin-block-end: var(--tr-space-5, 20px); }
.tr-finder-step label { display: flex; align-items: center; gap: var(--tr-space-2); margin-block-end: var(--tr-space-2); font-weight: 750; }
.tr-finder-step label span { inline-size: 28px; block-size: 28px; display: inline-grid; place-items: center; border-radius: 99px; background: var(--tr-brand-primary-subtle); color: var(--tr-brand-primary); font-size: .78rem; }
.tr-finder-step select:disabled { background: var(--tr-surface-2); }
.tr-finder-actions { display: flex; gap: var(--tr-space-3); margin-block-start: var(--tr-space-6); }
.tr-finder-actions .tr-button[type="submit"] { margin-inline-start: auto; }
.tr-finder-unsure { margin-block-start: var(--tr-space-4); }
.tr-finder-help { padding: var(--tr-space-6); }
.tr-finder-help h2 { font-size: 1.35rem; }
.tr-finder-help ul { padding-inline-start: 1.2rem; color: var(--tr-text-2); }
.tr-finder-help li + li { margin-block-start: var(--tr-space-3); }
.tr-vehicle-result { padding: clamp(24px, 4vw, 48px); margin-block-start: var(--tr-space-8); }
.tr-vehicle-result:focus { outline: 2px solid var(--tr-brand-primary); outline-offset: 4px; }
.tr-vehicle-result__actions { display: flex; flex-wrap: wrap; gap: var(--tr-space-3); }
@media (max-width: 900px) { .tr-finder-layout { grid-template-columns: 1fr; } .tr-finder-help { order: 2; } }
@media (max-width: 600px) { .tr-finder-hero { padding-block: 48px 72px; } .tr-finder-layout { margin-block-start: -32px; } .tr-finder-card { padding: 20px 16px; } .tr-finder-card__header { align-items: center; } .tr-finder-actions { display: grid; grid-template-columns: 1fr; } .tr-finder-actions .tr-button[type="submit"] { margin: 0; } .tr-finder-actions .tr-button { inline-size: 100%; } .tr-vehicle-result__actions { display: grid; } }