/* Small screens (≤ 760 px), 2026-10-08 (Raffaele: simplify the site on smartphones).
   1. One compact top bar on every header: logo, Store, Menu. The inline link row, "Talk with us" and the
      old toggle step aside; the full-screen menu (assets/js/mobile.js) holds every link.
   2. The cookie banner as a compact strip: Accept and Deny side by side with the same weight.
   Loaded after every other stylesheet; wider screens are untouched. */

.oqm-burger{display:none}
.oqm-sheet[hidden]{display:none!important}

@media (max-width:760px){
  /* ---------- 1. Top bar ---------- */
  .header .desktop-nav,.header .header-contact,.header .menu-toggle,.header .oqm-panel,.header .mobile-nav,
  .oq-bar nav,.oq-bar .oqm-panel,.oq-bar__talk{display:none!important}
  .header{flex-wrap:nowrap!important;row-gap:0!important;align-items:center!important;padding-top:14px!important;padding-bottom:14px!important}
  .header .wordmark{flex:0 1 auto;min-width:0}
  .header .wordmark img,.oq-mast .header .wordmark img{height:34px!important;width:auto}
  .header .header-store{margin-left:auto!important;padding:9px 13px!important;font-size:13px!important;gap:8px!important}
  .oq-bar{gap:12px!important}
  .oq-bar__store{margin-left:auto!important}

  .oqm-burger{display:inline-flex;align-items:center;gap:10px;flex-shrink:0;min-height:44px;margin:0 -6px 0 6px;padding:0 6px;
    background:none;border:0;color:inherit;font:500 13px/1 Manrope,Arial,sans-serif;letter-spacing:.01em;cursor:pointer}
  .header .oqm-burger{color:#edf1ec}
  .oqm-burger__icon{position:relative;display:block;width:20px;height:12px}
  .oqm-burger__icon i{position:absolute;left:0;right:0;height:1.5px;background:currentColor;border-radius:1px}
  .oqm-burger__icon i:first-child{top:2px}
  .oqm-burger__icon i:last-child{bottom:2px}
  .oqm-burger:focus-visible{outline:2px solid #b9e9fb;outline-offset:2px}
  /* Light headers (Devices on paper, the fixed bar over paper). */
  .dv-light .header .oqm-burger{color:var(--dv-ink,#101820)}

  /* ---------- Full-screen menu ---------- */
  html.oqm-locked,html.oqm-locked body{overflow:hidden!important}
  .oqm-sheet{position:fixed;inset:0;z-index:100000;display:flex;flex-direction:column;background:#10191e;color:#edf1ec;
    font-family:Manrope,Arial,sans-serif;opacity:0;transform:translateY(-10px);transition:opacity .2s ease,transform .2s ease}
  .oqm-sheet.is-open{opacity:1;transform:none}
  .oqm-sheet a{color:inherit;text-decoration:none}
  .oqm-sheet__top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 5.5%;border-bottom:1px solid #adc4c72c}
  .oqm-sheet__logo img{display:block;height:34px;width:auto}
  .oqm-sheet__close{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 6px;margin-right:-6px;background:none;border:0;color:#edf1ec;font:500 13px/1 Manrope,Arial,sans-serif;cursor:pointer}
  .oqm-sheet__close span{font-size:24px;line-height:1;font-weight:300}
  .oqm-sheet__close:focus-visible,.oqm-sheet a:focus-visible{outline:2px solid #b9e9fb;outline-offset:2px}
  .oqm-sheet__body{flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:6px 5.5% 24px}
  .oqm-s{padding:18px 0 16px;border-bottom:1px solid #adc4c722}
  .oqm-s:last-child{border-bottom:0}
  .oqm-s__h{margin:0 0 10px;font:500 11px/1.4 'IBM Plex Mono',ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:#9fbac0}
  .oqm-s__group+.oqm-s__group{margin-top:12px}
  .oqm-s__sub{display:block;margin-bottom:2px;font-size:12px;color:#8fa9af}
  .oqm-s__grid{display:grid;grid-template-columns:1fr 1fr;column-gap:20px}
  .oqm-s__dev{display:flex;align-items:center;min-height:44px;font-size:16px;font-weight:500;line-height:1.25;border-bottom:1px solid #adc4c714}
  .oqm-s__small{font-size:14px;color:#c9d9d9}
  .oqm-s__more{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-top:6px;font:500 12px/1.4 'IBM Plex Mono',ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:#b9e9fb!important}
  .oqm-s__main{display:grid;grid-template-columns:1fr 1fr;column-gap:20px}
  .oqm-s__big{display:flex;align-items:center;min-height:52px;font-size:22px;font-weight:400;letter-spacing:-.02em;border-bottom:1px solid #adc4c714}
  .oqm-sheet a[aria-current]{color:#b9e9fb}
  .oqm-sheet__cta{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px 5.5% calc(12px + env(safe-area-inset-bottom));border-top:1px solid #adc4c72c;background:#0c1418}
  .oqm-sheet__cta a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;font-size:14px;font-weight:600}
  .oqm-sheet__store{background:#edf1ec;color:#10191e!important}
  .oqm-sheet__talk{border:1px solid #d5eaf370}
  @media (prefers-reduced-motion:reduce){.oqm-sheet{transition:none;transform:none}}

}

/* ---------- 2. Cookie banner: a compact strip, phones and tablets (≤ 1100 px) ---------- */
@media (max-width:1100px){
  .cmplz-cookiebanner.cmplz-show:not(.cmplz-categories-visible){left:8px!important;right:8px!important;bottom:8px!important;width:auto!important;max-width:none!important;
    padding:14px 16px 10px!important;grid-gap:8px!important;gap:8px!important}
  .cmplz-cookiebanner:not(.cmplz-categories-visible) .cmplz-header{display:none!important}
  .cmplz-cookiebanner:not(.cmplz-categories-visible) .cmplz-divider{display:none!important}
  .cmplz-cookiebanner:not(.cmplz-categories-visible) .cmplz-message,.cmplz-cookiebanner:not(.cmplz-categories-visible) .cmplz-message *{font-size:12px!important;line-height:1.5!important;margin:0!important}
  .cmplz-cookiebanner:not(.cmplz-categories-visible) .cmplz-buttons{display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important;margin:0!important}
  .cmplz-cookiebanner:not(.cmplz-categories-visible) .cmplz-buttons .cmplz-btn{width:auto!important;height:44px!important;min-height:44px;margin:0!important;padding:0 8px!important;font-size:14px!important}
  /* Accept and Deny: same look, side by side; "View preferences" becomes a text link under them. */
  .cmplz-cookiebanner:not(.cmplz-categories-visible) :is(.cmplz-btn.cmplz-accept,.cmplz-btn.cmplz-deny){background:#132830!important;color:#fff!important;border:1px solid #132830!important}
  .openqcm-site .cmplz-cookiebanner:not(.cmplz-categories-visible) :is(.cmplz-btn.cmplz-accept,.cmplz-btn.cmplz-deny){background:#edf1ec!important;color:#10191e!important;border-color:#edf1ec!important}
  .cmplz-cookiebanner:not(.cmplz-categories-visible) .cmplz-btn.cmplz-view-preferences{grid-column:1/-1;order:3;height:32px!important;min-height:32px;border:0!important;background:none!important;text-decoration:underline;text-underline-offset:3px;font-size:13px!important}
  .cmplz-cookiebanner:not(.cmplz-categories-visible) .cmplz-links{margin:0!important}
  .cmplz-cookiebanner:not(.cmplz-categories-visible) .cmplz-links .cmplz-link{font-size:12px!important}
}
@media (min-width:761px) and (max-width:1100px){
  .cmplz-cookiebanner.cmplz-show:not(.cmplz-categories-visible){left:16px!important;right:auto!important;bottom:16px!important;width:min(560px,calc(100% - 32px))!important}
}

/* Devices on paper (?light=1): the Store button in ink, readable on the light cover at every width. */
.dv-light .header .header-store{background:#132830;border-color:#132830;color:#edf1ec!important}

/* ---------- Shorter pages: swipe strips and folds (assets/js/mobile.js), 2026-10-08 ---------- */
.m-swipe-nav,.m-fold-btn{display:none}
@media (max-width:760px){
  .m-folded{display:none!important}
  .m-fold-btn{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:48px;margin:18px 0 0;padding:12px 0;
    background:none;border:0;border-top:1px solid currentColor;border-bottom:1px solid currentColor;border-color:color-mix(in srgb,currentColor 22%,transparent);
    color:inherit;font-size:12px!important;letter-spacing:.1em;text-transform:uppercase;text-align:left;cursor:pointer}
  .m-fold-btn+.m-fold{margin-top:16px!important}
  .m-fold-sign{font:300 22px/1 Manrope,Arial,sans-serif;letter-spacing:0}
  .m-fold-btn:focus-visible{outline:2px solid #0885B2;outline-offset:2px}

  /* Home: tighter instrument cards. */
  #instruments .oi-photo{aspect-ratio:16/10}
}

/* ---------- Long lists: FAQ and Papers (assets/js/mobile.js), 2026-10-08 ---------- */
.m-more-btn{display:none}
@media (max-width:760px){
  .m-cut{display:none!important}
  .m-more-btn:not([hidden]){display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 8px;width:100%;min-height:48px;margin:14px 0 6px;padding:10px 14px;
    background:none;border:1px solid currentColor;border-color:color-mix(in srgb,currentColor 35%,transparent);color:inherit;
    font-size:12px!important;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
  .m-more-btn:focus-visible{outline:2px solid #0885B2;outline-offset:2px}
  .m-more-of{opacity:.7}

  /* Filter chips in one row that scrolls sideways. */
  :is(.ag-faq__instruments,.ag-faq__filters,.oqcm-pub__instruments){display:flex!important;flex-wrap:nowrap!important;gap:8px!important;overflow-x:auto;scrollbar-width:none;
    margin-left:-6%!important;margin-right:-6%!important;padding:2px 6% 6px!important;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 90%,transparent)}
  :is(.ag-faq__instruments,.ag-faq__filters,.oqcm-pub__instruments)::-webkit-scrollbar{display:none}
  :is(.ag-faq__instruments,.ag-faq__filters,.oqcm-pub__instruments)>*{flex:0 0 auto!important;white-space:nowrap;margin:0!important}

  /* FAQ: the index of topics in the cover is the same list as the chips. */
  .oq-topics a{padding:8px 0!important}
  .oq-topics a em{font-size:20px!important}

  /* Papers: filters two by two, records tighter. */
  .oqcm-pub__toolbar{display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important}
  .oqcm-pub__toolbar>*{min-width:0;width:auto!important;margin:0!important}
  .oqcm-pub__toolbar>:first-child,.oqcm-pub__toolbar>:last-child{grid-column:1/-1}
  .oqcm-pub__toolbar select{width:100%;min-height:44px;font-size:14px}
  .oqcm-paper{padding-top:18px!important;padding-bottom:18px!important}
  .oqcm-paper__cover{display:none!important}
  .oqcm-paper__badges{margin-bottom:8px!important}
  .oqcm-paper__title{font-size:20px!important;line-height:1.25!important}
  .oqcm-paper__actions{margin-top:10px!important}
}

/* Home hero, "Go to the store" line: it wraps inside its panel instead of running out of it (it was cut at 768 px),
   and reaches the 11 px minimum of the research readability rules. */
.hero-offer-store{width:auto!important;max-width:100%;font-size:11px!important;line-height:1.6}

/* ---------- FAQ questions and the colophon, tighter on phones (2026-10-08) ---------- */
@media (max-width:760px){
  .ag-faq__item summary{padding:16px 0!important;gap:12px!important;font-size:16px!important}
  .ag-faq__item summary .ag-faq__qmain{gap:6px!important}
  .openqcm-site .ag-faq__q,.ag-faq__q{font-size:16px!important;line-height:1.4!important}
  .ag-faq__permalink{display:none!important}
  .ag-faq__item summary::after{font-size:22px!important}
  .ag-faq__a{padding:0 0 20px!important}

  /* Colophon: the same links in less height. */
  .oq-colophon{gap:22px 20px!important;padding:44px 6% 30px!important}
  .oq-colophon__lead p{font-size:26px!important}
  .oq-colophon .mono{margin-bottom:10px!important}
  .oq-colophon__col a{padding:9px 0!important;font-size:14px!important;line-height:1.3}
  .oq-legal{grid-template-columns:1fr 1fr!important;gap:18px 20px!important;padding-top:24px!important;margin-top:4px!important}
  .oq-legal p{font-size:13px!important;line-height:1.55!important;overflow-wrap:anywhere}
  .oq-colophon__imprint{margin-top:10px!important;line-height:1.7}
}

/* ---------- Galleries (sheet.js "bench"): on phones the contact sheet instead of the scroll bench ----------
   The bench pins one plate per screen of scroll (17 plates ≈ 11 screens, photos small in a tall stage).
   The contact sheet already in the page shows them two by two; a tap opens the full-screen viewer (swipe, arrows). */
@media (max-width:760px){
  .has-bench .sh-imm{display:none!important}
  .has-bench .sh-gal-title,.has-bench .sh-chapter{display:block!important}
  .has-bench .sh-gal-toc{display:flex!important;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:18px;font-size:12px!important;position:sticky;top:124px;z-index:3}
  .has-bench .sh-gal-toc::-webkit-scrollbar{display:none}
  .has-bench .sh-gal-toc a{flex:none;padding:6px 0}
  .sh-chapter{padding:28px 0 6px!important;scroll-margin-top:190px!important}
  .sh-gal{display:grid!important;grid-template-columns:1fr 1fr;gap:12px 10px!important}
  .sh-gal::after{display:none!important}
  .sh-gal li{max-width:none!important;min-width:0}
  .sh-gal p{font-size:12.5px!important;line-height:1.4!important}
  .sh-gal p .mono{font-size:11px!important}
}

/* FAQ and Papers paging also on tablets (≤ 1100 px): at 768 px the FAQ was 48 screens, Papers 81. */
@media (max-width:1100px){
  .m-pcut{display:none!important}
  .m-more-btn--wide:not([hidden]){display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 8px;width:100%;min-height:48px;margin:14px 0 6px;padding:10px 14px;
    background:none;border:1px solid currentColor;border-color:color-mix(in srgb,currentColor 35%,transparent);color:inherit;
    font-size:12px!important;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
  .m-more-btn--wide:focus-visible{outline:2px solid #0885B2;outline-offset:2px}
}
@media (min-width:761px) and (max-width:1100px){.m-more-btn--wide:not([hidden]){width:auto;margin-left:auto;margin-right:auto;padding:10px 28px}}

/* ---------- Readability floor on phones: no text under 11 px (research readability rules, 2026-10-04) ----------
   The mono labels below are sized in em/rem and fell to 8–10.6 px at 390 px (audit 2026-10-08, 52 pages). */
@media (max-width:760px){
  :is(.sh-folio,.sh-ds-head,.sh-cart dt,.sh-note .mono,.sh-eyebrow,.sh-ovt th,.sh-spec-group h3,.sh-pager .mono,.sh-pager-set a,
      .sh-plate figcaption,.sh-legend li,.sh-cards article>.mono,.sh-copybtn,
      .ab-stop .mono,.ab-chips li,.ab-readout,.model-subtitle,.ag-explore__kicker,
      .dv-thermal-inline,.bp-trace-caption,.bp-thermal,
      .hero-offer-news .mono,.oi-facts dt,.ok-part dt,.oe-study-meta,.oe-study dt,.oe-ref a.mono,.oe-institutions>.mono,.hg__voice-nav .mono,.ot-door>.mono,.ot-door dt,
      .ag-hero-gallery-btn__label),
  :is(.sh-folio,.sh-ds-head,.sh-pager-set,.sh-plate figcaption,.ab-chips li,.ab-readout,.dv-thermal-inline,.bp-trace-caption,.oe-study-meta,.oe-ref a.mono,.hero-offer-news .mono) *{font-size:11px!important}

  /* Small links get a full touch target (44 px), without changing how they look. */
  :is(a.back-top,a.line-link,.sh-pager-set a,.oqcm-topic,a.oq-nb-read,.oqcm-act){display:inline-flex!important;align-items:center;min-height:44px}
  .oq-bar__logo{display:flex!important;align-items:center;min-height:44px}
}

/* Customers: the closed country rows of the directory in less height (84 → about 56 px each, 56 countries). */
@media (max-width:760px){
  .ca-root .directory .country{padding:10px 0 4px!important}
  .ca-root .directory .country>h3{font-size:23px!important;padding-bottom:4px!important}
}

/* Journal folio: one line on phones (chapter number and name); the "openQCM / page" path repeated the title on a second column. */
@media (max-width:760px){
  .oq-folio>span:not(:first-child){display:none!important}
  .oq-folio>span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* ---------- Home as a table of contents on phones (assets/js/mobile.js, homeChapters) ---------- */
.m-chap-btn{display:none}
.m-offer-btn{display:none}
@media (max-width:760px){
  .m-chap{display:none!important}
  .m-chap-btn{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:52px;margin:22px 0 0;padding:0 18px;
    background:none;border:1px solid currentColor;border-color:color-mix(in srgb,currentColor 40%,transparent);color:inherit;
    font:600 15px/1.3 Manrope,Arial,sans-serif;text-align:left;cursor:pointer}
  .m-chap-btn[aria-expanded="true"]{margin-bottom:28px;font-weight:500;font-size:13px;opacity:.85}
  .m-chap-sign{font:300 24px/1 Manrope,Arial,sans-serif}
  .m-chap-btn:focus-visible{outline:2px solid #0885B2;outline-offset:2px}
  section.m-chap-closed{padding-bottom:44px!important;min-height:0!important}
  section.m-chap-closed :is(.oi-head,.ok-head,.op-head,.oe-head,.ot-head){margin-bottom:0!important}

  /* Home hero: the animation holds the whole first screen; the offer panel opens with its button (mobile.js, heroOffer);
     the QCM trace is drawn between the title and the button (heroTrace). */
  .hero-offer-layout .hero-composition{min-height:calc(100svh - 72px);padding-bottom:24px!important;box-sizing:border-box}
  /* The title block fills the first screen down to the button, open or closed (12 px top padding, 24 px bottom, 54 px button). */
  .hero-offer-layout h1{min-height:calc(100svh - 72px - 12px - 24px - 54px);box-sizing:border-box}
  .hero-offer-layout:not(.m-offer-open) .hero-offer{display:none!important}
  .hero-offer-layout .hero-offer{order:3!important;margin:18px -6% -24px!important}
  .hero-offer-layout .hero-offer{scroll-margin-top:76px}
  /* The film's pause button (WCAG 2.2.2) sits just above the offer button, not under it. */
  .hero-offer-layout .motion-control{bottom:auto!important;top:calc(100svh - 72px - 24px - 54px - 47px)!important;left:6%!important;right:auto!important;z-index:6}
  .m-offer-btn{order:2;display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:54px;margin-top:0;padding:0 18px;
    background:rgba(6,11,14,.5);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid #d5eaf370;color:#edf1ec;
    font:600 15px/1.3 Manrope,Arial,sans-serif;text-align:left;cursor:pointer;position:relative;z-index:6}
  .m-offer-sign{font:300 24px/1 Manrope,Arial,sans-serif}
  .m-offer-btn:focus-visible{outline:2px solid #b9e9fb;outline-offset:2px}
  .hero .hero-thread{top:var(--m-trace-top,300px)!important;height:var(--m-trace-h,500px)!important;transform:none!important;bottom:auto!important}
  .hero .transition-caption{display:none!important}
}

/* ---------- Swipe strips: one card at a time, centred, phones and tablets (≤ 1100 px), 2026-10-08 ----------
   Raffaele: one per section, centred, and it must be clear that it swipes. mobile.js sets --m-card (row width
   minus a 20 px margin each side, at most 560 px); the side padding centres the card and lets the next one peek. */
@media (max-width:1100px){
  .m-swipe{display:flex!important;grid-template-columns:none!important;flex-wrap:nowrap!important;align-items:stretch;gap:12px!important;
    overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;
    margin-left:0!important;margin-right:0!important;padding:4px calc((var(--m-row,100%) - var(--m-card,86%)) / 2) 8px!important;
    scroll-padding:0 calc((var(--m-row,100%) - var(--m-card,86%)) / 2);box-sizing:border-box;max-width:none!important}
  .m-swipe::-webkit-scrollbar{display:none}
  .m-swipe>*{flex:0 0 var(--m-card,86%)!important;width:auto!important;max-width:none!important;min-width:0;margin:0!important;
    scroll-snap-align:center;scroll-snap-stop:always;box-sizing:border-box;transition:opacity .3s}
  .m-swipe>:not(.is-current){opacity:.45}
  .m-swipe:focus-visible{outline:2px solid #0885B2;outline-offset:4px}
  .m-swipe-nav{display:flex;align-items:center;justify-content:center;gap:16px;margin:4px auto 14px;color:inherit}
  .m-swipe-nav button{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:1px solid currentColor;border-radius:50%;background:none;color:inherit;font-size:18px;cursor:pointer}
  .m-swipe-nav button:disabled{opacity:.25;cursor:default}
  .m-swipe-nav button:focus-visible{outline:2px solid #0885B2;outline-offset:2px}
  .m-swipe-mid{display:grid;justify-items:center;gap:6px;min-width:110px}
  .m-swipe-dots{display:flex;gap:7px}
  .m-swipe-dots i{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.25;transition:opacity .2s,transform .2s}
  .m-swipe-dots i.is-on{opacity:.95;transform:scale(1.25)}
  .m-swipe-count{font-size:11px!important;letter-spacing:.12em;text-transform:uppercase;opacity:.8}
  @media (prefers-reduced-motion:reduce){.m-swipe>*{transition:none}}
}

/* A closed home chapter hides its strips too: the strip rule above is later and as strong, so this one is more specific. */
@media (max-width:760px){ .m-chap.m-chap.m-chap{display:none!important} }