/* ============================================================
   PATHOS BRANDING — apresentação cinematográfica do sistema
   paleta: violeta-carvão #0A0713 · superfície #130B24 · acento #A855F7
   estrutura inspirada no site "Coerência" (03-quantum)
   ============================================================ */

:root{
  --bg:        #0A0713;
  --surface:   #130B24;
  --surface-2: #1A1030;
  --line:      rgba(178,148,235,.12);
  --line-soft: rgba(178,148,235,.06);
  --text:      #EDE9F7;
  --muted:     #A79BC4;
  --faint:     #6A5E86;
  --accent:    #A855F7;
  --accent-2:  #C084FC;
  --accent-dim:rgba(168,85,247,.14);
  --accent-ink:#1A0733;
  --gold:      #F5B84B;
  --pink:      #EC4899;
  --green:     #34D399;
  --ease: cubic-bezier(.22,1,.36,1);
  --wrap: 1240px;
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }

html{ scroll-behavior:smooth; overflow-x:clip; }

body{
  background:var(--bg);
  color:var(--text);
  font-family:"Space Grotesk", system-ui, sans-serif;
  font-size:16px;
  line-height:1.6;
  overflow-x:clip;
  -webkit-font-smoothing:antialiased;
}

/* ambient glows — violeta + acento magenta */
body::before{
  content:"";
  position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(900px 640px at 82% -8%,  rgba(120,60,190,.30), transparent 66%),
    radial-gradient(780px 560px at -12% 40%, rgba(70,40,130,.26),  transparent 64%),
    radial-gradient(600px 460px at 96% 82%,  rgba(236,72,153,.07), transparent 62%);
}

.grain{
  position:fixed; inset:0; z-index:60; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}

.mono{ font-family:"JetBrains Mono", ui-monospace, monospace; }

.wrap{ max-width:var(--wrap); margin-inline:auto; padding-inline:clamp(20px,4vw,48px); }

::selection{ background:rgba(168,85,247,.28); color:#fff; }

img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }

/* ============================================================
   INTRO CINEMATOGRÁFICA (abertura)
   ============================================================ */
body.intro-active{ overflow:hidden; }

.intro{
  position:fixed; inset:0; z-index:300;
  display:grid; place-items:center;
  background:
    radial-gradient(1000px 700px at 50% 8%, rgba(120,60,190,.30), transparent 60%),
    radial-gradient(800px 600px at 20% 90%, rgba(236,72,153,.12), transparent 62%),
    #07050F;
  opacity:1; transition:opacity 1s var(--ease), visibility 1s var(--ease);
}
.intro.is-hidden{ opacity:0; visibility:hidden; pointer-events:none; }

.intro-canvas{ position:absolute; inset:0; z-index:0; opacity:.8; pointer-events:none; }
.intro-vignette{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(120% 90% at 50% 50%, transparent 55%, rgba(5,3,12,.85) 100%);
}

.intro-stage{
  position:relative; z-index:2;
  width:min(920px, 90%); text-align:center;
  min-height:46vh; display:grid; place-items:center;
}
.intro-quote{
  grid-area:1/1; position:relative;
  opacity:0; transform:translateY(26px); filter:blur(8px);
  transition:opacity 1s var(--ease), transform 1.1s var(--ease), filter 1.1s var(--ease);
  pointer-events:none;
}
.intro-quote.is-active{ opacity:1; transform:none; filter:blur(0); }
.intro-quote.is-out{ opacity:0; transform:translateY(-22px); filter:blur(8px); }

.iq-num{
  display:block; font-family:"JetBrains Mono",monospace;
  font-size:.8rem; letter-spacing:.5em; text-transform:uppercase;
  color:var(--accent-2); margin-bottom:26px; opacity:.85;
}
.iq-text{
  font-size:clamp(1.5rem, 3.6vw, 2.85rem);
  font-weight:500; line-height:1.32; letter-spacing:-.02em;
  color:#F3EFFA; text-wrap:balance;
}
.iq-text em{ font-style:normal;
  background:linear-gradient(100deg,var(--accent-2),var(--pink));
  -webkit-background-clip:text; background-clip:text; color:transparent; }
