/* hm-buttons.css */
/*
 * H M Pharma Machines — shared button and action layout system
 * Keeps the site's established orange, green, white and navy meanings while
 * making sizing, spacing, interaction and mobile behavior consistent.
 */
:root {
  --hm-btn-orange: #f58220;
  --hm-btn-orange-hover: #d9680b;
  --hm-btn-green: #178f4d;
  --hm-btn-green-hover: #0f733c;
  --hm-btn-navy: #102a43;
  --hm-btn-navy-hover: #071b2b;
  --hm-btn-line: #cbd6df;
  --hm-btn-radius: 6px;
  --hm-btn-shadow: 0 8px 20px rgba(16, 42, 67, 0.14);
}

/* Main content buttons: one dependable size and typographic rhythm. */
.button,
.btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 160px;
  min-height: 48px;
  margin: 0;
  padding: 13px 20px;
  border: 1px solid transparent;
  border-radius: var(--hm-btn-radius);
  font: inherit;
  font-size: 0.94rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  cursor: pointer;
  transition: background-color 180ms ease, border-color 180ms ease,
    color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
  -webkit-tap-highlight-color: transparent;
}

.button:hover,
.btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--hm-btn-shadow);
  text-decoration: none;
}

.button:active,
.btn:active {
  transform: translateY(0);
  box-shadow: none;
}

.button:focus-visible,
.btn:focus-visible {
  outline: 3px solid rgba(245, 130, 32, 0.32);
  outline-offset: 3px;
}

/* Primary inquiry / product actions. */
.button-primary,
.button-orange,
.button.orange,
.button.primary,
.btn:not(.btn-light):not(.btn-outline) {
  border-color: var(--hm-btn-orange);
  background: var(--hm-btn-orange);
  color: #fff;
}

.button-primary:hover,
.button-orange:hover,
.button.orange:hover,
.button.primary:hover,
.btn:not(.btn-light):not(.btn-outline):hover {
  border-color: var(--hm-btn-orange-hover);
  background: var(--hm-btn-orange-hover);
  color: #fff;
}

/* WhatsApp / direct-response actions. */
.button-green,
.button.green,
.button.whatsapp {
  border-color: var(--hm-btn-green);
  background: var(--hm-btn-green);
  color: #fff;
}

.button-green:hover,
.button.green:hover,
.button.whatsapp:hover {
  border-color: var(--hm-btn-green-hover);
  background: var(--hm-btn-green-hover);
  color: #fff;
}

/*
 * Floating WhatsApp action: one component for both legacy class names.
 * Desktop pairs the WhatsApp mark with its label; mobile centers the mark in a 56px circle.
 */
a.floating,
a.floating-whatsapp {
  box-sizing: border-box;
  position: fixed;
  right: calc(18px + env(safe-area-inset-right, 0px));
  bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  z-index: 60;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 2px solid #fff !important;
  min-width: 44px !important;
  min-height: 48px !important;
  margin: 0;
  padding: 13px 17px;
  border: 1px solid transparent;
  border-radius: 999px !important;
  background: var(--hm-btn-green);
  color: #fff;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.22);
  font: inherit;
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: 0;
  text-align: center;
  text-decoration: none;
  text-transform: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 180ms ease, border-color 180ms ease,
    box-shadow 180ms ease, opacity 180ms ease, transform 180ms ease,
    visibility 180ms ease;
  -webkit-tap-highlight-color: transparent;
}


/* The empty decorative pseudo-element keeps the original link name accessible. */
a.floating::before,
a.floating-whatsapp::before {
  content: "";
  display: block;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23fff%22%20class%3D%22bi%20bi-whatsapp%22%20viewBox%3D%220%200%2016%2016%22%3E%20%3Cpath%20d%3D%22M13.601%202.326A7.85%207.85%200%200%200%207.994%200C3.627%200%20.068%203.558.064%207.926c0%201.399.366%202.76%201.057%203.965L0%2016l4.204-1.102a7.9%207.9%200%200%200%203.79.965h.004c4.368%200%207.926-3.558%207.93-7.93A7.9%207.9%200%200%200%2013.6%202.326zM7.994%2014.521a6.6%206.6%200%200%201-3.356-.92l-.24-.144-2.494.654.666-2.433-.156-.251a6.56%206.56%200%200%201-1.007-3.505c0-3.626%202.957-6.584%206.591-6.584a6.56%206.56%200%200%201%204.66%201.931%206.56%206.56%200%200%201%201.928%204.66c-.004%203.639-2.961%206.592-6.592%206.592m3.615-4.934c-.197-.099-1.17-.578-1.353-.646-.182-.065-.315-.099-.445.099-.133.197-.513.646-.627.775-.114.133-.232.148-.43.05-.197-.1-.836-.308-1.592-.985-.59-.525-.985-1.175-1.103-1.372-.114-.198-.011-.304.088-.403.087-.088.197-.232.296-.346.1-.114.133-.198.198-.33.065-.134.034-.248-.015-.347-.05-.099-.445-1.076-.612-1.47-.16-.389-.323-.335-.445-.34-.114-.007-.247-.007-.38-.007a.73.73%200%200%200-.529.247c-.182.198-.691.677-.691%201.654s.71%201.916.81%202.049c.098.133%201.394%202.132%203.383%202.992.47.205.84.326%201.129.418.475.152.904.129%201.246.08.38-.058%201.171-.48%201.338-.943.164-.464.164-.86.114-.943-.049-.084-.182-.133-.38-.232%22%2F%3E%20%3C%2Fsvg%3E") center / contain no-repeat;
}

/* Override the older page-level WA text placeholders. */
a.floating::after,
a.floating-whatsapp::after {
  content: none !important;
}

a.floating:hover,
a.floating-whatsapp:hover {
  background: var(--hm-btn-green-hover);
  color: #fff;
  box-shadow: 0 10px 24px rgba(16, 42, 67, 0.24);
  text-decoration: none;
  transform: translateY(-2px);
}

a.floating:active,
a.floating-whatsapp:active {
  box-shadow: 0 5px 14px rgba(16, 42, 67, 0.2);
  transform: translateY(0);
}

a.floating:focus-visible,
a.floating-whatsapp:focus-visible {
  outline: 3px solid var(--hm-btn-navy);
  outline-offset: 3px;
}

/* Button-like links in the gallery and video areas share the CTA geometry. */
.detail-actions a,
.gallery-guide-links a,
.video-library-links a,
.deferred-video-error a {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 160px;
  min-height: 48px;
  margin: 0;
  padding: 13px 20px;
  border: 1px solid transparent;
  border-radius: var(--hm-btn-radius);
  font: inherit;
  font-size: 0.94rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  cursor: pointer;
  transition: background-color 180ms ease, border-color 180ms ease,
    color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
  -webkit-tap-highlight-color: transparent;
}

.detail-actions a:hover,
.gallery-guide-links a:hover,
.video-library-links a:hover,
.deferred-video-error a:hover {
  box-shadow: var(--hm-btn-shadow);
  text-decoration: none;
  transform: translateY(-2px);
}

.detail-actions a:active,
.gallery-guide-links a:active,
.video-library-links a:active,
.deferred-video-error a:active {
  box-shadow: none;
  transform: translateY(0);
}

.detail-actions a:focus-visible,
.gallery-guide-links a:focus-visible,
.video-library-links a:focus-visible,
.deferred-video-error a:focus-visible {
  outline: 3px solid rgba(245, 130, 32, 0.36);
  outline-offset: 3px;
}

/* Keep the native upload action visually aligned with the form buttons. */
.hm-file-field input[type="file"]::file-selector-button,
input.hm-upload-input[type="file"]::file-selector-button {
  margin: -4px 12px -4px -4px;
  padding: 9px 14px;
  border: 1px solid var(--hm-btn-navy);
  border-radius: var(--hm-btn-radius);
  background: var(--hm-btn-navy);
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  transition: background-color 180ms ease, border-color 180ms ease;
}

