/* ============================================================
   JAKUNA COZINHA — Chef Anderson Santos
   Paleta extraída da logo: verde-floresta, verde-erva,
   dourado/bronze, oliva, creme.
   ============================================================ */
:root{
  --forest:#1e3a17;
  --forest-deep:#132a0f;
  --herb:#2f5917;
  --gold:#9a7530;
  --gold-soft:#c2a15a;
  --olive:#8b8a4f;
  --cream:#f7f4ec;
  --cream-2:#efe7d5;
  --paper:#fbfaf5;
  --ink:#25231c;
  --muted:#6d6857;
  --line:rgba(37,35,28,.12);
  --wa:#25a366;
  --wa-dark:#1c7d4d;
  --shadow-sm:0 2px 10px rgba(19,42,15,.08);
  --shadow-md:0 18px 45px -20px rgba(19,42,15,.45);
  --shadow-lg:0 30px 70px -30px rgba(19,42,15,.55);
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"Poppins",system-ui,-apple-system,sans-serif;
  --maxw:1180px;
  --radius:16px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--sans);
  font-weight:300;
  color:var(--ink);
  background:var(--paper);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{margin:0;line-height:1.08;font-weight:500}
p{margin:0}
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,5vw,40px)}

.skip{position:absolute;left:-999px;top:0;background:var(--forest);color:#fff;padding:10px 16px;z-index:200}
.skip:focus{left:12px;top:12px;border-radius:8px}

/* ---------- Tipografia ---------- */
.display{font-family:var(--serif);font-weight:600;letter-spacing:-.01em}
.eyebrow{
  font-size:.74rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;
  color:var(--muted);margin:0 0 18px;
}
.eyebrow-gold{color:var(--gold)}
.eyebrow-light{color:var(--gold-soft)}
.lede{font-size:1.16rem;color:#403d33;max-width:46ch;margin-top:22px;text-wrap:pretty}

/* ---------- Botões ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.6em;
  font-family:var(--sans);font-weight:500;font-size:.95rem;letter-spacing:.01em;
  padding:.85em 1.5em;border-radius:999px;cursor:pointer;border:1px solid transparent;
  transition:transform .25s ease,box-shadow .25s ease,background .25s ease,color .25s ease;
  white-space:nowrap;
}
.btn-lg{padding:1em 1.8em;font-size:1rem}
.btn-xl{padding:1.15em 2.3em;font-size:1.08rem}
.btn-wa{background:var(--wa);color:#fff;box-shadow:0 12px 26px -12px rgba(28,125,77,.8)}
.btn-wa:hover{background:var(--wa-dark);transform:translateY(-2px);box-shadow:0 16px 32px -12px rgba(28,125,77,.9)}
.btn-ghost{background:transparent;color:var(--forest);border-color:rgba(30,58,23,.35)}
.btn-ghost:hover{background:var(--forest);color:var(--cream);transform:translateY(-2px)}
.wa-ico{width:1.2em;height:1.2em;flex:none;background:currentColor;
  -webkit-mask:url("assets/whatsapp.svg") center/contain no-repeat;
  mask:url("assets/whatsapp.svg") center/contain no-repeat}
.link-gold{display:inline-block;margin-top:10px;color:var(--gold);font-weight:500;border-bottom:1px solid rgba(154,117,48,.4);padding-bottom:2px;transition:color .2s}
.link-gold:hover{color:var(--herb)}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:100;
  background:rgba(251,250,245,.82);backdrop-filter:blur(12px);
  border-bottom:1px solid transparent;transition:box-shadow .3s,border-color .3s,background .3s}
.site-header.scrolled{box-shadow:var(--shadow-sm);border-color:var(--line);background:rgba(251,250,245,.95)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;height:78px}
.brand-mark{height:52px;width:auto}
.nav{display:flex;align-items:center;gap:30px}
.nav>a{font-size:.94rem;font-weight:400;color:#3b382e;position:relative;transition:color .2s}
.nav>a:not(.btn):hover{color:var(--herb)}
.nav>a:not(.btn)::after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:1.5px;background:var(--gold);transition:right .28s ease}
.nav>a:not(.btn):hover::after{right:0}
.nav-cta{margin-left:6px}
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;padding:8px;cursor:pointer}
.nav-toggle span{width:26px;height:2px;background:var(--forest);border-radius:2px;transition:.3s}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;
  background:
    radial-gradient(120% 90% at 92% -10%, rgba(139,138,79,.16), transparent 55%),
    linear-gradient(180deg,#fbfaf5 0%, #f4efe2 100%)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,68px);align-items:center;
  padding:clamp(48px,7vw,96px) clamp(20px,5vw,40px) clamp(56px,8vw,104px)}
.hero h1{font-size:clamp(2.5rem,5.4vw,4.15rem);color:var(--forest);text-wrap:balance}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.hero-values{list-style:none;display:flex;flex-wrap:wrap;gap:10px 26px;margin:34px 0 0;padding:26px 0 0;
  border-top:1px solid var(--line)}
.hero-values li{position:relative;font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding-left:20px}
.hero-values li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:50%;background:var(--gold-soft)}
.hero-media{position:relative}
.hero-media img{width:100%;border-radius:calc(var(--radius) + 6px);box-shadow:var(--shadow-lg);
  aspect-ratio:4/5;object-fit:cover}
.hero-media::after{content:"";position:absolute;inset:auto -14px -14px auto;width:62%;height:62%;
  border:1px solid var(--gold-soft);border-radius:calc(var(--radius) + 6px);z-index:-1}

/* ---------- Seções genéricas ---------- */
section{position:relative}
.section-head{max-width:640px;margin:0 auto clamp(38px,5vw,58px);text-align:center}
.section-head .display{font-size:clamp(2rem,4vw,3rem);color:var(--forest);text-wrap:balance}
.section-sub{margin-top:18px;color:var(--muted);font-size:1.05rem;text-wrap:pretty}

/* ---------- O Chef ---------- */
.chef{padding:clamp(64px,9vw,120px) 0;background:var(--paper)}
.chef-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(34px,6vw,80px);align-items:center}
.chef-media{position:relative}
.chef-media img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius);box-shadow:var(--shadow-md)}
.chef-badge{position:absolute;left:22px;bottom:22px;background:rgba(251,250,245,.94);
  color:var(--forest);font-family:var(--serif);font-weight:600;font-size:1.05rem;
  padding:.5em 1.1em;border-radius:999px;box-shadow:var(--shadow-sm)}
