/* Herança Hebraica — MENU ÚNICO do site, barra "Receber a Carta" e rodapé
   "Mais" (25/09/2026).

   Arquivo próprio, e não site.css, porque a home e as páginas avulsas
   (/apoiar, /parceiros, /privacidade, /acessibilidade) não carregam o
   site.css — cada uma tem o CSS dela. Tudo aqui vive sob o prefixo .hhm-
   pra não conversar com o .nav/.drawer antigo que ainda está nesses CSS.

   O visual é o masthead de 23/09: faixa azul com a marca centralizada,
   filete dourado, e a faixa de baixo com o menu. Ele fica NO FLUXO da
   página, sem flutuar sobre o herói — era isso que dava o azul sobre azul.

   O HTML do menu mora em cada página, entre <!-- NAV:INICIO --> e
   <!-- NAV:FIM -->, e é escrito por scripts/aplicar-menu-unico.mjs. */

.hhm, .hhm-painel, .hhm-barra, .hhm-folha, .hhm-rodape{
  --hhm-azul:#1B3D8F; --hhm-azul-fundo:#142F73; --hhm-noite:#0A1838; --hhm-noite-2:#081022;
  --hhm-ouro:#D4A849; --hhm-ouro-claro:#E3BC6A; --hhm-ouro-texto:#7A5E1C;
  --hhm-creme:#FAF8F3; --hhm-tinta:#1A1A1A;
  --hhm-display:'Cormorant Garamond',Georgia,serif; --hhm-sans:'Inter',system-ui,-apple-system,sans-serif; --hhm-mono:'JetBrains Mono',ui-monospace,monospace;
  box-sizing:border-box;
}
.hhm *, .hhm-painel *, .hhm-barra *, .hhm-folha *, .hhm-rodape *{box-sizing:border-box}
.hhm a:focus-visible, .hhm button:focus-visible, .hhm-painel a:focus-visible, .hhm-painel button:focus-visible,
.hhm-barra button:focus-visible, .hhm-folha a:focus-visible, .hhm-folha button:focus-visible, .hhm-rodape a:focus-visible{
  outline:2px solid var(--hhm-ouro-claro);outline-offset:3px}
