/* ═══════════════════════════════════════════════════════════════════
   KAPA (Κ) — Landing page · Combinatória e Probabilidade
   Identidade: esmeralda profundo + marfim · Fraunces + Spectral
   CSS externo para permitir CSP sem 'unsafe-inline' em script-src.
   ═══════════════════════════════════════════════════════════════════ */
:root{
  --ink:#0E2A26; --ink-2:#143832; --ink-soft:#2A5A50;
  --jade:#2F8F6F; --jade-soft:#5FBE9A; --jade-deep:#1E6B51;
  --paper:#F7FAF6; --paper-2:#FFFFFF; --paper-3:#EAF2EC; --edge:#D8E5DA;
  --text:#1F2E2A; --text-muted:#6C7E77; --text-onink:#DFEDE3;
  --shadow:0 1px 2px rgba(14,42,38,.06), 0 10px 30px rgba(14,42,38,.10);
  --shadow-lg:0 24px 60px rgba(14,42,38,.28);
  --display:'Fraunces', Georgia, serif;
  --read:'Spectral', Georgia, serif;
  --ui:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --maxw:1120px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--ui);background:var(--paper);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.eyebrow{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--jade-deep);font-weight:600}
h1,h2,h3{font-family:var(--display);line-height:1.12;font-weight:700;color:var(--text)}
.section-title{font-size:clamp(1.8rem,4vw,2.7rem);margin:.2em 0 .35em}
.lead{font-family:var(--read);font-size:1.08rem;color:var(--text-muted);max-width:62ch}

/* selo */
.seal{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;
  border:1.5px solid var(--jade);color:var(--jade);font-family:var(--display);font-weight:700;line-height:1;
  background:radial-gradient(circle at 34% 28%, rgba(95,190,154,.22), transparent 62%);flex-shrink:0}

/* botões */
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--ui);font-size:.96rem;font-weight:600;
  padding:14px 26px;border-radius:999px;cursor:pointer;border:1.5px solid transparent;transition:transform .15s,box-shadow .15s,background .15s,border-color .15s;white-space:nowrap}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--jade);color:#F4FBF6;box-shadow:0 8px 22px rgba(47,143,111,.34)}
.btn-primary:hover{background:var(--jade-soft);color:var(--ink)}
.btn-ghost{background:transparent;color:var(--text);border-color:var(--edge)}
.btn-ghost:hover{border-color:var(--jade)}

