/* Blue Claw Associates — shared enhancements (loaded on every page after the page's own CSS).
   Mobile menu, sticky mobile call bar, skip link, tap targets, journal/article layout. */

/* ---------- Skip link ---------- */
.skip-link{position:absolute;left:12px;top:-64px;z-index:200;background:#fff;color:#0032A1;padding:12px 18px;border-radius:6px;font-weight:600;box-shadow:0 8px 24px -8px rgba(0,0,0,.4);transition:top .15s ease}
.skip-link:focus{top:12px;outline:3px solid #8AB8EB;outline-offset:2px}

/* ---------- Visible keyboard focus everywhere ---------- */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #8AB8EB;outline-offset:2px}

/* Images that carry width/height attributes keep their aspect ratio unless page CSS sets a height. */
:where(img[width][height]){height:auto}

/* ---------- Mobile menu ---------- */
.nav-toggle{background:none;border:0;cursor:pointer;min-height:44px;padding:8px 4px;font-family:inherit}
.m-menu{position:fixed;inset:0;z-index:49;background:#0a1024;color:#fff;display:flex;flex-direction:column;padding:calc(var(--m-nav-h,104px) + 12px) clamp(20px,6vw,40px) calc(28px + env(safe-area-inset-bottom));overflow-y:auto;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}
.m-menu.open{opacity:1;visibility:visible;transform:none;transition:opacity .2s ease,transform .2s ease}
.m-menu nav{display:flex;flex-direction:column}
.m-menu nav a{display:flex;align-items:center;min-height:54px;font-family:'Fraunces','Times New Roman',serif;font-size:1.45rem;font-weight:500;letter-spacing:-.01em;color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.12)}
.m-menu nav a:hover,.m-menu nav a:focus-visible{color:#8AB8EB}
.m-menu-actions{display:grid;gap:12px;margin-top:28px}
.m-menu-actions a{display:flex;align-items:center;justify-content:center;min-height:52px;border-radius:6px;font-weight:600;font-size:1rem;text-decoration:none}
.m-menu-actions .m-primary{background:#0032A1;color:#fff}
.m-menu-actions .m-secondary{border:1.5px solid rgba(255,255,255,.5);color:#fff}
.m-menu-note{margin:22px 0 0;font-size:.85rem;color:rgba(255,255,255,.65);line-height:1.5}
body.m-menu-open{overflow:hidden}
@media (min-width:981px){.m-menu{display:none}}
@media (prefers-reduced-motion:reduce){.m-menu,.m-menu.open{transition:none;transform:none}}

/* ---------- Sticky mobile call / start bar ---------- */
.m-cta{display:none}
@media (max-width:980px){
  .m-cta{position:fixed;left:0;right:0;bottom:0;z-index:48;display:grid;grid-template-columns:1fr 1.5fr;gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(10,16,36,.96);border-top:1px solid rgba(255,255,255,.14);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transform:translateY(110%);transition:transform .25s ease}
  .m-cta.show{transform:none}
  .m-cta a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:6px;font-weight:600;font-size:.95rem;text-decoration:none;white-space:nowrap}
  .m-cta .m-call{border:1.5px solid rgba(255,255,255,.55);color:#fff}
  .m-cta .m-start{background:#0032A1;color:#fff}
  body.m-menu-open .m-cta{transform:translateY(110%)}
  /* keep the concierge launcher clear of the bar */
  body.has-m-cta .bcc-teaser{bottom:calc(84px + env(safe-area-inset-bottom)) !important}
  body.has-m-cta .foot{padding-bottom:84px}
}
@media (prefers-reduced-motion:reduce){.m-cta{transition:none}}

/* ---------- Comfortable tap targets on touch screens ---------- */
@media (max-width:980px){
  .foot ul li a{display:inline-flex;align-items:center;min-height:44px}
  .foot .socials a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}
  .foot-bottom a{display:inline-flex;align-items:center;min-height:44px}
  .filter{min-height:44px}
  .hero-link{min-height:44px;display:inline-flex;align-items:center}
}

/* ---------- Collapsible team bios on phones ---------- */
@media (max-width:680px){
  .team-bio.is-collapsible:not(.is-open) p:nth-of-type(n+2){display:none}
  .bio-toggle{display:inline-flex;align-items:center;min-height:44px;margin-top:4px;padding:0;background:none;border:0;color:#0032A1;font:600 .95rem/1 'Inter',system-ui,sans-serif;cursor:pointer;text-decoration:underline;text-underline-offset:4px}
}
@media (min-width:681px){.bio-toggle{display:none}}

/* ---------- Journal (blog) + article layout ---------- */
.journal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
@media (max-width:980px){.journal-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.journal-grid{grid-template-columns:1fr}}
.journal-card{display:flex;flex-direction:column;background:#fff;border:1px solid #E5E1D6;border-radius:14px;overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.journal-card:hover{border-color:#8AB8EB;box-shadow:0 14px 32px -18px rgba(0,50,161,.35);transform:translateY(-2px)}
.journal-card-photo{aspect-ratio:3/2;overflow:hidden;background:#EBF0FF}
.journal-card-photo img{width:100%;height:100%;object-fit:cover;display:block}
.journal-card-body{display:flex;flex-direction:column;gap:10px;padding:24px;flex:1}
.journal-card h2{font-family:'Fraunces','Times New Roman',serif;font-weight:500;font-size:1.35rem;line-height:1.2;letter-spacing:-.01em;margin:0}
.journal-card h2 a{color:#231F1F;text-decoration:none}
.journal-card h2 a:hover{color:#0032A1}
.journal-card p{margin:0;color:#6B7280;font-size:.97rem;line-height:1.6}
.journal-card .journal-meta{font-size:.82rem;color:#6B7280;margin-top:auto;padding-top:8px}
.journal-card .journal-more{font-weight:600;color:#0032A1;font-size:.92rem;text-decoration:none}
.article{max-width:760px;margin:0 auto}
.article-photo{margin:0 0 36px;border-radius:14px;overflow:hidden;aspect-ratio:16/9;background:#EBF0FF}
.article-photo img{width:100%;height:100%;object-fit:cover;display:block}
.article p{font-size:1.08rem;line-height:1.75;color:#231F1F;margin:0 0 20px}
.article h2{font-family:'Fraunces','Times New Roman',serif;font-weight:500;font-size:1.7rem;line-height:1.2;letter-spacing:-.01em;margin:40px 0 12px;color:#231F1F}
.article a{color:#0032A1;text-decoration:underline;text-underline-offset:4px}
.article-meta{font-size:.9rem;color:rgba(255,255,255,.78);margin-top:14px}
.article-back{display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:#0032A1;text-decoration:none;margin-bottom:8px}
.article-cta{margin:44px 0 0;padding:28px;border-radius:14px;background:#EBF0FF;border:1px solid #d5defa;font-size:1.05rem}
.article-cta a{font-weight:600}

/* ---------- Simple centred message page (404) ---------- */
.notfound{min-height:52vh;display:flex;align-items:center}
.notfound .copy{max-width:680px}
.notfound p{font-size:1.1rem;line-height:1.7}
.notfound a{color:#0032A1;text-decoration:underline;text-underline-offset:4px}

/* ---------- Partner (architects & builders) page ---------- */
.partner-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:8px}
@media (max-width:900px){.partner-grid{grid-template-columns:1fr}}
.partner-card{background:#fff;border:1px solid #E5E1D6;border-radius:14px;padding:28px}
.partner-card h3{font-family:'Fraunces','Times New Roman',serif;font-weight:500;font-size:1.3rem;margin:0 0 10px;color:#231F1F}
.partner-card p{margin:0;color:#6B7280;line-height:1.65}
.partner-photo{border-radius:14px;overflow:hidden;aspect-ratio:16/9;margin:0 0 36px;background:#EBF0FF}
.partner-photo img{width:100%;height:100%;object-fit:cover;display:block}

/* ---------- Hero picture element fills its box like the old <img> ---------- */
.hero-bg picture{display:contents}