/* BOTÕES — padrão About */
.btn:nth-of-type(1), .btn:nth-of-type(2){ margin-right:16px; }

.btn{
  --btn-bg: var(--navy); --btn-fg:#fff;
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.6rem 1.5rem; border-radius:999px; font-weight:800; letter-spacing:.01em;
  text-decoration:none; background:var(--btn-bg); color:var(--btn-fg);
  box-shadow:0 6px 20px rgba(33,44,101,.18);
  transform:translateY(0);
  transition: transform .15s ease, box-shadow .2s ease, background .2s ease,
              color .2s ease, border-color .2s ease;
  border:2px solid transparent;
}
.btn:hover{ transform: translateY(-1px); box-shadow:0 10px 26px rgba(33,44,101,.24); }

.btn--primary{ --btn-bg: var(--green); --btn-fg:#0f1a3a; font-weight:600; }
.btn--primary:hover{ background:var(--navy); color:var(--green); border-color:var(--navy); }

.btn--ghost{ --btn-bg:transparent; --btn-fg:var(--navy); border-color:var(--navy); box-shadow:none; font-weight:400; }
.btn--ghost:hover{ background:var(--navy); color:#fff; border-color:var(--navy); }

.btn--blue{ --btn-bg:var(--blue); --btn-fg:#fff; font-weight:400; }
.btn--blue:hover{ background:#fff; color:var(--blue); border-color:var(--blue); box-shadow:0 10px 26px rgba(61,118,187,.28); }

.btn--block{ width:100%; }
a.btn:focus-visible{ outline:3px solid var(--blue); outline-offset:2px; }

/* =================== HERO-MIN — tamanhos/linhas (escopo #hero-min) =================== */
#hero-min .btn{ border-radius:999px; }
#hero-min .btn--chip{ padding:.6rem 1.1rem; font-weight:800; }
#hero-min .btn--md{ padding:.95rem 1.25rem; font-size:1.05rem; border-radius:16px; }
#hero-min .btn--block{ display:flex; width:min(100%,640px); }

#hero-min #hero-min-ctas{ display:flex; flex-direction:column; gap:.8rem; }
#hero-min #hero-min-ctas .hero-ctas-row{ display:flex; gap:.6rem; }
#hero-min #hero-min-ctas-sm{ justify-content:flex-start; }
#hero-min #hero-min-ctas-md{ justify-content:center; }
/* ≤920px — botões médios levemente menores (cabem em linha) */
@media (max-width: 920px){
  #hero-min .btn--md{
    font-size: .98rem;
    padding: .85rem 1.1rem;
  }
}

/* ≤720px — permite quebra em 2 linhas com bom espaçamento */
@media (max-width: 720px){
  #hero-min #hero-min-ctas .hero-ctas-row{
    flex-wrap: wrap;
    gap: 8px;
  }
}

/* ≤560px — empilha verticalmente (toque confortável) */
@media (max-width: 560px){
  #hero-min #hero-min-ctas-sm{ flex-direction: column; }
  #hero-min .btn--md{
    width: 100%;
    justify-content: center;
  }
}

/* ≤380px — micro-ajustes finais */
@media (max-width: 380px){
  #hero-min .btn--md{ font-size: .95rem; padding: .8rem 1rem; }
}