/* =========================================================================
   COMPONENTES
   Cada componente aparece UMA vez aqui. Se precisar de variação, use
   modificador (--nome), nunca um bloco novo.
   ========================================================================= */

/* =========================================================================
   1. BOTÕES
   ========================================================================= */
.ev-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--ev-s2);
  font-family:var(--ev-font-title);font-weight:700;font-size:.88rem;
  letter-spacing:.005em;text-decoration:none;text-align:center;
  padding:14px 28px;border-radius:var(--ev-radius-pill);
  border:2px solid transparent;
  transition:transform var(--ev-dur-fast) var(--ev-ease),
             box-shadow var(--ev-dur) var(--ev-ease),
             background-color var(--ev-dur-fast) var(--ev-ease),
             border-color var(--ev-dur-fast) var(--ev-ease),
             color var(--ev-dur-fast) var(--ev-ease);
}
.ev-btn svg{width:1.05em;height:1.05em;flex:none}

/* Primário — laranja. Um por seção, no máximo. */
.ev-btn--primary{
  background:var(--ev-grad-cta);color:#fff;
  box-shadow:var(--ev-shadow-cta);
}
.ev-btn--primary:hover{transform:translateY(-2px);box-shadow:var(--ev-shadow-cta-h);color:#fff}
.ev-btn--primary:active{transform:translateY(0)}

/* Secundário — contorno */
.ev-btn--ghost{
  border-color:rgba(14,59,94,.18);color:var(--ev-blue-deep);background:transparent;
}
.ev-btn--ghost:hover{border-color:var(--ev-blue-mid);background:var(--ev-blue-08);color:var(--ev-blue-mid)}

/* Sobre fundo escuro */
.ev-btn--light{background:#fff;color:var(--ev-blue-deep);box-shadow:var(--ev-shadow)}
.ev-btn--light:hover{transform:translateY(-2px);color:var(--ev-blue-mid);box-shadow:var(--ev-shadow-hover)}
.ev-btn--outline-light{border-color:rgba(255,255,255,.4);color:#fff}
.ev-btn--outline-light:hover{border-color:#fff;background:rgba(255,255,255,.1);color:#fff}

/* WhatsApp */
.ev-btn--wa{background:var(--ev-wa);color:#fff;box-shadow:0 6px 24px rgba(13,124,62,.34)}
.ev-btn--wa:hover{transform:translateY(-2px);background:#0a6633;color:#fff}

.ev-btn--sm{padding:10px 20px;font-size:.8rem}
.ev-btn--lg{padding:17px 36px;font-size:.96rem}
.ev-btn--block{width:100%}

/* Link com seta */
.ev-link{
  display:inline-flex;align-items:center;gap:var(--ev-s2);
  font-family:var(--ev-font-title);font-weight:700;font-size:var(--ev-fs-small);
  color:var(--ev-orange-txt);text-decoration:none;
}
.ev-link::after{content:"→";transition:transform var(--ev-dur-fast) var(--ev-ease)}
.ev-link:hover{color:var(--ev-orange-txt-h)}
.ev-link:hover::after{transform:translateX(4px)}


/* =========================================================================
   2. CARTÕES
   ========================================================================= */
.ev-card{
  background:#fff;border-radius:var(--ev-radius);
  padding:var(--ev-s5);border:var(--ev-border);
  box-shadow:var(--ev-shadow);
  transition:transform var(--ev-dur) var(--ev-ease),box-shadow var(--ev-dur) var(--ev-ease);
  height:100%;
}
.ev-card--hover:hover{transform:translateY(-6px);box-shadow:var(--ev-shadow-hover)}

/* Borda lateral laranja */
.ev-card--edge{
  border-left:4px solid var(--ev-orange);
  border-radius:0 var(--ev-radius) var(--ev-radius) 0;
}
.ev-card--edge-blue{border-left-color:var(--ev-blue)}
.ev-card--edge-teal{border-left-color:var(--ev-teal)}

.ev-card--soft{background:var(--ev-bg-soft);box-shadow:none;border:none}
.ev-card--blue{background:var(--ev-bg-blue);box-shadow:none;border:none}
.ev-card--warm{background:var(--ev-bg-warm);box-shadow:none;border:none}
.ev-card--deep{background:var(--ev-blue-deep);border:none;color:#fff}
.ev-card--deep h3,.ev-card--deep h4{color:#fff}
.ev-card--deep p{color:#c9e2f4}

.ev-card--lg{padding:var(--ev-s6)}
.ev-card__title{margin-bottom:var(--ev-s2)}
.ev-card__text{color:var(--ev-muted);font-size:var(--ev-fs-small);line-height:var(--ev-lh-normal)}
.ev-card__foot{margin-top:var(--ev-s4);padding-top:var(--ev-s4);border-top:var(--ev-border-line)}

/* Cartão numerado */
.ev-card__num{
  font-family:var(--ev-font-title);font-weight:900;
  font-size:1.6rem;line-height:1;color:var(--ev-orange-txt);
  display:block;margin-bottom:var(--ev-s3);
}
.ev-card__num--blue{color:var(--ev-blue)}

/* Cartão-link inteiro clicável */
.ev-card--link{position:relative;display:block;text-decoration:none;color:inherit}
.ev-card--link::after{content:"";position:absolute;inset:0;border-radius:inherit}


/* =========================================================================
   3. ÍCONE EM CÁPSULA
   ========================================================================= */
.ev-ico{
  display:inline-grid;place-items:center;flex:none;
  width:48px;height:48px;border-radius:14px;
  background:var(--ev-orange-08);color:var(--ev-orange-txt);
  font-family:var(--ev-font-title);font-weight:800;font-size:.82rem;letter-spacing:.04em;
}
.ev-ico--blue{background:var(--ev-blue-08);color:var(--ev-blue-mid)}
.ev-ico--teal{background:rgba(68,190,210,.12);color:#1d7080}
.ev-ico--deep{background:var(--ev-blue-deep);color:#fff}
.ev-ico--lg{width:64px;height:64px;border-radius:18px;font-size:1rem}
.ev-ico svg{width:22px;height:22px}


/* =========================================================================
   4. PÍLULAS E TAGS
   ========================================================================= */
.ev-pill{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--ev-font-title);font-weight:600;font-size:var(--ev-fs-tiny);
  padding:6px 14px;border-radius:var(--ev-radius-pill);
  background:var(--ev-bg-blue);color:var(--ev-blue-mid);
  border:1px solid rgba(0,153,227,.16);
}
.ev-pill--orange{background:var(--ev-orange-08);color:var(--ev-orange-txt-h);border-color:var(--ev-orange-18)}
.ev-pill--solid{background:var(--ev-blue-deep);color:#fff;border-color:transparent}
.ev-pill--light{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.22)}


/* =========================================================================
   5. FAIXA DE MÉTRICAS
   ========================================================================= */
.ev-metrics{
  display:grid;gap:var(--ev-s4);
  grid-template-columns:repeat(auto-fit,minmax(min(140px,100%),1fr));
}
.ev-metric__num{
  font-family:var(--ev-font-title);font-weight:900;
  font-size:clamp(1.7rem,3.2vw,2.4rem);line-height:1;
  color:var(--ev-blue-deep);letter-spacing:var(--ev-ls-tight);
}
.ev-metric__num span{color:var(--ev-orange-txt)}
.ev-metric__label{
  display:block;margin-top:6px;
  font-size:var(--ev-fs-tiny);line-height:1.35;
  color:var(--ev-faint);
  text-transform:uppercase;letter-spacing:.06em;font-weight:700;
}
.ev-on-dark .ev-metric__num{color:#fff}
.ev-on-dark .ev-metric__label{color:#7fc4ec}

/* Separador entre métricas no desktop */
@media (min-width:640px){
  .ev-metrics--divided .ev-metric + .ev-metric{
    border-left:var(--ev-border-line);padding-left:var(--ev-s5);
  }
  .ev-on-dark .ev-metrics--divided .ev-metric + .ev-metric{border-left-color:rgba(255,255,255,.18)}
}


/* =========================================================================
   6. LINHA DO TEMPO NUMERADA
   ========================================================================= */
.ev-steps{display:grid;gap:var(--ev-s5);counter-reset:evstep}
.ev-step{position:relative;padding-left:66px;counter-increment:evstep}
.ev-step::before{
  content:counter(evstep,decimal-leading-zero);
  position:absolute;left:0;top:0;
  width:46px;height:46px;border-radius:14px;
  display:grid;place-items:center;
  font-family:var(--ev-font-title);font-weight:800;font-size:.88rem;
  background:#fff;color:var(--ev-orange-txt);
  border:2px solid var(--ev-orange-18);
}
/* Fio conectando as etapas */
.ev-step::after{
  content:"";position:absolute;left:23px;top:52px;bottom:-24px;
  width:2px;background:linear-gradient(180deg,var(--ev-orange-18),transparent);
}
.ev-step:last-child::after{display:none}
.ev-step__title{margin-bottom:4px}
.ev-step__text{color:var(--ev-muted);font-size:var(--ev-fs-small)}

.ev-on-dark .ev-step::before{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.25)}

/* Variante horizontal no desktop */
@media (min-width:960px){
  .ev-steps--row{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--ev-s5)}
  .ev-steps--row .ev-step{padding-left:0;padding-top:62px}
  .ev-steps--row .ev-step::after{left:52px;right:-24px;top:23px;bottom:auto;width:auto;height:2px;
    background:linear-gradient(90deg,var(--ev-orange-18),transparent)}
}


/* =========================================================================
   7. ESCALA DE MATURIDADE (CX 1.0 → 6.0)
   ========================================================================= */
.ev-scale{display:grid;gap:var(--ev-s3)}
.ev-scale__item{
  display:grid;grid-template-columns:auto 1fr;gap:var(--ev-s4);align-items:start;
  background:#fff;border:var(--ev-border);border-radius:var(--ev-radius);
  padding:var(--ev-s4) var(--ev-s5);
  border-left:4px solid var(--ev-blue);
  transition:transform var(--ev-dur) var(--ev-ease),box-shadow var(--ev-dur) var(--ev-ease);
}
.ev-scale__item:hover{transform:translateX(4px);box-shadow:var(--ev-shadow)}
.ev-scale__item:nth-child(1){border-left-color:#9fc3dd}
.ev-scale__item:nth-child(2){border-left-color:#6aa9cf}
.ev-scale__item:nth-child(3){border-left-color:var(--ev-blue)}
.ev-scale__item:nth-child(4){border-left-color:var(--ev-blue-mid)}
.ev-scale__item:nth-child(5){border-left-color:var(--ev-orange-soft)}
.ev-scale__item:nth-child(6){border-left-color:var(--ev-orange)}
.ev-scale__ver{
  font-family:var(--ev-font-title);font-weight:900;font-size:.86rem;
  color:var(--ev-blue-mid);white-space:nowrap;padding-top:2px;
}
.ev-scale__title{font-size:.98rem;margin-bottom:2px}
.ev-scale__text{font-size:var(--ev-fs-small);color:var(--ev-muted)}


/* =========================================================================
   8. CITAÇÃO / DESTAQUE
   ========================================================================= */
.ev-quote{
  border-left:4px solid var(--ev-orange);
  padding:var(--ev-s5) var(--ev-s6);
  background:var(--ev-bg-warm);
  border-radius:0 var(--ev-radius) var(--ev-radius) 0;
}
.ev-quote p{
  font-family:var(--ev-font-title);font-weight:600;
  font-size:clamp(1.05rem,1.8vw,1.35rem);line-height:1.45;
  color:var(--ev-blue-deep);letter-spacing:-.01em;
}
.ev-quote cite{
  display:block;margin-top:var(--ev-s3);
  font-family:var(--ev-font-body);font-style:normal;
  font-size:var(--ev-fs-small);color:var(--ev-muted);
}
.ev-quote--deep{background:var(--ev-blue-deep);border-left-color:var(--ev-orange);border-radius:var(--ev-radius)}
.ev-quote--deep p{color:#fff}
.ev-quote--deep cite{color:#7fc4ec}


/* =========================================================================
   9. ACORDEÃO DE FAQ  (<details>/<summary> nativo — sem JS)
   ========================================================================= */
.ev-faq{display:grid;gap:var(--ev-s3)}
.ev-faq__item{
  background:#fff;border:var(--ev-border-line);border-radius:var(--ev-radius);
  overflow:hidden;transition:box-shadow var(--ev-dur) var(--ev-ease);
}
.ev-faq__item[open]{box-shadow:var(--ev-shadow)}
.ev-faq__q{
  display:flex;align-items:center;justify-content:space-between;gap:var(--ev-s4);
  padding:var(--ev-s4) var(--ev-s5);cursor:pointer;list-style:none;
  font-family:var(--ev-font-title);font-weight:700;font-size:.95rem;
  color:var(--ev-blue-deep);
}
.ev-faq__q::-webkit-details-marker{display:none}
.ev-faq__q::after{
  content:"";flex:none;width:11px;height:11px;
  border-right:2.5px solid var(--ev-orange-txt);border-bottom:2.5px solid var(--ev-orange-txt);
  transform:rotate(45deg) translateY(-3px);
  transition:transform var(--ev-dur) var(--ev-ease);
}
.ev-faq__item[open] .ev-faq__q::after{transform:rotate(-135deg) translateY(-3px)}
.ev-faq__q:hover{background:var(--ev-bg-soft)}
.ev-faq__a{padding:0 var(--ev-s5) var(--ev-s5);color:var(--ev-muted);font-size:var(--ev-fs-small)}
.ev-faq__a p + p{margin-top:var(--ev-s3)}


/* =========================================================================
   10. COMPARATIVO ANTES × DEPOIS
   ========================================================================= */
.ev-vs{display:grid;gap:var(--ev-s5);align-items:stretch}
@media (min-width:960px){.ev-vs{grid-template-columns:1fr auto 1fr;gap:var(--ev-s6)}}
.ev-vs__col{border-radius:var(--ev-radius);padding:var(--ev-s6);height:100%}
.ev-vs__col--before{background:var(--ev-bg-soft);border:var(--ev-border-line)}
.ev-vs__col--after{background:var(--ev-blue-deep);color:#fff}
.ev-vs__col--after h3{color:#fff}
.ev-vs__col--after .ev-list li{color:#c9e2f4}
.ev-vs__col--after .ev-list li::before{background:var(--ev-orange)}
.ev-vs__badge{
  display:grid;place-items:center;align-self:center;
  font-family:var(--ev-font-title);font-weight:800;font-size:var(--ev-fs-tiny);
  letter-spacing:var(--ev-ls-eyebrow);text-transform:uppercase;color:#fff;
  background:var(--ev-grad-cta);border-radius:var(--ev-radius-pill);
  padding:10px 20px;box-shadow:var(--ev-shadow-cta);white-space:nowrap;
}


/* =========================================================================
   11. CARTÃO DE LIVRO
   ========================================================================= */
.ev-book{
  display:grid;grid-template-columns:110px 1fr;gap:var(--ev-s5);
  background:#fff;border:var(--ev-border);border-radius:var(--ev-radius);
  padding:var(--ev-s5);box-shadow:var(--ev-shadow);height:100%;
  transition:transform var(--ev-dur) var(--ev-ease),box-shadow var(--ev-dur) var(--ev-ease);
}
.ev-book:hover{transform:translateY(-5px);box-shadow:var(--ev-shadow-hover)}
.ev-book__cover{
  border-radius:var(--ev-radius-sm);overflow:hidden;
  box-shadow:0 6px 18px rgba(14,59,94,.18);aspect-ratio:2/3;background:var(--ev-bg-soft);
}
.ev-book__cover img{width:100%;height:100%;object-fit:cover}
.ev-book__role{
  font-family:var(--ev-font-title);font-weight:700;font-size:var(--ev-fs-tiny);
  text-transform:uppercase;letter-spacing:.08em;color:var(--ev-orange-txt);
  display:block;margin-bottom:6px;
}
.ev-book__title{font-size:1rem;margin-bottom:6px;color:var(--ev-blue-deep)}
.ev-book__meta{font-size:var(--ev-fs-tiny);color:var(--ev-faint);margin-bottom:var(--ev-s3)}
.ev-book__text{font-size:var(--ev-fs-small);color:var(--ev-muted)}
@media (max-width:479px){
  .ev-book{grid-template-columns:1fr}
  .ev-book__cover{max-width:120px}
}


/* =========================================================================
   12. BLOCO DE ASSINATURA "EV"
   ========================================================================= */
.ev-signature{display:flex;align-items:center;gap:var(--ev-s4)}
.ev-signature__mono{
  display:grid;place-items:center;flex:none;
  width:52px;height:52px;border-radius:16px;
  background:var(--ev-grad-cta);color:#fff;
  font-family:var(--ev-font-title);font-weight:900;font-size:1.1rem;letter-spacing:.02em;
  box-shadow:var(--ev-shadow-cta);
}
.ev-signature__name{
  font-family:var(--ev-font-title);font-weight:800;font-size:.98rem;
  color:var(--ev-blue-deep);line-height:1.2;
}
.ev-signature__role{font-size:var(--ev-fs-tiny);color:var(--ev-muted);line-height:1.4;margin-top:2px}
.ev-on-dark .ev-signature__name{color:#fff}
.ev-on-dark .ev-signature__role{color:#7fc4ec}


/* =========================================================================
   13. MÍDIA — retrato com moldura
   ========================================================================= */
.ev-portrait{position:relative;border-radius:var(--ev-radius-lg);overflow:visible}
.ev-portrait__img{
  border-radius:var(--ev-radius-lg);overflow:hidden;
  box-shadow:0 24px 60px rgba(14,59,94,.22);
  aspect-ratio:4/5;background:var(--ev-bg-soft);
}
.ev-portrait__img img{width:100%;height:100%;object-fit:cover}
/* Selo flutuante */
.ev-portrait__badge{
  position:absolute;left:-16px;bottom:28px;
  background:#fff;border-radius:var(--ev-radius);
  padding:var(--ev-s3) var(--ev-s4);
  box-shadow:var(--ev-shadow-hover);
  display:flex;align-items:center;gap:var(--ev-s3);
  max-width:min(260px,80%);
}
.ev-portrait__badge strong{
  font-family:var(--ev-font-title);font-weight:900;font-size:1.15rem;
  color:var(--ev-orange-txt);line-height:1;
}
.ev-portrait__badge span{font-size:var(--ev-fs-tiny);color:var(--ev-muted);line-height:1.3}


/* =========================================================================
   14. LOGOS / PROVA SOCIAL
   ========================================================================= */
.ev-logos{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:var(--ev-s6) var(--ev-s8);
}
.ev-logos img{
  height:38px;width:auto;
  filter:grayscale(1);opacity:.55;
  transition:filter var(--ev-dur) var(--ev-ease),opacity var(--ev-dur) var(--ev-ease);
}
.ev-logos img:hover{filter:grayscale(0);opacity:1}


/* =========================================================================
   15. FORMULÁRIO
   ========================================================================= */
.ev-field{display:grid;gap:6px;margin-bottom:var(--ev-s4)}
.ev-field label{
  font-family:var(--ev-font-title);font-weight:700;font-size:var(--ev-fs-tiny);
  text-transform:uppercase;letter-spacing:.06em;color:var(--ev-blue-mid);
}
.ev-field label .req{color:var(--ev-orange)}
.ev-field input,.ev-field select,.ev-field textarea{
  width:100%;padding:12px 16px;
  border:1.5px solid var(--ev-line);border-radius:12px;
  background:#fff;font-size:var(--ev-fs-body);color:var(--ev-ink);
  transition:border-color var(--ev-dur-fast) var(--ev-ease),box-shadow var(--ev-dur-fast) var(--ev-ease);
}
.ev-field textarea{min-height:130px;resize:vertical}
.ev-field input:focus,.ev-field select:focus,.ev-field textarea:focus{
  border-color:var(--ev-blue);box-shadow:0 0 0 4px var(--ev-blue-08);outline:none;
}
.ev-field input[aria-invalid="true"],.ev-field textarea[aria-invalid="true"]{border-color:var(--ev-warn)}
.ev-field__hint{font-size:var(--ev-fs-tiny);color:var(--ev-faint)}
.ev-field__error{font-size:var(--ev-fs-tiny);color:var(--ev-warn);font-weight:600}

.ev-consent{display:flex;gap:var(--ev-s3);align-items:flex-start;margin-bottom:var(--ev-s5)}
.ev-consent input{width:18px;height:18px;flex:none;margin-top:2px;accent-color:var(--ev-orange)}
.ev-consent label{font-size:var(--ev-fs-tiny);color:var(--ev-muted);line-height:1.55;text-transform:none;letter-spacing:0;font-family:var(--ev-font-body);font-weight:400}

/* Honeypot — invisível para humanos, visível para bots */
.ev-hp{position:absolute!important;left:-9999px;opacity:0;pointer-events:none}

.ev-alert{padding:var(--ev-s4) var(--ev-s5);border-radius:var(--ev-radius);margin-bottom:var(--ev-s5);font-size:var(--ev-fs-small)}
.ev-alert--ok{background:#eefaf4;border-left:4px solid var(--ev-ok);color:#115c3f}
.ev-alert--err{background:#fff5f5;border-left:4px solid var(--ev-warn);color:#9b2c2c}


/* =========================================================================
   16. REVELAÇÃO AO ROLAR  (substitui o GSAP)
   ========================================================================= */
.ev-reveal{
  opacity:0;transform:translateY(24px);
  transition:opacity .6s var(--ev-ease-out),transform .6s var(--ev-ease-out);
}
.ev-reveal.is-visible{opacity:1;transform:none}
/* Cascata: aplique no container, os filhos entram em sequência */
.ev-reveal-stagger > *{
  opacity:0;transform:translateY(20px);
  transition:opacity .55s var(--ev-ease-out),transform .55s var(--ev-ease-out);
}
.ev-reveal-stagger.is-visible > *{opacity:1;transform:none}
.ev-reveal-stagger.is-visible > *:nth-child(1){transition-delay:0s}
.ev-reveal-stagger.is-visible > *:nth-child(2){transition-delay:.07s}
.ev-reveal-stagger.is-visible > *:nth-child(3){transition-delay:.14s}
.ev-reveal-stagger.is-visible > *:nth-child(4){transition-delay:.21s}
.ev-reveal-stagger.is-visible > *:nth-child(5){transition-delay:.28s}
.ev-reveal-stagger.is-visible > *:nth-child(6){transition-delay:.35s}
.ev-reveal-stagger.is-visible > *:nth-child(7){transition-delay:.42s}
.ev-reveal-stagger.is-visible > *:nth-child(8){transition-delay:.49s}

@media (prefers-reduced-motion: reduce){
  .ev-reveal,.ev-reveal-stagger > *{opacity:1!important;transform:none!important}
}


/* =========================================================================
   17. CARTÃO-PONTE — leva para fora do site (Customer Centric)
   Visualmente distinto para deixar claro que não é a Euriale pessoalmente.
   ========================================================================= */
.ev-card--ponte{
  background:linear-gradient(165deg,#f4f8fb 0%,#e9eff5 100%);
  border:1px dashed rgba(14,59,94,.22);
  box-shadow:none;
  padding-top:calc(var(--ev-s5) + 14px);
}
.ev-card--ponte:hover{
  border-style:solid;border-color:var(--ev-blue);
  box-shadow:var(--ev-shadow-hover);
}
.ev-card__selo{
  position:absolute;top:12px;left:var(--ev-s5);
  font-family:var(--ev-font-title);font-weight:700;font-size:.6rem;
  letter-spacing:.14em;text-transform:uppercase;
  color:#fff;background:var(--ev-blue-deep);
  padding:4px 10px;border-radius:var(--ev-radius-pill);
}
.ev-card--ponte .ev-card__title{color:var(--ev-blue-mid)}
.ev-card--ponte .ev-link{color:var(--ev-blue-mid)}
.ev-card--ponte .ev-link:hover{color:var(--ev-blue-deep)}
/* O selo não deve flutuar em 3D junto com o resto */
.ev-tilt.ev-card--ponte > .ev-card__selo{transform:none}


/* =========================================================================
   18. CARTÃO DO ECOSSISTEMA
   ========================================================================= */
.ev-eco{display:block;text-decoration:none;color:inherit}
.ev-eco__topo{display:flex;align-items:center;justify-content:space-between;gap:var(--ev-s3)}
.ev-eco__host{
  font-family:var(--ev-font-title);font-weight:600;font-size:var(--ev-fs-tiny);
  color:var(--ev-blue-mid);margin:2px 0 var(--ev-s3);
  word-break:break-word;
}
.ev-eco:hover .ev-eco__host{color:var(--ev-orange-txt)}
.ev-eco__papel{
  margin-top:var(--ev-s4);padding-top:var(--ev-s3);
  border-top:var(--ev-border-line);
  font-size:var(--ev-fs-tiny);color:var(--ev-faint);
  text-transform:uppercase;letter-spacing:.08em;font-weight:700;
}
.ev-eco--destaque{border-top:4px solid var(--ev-orange)}


/* =========================================================================
   19. RÉGUA DE MATURIDADE EM DEGRAUS (CX1 → CX6)
   ========================================================================= */
.ev-regua{display:grid;gap:var(--ev-s3)}
@media (min-width:640px){.ev-regua{grid-template-columns:repeat(2,1fr)}}
@media (min-width:960px){.ev-regua{grid-template-columns:repeat(3,1fr);gap:var(--ev-s4)}}
.ev-regua__nivel{
  position:relative;overflow:hidden;
  background:#fff;border:1px solid var(--ev-line);border-radius:var(--ev-radius);
  padding:var(--ev-s5);
  transition:transform var(--ev-dur) var(--ev-ease),box-shadow var(--ev-dur) var(--ev-ease);
}
.ev-regua__nivel:hover{transform:translateY(-4px);box-shadow:var(--ev-shadow-hover)}
.ev-regua__nivel::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:4px;
  background:var(--ev-blue);
}
.ev-regua__nivel:nth-child(1)::before{background:#9fc3dd}
.ev-regua__nivel:nth-child(2)::before{background:#6aa9cf}
.ev-regua__nivel:nth-child(3)::before{background:var(--ev-blue)}
.ev-regua__nivel:nth-child(4)::before{background:var(--ev-blue-mid)}
.ev-regua__nivel:nth-child(5)::before{background:var(--ev-orange-soft)}
.ev-regua__nivel:nth-child(6)::before{background:var(--ev-orange)}
.ev-regua__cod{
  font-family:var(--ev-font-title);font-weight:900;font-size:1.5rem;
  color:var(--ev-blue-mid);line-height:1;letter-spacing:-.02em;
}
.ev-regua__nome{
  display:block;font-family:var(--ev-font-title);font-weight:700;font-size:.66rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--ev-orange-txt);
  margin:6px 0 var(--ev-s3);
}
.ev-regua__txt{font-size:var(--ev-fs-small);color:var(--ev-muted)}

/* Camadas numeradas (Percepção / Processo / Evidência / Dados) */
.ev-camada{position:relative;padding-left:var(--ev-s7)}
.ev-camada__n{
  position:absolute;left:0;top:0;
  font-family:var(--ev-font-title);font-weight:900;font-size:1.5rem;
  color:var(--ev-orange-18);line-height:1;
}
.ev-camada h3{margin-bottom:4px}
.ev-camada__eco{
  display:block;margin-top:var(--ev-s3);
  font-family:var(--ev-font-title);font-weight:700;font-size:var(--ev-fs-tiny);
  color:var(--ev-blue-mid);
}


/* =========================================================================
   20. ECOSSISTEMA — cartão de marca e tabela de perguntas
   ========================================================================= */
.ev-eco{display:block;text-decoration:none;color:inherit}
.ev-eco__topo{display:flex;align-items:center;justify-content:space-between;gap:var(--ev-s3);margin-bottom:var(--ev-s4)}
.ev-eco__tipo{
  display:block;
  font-family:var(--ev-font-title);font-weight:700;font-size:.62rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ev-faint);
  margin-bottom:6px;
}
.ev-eco__host{
  margin-top:var(--ev-s4);padding-top:var(--ev-s3);
  border-top:var(--ev-border-line);
  font-family:var(--ev-font-title);font-weight:700;font-size:var(--ev-fs-tiny);
  color:var(--ev-blue-mid);word-break:break-word;
}
.ev-eco:hover .ev-eco__host{color:var(--ev-orange-txt)}
.ev-eco--aqui{
  background:linear-gradient(165deg,#fff5ee 0%,#ffece0 100%);
  border:1px solid var(--ev-orange-18);
}
.ev-eco--aqui .ev-eco__host{color:var(--ev-orange-txt)}
.ev-eco__aqui{
  font-family:var(--ev-font-title);font-weight:700;font-size:.58rem;
  letter-spacing:.12em;text-transform:uppercase;
  color:#fff;background:var(--ev-cta-1);
  padding:4px 10px;border-radius:var(--ev-radius-pill);white-space:nowrap;
}

/* ---------- Tabela responsiva ---------- */
.ev-tabela{
  background:#fff;border:var(--ev-border-line);border-radius:var(--ev-radius);
  overflow:hidden;box-shadow:var(--ev-shadow);
}
.ev-tabela table{width:100%;border-collapse:collapse}
.ev-tabela th{
  text-align:left;background:var(--ev-blue-deep);color:#fff;
  font-family:var(--ev-font-title);font-weight:700;font-size:var(--ev-fs-tiny);
  letter-spacing:.1em;text-transform:uppercase;
  padding:var(--ev-s4) var(--ev-s5);
}
.ev-tabela td{
  padding:var(--ev-s4) var(--ev-s5);
  border-top:var(--ev-border-line);
  font-size:var(--ev-fs-small);color:var(--ev-muted);vertical-align:top;
}
.ev-tabela td:first-child{color:var(--ev-ink);font-weight:600}
.ev-tabela td a{font-family:var(--ev-font-title);font-weight:700;color:var(--ev-blue-mid);text-decoration:none}
.ev-tabela td a:hover{color:var(--ev-orange-txt);text-decoration:underline}
.ev-tabela tr.is-aqui{background:var(--ev-bg-warm)}
.ev-tabela tbody tr:hover{background:var(--ev-bg-soft)}
.ev-tabela tr.is-aqui:hover{background:#ffece0}

/* No celular a tabela vira lista */
@media (max-width:719px){
  .ev-tabela thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .ev-tabela tr{display:block;border-top:var(--ev-border-line);padding:var(--ev-s4) var(--ev-s5)}
  .ev-tabela td{display:block;border:none;padding:0}
  .ev-tabela td:first-child{margin-bottom:8px}
  .ev-tabela td:nth-child(2){margin-bottom:4px}
  .ev-tabela td:last-child{font-size:var(--ev-fs-tiny);color:var(--ev-faint);
    text-transform:uppercase;letter-spacing:.08em;font-weight:700}
}