/* Brand fonts — self-hosted; do not remove */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/inter-400.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/inter-500.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/inter-600.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/inter-700.woff2") format("woff2"); }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/sora-500.woff2") format("woff2"); }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/sora-600.woff2") format("woff2"); }
@font-face { font-family: "Sora"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/sora-700.woff2") format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/jetbrains-mono-400.woff2") format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/jetbrains-mono-500.woff2") format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/jetbrains-mono-700.woff2") format("woff2"); }

/* WSmart EN — single stylesheet
   Built 2026-10-22 from Manus Tailwind (orphan duplicate dump removed; unused
   utilities purged against HTML/JS class usage) + Manus site custom rules +
   wsmart-theme overrides. Theme section last so overrides win.
   Link only this file sitewide — do not also load style-DFhzDlb2.css.
*/

*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--font-mono);font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}:root{--background: 210 40% 98%;--foreground: 222 47% 11%;--card: 0 0% 100%;--card-foreground: 222 47% 11%;--popover: 0 0% 100%;--popover-foreground: 222 47% 11%;--primary: 222 47% 11%;--primary-foreground: 210 40% 98%;--secondary: 210 40% 96%;--secondary-foreground: 222 47% 11%;--muted: 210 40% 96%;--muted-foreground: 215 16% 47%;--accent: 199 89% 48%;--accent-foreground: 0 0% 100%;--sensor: 38 92% 50%;--sensor-foreground: 0 0% 100%;--destructive: 0 84% 60%;--destructive-foreground: 0 0% 98%;--border: 215 28% 90%;--input: 215 28% 90%;--ring: 199 89% 48%;--radius: .5rem;--font-heading: "Sora", ui-sans-serif, system-ui, sans-serif;--font-body: "Inter", ui-sans-serif, system-ui, sans-serif;--font-display: "Sora", ui-sans-serif, system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace}*{border-color:hsl(var(--border));outline-color:hsl(var(--ring) / .5)}body{background-color:hsl(var(--background));font-family:var(--font-body);color:hsl(var(--foreground));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.container{width:100%}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}.mono-label{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.15em;color:hsl(var(--muted-foreground))}.section-eyebrow{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.2em;color:hsl(var(--accent))}.glass-card{border-radius:var(--radius);border-width:1px;border-color:hsl(var(--border));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));box-shadow:inset 0 1px #fffc,0 1px 3px #0f172a0a}.tech-grid{background-image:linear-gradient(to right,hsl(215 28% 90% / .5) 1px,transparent 1px),linear-gradient(to bottom,hsl(215 28% 90% / .5) 1px,transparent 1px);background-size:48px 48px}.pulse-dot{position:relative;display:inline-flex;height:.5rem;width:.5rem;border-radius:9999px;background-color:hsl(var(--accent))}.pulse-dot:after{content:"";position:absolute;display:inline-flex;height:100%;width:100%}@keyframes ping{75%,to{transform:scale(2);opacity:0}}.pulse-dot:after{animation:ping 1s cubic-bezier(0,0,.2,1) infinite;border-radius:9999px;background-color:hsl(var(--accent));opacity:.75}.record-placeholder-photo{background:hsl(var(--secondary))}.record-placeholder-photo img{filter:saturate(.78) contrast(.94)}.hero-signal-visual{position:relative;width:100%;aspect-ratio:4 / 3;isolation:isolate}.hero-signal-image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;object-position:center;z-index:1;filter:saturate(.92) contrast(.98)}.hero-sensor-layer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none}.hero-sensor-card{position:absolute;min-width:132px;padding:.6rem .7rem;border:1px solid hsl(var(--border));border-radius:.65rem;background:hsl(var(--background) / .88);box-shadow:0 8px 20px #0f172a1a,inset 0 1px #fffc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:sensor-float 4.8s ease-in-out infinite}.hero-sensor-card--temperature{top:8%;left:3%;animation-delay:-.8s}.hero-sensor-card--presence{top:44%;right:3%;animation-delay:-2.1s}.hero-sensor-card--leak{bottom:13%;left:10%;animation-delay:-3.4s}.hero-sensor-kicker{display:flex;align-items:center;gap:.35rem;margin-bottom:.28rem;color:hsl(var(--muted-foreground));font-family:var(--font-mono);font-size:9px;letter-spacing:.12em;line-height:1.2;text-transform:uppercase;white-space:nowrap}.hero-sensor-dot{display:inline-block;width:.38rem;height:.38rem;flex:0 0 auto;border-radius:9999px}.hero-sensor-dot--ok{background:hsl(var(--sensor))}.hero-sensor-dot--live{background:hsl(var(--accent));animation:sensor-pulse 1.8s ease-in-out infinite}.hero-sensor-value{display:block;color:hsl(var(--foreground));font-family:var(--font-heading);font-size:.9rem;font-weight:600;line-height:1.25;white-space:nowrap}.hero-sensor-divider{color:hsl(var(--muted-foreground));margin:0 .15rem}.hero-sensor-meta{display:block;margin-top:.18rem;color:hsl(var(--muted-foreground));font-size:10px;line-height:1.25;white-space:nowrap}@keyframes sensor-float{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes sensor-pulse{0%,to{box-shadow:0 0 hsl(var(--accent) / .45)}50%{box-shadow:0 0 0 4px hsl(var(--accent) / 0)}}@media (max-width: 639px){.hero-sensor-card{min-width:0;max-width:43%;padding:.45rem .5rem}.hero-sensor-card--temperature{top:5%;left:2%}.hero-sensor-card--presence{top:42%;right:2%}.hero-sensor-card--leak{bottom:8%;left:8%}.hero-sensor-kicker{font-size:7px;letter-spacing:.08em}.hero-sensor-value{font-size:.72rem}.hero-sensor-meta{font-size:8px}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.pointer-events-none{pointer-events:none}.invisible{visibility:hidden}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{top:0;right:0;bottom:0;left:0}.-right-20{right:-5rem}.-top-20{top:-5rem}.bottom-2{bottom:.5rem}.bottom-3{bottom:.75rem}.left-0{left:0}.left-3{left:.75rem}.left-4{left:1rem}.left-\[27px\]{left:27px}.right-0{right:0}.right-4{right:1rem}.top-0{top:0}.top-1\/2{top:50%}.top-2{top:.5rem}.top-4{top:1rem}.top-full{top:100%}.z-10{z-index:10}.z-50{z-index:50}.z-\[100\]{z-index:100}.z-\[60\]{z-index:60}.mx-auto{margin-left:auto;margin-right:auto}.mb-1{margin-bottom:.25rem}.mb-1\.5{margin-bottom:.375rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.ml-1{margin-left:.25rem}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-10{margin-top:2.5rem}.mt-12{margin-top:3rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-auto{margin-top:auto}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.line-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.hidden{display:none}.aspect-\[16\/10\]{aspect-ratio:16/10}.aspect-\[3\/4\]{aspect-ratio:3/4}.h-1\.5{height:.375rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-14{height:3.5rem}.h-16{height:4rem}.h-2{height:.5rem}.h-3{height:.75rem}.h-3\.5{height:.875rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-64{height:16rem}.h-7{height:1.75rem}.h-8{height:2rem}.h-9{height:2.25rem}.h-auto{height:auto}.h-full{height:100%}.max-h-screen{max-height:100vh}.min-h-0{min-height:0px}.min-h-screen{min-height:100vh}.w-1\.5{width:.375rem}.w-10{width:2.5rem}.w-12{width:3rem}.w-14{width:3.5rem}.w-2{width:.5rem}.w-3{width:.75rem}.w-3\.5{width:.875rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-64{width:16rem}.w-7{width:1.75rem}.w-8{width:2rem}.w-9{width:2.25rem}.w-full{width:100%}.w-px{width:1px}.min-w-\[240px\]{min-width:240px}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-7xl{max-width:80rem}.max-w-lg{max-width:32rem}.max-w-sm{max-width:24rem}.max-w-xl{max-width:36rem}.max-w-xs{max-width:20rem}.flex-1{flex:1 1 0%}.flex-shrink-0,.shrink-0{flex-shrink:0}.-translate-y-1\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-0{--tw-translate-x: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-full{--tw-translate-x: 100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes pulse{50%{opacity:.5}}@keyframes spin{to{transform:rotate(360deg)}}.cursor-pointer{cursor:pointer}.resize-none{resize:none}.list-none{list-style-type:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-center{align-items:center}.items-baseline{align-items:baseline}.items-stretch{align-items:stretch}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0\.5{gap:.125rem}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-10{gap:2.5rem}.gap-2{gap:.5rem}.gap-2\.5{gap:.625rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-8{gap:2rem}.space-y-0\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.125rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.125rem * var(--tw-space-y-reverse))}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.space-y-2\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.625rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.625rem * var(--tw-space-y-reverse))}.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.space-y-5>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.25rem * var(--tw-space-y-reverse))}.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.overflow-x-hidden{overflow-x:hidden}.rounded-2xl{border-radius:1rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:var(--radius)}.rounded-md{border-radius:calc(var(--radius) - 2px)}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-y{border-top-width:1px;border-bottom-width:1px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.border-l-2{border-left-width:2px}.border-t{border-top-width:1px}.border-accent{border-color:hsl(var(--accent))}.border-background\/10{border-color:hsl(var(--background) / .1)}.border-border{border-color:hsl(var(--border))}.border-border\/60{border-color:hsl(var(--border) / .6)}.border-input{border-color:hsl(var(--input))}.border-l-accent{border-left-color:hsl(var(--accent))}.border-l-sensor{border-left-color:hsl(var(--sensor))}.bg-accent{background-color:hsl(var(--accent))}.bg-accent\/10{background-color:hsl(var(--accent) / .1)}.bg-accent\/5{background-color:hsl(var(--accent) / .05)}.bg-background{background-color:hsl(var(--background))}.bg-background\/85{background-color:hsl(var(--background) / .85)}.bg-card{background-color:hsl(var(--card))}.bg-foreground{background-color:hsl(var(--foreground))}.bg-foreground\/20{background-color:hsl(var(--foreground) / .2)}.bg-secondary\/40{background-color:hsl(var(--secondary) / .4)}.bg-secondary\/50{background-color:hsl(var(--secondary) / .5)}.bg-sensor{background-color:hsl(var(--sensor))}.bg-transparent{background-color:transparent}.bg-gradient-to-b{background-image:linear-gradient(to bottom,var(--tw-gradient-stops))}.bg-gradient-to-t{background-image:linear-gradient(to top,var(--tw-gradient-stops))}.from-accent\/0{--tw-gradient-from: hsl(var(--accent) / 0) var(--tw-gradient-from-position);--tw-gradient-to: hsl(var(--accent) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.from-foreground\/80{--tw-gradient-from: hsl(var(--foreground) / .8) var(--tw-gradient-from-position);--tw-gradient-to: hsl(var(--foreground) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.from-foreground\/90{--tw-gradient-from: hsl(var(--foreground) / .9) var(--tw-gradient-from-position);--tw-gradient-to: hsl(var(--foreground) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.via-accent\/30{--tw-gradient-to: hsl(var(--accent) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), hsl(var(--accent) / .3) var(--tw-gradient-via-position), var(--tw-gradient-to)}.via-foreground\/30{--tw-gradient-to: hsl(var(--foreground) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), hsl(var(--foreground) / .3) var(--tw-gradient-via-position), var(--tw-gradient-to)}.to-accent\/0{--tw-gradient-to: hsl(var(--accent) / 0) var(--tw-gradient-to-position)}.to-transparent{--tw-gradient-to: transparent var(--tw-gradient-to-position)}.object-contain{-o-object-fit:contain;object-fit:contain}.object-cover{-o-object-fit:cover;object-fit:cover}.p-1\.5{padding:.375rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-1{padding-left:.25rem;padding-right:.25rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-16{padding-top:4rem;padding-bottom:4rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-20{padding-top:5rem;padding-bottom:5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-8{padding-top:2rem;padding-bottom:2rem}.pb-16{padding-bottom:4rem}.pb-2{padding-bottom:.5rem}.pl-4{padding-left:1rem}.pl-9{padding-left:2.25rem}.pr-16{padding-right:4rem}.pr-3{padding-right:.75rem}.pt-1\.5{padding-top:.375rem}.pt-16{padding-top:4rem}.pt-4{padding-top:1rem}.pt-6{padding-top:1.5rem}.pt-8{padding-top:2rem}.text-left{text-align:left}.text-center{text-align:center}.font-heading{font-family:var(--font-heading)}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.italic{font-style:italic}.leading-\[1\.1\]{line-height:1.1}.leading-relaxed{line-height:1.625}.leading-snug{line-height:1.375}.tracking-tight{letter-spacing:-.025em}.tracking-wider{letter-spacing:.05em}.text-accent{color:hsl(var(--accent))}.text-accent-foreground{color:hsl(var(--accent-foreground))}.text-background{color:hsl(var(--background))}.text-background\/40{color:hsl(var(--background) / .4)}.text-background\/50{color:hsl(var(--background) / .5)}.text-background\/60{color:hsl(var(--background) / .6)}.text-background\/70{color:hsl(var(--background) / .7)}.text-border{color:hsl(var(--border))}.text-foreground{color:hsl(var(--foreground))}.text-foreground\/70{color:hsl(var(--foreground) / .7)}.text-foreground\/80{color:hsl(var(--foreground) / .8)}.text-muted-foreground{color:hsl(var(--muted-foreground))}.text-sensor{color:hsl(var(--sensor))}.opacity-0{opacity:0}.opacity-100{opacity:1}.opacity-50{opacity:.5}.shadow-2xl{--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / .25);--tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-xl{--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.blur-3xl{--tw-blur: blur(64px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.brightness-0{--tw-brightness: brightness(0);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.invert{--tw-invert: invert(100%);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur-md{--tw-backdrop-blur: blur(12px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.backdrop-blur-sm{--tw-backdrop-blur: blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}@keyframes enter{0%{opacity:var(--tw-enter-opacity, 1);transform:translate3d(var(--tw-enter-translate-x, 0),var(--tw-enter-translate-y, 0),0) scale3d(var(--tw-enter-scale, 1),var(--tw-enter-scale, 1),var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity, 1);transform:translate3d(var(--tw-exit-translate-x, 0),var(--tw-exit-translate-y, 0),0) scale3d(var(--tw-exit-scale, 1),var(--tw-exit-scale, 1),var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0))}}.duration-200{animation-duration:.2s}.duration-300{animation-duration:.3s}.duration-500{animation-duration:.5s}.text-balance{text-wrap:balance}.hover\:gap-2\.5:hover{gap:.625rem}.hover\:border-accent\/40:hover{border-color:hsl(var(--accent) / .4)}.hover\:bg-accent:hover{background-color:hsl(var(--accent))}.hover\:bg-accent\/90:hover{background-color:hsl(var(--accent) / .9)}.hover\:bg-foreground\/90:hover{background-color:hsl(var(--foreground) / .9)}.hover\:bg-secondary:hover{background-color:hsl(var(--secondary))}.hover\:bg-secondary\/50:hover{background-color:hsl(var(--secondary) / .5)}.hover\:text-accent:hover{color:hsl(var(--accent))}.hover\:text-accent-foreground:hover{color:hsl(var(--accent-foreground))}.hover\:text-foreground:hover{color:hsl(var(--foreground))}.hover\:underline:hover{text-decoration-line:underline}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-2:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ring-accent:focus{--tw-ring-color: hsl(var(--accent))}.focus-visible\:outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px}.focus-visible\:ring-2:focus-visible{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.group:hover .group-hover\:block{display:block}.group:hover .group-hover\:translate-x-0\.5{--tw-translate-x: .125rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:translate-x-1{--tw-translate-x: .25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:scale-105{--tw-scale-x: 1.05;--tw-scale-y: 1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:text-accent{color:hsl(var(--accent))}.group\/menu-item:hover .group-hover\/menu-item\:opacity-100,.group:hover .group-hover\:opacity-100{opacity:1}@keyframes accordion-up{0%{height:var(--radix-accordion-content-height)}to{height:0}}@keyframes accordion-down{0%{height:0}to{height:var(--radix-accordion-content-height)}}.group[data-collapsible=offcanvas] .group-data-\[collapsible\=offcanvas\]\:left-\[calc\(var\(--sidebar-width\)\*-1\)\]{left:calc(var(--sidebar-width) * -1)}.group[data-collapsible=offcanvas] .group-data-\[collapsible\=offcanvas\]\:right-\[calc\(var\(--sidebar-width\)\*-1\)\]{right:calc(var(--sidebar-width) * -1)}.group[data-side=left] .group-data-\[side\=left\]\:-right-4{right:-1rem}.group[data-side=right] .group-data-\[side\=right\]\:left-0{left:0}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:-mt-8{margin-top:-2rem}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:hidden{display:none}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:\!size-8{width:2rem!important;height:2rem!important}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:w-\[--sidebar-width-icon\]{width:var(--sidebar-width-icon)}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:w-\[calc\(var\(--sidebar-width-icon\)_\+_theme\(spacing\.4\)\)\]{width:calc(var(--sidebar-width-icon) + 1rem)}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:w-\[calc\(var\(--sidebar-width-icon\)_\+_theme\(spacing\.4\)_\+2px\)\]{width:calc(var(--sidebar-width-icon) + 1rem + 2px)}.group[data-collapsible=offcanvas] .group-data-\[collapsible\=offcanvas\]\:w-0{width:0px}.group[data-collapsible=offcanvas] .group-data-\[collapsible\=offcanvas\]\:translate-x-0{--tw-translate-x: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group[data-side=right] .group-data-\[side\=right\]\:rotate-180,.group[data-state=open] .group-data-\[state\=open\]\:rotate-180{--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:overflow-hidden{overflow:hidden}.group[data-variant=floating] .group-data-\[variant\=floating\]\:rounded-lg{border-radius:var(--radius)}.group[data-variant=floating] .group-data-\[variant\=floating\]\:border{border-width:1px}.group[data-side=left] .group-data-\[side\=left\]\:border-r{border-right-width:1px}.group[data-side=right] .group-data-\[side\=right\]\:border-l{border-left-width:1px}.group[data-variant=floating] .group-data-\[variant\=floating\]\:border-sidebar-border{border-color:hsl(var(--sidebar-border))}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:\!p-0{padding:0!important}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:\!p-2{padding:.5rem!important}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:opacity-0{opacity:0}.group[data-variant=floating] .group-data-\[variant\=floating\]\:shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.group[data-collapsible=offcanvas] .group-data-\[collapsible\=offcanvas\]\:after\:left-full:after{content:var(--tw-content);left:100%}.group[data-collapsible=offcanvas] .group-data-\[collapsible\=offcanvas\]\:hover\:bg-sidebar:hover{background-color:hsl(var(--sidebar-background))}@media (min-width: 640px){.sm\:bottom-0{bottom:0}.sm\:right-0{right:0}.sm\:top-auto{top:auto}.sm\:inline{display:inline}.sm\:inline-flex{display:inline-flex}.sm\:w-auto{width:auto}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:flex-col{flex-direction:column}.sm\:items-end{align-items:flex-end}.sm\:items-center{align-items:center}.sm\:p-10{padding:2.5rem}.sm\:p-12{padding:3rem}.sm\:p-8{padding:2rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:text-3xl{font-size:1.875rem;line-height:2.25rem}.sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}.sm\:text-base{font-size:1rem;line-height:1.5rem}.sm\:text-lg{font-size:1.125rem;line-height:1.75rem}}@media (min-width: 768px){.md\:max-w-\[420px\]{max-width:420px}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width: 1024px){.lg\:sticky{position:sticky}.lg\:top-24{top:6rem}.lg\:col-span-3{grid-column:span 3 / span 3}.lg\:col-span-4{grid-column:span 4 / span 4}.lg\:col-span-5{grid-column:span 5 / span 5}.lg\:col-span-6{grid-column:span 6 / span 6}.lg\:col-span-7{grid-column:span 7 / span 7}.lg\:col-span-8{grid-column:span 8 / span 8}.lg\:col-span-9{grid-column:span 9 / span 9}.lg\:flex{display:flex}.lg\:hidden{display:none}.lg\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:gap-12{gap:3rem}.lg\:gap-16{gap:4rem}.lg\:p-16{padding:4rem}.lg\:px-8{padding-left:2rem;padding-right:2rem}.lg\:py-20{padding-top:5rem;padding-bottom:5rem}.lg\:text-4xl{font-size:2.25rem;line-height:2.5rem}.lg\:text-5xl{font-size:3rem;line-height:1}}@media (min-width: 1280px){.xl\:text-6xl{font-size:3.75rem;line-height:1}}

