/* The menu and the footer: every page of the site, one click away. Loaded after launch.css on every page.
   Desktop: three panels (Services, Industries, Guides) that drop from the header on a spring.
   Phone: one sheet with the four services as rendered tiles, then every job, business and guide. */

/* Desktop triggers look like the links beside them. */
.desktop-nav>.nav-trigger{position:relative;display:flex;align-items:center;min-height:44px;padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer}
.desktop-nav>.nav-trigger::after,.desktop-nav>a::after{content:'';position:absolute;left:0;right:0;bottom:9px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform 220ms var(--l-out)}
.desktop-nav>.nav-trigger:hover::after,.desktop-nav>.nav-trigger[aria-expanded=true]::after,.desktop-nav>.nav-trigger[data-current]::after,.desktop-nav>a[aria-current=page]::after{transform:scaleX(1)}
.desktop-nav>.nav-trigger:focus-visible{outline:2px solid var(--l-coral);outline-offset:4px;border-radius:4px}

/* Panels: a dark slab that drops a few pixels and settles, the way a sheet of glass would. */
.nav-panels{position:absolute;left:0;right:0;top:calc(100% - 14px);height:0;z-index:2}
.nav-panel{position:absolute;left:0;right:0;top:0;padding-top:14px}
.nav-panel-inner{display:grid;gap:16px 26px;padding:24px 24px 20px;border-radius:22px;background:#141d1b;color:var(--l-cream);box-shadow:inset 0 1px 0 rgb(255 255 255 / .07),0 1px 2px rgb(0 0 0 / .35),0 40px 90px -34px rgb(0 0 0 / .8);opacity:0;transform:translateY(-10px) scale(.985);transform-origin:50% 0;transition:opacity 200ms var(--l-out),transform 560ms var(--sp-pop,var(--l-spring))}
.nav-panel.is-open .nav-panel-inner{opacity:1;transform:none}
.nav-panel.is-swap .nav-panel-inner{transition:opacity 160ms var(--l-out);transform:none}
.nav-panel.is-leaving .nav-panel-inner{opacity:0;transform:translateY(-6px) scale(.99);transition:opacity 140ms var(--l-in),transform 200ms var(--l-in)}
.nav-heading{margin:2px 0 -6px;font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:#8d9a94}
.nav-panel ul{margin:0;padding:0;list-style:none}
.nav-panel a{color:inherit;text-decoration:none}
.nav-services{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.nav-service{display:grid;gap:11px;padding:9px 9px 13px;border-radius:17px;background:#1b2522;box-shadow:inset 0 1px 0 rgb(255 255 255 / .05);transition:background-color 220ms ease,transform 520ms var(--sp-press,var(--l-spring))}
.nav-service:hover{background:#21302c;transform:translateY(-3px)}
.nav-service:active{transform:scale(.97);transition-duration:120ms}
.nav-service img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:11px;background:#0e1413}
.nav-service span{padding:0 4px}
.nav-service strong{display:block;font:600 16px/1.2 'Instrument Sans',Arial,sans-serif;letter-spacing:-.012em}
.nav-service small{display:block;margin-top:3px;font-size:13px;line-height:1.35;color:#9aa8a1}
.nav-jobs,.nav-reads{display:grid;gap:2px 10px}
.nav-jobs{grid-template-columns:repeat(4,minmax(0,1fr))}
.nav-reads{grid-template-columns:repeat(3,minmax(0,1fr))}
.nav-jobs a,.nav-reads a{display:block;height:100%;padding:9px 10px;border-radius:12px;transition:background-color 180ms ease}
.nav-jobs strong,.nav-reads strong{display:block;font-size:14.5px;font-weight:600;line-height:1.3}
.nav-jobs small,.nav-reads small{display:block;margin-top:3px;font-size:12.5px;line-height:1.38;color:#93a19a}
.nav-businesses{columns:4;column-gap:18px}
.nav-businesses a{display:block;padding:8px 10px;border-radius:10px;font-size:14.5px;break-inside:avoid;transition:background-color 180ms ease}
.nav-panel a:hover,.nav-panel a:focus-visible{background:#1e2a27;outline:none}
.nav-service:focus-visible{outline:2px solid var(--l-coral);outline-offset:2px}
.nav-panel a[aria-current=page]{background:#1e2a27;box-shadow:inset 3px 0 0 var(--l-coral)}
.nav-more{display:flex;justify-content:flex-end;gap:8px;margin:0;font-size:13.5px}
.nav-more a{padding:8px 12px;border-radius:10px;color:#ffb4a5;font-weight:500}

/* Below 900 px the phone menu takes over. */
@media(max-width:900px){
  .site-header .desktop-nav,.nav-panels{display:none}
  .site-header .menu-toggle{display:flex}
  .site-header .nav-cta{margin-left:auto}
}
@media(min-width:901px){.mobile-nav.mobile-nav{display:none}}
@media(max-width:1150px){.nav-services{gap:10px}.nav-jobs{grid-template-columns:repeat(2,minmax(0,1fr))}.nav-businesses{columns:3}}

/* Phone sheet. Large targets first, then every page in short rows. The two actions stay in reach of the thumb.
   The bar with the logo and the close button stays solid while the sheet scrolls under it. */
html.menu-open .site-header::before{content:'';position:fixed;top:0;left:0;right:0;z-index:46;height:calc(env(safe-area-inset-top) + 84px);background:linear-gradient(180deg,#101817 80%,rgb(16 24 23 / 0));pointer-events:none}
.mobile-nav.mobile-nav{display:block;padding-top:calc(env(safe-area-inset-top) + 92px)}
.mobile-nav.mobile-nav[hidden]{display:none}
.mobile-nav a{color:inherit;text-decoration:none}
.mobile-nav ul{margin:0;padding:0;list-style:none}
.mnav-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.mnav-tile{display:grid;align-content:start;gap:3px;padding:8px 8px 13px;border-radius:18px;background:#18221f;box-shadow:inset 0 1px 0 rgb(255 255 255 / .05);transition:transform 420ms var(--sp-press,var(--l-spring)),background-color 200ms ease}
.mnav-tile:active{transform:scale(.96);transition-duration:120ms}
.mnav-tile img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;margin-bottom:8px;border-radius:12px;background:#0e1413}
.mnav-tile strong{padding:0 4px;font:600 17px/1.15 'Instrument Sans',Arial,sans-serif;letter-spacing:-.015em}
.mnav-tile small{padding:0 4px;font-size:12.5px;line-height:1.3;color:#9aa8a1}
.mnav-tile[aria-current=page],.mnav-list a[aria-current=page],.mnav-grid a[aria-current=page]{color:#ffb4a5}
.mnav-group{margin-top:30px}
.mnav-heading{margin:0 0 6px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#93a19a}
.mnav-list a{display:block;padding:12px 0;border-bottom:1px solid rgb(248 247 243 / .08)}
.mnav-list strong{display:block;font:500 18px/1.25 'Instrument Sans',Arial,sans-serif;letter-spacing:-.015em}
.mnav-list small{display:block;margin-top:3px;font-size:13px;line-height:1.35;color:#a7b2ac}
.mnav-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px}
.mnav-grid a{display:flex;align-items:center;min-height:48px;padding:6px 0;border-bottom:1px solid rgb(248 247 243 / .08);font-size:15.5px;line-height:1.25}
.mnav-small{display:flex;flex-wrap:wrap;gap:4px 22px}
.mnav-small a{display:inline-flex;align-items:center;min-height:44px;font-size:15px;color:#c8d0cc}
.mobile-nav .mobile-nav-actions{position:sticky;bottom:calc(-1 * (env(safe-area-inset-bottom) + 22px));z-index:1;display:grid;gap:10px;margin:26px -22px calc(-1 * (env(safe-area-inset-bottom) + 22px));padding:16px 22px calc(env(safe-area-inset-bottom) + 18px);background:linear-gradient(180deg,rgb(16 24 23 / 0),#101817 28px)}
.mobile-nav .mobile-nav-actions>*{justify-content:center}
.mnav-ask{display:inline-flex;align-items:center;gap:10px;min-height:56px;margin:0;padding:0 22px;border:0;border-radius:14px;background:linear-gradient(180deg,#fbfaf6,#ebe8df);color:var(--l-ink);font:600 16px/1 'Instrument Sans',Arial,sans-serif;letter-spacing:-.012em;cursor:pointer;box-shadow:inset 0 1px 0 #fff,0 1px 2px rgb(0 0 0 / .3);transition:transform 420ms var(--sp-press,var(--l-spring))}
.mnav-ask:active{transform:scale(.965);transition-duration:120ms}
.mnav-ask .icon{font-size:19px;color:var(--l-coral)}
/* Each block rises into place a beat after the one above it. */
.mobile-nav :is(.mnav-tile,.mnav-group,.mobile-nav-actions){opacity:0;transform:translateY(18px);transition:opacity 320ms var(--l-out),transform 720ms var(--l-spring);transition-delay:calc(var(--i,0) * 42ms)}
.mobile-nav.is-open :is(.mnav-tile,.mnav-group,.mobile-nav-actions){opacity:1;transform:none}

/* Footer: the whole site map in plain links. */
.footer-map{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr) minmax(0,1.35fr) minmax(0,.85fr);gap:30px 36px;margin-top:34px;padding-top:28px;border-top:1px solid rgb(98 112 106 / .2)}
.footer-heading{margin:0 0 10px;font-size:11.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:#62706a}
.footer-map ul{margin:0 0 22px;padding:0;list-style:none}
.footer-map ul:last-child{margin-bottom:0}
.footer-map li{break-inside:avoid}
.footer-map a{display:inline-block;padding:4px 0;font-size:14px;line-height:1.4;color:var(--l-ink);text-decoration:none;transition:color 180ms ease}
.footer-map a:hover{color:var(--l-coral-text);text-decoration:underline;text-underline-offset:3px}
.footer-map a[aria-current=page]{color:var(--l-coral-text)}
.footer-two{columns:2;column-gap:24px}
.site-footer .footer-bottom{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px}
.site-footer .footer-bottom .motion-toggle{margin-left:auto}
@media(max-width:1100px){.footer-map{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-wide{grid-column:span 2;order:-1}}
@media(max-width:600px){
  .footer-map{grid-template-columns:minmax(0,1fr);gap:26px}
  .footer-wide{grid-column:auto}
  .footer-map a{padding:7px 0;font-size:15px}
  .site-footer .footer-bottom .motion-toggle{margin-left:0}
}

@media(prefers-reduced-motion:reduce){
  .nav-panel-inner,.nav-panel.is-leaving .nav-panel-inner,.mobile-nav :is(.mnav-tile,.mnav-group,.mobile-nav-actions){transition:opacity 120ms linear;transform:none}
}
.reduced-motion .nav-panel-inner,.reduced-motion .mobile-nav :is(.mnav-tile,.mnav-group,.mobile-nav-actions){transition:opacity 120ms linear;transform:none}