/* includes/style.css — Shared styles for WOHC header + pages */

/* ===== Base / Tokens ===== */
:root{
  --ink:#253735; --muted:#455a58; --panel:#ffffff; --brand:#253735; --hover:#17302d; --wrap:1240px;
  --bg-muted:#d9d9d9; --bg-soft:#f5f7f7;

  /* Opaque, soft gradient for shared muted band */
  --grad-muted: linear-gradient(180deg, #e9eceb 0%, #dcdfe0 100%);

  /* Header nav sizing token */
  --nav-size:.95rem;
}

* { box-sizing: border-box; }
body, h1, h2, h3, p, a, button {
  font-family:'Montserrat',system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif;
  color:var(--ink);
}
html, body { overflow-x:hidden; }
body{ margin:0; }
.wrap{ max-width:var(--wrap); margin:0 auto; padding:0 18px; }

/* ===== Section spacing helpers (prevents margin-collapsing gaps) ===== */
section.section { padding:40px 0; }
section.section > .wrap > :first-child { margin-top:0; }
section.section > .wrap > :last-child { margin-bottom:0; }

/* =======================================================================
   HEADER (scoped to #wohc-header)
   ======================================================================= */
#wohc-header *{ box-sizing:border-box; }
#wohc-header a{ color:inherit; text-decoration:none; }
#wohc-header .wrap{ max-width:1240px; margin:0 auto; padding:0 18px; }

/* ===== Notice (scrolls away) ===== */
#wohc-header .notice{ background:#fff; border-bottom:1px solid rgba(37,55,53,.1); font-weight:700; }
#wohc-header .notice .inner{
  display:grid; grid-template-columns:1fr auto; align-items:center; padding:8px 0; column-gap:40px;
}
#wohc-header .badge{
  display:inline-flex; align-items:center; gap:8px;
  background:#e7f0ed; color:#17302d;
  padding:6px 12px; border-radius:999px;
  font-size:.82rem; font-weight:800; white-space:nowrap; max-width:100%; overflow:hidden;
}
#wohc-header .badge i{ font-size:.95rem; }

/* Rotating (fade swap) */
#wohc-header .rot{ display:inline-grid; position:relative; }
#wohc-header .rot .msg{ grid-area:1/1; opacity:0; transition:opacity .35s ease; animation-fill-mode:both; }
#wohc-header .rot .msg--a{ opacity:1; }
#wohc-header .rot .msg--a{ animation: wohc-fadeSwap 8s infinite; }
#wohc-header .rot .msg--b{ animation: wohc-fadeSwap 8s infinite 4s; }
@keyframes wohc-fadeSwap{ 0%{opacity:0} 8%{opacity:1} 40%{opacity:1} 50%{opacity:0} 100%{opacity:0} }
@media (prefers-reduced-motion: reduce){
  #wohc-header .rot .msg{ animation:none !important; }
  #wohc-header .rot .msg--a{ opacity:1; }
  #wohc-header .rot .msg--b{ display:none; }
}

#wohc-header .fax{ font-size:.95rem; font-weight:700; color:#17302d; white-space:nowrap; justify-self:end; }

/* Mobile tweaks for notice */
#wohc-header .t-mobile{ display:none; }
@media(max-width:859px){
  #wohc-header .notice .inner{
    grid-template-columns:auto auto; justify-content:space-between; column-gap:12px;
  }
  #wohc-header .fax{ font-size:.78rem; font-weight:600; color:#455a58; }
  #wohc-header .badge{ min-width:0; }
  #wohc-header .badge .rot{ display:inline-grid; max-width:100%; }
  #wohc-header .rot .msg{ white-space:nowrap; }
  #wohc-header .t-desktop{ display:none; }
  #wohc-header .t-mobile{ display:inline; }
}

/* ===== Floating Bar (fixed; smooth offset via transform) ===== */
#wohc-header .bar{
  position:fixed; left:0; right:0; top:0; z-index:60;
  transform: translateY(var(--barOffset, 0px));
  will-change: transform;
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: transform .32s cubic-bezier(.22,.7,.26,1);
  isolation: isolate;
}

/* Glass overlay (behind header content) */
#wohc-header .bar::after{
  content:"";
  position:absolute; inset:0;
  background: color-mix(in srgb, var(--panel) 70%, transparent);
  -webkit-backdrop-filter: saturate(1.2) blur(10px);
  backdrop-filter: saturate(1.2) blur(10px);
  border-bottom: 1px solid rgba(37,55,53,.10);
  box-shadow: 0 8px 30px rgba(0,0,0,.10);
  opacity:0;
  pointer-events:none;
  z-index:0;
  transition: opacity .28s ease;
}
#wohc-header .bar.is-glass::after{ opacity:1; }

/* Ensure all header content sits above the overlay */
#wohc-header .bar .inner{ position:relative; z-index:1; }

/* Spacer so page content doesn't hide under the fixed bar */
#wohc-header .bar-spacer{ height: var(--barHeight, 64px); }

/* Logo (desktop) */
#wohc-header .logo{ grid-area:logo; display:inline-flex; align-items:center; }
#wohc-header .logo img{ height:auto; max-height:48px; width:auto; max-width:100%; display:block; }

/* Bar layout */
#wohc-header .bar .inner{
  display:grid; grid-template-columns:auto 1fr auto; grid-template-areas:"logo cta menubtn";
  align-items:center; gap:10px; padding:10px 0;
}
@media(min-width:980px){
  #wohc-header .bar .inner{ grid-template-areas:"logo nav cta"; gap:14px; padding:12px 0; }
}

/* Mobile drawer logo left-aligned */
@media (max-width: 979px){
  #wohc-header .sheet { text-align:left; }
  #wohc-header .sheet .m-logo{ display:flex; align-items:center; justify-content:flex-start !important; gap:10px; margin:8px 0 6px; align-self:flex-start; }
  #wohc-header .m-logo img{
    display:block; width:clamp(140px, 60vw, 220px); max-width:100%; height:auto; max-height:56px; object-fit:contain;
  }
}