.iq-mark{
  display:block; font-size:3rem; line-height:0; color:var(--accent);
  opacity:.5; margin-bottom:18px; font-family:Georgia, serif;
}

/* brand final */
.intro-final{
  grid-area:1/1; opacity:0; transform:translateY(20px); pointer-events:none;
  transition:opacity 1s var(--ease), transform 1s var(--ease);
  display:grid; place-items:center; gap:26px;
}
.intro-final.is-active{ opacity:1; transform:none; pointer-events:auto; }
.intro-psi{
  width:78px; height:78px; display:grid; place-items:center; border-radius:22px;
  background:linear-gradient(160deg,var(--accent-2),var(--accent));
  font-size:2.3rem; color:#fff; font-weight:600;
  box-shadow:0 26px 64px -24px rgba(168,85,247,.85);
  animation:psi-float 3.4s var(--ease) infinite;
}
@keyframes psi-float{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-8px);} }
.intro-final .if-name{ font-size:1.5rem; font-weight:600; letter-spacing:-.02em; }
.intro-final .if-name b{ color:var(--accent-2); }
.intro-final .if-sub{ color:var(--muted); font-size:1rem; max-width:30rem; }

/* controles */
.intro-skip{
  position:absolute; top:26px; right:26px; z-index:4;
  display:inline-flex; align-items:center; gap:9px;
  padding:9px 18px; border-radius:999px;
  font-size:.82rem; font-weight:600; color:var(--muted);
  border:1px solid var(--line); background:rgba(20,12,36,.6);
  backdrop-filter:blur(10px); cursor:pointer;
  transition:color .4s var(--ease), border-color .4s var(--ease), transform .4s var(--ease);
}
.intro-skip:hover{ color:var(--text); border-color:rgba(168,85,247,.4); transform:translateY(-1px); }
.intro-skip svg{ width:13px; height:13px; }

.intro-enter{
  display:inline-flex; align-items:center; gap:12px;
  padding:14px 16px 14px 26px; border-radius:999px; cursor:pointer;
  font-weight:600; font-size:.98rem; color:#fff;
  background:linear-gradient(180deg,var(--accent-2),var(--accent));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 16px 40px -14px rgba(168,85,247,.6);
  transition:transform .5s var(--ease);
}
.intro-enter:hover{ transform:translateY(-2px); }
.intro-enter .btn-orb{ background:rgba(255,255,255,.18); }

/* progresso da intro */
.intro-dots{
  position:absolute; bottom:34px; left:50%; transform:translateX(-50%); z-index:4;
  display:flex; gap:10px;
}
.intro-dots i{
  width:26px; height:3px; border-radius:999px; background:rgba(178,148,235,.2);
  overflow:hidden; position:relative;
}
.intro-dots i.done{ background:var(--accent); }
.intro-dots i.active::after{
  content:""; position:absolute; inset:0; background:var(--accent);
  transform:translateX(-100%); animation:dot-fill var(--dot-dur,3.8s) linear forwards;
}
@keyframes dot-fill{ to{ transform:translateX(0);} }

@media (prefers-reduced-motion: reduce){
  .intro-quote{ transition:opacity .4s; transform:none; filter:none; }
  .intro-dots i.active::after{ animation:none; transform:translateX(0); }
  .intro-psi{ animation:none; }
}

/* ============================================================
   FUNDOS CINEMATOGRÁFICOS (imagens por cena) + véu de legibilidade
   ============================================================ */
.hero{
  background:
    linear-gradient(90deg, rgba(10,7,19,.96) 0%, rgba(10,7,19,.58) 52%, rgba(10,7,19,.18) 100%),
    linear-gradient(0deg, rgba(10,7,19,.55), rgba(10,7,19,0) 40%),
    url("../assets/bg/bg-hero.jpg") right center / cover no-repeat;
}
.hero-canvas{ opacity:.45; }

/* cenas com fundo próprio */
#statement, #evidencia, #radar, #diagnostico, #ondas, #finale{
  position:relative; isolation:isolate;
}
#statement::before, #evidencia::before, #radar::before,
#diagnostico::before, #ondas::before, #finale::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background-size:cover; background-position:center; background-repeat:no-repeat;
}

