
*{box-sizing:border-box}
body{margin:0;font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Arial;color:#111;background:#fff}
.wrap{max-width:1200px;margin:0 auto;padding:40px 24px}
section{padding:64px 0;background-size:cover;background-position:center}
.brand{display:block;margin-bottom:16px}
h1{font-size:36px;margin:0 0 12px}
h2{font-size:20px;margin:0 0 24px;color:#444}
p{margin:0 0 16px}
ul{margin:0 0 16px;padding-left:18px}
.cta{
  display:inline-block;padding:12px 18px;border-radius:8px;text-decoration:none;
  font-weight:600;border:1px solid transparent;
  background: var(--cta-bg, transparent); color: var(--cta-fg, #000);
  transition: background-color .15s ease, color .15s ease, transform .02s ease;
}
.cta:hover{
  background: var(--cta-bg-hover, var(--cta-bg, transparent));
  color: var(--cta-fg-hover, var(--cta-fg, #000));
}
.cta:active{ transform: translateY(1px); }

/* ===== Layout padrão (grid) ===== */
.s .wrap{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start;       /* padrão: texto no topo */
}
.s .wrap > .col-text{
  grid-column: 1;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.s .wrap > .img-wrap{
  grid-column: 2;
  align-self: center;
  display:flex;
  justify-content:center;
}
.s .wrap > .img-wrap img{
  max-width:100%;
  height:auto;
  display:block;
  border-radius:12px;
}

/* Inverter com .reverse (imagem à esquerda) */
.s.reverse .wrap > .col-text{ grid-column: 2; }
.s.reverse .wrap > .img-wrap{ grid-column: 1; }

/* ===== Seção 2 usa FLEX para centralização perfeita ===== */
.s2 .wrap{
  display:flex;             /* só a S2 sai do grid */
  align-items:center;       /* centraliza verticalmente img e texto entre si */
  gap:32px;
}
.s2.reverse .wrap{
  flex-direction: row-reverse; /* imagem à esquerda, texto à direita */
}
.s2 .wrap > .col-text,
.s2 .wrap > .img-wrap{
  flex:1 1 0;               /* divide em 2 colunas */
  min-width:0;
}
.s2 .wrap > .img-wrap{
  display:flex;
  justify-content:center;   /* imagem centralizada na coluna */
  align-items:center;
}
.s2 .wrap > .img-wrap img{
  max-width:100%;
  height:auto;
  display:block;
  border-radius:12px;
}

/* ===== Footer ===== */
footer{padding:32px 0;border-top:0;color:#222}
.footer-grid{
  display:grid;
  grid-template-columns: auto 1fr;
  align-items:center;
  gap:16px;
}
.footer-logo img{ display:block; }
.footer-texts{ display:flex; flex-direction:column; gap:6px; }
.footer-meta{font-size:14px;opacity:.9;margin-top:8px;white-space:pre-wrap}

/* ===== Mobile ===== */
@media (max-width: 860px){
  .s .wrap{ grid-template-columns:1fr; }
  .s .wrap > *{ grid-column:1 !important; }
  .s .wrap > .img-wrap{ width:100%; }
  .s .wrap > .img-wrap img{ width:100%; height:auto; }

  /* S2 em flex: empilha os itens */
  .s2 .wrap{ flex-direction:column; align-items:stretch; }
  .s2 .wrap > .img-wrap{ width:100%; }
  .s2 .wrap > .img-wrap img{ width:100%; height:auto; }
}
