/* ============================================================
   LE CROQUE — design system
   Paleta, tipografia e componentes da marca.
   Edite as variáveis abaixo para ajustar cores em todo o site.
   ============================================================ */
:root{
  --vinho:#6E1B2E;
  --vinho-prof:#4A1320;
  --dourado:#C28A3D;
  --dourado-claro:#D9A95C;
  --creme:#FAECDD;
  --creme-claro:#FCF5EC;
  --chocolate:#4A2417;
  --caramelo:#B9682E;
  --framboesa:#C42850;
  --texto:#3a2b25;
  --texto-suave:#6b5a52;

  --serif-display:'Cormorant Garamond', Georgia, serif;
  --serif-body:'EB Garamond', Georgia, serif;
  --script:'Pinyon Script', cursive;

  --wrap:1140px;
  --r:14px;
  --ease:cubic-bezier(.4,0,.2,1);
  --header-h:83px; /* altura do header no topo (logo 54 + paddings) */
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--serif-body);
  font-size:19px; line-height:1.75; color:var(--texto);
  background:var(--creme); -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
.container{width:100%; max-width:var(--wrap); margin:0 auto; padding:0 clamp(20px,5vw,48px)}

/* ---------- tipografia ---------- */
h1,h2,h3{font-family:var(--serif-display); font-weight:500; line-height:1.12; color:var(--vinho); letter-spacing:.2px}
h2{font-size:clamp(2rem,4.6vw,3.3rem)}
h3{font-size:1.7rem; color:var(--chocolate)}
.h2-light{color:var(--creme)}
.eyebrow{font-family:var(--script); font-size:1.9rem; color:var(--dourado); line-height:1; margin-bottom:.4rem}
.eyebrow-light{color:var(--dourado-claro)}
p{margin-bottom:1.1rem}
.assinatura{font-style:italic; color:var(--texto-suave); margin-top:1.6rem}

.section{padding:clamp(72px,11vw,140px) 0}
.section-head{text-align:center; max-width:680px; margin:0 auto clamp(40px,6vw,72px)}
.section-lead{color:var(--texto-suave)}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,6vw,80px); align-items:center}

/* ---------- botões ---------- */
.btn{display:inline-flex; align-items:center; gap:.55em; font-family:var(--serif-body);
  font-size:1.02rem; letter-spacing:.3px; padding:.82em 1.6em; border-radius:999px;
  border:1.5px solid transparent; cursor:pointer; transition:all .25s var(--ease)}
.btn-lg{font-size:1.08rem; padding:.95em 1.9em}
.btn-wa{background:var(--vinho); color:var(--creme); border-color:var(--vinho)}
.btn-wa:hover{background:var(--vinho-prof); transform:translateY(-2px); box-shadow:0 10px 24px -10px rgba(74,19,32,.6)}
.btn-ghost{background:transparent; color:var(--creme); border-color:rgba(250,236,221,.6)}
.btn-ghost:hover{background:rgba(250,236,221,.12); border-color:var(--creme)}
.btn-ghost-dark{background:transparent; color:var(--vinho); border-color:var(--vinho)}
.btn-ghost-dark:hover{background:var(--vinho); color:var(--creme)}
.btn-outline{background:var(--vinho); color:var(--creme); border-color:var(--vinho)}
.btn-outline:hover{background:var(--vinho-prof)}