/* Desktop nav (scoped) */
nav[aria-label="Primary"]{ grid-area:nav; display:none; }
@media(min-width:980px){ nav[aria-label="Primary"]{ display:flex; } }
#wohc-header .nav{ display:flex; align-items:center; gap:18px; }
#wohc-header .nav > li{ position:relative; list-style:none; }
#wohc-header .link{
  display:inline-flex; align-items:center; gap:6px; padding:10px 12px; border-radius:10px;
  font-weight:700; font-size:var(--nav-size); line-height:1.2; background:none; border:none; cursor:pointer;
}
#wohc-header .link:hover, #wohc-header .link:focus-visible{ background:#eef3f2; outline:none; }
#wohc-header .chev{ font-size:.7rem; opacity:.7; }

/* Desktop dropdown */
#wohc-header .menu{
  position:absolute; left:0; top:100%; min-width:240px; background:#fff; border:1px solid rgba(37,55,53,.12);
  border-radius:12px; box-shadow:0 14px 30px rgba(0,0,0,.10); padding:10px; z-index:30;
  opacity:0; visibility:hidden; transform:translateY(6px);
  transition:opacity .16s ease, transform .16s ease, visibility .16s step-end; pointer-events:none;
}
#wohc-header .nav > li:hover > .menu,
#wohc-header .nav > li:focus-within > .menu{
  opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto; transition:opacity .16s ease, transform .16s ease, visibility 0s;
}
#wohc-header .menu a{
  display:block; padding:8px 10px; border-radius:8px; font-weight:600; font-size:var(--nav-size); line-height:1.2; color:#17302d;
}
#wohc-header .menu a:hover, #wohc-header .menu a:focus-visible{ background:#eef3f2; outline:none; }

/* CTA */
#wohc-header .cta{
  grid-area:cta;
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 16px; border-radius:999px; font-weight:800; color:#fff;
  background:linear-gradient(180deg, color-mix(in srgb, var(--brand) 90%, #ffffff) 0%, var(--brand) 100%);
  box-shadow:0 8px 18px rgba(37,55,53,.22), inset 0 1px 0 rgba(255,255,255,.18);
  transition:transform .16s ease, box-shadow .16s ease, filter .16s ease;
  justify-self:end; border:1px solid rgba(0,0,0,.06);
}
#wohc-header .cta i{ font-size:1rem; }
#wohc-header .cta:hover{ transform:translateY(-1px); filter:brightness(1.05); box-shadow:0 12px 26px rgba(37,55,53,.26); }
#wohc-header .cta:active{ transform:translateY(0); box-shadow:0 8px 18px rgba(37,55,53,.20); }
#wohc-header .cta .txt-desktop{ display:none; }
#wohc-header .cta .txt-mobile{ display:inline; }
@media(min-width:980px){
  #wohc-header .cta{ border-radius:12px; }
  #wohc-header .cta .txt-desktop{ display:inline; }
  #wohc-header .cta .txt-mobile{ display:none; }
}
@media(max-width:979px){
  #wohc-header .cta{ justify-self:center; padding:10px 14px; }
}

/* Mobile menu button (hamburger) */
#wohc-header .menu-btn{
  grid-area:menubtn; width:44px; height:44px;
  border:1px solid rgba(37,55,53,.20); border-radius:12px;
  background:#fff; display:grid; place-items:center; cursor:pointer;
  transition:background .15s ease, transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  justify-self:end; box-shadow:0 2px 8px rgba(0,0,0,.06);
}
#wohc-header .menu-btn i{ font-size:20px; line-height:1; color:#17302d; }
#wohc-header .menu-btn:hover{
  background:#f6f9f8; border-color:rgba(37,55,53,.28);
  box-shadow:0 6px 18px rgba(0,0,0,.10); transform:translateY(-1px);
}
@media(min-width:980px){ #wohc-header .menu-btn{ display:none; } }

/* ===== Drawer ===== */
#wohc-header .drawer{
  position:fixed; inset:0; background:rgba(0,0,0,0); z-index:80;
  visibility:hidden; opacity:0; transition:opacity .2s ease, background .2s ease, visibility .2s step-end;
}
#wohc-header .drawer[aria-hidden="false"]{
  visibility:visible; opacity:1; background:rgba(0,0,0,.33); transition:opacity .2s ease, background .2s ease, visibility 0s;
}
#wohc-header .sheet{
  position:absolute; right:0; top:0; height:100%; width:min(88vw,380px);
  background:#fff; box-shadow:-20px 0 40px rgba(0,0,0,.24); padding:18px 18px 22px;
  display:flex; flex-direction:column; gap:10px;
  transform:translateX(100%); transition:transform .26s ease; will-change:transform;
  border-left:1px solid rgba(37,55,53,.14);
}
#wohc-header .drawer[aria-hidden="false"] .sheet{ transform:translateX(0); }

#wohc-header .close{
  position:absolute; top:12px; right:12px; width:42px; height:42px;
  border:1px solid rgba(37,55,53,.18); border-radius:12px;
  display:grid; place-items:center; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.06);
}
#wohc-header .close i{ font-size:18px; color:#17302d; }

