/* Tokens de cor, tipografia e medidas vivem em tokens.css. */

html {
  font-size: 16px;
  scroll-behavior: smooth;
  /* Clipa qualquer overflow horizontal na RAIZ (inclui elementos position:fixed como o
     banner de cookies, que o overflow-x:hidden do body não clipava). Sem isto, um elemento
     mais largo que o ecrã deslocava toda a página (conteúdo cortado à esquerda, faixa branca
     à direita). 'clip' não quebra o position:sticky do header. */
  overflow-x: clip;
}

body {
  margin: 0;
  color: var(--bai-ink);
  background: var(--bai-surface);
  font-family: var(--bai-font);
  text-rendering: geometricPrecision;
  overflow-x: clip;
}

/* Durante a troca de tema (claro/escuro) suprime TODAS as transições para a mudança ser
   instantânea — evita a "tremura"/flicker de dezenas de elementos a animar a cor ao mesmo
   tempo no telemóvel. A classe é adicionada e removida por JS (site.js applyTheme). */
.theme-switching,
.theme-switching *,
.theme-switching *::before,
.theme-switching *::after {
  transition: none !important;
}

a {
  color: inherit;
  text-decoration: none;
}

/* Segurança responsive: nenhuma imagem/média ultrapassa o seu contentor.
   (As imagens full-bleed com object-fit definem width/height próprios.) */
img,
svg,
video {
  max-width: 100%;
}

.btn {
  --bs-btn-border-radius: var(--radius-md);
  border-radius: var(--radius-md);
  font-weight: 650;
  letter-spacing: .005em;
  transition:
    color var(--motion-fast) var(--ease-out),
    background-color var(--motion-fast) var(--ease-out),
    border-color var(--motion-fast) var(--ease-out),
    box-shadow var(--motion-fast) var(--ease-out),
    transform var(--motion-fast) var(--ease-out);
}

.btn i,
.btn svg {
  transition: transform var(--motion-fast) var(--ease-out);
}

.btn:hover .fa-arrow-right,
.btn:hover .fa-arrow-up-right-from-square {
  transform: translateX(3px);
}

.btn-primary {
  --bs-btn-bg: var(--bai-blue);
  --bs-btn-border-color: var(--bai-accent);
  --bs-btn-hover-bg: var(--bai-blue-900);
  --bs-btn-hover-border-color: var(--bai-strong);
  --bs-btn-active-bg: var(--bai-blue-900);
  --bs-btn-active-border-color: var(--bai-strong);
  box-shadow: var(--shadow-sm);
}

.btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
}

.btn-primary:active {
  transform: translateY(0);
  box-shadow: var(--shadow-sm);
}

.btn-outline-primary {
  --bs-btn-color: var(--bai-accent);
  --bs-btn-border-color: rgba(34, 63, 127, .35);
  --bs-btn-hover-bg: var(--bai-blue);
  --bs-btn-hover-border-color: var(--bai-accent);
  border-width: 1px;
}

/* Formulários com foco de marca */
.form-control,
.form-select {
  border-color: var(--bai-line);
  border-radius: var(--radius-sm);
}

.form-control:focus,
.form-select:focus {
  border-color: var(--bai-aqua);
  box-shadow: 0 0 0 3px rgba(105, 199, 223, .35);
}

.form-check-input:checked {
  background-color: var(--bai-accent);
  border-color: var(--bai-accent);
}

.skip-link {
  position: fixed;
  top: -100px;
  left: 1rem;
  z-index: 200;
  padding: .65rem 1.1rem;
  border-radius: var(--radius-md);
  background: var(--bai-blue-900);
  color: #fff;
  font-weight: 700;
  box-shadow: var(--shadow-lg);
  transition: top var(--motion-fast) var(--ease-out);
}

.skip-link:focus-visible {
  top: 1rem;
}

main#conteudo:focus {
  outline: none;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--bai-header-pattern, none), var(--bai-header-bg);
  border-bottom: 1px solid var(--bai-line);
  backdrop-filter: blur(18px);
}

.header-shell {
  width: min(100%, 1600px);
  margin-inline: auto;
  padding-inline: clamp(1rem, 4vw, 4rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.utility-bar {
  height: var(--header-utility-height);
  overflow: hidden;
  background: linear-gradient(90deg, var(--bai-blue-900), var(--bai-blue));
  color: rgba(255, 255, 255, .82);
  font-size: .8rem;
  transition: height var(--motion-base) var(--ease-out);
}

.utility-bar .header-shell {
  height: var(--header-utility-height);
}

.utility-group {
  display: flex;
  align-items: center;
  gap: 1.1rem;
}

.utility-bar a {
  color: #fff;
  opacity: .92;
}

.utility-bar a:hover {
  opacity: 1;
}

.site-header.is-condensed .utility-bar {
  height: 0;
}

.main-nav {
  min-height: var(--header-nav-height);
  padding: 0;
}

.main-nav > .header-shell {
  min-height: var(--header-nav-height);
  flex-wrap: nowrap;
}

.brand-mark {
  display: inline-flex;
  align-items: center;
  color: var(--bai-accent);
}

.brand-mark img {
  width: clamp(104px, 9vw, 124px);
  height: auto;
  display: block;
}

.nav-actions .btn {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

/* --- Mega-menu --- */
.has-mega {
  position: relative;
}

.mega-trigger {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  border: 0;
  background: transparent;
}

.mega-trigger .chevron {
  transition: transform var(--motion-fast) var(--ease-out);
}

.mega-trigger[aria-expanded="true"] .chevron {
  transform: rotate(180deg);
}

.mega-panel {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  translate: -50% 0;
  width: min(640px, calc(100vw - 2rem));
  padding: var(--space-5) var(--space-5) var(--space-4);
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-surface);
  box-shadow: var(--shadow-lg);
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: opacity var(--motion-fast) var(--ease-out), transform var(--motion-fast) var(--ease-out), visibility var(--motion-fast);
}

.has-mega.is-open .mega-panel {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.mega-lead {
  display: grid;
  gap: .15rem;
  padding-bottom: var(--space-4);
  margin-bottom: var(--space-4);
  border-bottom: 1px solid var(--bai-line);
}

.mega-lead strong {
  font-size: 1.02rem;
  font-weight: 800;
  color: var(--bai-strong);
}

.mega-lead span {
  color: var(--bai-muted);
  font-size: .88rem;
}

.mega-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .25rem;
}

.mega-grid a {
  display: grid;
  gap: .1rem;
  padding: .6rem .75rem;
  border-radius: var(--radius-sm);
  transition: background var(--motion-fast) var(--ease-out);
}

.mega-grid a:hover {
  background: var(--bai-soft);
}

.mega-grid strong {
  font-size: .93rem;
  font-weight: 650;
  color: var(--bai-ink);
}

.mega-grid span {
  color: var(--bai-muted);
  font-size: .8rem;
  line-height: 1.4;
}

.mega-feature {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin-top: var(--space-4);
  padding: .7rem .9rem;
  border-radius: var(--radius-sm);
  color: var(--bai-strong);
  background: var(--bai-soft);
  font-size: .92rem;
  font-weight: 700;
  transition: background var(--motion-fast) var(--ease-out);
}

.mega-feature:hover { background: var(--bai-cloud); }

.mega-feature i { color: var(--bai-accent); }

.mega-all {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  margin-top: var(--space-4);
  color: var(--bai-accent);
  font-size: .88rem;
  font-weight: 700;
}

.mega-all:hover svg {
  transform: translateX(3px);
}

.mega-all svg {
  transition: transform var(--motion-fast) var(--ease-out);
}

.brand-kicker {
  margin-bottom: .85rem;
  color: var(--bai-aqua);
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.product-stage {
  background: var(--bai-surface);
}

.stage-header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 2rem;
}

.stage-sub { margin: .6rem 0 0; max-width: 620px; color: var(--bai-muted); font-size: 1.02rem; line-height: 1.5; }

.stage-header h2 {
  max-width: 860px;
  margin: 0;
  font-size: clamp(2.1rem, 5vw, 4.6rem);
  line-height: .98;
  font-weight: 800;
}

.premium-rail .product-tile {
  border-radius: 28px;
  background:
    radial-gradient(circle at 100% 0%, rgba(105, 199, 223, .18), transparent 34%),
    var(--bai-soft);
}

.premium-rail .product-tile:nth-child(even) {
  color: #fff;
  background:
    radial-gradient(circle at 100% 0%, rgba(105, 199, 223, .24), transparent 36%),
    linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue));
}

.premium-rail .product-tile:nth-child(even) span,
.premium-rail .product-tile:nth-child(even) p {
  color: rgba(255, 255, 255, .72);
}

.premium-rail .product-tile:nth-child(even) strong {
  color: var(--bai-aqua);
}

.network-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, .55fr);
  gap: clamp(2rem, 5vw, 4rem);
}

.people-hero {
  position: relative;
  min-height: calc(100svh - var(--header-height));
  overflow: hidden;
  color: #fff;
  background: var(--bai-blue-900);
}

.people-hero-image,
.people-hero-overlay {
  position: absolute;
  inset: 0;
}

/* Hero de marca: sem fotografia, com o arquipélago em pontos.
   Ativa-se quando Home.HeroImage está vazio no Admin → Aparência. */
.people-hero.brand-hero {
  background:
    radial-gradient(circle at 82% 18%, rgba(105, 199, 223, .16), transparent 34%),
    var(--bai-dots-light),
    var(--bai-hero-gradient, linear-gradient(140deg, #050f22 0%, var(--bai-blue-900) 46%, var(--bai-blue-700) 100%));
}

.hero-archipelago {
  position: absolute;
  top: 50%;
  right: clamp(1rem, 6vw, 7rem);
  width: min(560px, 44vw);
  height: auto;
  transform: translateY(-56%);
  pointer-events: none;
}

.hero-archipelago .island circle {
  fill: rgba(255, 255, 255, .82);
}

.hero-archipelago .island[data-agency] circle:first-of-type {
  fill: var(--bai-aqua);
  animation: islandPulse 3.2s ease-in-out infinite;
  transform-origin: center;
  transform-box: fill-box;
}

.hero-archipelago .island[data-agency]:nth-of-type(odd) circle:first-of-type {
  animation-delay: 1.4s;
}

@keyframes islandPulse {
  0%, 100% { opacity: .85; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.22); }
}

/* Montagem do arquipélago: ilhas surgem em sequência, linhas desenham-se */
@media (prefers-reduced-motion: no-preference) {
  .hero-archipelago .island {
    opacity: 0;
    transform-box: fill-box;
    transform-origin: center;
    animation: islandAppear .55s var(--ease-spring, cubic-bezier(.34,1.4,.5,1)) both;
  }
  .hero-archipelago .island:nth-of-type(1) { animation-delay: .15s; }
  .hero-archipelago .island:nth-of-type(2) { animation-delay: .28s; }
  .hero-archipelago .island:nth-of-type(3) { animation-delay: .40s; }
  .hero-archipelago .island:nth-of-type(4) { animation-delay: .52s; }
  .hero-archipelago .island:nth-of-type(5) { animation-delay: .63s; }
  .hero-archipelago .island:nth-of-type(6) { animation-delay: .73s; }
  .hero-archipelago .island:nth-of-type(7) { animation-delay: .82s; }
  .hero-archipelago .island:nth-of-type(8) { animation-delay: .90s; }
  .hero-archipelago .island:nth-of-type(9) { animation-delay: .97s; }
  .hero-archipelago .island:nth-of-type(10) { animation-delay: 1.03s; }
  .hero-archipelago .arc-lines { opacity: 0; animation: fadeInLines 1s ease 1.1s both; }
  .hero-archipelago .island-labels { opacity: 0; animation: fadeInLines 1s ease 1.2s both; }
}

@keyframes islandAppear {
  from { opacity: 0; transform: scale(0); }
  to { opacity: 1; transform: scale(1); }
}

@keyframes fadeInLines { to { opacity: 1; } }

@media (min-width: 992px) {
  .brand-hero .people-hero-copy {
    width: min(580px, 50vw);
  }

  .brand-hero .people-hero-copy h1 {
    font-size: clamp(3rem, 5.4vw, 5.6rem);
    line-height: .96;
  }

  .hero-archipelago {
    width: min(500px, 38vw);
  }
}

@media (max-width: 991px) {
  .hero-archipelago {
    top: auto;
    bottom: 9rem;
    right: 0;
    width: min(420px, 78vw);
    transform: none;
    opacity: .5;
  }
}

.people-hero-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.04);
  animation: heroPhotoIn 15s cubic-bezier(.22, .8, .36, 1) both;
}

/* Visual polish and CMS */

.utility-bar .utility-ticket-link {
  padding: .18rem .5rem;
  border-bottom: 2px solid var(--bai-aqua);
  color: #fff !important;
  background: rgba(255, 255, 255, .08);
  font-weight: 650;
  opacity: 1;
}

.utility-bar .utility-ticket-link:hover,
.utility-bar .utility-ticket-link:focus-visible {
  color: var(--bai-blue-900) !important;
  background: var(--bai-aqua);
}

.section-bridge {
  position: relative;
  z-index: 4;
  width: min(520px, calc(100% - 2rem));
  min-height: 78px;
  margin: -39px auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 1.5rem;
  border: 1px solid rgba(255, 255, 255, .34);
  color: #fff;
  background: var(--bai-blue-900);
  box-shadow: 0 20px 45px rgba(5, 20, 45, .26);
  font-weight: 700;
}

.section-bridge i {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  color: #071b3c;
  background: var(--bai-aqua);
  border-radius: 50%;
}

.campaign-strip { padding-top: 39px; }

.product-feature-list {
  margin: .25rem 0 0;
  padding: 0;
  display: grid;
  gap: .6rem;
  list-style: none;
  color: var(--bai-ink);
  line-height: 1.6;
}

.product-feature-list li { position: relative; padding-left: 1.15rem; }

.product-feature-list li::before { content: ""; position: absolute; left: 0; top: .68rem; width: 6px; height: 6px; border-radius: 50%; background: var(--bai-aqua); }

.product-next-steps,
.product-faq {
  display: grid;
  grid-template-columns: minmax(240px, .45fr) minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 5rem);
  padding: clamp(3rem, 7vw, 6rem) 0;
  border-top: 1px solid var(--bai-line);
}

.product-next-steps h2,
.product-faq h2 { max-width: 480px; font-size: clamp(1.6rem, 2.6vw, 2.4rem); line-height: 1.08; font-weight: 800; text-wrap: balance; }

.product-next-steps ol { margin: 0; padding: 0; display: grid; list-style: none; }

.product-next-steps li { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: .2rem 1rem; padding: 1.15rem 0; border-bottom: 1px solid var(--bai-line); }

.product-next-steps li span { grid-row: 1 / span 2; color: var(--bai-aqua); font-size: 1.4rem; font-weight: 800; }

.product-next-steps li strong { font-size: 1.18rem; }

.product-next-steps li p { margin: 0; color: var(--bai-muted); }

.product-faq .accordion-item { border-color: var(--bai-line); }

.product-faq .accordion-button { padding: 1.25rem 0; color: var(--bai-ink); background: transparent; box-shadow: none; font-weight: 700; }

.product-faq .accordion-body { padding: 0 0 1.3rem; color: var(--bai-ink); line-height: 1.7; }

.content-hero.has-media { position: relative; min-height: 620px; overflow: hidden; background: var(--bai-blue-900); }

.content-hero-media,
.content-hero-overlay { position: absolute; inset: 0; width: 100%; height: 100%; }

.content-hero-media { object-fit: cover; object-position: center; }

.content-hero-overlay { background: linear-gradient(90deg, rgba(5, 20, 45, .94) 0%, rgba(5, 20, 45, .72) 52%, rgba(5, 20, 45, .25) 100%); }

.content-hero.has-media .content-hero-inner { position: relative; z-index: 1; min-height: 620px; }

/* Mobile: em vez de cortar a foto numa faixa alta, mostra a imagem INTEIRA (sem corte)
   e coloca o texto POR BAIXO, numa faixa azul. Assim o hero deixa de aparecer "cortado". */
@media (max-width: 640px) {
  .content-hero.has-media { display: block; min-height: 0; }
  .content-hero-media {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    /* aspect-ratio reserva o espaço ANTES de a imagem (lazy) carregar → sem reflow/salto
       ao carregar durante o scroll (evita o "flicker"). Contain mostra a imagem inteira. */
    aspect-ratio: 16 / 9;
    object-fit: contain;
    background: var(--bai-blue-900);
  }
  .content-hero-overlay { display: none; }
  .content-hero.has-media .content-hero-inner {
    position: relative;
    min-height: 0;
    padding: 1.4rem 1.1rem 1.8rem;
    background: var(--bai-blue-900);
  }
}

.campaign-modal .modal-content { position: relative; overflow: hidden; border: 0; border-radius: 8px; box-shadow: 0 34px 90px rgba(5, 20, 45, .34); }

.campaign-modal .btn-close { position: absolute; z-index: 2; top: 1rem; right: 1rem; padding: .75rem; background-color: #fff; opacity: 1; }

.campaign-modal-image { width: 100%; aspect-ratio: 16 / 7; object-fit: cover; }

.campaign-modal-copy { padding: clamp(1.5rem, 4vw, 3rem); }

.campaign-modal-copy h2 { font-size: clamp(2rem, 4vw, 4rem); line-height: .98; font-weight: 800; }

.campaign-modal-copy > p:not(.eyebrow) { max-width: 620px; color: var(--bai-muted); font-size: 1.08rem; }

.admin-app-shell { min-height: 100svh; display: grid; grid-template-columns: 270px minmax(0, 1fr); background: var(--bai-soft); overflow-x: visible; }

.admin-main { min-width: 0; }

.admin-app-shell .admin-sidebar { position: sticky; top: 0; height: 100svh; min-height: 0; overflow-y: auto; z-index: 60; }

.admin-sidebar-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }

.admin-sidebar-close,
.admin-menu-toggle { width: 42px; height: 42px; border: 0; color: inherit; background: transparent; }

.admin-sidebar-close { display: none; color: #fff; }

.admin-sidebar nav { flex: 1; }

.admin-nav-label { display: block; margin: 1rem .85rem .35rem; color: var(--bai-aqua); font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }

.admin-sidebar-footer { display: grid; gap: .25rem; padding-top: 1rem; border-top: 1px solid rgba(255,255,255,.16); }

.admin-sidebar-footer span { overflow: hidden; text-overflow: ellipsis; font-weight: 800; }

.admin-sidebar-footer small { margin-bottom: .65rem; color: rgba(255,255,255,.65); }

.admin-topbar { min-height: 58px; display: flex; align-items: center; justify-content: flex-end; padding: 0 clamp(1rem,3vw,2rem); border-bottom: 1px solid var(--bai-line); background: var(--bai-surface); }

.admin-topbar a { color: var(--bai-accent); font-weight: 650; }

.admin-menu-toggle { display: none; margin-right: auto; color: var(--bai-strong); }

.admin-sidebar-backdrop { display: none; }

.admin-dashboard > header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }

.cms-setting-group { margin-bottom: 1rem; padding: 1.5rem; border: 1px solid var(--bai-line); border-radius: 8px; background: var(--bai-surface); }

.cms-setting-group > header span { color: var(--bai-aqua); font-size: .74rem; font-weight: 800; text-transform: uppercase; }

.cms-setting-group > header h2 { margin: .15rem 0 1.25rem; font-size: 1.5rem; font-weight: 800; }

.cms-setting-fields { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; }

.cms-setting-field.wide { grid-column: 1 / -1; }

.cms-image-preview { width: 100%; max-height: 190px; margin-top: .65rem; object-fit: cover; border: 1px solid var(--bai-line); }

.media-upload-bar { display: grid; grid-template-columns: 1fr 1fr auto; align-items: end; gap: 1rem; margin-bottom: 2rem; padding: 1.25rem; border: 1px solid var(--bai-line); background: var(--bai-surface); }

.media-library-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }

.media-asset { overflow: hidden; border: 1px solid var(--bai-line); border-radius: 8px; background: var(--bai-surface); }
.media-folder { border: 1px solid var(--bai-line); border-radius: 10px; background: var(--bai-surface); padding: .5rem 1rem 1rem; margin-bottom: 1rem; }
.media-folder > summary { cursor: pointer; padding: .6rem .25rem; font-size: .95rem; list-style: none; }
.media-folder > summary::-webkit-details-marker { display: none; }
.media-folder .media-asset img { width: 100%; height: 120px; object-fit: contain; background: var(--bai-surface-muted, #f4f6fb); }

.media-asset > img,
.media-document { width: 100%; aspect-ratio: 16/10; object-fit: cover; background: var(--bai-cloud); }

.media-document { display: grid; place-items: center; color: var(--bai-accent); font-size: 3rem; }

.media-asset > div:last-child { padding: .9rem; }

.media-asset strong,
.media-asset small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.media-asset small { margin: .25rem 0 .7rem; color: var(--bai-muted); }

.cms-body-editor { min-height: 340px; }

@media (max-width: 900px) {
  .admin-app-shell { grid-template-columns: 1fr; }

  .admin-app-shell .admin-sidebar { position: fixed; left: 0; width: min(310px, 88vw); transform: translateX(-105%); transition: transform .25s ease; }

  .admin-nav-open .admin-sidebar { transform: translateX(0); }

  .admin-sidebar-close,
.admin-menu-toggle { display: inline-grid; place-items: center; }

  .admin-sidebar-backdrop { position: fixed; inset: 0; z-index: 55; background: rgba(5,20,45,.55); }

  .admin-nav-open .admin-sidebar-backdrop { display: block; }

  .product-next-steps,
.product-faq { grid-template-columns: 1fr; }

  .media-library-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }

  .media-upload-bar { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .section-bridge { min-height: 64px; margin-block: -32px; }

  .campaign-strip { padding-top: 32px; }

  .cms-setting-fields,
.media-library-grid { grid-template-columns: 1fr; }

  .admin-workspace { padding: 1rem; }
}

/* Scroll-linked story, ATM locator and 3D simulator */

.admin-sidebar .brand-mark {
  overflow: hidden;
  background: transparent;
}

.admin-sidebar .brand-mark img {
  filter: brightness(0) invert(1);
}

.home-story-sequence {
  --story-progress: 0;
  --story-cut: 12%;
  --story-copy-y: 80px;
  overflow: clip;
}

.home-story-sequence .baidirecto-feature {
  position: sticky;
  top: var(--header-height);
  height: calc(100svh - var(--header-height));
  min-height: 620px;
  max-height: none;
  aspect-ratio: auto;
}

.home-story-sequence .feature-photo {
  opacity: calc(1 - var(--story-progress) * .5);
}

.home-story-sequence .feature-copy {
  opacity: calc(1 - var(--story-progress) * 1.15);
  transform: translateY(calc(var(--story-progress) * -70px));
}

.home-story-sequence .campaign-strip {
  position: relative;
  z-index: 5;
  min-height: calc(100svh - var(--header-height) + 7vw);
  margin-top: 0;
  clip-path: polygon(0 var(--story-cut), 100% 0, 100% 100%, 0 100%);
}

.home-story-sequence .campaign-copy {
  transform: translateY(var(--story-copy-y));
  transition: transform .12s linear;
}

.home-story-sequence .section-bridge {
  position: sticky;
  top: calc(100svh - 90px);
  bottom: auto;
  height: 0;
  margin-left: clamp(1rem, 6vw, 7rem);
  pointer-events: none;
}

.home-story-sequence .section-bridge a { pointer-events: auto; }

.atm-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2.5rem;
  padding: clamp(1.9rem, 3.4vw, 2.8rem) max(clamp(1.25rem, 5vw, 5rem), calc((100vw - 1540px) / 2));
  color: #fff;
  background:
    var(--bai-dots-light),
    var(--bai-section-gradient, linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue-700)));
  position: relative;
  overflow: hidden;
}

.atm-hero-copy { position: relative; z-index: 1; max-width: 720px; }

.atm-hero h1 { margin: .15rem 0 .5rem; font-size: clamp(1.9rem, 3.2vw, 2.7rem); line-height: 1.02; font-weight: 800; }