/* ícones simples em CSS (sem dependências externas) */
.ico-wa{width:1.15em; height:1.15em; background:currentColor;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12.04 2C6.58 2 2.13 6.45 2.13 11.91c0 1.75.46 3.45 1.32 4.95L2 22l5.25-1.38c1.45.79 3.08 1.21 4.79 1.21 5.46 0 9.91-4.45 9.91-9.91C21.95 6.45 17.5 2 12.04 2zm0 18.15c-1.52 0-3.01-.41-4.3-1.18l-.31-.18-3.12.82.83-3.04-.2-.31a8.2 8.2 0 0 1-1.26-4.35c0-4.54 3.7-8.23 8.25-8.23 4.54 0 8.23 3.69 8.23 8.23 0 4.54-3.69 8.42-8.22 8.42zm4.52-6.16c-.25-.12-1.47-.72-1.69-.81-.23-.08-.39-.12-.56.13-.16.25-.64.81-.79.97-.14.17-.29.19-.54.06-.25-.12-1.05-.39-1.99-1.23-.74-.66-1.23-1.47-1.38-1.72-.14-.25-.01-.38.11-.51.11-.11.25-.29.37-.43.13-.14.17-.25.25-.41.08-.17.04-.31-.02-.43-.06-.12-.56-1.34-.76-1.84-.2-.48-.41-.42-.56-.42l-.48-.01c-.17 0-.43.06-.66.31-.23.25-.86.85-.86 2.07 0 1.22.89 2.4 1.01 2.56.12.17 1.75 2.67 4.23 3.74.59.26 1.05.41 1.41.52.59.19 1.13.16 1.56.1.48-.07 1.47-.6 1.68-1.18.21-.58.21-1.07.14-1.18-.06-.1-.22-.16-.47-.28z'/></svg>") center/contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12.04 2C6.58 2 2.13 6.45 2.13 11.91c0 1.75.46 3.45 1.32 4.95L2 22l5.25-1.38c1.45.79 3.08 1.21 4.79 1.21 5.46 0 9.91-4.45 9.91-9.91C21.95 6.45 17.5 2 12.04 2zm0 18.15c-1.52 0-3.01-.41-4.3-1.18l-.31-.18-3.12.82.83-3.04-.2-.31a8.2 8.2 0 0 1-1.26-4.35c0-4.54 3.7-8.23 8.25-8.23 4.54 0 8.23 3.69 8.23 8.23 0 4.54-3.69 8.42-8.22 8.42zm4.52-6.16c-.25-.12-1.47-.72-1.69-.81-.23-.08-.39-.12-.56.13-.16.25-.64.81-.79.97-.14.17-.29.19-.54.06-.25-.12-1.05-.39-1.99-1.23-.74-.66-1.23-1.47-1.38-1.72-.14-.25-.01-.38.11-.51.11-.11.25-.29.37-.43.13-.14.17-.25.25-.41.08-.17.04-.31-.02-.43-.06-.12-.56-1.34-.76-1.84-.2-.48-.41-.42-.56-.42l-.48-.01c-.17 0-.43.06-.66.31-.23.25-.86.85-.86 2.07 0 1.22.89 2.4 1.01 2.56.12.17 1.75 2.67 4.23 3.74.59.26 1.05.41 1.41.52.59.19 1.13.16 1.56.1.48-.07 1.47-.6 1.68-1.18.21-.58.21-1.07.14-1.18-.06-.1-.22-.16-.47-.28z'/></svg>") center/contain no-repeat;
  display:inline-block}
.ico-arrow{width:1em; height:1em; background:currentColor; transition:transform .25s var(--ease);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat;
  display:inline-block}

/* ---------- header ---------- */
.site-header{position:sticky; top:0; z-index:50; background:rgba(250,236,221,.92);
  backdrop-filter:blur(10px); border-bottom:1px solid rgba(110,27,46,.1); transition:padding .3s var(--ease)}
.header-inner{display:flex; align-items:center; gap:16px; padding:14px 0}
.brand{display:flex; margin-right:auto}
.brand-logo{height:54px; width:auto; transition:height .3s var(--ease)}
.site-header.shrink .brand-logo{height:42px}
.nav{display:flex; align-items:center; gap:clamp(18px,2.4vw,30px)}
.nav a{font-size:1.05rem; color:var(--chocolate); transition:color .2s; position:relative}
.nav a:hover{color:var(--vinho)}
.nav a::after{content:""; position:absolute; left:0; bottom:-4px; width:0; height:1.5px; background:var(--dourado); transition:width .25s var(--ease)}
.nav a:hover::after{width:100%}
/* ícones de acesso rápido sempre visíveis */
.header-quick{display:flex; align-items:center; gap:10px}
.hq{width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  color:var(--vinho); border:1px solid rgba(110,27,46,.22); transition:all .2s var(--ease)}
.hq .ico-wa,.hq .ico-ig{width:20px; height:20px}
.hq:hover{background:var(--vinho); color:var(--creme); border-color:var(--vinho); transform:translateY(-1px)}
.hq-wa{display:none} /* no desktop o botão "Encomendar" já cobre o WhatsApp */
.nav-cta{padding:.55em 1.2em; font-size:.98rem}
.ico-ig{width:1.15em; height:1.15em; background:currentColor; display:inline-block;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='3' y='3' width='18' height='18' rx='5' fill='none' stroke='black' stroke-width='2'/><circle cx='12' cy='12' r='4' fill='none' stroke='black' stroke-width='2'/><circle cx='17.5' cy='6.5' r='1.3' fill='black'/></svg>") center/contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='3' y='3' width='18' height='18' rx='5' fill='none' stroke='black' stroke-width='2'/><circle cx='12' cy='12' r='4' fill='none' stroke='black' stroke-width='2'/><circle cx='17.5' cy='6.5' r='1.3' fill='black'/></svg>") center/contain no-repeat}
.nav-toggle{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px}
.nav-toggle span{width:26px; height:2px; background:var(--vinho); transition:.3s var(--ease)}
/* fundo escuro atrás do menu mobile */
.nav-backdrop{display:none; position:fixed; inset:0; z-index:65; background:rgba(74,19,32,.5);
  opacity:0; visibility:hidden; transition:opacity .3s var(--ease), visibility .3s}
