/* Mega menu.

   NOTE ON SPECIFICITY: main.css carries `.site-nav__menu a{color:rgba(255,255,255,.92)}`
   at 0-2-0. Every link inside a panel is a descendant of that list, so single-class
   rules here (0-1-0) lose and inherit white on a white panel. Panel link rules are
   therefore scoped under .site-nav__menu to win on specificity rather than resorting
   to !important. */

.site-header .site-nav__menu .mega a,
.site-header .site-nav__menu .mega button{
	color:var(--mirage,#1C2A3A);
	white-space:normal;
	font-weight:400;
}
.site-header .site-nav__menu .mega a::after{content:none}
   Panels sit under a full-bleed bar and are positioned from the header, not the
   item, so wide panels never clip at the viewport edge. */

.site-nav__item{position:static}
.site-nav__link{display:inline-flex;align-items:center;gap:.3rem}
.site-nav__chev{width:.85rem;height:.85rem;transition:transform .25s var(--ease);opacity:.75}
.site-nav__chev svg{width:100%;height:100%;display:block}
.site-nav__item--open>.site-nav__link .site-nav__chev{transform:rotate(180deg)}
.site-nav__item--open>.site-nav__link{color:#fff}
.site-nav__item--open>.site-nav__link::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--barley)}

.mega{
	position:absolute;left:0;right:0;top:100%;
	background:#fff;
	border-top:1px solid rgba(28,42,58,.08);
	box-shadow:0 24px 48px -24px rgba(28,42,58,.35);
	z-index:60;
	opacity:0;transform:translateY(-6px);
	transition:opacity .2s var(--ease),transform .2s var(--ease);
}
.mega[hidden]{display:none}
.site-nav__item--open .mega{opacity:1;transform:none}

.mega__inner{display:grid;gap:clamp(1.5rem,1rem + 2vw,3rem);padding-block:clamp(1.75rem,1rem + 2vw,2.5rem)}
/* Panels are chrome, not body copy, so they are not bound by --content-max. */
.mega .mega__inner{max-width:min(96vw,1600px)}
.mega--cases .mega__inner,
.mega--treatments .mega__inner,
.mega--team .mega__inner{grid-template-columns:minmax(0,1fr)}

/* Treatment columns */
.mega__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem 1.5rem}
.mega__col{min-width:0}
@media (min-width:1200px){.mega__cols{grid-template-columns:repeat(6,minmax(0,1fr));gap:1.25rem 1rem}}

