@media(max-width:1120px){.mainfilter-intro .intro-grid{grid-template-columns:minmax(0,1fr);gap:48px}.mainfilter-intro .stage-position{max-width:680px}}
@media(max-width:1120px){.mainfilter-page .datasheet-preview-inner{grid-template-columns:minmax(0,1fr);gap:28px}.mainfilter-page .datasheet-product img{width:min(560px,100%);transform:none}}
@media(max-width:460px){.mainfilter-page .mainfilter-hero-copy h1{font-size:clamp(40px,12.5vw,50px)}}
.mainfilter-hero{position:relative;isolation:isolate;min-height:610px;padding-top:92px;overflow:hidden;color:#fff;background:radial-gradient(circle at 72% 38%,#0b568e 0,#003d73 25%,var(--blue) 52%,var(--deep) 100%)}
.mainfilter-hero-grid{position:relative;z-index:2;min-height:518px;display:grid;grid-template-columns:minmax(480px,.95fr) minmax(420px,1.05fr);gap:70px;align-items:center;padding-bottom:76px}
.mainfilter-hero-copy{max-width:720px}.mainfilter-hero-copy h1{margin:0;font-size:clamp(54px,6vw,86px);line-height:.98;letter-spacing:-.045em}.mainfilter-hero-copy>p:last-child{max-width:650px;margin:24px 0 0;color:#e6f0f6;font-size:clamp(22px,2.1vw,31px);line-height:1.32;font-weight:600}
.mainfilter-hero-visual{position:relative;min-height:390px;display:grid;place-items:center}.mainfilter-hero-visual:before{content:"";position:absolute;width:360px;height:360px;border:1px solid rgba(255,255,255,.16);border-radius:50%;box-shadow:0 0 0 42px rgba(255,255,255,.025),0 0 0 84px rgba(255,255,255,.018)}
.mainfilter-hero-visual>span{position:absolute;right:0;top:4px;color:rgba(255,255,255,.09);font-size:240px;line-height:1;font-weight:800;letter-spacing:-.08em}.mainfilter-hero-visual img{position:relative;width:min(390px,78%);filter:grayscale(1) brightness(0) invert(1);opacity:.9}
.mainfilter-flow{position:absolute;left:-8%;right:-8%;bottom:86px;height:1px;background:linear-gradient(90deg,transparent,rgba(168,205,230,.18) 22%,rgba(255,255,255,.68) 67%,transparent)}.mainfilter-flow:after{content:"";position:absolute;right:24%;top:-7px;width:13px;height:13px;border-top:1px solid rgba(255,255,255,.7);border-right:1px solid rgba(255,255,255,.7);transform:rotate(45deg)}
.has-motion .mainfilter-hero .mainfilter-flow{animation:mainfilter-flow-in 2.4s cubic-bezier(.2,.72,.2,1) .35s both}.has-motion .mainfilter-hero-visual>span{animation:mainfilter-symbol-in 1.25s ease-out .18s both}.has-motion .mainfilter-hero-visual img{animation:mainfilter-symbol-in 1.4s ease-out .38s both}@keyframes mainfilter-flow-in{from{opacity:0;clip-path:inset(-18px 100% -18px 0)}25%{opacity:1}to{opacity:1;clip-path:inset(-18px -18px -18px 0)}}@keyframes mainfilter-symbol-in{from{opacity:0;transform:translateX(16px) scale(.985)}to{opacity:1;transform:translateX(0) scale(1)}}
.mainfilter-intro{padding:88px 0 104px;background:#fff}.intro-grid{display:grid;grid-template-columns:minmax(420px,.9fr) minmax(520px,1.1fr);gap:clamp(70px,8vw,130px);align-items:center}.intro-copy{max-width:650px}.intro-copy h2,.city-world-heading h2,.datasheet-preview h2{margin:0;font-size:clamp(34px,3.7vw,52px);line-height:1.1;letter-spacing:-.035em}.intro-copy>p:not(.eyebrow),.datasheet-preview p:last-child{margin:24px 0 0;color:#526b83;font-size:18px;line-height:1.68}.intro-copy .selection-context{margin-top:15px;color:var(--blue);font-size:16px;line-height:1.6;font-weight:700}
.stage-position ol{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0;padding:0;list-style:none}.stage-position ol:before{content:"";position:absolute;left:11%;right:11%;top:27px;height:1px;background:#bdcbd7}.stage-position li{position:relative;text-align:center}.stage-position li span{position:relative;z-index:1;width:56px;height:56px;margin:0 auto 15px;display:grid;place-items:center;color:#526b83;border:1px solid #aabcca;border-radius:50%;background:#fff;font-size:15px;font-weight:800}.stage-position li strong{display:block;color:#526b83;font-size:13px;line-height:1.3;text-transform:uppercase}.stage-position li.is-active span{color:#fff;border-color:var(--blue);background:var(--blue);box-shadow:0 10px 28px rgba(0,46,93,.2)}.stage-position li.is-active strong{color:var(--blue)}
.city-world{position:relative;isolation:isolate;padding:104px 0 112px;overflow:hidden;color:#fff;background:radial-gradient(circle at 82% 8%,#0b568e 0,#003d73 25%,var(--blue) 55%,var(--deep) 100%)}.city-world:before{content:"";position:absolute;z-index:-1;left:-10%;right:-10%;top:310px;height:1px;background:linear-gradient(90deg,transparent,rgba(169,205,229,.1),rgba(255,255,255,.32),transparent)}
.city-world-heading{display:grid;grid-template-columns:minmax(480px,1.08fr) minmax(340px,.72fr);gap:clamp(60px,8vw,130px);align-items:center;margin-bottom:56px}.city-world-heading h2{max-width:760px;color:#fff}.city-heading-product{position:relative;min-height:330px;display:grid;place-items:center}.city-heading-product span{position:absolute;width:250px;height:250px;border:1px solid rgba(198,224,241,.22);border-radius:50%;box-shadow:0 0 0 38px rgba(255,255,255,.018),0 0 0 76px rgba(255,255,255,.012)}.city-heading-product img{position:relative;z-index:1;width:min(510px,118%);height:auto;filter:drop-shadow(0 24px 26px rgba(0,18,38,.3));transform:translateX(4%);transition:opacity 1s ease,transform 1.3s cubic-bezier(.2,.72,.2,1)}.has-motion .city-world:not(.is-visible) .city-heading-product img{opacity:0;transform:translateX(11%) scale(.985)}.has-motion .city-world.is-visible .city-heading-product img{opacity:1;transform:translateX(4%) scale(1)}
.class-groups{border-top:1px solid rgba(187,216,235,.28)}.class-group{display:grid;grid-template-columns:118px minmax(0,1fr);gap:34px;padding:38px 0;border-bottom:1px solid rgba(187,216,235,.28)}.class-heading{padding-top:6px}.class-heading span{display:block;color:#9fbed3;font-size:11px;font-weight:800;letter-spacing:.17em;text-transform:uppercase}.class-heading h3{margin:6px 0 0;color:#fff;font-size:40px;line-height:1;letter-spacing:-.04em}
.city-grid{display:grid;grid-template-columns:repeat(5,minmax(128px,1fr));gap:14px}.city-grid-six{grid-template-columns:repeat(6,minmax(110px,1fr))}.city-card{position:relative;min-height:205px;padding:24px 18px 18px;display:flex;flex-direction:column;align-items:center;text-align:center;border:1px solid rgba(179,211,232,.25);background:rgba(255,255,255,.025);transition:transform .35s cubic-bezier(.2,.72,.2,1),background-color .35s ease,border-color .35s ease}.city-card:after{content:"";position:absolute;left:16px;right:16px;bottom:-1px;height:1px;background:#8fb6d1;transform:scaleX(.28);opacity:.55;transition:transform .35s ease,opacity .35s ease}.city-card:hover{transform:translateY(-4px);border-color:rgba(198,224,241,.5);background:rgba(255,255,255,.06)}.city-card:hover:after{transform:scaleX(1);opacity:1}.city-card img{width:88px;height:76px;object-fit:contain;object-position:center bottom;filter:grayscale(1) brightness(0) invert(1);opacity:.9}.city-card h4{margin:15px 0 9px;color:#fff;font-size:16px;line-height:1.2}.city-card p{width:100%;margin:auto 0 0;color:#bfd4e3;font-size:12px}.city-card p strong{color:#fff;font-size:14px}.city-card p span{display:none}
.has-motion .city-world:not(.is-visible) .class-group{opacity:0;transform:translateY(20px)}.has-motion .city-world.is-visible .class-group{opacity:1;transform:translateY(0);transition:opacity .75s ease,transform .9s cubic-bezier(.2,.72,.2,1)}.has-motion .city-world.is-visible .class-group:nth-child(2){transition-delay:.08s}.has-motion .city-world.is-visible .class-group:nth-child(3){transition-delay:.16s}.has-motion .city-world.is-visible .class-group:nth-child(4){transition-delay:.24s}.has-motion .city-world.is-visible .class-group:nth-child(5){transition-delay:.32s}.has-motion .city-world.is-visible .class-group:nth-child(6){transition-delay:.4s}
.datasheet-preview{position:relative;isolation:isolate;padding:72px 0 92px;overflow:hidden;background:#fff}.datasheet-preview-inner{position:relative;display:grid;grid-template-columns:minmax(390px,.82fr) minmax(520px,1.18fr);gap:clamp(55px,7vw,110px);align-items:center}.datasheet-product{position:relative;min-height:410px;display:grid;place-items:center}.datasheet-product span{position:absolute;width:350px;height:350px;border:1px solid #d3e0e9;border-radius:50%;box-shadow:0 0 0 48px #f5f8fa,0 0 0 96px #fafcfd}.datasheet-product img{position:relative;z-index:1;width:min(590px,125%);height:auto;filter:drop-shadow(0 24px 24px rgba(0,31,61,.14));transform:translateX(-4%)}.datasheet-preview h2{max-width:760px}.datasheet-preview p:last-child{max-width:720px}.mainfilter-page .footer-angle{background:#fff}
@media(max-width:1100px){.city-grid,.city-grid-six{grid-template-columns:repeat(3,minmax(140px,1fr))}}
@media(max-width:980px){.mainfilter-hero-grid{grid-template-columns:1fr 420px;gap:20px}.mainfilter-hero-visual>span{font-size:190px}.intro-grid,.city-world-heading{grid-template-columns:1fr;gap:36px}.stage-position{max-width:680px}.city-heading-product{min-height:360px;max-width:620px}.city-heading-product img{width:min(560px,100%);transform:none}.datasheet-preview-inner{grid-template-columns:minmax(330px,.8fr) minmax(400px,1.2fr);gap:45px}.datasheet-product{min-height:350px}.datasheet-product span{width:280px;height:280px}.datasheet-product img{width:120%}}
@media(max-width:760px){.mainfilter-hero{min-height:650px;padding-top:78px}.mainfilter-hero-grid{min-height:572px;grid-template-columns:1fr;padding-top:70px;padding-bottom:110px}.mainfilter-hero-visual{position:absolute;right:-90px;top:140px;width:360px;min-height:330px;opacity:.24}.mainfilter-hero-visual>span{font-size:160px}.mainfilter-hero-copy{position:relative;z-index:2;max-width:520px}.mainfilter-hero-copy h1{font-size:50px}.mainfilter-hero-copy>p:last-child{font-size:23px}.mainfilter-flow{bottom:88px}.mainfilter-intro{padding:72px 0 82px}.city-world{padding:78px 0 86px}.city-world-heading{margin-bottom:42px}.city-heading-product{min-height:300px}.city-heading-product span{width:220px;height:220px}.city-heading-product img{width:min(500px,110%)}.class-group{grid-template-columns:1fr;gap:22px;padding:32px 0}.class-heading{display:flex;align-items:baseline;gap:10px}.class-heading h3{font-size:34px}.city-grid,.city-grid-six{grid-template-columns:repeat(2,minmax(120px,1fr))}.city-card{min-height:180px;padding:20px 12px 16px}.datasheet-preview{padding:54px 0 88px}.datasheet-preview-inner{grid-template-columns:1fr;gap:22px}.datasheet-product{min-height:330px}.datasheet-product span{width:250px;height:250px}.datasheet-product img{width:min(560px,112%);transform:none}}
@media(max-width:460px){.stage-position ol{gap:5px}.stage-position li strong{font-size:11px}.stage-position li span{width:48px;height:48px}.city-grid{grid-template-columns:1fr 1fr;gap:9px}.city-card img{width:72px;height:66px}.city-card h4{font-size:15px}}
@media(prefers-reduced-motion:reduce){.has-motion .mainfilter-hero .mainfilter-flow,.has-motion .mainfilter-hero-visual>span,.has-motion .mainfilter-hero-visual img{animation:none;opacity:1;clip-path:none;transform:none}.has-motion .city-world .class-group{opacity:1;transform:none;transition:none}.has-motion .city-world .city-heading-product img{opacity:1;transform:translateX(4%);transition:none}.city-card,.city-card:after{transition:none}.city-card:hover{transform:none}}