/* Casa Fabri — site público
   Cores e tipos do design system Casa Fabri (brand book).
   Fraunces e Work Sans substituem The Seasons e Brother 1816 até a licença web das fontes oficiais. */
:root{
  --verde:#294023; --verde-900:#142F0C; --verde-500:#3C5E33; --verde-100:#C9D3B3;
  --terracota:#C0450B; --terracota-900:#A13807;
  --amarelo:#F2AA00; --rosa:#F2CCCC;
  --creme:#FAF3E9; --creme-700:#F3E7D6; --creme-900:#E5D8C6;
  --display:"Fraunces",Georgia,"Times New Roman",serif;
  --texto:"Work Sans",-apple-system,"Segoe UI",sans-serif;
  --preco:"EB Garamond",Garamond,Georgia,serif;
  --manuscrito:"Caveat","Segoe Script",cursive;
  --raio:12px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--creme);color:var(--verde-900);font-family:var(--texto);font-size:17px;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:var(--terracota-900)}
a:hover{color:var(--verde)}
:focus-visible{outline:3px solid var(--amarelo);outline-offset:2px}
.wrap{max-width:1200px;margin:0 auto;padding-inline:20px}
.olho{font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--terracota-900);margin:0}
h1,h2,h3{font-family:var(--display);font-weight:500;color:var(--verde);margin:0;text-wrap:balance}
h1{font-size:clamp(40px,6vw,72px);line-height:.98}
h2{font-size:clamp(32px,4.4vw,48px);line-height:1.02}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 24px;border-radius:var(--raio);font-weight:600;text-decoration:none;border:2px solid transparent;transition:background .2s,color .2s}
.btn-terracota{background:var(--terracota);color:var(--creme)}
.btn-terracota:hover{background:var(--terracota-900);color:var(--creme)}
.btn-verde{background:var(--verde);color:var(--creme)}
.btn-verde:hover{background:var(--verde-900);color:var(--creme)}
.btn-contorno{border-color:var(--verde);color:var(--verde)}
.btn-contorno:hover{background:var(--verde);color:var(--creme)}
.btn-amarelo{background:var(--amarelo);color:var(--verde-900)}
.btn-amarelo:hover{background:#DF9300;color:var(--verde-900)}
.btn-creme{background:var(--creme);color:var(--verde)}
.btn-creme:hover{background:var(--creme-700);color:var(--verde)}
.btn-contorno-claro{border-color:var(--creme);color:var(--creme)}
.btn-contorno-claro:hover{background:var(--creme);color:var(--verde)}
.acoes{display:flex;flex-wrap:wrap;gap:12px}

/* topo */
.topo{position:sticky;top:0;z-index:10;background:var(--verde)}
.topo .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:10px;flex-wrap:wrap}
.topo .logo img{height:54px;width:auto}
.menu{display:flex;align-items:center;flex-wrap:wrap;gap:4px 22px;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.menu a{color:var(--creme);text-decoration:none;padding:12px 0}
.menu a:hover{color:var(--amarelo)}
.menu .btn{letter-spacing:.06em;padding:10px 18px;min-height:44px}
@media (max-width:760px){.menu a:not(.btn){display:none}.topo .logo img{height:44px}}

/* abertura */
.abertura{padding-block:56px 48px}
.abertura .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:40px;align-items:center}
.abertura .texto{display:flex;flex-direction:column;gap:20px}
.abertura p.sub{margin:0;font-size:19px;color:var(--verde-500);max-width:36ch}
.abertura .info-rapida{margin:0;font-size:16px;color:var(--verde-500)}
.abertura figure{margin:0;display:flex;justify-content:center}
.abertura figure img{max-width:420px;width:100%}

/* blocos */
section{padding-block:64px}
.faixa-creme{background:var(--creme-700)}
.cabecalho{display:flex;flex-direction:column;gap:10px;margin-bottom:28px;max-width:760px}
.cabecalho p{margin:0;font-size:18px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:20px}
.card{background:var(--creme);border-radius:var(--raio);padding:22px;display:flex;flex-direction:column;gap:6px}
.faixa-creme .card{background:var(--creme)}
.card h3{font-size:23px}
.card p{margin:0;font-size:16px;color:var(--verde-500)}

/* cardápio */
.cardapio-topo{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:24px}
.cardapio-topo .manuscrito{font-family:var(--manuscrito);font-size:24px;color:var(--terracota-900)}
.abas{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px}
.aba{font:inherit;font-size:15px;font-weight:600;min-height:44px;padding:10px 20px;border-radius:999px;cursor:pointer;border:2px solid var(--verde);background:transparent;color:var(--verde)}
.aba[aria-selected="true"]{background:var(--verde);color:var(--creme)}
.categoria{background:var(--creme-700);border-radius:24px;padding:28px}
.categoria[hidden]{display:none}
.js-off .categoria{margin-bottom:16px}
.categoria-topo{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 16px;margin-bottom:8px}
.categoria-topo h3{font-size:30px}
.categoria-topo p{margin:0;font-size:15px;color:var(--verde-500);max-width:60ch}
.itens{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));column-gap:48px}
.item{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--creme-900)}
.item .nome{font-weight:600;font-size:15px;letter-spacing:.02em;text-transform:uppercase}
.item .desc{display:block;font-size:16px;color:var(--verde-500);margin-top:3px}
.item .preco{font-family:var(--preco);font-style:italic;font-size:20px;color:var(--terracota-900);white-space:nowrap;font-variant-numeric:tabular-nums}
.cardapio-rodape{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-top:22px}
.cardapio-rodape p{margin:0;font-size:15px;color:var(--verde-500);max-width:70ch}

/* visite */
#visite{background:var(--verde);color:var(--creme)}
#visite h2{color:var(--creme)}
#visite .olho,#visite .rotulo{color:var(--amarelo)}
#visite .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:40px;align-items:stretch}
.visite-texto{display:flex;flex-direction:column;gap:24px}
.visite-texto p{margin:0}
.visite-texto .sub{font-size:17px;color:var(--verde-100)}
.rotulo{font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin:0 0 4px}
.dado{font-size:20px;margin:0}
.dado small{display:block;font-size:16px;color:var(--verde-100)}
.mapa{border-radius:24px;overflow:hidden;min-height:380px;background:var(--creme-700)}
.mapa iframe{display:block;width:100%;height:100%;min-height:380px;border:0}

/* rodapé */
.rodape{background:var(--verde-900);color:var(--creme);padding-block:32px}
.rodape .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px}
.rodape .assinatura{font-family:var(--display);font-style:italic;font-size:24px;margin:0}
.rodape p{margin:0;font-size:15px;color:var(--verde-100)}
.rodape a{color:var(--amarelo)}

/* botão flutuante de WhatsApp */
.whats-flutuante{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:20;display:inline-flex;align-items:center;gap:8px;background:var(--amarelo);color:var(--verde-900);font-weight:700;text-decoration:none;padding:14px 20px;border-radius:999px;box-shadow:0 8px 24px rgba(20,47,12,.18)}
.whats-flutuante:hover{background:#DF9300;color:var(--verde-900)}
.whats-flutuante svg{width:22px;height:22px}

.cabecalho.sem-margem{margin-bottom:0}
.pagina-erro{padding-block:96px;display:flex;flex-direction:column;gap:20px;align-items:flex-start}