.hm-file-field input[type="file"]::file-selector-button:hover,
input.hm-upload-input[type="file"]::file-selector-button:hover {
  border-color: var(--hm-btn-navy-hover);
  background: var(--hm-btn-navy-hover);
}

/* Secondary actions remain clear on dark and light sections. */
.button-outline,
.button-white,
.button-light,
.button.white,
.btn-light,
.btn-outline {
  border-color: var(--hm-btn-line);
  background: #fff;
  color: var(--hm-btn-navy);
}

.button-outline:hover,
.button-white:hover,
.button-light:hover,
.button.white:hover,
.btn-light:hover,
.btn-outline:hover {
  border-color: var(--hm-btn-orange);
  background: #fff8f1;
  color: #a84400;
}

.button.video-button {
  border-color: var(--hm-btn-navy);
  background: var(--hm-btn-navy);
  color: #fff;
}

.button.video-button:hover {
  border-color: var(--hm-btn-navy-hover);
  background: var(--hm-btn-navy-hover);
  color: #fff;
}

/* CTA bands intentionally use a white button, with the same shared geometry. */
.quote-band .button,
.cta-band .button {
  border-color: #fff;
  background: #fff;
  color: #a84400;
}

.quote-band .button:hover,
.cta-band .button:hover {
  border-color: #fff;
  background: #fff8f1;
  color: #7d3100;
}

/* Every button group follows the same wrapping, gap and alignment rules. */
.actions,
.hero-actions,
.card-actions,
.contact-actions,
.watch-actions,
.detail-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.actions,
.hero-actions {
  margin-top: 24px;
}

.card-actions .button,
.contact-actions .button,
.watch-actions .button,
.detail-actions .button,
.detail-actions .btn {
  flex: 1 1 160px;
}

.product-catalog-action {
  display: flex;
  justify-content: center;
  margin-top: 28px;
}

.gallery-home-head > .button,
.blog-preview-head > .button {
  flex: 0 0 auto;
}

.button[disabled],
.btn[disabled],
.button[aria-disabled="true"],
.btn[aria-disabled="true"] {
  opacity: 0.58;
  pointer-events: none;
}

/* Header quote action stays consistent without inheriting large content buttons. */
.nav-cta {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 15px !important;
  border: 1px solid var(--hm-btn-orange) !important;
  border-radius: var(--hm-btn-radius) !important;
  background: var(--hm-btn-orange) !important;
  color: #fff !important;
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
  text-decoration: none;
  transition: background-color 180ms ease, border-color 180ms ease,
    box-shadow 180ms ease, transform 180ms ease;
}

.nav-cta:hover {
  border-color: var(--hm-btn-orange-hover) !important;
  background: var(--hm-btn-orange-hover) !important;
  color: #fff !important;
  box-shadow: 0 7px 16px rgba(16, 42, 67, 0.15);
  transform: translateY(-1px);
}

.modal .form-label {
  display: block;
  margin: 0 0 6px;
  color: #102a43;
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.35;
}

.modal .modal-card {
  max-height: calc(100vh - 36px);
  overflow-y: auto;
}

@media (prefers-reduced-motion: reduce) {
  .button,
  .btn,
  .nav-cta,
  a.floating,
  a.floating-whatsapp,
  .detail-actions a,
  .gallery-guide-links a,
  .video-library-links a,
  .deferred-video-error a {
    transition: none !important;
  }

  .button:hover,
  .btn:hover,
  .nav-cta:hover,
  a.floating:hover,
  a.floating-whatsapp:hover,
  .detail-actions a:hover,
  .gallery-guide-links a:hover,
  .video-library-links a:hover,
  .deferred-video-error a:hover {
    transform: none !important;
  }
}

@media (max-width: 720px) {
  .nav-cta {
    width: 100%;
    margin: 6px 0 0 !important;
  }

  .actions,
  .hero-actions,
  .card-actions,
  .contact-actions,
  .watch-actions,
  .detail-actions {
    align-items: stretch;
    width: 100%;
  }

  .actions > .button,
  .actions > .btn,
  .hero-actions > .button,
  .hero-actions > .btn,
  .card-actions > .button,
  .card-actions > .btn,
  .contact-actions > .button,
  .contact-actions > .btn,
  .watch-actions > .button,
  .watch-actions > .btn,
  .detail-actions > .button,
  .detail-actions > .btn,
  .quote-wrap > .button,
  .cta-wrap > .button,
  .product-catalog-action > .button,
  .gallery-home-head > .button,
  .blog-preview-head > .button {
    width: 100%;
    max-width: none;
  }

  .gallery-home-head > .button,
  .blog-preview-head > .button,
  .quote-wrap > .button,
  .cta-wrap > .button {
    margin-top: 18px;
  }

  a.floating,
  a.floating-whatsapp {
    right: calc(16px + env(safe-area-inset-right, 0px)) !important;
    bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    width: 56px !important;
    min-width: 56px !important;
    height: 56px !important;
    min-height: 56px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    font-size: 0 !important;
    line-height: 1 !important;
  }

  a.floating::before,
  a.floating-whatsapp::before {
    flex-basis: 28px;
    width: 28px;
    height: 28px;
  }

  .detail-actions a,
  .gallery-guide-links a,
  .video-library-links a {
    width: 100%;
    max-width: none;
  }
}

/* WhatsApp icon: Bootstrap Icons, https://icons.getbootstrap.com/icons/whatsapp/
The MIT License (MIT)

Copyright (c) 2019-2024 The Bootstrap Authors

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
*/

/* hm-header.css */
/* H M Pharma Machines — one header system for every public page. */
:root {
  --hm-header-max: 1260px;
  --hm-header-navy: #082330;
  --hm-header-ink: #0b2734;
  --hm-header-cream: #f7f5ef;
  --hm-header-orange: #f27622;
  --hm-header-orange-dark: #d65e0b;
  --hm-header-line: #d9dfdc;
}

.topbar {
  box-sizing: border-box;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: var(--hm-header-navy) !important;
  color: #fff !important;
}

.topbar .topbar-inner {
  box-sizing: border-box;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 22px !important;
  width: 100% !important;
  max-width: var(--hm-header-max) !important;
  min-height: 38px !important;
  margin: 0 auto !important;
  padding: 6px 24px !important;
}

/* Business identity lives in HTML; suppress legacy generated text. */
.topbar .topbar-inner::before {
  content: none !important;
  display: none !important;
}

.topbar .topbar-inner > .hm-establishment {
  display: block !important;
  margin-right: auto !important;
  color: #9fd3ea !important;
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

.topbar a {
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.015em !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

.topbar a:hover,
.topbar a:focus-visible {
  color: #ffb783 !important;
}

body > header,
body > .site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 100 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: var(--hm-header-cream) !important;
  box-shadow: 0 2px 14px rgba(8, 35, 48, 0.1) !important;
}

body > header > .header-inner,
body > .site-header > .header-inner {
  box-sizing: border-box;
  position: relative;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  width: 100% !important;
  max-width: var(--hm-header-max) !important;
  min-height: 88px !important;
  margin: 0 auto !important;
  padding: 10px 24px !important;
}

.brand {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  text-decoration: none !important;
}

.brand img {
  display: block !important;
  width: auto !important;
  height: 58px !important;
  max-width: 124px !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
}

body > header .header-inner > nav,
body > .site-header .header-inner > nav,
body > header .header-inner > #siteNav {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 2px !important;
  margin: 0 0 0 auto !important;
  padding: 0 !important;
}

