/* ==========================================================================
   Sem Ir × rdoria.com
   Sistema visual partilhado entre a landing page e a apresentação.
   Tipografia: um único tipo de letra — IBM Plex Sans — usado do maior
   título ao mais pequeno rótulo, diferenciado por peso e tracking.
   Cor: duas linguagens que se encontram — "IA" (raciocínio: orgânico,
   luminoso, violeta→menta) e "SCRIPT" (execução: preciso, grelha, âmbar).
   ========================================================================== */

:root{
  /* ---- cor: fundo com viés azul, nunca preto puro ---- */
  --ground:        #0b0d12;
  --surface:       #12151ce6;
  --surface-solid: #12151c;
  --surface-2:     #171b24;
  --line:          rgba(245,246,248,.09);
  --line-strong:   rgba(245,246,248,.16);

  /* ---- texto ---- */
  --text:        #f5f6f8;
  --text-muted:  #9096a6;
  --text-faint:  #5b6270;

  /* ---- acento "IA" — raciocínio: orgânico ---- */
  --ai-1: #7c6cff;
  --ai-2: #37e6c4;
  --ai-grad: linear-gradient(120deg, var(--ai-1), var(--ai-2));

  /* ---- acento "SCRIPT" — execução: preciso ---- */
  --script-1: #ffb020;
  --script-2: #ff6a3d;
  --script-grad: linear-gradient(120deg, var(--script-1), var(--script-2));

  /* ---- tipografia — um único tipo de letra ---- */
  --f-sans: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;

  --radius-soft: 28px;
  --radius-sharp: 3px;
  --ease: cubic-bezier(.16,.8,.24,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html,body{ height:100%; }

body{
  margin:0;
  background:var(--ground);
  color:var(--text);
  font-family:var(--f-sans);
  overflow:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

::selection{ background:var(--ai-1); color:#08090c; }

/* ---------------------------------------------------------------------- */
/* Ambiente — camada fixa, presente em todos os diapositivos              */
/* ---------------------------------------------------------------------- */
.ambient{
  position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden;
}
.ambient::before, .ambient::after{
  content:""; position:absolute; border-radius:50%; filter:blur(90px);
  opacity:.30; mix-blend-mode:screen;
}
.ambient::before{
  width:52vw; height:52vw; top:-18vw; right:-14vw;
  background:radial-gradient(circle at 30% 30%, var(--ai-2), var(--ai-1) 55%, transparent 75%);
}
.ambient::after{
  width:38vw; height:38vw; bottom:-14vw; left:-8vw;
  background:radial-gradient(circle at 60% 60%, var(--script-1), var(--script-2) 55%, transparent 75%);
  opacity:.16;
}
.ambient .grid{
  position:absolute; inset:0;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:64px 64px;
  opacity:.28;
  mask-image:radial-gradient(ellipse at 50% 40%, #000 0%, transparent 72%);
}

/* ---------------------------------------------------------------------- */
/* Chrome — cabeçalho / rodapé fixos                                       */
/* ---------------------------------------------------------------------- */
.chrome{
  position:fixed; left:0; right:0; z-index:20;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 clamp(20px,4vw,56px);
  font-family:var(--f-sans); font-weight:600; font-size:11px; letter-spacing:.08em;
  color:var(--text-faint); text-transform:uppercase;
}
.chrome--top{ top:0; height:64px; }
.chrome--bottom{ bottom:0; height:64px; }

.brand{ font-family:var(--f-sans); font-weight:800; font-size:13px; letter-spacing:.01em; color:var(--text); text-transform:none; }
.brand .dot{ color:var(--script-1); }
.brand a{ color:inherit; text-decoration:none; }

.deck-title{ opacity:.8; }
.deck-title strong{ color:var(--text-muted); font-weight:700; }

.progress{ display:flex; gap:8px; }
.progress button{
  width:6px; height:6px; border-radius:50%; padding:0; border:none;
  background:var(--line-strong); cursor:pointer; transition:transform .3s var(--ease), background .3s var(--ease);
}
.progress button:hover{ transform:scale(1.3); }
.progress button.is-active{ background:linear-gradient(120deg,var(--ai-1),var(--ai-2)); width:20px; border-radius:4px; }

.counter{ font-variant-numeric:tabular-nums; letter-spacing:.12em; }
.counter #current{ color:var(--text); }

.hint{ display:none; }
@media (min-width:900px){ .hint{ display:block; } }

/* ---------------------------------------------------------------------- */
/* Deck / diapositivos                                                     */
/* ---------------------------------------------------------------------- */
.deck{
  position:relative; z-index:1;
  height:100%; display:flex;
  transition:transform .65s var(--ease);
  will-change:transform;
}

.slide{
  position:relative;
  flex:0 0 100vw; height:100%;
  display:flex; flex-direction:column; justify-content:center;
  padding:76px clamp(24px,6vw,96px);
  overflow:hidden;
}

.eyebrow{
  font-family:var(--f-sans); font-weight:600; font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--script-1); margin:0 0 22px; display:flex; align-items:center; gap:10px;
}
.eyebrow::before{ content:""; width:22px; height:1px; background:var(--script-1); opacity:.7; }

h1,h2,h3{ font-family:var(--f-sans); font-weight:700; line-height:1.05; letter-spacing:-.02em; margin:0; text-wrap:balance; }

.headline{ font-size:clamp(34px,5.6vw,76px); font-weight:700; max-width:19ch; }
.headline em{ font-style:italic; font-weight:500; }
.headline .ai{ background:var(--ai-grad); -webkit-background-clip:text; background-clip:text; color:transparent; font-style:italic; font-weight:600; }
.headline .script{ color:var(--script-1); font-style:normal; }

.kicker{ font-family:var(--f-sans); font-style:italic; font-weight:400; font-size:clamp(20px,2vw,26px); color:var(--text-muted); margin-top:22px; max-width:46ch; letter-spacing:-.01em; }

.lede{ font-size:clamp(15px,1.1vw,18px); color:var(--text-muted); max-width:58ch; margin-top:14px; line-height:1.55; }

.meta-row{
  display:flex; flex-wrap:wrap; gap:28px; margin-top:56px;
  font-family:var(--f-sans); font-size:12px; letter-spacing:.02em; color:var(--text-faint);
}
.meta-row b{ display:block; color:var(--text); font-weight:700; font-size:13px; letter-spacing:0; margin-bottom:4px; }

.tag{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--f-sans); font-weight:600; font-size:11px; letter-spacing:.08em; text-transform:uppercase;
  padding:6px 12px; border-radius:999px; border:1px solid var(--line-strong); color:var(--text-muted);
}

/* ---------------------------------------------------------------------- */
/* Grelhas de conteúdo                                                     */
/* ---------------------------------------------------------------------- */
.cols{
  display:grid; gap:1px; background:var(--line);
  border:1px solid var(--line); border-radius:var(--radius-sharp);
  margin-top:32px; overflow:hidden;
}
.cols.c3{ grid-template-columns:repeat(3,1fr); }
.cols.c2{ grid-template-columns:repeat(2,1fr); }

.col{ background:var(--surface-solid); padding:22px 24px; }
.col h4{
  font-family:var(--f-sans); font-weight:600; font-size:12px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--text); margin:0 0 14px; display:flex; align-items:center; gap:10px;
}
.col h4 i{ width:8px; height:8px; border-radius:50%; background:var(--ai-grad); flex:none; }
.col.is-script h4 i{ background:var(--script-grad); border-radius:2px; }

.col ul{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:10px; }
.col li{ font-size:13.5px; line-height:1.45; color:var(--text-muted); padding-left:16px; position:relative; }
.col li::before{ content:"—"; position:absolute; left:0; color:var(--text-faint); }
.col li strong{ color:var(--text); font-weight:600; }

.col-foot{
  margin-top:16px; padding-top:14px; border-top:1px dashed var(--line-strong);
  font-family:var(--f-sans); font-size:11px; color:var(--text-faint); letter-spacing:.03em;
}

/* Painel duplo IA vs SCRIPT (slide da tese) */
.duo{
  display:grid; grid-template-columns:1fr auto 1fr; gap:22px; align-items:stretch;
  margin-top:44px;
}
.duo-card{ border-radius:var(--radius-soft); padding:30px 30px 26px; position:relative; overflow:hidden; }
.duo-card.ai{
  background:linear-gradient(160deg, rgba(124,108,255,.14), rgba(55,230,196,.05) 60%), var(--surface-solid);
  border:1px solid rgba(124,108,255,.28);
}
.duo-card.script{
  background:var(--surface-solid);
  border:1px solid rgba(255,176,32,.28);
  border-radius:var(--radius-sharp);
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:22px 22px;
}
.duo-card .duo-label{
  font-family:var(--f-sans); font-weight:600; font-size:11px; letter-spacing:.14em; text-transform:uppercase; margin-bottom:16px; display:block;
}
.duo-card.ai .duo-label{ color:var(--ai-2); }
.duo-card.script .duo-label{ color:var(--script-1); }
.duo-card ul{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:12px; }
.duo-card li{ font-size:14.5px; line-height:1.5; color:var(--text-muted); }
.duo-card li strong{ color:var(--text); }

.duo-arrow{
  display:flex; align-items:center; justify-content:center;
  font-family:var(--f-sans); font-weight:600; font-size:11px; color:var(--text-faint); letter-spacing:.05em;
  writing-mode:vertical-rl;
}

.flow{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  margin-top:26px; font-family:var(--f-sans); font-weight:600; font-size:12px; letter-spacing:.02em; color:var(--text-muted);
}
.flow span{ padding:8px 14px; border:1px solid var(--line-strong); border-radius:999px; }
.flow span.hot{ color:var(--ground); background:var(--ai-grad); border-color:transparent; font-weight:700; }
.flow span.cold{ color:var(--ground); background:var(--script-grad); border-color:transparent; font-weight:700; }
.flow i{ color:var(--text-faint); }
.flow--compact{ margin-top:18px; gap:8px; }
.flow--compact span{ padding:6px 12px; font-size:11px; }

.callout{
  margin-top:22px; padding:14px 20px; border-left:2px solid var(--script-1);
  font-family:var(--f-sans); font-style:italic; font-weight:400; font-size:clamp(15px,1.3vw,19px);
  color:var(--text); max-width:64ch; line-height:1.4;
}

/* Tabela comparativa */
.table{ margin-top:22px; border:1px solid var(--line); border-radius:var(--radius-sharp); overflow:hidden; }
.table-row{ display:grid; grid-template-columns:1.1fr 1.3fr 1.3fr; }
.table-row + .table-row{ border-top:1px solid var(--line); }
.table-row > div{ padding:10px 20px; font-size:12.5px; line-height:1.4; }
.table-row.head > div{
  font-family:var(--f-sans); font-weight:600; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-faint); padding-top:10px; padding-bottom:10px;
}
.table-row > div:first-child{ color:var(--text); font-weight:700; background:var(--surface-solid); }
.table-row > div:nth-child(2){ color:#ffb9a0; background:rgba(255,106,61,.05); }
.table-row > div:nth-child(3){ color:#bdeee0; background:rgba(55,230,196,.05); }
.table-row.head > div:nth-child(2){ color:var(--script-1); background:transparent; }
.table-row.head > div:nth-child(3){ color:var(--ai-2); background:transparent; }

/* Timeline / fases */
.timeline{ margin-top:28px; display:flex; flex-direction:column; gap:0; }
.tl-item{ display:grid; grid-template-columns:56px 1fr; gap:18px; padding:11px 0; border-top:1px solid var(--line); }
.tl-item:last-child{ border-bottom:1px solid var(--line); }
.tl-num{ font-family:var(--f-sans); font-weight:600; font-size:12.5px; color:var(--script-1); padding-top:2px; font-variant-numeric:tabular-nums; }
.tl-body b{ display:block; font-size:14.5px; color:var(--text); margin-bottom:2px; font-weight:700; }
.tl-body span{ font-size:12.5px; color:var(--text-muted); }

/* ROI */
.roi-example{
  margin-top:16px; border:1px solid var(--line-strong); border-radius:var(--radius-sharp);
  padding:20px 24px; background:var(--surface-solid);
  display:grid; grid-template-columns:repeat(3,1fr); gap:18px;
}
.roi-example .k{ font-family:var(--f-sans); font-weight:600; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-faint); display:block; margin-bottom:8px; }
.roi-example .v{ font-family:var(--f-sans); font-weight:700; font-variant-numeric:tabular-nums; font-size:clamp(20px,2vw,28px); color:var(--text); }
.roi-example .v.ai{ background:var(--ai-grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.roi-note{ margin-top:14px; font-size:12.5px; color:var(--text-faint); max-width:64ch; }

.levers{ margin-top:26px; display:flex; flex-wrap:wrap; gap:12px; }
.levers span{
  font-size:13px; color:var(--text-muted); border:1px solid var(--line-strong); border-radius:999px; padding:8px 14px;
}

/* CTA final */
.cta{
  margin-top:42px; padding:26px 30px; border-radius:var(--radius-soft);
  background:linear-gradient(160deg, rgba(124,108,255,.14), rgba(255,176,32,.08));
  border:1px solid var(--line-strong); max-width:72ch;
}
.cta .cta-label{ font-family:var(--f-sans); font-weight:600; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--ai-2); margin-bottom:10px; display:block; }
.cta p{ margin:0; font-family:var(--f-sans); font-weight:400; font-size:clamp(18px,1.7vw,23px); font-style:italic; color:var(--text); line-height:1.4; }

.signature{
  position:absolute; right:clamp(24px,6vw,96px); bottom:76px;
  font-family:var(--f-sans); font-weight:500; font-size:11px; color:var(--text-faint); text-align:right; letter-spacing:.02em;
}
.signature b{ color:var(--text-muted); }

/* Rodapé de confidencialidade discreto em cada slide */
.confid{
  position:absolute; left:clamp(24px,6vw,96px); bottom:76px;
  font-family:var(--f-sans); font-weight:600; font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-faint);
}

/* ---------------------------------------------------------------------- */
/* Notas do orador                                                        */
/* ---------------------------------------------------------------------- */
.slide .notes{ display:none; }

.notes-drawer{
  position:fixed; left:0; right:0; bottom:0; z-index:40;
  max-height:42vh; overflow-y:auto;
  background:var(--surface-solid); border-top:1px solid var(--line-strong);
  padding:22px clamp(24px,6vw,96px) 26px;
  box-shadow:0 -30px 60px rgba(0,0,0,.45);
  transform:translateY(100%); transition:transform .4s var(--ease);
}
.notes-drawer.is-open{ transform:translateY(0); }
.notes-drawer__label{
  font-family:var(--f-sans); font-weight:600; font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--script-1); margin-bottom:12px; display:flex; align-items:center; justify-content:space-between;
}
.notes-drawer__label .k{ color:var(--text-faint); font-weight:400; }
.notes-drawer__body{
  font-family:var(--f-sans); font-style:italic; font-weight:400; font-size:16px; line-height:1.65; color:var(--text);
  max-width:78ch;
}

/* ---------------------------------------------------------------------- */
/* Responsivo                                                              */
/* ---------------------------------------------------------------------- */
@media (max-width:860px){
  .cols.c3{ grid-template-columns:1fr; }
  .duo{ grid-template-columns:1fr; }
  .duo-arrow{ writing-mode:horizontal-tb; padding:6px 0; }
  .table-row{ grid-template-columns:1fr; }
  .table-row > div:first-child{ border-bottom:1px solid var(--line); }
  .roi-example{ grid-template-columns:1fr; }
  .signature{ position:static; margin-top:24px; text-align:left; }
  .confid{ display:none; }
  .slide{ padding:80px 22px 110px; overflow-y:auto; justify-content:flex-start; }
  .chrome{ padding:0 18px; }
}

/* Ecrãs curtos em modo paisagem (ex.: portáteis 1366×768) — compactar sem mudar o layout */
@media (max-height:820px) and (min-width:861px){
  .slide{ padding:44px clamp(20px,5vw,80px); }
  .eyebrow{ margin-bottom:12px; }
  .headline{ font-size:clamp(22px,3.3vw,34px) !important; line-height:1.15; }
  .kicker{ margin-top:14px; font-size:16px; }
  .lede{ margin-top:8px; font-size:14px; }
  .meta-row{ margin-top:30px; }
  .cols{ margin-top:18px !important; }
  .col{ padding:14px 18px; }
  .col h4{ margin-bottom:8px; }
  .col ul{ gap:6px; }
  .col li{ font-size:12px; line-height:1.32; }
  .duo{ margin-top:18px; }
  .duo-card{ padding:16px 18px 14px; }
  .duo-card ul{ gap:6px; }
  .duo-card li{ font-size:12px; }
  .flow{ margin-top:10px !important; }
  .flow--compact span{ padding:5px 10px; }
  .table{ margin-top:12px !important; }
  .table-row > div{ padding:6px 14px !important; font-size:11px !important; }
  .callout{ margin-top:10px !important; padding:8px 14px; font-size:13px !important; }
  .timeline{ margin-top:12px !important; }
  .tl-item{ padding:6px 0 !important; }
  .tl-body b{ font-size:13px; }
  .tl-body span{ font-size:11px; }
  .roi-example{ padding:12px 16px; }
  .roi-note{ margin-top:8px; }
  .levers{ margin-top:14px; }
  .cta{ margin-top:16px; padding:14px 18px; }
  .cta p{ font-size:15px; }
  .signature,.confid{ bottom:44px; }
}

/* ---------------------------------------------------------------------- */
/* Impressão / exportação PDF — um diapositivo por página                 */
/* ---------------------------------------------------------------------- */
@media print{
  body{ overflow:visible; background:var(--ground); }
  .chrome, .notes-drawer, .ambient .grid{ display:none !important; }
  .deck{ display:block; transform:none !important; }
  .slide{ flex:none; width:100%; height:100vh; page-break-after:always; padding:64px 64px; }
}

@media (prefers-reduced-motion:reduce){
  .deck, .progress button, .notes-drawer{ transition:none !important; }
}
