/* Landing v7 — por cima de base/v3/v6. Página curta: menos texto, mais produto. */

/* hero */
.hero7 { text-align: center; }
.pill7 { display: inline-flex; align-items: center; gap: 10px; padding: 5px 14px 5px 5px; border: 1px solid var(--border); border-radius: 999px; background: color-mix(in srgb, var(--white) 70%, transparent); color: var(--muted); font-size: 13px; font-weight: 500; text-decoration: none; margin-bottom: 26px; }
.pill7 span { padding: 3px 9px; border-radius: 999px; background: var(--accent); color: #fff; font-size: 11.5px; font-weight: 700; }
.pill7:hover { color: var(--ink); }
.h7 { max-width: 820px; margin: 0 auto; font-size: clamp(32px, 4.3vw, 52px); font-weight: 800; line-height: 1.08; letter-spacing: -.03em; }
.sub7 { max-width: 560px; margin: 20px auto 0; color: var(--muted); font-size: clamp(16px, 1.5vw, 18px); line-height: 1.55; }
.sub7 b { color: var(--ink); font-weight: 700; }
.hero7 .hero-micro { margin-top: 14px; }
.try6 b { color: var(--ink); }

/* colado no WhatsApp da demo */
.wa-field.pasted { animation: pasted7 1.4s ease-out; }
@keyframes pasted7 { 0% { background: #00a88455; box-shadow: 0 0 0 3px #00a884aa; } 100% { background: #2a3942; box-shadow: 0 0 0 2px #00a88455; } }

/* rótulos */
.eb7 { display: inline-block; margin-bottom: 14px; padding: 4px 11px; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--border)); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); font: 600 12px 'Geist Mono', ui-monospace, Consolas, monospace; letter-spacing: .02em; }
#dor .center-head h2 { font-size: clamp(28px, 3.4vw, 42px); }

