/* ====== Bloco introdutório (hero + seções iniciais) ====== */
.sobre-landing{
  position:relative;
  display:grid;
  gap:clamp(3rem, 6vw, 5rem);
  padding-block:clamp(3rem, 9vw, 6rem);
  --sobre-landing-heading-block-padding: clamp(1.35rem, 4vw, 2.4rem);
  --sobre-landing-ink: color-mix(in srgb, var(--color-primary-900, #111a4b) 88%, var(--bs-body-color, #111827) 12%);
  --sobre-landing-muted: color-mix(in srgb, var(--bs-body-color, #111827) 65%, var(--color-primary-500, #3b4bc4) 35%);
  /* Highlight gradient: azul‑cinza leve -> azul institucional */
  --sobre-landing-highlight-start: var(--color-primary-100, #E1E4F5);
  --sobre-landing-highlight-end: var(--color-primary-600, #21286C);
  /* Mantém o fim do degradê consistente com o azul da paleta */
  --sobre-landing-highlight-accent: color-mix(in srgb, var(--sobre-landing-highlight-end) 85%, var(--color-primary-400, #5463d4) 15%);
  --sobre-landing-glow: rgba(var(--bs-primary-rgb, 33,40,108), .14);
  --sobre-landing-surface: color-mix(in srgb, var(--color-primary-50, #f3f5fb) 82%, var(--color-neutral-0, #ffffff) 18%);
  --sobre-landing-surface-alt: color-mix(in srgb, var(--color-primary-100, #e0e7ff) 72%, var(--color-neutral-0, #ffffff) 28%);
  --sobre-landing-border: color-mix(in srgb, rgba(var(--bs-primary-rgb, 33,40,108), .25) 68%, rgba(255,255,255,.55) 32%);
  --sobre-landing-shadow: 0 18px 32px -18px rgba(17, 24, 39, .22);
  --sobre-landing-max-width: min(1120px, 100%);
  --sobre-landing-icon: color-mix(in srgb, var(--color-primary-500, #3b4bc4) 62%, var(--color-primary-300, #8c99ff) 38%);
  --sobre-landing-neo: color-mix(in srgb, var(--color-primary-50, #f3f5fb) 78%, var(--color-neutral-0, #ffffff) 22%);
  --sobre-landing-neo-alt: color-mix(in srgb, var(--color-primary-100, #e0e7ff) 66%, var(--color-neutral-0, #ffffff) 34%);
  --sobre-landing-neo-border: rgba(var(--bs-primary-rgb, 33,40,108), .18);
  --sobre-landing-neo-shadow: 12px 12px 28px rgba(31,38,135,.12), -12px -12px 24px rgba(255,255,255,.9);
  --sobre-landing-neo-shadow-hover: 14px 14px 32px rgba(31,38,135,.14), -10px -10px 20px rgba(255,255,255,.85);
  --sobre-landing-list-headline-icon-offset: clamp(0.35rem, 1.1vw, 0.48rem);
  /* O fundo do sobre-landing deve seguir o mesmo do wpc-article
     (neumórfico do shell). Usamos inherit para não sobrepor. */
  background: inherit;
  color:var(--sobre-landing-ink);
}

/* ====== Sobre: wpc-article deve ocupar toda a largura ====== */
#win-contact[data-page="sobre"] #win-pp .wpc-grid{
  grid-template-columns: 1fr !important;
  gap: clamp(1rem, 2.5vw, 1.5rem);
  padding: 0 !important;
}

#win-contact[data-page="sobre"] #win-pp .wpc-article{
  grid-column: 1 / -1;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  justify-self: stretch;
  /* Faz o conteúdo ficar DENTRO do artigo (sem sobrepor o shell) */
  padding: var(--sobre-article-padding, clamp(0.7rem, 2.4vw, 0.7rem));
  border-radius: var(--site-shell-radius, 20px);
  overflow: hidden; /* impede fundos internos de vazarem o raio */
  background: inherit; /* usa o mesmo fundo do variante neo */
  position: relative;
  isolation: isolate; /* garante camada própria para a sombra */
  box-shadow: none; /* sombra renderizada pelo pseudo-elemento */
}

#win-contact[data-page="sobre"] #win-pp .wpc-article::after{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 1;
  box-shadow:
    inset 4px 4px 8px var(--pp-shadow-dark, rgba(184,191,203,1)),
    inset -4px -4px 8px var(--pp-shadow-light, rgba(255,255,255,1));
}

/* Alinhamento: sobre-landing segue a mesma largura do wpc-article
   e evita padding duplo, mantendo o conteúdo exatamente alinhado
   às bordas internas do card (wpc-contact-card). */
#win-contact[data-page="sobre"] .sobre-landing .wpc-container{
  padding-inline: clamp(1.25rem, 4vw, 2rem);
  max-width: var(--sobre-landing-max-width);
  margin-inline:auto;
}

.sobre-landing__hero{
  position:relative;
}

.sobre-landing__hero-shell{
  position:relative;
  z-index:1;
  max-width:min(1120px, 100%);
  margin-inline:auto;
  display:grid;
  justify-items:center;
  text-align:center;
  gap:clamp(1.75rem, 4vw, 2.75rem);
}

.sobre-landing__title{
  margin:0;
  font-size:clamp(2.6rem, 5vw, 3.5rem);
  font-weight:800;
  letter-spacing:-.01em;
  color:var(--sobre-landing-ink);
}

.sobre-landing__title-highlight{
  background:linear-gradient(90deg, var(--sobre-landing-highlight-start), var(--sobre-landing-highlight-end), var(--sobre-landing-highlight-accent));
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

/* Mobile: centraliza o destaque e evita hifenização/quebra dentro das palavras */
@media (max-width: 767.98px){
  .sobre-landing__title-highlight{
    display:inline-block;            /* garante alinhamento e cálculo consistente do gradiente */
    text-align:center;               /* redundante, mas protege o escopo do span */
    hyphens:none;                    /* desativa hifenização automática */
    -webkit-hyphens:none;
    -ms-hyphens:none;
    word-break:normal;               /* não quebra dentro da palavra */
    overflow-wrap:normal;            /* quebra apenas entre palavras */
  }
}

.sobre-landing__lead{
  margin:0;
  max-width:60ch;
  color:var(--sobre-landing-muted);
  font-size:clamp(1.05rem, 2.4vw, 1.2rem);
  line-height:1.6;
}

.sobre-landing__badges{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:0.75rem;
}

.sobre-landing__badge{
  display:inline-flex;
  align-items:center;
  gap:0.5rem;
  padding:0.5rem 0.9rem;
  border-radius:999px;
  background:color-mix(in srgb, var(--sobre-landing-neo-alt) 92%, transparent 8%);
  border:1px solid color-mix(in srgb, var(--sobre-landing-border) 70%, transparent 30%);
  font-size:0.9rem;
  color:color-mix(in srgb, var(--sobre-landing-muted) 80%, var(--sobre-landing-ink) 20%);
}

.sobre-landing__badge-icon{
  display:grid;
  place-items:center;
  width:1.35rem;
  height:1.35rem;
  color:var(--sobre-landing-icon);
}

.sobre-landing__metrics{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:clamp(1rem, 2.5vw, 1.5rem);
  width:100%;
}

.sobre-landing__metric-card{
  display:grid;
  gap:0.45rem;
  padding:clamp(1rem, 2.4vw, 1.35rem);
  border-radius:max(18px, var(--site-shell-radius, 20px));
  background:linear-gradient(160deg,
    color-mix(in srgb, var(--sobre-landing-neo) 90%, transparent 10%),
    color-mix(in srgb, var(--sobre-landing-neo-alt) 82%, transparent 18%)
  );
  border:1px solid color-mix(in srgb, var(--sobre-landing-border) 75%, transparent 25%);
  box-shadow:var(--sobre-landing-neo-shadow);
  backdrop-filter:saturate(160%) blur(14px);
}

.sobre-landing__metric-label{
  font-size:0.85rem;
  text-transform:uppercase;
  letter-spacing:0.08em;
  color:color-mix(in srgb, var(--sobre-landing-ink) 68%, var(--sobre-landing-muted) 32%);
}

.sobre-landing__metric-value{
  font-size:clamp(2rem, 4.5vw, 2.6rem);
  font-weight:800;
  color:var(--sobre-landing-ink);
}

.sobre-landing__metric-caption{
  margin:0;
  font-size:0.85rem;
  color:color-mix(in srgb, var(--sobre-landing-muted) 85%, rgba(var(--bs-primary-rgb, 33,40,108),.28) 15%);
}

.sobre-landing__section{ position:relative; }

.sobre-landing__section-card{
  position:relative;
  isolation:isolate;
  display:grid;
  gap:clamp(1.75rem, 4vw, 2.6rem);
  padding:clamp(1.5rem, 4vw, 2.4rem);
  margin-inline:auto;
  width:100%;
  max-width:var(--sobre-landing-max-width);
  background:linear-gradient(160deg,
    color-mix(in srgb, var(--sobre-landing-surface) 88%, transparent 12%),
    color-mix(in srgb, var(--sobre-landing-surface-alt) 82%, transparent 18%)
  );
  border-radius:max(24px, var(--site-shell-radius, 20px));
  border:1px solid color-mix(in srgb, var(--sobre-landing-border) 80%, transparent 20%);
  box-shadow:0 24px 48px -24px color-mix(in srgb, var(--sobre-landing-ink) 32%, rgba(15,23,42,.25) 68%);
}

.sobre-landing__section-header{
  display:grid;
  gap:0.75rem;
  justify-items:center;
  text-align:center;
}

.sobre-landing__section-header--left{
  justify-items:flex-start;
  text-align:left;
}

.sobre-landing__section-header h2{
  margin:0;
  font-weight:700;
  font-size:clamp(1.8rem, 3.6vw, 2.4rem);
  color:var(--sobre-landing-ink);
}

#sobre-landing-s4-pillars-title{
  padding-block:var(--sobre-landing-heading-block-padding);
}

.sobre-landing__section-header p{
  margin:0;
  max-width:62ch;
  color:var(--sobre-landing-muted);
  font-size:clamp(1rem, 2.4vw, 1.1rem);
  line-height:1.65;
}

/* Centraliza headings diretos dentro do card da seção
   (ex.: "Nossos Pilares" que não está dentro de .sobre-landing__section-header) */
.sobre-landing__section-card > h2{
  text-align:center;
  margin-inline:auto;
  max-width:42ch;
}

.sobre-landing__split{
  display:grid;
  gap:clamp(1.75rem, 4vw, 3rem);
  align-items:center;
}

.sobre-landing__split--reverse{
  direction:rtl;
}

.sobre-landing__split--reverse > *{
  direction:ltr;
}

.sobre-landing__split-content{
  display:grid;
  gap:clamp(1.2rem, 3vw, 1.8rem);
}

.sobre-landing__split-content h3{
  margin:0;
  font-size:clamp(1.5rem, 3vw, 1.9rem);
  font-weight:700;
  color:var(--sobre-landing-ink);
}

.sobre-landing__split-content p{
  margin:0;
  color:var(--sobre-landing-muted);
  line-height:1.7;
}

.sobre-landing__split-media{
  position:relative;
  display:grid;
  place-items:center;
  border-radius:max(22px, var(--site-shell-radius, 20px));
  overflow:hidden;
  box-shadow:0 24px 44px -22px rgba(15,23,42,.35);
  aspect-ratio:var(--sobre-landing-split-media-ratio, 16 / 11);
  isolation:isolate;
  background:color-mix(in srgb, var(--sobre-landing-neo) 92%, transparent 8%);
}

@supports not (aspect-ratio: 1 / 1){
  .sobre-landing__split-media{
    min-height:clamp(220px, 34vw, 360px);
  }
}

.sobre-landing__split-media picture,
.sobre-landing__split-media img{
  grid-area:1/1;
}

.sobre-landing__split-media picture{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  display:flex;
}

.sobre-landing__split-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:var(--sobre-landing-object-fit, cover);
  object-position:center;
  transition:object-fit .35s ease;
}

.sobre-landing__split-media::before{
  content:"";
  position:absolute;
  inset:-15%;
  background-image:var(--sobre-landing-split-image);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  filter:blur(var(--sobre-landing-split-media-blur, 34px));
  opacity:0;
  transform:scale(1.12);
  transition:opacity .35s ease;
  z-index:0;
}

.sobre-landing__split-media[data-sobre-media-ready]::before{
  opacity:var(--sobre-landing-split-media-blur-opacity, 0);
}

.sobre-landing__split-media[data-sobre-media-mode="contain"]{
  --sobre-landing-object-fit:contain;
  --sobre-landing-split-media-blur-opacity:1;
}

.sobre-landing__list{
  display:grid;
  gap:0.85rem;
  padding:0;
  margin:0;
  list-style:none;
}

/* Neumorfismo para itens de lista (mantém icon + texto) */
.sobre-landing__list-item{
  display:flex;
  align-items:center;
  gap:0.65rem;
  font-size:0.98rem;
  color:var(--sobre-landing-muted);
  padding: .75rem 1rem;
  border-radius: clamp(14px, 3vw, 18px);
  background: linear-gradient(145deg,
    color-mix(in srgb, var(--sobre-landing-neo) 90%, transparent 10%),
    color-mix(in srgb, var(--sobre-landing-neo-alt) 82%, transparent 18%)
  );
  border: 1px solid color-mix(in srgb, var(--sobre-landing-border) 68%, transparent 32%);
  box-shadow: var(--sobre-landing-neo-shadow);
}

.sobre-landing__list-item--headline{
  align-items:flex-start;
}

.sobre-landing__list-item--headline>div{
  display:grid;
  gap:0.35rem;
}

.sobre-landing__list-item--headline .sobre-landing__list-icon{

  margin-top:var(--sobre-landing-list-headline-icon-offset);

}

.sobre-landing__list-icon{
  display:grid;
  place-items:center;
  width:1.5rem;
  height:1.5rem;
  border-radius:999px;
  background: color-mix(in srgb, var(--sobre-landing-neo-alt) 86%, transparent 14%);
  color:var(--sobre-landing-icon);
  flex-shrink:0;
  border: 1px solid color-mix(in srgb, var(--sobre-landing-border) 60%, transparent 40%);
  box-shadow: inset 2px 2px 4px rgba(31,38,135,.08), inset -2px -2px 4px rgba(255,255,255,.85);
}

.sobre-landing__pillars{
  display:grid;
  gap:clamp(1.5rem, 4vw, 2.5rem);
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
}

.sobre-landing__pillar-card{
  display:grid;
  gap:1.1rem;
  padding:clamp(1.45rem, 3.6vw, 2rem);
  border-radius:max(22px, var(--site-shell-radius, 20px));
  background:linear-gradient(145deg,
    color-mix(in srgb, var(--sobre-landing-neo) 92%, transparent 8%),
    color-mix(in srgb, var(--sobre-landing-neo-alt) 82%, transparent 18%)
  );
  border:1px solid color-mix(in srgb, var(--sobre-landing-border) 72%, transparent 28%);
  box-shadow:var(--sobre-landing-neo-shadow);
  transition:transform .3s ease, box-shadow .3s ease;
}

.sobre-landing__pillar-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--sobre-landing-neo-shadow-hover);
}

.sobre-landing__pillar-header{
  display:flex;
  gap:1rem;
  align-items:center;
}

.sobre-landing__pillar-icon{
  display:grid;
  place-items:center;
  width:3.5rem;
  height:3.5rem;
  border-radius:1.25rem;
  background:linear-gradient(140deg,
    color-mix(in srgb, var(--sobre-landing-neo-alt) 88%, transparent 12%),
    color-mix(in srgb, rgba(var(--bs-primary-rgb, 33,40,108), .12) 60%, transparent 40%)
  );
  color:color-mix(in srgb, var(--sobre-landing-icon) 70%, var(--color-primary-600, #21286c) 30%);
}

.sobre-landing__pillar-header h3{
  margin:0;
  font-size:clamp(1.35rem, 2.8vw, 1.6rem);
  font-weight:700;
  color:var(--color-primary-900);
}

.sobre-landing__pillar-card p{
  margin:0;
  color:var(--sobre-landing-muted);
  line-height:1.7;
}

.sobre-landing__pillar-highlights{
  display:grid;
  gap:1rem;
  margin:0;
}

.sobre-landing__pillar-highlights div{
  padding:0.85rem;
  border-radius:1rem;
  background:color-mix(in srgb, var(--sobre-landing-neo-alt) 86%, transparent 14%);
}

.sobre-landing__pillar-highlights dt{
  margin:0;
  font-weight:600;
  color:color-mix(in srgb, var(--sobre-landing-ink) 78%, rgba(var(--bs-primary-rgb, 33,40,108),.35) 22%);
}

.sobre-landing__pillar-highlights dd{
  margin:0.25rem 0 0;
  color:var(--sobre-landing-muted);
  font-size:0.92rem;
}

.sobre-landing__journey-list{
  /* Herda a mesma geometria da timeline */
  position:relative;
  list-style:none;
  margin:0;
  padding-left:1rem;
  display:grid;
  gap:1.6rem;
}

.sobre-landing__journey-list::before{
  content:"";
  position:absolute;
  inset-block:0.5rem;
  left:0.5rem;
  width:2px;
  background:linear-gradient(180deg,
    color-mix(in srgb, var(--sobre-landing-icon) 40%, transparent 60%),
    color-mix(in srgb, var(--sobre-landing-border) 35%, transparent 65%)
  );
}

/* Journey: aplica superfície neumórfica mantendo eixo/dot da linha */
.sobre-landing__journey-item{
  position:relative;
  padding: 1rem 1rem 1rem 1.75rem; /* respeita o espaço do eixo à esquerda */
  display:grid;
  gap:0.35rem;
  border-radius: clamp(14px, 3vw, 18px);
  background: linear-gradient(145deg,
    color-mix(in srgb, var(--sobre-landing-neo) 92%, transparent 8%),
    color-mix(in srgb, var(--sobre-landing-neo-alt) 86%, transparent 14%)
  );
  border: 1px solid color-mix(in srgb, var(--sobre-landing-border) 70%, transparent 30%);
  box-shadow: var(--sobre-landing-neo-shadow);
}

/* Dot idêntico ao da timeline */
.sobre-landing__journey-item::before{
  content:"";
  position:absolute;
  left:0;
  top:0.35rem;
  width:0.8rem;
  height:0.8rem;
  border-radius:999px;
  background:var(--sobre-landing-icon);
  box-shadow:0 0 0 4px color-mix(in srgb, var(--sobre-landing-icon) 28%, transparent 72%);
}

.sobre-landing__journey-item:focus-visible{
  outline:2px solid rgba(var(--bs-primary-rgb, 33,40,108),.4);
  outline-offset:4px;
}

/* Interação suave sem remover a superfície */
.sobre-landing__journey-item[data-sobre-active="true"],
.sobre-landing__journey-item:hover{
  box-shadow: var(--sobre-landing-neo-shadow-hover);
  transform: none;
}

.sobre-landing__journey-icon{ display:none; }

/* Ícone desativado; mantém consistência com timeline */

.sobre-landing__journey-icon svg{
  width:1.45rem;
  height:1.45rem;
}

.sobre-landing__journey-content h3{
  margin:0;
  font-size:clamp(1.05rem, 3vw, 1.25rem);
  font-weight:600;
  color:var(--sobre-landing-ink);
}

.sobre-landing__journey-content p{
  margin:0.35rem 0 0;
  color:var(--sobre-landing-muted);
  line-height:1.65;
}

@media (prefers-reduced-motion: reduce){
  .sobre-landing__journey-item{
    transition:none;
  }

  .sobre-landing__journey-icon{
    transition:none;
  }
}

.sobre-landing__timeline{
  position:relative;
  display:grid;
  gap:1.6rem;
  /* Eixo/offset configuráveis para alinhar linha e dot */
  --timeline-dot-size: 0.8rem;          /* deve acompanhar .sobre-landing__timeline-dot */
  --timeline-padding-left: 1rem;         /* recuo do container */
  /* centro do eixo = padding esquerdo + metade do diâmetro do dot */
  --timeline-axis-x: calc(var(--timeline-padding-left) + (var(--timeline-dot-size) / 2));
  padding-left: var(--timeline-padding-left);
  margin:0;
  list-style:none;
}

.sobre-landing__timeline::before{
  content:"";
  position:absolute;
  inset-block:0.5rem;
  /* Alinha a linha vertical ao centro do dot */
  left: var(--timeline-axis-x);
  width:2px;
  background:linear-gradient(180deg,
    color-mix(in srgb, var(--sobre-landing-icon) 40%, transparent 60%),
    color-mix(in srgb, var(--sobre-landing-border) 35%, transparent 65%)
  );
}

.sobre-landing__timeline-item{
  position:relative;
  /* Mantém o texto no mesmo alinhamento visual de antes
     (padding = recuo do container + diâmetro do dot + espaço após o dot) */
  padding-left: calc(var(--timeline-padding-left) + var(--timeline-dot-size) + 0.95rem);
  display:grid;
  gap:0.35rem;
}

.sobre-landing__timeline-dot{
  position:absolute;
  left:0;
  top:0.35rem;
  width:0.8rem;
  height:0.8rem;
  border-radius:999px;
  background:var(--sobre-landing-icon);
  box-shadow:0 0 0 4px color-mix(in srgb, var(--sobre-landing-icon) 28%, transparent 72%);
}

.sobre-landing__timeline-item h3{
  margin:0;
  font-size:1.1rem;
  font-weight:600;
  color:var(--sobre-landing-ink);
}

.sobre-landing__timeline-item p{
  margin:0;
  color:var(--sobre-landing-muted);
  line-height:1.6;
}

.sobre-landing__values{
  display:grid;
  gap:clamp(1.1rem, 3.2vw, 1.75rem);
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
}

.sobre-landing__value-card{
  padding:clamp(1.25rem, 3.6vw, 1.75rem);
  border-radius:max(20px, var(--site-shell-radius, 20px));
  background:linear-gradient(150deg,
    color-mix(in srgb, var(--sobre-landing-neo) 92%, transparent 8%),
    color-mix(in srgb, var(--sobre-landing-neo-alt) 84%, transparent 16%)
  );
  border:1px solid color-mix(in srgb, var(--sobre-landing-border) 70%, transparent 30%);
  text-align:center;
  display:grid;
  gap:0.75rem;
  box-shadow:var(--sobre-landing-neo-shadow);
}

.sobre-landing__value-card h3{
  margin:0;
  font-size:1.4rem;
  font-weight:700;
  color:color-mix(in srgb, var(--sobre-landing-ink) 85%, rgba(var(--bs-primary-rgb, 33,40,108),.25) 15%);
}

.sobre-landing__value-card p{
  margin:0;
  color:var(--sobre-landing-muted);
  line-height:1.6;
}

.sobre-landing__value-grid{
  display:grid;
  gap:clamp(1.1rem, 2.8vw, 1.6rem);
  grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
}

.sobre-landing__value-item{
  padding:clamp(1.1rem, 3vw, 1.45rem);
  border-radius:max(18px, var(--site-shell-radius, 20px));
  background:color-mix(in srgb, var(--sobre-landing-neo-alt) 88%, transparent 12%);
  border:1px solid color-mix(in srgb, var(--sobre-landing-border) 62%, transparent 38%);
  text-align:center;
  display:grid;
  gap:0.55rem;
}

.sobre-landing__value-icon{
  width:3rem;
  height:3rem;
  border-radius:50%;
  display:grid;
  place-items:center;
  margin-inline:auto;
  background:color-mix(in srgb, var(--sobre-landing-neo-alt) 80%, transparent 20%);
  color:color-mix(in srgb, var(--sobre-landing-icon) 45%, var(--sobre-landing-ink) 55%);
  /* Evita corte do traço do SVG encostando no limite do círculo */
  padding: clamp(3px, 1vw, 6px);
  box-sizing: border-box;
}

.sobre-landing__value-icon svg{
  width: 100%;
  height: 100%;
  display: block;      /* remove baseline extra e evita crop por linha */
  overflow: visible;   /* garante que strokes arredondados não sejam cortados */
}

.sobre-landing__value-item h4{
  margin:0;
  font-size:1.1rem;
  font-weight:600;
  color:var(--sobre-landing-ink);
}

.sobre-landing__value-item p{
  margin:0;
  color:var(--sobre-landing-muted);
  font-size:0.95rem;
  line-height:1.55;
}

.section-fade-in{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .6s ease, transform .6s ease;
}

.section-fade-in.visible{
  opacity:1;
  transform:translateY(0);
}

@media (prefers-reduced-motion: reduce){
  .section-fade-in{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
}

/* ====== Responsividade específica do Sobre (mobile-first) ====== */
@media (max-width: 767.98px){
  /* Shell compacto como no blog detail */
  #win-contact[data-page="sobre"]{
    --sobre-shell-gap: clamp(8px, 2.8vw, 16px);
    --sobre-shell-block-gap: clamp(12px, 4vw, 22px);
    --wpc-shell-gap: var(--sobre-shell-gap);
  }

  #win-contact[data-page="sobre"] #win-pp .wpc-container{
    --wpc-container-inline-padding: var(--sobre-shell-gap);
  }

  /* Card externo ocupa toda a largura interna, como no blog detail,
     mas preserva respiro vertical para manter o acabamento neo */
  #win-contact[data-page="sobre"] .wpc-contact-card{
    padding-inline: 0 !important;
    padding-block: var(--sobre-shell-block-gap) !important;
    border-radius: clamp(12px, 5vw, 16px); /* não depende do header/footer */
  }

  /* Conteúdo interno encosta mais nas bordas do artigo */
  #win-contact[data-page="sobre"] #win-pp .wpc-article{
    --sobre-article-padding: clamp(0.65rem, 2.8vw, 0.95rem);
  }

  /* Itens internos: remover bordas e superfícies para ficar “flat” no mobile */
  .sobre-landing__section-card,
  .sobre-landing__metric-card,
  .sobre-landing__pillar-card,
  .sobre-landing__value-card,
  .sobre-landing__value-item,
  .sobre-landing__list-item,
  .sobre-landing__journey-item{
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  /* Paddings no mobile: zerado conforme solicitação */
  .sobre-landing__section-card{ padding: 0 !important; }
  .sobre-landing__metric-card{ padding: clamp(0.7rem, 2.8vw, 0.95rem) !important; }
  .sobre-landing__pillar-card{ padding: clamp(0.9rem, 3vw, 1.1rem) !important; }
  .sobre-landing__value-card{ padding: clamp(0.9rem, 3vw, 1.1rem) !important; }
  .sobre-landing__value-item{ padding: clamp(0.75rem, 2.8vw, 0.95rem) !important; }
  .sobre-landing__list-item{ padding: clamp(0.5rem, 2.6vw, 0.85rem) 0 !important; }
  .sobre-landing__journey-item{ padding: clamp(0.6rem, 2.6vw, 0.9rem) 0 0 clamp(1.2rem, 3vw, 1.6rem) !important; }
}

@media (max-width: 575.98px){
  /* Ainda mais compacto nas telas mais estreitas */
  #win-contact[data-page="sobre"] #win-pp .wpc-article{
    --sobre-article-padding: clamp(0.55rem, 2.5vw, 0.85rem);
  }
}

@media (min-width: 960px){
  .sobre-landing__split{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .sobre-landing__split-media{
    min-height:100%;
  }
}

@media (max-width: 719px){
  .sobre-landing__badges{
    justify-content:flex-start;
  }

  .sobre-landing__hero-shell{
    justify-items:flex-start;
    text-align:left;
  }

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

/* ====== Página Sobre (neumorfismo institucional) ====== */
/* Cartão principal com tokens dedicados para manter consistência com o tema */
.sobre-timeline-card{
  position:relative;
  isolation:isolate;
  display:grid;
  gap:clamp(1.6rem, 4vw, 2.4rem);
  padding:clamp(1.5rem, 4vw, 2.3rem);
  --sobre-shell-radius: var(--wpc-card-radius, var(--site-shell-radius, 20px));
  --sobre-shell-bg: color-mix(in srgb, var(--sobre-landing-neo) 92%, rgba(var(--bs-primary-rgb,33,40,108), .06) 8%);
  --sobre-shell-bg-alt: color-mix(in srgb, var(--sobre-landing-neo-alt) 86%, rgba(var(--bs-primary-rgb,33,40,108), .05) 14%);
  --sobre-shell-border: color-mix(in srgb, rgba(var(--bs-primary-rgb,33,40,108), .18) 60%, rgba(255,255,255,.7) 40%);
  --sobre-shell-shadow: var(--sobre-landing-neo-shadow);
  --sobre-inner-radius: max(18px, calc(var(--wpc-card-radius, var(--site-shell-radius, 20px)) - 2px));
  --sobre-inner-bg: color-mix(in srgb, var(--sobre-landing-neo) 90%, rgba(var(--bs-primary-rgb,33,40,108), .05) 10%);
  --sobre-inner-border: color-mix(in srgb, rgba(var(--bs-primary-rgb,33,40,108), .16) 55%, rgba(255,255,255,.75) 45%);
  --sobre-inner-shadow: 10px 10px 26px color-mix(in srgb, rgba(var(--bs-primary-rgb,33,40,108), .18) 68%, rgba(15,23,42,.14) 32%),
                        -10px -10px 24px rgba(255,255,255,.9);
  --sobre-inner-shadow-hover: 12px 12px 28px color-mix(in srgb, rgba(var(--bs-primary-rgb,33,40,108), .2) 70%, rgba(15,23,42,.16) 30%),
                              -12px -12px 26px rgba(255,255,255,.94);
  --sobre-text-strong: color-mix(in srgb, var(--sobre-landing-ink) 72%, var(--color-neutral-0, #ffffff) 28%);
  --sobre-text-muted: color-mix(in srgb, var(--sobre-text-strong) 48%, rgba(255,255,255,.78) 52%);
  --sobre-accent: color-mix(in srgb, var(--grad-primary-start) 58%, var(--grad-primary-end) 42%);
  --sobre-stage-bg: color-mix(in srgb, rgba(var(--bs-primary-rgb,33,40,108), .08) 68%, rgba(255,255,255,.86) 32%);
  --sobre-stage-border: color-mix(in srgb, rgba(var(--bs-primary-rgb,33,40,108), .22) 60%, rgba(255,255,255,.72) 40%);
  --sobre-icon-bg: linear-gradient(145deg, color-mix(in srgb, var(--sobre-landing-neo-alt) 90%, transparent 10%), rgba(var(--bs-primary-rgb,33,40,108), .08));
  --sobre-icon-border: color-mix(in srgb, rgba(var(--bs-primary-rgb,33,40,108), .26) 55%, rgba(255,255,255,.7) 45%);
  --sobre-icon-shadow: 6px 6px 16px color-mix(in srgb, rgba(var(--bs-primary-rgb,33,40,108), .18) 60%, transparent),
                       -4px -4px 14px rgba(255,255,255,.86);
  --sobre-icon-active-shadow: 0 0 0 3px color-mix(in srgb, rgba(var(--bs-primary-rgb,33,40,108), .18) 55%, transparent),
                              0 0 26px color-mix(in srgb, rgba(var(--bs-primary-rgb,33,40,108), .26) 70%, transparent);
  --sobre-dot-bg: color-mix(in srgb, var(--sobre-inner-bg) 92%, rgba(255,255,255,.9) 8%);
  --sobre-dot-border: color-mix(in srgb, rgba(var(--bs-primary-rgb,33,40,108), .22) 42%, rgba(255,255,255,.78) 58%);
  --sobre-dot-shadow: 5px 5px 12px color-mix(in srgb, rgba(var(--bs-primary-rgb,33,40,108), .16) 60%, transparent),
                      -6px -6px 14px rgba(255,255,255,.88);
  --sobre-dot-active-bg: linear-gradient(135deg, var(--grad-primary-start), var(--grad-primary-end));
  --sobre-dot-active-shadow: 0 0 0 4px rgba(var(--bs-primary-rgb,33,40,108), .16),
                             0 0 28px rgba(var(--bs-primary-rgb,33,40,108), .36);
  --timeline-cycle-interval: 6000ms;
  --timeline-cycle-duration: calc(var(--timeline-cycle-interval) * var(--timeline-items, 1));
  --timeline-card-gap: clamp(0.85rem, 2vw, 1rem);
  --timeline-card-padding: clamp(1.2rem, 3.8vw, 1.8rem);
  color:var(--sobre-text-strong);
  background:linear-gradient(160deg, var(--sobre-shell-bg), var(--sobre-shell-bg-alt));
  border:1px solid var(--sobre-shell-border);
  border-radius:var(--sobre-shell-radius);
  box-shadow:var(--sobre-shell-shadow);
  overflow:visible;
  margin-inline:auto;
  max-width:var(--sobre-landing-max-width);
}

.sobre-timeline-card .section-header{
  text-align:center;
  display:grid;
  gap:.75rem;
  margin:0 auto;
  max-width:720px;
}

.sobre-timeline-card .section-header :is(h2, h3){
  margin:0;
  font-weight:800;
  letter-spacing:-.01em;
  color:inherit;
}

.sobre-timeline-card .section-header .lead{
  margin:0;
  color:var(--sobre-text-muted);
  font-size:clamp(1rem, 2.4vw, 1.2rem);
}

.sobre-timeline-card .gradient-text{
  background:linear-gradient(90deg, var(--grad-primary-start), var(--grad-primary-end));
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

.sobre-timeline-card .pilares-grid{
  display:grid;
  gap:clamp(1.5rem, 4vw, 2.5rem);
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
}

.sobre-timeline-card .pillar-card{
  display:grid;
  gap:1rem;
  padding:clamp(1.5rem, 4vw, 2rem);
  border-radius:var(--sobre-inner-radius);
  background:var(--sobre-inner-bg);
  border:1px solid var(--sobre-inner-border);
  box-shadow:var(--sobre-inner-shadow);
  transition:transform .3s ease, box-shadow .3s ease;
}

.sobre-timeline-card .pillar-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--sobre-inner-shadow-hover);
}

.sobre-timeline-card .pillar-icon-wrapper{
  width:64px;
  height:64px;
  display:grid;
  place-items:center;
  border-radius:20px;
  background:var(--sobre-icon-bg);
  border:1px solid var(--sobre-icon-border);
  box-shadow:var(--sobre-icon-shadow);
  color:var(--sobre-accent);
}

.sobre-timeline-card .pillar-card h4{
  margin:0;
  font-size:clamp(1.05rem, 2.4vw, 1.25rem);
  color:inherit;
}

.sobre-timeline-card .pillar-card p{
  margin:0;
  color:var(--sobre-text-muted);
  line-height:1.65;
}

.sobre-timeline-card .timeline{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:clamp(1.4rem, 3vw, 2.2rem);
  padding-inline:clamp(.5rem, 3vw, 1.25rem);
  max-width:min(860px, 100%);
  margin-inline:auto;
  align-items:stretch;
  --timeline-axis: 50%;
  --timeline-gap: clamp(2.2rem, 7vw, 3.2rem);
  --timeline-ease: cubic-bezier(.16, .84, .44, 1);
  --timeline-progress: 0;
  --timeline-active-index: 1;
  --timeline-items: 1;
}


.sobre-timeline-card .timeline::before{
  content:"";
  position:absolute;
  inset-block:0;
  left:var(--timeline-axis);
  width:3px;
  transform:translateX(-50%);
  background:linear-gradient(180deg,
    color-mix(in srgb, rgba(var(--bs-primary-rgb,33,40,108), .16) 60%, transparent 40%),
    color-mix(in srgb, rgba(var(--bs-primary-rgb,33,40,108), .04) 45%, transparent 55%)
  );
  border-radius:999px;
}

.sobre-timeline-card .timeline::after{
  content:"";
  position:absolute;
  top:0;
  left:var(--timeline-axis);
  width:3px;
  transform:translateX(-50%);
  height:calc(var(--timeline-progress) * 100%);
  background:linear-gradient(180deg, var(--grad-primary-start), var(--grad-primary-end));
  border-radius:999px;
  transition:height .6s var(--timeline-ease);
}

.sobre-timeline-card .timeline[data-sobre-cycle="true"]::before{
  content:"";
  position:absolute;
  top:0;
  left:var(--timeline-axis);
  width:4px;
  height:100%;
  transform:translateX(-50%);
  background:linear-gradient(180deg,
    transparent 0%,
    color-mix(in srgb, var(--sobre-accent) 20%, transparent 80%) 25%,
    color-mix(in srgb, var(--sobre-accent) 48%, rgba(255,255,255,.4) 52%) 50%,
    color-mix(in srgb, var(--sobre-accent) 20%, transparent 80%) 75%,
    transparent 100%
  );
  background-size:100% 240%;
  animation:timeline-flow var(--timeline-cycle-duration) linear infinite;
  opacity:.55;
  pointer-events:none;
}

.sobre-timeline-card .timeline-item{
  position:relative;
  display:grid;
  gap:clamp(.85rem, 2vw, 1.2rem);
  align-items:stretch;
}

.sobre-timeline-card .timeline-item:focus-visible{
  outline:3px solid color-mix(in srgb, var(--sobre-accent) 55%, transparent 45%);
  outline-offset:10px;
  border-radius:24px;
}

.sobre-timeline-card .timeline-dot{
  position:absolute;
  top:50%;
  left:var(--timeline-axis);
  transform:translate(-50%, -50%);
  z-index:2;
  width:16px;
  height:16px;
  border-radius:999px;
  background:var(--sobre-dot-bg);
  border:2px solid var(--sobre-dot-border);
  box-shadow:var(--sobre-dot-shadow);
  transition:transform .4s var(--timeline-ease), box-shadow .4s var(--timeline-ease), background .4s var(--timeline-ease), border-color .4s var(--timeline-ease);
}

.sobre-timeline-card [data-sobre-active="true"] .timeline-dot{
  transform:translate(-50%, -50%) scale(1.1);
  background:var(--sobre-dot-active-bg);
  border-color:color-mix(in srgb, rgba(255,255,255,.8) 40%, transparent 60%);
  box-shadow:var(--sobre-dot-active-shadow);
}

.sobre-timeline-card .timeline-content{
  position:relative;
  max-width:min(480px, 100%);
  justify-self:center;
  margin-inline:0;
}

.sobre-timeline-card .timeline-item[data-sobre-position="left"] .timeline-content{
  justify-self:flex-end;
  margin-right:var(--timeline-gap);
}

.sobre-timeline-card .timeline-item[data-sobre-position="right"] .timeline-content{
  justify-self:flex-start;
  margin-left:var(--timeline-gap);
}

.sobre-timeline-card .neumorphic-card{
  display:grid;
  gap:var(--timeline-card-gap);
  padding:var(--timeline-card-padding);
  border-radius:var(--sobre-inner-radius);
  background:linear-gradient(145deg,
    color-mix(in srgb, var(--sobre-inner-bg) 94%, rgba(255,255,255,.9) 6%),
    color-mix(in srgb, var(--sobre-inner-bg) 80%, rgba(var(--bs-primary-rgb,33,40,108), .04) 20%)
  );
  border:1px solid var(--sobre-inner-border);
  box-shadow:var(--sobre-inner-shadow);
  opacity:.82;
  transform:translate3d(0, 18px, 0);
  transition:box-shadow .3s ease, transform .6s var(--timeline-ease), opacity .6s var(--timeline-ease);
  position:relative;
  overflow:hidden;
}

.sobre-timeline-card .timeline-item[data-sobre-position="left"] .neumorphic-card{
  text-align:right;
}

.sobre-timeline-card .timeline-item[data-sobre-active="true"] .neumorphic-card{
  opacity:1;
  transform:translate3d(0, 0, 0);
}

.sobre-timeline-card .neumorphic-card::after{
  content:"";
  position:absolute;
  inset:10%;
  border-radius:inherit;
  background:radial-gradient(circle at center,
    color-mix(in srgb, var(--grad-primary-end) 32%, transparent 68%) 0%,
    transparent 70%
  );
  opacity:0;
  transform:scale(0.85);
  transition:opacity .4s ease, transform .4s ease;
  pointer-events:none;
}

.sobre-timeline-card .timeline[data-sobre-cycle="true"] .timeline-dot{
  animation:timeline-dot-wave var(--timeline-cycle-duration) ease-in-out infinite;
  animation-delay: calc((var(--timeline-cycle-duration) / var(--timeline-items, 1)) * (var(--timeline-index, 1) - 1));
}

.sobre-timeline-card .timeline[data-sobre-cycle="true"] .neumorphic-card::after{
  animation:timeline-glow var(--timeline-cycle-duration) linear infinite;
  animation-delay: calc((var(--timeline-cycle-duration) / var(--timeline-items, 1)) * (var(--timeline-index, 1) - 1));
}

.sobre-timeline-card .neumorphic-card:hover{
  box-shadow:var(--sobre-inner-shadow-hover);
}

.sobre-timeline-card .timeline-icon-wrapper{
  width:52px;
  height:52px;
  border-radius:18px;
  display:grid;
  place-items:center;
  background:var(--sobre-icon-bg);
  border:1px solid var(--sobre-icon-border);
  box-shadow:var(--sobre-icon-shadow);
  backdrop-filter:blur(8px) saturate(120%);
  -webkit-backdrop-filter:blur(8px) saturate(120%);
  color:var(--sobre-accent);
}

/* Realce quando o item estiver ativo no foco/scroll */
.sobre-timeline-card [data-sobre-active="true"] .timeline-icon-wrapper{
  box-shadow:var(--sobre-icon-active-shadow);
}

.sobre-timeline-card .neumorphic-card h4{
  margin:0;
  font-size:clamp(1.05rem, 2.5vw, 1.35rem);
  color:inherit;
}

.sobre-timeline-card .neumorphic-card p{
  margin:0;
  color:var(--sobre-text-muted);
  line-height:1.65;
}

.sobre-timeline-card .timeline-card-header{
  display:flex;
  align-items:center;
  gap:clamp(.6rem, 2vw, .9rem);
  justify-content:space-between;
}

.sobre-timeline-card .timeline-item[data-sobre-position="left"] .timeline-card-header{
  flex-direction:row-reverse;
}

.sobre-timeline-card .timeline-card-body{
  display:grid;
  gap:.6rem;
}

.sobre-timeline-card .timeline-stage-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.35rem .85rem;
  border-radius:999px;
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  background:var(--sobre-stage-bg);
  border:1px solid var(--sobre-stage-border);
  color:color-mix(in srgb, var(--sobre-text-strong) 75%, rgba(var(--bs-primary-rgb,33,40,108), .25) 25%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3);
  min-width:94px;
  text-align:center;
  transition:background .3s ease, border-color .3s ease, color .3s ease, box-shadow .3s ease;
}

@keyframes timeline-flow{
  0%{ background-position:0 0; }
  100%{ background-position:0 100%; }
}

@keyframes timeline-dot-wave{
  0%, 100%{ transform:translate(-50%, -50%) scale(1); }
  6%, 10%{ transform:translate(-50%, -50%) scale(1.18); }
}

@keyframes timeline-glow{
  0%, 100%{ opacity:0; transform:scale(0.85); }
  6%, 12%{ opacity:0.38; transform:scale(1); }
  18%, 90%{ opacity:0; transform:scale(0.92); }
}

@media (prefers-reduced-motion: reduce){
  .sobre-timeline-card .timeline[data-sobre-cycle="true"]::before,
  .sobre-timeline-card .timeline[data-sobre-cycle="true"] .timeline-dot,
  .sobre-timeline-card .timeline[data-sobre-cycle="true"] .neumorphic-card::after{
    animation:none !important;
  }

  .sobre-timeline-card .timeline[data-sobre-cycle="true"]::before,
  .sobre-timeline-card .timeline[data-sobre-cycle="true"] .neumorphic-card::after{
    opacity:0;
  }

  .sobre-timeline-card .timeline[data-sobre-cycle="true"] .timeline-dot{
    transform:translate(-50%, -50%);
  }
}

.sobre-timeline-card [data-sobre-active="true"] .timeline-stage-pill{
  background:linear-gradient(135deg, color-mix(in srgb, var(--grad-primary-start) 78%, var(--grad-primary-end) 22%), rgba(var(--bs-primary-rgb,33,40,108), .12));
  border-color:color-mix(in srgb, rgba(255,255,255,.9) 45%, rgba(var(--bs-primary-rgb,33,40,108), .28) 55%);
  color:rgba(255,255,255,.95);
  box-shadow:0 8px 20px -12px rgba(var(--bs-primary-rgb,33,40,108), .45);
}

.sobre-timeline-card .timeline-item[data-sobre-position="left"] .timeline-stage-pill{
  margin-left:auto;
}

.sobre-timeline-card .timeline-item[data-sobre-position="right"] .timeline-stage-pill{
  margin-right:auto;
}

/* ====== Ajustes para o layout Sobre dentro do cartão WPC ====== */
#win-contact[data-page="sobre"] .sobre-timeline-card{
  color:var(--pp-text, var(--bs-body-color));
  gap:clamp(1.1rem, 2.8vw, 1.6rem);
  padding:clamp(1.3rem, 3.6vw, 1.9rem);
  --sobre-shell-radius: var(--wpc-card-radius, var(--site-shell-radius, 20px));
  --sobre-shell-bg: var(--neo-bg, var(--color-neutral-100));
  --sobre-shell-bg-alt: color-mix(in srgb, var(--neo-bg, var(--color-neutral-100)) 96%, rgba(var(--bs-primary-rgb,33,40,108), .05) 4%);
  --sobre-shell-border: rgba(var(--bs-primary-rgb,33,40,108), .1);
  --sobre-shell-shadow: 12px 12px 28px rgba(31,38,135,.12), -12px -12px 24px rgba(255,255,255,.9);
  --sobre-inner-radius: var(--wpc-card-radius, var(--site-shell-radius, 20px));
  --sobre-inner-bg: var(--neo-bg, var(--color-neutral-100));
  --sobre-inner-border: rgba(var(--bs-primary-rgb,33,40,108), .08);
  --sobre-inner-shadow: inset 4px 4px 8px var(--pp-shadow-dark, rgba(184,191,203,1)),
                        inset -4px -4px 8px var(--pp-shadow-light, rgba(255,255,255,1));
  --sobre-inner-shadow-hover: inset 4px 4px 8px var(--pp-shadow-dark, rgba(184,191,203,1)),
                              inset -4px -4px 8px var(--pp-shadow-light, rgba(255,255,255,1));
  --sobre-text-strong: var(--pp-text, var(--bs-body-color));
  --sobre-text-muted: var(--pp-muted, color-mix(in srgb, var(--bs-body-color) 68%, var(--color-neutral-0) 32%));
  --sobre-accent: var(--pp-brand, var(--color-primary-600));
  --sobre-stage-bg: color-mix(in srgb, var(--neo-bg, var(--color-neutral-100)) 90%, rgba(var(--bs-primary-rgb,33,40,108), .08) 10%);
  --sobre-stage-border: rgba(var(--bs-primary-rgb,33,40,108), .12);
  --sobre-icon-border: rgba(var(--bs-primary-rgb,33,40,108), .55);
  --sobre-icon-bg: linear-gradient(145deg, rgba(255,255,255,.16), rgba(var(--bs-primary-rgb,33,40,108), .08));
  --sobre-icon-shadow: 6px 6px 16px rgba(31,38,135,.12), -2px -2px 8px rgba(255,255,255,.6);
  --sobre-icon-active-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb,33,40,108), .16), 0 0 24px rgba(var(--bs-primary-rgb,33,40,108), .34);
  --sobre-dot-bg: var(--neo-bg, var(--color-neutral-100));
  --sobre-dot-border: rgba(var(--bs-primary-rgb,33,40,108), .18);
  --sobre-dot-shadow: 4px 4px 8px rgba(31,38,135,.12), -4px -4px 8px rgba(255,255,255,.75);
  --sobre-dot-active-bg: var(--pp-brand, var(--color-primary-600));
  --sobre-dot-active-shadow: 0 0 0 4px rgba(var(--bs-primary-rgb,33,40,108), .18), 0 0 24px rgba(var(--bs-primary-rgb,33,40,108), .4);
}

#win-contact[data-page="sobre"] .sobre-timeline-card .section-header{
  text-align:left;
  margin:0;
  max-width:none;
  color:inherit;
}

#win-contact[data-page="sobre"] .sobre-timeline-card .section-header .lead{
  color:var(--pp-muted, color-mix(in srgb, var(--bs-body-color) 68%, var(--color-neutral-0) 32%));
}

#win-contact[data-page="sobre"] .sobre-pillar-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:46px;
  height:46px;
  border-radius:16px;
  background:linear-gradient(140deg, rgba(var(--bs-primary-rgb,33,40,108), .16), rgba(255,255,255,.85));
  color:var(--pp-brand, var(--color-primary-600));
  box-shadow:inset 2px 2px 4px rgba(255,255,255,.75), inset -2px -2px 4px rgba(31,38,135,.08);
}

#win-contact[data-page="sobre"] .wpc-info-item .sobre-pillar-icon{
  margin-bottom:.35rem;
}

#win-contact[data-page="sobre"] .sobre-timeline-card .timeline{
  padding-inline:0;
  margin-top:clamp(1.5rem, 4vw, 2.4rem);
}

#win-contact[data-page="sobre"] .sobre-timeline-card .timeline{
  --timeline-axis: 50%;
}


#win-contact[data-page="sobre"] .sobre-timeline-card .timeline::before{
  top:0;
  bottom:0;
  background:linear-gradient(180deg, rgba(var(--bs-primary-rgb,33,40,108), .2), rgba(var(--bs-primary-rgb,33,40,108), .05));
  box-shadow:none;
}

#win-contact[data-page="sobre"] .sobre-timeline-card .timeline-item{
  padding-left:0;
}

#win-contact[data-page="sobre"] .sobre-timeline-card .timeline-content{
  max-width:min(480px, 100%);
}