/* ───────── HERO ───────── */
.hero{position:relative;overflow:hidden;background:
   radial-gradient(1200px 600px at 80% -10%, rgba(47,143,111,.20), transparent 60%),
   linear-gradient(160deg, #081D1A 0%, #0E2A26 60%, #143832 100%);
  color:var(--text-onink);padding:26px 0 70px}
.hero .glyphs{position:absolute;inset:0;pointer-events:none;opacity:.10;font-family:var(--display);color:var(--jade-soft);overflow:hidden}
.hero .glyphs span{position:absolute;font-size:clamp(2rem,7vw,6rem);line-height:1}
.g1{top:8%;left:6%}.g2{top:62%;left:3%}.g3{top:20%;left:88%}.g4{top:74%;left:80%}
.g5{top:44%;left:48%}.g6{top:88%;left:40%}.g7{top:12%;left:60%}
.navbar{display:flex;align-items:center;justify-content:space-between;padding-bottom:42px;position:relative;z-index:2}
.brand{display:flex;align-items:center;gap:12px}
.brand .seal{width:42px;height:42px;font-size:1.5rem}
.brand .bt{display:flex;flex-direction:column;line-height:1.05}
.brand .bt .name{font-family:var(--display);font-size:1.45rem;font-weight:700;color:#F0F8F1}
.brand .bt .sub{font-size:.62rem;letter-spacing:.13em;text-transform:uppercase;color:var(--jade-soft)}
.navbar .nav-site{font-size:.82rem;color:var(--jade-soft);border:1px solid rgba(95,190,154,.4);padding:8px 15px;border-radius:999px}
.navbar .nav-site:hover{background:rgba(95,190,154,.10)}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:50px;align-items:center;position:relative;z-index:2}
.hero .eyebrow{color:var(--jade-soft)}
.hero h1{color:#F2FAF3;font-size:clamp(2.3rem,5.2vw,3.9rem);margin:.18em 0 .3em}
.hero h1 em{font-style:italic;color:var(--jade-soft)}
.hero p.intro{font-family:var(--read);font-size:1.14rem;color:#C8DACD;max-width:54ch;margin-bottom:30px}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:18px}
.trust{font-size:.84rem;color:#A7BCAF;font-family:var(--read)}
.trust b{color:var(--jade-soft);font-weight:600}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.chip{font-size:.78rem;padding:6px 13px;border-radius:999px;border:1px solid rgba(95,190,154,.30);color:#C8DACD;font-family:var(--read)}

/* mock chat */
.mock{background:rgba(255,255,255,.04);border:1px solid rgba(95,190,154,.22);border-radius:20px;
  padding:18px;box-shadow:var(--shadow-lg);backdrop-filter:blur(4px)}
.mock-head{display:flex;align-items:center;gap:11px;padding-bottom:14px;border-bottom:1px solid rgba(95,190,154,.16);margin-bottom:14px}
.mock-head .seal{width:38px;height:38px;font-size:1.35rem}
.mock-head .mh-name{font-family:var(--display);font-size:1.2rem;color:#F0F8F1;line-height:1}
.mock-head .mh-role{font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--jade-soft)}
.mb{margin:10px 0;display:flex}
.mb.u{justify-content:flex-end}
.mb .bub{max-width:86%;padding:11px 15px;border-radius:14px;font-family:var(--read);font-size:.97rem;line-height:1.55}
.mb.u .bub{background:var(--jade);color:#F4FBF6;border-bottom-right-radius:4px}
.mb.a .bub{background:rgba(255,255,255,.07);color:#E2EFE5;border:1px solid rgba(95,190,154,.18);border-left:3px solid var(--jade);border-bottom-left-radius:4px}
.mb.a .bub strong{color:var(--jade-soft)}
.mb .katex{font-size:1em}
.mock-foot{font-size:.72rem;color:#8FA69A;text-align:center;margin-top:12px;font-family:var(--ui)}

/* ───────── SEÇÕES ───────── */
section.band{padding:74px 0}
.band.alt{background:var(--paper-2);border-top:1px solid var(--edge);border-bottom:1px solid var(--edge)}
.center{text-align:center}
.center .lead{margin-left:auto;margin-right:auto}
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease, transform .6s ease}
.reveal.in{opacity:1;transform:none}

.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:42px}
.card{background:var(--paper-2);border:1px solid var(--edge);border-radius:16px;padding:26px 24px;box-shadow:var(--shadow)}
.band.alt .card{background:var(--paper)}
.card .ic{font-size:1.7rem;display:block;margin-bottom:12px}
.card h3{font-size:1.35rem;margin-bottom:6px}
.card p{font-family:var(--read);color:var(--text-muted);font-size:.98rem}

/* habilidades */
.skills{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:42px;text-align:left}
.skill{background:var(--paper-2);border:1px solid var(--edge);border-radius:16px;padding:24px;box-shadow:var(--shadow);position:relative}
.skill .ic{width:46px;height:46px;border-radius:12px;background:var(--paper-3);display:inline-flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:14px;border:1px solid var(--edge);color:var(--jade-deep)}
.skill h3{font-size:1.22rem;margin-bottom:6px}
.skill p{font-family:var(--read);color:var(--text-muted);font-size:.95rem}
.skill .tag{position:absolute;top:18px;right:18px;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--jade-deep);background:var(--paper-3);padding:3px 9px;border-radius:7px;border:1px solid var(--edge)}

/* demo conversa */
.demo{display:grid;grid-template-columns:.9fr 1.1fr;gap:46px;align-items:center}
.demo .panel{background:var(--ink);border-radius:20px;padding:22px;box-shadow:var(--shadow-lg)}
.demo .panel .mock-head{border-color:rgba(95,190,154,.18)}
.demo .panel .mb.a .bub{background:rgba(255,255,255,.06)}
.demo .panel .mh-name{color:#F0F8F1}
.demo .panel .mb.a .bub{color:#E2EFE5}

/* passos */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px;text-align:left}
.step{position:relative;padding-top:8px}
.step .n{font-family:var(--display);font-size:2.6rem;font-weight:700;color:var(--jade);line-height:1}
.step h3{font-size:1.18rem;margin:8px 0 5px}
.step p{font-family:var(--read);color:var(--text-muted);font-size:.95rem}
.steps-cta{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:44px}

/* CTA final */
.final{background:linear-gradient(160deg,#081D1A,#143832);color:var(--text-onink);text-align:center;padding:80px 0}
.final .eyebrow{color:var(--jade-soft)}
.final h2{color:#F2FAF3;font-size:clamp(1.9rem,4.4vw,3rem)}
.final p{font-family:var(--read);color:#C3D6C8;max-width:58ch;margin:14px auto 30px;font-size:1.08rem}
.final .hero-cta{justify-content:center}

/* footer */
footer{background:var(--ink-2);color:#AEC3B6;padding:40px 0 30px;font-size:.86rem}
footer .frow{display:flex;flex-wrap:wrap;gap:22px;justify-content:space-between;align-items:center}
footer .fbrand{display:flex;align-items:center;gap:12px}
footer .fbrand .seal{width:38px;height:38px;font-size:1.35rem}
footer .fbrand b{color:#F0F8F1;font-family:var(--display);font-size:1.2rem;font-weight:700}
footer .fbrand .fsub{font-size:.8rem}
footer .flinks{display:flex;gap:20px;flex-wrap:wrap}
footer .flinks a{color:var(--jade-soft)}
footer .flinks a:hover{text-decoration:underline}
footer .legal{margin-top:26px;padding-top:20px;border-top:1px solid rgba(255,255,255,.08);font-size:.78rem;color:#89A093;text-align:center}
footer .legal strong{color:#E2EFE5}
footer .legal .meth{color:var(--jade-soft)}

/* ───────── RESPONSIVO ───────── */
@media(max-width:880px){
  .hero-grid{grid-template-columns:1fr;gap:36px}
  .mock{max-width:480px;margin:0 auto}
  .cards3,.skills{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr}
  .demo{grid-template-columns:1fr;gap:28px}
}
@media(max-width:560px){
  .cards3,.skills{grid-template-columns:1fr}
  .navbar .nav-site{display:none}
  .btn{width:100%;justify-content:center}
  .hero-cta,.steps-cta{flex-direction:column}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
}