/* ============================================================
   Buffet Family · Site Institucional buffetfamily.com.br
   CSS compartilhado por TODAS as páginas do site novo
   ============================================================ */

:root{
  --ink:#0a0a0a;
  --ink-2:#3f3f46;
  --ink-3:#71717a;
  --paper:#ffffff;
  --bg:#fafaf8;
  --line:#e4e4e7;

  --purple:#5B2D8E;
  --purple-deep:#4A1E7E;
  --purple-mid:#7c3aed;
  --purple-bg:#f3edff;
  --pink:#ec4899;
  --pink-bg:#fdf2f8;
  --yellow:#fcd34d;
  --yellow-bg:#fffbeb;
  --lime:#a3e635;
  --lime-bg:#f7fee7;
  --orange:#f97316;
  --orange-bg:#fff7ed;
  --green:#10b981;
  --wa:#25D366;

  --font-display:'Playfair Display',Georgia,serif;
  --font-serif:'Instrument Serif',Georgia,serif;
  --font-body:'DM Sans',system-ui,sans-serif;

  --shadow-sm:0 2px 8px rgba(91,45,142,.06);
  --shadow-md:0 6px 22px rgba(91,45,142,.10);
  --shadow-lg:0 12px 36px rgba(91,45,142,.15);
  --ease:cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;padding:0;
  font-family:var(--font-body);
  color:var(--ink); background:var(--bg);
  line-height:1.55; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{background:var(--yellow);color:var(--ink)}
img{max-width:100%; display:block; height:auto}
a{color:inherit; text-decoration:none}

/* ====================== CONTAINER ====================== */
.container{max-width:1180px; margin:0 auto; padding:0 20px}
.container-sm{max-width:760px; margin:0 auto; padding:0 20px}
.container-md{max-width:960px; margin:0 auto; padding:0 20px}

/* ====================== TIPOGRAFIA ====================== */
.h1, h1{
  font-family:var(--font-display); font-weight:800;
  font-size:clamp(2rem, 5.5vw, 3.6rem); line-height:1.05;
  letter-spacing:-.02em; margin:0 0 16px; color:var(--ink);
}
.h1 em, h1 em{font-style:italic; color:var(--purple)}
.h2, h2{
  font-family:var(--font-display); font-weight:700;
  font-size:clamp(1.6rem, 4vw, 2.4rem); line-height:1.1;
  letter-spacing:-.01em; margin:48px 0 12px; color:var(--ink);
}
.h3, h3{
  font-family:var(--font-body); font-weight:700;
  font-size:1.18rem; margin:24px 0 8px; color:var(--ink);
}
.lead{
  font-size:1.08rem; line-height:1.6; color:var(--ink-2);
  max-width:680px;
}
.eyebrow{
  display:inline-block; font-size:.78rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.14em;
  color:var(--purple); margin-bottom:8px;
}
.serif-i{font-family:var(--font-serif); font-style:italic;}
.hl-y{background:var(--yellow); padding:0 4px; border-radius:2px}
.hl-p{background:var(--pink-bg); padding:0 4px; border-radius:2px}
.hl-l{background:var(--lime); padding:0 4px; border-radius:2px}

/* ====================== HEADER (site-wide) ====================== */
.site-nav{
  position:sticky; top:0; z-index:40;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid var(--line);
}
.site-nav .inner{
  max-width:1180px; margin:0 auto; padding:12px 20px;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.site-nav .brand{display:flex; align-items:center; gap:10px;}
.site-nav .brand img{width:42px; height:42px; object-fit:contain;}
.site-nav .brand .name{
  font-family:var(--font-display); font-weight:800; font-size:1.15rem;
  line-height:1; color:var(--ink);
}
.site-nav .brand .name em{color:var(--purple); font-style:italic;}
.site-nav .links{display:flex; gap:22px; align-items:center;}
.site-nav .links a{
  font-size:.92rem; font-weight:600; color:var(--ink-2);
  transition:color .2s; padding:6px 0; position:relative;
}
.site-nav .links a:hover{color:var(--purple);}
.site-nav .links a.cta{
  background:var(--purple); color:white; padding:9px 16px;
  border-radius:999px; font-weight:700;
}
.site-nav .links a.cta:hover{background:var(--purple-deep); color:white;}
.site-nav .burger{display:none; background:none; border:none; cursor:pointer; padding:6px;}
.site-nav .burger svg{width:24px; height:24px;}

/* Mobile nav */
@media(max-width:780px){
  .site-nav .links{
    position:fixed; top:60px; right:-100%; bottom:0; width:80%; max-width:300px;
    background:white; flex-direction:column; padding:24px;
    box-shadow:-12px 0 24px rgba(0,0,0,.1); transition:right .25s var(--ease);
    align-items:stretch; gap:6px;
  }
  .site-nav .links.open{right:0;}
  .site-nav .links a{padding:12px 4px; border-bottom:1px solid var(--line); font-size:1rem;}
  .site-nav .links a.cta{text-align:center; margin-top:8px; border:none;}
  .site-nav .burger{display:block;}
  .site-nav .brand .name{font-size:1rem;}
}

/* ====================== HERO PADRÃO ====================== */
.hero{padding:64px 0 56px; background:linear-gradient(180deg, var(--bg), var(--paper));}
.hero-sub{
  font-size:1.1rem; color:var(--ink-2); margin:0 0 26px;
  max-width:560px; line-height:1.6;
}
.hero-cta-row{display:flex; gap:12px; flex-wrap:wrap; margin-top:8px;}

/* ====================== BOTÕES ====================== */
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 22px; border-radius:999px; border:none;
  font-family:var(--font-body); font-weight:700; font-size:.95rem;
  cursor:pointer; text-decoration:none; transition:all .2s var(--ease);
  white-space:nowrap;
}
.btn-primary{background:var(--purple); color:white;}
.btn-primary:hover{background:var(--purple-deep); transform:translateY(-2px); box-shadow:var(--shadow-md);}
.btn-wa{background:var(--wa); color:white;}
.btn-wa:hover{background:#1ebe5d; transform:translateY(-2px); box-shadow:0 6px 18px rgba(37,211,102,.35);}
.btn-outline{background:white; color:var(--ink); border:2px solid var(--ink);}
.btn-outline:hover{background:var(--ink); color:white;}
.btn-yellow{background:var(--yellow); color:var(--ink);}
.btn-yellow:hover{background:#fbbf24; transform:translateY(-2px);}
.btn-lg{padding:16px 28px; font-size:1rem;}
.btn-sm{padding:9px 16px; font-size:.85rem;}

/* ====================== CARDS ====================== */
.card{
  background:var(--paper); border-radius:18px;
  border:1px solid var(--line);
  box-shadow:var(--shadow-sm); padding:24px;
  transition:transform .2s var(--ease), box-shadow .2s var(--ease);
}
.card:hover{transform:translateY(-3px); box-shadow:var(--shadow-md);}

.card-image{
  background:var(--paper); border-radius:16px;
  overflow:hidden; box-shadow:var(--shadow-md);
}
.card-image img{aspect-ratio:4/3; object-fit:cover; width:100%;}
.card-image .body{padding:18px;}

/* ====================== GRID HELPERS ====================== */
.grid{display:grid; gap:20px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
@media(max-width:900px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}}

/* ====================== STATS BAR ====================== */
.stats-bar{
  background:var(--purple); color:white;
  padding:36px 20px; border-radius:24px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:18px;
  text-align:center;
}
.stats-bar .stat .v{
  font-family:var(--font-display); font-weight:800;
  font-size:clamp(1.8rem, 4vw, 2.6rem); line-height:1; color:var(--yellow);
}
.stats-bar .stat .l{
  font-size:.82rem; font-weight:600; opacity:.95;
  margin-top:6px; text-transform:uppercase; letter-spacing:.08em;
}
@media(max-width:600px){.stats-bar{grid-template-columns:repeat(2,1fr); padding:24px 16px;}}

/* ====================== UNIT CARDS ====================== */
.unit-card{
  background:var(--paper); border-radius:20px; overflow:hidden;
  border:1px solid var(--line); box-shadow:var(--shadow-sm);
  transition:transform .25s var(--ease), box-shadow .25s var(--ease);
  display:flex; flex-direction:column;
}
.unit-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-lg);}
.unit-card .photo{aspect-ratio:5/3; background:var(--purple-bg); position:relative; overflow:hidden;}
.unit-card .photo img{width:100%; height:100%; object-fit:cover;}
.unit-card .tag{
  position:absolute; top:12px; left:12px;
  background:rgba(0,0,0,.7); color:white; padding:5px 12px;
  border-radius:999px; font-size:.75rem; font-weight:600; letter-spacing:.04em;
}
.unit-card .body{padding:18px;}
.unit-card .name{font-family:var(--font-display); font-size:1.3rem; font-weight:700; margin:0 0 4px;}
.unit-card .addr{font-size:.85rem; color:var(--ink-3); line-height:1.45; margin-bottom:8px;}
.unit-card .meta{font-size:.85rem; color:var(--ink-2); font-weight:600;}

/* ====================== PRICE TABLE COMPACTA ====================== */
.price-mini{
  width:100%; border-collapse:collapse; font-size:.88rem;
  background:white; border-radius:12px; overflow:hidden;
  box-shadow:var(--shadow-sm);
}
.price-mini th{
  background:var(--purple); color:white; padding:10px 8px;
  font-size:.78rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.04em;
}
.price-mini td{padding:8px 6px; text-align:center; border-bottom:1px solid var(--line);}
.price-mini tr:nth-child(even) td{background:#fafafa;}
.price-mini td:first-child{background:var(--ink); color:white; font-weight:700;}
.price-mini td.feat{background:var(--yellow-bg); font-weight:700;}

/* ====================== FAQ ====================== */
.faq-item{
  background:white; border:1px solid var(--line); border-radius:12px;
  padding:18px 22px; margin-bottom:10px; transition:box-shadow .2s;
}
.faq-item:hover{box-shadow:var(--shadow-sm);}
.faq-item summary{
  font-weight:700; cursor:pointer; list-style:none;
  display:flex; justify-content:space-between; align-items:center;
  font-size:1rem; color:var(--ink);
}
.faq-item summary::after{
  content:'+'; font-size:1.4rem; font-weight:300; color:var(--purple);
  transition:transform .2s;
}
.faq-item[open] summary::after{transform:rotate(45deg);}
.faq-item .answer{
  margin-top:12px; padding-top:12px; border-top:1px solid var(--line);
  color:var(--ink-2); font-size:.95rem; line-height:1.6;
}

/* ====================== BLOG CARDS ====================== */
.post-card{
  background:white; border-radius:16px; overflow:hidden;
  border:1px solid var(--line); transition:all .25s var(--ease);
  display:flex; flex-direction:column;
}
.post-card:hover{transform:translateY(-3px); box-shadow:var(--shadow-md);}
.post-card .cover{aspect-ratio:16/9; background:var(--purple-bg);}
.post-card .cover img{width:100%; height:100%; object-fit:cover;}
.post-card .body{padding:18px; flex:1; display:flex; flex-direction:column;}
.post-card .cat{font-size:.7rem; font-weight:700; text-transform:uppercase; color:var(--pink); letter-spacing:.08em; margin-bottom:6px;}
.post-card .title{font-family:var(--font-display); font-weight:700; font-size:1.15rem; line-height:1.25; margin:0 0 6px;}
.post-card .excerpt{font-size:.88rem; color:var(--ink-2); line-height:1.5; flex:1; margin-bottom:10px;}
.post-card .meta{font-size:.75rem; color:var(--ink-3); display:flex; gap:10px;}

/* ====================== BREADCRUMBS ====================== */
.breadcrumbs{
  padding:12px 0; font-size:.82rem; color:var(--ink-3);
  display:flex; flex-wrap:wrap; gap:6px; align-items:center;
}
.breadcrumbs a{color:var(--purple); font-weight:500;}
.breadcrumbs a:hover{text-decoration:underline;}
.breadcrumbs .sep{color:var(--line);}

/* ====================== SECTIONS ====================== */
section{padding:48px 0;}
section.tight{padding:32px 0;}
section.purple-bg{background:var(--purple-bg);}
section.yellow-bg{background:var(--yellow-bg);}
section.pink-bg{background:var(--pink-bg);}
section.ink-bg{background:var(--ink); color:white;}
section.ink-bg h2{color:white;}

/* ====================== FOOTER ====================== */
.site-footer{
  background:var(--ink); color:rgba(255,255,255,.75);
  padding:48px 20px 24px; margin-top:60px;
}
.site-footer .inner{max-width:1180px; margin:0 auto;}
.site-footer .cols{
  display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px;
  padding-bottom:28px; border-bottom:1px solid rgba(255,255,255,.1);
}
.site-footer h4{
  font-size:.78rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.1em; color:var(--yellow); margin:0 0 12px;
}
.site-footer .brand-blk{display:flex; align-items:center; gap:12px; margin-bottom:14px;}
.site-footer .brand-blk img{width:44px; height:44px;}
.site-footer .brand-blk .name{font-family:var(--font-display); font-weight:800; color:white; font-size:1.1rem;}
.site-footer p{font-size:.88rem; line-height:1.55;}
.site-footer a{color:rgba(255,255,255,.75); display:block; padding:3px 0; font-size:.88rem; transition:color .2s;}
.site-footer a:hover{color:var(--yellow);}
.site-footer .social{display:flex; gap:10px; margin-top:14px;}
.site-footer .social a{
  width:38px; height:38px; border-radius:50%;
  background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center;
  padding:0; color:white;
}
.site-footer .social a:hover{background:var(--yellow); color:var(--ink);}
.site-footer .bottom{
  padding-top:20px; text-align:center;
  font-size:.78rem; color:rgba(255,255,255,.45);
}
@media(max-width:780px){.site-footer .cols{grid-template-columns:1fr 1fr;}}
@media(max-width:480px){.site-footer .cols{grid-template-columns:1fr;}}

/* ====================== WHATSAPP FLOATING ====================== */
.wa-float{
  position:fixed; bottom:20px; right:20px; z-index:50;
  background:var(--wa); color:white;
  padding:14px 18px 14px 16px; border-radius:999px;
  font-family:var(--font-body); font-weight:700; font-size:.92rem;
  display:inline-flex; align-items:center; gap:8px;
  box-shadow:0 8px 24px rgba(37,211,102,.4);
  text-decoration:none; transition:all .25s var(--ease);
}
.wa-float:hover{transform:translateY(-3px); box-shadow:0 14px 32px rgba(37,211,102,.55);}
.wa-float svg{width:20px; height:20px; flex-shrink:0;}
.wa-float .label{display:inline;}
@media(max-width:480px){
  .wa-float{padding:14px; border-radius:50%;}
  .wa-float .label{display:none;}
}

/* ====================== FANNY CHAT BUTTON ====================== */
.fanny-btn{
  position:fixed; bottom:84px; right:20px; z-index:49;
  background:linear-gradient(135deg, var(--pink), var(--purple));
  color:white; width:56px; height:56px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 22px rgba(124,58,237,.35);
  cursor:pointer; border:none;
  transition:all .25s var(--ease);
  font-size:24px;
}
.fanny-btn:hover{transform:translateY(-3px) scale(1.06);}
.fanny-btn::after{
  content:''; position:absolute; top:-3px; right:-3px;
  width:14px; height:14px; background:var(--lime);
  border-radius:50%; border:2px solid white;
  animation:fannyPulse 1.8s ease-in-out infinite;
}
@keyframes fannyPulse{
  0%,100%{transform:scale(1); opacity:1;}
  50%{transform:scale(1.3); opacity:.6;}
}

/* ====================== UTIL ====================== */
.text-c{text-align:center;}
.mt-0{margin-top:0;} .mt-1{margin-top:8px;} .mt-2{margin-top:16px;} .mt-3{margin-top:24px;} .mt-4{margin-top:32px;}
.mb-0{margin-bottom:0;} .mb-1{margin-bottom:8px;} .mb-2{margin-bottom:16px;} .mb-3{margin-bottom:24px;} .mb-4{margin-bottom:32px;}
.hidden{display:none;}

/* ====================== Reduced motion ====================== */
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important; transition-duration:.001ms !important;}
}