#win-contact[data-page="sobre"] .sobre-timeline-card .neumorphic-card{
  padding:clamp(1.2rem, 3.2vw, 1.6rem);
}

#win-contact[data-page="sobre"] .sobre-timeline-card .neumorphic-card :is(h3, h4){
  margin:0;
  font-size:clamp(1.05rem, 2.4vw, 1.22rem);
  color:var(--pp-text, var(--bs-body-color));
}

#win-contact[data-page="sobre"] .sobre-timeline-card .neumorphic-card p{
  color:var(--pp-muted, color-mix(in srgb, var(--bs-body-color) 68%, var(--color-neutral-0) 32%));
  line-height:1.6;
}

.sobre-timeline-card .counter{
  font-weight:700;
  color:var(--sobre-text-strong);
}

[data-sobre-reveal]{
  opacity:0;
  transform:translateY(48px);
  transition:opacity .8s ease, transform .8s ease;
}

[data-sobre-reveal][data-sobre-visible="true"]{
  opacity:1;
  transform:none;
}

@media (max-width: 767.98px){
  .sobre-timeline-card .timeline{
    --timeline-axis: clamp(20px, 8vw, 44px);
    --timeline-gap: clamp(2.4rem, 14vw, 3.6rem);
  }
  .sobre-timeline-card .timeline-content{
    justify-self:flex-start;
    padding-left:clamp(3.5rem, 12vw, 4.5rem);
    margin-inline:0;
    max-width:100%;
  }
  .sobre-timeline-card .timeline-item[data-sobre-position="left"] .timeline-content,
  .sobre-timeline-card .timeline-item[data-sobre-position="right"] .timeline-content{
    justify-self:flex-start;
    margin-inline:0;
  }
  .sobre-timeline-card .timeline-item[data-sobre-position="left"] .neumorphic-card{
    text-align:left;
  }
}


