/* Convertiva IA — deck institucional — instalado por tools/design-systems/install_ds.py
   Fonte: Artifact claude.ai 1e82f3ea-7789-4c49-9b07-676ed33058b8 @ 7f24dbf
   NÃO editar aqui: este arquivo é sobrescrito a cada instalação. */

/* ─── convertiva-deck/deck.css (ponte para o DOM do Divi, deste repo) ─── */
/*
  Convertiva IA — deck institucional · camada visual
  ==================================================
  Convertido de um Artifact do claude.ai (`1e82f3ea`) para Divi 5 por
  `tools/divi-emitter/from_artifact.py` — `maestro-core#296`.

  Os valores de cor e tipo são **os mesmos** que a Fatia 1 já instala como
  Global Colors do Divi (`tools/design-tokens/tokens/convertiva-ai.json`):
  ink-900, ink-700, yellow-500, yellow-400, cream, white, Conthrax, Montserrat.
  Aqui eles são redeclarados como custom properties porque o CSS autoral do
  Artifact os consome por `var()` — nenhum valor novo foi inventado.
*/

:root{
  --ink-900:#1C1C1D;
  --ink-700:#333334;
  --yellow-500:#FAC717;
  --yellow-400:#FCD70F;
  --cream:#FCF5BE;
  --white:#FFFFFF;
  --gradient-yellow:linear-gradient(135deg,var(--yellow-400),var(--yellow-500));
  --font-display:'Conthrax','Neuropolitical','Eurostile','Bank Gothic','Michroma','Saira Condensed',ui-sans-serif,system-ui,sans-serif;
  --font-body:'Montserrat','Avenir Next','Helvetica Neue',ui-sans-serif,system-ui,sans-serif;
  --pad:clamp(2.2rem,5.5vw,7rem);
}

/* ── ponte com o Divi ──────────────────────────────────────────────────────
   No Artifact o deck é o `body`. No WordPress o body é do tema, então as
   regras de página só valem quando a página TEM deck — daí o `:has()`. Sem
   isso, o scroll-snap vazaria para todas as páginas do site. */
body:has(.deck){
  background:var(--ink-900);
  color:var(--white);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
  scroll-snap-type:y mandatory;
  overflow-x:hidden;
}
html:has(.deck){scroll-behavior:smooth;}

/* O Divi limita a linha a 1080px e põe padding próprio; o slide já tem o seu
   (`--pad`). Sem zerar, o deck ganha uma margem dupla e perde o full-bleed. */
.deck .et_pb_row{width:100%;max-width:none;margin:0;padding:0;}
.deck .et_pb_column{width:100%!important;margin:0!important;padding:0;}
.deck .et_pb_module{margin-bottom:0;}

/* ── slide ───────────────────────────────────────────────────────────────── */
.deck.slide{
  position:relative;
  min-height:100svh;
  scroll-snap-align:start;
  scroll-snap-stop:always;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:var(--pad);
  padding-bottom:calc(var(--pad) + 2.5rem);
  overflow:hidden;
}

/* ritmo de cor = ritmo narrativo, não decoração */
.deck.s-ink{background:var(--ink-900);color:var(--white);}
.deck.s-yellow{background:var(--gradient-yellow);color:var(--ink-700);}
.deck.s-cream{background:var(--cream);color:var(--ink-700);}
.deck.s-white{background:var(--white);color:var(--ink-700);}

/* malha hexagonal: só em fundo escuro, nunca sobre amarelo */
.deck.s-ink::before{
  content:"";
  position:absolute;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='104' viewBox='0 0 60 104'%3E%3Cpath d='M30 0 L60 17.3 L60 51.9 L30 69.2 L0 51.9 L0 17.3 Z' fill='none' stroke='%23ffffff' stroke-opacity='0.15' stroke-width='1'/%3E%3C/svg%3E");
  background-size:120px 208px;
  opacity:.5;
  pointer-events:none;
}
.deck > *{position:relative;z-index:1;}

/* ── tipografia ──────────────────────────────────────────────────────────── */
.deck .eyebrow{
  font-family:var(--font-display);
  text-transform:uppercase;
  font-size:clamp(.62rem,.82vw,.78rem);
  letter-spacing:.34em;
  font-weight:700;
  margin:0 0 clamp(1.4rem,3vw,2.6rem);
  display:flex;align-items:center;gap:.9rem;
}
.deck .eyebrow::after{content:"";flex:1;height:1px;background:currentColor;opacity:.28;max-width:14rem;}
.deck.s-ink .eyebrow{color:var(--yellow-500);}
.deck.s-yellow .eyebrow,.deck.s-cream .eyebrow,.deck.s-white .eyebrow{color:var(--ink-700);opacity:.72;}

.deck h1,.deck h2{
  font-family:var(--font-display);
  text-transform:uppercase;
  font-weight:800;
  line-height:.94;
  letter-spacing:-.005em;
  text-wrap:balance;
  margin:0;padding:0;
}
.deck h1{font-size:clamp(2.6rem,7.6vw,7.4rem);}

