/* Gagneja Dental • shared services navigation.
   Native disclosure + ordinary links. No remote assets, dependencies or tracking.
   Load last so the same navigation works with every existing page stylesheet. */
html body .site-header { overflow:visible; }
html body .care-disclosure { position:static; margin:0; padding:0; border:0; flex:0 0 auto; }
html body .care-trigger {
  list-style:none; display:flex; align-items:center; justify-content:space-between;
  gap:.45rem; padding:1rem 0; position:relative; min-height:3.4rem;
  font:inherit; line-height:1.5; font-weight:600; letter-spacing:-.015em;
  white-space:nowrap; color:var(--ink); border:0; cursor:pointer;
}
.care-trigger::-webkit-details-marker { display:none; }
.care-trigger::marker { content:''; }
html body .care-trigger::after { content:''; position:absolute; left:0; right:0; bottom:.45rem; height:2px; background:var(--pink); transform:scaleX(0); transform-origin:left; transition:transform .2s ease; }
html body :is(.care-section-current,.care-disclosure[open]) > .care-trigger::after { transform:scaleX(1); }
html body .care-trigger:hover,html body .care-disclosure[open] > .care-trigger { color:var(--pink); }
.care-trigger .care-chevron { width:1rem; height:1rem; flex-shrink:0; transition:transform .2s ease; }
.care-disclosure[open] .care-trigger .care-chevron { transform:rotate(180deg); }
html body .care-trigger:focus-visible { outline:3px solid var(--sky); outline-offset:5px; border-radius:5px; }
html body .care-panel {
  position:absolute; top:calc(100% - 1px); left:50%; transform:translateX(-50%);
  z-index:90; width:min(1080px,calc(100vw - 4rem)); max-height:var(--care-menu-room,calc(100dvh - 10rem));
  overflow:auto; overscroll-behavior:contain; scrollbar-width:thin;
  display:grid; grid-template-columns:minmax(0,1fr) 250px;
  background:#fff; border:1px solid #d2e3e7; border-top:3px solid var(--pink);
  border-radius:0 0 26px 26px; box-shadow:0 22px 55px #12334026;
  text-align:left; white-space:normal; isolation:isolate;
}
html body .care-panel-main { min-width:0; padding:1.65rem; }
html body .care-panel-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; padding:0 .2rem 1.25rem; border-bottom:1px solid var(--line); margin-bottom:.75rem; }
html body .care-kicker { display:block; font-size:1rem; font-weight:500; color:var(--muted); letter-spacing:0; line-height:1.5; margin-bottom:.3rem; }
html body .care-panel-title { font-family:var(--heading); font-size:1.7rem; line-height:1.2; letter-spacing:-.04em; font-weight:750; color:var(--ink); margin:0; }
html body .care-overview { display:flex; align-items:center; gap:.5rem; color:var(--pink); font-size:1rem; line-height:1.5; font-weight:700; padding:.55rem .75rem; border:1px solid #e8c3d5; border-radius:100px; min-height:2.75rem; white-space:normal; }
html body .care-overview:hover,html body .care-overview[aria-current=page] { background:var(--blush); border-color:var(--pink); }
html body .care-overview .icon { width:1.1rem; height:1.1rem; }
html body .care-service-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.4rem .75rem; list-style:none; padding:0; margin:0; }
html body .care-service-item { list-style:none; margin:0; padding:0; min-width:0; }
html body .care-service-link { display:flex; align-items:center; gap:.8rem; min-height:5.8rem; height:100%; padding:.8rem .6rem; border:1px solid transparent; border-radius:16px; text-decoration:none; background:transparent; transition:background .18s ease,border-color .18s ease; }
html body .care-service-icon { display:grid; place-items:center; width:2.85rem; height:2.85rem; flex:0 0 2.85rem; border-radius:14px; transition:transform .2s ease; }
.care-tone-blue { background:#e6f4fa; color:#156b88; }
.care-tone-pink { background:#fbe8f0; color:#ab165d; }
.care-tone-yellow { background:#fff4bc; color:#715900; }
html body .care-service-icon .icon { width:1.55rem; height:1.55rem; }
html body .care-service-copy { flex:1 1 auto; min-width:0; }
html body .care-service-copy strong { display:block; font-size:1.0625rem; line-height:1.45; letter-spacing:-.025em; color:var(--ink); font-weight:700; }
html body .care-service-copy small { display:block; color:var(--muted); font-size:1rem; line-height:1.45; font-weight:400; margin-top:.18rem; letter-spacing:-.015em; }
html body .care-service-link > .care-arrow { width:1.05rem; height:1.05rem; color:#52717c; flex-shrink:0; transition:transform .2s ease; }
html body .care-service-link:hover { background:#f0f7f9; border-color:#d5e6ec; }
html body .care-service-link:hover .care-service-icon { transform:translateY(-2px); }
html body .care-service-link:hover > .care-arrow { transform:translateX(3px); color:var(--pink); }
html body .care-service-link[aria-current=page] { background:#fff0f6; border-color:#dd89af; }
html body .care-service-link[aria-current=page] :is(strong,.care-arrow) { color:var(--pink); }
html body .care-service-link:focus-visible { outline:3px solid var(--sky); outline-offset:2px; }
html body .care-service-urgent { grid-column:1/-1; margin-top:.5rem; }
html body .care-service-urgent .care-service-link { background:#fff4f8; border-color:#f1d7e3; min-height:5.15rem; padding-inline:1rem; }
html body .care-service-urgent .care-service-link:hover { background:#fbe6ef; border-color:#d6a0ba; }
html body .care-service-urgent .care-service-link[aria-current=page] { border-color:var(--pink); }
html body .care-menu-note { position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:0; overflow:hidden; padding:2rem 1.45rem 1.65rem; min-width:0; border-left:1px solid #d5e7ed; background:linear-gradient(145deg,#eaf6fc,#e3f0f4); }
html body .care-menu-note::after { content:''; position:absolute; width:200px; height:200px; border-radius:50%; border:1px solid #afcfdc; opacity:.5; top:-6rem; right:-7rem; pointer-events:none; }
html body .care-note-icon { display:grid; place-items:center; background:var(--yellow); color:var(--ink); width:3.1rem; height:3.1rem; border-radius:50%; margin-bottom:1.1rem; }
html body .care-note-icon .icon { width:1.6rem; height:1.6rem; }
html body .care-note-title { color:var(--ink); font-family:var(--heading); font-size:1.6rem; line-height:1.15; font-weight:750; letter-spacing:-.045em; margin:0 0 .9rem; }
html body .care-note-copy { color:#375867; font-weight:400; font-size:1rem; line-height:1.6; margin:0 0 1.25rem; }
html body .care-note-call { display:flex; align-items:center; gap:.6rem; color:var(--ink); font-size:1rem; line-height:1.5; padding:.85rem .7rem; border-radius:14px; border:1px solid #b5d1dc; background:#fff; width:100%; }
html body .care-note-call .icon { width:1.25rem; height:1.25rem; color:var(--pink); }
html body .care-note-call span { min-width:0; }
html body .care-note-call strong { display:block; font-size:1.1rem; letter-spacing:-.03em; }
html body .care-note-call:hover { border-color:var(--pink); }
html body .care-note-visit { display:flex; align-items:center; justify-content:space-between; gap:.6rem; font-size:1rem; font-weight:650; padding:1rem 0 .3rem; min-height:2.75rem; width:100%; }
html body .care-note-visit:hover { color:var(--pink); }
html body .care-note-location { color:#416371; font-size:1rem; padding-top:1rem; margin-top:auto; }
.care-service-link,.care-overview,.care-note-call,.care-note-visit { scroll-margin-block:1rem; }
@media(prefers-reduced-motion:no-preference) {
  .care-nav-ready .care-disclosure[open] > .care-panel { animation:care-panel-in .22s cubic-bezier(.2,.75,.25,1) both; }
  @keyframes care-panel-in { from {opacity:.6;translate:0 -7px} to {opacity:1;translate:0 0} }
}
.motion-paused .care-panel,.motion-paused .care-panel *,.motion-paused .care-trigger,.motion-paused .care-trigger * { animation:none!important; transition:none!important; }
@media(prefers-reduced-motion:reduce) { .care-panel,.care-panel *,.care-trigger,.care-trigger * { animation:none!important; transition:none!important; } }
/* Larger text or a narrower screen gets the same compact, scrollable navigation. */
html.care-nav-compact body .header-inner { min-height:5.5rem; }
html.care-nav-compact body .header-actions { display:flex; margin-left:auto; gap:.5rem; }
html.care-nav-compact body .nav-toggle { display:flex; }
html.care-nav-compact body .mobile-call { display:grid; place-items:center; background:var(--pink); color:white; border-radius:50%; }
html.care-nav-compact body .main-nav { display:none; position:absolute; top:100%; left:0; right:0; max-height:var(--care-menu-room,calc(100dvh - 9rem)); overflow-y:auto; overscroll-behavior:contain; background:var(--paper); padding:1rem max(min(1.2rem,20px),calc((100vw - 1100px)/2)); border-bottom:1px solid var(--line); box-shadow:0 18px 25px #16364214; flex-direction:column; align-items:stretch; flex-wrap:nowrap; gap:0; font-size:1.1875rem; }
html.care-nav-compact body .main-nav.is-open { display:flex; }
html.care-nav-compact body .main-nav > a:not(.btn) { padding:1rem 0; }
html.care-nav-compact body .main-nav > .btn { margin:1rem 0 .5rem; align-self:stretch; font-size:1.125rem; min-height:3.4rem; height:auto; width:auto; padding:.85rem 1rem; gap:.5rem; }
html.care-nav-compact body .care-disclosure { width:100%; }
html.care-nav-compact body .care-trigger { padding:1rem 0; min-height:3.5rem; }
html.care-nav-compact body .care-trigger .care-chevron { width:1.2rem; height:1.2rem; margin-right:.25rem; }
html.care-nav-compact body .care-trigger::after { right:auto; width:2rem; }
html.care-nav-compact body .care-panel { position:static; display:block; transform:none; translate:none; width:100%; max-height:none; overflow:visible; box-shadow:none; border:1px solid #cbdfe6; border-radius:18px; background:#f3f9fb; margin:.3rem 0 .65rem; animation:none; }
html.care-nav-compact body .care-panel-main { padding:min(.85rem,14px); }
html.care-nav-compact body .care-panel-heading { padding:0 0 .6rem; margin-bottom:.3rem; }
html.care-nav-compact body .care-panel-heading > div { display:none; }
html.care-nav-compact body .care-overview { width:100%; justify-content:space-between; border:0; padding:.55rem .45rem; border-radius:10px; font-size:1.0625rem; }
html.care-nav-compact body .care-menu-note { display:none; }
html.care-nav-compact body .care-service-grid { grid-template-columns:1fr; gap:.15rem; }
html.care-nav-compact body .care-service-link { min-height:3.9rem; padding:.6rem 6px; gap:10px; border-radius:12px; }
html.care-nav-compact body .care-service-icon { width:36px; height:36px; flex-basis:36px; border-radius:11px; }
html.care-nav-compact body .care-service-icon .icon { width:22px; height:22px; }
html.care-nav-compact body .care-service-copy strong { font-size:1.0625rem; line-height:1.5; }
html.care-nav-compact body .care-service-copy small { display:none; }
html.care-nav-compact body .care-service-urgent { margin-top:.4rem; }
html.care-nav-compact body .care-service-urgent .care-service-link { padding-inline:.55rem; }
/* Native <details> is usable even if enhancement scripts are unavailable. */
html:not(.care-nav-ready) .care-disclosure[open] .care-panel { position:static; transform:none; width:100%; max-height:none; margin:1rem 0; }
html:not(.care-nav-ready) .care-disclosure[open] { flex-basis:100%; }
@media(max-width:800px) { html:not(.care-nav-ready) .care-panel { grid-template-columns:1fr; } html:not(.care-nav-ready) .care-menu-note { display:none; } }
@media(max-width:550px) { html:not(.care-nav-ready) .care-service-grid { grid-template-columns:1fr; } html:not(.care-nav-ready) .care-panel-main { padding:1rem; } }
@media(max-width:400px) { html.care-nav-compact body .header-actions .mobile-call { display:none; } }
@media(max-height:600px) { html.care-nav-compact body .site-header { position:relative; } }
@media print { .care-disclosure,.care-panel { display:none!important; } }

html.care-nav-compact body .care-service-link > .care-arrow {width:16px;height:16px;}
html.care-nav-compact body .care-service-copy strong{overflow-wrap:anywhere;}
/* Long top-level labels also reflow when browser text is enlarged. */
html.care-nav-compact body .main-nav > a:not(.btn) { white-space:normal; overflow-wrap:anywhere; }
