/* Strabrand.ai — website v1.0
   Grelha: 12 colunas · margem 80 / 48 / 32 / 16 · medianiz 24 / 20 / 16 / 12 (Brand Book p. 43) */
:root {
  --preto: #0B0C0E;
  --branco: #FFFFFF;
  --cobalto: #2B54F5;
  --cobalto-escuro: #1530A8;
  --azul-medio: #6F8BFF;
  --azul-claro: #A9BBFF;
  --azul-nevoa: #DCE3FF;
  --grafite: #3A3F4A;
  --cinza: #5F6573;
  --cinza-claro: #C4C8D0;
  --nevoa: #EDEEF1;
  --linha-escura: #262A31;

  --f-display: 'Schibsted Grotesk', 'Helvetica Neue', Arial, sans-serif;
  --f-mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  --margem: 80px;
  --gutter: 24px;
  --max: 1440px;
  --sec: 120px;
  color-scheme: only light;
}
@media (max-width: 1180px) { :root { --margem: 48px; --gutter: 20px; --sec: 96px; } }
@media (max-width: 860px)  { :root { --margem: 32px; --gutter: 16px; --sec: 80px; } }
@media (max-width: 560px)  { :root { --margem: 16px; --gutter: 12px; --sec: 64px; } }

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; animation: none !important; } }
body { margin: 0; background: var(--branco); color: var(--preto); font-family: var(--f-display); font-size: 18px; line-height: 1.55; overflow-x: hidden; }
@media (max-width: 560px) { body { font-size: 16px; } }
img { max-width: 100%; display: block; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--cobalto); outline-offset: 3px; border-radius: 4px; }

.wrap { width: 100%; max-width: var(--max); margin: 0 auto; padding-inline: var(--margem); }
.grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); row-gap: 40px; }
.grid > * { min-width: 0; }
@media (max-width: 860px) { .grid { grid-template-columns: repeat(8, minmax(0, 1fr)); } }
@media (max-width: 560px) { .grid { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: 28px; } }

/* ---------- tipografia ---------- */
.label { font-family: var(--f-mono); font-size: 12px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: var(--cinza); display: inline-flex; align-items: center; gap: 10px; }
.label::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--cobalto); flex-shrink: 0; }
.label.plain::before { display: none; }
.on-dark .label, .label.on-dark { color: var(--cinza-claro); }
.on-cobalt .label { color: var(--azul-nevoa); }
.on-cobalt .label::before { background: var(--branco); }
.display { font-size: clamp(44px, 6.4vw, 92px); font-weight: 800; letter-spacing: -0.05em; line-height: 0.98; margin: 0; text-wrap: balance; }
.h1 { font-size: clamp(36px, 4.6vw, 64px); font-weight: 800; letter-spacing: -0.045em; line-height: 1.02; margin: 0; text-wrap: balance; }
.h2 { font-size: clamp(26px, 2.6vw, 36px); font-weight: 800; letter-spacing: -0.035em; line-height: 1.1; margin: 0; text-wrap: balance; }
.h3 { font-size: 22px; font-weight: 800; letter-spacing: -0.025em; line-height: 1.2; margin: 0; }
.lead { font-size: clamp(18px, 1.5vw, 22px); line-height: 1.5; color: var(--grafite); margin: 0; max-width: 40ch; }
.on-dark .lead { color: var(--cinza-claro); }
.on-cobalt .lead { color: var(--azul-nevoa); }
.body { margin: 0; color: var(--grafite); max-width: 62ch; }
.on-dark .body { color: var(--cinza-claro); }
.accent { color: var(--cobalto); }
.on-dark .accent { color: var(--azul-medio); }
.stack { display: flex; flex-direction: column; gap: 20px; }
.stack-s { display: flex; flex-direction: column; gap: 10px; }
.stack-l { display: flex; flex-direction: column; gap: 32px; }

/* ---------- logótipo ---------- */
.wordmark { font-weight: 800; letter-spacing: -0.045em; line-height: 1; white-space: nowrap; text-decoration: none; color: inherit; }
.wordmark i { display: inline-block; width: 0.17em; height: 0.17em; border-radius: 50%; background: var(--cobalto); margin: 0 0.04em 0 0.05em; font-style: normal; }

/* ---------- botões ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 26px; border-radius: 999px; font-family: var(--f-display); font-size: 16px; font-weight: 700; text-decoration: none; border: 0; cursor: pointer; transition: background .18s, color .18s, box-shadow .18s, transform .18s; white-space: nowrap; }
.btn-primary { background: var(--cobalto); color: var(--branco); }
.btn-primary:hover { background: var(--cobalto-escuro); }
.btn-secondary { background: transparent; color: var(--preto); box-shadow: inset 0 0 0 2px var(--preto); }
.btn-secondary:hover { background: var(--preto); color: var(--branco); }
.on-dark .btn-secondary, .on-cobalt .btn-secondary { color: var(--branco); box-shadow: inset 0 0 0 2px var(--branco); }
.on-dark .btn-secondary:hover, .on-cobalt .btn-secondary:hover { background: var(--branco); color: var(--preto); }
.on-cobalt .btn-primary { background: var(--branco); color: var(--preto); }
.on-cobalt .btn-primary:hover { background: var(--preto); color: var(--branco); }
.btn .arrow { transition: transform .18s; }
.btn:hover .arrow { transform: translateX(3px); }
.link { font-weight: 700; color: var(--cobalto); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 2px; }
.on-dark .link { color: var(--azul-medio); }
.actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
@media (max-width: 560px) { .actions .btn { flex: 1 1 100%; } }

/* ---------- cabeçalho ---------- */
.site-header { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50; background: rgba(255,255,255,0.94); backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid var(--nevoa); }
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 76px; }
.site-header .wordmark { font-size: 26px; }
.nav { display: flex; align-items: center; gap: 4px; }
.nav a { font-size: 15px; font-weight: 500; text-decoration: none; padding: 8px 14px; border-radius: 999px; color: var(--grafite); }
.nav a:hover { background: var(--nevoa); color: var(--preto); }
.nav a[aria-current="page"] { color: var(--preto); font-weight: 700; }
.nav a[aria-current="page"]::after { content: ""; display: block; width: 6px; height: 6px; margin: 2px auto -8px; border-radius: 50%; background: var(--cobalto); }
.header-cta { min-height: 44px; padding: 0 20px; font-size: 15px; }
.menu-btn { display: none; width: 44px; height: 44px; border-radius: 12px; border: 0; background: var(--nevoa); cursor: pointer; position: relative; }
.menu-btn span { position: absolute; left: 12px; right: 12px; height: 2px; background: var(--preto); transition: transform .2s, top .2s; }
.menu-btn span:nth-child(1) { top: 17px; } .menu-btn span:nth-child(2) { top: 25px; }
.menu-open .menu-btn span:nth-child(1) { top: 21px; transform: rotate(45deg); }
.menu-open .menu-btn span:nth-child(2) { top: 21px; transform: rotate(-45deg); }
.mobile-menu { display: none; }
@media (max-width: 980px) {
  .nav, .site-header .header-cta { display: none; }
  .menu-btn { display: block; }
  .site-header .wrap { height: 64px; }
  .site-header .wordmark { font-size: 22px; }
  .mobile-menu { position: fixed; inset: 64px 0 0 0; background: var(--preto); color: var(--branco); padding: 32px var(--margem) calc(32px + env(safe-area-inset-bottom, 0px)); flex-direction: column; gap: 6px; z-index: 49; overflow-y: auto; }
  .menu-open .mobile-menu { display: flex; }
  .mobile-menu a.m { font-size: 34px; font-weight: 800; letter-spacing: -0.04em; text-decoration: none; padding: 8px 0; border-bottom: 1px solid var(--linha-escura); display: flex; justify-content: space-between; align-items: center; }
  .mobile-menu a.m[aria-current="page"] { color: var(--azul-medio); }
  .mobile-menu .btn { margin-top: 24px; }
  .mobile-menu .label { margin-top: auto; padding-top: 32px; color: var(--cinza-claro); }
}

/* ---------- secções ---------- */
.section { padding-block: var(--sec); }
.section.tight { padding-block: calc(var(--sec) * 0.6); }
.bg-preto { background: var(--preto); color: var(--branco); }
.bg-cobalto { background: var(--cobalto); color: var(--branco); }
.bg-nevoa { background: var(--nevoa); }
.sec-head { grid-column: 1 / span 7; display: flex; flex-direction: column; gap: 20px; }
.sec-aside { grid-column: 9 / span 4; align-self: end; }
@media (max-width: 860px) { .sec-head, .sec-aside { grid-column: 1 / -1; } }

/* ---------- hero ---------- */
.hero { position: relative; overflow: hidden; padding-block: 96px 112px; }
.hero .grid { align-items: center; }
.hero-copy { grid-column: 1 / span 8; display: flex; flex-direction: column; gap: 28px; position: relative; z-index: 1; }
.hero-art { grid-column: 9 / span 4; position: relative; aspect-ratio: 1 / 1; max-width: 100%; }
@media (max-width: 860px) {
  .hero { padding-block: 56px 72px; }
  .hero-copy { grid-column: 1 / -1; }
  .hero-art { grid-column: 1 / -1; max-width: 360px; width: 100%; order: -1; }
}
@media (max-width: 560px) { .hero-art { max-width: 240px; } }