/* ===== Mobile drawer nav (accordion; MOBILE ONLY styles) ===== */
@media (max-width: 979px){
  #wohc-header .mnav{ margin-top:8px; display:block; }

  #wohc-header .m-accordion{ display:flex; flex-direction:column; gap:8px; }

  /* accordion head */
  #wohc-header .m-acc-head{
    width:100%; display:flex; align-items:center; justify-content:space-between; gap:10px;
    padding:12px 14px; border-radius:12px;
    font-weight:800; font-size:1rem; color:#17302d;
    background:#f6f9f8; border:1px solid rgba(37,55,53,.14);
    box-shadow:0 2px 6px rgba(0,0,0,.04);
    cursor:pointer;
    transition:background .15s ease, border-color .15s ease, transform .12s ease, box-shadow .15s ease;
  }
  #wohc-header .m-acc-head:hover{ background:#eef3f2; border-color:rgba(37,55,53,.22); transform:translateY(-1px); box-shadow:0 6px 14px rgba(0,0,0,.08); }
  #wohc-header .m-acc-head .left{ display:inline-flex; align-items:center; gap:10px; }
  #wohc-header .m-acc-head i{ font-size:1rem; }
  #wohc-header .m-acc-head .chev{ transition:transform .2s ease; opacity:.75; }
  #wohc-header .m-acc-head[aria-expanded="true"] .chev{ transform:rotate(180deg); opacity:1; }

  /* accordion panel */
  #wohc-header .m-acc-panel{
    overflow:hidden; max-height:0; transition:max-height .24s ease;
    margin:6px 0 0; padding:0 2px 0 2px;
  }
  #wohc-header .m-acc-panel .m-sub{
    display:flex; flex-direction:column; gap:6px; padding:4px 0 2px 0;
  }
  #wohc-header .m-acc-panel a{
    display:flex; align-items:center; gap:10px;
    padding:12px; border-radius:10px; font-weight:700; color:#17302d;
    background:#f8fbfa; border:1px solid rgba(37,55,53,.08);
    transition:background .12s ease, border-color .12s ease, transform .12s ease;
  }
  #wohc-header .m-acc-panel a:hover{ background:#eef3f2; border-color:rgba(37,55,53,.18); transform:translateY(-1px); }
  #wohc-header .m-acc-panel a .dot{ width:6px; height:6px; border-radius:999px; background:#17302d; opacity:.5; }

  /* emphasize "parent" link when section itself is a page */
  #wohc-header .m-acc-panel a.is-parent{
    background:linear-gradient(180deg, #f1f6f4, #eef3f2);
    border-color:rgba(37,55,53,.18);
  }

  /* single links (non-accordion) */
  #wohc-header .m-link{
    display:flex; align-items:center; gap:10px;
    padding:12px 14px; border-radius:12px; font-weight:800; color:#17302d;
    background:#f6f9f8; border:1px solid rgba(37,55,53,.14);
    box-shadow:0 2px 6px rgba(0,0,0,.04); transition:background .15s ease, border-color .15s ease, transform .12s ease, box-shadow .15s ease;
  }
  #wohc-header .m-link:hover{ background:#eef3f2; border-color:rgba(37,55,53,.22); transform:translateY(-1px); box-shadow:0 6px 14px rgba(0,0,0,.08); }

  /* refer highlight */
  #wohc-header .m-refer{
    background:linear-gradient(180deg, color-mix(in srgb, var(--brand) 90%, #ffffff) 0%, var(--brand) 100%);
    color:#fff; border:1px solid rgba(0,0,0,.06); box-shadow:0 8px 18px rgba(37,55,53,.22), inset 0 1px 0 rgba(255,255,255,.18);
    justify-content:center; gap:8px;
  }
  #wohc-header .m-refer i{ font-size:1rem; }
}

/* ===== Desktop-only tooltip for fax ===== */
@media (min-width: 860px){
  #wohc-header .fax{ position:relative; cursor:pointer; user-select:none; }
  #wohc-header .fax::after{
    content: attr(data-tip);
    position:absolute; right:0; top:calc(100% + 8px);
    background:#17302d; color:#fff;
    font-weight:700; font-size:.85rem; line-height:1;
    padding:8px 10px; border-radius:8px;
    box-shadow:0 6px 14px rgba(0,0,0,.12);
    white-space:nowrap;
    opacity:0; visibility:hidden; transform:translateY(-2px);
    transition:opacity .15s ease, transform .15s ease, visibility .15s step-end;
    z-index:2;
  }
  #wohc-header .fax::before{
    content:none !important;
    border:0 !important;
    display:none !important;
  }
  #wohc-header .fax:hover::after,
  #wohc-header .fax:focus-visible::after,
  #wohc-header .fax:hover::before,
  #wohc-header .fax:focus-visible::before{ opacity:1; visibility:visible; transform:translateY(0); }
  #wohc-header .fax.tip-show::after,
  #wohc-header .fax.tip-show::before{ opacity:1; visibility:visible; transform:translateY(0); }
  #wohc-header .fax[data-tip="Copied to clipboard"]::after{ background:#2e7d32; }
}

/* Motion prefs */
@media (prefers-reduced-motion: reduce){
  #wohc-header .bar{ transition:none; }
  #wohc-header .bar::after{ transition:none; }
}

/* =======================================================================
   HOME / CLINIC PAGE SECTIONS
   ======================================================================= */

