
/* geo-fix.css — additive responsive / accessibility layer.
   No existing rule is removed; original stylesheets stay untouched. */
@media screen and (max-width: 991px) {
  html, body { max-width: 100% !important; }
  .product_group, .product_item, .product_item.flex,
  .index_product .flex, .text.flex {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  .product_item > *, .product_group > * { max-width: 100% !important; min-width: 0 !important; }
  .product_item img, .product_group img,
  .inner_box img, .index_container img { max-width: 100% !important; height: auto !important; }
  .product_item .text, .product_item:nth-child(1) .text { padding-left: 0 !important; padding-right: 0 !important; }
  .m_width { padding-left: 16px !important; padding-right: 16px !important; }
  table { display: block !important; max-width: 100% !important; overflow-x: auto !important; }
  /* Static build: the source site collapses the mega-menu with JS. Without that
     runtime it expands to ~1800px and the fixed-width logo overflows 320px.
     Only layout is changed; every link stays in the DOM. */
  .sep-header .header_down { max-height: 0 !important; overflow: hidden !important; }
  #logo { max-width: calc(100% - 32px) !important; }
  #logo img { max-width: 100% !important; width: auto !important; height: auto !important; }
}
@media screen and (max-width: 768px) {
  /* A3: scroll-reveal animation hides first-screen content on small viewports */
  .wow { visibility: visible !important; opacity: 1 !important; animation: none !important; transform: none !important; }
  /* H5: enlarge small tap targets without changing copy or layout order */
  .sep-header a, .sep-lx-header-mb a, nav a, .sep-menu-box a,
  a.btn, button, input[type="submit"], .sep-onlineservice a {
    min-height: 44px !important;
  }
  .sep-header a, .sep-lx-header-mb a, .sep-onlineservice a {
    display: inline-flex !important; align-items: center !important;
  }
}
/* Narrow-viewport overflow fix (real-Chrome render audit). */
@media screen and (max-width: 991px) {
  html, body { overflow-x: clip; }
  .index_container, .index_product, .product_container,
  .inner_box.product_list { overflow-x: clip; }
  .product_item a.img { position: relative; overflow: hidden; max-width: 100%; }
  .product_item a.img::after { display: none !important; }
  .product_group, .product_item { overflow-x: clip; }
}
/* ------------------------------------------------------------------
   Platform pages (FAQ, articles, resource extras generated by
   new_page). The theme CSS knows nothing about them; without this
   block the content renders flush against the viewport edge.
   Palette follows the theme primary #2b1361; container mirrors
   .m_width (1360px).
------------------------------------------------------------------- */
.geo-page {
  max-width: 1360px;
  margin: 0 auto;
  padding: 34px 50px 72px;
}
.geo-crumb {
  font-size: 13px;
  color: #8a8aa0;
  margin: 0 0 16px;
}
.geo-crumb a { color: #2b1361; text-decoration: none; }
.geo-crumb a:hover { text-decoration: underline; }
.geo-page h1 {
  font-size: 30px;
  line-height: 1.3;
  color: #2b1361;
  margin: 0 0 10px;
}
.geo-lede { color: #5a5a72; line-height: 1.8; margin: 0 0 26px; }
.geo-meta { font-size: 13px; color: #8a8aa0; margin: 0 0 26px; }
.geo-meta a { color: #2b1361; }
.geo-card {
  border: 1px solid #e7e7ef;
  border-radius: 10px;
  background: #fff;
  padding: 22px 26px;
  margin: 0 0 16px;
  transition: box-shadow .2s ease;
}
.geo-card:hover { box-shadow: 0 8px 22px rgba(43, 19, 97, .10); }
.geo-card h2 { font-size: 19px; line-height: 1.4; margin: 0 0 8px; }
.geo-card h2 a { color: #2b1361; text-decoration: none; }
.geo-card h2 a:hover { text-decoration: underline; }
.geo-card p { color: #5a5a72; font-size: 15px; line-height: 1.75; margin: 0; }
.geo-faq-item { border-bottom: 1px solid #ececf3; padding: 20px 0; }
.geo-faq-item:last-child { border-bottom: 0; }
.geo-faq-item h2, .geo-faq-item h3 {
  font-size: 18px;
  color: #2b1361;
  margin: 0 0 10px;
}
.geo-faq-item p { color: #5a5a72; line-height: 1.85; margin: 0 0 6px; }
.geo-faq-item a { color: #2b1361; }
.geo-faq-inline { margin-top: 40px; }
.geo-faq-inline > h2 { font-size: 22px; color: #2b1361; margin: 0 0 6px; }
.geo-empty { color: #5a5a72; background: #f6f8f8; border-radius: 10px; padding: 26px; }
.geo-h1 { font-size: 26px; color: #2b1361; margin: 0 0 12px; }
.geo-ok { color: #5a5a72; line-height: 1.8; }
.geo-back { color: #2b1361; }
@media screen and (max-width: 991px) {
  .geo-page { padding: 24px 20px 48px; }
  .geo-page h1 { font-size: 24px; }
}