.chef-copy h2{font-size:clamp(2rem,3.6vw,2.9rem);color:var(--forest);margin-bottom:24px}
.chef-copy p{color:#403d33;margin-bottom:18px;max-width:52ch;text-wrap:pretty}

/* ---------- Experiência ---------- */
.exp{padding:clamp(66px,9vw,120px) 0;
  background:linear-gradient(180deg,#f4efe2 0%, #efe7d5 100%)}
.exp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.exp-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);
  padding:34px 28px 30px;box-shadow:var(--shadow-sm);transition:transform .3s,box-shadow .3s}
.exp-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.exp-num{font-family:var(--serif);font-size:1.5rem;font-weight:600;color:var(--gold);display:block;margin-bottom:14px}
.exp-card h3{font-family:var(--serif);font-weight:600;font-size:1.5rem;color:var(--forest);margin-bottom:10px}
.exp-card p{color:var(--muted);font-size:.98rem;text-wrap:pretty}

/* ---------- Pratos ---------- */
.pratos{padding:clamp(66px,9vw,120px) 0;background:var(--paper)}
.gallery{display:grid;grid-template-columns:repeat(2,1fr);grid-auto-rows:1fr;gap:22px}
.g-item{position:relative;margin:0;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-md);min-height:280px}
.g-item img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.g-item:hover img{transform:scale(1.05)}
.g-tall{grid-row:span 2}
.g-item figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 22px 20px;
  font-family:var(--serif);font-size:1.2rem;font-weight:600;color:#fff;
  background:linear-gradient(0deg,rgba(19,42,15,.82),transparent)}

