:root{
  --black:#0C0C0C;
  --graphite:#3D3B37;
  --cream:#F5F2EC;
  --orange:#E8792B;
  --orange-deep:#D35400;
  --gold:#F3C98B;
  --steel:#4B5563;
  --gray:#9CA3AF;
  --serif-head:'Poppins',sans-serif;
  --sans-body:'Inter',sans-serif;
  --ease:cubic-bezier(.16,.8,.24,1);
}
*{margin:0;padding:0;box-sizing:border-box;}
[hidden]{display:none !important;}
body{
  font-family:var(--sans-body);
  background:var(--cream);
  color:var(--black);
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
a{color:inherit;}
img{display:block;max-width:100%;}
h1,h2{font-family:var(--serif-head);font-weight:700;line-height:1.2;letter-spacing:-.01em;}
p{line-height:1.7;}
::selection{background:var(--orange);color:var(--cream);}

/* ---------- app shell (sidebar no desktop, barra superior no mobile) ---------- */
.app-shell{display:block;}
@media(min-width:900px){
  .app-shell{display:flex;align-items:stretch;min-height:100vh;}
}

.sidebar{
  display:flex;flex-direction:column;
  width:250px;flex-shrink:0;
  background:var(--black);
  padding:30px 18px;
}
@media(max-width:899px){
  .sidebar{
    position:fixed;top:0;left:0;height:100vh;max-width:82vw;
    transform:translateX(-100%);
    transition:transform .3s var(--ease);
    z-index:60;overflow-y:auto;
  }
  .sidebar.open{transform:translateX(0);}
}
@media(min-width:900px){
  .sidebar{position:sticky;top:0;height:100vh;}
}

.menu-toggle{
  display:flex;flex-direction:column;justify-content:center;gap:4px;
  position:fixed;top:28px;left:20px;z-index:70;
  width:40px;height:40px;border-radius:12px;
  border:1px solid rgba(61,59,55,.2);background:var(--cream);cursor:pointer;
  padding:0 10px;
}
.menu-toggle-bar{display:block;width:100%;height:2px;background:var(--black);border-radius:2px;}
@media(min-width:900px){.menu-toggle{display:none;}}

.sidebar-backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:55;
  opacity:0;pointer-events:none;transition:opacity .3s var(--ease);
}
.sidebar-backdrop.open{opacity:1;pointer-events:auto;}
@media(min-width:900px){.sidebar-backdrop{display:none;}}
.sidebar-brand{
  display:flex;align-items:center;gap:10px;text-decoration:none;
  font-family:var(--serif-head);font-weight:700;font-size:1.05rem;color:var(--cream);
  padding:0 10px;margin-bottom:34px;
}
.sidebar-brand img{width:30px;height:30px;object-fit:contain;}
.sidebar-brand .ai{color:var(--orange);}

.sidebar-nav{display:flex;flex-direction:column;gap:3px;flex:1;overflow-y:auto;}
.sidebar-nav-label{
  font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--steel);margin:20px 10px 8px;
}
.sidebar-nav-label:first-child{margin-top:0;}
.sidebar-nav-item{
  display:flex;align-items:center;gap:10px;
  padding:11px 10px;border-radius:12px;
  color:var(--gray);text-decoration:none;font-size:.9rem;font-weight:600;
  transition:background .25s var(--ease),color .25s var(--ease);
}
a.sidebar-nav-item:hover{background:rgba(245,242,236,.06);color:var(--cream);}
a.sidebar-nav-item.active{background:rgba(232,121,43,.16);color:var(--gold);}
.sidebar-nav-item .nav-icon{font-size:1rem;line-height:1;width:20px;text-align:center;}
.sidebar-nav-item.disabled{opacity:.4;cursor:default;}
.sidebar-nav-item.disabled em{
  margin-left:auto;font-style:normal;font-size:.6rem;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;color:var(--steel);
  background:rgba(245,242,236,.08);padding:2px 7px;border-radius:100px;white-space:nowrap;
}
.sidebar-logout{
  display:flex;align-items:center;gap:8px;
  margin-top:16px;padding:16px 10px 0;
  border-top:1px solid rgba(245,242,236,.1);
  color:var(--gray);text-decoration:none;font-size:.86rem;font-weight:600;
  transition:color .25s var(--ease);
}
.sidebar-logout:hover{color:var(--cream);}

