
/* v22 isolated header fix */
.v22-header, .v22-header * { box-sizing:border-box; }
.v22-header {
  position:sticky;
  top:0;
  z-index:1000;
  width:100%;
  background:rgba(255,255,255,.97);
  border-bottom:1px solid #ece6ed;
  box-shadow:0 5px 24px rgba(37,25,39,.055);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.v22-header-row {
  height:58px;
  display:flex;
  align-items:center;
  gap:24px;
}
.v22-brand {
  flex:0 0 auto;
  min-width:220px;
  display:flex;
  align-items:center;
  gap:9px;
  color:#1d1920;
  text-decoration:none;
}
.v22-brand img {
  width:45px;
  height:41px;
  object-fit:contain;
  display:block;
}
.v22-brand span { display:flex; flex-direction:column; min-width:0; }
.v22-brand strong {
  font-size:12px;
  line-height:1.1;
  letter-spacing:-.015em;
  white-space:nowrap;
}
.v22-brand small {
  margin-top:3px;
  color:#8a818c;
  font-size:8px;
  font-weight:650;
  white-space:nowrap;
}
.v22-nav {
  flex:1 1 auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:22px;
  min-width:0;
}
.v22-nav > a,
.v22-services-button {
  position:relative;
  appearance:none;
  border:0;
  background:none;
  padding:8px 0;
  color:#49414b;
  text-decoration:none;
  font:800 10px/1.2 Manrope,Arial,sans-serif;
  white-space:nowrap;
  cursor:pointer;
}
.v22-nav > a:hover,
.v22-services-button:hover,
.v22-services-button[aria-expanded="true"] { color:#7f168a; }
.v22-nav > a::after,
.v22-services-button::after {
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:1px;
  height:2px;
  background:#7f168a;
  transition:right .2s ease;
}
.v22-nav > a:hover::after,
.v22-services-button:hover::after,
.v22-services-button[aria-expanded="true"]::after { right:0; }
.v22-services-button > span {
  display:inline-block;
  margin-left:4px;
  transition:transform .2s ease;
}
.v22-services-button[aria-expanded="true"] > span { transform:rotate(180deg); }

.v22-phone {
  flex:0 0 auto;
  height:36px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:0 11px;
  border:1px solid #ddcfe0;
  border-radius:9px;
  background:#fff;
  color:#65106e;
  text-decoration:none;
  box-shadow:0 4px 15px rgba(84,30,91,.035);
}
.v22-phone span { font-size:13px; line-height:1; }
.v22-phone strong { font-size:10px; white-space:nowrap; }
.v22-phone:hover { border-color:#b989bf; background:#fcf8fd; }

.v22-menu-button {
  display:none;
  width:36px;
  height:36px;
  flex:0 0 36px;
  padding:7px;
  border:1px solid #e4dce5;
  border-radius:9px;
  background:#fff;
  cursor:pointer;
}
.v22-menu-button i {
  display:block;
  width:19px;
  height:2px;
  margin:4px auto;
  background:#403743;
  transition:transform .2s, opacity .2s;
}
.v22-menu-button[aria-expanded="true"] i:nth-child(1) { transform:translateY(6px) rotate(45deg); }
.v22-menu-button[aria-expanded="true"] i:nth-child(2) { opacity:0; }
.v22-menu-button[aria-expanded="true"] i:nth-child(3) { transform:translateY(-6px) rotate(-45deg); }

/* The critical fix: the service panel is never part of normal layout when hidden. */
.v22-services-panel[hidden] { display:none !important; }
.v22-services-panel {
  position:absolute;
  left:0;
  right:0;
  top:100%;
  z-index:1001;
  max-height:min(420px, calc(100vh - 70px));
  overflow:auto;
  background:rgba(255,255,255,.995);
  border-bottom:1px solid #e6dee8;
  box-shadow:0 22px 48px rgba(38,25,40,.15);
}
.v22-services-grid {
  display:grid;
  grid-template-columns:1.25fr 1fr 1fr;
  gap:0;
  padding-top:17px;
  padding-bottom:18px;
}
.v22-services-grid section {
  min-width:0;
  padding:3px 24px 5px;
  border-left:1px solid #eee8ef;
}
.v22-services-grid section:first-child {
  padding-left:0;
  border-left:0;
}
.v22-services-grid p {
  margin:0 0 7px;
  color:#8a7d8d;
  font-size:8px;
  font-weight:800;
  letter-spacing:.15em;
}
.v22-services-grid a {
  display:block;
  padding:6px 8px;
  margin-left:-8px;
  border-radius:8px;
  color:#49404b;
  text-decoration:none;
  font-size:10px;
  font-weight:700;
  line-height:1.35;
}
.v22-services-grid a:hover { color:#7f168a; background:#faf4fb; }
.v22-services-grid .v22-service-main { margin-bottom:2px; }
.v22-service-main strong {
  display:block;
  color:#271f29;
  font-size:11px;
}
.v22-service-main small {
  display:block;
  margin-top:2px;
  color:#958a97;
  font-size:8px;
  font-weight:600;
}
.v22-muted-link {
  margin-top:5px !important;
  color:#817783 !important;
  border-top:1px solid #eee8ef;
  border-radius:0 !important;
  padding-top:9px !important;
}

/* Tablet / narrow desktop: use a compact burger instead of trying to squeeze the menu. */
@media (max-width:1050px) {
  .v22-header-row { height:56px; gap:12px; }
  .v22-brand { min-width:0; margin-right:auto; }
  .v22-brand img { width:41px; height:37px; }
  .v22-brand strong { font-size:11px; }
  .v22-brand small { display:none; }
  .v22-nav {
    display:none;
    position:absolute;
    left:0;
    right:0;
    top:100%;
    z-index:1000;
    padding:8px max(18px, calc((100vw - 1180px)/2));
    background:#fff;
    border-bottom:1px solid #e8e0e9;
    box-shadow:0 20px 36px rgba(35,24,37,.12);
  }
  .v22-header[data-menu-open="true"] .v22-nav {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:0;
  }
  .v22-nav > a,
  .v22-services-button {
    width:100%;
    min-height:43px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:10px 4px;
    border-bottom:1px solid #eee8ef;
    text-align:left;
    font-size:11px;
  }
  .v22-nav > a::after,
  .v22-services-button::after { display:none; }
  .v22-menu-button { display:block; }
  .v22-services-panel {
    position:fixed;
    top:56px;
    bottom:0;
    max-height:none;
    overflow:auto;
  }
  .v22-services-grid {
    grid-template-columns:1fr;
    width:min(100% - 28px, 700px);
    padding-top:10px;
    padding-bottom:22px;
  }
  .v22-services-grid section {
    padding:13px 2px;
    border-left:0;
    border-top:1px solid #eee8ef;
  }
  .v22-services-grid section:first-child { border-top:0; }
}
@media (max-width:600px) {
  .v22-header-row { height:52px; gap:7px; }
  .v22-brand img { width:37px; height:34px; }
  .v22-brand span { display:none; }
  .v22-phone { height:33px; padding:0 8px; }
  .v22-phone strong { font-size:9px; }
  .v22-phone span { display:none; }
  .v22-menu-button { width:34px; height:34px; flex-basis:34px; }
  .v22-services-panel { top:52px; }
}