#statement::before{
  background-image:
    linear-gradient(90deg, rgba(10,7,19,.92) 0%, rgba(10,7,19,.6) 55%, rgba(10,7,19,.32) 100%),
    url("../assets/bg/bg-tese.jpg");
}
#evidencia::before{
  background-image:
    linear-gradient(180deg, rgba(10,7,19,.9), rgba(10,7,19,.93)),
    url("../assets/bg/bg-evidencia.jpg");
}
#radar::before{
  background-image:
    linear-gradient(90deg, rgba(10,7,19,.9) 0%, rgba(10,7,19,.62) 55%, rgba(10,7,19,.42) 100%),
    url("../assets/bg/bg-radar.jpg");
}
#diagnostico::before{
  background-image:
    linear-gradient(180deg, rgba(10,7,19,.9) 0%, rgba(10,7,19,.82) 50%, rgba(10,7,19,.9) 100%),
    url("../assets/bg/bg-diagnostico.jpg");
  background-position:center 20%;
}
#ondas::before{
  background-image:
    linear-gradient(180deg, rgba(10,7,19,.9), rgba(10,7,19,.92)),
    url("../assets/bg/bg-ondas.jpg");
}
#finale::before{
  background-image:
    linear-gradient(180deg, rgba(10,7,19,.82) 0%, rgba(10,7,19,.5) 46%, rgba(10,7,19,.82) 100%),
    url("../assets/bg/bg-finale.jpg");
}

/* garante o conteúdo acima do véu */
#statement > .wrap, #evidencia > .wrap, #radar > .wrap,
#diagnostico > .wrap, #ondas > .wrap, #finale > .wrap{
  position:relative; z-index:1;
}

/* ============ scroll progress ============ */
.scroll-progress{
  position:fixed; top:0; left:0; height:2px; width:0%;
  background:linear-gradient(90deg, var(--accent), var(--pink));
  z-index:200; box-shadow:0 0 12px rgba(168,85,247,.6);
  transition:width .1s linear;
}

/* ============ reveal ============ */
.rv{
  opacity:0; transform:translateY(28px);
  transition:opacity .95s var(--ease) var(--d,0s), transform .95s var(--ease) var(--d,0s);
}
.rv.in{ opacity:1; transform:none; }

.rv-scale{
  opacity:0; transform:translateY(40px) scale(.965);
  transition:opacity 1.1s var(--ease) var(--d,0s), transform 1.1s var(--ease) var(--d,0s);
}
.rv-scale.in{ opacity:1; transform:none; }

/* ============ eyebrow / titles ============ */
.eyebrow{
  display:inline-block;
  font-family:"JetBrains Mono", monospace;
  font-size:10.5px; font-weight:500;
  letter-spacing:.24em; text-transform:uppercase;
  color:var(--accent-2);
  border:1px solid rgba(168,85,247,.26);
  border-radius:999px;
  padding:6px 14px;
  background:rgba(168,85,247,.06);
  margin-bottom:28px;
}
.eyebrow .n{ color:var(--faint); }
/* eyebrow clicável: seta discreta + pílula acende no hover */
.eyebrow:has(.eyebrow-link){
  padding:0;
  transition:border-color .25s ease, background .25s ease;
}
.eyebrow-link{
  display:block;
  padding:6px 14px;
  color:inherit; text-decoration:none;
}
.eyebrow-link::after{
  content:"→";
  display:inline-block;
  letter-spacing:0;
  margin-left:.75em;
  opacity:.6;
  transition:transform .25s ease, opacity .25s ease;
}
.eyebrow-link:hover::after{ transform:translateX(4px); opacity:1; }
.eyebrow:has(.eyebrow-link:hover){
  border-color:rgba(168,85,247,.6);
  background:rgba(168,85,247,.12);
}

.big-statement{
  font-size:clamp(1.65rem, 3.3vw, 2.9rem);
  font-weight:500; letter-spacing:-.028em; line-height:1.22;
  max-width:19em;
}
.big-statement span{ display:block; }
.big-statement em{ font-style:normal; color:var(--accent-2); }
.big-statement .mono{ font-size:.92em; }