.nav-backdrop.open{opacity:1; visibility:visible}

/* ---------- revelação do símbolo (modal da logo) ---------- */
.brand{cursor:pointer}
body.modal-open{overflow:hidden}
.symbol-modal{position:fixed; inset:0; z-index:90; display:flex; align-items:center; justify-content:center; padding:24px;
  background:rgba(74,19,32,.55); opacity:0; visibility:hidden; transition:opacity .3s var(--ease), visibility .3s; backdrop-filter:blur(3px)}
.symbol-modal.open{opacity:1; visibility:visible}
.symbol-card{position:relative; max-width:430px; width:100%; background:var(--creme); border-radius:var(--r);
  padding:46px 40px 38px; text-align:center; box-shadow:0 34px 70px -34px rgba(0,0,0,.55);
  transform:translateY(14px); transition:transform .35s var(--ease)}
.symbol-modal.open .symbol-card{transform:none}
.symbol-close{position:absolute; top:12px; right:16px; background:none; border:none; cursor:pointer;
  font-size:26px; line-height:1; color:var(--vinho); opacity:.45; transition:opacity .2s}
.symbol-close:hover{opacity:1}
.symbol-medal{width:74px; height:auto; margin:0 auto 20px; display:block}
.symbol-eyebrow{font-family:var(--serif-body); font-size:.78rem; letter-spacing:3px; text-transform:uppercase; color:var(--dourado); margin-bottom:14px}
.symbol-text{font-family:var(--serif-display); font-size:1.3rem; line-height:1.6; color:var(--chocolate); margin-bottom:22px}
.symbol-rule{width:38px; height:1px; background:var(--dourado); margin:0 auto 18px}
.symbol-gen{font-family:var(--serif-display); font-style:italic; font-size:1.05rem; color:var(--texto-suave); margin:0}

/* ---------- hero ---------- */
.hero{position:relative; min-height:calc(100vh - var(--header-h)); min-height:calc(100svh - var(--header-h));
  display:flex; align-items:center; justify-content:center; text-align:center; overflow:hidden}
.hero-bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0}
.hero-overlay{position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(74,19,32,.5) 0%, rgba(74,19,32,.58) 45%, rgba(74,19,32,.84) 100%)}
.hero-content{position:relative; z-index:2; color:var(--creme); padding-top:60px; padding-bottom:60px}
.hero-logo{height:clamp(96px,15vw,150px); width:auto; margin:0 auto 1.6rem; filter:drop-shadow(0 4px 18px rgba(0,0,0,.3))}
.hero-tagline{font-family:var(--serif-display); font-size:clamp(1.9rem,4.4vw,3rem); line-height:1.2; color:var(--creme); margin-bottom:1.2rem; text-shadow:0 2px 16px rgba(40,8,16,.45)}
.hero-sub{max-width:560px; margin:0 auto 2.2rem; color:rgba(250,236,221,.92); font-size:1.12rem; text-shadow:0 1px 10px rgba(40,8,16,.4)}
.hero-actions{display:flex; gap:14px; justify-content:center; flex-wrap:wrap}
.hero-scroll{position:absolute; bottom:26px; left:50%; transform:translateX(-50%); z-index:2}
.hero-scroll span{display:block; width:22px; height:34px; border:2px solid rgba(250,236,221,.7); border-radius:14px; position:relative}
.hero-scroll span::after{content:""; position:absolute; left:50%; top:7px; width:3px; height:7px; background:var(--creme); border-radius:2px; transform:translateX(-50%); animation:scrolldot 1.6s var(--ease) infinite}
@keyframes scrolldot{0%{opacity:0;transform:translate(-50%,0)}40%{opacity:1}80%{opacity:0;transform:translate(-50%,10px)}}

