:root { --pv-ink: #071425; --pv-navy: #0b1d33; --pv-blue: #00a3ff; --pv-violet: #7657ff; --pv-green: #50cd89; }
html { overflow-x: clip; scroll-behavior: smooth; }
.platevision-page { overflow-x: clip; color: var(--bs-gray-800); background: var(--bs-body-bg); }
.platevision-shell { min-height: 100vh; }
.platevision-header { position: absolute; top: 0; right: 0; left: 0; z-index: 20; height: 88px; border-bottom: 1px solid rgba(255,255,255,.09); background: rgba(3,17,28,.68); backdrop-filter: blur(18px); }
.platevision-brand { display: flex; align-items: center; gap: 12px; color: #fff; text-decoration: none; }
.platevision-brand:hover { color: #fff; }
.platevision-brand img { width: 48px; height: 48px; object-fit: contain; }
.platevision-brand span,.platevision-brand strong,.platevision-brand small { display: block; }
.platevision-brand small { margin-top: -1px; }
.platevision-header nav a { text-decoration: none; transition: color .2s ease; }
.platevision-header nav a:hover { color: #fff; }
.platevision-theme { color: #dceaff; }
.platevision-hero { position: relative; overflow: hidden; isolation: isolate; padding-top: 88px; color: #fff; background: radial-gradient(circle at 100% 0,rgba(84,194,255,.18),transparent 31rem),linear-gradient(122deg,#03131f 0%,#062437 53%,#101a34 100%); }
.platevision-grid { position: absolute; inset: 0; z-index: -3; opacity: .28; background-image: linear-gradient(rgba(85,153,214,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(85,153,214,.08) 1px,transparent 1px); background-size: 52px 52px; mask-image: linear-gradient(to bottom,#000 65%,transparent); }
.platevision-glow { position: absolute; z-index: -2; border-radius: 50%; filter: blur(12px); }
.platevision-glow--one { top: -18rem; right: -7rem; width: 48rem; height: 48rem; background: radial-gradient(circle,rgba(116,211,255,.42) 0%,rgba(35,142,228,.19) 38%,transparent 70%); }
.platevision-glow--two { bottom: -27rem; left: -18rem; width: 46rem; height: 46rem; background: radial-gradient(circle,rgba(118,87,255,.16),transparent 70%); }
.platevision-kicker { display: inline-flex; align-items: center; gap: 10px; padding: 9px 14px; border: 1px solid rgba(95,172,255,.3); border-radius: 999px; color: #c9e8ff; background: rgba(0,130,225,.1); }
.platevision-kicker i { width: 8px; height: 8px; border-radius: 50%; background: var(--pv-green); box-shadow: 0 0 0 5px rgba(80,205,137,.12),0 0 15px rgba(80,205,137,.65); }
.platevision-hero h1 { max-width: 690px; margin: 25px 0 18px; }
.platevision-hero h1 span { display: block; color: transparent; background: linear-gradient(90deg,#78c9ff,#9180ff); -webkit-background-clip: text; background-clip: text; }
.platevision-lead { max-width: 630px; margin: 0 0 16px; color: #e4edf6; }
.platevision-summary { max-width: 650px; }
.platevision-primary { display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 0; color: #fff; background: linear-gradient(105deg,#00a3ff,#6654e8); box-shadow: 0 12px 30px rgba(0,122,225,.25); }
.platevision-primary:hover { color: #fff; filter: brightness(1.08); transform: translateY(-1px); }
.platevision-secondary { color: #d6e7f7; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.05); }
.platevision-secondary:hover { color: #fff; border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.09); }
.platevision-trust { display: flex; flex-wrap: wrap; gap: 17px; margin-top: 30px; }
.platevision-trust i { margin-right: 5px; color: var(--pv-green); }
.platevision-scanner { max-width: 590px; margin: 0 auto; overflow: hidden; border: 1px solid rgba(133,183,235,.19); border-radius: 24px; background: rgba(5,19,35,.72); box-shadow: 0 35px 80px rgba(0,0,0,.36),inset 0 1px rgba(255,255,255,.08); transform: perspective(1100px) rotateY(-3deg); }
.platevision-scanner-top,.platevision-scanner-bottom { display: flex; align-items: center; justify-content: space-between; padding: 16px 19px; }
.platevision-scanner-top { color: #91a9bf; border-bottom: 1px solid rgba(255,255,255,.07); }
.platevision-scanner-top span { color: #65df9b; }
.platevision-scanner-top span i { display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 11px currentColor; }
.platevision-road { position: relative; height: 330px; overflow: hidden; background: radial-gradient(ellipse at 50% 52%,rgba(59,96,133,.38),transparent 42%),linear-gradient(165deg,#1a3047,#07131f); }
.platevision-road-video { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; background: #081522; }
.platevision-road::before { content: ""; position: absolute; inset: 0; z-index: 1; opacity: .2; pointer-events: none; background-image: linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px); background-size: 33px 33px; mask-image: radial-gradient(circle,#000,transparent 74%); }
.platevision-road::after { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; background: linear-gradient(180deg,rgba(4,15,27,.16),transparent 36%,rgba(4,13,23,.14)); }
.platevision-car { position: absolute; bottom: 65px; left: 50%; z-index: 2; color: #8195a9; font-size: 10rem; transform: translateX(-50%); filter: drop-shadow(0 22px 18px rgba(0,0,0,.38)); }
.platevision-number { position: absolute; bottom: 72px; left: 50%; z-index: 6; width: 168px; padding: 7px 14px 9px; border: 3px solid #50cd89; border-radius: 8px; color: #132237; background: #f5f8ea; text-align: center; transform: translateX(-50%); box-shadow: 0 0 0 5px rgba(80,205,137,.12),0 12px 24px rgba(0,0,0,.3); }
.platevision-number small,.platevision-number strong { display: block; }
.platevision-number small { color: #39785a; }
.platevision-confidence { position: absolute; top: 22px; right: 22px; z-index: 7; padding: 7px 9px; border-radius: 8px; color: #72eaa8; background: rgba(25,76,58,.48); }
.platevision-scanner-bottom { gap: 8px; border-top: 1px solid rgba(255,255,255,.07); }
.platevision-scanner-bottom span { flex: 1; }
.platevision-scanner-bottom small,.platevision-scanner-bottom strong { display: block; }
.platevision-scanner-bottom strong { margin-top: 4px; }
.platevision-metrics,.platevision-platform,.platevision-applications,.platevision-cta { padding: 95px 0; }
.platevision-section-heading h2 { max-width: 720px; margin: 12px auto 15px; }
.platevision-section-heading:not(.text-center) h2 { margin-left: 0; }
.platevision-section-heading p { max-width: 880px; margin: 0 auto; }
.platevision-section-heading:not(.text-center) p { margin-left: 0; }
.platevision-metric-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; }
.platevision-metric { position: relative; display: flex; min-height: 285px; flex-direction: column; padding: 32px 30px; overflow: hidden; border: 1px solid var(--bs-gray-200); border-radius: 20px; background: var(--bs-body-bg); box-shadow: 0 15px 38px rgba(29,48,75,.07); }
.platevision-metric::after { content: ""; position: absolute; top: -45px; right: -45px; width: 120px; height: 120px; border-radius: 50%; background: rgba(0,163,255,.06); }
.platevision-metric > i { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; margin-bottom: 29px; border-radius: 15px; color: var(--pv-blue); background: rgba(0,163,255,.1); font-size: 1.35rem; }
.platevision-metric strong,.platevision-metric span,.platevision-metric small { display: block; }
.platevision-metric strong { white-space: nowrap; }
.platevision-metric span { margin-top: 10px; }
.platevision-metric small { margin-top: auto; padding-top: 20px; }
.platevision-metric--accent { color: #fff; border-color: transparent; background: linear-gradient(145deg,#6549db,#397cd9); box-shadow: 0 20px 45px rgba(84,73,205,.22); }
.platevision-metric--accent::after { background: rgba(255,255,255,.08); }
.platevision-metric--accent > i { color: #fff; background: rgba(255,255,255,.14); }
.platevision-metric--accent strong,.platevision-metric--accent span { color: #fff; }
.platevision-metric--accent small { color: #d7d2fb; }
.platevision-benchmark-note { display: flex; align-items: center; justify-content: center; gap: 13px; max-width: 610px; margin-right: auto; margin-left: auto; padding: 18px 25px; border: 1px solid rgba(0,163,255,.18); border-radius: 15px; color: var(--bs-gray-600); background: rgba(0,163,255,.055); }
.platevision-benchmark-note > i { flex: 0 0 auto; color: var(--pv-blue); font-size: 1.25rem; }
.platevision-platform { background: var(--bs-gray-100); }
.platevision-deploy-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.platevision-deploy-list > div { display: flex; gap: 16px; min-height: 138px; padding: 23px; border: 1px solid var(--bs-gray-200); border-radius: 18px; background: var(--bs-body-bg); box-shadow: 0 12px 30px rgba(27,48,75,.05); }
.platevision-deploy-list > div > i { display: flex; align-items: center; justify-content: center; flex: 0 0 50px; width: 50px; height: 50px; border-radius: 14px; color: #6755df; background: rgba(103,85,223,.1); font-size: 1.35rem; }
.platevision-deploy-list strong,.platevision-deploy-list small { display: block; }
.platevision-deploy-list small { margin-top: 7px; }
.platevision-architecture { position: relative; padding: 32px 34px 30px; overflow: hidden; border: 1px solid rgba(113,155,200,.18); border-radius: 25px; background: radial-gradient(circle at 50% 35%,rgba(102,78,230,.16),transparent 22rem),linear-gradient(145deg,#0c2138,#071421); box-shadow: 0 30px 65px rgba(17,35,56,.2); }
.platevision-architecture::before { content: ""; position: absolute; inset: 0; opacity: .3; background-image: linear-gradient(rgba(119,174,223,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(119,174,223,.07) 1px,transparent 1px); background-size: 32px 32px; mask-image: linear-gradient(#000,rgba(0,0,0,.35)); }
.platevision-architecture::after { content: ""; position: absolute; top: -90px; right: -90px; width: 220px; height: 220px; border: 1px solid rgba(78,184,255,.12); border-radius: 50%; box-shadow: 0 0 0 35px rgba(78,184,255,.025),0 0 0 70px rgba(78,184,255,.018); }
.platevision-architecture-head,.platevision-architecture-main,.platevision-source,.platevision-engine,.platevision-destinations,.platevision-output,.platevision-flow { position: relative; z-index: 2; }
.platevision-architecture-head { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 20px; padding-bottom: 17px; border-bottom: 1px solid rgba(255,255,255,.08); }
.platevision-architecture-head > span { display: inline-flex; align-items: center; gap: 8px; color: #78e4aa; }
.platevision-architecture-head > span i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 12px currentColor; animation: platevision-pulse 2s ease-in-out infinite; }
.platevision-architecture-main { display: grid; grid-template-columns: minmax(175px,.8fr) 70px minmax(280px,1.2fr) 70px minmax(250px,1.15fr); align-items: center; gap: 12px; padding: 15px 0 18px; }
.platevision-source { display: flex; align-items: center; gap: 13px; align-self: stretch; width: auto; margin: 0; padding: 18px; border: 1px solid rgba(0,163,255,.25); border-radius: 15px; color: #cde8ff; background: rgba(0,116,188,.13); box-shadow: 0 10px 25px rgba(0,0,0,.12); }
.platevision-source > i { color: #49baff; font-size: 1.4rem; }
.platevision-source strong,.platevision-source small { display: block; }
.platevision-source small { margin-top: 4px; }
.platevision-flow { display: flex; flex-direction: column; align-items: center; gap: 8px; color: #8ba0b3; text-align: center; }
.platevision-flow i { width: 100%; height: 1px; background: linear-gradient(90deg,#4dbbff,#806bff); box-shadow: 0 0 12px rgba(84,155,255,.65); }
.platevision-flow--out { width: 100%; justify-self: center; flex-direction: column; }
.platevision-flow--out > b { display: block; width: 100%; overflow: visible; text-align: center; white-space: nowrap; }
.platevision-flow--out > span { display: block; width: 100%; text-align: center; white-space: nowrap; }
.platevision-engine { display: grid; grid-template-columns: 54px minmax(0,1fr) auto; align-items: center; align-self: stretch; gap: 15px; max-width: none; margin: 0; padding: 20px; border: 1px solid rgba(139,112,255,.34); border-radius: 16px; background: linear-gradient(115deg,rgba(110,64,220,.2),rgba(31,76,124,.18)); box-shadow: 0 15px 35px rgba(2,10,20,.22),inset 0 1px rgba(255,255,255,.05); }
.platevision-engine-icon { display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 14px; color: #a793ff; background: rgba(133,96,255,.14); font-size: 1.45rem; box-shadow: inset 0 0 18px rgba(133,96,255,.1); }
.platevision-engine small,.platevision-engine strong { display: block; }
.platevision-engine small { margin-bottom: 5px; }
.platevision-engine-state { padding: 6px 8px; border-radius: 6px; color: #b7aaff; background: rgba(128,101,242,.14); }
.platevision-destinations { display: grid; grid-template-columns: 1fr; grid-template-rows: repeat(3,minmax(0,1fr)); gap: 10px; }
.platevision-destinations > div { position: relative; display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 11px; padding: 15px; border: 1px solid rgba(255,255,255,.09); border-radius: 14px; color: #d9e8f4; background: rgba(255,255,255,.045); box-shadow: 0 10px 25px rgba(0,0,0,.1); transition: border-color .2s ease,background-color .2s ease,transform .2s ease; }
.platevision-destinations > div:hover { border-color: rgba(104,220,160,.24); background: rgba(255,255,255,.065); transform: translateY(-2px); }
.platevision-destinations > div > i { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 11px; color: #68dca0; background: rgba(80,205,137,.1); font-size: 1.2rem; }
.platevision-destinations strong,.platevision-destinations small { display: block; }
.platevision-destinations small { margin-top: 4px; }
.platevision-destinations em { padding: 5px 7px; border-radius: 5px; color: #afa1ff; background: rgba(118,87,255,.12); }
.platevision-architecture .text-gray-500 { color: #aebed0 !important; }
.platevision-architecture .text-gray-400 { color: #b9c7d5 !important; }
.platevision-architecture .text-gray-200 { color: #edf5fc !important; }
.platevision-architecture .text-gray-100 { color: #f7fbff !important; }
.platevision-source strong { color: #f3f8fc !important; }
.platevision-source small { color: #b3c5d7 !important; }
.platevision-engine small { color: #b7c7d7 !important; }
.platevision-engine strong { color: #fff !important; }
.platevision-engine-state { display: inline-flex; justify-content: center; width: fit-content; color: #c1b6ff !important; }
.platevision-flow > b,.platevision-flow > span { color: #b8c6d5 !important; letter-spacing: .035em; }
.platevision-destinations strong { color: #f2f7fb !important; }
.platevision-destinations small { color: #a5b6c8 !important; line-height: 1.35; }
.platevision-output > div > span { color: #bdc9d5 !important; }
.platevision-output li { color: #b7c5d3 !important; }
@media (min-width: 992px) {
    .platevision-destinations::before { content: ""; position: absolute; top: 16.666%; bottom: 16.666%; left: -18px; border-left: 1px solid rgba(104,171,255,.7); box-shadow: 0 0 10px rgba(104,171,255,.28); }
    .platevision-destinations > div::before { content: ""; position: absolute; top: 50%; left: -18px; width: 18px; border-top: 1px solid rgba(104,171,255,.7); box-shadow: 0 0 10px rgba(104,171,255,.28); }
}
.platevision-output { margin-top: 4px; padding: 15px 17px; border: 1px solid rgba(255,255,255,.07); border-radius: 13px; background: rgba(2,12,21,.3); }
.platevision-output > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 11px; }
.platevision-output > div > strong { display: inline-flex; align-items: center; gap: 6px; color: #73dca4; }
.platevision-output > div > strong i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.platevision-output ul { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; margin: 0; padding: 0; list-style: none; }
.platevision-output li { padding: 9px 5px; border-radius: 7px; background: rgba(255,255,255,.055); text-align: center; }
@keyframes platevision-pulse { 0%,100% { opacity: .55; transform: scale(.88); } 50% { opacity: 1; transform: scale(1); } }
.platevision-mobile-showcase { position: relative; min-height: 610px; overflow: hidden; border: 1px solid rgba(101,151,210,.17); border-radius: 27px; color: #fff; background: #dce5ec; box-shadow: 0 28px 65px rgba(21,43,68,.17); isolation: isolate; }
.platevision-mobile-showcase::after { content: ""; position: absolute; z-index: 1; inset: 0; pointer-events: none; background: linear-gradient(90deg,rgba(4,17,31,.76) 0,rgba(4,17,31,.52) 27%,rgba(4,17,31,.08) 50%,transparent 67%),linear-gradient(180deg,rgba(5,18,31,.15),transparent 30%); }
.platevision-mobile-scene { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.platevision-mobile-overlay { position: absolute; z-index: 2; bottom: clamp(12px,2.5vw,30px); left: clamp(12px,2.5vw,34px); width: min(440px,42%); padding: 32px; border: 1px solid rgba(255,255,255,.16); border-radius: 21px; background: rgba(5,22,38,.72); box-shadow: 0 22px 55px rgba(3,15,27,.25); backdrop-filter: blur(14px); }
.platevision-mobile-kicker { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid rgba(113,217,163,.32); border-radius: 999px; color: #83ebb3; background: rgba(80,205,137,.11); }
.platevision-mobile-overlay h3 { margin: 18px 0 12px; }
.platevision-mobile-overlay > p { margin: 0; }
.platevision-mobile-tags { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 23px; }
.platevision-mobile-tags span { display: inline-flex; align-items: center; justify-content: center; min-width: 0; gap: 6px; padding: 8px 10px; border: 1px solid rgba(255,255,255,.1); border-radius: 8px; background: rgba(255,255,255,.06); text-align: center; }
.platevision-mobile-tags span:last-child { grid-column: 1 / -1; justify-self: center; min-width: calc(50% - 4px); }
.platevision-mobile-tags i { color: #7de5ac; }
.platevision-access-card { display: grid; grid-template-columns: minmax(0,1.28fr) minmax(350px,.72fr); min-height: 440px; overflow: hidden; border: 1px solid var(--bs-gray-200); border-radius: 22px; background: var(--bs-body-bg); box-shadow: 0 18px 48px rgba(27,48,75,.09); }
.platevision-access-card__visual { position: relative; min-height: 440px; margin: 0; overflow: hidden; background: #071522; }
.platevision-access-card__visual::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg,rgba(4,17,31,.06),transparent 54%),linear-gradient(180deg,transparent 48%,rgba(4,17,31,.68)); }
.platevision-access-card__visual > img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform .35s ease; }
.platevision-access-card:hover .platevision-access-card__visual > img { transform: scale(1.018); }
.platevision-access-card__scan { position: absolute; inset: 15% 12%; z-index: 2; pointer-events: none; }
.platevision-access-card__scan span { position: absolute; width: 31px; height: 31px; border-color: #62e4a4; filter: drop-shadow(0 0 5px rgba(98,228,164,.45)); }
.platevision-access-card__scan span:nth-child(1) { top: 0; left: 0; border-top: 2px solid; border-left: 2px solid; }
.platevision-access-card__scan span:nth-child(2) { top: 0; right: 0; border-top: 2px solid; border-right: 2px solid; }
.platevision-access-card__scan span:nth-child(3) { bottom: 0; left: 0; border-bottom: 2px solid; border-left: 2px solid; }
.platevision-access-card__scan span:nth-child(4) { right: 0; bottom: 0; border-right: 2px solid; border-bottom: 2px solid; }
.platevision-access-card__reading { position: absolute; bottom: 20px; left: 20px; z-index: 3; display: grid; grid-template-columns: auto auto; align-items: center; gap: 3px 13px; padding: 12px 14px; border: 1px solid rgba(255,255,255,.17); border-radius: 12px; color: #fff; background: rgba(5,20,34,.84); box-shadow: 0 14px 32px rgba(0,0,0,.28); backdrop-filter: blur(11px); }
.platevision-access-card__reading small { grid-column: 1 / -1; color: #9eb3c8; }
.platevision-access-card__reading strong { letter-spacing: .08em; }
.platevision-access-card__reading em { display: inline-flex; align-items: center; gap: 6px; color: #79e7ac; }
.platevision-access-card__reading em i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 9px currentColor; }
.platevision-access-card__copy { display: flex; flex-direction: column; justify-content: center; padding: 42px; border-left: 1px solid var(--bs-gray-200); }
.platevision-access-card__kicker { display: inline-flex; align-items: center; align-self: flex-start; gap: 8px; padding: 8px 11px; border-radius: 999px; color: #2f9b61; background: rgba(80,205,137,.1); }
.platevision-access-card__copy h3 { margin: 19px 0 12px; }
.platevision-access-card__copy > p { margin: 0; }
.platevision-access-card__features { display: grid; gap: 9px; margin-top: 25px; }
.platevision-access-card__features > span { display: grid; grid-template-columns: 34px minmax(0,1fr); column-gap: 10px; padding: 10px 12px; border: 1px solid var(--bs-gray-200); border-radius: 11px; background: var(--bs-gray-100); }
.platevision-access-card__features i { grid-row: 1 / 3; align-self: center; color: #45b97b; font-size: 1.15rem; }
.platevision-access-card__features b { color: var(--bs-gray-800); }
.platevision-access-card__features small { margin-top: 2px; color: var(--bs-gray-500); }
.platevision-road-monitor { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(310px,.75fr); align-items: stretch; overflow: hidden; border: 1px solid var(--bs-gray-200); border-radius: 22px; background: var(--bs-body-bg); box-shadow: 0 18px 48px rgba(27,48,75,.08); }
.platevision-road-monitor-visual { position: relative; display: flex; align-items: center; min-height: 420px; margin: 0; overflow: hidden; background: #f8fafc; }
.platevision-road-monitor-visual img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.platevision-road-timeline { position: absolute; top: 50%; bottom: auto; left: 18px; z-index: 2; display: grid; align-content: center; gap: 8px; width: min(235px,48%); min-height: 292px; padding: 14px 28px 14px 12px; border: 0; color: #edf6ff; background: transparent; box-shadow: none; backdrop-filter: none; transform: translateY(-50%); }
.platevision-road-timeline__route { position: absolute; top: 29px; right: 10px; bottom: 29px; width: 2px; border-radius: 4px; background: linear-gradient(#00a3ff,#50cd89 58%,#ffc700); box-shadow: 0 0 10px rgba(80,205,137,.32); }
.platevision-road-timeline__stop,.platevision-road-timeline__unit,.platevision-road-timeline__status { position: relative; z-index: 2; display: flex; align-items: center; justify-self: stretch; min-width: 0; gap: 8px; padding: 8px 9px; border-radius: 10px; }
.platevision-road-timeline__stop { border: 1px solid rgba(255,255,255,.13); background: rgba(14,35,54,.9); box-shadow: 0 7px 18px rgba(0,0,0,.15); }
.platevision-road-timeline__stop > i { display: grid; place-items: center; width: 28px; height: 28px; flex: 0 0 28px; border-radius: 8px; color: #6bc8ff; background: rgba(0,163,255,.14); }
.platevision-road-timeline__stop--control > i { color: #72e2a7; background: rgba(80,205,137,.14); }
.platevision-road-timeline__unit { border: 1px solid rgba(0,163,255,.3); background: linear-gradient(125deg,rgba(24,59,93,.96),rgba(16,40,64,.96)); box-shadow: 0 10px 24px rgba(0,0,0,.22),0 0 0 4px rgba(0,163,255,.04); }
.platevision-road-timeline__unit > i { color: #75c8ff; }
.platevision-road-timeline__status { border: 1px solid rgba(80,205,137,.27); color: #7de4ab; background: rgba(28,76,58,.86); box-shadow: 0 7px 17px rgba(0,0,0,.16); }
.platevision-road-timeline__stop span,.platevision-road-timeline__unit span,.platevision-road-timeline__status span { min-width: 0; }
.platevision-road-timeline strong,.platevision-road-timeline small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.platevision-road-timeline strong { color: #f7fbff; }
.platevision-road-timeline small { margin-top: 2px; color: #9eb1c4; }
.platevision-road-timeline__unit small { color: #82a0ba; }
.platevision-road-timeline__stop::after,.platevision-road-timeline__unit::after,.platevision-road-timeline__status::after { content: ""; position: absolute; top: 50%; right: -22px; width: 8px; height: 8px; border: 2px solid #071522; border-radius: 50%; background: #00a3ff; box-shadow: 0 0 0 3px rgba(0,163,255,.16); transform: translateY(-50%); }
.platevision-road-timeline__stop--control::after { background: #50cd89; box-shadow: 0 0 0 3px rgba(80,205,137,.16); }
.platevision-road-timeline__status::after { background: #ffc700; box-shadow: 0 0 0 3px rgba(255,199,0,.16); }
.platevision-road-monitor-copy { display: flex; flex-direction: column; justify-content: center; padding: 40px; border-left: 1px solid var(--bs-gray-200); }
.platevision-road-monitor-copy > span { display: inline-flex; align-items: center; align-self: flex-start; gap: 7px; padding: 7px 10px; border-radius: 999px; color: #5f56d9; background: rgba(103,85,223,.09); }
.platevision-road-monitor-copy h3 { margin: 18px 0 12px; }
.platevision-road-monitor-copy p { margin: 0; }
.platevision-road-monitor-copy ul { display: grid; gap: 10px; margin: 23px 0 0; padding: 0; list-style: none; }
.platevision-road-monitor-copy li { display: flex; align-items: center; gap: 8px; }
.platevision-road-monitor-copy li i { color: #50b983; }
.platevision-applications { background: var(--bs-body-bg); }
.platevision-card-group-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: 0 2px 15px; border-bottom: 1px solid var(--bs-gray-200); }
.platevision-card-group-head > span { color: #6256d9; letter-spacing: .08em; }
.platevision-card-group-head > p { max-width: 590px; margin: 0; text-align: right; }
.platevision-feature-grid { display: grid; grid-template-columns: 1fr; gap: 28px; }
.platevision-use-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.platevision-use-grid article { padding: 28px; border: 1px solid var(--bs-gray-200); border-radius: 18px; background: var(--bs-body-bg); transition: transform .2s ease,box-shadow .2s ease,border-color .2s ease; }
.platevision-use-grid article:hover { border-color: rgba(103,85,223,.25); box-shadow: 0 18px 40px rgba(34,54,80,.08); transform: translateY(-4px); }
.platevision-use-grid article > i { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-bottom: 24px; border-radius: 14px; color: #6351d9; background: rgba(103,85,223,.09); font-size: 1.25rem; }
.platevision-use-grid p { margin: 10px 0 0; }
.platevision-source-note { display: flex; align-items: flex-start; justify-content: center; gap: 8px; max-width: 850px; margin: 28px auto 0; text-align: center; }
.platevision-source-note i { color: #6755df; }
.platevision-cta { padding-top: 20px; }
.platevision-cta-card { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 35px; overflow: hidden; padding: 50px; border-radius: 25px; color: #fff; background: radial-gradient(circle at 80% 0,rgba(118,87,255,.42),transparent 22rem),linear-gradient(125deg,#07182b,#102b4a); box-shadow: 0 25px 60px rgba(13,34,56,.2); }
.platevision-cta-card::before { content: ""; position: absolute; right: -60px; bottom: -100px; width: 300px; height: 300px; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; box-shadow: 0 0 0 38px rgba(255,255,255,.025),0 0 0 75px rgba(255,255,255,.018); }
.platevision-cta-card > * { position: relative; z-index: 2; }
.platevision-cta-card > div:first-child { max-width: 680px; }
.platevision-cta-card h2 { margin: 10px 0; }
.platevision-cta-card p { margin: 0; }
.platevision-whatsapp { color: #dff8ea; border: 1px solid rgba(80,205,137,.4); background: rgba(80,205,137,.12); }
.platevision-whatsapp:hover { color: #fff; background: rgba(80,205,137,.2); }
.platevision-footer { margin-top: 70px; padding: 26px 0; border-top: 1px solid var(--bs-gray-200); }
.platevision-footer a { color: var(--bs-gray-600); text-decoration: none; }
.platevision-footer a:hover { color: var(--bs-primary); }
[data-bs-theme="dark"] .platevision-metrics,[data-bs-theme="dark"] .platevision-applications { background: #0e1725; }
[data-bs-theme="dark"] .platevision-platform { background: #111c2b; }
[data-bs-theme="dark"] .platevision-metric,[data-bs-theme="dark"] .platevision-deploy-list > div,[data-bs-theme="dark"] .platevision-use-grid article { border-color: rgba(255,255,255,.08); background: #151f2e; box-shadow: none; }
[data-bs-theme="dark"] .platevision-metric--accent { background: linear-gradient(145deg,#6549db,#397cd9); }
[data-bs-theme="dark"] .platevision-road-monitor { border-color: rgba(255,255,255,.08); background: #151f2e; box-shadow: none; }
[data-bs-theme="dark"] .platevision-road-monitor-copy { border-color: rgba(255,255,255,.08); }
[data-bs-theme="dark"] .platevision-access-card { border-color: rgba(255,255,255,.08); background: #151f2e; box-shadow: none; }
[data-bs-theme="dark"] .platevision-access-card__copy { border-color: rgba(255,255,255,.08); }
[data-bs-theme="dark"] .platevision-card-group-head { border-color: rgba(255,255,255,.08); }
@media (max-width: 1199.98px) { .platevision-header nav { display: none !important; } .platevision-cta-card { align-items: flex-start; flex-direction: column; } }
@media (max-width: 991.98px) { .platevision-scanner { transform: none; } .platevision-metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .platevision-use-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .platevision-metrics,.platevision-platform,.platevision-applications,.platevision-cta { padding: 75px 0; } .platevision-architecture-main { grid-template-columns: 1fr; max-width: 620px; margin: 0 auto; } .platevision-architecture-main .platevision-flow { gap: 7px; } .platevision-architecture-main .platevision-flow--out > span { transform: none; } .platevision-architecture-main .platevision-flow i { width: 1px; height: 24px; background: linear-gradient(#4dbbff,#806bff); } .platevision-source { width: 100%; margin: 0 !important; } .platevision-engine { width: 100%; margin: 0 !important; } .platevision-destinations { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: none; width: 100%; } .platevision-deploy-list { grid-template-columns: 1fr; } .platevision-deploy-list > div { min-height: 0; } }
@media (max-width: 991.98px) { .platevision-mobile-showcase { min-height: 540px; } .platevision-mobile-overlay { width: min(410px,48%); } .platevision-access-card { grid-template-columns: 1fr; min-height: 0; } .platevision-access-card__visual { min-height: 0; aspect-ratio: 16 / 9; } .platevision-access-card__copy { border-top: 1px solid var(--bs-gray-200); border-left: 0; } .platevision-road-monitor { grid-template-columns: 1fr; } .platevision-road-monitor-visual { min-height: auto; aspect-ratio: 16 / 9; } .platevision-road-monitor-copy { border-top: 1px solid var(--bs-gray-200); border-left: 0; } }
@media (max-width: 991.98px) { .platevision-feature-grid { gap: 22px; } }
@media (max-width: 767.98px) { .platevision-header { height: 78px; } .platevision-brand img { width: 42px; height: 42px; } .platevision-header .btn-primary { padding-right: .85rem !important; padding-left: .85rem !important; } .platevision-hero { padding-top: 78px; } .platevision-road { aspect-ratio: 16 / 9; height: auto; } .platevision-car { font-size: 8.7rem; } .platevision-metric-grid,.platevision-use-grid { grid-template-columns: 1fr; } .platevision-metric { min-height: 245px; } .platevision-benchmark-note { flex-wrap: wrap; text-align: center; } .platevision-benchmark-note strong { flex: 0 0 100%; } .platevision-architecture { padding: 26px 20px 24px; border-radius: 20px; } .platevision-architecture-head { margin-bottom: 12px; padding-bottom: 14px; } .platevision-architecture-main { gap: 8px; padding: 8px 0 12px; } .platevision-source,.platevision-engine { padding: 16px; } .platevision-destinations { grid-template-columns: 1fr; gap: 9px; } .platevision-destinations > div { min-width: 0; padding: 14px; } .platevision-cta-card { padding: 32px; } .platevision-mobile-showcase { display: flex; min-height: 0; flex-direction: column; border-radius: 21px; background: #071a2d; } .platevision-mobile-showcase::after { display: none; } .platevision-mobile-scene { position: relative; aspect-ratio: 16 / 9; height: auto; object-position: center; } .platevision-mobile-overlay { position: relative; top: auto; right: auto; bottom: auto; left: auto; width: auto; padding: 28px 24px 30px; border: 0; border-top: 1px solid rgba(255,255,255,.08); border-radius: 0; background: linear-gradient(135deg,#081b2e,#102c49); box-shadow: none; backdrop-filter: none; transform: none; } .platevision-road-monitor-copy { padding: 30px 24px; } }
@media (max-width: 479.98px) { .platevision-brand small,.platevision-theme { display: none; } .platevision-trust { gap: 10px; } .platevision-scanner-bottom { align-items: flex-start; } .platevision-number { width: 145px; } .platevision-destinations { grid-template-columns: 1fr; } .platevision-destinations > div { grid-template-columns: 40px minmax(0,1fr); column-gap: 10px; } .platevision-destinations > div > i { width: 40px; height: 40px; } .platevision-destinations em { grid-column: 2; justify-self: start; margin-top: 2px; } .platevision-architecture { min-height: 0; padding: 23px 17px; } .platevision-architecture-head { align-items: flex-start; flex-direction: column; gap: 6px; } .platevision-engine { grid-template-columns: 44px minmax(0,1fr); } .platevision-engine-icon { width: 44px; height: 44px; } .platevision-engine-state { grid-column: 1 / -1; justify-self: stretch; text-align: center; } .platevision-output ul { grid-template-columns: repeat(2,1fr); } .platevision-cta-card .btn { width: 100%; } .platevision-mobile-overlay { padding: 25px 20px 27px; } .platevision-mobile-tags { grid-template-columns: 1fr; } .platevision-mobile-tags span:last-child { grid-column: auto; justify-self: stretch; min-width: 0; } }
@media (max-width: 479.98px) {
    .platevision-card-group-head { align-items: flex-start; flex-direction: column; gap: 7px; }
    .platevision-card-group-head > p { text-align: left; }
    .platevision-feature-grid { gap: 18px; }
    .platevision-access-card__copy { padding: 26px 20px; }
    .platevision-access-card__scan { inset: 11% 8%; }
    .platevision-access-card__reading { bottom: 10px; left: 10px; padding: 9px 10px; }
    .platevision-road-timeline { left: 8px; width: min(180px,54%); min-height: 180px; gap: 5px; padding: 8px 22px 8px 8px; border-radius: 11px; }
    .platevision-road-timeline__route { top: 17px; right: 8px; bottom: 17px; }
    .platevision-road-timeline__stop,.platevision-road-timeline__unit,.platevision-road-timeline__status { gap: 5px; padding: 5px 6px; border-radius: 8px; }
    .platevision-road-timeline__stop > i { width: 23px; height: 23px; flex-basis: 23px; }
    .platevision-road-timeline small { display: none; }
    .platevision-road-timeline__stop::after,.platevision-road-timeline__unit::after,.platevision-road-timeline__status::after { right: -18px; width: 7px; height: 7px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .platevision-road-video { opacity: 1; filter: saturate(.92); } .platevision-architecture-head > span i { animation: none; } }