/* BPOLink · site institucional · Design System v2.0 (paleta 2.0, 02/10/2026)
   Layout: cabeçalho fixo em painel; hero em duas colunas que empilham no celular;
   seções com título à esquerda e texto de apoio à direita; fundo liso com dois brilhos. */
/* ============================================================
   1. TOKENS CANONICOS · PALETA 2.0 (02/10/2026)
   Fonte: base Notion "BPOLINK - Design Tokens 2.0 · Paleta vigente".
   ESCURO em :root (vale sem JavaScript); CLARO em [data-theme="light"]
   e, sem escolha salva, pela preferencia do sistema.
   ============================================================ */
:root{
  color-scheme:dark;
  /* -- marca -- */
  --logo-green:#5EBD2E; --logo-blue:#6FA4FF;
  --blue:#3D7BFF; --blue-hi:#5B95FF; --blue-deep:#2356E0; --cyan:#3CC8FF;

  /* -- texto -- */
  --ink:#F2F6FF; --ink-2:#C9D4F0; --muted:#8C9CC4; --placeholder:#6F80A8;
  --on-accent:#FFFFFF; --link:#5B95FF;

  /* -- ambiente: fundo liso + dois brilhos -- */
  --ground:#03070F; --card-a:#050B1A; --card-b:#08142E;
  --glow1:rgba(61,123,255,.28); --glow2:rgba(60,200,255,.14); --overlay:rgba(1,4,12,.72);

  /* -- superficie -- */
  --panel:rgba(5,11,26,.78); --panel-solid:#060E22;
  --field:rgba(8,20,46,.7); --field-ro:rgba(8,20,46,.35);
  --tile-a:rgba(13,30,68,.8); --tile-b:rgba(8,20,46,.6); --pill-bg:#0D1E44;
  --border:rgba(61,123,255,.22); --line:#1A2C57; --line-2:#12214A;
  --shadow:rgba(35,86,224,.55); --hover:rgba(61,123,255,.08);

  /* -- estados: cor . texto . fundo . borda -- */
  --red:#FF4D61; --red-ink:#FF7A89; --red-bg:#2A0D18; --red-line:rgba(255,77,97,.45);
  --green:#8FD35A; --green-ink:#A8E57A; --green-bg:#142A10; --green-line:rgba(143,211,90,.45);
  --warn-ink:#F2B84B; --warn-bg:#2A1E08; --warn-line:rgba(242,184,75,.45);
  --info-ink:#3CC8FF; --info-bg:rgba(60,200,255,.12); --info-line:rgba(60,200,255,.4);
  --neutral-ink:#C9D4F0; --neutral-bg:rgba(201,212,240,.08); --neutral-line:rgba(201,212,240,.22);

  /* -- graficos -- */
  --cat1:#3D7BFF; --cat2:#D3589A; --cat3:#B57D1C; --cat4:#7D8BAE;
  --series:#3CC8FF; --kind-close:#C9D4F0;

  /* -- aliases de componente: derivados, nenhuma cor nova -- */
  --accent-solid:var(--blue-deep);
  --accent-soft:color-mix(in srgb, var(--blue) 16%, transparent);
  --accent-ring:color-mix(in srgb, var(--blue) 30%, transparent);

  /* -- forma -- */
  --r:20px; --r-sm:13px; --r-ctl:12px; --r-btn:11px; --r-cell:9px;

  /* -- tipografia -- */
  --font-display:"Ubuntu", system-ui, -apple-system, sans-serif;
  --font-ui:"Montserrat", system-ui, -apple-system, sans-serif;
  --maxw:1180px;
}
html[data-theme="light"]{
  color-scheme:light;
  --logo-blue:#004AAD;
  --blue:#2A62F0; --blue-hi:#4A85FF; --blue-deep:#1840C4; --cyan:#0A76A8;
  --ink:#0A1633; --ink-2:#33456E; --muted:#56678F; --placeholder:#7A88AA; --link:#1F55D6;
  --ground:#E4EAF5; --card-a:#FFFFFF; --card-b:#F1F5FE;
  --glow1:rgba(61,123,255,.14); --glow2:rgba(10,155,214,.09); --overlay:rgba(10,22,51,.45);
  --panel:rgba(255,255,255,.92); --panel-solid:#FFFFFF;
  --field:#FFFFFF; --field-ro:#F1F5FE;
  --tile-a:#F7F9FF; --tile-b:#EDF2FC; --pill-bg:#FFFFFF;
  --border:rgba(35,86,224,.18); --line:#D3DCEE; --line-2:#E6ECF7;
  --shadow:rgba(35,86,224,.22); --hover:rgba(42,98,240,.06);
  --red:#D92D45; --red-ink:#B41E35; --red-bg:#FDECEF; --red-line:rgba(217,45,69,.35);
  --green:#3F8F22; --green-ink:#2E7616; --green-bg:#EAF6E2; --green-line:rgba(63,143,34,.35);
  --warn-ink:#8A5A00; --warn-bg:#FDF3E1; --warn-line:rgba(138,90,0,.3);
  --info-ink:#0A6A99; --info-bg:rgba(10,155,214,.10); --info-line:rgba(10,155,214,.35);
  --neutral-ink:#33456E; --neutral-bg:rgba(51,69,110,.07); --neutral-line:rgba(51,69,110,.2);
  --cat1:#2A62F0; --cat2:#C23F87; --cat3:#A86C0C; --cat4:#7E8AA8;
  --series:#0A9BD6; --kind-close:#33456E;
  --accent-solid:var(--blue);
  --accent-soft:color-mix(in srgb, var(--blue) 10%, transparent);
}
@media (prefers-color-scheme: light){
  html:not([data-theme="dark"]){
    color-scheme:light;
    --logo-blue:#004AAD;
    --blue:#2A62F0; --blue-hi:#4A85FF; --blue-deep:#1840C4; --cyan:#0A76A8;
    --ink:#0A1633; --ink-2:#33456E; --muted:#56678F; --placeholder:#7A88AA; --link:#1F55D6;
    --ground:#E4EAF5; --card-a:#FFFFFF; --card-b:#F1F5FE;
    --glow1:rgba(61,123,255,.14); --glow2:rgba(10,155,214,.09); --overlay:rgba(10,22,51,.45);
    --panel:rgba(255,255,255,.92); --panel-solid:#FFFFFF;
    --field:#FFFFFF; --field-ro:#F1F5FE;
    --tile-a:#F7F9FF; --tile-b:#EDF2FC; --pill-bg:#FFFFFF;
    --border:rgba(35,86,224,.18); --line:#D3DCEE; --line-2:#E6ECF7;
    --shadow:rgba(35,86,224,.22); --hover:rgba(42,98,240,.06);
    --red:#D92D45; --red-ink:#B41E35; --red-bg:#FDECEF; --red-line:rgba(217,45,69,.35);
    --green:#3F8F22; --green-ink:#2E7616; --green-bg:#EAF6E2; --green-line:rgba(63,143,34,.35);
    --warn-ink:#8A5A00; --warn-bg:#FDF3E1; --warn-line:rgba(138,90,0,.3);
    --info-ink:#0A6A99; --info-bg:rgba(10,155,214,.10); --info-line:rgba(10,155,214,.35);
    --neutral-ink:#33456E; --neutral-bg:rgba(51,69,110,.07); --neutral-line:rgba(51,69,110,.2);
    --cat1:#2A62F0; --cat2:#C23F87; --cat3:#A86C0C; --cat4:#7E8AA8;
    --series:#0A9BD6; --kind-close:#33456E;
    --accent-solid:var(--blue);
    --accent-soft:color-mix(in srgb, var(--blue) 10%, transparent);
  }
}