.lead{
  color:var(--muted); font-size:1.06rem; line-height:1.75; max-width:38rem;
}
.lead strong{ color:var(--text); font-weight:600; }
.lead + .lead{ margin-top:20px; }

/* ============ glass ============ */
.glass{
  background:linear-gradient(180deg, rgba(28,18,50,.62), rgba(18,11,34,.72));
  border:1px solid var(--line);
  border-radius:20px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 24px 60px -28px rgba(3,2,10,.9);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

/* ============ buttons ============ */
.btn{
  display:inline-flex; align-items:center; gap:12px;
  border-radius:999px; padding:13px 15px 13px 24px;
  font-weight:600; font-size:.95rem; letter-spacing:-.01em;
  transition:transform .5s var(--ease), background .5s var(--ease), border-color .5s var(--ease);
  will-change:transform;
}
.btn:active{ transform:scale(.97); }
.btn-primary{
  background:linear-gradient(180deg,var(--accent-2),var(--accent)); color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 16px 38px -14px rgba(168,85,247,.55);
}
.btn-primary:hover{ transform:translateY(-2px); }
.btn-orb{
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border-radius:999px;
  background:rgba(255,255,255,.16); color:#fff;
  transition:transform .5s var(--ease);
}
.btn-primary:hover .btn-orb{ transform:translate(2px,-2px); }
.btn-ghost{
  padding:13px 24px; border:1px solid var(--line);
  color:var(--muted); background:rgba(26,16,48,.4);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.btn-ghost:hover{ color:var(--text); border-color:rgba(178,148,235,.28); transform:translateY(-2px); }

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed; top:18px; left:50%; transform:translateX(-50%);
  z-index:100;
  display:flex; align-items:center; gap:clamp(16px,3vw,38px);
  padding:9px 10px 9px 18px;
  border-radius:999px;
  background:rgba(12,8,22,.9);
  border:1px solid var(--line);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 18px 44px -18px rgba(2,1,8,.9);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  white-space:nowrap; transition:top .4s var(--ease);
}
.nav-brand{ display:flex; align-items:center; gap:10px; }
.nav-psi{
  display:inline-grid; place-items:center;
  width:26px; height:26px; border-radius:8px;
  background:linear-gradient(160deg,var(--accent-2),var(--accent));
  color:#fff; font-size:.92rem; font-weight:600;
  box-shadow:0 6px 16px -6px rgba(168,85,247,.7);
}
.nav-name{ font-weight:600; letter-spacing:-.02em; font-size:1.02rem; }
.nav-name b{ color:var(--accent-2); font-weight:600; }
.nav-links{ display:flex; gap:clamp(12px,2vw,24px); }
.nav-links a{ font-size:.85rem; color:var(--muted); transition:color .4s var(--ease); }
.nav-links a:hover{ color:var(--text); }
.nav-cta{
  display:inline-flex; align-items:center; gap:9px;
  padding:8px 16px; border-radius:999px;
  font-size:.85rem; font-weight:600; color:var(--accent-2);
  border:1px solid rgba(168,85,247,.3); background:var(--accent-dim);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  transition:transform .5s var(--ease), background .5s var(--ease);
}
.nav-cta:hover{ transform:translateY(-1px); background:rgba(168,85,247,.22); }
.nav-cta-dot{ width:6px; height:6px; border-radius:999px; background:var(--accent-2); animation:pulse-dot 2.4s var(--ease) infinite; }
@keyframes pulse-dot{ 0%,100%{ box-shadow:0 0 0 0 rgba(168,85,247,.5);} 50%{ box-shadow:0 0 0 6px rgba(168,85,247,0);} }

@media (max-width:820px){ .nav-links{ display:none; } }

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative; min-height:100vh;
  display:flex; align-items:center;
  padding:150px 0 90px; overflow:hidden;
}
@supports (min-height:100svh){ .hero{ min-height:100svh; } }

