/* ---------- 9 · O fecho e o rodapé (a noite com o sol) ---------- */
/* a transição 8 → 9: o papel vira noite na mesma curva de horizonte da 3 e da 5, agora com a luz do fim de tarde */
.fecho{margin-top:-64px;border-radius:50% 50% 0 0 / 64px 64px 0 0;text-align:center;padding-top:clamp(140px,15vw,210px);padding-bottom:0;
  background:
    radial-gradient(70% 55% at 50% 100%,rgb(255 140 30 / .22),transparent 70%),
    linear-gradient(180deg,var(--n1) 0%,#06182a 55%,#1a1a24 100%);
  box-shadow:0 -1px 0 rgb(255 170 60 / .45),0 -22px 60px -14px rgb(255 150 40 / .3)}
.fecho__corpo{position:relative;z-index:2;max-width:880px;margin-inline:auto}
.fecho h2{font-size:clamp(40px,5.6vw,84px);line-height:1}
.fecho__corpo > p{margin:20px auto 0;max-width:30em;color:var(--t2);font-size:clamp(17px,1.3vw,20px);text-wrap:balance}
.fecho__acoes{margin-top:36px;display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.fecho__acoes .botao svg{width:20px;height:20px;color:var(--folha)}

/* o sol: o disco quente e um leque de raios finos, metade abaixo do horizonte; sobe e cresce com a rolagem até o fim da página */
.sol{position:absolute;left:50%;bottom:0;width:min(86vw,820px);aspect-ratio:1;translate:-50% 50%;z-index:0;pointer-events:none;transform:translateY(22%) scale(.82);transition:transform 2s var(--ease)}
.fecho.visto .sol,.fecho:has(.visto) .sol{transform:none}
.sol__disco{position:absolute;inset:18%;border-radius:50%;
  background:radial-gradient(circle,#fff6d0 0%,#ffd247 18%,#ffb11f 34%,rgb(255 130 20 / .32) 52%,rgb(255 110 20 / .1) 64%,transparent 71%)}
.sol__raios{position:absolute;inset:-30%;border-radius:50%;
  background:repeating-conic-gradient(from 0deg,rgb(255 214 110 / .26) 0deg 2.2deg,transparent 2.2deg 15deg);
  -webkit-mask:radial-gradient(circle,#000 22%,rgb(0 0 0 / .4) 40%,transparent 62%);mask:radial-gradient(circle,#000 22%,rgb(0 0 0 / .4) 40%,transparent 62%);animation:g-gira 160s linear infinite}
@supports (animation-timeline: view()){
  .sol{transition:none;animation:s-nasce linear both;animation-timeline:view();animation-range:entry 10% contain 40%}
  @keyframes s-nasce{from{transform:translateY(34%) scale(.78)}to{transform:none}}
}
/* o horizonte: a linha de luz onde o fio termina e o sol se apoia */
.horizonte{position:relative;z-index:1;height:1px;margin:clamp(120px,14vw,200px) calc(var(--gutter) * -1) 0;
  background:linear-gradient(90deg,transparent,rgb(255 198 26 / .5) 25%,#ffe08a 50%,rgb(255 198 26 / .5) 75%,transparent);box-shadow:0 0 24px 2px rgb(255 170 40 / .45)}
.fecho .fio{bottom:0}

/* o rodapé: o chão depois do horizonte. O sol se reflete nele (a faixa quente que desce do centro, cortada por linhas finas,
   como luz na água), e tudo cabe em 2 linhas: a de cima com a marca, a navegação, o contato e as saídas; a de baixo, os créditos */
.rodape{--rodape-h:auto;position:relative;isolation:isolate;padding:clamp(22px,3vh,34px) var(--gutter) clamp(16px,2.4vh,24px);color:var(--t2);font-size:14px;
  background:#0a0e15;overflow:hidden}
.rodape::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(22% 120% at 50% 0%,rgb(255 176 46 / .26),rgb(255 140 30 / .08) 45%,transparent 75%),
    radial-gradient(60% 80% at 50% 0%,rgb(255 150 40 / .08),transparent 70%)}
.rodape::after{content:"";position:absolute;left:30%;right:30%;top:0;bottom:0;z-index:-1;pointer-events:none;opacity:.5;
  background:repeating-linear-gradient(180deg,rgb(255 214 120 / .22) 0 1px,transparent 1px 7px);
  -webkit-mask:radial-gradient(50% 90% at 50% 0%,#000,transparent 75%);mask:radial-gradient(50% 90% at 50% 0%,#000,transparent 75%)}
.rodape__linha{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px}
.rodape__marca{flex:none;border-radius:8px}
.rodape__marca img{display:block;height:38px;width:auto}
.rodape__nav{display:flex;flex-wrap:wrap;gap:4px 22px}
.rodape__nav a,.rodape__contato a{color:rgb(255 255 255 / .72);background:linear-gradient(var(--sol),var(--sol)) 0 100% / 0 1.5px no-repeat;padding-bottom:2px;transition:color .3s var(--ease),background-size .35s var(--ease)}
.rodape__nav a:hover,.rodape__contato a:hover{color:#fff;background-size:100% 1.5px}
.rodape__contato{display:flex;flex-wrap:wrap;gap:4px 18px}
.rodape__saidas{display:flex;align-items:center;gap:8px}
.rodape__insta{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid rgb(255 255 255 / .12);color:#fff;transition:border-color .3s var(--ease),background .3s var(--ease),transform .3s var(--ease)}
.rodape__insta svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}
.rodape__insta:hover{border-color:rgb(255 255 255 / .3);background:rgb(255 255 255 / .05);transform:translateY(-1px)}
.rodape__portal{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border-radius:999px;background:rgb(255 255 255 / .06);border:1px solid rgb(255 255 255 / .12);color:#fff;font-weight:600;transition:background .3s var(--ease),border-color .3s var(--ease)}
.rodape__portal svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s cubic-bezier(.3,1.5,.5,1)}
.rodape__portal:hover{background:rgb(255 255 255 / .1);border-color:rgb(255 255 255 / .24)}
.rodape__portal:hover svg{transform:translate(2px,-2px)}
.rodape__base{margin-top:clamp(14px,2.2vh,22px);padding-top:clamp(12px,1.8vh,18px);border-top:1px solid rgb(255 255 255 / .07);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 28px;font-size:12.5px;color:var(--t3)}
.rodape__creditos{display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px}
.rodape__creditos b{color:var(--t1);font-weight:700}
.rodape__grupo{display:inline-flex;align-items:center;gap:8px}
.rodape__grupo img{height:20px;width:auto}
@media (max-width:1000px){.rodape__linha{justify-content:flex-start}.rodape__saidas{margin-left:auto}}
@media (max-width:560px){
  .fecho{border-radius:50% 50% 0 0 / 34px 34px 0 0;margin-top:-34px;min-height:0}
  .fecho__acoes .botao{flex:1 1 100%}
  .sol{width:130vw}
  .rodape__linha{gap:14px 20px}
  .rodape__contato{width:100%}
  .rodape__base{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){.sol{animation:none;transform:none;transition:none}.sol__raios{animation:none}}
/* o canto de baixo à direita é do WhatsApp flutuante: no largo, as 2 linhas deixam a vaga dele; no estreito, o rodapé ganha chão embaixo */
@media (min-width:1001px){.rodape__linha,.rodape__base{padding-right:clamp(56px,4.6vw,72px)}}
@media (max-width:1000px){.rodape{padding-bottom:84px}}
