/* CurtaEdit · base comum da página de vendas e da área de membros.
   A cara da Curta: chão preto com grade fina e brilho vermelho em cima, cartão escuro com
   filete e sem sombra, título na Archivo bem pesada, rótulo na JetBrains Mono. */

@font-face{font-family:'Archivo';font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url(../fontes/archivo.woff2) format('woff2')}
@font-face{font-family:'Inter';font-weight:100 900;font-display:swap;src:url(../fontes/inter.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-weight:100 800;font-display:swap;src:url(../fontes/jetbrains-mono.woff2) format('woff2')}

:root{
  --chao:#07060a; --sup:#120f15; --sup2:#1b161f; --linha:#2e2530;
  --tx:#f7f3f5; --tx2:#a69ca8; --tx3:#6f6571;
  --verm:#ff2d4b; --verm2:#ff8a9b; --verm-fundo:rgba(255,45,75,.12); --ok:#3ee58a;
  --brilho:0 0 44px rgba(255,45,75,.45);
  --ft:'Archivo',system-ui,sans-serif; --fx:'Inter',system-ui,sans-serif; --fm:'JetBrains Mono',ui-monospace,monospace;
  --raio:14px; --raio-s:8px; --larg:1180px; --lado:clamp(16px,4vw,32px);
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;background:var(--chao);color:var(--tx);font:400 17px/1.6 var(--fx);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;font-synthesis:none}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(90% 45% at 75% -5%,rgba(255,45,75,.20),transparent 62%),
    linear-gradient(rgba(247,243,245,.035) 1px,transparent 1px) 0 0/32px 32px,
    linear-gradient(90deg,rgba(247,243,245,.035) 1px,transparent 1px) 0 0/32px 32px}
img,video{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
::selection{background:var(--verm);color:#fff}
:focus-visible{outline:2px solid var(--verm2);outline-offset:3px;border-radius:4px}

.embrulho{width:min(var(--larg),100% - 2*var(--lado));margin-inline:auto}

/* títulos: caixa alta, pesados, o vermelho acende */
h1,h2,h3{font-family:var(--ft);font-weight:900;text-transform:uppercase;letter-spacing:-.02em;line-height:.95;margin:0}
h1 em,h2 em,h3 em{font-style:normal;color:var(--verm);text-shadow:0 0 28px rgba(255,45,75,.4)}
h2{font-size:clamp(2.1rem,6vw,3.9rem)}
h3{font-size:1.25rem;line-height:1.05}
p{margin:0}

/* selo em pílula, com o ponto vermelho aceso */
.selo{display:inline-flex;align-items:center;gap:.6em;padding:.5em .95em .46em;border:1px solid var(--linha);
  border-radius:999px;background:rgba(18,15,21,.85);color:var(--verm2);
  font:600 .72rem/1 var(--fm);letter-spacing:.12em;text-transform:uppercase}
.selo::before{content:'';width:.55em;height:.55em;border-radius:50%;background:var(--verm);box-shadow:0 0 .8em var(--verm);
  animation:pisca 2.4s ease-in-out infinite}
@keyframes pisca{50%{opacity:.35}}

.rotulo{font:600 .72rem/1.2 var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--tx2)}

/* o botão é o bloco: vermelho, brilhando */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.7em;border:0;border-radius:var(--raio);
  background:var(--verm);color:#fff;text-decoration:none;font:800 1rem/1 var(--ft);text-transform:uppercase;letter-spacing:.02em;
  padding:1.05em 1.5em;box-shadow:var(--brilho);transition:transform .18s,box-shadow .18s,background .18s}
.btn:hover{transform:translateY(-2px);box-shadow:0 0 64px rgba(255,45,75,.6)}
.btn:active{transform:translateY(0)}
.btn-fantasma{background:transparent;border:1px solid var(--linha);box-shadow:none;color:var(--tx)}
.btn-fantasma:hover{border-color:var(--verm);box-shadow:none;background:var(--verm-fundo)}

/* cartão: chapado, só o filete */
.cartao{background:var(--sup);border:1px solid var(--linha);border-radius:var(--raio)}

/* a logo em texto */
.logo{display:inline-flex;align-items:center;gap:.5em;text-decoration:none;font:900 1.05rem/1 var(--ft);letter-spacing:-.01em}
.logo i{width:.55em;height:.55em;border-radius:50%;background:var(--verm);box-shadow:0 0 .9em var(--verm)}
.logo b{color:var(--verm);font-weight:900}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
