/* =====================================================================
   Website V1.1 — camada visual complementar (carregada depois da V2)
   A · Fluid Technology   B · Human & Real (fotografia)   C · Capturas reais
   Bandas claras com tokens próprios para reduzir a monotonia navy.
   ===================================================================== */

/* ---------- Bandas claras dentro de páginas escuras (tokens em escopo) ---------- */
[data-identity="v2"] body .band--light,
[data-identity="v2"] body[data-surface="light"] {
  color-scheme: light;
  --page: #F5F8FC; --surface: #FFFFFF; --mist: #EEF3FA; --mist-2: #E2EAF6; --line: #D3DDEC;
  --ink: #081E55; --ink-2: #3E5079; --ink-3: #5A6A90;
  --fg-strong: #081E55; --fill-strong: #081E55; --on-fill: #FFFFFF; --control: #081E55;
  --teal-ink: #056A6D; --ok: #1A7F55; --warn: #8A5A0C; --info: #2F4FC9;
  --grad-surface: linear-gradient(180deg, #FFFFFF, #FFFFFF);
  --edge-light: 0 0 0 0 transparent;
  --depth-1: 0 1px 0 rgba(8, 30, 85, 0.05), 0 10px 24px -14px rgba(8, 30, 85, 0.3);
  --depth-2: 0 1px 0 rgba(8, 30, 85, 0.06), 0 22px 40px -22px rgba(8, 30, 85, 0.4);
  color: var(--ink);
}
[data-identity="v2"] body[data-surface] .band.band--light { background: linear-gradient(180deg, #F7FAFD, #EEF3F9); border-block: 0; }
[data-identity="v2"] body .band--light :is(.btn--line) { background: #FFFFFF; color: #081E55; border-color: #C9D5E8; backdrop-filter: none; }
[data-identity="v2"] body .band--light .btn--line:hover { border-color: #081E55; }
[data-identity="v2"] body .band--light .select { background-image: linear-gradient(45deg, transparent 50%, #081E55 50%), linear-gradient(135deg, #081E55 50%, transparent 50%); }
[data-identity="v2"] body .band--light .select option { background: #FFFFFF; color: #081E55; }
[data-identity="v2"] body .band--light .mini-glyph { background: #EEF3FA; color: #081E55; border-color: #D3DDEC; }
[data-identity="v2"] body .band--light :is(.check__n, .gnode__n) { background: #EEF3FA; }
[data-identity="v2"] body .band--light .prod-card::before { background: #E2EAF6; }
[data-identity="v2"] body .band--light .pd-outcome { background: #EEF3FA; box-shadow: none; }
[data-identity="v2"] body .band--light .notice { background: #EEF3FA; }
[data-identity="v2"] body .band--light .eyebrow { color: #056A6D; }
[data-identity="v2"] body .band--light .fmt { background: #081E55; }
[data-identity="v2"] body .band--light .grad-text { -webkit-text-fill-color: currentColor; background: none; color: #067F82; }

/* ---------- Media (fotografias, capturas, ilustrações) ---------- */
.media { position: relative; margin: 0; overflow: hidden; border-radius: var(--r-l); background: #0A1B4C; }
.media img, .media svg { display: block; width: 100%; height: 100%; object-fit: cover; }
.media picture { display: block; width: 100%; height: 100%; }
.media__label { position: absolute; left: 10px; top: 10px; z-index: 1; padding: 3px 8px; border-radius: 6px; font-size: 11px; font-weight: 600; letter-spacing: 0.02em; background: rgba(2, 10, 34, 0.78); color: #FFFFFF; }
.media__label--real { background: rgba(6, 127, 130, 0.92); }
.media__credit { position: absolute; right: 8px; bottom: 8px; z-index: 1; max-width: calc(100% - 16px); padding: 2px 6px; border-radius: 4px; font-size: 10px; line-height: 1.4; background: rgba(2, 10, 34, 0.7); color: #E6EEFF; }
.media--capture { border: 1px solid rgba(166, 192, 255, 0.25); box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.6); background: #FFFFFF; }
.media--capture img { object-fit: cover; object-position: top center; }
.cover { aspect-ratio: 16 / 10; border-radius: 0; }
.cover--generated svg { width: 100%; height: 100%; }

/* Cartão de produto com capa */
.prod-card { padding: 0; overflow: hidden; gap: 0; }
.prod-card::before { display: none; }
.prod-card .cover { border-bottom: 1px solid var(--line); }
.prod-card__body { display: flex; flex-direction: column; gap: var(--s-3); padding: var(--s-4) var(--s-5) var(--s-5); flex: 1; }
.prod-card__meta { font-size: var(--fs-xs); color: var(--ink-3); }
.prod-card__go { font-size: var(--fs-s); }
.prod-card--coming_soon .cover, .prod-card--lab .cover { filter: saturate(0.85); }

/* ---------- Botões e notas de CTA ---------- */
.btn--l { min-height: 54px; padding: 0 28px; font-size: 1.02rem; }
.btn--disabled { background: rgba(255, 255, 255, 0.06); color: var(--ink-3); border: 1.5px dashed var(--line); cursor: not-allowed; box-shadow: none; }
.btn--disabled:hover { transform: none; }
.band--light .btn--disabled, body[data-surface="light"] .btn--disabled { background: #F1F4F9; color: #5A6A90; }
.btn[disabled] { opacity: 0.5; cursor: not-allowed; pointer-events: auto; }
.cta-note { display: block; width: 100%; font-size: var(--fs-s); color: var(--ink-3); }
.band--navy .cta-note, .lp-hero .cta-note, .finder .cta-note { color: #B6C4E6; }
.cta-note--warn { color: var(--warn); }
.cta-note a { color: inherit; text-decoration: underline; }

/* ---------- Cabeçalho: menu móvel e «Em breve» ---------- */
.hdr__menu { display: none; margin-left: auto; width: 44px; height: 44px; border-radius: 10px; border: 1px solid rgba(166, 192, 255, 0.3); background: transparent; color: #FFFFFF; }
.hdr__menu svg { width: 22px; height: 22px; }
.hdr__soon { font-size: 10px; font-weight: 700; letter-spacing: 0.04em; padding: 2px 6px; border-radius: 999px; border: 1px solid rgba(242, 196, 109, 0.6); color: #F2C46D; }
.hdr__learn { gap: 6px; }
.hdr__cta { margin-left: var(--s-3); }
@media (max-width: 860px) {
  .hdr__in { flex-wrap: nowrap; }
  .hdr__menu { display: inline-grid; place-items: center; }
  .hdr__nav { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; gap: 2px; padding: var(--s-3) max(16px, env(safe-area-inset-left, 0px)) var(--s-4); background: #001331; border-bottom: 1px solid rgba(166, 192, 255, 0.15); box-shadow: 0 20px 40px -20px rgba(0, 0, 0, 0.8); margin: 0; overflow: visible; }
  .hdr.is-open .hdr__nav { display: flex; }
  .hdr__nav .hdr__link { padding: 12px; font-size: var(--fs-m); }
  .hdr__cta { margin-left: 8px; }
}
@media (max-width: 430px) { .hdr__cta { padding: 0 12px; font-size: 0.8rem; } .logo--official .logo__wm { height: 26px; } .logo--official .logo__fp { height: 32px; } .logo--official { gap: 8px; } }

/* Fita LAB persistente */
.ribbon--lab { background: #3A2A00; color: #FFE7A8; border-bottom: 1px solid rgba(242, 196, 109, 0.4); }
.ribbon--lab b { color: #FFFFFF; }

/* ---------- Landing (#entrada) ---------- */
.lp-hero { position: relative; overflow: hidden; padding-block: var(--s-8) calc(var(--s-8) + 40px); }
.lp-hero__fluid, .hero__fluid { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; opacity: 0.95; }
.lp-hero__in { position: relative; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: var(--s-7); align-items: center; }
.lp-hero__copy { display: grid; gap: var(--s-4); }
.lp-hero h1 { font-size: clamp(2.5rem, 5.2vw, 4.4rem); max-width: 14ch; }
.signature { font-family: var(--font-display); font-weight: 500; letter-spacing: 0.32em; text-transform: uppercase; font-size: 0.78rem; color: #CFE3FF; }
.lp-hero__photo { aspect-ratio: 5 / 4; box-shadow: 0 50px 80px -40px rgba(0, 0, 0, 0.85); border: 1px solid rgba(255, 255, 255, 0.12); }
.lp-hero__waves { position: absolute; left: 0; right: 0; bottom: -10px; width: 100%; height: 140px; pointer-events: none; opacity: 0.85; }
@media (prefers-reduced-motion: no-preference) {
  .lp-hero__waves { animation: ds-drift 26s ease-in-out infinite alternate; transform-origin: 50% 50%; }
  @keyframes ds-drift { from { transform: translateX(-1.5%) scaleY(1); } to { transform: translateX(1.5%) scaleY(1.08); } }
}
@media (max-width: 900px) { .lp-hero__in { grid-template-columns: 1fr; } .lp-hero__photo { aspect-ratio: 16 / 10; } }

.doors { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-5); }
.door { display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-l); overflow: hidden; box-shadow: var(--depth-1); }
.door__media { aspect-ratio: 16 / 10; border-radius: 0; }
.door__body { display: grid; gap: var(--s-2); padding: var(--s-5); }
.door__body h3 { font-size: var(--fs-2xl); }
.door__body p { color: var(--ink-2); }
.door__link { font-weight: 700; color: var(--teal-ink); text-decoration: none; margin-top: var(--s-2); }
.door__link:hover { text-decoration: underline; }
@media (max-width: 860px) { .doors { grid-template-columns: 1fr; } }

.lp-course__in { display: grid; grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); gap: var(--s-7); align-items: center; }
.lp-course__copy { display: grid; gap: var(--s-4); }
.lp-course__cover { aspect-ratio: 4 / 3; box-shadow: 0 40px 70px -40px rgba(0, 0, 0, 0.85); }
.facts--course { grid-template-columns: repeat(2, minmax(0, 1fr)); border-top-color: var(--line); }
@media (max-width: 900px) { .lp-course__in { grid-template-columns: 1fr; } }
.lp-proof { display: grid; gap: var(--s-5); }
.lp-proof__shot { max-width: 1000px; aspect-ratio: 16 / 10; margin-inline: auto; width: 100%; }
.how { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-5); }
.how__i { display: grid; gap: var(--s-2); padding: var(--s-5); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-m); }
.how__n { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: #081E55; color: #FFFFFF; font-family: var(--font-display); font-weight: 800; }
@media (max-width: 760px) { .how { grid-template-columns: 1fr; } }
.lp-about__in { display: grid; grid-template-columns: minmax(0, 1.4fr) auto; gap: var(--s-6); align-items: end; }
.lp-about__in > div:first-child { display: grid; gap: var(--s-3); }
.lp-about__links { display: flex; gap: var(--s-3); flex-wrap: wrap; }
@media (max-width: 760px) { .lp-about__in { grid-template-columns: 1fr; } }

/* ---------- Homepage ---------- */
.hero__fluid { opacity: 0.7; }
.path { padding: 0; overflow: hidden; }
.path > :not(.path__media) { margin-inline: var(--s-5); }
.path > :last-child { margin-bottom: var(--s-5); }
.path__media { aspect-ratio: 16 / 9; border-radius: 0; }
.pchip em { font-style: normal; font-size: 10px; font-weight: 700; margin-left: 4px; padding: 1px 5px; border-radius: 4px; background: #E2EAF6; color: #3E5079; }
.pchip--available em { background: #D7F3E6; color: #1A7F55; }
.b2b-teaser__photo { aspect-ratio: 3 / 2; }
.needs .need { min-height: 100%; }

/* ---------- Finder ---------- */
.ticket { background: #EEF3FA; }
.fq__nav { align-items: center; }
.fq__hint { font-size: var(--fs-s); flex: 1; text-align: center; }
.fopt:focus-visible { outline: 3px solid #13D0D3; outline-offset: 3px; }
.fres__explain { margin-top: var(--s-4); font-size: var(--fs-s); color: #B6C4E6; }
.fres__explain summary { cursor: pointer; font-weight: 600; color: #EEF3FF; }
.fres__explain p { margin-top: var(--s-2); }
.fres__tie, .fres__warn { padding: 10px 14px; border-radius: 10px; font-size: var(--fs-s); }
.fres__tie { background: rgba(157, 178, 255, 0.12); color: #DCE4FF; }
.fres__warn { background: rgba(242, 196, 109, 0.12); color: #FFE2A6; }
.fres__cols .fres__h + .reasons + .fres__h { margin-top: var(--s-4); }
.route__i { grid-template-columns: auto minmax(0, 1fr) auto; }
.route__s { display: grid; justify-items: end; gap: 4px; }
.route__i--coming_soon, .route__i--lab { opacity: 0.92; }

/* ---------- Solução ---------- */
.sol-hero__side { display: grid; gap: var(--s-4); }
.start-card { display: grid; gap: var(--s-3); padding: var(--s-5) var(--s-6); justify-items: start; }
.start-card__t { font-family: var(--font-display); font-size: var(--fs-xl); font-weight: 700; color: #FFFFFF; }
.scenario-note { display: inline-block; margin-bottom: var(--s-4); padding: 4px 10px; border-radius: 6px; font-size: var(--fs-s); font-weight: 600; background: #FFF4DA; color: #6B4708; }
.band--tight { padding-block: var(--s-7); }
@media (min-width: 1100px) { .sol-hero { padding-block: var(--s-6) var(--s-7); } }

/* ---------- Empresas ---------- */
.biz-hero__photo { aspect-ratio: 3 / 2; }
.tracks--grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-5); }
.tracks--grid .track { margin: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-l); box-shadow: var(--depth-1); color: var(--ink); }
.tracks--grid .track p { color: var(--ink-2); }
.tracks--grid .track__k { color: var(--teal-ink); }
@media (max-width: 760px) { .tracks--grid { grid-template-columns: 1fr; } }
.deliverables { margin-top: var(--s-6); display: grid; gap: var(--s-3); max-width: 760px; }
.deliverables ul { margin: 0; padding-left: 1.2em; display: grid; gap: var(--s-2); }
.process__note { margin-top: var(--s-4); }
.req { color: #B42318; font-weight: 700; }
.opt { color: var(--ink-3); font-weight: 400; font-size: var(--fs-xs); }
.rq__req { font-size: var(--fs-xs); }
.rq__demo { margin: 0; }
.consents { display: grid; gap: var(--s-2); }
.notice--demo { border-left-color: #B7791F; background: #FFF6E2; color: #5B3D06; }
.notice--demo b { color: #3A2700; }
.confirm--demo { background: #FFF6E2; color: #3A2700; }
.confirm--demo .muted, .confirm--demo p { color: #5B3D06; }
.confirm--demo code { background: rgba(0, 0, 0, 0.06); color: #3A2700; }
.check--soon { opacity: 0.6; }
.check--soon .check__n { font-size: 10px; }
.res__more { display: flex; justify-content: center; margin-top: var(--s-5); }

/* ---------- My Learning ---------- */
.ml-public { display: grid; gap: var(--s-4); max-width: 760px; padding-block: var(--s-5); }
.mlp__icon { width: 56px; height: 56px; border-radius: 14px; display: grid; place-items: center; background: #EEF3FA; color: #081E55; }
.mlp__icon .glyph { width: 26px; height: 26px; }
.ml-limits { grid-column: 1 / -1; }

/* ---------- Páginas legais ---------- */
.legal__in { display: grid; gap: var(--s-4); max-width: 760px; }
.legal__body { display: grid; gap: var(--s-3); }
.legal__body h2 { font-size: var(--fs-xl); margin-top: var(--s-4); }
.legal__body p { color: var(--ink-2); }

/* ---------- Modal sem scroll de fundo ---------- */
.is-modal-open, .is-modal-open body { overflow: hidden; }

/* Foco visível também em superfícies claras */
.band--light :focus-visible, body[data-surface="light"] :focus-visible { outline-color: #067F82; }

/* Painel do diagnóstico (superfície clara dentro do Finder escuro): tokens claros */
.ticket { --teal-ink: #056A6D; --ink-3: #5A6A90; --line: #D3DDEC; --mist-2: #E2EAF6; color: #081E55; }
.ticket .eyebrow, .ticket .ticket__edit { color: #056A6D; }
.ticket .muted, .ticket__note { color: #5A6A90; }
.route__t strong { line-height: 1.3; }
.ticket__row dd { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; grid-column: 1 / -1; }
.ticket__row .ticket__edit { flex: none; grid-row: auto; padding: 0 2px; }