/* /fits and /fits/<machine> (Nov 11 2026): on top of the content-page kit in pp-tuning.css */
.fit-hero{position:relative}
.fit-stat{font-size:clamp(26px,3.2vw,40px)!important}
.fit-hero-car{position:absolute;right:max(var(--gut),calc((100vw - 1360px)/2 + var(--gut)));bottom:0;width:clamp(260px,30vw,460px);pointer-events:none;z-index:0}
.fit-hero-car img{display:block;width:100%;height:auto}
.fit-hero-badge{position:absolute;right:max(var(--gut),calc((100vw - 1360px)/2 + var(--gut)));top:clamp(190px,17vw,250px);width:clamp(200px,22vw,320px);pointer-events:none;z-index:0}
.fit-hero-badge img{display:block;width:100%;height:auto}
@media(max-width:1100px){.fit-hero-car,.fit-hero-badge{display:none}}
.fit-nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin-top:36px}
.fit-num{display:flex;flex-direction:column;gap:8px;padding:22px;background:#fff;border:1px solid #DDE1E6;border-radius:10px}
.fit-num img{width:30px;height:30px}
.fit-num span{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#5F6369}
.fit-num b{font-family:var(--disp);font-weight:800;font-size:clamp(24px,2.4vw,32px);line-height:1.05;color:#0E0D0B}
.fit-num p{margin:0;font-size:15px;line-height:1.5;color:#3A3D42}
.fit-note{margin:18px 0 0;padding:18px 22px;background:#fff;border:1px solid #DDE1E6;border-left:4px solid #FF020A;border-radius:10px}
.fit-note b{font-family:var(--disp);font-size:18px;text-transform:uppercase;color:#0E0D0B}
.fit-note p{margin:6px 0 0;font-size:16px;line-height:1.55;color:#3A3D42;max-width:80ch}
.fit-measure-grid{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;margin-top:36px}
.fit-circle{margin:0;text-align:center}
.fit-circle svg{display:block;width:100%;max-width:320px;height:auto;margin:0 auto}
.fit-circle figcaption{margin-top:12px;font-family:var(--body);font-size:15px;color:#C7CBD1}
.fit-circle figcaption b{font-family:var(--disp);font-size:18px;color:#F4F6F8}
.fit-measure{stroke-dasharray:100;animation:fitDraw 3.2s ease-in-out infinite}
@keyframes fitDraw{0%{stroke-dashoffset:100}45%,85%{stroke-dashoffset:0}100%{stroke-dashoffset:0;opacity:0}}
.tn .fit-before{margin-top:0;grid-template-columns:1fr 1fr}
.fit-styles{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;margin-top:32px}
.fit-style{display:flex;flex-direction:column;gap:12px;align-items:flex-start;padding:20px;background:#fff;border:1px solid #DDE1E6;border-radius:10px;text-decoration:none;color:#0E0D0B;transition:border-color .2s}
.fit-style:hover{border-color:#0E0D0B}
.fit-style img{width:100%;max-width:200px;height:auto}
.fit-style span{font-family:var(--disp);font-weight:700;font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:#FF020A}
.fit-cta{display:flex;flex-wrap:wrap;gap:12px 28px;margin:26px 0 0}
.fit-two{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:16px;margin-top:36px;align-items:stretch}
.tn .fit-more{margin-top:0;grid-template-columns:1fr 1fr}
.fit-chips{display:flex;flex-wrap:wrap;gap:8px}
.fit-chips a{display:inline-flex;padding:8px 14px;border:1px solid #3A3832;border-radius:999px;font-family:var(--disp);font-weight:700;font-size:15px;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;color:#F4F6F8}
.fit-chips a:hover{border-color:#FF020A}
.fit-same{margin-top:28px}
.light .fit-chips a{background:#fff;border-color:#DDE1E6;color:#0E0D0B}
.light .fit-chips a:hover{border-color:#0E0D0B}
.light .fit-chips a.all{background:#0E0D0B;color:#fff;border-color:#0E0D0B}
/* index */
.fit-find{display:flex;flex-direction:column;gap:12px;margin-top:28px}
.fit-find input{width:100%;max-width:520px;padding:14px 16px;border:1px solid #C9CDD3;border-radius:10px;background:#fff;font-family:var(--body);font-size:18px;color:#0E0D0B}
.fit-find input:focus{outline:2px solid #FF020A;outline-offset:1px}
.fit-filter{display:flex;flex-wrap:wrap;gap:8px}
.fit-filter button{appearance:none;padding:8px 14px;border:1px solid #DDE1E6;border-radius:999px;background:#fff;font-family:var(--disp);font-weight:700;font-size:15px;letter-spacing:.04em;text-transform:uppercase;color:#3A3D42;cursor:pointer}
.fit-filter button[aria-pressed="true"]{background:#0E0D0B;border-color:#0E0D0B;color:#fff}
.fit-mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin-top:26px}
.fit-mc{display:flex;flex-direction:column;gap:4px;padding:18px;background:#fff;border:1px solid #DDE1E6;border-radius:10px;text-decoration:none;color:#0E0D0B;transition:border-color .2s}
.fit-mc[hidden]{display:none}
.fit-mc:hover{border-color:#0E0D0B}
.fit-mc b{font-family:var(--disp);font-weight:800;font-size:22px;line-height:1.05;text-transform:uppercase}
.fit-mc .tn-mach{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#5F6369}
.fit-mc-y{font-size:14px;color:#5F6369}
.fit-mc-p{margin-top:8px;font-family:var(--disp);font-weight:700;font-size:18px;color:#FF020A}
.fit-mc-t{font-size:14px;color:#3A3D42}
.fit-pats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-top:32px}
.fit-pats a{display:flex;flex-direction:column;gap:10px;padding:16px;background:#171613;border:1px solid #2A2823;border-radius:10px;text-decoration:none;color:#F4F6F8}
.fit-pats a:hover{border-color:#FF020A}
.fit-pats img{width:100%;height:auto}
.fit-pats span{font-family:var(--disp);font-weight:700;font-size:15px;letter-spacing:.05em;text-transform:uppercase}
@media(max-width:1000px){.fit-measure-grid,.fit-two{grid-template-columns:1fr}.fit-pats{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.tn .fit-before,.tn .fit-more{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.fit-measure{animation:none;stroke-dasharray:none}}
.fit-hero .tn-stats{max-width:720px}
@media(max-width:560px){.fit-mgrid{grid-template-columns:1fr 1fr;gap:8px}.fit-mc{padding:14px}.fit-mc b{font-size:18px}.fit-mc-p{font-size:15px}}
/* Scott's wheel name marks (Nov 12 2026) */
.fit-style img[src*="/wheels/names/"]{width:auto;max-width:100%;height:30px}
/* wheel design icon beside the name (Nov 12 2026) */
.fit-style.has-ic{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:12px;row-gap:8px;align-items:center}
.fit-style.has-ic .fit-dicon{grid-row:span 2;width:44px;height:44px}

/* the machine's wordmark in place of the generated car (Scott, Nov 12 2026) */
.fit-hero-car.fit-hero-mark{bottom:clamp(44px,7vw,96px);width:clamp(220px,24vw,360px)}
.fit-hero-car.fit-hero-mark img{filter:drop-shadow(0 8px 22px rgba(0,0,0,.5))}