.atm-hero-copy > p:not(.eyebrow) { max-width: 620px; margin: 0 0 1.1rem; color: #cdddf5; font-size: 1rem; line-height: 1.55; }

.atm-hero-copy .btn { position: relative; z-index: 1; }

.atm-hero-signal { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: .7rem; padding: .55rem 1.1rem; border: 1px solid rgba(105,199,223,.3); border-radius: var(--radius-pill); background: rgba(105,199,223,.08); color: var(--bai-aqua); font-weight: 800; letter-spacing: .12em; }

.atm-hero-signal span { font-size: 1.15rem; line-height: 1; }

.atm-hero-signal i { font-size: 1.1rem; }

.atm-simulator-stage {
  /* Altura definida no backoffice (Simulador ATM › Tamanho no portal). */
  min-height: var(--atm-stage-height, 880px);
  scroll-margin-top: var(--header-height);
  display: grid;
  grid-template-columns: minmax(360px, .34fr) minmax(660px, .66fr);
  color: #fff;
  background:
    var(--bai-dots-light),
    linear-gradient(160deg, var(--bai-blue-900) 0%, #0b224a 100%);
  overflow: hidden;
}

.atm-simulator-copy { align-self: center; max-width: 560px; padding: clamp(2.4rem, 4vw, 4.2rem); }

.atm-simulator-copy h1 { margin: .3rem 0 1rem; font-size: clamp(2rem, 3vw, 3.1rem); line-height: 1; font-weight: 800; }

.atm-simulator-copy > p:not(.eyebrow) { max-width: 460px; color: #c8d7ef; font-size: 1.02rem; line-height: 1.6; }

.atm-network-status { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin: 1.75rem 0; overflow: hidden; border: 1px solid rgba(255,255,255,.16); border-radius: var(--radius-md); background: rgba(255,255,255,.16); }

.atm-network-status > div { padding: .9rem 1rem; background: rgba(6,20,44,.6); }

.atm-network-status strong { display: block; font-size: 1.7rem; font-weight: 800; line-height: 1; color: #fff; font-variant-numeric: tabular-nums; }

.atm-network-status span { color: #9fb6d6; font-size: .78rem; }

.atm-ops { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1.5rem; padding: 0; list-style: none; }

.atm-ops li { display: inline-flex; align-items: center; gap: .45rem; padding: .4rem .8rem; border: 1px solid rgba(105,199,223,.28); border-radius: var(--radius-pill); background: rgba(105,199,223,.08); color: #dcecf6; font-size: .82rem; font-weight: 650; }

.atm-ops li i { color: var(--bai-aqua); font-size: .85rem; }

.atm-simulator-status { padding: .9rem 0; border-top: 1px solid rgba(255,255,255,.2); border-bottom: 1px solid rgba(255,255,255,.2); color: var(--bai-aqua); font-weight: 650; }

.atm-locator-cta { margin-top: 1.5rem; }

.atm-canvas-shell { position: relative; min-width: 0; min-height: var(--atm-stage-height, 880px); background-color: #06152e; background-image: linear-gradient(rgba(105,199,223,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(105,199,223,.045) 1px, transparent 1px); background-size: 44px 44px; }

.atm-canvas-shell::after { content: "Use o ecrã, o cartão e o teclado"; position: absolute; right: 1.5rem; bottom: 1rem; color: rgba(255,255,255,.72); font-size: .78rem; font-weight: 800; }

#atmSimulatorCanvas { width: 100%; height: 100%; display: block; touch-action: manipulation; cursor: default; }

.atm-locator { padding: clamp(4rem, 8vw, 7rem) max(clamp(1.25rem, 5vw, 5rem), calc((100vw - 1540px) / 2)); background: var(--bai-soft); }

/* Destaque de novo serviço no ATM. */
.atm-new-service {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 1.75rem;
  padding: clamp(1.4rem, 3vw, 2.1rem);
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-dots-light), linear-gradient(135deg, rgba(105,199,223,.12), var(--bai-card));
}
.atm-new-badge {
  flex: none;
  align-self: flex-start;
  padding: .35rem .8rem;
  border-radius: 999px;
  background: var(--bai-accent);
  color: #fff;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.atm-new-copy { flex: 1 1 320px; }
.atm-new-copy h2 { margin: 0 0 .35rem; font-size: clamp(1.3rem, 2.4vw, 1.9rem); font-weight: 800; line-height: 1.12; }
.atm-new-copy p { margin: 0; color: var(--bai-muted); line-height: 1.6; }

/* Secção de proximidade (PCE): imagem + texto. */
.atm-pce {
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: center;
}
.atm-pce-media {
  margin: 0;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
  aspect-ratio: 4 / 3;
}
.atm-pce-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.atm-pce-copy .eyebrow { color: var(--bai-accent); }
.atm-pce-copy h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); font-weight: 800; line-height: 1.1; margin: .3rem 0 .8rem; }
.atm-pce-copy p { color: var(--bai-muted); font-size: 1.06rem; line-height: 1.7; margin: 0; max-width: 52ch; }
@media (max-width: 860px) {
  .atm-pce { grid-template-columns: 1fr; }
  .atm-pce-media { aspect-ratio: 16 / 10; }
}

.atm-locator-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; }

.atm-locator-heading h2 { margin: 0; font-size: clamp(1.8rem, 3.4vw, 2.8rem); line-height: 1.05; font-weight: 800; }

.atm-locator-heading > strong { max-width: 190px; color: var(--bai-accent); }

.atm-locator-heading > strong span { display: block; font-size: 3.4rem; line-height: 1; }

.atm-filters { display: grid; grid-template-columns: 1.2fr .7fr .7fr auto; align-items: end; gap: .8rem; margin-bottom: 1rem; }

.atm-filters label > span { display: block; margin-bottom: .35rem; color: var(--bai-muted); font-size: .78rem; font-weight: 650; }

.atm-bai-toggle { min-height: 58px; display: flex; align-items: center; gap: .55rem; padding: 0 1rem; border: 1px solid var(--bai-line); background: var(--bai-surface); }

.atm-bai-toggle span { margin: 0 !important; white-space: nowrap; }

.atm-locator-workspace { height: min(720px, 76svh); min-height: 560px; display: grid; grid-template-columns: minmax(300px, .42fr) minmax(0, 1fr); border: 1px solid var(--bai-line); background: var(--bai-surface); }

.atm-result-list { overflow-y: auto; border-right: 1px solid var(--bai-line); }

.atm-result { border-bottom: 1px solid var(--bai-line); background: var(--bai-surface); }

.atm-result-main { width: 100%; min-height: 108px; display: flex; flex-direction: column; align-items: flex-start; gap: .28rem; padding: 1.2rem 1.2rem .55rem; border: 0; text-align: left; color: var(--bai-ink); background: transparent; cursor: pointer; transition: background .2s ease, padding .2s ease; }

.atm-result-main:hover,
.atm-result-main:focus-visible { padding-left: 1.5rem; background: var(--bai-soft); }

.atm-result.is-bai { border-left: 5px solid var(--bai-aqua); }

.atm-result strong { font-size: 1.12rem; }

.atm-result span { color: var(--bai-muted); }

.atm-result small { color: var(--bai-accent); }

.atm-result-actions { display: flex; gap: .5rem; padding: 0 1.2rem 1rem; }

.atm-result-action { font-size: .82rem; font-weight: 650; color: var(--bai-accent); background: transparent; border: 1px solid var(--bai-line); border-radius: 999px; padding: .32rem .82rem; cursor: pointer; text-decoration: none; transition: background .15s ease, border-color .15s ease, color .15s ease; }

.atm-result-action:hover { background: var(--bai-soft); border-color: var(--bai-accent); }

.atm-result-action.is-copied { color: #1a7f37; border-color: #1a7f37; }

.atm-empty { padding: 2rem; color: var(--bai-muted); }

.atm-map { min-width: 0; height: 100%; z-index: 1; }
/* Fundo limpo quando não há tiles (offline / sem servidor de mapas) — evita o
   cinzento partido do Leaflet e mantém os marcadores legíveis. */
.atm-map--no-tiles.leaflet-container,
.atm-map--no-tiles {
  background:
    radial-gradient(circle at 28% 22%, rgba(105,199,223,.14), transparent 55%),
    radial-gradient(circle at 78% 78%, rgba(11,42,91,.10), transparent 55%),
    var(--bai-surface-muted, #eef2fb);
}

.atm-map-credit { margin: .7rem 0 0; color: var(--bai-muted); font-size: .78rem; text-align: right; }

.atm-map-credit a { color: var(--bai-accent); }

.atm-map-marker-shell { background: transparent; border: 0; }

.atm-map-marker { width: 42px; height: 42px; display: grid; place-items: center; border: 3px solid #fff; border-radius: 50% 50% 50% 8px; color: #fff; background: #52627d; box-shadow: 0 8px 22px rgba(5,20,45,.28); transform: rotate(-45deg); }

.atm-map-marker i { transform: rotate(45deg); }

.atm-map-marker.is-bai { background: var(--bai-blue); }

.atm-popup { display: grid; gap: .25rem; min-width: 190px; }

.atm-popup strong { color: #071b3c; font-size: 1rem; }

.atm-popup span,
.atm-popup small { color: var(--bai-muted); }

.atm-popup-ops { color: #0a7d33 !important; }

.atm-popup-go {
  margin-top: .35rem;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .4rem .7rem;
  border-radius: 8px;
  background: var(--bai-primary, #071b3c);
  color: #fff !important;
  font-weight: 600;
  font-size: .82rem;
  text-decoration: none;
  width: fit-content;
}
.atm-popup-go::before { content: "\f3c5"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.atm-popup-go:hover { filter: brightness(1.1); }

@media (min-width: 1200px) and (max-width: 1399px) {
  .main-nav .brand-mark img { width: 104px; }

  .main-nav .navbar-nav { gap: .1rem; }

  .main-nav .nav-item { flex-shrink: 0; }

  .main-nav .navbar-nav .nav-link { padding-inline: .5rem !important; font-size: .88rem; white-space: nowrap; }

  .main-nav .navbar-nav .nav-link::after { left: .5rem; right: .5rem; }

  .main-nav .nav-actions { gap: .35rem !important; }

  .main-nav .nav-actions .btn { padding-inline: .68rem; font-size: .85rem; }
}

@media (max-width: 991px) {
  .home-story-sequence .baidirecto-feature { top: 0; height: 100svh; }

  .atm-simulator-stage { grid-template-columns: minmax(0, 1fr); }

  .atm-simulator-copy { max-width: 760px; padding-bottom: 2rem; }

  .atm-canvas-shell { min-height: min(var(--atm-stage-height, 880px), 760px); }

  .atm-filters { grid-template-columns: 1fr 1fr; }

  .atm-locator-workspace { height: auto; grid-template-columns: 1fr; }

  .atm-result-list { max-height: 420px; border-right: 0; border-bottom: 1px solid var(--bai-line); }

  .atm-map { height: 580px; }
}

@media (max-width: 600px) {
  .atm-hero { min-height: 360px; align-items: flex-end; padding-block: 3rem; }

  .atm-hero-signal { display: none; }

  .atm-locator-heading { align-items: flex-start; flex-direction: column; }

  .atm-filters { grid-template-columns: 1fr; }

  .atm-simulator-copy { padding: 3rem 1.25rem 1.5rem; }

  .atm-simulator-copy h2 { font-size: clamp(2.5rem, 12vw, 3.8rem); }

  .atm-canvas-shell { min-height: min(var(--atm-stage-height, 880px), 620px); }

  .atm-canvas-shell::after { right: 1rem; bottom: .75rem; }

  .atm-map { height: 460px; }
}

/* Immersive homepage story and image-led product catalogue */

.home-story-sequence {
  position: relative;
  overflow: hidden;
  background: var(--bai-blue-900);
}

.home-story-sequence .baidirecto-feature {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 1440 / 608;
  min-height: 640px;
  max-height: 820px;
  isolation: isolate;
  background: var(--bai-blue-900);
}

.home-story-sequence .feature-photo {
  position: absolute;
  inset: 0;
  min-height: 0;
  overflow: hidden;
}

.home-story-sequence .feature-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(5, 20, 45, .88) 0%, rgba(5, 20, 45, .56) 34%, rgba(5, 20, 45, .08) 68%, rgba(5, 20, 45, .18) 100%),
    linear-gradient(0deg, rgba(5, 20, 45, .58), transparent 45%);
}

.home-story-sequence .feature-photo img {
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: contain;
  object-position: center;
  background: #dfe7f1;
  transform: scale(var(--story-media-scale, 1));
  transition: transform .12s linear;
}

.home-story-sequence .feature-copy {
  position: relative;
  z-index: 2;
  width: min(640px, calc(100% - 2rem));
  min-height: 100%;
  justify-content: center;
  padding: clamp(3rem, 7vw, 7rem) 0;
  margin-left: clamp(1rem, 6vw, 7rem);
  color: #fff;
}

.home-story-sequence .feature-copy h2 {
  max-width: 620px;
  font-size: clamp(3.6rem, 7vw, 7.8rem);
  text-wrap: balance;
}

.home-story-sequence .feature-copy p:not(.eyebrow) {
  color: rgba(255,255,255,.86);
}

.home-story-sequence .section-bridge {
  position: absolute;
  z-index: 6;
  left: clamp(1rem, 6vw, 7rem);
  bottom: calc(50% - 32px);
  width: auto;
  min-height: 64px;
  margin: 0;
  gap: 1rem;
  padding: 0;
  border: 0;
  color: #fff;
  background: transparent;
  box-shadow: none;
}

.home-story-sequence .section-bridge a,
.home-story-sequence .section-bridge i {
  width: 52px;
  height: 52px;
}

.home-story-sequence .section-bridge span {
  padding: .55rem .8rem;
  background: rgba(5,20,45,.82);
  backdrop-filter: blur(12px);
}

.home-story-sequence .campaign-strip {
  min-height: 760px;
  margin-top: -5vw;
  padding-top: clamp(6rem, 12vw, 11rem);
  clip-path: polygon(0 7vw, 100% 0, 100% 100%, 0 100%);
}

.home-story-sequence .campaign-media img {
  transform: scale(var(--story-campaign-scale, 1.04));
  transition: transform .12s linear;
}

.home-story-sequence .campaign-copy {
  padding-bottom: clamp(4rem, 8vw, 7rem);
}

.catalog-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.2rem;
}

.catalog-toolbar h2 {
  margin: 0;
  font-size: clamp(2rem, 4.5vw, 4.5rem);
  line-height: .96;
  font-weight: 800;
}

.catalog-toolbar > span {
  color: var(--bai-muted);
  font-weight: 800;
}

.catalog-toolbar + .filter-bar {
  flex-wrap: nowrap;
  overflow-x: auto;
  gap: 0;
  margin: 0 0 2rem;
  border-bottom: 1px solid var(--bai-line);
  scrollbar-width: thin;
}

.catalog-toolbar + .filter-bar a {
  flex: 0 0 auto;
  padding: .9rem 1rem .8rem;
  border: 0;
  border-bottom: 3px solid transparent;
  border-radius: 0;
  color: var(--bai-muted);
  background: transparent;
}

.catalog-toolbar + .filter-bar a.active,
.catalog-toolbar + .filter-bar a:hover {
  color: var(--bai-accent);
  border-bottom-color: var(--bai-aqua);
  background: transparent;
}

.product-catalog-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.2rem, 2.5vw, 2.2rem) 1.2rem;
}

.catalog-product {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--bai-line);
  border-radius: 8px;
  background: var(--bai-surface);
  transition: transform .3s ease, box-shadow .3s ease;
}

.catalog-product:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 60px rgba(7,27,60,.12);
}

.catalog-product-featured {
  grid-column: span 2;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
}

.catalog-product-media {
  position: relative;
  display: block;
  /* 16/9 em vez de 16/10: as artes dos cartões ficavam demasiado altas. */
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--bai-cloud);
}

/* 04/09/2026: era 410px (quase meio ecrã em portáteis). O destaque continua maior do que os
   restantes, mas sem dominar a página. */
.catalog-product-featured .catalog-product-media { aspect-ratio: auto; min-height: 280px; }

.catalog-product-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease; }

.catalog-product:hover .catalog-product-media img { transform: scale(1.045); }

.catalog-product-media::after { content: ""; position: absolute; inset: 45% 0 0; background: linear-gradient(transparent, rgba(5,20,45,.68)); }

.catalog-product-media > span { position: absolute; z-index: 1; left: 1rem; bottom: .9rem; color: #fff; font-size: .78rem; font-weight: 700; }

.catalog-product-copy { display: flex; flex-direction: column; align-items: flex-start; padding: 1.25rem; }

.catalog-product-copy small { color: var(--bai-accent); font-weight: 800; }

.catalog-product-copy h2 { margin: .7rem 0; font-size: clamp(1.4rem, 2.1vw, 2rem); line-height: 1.05; font-weight: 800; }

.catalog-product-copy p { margin-bottom: 1.3rem; color: var(--bai-muted); line-height: 1.55; }

.catalog-product-link { margin-top: auto; color: var(--bai-accent); font-weight: 700; }

.catalog-product-link i { margin-left: .35rem; transition: transform .2s ease; }

.catalog-product-link:hover i { transform: translateX(5px); }

.admin-upload-control {
  margin-top: .6rem;
  padding: .85rem;
  border: 1px dashed #9fb1ce;
  border-radius: 8px;
  background: var(--bai-soft);
}

.admin-upload-control label { color: var(--bai-strong); font-weight: 650; }

.admin-upload-control small { display: block; margin-top: .4rem; color: var(--bai-muted); }

/* Seletor de ícone com pré-visualização (Menu, Conteúdos) */
.admin-icon-field { display: flex; align-items: center; gap: .6rem; }
.admin-icon-field .form-select { flex: 1 1 auto; }
.admin-icon-preview {
  flex: 0 0 auto;
  width: 2.5rem; height: 2.5rem;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--bai-line); border-radius: 8px;
  background: var(--bai-soft); color: var(--bai-strong); font-size: 1.15rem;
}
.admin-icon-preview.is-empty::after {
  content: "—"; color: var(--bai-muted); font-size: 1rem;
}

.admin-upload-separator { display: block; margin: .5rem 0; color: var(--bai-muted); font-size: .72rem; font-weight: 650; text-align: center; text-transform: uppercase; }

.admin-document-list { border-top: 1px solid var(--bai-line); }

.admin-document-list > strong { display: block; padding: .75rem 0; color: var(--bai-strong); }

.admin-document-list > div { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .55rem 0; border-top: 1px solid var(--bai-line); }

.admin-document-list a { min-width: 0; overflow: hidden; color: var(--bai-accent); font-size: .82rem; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }

.section-pad > .container-fluid {
  width: min(100%, 1600px);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 4vw, 4rem) !important;
}

.section-pad > .container {
  padding-inline: clamp(1.25rem, 3vw, 3rem);
}

.simulator-config-editor { min-width: 0; border: 1px solid var(--bai-line); background: var(--bai-surface); }

.simulator-editor-toolbar {
  min-height: 84px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.2rem;
  border-bottom: 1px solid var(--bai-line);
}

.simulator-editor-toolbar strong { display: block; color: var(--bai-strong); font-size: 1.05rem; font-weight: 700; }

.simulator-editor-toolbar small { display: block; margin-top: .2rem; color: var(--bai-muted); }

.simulator-editor-toolbar small.is-error { color: #a6233d; }

.simulator-editor-actions { display: flex; align-items: center; gap: .8rem; }

.simulator-view-switch { display: inline-flex; padding: 3px; border: 1px solid #cbd7e7; background: var(--bai-soft); }

.simulator-view-switch button { min-height: 36px; display: inline-flex; align-items: center; gap: .45rem; padding: .4rem .75rem; border: 0; color: var(--bai-muted); background: transparent; font-weight: 650; }

.simulator-view-switch button.active { color: #fff; background: var(--bai-blue); }

.simulator-visual-editor { min-height: 720px; height: min(78svh, 920px); display: grid; grid-template-columns: 250px minmax(380px, 1fr) minmax(340px, .82fr); }

.simulator-flow-panel,
.simulator-property-panel,
.simulator-preview-panel { min-width: 0; min-height: 0; padding: 1.15rem; }

.simulator-flow-panel { overflow: hidden; border-right: 1px solid var(--bai-line); background: #f8faff; }

.simulator-flow-panel > label { display: block; margin-bottom: .55rem; color: var(--bai-strong); font-size: .78rem; font-weight: 700; text-transform: uppercase; }

.simulator-flow-search { display: grid; grid-template-columns: 22px 1fr; align-items: center; padding: .55rem .7rem; border: 1px solid #cbd7e7; background: var(--bai-surface); }

.simulator-flow-search i { color: var(--bai-accent); }

.simulator-flow-search input { min-width: 0; border: 0; outline: 0; background: transparent; }

.simulator-flow-list { height: calc(100% - 72px); overflow-y: auto; margin-top: .8rem; padding-right: .25rem; }

.simulator-flow-item { width: 100%; min-height: 56px; display: grid; grid-template-columns: 24px minmax(0, 1fr); align-items: center; gap: .6rem; padding: .65rem .7rem; border: 0; border-bottom: 1px solid #e1e7f0; color: #32425d; text-align: left; background: transparent; }

.simulator-flow-item:hover,
.simulator-flow-item.active { color: var(--bai-strong); background: #e8f3fb; }

.simulator-flow-item i { color: var(--bai-accent); text-align: center; }

.simulator-flow-item strong,
.simulator-flow-item small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.simulator-flow-item small { color: var(--bai-muted); font-size: .68rem; }

.simulator-property-panel { overflow-y: auto; border-right: 1px solid var(--bai-line); }

.simulator-property-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.1rem; }

.simulator-property-heading span { color: var(--bai-aqua-strong, #2687a5); font-size: .7rem; font-weight: 800; text-transform: uppercase; }

.simulator-property-heading h2 { margin: .15rem 0 0; color: var(--bai-strong); font-size: 1.45rem; font-weight: 800; }

.simulator-property-fields { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; padding-bottom: 1rem; border-bottom: 1px solid var(--bai-line); }

.simulator-field { min-width: 0; }

.simulator-field > span { display: block; margin-bottom: .3rem; color: var(--bai-muted); font-size: .7rem; font-weight: 650; }

.simulator-field .form-control,
.simulator-field .form-select { min-height: 42px; border-radius: 4px; font-size: .84rem; }

.simulator-option-editor { display: grid; gap: .75rem; padding-top: 1rem; }

.simulator-option-row { border: 1px solid #d7e0ed; background: #f9fbfe; }

.simulator-option-row > header { min-height: 40px; display: flex; align-items: center; justify-content: space-between; padding: .45rem .75rem; border-bottom: 1px solid #d7e0ed; }

.simulator-option-row > header strong { color: var(--bai-strong); font-size: .78rem; }

.simulator-remove-option { width: 30px; height: 30px; border: 0; color: #7a2d42; background: transparent; }

.simulator-option-fields { display: grid; grid-template-columns: 90px 1.2fr 150px 1fr; align-items: end; gap: .6rem; padding: .75rem; }

.simulator-enabled-option { display: flex; align-items: center; gap: .5rem; padding-bottom: .55rem; color: var(--bai-muted); font-size: .78rem; font-weight: 800; }

.simulator-preview-panel { overflow-y: auto; color: #fff; background: #071b3c; }

.simulator-preview-label { display: flex; align-items: center; justify-content: space-between; margin-bottom: .8rem; }

.simulator-preview-label span { color: var(--bai-aqua); font-size: .72rem; font-weight: 800; text-transform: uppercase; }

.simulator-preview-label small { color: #b8c7df; }

.simulator-screen-preview { min-height: 390px; padding: 1.1rem; border: 12px solid #020812; background: repeating-linear-gradient(0deg, rgba(105,199,223,.025) 0 2px, transparent 2px 6px), #071b3c; box-shadow: 0 24px 55px rgba(0,0,0,.28); }

.simulator-screen-brand { color: #c8d7ef; font-size: .6rem; font-weight: 650; text-align: right; }

.simulator-screen-preview h2 { margin: .35rem 0 .15rem; color: #fff; font-size: clamp(1.25rem, 2vw, 2rem); font-weight: 700; }

.simulator-screen-preview > p { min-height: 34px; margin: 0; color: #c8d7ef; font-size: .76rem; }

.simulator-preview-options { min-height: 250px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(4, 1fr); gap: .45rem .55rem; margin-top: .65rem; }

.simulator-preview-option { min-width: 0; display: grid; grid-template-columns: 22px minmax(0, 1fr) 10px; align-items: center; gap: .35rem; padding: .45rem; border: 1px solid #4775b8; color: #fff; text-align: left; background: #0c2854; }

.simulator-preview-option:hover { border-color: var(--bai-aqua); }

.simulator-preview-position { width: 20px; height: 20px; display: grid; place-items: center; color: var(--bai-blue-900); background: var(--bai-aqua); font-size: .65rem; font-weight: 800; }

.simulator-preview-option strong { min-width: 0; overflow: hidden; font-size: .64rem; line-height: 1.15; }

.simulator-preview-option i { color: var(--bai-aqua); }

.simulator-preview-option[data-position="1"] { grid-area: 1 / 1; }

.simulator-preview-option[data-position="2"] { grid-area: 1 / 2; }

.simulator-preview-option[data-position="3"] { grid-area: 2 / 1; }

.simulator-preview-option[data-position="4"] { grid-area: 2 / 2; }

.simulator-preview-option[data-position="5"] { grid-area: 3 / 1; }

.simulator-preview-option[data-position="6"] { grid-area: 3 / 2; }

.simulator-preview-option[data-position="7"] { grid-area: 4 / 1; }

.simulator-preview-option[data-position="8"] { grid-area: 4 / 2; }

.simulator-preview-input { grid-column: 1 / -1; align-self: center; padding: 1.4rem; border: 2px solid var(--bai-aqua); color: #fff; background: #0c2854; font-size: 1.6rem; font-weight: 700; text-align: center; }

.simulator-preview-key-hint { grid-column: 1 / -1; color: #c8d7ef; text-align: center; }

.simulator-preview-note { display: flex; gap: .5rem; margin: 1rem 0 0; color: #b8c7df; font-size: .72rem; line-height: 1.5; }

.simulator-preview-note i { margin-top: .15rem; color: var(--bai-aqua); }

.simulator-json-view { min-width: 0; }

.simulator-json-heading { display: flex; justify-content: space-between; gap: 1rem; padding: .8rem 1.2rem; color: #dceaff; background: #102b5d; }

.simulator-json-heading span { color: #b8c7df; font-size: .78rem; }

textarea.simulator-json-editor { width: 100%; min-height: 72svh; padding: 1.4rem; border: 0; border-radius: 0; overflow: auto; white-space: pre; color: #dceaff; background: #071b3c; font: 500 .84rem/1.6 Consolas, "Courier New", monospace; resize: vertical; }

.simulator-json-editor:focus { color: #fff; background: #071b3c; box-shadow: inset 0 0 0 3px var(--bai-aqua); }

.simulator-admin-foot { display: flex; align-items: center; justify-content: space-between; gap: 2rem; margin-top: 1rem; padding: 1rem 1.2rem; border: 1px solid var(--bai-line); background: var(--bai-surface); }

.simulator-admin-foot strong { color: var(--bai-strong); }

.simulator-admin-foot p { margin: .25rem 0 0; color: var(--bai-muted); font-size: .82rem; }

.editor-language-block { display: grid; gap: 1rem; margin-top: 1rem; padding: 1.25rem; border: 1px solid #c9d8ea; background: #f4f8fd; }

.editor-language-block > header { display: flex; align-items: center; gap: .75rem; padding-bottom: .85rem; border-bottom: 1px solid #d6e2f0; }

.editor-language-block > header > span,
.language-field-badge,
.cms-translation-label span { display: inline-grid; min-width: 30px; height: 25px; place-items: center; padding-inline: .35rem; color: var(--bai-blue-900); background: var(--bai-aqua); font-size: .68rem; font-weight: 800; }

.editor-language-block header strong,
.editor-language-block header small { display: block; }

.editor-language-block header strong { color: var(--bai-strong); }

.editor-language-block header small { margin-top: .1rem; color: var(--bai-muted); }

.cms-translation-label { display: flex; align-items: center; gap: .5rem; margin-top: .9rem; color: var(--bai-strong); font-weight: 650; }

/* Editor bilingue lado-a-lado (PT | EN) */
.lang-head { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: .5rem; }

.lang-head-col { display: flex; align-items: center; gap: .5rem; font-weight: 700; color: var(--bai-strong); }

.lang-tag { display: inline-grid; min-width: 28px; height: 22px; place-items: center; padding-inline: .3rem; border-radius: 5px; color: var(--bai-blue-900); background: var(--bai-aqua); font-size: .66rem; font-weight: 800; }

.lang-tag.en { background: #d9b45a; }

.lang-copy-all { margin-left: auto; padding: .25rem .6rem; border: 1px solid var(--bai-line); border-radius: 6px; background: #fff; color: var(--bai-blue); font-size: .78rem; font-weight: 650; cursor: pointer; }

.lang-copy-all:hover { background: var(--bai-soft); }

.lang-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: start; }
/* Conteúdo longo (blocos): PT e EN empilhados a toda a largura para o texto e a
   pré-visualização respirarem, em vez de duas colunas estreitas lado a lado. */
.lang-pair-wide { grid-template-columns: 1fr; gap: 1.5rem; }

.lang-en { position: relative; }

.lang-copy { position: absolute; top: .4rem; right: .4rem; z-index: 3; padding: .15rem .45rem; border: 1px solid var(--bai-line); border-radius: 5px; background: rgba(255,255,255,.9); color: var(--bai-blue); font-size: .72rem; font-weight: 700; cursor: pointer; }

.lang-copy:hover { background: var(--bai-cloud); }

.lang-copy.inline { position: static; margin-top: .35rem; display: inline-block; }

.lang-en-aside { position: relative; }

@media (max-width: 860px) {
  .lang-head, .lang-pair { grid-template-columns: 1fr; }
  .lang-head-col:first-child { display: none; }
}

.document-library {
  margin-top: clamp(3rem, 7vw, 6rem);
  padding-top: clamp(2rem, 4vw, 3.5rem);
  border-top: 1px solid var(--bai-line);
}

.document-library-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 2.5rem;
}

.document-library-heading h2 { margin: 0; color: var(--bai-strong); font-size: clamp(2.3rem, 5vw, 4.8rem); line-height: .95; font-weight: 800; }

.document-library-heading > span { color: var(--bai-accent); font-weight: 650; white-space: nowrap; }

.document-group { display: grid; grid-template-columns: minmax(180px, .3fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 4rem); padding: 1.75rem 0; border-top: 1px solid var(--bai-line); }

.document-group h3 { margin: .25rem 0 0; color: var(--bai-strong); font-size: 1.05rem; font-weight: 700; }

.document-list { min-width: 0; }

.document-list a { min-height: 70px; display: grid; grid-template-columns: 30px minmax(0, 1fr) 22px; align-items: center; gap: .8rem; padding: .8rem 0; border-bottom: 1px solid var(--bai-line); color: var(--bai-ink); transition: color .2s ease, padding .2s ease; }

.document-list a:hover,
.document-list a:focus-visible { padding-left: .6rem; color: var(--bai-accent); }

.document-list > a > i:first-child { color: #31558d; font-size: 1.3rem; }

.document-list > a > i:last-child { color: var(--bai-aqua-strong); }

.document-list span { min-width: 0; }

.document-list strong,
.document-list small { display: block; }

.document-list strong { line-height: 1.35; }

.document-list small { margin-top: .2rem; color: var(--bai-muted); font-size: .75rem; font-weight: 800; }

/* Documentos regulamentares (FIN, Formulário do Depositante, Condições Gerais, Preçário) — destaque */
.document-list a.is-regulatory {
  padding-left: .7rem; padding-right: .7rem; border-bottom: none; margin-bottom: .4rem;
  border-radius: 10px; border: 1px solid var(--bai-line); background: var(--bai-soft, rgba(0,0,0,.02));
}
.document-list a.is-regulatory > i:first-child { color: var(--bai-accent); }
.document-list a.is-regulatory small { color: var(--bai-accent); }
.document-list .document-dl { color: var(--bai-muted); font-size: .95rem; }

/* Assistência a cartões 24h (vinti4/SISP) — requisito BCV */
.card-support-strip {
  display: flex; gap: 1rem; align-items: flex-start; margin: 1.5rem 0;
  padding: 1.1rem 1.3rem; border-radius: var(--radius-md, 12px);
  border: 1px solid var(--bai-line); border-left: 4px solid var(--bai-accent);
  background: var(--bai-surface, #fff);
}
.card-support-strip > i { color: var(--bai-accent); font-size: 1.5rem; margin-top: .1rem; flex: none; }
.card-support-strip strong { display: block; color: var(--bai-strong); font-size: 1.05rem; }
.card-support-strip p { margin: .35rem 0 .5rem; color: var(--bai-muted); line-height: 1.6; }
.card-support-phones { display: flex; flex-wrap: wrap; gap: .6rem 1.5rem; }
.card-support-phone { display: inline-flex; align-items: baseline; gap: .5rem; font-weight: 800; font-size: 1.1rem; color: var(--bai-blue); text-decoration: none; }
.card-support-phone:hover { color: var(--bai-accent); }
.card-support-phone small { font-weight: 700; font-size: .72rem; color: var(--bai-muted); }

/* Editor de produtos — documentos */
.product-doc-add .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.product-docs-list { margin-top: 1.5rem; }
.product-docs-list .doc-url { font-size: .8rem; color: var(--bai-blue); word-break: break-all; }
@media (max-width: 640px) { .product-doc-add .form-row { grid-template-columns: 1fr; } }

/* Indicador de documento regulamentar em falta (FIN/Depositante/Condições Gerais) */
.doc-missing { display: block; margin-top: .25rem; color: #b3521a; font-weight: 800; font-size: .72rem; }
.doc-missing i { margin-right: .3rem; }
tr.prod-doc-missing { box-shadow: inset 3px 0 0 #d99100; }

.content-blocks article p { white-space: pre-line; }

/* FAQ — acordeão agrupado por categoria */
.faq-groups { max-width: 860px; }
.faq-group-title {
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: var(--bai-tracking-caps);
  text-transform: uppercase;
  color: var(--bai-accent);
  margin: 2.4rem 0 .9rem;
}
.faq-group-title:first-child { margin-top: 0; }
.faq-accordion { display: flex; flex-direction: column; gap: .6rem; }
.faq-item {
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-md);
  background: var(--bai-card);
  overflow: hidden;
  transition: border-color var(--motion-fast) var(--ease-out), box-shadow var(--motion-fast) var(--ease-out);
}
.faq-item[open] { border-color: var(--bai-accent); box-shadow: var(--shadow-sm); }
.faq-item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  cursor: pointer;
  list-style: none;
  padding: 1rem 1.15rem;
  font-weight: 700;
  color: var(--bai-strong);
  line-height: 1.4;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover { color: var(--bai-blue); }
.faq-item summary i {
  flex: none;
  color: var(--bai-accent);
  transition: transform var(--motion-fast) var(--ease-out);
}
.faq-item[open] summary i { transform: rotate(180deg); }
.faq-item summary:focus-visible { outline: 2px solid var(--bai-accent); outline-offset: -2px; }
.faq-answer {
  padding: 0 1.15rem 1.15rem;
  color: var(--bai-muted);
  line-height: 1.65;
}
.faq-answer a { color: var(--bai-blue); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.faq-answer a:hover { color: var(--bai-accent); }

@media (max-width: 700px) {
  .document-library-heading { align-items: flex-start; flex-direction: column; }

  .document-group { grid-template-columns: 1fr; gap: .75rem; }
}

@media (max-width: 1349px) {
  .simulator-visual-editor { height: auto; grid-template-columns: 230px minmax(360px, 1fr); }

  .simulator-preview-panel { grid-column: 1 / -1; }

  .simulator-screen-preview { width: min(760px, 100%); min-height: 0; aspect-ratio: 960 / 620; margin-inline: auto; }
}

@media (min-width: 1350px) and (max-width: 1700px) {
  .simulator-option-fields { grid-template-columns: 90px minmax(0, 1fr); }

  .simulator-screen-preview h2 { max-width: 100%; font-size: 1.45rem; line-height: 1.05; overflow-wrap: anywhere; }
}

@media (max-width: 850px) {
  .simulator-editor-toolbar,
.simulator-editor-actions,
.simulator-admin-foot { align-items: stretch; flex-direction: column; }

  .simulator-editor-toolbar .btn { width: 100%; }

  .simulator-view-switch button { flex: 1; justify-content: center; }

  .simulator-visual-editor { grid-template-columns: 1fr; }

  .simulator-flow-panel { min-height: 320px; border-right: 0; border-bottom: 1px solid var(--bai-line); }

  .simulator-property-panel { border-right: 0; border-bottom: 1px solid var(--bai-line); }

  .simulator-property-fields,
.simulator-option-fields { grid-template-columns: 1fr; }

  .simulator-screen-preview { min-height: 0; }

  textarea.simulator-json-editor { min-height: 60svh; font-size: .76rem; }
}

@media (max-width: 1000px) {
  .home-story-sequence .baidirecto-feature { aspect-ratio: auto; min-height: 720px; }

  .home-story-sequence .feature-photo img { object-fit: cover; object-position: center; }

  .product-catalog-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 680px) {
  .home-story-sequence .feature-photo::after { background: linear-gradient(0deg, rgba(5,20,45,.94), rgba(5,20,45,.22) 80%); }

  .home-story-sequence .feature-copy { justify-content: end; margin: 0 1rem; padding-bottom: 7rem; }

  .home-story-sequence .feature-copy h2 { font-size: clamp(3rem, 15vw, 5rem); }

  .home-story-sequence .section-bridge { left: 1rem; bottom: calc(50% - 18px); }

  .home-story-sequence .campaign-strip { min-height: 680px; clip-path: polygon(0 3rem,100% 0,100% 100%,0 100%); }

  .product-catalog-grid { grid-template-columns: 1fr; }

  .catalog-product-featured { grid-column: auto; display: block; }

  .catalog-product-featured .catalog-product-media { min-height: 0; aspect-ratio: 16 / 9; }

  .catalog-toolbar { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .home-story-sequence .feature-photo img,
.home-story-sequence .campaign-media img,
.catalog-product,
.catalog-product-media img { transform: none !important; transition: none !important; }
}

.people-hero-overlay {
  background:
    linear-gradient(90deg, rgba(5, 20, 45, .9) 0%, rgba(5, 20, 45, .68) 34%, rgba(5, 20, 45, .2) 68%, rgba(5, 20, 45, .34) 100%),
    linear-gradient(0deg, rgba(5, 20, 45, .82) 0%, transparent 42%);
}

.people-hero-copy {
  position: relative;
  z-index: 2;
  width: min(720px, calc(100% - 2rem));
  min-height: calc(100svh - var(--header-height));
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-left: clamp(1rem, 5vw, 5rem);
  padding: clamp(2rem, 4vw, 3.5rem) 0 clamp(7rem, 12vh, 8.5rem);
}

.people-hero-copy h1 {
  margin: 0 0 1.1rem;
  max-width: 700px;
  font-size: clamp(3.7rem, 6.8vw, 7.25rem);
  line-height: .9;
  font-weight: 800;
  letter-spacing: 0;
}

.people-hero-copy p:not(.brand-kicker) {
  max-width: 560px;
  margin: 0;
  color: rgba(255, 255, 255, .84);
  font-size: clamp(1.1rem, 1.5vw, 1.35rem);
  line-height: 1.5;
}

.hero-service-dock {
  position: absolute;
  z-index: 3;
  left: clamp(1rem, 5vw, 5rem);
  right: clamp(1rem, 5vw, 5rem);
  bottom: 1rem;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 26px;
  background: rgba(255, 255, 255, .13);
  box-shadow: 0 24px 80px rgba(0, 0, 0, .26);
  backdrop-filter: blur(18px);
}

.hero-service-dock a {
  min-height: 88px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .4rem;
  padding: 1.2rem;
  border-right: 1px solid rgba(255, 255, 255, .18);
  transition: background .22s ease, transform .22s ease;
}

.hero-service-dock a:last-child {
  border-right: 0;
}

.hero-service-dock a:hover {
  background: rgba(255, 255, 255, .16);
}

.hero-service-dock span,
.moment-tile span {
  color: var(--bai-aqua);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.hero-service-dock strong {
  color: #fff;
  font-size: 1rem;
  line-height: 1.2;
}

.life-moments {
  background: var(--bai-surface);
}

.moment-grid {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  grid-template-rows: repeat(2, minmax(260px, 1fr));
  gap: 1rem;
}

.moment-tile {
  position: relative;
  min-height: 300px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  padding: 1.4rem;
  border-radius: 30px;
  color: #fff;
  background: var(--bai-blue-900);
  isolation: isolate;
}

.moment-large {
  grid-row: 1 / span 2;
  min-height: 560px;
}

.moment-tile img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .55s ease;
}

.moment-tile::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(0deg, rgba(5, 20, 45, .86), rgba(5, 20, 45, .18) 62%),
    linear-gradient(90deg, rgba(5, 20, 45, .34), transparent);
}

.moment-tile:hover img {
  transform: scale(1.05);
}

.moment-tile strong {
  display: block;
  max-width: 620px;
  margin: .45rem 0;
  font-size: clamp(1.55rem, 3.2vw, 3.2rem);
  line-height: 1;
  font-weight: 800;
}

.moment-tile:not(.moment-large) strong {
  font-size: clamp(1.35rem, 2vw, 2.1rem);
}

.moment-tile small {
  max-width: 530px;
  color: rgba(255, 255, 255, .78);
  font-size: 1rem;
}

.baidirecto-feature {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, .65fr);
  min-height: 640px;
  background: var(--bai-soft);
}

.feature-photo {
  min-height: 520px;
  overflow: hidden;
}

.feature-photo img {
  width: 100%;
  height: 100%;
  min-height: 640px;
  object-fit: cover;
  object-position: center;
}

/* Mobile: min-height:640px forçava a foto a ser muito mais alta que larga → corte severo.
   Usa um aspeto 16/10 (a narrativa em scroll .home-story-sequence é mais específica e mantém-se). */
@media (max-width: 640px) {
  .feature-photo { min-height: 0; }
  .feature-photo img { min-height: 0; height: auto; aspect-ratio: 16 / 10; }
}

.feature-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(2rem, 5vw, 5rem);
}

.feature-copy h2,
.campaign-copy h2 {
  margin: 0 0 1rem;
  font-size: clamp(2.8rem, 5.4vw, 6.2rem);
  line-height: .9;
  font-weight: 800;
}

.feature-copy p:not(.eyebrow),
.campaign-copy p {
  max-width: 500px;
  color: var(--bai-muted);
  font-size: 1.16rem;
  line-height: 1.55;
}

.campaign-strip {
  position: relative;
  min-height: 560px;
  display: grid;
  align-items: end;
  overflow: hidden;
  color: #fff;
  background: var(--bai-blue-900);
}

.campaign-media {
  position: absolute;
  inset: 0;
}

.campaign-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.campaign-strip::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(5, 20, 45, .88), rgba(5, 20, 45, .42) 48%, rgba(5, 20, 45, .16));
}

.campaign-copy {
  position: relative;
  z-index: 1;
  max-width: 680px;
  padding: clamp(2rem, 6vw, 5rem);
}

.campaign-copy p {
  color: rgba(255, 255, 255, .8);
}

/* Telemóvel: a campanha em destaque costuma ser um banner pré-composto (com texto/logos
   embutidos). Cortar para uma faixa alta esconde esse conteúdo → "imagem cortada".
   Aqui mostramos o banner INTEIRO (sem corte) e a copy do CMS flui por baixo. */
@media (max-width: 575.98px) {
  .campaign-strip {
    min-height: 0;
    display: block;
    background: var(--bai-blue-900);
  }
  .campaign-media { position: relative; inset: auto; }
  .campaign-media img { height: auto; object-fit: contain; }
  .campaign-strip::after { display: none; }
  .campaign-copy { position: relative; max-width: none; padding: 1.25rem 1.1rem 1.75rem; }
}

.trust-actions {
  padding: 1rem 0;
  background: var(--bai-blue-900);
}

.trust-actions-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 24px;
  background: rgba(255, 255, 255, .14);
}

.trust-actions-grid a {
  min-height: 112px;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.25rem;
  color: #fff;
  background: rgba(255, 255, 255, .06);
  font-weight: 700;
}

.trust-actions-grid i {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #071b3c;
  background: var(--bai-aqua);
}

@keyframes heroPhotoIn {
  from { opacity: 0; transform: scale(1.12); }
  12% { opacity: 1; }
  to { opacity: 1; transform: scale(1.0); }
}

.footer-brand img {
  width: 190px;
  filter: brightness(0) invert(1);
}

.navbar .nav-link {
  position: relative;
  color: var(--bai-header-ink, var(--bai-ink));
  font-weight: 650;
  font-size: .95rem;
  padding-inline: 1rem !important;
}

.navbar .nav-link::after {
  content: "";
  position: absolute;
  left: 1rem;
  right: 1rem;
  bottom: .2rem;
  height: 2px;
  background: var(--bai-blue);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .22s ease;
}

.navbar .nav-link:hover {
  color: var(--bai-accent);
}

.navbar .nav-link:hover::after {
  transform: scaleX(1);
}

.eyebrow {
  display: block;
  margin-bottom: .8rem;
  color: var(--bai-eyebrow);
  font-size: .77rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

/* Em secções de fundo escuro (constante nos dois temas) o eyebrow mantém
   o aqua da marca, que aí tem contraste 8.7:1. */
.page-hero .eyebrow,
.content-hero .eyebrow,
.search-hero .eyebrow,
.institutional-hero-copy .eyebrow,
.product-detail-copy .eyebrow,
.people-hero .eyebrow,
.atm-hero .eyebrow,
.atm-simulator-stage .eyebrow,
.atm-showcase .eyebrow,
.campaign-strip .eyebrow,
.document-strip .eyebrow,
.site-footer .eyebrow,
.article-header .eyebrow,
.campaign-modal .eyebrow {
  color: var(--bai-aqua);
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
  margin-top: 2rem;
}

.section-pad {
  padding: clamp(4rem, 8vw, 7rem) 0;
  scroll-margin-top: var(--header-height);
}

section {
  scroll-margin-top: var(--header-height);
}

.section-heading {
  max-width: 790px;
  margin-bottom: 2.1rem;
}

.section-heading.compact {
  margin-bottom: 1.25rem;
}

.section-heading h2,
.page-hero h1,
.login-panel h1,
.admin-workspace h1 {
  font-size: clamp(2rem, 5vw, 4.4rem);
  line-height: .98;
  letter-spacing: 0;
  font-weight: 800;
}

/* Variante de título de secção mais contida (títulos grandes destoavam). */
.section-heading.section-heading-sm h2 {
  font-size: clamp(1.55rem, 2.9vw, 2.35rem);
  line-height: 1.08;
}

.product-rail {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  overflow: visible;
  padding: .25rem 0 0;
}

.branch-grid,
.compliance-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.product-tile,
.branch-grid article,
.compliance-grid article,
.news-panel,
.cookie-console,
.login-panel,
.admin-panel {
  border: 1px solid var(--bai-line);
  border-radius: 18px;
  background: var(--bai-card);
  box-shadow: var(--shadow-sm);
}

.product-tile {
  min-height: 280px;
  padding: 1.35rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-width: 0;
  transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
}

.product-tile:hover {
  transform: translateY(-7px);
  border-color: rgba(34, 63, 127, .38);
  box-shadow: 0 28px 70px rgba(34, 63, 127, .14);
}

.product-tile span,
.branch-grid span,
.admin-row span,
.muted {
  color: var(--bai-muted);
  font-size: .9rem;
}

.product-tile h2,
.product-tile h3,
.branch-list h3,
.branch-grid h2,
.compliance-grid h2 {
  margin: .7rem 0;
  font-size: 1.35rem;
  font-weight: 800;
}

.product-tile strong {
  color: var(--bai-accent);
}

.product-tile-cta {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  margin-top: 1rem;
  color: var(--bai-accent);
  font-weight: 700;
  font-size: .92rem;
}

.premium-rail .product-tile:nth-child(even) .product-tile-cta { color: var(--bai-aqua); }

.product-tile-cta i { transition: transform var(--motion-fast) var(--ease-out); }

.product-tile:hover .product-tile-cta i { transform: translateX(4px); }

.product-detail-hero {
  position: relative;
  /* Reduzido em 04/09/2026: o hero ocupava mais de meio ecrã e cortava demasiado a imagem. */
  min-height: clamp(300px, 36svh, 440px);
  overflow: hidden;
  color: #fff;
  background: var(--bai-blue-900);
}

.product-detail-media,
.product-detail-overlay {
  position: absolute;
  inset: 0;
}

.product-detail-media {
  background-size: cover;
  /* centrado (era 30% do topo) e sem o zoom de 3%, que cortava mais imagem sem necessidade */
  background-position: center;
}

.product-detail-overlay {
  background:
    linear-gradient(90deg, rgba(5, 20, 45, .9), rgba(5, 20, 45, .58) 48%, rgba(5, 20, 45, .18)),
    linear-gradient(0deg, rgba(5, 20, 45, .82), transparent 46%);
}

.product-detail-copy {
  position: relative;
  z-index: 2;
  width: min(760px, calc(100% - 2rem));
  min-height: calc(100svh - var(--header-height));
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-left: clamp(1rem, 5vw, 5rem);
  padding: clamp(3rem, 6vw, 5rem) 0;
}

.product-detail-copy h1 {
  margin: 0 0 1rem;
  font-size: clamp(3.4rem, 7vw, 7.8rem);
  line-height: .9;
  font-weight: 800;
}

.product-detail-copy p:not(.brand-kicker) {
  max-width: 650px;
  color: rgba(255, 255, 255, .82);
  font-size: clamp(1.08rem, 1.5vw, 1.32rem);
  line-height: 1.55;
}

.back-link {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  width: fit-content;
  margin-bottom: 1.2rem;
  color: rgba(255, 255, 255, .78);
  font-weight: 650;
}

.back-link:hover {
  color: #fff;
}

.product-detail-body {
  background: var(--bai-surface);
}

.product-detail-grid {
  display: grid;
  grid-template-columns: minmax(280px, .42fr) minmax(0, 1fr);
  gap: clamp(1rem, 4vw, 3rem);
  align-items: start;
}

.product-summary-panel {
  position: sticky;
  top: calc(var(--header-height) + 1rem);
  padding: 1.4rem;
  border: 1px solid rgba(34, 63, 127, .13);
  border-radius: 26px;
  background:
    radial-gradient(circle at 100% 0%, rgba(105, 199, 223, .22), transparent 34%),
    var(--bai-soft);
  box-shadow: 0 20px 65px rgba(19, 32, 51, .07);
}

/* SÓ o «eyebrow» (filho direto). Com «.product-summary-panel span» qualquer <span> criado
   pelo editor (ex.: tamanho de letra no resumo) herdava azul, maiúsculas, negrito e
   display:block — daí o texto ficar azul e com um espaço enorme por baixo. */
.product-summary-panel > span {
  display: block;
  margin-bottom: .8rem;
  color: var(--bai-aqua);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.product-summary-panel h2 {
  margin: 0 0 1.4rem;
  font-size: clamp(1.45rem, 2.2vw, 2.3rem);
  line-height: 1.05;
  font-weight: 800;
}

.product-info-stack {
  display: grid;
  gap: 1rem;
}

.product-info-stack article {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 1rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--bai-line);
}

.product-info-stack i {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--bai-accent);
  background: var(--bai-cloud);
}

.product-info-stack h2 {
  margin: 0 0 .45rem;
  font-size: clamp(1.4rem, 2.4vw, 2.4rem);
  font-weight: 800;
}

.product-info-stack p {
  max-width: 900px;
  margin: 0;
  color: var(--bai-muted);
  font-size: 1.05rem;
  line-height: 1.65;
}

.document-strip {
  display: grid;
  grid-template-columns: minmax(260px, .45fr) minmax(0, 1fr);
  gap: 1rem;
  margin-top: clamp(3rem, 6vw, 5rem);
  padding: 1.4rem;
  border-radius: 28px;
  color: #fff;
  background:
    radial-gradient(circle at 100% 0%, rgba(105, 199, 223, .2), transparent 28%),
    var(--bai-dots-light),
    linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue));
}

.document-strip h2 {
  margin: 0;
  font-size: clamp(1.4rem, 2.2vw, 1.9rem);
  line-height: 1.1;
  font-weight: 800;
  text-wrap: balance;
}

.document-strip .document-list {
  display: grid;
  gap: .7rem;
  min-width: 0;
}

.document-strip .document-list a {
  display: flex;
  align-items: center;
  gap: .9rem;
  min-height: 76px;
  padding: .9rem;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 18px;
  color: #fff;
  background: rgba(255, 255, 255, .08);
  transition: background var(--motion-fast) var(--ease-out);
}

.document-strip .document-list a:hover,
.document-strip .document-list a:focus-visible {
  padding-left: .9rem;
  color: #fff;
  background: rgba(255, 255, 255, .16);
}

.document-strip .document-list i {
  color: var(--bai-aqua);
  font-size: 1.25rem;
}

.document-strip .document-list strong,
.document-strip .document-list small {
  display: block;
}

.document-strip .document-list strong {
  color: #fff;
}

.document-strip .document-list small {
  color: rgba(255, 255, 255, .68);
  margin-top: .2rem;
}

.network-section {
  background: var(--bai-surface);
}

.branch-list {
  border-top: 1px solid var(--bai-line);
}

.branch-list article {
  padding: 1.2rem 0;
  border-bottom: 1px solid var(--bai-line);
}

.branch-list p {
  margin: 0 0 .25rem;
  color: var(--bai-muted);
}

.branch-list span {
  color: var(--bai-accent);
  font-weight: 800;
}

.news-panel {
  padding: 1.5rem;
  background:
    radial-gradient(circle at 100% 0%, rgba(105, 199, 223, .22), transparent 35%),
    var(--bai-soft);
}

.news-panel a {
  display: block;
  padding: 1rem 0;
  border-top: 1px solid var(--bai-line);
}

.news-panel time,
.news-panel span {
  display: block;
  color: var(--bai-muted);
  font-size: .9rem;
}

.news-panel strong {
  display: block;
  margin: .35rem 0;
}

.page-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(4rem, 8vw, 7rem) 0;
  color: #fff;
  background:
    radial-gradient(circle at 86% 12%, rgba(105, 199, 223, .22), transparent 26%),
    var(--bai-dots-light),
    linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue));
}

.page-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .16;
  background-image: radial-gradient(circle, #fff 1.2px, transparent 1.4px);
  background-size: 24px 24px;
  mask-image: linear-gradient(90deg, transparent, #000);
}

.page-hero > * {
  position: relative;
  z-index: 1;
}

.page-hero p {
  max-width: 700px;
  color: rgba(255, 255, 255, .78);
  font-size: 1.15rem;
}

.filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: 1.5rem;
}

/* Paginador reutilizável das listas do backoffice (_Pagination.cshtml) */
.admin-pager {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-top: 1rem;
}
.admin-pager-info { color: var(--bai-muted); font-size: .85rem; font-weight: 650; }
.admin-pager-controls { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.admin-pager-page { font-weight: 700; color: var(--bai-strong); padding: 0 .5rem; font-size: .9rem; }
.admin-pager-btn {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .5rem .8rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-md, 10px);
  color: var(--bai-strong);
  text-decoration: none;
  font-weight: 650;
  font-size: .85rem;
  background: var(--bai-card, #fff);
  transition: border-color var(--motion-fast,.15s) var(--ease-out,ease), color var(--motion-fast,.15s) var(--ease-out,ease);
}
.admin-pager-btn:hover { border-color: var(--bai-accent); color: var(--bai-accent); }
.admin-pager-btn.disabled { opacity: .45; pointer-events: none; }

/* Botão de tradução automática nos editores */
.translate-tool { display: inline-flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.btn-translate[disabled] { opacity: .55; cursor: not-allowed; }
.translate-status { font-size: .82rem; font-weight: 650; color: var(--bai-muted); }
.translate-status.is-busy { color: var(--bai-accent); }
.translate-config-link { font-size: .8rem; font-weight: 650; color: var(--bai-accent); text-decoration: none; }
.translate-config-link:hover { text-decoration: underline; }

.filter-bar a {
  padding: .65rem .95rem;
  border: 1px solid var(--bai-line);
  border-radius: 999px;
  font-weight: 650;
  background: var(--bai-surface);
}

.filter-bar a.active,
.filter-bar a:hover {
  color: #fff;
  background: var(--bai-blue);
  border-color: var(--bai-accent);
}

.branch-grid article,
.compliance-grid article {
  padding: 1.35rem;
}

.branch-grid a {
  display: block;
  color: var(--bai-accent);
  font-weight: 650;
}

.branch-grid small {
  display: block;
  margin-top: .75rem;
  color: var(--bai-muted);
}

.branch-filter {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(200px, .45fr) auto;
  gap: .8rem;
  align-items: stretch;
  margin-bottom: 1rem;
}

.branch-count {
  color: var(--bai-muted);
  font-weight: 800;
}

.branch-grid .directions-link {
  margin-top: 1rem;
  font-size: .9rem;
}

@media (max-width: 720px) {
  .branch-filter {
    grid-template-columns: 1fr;
  }
}

.compliance-grid i {
  color: var(--bai-accent);
  font-size: 1.7rem;
}

.cookie-console {
  margin-top: 1.5rem;
  padding: 1.35rem;
}

.cookie-preferences {
  border: 1px solid rgba(34, 63, 127, .13);
  border-radius: 22px;
  background: var(--bai-surface);
  box-shadow: 0 24px 70px rgba(19, 32, 51, .08);
  overflow: hidden;
}

.cookie-preferences-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.5rem;
  background:
    radial-gradient(circle at 100% 0%, rgba(105, 199, 223, .18), transparent 30%),
    var(--bai-soft);
}

.cookie-preferences-header h2,
.cookie-policy-note h2 {
  margin: 0;
  font-size: clamp(1.6rem, 3vw, 2.7rem);
  font-weight: 800;
}

.cookie-preferences-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
}

.cookie-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 0;
  border-top: 1px solid var(--bai-line);
}

.preference-row {
  padding-inline: 1.5rem;
}

.cookie-row span {
  display: block;
  color: var(--bai-muted);
}

.cookie-policy-note {
  margin-top: 1.2rem;
  padding: 1.35rem;
  border-left: 4px solid var(--bai-blue);
  border-radius: 18px;
  background: var(--bai-cloud);
}

.cookie-policy-note p {
  max-width: 880px;
  margin: .7rem 0 0;
  color: var(--bai-muted);
}

.cookie-banner {
  position: fixed;
  left: clamp(1rem, 3vw, 2rem);
  right: clamp(1rem, 3vw, 2rem);
  bottom: 1rem;
  z-index: 80;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 1rem;
  align-items: center;
  padding: 1rem;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 22px;
  color: #fff;
  background:
    radial-gradient(circle at 96% 0%, rgba(105, 199, 223, .22), transparent 30%),
    rgba(7, 27, 60, .94);
  box-shadow: 0 26px 80px rgba(0, 0, 0, .28);
  backdrop-filter: blur(18px);
  opacity: 0;
  transform: translateY(18px);
  pointer-events: none;
  transition: opacity .25s ease, transform .25s ease;
}

.cookie-banner.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.cookie-banner.is-hidden {
  opacity: 0;
  transform: translateY(18px);
  pointer-events: none;
}

/* Se crescer (opções de configuração), nunca cobrir o ecrã todo — faz scroll interno. */
.cookie-banner { max-height: min(82vh, 560px); overflow-y: auto; }

/* Configuração inline (aparece ao clicar em "Configurar") */
.cookie-banner-options {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1.4rem;
  padding: .6rem 0;
  margin-top: .2rem;
  border-top: 1px solid rgba(255, 255, 255, .18);
}
.cookie-opt { display: inline-flex; align-items: center; gap: .5rem; font-size: .88rem; color: #fff; cursor: pointer; }
.cookie-opt input { width: 18px; height: 18px; accent-color: var(--bai-aqua); }
.cookie-opt small { color: rgba(255, 255, 255, .6); }
.cookie-more-link { align-self: center; color: var(--bai-aqua); font-size: .82rem; text-decoration: underline; }

.cookie-banner span {
  display: block;
  margin-bottom: .25rem;
  color: var(--bai-aqua);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.cookie-banner strong {
  display: block;
}

.cookie-banner p {
  margin: .25rem 0 0;
  color: rgba(255, 255, 255, .72);
}

.cookie-banner .btn-link {
  color: #fff;
  text-decoration: none;
  font-weight: 650;
}

.cookie-banner-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .55rem;
}

.login-shell {
  min-height: calc(100svh - var(--header-height));
  display: grid;
  place-items: center;
  padding: 2rem;
  background:
    radial-gradient(circle at 70% 25%, rgba(105, 199, 223, .26), transparent 28%),
    linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue));
}

.login-panel {
  width: min(520px, 100%);
  padding: clamp(1.5rem, 4vw, 2.5rem);
}

.login-panel p {
  color: var(--bai-muted);
}

.admin-sidebar {
  position: sticky;
  top: 0;
  min-height: 100svh;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  background:
    radial-gradient(circle at 20% 0%, rgba(105, 199, 223, .22), transparent 24%),
    var(--bai-blue-900);
  color: #fff;
}

.admin-sidebar .brand-mark img {
  width: 168px;
  filter: brightness(0) invert(1);
}

.admin-sidebar nav {
  display: grid;
  gap: .35rem;
}

.admin-sidebar nav a {
  padding: .85rem;
  border-radius: 12px;
  color: rgba(255, 255, 255, .78);
  font-weight: 800;
}

.admin-sidebar nav a.active,
.admin-sidebar nav a:hover {
  color: #fff;
  background: rgba(255, 255, 255, .1);
}

/* Navegação do backoffice em grupos colapsáveis (menu mais curto e organizado). */
.admin-nav-top { font-size: .95rem; }
.admin-nav-group { border-radius: 12px; }
.admin-nav-group > summary {
  list-style: none; cursor: pointer; padding: .7rem .85rem; border-radius: 12px;
  color: var(--bai-aqua, #69c7df); font-size: .72rem; font-weight: 800;
  letter-spacing: .06em; text-transform: uppercase; display: flex; align-items: center; gap: .6rem;
}
.admin-nav-group > summary::-webkit-details-marker { display: none; }
.admin-nav-group > summary::after {
  content: "\f078"; font-family: "Font Awesome 6 Free"; font-weight: 900;
  margin-left: auto; font-size: .7rem; opacity: .6; transition: transform .2s ease;
}
.admin-nav-group[open] > summary::after { transform: rotate(180deg); }
.admin-nav-group > summary:hover { color: #fff; background: rgba(255,255,255,.06); }
.admin-nav-group > a {
  padding: .6rem .85rem .6rem 2.4rem; font-size: .9rem; font-weight: 650;
  color: rgba(255,255,255,.72); display: block; border-radius: 10px;
}
.admin-nav-group > a.active { color: #fff; background: rgba(255,255,255,.12); font-weight: 800; }
.admin-nav-group > a:hover { color: #fff; background: rgba(255,255,255,.08); }

/* Dashboard: cartões «requer atenção», métricas com ícone e linhas clicáveis. */
.dash-attention { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px,100%),1fr)); gap: .75rem; margin-bottom: 1.25rem; }
.dash-attention-card { display: flex; align-items: center; gap: .9rem; padding: 1rem 1.15rem; border-radius: var(--radius-md,12px); border: 1px solid var(--bai-line); background: var(--bai-card,#fff); text-decoration: none; color: inherit; border-left-width: 4px; }
.dash-attention-card:hover { box-shadow: 0 6px 18px rgba(0,0,0,.06); }
.dash-attention-card i { font-size: 1.4rem; }
.dash-attention-card.is-warning { border-left-color: #d99100; } .dash-attention-card.is-warning i { color: #d99100; }
.dash-attention-card.is-info { border-left-color: var(--bai-accent,#1f6fb2); } .dash-attention-card.is-info i { color: var(--bai-accent,#1f6fb2); }
.dash-attention-card strong { font-size: 1.5rem; display: block; line-height: 1; color: var(--bai-strong); }
.dash-attention-card span { color: var(--bai-muted); font-size: .9rem; }
.dash-metrics article { position: relative; }
.dash-metrics article i { position: absolute; top: 1rem; right: 1rem; font-size: 1.1rem; color: var(--bai-accent,#1f6fb2); opacity: .5; }
.dash-link { font-size: .85rem; font-weight: 700; color: var(--bai-accent); text-decoration: none; }
.dash-link:hover { text-decoration: underline; }
a.dash-row-link { text-decoration: none; color: inherit; }
a.dash-row-link:hover { background: var(--bai-soft, rgba(0,0,0,.03)); border-radius: 8px; }

/* Dashboard — gráfico de visitas (SVG) */
.dash-chart { margin-bottom: 1.25rem; }
.dash-chart-caption { color: var(--bai-muted); font-size: .9rem; margin: .1rem 0 .75rem; }
.dash-chart-caption strong { color: var(--bai-strong); }
.dash-chart-svg { width: 100%; height: 150px; display: block; overflow: visible; }
.dash-chart-svg rect { fill: var(--bai-accent, #1f6fb2); opacity: .85; transition: opacity var(--motion-fast, .15s) var(--ease-out, ease); }
.dash-chart-svg rect:hover { opacity: 1; fill: var(--bai-blue, #0b2a5b); }
.dash-chart-axis { display: flex; justify-content: space-between; margin-top: .4rem; font-size: .72rem; font-weight: 700; color: var(--bai-muted); }

/* Documentos: origem/localização do URL + realce de possíveis duplicados. */
.doc-origin { display: inline-block; padding: .08rem .5rem; border-radius: 999px; font-size: .72rem; font-weight: 800; margin-right: .4rem; white-space: nowrap; }
.doc-origin-bancobai { background: color-mix(in srgb, #d99100 22%, transparent); color: #a56a00; }
.doc-origin-externo { background: color-mix(in srgb, var(--bai-accent,#1f6fb2) 16%, transparent); color: var(--bai-accent,#1f6fb2); }
.doc-origin-local { background: color-mix(in srgb, var(--bai-success,#1c7c4a) 18%, transparent); color: var(--bai-success,#1c7c4a); }
.doc-url { font-size: .8rem; color: var(--bai-muted); word-break: break-all; }
.doc-dup { background: color-mix(in srgb, #d99100 7%, transparent); }
.doc-dup-tag { color: #a56a00; font-weight: 700; }

/* Analytics: formulário de geração do relatório PDF por datas. */
.analytics-report-form { display: flex; flex-wrap: wrap; gap: .75rem; align-items: flex-end; }
.analytics-report-form label { display: flex; flex-direction: column; gap: .2rem; font-size: .82rem; font-weight: 700; color: var(--bai-muted); }
.analytics-report-form input[type="date"] { padding: .5rem .6rem; border: 1px solid var(--bai-line); border-radius: 8px; background: var(--bai-surface, #fff); color: var(--bai-strong); }

.admin-sidebar i {
  width: 22px;
}

.admin-workspace {
  padding: clamp(1rem, 3vw, 2rem);
}

.admin-workspace > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.admin-role {
  padding: .65rem .85rem;
  border-radius: 999px;
  background: var(--bai-surface);
  border: 1px solid var(--bai-line);
  font-weight: 800;
}

.admin-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.admin-metrics article {
  padding: 1.2rem;
  background: var(--bai-surface);
  border: 1px solid var(--bai-line);
  border-radius: 18px;
}

.admin-metrics span {
  display: block;
  font-size: 2.6rem;
  line-height: 1;
  font-weight: 800;
  color: var(--bai-accent);
}

.admin-metrics p {
  margin: .5rem 0 0;
  color: var(--bai-muted);
}

.admin-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-top: 1rem;
}

.admin-panel {
  padding: 1.2rem;
}

.panel-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .75rem;
}

.panel-heading h2 {
  font-size: 1.2rem;
  font-weight: 800;
}

.panel-heading span {
  color: var(--bai-muted);
}

.admin-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .9rem 0;
  border-top: 1px solid var(--bai-line);
}

.admin-row strong,
.admin-row span {
  display: block;
}

.theme-toggle { width: 28px; height: 26px; display: grid; place-items: center; padding: 0; border: 1px solid rgba(255,255,255,.28); border-radius: 6px; color: rgba(255,255,255,.85); background: transparent; font-size: .78rem; transition: color var(--motion-fast) var(--ease-out), border-color var(--motion-fast) var(--ease-out); }

.theme-toggle:hover { color: #fff; border-color: rgba(255,255,255,.55); }

.language-switch { display: inline-flex; padding: 2px; border: 1px solid rgba(255,255,255,.28); }

.language-switch button { min-width: 30px; height: 26px; padding: 0 .4rem; border: 0; color: rgba(255,255,255,.7); background: transparent; font-size: .7rem; font-weight: 700; }

.language-switch button.active { color: var(--bai-blue-900); background: var(--bai-aqua); }

.site-footer { padding: 0; color: rgba(255,255,255,.76); background-color: var(--bai-blue-900); background-image: var(--bai-dots-light), var(--bai-section-gradient, none); }

/* Ponto de luz suave que deriva da direita para a esquerda sobre o padrão escuro de pontos */
.site-footer, .theme-hero { position: relative; overflow: hidden; isolation: isolate; }

.site-footer::after,
.theme-hero::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 300px;
  height: 300px;
  margin-top: -150px;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
  background: radial-gradient(circle,
    rgba(255, 255, 255, .09) 0%,
    rgba(255, 255, 255, .035) 38%,
    transparent 70%);
  transform: translateX(94vw);
  opacity: 0;
  will-change: transform, opacity;
  animation: dotGlowDrift 13s ease-in-out infinite;
}

.theme-hero::after { animation-duration: 16s; }

@keyframes dotGlowDrift {
  0%   { transform: translateX(94vw); opacity: 0; }
  20%  { opacity: .8; }
  80%  { opacity: .8; }
  100% { transform: translateX(-340px); opacity: 0; }
}

/* Manter o conteúdo acima do brilho */
.footer-shell { position: relative; z-index: 1; }
.theme-hero > * { position: relative; z-index: 1; }

@media (prefers-reduced-motion: reduce) {
  .site-footer::after, .theme-hero::after { animation: none; opacity: 0; }
}

.footer-shell { width: min(100%, 1600px); margin-inline: auto; padding: clamp(2.5rem,5vw,4.5rem) clamp(1.25rem,4vw,4rem) 1.4rem; }

/* Intro largo à esquerda + colunas de links que se ajustam ao número existente
   (3, 4 ou 5 com "Mais") via auto-fit — evita que uma coluna extra caia para
   baixo do intro quando se acrescenta uma secção (ex.: Políticas e regulamentos). */
.footer-primary { display: grid; grid-template-columns: minmax(240px,1.1fr) repeat(auto-fit, minmax(150px,1fr)); gap: clamp(1.5rem,3vw,3.75rem); align-items: start; }

.footer-intro { max-width: 410px; }

.footer-intro p { margin: 1.2rem 0; color: #b8c7df; line-height: 1.65; }

.footer-brand { display: inline-flex!important; margin: 0!important; }

.footer-brand img { width: 168px; }

.footer-direct-link { display: inline-flex!important; align-items: center; gap: .55rem; margin: 0!important; color: var(--bai-aqua)!important; font-weight: 700; }

.site-footer h2 { margin: .2rem 0 1rem; color: #fff; font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }

.footer-column { display: grid; align-content: start; gap: .58rem; }

.footer-column a { width: fit-content; margin: 0; color: #c8d7ef; }

.footer-column a:hover,
.footer-bottom a:hover { color: #fff; }

.footer-governance p { max-width: 430px; margin: 0 0 1.25rem; color: #b8c7df; line-height: 1.65; }

.socials { display: flex; gap: .65rem; }

.socials a { width: 36px; height: 36px; display: grid; place-items: center; color: #fff; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; transition: background .18s ease, border-color .18s ease; }

.socials a:hover,
.socials a:focus-visible { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.5); }

/* --- IABAI: assistente virtual --- */
.iabai-widget {
  position: fixed;
  right: clamp(.9rem, 2.5vw, 1.8rem);
  bottom: clamp(.9rem, 2.5vw, 1.8rem);
  z-index: 110;
  display: grid;
  justify-items: end;
  gap: .8rem;
}

.iabai-launcher {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  padding: .8rem 1.15rem;
  border: 0;
  border-radius: var(--radius-pill);
  color: #fff;
  background:
    radial-gradient(circle at 20% 20%, rgba(105, 199, 223, .45), transparent 55%),
    linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue));
  box-shadow: var(--shadow-lg);
  font-weight: 750;
  letter-spacing: .02em;
  cursor: pointer;
  transition: transform var(--motion-fast) var(--ease-out), box-shadow var(--motion-fast) var(--ease-out);
}

.iabai-launcher:hover {
  transform: translateY(-2px);
}

.iabai-launcher-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #4ecb8d;
  box-shadow: 0 0 0 3px rgba(78, 203, 141, .28);
}

.iabai-panel {
  width: min(392px, calc(100vw - 2rem));
  height: min(560px, calc(100svh - 8rem));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-surface);
  box-shadow: var(--shadow-lg);
}

.iabai-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .9rem 1.1rem;
  color: #fff;
  background:
    var(--bai-dots-light),
    linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue));
}

.iabai-identity {
  display: flex;
  align-items: center;
  gap: .7rem;
}

.iabai-identity strong {
  display: block;
  font-size: .98rem;
  letter-spacing: .04em;
}

.iabai-identity small {
  color: rgba(255, 255, 255, .72);
  font-size: .75rem;
}

.iabai-avatar {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, .16);
  border: 1px solid rgba(255, 255, 255, .35);
  color: var(--bai-aqua);
  font-size: .8rem;
  font-weight: 800;
}

.iabai-close {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 8px;
  color: rgba(255, 255, 255, .85);
  background: rgba(255, 255, 255, .12);
  cursor: pointer;
}

.iabai-messages {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: .6rem;
  padding: 1rem;
  background: var(--bai-soft);
}

.iabai-msg {
  max-width: 86%;
  padding: .65rem .85rem;
  border-radius: 14px;
  font-size: .92rem;
  line-height: 1.5;
}

.iabai-msg p { margin: 0; white-space: pre-wrap; }

.iabai-msg-bot {
  align-self: flex-start;
  border-bottom-left-radius: 4px;
  background: var(--bai-surface);
  border: 1px solid var(--bai-line);
  color: var(--bai-ink);
}

.iabai-msg-user {
  align-self: flex-end;
  border-bottom-right-radius: 4px;
  color: #fff;
  background: var(--bai-blue);
}

.iabai-typing p { letter-spacing: .2em; animation: iabaiPulse 1s ease infinite; }

@keyframes iabaiPulse { 50% { opacity: .35; } }

.iabai-sources {
  display: block;
  margin-top: .45rem;
  color: var(--bai-muted);
  font-size: .72rem;
}

.iabai-launcher-face {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, .18);
  color: #fff;
  font-weight: 800;
  font-size: 1.1rem;
  line-height: 1;
}

.iabai-links {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  margin-top: .6rem;
}

.iabai-links a {
  padding: .3rem .7rem;
  border: 1px solid rgba(105, 199, 223, .5);
  border-radius: var(--radius-pill);
  color: var(--bai-accent);
  background: var(--bai-cloud);
  font-size: .78rem;
  font-weight: 650;
  transition: background var(--motion-fast) var(--ease-out);
}

.iabai-links a:hover {
  background: var(--bai-ice);
}

.iabai-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  padding: .1rem .2rem;
}

.iabai-chips button {
  padding: .42rem .8rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-pill);
  color: var(--bai-accent);
  background: var(--bai-surface);
  font-size: .8rem;
  font-weight: 650;
  cursor: pointer;
  transition: border-color var(--motion-fast) var(--ease-out), background var(--motion-fast) var(--ease-out);
}

.iabai-chips button:hover {
  border-color: rgba(105, 199, 223, .6);
  background: var(--bai-cloud);
}

.iabai-composer {
  display: flex;
  gap: .5rem;
  padding: .75rem;
  border-top: 1px solid var(--bai-line);
  background: var(--bai-surface);
}

.iabai-composer input {
  flex: 1;
  padding: .6rem .85rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-md);
  background: var(--bai-soft);
  color: var(--bai-ink);
  font-family: var(--bai-font);
}

.iabai-composer input:focus {
  outline: none;
  border-color: var(--bai-aqua);
  box-shadow: 0 0 0 3px rgba(105, 199, 223, .3);
}

.iabai-send {
  width: 44px;
  border: 0;
  border-radius: var(--radius-md);
  color: #fff;
  background: var(--bai-blue);
  cursor: pointer;
}

.iabai-disclaimer {
  margin: 0;
  padding: .55rem .9rem .8rem;
  background: var(--bai-surface);
  color: var(--bai-muted);
  font-size: .68rem;
  line-height: 1.45;
}

@media (max-width: 640px) {
  .iabai-launcher-label { display: none; }
  .iabai-launcher { padding: .8rem .9rem; }
}

/* --- Documento legal (proteção de dados) --- */
.legal-doc { max-width: 820px; }

.legal-block { margin-bottom: var(--space-6); }

.legal-block h2 { margin: 0 0 .6rem; font-size: 1.2rem; font-weight: 750; color: var(--bai-strong); }

.legal-block p { color: var(--bai-muted); line-height: 1.7; margin: 0 0 .6rem; }

.legal-block ul { margin: 0; padding-left: 1.2rem; color: var(--bai-muted); }

.legal-block li { margin: .4rem 0; line-height: 1.6; }

.legal-inline-link { color: var(--bai-accent); font-weight: 650; text-decoration: underline; text-underline-offset: 3px; }

.consent-box {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  margin-top: var(--space-6);
  padding: clamp(1.4rem, 3vw, 2rem);
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-soft);
}

.consent-box.is-accepted { border-color: rgba(26,127,78,.4); background: var(--chip-good-bg, #e4f3ec); }

.consent-copy { flex: 1 1 380px; }

.consent-copy h2 { margin: 0 0 .4rem; font-size: 1.15rem; font-weight: 750; color: var(--bai-strong); }

.consent-copy p { margin: 0; color: var(--bai-muted); font-size: .92rem; line-height: 1.6; }

.consent-actions { display: flex; flex-direction: column; align-items: flex-start; gap: .6rem; }

.consent-state { color: var(--good, #1a7f4e); font-weight: 700; font-size: .9rem; }

/* --- Páginas temáticas (investir, diáspora) --- */
.theme-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(3rem, 6vw, 5.5rem) 0;
  color: #fff;
  background:
    var(--bai-dots-light),
    linear-gradient(135deg, var(--bai-blue-900) 0%, var(--bai-blue-700) 100%);
}

.theme-hero .container-fluid { position: relative; z-index: 1; }

.theme-hero-investir {
  background:
    linear-gradient(115deg, rgba(6,24,50,.9) 0%, rgba(6,24,50,.62) 52%, rgba(6,24,50,.78) 100%),
    url("/img/generated/investir-hero.jpg") center/cover no-repeat;
}

.theme-hero-diaspora {
  background:
    linear-gradient(115deg, rgba(6,24,50,.9) 0%, rgba(6,24,50,.6) 52%, rgba(6,24,50,.78) 100%),
    url("/img/generated/diaspora-hero.jpg") center 30%/cover no-repeat;
}

.theme-hero h1 { margin: .3rem 0 .8rem; max-width: 16ch; font-size: clamp(2.2rem, 4.4vw, 3.6rem); line-height: 1.03; font-weight: 800; text-wrap: balance; }

.theme-hero p { max-width: 58ch; color: #cdddf5; font-size: 1.08rem; line-height: 1.6; }

.theme-hero-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.6rem; }

.theme-intro { max-width: 70ch; margin: 0 auto var(--space-7); text-align: center; }

.theme-intro h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); font-weight: 800; line-height: 1.1; text-wrap: balance; }

.theme-intro p { color: var(--bai-muted); font-size: 1.05rem; line-height: 1.7; }

.stat-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin: 0 auto var(--space-7); overflow: hidden; border: 1px solid var(--bai-line); border-radius: var(--radius-lg); background: var(--bai-line); }

.stat-strip div { padding: 1.3rem 1.2rem; background: var(--bai-surface); }

.stat-strip strong { display: block; font-size: clamp(1.6rem, 3vw, 2.3rem); font-weight: 800; color: var(--bai-strong); font-variant-numeric: tabular-nums; line-height: 1; }

.stat-strip span { color: var(--bai-muted); font-size: .86rem; }

.entity-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1rem; }

.entity-card {
  display: flex;
  flex-direction: column;
  gap: .5rem;
  padding: 1.4rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-md);
  background: var(--bai-card);
  box-shadow: var(--shadow-sm);
  transition: transform var(--motion-fast) var(--ease-out), box-shadow var(--motion-fast) var(--ease-out), border-color var(--motion-fast) var(--ease-out);
}

.entity-card:hover { transform: translateY(-3px); border-color: rgba(105,199,223,.5); box-shadow: var(--shadow-md); }

.entity-card .entity-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: var(--bai-accent); background: var(--bai-cloud); font-size: 1.1rem; }

.entity-card h3 { margin: .2rem 0 0; font-size: 1.05rem; font-weight: 750; }

.entity-card p { margin: 0; color: var(--bai-muted); font-size: .92rem; line-height: 1.55; flex: 1; }

.entity-card a.entity-link { display: inline-flex; align-items: center; gap: .4rem; color: var(--bai-accent); font-weight: 650; font-size: .88rem; }

.entity-card a.entity-link:hover i { transform: translateX(3px); }

.entity-card a.entity-link i { transition: transform var(--motion-fast) var(--ease-out); }

.process-steps { counter-reset: step; display: grid; gap: 1rem; max-width: 820px; }

.process-steps li { counter-increment: step; display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; align-items: start; list-style: none; padding: 1.1rem 0; border-bottom: 1px solid var(--bai-line); }

.process-steps li::before { content: counter(step, decimal-leading-zero); font-family: Consolas, ui-monospace, monospace; font-size: 1.2rem; font-weight: 700; color: var(--bai-accent); }

.process-steps strong { display: block; font-size: 1.05rem; font-weight: 700; margin-bottom: .2rem; }

.process-steps p { margin: 0; color: var(--bai-muted); line-height: 1.6; }

.theme-hero-careers {
  background:
    linear-gradient(100deg, rgba(6,24,50,.92) 0%, rgba(11,42,91,.72) 42%, rgba(11,42,91,.32) 100%),
    url("/img/generated/hero-carreiras.jpg") center right / cover no-repeat,
    var(--bai-section-gradient, linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue-700)));
}

.jobs-list { display: grid; gap: 1rem; }

.job-card {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  padding: 1.5rem 1.75rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-card);
  box-shadow: var(--shadow-sm);
}

.job-card-main { flex: 1 1 340px; }

.job-card h3 { margin: 0 0 .5rem; font-size: 1.2rem; font-weight: 750; }

.job-meta { display: flex; flex-wrap: wrap; gap: .35rem 1.1rem; margin: 0 0 .55rem; color: var(--bai-muted); font-size: .86rem; }

.job-meta i { color: var(--bai-accent); margin-right: .3rem; }

.job-summary { margin: 0; color: var(--bai-muted); line-height: 1.55; }

.job-deadline { margin: .5rem 0 0; color: var(--warn, #b06a10); font-size: .82rem; font-weight: 650; }

.jobs-empty { color: var(--bai-muted); font-size: 1.02rem; }

.application-shell { max-width: 780px; }

.application-form { display: grid; gap: 1rem; margin-top: 1.25rem; }

.application-form .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

.form-file label { font-weight: 650; color: var(--bai-strong); }

.form-consent {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .6rem;
  align-items: start;
  padding: 1rem 1.15rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-md);
  background: var(--bai-soft);
}

.form-consent label { color: var(--bai-muted); font-size: .9rem; line-height: 1.55; }

.form-consent a { color: var(--bai-accent); text-decoration: underline; text-underline-offset: 3px; }

.form-consent .text-danger { grid-column: 1 / -1; }

.form-success {
  display: flex;
  gap: .85rem;
  align-items: center;
  margin-bottom: 1.25rem;
  padding: 1rem 1.25rem;
  border: 1px solid rgba(26,127,78,.4);
  border-radius: var(--radius-md);
  background: var(--chip-good-bg, #e4f3ec);
}

.form-success i { color: var(--good, #1a7f4e); font-size: 1.4rem; }

.form-success strong { display: block; color: var(--bai-strong); }

.form-success span { color: var(--bai-muted); font-size: .92rem; }

@media (max-width: 640px) {
  .application-form .form-row { grid-template-columns: 1fr; }
}

.theme-hero-produtos {
  background:
    linear-gradient(100deg, rgba(6,24,50,.94) 0%, rgba(9,33,72,.78) 44%, rgba(9,33,72,.30) 100%),
    url("/img/generated/cartao-Kriola.jpg") center right / cover no-repeat,
    var(--bai-section-gradient, linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue-700)));
}
.theme-hero-produtos.is-particulares {
  background:
    linear-gradient(100deg, rgba(6,24,50,.94) 0%, rgba(9,33,72,.78) 44%, rgba(9,33,72,.30) 100%),
    url("/img/generated/credito-pessoal.jpg") center right / cover no-repeat,
    var(--bai-section-gradient, linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue-700)));
}
.theme-hero-produtos.is-empresas {
  background:
    linear-gradient(100deg, rgba(6,24,50,.94) 0%, rgba(9,33,72,.78) 44%, rgba(9,33,72,.30) 100%),
    url("/img/generated/empresa.jpg") center right / cover no-repeat,
    var(--bai-section-gradient, linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue-700)));
}

.theme-hero-estabelecimentos {
  background:
    linear-gradient(100deg, rgba(6,24,50,.93) 0%, rgba(9,33,72,.76) 46%, rgba(9,33,72,.32) 100%),
    url("/img/generated/cartao-Kriola.jpg") center / cover no-repeat,
    var(--bai-section-gradient, linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue-700)));
}

.theme-hero-agencias {
  background:
    linear-gradient(100deg, rgba(6,24,50,.93) 0%, rgba(9,33,72,.76) 46%, rgba(9,33,72,.30) 100%),
    url("/img/generated/agencia.jpg") center / cover no-repeat,
    var(--bai-section-gradient, linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue-700)));
}

.theme-hero-noticias {
  /* Só-gradiente (sem foto): usa o mesmo tom do hero padrão, sem sobreposição escura. */
  background:
    var(--bai-dots-light),
    linear-gradient(135deg, var(--bai-blue-900) 0%, var(--bai-blue-700) 100%);
}

.theme-hero-pos {
  /* Mesmo tom do hero padrão; só um aprofundamento radial subtil atrás do
     terminal (lado direito) para o equipamento destacar-se, sem escurecer tudo. */
  background:
    radial-gradient(120% 130% at 82% 48%, rgba(4, 16, 38, .5) 0%, rgba(4, 16, 38, 0) 56%),
    var(--bai-dots-light),
    linear-gradient(135deg, var(--bai-blue-900) 0%, var(--bai-blue-700) 100%);
}

.theme-hero-pos .pos-hero-grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 2.5rem;
  align-items: center;
}

.pos-hero-copy { max-width: 640px; }

.pos-hero-badges {
  list-style: none;
  margin: 1.9rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .65rem 1.4rem;
}
.pos-hero-badges li {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  color: rgba(255, 255, 255, .92);
  font-size: .9rem;
  font-weight: 600;
}
.pos-hero-badges i { color: var(--bai-aqua, #2bb7c4); }

.pos-hero-media {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 400px;
  /* Palco 3D: o parallax inclina o wrapper interno (.pos-hero-stage). A própria
     .pos-hero-media é alvo da animação de entrada do motor de motion, que fixa a
     sua transform — por isso o tilt vai num wrapper que o motor não toca. */
  perspective: 1200px;
}
.pos-hero-stage {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  transform: rotateY(calc(var(--tilt-x, 0) * 1deg)) rotateX(calc(var(--tilt-y, 0) * 1deg));
  transform-style: preserve-3d;
  transition: transform .35s ease-out;
  /* Entrada suave ao carregar: desliza da direita + fade. 'backwards' (não
     'forwards') para não fixar a transform e o parallax continuar a funcionar. */
  animation: posStageEnter .9s var(--ease-out, cubic-bezier(.22, .61, .36, 1)) backwards;
}
@keyframes posStageEnter {
  from { opacity: 0; transform: translateX(64px); }
  to   { opacity: 1; transform: translateX(0); }
}
.pos-hero-glow {
  position: absolute;
  width: 440px;
  height: 440px;
  max-width: 90%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(43, 183, 196, .42) 0%, rgba(43, 183, 196, 0) 65%);
  filter: blur(8px);
  z-index: 0;
  animation: posGlowPulse 7s ease-in-out infinite;
}
/* Sombra projetada que encolhe quando o terminal "levanta" — reforça a flutuação. */
.pos-hero-shadow {
  position: absolute;
  bottom: 7%;
  width: 300px;
  max-width: 60%;
  height: 46px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, 0) 72%);
  filter: blur(7px);
  z-index: 0;
  animation: posShadowBreath 7s ease-in-out infinite;
}
.pos-hero-device {
  position: relative;
  z-index: 1;
  width: min(100%, 560px);
  height: auto;
  filter: drop-shadow(0 32px 55px rgba(0, 0, 0, .5));
  transform-origin: 50% 60%;
  will-change: transform;
  animation: posDeviceFloat 7s ease-in-out infinite;
}
@keyframes posDeviceFloat {
  0%, 100% { transform: translateY(0) rotate(0) scale(1); }
  50%      { transform: translateY(-20px) rotate(-1.6deg) scale(1.02); }
}
@keyframes posGlowPulse {
  0%, 100% { opacity: .72; transform: scale(1); }
  50%      { opacity: 1;   transform: scale(1.09); }
}
@keyframes posShadowBreath {
  0%, 100% { transform: scale(1);   opacity: .55; }
  50%      { transform: scale(.78); opacity: .32; }
}

@media (max-width: 900px) {
  .theme-hero-pos .pos-hero-grid { grid-template-columns: 1fr; gap: 1.5rem; }
  /* Todas as animações do palco POS são mantidas. O overflow:hidden apenas contém a entrada
     (translateX) e o brilho decorativo dentro do palco, evitando que ultrapassem o ecrã. */
  .pos-hero-media { order: -1; min-height: 240px; overflow: hidden; }
  .pos-hero-device { width: min(70%, 320px); }
  .pos-hero-glow { width: 320px; height: 320px; max-width: 82%; }
}

@media (prefers-reduced-motion: reduce) {
  .pos-hero-device, .pos-hero-glow, .pos-hero-shadow { animation: none; }
  .pos-hero-stage { transform: none; transition: none; animation: none; }
}

.pos-terminals {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1.25rem;
}

.pos-terminal {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 1.75rem 1.5rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-card);
  box-shadow: var(--shadow-sm);
}

.pos-terminal img {
  height: 200px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  margin-bottom: 1rem;
}

.pos-terminal h3 { margin: 0 0 .4rem; font-size: 1.15rem; font-weight: 750; }

.pos-terminal p { margin: 0; color: var(--bai-muted); font-size: .92rem; line-height: 1.55; }

/* Grupo BAI — missão, visão e valores */
.group-purpose { margin-top: 3rem; }

.purpose-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }

.purpose-card {
  padding: 1.75rem 2rem;
  border-radius: var(--radius-lg);
  border: 1px solid var(--bai-line);
  background: var(--bai-card);
  box-shadow: var(--shadow-sm);
  position: relative;
  overflow: hidden;
}

.purpose-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: var(--bai-blue);
}

.purpose-vision::before { background: var(--bai-aqua); }

.purpose-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--bai-accent);
  margin-bottom: .75rem;
}

.purpose-card p { margin: 0; font-size: 1.12rem; line-height: 1.55; color: var(--bai-strong); font-weight: 500; }

.values-heading { margin-top: 2.5rem; }

.values-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 1rem; }

.value-card {
  padding: 1.5rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-card);
}

.value-icon {
  display: grid; place-items: center;
  width: 48px; height: 48px;
  border-radius: 13px;
  background: var(--bai-cloud);
  color: var(--bai-accent);
  font-size: 1.3rem;
  margin-bottom: .9rem;
}

.value-card h3 { margin: 0 0 .4rem; font-size: 1.05rem; font-weight: 750; }
.value-card p { margin: 0; color: var(--bai-muted); font-size: .9rem; line-height: 1.55; }

/* Relatório & Contas — KPIs e evolução */
.report-kpis { margin-top: 3rem; }

.rc-yearbar { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.5rem; }
.rc-pill {
  padding: .5rem 1.1rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-pill, 999px);
  background: var(--bai-card);
  color: var(--bai-strong);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  transition: background .15s, border-color .15s, color .15s;
}
.rc-pill:hover { border-color: var(--bai-accent); }
.rc-pill.active { background: var(--bai-navy, #0b2a5b); border-color: var(--bai-navy, #0b2a5b); color: #fff; }

.rc-panel { display: none; }
.rc-panel.active { display: block; }

.rc-download { margin-top: 1.25rem; display: inline-flex; align-items: center; }

.report-charts { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; margin-top: 1.75rem; }
.report-bar.accent { background: linear-gradient(180deg, var(--bai-aqua, #2bb7c4), #0f7d8a); }

/* Gráfico de evolução dinâmico */
.rc-evochart { position: relative; margin-top: 1.75rem; }
.rc-chart-unit { color: var(--bai-muted); font-weight: 500; font-size: .85rem; }
.rc-metric-tabs { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1.35rem; }
.rc-metric {
  padding: .42rem .9rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-pill, 999px);
  background: var(--bai-card);
  color: var(--bai-strong);
  font-size: .84rem;
  font-weight: 650;
  cursor: pointer;
  transition: background .15s, border-color .15s, color .15s;
}
.rc-metric:hover { border-color: var(--bai-accent); }
.rc-metric.active { background: var(--bai-navy, #0b2a5b); border-color: var(--bai-navy, #0b2a5b); color: #fff; }
.rc-evochart .report-bar-col { cursor: default; outline: none; }
.rc-evochart .report-bar { background: linear-gradient(180deg, var(--bai-blue), var(--bai-navy, #0b2a5b)); }
.rc-evochart .report-bar-col:hover .report-bar,
.rc-evochart .report-bar-col:focus-visible .report-bar { filter: brightness(1.12); }
.rc-bar-tip {
  position: absolute;
  transform: translate(-50%, -115%);
  background: var(--bai-navy, #0b2a5b);
  color: #fff;
  padding: .5rem .7rem;
  border-radius: 10px;
  font-size: .8rem;
  line-height: 1.35;
  box-shadow: var(--shadow-md, 0 12px 28px rgba(0,0,0,.22));
  pointer-events: none;
  z-index: 5;
  white-space: nowrap;
  text-align: center;
}
.rc-bar-tip strong { display: block; font-size: .82rem; }
.rc-tip-yoy { display: block; opacity: .82; font-size: .72rem; margin-top: .12rem; }

@media (max-width: 820px) {
  .report-charts { grid-template-columns: 1fr; }
}

.kpi-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }

.kpi-card {
  padding: 1.3rem 1.5rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-card);
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  gap: .35rem;
}

.kpi-card.kpi-ratio { background: linear-gradient(135deg, var(--bai-navy, #0b2a5b), var(--bai-blue-700)); border-color: transparent; }
.kpi-card.kpi-ratio .kpi-label, .kpi-card.kpi-ratio .kpi-value { color: #fff; }
.kpi-card.kpi-ratio .kpi-delta { color: rgba(255,255,255,.85); }

.kpi-label { font-size: .82rem; color: var(--bai-muted); font-weight: 600; }
.kpi-value { font-size: 1.7rem; font-weight: 800; color: var(--bai-strong); line-height: 1.1; font-variant-numeric: tabular-nums; }
.kpi-delta { font-size: .82rem; font-weight: 700; display: inline-flex; align-items: center; gap: .35rem; }
.kpi-delta small { font-weight: 500; color: var(--bai-muted); }
.kpi-delta.up { color: var(--good, #1a7f4e); }
.kpi-delta.down { color: var(--bad, #c0392b); }

.report-chart-panel {
  padding: 1.75rem 2rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-card);
  box-shadow: var(--shadow-sm);
}

.report-chart-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: 1.25rem; }
.report-chart-head h3 { margin: 0; font-size: 1.1rem; font-weight: 750; }
.report-chart-head h3 span { color: var(--bai-muted); font-weight: 500; font-size: .85rem; }
.report-chart-head p { margin: 0; color: var(--bai-muted); font-size: .85rem; }

.report-bars { display: flex; align-items: stretch; gap: 1rem; height: 240px; padding-top: 1.25rem; }

.report-bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: .4rem; }

.report-bar-val { font-size: .8rem; font-weight: 700; color: var(--bai-strong); font-variant-numeric: tabular-nums; }
.report-bar-track { flex: 1 1 auto; min-height: 0; width: 100%; display: flex; align-items: flex-end; justify-content: center; }
.report-bar {
  width: 100%;
  max-width: 64px;
  border-radius: 8px 8px 0 0;
  background: linear-gradient(180deg, var(--bai-blue), var(--bai-navy, #0b2a5b));
  min-height: 6px;
  transition: height .6s cubic-bezier(.22,.61,.36,1);
}
.report-bar-year { font-size: .82rem; color: var(--bai-muted); font-weight: 600; }

.report-trend { display: flex; flex-wrap: wrap; gap: 1.25rem; margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--bai-line); }
.report-trend span { font-size: .88rem; font-weight: 650; color: var(--bai-strong); display: inline-flex; align-items: center; gap: .4rem; }
.report-trend i { color: var(--good, #1a7f4e); }

.report-disclaimer { margin-top: 1.25rem; color: var(--bai-muted); font-size: .82rem; display: flex; gap: .5rem; align-items: baseline; }
.report-disclaimer i { color: var(--bai-accent); }

.analytics-empty { color: var(--bai-muted); font-size: .88rem; padding: .5rem 0; }

@media (max-width: 720px) {
  .purpose-grid { grid-template-columns: 1fr; }
  .report-bars { height: 180px; }
}

/* Construtor de páginas — editor (backoffice) */
.pb-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-bottom: 1rem; padding: .6rem .75rem; border: 1px dashed var(--bai-line); border-radius: 10px; background: var(--bai-soft); }
.pb-toolbar-label { font-weight: 700; font-size: .85rem; color: var(--bai-strong); margin-right: .3rem; }
.pb-blocks { display: grid; gap: 1rem; }
.pb-block { border: 1px solid var(--bai-line); border-radius: var(--radius-md, 12px); background: #fff; overflow: hidden; }
.pb-block-head { display: flex; align-items: center; justify-content: space-between; padding: .55rem .85rem; background: var(--bai-soft); border-bottom: 1px solid var(--bai-line); }
.pb-block-type { font-weight: 750; font-size: .9rem; color: var(--bai-strong); }
.pb-block-type i { color: var(--bai-accent); margin-right: .35rem; }
.pb-block-actions { display: flex; gap: .3rem; }
.pb-remove { color: var(--bad, #c0392b); }
.pb-block-body { padding: .9rem 1rem; display: grid; gap: .7rem; }
.pb-field .form-label { font-size: .82rem; font-weight: 600; margin-bottom: .2rem; color: var(--bai-muted); }
.pb-cards { display: grid; gap: .5rem; margin-bottom: .5rem; }
.pb-card-row { display: grid; grid-template-columns: 1fr 1fr 1.4fr auto; gap: .4rem; align-items: center; }
.admin-nav-box { border: 1px solid var(--bai-line); border-radius: 10px; padding: .9rem 1rem; background: var(--bai-soft); }
@media (max-width: 640px) { .pb-card-row { grid-template-columns: 1fr; } }

/* Construtor de páginas — blocos públicos */
.builder-block-heading { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 750; color: var(--bai-strong); margin: 0 0 1rem; }
.builder-richtext { color: var(--bai-ink); font-size: 1.05rem; line-height: 1.7; max-width: 760px; }
.builder-richtext a { color: var(--bai-accent); text-decoration: underline; text-underline-offset: 2px; }
.builder-block-image figure { margin: 0; }
.builder-block-image img { width: 100%; height: auto; border-radius: var(--radius-lg, 16px); box-shadow: var(--shadow-sm); }
.builder-block-image figcaption { margin-top: .6rem; color: var(--bai-muted); font-size: .88rem; text-align: center; }
.builder-cta {
  padding: clamp(2rem, 5vw, 3.5rem);
  border-radius: var(--radius-xl, 22px);
  background: var(--bai-dots-light), linear-gradient(135deg, var(--bai-navy, #0b2a5b), var(--bai-blue-700));
  color: #fff;
  text-align: center;
}
.builder-cta .eyebrow { color: var(--bai-aqua, #57c7d4); }
.builder-cta h2 { color: #fff; font-size: clamp(1.6rem, 3.4vw, 2.4rem); margin: 0 0 .6rem; }
.builder-cta p { color: rgba(255,255,255,.86); max-width: 640px; margin: 0 auto 1.5rem; }

/* Faixa de pré-visualização (backoffice) */
.preview-banner {
  position: sticky;
  top: 0;
  z-index: 60;
  background: repeating-linear-gradient(45deg, #b06a10, #b06a10 12px, #9a5c0d 12px, #9a5c0d 24px);
  color: #fff;
  padding: .55rem 0;
  font-size: .9rem;
  box-shadow: 0 2px 10px rgba(0,0,0,.25);
}
.preview-banner strong { font-weight: 800; }
.preview-banner i { margin-right: .4rem; }

/* Caminho hierárquico (breadcrumbs) */
.breadcrumbs {
  background: var(--bai-soft);
  border-bottom: 1px solid var(--bai-line);
}
.breadcrumbs ol {
  list-style: none;
  margin: 0;
  padding: .7rem 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .1rem .1rem;
  font-size: .84rem;
}
.breadcrumbs li { display: inline-flex; align-items: center; }
.breadcrumbs li:not(:first-child)::before {
  content: "\203A"; /* › */
  margin: 0 .5rem;
  color: var(--bai-muted);
  opacity: .7;
  font-size: .95rem;
  line-height: 1;
}
.breadcrumbs a { color: var(--bai-muted); text-decoration: none; }
.breadcrumbs a:hover { color: var(--bai-accent); text-decoration: underline; text-underline-offset: 2px; }
.breadcrumbs [aria-current="page"] { color: var(--bai-strong); font-weight: 650; }

.content-blocks-secondary { border-top: 1px solid var(--bai-line); margin-top: 2.75rem; padding-top: 2rem; }

.shareholder-structure { margin-top: 3rem; }

.shareholder-grid {
  display: grid;
  grid-template-columns: minmax(240px, 340px) 1fr;
  gap: 2.5rem;
  align-items: center;
}

.shareholder-donut { margin: 0; }
.shareholder-donut svg { width: 100%; height: auto; max-width: 340px; display: block; margin-inline: auto; }

.donut-seg { transition: stroke-width .2s ease; }
.donut-seg:hover { stroke-width: 27; }

.donut-center-num { font-size: 26px; font-weight: 800; fill: var(--bai-strong); }
.donut-center-lbl { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; fill: var(--bai-muted); }

.shareholder-legend { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.shareholder-legend li { display: flex; gap: .85rem; align-items: flex-start; }

.legend-swatch { width: 16px; height: 16px; border-radius: 5px; flex: 0 0 16px; margin-top: .28rem; }
.legend-body { flex: 1; min-width: 0; }
.legend-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.legend-head strong { color: var(--bai-strong); font-weight: 700; }
.legend-pct { font-variant-numeric: tabular-nums; font-weight: 800; color: var(--bai-strong); }
.legend-body p { margin: .2rem 0 .45rem; color: var(--bai-muted); font-size: .88rem; }

.legend-bar { height: 7px; border-radius: 999px; background: var(--bai-soft); overflow: hidden; }
.legend-bar span { display: block; height: 100%; border-radius: 999px; transform-origin: left; }

.shareholder-note { margin-top: 1.5rem; color: var(--bai-muted); font-size: .82rem; font-style: italic; }

@media (max-width: 720px) {
  .shareholder-grid { grid-template-columns: 1fr; gap: 1.5rem; }
}

.pos-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem;
  margin-bottom: 2rem;
}

.pos-stat {
  padding: 1.25rem 1.5rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-card);
  box-shadow: var(--shadow-sm);
}

.pos-stat-value { display: block; font-size: 1.9rem; font-weight: 800; color: var(--bai-strong); line-height: 1.1; }
.pos-stat-label { display: block; margin-top: .25rem; color: var(--bai-muted); font-size: .88rem; }

.pos-filter { margin-bottom: 1.1rem; }

.pos-search {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .35rem .5rem .35rem 1rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-pill, 999px);
  background: var(--bai-card);
  max-width: 640px;
}

.pos-search i { color: var(--bai-muted); }
.pos-search input[type="search"] { flex: 1; border: 0; background: transparent; padding: .55rem 0; color: var(--bai-strong); outline: none; }
.pos-search .btn { border-radius: var(--radius-pill, 999px); flex: 0 0 auto; }

.pos-island-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.1rem; }

.pos-chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .4rem .85rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-pill, 999px);
  background: var(--bai-card);
  color: var(--bai-strong);
  font-size: .86rem;
  text-decoration: none;
  transition: background .15s, border-color .15s, color .15s;
}

.pos-chip span { font-size: .75rem; color: var(--bai-muted); background: var(--bai-soft); padding: .05rem .45rem; border-radius: 999px; }
.pos-chip:hover { border-color: var(--bai-accent); }
.pos-chip.active { background: var(--bai-navy, #0b2a5b); border-color: var(--bai-navy, #0b2a5b); color: #fff; }
.pos-chip.active span { color: #fff; background: rgba(255,255,255,.18); }

.pos-result-count { color: var(--bai-muted); font-size: .9rem; margin-bottom: .75rem; }

.pos-merchant-table table { width: 100%; }
.pos-merchant-table thead th { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--bai-muted); border-bottom: 2px solid var(--bai-line); }
.pos-merchant-table tbody td { font-size: .9rem; color: var(--bai-strong); border-bottom: 1px solid var(--bai-line); vertical-align: middle; }
.pos-merchant-name { font-weight: 650; }

.pos-pagination { display: flex; align-items: center; gap: 1rem; justify-content: center; margin-top: 1.5rem; }
.pos-page-indicator { color: var(--bai-muted); font-size: .88rem; }

.pos-disclaimer { margin-top: 1.5rem; color: var(--bai-muted); font-size: .82rem; font-style: italic; }

.pos-merchants-note {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  padding: 1.5rem 1.75rem;
  border: 1px dashed var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-soft);
}

.pos-merchants-note i {
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: var(--bai-accent);
  background: var(--bai-cloud);
  font-size: 1.2rem;
}

.pos-merchants-note p { margin: 0; color: var(--bai-muted); line-height: 1.6; }

/* Checklist de boas práticas do comerciante (página POS). */
.pos-checklist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  /* min(320px,100%) impede que a coluna mínima ultrapasse a largura do cartão
     no telemóvel (senão o texto transborda para fora da secção à direita). */
  grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
  gap: 1rem 2.25rem;
}
.pos-checklist li span { min-width: 0; overflow-wrap: anywhere; }
.pos-checklist li {
  display: flex;
  gap: .75rem;
  align-items: flex-start;
  color: var(--bai-muted);
  line-height: 1.55;
}
.pos-checklist li i {
  flex: none;
  margin-top: .2rem;
  color: var(--bai-accent);
  font-size: 1.05rem;
}
.pos-support-note {
  display: flex;
  gap: .7rem;
  align-items: baseline;
  margin: 1.75rem 0 0;
  padding: 1rem 1.25rem;
  border-radius: var(--radius-lg);
  background: var(--bai-soft);
  color: var(--bai-muted);
  line-height: 1.6;
}
.pos-support-note i { color: var(--bai-accent); }

/* Ritmo visual: faixa de secção com fundo suave + padrão de pontos BAI subtil. */
.section-band { background: var(--bai-dots-light), var(--bai-soft); }

/* "Como recebe o dinheiro" — stepper numerado (layout distinto dos cartões). */
.pos-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.25rem 2rem;
}
.pos-steps li {
  position: relative;
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}
.pos-step-num {
  flex: none;
  font-size: 2.1rem;
  font-weight: 800;
  line-height: .9;
  color: var(--bai-accent);
  font-variant-numeric: tabular-nums;
}
.pos-steps li h3 { margin: 0 0 .3rem; font-size: 1.05rem; font-weight: 750; }
.pos-steps li p { margin: 0; color: var(--bai-muted); font-size: .92rem; line-height: 1.55; }
@media (min-width: 780px) {
  .pos-steps li:not(:last-child)::after {
    content: "";
    position: absolute;
    top: .9rem;
    right: -1rem;
    width: 2rem;
    height: 2px;
    background: linear-gradient(90deg, var(--bai-line), transparent);
  }
}

/* Modalidades — cartões estilo "plano", com um em destaque. */
.pos-plans {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1rem;
}
.pos-plan {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  padding: 1.9rem 1.6rem 1.6rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-card);
  box-shadow: var(--shadow-sm);
  transition: transform var(--motion-fast) var(--ease-out), box-shadow var(--motion-fast) var(--ease-out);
}
.pos-plan:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.pos-plan .entity-icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 12px; color: var(--bai-accent); background: var(--bai-cloud); font-size: 1.2rem; }
.pos-plan h3 { margin: .35rem 0 0; font-size: 1.15rem; font-weight: 780; }
.pos-plan p { margin: 0; color: var(--bai-muted); font-size: .93rem; line-height: 1.55; }
.pos-plan.is-featured {
  border-color: var(--bai-accent);
  box-shadow: 0 22px 46px -24px rgba(27, 52, 109, .6);
}
.pos-plan-badge {
  position: absolute;
  top: -.7rem;
  left: 1.6rem;
  background: var(--bai-accent);
  color: #fff;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: .28rem .7rem;
  border-radius: 999px;
}

/* Boas práticas — painel destacado em vez de texto solto. */
.pos-goodpractices {
  padding: clamp(1.5rem, 3vw, 2.6rem);
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-soft);
}
.pos-goodpractices .section-heading { margin-bottom: 1.4rem; }
.pos-goodpractices .pos-support-note { background: var(--bai-card); }

/* Documentos de adesão — texto à esquerda, botões-cartão à direita. */
.pos-docs {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 2rem;
  align-items: center;
}
.pos-docs-copy .eyebrow { color: var(--bai-accent); }
.pos-docs-title { font-size: clamp(1.5rem, 2.7vw, 2.2rem); font-weight: 800; line-height: 1.1; margin: .2rem 0 .6rem; }
.pos-docs-lead { margin: 0; color: var(--bai-muted); line-height: 1.65; max-width: 52ch; }
.pos-docs-links { display: grid; gap: .8rem; }
.pos-doc-link {
  display: flex;
  align-items: center;
  gap: .9rem;
  padding: 1rem 1.2rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-md);
  background: var(--bai-card);
  color: var(--bai-ink);
  font-weight: 650;
  text-decoration: none;
  transition: transform var(--motion-fast) var(--ease-out), box-shadow var(--motion-fast) var(--ease-out), border-color var(--motion-fast) var(--ease-out);
}
.pos-doc-link:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: rgba(105,199,223,.5); }
.pos-doc-link i { font-size: 1.4rem; color: var(--bai-accent); flex: none; }
.pos-doc-link span { flex: 1; }
.pos-doc-link small { color: var(--bai-muted); font-weight: 600; letter-spacing: .04em; }
@media (max-width: 820px) { .pos-docs { grid-template-columns: 1fr; gap: 1.4rem; } }

/* Secção de destaque: imagem + texto, para dar respiro visual à página. */
.pos-feature {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: center;
}
.pos-feature-media {
  margin: 0;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
  aspect-ratio: 4 / 3;
}
.pos-feature-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pos-feature-copy .eyebrow { color: var(--bai-accent); }
.pos-feature-title { font-size: clamp(1.7rem, 3vw, 2.5rem); font-weight: 800; line-height: 1.08; margin: .3rem 0 .8rem; }
.pos-feature-copy p { color: var(--bai-muted); font-size: 1.05rem; line-height: 1.7; margin: 0 0 1.4rem; max-width: 52ch; }
@media (max-width: 860px) {
  .pos-feature { grid-template-columns: 1fr; }
  .pos-feature-media { aspect-ratio: 16 / 10; }
}
/* Segundo destaque invertido: imagem à direita. */
.pos-feature.is-reverse .pos-feature-media { order: 2; }

/* Marcas de cartões aceites: rótulo + chips numa linha compacta (trocar por logótipos quando houver). */
.pos-cards-strip {
  margin-top: 1.4rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .7rem 1rem;
}
.pos-cards-label {
  color: var(--bai-muted);
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.pos-brand-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem .6rem; }
.pos-brand-chips span {
  display: inline-flex;
  align-items: center;
  padding: .4rem .95rem;
  border: 1px solid var(--bai-line);
  border-radius: 999px;
  background: var(--bai-card);
  color: var(--bai-ink);
  font-weight: 700;
  font-size: .9rem;
  letter-spacing: .02em;
  box-shadow: var(--shadow-sm);
}

/* «Mini-ilustrações»: badges duotone (navy + brilho aqua) em vez de ícones planos. */
.pos-illustrated .entity-icon,
.pos-plans .entity-icon {
  width: 54px;
  height: 54px;
  border-radius: 15px;
  background: linear-gradient(140deg, var(--bai-blue-700) 0%, var(--bai-blue-900) 100%);
  color: #fff;
  font-size: 1.4rem;
  position: relative;
  overflow: hidden;
  box-shadow: 0 12px 24px -14px rgba(7, 27, 60, .7), inset 0 1px 0 rgba(255, 255, 255, .16);
}
.pos-illustrated .entity-icon::after,
.pos-plans .entity-icon::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(130% 110% at 108% -10%, rgba(105, 199, 223, .55), transparent 58%);
  z-index: 0;
}
.pos-illustrated .entity-icon > i,
.pos-plans .entity-icon > i { position: relative; z-index: 1; }

.theme-figure { margin: 0; }

.theme-figure img { width: 100%; height: clamp(240px, 34vw, 420px); object-fit: cover; border-radius: var(--radius-xl); box-shadow: var(--shadow-md); }

.theme-figure figcaption { margin-top: .9rem; color: var(--bai-muted); font-size: .92rem; max-width: 64ch; }

.partner-band {
  margin-top: var(--space-7);
  padding: clamp(2rem, 4vw, 3rem);
  border-radius: var(--radius-xl);
  color: #fff;
  background:
    radial-gradient(circle at 88% 15%, rgba(105,199,223,.22), transparent 40%),
    var(--bai-dots-light),
    linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue));
}

.partner-band h2 { margin: 0 0 .6rem; font-size: clamp(1.6rem, 3vw, 2.4rem); font-weight: 800; max-width: 20ch; }

.partner-band p { max-width: 60ch; color: rgba(255,255,255,.82); line-height: 1.65; }

.partner-band .theme-hero-actions { margin-top: 1.4rem; }

@media (max-width: 720px) {
  .stat-strip { grid-template-columns: repeat(2, 1fr); }
}

/* --- Organigrama dos órgãos sociais --- */
.org-chart {
  display: grid;
  gap: var(--space-4);
  max-width: 1100px;
}

.org-body {
  position: relative;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-card);
  box-shadow: var(--shadow-sm);
  overflow: visible;
}

/* Linha vertical que liga os níveis do organigrama */
.org-body:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 2.4rem;
  bottom: calc(-1 * var(--space-4) - 1px);
  width: 2px;
  height: var(--space-4);
  background: var(--bai-line);
}

.org-body-head {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 1.4rem;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.org-body-title {
  display: grid;
  gap: .1rem;
}

.org-body-title strong {
  font-size: 1.08rem;
  font-weight: 750;
  color: var(--bai-strong);
}

.org-body-title small {
  color: var(--bai-muted);
  font-size: .8rem;
}

.org-body-head .chevron {
  color: var(--bai-accent);
  transition: transform var(--motion-fast) var(--ease-out);
}

.org-body:not(.is-open) .org-body-head .chevron {
  transform: rotate(-90deg);
}

.org-members {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: .75rem;
  padding: 0 1.4rem 1.3rem;
}

.org-body:not(.is-open) .org-members {
  display: none;
}

.org-member {
  display: flex;
  align-items: center;
  gap: .9rem;
  padding: .85rem 1rem;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-md);
  background: var(--bai-surface);
  transition: transform var(--motion-fast) var(--ease-out), box-shadow var(--motion-fast) var(--ease-out), border-color var(--motion-fast) var(--ease-out);
}

.org-member:hover {
  transform: translateY(-2px);
  border-color: rgba(105, 199, 223, .55);
  box-shadow: var(--shadow-md);
}

.org-avatar {
  width: 52px;
  height: 52px;
  flex: 0 0 52px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  color: #fff;
  background:
    radial-gradient(circle at 30% 25%, rgba(105, 199, 223, .5), transparent 55%),
    linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue));
  font-size: .95rem;
  font-weight: 750;
  letter-spacing: .04em;
}

.org-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.org-member-copy {
  display: grid;
  gap: .1rem;
  min-width: 0;
}

.org-member-copy strong {
  font-size: .95rem;
  font-weight: 650;
  line-height: 1.3;
  color: var(--bai-ink);
}

.org-member-copy small {
  color: var(--bai-muted);
  font-size: .8rem;
}

.org-independent {
  justify-self: start;
  margin-top: .25rem;
  padding: .08rem .5rem;
  border-radius: var(--radius-pill);
  background: var(--bai-cloud);
  color: var(--bai-accent);
  font-size: .68rem;
  font-style: normal;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.org-note {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  max-width: 860px;
  margin-top: var(--space-5);
  color: var(--bai-muted);
  font-size: .85rem;
}

.org-note i {
  color: var(--bai-accent);
  margin-top: .2rem;
}

/* --- Números de confiança --- */
.trust-numbers {
  border-bottom: 1px solid var(--bai-line);
  background: var(--bai-surface);
}

.trust-numbers-inner {
  width: min(100%, 1600px);
  margin-inline: auto;
  padding: clamp(1.5rem, 3vw, 2.25rem) clamp(1rem, 5vw, 5rem);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}

.trust-number {
  display: grid;
  gap: .1rem;
}

.trust-number strong {
  font-size: clamp(1.7rem, 3vw, 2.4rem);
  font-weight: 800;
  line-height: 1.05;
  color: var(--bai-strong);
  font-variant-numeric: tabular-nums;
}

.trust-number strong small {
  font-size: .6em;
  font-weight: 700;
  color: var(--bai-aqua);
}

.trust-number > span {
  color: var(--bai-muted);
  font-size: .88rem;
}

@media (max-width: 991px) {
  .trust-numbers-inner {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* --- Palco do ATM 3D na homepage --- */
.atm-showcase {
  padding: clamp(3.5rem, 7vw, 6rem) clamp(1rem, 5vw, 5rem);
  color: #fff;
  background:
    radial-gradient(circle at 16% 18%, rgba(105, 199, 223, .2), transparent 30%),
    var(--bai-dots-light),
    linear-gradient(135deg, var(--bai-blue-900), #1c3d78);
}

.atm-showcase-inner {
  width: min(100%, 1600px);
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, .7fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
}

.atm-showcase-copy h2 {
  max-width: 620px;
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4.4vw, 3.4rem);
  line-height: 1.02;
  font-weight: 800;
}

.atm-showcase-copy p {
  max-width: 560px;
  color: rgba(255, 255, 255, .78);
  font-size: 1.05rem;
}

.btn-outline-light {
  --bs-btn-hover-color: var(--bai-strong);
}

.atm-showcase-visual {
  display: grid;
  place-items: center;
}

.atm-showcase-screen {
  width: min(340px, 100%);
  display: grid;
  gap: .4rem;
  padding: 1.6rem 1.5rem 1.4rem;
  border: 1px solid rgba(255, 255, 255, .25);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(160deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .04));
  box-shadow: var(--shadow-lg), inset 0 0 42px rgba(105, 199, 223, .12);
  backdrop-filter: blur(10px);
  transform: rotate(-2deg);
}

.atm-showcase-screen span {
  color: var(--bai-aqua);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .14em;
}

.atm-showcase-screen strong {
  font-size: 1.08rem;
  font-weight: 700;
  line-height: 1.35;
}

.atm-showcase-screen small {
  color: rgba(255, 255, 255, .66);
}

@media (max-width: 991px) {
  .atm-showcase-inner {
    grid-template-columns: 1fr;
  }
}

/* --- Simulador de crédito --- */
.simulator-section {
  background:
    radial-gradient(circle at 88% 8%, rgba(105, 199, 223, .14), transparent 32%),
    var(--bai-dots-ink),
    linear-gradient(180deg, var(--bai-soft), var(--bai-surface));
}

.simulator-layout {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(320px, 1fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
}

.simulator-copy h2 {
  max-width: 520px;
  margin: 0 0 1rem;
  font-size: clamp(1.9rem, 3.6vw, 2.9rem);
  line-height: 1.05;
  font-weight: 800;
}

.simulator-copy p {
  max-width: 480px;
  color: var(--bai-muted);
  margin-bottom: 1.5rem;
}

.simulator-card {
  padding: clamp(1.5rem, 3vw, 2.25rem);
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-xl);
  background: var(--bai-surface);
  box-shadow: var(--shadow-md);
}

.simulator-field {
  margin-bottom: 1.35rem;
}

.simulator-field-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .4rem;
}

.simulator-field-head label {
  color: var(--bai-muted);
  font-size: .85rem;
  font-weight: 650;
}

.simulator-field-head output {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  color: var(--bai-strong);
}

.simulator-card input[type="range"] {
  width: 100%;
  height: 6px;
  appearance: none;
  border-radius: var(--radius-pill);
  background: var(--bai-ice);
  accent-color: var(--bai-accent);
  cursor: pointer;
}

.simulator-card input[type="range"]::-webkit-slider-thumb {
  appearance: none;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 3px solid #fff;
  background: var(--bai-blue);
  box-shadow: var(--shadow-sm);
}

.simulator-card input[type="range"]::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 3px solid #fff;
  background: var(--bai-blue);
  box-shadow: var(--shadow-sm);
}

.simulator-result {
  display: grid;
  gap: .15rem;
  margin-top: 1.5rem;
  padding: 1.15rem 1.25rem;
  border-radius: var(--radius-lg);
  color: #fff;
  background:
    radial-gradient(circle at 90% 10%, rgba(105, 199, 223, .35), transparent 42%),
    linear-gradient(135deg, var(--bai-blue-900), var(--bai-blue));
}

.simulator-result span {
  color: rgba(255, 255, 255, .75);
  font-size: .82rem;
  font-weight: 650;
  text-transform: uppercase;
  letter-spacing: var(--bai-tracking-caps);
}

.simulator-result strong {
  font-size: clamp(1.8rem, 3.4vw, 2.5rem);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}

.simulator-result small {
  color: rgba(255, 255, 255, .78);
  font-variant-numeric: tabular-nums;
}

.simulator-disclaimer {
  margin: 1rem 0 0;
  color: var(--bai-muted);
  font-size: .78rem;
  line-height: 1.55;
}

@media (max-width: 991px) {
  .simulator-layout {
    grid-template-columns: 1fr;
  }
}

.invest-simulator { margin-top: var(--space-7); }

/* --- Paleta de pesquisa --- */
.search-kbd {
  margin-left: .45rem;
  padding: .1rem .4rem;
  border: 1px solid rgba(34, 63, 127, .25);
  border-radius: 5px;
  font-family: inherit;
  font-size: .68rem;
  font-weight: 650;
  opacity: .75;
}

.search-palette {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: clamp(3rem, 12vh, 9rem) 1rem 1rem;
}

.search-palette-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 27, 60, .55);
  backdrop-filter: blur(4px);
}

.search-palette-box {
  position: relative;
  width: min(640px, 100%);
  max-height: min(560px, 80vh);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-lg);
  background: var(--bai-surface);
  box-shadow: var(--shadow-lg);
}

.search-palette-input {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: 1rem 1.15rem;
  border-bottom: 1px solid var(--bai-line);
}

.search-palette-input i {
  color: var(--bai-muted);
}

.search-palette-input input {
  flex: 1;
  border: 0;
  outline: none;
  font-size: 1.05rem;
  font-family: var(--bai-font);
  color: var(--bai-ink);
  background: transparent;
}

.search-palette-input input:focus-visible {
  box-shadow: none;
}

.search-palette kbd {
  padding: .15rem .45rem;
  border: 1px solid var(--bai-line);
  border-radius: 5px;
  background: var(--bai-soft);
  color: var(--bai-muted);
  font-size: .7rem;
  font-family: inherit;
}

.search-palette-results {
  flex: 1;
  overflow-y: auto;
  padding: .5rem;
}

.search-palette-hint {
  margin: 0;
  padding: 1.25rem 1rem;
  color: var(--bai-muted);
  font-size: .92rem;
  text-align: center;
}

.search-group-label {
  display: block;
  padding: .55rem .75rem .25rem;
  color: var(--bai-muted);
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--bai-tracking-caps);
}

.search-result {
  display: flex;
  gap: .8rem;
  align-items: flex-start;
  padding: .6rem .75rem;
  border-radius: var(--radius-sm);
}

.search-result i {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: var(--bai-accent);
  background: var(--bai-cloud);
  font-size: .85rem;
}

.search-result strong {
  display: block;
  font-size: .95rem;
  font-weight: 650;
  color: var(--bai-ink);
}

.search-result small {
  display: block;
  color: var(--bai-muted);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.search-result:hover,
.search-result.is-active {
  background: var(--bai-soft);
}

.search-result.is-active {
  outline: 2px solid rgba(105, 199, 223, .6);
  outline-offset: -2px;
}

.search-palette-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .65rem 1.15rem;
  border-top: 1px solid var(--bai-line);
  color: var(--bai-muted);
  font-size: .8rem;
}

.search-palette-footer a {
  color: var(--bai-accent);
  font-weight: 650;
}

/* --- Câmbios: dock do hero e página --- */
.dock-rates-list {
  display: grid;
  gap: .1rem;
}

.dock-rates-list strong {
  font-variant-numeric: tabular-nums;
  font-size: .92rem;
}

.rates-header {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: .75rem 1.5rem;
  margin-bottom: var(--space-5);
}

.rates-header h2 {
  margin: 0;
  font-weight: 800;
}

.rates-updated {
  color: var(--bai-muted);
  font-size: .85rem;
}

.rates-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--bai-line);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
}

.rates-table {
  width: 100%;
  margin: 0;
  border-collapse: collapse;
  background: var(--bai-surface);
}

.rates-table th,
.rates-table td {
  padding: .9rem 1.15rem;
  border-bottom: 1px solid var(--bai-line);
  text-align: left;
}

.rates-table thead th {
  background: var(--bai-soft);
  color: var(--bai-muted);
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--bai-tracking-caps);
}

.rates-table tbody tr:last-child td {
  border-bottom: 0;
}

.rates-table .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
}

.rates-table .mono {
  font-family: Consolas, ui-monospace, monospace;
  font-size: .9rem;
  color: var(--bai-muted);
}

.rate-badge {
  display: inline-block;
  margin-left: .55rem;
  padding: .12rem .55rem;
  border-radius: var(--radius-pill);
  background: var(--bai-cloud);
  color: var(--bai-accent);
  font-size: .72rem;
  font-weight: 700;
}

.rates-note {
  display: flex;
  gap: .85rem;
  align-items: flex-start;
  margin-top: var(--space-5);
  padding: 1rem 1.15rem;
  border-radius: var(--radius-md);
  background: var(--bai-soft);
  color: var(--bai-muted);
}

.rates-note i {
  color: var(--bai-accent);
  margin-top: .2rem;
}

.rates-note p {
  margin: 0;
  font-size: .9rem;
  line-height: 1.6;
}

.footer-trust { display: flex; flex-wrap: wrap; gap: 1rem 2.5rem; margin-top: clamp(2.2rem,4vw,3.5rem); padding: 1.15rem 1.25rem; border: 1px solid rgba(255,255,255,.16); border-radius: var(--radius-md); background: rgba(255,255,255,.05); }

.footer-trust-item { display: flex; align-items: center; gap: .65rem; color: #c8d7ef; font-size: .84rem; }

.footer-trust-item i { width: 32px; height: 32px; flex: 0 0 32px; display: grid; place-items: center; border-radius: 50%; color: var(--bai-aqua); background: rgba(105,199,223,.14); }

.footer-trust-item a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

.footer-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid rgba(255,255,255,.14); color: #9fb0c9; font-size: .82rem; }

.footer-bottom nav { display: flex; flex-wrap: wrap; gap: .55rem 1.3rem; }

.footer-bottom a { display: inline; margin: 0; color: #c8d7ef; }

@media (max-width: 991px) {
  .footer-primary { grid-template-columns: 1.3fr 1fr 1fr; }

  .footer-governance { grid-column: 1 / -1; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.12); }
}

@media (max-width: 640px) {
  .footer-primary { grid-template-columns: 1fr 1fr; gap: 2.2rem 1.5rem; }

  .footer-intro,
.footer-governance { grid-column: 1 / -1; }

  .footer-bottom { align-items: flex-start; flex-direction: column; }

  .footer-bottom nav { flex-direction: column; gap: .5rem; }
}

.reveal-on-scroll {
  opacity: 1;
  transform: none;
}

.js-ready .reveal-on-scroll {
  opacity: 1;
  transform: translateY(20px) scale(.98);
}

.js-ready .reveal-on-scroll.is-visible,
.reveal-on-scroll.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition: opacity .62s ease, transform .62s ease;
}

@keyframes riseIn {
  from { opacity: 0; transform: translateY(28px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 991px) {
  :root {
    --header-nav-height: 64px;
  }

  .brand-mark img {
    width: 112px;
  }

  .main-nav > .header-shell {
    flex-wrap: wrap;
  }

  .navbar-collapse {
    width: 100%;
    padding-bottom: .75rem;
  }

  .nav-actions {
    padding: .75rem 0 .25rem;
    flex-wrap: wrap;
  }

  /* Mega-menu em modo lista dentro do colapso */
  .mega-panel {
    position: static;
    translate: none;
    width: 100%;
    padding: .25rem .5rem .75rem;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    transform: none;
    display: none;
    opacity: 1;
    visibility: visible;
  }

  .has-mega.is-open .mega-panel {
    display: block;
    transform: none;
  }

  .mega-lead {
    display: none;
  }

  .mega-grid {
    grid-template-columns: 1fr;
  }

  .mega-grid span {
    display: none;
  }

  .network-layout {
    grid-template-columns: 1fr;
  }

  .stage-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .people-hero,
.people-hero-copy {
    min-height: auto;
  }

  .people-hero-image {
    /* Imagem <img> com object-fit: o enquadramento controla-se com
       object-position (background-position não tem efeito aqui). Foca o
       sujeito à direita e um pouco acima para não cortar rostos no retrato. */
    object-position: 62% 28%;
  }

  .people-hero-copy {
    padding: 4rem 0 11rem;
  }

  .people-hero-copy h1 {
    font-size: clamp(3.2rem, 11vw, 6.4rem);
  }

  .hero-service-dock {
    grid-template-columns: 1fr;
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    margin: -8rem 1rem 1rem;
  }

  .hero-service-dock a {
    min-height: 84px;
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .18);
  }

  .hero-service-dock a:last-child {
    border-bottom: 0;
  }

  .moment-grid,
.baidirecto-feature,
.trust-actions-grid {
    grid-template-columns: 1fr;
  }

  .moment-grid {
    grid-template-rows: none;
  }

  .moment-large {
    grid-row: auto;
    min-height: 460px;
  }

  .feature-photo img {
    min-height: 420px;
  }

  .baidirecto-feature {
    min-height: auto;
  }

  .product-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-detail-hero,
.product-detail-copy {
    min-height: auto;
  }

  .product-detail-copy {
    width: calc(100% - 2rem);
    margin-inline: 1rem;
    padding: 4rem 0;
  }

  .product-detail-copy h1 {
    font-size: clamp(3rem, 11vw, 6rem);
  }

  .product-detail-grid,
.document-strip {
    grid-template-columns: 1fr;
  }

  .product-summary-panel {
    position: static;
  }

  .branch-grid,
.compliance-grid,
.admin-metrics,
.admin-columns,
.cookie-banner {
    grid-template-columns: 1fr 1fr;
  }

  .cookie-banner {
    grid-template-columns: 1fr;
  }

  .cookie-banner-actions {
    justify-content: flex-start;
  }

  .admin-sidebar {
    position: static;
    min-height: auto;
  }
}

@media (max-width: 640px) {
  /* NÃO esconder a utility-bar em mobile — senão perde-se o acesso a Senha de
     Atendimento, alternância de tema (modo) e mudança de língua (PT/EN). Fica visível
     e compacta. */
  .utility-bar { display: block; height: auto; overflow: hidden; }
  /* Muitos links não cabem numa linha em 375px → deixar QUEBRAR (flex-wrap) em vez de
     sair para fora do ecrã. Assim tudo (Senha, Câmbios, Preçário, Área interna, tema, PT/EN)
     fica acessível e nada é cortado à direita. */
  .utility-bar .header-shell {
    height: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .25rem .7rem;
    padding-block: .4rem;
  }
  .utility-group { flex-wrap: wrap; gap: .25rem .7rem; min-width: 0; }
  .utility-bar a { font-size: .72rem; }
  /* Alvos de toque confortáveis para tema e língua */
  .utility-bar .theme-toggle { width: 34px; height: 30px; }
  .language-switch button { min-width: 34px; height: 30px; }
  .site-header.is-condensed .utility-bar { height: 0; }

  :root {
    --header-utility-height: 40px;
    --header-nav-height: 64px;
  }

  .brand-mark img {
    width: 104px;
  }

  .hero-actions .btn {
    width: 100%;
    min-height: 52px;
  }

  .people-hero-copy {
    width: calc(100% - 2rem);
    margin-inline: 1rem;
    padding-top: 3rem;
    padding-bottom: 10rem;
  }

  .people-hero-copy h1 {
    font-size: clamp(2.75rem, 14.5vw, 4.8rem);
    line-height: .94;
  }

  .people-hero-copy p:not(.brand-kicker) {
    font-size: 1.02rem;
  }

  .hero-service-dock {
    margin-top: -8rem;
    border-radius: 22px;
  }

  .hero-service-dock a {
    min-height: 76px;
    padding: 1rem;
  }

  .moment-tile,
.moment-large {
    min-height: 380px;
    border-radius: 24px;
  }

  .moment-tile:not(.moment-large) {
    min-height: 300px;
  }

  .feature-copy,
.campaign-copy {
    padding: 2rem 1rem;
  }

  .campaign-strip {
    min-height: 520px;
  }

  .campaign-media img {
    object-position: 62% center;
  }

  .trust-actions-grid {
    border-radius: 20px;
  }

  .product-rail,
.branch-grid,
.compliance-grid,
.admin-metrics,
.admin-columns {
    grid-template-columns: 1fr;
  }

  .product-detail-copy h1 {
    font-size: clamp(2.7rem, 13vw, 4.8rem);
  }

  .product-info-stack article {
    grid-template-columns: 1fr;
  }

  .document-strip {
    padding: 1rem;
    border-radius: 22px;
  }

  .cookie-preferences-header {
    align-items: flex-start;
    flex-direction: column;
  }
}

.admin-content-shell {
  min-height: 70svh;
  padding: clamp(2rem, 5vw, 4.5rem) clamp(1rem, 5vw, 5rem);
  background: var(--bai-soft);
}

.admin-page-header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 2rem;
  max-width: 1480px;
  margin: 0 auto 2rem;
}

.admin-page-header h1 {
  margin: .4rem 0 0;
  font-size: clamp(2.4rem, 5vw, 4.7rem);
  line-height: 1;
  font-weight: 800;
}

.admin-page-header p:last-child {
  margin: .6rem 0 0;
  color: var(--bai-muted);
}

.back-link.dark {
  color: var(--bai-accent);
}

.admin-hint { max-width: 1480px; margin: 0 auto 1.25rem; color: var(--bai-muted); font-size: .9rem; }
.admin-hint a { color: var(--bai-accent); }
.admin-empty { color: var(--bai-muted); text-align: center; padding: 1.5rem; }
.fin-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.admin-doc-group { max-width: 1480px; margin: 0 auto 1.75rem; }
.admin-doc-group h2 { font-size: 1.1rem; font-weight: 750; margin-bottom: .6rem; }
.admin-doc-slug { color: var(--bai-muted); font-weight: 500; font-size: .82rem; }
.admin-type-tag { display: inline-block; padding: .12rem .55rem; border-radius: 999px; background: var(--bai-soft); color: var(--bai-strong); font-size: .78rem; font-weight: 650; white-space: nowrap; }

/* Editor de conteúdo: barra de formatação + pré-visualização */
.cms-editor-toolbar { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .4rem; }
.cms-editor-btn {
  min-width: 34px;
  padding: .3rem .6rem;
  border: 1px solid var(--bai-line);
  border-radius: 7px;
  background: #fff;
  color: var(--bai-strong);
  font-size: .85rem;
  font-weight: 650;
  cursor: pointer;
  line-height: 1.1;
}
.cms-editor-btn:hover { background: var(--bai-soft); border-color: var(--bai-accent); }
.cms-btn-b { font-weight: 800; }
.cms-btn-i { font-style: italic; }
.cms-preview-toggle { margin-left: auto; }
.cms-preview-toggle.active { background: var(--bai-navy, #0b2a5b); border-color: var(--bai-navy, #0b2a5b); color: #fff; }
.cms-preview {
  margin-top: .6rem;
  padding: 1.1rem 1.25rem;
  border: 1px dashed var(--bai-line);
  border-radius: var(--radius-md, 12px);
  background: var(--bai-surface, #fff);
}
.cms-preview.is-hidden { display: none; }
.cms-preview::before { content: "Pré-visualização"; display: block; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--bai-muted); margin-bottom: .6rem; }
/* A pré-visualização reutiliza .content-blocks (grelha de 2 colunas título|texto),
   que num painel estreito espremia o parágrafo numa coluna fina. No editor
   empilha-se sempre: cabeçalho em cima, texto a toda a largura. */
.cms-preview.content-blocks { max-width: none; }
.cms-preview.content-blocks article {
  display: block;
  gap: 0;
  padding: .9rem 0;
}
.cms-preview.content-blocks article:first-child { padding-top: 0; }
.cms-preview article { margin-bottom: 1rem; }
.cms-preview article:last-child { margin-bottom: 0; }
.cms-preview h2 { font-size: 1.1rem; font-weight: 750; margin: 0 0 .3rem; color: var(--bai-strong); }
.cms-preview p { margin: 0; color: var(--bai-muted); line-height: 1.55; font-size: .92rem; }
.cms-preview a { color: var(--bai-accent); text-decoration: underline; text-underline-offset: 2px; }
.cms-preview-empty { color: var(--bai-muted); font-style: italic; }

/* --- Revisão de pedidos de aprovação: diff legível (nunca JSON) --- */
.filter-count { display: inline-block; min-width: 1.4em; padding: 0 .4em; margin-left: .3em; border-radius: 999px; background: color-mix(in srgb, currentColor 16%, transparent); font-size: .78em; font-weight: 700; text-align: center; }
.review-meta { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; align-items: center; color: var(--bai-muted); font-size: .9rem; margin-bottom: 1rem; }
.review-status { padding: .1rem .6rem; border-radius: 999px; font-weight: 700; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }
.review-status-pendente { background: color-mix(in srgb, #d99100 20%, transparent); color: #a56a00; }
.review-status-aprovado { background: color-mix(in srgb, var(--bai-success) 20%, transparent); color: var(--bai-success); }
.review-status-rejeitado { background: color-mix(in srgb, #c0392b 18%, transparent); color: #c0392b; }
.review-preview { margin-bottom: 1rem; }
.review-headline { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin: 1.75rem 0 .5rem; border-top: 1px solid var(--bai-line); padding-top: 1.25rem; }
.review-headline h2 { margin: 0; font-size: 1.2rem; font-weight: 750; color: var(--bai-strong); }
.review-count { color: var(--bai-muted); font-size: .9rem; font-weight: 600; }
.change-group { font-size: .78rem; text-transform: uppercase; letter-spacing: .07em; color: var(--bai-muted); margin: 1.4rem 0 .6rem; font-weight: 700; }
.change-list { display: grid; gap: .75rem; }
.change-list.compact { gap: .4rem; }
.change-card { border: 1px solid var(--bai-line); border-radius: var(--radius-md, 12px); padding: .85rem 1rem; background: var(--bai-card, #fff); border-left-width: 4px; }
.change-card.is-new { border-left-color: var(--bai-success, #1c7c4a); }
.change-card.is-mod { border-left-color: #d99100; }
.change-card.is-cleared { border-left-color: #c0392b; }
.change-card.is-same { border-left-color: var(--bai-line); }
.change-label { font-weight: 650; color: var(--bai-strong); font-size: .92rem; margin-bottom: .5rem; display: flex; align-items: center; gap: .5rem; }
.change-tag { font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 800; padding: .08rem .5rem; border-radius: 999px; }
.change-tag.new { background: color-mix(in srgb, var(--bai-success) 18%, transparent); color: var(--bai-success); }
.change-tag.mod { background: color-mix(in srgb, #d99100 22%, transparent); color: #a56a00; }
.change-tag.removed { background: color-mix(in srgb, #c0392b 16%, transparent); color: #c0392b; }
.change-values { display: grid; grid-template-columns: 1fr auto 1fr; gap: .75rem; align-items: center; }
.change-values.is-stacked { grid-template-columns: 1fr; }
.change-values.is-stacked .change-arrow { display: none; }
.change-side { min-width: 0; border: 1px solid var(--bai-line); border-radius: 9px; padding: .5rem .65rem; background: var(--bai-surface, #fff); position: relative; }
.change-side.old { background: color-mix(in srgb, #c0392b 6%, var(--bai-surface, #fff)); }
.change-side.new { background: color-mix(in srgb, var(--bai-success) 8%, var(--bai-surface, #fff)); }
.change-side-tag { display: block; font-size: .64rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 800; color: var(--bai-muted); margin-bottom: .3rem; }
.change-arrow { color: var(--bai-muted); }
.change-text { color: var(--bai-strong); font-size: .92rem; word-break: break-word; }
.change-text.is-multiline { white-space: pre-wrap; line-height: 1.5; max-height: 260px; overflow: auto; }
.change-empty { color: var(--bai-muted); font-style: italic; font-size: .88rem; }
.change-img { max-width: 100%; max-height: 130px; border-radius: 8px; display: block; }
.change-swatch { display: inline-block; width: 20px; height: 20px; border-radius: 5px; border: 1px solid var(--bai-line); vertical-align: middle; margin-right: .4rem; }
.change-side code { font-size: .85rem; }
.change-unchanged { margin-top: 1.5rem; }
.change-unchanged > summary { cursor: pointer; font-weight: 600; color: var(--bai-muted); padding: .5rem 0; }
.change-unchanged .change-card.is-same .change-label { margin-bottom: .25rem; }
.review-actions { margin-top: 1.75rem; border-top: 1px solid var(--bai-line); padding-top: 1.25rem; }
@media (max-width: 640px) {
  .change-values { grid-template-columns: 1fr; }
  .change-arrow { transform: rotate(90deg); justify-self: center; }
}

/* --- Utilizadores e perfis (segregação de funções) --- */
.role-legend { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: .75rem; margin: 1rem 0 1.5rem; }
.role-legend-item { border: 1px solid var(--bai-line); border-radius: var(--radius-md, 12px); padding: .85rem 1rem; background: var(--bai-card, #fff); }
.role-legend-item p { margin: .5rem 0 0; color: var(--bai-muted); font-size: .88rem; line-height: 1.5; }
.role-badge { display: inline-flex; align-items: center; padding: .12rem .6rem; border-radius: 999px; font-weight: 700; font-size: .8rem; }
.role-badge.role-admin { background: color-mix(in srgb, var(--bai-navy, #0b2a5b) 16%, transparent); color: var(--bai-navy, #0b2a5b); }
.role-badge.role-operador { background: color-mix(in srgb, var(--bai-accent, #1f6fb2) 16%, transparent); color: var(--bai-accent, #1f6fb2); }
.role-badge.role-aprovador { background: color-mix(in srgb, var(--bai-success, #1c7c4a) 18%, transparent); color: var(--bai-success, #1c7c4a); }
.role-badge.role-auditor { background: color-mix(in srgb, var(--bai-ink-soft, #55607a) 18%, transparent); color: var(--bai-ink-soft, #55607a); }
[data-bs-theme="dark"] .role-badge { color: #fff; }

.admin-table-wrap,
.admin-edit-form {
  max-width: 1480px;
  margin: 0 auto;
  overflow-x: auto;
  background: var(--bai-surface);
  border: 1px solid var(--bai-line);
}

.admin-table {
  min-width: 820px;
  margin: 0;
}

.admin-table th {
  padding: 1rem 1.2rem;
  color: var(--bai-muted);
  background: #f8faff;
  font-size: .78rem;
  text-transform: uppercase;
}

.admin-table td {
  max-width: 440px;
  padding: 1rem 1.2rem;
}

.admin-table td strong,
.admin-table td small {
  display: block;
}

.admin-table td small {
  max-width: 520px;
  overflow: hidden;
  margin-top: .2rem;
  color: var(--bai-muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.status-dot {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: #33425b;
  font-size: .84rem;
  font-weight: 650;
}

.status-dot::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #8994a8;
}

.status-published::before { background: #177245; }

.admin-edit-form {
  padding: clamp(1rem, 3vw, 2rem);
  overflow: visible;
}

.editor-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, .5fr);
  gap: 2rem;
}

.editor-main,
.editor-settings {
  display: grid;
  align-content: start;
  gap: 1rem;
}

.editor-settings {
  padding: 1.25rem;
  background: var(--bai-soft);
  border: 1px solid var(--bai-line);
}

.editor-main textarea.form-control {
  min-height: 160px;
}

.editor-main textarea.compact-textarea {
  min-height: 112px;
}

/* Biografias dos órgãos: caixa alta para textos longos (sem limite de caracteres). */
.editor-main textarea.bio-textarea {
  min-height: 260px;
  line-height: 1.6;
  resize: vertical;
}

.editor-main textarea.editor-body {
  min-height: 380px;
}

.editor-actions {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--bai-line);
}

.admin-config-grid {
  max-width: 1480px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.admin-config-section {
  background: var(--bai-surface);
  border: 1px solid var(--bai-line);
}

.admin-config-section > header {
  display: flex;
  gap: 1rem;
  padding: 1.25rem;
  border-bottom: 1px solid var(--bai-line);
}

.admin-config-section > header i {
  color: var(--bai-accent);
  font-size: 1.4rem;
}

.admin-config-section h2,
.admin-config-section p {
  margin: 0;
}

.admin-config-section h2 {
  font-size: 1.15rem;
  font-weight: 700;
}

.admin-config-section p,
.config-row small {
  color: var(--bai-muted);
}

.config-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  min-height: 82px;
  padding: .85rem 1.25rem;
  border-bottom: 1px solid var(--bai-line);
}

.config-row strong,
.config-row small {
  display: block;
}

@media (max-width: 1100px) {
  .admin-config-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 800px) {
  .admin-page-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .editor-grid {
    grid-template-columns: 1fr;
  }
}

/* Public content architecture */

.editorial-hero,
.support-hero,
.search-hero,
.content-hero {
  color: #fff;
  background: var(--bai-dots-light) var(--bai-blue-900);
}

.editorial-hero-inner,
.support-hero-inner {
  min-height: 420px;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
  align-items: end;
  gap: 3rem;
  padding-top: clamp(4rem, 9vw, 8rem);
  padding-bottom: clamp(3rem, 6vw, 5rem);
}

.editorial-hero h1,
.support-hero h1,
.search-hero h1,
.content-hero h1,
.institutional-hero h1 {
  margin: 0;
  max-width: 980px;
  font-size: clamp(3rem, 7vw, 6.8rem);
  line-height: .94;
  font-weight: 800;
  letter-spacing: 0;
}

.editorial-hero-inner > p,
.support-hero-inner > p {
  margin: 0;
  max-width: 520px;
  color: #dceaff;
  font-size: 1.18rem;
}

.news-archive {
  background: var(--bai-surface);
}

.news-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.4rem, 3vw, 2.5rem) 1.4rem;
}

.news-card {
  min-width: 0;
}

.news-card-media {
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: var(--bai-cloud);
}

.news-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s ease;
}

.news-card:hover .news-card-media img {
  transform: scale(1.035);
}

.news-card-copy {
  padding: 1.2rem .2rem 0;
}

.news-meta {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  color: var(--bai-muted);
  font-size: .82rem;
  font-weight: 800;
}

.news-meta span {
  color: var(--bai-accent);
}

.news-card h2 {
  margin: .75rem 0;
  font-size: clamp(1.25rem, 2vw, 1.7rem);
  line-height: 1.12;
  font-weight: 700;
}

.news-card p {
  color: var(--bai-muted);
}

.text-link {
  color: var(--bai-accent);
  font-weight: 700;
}

.text-link i {
  margin-left: .35rem;
  transition: transform .2s ease;
}

.text-link:hover i {
  transform: translateX(4px);
}

.pagination-nav {
  display: flex;
  gap: .5rem;
  margin-top: 3rem;
}

.pagination-nav a {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid var(--bai-line);
  color: var(--bai-strong);
  background: var(--bai-surface);
  font-weight: 700;
}

.pagination-nav a.active,
.pagination-nav a:hover {
  color: #fff;
  border-color: var(--bai-accent);
  background: var(--bai-blue);
}

.article-header {
  padding: clamp(4rem, 8vw, 7rem) 0 clamp(8rem, 13vw, 12rem);
  color: #fff;
  background: var(--bai-blue-900);
}

.article-heading {
  max-width: 990px;
}

.article-heading h1 {
  max-width: 980px;
  font-size: clamp(2.7rem, 6vw, 5.8rem);
  line-height: .98;
  font-weight: 800;
}

.article-lead {
  max-width: 760px;
  color: #dceaff;
  font-size: 1.2rem;
}

.article-cover {
  width: min(1200px, calc(100% - 2rem));
  aspect-ratio: 16 / 8;
  margin: clamp(-8rem, -10vw, -5rem) auto 0;
  position: relative;
  overflow: hidden;
  background: var(--bai-cloud);
}

.article-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.article-body {
  max-width: 800px;
  padding-top: 3rem;
  padding-bottom: 5rem;
}

.article-body > p {
  color: #26344d;
  font-size: 1.15rem;
  line-height: 1.85;
}

.share-row {
  display: flex;
  align-items: center;
  gap: .65rem;
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--bai-line);
}

.share-row a {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  color: #fff;
  background: var(--bai-blue);
  border-radius: 50%;
}

.institutional-hero {
  position: relative;
  min-height: min(720px, calc(100svh - var(--header-height)));
  display: flex;
  align-items: end;
  overflow: hidden;
  color: #fff;
}

.institutional-hero-media,
.institutional-hero-overlay {
  position: absolute;
  inset: 0;
}

.institutional-hero-media {
  background: url('/img/generated/EdificioBAI0.webp') center 55% / cover no-repeat;
  transform: scale(1.015);
}

.institutional-hero-overlay {
  background: linear-gradient(90deg, rgba(5, 21, 47, .94) 0%, rgba(5, 21, 47, .72) 48%, rgba(5, 21, 47, .24) 100%);
}

.institutional-hero-copy {
  position: relative;
  z-index: 1;
  padding-top: 5rem;
  padding-bottom: clamp(4rem, 8vw, 7rem);
}

.institutional-hero-copy p:last-child {
  max-width: 650px;
  margin: 1.3rem 0 0;
  color: #eaf1ff;
  font-size: 1.18rem;
}

.portal-index-section {
  background: var(--bai-surface);
}

.portal-link-list {
  border-top: 1px solid var(--bai-line);
}

.portal-link-list > a {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) 36px;
  align-items: center;
  gap: 1.2rem;
  min-height: 120px;
  padding: 1rem 0;
  border-bottom: 1px solid var(--bai-line);
  color: var(--bai-ink);
  transition: padding .2s ease, background .2s ease;
}

.portal-link-list > a:hover {
  padding-inline: 1rem;
  background: var(--bai-soft);
}

.portal-link-list > a > i:first-child {
  color: var(--bai-accent);
  font-size: 1.65rem;
}

.portal-link-list > a > i:last-child {
  color: var(--bai-accent);
}

.portal-link-list strong,
.portal-link-list small {
  display: block;
}

.portal-link-list strong {
  font-size: 1.25rem;
  font-weight: 700;
}

.portal-link-list small {
  margin-top: .3rem;
  color: var(--bai-muted);
  font-size: .96rem;
}

.content-hero-inner {
  min-height: 540px;
  display: flex;
  flex-direction: column;
  justify-content: end;
  align-items: flex-start;
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.content-hero-inner > p:last-child {
  max-width: 720px;
  color: #dceaff;
  font-size: 1.2rem;
}

.content-hero-icon {
  margin: 2rem 0 1.2rem;
  color: var(--bai-aqua);
  font-size: 2.2rem;
}

.information-hero {
  background: var(--bai-blue-700);
}

.content-page-body {
  background: var(--bai-surface);
}

.content-blocks {
  max-width: 900px;
}

.content-blocks article {
  display: grid;
  grid-template-columns: minmax(180px, .4fr) minmax(0, 1fr);
  gap: 2rem;
  padding: 2rem 0;
  border-bottom: 1px solid var(--bai-line);
}

.content-blocks h2 {
  font-size: 1.35rem;
  font-weight: 700;
}

.content-blocks p {
  margin: 0;
  color: #3f4f68;
  font-size: 1.08rem;
  line-height: 1.75;
}

.content-blocks > .btn {
  margin-top: 2rem;
}

.search-shell {
  max-width: 1000px;
  padding-top: clamp(4rem, 9vw, 8rem);
  padding-bottom: clamp(3rem, 6vw, 5rem);
}

.search-form {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  margin-top: 2.2rem;
  padding: .65rem .65rem .65rem 1.25rem;
  color: var(--bai-strong);
  background: var(--bai-surface);
}

.search-form input {
  min-width: 0;
  padding: .6rem 0;
  border: 0;
  outline: 0;
  color: var(--bai-ink);
  font-size: 1.08rem;
}

.search-results-section {
  min-height: 420px;
  background: var(--bai-surface);
}

.results-heading {
  display: flex;
  align-items: baseline;
  gap: .6rem;
  margin-bottom: 1.5rem;
}

.results-heading h2 {
  font-weight: 700;
}

.results-heading p {
  color: var(--bai-muted);
}

.search-results {
  border-top: 1px solid var(--bai-line);
}

.search-results > a {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 1rem;
  padding: 1.2rem 0;
  border-bottom: 1px solid var(--bai-line);
}

.search-results > a > i {
  color: var(--bai-accent);
  font-size: 1.25rem;
}

.search-results small,
.search-results strong,
.search-results em {
  display: block;
}

.search-results small {
  color: var(--bai-accent);
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.search-results strong {
  margin: .15rem 0;
  color: var(--bai-ink);
  font-size: 1.12rem;
}

.search-results em {
  overflow: hidden;
  color: var(--bai-muted);
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.empty-state {
  max-width: 620px;
  padding: 3rem 0;
}

.empty-state > i {
  color: var(--bai-aqua);
  font-size: 2.5rem;
}

.form-page {
  padding: clamp(3rem, 7vw, 6rem) 0;
  background: var(--bai-soft);
}

.form-page-grid {
  display: grid;
  grid-template-columns: minmax(280px, .8fr) minmax(420px, 1.2fr);
  gap: clamp(2rem, 6vw, 6rem);
  align-items: start;
}

.form-page h1 {
  margin-top: 1rem;
  font-size: clamp(2.7rem, 5vw, 5rem);
  line-height: .96;
  font-weight: 800;
}

.form-page header > p:last-of-type {
  color: var(--bai-muted);
  font-size: 1.12rem;
}

.form-page .back-link {
  color: var(--bai-accent);
}

.cookie-row .form-switch {
  min-width: 132px;
  margin: 0;
  color: #33425b;
}

.cookie-row .form-check-input:checked {
  border-color: var(--bai-accent);
  background-color: var(--bai-accent);
}

.exchange-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .55fr);
  gap: clamp(2rem, 6vw, 6rem);
  align-items: start;
}

.exchange-layout h2 {
  font-size: clamp(2rem, 4vw, 4rem);
  font-weight: 800;
}

.exchange-layout p {
  max-width: 720px;
  color: var(--bai-muted);
  font-size: 1.08rem;
  line-height: 1.7;
}

.exchange-layout aside {
  padding: 1.5rem;
  color: #fff;
  background: var(--bai-blue-900);
}

.exchange-layout aside i {
  color: var(--bai-aqua);
  font-size: 1.8rem;
}

.exchange-layout aside h2 {
  margin-top: 1rem;
  font-size: 1.4rem;
}

.exchange-layout aside p {
  color: #dceaff;
  font-size: .98rem;
}

.document-group {
  display: grid;
  grid-template-columns: minmax(220px, .32fr) minmax(0, 1fr);
  gap: 2rem;
  padding: 2.5rem 0;
  border-top: 1px solid var(--bai-line);
}

.document-group h2 {
  font-size: 1.2rem;
  font-weight: 700;
}

.repository-list > a,
.magazine-list > a {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 1rem;
  min-height: 86px;
  padding: .8rem 0;
  border-bottom: 1px solid var(--bai-line);
}

.repository-list > a > i:first-child,
.repository-list > a > i:last-child,
.magazine-list > a > i {
  color: var(--bai-accent);
}

.repository-list strong,
.repository-list small,
.magazine-list strong,
.magazine-list small {
  display: block;
}

.repository-list strong,
.magazine-list strong {
  color: var(--bai-ink);
  font-weight: 700;
}

.repository-list small,
.magazine-list small {
  margin-top: .15rem;
  color: var(--bai-muted);
}

.magazine-hero {
  min-height: 610px;
  display: flex;
  align-items: end;
  color: #fff;
  background:
    linear-gradient(90deg, rgba(5, 21, 47, .94), rgba(5, 21, 47, .45)),
    url('/img/current-site/campanha-mundial.jpg') center 38% / cover no-repeat;
}

.magazine-hero > div {
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.magazine-hero h1 {
  max-width: 900px;
  font-size: clamp(3rem, 7vw, 6.5rem);
  line-height: .94;
  font-weight: 800;
}

.magazine-hero p:last-child {
  max-width: 620px;
  color: #eaf1ff;
  font-size: 1.15rem;
}

.magazine-number {
  display: grid;
  width: 54px;
  height: 54px;
  place-items: center;
  color: #fff;
  background: var(--bai-blue);
  font-size: 1.25rem;
  font-weight: 800;
}

.magazine-list > a {
  grid-template-columns: 64px minmax(0, 1fr) 24px;
  min-height: 108px;
}

@media (max-width: 800px) {
  .exchange-layout,
.document-group {
    grid-template-columns: 1fr;
  }
}

.privacy-assurance {
  display: flex;
  gap: 1rem;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--bai-line);
}

.privacy-assurance i {
  color: var(--bai-accent);
  font-size: 1.4rem;
}

.privacy-assurance strong,
.privacy-assurance small {
  display: block;
}

.privacy-assurance small {
  margin-top: .25rem;
  color: var(--bai-muted);
}

.support-form,
.submission-success {
  padding: clamp(1.4rem, 3vw, 2.2rem);
  background: var(--bai-surface);
  border: 1px solid var(--bai-line);
  box-shadow: 0 22px 60px rgba(7, 27, 60, .08);
}

.support-form {
  display: grid;
  gap: 1rem;
}

/* Canal de Denúncias */
.denuncia-intro { max-width: 820px; color: var(--bai-muted); line-height: 1.75; font-size: 1.02rem; }
.denuncia-rule {
  display: flex; align-items: flex-start; gap: .65rem; max-width: 820px; margin-top: 1.1rem;
  padding: .9rem 1.1rem; border-left: 3px solid var(--bai-accent); border-radius: 8px;
  background: var(--bai-soft, rgba(0,0,0,.03)); color: var(--bai-strong); font-weight: 600; line-height: 1.55;
}
.denuncia-rule i { color: var(--bai-accent); margin-top: .2rem; flex: none; }
.denuncia-categories {
  list-style: none; margin: 1.25rem 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: .6rem 1.5rem;
}
.denuncia-categories li { display: flex; align-items: flex-start; gap: .6rem; color: var(--bai-strong); font-weight: 600; line-height: 1.4; }
.denuncia-categories li i { color: var(--bai-accent); margin-top: .18rem; flex: none; }
.denuncia-docs { margin-top: 1.75rem; color: var(--bai-muted); line-height: 1.7; }
.denuncia-docs i { color: var(--bai-accent); margin-right: .4rem; }
.denuncia-docs a { color: var(--bai-blue); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.denuncia-identify { margin-top: .25rem; }
.denuncia-identity { display: grid; gap: 1rem; padding: 1rem 1.15rem; border: 1px dashed var(--bai-line); border-radius: var(--radius-md, 12px); background: var(--bai-soft, rgba(0,0,0,.02)); }
.denuncia-identity[hidden] { display: none; }

.support-form .form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.support-form textarea.form-control {
  min-height: 180px;
}

.submission-success > i {
  color: #177245;
  font-size: 2.8rem;
}

.submission-success > strong {
  display: block;
  margin: 1rem 0 2rem;
  color: var(--bai-accent);
  font-size: 1.45rem;
}

@media (max-width: 991px) {
  .editorial-hero-inner,
.support-hero-inner,
.form-page-grid {
    grid-template-columns: 1fr;
  }

  .news-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .institutional-hero-overlay {
    background: rgba(5, 21, 47, .78);
  }
}

@media (max-width: 640px) {
  .editorial-hero-inner,
.support-hero-inner {
    min-height: 380px;
    gap: 1.2rem;
  }

  .news-grid,
.support-form .form-row,
.content-blocks article {
    grid-template-columns: 1fr;
  }

  .news-card h2 {
    font-size: 1.35rem;
  }

  .article-cover {
    aspect-ratio: 4 / 3;
  }

  .portal-link-list > a {
    grid-template-columns: 42px minmax(0, 1fr) 24px;
    gap: .75rem;
  }

  .search-form {
    grid-template-columns: 24px minmax(0, 1fr);
  }

  .search-form button {
    grid-column: 1 / -1;
    width: 100%;
  }

  .form-page-grid {
    display: block;
  }

  .support-form,
.submission-success {
    margin-top: 2rem;
  }
}

/* Final cascade overrides for the sticky homepage story. */

.home-story-sequence {
  --story-progress: 0;
  --story-cut: 12%;
  --story-copy-y: 80px;
  overflow: clip;
}

.home-story-sequence .baidirecto-feature {
  position: sticky;
  top: var(--header-height);
  height: calc(100svh - var(--header-height));
  min-height: 620px;
  max-height: none;
  aspect-ratio: auto;
}

.home-story-sequence .feature-photo { opacity: calc(1 - var(--story-progress) * .5); }

.home-story-sequence .feature-copy { opacity: calc(1 - var(--story-progress) * 1.15); transform: translateY(calc(var(--story-progress) * -70px)); }

.home-story-sequence .campaign-strip {
  position: relative;
  z-index: 5;
  min-height: calc(100svh - var(--header-height) + 7vw);
  margin-top: 0;
  padding-top: clamp(6rem, 12vw, 11rem);
  clip-path: polygon(0 var(--story-cut), 100% 0, 100% 100%, 0 100%);
}

.home-story-sequence .campaign-copy { transform: translateY(var(--story-copy-y)); transition: transform .12s linear; }

.home-story-sequence .section-bridge {
  position: sticky;
  top: calc(100svh - 90px);
  bottom: auto;
  left: auto;
  width: fit-content;
  height: 0;
  margin: 0 0 0 clamp(1rem, 6vw, 7rem);
  pointer-events: none;
}

.home-story-sequence .section-bridge a { pointer-events: auto; }

@media (max-width: 991px) {
  .home-story-sequence .baidirecto-feature { top: 0; height: 100svh; }
}

/* Telemóvel: os painéis cinematográficos deixam de ocupar um ecrã inteiro e
   dispensam o scrollytelling (conteúdo e imagens sempre proporcionais). */
@media (max-width: 680px) {
  .home-story-sequence .baidirecto-feature {
    position: relative;
    top: auto;
    height: auto;
    min-height: clamp(440px, 84vw, 560px);
    max-height: none;
    aspect-ratio: auto;
  }
  .home-story-sequence .campaign-strip {
    position: relative;
    min-height: clamp(440px, 84vw, 560px);
    margin-top: 0;
    padding-top: clamp(3rem, 9vw, 6rem);
    clip-path: polygon(0 2rem, 100% 0, 100% 100%, 0 100%);
  }
  .home-story-sequence .feature-photo { opacity: 1; }
  .home-story-sequence .feature-copy { opacity: 1; transform: none; }
  .home-story-sequence .campaign-copy { transform: none; }
  .home-story-sequence .feature-photo img,
  .home-story-sequence .campaign-media img { transform: none; }
  .home-story-sequence .section-bridge { display: none; }
}

/* ATM operations and privacy-first analytics. */

.atm-service-editor {
  margin: .5rem 0 0;
  padding: 1.25rem;
  border: 1px solid var(--bai-line);
}

.atm-service-editor legend {
  float: none;
  width: auto;
  margin: 0 0 1rem;
  color: var(--bai-navy);
  font-size: 1rem;
  font-weight: 800;
}

.atm-service-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem 1rem;
}

.atm-service-options label {
  display: flex;
  align-items: center;
  gap: .65rem;
  min-width: 0;
  color: var(--bai-navy);
  font-weight: 650;
}

.analytics-dashboard { display: grid; gap: 1.5rem; }

.analytics-dashboard .admin-page-header > div > p:last-child {
  max-width: 680px;
  margin: .4rem 0 0;
  color: var(--bai-muted);
}

.analytics-period {
  display: inline-flex;
  align-self: end;
  border: 1px solid #c8d4e7;
}

.analytics-period button {
  min-height: 42px;
  padding: 0 1rem;
  border: 0;
  border-right: 1px solid #c8d4e7;
  background: var(--bai-surface);
  color: var(--bai-navy);
  font-weight: 800;
}

.analytics-period button:last-child { border-right: 0; }

.analytics-period button.active { background: var(--bai-navy); color: #fff; }

.analytics-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-block: 1px solid #cbd7e7;
}

.analytics-summary div {
  display: grid;
  gap: .2rem;
  padding: clamp(1.2rem, 2.5vw, 2rem);
  border-right: 1px solid #cbd7e7;
}

.analytics-summary div:last-child { border-right: 0; }

.analytics-summary strong { color: var(--bai-navy); font-size: clamp(2rem, 4vw, 3.6rem); line-height: 1; }

.analytics-summary span { color: var(--bai-muted); font-weight: 700; }

.analytics-chart-panel,
.analytics-list-panel {
  padding: clamp(1.1rem, 2vw, 1.7rem);
  background: var(--bai-surface);
  border: 1px solid #d5dfec;
}

.analytics-bars {
  display: flex;
  align-items: end;
  gap: clamp(2px, .45vw, 8px);
  height: 240px;
  padding-top: 1.5rem;
  border-bottom: 1px solid #cbd7e7;
}

.analytics-bar {
  position: relative;
  display: flex;
  flex: 1 1 0;
  align-items: end;
  height: 100%;
}

.analytics-bar > span {
  width: 100%;
  min-height: 2px;
  background: var(--bai-blue);
  transition: height .35s ease, background-color .2s ease;
}

.analytics-bar:hover > span { background: var(--bai-cyan); }

.analytics-bar small { position: absolute; top: calc(100% + .45rem); left: 50%; transform: translateX(-50%); white-space: nowrap; color: var(--bai-muted); font-size: .68rem; }

.analytics-columns {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(280px, .65fr);
  gap: 1.5rem;
}

.analytics-list-row,
.analytics-device-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  min-height: 52px;
  padding: .75rem .85rem;
  overflow: hidden;
  border-top: 1px solid #e2e8f1;
  color: var(--bai-navy);
}

.analytics-list-row > span:not(.analytics-rank-bar),
.analytics-list-row > strong { position: relative; z-index: 1; }

.analytics-rank-bar { position: absolute; inset: 5px auto 5px 0; background: #e9f4ff; }

.analytics-device-row { grid-template-columns: 28px minmax(0, 1fr) auto; }

.analytics-device-row i { color: var(--bai-accent); text-align: center; }

@media (max-width: 800px) {
  .atm-service-options,
.analytics-summary,
.analytics-columns { grid-template-columns: 1fr; }

  .analytics-summary div { border-right: 0; border-bottom: 1px solid #cbd7e7; }

  .analytics-summary div:last-child { border-bottom: 0; }

  .analytics-period { align-self: start; }

  .analytics-bars { height: 190px; }
}

/* ATM flow guide (public + admin) */
.atm-flow-section { padding: clamp(2rem, 5vw, 3.5rem) clamp(1rem, 5vw, 3.5rem); }
.atm-flow-heading { max-width: 46rem; margin-bottom: 1.5rem; }
.atm-flow-heading h2 { margin: .25rem 0 .5rem; }
.atm-flow-guide { display: grid; gap: 1.25rem; }
.flow-guide-services { display: flex; flex-wrap: wrap; gap: .5rem; }
.flow-guide-service { border: 1px solid var(--bai-line); background: var(--bai-surface); color: var(--bai-ink); border-radius: 999px; padding: .5rem 1rem; font-size: .9rem; font-weight: 600; cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
.flow-guide-service:hover { border-color: var(--bai-blue); }
.flow-guide-service.is-active { background: var(--bai-blue); border-color: var(--bai-blue); color: #fff; }
/* Serviço em destaque (lançamento): realçado com selo. */
.flow-guide-service.is-featured { display: inline-flex; align-items: center; gap: .45rem; border-color: var(--bai-aqua); box-shadow: inset 0 0 0 1px var(--bai-aqua); }
.flow-guide-service.is-featured.is-active { background: var(--bai-blue); border-color: var(--bai-blue); box-shadow: none; }
.flow-guide-service-badge { font-size: .62rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; background: var(--bai-aqua); color: #05243c; border-radius: 999px; padding: .1rem .4rem; }
.flow-guide-service.is-active .flow-guide-service-badge { background: #fff; color: var(--bai-blue); }
.flow-guide-steps { min-height: 4rem; }
.flow-guide-empty { color: var(--bai-ink-soft, #667); font-style: italic; }
.flow-guide-steps-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; counter-reset: none; }
.flow-guide-step { display: grid; grid-template-columns: 2.25rem 1fr; gap: .85rem; align-items: start; background: var(--bai-surface); border: 1px solid var(--bai-line); border-radius: 12px; padding: .85rem 1rem; position: relative; }
.flow-guide-step:not(:last-child)::before { content: ""; position: absolute; left: 1.5rem; top: 2.85rem; bottom: -.85rem; width: 2px; background: var(--bai-line); }
.flow-guide-step-num { z-index: 1; width: 2rem; height: 2rem; border-radius: 50%; background: var(--bai-blue); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: .9rem; }
.flow-guide-step.is-outcome .flow-guide-step-num { background: var(--bai-success, #1c7c4a); }
.flow-guide-step.is-outcome { border-color: var(--bai-success, #1c7c4a); }
.flow-guide-step-head { display: flex; align-items: center; gap: .5rem; }
.flow-guide-step-icon { color: var(--bai-blue); width: 1.1rem; text-align: center; }
.flow-guide-step.is-outcome .flow-guide-step-icon { color: var(--bai-success, #1c7c4a); }
.flow-guide-step-detail { margin: .25rem 0 0; color: var(--bai-ink); }
.flow-guide-step-action { margin: .35rem 0 0; font-size: .85rem; color: var(--bai-ink-soft, #667); }
.flow-guide-choices { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .6rem; }
.flow-guide-chip { font-size: .78rem; padding: .2rem .6rem; border-radius: 6px; background: var(--bai-surface-muted, #eef1f7); color: var(--bai-ink); border: 1px solid var(--bai-line); }
.flow-guide-chip.is-active { background: var(--bai-blue); color: #fff; border-color: var(--bai-blue); }
@media (min-width: 820px) { .flow-guide-steps-list { max-width: 46rem; } }

.simulator-flow-guide-panel { margin-top: 1.5rem; padding: 1.25rem; border: 1px solid var(--bai-line); border-radius: 14px; background: var(--bai-surface); }
.simulator-flow-guide-head { margin-bottom: 1rem; }
.simulator-flow-guide-head strong { display: block; font-size: 1.05rem; }
.simulator-flow-guide-head span { color: var(--bai-ink-soft, #667); font-size: .88rem; }

/* ATM flow guide — screen player */
@media (min-width: 900px) {
  .atm-flow-guide { grid-template-columns: minmax(280px, 360px) 1fr; grid-template-areas: "svc svc" "stage steps"; align-items: start; }
  .atm-flow-guide > .flow-guide-services { grid-area: svc; }
  .atm-flow-guide > .flow-guide-stage { grid-area: stage; position: sticky; top: 1rem; }
  .atm-flow-guide > .flow-guide-steps { grid-area: steps; }
  .atm-flow-guide .flow-guide-steps-list { max-width: none; }
}
.flow-guide-stage { display: grid; gap: .75rem; }
.atm-screen { border-radius: 16px; overflow: hidden; background: linear-gradient(160deg, #0c3a42, #08222c); border: 1px solid #0a2b33; box-shadow: 0 18px 40px rgba(4, 20, 30, .35); color: #eafcff; }
.atm-screen-brand { font-size: .68rem; letter-spacing: .12em; font-weight: 700; color: #7fe0c6; padding: .6rem .9rem; border-bottom: 1px solid rgba(127, 224, 198, .25); background: rgba(0,0,0,.15); }
.atm-screen-mount { padding: 1.1rem 1.1rem 1.3rem; min-height: 210px; display: flex; flex-direction: column; justify-content: center; }
.atm-screen-body { display: flex; flex-direction: column; gap: .5rem; }
.atm-screen-body h4 { margin: 0; font-size: 1.15rem; color: #fff; }
.atm-screen-sub { margin: 0; font-size: .85rem; color: #b8e6df; }
.atm-screen-graphic { font-size: 2.4rem; text-align: center; }
.atm-screen-graphic.ok { color: #57e08e; }
.atm-screen-body.atm-screen-card, .atm-screen-body.atm-screen-pin, .atm-screen-body.atm-screen-done { text-align: center; align-items: center; }
.atm-screen-dots { display: flex; gap: .6rem; justify-content: center; margin-top: .3rem; }
.atm-screen-dot { width: .8rem; height: .8rem; border-radius: 50%; background: #7fe0c6; }
.atm-screen-field { font-family: monospace; font-size: 1.4rem; letter-spacing: .3em; color: #7fe0c6; text-align: center; margin-top: .3rem; }
.atm-screen-options { list-style: none; margin: .3rem 0 0; padding: 0; display: grid; gap: .35rem; }
.atm-screen-option { display: flex; align-items: center; gap: .5rem; padding: .4rem .6rem; border-radius: 8px; background: rgba(255,255,255,.05); font-size: .82rem; }
.atm-screen-option::before { content: ""; width: .5rem; height: .5rem; border-radius: 2px; background: rgba(255,255,255,.35); flex: none; }
.atm-screen-option.is-selected { background: rgba(87, 224, 142, .18); color: #fff; box-shadow: inset 0 0 0 1px rgba(87,224,142,.5); }
.atm-screen-option.is-selected::before { background: #57e08e; box-shadow: 0 0 8px #57e08e; }
.atm-screen-controls { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.atm-ctl { display: inline-flex; align-items: center; gap: .4rem; height: 2.5rem; padding: 0 .95rem; border-radius: 999px; border: 1px solid var(--bai-line); background: var(--bai-surface); color: var(--bai-ink); font-weight: 600; font-size: .85rem; cursor: pointer; transition: background .15s, border-color .15s; }
.atm-ctl:hover { border-color: var(--bai-blue); }
.atm-ctl:disabled { opacity: .4; cursor: default; }
.atm-ctl-glyph { font-size: 1.05rem; line-height: 1; }
.atm-ctl-play { background: var(--bai-blue); border-color: var(--bai-blue); color: #fff; padding: 0 1.2rem; }
.atm-ctl-play:hover { border-color: var(--bai-blue); }
.atm-screen-progress { margin-left: auto; font-size: .82rem; color: var(--bai-ink-soft, #667); font-variant-numeric: tabular-nums; }
@media (max-width: 420px) { .atm-ctl .atm-ctl-text { display: none; } }
.flow-guide-step { cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.flow-guide-step.is-current { border-color: var(--bai-blue); box-shadow: 0 0 0 2px rgba(34, 63, 127, .18); }

/* ATM admin editor: add/delete step controls */
.simulator-flow-panel-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .5rem; }
.simulator-flow-hint { margin: .75rem 0 0; font-size: .8rem; color: var(--bai-ink-soft, #667); }
.simulator-fields-note { margin: .6rem 0 .1rem; font-size: .78rem; color: var(--bai-muted); }

/* Guia explicativo do editor do simulador. */
.simulator-help { margin: 0 0 1.25rem; border: 1px solid var(--bai-line); border-radius: 14px; background: var(--bai-soft); padding: .4rem 1.15rem; }
.simulator-help > summary { cursor: pointer; font-weight: 700; color: var(--bai-ink); padding: .55rem 0; list-style: none; }
.simulator-help > summary::-webkit-details-marker { display: none; }
.simulator-help[open] > summary { border-bottom: 1px solid var(--bai-line); margin-bottom: .9rem; }
.simulator-help-body { padding-bottom: .8rem; }
.simulator-help-intro { margin: 0 0 1rem; color: var(--bai-ink); line-height: 1.6; font-size: .92rem; }
.simulator-help-intro em, .simulator-help-cols em { color: var(--bai-muted); font-style: normal; }
.simulator-help-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.2rem 2rem; }
.simulator-help-cols h3 { font-size: .95rem; font-weight: 750; margin: 0 0 .5rem; color: var(--bai-accent); }
.simulator-help-cols ol { margin: 0; padding-left: 1.2rem; display: grid; gap: .45rem; color: var(--bai-ink); line-height: 1.55; font-size: .9rem; }
.simulator-help-note { margin: 1rem 0 0; padding-top: .8rem; border-top: 1px dashed var(--bai-line); font-size: .86rem; color: var(--bai-muted); }
.simulator-featured-hint { margin: .9rem 0 0; font-size: .84rem; color: var(--bai-muted); line-height: 1.5; }

/* Painel de Serviços em destaque (Featured) no editor do simulador. */
.simulator-featured-panel { grid-column: 1 / -1; width: 100%; margin-top: .25rem; padding: 1.15rem; border: 1px solid var(--bai-line); border-radius: 14px; background: var(--bai-surface); }
.simulator-featured-head { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; justify-content: space-between; margin-bottom: .9rem; }
.simulator-featured-head span { display: block; font-size: .82rem; color: var(--bai-muted); }
.simulator-featured-list { display: grid; gap: .7rem; }
.simulator-featured-list .simulator-option-fields { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.simulator-featured-empty { margin: 0; font-size: .85rem; color: var(--bai-muted); }
.simulator-featured-help { margin-top: 1rem; font-size: .85rem; }
.simulator-featured-help summary { cursor: pointer; font-weight: 650; color: var(--bai-accent); }
.simulator-featured-help ol { margin: .7rem 0 0; padding-left: 1.2rem; display: grid; gap: .5rem; color: var(--bai-ink); line-height: 1.55; }
.simulator-property-actions { display: flex; gap: .5rem; flex-wrap: wrap; }

/* Institutional footer column (replaces the old governance block) */
.footer-institutional .socials { margin-top: .9rem; }

/* Homepage: 24/7 channels (ATM/POS/Web) on the dark ATM section */
.atm-channels { display: grid; gap: .85rem; align-content: center; }
.channel-card { display: grid; grid-template-columns: 2.4rem 1fr auto; align-items: center; gap: .5rem 1rem; padding: 1rem 1.15rem; border-radius: 14px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); backdrop-filter: blur(6px); }
.channel-card > i { font-size: 1.35rem; color: #8fd3e6; grid-row: span 2; }
.channel-card strong { display: block; color: #fff; font-size: 1rem; }
.channel-card p { margin: .15rem 0 0; color: #c7d6ee; font-size: .86rem; line-height: 1.45; }
.channel-badge { grid-column: 3; grid-row: 1 / span 2; align-self: center; white-space: nowrap; font-size: .72rem; font-weight: 700; letter-spacing: .04em; color: #57e08e; background: rgba(87,224,142,.12); border: 1px solid rgba(87,224,142,.4); border-radius: 999px; padding: .25rem .6rem; }
.channel-cta { display: inline-flex; align-items: center; margin-top: .55rem; font-size: .82rem; font-weight: 700; color: var(--bai-blue-900); background: var(--bai-aqua); padding: .32rem .75rem; border-radius: 999px; text-decoration: none; transition: background .15s ease, transform .15s ease; }
.channel-cta:hover { background: #8fe0f2; transform: translateY(-1px); }
@media (max-width: 560px) { .channel-card { grid-template-columns: 2.2rem 1fr; } .channel-badge { grid-column: 2; grid-row: auto; justify-self: start; margin-top: .3rem; } }

/* Homepage: branch KPIs + personalised-service callout */
.branch-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin: 1.25rem 0 1.5rem; }
.branch-kpis > div { border-left: 3px solid var(--bai-blue); padding-left: .75rem; }
.branch-kpis strong { display: block; font-size: 1.5rem; font-weight: 800; color: var(--bai-blue); line-height: 1.1; }
.branch-kpis span { font-size: .82rem; color: var(--bai-ink-soft, #667); }
.branch-service { margin-top: 1.4rem; padding: 1.1rem 1.25rem; border-radius: 14px; background: var(--bai-surface-muted, #eef2fb); border: 1px solid var(--bai-line); }
.branch-service > p { margin: 0 0 .9rem; color: var(--bai-ink); display: flex; gap: .55rem; align-items: baseline; }
.branch-service > p > i { color: var(--bai-blue); }
@media (max-width: 620px) { .branch-kpis { grid-template-columns: repeat(2, 1fr); gap: .85rem; } }

/* Admin footer manager */
.form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 1rem; }
.form-grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1rem; }
@media (max-width: 640px) { .form-grid-2, .form-grid-3 { grid-template-columns: 1fr; } }
.footer-admin-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.25rem; }
.footer-admin-col { border: 1px solid var(--bai-line); border-radius: 12px; background: var(--bai-surface); padding: 1rem; display: flex; flex-direction: column; gap: .75rem; }
.footer-admin-col > header { display: flex; align-items: start; justify-content: space-between; gap: .5rem; }
.footer-admin-col > header strong { display: block; }
.footer-admin-col > header small { color: var(--bai-ink-soft, #667); font-size: .78rem; }
.footer-admin-links { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; }
.footer-admin-links li { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .4rem .5rem; border-radius: 8px; background: var(--bai-surface-muted, #f4f6fb); font-size: .85rem; }
.footer-admin-links li.is-off { opacity: .55; }
.footer-admin-links li small { display: block; color: var(--bai-ink-soft, #667); font-size: .72rem; }

/* Homepage: stylised Cabo Verde islands map (agências section) */
.cv-map-figure { margin: 0 0 1.5rem; padding: 1.1rem 1.25rem 1rem; border-radius: 16px; background: linear-gradient(160deg, #eef3fb, #e2eaf7); border: 1px solid var(--bai-line); }
.cv-map { display: block; width: 100%; height: auto; overflow: visible; }
.cv-island ellipse { fill: #c3d1e8; stroke: #b1c2df; stroke-width: 1; transition: fill .2s; }
.cv-island .cv-label { fill: #6b7a95; font-size: 15px; font-weight: 600; }
.cv-island.has-branch ellipse { fill: var(--bai-blue); stroke: var(--bai-blue); }
.cv-island.has-branch .cv-label { fill: var(--bai-blue); font-weight: 800; }
.cv-pin { fill: #fff; }
.cv-pin-halo { fill: var(--bai-blue); opacity: .28; transform-origin: center; transform-box: fill-box; animation: cvPulse 2.4s ease-out infinite; }
@keyframes cvPulse { 0% { transform: scale(.7); opacity: .5; } 70% { transform: scale(2.1); opacity: 0; } 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .cv-pin-halo { animation: none; opacity: .22; } }
.cv-map-legend { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-top: .5rem; flex-wrap: wrap; }
.cv-map-legend span { display: inline-flex; align-items: center; gap: .5rem; font-size: .85rem; color: var(--bai-ink); }
.cv-map-legend .cv-dot { width: .7rem; height: .7rem; border-radius: 50%; background: var(--bai-blue); display: inline-block; }
.cv-map-legend strong { color: var(--bai-blue); font-size: .9rem; }
:root[data-theme="dark"] .cv-map-figure, [data-bs-theme="dark"] .cv-map-figure { background: linear-gradient(160deg, #10203c, #0c1a30); }
:root[data-theme="dark"] .cv-island ellipse, [data-bs-theme="dark"] .cv-island ellipse { fill: #26364f; stroke: #33465f; }
:root[data-theme="dark"] .cv-island .cv-label, [data-bs-theme="dark"] .cv-island .cv-label { fill: #93a6c4; }

/* Agências: interactive map layout + refined map visuals */
.branch-map-layout { display: grid; grid-template-columns: var(--branch-cols, 1.05fr .95fr); gap: var(--branch-gap, clamp(1.5rem, 3vw, 3rem)); align-items: start; margin-top: 1.75rem; }
.branch-side { min-width: 0; }
.map-side { min-width: 0; position: sticky; top: 1.5rem; }
.branch-filter-bar { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .9rem; }
.branch-filter-bar [data-branch-filter-label] { font-weight: 700; color: var(--bai-blue); }
.branch-empty { padding: 1rem 0; }
@media (max-width: 880px) { .branch-map-layout { grid-template-columns: 1fr; } .map-side { position: static; order: -1; } }

/* Agências: explorador (lista agrupada por ilha + mapa lateral) */
.branch-explorer { display: grid; grid-template-columns: 1.4fr .85fr; gap: clamp(1.5rem, 3vw, 3rem); align-items: start; margin-top: 1.25rem; }
.branch-explorer-list { min-width: 0; }
.branch-explorer-map { min-width: 0; position: sticky; top: 1.5rem; }
.branch-island-group { margin-bottom: 1.6rem; }
.branch-group-head { display: flex; align-items: center; gap: .55rem; font-size: 1.05rem; font-weight: 800; color: var(--bai-blue, #003a8c); margin: 0 0 .75rem; padding-bottom: .5rem; border-bottom: 2px solid var(--bai-line); }
.branch-group-head i { font-size: .95rem; }
.branch-group-count { display: inline-flex; align-items: center; justify-content: center; min-width: 1.6rem; height: 1.6rem; padding: 0 .45rem; border-radius: 999px; background: var(--bai-surface-muted, #eef1f8); color: var(--bai-ink-soft, #667); font-size: .78rem; font-weight: 700; margin-left: .1rem; }
.branch-explorer-list .branch-grid { grid-template-columns: repeat(auto-fill, minmax(235px, 1fr)); }
.branch-grid article h3 { margin: .55rem 0 .4rem; font-size: 1.2rem; font-weight: 800; }
.branch-help { display: flex; gap: 1rem; align-items: flex-start; margin-top: 1.5rem; padding: 1.15rem 1.3rem; border: 1px solid var(--bai-line); border-radius: 16px; background: var(--bai-surface-muted, #eef2fb); }
.branch-help-icon { flex: none; width: 2.6rem; height: 2.6rem; border-radius: 12px; background: var(--bai-blue, #003a8c); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 1.1rem; }
.branch-help-body { min-width: 0; }
.branch-help-body strong { display: block; font-size: 1.05rem; color: var(--bai-ink); }
.branch-help-body p { margin: .3rem 0 .8rem; color: var(--bai-ink-soft, #556); font-size: .92rem; }
.branch-help-body .hero-actions { gap: .6rem; flex-wrap: wrap; }
@media (max-width: 880px) { .branch-explorer { grid-template-columns: 1fr; } .branch-explorer-map { position: static; } }

.cv-map-figure { margin: 0; padding: 1rem 1.15rem .9rem; border-radius: 18px; border: 1px solid #bcd4e8;
  background:
    radial-gradient(120% 90% at 50% 8%, rgba(255,255,255,.7), transparent 55%),
    var(--bai-dots-light),
    linear-gradient(165deg, #d5e8f4, #bcd7ec 60%, #a9cbe6);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 14px 34px rgba(30, 60, 100, .14); }
.cv-island { transition: filter .15s, transform .15s; transform-origin: center; transform-box: fill-box; }
.cv-island ellipse { filter: drop-shadow(0 2px 3px rgba(20,50,90,.25)); }
.cv-island.has-branch { cursor: pointer; }
.cv-island.has-branch:hover { filter: brightness(1.08); }
.cv-island.has-branch:hover ellipse { stroke: #fff; stroke-width: 2; }
.cv-island.has-branch:focus-visible { outline: none; }
.cv-island.has-branch:focus-visible ellipse { stroke: #fff; stroke-width: 2.5; }
.cv-island.is-active ellipse { stroke: #fff; stroke-width: 3; }
.cv-island.is-active { filter: drop-shadow(0 5px 12px rgba(34,63,127,.55)); }
.cv-island.is-active .cv-pin-halo { animation: none; opacity: .4; }

/* Homepage news section (moved out of the network aside) */
.home-news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.home-news-card { display: grid; gap: .4rem; padding: 1.25rem; border: 1px solid var(--bai-line); border-radius: 14px; background: var(--bai-surface); color: var(--bai-ink); transition: border-color .15s, transform .15s, box-shadow .15s; }
.home-news-card:hover { border-color: var(--bai-blue); transform: translateY(-3px); box-shadow: 0 12px 28px rgba(30,60,100,.12); }
.home-news-card time { font-size: .78rem; color: var(--bai-blue); font-weight: 700; }
.home-news-card strong { font-size: 1.02rem; line-height: 1.3; }
.home-news-card span { font-size: .88rem; color: var(--bai-ink-soft, #667); line-height: 1.5; }
@media (max-width: 820px) { .home-news-grid { grid-template-columns: 1fr; } }
:root[data-theme="dark"] .cv-map-figure, [data-bs-theme="dark"] .cv-map-figure { background: var(--bai-dots-light), linear-gradient(165deg, #10263f, #0b1c30); border-color: #1e3350; }

/* Agências: intro (heading + service callout side by side) */
.branch-intro { display: grid; grid-template-columns: var(--branch-cols, 1.05fr .95fr); gap: var(--branch-gap, clamp(1.5rem, 3vw, 3rem)); align-items: center; }
.branch-intro .section-heading { margin: 0; }
.branch-intro .branch-service { margin: 0; }
@media (max-width: 900px) { .branch-intro { grid-template-columns: 1fr; gap: 1.5rem; } }
/* balance the two columns: cap the list to roughly the map height */
.branch-map-layout { align-items: start; }
.branch-list[data-branch-listing] { max-height: 470px; overflow-y: auto; padding-right: .4rem; scrollbar-width: thin; }
.branch-list[data-branch-listing]::-webkit-scrollbar { width: 7px; }
.branch-list[data-branch-listing]::-webkit-scrollbar-thumb { background: var(--bai-line); border-radius: 4px; }

/* Support form: consent pre-accepted hint */
.form-consent-note { display: inline-flex; align-items: center; gap: .35rem; margin-top: .3rem; font-size: .8rem; color: #1c7c4a; }

/* Top nav: admin-managed sub-menus (dropdown on desktop, indented on mobile) */
.nav-item.has-submenu { position: relative; }
.submenu-trigger { display: inline-flex; align-items: center; gap: .35rem; background: none; border: 0; cursor: pointer; }
.submenu-trigger .chevron { transition: transform .2s; }
.has-submenu.is-open .submenu-trigger .chevron { transform: rotate(180deg); }
.submenu { list-style: none; margin: 0; padding: 0; }
@media (min-width: 1200px) {
  .submenu { position: absolute; top: calc(100% - .25rem); left: 50%; transform: translateX(-50%) translateY(6px); min-width: 230px; background: var(--bai-surface); border: 1px solid var(--bai-line); border-radius: 12px; box-shadow: 0 18px 44px rgba(10, 25, 50, .18); padding: .5rem; opacity: 0; visibility: hidden; transition: opacity .16s, transform .16s; z-index: 1100; }
  .has-submenu.is-open .submenu { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
  .submenu li { list-style: none; }
  .submenu a { display: flex; align-items: center; gap: .55rem; padding: .55rem .75rem; border-radius: 8px; color: var(--bai-ink); white-space: nowrap; font-weight: 600; font-size: .92rem; }
  .submenu a:hover { background: var(--bai-surface-muted, #eef2fb); color: var(--bai-blue); }
  .submenu a i { color: var(--bai-blue); width: 1.05rem; text-align: center; }
}
@media (max-width: 1199.98px) {
  .submenu { padding: .25rem 0 .5rem 1.1rem; display: block; }
  .submenu a { display: flex; align-items: center; gap: .5rem; padding: .5rem 0; color: var(--bai-ink); }
  .submenu a i { color: var(--bai-blue); }
}

/* Admin top-menu manager */
.menu-admin-list { display: grid; gap: .85rem; }
.menu-admin-item { border: 1px solid var(--bai-line); border-radius: 12px; background: var(--bai-surface); padding: .85rem 1rem; }
.menu-admin-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.menu-admin-row strong { display: block; }
.menu-admin-row small { color: var(--bai-ink-soft, #667); font-size: .78rem; }
.menu-admin-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.menu-admin-children { list-style: none; margin: .6rem 0 0; padding: .5rem 0 0 1rem; border-top: 1px dashed var(--bai-line); display: grid; gap: .35rem; }
.menu-admin-children li { display: flex; align-items: center; justify-content: space-between; gap: .5rem; font-size: .88rem; padding: .3rem .1rem; }
.menu-admin-children li:not(:last-child) { border-bottom: 1px solid var(--bai-line); }
.menu-admin-children small { color: var(--bai-ink-soft, #667); font-size: .74rem; margin-left: .3rem; }
.menu-admin-label, .menu-admin-child-label { display: flex; align-items: center; gap: .55rem; min-width: 0; }
.menu-admin-child-label { flex-wrap: wrap; }
.menu-admin-order { display: inline-flex; align-items: center; justify-content: center; min-width: 1.6rem; height: 1.6rem; padding: 0 .35rem; border-radius: 8px; background: var(--bai-blue, #003a8c); color: #fff; font-size: .74rem; font-weight: 700; flex: none; }
.menu-admin-order.sub { min-width: 1.35rem; height: 1.35rem; background: var(--bai-surface-muted, #eef1f8); color: var(--bai-ink-soft, #667); border: 1px solid var(--bai-line); }
.menu-admin-icon { color: var(--bai-blue, #003a8c); width: 1.1rem; text-align: center; flex: none; }
.menu-admin-badge { display: inline-block; margin-left: .4rem; padding: .05rem .45rem; border-radius: 999px; background: var(--bai-surface-muted, #eef1f8); color: var(--bai-ink-soft, #667); font-size: .68rem; font-weight: 600; vertical-align: middle; }
.menu-admin-badge.inactive { background: #fdecec; color: #b42318; }

/* Admin grouped URL picker */
.url-picker { display: grid; gap: .25rem; }
.url-picker select { max-width: 100%; }

/* Admin: textos das páginas */
.pagetext-field { padding: .85rem 0; border-bottom: 1px dashed var(--bai-line); }
.pagetext-field > .form-label { font-weight: 700; }
.pagetext-field small { display: block; margin-top: .3rem; }
.pagetext-group { font-size: 1.05rem; font-weight: 800; margin: 1.9rem 0 .4rem; padding-bottom: .35rem; border-bottom: 2px solid var(--bai-accent); color: var(--bai-blue-900, var(--bai-ink)); }
.pagetext-group:first-of-type { margin-top: .6rem; }
/* Honeypot anti-spam: fora do ecrã e do fluxo de tabulação; humanos não o veem. */
.hp-field { position: absolute !important; left: -9999px !important; top: auto; width: 1px; height: 1px; overflow: hidden; }
.preview-banner { position: sticky; top: 0; z-index: 2000; text-align: center; padding: .5rem 1rem; font-weight: 700; font-size: .9rem; color: #1a1400; background: #ffd23f; box-shadow: 0 2px 10px rgba(0,0,0,.18); }
.preview-banner i { margin-right: .4rem; }
.org-admin-avatar { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; overflow: hidden; background: var(--bai-soft); border: 1px solid var(--bai-line); font-weight: 700; font-size: .8rem; color: var(--bai-blue-700, var(--bai-ink)); }
.org-admin-avatar img { width: 100%; height: 100%; object-fit: cover; }
.org-member-role2 { display: block; color: var(--bai-muted); font-size: .82rem; }
.org-bio-btn { align-self: flex-start; margin-top: .5rem; display: inline-flex; align-items: center; gap: .35rem; padding: .25rem .7rem; font-size: .8rem; font-weight: 600; color: var(--bai-blue-700, var(--bai-ink)); background: var(--bai-soft); border: 1px solid var(--bai-line); border-radius: 999px; cursor: pointer; transition: background .15s, border-color .15s; }
.org-bio-btn:hover { background: #fff; border-color: var(--bai-accent); }
.org-bio-modal .modal-content { position: relative; border: 0; border-radius: 14px; overflow: hidden; }
.org-bio-close { position: absolute; top: 1rem; right: 1rem; z-index: 2; }
.org-bio-body { padding: 2rem clamp(1.5rem, 4vw, 2.75rem) 2.25rem; }
.org-bio-head { display: flex; align-items: center; gap: 1.1rem; margin-bottom: 1.1rem; }
.org-bio-avatar { display: inline-flex; align-items: center; justify-content: center; width: 84px; height: 84px; flex: 0 0 84px; border-radius: 50%; overflow: hidden; background: var(--bai-soft); border: 1px solid var(--bai-line); font-weight: 800; font-size: 1.4rem; color: var(--bai-blue-700, var(--bai-ink)); }
.org-bio-avatar img { width: 100%; height: 100%; object-fit: cover; }
.org-bio-head h2 { font-size: 1.4rem; margin: 0 0 .15rem; }
.org-bio-role { margin: 0; color: var(--bai-accent); font-weight: 600; }
.org-bio-text { margin: 0; font-size: 1.02rem; line-height: 1.7; color: var(--bai-ink); white-space: pre-line; }
.pagetext-image { display: grid; gap: .6rem; max-width: 620px; }
.pagetext-image .cms-image-preview { max-width: 100%; border-radius: 8px; border: 1px solid var(--bai-line); }

/* Foto de fundo opcional no hero (slot hero.image das páginas com layout próprio).
   Aplica a foto com sobreposição escura para garantir legibilidade do texto branco.
   Sem foto, a classe não é adicionada e o hero mantém o seu gradiente/padrão. */
.has-hero-photo {
  background-image: linear-gradient(rgba(4, 16, 38, .74), rgba(4, 16, 38, .74)), var(--hero-photo) !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  color: #fff !important;
}
.has-hero-photo .eyebrow,
.has-hero-photo h1,
.has-hero-photo h2,
.has-hero-photo p,
.has-hero-photo .content-hero-icon { color: #fff !important; }

/* Painel de automação de câmbios (BCV) */
.bcv-panel { max-width: 1480px; margin: 0 auto; background: var(--bai-surface); border: 1px solid var(--bai-line); border-radius: 10px; padding: 1.1rem 1.25rem; display: grid; gap: 1rem; }
.bcv-mode-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .6rem; margin-top: .4rem; }
.bcv-mode-options label { display: grid; gap: .15rem; padding: .6rem .75rem; border: 1px solid var(--bai-line); border-radius: 8px; cursor: pointer; }
.bcv-mode-options label.is-active { border-color: var(--bai-accent); background: var(--bai-soft); }
.bcv-mode-options small { color: var(--bai-muted); }
.bcv-actions { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }

/* Hub central de Páginas: secções agrupadas (alinhadas ao cabeçalho/tabelas a 1480px) */
.admin-section-block { max-width: 1480px; margin: 2.25rem auto 0; }
.admin-section-block:first-of-type { margin-top: 1.25rem; }
.admin-subhead { margin-bottom: .75rem; }
.admin-subhead h2 { font-size: 1.15rem; margin: 0 0 .2rem; }
.admin-subhead p { margin: 0; color: var(--bai-muted); font-size: .9rem; }

/* Importação Excel ATM/POS */
.import-map-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: .85rem; margin: .6rem 0 0; }
.import-map-row { display: flex; flex-direction: column; gap: .3rem; }
.import-preview { max-height: 340px; overflow: auto; }
.import-preview table { font-size: .82rem; white-space: nowrap; }

/* Aparência: pré-visualização do tema */
.theme-preview-panel { position: sticky; top: .75rem; z-index: 20; border: 1px solid var(--bai-line); border-radius: 16px; overflow: hidden; margin-bottom: 1.4rem; background: var(--bai-surface); box-shadow: 0 10px 30px rgba(5,20,45,.12); }
.theme-impact { display: block; margin-top: .4rem; color: var(--bai-ink-soft, #667); font-size: .78rem; line-height: 1.4; }
.theme-impact i { color: var(--bai-accent); }
.theme-preview-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .65rem 1rem; background: var(--bai-surface); border-bottom: 1px solid var(--bai-line); flex-wrap: wrap; }
.theme-preview-actions { display: flex; gap: .5rem; flex: none; }
.theme-save-status { display: inline-block; margin-left: .5rem; font-size: .82rem; font-weight: 600; }
.theme-save-status.is-pending { color: var(--bai-ink-soft, #667); }
.theme-save-status.is-ok { color: #1a7f37; }
.theme-save-status.is-error { color: #b42318; }
.cms-group-save { display: flex; align-items: center; justify-content: flex-end; gap: .6rem; padding: .6rem 0 0; }
.theme-preview-head strong { font-size: .98rem; }
.theme-preview-muted { color: var(--bai-ink-soft, #667); font-size: .84rem; }
.theme-preview-mock { display: grid; font-family: var(--bai-font); }
.tpm-header { display: flex; align-items: center; gap: .75rem; padding: .55rem 1rem; background: var(--bai-header-pattern, none), var(--bai-header-bg, #fff); color: var(--bai-header-ink, #111827); border-bottom: 1px solid rgba(0,0,0,.08); font-size: .8rem; }
.tpm-logo { font-weight: 800; letter-spacing: .04em; }
.tpm-nav { flex: 1; color: var(--bai-header-ink, #111827); opacity: .75; }
.tpm-btn { background: var(--bai-blue); color: #fff; padding: .28rem .6rem; border-radius: 8px; font-weight: 700; }
.tpm-hero { padding: 1.3rem 1rem 1.5rem; color: #fff; background: var(--bai-dots-light), var(--bai-hero-gradient, linear-gradient(140deg, #050f22 0%, #071b3c 46%, var(--bai-blue-700) 100%)); background-size: 168px, cover; }
.tpm-eyebrow { color: var(--bai-aqua); font-weight: 700; text-transform: uppercase; letter-spacing: .08em; font-size: .7rem; }
.tpm-hero strong { display: block; font-size: 1.7rem; font-weight: 800; margin: .15rem 0 .7rem; }
.tpm-hero-actions { display: flex; align-items: center; gap: 1rem; }
.tpm-cta { background: var(--bai-blue); color: #fff; padding: .45rem 1rem; border-radius: 10px; font-weight: 700; }
.tpm-link { color: var(--bai-aqua); font-weight: 650; }
.tpm-footer { display: flex; align-items: center; justify-content: space-between; padding: .7rem 1rem; background: var(--bai-section-gradient, var(--bai-blue-900)); color: rgba(255,255,255,.8); font-size: .8rem; }
.tpm-chip { background: var(--bai-aqua); color: #06283b; padding: .22rem .65rem; border-radius: 999px; font-weight: 700; font-size: .72rem; }

/* Aparência: cores, padrões e gradientes */
.cms-color-field { display: flex; align-items: center; gap: .6rem; }
.cms-color-field input[type="color"] { width: 48px; height: 42px; padding: 2px; border: 1px solid var(--bai-line); border-radius: 10px; background: var(--bai-surface); cursor: pointer; flex: none; }
.cms-color-field .form-control { max-width: 160px; font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; }
.gradient-builder { border: 1px solid var(--bai-line); border-radius: 12px; padding: .75rem .85rem; margin-bottom: .5rem; background: var(--bai-surface-muted, #f4f6fb); }
.gradient-builder-bar { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .6rem; }
.gradient-angle { display: inline-flex; align-items: center; gap: .35rem; font-size: .85rem; font-weight: 600; color: var(--bai-ink-soft, #556); margin: 0; }
.gradient-angle input { width: 76px; }
.gradient-stops { display: flex; flex-direction: column; gap: .45rem; }
.grad-stop { display: flex; align-items: center; gap: .5rem; }
.grad-stop input[type="color"] { width: 42px; height: 38px; padding: 2px; border: 1px solid var(--bai-line); border-radius: 8px; background: var(--bai-surface); cursor: pointer; flex: none; }
.grad-stop input[type="number"] { width: 84px; }
.grad-stop span { color: var(--bai-ink-soft, #667); font-size: .85rem; }
.grad-stop-remove { margin-left: auto; width: 28px; height: 28px; border: 1px solid var(--bai-line); border-radius: 8px; background: var(--bai-surface); color: #b42318; font-size: 1.1rem; line-height: 1; cursor: pointer; }
.grad-stop-remove:hover { background: #fdecec; }
.gradient-css-field { font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: .8rem; }
.cms-gradient-presets { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .6rem; }
.cms-gradient-chip { position: relative; width: 96px; height: 46px; border: 1px solid var(--bai-line); border-radius: 10px; cursor: pointer; overflow: hidden; padding: 0; }
.cms-gradient-chip span { position: absolute; left: 0; right: 0; bottom: 0; font-size: .62rem; font-weight: 600; color: #fff; background: rgba(5,20,45,.55); padding: .12rem .2rem; text-align: center; }
.cms-gradient-chip:hover { outline: 2px solid var(--bai-accent); outline-offset: 1px; }

/* Parceiros (página pública) */
.partner-group { margin-bottom: 2.4rem; }
.partner-group-head { font-size: 1.15rem; font-weight: 800; color: var(--bai-blue, #003a8c); margin: 0 0 1.1rem; padding-bottom: .5rem; border-bottom: 2px solid var(--bai-line); }
.partner-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1.1rem; }
.partner-card { display: flex; flex-direction: column; gap: .55rem; padding: 1.35rem; border: 1px solid var(--bai-line); border-radius: 16px; background: var(--bai-card); box-shadow: var(--shadow-sm); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.partner-card:hover { transform: translateY(-5px); border-color: rgba(34,63,127,.28); box-shadow: 0 20px 50px rgba(34,63,127,.12); }
.partner-logo { width: 100%; height: 84px; display: flex; align-items: center; justify-content: flex-start; }
.partner-logo img { max-height: 84px; max-width: 180px; object-fit: contain; }
.partner-logo-fallback { display: inline-flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 14px; background: var(--bai-surface-muted, #eef2fb); color: var(--bai-blue, #003a8c); font-size: 1.7rem; font-weight: 800; }
.partner-card h3 { margin: 0; font-size: 1.15rem; font-weight: 800; }
.partner-card p { margin: 0; color: var(--bai-muted); font-size: .92rem; line-height: 1.5; }
.partner-link { margin-top: auto; padding-top: .35rem; color: var(--bai-accent); font-weight: 650; font-size: .9rem; }

/* Admin produtos: agrupamento por público e categoria */
.prod-group { border: 1px solid var(--bai-line); border-radius: 14px; background: var(--bai-surface); margin-bottom: 1.1rem; overflow: hidden; }
.prod-group[open] { box-shadow: 0 1px 0 var(--bai-line); }
.prod-group-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .95rem 1.15rem; cursor: pointer; list-style: none; background: var(--bai-surface-muted, #eef2fb); font-weight: 700; }
.prod-group-head::-webkit-details-marker { display: none; }
.prod-group-head::before { content: "\25B8"; color: var(--bai-blue, #003a8c); font-size: .9rem; transition: transform .18s ease; margin-right: -.3rem; }
.prod-group[open] > .prod-group-head::before { transform: rotate(90deg); }
.prod-group-title { flex: 1; font-size: 1.05rem; color: var(--bai-ink); }
.prod-group-meta { font-size: .8rem; font-weight: 600; color: var(--bai-ink-soft, #667); white-space: nowrap; }
.prod-cat { padding: .35rem 1.15rem 1rem; }
.prod-cat + .prod-cat { border-top: 1px dashed var(--bai-line); }
.prod-cat-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin: .85rem 0 .5rem; }
.prod-cat-head h2 { font-size: .95rem; margin: 0; color: var(--bai-blue, #003a8c); display: flex; align-items: center; gap: .5rem; }
.prod-cat-count { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; padding: 0 .4rem; border-radius: 999px; background: var(--bai-surface-muted, #eef1f8); color: var(--bai-ink-soft, #667); font-size: .72rem; font-weight: 700; }
.prod-cat .admin-table { margin-bottom: 0; }

/* Telemóvel: hero como banner — a fotografia aparece por inteiro (proporcional)
   e o texto fica por baixo, sobre o fundo de marca, com bom contraste.
   (Em vez de a foto paisagem ser cortada num retrato alto, mostrando só uma
   fatia — "apresentação parcial".) */
@media (max-width: 680px) {
  .people-hero:not(.brand-hero) { display: block; min-height: 0; background: var(--bai-blue-900); }
  .people-hero:not(.brand-hero) .people-hero-image {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    object-position: 55% 32%;
    transform: none;
    animation: none;
  }
  .people-hero:not(.brand-hero) .people-hero-overlay { display: none; }
  .people-hero:not(.brand-hero) .people-hero-copy {
    position: relative;
    width: 100%;
    min-height: 0;
    margin-left: 0;
    padding: 1.75rem 1.15rem 1.5rem;
  }
  .people-hero:not(.brand-hero) .hero-service-dock { margin: 1.25rem 1rem 1.75rem; }
}

/* ===========================================================================
   Heros de FUNDO (institucional, detalhe de produto) em telemóvel: mostrar a
   IMAGEM INTEIRA (sem corte) numa faixa e o texto POR BAIXO.
   Colocado no FIM do ficheiro e com selectores pai (maior especificidade) para
   vencer as regras-base (.product-detail-media/.institutional-hero-media que vêm
   depois no ficheiro e, com igual especificidade, ganhavam por ordem).
   =========================================================================== */
@media (max-width: 640px) {
  .institutional-hero.institutional-hero,
  .product-detail-hero.product-detail-hero { display: block; min-height: 0; }

  .institutional-hero .institutional-hero-media,
  .product-detail-hero .product-detail-media {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-color: var(--bai-blue-900);
  }
  .institutional-hero .institutional-hero-overlay,
  .product-detail-hero .product-detail-overlay { display: none; }
  .institutional-hero .institutional-hero-copy,
  .product-detail-hero .product-detail-copy {
    position: relative;
    min-height: 0;
    width: auto;
    margin: 0;
    padding: 1.4rem 1.1rem 1.8rem;
    background: var(--bai-blue-900);
  }

  /* Heros de FUNDO ÚNICO (imagem no próprio background, texto por cima):
     .magazine-hero (min-height grande) e .has-hero-photo (helper --hero-photo).
     A imagem passa a mostrar-se INTEIRA (contain) numa faixa via ::before e o texto
     flui por baixo — mesmo princípio dos heros com media separado, sem corte. */
  .magazine-hero,
  .has-hero-photo {
    display: block !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: var(--bai-blue-900) !important;
  }
  .magazine-hero::before,
  .has-hero-photo::before {
    content: "";
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-color: var(--bai-blue-900);
  }
  .magazine-hero::before { background-image: url('/img/current-site/campanha-mundial.jpg'); }
  .has-hero-photo::before { background-image: var(--hero-photo); }
  /* Texto por baixo da faixa, com espaçamento confortável. */
  .magazine-hero > div,
  .has-hero-photo > * { padding-left: 1.1rem; padding-right: 1.1rem; }
  .magazine-hero > div { padding-top: 1.3rem; padding-bottom: 1.7rem; }
}

/* ===========================================================================
   Contraste no ESCURO: elementos que usavam a cor de marca fixa (--bai-blue,
   #223f7f) como TEXTO ficavam ilegíveis em cartões/secções que escurecem no
   tema escuro. Passam a usar --bai-accent (que clareia no escuro). --bai-blue
   é fundo em 53 sítios, por isso NÃO se altera o token — corrige-se só o texto.
   =========================================================================== */
[data-bs-theme="dark"] :is(
  .branch-kpis strong,
  .branch-service > p > i,
  .cv-map-legend strong,
  .branch-filter-bar [data-branch-filter-label],
  .branch-group-head,
  .home-news-card time
) { color: var(--bai-accent); }

/* ===========================================================================
   Simulador de investimento (abas por tipo) + FAQ (Investir). Usa tokens que
   viram no tema escuro.
   =========================================================================== */
.invest-sim { border: 1px solid var(--bai-line); border-radius: 18px; background: var(--bai-surface); box-shadow: var(--shadow-sm); overflow: hidden; }
.invest-sim-tabs { display: flex; flex-wrap: wrap; gap: .25rem; padding: .5rem; background: var(--bai-surface-muted); border-bottom: 1px solid var(--bai-line); }
.invest-sim-tabs button { flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; gap: .45rem; padding: .6rem .8rem; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--bai-ink); font-weight: 650; font-size: .9rem; cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
.invest-sim-tabs button:hover { background: var(--bai-surface); }
.invest-sim-tabs button.is-active { background: var(--bai-blue); border-color: var(--bai-blue); color: #fff; }
.invest-sim-tabs button i { font-size: .95rem; }
.invest-sim-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(1.2rem, 3vw, 2.5rem); padding: clamp(1.2rem, 3vw, 2rem); }
.invest-sim-inputs { display: flex; flex-direction: column; gap: 1rem; }
.invest-sim-inputs label { display: flex; flex-direction: column; gap: .35rem; font-size: .85rem; font-weight: 650; color: var(--bai-ink-soft); }
.invest-sim-inputs input { padding: .65rem .8rem; border: 1px solid var(--bai-line); border-radius: 10px; background: var(--bai-surface); color: var(--bai-ink); font-size: 1.05rem; font-weight: 700; }
.invest-sim-inputs input:focus-visible { outline: none; border-color: var(--bai-blue); box-shadow: 0 0 0 3px rgba(34,63,127,.18); }
.invest-sim-inputs [data-term-unit] { color: var(--bai-muted); font-weight: 500; }
.invest-sim-result { display: flex; flex-direction: column; gap: .75rem; }
.invest-sim-hint { margin: 0; font-size: .88rem; color: var(--bai-muted); }
.invest-sim-bar { display: flex; height: 14px; border-radius: 999px; overflow: hidden; background: var(--bai-surface-muted); }
.invest-sim-bar span { display: block; height: 100%; transition: width .3s ease; }
.invest-sim-bar span[data-bar-invested] { background: var(--bai-blue); }
.invest-sim-bar span[data-bar-return] { background: var(--bai-aqua); }
.invest-sim-legend { display: flex; gap: 1.2rem; font-size: .78rem; color: var(--bai-muted); }
.invest-sim-legend i { display: inline-block; width: .7rem; height: .7rem; border-radius: 3px; margin-right: .35rem; background: var(--bai-blue); vertical-align: middle; }
.invest-sim-legend .ret i { background: var(--bai-aqua); }
.invest-sim-figures { list-style: none; margin: .25rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .1rem; }
.invest-sim-figures li { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: .5rem 0; border-bottom: 1px solid var(--bai-line); }
.invest-sim-figures li span { color: var(--bai-ink-soft); font-size: .9rem; }
.invest-sim-figures li strong { font-size: 1.05rem; font-weight: 800; color: var(--bai-strong); font-variant-numeric: tabular-nums; }
.invest-sim-figures li.is-total strong { color: var(--bai-blue); font-size: 1.3rem; }
[data-bs-theme="dark"] .invest-sim-figures li.is-total strong { color: var(--bai-accent); }
.invest-sim-scenarios { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin-top: .35rem; }
.invest-sim-scenarios div { text-align: center; padding: .6rem .4rem; border: 1px solid var(--bai-line); border-radius: 10px; background: var(--bai-surface-muted); }
.invest-sim-scenarios span { display: block; font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--bai-muted); }
.invest-sim-scenarios strong { display: block; margin-top: .2rem; font-size: .95rem; font-weight: 800; color: var(--bai-strong); font-variant-numeric: tabular-nums; }
.invest-sim-note { display: flex; gap: .5rem; align-items: flex-start; margin: 0; padding: .85rem clamp(1.2rem,3vw,2rem); border-top: 1px solid var(--bai-line); background: var(--bai-surface-muted); font-size: .8rem; color: var(--bai-muted); line-height: 1.5; }
@media (max-width: 760px) { .invest-sim-body { grid-template-columns: 1fr; } .invest-sim-tabs button { flex-basis: calc(50% - .25rem); } }

/* FAQ (details/summary acessível) */
.faq-list { display: flex; flex-direction: column; gap: .6rem; max-width: 60rem; }
.faq-item { border: 1px solid var(--bai-line); border-radius: 12px; background: var(--bai-surface); overflow: hidden; }
.faq-item summary { list-style: none; cursor: pointer; padding: 1rem 1.2rem; font-weight: 700; color: var(--bai-strong); display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "\2b"; font-family: inherit; font-size: 1.2rem; color: var(--bai-blue); flex: none; transition: transform .2s ease; }
[data-bs-theme="dark"] .faq-item summary::after { color: var(--bai-accent); }
.faq-item[open] summary::after { content: "\2212"; }
.faq-item > div { padding: 0 1.2rem 1.1rem; }
.faq-item p { margin: 0; color: var(--bai-ink-soft); line-height: 1.6; }

/* Homepage — campanha em destaque (dentro da narrativa) em telemóvel: remover o clip-path
   diagonal e a min-height alta que davam sensação de "cortado"; mostrar a imagem inteira
   (contain) e a copy por baixo, como no componente de campanha autónomo. */
@media (max-width: 640px) {
  .home-story-sequence .campaign-strip { min-height: 0 !important; clip-path: none !important; display: block; }
  .home-story-sequence .campaign-media { position: relative; inset: auto; }
  .home-story-sequence .campaign-media img { height: auto; object-fit: contain; transform: none !important; }
  .home-story-sequence .campaign-copy { position: relative; transform: none !important; padding: 1.3rem 1.1rem 1.7rem; }
}

/* ===== Formulário de apoio: identificação e anexos ===== */
.form-identify {
  border: 1px solid var(--bs-border-color, #dee2e6);
  border-radius: 12px;
  padding: 1rem 1.1rem 1.15rem;
  margin: 0.2rem 0 0.4rem;
}
.form-identify legend {
  float: none;
  font-size: 0.98rem;
  font-weight: 600;
  width: auto;
  margin-bottom: 0.15rem;
}
.form-identify .req { color: #c0392b; }
/* Duas colunas alinhadas: label em cima + controlo, mesma estrutura e altura. */
.form-identify .form-row { align-items: start; }
.form-field { display: flex; flex-direction: column; }
.form-field > .form-label { margin-bottom: 0.35rem; font-size: 0.9rem; font-weight: 500; }
.form-field > .form-select,
.form-field > .form-control { height: calc(3.5rem); }
.form-attachments { margin: 0.2rem 0 0.4rem; }
.form-attachments input[type="file"] { padding: 0.5rem 0.7rem; }

/* ===== Página de erro amigável (absorção de erros) ===== */
.error-page {
  max-width: 640px;
  margin: 0 auto;
  text-align: center;
}
.error-page-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 84px;
  height: 84px;
  border-radius: 50%;
  background: rgba(217, 145, 0, 0.12);
  color: #d99100;
  font-size: 2.1rem;
  margin-bottom: 1.2rem;
}
.error-page h1 { font-size: clamp(1.5rem, 3vw, 2.1rem); margin-bottom: 0.6rem; }
.error-page-ref {
  margin-top: 1.4rem;
  font-size: 0.98rem;
}
.error-page-ref code {
  background: rgba(0, 0, 0, 0.06);
  padding: 0.2rem 0.55rem;
  border-radius: 6px;
  font-weight: 600;
}
.error-page-actions {
  display: flex;
  gap: 0.7rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 1.8rem;
}

/* Detalhe expansível do erro no backoffice (Admin/Erros) */
.error-detail summary {
  cursor: pointer;
  color: var(--bs-secondary-color, #6c757d);
  font-size: 0.9rem;
  white-space: normal;
}
.error-detail pre {
  margin-top: 0.5rem;
  max-height: 260px;
  overflow: auto;
  background: rgba(0, 0, 0, 0.05);
  padding: 0.7rem 0.8rem;
  border-radius: 8px;
  font-size: 0.78rem;
  white-space: pre-wrap;
  word-break: break-word;
}

/* Ligação "Boas práticas no uso dos cartões" na faixa de apoio a cartões. */
.card-support-tips {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  margin-top: .7rem;
  font-weight: 600;
  font-size: .92rem;
  color: var(--bai-blue, #0b2f5e);
  text-decoration: none;
}
.card-support-tips:hover { text-decoration: underline; text-underline-offset: 3px; }
.card-support-tips .fa-lightbulb { color: var(--bai-accent, #7fa326); }

/* Bloco "Texto + Imagem" (media) do construtor de páginas. */
.builder-block-media .builder-media-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5rem; align-items: center; }
.builder-block-media.media-image-left .builder-media-figure { order: -1; }
.builder-media-figure { margin: 0; }
.builder-media-figure img { width: 100%; border-radius: 14px; display: block; }
.builder-media-figure figcaption { font-size: .85rem; color: var(--bai-muted, #56637a); margin-top: .5rem; }
.builder-media-text .builder-richtext ul { margin: .5rem 0 0; padding-left: 1.2rem; }
.builder-media-text .builder-richtext li { margin: .3rem 0; }
@media (max-width: 800px) { .builder-block-media .builder-media-grid { grid-template-columns: 1fr; gap: 1.4rem; } .builder-block-media.media-image-left .builder-media-figure { order: 0; } }

/* Secções livres do detalhe de produto */
.product-section-image { max-width: 100%; border-radius: 12px; margin: .25rem 0 .6rem; }
.product-section-body ul { margin: 0; padding-left: 1.1rem; }
.product-section-body p { margin: 0 0 .5rem; }

/* ---------------------------------------------------------------------------
   Conteúdo criado no editor de texto formatado (notícias, campanhas, produtos,
   páginas). O site continua a mandar na tipografia; aqui garante-se apenas que
   nada transborda a caixa e que o espaçamento é previsível.
   --------------------------------------------------------------------------- */
.article-richtext,
.campaign-body,
.product-richtext,
.rich-content {
  color: #26344d;
  font-size: 1.15rem;
  line-height: 1.85;
  max-width: 100%;
  overflow-wrap: anywhere;   /* palavras/URLs longos nunca empurram a caixa */
  word-break: normal;
}

.article-richtext > *:first-child,
.campaign-body > *:first-child,
.product-richtext > *:first-child,
.rich-content > *:first-child { margin-top: 0; }

.article-richtext p,
.campaign-body p,
.product-richtext p,
.rich-content p { margin: 0 0 1.15rem; }

.article-richtext h2, .rich-content h2 { font-size: 1.6rem; line-height: 1.25; margin: 2.2rem 0 .9rem; }
.article-richtext h3, .rich-content h3 { font-size: 1.3rem; line-height: 1.3; margin: 1.8rem 0 .7rem; }

.article-richtext ul, .article-richtext ol,
.campaign-body ul, .campaign-body ol,
.product-richtext ul, .product-richtext ol,
.rich-content ul, .rich-content ol { margin: 0 0 1.15rem; padding-left: 1.4rem; }

.article-richtext li, .rich-content li { margin: .35rem 0; }

.article-richtext img, .campaign-body img, .product-richtext img, .rich-content img { max-width: 100%; height: auto; }

.article-richtext table, .rich-content table { display: block; max-width: 100%; overflow-x: auto; }

.article-richtext a, .rich-content a { color: var(--bai-accent); text-decoration: underline; text-underline-offset: 2px; }

/* Avanço de parágrafo (botões de recuo/avanço do editor): 8 níveis, como no Quill. */
.ql-indent-1 { padding-left: 2rem; }
.ql-indent-2 { padding-left: 4rem; }
.ql-indent-3 { padding-left: 6rem; }
.ql-indent-4 { padding-left: 8rem; }
.ql-indent-5 { padding-left: 10rem; }
.ql-indent-6 { padding-left: 12rem; }
.ql-indent-7 { padding-left: 14rem; }
.ql-indent-8 { padding-left: 16rem; }

@media (max-width: 600px) {
  .ql-indent-1 { padding-left: 1rem; }
  .ql-indent-2 { padding-left: 2rem; }
  .ql-indent-3, .ql-indent-4, .ql-indent-5,
  .ql-indent-6, .ql-indent-7, .ql-indent-8 { padding-left: 3rem; }
}

/* ---------------------------------------------------------------------------
   Classes que o editor de texto formatado grava (alinhamento, avanço, citação).
   Sem estas regras o gestor aplicava o formato, via-o no backoffice e no site
   não acontecia nada — o backoffice tem o CSS do editor, o site não.
   --------------------------------------------------------------------------- */
.product-richtext { font-size: 1rem; line-height: 1.65; }

.ql-align-left { text-align: left; }
.ql-align-center { text-align: center; }
.ql-align-right { text-align: right; }
.ql-align-justify { text-align: justify; }
.ql-direction-rtl { direction: rtl; text-align: inherit; }

.article-richtext blockquote,
.campaign-body blockquote,
.product-richtext blockquote,
.rich-content blockquote {
  margin: 1.2rem 0;
  padding: .35rem 0 .35rem 1.1rem;
  border-left: 3px solid var(--bai-aqua);
  color: #35435c;
}

.article-richtext pre, .product-richtext pre, .rich-content pre {
  padding: 1rem; border-radius: 12px; background: #f2f5fa; overflow-x: auto;
}

/* Subtítulo dentro de uma coluna do rodapé (ex.: «Políticas e regulamentos» em «Institucional»). */
.footer-column .footer-subheading {
  display: block;
  margin: 1.1rem 0 .35rem;
  color: rgba(255, 255, 255, .95);
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.footer-column .footer-subheading:first-child { margin-top: 0; }

/* ===========================================================================
   Simulador ATM em HTML — aspetos «Ecrã limpo» (data-skin="ecra") e
   «Guia por passos» (data-skin="passos"). Escolhidos em Admin › Simulador ATM.
   O aspeto «Terminal realista» continua a ser o canvas 3D.
   =========================================================================== */
.atm-dom-shell { display: flex; align-items: center; justify-content: center; padding: clamp(1.25rem, 3vw, 2.5rem); }
.atm-dom-stage { width: min(760px, 100%); display: flex; flex-direction: column; gap: .9rem; }
.atm-dom-unavailable { color: #cfe0f5; font-size: .95rem; }

.atm-dom-screen { display: flex; flex-direction: column; border-radius: 14px; overflow: hidden; }
.atm-dom-screen-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem 1.15rem; font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.atm-dom-live { display: inline-flex; align-items: center; gap: .45rem; letter-spacing: .04em; text-transform: none; font-size: .72rem; }
.atm-dom-live i { width: 7px; height: 7px; border-radius: 999px; background: #1c7c4a; display: block; }
.atm-dom-screen-body { display: flex; flex-direction: column; gap: 1.1rem; padding: 1.5rem 1.75rem 1.75rem; }
.atm-dom-title { margin: 0; font-size: 1.35rem; font-weight: 700; letter-spacing: -0.01em; }
.atm-dom-subtitle { margin: 0; font-size: .88rem; line-height: 1.55; }

.atm-dom-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem .85rem; }
.atm-dom-option { display: flex; align-items: center; gap: .75rem; padding: .8rem .9rem; border-radius: 8px; font: inherit; font-size: .92rem; font-weight: 600; text-align: left; cursor: pointer; transition: background var(--motion-fast, 150ms) ease, border-color var(--motion-fast, 150ms) ease; min-height: 48px; }
.atm-dom-option-icon { display: inline-flex; flex: none; }
.atm-dom-option-icon svg { width: 20px; height: 20px; }

.atm-dom-keypad-panel { display: grid; grid-template-columns: minmax(0, 1fr) 210px; gap: 1rem; align-items: start; }
.atm-dom-display { padding: .9rem 1rem; border-radius: 8px; font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 1.35rem; letter-spacing: .18em; }
.atm-dom-keypad { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; }
.atm-dom-key { min-height: 46px; border-radius: 8px; font: inherit; font-weight: 650; cursor: pointer; }
.atm-dom-key.is-confirm { font-weight: 800; }

.atm-dom-standby, .atm-dom-done, .atm-dom-progress { display: flex; align-items: center; justify-content: center; gap: .8rem; padding: 1.5rem 0; }
.atm-dom-standby-icon svg, .atm-dom-done-icon svg, .atm-dom-progress-icon svg { width: 46px; height: 46px; }
.atm-dom-progress-bar { position: relative; width: 180px; height: 4px; border-radius: 999px; overflow: hidden; }
.atm-dom-progress-bar i { position: absolute; inset: 0; width: 40%; border-radius: 999px; animation: atm-dom-slide 1.1s ease-in-out infinite; }
@keyframes atm-dom-slide { 0% { transform: translateX(-100%); } 100% { transform: translateX(250%); } }

.atm-dom-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.atm-dom-note { font-size: .78rem; }
.atm-dom-actions { display: flex; gap: .5rem; }
.atm-dom-btn { padding: .55rem .95rem; border-radius: 8px; font: inherit; font-size: .85rem; font-weight: 650; cursor: pointer; min-height: 44px; }

/* --- B · Ecrã limpo: painel claro sobre o fundo escuro da secção --- */
.atm-dom-shell[data-skin="ecra"] .atm-dom-screen { background: #ffffff; border: 1px solid #cfdaea; box-shadow: var(--shadow-md); }
.atm-dom-shell[data-skin="ecra"] .atm-dom-screen-head { background: #f9fbfe; border-bottom: 1px solid #e4ebf5; color: #61708a; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-live { color: #1c7c4a; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-title { color: #071b3c; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-subtitle { color: #61708a; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-option { background: #ffffff; border: 1px solid #dbe4f1; border-left: 3px solid #223f7f; color: #111827; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-option:hover { background: #f4f7fb; border-color: #223f7f; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-option-icon { color: #223f7f; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-display { background: #f4f7fb; border: 1px solid #dbe4f1; color: #071b3c; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-key { background: #ffffff; border: 1px solid #dbe4f1; color: #111827; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-key:hover { background: #f4f7fb; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-key.is-confirm { background: #223f7f; border-color: #223f7f; color: #ffffff; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-standby-icon, .atm-dom-shell[data-skin="ecra"] .atm-dom-progress-icon { color: #223f7f; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-done-icon { color: #1c7c4a; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-progress-bar { background: #e4ebf5; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-progress-bar i { background: #223f7f; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-note { color: #b9c6dd; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-btn { background: #ffffff; border: 1px solid #cfdaea; color: #223f7f; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-btn.is-primary { background: #223f7f; border-color: #223f7f; color: #ffffff; }

/* --- C · Guia por passos: cartões sobre o fundo escuro --- */
.atm-dom-shell[data-skin="passos"] .atm-dom-screen { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.16); }
.atm-dom-shell[data-skin="passos"] .atm-dom-screen-head { background: rgba(255,255,255,.05); border-bottom: 1px solid rgba(255,255,255,.14); color: #a9b8d1; }
.atm-dom-shell[data-skin="passos"] .atm-dom-live { color: #7ee0a8; }
.atm-dom-shell[data-skin="passos"] .atm-dom-live i { background: #7ee0a8; }
.atm-dom-shell[data-skin="passos"] .atm-dom-title { color: #ffffff; }
.atm-dom-shell[data-skin="passos"] .atm-dom-subtitle { color: #b9c6dd; }
.atm-dom-shell[data-skin="passos"] .atm-dom-options { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.atm-dom-shell[data-skin="passos"] .atm-dom-option { flex-direction: column; align-items: flex-start; gap: .55rem; padding: 1rem .9rem; min-height: 118px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.16); color: #ffffff; border-radius: 12px; }
.atm-dom-shell[data-skin="passos"] .atm-dom-option:hover { background: rgba(105,199,223,.14); border-color: #69c7df; }
.atm-dom-shell[data-skin="passos"] .atm-dom-option-icon { color: #69c7df; }
.atm-dom-shell[data-skin="passos"] .atm-dom-option-icon svg { width: 24px; height: 24px; }
.atm-dom-shell[data-skin="passos"] .atm-dom-display { background: rgba(0,0,0,.28); border: 1px solid rgba(255,255,255,.18); color: #ffffff; }
.atm-dom-shell[data-skin="passos"] .atm-dom-key { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); color: #ffffff; }
.atm-dom-shell[data-skin="passos"] .atm-dom-key:hover { background: rgba(255,255,255,.16); }
.atm-dom-shell[data-skin="passos"] .atm-dom-key.is-confirm { background: #69c7df; border-color: #69c7df; color: #071b3c; }
.atm-dom-shell[data-skin="passos"] .atm-dom-standby-icon, .atm-dom-shell[data-skin="passos"] .atm-dom-progress-icon { color: #69c7df; }
.atm-dom-shell[data-skin="passos"] .atm-dom-done-icon { color: #7ee0a8; }
.atm-dom-shell[data-skin="passos"] .atm-dom-progress-bar { background: rgba(255,255,255,.16); }
.atm-dom-shell[data-skin="passos"] .atm-dom-progress-bar i { background: #69c7df; }
.atm-dom-shell[data-skin="passos"] .atm-dom-note { color: #a9b8d1; }
.atm-dom-shell[data-skin="passos"] .atm-dom-btn { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.22); color: #ffffff; }
.atm-dom-shell[data-skin="passos"] .atm-dom-btn.is-primary { background: #69c7df; border-color: #69c7df; color: #071b3c; }

@media (max-width: 860px) {
  .atm-dom-options, .atm-dom-shell[data-skin="passos"] .atm-dom-options { grid-template-columns: 1fr; }
  .atm-dom-keypad-panel { grid-template-columns: 1fr; }
}

/* Aviso quando o motor HTML do simulador não carregou (ficheiro em falta no servidor). */
.atm-dom-stage[data-fallback]::before {
  content: "O simulador não carregou. Confirme que o ficheiro js/atm-simulator-dom.js foi publicado no servidor.";
  display: block;
  padding: 1.1rem 1.25rem;
  border: 1px dashed rgba(255,255,255,.35);
  border-radius: 12px;
  color: #cfe0f5;
  font-size: .9rem;
  line-height: 1.5;
}

/* Aspeto «Terminal em foto»: o simulador desenhado sobre a fotografia do equipamento. */
.atm-dom-shell[data-skin="foto"] { padding: clamp(.75rem, 1.5vw, 1.25rem); }
/* NOTA: nada de `line-height: 0` aqui. A imagem já é `display:block` (não deixa o espaço do
   inline), e um line-height nulo herdava para TUDO o que é desenhado dentro do ecrã —
   as linhas ficavam com altura zero e o texto era impresso umas por cima das outras. */
.atm-photo-frame { position: relative; margin: 0 auto; max-width: 100%; }
.atm-photo-frame img { display: block; width: auto; max-width: 100%; height: auto;
  /* limitada pela altura do palco (definida em Admin › Simulador ATM), menos os comandos. */
  max-height: calc(var(--atm-stage-height, 880px) - 9rem); border-radius: 10px; }
/* O ecrã da máquina: azul do banco e tudo dimensionado em «cqw» (percentagem da LARGURA do
   ecrã), para o texto crescer com a fotografia. Os valores em px antes de cada cqw são o
   recurso para browsers antigos. O rodapé de comandos é desenhado fora (atm-photo-controls). */
.atm-photo-screen {
  position: absolute; overflow: hidden;
  container-type: inline-size;
  line-height: 1.3;
  left: var(--atm-screen-x); top: var(--atm-screen-y);
  width: var(--atm-screen-w); height: var(--atm-screen-h);
  background: linear-gradient(160deg, #0f4391 0%, #0a2f6b 55%, #06214d 100%);
}
.atm-photo-screen .atm-dom-stage { width: 100%; height: 100%; gap: 0; }
.atm-photo-screen .atm-dom-screen { height: 100%; border-radius: 0; background: transparent; border: 0; }
.atm-photo-screen .atm-dom-screen-head {
  padding: 2cqw 3cqw; font-size: max(9px, 3.6cqw); letter-spacing: .04em;
  background: rgba(255,255,255,.10); border-bottom: 1px solid rgba(255,255,255,.20); color: #d3e3ff;
}
.atm-photo-screen .atm-dom-live { font-size: max(9px, 3.4cqw); color: #b9f0d0; }
.atm-photo-screen .atm-dom-live i { width: 2cqw; height: 2cqw; background: #46d18a; }
.atm-photo-screen .atm-dom-screen-body { padding: 3.5cqw 4cqw; gap: 2.6cqw; }
.atm-photo-screen .atm-dom-title { font-size: max(12px, 6.8cqw); font-weight: 800; color: #ffffff; line-height: 1.15; }
/* O subtítulo cabe outra vez nos ecrãs de escolha: as opções passaram a estar ancoradas às
   teclas e já não disputam a altura do ecrã. Nos ecrãs de TECLADO (PIN, montante,
   referência) o teclado ocupa o espaço todo — aí o subtítulo continua fora. */
.atm-photo-screen .atm-dom-subtitle { font-size: max(9px, 4.2cqw); color: #cfe0f8; line-height: 1.25; }
.atm-photo-screen .atm-dom-screen-body:has(.atm-dom-keypad-panel) .atm-dom-subtitle { display: none; }
/* O ecrã da máquina é um contentor de tamanho próprio: as suas colunas dependem da LARGURA
   DO ECRÃ e não da janela, senão no telemóvel a regra geral (uma coluna abaixo de 860 px)
   punha as operações em lista e o ecrã ficava diferente do computador. */
.atm-photo-screen .atm-dom-options { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2cqw 1.6cqw; }
@container (max-width: 190px) {
  .atm-photo-screen .atm-dom-options { grid-template-columns: 1fr; }
}
.atm-photo-screen .atm-dom-option {
  min-height: 0; padding: 1cqw 1.8cqw; font-size: max(10px, 4.6cqw); font-weight: 600;
  gap: 1.6cqw; border-radius: 1.2cqw; background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.34); color: #ffffff;
}
.atm-photo-screen .atm-dom-option:hover { background: rgba(255,255,255,.24); }
.atm-photo-screen .atm-dom-option-icon svg { width: 4.4cqw; height: 4.4cqw; }
.atm-photo-screen .atm-dom-option-icon { color: #8fe0f5; }
.atm-photo-screen .atm-dom-footer { display: none; }
.atm-photo-screen .atm-dom-keypad-panel { grid-template-columns: 1fr; gap: 2cqw; }
.atm-photo-screen .atm-dom-display {
  padding: 1.1cqw 2.4cqw; font-size: max(12px, 6.4cqw); font-weight: 700; letter-spacing: .1em;
  background: rgba(0,0,0,.30); border: 1px solid rgba(255,255,255,.30); color: #ffffff; text-align: center;
}
.atm-photo-screen .atm-dom-keypad { gap: 1.4cqw; }
.atm-photo-screen .atm-dom-key {
  min-height: 0; padding: 1.6cqw 0; font-size: max(10px, 5cqw); font-weight: 700;
  border-radius: 1.2cqw; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.32); color: #fff;
}
.atm-photo-screen .atm-dom-key:hover { background: rgba(255,255,255,.28); }
.atm-photo-screen .atm-dom-key.is-confirm { background: #46d18a; border-color: #46d18a; color: #05204a; }
.atm-photo-screen .atm-dom-standby, .atm-photo-screen .atm-dom-done, .atm-photo-screen .atm-dom-progress { padding: 2cqw 0; }
.atm-photo-screen .atm-dom-standby-icon svg, .atm-photo-screen .atm-dom-done-icon svg, .atm-photo-screen .atm-dom-progress-icon svg { width: 12cqw; height: 12cqw; color: #8fe0f5; }
.atm-photo-screen .atm-dom-progress-bar { height: 1.6cqw; background: rgba(255,255,255,.20); }
.atm-photo-screen .atm-dom-progress-bar i { background: #8fe0f5; }

/* Comandos por baixo da máquina (o rodapé do ecrã não cabe lá dentro). */
.atm-photo-controls { display: flex; align-items: center; justify-content: center; gap: .5rem; margin-top: .9rem; flex-wrap: wrap; }

/* «Terminal em foto»: a máquina ao alto e os comandos por baixo (não cabem dentro do ecrã). */
.atm-photo-layout { display: flex; flex-direction: column; align-items: center; gap: .85rem; width: 100%; max-width: 100%; }
.atm-photo-controls:empty { display: none; }
.atm-photo-controls .atm-dom-footer { flex-direction: column; align-items: center; gap: .5rem; }
.atm-photo-controls .atm-dom-note { color: #a9b8d1; text-align: center; }
.atm-photo-controls .atm-dom-btn { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.22); color: #ffffff; }
.atm-photo-controls .atm-dom-btn:hover { background: rgba(255,255,255,.16); }
.atm-photo-controls .atm-dom-btn.is-primary { background: #69c7df; border-color: #69c7df; color: #071b3c; }

/* «Terminal em foto»: a coluna da máquina tem a LARGURA DA FOTOGRAFIA (sem moldura vazia à
   volta) e o texto ocupa o resto. O fundo é o azul do site, não o quase-preto do palco 3D. */
/* Texto e máquina lado a lado, centrados como um par: com as colunas esticadas até às
   margens, a fotografia ficava encostada à direita e sobrava um vazio no meio. */
.atm-simulator-stage[data-skin="foto"] {
  grid-template-columns: minmax(360px, 720px) auto;
  justify-content: center;
  align-items: center;
  gap: clamp(1.5rem, 4vw, 4.5rem);
  padding: clamp(2rem, 4vw, 3.5rem) clamp(1rem, 4vw, 3rem);
}
.atm-simulator-stage[data-skin="foto"] .atm-canvas-shell {
  min-height: 0;
  background-color: transparent;
  background-image: linear-gradient(160deg, rgba(11,34,74,.55) 0%, rgba(7,27,60,.85) 100%);
}
.atm-simulator-stage[data-skin="foto"] .atm-canvas-shell::after { content: none; }
@media (max-width: 1200px) {
  .atm-simulator-stage[data-skin="foto"] { grid-template-columns: 1fr; }
}

/* Cartão, notas e comprovativo a entrar/sair das ranhuras da fotografia («Terminal em foto»).
   As medidas são em % da largura da fotografia para acompanharem qualquer tamanho de palco. */
.atm-photo-anim { position: absolute; transform: translate(-50%, -50%); pointer-events: none; z-index: 2; }

.atm-photo-anim.is-cartao-entra, .atm-photo-anim.is-cartao-sai {
  width: 9%; aspect-ratio: 1.6; border-radius: .25em;
  background: linear-gradient(135deg, #2f6fb5 0%, #0b2f6b 100%);
  box-shadow: 0 .2em .5em rgba(0, 0, 0, .45), inset 0 0 0 1px rgba(255, 255, 255, .25);
}
.atm-photo-anim.is-cartao-entra::after, .atm-photo-anim.is-cartao-sai::after {
  content: ""; position: absolute; left: 12%; top: 28%; width: 22%; height: 24%;
  border-radius: 2px; background: rgba(255, 214, 122, .95);
}
.atm-photo-anim.is-cartao-entra { animation: atm-cartao-entra 1.2s ease-in forwards; }
.atm-photo-anim.is-cartao-sai { animation: atm-cartao-sai 1.8s ease-out forwards; }
@keyframes atm-cartao-entra {
  0% { transform: translate(60%, -260%) rotate(-8deg); opacity: 0; }
  25% { opacity: 1; }
  100% { transform: translate(-50%, -50%) scale(.85); opacity: 0; }
}
@keyframes atm-cartao-sai {
  0% { transform: translate(-50%, -50%) scale(.85); opacity: 0; }
  30% { transform: translate(-50%, -120%); opacity: 1; }
  75% { transform: translate(-50%, -120%); opacity: 1; }
  100% { transform: translate(-50%, -120%); opacity: 0; }
}

.atm-photo-anim.is-notas { width: 14%; }
.atm-photo-anim.is-notas i {
  display: block; height: .55em; margin-top: .18em; border-radius: 2px;
  background: linear-gradient(90deg, #cfe3c8 0%, #eaf3e6 50%, #cfe3c8 100%);
  box-shadow: 0 .1em .25em rgba(0, 0, 0, .35);
  opacity: 0; animation: atm-notas 2.6s ease-out forwards;
}
.atm-photo-anim.is-notas i:nth-child(2) { animation-delay: .18s; }
.atm-photo-anim.is-notas i:nth-child(3) { animation-delay: .36s; }
@keyframes atm-notas {
  0% { opacity: 0; transform: translateY(-60%) scaleX(.6); }
  30% { opacity: 1; transform: translateY(0) scaleX(1); }
  80% { opacity: 1; transform: translateY(45%); }
  100% { opacity: 0; transform: translateY(90%); }
}

.atm-photo-anim.is-recibo {
  width: 7%; height: 0; background: #f7f9fc; border-radius: 0 0 2px 2px;
  box-shadow: 0 .15em .4em rgba(0, 0, 0, .35);
  background-image: repeating-linear-gradient(180deg, transparent 0 3px, rgba(120, 140, 170, .5) 3px 4px);
  transform: translate(-50%, 0); animation: atm-recibo 2.6s ease-out forwards;
}
@keyframes atm-recibo {
  0% { height: 0; opacity: 0; }
  20% { opacity: 1; }
  60% { height: 11%; opacity: 1; }
  85% { height: 11%; opacity: 1; }
  100% { height: 11%; opacity: 0; }
}

@media (prefers-reduced-motion: reduce) { .atm-photo-anim { display: none; } }

/* O simulador nunca deve ser mais alto do que a janela: com 1080 px fixos, num portátil a
   máquina ficava cortada e era preciso andar a rolar a meio de uma operação. O tamanho definido
   no backoffice continua a ser o máximo, em ecrãs que o comportem. */
.atm-simulator-stage[data-skin="foto"] { min-height: 0; }
.atm-simulator-stage[data-skin="foto"] .atm-photo-frame img {
  /* Três limites ao mesmo tempo: o tamanho definido no backoffice (máximo), a janela — para os
     comandos «Inserir cartão»/«Recomeçar» não ficarem abaixo do fundo do ecrã — e um mínimo de
     760 px, abaixo do qual o ecrã da máquina deixaria de se ler. */
  max-height: calc(var(--atm-stage-height, 880px) - 6rem);
}
/* A máquina é alta e estreita; a coluna de texto ficava a boiar no meio de muito azul vazio.
   Cresce em largura, tipo e espaçamento para acompanhar a altura do palco. */
.atm-simulator-stage[data-skin="foto"] .atm-simulator-copy {
  display: flex; flex-direction: column; justify-content: center;
  gap: clamp(.75rem, 1.6vh, 1.6rem);
  max-width: 720px; margin: 0; padding: 0;
}
.atm-simulator-stage[data-skin="foto"] .atm-simulator-copy h1 { font-size: clamp(2.2rem, 3.4vw, 3.7rem); }
.atm-simulator-stage[data-skin="foto"] .atm-simulator-copy > p:not(.eyebrow) { max-width: 560px; font-size: 1.08rem; }

/* Máquina pequena (portátil): com o texto no mínimo legível, o menu de 8 opções não cabia.
   Aperta-se o espaçamento e dispensa-se o subtítulo — o título é que orienta o utilizador. */
@container (max-width: 210px) {
  .atm-photo-screen .atm-dom-screen-body { padding: 2.4cqw 3cqw; gap: 1.8cqw; }
  .atm-photo-screen .atm-dom-subtitle { display: none; }
  .atm-photo-screen .atm-dom-option { padding: 1.2cqw 1.6cqw; }
  .atm-photo-screen .atm-dom-options { gap: 1.2cqw 1.4cqw; }
}

/* Ecrã da máquina: nada pode sair da sua caixa. Um rótulo com duas linhas («Consulta de saldos»)
   passava por cima da opção seguinte porque a linha da grelha continuava com a altura de uma
   linha só. Agora as linhas crescem com o conteúdo, o texto é recortado se não couber, e a barra
   de estado encurta com reticências em vez de se sobrepor. */
.atm-photo-screen .atm-dom-screen-body { min-height: 0; overflow: hidden; }
.atm-photo-screen .atm-dom-options { align-content: start; flex: 0 0 auto; }
.atm-photo-screen .atm-dom-option {
  align-items: center; overflow: hidden; line-height: 1.15; text-align: left;
}
.atm-photo-screen .atm-dom-option > span:last-child {
  min-width: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.atm-photo-screen .atm-dom-option-icon { flex: 0 0 auto; }
.atm-photo-screen .atm-dom-screen-head { gap: 2cqw; overflow: hidden; }
.atm-photo-screen .atm-dom-brand,
.atm-photo-screen .atm-dom-live { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.atm-photo-screen .atm-dom-live { flex: 0 0 auto; }
.atm-photo-screen .atm-dom-title { overflow: hidden; text-overflow: ellipsis; }

/* Tablet e telemóvel: a fotografia é alta e estreita e não há largura para a mostrar com um ecrã
   legível — sai, e fica só o ecrã, grande e nítido (é o mesmo simulador; muda só a moldura).
   Em portátil a fotografia MANTÉM-SE: vale mais rolar um pouco do que perder a máquina. */
@media (max-width: 1100px) {
  .atm-simulator-stage[data-skin="foto"] .atm-photo-frame img { display: none; }
  .atm-simulator-stage[data-skin="foto"] .atm-photo-frame { width: 100%; }
  .atm-simulator-stage[data-skin="foto"] .atm-photo-screen {
    /* sem moldura, a altura acompanha o conteúdo (o menu tem oito operações) */
    position: static; left: auto; top: auto; width: min(560px, 100%); height: auto;
    min-height: 300px; margin: 0 auto; border-radius: 14px;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .35), inset 0 0 0 1px rgba(255, 255, 255, .18);
  }
  .atm-simulator-stage[data-skin="foto"] .atm-photo-anim { display: none; }
}

/* Distribuição dentro do ecrã: o teclado ocupava toda a largura (teclas achatadas), o visor era
   um risco fino e o ecrã de boas-vindas deixava o ícone do cartão colado ao texto. */
.atm-photo-screen .atm-dom-screen-body { justify-content: flex-start; }
.atm-photo-screen .atm-dom-keypad-panel { margin-top: auto; }
.atm-photo-screen .atm-dom-keypad { width: min(72cqw, 100%); margin: 0 auto; gap: 1.8cqw; }
.atm-photo-screen .atm-dom-key { padding: 1.4cqw 0; line-height: 1; display: flex; align-items: center; justify-content: center; }
.atm-photo-screen .atm-dom-display { width: min(72cqw, 100%); margin: 0 auto; border-radius: 1.2cqw; }
.atm-photo-screen .atm-dom-standby { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; }
.atm-photo-screen .atm-dom-done, .atm-photo-screen .atm-dom-progress { display: flex; flex-direction: column; align-items: center; gap: 2cqw; }
.atm-photo-screen .atm-dom-progress-bar { width: min(70cqw, 100%); }

/* Comandos sobre a fotografia, na zona das mãos (por baixo do leitor de cartão e do dispensador).
   Antes ficavam por baixo da máquina e, em ecrãs mais baixos, fora da área visível. */
.atm-photo-frame .atm-photo-controls {
  position: absolute; left: 50%; top: 82%; transform: translate(-50%, -50%);
  width: min(86%, 420px); margin: 0; padding: 2.2% 3%;
  border-radius: 12px; background: rgba(6, 21, 46, .82);
  box-shadow: 0 10px 26px rgba(0, 0, 0, .38); backdrop-filter: blur(2px);
  line-height: normal; z-index: 3;
}
.atm-photo-frame .atm-photo-controls .atm-dom-footer { gap: .4rem; }
.atm-photo-frame .atm-photo-controls .atm-dom-note { font-size: .72rem; line-height: 1.3; }
.atm-photo-frame .atm-photo-controls .atm-dom-btn { min-height: 38px; padding: .45rem .9rem; font-size: .82rem; }
@media (max-width: 1100px) {
  /* sem fotografia, os comandos voltam a ficar por baixo do ecrã */
  .atm-photo-frame .atm-photo-controls {
    position: static; transform: none; width: 100%; max-width: 560px; margin: .9rem auto 0;
    background: transparent; box-shadow: none; padding: 0;
  }
}

/* Resumo do que o cliente indicou (entidade, referência, montante), no ecrã de confirmação. */
.atm-dom-summary { display: grid; grid-template-columns: auto 1fr; gap: .2rem .75rem; margin: 0; }
.atm-dom-summary dt { font-weight: 600; opacity: .75; }
.atm-dom-summary dd { margin: 0; font-weight: 700; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.atm-photo-screen .atm-dom-summary { gap: 1cqw 3cqw; font-size: max(9px, 4.2cqw); }
.atm-photo-screen .atm-dom-summary dt, .atm-photo-screen .atm-dom-summary dd { color: #ffffff; }
.atm-dom-shell[data-skin="ecra"] .atm-dom-summary { color: #071b3c; }

/* O visor nunca parte de linha: «222 222 CVE» partia em duas e as linhas sobrepunham-se. */
.atm-dom-display { white-space: nowrap; overflow: hidden; text-overflow: clip; }

/* Dentro do ecrã da máquina o corpo tem altura fixa: sem isto, o flex comprime blocos abaixo do
   seu conteúdo e as linhas do resumo ficam impressas umas por cima das outras. */
.atm-photo-screen .atm-dom-screen-body > * { flex: 0 0 auto; min-height: 0; }
.atm-photo-screen .atm-dom-summary { align-content: start; }
.atm-simulator-stage[data-skin="foto"] .atm-photo-screen .atm-dom-screen-body > * { flex: 0 0 auto; }

/* Teclas físicas ao lado do ecrã: botões transparentes por cima da fotografia. Ficam com um tom
   ténue quando têm opção associada, para se perceber que são clicáveis. */
.atm-photo-key {
  position: absolute; transform: translate(-50%, -50%);
  width: 5.6%; height: 3.4%; min-width: 16px; min-height: 10px;
  padding: 0; border: 0; border-radius: 3px; background: transparent; cursor: default;
}
.atm-photo-key.is-active { background: rgba(105, 199, 223, .22); box-shadow: 0 0 0 1px rgba(105, 199, 223, .55); cursor: pointer; }
.atm-photo-key.is-active:hover, .atm-photo-key.is-active:focus-visible {
  background: rgba(105, 199, 223, .55); box-shadow: 0 0 0 3px rgba(105, 199, 223, .45); outline: none;
}
@media (max-width: 1100px) { .atm-photo-key { display: none; } }

/* Com a fotografia à vista, as opções deixam de parecer botões: passam a RÓTULOS encostados ao
   lado do ecrã, com um apontador para a tecla física correspondente — o cliente carrega na tecla,
   como no equipamento real. Continuam clicáveis (e no telemóvel, sem máquina, voltam a ser
   botões: estas regras só valem acima do limite em que a fotografia aparece). */
@media (min-width: 1101px) {
  .atm-photo-screen .atm-dom-option {
    background: transparent; border: 0; border-radius: 0; padding: .7cqw 0; gap: 1.6cqw; color: #ffffff;
  }
  .atm-photo-screen .atm-dom-option:hover,
  .atm-photo-screen .atm-dom-option:focus-visible { background: transparent; color: #8fe0f5; outline: none; }
  .atm-photo-screen .atm-dom-option-icon { display: none; }
  .atm-photo-screen .atm-dom-option::before {
    content: ""; flex: 0 0 auto; width: 0; height: 0;
    border-top: 1.1cqw solid transparent; border-bottom: 1.1cqw solid transparent;
    border-right: 1.3cqw solid #8fe0f5;
  }
  .atm-photo-screen .atm-dom-option:hover::before { border-right-color: #ffffff; }
  /* coluna da direita: texto encostado à direita e apontador a apontar para a tecla da direita */
  .atm-photo-screen .atm-dom-options > *:nth-child(even) { flex-direction: row-reverse; text-align: right; }
  .atm-photo-screen .atm-dom-options > *:nth-child(even)::before {
    border-right: 0; border-left: 1.3cqw solid #8fe0f5;
  }
  .atm-photo-screen .atm-dom-options > *:nth-child(even):hover::before { border-left-color: #ffffff; }

  /* Ao carregar na tecla física, o rótulo correspondente acende — confirma ao cliente que foi
     aquela tecla que atuou. */
  .atm-photo-screen .atm-dom-option.is-pressed { color: #8fe0f5; }
  .atm-photo-screen .atm-dom-option.is-pressed::before { border-right-color: #ffffff; border-left-color: #ffffff; }

  /* Cada linha à altura da tecla que lhe corresponde (as variáveis vêm do motor, a partir da
     posição das teclas na fotografia; os valores por omissão servem a foto do GRG). */
  .atm-photo-screen .atm-dom-options {
    position: absolute; left: 0; right: 0; padding: 0 3.4cqw;
    top: calc(var(--atm-keys-top, 47%) - var(--atm-keys-step, 16.6%) / 2);
    /* nunca ultrapassa o fundo do ecrã: a 4.ª tecla fica quase à altura do bordo, e um
       rótulo de duas linhas centrado nela ficaria cortado */
    height: min(calc(var(--atm-keys-step, 16.6%) * 4),
                calc(100% - var(--atm-keys-top, 47%) + var(--atm-keys-step, 16.6%) / 2));
    grid-auto-rows: 1fr; align-items: center; gap: 0 1.6cqw;
  }
}

/* Na /ATM o simulador deu lugar à fotografia do terminal com o convite a abri-lo em página
   própria (/ATM/Simulador), onde a máquina aparece em grande. */
/* Sem painel escuro por trás: a fotografia assenta no fundo da própria página. */
.atm-hero-shot { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.2rem; padding: 0; min-height: 0; }
/* o seletor com [data-skin] tem de constar aqui, senão a regra do palco (mais específica)
   voltava a pintar o painel escuro por trás da fotografia */
.atm-hero-shot,
.atm-simulator-stage[data-skin="foto"] .atm-hero-shot { background: none; }
.atm-hero-shot::after { content: none; }
.atm-hero-shot-link { position: relative; display: block; max-width: 100%; text-decoration: none; }
/* É só o convite para abrir o simulador: a máquina em tamanho grande vive na página dele. */
/* Um pouco maior: a fotografia é o convite, e demasiado pequena deixava o herói vazio. */
.atm-hero-shot-link img { display: block; width: auto; max-width: 100%; max-height: min(520px, 48vh); border-radius: 10px; transition: transform .35s; }
.atm-hero-shot-link:hover img { transform: translateY(-4px); }
.atm-hero-shot-cta {
  position: absolute; left: 50%; bottom: -1.2rem; transform: translateX(-50%);
  display: inline-flex; align-items: center; gap: .5rem; white-space: nowrap;
  padding: .7rem 1.4rem; border-radius: 999px; font-weight: 700; font-size: .95rem;
  background: #ffffff; color: #0b2f6b; box-shadow: 0 10px 24px rgba(0, 0, 0, .35);
}
.atm-hero-shot-link:hover .atm-hero-shot-cta { background: #69c7df; color: #071b3c; }
@media (max-width: 1100px) { .atm-hero-shot-link img { max-height: min(320px, 40vh); } }

/* Apresentação da imagem do produto (escolhida em Admin › Produtos).
   «cover» é o comportamento clássico (imagem de fundo a preencher). «lado» e «palco» mostram a
   imagem INTEIRA ao lado do texto — é o que faz falta a cartões e equipamentos, que ficavam
   gigantes e cortados quando esticados para preencher o topo. */
.product-detail-hero[data-imagem="lado"],
.product-detail-hero[data-imagem="palco"] {
  display: grid;
  /* Colunas com largura PRÓPRIA e centradas em conjunto: com «1fr» para o texto, num ecrã
     largo a coluna esticava e a imagem ia parar à margem direita, longe do que descreve. */
  grid-template-columns: minmax(0, 640px) minmax(0, 420px);
  justify-content: center;
  align-items: center;
  column-gap: clamp(1.5rem, 3vw, 3rem);
  padding-inline: clamp(1rem, 4vw, 3rem);
  background:
    var(--bai-dots-light),
    linear-gradient(160deg, var(--bai-blue-900) 0%, #0b224a 100%);
}
.product-detail-hero[data-imagem="lado"] .product-detail-copy,
.product-detail-hero[data-imagem="palco"] .product-detail-copy {
  width: auto;
  max-width: 640px;
  /* a margem e a altura de ecrã inteiro do modo «a preencher» aqui só afastavam as duas metades */
  margin-left: 0;
  min-height: 0;
  padding-block: clamp(2rem, 5vw, 3.5rem);
}

.product-detail-shot {
  position: relative;
  display: grid;
  place-items: center;
  padding: clamp(1rem, 3vw, 2.5rem) clamp(1rem, 3vw, 2rem);
  min-width: 0;
}
.product-detail-shot img {
  position: relative;
  z-index: 1;
  display: block;
  width: auto;
  max-width: 100%;
  max-height: clamp(200px, 30svh, 340px);
  object-fit: contain;
}
/* Palco 3D: mesma linguagem da página POS — halo, sombra projetada e entrada suave. */
.product-detail-hero[data-imagem="palco"] .product-detail-shot img {
  filter: drop-shadow(0 24px 40px rgba(0, 0, 0, .45));
  animation: produtoPalcoEntra .9s cubic-bezier(.22, .61, .36, 1) backwards;
}
.product-detail-glow {
  position: absolute;
  width: 380px; height: 380px; max-width: 85%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(43, 183, 196, .38) 0%, rgba(43, 183, 196, 0) 65%);
  filter: blur(8px);
}
.product-detail-shadow {
  position: absolute;
  bottom: 12%;
  width: 260px; max-width: 60%; height: 22px;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(0, 0, 0, .45) 0%, rgba(0, 0, 0, 0) 70%);
}
@keyframes produtoPalcoEntra {
  from { opacity: 0; transform: translateY(18px) scale(.96); }
  to { opacity: 1; transform: none; }
}
@media (max-width: 860px) {
  .product-detail-hero[data-imagem="lado"],
  .product-detail-hero[data-imagem="palco"] { grid-template-columns: 1fr; }
  .product-detail-shot { order: -1; padding-top: 1.5rem; }
  .product-detail-shot img { max-height: 30svh; }
}
@media (prefers-reduced-motion: reduce) {
  .product-detail-hero[data-imagem="palco"] .product-detail-shot img { animation: none; }
}

/* Listagem de produtos: imagem INTEIRA quando o produto a marca como «ao lado» ou «palco»
   (Admin › Produtos). Com `cover`, as artes dos cartões perdiam a marca VISA e parte do nome,
   sobretudo no destaque, cuja caixa é mais alta do que a arte. */
.catalog-product-media.is-inteira {
  --folga: clamp(.9rem, 2.5vw, 1.8rem);
  background: radial-gradient(circle at 50% 45%, #1d4f86 0%, var(--bai-blue-900) 72%);
}
/* A imagem ocupa a caixa (menos a folga) e o `contain` encaixa a arte lá dentro. Com grelha e
   `max-height: 100%` a percentagem não se resolvia (a linha da grelha é automática): nos cartões
   pequenos a arte ficava com 307 px numa caixa de 263 px e continuava cortada. O `drop-shadow`
   segue a arte e não o retângulo da imagem (as margens do `contain` são transparentes). */
.catalog-product-media.is-inteira img {
  position: absolute;
  top: var(--folga);
  left: var(--folga);
  width: calc(100% - 2 * var(--folga));
  height: calc(100% - 2 * var(--folga));
  object-fit: contain;
  filter: drop-shadow(0 16px 26px rgba(0, 0, 0, .35));
}
.catalog-product:hover .catalog-product-media.is-inteira img { transform: translateY(-4px); }
.catalog-product-media.is-inteira::after { inset: 70% 0 0; }

/* Simulador de crédito por linhas: separadores no topo do cartão (como no exemplo do banco),
   taxa fixa da linha, nota legal e botão «Pedir crédito». */
.loan-sim { overflow: hidden; }
.loan-sim-tabs {
  display: flex;
  margin: calc(-1 * clamp(1.5rem, 3vw, 2.25rem)) calc(-1 * clamp(1.5rem, 3vw, 2.25rem)) 1.5rem;
  border-bottom: 1px solid var(--bai-line);
  background: var(--bai-surface-muted);
}
.loan-sim-tabs button {
  flex: 1 1 0;
  min-width: 0;
  padding: 1rem .6rem;
  border: 0;
  border-right: 1px solid var(--bai-line);
  background: transparent;
  color: var(--bai-muted);
  font-size: .9rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
}
.loan-sim-tabs button:last-child { border-right: 0; }
.loan-sim-tabs button:hover { color: var(--bai-strong); }
.loan-sim-tabs button.is-active { background: var(--bai-surface); color: var(--bai-accent); box-shadow: inset 0 -3px 0 var(--bai-accent); }
.loan-sim-tabs button:focus-visible { outline: 2px solid var(--bai-accent); outline-offset: -2px; }
.loan-sim-rate {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: .9rem 0 .2rem;
  border-top: 1px solid var(--bai-line);
}
.loan-sim-rate span { color: var(--bai-muted); font-size: .85rem; font-weight: 650; }
.loan-sim-rate strong { color: var(--bai-strong); font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.loan-sim-note { margin: .8rem 0 0; color: var(--bai-muted); font-size: .82rem; line-height: 1.5; }
.loan-sim-cta { display: flex; justify-content: center; width: 100%; margin-top: 1.1rem; }
@media (max-width: 480px) {
  .loan-sim-tabs button { font-size: .74rem; padding: .85rem .3rem; letter-spacing: 0; }
}

/* Página /Simuladores */
.simulators-intro { padding-bottom: 0; }
.simulators-intro h1 { margin: .4rem 0 .8rem; font-size: clamp(2.2rem, 5vw, 3.6rem); line-height: 1; font-weight: 800; }
.simulators-lead { max-width: 640px; color: var(--bai-muted); font-size: 1.05rem; }
.simulators-shortcuts { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.4rem; }
.simulators-shortcuts a {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .55rem .95rem;
  border: 1px solid var(--bai-line);
  border-radius: 999px;
  background: var(--bai-surface);
  color: var(--bai-strong);
  font-weight: 650;
  font-size: .9rem;
  text-decoration: none;
}
.simulators-shortcuts a:hover { border-color: var(--bai-accent); color: var(--bai-accent); }

/* Simulador com mais de 4 créditos: lista agrupada (Particulares / Empresas) em vez de separadores. */
.loan-sim-select label { display: block; margin-bottom: .4rem; color: var(--bai-muted); font-size: .85rem; font-weight: 650; }
.loan-sim-select .form-select { font-weight: 700; color: var(--bai-strong); }

/* Pedido de informação: de que produto vem e a alternativa presencial. */
.form-context {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .5rem 1rem;
  padding: .85rem 1rem;
  border: 1px solid var(--bai-line);
  border-left: 4px solid var(--bai-accent);
  border-radius: 10px;
  background: var(--bai-surface-muted);
  font-size: .92rem;
}
.form-context a { font-weight: 700; }
.form-context-alt { color: var(--bai-muted); }

/* Blocos de conteúdo com texto formatado (03/09/2026 em diante o editor grava HTML): o corpo é um
   <div> com parágrafos, listas e IMAGENS. Um bloco sem título ocupa a largura toda. */
.content-blocks article.is-untitled { grid-template-columns: minmax(0, 1fr); }
.content-block-body { color: #3f4f68; font-size: 1.08rem; line-height: 1.75; min-width: 0; }
.content-block-body > :first-child { margin-top: 0; }
.content-block-body > :last-child { margin-bottom: 0; }
.content-block-body p { margin: 0 0 1rem; }
.content-block-body ul, .content-block-body ol { margin: 0 0 1rem; padding-left: 1.25rem; }
.content-block-body h2, .content-block-body h3 { margin: 1.5rem 0 .6rem; font-size: 1.15rem; font-weight: 700; color: var(--bai-strong); }
/* Imagens inseridas no texto (ex.: organograma, quadros): nunca mais largas do que a coluna. */
.content-block-body img { display: block; max-width: 100%; height: auto; margin: 1rem 0; border-radius: 6px; }

/* ===== Parecer GCO 058/2026: contactos, urgências, reclamações, provedor, conversor e publicidade ===== */
.contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1rem; }
.contact-card { display: flex; align-items: center; gap: .9rem; min-width: 0; padding: 1.1rem 1.2rem; border: 1px solid var(--bai-line); border-radius: var(--radius-md, 12px); background: var(--bai-card, #fff); color: var(--bai-ink); text-decoration: none; }
a.contact-card:hover, a.contact-card:focus-visible { border-color: var(--bai-accent); box-shadow: 0 6px 20px rgba(7, 27, 60, .08); }
.contact-card-icon { width: 44px; height: 44px; flex: 0 0 44px; display: grid; place-items: center; border-radius: 50%; background: var(--bai-ice, #eaf3fb); color: var(--bai-accent); font-size: 1.05rem; }
.contact-card small { display: block; color: var(--bai-muted); font-size: .76rem; letter-spacing: .04em; text-transform: uppercase; }
.contact-card strong { display: block; color: var(--bai-strong); font-size: 1.05rem; overflow-wrap: anywhere; }
.contact-note { margin: 1rem 0 0; color: var(--bai-muted); font-size: .9rem; }

.urgent-panel { padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid rgba(196, 43, 43, .28); border-radius: var(--radius-md, 12px); background: linear-gradient(180deg, rgba(196, 43, 43, .07), rgba(196, 43, 43, .02)); }
.urgent-head { display: flex; align-items: flex-start; gap: 1rem; margin-bottom: 1.25rem; }
.urgent-head > i { width: 46px; height: 46px; flex: 0 0 46px; display: grid; place-items: center; border-radius: 50%; background: #c42b2b; color: #fff; font-size: 1.15rem; }
.urgent-head h2 { margin: 0 0 .25rem; color: var(--bai-strong); font-size: clamp(1.3rem, 2.4vw, 1.7rem); }
.urgent-head p { margin: 0; color: var(--bai-ink-soft, var(--bai-ink)); }
.urgent-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.urgent-card { display: flex; flex-direction: column; gap: .5rem; padding: 1.1rem 1.2rem; border: 1px solid var(--bai-line); border-radius: 10px; background: var(--bai-card, #fff); }
.urgent-card h3 { display: flex; align-items: baseline; gap: .5rem; margin: 0; color: var(--bai-strong); font-size: 1.02rem; font-weight: 700; }
.urgent-card h3 i { color: #c42b2b; }
.urgent-card p { margin: 0 0 .25rem; color: var(--bai-ink-soft, var(--bai-ink)); font-size: .93rem; }
.urgent-phone { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .5rem; color: var(--bai-strong); font-size: 1.1rem; font-weight: 700; text-decoration: none; overflow-wrap: anywhere; }
.urgent-phone i { color: var(--bai-accent); font-size: .9rem; }
.urgent-phone small { color: var(--bai-muted); font-size: .78rem; font-weight: 500; }
.urgent-phone:hover, .urgent-phone:focus-visible { color: var(--bai-accent); }
.urgent-tips { display: inline-flex; align-items: center; gap: .45rem; margin-top: 1.1rem; font-weight: 600; }

.complaint-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.25rem; padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid var(--bai-line); border-radius: var(--radius-md, 12px); background: var(--bai-card, #fff); }
.complaint-cta h2 { margin: 0 0 .35rem; color: var(--bai-strong); font-size: clamp(1.3rem, 2.4vw, 1.7rem); }
.complaint-cta p { max-width: 62ch; margin: 0; color: var(--bai-ink-soft, var(--bai-ink)); }
.complaint-cta-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.complaint-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.complaint-steps li { display: flex; gap: .85rem; padding: 1.1rem; border: 1px solid var(--bai-line); border-radius: 10px; background: var(--bai-card, #fff); }
.complaint-step-num { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; border-radius: 50%; background: var(--bai-accent); color: #fff; font-weight: 700; }
.complaint-steps h3 { margin: .2rem 0 .3rem; color: var(--bai-strong); font-size: 1rem; font-weight: 700; }
.complaint-steps p { margin: 0; color: var(--bai-ink-soft, var(--bai-ink)); font-size: .92rem; }

.ombudsman-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 340px); align-items: start; gap: clamp(1.5rem, 4vw, 3rem); }
.ombudsman-block { margin-bottom: 2rem; }
.ombudsman-block h2 { margin: 0 0 .6rem; color: var(--bai-strong); font-size: 1.3rem; }
.ombudsman-contacts { position: sticky; top: 110px; display: flex; flex-direction: column; gap: .6rem; padding: 1.3rem; border: 1px solid var(--bai-line); border-radius: var(--radius-md, 12px); background: var(--bai-card, #fff); }
.ombudsman-contacts h2 { margin: 0 0 .25rem; color: var(--bai-strong); font-size: 1.1rem; }
.ombudsman-name { margin: 0; color: var(--bai-strong); font-weight: 700; }
.ombudsman-line { display: flex; gap: .5rem; margin: 0; color: var(--bai-ink-soft, var(--bai-ink)); }
.ombudsman-line i { margin-top: .3rem; color: var(--bai-accent); }
@media (max-width: 860px) { .ombudsman-layout { grid-template-columns: 1fr; } .ombudsman-contacts { position: static; } }

.fx-converter { padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid var(--bai-line); border-radius: var(--radius-md, 12px); background: var(--bai-card, #fff); box-shadow: 0 10px 30px rgba(7, 27, 60, .06); }
.fx-converter-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.1rem; }
.fx-converter-head h2 { margin: 0; }
.fx-mode { display: inline-flex; padding: 3px; border: 1px solid var(--bai-line); border-radius: 999px; }
.fx-mode label { position: relative; cursor: pointer; }
.fx-mode input { position: absolute; opacity: 0; pointer-events: none; }
.fx-mode span { display: block; padding: .35rem .9rem; border-radius: 999px; color: var(--bai-muted); font-size: .88rem; font-weight: 600; }
.fx-mode input:checked + span { background: var(--bai-accent); color: #fff; }
.fx-mode input:focus-visible + span { outline: 2px solid var(--bai-aqua); outline-offset: 2px; }
.fx-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr) auto minmax(0, 1.3fr); align-items: end; gap: .75rem; }
.fx-field label { display: block; margin-bottom: .3rem; color: var(--bai-muted); font-size: .8rem; font-weight: 600; }
.fx-field .form-control, .fx-field .form-select { min-height: 48px; font-size: 1.05rem; }
.fx-swap { width: 48px; height: 48px; border: 1px solid var(--bai-line); border-radius: 50%; background: var(--bai-surface-muted, #f3f6fa); color: var(--bai-accent); }
.fx-swap:hover, .fx-swap:focus-visible { background: var(--bai-accent); color: #fff; }
.fx-result { display: flex; flex-direction: column; gap: .25rem; margin-top: 1.25rem; }
.fx-result strong { color: var(--bai-strong); font-size: clamp(1.6rem, 4vw, 2.3rem); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.fx-result span { color: var(--bai-muted); font-size: .9rem; }
.fx-note { display: flex; gap: .5rem; margin: 1rem 0 0; color: var(--bai-muted); font-size: .85rem; }
.fx-note i { margin-top: .2rem; }
@media (max-width: 720px) {
  .fx-grid { grid-template-columns: minmax(0, 1fr) auto; }
  .fx-grid .fx-field:first-child, .fx-grid .fx-field:last-child { grid-column: 1 / -1; }
}

/* Publicidade identificada (campanha em destaque e janela promocional) */
.ad-label { display: inline-flex; align-items: center; gap: .35rem; margin-bottom: .7rem; padding: .18rem .6rem; border: 1px solid currentColor; border-radius: 999px; font-size: .7rem; font-weight: 700; letter-spacing: .08em; line-height: 1.4; text-transform: uppercase; opacity: .92; }
.campaign-modal-copy .ad-label { color: var(--bai-muted); }

/* Tabelas de conteúdo (Admin › Tabelas, código [tabela:slug] no corpo das páginas).
   A mesma folha é acrescentada ao site.css do site público. Em ecrãs estreitos cada linha
   passa a cartão, com o título da coluna ao lado de cada valor. */
.data-table { margin: 1.5rem 0; border: 1px solid var(--bai-line, #d9e1ef); border-radius: 14px; overflow: hidden; background: var(--bai-card, #fff); }
.data-table-title { display: flex; align-items: center; gap: .6rem; margin: 0; padding: .9rem 1.2rem; background: linear-gradient(120deg, #071b3c 0%, #0b2a5b 55%, #223f7f 100%); color: #fff; font-size: 1.02rem; font-weight: 700; letter-spacing: -.01em; }
.data-table-title::before { content: ""; width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: #69c7df; }
.data-table-scroll { overflow-x: auto; }
.data-table table { width: 100%; margin: 0; border-collapse: collapse; font-size: .95rem; }
.data-table th { padding: .65rem 1.2rem; border-bottom: 1px solid var(--bai-line, #d9e1ef); background: #eef4fc; color: #0b2a5b; font-size: .72rem; font-weight: 700; letter-spacing: .07em; text-align: left; text-transform: uppercase; white-space: nowrap; }
.data-table td { padding: .75rem 1.2rem; border-bottom: 1px solid #e8edf6; color: #3f4f68; line-height: 1.45; vertical-align: middle; }
.data-table tbody tr:last-child td { border-bottom: 0; }
.data-table tbody tr:nth-child(even) td { background: #fafcff; }
.data-table tbody tr.is-highlight td { background: #eaf7fb; }
.data-table tbody tr.is-highlight td:first-child { box-shadow: inset 4px 0 0 #2687a5; }
.data-table td.dt-col-strong { color: #0b2a5b; }
.data-table td.dt-col-strong strong { font-weight: 650; }
.data-table td.dt-col-check, .data-table th.dt-col-check { text-align: center; }
.data-table td.dt-col-url { white-space: nowrap; }
.data-table td.dt-col-url a { display: inline-flex; align-items: center; gap: .35rem; color: var(--bai-accent, #223f7f); font-weight: 600; text-decoration: none; }
.data-table td.dt-col-url a:hover, .data-table td.dt-col-url a:focus-visible { text-decoration: underline; }
.data-table td.dt-col-url a i { font-size: .72em; opacity: .7; }
.dt-badge { display: inline-block; margin: .1rem .3rem .1rem 0; padding: .16rem .6rem; border-radius: 999px; background: #dceaff; color: #1b346d; font-size: .75rem; font-weight: 700; letter-spacing: .03em; white-space: nowrap; }
.dt-badge.is-highlight, .data-table tr.is-highlight .dt-badge { background: #2687a5; color: #fff; }
.dt-check { color: #2687a5; font-size: 1.05rem; font-weight: 800; }
.dt-dash { color: #b6c1d3; }
.data-table .data-table-note { margin: 0; padding: .6rem 1.2rem .8rem; border-top: 1px solid #e8edf6; color: var(--bai-muted, #61708a); font-size: .82rem; }
.content-block-body .data-table { max-width: 100%; }
.data-table .dt-val { min-width: 0; }
.data-table .dt-val > :first-child { margin-top: 0; }
.data-table .dt-val > :last-child { margin-bottom: 0; }

@media (max-width: 700px) {
  .data-table thead { display: none; }
  .data-table table, .data-table tbody, .data-table tr, .data-table td { display: block; width: 100%; box-sizing: border-box; }
  .data-table tbody tr { padding: .55rem 0; border-bottom: 1px solid var(--bai-line, #d9e1ef); }
  .data-table tbody tr:last-child { border-bottom: 0; }
  .data-table tbody tr:nth-child(even) { background: #fafcff; }
  .data-table tbody tr.is-highlight { background: #eaf7fb; box-shadow: inset 4px 0 0 #2687a5; }
  .data-table tbody tr td, .data-table tbody tr:nth-child(even) td, .data-table tbody tr.is-highlight td { display: grid; grid-template-columns: minmax(84px, 36%) minmax(0, 1fr); gap: .6rem; padding: .28rem 1rem; border: 0; background: transparent; box-shadow: none; text-align: left; white-space: normal; }
  .data-table .dt-val { overflow-wrap: anywhere; }
  .data-table td::before { content: attr(data-label); padding-top: .15rem; color: #61708a; font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
}