.main-content{min-width:0;}
@media(min-width:900px){
  .main-content{flex:1;}
  .top{display:none;}
  .main-content .wrap{max-width:760px;padding-top:56px;}
  .main-content .wrap.narrow{max-width:600px;}
}

.top{
  position:relative;
  padding:36px 24px 0;
  display:flex;justify-content:center;align-items:center;gap:16px;
}
.brand{
  display:flex;align-items:center;gap:10px;
  font-family:var(--serif-head);font-weight:700;font-size:1.1rem;color:var(--black);
  text-decoration:none;
}
.brand .ai{color:var(--orange);}
.brand img{width:32px;height:32px;object-fit:contain;}

.top-actions{
  position:absolute;right:24px;top:36px;
}
.link-logout{
  font-size:.82rem;color:var(--steel);text-decoration:none;font-weight:600;
  padding:8px 14px;border-radius:100px;border:1px solid rgba(61,59,55,.2);
  transition:all .3s var(--ease);
}
.link-logout:hover{color:var(--black);border-color:var(--orange);}

.wrap{
  max-width:640px;
  margin:0 auto;
  padding:32px 24px 100px;
}
.wrap.narrow{max-width:460px;}

.intro{text-align:center;margin-bottom:8px;}
.eyebrow{
  font-weight:600;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--orange-deep);margin-bottom:14px;
}
.intro h1{font-size:clamp(1.6rem,3.6vw,2.15rem);margin-bottom:14px;}
.intro h1 .accent{color:var(--orange-deep);}
.intro p{color:var(--steel);font-size:.98rem;max-width:520px;margin:0 auto;}

/* ---------- tree ---------- */
.tree-stage{
  display:flex;flex-direction:column;align-items:center;
  margin:26px 0 10px;
}
.tree-svg{width:150px;height:170px;overflow:visible;}
.tree-svg .roots,.tree-svg .trunk,.tree-svg .branches path{
  fill:none;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;
  transition:stroke-dashoffset 1s var(--ease);
}
.tree-svg .roots path{stroke:var(--gold);stroke-width:2.4;}
.tree-svg .trunk{stroke:var(--orange-deep);stroke-width:6;}
.tree-svg .branches path{stroke:var(--orange-deep);stroke-width:3.6;}
.tree-svg .canopy-bg{fill:rgba(232,121,43,.08);}
.tree-svg .canopy-outline{
  fill:none;stroke:var(--gold);stroke-width:1.4;stroke-dasharray:3 4;
}
.tree-svg .canopy-clip-circle{transition:r 1.1s var(--ease);}

/* tree as a transparent background layer behind the card */
.card-shell{position:relative;}
.tree-bg{
  position:absolute;inset:0;width:100%;height:100%;
  z-index:0;pointer-events:none;opacity:.12;
  overflow:visible;
  transition:opacity 1s var(--ease),filter 1s var(--ease);
}
/* a cada "Continuar", o card clareia bem mais e a árvore por trás ganha força */
.card-shell[data-step="2"] .tree-bg{opacity:.26;}
.card-shell[data-step="3"] .tree-bg{opacity:.42;}
.card-shell[data-step="4"] .tree-bg{opacity:.58;}
.card-shell[data-step="done"] .tree-bg{opacity:.78;}

