@layer reset, base, forma, comp, mov, estado;

@property --foco{syntax:"<number>";inherits:true;initial-value:0}

@property --r{syntax:"<length>";inherits:true;initial-value:0px}

@property --simb-u{syntax:"<number>";inherits:true;initial-value:0}
@property --simb-d{syntax:"<number>";inherits:true;initial-value:0}
@property --simb-u{syntax:"<number>";inherits:true;initial-value:0}
@property --simb-d{syntax:"<number>";inherits:true;initial-value:0}

@property --toca{syntax:"running | paused";inherits:true;initial-value:paused}

@layer reset{
  *,*::before,*::after{box-sizing:border-box}
  *{margin:0}
  html{-webkit-text-size-adjust:100%}
  img,svg{display:block;max-width:100%}
  ul,ol{list-style:none;padding:0}
  table{border-collapse:collapse;width:100%}
  a{color:inherit}
  s{text-decoration:none}
}

@layer base{
  :root{

    --noite:#000000;
    --noite-2:#0C0C0C;
    --vinho:#180603;
    --vermelho:#E62200;
    --sinal:#FF4322;
    --trigo:#FF4322;
    --creme:#F6F6F6;
    --aro-foco:#000000;

    --tinta:var(--creme);
    --tinta-2:color-mix(in oklch,var(--creme) 80%,var(--noite));
    --tinta-3:color-mix(in oklch,var(--creme) 68%,var(--noite));
    --tinta-hud:color-mix(in oklch,var(--creme) 86%,var(--noite));
    --linha:color-mix(in oklch,var(--trigo) 18%,transparent);
    --linha-forte:color-mix(in oklch,var(--trigo) 34%,transparent);

    --display:"Newsreader",Georgia,"Times New Roman",serif;
    --corpo:"Barlow",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    --hud:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;

    --larg:1240px;
    --recuo:clamp(20px,5vw,64px);
    --topo:62px;
    --passo:clamp(72px,11vh,140px);

    --saida:cubic-bezier(.23,1,.32,1);
    --entra-sai:cubic-bezier(.77,0,.175,1);

    --ease-out:    cubic-bezier(0.23, 1, 0.32, 1);
    --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
    --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
    --t-toque: 130ms;
    --t-perto: 180ms;
    --t-bloco: 240ms;
    --t-cena:  300ms;
    --mola: linear(0, .0705, .2269, .4092, .5820, .7277, .8404, .9209,
                   .9741, 1.0058, 1.0220, 1.0278, 1.0274, 1.0237,
                   1.0186, 1.0136, 1.0092, 1.0056, 1.0030);
    --t-mola: 430ms;

    --t-gesto:   620ms;
    --t-marca:   960ms;
    --t-vinheta: 2600ms;

    timeline-scope:--k1,--k2,--k3,--k4,--k5,--k6;
    color-scheme:dark;
    accent-color:var(--vermelho);
    caret-color:var(--vermelho);
    scrollbar-color:var(--vinho) var(--noite);
  }
  ::selection{background:var(--vermelho);color:var(--creme)}
  a{text-underline-offset:.18em;text-decoration-thickness:1px}

  html{scroll-behavior:smooth;overflow-x:clip}
  body{
    margin:0;
    background:var(--noite);
    color:var(--tinta);
    font:400 clamp(1rem,.96rem + .18vw,1.08rem)/1.62 var(--corpo);
    overflow-x:clip;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
  }

  .d1,.d2,.d3{font-family:var(--display);font-weight:300;letter-spacing:-.02em;text-wrap:balance}
  .d1{font-size:clamp(2.5rem,1.5rem + 4.4vw,4.6rem);line-height:1.02}
  .d2{font-size:clamp(1.9rem,1.25rem + 2.9vw,3.3rem);line-height:1.08}
  .d3{font-size:clamp(1.35rem,1.1rem + 1.2vw,1.95rem);line-height:1.16}
  .d1 span,.d2 span,.d3 span{font-style:italic;color:var(--trigo)}
  .lead{max-width:52ch;color:var(--tinta-2);font-size:clamp(1rem,.97rem + .3vw,1.16rem);text-wrap:pretty}
  p{text-wrap:pretty}
}

