*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;border-radius:0}
:root{
  --brand:#CEB37C; --brand-2:#9C7F4A; --brand-light:#F0E2C2;
  --ink:#0E0D0B; --ink-2:#1A1814; --ink-3:#25211B;
  --on:#F2EDE3; --on-mute:#BDB29F;
  --green:#1FA858; --green-light:#2BD46E; --green-deep:#148244;
  --display:'Sora',system-ui,sans-serif;
  --texto:'Inter',system-ui,-apple-system,sans-serif;
  --mark-band: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAB5CAYAAADyOOV3AAABYUlEQVR42u3UsRGAMBADQQ/99wwJTZy1Sr6AnftzznmPXbvnv5AvB7YBYBUr2OrAKh4oGLIXbXVgFQ8UDNmLtjqwihVsdWAVDxQM2Yu2OrCKFWx1YBUPFAzZi7Y6sIoHCobsRVsdWMUKtjqwigcKhuxFWx1YxQMFQ/airQ6sYgVbHVjFAwVD9qKtDqxiBVsdWMUDBUP2oq0OrOKBgiF70VYHVrGCrQ6s4oGCIXvRVgdWsYKtDqzigYIhe9FWB1bxQMGQvWirA6tYwVYHVvFAwZC9aKsDq3igYMhetNWBVaxgqwOreKBgyF601YFVrGCrA6t4oGDIXrTVgVU8UDBkLxqwigEbYBUDhgzYAKtYwXY1sIoHCobsRQNWMWDIgA2wigEbYBWvF/wCNsAqBgwZsAFWMWADPF2xgi9HBqxgFQM2wCoGDBmwAVYx4CVkwF60igEbYBUDhgzYAKsYsILtmoo/6IdLph7W1uEAAAAASUVORK5CYII=');
}
html{-webkit-text-size-adjust:100%}
body{
  min-height:100svh; font-family:var(--texto); color:var(--on);
  background:var(--ink); -webkit-font-smoothing:antialiased;
  display:flex; flex-direction:column; align-items:center;
  justify-content:center;
  padding:clamp(34px,5vh,50px) 18px calc(14px + env(safe-area-inset-bottom));
  position:relative; overflow-x:hidden;
}
.bg{position:fixed;inset:0;z-index:-2;overflow:hidden;background:var(--ink)}
.bg picture{display:contents}
.bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:52% 0%}
.bg__chapa{position:absolute;inset:0;background:linear-gradient(180deg,
  rgba(14,13,11,.36) 0%, rgba(14,13,11,.36) 12%, rgba(14,13,11,.56) 22%,
  rgba(14,13,11,.76) 30%, rgba(14,13,11,.82) 40%, rgba(14,13,11,.82) 52%,
  rgba(14,13,11,.84) 64%, rgba(14,13,11,.92) 80%, rgba(14,13,11,.97) 100%)}