/* ---------- abertura: cascata de crocante ---------- */
.crocante-canvas{position:absolute; inset:0; z-index:4; pointer-events:none; display:none}
.crocante-sound{position:absolute; left:20px; bottom:24px; z-index:5;
  display:inline-flex; align-items:center; gap:.45em; font-family:var(--serif-body); font-size:.92rem;
  color:var(--creme); background:rgba(74,19,32,.42); border:1px solid rgba(250,236,221,.35);
  border-radius:999px; padding:.45em 1em; cursor:pointer; backdrop-filter:blur(4px); transition:all .25s var(--ease)}
.crocante-sound:hover{background:rgba(74,19,32,.7); border-color:var(--creme)}
.crocante-sound.on{border-color:var(--dourado-claro); color:var(--dourado-claro)}
.ico-sound{width:1.05em; height:1.05em; background:currentColor; display:inline-block;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M11 5 6 9H2v6h4l5 4V5z' fill='black'/><path d='M15.5 8.5a5 5 0 0 1 0 7M18 6a8 8 0 0 1 0 12' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/></svg>") center/contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M11 5 6 9H2v6h4l5 4V5z' fill='black'/><path d='M15.5 8.5a5 5 0 0 1 0 7M18 6a8 8 0 0 1 0 12' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/></svg>") center/contain no-repeat}
@media (prefers-reduced-motion:reduce){ .crocante-sound{display:none} }

/* ---------- sobre ---------- */
.sobre{background:var(--creme-claro)}
.sobre-img img{border-radius:var(--r); aspect-ratio:4/5; object-fit:cover; box-shadow:0 24px 50px -24px rgba(74,19,32,.4)}

/* ---------- linha / cards ---------- */
.linha{background:var(--creme)}
.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:clamp(20px,3vw,32px)}
.card{background:#fff; border-radius:var(--r); overflow:hidden; box-shadow:0 12px 34px -22px rgba(74,19,32,.45);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease)}
.card:hover{transform:translateY(-6px); box-shadow:0 24px 48px -22px rgba(74,19,32,.5)}
.card-img{aspect-ratio:4/3; overflow:hidden}
.card-img img{width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease)}
.card:hover .card-img img{transform:scale(1.06)}
.card-body{padding:24px 24px 28px}
.card-body h3{margin-bottom:.5rem}
.card-body p{font-size:1.02rem; color:var(--texto-suave); margin-bottom:.8rem; line-height:1.6}
.price{color:var(--vinho)!important; font-weight:500; font-size:.98rem!important}
.card-cta{display:inline-flex; align-items:center; gap:.4em; color:var(--vinho); font-size:1.05rem; border-bottom:1.5px solid var(--dourado); padding-bottom:2px}
.card-cta:hover .ico-arrow{transform:translateX(4px)}
.linha-nota{text-align:center; color:var(--texto-suave); font-size:.98rem; margin-top:clamp(32px,5vw,52px); margin-bottom:0}

/* ---------- cardápios (download) ---------- */
.cardapios{margin-top:clamp(44px,6vw,72px); text-align:center}
.cardapios-titulo{font-size:1.9rem; margin-bottom:.3rem}
.cardapios-sub{color:var(--texto-suave); margin-bottom:1.6rem}
.cardapios-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px; max-width:820px; margin:0 auto}
.cardapio-card{display:flex; align-items:center; gap:16px; text-align:left;
  background:#fff; border:0.5px solid rgba(110,27,46,.16); border-radius:var(--r); padding:18px 20px;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s}
.cardapio-card:hover{transform:translateY(-3px); box-shadow:0 14px 32px -20px rgba(74,19,32,.5); border-color:var(--dourado)}
.cardapio-destaque{border-color:rgba(196,40,80,.4)}
.cardapio-destaque:hover{border-color:var(--framboesa)}
.cardapio-info{flex:1; min-width:0; display:flex; flex-direction:column}
.cardapio-info strong{font-family:var(--serif-display); font-size:1.3rem; font-weight:500; color:var(--vinho)}
.cardapio-info small{color:var(--texto-suave); font-size:.92rem; line-height:1.4}
.cardapio-baixar{flex:none; display:inline-flex; align-items:center; gap:.4em; color:var(--vinho);
  font-size:.95rem; border:1px solid var(--dourado); border-radius:999px; padding:.4em .9em}
.cardapio-card:hover .cardapio-baixar{background:var(--vinho); color:var(--creme); border-color:var(--vinho)}
.ico-file{flex:none; width:34px; height:34px; background:var(--vinho); display:inline-block;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'/><path d='M14 2v6h6' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'/></svg>") center/contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'/><path d='M14 2v6h6' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'/></svg>") center/contain no-repeat}
.ico-download{width:1em; height:1em; background:currentColor; display:inline-block;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3v12m0 0 4-4m-4 4-4-4M5 21h14' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3v12m0 0 4-4m-4 4-4-4M5 21h14' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat}