/* === Lead-gate modal === */
.lead-modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.65); backdrop-filter:blur(4px); display:none; align-items:center; justify-content:center; z-index:9000; padding:16px; }
.lead-modal-overlay.open { display:flex; }
.lead-modal { background:white; border-radius:20px; max-width:440px; width:100%; padding:32px 28px; box-shadow:0 24px 64px rgba(0,0,0,.3); position:relative; max-height:90vh; overflow-y:auto; }
.lead-modal-close { position:absolute; top:12px; right:14px; background:none; border:0; font-size:1.6rem; cursor:pointer; color:var(--ink-2); line-height:1; padding:6px 10px; }
.lead-modal h3 { font-family:'Playfair Display',serif; font-size:1.55rem; margin:0 0 8px; }
.lead-modal p.sub { color:var(--ink-2); font-size:.95rem; margin:0 0 20px; line-height:1.5; }
.lead-modal label { display:block; font-size:.85rem; font-weight:600; margin:14px 0 6px; color:var(--ink); }
.lead-modal input { width:100%; padding:12px 14px; border:1.5px solid #e5e7eb; border-radius:10px; font:inherit; font-size:1rem; transition:border .15s; box-sizing:border-box; }
.lead-modal input:focus { outline:0; border-color:var(--purple); }
.lead-modal .btn-submit { width:100%; margin-top:18px; padding:14px; font-size:1rem; font-weight:700; }
.lead-modal .feedback { margin-top:12px; padding:10px 14px; border-radius:10px; font-size:.9rem; display:none; }
.lead-modal .feedback.error { display:block; background:#fee; color:#c00; border:1px solid #fcc; }
.lead-modal .feedback.success { display:block; background:#efe; color:#063; border:1px solid #cec; }
.lead-modal .privacy { font-size:.78rem; color:var(--ink-2); margin-top:14px; text-align:center; line-height:1.4; }
@media (max-width: 480px) {
  .lead-modal { padding:24px 20px; border-radius:16px; }
  .lead-modal h3 { font-size:1.35rem; }
}