/* Herzpraxis Oberland - Premium Clinical
   Site chrome + the component vocabulary the Spectra blocks compose with. */

:root {
  --hpo-bg: #FAFDFF;
  --hpo-surface: #F2F8FB;
  --hpo-surface-2: #E6EEF4;
  --hpo-card: #FFFFFF;
  --hpo-ink: #0D1C27;
  --hpo-primary: #1A3B55;
  --hpo-primary-hover: #133047;
  --hpo-primary-on: #F9FCFE;
  --hpo-accent: #1292C0;
  --hpo-accent-soft: #E4F2F8;
  --hpo-muted: #536672;
  --hpo-line: #D0D9DE;
  --hpo-border: #DBE2E7;
  --hpo-warning: #D28425;
  --hpo-warning-soft: #FBF2E6;
  --hpo-warning-ink: #8A5A00;
  --hpo-success: #227C45;
  --hpo-on-dark-body: #CBD9E2;
  --hpo-on-dark-lead: #E2ECF2;

  --hpo-gutter: clamp(20px, 4vw, 64px);
  --hpo-section: clamp(64px, 8vw, 112px);
  --hpo-max: 1280px;

  --hpo-r-sm: 8px;
  --hpo-r-md: 12px;
  --hpo-r-lg: 16px;
  --hpo-r-pill: 9999px;

  --hpo-lift: 0 18px 40px -24px rgba(0, 64, 112, 0.28);
  --hpo-lift-soft: 0 12px 32px -18px rgba(0, 64, 112, 0.18);
}

/* ---------------------------------------------------------------- base */

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;
  scroll-padding-top: 96px;
}

body {
  background: var(--hpo-bg);
  color: var(--hpo-ink);
  font-size: 17px;
  line-height: 1.65;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

::selection { background: rgba(18, 146, 192, 0.18); }

.hpo-page h1, .hpo-page h2, .hpo-page h3, .hpo-page h4 {
  font-weight: 500;
  color: var(--hpo-ink);
  letter-spacing: -0.02em;
}
.hpo-page p { text-wrap: pretty; hyphens: auto; overflow-wrap: break-word; }
.hpo-page h1, .hpo-page h2, .hpo-page h3 { hyphens: manual; }
/* Astra underlines content links; this design uses colour and hairlines. */
.hpo-page a,
.hpo-page .entry-content a,
.hpo-page .entry-content a:hover,
.hpo-page .hpo-btn,
.hpo-page .hpo-link { text-decoration: none !important; }
.hpo-page .wp-block-spectra-container { box-sizing: border-box; }

.hpo-page :focus-visible {
  outline: 2px solid var(--hpo-accent);
  outline-offset: 3px;
  border-radius: 4px;
}

/* ------------------------------------------------------------- header */

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(250, 253, 255, 0.85);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(208, 217, 222, 0.6);
  transition: box-shadow .3s ease, border-color .3s ease, background .3s ease;
}
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }

.hpo-scrolled .site-header {
  border-bottom-color: var(--hpo-line);
  background: rgba(250, 253, 255, 0.92);
  box-shadow: 0 4px 12px -6px rgba(0, 32, 64, 0.08);
}

.ast-primary-header-bar,
.ast-header-break-point .ast-primary-header-bar {
  background: transparent !important;
  border-bottom: none !important;
}
.site-header .ast-container,
.ast-primary-header-bar > .ast-container {
  max-width: var(--hpo-max);
  padding-left: var(--hpo-gutter);
  padding-right: var(--hpo-gutter);
}
.ast-primary-header-bar .site-logo-img img {
  height: 58px;
  width: auto;
  max-height: none;
}

.main-header-menu > .menu-item > .menu-link {
  position: relative;
  font-size: 15px;
  font-weight: 500;
  color: var(--hpo-muted);
  padding: 8px 12px;
  line-height: 1.4;
  white-space: nowrap;
  transition: color .25s ease;
}
.main-header-menu > .menu-item > .menu-link::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 2px;
  height: 1.5px;
  background: var(--hpo-primary);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .3s ease;
}
.main-header-menu > .menu-item > .menu-link:hover { color: var(--hpo-ink); }
.main-header-menu > .menu-item.current-menu-item > .menu-link { color: var(--hpo-primary); }
.main-header-menu > .menu-item.current-menu-item > .menu-link::after { transform: scaleX(1); }
.main-header-menu .sub-menu {
  border: 1px solid var(--hpo-line);
  border-radius: var(--hpo-r-md);
  box-shadow: var(--hpo-lift-soft);
  overflow: hidden;
}

.hpo-tel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--hpo-line);
  border-radius: var(--hpo-r-pill);
  color: var(--hpo-ink);
  margin-left: 8px;
  transition: color .25s ease, border-color .25s ease, background .25s ease;
}
.hpo-tel:hover {
  color: var(--hpo-accent);
  border-color: rgba(18, 146, 192, 0.5);
  background: var(--hpo-surface);
}
.hpo-tel-label { display: none; }

.ast-builder-button-wrap .ast-custom-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 20px;
  background: var(--hpo-primary);
  color: var(--hpo-primary-on);
  font-size: 14px;
  font-weight: 600;
  border: none;
  border-radius: var(--hpo-r-pill);
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(0, 32, 64, 0.1);
  transition: background .25s ease, box-shadow .25s ease;
}
.ast-builder-button-wrap .ast-custom-button:hover {
  background: var(--hpo-primary-hover);
  color: var(--hpo-primary-on);
  box-shadow: var(--hpo-lift-soft);
}

/* Astra's own mobile trigger is replaced by the custom drawer. */
.ast-header-break-point .ast-mobile-menu-trigger-fill,
.ast-header-break-point .ast-mobile-menu-trigger-minimal,
.ast-header-break-point .ast-button-wrap .menu-toggle { display: none !important; }

/* ------------------------------------------------- mobile menu drawer */

.hpo-burger {
  display: none;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--hpo-line);
  border-radius: var(--hpo-r-pill);
  background: rgba(255, 255, 255, 0.8);
  color: var(--hpo-ink);
  cursor: pointer;
  padding: 0;
  transition: background .25s ease;
}
.hpo-burger:hover { background: var(--hpo-surface); }

.hpo-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 998;
  background: rgba(13, 28, 39, 0.45);
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease, visibility .3s ease;
}
.hpo-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  width: min(88vw, 384px);
  display: flex;
  flex-direction: column;
  background: var(--hpo-bg);
  border-left: 1px solid var(--hpo-line);
  transform: translateX(100%);
  transition: transform .32s cubic-bezier(.22, 1, .36, 1);
  overflow: hidden;
}
.hpo-drawer-open .hpo-drawer { transform: none; }
.hpo-drawer-open .hpo-drawer-backdrop { opacity: 1; visibility: visible; }
.hpo-drawer-open { overflow: hidden; }