/* ---------- base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
*{ margin:0; padding:0; }
[hidden]{ display:none !important; }
html{ scroll-behavior:smooth; scroll-padding-top:92px; }
body{ font-family:var(--font-ui); color:var(--ink); background:var(--ground); min-height:100vh; line-height:1.6; font-weight:500; font-size:1rem; -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:500; line-height:1.12; text-wrap:balance; }
a{ color:var(--link); text-decoration:none; }
img{ max-width:100%; }
button,input,textarea{ font:inherit; color:inherit; }
button{ cursor:pointer; }
button,a,input,textarea,summary{ touch-action:manipulation; }
:focus-visible{ outline:2px solid var(--cyan); outline-offset:2px; border-radius:6px; }

/* fundo: liso, dois brilhos fixos, sem grade/pontos/orbes */
.bg{ position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(70% 55% at 18% -8%, var(--glow1), transparent 60%), radial-gradient(50% 40% at 88% 108%, var(--glow2), transparent 70%), var(--ground); }

/* painel */
.glass{ background:var(--panel); backdrop-filter:blur(18px) saturate(140%); -webkit-backdrop-filter:blur(18px) saturate(140%); border:1px solid var(--line); border-radius:var(--r); box-shadow:0 24px 60px -34px var(--shadow); position:relative; min-width:0; }