@media (min-width: 768px){
  .sobre-timeline-card .timeline-item{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    align-items:center;
  }
  .sobre-timeline-card .timeline-content{
    max-width:min(420px, 100%);
  }
  .sobre-timeline-card .timeline-item[data-sobre-position="left"] .timeline-content{
    grid-column:1;
  }
  .sobre-timeline-card .timeline-item[data-sobre-position="right"] .timeline-content{
    grid-column:2;
  }
}

@media (prefers-reduced-motion: reduce){
  [data-sobre-reveal]{
    transition:none;
  }
  [data-sobre-page] .pillar-card,
  .sobre-timeline-card .neumorphic-card,
  .sobre-timeline-card .timeline-dot,
  .sobre-timeline-card .timeline::after{
    transition:none;
  }
  .sobre-timeline-card .neumorphic-card{
    transform:none !important;
    opacity:1 !important;
  }
}

@media (max-width: 767.98px){
  #win-contact[data-page="sobre"] .sobre-timeline-card .timeline{
    --timeline-axis: clamp(16px, 6vw, 24px);
    --timeline-gap: clamp(2rem, 10vw, 3.2rem);
  }
  #win-contact[data-page="sobre"] .sobre-timeline-card .timeline-content{
    padding-left:clamp(3rem, 12vw, 4rem);
    margin-inline:0;
  }

  /* Mobile: esconde o invólucro do card clicável e mantém apenas o conteúdo
     (a timeline) por cima do .sobre-landing__section-card. Usamos
     display: contents para remover a caixa do wrapper sem remover seus filhos. */
  #win-contact[data-page="sobre"] .wpc-info-tip.sobre-timeline-card.is-clickable{
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
  }
  @supports (display: contents){
    #win-contact[data-page="sobre"] .wpc-info-tip.sobre-timeline-card.is-clickable{ display: contents; }
  }
  /* Garante que os filhos fiquem acima de qualquer decoração do card pai */
  #win-contact[data-page="sobre"] .wpc-info-tip.sobre-timeline-card.is-clickable > *{
    position: relative;
    z-index: 2;
  }
}