.card-shell[data-step="4"] .tree-bg,
.card-shell[data-step="done"] .tree-bg{
  animation:canopyPulse 3.4s ease-in-out infinite;
}
@keyframes canopyPulse{
  0%,100%{filter:drop-shadow(0 0 0 rgba(243,201,139,0));}
  50%{filter:drop-shadow(0 0 22px rgba(243,201,139,.45));}
}
.tree-bg .roots,.tree-bg .trunk,.tree-bg .branches path{
  fill:none;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;
  transition:stroke-dashoffset 1.1s var(--ease);
}
.tree-bg .roots path{stroke:var(--gold);stroke-width:1.6;}
.tree-bg .trunk{stroke:var(--gold);stroke-width:4;}
.tree-bg .branches path{stroke:var(--gold);stroke-width:2.4;}
.tree-bg .canopy-bg{fill:rgba(243,201,139,.14);}
.tree-bg .canopy-outline{fill:none;stroke:var(--gold);stroke-width:1;stroke-dasharray:3 4;}
.tree-bg .canopy-clip-circle{transition:r 1.2s var(--ease);}
.tree-bg .canopy-logo{opacity:.5;}

.tree-caption{
  text-align:center;margin:0 0 18px;font-family:var(--serif-head);font-weight:600;
  font-size:.92rem;color:var(--black);
  transition:opacity .3s var(--ease);
}
.tree-caption .step-of{
  display:block;font-family:var(--sans-body);font-weight:600;font-size:.68rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--orange-deep);margin-bottom:4px;
}

/* ---------- progress dots ---------- */
.steps{
  display:flex;justify-content:center;align-items:center;gap:0;
  margin:22px auto 34px;max-width:420px;position:relative;z-index:1;
}
.step-item{display:flex;flex-direction:column;align-items:center;flex:1;position:relative;}
.step-item:not(:last-child)::after{
  content:"";position:absolute;top:9px;left:calc(50% + 16px);right:calc(-50% + 16px);
  height:2px;background:rgba(61,59,55,.18);z-index:0;
}
.step-item.done:not(:last-child)::after{background:var(--orange);}
.step-dot{
  width:20px;height:20px;border-radius:50%;
  background:var(--cream);border:2px solid rgba(61,59,55,.28);
  display:flex;align-items:center;justify-content:center;
  font-size:.66rem;font-weight:700;color:var(--steel);z-index:1;
  transition:background .35s var(--ease),border-color .35s var(--ease),color .35s var(--ease);
}
.step-item.active .step-dot{border-color:var(--orange);color:var(--orange-deep);background:#fff;}
.step-item.done .step-dot{background:var(--orange);border-color:var(--orange);color:var(--cream);}
.step-label{
  margin-top:8px;font-size:.7rem;color:var(--steel);text-align:center;
  letter-spacing:.02em;
}
.step-item.active .step-label{color:var(--black);font-weight:600;}
@media(max-width:480px){.step-label{display:none;}}

.card{
  background:rgba(12,12,12,.96);
  border-radius:24px;
  padding:44px 40px;
  box-shadow:0 24px 60px rgba(0,0,0,.18);
  position:relative;z-index:1;
  overflow:hidden;
  transition:background-color 1s var(--ease),box-shadow 1s var(--ease);
}
/* a cada "Continuar", o fundo preto vai clareando bem mais e revelando a árvore atrás,
   com um brilho dourado que cresce junto — o card "acorda" conforme o cliente avança */
.card-shell[data-step="2"] .card{
  background:rgba(12,12,12,.80);
  box-shadow:0 24px 60px rgba(0,0,0,.18), 0 0 0 1px rgba(243,201,139,.1);
}
.card-shell[data-step="3"] .card{
  background:rgba(12,12,12,.60);
  box-shadow:0 24px 65px rgba(0,0,0,.2), 0 0 34px rgba(243,201,139,.16), 0 0 0 1px rgba(243,201,139,.16);
}
.card-shell[data-step="4"] .card{
  background:rgba(12,12,12,.40);
  box-shadow:0 24px 70px rgba(0,0,0,.24), 0 0 55px rgba(243,201,139,.24), 0 0 0 1px rgba(243,201,139,.24);
}
.card-shell[data-step="done"] .card{
  background:rgba(12,12,12,.20);
  box-shadow:0 24px 80px rgba(0,0,0,.3), 0 0 80px rgba(243,201,139,.34), 0 0 0 1px rgba(243,201,139,.34);
}
@media(max-width:560px){.card{padding:32px 22px;}}

.slide{display:none;}
.slide.active{display:block;animation:slideIn .5s var(--ease);}
@keyframes slideIn{
  from{opacity:0;transform:translateY(14px);}
  to{opacity:1;transform:translateY(0);}
}

.slide-eyebrow{
  font-weight:600;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold);margin-bottom:10px;text-shadow:0 1px 3px rgba(0,0,0,.7);
}
.slide-title{
  font-family:var(--serif-head);font-weight:600;color:var(--cream);font-size:1.28rem;
  margin-bottom:10px;text-shadow:0 1px 4px rgba(0,0,0,.7);
}
.slide-hint{color:var(--gray);font-size:.9rem;margin-bottom:28px;line-height:1.7;max-width:480px;text-shadow:0 1px 3px rgba(0,0,0,.6);}