/*
  ⚠️ HERANÇA NÃO BASTA SOBRE DIVI.
  No Artifact os títulos herdam a cor do slide. O Divi declara
  `h1,h2,h3,h4,h5,h6{color:#333}` explicitamente — e **valor explícito vence
  valor herdado, qualquer que seja a especificidade**. O título saía cinza
  escuro sobre fundo preto: quase invisível, e sem erro nenhum.

  Diferente do caso do botão no Liquid Glass, que era especificidade. Aqui
  nenhuma quantidade de classes resolveria: a cor precisa ser declarada.
*/
.deck.s-ink h1,.deck.s-ink h2,.deck.s-ink h3{color:var(--white);}
.deck.s-yellow h1,.deck.s-yellow h2,.deck.s-yellow h3,
.deck.s-cream h1,.deck.s-cream h2,.deck.s-cream h3,
.deck.s-white h1,.deck.s-white h2,.deck.s-white h3{color:var(--ink-700);}
.deck.s-ink .versus h3{color:var(--yellow-500);}
.deck.s-ink .app-name{color:var(--white);}
.deck h2{font-size:clamp(1.9rem,4.9vw,4.5rem);}
.deck h2.tight{font-size:clamp(1.7rem,3.9vw,3.4rem);}

.deck .lead{
  font-size:clamp(1.02rem,1.62vw,1.5rem);
  line-height:1.5;
  max-width:56ch;
  margin:clamp(1.4rem,2.6vw,2.4rem) 0 0;
  font-weight:400;
}
.deck.s-ink .lead{color:var(--white);opacity:.86;}

.deck p{margin:0 0 1rem;line-height:1.6;padding:0;}
.deck p:last-child{margin-bottom:0;}
.deck strong{font-weight:700;}
.deck.s-ink strong{color:var(--yellow-500);}

/* ── capa ────────────────────────────────────────────────────────────────── */
.deck.cover h1{font-size:clamp(2.9rem,9.4vw,9.6rem);line-height:.88;}
.deck .kicker{
  font-family:var(--font-display);text-transform:uppercase;
  letter-spacing:.3em;font-size:clamp(.66rem,.94vw,.9rem);
  color:var(--yellow-500);font-weight:700;margin:0 0 1.6rem;
}
.deck .by{
  margin-top:clamp(2.4rem,5vw,4rem);
  display:flex;flex-wrap:wrap;gap:.6rem 2.4rem;align-items:baseline;
  font-size:clamp(.82rem,1.05vw,1rem);
}
.deck .by b{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.14em;font-weight:700;font-size:clamp(.9rem,1.2vw,1.15rem);}
.deck .by span{opacity:.6;}

/* ── mapa ────────────────────────────────────────────────────────────────── */
.deck .map-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));
  gap:clamp(1rem,2vw,1.8rem);
  margin-top:clamp(1.4rem,2.6vw,2.2rem);
}
.deck .map-item{border-top:3px solid var(--yellow-500);padding-top:.9rem;}
.deck .map-item.agent{border-top-color:var(--white);}
.deck .map-item h3{
  font-family:var(--font-display);text-transform:uppercase;
  font-size:clamp(.94rem,1.35vw,1.24rem);letter-spacing:.02em;
  font-weight:800;margin:0 0 .45rem;line-height:1.05;padding:0;
}
.deck .map-item p{font-size:clamp(.78rem,.97vw,.92rem);line-height:1.45;opacity:.82;margin:0;}
.deck .map-label{
  font-family:var(--font-display);text-transform:uppercase;letter-spacing:.28em;
  font-size:.68rem;font-weight:700;color:var(--yellow-500);
  margin:clamp(2rem,3.6vw,3rem) 0 .2rem;
  display:flex;align-items:center;gap:.9rem;
}
.deck .map-label::after{content:"";flex:1;height:1px;background:var(--white);opacity:.2;}
.deck .map-label.alt{color:var(--white);}

/* ── colunas de problema ─────────────────────────────────────────────────── */
.deck .cols{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr));
  gap:clamp(1.6rem,3.4vw,3.2rem);
  margin-top:clamp(2rem,4vw,3.4rem);
}
.deck .col-num{
  font-family:var(--font-display);font-weight:800;
  font-size:clamp(2.4rem,4.4vw,4rem);line-height:1;
  color:var(--yellow-500);display:block;margin-bottom:.6rem;
}
.deck.s-yellow .col-num,.deck.s-cream .col-num,.deck.s-white .col-num{color:var(--ink-700);opacity:.32;}
.deck .cols h3{
  font-family:var(--font-display);text-transform:uppercase;
  font-size:clamp(.92rem,1.3vw,1.16rem);letter-spacing:.04em;
  font-weight:800;margin:0 0 .7rem;line-height:1.12;padding:0;
}
.deck .cols p{font-size:clamp(.85rem,1.06vw,1rem);line-height:1.55;opacity:.86;}