.hero-canvas{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  opacity:.9;
}
.hero-inner{
  position:relative; z-index:2;
  width:min(820px, 94%);
  margin-left:clamp(20px, 6vw, 96px);
}
.hero-title{
  font-size:clamp(2.5rem, 5.4vw, 4.4rem);
  font-weight:600; letter-spacing:-.035em; line-height:1.03;
  margin-bottom:28px;
}
.ht-line{ display:block; }
.ht-accent{
  background:linear-gradient(100deg,var(--accent-2),var(--pink));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  font-weight:600;
}
.hero-sub{
  color:var(--muted); font-size:1.12rem; line-height:1.7;
  max-width:38rem; margin-bottom:38px;
}
.hero-sub strong{ color:var(--text); font-weight:600; }
.hero-actions{ display:flex; flex-wrap:wrap; gap:14px; margin-bottom:54px; }
.hero-data{
  display:grid; grid-template-columns:repeat(4, auto);
  gap:clamp(16px,3vw,40px); max-width:660px;
}
.hero-data div{ border-left:1px solid var(--line); padding-left:16px; }
.hero-data dt{ font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--faint); margin-bottom:5px; }
.hero-data dd{ font-size:1.05rem; font-weight:500; color:var(--text); }
.hero-data dd b{ color:var(--accent-2); }

.hero-hint{
  position:absolute; bottom:32px; left:clamp(20px, 6vw, 96px);
  display:flex; align-items:center; gap:14px; z-index:2;
  font-size:10.5px; letter-spacing:.14em; color:var(--faint);
}
.hint-bar{ width:44px; height:1px; background:var(--line); position:relative; overflow:hidden; }
.hint-bar::after{ content:""; position:absolute; inset:0; background:var(--accent); transform:translateX(-100%); animation:hint-sweep 2.8s var(--ease) infinite; }
@keyframes hint-sweep{ 0%{ transform:translateX(-100%);} 55%{ transform:translateX(100%);} 100%{ transform:translateX(100%);} }

/* ============================================================
   SCENE (bloco de cena) — alternado
   ============================================================ */
.scene{ padding:clamp(88px,12vh,150px) 0; position:relative; }
.scene-head{ max-width:760px; margin-bottom:clamp(40px,6vw,66px); }
.scene-head .lead{ margin-top:22px; }

.scene-split{
  display:grid; grid-template-columns:1fr 1.15fr;
  gap:clamp(40px,6vw,84px); align-items:center;
}
.scene-flip .scene-copy{ order:2; }
.scene-flip .scene-media{ order:1; }
.scene-kicker{
  font-family:"JetBrains Mono", monospace;
  font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--accent-2); margin-bottom:16px;
}
.scene-title{
  font-size:clamp(1.6rem,2.9vw,2.35rem);
  font-weight:600; letter-spacing:-.03em; line-height:1.1; margin-bottom:20px;
}
.scene-copy .lead{ max-width:34rem; }
.scene-copy .lead + .lead{ margin-top:16px; }

/* quote / narração destacada */
.narr{
  border-left:2px solid var(--accent);
  padding:4px 0 4px 20px; margin:26px 0 0;
  color:var(--text); font-size:1.14rem; line-height:1.6; font-weight:500;
}
.narr em{ font-style:normal; color:var(--accent-2); }

/* lista de "portas" / features */
.pill-list{ list-style:none; display:flex; flex-direction:column; gap:2px; margin-top:26px; }
.pill-list li{
  display:flex; gap:16px; align-items:baseline;
  padding:15px 4px; border-bottom:1px solid var(--line-soft);
}
.pill-list .k{ font-family:"JetBrains Mono",monospace; font-size:.78rem; color:var(--accent-2); min-width:34px; }
.pill-list .t{ color:var(--text); font-weight:600; }
.pill-list .d{ color:var(--muted); font-weight:400; }