@layer forma{
  .env{width:min(100% - var(--recuo)*2,var(--larg));margin-inline:auto}

  .topo{
    position:fixed;inset:0 0 auto;z-index:60;height:var(--topo);
    display:flex;align-items:center;gap:clamp(14px,3vw,40px);
    padding-inline:var(--recuo);

    background:color-mix(in oklch,var(--noite) 96%,transparent);
    border-bottom:1px solid var(--linha);
  }
  .marca{display:flex;align-items:center;gap:12px;text-decoration:none;flex:0 0 auto}
  .marca img{height:26px;width:auto}
  .marca i{font-family:var(--display);font-style:italic;font-size:.9rem;color:var(--tinta-3);white-space:nowrap}
  .capitulos{display:flex;gap:clamp(10px,1.5vw,22px);margin-inline:auto;font:400 .78rem/1 var(--corpo)}
  .capitulos a{display:flex;align-items:center;gap:6px;text-decoration:none;white-space:nowrap;color:var(--tinta-3)}
  .bt-zap{flex:0 0 auto;margin-left:auto}
  .capitulos + .bt-zap{margin-left:0}

  .ambiente{position:fixed;inset:0;z-index:0;pointer-events:none}
  .ambiente span{position:absolute;inset:0;display:block}

  .amb-vitrine{background:
    radial-gradient(140% 92% at 50% -14%,color-mix(in oklch,var(--trigo) 24%,transparent),transparent 64%),
    radial-gradient(100% 70% at 86% 4%,color-mix(in oklch,var(--vinho) 80%,transparent),transparent 64%),
    radial-gradient(96% 64% at 6% 30%,color-mix(in oklch,var(--vinho) 86%,transparent),transparent 68%),
    linear-gradient(180deg,color-mix(in oklch,var(--vinho) 40%,transparent),transparent 52%)}
  .amb-foco{opacity:calc(var(--foco));background:
    radial-gradient(90% 62% at 50% 112%,color-mix(in oklch,var(--vermelho) 42%,transparent),transparent 66%),
    radial-gradient(60% 44% at 84% 92%,color-mix(in oklch,var(--trigo) 16%,transparent),transparent 62%)}

  main{position:relative;z-index:1}
  .cena{position:relative}
  .c-loja{min-height:100svh;padding:calc(var(--topo) + clamp(56px,9vh,110px)) 0 var(--passo)}

  .c-armacoes,.c-atende{padding:var(--passo) 0;min-height:100svh;display:grid;align-content:center}
  .c-casa{padding:var(--passo) 0 clamp(60px,9vh,110px)}

  .palco{width:min(100% - var(--recuo)*2,var(--larg));margin-inline:auto;
    display:grid;gap:clamp(30px,5vw,68px);align-items:center;
    grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)}
  .palco .poco{order:2}
  .palco .dito{order:1}
  .poco-loja{width:100%;max-width:440px;justify-self:center}
  .palco-2{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);align-items:start}
  .palco-2 .dito{order:1}
  .palco-2 .galeria{order:2}

  .dito-fixo{position:sticky;top:calc(var(--topo) + 12vh);align-self:start}

  .dito{display:grid;gap:clamp(16px,2.4vh,26px);justify-items:start}
  .acoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
  .nota{max-width:46ch;font-size:.9rem;color:var(--tinta-3);padding-top:14px;border-top:1px solid var(--linha)}

  .ficha{display:grid;gap:12px;width:100%;max-width:46ch}
  .ficha li{display:grid;grid-template-columns:minmax(0,9.5rem) minmax(0,1fr);gap:4px 18px;
    padding-top:12px;border-top:1px solid var(--linha)}
  .ficha b{font:600 .72rem/1.4 var(--hud);letter-spacing:.14em;text-transform:uppercase;color:var(--sinal)}
  .ficha span{color:var(--tinta-2);font-size:.98rem}

  .numeros{display:flex;flex-wrap:wrap;gap:clamp(20px,3.4vw,44px)}
  .numeros li{display:grid;gap:2px}
  .numeros b{font-family:var(--display);font-weight:300;font-size:clamp(2.1rem,1.4rem + 2.4vw,3rem);line-height:1;color:var(--trigo)}
  .numeros span{font:400 .8rem/1.3 var(--hud);letter-spacing:.08em;color:var(--tinta-3);max-width:15ch}

  .galeria{display:grid;gap:clamp(14px,1.8vw,22px)}
  .galeria figure{position:relative;overflow:hidden;border:1px solid var(--linha);
    box-shadow:0 26px 50px -30px rgba(0,0,0,.85)}

  .galeria img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}

  .poco{position:relative;isolation:isolate}
  .poco::before{content:"";position:absolute;inset:-14% -8%;z-index:-1;
    background:radial-gradient(60% 56% at 50% 50%,color-mix(in oklch,var(--trigo) 18%,transparent),transparent 70%);
    filter:blur(26px)}
  .poco img{width:100%;height:auto;
    -webkit-mask-image:
      linear-gradient(to right,transparent 0,#000 11%,#000 89%,transparent 100%),
      linear-gradient(to bottom,transparent 0,#000 8%,#000 88%,transparent 100%);
    mask-image:
      linear-gradient(to right,transparent 0,#000 11%,#000 89%,transparent 100%),
      linear-gradient(to bottom,transparent 0,#000 8%,#000 88%,transparent 100%);
    -webkit-mask-composite:source-in;mask-composite:intersect}
  .poco-alto img{aspect-ratio:4/3;object-fit:cover}

  .citacao{display:grid;gap:8px;padding-left:18px;border-left:1px solid var(--linha-forte);max-width:46ch}
  .citacao p{font-family:var(--display);font-weight:300;font-size:clamp(1.05rem,1rem + .5vw,1.3rem);line-height:1.34}

  .palco-2 .recursos{order:2}
  .recursos{display:grid;gap:clamp(12px,1.6vw,18px)}
  .recursos li{display:grid;gap:8px;align-content:start;
    padding:clamp(20px,2.4vw,28px) clamp(20px,2.6vw,30px);
    border:1px solid var(--linha);
    background:color-mix(in oklch,var(--noite-2) 72%,transparent);
    box-shadow:0 26px 50px -30px rgba(0,0,0,.85)}
  .recursos li::before{content:"";width:28px;height:3px;background:var(--vermelho);margin-bottom:8px}
  .recursos b{font-family:var(--display);font-weight:400;font-size:clamp(1.3rem,1.1rem + .8vw,1.7rem);line-height:1.15;color:var(--tinta)}
  .recursos span{color:var(--tinta-2);font-size:.98rem;max-width:48ch}

  .chapa::before{content:"";flex:none;width:7px;height:7px;border-radius:2px;background:var(--sinal)}

  .capa-linhas{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
  .capa-linhas .cl{fill:none;stroke-width:1.7;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
  .capa-linhas .cl-1{stroke:var(--sinal)}
  .capa-linhas .cl-2{stroke:color-mix(in oklch,var(--creme) 60%,transparent)}

  .capa-linhas .cl-3{stroke:color-mix(in oklch,var(--creme) 30%,transparent);stroke-width:1.2}
  .poco-loja img{position:relative;mix-blend-mode:lighten}

  .palco-pilha{grid-template-columns:minmax(0,1fr);gap:clamp(40px,7vh,72px)}

  .palco-pilha .pilha{order:2}
  .pilha-cab{grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);column-gap:clamp(30px,5vw,68px);align-items:end;justify-items:stretch}
  .pc-titulo,.pc-texto{display:grid;gap:clamp(14px,2.2vh,24px);justify-items:start;align-content:end}
  .pilha{display:grid;--alto:clamp(400px,calc(100svh - var(--topo) - 140px),540px)}
  .carta{position:sticky;top:calc(var(--topo) + 26px + var(--i,0) * 16px);height:var(--alto);margin-bottom:18vh}
  .carta:last-child{margin-bottom:0}
  .carta:nth-child(2){--i:1}
  .carta:nth-child(3){--i:2}
  .carta:nth-child(4){--i:3}
  .carta:nth-child(5){--i:4}
  .carta:nth-child(6){--i:5}
  .carta-in{position:relative;height:100%;display:grid;grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr);gap:clamp(16px,2vw,26px);
    padding:clamp(14px,1.5vw,20px);border-radius:28px;background:var(--noite-2);border:1px solid var(--linha);color:var(--tinta);
    transform-origin:50% 0;box-shadow:0 -28px 60px -34px rgba(0,0,0,.95)}
  .carta-so .carta-in{grid-template-columns:minmax(0,1fr)}
  .carta-txt{display:flex;flex-direction:column;justify-content:flex-start;gap:18px;
    padding:clamp(16px,2.4vw,34px) clamp(8px,1vw,14px) clamp(16px,2vw,24px) clamp(14px,2vw,26px)}
  .carta-txt b{font-family:var(--display);font-weight:400;font-size:clamp(1.7rem,1.1rem + 1.9vw,2.7rem);line-height:1.06;letter-spacing:-.02em;text-wrap:balance}
  .carta-txt span{max-width:30ch;font-size:clamp(1.02rem,.96rem + .32vw,1.2rem);line-height:1.5;color:var(--tinta-2)}

  .carta:nth-child(3n+1) .carta-in{background:var(--sinal);border-color:transparent;color:var(--noite)}
  .carta:nth-child(3n+1) .carta-txt span{color:var(--noite)}
  .carta:nth-child(3n) .carta-in{background:var(--creme);border-color:transparent;color:var(--noite)}
  .carta:nth-child(3n) .carta-txt span{color:color-mix(in oklch,var(--noite) 80%,var(--creme))}

  .carta-arte{position:relative;min-height:0;border-radius:20px;overflow:hidden;background-color:var(--noite);
    background-image:linear-gradient(color-mix(in oklch,var(--creme) 6%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in oklch,var(--creme) 6%,transparent) 1px,transparent 1px);
    background-size:32px 32px;background-position:-1px -1px;border:1px solid color-mix(in oklch,var(--creme) 9%,transparent)}
  .arte{position:absolute;inset:0;width:100%;height:100%}

  .arte *{transform-box:fill-box;transform-origin:50% 50%}
  .arte .a-fio{fill:none;stroke:color-mix(in oklch,var(--creme) 24%,transparent);stroke-width:2}
  .arte .a-clara{fill:none;stroke:var(--creme);stroke-width:3;stroke-linecap:round}
  .arte .a-grade{fill:none;stroke:color-mix(in oklch,var(--creme) 10%,transparent);stroke-width:1.5;stroke-dasharray:4 8}
  .arte .a-rotulo{font:700 15px/1 var(--hud);letter-spacing:.06em;fill:color-mix(in oklch,var(--creme) 62%,transparent);text-anchor:middle}
  .arte .a-arco{fill:none;stroke:var(--sinal);stroke-width:7;stroke-linecap:round}
  .arte .a-mao{stroke:var(--creme);stroke-width:5;stroke-linecap:round}
  .arte .a-ponteiro{transform-box:view-box;transform-origin:300px 200px}
  .arte :is(.a-cubo,.a-ponto,.a-centro,.a-pino){fill:var(--sinal)}
  .arte .a-onda{fill:none;stroke:var(--sinal);stroke-width:2;opacity:0}
  .arte .a-miniatura{fill:color-mix(in oklch,var(--creme) 12%,transparent)}
  .arte .a-barra{fill:color-mix(in oklch,var(--creme) 30%,transparent)}
  .arte .a-barra-2{fill:color-mix(in oklch,var(--creme) 15%,transparent)}
  .arte .a-mais circle{fill:var(--sinal);stroke:var(--sinal);stroke-width:2}
  .arte .a-mais path{fill:none;stroke:var(--noite);stroke-width:3;stroke-linecap:round}
  .arte .a-trilha{fill:color-mix(in oklch,var(--creme) 12%,transparent)}
  .arte .a-enche{fill:var(--sinal);transform-origin:0 50%}
  .arte .a-no{fill:var(--noite);stroke:color-mix(in oklch,var(--creme) 60%,transparent);stroke-width:2}
  .arte .a-brilho{fill:var(--creme)}
  .arte .a-pulso{fill:none;stroke:var(--sinal);stroke-width:5;stroke-linecap:round;stroke-dasharray:7 93;stroke-dashoffset:-50}
  .arte .a-tracejado{fill:none;stroke:color-mix(in oklch,var(--creme) 28%,transparent);stroke-width:3;stroke-dasharray:2 10;stroke-linecap:round}
  .arte .a-percurso{fill:none;stroke:var(--sinal);stroke-width:5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
  .arte .a-veiculo{fill:none;stroke:var(--creme);stroke-width:16;stroke-linecap:round;stroke-dasharray:.003 .997;stroke-dashoffset:-.996}
  .arte .a-etapa{fill:var(--sinal);stroke:var(--sinal);stroke-width:3}
  .arte .a-pino-olho{fill:var(--noite)}
  .arte .a-coluna{fill:color-mix(in oklch,var(--creme) 22%,transparent);transform-origin:50% 100%}
  .arte .a-coluna.a-coluna-viva{fill:var(--sinal)}
  .arte .a-tendencia{fill:none;stroke:var(--creme);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}

  .c-foco{height:280vh;padding:0}
  .foco-palco{position:sticky;top:0;height:100svh;overflow:hidden;
    display:grid;place-items:center;isolation:isolate}

  .fantasma{position:absolute;inset:0;z-index:0;display:grid;place-items:end center;
    padding:0 var(--recuo) clamp(34px,6vh,72px) clamp(200px,24vw,380px);
    font:600 clamp(2.2rem,8vw,6.2rem)/1 var(--corpo);letter-spacing:.02em;
    color:transparent;-webkit-text-stroke:1px color-mix(in oklch,var(--trigo) 22%,transparent);
    white-space:nowrap;pointer-events:none}

  .poco-foco{position:relative;z-index:1;width:min(56vw,740px);margin-left:auto;margin-right:clamp(0px,4vw,70px);
    container-type:inline-size;
    -webkit-mask-image:
      linear-gradient(to right,transparent 0,#000 8%,#000 92%,transparent 100%),
      linear-gradient(to bottom,transparent 0,#000 8%,#000 92%,transparent 100%);
    mask-image:
      linear-gradient(to right,transparent 0,#000 8%,#000 92%,transparent 100%),
      linear-gradient(to bottom,transparent 0,#000 8%,#000 92%,transparent 100%);
    -webkit-mask-composite:source-in;mask-composite:intersect}

  .lp{position:relative;--r:0px}
  .lp img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}

  .borrada{filter:blur(11px) brightness(.45) saturate(.8);scale:1.05}

  .nitida{position:absolute;inset:0;height:100%;
    -webkit-mask-image:radial-gradient(circle var(--r) at 50% 50%,#000 56%,transparent 100%);
    mask-image:radial-gradient(circle var(--r) at 50% 50%,#000 56%,transparent 100%)}

  .specs{position:absolute;left:var(--recuo);top:0;bottom:0;margin-block:auto;height:fit-content;z-index:2;
    display:grid;gap:13px;width:min(30vw,300px)}
  .specs dl{display:grid;gap:9px}
  .specs dl div{display:grid;gap:2px;padding-top:9px;border-top:1px solid var(--linha)}
  .specs dt{font:600 .64rem/1.3 var(--hud);letter-spacing:.16em;text-transform:uppercase;color:var(--sinal)}
  .specs dd{margin:0;font-size:.92rem;color:var(--tinta-2)}

  .grande{font-family:var(--display);font-weight:300;font-size:min(clamp(2.6rem,5.4vw,4.4rem),9vh);line-height:.92;color:var(--trigo)}
  .grande span{font-style:italic}

  .foco-frase{position:absolute;inset:0;z-index:3;display:grid;place-items:center;
    padding-inline:var(--recuo);text-align:center;pointer-events:none;opacity:0}
  .foco-frase p{max-width:22ch;text-wrap:balance;text-shadow:0 2px 18px rgba(0,0,0,.6)}

  .c-comanda{min-height:100svh;display:grid;align-content:center;padding:var(--passo) 0}
  .comanda-palco{width:min(100% - var(--recuo)*2,var(--larg));margin-inline:auto;
    display:grid;gap:clamp(30px,5vw,68px);align-items:center;
    grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)}
  .comanda-dito{display:grid;gap:clamp(16px,2.4vh,26px);justify-items:start}
  .impressora{position:relative;justify-self:center;width:min(100%,420px);padding-bottom:24px}

  .saida{position:relative;overflow:clip;padding:22px 14px 0}
  .papel{position:relative;padding:30px 26px 28px;
    background:linear-gradient(180deg,color-mix(in oklch,var(--creme) 97%,var(--trigo)),color-mix(in oklch,var(--creme) 92%,var(--trigo)));
    color:var(--noite);font:400 .86rem/1.5 var(--hud);letter-spacing:.02em;
    box-shadow:0 26px 50px -22px rgba(0,0,0,.8);

    -webkit-mask:linear-gradient(#000,#000) 0 9px/100% calc(100% - 9px) no-repeat,
      conic-gradient(from 135deg at 50% 0,#000 90deg,transparent 0) 0 0/14px 9px repeat-x;
    mask:linear-gradient(#000,#000) 0 9px/100% calc(100% - 9px) no-repeat,
      conic-gradient(from 135deg at 50% 0,#000 90deg,transparent 0) 0 0/14px 9px repeat-x}
  .cp-cab{display:grid;gap:5px;justify-items:center;text-align:center;padding-bottom:14px;margin-bottom:14px;
    border-bottom:1px dashed color-mix(in oklch,var(--noite) 45%,transparent)}
  .cp-cab b{font-weight:700;letter-spacing:.14em;font-size:.86rem}

  .cp-cab span{font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:color-mix(in oklch,var(--noite) 88%,transparent)}
  .cp-itens{display:grid;gap:9px;padding-bottom:16px;margin-bottom:20px;
    border-bottom:1px dashed color-mix(in oklch,var(--noite) 45%,transparent)}
  .cp-itens li{display:flex;align-items:baseline;gap:8px}
  .cp-itens span{font-weight:700;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}
  .cp-itens i{flex:1 1 auto;min-width:10px;border-bottom:2px dotted color-mix(in oklch,var(--noite) 36%,transparent);translate:0 -4px}
  .cp-itens b{font-weight:400;white-space:nowrap;color:var(--noite)}

  .cp-selo{--tinta-carimbo:color-mix(in srgb,var(--vermelho) 50%,#000);
    display:grid;gap:3px;justify-items:center;width:max-content;max-width:100%;margin-inline:auto;padding:10px 18px;
    border:2px solid var(--tinta-carimbo);outline:1px solid var(--tinta-carimbo);outline-offset:3px;rotate:-2deg;color:var(--tinta-carimbo)}
  .cp-selo b{font:700 .8rem/1 var(--hud);letter-spacing:.12em;text-transform:uppercase}
  .cp-selo em{font-family:var(--display);font-style:italic;font-size:1.24rem;line-height:1.1}

  .boca{position:absolute;left:0;right:0;bottom:0;height:24px;border-radius:7px;
    background:linear-gradient(180deg,color-mix(in oklch,var(--noite) 55%,#000),color-mix(in oklch,var(--creme) 9%,var(--noite)));
    box-shadow:inset 0 3px 2px rgba(0,0,0,.65),0 1px 0 var(--linha-forte)}

  .c-casa .env{display:grid;gap:var(--passo)}
  .prova{display:grid;gap:clamp(22px,3.4vw,40px);grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .nota-grande{grid-column:1/-1;display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;
    padding-bottom:clamp(18px,3vh,30px);border-bottom:1px solid var(--linha)}
  .nota-grande b{font-family:var(--display);font-weight:300;font-size:clamp(3.4rem,8vw,6rem);line-height:.86;color:var(--trigo)}
  .nota-grande span{max-width:38ch;color:var(--tinta-2);font-size:.98rem}
  blockquote{display:grid;gap:10px;padding-left:20px;border-left:1px solid var(--linha-forte)}
  blockquote p{font-family:var(--display);font-weight:300;font-size:clamp(1.1rem,1rem + .7vw,1.4rem);line-height:1.34}
  cite{font:400 .72rem/1.4 var(--hud);letter-spacing:.1em;font-style:normal;color:var(--tinta-3)}

  .bloco-honesto{display:grid;gap:clamp(18px,3vh,28px)}
  .bloco-honesto ul{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}
  .bloco-honesto li{padding-top:14px;border-top:1px solid var(--linha);color:var(--tinta-2);font-size:.96rem}
  .bloco-honesto b{color:var(--tinta);font-weight:600}

  .dupla{display:grid;gap:clamp(30px,5vw,64px);grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
  .onde,.quando{display:grid;gap:18px;align-content:start}
  .onde dl{display:grid;gap:12px}
  .onde dl div{display:grid;gap:2px;padding-top:11px;border-top:1px solid var(--linha)}
  .onde dt{font:600 .64rem/1.3 var(--hud);letter-spacing:.16em;text-transform:uppercase;color:var(--sinal)}
  .onde dd{margin:0;color:var(--tinta-2)}
  .quando th{text-align:left;font-weight:400;color:var(--tinta-2)}
  .quando td{text-align:right;font-variant-numeric:tabular-nums;color:var(--tinta)}
  .quando th,.quando td{padding:10px 0;border-bottom:1px solid var(--linha);font-size:.95rem}

  .fecho{display:grid;gap:24px;justify-items:center;text-align:center;padding-top:clamp(20px,4vh,40px)}

  .rodape{position:relative;z-index:1;padding:clamp(40px,7vh,80px) 0 calc(clamp(40px,7vh,80px) + 70px);
    border-top:1px solid var(--linha);background:var(--noite-2)}
  .rodape .env{display:grid;gap:10px}
  .rod-marca{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
  .rod-marca img{height:30px;width:auto}
  .rod-marca span{font-family:var(--display);font-style:italic;color:var(--tinta-2)}
  .rodape p{color:var(--tinta-3);font-size:.88rem}
  .rod-links a{color:var(--tinta-2)}
  .rod-aviso{max-width:76ch;font-size:.79rem;color:color-mix(in oklch,var(--creme) 50%,var(--noite))}
}

@layer comp{
  .bt{display:inline-flex;align-items:center;gap:9px;text-decoration:none;
    padding:13px 22px;font:600 .84rem/1 var(--corpo);letter-spacing:.02em;
    border:1px solid var(--linha-forte);color:var(--tinta);
    transition:transform var(--t-toque) var(--ease-out),background-color var(--t-toque) var(--ease-out),
      border-color var(--t-toque) var(--ease-out),color var(--t-toque) var(--ease-out)}
  .bt:active{transform:scale(.97)}

  .bt-cheio{background:var(--vermelho);border-color:var(--vermelho);color:#fff}
  .bt-cheio:hover{background:color-mix(in oklch,var(--vermelho) 86%,#fff)}
  .bt-vazio:hover,.bt-zap:hover{border-color:var(--sinal);color:var(--sinal)}
  .bt-zap{padding:9px 16px;font-size:.78rem}

  .chapa{display:flex;align-items:center;gap:10px;
    font:600 .7rem/1 var(--hud);letter-spacing:.2em;text-transform:uppercase;color:var(--tinta-3)}
  .chapa b{color:var(--trigo);font-weight:600}
  .chapa-sinal{color:var(--sinal)}

  .zap{position:fixed;right:clamp(14px,3vw,26px);bottom:clamp(14px,3vw,26px);z-index:70;
    display:grid;place-items:center;width:54px;height:54px;border-radius:50%;
    background:#13823F;color:#fff;box-shadow:0 10px 30px -8px rgba(0,0,0,.7)}
  .zap:hover{background:#0F7A3D}

  .pular-gatilho{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}

  .abre{position:fixed;inset:0;z-index:200;display:grid;place-items:center;
    background:var(--noite);overflow:hidden}
  .abre-luz{position:absolute;inset:auto 0 -24%;height:70%;opacity:0;
    background:
      radial-gradient(52% 100% at 50% 100%,color-mix(in oklch,var(--vermelho) 62%,transparent),transparent 66%),
      radial-gradient(80% 100% at 50% 100%,color-mix(in oklch,var(--vinho) 70%,transparent),transparent 72%);
    filter:blur(14px)}
  .abre-trava{position:relative;display:grid;justify-items:center;gap:18px;text-align:center}
  .abre-logo{width:min(66vw,320px);height:auto;opacity:0}

  .abre-marca{position:relative;width:min(66vw,320px)}
  .abre-marca .abre-logo{width:100%}
  .abre-simbolo{position:absolute;inset:0;width:100%;height:100%;overflow:visible;--simb-u:1;--simb-d:1}
  .abre-simbolo .forma{fill:var(--sinal);stroke:var(--sinal);stroke-width:3;stroke-linejoin:round}
  .abre-simbolo .simb{transform-box:fill-box;transform-origin:center}
  .abre-simbolo :is(.tr,.pe){stroke-dasharray:1}
  .abre-simbolo .tr{stroke-dashoffset:calc(1 - var(--simb-u))}
  .abre-simbolo .pe{stroke-dashoffset:calc(1 - var(--simb-d))}
  .abre-simbolo .p1{stroke-dashoffset:calc(1 - clamp(0, var(--simb-d) / .6, 1))}
  .abre-simbolo .p2{stroke-dashoffset:calc(1 - clamp(0, (var(--simb-d) - .2) / .6, 1))}
  .abre-simbolo .p3{stroke-dashoffset:calc(1 - clamp(0, (var(--simb-d) - .4) / .6, 1))}
  .abre-sub{font-family:var(--display);font-style:italic;font-size:clamp(1rem,2.6vw,1.4rem);color:var(--trigo);opacity:0}
  .abre-local{font:400 .66rem/1 var(--hud);letter-spacing:.24em;text-transform:uppercase;color:var(--tinta-3);opacity:0}
  .abre-pular{position:absolute;right:var(--recuo);bottom:26px;cursor:pointer;
    font:400 .68rem/1 var(--hud);letter-spacing:.18em;text-transform:uppercase;color:var(--tinta-3);
    padding:9px 14px;border:1px solid var(--linha)}
  .abre-pular:hover{color:var(--sinal);border-color:var(--sinal)}
}

@layer mov{

  #c1{view-timeline:--k1 block}
  #c2{view-timeline:--k2 block}
  #c3{view-timeline:--k3 block}
  #c4{view-timeline:--k4 block}
  #c5{view-timeline:--k5 block}
  #c6{view-timeline:--k6 block}

  @keyframes acender-menu{
    0%,14%{opacity:.72;color:var(--tinta-3)}
    26%,74%{opacity:1;color:var(--trigo)}
    86%,100%{opacity:.72;color:var(--tinta-3)}
  }

  .capitulos .n1{animation-timeline:--k1}
  .capitulos .n2{animation-timeline:--k2}
  .capitulos .n3{animation-timeline:--k3}
  .capitulos .n4{animation-timeline:--k4}
  .capitulos .n5{animation-timeline:--k5}
  .capitulos .n6{animation-timeline:--k6}
  .capitulos a{animation-name:acender-menu;animation-fill-mode:both;animation-timing-function:linear;animation-range:cover 0% cover 100%}

  @keyframes trava-foco{from{--foco:0}to{--foco:1}}
  :root{animation-name:trava-foco;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--k4;animation-range:contain 26% contain 42%}

  @keyframes sobe{from{opacity:0;translate:0 26px}to{opacity:1;translate:0 0}}
  .c-armacoes .dito,.c-atende .dito,.comanda-dito,.prova,.bloco-honesto,.dupla,.fecho{
    animation-name:sobe;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:entry 12% cover 34%}

  @keyframes quadro{
    from{opacity:0;translate:0 30px;filter:blur(8px)}
    to{opacity:1;translate:0 0;filter:blur(0)}
  }
  .galeria figure{animation-name:quadro;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:entry 4% cover 30%}

  .recursos li{animation-name:sobe;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:entry 4% cover 26%}

  @keyframes focar{
    from{opacity:.2;scale:1.09;filter:blur(7px) saturate(.7)}
    to{opacity:1;scale:1;filter:blur(0) saturate(1)}
  }
  .poco img{animation-name:focar;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:entry 0% cover 42%}

  @keyframes abrir-luz{
    0%,8%{--r:0px}
    38%,60%{--r:30cqi}
    86%,100%{--r:112cqi}
  }
  .lp{animation-name:abrir-luz;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--k4;animation-range:contain 0% contain 100%}
  @keyframes foco-entrar{
    0%{opacity:.3;scale:.94;translate:0 4vh}
    16%{opacity:1;scale:1;translate:0 0}
    84%{opacity:1;scale:1.01;translate:0 0;filter:blur(0) brightness(1)}
    96%,100%{opacity:.16;scale:1.05;translate:0 -3vh;filter:blur(6px) brightness(.5)}
  }
  .poco-foco{animation-name:foco-entrar;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--k4;animation-range:contain 0% contain 100%}
  @keyframes frase-entrar{
    0%,84%{opacity:0;translate:0 3vh;filter:blur(5px)}
    95%,100%{opacity:1;translate:0 0;filter:blur(0)}
  }
  .foco-frase{animation-name:frase-entrar;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--k4;animation-range:contain 0% contain 100%}

  @keyframes fantasma-focar{
    0%{opacity:.2;filter:blur(14px);letter-spacing:.14em}
    40%{opacity:1;filter:blur(0);letter-spacing:.02em}
    100%{opacity:.22;filter:blur(0);letter-spacing:0em}
  }
  .fantasma{animation-name:fantasma-focar;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--k4;animation-range:contain 0% contain 100%}
  @keyframes specs-entrar{
    0%{opacity:0;translate:-24px 0;clip-path:inset(0 100% 0 0)}
    22%,64%{opacity:1;translate:0 0;clip-path:inset(0 0 0 0)}
    80%,100%{opacity:0;translate:-18px 0;clip-path:inset(0 0 0 0)}
  }
  .specs{animation-name:specs-entrar;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--k4;animation-range:contain 0% contain 100%}

  @keyframes imprimir{from{translate:0 101%}to{translate:0 0}}
  .papel{animation-name:imprimir;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--k5;animation-range:entry 30% cover 50%}
  @keyframes carimbar-comanda{0%{opacity:0;scale:1.12}70%{opacity:1;scale:.98}100%{opacity:1;scale:1}}
  .cp-selo{animation-name:carimbar-comanda;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--k5;animation-range:cover 50% cover 58%}

  @keyframes titulo-sobe{
    from{clip-path:inset(100% -8% -24% -8%);translate:0 .32em}
    to{clip-path:inset(-24% -8% -24% -8%);translate:0 0}
  }
  .c-armacoes .d2,.c-atende .d2,.comanda-dito .d2,.bloco-honesto .d3,.dupla .d3,.fecho .d2{
    animation-name:titulo-sobe;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:entry 20% cover 36%}

  @keyframes deriva{from{translate:0 6%}to{translate:0 -6%}}
  .poco img{animation-name:focar,deriva;animation-timing-function:linear,linear;animation-fill-mode:both,both;
    animation-timeline:view(),view();animation-range:entry 0% cover 42%,cover 0% cover 100%}

  @keyframes salta{from{opacity:0;scale:.6;translate:0 16px}to{opacity:1;scale:1;translate:0 0}}
  .numeros li{animation-name:salta;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:cover 10% cover 24%}
  .numeros li:nth-child(2){animation-range:cover 14% cover 28%}
  .numeros li:nth-child(3){animation-range:cover 18% cover 32%}
  .numeros li:nth-child(n+4){animation-range:cover 22% cover 36%}

  @keyframes barra-cresce{from{scale:0 1}to{scale:1 1}}
  .recursos li::before{transform-origin:left;animation-name:barra-cresce;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:cover 14% cover 32%}
  .recursos li{transition-property:border-color;transition-duration:var(--t-bloco);transition-timing-function:var(--ease-out)}
  .recursos li:hover{border-color:color-mix(in oklch,var(--sinal) 60%,transparent)}

  .fecho-simbolo{display:block;width:clamp(56px,6.5vw,92px);height:auto;overflow:visible;--simb-u:1;--simb-d:1}
  .fecho-simbolo .forma{fill:var(--sinal)}
  .fecho-simbolo :is(.tr,.pe){stroke-dasharray:1}
  .fecho-simbolo .tr{stroke-dashoffset:calc(1 - var(--simb-u))}
  .fecho-simbolo .pe{stroke-dashoffset:calc(1 - var(--simb-d))}
  .fecho-simbolo .p1{stroke-dashoffset:calc(1 - clamp(0, var(--simb-d) / .6, 1))}
  .fecho-simbolo .p2{stroke-dashoffset:calc(1 - clamp(0, (var(--simb-d) - .2) / .6, 1))}
  .fecho-simbolo .p3{stroke-dashoffset:calc(1 - clamp(0, (var(--simb-d) - .4) / .6, 1))}
  @keyframes simb-u{from{--simb-u:0}to{--simb-u:1}}
  @keyframes simb-d{from{--simb-d:0}to{--simb-d:1}}
  .fecho-simbolo{animation-name:simb-u,simb-d;animation-timing-function:linear,linear;animation-fill-mode:both,both;
    animation-timeline:view(),view();animation-range:entry 30% cover 40%,cover 38% cover 50%}

  @keyframes chapa-ping{0%{box-shadow:0 0 0 0 color-mix(in oklch,var(--sinal) 70%,transparent)}100%{box-shadow:0 0 0 10px color-mix(in oklch,var(--sinal) 0%,transparent)}}
  .c-loja .chapa::before{animation:chapa-ping 2000ms var(--ease-out) infinite}

  @keyframes item-sobe{from{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}
  .bloco-honesto li,.onde dl>div{animation-name:item-sobe;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:entry 8% cover 22%}
  .bloco-honesto li:nth-child(3n+2){animation-range:entry 16% cover 28%}
  .bloco-honesto li:nth-child(3n){animation-range:entry 24% cover 34%}

  .pilha{timeline-scope:--p2,--p3,--p4,--p5,--p6}
  .carta:nth-child(2){view-timeline:--p2 block}
  .carta:nth-child(3){view-timeline:--p3 block}
  .carta:nth-child(4){view-timeline:--p4 block}
  .carta:nth-child(5){view-timeline:--p5 block}
  .carta:nth-child(6){view-timeline:--p6 block}
  @keyframes coberta{from{scale:1}to{scale:.93}}

  .carta-in{animation-name:coberta;animation-timing-function:linear;animation-fill-mode:both;animation-range:entry 35% contain 55%}
  .carta:nth-child(1) .carta-in{animation-timeline:--p2}
  .carta:nth-child(2) .carta-in{animation-timeline:--p3}
  .carta:nth-child(3) .carta-in{animation-timeline:--p4}
  .carta:nth-child(4) .carta-in{animation-timeline:--p5}
  .carta:nth-child(5) .carta-in{animation-timeline:--p6}
  .carta:last-child .carta-in{animation:none}

  @keyframes toca{from,to{--toca:running}}
  @supports (animation-timeline:view()){
    .carta{animation-name:toca;animation-timing-function:linear;animation-fill-mode:none;animation-timeline:view();animation-range:cover 0% cover 100%}
  }

  @keyframes a-gira{to{rotate:360deg}}
  .arte .a-ponteiro{animation:a-gira 12000ms linear infinite}
  @keyframes a-onda{0%{opacity:.9;scale:1}70%,100%{opacity:0;scale:3.2}}
  .arte .a-onda{animation:a-onda 2400ms var(--ease-out) infinite}
  .arte .o2{animation-delay:480ms}
  .arte .o3{animation-delay:960ms}
  .arte .o4{animation-delay:1440ms}
  .arte .o5{animation-delay:1920ms}
  @keyframes a-acende{0%,6%{fill:transparent;stroke:color-mix(in oklch,var(--creme) 38%,transparent)}12%,78%{fill:var(--sinal);stroke:var(--sinal)}88%,100%{fill:transparent;stroke:color-mix(in oklch,var(--creme) 38%,transparent)}}
  @keyframes a-acende-mais{0%,6%{stroke:color-mix(in oklch,var(--creme) 72%,transparent)}12%,78%{stroke:var(--noite)}88%,100%{stroke:color-mix(in oklch,var(--creme) 72%,transparent)}}
  .arte .a-mais circle{animation:a-acende 6000ms linear infinite}
  .arte .a-mais path{animation:a-acende-mais 6000ms linear infinite}
  .arte .m2 circle,.arte .m2 path{animation-delay:700ms}
  .arte .m3 circle,.arte .m3 path{animation-delay:1400ms}
  .arte .m4 circle,.arte .m4 path{animation-delay:2100ms}
  .arte .m5 circle,.arte .m5 path{animation-delay:2800ms}
  @keyframes a-enche{0%{scale:0 1}12%{scale:.2 1}26%{scale:.4 1}40%{scale:.6 1}54%{scale:.8 1}68%,88%{scale:1 1}100%{scale:0 1}}
  .arte .a-enche{animation:a-enche 6000ms var(--ease-in-out) infinite}
  @keyframes a-pulso{0%{stroke-dashoffset:0;opacity:0}12%,80%{opacity:1}100%{stroke-dashoffset:-93;opacity:0}}
  .arte .a-pulso{animation:a-pulso 2200ms linear infinite}
  .arte .p2{animation-delay:370ms}
  .arte .p3{animation-delay:740ms}
  .arte .p4{animation-delay:1110ms}
  .arte .p5{animation-delay:1480ms}
  .arte .p6{animation-delay:1850ms}
  @keyframes a-brilho{0%,100%{opacity:.3}50%{opacity:1}}
  .arte .a-brilho{animation:a-brilho 2600ms var(--ease-in-out) infinite}
  .arte .b2{animation-delay:430ms}
  .arte .b3{animation-delay:860ms}
  .arte .b4{animation-delay:1290ms}
  .arte .b5{animation-delay:1720ms}
  .arte .b6{animation-delay:2150ms}
  @keyframes a-percurso{0%{stroke-dashoffset:1;opacity:1}70%,88%{stroke-dashoffset:0;opacity:1}96%,100%{stroke-dashoffset:0;opacity:0}}
  @keyframes a-veiculo{0%{stroke-dashoffset:-.001;opacity:1}70%,88%{stroke-dashoffset:-.996;opacity:1}96%,100%{stroke-dashoffset:-.996;opacity:0}}
  @keyframes a-etapa-2{0%,34%{fill:var(--noite)}38%,100%{fill:var(--sinal)}}
  @keyframes a-etapa-3{0%,68%{fill:var(--noite)}72%,100%{fill:var(--sinal)}}
  .arte .a-percurso{animation:a-percurso 5000ms var(--ease-in-out) infinite}
  .arte .a-veiculo{animation:a-veiculo 5000ms var(--ease-in-out) infinite}
  .arte .e2{animation:a-etapa-2 5000ms linear infinite}
  .arte .e3{animation:a-etapa-3 5000ms linear infinite}
  @keyframes a-coluna{0%{scale:1 0}14%,86%{scale:1 1}96%,100%{scale:1 0}}
  .arte .a-coluna{animation:a-coluna 6000ms var(--ease-out) infinite}
  .arte .c2{animation-delay:120ms}
  .arte .c3{animation-delay:240ms}
  .arte .c4{animation-delay:360ms}
  .arte .c5{animation-delay:480ms}
  .arte .c6{animation-delay:600ms}
  @keyframes a-tendencia{0%,30%{stroke-dashoffset:1;opacity:1}52%,86%{stroke-dashoffset:0;opacity:1}96%,100%{stroke-dashoffset:0;opacity:0}}
  .arte .a-tendencia{animation:a-tendencia 6000ms var(--ease-in-out) infinite}

  .carta-arte *{animation-play-state:var(--toca)!important}
  .capitulos a{will-change:opacity}
}

@layer estado{

  @keyframes abre-focar{0%{opacity:0;filter:blur(18px);scale:1.08}100%{opacity:1;filter:blur(0);scale:1}}
  @keyframes abre-letra{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}
  @keyframes abre-luz{0%{opacity:0}60%{opacity:1}100%{opacity:.7}}
  @keyframes abre-fim{to{opacity:0;visibility:hidden}}

  .abre{animation-name:abre-fim;animation-duration:var(--t-gesto);animation-timing-function:var(--ease-in-out);animation-delay:2600ms;animation-fill-mode:both}
  .abre-luz{animation-name:abre-luz;animation-duration:var(--t-marca);animation-timing-function:var(--ease-out);animation-delay:260ms;animation-fill-mode:both}
  .abre-logo{animation-name:abre-focar;animation-duration:var(--t-marca);animation-timing-function:var(--ease-out);animation-delay:780ms;animation-fill-mode:both}
  .abre-sub{animation-name:abre-letra;animation-duration:var(--t-gesto);animation-timing-function:var(--ease-out);animation-delay:1500ms;animation-fill-mode:both}
  .abre-local{animation-name:abre-letra;animation-duration:var(--t-gesto);animation-timing-function:var(--ease-out);animation-delay:1720ms;animation-fill-mode:both}

  :root{--entra:2500ms}
  .pular-gatilho:checked ~ main{--entra:0ms}
  @keyframes entra-sobe{from{opacity:0;translate:0 22px}to{opacity:1;translate:0 0}}
  @keyframes entra-titulo{from{clip-path:inset(100% -8% -24% -8%);translate:0 .3em}to{clip-path:inset(-24% -8% -24% -8%);translate:0 0}}
  .c-loja .chapa,.c-loja .lead,.c-loja .ficha li,.c-loja .acoes{animation-name:entra-sobe;animation-duration:var(--t-gesto);animation-timing-function:var(--ease-out);animation-fill-mode:both}
  .c-loja .chapa{animation-delay:var(--entra)}
  .c-loja .d1{animation-name:entra-titulo;animation-duration:var(--t-marca);animation-timing-function:var(--ease-out);animation-fill-mode:both;animation-delay:calc(var(--entra) + 90ms)}
  .c-loja .lead{animation-delay:calc(var(--entra) + 300ms)}
  .c-loja .ficha li{animation-delay:calc(var(--entra) + 400ms)}
  .c-loja .ficha li:nth-child(2){animation-delay:calc(var(--entra) + 470ms)}
  .c-loja .ficha li:nth-child(n+3){animation-delay:calc(var(--entra) + 540ms)}
  .c-loja .acoes{animation-delay:calc(var(--entra) + 640ms)}

  @keyframes cl-desenha{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
  @keyframes cl-respira{from{rotate:-1.2deg}to{rotate:1.2deg}}
  .capa-linhas .cl{transform-box:view-box;transform-origin:220px 275px;
    animation-name:cl-desenha,cl-respira;animation-duration:var(--t-vinheta),9000ms;animation-timing-function:var(--ease-in-out),var(--ease-in-out);
    animation-iteration-count:1,infinite;animation-direction:normal,alternate;animation-fill-mode:both,none;animation-delay:calc(var(--entra) + 120ms),0ms}
  .capa-linhas .cl-2{animation-delay:calc(var(--entra) + 420ms),-3000ms}
  .capa-linhas .cl-3{animation-delay:calc(var(--entra) + 720ms),-6000ms}

  @keyframes simb-u{from{--simb-u:0}to{--simb-u:1}}
  @keyframes simb-d{from{--simb-d:0}to{--simb-d:1}}
  @keyframes simb-assenta{from{translate:651px 1px;scale:3}to{translate:0 0;scale:1}}
  @keyframes abre-surge{from{opacity:0}to{opacity:1}}
  .abre-simbolo{animation-name:simb-u,simb-d;animation-duration:var(--t-marca),var(--t-gesto);animation-timing-function:var(--ease-in-out),var(--ease-out);animation-delay:300ms,1180ms;animation-fill-mode:both}
  .abre-simbolo .simb{animation-name:simb-assenta;animation-duration:var(--t-gesto);animation-timing-function:var(--ease-in-out);animation-delay:1820ms;animation-fill-mode:both}
  .abre-marca .abre-logo{animation-name:abre-surge;animation-duration:var(--t-gesto);animation-timing-function:var(--ease-out);animation-delay:2240ms}
  .abre-sub{animation-delay:2420ms}
  .abre-local{animation-delay:2600ms}
  .abre{animation-delay:3100ms}
  :root{--entra:3000ms}

  .pular-gatilho:checked ~ .abre{animation:none;opacity:0;visibility:hidden}

  :where(a,button,label,input):focus-visible{outline:2px solid var(--sinal);outline-offset:3px}

  @media (max-width:1219px){
    .marca i{display:none}
  }
  @media (max-width:1099px){
    .capitulos{display:none}

    @keyframes specs-entrar-m{
      0%{opacity:0;translate:0 20px}
      22%,72%{opacity:1;translate:0 0}
      88%,100%{opacity:0;translate:0 -14px}
    }
    .specs{position:static;translate:none;width:100%;max-width:520px;height:auto;margin-block:0;animation-name:specs-entrar-m}
    .specs dl{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px}
    .grande{display:none}
    .foco-palco{grid-template-rows:auto auto;align-content:center;gap:22px;padding-inline:var(--recuo)}
    .poco-foco{width:min(92vw,600px);margin-inline:auto}
  }
  @media (max-width:899px){
    :root{--topo:56px}
    .palco,.palco-2,.prova,.dupla{grid-template-columns:minmax(0,1fr)}
    .palco .poco{order:1}
    .palco .dito{order:2}
    .poco-loja{max-width:400px}
    .dito-fixo{position:static}
    .galeria{gap:12px}
    .c-foco{height:240vh}
    .comanda-palco{grid-template-columns:minmax(0,1fr)}
    .papel{padding:28px 20px 24px;font-size:.82rem}
    .fantasma{font-size:clamp(1.7rem,7.2vw,3rem);padding-left:var(--recuo);place-items:end center}
    .nota-grande b{font-size:clamp(3rem,16vw,4.6rem)}
    .abre{animation-delay:2150ms}
    :root{--entra:2050ms}

    .abre{animation-delay:3100ms}
    :root{--entra:3000ms}

    .pilha-cab{grid-template-columns:minmax(0,1fr);row-gap:clamp(14px,2.2vh,24px)}
    .carta{top:calc(var(--topo) + 12px + var(--i,0) * 10px);height:auto;margin-bottom:10vh}
    .carta-in{height:auto;grid-template-columns:minmax(0,1fr);gap:14px;border-radius:22px;padding:12px}
    .carta-txt{gap:10px;padding:14px 10px 6px}
    .carta-txt b{font-size:clamp(1.5rem,1.1rem + 2.4vw,2rem)}
    .carta-txt span{font-size:1rem}
    .carta-arte{aspect-ratio:3/2}
  }
  @media (max-width:560px){
    .ficha li{grid-template-columns:minmax(0,1fr)}
    .specs dl{gap:7px}
    .numeros{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
    .numeros span{font-size:.7rem}
  }

  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    .abre{display:none}
    *,*::before,*::after{
      animation-duration:1ms!important;animation-iteration-count:1!important;
      transition-duration:1ms!important;animation-delay:0ms!important}
    .c-armacoes .d2,.c-atende .d2,.comanda-dito .d2,.bloco-honesto .d3,.dupla .d3,.fecho .d2,.numeros li,.recursos li::before,.poco img,.specs,.poco-foco,.fantasma,.galeria figure,.recursos li,.papel,
    .c-armacoes .dito,.c-atende .dito,.comanda-dito,.prova,.bloco-honesto,.dupla,.fecho{
      opacity:1!important;scale:1!important;translate:none!important;rotate:none!important;filter:none!important;clip-path:none!important}
    .cp-selo{opacity:1!important;scale:1!important}
    .fecho-simbolo{animation:none!important}

    .capa-linhas .cl{stroke-dashoffset:0!important;rotate:none!important}
    .bloco-honesto li,.onde dl>div{opacity:1!important;translate:none!important}
    .carta{position:static;height:auto;margin-bottom:16px}
    .carta-in{height:auto;scale:none!important}
    .carta-arte{aspect-ratio:3/2}
    .lp{animation:none!important;--r:200cqi}
    .foco-frase{animation:none!important;opacity:0!important}
    .foco-frase{display:none}
    .ambiente .amb-foco{opacity:.55}
  }

  @supports not (animation-timeline:view()){
    .c-armacoes .d2,.c-atende .d2,.comanda-dito .d2,.bloco-honesto .d3,.dupla .d3,.fecho .d2,.numeros li,.recursos li::before,.poco img,.specs,.poco-foco,.fantasma,.galeria figure,.recursos li,.papel,
    .c-armacoes .dito,.c-atende .dito,.comanda-dito,.prova,.bloco-honesto,.dupla,.fecho{
      opacity:1;scale:1;translate:none;rotate:none;filter:none;clip-path:none;animation:none}
    .cp-selo{opacity:1;scale:1;animation:none}
    .fecho-simbolo{animation:none}

    .bloco-honesto li,.onde dl>div{opacity:1;translate:none;animation:none}
    .pilha{--toca:running}
    .lp{animation:none;--r:200cqi}
    .foco-frase{display:none}
    .c-foco{height:auto}
    .foco-palco{position:static;height:auto;padding-block:var(--passo)}
    .ambiente .amb-foco{opacity:.5}
  }
}

@layer estado{

  @media print{
    .abre,.ambiente,.zap,.topo,.foco-frase{display:none}
    .c-foco{height:auto}
    .foco-palco{position:static;height:auto}
    .dito-fixo{position:static}
    .lp{animation:none;--r:200cqi}
    *,*::before,*::after{animation:none!important}
    .carta{position:static;height:auto;margin-bottom:12px;break-inside:avoid}
  }
}

@layer estado{
  :root{--linha:color-mix(in oklch,var(--creme) 13%,transparent);--linha-forte:color-mix(in oklch,var(--creme) 26%,transparent);
    scrollbar-color:color-mix(in oklch,var(--creme) 26%,var(--noite)) var(--noite)}
  .ambiente,.abre-luz,.poco::before{display:none}
  .fantasma{-webkit-text-stroke-color:color-mix(in oklch,var(--creme) 16%,transparent)}

  .bt-zap{background:var(--vermelho);border-color:var(--vermelho);color:#fff}

  .bt-zap:hover{color:#fff;border-color:var(--creme)}
}

@layer forma{
  .priv{position:relative;z-index:1;padding:clamp(60px,10vh,110px) 0}
  .priv .env{max-width:760px;display:grid;gap:30px}
  .priv section{display:grid;gap:10px;padding-top:18px;border-top:1px solid var(--linha)}
  .priv p,.priv li{color:var(--tinta-2)}
  .priv ul{display:grid;gap:8px;padding-left:1.1em;list-style:disc}
  .priv .marca-priv img{height:30px;width:auto}
}

@layer forma{
  .e404{min-height:100svh;display:grid;align-content:center;gap:24px;justify-items:start;
    width:min(100% - var(--recuo)*2,900px);margin-inline:auto}
  .e404 .cod{font-family:var(--display);font-weight:300;font-size:clamp(5rem,17vw,12rem);
    line-height:.84;color:var(--trigo);opacity:.32}
}

@font-face{font-family:"Nunito";src:url("../fonte/nunito.woff2") format("woff2");font-weight:400 900;font-style:normal;font-display:swap}
:root{
  --display:"Nunito",ui-rounded,"SF Pro Rounded","Segoe UI",system-ui,sans-serif;
  --corpo:"Nunito",ui-rounded,"SF Pro Rounded","Segoe UI",system-ui,sans-serif;
  --hud:"Nunito",ui-rounded,"SF Pro Rounded","Segoe UI",system-ui,sans-serif;
}
.d1,.d2,.d3,.grande,.numeros b,.nota-grande b,.citacao p,blockquote p,.e404 .cod,.recursos b,.carta-txt b{font-weight:800;letter-spacing:-.02em}
.d1{letter-spacing:-.03em}
.d1 span,.d2 span,.d3 span,.grande span,.marca i,.selo em,.carimbo em,.cp-selo em,.rod-marca span,.abre-sub{font-style:normal}
.marca i,.rod-marca span,.abre-sub{font-weight:700}
.selo em,.carimbo em,.cp-selo em{font-weight:800}
.ficha b,.specs dt,.onde dt,.chapa,.cp-selo b{font-weight:800}
.fantasma{font-weight:800}
.bt,.capitulos{font-weight:700}
.bt{font-weight:800}
.papel{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace}
.recursos li{border-radius:20px}