.site-header .site-nav__menu .mega__coltitle{
	display:flex;align-items:baseline;justify-content:space-between;gap:.4rem;
	font-family:var(--font-display,inherit);
	font-size:.9rem;font-weight:600;color:var(--mirage,#1C2A3A);
	line-height:1.25;min-height:2.4em;
	padding-bottom:.5rem;margin-bottom:.6rem;
	border-bottom:1px solid rgba(28,42,58,.12);
}
.site-header .site-nav__menu .mega__coltitle:hover{color:var(--barley,#A48662)}
.mega__count{font-size:.7rem;font-weight:500;color:rgba(28,42,58,.45);font-family:var(--font-body,inherit);flex:none}
.mega__coltitle--plain{cursor:default}

.mega__list{list-style:none;margin:0;padding:0;display:grid;gap:.1rem}
.mega__list li{position:relative}

/* Tooltip. Sits above the link so it cannot be clipped by the column. */
.mega__tip{
	position:absolute;left:0;bottom:calc(100% + 7px);z-index:5;
	width:max-content;max-width:17rem;
	background:var(--mirage,#1C2A3A);color:#fff;
	font-size:.75rem;line-height:1.5;font-weight:400;
	padding:.7rem .85rem;border-radius:6px;
	opacity:0;visibility:hidden;transform:translateY(3px);
	transition:opacity .15s var(--ease),transform .15s var(--ease),visibility .15s;
	pointer-events:none;white-space:normal;
}
.mega__list a:hover .mega__tip,
.mega__list a:focus-visible .mega__tip{opacity:1;visibility:visible;transform:none}
@media (prefers-reduced-motion:reduce){.mega__tip{transition:none}}
.site-header .site-nav__menu .mega__list a{
	display:block;font-size:.8rem;line-height:1.3;
	padding-block:.3rem;
	color:rgba(28,42,58,.78);
	overflow-wrap:anywhere;
	padding:.3rem .4rem;margin-inline:-.4rem;border-radius:4px;
	transition:background .15s var(--ease),color .15s var(--ease);
}
.site-header .site-nav__menu .mega__list a:hover{background:rgba(164,134,98,.1);color:var(--mirage,#1C2A3A)}

/* Aside rail */
.mega__aside{
	background:var(--cream,#ECE6DF);
	border-radius:8px;padding:1.25rem;
	display:flex;flex-direction:column;gap:.5rem;align-self:start;
}

/* Horizontal variant: full-width band under the columns. */
.mega__aside--band{
	flex-direction:row;align-items:center;gap:1.25rem;
	padding:.85rem 1.25rem;width:100%;
}
.mega__aside--band .mega__asidekicker{flex:none}
.mega__aside--band .mega__asidetext{flex:1;margin:0}
.site-header .site-nav__menu .mega__aside--band .mega__asidelink{border-top:0;padding:0;flex:none}
.mega__aside--band .mega__asidebtn{margin-top:0;flex:none}
.mega__asidekicker{font-family:var(--font-display,inherit);font-size:1rem;font-weight:600;color:var(--mirage,#1C2A3A);margin:0}
.mega__asidetext{font-size:.8rem;line-height:1.5;color:rgba(28,42,58,.7);margin:0 0 .25rem}
.site-header .site-nav__menu .mega__asidelink{
	display:flex;align-items:center;justify-content:space-between;gap:.5rem;
	font-size:.83rem;font-weight:500;color:var(--mirage,#1C2A3A);
	padding:.45rem 0;border-top:1px solid rgba(28,42,58,.1);
}
.mega__asidelink span{transition:transform .2s var(--ease);color:var(--barley,#A48662)}
.mega__asidelink:hover span{transform:translateX(3px)}
.mega__asidebtn{margin-top:.5rem;text-align:center;justify-content:center}

/* Team cards */
.mega__team{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem}
@media (min-width:1100px){.mega__team{grid-template-columns:repeat(7,minmax(0,1fr));gap:1.25rem;align-items:start}}

.mcard{
	display:grid;grid-template-columns:64px minmax(0,1fr);gap:.75rem;align-items:center;
	padding:.6rem;border-radius:8px;
	transition:background .18s var(--ease);
}
@media (min-width:1100px){
	.mcard{
		grid-template-columns:minmax(0,1fr);gap:.5rem;padding:.6rem;
		text-align:left;justify-items:stretch;align-content:start;
	}
	.mcard:hover{background:var(--cream,#ECE6DF)}
	.mcard:hover .mcard__media{transform:translateY(-2px)}
	.site-header .site-nav__menu .mcard__media{
		width:100%;height:auto;aspect-ratio:4/5;border-radius:8px;
		transition:transform .18s var(--ease);
	}
	.mcard__name{min-height:2.5em;font-size:1.05rem}
	.site-header .site-nav__menu .mcard__role{font-size:.86rem}
}
.mcard:hover{background:var(--cream,#ECE6DF)}
.mcard__media{display:block;width:64px;height:80px;border-radius:6px;overflow:hidden;background:rgba(28,42,58,.06);flex:none}
.mcard__media img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.mcard__media--ph{display:grid;place-items:center;background:var(--mirage,#1C2A3A)}
.mcard__initials{font-family:var(--font-display,inherit);font-size:1.1rem;color:var(--barley,#A48662)}
.mcard__body{display:block;min-width:0}
.site-header .site-nav__menu .mcard__name{display:block;font-family:var(--font-display,inherit);font-size:1rem;font-weight:600;color:var(--barley,#A48662);line-height:1.25;overflow-wrap:anywhere}
.site-header .site-nav__menu .mcard__role{display:block;font-size:.8rem;font-weight:500;color:rgba(28,42,58,.6);margin-top:.15rem;overflow-wrap:anywhere}
.site-header .site-nav__menu .mcard__bio{font-size:.8rem;line-height:1.45;color:rgba(28,42,58,.65);margin-top:.35rem;overflow-wrap:break-word;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* Before/after panel: category chips over a thumbnail strip */
.mega__casewrap{display:grid;gap:.9rem;align-content:start}
.mega__chips{display:flex;flex-wrap:wrap;gap:.5rem}
.mega__chips--cat{padding-bottom:.75rem;border-bottom:1px solid rgba(28,42,58,.1)}
.chip--cat{font-weight:600}
.site-header .site-nav__menu .chip--treat{background:transparent;border:1px solid rgba(28,42,58,.14);padding-block:.8rem;padding-inline:1.2rem;min-height:2.6rem;font-size:.78rem}
.site-header .site-nav__menu .chip--treat:hover{background:var(--mirage,#1C2A3A);border-color:var(--mirage,#1C2A3A);color:#fff}
.site-header .site-nav__menu .chip{
	display:inline-flex;align-items:center;gap:.45rem;
	font-size:.82rem;line-height:1.1;color:var(--mirage,#1C2A3A);
	background:var(--cream,#ECE6DF);
	border-radius:999px;
	padding-block:.95rem;padding-inline:1.4rem;
	min-height:2.9rem;
	transition:background .15s var(--ease),color .15s var(--ease);
}
.site-header .site-nav__menu .chip:hover{background:var(--mirage,#1C2A3A);color:#fff}
.site-header .site-nav__menu .chip.is-on{background:var(--mirage,#1C2A3A);color:#fff}
.site-header .site-nav__menu .chip.is-on .chip__n{color:var(--barley,#A48662)}
.chip__n{font-size:.7rem;color:var(--barley,#A48662)}
.chip:hover .chip__n{color:var(--barley,#A48662)}

.mega__strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;max-width:none;align-items:start}
.mega__strip:empty::after{content:"No cases yet for that filter.";font-size:.75rem;color:rgba(28,42,58,.55)}
.scard{display:block;border-radius:6px;overflow:hidden;background:rgba(28,42,58,.06);transition:transform .18s var(--ease)}
.scard:hover{transform:translateY(-2px)}
.scard__media{display:block;overflow:hidden;border-radius:6px 6px 0 0}
.scard__media img{width:100%;height:auto;display:block}
.site-header .site-nav__menu .scard__label{
	display:block;font-size:.85rem;font-weight:500;line-height:1.3;color:var(--mirage,#1C2A3A);
	padding:.5rem .6rem 0;
	overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.site-header .site-nav__menu .scard__clin{
	display:block;font-size:.75rem;line-height:1.25;color:var(--barley,#A48662);
	padding:.15rem .6rem .6rem;
	overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

/* About link columns */
.mega__linkcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1.25rem 1.5rem}

/* Simple link panel */
.mega__links{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.5rem}
.mlink{display:block;padding:.75rem;border-radius:8px;transition:background .18s var(--ease)}
.mlink:hover{background:var(--cream,#ECE6DF)}
.site-header .site-nav__menu .mlink__label{display:block;font-family:var(--font-display,inherit);font-size:.95rem;font-weight:600;color:var(--mirage,#1C2A3A)}
.site-header .site-nav__menu .mlink__desc{display:block;font-size:.78rem;line-height:1.45;color:rgba(28,42,58,.65);margin-top:.2rem}

/* Backdrop */
.mega-backdrop{
	position:fixed;inset:0;top:var(--wsdc-header-bottom,0);
	background:rgba(28,42,58,.35);
	opacity:0;pointer-events:none;visibility:hidden;transition:opacity .2s var(--ease),visibility 0s linear .2s;
	z-index:40;
}
.mega-backdrop.is-on{opacity:1;pointer-events:auto;visibility:visible;transition-delay:0s}
/* The backdrop only serves the desktop mega menu. On phones it must not exist as
   a layout box at all: an invisible fixed layer reaching the bottom of the
   screen makes iPhone Safari stop drawing the page behind its toolbar and fill
   that area with a solid white box instead. */
@media (max-width:1023px){.mega-backdrop{display:none}}

@media (prefers-reduced-motion:reduce){
	.mega,.site-nav__chev,.mega__asidelink span,.mega-backdrop{transition:none}
	.site-nav__item--open .mega{transform:none}
}

/* Mobile: accordion inside the existing drawer */
.mobile-nav__acc{border-bottom:1px solid var(--hairline-light)}
.mobile-nav__accbtn{
	width:100%;display:flex;align-items:center;justify-content:space-between;gap:.5rem;
	background:none;border:0;cursor:pointer;
	color:#fff;font-size:1.05rem;font-family:inherit;text-align:left;
	padding:.85rem 0;
}
.mobile-nav__accbtn .site-nav__chev{width:1rem;height:1rem;color:var(--barley,#A48662)}
.mobile-nav__accbtn[aria-expanded="true"] .site-nav__chev{transform:rotate(180deg)}
.mobile-nav__panel{padding-bottom:.75rem}
.mobile-nav__panel[hidden]{display:none}
.mobile-nav__group{margin-bottom:.85rem}
.mobile-nav__grouptitle{
	display:block;font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;
	color:var(--barley,#A48662);margin-bottom:.3rem;
}
.mobile-nav__sub{list-style:none;margin:0;padding:0}
.mobile-nav__sub a{
	display:block;color:rgba(255,255,255,.82);font-size:.92rem;
	padding:.42rem 0;border-bottom:0;
}
.mobile-nav__sub a:hover{color:#fff}
/* Team cards sit in two columns in the mobile menu so the panel is not so long. */
.mobile-nav__team{display:grid;grid-template-columns:1fr 1fr;gap:.35rem .9rem}
.mobile-nav__mcard{display:flex;align-items:center;gap:.65rem;padding:.45rem 0;color:#fff;min-width:0}
.mobile-nav__mcard .mobile-nav__mname,.mobile-nav__mcard .mobile-nav__mrole{overflow-wrap:anywhere}
.mobile-nav__mcard img{width:40px;height:48px;object-fit:cover;object-position:center top;border-radius:4px;flex:none}
.mobile-nav__mname{display:block;font-size:.92rem}
.mobile-nav__mrole{display:block;font-size:.75rem;color:var(--barley,#A48662)}

/* Topbar quick links */
.topbar__link--urgent{position:relative;padding-left:.9rem}
.topbar__link--urgent::before{
	content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
	width:6px;height:6px;border-radius:50%;background:var(--barley,#A48662);
}

/* Before/after active-filter banner (deep links from the mega menu) */
.ba-active{
	display:flex;align-items:center;justify-content:space-between;gap:1rem;
	flex-wrap:wrap;
	background:var(--cream,#ECE6DF);
	border-radius:8px;
	padding:.85rem 1.15rem;
	margin-bottom:1.5rem;
}
.ba-active__label{font-size:.95rem;color:var(--mirage,#1C2A3A)}
.ba-active__label::first-letter{text-transform:uppercase}
.ba-active__clear{
	background:none;border:0;cursor:pointer;
	font:inherit;font-size:.85rem;color:var(--barley,#A48662);
	display:inline-flex;align-items:center;gap:.35rem;
	padding:.2rem .1rem;
}
.ba-active__clear::before{content:"\00d7";font-size:1.15rem;line-height:1}
.ba-active__clear:hover{color:var(--mirage,#1C2A3A)}

/* Header site search ------------------------------------------------------- */
.site-search__toggle{width:44px;height:44px;border-radius:50%;border:1px solid var(--hairline);background:#fff;color:var(--mirage);display:grid;place-items:center;cursor:pointer;flex:none;transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease)}
.site-search__toggle svg{width:20px;height:20px}
.site-search__toggle:hover{background:var(--mirage);color:#fff;border-color:var(--mirage)}
.site-search__toggle[aria-expanded="true"]{background:var(--barley);color:#fff;border-color:var(--barley)}
.site-search{border-top:1px solid var(--hairline);background:var(--cream)}
.site-search[hidden]{display:none}
.site-search__inner{display:flex;align-items:center;gap:1rem;padding-block:var(--s-4)}
.site-search__inner .wsdc-searchform{flex:1}
.site-search__close{width:40px;height:40px;border-radius:50%;border:0;background:transparent;color:var(--mirage);display:grid;place-items:center;cursor:pointer;flex:none}
.site-search__close svg{width:20px;height:20px}
.site-search__close:hover{background:rgba(28,42,58,.08)}
.site-search .wsdc-searchform__row{position:relative;display:flex;gap:.5rem;max-width:none}
.site-search .wsdc-searchform__icon{position:absolute;left:1.05rem;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--ink-muted);pointer-events:none}
.site-search .wsdc-searchform__input{flex:1;font:inherit;padding:.85rem 1rem .85rem 2.9rem;border:1px solid var(--hairline);border-radius:999px;background:#fff;color:var(--ink)}
.site-search .wsdc-searchform__input:focus{outline:0;border-color:var(--barley);box-shadow:0 0 0 3px rgba(164,134,98,.15)}
.site-search .wsdc-searchform__submit{font:inherit;font-weight:600;padding:.85rem 1.4rem;border:0;border-radius:999px;background:var(--mirage);color:#fff;cursor:pointer;transition:background .2s var(--ease)}
.site-search .wsdc-searchform__submit:hover{background:var(--barley)}
@media (max-width:560px){.site-search .wsdc-searchform__submit{padding:.85rem 1rem}}

/* Mobile drawer: the top bar is hidden on phones, so its links (emergency,
   new patients, referrals) are repeated under the booking button. */
.mobile-nav__urgent{width:100%;justify-content:center;border-color:rgba(255,255,255,.45)}
.mobile-nav__urgent::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--barley,#A48662);flex:none}
.mobile-nav__urgent:hover{background:rgba(255,255,255,.08);color:#fff}
.mobile-nav__toplinks{display:flex;justify-content:center;gap:1.75rem;margin:0;font-size:.85rem}
.mobile-nav__toplinks a{color:rgba(255,255,255,.85);text-decoration:underline;text-underline-offset:3px}
.mobile-nav__toplinks a:hover{color:#fff}