@media (min-width: 768px){
  #win-contact[data-page="sobre"] .sobre-timeline-card .timeline-content{
    max-width:min(480px, 100%);
  }
}

/* ===================== Soft variant do card principal ===================== */
.wpc-contact-card[data-variant="soft"]{
  /* Tokens existentes do escopo garantem ligação às cores padrão */
  --soft-brand: var(--pp-brand, var(--color-primary-600));
  --soft-tint: color-mix(in srgb, var(--soft-brand), transparent 92%);
  --soft-bg: color-mix(in srgb, var(--color-neutral-0) 78%, transparent);
  --soft-border: color-mix(in srgb, var(--soft-brand), var(--color-neutral-0) 85%);
  --soft-shadow: 0 6px 20px rgba(17,24,39,.06);

  background:
    linear-gradient(180deg, var(--soft-tint), rgba(255,255,255,0) 60%),
    var(--soft-bg);
  border: 1px solid var(--soft-border);
  border-radius: var(--wpc-card-radius, var(--site-shell-radius, 20px));
  backdrop-filter: blur(10px) saturate(160%);
  -webkit-backdrop-filter: blur(10px) saturate(160%);
  box-shadow: var(--soft-shadow);
}

.wpc-contact-card[data-variant="soft"] .wpc-banner{
  border-radius:max(10px, calc(var(--wpc-card-radius, var(--site-shell-radius, 20px)) - 4px));
  box-shadow:0 3px 12px rgba(0,0,0,.06);
}
.wpc-contact-card[data-variant="soft"] .wpc-banner-caption{ padding-top:6px; }