/* ---------- eventos ---------- */
.eventos{background:var(--creme-claro)}
.evt-publicos{display:grid; grid-template-columns:1fr 1fr; gap:clamp(18px,2.6vw,28px); margin-bottom:clamp(32px,4.5vw,52px)}
.evt-publico{background:#fff; border-radius:var(--r); padding:clamp(26px,3vw,38px); box-shadow:0 14px 36px -24px rgba(74,19,32,.45)}
.evt-publico:first-child{border-top:3px solid var(--dourado)}
.evt-publico:last-child{border-top:3px solid var(--vinho)}
.evt-kicker{font-family:var(--script); font-size:1.7rem; color:var(--dourado); line-height:1; margin-bottom:.2rem}
.evt-publico h3{font-size:1.7rem; margin-bottom:.7rem}
.evt-publico p{font-size:1.02rem; color:var(--texto-suave); line-height:1.6; margin-bottom:1rem}
.evt-tipos{display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin:0 auto; max-width:820px}
.evt-tipos span{font-family:var(--serif-display); font-size:1.05rem; color:var(--vinho);
  border:1px solid rgba(110,27,46,.28); border-radius:999px; padding:.4em 1.1em}
.evt-portfolio-head{margin-top:clamp(52px,7vw,84px)}
.evt-portfolio-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px}
.evt-foto{position:relative; border-radius:var(--r); overflow:hidden; aspect-ratio:9/16; background:var(--vinho-prof)}
.evt-foto img,.evt-foto .evt-media{width:100%; height:100%; object-fit:cover; display:block}
.evt-foto figcaption{position:absolute; left:0; right:0; bottom:0; padding:42px 16px 16px; color:var(--creme);
  font-family:var(--serif-display); font-size:1.12rem; line-height:1.3;
  background:linear-gradient(180deg,transparent,rgba(74,19,32,.92))}
.evt-foto figcaption span{display:block; font-family:var(--script); font-size:1.3rem; color:var(--dourado-claro); line-height:1.1}
.evt-cta{text-align:center; margin-top:clamp(32px,5vw,52px)}
@media (max-width:680px){ .evt-publicos{grid-template-columns:1fr} }

/* ---------- bloco sazonal (trocável por data) ---------- */
.sazonal{background:var(--creme-claro)}
.sazonal .eyebrow{color:var(--framboesa)}
.sazonal-img img{border-radius:var(--r); aspect-ratio:1/1; object-fit:cover;
  box-shadow:0 24px 50px -24px rgba(74,19,32,.4)}
.sazonal-precos{color:var(--texto-suave); font-size:.98rem; margin-top:.4rem}
.sazonal-cta{display:flex; flex-wrap:wrap; gap:14px; margin-top:1.6rem}

/* ---------- processo (escuro) ---------- */
.processo{background:var(--vinho); color:var(--creme); position:relative}
.processo .eyebrow{color:var(--dourado-claro)}
.processo-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:clamp(18px,2.5vw,28px)}
.processo figure{position:relative; border-radius:var(--r); overflow:hidden}
.processo figure img{aspect-ratio:4/3; object-fit:cover; width:100%; transition:transform .6s var(--ease)}
.processo figure:hover img{transform:scale(1.05)}
.processo figcaption{position:absolute; left:0; right:0; bottom:0; padding:48px 22px 22px; color:var(--creme);
  font-family:var(--serif-display); font-size:1.35rem;
  background:linear-gradient(180deg,transparent,rgba(74,19,32,.92))}
.processo figcaption span{display:block; font-family:var(--script); font-size:1.6rem; color:var(--dourado-claro); line-height:1}