/* === Manus site custom (heroes, platform UI, partners, homepage) === */
/* Homepage scroll reveals: transform and opacity only for smooth, low-cost motion. */
.home-page.scroll-reveal-ready .scroll-reveal {
  opacity: 0;
  transform: translate3d(0, 28px, 0);
  transition: opacity 520ms cubic-bezier(0.23, 1, 0.32, 1), transform 520ms cubic-bezier(0.23, 1, 0.32, 1);
}

.home-page.scroll-reveal-ready .scroll-reveal.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.home-page.scroll-reveal-ready .scroll-reveal-child {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  transition: opacity 420ms cubic-bezier(0.23, 1, 0.32, 1), transform 420ms cubic-bezier(0.23, 1, 0.32, 1);
  transition-delay: var(--scroll-delay, 0ms);
}

.home-page.scroll-reveal-ready .scroll-reveal.is-visible .scroll-reveal-child {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

@media (prefers-reduced-motion: reduce) {
  .home-page.scroll-reveal-ready .scroll-reveal,
  .home-page.scroll-reveal-ready .scroll-reveal-child {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* Homepage hero carousel */
.hero-carousel{position:relative;display:grid;min-width:0;outline:none}
.hero-slide{grid-area:1/1;display:grid;grid-template-columns:minmax(0,1fr);align-items:center;min-width:0;opacity:0;visibility:hidden;pointer-events:none;transform:translateX(18px);transition:opacity .28s cubic-bezier(.23,1,.32,1),transform .28s cubic-bezier(.23,1,.32,1),visibility 0s linear .28s}
.hero-slide--active{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(0);transition-delay:0s}
.hero-slide--secondary{align-items:center}
.hero-platform-visual{display:flex;align-items:center;justify-content:center;width:100%;min-height:280px;max-height:500px}
.hero-platform-image{display:block;width:100%;height:100%;max-height:500px;object-fit:contain;filter:drop-shadow(0 18px 28px rgba(15,23,42,.08))}
.hero-carousel-controls{position:absolute;right:0;bottom:0;z-index:4;display:flex;align-items:center;gap:.55rem;padding:.4rem .5rem;border:1px solid hsl(var(--border));border-radius:9999px;background:hsl(var(--background) / .84);box-shadow:0 8px 18px rgba(15,23,42,.08);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.hero-carousel-arrow{display:inline-flex;align-items:center;justify-content:center;width:1.8rem;height:1.8rem;border:0;border-radius:9999px;background:transparent;color:hsl(var(--foreground));font-size:1rem;line-height:1;transition:background-color .16s ease,transform .16s ease}
.hero-carousel-arrow:hover{background:hsl(var(--secondary));transform:scale(1.04)}
.hero-carousel-arrow:active{transform:scale(.97)}
.hero-carousel-arrow:focus-visible,.hero-carousel-dot:focus-visible,.hero-carousel:focus-visible{outline:2px solid hsl(var(--ring));outline-offset:3px}
.hero-carousel-dots{display:flex;align-items:center;gap:.35rem}
.hero-carousel-dot{width:.42rem;height:.42rem;padding:0;border:0;border-radius:9999px;background:hsl(var(--muted-foreground) / .35);transition:width .18s cubic-bezier(.23,1,.32,1),background-color .18s ease}
.hero-carousel-dot--active{width:1.1rem;background:hsl(var(--accent))}
@media (min-width:1024px){
  .hero-slide{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:3rem}
  .hero-platform-visual{min-height:0}
}
@media (max-width:639px){
  .hero-carousel-controls{right:.25rem;bottom:.25rem}
  .hero-platform-visual{min-height:245px;max-height:350px;margin-top:1.25rem}
  .hero-platform-image{max-height:350px}
}
@media (prefers-reduced-motion:reduce){
  .hero-slide,.hero-carousel-arrow,.hero-carousel-dot{transition:none}
}


/* WSMART buildings full-background hero */
.buildings-hero h1{font-size:clamp(2.5rem,5vw,4.5rem);line-height:1.02;letter-spacing:-.04em;}
.buildings-hero{background-image:url("images/ecdc5ad65_case-01-commercial-plant-Drtl0BBH_7ae204ea.jpg");background-size:cover;background-position:center center;}
.buildings-hero-overlay{background:linear-gradient(90deg,rgba(7,18,33,.9) 0%,rgba(7,18,33,.78) 38%,rgba(7,18,33,.34) 72%,rgba(7,18,33,.48) 100%),linear-gradient(0deg,rgba(7,18,33,.3),rgba(7,18,33,.05));}
@media (max-width:639px){.buildings-hero{background-position:62% center;min-height:720px;}.buildings-hero-overlay{background:linear-gradient(180deg,rgba(7,18,33,.9) 0%,rgba(7,18,33,.72) 52%,rgba(7,18,33,.42) 100%);}}


/* WSMART buildings hero refinements */
.buildings-hero-facts{display:flex;align-items:center;column-gap:2rem;row-gap:.75rem;}
.buildings-hero-facts span{display:inline-flex;align-items:baseline;gap:.28rem;}
@media (max-width:639px){.buildings-hero-facts{column-gap:1.25rem;}}


/* WSMART buildings hero spacing refinement */
.buildings-hero-content{min-height:clamp(560px,calc(100vh - 64px),680px);padding-block:clamp(4.5rem,8vw,7rem);}
.buildings-hero-copy{width:100%;}
.buildings-hero-copy h1{max-width:12ch;}
.buildings-hero-copy>p{max-width:34rem;}
@media (max-width:639px){.buildings-hero-content{min-height:680px;padding-block:5rem 4.5rem;align-items:flex-start;}.buildings-hero-copy h1{max-width:10ch;}.buildings-hero-copy>p{max-width:22rem;}}


/* WSMART shared industry hero treatment */
.industry-hero{min-height:clamp(560px,calc(100vh - 64px),680px);background-size:cover;background-position:center center;}
.industry-hero-overlay{background:linear-gradient(90deg,rgba(7,18,33,.9) 0%,rgba(7,18,33,.78) 38%,rgba(7,18,33,.34) 72%,rgba(7,18,33,.48) 100%),linear-gradient(0deg,rgba(7,18,33,.3),rgba(7,18,33,.05));}
.industry-hero-content{min-height:clamp(560px,calc(100vh - 64px),680px);padding-block:clamp(4.5rem,8vw,7rem);}
.industry-hero-copy{width:100%;}
.industry-hero-copy h1{max-width:12ch;font-size:clamp(2.5rem,5vw,4.5rem);line-height:1.02;letter-spacing:-.04em;}
.industry-hero-copy>p{max-width:34rem;}
.industry-hero-facts{display:flex;align-items:center;column-gap:2rem;row-gap:.75rem;}
.industry-hero-facts span{display:inline-flex;align-items:baseline;gap:.28rem;}
.industry-hero-agriculture-aquaculture{background-image:url("images/012ed559f_industry-agriculture-greenhouse-SAKF9-pl_0fc89c48.jpg");}
.industry-hero-elderly-care{background-image:url("images/5ba7ac32b_industry-elderly-care-room-r8KVe2up_0854da1d.jpg");}
.industry-hero-energy-services{background-image:url("images/870a452bc_industry-energy-switchboard-DcP_xyVw_4fe7de2e.jpg");}
.industry-hero-healthcare{background-image:url("images/hospital.jpg");}
.industry-hero-manufacturing{background-image:url("images/manufacturer.jpg");}
.industry-hero-construction{background-image:url("images/industry-construction-hero-cranes.jpg");background-position:center 45%;}
.industry-hero-logistics{background-image:url("images/industry-logistics-hero.jpg");background-position:center 28%;}
.industry-hero-marine-vessels{background-image:url("images/ship.jpg");}
.industry-hero-retail-malls{background-image:url("images/shppingmall.jpg");}
@media (max-width:639px){.industry-hero-facts{column-gap:1.25rem;}.industry-hero{min-height:680px;background-position:62% center;}.industry-hero-content{min-height:680px;padding-block:5rem 4.5rem;align-items:flex-start;}.industry-hero-overlay{background:linear-gradient(180deg,rgba(7,18,33,.9) 0%,rgba(7,18,33,.72) 52%,rgba(7,18,33,.42) 100%);}.industry-hero-copy h1{max-width:10ch;}.industry-hero-copy>p{max-width:22rem;}}


/* WSMART platform hero treatment */
.platform-hero{min-height:clamp(560px,calc(100vh - 64px),680px);background-color:#071221;background-image:url("images/736356647_generated_cf9187f6-CHOvzVHy_1e140667.webp");background-size:cover;background-position:center center;}
.platform-hero-overlay{background:linear-gradient(90deg,rgba(7,18,33,.94) 0%,rgba(7,18,33,.86) 34%,rgba(7,18,33,.4) 68%,rgba(7,18,33,.62) 100%),linear-gradient(0deg,rgba(7,18,33,.25),rgba(7,18,33,.08));}
.platform-hero-content{min-height:clamp(560px,calc(100vh - 64px),680px);padding-block:clamp(4.5rem,8vw,7rem);}
.platform-hero-copy{width:100%;}
.platform-hero-copy h1{max-width:12ch;font-size:clamp(2.5rem,5vw,4.5rem);line-height:1.02;letter-spacing:-.04em;}
.platform-hero-copy>p{max-width:34rem;}
.platform-hero-facts{display:flex;align-items:center;column-gap:2rem;row-gap:.75rem;}
.platform-hero-facts span{display:inline-flex;align-items:baseline;gap:.28rem;}
@media (max-width:639px){.platform-hero{min-height:680px;background-position:62% center;}.platform-hero-content{min-height:680px;padding-block:5rem 4.5rem;align-items:flex-start;}.platform-hero-overlay{background:linear-gradient(180deg,rgba(7,18,33,.94) 0%,rgba(7,18,33,.8) 52%,rgba(7,18,33,.46) 100%);}.platform-hero-copy h1{max-width:10ch;}.platform-hero-copy>p{max-width:22rem;}.platform-hero-facts{column-gap:1.25rem;}}


/* WSMART solutions hero treatment */
.solutions-hero{min-height:clamp(560px,calc(100vh - 64px),680px);background-color:#071221;background-image:url("images/b2e0603d1_generated_928450bd-DT__FsPX_62559f1d.webp");background-size:cover;background-position:center center;}
.solutions-hero-overlay{background:linear-gradient(90deg,rgba(7,18,33,.94) 0%,rgba(7,18,33,.86) 34%,rgba(7,18,33,.4) 68%,rgba(7,18,33,.62) 100%),linear-gradient(0deg,rgba(7,18,33,.25),rgba(7,18,33,.08));}
.solutions-hero-content{min-height:clamp(560px,calc(100vh - 64px),680px);padding-block:clamp(4.5rem,8vw,7rem);}
.solutions-hero-copy{width:100%;}
.solutions-hero-copy h1{max-width:12ch;font-size:clamp(2.5rem,5vw,4.5rem);line-height:1.02;letter-spacing:-.04em;}
.solutions-hero-copy>p{max-width:34rem;}
.solutions-hero-facts{display:flex;align-items:center;column-gap:2rem;row-gap:.75rem;}
.solutions-hero-facts span{display:inline-flex;align-items:baseline;gap:.28rem;}
@media (max-width:639px){.solutions-hero{min-height:680px;background-position:62% center;}.solutions-hero-content{min-height:680px;padding-block:5rem 4.5rem;align-items:flex-start;}.solutions-hero-overlay{background:linear-gradient(180deg,rgba(7,18,33,.94) 0%,rgba(7,18,33,.8) 52%,rgba(7,18,33,.46) 100%);}.solutions-hero-copy h1{max-width:10ch;}.solutions-hero-copy>p{max-width:22rem;}.solutions-hero-facts{column-gap:1.25rem;}}


/* WSMART cloud monitoring split hero */
.cloud-monitoring-hero{position:relative;isolation:isolate;}
.cloud-monitoring-hero-content{padding-block:clamp(2.75rem,5vw,4.75rem);}
.cloud-monitoring-hero-grid{min-height:0;}
.cloud-monitoring-hero-copy h1{max-width:10ch;font-size:clamp(2.5rem,5vw,4.5rem);line-height:1.02;letter-spacing:-.04em;}
.cloud-monitoring-hero-copy>p{max-width:34rem;}
.cloud-monitoring-hero-facts{display:flex;align-items:center;column-gap:2rem;row-gap:.75rem;}
.cloud-monitoring-hero-facts span{display:inline-flex;align-items:baseline;gap:.28rem;}
.cloud-monitoring-hero-visual{isolation:isolate;min-height:420px;}
@media (max-width:639px){.cloud-monitoring-hero-content{padding-block:2.75rem 3.25rem;}.cloud-monitoring-hero-grid{min-height:0;}.cloud-monitoring-hero-copy h1{max-width:11ch;}.cloud-monitoring-hero-copy>p{max-width:24rem;}.cloud-monitoring-hero-facts{column-gap:1.25rem;}.cloud-monitoring-hero-visual{min-height:280px;}.cloud-monitoring-hero-visual>div:last-child{padding:.5rem;}}





/* Hong Kong Traditional Chinese CTA accent */
html[lang="zh-Hant"] .hk-cta{transition:background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease;}
html[lang="zh-Hant"] .hk-cta:hover,html[lang="zh-Hant"] .hk-cta:focus-visible{background-color:#d9385b;border-color:#d9385b;color:#fff;box-shadow:0 8px 20px rgba(217,56,91,.22);}
html[lang="zh-Hant"] .hk-cta:focus-visible{outline:2px solid #d9385b;outline-offset:3px;}
html[lang="zh-Hant"] .hk-cta:active{transform:scale(.97);}
@media (prefers-reduced-motion: reduce){html[lang="zh-Hant"] .hk-cta{transition:none;}}

/* Platform UI showcase */
.platform-ui-showcase-section{overflow:hidden;}
.platform-ui-tab{border:1px solid var(--border);border-radius:999px;background:var(--card);color:var(--muted-foreground);font-size:.72rem;font-weight:600;padding:.55rem .8rem;transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;}
.platform-ui-tab:hover,.platform-ui-tab:focus-visible{border-color:var(--accent);color:var(--foreground);outline:none;}
.platform-ui-tab.is-active{background:var(--foreground);border-color:var(--foreground);color:var(--background);}
.platform-ui-tab:active{transform:scale(.97);}
.platform-ui-signal-dot{width:.65rem;height:.65rem;flex:0 0 auto;margin-top:.2rem;border-radius:999px;background:#2eb4d1;box-shadow:0 0 0 5px rgba(46,180,209,.12);}
.platform-ui-frame{overflow:hidden;border:1px solid rgba(46,180,209,.2);border-radius:1.1rem;background:#0b1423;box-shadow:0 24px 70px rgba(10,31,58,.16);}
.platform-ui-frame-bar{display:flex;align-items:center;gap:.35rem;height:2.25rem;padding:0 .8rem;background:#111d30;color:rgba(255,255,255,.5);font-size:.58rem;letter-spacing:.14em;}
.platform-ui-frame-bar span{width:.42rem;height:.42rem;border-radius:999px;background:#3cc7dd;opacity:.85;}
.platform-ui-frame-bar span:nth-child(2){background:#f2b84b;}.platform-ui-frame-bar span:nth-child(3){background:#e95f78;}
.platform-ui-frame-bar em{margin-left:auto;font-style:normal;}
.platform-ui-panels{position:relative;background:#0b1423;}
.platform-ui-panel{display:block;width:100%;height:auto;opacity:0;visibility:hidden;transition:opacity .22s ease;}
.platform-ui-panel:not(:first-child){position:absolute;inset:0;}
.platform-ui-panel.is-active{opacity:1;visibility:visible;}
.platform-ui-mobile-row{display:grid;grid-template-columns:minmax(110px,145px) minmax(110px,145px) 1fr;align-items:start;gap:1rem;margin-top:1.25rem;}
.platform-ui-phone{margin:0;overflow:hidden;border:5px solid #121d2e;border-radius:1.35rem;background:#fff;box-shadow:0 16px 32px rgba(10,31,58,.12);}
.platform-ui-phone img{display:block;width:100%;height:auto;}
.platform-ui-phone figcaption{padding:.6rem .65rem;color:var(--foreground);font-size:.68rem;font-weight:600;line-height:1.25;}
.platform-ui-mobile-copy{align-self:center;padding:.5rem 0 0 .75rem;}
@media (max-width:1023px){.platform-ui-mobile-row{grid-template-columns:120px 120px 1fr;}}
@media (max-width:639px){.platform-ui-showcase-section .py-20{padding-top:4rem;padding-bottom:4rem;}.platform-ui-frame{border-radius:.85rem;}.platform-ui-frame-bar{height:2rem;font-size:.5rem;}.platform-ui-mobile-row{grid-template-columns:1fr 1fr;gap:.75rem;align-items:start;}.platform-ui-mobile-copy{grid-column:1/-1;padding:.5rem 0 0;}.platform-ui-phone{border-width:4px;border-radius:1rem;}.platform-ui-phone figcaption{font-size:.62rem;padding:.5rem;}}
@media (prefers-reduced-motion:reduce){.platform-ui-tab,.platform-ui-panel{transition:none;}}

/* Platform UI presentation refinement: angled dashboard + real-device mobile mockups */
@media (min-width:1024px){
  .platform-ui-frame{transform:perspective(1400px) rotateY(-6deg) rotateX(1.5deg);transform-origin:72% 50%;transition:transform .35s cubic-bezier(.23,1,.32,1),box-shadow .35s ease;}
  .platform-ui-frame:hover{transform:perspective(1400px) rotateY(-2deg) rotateX(.5deg) translateY(-3px);box-shadow:0 30px 80px rgba(10,31,58,.2);}
}
.platform-ui-mobile-stage{position:relative;display:flex;align-items:flex-end;min-height:245px;padding:1.25rem 1rem 0;isolation:isolate;}
.platform-ui-mobile-stage::before{content:"";position:absolute;inset:1.5rem 0 0;border-radius:1.5rem;background:linear-gradient(135deg,rgba(46,180,209,.12),rgba(217,56,91,.06));z-index:-1;}
.platform-ui-device{position:relative;margin:0;width:clamp(96px,10vw,132px);padding:5px;border:2px solid #c9d1dc;border-radius:1.35rem;background:linear-gradient(145deg,#f8fafc 0%,#8793a3 48%,#1d2939 100%);box-shadow:0 18px 30px rgba(9,25,43,.22);}
.platform-ui-device-primary{z-index:2;transform:rotate(-8deg) translate(10px,-5px);}
.platform-ui-device-secondary{z-index:1;margin-left:-2.2rem;transform:rotate(9deg) translate(0,8px) scale(.92);filter:saturate(.88);}
.platform-ui-device-screen{position:relative;overflow:hidden;border-radius:1.05rem;background:#fff;}
.platform-ui-device-screen img{display:block;width:100%;height:auto;}
.platform-ui-device-speaker{position:absolute;z-index:2;top:5px;left:50%;width:34%;height:9px;transform:translateX(-50%);border-radius:999px;background:#0d1420;box-shadow:0 1px 2px rgba(0,0,0,.25);}
.platform-ui-device figcaption{padding:.38rem .2rem .12rem;color:#eef3f8;font-size:.6rem;font-weight:700;text-align:center;letter-spacing:.08em;text-transform:uppercase;}
.platform-ui-device-badge{position:absolute;right:-.75rem;bottom:1.35rem;z-index:3;padding:.48rem .65rem;border:1px solid rgba(255,255,255,.7);border-radius:.7rem;background:#d9385b;color:#fff;box-shadow:0 10px 20px rgba(217,56,91,.23);font-size:.56rem;font-weight:800;letter-spacing:.1em;}
.platform-ui-mobile-copy{position:relative;z-index:4;}
@media (max-width:1023px){.platform-ui-mobile-stage{min-height:220px;}.platform-ui-device{width:116px;}}
@media (max-width:639px){.platform-ui-frame{transform:none;}.platform-ui-mobile-row{display:grid;grid-template-columns:1fr;gap:.75rem;}.platform-ui-mobile-stage{justify-content:center;min-height:270px;padding-top:1.75rem;}.platform-ui-device{width:130px;}.platform-ui-device-primary{transform:rotate(-8deg) translate(18px,-5px);}.platform-ui-device-secondary{margin-left:-2.8rem;transform:rotate(9deg) translate(0,12px) scale(.92);}.platform-ui-mobile-copy{grid-column:auto;padding:.5rem 0 0;}.platform-ui-device-badge{right:calc(50% - 8rem);bottom:1rem;}}
@media (prefers-reduced-motion:reduce){.platform-ui-frame{transition:none;}.platform-ui-frame:hover{transform:none;}}

/* Platform UI showcase: clearer mobile command centre and function bubbles */
.platform-ui-mobile-feature-area{display:grid;grid-template-columns:minmax(300px,1.05fr) minmax(230px,.95fr);gap:1.25rem;align-items:center;margin-top:1.35rem;}
.platform-ui-mobile-stage{min-height:330px;padding:2.25rem 1.2rem .75rem;}
.platform-ui-mobile-stage::before{inset:1.75rem 0 0;border-radius:1.75rem;background:radial-gradient(circle at 50% 45%,rgba(46,180,209,.17),transparent 62%),linear-gradient(135deg,rgba(46,180,209,.1),rgba(217,56,91,.07));}
.platform-ui-stage-kicker{position:absolute;top:.75rem;left:1.1rem;color:var(--muted-foreground);font-size:.55rem;font-weight:800;letter-spacing:.18em;}
.platform-ui-device{width:clamp(140px,12vw,174px);}
.platform-ui-device-primary{transform:rotate(-7deg) translate(20px,-5px);}
.platform-ui-device-secondary{margin-left:-3.3rem;transform:rotate(8deg) translate(0,12px) scale(.91);}
.platform-ui-device-badge{right:-.35rem;bottom:1.7rem;}
.platform-ui-functions{min-width:0;}
.platform-ui-function-bubble{position:relative;display:flex;gap:.75rem;align-items:flex-start;margin-bottom:.65rem;padding:.78rem .85rem;border:1px solid rgba(46,180,209,.18);border-radius:.85rem;background:rgba(255,255,255,.72);box-shadow:0 8px 22px rgba(10,31,58,.06);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;}
.platform-ui-function-bubble::before{content:"";position:absolute;left:-.5rem;top:1.15rem;width:.55rem;height:.55rem;border-left:1px solid rgba(46,180,209,.3);border-bottom:1px solid rgba(46,180,209,.3);background:var(--background);transform:rotate(45deg);}
.platform-ui-function-bubble:hover{transform:translateX(4px);border-color:rgba(217,56,91,.35);box-shadow:0 12px 28px rgba(10,31,58,.1);}
.platform-ui-bubble-index{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:1.55rem;height:1.55rem;border-radius:999px;background:#d9385b;color:#fff;font-size:.58rem;font-weight:800;letter-spacing:.04em;}
.platform-ui-function-bubble strong{display:block;color:var(--foreground);font-size:.76rem;line-height:1.25;}
.platform-ui-function-bubble p{margin-top:.25rem;color:var(--muted-foreground);font-size:.68rem;line-height:1.45;}
.platform-ui-functions .platform-ui-mobile-copy{padding:.45rem .2rem 0;}
@media (max-width:1023px){.platform-ui-mobile-feature-area{grid-template-columns:minmax(250px,1fr) minmax(220px,1fr);}.platform-ui-mobile-stage{min-height:300px;}.platform-ui-device{width:145px;}}
@media (max-width:639px){.platform-ui-mobile-feature-area{display:block;margin-top:.85rem;}.platform-ui-mobile-stage{min-height:330px;margin-bottom:1.25rem;padding-top:2.25rem;}.platform-ui-device{width:142px;}.platform-ui-device-primary{transform:rotate(-7deg) translate(18px,-5px);}.platform-ui-device-secondary{margin-left:-3rem;transform:rotate(8deg) translate(0,12px) scale(.91);}.platform-ui-device-badge{right:calc(50% - 8rem);bottom:1.55rem;}.platform-ui-function-bubble::before{display:none;}.platform-ui-function-bubble{margin-bottom:.55rem;}.platform-ui-functions .platform-ui-mobile-copy{padding-top:.7rem;}}
@media (prefers-reduced-motion:reduce){.platform-ui-function-bubble{transition:none;}.platform-ui-function-bubble:hover{transform:none;}}

/* Mobile UI mockup: slight upward-facing product angle */
.platform-ui-mobile-stage{perspective:900px;}
.platform-ui-device-primary{transform:perspective(850px) rotateX(-8deg) rotateY(-7deg) rotateZ(-7deg) translate(20px,-5px);transform-origin:50% 72%;}
.platform-ui-device-secondary{transform:perspective(850px) rotateX(-6deg) rotateY(7deg) rotateZ(8deg) translate(0,12px) scale(.91);transform-origin:50% 72%;}
@media (max-width:1023px){.platform-ui-device-primary{transform:perspective(850px) rotateX(-7deg) rotateY(-6deg) rotateZ(-7deg) translate(18px,-5px);}.platform-ui-device-secondary{transform:perspective(850px) rotateX(-5deg) rotateY(6deg) rotateZ(8deg) translate(0,10px) scale(.91);}}
@media (max-width:639px){.platform-ui-device-primary{transform:perspective(850px) rotateX(-7deg) rotateY(-5deg) rotateZ(-7deg) translate(18px,-5px);}.platform-ui-device-secondary{transform:perspective(850px) rotateX(-5deg) rotateY(5deg) rotateZ(8deg) translate(0,10px) scale(.91);}}
@media (prefers-reduced-motion:reduce){.platform-ui-device-primary,.platform-ui-device-secondary{transition:none;}}

/* Real-device detailing for the App phone mockups */
.platform-ui-device{isolation:isolate;border-color:#aeb9c8;background:linear-gradient(145deg,#ffffff 0%,#b7c2cf 34%,#6d7a8b 66%,#202d3e 100%);box-shadow:inset 1px 1px 0 rgba(255,255,255,.9),inset -1px -1px 0 rgba(8,20,35,.7),0 20px 34px rgba(9,25,43,.24);}
.platform-ui-device::before{content:"";position:absolute;z-index:-1;left:-4px;top:25%;width:3px;height:18px;border-radius:2px 0 0 2px;background:linear-gradient(#dce5ee,#788696);box-shadow:0 25px 0 #a8b5c3,0 31px 0 #a8b5c3;}
.platform-ui-device::after{content:"";position:absolute;z-index:-1;right:-4px;top:34%;width:3px;height:34px;border-radius:0 2px 2px 0;background:linear-gradient(#dce5ee,#788696);box-shadow:inset -1px 0 0 rgba(30,45,62,.7);}
.platform-ui-device-screen{box-shadow:inset 0 0 0 1px rgba(13,20,32,.25),inset 0 0 18px rgba(13,20,32,.12);}
.platform-ui-device-screen::after{content:"";position:absolute;z-index:3;inset:0;pointer-events:none;background:linear-gradient(118deg,rgba(255,255,255,.24),transparent 22%,transparent 70%,rgba(255,255,255,.08));mix-blend-mode:screen;}
.platform-ui-device-speaker{top:5px;width:38%;height:9px;background:linear-gradient(180deg,#263346,#070b12);box-shadow:inset 0 1px 1px rgba(255,255,255,.12),0 1px 2px rgba(0,0,0,.35);}
.platform-ui-camera-cluster{position:absolute;z-index:4;top:7px;right:9px;display:flex;gap:3px;align-items:center;padding:2px 3px;border-radius:999px;background:rgba(9,16,27,.62);box-shadow:0 1px 2px rgba(0,0,0,.25);}
.platform-ui-camera-cluster i{display:block;width:3px;height:3px;border-radius:50%;background:#111a28;box-shadow:inset 0 0 0 1px rgba(167,226,239,.65);}
.platform-ui-camera-cluster i:first-child{width:4px;height:4px;background:#07101d;box-shadow:inset 0 0 0 1px rgba(116,210,228,.8),0 0 2px rgba(116,210,228,.55);}
.platform-ui-device-primary::before{box-shadow:0 25px 0 #a8b5c3,0 31px 0 #a8b5c3,0 0 0 0 rgba(0,0,0,0);}
@media (max-width:639px){.platform-ui-device::before{left:-3px;width:2px;height:15px;box-shadow:0 21px 0 #a8b5c3,0 26px 0 #a8b5c3;}.platform-ui-device::after{right:-3px;width:2px;height:29px;}.platform-ui-camera-cluster{top:6px;right:7px;gap:2px;padding:1px 2px;}.platform-ui-camera-cluster i{width:2px;height:2px;}.platform-ui-camera-cluster i:first-child{width:3px;height:3px;}}

/* Keep the physical side buttons visible outside the phone silhouette */
.platform-ui-device::before,.platform-ui-device::after{z-index:4;}

/* Reference-inspired mobile product composition: one hero phone with a quiet supporting screen */
.platform-ui-mobile-stage{justify-content:center;min-height:390px;padding:2.65rem 1.25rem 1rem;overflow:visible;}
.platform-ui-mobile-stage::before{inset:2rem .25rem 0;border-radius:2rem;background:radial-gradient(circle at 58% 40%,rgba(46,180,209,.18),transparent 54%),linear-gradient(145deg,rgba(46,180,209,.1),rgba(217,56,91,.08));}
.platform-ui-device{border-width:3px;border-radius:2rem;padding:7px;background:linear-gradient(145deg,#f7fafc 0%,#aeb9c6 35%,#5c6979 67%,#111b2a 100%);box-shadow:inset 1px 1px 0 rgba(255,255,255,.96),inset -2px -2px 0 rgba(5,13,24,.76),0 24px 38px rgba(9,25,43,.28);}
.platform-ui-device-primary{position:relative;z-index:3;width:clamp(178px,15vw,220px);margin:0;transform:perspective(1000px) rotateX(-5deg) rotateY(-4deg) rotateZ(7deg) translate(10px,-4px);transform-origin:50% 72%;}
.platform-ui-device-secondary{position:absolute;left:7%;top:19%;z-index:1;width:clamp(145px,11vw,170px);margin:0;opacity:.56;filter:saturate(.72) contrast(.95);transform:perspective(1000px) rotateX(-4deg) rotateY(8deg) rotateZ(-10deg) translate(-4px,18px) scale(.9);transform-origin:50% 72%;}
.platform-ui-device-primary .platform-ui-device-screen{border-radius:1.5rem;}
.platform-ui-device-secondary .platform-ui-device-screen{border-radius:1.25rem;}
.platform-ui-device-screen img{object-fit:cover;}
.platform-ui-device-primary .platform-ui-device-screen img{object-position:center top;}
.platform-ui-device-badge{right:2%;bottom:1.2rem;z-index:5;}
@media (max-width:1023px){.platform-ui-mobile-stage{min-height:360px;}.platform-ui-device-primary{width:190px;}.platform-ui-device-secondary{left:8%;width:150px;}}
@media (max-width:639px){.platform-ui-mobile-stage{min-height:395px;padding:2.5rem .75rem 1rem;}.platform-ui-mobile-stage::before{inset:1.75rem 0 0;border-radius:1.75rem;}.platform-ui-device-primary{width:178px;transform:perspective(900px) rotateX(-5deg) rotateY(-4deg) rotateZ(7deg) translate(10px,-2px);}.platform-ui-device-secondary{left:2%;top:20%;width:138px;transform:perspective(900px) rotateX(-4deg) rotateY(8deg) rotateZ(-10deg) translate(-2px,14px) scale(.88);}.platform-ui-device-badge{right:1%;bottom:1rem;}}

/* Wider two-phone composition: same reference-inspired size, direction and upward-facing angle */
.platform-ui-mobile-feature-area{grid-template-columns:minmax(400px,1.35fr) minmax(220px,.65fr);gap:1.5rem;}
.platform-ui-mobile-stage{min-height:430px;padding:2.75rem 1rem 1rem;}
.platform-ui-device-primary,.platform-ui-device-secondary{width:clamp(188px,16vw,228px);}
.platform-ui-device-primary{transform:perspective(1000px) rotateX(-5deg) rotateY(-4deg) rotateZ(10deg) translate(32px,-6px);}
.platform-ui-device-secondary{left:2%;top:20%;opacity:.52;filter:saturate(.72) contrast(.95);transform:perspective(1000px) rotateX(-5deg) rotateY(-4deg) rotateZ(10deg) translate(-10px,28px);}
.platform-ui-device-badge{right:0;bottom:1.1rem;}
@media (max-width:1023px){.platform-ui-mobile-feature-area{grid-template-columns:minmax(300px,1.2fr) minmax(210px,.8fr);}.platform-ui-mobile-stage{min-height:400px;}.platform-ui-device-primary,.platform-ui-device-secondary{width:190px;}.platform-ui-device-primary{transform:perspective(950px) rotateX(-5deg) rotateY(-4deg) rotateZ(10deg) translate(24px,-4px);}.platform-ui-device-secondary{left:2%;top:20%;transform:perspective(950px) rotateX(-5deg) rotateY(-4deg) rotateZ(10deg) translate(-8px,24px);}}
@media (max-width:639px){.platform-ui-mobile-feature-area{display:block;margin-top:.85rem;}.platform-ui-mobile-stage{min-height:420px;padding:2.5rem .5rem 1rem;}.platform-ui-device-primary,.platform-ui-device-secondary{width:178px;}.platform-ui-device-primary{transform:perspective(900px) rotateX(-5deg) rotateY(-4deg) rotateZ(10deg) translate(28px,-3px);}.platform-ui-device-secondary{left:0;top:21%;transform:perspective(900px) rotateX(-5deg) rotateY(-4deg) rotateZ(10deg) translate(-10px,24px);opacity:.5;}.platform-ui-device-badge{right:0;bottom:1rem;}}

/* Exact reference-angle correction: top of each portrait phone leans right, with visible right-side depth */
.platform-ui-device-primary,.platform-ui-device-secondary{transform-origin:50% 78%;}
.platform-ui-device-primary{transform:perspective(1200px) rotateX(-4deg) rotateY(-8deg) rotateZ(14deg) translate(34px,-7px);}
.platform-ui-device-secondary{transform:perspective(1200px) rotateX(-4deg) rotateY(-8deg) rotateZ(14deg) translate(-12px,30px);}
@media (max-width:1023px){.platform-ui-device-primary{transform:perspective(1100px) rotateX(-4deg) rotateY(-8deg) rotateZ(14deg) translate(27px,-5px);}.platform-ui-device-secondary{transform:perspective(1100px) rotateX(-4deg) rotateY(-8deg) rotateZ(14deg) translate(-10px,27px);}}
@media (max-width:639px){.platform-ui-device-primary{transform:perspective(1000px) rotateX(-4deg) rotateY(-8deg) rotateZ(14deg) translate(30px,-4px);}.platform-ui-device-secondary{transform:perspective(1000px) rotateX(-4deg) rotateY(-8deg) rotateZ(14deg) translate(-11px,26px);}}

/* Mobile showcase interaction layer: reference-style glow, metrics and subtle depth */
.platform-ui-mobile-stage{--phone-parallax-x:0px;--phone-parallax-y:0px;}
.platform-ui-mobile-stage::before{background:radial-gradient(circle at 55% 42%,rgba(255,255,255,.9) 0 12%,rgba(46,180,209,.16) 38%,transparent 68%),linear-gradient(145deg,rgba(46,180,209,.12),rgba(217,56,91,.08));box-shadow:0 18px 55px rgba(46,180,209,.12),inset 0 1px 0 rgba(255,255,255,.8);}
.platform-ui-data-card{position:absolute;z-index:6;display:flex;align-items:center;gap:.55rem;min-width:116px;padding:.58rem .7rem;border:1px solid rgba(255,255,255,.86);border-radius:.85rem;background:rgba(255,255,255,.84);box-shadow:0 12px 26px rgba(25,53,76,.12);backdrop-filter:blur(10px);color:var(--foreground);pointer-events:none;animation:platform-card-float 4.5s ease-in-out infinite;}
.platform-ui-data-card-top{top:4.6rem;right:1.1rem;}
.platform-ui-data-card-bottom{left:.75rem;bottom:2.1rem;animation-delay:-2.2s;}
.platform-ui-data-card small{display:block;color:var(--muted-foreground);font-size:.48rem;font-weight:800;letter-spacing:.13em;line-height:1.2;}
.platform-ui-data-card strong{display:block;margin-top:.15rem;font-size:.68rem;line-height:1.2;}
.platform-ui-data-card-dot{width:.48rem;height:.48rem;flex:none;border-radius:50%;background:#2eb4d1;box-shadow:0 0 0 4px rgba(46,180,209,.13);}
.platform-ui-data-card-dot.is-pink{background:#d9385b;box-shadow:0 0 0 4px rgba(217,56,91,.12);}
.platform-ui-device[role="button"]{cursor:pointer;outline:none;transition:filter .2s ease,box-shadow .2s ease;}
.platform-ui-device[role="button"]:focus-visible{box-shadow:0 0 0 3px rgba(217,56,91,.35),inset 1px 1px 0 rgba(255,255,255,.96),inset -2px -2px 0 rgba(5,13,24,.76),0 24px 38px rgba(9,25,43,.28);}
.platform-ui-device[role="button"]:hover{filter:saturate(1.06) brightness(1.02);}
.platform-ui-device-primary{transform:perspective(1200px) rotateX(-4deg) rotateY(-8deg) rotateZ(14deg) translate(calc(34px + var(--phone-parallax-x)),calc(-7px + var(--phone-parallax-y)));transition:transform .24s cubic-bezier(.23,1,.32,1),filter .2s ease,box-shadow .2s ease;}
.platform-ui-device-secondary{transform:perspective(1200px) rotateX(-4deg) rotateY(-8deg) rotateZ(14deg) translate(calc(-12px + var(--phone-parallax-x)),calc(30px + var(--phone-parallax-y)));transition:transform .28s cubic-bezier(.23,1,.32,1),filter .2s ease,box-shadow .2s ease;}
@keyframes platform-card-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@media (max-width:1023px){.platform-ui-device-primary{transform:perspective(1100px) rotateX(-4deg) rotateY(-8deg) rotateZ(14deg) translate(calc(27px + var(--phone-parallax-x)),calc(-5px + var(--phone-parallax-y)));}.platform-ui-device-secondary{transform:perspective(1100px) rotateX(-4deg) rotateY(-8deg) rotateZ(14deg) translate(calc(-10px + var(--phone-parallax-x)),calc(27px + var(--phone-parallax-y)));}}
@media (max-width:639px){.platform-ui-data-card{min-width:104px;padding:.5rem .58rem;}.platform-ui-data-card-top{top:4.2rem;right:.25rem;}.platform-ui-data-card-bottom{left:.2rem;bottom:1.75rem;}.platform-ui-device-primary{transform:perspective(1000px) rotateX(-4deg) rotateY(-8deg) rotateZ(14deg) translate(calc(30px + var(--phone-parallax-x)),calc(-4px + var(--phone-parallax-y)));}.platform-ui-device-secondary{transform:perspective(1000px) rotateX(-4deg) rotateY(-8deg) rotateZ(14deg) translate(calc(-11px + var(--phone-parallax-x)),calc(26px + var(--phone-parallax-y)));}}
@media (prefers-reduced-motion:reduce){.platform-ui-data-card{animation:none;}.platform-ui-device-primary,.platform-ui-device-secondary{transition:none;}.platform-ui-mobile-stage{--phone-parallax-x:0px!important;--phone-parallax-y:0px!important;}}

/* Dashboard hero presentation inspired by the supplied SaaS reference */
.platform-ui-dashboard-stage{position:relative;min-height:560px;padding:1.15rem 0 2rem;perspective:1500px;isolation:isolate;}
.platform-ui-dashboard-stage::before{content:"";position:absolute;inset:2rem -2rem 0;border-radius:2.5rem;background:radial-gradient(circle at 68% 34%,rgba(46,180,209,.18),transparent 42%),linear-gradient(145deg,rgba(255,255,255,.92),rgba(236,247,251,.7));box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 28px 80px rgba(35,106,137,.1);z-index:-2;}
.platform-ui-dashboard-orb{position:absolute;z-index:-1;top:1rem;right:12%;width:12rem;height:12rem;border-radius:50%;background:radial-gradient(circle at 35% 30%,#61e1ed 0,#2e8bd0 34%,#183d9b 72%,rgba(24,61,155,0) 73%);filter:blur(.3px);opacity:.8;box-shadow:0 22px 50px rgba(31,100,190,.22);}
.platform-ui-dashboard-stage .platform-ui-frame{position:relative;z-index:3;width:calc(100% + 3rem);margin-left:-1.5rem;border-color:rgba(46,180,209,.24);border-radius:1.35rem;background:#f8fbff;box-shadow:0 36px 76px rgba(15,58,92,.2),0 0 0 8px rgba(255,255,255,.48);transform:perspective(1500px) rotateY(-7deg) rotateX(2deg) rotateZ(1.1deg);transform-origin:72% 52%;transition:transform .35s cubic-bezier(.23,1,.32,1),box-shadow .35s ease;}
.platform-ui-dashboard-stage .platform-ui-frame:hover{transform:perspective(1500px) rotateY(-3deg) rotateX(1deg) rotateZ(.5deg) translateY(-5px);box-shadow:0 44px 88px rgba(15,58,92,.24),0 0 0 8px rgba(255,255,255,.58);}
.platform-ui-dashboard-stage .platform-ui-frame-bar{background:rgba(241,247,252,.95);color:#668092;border-bottom:1px solid rgba(46,180,209,.12);}
.platform-ui-dashboard-stage .platform-ui-panels{background:#f8fbff;}
.platform-ui-dashboard-float-card{position:absolute;z-index:5;display:flex;align-items:center;gap:.55rem;min-width:132px;padding:.7rem .85rem;border:1px solid rgba(255,255,255,.95);border-radius:.9rem;background:rgba(255,255,255,.88);box-shadow:0 14px 30px rgba(15,58,92,.13);backdrop-filter:blur(12px);color:#102238;animation:platform-dashboard-float 5s ease-in-out infinite;}
.platform-ui-dashboard-float-card-top{top:3.5rem;left:-1.5rem;}
.platform-ui-dashboard-float-card-right{top:14rem;right:-2rem;animation-delay:-1.8s;}
.platform-ui-dashboard-float-card-bottom{bottom:1.5rem;left:7%;animation-delay:-3.1s;}
.platform-ui-dashboard-float-card small{display:block;color:#668092;font-size:.48rem;font-weight:800;letter-spacing:.13em;line-height:1.2;}
.platform-ui-dashboard-float-card strong{display:block;margin-top:.18rem;font-size:.7rem;line-height:1.2;}
.platform-ui-dashboard-card-dot{width:.52rem;height:.52rem;flex:none;border-radius:50%;background:#2eb4d1;box-shadow:0 0 0 4px rgba(46,180,209,.12);}
.platform-ui-dashboard-card-dot.is-pink{background:#d9385b;box-shadow:0 0 0 4px rgba(217,56,91,.11);}
.platform-ui-dashboard-card-dot.is-yellow{background:#f0b74d;box-shadow:0 0 0 4px rgba(240,183,77,.13);}
@keyframes platform-dashboard-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media (max-width:1023px){.platform-ui-dashboard-stage{min-height:470px;}.platform-ui-dashboard-stage .platform-ui-frame{width:calc(100% + 1rem);margin-left:-.5rem;transform:perspective(1200px) rotateY(-4deg) rotateX(1.5deg) rotateZ(.6deg);}.platform-ui-dashboard-float-card-top{left:-.7rem;}.platform-ui-dashboard-float-card-right{right:-.7rem;}}
@media (max-width:639px){.platform-ui-dashboard-stage{min-height:300px;padding-top:.5rem;}.platform-ui-dashboard-stage::before{inset:1rem -.5rem 0;border-radius:1.5rem;}.platform-ui-dashboard-orb{top:.75rem;right:6%;width:7rem;height:7rem;}.platform-ui-dashboard-stage .platform-ui-frame{width:100%;margin-left:0;border-radius:.9rem;transform:none;box-shadow:0 20px 48px rgba(15,58,92,.16),0 0 0 5px rgba(255,255,255,.48);}.platform-ui-dashboard-stage .platform-ui-frame:hover{transform:translateY(-2px);}.platform-ui-dashboard-float-card{min-width:104px;padding:.52rem .62rem;}.platform-ui-dashboard-float-card-top{top:2.7rem;left:-.3rem;}.platform-ui-dashboard-float-card-right{top:8.5rem;right:-.3rem;}.platform-ui-dashboard-float-card-bottom{bottom:.45rem;left:4%;}.platform-ui-dashboard-float-card small{font-size:.42rem;}.platform-ui-dashboard-float-card strong{font-size:.6rem;}}
@media (prefers-reduced-motion:reduce){.platform-ui-dashboard-stage .platform-ui-frame,.platform-ui-dashboard-stage .platform-ui-frame:hover{transition:none;}.platform-ui-dashboard-float-card{animation:none;}}

/* Dashboard & Reports hero: WSmart dashboard presented inside a physical monitor */
.dashboard-monitor-visual{min-height:430px;padding:1rem 0 3.5rem;perspective:1400px;isolation:isolate;}
.dashboard-monitor-orb{position:absolute;z-index:-1;top:3%;right:7%;width:16rem;height:16rem;border-radius:50%;background:radial-gradient(circle at 35% 30%,rgba(92,220,236,.92) 0,rgba(42,135,205,.82) 38%,rgba(28,64,159,.7) 68%,transparent 70%);filter:blur(1px);opacity:.68;box-shadow:0 28px 70px rgba(31,100,190,.2);}
.dashboard-monitor-bezel{position:relative;z-index:2;width:100%;padding:.7rem .7rem 1rem;border:1px solid rgba(181,209,226,.92);border-radius:1.2rem;background:linear-gradient(145deg,#f7fcff 0%,#dcebf4 58%,#b5cedc 100%);box-shadow:0 32px 70px rgba(15,59,91,.2),0 0 0 7px rgba(255,255,255,.58);transform:perspective(1400px) rotateY(-7deg) rotateX(3deg) rotateZ(1deg);transform-origin:70% 50%;transition:transform .35s cubic-bezier(.23,1,.32,1),box-shadow .35s ease;}
.dashboard-monitor-bezel:hover{transform:perspective(1400px) rotateY(-3deg) rotateX(1deg) rotateZ(.3deg) translateY(-5px);box-shadow:0 40px 82px rgba(15,59,91,.25),0 0 0 7px rgba(255,255,255,.7);}
.dashboard-monitor-topbar{display:flex;align-items:center;gap:.45rem;height:1.8rem;padding:0 .7rem;color:#6c8191;font-size:.48rem;font-weight:800;letter-spacing:.14em;}
.dashboard-monitor-camera{width:.36rem;height:.36rem;border-radius:50%;background:#243a4a;box-shadow:0 0 0 2px rgba(36,58,74,.14);}
.dashboard-monitor-status{margin-left:auto;color:#2f9fba;font-size:.42rem;letter-spacing:.1em;}
.dashboard-monitor-screen{overflow:hidden;aspect-ratio:16/10;border:1px solid rgba(15,38,56,.32);border-radius:.58rem;background:#07111e;box-shadow:inset 0 0 0 2px rgba(255,255,255,.08),inset 0 -20px 50px rgba(0,0,0,.16);}
.dashboard-monitor-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;border:0;}
.dashboard-monitor-neck{position:absolute;z-index:1;left:50%;bottom:.95rem;width:3.7rem;height:2.4rem;transform:translateX(-50%);background:linear-gradient(90deg,#9bb9c8,#eef8fc 48%,#a9c1cd);clip-path:polygon(22% 0,78% 0,100% 100%,0 100%);box-shadow:0 7px 12px rgba(15,59,91,.16);}
.dashboard-monitor-base{position:absolute;z-index:1;left:50%;bottom:.08rem;width:12rem;height:1.25rem;transform:translateX(-50%);border:1px solid rgba(167,198,212,.8);border-radius:50% 50% .7rem .7rem;background:linear-gradient(180deg,#eef8fc,#aec7d4);box-shadow:0 11px 17px rgba(15,59,91,.16);}
.dashboard-monitor-base span{position:absolute;left:50%;top:.25rem;width:2.4rem;height:.18rem;transform:translateX(-50%);border-radius:999px;background:rgba(70,112,132,.22);}
.dashboard-monitor-float-card{position:absolute;z-index:4;display:flex;align-items:center;gap:.55rem;min-width:130px;padding:.7rem .82rem;border:1px solid rgba(255,255,255,.95);border-radius:.85rem;background:rgba(255,255,255,.9);box-shadow:0 14px 28px rgba(15,59,91,.15);backdrop-filter:blur(12px);color:#11283a;animation:dashboard-monitor-float 5.5s ease-in-out infinite;}
.dashboard-monitor-float-card-top{top:2.5rem;left:-1.2rem;}
.dashboard-monitor-float-card-bottom{right:-1.6rem;bottom:5rem;animation-delay:-2.3s;}
.dashboard-monitor-float-card small{display:block;color:#6a8191;font-size:.46rem;font-weight:800;letter-spacing:.12em;line-height:1.2;}
.dashboard-monitor-float-card strong{display:block;margin-top:.18rem;font-size:.67rem;line-height:1.2;}
.dashboard-monitor-dot{width:.5rem;height:.5rem;flex:none;border-radius:50%;background:#2eb4d1;box-shadow:0 0 0 4px rgba(46,180,209,.12);}
.dashboard-monitor-dot.is-pink{background:#d9385b;box-shadow:0 0 0 4px rgba(217,56,91,.11);}
@keyframes dashboard-monitor-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media (max-width:1023px){.dashboard-monitor-visual{min-height:360px;}.dashboard-monitor-float-card-top{left:-.5rem;}.dashboard-monitor-float-card-bottom{right:-.5rem;}}
@media (max-width:639px){.dashboard-monitor-visual{min-height:285px;padding:.45rem 0 2.7rem;}.dashboard-monitor-orb{top:1rem;right:5%;width:8rem;height:8rem;}.dashboard-monitor-bezel{padding:.42rem .42rem .65rem;border-radius:.78rem;transform:perspective(900px) rotateY(-3deg) rotateX(1.5deg) rotateZ(.4deg);box-shadow:0 20px 44px rgba(15,59,91,.17),0 0 0 4px rgba(255,255,255,.6);}.dashboard-monitor-bezel:hover{transform:perspective(900px) rotateY(-2deg) rotateX(1deg) rotateZ(.2deg) translateY(-2px);}.dashboard-monitor-topbar{height:1.15rem;padding:0 .35rem;font-size:.34rem;}.dashboard-monitor-camera{width:.25rem;height:.25rem;}.dashboard-monitor-status{font-size:.3rem;}.dashboard-monitor-neck{bottom:.75rem;width:2.6rem;height:1.55rem;}.dashboard-monitor-base{bottom:.02rem;width:8rem;height:.9rem;}.dashboard-monitor-base span{top:.18rem;width:1.5rem;height:.12rem;}.dashboard-monitor-float-card{min-width:102px;padding:.5rem .58rem;}.dashboard-monitor-float-card-top{top:1.6rem;left:-.25rem;}.dashboard-monitor-float-card-bottom{right:-.25rem;bottom:3.5rem;}.dashboard-monitor-float-card small{font-size:.37rem;}.dashboard-monitor-float-card strong{font-size:.55rem;}}
@media (prefers-reduced-motion:reduce){.dashboard-monitor-bezel,.dashboard-monitor-bezel:hover{transition:none;}.dashboard-monitor-float-card{animation:none;}}

/* Shared AIoT-style subpage infographic presentation */
.subpage-infographic-art {
  filter: drop-shadow(0 22px 34px rgba(14, 165, 233, 0.16));
  transition: transform 260ms cubic-bezier(0.23, 1, 0.32, 1), filter 260ms ease;
}
.subpage-infographic-section:hover .subpage-infographic-art {
  transform: translateY(-4px) scale(1.012);
  filter: drop-shadow(0 28px 42px rgba(14, 165, 233, 0.22));
}
@media (prefers-reduced-motion: reduce) {
  .subpage-infographic-art { transition: none; }
  .subpage-infographic-section:hover .subpage-infographic-art { transform: none; }
}


/* Platform in Action: tilted mockup presentation (Teddy chose v3-tilt; no console chrome) */
.pi-mockups{display:grid;gap:1.75rem;margin-top:2.25rem;max-width:56rem;margin-left:auto;margin-right:auto;}
@media (min-width:1024px){
  .pi-mockups{gap:2.25rem;margin-top:2.75rem;max-width:64rem;}
}
.pi-mockup{margin:0;padding:0;background:transparent;border:none;box-shadow:none;}
.pi-mockup-img{
  display:block;width:100%;max-width:100%;height:auto;
  max-height:min(70vh,640px);
  object-fit:contain;object-position:center;
  background:transparent;border:none;box-shadow:none;border-radius:0;
}
.pi-mockup-mobile .pi-mockup-img{max-height:min(62vh,560px);}
.pi-mockup-note{margin-top:.35rem;margin-bottom:0;text-align:center;}
@media (max-width:639px){
  .pi-mockups{gap:1.25rem;margin-top:1.6rem;}
  .pi-mockup-img{max-height:min(55vh,420px);}
  .pi-mockup-mobile .pi-mockup-img{max-height:min(50vh,380px);}
}

/* Platform in Action: product-console redesign */
.pi-header-grid{display:grid;gap:.85rem;}
@media (min-width:900px){
  .pi-header-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:2.5rem;align-items:end;}
}
.pi-console{display:grid;gap:1.25rem;margin-top:2.25rem;}
@media (min-width:1024px){
  .pi-console{grid-template-columns:minmax(0,1fr) 245px;gap:1.75rem;align-items:start;margin-top:2.75rem;}
}
.pi-console-main{min-width:0;}
.pi-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem;}
.pi-tab{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem .85rem .45rem .5rem;border:1px solid hsl(var(--border));border-radius:999px;background:hsl(var(--card));color:hsl(var(--muted-foreground));font-size:.72rem;font-weight:600;transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .16s cubic-bezier(.23,1,.32,1);}
.pi-tab-index{display:inline-flex;align-items:center;justify-content:center;width:1.4rem;height:1.4rem;border-radius:999px;background:hsl(var(--secondary));color:hsl(var(--muted-foreground));font-family:var(--font-mono);font-size:.55rem;font-weight:700;}
.pi-tab:hover{border-color:#d9385b;color:hsl(var(--foreground));}
.pi-tab:focus-visible{outline:2px solid hsl(var(--ring));outline-offset:3px;border-color:#d9385b;color:hsl(var(--foreground));}
.pi-tab:active{transform:scale(.97);}
.pi-tab.is-active{background:hsl(var(--foreground));border-color:hsl(var(--foreground));color:hsl(var(--background));}
.pi-tab.is-active .pi-tab-index{background:rgba(255,255,255,.18);color:#fff;}
.pi-screen{position:relative;overflow:hidden;border:1px solid rgba(46,180,209,.22);border-radius:1.1rem;background:linear-gradient(180deg,#f9fcff 0%,#eef5fb 100%);box-shadow:0 26px 66px rgba(15,58,92,.14),0 0 0 6px rgba(255,255,255,.5);}
.pi-screen-bar{display:flex;align-items:center;gap:.35rem;height:2.15rem;padding:0 .85rem;border-bottom:1px solid rgba(46,180,209,.14);background:rgba(255,255,255,.92);color:hsl(var(--muted-foreground));font-family:var(--font-mono);font-size:.54rem;letter-spacing:.16em;}
.pi-screen-bar span{width:.45rem;height:.45rem;border-radius:999px;background:#3cc7dd;opacity:.9;}
.pi-screen-bar span:nth-child(2){background:#f2b84b;}
.pi-screen-bar span:nth-child(3){background:#e95f78;}
.pi-screen-bar em{margin-left:auto;font-style:normal;}
.pi-panels{display:grid;place-items:center;aspect-ratio:16/10;padding:.75rem;}
.pi-panel{grid-area:1/1;width:100%;height:100%;object-fit:contain;border-radius:.55rem;opacity:0;visibility:hidden;transform:translateY(7px);transition:opacity .28s cubic-bezier(.23,1,.32,1),transform .28s cubic-bezier(.23,1,.32,1),visibility 0s linear .28s;}
.pi-panel.is-active{opacity:1;visibility:visible;transform:none;transition:opacity .28s cubic-bezier(.23,1,.32,1),transform .28s cubic-bezier(.23,1,.32,1),visibility 0s;}
.pi-rail{display:grid;gap:.7rem;}
@media (min-width:640px) and (max-width:1023px){
  .pi-rail{grid-template-columns:repeat(3,minmax(0,1fr));}
  .pi-note{grid-column:1/-1;}
}
.pi-metric{display:flex;align-items:center;gap:.6rem;padding:.75rem .85rem;border:1px solid hsl(var(--border));border-radius:.9rem;background:hsl(var(--card));box-shadow:inset 0 1px 0 #fff,0 10px 22px rgba(15,58,92,.05);}
.pi-metric small{display:block;color:hsl(var(--muted-foreground));font-family:var(--font-mono);font-size:.5rem;font-weight:700;letter-spacing:.13em;}
.pi-metric strong{display:block;margin-top:.15rem;color:hsl(var(--foreground));font-size:.78rem;}
.pi-metric-dot{width:.5rem;height:.5rem;flex:none;border-radius:50%;background:#2eb4d1;box-shadow:0 0 0 4px rgba(46,180,209,.13);}
.pi-metric-dot.is-pink{background:#d9385b;box-shadow:0 0 0 4px rgba(217,56,91,.12);}
.pi-metric-dot.is-yellow{background:#f0b74d;box-shadow:0 0 0 4px rgba(240,183,77,.13);}
.pi-note{display:flex;align-items:flex-start;gap:.65rem;padding:.9rem;border:1px solid rgba(46,180,209,.22);border-radius:.9rem;background:linear-gradient(140deg,rgba(46,180,209,.09),rgba(217,56,91,.05));}
.pi-note p{margin:0;font-size:.72rem;line-height:1.55;color:hsl(var(--muted-foreground));}
.pi-mobile{display:grid;gap:1.35rem;margin-top:2rem;padding-top:1.85rem;border-top:1px dashed hsl(var(--border));}
@media (min-width:1024px){
  .pi-mobile{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:2.25rem;align-items:center;margin-top:2.5rem;}
}
.pi-mobile .platform-ui-mobile-stage{min-height:400px;margin-bottom:0;}
.pi-mobile-side{min-width:0;}
.pi-mobile-copy{margin-top:.9rem;font-size:.78rem;line-height:1.6;color:hsl(var(--muted-foreground));}
@media (prefers-reduced-motion:reduce){
  .pi-tab,.pi-tab:hover,.pi-tab:active{transition:none;transform:none;}
  .pi-panel,.pi-panel.is-active{transition:none;transform:none;}
}

@media (max-width:520px){
  .pi-tab{padding:.4rem .7rem .4rem .42rem;font-size:.68rem;}
  .pi-tab-index{width:1.25rem;height:1.25rem;font-size:.5rem;}
  .pi-panel.is-active{box-shadow:0 10px 22px rgba(15,58,92,.12);}
  .pi-screen-bar{height:1.85rem;font-size:.48rem;}
}
@media (min-width:640px) and (max-width:1023px){
  .pi-mobile{grid-template-columns:minmax(0,1fr);}
}

/* Platform in Action: keep the phone composition inside narrow viewports */
@media (max-width:639px){
  .pi-console{gap:1rem;margin-top:1.6rem;}
  .pi-mobile{gap:1.1rem;margin-top:1.6rem;padding-top:1.4rem;}
  .pi-mobile .platform-ui-mobile-stage{min-height:400px;padding:2.1rem .5rem 1.4rem;}
  .platform-ui-device-primary{width:clamp(132px,40vw,158px);}
  .platform-ui-device-secondary{left:6%;top:13%;width:clamp(104px,29vw,124px);transform:perspective(900px) rotateX(-4deg) rotateY(-8deg) rotateZ(14deg) translate(0,10px) scale(.94);}
  .platform-ui-device-primary{transform:perspective(900px) rotateX(-4deg) rotateY(-8deg) rotateZ(14deg) translate(10px,-2px);}
  .platform-ui-device-badge{right:.1rem;bottom:.9rem;}
  .platform-ui-stage-kicker{top:.55rem;left:.5rem;}
}

@media (max-width:639px){
  .pi-mobile-side{margin-top:.35rem;}
  .pi-mobile-side .mono-label{display:block;margin-bottom:.75rem;}
}

/* Soft ambient homepage background: a restrained version of the supplied reference gradient. */
.home-page-shell{position:relative;isolation:isolate;overflow:hidden;background:#fff}
.home-page-shell:before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:
  radial-gradient(52rem 42rem at 18% 18%,rgba(255,205,152,.23),transparent 68%),
  radial-gradient(48rem 46rem at 35% 42%,rgba(248,166,177,.18),transparent 70%),
  radial-gradient(54rem 50rem at 78% 74%,rgba(122,220,238,.24),transparent 70%),
  linear-gradient(135deg,#fff 0%,#fffdfa 34%,#fffafe 64%,#f8feff 100%);
  background-size:145% 145%;background-position:0% 0%;animation:home-soft-gradient-drift 34s ease-in-out infinite alternate}
.home-page-shell>section{background-color:rgba(255,255,255,.42)!important}
.home-page-shell>section.platform-ui-showcase-section{background-color:#F5F5F5!important;/* bottom fade via wsmart-theme.css */}
.home-page-shell .glass-card{background-color:rgba(255,255,255,.62)}
@keyframes home-soft-gradient-drift{0%{background-position:0% 0%;filter:saturate(.94)}50%{background-position:45% 28%;filter:saturate(1)}100%{background-position:100% 72%;filter:saturate(.96)}}
@media (prefers-reduced-motion:reduce){.home-page-shell:before{animation:none;background-position:50% 35%}}

/*

/*

/*

/*

/*

/*

/* home-section-tints-preview-v3: restrained homepage colour rhythm */
.home-page-shell>section{background:rgba(255,255,255,.72)!important}
.home-page-shell>section:nth-of-type(3){background:rgba(232,249,252,.72)!important}
.home-page-shell>section:nth-of-type(4){background:rgba(255,255,255,.72)!important;color:inherit}
.home-page-shell>section:nth-of-type(6){background:#10243d!important;color:#fff}
.home-page-shell>section:nth-of-type(6) h2{color:#fff!important}
.home-page-shell>section:nth-of-type(6) .section-eyebrow,
.home-page-shell>section:nth-of-type(6) .text-muted-foreground,
.home-page-shell>section:nth-of-type(6) .text-foreground\/70{color:rgba(255,255,255,.72)!important}
.home-page-shell>section:nth-of-type(6) .border-border{border-color:rgba(255,255,255,.18)!important}
.home-page-shell>section:nth-of-type(6) .glass-card{background:rgba(255,255,255,.96)!important;color:#0f1729}
.home-page-shell>section:nth-of-type(9) .modular-integration-icon{width:120px!important;height:120px!important}
.home-page-shell .home-assessment-card{border-left:3px solid #d9385b}
.home-page-shell .home-assessment-eyebrow{color:#f27a93!important;display:inline-flex;align-items:center;gap:.5rem}
.home-page-shell .home-assessment-eyebrow::before{content:"";width:.42rem;height:.42rem;border-radius:999px;background:#d9385b;box-shadow:0 0 0 .22rem rgba(217,56,91,.18)}
.home-page-shell .home-assessment-card{background-image:linear-gradient(90deg,rgba(5,16,31,.94) 0%,rgba(5,16,31,.82) 48%,rgba(5,16,31,.48) 100%),url("images/home-assessment-dark-bg_28a270d0.png");background-size:cover;background-position:center}
@media (prefers-reduced-motion:reduce){.home-page-shell>section{transition:none}}
\n/* partner-showcase-v1 */
.home-partners-section{background:rgba(255,255,255,.78)}
.partner-logo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.partner-logo-card{position:relative;display:flex;align-items:center;gap:.75rem;min-height:88px;padding:1rem 1.1rem;border:1px solid rgba(15,23,41,.10);border-radius:.8rem;background:rgba(255,255,255,.82);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.partner-logo-card:hover{transform:translateY(-2px);border-color:rgba(217,56,91,.42);box-shadow:0 12px 28px rgba(15,23,41,.08)}
.partner-logo-frame{display:flex;align-items:center;justify-content:center;width:7rem;height:3.25rem;flex:none;overflow:hidden;border-radius:.45rem;background:#fff}
.partner-logo-frame img{max-width:6.4rem;max-height:2.7rem;width:auto;height:auto;object-fit:contain}
.partner-logo-name{font-family:var(--font-heading,inherit);font-size:.82rem;font-weight:700;color:rgb(15 23 41);line-height:1.2}
.partner-logo-arrow{margin-left:auto;color:#d9385b;font-size:1.1rem;opacity:.7}
.partner-detail-card{display:flex;flex-direction:column}
.partner-detail-logo{display:flex;align-items:center;justify-content:center;height:5rem;margin-bottom:1rem;padding:.55rem;border:1px solid rgba(15,23,41,.08);border-radius:.6rem;background:#fff}
.partner-detail-logo img{max-width:100%;max-height:4rem;width:auto;height:auto;object-fit:contain}
.partner-detail-logo--with-badge{justify-content:center;gap:.65rem;padding:.45rem .7rem}
.partner-detail-logo--with-badge img{max-height:3.55rem;max-width:46%;flex:0 1 auto}
.partner-detail-logo--with-badge .partner-detail-badge{max-width:54%;max-height:3.85rem}
@media (min-width:640px){.partner-logo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1024px){.partner-logo-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:1rem}.partner-logo-card{display:block;padding:1rem}.partner-logo-frame{width:100%;height:3.7rem;margin-bottom:.65rem}.partner-logo-frame img{max-width:100%;max-height:3rem}.partner-logo-arrow{position:absolute;right:.8rem;top:.7rem}}
@media (prefers-reduced-motion:reduce){.partner-logo-card{transition:none}}

/* logo-gradient-cta-v1 */
/* WSmart logo colours: pink, violet and cyan. Keep the motion subtle and purposeful. */
.logo-gradient-cta{
  position:relative;isolation:isolate;overflow:hidden;
  background:linear-gradient(118deg,#d9385b 0%,#7a3f87 48%,#20b7d1 100%) !important;
  background-size:210% 210%;
  color:#fff !important;
  border-color:rgba(255,255,255,.34) !important;
  box-shadow:0 8px 22px rgba(103,54,126,.18),0 2px 5px rgba(15,23,41,.08);
  transition:transform .18s cubic-bezier(.23,1,.32,1),box-shadow .22s cubic-bezier(.23,1,.32,1),background-position .35s cubic-bezier(.23,1,.32,1);
  animation:logo-cta-breathe 8s ease-in-out infinite;
}
.logo-gradient-cta::after{
  content:"";position:absolute;z-index:-1;inset:-70% -25%;
  background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.24) 49%,transparent 60%);
  transform:translateX(-70%) rotate(8deg);opacity:.65;
  transition:transform .45s cubic-bezier(.23,1,.32,1),opacity .25s ease;
}
.logo-gradient-cta:hover{
  background-position:100% 30%;
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(103,54,126,.28),0 4px 8px rgba(15,23,41,.12);
}
.logo-gradient-cta:hover::after{transform:translateX(70%) rotate(8deg);opacity:.95}
.logo-gradient-cta:focus-visible{outline:3px solid rgba(32,183,209,.42);outline-offset:3px}
.logo-gradient-cta:active{transform:translateY(0) scale(.97);box-shadow:0 5px 12px rgba(103,54,126,.2)}
.logo-gradient-cta--compact{box-shadow:0 5px 15px rgba(103,54,126,.18)}
@keyframes logo-cta-breathe{0%,100%{background-position:0% 50%}50%{background-position:75% 42%}}
@media (prefers-reduced-motion:reduce){
  .logo-gradient-cta{animation:none;transition:none}
  .logo-gradient-cta:hover{transform:none}
  .logo-gradient-cta::after{display:none}
}

/* === WSmart theme overrides (must come last; includes py-14 and other utilities missing from the Manus build) === */
:root {
  --ws-navy: #0B1F3A;
  --ws-cyan: #0EA5C6;
  --ws-cyan-soft: #7DD3E8;
  --ws-teal: #0F766E;
  --ws-green: #5BA84A;
  --ws-green-soft: #8BC77E;
  --ws-green-muted: rgba(91, 168, 74, 0.22);
  --ws-amber: #D97706;
  --ws-slate: #334155;
  --ws-muted: #64748B;
  --ws-surface: #F1F5F9;
  --ws-sand: #F8F4EF;
  --ws-white: #FFFFFF;
  --ws-alert: #DC2626;
  --ws-radius: 12px;
  --ws-shadow: 0 8px 30px rgba(11, 31, 58, 0.08);
}

/* Language switcher UI (chrome only — no page translation yet).
   .ws-lang-desktop / .ws-lang-mobile-wrap are shown on the EN site.
   Legacy alternate markup remains hidden. Explicit hide helpers still work. */
.ws-lang-hide,
[data-ws-lang-switch],
.ws-hide-lang {
  display: none !important;
}
.ws-en-only .ws-lang-block,
.ws-en-only [data-language-switch],
.ws-en-only .ws-lang-mobile {
  display: none !important;
}
/* Ensure desktop globe + mobile Language chips are visible under .ws-en-only */
.ws-en-only .ws-lang-desktop,
.ws-en-only .ws-lang-mobile-wrap {
  display: block !important;
  visibility: visible !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
}

/* Section band utilities */
.ws-band-white,
.home-page-shell > section.ws-band-white,
section.ws-band-white {
  background: #fff !important;
  background-color: #fff !important;
  color: var(--ws-slate);
}
.ws-band-surface { background: var(--ws-surface); color: var(--ws-slate); }
.ws-band-sand { background: var(--ws-sand); color: var(--ws-slate); }
.ws-band-navy {
  background: #0B1F3A !important;
  background-color: #0B1F3A !important;
  color: rgba(241, 245, 249, 0.92);
}
/* Beat Manus .home-page-shell>section nth-of-type tints (pale cyan etc.) */
.home-page-shell > section.ws-band-navy,
section.ws-band-navy {
  background: #0B1F3A !important;
  background-color: #0B1F3A !important;
  color: rgba(241, 245, 249, 0.92);
}
.ws-band-navy h2,
.ws-band-navy h3,
.ws-band-navy .font-heading,
.home-page-shell > section.ws-band-navy h2,
.home-page-shell > section.ws-band-navy h3,
.home-page-shell > section.ws-band-navy .font-heading { color: #fff !important; }
.ws-band-navy .text-muted-foreground,
.ws-band-navy .section-eyebrow,
.ws-band-navy .mono-label,
.home-page-shell > section.ws-band-navy .text-muted-foreground,
.home-page-shell > section.ws-band-navy .section-eyebrow,
.home-page-shell > section.ws-band-navy .mono-label { color: var(--ws-cyan-soft) !important; }
.ws-band-navy .text-foreground,
.home-page-shell > section.ws-band-navy .text-foreground { color: #fff !important; }
/* Light cards inside navy band keep dark text */
.ws-band-navy .glass-card,
.ws-band-navy .bg-card,
.home-page-shell > section.ws-band-navy .glass-card,
.home-page-shell > section.ws-band-navy .bg-card {
  background: rgba(255, 255, 255, 0.96) !important;
  color: #0f1729;
}
.ws-band-navy .glass-card .text-foreground,
.ws-band-navy .bg-card .text-foreground,
.ws-band-navy .glass-card h3,
.ws-band-navy .bg-card h3 {
  color: #0f1729 !important;
}
.ws-band-navy .glass-card .text-muted-foreground,
.ws-band-navy .bg-card .text-muted-foreground {
  color: #64748B !important;
}
.ws-band-green-muted,
.home-page-shell > section.ws-band-green-muted,
section.ws-band-green-muted {
  background: var(--ws-green-muted) !important;
  background-color: var(--ws-green-muted) !important;
  color: var(--ws-slate);
}
.ws-band-teal-tint { background: rgba(15, 118, 110, 0.08); color: var(--ws-slate); }

/* Full-bleed band wrappers (homepage) */
.ws-section-band {
  width: 100%;
}
.ws-section-band > .mx-auto,
.ws-section-inner {
  /* keep existing max-w containers */
}

/* Kill faint hero tech grids when marked */
.ws-no-grid .tech-grid,
.home-page.ws-en-only > .tech-grid,
section.ws-no-grid > .tech-grid {
  display: none !important;
  opacity: 0 !important;
}

/* Green CTAs */
.ws-btn-green,
a.ws-btn-green,
button.ws-btn-green {
  background: var(--ws-green) !important;
  color: #fff !important;
  border-color: transparent !important;
}
.ws-btn-green:hover,
a.ws-btn-green:hover {
  background: #4a8f3c !important;
  color: #fff !important;
}
.logo-gradient-cta.ws-btn-green,
header a.logo-gradient-cta,
header .logo-gradient-cta,
nav a.logo-gradient-cta,
.logo-gradient-cta.logo-gradient-cta--compact {
  background: #5BA84A !important;
  background-image: none !important;
  color: #fff !important;
  animation: none !important;
  box-shadow: 0 4px 14px rgba(91, 168, 74, 0.28);
}
.logo-gradient-cta.ws-btn-green:hover,
header a.logo-gradient-cta:hover,
header .logo-gradient-cta:hover,
nav a.logo-gradient-cta:hover,
.logo-gradient-cta.logo-gradient-cta--compact:hover {
  background: #4a8f3c !important;
  background-image: none !important;
  color: #fff !important;
}
.logo-gradient-cta.ws-btn-green::after,
header a.logo-gradient-cta::after,
.logo-gradient-cta.logo-gradient-cta--compact::after {
  display: none !important;
}

/* Unframed figures — no card chrome when art bg matches section bg.
   .ws-infographic-square overrides these when white art sits on a color band. */
.ws-figure-unframed,
.ws-figure-unframed img {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  filter: none !important;
  padding: 0;
}
.ws-figure-unframed img {
  border-radius: 0 !important;
}

/* Hero cutaway + platform slides: unframed on white hero */
.hero-signal-visual {
  position: relative;
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
}
.hero-platform-visual {
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
}
.hero-signal-visual .hero-signal-image,
.hero-platform-visual .hero-platform-image {
  width: 100%;
  height: auto;
  max-height: none; /* signal slide keeps aspect-ratio box; platform capped below */
  display: block;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  filter: none !important; /* kill bundle drop-shadow card look */
  object-fit: contain !important;
  object-position: center;
}

/* Platform/Info slides: tall assets must not dwarf other hero slides.
   Cap scale for slides 3/4; slide 2 (secondary) overrides below to fill column.
   object-contain keeps full art; overflow visible (Style QA — no monitor clip). */
.hero-platform-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-height: none;
  overflow: visible;
  padding-block: 0.5rem;
}
.hero-platform-visual .hero-platform-image {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 360px; /* slides 3/4 shared cap */
  margin-inline: auto;
  object-fit: contain !important;
  object-position: center;
}
@media (min-width: 1024px) {
  .hero-platform-visual .hero-platform-image {
    max-height: 365px;
  }
}
@media (max-width: 639px) {
  .hero-platform-visual .hero-platform-image {
    max-height: 280px;
  }
}

/* Slide 2 (secondary / operating-layer): fill right visual column (red-box area).
   2026-10-19 fill-box: JPG retightened (~3% margins); raise max-height; modest nav clearance. */
.hero-slide--secondary .hero-platform-visual {
  align-items: center;
  justify-content: center;
  padding-top: 0.5rem !important;
  padding-bottom: 0.25rem !important;
  margin-top: 0.25rem;
  overflow: visible !important;
  height: 100%;
  min-height: 0;
}
.hero-slide--secondary .hero-platform-visual .hero-platform-image {
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: 480px; /* fill-box: was shared ~360; art now tight so height maps to real content */
  margin-inline: auto;
  object-fit: contain !important;
  object-position: center;
}
@media (min-width: 1024px) {
  .hero-slide--secondary .hero-platform-visual {
    padding-top: 0.75rem !important; /* modest clearance under sticky nav */
    margin-top: 0.5rem;
  }
  .hero-slide--secondary .hero-platform-visual .hero-platform-image {
    max-height: 520px;
  }
}
@media (max-width: 639px) {
  .hero-slide--secondary .hero-platform-visual {
    padding-top: 0.5rem !important;
    margin-top: 0.25rem;
  }
  .hero-slide--secondary .hero-platform-visual .hero-platform-image {
    max-height: 340px;
  }
}

/* Explicit home-hero unframe (white on white) */
.home-hero-section .hero-platform-visual,
.home-hero-section .hero-signal-visual,
.home-hero-section .hero-platform-visual.ws-figure-unframed,
.home-hero-section .hero-signal-visual.ws-figure-unframed {
  box-shadow: none !important;
  border: none !important;
  background: transparent !important;
  border-radius: 0 !important;
  overflow: visible !important;
}
.home-hero-section.overflow-hidden {
  overflow: visible !important; /* Style QA: Info must not clip */
}
.home-hero-section .hero-platform-image,
.home-hero-section .hero-signal-image {
  box-shadow: none !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  filter: none !important;
  object-fit: contain !important;
}
.home-hero-section .hero-platform-visual .hero-platform-image {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 360px;
  margin-inline: auto;
}
@media (min-width: 1024px) {
  .home-hero-section .hero-platform-visual .hero-platform-image {
    max-height: 365px;
  }
}
@media (max-width: 639px) {
  .home-hero-section .hero-platform-visual .hero-platform-image {
    max-height: 280px;
  }
}
.home-hero-section .hero-slide--secondary .hero-platform-visual {
  align-items: center;
  justify-content: center;
  padding-top: 0.5rem !important;
  padding-bottom: 0.25rem !important;
  margin-top: 0.25rem;
  overflow: visible !important;
  height: 100%;
}
.home-hero-section .hero-slide--secondary .hero-platform-visual .hero-platform-image {
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: 480px;
  margin-inline: auto;
  object-fit: contain !important;
  object-position: center;
}
@media (min-width: 1024px) {
  .home-hero-section .hero-slide--secondary .hero-platform-visual {
    padding-top: 0.75rem !important;
    margin-top: 0.5rem;
  }
  .home-hero-section .hero-slide--secondary .hero-platform-visual .hero-platform-image {
    max-height: 520px;
  }
}
@media (max-width: 639px) {
  .home-hero-section .hero-slide--secondary .hero-platform-visual {
    padding-top: 0.5rem !important;
    margin-top: 0.25rem;
  }
  .home-hero-section .hero-slide--secondary .hero-platform-visual .hero-platform-image {
    max-height: 340px;
  }
}
.hero-sensor-layer {
  /* keep JS-driven cards; dashed leaders via theme */
}
.hero-sensor-card {
  border-style: dashed;
  border-color: rgba(11, 31, 58, 0.35);
}
/* Leak card: building bottom-left (tighter vs basement / left facade) */
.hero-sensor-card--leak {
  right: auto;
  left: 10%;
  bottom: 13%;
}
@media (max-width: 639px) {
  .hero-sensor-card--leak {
    right: auto;
    left: 8%;
    bottom: 8%;
  }
}

/* Process numbered steps — dashed only on process/flow */
.ws-process-steps .ws-step-num {
  border: 1.5px dashed var(--ws-cyan);
  background: transparent;
  color: var(--ws-navy);
}

/* Partners strip */
.ws-trust-strip {
  background: var(--ws-surface);
  border-block: 1px solid rgba(15, 23, 42, 0.06);
}
.ws-trust-strip .partner-logo-grid,
.home-partners-section .partner-logo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 1rem;
}

/* Accent green eyebrow option */
.section-eyebrow.ws-green {
  color: var(--ws-green);
}

/* Platform illustrative metrics note */
.ws-illustrative-note {
  font-size: 0.75rem;
  color: var(--ws-muted);
  margin-top: 0.75rem;
}

/* Square frame for infographics whose white art bg clashes with section band.
   aspect-ratio 1:1 + object-fit:contain shows the FULL image (letterboxed). */
.ws-infographic-square {
  aspect-ratio: 1 / 1;
  width: 100%;
  max-width: 36rem;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff !important;
  border-radius: 16px !important;
  overflow: hidden;
  box-shadow: var(--ws-shadow) !important;
  border: none;
}
.ws-infographic-square img,
.ws-infographic-square > img {
  width: 100% !important;
  height: 100% !important;
  max-width: none;
  object-fit: contain !important;
  object-position: center;
  display: block;
  border-radius: 16px;
  filter: none;
  box-shadow: none !important;
  background: transparent !important;
}
.ws-band-navy .ws-infographic-square,
.ws-band-green-muted .ws-infographic-square {
  background: #fff !important;
}
.modular-integration-icon {
  aspect-ratio: 1 / 1;
  width: 9rem;
  height: auto !important;
  max-width: 100%;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}
.modular-integration-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center;
  background: transparent;
}

/* Soften assessment card grid */
.home-assessment-card .tech-grid {
  display: none;
}


/* Batch4: hide faint Manus hero grids (opacity-30) site-wide */
section.relative > .tech-grid.opacity-30,
.cloud-monitoring-hero > .tech-grid.opacity-30,
.industry-hero > .tech-grid.opacity-30 {
  display: none !important;
}


/* Force all Manus gradient CTAs to solid brand green (kills magenta/cyan leftovers) */
a.logo-gradient-cta,
button.logo-gradient-cta,
.logo-gradient-cta {
  background: var(--ws-green) !important;
  background-image: none !important;
  color: #fff !important;
  border-color: transparent !important;
}
a.logo-gradient-cta:hover,
.logo-gradient-cta:hover {
  background: #4a8f3c !important;
  background-image: none !important;
  color: #fff !important;
}
/* Assessment CTA card: plant-room photo + red accent (works outside .home-page-shell) */
.home-assessment-card {
  border-left: 3px solid #d9385b;
  background-color: #050f1f;
  background-image:
    linear-gradient(90deg, rgba(5, 16, 31, 0.94) 0%, rgba(5, 16, 31, 0.82) 48%, rgba(5, 16, 31, 0.48) 100%),
    url("images/home-assessment-dark-bg_28a270d0.png");
  background-size: cover;
  background-position: center;
}
.home-assessment-eyebrow,
.home-assessment-card .section-eyebrow,
.home-assessment-card .mono-label {
  color: rgba(255, 255, 255, 0.92) !important;
  background: transparent !important;
}
.home-assessment-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.home-assessment-eyebrow::before {
  content: "";
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 999px;
  background: #d9385b;
  box-shadow: 0 0 0 0.22rem rgba(217, 56, 91, 0.18);
  flex-shrink: 0;
}
/* Case studies / odd Manus nth-of-type wash: keep navy bands solid */
.home-page-shell > section.ws-band-navy,
section.ws-band-navy {
  background: #0B1F3A !important;
}

/*
  CRITICAL contrast fix (2026-10-19):
  Manus style-DFhzDlb2.css paints .home-page-shell>section:nth-of-type(6)
  as navy with white h2 / muted / eyebrow text. When that slot is a light
  band (ws-band-white), theme forces white background but Manus white-text
  !important rules remain → invisible copy (delivery / "See how we work").
  Scope: light bands only; do NOT force navy onto .font-heading inside
  dark image overlays (industry cards) or .home-assessment-card.
*/
.home-page-shell > section.ws-band-white,
.home-page-shell > section.ws-band-surface,
.home-page-shell > section.ws-band-sand,
.home-page-shell > section.ws-band-green-muted,
.home-page-shell > section.ws-band-teal-tint {
  color: var(--ws-slate) !important;
}
.home-page-shell > section.ws-band-white:nth-of-type(6) h2,
.home-page-shell > section.ws-band-white:nth-of-type(6) .text-foreground,
.home-page-shell > section.ws-band-surface:nth-of-type(6) h2,
.home-page-shell > section.ws-band-surface:nth-of-type(6) .text-foreground,
.home-page-shell > section.home-delivery-section h2,
.home-page-shell > section.home-delivery-section .text-foreground {
  color: #0B1F3A !important;
}
.home-page-shell > section.ws-band-white:nth-of-type(6) .text-muted-foreground,
.home-page-shell > section.ws-band-white:nth-of-type(6) .text-foreground\/70,
.home-page-shell > section.ws-band-surface:nth-of-type(6) .text-muted-foreground,
.home-page-shell > section.home-delivery-section .text-muted-foreground,
.home-page-shell > section.home-delivery-section .text-foreground\/70 {
  color: #64748B !important;
}
.home-page-shell > section.ws-band-white:nth-of-type(6) .section-eyebrow,
.home-page-shell > section.ws-band-surface:nth-of-type(6) .section-eyebrow,
.home-page-shell > section.home-delivery-section .section-eyebrow {
  color: hsl(var(--accent)) !important;
}
.home-page-shell > section.ws-band-white:nth-of-type(6) .border-border,
.home-page-shell > section.home-delivery-section .border-border {
  border-color: hsl(var(--border)) !important;
}

/* Ultra-force Manus gradient CTAs (hero slides + platform leftovers) */
.home-page a.logo-gradient-cta,
.home-page-shell a.logo-gradient-cta,
.ws-en-only a.logo-gradient-cta,
a.logo-gradient-cta.ws-btn-green,
a.logo-gradient-cta.logo-gradient-cta--compact,
header a.logo-gradient-cta,
section a.logo-gradient-cta {
  background: #5BA84A !important;
  background-color: #5BA84A !important;
  background-image: none !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: none !important;
  -webkit-text-fill-color: #ffffff !important;
}
.home-page a.logo-gradient-cta:hover,
.ws-en-only a.logo-gradient-cta:hover,
a.logo-gradient-cta.ws-btn-green:hover {
  background: #4a8f3c !important;
  background-image: none !important;
  color: #ffffff !important;
}


/* Never crop infographics — always show full artwork */
.ws-infographic-full,
figure.ws-infographic-full,
.ws-figure-unframed.ws-infographic-full {
  overflow: visible !important;
}
.ws-infographic-full img,
figure.ws-figure-unframed img[src*="images/"],
img[src*="images/"][class*="object-contain"] {
  max-width: 100%;
  height: auto;
  object-fit: contain !important;
  object-position: center;
  display: block;
}
/* Avoid negative-margin pull under overflow-hidden sections clipping art */
section.overflow-hidden + section .ws-infographic-full,
section.overflow-hidden + section figure.ws-figure-unframed {
  position: relative;
  z-index: 1;
}


/* Homepage hero: pure white, no ocean/cyan wash; room below CTAs before divider */
.home-hero-section,
.home-page-shell > section.home-hero-section {
  background: #fff !important;
  background-color: #fff !important;
}
.home-hero-section > .absolute.rounded-full.bg-accent\/5,
.home-hero-section > [class*="bg-accent/5"] {
  display: none !important;
}
.home-hero-section > .relative.mx-auto {
  padding-bottom: 4rem; /* pb-16 mobile */
}
@media (min-width: 640px) {
  .home-hero-section > .relative.mx-auto {
    padding-bottom: 5rem; /* sm:pb-20 */
  }
}
@media (min-width: 1024px) {
  .home-hero-section > .relative.mx-auto {
    padding-bottom: 6rem; /* lg:pb-24 */
  }
}

/* Partners strip: title + logos only (no name labels / arrows) */
.home-partners-section .partner-logo-name,
.home-partners-section .partner-logo-arrow,
.ws-trust-strip .partner-logo-name,
.ws-trust-strip .partner-logo-arrow {
  display: none !important;
}
.partner-logo-grid--logos-only .partner-logo-card {
  justify-content: center;
}
@media (min-width: 1024px) {
  .partner-logo-grid--logos-only .partner-logo-frame {
    margin-bottom: 0;
  }
}


/* === QA Style batch 2026-10-18: tech-grid kill + unframe force === */
/* Kill ALL faint tech grids sitewide (opacity 0.04/0.05/30/40/etc.) */
.tech-grid,
div.tech-grid,
.absolute.tech-grid,
[class*="tech-grid"] {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  background-image: none !important;
  pointer-events: none !important;
}

/* Unframed Info: leftover Tailwind frame classes must not win on white bands */
.ws-figure-unframed,
figure.ws-figure-unframed,
.ws-figure-unframed.glass-card,
.ws-figure-unframed.rounded-2xl,
.ws-figure-unframed.rounded-xl,
figure.ws-figure-unframed.glass-card {
  border: none !important;
  border-width: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-color: transparent !important;
  padding: 0 !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.ws-figure-unframed img,
figure.ws-figure-unframed img {
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  filter: none !important;
}

/* Square+contain ONLY when white art sits on a color band (do not break) */
.ws-infographic-square:not(.ws-band-white *),
.ws-band-navy .ws-infographic-square,
.ws-band-green .ws-infographic-square,
section.ws-band-navy figure.ws-infographic-square,
section[class*="ws-band-"][class*="navy"] .ws-infographic-square {
  /* keep existing square-on-color-band behavior from earlier rules */
}


/* Applications catalogue card photos — uniform 3:2 (built CSS lacks aspect-[3/2]) */
#application-catalogue a.glass-card > div.overflow-hidden > img,
#application-catalogue a.glass-card .mb-5 > img {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  object-position: center;
  height: auto;
  display: block;
}

/* Optional polish: built CSS has group-hover:scale-105 but not scale-[1.02] */
#application-catalogue a.glass-card.group:hover > div.overflow-hidden > img,
#application-catalogue a.glass-card.group:hover .mb-5 > img {
  transform: scale(1.02);
  transition: transform 0.2s ease;
}

/* Partners detail cards — uniform logo boxes (48–56px), like applications photo unify */
.partner-detail-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 3.5rem; /* 56px */
  width: 100%;
  margin-bottom: 1rem;
  padding: 3rem 0.75rem;

  background: #fff;
  box-sizing: border-box;
}
.partner-detail-logo img {
  max-height: 2.75rem; /* ~44px inside the 56px box */
  max-width: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  object-position: center;
  display: block;
}


/* Case studies catalogue card photos — uniform 3:2 (built CSS lacks aspect-[3/2]) */
#case-studies-catalogue article.glass-card > div.overflow-hidden > img,
#case-studies-catalogue article.glass-card .mb-6 > img {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  object-position: center;
  height: auto;
  display: block;
}

/* proof-hub-preview-thumbs-20261019 */
#proof-case-preview a.glass-card > div.overflow-hidden > img {
  aspect-ratio: 3 / 2;
  object-fit: cover;
  object-position: center;
  width: 100%;
  display: block;
}

/* proof-refs-anchor-offset-20261019 — fixed header (~4rem) */
#case-studies-catalogue,
#deployments,
#project-references,
#partner-products,
#proof-case-preview {
  scroll-margin-top: 5rem;
}


/* seo-aeo-faq-20261019 — details FAQ using existing tokens */
.ws-faq-item > summary {
  list-style: none;
}
.ws-faq-item > summary::-webkit-details-marker {
  display: none;
}
.ws-faq-item > summary::after {
  content: "+";
  float: right;
  color: var(--ws-muted, #64748B);
  font-weight: 600;
}
.ws-faq-item[open] > summary::after {
  content: "–";
}
.ws-faq-item[open] {
  border-color: rgba(15, 118, 110, 0.35);
}
.ws-faq-answer a {
  color: var(--ws-teal, #0F766E);
  text-decoration: underline;
}


/* apps-cta-fix-20261019 — Explore applications CTA hugs content + clearer vertical gaps */
#applications a.apps-explore-cta {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  flex: 0 0 auto;
  align-self: flex-start;
  box-sizing: border-box;
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}
@media (min-width: 1024px) {
  #applications a.apps-explore-cta {
    align-self: flex-end; /* keep bottom-aligned with intro on lg:flex-row */
    margin-top: 0;
    margin-bottom: 0;
  }
}
#applications .apps-section-intro {
  row-gap: 2rem; /* clearer space above CTA when stacked */
}
#applications .apps-section-cards {
  margin-top: 3.25rem; /* clearer space below CTA before card grid */
}


/* partners-clean-20261019 — no section rules, no logo cards, seamless into footer */
/* partners-pad-20261019 — extra bottom space under logos (py-14/sm:py-16 missing from built CSS) */
.home-partners-section,
.home-page-shell > section.home-partners-section {
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  border-block-width: 0 !important;
  background: #fff !important;
  background-color: #fff !important;
  box-shadow: none !important;
  padding-bottom: 4rem; /* 64px — breathe before dark footer */
}

/* Kill footer mt-24 pale-grey gap after homepage partners (body --background shows through) */
.home-page.ws-en-only > footer,
main.home-page-shell + footer {
  margin-top: 0 !important;
}

/* Logos sit clean on white — no rounded white rectangles / grey frames */
.home-partners-section .partner-logo-card,
.home-partners-section a.partner-logo-card,
.home-partners-section .partner-logo-grid--logos-only .partner-logo-card {
  border: none !important;
  border-width: 0 !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  padding: 0.5rem !important;
  min-height: 0 !important;
  gap: 0 !important;
}
.home-partners-section .partner-logo-card:hover,
.home-partners-section a.partner-logo-card:hover {
  border: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  background: transparent !important;
}
.home-partners-section .partner-logo-frame {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}
@media (min-width: 1024px) {
  .home-partners-section .partner-logo-card {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.75rem !important;
  }
  .home-partners-section .partner-logo-frame {
    width: 100% !important;
    height: 3.7rem !important;
    margin-bottom: 0 !important;
  }
}

/* SOLUTIONS DASHBOARDS HERO — match locked tilt mock #F5F5F5 band (Teddy 2026-10-19)
   Right-side visual uses assets/images/solutions-dashboards-hero-mock.jpg
   (= platform-page-dashboard-mock.jpg / PLATFORM IN ACTION tilt treatment).
   Soft fade at bottom: #F5F5F5 → #fff over ~140px, eased (more time near white; Teddy softer/longer 2026-10-19). */
section.solutions-dashboards-hero,
section.cloud-monitoring-hero.solutions-dashboards-hero {
  background-color: #F5F5F5 !important;
  background-image: linear-gradient(
    to bottom,
    #F5F5F5 0%,
    #F5F5F5 calc(100% - 140px),
    #F8F8F8 calc(100% - 100px),
    #FBFBFB calc(100% - 64px),
    #FDFDFD calc(100% - 32px),
    #ffffff 100%
  ) !important;
  background-repeat: no-repeat !important;
  color: var(--ws-slate);
  border-bottom-width: 0 !important;
  border-bottom-color: transparent !important;
}
section.solutions-dashboards-hero h1,
section.solutions-dashboards-hero .font-heading,
section.solutions-dashboards-hero .text-foreground,
section.cloud-monitoring-hero.solutions-dashboards-hero h1,
section.cloud-monitoring-hero.solutions-dashboards-hero .font-heading,
section.cloud-monitoring-hero.solutions-dashboards-hero .text-foreground {
  color: #0B1F3A !important;
}
section.solutions-dashboards-hero .text-muted-foreground,
section.cloud-monitoring-hero.solutions-dashboards-hero .text-muted-foreground {
  color: #64748B !important;
}
section.solutions-dashboards-hero .ws-figure-unframed,
section.solutions-dashboards-hero .ws-figure-unframed img {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* PLATFORM IN ACTION — full-bleed grey band matching tablet mock panel (Teddy 2026-10-19)
   Sampled from assets/images/platform-action-tablet-mock.jpg → #F5F5F5.
   Removes white surround around the mock grey so the section is one continuous band.
   Soft fade at bottom: #F5F5F5 → #fff over ~140px, eased (more time near white; Teddy softer/longer 2026-10-19). */
.home-page-shell > section.platform-ui-showcase-section,
.home-page-shell > section.platform-ui-showcase-section.pi-section,
section.platform-ui-showcase-section,
section.platform-ui-showcase-section.pi-section {
  background-color: #F5F5F5 !important;
  background-repeat: no-repeat !important;
  color: var(--ws-slate);
  border-bottom-width: 0 !important;
  border-bottom-color: transparent !important;
}
/* Navy / muted copy stays readable on grey (beat any Manus nth-of-type tints) */
.home-page-shell > section.platform-ui-showcase-section h2,
.home-page-shell > section.platform-ui-showcase-section .font-heading,
.home-page-shell > section.platform-ui-showcase-section .text-foreground,
section.platform-ui-showcase-section h2,
section.platform-ui-showcase-section .font-heading,
section.platform-ui-showcase-section .text-foreground {
  color: #0B1F3A !important;
}
.home-page-shell > section.platform-ui-showcase-section .text-muted-foreground,
section.platform-ui-showcase-section .text-muted-foreground {
  color: #64748B !important;
}
.home-page-shell > section.platform-ui-showcase-section .section-eyebrow,
section.platform-ui-showcase-section .section-eyebrow {
  color: hsl(var(--accent)) !important;
}
/* No nested grey card chrome around mockups — continuous band only */
.platform-ui-showcase-section .pi-mockups,
.platform-ui-showcase-section .pi-mockup,
.platform-ui-showcase-section .pi-mockup-img {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* PLATFORM PAGE — DASHBOARD + MOBILE APP (homepage UI mocks, Teddy 2026-10-19) */
section.platform-product-views {
  background: #F5F5F5 !important;
  background-color: #F5F5F5 !important;
}
section.platform-product-views .glass-card {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.08) !important;
}
section.platform-product-views .platform-product-mock-frame {
  background: #F5F5F5 !important;
  border: 1px solid rgba(15, 23, 42, 0.06);
}

/* Paired mobile phones in one card — full unclipped frames from homepage mock (2026-10-19) */
section.platform-product-views .platform-product-phones-pair {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: visible;
  padding: 0.75rem 0.5rem;
}
section.platform-product-views .platform-product-phones-pair-img {
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  object-position: center;
}
section.platform-product-views .platform-product-phones-captions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
}
section.platform-product-views .platform-product-phones-captions p {
  margin: 0;
}
@media (min-width: 480px) {
  section.platform-product-views .platform-product-phones-pair {
    padding: 1rem 0.75rem;
  }
  section.platform-product-views .platform-product-phones-captions {
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
  }
}


/* protocols-20261019 — homepage Protocols & connectivity band (after PLATFORM IN ACTION)
   Partners-style: no grey frames on logos; consistent ~44px mark height; navy text chips for standards. */
.home-protocols-section,
.home-page-shell > section.home-protocols-section {
  background: #fff !important;
  background-color: #fff !important;
  border: none !important;
  border-top: 1px solid hsl(var(--border)) !important;
  border-bottom: 1px solid hsl(var(--border)) !important;
  color: var(--ws-slate);
}
/* protocols-row-20261019 — single horizontal flex-wrap strip (no column groups) */
.home-protocols-section .protocol-groups {
  display: block; /* unused after flatten; keep harmless */
}
.home-protocols-section .protocol-group-label {
  display: none; /* group labels dropped for single-band row */
}
.home-protocols-section .protocol-logo-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 1.25rem 1.75rem;
}
.home-protocols-section .protocol-logo-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-width: 5.5rem;
  padding: 0.35rem 0.5rem;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
.home-protocols-section .protocol-logo-frame {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2.75rem; /* 44px */
  width: auto;
  min-width: 5.5rem;
  max-width: 9.5rem;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}
.home-protocols-section .protocol-logo-frame img {
  display: block;
  max-height: 2.75rem;
  max-width: 9.5rem;
  width: auto;
  height: auto;
  object-fit: contain;
}
.home-protocols-section .protocol-logo-caption {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.6875rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #0B1F3A;
  line-height: 1.2;
}
.home-protocols-section .protocol-logo-item--chip {
  min-width: 0;
  padding: 0.35rem 0.25rem;
}
.home-protocols-section .protocol-text-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0 0.9rem;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #0B1F3A;
  background: transparent;
  border: 1.5px solid #0B1F3A;
  border-radius: 0.35rem;
  line-height: 1;
}
.home-protocols-section .protocol-legal {
  opacity: 0.85;
}
@media (min-width: 640px) {
  .home-protocols-section .protocol-logo-grid {
    gap: 1.5rem 2.25rem;
  }
  .home-protocols-section .protocol-logo-frame {
    height: 3rem; /* 48px */
  }
  .home-protocols-section .protocol-logo-frame img {
    max-height: 3rem;
  }
  .home-protocols-section .protocol-text-chip {
    min-height: 3rem;
    font-size: 0.875rem;
  }
}
/* protocols-row-20261019 — no 2/4-column group grids; one centered wrap row at all breakpoints */
@media (min-width: 1024px) {
  .home-protocols-section .protocol-logo-grid {
    justify-content: center;
    gap: 1.5rem 2rem;
  }
}
/* Slightly tighter chip padding for longer labels (NMEA 2000, 4–20 mA) */
.home-protocols-section .protocol-text-chip {
  white-space: nowrap;
}

/* coord-protocols-20261019 — CTA to Platform detailed protocol list */
.home-protocols-section .protocol-cta-wrap {
  display: flex;
  justify-content: center;
}
.home-protocols-section .protocol-platform-cta {
  font-family: var(--font-sans, system-ui, sans-serif);
  letter-spacing: 0.01em;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  padding-bottom: 0.1rem;
}
.home-protocols-section .protocol-platform-cta:hover {
  border-bottom-color: currentColor;
}

/* protocols-ibeacon-20261019 — wider frame for Eddystone wordmark */
.home-protocols-section .protocol-logo-frame--wide {
  max-width: 11.5rem;
  min-width: 7rem;
}
.home-protocols-section .protocol-logo-frame--wide img {
  max-width: 11.5rem;
}
@media (min-width: 640px) {
  .home-protocols-section .protocol-logo-frame--wide {
    max-width: 13rem;
  }
  .home-protocols-section .protocol-logo-frame--wide img {
    max-width: 13rem;
  }
}

/* protocols-teddy-logos-20261019 — no name under logos; square icons for icon-only marks */
.home-protocols-section .protocol-logo-caption {
  display: none !important;
}
.home-protocols-section .protocol-logo-item {
  gap: 0;
}
.home-protocols-section .protocol-logo-frame--square {
  min-width: 2.75rem;
  max-width: 3.25rem;
  width: 2.75rem;
}
.home-protocols-section .protocol-logo-frame--square img {
  max-width: 2.75rem;
  max-height: 2.75rem;
}
@media (min-width: 640px) {
  .home-protocols-section .protocol-logo-frame--square {
    min-width: 3rem;
    max-width: 3.5rem;
    width: 3rem;
  }
  .home-protocols-section .protocol-logo-frame--square img {
    max-width: 3rem;
    max-height: 3rem;
  }
}

/* cta-replace-20261019: .home-assessment-card site-wide (see rules above) */

/* ==========================================================================
   Alert handling + channel gallery (platform.html #alert-handling)
   Scoped under .ws-alert-channels — 2026-10-20
   ========================================================================== */
.platform-alert-showcase.bg-foreground {
  background: #0B1F3A !important;
  background-color: #0B1F3A !important;
  color: rgba(241, 245, 249, 0.92);
}
.platform-alert-showcase .section-eyebrow {
  color: var(--ws-cyan-soft) !important;
}
.platform-alert-showcase .ws-alert-channels__delivery {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1rem;
}
.platform-alert-showcase .ws-alert-channels__delivery-label {
  font-family: var(--font-heading, ui-sans-serif, system-ui, sans-serif);
  font-size: 0.9375rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: -0.01em;
  flex-shrink: 0;
}
.platform-alert-showcase .ws-alert-channels__pills {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.platform-alert-showcase .ws-alert-channels__pill {
  display: inline-flex;
  align-items: center;
  padding: 0.4rem 0.9rem;
  border-radius: 9999px;
  background: #fff;
  color: #0B1F3A;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
}
.platform-alert-showcase .ws-alert-channels__step {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.16);
}
.platform-alert-showcase .ws-alert-channels__gallery-heading {
  color: #fff !important;
}

/* Unified channel image strip — one panel, not 6 cards */
.platform-alert-showcase .ws-alert-channels__strip {
  margin: 0;
  border-radius: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.04);
  overflow: hidden;
  box-shadow: none;
  filter: none;
}
.platform-alert-showcase .ws-alert-channels__strip-track {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0.65rem;
  padding: 0.85rem;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.25) transparent;
}
.platform-alert-showcase .ws-alert-channels__strip-track::-webkit-scrollbar {
  height: 6px;
}
.platform-alert-showcase .ws-alert-channels__strip-track::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.25);
  border-radius: 9999px;
}
.platform-alert-showcase .ws-alert-channels__strip-item {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  background: transparent;
  box-shadow: none;
  filter: none;
}
.platform-alert-showcase .ws-alert-channels__strip-item--wide {
  width: clamp(9.5rem, 38vw, 12.5rem);
}
.platform-alert-showcase .ws-alert-channels__strip-item--phone {
  width: clamp(5.5rem, 22vw, 7.25rem);
}
.platform-alert-showcase .ws-alert-channels__strip-item--buzzer {
  width: clamp(5.5rem, 20vw, 7rem);
}
.platform-alert-showcase .ws-alert-channels__img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 11.5rem;
  object-fit: contain;
  border-radius: 0.55rem;
  box-shadow: none;
  filter: none;
}
.platform-alert-showcase .ws-alert-channels__strip-item--wide .ws-alert-channels__img {
  object-fit: cover;
  object-position: top left;
  aspect-ratio: 16 / 10;
  max-height: none;
  height: auto;
}
.platform-alert-showcase .ws-alert-channels__strip-item--phone .ws-alert-channels__img {
  border-radius: 0.7rem;
  max-height: 11.5rem;
}
.platform-alert-showcase .ws-alert-channels__strip-item--buzzer .ws-alert-channels__img {
  max-height: 11.5rem;
  box-shadow: none;
  filter: none;
  background: transparent;
  border-radius: 0.55rem;
}
.platform-alert-showcase .ws-alert-channels__strip-caption {
  padding: 0.65rem 1rem 0.85rem;
  font-size: 0.75rem;
  line-height: 1.4;
  letter-spacing: 0.01em;
  color: rgba(241, 245, 249, 0.62);
  text-align: center;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* Desktop (lg+): all 6 images share one horizontal line, no scroll needed */
@media (min-width: 1024px) {
  .platform-alert-showcase .ws-alert-channels__strip-track {
    overflow-x: visible;
    gap: 0.85rem;
    padding: 1.1rem 1.15rem;
    justify-content: space-between;
  }
  .platform-alert-showcase .ws-alert-channels__strip-item {
    flex: 1 1 0;
  }
  .platform-alert-showcase .ws-alert-channels__strip-item--wide {
    width: auto;
    flex: 1.35 1 0;
    max-width: 14rem;
  }
  .platform-alert-showcase .ws-alert-channels__strip-item--phone {
    width: auto;
    flex: 0.85 1 0;
    max-width: 8.5rem;
  }
  .platform-alert-showcase .ws-alert-channels__strip-item--buzzer {
    width: auto;
    flex: 0.85 1 0;
    max-width: 8rem;
  }
  .platform-alert-showcase .ws-alert-channels__img {
    max-height: 14rem;
  }
  .platform-alert-showcase .ws-alert-channels__strip-item--wide .ws-alert-channels__img {
    max-height: none;
    height: 100%;
    min-height: 9.5rem;
  }
  .platform-alert-showcase .ws-alert-channels__strip-item--phone .ws-alert-channels__img,
  .platform-alert-showcase .ws-alert-channels__strip-item--buzzer .ws-alert-channels__img {
    max-height: 14rem;
  }
  .platform-alert-showcase .ws-alert-channels__strip-caption {
    font-size: 0.8125rem;
    padding: 0.75rem 1.15rem 0.95rem;
  }
}

/* --------------------------------------------------------------------------
   Current-page Menu highlight (site-nav-active.js)
   Navy / cyan accent — subtle weight + underline, no leaf-green flash.
   -------------------------------------------------------------------------- */
header a.is-nav-active,
header a[aria-current="page"] {
  color: hsl(var(--foreground)) !important;
  font-weight: 600;
}
header a.is-nav-section-active {
  color: hsl(var(--foreground)) !important;
  font-weight: 600;
}
/* Top desktop items: short accent underline */
header .hidden.lg\:flex > div.group > a.is-nav-active,
header .hidden.lg\:flex > div.group > a.is-nav-section-active,
header .hidden.lg\:flex > div.group > a[aria-current="page"] {
  color: hsl(var(--accent)) !important;
  box-shadow: inset 0 -2px 0 hsl(var(--accent));
  border-radius: 0.375rem 0.375rem 0 0;
}
/* Dropdown children */
header div.glass-card a.is-nav-active,
header div.glass-card a[aria-current="page"] {
  color: hsl(var(--accent)) !important;
  background-color: hsl(var(--accent) / 0.08);
  font-weight: 600;
}
/* Contact CTA — ring only, keep existing fill */
header a.logo-gradient-cta.is-nav-active,
header a.logo-gradient-cta[aria-current="page"],
header a.ws-btn-green.is-nav-active,
header a.ws-btn-green[aria-current="page"] {
  box-shadow: 0 0 0 2px hsl(var(--accent) / 0.55);
  font-weight: 600;
}
/* Brand logo on home: no underline gimmick */
header a.shrink-0.is-nav-active,
header a.shrink-0[aria-current="page"] {
  box-shadow: none;
  color: hsl(var(--foreground)) !important;
}

/* Mobile slide-out panel */
nav a.is-nav-active,
nav a[aria-current="page"] {
  color: hsl(var(--accent)) !important;
  font-weight: 600;
}
nav a.is-nav-section-active {
  color: hsl(var(--accent)) !important;
  font-weight: 600;
}
nav li > a.is-nav-active .text-base,
nav li > a[aria-current="page"] .text-base,
nav li > a.is-nav-section-active .text-base {
  color: hsl(var(--accent));
  font-weight: 600;
}
nav li > button.is-nav-section-active,
nav li > button.is-nav-active {
  color: hsl(var(--accent)) !important;
}
nav li > button.is-nav-section-active .text-base,
nav li > button.is-nav-active .text-base,
nav li > button.is-nav-section-active .font-mono,
nav li > button.is-nav-active .font-mono {
  color: hsl(var(--accent)) !important;
}
/* Injected accordion children */
nav li div a.is-nav-active,
nav li div a[aria-current="page"] {
  color: hsl(var(--accent)) !important;
  font-weight: 600;
  background-color: hsl(var(--accent) / 0.08);
  border-radius: 0.375rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

/* mobile-section-gap-20261022 — py-14 (and a few paired responsive paddings) are
   used widely in HTML but missing from the built Tailwind CSS. Without them,
   mobile sections after a border-b / border-y (e.g. hero → AT A GLANCE) have
   ~0 padding-top, so the divider sits flush against the next eyebrow.
   Restoring design-intent spacing: 3.5rem (56px) clear air under section lines. */
.py-14 {
  padding-top: 3.5rem;
  padding-bottom: 3.5rem;
}
@media (min-width: 640px) {
  .sm\:py-16 {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
  .sm\:py-20 {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
  .sm\:py-24 {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }
  .sm\:pb-20 {
    padding-bottom: 5rem;
  }
}
@media (min-width: 1024px) {
  .lg\:py-16 {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
  .lg\:pt-16 {
    padding-top: 4rem;
  }
  .lg\:pb-24 {
    padding-bottom: 6rem;
  }
}
.pt-10 {
  padding-top: 2.5rem;
}

/* Modular service/mode cards (homepage SERVICE_*, solutions MODE_*):
   breathing room so title/body aren't flush to the outer frame.
   Homepage used Tailwind class p-7, which is absent from the compiled sheet
   (so base padding was 0 below the sm breakpoint). */
a.glass-card:has(.modular-integration-icon) {
  padding: 2rem 1.75rem;
}
a.glass-card:has(.modular-integration-icon) > .mono-label.absolute,
a.glass-card:has(.modular-integration-icon) > span.absolute.mono-label {
  top: 1.25rem;
  right: 1.25rem;
}
@media (min-width: 640px) {
  a.glass-card:has(.modular-integration-icon) {
    padding: 2.5rem 2.25rem;
  }
  a.glass-card:has(.modular-integration-icon) > .mono-label.absolute,
  a.glass-card:has(.modular-integration-icon) > span.absolute.mono-label {
    top: 1.5rem;
    right: 1.5rem;
  }
}


/* Audit: padding utilities referenced in HTML but missing from compiled sheet.
   Keep selectors inside the correct breakpoints (Tailwind convention). */
@media (min-width: 640px) {
  .sm\:p-5 {
    padding: 1.25rem;
  }
  .sm\:p-6 {
    padding: 1.5rem;
  }
}
@media (min-width: 1024px) {
  .lg\:py-28 {
    padding-top: 7rem;
    padding-bottom: 7rem;
  }
}


/* contact form modal */
html.ws-contact-modal-open {
  overflow: hidden;
}
.ws-contact-modal-root {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
}
.ws-contact-modal-backdrop {
  position: absolute;
  inset: 0;
  background: hsl(222 47% 11% / .48);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
.ws-contact-modal {
  position: relative;
  z-index: 1;
  width: min(100%, 26rem);
  padding: 1.75rem 1.5rem 1.5rem;
  border-radius: 0.75rem;
  background: hsl(var(--card));
  box-shadow: 0 18px 48px hsl(222 47% 11% / .18), inset 0 1px #fffc;
  text-align: center;
}
.ws-contact-modal-close {
  position: absolute;
  top: 0.65rem;
  right: 0.65rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 9999px;
  color: hsl(var(--muted-foreground));
  background: transparent;
  border: none;
  transition: background-color .15s ease, color .15s ease;
}
.ws-contact-modal-close:hover,
.ws-contact-modal-close:focus-visible {
  background: hsl(var(--secondary));
  color: hsl(var(--foreground));
  outline: none;
}
.ws-contact-modal-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  margin: 0 auto 0.85rem;
  border-radius: 9999px;
}
.ws-contact-modal--success .ws-contact-modal-icon {
  color: hsl(152 60% 36%);
  background: hsl(152 60% 36% / .12);
}
.ws-contact-modal--error .ws-contact-modal-icon {
  color: hsl(var(--destructive));
  background: hsl(var(--destructive) / .12);
}
.ws-contact-modal-title {
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: hsl(var(--foreground));
  margin: 0 0 0.5rem;
}
.ws-contact-modal-body {
  font-size: 0.925rem;
  line-height: 1.55;
  color: hsl(var(--muted-foreground));
  margin: 0 0 1.25rem;
}
.ws-contact-modal-ok {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 6.5rem;
  padding: 0.65rem 1.25rem;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: #fff;
  border: none;
}
.ws-contact-modal-ok:focus-visible {
  outline: 2px solid hsl(var(--ring));
  outline-offset: 2px;
}
#contact-form .ws-contact-invalid {
  border-color: hsl(var(--destructive)) !important;
  box-shadow: 0 0 0 1px hsl(var(--destructive) / .35);
}
#contact-form button[type="submit"][disabled] {
  opacity: 0.7;
  cursor: wait;
}

/* contact form — block double submit while sending */
#contact-form.ws-contact-sending {
  pointer-events: none;
}
#contact-form.ws-contact-sending button[type="submit"],
#contact-form button[type="submit"]:disabled {
  opacity: 0.65;
  cursor: not-allowed;
  pointer-events: none;
}

/* contact form — Cloudflare Turnstile spacing */
#contact-form .ws-contact-turnstile {
  margin: 0.25rem 0 0.75rem;
}
#contact-form .ws-contact-turnstile .cf-turnstile {
  line-height: 0;
}

/* Legal page section spacing */
.space-y-10>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(2.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2.5rem * var(--tw-space-y-reverse))}
.space-y-12>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(3rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(3rem * var(--tw-space-y-reverse))}
.space-y-16>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(4rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(4rem * var(--tw-space-y-reverse))}
@media (min-width: 1024px){.lg\:py-24{padding-top:6rem;padding-bottom:6rem}}