/* chips de perfil (3 idiomas) */
.profiles{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:26px; }
@media(max-width:640px){ .profiles{ grid-template-columns:1fr; } }
.profile{
  padding:20px; border-radius:16px; border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(28,18,50,.5),rgba(18,11,34,.6));
  transition:transform .5s var(--ease), border-color .5s var(--ease);
}
.profile:hover{ transform:translateY(-4px); border-color:rgba(168,85,247,.4); }
.profile .p-ic{ font-size:1.3rem; margin-bottom:10px; }
.profile h4{ font-size:1rem; font-weight:600; margin-bottom:6px; }
.profile p{ color:var(--muted); font-size:.86rem; line-height:1.55; }
.profile.is-exec{ border-color:rgba(245,184,75,.3); }
.profile.is-exec .p-tag{ color:var(--gold); }
.p-tag{ font-family:"JetBrains Mono",monospace; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-2); }

/* ============================================================
   SCREEN FRAME — moldura de browser p/ telas do sistema
   ============================================================ */
.screen{
  position:relative; border-radius:16px; overflow:hidden;
  border:1px solid var(--line);
  background:var(--surface);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 40px 90px -40px rgba(0,0,0,.95),
    0 0 0 1px rgba(168,85,247,.05);
  will-change:transform;
}
.screen-bar{
  display:flex; align-items:center; gap:8px;
  padding:11px 16px; background:rgba(10,6,18,.9);
  border-bottom:1px solid var(--line);
}
.screen-dot{ width:11px; height:11px; border-radius:999px; background:#39304d; }
.screen-dot.r{ background:#ff5f57; } .screen-dot.y{ background:#febc2e; } .screen-dot.g{ background:#28c840; }
.screen-url{
  margin-left:12px; font-family:"JetBrains Mono",monospace; font-size:.72rem;
  color:var(--faint); background:rgba(255,255,255,.03);
  padding:5px 14px; border-radius:999px; border:1px solid var(--line-soft);
}
.screen-img-wrap{ position:relative; overflow:hidden; }
.screen-img-wrap img{ width:100%; display:block; transition:transform 1.4s var(--ease); }
.screen:hover .screen-img-wrap img{ transform:scale(1.02); }
/* faixa de brilho que passa na revelação */
.screen-shine{
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(105deg,transparent 30%,rgba(192,132,252,.14) 48%,transparent 66%);
  transform:translateX(-120%);
}
.rv-scale.in .screen-shine{ animation:shine 1.5s var(--ease) .5s 1; }
@keyframes shine{ to{ transform:translateX(120%);} }

.screen-cap{
  margin-top:16px; display:flex; align-items:center; gap:10px;
  font-family:"JetBrains Mono",monospace; font-size:.74rem; color:var(--faint);
}
.screen-cap .dot{ width:6px;height:6px;border-radius:999px;background:var(--accent); }

/* ============================================================
   EVIDÊNCIA — bloco central "honestidade"
   ============================================================ */
.evidence{ padding:clamp(90px,12vh,150px) 0; position:relative; }
.ev-warn{
  display:inline-flex; align-items:center; gap:12px;
  padding:12px 20px; border-radius:12px; margin-top:26px;
  background:rgba(245,184,75,.08); border:1px solid rgba(245,184,75,.3);
  color:var(--gold); font-size:.9rem; font-family:"JetBrains Mono",monospace;
}
.ev-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:40px; }
@media(max-width:820px){ .ev-grid{ grid-template-columns:1fr; } }
.ev-card{
  padding:26px; border-radius:16px; border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(28,18,50,.5),rgba(18,11,34,.65));
}
.ev-card .num{ font-family:"JetBrains Mono",monospace; font-size:.8rem; color:var(--accent-2); }
.ev-card h4{ font-size:1.12rem; font-weight:600; margin:10px 0 8px; }
.ev-card p{ color:var(--muted); font-size:.92rem; line-height:1.6; }

/* ============================================================
   DATA / MÉTRICAS
   ============================================================ */
.metrics{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:18px; overflow:hidden; margin-top:44px; }
@media(max-width:820px){ .metrics{ grid-template-columns:repeat(2,1fr); } }
.metric{ background:var(--surface); padding:28px 24px; }
.metric .cnum{ font-size:clamp(1.9rem,3.4vw,2.7rem); font-weight:600; letter-spacing:-.03em; color:var(--text); font-family:"Space Grotesk"; }
.metric .cnum .u{ color:var(--accent-2); font-size:.7em; }
.metric .lbl{ font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--faint); margin-top:8px; }

