/* Only the mobile catalogue content; shared navigation/footer are not selected. */
.catalogue-mobile-preview { display: none; }
@media (max-width: 767px) {
  html.cm-scroll-locked, html.cm-scroll-locked body { overflow: hidden; overscroll-behavior: none; }
  [data-catalogue-main] { display: none; }
  .catalogue-mobile-preview { display: block; background: #fbfdff; color: #08244d; padding-bottom: 26px; }
  .catalogue-mobile-preview *, .cm-dialog * { box-sizing: border-box; }
  .catalogue-mobile-preview .cm-intro { padding: 8px 15px 8px; background: linear-gradient(90deg, #fbfdff 49%, rgb(246 251 255 / 74%) 85%, rgb(229 246 255 / 55%)), #f3faff url('../images/hero-refresh/catalogue-optics-640.webp') right center / auto 100% no-repeat; }
  .cm-eyebrow { margin: 0 0 6px; color: #087c82; font-size: 10px; font-weight: 750; line-height: 1.4; letter-spacing: .09em; text-transform: uppercase; }
  .cm-intro h1 { margin: 0; max-width: 390px; color: #071e49; font-size: clamp(22px, 5.7vw, 26px); line-height: 1.12; letter-spacing: -.045em; font-weight: 750; white-space: pre-line; }
  .cm-intro__description { margin: 6px 0 0; color: #344a66; font-size: 12px; line-height: 1.4; }
  .cm-container { padding: 0 15px; }
  .catalogue-mobile-preview .cm-banner { position: relative; overflow: hidden; padding: 8px 17px; border-radius: 14px; background: radial-gradient(ellipse at 105% -15%, #18a4ee, transparent 45%), linear-gradient(115deg, #052953 0%, #05438d 54%, #0069ec 100%); color: #fff; box-shadow: 0 8px 24px rgb(5 36 82 / 14%); }
  .cm-banner::before, .cm-dialog__surface::before {
    content: ''; position: absolute; top: -60px; right: -43px; width: 180px; height: 104px;
    border: 1.5px solid transparent; border-bottom-color: #ffdc52; border-left-color: #70ddd8;
    border-radius: 50%; transform: rotate(29deg); filter: drop-shadow(0 2px 3px rgb(255 206 66 / 32%)); pointer-events: none;
  }
  .cm-banner h2 { position: relative; margin: 0; max-width: 95%; color: #fff; font-size: clamp(19px, 5.1vw, 23px); font-weight: 750; line-height: 1.05; letter-spacing: -.035em; white-space: pre-line; }
  .cm-banner > p { margin: 3px 0 5px; color: #f0f6ff; font-size: 12px; line-height: 1.4; }
  .cm-download { position: relative; display: flex; min-height: 44px; align-items: center; justify-content: center; gap: 10px; padding: 8px 12px; border: 1px solid rgb(255 226 108 / 70%); border-radius: 8px; background: #ffd54f; color: #07234b; box-shadow: 0 4px 10px rgb(1 22 56 / 13%); font-family: inherit; font-size: clamp(12px, 3.55vw, 15px); font-weight: 750; line-height: 1.3; text-align: center; text-decoration: none; transition: transform .12s ease; }
  .cm-banner > .cm-download { width: fit-content; max-width: 100%; padding-inline: 14px; }
  .cm-download:hover, .cm-download:focus-visible { color: #07234b; background: #ffd54f; }
  .cm-download:active { transform: translateY(1px); }
  .cm-download > span { min-width: 0; }
  .cm-download > i:first-child { flex: 0 0 auto; font-size: 19px; }
  .cm-download > i:last-child:not(:first-child) { flex: 0 0 auto; margin-inline-start: 3px; }
  .cm-stores { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; column-gap: 17px; row-gap: 5px; margin-top: 5px; }
  .cm-stores > a { display: inline-flex; min-height: 23px; align-items: center; gap: 7px; color: #fff; font-size: 12px; line-height: 1.3; text-decoration: none; }
  .cm-stores > a > i { font-size: 19px; }
  .cm-stores > span { width: 1px; height: 15px; background: rgb(255 255 255 / 65%); }
  .catalogue-mobile-preview .cm-catalogue { margin-top: 15px; padding: 0; }
  .cm-catalogue > h2 { margin: 0 0 12px; color: #08244d; font-size: clamp(21px, 5.65vw, 26px); font-weight: 750; line-height: 1.16; letter-spacing: -.045em; }
  .cm-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin: 0 0 12px; }
  .cm-filters label { display: block; min-width: 0; margin: 0; }
  .cm-filters .cm-search { position: relative; grid-column: 1 / -1; }
  .cm-search > i { position: absolute; inset-inline-start: 13px; top: 17px; color: #6b7f95; font-size: 15px; pointer-events: none; }
  .cm-filters input[type='search'] { display: block; width: 100%; height: 50px; padding: 0 12px; padding-inline-start: 38px; border: 1px solid #cbd7e5; border-radius: 8px; background: #fff; color: #102e52; font-size: 16px; line-height: 1.4; }
  .cm-filters select { display: block; width: 100%; min-width: 0; height: 44px; padding-inline: 9px; border: 1px solid #cbd7e5; border-radius: 7px; background-color: #fff; color: #0b2950; font-size: 12px; font-weight: 600; line-height: 1.3; }
  .cm-filter-submit { display: flex; min-height: 44px; align-items: center; justify-content: center; gap: 8px; border: 1px solid #064397; border-radius: 7px; background: #073e9c; color: #fff; font-size: 13px; font-weight: 650; }
  .cm-reset[hidden] { display: none; }
  .cm-reset { grid-column: 1 / -1; justify-self: end; display: inline-flex; align-items: center; gap: 6px; min-height: 28px; color: #47617b; font-size: 11px; }
  .cm-count { margin: 0 0 9px; color: #5b6d82; font-size: 12px; line-height: 1.4; }
  .cm-count > strong { color: #092650; font-weight: 750; }
  .cm-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 10px; }
  .cm-product { display: flex; min-width: 0; flex-direction: column; overflow: hidden; border: 1px solid #438ed1; border-radius: 10px; background: #fff; }
  .cm-product__image { display: flex; align-items: center; justify-content: center; height: clamp(112px, 30vw, 160px); background: linear-gradient(140deg, #f3faff, #e7f4fd); }
  .cm-product__image picture { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 0; }
  .cm-product__image img { display: block; width: 100%; height: 100%; object-fit: contain; }
  .cm-product__body { flex: 1 1 auto; padding: 7px 9px 8px; }
  .cm-brand { text-transform: uppercase; display: inline-block; max-width: 100%; padding: 3px 6px; border-radius: 4px; background: #0755c5; color: #fff; font-size: 9px; font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
  .cm-product h3 { margin: 5px 0 4px; color: #092954; font-size: clamp(13px, 3.8vw, 18px); font-weight: 750; line-height: 1.15; letter-spacing: -.035em; overflow-wrap: break-word; }
  .cm-product h3 a { color: inherit; }
  .cm-product__category { display: flex; align-items: flex-start; gap: 5px; margin: 0; color: #0796b5; font-size: 10px; font-weight: 650; line-height: 1.3; }
  .cm-product__category .cm-icon { width: 14px; height: 14px; flex: 0 0 14px; }
  .cm-product__footer { display: flex; min-height: 39px; align-items: center; justify-content: space-between; gap: 5px; padding: 8px 9px; border-top: 1px solid #e5edf5; background: #fff; color: #0750ac; font-size: 11px; font-weight: 650; line-height: 1.3; }
  .cm-preview-count { margin: 14px 0 8px; color: #5a6e84; font-size: 12px; line-height: 1.4; }
  .cm-pagination { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
  .cm-pagination a, .cm-pagination > span { display: inline-flex; min-width: 36px; min-height: 40px; align-items: center; justify-content: center; gap: 8px; padding: 7px; border: 1px solid #cfdeed; border-radius: 6px; background: #fff; color: #0750ac; font-size: 12px; }
  .cm-pagination > span { background: #073e9c; color: #fff; }
  .cm-error { color: #953525; font-size: 13px; }
  .cm-error[hidden] { display: none; }
  .cm-empty { padding: 20px 0; }
  .cm-empty h3 { font-size: 18px; }
  .cm-empty p { font-size: 13px; }
  .cm-icon { display: inline-block; width: 24px; height: 24px; background: currentColor; -webkit-mask: var(--cm-icon) center / contain no-repeat; mask: var(--cm-icon) center / contain no-repeat; }
  .cm-icon--wrench { --cm-icon: url('../images/catalogue-mobile-preview/wrench.svg'); }
  .cm-icon--stethoscope { --cm-icon: url('../images/catalogue-mobile-preview/stethoscope.svg'); }
  .cm-icon--package { --cm-icon: url('../images/catalogue-mobile-preview/package.svg'); }
  .cm-icon--calendar-days { --cm-icon: url('../images/catalogue-mobile-preview/calendar-days.svg'); }
  .cm-icon--book-open { --cm-icon: url('../images/catalogue-mobile-preview/book-open.svg'); }
  .cm-dialog { position: fixed; inset: 0; width: calc(100% - 28px); max-width: 400px; max-height: calc(100dvh - 24px); height: fit-content; padding: 0; margin: auto; overflow: hidden; border: 1px solid rgb(255 255 255 / 85%); border-radius: 24px; background: #034caa; color: #fff; box-shadow: 0 14px 36px rgb(0 21 55 / 28%); }
  .cm-dialog::backdrop { background: rgb(4 32 73 / 53%); backdrop-filter: blur(1px); }
  .cm-dialog__surface { position: relative; overflow: auto; overscroll-behavior: contain; max-height: calc(100dvh - 26px); padding: 16px 18px 11px; background: radial-gradient(ellipse at 105% 90%, #0876ef 0%, transparent 62%), linear-gradient(120deg, #062a50 0%, #043b77 43%, #005ed8 100%); }
  .cm-dialog__surface::before { width: 194px; height: 116px; right: -43px; top: -48px; }
  .cm-dialog__close { border-radius: 8px; position: absolute; top: 9px; inset-inline-end: 10px; z-index: 2; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border: 0; background: transparent; color: #fff; font-size: 20px; }
  .cm-dialog__eyebrow { position: relative; margin: 0 35px 8px 0; color: #ffdc4e; font-size: 12px; font-weight: 750; line-height: 1.35; letter-spacing: .1em; }
  .cm-dialog h2:focus { outline: none !important; box-shadow: none !important; }
  .cm-dialog h2 { position: relative; margin: 0 0 9px; color: #fff; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(24px, 7.1vw, 30px); font-weight: 600; line-height: 1.02; letter-spacing: -.025em; white-space: pre-line; }
  .cm-dialog #cm-dialog-description { margin: 0 0 12px; color: #f0f6ff; font-size: 13px; line-height: 1.35; }
  .cm-features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .cm-feature { display: flex; min-height: 44px; align-items: center; gap: 9px; padding: 7px 10px; border: 1px solid rgb(255 255 255 / 24%); border-radius: 8px; background: rgb(171 213 255 / 13%); color: #fff; font-size: 12px; line-height: 1.15; white-space: pre-line; }
  .cm-feature .cm-icon { flex: 0 0 25px; width: 25px; height: 25px; color: #ffdc4e; }
  .cm-feature--resources { grid-column: 1 / -1; justify-content: center; min-height: 36px; }
  .cm-download--modal { margin-top: 11px; min-height: 44px; border-radius: 999px; font-size: clamp(12px, 3.7vw, 15px); }
  .cm-download--modal > i { font-size: 21px; }
  .cm-dialog .cm-stores { justify-content: center; margin-top: 5px; }
  .cm-dialog .cm-stores > a { min-height: 25px; font-size: 13px; }
  .cm-dialog .cm-stores > a > i { font-size: 21px; }
  .cm-dialog__stay { display: block; min-height: 28px; margin: 2px auto 0; padding: 3px; border: 0; background: transparent; color: #e4efff; font-size: 11px; line-height: 1.3; text-decoration: underline; text-underline-offset: 2px; }
  .cm-dialog .cm-dialog__close:focus { box-shadow: none !important; }
  .cm-dialog :is(a, button):focus-visible, .catalogue-mobile-preview :is(a, button, input, select):focus-visible { outline: 2px solid #ffdd53 !important; outline-offset: 2px; box-shadow: none !important; }
  .catalogue-mobile-preview[aria-busy='true'] .cm-filter-submit { opacity: .65; }
  [dir='rtl'] .cm-eyebrow, [dir='rtl'] .cm-dialog__eyebrow { letter-spacing: normal; }
  [dir='rtl'] .cm-dialog h2 { font-family: 'Times New Roman', 'ASEM Noto Sans Arabic', serif; font-size: clamp(22px, 6.6vw, 28px); line-height: 1.45; letter-spacing: normal; }
  [dir='rtl'] .cm-feature { font-size: 14px; line-height: 1.45; }
  [dir='rtl'] .catalogue-mobile-preview .fa-arrow-right { transform: rotate(180deg); }
  @media (min-width: 380px) {
    :is([lang='fr'], [lang='en']) .cm-filters { grid-template-columns: .95fr 1.24fr 1.1fr .82fr; gap: 6px; }
    :is([lang='fr'], [lang='en']) .cm-filters select { padding-inline: 6px 3px; font-size: 11px; }
  }
  @media (prefers-reduced-motion: reduce) { .cm-download { transition: none; } .cm-dialog::backdrop { backdrop-filter: none; } }
}