body > header .header-inner > nav > a,
body > .site-header .header-inner > nav > a,
body > header .nav-dropdown-toggle,
body > .site-header .nav-dropdown-toggle {
  box-sizing: border-box;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 12px 10px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--hm-header-ink) !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 0.76rem !important;
  font-weight: 750 !important;
  line-height: 1.1 !important;
  letter-spacing: 0.055em !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

body > header .header-inner > nav > a:hover,
body > .site-header .header-inner > nav > a:hover,
body > header .nav-dropdown-toggle:hover,
body > .site-header .nav-dropdown-toggle:hover,
body > header .header-inner > nav > a:focus-visible,
body > .site-header .header-inner > nav > a:focus-visible,
body > header .nav-dropdown-toggle:focus-visible,
body > .site-header .nav-dropdown-toggle:focus-visible {
  background: rgba(242, 118, 34, 0.07) !important;
  color: var(--hm-header-orange) !important;
  outline: none !important;
  box-shadow: inset 0 -2px 0 var(--hm-header-orange) !important;
}

body > header .header-inner > nav > a.active,
body > header .header-inner > nav > a.active-section,
body > header .header-inner > nav > a[aria-current="page"],
body > header .header-inner > nav > a[aria-current="location"],
body > .site-header .header-inner > nav > a.active,
body > .site-header .header-inner > nav > a.active-section,
body > .site-header .header-inner > nav > a[aria-current="page"],
body > .site-header .header-inner > nav > a[aria-current="location"],
body > header .nav-dropdown-toggle.active,
body > .site-header .nav-dropdown-toggle.active {
  border-radius: 0 !important;
  background: rgba(242, 118, 34, 0.08) !important;
  color: var(--hm-header-orange) !important;
  box-shadow: inset 0 -2px 0 var(--hm-header-orange) !important;
}

body > header .header-inner > nav > .nav-cta,
body > .site-header .header-inner > nav > .nav-cta {
  min-height: 44px !important;
  margin-left: 10px !important;
  padding: 12px 17px !important;
  border: 1px solid var(--hm-header-orange) !important;
  border-radius: var(--hm-btn-radius, 6px) !important;
  background: var(--hm-header-orange) !important;
  color: #fff !important;
  box-shadow: 0 8px 20px rgba(242, 118, 34, 0.18) !important;
}

body > header .header-inner > nav > .nav-cta:hover,
body > .site-header .header-inner > nav > .nav-cta:hover,
body > header .header-inner > nav > .nav-cta:focus-visible,
body > .site-header .header-inner > nav > .nav-cta:focus-visible {
  border-color: var(--hm-header-orange-dark) !important;
  background: var(--hm-header-orange-dark) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(214, 94, 11, 0.24) !important;
}

body > header .header-inner > nav > .nav-cta:focus-visible,
body > .site-header .header-inner > nav > .nav-cta:focus-visible {
  outline: 3px solid var(--hm-header-ink) !important;
  outline-offset: 3px !important;
}

.menu-toggle {
  box-sizing: border-box;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 74px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 10px 13px !important;
  border: 1px solid var(--hm-header-line) !important;
  border-radius: 6px !important;
  background: #fff !important;
  color: var(--hm-header-ink) !important;
  font: 700 0.78rem/1 Arial, Helvetica, sans-serif !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}

@media (max-width: 1100px) {
  .topbar .topbar-inner {
    gap: 16px !important;
    padding-inline: 20px !important;
  }

  .topbar .topbar-inner > .hm-establishment {
    display: none !important;
  }

  body > header > .header-inner,
  body > .site-header > .header-inner {
    min-height: 74px !important;
    padding: 8px 20px !important;
  }

  .brand img {
    height: 50px !important;
    max-width: 108px !important;
  }

  .menu-toggle {
    display: inline-flex !important;
  }

  body > header .header-inner > nav,
  body > .site-header .header-inner > nav,
  body > header .header-inner > #siteNav {
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    right: 0 !important;
    left: 0 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 10px 20px 18px !important;
    border-top: 1px solid var(--hm-header-line) !important;
    background: var(--hm-header-cream) !important;
    box-shadow: 0 15px 24px rgba(8, 35, 48, 0.14) !important;
  }

  body > header .header-inner > nav.open,
  body > .site-header .header-inner > nav.open,
  body > header .header-inner > #siteNav.open {
    display: flex !important;
  }

  body > header .header-inner > nav > a,
  body > .site-header .header-inner > nav > a,
  body > header .nav-dropdown-toggle,
  body > .site-header .nav-dropdown-toggle {
    justify-content: flex-start !important;
    width: 100% !important;
    min-height: 44px !important;
    padding: 11px 10px !important;
    text-align: left !important;
  }

  body > header .header-inner > nav > .nav-cta,
  body > .site-header .header-inner > nav > .nav-cta {
    justify-content: center !important;
    margin: 8px 0 0 !important;
  }

  .nav-dropdown {
    display: block !important;
    width: 100% !important;
  }
}

@media (max-width: 560px) {
  .topbar .topbar-inner {
    justify-content: center !important;
    gap: 12px !important;
    min-height: 35px !important;
    padding-inline: 12px !important;
  }

  .topbar a {
    font-size: 0.64rem !important;
  }

  .topbar a[href^="mailto:"] {
    display: none !important;
  }
}

/* hm-accessibility.css */
/* H M Pharma Machines — shared accessibility improvements. */
:root {
  --hm-a11y-orange: #a84400;
  --hm-a11y-orange-hover: #7d3100;
  --hm-a11y-green: #0b713b;
  --hm-a11y-green-hover: #07562c;
  --hm-a11y-navy: #102a43;
  --hm-btn-orange: #a84400;
  --hm-btn-orange-hover: #7d3100;
  --hm-btn-green: #0b713b;
  --hm-btn-green-hover: #07562c;
  --hm-header-orange: #a84400;
  --hm-header-orange-dark: #7d3100;
}

.skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 10000;
  max-width: calc(100vw - 20px);
  padding: 12px 16px;
  border: 3px solid var(--hm-a11y-orange);
  border-radius: 6px;
  background: #fff;
  color: var(--hm-a11y-navy);
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform 160ms ease;
}

.skip-link:focus,
.skip-link:focus-visible {
  color: var(--hm-a11y-navy);
  outline: 3px solid #fff;
  outline-offset: 2px;
  transform: translateY(0);
}

main[tabindex="-1"]:focus {
  outline: none;
}

/* White on #a84400 is 6.01:1, comfortably above WCAG AA. */
.button:where(:not(.button-green):not(.green):not(.whatsapp):not(.button-white):not(.white):not(.button-outline):not(.button-light):not(.video-button)),
.button-primary,
.button-orange,
.button.primary,
.btn:not(.btn-light):not(.btn-outline),
.nav-cta,
.modal button[type="submit"] {
  border-color: var(--hm-a11y-orange) !important;
  background: var(--hm-a11y-orange) !important;
  color: #fff !important;
}

body > header .header-inner > nav > .nav-cta,
body > .site-header .header-inner > nav > .nav-cta {
  border-color: var(--hm-a11y-orange) !important;
  background: var(--hm-a11y-orange) !important;
  color: #fff !important;
}

.button:where(:not(.button-green):not(.green):not(.whatsapp):not(.button-white):not(.white):not(.button-outline):not(.button-light):not(.video-button)):hover,
.button-primary:hover,
.button-orange:hover,
.button.primary:hover,
.btn:not(.btn-light):not(.btn-outline):hover,
.nav-cta:hover,
.modal button[type="submit"]:hover {
  border-color: var(--hm-a11y-orange-hover) !important;
  background: var(--hm-a11y-orange-hover) !important;
  color: #fff !important;
}

body > header .header-inner > nav > .nav-cta:hover,
body > .site-header .header-inner > nav > .nav-cta:hover,
body > header .header-inner > nav > .nav-cta:focus-visible,
body > .site-header .header-inner > nav > .nav-cta:focus-visible {
  border-color: var(--hm-a11y-orange-hover) !important;
  background: var(--hm-a11y-orange-hover) !important;
  color: #fff !important;
}

