/* ==========================================================================
   Andréia Freitas — TALVEZ VOCÊ SE RECONHEÇA
   Consome os tokens de system.css e reaproveita .af-wrap.
   Valores vindos do protótipo aprovado. Sem ícones, cartões, sombra ou
   cantos arredondados.
   ========================================================================== */

/* faixa areia de ponta a ponta */
.af-reconhecer{
  background:var(--areia);
  padding:112px 0;
}
.af-rec{
  display:grid;
  grid-template-columns:4fr 8fr;
  gap:80px;
  align-items:center;
}

.af-rec__eyebrow{
  display:flex;
  align-items:center;
  gap:16px;
  margin:0 0 20px;
  color:var(--gold-text);
  font-family:var(--display);
  font-size:13px;
  font-weight:600;
  letter-spacing:.32em;
  text-transform:uppercase;
}
.af-rec__eyebrow::before{
  content:"";
  width:30px;
  height:1px;
  background:var(--gold);
}

.af-rec__title{
  margin:0;
  font-family:var(--display);
  font-weight:500;
  color:var(--ink);
  font-size:clamp(38px, 3.4vw, 52px);
  line-height:1.1;
  letter-spacing:-.01em;
}
.af-rec__title em{
  color:var(--gold-text);
  font-style:italic;
}

.af-rec__sub{
  margin:24px 0 0;
  font-family:var(--sans);
  font-size:16px;
  line-height:1.7;
  color:var(--text);
  max-width:32ch;
}
.af-rec__begin{
  margin:18px 0 0;
  font-family:var(--display);
  font-style:italic;
  font-weight:500;
  font-size:24px;
  color:var(--ink);
}

/* lista em 2 colunas, numerada 01–06 pelo CSS, com linha dourada fina */
.af-rec__list{
  list-style:none;
  margin:0;
  padding:0;
  counter-reset:rec;
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:48px;
}
.af-rec__list li{
  counter-increment:rec;
  display:flex;
  gap:18px;
  align-items:baseline;
  padding:30px 0;
  border-top:1px solid rgba(181,169,100,.45);
}
.af-rec__list li::before{
  content:counter(rec, decimal-leading-zero);
  flex:none;
  width:22px;
  font-family:var(--sans);
  font-size:11.5px;
  font-weight:500;
  letter-spacing:.12em;
  color:var(--gold-text);
}
.af-rec__list span{
  font-family:var(--display);
  font-size:clamp(20px, 1.75vw, 25px);
  line-height:1.3;
  font-weight:500;
  color:var(--ink);
}

@media (max-width:1023px){
  .af-reconhecer{ padding:88px 0; }
  .af-rec{
    grid-template-columns:1fr;
    gap:40px;
  }
  .af-rec__sub{ max-width:48ch; }
}
@media (max-width:767px){
  .af-reconhecer{ padding:72px 0; }
  .af-rec{ gap:32px; }
  .af-rec__list{ grid-template-columns:1fr; }
  .af-rec__list li{ padding:16px 0; }
  .af-rec__list span{ font-size:19px; }
}