.hpo-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px;
  border-bottom: 1px solid var(--hpo-line);
  flex-shrink: 0;
}
.hpo-drawer-head img { height: 48px; width: auto; display: block; }
.hpo-drawer-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  border: 1px solid var(--hpo-line);
  border-radius: var(--hpo-r-pill);
  background: none;
  color: var(--hpo-ink);
  cursor: pointer;
  transition: background .25s ease;
}
.hpo-drawer-close:hover { background: var(--hpo-surface); }

.hpo-drawer-nav {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 12px 8px;
}
.hpo-drawer-nav a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-radius: var(--hpo-r-md);
  font-size: 16px;
  font-weight: 500;
  color: var(--hpo-ink);
  transition: background .2s ease, color .2s ease;
}
.hpo-drawer-nav a:hover { background: var(--hpo-surface); }
.hpo-drawer-nav a[aria-current="page"] { background: var(--hpo-surface); color: var(--hpo-primary); }
.hpo-drawer-num {
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  color: var(--hpo-muted);
  margin-right: 12px;
}
.hpo-drawer-nav a svg { color: var(--hpo-muted); transition: transform .2s ease; flex-shrink: 0; }
.hpo-drawer-nav a:hover svg { transform: translateX(2px); }

.hpo-drawer-foot {
  flex-shrink: 0;
  border-top: 1px solid var(--hpo-line);
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.hpo-emergency {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 1px solid rgba(210, 132, 37, 0.4);
  background: var(--hpo-warning-soft);
  border-radius: var(--hpo-r-md);
  transition: background .2s ease;
}
.hpo-emergency:hover { background: #F7E9D6; }
.hpo-emergency-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  border-radius: var(--hpo-r-sm);
  background: rgba(210, 132, 37, 0.2);
  color: var(--hpo-warning-ink);
}
.hpo-emergency b { display: block; font-size: 12.5px; font-weight: 600; color: var(--hpo-ink); }
.hpo-emergency span { display: block; font-size: 11.5px; line-height: 1.4; color: var(--hpo-muted); }

.hpo-drawer-foot .hpo-btn { width: 100%; }
.hpo-drawer-meta { margin: 4px 0 0; text-align: center; font-size: 12px; color: var(--hpo-muted); }

@media (max-width: 1079px) { .hpo-burger { display: inline-flex; } }

/* ------------------------------------------------------ open status */

.hpo-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 14px;
  border: 1px solid var(--hpo-line);
  border-radius: var(--hpo-r-pill);
  background: var(--hpo-card);
  font-size: 13px;
  color: var(--hpo-muted);
  white-space: nowrap;
}
.hpo-status b { font-weight: 600; color: var(--hpo-ink); }
.hpo-status-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; background: var(--hpo-muted); }
.hpo-status-open .hpo-status-dot {
  background: var(--hpo-success);
  box-shadow: 0 0 0 3px rgba(34, 124, 69, 0.15);
}
.hpo-drawer-foot .hpo-status { width: 100%; justify-content: center; }

/* --------------------------------------------------------- buttons */

.hpo-page .hpo-btn,
.hpo-drawer .hpo-btn,
.hpo-sticky-cta .hpo-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 48px;
  padding: 0 24px;
  border-radius: var(--hpo-r-pill);
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: background .25s ease, border-color .25s ease, box-shadow .25s ease, color .25s ease;
}
.hpo-btn svg { flex-shrink: 0; }
.hpo-btn-primary {
  background: var(--hpo-primary);
  color: var(--hpo-primary-on);
  border: 1px solid var(--hpo-primary);
  box-shadow: 0 8px 20px -12px rgba(26, 59, 85, 0.6);
}
.hpo-btn-primary:hover {
  background: var(--hpo-primary-hover);
  border-color: var(--hpo-primary-hover);
  color: var(--hpo-primary-on);
  box-shadow: var(--hpo-lift);
}
.hpo-btn-secondary {
  background: var(--hpo-card);
  color: var(--hpo-primary);
  border: 1px solid rgba(26, 59, 85, 0.25);
}
.hpo-btn-secondary:hover {
  border-color: rgba(26, 59, 85, 0.5);
  background: var(--hpo-surface);
  color: var(--hpo-primary);
}
.hpo-btn-accent { background: var(--hpo-accent); color: #FFFFFF; border: 1px solid var(--hpo-accent); }
.hpo-btn-accent:hover { background: #0F7EA6; border-color: #0F7EA6; color: #FFFFFF; }
.hpo-btn-ghost-dark {
  background: transparent;
  color: var(--hpo-primary-on);
  border: 1px solid rgba(249, 252, 254, 0.28);
}
.hpo-btn-ghost-dark:hover { background: rgba(249, 252, 254, 0.12); color: var(--hpo-primary-on); }

.hpo-btn .hpo-arrow { transition: transform .25s ease; }
.hpo-btn:hover .hpo-arrow { transform: translateX(2px); }

/* ------------------------------------------- typographic utilities */

.hpo-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--hpo-accent);
  line-height: 1.4;
}
.hpo-eyebrow-dot::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
}
.hpo-eyebrow-on-dark { color: #7FC9E4; }
.hpo-eyebrow-muted { color: var(--hpo-muted); }
.hpo-eyebrow-num { font-variant-numeric: tabular-nums; color: var(--hpo-muted); letter-spacing: 0.08em; }

.hpo-h1 { font-size: clamp(2rem, 5.2vw, 3.75rem); line-height: 1.08; letter-spacing: -0.02em; text-wrap: balance; }
.hpo-h1-page { font-size: clamp(1.9rem, 4.4vw, 3.1rem); line-height: 1.08; letter-spacing: -0.02em; text-wrap: balance; }
.hpo-h1-legal { font-size: clamp(1.75rem, 3.4vw, 2.6rem); line-height: 1.12; letter-spacing: -0.02em; }
.hpo-h2 { font-size: clamp(1.75rem, 3.1vw, 2.375rem); line-height: 1.12; letter-spacing: -0.015em; text-wrap: balance; }
.hpo-h2-sub { font-size: clamp(1.5rem, 2.5vw, 1.95rem); line-height: 1.16; letter-spacing: -0.015em; }
.hpo-h2-small { font-size: clamp(1.375rem, 2.1vw, 1.625rem); line-height: 1.2; letter-spacing: -0.01em; }
.hpo-h3 { font-size: 1.375rem; line-height: 1.25; letter-spacing: -0.01em; }
.hpo-h3-sm { font-size: 1.1875rem; line-height: 1.3; letter-spacing: -0.005em; }
.hpo-h4 { font-size: 1.0625rem; font-weight: 600; line-height: 1.4; letter-spacing: -0.005em; }
.hpo-h4-label {
  font-size: 11.5px; font-weight: 600; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--hpo-accent); line-height: 1.4;
}
.hpo-label {
  font-size: 11.5px; font-weight: 600; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--hpo-muted); line-height: 1.4;
}

