/* The Seasons vem do kit Adobe Fonts ieg5ojp (link no <head> de cada pagina) */

:root{
  --cal:#F2F1EE;
  --nevoa:#E6E5E1;
  --grafite:#262626;
  --grafite-2:rgba(38,38,38,.72);
  --filete:rgba(38,38,38,.12);
  --serif:"the-seasons","The Seasons",Georgia,serif;
  --sans:"Raleway",sans-serif;
  --gutter:clamp(16px,4vw,64px);
  --raio:18px;
}
*{box-sizing:border-box;margin:0;padding:0}
html.suave{scroll-behavior:smooth}
body{background:var(--cal);color:var(--grafite);font:400 1.0625rem/1.6 var(--sans);-webkit-font-smoothing:antialiased;font-variant-numeric:lining-nums}
img{display:block;width:100%;height:auto}
a{color:inherit}
:focus-visible{outline:2px solid currentColor;outline-offset:4px;border-radius:4px}

/* marca: simbolo + MARUAI MEDIA em The Seasons negrito, como no maruaimedia.com */
.marca{display:flex;align-items:center;gap:12px;text-decoration:none}
.marca img{width:24px;height:24px;border-radius:2px}
.marca span{font-family:var(--serif);font-weight:700;font-size:1.0625rem;line-height:1;letter-spacing:.02em;white-space:nowrap}

/* barra: transparente sobre o hero, vidro fosco depois de rolar */
.barra{position:fixed;inset:0 0 auto;z-index:10;height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--gutter);transition:background .3s,color .3s,border-color .3s;border-bottom:1px solid transparent}
.barra.clara{color:var(--cal)}
.barra.sem-anim,.barra.sem-anim *{transition:none!important}
.barra.vidro{color:var(--grafite);background:rgba(242,241,238,.74);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-color:var(--filete)}
.barra nav{display:flex;align-items:center;gap:32px;font-size:.8125rem;font-weight:500}
.barra nav a{text-decoration:none;opacity:.82;transition:opacity .2s}
.barra nav a:hover,.barra nav a[aria-current]{opacity:1}
.barra .mini{opacity:1;padding:7px 16px;border-radius:999px;background:var(--grafite);color:var(--cal);font-weight:600}
.barra.clara .mini{background:var(--cal);color:var(--grafite)}

/* botoes */
.pilula{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 28px;border-radius:999px;background:var(--grafite);color:var(--cal);font-size:1rem;font-weight:600;text-decoration:none;transition:transform .2s,background .2s}
.pilula:hover{background:#111}
.pilula:active{transform:scale(.98)}
.pilula.clara{background:var(--cal);color:var(--grafite)}
.pilula.clara:hover{background:#fff}
.link{font-size:1rem;font-weight:600;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px;opacity:.9}
.link:hover{opacity:1}
.acoes{display:flex;flex-wrap:wrap;align-items:center;gap:16px 32px}

/* titulos */
.titulo{font-family:var(--serif);font-weight:400;font-size:clamp(2.5rem,5.4vw,4.5rem);line-height:1.02;letter-spacing:-.01em}
.sub{font-size:clamp(1.125rem,1.6vw,1.375rem);line-height:1.45;color:var(--grafite-2);max-width:34ch}
.centro{text-align:center;display:flex;flex-direction:column;align-items:center}

/* fade */
.surge{opacity:0;transform:translateY(32px)}
.surge img{transform:scale(1.04);transition:transform 1.8s cubic-bezier(.2,.7,.2,1)}
.surge.ok{opacity:1;transform:none;transition:opacity 1.4s ease,transform 1.4s cubic-bezier(.2,.7,.2,1)}
.surge.ok img{transform:none}
.surge.d1{transition-delay:.12s}.surge.d2{transition-delay:.24s}.surge.d3{transition-delay:.36s}
@media (prefers-reduced-motion:reduce){.surge,.surge img{opacity:1;transform:none;transition:none}html.suave{scroll-behavior:auto}}

/* chamada final: foto inteira, como o hero */
.chamada{position:relative;min-height:88svh;display:flex;align-items:flex-end;color:var(--cal);overflow:hidden;isolation:isolate}
.chamada>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.chamada::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(20,20,20,0) 35%,rgba(20,20,20,.72) 100%)}
.chamada-in{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:24px;padding:0 var(--gutter) clamp(48px,8vh,96px)}
.chamada h2{font-family:var(--serif);font-weight:400;font-size:clamp(3rem,7vw,6.5rem);line-height:.98;letter-spacing:-.015em}
.chamada p{font-size:1.125rem;line-height:1.45;max-width:32ch}
.chamada .acoes{margin-top:8px}

/* rodape */
.rodape{padding:64px var(--gutter) 40px}
.rodape-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:32px}
.rodape .marca img{width:40px;height:40px}
.rodape .marca span{font-size:1.75rem}
.rodape ul{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:8px 32px;font-size:.875rem;font-weight:500}
.redes{display:flex;gap:8px}
.icone{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:999px;transition:background .2s}
.icone:hover{background:var(--nevoa)}
.icone svg{width:20px;height:20px;fill:currentColor}
.oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rodape ul a{text-decoration:none;opacity:.8}
.rodape ul a:hover{opacity:1}
.rodape-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;margin-top:40px;padding-top:24px;border-top:1px solid var(--filete);font-size:.75rem;color:var(--grafite-2)}

/* whatsapp fixo no celular */
.fixo{display:none}

@media (max-width:860px){
  .barra nav a:not(.mini){display:none}
  .chamada{min-height:80svh}
  .fixo{display:flex;position:fixed;left:16px;right:16px;bottom:16px;z-index:9;transition:opacity .3s,transform .3s}
  .fixo .pilula{width:100%;box-shadow:0 8px 24px rgba(28,28,28,.2)}
  .fixo.some{opacity:0;transform:translateY(24px);pointer-events:none}
  .rodape{padding-bottom:104px}
}