/* White on #0b713b is 6.11:1. Keep WhatsApp/direct-response actions AA. */
.button-green,
.button.green,
.button.whatsapp,
.floating,
.floating-whatsapp {
  border-color: var(--hm-a11y-green) !important;
  background: var(--hm-a11y-green) !important;
  color: #fff !important;
}

.button-green:hover,
.button.green:hover,
.button.whatsapp:hover,
.floating:hover,
.floating-whatsapp:hover {
  border-color: var(--hm-a11y-green-hover) !important;
  background: var(--hm-a11y-green-hover) !important;
  color: #fff !important;
}

/* Orange used as foreground text needs a darker token on light surfaces. */
.kicker,
.category,
.step,
.station-number,
.feature .icon,
.related::before,
.breadcrumbs a:hover,
.breadcrumb a:hover,
.directory-links a:hover,
.watch-link,
.card-body h2 a:hover {
  color: var(--hm-a11y-orange) !important;
}

.section-kicker,
.number,
.part-index,
.guide-number,
.model > strong,
.quick-answer strong,
.blog-card-meta span,
.section-heading > p,
.video-card .card-body > span {
  color: var(--hm-a11y-orange) !important;
}

.check {
  color: var(--hm-a11y-green) !important;
}

#products .section-kicker,
.dark-section .section-kicker,
.navy-section .kicker,
.process .kicker,
.process-section .kicker,
.process-section .section-kicker,
.factor-card .number,
.part-card .number {
  color: #ffc28e !important;
}

.guide-kicker {
  color: var(--hm-a11y-orange) !important;
}

.process-section .step strong,
.video-card .play {
  background: var(--hm-a11y-orange) !important;
  color: #fff !important;
}

.breadcrumbs,
.breadcrumb {
  color: #526475 !important;
}

/* Dark breadcrumb opt-in: audited affected pages only. */
.breadcrumb.hm-dark-hero,
.breadcrumbs.hm-dark-hero {
  color: #d8e5ed !important;
}

.gallery-guide-links a,
.video-library-links a,
.detail-actions a:not(:last-child),
.deferred-video-error a,
.deferred-video-play-icon {
  border-color: var(--hm-a11y-orange) !important;
  background: var(--hm-a11y-orange) !important;
  color: #fff !important;
}

.gallery-guide-links a:hover,
.video-library-links a:hover,
.detail-actions a:not(:last-child):hover,
.deferred-video-error a:hover {
  border-color: var(--hm-a11y-orange-hover) !important;
  background: var(--hm-a11y-orange-hover) !important;
  color: #fff !important;
}

.quote-band .button,
.cta-band .button {
  border-color: #fff !important;
  background: #fff !important;
  color: var(--hm-a11y-orange-hover) !important;
}

.quote-band .button:hover,
.cta-band .button:hover {
  border-color: #fff !important;
  background: #fff8f1 !important;
  color: #622600 !important;
}

.modal .modal-card {
  max-height: calc(100vh - 36px);
  overflow-y: auto;
}

.table-wrap[tabindex="0"]:focus-visible {
  outline: 3px solid var(--hm-a11y-orange);
  outline-offset: 3px;
}

.table-swipe-hint {
  display: none;
  margin: 0 0 10px;
  color: #40566a;
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.4;
}

@media (prefers-reduced-motion: reduce) {
  .skip-link {
    transition: none;
  }
}