.block{margin-bottom:22px;}
.block:last-of-type{margin-bottom:0;}

form label{display:block;margin-bottom:16px;}
.card .lbl{
  display:block;font-size:.72rem;font-weight:600;letter-spacing:.06em;
  color:var(--gold);text-transform:uppercase;margin-bottom:8px;
  text-shadow:0 1px 3px rgba(0,0,0,.7);
}
.card .lbl em{color:var(--steel);font-style:normal;text-transform:none;letter-spacing:0;font-weight:500;text-shadow:none;}

.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
@media(max-width:560px){.field-row{grid-template-columns:1fr;}}

form input,form textarea{
  width:100%;background:#121212;
  border:1px solid rgba(245,242,236,.16);border-radius:12px;
  padding:13px 15px;color:var(--cream);
  font-family:var(--sans-body);font-size:.95rem;
  transition:border-color .3s var(--ease);
  color-scheme:dark;
}
form input::placeholder,form textarea::placeholder{color:var(--steel);}
form input:focus,form textarea:focus{
  outline:none;border-color:var(--orange);background:#171717;
}
form textarea{resize:vertical;min-height:110px;line-height:1.6;}
form textarea.sm{min-height:80px;}

.radio-pills{display:flex;gap:10px;flex-wrap:wrap;}
.radio-pills input{position:absolute;opacity:0;pointer-events:none;}
.radio-pills label{
  display:inline-flex;margin:0;padding:11px 18px;border-radius:100px;
  background:#121212;border:1px solid rgba(245,242,236,.16);
  color:var(--gray);font-size:.88rem;cursor:pointer;
  transition:background .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease);
}
.radio-pills input:checked + label{
  background:var(--orange);border-color:var(--orange);color:var(--black);font-weight:600;
}

.hp-field{position:absolute;left:-9999px;width:0;height:0;opacity:0;pointer-events:none;}

.slide-actions{
  display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:32px;
}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--sans-body);font-weight:600;font-size:.92rem;
  padding:14px 26px;border-radius:100px;cursor:pointer;border:none;
  transition:background .3s var(--ease),transform .3s var(--ease),opacity .3s;
  text-decoration:none;
}
.btn-back{background:transparent;color:var(--gray);padding:14px 10px;}
.btn-back:hover{color:var(--cream);}
.btn-back:disabled{opacity:0;pointer-events:none;}
.btn-next,.btn-submit{background:var(--orange);color:var(--black);flex:1;max-width:220px;margin-left:auto;}
.btn-next:hover,.btn-submit:hover{background:var(--gold);transform:translateY(-2px);}
.btn-submit:disabled{opacity:.6;cursor:default;transform:none;}

