/* =====================================================================
   header.css — Header global Apple-like (Fase C)
   ---------------------------------------------------------------------
   Substitui visualmente a navbar bootsnav. Classes "ap-" próprias para
   não colidir com o Bootstrap/bootsnav. Logo Moutil mantido (68px).
   Verde Moutil #3ea22b só como acento (hover/underline/ativo).
   ===================================================================== */
:root{
  --ap-ink:#1d1d1f; --ap-muted:#86868b; --ap-hair:#e8e8e8;
  --ap-green:#3ea22b; --ap-green-d:#2c7d1f;
}

/* esconde a navbar bootsnav antiga, se algum resíduo aparecer */
nav.navbar.bootsnav{display:none !important;}

/* ---------- header ---------- */
.ap-header{
  position:sticky; top:0; z-index:1000;
  display:flex; align-items:center; gap:18px;
  height:80px; padding:0 5%;
  background:rgba(255,255,255,.72);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid var(--ap-hair);
  transition:box-shadow .3s ease, background .3s ease;
  font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
.ap-header.ap-scrolled{box-shadow:0 1px 12px rgba(0,0,0,.06);}
.ap-header .ap-logo{display:flex;align-items:center;flex:0 0 auto;}
.ap-header .ap-logo img{height:68px;width:auto;display:block;}

/* ---------- nav (desktop) ---------- */
.ap-header .ap-nav{flex:1;display:flex;align-items:center;justify-content:center;gap:32px;}
.ap-header .ap-nav > a,
.ap-header .ap-nav .ap-dd-wrap > a{
  position:relative; font-size:17px; font-weight:500; color:var(--ap-ink);
  display:inline-flex; align-items:center; gap:5px; white-space:nowrap;
  transition:color .2s ease; text-decoration:none;
}
.ap-header .ap-nav > a:hover,
.ap-header .ap-nav .ap-dd-wrap > a:hover{color:var(--ap-green);}
.ap-header .ap-nav > a::after,
.ap-header .ap-nav .ap-dd-wrap > a::after{
  content:""; position:absolute; left:0; right:0; bottom:-7px; height:2px;
  background:var(--ap-green); transform:scaleX(0); transform-origin:left;
  transition:transform .25s ease;
}
.ap-header .ap-nav > a:hover::after,
.ap-header .ap-nav > a.active::after,
.ap-header .ap-nav .ap-dd-wrap > a:hover::after,
.ap-header .ap-nav .ap-dd-wrap > a.active::after{transform:scaleX(1);}
.ap-header .ap-caret{font-size:9px;opacity:.6;}

/* ---------- lupa ---------- */
.ap-header .ap-lupa{
  flex:0 0 auto; background:none; border:0; color:var(--ap-ink);
  font-size:19px; cursor:pointer; padding:6px; line-height:1;
  text-decoration:none; transition:color .2s ease;
}
.ap-header .ap-lupa:hover{color:var(--ap-green);}

/* ---------- dropdown "Produtos" ---------- */
.ap-header .ap-dd-wrap{position:relative;}
.ap-header .ap-dd{
  position:absolute; top:100%; left:50%;
  transform:translateX(-50%) translateY(8px);
  min-width:200px; background:#fff; border:1px solid var(--ap-hair);
  border-radius:12px; padding:6px; opacity:0; visibility:hidden;
  transition:all .2s ease; z-index:1001;
}
.ap-header .ap-dd-wrap:hover .ap-dd{opacity:1;visibility:visible;transform:translateX(-50%) translateY(4px);}
.ap-header .ap-dd a{display:block;padding:9px 14px;font-size:14px;border-radius:8px;color:var(--ap-ink);text-decoration:none;}
.ap-header .ap-dd a:hover{background:#f5f5f7;color:var(--ap-green);}

/* ---------- hambúrguer (mobile) ---------- */
.ap-header .ap-burger{
  display:none; flex:0 0 auto; width:26px; height:20px; position:relative;
  background:none; border:0; cursor:pointer; padding:0;
}
.ap-header .ap-burger span{
  position:absolute; left:0; right:0; height:2px; background:var(--ap-ink);
  border-radius:2px; transition:transform .25s ease, opacity .2s ease;
}
.ap-header .ap-burger span:nth-child(1){top:2px;}
.ap-header .ap-burger span:nth-child(2){top:9px;}
.ap-header .ap-burger span:nth-child(3){top:16px;}
.ap-header .ap-burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.ap-header .ap-burger.open span:nth-child(2){opacity:0;}
.ap-header .ap-burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ---------- menu mobile (overlay) ---------- */
.ap-mobile{
  display:none; position:fixed; top:80px; left:0; right:0; bottom:0; z-index:999;
  background:#fff; padding:18px 7% 40px; overflow-y:auto;
  font-family:'Manrope',sans-serif;
}
.ap-mobile.open{display:block;}
.ap-mobile a{display:block;padding:15px 0;font-size:20px;font-weight:500;color:var(--ap-ink);
  border-bottom:1px solid var(--ap-hair);text-decoration:none;}
.ap-mobile a:hover{color:var(--ap-green);}
.ap-mobile .ap-m-group{display:block;padding:18px 0 6px;font-size:13px;font-weight:600;
  letter-spacing:.05em;text-transform:uppercase;color:var(--ap-muted);}
.ap-mobile a.ap-m-sub{font-size:17px;font-weight:400;padding:11px 0 11px 14px;}
body.ap-noscroll{overflow:hidden;}

/* ---------- .top-search restilizada (minimal Apple) ---------- */
/* (position:fixed vem de search.css; aqui só o aspeto claro) */
.top-search{background:#fff;border-bottom:1px solid var(--ap-hair);padding:16px 0;}
.top-search .container{max-width:860px;}
.top-search input.form-control{color:var(--ap-ink);font-family:'Manrope',sans-serif;font-size:18px;}
.top-search input.form-control::-webkit-input-placeholder{color:var(--ap-muted);}
.top-search input.form-control::placeholder{color:var(--ap-muted);}
.top-search .input-group-addon{color:var(--ap-muted);}
.top-search .input-group-addon.close-search{cursor:pointer;}

/* ---------- responsive ---------- */
@media(max-width:760px){
  .ap-header{height:64px;}
  .ap-header .ap-logo img{height:48px;}
  .ap-header .ap-nav{display:none;}
  .ap-header .ap-burger{display:block;}
  .ap-mobile{top:64px;}
}