/* ---------- social / instagram ---------- */
.social{background:var(--creme-claro)}
.ig-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; border-radius:var(--r); overflow:hidden}
.ig-grid a{display:block; overflow:hidden}
.ig-grid img{aspect-ratio:1; object-fit:cover; width:100%; transition:opacity .3s, transform .5s var(--ease)}
.ig-grid a:hover img{transform:scale(1.04)}
.ig-cta-wrap{text-align:center; margin-top:28px; display:flex; flex-direction:column; align-items:center; gap:14px}
.ig-cta-wrap .btn{margin:0 6px}
.ig-note{font-size:.92rem; color:var(--texto-suave); margin:6px 0 0; max-width:440px}
#igEmbed iframe{width:100%; border:none; border-radius:var(--r)}

/* ---------- visite ---------- */
.visite{background:var(--creme)}
.contato-list{list-style:none; margin:1.4rem 0 2rem}
.contato-list li{padding:14px 0; border-bottom:1px solid rgba(110,27,46,.14); font-size:1.08rem}
.contato-list li span{display:inline-block; min-width:130px; color:var(--dourado); font-family:var(--serif-display); font-size:1.1rem}
.contato-list a{color:var(--vinho); border-bottom:1px solid var(--dourado)}
.contato-list em{color:var(--texto-suave); font-size:.92rem}
.visite-img img{border-radius:var(--r); aspect-ratio:4/5; object-fit:cover; box-shadow:0 24px 50px -24px rgba(74,19,32,.4)}

/* ---------- footer ---------- */
.site-footer{background:var(--vinho-prof); color:var(--creme); text-align:center; padding:clamp(56px,8vw,88px) 0 40px}
.footer-logo{height:78px; width:auto; margin:0 auto 18px}
.footer-tag{font-family:var(--serif-display); font-size:1.4rem; color:var(--creme); margin-bottom:1.6rem}
.footer-links{display:flex; gap:28px; justify-content:center; margin-bottom:1.8rem; flex-wrap:wrap}
.footer-links a{color:var(--dourado-claro); border-bottom:1px solid transparent; transition:border-color .2s}
.footer-links a:hover{border-color:var(--dourado-claro)}
.footer-legal{font-size:.9rem; color:rgba(250,236,221,.6); margin:0}

/* ---------- botão flutuante WhatsApp ---------- */
.fab-wa{position:fixed; right:20px; bottom:20px; z-index:60; width:58px; height:58px; border-radius:50%;
  background:#25D366; color:#fff; display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 26px -6px rgba(37,211,102,.7); transition:transform .25s var(--ease)}
.fab-wa .ico-wa{width:30px; height:30px}
.fab-wa:hover{transform:scale(1.08)}

/* ---------- animação de revelação ----------
   Só esconde quando o JS está ativo (.js no <html>); sem JS o conteúdo
   aparece normalmente — garante que nada fique invisível se o script falhar. */
.js .reveal{opacity:0; transform:translateY(28px); transition:opacity .7s var(--ease), transform .7s var(--ease)}
.js .reveal.in{opacity:1; transform:none}
/* revelação escalonada — cards e figuras entram em cascata sutil */
.js .cards .card:nth-child(2), .js .processo-grid figure:nth-child(2){transition-delay:.1s}
.js .cards .card:nth-child(3), .js .processo-grid figure:nth-child(3){transition-delay:.2s}
.js .cards .card:nth-child(4){transition-delay:.3s}
@media (prefers-reduced-motion:reduce){
  .js .reveal{opacity:1; transform:none; transition:none}
}

/* ---------- responsivo ---------- */
@media (max-width:820px){
  body{font-size:18px}
  .grid-2{grid-template-columns:1fr; gap:36px}
  .sobre-img, .visite-img{order:-1}
  .nav{position:fixed; inset:0 0 0 auto; width:min(82vw,330px); z-index:70; flex-direction:column; justify-content:center;
    gap:26px; padding:0 30px; background:var(--creme); transform:translateX(100%); transition:transform .35s var(--ease);
    box-shadow:-12px 0 40px -20px rgba(74,19,32,.5)}
  .nav.open{transform:translateX(0)}
  .nav a{font-size:1.3rem}
  .nav-toggle{display:flex; z-index:80}
  .nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle.open span:nth-child(2){opacity:0}
  .nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .nav-backdrop{display:block}
  .hq-wa{display:flex}       /* WhatsApp sempre visível no topo do mobile */
  .hq-cta{display:none}      /* "Encomendar" labelado fica para o desktop */
  body.menu-open{overflow:hidden}
  body.menu-open .fab-wa{opacity:0; pointer-events:none}
  .ig-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:480px){
  .hero-actions{flex-direction:column}
  .hero-actions .btn{width:100%; justify-content:center}
}
