/* ============================================================
   Meridian Header & Footer — Elementor Widget Styles
   ============================================================ */

:root{
  --mer-blue:#0F4AAA;
  --mer-blue-lt:#2563d4;
  --mer-ink:#1a1d23;
  --mer-muted:#6b7280;
  --mer-border:rgba(0,0,0,.10);
  --mer-serif:'Playfair Display',Georgia,serif;
  --mer-sans:'DM Sans',system-ui,sans-serif;
  --mer-trans:.35s cubic-bezier(.4,0,.2,1);
}

/* ------------------------------------------------------------
   Elementor wrapper reset
   The header/footer widget renders its own full-width bar and its
   own centered .container. Elementor wraps the widget in a flex
   container that (a) caps content width and (b) only sizes the
   widget to its content. These rules force our widget to stretch
   full width whether the parent is a Section or a flexbox Container.
   ------------------------------------------------------------ */

/* the widget element itself + its inner container: take all width,
   and as a flex child, stretch + grow so it never shrinks to content */
.elementor-widget-meridian_header,
.elementor-widget-meridian_footer{
  width:100%; max-width:none; margin:0; padding:0;
  flex:1 1 100%; align-self:stretch; --widgets-spacing:0px;
}
.elementor-widget-meridian_header > .elementor-widget-container,
.elementor-widget-meridian_footer > .elementor-widget-container{
  width:100%; max-width:none; margin:0; padding:0;
}

/* the PARENT container/section that holds our widget:
   remove its boxed cap + padding so nothing constrains us.
   Covers both the new flexbox containers (.e-con) and old sections. */
.e-con:has(> .e-con-inner > .elementor-widget-meridian_header),
.e-con:has(> .e-con-inner > .elementor-widget-meridian_footer),
.e-con:has(> .elementor-widget-meridian_header),
.e-con:has(> .elementor-widget-meridian_footer),
.elementor-element:has(> .elementor-widget-container > .site-header),
.elementor-element:has(> .elementor-widget-container > .site-footer){
  width:100%; max-width:100%; padding-left:0; padding-right:0;
  --content-width:100%; --container-max-width:100%;
}
/* the inner wrapper of a flexbox container also caps width — release it */
.e-con:has(.elementor-widget-meridian_header) > .e-con-inner,
.e-con:has(.elementor-widget-meridian_footer) > .e-con-inner{
  width:100%; max-width:100%; padding-left:0; padding-right:0;
}

/* shared container — single source of width truth */
.site-header .container,
.site-footer .container{
  width:92%; max-width:1240px; margin:0 auto; padding:0; box-sizing:border-box;
}

/* ============================================================
   HEADER
   ============================================================ */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  background:#fff; padding:1.1rem 0;
  font-family:var(--mer-sans);
  transition:background var(--mer-trans),box-shadow var(--mer-trans),padding var(--mer-trans);
}
.site-header.scrolled{
  background:rgba(255,255,255,.97);
  -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px);
  box-shadow:0 2px 30px rgba(0,0,0,.10);
  padding:.7rem 0;
}

/* offset so fixed header doesn't cover page content */
body.meridian-has-header{ padding-top:0; }

.site-header .nav-inner{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
}

.site-header .nav-logo{ display:flex; align-items:center; gap:.75rem; }
.site-header .nav-logo img{ height:65px; width:auto; display:block; }

/* primary menu */
.site-header .nav-links{
  display:flex; align-items:center; list-style:none; gap:1.75rem; margin:0; padding:0;
}
.site-header .nav-links > li{ position:relative; }
.site-header .nav-links > li > a{
  font-size:.88rem; font-weight:500; color:rgba(26,29,35,.65);
  letter-spacing:.02em; display:flex; align-items:center; gap:.25rem;
  text-decoration:none; transition:color var(--mer-trans);
}
.site-header .nav-links > li > a:hover{ color:var(--mer-blue); }
.site-header .nav-links > li > a .caret{ width:10px; height:10px; transition:transform var(--mer-trans); }
.site-header .nav-links > li:hover > a .caret{ transform:rotate(180deg); }

/* dropdown */
.site-header .nav-links > li{ position:relative; }
.site-header .nav-dropdown{
  position:absolute; top:calc(100% + .75rem); left:0;
  background:#fff; border:1px solid var(--mer-border); border-radius:1rem;
  box-shadow:0 20px 50px rgba(0,0,0,.12);
  min-width:220px; padding:.5rem 0;
  opacity:0; pointer-events:none; transform:translateY(8px);
  transition:opacity var(--mer-trans),transform var(--mer-trans); z-index:200;
}
/* invisible hover-bridge fills the gap so moving the cursor down to the
   dropdown doesn't drop the hover state */
.site-header .nav-dropdown::before{
  content:''; position:absolute; left:0; right:0; top:-.85rem; height:.85rem;
}
/* open on hover OR when JS adds .open (keep-open delay) */
.site-header .nav-links > li:hover .nav-dropdown,
.site-header .nav-links > li.open .nav-dropdown,
.site-header .nav-links > li:focus-within .nav-dropdown{
  opacity:1; pointer-events:all; transform:none;
}
.site-header .nav-dropdown a{
  display:block; padding:.6rem 1.25rem; font-size:.85rem;
  color:rgba(26,29,35,.7); text-decoration:none;
  transition:color var(--mer-trans),background var(--mer-trans);
}
.site-header .nav-dropdown a:hover{ color:var(--mer-blue); background:rgba(15,74,170,.05); }