.hpo-subtitle {
  font-size: clamp(1.0625rem, 1.3vw, 1.125rem);
  font-weight: 500; line-height: 1.6; color: rgba(13, 28, 39, 0.85);
}
.hpo-lead { font-size: clamp(1rem, 1.2vw, 1.125rem); line-height: 1.65; color: var(--hpo-muted); }
.hpo-lead-hero { font-size: clamp(1rem, 1.2vw, 1.125rem); line-height: 1.65; color: var(--hpo-on-dark-lead); }
.hpo-subtitle-on-dark { font-size: clamp(1.0625rem, 1.3vw, 1.125rem); font-weight: 500; line-height: 1.6; color: #EAF3F8; }
.hpo-body { color: var(--hpo-ink); font-size: 1rem; line-height: 1.7; }
.hpo-muted { color: var(--hpo-muted); font-size: 1rem; line-height: 1.7; }
.hpo-small { font-size: 0.875rem; line-height: 1.6; color: var(--hpo-muted); }
.hpo-on-dark { color: var(--hpo-on-dark-body); }

.hpo-measure { max-width: 760px; }
.hpo-measure-wide { max-width: 820px; }
.hpo-measure-620 { max-width: 620px; }
.hpo-measure-700 { max-width: 700px; }
.hpo-measure-720 { max-width: 720px; }
.hpo-measure-900 { max-width: 900px; }
.hpo-measure-460 { max-width: 460px; }

.hpo-rule-top { border-top: 1px solid var(--hpo-line); }
.hpo-rule-top-soft { border-top: 1px solid var(--hpo-border); }

.hpo-link,
.hpo-page .hpo-link-underline > a,
.hpo-page a.hpo-link-underline {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 500;
  color: var(--hpo-primary);
  transition: color .25s ease;
}
.hpo-link::after,
.hpo-page .hpo-link-underline > a::after,
.hpo-page a.hpo-link-underline::after {
  content: "";
  position: absolute;
  left: 0; bottom: -2px;
  width: 100%; height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .3s ease;
}
.hpo-link:hover,
.hpo-page .hpo-link-underline > a:hover,
.hpo-page a.hpo-link-underline:hover { color: var(--hpo-accent); }
.hpo-link:hover::after,
.hpo-page .hpo-link-underline > a:hover::after,
.hpo-page a.hpo-link-underline:hover::after { transform: scaleX(1); transform-origin: left; }
.hpo-link svg, .hpo-link-underline svg { width: 16px; height: 16px; transition: transform .25s ease; }
.hpo-link:hover svg, .hpo-link-underline > a:hover svg { transform: translateX(2px); }

/* ------------------------------------------------------------ hero */

.hpo-page .hpo-hero-light {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: linear-gradient(to bottom, var(--hpo-surface), var(--hpo-bg) 55%);
}
.hpo-page .hpo-hero-light::before,
.hpo-page .hpo-hero-light::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: -1;
  filter: blur(64px);
}
.hpo-page .hpo-hero-light::before {
  right: -10rem; top: -10rem;
  width: 520px; height: 520px;
  background: rgba(18, 146, 192, 0.07);
}
.hpo-page .hpo-hero-light::after {
  left: -10rem; bottom: -6rem;
  width: 460px; height: 460px;
  background: rgba(26, 59, 85, 0.06);
}

.hpo-page .hpo-hero-dark {
  position: relative;
  overflow: hidden;
  background-color: var(--hpo-primary);
  z-index: 0;
}
.hpo-page .hpo-hero-dark::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, rgba(19, 48, 71, 0.95) 0%, rgba(19, 48, 71, 0.76) 100%);
  pointer-events: none;
  z-index: 1;
}
.hpo-page .hpo-hero-dark > * { position: relative; z-index: 2; }

/* ------------------------------------------------------------ cards */

.hpo-page .hpo-card {
  background: var(--hpo-card);
  border: 1px solid var(--hpo-line);
  border-radius: var(--hpo-r-lg);
  transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.hpo-page .hpo-card-hover:hover {
  transform: translateY(-2px);
  border-color: rgba(26, 59, 85, 0.3);
  box-shadow: var(--hpo-lift);
}

.hpo-icon-tile {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  border-radius: var(--hpo-r-md);
  background: var(--hpo-surface);
  color: var(--hpo-primary);
  transition: background .3s ease, color .3s ease;
}
.hpo-icon-tile svg { width: 20px; height: 20px; }
.hpo-card-hover:hover .hpo-icon-tile { background: var(--hpo-primary); color: var(--hpo-primary-on); }
.hpo-icon-tile-accent { background: var(--hpo-accent-soft); color: var(--hpo-accent); }
.hpo-icon-inline { color: var(--hpo-accent); display: inline-flex; }
.hpo-icon-inline svg { width: 16px; height: 16px; }

.hpo-counter { font-size: 12px; font-weight: 500; font-variant-numeric: tabular-nums; color: var(--hpo-muted); }

.hpo-card-list ul, ul.hpo-card-list { margin: 0; padding: 0; list-style: none; }
.hpo-card-list li { padding: 4px 0; font-size: 0.9375rem; color: var(--hpo-ink); }
.hpo-card-more { font-size: 0.8125rem; color: var(--hpo-muted); }

/* ------------------------------------------------------- list rows */

.hpo-page .hpo-rows {
  display: flex !important;
  flex-direction: column;
  gap: 1px !important;
  background: var(--hpo-line);
  border: 1px solid var(--hpo-line);
  border-radius: var(--hpo-r-md);
  overflow: hidden;
}
.hpo-page .hpo-rows > * { background: var(--hpo-card); }
.hpo-page .hpo-row {
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  gap: 16px !important;
  align-items: start;
}
.hpo-row-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  border-radius: var(--hpo-r-pill);
  border: 1px solid var(--hpo-line);
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--hpo-primary);
}
.hpo-row-dot {
  display: inline-block;
  width: 8px; height: 8px;
  margin-top: 9px;
  border-radius: 50%;
  background: var(--hpo-accent);
  flex-shrink: 0;
}

/* ----------------------------------------------- hero detail strip */