/* roda */
.roda7 { display: grid; grid-template-columns: 1fr 1.15fr; gap: 40px; align-items: center; }
.roda7-txt h2 { font-size: clamp(28px, 3.4vw, 42px); line-height: 1.1; letter-spacing: -.025em; }
.roda7-txt p { margin-top: 16px; color: var(--muted); font-size: 17px; line-height: 1.55; max-width: 420px; }
.ticks7 { list-style: none; margin: 24px 0 0; padding: 0; display: grid; gap: 10px; color: var(--muted); font-size: 14.5px; }
.ticks7 kbd { display: inline-block; min-width: 22px; padding: 2px 6px; margin: 0 3px 0 0; border: 1px solid var(--border2); border-bottom-width: 2px; border-radius: 6px; background: var(--white); color: var(--ink); font: 600 12px 'Geist Mono', ui-monospace, Consolas, monospace; text-align: center; }
.roda7 .grow6 { height: 540px; margin: 0; }
.roda7 .grow6::before { content: ''; position: absolute; left: 50%; top: 290px; width: 460px; height: 460px; translate: -50% -50%; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--accent) 22%, transparent), color-mix(in srgb, #7c5cff 10%, transparent) 60%, transparent); filter: blur(10px); pointer-events: none; }
.grow7-new { position: absolute; left: 50%; bottom: 0; translate: -50% 0; margin: 0; color: var(--muted); font-size: 14px; white-space: nowrap; }
.grow7-new b { color: var(--ink); font-size: 16px; }
.grow7-new span { font-weight: 700; }

/* biblioteca */
.lib7 { position: relative; overflow: hidden; }
.lib7::before { content: ''; position: absolute; left: 50%; top: 42%; width: min(1300px, 130vw); height: 760px; translate: -50% 0; background: radial-gradient(50% 50% at 30% 40%, color-mix(in srgb, var(--accent) 30%, transparent), transparent 70%), radial-gradient(45% 50% at 72% 55%, #7c5cff40, transparent 70%), radial-gradient(40% 40% at 50% 90%, #1e9bd730, transparent 70%); filter: blur(30px); pointer-events: none; }
.lib7 .wrap { position: relative; }
.lib7-frame { max-width: 1040px; margin: 40px auto 0; padding: 10px; border-radius: 26px; background: linear-gradient(160deg, #ffffff26, #ffffff08 40%, color-mix(in srgb, var(--accent) 22%, transparent)); box-shadow: 0 40px 120px -30px #000c, 0 0 0 1px #ffffff14 inset; }
.lib7-frame .v2-product-frame { border-radius: 18px; overflow: hidden; }
.lib7-pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 28px; }
.lib7-pills span, .priv7-row span { display: inline-flex; align-items: center; gap: 9px; padding: 10px 16px; border-radius: 999px; border: 1px solid var(--border); background: color-mix(in srgb, var(--white) 80%, transparent); backdrop-filter: blur(8px); color: var(--ink); font-size: 14px; font-weight: 500; }
.lib7-pills svg, .priv7-row svg { width: 17px; height: 17px; color: var(--accent); flex: none; }

/* compartilhado */
.share7 { display: grid; grid-template-columns: 1fr 1.1fr; gap: 56px; align-items: center; }
.share7-txt h2 { font-size: clamp(30px, 3.6vw, 46px); letter-spacing: -.03em; }
.share7-txt p { margin-top: 14px; color: var(--muted); font-size: 17px; line-height: 1.55; max-width: 430px; }
.share7-vis { position: relative; padding: 18px; border-radius: 22px; border: 1px solid #ffffff17; background: linear-gradient(155deg, #262626, #1b1b1b 55%, color-mix(in srgb, #7c5cff 18%, #1b1b1b)); box-shadow: 0 30px 80px -30px #000b; color: #f4f4f2; }
body:not(.dark) .share7-vis { box-shadow: 0 30px 70px -30px #0006; }
.sp7-head { display: flex; align-items: center; gap: 12px; padding: 4px 4px 16px; border-bottom: 1px solid #ffffff12; }
.sp7-head > img { width: 38px; height: 38px; border-radius: 10px; image-rendering: pixelated; }
.sp7-head b { display: block; font-size: 15px; } .sp7-head small { color: #a3a39c; font-size: 12px; }
.sp7-av { margin-left: auto; display: flex; } .sp7-av img { width: 28px; height: 28px; border-radius: 50%; border: 2px solid #1f1f1f; image-rendering: pixelated; margin-left: -8px; }
.sp7-list { display: grid; gap: 8px; margin-top: 14px; min-height: 300px; align-content: start; }
.sp7-card { display: flex; gap: 12px; padding: 13px 14px; border-radius: 12px; border: 1px solid #ffffff10; background: #ffffff08; }
.sp7-card.fresh { animation: sp7-in .6s cubic-bezier(.2, .8, .2, 1) both; box-shadow: inset 3px 0 0 var(--accent); }
@keyframes sp7-in { from { opacity: 0; transform: translateY(-14px); } }
.sp7-dot { width: 8px; height: 8px; margin-top: 5px; border-radius: 50%; flex: none; }
.sp7-body { min-width: 0; }
.sp7-body small { display: block; color: #8f8f88; font: 600 10.5px 'Geist Mono', ui-monospace, Consolas, monospace; letter-spacing: .06em; }
.sp7-body b { display: block; margin-top: 3px; font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp7-body b.is-link { color: #8ab4ff; font-family: 'Geist Mono', ui-monospace, Consolas, monospace; font-size: 13px; }
.sp7-meta { display: flex; align-items: center; gap: 6px; margin-top: 6px; color: #9a9a93; font-size: 12px; }
.sp7-meta img { width: 16px; height: 16px; border-radius: 50%; image-rendering: pixelated; }
.sp7-meta em { font-style: normal; padding: 1px 6px; border: 1px solid #ffffff1a; border-radius: 5px; font: 11px 'Geist Mono', ui-monospace, Consolas, monospace; }

/* depoimentos */
.marq7 { position: relative; overflow: hidden; margin-top: 40px; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marq7-track { display: flex; gap: 18px; width: max-content; animation: marq7 48s linear infinite; }
.marq7:hover .marq7-track { animation-play-state: paused; }
.marq7-dup { display: contents; }
@keyframes marq7 { to { transform: translateX(calc(-50% - 9px)); } }
.tc7 { width: 340px; margin: 0; padding: 22px; border-radius: 18px; border: 1px solid var(--border); background: linear-gradient(160deg, var(--white), color-mix(in srgb, var(--white) 85%, var(--accent) 6%)); display: flex; flex-direction: column; gap: 14px; }
.tc7-stars { color: #f5a623; letter-spacing: 2px; font-size: 14px; } .tc7-stars i { font-style: normal; color: var(--border2); }
.tc7 blockquote { margin: 0; flex: 1; color: var(--ink); font-size: 15px; line-height: 1.55; }
.tc7 figcaption { display: flex; align-items: center; gap: 11px; }
.tc7-av { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-size: 12.5px; font-weight: 700; }
.tc7 figcaption b { display: block; font-size: 14px; } .tc7 figcaption small { color: var(--muted); font-size: 12.5px; }

/* privacidade: uma linha */
.priv7 { padding-top: 20px !important; padding-bottom: 20px !important; }
.priv7 h3 { text-align: center; font-size: 18px; font-weight: 700; margin-bottom: 18px; }
.priv7-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }

/* preços */
.plans7 .plan-v3.is-main { background: linear-gradient(165deg, color-mix(in srgb, var(--accent) 16%, var(--white)), var(--white) 55%); border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); box-shadow: 0 30px 80px -40px color-mix(in srgb, var(--accent) 70%, transparent); }
.plan7-note { text-align: center; margin-top: 22px; color: var(--muted); font-size: 13.5px; }

/* final: teclado + HUD real */
.kb7 .kb-head2 { text-align: center; margin-bottom: 36px; }
.kb7 .kb-head2 h2 { font-size: clamp(30px, 3.8vw, 48px); letter-spacing: -.03em; line-height: 1.08; }
.kb7-box { max-width: 820px; margin: 0 auto; }
.kb7-modes { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.kb7-modes button { display: inline-flex; align-items: center; gap: 9px; height: 40px; padding: 0 14px; border-radius: 11px; border: 1px solid var(--border); background: var(--white); color: var(--muted); font: 600 13.5px var(--font); cursor: pointer; }
.kb7-modes button[aria-pressed="true"] { color: var(--ink); border-color: color-mix(in srgb, var(--accent) 55%, var(--border)); }
.kb7-modes kbd { padding: 1px 6px; border: 1px solid var(--border); border-radius: 5px; font: 500 11px 'Geist Mono', ui-monospace, Consolas, monospace; }
.kb7-screen { position: relative; height: 380px; margin-bottom: 18px; overflow: hidden; border-radius: 20px; border: 1px solid #ffffff14; background: radial-gradient(60% 70% at 50% 40%, color-mix(in srgb, var(--accent) 16%, #151515), #111 70%); }
.kb7-src { position: absolute; left: 50%; top: 42px; translate: -50% 0; width: max-content; max-width: 90%; margin: 0; color: #d9d9d4; font-size: 17px; line-height: 1.6; text-align: center; transition: opacity .3s; }
.kb7-src mark { background: transparent; color: inherit; transition: background .35s; border-radius: 3px; }
.kb7-src.sel mark { background: #3b82f680; color: #fff; }
.kb7-src mark.in { background: #10b98140; color: #fff; animation: pasted7b 1.2s ease-out; }
@keyframes pasted7b { from { background: #10b981aa; } }
.kb7-src .car { display: inline-block; width: 2px; height: 18px; vertical-align: -3px; background: #fff; animation: caret6 1s steps(1) infinite; }
.kb7-src.dim { opacity: .25; }
.kb7-label { position: absolute; left: 50%; bottom: 18px; translate: -50% 8px; opacity: 0; padding: 7px 14px; border-radius: 999px; background: #000a; border: 1px solid #ffffff1c; color: #eee; font-size: 13.5px; transition: opacity .25s, translate .25s; white-space: nowrap; }
.kb7-label.on { opacity: 1; translate: -50% 0; }
.kb7-label.ok { background: color-mix(in srgb, #10b981 22%, #000c); border-color: #10b98166; }
.kb7-label kbd { padding: 1px 7px; border: 1px solid #ffffff33; border-bottom-width: 2px; border-radius: 6px; font: 600 12px 'Geist Mono', ui-monospace, Consolas, monospace; }
.kb7-hud { position: absolute; left: 50%; top: 50%; }
.kb7-wheel { width: 760px; height: 620px; translate: -50% -50%; scale: .86; margin-top: -6px; }
.kb7-paste { width: 500px; translate: -50% -52%; scale: .78; }
.kb7-voice { width: 410px; translate: -50% -58%; }
.kb7 .kb { max-width: 820px; margin: 0 auto !important; }

/* celular */
@media (max-width: 900px) {
  .roda7, .share7 { grid-template-columns: 1fr; gap: 20px; }
  .roda7 .grow6 { transform: scale(.72); transform-origin: 50% 0; height: 400px; }
  .kb7-wheel { scale: .5; } .kb7-paste { scale: .62; } .kb7-voice { scale: .8; }
  .kb7-screen { height: 320px; }
}
@media (max-width: 600px) {
  .roda7 .grow6 { transform: scale(.52); height: 300px; }
  .tc7 { width: 280px; }
  .lib7-frame { padding: 5px; border-radius: 16px; }
}
@media (prefers-reduced-motion: reduce) { .marq7-track { animation: none; flex-wrap: wrap; width: auto; justify-content: center; } .marq7-dup { display: none; } }

/* títulos de seção: um tamanho só na página toda */
.center-head h2, #dor .center-head h2 { font-size: clamp(28px, 3.4vw, 42px); line-height: 1.1; letter-spacing: -.028em; }
.center-head p { font-size: 17px; }
.sp7-meta em { color: #b9b9b2; border-color: #ffffff22; }

/* ══════════ v7.2 ══════════ */
/* idioma: globo */
.lang7 { position: relative; }
.lang7-btn { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 11px; border: 1px solid var(--border); border-radius: 999px; background: transparent; color: var(--muted); font: 600 12.5px var(--font); cursor: pointer; }
.lang7-btn:hover, .lang7-btn[aria-expanded="true"] { color: var(--ink); border-color: var(--border2); }
.lang7-btn svg { width: 16px; height: 16px; }
.lang7-menu { position: absolute; right: 0; top: calc(100% + 8px); min-width: 150px; padding: 6px; border: 1px solid var(--border); border-radius: 12px; background: var(--white); box-shadow: 0 18px 40px -12px #000a; z-index: 200; }
.lang7-menu button { display: block; width: 100%; padding: 9px 12px; border: 0; border-radius: 8px; background: none; color: var(--ink); font: 500 13.5px var(--font); text-align: left; cursor: pointer; }
.lang7-menu button:hover, .lang7-menu button[aria-current="true"] { background: color-mix(in srgb, var(--ink) 8%, transparent); }

/* hero: tela cheia */
.tab6-dash .dot6 { width: 9px; height: 9px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 30%, transparent); }
#w6-browser, #w6-chat, #w6-twocy { left: 0; top: 0; width: 1200px; height: 654px; border: 0; border-radius: 0; box-shadow: none; }
.art6 { max-width: 780px; margin: 0 auto; padding: 34px 40px; }
#w6-chat { transform: none; }
.wa-app { flex: 1; display: flex; min-height: 0; }
.wa-side { width: 330px; flex: none; display: flex; flex-direction: column; background: #111b21; border-right: 1px solid #ffffff14; }
.wa-side-top { padding: 14px 16px 10px; }
.wa-side-top b { color: #e9edef; font-size: 20px; }
.wa-side-top span { display: block; margin-top: 12px; height: 34px; line-height: 34px; padding: 0 12px; border-radius: 8px; background: #202c33; color: #8696a0; font-size: 12.5px; white-space: nowrap; overflow: hidden; }
.wa-chat { display: flex; align-items: center; gap: 12px; padding: 10px 16px; border-bottom: 1px solid #ffffff0b; }
.wa-chat.on { background: #2a3942; }
.wa-chat i, .wa-head i { flex: none; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--c); color: #fff; font: 700 15px Inter, sans-serif; font-style: normal; }
.wa-head i { width: 38px; height: 38px; }
.wa-chat span { flex: 1; min-width: 0; }
.wa-chat b, .wa-head b { display: block; color: #e9edef; font-size: 14.5px; font-weight: 500; }
.wa-chat small { display: block; color: #8696a0; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wa-chat em { align-self: flex-start; margin-top: 3px; color: #8696a0; font-size: 11px; font-style: normal; }
.wa-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.wa-head { flex: none; height: 58px; display: flex; align-items: center; gap: 12px; padding: 0 16px; background: #202c33; }
.wa-head small { color: #8696a0; font-size: 12px; }
.wa-body, .wa6-body { background: #0b141a url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22160%22%20height%3D%22160%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-opacity%3D%22.055%22%20stroke-width%3D%221.4%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2222%22%20cy%3D%2224%22%20r%3D%229%22/%3E%3Cpath%20d%3D%22M60%2014l6%2012%2013%202-10%209%203%2013-12-7-12%207%203-13-10-9%2013-2z%22/%3E%3Cpath%20d%3D%22M112%2020c6-8%2018-2%2012%208l-12%2012-12-12c-6-10%206-16%2012-8z%22/%3E%3Crect%20x%3D%22132%22%20y%3D%2256%22%20width%3D%2218%22%20height%3D%2224%22%20rx%3D%223%22/%3E%3Cpath%20d%3D%22M18%2070h26M18%2078h18%22/%3E%3Cpath%20d%3D%22M70%2072c8-10%2022-10%2030%200%22/%3E%3Ccircle%20cx%3D%2285%22%20cy%3D%2286%22%20r%3D%223%22/%3E%3Cpath%20d%3D%22M110%20104l14%2014m0-14l-14%2014%22/%3E%3Cpath%20d%3D%22M20%20118c10%200%2010%2014%2020%2014s10-14%2020-14%22/%3E%3Crect%20x%3D%2270%22%20y%3D%22120%22%20width%3D%2224%22%20height%3D%2218%22%20rx%3D%224%22/%3E%3Cpath%20d%3D%22M76%20120v-5a6%206%200%200%201%2012%200v5%22/%3E%3Cpath%20d%3D%22M130%20136l8-16%208%2016z%22/%3E%3C/svg%3E") repeat; }
.wa-body { padding: 16px 60px; gap: 6px; }
.wa-day, .wa6-day { align-self: center; padding: 5px 11px; border-radius: 7px; background: #182229; color: #8696a0; font-size: 11.5px; margin: 4px 0 6px; box-shadow: 0 1px 1px #0005; }
.wa-msg { position: relative; border-top-left-radius: 0; font-size: 14px; padding: 7px 10px 6px; box-shadow: 0 1px 1px #0006; }
.wa-msg::before { content: ""; position: absolute; top: 0; left: -7px; border-style: solid; border-width: 0 7px 9px 0; border-color: transparent #202c33 transparent transparent; }
.wa-msg.me { border-top-left-radius: 8px; border-top-right-radius: 0; }
.wa-msg.me::before { left: auto; right: -7px; border-width: 0 0 9px 7px; border-color: transparent transparent transparent #005c4b; }
.wa-input { padding: 10px 16px; gap: 14px; }
.wa-ic { color: #8696a0; font-size: 21px; line-height: 1; }
.wa-field { border-radius: 8px; }
#w6-twocy { z-index: 3; opacity: 0; transform: translateY(70px) scale(.9); transform-origin: 50% 100%; pointer-events: none; }
#w6-twocy.open { z-index: 20; opacity: 1; transform: none; }
#w6-twocy iframe { width: 1500px; height: 776px; transform: scale(.8); }
.tb6 .app { position: relative; }
.bdg6 { position: absolute; top: -5px; right: -6px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: #ff5a2c; color: #fff; font: 700 10.5px/18px Inter, sans-serif; text-align: center; transform: scale(0); transition: transform .25s cubic-bezier(.2, .8, .2, 1.4); }
.bdg6.on { transform: scale(1); }
.tb6 .app.hop i { animation: hop6 .55s cubic-bezier(.2, .8, .2, 1); }
@keyframes hop6 { 35% { transform: translateY(-9px); } }
.tb6 .app.open::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 14px; height: 3px; border-radius: 2px; background: #ff5a2c; translate: -50% 0; }

/* dor: maior e mais real */
.pain6 { grid-template-columns: 1.25fr 1fr 1fr; gap: 24px; }
.pv6, .wa6, .files6 { height: 300px; }
.pv6 { position: relative; box-shadow: 0 30px 60px -30px #000, 0 0 0 1px #ffffff10; }
.chrome6-page { grid-template-columns: 1.7fr 1fr; gap: 12px; padding: 14px; background: #0f0f0f; height: calc(100% - 74px); transition: filter .4s, opacity .4s; }
.chrome6-page i { height: auto !important; width: auto !important; border-radius: 10px; }
.chrome6-page i:nth-child(1) { grid-row: span 2; background: radial-gradient(circle at 50% 50%, #ffffff30 0 20px, transparent 21px), linear-gradient(135deg, #452626, #1c1c2c); }
.chrome6-page i:nth-child(2), .chrome6-page i:nth-child(3) { background: linear-gradient(#262626 0 0) 0 0 / 100% 46% no-repeat, linear-gradient(#1f1f1f 0 0) 0 100% / 70% 30% no-repeat; }
.chrome6-count { bottom: auto; top: 86px; right: 12px; }
.ram6 { position: absolute; left: 12px; right: 12px; bottom: 12px; display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 10px; background: #000c; backdrop-filter: blur(6px); color: #ddd; font-size: 12px; }
.ram6 i { flex: 1; height: 7px; border-radius: 4px; background: #ffffff1c; overflow: hidden; }
.ram6 b { display: block; height: 100%; width: var(--ram, 38%); border-radius: 4px; background: linear-gradient(90deg, #f5a623, #e5484d); transition: width .3s; }
.ram6 em { font-style: normal; font-weight: 700; min-width: 34px; text-align: right; }
.hang6 { position: absolute; left: 50%; top: 50%; translate: -50% -60%; width: 250px; padding: 14px 16px; border-radius: 10px; background: #2b2b2b; border: 1px solid #ffffff22; box-shadow: 0 20px 50px #000c; color: #eee; font-size: 12.5px; font-weight: 600; opacity: 0; scale: .95; transition: opacity .3s, scale .3s; }
.hang6::after { content: "Aguardar      Fechar o programa"; display: block; margin-top: 12px; color: #9ec5ff; font-weight: 500; font-size: 11.5px; white-space: pre; }
.pv6.frozen .hang6 { opacity: 1; scale: 1; }
.pv6.frozen .chrome6-page { filter: brightness(1.7) saturate(.2); opacity: .5; }
.wa6 { background: #0b141a; }
.wa6-head { padding: 9px 12px; gap: 10px; }
.wa6-head i { width: 32px; height: 32px; }
.wa6-head em { margin-left: auto; color: #aebac1; font-style: normal; letter-spacing: 6px; }
.wa6-body { gap: 5px; padding: 10px 14px; overflow: hidden; justify-content: flex-end; }
.wa6-b { position: relative; border-top-right-radius: 0; padding: 6px 8px; box-shadow: 0 1px 1px #0006; align-items: flex-end; }
.wa6-b::before { content: ""; position: absolute; top: 0; right: -6px; border-style: solid; border-width: 0 0 8px 6px; border-color: transparent transparent transparent #005c4b; }
.wa6-b small u { text-decoration: none; color: #53bdeb; }
.wa6-prev { display: grid !important; gap: 1px; padding: 5px 8px; border-radius: 5px; background: #0a3d33; border-left: 3px solid #06cf9c; white-space: normal !important; }
.wa6-prev b { color: #e9edef; font-size: 11.5px; }
.wa6-b.lnk, .wa6-b.img { flex-direction: column; align-items: stretch; }
.wa6-b.lnk small { align-self: flex-end; }
.wa6-b.img { padding: 3px; }
.wa6-img { display: block; width: 150px; height: 64px; border-radius: 5px; background: linear-gradient(160deg, #ffe2c7, #f4a26155 60%, #2a9d8f); }
.wa6-b.img small { position: absolute; right: 8px; bottom: 6px; color: #fff; }
.wa6-b.aud { align-items: center; gap: 8px; }
.wa6-play { color: #aebac1; font-size: 13px; }
.wa6-wave { display: block !important; width: 110px; height: 18px; background: repeating-linear-gradient(90deg, #aebac1 0 2px, transparent 2px 5px); clip-path: polygon(0 40%, 8% 20%, 16% 55%, 24% 10%, 32% 45%, 40% 25%, 48% 60%, 56% 15%, 64% 50%, 72% 30%, 80% 55%, 88% 20%, 100% 45%, 100% 60%, 88% 80%, 80% 45%, 72% 70%, 64% 50%, 56% 85%, 48% 40%, 40% 75%, 32% 55%, 24% 90%, 16% 45%, 8% 80%, 0 60%); }
.files6 { padding: 0; display: flex; flex-direction: column; }
.fx6-bar { display: flex; align-items: center; gap: 8px; height: 36px; flex: none; padding: 0 12px; background: #202020; border-bottom: 1px solid #ffffff10; color: #ccc; font-size: 12px; }
.fx6-bar b { width: 14px; height: 11px; border-radius: 2px; background: #f5c542; }
.fx6-bar em { margin-left: auto; font-style: normal; color: #888; }
.fx6-grid { flex: 1; display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px 8px; padding: 12px; align-content: start; overflow: hidden; }
.fx6-grid span { display: grid; justify-items: center; gap: 5px; min-width: 0; color: #cfcfcf; font-size: 10px; text-align: center; }
.fx6-grid span i { width: 100%; aspect-ratio: 16 / 10; border-radius: 3px; border: 1px solid #ffffff1a; background: var(--g); box-shadow: 0 2px 6px #0006; }
.fx6-grid span em { font-style: normal; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* para quem */
.who7 { margin-top: 36px; }
.who7-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.who7-chips button { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border: 1px solid var(--border); border-radius: 999px; background: var(--white); color: var(--muted); font: 600 14px var(--font); cursor: pointer; transition: color .2s, border-color .2s, background .2s; }
.who7-chips button[aria-selected="true"] { color: var(--ink); border-color: color-mix(in srgb, var(--accent) 55%, var(--border)); background: color-mix(in srgb, var(--accent) 9%, var(--white)); }
.who7-panel { display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: center; max-width: 1000px; min-height: 300px; margin: 30px auto 0; padding: 34px; border-radius: 24px; border: 1px solid var(--border); background: linear-gradient(150deg, color-mix(in srgb, var(--accent) 10%, var(--white)), var(--white) 45%, color-mix(in srgb, #7c5cff 9%, var(--white))); }
.who7-txt h3 { font-size: clamp(22px, 2.4vw, 30px); line-height: 1.15; letter-spacing: -.02em; }
.who7-txt p { margin-top: 12px; color: var(--muted); font-size: 16px; line-height: 1.55; }
.who7-cards { display: grid; gap: 10px; }
.who7-cards .sp7-card { animation: sp7-in .5s cubic-bezier(.2, .8, .2, 1) both; }
.who7-cards .sp7-card:nth-child(2) { animation-delay: .08s; } .who7-cards .sp7-card:nth-child(3) { animation-delay: .16s; }
.sp7-card { color: #f2f2ef; background: #1f1f1f; }

/* biblioteca: brilho sem corte */
.lib7 { overflow: visible; }
.lib7::before { top: 18%; height: 70%; width: min(1400px, 100vw); background: radial-gradient(closest-side at 32% 45%, color-mix(in srgb, var(--accent) 34%, transparent), transparent), radial-gradient(closest-side at 70% 55%, #7c5cff3d, transparent); filter: blur(24px); }

/* guarde junto */
.share7 { grid-template-columns: 1fr; gap: 34px; text-align: center; }
.share7-txt p { margin-left: auto; margin-right: auto; }
.share7-vis { padding: 0; border: 0; background: none; box-shadow: none; }
.duo7 { position: relative; display: grid; grid-template-columns: 1fr 230px 1fr; align-items: center; max-width: 1040px; margin: 0 auto; }
.pc7 { position: relative; z-index: 2; padding: 14px; border-radius: 18px; border: 1px solid #ffffff17; background: linear-gradient(160deg, #262626, #191919); box-shadow: 0 30px 70px -30px #000; color: #f2f2ef; text-align: left; }
.pc7-top { display: flex; align-items: center; gap: 10px; padding: 2px 4px 12px; border-bottom: 1px solid #ffffff10; }
.pc7-top img { width: 30px; height: 30px; border-radius: 50%; image-rendering: pixelated; }
.pc7-top b { font-size: 14px; } .pc7-top small { margin-left: auto; color: #8f8f88; font-size: 12px; }
.pc7-list { display: grid; gap: 8px; margin-top: 12px; min-height: 262px; align-content: start; }
.sp7-card.got { box-shadow: inset 3px 0 0 #7c5cff; }
.sp7-card.sent { box-shadow: inset 3px 0 0 var(--accent); }
.hub7 { position: relative; display: grid; justify-items: center; gap: 4px; padding: 18px 12px; }
.hub7 img { position: relative; z-index: 2; width: 64px; height: 64px; border-radius: 18px; image-rendering: pixelated; box-shadow: 0 0 0 6px #ffffff0d, 0 18px 40px -10px color-mix(in srgb, var(--accent) 70%, transparent); transition: box-shadow .3s, transform .3s; }
.hub7.pulse img { transform: scale(1.08); box-shadow: 0 0 0 10px color-mix(in srgb, var(--accent) 22%, transparent), 0 18px 50px -6px var(--accent); }
.hub7 b { margin-top: 8px; font-size: 14px; } .hub7 small { color: var(--muted); font-size: 12px; }
.hub7-line { position: absolute; top: 50px; height: 2px; width: 50%; background: repeating-linear-gradient(90deg, color-mix(in srgb, var(--ink) 25%, transparent) 0 6px, transparent 6px 12px); z-index: 1; }
.hub7-line.l { right: 50%; } .hub7-line.r { left: 50%; }
.tok7 { position: absolute; z-index: 5; display: flex; align-items: center; gap: 6px; padding: 5px 10px 5px 5px; border-radius: 999px; background: #15131cf0; border: 1px solid #ffffff22; color: #fff; font-size: 11.5px; white-space: nowrap; box-shadow: 0 10px 24px #0007; translate: -50% -50%; transition: left .75s cubic-bezier(.6, 0, .2, 1), top .75s cubic-bezier(.6, 0, .2, 1), opacity .3s; pointer-events: none; }
.tok7 img { width: 18px; height: 18px; border-radius: 50%; image-rendering: pixelated; }
.duo7-cap { min-height: 24px; margin-top: 20px; color: var(--muted); font-size: 15px; text-align: center; }
.duo7-cap b { color: var(--ink); }

/* depoimentos: formato da V2 */
.tcar .tcard[hidden] { display: none; }
.tcard .tav { background-size: cover; background-position: center; image-rendering: pixelated; }

/* preços */
.plans7 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 900px; margin: 28px auto 0; }
.pl7 { position: relative; display: flex; flex-direction: column; padding: 30px; border-radius: 22px; border: 1px solid var(--border); background: var(--white); }
.pl7.is-pro { border: 1.5px solid transparent; background: linear-gradient(var(--white), var(--white)) padding-box, linear-gradient(150deg, var(--accent), #7c5cff 55%, #ffffff22) border-box; box-shadow: 0 40px 90px -45px color-mix(in srgb, var(--accent) 80%, transparent); }
.pl7.is-pro::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(120% 60% at 100% 0, color-mix(in srgb, var(--accent) 14%, transparent), transparent 60%); pointer-events: none; }
.pl7-top { display: flex; align-items: center; justify-content: space-between; }
.pl7-top h3 { font-size: 20px; } .pl7-top span { color: var(--muted); font-size: 13px; }
.pl7-tag { padding: 4px 10px; border-radius: 999px; background: var(--accent); color: #fff !important; font-weight: 700; font-size: 12px !important; }
.pl7-price { margin: 18px 0 0; font: 800 44px/1 var(--font); letter-spacing: -.03em; }
.pl7-price small { display: block; margin-top: 8px; color: var(--muted); font: 500 13.5px var(--font); letter-spacing: 0; }
.pl7-save { margin: 8px 0 0; color: #2ac777; font-size: 13.5px; font-weight: 600; min-height: 20px; }
.pl7 .btn { position: relative; justify-content: center; margin: 20px 0 22px; }
.pl7-all { margin: 0 0 10px; font-size: 13.5px; font-weight: 700; }
.pl7 ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.pl7 li { display: flex; gap: 10px; font-size: 14.5px; line-height: 1.4; color: var(--ink); }
.pl7 li svg { flex: none; width: 18px; height: 18px; margin-top: 1px; padding: 3px; border-radius: 50%; color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, transparent); }
.pl7 li small { display: block; color: var(--muted); font-size: 12.5px; }
.trust7 { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 22px; margin-top: 26px; color: var(--muted); font-size: 13.5px; }
.trust7 span { display: inline-flex; align-items: center; gap: 7px; }
.trust7 svg { width: 15px; height: 15px; color: #2ac777; }
.cmp7 { max-width: 900px; margin: 26px auto 0; border: 1px solid var(--border); border-radius: 18px; background: var(--white); overflow: hidden; }
.cmp7 summary { cursor: pointer; padding: 18px 22px; font-weight: 700; font-size: 15px; list-style: none; display: flex; justify-content: space-between; }
.cmp7 summary::-webkit-details-marker { display: none; }
.cmp7 summary::after { content: "+"; color: var(--muted); font-size: 20px; line-height: 1; } .cmp7[open] summary::after { content: "−"; }
.cmp7 table { width: 100%; border-collapse: collapse; font-size: 14px; }
.cmp7 th, .cmp7 td { padding: 11px 22px; border-top: 1px solid var(--border); text-align: left; font-weight: 500; }
.cmp7 thead th { color: var(--muted); font-size: 12.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.cmp7 td { width: 130px; text-align: center; }
.cmp7 thead th:not(:first-child) { text-align: center; }
.cmp7 tr.grp th { padding-top: 18px; color: var(--accent); font: 700 11.5px 'Geist Mono', ui-monospace, Consolas, monospace; letter-spacing: .08em; text-transform: uppercase; border-top: 0; }
.cmp7 td.y svg { width: 17px; height: 17px; color: #2ac777; } .cmp7 td.n { color: var(--muted); } .cmp7 td.v { font-weight: 700; }

/* final: plugado na página */
.kb7-screen { height: 420px; border: 0; border-radius: 0; background: none; overflow: visible; }
.kb7-screen::before { content: ""; position: absolute; left: 50%; top: 50%; width: 760px; height: 520px; translate: -50% -50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--accent) 20%, transparent), transparent); pointer-events: none; }
.kb7-src { top: 8px; color: var(--ink); }
.kb7-src.dim { opacity: .3; }
.kb7-wheel { scale: .8; margin-top: 0; }
.kb7-label { bottom: 4px; }

@media (max-width: 900px) {
  .pain6 { grid-template-columns: 1fr; } .who7-panel, .plans7 { grid-template-columns: 1fr; } .who7-panel { padding: 22px; gap: 22px; }
  .duo7 { grid-template-columns: 1fr; gap: 14px; } .hub7-line { display: none; }
}
.wa6-b { max-width: 88%; }
.wa6-b > span { min-width: 0; }
.wa6-b.lnk .wa6-prev span, .wa6-prev { overflow: hidden; }
.wa6-prev { font-size: 11px; color: #aebac1; word-break: break-all; }
.wa6-b.aud > span:not(.wa6-play):not(.wa6-wave) { display: none; }

/* biblioteca: passos do tour */
.lib7-steps { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 26px; }
.lib7-steps span { display: inline-flex; align-items: center; gap: 8px; padding: 9px 15px 9px 9px; border-radius: 999px; border: 1px solid var(--border); background: color-mix(in srgb, var(--white) 80%, transparent); color: var(--muted); font-size: 14px; font-weight: 600; transition: color .25s, border-color .25s, background .25s; }
.lib7-steps b { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--border); font-size: 11px; }
.lib7-steps span.on { color: var(--ink); border-color: color-mix(in srgb, var(--accent) 55%, var(--border)); background: color-mix(in srgb, var(--accent) 10%, var(--white)); }
.lib7-steps span.on b { background: var(--accent); border-color: var(--accent); color: #fff; }
.lib7-cur { position: absolute; z-index: 5; }
#lib7-frame { position: relative; }

/* ══════ para quem: cenas animadas ══════ */
.who7-chips button { position: relative; overflow: hidden; }
.who7-chips .bar { position: absolute; left: 0; bottom: 0; height: 2px; width: 0; background: var(--accent); }
.who7-chips button[aria-selected="true"] .bar { animation: tab6 9.5s linear forwards; }
.who7-panel { grid-template-columns: 1.55fr 1fr; gap: 34px; max-width: 1120px; padding: 26px; align-items: stretch; }
.who7-stage { position: relative; height: 380px; border-radius: 16px; overflow: hidden; background: radial-gradient(500px 300px at 20% 0, color-mix(in srgb, var(--accent) 20%, transparent), transparent 70%), radial-gradient(400px 300px at 100% 100%, #7c5cff30, transparent 70%), #121214; border: 1px solid #ffffff14; font: 13px/1.45 Inter, "Segoe UI", sans-serif; color: #eee; text-align: left; }
.who7-side { display: flex; flex-direction: column; justify-content: center; }
.who7-side h3 { font-size: clamp(22px, 2.3vw, 28px); line-height: 1.15; letter-spacing: -.02em; }
.who7-side p { margin: 10px 0 18px; color: var(--muted); font-size: 15.5px; line-height: 1.55; }
.who7-cards { gap: 8px; }
.who7-cards .sp7-card { animation: none; }
.who7-cards .sp7-card.got7 { animation: sp7-in .6s cubic-bezier(.2, .8, .2, 1) both; box-shadow: inset 3px 0 0 var(--accent); }
.who7-win { position: absolute; inset: 18px 18px 18px 18px; display: flex; flex-direction: column; overflow: hidden; border-radius: 10px; border: 1px solid #ffffff1c; background: #1c1c1c; box-shadow: 0 30px 60px -20px #000c; opacity: 0; transform: translateY(16px) scale(.97); transition: opacity .45s, transform .55s cubic-bezier(.2, .8, .2, 1); }
.who7-win.in { opacity: 1; transform: none; }
.who7-win .w6-bar { height: 30px; font-size: 11.5px; }
.who7-app { position: relative; flex: 1; min-height: 0; overflow: hidden; }
.who7-cur { z-index: 40; }
.who7-wheel { position: absolute; z-index: 30; width: 760px; height: 620px; scale: .58; transform-origin: 380px 300px; }
.who7-keys { position: absolute; left: 50%; bottom: 26px; z-index: 35; translate: -50% 0; display: flex; align-items: center; gap: 6px; padding: 7px 9px; border-radius: 12px; border: 1px solid #ffffff22; background: #0d0d0ce6; animation: sp7-in .25s ease-out both; }
.who7-keys .k { min-width: 38px; height: 34px; display: grid; place-items: center; padding: 0 10px; border: 1px solid #ff9a78; border-bottom-width: 3px; border-radius: 8px; background: #ff5a2c; color: #fff; font: 600 12.5px 'Geist Mono', ui-monospace, Consolas, monospace; }
.who7-keys em { color: #8a8a84; font-style: normal; }
.who7-snip { position: absolute; z-index: 25; border: 2px solid #ff5a2c; border-radius: 4px; box-shadow: 0 0 0 9999px #0008; transition: width .8s cubic-bezier(.3, .7, .2, 1), height .8s cubic-bezier(.3, .7, .2, 1); }
.who7-snip::after { content: attr(data-size); position: absolute; left: 0; top: -24px; padding: 2px 7px; border-radius: 5px; background: #ff5a2c; color: #fff; font: 600 10.5px 'Geist Mono', ui-monospace, Consolas, monospace; white-space: nowrap; }
.tg { transition: background .6s; border-radius: 3px; }
.tg.sel { background: #3b82f680; }
.who7-stage .fly6 { z-index: 45; }

/* Slides */
.sc-slides { display: flex; height: 100%; background: #f1f3f4; }
.sc-slides aside { width: 74px; padding: 10px 8px; display: grid; gap: 8px; align-content: start; background: #e8eaed; }
.sc-slides aside i { height: 34px; border-radius: 3px; background: #fff; border: 1px solid #dadce0; }
.sc-slides aside i.on { border: 2px solid #f4b400; }
.sc-slide { flex: 1; margin: 14px; padding: 18px 22px; background: #fff; border-radius: 4px; box-shadow: 0 1px 3px #0002; color: #202124; }
.sc-slide small { color: #f29900; font: 700 10px Inter, sans-serif; letter-spacing: .08em; }
.sc-slide h4 { margin: 4px 0 12px; font: 700 20px Inter, sans-serif; color: #202124; }
.sc-formula { display: block; padding: 8px 10px; font: 500 16px "Cambria Math", Georgia, serif; }
.sc-formula span { text-decoration: overline; }
.sc-formula svg { display: block; width: 240px; height: 92px; margin-top: 8px; }
/* TikTok */
.sc-tiktok { display: flex; gap: 14px; height: 100%; padding: 12px 16px; background: #000; }
.sc-phone { position: relative; width: 170px; flex: none; border-radius: 12px; overflow: hidden; background: linear-gradient(170deg, #25f4ee55, #111 45%, #fe2c5566), #111; }
.sc-vid { position: absolute; left: 10px; right: 42px; bottom: 12px; color: #fff; }
.sc-vid b { font-size: 12px; } .sc-vid p { margin: 4px 0; font-size: 11.5px; line-height: 1.4; } .sc-vid small { color: #ffffffb0; font-size: 10px; }
.sc-phone ul { position: absolute; right: 6px; bottom: 16px; margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; text-align: center; color: #fff; font-size: 16px; }
.sc-phone ul small { display: block; font-size: 8.5px; color: #ffffffcc; }
.sc-comments { flex: 1; color: #fff; } .sc-comments b { font-size: 12.5px; }
.sc-comments p { display: flex; gap: 8px; margin: 12px 0 0; font-size: 12px; } .sc-comments p i { width: 26px; height: 26px; flex: none; border-radius: 50%; background: var(--c); }
.sc-comments em { display: block; color: #ffffff90; font-style: normal; font-size: 11px; }
/* Twitch */
.sc-twitch { display: flex; height: 100%; background: #0e0e10; }
.sc-game { position: relative; flex: 1; background: radial-gradient(circle at 60% 40%, #3a6b35, #16241a 60%), #111; }
.sc-live { position: absolute; left: 10px; top: 10px; padding: 2px 6px; border-radius: 4px; background: #eb0400; color: #fff; font: 700 10px Inter, sans-serif; }
.sc-hp { position: absolute; left: 12px; bottom: 14px; width: 120px; height: 8px; border-radius: 4px; background: linear-gradient(90deg, #3ddc84 70%, #333 70%); }
.sc-map { position: absolute; right: 10px; top: 10px; width: 60px; height: 60px; border-radius: 6px; background: #0008; border: 1px solid #ffffff33; }
.sc-game b { position: absolute; left: 50%; top: 45%; translate: -50% 0; color: #ffffffcc; font: 800 13px Inter, sans-serif; letter-spacing: .1em; }
.sc-chat { width: 210px; padding: 10px 12px; border-left: 1px solid #ffffff14; background: #18181b; }
.sc-chat b { color: #adadb8; font-size: 10.5px; letter-spacing: .06em; }
.sc-chat p { margin: 9px 0 0; font-size: 12px; color: #efeff1; } .sc-chat em { font-style: normal; font-weight: 700; margin-right: 5px; }
/* VS Code */
.sc-code { display: flex; height: 100%; background: #1e1e1e; font: 12px/1.7 'JetBrains Mono', 'Geist Mono', ui-monospace, Consolas, monospace; }
.sc-code aside { width: 120px; padding: 8px 10px; background: #252526; color: #ccc; font-size: 11.5px; }
.sc-code aside b { color: #bbb; font-size: 10px; letter-spacing: .06em; } .sc-code aside p { margin: 4px 0 0; } .sc-code aside p.on { color: #fff; background: #37373d; margin: 4px -10px 0; padding: 0 10px; }
.sc-editor { flex: 1; color: #d4d4d4; }
.sc-tabs { display: flex; background: #252526; margin-bottom: 6px; } .sc-tabs span { padding: 5px 12px; color: #999; font-size: 11.5px; } .sc-tabs span.on { background: #1e1e1e; color: #fff; }
.sc-editor p { margin: 0; white-space: nowrap; } .sc-editor p em { display: inline-block; width: 30px; color: #858585; font-style: normal; text-align: right; margin-right: 14px; }
.sc-editor .k { color: #c586c0; font-style: normal; } .sc-editor .f { color: #dcdcaa; font-style: normal; } .sc-editor .s { color: #ce9178; font-style: normal; }
/* Figma */
.sc-figma { display: flex; flex-direction: column; height: 100%; background: #1e1e1e; }
.sc-ftool { display: flex; align-items: center; gap: 8px; height: 34px; padding: 0 10px; background: #2c2c2c; color: #ddd; font-size: 11.5px; }
.sc-ftool i { width: 16px; height: 16px; border-radius: 3px; background: #ffffff22; } .sc-ftool span { margin-left: auto; margin-right: auto; }
.sc-canvas { position: relative; flex: 1; background: #e5e5e5; }
.sc-frame { position: absolute; left: 34px; top: 30px; width: 300px; }
.sc-frame small, .sc-frame2 small { display: block; color: #666; font-size: 10px; margin-bottom: 3px; }
.sc-frame > div { height: 190px; padding: 22px; border-radius: 2px; background: linear-gradient(135deg, #1c1c1c, #2a1a14); color: #fff; }
.sc-frame b { font: 800 13px Inter, sans-serif; color: #ff8a62; } .sc-frame p { margin: 26px 0 16px; font: 800 21px/1.1 Inter, sans-serif; } .sc-frame i { display: block; width: 110px; height: 30px; border-radius: 999px; background: #ff5a2c; }
.sc-frame2 { position: absolute; right: 30px; top: 30px; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; width: 110px; }
.sc-frame2 small { grid-column: span 2; } .sc-frame2 span { height: 40px; border-radius: 4px; background: var(--c); border: 1px solid #0002; }
/* Planta */
.sc-plan { position: relative; height: 100%; background: #0b3d91 linear-gradient(#ffffff10 1px, transparent 1px) 0 0 / 20px 20px, #0b3d91 linear-gradient(90deg, #ffffff10 1px, transparent 1px) 0 0 / 20px 20px; }
.sc-plan svg { position: absolute; inset: 10px; width: calc(100% - 20px); height: calc(100% - 20px); }
.sc-room { position: absolute; left: 39.5%; top: 11%; width: 21%; height: 44%; }
/* Instagram */
.sc-insta { display: flex; gap: 16px; height: 100%; padding: 12px 20px; background: #000; }
.sc-post { width: 250px; flex: none; color: #f5f5f5; }
.sc-post header { display: flex; align-items: center; gap: 8px; font-size: 12px; } .sc-post header i { width: 26px; height: 26px; border-radius: 50%; background: linear-gradient(45deg, #feda75, #d62976, #4f5bd5); }
.sc-post header small { margin-left: auto; color: #a8a8a8; font-size: 10.5px; }
.sc-adimg { display: grid; place-items: center; align-content: center; gap: 6px; height: 205px; margin: 8px 0; border-radius: 4px; background: radial-gradient(circle at 30% 20%, #ff5a2c, #7a1f0d 60%, #1a0703); text-align: center; }
.sc-adimg b { font: 900 30px/0.95 Inter, sans-serif; color: #fff; letter-spacing: -.02em; } .sc-adimg span { color: #ffe0d2; font-weight: 700; } .sc-adimg em { margin-top: 8px; padding: 4px 12px; border-radius: 999px; background: #fff; color: #111; font: 700 11px Inter, sans-serif; }
.sc-post footer { font-size: 15px; letter-spacing: 6px; } .sc-post footer small { display: block; letter-spacing: 0; font-size: 11px; color: #ddd; }
.sc-stories { display: grid; gap: 10px; align-content: start; } .sc-stories i { width: 46px; height: 46px; border-radius: 50%; border: 2px solid #d62976; background: #333; }
@media (max-width: 900px) { .who7-panel { grid-template-columns: 1fr; } .who7-stage { height: 340px; } .sc-comments, .sc-chat, .sc-code aside, .sc-stories { display: none; } }

/* dor em movimento */
.wa6 { position: relative; }
.wa6-load { position: absolute; left: 50%; top: 52px; translate: -50% 0; display: flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px; background: #202c33f2; color: #aebac1; font-size: 11.5px; box-shadow: 0 4px 12px #0006; z-index: 2; }
.wa6-load i { width: 13px; height: 13px; border-radius: 50%; border: 2px solid #00a88444; border-top-color: #00a884; animation: spin7 .8s linear infinite; }
@keyframes spin7 { to { transform: rotate(360deg); } }
.wa6-new { animation: wa-in .4s cubic-bezier(.2, .8, .2, 1) both; }
.fx6-new { animation: fx7 .45s cubic-bezier(.2, .8, .2, 1.3) both; }
@keyframes fx7 { from { opacity: 0; transform: scale(.6); } }

.who7-snipbar { position: absolute; z-index: 32; width: 600px; scale: .82; transform-origin: 0 0; }

/* ══════ rodada 4 ══════ */
/* fundo preto de verdade */
body.dark { --page: #050506; --white: #0e0e10; --off: #09090a; --paper: #141416; --border: #1c1c1f; --border2: #2a2a2e; --muted: #9b9ba3; --hud-bg: #121214; }
/* hero: aurora de pixels */
.hero7 { isolation: isolate; }
.px7 { position: absolute; left: 0; top: 0; z-index: -1; width: 100%; height: 640px; opacity: .5; image-rendering: pixelated; pointer-events: none; -webkit-mask: radial-gradient(70% 90% at 50% 0%, #000 30%, transparent 75%); mask: radial-gradient(70% 90% at 50% 0%, #000 30%, transparent 75%); }
body:not(.dark) .px7 { opacity: .35; }
.hero7 .h7 { text-shadow: 0 2px 30px #0008; }
/* rotina mais rápida */
.who7-cur { transition-duration: .5s; }
.who7-chips button[aria-selected="true"] .bar { animation-duration: 6s; }
.who7-snip { transition-duration: .5s; }
/* fique por dentro */
#loop .tv.v2-video { background-size: cover; background-position: center; image-rendering: pixelated; }
/* footer */
.foot-cta7 { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding: 26px 28px; margin-bottom: 34px; border-radius: 18px; border: 1px solid var(--border); background: radial-gradient(80% 140% at 0% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 60%), var(--white); }
.foot-cta7 b { display: block; font-size: 22px; letter-spacing: -.02em; } .foot-cta7 span { color: var(--muted); font-size: 14.5px; }
.foot7 { grid-template-columns: 1.3fr repeat(4, 1fr) !important; gap: 28px !important; }
.foot7 .foot-col a { display: flex; align-items: center; gap: 6px; }
.foot7 .off7 { cursor: default; color: var(--muted2) !important; }
.soon7 { padding: 1px 6px; border-radius: 999px; border: 1px solid var(--border2); color: var(--muted); font-size: 10px; font-weight: 600; }
.foot-social { display: flex; gap: 8px; margin-top: 16px; }
.foot-social a { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; border: 1px solid var(--border); color: var(--muted); }
.foot-social a:hover { color: var(--ink); border-color: var(--border2); }
.foot-social svg { width: 17px; height: 17px; }
@media (max-width: 900px) { .foot7 { grid-template-columns: 1fr 1fr !important; } .foot7 .foot-brand { grid-column: span 2; } }

/* ══════ rodada 5: hero grande, estilo Raycast ══════ */
.hero7 { min-height: 100vh; min-height: 100svh; display: flex; align-items: center; padding: 120px 0 70px; }
.hero7 > .wrap { position: relative; z-index: 1; width: 100%; }
.hero7::after { display: none; }
.px7 { inset: 0; height: 100%; opacity: .92; -webkit-mask: radial-gradient(75% 80% at 50% 48%, #000 35%, transparent 85%); mask: radial-gradient(75% 80% at 50% 48%, #000 35%, transparent 85%); }
.hero7 .h7 { font-size: clamp(40px, 5.4vw, 70px); line-height: 1.02; text-shadow: 0 4px 40px #000c, 0 1px 2px #0008; }
.hero7 .sub7 { color: #e6e6e6; text-shadow: 0 2px 16px #000; }
.hero7 .sub7 b { color: #fff; }
.hero7 .hero-micro { color: #cfcfcf; text-shadow: 0 1px 10px #000; }
/* hero claro: ver Rodada 7c no fim */
.hero7-more { display: inline-flex; align-items: center; gap: 8px; margin-top: 40px; padding: 8px 16px; border-radius: 999px; border: 1px solid #ffffff2a; background: #0009; color: #eee; font-size: 13.5px; font-weight: 600; text-decoration: none; backdrop-filter: blur(6px); }
.hero7-more span { display: inline-block; animation: bob7 1.6s ease-in-out infinite; }
@keyframes bob7 { 50% { transform: translateY(3px); } }
.demo7 { padding-top: 40px !important; }
.demo7 .demo6 { margin-top: 30px; }
.hero7 .h7 { max-width: 1060px; font-size: clamp(40px, 5vw, 64px); }

/* hero: opções */
.px7[data-mode="2"], .px7[data-mode="3"] { -webkit-mask: radial-gradient(90% 95% at 50% 48%, #000 55%, transparent 100%); mask: radial-gradient(90% 95% at 50% 48%, #000 55%, transparent 100%); }
.px7[data-mode="4"] { opacity: 1; -webkit-mask: linear-gradient(#000 70%, transparent); mask: linear-gradient(#000 70%, transparent); }
.pick7 { position: fixed; left: 50%; bottom: 18px; z-index: 300; translate: -50% 0; display: flex; align-items: center; gap: 6px; padding: 6px; border-radius: 14px; border: 1px solid #ffffff26; background: #0b0b0ce8; backdrop-filter: blur(10px); box-shadow: 0 20px 50px #000a; font: 600 13px Inter, sans-serif; color: #eee; }
.pick7 b { padding: 0 8px; color: #999; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.pick7 button { height: 34px; padding: 0 12px; border: 1px solid #ffffff1a; border-radius: 10px; background: transparent; color: #bbb; font: 600 13px Inter, sans-serif; cursor: pointer; }
.pick7 button[aria-pressed="true"] { background: #ff5a2c; border-color: #ff5a2c; color: #fff; }

.px7[data-mode="5"] { opacity: .85; -webkit-mask: radial-gradient(95% 100% at 50% 50%, #000 50%, transparent 100%); mask: radial-gradient(95% 100% at 50% 50%, #000 50%, transparent 100%); }
.px7[data-mode="6"], .px7[data-mode="7"] { opacity: 1; -webkit-mask: linear-gradient(#000 78%, transparent); mask: linear-gradient(#000 78%, transparent); }
.pick7 { flex-wrap: wrap; justify-content: center; max-width: calc(100vw - 24px); }

.px7[data-mode="8"] { opacity: .55; -webkit-mask: radial-gradient(85% 95% at 50% 10%, #000 35%, transparent 80%); mask: radial-gradient(85% 95% at 50% 10%, #000 35%, transparent 80%); }

/* ══════ brilhos de pixels pontuais ══════ */
.pxa { position: absolute; z-index: 0; pointer-events: none; image-rendering: pixelated; opacity: .75; }
.who7-panel, .plans7, .loop2 { position: relative; }
.who7-panel > *:not(.pxa), .plans7 > *:not(.pxa), .loop2 > *:not(.pxa) { position: relative; z-index: 1; }
#pxa-who { inset: -90px -140px; width: calc(100% + 280px); height: calc(100% + 180px); -webkit-mask: radial-gradient(closest-side, #000 55%, transparent); mask: radial-gradient(closest-side, #000 55%, transparent); }
.who7-panel { background: linear-gradient(150deg, color-mix(in srgb, var(--accent) 6%, var(--white)), var(--white) 45%) !important; }
#pxa-price { inset: -60px -160px; width: calc(100% + 320px); height: calc(100% + 120px); opacity: .55; -webkit-mask: radial-gradient(closest-side at 70% 45%, #000 40%, transparent); mask: radial-gradient(closest-side at 70% 45%, #000 40%, transparent); }
#pxa-loop { inset: -80px -120px; width: calc(100% + 240px); height: calc(100% + 160px); -webkit-mask: radial-gradient(closest-side, #000 45%, transparent); mask: radial-gradient(closest-side, #000 45%, transparent); }
footer { position: relative; overflow: hidden; }
#pxa-foot { left: 0; right: 0; bottom: 0; width: 100%; height: 380px; opacity: .6; -webkit-mask: linear-gradient(transparent, #000 45%); mask: linear-gradient(transparent, #000 45%); }
footer .wrap { position: relative; z-index: 1; }
footer .foot-card { background: transparent !important; border-color: transparent !important; box-shadow: none !important; }
.foot-cta7 { background: color-mix(in srgb, var(--white) 70%, transparent); backdrop-filter: blur(8px); }

.who7-wrap { position: relative; }
.who7-wrap > .who7-panel { position: relative; z-index: 1; background: linear-gradient(150deg, color-mix(in srgb, var(--accent) 6%, var(--white)), var(--white) 45%) !important; }
#pxa-who { inset: -80px -120px; width: calc(100% + 240px); height: calc(100% + 160px); }
footer { padding-bottom: 150px !important; }
#pxa-foot { height: 300px; opacity: .55; }
#pxa-who { inset: -120px -200px; width: calc(100% + 400px); height: calc(100% + 240px); opacity: 1; }

/* ══════ dor: antes e depois ══════ */
.bf7 { margin-top: 36px; }
.bf7-fit { position: relative; width: 100%; max-width: 1100px; margin: 0 auto; }
.bf7-stage { position: relative; width: 1100px; height: 560px; transform-origin: 0 0; overflow: hidden; border-radius: 20px; border: 1px solid #ffffff1c; box-shadow: 0 40px 100px -40px #000; cursor: ew-resize; user-select: none; touch-action: pan-y; font: 13px/1.4 Inter, "Segoe UI", sans-serif; color: #eee; }
.bf7-layer { position: absolute; inset: 0; }
.bf7-chaos { background: linear-gradient(#000000b8, #000000d0), url(assets/violet-coral.png) center / cover; image-rendering: pixelated; }
.bf7-order { background: linear-gradient(#00000080, #000000a8), url(assets/brand-orange.png) center / cover; image-rendering: pixelated; clip-path: inset(0 0 0 50%); }
.bf7-order > *, .bf7-chaos > * { image-rendering: auto; }
.bf7-tag { position: absolute; top: 16px; padding: 4px 10px; border-radius: 999px; background: #000a; border: 1px solid #ffffff2a; color: #ffb4a0; font: 700 11px 'Geist Mono', ui-monospace, Consolas, monospace; letter-spacing: .1em; }
.bf7-chaos .bf7-tag { left: 16px; } .bf7-tag.ok { right: 16px; color: #8ff0b8; }
.bf7-icons { position: absolute; left: 0; top: 40px; width: 260px; bottom: 50px; }
.bf7-icons span { position: absolute; width: 70px; display: grid; justify-items: center; gap: 3px; font-size: 9.5px; color: #eee; text-align: center; text-shadow: 0 1px 2px #000; }
.bf7-icons i { width: 46px; height: 34px; border-radius: 3px; border: 2px solid #fff; background: var(--g); box-shadow: 0 3px 8px #0008; }
.bf7-icons em { font-style: normal; max-width: 70px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bf7-chrome { position: absolute; left: 290px; top: 46px; width: 520px; height: 330px; border-radius: 10px; overflow: hidden; background: #0f0f0f; border: 1px solid #ffffff22; box-shadow: 0 24px 60px #000c; }
.bf7-tabs { display: flex; gap: 1px; height: 32px; padding: 6px 6px 0; background: #1f1f1f; }
.bf7-tabs i { flex: 1; border-radius: 6px 6px 0 0; background: #2b2b2b linear-gradient(var(--c), var(--c)) 50% 50% / 9px 9px no-repeat; }
.bf7-addr { height: 30px; margin: 0; padding: 7px 14px; background: #3b3b3b; color: #aaa; font-size: 11px; }
.bf7-page { display: grid; grid-template-columns: 1.6fr 1fr; gap: 10px; padding: 12px; height: 220px; filter: brightness(1.8) saturate(.2); opacity: .45; }
.bf7-page i { border-radius: 8px; background: #333; } .bf7-page i:first-child { grid-row: span 3; background: linear-gradient(135deg, #452626, #1c1c2c); }
.bf7-hang { position: absolute; left: 50%; top: 46%; translate: -50% -50%; width: 290px; padding: 16px 18px; border-radius: 10px; background: #2b2b2b; border: 1px solid #ffffff22; box-shadow: 0 20px 50px #000c; display: flex; flex-wrap: wrap; gap: 10px 16px; animation: shake7 3s ease-in-out infinite; }
.bf7-hang b { width: 100%; font-size: 13px; } .bf7-hang span { color: #9ec5ff; font-size: 12px; }
@keyframes shake7 { 0%, 90%, 100% { transform: none; } 92% { transform: translateX(-3px); } 94% { transform: translateX(3px); } 96% { transform: translateX(-2px); } }
.bf7-ram { position: absolute; left: 12px; right: 12px; bottom: 10px; display: flex; align-items: center; gap: 10px; padding: 7px 12px; border-radius: 9px; background: #000c; font-size: 11.5px; font-weight: 700; color: #ffb4a0; }
.bf7-ram i { flex: 1; height: 7px; border-radius: 4px; background: #ffffff1c; overflow: hidden; } .bf7-ram b { display: block; width: 97%; height: 100%; background: linear-gradient(90deg, #f5a623, #e5484d); }
.bf7-note { position: absolute; left: 220px; top: 360px; width: 150px; padding: 12px; rotate: -4deg; background: #fde68a; color: #3f2d00; font: 700 13px/1.35 "Segoe Print", "Comic Sans MS", cursive; box-shadow: 0 10px 20px #0008; }
.bf7-toasts { position: absolute; right: 14px; bottom: 60px; width: 290px; display: grid; gap: 8px; }
.bf7-toasts div { display: flex; gap: 10px; padding: 11px 12px; border-radius: 9px; background: #2b2b2bf2; border: 1px solid #ffffff1c; box-shadow: 0 10px 24px #0009; font-size: 12px; color: #ddd; animation: sp7-in .45s cubic-bezier(.2, .8, .2, 1) both; }
.bf7-toasts i { width: 26px; height: 26px; flex: none; border-radius: 7px; background: #00a884; }
.bf7-toasts b { display: block; color: #fff; font-size: 11.5px; }
.bf7-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 44px; display: flex; align-items: center; justify-content: center; gap: 8px; background: #1b1b1de8; border-top: 1px solid #ffffff12; }
.bf7-bar i { position: relative; width: 22px; height: 22px; border-radius: 6px; background: var(--c); }
.bf7-bar i em { position: absolute; top: -7px; right: -12px; padding: 0 4px; border-radius: 8px; background: #e5484d; color: #fff; font: 700 9px/15px Inter, sans-serif; font-style: normal; }
.bf7-bar i.on::after { content: ""; position: absolute; left: 50%; bottom: -7px; width: 12px; height: 3px; border-radius: 2px; background: #ff5a2c; translate: -50% 0; }
.bf7-bar span { position: absolute; right: 16px; color: #ddd; font-size: 11.5px; }
.bf7-wheel { position: absolute; left: 90px; top: 110px; width: 300px; height: 300px; }
.bf7-wheel .hudhost { position: absolute; }
.bf7-lib { position: absolute; right: 60px; top: 60px; width: 470px; padding: 16px; border-radius: 16px; background: #161616f0; border: 1px solid #ffffff1c; box-shadow: 0 30px 70px -20px #000; }
.bf7-lib header { display: flex; align-items: center; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid #ffffff10; }
.bf7-lib header img { width: 32px; height: 32px; border-radius: 9px; image-rendering: pixelated; }
.bf7-lib header b { font-size: 15px; } .bf7-lib header small { margin-left: auto; color: #8ff0b8; font-size: 11.5px; }
.bf7-folders { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0; }
.bf7-folders span { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; background: #ffffff0a; border: 1px solid #ffffff14; font-size: 12px; }
.bf7-folders span::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--c); }
.bf7-folders em { color: #888; font-style: normal; }
.bf7-list { display: grid; gap: 7px; }
.bf7-handle { position: absolute; top: 0; bottom: 0; left: 50%; z-index: 20; width: 3px; translate: -50% 0; background: #fff; box-shadow: 0 0 20px #ff5a2c, 0 0 0 1px #0004; cursor: ew-resize; outline: none; }
.bf7-handle i { position: absolute; left: 50%; top: 50%; translate: -50% -50%; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; background: #fff; color: #111; font: 800 15px Inter, sans-serif; font-style: normal; box-shadow: 0 8px 24px #0009, 0 0 0 4px #ff5a2c55; }
.bf7-handle:focus-visible i { box-shadow: 0 0 0 4px #ff5a2c; }
.bf7-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; max-width: 1100px; margin: 22px auto 0; }
.bf7-stats div { padding: 16px 18px; border-radius: 14px; border: 1px solid var(--border); background: var(--white); }
.bf7-stats b { display: block; font-size: 18px; } .bf7-stats span { color: var(--muted); font-size: 13.5px; } .bf7-stats em { display: block; margin-top: 4px; color: #2ac777; font-style: normal; font-weight: 700; }
@media (max-width: 700px) { .bf7-stats { grid-template-columns: 1fr; } }

/* ═════ Rodada 7: fotos reais (Pexels) nas cenas e papel de parede de verdade ═════ */
.bf7-chaos { background: linear-gradient(#0000004d, #00000085), url(assets/photos/pexels-36103492.jpg) center / cover; image-rendering: auto; }
.bf7-order { background: linear-gradient(#00000026, #00000066), url(assets/photos/pexels-36103492.jpg) center / cover; image-rendering: auto; }
.sc-phone { background: linear-gradient(#0000 45%, #000d), url(assets/photos/pexels-7676400.jpg) center 30% / cover, #111; }
.sc-game { background: linear-gradient(#0000 55%, #000a), url(assets/photos/pexels-9071735.jpg) center / cover, #111; }
.sc-game .sc-hp, .sc-game .sc-map { display: none; }
.sc-game b { left: 14px; top: auto; bottom: 12px; translate: none; font-size: 11px; color: #fff; text-shadow: 0 1px 3px #000; }
.sc-frame > div { background: linear-gradient(90deg, #000000c8 30%, #0000 75%), url(assets/photos/pexels-32387194.jpg) center / cover; }
.sc-adimg { background: linear-gradient(#0000 30%, #000000b0), url(assets/photos/pexels-27298299.jpg) center 25% / cover; align-content: end; padding-bottom: 14px; }
.sc-adimg b { text-shadow: 0 2px 10px #0008; }
.sc-stories i { background: #333 center / cover; }
.sc-stories i:nth-child(1) { background-image: url(assets/photos/pexels-16160801.jpg); }
.sc-stories i:nth-child(2) { background-image: url(assets/photos/pexels-16160871.jpg); }
.sc-stories i:nth-child(3) { background-image: url(assets/photos/pexels-977418.jpg); }
.sc-stories i:nth-child(4) { background-image: url(assets/photos/pexels-16160806.jpg); }

/* ═════ Rodada 7b: página clara = Twocy clara (HUDs, dash e cartões). O hero segue escuro. ═════ */
body:not(.dark) .sp7-card { color: #0d0d0c; background: #fff; border-color: #e1e0d8; }
body:not(.dark) .sp7-body small, body:not(.dark) .sp7-meta, body:not(.dark) .pc7-top small { color: #6e6e66; }
body:not(.dark) .sp7-body b.is-link { color: #365fd3; }
body:not(.dark) .sp7-meta em { color: #6e6e66; border-color: #e1e0d8; background: #f6f5f1; }
body:not(.dark) .pc7 { color: #0d0d0c; background: linear-gradient(160deg, #ffffff, #f6f5f1); border-color: #e1e0d8; box-shadow: 0 30px 70px -34px #1d1a1240; }
body:not(.dark) .pc7-top, body:not(.dark) .sp7-head { border-bottom-color: #ecebe4; }
body:not(.dark) .sp7-av img { border-color: #fff; }
body:not(.dark) .hub7 img { box-shadow: 0 0 0 6px #0000000a, 0 18px 40px -10px color-mix(in srgb, var(--accent) 60%, transparent); }
body:not(.dark) .bf7-lib { color: #0d0d0c; background: #fbfbf8f2; border-color: #e1e0d8; box-shadow: 0 30px 70px -24px #0008; }
body:not(.dark) .bf7-lib header { border-bottom-color: #ecebe4; } body:not(.dark) .bf7-lib header small { color: #168342; }
body:not(.dark) .bf7-folders span { background: #fff; border-color: #e1e0d8; } body:not(.dark) .bf7-folders em { color: #96968e; }

/* ═════ Rodada 7c: hero também inverte no tema claro ═════ */
body:not(.dark) .hero7 { background: var(--page, #f6f5f1); }
body:not(.dark) .hero7 .h7 { color: #0d0d0c; text-shadow: 0 2px 30px #fff8; }
body:not(.dark) .hero7 .sub7 { color: #3a3a35; text-shadow: none; } body:not(.dark) .hero7 .sub7 b { color: #0d0d0c; }
body:not(.dark) .hero7 .hero-micro { color: #6e6e66; text-shadow: none; }
body:not(.dark) .hero7-more { background: #fffc; border-color: #0000001a; color: #0d0d0c; }
body:not(.dark) .px7 { filter: invert(1) hue-rotate(180deg) saturate(1.5); mix-blend-mode: multiply; }
body:not(.dark) .px7[data-mode="8"] { opacity: .55; }

/* ═════ Rodada 8: Espaços e equipes (substitui o "Guarde junto" em dupla) ═════ */
/* container com brilho (referência 1: cartão "twocy AI") */
.glow8 { position: relative; border-radius: 22px; border: 1px solid color-mix(in srgb, var(--accent) 55%, transparent); background: radial-gradient(120% 90% at 0% 0%, color-mix(in srgb, var(--accent) 30%, #120706) 0%, #140a09 38%, #0d0d0e 75%); box-shadow: 0 0 0 1px #ff5a2c1a, 0 0 42px -8px color-mix(in srgb, var(--accent) 55%, transparent), inset 0 1px 0 #ffffff14; color: #f2f2ef; }
body:not(.dark) .glow8 { background: radial-gradient(120% 90% at 0% 0%, #ffe3d8 0%, #fff6f2 40%, #ffffff 78%); color: #0d0d0c; box-shadow: 0 0 0 1px #ff5a2c14, 0 24px 60px -24px #ff5a2c66, inset 0 1px 0 #fff; }
.sp8-head { max-width: 760px; margin: 0 auto; text-align: center; }
.sp8-head h2 { font-size: clamp(30px, 3.6vw, 46px); line-height: 1.08; letter-spacing: -.03em; }
.sp8-head p { margin: 14px auto 0; max-width: 640px; color: var(--muted); font-size: 17px; line-height: 1.55; }
.sp8-box { display: grid; grid-template-columns: 260px 1fr; min-height: 470px; max-width: 1040px; margin: 36px auto 0; overflow: hidden; text-align: left; }
.sp8-side { position: relative; padding: 20px 14px; border-right: 1px solid #ffffff12; background: #0000002e; }
body:not(.dark) .sp8-side { border-right-color: #0000000f; background: #ffffff8c; }
.sp8-lbl { display: block; margin: 0 8px 10px; color: #8f8f88; font: 600 10.5px 'Geist Mono', ui-monospace, Consolas, monospace; letter-spacing: .08em; }
.sp8-spaces { display: grid; gap: 4px; }
.sp8-sp { display: flex; align-items: center; gap: 10px; padding: 8px; border-radius: 11px; border: 1px solid transparent; font-size: 13.5px; font-weight: 600; transition: background .25s, border-color .25s; }
.sp8-sp img { width: 30px; height: 30px; border-radius: 8px; image-rendering: pixelated; flex: none; }
.sp8-sp small { display: block; color: #8f8f88; font-size: 11.5px; font-weight: 500; }
.sp8-sp.on { background: #ffffff0f; border-color: #ffffff1a; }
body:not(.dark) .sp8-sp.on { background: #fff; border-color: #0000001a; box-shadow: 0 4px 14px -8px #0003; }
.sp8-sp.fresh { animation: sp7-in .6s cubic-bezier(.2, .8, .2, 1) both; }
.sp8-new { width: 100%; margin-top: 10px; padding: 9px 10px; border-radius: 11px; border: 1px dashed #ffffff2e; background: none; color: inherit; font: 600 13px Inter, sans-serif; text-align: left; opacity: .8; transition: background .2s; }
body:not(.dark) .sp8-new { border-color: #00000026; }
.sp8-new.press { background: color-mix(in srgb, var(--accent) 22%, transparent); opacity: 1; }
.sp8-form { margin-top: 10px; padding: 12px; border-radius: 12px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); background: #0000004d; animation: sp7-in .4s both; }
body:not(.dark) .sp8-form { background: #fff; }
.sp8-form small { display: block; margin: 0 0 6px; color: #8f8f88; font-size: 11px; }
.sp8-input { display: flex; align-items: center; min-height: 32px; margin-bottom: 10px; padding: 0 10px; border-radius: 8px; border: 1px solid #ffffff22; font-size: 13px; font-weight: 600; }
body:not(.dark) .sp8-input { border-color: #0000001f; }
.sp8-input .caret { width: 1.5px; height: 15px; margin-left: 1px; background: var(--accent); animation: blink8 1s steps(2) infinite; }
@keyframes blink8 { 50% { opacity: 0; } }
.sp8-ids { display: flex; gap: 6px; } .sp8-ids img { width: 28px; height: 28px; border-radius: 7px; image-rendering: pixelated; outline: 2px solid transparent; outline-offset: 2px; transition: outline-color .2s; } .sp8-ids img.on { outline-color: var(--accent); }
.sp8-main { position: relative; display: flex; flex-direction: column; padding: 18px 22px; min-width: 0; }
.sp8-top { display: flex; align-items: center; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid #ffffff12; }
body:not(.dark) .sp8-top { border-bottom-color: #0000000f; }
.sp8-top > img { width: 40px; height: 40px; border-radius: 11px; image-rendering: pixelated; }
.sp8-top b { display: block; font-size: 16px; } .sp8-top small { color: #8f8f88; font-size: 12px; }
.sp8-top .grow { flex: 1; }
.sp8-avs { display: flex; padding-left: 8px; } .sp8-avs img { width: 28px; height: 28px; margin-left: -8px; border-radius: 50%; border: 2px solid #1a0f0e; image-rendering: pixelated; }
body:not(.dark) .sp8-avs img { border-color: #fff; }
.sp8-avs img.join { animation: pop8 .5s cubic-bezier(.2, 1.4, .4, 1) both; }
@keyframes pop8 { from { transform: scale(0); } }
.sp8-count { color: #8f8f88; font: 600 11.5px 'Geist Mono', ui-monospace, Consolas, monospace; }
.sp8-inv { padding: 7px 13px; border-radius: 999px; border: 0; background: var(--accent); color: #fff; font: 700 12.5px Inter, sans-serif; transition: transform .15s; }
.sp8-inv.press { transform: scale(.94); }
.sp8-invite { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding: 9px 12px; border-radius: 11px; border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent); background: #00000040; font-size: 13px; animation: sp7-in .4s both; }
body:not(.dark) .sp8-invite { background: #fff; }
.sp8-mail { flex: 1; font-family: 'Geist Mono', ui-monospace, Consolas, monospace; } .sp8-role { color: #8f8f88; font-size: 12px; } .sp8-invite em { font-style: normal; font-weight: 700; color: var(--accent); font-size: 12.5px; }
.sp8-roles { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.sp8-roles span { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px 3px 3px; border-radius: 999px; border: 1px solid #ffffff14; background: #ffffff08; font-size: 12px; }
body:not(.dark) .sp8-roles span { border-color: #0000001a; background: #fff; }
.sp8-roles img { width: 20px; height: 20px; border-radius: 50%; image-rendering: pixelated; } .sp8-roles em { font-style: normal; color: #8f8f88; }
.sp8-roles span.join { animation: sp7-in .5s both; box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 60%, transparent); }
.sp8-feed { display: grid; gap: 8px; margin-top: 14px; align-content: start; flex: 1; }
.sp8-feed .sp7-card { background: #ffffff08; } body:not(.dark) .sp8-feed .sp7-card { background: #fff; }
.sp8-feed .sp7-card.fresh { box-shadow: inset 3px 0 0 var(--accent); }
.sp8-cap { margin: 10px 0 0; min-height: 20px; color: #a3a39c; font-size: 13px; } .sp8-cap b { color: inherit; } body:not(.dark) .sp8-cap { color: #6e6e66; }
.sp8-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; max-width: 1040px; margin: 18px auto 0; }
.sp8-facts div { padding: 16px 18px; border-radius: 14px; border: 1px solid var(--border); background: var(--white); }
.sp8-facts b { display: block; font-size: 15px; } .sp8-facts span { color: var(--muted); font-size: 13.5px; }
@media (max-width: 820px) { .sp8-box { grid-template-columns: 1fr; } .sp8-side { display: none; } .sp8-facts { grid-template-columns: 1fr; } .sp8-avs, .sp8-count { display: none; } }
.sp8-invite[hidden], .sp8-form[hidden], .sp8-new[hidden] { display: none; }


/* Rodada 8b: espaços no padrão do site (o brilho .glow8 fica guardado pra outro lugar) */
.sp8-box.glow8 { border: 1px solid var(--border); background: var(--white); box-shadow: none; color: var(--ink); }
body:not(.dark) .sp8-box.glow8 { background: var(--white); box-shadow: none; }
.sp8-box .sp8-side { background: var(--off); border-right-color: var(--border); }
.sp8-box .sp8-top { border-bottom-color: var(--border); }

/* Rodada 9: o "t." da marca (arte do usuário) na chamada final, com o brilho de pixel da Twocy atrás */
.tm7 { position: relative; width: 200px; height: 196px; margin: 0 auto 26px; perspective: 700px; }
#pxa-t { inset: -110px -190px; width: calc(100% + 380px); height: calc(100% + 220px); opacity: .9; -webkit-mask: radial-gradient(closest-side, #000 35%, transparent); mask: radial-gradient(closest-side, #000 35%, transparent); }
.tm7 img { position: relative; z-index: 1; display: block; width: 100%; height: auto; filter: drop-shadow(0 22px 30px #000a) drop-shadow(0 0 1px #ffffff40); transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform .5s cubic-bezier(.2, .8, .2, 1); animation: float7 6s ease-in-out infinite; }
@keyframes float7 { 50% { translate: 0 -8px; } }
body:not(.dark) .tm7 img { filter: drop-shadow(0 22px 26px #0004); }
body:not(.dark) #pxa-t { opacity: .55; }
@media (prefers-reduced-motion: reduce) { .tm7 img { animation: none; } }
body:not(.dark) .pxa { filter: invert(1) hue-rotate(180deg) saturate(1.5); mix-blend-mode: multiply; }

/* Rodada 10: ícones reais dos apps nas simulações (assets/brands, Simple Icons CC0 + cores oficiais) */
i.bi { background: var(--bi) center / contain no-repeat !important; border-radius: 0 !important; }
i.bi.tw { border-radius: 0 !important; image-rendering: auto; }
.tb6 .start.win { display: block; } .tb6 .start.win img { display: block; width: 18px; height: 18px; }

/* Rodada 12b: cartões do antes/depois iguais aos fatos dos espaços (.sp8-facts) */
.bf7-stats.sp8-facts { margin-top: 18px; }
.bf7-stats.sp8-facts div { padding: 16px 18px; }
/* Rodada 13: cartões pequenos com brilho (referência 1, cartão "twocy AI"), versão contida */
.sp8-facts div { position: relative; padding: 20px 20px 18px; border-radius: 16px; border: 1px solid color-mix(in srgb, var(--accent) 38%, transparent); background: radial-gradient(130% 120% at 0% 0%, color-mix(in srgb, var(--accent) 16%, #140c0b) 0%, #111012 55%, #0d0d0e 100%); box-shadow: 0 0 26px -12px color-mix(in srgb, var(--accent) 60%, transparent), inset 0 1px 0 #ffffff10; transition: border-color .25s, box-shadow .25s, transform .25s; }
.sp8-facts div:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--accent) 60%, transparent); box-shadow: 0 0 34px -10px color-mix(in srgb, var(--accent) 75%, transparent), inset 0 1px 0 #ffffff14; }
.sp8-facts b { font-size: 16px; color: #f4f4f2; }
.sp8-facts span { display: block; margin-top: 6px; padding-top: 10px; border-top: 1px solid #ffffff12; color: #a3a39c; }
body:not(.dark) .sp8-facts div { border-color: color-mix(in srgb, var(--accent) 30%, transparent); background: radial-gradient(130% 120% at 0% 0%, #ffe6dc 0%, #fff8f5 50%, #ffffff 100%); box-shadow: 0 10px 30px -18px #ff5a2c80, inset 0 1px 0 #fff; }
body:not(.dark) .sp8-facts b { color: #0d0d0c; } body:not(.dark) .sp8-facts span { color: #6e6e66; border-top-color: #0000000f; }
/* 13b: sem a linha laranja; fica só o brilho borrado */
.sp8-facts div, .sp8-facts div:hover { border-color: #ffffff0d; }
body:not(.dark) .sp8-facts div, body:not(.dark) .sp8-facts div:hover { border-color: #0000000a; }
/* 13c: brilho só na fileira do antes/depois; nos espaços, cartão simples */
.sp8-facts:not(.bf7-stats) div, .sp8-facts:not(.bf7-stats) div:hover { transform: none; border-color: var(--border); background: var(--white); box-shadow: none; }
.sp8-facts:not(.bf7-stats) b { color: var(--ink); }
.sp8-facts:not(.bf7-stats) span { margin-top: 2px; padding-top: 0; border-top: 0; color: var(--muted); }
body:not(.dark) .sp8-facts:not(.bf7-stats) div { background: var(--white); box-shadow: none; border-color: var(--border); }

/* ═════ Rodada 14: TwocyAI (chegando) — cartão no estilo "twocy AI" da referência 1, sem borda laranja ═════ */
.ai8 { display: grid; grid-template-columns: 1fr 1.05fr; gap: 56px; align-items: center; }
.ai8-txt h2 { font-size: clamp(30px, 3.6vw, 46px); line-height: 1.08; letter-spacing: -.03em; }
.ai8-txt > p { margin-top: 14px; max-width: 460px; color: var(--muted); font-size: 17px; line-height: 1.55; }
.ai8-list { display: grid; gap: 12px; margin: 26px 0 0; padding: 0; list-style: none; }
.ai8-list li { padding-left: 16px; border-left: 2px solid color-mix(in srgb, var(--accent) 55%, transparent); }
.ai8-list b { display: block; font-size: 15px; } .ai8-list span { color: var(--muted); font-size: 14px; }
.ai8-card { position: relative; display: flex; flex-direction: column; height: 460px; padding: 20px; border-radius: 20px; border: 1px solid #ffffff0d; background: radial-gradient(130% 110% at 0% 0%, color-mix(in srgb, var(--accent) 20%, #140c0b) 0%, #111012 55%, #0d0d0e 100%); box-shadow: 0 0 40px -14px color-mix(in srgb, var(--accent) 60%, transparent), inset 0 1px 0 #ffffff10; color: #f2f2ef; }
body:not(.dark) .ai8-card { border-color: #0000000a; background: radial-gradient(130% 110% at 0% 0%, #ffe6dc 0%, #fff8f5 50%, #ffffff 100%); box-shadow: 0 16px 40px -20px #ff5a2c80, inset 0 1px 0 #fff; color: #0d0d0c; }
.ai8-card header { display: flex; align-items: center; gap: 10px; padding-bottom: 14px; border-bottom: 1px solid #ffffff12; }
body:not(.dark) .ai8-card header { border-bottom-color: #0000000f; }
.ai8-mark { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: linear-gradient(135deg, var(--accent), #8b5cf6); color: #fff; font-size: 14px; }
.ai8-card header b { font-size: 16px; } .ai8-card header small { margin-left: auto; color: #8f8f88; font-size: 12px; }
.ai8-chat { flex: 1; display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; padding: 14px 0; overflow: hidden; }
.ai8-msg { max-width: 88%; padding: 10px 13px; border-radius: 14px; font-size: 13.5px; line-height: 1.5; animation: sp7-in .45s cubic-bezier(.2, .8, .2, 1) both; }
.ai8-msg.me { align-self: flex-end; border-bottom-right-radius: 4px; background: var(--accent); color: #fff; }
.ai8-msg.ai { align-self: flex-start; border-bottom-left-radius: 4px; background: #ffffff0d; border: 1px solid #ffffff12; }
body:not(.dark) .ai8-msg.ai { background: #fff; border-color: #0000000f; }
.ai8-msg.ai .sp7-card { margin-top: 8px; padding: 10px 12px; background: #0000002e; }
body:not(.dark) .ai8-msg.ai .sp7-card { background: #f6f5f1; }
.ai8-msg ul { margin: 6px 0 0; padding-left: 18px; } .ai8-msg li { margin: 2px 0; }
.ai8-sug { display: grid; gap: 6px; margin-top: 8px; }
.ai8-sug label { display: flex; align-items: center; gap: 8px; font-size: 12.5px; }
.ai8-sug input { accent-color: var(--accent); margin: 0; }
.ai8-sug em { margin-left: auto; font-style: normal; font: 600 11px 'Geist Mono', ui-monospace, Consolas, monospace; color: #8f8f88; }
.ai8-sug button { justify-self: start; margin-top: 4px; padding: 5px 11px; border: 0; border-radius: 999px; background: var(--accent); color: #fff; font: 700 12px Inter, sans-serif; }
.ai8-dots { display: inline-flex; gap: 4px; } .ai8-dots i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .5; animation: dot8 1s infinite; } .ai8-dots i:nth-child(2) { animation-delay: .15s; } .ai8-dots i:nth-child(3) { animation-delay: .3s; }
@keyframes dot8 { 50% { opacity: 1; transform: translateY(-2px); } }
.ai8-input { display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-radius: 12px; border: 1px solid #ffffff17; background: #00000033; color: #8f8f88; font-size: 13.5px; }
body:not(.dark) .ai8-input { background: #fff; border-color: #0000001a; }
.ai8-input span { flex: 1; } .ai8-input span.on { color: inherit; } .ai8-card .ai8-input span.on { color: #f2f2ef; } body:not(.dark) .ai8-card .ai8-input span.on { color: #0d0d0c; }
.ai8-input i { font-style: normal; }
@media (max-width: 900px) { .ai8 { grid-template-columns: 1fr; gap: 28px; } .ai8-card { height: 430px; } }

/* 14b: cartão da IA igual à referência 1 ("twocy AI"): borda laranja fina, névoa vermelha à direita, título simples */
.ai8-card { height: 500px; padding: 26px 26px 18px; border: 1px solid color-mix(in srgb, var(--accent) 60%, transparent); background: radial-gradient(70% 80% at 88% 62%, #6b1d16b0, transparent 72%), radial-gradient(60% 50% at 10% 0%, #2a1512, transparent 70%), linear-gradient(165deg, #181314, #110e0f 60%, #0f0c0d); box-shadow: 0 0 0 1px #ff5a2c14, 0 0 38px -8px color-mix(in srgb, var(--accent) 55%, transparent), inset 0 1px 0 #ffffff12; }
body:not(.dark) .ai8-card { border-color: color-mix(in srgb, var(--accent) 45%, transparent); background: radial-gradient(70% 80% at 88% 62%, #ffcdbd, transparent 72%), linear-gradient(165deg, #fffaf8, #fff4ef); box-shadow: 0 0 34px -10px #ff5a2c80, inset 0 1px 0 #fff; }
.ai8-card header { display: block; padding-bottom: 16px; }
.ai8-card header b { display: block; font-size: 24px; font-weight: 600; letter-spacing: -.01em; }
.ai8-card header p { margin: 8px 0 0; color: #b9b3b0; font-size: 14px; line-height: 1.5; } body:not(.dark) .ai8-card header p { color: #6e6e66; }
.ai8-input { border-color: #ffffff14; background: #ffffff0d; }
.ai8-card .ai8-foot { display: flex; align-items: center; gap: 8px; margin-top: 16px; padding-top: 14px; border-top: 1px solid #ffffff12; font-size: 13.5px; font-weight: 600; }
body:not(.dark) .ai8-card .ai8-foot { border-top-color: #0000000f; }
.ai8-card .ai8-foot i { font-style: normal; }

/* ═════ Rodada 15: preços minimal (referência 1, cartão "twocy Pro") — luz suave no canto, sem faixas ═════ */
#pxa-price { display: none; }
.plans7 { gap: 18px; max-width: 860px; }
.pl7, .pl7.is-pro { padding: 28px 28px 26px; border-radius: 18px; border: 1px solid #ffffff12; background: #0f0f10; box-shadow: none; overflow: hidden; }
.pl7.is-pro::before { background: radial-gradient(90% 60% at 0% 0%, #c0392b66, transparent 60%), linear-gradient(135deg, #d6452f55 0%, #8c231b33 22%, transparent 42%); }
.pl7.is-pro::after { display: none; }
.pl7 > * { position: relative; z-index: 1; }
.pl7-top h3 { font-size: 22px; font-weight: 600; letter-spacing: -.01em; }
.pl7-tag { padding: 3px 9px; background: #ffffff14; color: #f4f4f2 !important; font-weight: 600; font-size: 11.5px !important; }
.pl7-price { margin-top: 14px; font-size: 40px; font-weight: 700; }
.pl7-save { color: #9b9ba3; font-weight: 500; }
.pl7 .btn { margin: 18px 0 0; min-height: 46px; border-radius: 12px; }
.pl7 .btn + .btn { margin-top: 10px; }
.pl7.is-pro #pro-cta { border: 0; background: linear-gradient(180deg, #f8f6f3, #d8d4cf); color: #111; box-shadow: inset 0 1px 0 #fff, 0 8px 24px -12px #000; }
.pl7 .btn-ghost { border: 1px solid #ffffff1f; background: transparent; color: #f2f2ef; }
.pl7 > ul { margin-top: 22px; padding-top: 20px; border-top: 1px solid #ffffff10; gap: 11px; }
.pl7-all { margin: 22px 0 -10px; color: #9b9ba3; font-weight: 600; }
.pl7 li { font-size: 14px; color: #e8e8e4; }
.pl7 li svg { width: 15px; height: 15px; padding: 0; margin-top: 2px; background: none; color: #8f8f88; }
.pl7.is-pro li svg { color: var(--accent); }
.pl7 li small { color: #8f8f88; }
body:not(.dark) .pl7, body:not(.dark) .pl7.is-pro { border-color: var(--border); background: var(--white); }
body:not(.dark) .pl7.is-pro::before { background: radial-gradient(90% 60% at 0% 0%, #ffcfc2, transparent 62%), linear-gradient(135deg, #ffb8a455 0%, transparent 40%); }
body:not(.dark) .pl7-tag { background: #0000000d; color: #0d0d0c !important; }
body:not(.dark) .pl7.is-pro #pro-cta { background: #0d0d0c; color: #fff; box-shadow: none; }
body:not(.dark) .pl7 .btn-ghost { border-color: #0000001f; color: #0d0d0c; }
body:not(.dark) .pl7 > ul { border-top-color: #0000000f; } body:not(.dark) .pl7 li { color: var(--ink); } body:not(.dark) .pl7 li small, body:not(.dark) .pl7-save, body:not(.dark) .pl7-all { color: var(--muted); }
/* twocy AI: brilho mais leve */
.ai8-card { background: radial-gradient(70% 80% at 88% 62%, #6b1d1666, transparent 72%), linear-gradient(165deg, #161314, #100e0f 60%, #0f0d0e); box-shadow: 0 0 22px -12px color-mix(in srgb, var(--accent) 45%, transparent), inset 0 1px 0 #ffffff10; border-color: color-mix(in srgb, var(--accent) 45%, transparent); }
body:not(.dark) .ai8-card { background: radial-gradient(70% 80% at 88% 62%, #ffd9cc99, transparent 72%), linear-gradient(165deg, #fffaf8, #fff6f2); box-shadow: 0 0 20px -12px #ff5a2c66, inset 0 1px 0 #fff; }

/* 15b: pixels do hero no canto do Pro (no lugar da luz lisa) */
.pl7.is-pro::before { display: none; }
.pl7 > canvas#pxa-pro { position: absolute; z-index: 0; left: 0; top: 0; width: 75%; height: 300px; opacity: .85; -webkit-mask: radial-gradient(95% 85% at 0% 0%, #000 25%, transparent 75%); mask: radial-gradient(95% 85% at 0% 0%, #000 25%, transparent 75%); }
body:not(.dark) .pl7 > canvas#pxa-pro { opacity: .7; }
.pl7 > canvas#pxa-pro { left: -30%; top: -170px; width: 100%; height: 440px; opacity: .9; -webkit-mask: linear-gradient(135deg, #000 35%, transparent 62%); mask: linear-gradient(135deg, #000 35%, transparent 62%); }
/* 15c: brilho laranja da marca atrás do Pro */
.pl7.is-pro { box-shadow: 0 30px 90px -34px color-mix(in srgb, var(--accent) 70%, transparent), 0 0 60px -30px color-mix(in srgb, var(--accent) 50%, transparent); background: radial-gradient(90% 60% at 60% 110%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 70%), #0f0f10; }
body:not(.dark) .pl7.is-pro { box-shadow: 0 30px 80px -36px #ff5a2c99; background: radial-gradient(90% 60% at 60% 110%, #ffe1d6, transparent 70%), #fff; }

/* 15d: preço antigo riscado (era R$ 29,90) */
.pl7-was { display: block; margin-bottom: 6px; color: #8f8f88; font: 500 16px var(--font); letter-spacing: 0; text-decoration: line-through; text-decoration-color: #8f8f88; }
body:not(.dark) .pl7-was { color: #96968e; }

/* 15e: % de desconto ao lado do preço antigo (teste) */
.pl7-wasrow { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.pl7-wasrow .pl7-was { display: inline; margin: 0; }
.pl7-off { padding: 2px 8px; border-radius: 999px; background: color-mix(in srgb, var(--accent) 22%, transparent); color: #ff8a62; font: 700 12px var(--font); font-style: normal; letter-spacing: 0; }
body:not(.dark) .pl7-off { background: #fff1ec; color: #d9431a; }

/* ═════ Rodada 16: filme (botão no hero + miniatura na seção do YouTube + janela) ═════ */
.hero7-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 40px; }
.hero7-links .hero7-more { margin-top: 0; }
.hero7-film { cursor: pointer; font: inherit; font-size: 13.5px; font-weight: 600; }
.hero7-film i { display: inline-grid; place-items: center; width: 20px; height: 20px; margin-right: 2px; border-radius: 50%; background: var(--accent); color: #fff; font-size: 9px; font-style: normal; }
.thumb-film { padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.thumb-film .tv { background-size: cover !important; background-position: center !important; }
.thumb-film:hover .tv i { transform: scale(1.1); background: var(--accent); }
.film7 { width: min(1100px, 94vw); padding: 0; border: 0; border-radius: 18px; background: #000; overflow: visible; box-shadow: 0 40px 120px #000c; }
.film7::backdrop { background: #000c; backdrop-filter: blur(6px); }
.film7 video { display: block; width: 100%; aspect-ratio: 16 / 9; border-radius: 18px; background: #000; }
.film7-x { position: absolute; right: -6px; top: -46px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: #ffffff1f; color: #fff; font-size: 15px; cursor: pointer; }
.hero7-film span { animation: none !important; }

/* rodada 17 · inglês: botões do topo não quebram linha */
.nav-right .nav-ghost, .nav-right a { white-space: nowrap; }

/* rodada 18 · tipografia como a da Raycast: Inter em tudo (títulos 600, sem o 800
   pesado), Geist Mono nos rótulos/teclas/botões mono, JetBrains Mono no código.
   O logo "twocy" continua em Bricolage (é a marca). */
body :is(h1, h2, h3) { font-family: var(--font) !important; font-weight: 600 !important; letter-spacing: -.025em; }

/* rodada 19 · títulos das seções como os da Raycast: menores (24px, peso 500),
   segunda frase em cinza no mesmo tamanho, parágrafo logo abaixo. A chamada
   final (.h2-cta) fica em 32px, como o destaque deles. */
main h2:not(.h2-cta), section h2:not(.h2-cta) { font-size: 24px !important; line-height: 1.3 !important; font-weight: 500 !important; letter-spacing: -.01em !important; }
h2.h2-cta { font-size: 36px !important; line-height: 1.15 !important; font-weight: 500 !important; }
.h2-sub { color: #9a9a92; -webkit-text-fill-color: #9a9a92; background: none; }
body.dark .h2-sub { color: #6a6b6c; -webkit-text-fill-color: #6a6b6c; }
section h2 + p, main h2 + p { margin-top: 10px; font-size: 16px; }
@media (max-width: 640px) {
  main h2:not(.h2-cta), section h2:not(.h2-cta) { font-size: 21px !important; }
  h2.h2-cta { font-size: 28px !important; }
}

/* rodada 20 · rótulos acima dos títulos: só o texto em laranja, sem a pílula */
.eb7 { padding: 0 !important; border: 0 !important; background: none !important; border-radius: 0 !important; margin-bottom: 10px; }

/* rodada 21 · "Feita pra sua rotina" em cards (como os de extensões da Raycast).
   Fundo: imagem do card (--img, quando existir) + brilho na cor do perfil (--c).
   Clicar abre a janela #who8 com a cena daquele uso. */
.cards8 { position: relative; margin-top: 34px; }
.cards8-row { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 6px max(16px, calc((100% - 1080px) / 2)) 18px; margin: 0 -16px; }
.cards8-row::-webkit-scrollbar { display: none; }
.card8 { position: relative; flex: 0 0 300px; height: 430px; scroll-snap-align: center; display: flex; flex-direction: column; gap: 14px; padding: 22px; border-radius: 20px; border: 1px solid rgba(255,255,255,.1); overflow: hidden; text-align: left; color: #f2f1eb; cursor: pointer; font: inherit;
  background: var(--img, none) center bottom / cover no-repeat, radial-gradient(120% 70% at 50% 110%, color-mix(in srgb, var(--c) 55%, transparent), transparent 65%), linear-gradient(180deg, color-mix(in srgb, var(--c) 16%, #0b0b0d), #0a0a0b 55%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06); transition: transform .35s cubic-bezier(.2,.8,.2,1), border-color .25s; }
.card8:hover, .card8:focus-visible { transform: translateY(-4px); border-color: color-mix(in srgb, var(--c) 55%, rgba(255,255,255,.15)); outline: none; }
.card8-top { display: flex; align-items: center; gap: 12px; }
.card8-top i { flex: 0 0 38px; height: 38px; border-radius: 10px !important; border: 1px solid rgba(255,255,255,.14); background-color: rgba(255,255,255,.06); background-size: 22px !important; }
.card8-top i.bi { background: var(--bi) center / 22px no-repeat, rgba(255,255,255,.06) !important; border-radius: 10px !important; }
.card8-dot { background: radial-gradient(circle, var(--c) 0 5px, transparent 6px) !important; }
.card8-top b { flex: 1; font-size: 16px; font-weight: 500; }
.card8-top em { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; border: 1px solid rgba(255,255,255,.16); font-style: normal; font-size: 18px; color: #d8d8d0; transition: background .2s; }
.card8:hover .card8-top em { background: rgba(255,255,255,.1); }
.card8-p { font-size: 15.5px; font-weight: 600; line-height: 1.45; padding-bottom: 14px; border-bottom: 1px solid rgba(255,255,255,.08); }
.card8-see { margin-top: auto; font: 500 12px 'Geist Mono', ui-monospace, monospace; color: rgba(255,255,255,.62); letter-spacing: .02em; }
.cards8-nav { position: absolute; top: 50%; z-index: 2; width: 40px; height: 40px; margin-top: -26px; border-radius: 50%; border: 1px solid var(--border2); background: color-mix(in srgb, var(--white) 85%, transparent); backdrop-filter: blur(8px); color: var(--ink); font-size: 22px; line-height: 1; cursor: pointer; }
.cards8-nav.prev { left: 0; } .cards8-nav.next { right: 0; }
@media (max-width: 700px) { .cards8-nav { display: none; } .card8 { flex-basis: 78vw; height: 400px; } }
/* janela da cena */
.who8 { width: min(1180px, calc(100vw - 32px)); max-height: calc(100vh - 40px); padding: 18px; border-radius: 24px; border: 1px solid color-mix(in srgb, var(--c, #ff5a2c) 35%, var(--border2)); background: var(--page); color: var(--ink); overflow: auto; }
.who8::backdrop { background: rgba(0,0,0,.6); backdrop-filter: blur(6px); }
.who8 .who7 { margin-top: 0; }
.who8 .who7-chips { display: none; }
.who8 .who7-panel { margin-top: 0; }
.who8-x { position: absolute; top: 14px; right: 14px; z-index: 5; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--border2); background: var(--white); color: var(--ink); cursor: pointer; }
.who8 { position: fixed; inset: 0; margin: auto; height: fit-content; overflow-x: hidden; }
.who8 .who7-wrap { margin: 0; }
.who8 { scrollbar-width: none; } .who8::-webkit-scrollbar { display: none; }
.who8 .who7-panel > *, .who8 .who7-side, .who8 .who7-cards > * { min-width: 0; }
.who8 .who7-cards a, .who8 .who7-cards span { overflow-wrap: anywhere; }
@media (max-width: 700px) { .who8 { padding: 10px; } .who8 .who7-panel { padding: 14px; } .who8 .who7-stage { height: 280px; } }

/* rodada 22 · cards com a linguagem das miniaturas dos vídeos: arte de pixels
   (canvas.pxa, mesmo motor dos avatares/hero) no card inteiro, símbolo grande
   do atalho no meio, selo "twocy / perfil" e ▶ que abre a demonstração. */
.card8 { background: #08080a !important; }
.card8 > span, .card8 > small { position: relative; z-index: 1; }
.card8 > canvas.card8-art { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; opacity: .95; filter: none !important; mix-blend-mode: normal !important; }
.card8::before { content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(180deg, rgba(6,6,8,.92) 0%, rgba(6,6,8,.72) 30%, rgba(6,6,8,.25) 60%, rgba(6,6,8,.55) 100%); }
.card8-p { border-bottom-color: rgba(255,255,255,.1); }
.card8-glyph { margin: auto 0; align-self: center; font: 600 64px/1 Inter, sans-serif; letter-spacing: -.02em; color: rgba(255,255,255,.88); text-shadow: 0 6px 30px rgba(0,0,0,.45); transition: transform .4s cubic-bezier(.2,.8,.2,1); }
.card8:hover .card8-glyph { transform: scale(1.06); }
.card8-tag { position: absolute !important; left: 22px; bottom: 22px; font: 500 11px 'Geist Mono', ui-monospace, monospace; color: rgba(255,255,255,.62); }
.card8-see { margin-top: 0; align-self: flex-end; display: inline-flex; align-items: center; gap: 8px; color: rgba(255,255,255,.75); }
.card8-see i { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: rgba(10,10,12,.85); color: #fff; font-style: normal; font-size: 11px; transition: background .2s, transform .2s; }
.card8:hover .card8-see i { background: var(--accent); transform: scale(1.1); }
/* ajuste: véu escuro como o das miniaturas (#0006) e selo no topo da arte */
.card8 > canvas.card8-art { opacity: .8; }
.card8::before { background: linear-gradient(180deg, rgba(6,6,8,.94) 0%, rgba(6,6,8,.8) 32%, rgba(6,6,8,.45) 58%, rgba(6,6,8,.6) 100%); }
.card8-tag { position: relative !important; left: auto; bottom: auto; order: 3; }
.card8-glyph { order: 4; font-size: 58px; }
.card8-see { order: 5; }
.card8[data-who="2"] .card8-glyph { color: #ff5a2c; font-size: 46px; text-shadow: 0 0 24px rgba(255,90,44,.6); }
.card8::before { content: none; }
.card8::after { content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(180deg, rgba(6,6,8,.94) 0%, rgba(6,6,8,.82) 30%, rgba(6,6,8,.4) 58%, rgba(6,6,8,.62) 100%); }
.card8::after { background: linear-gradient(180deg, rgba(6,6,8,.95) 0%, rgba(6,6,8,.85) 26%, rgba(6,6,8,.18) 52%, rgba(6,6,8,.12) 78%, rgba(6,6,8,.5) 100%); }
.card8 > canvas.card8-art { opacity: .92; }
.card8-top i.card8-dot { background: radial-gradient(circle at center, var(--c) 0 5px, transparent 6px) center / 100% 100% no-repeat, rgba(255,255,255,.06) !important; }
.cards8-row { scroll-snap-type: none; }

/* ═════ 01/10: AI AGENT com Ctrl+Shift+A — cena 1 (texto selecionado → tradução), cena 2 (conversa) ═════ */
.ai8-txt kbd, .ai8-keys kbd { display: inline-block; padding: 1px 7px; border-radius: 6px; border: 1px solid #ffffff24; border-bottom-width: 2px; font: 600 .82em 'Geist Mono', ui-monospace, Consolas, monospace; }
body:not(.dark) .ai8-txt kbd { border-color: #00000024; }
.ai8-k { white-space: nowrap; }
.ai8-tabs { display: inline-flex; gap: 4px; padding: 3px; border-radius: 999px; background: #ffffff0d; border: 1px solid #ffffff12; }
body:not(.dark) .ai8-tabs { background: #0000000a; border-color: #0000000d; }
.ai8-tabs span { padding: 5px 12px; border-radius: 999px; font: 600 12.5px 'Geist Mono', ui-monospace, Consolas, monospace; color: #8f8f88; transition: background .3s, color .3s; }
.ai8-tabs span.on { background: #ffffff1a; color: inherit; } body:not(.dark) .ai8-tabs span.on { background: #fff; box-shadow: 0 1px 3px #0000001a; }
.ai8-sel { display: none; flex: 1; flex-direction: column; justify-content: center; gap: 14px; padding: 14px 0; }
.ai8-card.is-sel .ai8-sel { display: flex; } .ai8-card.is-sel .ai8-chat, .ai8-card.is-sel .ai8-input { display: none; }
.ai8-page { padding: 16px 18px; border-radius: 12px; background: #ffffff0a; border: 1px solid #ffffff10; }
body:not(.dark) .ai8-page { background: #fff; border-color: #0000000f; }
.ai8-page small { display: block; margin-bottom: 8px; font: 11px 'Geist Mono', ui-monospace, Consolas, monospace; color: #8f8f88; }
.ai8-page p { margin: 0; font: 500 17px/1.55 Georgia, 'Times New Roman', serif; }
.ai8-page mark { background: #3b82f659; color: inherit; border-radius: 2px; }
.ai8-keys { display: flex; gap: 6px; justify-content: center; opacity: 0; transform: translateY(6px) scale(.96); transition: opacity .3s, transform .3s; }
.ai8-card.k-on .ai8-keys { opacity: 1; transform: none; }
.ai8-keys kbd { padding: 6px 12px; font-size: 13px; background: #ffffff10; }
body:not(.dark) .ai8-keys kbd { background: #fff; border-color: #00000024; }
.ai8-pop { padding: 14px 16px; border-radius: 14px; background: #161415f2; border: 1px solid #ffffff1a; box-shadow: 0 18px 40px #00000059; opacity: 0; transform: translateY(10px); transition: opacity .35s, transform .35s; }
body:not(.dark) .ai8-pop { background: #fff; border-color: #00000014; box-shadow: 0 18px 40px #0000001f; }
.ai8-card.p-on .ai8-pop { opacity: 1; transform: none; }
.ai8-acts { display: flex; gap: 6px; margin-bottom: 10px; }
.ai8-acts span { padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; color: #8f8f88; border: 1px solid #ffffff14; }
body:not(.dark) .ai8-acts span { border-color: #00000014; }
.ai8-acts span.on { background: var(--accent); border-color: transparent; color: #fff; }
.ai8-pop p { margin: 0; min-height: 3em; font-size: 14.5px; line-height: 1.55; }

.ai8-list li { border-left-color: #ffffff1f; } body:not(.dark) .ai8-list li { border-left-color: #0000001a; }
.ai8-tabs button { padding: 5px 12px; border: 0; border-radius: 999px; background: none; cursor: pointer; font: 600 12.5px 'Geist Mono', ui-monospace, Consolas, monospace; color: #8f8f88; transition: background .3s, color .3s; }
.ai8-tabs button:hover { color: inherit; }
.ai8-tabs button.on { background: #ffffff1a; color: inherit; } body:not(.dark) .ai8-tabs button.on { background: #fff; box-shadow: 0 1px 3px #0000001a; }
.ai8-mic { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; opacity: .8; }
/* aba ativa mostra o tempo até trocar sozinha */
.ai8-tabs button { position: relative; overflow: hidden; }
.ai8-tabs button.on::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: 2px; height: 2px; border-radius: 2px; background: currentColor; opacity: .35; transform-origin: left; animation: ai8-prog var(--ai8-dur, 8s) linear both; }
@keyframes ai8-prog { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.ai8-tabs button.on { background: #ffffff26; color: #f2f2ef; }
body:not(.dark) .ai8-tabs button.on { color: #0d0d0c; }
.ai8-tabs button.on::after { opacity: .5; }
@media (prefers-reduced-motion: reduce) { .ai8-tabs button.on::after { display: none; } }

/* TwocyAI na lista do Pro: só o nome com um degradê laranja (01/10) */
.ai-grad { font-weight: inherit; background: linear-gradient(90deg, #ff4f2e, #ff9a3c); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cmp7-note { margin: 12px 4px 0; color: #9b9ba3; font-size: 12px; }

/* ══════ 02/10: TwocyAI — cena "Em massa" + chips do que ela faz ══════ */
.ai8-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 22px; }
.ai8-chips span { padding: 5px 11px; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent); background: color-mix(in srgb, var(--accent) 8%, transparent); font-size: 12.5px; font-weight: 600; }
.ai8-bulk { display: none; flex: 1; flex-direction: column; justify-content: center; gap: 12px; padding: 14px 0; }
.ai8-card.is-bulk .ai8-bulk { display: flex; } .ai8-card.is-bulk .ai8-chat, .ai8-card.is-bulk .ai8-input { display: none; }
.ai8-blist { display: grid; gap: 7px; }
.ai8-brow { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px 12px; border-radius: 12px; border: 1px solid #ffffff12; background: #ffffff08; font-size: 13.5px; transition: border-color .3s, background .3s; }
body:not(.dark) .ai8-brow { border-color: #0000000f; background: #fff; }
.ai8-bck { display: grid; place-items: center; width: 16px; height: 16px; flex: none; border-radius: 5px; background: var(--accent); color: #fff; font-size: 10px; font-style: normal; }
.ai8-brow em { flex: none; width: 52px; font: 600 10.5px 'Geist Mono', ui-monospace, Consolas, monospace; font-style: normal; color: #8f8f88; text-transform: uppercase; }
.ai8-brow b { display: flex; flex-direction: column; min-width: 0; font-weight: 600; }
.ai8-brow b s { color: #8f8f88; font-weight: 400; font-size: 12px; }
.ai8-brow b span { animation: sp7-in .4s cubic-bezier(.2, .8, .2, 1) both; }
.ai8-brow.rev { border-color: color-mix(in srgb, var(--accent) 45%, transparent); background: color-mix(in srgb, var(--accent) 7%, transparent); }
.ai8-brow.done { border-color: #10b98155; }
.ai8-bbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 34px; font-size: 13px; color: #b9b3b0; }
body:not(.dark) .ai8-bbar { color: #6e6e66; }
.ai8-bbar button { padding: 7px 14px; border: 0; border-radius: 999px; background: var(--accent); color: #fff; font: 700 12.5px Inter, sans-serif; transition: transform .15s; }
.ai8-bbar button.press { transform: scale(.94); }
.ai8-ok { color: #10b981; }

/* ══════ 02/10: agenda (sem header/nav/footer: a landing estiliza essas tags) — Ctrl+Espaço entende data, hora e #categoria ══════ */
.ag7 { display: grid; grid-template-columns: 1.15fr 1fr; gap: 48px; align-items: center; }
.ag7-txt h2 { font-size: clamp(28px, 3.4vw, 42px); line-height: 1.1; letter-spacing: -.025em; }
.ag7-txt p { margin-top: 16px; color: var(--muted); font-size: 17px; line-height: 1.55; max-width: 440px; }
.ag7-txt .ticks7 kbd { margin-right: 2px; }
.ag7-demo { position: relative; display: grid; gap: 14px; padding: 22px; border-radius: 22px; border: 1px solid #ffffff12; background: radial-gradient(70% 80% at 20% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 70%), #0f0e0e; color: #f2f2ef; }
body:not(.dark) .ag7-demo { border-color: #0000000d; background: radial-gradient(70% 80% at 20% 0%, #ffe6dc, transparent 70%), #fff; color: #0d0d0c; box-shadow: 0 18px 40px -24px #0000004d; }
.ag7-hud { border-radius: 16px; border: 1px solid #ffffff1a; background: #171516; box-shadow: 0 18px 40px #00000066; overflow: hidden; }
body:not(.dark) .ag7-hud { background: #fff; border-color: #00000014; box-shadow: 0 14px 32px #0000001f; }
.ag7-hud .ag7-head { display: flex; align-items: center; gap: 8px; padding: 10px 14px; font-size: 12.5px; border-bottom: 1px solid #ffffff10; }
body:not(.dark) .ag7-hud .ag7-head { border-bottom-color: #0000000d; }
.ag7-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }
.ag7-hud .ag7-head span { color: #8f8f88; }
.ag7-hud .ag7-head kbd { margin-left: auto; padding: 1px 7px; border: 1px solid #ffffff24; border-radius: 6px; font: 600 11px 'Geist Mono', ui-monospace, Consolas, monospace; color: #8f8f88; }
.ag7-hud .ag7-tabs { display: flex; gap: 4px; padding: 8px 12px 0; font-size: 12px; }
.ag7-hud .ag7-tabs span { padding: 5px 10px; border-radius: 8px; color: #8f8f88; }
.ag7-hud .ag7-tabs span.on { background: #ffffff12; color: inherit; font-weight: 600; } body:not(.dark) .ag7-hud .ag7-tabs span.on { background: #0000000a; }
.ag7-field { margin: 10px 12px; min-height: 52px; padding: 12px 14px; border-radius: 12px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); background: #00000033; font-size: 16px; line-height: 1.5; }
body:not(.dark) .ag7-field { background: #fafaf8; }
.ag7-field mark { padding: 1px 4px; border-radius: 6px; color: inherit; animation: ag7-pop .35s cubic-bezier(.2, .8, .2, 1); }
.ag7-field mark.ag7-d { background: #3b82f640; } .ag7-field mark.ag7-h { background: #8b5cf640; } .ag7-field mark.ag7-c { background: color-mix(in srgb, var(--accent) 35%, transparent); }
@keyframes ag7-pop { from { transform: scale(.85); opacity: .4; } to { transform: none; opacity: 1; } }
.ag7-caret { display: inline-block; width: 2px; height: 18px; margin-left: 1px; vertical-align: -3px; background: currentColor; animation: caret6 1s steps(1) infinite; }
.ag7-hud .ag7-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 14px 12px; font-size: 12.5px; color: #8f8f88; }
.ag7-hud .ag7-foot small { font-size: 12.5px; }
.ag7-hud .ag7-foot em { padding: 5px 12px; border-radius: 999px; background: var(--accent); color: #fff; font: 700 12px Inter, sans-serif; font-style: normal; transition: transform .15s; }
.ag7-hud .ag7-foot em.press { transform: scale(.92); }
.ag7-cal { border-radius: 16px; border: 1px solid #ffffff12; background: #ffffff06; padding: 12px; }
body:not(.dark) .ag7-cal { border-color: #0000000d; background: #fafaf8; }
.ag7-cal .ag7-calhead { display: flex; align-items: baseline; gap: 8px; margin-bottom: 10px; font-size: 14px; } .ag7-cal .ag7-calhead small { color: #8f8f88; font-size: 12px; }
.ag7-days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.ag7-day { min-height: 118px; padding: 6px; border-radius: 10px; background: #ffffff08; display: flex; flex-direction: column; gap: 3px; }
body:not(.dark) .ag7-day { background: #fff; border: 1px solid #0000000a; }
.ag7-day small { color: #8f8f88; font-size: 10.5px; text-transform: uppercase; letter-spacing: .04em; } .ag7-day b { font-size: 14px; }
.ag7-day.today b { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--accent); color: #fff; font-size: 12.5px; }
.ag7-evs { display: grid; gap: 4px; margin-top: 4px; }
.ag7-ev { display: block; padding: 4px 6px; border-radius: 6px; border-left: 3px solid var(--c); background: color-mix(in srgb, var(--c) 18%, transparent); font-size: 10.5px; line-height: 1.3; overflow: hidden; }
.ag7-ev em { display: block; font: 600 9.5px 'Geist Mono', ui-monospace, Consolas, monospace; font-style: normal; opacity: .75; }
.ag7-ev i { font-style: normal; opacity: .7; margin-left: 3px; }
.ag7-ev.fresh { animation: ag7-in .6s cubic-bezier(.2, .8, .2, 1) both; box-shadow: 0 0 0 2px color-mix(in srgb, var(--c) 55%, transparent); }
@keyframes ag7-in { from { transform: translateY(-14px) scale(.9); opacity: 0; } to { transform: none; opacity: 1; } }
.ag7-cap { min-height: 20px; margin: 0; text-align: center; font-size: 13.5px; color: #b9b3b0; } body:not(.dark) .ag7-cap { color: #6e6e66; }
@media (max-width: 900px) { .ag7 { grid-template-columns: 1fr; gap: 28px; } .ag7-txt { order: -1; } .ag7-day { min-height: 96px; } .ag7-ev { font-size: 9.5px; } }
@media (max-width: 560px) { .ag7-demo { padding: 14px; } .ag7-days { gap: 3px; } .ag7-day { padding: 4px; } .ag7-ev span { display: none; } }

/* ══════ 02/10: teclado final — TwocyAI (Ctrl+Shift+A) ══════ */
.kb7-ai { position: absolute; left: 50%; top: 50%; translate: -50% -40%; width: min(420px, 90%); padding: 14px 16px; border-radius: 14px; background: #161415f2; border: 1px solid #ffffff1a; box-shadow: 0 18px 40px #00000059; color: #f2f2ef; animation: sp7-in .35s cubic-bezier(.2, .8, .2, 1) both; }
body:not(.dark) .kb7-ai { background: #fff; border-color: #00000014; color: #0d0d0c; box-shadow: 0 18px 40px #0000001f; }
.kb7-ai-acts { display: flex; gap: 6px; margin-bottom: 10px; }
.kb7-ai-acts span { padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; color: #8f8f88; border: 1px solid #ffffff14; }
.kb7-ai-acts span.on { background: var(--accent); border-color: transparent; color: #fff; }
.kb7-ai p { margin: 0; min-height: 2.6em; font-size: 15px; line-height: 1.55; }

/* ══════ 02/10: demonstração do ditado num editor de código com agente (em vez do WhatsApp) ══════ */
#w6-code { left: 0; top: 0; width: 1200px; height: 654px; border: 0; border-radius: 0; box-shadow: none; z-index: 4; opacity: 0; pointer-events: none; background: #181818; }
#w6-code.front { z-index: 12; opacity: 1; pointer-events: auto; }
#w6-code .w6-bar { background: #141414; }
.cu6-ic { display: grid; place-items: center; width: 16px !important; height: 16px !important; border-radius: 4px; background: #2a2a2a !important; color: #ddd; font: 700 10px Inter, sans-serif; font-style: normal; }
.cu6 { flex: 1; min-height: 0; display: grid; grid-template-columns: 220px 1fr 380px; color: #d4d4d4; font-size: 13px; }
.cu6-tree { padding: 12px 0; background: #1b1b1b; border-right: 1px solid #ffffff10; }
.cu6-tree b { display: block; padding: 0 16px 8px; font-size: 11px; letter-spacing: .06em; color: #9a9a9a; }
.cu6-tree p { margin: 0; padding: 4px 16px 4px 28px; color: #bdbdbd; } .cu6-tree p:nth-child(2) { padding-left: 16px; } .cu6-tree p:nth-child(3) { padding-left: 22px; }
.cu6-tree p.on { background: #ffffff10; color: #fff; }
.cu6-ed { min-width: 0; display: flex; flex-direction: column; background: #181818; }
.cu6-tabs { display: flex; height: 34px; background: #141414; border-bottom: 1px solid #ffffff10; }
.cu6-tabs span { padding: 0 16px; line-height: 34px; color: #8a8a8a; border-right: 1px solid #ffffff0d; } .cu6-tabs span.on { background: #181818; color: #fff; }
.cu6-ed pre { margin: 0; padding: 14px 0; font: 13px/1.75 'JetBrains Mono', Consolas, monospace; color: #d4d4d4; white-space: pre; }
.cu6-ed pre em { display: inline-block; width: 44px; padding-right: 14px; text-align: right; color: #5a5a5a; font-style: normal; }
.cu6-ed pre i { font-style: normal; } .cu6-ed .k { color: #c586c0; } .cu6-ed .s { color: #ce9178; } .cu6-ed .f { color: #dcdcaa; }
.cu6-agent { display: flex; flex-direction: column; min-height: 0; background: #1d1d1d; border-left: 1px solid #ffffff10; }
.cu6-head { display: flex; align-items: baseline; gap: 8px; padding: 12px 16px; border-bottom: 1px solid #ffffff10; } .cu6-head b { color: #fff; } .cu6-head small { color: #8a8a8a; font-size: 11.5px; }
.cu6-msgs { flex: 1; display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; padding: 14px 16px; overflow: hidden; }
.cu6-msg { max-width: 92%; padding: 9px 12px; border-radius: 10px; line-height: 1.5; }
.cu6-msg.ai { align-self: flex-start; background: #262626; } .cu6-msg.me { align-self: flex-end; background: #2f3f5c; color: #fff; animation: sp7-in .4s cubic-bezier(.2, .8, .2, 1) both; }
.cu6-input { display: flex; align-items: flex-end; gap: 8px; margin: 0 12px 12px; padding: 10px 10px 10px 12px; border-radius: 12px; border: 1px solid #ffffff1a; background: #232323; }
.cu6-field { flex: 1; min-height: 44px; color: #eee; line-height: 1.5; } .cu6-field .ph { color: #7a7a7a; }
.cu6-field.focus { } .cu6-input:has(.cu6-field.focus) { border-color: #5b8cff88; box-shadow: 0 0 0 2px #5b8cff33; }
.cu6-field .caret { display: inline-block; width: 1.5px; height: 16px; background: #5b8cff; animation: caret6 1s steps(1) infinite; vertical-align: -3px; }
.cu6-send { display: grid; place-items: center; width: 28px; height: 28px; flex: none; border-radius: 8px; background: #3a3a3a; color: #fff; font-weight: 700; }

/* ══════ 02/10: carrossel "Feita pra sua rotina" — bordas somem num degradê ══════ */
.cards8-row { -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%); }
@media (max-width: 700px) { .cards8-row { -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 4%, #000 96%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 4%, #000 96%, transparent 100%); } }

/* ══════ 02/10: perfil Atendimento — e-mail + ditado de mãos livres ══════ */
.sc-mail { display: flex; flex-direction: column; gap: 14px; height: 100%; padding: 18px 22px; background: #fff; color: #202124; font-size: 13.5px; }
.sc-mail-msg { display: flex; gap: 12px; }
.sc-mail-msg > i { flex: none; width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(135deg, #f59e0b, #ec4899); }
.sc-mail-msg b { display: block; } .sc-mail-msg small { display: block; color: #5f6368; font-size: 12px; margin-bottom: 6px; }
.sc-mail-msg p { margin: 0; line-height: 1.5; }
.sc-reply { flex: 1; padding: 12px 14px; border: 1px solid #dadce0; border-radius: 10px; }
.sc-reply small { display: block; margin-bottom: 8px; color: #5f6368; font-size: 12px; }
.sc-reply p { margin: 0; min-height: 60px; line-height: 1.55; }
.sc-reply p.typing { box-shadow: inset 0 0 0 2px #1a73e855; border-radius: 6px; padding: 4px 6px; }
.sc-reply .caret { display: inline-block; width: 1.5px; height: 16px; background: #1a73e8; vertical-align: -3px; animation: caret6 1s steps(1) infinite; }
.who7-voice { position: absolute; left: 50%; bottom: 22px; z-index: 34; width: 410px; translate: -50% 0; scale: .86; transform-origin: 50% 100%; }
.ag7-hud .ag7-foot em { white-space: nowrap; }
@media (max-width: 560px) { .ag7-ev { height: 10px; padding: 0; } .ag7-ev em, .ag7-ev span, .ag7-ev i { display: none; } .ag7-day { min-height: 76px; } }

/* ══════ 02/10: central rápida completa — aba Colar recente + contexto (e-mail / calendário) ══════ */
.ag7-ctx { min-height: 196px; display: grid; }
.ag7-mail { align-self: stretch; padding: 14px 16px; border-radius: 16px; border: 1px solid #ffffff12; background: #ffffff08; font-size: 14px; line-height: 1.6; }
body:not(.dark) .ag7-mail { border-color: #0000000d; background: #fafaf8; }
.ag7-mailhead { display: flex; align-items: baseline; gap: 10px; padding-bottom: 8px; margin-bottom: 10px; border-bottom: 1px solid #ffffff10; } body:not(.dark) .ag7-mailhead { border-bottom-color: #0000000d; }
.ag7-mailhead small { color: #8f8f88; font-size: 12px; }
.ag7-mail p { margin: 0; }
.ag7-mail #ag7-paste.in { padding: 1px 4px; border-radius: 5px; background: #10b98140; animation: ag7-pop .4s cubic-bezier(.2, .8, .2, 1); }
.ag7-mail .ag7-caret, .ag7-field .ag7-caret { color: var(--accent); }
.ag7-search { display: flex; align-items: center; gap: 8px; margin: 10px 12px 8px; padding: 8px 12px; border-radius: 10px; border: 1px solid #ffffff14; background: #00000033; font-size: 13px; }
body:not(.dark) .ag7-search { border-color: #00000014; background: #fafaf8; }
.ag7-search .ph { color: #8f8f88; } .ag7-search span:nth-child(2) { flex: 1; }
.ag7-search kbd { padding: 0 6px; border: 1px solid #ffffff24; border-radius: 5px; font: 600 10.5px 'Geist Mono', ui-monospace, Consolas, monospace; color: #8f8f88; }
.ag7-list { display: grid; gap: 4px; margin: 0 8px 8px; min-height: 196px; align-content: start; }
.ag7-item { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 10px; border: 1px solid transparent; font-size: 13px; transition: background .2s, border-color .2s; }
.ag7-item.on { background: color-mix(in srgb, var(--accent) 12%, transparent); border-color: color-mix(in srgb, var(--accent) 45%, transparent); }
.ag7-item > span:not(.ag7-tools) { min-width: 0; flex: 1; } .ag7-item b { display: block; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ag7-item small { color: #8f8f88; font-size: 11px; }
.ag7-kind { flex: none; width: 50px; padding: 2px 0; border-radius: 6px; background: #ffffff10; font: 600 10px 'Geist Mono', ui-monospace, Consolas, monospace; font-style: normal; text-align: center; color: #b9b3b0; text-transform: uppercase; }
body:not(.dark) .ag7-kind { background: #0000000a; color: #6e6e66; }
.ag7-kind.is-link { color: #60a5fa; } .ag7-kind.is-img { color: #c084fc; }
.ag7-thumb { width: 34px; height: 24px; flex: none; border-radius: 5px; background: linear-gradient(90deg, #1e9bd7, #7c5cff); }
.ag7-tools { color: #8f8f88; font-size: 12px; letter-spacing: 4px; opacity: 0; } .ag7-item.on .ag7-tools { opacity: 1; }
.ag7-acts { display: flex; gap: 6px; }
.ag7-hud .ag7-foot em.ghost { background: transparent; border: 1px solid #ffffff24; color: inherit; } body:not(.dark) .ag7-hud .ag7-foot em.ghost { border-color: #0000001f; }
.ag7-hud .ag7-foot em.press { transform: scale(.92); }
.ag7-dest { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 12px 10px; font-size: 12.5px; }
.ag7-space { display: flex; align-items: center; gap: 7px; font-weight: 600; } .ag7-space img { width: 22px; height: 22px; border-radius: 6px; }
.ag7-dots { display: flex; gap: 6px; } .ag7-dots i { width: 16px; height: 16px; border-radius: 50%; background: var(--c); opacity: .55; } .ag7-dots i.on { opacity: 1; box-shadow: 0 0 0 2px #fff3; }
.ag7-cap kbd { padding: 0 6px; border: 1px solid #ffffff2a; border-radius: 5px; font: 600 11px 'Geist Mono', ui-monospace, Consolas, monospace; }
@media (max-width: 560px) { .ag7-tools, .ag7-item small { display: none; } .ag7-kind { width: 42px; } .ag7-acts em.ghost { display: none; } }
/* as duas abas com a mesma altura: o contexto (e-mail / calendário) ocupa o que sobra */
.ag7-demo { display: flex; flex-direction: column; height: 640px; }
.ag7-ctx { flex: 1; min-height: 0; }
.ag7-list { min-height: 0; }
.ag7-cal { display: flex; flex-direction: column; } .ag7-cal[hidden] { display: none; } .ag7-days { flex: 1; } .ag7-mail[hidden] { display: none; }
@media (max-width: 560px) { .ag7-demo { height: 600px; } }

/* Ferramentas (02/10): cartões com capa em degradê nas cores da marca (arte própria) */
.tools7 { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; margin-top: 36px; }
.tool7 { display: flex; flex-direction: column; gap: 4px; border-radius: 18px; border: 1px solid var(--border); background: var(--white, #fff); overflow: hidden; padding-bottom: 16px; transition: transform .2s ease, box-shadow .2s ease; }
.tool7:hover { transform: translateY(-3px); box-shadow: 0 14px 30px #0000001a; }
.tool7.on { box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--accent) 60%, transparent); }
.tool7-cover { position: relative; height: 78px; margin-bottom: 22px; }
.tool7-ico { position: absolute; left: 14px; bottom: -18px; height: 40px; min-width: 40px; padding: 0 9px; border-radius: 12px; background: #fff; display: flex; align-items: center; justify-content: center; gap: 6px; box-shadow: 0 6px 16px #0003; border: 1px solid #0000000f; }
.tool7-ico img { width: 21px; height: 21px; }
.tool7-ico.tw { color: var(--accent); }
.tool7-ico.tw svg { width: 20px; height: 20px; }
.tool7-cover em { position: absolute; top: 10px; right: 10px; font: 700 10px var(--mono, ui-monospace, monospace); font-style: normal; letter-spacing: .06em; text-transform: uppercase; padding: 3px 8px; border-radius: 999px; background: #0000008c; color: #fff; }
.tool7-cover em.pro { background: var(--accent); }
.tool7 b, .tool7 p, .tool7 small { padding: 0 16px; }
.tool7 b { font-size: 15px; }
.tool7 p { margin: 0; font-size: 13px; line-height: 1.45; color: var(--muted); }
.tool7 small { margin-top: auto; padding-top: 10px; font: 600 10.5px var(--mono, ui-monospace, monospace); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.tool7 small.tool7-on { color: var(--accent); }
.tool7.more { align-items: center; justify-content: center; border-style: dashed; background: transparent; color: var(--muted); font-weight: 600; text-align: center; padding: 16px; min-height: 150px; }

/* Palco com a aurora da marca atrás das demonstrações (02/10) — a "tela do PC" */
.stage7 { position: relative; padding: 34px; border-radius: 30px; background: #120a08 center / cover no-repeat; image-rendering: pixelated; box-shadow: 0 30px 70px -30px #ff5a2c66; }
.stage7::after { content: ''; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px #ffffff14; pointer-events: none; }
.stage7 > * { image-rendering: auto; }
.stage7.st-ai { background-image: url(assets/aurora/aurora-fogo-a.png); }
.stage7.st-ag { background-image: url(assets/aurora/aurora-neon-b.png); }
@media (max-width: 560px) { .stage7 { padding: 14px; border-radius: 22px; } }
.tool7-cover { background: #1a0d0a center / cover no-repeat; image-rendering: pixelated; }
.tool7-cover > * { image-rendering: auto; }
/* capas "darkzão": cantos escurecidos + base fundindo no cartão (02/10) */
.tool7-cover::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(120% 95% at 50% 35%, transparent 38%, #000000b3 100%), linear-gradient(180deg, transparent 45%, #0b0b0ccc 100%); }
.tool7-cover > * { z-index: 1; }
/* palcos "darkzão" também: cantos escurecidos atrás da janela (02/10) */
.stage7::before { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: radial-gradient(85% 80% at 50% 50%, transparent 35%, #000000c7 100%); }
.stage7 > * { position: relative; z-index: 1; }

/* Central rápida: luz no alto à direita e desaparecimento embaixo à esquerda. */
.stage7.st-ag { background-color: var(--page); box-shadow: none; }
.stage7.st-ag::before {
  background: radial-gradient(ellipse at 100% 0%, transparent 8%, color-mix(in srgb, var(--page) 35%, transparent) 38%, var(--page) 76%);
}
.stage7.st-ag::after { box-shadow: none; }
body.dark .stage7.st-ag {
  border-radius: 24px;
  -webkit-mask-image: linear-gradient(270deg, #000 65%, #000e 82%, #0009 94%, transparent 100%), linear-gradient(180deg, #000 76%, #000e 86%, #0008 94%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(270deg, #000 65%, #000e 82%, #0009 94%, transparent 100%), linear-gradient(180deg, #000 76%, #000e 86%, #0008 94%, transparent 100%);
  mask-composite: intersect;
}
body.dark .stage7.st-ag::after { box-shadow: inset 0 0 0 1px #ffffff12; }

/* IA: mesmo acabamento, espelhado para dissolver embaixo e à direita. */
.stage7.st-ai { background-color: var(--page); box-shadow: none; }
.stage7.st-ai::before {
  background: radial-gradient(ellipse at 0% 0%, transparent 8%, color-mix(in srgb, var(--page) 35%, transparent) 38%, var(--page) 76%);
}
.stage7.st-ai::after { box-shadow: none; }
body.dark .stage7.st-ai {
  border-radius: 24px;
  -webkit-mask-image: linear-gradient(90deg, #000 65%, #000e 82%, #0009 94%, transparent 100%), linear-gradient(180deg, #000 76%, #000e 86%, #0008 94%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, #000 65%, #000e 82%, #0009 94%, transparent 100%), linear-gradient(180deg, #000 76%, #000e 86%, #0008 94%, transparent 100%);
  mask-composite: intersect;
}
body.dark .stage7.st-ai::after { box-shadow: inset 0 0 0 1px #ffffff12; }

/* Aurora da marca: pixels preservados, luz preenchendo a hero e base escura. */
.px7[data-mode="8"] {
  opacity: .68;
  -webkit-mask: radial-gradient(90% 95% at 53% 35%, #000 25%, transparent 90%);
  mask: radial-gradient(90% 95% at 53% 35%, #000 25%, transparent 90%);
}