/* símbolo (quadrado r 23% · linha a meia altura · ponto Ø 20% a 66%) */
.symbol { position: relative; width: 100%; aspect-ratio: 1 / 1; border-radius: 23%; background: var(--preto); }
.symbol::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 2.2%; margin-top: -1.1%; background: var(--branco); }
.symbol::after { content: ""; position: absolute; left: 66%; top: 50%; width: 20%; height: 20%; transform: translate(-50%, -50%); border-radius: 50%; background: var(--cobalto); }
.symbol.light { background: var(--branco); }
.symbol.light::before { background: var(--preto); }
.symbol.on-c { background: var(--branco); }
.symbol.on-c::before { background: var(--cobalto); }
.symbol.on-c::after { background: var(--preto); }

/* formas da marca */
.shape { display: block; background: var(--cobalto); }
.s-arco { border-radius: 999px 999px 0 0; aspect-ratio: 1/1; }
.s-quadrado { border-radius: 23%; aspect-ratio: 1/1; }
.s-gota { border-radius: 50% 50% 50% 0; aspect-ratio: 1/1; }
.s-quarto { border-radius: 100% 0 0 0; aspect-ratio: 1/1; }
.s-pilula { border-radius: 999px; aspect-ratio: 2/1; }
.s-semi { border-radius: 999px 999px 0 0; aspect-ratio: 2/1; }
.s-folha { border-radius: 50% 0; aspect-ratio: 1/1; }
.s-losango { aspect-ratio: 1/1; border-radius: 14%; transform: rotate(45deg) scale(.72); }

/* mosaico hero */
.mosaic { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; width: 100%; height: 100%; }
.mosaic > * { width: 100%; align-self: center; }