.wpc-contact-card[data-variant="soft"] .wpc-info-item,
.wpc-contact-card[data-variant="soft"] .wpc-info-tip,
.wpc-contact-card[data-variant="soft"] .lc-card{
  --neo-bg: var(--color-primary-50);
  box-shadow: inset 2px 2px 4px var(--pp-shadow-dark), inset -2px -2px 4px var(--pp-shadow-light);
  border-radius:max(8px, calc(var(--wpc-card-radius, var(--site-shell-radius, 20px)) - 4px));

}

.wpc-contact-card[data-variant="soft"] .lc-btn-primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(var(--bs-primary-rgb,33,40,108),.28);
}
.wpc-contact-card[data-variant="soft"] .lc-btn-ghost{ background: rgba(255,255,255,.75); }

@media (prefers-reduced-motion: reduce){
  .wpc-contact-card[data-variant="soft"] .lc-btn-primary:hover{
    transform: none;
    box-shadow: 0 6px 16px rgba(var(--bs-primary-rgb,33,40,108),.22);
  }
}

/* Arestas alinhadas com header/footer em telas largas:
   quando todos os itens internos estão no tamanho normal,
   use o mesmo raio global do shell para o card principal. */
@media (min-width: 992px) {
  #win-contact .wpc-contact-card {
    --wpc-card-radius: var(--site-shell-radius, 20px);
    border-radius: var(--wpc-card-radius);
    overflow: hidden; /* garante que mídias internas respeitem o raio */
  }
}
