/* ============================================================
   OMIP SA - Base
   Reset, container de layout, lockup do logótipo e botões.
   Partilhado por todas as páginas.
   ============================================================ */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font: var(--body-md);
  color: var(--black);
  background: var(--white);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

a{color:inherit;text-decoration:none}
img,svg{display:block}

.container{
  width:100%;
  max-width:1280px;
  margin:0 auto;
  padding:0 32px;
}
@media (min-width:960px){ .container{padding:0 64px} }

/* --- Lockup do logótipo --- */
/* Uso: <a class="logo"><span class="om">om</span><span class="ip">ip</span></a>
   Variante sobre fundo escuro: adicionar a classe .is-light            */
.logo{
  display:inline-flex; align-items:baseline; gap:0;
  font: 800 28px/1 'Abadi','Inter',sans-serif;
  letter-spacing:-0.02em;
}
.logo .om{ color: var(--grey-green-light); }
.logo .ip{ color: var(--green-500); }
.logo.is-light .om{ color: #ffffff; }
.logo.is-light .ip{ color: var(--green-400); }
.logo .sa-tag{
  margin-left:10px;
  font: 700 11px/1 'Abadi','Inter',sans-serif;
  letter-spacing: 0.16em;
  padding: 5px 8px;
  border: 1px solid var(--green-400);
  color: var(--green-400);
  border-radius: 3px;
  text-transform: uppercase;
  align-self:center;
}

/* --- Botões --- */
/* Base + variantes: .btn-primary | .btn-secondary | .btn-ghost-light
   Modificador de tamanho: .btn-lg                                      */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  font: 600 14px/1 'Abadi','Inter',sans-serif;
  letter-spacing:.01em;
  padding: 8px 8px 8px 20px;
  border-radius: var(--radius-pill);
  border:0; cursor:pointer;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
  white-space:nowrap;
}
.btn .arrow{
  width:28px;height:28px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  transition:transform .2s ease, background .2s ease;
}
.btn .arrow svg{width:14px;height:14px;stroke-width:2}
.btn:hover .arrow{ transform: translate(1px,-1px); }

.btn-primary{
  background: var(--green-500); color:#fff;
}
.btn-primary .arrow{ background: var(--green-700); color:#fff; }
.btn-primary:hover{ background: var(--green-600); }

.btn-secondary{
  background: transparent; color: var(--black);
  border: 1px solid #0000001f;
  padding: 7px 7px 7px 19px;
}
.btn-secondary .arrow{ background: var(--black); color:#fff; }
.btn-secondary:hover{ border-color: var(--black); }

.btn-ghost-light{
  background: transparent; color: #fff;
  border: 1px solid #ffffff3d;
  padding: 7px 7px 7px 19px;
}
.btn-ghost-light .arrow{ background:#fff; color: var(--black); }
.btn-ghost-light:hover{ border-color:#fff; }

.btn-lg{ font-size:15px; padding: 10px 10px 10px 22px; }
.btn-lg .arrow{ width:32px; height:32px; }