.wrap{ width:100%; max-width:calc(var(--maxw) + 64px); margin-inline:auto; padding-inline:32px; }
.eyebrow{ font-family:var(--font-ui); font-size:.72rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
.skip{ position:fixed; top:-100px; left:16px; z-index:100; background:var(--accent-solid); color:var(--on-accent); padding:12px 16px; border-radius:var(--r-btn); font-weight:600; }
.skip:focus{ top:calc(env(safe-area-inset-top, 0px) + 12px); }

/* ---------- marca ---------- */
.brand{ display:inline-flex; align-items:center; gap:11px; min-height:44px; color:inherit; flex:0 0 auto; }
.brand img{ display:block; width:46px; height:auto; aspect-ratio:418 / 272; filter:drop-shadow(0 3px 7px rgba(0,0,0,.25)); }
.wm{ font-family:var(--font-ui); font-weight:400; font-size:1.32rem; line-height:1; white-space:nowrap; letter-spacing:0; }
.wm .b{ color:var(--logo-green); } .wm .l{ color:var(--logo-blue); }

/* ---------- botões ---------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:48px; padding:0 22px; border-radius:var(--r-btn); border:1px solid var(--line); background:var(--field); color:var(--ink); font-weight:600; font-size:.9rem; white-space:nowrap; transition:border-color .2s, box-shadow .2s, transform .2s; }
.btn:hover{ border-color:var(--blue); }
.btn svg{ width:17px; height:17px; flex:none; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
/* único gradiente do sistema: monocromático, de --blue a --blue-deep (4,80:1 no centro do texto, tema escuro) */
.btn-primary{ border:0; color:var(--on-accent); background:linear-gradient(180deg, var(--blue), var(--blue-deep)); box-shadow:0 12px 28px -14px var(--shadow); }
.btn-primary:hover{ transform:translateY(-1px); box-shadow:0 16px 32px -12px var(--shadow); }
.btn-sm{ min-height:42px; padding:0 16px; font-size:.84rem; }
.text-link{ display:inline-flex; align-items:center; gap:8px; min-height:44px; font-size:.9rem; font-weight:600; color:var(--link); }
.text-link svg{ width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; transition:transform .2s; }
.text-link:hover svg{ transform:translate(2px,-2px); }
.icon-btn{ width:44px; height:44px; border-radius:var(--r-ctl); border:1px solid var(--line); background:var(--field); color:var(--ink-2); display:grid; place-items:center; flex:none; }
.icon-btn:hover{ color:var(--ink); border-color:var(--blue); }
.icon-btn svg{ width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }

/* alternador de tema (DS · Ação) */
.theme-toggle{ position:relative; width:58px; height:32px; flex:0 0 auto; border-radius:50px; border:1px solid var(--line); background:var(--field); display:flex; align-items:center; justify-content:space-between; padding:0 8px; }
.theme-toggle .ti{ width:16px; height:16px; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; position:relative; z-index:1; transition:opacity .25s, filter .25s; }
.theme-toggle .sun{ stroke:var(--green); filter:drop-shadow(0 0 3px var(--green)) drop-shadow(0 0 7px var(--green)); }
.theme-toggle .moon{ stroke:var(--blue-hi); filter:drop-shadow(0 0 3px var(--blue-hi)) drop-shadow(0 0 7px var(--blue-hi)); }
.theme-toggle .knob{ position:absolute; top:3px; left:3px; width:24px; height:24px; border-radius:50%; background:var(--accent-solid); box-shadow:0 3px 9px rgba(0,0,0,.35); transition:transform .3s cubic-bezier(.4,0,.2,1); }
html[data-theme="light"] .theme-toggle .knob{ transform:translateX(26px); }
html[data-theme="light"] .theme-toggle .moon{ opacity:.22; filter:none; }
html[data-theme="dark"] .theme-toggle .sun{ opacity:.22; filter:none; }

/* ---------- estados (trio texto · fundo · borda) ---------- */
.st{ display:inline-flex; align-items:center; gap:6px; font-size:.72rem; font-weight:700; padding:3px 10px; border-radius:50px; letter-spacing:.02em; border:1px solid transparent; white-space:nowrap; }
.st::before{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; flex:none; }
.st.ok{ background:var(--green-bg); color:var(--green-ink); border-color:var(--green-line); }
.st.ok::before{ background:var(--green); }
.st.info{ background:var(--info-bg); color:var(--info-ink); border-color:var(--info-line); }
.st.mute{ background:var(--neutral-bg); color:var(--neutral-ink); border-color:var(--neutral-line); }

/* ---------- cabeçalho ---------- */
.header{ position:sticky; top:env(safe-area-inset-top, 0px); z-index:40; background:var(--panel); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
.header .wrap{ display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:76px; }
.nav{ display:flex; gap:6px; }
.nav a{ display:inline-flex; align-items:center; min-height:44px; padding:0 12px; border-radius:var(--r-ctl); font-size:.9rem; font-weight:500; color:var(--ink-2); white-space:nowrap; }
.nav a:hover{ color:var(--ink); background:var(--hover); }
.nav a.on{ color:var(--ink); background:var(--accent-soft); box-shadow:inset 0 -2px 0 var(--blue); }
.header-actions{ display:flex; align-items:center; gap:12px; }
.menu-btn{ display:none; }

/* ---------- hero ---------- */
.hero{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:64px; align-items:center; padding-block:88px 84px; }
.hero-copy > .eyebrow{ display:inline-flex; align-items:center; gap:10px; padding:6px 12px 6px 8px; border-radius:50px; border:1px solid var(--border); background:var(--accent-soft); color:var(--ink-2); letter-spacing:.12em; }
.hero-copy > .eyebrow .dot{ width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 0 4px var(--green-bg); }
.hero h1{ margin-top:24px; font-size:clamp(2.6rem, 5.2vw, 4.5rem); line-height:1.04; letter-spacing:-.03em; }
.hero h1 span{ display:block; color:var(--link); }
.lead{ margin-top:26px; font-size:1.08rem; line-height:1.8; color:var(--ink-2); max-width:34em; }
.actions{ display:flex; flex-wrap:wrap; gap:14px 26px; align-items:center; margin-top:34px; }
.trust{ display:flex; flex-wrap:wrap; gap:10px 20px; margin-top:30px; list-style:none; }
.trust li{ display:inline-flex; align-items:center; gap:8px; font-size:.84rem; color:var(--muted); }
.trust svg{ width:16px; height:16px; stroke:var(--green-ink); fill:none; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; flex:none; }

.hero-visual{ position:relative; padding-bottom:40px; }
.visual-note{ display:flex; align-items:center; gap:10px; margin-bottom:16px; font-size:.78rem; color:var(--muted); }
.visual-note::before{ content:""; width:26px; height:2px; border-radius:2px; background:var(--blue); }
.overview{ padding:28px 28px 22px; }
.overview-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:18px; }
.overview-head .eyebrow{ font-size:.66rem; }
.overview h2{ font-size:1.55rem; line-height:1.25; margin-top:8px; }
.flow{ list-style:none; margin-top:22px; }
.flow li{ display:grid; grid-template-columns:40px minmax(0,1fr) auto; align-items:center; gap:14px; padding:14px 0; border-bottom:1px solid var(--line-2); }
.flow li:last-child{ border-bottom:0; }
.flow .n{ width:40px; height:40px; border-radius:var(--r-btn); display:grid; place-items:center; background:var(--accent-soft); color:var(--ink); font-size:.82rem; font-weight:700; font-variant-numeric:tabular-nums; box-shadow:inset 3px 0 0 var(--blue); }
.flow strong{ display:block; font-size:.95rem; font-weight:600; }
.flow p{ font-size:.8rem; color:var(--muted); margin-top:2px; }
.flow .chk{ width:28px; height:28px; border-radius:50%; display:grid; place-items:center; background:var(--green-bg); border:1px solid var(--green-line); }
.flow .chk svg{ width:14px; height:14px; stroke:var(--green-ink); fill:none; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; }
.overview-foot{ display:flex; align-items:center; gap:14px; margin-top:12px; padding-top:18px; border-top:1px solid var(--line-2); font-size:.8rem; color:var(--muted); }
.overview-foot strong{ color:var(--ink-2); font-weight:600; }
.overview-foot svg{ width:24px; height:24px; flex:none; stroke:var(--link); fill:none; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.floating{ position:absolute; right:-18px; bottom:0; display:flex; align-items:center; gap:13px; padding:14px 18px; background:var(--panel-solid); }
.floating .ic{ width:38px; height:38px; border-radius:var(--r-btn); display:grid; place-items:center; background:var(--green-bg); border:1px solid var(--green-line); flex:none; }
.floating .ic svg{ width:17px; height:17px; stroke:var(--green-ink); fill:none; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.floating strong{ display:block; font-size:.86rem; font-weight:600; }
.floating p{ font-size:.76rem; color:var(--muted); }
.visual-caption{ margin-top:14px; font-size:.72rem; color:var(--muted); }

/* ---------- faixa de princípios ---------- */
.principles{ border-block:1px solid var(--line); background:var(--hover); }
.principles .wrap{ display:flex; align-items:center; justify-content:space-between; gap:18px 28px; padding-block:24px; flex-wrap:wrap; }
.principles p{ font-size:.92rem; color:var(--muted); line-height:1.45; }
.principles p strong{ color:var(--ink); font-weight:600; }
.principles ul{ display:flex; flex-wrap:wrap; gap:10px; list-style:none; }
.principles li{ display:inline-flex; align-items:center; gap:8px; padding:7px 14px; border-radius:50px; border:1px solid var(--line); background:var(--field); font-size:.84rem; font-weight:600; color:var(--ink-2); }
.principles li::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--blue); }

/* ---------- seções ---------- */
.section{ padding-block:92px; }
.section + .section{ border-top:1px solid var(--line-2); }
.sec-head{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:64px; align-items:end; margin-bottom:40px; }
.sec-head h2{ margin-top:14px; font-size:clamp(2rem, 3.2vw, 2.85rem); letter-spacing:-.02em; }
.sec-head > p{ font-size:.98rem; line-height:1.8; color:var(--ink-2); max-width:36em; }
.foot-note{ margin-top:22px; font-size:.8rem; color:var(--muted); }

/* oferta */
.offer-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.offer{ padding:30px; display:flex; flex-direction:column; }
.offer .idx{ font-size:.7rem; font-weight:700; letter-spacing:.12em; color:var(--muted); font-variant-numeric:tabular-nums; }
.offer .ic{ width:48px; height:48px; margin-block:24px 22px; border-radius:var(--r-ctl); display:grid; place-items:center; background:linear-gradient(180deg, var(--tile-a), var(--tile-b)); border:1px solid var(--line); }
.offer .ic svg{ width:22px; height:22px; stroke:var(--cyan); fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.offer h3{ font-size:1.55rem; }
.offer > p{ margin-top:14px; font-size:.92rem; line-height:1.75; color:var(--ink-2); }
.offer ul{ list-style:none; margin-top:auto; padding-top:20px; }
.offer ul::before{ content:""; display:block; height:1px; background:var(--line-2); margin-bottom:18px; margin-top:6px; }
.offer li{ position:relative; padding-left:18px; font-size:.88rem; color:var(--ink-2); line-height:1.6; margin-bottom:10px; }
.offer li::before{ content:""; position:absolute; left:0; top:.6em; width:6px; height:6px; border-radius:50%; background:var(--blue); }

/* método */
.method{ border-block:1px solid var(--line); background:var(--hover); }
.method-layout{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.65fr); gap:24px; align-items:stretch; }
.method-tabs{ display:flex; flex-direction:column; gap:10px; }
.method-tabs button{ display:flex; align-items:center; gap:14px; min-height:64px; padding:16px 18px; border-radius:var(--r-ctl); border:1px solid var(--line); background:var(--field); color:var(--ink-2); text-align:left; font-size:.95rem; font-weight:500; transition:border-color .2s, background .2s; }
.method-tabs button:hover{ border-color:var(--blue); color:var(--ink); }
.method-tabs button span{ font-size:.76rem; font-weight:700; color:var(--muted); font-variant-numeric:tabular-nums; }
.method-tabs button[aria-selected="true"]{ background:var(--accent-soft); color:var(--ink); font-weight:600; border-color:var(--border); box-shadow:inset 3px 0 0 var(--blue); }
.method-tabs button[aria-selected="true"] span{ color:var(--cyan); }
.method-panel{ padding:40px; display:flex; flex-direction:column; justify-content:center; }
.method-panel h3{ margin-top:14px; font-size:2rem; }
.method-panel > p:not(.eyebrow){ margin-top:18px; font-size:.98rem; line-height:1.8; color:var(--ink-2); max-width:38em; }
.chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:26px; }
.chips span{ padding:6px 12px; border-radius:var(--r-cell); border:1px solid var(--line); background:var(--field); font-size:.8rem; font-weight:600; color:var(--ink-2); }
.rule{ display:flex; gap:12px; align-items:flex-start; margin-top:26px; padding-top:22px; border-top:1px solid var(--line-2); font-size:.92rem; font-weight:600; color:var(--ink); }
.rule .ic{ width:26px; height:26px; border-radius:50%; display:grid; place-items:center; flex:none; background:var(--green-bg); border:1px solid var(--green-line); }
.rule .ic svg{ width:13px; height:13px; stroke:var(--green-ink); fill:none; stroke-width:2.8; stroke-linecap:round; stroke-linejoin:round; }