/* ===== Banner / Parallax ===== */
.hero{
  position:relative; min-height:250px; display:grid; place-items:center; text-align:center; color:#fff;
  isolation:isolate; overflow:hidden;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background-image:
    linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.35)),
    url("https://wohc-files.winnipegwideweb.com/wohc-banner-humanrightsmuseum.jpeg");
  background-size:cover; background-position:center; background-repeat:no-repeat; background-attachment:fixed; z-index:-1;
}
@media (max-width:980px){ .hero::before{ background-attachment:scroll; } }
.hero .hero-inner{ width:100%; max-width:var(--wrap); padding:28px 18px; }
.hero h1{ margin:0 0 6px; font-size:clamp(1.4rem, 2.2vw + .8rem, 2.2rem); letter-spacing:.04em; font-weight:100; color:#fff; }
.hero p{ margin:0; font-size:clamp(.9rem, 1vw + .6rem, 1.05rem); font-weight:700; opacity:.95; color:#fff; }

/* ===== Unified Band (Info + Specialists) ===== */
.band-muted{ background: var(--grad-muted); }

/* Info Card */
.muted-sec{ background: transparent; }
.card{
  background:#e7e7e7; border-radius:14px; box-shadow:0 10px 26px rgba(0,0,0,.08), 0 2px 8px rgba(0,0,0,.06);
  padding:24px 22px;
}
.card h2{ margin:2px 0 12px; font-size:clamp(1.2rem, 1.3vw + .9rem, 1.6rem); font-weight:800; color:#1e2a28; }
.card p{ margin:0 0 16px; line-height:1.55; color:#263c39; font-weight:600; }
.actions{ display:flex; gap:12px; flex-wrap:wrap; margin-top:8px; }
.btn{
  display:inline-flex; align-items:center; gap:8px; text-decoration:none; border-radius:12px; font-weight:800;
  padding:12px 16px; line-height:1; transition:transform .15s ease, box-shadow .15s ease, filter .15s ease; user-select:none; -webkit-user-drag:none;
}
.btn-primary{ color:#fff; background:linear-gradient(180deg, color-mix(in srgb, var(--brand) 94%, #fff) 0%, var(--brand) 100%); box-shadow:0 10px 22px rgba(37,55,53,.22); }
.btn-primary:hover{ transform:translateY(-1px); filter:brightness(1.04); box-shadow:0 14px 28px rgba(37,55,53,.28); }
.btn-ghost{ background:#f2f4f3; color:#1f2f2d; border:1px solid rgba(37,55,53,.18); box-shadow:0 6px 16px rgba(0,0,0,.06); }
.btn-ghost:hover{ transform:translateY(-1px); background:#eef3f2; }

/* Specialists (inside band) */
#wohc-specialists{
  --card:#ffffff; --ring:rgba(37,55,53,.18); --shadow:0 8px 24px rgba(0,0,0,.08); --avatarbg:#dad1c8;
  background: transparent;
}
#wohc-specialists .wrap{ padding-top:20px; padding-bottom:20px; }
#wohc-specialists h2{ margin:.2em 0 .6em; font-weight:800; font-size:clamp(22px,2.4vw,28px); line-height:1.15; }
#wohc-specialists .grid{ display:grid; gap:16px; grid-template-columns:1fr; }
@media (min-width:760px){ #wohc-specialists .grid{ grid-template-columns:repeat(2,1fr); } }
#wohc-specialists .card{
  display:grid; grid-template-columns:88px 1fr; gap:14px; align-items:center;
  background:var(--card); border-radius:14px; box-shadow:var(--shadow); padding:16px;
  transition:transform .22s ease, box-shadow .22s ease, background .22s ease;
  border:1px solid color-mix(in srgb, var(--ring) 20%, transparent);
  color:inherit; text-decoration:none;
}
#wohc-specialists .card:hover{ transform:translateY(-2px); box-shadow:0 12px 28px rgba(0,0,0,.12); background:color-mix(in srgb, var(--card) 92%, #fff); }
#wohc-specialists .card:focus-visible{ outline:none; box-shadow:0 0 0 4px var(--ring), 0 12px 28px rgba(0,0,0,.12); }
#wohc-specialists .avatar{
  width:88px; height:88px; border-radius:50%; background:var(--avatarbg); overflow:hidden; display:block;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25);
}
#wohc-specialists .avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
#wohc-specialists .name{ display:block; margin:.2rem 0 .25rem; font-size:1.15rem; font-weight:800; color:var(--ink); }
#wohc-specialists .role{ margin:0; color:var(--muted); font-weight:600; }

/* ===== Services (Parallax bg, no inner card) ===== */
#wohc-services{
  --card:#ffffff; --ring:rgba(37,55,53,.18); --shadow:0 8px 24px rgba(0,0,0,.08);
  position:relative; color:#fff; line-height:1.6; isolation:isolate; overflow:hidden;
}
#wohc-services::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background-image:
    linear-gradient(180deg, rgba(0,0,0,.44), rgba(0,0,0,.44)),
    url("https://wohc-files.winnipegwideweb.com/img-banner-services.jpg");
  background-size:cover; background-position:center; background-repeat:no-repeat; background-attachment:fixed;
}
@media (max-width:980px){ #wohc-services::before{ background-attachment:scroll; } }
#wohc-services h2{ margin:.2em 0 .35em; font-weight:800; font-size:clamp(22px,2.6vw,30px); line-height:1.15; color:#fff; }
#wohc-services .lead{ margin:0 0 14px; color:#ffffff; max-width:900px; }
#wohc-services .svc-grid{ display:grid; gap:14px; margin-top:14px; grid-template-columns:1fr; }
@media (min-width:700px){ #wohc-services .svc-grid{ grid-template-columns:repeat(3,1fr); } }
#wohc-services .svc{
  position:relative; border-radius:14px; overflow:hidden; cursor:pointer; background:var(--card); min-height:130px; isolation:isolate;
  box-shadow:var(--shadow); transition:transform .25s ease, box-shadow .25s ease;
}
#wohc-services .svc:hover{ transform:translateY(-2px); box-shadow:0 12px 28px rgba(0,0,0,.12); }
#wohc-services .svc .body{
  position:relative; z-index:1; padding:16px; display:grid; align-content:center; min-height:130px; color:var(--ink); transition:color .2s ease, opacity .2s ease;
}
#wohc-services .svc h3{ margin:0; font-size:1.06rem; font-weight:800; color:var(--ink); }
#wohc-services .svc p{ margin:.35em 0 0; font-size:.95rem; opacity:.95; color:var(--ink); }
/* Overlay */
#wohc-services .svc .hover{
  position:absolute; inset:0; z-index:2; display:grid; place-items:center; text-align:center; padding:14px;
  background:var(--hover); color:#fff; opacity:0; transform:translateY(6px);
  transition:opacity .22s ease, transform .22s ease;
}
@media (hover:hover){ #wohc-services .svc:hover .hover{ opacity:1; transform:translateY(0); } }
#wohc-services .svc .hover p{ margin:0; font-size:.95rem; color:#fff; }
#wohc-services .svc .hover .fakebtn{
  margin-top:10px; display:inline-block; padding:8px 12px; border-radius:10px; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.28); font-weight:700;
  backdrop-filter:saturate(180%) blur(2px); color:#fff;
}
/* Make underlying body text white or hidden on hover */
#wohc-services .svc:hover .body,
#wohc-services .svc:hover .body h3,
#wohc-services .svc:hover .body p{ color:#fff; }
#wohc-services .svc:hover .body{ opacity:0; }

