@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&family=Lato:wght@400;700;900&display=swap');

/* =========================================================
   FOUNDER MARKETING — Briefing pós-compra
   ID Visual v2 — Poppins/Lato, paleta âmbar/magenta/violeta/preto
   ========================================================= */

:root{
  /* Paleta oficial */
  --black:#0E0B0F;
  --black-1:#1a1418;
  --black-2:#3b3338;
  --ink-3:#6a6066;
  --ink-4:#9a8f96;
  --ink-5:#c9c1c6;

  --amber:#E0903E;
  --amber-deep:#b56e26;
  --amber-soft:#fdf1e0;

  --magenta:#DD2E86;
  --magenta-deep:#a91d63;
  --magenta-soft:#fde6f1;

  --violet:#5B2E63;
  --violet-deep:#3d1f44;
  --violet-soft:#f0e9f3;

  --paper:#faf7f2;
  --paper-2:#f2ece2;
  --surface:#ffffff;
  --rule:#e7e1d6;
  --rule-strong:#d1c9bb;

  /* Aliases legados (mantém compatibilidade caso algum HTML use as antigas) */
  --orange:#E0903E;
  --orange-deep:#b56e26;
  --orange-soft:#fdf1e0;
  --ink:#0E0B0F;
  --ink-1:#1a1418;
  --ink-2:#3b3338;

  /* Degradê assinatura (violet → magenta → amber) */
  --grad:linear-gradient(90deg,#5B2E63 0%,#7E2B6A 28%,#DD2E86 58%,#E0903E 100%);
  --grad-soft:linear-gradient(135deg,rgba(91,46,99,.18) 0%,rgba(221,46,134,.16) 50%,rgba(224,144,62,.18) 100%);

  --font-display:'Poppins','Outfit',system-ui,-apple-system,sans-serif;
  --font-body:'Lato','Inter',system-ui,-apple-system,sans-serif;
  --font:'Poppins','Outfit',system-ui,-apple-system,sans-serif;

  --pill:999px;
  --ease:cubic-bezier(.4,.0,.2,1);
  --shadow:0 1px 0 rgba(0,0,0,.02), 0 8px 24px -12px rgba(0,0,0,.1);
  --shadow-lg:0 1px 0 rgba(0,0,0,.04), 0 24px 60px -20px rgba(0,0,0,.2);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);
  font-weight:400;
  background:var(--paper);
  color:var(--black-1);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  min-height:100dvh;
}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
img,svg{display:block;max-width:100%}

/* =========================================================
   HERO ESCURO — base preta com brilho do degradê
   ========================================================= */