.hpo-page .hpo-factbar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center;
  gap: 14px 24px !important;
  border-top: 1px solid var(--hpo-line);
}
.hpo-fact { display: inline-flex; align-items: center; gap: 10px; font-size: 0.875rem; color: var(--hpo-muted); }
.hpo-fact b { display: block; font-weight: 400; color: var(--hpo-ink); line-height: 1.3; }
.hpo-fact .hpo-fact-sub { display: block; font-size: 0.75rem; color: var(--hpo-muted); }
.hpo-fact-avatar {
  width: 34px; height: 34px;
  border-radius: 50%;
  flex-shrink: 0;
  object-fit: cover;
  object-position: 50% 12%;
  box-shadow: 0 0 0 1px var(--hpo-line);
}
.hpo-fact-sep { width: 1px; height: 30px; background: var(--hpo-line); }
@media (max-width: 767px) { .hpo-fact-sep { display: none; } }
.hpo-fact-circle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px; height: 34px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--hpo-surface);
  color: var(--hpo-primary);
  box-shadow: inset 0 0 0 1px var(--hpo-line);
  transition: background .25s ease, color .25s ease, box-shadow .25s ease;
}
a.hpo-fact:hover .hpo-fact-circle {
  background: rgba(18, 146, 192, 0.15);
  color: var(--hpo-accent);
  box-shadow: inset 0 0 0 1px rgba(18, 146, 192, 0.4);
}
a.hpo-fact:hover b { color: var(--hpo-accent); }

/* -------------------------------------------------------- images */

.hpo-img {
  position: relative;
  border-radius: var(--hpo-r-lg);
  overflow: hidden;
  background-color: var(--hpo-surface);
  box-shadow: inset 0 0 0 1px var(--hpo-line);
}
.hpo-img-portrait { aspect-ratio: 4 / 5; }
.hpo-img-hero { aspect-ratio: 4 / 5; }
.hpo-img-band { aspect-ratio: 21 / 9; }
.hpo-img-wide { aspect-ratio: 3 / 2; }
@media (max-width: 767px) { .hpo-img-band { aspect-ratio: 16 / 10; } }

.hpo-img-caption {
  position: absolute;
  left: 16px; right: 16px; bottom: 16px;
  padding: 14px 16px;
  border: 1px solid var(--hpo-line);
  border-radius: var(--hpo-r-md);
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(8px);
  z-index: 2;
}
.hpo-img-caption b { display: block; font-size: 0.9375rem; font-weight: 600; color: var(--hpo-ink); line-height: 1.3; }
.hpo-img-caption span {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--hpo-accent);
}

/* --------------------------------------------------- dark CTA card */

.hpo-page .hpo-cta-card { background: var(--hpo-primary); border-radius: var(--hpo-r-lg); color: var(--hpo-primary-on); }
.hpo-page .hpo-cta-card h2, .hpo-page .hpo-cta-card h3 { color: var(--hpo-primary-on); }

/* ---------------------------------------------- layout utilities */

.hpo-page .hpo-cols-3,
.hpo-page .hpo-cols-3-card {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 20px !important;
  align-items: stretch;
}
.hpo-page .hpo-cols-2 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: clamp(28px, 4vw, 56px) !important;
  align-items: start;
}
.hpo-page .hpo-cols-2-center {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: clamp(32px, 4.5vw, 64px) !important;
  align-items: center;
}
.hpo-page .hpo-cols-2-end {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: clamp(24px, 4vw, 48px) !important;
  align-items: end;
}
.hpo-page .hpo-cols-2-tight {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  align-items: start;
}
.hpo-page .hpo-split-7-5 {
  display: grid !important;
  grid-template-columns: 7fr 5fr !important;
  gap: clamp(32px, 4.5vw, 64px) !important;
  align-items: center;
}
.hpo-page .hpo-split-5-7 {
  display: grid !important;
  grid-template-columns: 5fr 7fr !important;
  gap: clamp(32px, 4.5vw, 64px) !important;
  align-items: center;
}
.hpo-page .hpo-split-6-6 {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: clamp(32px, 4.5vw, 64px) !important;
  align-items: center;
}
.hpo-page .hpo-split-start { align-items: start !important; }
.hpo-page .hpo-grid-hairline {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1px !important;
  background: var(--hpo-line);
  border: 1px solid var(--hpo-line);
  border-radius: var(--hpo-r-lg);
  overflow: hidden;
  align-items: stretch;
}
.hpo-page .hpo-grid-hairline > * { background: var(--hpo-card); transition: background .3s ease; }
.hpo-page .hpo-grid-hairline > *:hover { background: var(--hpo-surface); }
.hpo-page .hpo-grid-hairline-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }

.hpo-page .hpo-split-label {
  display: grid !important;
  grid-template-columns: minmax(150px, 220px) 1fr !important;
  gap: clamp(16px, 3vw, 40px) !important;
  align-items: start;
}
.hpo-page .hpo-split-heading {
  display: grid !important;
  grid-template-columns: minmax(220px, 1fr) 2fr !important;
  gap: clamp(20px, 4vw, 56px) !important;
  align-items: start;
}
.hpo-page .hpo-cta-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
  align-items: center;
  justify-content: space-between;
}
.hpo-page .hpo-btn-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  align-items: center;
}
.hpo-page .hpo-inline {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center;
  gap: 12px 20px !important;
}