.bg__metal{position:absolute;inset:0;
  -webkit-mask:linear-gradient(0deg,#000 0%,#000 40%,transparent 70%);
  mask:linear-gradient(0deg,#000 0%,#000 40%,transparent 70%);background:
  radial-gradient(62% 34% at 10% 92%, rgba(206,179,124,.22), transparent 66%),
  radial-gradient(70% 24% at 50% 100%, rgba(156,127,74,.30), transparent 70%)}
.bg__malha{position:absolute;left:0;right:0;bottom:0;height:50%;
  -webkit-mask:linear-gradient(0deg,#000 0%,#000 50%,transparent 96%);
  mask:linear-gradient(0deg,#000 0%,#000 50%,transparent 96%)}
.bg__malha i{position:absolute;inset:0;display:block;opacity:.016;
  background:var(--brand-light);
  -webkit-mask:var(--mark-band) left top/32px repeat;mask:var(--mark-band) left top/32px repeat}
.bg__topo{position:absolute;inset:0;background:
  radial-gradient(60% 18% at 50% 14%, rgba(14,13,11,.45), transparent 74%)}
.fio{position:fixed;top:0;left:0;right:0;height:3px;z-index:3;
  background:linear-gradient(90deg,transparent,var(--brand-2) 18%,var(--brand-light) 50%,var(--brand) 82%,transparent)}
.wrap{width:100%;max-width:440px;display:flex;flex-direction:column;align-items:center}
.marca{display:flex;flex-direction:column;align-items:center;gap:12px;margin-bottom:22px}
.simbolo{width:clamp(48px,12.5vw,58px);position:relative;--mk:url('../img/simbolo-branco.png');
  filter:drop-shadow(0 6px 22px rgba(0,0,0,.65))}
.simbolo img,.letreiro img{height:auto}
.simbolo img{width:100%;display:block}
.simbolo__rev{animation:varredura 1.05s cubic-bezier(.4,0,.15,1) .12s both}
@keyframes varredura{
  from{clip-path:polygon(-60% 188%, 160% 122%, 160% 250%, -60% 250%)}
  to  {clip-path:polygon(-60% -6%, 160% -76%, 160% 250%, -60% 250%)}
}
.simbolo__luz{position:absolute;inset:0;pointer-events:none;
  -webkit-mask:var(--mk) center/contain no-repeat;mask:var(--mk) center/contain no-repeat;
  background-image:linear-gradient(104deg,transparent 38%,rgba(206,179,124,.95) 50%,transparent 62%);
  background-repeat:no-repeat;background-size:260% 100%;
  animation:luz 1.15s cubic-bezier(.35,0,.2,1) .95s both}
@keyframes luz{from{background-position:-180% 0}to{background-position:280% 0}}
.letreiro{width:clamp(180px,50vw,210px);animation:sobe .7s cubic-bezier(.2,.7,.2,1) .82s both}
.letreiro img{width:100%;display:block;filter:drop-shadow(0 2px 14px rgba(0,0,0,.75))}
@keyframes sobe{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.nums{width:100%;display:flex;justify-content:center;margin:0 0 16px;
  animation:sobe .7s cubic-bezier(.2,.7,.2,1) .46s both}
.num{text-align:center}
.num b{display:block;font-family:var(--display);font-weight:700;font-size:clamp(32px,9.4vw,40px);
  line-height:1;letter-spacing:-.02em;color:var(--brand);
  text-shadow:0 2px 18px rgba(0,0,0,.8)}
.num b small{font-size:.5em;font-weight:600;margin-left:.18em;letter-spacing:0}
.num span{display:block;margin-top:6px;font-size:12.5px;line-height:1.35;color:#fff;
  text-shadow:0 1px 10px rgba(0,0,0,.9)}
.ganho{position:relative;isolation:isolate;text-align:center;font-family:var(--texto);font-weight:400;
  font-size:clamp(15.4px,4.2vw,16.5px);line-height:1.52;
  color:#fff;width:calc(100% + 20px);max-width:none;margin:0 -10px 26px;
  text-wrap:balance;text-shadow:0 2px 14px rgba(0,0,0,.9),0 0 3px rgba(0,0,0,.6);
  animation:sobe .7s cubic-bezier(.2,.7,.2,1) .96s both}
.bloco{position:relative;isolation:isolate;width:100%;display:flex;flex-direction:column;
  align-items:center;margin-bottom:26px}
.bloco .ganho{margin-bottom:0}
.ganho b{font-weight:600;color:#fff}
.links{width:100%;display:flex;flex-direction:column;gap:12px}
.btn{
  position:relative;display:flex;align-items:center;gap:11px;
  padding:14px 15px;font-family:var(--display);font-weight:600;font-size:13.6px;line-height:1.28;
  text-decoration:none;transition:transform .2s cubic-bezier(.2,.7,.2,1),filter .25s;
  opacity:0;animation:entra .5s cubic-bezier(.2,.7,.2,1) both;
}
@keyframes entra{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.btn:nth-child(1){animation-delay:.10s}
.btn:nth-child(2){animation-delay:.22s}
.btn:nth-child(3){animation-delay:.34s}
.btn:active{transform:translateY(1px)}
@media (hover:hover){.btn:hover{transform:translateY(-2px);filter:brightness(1.06)}}
.btn:focus-visible{outline:2px solid var(--brand-light);outline-offset:3px}
.btn__ic{flex:0 0 auto;width:26px;height:26px;display:grid;place-items:center}
.btn__ic svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round}
.btn__tx{flex:1 1 auto}
.btn__seta{flex:0 0 auto;width:19px;height:19px;opacity:.62;transition:transform .2s}
@media (hover:hover){.btn:hover .btn__seta{transform:translateX(3px)}}
.btn--obra{background-image:linear-gradient(100deg,var(--brand-2) 0%,var(--brand) 26%,
  var(--brand-light) 50%,var(--brand) 74%,var(--brand-2) 100%);color:var(--ink);
  box-shadow:0 14px 34px -16px rgba(206,179,124,.60)}
.btn--zap{background-image:linear-gradient(115deg,var(--green-light) 0%,var(--green) 55%,var(--green-deep) 100%);
  color:#fff;box-shadow:0 14px 34px rgba(31,168,88,.26)}
.btn--zap .btn__ic svg{stroke:none;fill:currentColor}
.pe{margin-top:22px;display:flex;flex-direction:column;align-items:center;gap:10px;
  animation:sobe .7s cubic-bezier(.2,.7,.2,1) .58s both}
.locais{display:flex;flex-wrap:wrap;justify-content:center;gap:7px 14px}
.local{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--on-mute);
  text-shadow:0 1px 10px rgba(6,5,4,.85)}
.local svg{width:12px;height:12px;fill:none;stroke:var(--brand);stroke-width:1.8;flex:0 0 auto}
.dev{display:flex;align-items:center;gap:9px;font-size:11.5px;color:rgba(189,178,159,.62)}
.dev a{color:var(--brand);font-weight:700;letter-spacing:.06em;text-decoration:none;
  transition:color .25s}
@media (hover:hover){.dev a:hover{color:var(--brand-light)}}
@media (min-width:720px){
  .bg img{object-position:50% 50%}
  .bg__topo{background:linear-gradient(90deg,rgba(14,13,11,0) 18%,rgba(14,13,11,.62) 34%,
    rgba(14,13,11,.74) 50%,rgba(14,13,11,.62) 66%,rgba(14,13,11,0) 82%)}
  .bg__chapa{background:linear-gradient(180deg,
    rgba(14,13,11,.40) 0%, rgba(14,13,11,.30) 26%, rgba(14,13,11,.36) 44%,
    rgba(14,13,11,.62) 60%, rgba(14,13,11,.86) 76%, rgba(14,13,11,.95) 90%, rgba(14,13,11,.97) 100%)}
  .btn{font-size:14.5px}
}
@media (max-height:740px){
  .bg__chapa{background:linear-gradient(180deg,
    rgba(14,13,11,.36) 0%, rgba(14,13,11,.40) 8%, rgba(14,13,11,.66) 15%,
    rgba(14,13,11,.80) 22%, rgba(14,13,11,.84) 34%, rgba(14,13,11,.84) 56%,
    rgba(14,13,11,.90) 76%, rgba(14,13,11,.97) 100%)}
  body{padding-top:20px}
  .marca{gap:8px;margin-bottom:14px}
  .simbolo{width:40px}
  .letreiro{width:164px}
  .num b{font-size:30px}
  .nums{margin-bottom:12px}
  .ganho{font-size:14.6px;margin-bottom:18px}
  .links{gap:8px}
  .btn{padding:12px 14px}
  .pe{margin-top:14px;gap:8px}
  .locais{gap:5px 12px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-delay:0s !important}
  .simbolo__rev{clip-path:none}
  .simbolo__luz{display:none}
}
