/* Páginas de marketing (marca-mãe e produtos). */
.home-hero { min-height: 100svh; display: grid; align-items: center; position: relative; overflow: hidden; padding-block: var(--s-16) var(--s-10); }
.home-hero::before { content: ''; position: absolute; inset: -20% -10% auto auto; width: 70vw; height: 70vw; max-width: 900px; max-height: 900px; background: radial-gradient(closest-side, rgba(109, 40, 217, 0.21), rgba(139, 92, 246, 0.064) 50%, transparent 72%); filter: blur(10px); pointer-events: none; }
.home-hero::after { content: ''; position: absolute; inset: 0; background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 64px 64px; -webkit-mask-image: radial-gradient(ellipse at 70% 40%, #000 0%, transparent 60%); mask-image: radial-gradient(ellipse at 70% 40%, #000 0%, transparent 60%); opacity: .5; pointer-events: none; }
.home-hero-in { position: relative; z-index: 2; display: grid; gap: var(--s-3); }
.home-title { font-size: var(--t-hero); font-weight: 600; letter-spacing: -.045em; line-height: .98; }
.home-title .serif-i { font-size: 1.12em; letter-spacing: -.02em; padding-right: .06em; }
.hero-ctas { display: flex; gap: var(--s-2); flex-wrap: wrap; margin-top: var(--s-1); }
.home-orbit { position: absolute; right: max(-160px, calc((100vw - var(--wrap)) / 2 - 220px)); top: 50%; width: min(720px, 80vw); transform: translateY(-50%); z-index: 1; opacity: .9; }
.orbit-svg circle { fill: none; stroke: url(#og1); stroke-width: 1; }
.orbit-svg .o1 { opacity: .25; stroke-dasharray: 2 10; } .orbit-svg .o2 { opacity: .35; } .orbit-svg .o3 { opacity: .18; stroke-dasharray: 1 6; }
.o-dot, .o-dot2 { transform-origin: 300px 300px; animation: spin 24s linear infinite; } .o-dot2 { animation-duration: 38s; animation-direction: reverse; }
.o-dot circle { fill: var(--magenta-soft); stroke: none; filter: drop-shadow(0 0 6px var(--magenta)); } .o-dot2 circle { fill: var(--cyan); stroke: none; }
.mark-anim { position: absolute; inset: 24%; width: 52%; height: 52%; filter: drop-shadow(0 0 18px rgba(168, 85, 247, .45)); }
.mark-anim path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: draw 1.8s var(--ease-out) forwards; }
.mark-anim path:nth-child(2) { animation-delay: .25s; } .mark-anim path:nth-child(3) { animation-delay: .6s; } .mark-anim path:nth-child(4) { animation-delay: .9s; }
.home-orbit { aspect-ratio: 1; }
.o-seal { fill: rgba(109, 40, 217, 0.06); stroke: url(#og1); stroke-width: 1.5; stroke-dasharray: 900; stroke-dashoffset: 900; animation: draw 2.4s var(--ease-out) .3s forwards; transform-origin: 300px 300px; }
.o-check { fill: none; stroke: var(--ok); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 120; stroke-dashoffset: 120; animation: draw 1s var(--ease-out) 1.6s forwards; }
@keyframes draw { to { stroke-dashoffset: 0; } }
@keyframes spin { to { transform: rotate(360deg); } }
@media (max-width: 760px) { .home-orbit { opacity: .35; right: -40vw; width: 110vw; } }

.prod-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: var(--s-3); align-items: stretch; }
.prod-card { display: grid; gap: var(--s-3); padding: var(--s-5); overflow: hidden; min-height: 360px; align-content: start; }
.prod-card::before { content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 1px; background: linear-gradient(140deg, rgba(196, 181, 253, 0.44), transparent 40%, transparent 60%, rgba(0, 165, 239, .45)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.prod-card:hover { transform: translateY(-2px); }
.prod-top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s-2); }
.prod-top .wm { flex: 0 0 auto; }
.prod-top .badge { flex: 0 0 auto; }
@media (max-width: 520px) { .prod-art { opacity: .35; } .prod-top { flex-direction: column; align-items: flex-start; gap: var(--s-2); } .wm-card .wm-logo { height: 38px; } }
.wm-card .wm-logo { height: 44px; }
.prod-desc { color: var(--text-dim); font-size: var(--t-lg); max-width: 46ch; position: relative; z-index: 1; }
.prod-points { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: var(--s-1); font-size: var(--t-xs); color: var(--text-dim); position: relative; z-index: 1; }
.prod-points li { padding: 6px 12px; border-radius: var(--r-pill); box-shadow: 0 0 0 1px var(--line) inset; }
.prod-cta { color: #fff; font-weight: 600; display: inline-flex; gap: 8px; align-items: center; position: relative; z-index: 1; }
.prod-card:hover .arr { transform: translateX(4px); } .prod-cta .arr { transition: transform var(--d-med) var(--ease-out); }
.prod-art { position: absolute; right: -24px; bottom: -24px; opacity: .9; }
.prod-art .ico { width: 200px; height: 200px; color: rgba(196, 181, 253, 0.44); }
.prod-art .ico * { stroke-width: 1; }
.soon { padding: var(--s-4); border-radius: var(--r-lg); box-shadow: 0 0 0 1px var(--line) inset; background-image: repeating-linear-gradient(135deg, rgba(255, 255, 255, .012) 0 2px, transparent 2px 10px); }
.soon-h { font: 500 var(--t-xs)/1 var(--f-mono); text-transform: uppercase; letter-spacing: .16em; color: var(--text-faint); margin-bottom: var(--s-2); }
.soon-list { list-style: none; padding: 0; margin: var(--s-3) 0 0; display: grid; }
.soon-list li { display: grid; grid-template-columns: 88px 1fr; gap: var(--s-2); padding: var(--s-2) 0; border-top: 1px solid var(--line); font-size: var(--t-sm); align-items: baseline; }
.soon-n { font-family: var(--f-serif); font-size: 1.35rem; color: var(--text-dim); }
.soon-n::before { content: 'Vérité '; font-size: .75em; color: var(--text-faint); }
@media (max-width: 860px) { .prod-grid { grid-template-columns: 1fr; } .soon-list li { grid-template-columns: 1fr; gap: 2px; } }

.cream-band { background: var(--cream); color: var(--ink); border-radius: 32px; margin-inline: var(--s-2); }
.cream-band h2, .cream-band h3 { color: var(--ink); }
.cream-band .eyebrow { color: rgba(20, 16, 42, .6); }
.cream-band .lede, .cream-band p { color: rgba(20, 16, 42, .72); }
.cream-band .ico { color: var(--purple); } .cream-band .ico .accent { stroke: #0077b6; } .cream-band .ico .ok { stroke: #2563eb; }
.principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-5); }
.principle { display: grid; gap: var(--s-2); align-content: start; padding-top: var(--s-3); border-top: 1px solid rgba(20, 16, 42, .16); }
.principle h3 { font-size: var(--t-xl); }
@media (max-width: 860px) { .principles { grid-template-columns: 1fr; gap: var(--s-4); } .cream-band { margin-inline: var(--s-1); border-radius: 24px; } }

.end-cta { text-align: center; display: grid; gap: var(--s-3); justify-items: center; padding-block: var(--s-8); }
.end-cta h2 { font-size: var(--t-3xl); }
.section-head.center { margin-inline: auto; text-align: center; justify-items: center; }
.section-head.center .eyebrow::before { display: none; }

/* split / comparação */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-10); align-items: center; }
.split-copy { display: grid; gap: var(--s-3); } .split-copy h2 { font-size: var(--t-3xl); }
.ticks { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--s-2); }
.ticks li { padding-left: 32px; position: relative; color: var(--text-dim); }
.ticks li::before { content: ''; position: absolute; left: 0; top: .35em; width: 16px; height: 16px; border-radius: 50%; box-shadow: 0 0 0 1px rgba(59, 155, 255, .5) inset; background: radial-gradient(circle, var(--ok) 0 3px, transparent 4px); }
.compare { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-2); position: relative; }
.cmp-card { border-radius: var(--r-md); overflow: hidden; box-shadow: 0 0 0 1px var(--line-strong), 0 30px 60px -30px rgba(0, 0, 0, .8); background: #fff; position: relative; }
.cmp-card img { width: 100%; height: auto; }
.cmp-bad { transform: translateY(var(--s-5)); }
.cmp-card figcaption { position: absolute; left: 12px; bottom: 12px; display: inline-flex; gap: 8px; align-items: center; padding: 6px 12px; border-radius: var(--r-pill); background: rgba(2, 6, 23, .82); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); font: 500 var(--t-xs)/1 var(--f-mono); color: #fff; }
.dot { width: 8px; height: 8px; border-radius: 50%; } .dot.ok { background: var(--ok); } .dot.bad { background: var(--red); }
.cmp-note { position: absolute; top: -28px; right: 0; font-size: var(--t-xs); color: var(--text-faint); }
@media (max-width: 860px) { .split { grid-template-columns: 1fr; gap: var(--s-6); } }

.steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-3); }
.step { display: grid; gap: var(--s-2); align-content: start; }
.step-n { position: absolute; top: var(--s-4); right: var(--s-4); font-size: var(--t-xs); color: var(--text-faint); }
.step h3 { font-size: var(--t-xl); }
.v-ok { color: var(--ok); font-weight: 600; } .v-warn { color: var(--amber); font-weight: 600; } .v-bad { color: var(--red); font-weight: 600; }
@media (max-width: 860px) { .steps { grid-template-columns: 1fr; } }

