/* Página única da Sr. José: as sections do template 06 deixam de ser telas fixas de 900px
   e passam a ter altura automática com 120px de respiro. Carrega depois de template.css. */
html, body { overflow-x: clip; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { background: var(--bg); }
::selection { background: var(--caramelo); color: #fff; }

.sec { height: auto; min-height: 0; padding: 120px 0; }
.cont { width: min(1200px, calc(100% - 80px)); margin-inline: auto; position: relative; }
.serif em, h2 em { font-style: italic; }

/* entrada por rolagem: as sections entram quando aparecem (não só no load) */
.rv { transition-delay: calc(var(--d, 0) * 70ms + 60ms); }
.in .sec .rv { opacity: 0; transform: translateY(16px); }
.in .sec.vis .rv { opacity: 1; transform: none; }

/* botão principal: couro, com seta caramelo */
.btn-verde { background: var(--petroleo); }
.btn-verde .seta { color: var(--petroleo); }
.btn-zap svg.z { width: 17px; height: 17px; fill: currentColor; }

/* ========== nav fixo ========== */
.topo { position: fixed; top: 0; left: 0; right: 0; z-index: 60; pointer-events: none; transition: transform .5s var(--ease); }
.topo .barra { pointer-events: auto; margin: 0 auto; max-width: 100%; height: 88px; padding: 0 40px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; color: #F4EEE4; border-radius: 0; border: 1px solid transparent;
  transition: max-width .6s var(--ease), height .6s var(--ease), margin-top .6s var(--ease), border-radius .6s var(--ease), background-color .4s, color .4s, border-color .4s, padding .6s var(--ease); }
.topo .marca { display: flex; align-items: center; gap: 12px; justify-self: start; }
.topo .marca img { width: 56px; height: 56px; object-fit: contain; transition: width .6s var(--ease), height .6s var(--ease); }
.topo .marca .esc { display: none; }
.topo .marca b { font-family: var(--f-titulo); font-weight: 400; font-size: 24px; letter-spacing: -.01em; }
.topo ul { display: flex; gap: 30px; font-size: 15px; }
.topo ul a { opacity: .9; }
.topo .dir { justify-self: end; display: flex; align-items: center; gap: 24px; font-size: 15px; }
.topo .menu-bt { display: none; }
.topo.rolou .barra { max-width: 1200px; height: 64px; margin-top: 12px; border-radius: 999px; padding: 0 8px 0 14px; background: rgba(244,238,228,.82); color: var(--fg); border-color: rgba(30,20,12,.1);
  -webkit-backdrop-filter: blur(14px) saturate(1.3); backdrop-filter: blur(14px) saturate(1.3); }
.topo.rolou .marca img { width: 42px; height: 42px; }
.topo.rolou:not(.sobre-escuro) .marca .cla { display: none; }
.topo.rolou:not(.sobre-escuro) .marca .esc { display: block; }
.topo.rolou.sobre-escuro .barra { background: rgba(26,16,10,.72); color: #F4EEE4; border-color: rgba(244,238,228,.12); }
.topo.rolou .btn-verde { height: 46px; }
@media (hover: hover) and (pointer: fine) { .topo ul a:hover { opacity: 1; text-decoration: underline; text-underline-offset: 4px; } }

/* WhatsApp flutuante (só celular, ver mobile.css) */
.zap-float { display: none; }

/* ========== s01 hero ========== */
.hero.sec { height: 100vh; height: 100svh; min-height: 720px; max-height: 1100px; padding: 0; }
.hero .img { background-position: center 52%; }
.hero h1 { font-size: clamp(56px, 6.4vw, 92px); }
.hero .baixo { padding: 0 40px; }
.hero .meta .logo-mini { display: none; }

/* ========== s02 intro ========== */
.intro .par { position: static; width: auto; max-width: 780px; }
.intro .rot { position: relative; top: auto; height: 520px; margin-top: 40px; display: grid; grid-template-columns: 350px 1fr auto; align-items: center; }
.intro .rot .rotulo { position: static; transform: none; width: 260px; }
.intro .rot .lista { position: relative; left: auto; top: auto; bottom: auto; width: auto; height: 100%; }
.intro .rot .btn { position: static; transform: none; }
.intro .rot .btn:active { transform: scale(.97); }

/* ========== s03 por que ========== */
.porque h2 { position: static; }
.porque .cards { position: static; margin-top: 72px; }
.porque p { color: #4a3f36; }
.v-lista .pill svg { stroke: var(--caramelo); }

/* ========== s04 serviços ========== */
.servicos .cont { display: grid; grid-template-columns: 470px 1fr; column-gap: 130px; row-gap: 48px; align-items: end; }
.servicos h2, .servicos .sobre, .servicos .abas, .servicos .palco { position: relative; top: auto; left: auto; right: auto; }
.servicos .sobre { padding-bottom: 6px; }
.servicos .abas { width: auto; align-self: start; }
.servicos .palco { height: 600px; }
.servicos .ticket .p { font-size: 30px; }
.aba .cab b { color: var(--caramelo); }
.aba.on .cab b { color: #e2bf93; }

/* ========== s05 o bar ========== */
.planos h2 { position: static; font-size: 64px; }
.planos .sub { position: static; margin-top: 22px; }
.planos .duo { position: static; margin-top: 64px; height: 600px; }
.plano .janela .info .v { font-size: 25px; line-height: 1.12; font-style: italic; }
.plano .janela .info .tag { margin-top: 14px; }
.plano .janela li svg { stroke: var(--caramelo); }
.grao.oliva { --gc: #3F2A1A; }

/* ========== s06 espaço ========== */
.espaco { --W: 384px; --H: 480px; }
.espaco h2, .espaco .sub { position: static; }
.espaco .sub { margin-top: 22px; color: #5a4d42; }
.espaco .ctl { position: relative; top: auto; left: auto; right: auto; margin: 48px 40px 0; }
.espaco .pista { position: relative; top: auto; height: calc(var(--H) + 48px); margin-top: 32px; touch-action: pan-y; }
.slide { width: var(--W); height: var(--H); margin-left: calc(var(--W) / -2); }
.slide .ft { border-radius: 3px; }
.slide .leg { top: calc(var(--H) + 14px); }
.espaco.sec { padding-bottom: 96px; }

/* ========== s07 equipe (sem nomes) ========== */
.equipe .cont { display: grid; grid-template-columns: 1fr 520px; gap: 96px; align-items: center; }
.equipe h2 { position: static; font-size: 60px; }
.equipe .txt > p.sub { margin-top: 24px; font-size: 18px; line-height: 1.5; color: rgba(244,238,228,.72); max-width: 460px; }
.equipe .funcoes { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 10px; }
.equipe .chip { position: static; }
.equipe .cit { margin: 48px 0 0; padding-top: 32px; border-top: 1px solid rgba(244,238,228,.16); }
.equipe .cit blockquote { margin: 0; font-family: var(--f-titulo); font-size: 28px; line-height: 1.22; letter-spacing: -.015em; max-width: 520px; }
.equipe .cit p { margin-top: 14px; font-size: 14px; color: rgba(244,238,228,.55); }
.equipe .acoes { margin-top: 40px; }
.equipe .ret { position: relative; height: 680px; border-radius: 4px; overflow: hidden; background: var(--escuro2); }
.equipe .ret > div { position: absolute; inset: 0; background-size: cover; background-position: center 62%; transform: scale(1.04); transition: transform 1.6s var(--ease); }
.equipe.vis .ret > div { transform: none; }
.equipe .ret::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 62%, rgba(26,16,10,.8)); }
.equipe .ret span { position: absolute; left: 22px; bottom: 20px; z-index: 1; font-family: var(--f-titulo); font-size: 20px; color: #fff; }

/* ========== s08 avaliações ========== */
.aval .topo-av { display: grid; grid-template-columns: 1.4fr 1fr; gap: 64px; align-items: center; }
.aval .citacao { height: auto; display: grid; }
.aval .citacao .q { position: relative; inset: auto; grid-area: 1 / 1; }
.aval .citacao blockquote { font-size: 27px; line-height: 1.24; }
.aval .tres { position: static; margin-top: 72px; }
.aval .mini { font-size: 40px; }
.aval .mini small { font-size: 15px; }
.aval .nota .estrelas { gap: 6px; }
.aval .nota .estrelas svg { width: 18px; height: 18px; fill: var(--caramelo); }
.aval .ver { margin-top: 28px; }

/* ========== s09 contato ========== */
.contato.sec { padding: 0; min-height: 920px; }
.contato .esq { display: flex; flex-direction: column; padding: 40px 64px 34px max(40px, calc((100vw - 1200px) / 2)); }
.contato .esq .logo { position: static; display: flex; align-items: center; gap: 12px; }
.contato .esq .logo img { width: 56px; height: 56px; }
.contato h2 { margin-top: 96px; }
.contato .info div { overflow-wrap: anywhere; }
.contato .rodape { position: static; margin-top: auto; padding-top: 72px; gap: 24px; }
.contato .dir { padding: 120px 64px; }
.form select, .form input { min-width: 0; width: 100%; }
.chip-ab::before { background: #4f8a5a; }
.contato .rodape { flex-wrap: wrap; }
.contato .rodape nav a { white-space: nowrap; }
.intro .rot { margin-top: 64px; }
/* lista rotativa: some nas bordas, sem invadir o parágrafo de cima */
.intro .rot .lista { overflow: hidden; -webkit-mask-image: linear-gradient(transparent, #000 22%, #000 78%, transparent); mask-image: linear-gradient(transparent, #000 22%, #000 78%, transparent); }
