/* Controlli e risultati del catalogo remoto, coerenti con la landing partner. */
.search-layout { display:grid; grid-template-columns:.75fr 1.25fr; gap:10%; }
.search-copy > p:not(.eyebrow) { margin-top:24px; color:var(--muted); font-size:17px; }
.search-form { border-top:2px solid var(--ink); padding-top:22px; }
.search-fields { display:grid; grid-template-columns:1fr 1fr; gap:20px 22px; }
.search-field { position:relative; }
.search-field select { padding-right:40px; }
.field-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.search-field.is-loading::after { content:""; position:absolute; right:14px; bottom:17px; width:14px; height:14px; border:2px solid rgba(56,142,60,.25); border-top-color:var(--green-dark); border-radius:50%; animation:catalog-spin .7s linear infinite; pointer-events:none; }
@keyframes catalog-spin { to { transform:rotate(360deg); } }
.catalog-result { grid-column:1/-1; margin-top:34px; padding-top:27px; border-top:1px solid #88a98f; }
.catalog-error strong { display:block; font-size:18px; }
.catalog-error p { max-width:62ch; margin-top:5px; color:var(--muted); }
.catalog-retry { min-height:44px; margin-top:14px; padding:8px 18px; border:1px solid var(--ink); background:transparent; color:var(--ink); font-weight:700; cursor:pointer; }
.catalog-retry:hover { color:#fff; background:var(--ink); }
.result-heading h3 { font-size:38px; }
.result-path { padding-top:7px; color:var(--green-dark); font-weight:700; }
.vehicle-details { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin:28px 0 0; padding:18px 0; border-top:1px solid #a5b5a8; border-bottom:1px solid #a5b5a8; }
.vehicle-details dt { color:var(--muted); font-size:12px; font-weight:700; }
.vehicle-details dd { margin:4px 0 0; font-weight:700; }
.performance-result { margin-top:31px; }
.performance-result h4 { font:600 27px/1.1 "Plex Condensed",sans-serif; }
.stage-switcher { display:inline-flex; margin-top:15px; overflow:hidden; border:1px solid #718579; border-radius:var(--control-radius); }
.stage-switcher button { min-width:96px; min-height:42px; padding:8px 18px; border:0; border-right:1px solid #718579; background:transparent; color:var(--ink); font-weight:700; cursor:pointer; }
.stage-switcher button:last-child { border-right:0; }
.stage-switcher button[aria-pressed="true"] { color:#fff; background:var(--green-dark); }
.performance-metrics { display:flex; flex-wrap:wrap; gap:18px 44px; margin:24px 0 0; }
.performance-metrics > div { display:grid; grid-template-columns:auto auto; gap:1px 16px; }
.performance-metrics dt { grid-column:1/-1; color:var(--muted); font-size:12px; font-weight:700; }
.performance-metrics dd { display:flex; align-items:baseline; gap:5px; margin:0; font-size:18px; font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap; }
.performance-arrow { font-weight:700; }
.performance-increase { align-self:center; margin:0; font-size:13px; font-weight:700; font-variant-numeric:tabular-nums; }
.performance-metric--power .performance-increase { color:#1f5fbf; }
.performance-metric--torque .performance-increase { color:var(--red); }
.performance-chart { width:min(100%,920px); min-width:0; margin:25px 0 0; }
.performance-chart figcaption { font-size:13px; font-weight:700; }
.performance-chart svg { display:block; width:100%; height:auto; margin-top:7px; overflow:visible; background: white; border-radius: 10px;}
.chart-grid { stroke:#bac7bc; stroke-width:1; }
.chart-axis { font:600 11px/1 "Plex Sans",sans-serif; font-variant-numeric:tabular-nums; }
.chart-axis--power { fill:#6f8fbd; }
.chart-axis--torque { fill:#bd7479; }
.chart-unit { font:700 12px/1 "Plex Sans",sans-serif; }
.chart-unit--power { fill:#6f8fbd; }
.chart-unit--torque { fill:#bd7479; }
.chart-line { fill:none; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
.chart-line--original { stroke-width:2; stroke-dasharray:8 7; }
.chart-line--modified { stroke-width:2.25; }
.chart-line--power-original { stroke:#6f8fbd; }
.chart-line--power-modified { stroke:#1f5fbf; }
.chart-line--torque-original { stroke:#bd7479; }
.chart-line--torque-modified { stroke:var(--red); }
.chart-legend { display:flex; flex-wrap:wrap; gap:8px 22px; margin-top:7px; color:var(--muted); font-size:12px; font-weight:700; }
.chart-legend span::before { content:""; display:inline-block; width:20px; height:0; margin-right:7px; border-top:3px solid #6b756f; vertical-align:middle; }
.chart-legend .legend-power-original::before { border-top-color:#6f8fbd; border-top-style:dashed; }
.chart-legend .legend-torque-original::before { border-top-color:#bd7479; border-top-style:dashed; }
.chart-legend .legend-power-modified::before { border-top-color:#1f5fbf; }
.chart-legend .legend-torque-modified::before { border-top-color:var(--red); }
.curve-note, .catalog-date { color:var(--muted); font-size:12px; }
.curve-note { margin-top:17px; max-width: initial; }
.catalog-date { margin-top:20px; }
.performance-unavailable { margin-top:15px; color:var(--muted); }

/* Il bianco separa la ricerca dalle due fasce paper adiacenti; il rosso richiama il marchio. */
.search{background:var(--white);border-block:1px solid var(--line)}
.search-copy .eyebrow::after{content:"";display:block;width:40px;height:3px;margin-top:18px;background:var(--red)}
/* Le colonne si riducono senza allargare il viewport. */
.search-layout>*{min-width:0}.search-form select{width:100%;min-width:0;min-height:51px;padding:11px 40px 11px 13px;background:#fff;border:1px solid var(--line);font:inherit;color:var(--ink)}
.search-form select:focus-visible{outline:2px solid var(--green-dark);outline-offset:2px}
.search-form select:disabled{background:#eff2ee;color:#52645a}
.result-path{overflow-wrap:anywhere}
@media(max-width:1150px){.search-layout{grid-template-columns:1fr;gap:35px}}
@media(max-width:760px){.search-fields{grid-template-columns:1fr}.vehicle-details{grid-template-columns:repeat(2,minmax(0,1fr))}.result-heading h3{font-size:30px}.stage-switcher{max-width:100%;flex-wrap:wrap}.stage-switcher button{min-width:80px}.search-copy p{font-size:16px}}
@media(prefers-reduced-motion:reduce){.search-field.is-loading::after{animation:none}}