/* Phone/tablet enhancement. Desktop and the pinned source assets stay intact.
 * Keep this media query in sync with mobile-tablet-v1.js and its contract test.
 * !important is intentional where the approved document has pinned overrides.
 */
.fw-mobile-contents, .fw-mobile-menu-head { display: none; }
@media (max-width: 1199px), (max-width: 1366px) and (hover: none) and (pointer: coarse) {
  html[data-fw-mobile] {
    --fw-mobile-header: 68px;
    --fw-mobile-gutter: clamp(16px, 3vw, 28px);
    scroll-padding-top: calc(var(--fw-mobile-header) + 64px);
  }
  html[data-fw-mobile] body { -webkit-text-size-adjust: 100%; overflow-x: clip; }
  html[data-fw-mobile] :is(button, summary, [role="tab"], .fw17-btn, .ref-button) { touch-action: manipulation; }
  html[data-fw-mobile] :is(button, summary, a, input, select, textarea):focus-visible {
    outline: 2px solid #245dca; outline-offset: 3px;
  }
  html[data-fw-mobile] :is(main, .ref-container, .fw17-container, .fw191-container) { min-width: 0; }
  html[data-fw-mobile] main :is(h1, h2, h3, p, li) { overflow-wrap: break-word; }
  /* Long approved German headings must contribute a shrinkable min-content size. */
  html[data-fw-mobile] .centered-page-hero__title { min-width: 0; max-width: 100%; overflow-wrap: anywhere; hyphens: auto; }
  html[data-fw-mobile] main :is(.fw193-section-target, section[id], h2[id], h3[id]) {
    scroll-margin-top: 12px; /* header offset is already provided by scroll-padding */
  }

  /* One breakpoint for navigation, including large touch-only tablets. */
  html[data-fw-mobile] .navbar { background: #fff !important; }
  html[data-fw-mobile] .navbar-inner {
    display: flex !important; justify-content: space-between; gap: 12px !important;
    min-height: 68px; padding-inline: max(var(--fw-mobile-gutter), env(safe-area-inset-left)) max(var(--fw-mobile-gutter), env(safe-area-inset-right));
  }
  html[data-fw-mobile] .navbar-nav { display: none !important; }
  html[data-fw-mobile] .navbar-actions { margin-left: auto; flex: none; }
  html[data-fw-mobile] .navbar-mobile-toggle { display: grid !important; width: 44px; height: 44px; flex: none; }
  html[data-fw-mobile] .navbar-quick, html[data-fw-mobile] .navbar-cta { display: none !important; }
  html[data-fw-mobile] .fw193-egg-toggle { min-width: 44px !important; min-height: 44px !important; }

  /* The menu is a full viewport sheet, not a long page beneath a fixed header. */
  html[data-fw-mobile] #mobile-navigation:not([hidden]) {
    display: block !important; position: fixed !important; inset: 0 !important;
    z-index: 1000 !important; width: 100%; height: 100vh; height: 100dvh;
    overflow: auto; overscroll-behavior: contain; background: #fff;
    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
    box-sizing: border-box; transform: none !important;
  }
  html[data-fw-mobile] #mobile-navigation[hidden] { display: none !important; }
  html[data-fw-mobile] .mobile-menu__inner {
    display: block; width: min(100% - 32px, 720px); min-height: 100%; margin-inline: auto; padding: 0 0 24px;
  }
  html[data-fw-mobile] .fw-mobile-menu-head {
    display: flex; position: sticky; top: 0; z-index: 3; align-items: center; justify-content: space-between;
    gap: 16px; min-height: 68px; padding-block: 10px; background: #fff; border-bottom: 1px solid #dbe5f3;
  }
  html[data-fw-mobile] .fw-mobile-menu-head strong { font-size: 18px; color: #17375f; }
  html[data-fw-mobile] .fw-mobile-menu-head button {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 44px; padding: 8px 12px; border: 1px solid #cbdcf4; border-radius: 12px;
    background: #f7faff; color: #245dca; font: inherit; font-size: 14px; cursor: pointer;
  }
  html[data-fw-mobile] .mobile-menu__quick { margin-block: 16px 10px; }
  html[data-fw-mobile] .mobile-menu__list { gap: 4px; }
  html[data-fw-mobile] .mobile-menu__link { min-height: 48px; font-size: 16px; }
  html[data-fw-mobile] .mobile-menu__body a {
    min-height: 44px !important; display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px;
    padding-block: 10px !important; font-size: 14px !important; line-height: 1.45;
    overflow-wrap: anywhere;
  }
  html[data-fw-mobile] .mobile-menu__body a small { margin-left: auto; font-size: 11px; }
  html[data-fw-mobile] .fw19-mobile-offers .mobile-menu__sublink { flex-wrap: wrap; }
  html[data-fw-mobile] .fw191-mobile-product summary { min-height: 44px; padding-block: 12px; font-size: 14px; }
  html[data-fw-mobile] .mobile-menu__cta-wrap { position: static !important; margin-top: 18px; padding: 0 !important; }
  html[data-fw-mobile][data-mobile-menu-open] :is(.fw193-section-nav, .fw-sticky, #scroll-to-top) { visibility: hidden !important; }

  /* A native disclosure replaces floating dots without losing a single link. */
  html[data-fw-mobile] [data-fw-mobile-contents-source] { display: none !important; }
  html[data-fw-mobile] .fw-mobile-contents {
    display: block; position: sticky; top: var(--fw-mobile-header); z-index: 43;
    margin: 0; width: 100%; background: #fff; border-bottom: 1px solid #dbe5f3;
    color: #214975; font-size: 14px;
  }
  html[data-fw-mobile] .fw-mobile-contents > summary {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    min-height: 48px; padding: 8px var(--fw-mobile-gutter); cursor: pointer; list-style: none;
  }
  html[data-fw-mobile] .fw-mobile-contents > summary::-webkit-details-marker { display: none; }
  html[data-fw-mobile] .fw-mobile-contents > summary::after { content: '+'; font-size: 23px; line-height: 1; font-weight: 400; }
  html[data-fw-mobile] .fw-mobile-contents[open] > summary::after { content: '−'; }
  html[data-fw-mobile] .fw-mobile-contents > summary small { margin-left: auto; font-size: 12px; color: #617590; }
  html[data-fw-mobile] .fw-mobile-contents > nav {
    position: absolute; top: 100%; inset-inline: 0;
    max-height: min(60vh, 480px); max-height: min(60dvh, calc(100dvh - var(--fw-mobile-header) - 70px));
    overflow: auto; overscroll-behavior: contain; padding: 10px var(--fw-mobile-gutter) 16px;
    background: #fff; border-bottom: 1px solid #cbdcf4; box-shadow: 0 18px 24px #15366214;
  }
  html[data-fw-mobile] .fw-mobile-contents-group {
    display: block; grid-column: 1 / -1; padding: 12px 12px 6px; color: #617590;
    font-size: 11px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase;
  }
  html[data-fw-mobile] .fw-mobile-contents a {
    display: flex; align-items: center; min-height: 44px; padding: 10px 12px;
    border-radius: 8px; text-decoration: none; color: #385d86; white-space: normal; overflow-wrap: anywhere;
  }
  html[data-fw-mobile] .fw-mobile-contents a[aria-current] { background: #edf4ff; color: #245dca; font-weight: 650; }

  /* 44px controls; content does not shrink with its surrounding layout. */
  html[data-fw-mobile] main :is(button, .fw17-btn, .fw17-link, .fw193-pillar a, .fw193-aos-file) { min-height: 44px !important; }
  html[data-fw-mobile] main button:empty { min-width: 44px !important; }
  html[data-fw-mobile] :is(.fw193-carousel-controls button, .a-strip-arrow, .contact-scheduler__icon-button) { min-width: 44px !important; min-height: 44px !important; }
  html[data-fw-mobile] [data-aos-pop-close] { min-height: 44px !important; font-size: 13px !important; }
  html[data-fw-mobile] .fw193-aos-pop > header small { font-size: 12px; }
  html[data-fw-mobile] [data-aos-pop-body] { overflow-x: auto; }
  html[data-fw-mobile] .fw193-aos-pop [data-aos-pop-flow] > small { font-size: 12px; }
  html[data-fw-mobile] .fw193-aos-program-flow span { font-size: 11px; }
  html[data-fw-mobile] main :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
    font-size: 16px !important; max-width: 100%; min-width: 0;
  }
  html[data-fw-mobile] main :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select) { min-height: 48px; }
  html[data-fw-mobile] :is(.contact-scheduler__tabs, .contact-scheduler__stepper) { min-width: 0; }
  html[data-fw-mobile] .contact-scheduler__tab { white-space: normal; line-height: 1.35; }
  html[data-fw-mobile] .contact-scheduler__step { min-width: 0; }
  html[data-fw-mobile] .contact-scheduler__step > strong { font-size: 12px !important; white-space: normal !important; }
  html[data-fw-mobile] [data-scheduler-day] { min-height: 44px !important; }
  html[data-fw-mobile] .contact-scheduler__selection { min-width: 0; }
  html[data-fw-mobile] .contact-scheduler__selection :is(strong, span) { overflow-wrap: anywhere; }
  html[data-fw-mobile] .fw193-pillar { padding: clamp(16px, 2.2vw, 22px); }
  html[data-fw-mobile] .fw193-pillar-top { margin-bottom: 10px; }
  html[data-fw-mobile] .fw193-pillar-icon { width: 38px; height: 38px; }
  html[data-fw-mobile] .fw193-pillar-icon svg { width: 24px; height: 24px; }
  html[data-fw-mobile] .fw193-pillar h3 { font-size: 20px !important; }
  html[data-fw-mobile] .fw193-pillar p { margin-bottom: 10px !important; }
  html[data-fw-mobile] .fw17-offer-card { min-width: 0; }
  html[data-fw-mobile] .fw17-offer-card .fw17-tabs--small { position: static !important; align-self: flex-start; width: max-content; margin: 0 0 12px !important; }
  html[data-fw-mobile] .fw17-offer-grid--additional .fw193-special { position: static !important; max-width: 100%; white-space: normal; }
  html[data-fw-mobile] .fw17-offer-grid--additional .fw17-offer-card:has(.fw193-special) > .fw19-category { max-width: 100% !important; }

  /* Touch-friendly rails: all cards remain scrollable; no hover dependency. */
  html[data-fw-mobile] .fw193-carousel { scroll-snap-type: x proximity; scroll-padding-inline: 4px; }
  html[data-fw-mobile] .fw193-carousel > * { scroll-snap-align: start; }
  html[data-fw-mobile] :is(.fw193-carousel, .fw191-ribbon, .a-choices, .fw193-aos-flow-explainer) {
    overscroll-behavior-x: contain; scrollbar-width: thin;
  }
  html[data-fw-mobile] [data-fw191-ribbon][data-paused="true"] .fw191-ribbon-track { transform: none !important; }
  html[data-fw-mobile] .fw191-ribbon { overflow-x: auto !important; mask-image: none !important; }
  html[data-fw-mobile] .fw191-app-logo { min-height: 44px !important; }

  /* Source/output previews become anchored sheets, never tiny hover windows. */
  html[data-fw-mobile] :is(.fw191-demo .a-inspector[popover], .fw193-aos-pop) {
    position: fixed !important; inset: auto 12px max(12px, env(safe-area-inset-bottom)) !important;
    width: min(640px, calc(100vw - 24px)) !important; max-width: calc(100vw - 24px) !important;
    margin-inline: auto !important; transform: none !important;
    max-height: calc(100dvh - env(safe-area-inset-top) - 24px) !important;
    overflow: auto; overscroll-behavior: contain;
  }
  html[data-fw-mobile] .fw191-demo .a-inspector-head { gap: 8px !important; }
  html[data-fw-mobile] .fw191-demo .a-inspector-head > div { min-width: 0; }
  html[data-fw-mobile] .fw191-demo [data-a-inspector-close] { flex: none; min-height: 44px !important; font-size: 13px !important; }
  html[data-fw-mobile] .fw191-demo .a-inspector [data-a-inspector-body] { overflow-x: auto; }
  html[data-fw-mobile] :is(.fw191-demo, .fw193-aos-pop) .a-mini-app { min-width: 580px; }
  html[data-fw-mobile] .fw191-demo :is(.a-skip, .a-steps-popup, .a-reset-near, .a-board-task button) { font-size: 12px !important; }
  html[data-fw-mobile] .fw191-demo .a-controls { gap: 6px !important; }
  html[data-fw-mobile] .fw191-demo .a-source { min-height: 56px !important; }
  html[data-fw-mobile] .fw191-demo .a-source-text strong { font-size: 12px !important; }
  html[data-fw-mobile] #scroll-to-top { width: 44px !important; height: 44px !important; }
  html[data-fw-mobile] #fw-toast-region { max-width: calc(100vw - 32px); right: 16px; bottom: calc(80px + env(safe-area-inset-bottom)); }
  html[data-fw-mobile] .fw-sticky { padding-bottom: max(10px, env(safe-area-inset-bottom)); }
}
@media (max-width: 700px) {
  html[data-fw-mobile] .fw193-pillar { display: grid; grid-template-columns: 36px minmax(0, 1fr); column-gap: 12px; padding: 16px; }
  html[data-fw-mobile] .fw193-pillar-top { grid-column: 1; grid-row: 1 / 4; display: block; margin: 0; }
  html[data-fw-mobile] .fw193-pillar-icon { display: none; } /* decorative; numbered step remains */
  html[data-fw-mobile] .fw193-pillar :is(h3, p, a) { grid-column: 2; }
  html[data-fw-mobile] .fw193-pillar h3 { font-size: 18px !important; margin-bottom: 6px !important; }
  html[data-fw-mobile] .fw193-pillars { padding-inline: 0; }
  html[data-fw-mobile] .fw193-pillar p { font-size: 14px !important; line-height: 1.5 !important; }
  html[data-fw-mobile] .fw1921-task-tab { min-width: 0; padding: 12px; }
  html[data-fw-mobile] .fw1921-task-copy { min-width: 0; }
  html[data-fw-mobile] .fw1921-task-panels { padding: 20px; }
  html[data-fw-mobile] .fw193-aos-skill-choices { grid-template-columns: 1fr !important; }
  html[data-fw-mobile] .fw193-aos-skill-choices > button { display: block; text-align: left; }
  html[data-fw-mobile] .fw193-aos-skill-choices > button > strong { font-size: 14px !important; overflow-wrap: normal !important; }
  html[data-fw-mobile] .fw193-aos-skill-choices > button > span { display: block !important; font-size: 12px; margin-top: 4px; }
  html[data-fw-mobile] .fw193-aos-variant-focus { flex-wrap: wrap; }
  html[data-fw-mobile] .fw193-aos-variant-focus > button { flex: 1 1 130px; font-size: 13px !important; }
  html[data-fw-mobile] .fw191-demo .a-source-text strong { font-size: 12px !important; }
  html[data-fw-mobile] .fw191-demo .a-board-task { flex-wrap: wrap; }
  html[data-fw-mobile] .fw191-demo .a-board-task > button { flex-basis: 100%; text-align: left; }
  html[data-fw-mobile] .fw17-footer a { padding-block: 8px; display: inline-flex; align-items: center; min-height: 44px; }
}
@media (max-width: 360px) {
  html[data-fw-mobile] .fw191-demo [data-a-sources] { grid-template-columns: 1fr !important; }
  html[data-fw-mobile] .contact-scheduler__tabs { gap: 4px; }
  html[data-fw-mobile] .contact-scheduler__tab { padding-inline: 6px !important; font-size: 12px !important; }
  html[data-fw-mobile] .contact-scheduler__step > strong { font-size: 11px !important; }
}
@media (min-width: 701px) and (max-width: 1199px) {
  html[data-fw-mobile] .fw-mobile-contents > nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-fw-mobile] .fw-mobile-contents[open] > nav { display: grid; }
}
@media (hover: none) and (pointer: coarse) and (max-width: 1366px) {
  html[data-fw-mobile] :is(.fw193-pillar, .fw1921-task-tab, .fw17-offer-card):hover { transform: none !important; }
}
@media print {
  .fw-mobile-contents, .fw-mobile-menu-head { display: none !important; }
}
.fw-mobile-preview-hint { display: none; }
@media (max-width: 1199px), (max-width: 1366px) and (hover: none) and (pointer: coarse) {
  html[data-fw-mobile] .fw-mobile-preview-hint { display: block; font-size: 12px !important; color: #617590; margin: 0 0 10px !important; }
  html[data-fw-mobile] :is(.fw191-demo, .fw193-aos-pop) .a-mini-app { min-width: 580px; }
  html[data-fw-mobile] :is(.fw191-demo, .fw193-aos-pop) .a-mini-app :is(div, aside, span, strong, small, p, li, button, h4, h5) {
    font-size: max(12px, 1em) !important; line-height: 1.45 !important;
  }
  html[data-fw-mobile] :is(.fw191-demo, .fw193-aos-pop) :is(.a-app-mail-shell, .a-app-library, .a-app-asana, .a-app-teams, .a-app-notion) {
    grid-template-columns: 110px minmax(0, 1fr) !important;
  }
}
