﻿/* ============================================================
   SAÚDE EM SÉRIE — tela de CONCLUSÃO da série.
   Comemoração (não é certificado). Vira funil p/ a próxima série.
   ============================================================ */
:root{
  --void:#080d1c;--void-2:#0b1326;--panel:#101a33;--panel-2:#18254a;
  --line:rgba(255,255,255,.08);--line-2:rgba(255,255,255,.15);
  --ink:#f4f7fc;--muted:#9aa6c4;--muted-2:#5e6a8c;
  --accent:#ff4719;--accent-2:#ff7a3c;--orange:#ff4304;
  --yellow:#ffc400;--yellow-2:#ffd84d;--blue:#0a63c9;--blue-2:#1e86e6;
  --r:18px;--shadow:0 24px 60px -22px rgba(0,0,0,.7);
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:var(--void);color:var(--ink);font-family:'Inter',system-ui,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.55;overflow-x:hidden;position:relative}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(90% 60% at 50% 0%,rgba(255,67,4,.18),transparent 60%),radial-gradient(70% 50% at 50% 100%,rgba(10,99,201,.12),transparent 60%)}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
:focus-visible{outline:2px solid var(--yellow-2);outline-offset:3px;border-radius:8px}
#confetti{position:fixed;inset:0;z-index:1;pointer-events:none}

.shell{position:relative;z-index:2;max-width:620px;margin:0 auto;padding:clamp(40px,8vh,80px) 22px 56px;text-align:center}

.topline{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:34px}
.logo-mark{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,var(--orange),var(--yellow));color:#1a0702;font-family:'Archivo';font-weight:900;font-size:1.05rem}
.topline b{font-family:'Archivo';font-weight:800;font-size:.95rem}

.medal{width:118px;height:118px;border-radius:50%;margin:0 auto 26px;display:grid;place-items:center;position:relative;
  background:radial-gradient(circle at 50% 35%,rgba(255,67,4,.25),rgba(8,13,28,.2));border:1px solid rgba(255,67,4,.4);
  box-shadow:0 0 0 10px rgba(255,67,4,.06),0 20px 50px -16px rgba(255,67,4,.5);animation:pop .55s cubic-bezier(.2,.9,.3,1.3) both}
.medal svg{width:54px;height:54px;color:var(--accent)}
.medal .spark{position:absolute;inset:-7px;border-radius:50%;border:2px dashed rgba(255,196,0,.45);animation:spin 14s linear infinite}
@keyframes pop{from{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes spin{to{transform:rotate(360deg)}}

.eyebrow{font-size:.74rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-2)}
.shell h1{font-family:'Archivo';font-weight:900;font-size:clamp(2rem,6vw,3.1rem);line-height:1.05;letter-spacing:-.025em;margin:12px 0 14px;text-wrap:balance}
.shell h1 em{font-style:normal;color:var(--yellow)}
.lead{font-size:clamp(1rem,2.4vw,1.18rem);color:#cdd6e6;margin:0 auto 30px;max-width:460px}

.stats{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:32px}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:16px 22px;min-width:110px}
.stat b{display:block;font-family:'Archivo';font-weight:900;font-size:1.7rem;line-height:1;letter-spacing:-.02em;
  background:linear-gradient(135deg,var(--orange),var(--yellow));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.stat span{display:block;margin-top:6px;font-size:.78rem;color:var(--muted);font-weight:600}

/* funil próxima série */
.nextcard{text-align:left;background:radial-gradient(120% 120% at 100% 0%,rgba(10,99,201,.18),transparent 55%),linear-gradient(160deg,var(--panel-2),var(--panel));
  border:1px solid var(--line);border-radius:20px;padding:22px;display:flex;align-items:center;gap:18px;margin-bottom:24px;box-shadow:var(--shadow)}
.nextcard .ic{width:52px;height:52px;border-radius:14px;flex:none;display:grid;place-items:center;background:rgba(10,99,201,.18);border:1px solid rgba(30,134,230,.4);color:var(--blue-2)}
.nextcard .tx{flex:1;min-width:0}
.nextcard .tx .k{font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--blue-2);margin-bottom:3px}
.nextcard .tx h3{font-family:'Archivo';font-weight:800;font-size:1.08rem;margin:0 0 3px;letter-spacing:-.01em}
.nextcard .tx p{margin:0;font-size:.84rem;color:var(--muted)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:14px 22px;border-radius:13px;font-weight:700;font-size:.96rem;transition:transform .12s,filter .2s,background .2s}
.btn:active{transform:scale(.98)}.btn svg{width:18px;height:18px}
.btn-accent{background:linear-gradient(135deg,var(--orange),#ff6a1f);color:#fff;box-shadow:0 14px 34px -12px rgba(255,67,4,.6);white-space:nowrap}
.btn-accent:hover{filter:brightness(1.07)}
.actions{display:flex;gap:11px;justify-content:center;flex-wrap:wrap;margin-bottom:14px}
.btn-ghost{background:rgba(255,255,255,.07);border:1px solid var(--line-2);color:var(--ink)}
.btn-ghost:hover{background:rgba(255,255,255,.13)}
.share{margin-top:6px;display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:.85rem;font-weight:600;padding:9px 14px;border-radius:10px}
.share:hover{color:var(--ink)}

.disclaimer{display:flex;gap:13px;align-items:flex-start;text-align:left;background:rgba(255,255,255,.03);border:1px solid var(--line);
  border-left:3px solid var(--orange);border-radius:12px;padding:16px 20px;color:var(--muted);font-size:.85rem;line-height:1.6;margin-top:34px}
.disclaimer svg{flex:none;margin-top:1px;color:var(--yellow)}

@media (max-width:560px){
  .nextcard{flex-direction:column;align-items:flex-start;text-align:left}
  .nextcard .btn-accent{width:100%}
  .actions .btn{flex:1 1 100%}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}#confetti{display:none}}
