/* Pirá – Cozinha de Origem · identidade Oca aplicada (tokens: conceito/tokens.css) */
@font-face{font-family:"Inter Tight";src:url(/fonts/intertight-latin.woff2) format("woff2");font-weight:400 800;font-display:swap}
:root{
 --sal-do-mar:#FFFAE8;--azul-pira:#2E368C;--azul-mare:#456399;--azul-ceu:#5E91A6;--vermelho-brasa:#F04500;--branco:#FFFFFF;--tinta:#1B1F4A;
 --font:"Inter Tight","Helvetica Neue",Arial,sans-serif;
 --fs-display:clamp(2.5rem,1.4rem + 4.6vw,5.5rem);--fs-h2:clamp(2rem,1.3rem + 2.8vw,3.6rem);--fs-linha:clamp(1.25rem,1rem + 1vw,1.75rem);--fs-body:1.0625rem;--fs-btn:1.1875rem;
 --tracking-display:-.035em;--tracking-body:-.01em;--radius-btn:999px;--space:clamp(1.25rem,.8rem + 2vw,3rem);--max:1280px;--ease:cubic-bezier(.2,.7,.2,1);
 --escamas:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='16'%3E%3Cpath d='M0 16a16 16 0 0 1 32 0' fill='none' stroke='%235E91A6' stroke-width='2'/%3E%3Cpath d='M-16 0a16 16 0 0 0 32 0M16 0a16 16 0 0 0 32 0' fill='none' stroke='%235E91A6' stroke-width='2'/%3E%3C/svg%3E");
}
*,*::before,*::after{box-sizing:border-box}*{margin:0}
html{scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{background:var(--sal-do-mar);color:var(--tinta);font-family:var(--font);font-size:var(--fs-body);line-height:1.6;letter-spacing:var(--tracking-body);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
:focus-visible{outline:3px solid var(--azul-pira);outline-offset:3px}
.azul :focus-visible,.azul:focus-visible{outline-color:var(--sal-do-mar)}
.pular{position:absolute;left:1rem;top:-60px;z-index:30;background:var(--azul-pira);color:var(--sal-do-mar);padding:.7rem 1rem;border-radius:8px}.pular:focus{top:1rem}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--space)}
.ph{background:#FFF1C9;outline:1.5px dashed #9A6A00;color:#5A3D00;font:600 .78em/1.3 var(--font);padding:.1em .45em;border-radius:4px;letter-spacing:0}
.rascunho{display:inline-block;vertical-align:middle;background:#EDE3FF;outline:1.5px dashed #5B3FA0;color:#3D2A73;font:700 .64rem/1.3 var(--font);letter-spacing:.04em;text-transform:uppercase;padding:.15em .45em;border-radius:4px;margin-left:.35em}
.legenda{font-size:.8rem;color:var(--azul-mare);margin-top:.5rem}
/* header */
.hd{position:sticky;top:0;z-index:10;background:var(--sal-do-mar);border-bottom:1px solid rgba(46,54,140,.12)}
.hd .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;height:76px}
.logo{position:relative;display:block}
.logo img{height:40px;width:auto}
.logo .ph{position:absolute;left:0;top:44px;font-size:.56rem;white-space:nowrap}
.nav{display:flex;gap:2rem;align-items:center}
.nav a:not(.btn-reserva){color:var(--azul-pira);text-decoration:none;font-weight:500;padding:.6rem 0}
/* botões: brasa SÓ na reserva */
.btn-reserva{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:48px;padding:.75rem 1.6rem;border-radius:var(--radius-btn);background:var(--vermelho-brasa);color:var(--branco);font-weight:700;font-size:var(--fs-btn);line-height:1.15;text-decoration:none;letter-spacing:-.01em;transition:transform .2s var(--ease),filter .2s}
.btn-reserva:hover{filter:brightness(1.06);transform:translateY(-1px)}
.btn-reserva svg{width:22px;height:22px;flex:none}
.azul .btn-reserva,.btn-reserva.anel{box-shadow:0 0 0 3px var(--azul-pira),0 0 0 5px var(--sal-do-mar)}
.nav .btn-reserva{min-height:44px;padding:.5rem 1.2rem}
.btn-linha{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:48px;padding:.75rem 1.5rem;border-radius:var(--radius-btn);color:var(--azul-pira);box-shadow:inset 0 0 0 2px var(--azul-pira);font-weight:700;font-size:1.05rem;text-decoration:none;transition:background .2s,color .2s}
.btn-linha:hover{background:var(--azul-pira);color:var(--sal-do-mar)}
.azul .btn-linha{color:var(--sal-do-mar);box-shadow:inset 0 0 0 2px var(--sal-do-mar)}
.azul .btn-linha:hover{background:var(--sal-do-mar);color:var(--azul-pira)}
.btn-linha svg{width:20px;height:20px}
.ctas{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center}
.link{color:var(--azul-pira);font-weight:700;text-underline-offset:3px}
/* hero */
.hero{max-width:var(--max);margin:0 auto;padding:0 var(--space);display:grid;grid-template-columns:1.05fr 1fr;min-height:calc(100vh - 76px - 72px);min-height:calc(100svh - 76px - 72px)}
.hero-bloco{background:var(--azul-pira);color:var(--sal-do-mar);padding:clamp(2rem,4vw,4.5rem);padding-top:5rem;display:flex;flex-direction:column;justify-content:flex-end;gap:1.5rem;position:relative;border-radius:28px 0 0 28px}
.hero-bloco::after{content:"";position:absolute;left:0;right:0;top:0;height:48px;background:var(--escamas);opacity:.55;border-radius:28px 0 0 0}
h1,h2,h3{text-wrap:balance}
.hero h1{font-size:var(--fs-display);font-weight:800;line-height:.95;letter-spacing:var(--tracking-display);max-width:13ch}
.hero .linha{font-size:var(--fs-linha);font-weight:500}
.hero .btn-reserva{align-self:flex-start}
.hero-foto{border-radius:0 28px 28px 0;overflow:hidden;background:#F2EEDE}
.hero-foto img{width:100%;height:100%;object-fit:cover}
/* logo abaixo da dobra */
.apoio{padding:2.2rem 0 1rem}
.apoio .wrap{display:grid;grid-template-columns:1.4fr 1fr;gap:var(--space);align-items:center}
.apoio p.sub{font-size:1.15rem;max-width:58ch}
.apoio .info{color:var(--azul-mare);font-weight:500;font-size:.98rem;margin-top:.8rem}
.apoio .ctas{justify-content:flex-end}
/* seções */
.secao{padding:clamp(4rem,8vw,7rem) 0;position:relative}
h2{font-size:var(--fs-h2);font-weight:800;line-height:1;letter-spacing:var(--tracking-display);color:var(--azul-pira);margin-bottom:1.4rem}
.azul h2{color:var(--sal-do-mar)}
h3{font-size:1.3rem;font-weight:700;color:var(--azul-pira);letter-spacing:-.02em}
.rotulo{display:block;font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--azul-mare);margin-bottom:1rem}
.azul .rotulo{color:#C9D3EC}
.texto{max-width:60ch}.texto p+p{margin-top:1rem}
.dois{display:grid;grid-template-columns:1fr 1fr;gap:var(--space);align-items:center}
.foto{border-radius:20px;overflow:hidden}
.foto img{width:100%;height:auto}
.divisa{height:16px;background:var(--escamas);opacity:.7}
/* manifesto */
.azul{background:var(--azul-pira);color:var(--sal-do-mar)}
.manifesto{padding-bottom:calc(clamp(4rem,8vw,7rem) + 32px)}
.manifesto::after{content:"";position:absolute;left:0;right:0;bottom:0;height:32px;background:var(--escamas) 0 0/32px 16px;opacity:.75}
.manifesto blockquote{margin-top:2.2rem;font-size:clamp(1.6rem,1rem + 2.4vw,2.9rem);font-weight:700;line-height:1.12;letter-spacing:var(--tracking-display)}
.manifesto blockquote p{margin:0}
.manifesto figcaption{margin-top:1.4rem;font-size:.9rem;color:#C9D3EC}
.manifesto .texto{font-size:1.15rem}
/* citação */
.cita{margin:1.8rem 0;padding-left:1.2rem;border-left:4px solid var(--azul-ceu);font-size:1.2rem;font-weight:500;color:var(--azul-pira)}
.cita cite{display:block;margin-top:.5rem;font-size:.9rem;font-style:normal;color:var(--azul-mare);font-weight:500}
/* cardápio */
.cardapio .grade{display:grid;grid-template-columns:1.3fr .7fr;gap:var(--space);align-items:start}
.menu-sec{margin-top:2.2rem}
.menu-sec h3{border-bottom:2px solid var(--azul-pira);padding-bottom:.5rem;margin-bottom:.4rem}
.menu-sec ul{list-style:none;padding:0}
.menu-sec li{display:grid;grid-template-columns:1fr auto;gap:.3rem 1.5rem;padding:.9rem 0;border-bottom:1px solid rgba(69,99,153,.3)}
.menu-sec li b{color:var(--azul-pira)}
.menu-sec li p{grid-column:1;font-size:.96rem}
.menu-sec .preco{grid-column:2;grid-row:1/span 2;align-self:start;font-weight:700;color:var(--azul-pira);white-space:nowrap}
.aviso{font-size:.88rem;color:var(--azul-mare);margin-top:1rem}
.moderacao{font-weight:700}
/* o que dizem */
.depo{list-style:none;padding:0;display:grid;gap:1rem;margin:1.6rem 0}
.depo li{background:#fff;border-radius:16px;padding:1.2rem 1.4rem;box-shadow:inset 0 0 0 1px rgba(46,54,140,.12);font-weight:500;color:var(--azul-pira)}
.nota-g{font-size:1.15rem;font-weight:700;color:var(--azul-pira)}
/* visite + FAQ */
.mapa{position:relative;border-radius:20px;overflow:hidden;aspect-ratio:4/3;background:#ECF0F0}
.mapa img{width:100%;height:100%;object-fit:cover}.mapa iframe{width:100%;height:100%;border:0}
.mapa .btn-linha{position:absolute;left:50%;bottom:1rem;transform:translateX(-50%);background:var(--sal-do-mar);white-space:nowrap}
.dados{display:grid;gap:.9rem;margin:1.4rem 0}
.dados h3{font-size:1rem;text-transform:uppercase;letter-spacing:.1em;color:var(--azul-mare)}
.faq{margin-top:clamp(3rem,6vw,5rem)}
.faq details{border-bottom:1px solid rgba(69,99,153,.35)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:1rem;padding:1.15rem 0;font-weight:700;font-size:1.08rem;color:var(--azul-pira);min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:500;font-size:1.5rem;line-height:1;color:var(--azul-mare)}
.faq details[open] summary::after{content:"−"}
.faq details p{padding-bottom:1.2rem;max-width:70ch}
/* CTA final */
.final{text-align:center}
.final h2{font-size:var(--fs-display);text-transform:lowercase}
.final .ctas{justify-content:center;margin-top:2rem}
/* rodapé */
.rodape{padding:3rem 0 7rem;font-size:.92rem}
.rodape .wrap{display:grid;gap:.8rem}
.rodape img{height:36px;width:auto;margin-bottom:.5rem}
.rodape a{color:var(--sal-do-mar)}
.rodape .links{display:flex;flex-wrap:wrap;gap:.2rem 1.4rem}.rodape .links a{padding:.55rem 0;display:inline-block}
.rodape .ph{color:#5A3D00}
/* barra fixa e consentimento */
.barra{display:none}
.consent{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:40;max-width:560px;margin:0 auto;background:#fff;color:var(--tinta);border-radius:16px;box-shadow:0 20px 50px -15px rgba(27,31,74,.5);padding:1.2rem;display:grid;gap:.8rem;font-size:.9rem}
.consent[hidden]{display:none}
.consent .acoes{display:flex;gap:.6rem;justify-content:flex-end}
.consent button{min-height:44px;padding:0 1.2rem;border-radius:999px;font:700 .95rem var(--font);cursor:pointer;border:0;background:var(--azul-pira);color:var(--sal-do-mar)}
.consent button.sec{background:transparent;color:var(--azul-pira);box-shadow:inset 0 0 0 2px var(--azul-pira)}
.interna{padding:4rem 0;min-height:60vh}.interna h1{font-size:clamp(2rem,5vw,3.2rem);color:var(--azul-pira);letter-spacing:var(--tracking-display);line-height:1;margin-bottom:1.2rem}.interna p{max-width:68ch;margin-bottom:1rem}.interna h2{font-size:1.5rem;margin:1.6rem 0 .6rem}
/* responsivo */
@media (max-width:820px){
 .nav a:not(.btn-reserva),.nav .btn-reserva{display:none}
 .hd .wrap{height:64px}.logo img{height:32px}.logo .ph{top:36px}
 .hero{grid-template-columns:1fr;padding:0;min-height:0}
 .hero-foto{order:-1;border-radius:0;height:300px}
 .hero-bloco{border-radius:0;padding:3.2rem 1.25rem 2.25rem}
 .hero-bloco::after{border-radius:0}
 .apoio .wrap,.dois,.cardapio .grade{grid-template-columns:1fr}
 .apoio .ctas{justify-content:flex-start}
 .final .btn-reserva,.final .btn-linha{width:100%}
 .barra{display:flex;position:fixed;inset:auto 0 0 0;z-index:9;background:var(--azul-pira);padding:.75rem 1rem calc(.75rem + env(safe-area-inset-bottom));justify-content:center}
 .barra .btn-reserva{width:100%;box-shadow:0 0 0 2px var(--sal-do-mar)}
 .consent{bottom:6rem}
}
@media (prefers-reduced-motion:no-preference){
 .js .rv{opacity:0;transform:translateY(16px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
 .js .rv.on{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.mt{margin-top:2rem}
