/* ============================================================
   Astra Dental — Navigation v1 (nav-v1.css)
   Desktop: Services mega menu. Mobile: main categories with
   expandable About / Services / Insurance groups.
   When this file changes, bump the filename (nav-v2.css) and
   update the <link> on every page (cache-busting standing rule).
   ============================================================ */

/* ---------- desktop ---------- */
.nd:focus-within .ndm{opacity:1;visibility:visible;transform:translateY(0)}
.ndm.ndm-mega{min-width:0;width:min(780px,calc(100vw - 48px));left:-150px;padding:14px 16px 12px}
.ndm-mega a.mm-all{display:block;font-size:13.5px;font-weight:700;color:var(--blue);background:var(--blue-p);border-radius:8px;padding:9px 12px;margin-bottom:10px}
.ndm-mega a.mm-all:hover{background:var(--gold-p);color:var(--gold-d)}
.mm-grid{columns:4 170px;column-gap:14px}
.mm-col{break-inside:avoid;padding:0 0 10px}
.mm-h{display:block;font-size:11px;font-weight:700;color:var(--gold-d);letter-spacing:.06em;text-transform:uppercase;padding:6px 12px 4px}
.ndm-mega a.mm-hl{font-size:11px;font-weight:700;color:var(--gold-d);letter-spacing:.06em;text-transform:uppercase;padding:6px 12px}
.ndm-mega a.mm-hl:hover{color:var(--blue)}
.ndm-mega a,.ndm-mega .mm-h{padding:6px 12px;white-space:normal;line-height:1.35}
.site-header .hcta a{white-space:nowrap}

/* ---------- mobile ---------- */
/* hamburger menu up to 1100px so the full desktop menu never overflows */
.site-header .logo{flex-shrink:0}
@media(max-width:1100px){
  .site-header nav{display:none}
  .site-header .ham{display:flex}
  .site-header .hcta{display:flex}
  .site-header .hcta a{padding:8px 10px!important;font-size:12.5px!important}
}
@media(max-width:480px){.site-header .logo img{height:36px}.site-header .hinner{padding:0 12px;gap:8px}.site-header .hcta{gap:6px}.site-header .hcta a{white-space:nowrap;padding:7px 8px!important;font-size:12px!important}}
.mob-nav{padding:8px 18px 14px}
.mob-nav>div{border-bottom:1px solid var(--g100)}
.mob-nav .mn-row{display:flex;align-items:stretch}
.mob-nav a.mn-l,.mob-nav .mn-row>a,.mob-nav button.mn-btn{flex:1;display:block;text-align:left;font-family:var(--sans);font-size:15px;font-weight:700;color:var(--navy);background:none;border:0;padding:13px 6px;border-radius:0;cursor:pointer}
.mob-nav a.mn-l{border-bottom:1px solid var(--g100)}
.mob-nav button.mn-btn{display:flex;width:100%;align-items:center;justify-content:space-between;gap:12px}
.mob-nav button.mn-btn .mn-car{margin-right:16px}
.mob-nav button.mn-car-btn{flex:0 0 52px;background:none;border:0;border-left:1px solid var(--g100);cursor:pointer;display:flex;align-items:center;justify-content:center}
.mn-car{width:9px;height:9px;border-right:2px solid var(--gold-d);border-bottom:2px solid var(--gold-d);transform:rotate(45deg);margin-top:-4px;transition:transform var(--t)}
[aria-expanded="true"] .mn-car{transform:rotate(-135deg);margin-top:4px}
.mob-nav .mn-sub{padding:2px 0 8px 12px;margin:0 0 6px 6px;border-left:2px solid var(--gold-l)}
.mob-nav .mn-sub[hidden]{display:none}
.mob-nav .mn-sub a{display:block;font-size:14px;font-weight:500;color:var(--g800);padding:9px 8px}
.mob-nav .mn-sub a.mn-all{font-weight:700;color:var(--blue)}
.mob-nav #mn-svc>a:not(.mn-all){font-weight:700;padding:10px 8px}
.mob-nav .mn-sub button.mn-btn{font-size:14px;font-weight:700;color:var(--g800);padding:10px 8px}
.mob-nav .mn-sub .mn-sub{margin-left:4px}
.mob-nav .mn-sub .mn-sub a{font-size:13.5px}
.mob-nav a:focus-visible,.mob-nav button:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
@media(max-width:380px){.site-header .logo img{height:32px}.site-header .hinner{padding:0 10px}.site-header .hcta a{padding:6px 7px!important;font-size:11.5px!important}}
/* desktop header fit (both languages), then tighter Spanish labels */
@media(min-width:1101px) and (max-width:1240px){.site-header .logo img{height:48px}.site-header .hinner{padding:0 16px}.site-header nav>a,.site-header nav>.nd>a{padding:6px 6px;font-size:12.5px}.site-header .hcta{gap:6px}.site-header .hcta a{padding:8px 10px!important;font-size:12.5px!important}}
@media(min-width:1101px) and (max-width:1320px){body.es .site-header nav>a,body.es .site-header nav>.nd>a{padding:6px 5px;font-size:12px}body.es .site-header .logo img{height:48px}body.es .site-header .hinner{padding:0 14px}body.es .site-header .hcta{gap:6px}body.es .site-header .hcta a{padding:7px 9px!important;font-size:12px!important}}