/* ============================================================
   ONDAS (3 ondas de valor)
   ============================================================ */
.waves{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:40px; }
@media(max-width:820px){ .waves{ grid-template-columns:1fr; } }
.wave{ padding:26px; border-radius:16px; border:1px solid var(--line); background:linear-gradient(180deg,rgba(28,18,50,.5),rgba(18,11,34,.65)); }
.wave .w-top{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:14px; }
.wave .w-name{ font-weight:600; font-size:.98rem; }
.wave .w-score{ font-family:"JetBrains Mono",monospace; font-size:1.7rem; font-weight:600; }
.wave .w-tag{ font-family:"JetBrains Mono",monospace; font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; color:var(--green); }
.wave.no-ev .w-tag{ color:var(--gold); }
.wave.no-ev .w-score{ color:var(--faint); }
.wave p{ color:var(--muted); font-size:.86rem; line-height:1.6; }
.wave .w-bar{ height:5px; border-radius:999px; background:rgba(255,255,255,.06); margin:14px 0; overflow:hidden; }
.wave .w-bar i{ display:block; height:100%; background:linear-gradient(90deg,var(--accent),var(--accent-2)); width:0; transition:width 1.3s var(--ease); }
.wave.in .w-bar i{ width:var(--w,0%); }
.wave.no-ev .w-bar i{ background:rgba(245,184,75,.5); }

/* ============================================================
   PRINCÍPIOS (fecho — 3 leis)
   ============================================================ */
.laws{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:52px; }
@media(max-width:820px){ .laws{ grid-template-columns:1fr; } }
.law{ position:relative; padding:34px 28px; border-radius:18px; border:1px solid var(--line); background:linear-gradient(180deg,rgba(28,18,50,.55),rgba(18,11,34,.7)); }
.law .lw-n{ font-family:"JetBrains Mono",monospace; font-size:.8rem; color:var(--accent-2); }
.law h4{ font-size:1.28rem; font-weight:600; line-height:1.25; margin-top:14px; letter-spacing:-.02em; }
.law h4 em{ font-style:normal; color:var(--accent-2); }

/* ============================================================
   SIGNATURE / FECHO FINAL
   ============================================================ */
.finale{ padding:clamp(120px,16vh,220px) 0; text-align:center; position:relative; }
.finale .fin-psi{
  width:74px; height:74px; margin:0 auto 34px;
  display:grid; place-items:center; border-radius:20px;
  background:linear-gradient(160deg,var(--accent-2),var(--accent));
  font-size:2.2rem; color:#fff; font-weight:600;
  box-shadow:0 24px 60px -24px rgba(168,85,247,.8);
}
.finale h2{ font-size:clamp(2rem,4.6vw,3.4rem); font-weight:600; letter-spacing:-.035em; line-height:1.08; margin-bottom:22px; }
.finale h2 em{ font-style:normal; background:linear-gradient(100deg,var(--accent-2),var(--pink)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.finale .sig{ color:var(--muted); font-size:1.16rem; max-width:40rem; margin:0 auto 40px; line-height:1.7; }
.finale .sig b{ color:var(--text); }

/* footer */
.foot{ border-top:1px solid var(--line); padding:40px 0; }
.foot-in{ display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; color:var(--faint); font-size:.82rem; }
.foot-in .mono{ letter-spacing:.06em; }

/* ============ responsive ============ */
@media(max-width:900px){
  .scene-split{ grid-template-columns:1fr; gap:36px; }
  .scene-flip .scene-copy{ order:1; }
  .scene-flip .scene-media{ order:2; }
  .hero-data{ grid-template-columns:repeat(2,auto); row-gap:22px; }
}
@media(max-width:560px){
  .hero-data{ grid-template-columns:1fr 1fr; }
  .metric .cnum{ font-size:1.7rem; }
}

@media (prefers-reduced-motion: reduce){
  .rv,.rv-scale{ opacity:1; transform:none; transition:none; }
  .screen-shine{ display:none; }
}
