/* CleanMission hardware · illustration narrative · 2026-09 */
/* Design: variance 4 / motion 4 / density 3. Existing product evidence retained. */
.hw-landing{--hw-purple:#4c00ff;--hw-tint:#f4f0ff;--hw-ink:#20232b;--hw-muted:#636975;--hw-line:#e9e7ee;--hw-soft:#f8f9fb;color:var(--hw-ink)}
.hw-landing [hidden]{display:none!important}
.hw-wrap{width:min(1240px,calc(100% - 64px));margin-inline:auto}
.hw-landing .bg-brand-blue,.hw-landing .bg-brand-blue-dark{background-color:var(--hw-purple)}
.hw-landing .text-brand-blue,.hw-landing .text-brand-blue-dark{color:var(--hw-purple)}
.hw-landing .bg-brand-blue-soft{background-color:var(--hw-tint)}
.hw-landing section[id]{scroll-margin-top:90px}
.hw-hero{padding:52px 0 38px;background:#fff}
.hw-hero-copy{display:grid;grid-template-columns:1.25fr 1fr;align-items:end;gap:72px;margin-bottom:34px}
.hw-eyebrow{font-size:12px;font-weight:650;color:var(--hw-purple);letter-spacing:.06em;margin:0 0 16px;line-height:1.5}
.hw-hero h1{font-size:clamp(32px,3.45vw,49px);line-height:1.2;letter-spacing:-.045em;font-weight:720;margin:0;word-break:keep-all;text-wrap:balance}
.hw-hero h1 em{font-style:normal;color:var(--hw-purple)}
.hw-lead{font-size:16px;line-height:1.75;color:var(--hw-muted);max-width:450px;margin:0 0 22px}
.hw-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.hw-button{display:inline-flex;justify-content:center;align-items:center;gap:10px;padding:15px 23px;min-height:48px;border-radius:10px;background:var(--hw-purple);color:white;font-size:14px;font-weight:650;transition:background .18s,transform .18s;text-decoration:none}
.hw-button:active{transform:scale(.97)}
.hw-link{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--hw-ink);font-size:14px;font-weight:600;text-decoration:none}
.hw-link::after{content:'↗';font-size:17px}
.hw-demo{border:1px solid var(--hw-line);border-radius:18px;overflow:hidden;background:white}
.hw-demo-top{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;padding:12px 22px;border-bottom:1px solid var(--hw-line)}
.hw-demo-label{font-size:13px;font-weight:600;display:flex;align-items:center;gap:10px;color:#4c505a}
.hw-demo-label:before{content:'';width:7px;height:7px;background:var(--hw-purple);border-radius:50%;flex-shrink:0}
.hw-demo-label small{font-weight:400;color:#7c808a;margin-left:5px;font-size:11px}
.hw-toggle{display:flex;gap:3px;padding:3px;background:#f1f1f5;border-radius:9px;flex-shrink:0}
.hw-toggle button{border:0;background:transparent;color:#636975;min-height:36px;padding:8px 18px;font-size:11px;font-weight:650;letter-spacing:.035em;border-radius:6px;cursor:pointer;transition:background .2s,color .2s,box-shadow .2s}
.hw-toggle button[aria-pressed=true]{color:var(--hw-purple);background:white;box-shadow:0 1px 4px #24105412}
.hw-demo-grid{display:grid;grid-template-columns:minmax(0,1fr) 292px;min-height:415px}
.hw-scene{position:relative;overflow:hidden;align-self:center;background:white;isolation:isolate}
.hw-scene-image{width:100%;height:auto;display:block;aspect-ratio:1672/941;object-fit:contain}
.hw-scene>svg{width:100%;height:auto;display:block}
.hw-before,.hw-after{position:absolute;inset:0;pointer-events:none}
.hw-before>svg,.hw-after>svg{display:block;width:100%;height:100%;overflow:visible}
.hw-before a,.hw-after a,.hw-before button,.hw-after button{pointer-events:auto}
.hw-demo-story{background:var(--hw-soft);padding:30px 26px;border-left:1px solid var(--hw-line);display:grid;align-items:center}
.hw-demo-story :is(h2,h3){font-size:23px;line-height:1.35;letter-spacing:-.04em;font-weight:650;margin:12px 0}
.hw-demo-story p{font-size:13px;line-height:1.75;color:var(--hw-muted);margin:0}
.hw-demo-story .hw-eyebrow{font-size:10px;margin:0;letter-spacing:.05em}
.hw-steps{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:16px;counter-reset:step}
.hw-steps li{position:relative;padding-left:29px;font-size:13px;color:var(--hw-ink);line-height:1.6;counter-increment:step}
.hw-steps li:before{content:counter(step,decimal-leading-zero);position:absolute;left:0;top:1px;font-size:10px;font-weight:650;color:var(--hw-purple)}
.hw-steps li strong{display:block;font-weight:650;font-size:13px}
.hw-steps li span,.hw-steps li p{display:block;color:var(--hw-muted);font-size:12px;margin-top:2px}
.hw-demo[data-state=before] .hw-demo-story{background:#f7f7f8}
.hw-demo[data-state=before] .hw-steps li:before{color:#7b7f87}
.hw-demo-caption{display:flex;justify-content:space-between;gap:24px;margin:13px 2px 0;color:#7b7f88;font-size:11px;line-height:1.65}
.hw-demo-caption a{color:var(--hw-purple)}
.hw-scene-note{position:absolute;bottom:18px;left:18px;max-width:calc(100% - 36px);padding:9px 13px;background:#ffffffed;border:1px solid var(--hw-line);border-radius:7px;color:#5c606a;font-size:11px;box-shadow:0 3px 16px #17223a08}
.hw-pin{position:absolute;display:flex;align-items:center;gap:7px;background:white;color:var(--hw-purple);font-size:11px;font-weight:650;border:1px solid #ded3ff;border-radius:7px;padding:8px 11px;box-shadow:0 4px 18px #2d125b12;white-space:nowrap;text-decoration:none;transform:translate(-50%,-50%);transition:box-shadow .2s}
.hw-pin:before{content:'';width:6px;height:6px;border:2px solid var(--hw-purple);border-radius:50%;box-sizing:content-box}
.hw-products-nav{display:flex;align-items:center;gap:7px;padding:15px 0 2px;overflow:auto;scrollbar-width:none}
.hw-products-nav a{white-space:nowrap;padding:11px 15px;border-radius:8px;color:#717581;font-size:12px;text-decoration:none;transition:background .2s,color .2s}
.hw-products-nav a[aria-current=page]{background:var(--hw-tint);color:var(--hw-purple);font-weight:650}
.hw-section{padding:86px 0}
.hw-section-tint{background:var(--hw-tint)}
.hw-section-soft{background:var(--hw-soft)}
.hw-section-head{margin-bottom:36px;max-width:730px}
.hw-section-head h2,.hw-copy h2{font-size:clamp(27px,2.7vw,37px);line-height:1.3;letter-spacing:-.04em;font-weight:650;margin:0 0 16px}
.hw-section-head p,.hw-copy>p{font-size:15px;line-height:1.8;color:var(--hw-muted);margin:0}
.hw-section-head .hw-eyebrow,.hw-copy .hw-eyebrow{font-size:12px;color:var(--hw-purple);margin-bottom:13px}
.hw-proof-grid{display:grid;grid-template-columns:1.18fr 1fr;align-items:center;gap:70px}
.hw-proof-grid.reverse{grid-template-columns:1fr 1.18fr}
.hw-proof-media{background:#f6f6f9;border:1px solid var(--hw-line);border-radius:16px;overflow:hidden}
.hw-proof-media>img{width:100%;height:auto;display:block}
.hw-proof-media figcaption,.hw-proof-media .hw-caption{font-size:11px;color:#787d87;padding:13px 18px;background:white;border-top:1px solid var(--hw-line);line-height:1.6}
.hw-copy h3{font-size:22px;line-height:1.4;font-weight:650;margin:0 0 14px}
.hw-copy .hw-link{margin-top:20px;color:var(--hw-purple)}
.hw-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.hw-feature{border-top:1px solid var(--hw-line);padding-top:24px}
.hw-feature h3{font-size:19px;font-weight:650;line-height:1.4;margin:0 0 12px;letter-spacing:-.025em}
.hw-feature p{font-size:14px;line-height:1.8;color:var(--hw-muted);margin:0}
.hw-feature>.hw-eyebrow{margin-bottom:16px;font-size:11px}
.hw-process{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;counter-reset:process}
.hw-process>div,.hw-process>li{border-top:1px solid #ded5f8;padding:22px 0;counter-increment:process}
.hw-process strong{display:block;font-size:16px;margin:0 0 10px;font-weight:650}
.hw-process p{font-size:13px;line-height:1.75;color:var(--hw-muted)}
.hw-landing .hw-process .hw-eyebrow{font-size:11px;margin-bottom:16px}
.hw-event-pair{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.hw-event{border:1px solid var(--hw-line);border-radius:16px;overflow:hidden;background:white}
.hw-event-visual{position:relative;background:white;aspect-ratio:1672/941;overflow:hidden}
.hw-event-visual>img{width:100%;height:100%;object-fit:contain}
.hw-event-visual>svg{position:absolute;inset:0;width:100%;height:100%}
.hw-event-copy{padding:28px}
.hw-event-copy h3{font-size:22px;font-weight:650;letter-spacing:-.03em;margin:0 0 14px}
.hw-state-row{display:grid;grid-template-columns:50px 1fr;gap:12px;margin:10px 0;align-items:start;font-size:13px;line-height:1.7;color:var(--hw-muted)}
.hw-state-row b{font-size:9px;color:#858a94;line-height:2.3;letter-spacing:.04em;font-weight:650}
.hw-state-row.after{color:var(--hw-ink)}
.hw-state-row.after b{color:var(--hw-purple)}
.hw-catalog{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.hw-product{border:1px solid var(--hw-line);border-radius:14px;overflow:hidden;background:#fff;display:flex;flex-direction:column;text-decoration:none;color:inherit;transition:box-shadow .2s,border-color .2s}
.hw-product-visual{position:relative;background:#fff;aspect-ratio:16/9;overflow:hidden;border-bottom:1px solid var(--hw-line)}
.hw-product-visual img{width:100%;height:100%;object-fit:cover}
.hw-product-visual.contain img{object-fit:contain;padding:24px}
.hw-product-body{padding:23px;display:flex;flex-direction:column;flex:1}
.hw-product-body h3{font-size:18px;font-weight:650;letter-spacing:-.025em;margin:0 0 9px}
.hw-product-body p{font-size:13px;line-height:1.7;color:var(--hw-muted);margin:0 0 18px}
.hw-product-bottom{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--hw-purple);font-size:11px;font-weight:650}
.hw-product-bottom span:last-child{font-size:20px;font-weight:400}
.hw-product-consult{padding:30px;background:var(--hw-tint);display:flex;flex-direction:column;justify-content:center;gap:20px;min-height:260px}
.hw-product-consult h3{font-size:27px;line-height:1.3;letter-spacing:-.03em;margin:0;font-weight:650}
.hw-product-consult p{font-size:13px;color:var(--hw-muted);line-height:1.7}
.hw-proof-phones{display:flex;justify-content:center;gap:28px;padding:34px 20px;background:#f5f3fa}
.hw-proof-phones img{height:320px;width:auto;max-width:43%;object-fit:contain}
.hw-proof-phones figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:14px;min-width:0}
.hw-proof-phones figure img{max-width:100%}
.hw-proof-phones figcaption{background:none;border:0;font-size:11px;text-align:center;padding:0}
.hw-branch{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:25px 0}
.hw-branch>div{border-top:2px solid #d8caff;padding:16px 0}
.hw-branch strong{display:block;color:var(--hw-purple);font-size:13px;margin-bottom:8px;font-weight:650}
.hw-branch p{font-size:13px;color:var(--hw-muted);line-height:1.75}
.hw-landing :is(a,button,summary):focus-visible{outline:3px solid #9871ff;outline-offset:4px}
.hw-landing footer{border-top:1px solid var(--hw-line)}
.hw-landing .reveal,.hw-landing .reveal-l,.hw-landing .reveal-r,.hw-landing .reveal-scale,.hw-landing .stagger>*{opacity:1;transform:none;transition:none}
@media(hover:hover){.hw-button:hover{background:#3900c2}.hw-link:hover{color:var(--hw-purple)}.hw-pin:hover{box-shadow:0 4px 20px #4c00ff30}.hw-products-nav a:hover{background:#f7f5fb;color:var(--hw-purple)}.hw-product:hover{border-color:#cbb7ff;box-shadow:0 8px 25px #3f1c740a}}
@media(min-width:1500px){.hw-demo-grid{min-height:450px}.hw-scene-image{aspect-ratio:1672/941}}
@media(max-width:1000px){.hw-hero-copy{gap:35px;grid-template-columns:1.2fr 1fr}.hw-hero h1{font-size:38px}.hw-demo-grid{grid-template-columns:minmax(0,1fr) 255px;min-height:370px}.hw-demo-story{padding:24px 20px}.hw-demo-story :is(h2,h3){font-size:21px}.hw-proof-grid,.hw-proof-grid.reverse{gap:40px}.hw-steps{gap:11px;margin-top:17px}.hw-hero{padding-top:36px}.hw-lead{font-size:14px}.hw-actions{gap:15px}.hw-catalog{gap:16px}.hw-product-body{padding:19px}.hw-pin{font-size:9px;padding:6px 8px}}
@media(max-width:760px){.hw-wrap{width:calc(100% - 36px)}.hw-hero{padding:32px 0 20px}.hw-hero-copy{display:block;margin-bottom:25px}.hw-hero h1{font-size:34px;line-height:1.23;max-width:530px}.hw-eyebrow{font-size:11px;margin-bottom:12px}.hw-lead{font-size:14px;line-height:1.7;max-width:520px;margin:19px 0}.hw-button{font-size:13px;padding:13px 20px}.hw-demo{border-radius:12px}.hw-demo-top{padding:10px 13px;min-height:57px}.hw-demo-label{font-size:11px;gap:7px}.hw-demo-label small{display:none}.hw-toggle button{padding:7px 12px;min-height:33px;font-size:10px}.hw-demo-grid{display:block;min-height:0}.hw-scene-image{aspect-ratio:1672/941}.hw-demo-story{border-left:0;border-top:1px solid var(--hw-line);padding:22px;min-height:220px}.hw-demo-story :is(h2,h3){font-size:23px;margin:8px 0}.hw-demo-story p{font-size:13px}.hw-demo-story .hw-steps{grid-template-columns:1fr 1fr;gap:15px;margin-top:20px}.hw-steps li:last-child:nth-child(odd){grid-column:1/-1}.hw-demo-caption{display:block;font-size:10px;margin:11px 2px 0}.hw-demo-caption>span{display:block}.hw-demo-caption>span+span{margin-top:3px}.hw-products-nav{margin-top:5px;padding-top:12px;gap:0}.hw-products-nav a{font-size:11px;padding:10px 11px}.hw-section{padding:56px 0}.hw-section-head{margin-bottom:27px}.hw-section-head h2,.hw-copy h2{font-size:28px}.hw-section-head p,.hw-copy>p{font-size:14px}.hw-proof-grid,.hw-proof-grid.reverse{grid-template-columns:1fr;gap:29px}.hw-proof-grid.reverse .hw-copy{order:2}.hw-feature-grid{grid-template-columns:1fr;gap:24px}.hw-feature{padding-top:20px}.hw-process{grid-template-columns:1fr 1fr;gap:15px}.hw-event-pair{grid-template-columns:1fr;gap:22px}.hw-event-copy{padding:23px}.hw-catalog{grid-template-columns:1fr 1fr;gap:12px}.hw-product-body{padding:17px}.hw-product-body h3{font-size:16px}.hw-product-body p{font-size:12px;margin-bottom:12px}.hw-product-bottom{font-size:10px;align-items:flex-end}.hw-product-consult{padding:22px;min-height:240px}.hw-product-consult h3{font-size:23px}.hw-pin{font-size:8px;padding:5px 6px;gap:4px;border-radius:5px}.hw-pin:before{width:4px;height:4px;border-width:1.5px}.hw-scene-note{bottom:9px;left:9px;padding:5px 7px;font-size:8px}.hw-proof-phones{gap:16px;padding:24px 16px}.hw-proof-phones img{height:280px}.hw-branch{gap:16px}.hw-branch p{font-size:12px}}
@media(max-width:420px){.hw-hero h1{font-size:31px}.hw-toggle button{padding-inline:10px}.hw-demo-story{padding:20px}.hw-demo-story .hw-steps{grid-template-columns:1fr;gap:13px}.hw-demo-story .hw-steps li:last-child{grid-column:auto}.hw-catalog{grid-template-columns:1fr}.hw-product-visual{aspect-ratio:2/1}.hw-product-body{padding:22px}.hw-product-body p{font-size:13px}.hw-product-bottom{font-size:12px}.hw-proof-phones img{height:240px}}
@media(prefers-reduced-motion:reduce){.hw-landing *,.hw-landing *::before,.hw-landing *::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
.hw-price-note{color:#7a7f89;font-size:11px;line-height:1.7;margin:18px 0 0}.hw-contact{display:flex;align-items:center;justify-content:space-between;gap:40px}.hw-contact h2{font-size:clamp(28px,3vw,40px);font-weight:650;line-height:1.3;letter-spacing:-.035em;margin:0 0 14px}.hw-contact p:not(.hw-eyebrow){font-size:14px;color:var(--hw-muted);line-height:1.7}.hw-logo-track{display:flex;gap:42px;justify-content:center;align-items:center;width:max-content;max-width:none;animation:none!important}.hw-logo-mask{overflow:hidden}.hw-logo-track>div:nth-child(n+7){display:none}.hw-legacy-section{padding-block:70px}.hw-legacy-section h2{font-weight:650;letter-spacing:-.035em}.hw-legacy-section .bg-brand-ink{background:#24202f}.hw-legacy-section [class*="blur-"]{display:none}.hw-fire-plan{aspect-ratio:1536/920;display:block;width:100%;height:auto}.hw-demo:has(.hw-fire-plan) .hw-scene{padding:14px 2px}.hw-demo:has(.hw-fire-plan) .hw-demo-grid{min-height:0}.hw-demo:has(.hw-fire-plan) .hw-demo-story{padding-block:26px}
@media(max-width:760px){.hw-contact{display:block}.hw-contact .hw-actions{margin-top:26px}.hw-legacy-section{padding-block:52px}.hw-logo-track{gap:28px}.hw-logo-track>div:nth-child(n+5){display:none}.hw-demo:has(.hw-fire-plan) .hw-scene{padding:5px 0}}
.hw-hero-tools{display:flex;align-items:center;gap:24px}.hw-hero-tools .hw-products-nav{min-width:0;flex:1}.hw-landing #cmLangSwitch{position:static!important;inset:auto!important;flex-shrink:0;box-shadow:none!important;z-index:auto!important;margin-top:12px}
@media(max-width:760px){.hw-hero-tools{display:block}.hw-landing #cmLangSwitch{width:max-content;margin:12px 0 0 auto}}
