/* =========================================================================
   LAYOUT — container, seções, grids
   Três breakpoints. Mobile-first. Nunca adicione um quarto sem motivo forte.
     640px  tablet
     960px  desktop
    1280px  wide
   ========================================================================= */

/* ---------- Container ---------- */
.ev-wrap{
  width:100%;
  max-width:var(--ev-container);
  margin-inline:auto;
  padding-inline:var(--ev-gutter);
}
.ev-wrap--narrow{max-width:900px}
.ev-wrap--text{max-width:var(--ev-container-sm)}

/* ---------- Seção ---------- */
.ev-section{
  position:relative;
  padding-block:var(--ev-section-y);
}
.ev-section--tight{padding-block:calc(var(--ev-section-y) * .58)}
/* Hero só de texto: não precisa da altura de um hero com imagem */
.ev-section--hero-text{padding-block:clamp(44px,6vw,80px)}
.ev-section--flush-top{padding-top:0}
.ev-section--flush-bottom{padding-bottom:0}

.ev-section--soft{background:var(--ev-bg-soft)}
.ev-section--blue{background:var(--ev-bg-blue)}
.ev-section--warm{background:var(--ev-bg-warm)}
.ev-section--deep{background:var(--ev-bg-deep);color:#fff}
.ev-section--gradient{background:var(--ev-bg-gradient)}

/* Cabeçalho de seção */
.ev-section__head{margin-bottom:var(--ev-s7);max-width:64ch}
.ev-section__head--center{max-width:70ch;margin-inline:auto}
.ev-section__head--center{text-align:center}
.ev-section__head--center .ev-eyebrow,
.ev-section__head--center .ev-lead{margin-inline:auto}
.ev-section__head .ev-lead{margin-top:var(--ev-s4)}

/* Faixa de gradiente da marca — topo ou base de seção */
.ev-brandbar{height:5px;background:var(--ev-grad-brand);width:100%}

/* ---------- Grid genérico ---------- */
.ev-grid{display:grid;gap:var(--ev-s5)}
.ev-grid--2,.ev-grid--3,.ev-grid--4{grid-template-columns:1fr}

@media (min-width:640px){
  .ev-grid--2{grid-template-columns:repeat(2,1fr)}
  .ev-grid--3{grid-template-columns:repeat(2,1fr)}
  .ev-grid--4{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:960px){
  .ev-grid{gap:var(--ev-s6)}
  .ev-grid--3{grid-template-columns:repeat(3,1fr)}
  .ev-grid--4{grid-template-columns:repeat(4,1fr)}
}

/* Auto-fit: cartões que se acomodam sozinhos */
.ev-grid--auto{grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr))}
.ev-grid--auto-sm{grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr))}

/* ---------- Split: conteúdo + mídia ---------- */
.ev-split{display:grid;gap:var(--ev-s7);align-items:center}
@media (min-width:960px){
  .ev-split{grid-template-columns:1fr 460px;gap:var(--ev-s8)}
  .ev-split--equal{grid-template-columns:1fr 1fr}
  .ev-split--media-first{grid-template-columns:460px 1fr}
  .ev-split--wide-media{grid-template-columns:1fr 1.15fr}
}
/* No mobile a mídia vem depois do texto, sempre */
.ev-split__media{order:2}
.ev-split__body{order:1}

/* ---------- Stack vertical ---------- */
.ev-stack{display:grid;gap:var(--ev-s4);align-content:start}
.ev-stack--sm{gap:var(--ev-s3)}
.ev-stack--lg{gap:var(--ev-s6)}

/* ---------- Cluster horizontal com quebra ---------- */
.ev-cluster{display:flex;flex-wrap:wrap;gap:var(--ev-s3);align-items:center}
.ev-cluster--lg{gap:var(--ev-s4)}
.ev-cluster--center{justify-content:center}

/* ---------- Ordem e visibilidade ---------- */
.ev-hide-mobile{display:none}
@media (min-width:960px){
  .ev-hide-mobile{display:revert}
  .ev-hide-desktop{display:none}
}

/* ---------- Marca d'água "C" de fundo ---------- */
.ev-watermark{
  position:absolute;pointer-events:none;user-select:none;
  z-index:0;opacity:.07;
  width:min(680px,72vw);aspect-ratio:1;
  right:-12%;top:50%;translate:0 -50%;
}
.ev-watermark--left{right:auto;left:-14%}
.ev-watermark--bottom{top:auto;bottom:-18%;translate:0 0}
.ev-watermark img,.ev-watermark svg{width:100%;height:100%;object-fit:contain}
.ev-section--deep .ev-watermark{opacity:.12}

/* Garante que o conteúdo fique acima da marca d'água */
.ev-section > .ev-wrap{position:relative;z-index:var(--ev-z-base)}

/* ---------- Onda separadora ---------- */
.ev-wave{display:block;width:100%;height:auto;line-height:0}
.ev-wave svg{display:block;width:100%;height:auto}