#wohc-services .svc a.cover{ position:absolute; inset:0; z-index:3; text-indent:-9999px; }
#wohc-services .hr{
  border:none; height:2px; border-radius:2px; background:linear-gradient(to right,transparent,var(--muted),transparent); opacity:.25; margin:32px 0 0;
}

/* ===== Location & Contacts ===== */
#wohc-location { background:#d9d9d9; }
#wohc-location .wrap { padding-top:40px; padding-bottom:40px; }

/* two columns that stay equal height on desktop */
#wohc-location .loc-grid{
  display:grid;
  gap:18px;
  grid-template-columns:1fr;
  align-items:stretch;
}
@media (min-width:900px){
  #wohc-location .loc-grid{ grid-template-columns:1fr 1fr; }
}

/* left column uses the same card aesthetic */
#wohc-location .card{ background:#ffffff; }

/* Heading in the left card */
#wohc-location .card h3{
  margin:0 0 12px;
  font-size:clamp(1.05rem, 1.2vw + .8rem, 1.35rem);
  font-weight:800;
  color:#1e2a28;
}

/* Details table */
#wohc-location .info-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  margin:0 0 14px;
  border-radius:12px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 1px 0 rgba(0,0,0,.03) inset;
}
#wohc-location .info-table tr + tr td,
#wohc-location .info-table tr + tr th{ border-top:1px solid rgba(37,55,53,.08); }
#wohc-location .info-table th{
  width:120px;
  text-align:left;
  padding:12px 14px;
  font-weight:800;
  color:#253735;
  background:rgba(37,55,53,.04);
  vertical-align:top;
}
#wohc-location .info-table td{
  padding:12px 14px;
  color:#263c39;
  font-weight:600;
}

/* Buttons row (inline) */
#wohc-location .actions{
  display:flex; gap:12px; flex-wrap:wrap; margin-top:8px;
}

/* Right column map matches left column height */
#wohc-location .map-wrap{
  height:100%;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 10px 26px rgba(0,0,0,.08), 0 2px 8px rgba(0,0,0,.06);
  background:#fff;
}
#wohc-location iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
}

