/* Concrete product diagrams and clear theme labels. */
.site-footer{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;column-gap:28px;row-gap:16px;padding-block:38px}
.footer-copyright{grid-column:1;grid-row:1}.site-footer .footer-top{grid-column:3;grid-row:1;justify-self:end}
.site-footer .footer-legal{grid-column:2;grid-row:1;display:flex;align-items:center;justify-content:center;gap:9px;border:0;padding:0;margin:0}
.site-footer .icp-number{font-size:16px;line-height:1.5;padding:0;white-space:nowrap}
.icp-badge{display:block;width:24px;height:26px;object-fit:contain;flex-shrink:0}
.footer-slogan{grid-column:1/-1;grid-row:2;justify-self:start;color:#b9beb1;font-size:10px;letter-spacing:.08em}
@media(max-width:900px){.site-footer{grid-template-columns:1fr auto;gap:18px}.site-footer .footer-legal{grid-column:1/-1;grid-row:1;justify-self:start}.footer-copyright{grid-column:1;grid-row:2}.site-footer .footer-top{grid-column:2;grid-row:2}.footer-slogan{grid-column:1/-1;grid-row:3}}
@media(max-width:650px){.site-footer{font-size:10px;column-gap:12px;row-gap:16px;padding-block:28px}.site-footer .icp-number{font-size:15px}.icp-badge{width:22px;height:24px}.footer-slogan{font-size:9px}}
.boot-preview{background:#141811;border:1px solid #596047;border-radius:8px;padding:25px;margin:12px 0 28px}
.boot-heading{display:flex;justify-content:space-between;gap:15px;align-items:center;border-bottom:1px solid #39442d;padding-bottom:20px;margin-bottom:20px;font:11px/1.6 var(--display);color:var(--lime)}
.boot-heading>span:last-child{font:11px/1.6 var(--font);color:#a6b296}
.boot-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.boot-option{min-width:0;background:#20271b;border:1px solid #414c35;border-radius:4px;padding:20px 15px}
.boot-option>span{display:block;font:12px/1.5 var(--display);color:#e9ede1;overflow-wrap:anywhere}
.boot-option>small{display:block;font:11px/1.7 var(--font);color:#a6b296;margin-top:8px}
.boot-option.boot-default{border-color:#a38d12;background:#2b2e1d}.boot-default>span,.boot-default>small{color:var(--lime)}
.boot-note{font:12px/1.7 var(--font);color:#a8b19a;margin:12px 0 0}
@media(max-width:650px){.boot-preview{padding:18px;margin:5px 0 15px}.boot-heading{font-size:10px;gap:8px}.boot-heading>span:last-child{font-size:10px}.boot-options{gap:9px}.boot-option{padding:17px 11px}.boot-option>span{font-size:10px}}
.statement{min-height:0}
.custom-intro{display:grid;grid-template-columns:1.4fr 1fr;align-items:end;gap:55px;margin:65px 0 75px}
.statement .custom-intro h2{margin:0;font-size:clamp(50px,6.5vw,110px);line-height:1.05;letter-spacing:-.06em}
.custom-copy{max-width:420px;justify-self:end;font-size:18px;line-height:1.8}.custom-copy p{margin:0 0 20px}
.custom-pages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;position:relative}
.custom-pages figure,.real-layouts figure,.real-notices figure{margin:0;min-width:0}
.custom-pages img,.real-layouts img,.real-notices img{display:block;width:100%;height:auto;border-radius:50%;background:#000;filter:none;opacity:1}
.custom-pages figcaption{border-top:1px solid #b8bcad;padding-top:20px;margin-top:25px}
.custom-pages figcaption>span{display:block;font:12px/1.5 var(--display);color:#776500;letter-spacing:.08em}
.custom-pages figcaption>strong{display:block;font:500 15px/1.7 var(--font);margin-top:8px}
.custom-foot{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #b8bcad;margin-top:50px;padding-top:20px;font:12px/1.6 var(--font);color:#626851}
.real-layouts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 26px;max-width:400px;align-self:center;margin:6px auto 16px}
.real-layouts img{max-width:166px;margin:auto}
.real-layouts figcaption,.real-notices figcaption{text-align:center;margin-top:12px}
.real-layouts figcaption>span,.real-notices figcaption>span{display:block;font:11px/1.5 var(--display);letter-spacing:.03em}
.real-layouts figcaption>strong,.real-notices figcaption>strong{display:block;font:400 12px/1.7 var(--font);margin-top:4px}
.layout-extra{grid-column:1/-1;font:11px/1.7 var(--font);text-align:center;color:#c1c6b6}
.real-notices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:center;margin:auto 0}
.real-notices figcaption>span{color:#786500}
.vehicle-data-panel{display:grid;grid-template-columns:minmax(240px,430px) 1fr;gap:clamp(30px,6vw,100px);align-items:center;border-top:1px solid #515646;padding-top:70px;margin-top:80px}
.data-image img{display:block;width:100%;height:auto;border-radius:50%}.data-copy{max-width:520px}.data-copy .eyebrow{color:var(--lime)}
.data-copy h3{font:700 clamp(35px,4.4vw,65px)/1.2 var(--display);letter-spacing:-.05em;margin:25px 0}
.data-copy p{font:16px/1.85 var(--font);color:#c5cabb}.data-copy p.detail-note{font-size:12px;color:#a3ab97}
.function-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:65px 45px}
.function-visual{padding:26px;max-width:none}.function-visual img{max-width:330px;margin:auto}.function-visual:before{display:none}
.function-card p{max-width:480px}
.timing-grid .timing-with-screen{grid-column:1/-1;display:grid;grid-template-columns:minmax(220px,380px) 1fr;gap:clamp(30px,5vw,80px);align-items:center;padding:38px}
.timing-image img{display:block;width:100%;height:auto;border-radius:50%}.timing-copy{max-width:500px}.timing-copy h3{font-size:clamp(30px,3.4vw,48px)}
.timing-with-screen+.timing-card{grid-column:1/-1}
@media(max-width:900px){.custom-intro{gap:30px}.custom-copy{font-size:15px}.custom-pages{grid-template-columns:repeat(2,minmax(0,1fr));gap:38px 25px}.custom-pages img{max-width:300px;margin:auto}.real-layouts{gap:20px 12px}.vehicle-data-panel{grid-template-columns:minmax(200px,340px) 1fr;gap:30px}.function-grid{gap:45px 25px}.function-visual{padding:18px}.timing-grid .timing-with-screen{grid-template-columns:minmax(200px,300px) 1fr;padding:25px;gap:30px}}
@media(max-width:650px){.statement{min-height:0}.custom-intro{display:block;margin:50px 0 40px}.statement .custom-intro h2{font-size:clamp(48px,11vw,70px)}.custom-copy{margin-top:35px;max-width:100%}.custom-copy p{margin-bottom:12px}.custom-pages{gap:28px 16px}.custom-pages figcaption{padding-top:14px;margin-top:16px}.custom-pages figcaption>strong{font-size:12px}.custom-pages figcaption>span{font-size:10px}.custom-foot{flex-direction:column;gap:8px;margin-top:35px}.real-layouts{gap:20px;max-width:100%;margin:0 0 10px}.real-layouts figcaption>strong{font-size:10px}.real-notices{gap:12px;margin:10px 0 20px}.real-notices figcaption>span{font-size:10px}.vehicle-data-panel{grid-template-columns:1fr;padding-top:45px;margin-top:50px;gap:30px}.data-image{width:85%;max-width:340px;margin:auto}.data-copy h3{font-size:38px}.data-copy p{font-size:14px}.function-grid{grid-template-columns:1fr}.function-visual{max-width:420px}.timing-grid .timing-with-screen{grid-template-columns:1fr;padding:24px;gap:30px}.timing-image{width:90%;max-width:330px;margin:auto}}
.theme-thumb{position:relative;background:#dfe0d7;border-color:#c1c4b7}
.theme-thumb.selected{background:#ecece4;border-color:#b19700;box-shadow:inset 0 0 0 1px #b19700}
.theme-thumb:hover{background:#e9eae2}
.theme-tabs .tab.active{background:rgba(255,218,16,.09);color:var(--lime);border-color:#b19700}
.theme-tabs .tab:hover{background:rgba(255,218,16,.14);color:var(--lime);border-color:#b19700}
.theme-variants.has-previews{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:25px}
.has-previews .variant-button{min-width:0;display:flex;flex-direction:column;justify-content:flex-start;gap:10px;padding:10px 7px;background:#20251d;border-color:#424b39;font:11px/1.6 var(--font);text-align:center;transition:background .2s,border-color .2s}
.has-previews .variant-button img{display:block;width:100%;max-width:116px;height:auto;border-radius:50%;background:#080a08}
.has-previews .variant-button[aria-pressed=true]{background:#2c3123;border-color:var(--lime);color:var(--lime)}
.has-previews .variant-button:hover{background:#303629}
.variant-button:focus-visible,.theme-thumb:focus-visible,.tab:focus-visible{outline:2px solid var(--lime);outline-offset:4px}
.theme-strip[data-reveal]{clip-path:none;overflow:visible;opacity:0;transform:translateY(30px);transition:opacity .7s ease,transform .9s cubic-bezier(.16,1,.3,1)}
.theme-strip[data-reveal].is-visible{clip-path:none;opacity:1;transform:none}
.theme-thumb:hover{z-index:1}
.function-visual{background:transparent;overflow:visible;padding:26px 0}
.function-card[data-reveal].is-visible{clip-path:none;overflow:visible}
.data-card-image{display:grid;place-items:center;margin:5px 0 20px}
.data-card-image img{display:block;width:min(100%,340px);height:auto;border-radius:50%}
.data-card-note{font:12px/1.7 var(--font);color:#a8b19a;margin:12px 0 0}
@media(max-width:650px){.function-visual{background:transparent;overflow:visible;padding:18px 0}.data-card-image img{width:min(90%,300px)}}
@media(prefers-reduced-motion:reduce){.theme-strip[data-reveal]{opacity:1;transform:none;transition:none}}
.feature-card.feature-specific{min-height:550px;gap:28px;justify-content:flex-start;padding:32px}
.feature-specific .card-copy{margin-top:auto;position:relative}
.feature-specific .card-title{font-size:clamp(30px,3.1vw,48px);line-height:1.18}
.feature-specific .card-desc{line-height:1.7;max-width:470px}
.feature-visual{position:relative;min-height:210px;width:100%;margin:auto 0;flex-shrink:0}
.layout-showcase{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;align-items:center;padding:22px 12px;border:1px solid #62614b;border-radius:8px;background:#151711}
.mini-layout{min-width:0;text-align:center;color:#eeeae0}
.mini-layout svg{display:block;width:100%;height:auto;overflow:visible}
.mini-layout>span{display:block;margin-top:13px;font:11px/1.5 var(--display);letter-spacing:.015em;white-space:nowrap}
.mini-layout text{text-anchor:middle;fill:#fff;font-family:var(--display)}
.mini-layout .mini-caption{font-size:8px;fill:#FFDA10;letter-spacing:1px}
.mini-layout .mini-value{font-size:23px}.mini-layout .mini-small{font-size:12px}.mini-layout .mini-label{font-size:7px;fill:#aeb5a7}
.polling-preview,.notice-preview{background:#11170f;color:#eeeae0;padding:22px;border:1px solid #525c46;border-radius:8px}
.preview-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:24px;font:11px/1.5 var(--display);letter-spacing:.06em}
.preview-heading>span{font-family:var(--font);font-size:11px;letter-spacing:0;color:#aeb5a7}
.queue-label{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;font:12px/1.5 var(--display)}
.queue-label b{color:#FFDA10}.queue-label>span{font:11px/1.5 var(--font);color:#b7bfac}
.queue-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.queue-items>span{padding:10px 7px;background:#252e1e;border:1px solid #465238;border-radius:4px;font:11px/1.5 var(--display);overflow-wrap:anywhere}
.queue-items small{display:block;color:#aeb5a7;font-size:9px;margin-bottom:5px}
.queue-normal{border-top:1px solid #414a37;margin-top:20px;padding-top:16px}.queue-normal .queue-label b{color:#b7bfac}.queue-normal .queue-items>span{background:#1b2217;border-color:#343e2b}
.notice-row{display:flex;gap:12px;align-items:center;border-top:1px solid #3c4732;padding:20px 0;min-width:0}
.notice-row:last-child{padding-bottom:2px}.notice-row>svg{width:25px;height:25px;flex-shrink:0;stroke:#FFDA10;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.notice-row>div{flex:1;min-width:0}.notice-row strong{display:block;font:12px/1.5 var(--display)}.notice-row div>span{display:block;font:12px/1.7 var(--font);color:#afb9a4;margin-top:4px}
.setting-chip{font:10px/1.5 var(--display);padding:7px;border:1px solid #6a773e;border-radius:4px;color:#FFDA10;white-space:nowrap}
.setting-toggle{position:relative;width:34px;height:19px;border-radius:20px;background:#FFDA10;flex-shrink:0}.setting-toggle:after{content:"";position:absolute;width:13px;height:13px;border-radius:50%;background:#11170f;right:3px;top:3px}
.link-preview{display:grid;grid-template-columns:65px 24px 1fr 24px 1fr;gap:10px;align-items:center;padding:22px 15px;border:1px solid #66604a;border-radius:8px;background:#151711;text-align:center;color:#eeeae0}
.linked-obd svg{display:block;width:100%;height:auto;stroke:#FFDA10;fill:none;stroke-width:2}.linked-obd strong,.linked-gauge strong{display:block;font:14px/1.5 var(--font);margin-top:10px}
.linked-gauge{min-width:0}.linked-gauge img{display:block;width:min(100%,128px);height:auto;margin:auto;border-radius:50%}.linked-gauge>span{display:block;font:9px/1.5 var(--display);color:#aeb5a7;margin-top:4px;letter-spacing:.05em}
.connection-arrow{font:24px/1 var(--font);color:#FFDA10}.link-caption{grid-column:1/-1;font:12px/1.6 var(--font);color:#bdc2b4;margin-top:12px}
.mode-device[data-reveal],.mode-device[data-reveal].is-visible{clip-path:none;overflow:visible;transform:none}
.js-motion .mode-device .device{clip-path:circle(0% at 50% 50%);transition:clip-path 1s cubic-bezier(.65,0,.35,1)}
.js-motion .mode-device.is-visible .device{clip-path:circle(50% at 50% 50%)}
.mode-stage{padding-block:40px;min-height:760px}
.mode-device .theme-index{display:block;position:static;transform:none;margin:24px auto 0;padding:8px 14px;max-width:100%;font:14px/1.7 var(--font);letter-spacing:.05em;white-space:normal;overflow:visible;text-align:center}
.closing-clean{justify-content:flex-end}
.footer-legal{flex-basis:100%;display:flex;justify-content:center;border-top:1px solid #626a59;padding-top:22px;margin-top:8px}
footer .icp-number{font:600 18px/1.8 var(--font);letter-spacing:.04em;color:var(--lime);padding:4px 10px}
@media(max-width:1100px){.feature-card.feature-specific{padding:25px}.layout-showcase{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:18px}.mini-layout svg{max-width:115px;margin:auto}.mini-layout>span{font-size:10px}.link-preview{grid-template-columns:50px 16px 1fr 16px 1fr;gap:7px}.setting-chip{font-size:9px;padding:5px}.notice-row{gap:8px}}
@media(max-width:650px){.feature-card.feature-specific{min-height:0;padding:26px 22px;gap:28px}.feature-visual{min-height:0;margin:5px 0 10px}.feature-specific .card-title{font-size:36px}.feature-specific .card-desc{font-size:14px}.mini-layout>span{font-size:10px}.polling-preview,.notice-preview{padding:18px}.queue-items>span{font-size:10px}.notice-row strong{font-size:11px}.notice-row div>span{font-size:11px}.link-preview{padding:24px 10px;grid-template-columns:45px 12px 1fr 12px 1fr;gap:6px}.connection-arrow{font-size:19px}.mode-stage{padding-block:20px;min-height:0}.mode-panel{margin-top:20px}.mode-device .theme-index{margin-bottom:8px;font-size:13px}.footer-legal{padding-top:18px}footer .icp-number{font-size:16px}}
.motion-fallback .mode-device .device{clip-path:none}
@media(prefers-reduced-motion:reduce){.js-motion .mode-device .device{clip-path:none;transition:none}}