/* ============================================================
   SOBRE
   ============================================================ */
.sobre-grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(2rem,4vw,4.5rem); align-items:start; }
.sobre-fig{ grid-column:1 / span 4; margin:0; position:relative; }
.sobre-fig img{ width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:3px; }
.sobre-corpo{ grid-column:6 / span 7; }
.sobre-nome{ margin-bottom:.4rem; }
.sobre-crp{
  font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--vinho);
  margin:0 0 clamp(2rem,3.4vw,2.8rem);
}
.sobre-aspas{
  font-family:var(--serif); font-style:italic; font-weight:300;
  font-size:clamp(1.25rem,2.1vw,1.7rem); line-height:1.4; color:var(--ameixa);
  border-left:1px solid var(--rosa); padding-left:clamp(1.2rem,2vw,1.8rem);
  margin:0 0 clamp(2rem,3.4vw,2.6rem); max-width:34ch;
}
.sobre-corpo p{ color:var(--tinta-60); }

.formacao{ margin-top:clamp(3rem,5vw,4rem); }
.formacao h3{
  font-family:var(--sans); font-size:.7rem; font-weight:500;
  letter-spacing:.24em; text-transform:uppercase; color:var(--vinho);
  margin-bottom:1.4rem;
}
.formacao ul{ list-style:none; margin:0; padding:0; }
.formacao li{
  padding:1.05rem 0; border-top:1px solid var(--linha);
  display:flex; flex-wrap:wrap; align-items:baseline; gap:.5rem 1rem;
  font-size:1rem; color:var(--ameixa);
}
.formacao li:last-child{ border-bottom:1px solid var(--linha); }
.tag{
  font-size:.63rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--salvia); border:1px solid currentColor; border-radius:100px;
  padding:.2rem .65rem; white-space:nowrap;
}
@media (max-width:900px){
  .sobre-fig{ grid-column:1 / span 6; }
  .sobre-corpo{ grid-column:1 / -1; margin-top:2.5rem; }
}

/* ============================================================
   COMO FUNCIONA
   ============================================================ */
.como{ background:var(--areia-2); }
.como-grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(2rem,4vw,4rem); align-items:start; }
.como-head{ grid-column:1 / span 5; position:sticky; top:8rem; }
.como-passos{ grid-column:7 / span 6; margin:0; padding:0; list-style:none; counter-reset:passo; }
.como-passos li{
  counter-increment:passo; position:relative;
  padding:clamp(1.9rem,3vw,2.4rem) 0 clamp(1.9rem,3vw,2.4rem) clamp(3.2rem,5vw,4.4rem);
  border-top:1px solid var(--linha);
}
.como-passos li:last-child{ border-bottom:1px solid var(--linha); }
.como-passos li::before{
  content:counter(passo,decimal-leading-zero);
  position:absolute; left:0; top:clamp(1.9rem,3vw,2.4rem);
  font-family:var(--serif); font-size:.95rem; color:var(--vinho); letter-spacing:.04em;
}
.como-passos p{ color:var(--tinta-60); margin:.55rem 0 0; }
.como-fig{ grid-column:1 / span 5; margin:clamp(2.5rem,4vw,3.5rem) 0 0; }
.como-fig img{ width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:3px; }
@media (max-width:900px){
  .como-head{ grid-column:1 / -1; position:static; }
  .como-passos{ grid-column:1 / -1; margin-top:2rem; }
  .como-fig{ grid-column:1 / -1; }
}

/* ============================================================
   ONLINE
   ============================================================ */
.online-grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(2rem,4vw,4.5rem); align-items:center; }
.online-fig{ grid-column:1 / span 6; margin:0 0 0 calc(var(--pad) * -1); }
.online-fig img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:0 3px 3px 0; }
.online-corpo{ grid-column:8 / span 5; }
.online-corpo .lead{ margin-top:1.6rem; }
.online-lista{ list-style:none; margin:clamp(2.2rem,3.6vw,3rem) 0 0; padding:0; }
.online-lista li{ padding:1.05rem 0; border-top:1px solid var(--linha); }
.online-lista li:last-child{ border-bottom:1px solid var(--linha); }
.online-lista strong{
  display:block; font-family:var(--sans); font-weight:500; font-size:.94rem; color:var(--ameixa);
  margin-bottom:.15rem;
}
.online-lista span{ font-size:.92rem; color:var(--tinta-60); }
@media (max-width:900px){
  .online-fig{ grid-column:1 / -1; margin-right:calc(var(--pad) * -1); }
  .online-fig img{ border-radius:3px; }
  .online-corpo{ grid-column:1 / -1; }
}

/* ============================================================
   FAQ
   ============================================================ */
.faq-grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(2rem,4vw,4rem); align-items:start; }
.faq-head{ grid-column:1 / span 4; position:sticky; top:8rem; }
.faq-lista{ grid-column:6 / span 7; }
.faq-lista details{ border-top:1px solid var(--linha); }
.faq-lista details:last-of-type{ border-bottom:1px solid var(--linha); }
.faq-lista summary{
  list-style:none; cursor:pointer; position:relative;
  padding:1.5rem 3rem 1.5rem 0;
  font-family:var(--serif); font-size:clamp(1.08rem,1.5vw,1.28rem); font-weight:400;
  color:var(--ameixa); line-height:1.35;
  transition:color .2s var(--ease);
}
.faq-lista summary::-webkit-details-marker{ display:none; }
.faq-lista summary:hover{ color:var(--vinho); }
.faq-lista summary::after{
  content:""; position:absolute; right:.35rem; top:50%; width:11px; height:11px;
  border-right:1px solid var(--vinho); border-bottom:1px solid var(--vinho);
  transform:translateY(-70%) rotate(45deg);
  transition:transform .3s var(--ease);
}
.faq-lista details[open] summary::after{ transform:translateY(-30%) rotate(225deg); }
.faq-resp{ padding:0 clamp(1rem,4vw,4rem) 1.8rem 0; }
.faq-resp p{ color:var(--tinta-60); font-size:.98rem; }
@media (max-width:900px){
  .faq-head{ grid-column:1 / -1; position:static; }
  .faq-lista{ grid-column:1 / -1; }
}

