/* Buffet "humano": menos cara de template, mais personalidade Toscan.
   Fonte dos títulos parecida com a palavra "toscan" do logo (serifada gorda e arredondada),
   texto em grotesca com personalidade, giz à mão como a placa da ilha vegana. */

:root{--f-titulo:'Caprasimo','Cormorant Garamond',Georgia,serif;--f-texto:'Bricolage Grotesque','Manrope',system-ui,sans-serif;--f-giz:'Caveat','Segoe Print',cursive}

/* ===== papel e cores ===== */
body.humano{
  font-family:var(--f-texto);
  --creme:#f6eee0;
  background-color:#f6eee0;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .36  0 0 0 0 .26  0 0 0 0 .12  0 0 0 .09 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
body.humano .bloco.branco{background-color:#fffaf1;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .36  0 0 0 0 .26  0 0 0 0 .12  0 0 0 .07 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

/* ===== tipografia ===== */
body.humano :is(h1,h2,h3,.stat strong,.nota strong,.video .leg strong,.ir-titulo,.player .player-legenda){font-family:var(--f-titulo);font-weight:400;letter-spacing:-.005em}
body.humano h1{font-size:clamp(36px,5.2vw,64px);line-height:1.04}
body.humano h2{font-size:clamp(30px,3.6vw,46px);line-height:1.06}
body.humano :is(.gcard blockquote,.depoimento p,.cb-video figcaption){font-family:var(--f-texto);font-weight:500;font-style:normal}
body.humano .gcard blockquote{font-size:19px;line-height:1.45;color:var(--verde)}
body.humano .sv h3{font-size:22px;line-height:1.08}
body.humano .cliente h3{font-size:24px;line-height:1.08}
body.humano .dif h3{font-size:25px;line-height:1.08}
body.humano .stat strong{font-size:clamp(42px,5vw,62px)}
body.humano .zap-topo h3{font-size:clamp(24px,2.6vw,32px)}
body.humano .video .leg strong{font-size:20px;line-height:1.1}
body.humano .ir-titulo{font-size:26px}
body.humano .btn,body.humano .btn-marca,body.humano .filtros button,body.humano .abas button{font-family:var(--f-texto);font-weight:700}

/* destaque do H1: sublinhado ondulado à mão no lugar do itálico laranja */
body.humano .hero-buffet h1 em{font-style:normal;color:#ffc58a;padding-bottom:.14em;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 12' preserveAspectRatio='none'><path d='M2 7 Q 12 1 22 7 T 42 7 T 62 7 T 82 7 T 102 7 T 118 7' fill='none' stroke='%23ed8641' stroke-width='3.4' stroke-linecap='round'/></svg>") left bottom/100% .2em no-repeat}

/* rótulos em caixa alta viram texto normal ou giz */
body.humano :is(.cliente small,.gcard figcaption span,.zap-fonte,.eyebrow){text-transform:none;letter-spacing:0;font-weight:600}
body.humano .cliente small{font-size:13px}
body.humano .gcard figcaption span{font-size:13px}
body.humano .sobretitulo,
body.humano .dif small{font-family:var(--f-giz);font-weight:700;text-transform:none;letter-spacing:0;font-size:25px;line-height:1;color:#b8561f;display:inline-block;transform:rotate(-2.5deg);margin-bottom:6px}
body.humano .portfolio .sobretitulo,body.humano .orcamento .sobretitulo{color:#ffc58a}

/* anotações à mão (giz) */
.giz{font-family:var(--f-giz);font-weight:700;line-height:1;display:inline-block}
.giz-hero{font-size:28px;color:#ffc58a;transform:rotate(-2deg);margin-bottom:14px}
body.humano .hero-buffet .selo{display:none}

/* ===== arcos do emblema ===== */
.cb-faixa{width:min(100%,360px);aspect-ratio:4/5;border-radius:14px;box-shadow:none;margin-bottom:34px}
.cb-faixa::after{display:none}
body.humano .dif .ico{width:48px;height:58px;border-radius:999px 999px 10px 10px;background:var(--verde-claro);margin-bottom:14px}

/* serviços: dois cards largos quebram a grade */
.sv.larga{flex-direction:row}
.sv.larga .foto{flex:0 0 46%;height:auto;min-height:230px;margin:14px;border-radius:999px 999px 16px 16px}
.sv.larga .corpo{justify-content:center;padding:24px 26px 24px 8px}
.sv.larga h3{font-size:30px}
.sv.larga p{font-size:16px}
.servicos-grid .sv.larga{grid-column:span 2}
.sv.destaque{outline:0;background:#fff7e8;box-shadow:0 18px 40px rgba(237,134,65,.28)}

/* galeria: fotos "coladas", levemente tortas (só no desktop) */
@media (min-width:901px){
  body.humano .galeria figure{transition:transform .3s}
  body.humano .galeria figure:nth-child(4n+2){transform:rotate(-1.4deg)}
  body.humano .galeria figure:nth-child(4n+3){transform:rotate(1.2deg)}
  body.humano .galeria figure:nth-child(4n+4){transform:rotate(-.8deg)}
  body.humano .galeria figure:hover{transform:rotate(0) scale(1.03);z-index:3}
}

/* ===== faixa em movimento (marquee) ===== */
.marquee-caixa{overflow-x:clip;padding:26px 0 18px;position:relative;z-index:5}
.marquee{background:#ed8641;color:#013a2b;transform:rotate(-1.3deg);margin:0 -3%;box-shadow:0 10px 24px rgba(0,0,0,.18);white-space:nowrap;overflow:hidden}
.marquee-faixa{display:flex;width:max-content;animation:correr 40s linear infinite}
.marquee:hover .marquee-faixa,.marquee:focus-within .marquee-faixa{animation-play-state:paused}
.marquee span{font-family:var(--f-titulo);font-size:28px;padding:14px 0;display:inline-block}
.marquee i{font-style:normal;font-size:20px;color:#013a2b;opacity:.55;padding:0 26px;display:inline-block;transform:translateY(-2px)}
@keyframes correr{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee-faixa{animation-duration:140s}}
@media (max-width:900px){.marquee span{font-size:22px;padding:11px 0}.marquee i{padding:0 18px;font-size:16px}.marquee-caixa{padding:20px 0 6px}}

/* ===== números que sobem: sem mudança de layout ===== */
.stat strong{font-variant-numeric:tabular-nums}

/* ===== ajustes de celular ===== */
@media (max-width:900px){
  body.humano h1{font-size:clamp(33px,9vw,42px)}
  body.humano h2{font-size:30px}
  .giz-hero{font-size:25px;margin-bottom:10px}
  .servicos-grid .sv.larga{grid-column:span 2}
  .sv.larga .foto{flex-basis:42%;min-height:190px}
  .sv.larga h3{font-size:24px}
  .sv.larga .corpo{padding:18px 16px 18px 4px}
  .cb-faixa{width:min(78%,300px);margin-bottom:28px}
}
@media (max-width:520px){
  /* no celular os serviços ficam 2 por linha, sem cards largos */
  .servicos-grid .sv.larga{grid-column:auto}
  .sv.larga{flex-direction:column}
  .sv.larga .foto{flex:none;height:108px;min-height:0;margin:0;border-radius:0}
  .sv.larga .corpo{padding:12px 12px 4px}
  .sv.larga h3{font-size:19px}
  .sv.larga p{font-size:13px}
  body.humano .sv h3{font-size:19px}
  body.humano .cliente h3{font-size:19px}
  body.humano .dif h3{font-size:17px}
  body.humano .dif small{font-size:20px}
  body.humano .dif .ico{width:42px;height:50px}
  body.humano .stat strong{font-size:44px}
}

/* serviços em 4 colunas no desktop: [grande + 1 + 1] / [1 + 1 + grande] */
@media (min-width:1101px){
  .servicos-grid{grid-template-columns:repeat(4,1fr)}
}
.sv.larga p{flex:0 0 auto}
.sv.larga a.link{margin-top:16px}

/* ===== celular: a abertura inteira cabe na primeira tela (título, texto e os dois botões) ===== */
@media (max-width:900px){
  .hero-buffet{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:78px 0 62px}
  .hero-buffet>.container{width:min(1160px,100% - 32px)}
  .hero-buffet h1{font-size:clamp(30px,8.4vw,38px);line-height:1.06}
  .hero-buffet p.sub{font-size:15.5px;line-height:1.5;margin-top:14px}
  .estrelas-hero{margin-top:14px;font-size:14px}
  .hero-buffet .acoes{margin-top:20px;gap:10px;display:grid;grid-template-columns:1fr;width:100%}
  .hero-buffet .acoes .btn{width:100%;min-height:52px}
  .giz-hero{margin-bottom:8px}
}
@media (max-width:900px) and (max-height:700px){
  .hero-buffet{padding:70px 0 54px}
  .hero-buffet h1{font-size:clamp(28px,7.6vw,34px)}
  .hero-buffet p.sub{font-size:14.5px;margin-top:10px}
  .estrelas-hero{margin-top:10px}
  .hero-buffet .acoes{margin-top:14px}
  .hero-buffet .acoes .btn{min-height:48px}
}

/* números do "Quem já provou": três lado a lado no celular, compactos */
.stat .mais{font-style:normal}
@media (max-width:900px){
  .stats-grandes{grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:22px}
  .stat{display:block;padding:12px 0 0;text-align:center}
  .stat .ico{display:none}
  .stat .mais{display:none}
  body.humano .stat strong{font-size:clamp(26px,8.2vw,36px)}
  .stat span{font-size:11.5px;line-height:1.25;margin-top:4px}
}