/* público */
.audience-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.audience{ padding:36px; display:flex; flex-direction:column; align-items:flex-start; }
.audience h3{ margin-top:14px; font-size:1.75rem; line-height:1.22; max-width:16em; }
.audience > p:not(.eyebrow){ margin-top:16px; font-size:.95rem; line-height:1.8; color:var(--ink-2); }
.audience .text-link, .audience .note{ margin-top:auto; padding-top:18px; }
.audience .note{ font-size:.8rem; color:var(--muted); }

/* implantação: sequência real, por isso numerada e ligada */
.steps{ list-style:none; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px; }
.steps li{ position:relative; padding-top:62px; }
.steps li::before{ content:""; position:absolute; top:21px; left:52px; right:-16px; height:2px; background:var(--line); }
.steps li:last-child::before{ display:none; }
.steps .num{ position:absolute; top:0; left:0; width:44px; height:44px; border-radius:50%; display:grid; place-items:center; background:var(--panel-solid); border:2px solid var(--blue); color:var(--ink); font-weight:700; font-size:.88rem; font-variant-numeric:tabular-nums; box-shadow:0 0 0 5px var(--accent-ring); }
.steps h3{ font-size:1.35rem; }
.steps p{ margin-top:12px; font-size:.9rem; line-height:1.75; color:var(--ink-2); }

