.mx-product-intro,.mx-gallery-nav,.mx-compare-grip,.mx-step-short{display:none}

@media(max-width:800px){
  .mx-product-intro{display:block;background:#fff;overflow:hidden}
  .mx-intro-photo{position:relative;aspect-ratio:16/8.5;overflow:hidden;background:#e6eef2}
  .mx-intro-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:66% center}
  .mx-product-intro--nok .mx-intro-photo img{object-position:right center}
  .mx-product-intro--upk .mx-intro-photo img{object-position:74% center}
  .mx-intro-flow{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;padding:24px 18px 26px;gap:14px;color:#1c2d48}
  .mx-intro-flow li{display:flex;position:relative;flex-direction:column;align-items:center;gap:10px;min-width:0;font-size:14px;line-height:1.5;text-align:center;font-weight:550}
  .mx-intro-flow li:before{content:"";position:absolute;left:calc(-50% - 7px);right:calc(50% + 25px);top:20px;height:1px;background:#b4cec8}
  .mx-intro-flow li:first-child:before{display:none}
  .mx-intro-flow img{position:relative;width:42px;height:42px;padding:10px;background:#e1f0e8;border:1px solid #bdd5c9;border-radius:4px}
  .mx-intro-flow li:nth-child(2) img{background:#e6edf9;border-color:#bccce6}
  .mx-intro-flow li:nth-child(3) img{background:#fcf1dc;border-color:#e3d2ab}
  .mx-product-intro.mx-entered .mx-intro-photo img{animation:mx-photo-settle 1.1s cubic-bezier(.2,.7,.2,1) both}
  .mx-product-intro.mx-entered li{animation:mx-flow-arrive .5s ease both}
  .mx-product-intro.mx-entered li:nth-child(2){animation-delay:.12s}
  .mx-product-intro.mx-entered li:nth-child(3){animation-delay:.24s}

  .cx-benefit{transition:background .2s,transform .2s}
  .cx-benefit:active{background:#edf5f2;transform:translateY(-2px)}
  .cx-benefit>img{box-shadow:0 4px 0 #c5dacf;transition:transform .25s,box-shadow .25s}
  .cx-benefit:active>img{transform:translateY(3px);box-shadow:0 1px 0 #c5dacf}
  .cx-benefit--1>img{box-shadow:0 4px 0 #c2cee3}
  .cx-benefit--2>img{box-shadow:0 4px 0 #e4d4b7}
  .cx-mobile-benefits{gap:10px;grid-auto-rows:100px;padding:0 0 24px}
  .cx-mobile-benefits button{min-height:54px;padding:12px 10px;border:1px solid #c8d9de;border-radius:4px;background:#f7fafb;transition:background .25s,border-color .25s,box-shadow .25s}
  .cx-mobile-benefits button[aria-pressed=true]{background:#e2f2eb;border-color:#168573;box-shadow:inset 3px 0 #168573}
  .cx-mobile-benefits button:active{background:#d8ebe4}
  .em-track{gap:10px;padding-bottom:20px}
  .em-track>button{background:#fff;border:1px solid #c2d7dc;border-radius:4px;min-height:52px;padding:9px 4px;justify-content:center;gap:6px;transition:background .25s,border-color .25s}
  .em-track>button[aria-pressed=true]{background:#dff1e8;border-color:#168573}
  .em-track .em-node{width:24px;height:24px;flex-basis:24px;font-size:11px;background:#fff}
  .em-track-line{bottom:7px}
  .mx-step-full{display:none}.mx-step-short{display:inline;text-decoration:none}
  .em-visual{touch-action:pan-y pinch-zoom;user-select:none}
  .em-journey--portfolio .em-visual{height:240px!important;gap:12px;margin-block:20px 24px}
  .em-journey--portfolio .em-files{height:205px}
  .em-journey--portfolio .em-document{filter:drop-shadow(0 6px 10px #1c2d4814)}
  .cx-step-navigation button{min-height:44px;background:#fff;border-color:#92b7bc}
  .cx-step-navigation [data-motion-next]{background:#168573;color:#fff;border-color:#168573}
  .cx-step-navigation [data-motion-next] img{filter:brightness(0) invert(1)}
  .cx-step-navigation button:active{transform:translateY(1px)}
  .cx-step-navigation>span{font-variant-numeric:tabular-nums}

  .cx-sample-view{position:relative;background:#dfe8ed;touch-action:pan-y pinch-zoom;user-select:none}
  .cx-sample-view>button{touch-action:pan-y pinch-zoom}
  .mx-gallery-nav{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:16px 0 6px}
  .mx-gallery-nav>button{display:grid;place-items:center;width:44px;height:44px;padding:10px;border:1px solid #9ebec5;border-radius:4px;background:#fff;cursor:pointer}
  .mx-gallery-nav>button:active{background:#e1f0e8}
  .mx-gallery-nav img{width:21px;height:21px}
  .mx-gallery-nav [data-mobile-gallery-prev] img{transform:rotate(180deg)}
  .mx-gallery-nav>span{color:#496673;font-size:14px;line-height:1.5;font-variant-numeric:tabular-nums}
  .cx-sample-tabs{margin-top:8px}
  .cx-sample-tabs button{min-height:44px}
  .cx-chat-head button{width:44px;height:44px;flex-basis:44px}
  .mx-gallery-nav button:focus-visible{outline:3px solid #245ab0;outline-offset:4px}

  .em-comparison{touch-action:pan-y pinch-zoom;cursor:ew-resize;user-select:none}
  .mx-compare-grip{display:flex;position:absolute;left:clamp(24px,var(--em-split),calc(100% - 24px));top:50%;align-items:center;justify-content:center;gap:0;width:44px;height:44px;transform:translate(-50%,-50%);border:1px solid #8caaa9;border-radius:50%;background:#fff;box-shadow:0 4px 18px #12263d33;pointer-events:none;z-index:2}
  .mx-compare-grip img{position:static;width:17px;height:17px;object-fit:contain}
  .mx-compare-grip img:first-child{transform:rotate(180deg)}
  .em-compare-control input{height:44px}
}

@media(max-width:540px){
  .cx-mobile-benefits{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:72px}
  .cx-mobile-benefits button{font-size:13px;line-height:1.45;padding:12px 9px}
  .em-track>button{font-size:13px}
  .em-track>button>span:last-child{overflow-wrap:normal}
}
@media(max-width:359px){
  .mx-intro-flow{gap:10px;padding-inline:14px}
  .mx-intro-flow li{font-size:13px}
  .em-track>button{gap:4px;padding-inline:1px}
  .em-track .em-node{width:21px;height:21px;flex-basis:21px}
}
@keyframes mx-photo-settle{from{transform:scale(1.055)}to{transform:scale(1)}}
@keyframes mx-flow-arrive{from{opacity:.25;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){
  .mx-product-intro *, .cx-benefit, .cx-benefit>img, .cx-mobile-benefits button, .em-track>button{animation:none!important;transition:none!important;transform:none!important}
}