.checks-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.chk { padding: var(--s-4) var(--s-3); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: grid; gap: var(--s-2); align-content: start; position: relative; transition: background var(--d-med); }
.chk:hover { background: radial-gradient(circle at 30% 0%, rgba(139, 92, 246, 0.064), transparent 70%); }
.chk h3 { font-size: var(--t-lg); line-height: 1.25; }
.chk p { color: var(--text-dim); font-size: var(--t-sm); }
.chk .badge { justify-self: start; }
.ico-scan .row:nth-of-type(2) { --k: 1; } .ico-scan .row:nth-of-type(3) { --k: 2; } .ico-scan .row:nth-of-type(4) { --k: 3; } .ico-scan .row:nth-of-type(5) { --k: 4; }
@media (max-width: 1000px) { .checks-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .checks-grid { grid-template-columns: 1fr; } }

/* preços */
.pricing { display: grid; grid-template-columns: 1fr 1fr 1.12fr; gap: var(--s-3); align-items: stretch; }
.plan { display: grid; gap: var(--s-2); align-content: start; padding: var(--s-5) var(--s-4); }
.plan .btn { margin-top: auto; }
.plan-name { font: 500 var(--t-sm)/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--text-dim); }
.plan-price { display: flex; align-items: baseline; gap: 6px; margin-top: var(--s-1); }
.plan-price .num { font: 600 2.75rem/1 var(--f-display); letter-spacing: -.04em; color: #fff; }
.plan-price .per { color: var(--text-dim); }
.plan-list { list-style: none; padding: var(--s-2) 0 var(--s-3); margin: 0; display: grid; gap: 12px; border-top: 1px solid var(--line); font-size: var(--t-sm); color: var(--text-dim); }
.plan-list li { padding-left: 24px; position: relative; }
.plan-list li::before { content: ''; position: absolute; left: 2px; top: .45em; width: 10px; height: 6px; border-left: 1.5px solid var(--ok); border-bottom: 1.5px solid var(--ok); transform: rotate(-45deg); }
.plan-hi { display: flex; position: relative; border-radius: var(--r-lg); padding: 1px; background: linear-gradient(150deg, var(--magenta-soft), var(--purple) 45%, var(--cyan)); box-shadow: 0 30px 80px -30px rgba(139, 92, 246, 0.44); transform: translateY(-8px); }
.plan-hi::after { content: ''; position: absolute; inset: -1px; border-radius: inherit; background: inherit; filter: blur(24px); opacity: .25; z-index: -1; }
.plan-hi-in { flex: 1; border-radius: calc(var(--r-lg) - 1px); background: radial-gradient(120% 80% at 100% 0%, rgba(109, 40, 217, 0.21), transparent 60%), linear-gradient(180deg, #0d0b2b, #070a22); padding: var(--s-5) var(--s-4); display: grid; gap: var(--s-2); align-content: start; }
.plan-hi-in .btn { margin-top: auto; }
.plan-top { display: flex; justify-content: space-between; align-items: center; gap: var(--s-1); }
.plan-badge { color: #fff; background: rgba(139, 92, 246, 0.112); box-shadow: 0 0 0 1px rgba(196, 181, 253, 0.32) inset; }
.plan-eq { color: var(--text-dim); } .plan-eq strong { color: var(--ok); font-weight: 600; }
.price-disc { margin-top: var(--s-6); }
@media (max-width: 960px) { .pricing { grid-template-columns: 1fr; max-width: 480px; margin-inline: auto; } .plan-hi { transform: none; order: -1; } }

.faq { display: grid; border-top: 1px solid var(--line); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { list-style: none; cursor: pointer; padding: var(--s-3) var(--s-5) var(--s-3) 0; font: 500 var(--t-lg)/1.4 var(--f-display); color: #fff; position: relative; letter-spacing: -.01em; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ''; position: absolute; right: 4px; top: 50%; width: 14px; height: 14px; margin-top: -7px; background: linear-gradient(currentColor, currentColor) center / 14px 1.5px no-repeat, linear-gradient(currentColor, currentColor) center / 1.5px 14px no-repeat; transition: transform var(--d-med) var(--ease-out); color: var(--magenta-soft); }
.faq details[open] summary::after { transform: rotate(135deg); }
.faq details p { padding: 0 0 var(--s-3); color: var(--text-dim); max-width: 62ch; }
.cream-band .section-head h2 .serif-i, .cream-band h2 .serif-i { color: var(--purple); }

/* ===================== Design pass (2026-10): editorial + 3D ===================== */
/* home: emblema em camadas 3D que segue o dedo/mouse/giroscópio */
.home-orbit { perspective: 1600px; perspective-origin: 50% 50%; }
.orbit-3d { position: absolute; inset: 0; transform-style: preserve-3d; transform: rotateX(var(--rx)) rotateY(var(--ry)); transition: transform 900ms var(--ease-out); }
.orbit-3d .orbit-svg { transform: translateZ(-10px); }
.orbit-3d .mark-anim { transform: translateZ(18px); }
@media (max-width: 760px) {
  .home-hero { align-items: start; padding-top: calc(72px + var(--s-2)); }
  .home-orbit { position: relative; right: auto; top: auto; transform: none; width: min(64vw, 280px); margin: 0 auto calc(-1 * var(--s-2)); opacity: 1; }
  .home-hero { display: flex; flex-direction: column; }
  .home-hero::before { inset: -10% -30% auto auto; width: 120vw; height: 120vw; }
}
/* princípios numerados, em serif itálico */
.principles-num { counter-reset: pr; }
.principles-num .principle { counter-increment: pr; position: relative; }
.principles-num .principle::before { content: counter(pr, decimal-leading-zero); font: italic 400 2.6rem/1 var(--f-serif); color: var(--purple); opacity: .55; margin-bottom: var(--s-1); }

/* /pix/: comprovantes em 3D, o editado sendo "varrido" por um feixe de luz */
.compare { perspective: 1400px; transform-style: preserve-3d; }
.compare .cmp-card { transform: rotateY(calc(var(--ry) * 1 + 8deg)) rotateX(calc(var(--rx) * 1 + 4deg)) translateZ(0); transition: transform 900ms var(--ease-out); }
.compare .cmp-bad { transform: translateY(var(--s-5)) rotateY(calc(var(--ry) - 8deg)) rotateX(calc(var(--rx) + 4deg)) translateZ(30px); }
.scan-beam { position: absolute; left: -4%; right: -4%; height: 2px; top: 0; z-index: 3; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(196, 181, 253, .95) 20%, #fff 50%, rgba(143, 180, 246, .95) 80%, transparent);
  box-shadow: 0 0 18px 4px rgba(168, 85, 247, .45), 0 0 60px 10px rgba(99, 102, 241, .18); animation: scan 3.6s var(--ease-in-out) infinite; }
.scan-beam::after { content: ''; position: absolute; left: 0; right: 0; bottom: 2px; height: 70px; background: linear-gradient(transparent, rgba(168, 85, 247, .12)); }
@keyframes scan { 0% { top: 0; opacity: 0; } 8% { opacity: 1; } 70% { top: 100%; opacity: 1; } 78%, 100% { top: 100%; opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .scan-beam { display: none; } }

/* /pix/: três passos como linha do tempo editorial (desenhos de traço, numeral serif) */
.flow { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-5); position: relative; counter-reset: none; }
.flow::before { content: ''; position: absolute; left: 0; right: 0; top: 60px; height: 1px; background: linear-gradient(90deg, transparent, var(--line-strong) 12%, var(--line-strong) 88%, transparent); }
.flow-step { position: relative; display: grid; gap: var(--s-1); align-content: start; }
.flow-art { width: 160px; height: 120px; fill: none; stroke: rgba(233, 230, 242, .55); stroke-width: 1.25; stroke-linecap: round; stroke-linejoin: round; background: var(--navy-950); padding-right: var(--s-2); position: relative; }
.flow-art .soft { fill: rgba(168, 85, 247, .08); stroke: rgba(196, 181, 253, .5); }
.flow-art .accent { stroke: #a5b4fc; stroke-width: 2; }
.flow-art .beam { stroke: #c4b5fd; stroke-width: 1.5; stroke-dasharray: 3 4; animation: beamy 3s var(--ease-in-out) infinite alternate; }
@keyframes beamy { from { transform: translateY(-14px); } to { transform: translateY(26px); } }
@media (prefers-reduced-motion: reduce) { .flow-art .beam { animation: none; } }
.flow-n { font: italic 400 3.4rem/1 var(--f-serif); color: var(--magenta-soft); margin-top: var(--s-2); }
.flow-step h3 { font-size: var(--t-xl); }
.flow-step p { color: var(--text-dim); max-width: 34ch; }
@media (max-width: 860px) {
  .flow { grid-template-columns: 1fr; gap: var(--s-6); padding-left: var(--s-4); }
  .flow::before { left: 7px; right: auto; top: 8px; bottom: 8px; width: 1px; height: auto; background: linear-gradient(transparent, var(--line-strong) 8%, var(--line-strong) 92%, transparent); }
  .flow-step::before { content: ''; position: absolute; left: calc(-1 * var(--s-4) + 3px); top: 54px; width: 9px; height: 9px; border-radius: 50%; background: var(--navy-950); box-shadow: 0 0 0 1.5px #c4b5fd; }
  .flow-n { margin-top: 0; font-size: 2.8rem; }
}

/* /pix/: checagens como índice numerado em duas colunas (sem grade de cards) */
.checks-list { counter-reset: ck; display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--s-8); }
.checks-list .chk { counter-increment: ck; display: grid; grid-template-columns: 56px 1fr; grid-template-areas: 'n t' 'n p' 'n b'; column-gap: var(--s-2); row-gap: 6px; padding: var(--s-3) 0; border-top: 1px solid var(--line); border-right: 0; background: none; box-shadow: none; border-radius: 0; }
.checks-list .chk::before { content: counter(ck, decimal-leading-zero); grid-area: n; font: italic 400 2rem/1 var(--f-serif); color: var(--text-faint); transition: color var(--d-med); }
.checks-list .chk:hover::before { color: var(--magenta-soft); }
.checks-list .chk .ico { display: none; }
.checks-list .chk h3 { grid-area: t; font-size: var(--t-lg); }
.checks-list .chk p { grid-area: p; color: var(--text-dim); font-size: var(--t-sm); max-width: 48ch; }
.checks-list .chk .badge { grid-area: b; justify-self: start; }
.checks-list .chk:nth-last-child(-n+2) { border-bottom: 1px solid var(--line); }
@media (max-width: 760px) { .checks-list { grid-template-columns: 1fr; } .checks-list .chk { grid-template-columns: 44px 1fr; } .checks-list .chk:nth-last-child(2) { border-bottom: 0; } }

/* /pix/: faixa creme com escudo em camadas 3D */
.band-head { display: grid; grid-template-columns: 1.3fr 1fr; gap: var(--s-5); align-items: center; margin-bottom: var(--s-6); }
.band-head .section-head { margin-bottom: 0; }
.shield3d { justify-self: center; width: min(240px, 52vw); aspect-ratio: 120 / 140; perspective: 900px; }
.shield3d-in { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; transform: rotateX(calc(var(--rx) + 8deg)) rotateY(calc(var(--ry) - 18deg)); transition: transform 900ms var(--ease-out); animation: shieldFloat 7s var(--ease-in-out) infinite; }
@keyframes shieldFloat { 50% { translate: 0 -8px; } }
.sl { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.sl path { fill: none; stroke-linejoin: round; }
.sl1 { transform: translateZ(-36px); } .sl1 path { fill: rgba(20, 16, 42, .06); stroke: rgba(20, 16, 42, .14); stroke-width: 1; }
.sl2 { transform: translateZ(-12px); } .sl2 path { fill: rgba(152, 16, 250, .06); stroke: rgba(152, 16, 250, .3); stroke-width: 1.2; }
.sl3 { transform: translateZ(12px); } .sl3 path { fill: rgba(255, 255, 255, .55); stroke: url(#none); stroke: rgba(91, 33, 182, .65); stroke-width: 1.6; }
.sl4 { transform: translateZ(40px); } .sl4 path { stroke: #4c1d95; stroke-width: 1.4; fill: rgba(237, 233, 254, .5); } .sl4 .ck { stroke: #2563eb; stroke-width: 4; stroke-linecap: round; fill: none; }
@media (prefers-reduced-motion: reduce) { .shield3d-in { animation: none; } }
@media (max-width: 860px) { .band-head { grid-template-columns: 1fr; } .shield3d { order: -1; justify-self: start; width: 120px; } }