@charset "utf-8";
/* ==========================================================================
   responsive.css — added 2026-09-18
   Loaded AFTER style.css. Contains only additions; it changes no existing rule.
   Safe to delete if anything here is unwanted: the site reverts to its
   previous behaviour.
   ========================================================================== */

/* 1. Stop iOS Safari inflating text in landscape. ----------------------- */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

/* 2. Nothing may be wider than its container. --------------------------- */
img, video, iframe, embed, object, canvas, svg { max-width: 100%; }
video, iframe, embed, object { height: auto; }
pre, code { overflow-x: auto; white-space: pre-wrap; word-break: break-word; }

/* Long unbroken strings (part numbers, URLs) must wrap rather than stretch
   the page. */
td, th, p, li, dd, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }

/* 3. Wide specification tables scroll inside their own box. -------------- */
/* Applied via the .tbl_scroll wrapper, which was added around every table
   of six or more columns. The table keeps its natural width and the box
   scrolls, so the page itself never scrolls sideways. */
.tbl_scroll { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tbl_scroll > table { margin-bottom: 0; }

@media all and (max-width: 991px) {
  /* A hint that the box is scrollable, shown only where it actually is. */
  .tbl_scroll { border-right: 1px solid #d8dee7; }
  .tbl_scroll > table { min-width: 640px; }
}

/* 4. Tablet portrait, 768-1023px. --------------------------------------- */
/* The desktop navigation is still in use here (the mobile menu takes over at
   767px and below), so the dropdown panels need to fit the narrower screen. */
@media all and (min-width: 768px) and (max-width: 1023px) {
  #dropmenu li ul,
  #dropmenu li ul li ul { max-width: 100% !important; box-sizing: border-box; }
  .exp2, .exp3 { max-width: calc(100% - 30px); }
}

/* 5. Very narrow phones, 360px and below (Galaxy A/S base width). -------- */
@media all and (max-width: 360px) {
  body { font-size: 15px; }
  .tbl_scroll > table { min-width: 560px; }
}

/* 6. Tap targets. ------------------------------------------------------- */
@media all and (max-width: 767px) {
  .mean-nav a, a.lnav_btn { min-height: 44px; }
}

/* 7. Print. ------------------------------------------------------------- */
@media print {
  header, footer, #dropmenu, .mean-bar, .pagetop { display: none !important; }
  .tbl_scroll { overflow: visible; }
  .tbl_scroll > table { min-width: 0; }
  a[href]:after { content: ""; }
}