.hero{
  background:var(--black);color:#f1ede7;
  padding:0;position:relative;overflow:hidden;
}
.hero::before{
  content:"";position:absolute;
  top:-30%;right:-20%;width:75%;height:140%;
  background:radial-gradient(ellipse at 40% 50%,
    rgba(221,46,134,.32) 0%,
    rgba(91,46,99,.24) 38%,
    transparent 70%);
  filter:blur(8px);
  pointer-events:none;
}
.hero::after{
  content:"";position:absolute;
  bottom:-20%;left:-10%;width:55%;height:80%;
  background:radial-gradient(ellipse at center,
    rgba(224,144,62,.2) 0%,
    transparent 65%);
  pointer-events:none;
}
.hero__container{
  max-width:1080px;margin:0 auto;padding:24px 32px 96px;
  position:relative;z-index:1;
}
.hero__topbar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding-bottom:56px;
}
.hero__logo{
  display:inline-flex;align-items:center;height:38px;
}
.hero__logo img{
  height:100%;width:auto;display:block;object-fit:contain;
  filter:brightness(0) invert(1);
}
.hero__stamp{
  font-family:var(--font-display);
  font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  font-weight:600;color:rgba(255,255,255,.7);
  border:1px solid rgba(255,255,255,.18);
  padding:8px 14px;border-radius:var(--pill);
}
.hero__body{max-width:780px}
.hero__eyebrow{
  display:inline-block;
  font-family:var(--font-display);
  font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;
  font-weight:700;color:var(--amber);margin-bottom:24px;
}
.hero__title{
  font-family:var(--font-display);font-weight:800;
  font-size:clamp(38px,5.4vw,68px);
  line-height:1.02;letter-spacing:-.025em;color:#fff;
}
.hero__title em,
.hero__title .mark{
  font-style:normal;
  background:linear-gradient(90deg,#DD2E86 0%,#E0903E 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero__intro{
  margin-top:24px;font-family:var(--font-body);
  font-size:17.5px;line-height:1.6;
  color:rgba(255,255,255,.82);max-width:62ch;font-weight:400;
}
.hero__intro + .hero__intro{margin-top:14px}
.hero__intro strong{color:#fff;font-weight:700}
.hero__meta{
  margin-top:44px;display:inline-flex;align-items:center;gap:14px;
  padding:12px 18px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  border-radius:var(--pill);
  backdrop-filter:blur(8px);
}
.hero__meta-label{
  font-family:var(--font-display);
  font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;
  font-weight:600;color:rgba(255,255,255,.6);
}
.hero__meta-value{
  font-family:var(--font-body);
  font-size:14.5px;font-weight:700;color:#fff;
}

/* Faixa degradê assinatura entre hero e formulário */
.hero-divider{
  height:4px;width:100%;background:var(--grad);
}

/* =========================================================
   FORMULÁRIO
   ========================================================= */
.form-wrap{
  background:var(--paper);
  padding:80px 32px 96px;
}
form#diagnosticoForm{
  max-width:760px;margin:0 auto;
  display:flex;flex-direction:column;gap:64px;
}

/* Bloco — versões antigas e novas das classes */
.block{display:flex;flex-direction:column;gap:28px;margin-top:0}
.block__head,
.block__header{display:flex;flex-direction:column;gap:14px;margin-bottom:8px}

.block__num,
.block__number{
  font-family:var(--font-display);
  font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;
  font-weight:700;color:var(--amber);
  display:inline-flex;align-items:center;gap:12px;
}
.block__num::after,
.block__number::after{
  content:"";flex:0 0 60px;width:60px;height:2px;
  background:linear-gradient(90deg,var(--amber) 0%,var(--magenta) 100%);
  border-radius:2px;opacity:.9;
}
.block__title{
  font-family:var(--font-display);font-weight:800;
  font-size:clamp(28px,3.6vw,38px);
  line-height:1.1;letter-spacing:-.018em;color:var(--black);
}
.block__title em,
.block__title .mark{
  font-style:normal;
  background:linear-gradient(90deg,var(--violet) 0%,var(--magenta) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.block__intro{
  margin-top:0;padding:16px 20px;
  background:var(--violet-soft);
  border-left:3px solid var(--magenta);
  border-radius:0 10px 10px 0;
  font-family:var(--font-body);
  font-size:15px;line-height:1.6;color:var(--black-2);
}

/* Bloco identificação (card branco) */
.ident{
  display:flex;flex-direction:column;gap:18px;
  padding:32px;
  background:var(--surface);
  border:1px solid var(--rule);
  border-radius:18px;
  box-shadow:var(--shadow);
}
.ident__title{
  font-family:var(--font-display);font-weight:700;font-size:18px;
  letter-spacing:-.005em;color:var(--black);
  text-transform:none;
}
.ident__grid{
  display:grid;grid-template-columns:1fr 1fr;gap:18px;
}
@media (max-width:640px){
  .ident{padding:24px}
  .ident__grid{grid-template-columns:1fr}
}

/* Pergunta */
.q,
.field{display:flex;flex-direction:column;gap:8px}
.q__label,
.field__label{
  font-family:var(--font-display);
  font-size:15.5px;font-weight:600;color:var(--black);
  letter-spacing:-.003em;line-height:1.4;
  display:block;
}
.q__label .num,
.field__label .num{
  font-family:var(--font-display);
  color:var(--magenta);font-weight:700;margin-right:6px;
}
.q__label .req,
.field__label .req{
  color:var(--magenta);margin-left:4px;font-weight:700;
}
.q__sub,
.field__hint{
  font-family:var(--font-body);
  font-size:13.5px;color:var(--ink-3);line-height:1.55;
  margin-top:-2px;display:block;
}

/* Inputs */
.field__input,
.input,
.field input[type=text],
.field input[type=email],
.field input[type=url],
.field input[type=tel],
.field input[type=number],
.field textarea,
.field select,
input[type=text],
input[type=email],
input[type=url],
input[type=tel],
input[type=number],
.textarea,
textarea,
select{
  font-family:var(--font-body);
  font-size:15px;font-weight:500;
  background:var(--surface);
  border:1.5px solid var(--rule);
  border-radius:14px;
  padding:14px 18px;
  color:var(--black);
  outline:none;
  transition:border-color .15s var(--ease), background .15s var(--ease), box-shadow .15s var(--ease);
  width:100%;
  resize:vertical;
  display:block;
}
input::placeholder, textarea::placeholder{color:var(--ink-4);font-weight:400}
input:focus, textarea:focus, select:focus{
  border-color:var(--violet);
  box-shadow:0 0 0 4px rgba(91,46,99,.1);
}
textarea, .textarea{min-height:120px;line-height:1.6}

/* Linha (2 campos lado a lado) */
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:640px){.field-row{grid-template-columns:1fr}}

/* Radios / Checks */
.choices,
.options{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.choice,
.opt{
  display:flex;align-items:flex-start;gap:14px;
  padding:14px 18px;
  background:var(--surface);
  border:1.5px solid var(--rule);
  border-radius:12px;
  cursor:pointer;
  transition:border-color .15s var(--ease), background .15s var(--ease);
  font-family:var(--font-body);
  font-size:14.5px;font-weight:500;color:var(--black-1);line-height:1.5;
}
.choice:hover,
.opt:hover{border-color:var(--ink-3)}
.choice input,
.opt input{
  flex:0 0 18px;margin-top:2px;
  accent-color:var(--magenta);
  width:18px;height:18px;cursor:pointer;
}
.opt__box{display:none}
.opt__text{flex:1}
.choice:has(input:checked),
.opt:has(input:checked){
  border-color:var(--magenta);
  background:var(--magenta-soft);
}

/* Platforms — input URL inline por plataforma */
.platforms{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px;margin-top:8px;
}
.platform{
  display:flex;align-items:center;gap:14px;
  padding:6px 8px 6px 18px;
  background:var(--surface);
  border:1.5px solid var(--rule);
  border-radius:12px;
  transition:border-color .15s var(--ease), box-shadow .15s var(--ease);
}
.platform:focus-within{
  border-color:var(--violet);
  box-shadow:0 0 0 4px rgba(91,46,99,.1);
}
.platform__label{
  font-family:var(--font-display);
  font-weight:600;color:var(--black);font-size:14px;
  flex:0 0 auto;min-width:90px;
  letter-spacing:-.003em;
}
.platform input,
.platform input[type=url],
.platform input[type=text]{
  flex:1;min-width:0;
  font-family:var(--font-body);font-size:14.5px;font-weight:500;
  background:transparent;
  border:0;border-radius:0;
  padding:10px 12px;
  color:var(--black);
  outline:none;
  width:auto;height:auto;
  box-shadow:none;
}
.platform input::placeholder{color:var(--ink-4);font-weight:400}
.platform:has(input:not(:placeholder-shown):valid){
  border-color:var(--amber);
}

/* Submit / Footer do form */
.submit,
.form-footer{
  margin-top:48px;padding-top:48px;
  border-top:1px solid var(--rule);
  display:flex;flex-direction:column;gap:18px;align-items:flex-start;
}
.submit__note,
.form-footer__note{
  font-family:var(--font-body);
  font-size:14px;color:var(--ink-3);line-height:1.6;max-width:54ch;
}

/* Botões — primário em âmbar */
.btn{
  font-family:var(--font-display);
  font-weight:700;font-size:15.5px;
  border-radius:var(--pill);
  padding:18px 32px;
  display:inline-flex;align-items:center;gap:12px;
  transition:background .18s var(--ease), color .18s var(--ease), transform .18s var(--ease), box-shadow .18s var(--ease);
  cursor:pointer;line-height:1;border:1px solid transparent;
  letter-spacing:-.005em;
}
.btn-primary,
.btn--primary,
button[type=submit],
input[type=submit],
.submit-btn,
button.submit-btn{
  background:var(--amber);color:#fff;
  font-family:var(--font-display);font-weight:700;font-size:15.5px;
  letter-spacing:-.005em;
  border-radius:var(--pill);padding:18px 32px;
  border:0;cursor:pointer;line-height:1;
  display:inline-flex;align-items:center;gap:12px;
  box-shadow:0 6px 24px -8px rgba(224,144,62,.55);
  transition:background .18s var(--ease), transform .18s var(--ease), box-shadow .18s var(--ease);
}
.btn-primary:hover,
.btn--primary:hover,
button[type=submit]:hover,
input[type=submit]:hover,
.submit-btn:hover{
  background:var(--amber-deep);transform:translateY(-1px);
  box-shadow:0 12px 28px -8px rgba(224,144,62,.6);
}

/* Estado erro */
.field.error .field__input,
.field.error input,
.field.error textarea,
.field.error select,
.q.error input,
.q.error textarea{
  border-color:#dc2626;
}
.field__error,
.q__error{
  font-family:var(--font-body);
  font-size:13px;color:#dc2626;margin-top:4px;
}

/* Sucesso */
.success-wrap{
  background:var(--paper);
  padding:80px 32px 96px;
  display:flex;justify-content:center;
}
.success-card{
  max-width:640px;width:100%;
  background:var(--surface);
  border:1px solid var(--rule);
  border-radius:24px;
  padding:48px 44px;
  box-shadow:var(--shadow);
  text-align:left;
  position:relative;overflow:hidden;
}
.success-card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;
  background:var(--grad);
}
.success-card h2{
  font-family:var(--font-display);font-weight:800;
  font-size:clamp(28px,3.6vw,38px);
  line-height:1.1;letter-spacing:-.018em;color:var(--black);
}
.success-card h2 em,
.success-card h2 .mark{
  font-style:normal;
  background:linear-gradient(90deg,var(--violet) 0%,var(--magenta) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.success-card p{
  margin-top:14px;font-family:var(--font-body);
  font-size:16px;line-height:1.65;color:var(--black-2);
}

/* Footer global */
.foot,
.footer{
  background:var(--black);color:rgba(255,255,255,.6);
  padding:32px;font-family:var(--font-body);
  font-size:12.5px;text-align:center;
  position:relative;
}
.foot::before,
.footer::before{
  content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:var(--grad);opacity:.8;
}
.footer__container{
  max-width:1080px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  text-align:left;
}
.footer__logo{display:inline-flex;align-items:center;height:24px}
.footer__logo img{height:100%;width:auto;filter:brightness(0) invert(1);opacity:.85}
.footer__copy{font-size:12.5px;color:rgba(255,255,255,.6)}
.footer__contact{font-size:12.5px;color:rgba(255,255,255,.6)}
.footer__contact a{color:#fff;font-weight:700;border-bottom:1px solid rgba(255,255,255,.3)}

/* Espaçamento entre perguntas dentro de um bloco */
.block .q + .q,
.block .q + .platforms,
.block .platforms + .q{margin-top:14px}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:640px){
  .hero__container{padding:20px 22px 72px}
  .hero__topbar{padding-bottom:36px}
  .form-wrap{padding:56px 22px 72px}
  form#diagnosticoForm{gap:48px}
  .success-wrap{padding:56px 22px}
  .success-card{padding:36px 26px}
  .block__num::after,
  .block__number::after{display:none}
  .platform{flex-direction:column;align-items:flex-start;gap:6px}
  .platform__label{min-width:0}
  .platform input{width:100%}
}

@media (prefers-reduced-motion:reduce){
  *{transition-duration:.001ms !important;animation-duration:.001ms !important}
}


/* === Ajustes finos === */
.hero__stamp{display:none !important}
.hero__meta{
  margin-top:36px;
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  backdrop-filter:none !important;
  border-radius:0 !important;
}
.hero__meta-label{color:rgba(255,255,255,.55)}
.hero__meta-value{color:#fff}

/* Botão Enviar — degradê magenta→âmbar igual ao destaque do título */
.submit,
.form-footer{
  margin-top:24px !important;
  padding-top:24px !important;
  border-top:0 !important;
}
button[type=submit],
input[type=submit],
.submit-btn,
button.submit-btn,
.btn-primary,
.btn--primary{
  background:linear-gradient(90deg,#DD2E86 0%,#E0903E 100%) !important;
  box-shadow:0 8px 28px -10px rgba(221,46,134,.5), 0 8px 28px -10px rgba(224,144,62,.45) !important;
}
button[type=submit]:hover,
input[type=submit]:hover,
.submit-btn:hover,
.btn-primary:hover,
.btn--primary:hover{
  background:linear-gradient(90deg,#c4256f 0%,#b87024 100%) !important;
  transform:translateY(-1px);
  box-shadow:0 14px 34px -10px rgba(221,46,134,.55), 0 14px 34px -10px rgba(224,144,62,.5) !important;
}

/* =========================================================
   Página de obrigado (obrigado.html) · refeita em 23/09/2026
   com os tokens deste arquivo (as regras antigas se perderam
   na migração para a ID Visual v2)
   ========================================================= */
.hero--thanks{padding-bottom:8px}
.thanks-hero__body{max-width:760px}
.thanks-hero__title{
  font-family:var(--font-display);font-weight:800;
  font-size:clamp(34px,5vw,60px);line-height:1.05;letter-spacing:-.025em;
  color:#fff;margin:0 0 28px;
}
.thanks-hero__title em{
  font-style:normal;
  background:linear-gradient(90deg,#DD2E86 0%,#E0903E 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.thanks-hero__lead{
  font-family:var(--font-body);font-size:17.5px;line-height:1.6;
  color:rgba(255,255,255,.82);max-width:62ch;margin:0 0 16px;
}
.thanks-hero__lead strong,
.thanks-hero__lead .mark{color:#fff;font-weight:700}
.thanks-tipo[hidden]{display:none}
.ig-cta-section{margin-top:48px;padding-top:32px;border-top:1px solid rgba(255,255,255,.12);max-width:62ch}
.ig-cta-section__eyebrow{
  font-family:var(--font-display);font-size:11.5px;letter-spacing:.22em;
  text-transform:uppercase;font-weight:700;color:rgba(255,255,255,.6);margin:0 0 12px;
}
.ig-cta-section__text{font-size:16.5px;line-height:1.6;color:rgba(255,255,255,.82);margin:0 0 20px}
.ig-cta{
  display:inline-flex;align-items:center;gap:12px;color:#fff;text-decoration:none;
  border:1.5px solid rgba(255,255,255,.35);border-radius:var(--pill);padding:12px 22px;
  font-family:var(--font-display);font-size:15px;font-weight:600;
  transition:background .15s var(--ease),border-color .15s var(--ease);
}
.ig-cta:hover{background:linear-gradient(90deg,#DD2E86 0%,#E0903E 100%);border-color:transparent}
.ig-cta__icon{width:20px;height:20px;flex:none;display:block}
.ig-cta__arrow{font-size:16px}