.form-feedback{margin-top:16px;font-size:.85rem;text-align:center;min-height:1.2em;}
.form-feedback.ok{color:#93d6a3;}
.form-feedback.err{color:#e8a3a3;}

.success{
  text-align:center;padding:38px 30px;
  background:rgba(12,12,12,.55);border-radius:20px;
  animation:slideIn .6s var(--ease);
}
.success-logo{
  width:88px;height:88px;border-radius:50%;margin:0 auto 22px;
  background:radial-gradient(circle at 35% 28%, rgba(243,201,139,.4), rgba(232,121,43,.14));
  display:flex;align-items:center;justify-content:center;
  animation:logoAppear 1s var(--ease) .15s both;
}
.success-logo img{width:52px;height:52px;object-fit:contain;}
@keyframes logoAppear{
  from{opacity:0;transform:scale(.55);}
  to{opacity:1;transform:scale(1);}
}
.success h2{color:var(--cream);font-size:1.4rem;margin-bottom:12px;}
.success p{color:var(--gray);max-width:440px;margin:0 auto;}
.success .btn-submit{display:inline-flex;margin:24px auto 0;}

.footnote{text-align:center;color:var(--steel);font-size:.82rem;margin-top:28px;}
.footnote a{color:var(--orange-deep);font-weight:600;text-decoration:none;}

/* ---------- login card ---------- */
.login-card{
  background:var(--black);border-radius:24px;padding:44px 40px;
  box-shadow:0 24px 60px rgba(0,0,0,.18);
}
@media(max-width:560px){.login-card{padding:32px 22px;}}
.login-card .btn-submit{width:100%;max-width:none;margin:26px 0 0;}

/* ---------- dashboard ---------- */
.dash-card{
  background:var(--black);border-radius:24px;padding:40px;
  box-shadow:0 24px 60px rgba(0,0,0,.18);text-align:center;
}
@media(max-width:560px){.dash-card{padding:30px 20px;}}
.dash-greeting{color:var(--gray);font-size:.92rem;margin-bottom:6px;}
.dash-title{font-family:var(--serif-head);color:var(--cream);font-size:1.5rem;margin-bottom:30px;}

.cta-btn{
  display:block;width:100%;text-align:center;
  background:linear-gradient(135deg,var(--orange),var(--orange-deep));
  color:var(--black);font-family:var(--serif-head);font-weight:700;
  font-size:1.15rem;line-height:1.35;padding:30px 24px;border-radius:20px;
  text-decoration:none;border:none;cursor:pointer;
  box-shadow:0 14px 34px rgba(232,121,43,.35);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.cta-btn:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(232,121,43,.45);}
.cta-btn .cta-eyebrow{
  display:block;font-family:var(--sans-body);font-weight:700;font-size:.7rem;
  letter-spacing:.18em;text-transform:uppercase;color:rgba(12,12,12,.6);margin-bottom:8px;
}
.cta-btn .cta-sub{
  display:block;font-family:var(--sans-body);font-weight:500;font-size:.85rem;
  color:rgba(12,12,12,.72);margin-top:8px;line-height:1.5;
}

.secondary-link{
  display:inline-flex;align-items:center;gap:8px;margin-top:24px;
  color:var(--gray);font-size:.9rem;font-weight:600;text-decoration:none;
  padding:10px 18px;border-radius:100px;border:1px solid rgba(245,242,236,.16);
  transition:all .3s var(--ease);
}
.secondary-link:hover{color:var(--cream);border-color:var(--gold);}

.placeholder-icon{
  width:64px;height:64px;border-radius:50%;margin:0 auto 22px;
  background:rgba(243,201,139,.12);border:1px solid rgba(243,201,139,.3);
  display:flex;align-items:center;justify-content:center;font-size:1.6rem;
}