/* cta */
.site-header .nav-cta{ display:flex; align-items:center; gap:.9rem; }
.site-header .btn{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.85rem 1.75rem; border-radius:50px;
  font-family:var(--mer-sans); font-size:.9rem; font-weight:600; letter-spacing:.04em;
  cursor:pointer; border:none; text-decoration:none; transition:var(--mer-trans);
}
.site-header .btn-amber{ background:var(--mer-blue); color:#fff; }
.site-header .btn-amber:hover{
  background:var(--mer-blue-lt); transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(15,74,170,.25);
}

/* hamburger */
.site-header .hamburger{
  display:none; flex-direction:column; gap:5px; cursor:pointer;
  padding:.3rem; background:none; border:none;
}
.site-header .hamburger span{
  display:block; width:24px; height:2px; background:#1a1d23;
  border-radius:2px; transition:var(--mer-trans);
}
.site-header .hamburger.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.site-header .hamburger.open span:nth-child(2){ opacity:0; }
.site-header .hamburger.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* mobile menu overlay */
.mobile-menu{
  display:none; position:fixed; inset:0;
  top:0 !important; left:0 !important; right:0 !important; bottom:0 !important;
  width:100vw !important; height:100vh !important; max-width:100vw !important;
  margin:0 !important; transform:none !important;
  background:#fff; z-index:99999;
  flex-direction:column; justify-content:center; align-items:center; text-align:center; gap:1.4rem;
  opacity:0; pointer-events:none; transition:opacity var(--mer-trans);
  overflow-y:auto; padding:4rem 2rem;
}
.mobile-menu.open{ display:flex; opacity:1; pointer-events:all; }
.mobile-menu a{
  font-family:var(--mer-serif); font-size:1.6rem; color:#1a1d23;
  text-decoration:none; transition:color var(--mer-trans); text-align:center;
}
.mobile-menu a:hover{ color:var(--mer-blue); }
.mobile-menu .mobile-phone-link{
  color:var(--mer-blue); font-size:1.1rem; font-family:var(--mer-sans); font-weight:600;
}
.mobile-close{
  position:absolute; top:1.5rem; right:1.5rem; background:none; border:none;
  color:#1a1d23; font-size:2rem; line-height:1; cursor:pointer;
  z-index:100000; width:44px; height:44px;
  display:flex; align-items:center; justify-content:center;
}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{
  background:#1a1d23; padding:4rem 0 2rem; font-family:var(--mer-sans);
  width:100%;
}
.site-footer .footer-top{
  display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:3rem;
  margin-bottom:3rem; padding-bottom:3rem;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.site-footer .footer-brand img{ height:auto; width:auto; display:block; }
.site-footer .footer-brand p{
  font-size:.88rem; color:rgba(255,255,255,.5); line-height:1.75; margin-top:1rem;
}
.site-footer .footer-socials{ display:flex; gap:.75rem; margin-top:1.5rem; }
.site-footer .social-btn{
  width:38px; height:38px; border-radius:.5rem;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1);
  display:flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,.5); text-decoration:none; transition:var(--mer-trans);
}
.site-footer .social-btn:hover{
  background:rgba(15,74,170,.4); border-color:rgba(15,74,170,.5); color:#fff;
}
.site-footer .footer-col h5{
  font-size:1rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.9); margin-bottom:1.25rem;
}
.site-footer .footer-col ul{ list-style:none; margin:0; padding:0; }
.site-footer .footer-col li{ margin-bottom:.65rem; }
.site-footer .footer-col a{
  font-size:.88rem; color:rgba(255,255,255,.45); text-decoration:none;
  transition:color var(--mer-trans);
}
.site-footer .footer-col a:hover{ color:rgba(255,255,255,.9); }
.site-footer .footer-bottom{
  display:flex; justify-content:space-between; align-items:center;
  font-size:.8rem; color:rgba(255,255,255,.3); flex-wrap:wrap; gap:1rem;
}

/* floating phone cta */
.float-cta{
  position:fixed; bottom:2rem; right:2rem; z-index:500;
  display:flex; flex-direction:column; align-items:flex-end; gap:.75rem;
  opacity:0; pointer-events:none; transition:opacity .4s ease;
}
.float-cta.show{ opacity:1; pointer-events:all; }
.float-btn{
  display:flex; align-items:center; gap:.6rem;
  background:var(--mer-blue); color:#fff; padding:.8rem 1.4rem; border-radius:50px;
  font-weight:700; font-size:.88rem; text-decoration:none;
  box-shadow:0 8px 30px rgba(15,74,170,.3); transition:var(--mer-trans);
}
.float-btn:hover{
  background:var(--mer-blue-lt); transform:translateY(-3px);
  box-shadow:0 16px 40px rgba(15,74,170,.4);
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1100px){
  .site-footer .footer-top{ grid-template-columns:1fr 1fr; gap:2rem; }
}
@media (max-width:640px){
  .site-header .nav-links{ display:none; }
  .site-header .hamburger{ display:flex; }
  .site-footer .footer-top{ grid-template-columns:1fr; }
  .float-cta{ bottom:1.25rem; right:1.25rem; }
}

/* ============================================================
   USER OVERRIDES
   ============================================================ */
.site-footer{
  max-width:1240px !important;
  padding-top:50px;
}
.site-header{
  max-width:1240px !important;
  margin-left:auto; margin-right:auto;
}
body.meridian-has-header{
  padding-top:0;
}