/* ---------- Como funciona ---------- */
.steps{padding:clamp(66px,9vw,120px) 0;
  background:linear-gradient(180deg,#efe7d5 0%, #f4efe2 100%)}
.steps-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:26px;counter-reset:s}
.step{position:relative;padding:12px 6px}
.step-num{display:flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:50%;
  background:var(--forest);color:var(--cream);font-family:var(--serif);font-size:1.6rem;font-weight:600;margin-bottom:20px}
.step h3{font-family:var(--serif);font-weight:600;font-size:1.55rem;color:var(--forest);margin-bottom:10px}
.step p{color:var(--muted);max-width:34ch;text-wrap:pretty}
.steps-grid .step:not(:last-child)::after{content:"";position:absolute;top:29px;left:74px;right:-13px;height:1px;
  background:repeating-linear-gradient(90deg,var(--gold-soft) 0 6px,transparent 6px 12px)}

/* ---------- CTA final ---------- */
.cta{padding:clamp(72px,10vw,128px) 0;text-align:center;
  background:
    linear-gradient(160deg,rgba(19,42,15,.92),rgba(30,58,23,.92)),
    url("assets/img/chef-emplatando.jpg") center 30%/cover fixed;
  color:var(--cream)}
.cta-inner{max-width:720px;margin:0 auto}
.cta-title{font-size:clamp(2.1rem,4.4vw,3.4rem);color:#fff;text-wrap:balance;margin-bottom:16px}
.cta-sub{color:rgba(247,244,236,.82);font-size:1.1rem;margin-bottom:38px;text-wrap:pretty}
.cta-phone{margin-top:22px;font-size:1.05rem;letter-spacing:.04em;color:var(--gold-soft)}
.cta-phone a{border-bottom:1px solid rgba(194,161,90,.4);padding-bottom:2px}

/* ---------- Footer ---------- */
.site-footer{background:var(--forest-deep);color:rgba(247,244,236,.8)}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;
  padding:clamp(44px,6vw,70px) clamp(20px,5vw,40px) 34px}
.footer-badge{display:flex;width:118px;height:118px;border-radius:50%;background:var(--cream);
  align-items:center;justify-content:center;box-shadow:var(--shadow-md);flex:none}
.footer-badge img{width:88%}
.footer-text{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.footer-tag{font-family:var(--serif);font-size:1.4rem;font-weight:500;color:var(--cream);max-width:30ch;text-wrap:pretty}
.footer-bottom{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:22px clamp(20px,5vw,40px);border-top:1px solid rgba(247,244,236,.14);
  font-size:.82rem;letter-spacing:.04em;color:rgba(247,244,236,.55)}

/* ---------- WhatsApp flutuante ---------- */
.wa-float{position:fixed;right:20px;bottom:20px;z-index:90;width:58px;height:58px;border-radius:50%;
  background:var(--wa);color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 14px 30px -8px rgba(28,125,77,.7);transition:transform .25s}
.wa-float .wa-ico{width:30px;height:30px}
.wa-float:hover{transform:scale(1.08)}

/* ---------- Reveal ---------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* ---------- Responsivo ---------- */
@media (max-width:940px){
  .exp-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:820px){
  .nav{position:fixed;inset:78px 0 auto 0;flex-direction:column;gap:0;align-items:stretch;
    background:var(--paper);border-bottom:1px solid var(--line);box-shadow:var(--shadow-md);
    transform:translateY(-140%);transition:transform .35s ease;padding:10px 0 18px}
  .nav.open{transform:none}
  .nav>a{padding:15px clamp(20px,5vw,40px);border-bottom:1px solid var(--line)}
  .nav>a:not(.btn)::after{display:none}
  .nav-cta{margin:16px clamp(20px,5vw,40px) 4px;justify-content:center}
  .nav-toggle{display:flex}
  .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)}
  .hero-grid{grid-template-columns:1fr;text-align:left}
  .hero-media{max-width:460px;margin:8px auto 0}
  .chef-grid{grid-template-columns:1fr;gap:34px}
  .chef-media{max-width:460px}
  .gallery{grid-template-columns:1fr}
  .g-tall{grid-row:span 1}
  .steps-grid{grid-template-columns:1fr;gap:34px}
  .steps-grid .step:not(:last-child)::after{display:none}
  .cta{background-attachment:scroll}
}
@media (max-width:520px){
  .exp-grid{grid-template-columns:1fr}
  .footer-inner{flex-direction:column;align-items:flex-start}
  .hero-values{gap:10px 18px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  *{animation:none!important}
}