/* fontes hospedadas por nós (latim); Poppins para texto e títulos, Montserrat semibold para rótulos e botões (manual de marca) */
@font-face{font-family:'Poppins';font-weight:400;font-style:normal;font-display:swap;src:url(/f/poppins-400.ac6d71b4.woff2) format('woff2')}
@font-face{font-family:'Poppins';font-weight:500;font-style:normal;font-display:swap;src:url(/f/poppins-500.0da2d17e.woff2) format('woff2')}
@font-face{font-family:'Poppins';font-weight:600;font-style:normal;font-display:swap;src:url(/f/poppins-600.179f97ec.woff2) format('woff2')}
@font-face{font-family:'Poppins';font-weight:700;font-style:normal;font-display:swap;src:url(/f/poppins-700.cb726212.woff2) format('woff2')}
@font-face{font-family:'Montserrat';font-weight:600;font-style:normal;font-display:swap;src:url(/f/montserrat-600.a4f64ab8.woff2) format('woff2')}
.k1{fill:#1b1c1c}.k2{fill:#741a94}
.prov--rodape{border-bottom-color:rgba(255,255,255,.45)}
.texto{max-width:44em}.texto h1{font-size:clamp(2rem,4vw,3rem);margin-bottom:24px}.texto h2{font-size:1.35rem;margin:34px 0 10px;letter-spacing:-.015em}.texto p,.texto li{color:var(--muted)}.texto ul{padding-left:1.2em}
.volta{display:inline-block;margin-bottom:28px;font:600 14px/1 var(--label)}
.sem-canais{font-size:1.1rem;color:rgba(255,255,255,.9)}
/* Layout: cartaz tipográfico (frase de impacto com a palavra-chave em caixa, como nos posts da Axis) e uma pilha das
   artes reais ao lado; faixa de roxo chapado com os números dentro de uma frase; ciclo em numerais vazados; abas para
   os dois públicos; carrossel de conteúdo; contato em roxo chapado. Base clara, um único acento (roxo da marca),
   cantos retos (4px no máximo), sem brilho, sem grade, sem vidro. */
:root{
  --bg:#f4f1f7; --paper:#ffffff; --ink:#0b0710; --muted:#5c5469; --brand:#741a94; --brand-deep:#561270;
  --line:rgba(11,7,16,.16); --on-brand:#ffffff;
  --display:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;
  --body:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;
  --label:'Montserrat','Poppins',system-ui,sans-serif;
  --ease:cubic-bezier(.23,1,.32,1); --r:4px;
  --gutter:clamp(18px,5vw,56px); --max:1200px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-padding-top:84px}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.65 var(--body);-webkit-font-smoothing:antialiased}