/* sobre */
.about{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:72px; align-items:center; }
.about h2{ margin-top:14px; font-size:clamp(2rem, 3.2vw, 2.85rem); letter-spacing:-.02em; }
.about .copy p{ margin-top:18px; font-size:.98rem; line-height:1.8; color:var(--ink-2); }
.values{ padding:32px; }
.values dl{ margin-top:6px; }
.values dl > div{ padding-block:16px; border-top:1px solid var(--line-2); }
.values dl > div:first-child{ border-top:0; }
.values dt{ font-weight:600; font-size:.98rem; color:var(--ink); }
.values dd{ margin-top:4px; font-size:.88rem; line-height:1.7; color:var(--ink-2); }

/* faq */
.faq{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:72px; }
.faq h2{ margin-top:14px; font-size:clamp(2rem, 3.2vw, 2.85rem); letter-spacing:-.02em; }
details{ border-bottom:1px solid var(--line); }
details:first-of-type{ border-top:1px solid var(--line); }
summary{ display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:64px; padding-block:14px; cursor:pointer; list-style:none; font-size:1rem; font-weight:600; color:var(--ink); }
summary::-webkit-details-marker{ display:none; }
summary::after{ content:""; width:10px; height:10px; flex:none; border-right:2px solid var(--link); border-bottom:2px solid var(--link); transform:translateY(-3px) rotate(45deg); transition:transform .2s; }
details[open] summary::after{ transform:translateY(2px) rotate(-135deg); }
details p{ padding-bottom:20px; font-size:.94rem; line-height:1.8; color:var(--ink-2); max-width:44em; }