/* ---------- problema / situações ---------- */
.situations { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--gutter); counter-reset: s; }
.situation { border-top: 2px solid var(--preto); padding-top: 18px; display: flex; flex-direction: column; gap: 14px; font-size: 17px; line-height: 1.45; }
.situation .q { font-family: var(--f-mono); font-size: 12px; letter-spacing: .1em; color: var(--cinza); }
@media (max-width: 1180px) { .situations { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 860px) { .situations { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .situations { grid-template-columns: 1fr; } }
.editorial-note { grid-column: 1 / -1; font-family: var(--f-mono); font-size: 12px; color: var(--cinza); border: 1px dashed var(--cinza-claro); border-radius: 10px; padding: 12px 16px; }
.on-dark .editorial-note { color: var(--cinza-claro); border-color: var(--grafite); }

/* ---------- produto ---------- */
.product-card { grid-column: 1 / -1; display: grid; grid-template-columns: 7fr 5fr; gap: 0; border-radius: 28px; overflow: hidden; background: var(--preto); color: var(--branco); }
.product-card .pc-copy { padding: 56px; display: flex; flex-direction: column; gap: 22px; }
.product-card .pc-out { background: var(--cobalto); padding: 56px 48px; display: flex; flex-direction: column; justify-content: space-between; gap: 32px; }
.outcomes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.outcomes li { display: flex; align-items: center; gap: 18px; padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,.28); font-size: clamp(22px, 2.2vw, 30px); font-weight: 800; letter-spacing: -.035em; }
.outcomes li:last-child { border-bottom: 0; }
.outcomes .shape { width: 34px; flex-shrink: 0; background: var(--branco); }
@media (max-width: 980px) { .product-card { grid-template-columns: 1fr; } .product-card .pc-copy, .product-card .pc-out { padding: 36px 28px; } }
@media (max-width: 560px) { .product-card { border-radius: 20px; } .product-card .pc-copy, .product-card .pc-out { padding: 28px 22px; } }

/* ---------- dimensões ---------- */
.dims { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.dim { background: var(--nevoa); border-radius: 20px; padding: 24px 22px 26px; display: flex; flex-direction: column; justify-content: space-between; gap: 40px; min-height: 260px; }
.dim .n { font-family: var(--f-mono); font-size: 13px; color: var(--cobalto-escuro); }
.dim .top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.dim .shape { width: 46px; }
.dim h3 { font-size: 21px; font-weight: 800; letter-spacing: -.03em; line-height: 1.15; margin: 0; }
.dim p { margin: 0; font-size: 15px; line-height: 1.45; color: var(--grafite); }
.bg-nevoa .dim { background: var(--branco); }
.bg-preto .dim { background: #15181D; }
.bg-preto .dim p { color: var(--cinza-claro); }
.bg-preto .dim .n { color: var(--azul-medio); }
@media (max-width: 1180px) { .dims { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 860px) { .dims { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dim { min-height: 200px; } }
@media (max-width: 560px) { .dims { grid-template-columns: 1fr; gap: 8px; } .dim { min-height: 0; gap: 18px; padding: 18px 18px 20px; } .dim .shape { width: 32px; } }

/* Modalidades · Standard e Pro com o mesmo peso visual */
.levels { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.level { background: var(--branco); border-radius: 20px; padding: 28px 28px 32px; display: flex; flex-direction: column; gap: 48px; }
.level .top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.level .n { font-size: clamp(26px, 2.4vw, 34px); font-weight: 800; letter-spacing: -.04em; line-height: 1; }
.level .shape { width: 46px; }
.level p { margin: 0; font-size: 18px; line-height: 1.5; color: var(--grafite); max-width: 46ch; }
.level-std { background: var(--preto); color: var(--branco); }
.level-std p { color: var(--cinza-claro); }
.level-std .shape { background: var(--branco); }
.level-pro { background: var(--cobalto); color: var(--branco); }
.level-pro p { color: var(--azul-nevoa); }
.level-pro .shape { background: var(--preto); }
.levels-note { grid-column: 1 / -1; display: flex; gap: 14px; align-items: center; margin: 0; font-size: 17px; line-height: 1.45; color: var(--grafite); }
.levels-note .dot { width: 10px; height: 10px; border-radius: 50%; background: var(--cobalto); flex-shrink: 0; }
@media (max-width: 860px) { .levels { grid-template-columns: 1fr; gap: 8px; } .level { gap: 24px; } }
@media (max-width: 560px) { .level { padding: 20px 20px 24px; } .level .shape { width: 32px; } .level p { font-size: 16px; } }

/* Depois do diagnóstico · percurso */
.after-lead { max-width: 58ch; }
.after { grid-column: 1 / -1; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; counter-reset: none; }
.after li { position: relative; background: var(--azul-nevoa); border-radius: 20px; padding: 24px 22px 26px; display: flex; flex-direction: column; justify-content: space-between; gap: 48px; min-height: 260px; }
.after li:not(:last-child)::after { content: "→"; position: absolute; right: -11px; top: 50%; transform: translate(50%, -50%); width: 30px; height: 30px; border-radius: 50%; background: var(--branco); color: var(--cobalto); display: grid; place-items: center; font-weight: 700; font-size: 16px; z-index: 1; box-shadow: 0 0 0 4px var(--branco); }
.after .top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.after .n { font-family: var(--f-mono); font-size: 13px; color: var(--cobalto-escuro); text-transform: uppercase; letter-spacing: .1em; }
.after .shape { width: 46px; }
.after h3 { font-size: 24px; font-weight: 800; letter-spacing: -.03em; line-height: 1.1; margin: 0 0 8px; }
.after p { margin: 0; font-size: 15px; line-height: 1.45; color: var(--grafite); }
.after .after-start { background: var(--nevoa); }
.after .after-start .shape { background: var(--preto); }
.after-notes { grid-column: 1 / -1; list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.after-notes li { display: inline-flex; align-items: center; gap: 10px; padding: 10px 18px; border-radius: 999px; box-shadow: inset 0 0 0 1.5px var(--cinza-claro); font-size: 15px; font-weight: 700; }
.after-notes .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--cobalto); }
@media (max-width: 1180px) { .after { grid-template-columns: repeat(2, minmax(0, 1fr)); } .after li:nth-child(2)::after { display: none; } }
@media (max-width: 560px) {
  .after { grid-template-columns: 1fr; gap: 8px; }
  .after li { min-height: 0; gap: 18px; padding: 18px 18px 20px; }
  .after li:not(:last-child)::after { display: grid; right: 50%; top: auto; bottom: -4px; transform: translate(50%, 50%) rotate(90deg); }
  .after .shape { width: 32px; }
  .after h3 { font-size: 21px; }
  .after-notes li { font-size: 14px; }
}

/* números do método */
.figures { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gutter); border-top: 2px solid currentColor; }
.figure { padding-top: 22px; display: flex; flex-direction: column; gap: 6px; }
.figure b { font-size: clamp(56px, 7vw, 104px); font-weight: 800; letter-spacing: -.06em; line-height: .9; font-variant-numeric: tabular-nums; }
.figure span { font-size: 16px; line-height: 1.4; color: var(--grafite); max-width: 22ch; }
.bg-preto .figure span { color: var(--cinza-claro); }
@media (max-width: 860px) { .figures { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 32px; } }

/* ---------- K × S × AI ---------- */
.ksa { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.pillar { border-radius: 24px; padding: 32px 30px 34px; display: flex; flex-direction: column; gap: 18px; min-height: 360px; position: relative; overflow: hidden; }
.pillar .mark { height: 72px; position: relative; }
.pillar .k { font-family: var(--f-mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.pillar h3 { font-size: clamp(30px, 3vw, 42px); font-weight: 800; letter-spacing: -.045em; line-height: 1; margin: 0; }
.pillar p { margin: 0; font-size: 17px; line-height: 1.5; margin-top: auto; }
.p-k { background: var(--cobalto); color: var(--branco); }
.p-k .k { color: var(--azul-nevoa); }
.p-s { background: var(--branco); color: var(--preto); box-shadow: inset 0 0 0 2px var(--preto); }
.p-s .k { color: var(--cinza); }
.p-ai { background: var(--preto); color: var(--branco); }
.p-ai .k { color: var(--azul-claro); }
.p-ai p { color: var(--cinza-claro); }
.mark-k { display: flex; gap: 8px; align-items: flex-end; }
.mark-k .shape { width: 48px; background: var(--branco); }
.mark-k .shape:nth-child(2) { background: var(--azul-claro); }
.mark-k .shape:nth-child(3) { background: var(--azul-medio); }
.mark-s::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 3px; background: var(--preto); }
.mark-ai::before { content: ""; position: absolute; left: 0; top: 50%; width: 40px; height: 40px; margin-top: -20px; border-radius: 50%; background: var(--cobalto); }
.ksa-times { display: none; }
.ksa-note { grid-column: 1 / -1; display: flex; gap: 16px; align-items: center; font-size: clamp(20px, 2vw, 26px); font-weight: 800; letter-spacing: -.03em; line-height: 1.25; }
.ksa-note .dot { width: 14px; height: 14px; border-radius: 50%; background: var(--cobalto); flex-shrink: 0; }
@media (max-width: 980px) { .ksa { grid-template-columns: 1fr; } .pillar { min-height: 0; } .pillar p { margin-top: 0; } }

/* ---------- processo ---------- */
.process { grid-column: 1 / -1; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--gutter); position: relative; }
.process::before { content: ""; position: absolute; left: 0; right: 0; top: 23px; height: 2px; background: var(--preto); }
.process li { position: relative; display: flex; flex-direction: column; gap: 12px; }
.process .step { width: 48px; height: 48px; border-radius: 50%; background: var(--branco); box-shadow: inset 0 0 0 2px var(--preto); display: flex; align-items: center; justify-content: center; font-family: var(--f-mono); font-size: 14px; font-weight: 500; position: relative; }
.process li:last-child .step { background: var(--cobalto); color: var(--branco); box-shadow: none; }
.process h3 { font-size: 20px; font-weight: 800; letter-spacing: -.03em; margin: 8px 0 0; line-height: 1.15; }
.process p { margin: 0; font-size: 15px; line-height: 1.45; color: var(--grafite); }
@media (max-width: 980px) {
  .process { grid-template-columns: 1fr; gap: 0; }
  .process::before { left: 23px; right: auto; top: 24px; bottom: 24px; width: 2px; height: auto; }
  .process li { display: grid; grid-template-columns: 48px 1fr; column-gap: 20px; padding-bottom: 28px; }
  .process li > :not(.step) { grid-column: 2; }
  .process .step { grid-row: 1 / span 2; }
  .process h3 { margin-top: 10px; }
}

/* ---------- entregáveis ---------- */
.deliver { grid-column: 1 / span 6; list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--branco); }
.deliver li { display: grid; grid-template-columns: 40px 1fr; gap: 12px; padding: 18px 0; border-bottom: 1px solid var(--linha-escura); font-size: 19px; font-weight: 700; letter-spacing: -.015em; }
.deliver li span { font-family: var(--f-mono); font-size: 12px; font-weight: 500; color: var(--azul-medio); padding-top: 5px; }
.report { grid-column: 8 / span 5; align-self: start; background: var(--branco); color: var(--preto); border-radius: 14px; padding: 26px; display: flex; flex-direction: column; gap: 18px; box-shadow: 0 24px 60px rgba(0,0,0,.35); }
.report .r-head { display: flex; justify-content: space-between; font-family: var(--f-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--cinza); gap: 8px; }
.report .r-score { display: flex; align-items: flex-end; gap: 10px; }
.report .r-score b { font-size: 72px; font-weight: 800; letter-spacing: -.06em; line-height: .85; }
.report .r-score span { font-family: var(--f-mono); font-size: 13px; color: var(--cinza); padding-bottom: 6px; }
.bars { display: flex; flex-direction: column; gap: 10px; }
.bar { display: grid; grid-template-columns: minmax(0, 1fr) 90px 34px; gap: 10px; align-items: center; font-size: 13px; }
.bar .t { height: 8px; border-radius: 0 6px 6px 0; background: var(--nevoa); position: relative; overflow: hidden; }
.bar .t i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--azul-claro); border-radius: 0 6px 6px 0; }
.bar.hi .t i { background: var(--cobalto); }
.bar .v { font-family: var(--f-mono); font-size: 12px; text-align: right; font-variant-numeric: tabular-nums; }
.report .r-foot { font-family: var(--f-mono); font-size: 10px; color: var(--cinza); border-top: 1px solid var(--nevoa); padding-top: 10px; }
@media (max-width: 980px) { .deliver, .report { grid-column: 1 / -1; } }

/* ---------- fotografia ---------- */
.photo { border-radius: 24px; overflow: hidden; background: var(--nevoa); position: relative; }
.photo img { width: 100%; height: 100%; object-fit: cover; }
.photo .credit { position: absolute; left: 14px; bottom: 14px; font-family: var(--f-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; background: var(--preto); color: var(--branco); padding: 6px 10px; border-radius: 6px; }
.photo-arch { border-radius: 999px 999px 24px 24px; }

/* ---------- porquê / split ---------- */
.split-l { grid-column: 1 / span 6; }
.split-r { grid-column: 7 / span 6; }
.split-l5 { grid-column: 1 / span 5; }
.split-r6 { grid-column: 7 / span 6; }
@media (max-width: 860px) { .split-l, .split-r, .split-l5, .split-r6 { grid-column: 1 / -1; } }
.uses { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.uses li { background: var(--nevoa); border-radius: 16px; padding: 20px; font-size: 17px; font-weight: 700; letter-spacing: -.015em; line-height: 1.3; display: flex; flex-direction: column; gap: 22px; }
.uses li .shape { width: 26px; }
@media (max-width: 560px) { .uses { grid-template-columns: 1fr; } .uses li { flex-direction: row; align-items: center; gap: 16px; } }
.quote-block { border-left: 3px solid var(--cobalto); padding-left: 24px; }

/* ---------- CTA final ---------- */
.cta-final { position: relative; overflow: hidden; }
.cta-final .grid { align-items: end; }
.cta-final .cta-copy { grid-column: 1 / span 8; display: flex; flex-direction: column; gap: 24px; position: relative; z-index: 1; }
.cta-final .cta-side { grid-column: 10 / span 3; display: flex; flex-direction: column; gap: 14px; position: relative; z-index: 1; }
.cta-final .micro { font-size: 15px; line-height: 1.5; color: var(--azul-nevoa); margin: 0; }
.cta-final .deco { position: absolute; right: var(--margem); bottom: 0; width: 18%; max-width: 260px; pointer-events: none; }
.cta-final .deco .shape { background: var(--cobalto-escuro); width: 100%; }
.cta-final .cta-side { padding-bottom: 0; }
@media (min-width: 861px) { .cta-final { padding-bottom: calc(var(--sec) + 40px); } .cta-final .cta-side { grid-column: 9 / span 3; align-self: start; padding-top: 48px; } }
@media (max-width: 860px) { .cta-final .cta-copy, .cta-final .cta-side { grid-column: 1 / -1; } .cta-final .deco { width: 96px; right: var(--margem); top: 0; bottom: auto; transform: rotate(180deg); } }

/* ---------- páginas interiores ---------- */
.page-hero { padding-block: 88px 72px; border-bottom: 1px solid var(--nevoa); }
.page-hero .grid { align-items: end; }
.page-hero .ph-copy { grid-column: 1 / span 8; display: flex; flex-direction: column; gap: 24px; }
.page-hero .ph-art { grid-column: 10 / span 3; }
@media (max-width: 860px) { .page-hero { padding-block: 48px 48px; } .page-hero .ph-copy { grid-column: 1 / -1; } .page-hero .ph-art { grid-column: 1 / span 2; max-width: 140px; order: -1; } }
.breadcrumb { font-family: var(--f-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--cinza); display: flex; gap: 8px; }
.breadcrumb a { text-decoration: none; color: var(--cinza); }
.breadcrumb a:hover { color: var(--preto); }

/* sobre: valores e manifesto */
.manifesto { display: flex; flex-direction: column; gap: 6px; }
.manifesto span { font-size: clamp(28px, 3.4vw, 48px); font-weight: 800; letter-spacing: -.045em; line-height: 1.08; color: var(--cinza-claro); }
.manifesto span:last-child { color: var(--branco); }
.manifesto span:last-child em { font-style: normal; color: var(--azul-medio); }
.timeline { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); }
.tl { border-top: 2px solid var(--preto); padding-top: 18px; display: flex; flex-direction: column; gap: 10px; }
.tl .y { font-family: var(--f-mono); font-size: 13px; color: var(--cobalto-escuro); }
.tl h3 { font-size: 26px; font-weight: 800; letter-spacing: -.035em; margin: 0; line-height: 1.1; }
.tl p { margin: 0; font-size: 16px; color: var(--grafite); }
@media (max-width: 860px) { .timeline { grid-template-columns: 1fr; } }
.purpose { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.purpose > div { border-radius: 24px; padding: 36px; display: flex; flex-direction: column; gap: 16px; }
.purpose .pp { background: var(--preto); color: var(--branco); }
.purpose .am { background: var(--cobalto); color: var(--branco); }
.purpose p { margin: 0; font-size: clamp(24px, 2.4vw, 34px); font-weight: 800; letter-spacing: -.035em; line-height: 1.12; }
@media (max-width: 860px) { .purpose { grid-template-columns: 1fr; } .purpose > div { padding: 26px; } }
.humor { grid-column: 1 / -1; text-align: left; font-size: clamp(34px, 5vw, 76px); font-weight: 800; letter-spacing: -.05em; line-height: 1; margin: 0; text-wrap: balance; }
.humor em { font-style: normal; color: var(--cobalto); }

/* ---------- formulário ---------- */
.form-card { grid-column: 7 / span 6; background: var(--branco); color: var(--preto); border-radius: 28px; padding: 40px; display: flex; flex-direction: column; gap: 20px; box-shadow: 0 1px 0 var(--nevoa), 0 24px 60px rgba(11,12,14,.08); border: 1px solid var(--nevoa); }
.form-copy { grid-column: 1 / span 5; display: flex; flex-direction: column; gap: 24px; }
@media (max-width: 980px) { .form-card, .form-copy { grid-column: 1 / -1; } .form-card { padding: 26px 20px; border-radius: 20px; } }
.field { display: flex; flex-direction: column; gap: 8px; }
.field label, .field legend { font-size: 14px; font-weight: 700; }
.field .req { font-family: var(--f-mono); font-size: 11px; font-weight: 400; color: var(--cinza); margin-left: 6px; }
.field input, .field textarea { font: inherit; font-size: 16px; padding: 14px 16px; border-radius: 12px; border: 1.5px solid var(--cinza-claro); background: var(--branco); color: var(--preto); width: 100%; transition: border-color .15s, box-shadow .15s; }
.field textarea { min-height: 120px; resize: vertical; }
.field input:focus, .field textarea:focus { outline: none; border-color: var(--cobalto); box-shadow: 0 0 0 4px var(--azul-nevoa); }
.field .err { font-size: 13px; color: #B23A0E; display: none; }
.field.invalid input { border-color: #FF6B35; }
.field.invalid .err { display: block; }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 560px) { .row2 { grid-template-columns: 1fr; } }
fieldset.field { border: 0; padding: 0; margin: 0; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { position: relative; }
.field .chip input { position: absolute; left: 0; top: 0; width: 1px; height: 1px; padding: 0; opacity: 0; pointer-events: none; }
.chip span { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 999px; box-shadow: inset 0 0 0 1.5px var(--cinza-claro); font-size: 14px; font-weight: 500; cursor: pointer; transition: all .15s; }
.chip input:checked + span { background: var(--preto); color: var(--branco); box-shadow: none; }
.chip input:focus-visible + span { outline: 3px solid var(--cobalto); outline-offset: 2px; }
.consent span { font-weight: 400; }
.consent { display: grid; grid-template-columns: 22px 1fr; gap: 12px; font-size: 14px; line-height: 1.45; color: var(--grafite); align-items: start; }
.consent input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--cobalto); }
.form-done { display: none; flex-direction: column; gap: 16px; align-items: flex-start; padding: 12px 0; }
.form-done .symbol { width: 72px; }
.sent .form-fields { display: none; }
.sent .form-done { display: flex; }

/* ---------- rodapé ---------- */
.site-footer { background: var(--preto); color: var(--branco); padding-block: 72px 40px; }
.site-footer .grid { row-gap: 48px; }
.f-brand { grid-column: 1 / span 5; display: flex; flex-direction: column; gap: 14px; }
.f-brand .wordmark { font-size: clamp(40px, 5vw, 64px); }
.f-brand p { margin: 0; color: var(--cinza-claro); font-size: 16px; }
.f-col { grid-column: span 2; display: flex; flex-direction: column; gap: 10px; font-size: 15px; }
.f-col:first-of-type { grid-column: 8 / span 2; }
.f-col a { color: var(--cinza-claro); text-decoration: none; }
.f-col a:hover { color: var(--branco); }
.f-col .label { color: var(--cinza); margin-bottom: 6px; }
.f-legal { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-top: 24px; border-top: 1px solid var(--linha-escura); font-family: var(--f-mono); font-size: 12px; color: var(--cinza); }
.tbc { font-family: var(--f-mono); font-size: 11px; color: var(--cinza); }
@media (max-width: 860px) { .f-brand { grid-column: 1 / -1; } .f-col, .f-col:first-of-type { grid-column: span 4; } }
@media (max-width: 560px) { .f-col, .f-col:first-of-type { grid-column: span 2; } .site-footer { padding-block: 56px calc(104px + env(safe-area-inset-bottom, 0px)); } }

/* ---------- CTA persistente (telemóvel) ---------- */
.sticky-cta { display: none; }
@media (max-width: 560px) {
  .sticky-cta { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); background: linear-gradient(to top, rgba(255,255,255,1) 70%, rgba(255,255,255,0)); transition: transform .25s; }
  .sticky-cta .btn { width: 100%; }
  .sticky-cta.hide { transform: translateY(110%); }
  .menu-open .sticky-cta { display: none; }
}

/* entrada suave, a partir de um estado visível */
@media (prefers-reduced-motion: no-preference) {
  .rise { animation: rise .7s cubic-bezier(.2,.7,.2,1) both; }
  .rise.d1 { animation-delay: .08s; } .rise.d2 { animation-delay: .16s; } .rise.d3 { animation-delay: .24s; }
  @keyframes rise { from { transform: translateY(14px); } to { transform: none; opacity: 1; } }
  .mosaic > * { animation: pop .6s cubic-bezier(.2,.7,.2,1) both; }
  .mosaic > *:nth-child(2) { animation-delay: .05s; } .mosaic > *:nth-child(3) { animation-delay: .1s; } .mosaic > *:nth-child(4) { animation-delay: .15s; } .mosaic > *:nth-child(5) { animation-delay: .2s; } .mosaic > *:nth-child(6) { animation-delay: .25s; } .mosaic > *:nth-child(7) { animation-delay: .3s; } .mosaic > *:nth-child(8) { animation-delay: .35s; } .mosaic > *:nth-child(9) { animation-delay: .4s; }
  @keyframes pop { from { transform: scale(.6); } to { transform: none; } }
}

/* =====================================================================
   v2.2 — website 100% gráfico: composições e animações dos assets da marca
   ===================================================================== */
.hero .display { font-size: clamp(48px, 7.4vw, 112px); max-width: 11ch; }
.hero { padding-block: 88px 104px; }
@media (max-width: 860px) { .hero { padding-block: 40px 64px; } }

/* hero da Homepage: mosaico com movimento subtil */
@media (prefers-reduced-motion: no-preference) {
  .morph { animation: morph 14s ease-in-out infinite; }
  .morph.m2 { animation-delay: -4.6s; }
  .morph.m3 { animation-delay: -9.2s; }
  @keyframes morph {
    0%, 16%  { border-radius: 999px 999px 0 0; }
    20%, 36% { border-radius: 23%; }
    40%, 56% { border-radius: 50% 50% 50% 0; }
    60%, 76% { border-radius: 100% 0 0 0; }
    80%, 96% { border-radius: 50% 0; }
    100%     { border-radius: 999px 999px 0 0; }
  }
  .drift { animation: drift 9s ease-in-out infinite alternate; }
  @keyframes drift { from { transform: translateY(-4%); } to { transform: translateY(4%); } }
  .spin { animation: spin 24s linear infinite; }
  @keyframes spin { from { transform: rotate(45deg) scale(.72); } to { transform: rotate(405deg) scale(.72); } }
  .symbol.live::after { animation: dotslide 7s ease-in-out infinite; }
  @keyframes dotslide { 0%, 100% { left: 66%; } 45%, 55% { left: 34%; } }
}

/* O Diagnóstico: visualização do produto no hero */
.score-card { background: var(--preto); color: var(--branco); border-radius: 24px; padding: 22px; display: flex; flex-direction: column; gap: 16px; }
.score-card .sc-head { display: flex; justify-content: space-between; gap: 8px; font-family: var(--f-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--cinza-claro); }
.ring { --v: 68; width: 100%; aspect-ratio: 1 / 1; border-radius: 50%; background: conic-gradient(var(--cobalto) calc(var(--v) * 1%), #262A31 0); display: flex; align-items: center; justify-content: center; position: relative; }
.ring::before { content: ""; position: absolute; inset: 11%; border-radius: 50%; background: var(--preto); }
.ring b { position: relative; font-size: clamp(48px, 5.4vw, 80px); font-weight: 800; letter-spacing: -.06em; line-height: 1; }
.ring small { position: relative; font-family: var(--f-mono); font-size: 13px; color: var(--cinza-claro); margin-left: 4px; align-self: center; padding-top: 18px; }
.score-card .sc-foot { font-family: var(--f-mono); font-size: 10px; color: var(--cinza-claro); border-top: 1px solid var(--linha-escura); padding-top: 10px; }
@media (max-width: 860px) { .page-hero .ph-art.wide { grid-column: 1 / -1; max-width: 300px; width: 100%; } }
.demo-tag { display: inline-flex; align-items: center; gap: 8px; font-family: var(--f-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--cobalto-escuro); background: var(--azul-nevoa); padding: 6px 10px; border-radius: 6px; }

/* faixa de ligação entre páginas */
.link-band { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; padding: 26px 30px; border-radius: 20px; background: var(--nevoa); }
.link-band p { margin: 0; font-size: clamp(20px, 2vw, 26px); font-weight: 800; letter-spacing: -.03em; line-height: 1.2; max-width: 36ch; }

/* O Método: animação Knowledge × Strategy × AI */
.ksa-anim { display: flex; flex-direction: column; gap: 14px; }
.ka-stage { position: relative; width: 100%; aspect-ratio: 1 / 1; }
.ka-shape { position: absolute; inset: 0; background: var(--cobalto); border-radius: 23%; }
.ka-line { position: absolute; left: 0; right: 0; top: 50%; height: 2.4%; margin-top: -1.2%; background: var(--branco); transform-origin: 0 50%; }
.ka-dot { position: absolute; left: 66%; top: 50%; width: 20%; height: 20%; transform: translate(-50%, -50%); border-radius: 50%; background: var(--preto); }
.ka-legend { display: flex; justify-content: space-between; gap: 6px; font-family: var(--f-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--cinza); }
.ka-legend span { display: inline-flex; align-items: center; gap: 6px; }
.ka-legend span::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.ka-legend .lk { color: var(--cobalto); } .ka-legend .ls { color: var(--grafite); } .ka-legend .la { color: var(--preto); }
@media (prefers-reduced-motion: no-preference) {
  .ka-shape { animation: morph 12s ease-in-out infinite; }
  .ka-line { animation: drawline 12s ease-in-out infinite; }
  .ka-dot { animation: dotin 12s ease-in-out infinite; }
  @keyframes drawline { 0%, 8% { transform: scaleX(0); } 22%, 92% { transform: scaleX(1); } 100% { transform: scaleX(0); } }
  @keyframes dotin { 0%, 18% { left: 0%; transform: translate(-50%, -50%) scale(0); } 34%, 92% { left: 66%; transform: translate(-50%, -50%) scale(1); } 100% { left: 66%; transform: translate(-50%, -50%) scale(0); } }
}
.criteria { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.crit { border-radius: 24px; padding: 30px; display: flex; flex-direction: column; gap: 14px; min-height: 280px; }
.crit .y { font-family: var(--f-mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.crit h3 { font-size: clamp(34px, 3.4vw, 48px); font-weight: 800; letter-spacing: -.05em; line-height: 1; margin: 0; }
.crit p { margin: 0; margin-top: auto; font-size: 16px; line-height: 1.5; }
.crit .ci { width: 44px; height: 44px; position: relative; }
.c1 { background: var(--nevoa); } .c1 .y { color: var(--cobalto-escuro); }
.c1 .ci { border-radius: 50%; box-shadow: inset 0 0 0 3px var(--preto); }
.c2 { background: var(--nevoa); } .c2 .y { color: var(--cobalto-escuro); }
.c2 .ci { border-radius: 50%; background: linear-gradient(90deg, var(--preto) 50%, transparent 50%); box-shadow: inset 0 0 0 3px var(--preto); }
.c3 { background: var(--preto); color: var(--branco); } .c3 .y { color: var(--azul-claro); } .c3 p { color: var(--cinza-claro); }
.c3 .ci { border-radius: 50%; background: var(--cobalto); }
.c1 p, .c2 p { color: var(--grafite); }
@media (max-width: 860px) { .criteria { grid-template-columns: 1fr; } .crit { min-height: 0; } .crit p { margin-top: 0; } }

/* Sobre nós: composição editorial de formas */
.compo { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; width: 100%; }
.compo > * { width: 100%; }
.compo .wide2 { grid-column: span 2; }
.compo .line-tile { aspect-ratio: 1 / 1; position: relative; }
.compo .line-tile::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 3px; background: var(--preto); }
.compo .dot-tile { aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; }
.compo .dot-tile::before { content: ""; width: 40%; height: 40%; border-radius: 50%; background: var(--cobalto); }
.cred { background: var(--branco); border-radius: 24px; padding: 32px; display: flex; flex-direction: column; gap: 14px; }

/* Contacto: composição mínima */
.mini-compo { display: flex; gap: 8px; align-items: flex-end; }
.mini-compo > * { width: 40px; }

/* Homepage: fecho curto */
.closing .grid { align-items: center; }
.closing .c-copy { grid-column: 1 / span 7; display: flex; flex-direction: column; gap: 18px; }
.closing .c-act { grid-column: 9 / span 4; justify-self: end; }
@media (max-width: 860px) { .closing .c-copy, .closing .c-act { grid-column: 1 / -1; justify-self: start; } }
.consent a { color: var(--cobalto); }
.form-copy .display { font-size: clamp(40px, 4.8vw, 68px); }
@media (max-width: 860px) { .page-hero .ph-art.wide { order: 1; max-width: 240px; } }
@media (min-width: 861px) { .cta-final .deco { width: 13%; max-width: 190px; } }

/* ===================== v2.3 ===================== */
/* O Diagnóstico: hero cabe no primeiro ecrã em desktop (inclui portáteis baixos) */
@media (min-width: 861px) {
  .page-hero.hero-fit { padding-block: clamp(28px, 5vh, 72px) clamp(28px, 5vh, 64px); min-height: calc(100vh - 76px); min-height: calc(100svh - 76px); display: flex; align-items: center; box-sizing: border-box; }
  .page-hero.hero-fit > .wrap { width: 100%; }
  .page-hero.hero-fit .grid { align-items: center; }
  .page-hero.hero-fit .ph-copy { gap: clamp(14px, 2.4vh, 24px); }
  .page-hero.hero-fit .display { font-size: clamp(40px, min(6.2vw, 8.6vh), 92px); line-height: .98; }
  .page-hero.hero-fit .lead { font-size: clamp(16px, min(1.5vw, 2.4vh), 22px); }
  .page-hero.hero-fit .ph-art.wide { grid-column: 9 / span 4; justify-self: end; width: 100%; max-width: min(340px, calc(100vh - 260px)); }
  .page-hero.hero-fit .score-card { gap: clamp(10px, 1.6vh, 16px); padding: clamp(16px, 2.4vh, 22px); }
}
.ring b { font-variant-numeric: tabular-nums; min-width: 2ch; text-align: center; }

/* O Diagnóstico: lista «Quando pode ser útil» */
.when { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; border-top: 2px solid var(--preto); }
.when li { display: grid; grid-template-columns: 28px 1fr; gap: 20px; align-items: center; padding: 22px 0; border-bottom: 1px solid var(--cinza-claro); font-size: clamp(19px, 1.7vw, 24px); font-weight: 700; letter-spacing: -.02em; line-height: 1.3; }
.when li .shape { width: 28px; }
.when li .s-pilula, .when li .s-semi { align-self: center; }
@media (max-width: 560px) { .when li { grid-template-columns: 22px 1fr; gap: 14px; padding: 18px 0; } .when li .shape { width: 22px; } }

/* ===================== v2.4 — legal, cookies, redes ===================== */
[hidden] { display: none !important; }
.f-col:first-of-type { grid-column: 7 / span 2; }
@media (max-width: 860px) { .f-col:first-of-type { grid-column: span 4; } }
@media (max-width: 560px) { .f-col:first-of-type { grid-column: span 2; } }
.f-btn { background: none; border: 0; padding: 0; font: inherit; font-size: 15px; color: var(--cinza-claro); text-align: left; cursor: pointer; }
.f-btn:hover { color: var(--branco); }
.social-row { padding-top: 8px; }

/* páginas legais */
.legal .grid { align-items: start; }
.legal-toc { grid-column: 1 / span 3; position: sticky; top: calc(96px + env(safe-area-inset-top, 0px)); display: flex; flex-direction: column; gap: 12px; }
.legal-toc ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; border-left: 2px solid var(--nevoa); }
.legal-toc a { display: block; padding: 6px 0 6px 14px; margin-left: -2px; border-left: 2px solid transparent; font-size: 14px; color: var(--grafite); text-decoration: none; }
.legal-toc a:hover { color: var(--preto); border-left-color: var(--cobalto); }
.legal-body { grid-column: 5 / span 7; max-width: 72ch; }
.legal-body h2 { font-size: 24px; font-weight: 800; letter-spacing: -.03em; line-height: 1.2; margin: 48px 0 12px; scroll-margin-top: 96px; }
.legal-body h2:first-child { margin-top: 0; }
.legal-body p, .legal-body li { font-size: 17px; line-height: 1.65; color: var(--grafite); }
.legal-body p { margin: 0 0 14px; }
.legal-body ul { margin: 0 0 14px; padding-left: 20px; }
.legal-body li { margin-bottom: 8px; }
.legal-body li::marker { color: var(--cobalto); }
.legal-body b { color: var(--preto); }
.legal-body code { font-family: var(--f-mono); font-size: 14px; background: var(--nevoa); padding: 2px 6px; border-radius: 4px; color: var(--preto); }
.table-scroll { overflow-x: auto; margin: 0 0 16px; }
.legal-table { width: 100%; border-collapse: collapse; font-size: 15px; margin: 0 0 16px; }
.table-scroll .legal-table { margin: 0; min-width: 620px; }
.legal-table th { text-align: left; font-family: var(--f-mono); font-size: 11px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--cinza); padding: 10px 12px 10px 0; border-bottom: 2px solid var(--preto); }
.legal-table td { padding: 12px 12px 12px 0; border-bottom: 1px solid var(--nevoa); vertical-align: top; line-height: 1.5; color: var(--grafite); }
.cfg-missing { background: #FFE9DF; color: #B23A0E; padding: 0 4px; border-radius: 4px; font-weight: 600; }
@media (max-width: 860px) { .legal-toc { display: none; } .legal-body { grid-column: 1 / -1; } }

/* aviso de cookies */
.cookie-banner { position: fixed; left: 24px; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); z-index: 60; width: min(440px, calc(100vw - 32px)); }
.consent-in { background: var(--preto); color: var(--branco); border-radius: 20px; padding: 24px; display: flex; flex-direction: column; gap: 14px; box-shadow: 0 24px 60px rgba(11,12,14,.35); position: relative; }
.consent-mark { position: absolute; right: 22px; top: 22px; width: 14px; height: 14px; border-radius: 50%; background: var(--cobalto); }
.cookie-banner h2 { margin: 0; font-size: 22px; font-weight: 800; letter-spacing: -.03em; line-height: 1.15; padding-right: 28px; }
.cookie-banner p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--cinza-claro); }
.cookie-banner p a { color: var(--azul-medio); font-weight: 700; }
.consent-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.consent-actions .btn { min-height: 44px; padding: 0 14px; font-size: 14px; }
.consent-actions [data-c="reject"] { background: var(--branco); color: var(--preto); box-shadow: none; }
.consent-actions [data-c="reject"]:hover { background: var(--nevoa); color: var(--preto); }
.consent-actions [data-c="custom"], .consent-actions [data-c="save"] { grid-column: 1 / -1; }
.consent-actions [data-c="custom"] { order: 3; min-height: 36px; box-shadow: none; text-decoration: underline; text-underline-offset: 4px; }
.cookie-banner .btn-secondary { color: var(--branco); box-shadow: inset 0 0 0 2px var(--branco); }
.cookie-banner .btn-secondary:hover { background: var(--branco); color: var(--preto); }
.consent-prefs { display: flex; flex-direction: column; gap: 8px; }
.pref { display: flex; justify-content: space-between; align-items: center; gap: 14px; background: #15181D; border-radius: 12px; padding: 12px 14px; cursor: pointer; }
.pref span { display: flex; flex-direction: column; gap: 2px; font-size: 14px; }
.pref small { font-size: 12px; color: var(--cinza-claro); }
.pref input { width: 20px; height: 20px; accent-color: var(--cobalto); flex-shrink: 0; }
@media (max-width: 560px) { .cookie-banner { left: 16px; right: 16px; width: auto; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); } .consent-in { padding: 20px; } .consent-open .sticky-cta { display: none; } }
.cookie-banner .consent-actions [data-c="custom"] { box-shadow: none; }

/* ===================== v2.5 — Sobre nós ===================== */
.origin .grid { align-items: start; }
.origin-text { display: flex; flex-direction: column; gap: 22px; padding-top: 34px; }
.origin-text .body { font-size: clamp(17px, 1.4vw, 20px); line-height: 1.6; max-width: 56ch; }
.origin-key { margin: 6px 0; padding-left: 22px; border-left: 3px solid var(--cobalto); font-size: clamp(22px, 2.1vw, 30px); font-weight: 800; letter-spacing: -.03em; line-height: 1.2; color: var(--preto); max-width: 30ch; text-wrap: balance; }
@media (max-width: 860px) { .origin-text { padding-top: 0; gap: 18px; } }

/* ===================== v2.6 — alinhamento com Brand Book v2.1 ===================== */
.promise { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 14px; padding-bottom: 12px; max-width: 60ch; }
/* Origem · percurso habitual, com a etapa onde começamos em destaque */
/* Duas linhas: título | texto, e depois gráfico | cartão, com alturas iguais */
.origin .origin-grid { row-gap: 40px; align-items: stretch; }
.origin-grid .origin-text { padding-top: 34px; }
.origin-card { background: var(--preto); color: var(--branco); border-radius: 24px; padding: 32px 36px; display: flex; flex-direction: column; justify-content: space-between; gap: 32px; }
.origin-card .origin-key { margin: 0; padding-left: 22px; color: var(--branco); font-size: clamp(26px, 2.6vw, 38px); line-height: 1.15; max-width: 22ch; }
.origin-card .origin-end { margin: 0; font-size: clamp(17px, 1.4vw, 20px); line-height: 1.55; color: var(--cinza-claro); max-width: 46ch; border-top: 1px solid var(--linha-escura); padding-top: 22px; }
.origin-card .origin-end b { color: var(--branco); font-weight: 700; }
@media (max-width: 860px) { .origin-grid .origin-text { padding-top: 0; } .origin-card { padding: 26px; } }
.origin-art { margin: 0; background: var(--nevoa); border-radius: 24px; padding: 24px; }
.oa-cap { font-family: var(--f-mono); font-size: 12px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--cinza); margin-bottom: 16px; }
.oa-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; position: relative; }
.oa-steps::before { content: ""; position: absolute; left: 39px; top: 40px; bottom: 26px; border-left: 2px dashed var(--cinza-claro); }
.oa-steps li { position: relative; display: flex; align-items: center; gap: 18px; background: var(--branco); border-radius: 16px; padding: 14px 18px 14px 20px; }
.oa-steps .shape { width: 38px; flex-shrink: 0; background: var(--cinza-claro); }
.oa-steps .s-pilula { width: 38px; }
.oa-txt { display: flex; flex-direction: column; gap: 2px; }
.oa-txt b { font-size: 17px; font-weight: 700; letter-spacing: -.015em; color: var(--grafite); }
.oa-txt small { font-size: 14px; line-height: 1.4; color: var(--azul-nevoa); }
.oa-steps .oa-here { background: var(--cobalto); padding-block: 20px; }
.oa-steps .oa-here .shape { background: var(--branco); }
.oa-steps .oa-here b { color: var(--branco); font-size: 20px; }
@media (max-width: 560px) { .origin-art { padding: 18px; border-radius: 20px; } .oa-steps .shape { width: 30px; } .oa-steps::before { left: 35px; } .oa-txt b { font-size: 16px; } .oa-steps .oa-here b { font-size: 18px; } }

/* Origem e promessa seguidas: uma só margem entre as duas, com um filete a separar */
.section.origin { padding-bottom: calc(var(--sec) * 0.5); }
.section.origin + .section.tight { padding-top: 0; }
.section.origin + .section.tight .wrap.grid::before { content: ""; grid-column: 1 / -1; border-top: 1px solid var(--nevoa); margin-bottom: calc(var(--sec) * 0.5 - 40px); }
.promise .lead { color: var(--preto); font-weight: 500; }

/* Revisão 27 out 2026 · oferta única */
.deliver li div { display: flex; flex-direction: column; gap: 4px; }
.deliver li small { font-size: 15px; font-weight: 400; letter-spacing: 0; line-height: 1.45; color: var(--cinza-claro); }
.deliver-session { grid-column: 1 / -1; display: flex; gap: 14px; align-items: center; margin: 0; font-size: 17px; line-height: 1.45; color: var(--cinza-claro); }
.deliver-session .dot { width: 10px; height: 10px; border-radius: 50%; background: var(--azul-medio); flex-shrink: 0; }
.needs-lead { max-width: 52ch; }
.dims.needs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dims.needs .dim { min-height: 280px; }
.dims.needs .dim h3 { margin-bottom: 10px; }
.needs-note { grid-column: 1 / -1; display: flex; gap: 14px; align-items: flex-start; margin: 0; padding: 20px 24px; border-radius: 20px; background: var(--azul-nevoa); font-size: 17px; line-height: 1.5; color: var(--grafite); }
.needs-note b { color: var(--preto); }
.needs-note .dot { width: 10px; height: 10px; border-radius: 50%; background: var(--cobalto); flex-shrink: 0; margin-top: 8px; }
.process.process-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.indep { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 2fr; gap: 12px; }
.indep > div { border-radius: 24px; padding: 32px 34px; display: flex; flex-direction: column; gap: 16px; }
.indep-not { box-shadow: inset 0 0 0 1.5px var(--linha-escura); }
.indep-not p { margin: 0; font-size: clamp(24px, 2.4vw, 34px); font-weight: 800; letter-spacing: -.035em; line-height: 1.12; color: var(--branco); }
.indep-yes { background: var(--cobalto); }
.indep-yes .label { color: var(--azul-nevoa); }
.indep-yes .label::before { background: var(--branco); }
.indep-yes p { margin: 0; font-size: clamp(19px, 1.7vw, 24px); font-weight: 700; letter-spacing: -.02em; line-height: 1.35; color: var(--branco); }
@media (max-width: 1180px) { .dims.needs { grid-template-columns: repeat(2, minmax(0, 1fr)); } .process.process-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 860px) { .indep { grid-template-columns: 1fr; } .indep > div { padding: 26px; } }
@media (max-width: 560px) { .dims.needs { grid-template-columns: 1fr; } .dims.needs .dim { min-height: 0; } .needs-note { padding: 16px 18px; font-size: 16px; } .process.process-4 { grid-template-columns: 1fr; } }

/* Homepage · problema → resposta → como avançamos → conversa */
/* Homepage · revisão: problema → resposta → em resumo → conversa */
.hq-head { grid-column: 1 / -1; padding-top: 24px; }
.hq { grid-column: 1 / -1; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 48px; border-top: 1px solid var(--linha-escura); }
.hq li { display: grid; grid-template-columns: 34px 1fr; align-items: start; gap: 14px; padding: 20px 0; border-bottom: 1px solid var(--linha-escura); font-size: clamp(18px, 1.6vw, 22px); font-weight: 700; letter-spacing: -.02em; line-height: 1.3; color: var(--branco); }
.hq li::before { content: "?"; width: 30px; height: 30px; border-radius: 50%; background: var(--cobalto); color: var(--branco); display: grid; place-items: center; font-size: 15px; font-weight: 800; margin-top: -1px; }
.hr3 { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.hr-card { border-radius: 24px; padding: 28px 28px 30px; display: flex; flex-direction: column; justify-content: space-between; gap: 56px; min-height: 260px; }
.hr-card .shape { width: 46px; }
.hr-card h3 { font-size: clamp(26px, 2.4vw, 34px); font-weight: 800; letter-spacing: -.035em; line-height: 1.05; margin: 0 0 10px; }
.hr-card p { margin: 0; font-size: 16px; line-height: 1.45; }
.hr-k { background: var(--preto); color: var(--branco); }
.hr-k .shape { background: var(--branco); }
.hr-k p { color: var(--cinza-claro); }
.hr-s { background: var(--cobalto); color: var(--branco); }
.hr-s .shape { background: var(--preto); }
.hr-s p { color: var(--azul-nevoa); }
.hr-a { background: var(--azul-nevoa); }
.hr-a .shape { background: var(--cobalto); }
.hr-a p { color: var(--grafite); }
.hr-foot { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; border-top: 2px solid var(--preto); padding-top: 24px; }
.hr-foot p { margin: 0; font-size: clamp(20px, 2vw, 26px); font-weight: 500; letter-spacing: -.02em; line-height: 1.25; color: var(--grafite); }
.hr-foot b { color: var(--preto); font-weight: 800; }
@media (max-width: 860px) { .hq { grid-template-columns: 1fr; } .hr3 { grid-template-columns: 1fr; } .hr-card { min-height: 0; gap: 28px; } }
.hr-card { min-height: 240px; }
.hq { border-top-color: var(--linha-escura); }
.hp { grid-column: 1 / -1; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; counter-reset: none; }
.hp li { background: var(--branco); border-radius: 20px; padding: 24px 24px 28px; display: flex; flex-direction: column; gap: 10px; position: relative; }
.hp li:not(:last-child)::after { content: "→"; position: absolute; right: -11px; top: 34px; transform: translateX(50%); width: 28px; height: 28px; border-radius: 50%; background: var(--nevoa); color: var(--cobalto); display: grid; place-items: center; font-weight: 700; z-index: 1; }
.hp .n { width: 40px; height: 40px; border-radius: 50%; box-shadow: inset 0 0 0 2px var(--preto); display: grid; place-items: center; font-family: var(--f-mono); font-size: 13px; font-weight: 500; margin-bottom: 18px; }
.hp .hp-last .n { background: var(--cobalto); color: var(--branco); box-shadow: none; }
.hp h3 { margin: 0; font-size: 21px; font-weight: 800; letter-spacing: -.03em; line-height: 1.15; }
.hp p { margin: 0; font-size: 15px; line-height: 1.45; color: var(--grafite); }
.hp-time { grid-column: 1 / -1; display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; background: var(--preto); color: var(--branco); border-radius: 20px; padding: 22px 28px; }
.hp-time b { font-size: clamp(28px, 3vw, 42px); font-weight: 800; letter-spacing: -.04em; line-height: 1; }
.hp-time span { font-size: 17px; color: var(--cinza-claro); }
@media (max-width: 1180px) { .hp { grid-template-columns: repeat(2, minmax(0, 1fr)); } .hp li:nth-child(2)::after { display: none; } }
@media (max-width: 560px) { .hp { grid-template-columns: 1fr; gap: 8px; } .hp li::after { display: none !important; } .hp .n { margin-bottom: 6px; } .hp-time { padding: 18px 20px; } }
.hq-say li { font-weight: 600; }
.hq-say li::before { content: "\201C"; font-size: 26px; line-height: 1; padding-top: 9px; }
.hq-end { grid-column: 1 / -1; margin: 0; font-size: clamp(18px, 1.6vw, 22px); line-height: 1.4; color: var(--cinza-claro); }
.hq-end b { color: var(--branco); }

/* ===================== v2.7 — hero: Knowledge × Strategy × AI → Insight ===================== */
/* As oito fontes de conhecimento (formas) alinham-se na linha estratégica, o ponto (IA) lê-as
   e uma delas cresce até ser o símbolo: o insight. Fases: k → s → a → i (assets/site.js). */
.hero-art { aspect-ratio: auto; }
.ksai { display: flex; flex-direction: column; gap: 14px; width: 100%; }
.kx-stage { position: relative; width: 100%; aspect-ratio: 1 / 1; --ease: cubic-bezier(.65,0,.35,1); --br: 50% 0; }
.kx { position: absolute; left: var(--x, var(--sx)); top: var(--y, 50%); width: var(--w, 7.6%); aspect-ratio: 1 / 1; background: var(--c, var(--azul-claro)); border-radius: var(--f); transform: translate(-50%, -50%) rotate(var(--r, 0deg)) scale(calc(var(--k, 1) * var(--ks, 1))); opacity: var(--o, 1); z-index: 1;
  transition: left .9s var(--ease), top .9s var(--ease), width .9s var(--ease), transform .9s var(--ease), background-color .45s ease var(--d, 0s), opacity .5s ease, border-radius .6s ease; }
.f-quadrado { --f: 23%; } .f-arco { --f: 999px 999px 0 0; } .f-quarto { --f: 100% 0 0 0; } .f-folha { --f: 50% 0; } .f-gota { --f: 50% 50% 50% 0; }
.f-pilula { --f: 999px; aspect-ratio: 2 / 1; } .f-semi { --f: 999px 999px 0 0; aspect-ratio: 2 / 1; }
.f-losango { --f: 14%; --r: 45deg; --ks: .72; }
/* posições por omissão (o JS baralha a cada ciclo) */
.kx:nth-child(2) { --gx: 17%; --gy: 17%; --kc: var(--cobalto); --sx: 7.5%; }
.kx:nth-child(3) { --gx: 50%; --gy: 17%; --kc: var(--preto); --sx: 18.13%; }
.kx:nth-child(4) { --gx: 83%; --gy: 17%; --kc: var(--azul-claro); --sx: 28.75%; }
.kx:nth-child(5) { --gx: 17%; --gy: 50%; --kc: var(--preto); --sx: 39.38%; }
.kx:nth-child(6) { --gx: 50%; --gy: 50%; --kc: var(--azul-medio); --sx: 50.0%; }
.kx:nth-child(7) { --gx: 83%; --gy: 50%; --kc: var(--cobalto); --sx: 60.63%; }
.kx:nth-child(8) { --gx: 17%; --gy: 83%; --kc: var(--cobalto-escuro); --sx: 71.25%; }
.kx:nth-child(9) { --gx: 50%; --gy: 83%; --kc: var(--azul-claro); --sx: 81.88%; }
.kx:nth-child(10) { --gx: 83%; --gy: 83%; --kc: var(--preto); --sx: 92.5%; }
/* k · Knowledge: as fontes, dispersas */
.ksai[data-phase="k"] .kx { --x: var(--gx); --y: var(--gy); --w: 25%; --c: var(--kc); --d: 0s; }
/* em constante evolução: as fontes flutuam, algumas mudam de forma e trocam de lugar (site.js) */
@media (prefers-reduced-motion: no-preference) {
  .ksai[data-phase="k"] .kx { animation: kxdrift var(--dd, 3.4s) ease-in-out var(--ad, 0s) infinite alternate, kxmorph 3.6s ease-in-out var(--ad, 0s) infinite; }
}
@keyframes kxdrift { from { translate: -7% -5%; } to { translate: 7% 6%; } }
@keyframes kxmorph { 0%, 30% { border-radius: var(--f); } 50%, 80% { border-radius: var(--f2, var(--f)); } 100% { border-radius: var(--f); } }
/* s · Strategy: alinhadas na linha */
.ksai[data-phase="s"] .kx { --c: var(--preto); --d: 0s; }
/* a · AI: o ponto percorre a linha e lê cada forma; uma fica em destaque */
.ksai[data-phase="a"] .kx { --c: var(--azul-claro); --d: var(--rd, 0s); }
.ksai[data-phase="a"] .kx[data-key] { --c: var(--cobalto); --d: 2.05s; }
/* i · Insight: a forma em destaque torna-se o símbolo */
.ksai[data-phase="i"] .kx { --k: 0; --o: 0; }
.kx-body { position: absolute; left: var(--bx, 71.25%); top: 50%; width: 7.6%; aspect-ratio: 1 / 1; border-radius: var(--br); background: var(--cobalto); transform: translate(-50%, -50%); opacity: 0; z-index: 1;
  transition: left 1s var(--ease), width 1s var(--ease), background-color .7s ease, opacity .3s ease; }
.ksai[data-phase="i"] .kx-body { left: 50%; width: 82%; background: var(--preto); opacity: 1; }
.kx-line { position: absolute; left: 0; width: 100%; top: 50%; height: .7%; min-height: 2px; background: var(--preto); transform: translateY(-50%) scaleX(0); transform-origin: 0 50%; z-index: 2;
  transition: transform .9s var(--ease), left 1s var(--ease), width 1s var(--ease), height 1s var(--ease), background-color .5s ease .25s; }
.ksai[data-phase="s"] .kx-line, .ksai[data-phase="a"] .kx-line { transform: translateY(-50%) scaleX(1); }
.ksai[data-phase="i"] .kx-line { transform: translateY(-50%) scaleX(1); left: 9%; width: 82%; height: 2.4%; background: var(--branco); }
.kx-dot { position: absolute; left: 2%; top: 50%; width: 5.5%; aspect-ratio: 1 / 1; border-radius: 50%; background: var(--cobalto); transform: translate(-50%, -50%) scale(0); z-index: 3;
  transition: left 1s var(--ease), width 1s var(--ease), transform .5s var(--ease); }
.ksai[data-phase="a"] .kx-dot { animation: kxscan 2.6s both; }
.ksai[data-phase="i"] .kx-dot { left: 63.1%; width: 16.4%; transform: translate(-50%, -50%) scale(1); }
@keyframes kxscan {
  0%   { left: 2%;    transform: translate(-50%, -50%) scale(0); animation-timing-function: cubic-bezier(.2,.7,.2,1); }
  10%  { left: 2%;    transform: translate(-50%, -50%) scale(1); animation-timing-function: cubic-bezier(.45,0,.55,1); }
  70%  { left: 97%;   transform: translate(-50%, -50%) scale(1); animation-timing-function: cubic-bezier(.65,0,.35,1); }
  100% { left: 71.25%; transform: translate(-50%, -50%) scale(1.25); }
}
/* legenda: os três sinais do modelo e o resultado */
.kx-steps { display: flex; justify-content: space-between; gap: 6px; font-family: var(--f-mono); font-size: 10px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--cinza); white-space: nowrap; }
.kx-steps span { display: inline-flex; align-items: center; gap: 6px; transition: color .4s; }
.kx-steps span::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--cinza-claro); transition: background-color .4s; }
.ksai[data-phase="k"] .kx-steps [data-p="k"], .ksai[data-phase="s"] .kx-steps [data-p="s"], .ksai[data-phase="a"] .kx-steps [data-p="a"], .ksai[data-phase="i"] .kx-steps [data-p="i"] { color: var(--preto); }
.ksai[data-phase="k"] .kx-steps [data-p="k"]::before, .ksai[data-phase="s"] .kx-steps [data-p="s"]::before, .ksai[data-phase="a"] .kx-steps [data-p="a"]::before, .ksai[data-phase="i"] .kx-steps [data-p="i"]::before { background: var(--cobalto); }
.kx-cap { margin: -4px 0 0; position: relative; height: 1.5em; font-family: var(--f-mono); font-size: 12px; color: var(--cinza); }
.kx-cap span { position: absolute; left: 0; top: 0; white-space: nowrap; opacity: 0; transform: translateY(6px); transition: opacity .45s, transform .45s; }
.ksai[data-phase="k"] .kx-cap [data-p="k"], .ksai[data-phase="s"] .kx-cap [data-p="s"], .ksai[data-phase="a"] .kx-cap [data-p="a"], .ksai[data-phase="i"] .kx-cap [data-p="i"] { opacity: 1; transform: none; }
@media (prefers-reduced-motion: no-preference) {
  .ksai { animation: pop .7s cubic-bezier(.2,.7,.2,1) both; }
}