a{color:inherit}
p{margin:0}
h1,h2,h3{font-family:var(--display);margin:0;text-wrap:balance;letter-spacing:-.025em}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
:focus-visible{outline:3px solid var(--brand);outline-offset:3px}
.sobre-roxo :focus-visible,.rodape :focus-visible{outline-color:#fff}

/* a "caixa": palavra-chave com contorno, assinatura visual dos posts */
.caixa{display:inline-block;border:.07em solid currentColor;padding:0 .22em .06em;line-height:1.08;white-space:nowrap;border-radius:2px}

/* botões */
.btn{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 26px;border-radius:var(--r);border:2px solid transparent;
  font:600 15px/1 var(--label);text-decoration:none;white-space:nowrap;cursor:pointer;
  transition:transform .16s var(--ease),background-color .16s,color .16s,border-color .16s}
.btn:active{transform:scale(.97)}
.btn--ink{background:var(--ink);color:#fff}
.btn--line{border-color:var(--ink);color:var(--ink);background:transparent}
.btn--brand{background:var(--brand);color:#fff}
.btn--white{background:#fff;color:var(--ink)}
@media (hover:hover) and (pointer:fine){
  .btn--ink:hover{background:var(--brand)} .btn--line:hover{background:var(--ink);color:#fff}
  .btn--brand:hover{background:var(--brand-deep)} .btn--white:hover{background:#efe6f5}
  .btn .seta{transition:transform .2s var(--ease)} .btn:hover .seta{transform:translateX(3px)}
}

/* topo */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--bg);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;height:70px}
.logo{display:block;width:120px;height:auto;flex:none}
.menu{display:flex;gap:30px}
.menu a{font:600 13px/1 var(--label);letter-spacing:.02em;text-decoration:none;padding:8px 0;border-bottom:2px solid transparent;transition:border-color .16s}
.menu a:hover{border-bottom-color:var(--brand)}
.top .btn{height:42px;padding:0 20px;font-size:13px}
@media (max-width:900px){.menu{display:none}}

/* hero: cartaz */
.hero{border-bottom:1px solid var(--line);overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto 1fr;column-gap:24px;align-items:start;padding-block:clamp(36px,6vw,80px)}
.hero h1{grid-column:1 / span 8;font-size:clamp(2.1rem,4.9vw,4.1rem);font-weight:700;line-height:1.04;letter-spacing:-.035em}
.hero h1 .caixa{color:var(--brand)}
.hero .corpo{grid-column:1 / span 6;margin-top:30px}
.hero .sub{font-size:clamp(1rem,1.4vw,1.12rem);color:var(--muted);max-width:29em}
.doors{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.pilha{grid-column:9 / span 4;grid-row:1 / span 2;position:relative;height:clamp(330px,35vw,480px);margin-top:-6px}
.pilha img{position:absolute;display:block;height:auto;box-shadow:0 18px 38px rgba(11,7,16,.22);transition:transform .35s var(--ease)}
.pilha .a1{width:64%;top:0;right:0;transform:rotate(3.2deg)}
.pilha .a2{width:56%;top:30%;left:-4%;transform:rotate(-4.2deg)}
.pilha .a3{width:48%;bottom:0;right:6%;transform:rotate(1.6deg)}
@media (hover:hover) and (pointer:fine){.pilha:hover .a1{transform:rotate(1.6deg) translateY(-6px)}.pilha:hover .a2{transform:rotate(-2.4deg) translateY(-4px)}.pilha:hover .a3{transform:rotate(.6deg) translateY(-8px)}}
@media (max-width:900px){
  .hero h1,.hero .corpo{grid-column:1 / -1}
  .pilha{grid-column:1 / -1;grid-row:auto;height:clamp(300px,82vw,420px);margin-top:42px}
}

/* faixa de roxo chapado: os números dentro da frase */
.sobre-roxo{background:var(--brand);color:#fff}
.prosa .wrap{padding-block:clamp(54px,8vw,104px)}
.prosa p{font:600 clamp(1.5rem,3.5vw,2.85rem)/1.32 var(--display);letter-spacing:-.025em;max-width:25em}
.prosa .caixa{padding-inline:.2em}
.prosa small{display:block;margin-top:30px;font:500 .85rem/1.5 var(--body);color:rgba(255,255,255,.85);max-width:44em}

/* seções claras */
.sec{padding-block:clamp(56px,9vw,112px)}
.sec h2{font-size:clamp(1.9rem,4vw,3.1rem);font-weight:700;line-height:1.08;max-width:15em;letter-spacing:-.03em}
.sec .lead{margin-top:16px;max-width:36em;color:var(--muted);font-size:1.05rem}

/* ciclo: numerais vazados como no carrossel "4 sinais" */
.ciclo ol{list-style:none;margin:46px 0 0;padding:0}
.ciclo li{display:grid;grid-template-columns:clamp(84px,11vw,148px) minmax(0,.8fr) minmax(0,1.2fr);column-gap:clamp(16px,3vw,44px);align-items:center;padding-block:22px;border-top:1px solid var(--line)}
.ciclo li:last-child{border-bottom:1px solid var(--line)}
.num{font:700 clamp(4rem,9vw,7.4rem)/.9 var(--display);color:transparent;-webkit-text-stroke:2px var(--brand);letter-spacing:-.05em}
.ciclo h3{font-size:clamp(1.25rem,2.2vw,1.7rem);font-weight:600}
.ciclo li p{color:var(--muted)}
@media (max-width:760px){.ciclo li{grid-template-columns:76px 1fr;row-gap:6px}.ciclo li p{grid-column:2}.num{-webkit-text-stroke-width:1.6px}}

/* abas: dois públicos, um só lugar */
.paper{background:var(--paper);border-block:1px solid var(--line)}
.abas{display:inline-flex;margin-top:30px;border:2px solid var(--ink);border-radius:var(--r);overflow:hidden}
.abas button{font:600 14px/1 var(--label);padding:15px 22px;background:transparent;color:var(--ink);border:0;cursor:pointer;transition:background-color .16s,color .16s}
.abas button+button{border-left:2px solid var(--ink)}
.abas button[aria-selected="true"]{background:var(--ink);color:#fff}
@media (hover:hover){.abas button[aria-selected="false"]:hover{background:rgba(116,26,148,.1)}}
.aba{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(24px,5vw,72px);align-items:center;margin-top:44px}
.aba[hidden]{display:none}
.aba h3{font-size:clamp(1.5rem,2.8vw,2.2rem);font-weight:700;max-width:16em}
.aba .abre{margin-top:14px;color:var(--muted);max-width:32em;font-size:1.05rem}
.aba ul{list-style:none;margin:26px 0 30px;padding:0;max-width:32em}
.aba li{padding:12px 0;border-top:1px solid var(--line);font-weight:500}
.aba li:last-child{border-bottom:1px solid var(--line)}
.aba figure{margin:0;justify-self:center;max-width:340px;width:100%}
.aba figure img{display:block;width:100%;height:auto;transform:rotate(-2deg);box-shadow:0 18px 38px rgba(11,7,16,.22)}
@media (prefers-reduced-motion:no-preference){.aba:not([hidden]){animation:aparece .28s var(--ease)}}
@media (max-width:860px){.aba{grid-template-columns:1fr}.aba figure{order:-1;max-width:260px;justify-self:start}}

/* conteúdo: carrossel com encaixe, não é marquee */
.faixa{margin-top:40px;position:relative}
.trilho{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px var(--gutter) 22px;margin-inline:calc(var(--gutter) * -1);scrollbar-width:thin}
.trilho:focus-visible{outline-offset:-3px}
.trilho figure{flex:0 0 clamp(210px,24vw,270px);margin:0;scroll-snap-align:start}
.trilho img{display:block;width:100%;height:auto;box-shadow:0 12px 26px rgba(11,7,16,.18);transition:transform .3s var(--ease)}
@media (hover:hover) and (pointer:fine){.trilho figure:hover img{transform:translateY(-6px)}}
.trilho figcaption{margin-top:14px;font:500 .93rem/1.4 var(--body);max-width:17em}
.ctrl{display:flex;gap:10px;margin-top:6px}
.ctrl button{width:48px;height:48px;border:2px solid var(--ink);border-radius:var(--r);background:transparent;color:var(--ink);font:600 20px/1 var(--label);cursor:pointer;transition:transform .16s var(--ease),background-color .16s,color .16s}
.ctrl button:active{transform:scale(.95)}
@media (hover:hover){.ctrl button:hover{background:var(--ink);color:#fff}}
.mais{margin-top:6px;font:600 14px/1 var(--label)}

/* contato */
.contato .wrap{padding-block:clamp(60px,9vw,110px);display:grid;gap:34px}
.contato h2{font-size:clamp(2rem,4.9vw,3.8rem);font-weight:700;max-width:13em;line-height:1.08}
.canais{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:22px 34px;margin:0;padding:0;list-style:none}
.canais li{padding-top:14px;border-top:2px solid rgba(255,255,255,.5)}
.canais small{display:block;font:600 12px/1 var(--label);letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.85);margin-bottom:8px}
.canais .val{font:500 1.15rem/1.3 var(--body);overflow-wrap:anywhere}
.prov{border-bottom:2px dashed rgba(255,255,255,.75)}
.copiar{margin-top:10px;background:transparent;border:2px solid rgba(255,255,255,.7);color:#fff;border-radius:var(--r);height:36px;padding:0 14px;font:600 12px/1 var(--label);cursor:pointer;transition:transform .16s var(--ease),background-color .16s}
.copiar:active{transform:scale(.97)}
@media (hover:hover){.copiar:hover{background:rgba(255,255,255,.16)}}
.contato .btn{justify-self:start}

/* rodapé */
.rodape{background:var(--ink);color:#fff}
.rodape .wrap{padding-block:44px;display:grid;grid-template-columns:auto 1fr auto;gap:28px 48px;align-items:start}
.rodape .logo{width:108px}
.rodape p{color:rgba(255,255,255,.78);font-size:.9rem}
.rodape nav{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:flex-end;align-items:center}
.rodape nav a{font-size:.9rem;color:rgba(255,255,255,.78);text-decoration:none;border-bottom:1px solid transparent}
.rodape nav a.area{border:2px solid rgba(255,255,255,.7);border-radius:var(--r);padding:10px 16px;color:#fff;font:600 13px/1 var(--label);transition:background-color .16s,color .16s}
.rodape nav a.area:hover{background:#fff;color:var(--ink);border-bottom-color:#fff}
.rodape nav a:hover{border-bottom-color:#fff;color:#fff}
@media (max-width:760px){.rodape .wrap{grid-template-columns:1fr}.rodape nav{justify-content:flex-start}}

/* movimento: só transform e opacity; tudo visível em repouso */
@keyframes aparece{from{opacity:.4;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes sobe{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes cai{from{opacity:0;transform:translateY(-22px) rotate(var(--r0,0deg))}to{opacity:1}}
@media (prefers-reduced-motion:no-preference){
  .hero h1{animation:sobe .6s var(--ease) .04s backwards}
  .hero .corpo{animation:sobe .6s var(--ease) .14s backwards}
  .pilha img{animation:cai .8s var(--ease) backwards}
  .pilha .a1{--r0:3.2deg;animation-delay:.12s}.pilha .a2{--r0:-4.2deg;animation-delay:.2s}.pilha .a3{--r0:1.6deg;animation-delay:.28s}
  .rv{opacity:.55;transform:translateY(16px)}
  .rv.in{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:var(--d,0s)}
}