/* fechamento */
.closing{ padding:48px; display:flex; align-items:center; justify-content:space-between; gap:40px; overflow:hidden; }
.closing::before{ content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:radial-gradient(60% 120% at 100% 0%, var(--glow1), transparent 60%); }
.closing > *{ position:relative; }
.closing h2{ margin-top:14px; font-size:clamp(1.9rem, 3vw, 2.6rem); letter-spacing:-.02em; }
.closing p:not(.eyebrow){ margin-top:16px; max-width:36em; font-size:.98rem; line-height:1.8; color:var(--ink-2); }
.closing .btn{ flex:none; }
.final{ padding-block:24px 84px; }

/* rodapé */
.footer{ border-top:1px solid var(--line); background:var(--panel); }
.footer .wrap{ display:flex; align-items:center; justify-content:space-between; gap:20px 32px; flex-wrap:wrap; padding-block:28px 36px; }
.footer p{ font-size:.84rem; color:var(--ink-2); }
.footer p span{ color:var(--muted); }
.footer .text-link{ font-size:.84rem; }

/* diálogo de diagnóstico */
dialog{ width:min(560px, calc(100% - 32px)); max-height:min(90vh, 760px); margin:auto; padding:30px; border-radius:var(--r); border:1px solid var(--line); background:var(--panel-solid); color:var(--ink); box-shadow:0 30px 70px -22px var(--shadow); overflow:auto; }
dialog::backdrop{ background:var(--overlay); backdrop-filter:blur(4px); }
.dialog-head{ display:flex; align-items:center; justify-content:space-between; gap:16px; }
dialog h2{ margin-top:16px; font-size:1.8rem; }
dialog > p{ margin-top:12px; font-size:.9rem; line-height:1.7; color:var(--ink-2); }
fieldset{ border:0; margin-top:22px; }
legend{ font-size:.9rem; font-weight:600; margin-bottom:8px; }
.opt{ display:flex; align-items:center; gap:12px; min-height:48px; padding:0 14px; margin-top:8px; border-radius:var(--r-ctl); border:1px solid var(--line); background:var(--field); font-size:.9rem; color:var(--ink-2); cursor:pointer; }
.opt:hover{ border-color:var(--blue); }
.opt input{ width:20px; height:20px; accent-color:var(--accent-solid); flex:none; }
.opt:has(input:checked){ border-color:var(--border); background:var(--accent-soft); color:var(--ink); }
.field-label{ display:block; margin-top:20px; font-size:.9rem; font-weight:600; }
.field-label span{ font-weight:500; color:var(--muted); }
textarea{ width:100%; margin-block:8px 18px; padding:12px 14px; border-radius:var(--r-ctl); border:1px solid var(--line); background:var(--field); color:var(--ink); resize:vertical; font-size:.92rem; line-height:1.6; }
textarea::placeholder{ color:var(--placeholder); }
textarea:focus{ outline:2px solid var(--cyan); outline-offset:1px; border-color:var(--blue); }
#diagnostic-result{ margin-top:24px; padding-top:20px; border-top:1px solid var(--line-2); }
#diagnostic-result h3{ font-size:1.25rem; }
#diagnostic-summary{ margin-block:14px; padding:16px 18px; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--field); white-space:pre-wrap; overflow-wrap:anywhere; font:inherit; font-size:.88rem; line-height:1.65; color:var(--ink-2); }
.copy-status{ margin-top:10px; font-size:.84rem; color:var(--green-ink); }