@media (max-width: 1023px) {
  .hpo-page .hpo-split-7-5,
  .hpo-page .hpo-split-5-7,
  .hpo-page .hpo-split-6-6,
  .hpo-page .hpo-cols-2,
  .hpo-page .hpo-cols-2-center,
  .hpo-page .hpo-cols-2-end { grid-template-columns: minmax(0, 1fr) !important; }
  .hpo-page .hpo-split-5-7 > *:first-child { order: -1; }
}
/* Three-up needs real width; below 1024 it drops to two, below 768 to one. */
@media (max-width: 1023px) {
  .hpo-page .hpo-cols-3,
  .hpo-page .hpo-cols-3-card,
  .hpo-page .hpo-grid-hairline { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .hpo-page .hpo-split-heading { grid-template-columns: minmax(0, 1fr) !important; }
}
@media (max-width: 767px) {
  .hpo-page .hpo-cols-3,
  .hpo-page .hpo-cols-3-card,
  .hpo-page .hpo-grid-hairline,
  .hpo-page .hpo-cols-2-tight { grid-template-columns: minmax(0, 1fr) !important; }
  .hpo-page .hpo-split-label { grid-template-columns: minmax(0, 1fr) !important; gap: 4px !important; }
  .hpo-page .hpo-cta-row { flex-direction: column; align-items: stretch; }
  .hpo-page .hpo-cta-row .hpo-btn { width: 100%; }
}

.hpo-plain-list ul, ul.hpo-plain-list { margin: 0; padding: 0; list-style: none; }
.hpo-plain-list li { margin: 0 0 8px; }
.hpo-plain-list li:last-child { margin-bottom: 0; }
.hpo-divided-list li { padding: 12px 0; border-bottom: 1px solid var(--hpo-border); }
.hpo-divided-list li:last-child { border-bottom: none; }

/* ------------------------------------------------- section padding */

.hpo-page .hpo-sec-base { padding-left: var(--hpo-gutter) !important; padding-right: var(--hpo-gutter) !important; }
.hpo-page .hpo-sec { padding-top: var(--hpo-section) !important; padding-bottom: var(--hpo-section) !important; }
.hpo-page .hpo-sec-md { padding-top: clamp(56px, 7vw, 100px) !important; padding-bottom: clamp(56px, 7vw, 100px) !important; }
.hpo-page .hpo-sec-sm { padding-top: clamp(48px, 6vw, 88px) !important; padding-bottom: clamp(48px, 6vw, 88px) !important; }
.hpo-page .hpo-sec-xs { padding-top: clamp(40px, 5vw, 72px) !important; padding-bottom: clamp(40px, 5vw, 72px) !important; }
.hpo-page .hpo-sec-hero { padding-top: clamp(56px, 9vw, 128px) !important; padding-bottom: clamp(56px, 9vw, 128px) !important; }
.hpo-page .hpo-sec-hero-page { padding-top: clamp(56px, 8vw, 104px) !important; padding-bottom: clamp(56px, 8vw, 104px) !important; }
.hpo-page .hpo-sec-intro { padding-top: clamp(48px, 7vw, 96px) !important; padding-bottom: clamp(36px, 4vw, 56px) !important; }
.hpo-page .hpo-sec-intro-wide { padding-top: clamp(48px, 7vw, 96px) !important; padding-bottom: clamp(40px, 5vw, 64px) !important; }
.hpo-page .hpo-sec-body { padding-top: 0 !important; padding-bottom: clamp(64px, 8vw, 112px) !important; }
.hpo-page .hpo-sec-legal { padding-top: clamp(48px, 7vw, 96px) !important; padding-bottom: clamp(64px, 8vw, 112px) !important; }
.hpo-page .hpo-sec-band { padding-top: 0 !important; padding-bottom: 0 !important; }

.hpo-page .hpo-sec-line-top { border-top: 1px solid var(--hpo-line); }
.hpo-page .hpo-sec-line-bottom { border-bottom: 1px solid var(--hpo-line); }

.hpo-page [class*="hpo-cols"] > * + *,
.hpo-page [class*="hpo-split"] > * + *,
.hpo-page .hpo-grid-hairline > * + *,
.hpo-page .hpo-rows > * + *,
.hpo-page .hpo-row > * + *,
.hpo-page .hpo-cta-row > * + *,
.hpo-page .hpo-factbar > * + *,
.hpo-page .hpo-inline > * + * { margin-block-start: 0 !important; }

/* ---------------------------------------------------- accordion */

.hpo-page .hpo-acc { border-top: 1px solid var(--hpo-line); gap: 0 !important; }
.hpo-page .hpo-acc > .wp-block-spectra-accordion-child-item {
  border: none !important;
  border-bottom: 1px solid var(--hpo-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  margin: 0 !important;
}
.hpo-page .hpo-acc .wp-block-spectra-accordion-child-header,
.hpo-page .hpo-acc button {
  width: 100%;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  text-align: left;
  padding: clamp(20px, 2.2vw, 28px) 0 !important;
  min-height: 60px;
  cursor: pointer;
  color: var(--hpo-ink);
  display: flex;
  align-items: baseline;
  gap: 20px;
  justify-content: space-between;
  transition: color .25s ease;
}
.hpo-page .hpo-acc button:hover { color: var(--hpo-accent); background: none !important; }
.hpo-page .hpo-acc button:hover .hpo-acc-title { color: var(--hpo-accent); }
.hpo-acc-num {
  font-size: 12px; font-weight: 500; letter-spacing: 0.08em;
  font-variant-numeric: tabular-nums; color: var(--hpo-muted);
  flex-shrink: 0; width: 34px; display: inline-block;
}
.hpo-acc-title { font-size: clamp(1.125rem, 1.9vw, 1.5rem); letter-spacing: -0.015em; font-weight: 500; flex: 1; }
.hpo-page .hpo-acc .wp-block-spectra-accordion-child-header-icon { color: var(--hpo-muted); flex-shrink: 0; }
.hpo-page .hpo-acc .hpo-acc-body { padding: 0 0 clamp(24px, 3vw, 40px) 54px; max-width: 820px; }
.hpo-page .hpo-acc-body > *:first-child { margin-top: 0 !important; }
@media (max-width: 599px) {
  .hpo-page .hpo-acc .hpo-acc-body { padding-left: 0; }
  .hpo-acc-num { width: 26px; }
}

/* ---------------------------------------------------- SureForms */

.hpo-page .srfm-form-container { background: transparent; padding: 0; }
.hpo-page .srfm-input-common,
.hpo-page .srfm-input-textarea,
.hpo-page input[type="text"], .hpo-page input[type="email"],
.hpo-page input[type="tel"], .hpo-page textarea {
  border: 1px solid var(--hpo-border) !important;
  border-radius: var(--hpo-r-md) !important;
  background: var(--hpo-card) !important;
  padding: 13px 16px !important;
  font-size: 16px !important;
  min-height: 50px;
  color: var(--hpo-ink) !important;
  box-shadow: none !important;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.hpo-page .srfm-input-common:focus,
.hpo-page .srfm-input-textarea:focus,
.hpo-page input:focus, .hpo-page textarea:focus {
  border-color: var(--hpo-accent) !important;
  outline: none;
  box-shadow: 0 0 0 3px rgba(18, 146, 192, 0.15) !important;
}
.hpo-page .srfm-block-label, .hpo-page .srfm-block label {
  font-size: 14px; font-weight: 500; color: var(--hpo-ink); margin-bottom: 7px;
}
.hpo-page .srfm-submit-btn, .hpo-page .srfm-button {
  background: var(--hpo-primary) !important;
  color: var(--hpo-primary-on) !important;
  border: none !important;
  border-radius: var(--hpo-r-pill) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  padding: 0 28px !important;
  min-height: 48px;
  width: 100%;
  box-shadow: 0 8px 20px -12px rgba(26, 59, 85, 0.6);
  transition: background .25s ease, box-shadow .25s ease;
}
.hpo-page .srfm-submit-btn:hover, .hpo-page .srfm-button:hover {
  background: var(--hpo-primary-hover) !important;
  box-shadow: var(--hpo-lift);
}
.hpo-page .srfm-success-box, .hpo-page .srfm-success-message {
  border: 1px solid rgba(34, 124, 69, 0.35);
  background: #EDF7F1;
  color: #1D442C;
  border-radius: var(--hpo-r-md);
  padding: 16px 18px;
  font-size: 15px;
}

/* ------------------------------------------------------- footer */

.site-footer, .ast-footer-overlay { background: var(--hpo-primary); }
.site-footer, .site-footer p, .site-footer .widget { color: var(--hpo-on-dark-body); }
.site-footer a { color: var(--hpo-on-dark-lead); transition: color .2s ease; }
.site-footer a:hover { color: #fff; }
.site-primary-footer-wrap > .ast-builder-grid-row-container-inner,
.site-below-footer-wrap > .ast-builder-grid-row-container-inner {
  max-width: var(--hpo-max);
  margin: 0 auto;
  padding-left: var(--hpo-gutter);
  padding-right: var(--hpo-gutter);
}
.site-primary-footer-wrap { padding-top: clamp(48px, 7vw, 88px); padding-bottom: 32px; }
.site-below-footer-wrap {
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  padding-top: 24px;
  padding-bottom: clamp(36px, 5vw, 56px);
  font-size: 14px;
  color: #9FB3C1;
}
.hpo-foot-label {
  display: block;
  font-size: 11.5px; font-weight: 600; letter-spacing: 0.22em;
  text-transform: uppercase; color: #8FA5B4; margin-bottom: 18px;
}
.hpo-foot-logo {
  height: 52px; width: auto; display: block;
  margin-bottom: 22px; background: #fff;
  padding: 8px 12px; border-radius: var(--hpo-r-md);
}
.site-footer .widget-title, .site-footer .widget h2 {
  font-size: 11.5px; font-weight: 600; letter-spacing: 0.22em;
  text-transform: uppercase; color: #8FA5B4; margin: 0 0 18px;
}
.site-footer .widget_nav_menu ul, .site-footer .footer-widget-area ul {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 11px;
}
.site-footer .widget_nav_menu li { margin: 0; }
.site-primary-footer-wrap .ast-builder-grid-row > *,
.site-primary-footer-wrap .footer-widget-area,
.site-primary-footer-wrap .widget {
  text-align: left; align-items: flex-start; justify-content: flex-start;
}
.site-below-footer-wrap .ast-builder-grid-row { display: block !important; text-align: left; }
.site-below-footer-wrap .ast-builder-grid-row-container-inner,
.site-below-footer-wrap .site-footer-section,
.site-below-footer-wrap .ast-footer-copyright,
.site-below-footer-wrap .ast-footer-copyright > * { width: 100%; }
.hpo-copy-row {
  display: flex; flex-wrap: wrap; gap: 14px 28px;
  align-items: center; justify-content: space-between; width: 100%;
}
.hpo-copy-links { display: flex; flex-wrap: wrap; gap: 24px; }

/* --------------------------------------------- mobile action bar */

.hpo-sticky-cta { display: none; }

@media (max-width: 1079px) {
  .hpo-sticky-cta {
    display: flex;
    position: fixed;
    bottom: 0; left: 0; right: 0;
    z-index: 60;
    width: 100%;
    max-width: 100vw;
    background: rgba(250, 253, 255, 0.94);
    backdrop-filter: blur(12px);
    border-top: 1px solid var(--hpo-line);
    padding: 10px 12px;
    gap: 10px;
  }
  .hpo-sticky-cta .hpo-btn { flex: 1; height: 48px; padding: 0 12px; font-size: 14.5px; }
  body { padding-bottom: 72px; }
  .hpo-drawer-open .hpo-sticky-cta { display: none; }
}

/* --------------------------------------------------- back to top */

.hpo-top {
  position: fixed;
  right: 20px; bottom: 20px;
  z-index: 55;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px; height: 44px;
  border-radius: var(--hpo-r-pill);
  border: 1px solid var(--hpo-line);
  background: rgba(255, 255, 255, 0.92);
  color: var(--hpo-primary);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  box-shadow: var(--hpo-lift-soft);
  transition: opacity .3s ease, transform .3s ease, visibility .3s ease, background .2s ease;
}
.hpo-top:hover { background: #fff; }
.hpo-scrolled .hpo-top { opacity: 1; visibility: visible; transform: none; }
@media (max-width: 1079px) { .hpo-top { bottom: 84px; } }

/* --------------------------------------------------- reveal */

@media (prefers-reduced-motion: no-preference) {
  .hpo-js .hpo-reveal { transition: opacity .7s cubic-bezier(.22, 1, .36, 1), transform .7s cubic-bezier(.22, 1, .36, 1); }
  .hpo-js .hpo-reveal:not(.hpo-revealed) { opacity: 0; transform: translateY(16px); }
}

/* --------------------------------------------------------- print */

@media print {
  .site-header, .site-footer, .hpo-sticky-cta, .hpo-top, .hpo-drawer, .hpo-drawer-backdrop { display: none !important; }
  .hpo-reveal { opacity: 1 !important; transform: none !important; }
  body { background: #fff !important; padding-bottom: 0; font-size: 12pt; }
  .hpo-page .hpo-card, .hpo-page .hpo-rows > * { break-inside: avoid; }
}

/* ------------------------------------------------- page components */

.hpo-page .hpo-card-top {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 12px !important;
}
.hpo-page .hpo-service-card { display: flex; flex-direction: column; }
.hpo-page .hpo-card-listing { flex: 1 1 auto; }

/* Opening hours rows sit inside the shared rounded frame. */
.hpo-page .hpo-hours-row {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  gap: 16px !important;
  align-items: baseline;
}
.hpo-hours-closed { color: var(--hpo-accent) !important; }

/* Dark CTA card internals */
.hpo-page .hpo-cta-card-actions { display: flex !important; flex-direction: column; }
.hpo-page .hpo-cta-card .hpo-btn { width: 100%; }
.hpo-page .hpo-cta-icon svg { width: 26px; height: 26px; }

/* Hero contact line: the status chip trails to the right where there is room. */
@media (min-width: 900px) {
  .hpo-page .hpo-hero-contact .hpo-status { margin-left: auto; }
}

/* ---------------------------------------------------- inline icons */

.hpo-i {
  display: inline-block;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: var(--hpo-ico) center / contain no-repeat;
  mask: var(--hpo-ico) center / contain no-repeat;
}
.hpo-i-lg { width: 20px; height: 20px; }
.hpo-i-xl { width: 26px; height: 26px; }
.hpo-i-activity { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M22%2012h-2.48a2%202%200%200%200-1.93%201.46l-2.35%208.36a.25.25%200%200%201-.48%200L9.24%202.18a.25.25%200%200%200-.48%200l-2.35%208.36A2%202%200%200%201%204.49%2012H2%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-arrow-right { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M5%2012h14%22%2F%3E%3Cpath%20d%3D%22m12%205%207%207-7%207%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-arrow-up { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22m5%2012%207-7%207%207%22%2F%3E%3Cpath%20d%3D%22M12%2019V5%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-building { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M6%2022V4a2%202%200%200%201%202-2h8a2%202%200%200%201%202%202v18Z%22%2F%3E%3Cpath%20d%3D%22M6%2012H4a2%202%200%200%200-2%202v6a2%202%200%200%200%202%202h2%22%2F%3E%3Cpath%20d%3D%22M18%209h2a2%202%200%200%201%202%202v9a2%202%200%200%201-2%202h-2%22%2F%3E%3Cpath%20d%3D%22M10%206h4%22%2F%3E%3Cpath%20d%3D%22M10%2010h4%22%2F%3E%3Cpath%20d%3D%22M10%2014h4%22%2F%3E%3Cpath%20d%3D%22M10%2018h4%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-bus { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M8%206v6%22%2F%3E%3Cpath%20d%3D%22M15%206v6%22%2F%3E%3Cpath%20d%3D%22M2%2012h19.6%22%2F%3E%3Cpath%20d%3D%22M18%2018h3s.5-1.7.8-2.8c.1-.4.2-.8.2-1.2%200-.4-.1-.8-.2-1.2l-1.4-5C20.1%206.8%2019.1%206%2018%206H4a2%202%200%200%200-2%202v10h3%22%2F%3E%3Ccircle%20cx%3D%227%22%20cy%3D%2218%22%20r%3D%222%22%2F%3E%3Cpath%20d%3D%22M9%2018h5%22%2F%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2218%22%20r%3D%222%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-calendar-check { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M8%202v4%22%2F%3E%3Cpath%20d%3D%22M16%202v4%22%2F%3E%3Crect%20width%3D%2218%22%20height%3D%2218%22%20x%3D%223%22%20y%3D%224%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M3%2010h18%22%2F%3E%3Cpath%20d%3D%22m9%2016%202%202%204-4%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-car { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M19%2017h2c.6%200%201-.4%201-1v-3c0-.9-.7-1.7-1.5-1.9C18.7%2010.6%2016%2010%2016%2010s-1.3-1.4-2.2-2.3c-.5-.4-1.1-.7-1.8-.7H5c-.6%200-1.1.4-1.4.9l-1.4%202.9A3.7%203.7%200%200%200%202%2012v4c0%20.6.4%201%201%201h2%22%2F%3E%3Ccircle%20cx%3D%227%22%20cy%3D%2217%22%20r%3D%222%22%2F%3E%3Cpath%20d%3D%22M9%2017h6%22%2F%3E%3Ccircle%20cx%3D%2217%22%20cy%3D%2217%22%20r%3D%222%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-chevron-right { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22m9%2018%206-6-6-6%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-clock { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22%2F%3E%3Cpath%20d%3D%22M12%206v6l4%202%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-file-text { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M15%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V7Z%22%2F%3E%3Cpath%20d%3D%22M14%202v4a2%202%200%200%200%202%202h4%22%2F%3E%3Cpath%20d%3D%22M10%209H8%22%2F%3E%3Cpath%20d%3D%22M16%2013H8%22%2F%3E%3Cpath%20d%3D%22M16%2017H8%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-flask { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M10%202v7.31%22%2F%3E%3Cpath%20d%3D%22M14%209.3V1.99%22%2F%3E%3Cpath%20d%3D%22M8.5%202h7%22%2F%3E%3Cpath%20d%3D%22M14%209.3a6.5%206.5%200%201%201-4%200%22%2F%3E%3Cpath%20d%3D%22M5.52%2016h12.96%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-gauge { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22m12%2014%204-4%22%2F%3E%3Cpath%20d%3D%22M3.34%2019a10%2010%200%201%201%2017.32%200%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-graduation-cap { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M21.42%2010.922a1%201%200%200%200-.019-1.838L12.83%205.18a2%202%200%200%200-1.66%200L2.6%209.08a1%201%200%200%200%200%201.832l8.57%203.908a2%202%200%200%200%201.66%200z%22%2F%3E%3Cpath%20d%3D%22M22%2010v6%22%2F%3E%3Cpath%20d%3D%22M6%2012.5V16a6%203%200%200%200%2012%200v-3.5%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-hand-heart { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M11%2014h2a2%202%200%201%200%200-4h-3c-.6%200-1.1.2-1.4.6L3%2016%22%2F%3E%3Cpath%20d%3D%22m7%2020%201.6-1.4c.3-.4.8-.6%201.4-.6h4c1.1%200%202.1-.4%202.8-1.2l4.6-4.4a2%202%200%200%200-2.75-2.91l-4.2%203.9%22%2F%3E%3Cpath%20d%3D%22m2%2015%206%206%22%2F%3E%3Cpath%20d%3D%22M19.5%208.5c.7-.7%201.5-1.6%201.5-2.7A2.7%202.7%200%200%200%2016%204a2.7%202.7%200%200%200-5%201.8c0%201.1.8%202%201.5%202.7L16%2012Z%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-heart-pulse { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M19%2014c1.49-1.46%203-3.21%203-5.5A5.5%205.5%200%200%200%2016.5%203c-1.76%200-3%20.5-4.5%202-1.5-1.5-2.74-2-4.5-2A5.5%205.5%200%200%200%202%208.5c0%202.3%201.5%204.05%203%205.5l7%207Z%22%2F%3E%3Cpath%20d%3D%22M3.22%2013H9.5l.5-1%202%204.5%202-7%201.5%203.5h5.27%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-hospital { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M12%206v4%22%2F%3E%3Cpath%20d%3D%22M14%2014h-4%22%2F%3E%3Cpath%20d%3D%22M14%2018h-4%22%2F%3E%3Cpath%20d%3D%22M14%208h-4%22%2F%3E%3Cpath%20d%3D%22M18%2012h2a2%202%200%200%201%202%202v6a2%202%200%200%201-2%202H4a2%202%200%200%201-2-2v-6a2%202%200%200%201%202-2h2%22%2F%3E%3Cpath%20d%3D%22M18%2022V4a2%202%200%200%200-2-2H8a2%202%200%200%200-2%202v18%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-mail { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Crect%20width%3D%2220%22%20height%3D%2216%22%20x%3D%222%22%20y%3D%224%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22m22%207-8.97%205.7a1.94%201.94%200%200%201-2.06%200L2%207%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-map-pin { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M20%2010c0%204.993-5.539%2010.193-7.399%2011.799a1%201%200%200%201-1.202%200C9.539%2020.193%204%2014.993%204%2010a8%208%200%200%201%2016%200%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2210%22%20r%3D%223%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-menu { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M4%206h16%22%2F%3E%3Cpath%20d%3D%22M4%2012h16%22%2F%3E%3Cpath%20d%3D%22M4%2018h16%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-message-square { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M21%2015a2%202%200%200%201-2%202H7l-4%204V5a2%202%200%200%201%202-2h14a2%202%200%200%201%202%202z%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-microscope { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M6%2018h8%22%2F%3E%3Cpath%20d%3D%22M3%2022h18%22%2F%3E%3Cpath%20d%3D%22M14%2022a7%207%200%201%200%200-14h-1%22%2F%3E%3Cpath%20d%3D%22M9%2014h2%22%2F%3E%3Cpath%20d%3D%22M9%2012a2%202%200%200%201-2-2V6h6v4a2%202%200%200%201-2%202Z%22%2F%3E%3Cpath%20d%3D%22M12%206V3a1%201%200%200%200-1-1H9a1%201%200%200%200-1%201v3%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-phone { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M22%2016.92v3a2%202%200%200%201-2.18%202%2019.79%2019.79%200%200%201-8.63-3.07%2019.5%2019.5%200%200%201-6-6%2019.79%2019.79%200%200%201-3.07-8.67A2%202%200%200%201%204.11%202h3a2%202%200%200%201%202%201.72%2012.84%2012.84%200%200%200%20.7%202.81%202%202%200%200%201-.45%202.11L8.09%209.91a16%2016%200%200%200%206%206l1.27-1.27a2%202%200%200%201%202.11-.45%2012.84%2012.84%200%200%200%202.81.7A2%202%200%200%201%2022%2016.92z%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-shield-check { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M20%2013c0%205-3.5%207.5-7.66%208.95a1%201%200%200%201-.67-.01C7.5%2020.5%204%2018%204%2013V6a1%201%200%200%201%201-1c2%200%204.5-1.2%206.24-2.72a1.17%201.17%200%200%201%201.52%200C14.51%203.81%2017%205%2019%205a1%201%200%200%201%201%201z%22%2F%3E%3Cpath%20d%3D%22m9%2012%202%202%204-4%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-siren { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M7%2018v-6a5%205%200%201%201%2010%200v6%22%2F%3E%3Cpath%20d%3D%22M5%2021a1%201%200%200%200%201%201h12a1%201%200%200%200%201-1v-1a2%202%200%200%200-2-2H7a2%202%200%200%200-2%202z%22%2F%3E%3Cpath%20d%3D%22M21%2012h1%22%2F%3E%3Cpath%20d%3D%22M18.5%204.5%2018%205%22%2F%3E%3Cpath%20d%3D%22M2%2012h1%22%2F%3E%3Cpath%20d%3D%22M12%202v1%22%2F%3E%3Cpath%20d%3D%22m4.929%204.929.707.707%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-stethoscope { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M11%202v2%22%2F%3E%3Cpath%20d%3D%22M5%202v2%22%2F%3E%3Cpath%20d%3D%22M5%203H4a2%202%200%200%200-2%202v4a6%206%200%200%200%2012%200V5a2%202%200%200%200-2-2h-1%22%2F%3E%3Cpath%20d%3D%22M8%2015a6%206%200%200%200%2012%200v-3%22%2F%3E%3Ccircle%20cx%3D%2220%22%20cy%3D%2210%22%20r%3D%222%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-user-round { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%225%22%2F%3E%3Cpath%20d%3D%22M20%2021a8%208%200%200%200-16%200%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-users { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M16%2021v-2a4%204%200%200%200-4-4H6a4%204%200%200%200-4%204v2%22%2F%3E%3Ccircle%20cx%3D%229%22%20cy%3D%227%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22M22%2021v-2a4%204%200%200%200-3-3.87%22%2F%3E%3Cpath%20d%3D%22M16%203.13a4%204%200%200%201%200%207.75%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-waves { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M2%206c.6.5%201.2%201%202.5%201C7%207%207%205%209.5%205c2.6%200%202.4%202%205%202%201.3%200%201.9-.5%202.5-1%22%2F%3E%3Cpath%20d%3D%22M2%2012c.6.5%201.2%201%202.5%201%202.5%200%202.5-2%205-2%202.6%200%202.4%202%205%202%201.3%200%201.9-.5%202.5-1%22%2F%3E%3Cpath%20d%3D%22M2%2018c.6.5%201.2%201%202.5%201%202.5%200%202.5-2%205-2%202.6%200%202.4%202%205%202%201.3%200%201.9-.5%202.5-1%22%2F%3E%3C%2Fsvg%3E"); }
.hpo-i-x { --hpo-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M18%206%206%2018%22%2F%3E%3Cpath%20d%3D%22m6%206%2012%2012%22%2F%3E%3C%2Fsvg%3E"); }

/* The logged-in admin bar overlays fixed elements; keep the drawer clear of it. */
.admin-bar .hpo-drawer, .admin-bar .hpo-drawer-backdrop { top: 32px; }
@media (max-width: 782px) {
  .admin-bar .hpo-drawer, .admin-bar .hpo-drawer-backdrop { top: 46px; }
}

/* Pull quote, centred under its icon. */
.hpo-page .hpo-quote-block { text-align: center; }
.hpo-page .hpo-quote-block .hpo-quote-icon { justify-content: center !important; }
.hpo-page .hpo-quote-icon svg { width: 30px; height: 30px; }
.hpo-pullquote {
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  line-height: 1.22;
  letter-spacing: -0.02em;
  font-weight: 500;
  color: var(--hpo-ink);
  border: none;
  padding: 0;
  quotes: none;
  font-style: normal;
}

/* Contact page */
.hpo-contact-lg a { font-size: clamp(1.25rem, 2vw, 1.5rem); font-weight: 600; color: var(--hpo-ink); }
.hpo-contact-lg a:hover { color: var(--hpo-accent); }
.hpo-contact-md a { font-size: 1rem; font-weight: 500; color: var(--hpo-ink); word-break: break-all; }
.hpo-contact-md a:hover { color: var(--hpo-accent); }
.hpo-address { line-height: 1.6; color: var(--hpo-ink); font-size: 1rem; }
.hpo-form-note { color: var(--hpo-muted); }
.hpo-page .hpo-contact-grid { align-items: start !important; }

/* The band image on the Praxis page bleeds to the grid, not the viewport. */
.hpo-page .hpo-praxis-band { padding-top: clamp(32px, 4vw, 56px) !important; }

/* Behandlungen: procedure cards keep their icon top-aligned. */
.hpo-page .hpo-row > .hpo-icon-tile { align-self: start; }