/* Tweak first/last margins to avoid “mystery” gaps */
#wohc-location .wrap > :first-child { margin-top:0; }
#wohc-location .wrap > :last-child { margin-bottom:0; }

 <style>
  /* Base / helpers */
  #wohc-header *{ box-sizing:border-box; }
  #wohc-header a{ color:inherit; text-decoration:none; }
  #wohc-header .wrap{ max-width:1240px; margin:0 auto; padding:0 18px; }
  html, body { overflow-x:hidden; }

  /* ===== Notice (scrolls away) ===== */
  #wohc-header .notice{ background:#fff; border-bottom:1px solid rgba(37,55,53,.1); font-weight:700; }
  #wohc-header .notice .inner{
    display:grid; grid-template-columns:1fr auto; align-items:center; padding:8px 0; column-gap:40px;
  }
  #wohc-header .badge{
    display:inline-flex; align-items:center; gap:8px;
    background:#e7f0ed; color:#17302d;
    padding:6px 12px; border-radius:999px;
    font-size:.82rem; font-weight:800; white-space:nowrap; max-width:100%; overflow:hidden;
  }
  #wohc-header .badge i{ font-size:.95rem; }

  /* Rotating (fade swap) */
  #wohc-header .rot{ display:inline-grid; position:relative; }
  #wohc-header .rot .msg{ grid-area:1/1; opacity:0; transition:opacity .35s ease; animation-fill-mode:both; }
  #wohc-header .rot .msg--a{ opacity:1; }
  #wohc-header .rot .msg--a{ animation: wohc-fadeSwap 8s infinite; }
  #wohc-header .rot .msg--b{ animation: wohc-fadeSwap 8s infinite 4s; }
  @keyframes wohc-fadeSwap{ 0%{opacity:0} 8%{opacity:1} 40%{opacity:1} 50%{opacity:0} 100%{opacity:0} }
  @media (prefers-reduced-motion: reduce){
    #wohc-header .rot .msg{ animation:none !important; }
    #wohc-header .rot .msg--a{ opacity:1; }
    #wohc-header .rot .msg--b{ display:none; }
  }

  #wohc-header .fax{ font-size:.95rem; font-weight:700; color:#17302d; white-space:nowrap; justify-self:end; }

  /* Mobile tweaks for notice */
  #wohc-header .t-mobile{ display:none; }
  @media(max-width:859px){
    #wohc-header .notice .inner{
      grid-template-columns:auto auto; justify-content:space-between; column-gap:12px;
    }
    #wohc-header .fax{ font-size:.78rem; font-weight:600; color:#455a58; }
    #wohc-header .badge{ min-width:0; }
    #wohc-header .badge .rot{ display:inline-grid; max-width:100%; }
    #wohc-header .rot .msg{ white-space:nowrap; }
    #wohc-header .t-desktop{ display:none; }
    #wohc-header .t-mobile{ display:inline; }
  }

  /* ===== Floating Bar (fixed; smooth offset via transform) ===== */
  /* JS sets --barOffset to the notice height while visible, then 0px after it scrolls away */
  #wohc-header .bar{
    position:fixed; left:0; right:0; top:0; z-index:60;
    transform: translateY(var(--barOffset, 0px));
    will-change: transform;
    background: transparent;
    border-bottom: 1px solid transparent;
    transition: transform .32s cubic-bezier(.22,.7,.26,1);
    isolation: isolate;              /* NEW: contain stacking so ::after can sit behind content */
  }

  /* Glass overlay (now BEHIND header content) */
  #wohc-header .bar::after{
    content:"";
    position:absolute; inset:0;
    background: color-mix(in srgb, var(--panel) 70%, transparent);
    -webkit-backdrop-filter: saturate(1.2) blur(10px);
    backdrop-filter: saturate(1.2) blur(10px);
    border-bottom: 1px solid rgba(37,55,53,.10);
    box-shadow: 0 8px 30px rgba(0,0,0,.10);
    opacity:0;
    pointer-events:none;
    z-index:0;                        /* NEW: put overlay behind .inner */
    transition: opacity .28s ease;
  }
  #wohc-header .bar.is-glass::after{ opacity:1; }

  /* Ensure all header content sits above the overlay */
  #wohc-header .bar .inner{ position:relative; z-index:1; } /* NEW */

  /* Spacer so page content doesn't hide under the fixed bar */
  #wohc-header .bar-spacer{ height: var(--barHeight, 64px); }

  /* Logo (desktop) */
  #wohc-header .logo{ grid-area:logo; display:inline-flex; align-items:center; }
  #wohc-header .logo img{ height:auto; max-height:48px; width:auto; max-width:100%; display:block; }

  /* Bar layout */
  #wohc-header .bar .inner{
    display:grid; grid-template-columns:auto 1fr auto; grid-template-areas:"logo cta menubtn";
    align-items:center; gap:10px; padding:10px 0;
  }
  @media(min-width:980px){
    #wohc-header .bar .inner{ grid-template-areas:"logo nav cta"; gap:14px; padding:12px 0; }
  }

  /* Mobile drawer logo left-aligned */
  @media (max-width: 979px){
    #wohc-header .sheet { text-align:left; }
    #wohc-header .sheet .m-logo{ display:flex; align-items:center; justify-content:flex-start !important; gap:10px; margin:8px 0 6px; align-self:flex-start; }
    #wohc-header .m-logo img{
      display:block; width:clamp(140px, 60vw, 220px); max-width:100%; height:auto; max-height:56px; object-fit:contain;
    }
  }

  /* Desktop nav (scoped) */
  nav[aria-label="Primary"]{ grid-area:nav; display:none; }
  @media(min-width:980px){ nav[aria-label="Primary"]{ display:flex; } }
  #wohc-header .nav{ display:flex; align-items:center; gap:18px; }
  #wohc-header .nav > li{ position:relative; list-style:none; }
  :root{ --nav-size:.95rem; }
  #wohc-header .link{
    display:inline-flex; align-items:center; gap:6px; padding:10px 12px; border-radius:10px;
    font-weight:700; font-size:var(--nav-size); line-height:1.2; background:none; border:none; cursor:pointer;
  }
  #wohc-header .link:hover, #wohc-header .link:focus-visible{ background:#eef3f2; outline:none; }
  #wohc-header .chev{ font-size:.7rem; opacity:.7; }

  /* Desktop dropdown */
  #wohc-header .menu{
    position:absolute; left:0; top:100%; min-width:240px; background:#fff; border:1px solid rgba(37,55,53,.12);
    border-radius:12px; box-shadow:var(--dropShadow); padding:10px; z-index:30; /* above overlay */
    opacity:0; visibility:hidden; transform:translateY(6px);
    transition:opacity .16s ease, transform .16s ease, visibility .16s step-end; pointer-events:none;
  }
  #wohc-header .nav > li:hover > .menu,
  #wohc-header .nav > li:focus-within > .menu{
    opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto; transition:opacity .16s ease, transform .16s ease, visibility 0s;
  }
  #wohc-header .menu a{
    display:block; padding:8px 10px; border-radius:8px; font-weight:600; font-size:var(--nav-size); line-height:1.2; color:#17302d;
  }
  #wohc-header .menu a:hover, #wohc-header .menu a:focus-visible{ background:#eef3f2; outline:none; }

  /* CTA */
  #wohc-header .cta{
    grid-area:cta;
    display:inline-flex; align-items:center; gap:8px;
    padding:10px 16px; border-radius:999px; font-weight:800; color:#fff;
    background:linear-gradient(180deg, color-mix(in srgb, var(--brand) 90%, #ffffff) 0%, var(--brand) 100%);
    box-shadow:0 8px 18px rgba(37,55,53,.22), inset 0 1px 0 rgba(255,255,255,.18);
    transition:transform .16s ease, box-shadow .16s ease, filter .16s ease;
    justify-self:end; border:1px solid rgba(0,0,0,.06);
  }
  #wohc-header .cta i{ font-size:1rem; }
  #wohc-header .cta:hover{ transform:translateY(-1px); filter:brightness(1.05); box-shadow:0 12px 26px rgba(37,55,53,.26); }
  #wohc-header .cta:active{ transform:translateY(0); box-shadow:0 8px 18px rgba(37,55,53,.20); }
  #wohc-header .cta .txt-desktop{ display:none; }
  #wohc-header .cta .txt-mobile{ display:inline; }
  @media(min-width:980px){
    #wohc-header .cta{ border-radius:12px; }
    #wohc-header .cta .txt-desktop{ display:inline; }
    #wohc-header .cta .txt-mobile{ display:none; }
  }
  @media(max-width:979px){
    #wohc-header .cta{ justify-self:center; padding:10px 14px; }
  }

  /* Mobile menu button (hamburger) */
  #wohc-header .menu-btn{
    grid-area:menubtn; width:44px; height:44px;
    border:1px solid rgba(37,55,53,.20); border-radius:12px;
    background:#fff; display:grid; place-items:center; cursor:pointer;
    transition:background .15s ease, transform .15s ease, box-shadow .15s ease, border-color .15s ease;
    justify-self:end; box-shadow:0 2px 8px rgba(0,0,0,.06);
  }
  #wohc-header .menu-btn i{ font-size:20px; line-height:1; color:#17302d; }
  #wohc-header .menu-btn:hover{
    background:#f6f9f8; border-color:rgba(37,55,53,.28);
    box-shadow:0 6px 18px rgba(0,0,0,.10); transform:translateY(-1px);
  }
  @media(min-width:980px){ #wohc-header .menu-btn{ display:none; } }

  /* ===== Drawer ===== */
  #wohc-header .drawer{
    position:fixed; inset:0; background:rgba(0,0,0,0); z-index:80; /* above bar */
    visibility:hidden; opacity:0; transition:opacity .2s ease, background .2s ease, visibility .2s step-end;
  }
  #wohc-header .drawer[aria-hidden="false"]{
    visibility:visible; opacity:1; background:rgba(0,0,0,.33); transition:opacity .2s ease, background .2s ease, visibility 0s;
  }
  #wohc-header .sheet{
    position:absolute; right:0; top:0; height:100%; width:min(88vw,380px);
    background:#fff; box-shadow:-20px 0 40px rgba(0,0,0,.24); padding:18px 18px 22px;
    display:flex; flex-direction:column; gap:10px;
    transform:translateX(100%); transition:transform .26s ease; will-change:transform;
    border-left:1px solid rgba(37,55,53,.14);
  }
  #wohc-header .drawer[aria-hidden="false"] .sheet{ transform:translateX(0); }

  #wohc-header .close{
    position:absolute; top:12px; right:12px; width:42px; height:42px;
    border:1px solid rgba(37,55,53,.18); border-radius:12px;
    display:grid; place-items:center; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.06);
  }
  #wohc-header .close i{ font-size:18px; color:#17302d; }

  /* ===== Mobile drawer nav (accordion; MOBILE ONLY styles) ===== */
  @media (max-width: 979px){
    #wohc-header .mnav{ margin-top:8px; display:block; }

    #wohc-header .m-accordion{ display:flex; flex-direction:column; gap:8px; }

    /* accordion head */
    #wohc-header .m-acc-head{
      width:100%; display:flex; align-items:center; justify-content:space-between; gap:10px;
      padding:12px 14px; border-radius:12px;
      font-weight:800; font-size:1rem; color:#17302d;
      background:#f6f9f8; border:1px solid rgba(37,55,53,.14);
      box-shadow:0 2px 6px rgba(0,0,0,.04);
      cursor:pointer;
      transition:background .15s ease, border-color .15s ease, transform .12s ease, box-shadow .15s ease;
    }
    #wohc-header .m-acc-head:hover{ background:#eef3f2; border-color:rgba(37,55,53,.22); transform:translateY(-1px); box-shadow:0 6px 14px rgba(0,0,0,.08); }
    #wohc-header .m-acc-head .left{ display:inline-flex; align-items:center; gap:10px; }
    #wohc-header .m-acc-head i{ font-size:1rem; }
    #wohc-header .m-acc-head .chev{ transition:transform .2s ease; opacity:.75; }
    #wohc-header .m-acc-head[aria-expanded="true"] .chev{ transform:rotate(180deg); opacity:1; }

    /* accordion panel */
    #wohc-header .m-acc-panel{
      overflow:hidden; max-height:0; transition:max-height .24s ease;
      margin:6px 0 0; padding:0 2px 0 2px;
    }
    #wohc-header .m-acc-panel .m-sub{
      display:flex; flex-direction:column; gap:6px; padding:4px 0 2px 0;
    }
    #wohc-header .m-acc-panel a{
      display:flex; align-items:center; gap:10px;
      padding:12px; border-radius:10px; font-weight:700; color:#17302d;
      background:#f8fbfa; border:1px solid rgba(37,55,53,.08);
      transition:background .12s ease, border-color .12s ease, transform .12s ease;
    }
    #wohc-header .m-acc-panel a:hover{ background:#eef3f2; border-color:rgba(37,55,53,.18); transform:translateY(-1px); }
    #wohc-header .m-acc-panel a .dot{ width:6px; height:6px; border-radius:999px; background:#17302d; opacity:.5; }

    /* emphasize "parent" link when section itself is a page */
    #wohc-header .m-acc-panel a.is-parent{
      background:linear-gradient(180deg, #f1f6f4, #eef3f2);
      border-color:rgba(37,55,53,.18);
    }

    /* single links (non-accordion) */
    #wohc-header .m-link{
      display:flex; align-items:center; gap:10px;
      padding:12px 14px; border-radius:12px; font-weight:800; color:#17302d;
      background:#f6f9f8; border:1px solid rgba(37,55,53,.14);
      box-shadow:0 2px 6px rgba(0,0,0,.04); transition:background .15s ease, border-color .15s ease, transform .12s ease, box-shadow .15s ease;
    }
    #wohc-header .m-link:hover{ background:#eef3f2; border-color:rgba(37,55,53,.22); transform:translateY(-1px); box-shadow:0 6px 14px rgba(0,0,0,.08); }

    /* refer highlight */
    #wohc-header .m-refer{
      background:linear-gradient(180deg, color-mix(in srgb, var(--brand) 90%, #ffffff) 0%, var(--brand) 100%);
      color:#fff; border:1px solid rgba(0,0,0,.06); box-shadow:0 8px 18px rgba(37,55,53,.22), inset 0 1px 0 rgba(255,255,255,.18);
      justify-content:center; gap:8px;
    }
    #wohc-header .m-refer i{ font-size:1rem; }
  }

  /* ===== Desktop-only tooltip for fax ===== */
  @media (min-width: 860px){
    #wohc-header .fax{ position:relative; cursor:pointer; user-select:none; }
    #wohc-header .fax::after{
      content: attr(data-tip);
      position:absolute; right:0; top:calc(100% + 8px);
      background:#17302d; color:#fff;
      font-weight:700; font-size:.85rem; line-height:1;
      padding:8px 10px; border-radius:8px;
      box-shadow:0 6px 14px rgba(0,0,0,.12);
      white-space:nowrap;
      opacity:0; visibility:hidden; transform:translateY(-2px);
      transition:opacity .15s ease, transform .15s ease, visibility .15s step-end;
      z-index:2;
    }
    #wohc-header .fax::before{
  content:none !important;
  border:0 !important;
  display:none !important;
}
    #wohc-header .fax:hover::after,
    #wohc-header .fax:focus-visible::after,
    #wohc-header .fax:hover::before,
    #wohc-header .fax:focus-visible::before{ opacity:1; visibility:visible; transform:translateY(0); }
    #wohc-header .fax.tip-show::after,
    #wohc-header .fax.tip-show::before{ opacity:1; visibility:visible; transform:translateY(0); }
    #wohc-header .fax[data-tip="Copied to clipboard"]::after{ background:#2e7d32; }
    #wohc-header .fax[data-tip="Copied to clipboard"]::before{ border-top-color:#2e7d32; }
  }

  /* Motion prefs */
  @media (prefers-reduced-motion: reduce){
    #wohc-header .bar{ transition:none; }
    #wohc-header .bar::after{ transition:none; }
  }