/* ---------- responsivo ---------- */
@media (max-width:1080px){
  .header-actions .btn-sm{ display:none; }
  .hero{ gap:40px; }
  .sec-head, .about, .faq{ gap:44px; }
  .offer{ padding:24px; }
  .floating{ right:-8px; }
  .closing{ padding:36px; }
}
@media (max-width:900px){
  .wrap{ padding-inline:24px; }
  .menu-btn{ display:grid; }
  .nav{ display:none; position:absolute; left:16px; right:16px; top:calc(100% + 8px); flex-direction:column; gap:4px; padding:10px; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--panel-solid); box-shadow:0 24px 50px -24px var(--shadow); }
  .nav.open{ display:flex; }
  .nav a{ min-height:48px; font-size:1rem; }
  .header .wrap{ position:relative; }
  .hero{ grid-template-columns:minmax(0,1fr); padding-block:56px 64px; }
  .hero-copy{ max-width:40rem; }
  .hero-visual{ width:100%; max-width:600px; margin-inline:auto; }
  .floating{ right:0; }
  .sec-head{ grid-template-columns:minmax(0,1fr); gap:18px; }
  .offer-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .offer:last-child{ grid-column:1 / -1; }
  .method-layout{ grid-template-columns:minmax(0,1fr); }
  .method-tabs{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .method-panel{ padding:30px; }
  .steps{ grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:40px; }
  .steps li:nth-child(2)::before{ display:none; }
  .about, .faq{ grid-template-columns:minmax(0,1fr); gap:32px; }
  .closing{ flex-direction:column; align-items:flex-start; gap:24px; }
}
@media (max-width:640px){
  html{ scroll-padding-top:76px; }
  .wrap{ padding-inline:16px; }
  .header .wrap{ min-height:64px; gap:12px; }
  .brand img{ width:40px; }
  .wm{ font-size:1.18rem; }
  .header-actions{ gap:8px; }
  .hero{ padding-block:40px 52px; gap:44px; }
  .hero h1{ font-size:clamp(2.3rem, 10vw, 2.9rem); }
  .lead{ font-size:1rem; }
  .actions{ flex-direction:column; align-items:stretch; gap:8px; }
  .actions .btn{ width:100%; }
  .actions .text-link{ justify-content:center; }
  .overview{ padding:20px 18px 16px; }
  .overview h2{ font-size:1.35rem; }
  .flow li{ grid-template-columns:36px minmax(0,1fr) auto; gap:12px; }
  .flow .n{ width:36px; height:36px; }
  .floating{ position:relative; right:auto; bottom:auto; margin-top:14px; }
  .hero-visual{ padding-bottom:0; }
  .principles .wrap{ flex-direction:column; align-items:flex-start; }
  .section{ padding-block:60px; }
  .sec-head{ margin-bottom:28px; }
  .offer-grid, .audience-grid{ grid-template-columns:minmax(0,1fr); }
  .offer:last-child{ grid-column:auto; }
  .offer, .audience, .values{ padding:24px; }
  .method-tabs{ grid-template-columns:minmax(0,1fr); }
  .method-tabs button{ min-height:56px; }
  .method-panel{ padding:24px; }
  .method-panel h3{ font-size:1.6rem; }
  .audience h3{ font-size:1.5rem; }
  .steps{ grid-template-columns:minmax(0,1fr); row-gap:0; }
  .steps li{ padding:0 0 30px 64px; min-height:44px; }
  .steps li::before{ display:block !important; top:52px; bottom:6px; left:21px; right:auto; width:2px; height:auto; }
  .steps li:last-child{ padding-bottom:0; }
  .steps li:last-child::before{ display:none !important; }
  .steps h3{ padding-top:8px; }
  .closing{ padding:26px 22px; }
  .closing .btn{ width:100%; }
  .final{ padding-bottom:56px; }
  .footer .wrap{ flex-direction:column; align-items:flex-start; }
  dialog{ padding:22px; }
}
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ transition:none !important; }
}