.hhm-sr{position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ── Masthead ─────────────────────────────────────────────────────── */
.hhm{position:relative;z-index:90;background:var(--hhm-azul);color:var(--hhm-creme);font-family:var(--hhm-sans)}
.hhm-topo{display:flex;flex-direction:column;align-items:center;gap:9px;padding:26px 24px 20px;text-align:center}
.hhm-marca{display:flex;align-items:center;gap:14px;text-decoration:none;min-height:44px}
.hhm-marca img{height:46px;width:auto;display:block}
.hhm-nome{font-family:var(--hhm-display);font-weight:500;font-size:30px;letter-spacing:.03em;text-transform:uppercase;color:var(--hhm-creme);white-space:nowrap}
.hhm-tag{margin:0;font-family:var(--hhm-mono);font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--hhm-ouro-claro)}
.hhm-filete{height:1px;background:linear-gradient(90deg,transparent 0%,var(--hhm-ouro) 22%,var(--hhm-ouro) 78%,transparent 100%);opacity:.75}
.hhm-faixa{background:var(--hhm-azul-fundo);display:flex;align-items:center;justify-content:center;gap:28px;min-height:52px;padding:0 48px;position:relative}
.hhm-lista{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:0 26px}
.hhm-lista a{display:inline-flex;align-items:center;justify-content:center;min-height:52px;min-width:44px;font-family:var(--hhm-mono);font-size:11.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--hhm-creme);text-decoration:none;position:relative}
.hhm-lista a::after{content:'';position:absolute;left:0;bottom:12px;height:1.5px;width:0;background:var(--hhm-ouro);transition:width .25s}
.hhm-lista a:hover::after,.hhm-lista a[aria-current="page"]::after{width:100%}
.hhm-lista a[aria-current="page"]{color:var(--hhm-ouro-claro)}
.hhm-cta{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 20px;background:var(--hhm-ouro);color:var(--hhm-noite);text-decoration:none;border-radius:10px;
  font-family:var(--hhm-mono);font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.hhm-cta:hover{background:var(--hhm-ouro-claro)}
.hhm-faixa .hhm-cta{position:absolute;right:48px;top:50%;transform:translateY(-50%)}
.hhm-abrir{display:none}

/* Celular e tablet: uma faixa só — marca, nome curto e o botão do menu. */
@media (max-width:899px){
  .hhm-topo{flex-direction:row;justify-content:space-between;padding:10px 12px 10px 16px;gap:12px}
  .hhm-marca img{height:34px}
  .hhm-nome{font-size:19px;letter-spacing:.04em}
  .hhm-tag,.hhm-faixa{display:none}
  .hhm-filete{opacity:.5}
  .hhm-abrir{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:48px;height:48px;padding:12px;background:none;border:0;cursor:pointer;border-radius:10px}
  .hhm-abrir span{display:block;height:2px;width:100%;background:var(--hhm-creme);border-radius:2px}
}
@media (min-width:900px) and (max-width:1100px){
  .hhm-faixa{justify-content:flex-start;padding:0 24px}
  .hhm-faixa .hhm-cta{right:24px}
}

/* ── Menu aberto (tela cheia) ─────────────────────────────────────── */
/* Acima do aviso de cookies (9999): menu e folha são modais. */
.hhm-painel{position:fixed;inset:0;z-index:10010;background:var(--hhm-noite-2);color:var(--hhm-creme);display:flex;flex-direction:column;
  overflow-y:auto;overscroll-behavior:contain;padding:0 20px calc(96px + env(safe-area-inset-bottom))}
.hhm-painel[hidden]{display:none}
.hhm-painel-topo{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0 12px;border-bottom:1px solid rgba(212,168,73,.25)}
.hhm-painel-topo .hhm-marca img{height:34px}
.hhm-painel-topo .hhm-nome{font-size:19px}
.hhm-fechar{width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;background:none;border:1px solid rgba(250,248,243,.25);border-radius:10px;color:var(--hhm-creme);cursor:pointer}
.hhm-fechar svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.hhm-principais{list-style:none;margin:14px 0 0;padding:0}
.hhm-principais a{display:flex;align-items:center;min-height:58px;font-family:var(--hhm-display);font-size:28px;font-weight:600;color:var(--hhm-creme);text-decoration:none;border-bottom:1px solid rgba(250,248,243,.1)}
.hhm-principais a[aria-current="page"]{color:var(--hhm-ouro-claro)}
.hhm-mais-tit{margin:26px 0 6px;font-family:var(--hhm-mono);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--hhm-ouro-claro)}
.hhm-mais{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.hhm-mais a{display:flex;align-items:center;min-height:44px;font-size:15px;color:rgba(250,248,243,.9);text-decoration:underline;text-decoration-color:rgba(212,168,73,.5);text-underline-offset:4px}
.hhm-painel-cta{position:fixed;left:20px;right:20px;bottom:calc(20px + env(safe-area-inset-bottom));min-height:52px;font-size:12.5px}
html.hhm-trava, html.hhm-trava body{overflow:hidden}
@media (min-width:900px){ .hhm-painel{max-width:480px;left:auto;box-shadow:-20px 0 60px -20px rgba(0,0,0,.6)} .hhm-painel-cta{left:auto;width:440px} }

/* ── Barra "Receber a Carta" (só celular) ─────────────────────────── */
.hhm-barra{display:none}
.hhm-folha[hidden]{display:none}
@media (max-width:767px){
  .hhm-barra{display:block;position:fixed;left:0;right:0;bottom:0;z-index:80;background:var(--hhm-noite);border-top:1px solid rgba(212,168,73,.35);
    padding:10px 16px calc(10px + env(safe-area-inset-bottom));text-align:center;transition:transform .25s ease}
  .hhm-barra.escondida{transform:translateY(110%)}
  .hhm-barra-btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;border:0;border-radius:10px;cursor:pointer;background:var(--hhm-ouro);color:var(--hhm-noite);
    font-family:var(--hhm-mono);font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
  .hhm-barra-linha{margin:6px 0 0;font-family:var(--hhm-sans);font-size:13px;line-height:1.3;color:rgba(250,248,243,.86)}
  html.hhm-com-barra body{padding-bottom:calc(98px + env(safe-area-inset-bottom))}
}
.hhm-folha-fundo{position:fixed;inset:0;z-index:10020;background:rgba(8,16,34,.6)}
.hhm-folha{position:fixed;left:0;right:0;bottom:0;z-index:10021;background:var(--hhm-creme);color:var(--hhm-tinta);border-radius:16px 16px 0 0;
  padding:20px 20px calc(20px + env(safe-area-inset-bottom));font-family:var(--hhm-sans);box-shadow:0 -20px 50px -20px rgba(8,16,34,.5)}
@media (min-width:768px){ .hhm-folha{left:50%;right:auto;bottom:24px;width:420px;transform:translateX(-50%);border-radius:16px} }
.hhm-folha-topo{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}
.hhm-folha h2{margin:0;font-family:var(--hhm-display);font-size:26px;font-weight:600;color:var(--hhm-azul)}
.hhm-folha .hhm-fechar{border-color:#E2DAC9;color:var(--hhm-tinta)}
.hhm-folha p{margin:0 0 14px;font-size:15px;line-height:1.5;color:#4A4A4A}
.hhm-folha-links{display:grid;gap:10px}
.hhm-folha-links a{display:flex;align-items:center;justify-content:center;min-height:52px;border-radius:10px;text-decoration:none;
  font-family:var(--hhm-mono);font-size:12.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.hhm-folha-links a:first-child{background:var(--hhm-ouro);color:var(--hhm-noite)}
.hhm-folha-links a + a{border:1.5px solid var(--hhm-azul);color:var(--hhm-azul)}

/* ── Rodapé "Mais" (fim de toda página do menu único) ─────────────── */
.hhm-rodape{background:var(--hhm-noite-2);color:var(--hhm-creme);padding:22px 20px;font-family:var(--hhm-sans)}
.hhm-rodape-in{max-width:1100px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:4px 22px;justify-content:center}
.hhm-rodape-tit{font-family:var(--hhm-mono);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--hhm-ouro-claro)}
.hhm-rodape a{display:inline-flex;align-items:center;min-height:44px;font-size:14.5px;color:rgba(250,248,243,.92);text-decoration:underline;text-decoration-color:rgba(212,168,73,.5);text-underline-offset:4px}

/* Páginas de venda (/5787, /shabat, /hebraico): sem menu, com volta. */
.hhm-voltar{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;font-family:var(--hhm-sans,'Inter',sans-serif);font-size:15px;font-weight:600;color:inherit;text-decoration:underline;text-underline-offset:4px}
.hhm-voltar-linha{text-align:center;margin:0 0 8px}

@media (prefers-reduced-motion:reduce){ .hhm-lista a::after,.hhm-barra{transition:none} }

/* ── A barra nova substitui a faixa "Receber a Carta" antiga da home ── */
html.hhm-com-barra .faixa-carta{display:none !important}

/* ── Alvos de toque das páginas públicas (celular) ────────────────────
   Todo link e botão com área mínima de 44×44px, sem mudar o desenho: os
   pontinhos dos carrosséis crescem em padding transparente
   (background-clip), e os links de rodapé e de texto solto ganham altura
   de linha. Vale nas páginas que carregam este arquivo. */
@media (max-width:767px){
  .footer-col a, footer .links a, .about .links a, .blog3-antes a, .hhm-rodape a{display:flex;align-items:center;min-height:44px;min-width:44px}
  .link-privacidade a, .footer-klik, .footer-bot a, .ac-inner a, .ac-inner p a, p.produtos a, .parc-mais, .convert-ghost, .act, a.volta,
  .acoes a, footer .sign a, .apoio-linha a, header.top a, .hhm-rodape a{display:inline-flex;align-items:center;min-height:44px;min-width:44px}
  .ac-inner button, .ps-like, .hb-desce{min-height:44px;min-width:44px}
  .capture-row button, .capture-row input{min-height:44px}
  .hr-dots button, .parc-pontos button, .pontos button, .loja-pontos button{box-sizing:content-box !important;background-clip:content-box !important;
    padding:20px 18px !important;margin:0 !important;border:0 !important}
  .hr-dots button{padding:21px 18px !important}
  .hr-dots{gap:0 !important}
}

/* O .page do blog/revista reservava 74px pro menu fixo antigo. O masthead
   agora está no fluxo, então a reserva vira só vão. */
header.hhm ~ main.page{padding-top:8px}