/* hero da Homepage ocupa exatamente o primeiro ecrã e fica centrado (Mac, Windows, telemóvel) */
@media (min-width: 861px) {
  .hero.hero-fit { min-height: calc(100vh - 76px); min-height: calc(100svh - 76px); padding-block: clamp(32px, 6vh, 88px); display: flex; align-items: center; }
  .hero-fit > .wrap { width: 100%; }
  .hero-fit .hero-copy { gap: clamp(18px, 3.2vh, 28px); }
  .hero-fit .display { font-size: clamp(48px, min(7.4vw, 11.5vh), 112px); }
  .hero-fit .hero-art { justify-self: end; width: 100%; max-width: calc(100vh - 76px - 12vh - 72px); max-width: min(100%, calc(100svh - 76px - 12vh - 72px)); }
}
/* telemóvel e tablet: a animação encolhe para que título e botão caibam sempre no ecrã */
@media (max-width: 860px) {
  .hero.hero-fit { min-height: calc(100vh - 64px); min-height: calc(100svh - 64px); padding-block: 20px 24px; display: flex; flex-direction: column; }
  .hero-fit > .wrap.grid { flex: 1 1 auto; display: flex; flex-direction: column; gap: 20px; }
  .hero-fit .hero-art { order: -1; flex: 1 1 0; min-height: 0; width: 100%; max-width: none; container-type: size; }
  .hero-fit .ksai { width: 200px; width: min(100cqw, 100cqh - 26px, 320px); gap: 10px; }
  .hero-fit .kx-cap { display: none; }
  .hero-fit .hero-copy { gap: 18px; }
  .hero-fit .display { font-size: clamp(38px, min(12vw, 6.4vh), 64px); }
  .hero-fit .lead { font-size: 17px; }
}
@media (max-width: 860px) and (max-height: 520px) {
  /* telemóvel deitado: fluxo normal */
  .hero.hero-fit { min-height: 0; }
  .hero-fit .hero-art { flex: none; height: 150px; }
}
@media (max-width: 560px) { .kx-steps { font-size: 9px; letter-spacing: .06em; } .kx-steps span::before { display: none; } }
/* aviso de cookies no telemóvel: compacto e no topo, para não tapar o título nem o botão principal */
@media (max-width: 560px) {
  .cookie-banner { top: calc(72px + env(safe-area-inset-top, 0px)); bottom: auto; }
  .consent-in { padding: 16px 16px 14px; gap: 10px; border-radius: 16px; }
  .consent-mark { top: 18px; right: 18px; width: 12px; height: 12px; }
  .cookie-banner h2 { font-size: 18px; }
  .cookie-banner p { font-size: 13px; line-height: 1.45; }
  .consent-actions { grid-template-columns: 1fr 1fr auto; }
  .consent-actions .btn { min-height: 40px; }
  .consent-actions [data-c="custom"] { grid-column: auto; order: 0; min-height: 40px; padding: 0 6px; }
  .consent-actions [data-c="save"] { grid-column: 1 / -1; }
}
/* LinkedIn no menu do telemóvel */
.m-social { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; font-size: 16px; font-weight: 700; color: var(--branco); text-decoration: none; }
.m-social span { color: var(--azul-medio); }