.doc-page.section > .wrap > .doc-other:last-child { 
  margin-bottom: 28px; 
}


   /* ===== Doctor page (scoped; reuses shared tokens & components) ===== */
    .doc-page { --accent: color-mix(in srgb, var(--brand) 55%, #000 45%); }

    /* Top CTA row matches site spacing & buttons */
    .doc-cta { display:flex; justify-content:flex-end; margin:12px 0 18px; }

    @media (max-width: 820px){ .doc-cta { justify-content:center; } }

    /* Card + grid layout (reuses .card aesthetic) */
    .doc-card { padding:24px; margin-bottom:24px; } /* bottom margin for grey container */
    .doc-grid {
      display:grid; gap:24px;
      grid-template-columns: minmax(180px, 22%) 1fr;
      align-items:start;
    }
    @media (max-width: 980px){
      .doc-card { padding:20px; }
      .doc-grid { grid-template-columns: 110px 1fr; align-items:center; gap:18px; }
    }
    @media (max-width: 560px){
      .doc-grid { grid-template-columns: 1fr; }
    }

    /* Photo */
    .doc-photo {
      width:100%;
      aspect-ratio:3/4;
      object-fit:cover;
      border-radius:14px;
      display:block;
    }
    @media (max-width: 980px){
      .doc-photo { width:110px; height:132px; aspect-ratio:auto; }
    }
    @media (max-width: 560px){
      .doc-photo { width:128px; height:152px; }
    }

    /* Typography (match site scale/weight) */
    .doc-heading{
      margin:.1em 0 .2em;
      font-weight:800;
      font-size:clamp(1.25rem, 1.6vw + 1rem, 1.75rem);
      line-height:1.2;
      color:var(--accent);
    }
    .doc-sub{
      margin:0 0 12px;
      color:var(--muted);
      font-weight:700;
      font-size:clamp(.95rem, 1.2vw + .6rem, 1.05rem);
    }
    .doc-para{
      margin:0 0 14px;
      color:var(--ink);
      font-weight:600;
      line-height:1.6;
      font-size:1.02rem;
    }

    .doc-actions{
      display:flex; flex-wrap:wrap; gap:10px;
      margin-top:8px;
    }

    /* ----- Other specialist tile (matches site card vibe) ----- */
    .sr-only{
      position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
    }
    .doc-other{ margin-top:6px; }

    .doc-mini{
      display:grid;
      grid-template-columns:84px 1fr auto;
      gap:14px;
      align-items:center;
      padding:14px 16px;
      border-radius:14px;
      background:#fff;
      border:1px solid rgba(37,55,53,.12);
      box-shadow:0 8px 24px rgba(0,0,0,.08);
      text-decoration:none; color:inherit;
      transition:transform .22s ease, box-shadow .22s ease, background .22s ease;
    }
    .doc-mini:hover{ transform:translateY(-2px); box-shadow:0 12px 28px rgba(0,0,0,.12); }

    .doc-mini-avatar{
      width:84px; height:84px; border-radius:50%; overflow:hidden;
      background:#dad1c8; box-shadow:inset 0 1px 0 rgba(255,255,255,.25);
    }
    .doc-mini-avatar img{ width:100%; height:100%; object-fit:cover; display:block; }

    .doc-mini-name{ display:block; font-weight:800; font-size:1.05rem; color:var(--ink); }
    .doc-mini-role{ display:block; font-weight:600; color:var(--muted); font-size:.95rem; }

    .doc-mini-cta{
      display:inline-flex; align-items:center; gap:8px;
      font-weight:800; color:var(--ink);
      white-space:nowrap;
    }
    .doc-mini-cta i{ font-size:.9rem; opacity:.8; }

    /* Gentle reveal animation (respects reduced motion) */
    .doc-page [data-anim]{ opacity:0; transform:translateY(12px); transition:opacity .6s ease, transform .6s ease; }
    .doc-page .reveal{ opacity:1; transform:translateY(0); }
    @media (prefers-reduced-motion: reduce){
      .doc-page [data-anim]{ opacity:1; transform:none; transition:none; }
    }