/* ── confronto em dois lados ─────────────────────────────────────────────── */
.deck .versus{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,19rem),1fr));
  gap:0;
  margin-top:clamp(2rem,4vw,3.2rem);
  border-top:1px solid rgba(255,255,255,.16);
}
.deck .versus > div{
  padding:clamp(1.4rem,2.6vw,2.2rem) clamp(0rem,2.2vw,2.2rem);
  border-bottom:1px solid rgba(255,255,255,.16);
}
.deck .versus > div + div{border-left:1px solid rgba(255,255,255,.16);}
.deck .versus h3{
  font-family:var(--font-display);text-transform:uppercase;
  font-size:clamp(.72rem,.92vw,.84rem);letter-spacing:.2em;
  font-weight:700;color:var(--yellow-500);margin:0 0 .9rem;padding:0;
}
.deck .versus p{font-size:clamp(.88rem,1.1vw,1.04rem);line-height:1.55;opacity:.88;}
@media (max-width:56rem){ .deck .versus > div + div{border-left:0;} }

/* ── declaração grande ───────────────────────────────────────────────────── */
.deck .statement{max-width:24ch;}
.deck .statement + .lead{max-width:52ch;}
.deck .quote{
  font-family:var(--font-display);text-transform:uppercase;
  font-size:clamp(1.3rem,3.1vw,2.9rem);line-height:1.06;font-weight:800;
  margin:clamp(1.8rem,3.4vw,2.8rem) 0 0;max-width:22ch;text-wrap:balance;
}
.deck.s-ink .quote{color:var(--yellow-500);}

/* ── slide de app ────────────────────────────────────────────────────────── */
.deck .app{display:grid;grid-template-columns:1fr;gap:clamp(1.6rem,3vw,2.6rem);}
@media (min-width:60rem){
  .deck .app{grid-template-columns:1.05fr .95fr;align-items:start;gap:clamp(2.4rem,5vw,5rem);}
}
.deck .app-name{
  font-family:var(--font-display);text-transform:uppercase;font-weight:800;
  font-size:clamp(2.4rem,6.4vw,5.6rem);line-height:.9;margin:0 0 1rem;
  letter-spacing:-.01em;
}
.deck .app-thesis{
  font-size:clamp(1rem,1.5vw,1.34rem);line-height:1.45;font-weight:600;
  max-width:30ch;margin:0;
}
.deck .app-detail p{font-size:clamp(.86rem,1.06vw,1rem);line-height:1.62;opacity:.88;}
.deck .app-index{
  font-family:var(--font-display);font-weight:800;
  font-size:clamp(.72rem,.92vw,.84rem);letter-spacing:.22em;
  opacity:.42;margin:0 0 .8rem;
}
.deck .does{list-style:none;margin:1.4rem 0 0;padding:0;display:grid;gap:.7rem;}
.deck .does li{
  font-size:clamp(.82rem,1.02vw,.96rem);line-height:1.45;
  padding-left:1.3rem;position:relative;opacity:.9;
}
.deck .does li::before{
  content:"";position:absolute;left:0;top:.52em;
  width:.5rem;height:.5rem;background:currentColor;opacity:.55;
  clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);
}
.deck.s-ink .app-name{color:var(--white);}
.deck.s-ink .app-thesis{color:var(--yellow-500);}

/* ── fechamento ──────────────────────────────────────────────────────────── */
.deck.closing h2{max-width:18ch;}
.deck.closing .lead{max-width:50ch;font-weight:500;}

/* ── chrome de navegação ─────────────────────────────────────────────────── */
.cv-hud{
  position:fixed;left:0;right:0;bottom:0;z-index:50;
  display:flex;align-items:center;gap:1rem;
  padding:.85rem clamp(1.2rem,4vw,3.2rem);
  font-family:var(--font-display);text-transform:uppercase;
  font-size:.66rem;letter-spacing:.24em;font-weight:700;
  pointer-events:none;mix-blend-mode:difference;color:var(--white);
}
.cv-hud .count{font-variant-numeric:tabular-nums;}
.cv-hud .track{flex:1;height:2px;background:rgba(255,255,255,.28);max-width:22rem;}
.cv-hud .bar{height:100%;background:var(--white);width:0;transition:width .3s ease;}
.cv-hud .hint{opacity:.55;font-size:.6rem;letter-spacing:.2em;}
@media (max-width:44rem){.cv-hud .hint{display:none;}}

/* ── entrada ─────────────────────────────────────────────────────────────── */
.deck .reveal{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease;}
.deck.on .reveal{opacity:1;transform:none;}
.deck.on .reveal:nth-child(2){transition-delay:.07s;}
.deck.on .reveal:nth-child(3){transition-delay:.14s;}
.deck.on .reveal:nth-child(4){transition-delay:.2s;}
.deck.on .reveal:nth-child(5){transition-delay:.26s;}

@media (prefers-reduced-motion:reduce){
  html:has(.deck){scroll-behavior:auto;}
  .deck .reveal{opacity:1;transform:none;transition:none;}
  .cv-hud .bar{transition:none;}
}

.deck :focus-visible{outline:3px solid var(--yellow-500);outline-offset:3px;}
@media print{
  body:has(.deck){scroll-snap-type:none;}
  .deck.slide{page-break-after:always;min-height:auto;}
  .cv-hud{display:none;}
}