/* ==========================================================================
   Best Care Services - Header + Mega menu (plain CSS, no frameworks)
   Breakpoint: desktop layout >= 1180px, collapsed menu below.
   ========================================================================== */

:root{
  --bc-blue:#00539C;
  --bc-blue-dark:#003a70;
  --bc-accent:#e13e20;
  --bc-accent-dark:#c2331a;
  --bc-cream:#fffee0;
  --bc-ink:#10243a;
  --bc-sep:rgba(190,196,208,.38);       /* feint grey dashed separator */
  --bc-header-h:68px;
  --bc-font:'Nunito',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
body{
  margin:0; padding-top:var(--bc-header-h); font-family:var(--bc-font); color:var(--bc-ink);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility; font-kerning:normal;
}
/* Nunito on every element, headings and form controls included */
h1,h2,h3,h4,h5,h6,p,li,a,span,strong,em,small,summary,figcaption,code,
button,input,select,textarea,label{ font-family:var(--bc-font); }

.bc-container{ width:100%; max-width:1240px; margin:0 auto; padding:0 1.25rem; }

.bc-skip{ position:absolute; left:-999px; top:0; z-index:2000; background:#fff; color:#000; padding:.5rem 1rem; }
.bc-skip:focus{ left:0; }

/* ---------- Header shell ---------- */
.bc-header{
  position:fixed; top:0; left:0; right:0; z-index:1030;
  background:var(--bc-blue);
  font-family:var(--bc-font);
  transition:box-shadow .2s;
}
.bc-header.is-scrolled{ box-shadow:0 2px 14px rgba(0,0,0,.22); }
.bc-header a{ text-decoration:none; }

/* 3-column grid: logo | menu (true centre) | actions */
.bc-navbar{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:stretch;
  height:var(--bc-header-h);
}
.bc-brand{ grid-column:1; display:flex; align-items:center; justify-self:start; }
.bc-brand img{ display:block; width:auto; height:40px; }

.bc-collapse{ display:contents; }           /* desktop: children join the grid */
.bc-toggler{ display:none; }

/* ---------- Menu ---------- */
.bc-menu{
  grid-column:2;
  display:flex; align-items:stretch; justify-content:center;
  list-style:none; margin:0; padding:0;
}
.bc-menu > li{ display:flex; align-items:stretch; }

.bc-link{
  position:relative;
  display:flex; align-items:center; gap:.45rem;
  padding:0 1rem;
  color:rgba(255,255,255,.94);
  font-size:.95rem; font-weight:700; letter-spacing:.01em;
  transition:color .15s;
}
.bc-link .bc-ti{ font-size:.95rem; color:rgba(255,255,255,.7); transition:color .15s; }
.bc-link:hover,
.bc-link:focus-visible{ color:#fff; }
.bc-link:hover .bc-ti,
.bc-link:focus-visible .bc-ti{ color:var(--bc-cream); }

/* cream underline: hover + current page */
.bc-link::after{
  content:""; position:absolute; left:1rem; right:1rem; bottom:0; height:3px;
  background:var(--bc-cream); border-radius:1.5px 1.5px 0 0;
  transform:scaleX(0); transition:transform .2s ease;
}
.bc-link:hover::after,
.bc-link:focus-visible::after,
.bc-link.is-active::after,
.bc-has-mega.is-open > .bc-link::after{ transform:scaleX(1); }
.bc-link.is-active .bc-ti,
.bc-has-mega.is-open > .bc-link .bc-ti{ color:var(--bc-cream); }

/* feint grey dashed separator between items */
.bc-menu > li + li > .bc-link::before{
  content:""; position:absolute; left:0; top:50%;
  height:26px; transform:translateY(-50%);
  border-left:1px dashed var(--bc-sep);
}

/* Services link + caret */
.bc-has-mega > .bc-link{ padding-right:.2rem; }
.bc-has-mega > .bc-link::after{ right:0; }
.bc-caret{
  display:flex; align-items:center;
  background:none; border:0; margin:0; cursor:pointer;
  padding:0 .85rem 0 .3rem;
  color:rgba(255,255,255,.8); font:inherit;
}
.bc-caret .ti-angle-down{ font-size:.62rem; font-weight:700; transition:transform .2s; }
.bc-caret:hover{ color:#fff; }
.bc-has-mega.is-open .bc-caret .ti-angle-down{ transform:rotate(180deg); }

:where(.bc-link,.bc-caret,.bc-btn,.bc-toggler):focus-visible{
  outline:2px solid var(--bc-cream); outline-offset:-2px; border-radius:6px;
}
.bc-mega a:focus-visible{ outline:2px solid var(--bc-blue); outline-offset:-2px; border-radius:7px; }
.bc-mega-cta .bc-btn:focus-visible{ outline-color:var(--bc-blue); outline-offset:2px; }

/* ---------- Mega menu ---------- */
/* No positioned ancestor between panel and header, so it spans the full header width */
.bc-mega{
  display:none;
  position:absolute; left:0; right:0; top:100%;
  background:#fff;
  border-top:3px solid var(--bc-accent);
  border-radius:0 0 14px 14px;
  box-shadow:0 22px 40px rgba(0,41,79,.22);
  animation:bc-drop .18s ease-out;
}
.bc-has-mega.is-open > .bc-mega{ display:block; }
@keyframes bc-drop{ from{ opacity:0; transform:translateY(-6px); } to{ opacity:1; transform:none; } }

.bc-mega-grid{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:2rem; padding-top:1.6rem; padding-bottom:1.9rem;
}
.bc-mega-title{
  margin:0 0 .65rem; padding-bottom:.55rem;
  font-size:.76rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase;
  color:var(--bc-blue); border-bottom:2px solid #e6eef7;
}
.bc-mega ul{ list-style:none; margin:0; padding:0; }
.bc-mega li a{
  display:flex; align-items:center; gap:.65rem;
  padding:.45rem .5rem; border-radius:8px;
  color:var(--bc-ink); font-size:.92rem; font-weight:700;
  transition:background-color .15s,color .15s,transform .15s;
}
.bc-mega li a .bc-ti{
  flex:0 0 30px; width:30px; height:30px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:25%; background:#e8f1fa; color:var(--bc-blue); font-size:.82rem;
  transition:background-color .15s,color .15s;
}
.bc-mega li a:hover,
.bc-mega li a:focus-visible{ background:#fffef0; color:var(--bc-blue); transform:translateX(3px); }
.bc-mega li a:hover .bc-ti,
.bc-mega li a:focus-visible .bc-ti{ background:var(--bc-blue); color:#fff; }

.bc-mega-cta{
  height:100%; padding:1.5rem; border-radius:12px; color:#fff;
  background:var(--bc-blue);
  display:flex; flex-direction:column; justify-content:center; align-items:flex-start;
}
.bc-mega-cta-title{ margin:0 0 .5rem; font-size:1.1rem; font-weight:800; color:#fff; }
.bc-mega-cta-text{ margin:0 0 1.1rem; font-size:.88rem; line-height:1.5; opacity:.92; }

/* ---------- Buttons ---------- */
.bc-actions{
  grid-column:3; justify-self:end;
  display:flex; align-items:center; gap:.55rem;
}
.bc-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.45rem;
  padding:.55rem 1.1rem; border:1px solid transparent; border-radius:10px;
  font:800 .86rem/1.2 var(--bc-font); white-space:nowrap; cursor:pointer;
  transition:background-color .15s,color .15s,border-color .15s,transform .15s;
}
.bc-btn .bc-ti{ font-size:.95rem; }
.bc-btn:hover{ transform:translateY(-1px); }
.bc-btn-sm{ padding:.5rem .95rem; }
.bc-btn-outline-light{ color:#fff; border-color:rgba(255,255,255,.65); background:transparent; }
.bc-btn-outline-light:hover{ background:#fff; color:var(--bc-blue); border-color:#fff; }
.bc-btn-gold,.bc-btn-primary{ color:#fff; background:var(--bc-accent); border-color:var(--bc-accent); }
.bc-btn-gold:hover,.bc-btn-primary:hover{ background:var(--bc-accent-dark); border-color:var(--bc-accent-dark); color:#fff; }

/* ---------- Toggler (round, 30px = 30% smaller than the old ~43x35 box) ---------- */
.bc-toggler{
  position:relative;
  align-self:center; justify-self:end;
  width:30px; height:30px; padding:0; margin:0;
  border:1.5px solid rgba(255,255,255,.6); border-radius:25%;
  background:transparent; cursor:pointer;
  transition:background-color .2s,border-color .2s;
}
.bc-toggler::after{ content:""; position:absolute; inset:-7px; }   /* 44px touch target */
.bc-toggler:hover{ background:rgba(255,255,255,.12); border-color:#fff; }
.bc-toggler-icon,
.bc-toggler-icon::before,
.bc-toggler-icon::after{
  position:absolute; left:50%; width:12px; height:2px; margin-left:-6px;
  background:#fff; border-radius:1px; transition:transform .25s,opacity .2s,top .25s;
}
.bc-toggler-icon{ top:50%; margin-top:-1px; }
.bc-toggler-icon::before,.bc-toggler-icon::after{ content:""; left:0; margin-left:0; }
.bc-toggler-icon::before{ top:-4px; }
.bc-toggler-icon::after{ top:4px; }
.bc-toggler[aria-expanded="true"]{ background:var(--bc-cream); border-color:var(--bc-cream); }
.bc-toggler[aria-expanded="true"] .bc-toggler-icon{ background:transparent; }
.bc-toggler[aria-expanded="true"] .bc-toggler-icon,
.bc-toggler[aria-expanded="true"] .bc-toggler-icon::before,
.bc-toggler[aria-expanded="true"] .bc-toggler-icon::after{ background-color:transparent; }
.bc-toggler[aria-expanded="true"] .bc-toggler-icon::before{ top:0; background:var(--bc-blue); transform:rotate(45deg); }
.bc-toggler[aria-expanded="true"] .bc-toggler-icon::after{ top:0; background:var(--bc-blue); transform:rotate(-45deg); }

/* ---------- No-JS fallback (desktop hover via CSS) ---------- */
@media (min-width:1180px){
  .no-js .bc-has-mega:hover > .bc-mega,
  .no-js .bc-has-mega:focus-within > .bc-mega{ display:block; }
}

/* ---------- Collapsed layout ---------- */
@media (max-width:1179.98px){
  :root{ --bc-header-h:64px; }
  .bc-navbar{ display:flex; align-items:center; justify-content:space-between; }
  .bc-brand img{ height:36px; }
  .bc-toggler{ display:block; }

  .bc-collapse{
    display:none;
    position:absolute; top:100%; left:0; right:0;
    max-height:calc(100vh - var(--bc-header-h)); max-height:calc(100dvh - var(--bc-header-h));
    overflow-y:auto; overscroll-behavior:contain;
    padding:.25rem 1.25rem 1.25rem;
    background:var(--bc-blue);
    border-top:1px solid rgba(255,255,255,.14);
    box-shadow:0 18px 30px rgba(0,0,0,.25);
  }
  .bc-collapse.is-open{ display:block; animation:bc-drop .2s ease-out; }
  .no-js .bc-collapse{ display:block; }

  .bc-menu{ flex-direction:column; align-items:stretch; }
  .bc-menu > li{ flex-wrap:wrap; border-bottom:1px dashed var(--bc-sep); }
  .bc-menu > li + li > .bc-link::before{ display:none; }
  .bc-link{ flex:1 1 auto; padding:.95rem .25rem; font-size:1rem; }
  .bc-link::after{ display:none; }
  .bc-link.is-active,
  .bc-has-mega.is-open > .bc-link{ color:var(--bc-cream); }
  .bc-caret{ padding:0 .9rem; }

  .bc-mega{
    position:static; flex:0 0 100%;
    border-top:0; border-radius:12px; box-shadow:none; animation:none;
    margin:0 0 .75rem;
  }
  .bc-mega-grid{ grid-template-columns:1fr; gap:1.25rem; padding:1.1rem 1rem; }
  .no-js .bc-has-mega > .bc-mega{ display:block; }

  .bc-actions{ display:flex; gap:.6rem; padding-top:1.1rem; justify-self:stretch; }
  .bc-actions .bc-btn{ flex:1 1 0; padding:.7rem 1rem; }
}
@media (min-width:640px) and (max-width:1179.98px){
  .bc-mega-grid{ grid-template-columns:repeat(2,1fr); }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation:none !important; transition:none !important; }
}