@media (max-width: 720px) {
  .table-swipe-hint:not([hidden]) {
    display: block;
  }

  .menu-toggle,
  .nav-dropdown-toggle,
  .nav-cta,
  .button,
  .btn,
  button,
  summary,
  input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
  select,
  textarea,
  .modal-close,
  .close,
  .lightbox-close,
  .gallery-open,
  .floating,
  .floating-whatsapp {
    box-sizing: border-box;
    min-width: 44px !important;
    min-height: 44px !important;
  }

  nav a,
  .site-nav a,
  .topbar a,
  footer a,
  .footer-links a,
  .footer-contact a,
  .contact-links a,
  a[href^="tel:"] {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    min-height: 44px !important;
  }

  /* Inline navigation links also need a dependable touch area on small screens. */
  .breadcrumbs a,
  .breadcrumb a,
  .product-card li > a,
  .directory-links > a,
  .card-body h2 a,
  .watch-link,
  main p > a,
  article a,
  aside a,
  td a,
  th a,
  .blog-card-body a,
  .hm-privacy-notice a,
  .compact-links a,
  a[href^="mailto:"] {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    min-width: 44px !important;
    min-height: 45px !important;
  }

  .gallery-home-card > a {
    display: flex;
    width: 100%;
    min-width: 0;
    flex-direction: column;
    align-items: stretch;
  }

  .gallery-home-card h3 {
    width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .directory-links > a,
  .watch-link,
  .card-body h2 a {
    width: 100%;
  }

  .nav-dropdown-menu a {
    width: 100%;
  }

  body > header .header-inner > nav > a,
  body > .site-header .header-inner > nav > a,
  body > header .nav-dropdown-toggle,
  body > .site-header .nav-dropdown-toggle {
    min-height: 44px !important;
  }
}

/* Secure inquiry forms, optional upload and submit-adjacent privacy notice. */
.hm-file-field {
  margin-top: 14px;
}

.hm-file-field label,
.hm-upload-label {
  display: block;
  margin: 0 0 6px;
  color: var(--hm-a11y-navy);
  font-weight: 700;
}

.hm-file-field input[type="file"],
input.hm-upload-input[type="file"] {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 10px;
  border: 1px solid #a9b8c4;
  border-radius: 6px;
  background: #fff;
  color: #183042;
  font: inherit;
}

.hm-file-field input[type="file"]:focus-visible,
input.hm-upload-input[type="file"]:focus-visible {
  border-color: var(--hm-a11y-orange);
  outline: 3px solid rgba(168, 68, 0, 0.22);
  outline-offset: 1px;
}

.hm-form-help {
  margin: 6px 0 0 !important;
  color: #40566a !important;
  font-size: 0.84rem;
  line-height: 1.45;
}

.hm-privacy-notice {
  margin: 14px 0 12px !important;
  color: #334e63 !important;
  font-size: 0.86rem;
  line-height: 1.55;
}

.hm-privacy-notice a,
.footer-privacy a {
  color: #7d3100;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.hm-form-status {
  min-height: 1.4em;
  margin: 8px 0 0 !important;
  color: #40566a !important;
  font-size: 0.86rem;
  line-height: 1.45;
}

.hm-form-status:empty {
  display: none;
}

.hm-form-status-error {
  color: #8b1d1d !important;
  font-weight: 700;
}

form button[type="submit"]:disabled,
form input[type="submit"]:disabled {
  cursor: wait;
  opacity: 0.68;
}

.hm-honeypot {
  position: absolute !important;
  left: -10000px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.footer-privacy {
  padding: 0 16px 18px;
  text-align: center;
  font-size: 0.9rem;
}

footer .footer-privacy a {
  color: inherit;
}

.hm-consent-settings {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-weight: 700;
  margin-left: 12px;
  padding: 10px 8px;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.hm-consent-settings:focus-visible,
.hm-consent-button:focus-visible,
.hm-map-load:focus-visible {
  outline: 3px solid #193b56;
  outline-offset: 3px;
}

.hm-consent-panel {
  position: fixed;
  z-index: 10000;
  right: 18px;
  bottom: 18px;
  left: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  max-width: 1120px;
  margin: 0 auto;
  padding: 20px;
  border: 1px solid #9bacb8;
  border-radius: 12px;
  background: #fff;
  color: #183042;
  box-shadow: 0 14px 44px rgba(16, 42, 67, 0.28);
}

.hm-consent-panel[hidden] {
  display: none;
}

.hm-consent-copy {
  max-width: 720px;
}

.hm-consent-copy h2 {
  margin: 0 0 7px;
  color: #102a43;
  font-size: 1.18rem;
}

.hm-consent-copy p {
  margin: 0;
  color: #334e63;
  font-size: 0.92rem;
  line-height: 1.55;
}

.hm-consent-copy a {
  color: #7d3100;
  font-weight: 700;
  text-decoration: underline;
}

.hm-consent-actions {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.hm-consent-button {
  min-height: 44px;
  border: 2px solid #9d3e00;
  border-radius: 6px;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
  padding: 10px 15px;
}

.hm-consent-reject {
  background: #fff;
  color: #7d3100;
}

.hm-consent-accept {
  background: #9d3e00;
  color: #fff;
}

.hm-map-consent {
  overflow: hidden;
  border: 1px solid #c8d3dc;
  border-radius: 12px;
  background: #f3f7f9;
}

.hm-map-intro {
  padding: 24px;
  text-align: center;
}

.hm-map-consent > h3,
.hm-map-consent > p,
.hm-map-consent > .hm-map-load {
  margin-left: 24px;
  margin-right: 24px;
}

.hm-map-consent > h3 {
  margin-top: 24px;
  margin-bottom: 8px;
}

.hm-map-consent > p {
  margin-top: 0;
  margin-bottom: 15px;
  color: #40566a;
  line-height: 1.55;
}

.hm-map-consent > .hm-map-load {
  margin-bottom: 24px;
}

.hm-map-intro h3 {
  margin: 0 0 8px;
  color: #102a43;
}

.hm-map-intro p {
  margin: 0 auto 15px;
  max-width: 650px;
  color: #40566a;
  line-height: 1.55;
}

.hm-map-load {
  min-height: 44px;
  border: 2px solid #9d3e00;
  border-radius: 6px;
  background: #9d3e00;
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
  padding: 10px 17px;
}

.hm-map-fallback {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-left: 10px;
  color: #7d3100;
  font-weight: 800;
  text-decoration: underline;
}

.hm-map-status {
  margin: 10px 0 0;
  font-size: 0.88rem;
}

.hm-map-frame iframe {
  display: block;
  width: 100%;
  min-height: 420px;
  border: 0;
}

.hm-map-consent.is-loaded .hm-map-intro {
  padding-bottom: 16px;
}

.hm-map-summary {
  display: flex;
  min-height: 260px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 28px;
  background: #edf4f7;
}

.hm-map-summary h3 {
  margin: 0 0 9px;
  color: #102a43;
}

.hm-map-summary p {
  margin: 0 0 18px;
  color: #40566a;
  line-height: 1.55;
}

/* Keep article-card links large enough for touch and switch users. */
.read-more {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
}

@media (max-width: 760px) {
  .hero .hero-visual {
    padding-bottom: 72px;
  }

  .hero .hero-visual > .hero-badge {
    box-sizing: border-box;
    width: max-content;
    max-width: calc(100% - 16px);
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.25;
    text-align: center;
  }

  .hm-consent-panel {
    right: 10px;
    bottom: 10px;
    left: 10px;
    display: block;
    max-height: calc(100vh - 20px);
    overflow: auto;
    padding: 17px;
  }

  .hm-consent-actions {
    justify-content: stretch;
    margin-top: 15px;
  }

  .hm-consent-button {
    flex: 1 1 210px;
  }

  .hm-map-fallback {
    display: flex;
    justify-content: center;
    margin: 8px 0 0;
  }

  .hm-map-frame iframe {
    min-height: 340px;
  }
}

/* Enquiry clarity and persistent mobile contact, 17 October 2026. */
.hm-mobile-contact { display: none; }
.hm-mobile-contact[hidden] { display: none !important; }
.hm-inquiry-form textarea[name="requirement"] { min-height: 100px !important; }
.hm-inquiry-form .hm-form-help[id^="hm-form-contact-hint-"] {
  margin: 12px 0 0 !important; padding: 9px 11px; border-left: 3px solid #a84400;
  border-radius: 3px; background: #fff5eb; color: #102a43; line-height: 1.4;
}
.hm-inquiry-form .hm-privacy-notice { font-size: .85rem; line-height: 1.45; }
.hm-inquiry-form .hm-submit-button { min-height: 46px; }
#home .hero-inner .hm-quote-guide { max-width: 700px; margin-top: 15px; font-size: .94rem; line-height: 1.6; }
#home .hero-inner { padding-top: 56px; padding-bottom: 64px; }
#home .hero-motion-control { background: transparent; border-color: rgba(255,255,255,.5); }
#products { scroll-margin-top: 110px; }
.hm-compact-intro { padding-top: 36px !important; padding-bottom: 36px !important; }
.hm-compact-intro .section-title { max-width: 900px; font-size: clamp(1.5rem,3vw,2.2rem); }
.hm-compact-intro p:not(.section-kicker) { max-width: 900px; color: #43566a; }
.hm-intro-links { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 18px; }
.hm-intro-links a, .hm-faq-more a { color: #8b3900; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.hm-faq-more { margin-top: 24px; line-height: 1.6; }
@media (max-width: 760px) {
  body.hm-has-mobile-contact { padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important; }
  body.hm-has-mobile-contact a.floating-whatsapp,
  body.hm-has-mobile-contact a.floating[href*="wa.me/"],
  body.hm-has-mobile-contact a.floating[href*="api.whatsapp.com/"] { display: none !important; }
  .hm-mobile-contact {
    box-sizing: border-box; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 10px;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 80;
    padding: 10px max(16px, env(safe-area-inset-right, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
    border-top: 1px solid #d4dee5; background: #fff; box-shadow: 0 -3px 14px rgba(16,42,67,.1);
  }
  .hm-mobile-contact a {
    box-sizing: border-box; display: flex; align-items: center; justify-content: center;
    min-height: 46px; padding: 11px 8px; border-radius: 6px;
    color: #fff !important; text-decoration: none; font: 700 .94rem/1.3 Arial,Helvetica,sans-serif; text-align: center;
  }
  .hm-mobile-contact .hm-mobile-quote { background: #a84400; }
  .hm-mobile-contact .hm-mobile-whatsapp { background: #087839; }
  .hm-mobile-contact a:focus-visible { outline: 3px solid #102a43; outline-offset: 3px; }
  #home.hero { padding-top: 0 !important; padding-bottom: 0 !important; }
  #home .hero-inner { padding: 32px 20px 36px !important; }
  #home .hero-inner h1 { font-size: clamp(1.9rem,8vw,2.4rem); }
  #home .hero-inner .hero-actions { margin-top: 20px; gap: 10px; }
  #home .hero-inner .hm-quote-guide { font-size: .9rem; }
  #home .hero-motion { margin-top: 10px; }
  .modal .modal-card { max-height: calc(100dvh - 24px); padding: 20px 18px; }
  .modal .modal-card > h2 { padding-right: 35px; }
  .modal .modal-card .modal-close { min-width: 44px; min-height: 44px; right: 6px; top: 6px; }
  .hm-intro-links { display: grid; gap: 14px; }
}

/* Keep privacy choices readable above the sticky site header. */
#hm-analytics-consent { z-index: 110 !important; }
#quote.modal, #lightbox.lightbox { z-index: 120 !important; }
@media (max-width: 760px) {
  #hm-analytics-consent {
    left: 16px !important; right: 16px !important; width: auto !important;
    max-width: none !important; bottom: 16px !important;
    max-height: calc(100vh - 32px) !important;
    max-height: calc(100dvh - 32px) !important;
    overflow-y: auto; overscroll-behavior: contain;
  }
}

/* UI readability and text enlargement, 17 October 2026. */
main, footer, .hero, .page-hero, .modal-card, .hm-consent {
  overflow-wrap: anywhere;
}
main :where(div, section, article, aside, form, fieldset, dl, dd),
footer :where(div, section), .modal-card, .field, .field-row > * {
  min-width: 0;
}
main :where(h1, h2, h3, h4, p, summary, label, dt, dd),
footer :where(h2, h3, p, a), .modal-card :where(h2, p, label) {
  overflow-wrap: anywhere;
}
main a[href^="mailto:"], .contact-links a, .footer-contact a {
  max-width: 100%;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
}
.button, .btn, .hm-mobile-contact a {
  max-width: 100%;
  white-space: normal !important;
  overflow-wrap: anywhere;
}
.button, .btn {
  font-size: 1rem;
  line-height: 1.4;
}
.hm-form-help, .hm-inquiry-form .hm-privacy-notice,
.hm-privacy-notice, .hm-form-status {
  font-size: .9375rem;
  line-height: 1.55;
}
.hm-inquiry-form label { font-size: .9375rem; line-height: 1.5; }
.section-title { line-height: 1.15; }
#home.hero::after {
  background: linear-gradient(90deg,rgba(4,20,29,.9) 0%,rgba(4,20,29,.8) 58%,rgba(4,20,29,.5) 100%);
}
#home .hero-inner p { color: #f2f5f7; }
#home .hero-inner .hm-quote-guide { font-size: 1rem; line-height: 1.6; }
/* Flex items must be allowed to wrap when a reader enlarges only the text. */
body > header .header-inner > nav,
body > .site-header .header-inner > nav {
  min-width: 0;
  flex-wrap: wrap;
}
body > header .header-inner > nav > a,
body > header .nav-dropdown-toggle {
  white-space: normal !important;
  overflow-wrap: anywhere;
}
/* Keep enlarged close controls separate from the dialog title. */
.modal .modal-card > h2 { padding-right: 3rem; }
@media (max-width: 760px) {
  #home.hero::after { background: rgba(4,20,29,.82); }
  body.hm-has-mobile-contact {
    padding-bottom: var(--hm-mobile-contact-space, calc(76px + env(safe-area-inset-bottom, 0px))) !important;
  }
  .hm-mobile-contact { display: flex; flex-wrap: wrap; }
  .hm-mobile-contact a { flex: 1 1 8em; min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* hm-components.css */
/* Shared header, footer, inquiry-form and responsive behaviour. */

/* Grid children must be allowed to shrink around long machine names and tables. */
.page-hero .hero-inner,
.layout > article,
.layout > aside {
  min-width: 0 !important;
  max-width: 100%;
}

.page-hero h1,
.page-hero p {
  overflow-wrap: anywhere;
}

.layout > article .table-wrap {
  max-width: 100%;
}

/* Keep values from different published machine configurations visually separate. */
.core-specifications .spec-config-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
}

.core-specifications .spec-config {
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid var(--line, #dce5eb);
  border-left: 3px solid var(--orange, #a84400);
  border-radius: 7px;
  background: #f8fafb;
}

.core-specifications .spec-config:only-child {
  grid-column: 1 / -1;
}

.core-specifications .spec-config dt {
  margin: 0;
  color: var(--navy, #102a43);
  font-weight: 800;
  line-height: 1.35;
}

.core-specifications .spec-config dd {
  margin: 4px 0 0;
  color: #526474;
  line-height: 1.5;
}

.core-specifications .spec-config-note {
  margin: 10px 0 0;
  padding: 8px 10px;
  border-radius: 6px;
  background: #eef4f7;
  color: #415d6d;
  font-size: .88rem;
  line-height: 1.5;
}

@media (max-width: 800px) {
  .core-specifications .spec-config-list {
    grid-template-columns: 1fr;
  }

  .core-specifications .spec-config:only-child {
    grid-column: auto;
  }
}

.site-footer {
  position: relative;
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  border-top: 3px solid #f58220 !important;
  background: linear-gradient(135deg, #071b2b 0%, #0a2537 58%, #071b2b 100%) !important;
  color: #dce7ed !important;
}

.site-footer *,
.site-footer *::before,
.site-footer *::after {
  box-sizing: border-box;
}

.site-footer .footer-inner {
  display: grid !important;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .95fr) minmax(320px, 1.15fr) !important;
  gap: clamp(24px, 3.5vw, 44px) !important;
  width: min(1180px, 100%) !important;
  margin: 0 auto !important;
  padding: 30px 24px 24px !important;
}

.site-footer .footer-col {
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.site-footer .footer-inner > .footer-col + .footer-col {
  padding-left: clamp(22px, 3vw, 36px) !important;
  border-left: 1px solid rgba(255, 255, 255, .13) !important;
}

/* Page headers use generic nav rules; keep the footer navigation independent. */
.site-footer nav.footer-col {
  position: static !important;
  inset: auto !important;
  display: block !important;
  width: auto !important;
  min-height: 0 !important;
  height: auto !important;
  align-items: initial !important;
  justify-content: initial !important;
  flex-direction: initial !important;
  gap: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

.site-footer nav.footer-col a,
.site-footer nav.footer-col a:hover,
.site-footer nav.footer-col a:focus {
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  transform: none !important;
}

.site-footer h2 {
  margin: 0 0 14px !important;
  color: #fff !important;
  font: 700 .98rem/1.25 Arial, Helvetica, sans-serif !important;
  letter-spacing: .01em;
}

.site-footer h2::after {
  display: block;
  width: 30px;
  height: 3px;
  margin-top: 8px;
  border-radius: 99px;
  background: #f58220;
  content: "";
}

.site-footer p,
.site-footer address,
.site-footer span {
  margin: 0 !important;
  color: #dce7ed !important;
  font: normal .88rem/1.58 Arial, Helvetica, sans-serif !important;
}

.site-footer address {
  padding-top: 4px;
}

.site-footer a {
  display: flex !important;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  min-height: 44px;
  margin: 0 !important;
  padding: 7px 0 !important;
  color: #eef5f8 !important;
  font: 600 .86rem/1.4 Arial, Helvetica, sans-serif !important;
  overflow-wrap: anywhere;
  text-decoration: none !important;
  text-decoration-thickness: .08em;
  text-underline-offset: .18em;
}

.site-footer a:hover,
.site-footer a:focus-visible {
  color: #ffb574 !important;
  text-decoration: underline !important;
}

.site-footer a:focus-visible,
.site-footer .hm-consent-settings:focus-visible {
  border-radius: 4px;
  outline: 3px solid #a84400 !important;
  outline-offset: 3px !important;
}

.site-footer .footer-col > p {
  max-width: 440px;
}

.site-footer .footer-links {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 20px;
}

.site-footer .footer-links a {
  width: 100%;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.site-footer .footer-contact {
  display: grid !important;
  grid-template-columns: minmax(130px, .9fr) minmax(130px, 1fr);
  grid-template-areas:
    "phone whatsapp"
    "email email"
    "address address";
  gap: 0 16px;
  align-items: start;
}

.site-footer .footer-contact > a:nth-of-type(1) { grid-area: phone; }
.site-footer .footer-contact > a:nth-of-type(2) { grid-area: email; }
.site-footer .footer-contact > a:nth-of-type(3) { grid-area: whatsapp; }

.site-footer .footer-contact address {
  grid-area: address;
  margin-top: 8px !important;
  padding: 8px 0 0 12px !important;
  border-left: 2px solid #f58220;
}

.site-footer .footer-bottom {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 4px 22px !important;
  margin: 0 !important;
  padding: 6px 24px !important;
  border-top: 1px solid rgba(255, 255, 255, .1);
  background: rgba(2, 15, 24, .72) !important;
  color: #c6d5dd !important;
  text-align: center !important;
}

.site-footer .footer-bottom > span {
  color: #c6d5dd !important;
  font-size: .82rem !important;
}

.site-footer .footer-bottom a {
  display: inline-flex !important;
  align-items: center;
  min-height: 44px;
  padding: 5px 0 !important;
  font-size: .82rem !important;
}

.site-footer .footer-bottom .hm-consent-settings {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin: 0 !important;
  padding: 5px 0 !important;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #eef5f8 !important;
  font: 600 .82rem/1.4 Arial, Helvetica, sans-serif !important;
  text-decoration: underline;
  text-decoration-thickness: .08em;
  text-underline-offset: .18em;
  cursor: pointer;
}

.site-footer .footer-bottom .hm-consent-settings:hover {
  color: #fff !important;
}

.site-footer .footer-bottom .hm-consent-settings:focus-visible {
  color: #ffb574 !important;
}

.nav-dropdown {
  position: relative;
  display: flex;
  align-items: center;
}

.nav-dropdown-toggle::after {
  content: " \25BE";
  font-size: .72em;
}

.nav-dropdown-menu {
  position: absolute;
  top: calc(100% + 2px);
  left: 0;
  z-index: 120;
  display: none;
  min-width: 210px;
  padding: 7px;
  border: 1px solid rgba(16, 42, 67, .18);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(16, 42, 67, .16);
}

.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu {
  display: flex;
  flex-direction: column;
}

.nav-dropdown-menu a {
  box-sizing: border-box;
  display: flex !important;
  align-items: center;
  min-height: 44px;
  padding: 10px 12px !important;
  color: #0b2734 !important;
  text-decoration: none !important;
  white-space: nowrap;
}

.nav-dropdown-menu a:hover,
.nav-dropdown-menu a:focus-visible,
.nav-dropdown-menu a.active {
  background: #fff1e6 !important;
  color: #8c3700 !important;
}

.hm-inquiry-form {
  display: grid;
  gap: 0;
}

.hm-inquiry-form .form-label,
.hm-inquiry-form > label {
  display: block;
  margin: 12px 0 6px;
  color: #102a43;
  font-weight: 700;
  line-height: 1.35;
}

.hm-inquiry-form input:not([type="hidden"]),
.hm-inquiry-form select,
.hm-inquiry-form textarea {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 11px 12px;
  border: 1px solid #9eafbb;
  border-radius: 6px;
  background: #fff;
  color: #102a43;
  font: inherit;
}

.hm-inquiry-form textarea {
  min-height: 132px;
  resize: vertical;
}

.hm-inquiry-form input:focus-visible,
.hm-inquiry-form select:focus-visible,
.hm-inquiry-form textarea:focus-visible {
  border-color: #a84400;
  outline: 3px solid #a84400;
  outline-offset: 3px;
}

.hm-inquiry-form .hm-form-help,
.hm-inquiry-form .hm-privacy-notice {
  margin: 7px 0 0;
  color: #415d6d;
  font-size: .88rem;
  line-height: 1.55;
}

.hm-inquiry-form .hm-file-field {
  margin-top: 4px;
}

.hm-inquiry-form .hm-honeypot {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.hm-inquiry-form .hm-submit-button {
  width: fit-content;
  min-width: 160px;
  margin-top: 16px;
}

@media (max-width: 1100px) {
  body > header .nav-dropdown,
  body > .site-header .nav-dropdown {
    display: block !important;
    width: 100% !important;
  }

  body > header .nav-dropdown-menu,
  body > .site-header .nav-dropdown-menu {
    position: static !important;
    min-width: 0 !important;
    margin: 2px 0 5px 10px !important;
    padding: 2px 0 2px 8px !important;
    border: 0 !important;
    border-left: 3px solid #a84400 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  body > header .nav-dropdown-menu a,
  body > .site-header .nav-dropdown-menu a {
    white-space: normal !important;
  }
}

@media (max-width: 980px) {
  .site-footer .footer-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px 32px !important;
    width: min(820px, 100%) !important;
    padding: 28px 24px 24px !important;
  }

  .site-footer .footer-inner > .footer-col,
  .site-footer .footer-inner > .footer-col + .footer-col {
    padding-left: 0 !important;
    border-left: 0 !important;
  }

  .site-footer .footer-inner > .footer-col:first-child {
    grid-column: 1 / -1;
    padding-bottom: 20px !important;
    border-bottom: 1px solid rgba(255, 255, 255, .13) !important;
  }

  .site-footer .footer-inner > .footer-col:nth-child(3) {
    padding-left: 32px !important;
    border-left: 1px solid rgba(255, 255, 255, .13) !important;
  }
}

@media (max-width: 760px) {
  .site-footer .footer-inner {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    width: min(620px, 100%) !important;
    padding: 26px 20px 22px !important;
  }

  .site-footer .footer-inner > .footer-col,
  .site-footer .footer-inner > .footer-col + .footer-col,
  .site-footer .footer-inner > .footer-col:nth-child(3) {
    grid-column: auto;
    padding: 20px 0 !important;
    border: 0 !important;
    border-top: 1px solid rgba(255, 255, 255, .13) !important;
  }

  .site-footer .footer-inner > .footer-col:first-child {
    padding-top: 0 !important;
    border: 0 !important;
  }

  .site-footer .footer-inner > .footer-col:last-child {
    padding-bottom: 0 !important;
  }

  .site-footer .footer-bottom {
    gap: 2px 18px !important;
    padding: 6px 20px !important;
  }

  .hm-inquiry-form .hm-submit-button {
    width: 100%;
  }
}

@media (max-width: 360px) {
  .site-footer .footer-inner,
  .site-footer .footer-bottom {
    padding-inline: 16px !important;
  }

  .site-footer .footer-links {
    gap-inline: 14px;
  }

  .site-footer .footer-contact {
    grid-template-columns: 1fr;
    grid-template-areas:
      "phone"
      "email"
      "whatsapp"
      "address";
  }

  .site-footer .footer-bottom > span {
    flex-basis: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto !important;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* High-contrast keyboard focus indicators shared by every page. */
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible {
  outline: 3px solid #a84400 !important;
  outline-offset: 3px !important;
}

/* A white gap keeps the dark-orange link ring distinct on dark or orange areas. */
a:focus-visible {
  box-shadow: 0 0 0 3px #fff !important;
}

button:focus-visible,
[role="button"]:focus-visible,
input[type="button"]:focus-visible,
input[type="reset"]:focus-visible,
input[type="submit"]:focus-visible,
a.btn:focus-visible,
a.button:focus-visible,
a.button-green:focus-visible,
a.button-orange:focus-visible,
a.button-primary:focus-visible,
a.deferred-video-play:focus-visible,
a.floating:focus-visible,
a.floating-whatsapp:focus-visible,
a.nav-cta:focus-visible,
a.video-button:focus-visible {
  outline: 3px solid #102a43 !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 3px #fff !important;
}

/* The play overlay fills a clipped video frame, so its ring must stay inside. */
a.deferred-video-play:focus-visible {
  outline: 4px solid #102a43 !important;
  outline-offset: -8px !important;
  box-shadow: inset 0 0 0 4px #fff !important;
}

.deferred-video video[tabindex]:not([tabindex="-1"]):focus-visible {
  outline: 4px solid #102a43 !important;
  outline-offset: -8px !important;
  box-shadow: inset 0 0 0 4px #fff !important;
}

/* Image controls sit flush inside overflow-hidden cards; draw their ring inward. */
a.card-image:focus-visible,
a.blog-card-image:focus-visible,
.gallery-home-card > a:focus-visible,
button.gallery-open:focus-visible,
.hm-map-frame iframe:focus-visible {
  outline: 4px solid #102a43 !important;
  outline-offset: -8px !important;
  box-shadow: inset 0 0 0 4px #fff !important;
}

.deferred-video-error a:focus-visible {
  outline: 3px solid #102a43 !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 3px #fff !important;
}

/* The white separation ring keeps dark orange visible on the navy footer. */
body .site-footer a:focus-visible,
body .site-footer nav.footer-col a:focus-visible,
body .site-footer .hm-consent-settings:focus-visible {
  outline: 3px solid #a84400 !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 3px #fff !important;
}

/* hm-header.css intentionally removes the default outline; restore the shared ring. */
body > header .header-inner > nav > a:focus-visible,
body > .site-header .header-inner > nav > a:focus-visible,
body > header .nav-dropdown-toggle:focus-visible,
body > .site-header .nav-dropdown-toggle:focus-visible {
  outline: 3px solid #a84400 !important;
  outline-offset: 3px !important;
}

body > header .header-inner > nav > .nav-cta:focus-visible,
body > .site-header .header-inner > nav > .nav-cta:focus-visible {
  outline: 3px solid #102a43 !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 3px #fff !important;
}

/* Short inquiry form: detailed specifications remain available on request. */
.hm-inquiry-form .hm-form-context { margin: 0 0 6px; color: #102a43; line-height: 1.5; }
.hm-inquiry-form textarea[name="requirement"] { min-height: 100px; }
.hm-inquiry-form .hm-form-extra { margin-top: 16px; border: 1px solid #c7d2db; border-radius: 6px; background: #f8fafb; }
.hm-inquiry-form .hm-form-extra > summary { padding: 12px; color: #102a43; font-weight: 700; cursor: pointer; min-height: 44px; box-sizing: border-box; }
.hm-inquiry-form .hm-form-extra > summary:focus-visible { outline: 3px solid #a84400; outline-offset: 3px; }
.hm-inquiry-form .hm-form-extra-fields { display: grid; padding: 0 12px 14px; }

/* hm-analytics.css */
.hm-consent[hidden]{display:none!important}
.hm-consent{position:fixed;z-index:85;left:16px;bottom:18px;width:min(560px,calc(100vw - 32px));box-sizing:border-box;padding:16px 18px;background:#fff;color:#17354a;border:1px solid #b9c8d3;border-radius:10px;box-shadow:0 5px 28px #0c26352e;font:14px/1.45 system-ui,-apple-system,Segoe UI,sans-serif}
.hm-consent h2{margin:0 0 6px;font-size:17px;line-height:1.3;color:inherit}
.hm-consent p{margin:6px 0}
.hm-consent-status{font-size:12px;color:#526474}
.hm-consent-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
.hm-consent-actions button{cursor:pointer;min-height:44px;padding:10px 14px;border:1px solid #17354a;border-radius:6px;background:#fff;color:#17354a;font:600 14px/1.2 system-ui,sans-serif}
.hm-consent-actions a{color:#17354a;text-decoration:underline;padding:10px 4px;font-size:13px}
.hm-consent-actions button:focus-visible,.hm-consent-actions a:focus-visible,.hm-cookie-settings:focus-visible{outline:3px solid #f58220;outline-offset:3px}
.hm-cookie-settings{display:block;margin:14px auto 10px;padding:8px 12px;min-height:44px;border:1px solid currentColor;border-radius:5px;background:transparent;color:inherit;font:inherit;cursor:pointer}
.hm-consent-owner[hidden]{display:none!important}
.hm-consent-owner{margin-top:12px;border-top:1px solid #dbe3e9;padding-top:10px;font-size:12px}
.hm-consent-owner summary{cursor:pointer;min-height:24px}
.hm-consent-actions button:disabled{opacity:.55;cursor:default}
@media(max-width:700px){.hm-consent{bottom:76px;padding:13px 14px;max-height:calc(100svh - 105px);overflow:auto}.hm-consent-actions{gap:8px}.hm-consent-actions button{flex:1}.hm-consent-actions a{width:100%;text-align:center;padding:4px}.hm-consent h2{font-size:16px}}
/* Separate optional measurement choices: scoped native checkboxes. */
.hm-consent-options{display:grid;gap:10px;margin:12px 0}
.hm-consent-option{display:flex;align-items:flex-start;gap:10px;min-height:44px;margin:0;padding:10px 12px;border:1px solid #dbe3e9;border-radius:6px;cursor:pointer}
.hm-consent-option input[type="checkbox"]{appearance:auto;flex:0 0 18px;width:18px;min-width:18px;height:18px;margin:2px 0 0;padding:0;accent-color:#17354a}
.hm-consent-option-copy{display:block;flex:1;min-width:0;overflow-wrap:anywhere}
.hm-consent-option-copy strong{display:block;font-weight:600;line-height:1.4}
.hm-consent-option-copy>span{display:block;margin-top:3px;font-size:13px;line-height:1.45;color:#526474}
.hm-consent-option input[type="checkbox"]:focus-visible{outline:3px solid #f58220;outline-offset:3px}
.hm-consent-option input[type="checkbox"]:disabled,.hm-consent-option input[type="checkbox"]:disabled+.hm-consent-option-copy{cursor:default}
.hm-consent-option input[type="checkbox"]:disabled+.hm-consent-option-copy strong{color:#526474}
@media(max-width:700px){.hm-consent-options{gap:8px;margin:10px 0}.hm-consent-option{gap:9px;padding:9px 10px}}
@media(min-width:701px){.hm-consent{max-height:calc(100svh - 40px);overflow:auto}}


/* Gallery caption contrast */
.gallery-caption span{color:#a94600;font-size:.875rem}

/* Mobile navigation and short-view dialog fixes, 17 October 2026. */
@media (max-width: 1100px) {
  body > header .header-inner > #siteNav,
  body > .site-header .header-inner > #siteNav {
    flex-wrap: nowrap !important;
    overflow-x: hidden !important;
    align-items: stretch;
    justify-content: flex-start !important;
  }
  #siteNav > * { flex-shrink: 0; min-width: 0; max-width: 100%; }
}
html.hm-dialog-open, html.hm-dialog-open body { overflow: hidden !important; overscroll-behavior: none; }
#quote.modal.show, #lightbox.lightbox.show {
  top: var(--hm-visible-top, 0px);
  bottom: auto;
  height: var(--hm-visible-height, 100vh);
  height: var(--hm-visible-height, 100dvh);
  padding: 12px;
}
.modal .modal-card {
  max-height: calc(var(--hm-visible-height, 100vh) - 24px) !important;
  overscroll-behavior: contain;
  scroll-padding-top: var(--hm-dialog-header-height, 76px);
  scroll-padding-bottom: 16px;
}
.modal .hm-dialog-header {
  position: sticky; top: calc(0px - var(--hm-dialog-pad-top, 20px)); z-index: 3;
  min-height: 44px; padding: 4px 52px 12px 0; margin: 0 0 6px;
  background: #fff; box-shadow: 0 5px 8px rgba(255,255,255,.98);
}
.modal .hm-dialog-header h2 { margin: 0 !important; padding: 0 !important; }
.modal .hm-dialog-header .modal-close,
.modal .hm-dialog-header [data-close-quote] {
  position: absolute; top: 0 !important; right: 0 !important;
  min-width: 44px !important; min-height: 44px !important;
  width: 44px; height: 44px; margin: 0; padding: 0;
  border: 1px solid #c7d3dc; border-radius: 6px;
  color: #102a43; background: #fff; line-height: 1; touch-action: manipulation;
}
.lightbox-close { min-width: 44px !important; min-height: 44px !important; }
.lightbox .lightbox-inner {
  max-height: calc(var(--hm-visible-height, 100vh) - 24px) !important;
  overflow-y: auto; overscroll-behavior: contain;
}
.lightbox img { max-height: calc(var(--hm-visible-height, 100vh) - 100px); }