/* ============================================================
   COMPONENTES DE PÁGINA — blog, formulário, mídia
   (mesma linguagem visual do GSC)
   ============================================================ */

/* ---------- BLOG ---------- */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.post-card{background:var(--ink);padding:2rem 1.8rem 1.7rem;display:flex;flex-direction:column;gap:.9rem;transition:background .4s;min-height:230px}
.post-card:hover{background:var(--ink-2)}
.post-card-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;font-family:var(--font-mono);font-size:.62rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--bone-dim)}
.post-card h3{font-family:var(--font-display);font-size:1.5rem;font-weight:400;line-height:1.15;color:var(--bone)}
.post-card p{font-size:.94rem;line-height:1.55;color:var(--bone-dim);font-weight:300;flex:1}
.post-card-more{font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--copper-lt);margin-top:.3rem}
.blog-empty{padding:4rem 1.8rem;text-align:center;font-family:var(--font-mono);font-size:.8rem;letter-spacing:.05em;
  color:var(--bone-dim);border:1px dashed var(--line)}

/* Post individual */
.post-head{margin-bottom:2.6rem;padding-bottom:2rem;border-bottom:1px solid var(--line)}
.post-head h1{font-family:var(--font-display);font-size:clamp(2.2rem,6vw,4.4rem);font-weight:300;line-height:1;letter-spacing:-.02em;margin-top:1rem}
.post-body{max-width:70ch}
.post-body h2{font-family:var(--font-display);font-size:1.9rem;font-weight:400;margin:2.4rem 0 1rem;color:var(--bone)}
.post-body h3{font-family:var(--font-display);font-size:1.4rem;font-weight:400;margin:2rem 0 .8rem;color:var(--bone)}
.post-body p{font-size:1.05rem;line-height:1.75;color:var(--bone-dim);margin-bottom:1.3rem}
.post-body a{color:var(--copper-lt);border-bottom:1px solid rgba(208,138,87,.4)}
.post-body a:hover{border-color:var(--copper-lt)}
.post-body blockquote{border-left:2px solid var(--copper);padding:.3rem 0 .3rem 1.6rem;margin:1.8rem 0;
  font-family:var(--font-display);font-style:italic;font-size:1.3rem;color:var(--bone);line-height:1.4}
.post-body ul,.post-body ol{margin:0 0 1.3rem 1.3rem;color:var(--bone-dim);line-height:1.7}
.post-body li{margin-bottom:.5rem}
.post-body img{margin:2rem 0;border:1px solid var(--line)}
.post-body code{font-family:var(--font-mono);font-size:.9em;background:var(--ink-2);padding:.15em .4em;border:1px solid var(--line)}
.post-body hr{border:none;height:1px;background:var(--line);margin:2.6rem 0}

/* ---------- MÍDIA ---------- */
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.media-card{background:var(--ink);padding:1.7rem 1.5rem;display:flex;flex-direction:column;gap:.8rem;transition:background .4s}
.media-card:hover{background:var(--ink-2)}
.media-card .outlet{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--copper-lt)}
.media-card h4{font-family:var(--font-display);font-size:1.3rem;font-weight:400;line-height:1.2;color:var(--bone);flex:1}
.media-card .date{font-family:var(--font-mono);font-size:.66rem;color:var(--bone-dim);letter-spacing:.06em}
.media-card .go{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--bone-dim);transition:color .25s}
.media-card:hover .go{color:var(--copper-lt)}

.embed-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.6rem;margin-top:1.6rem}
.embed{border:1px solid var(--line);background:var(--ink-2);padding:1.2rem}
.embed h5{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--copper-lt);margin-bottom:.9rem}
.embed .frame{position:relative;width:100%;border:1px solid var(--line);background:var(--ink);overflow:hidden}
.embed iframe{display:block;width:100%;border:0}
.embed-note{font-family:var(--font-mono);font-size:.66rem;color:var(--bone-dim);line-height:1.6;margin-top:.8rem}

/* ---------- FORMULÁRIO (contato) ---------- */
.form{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;max-width:720px}
.form .full{grid-column:1 / -1}
@media(max-width:640px){.form{grid-template-columns:1fr}}
.field{display:flex;flex-direction:column;gap:.5rem}
.field label{font-family:var(--font-mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--bone-dim)}
.field label .req{color:var(--copper)}
.field input,.field select,.field textarea{
  font-family:var(--font-body);font-size:.98rem;font-weight:300;color:var(--bone);background:var(--ink-2);
  border:1px solid var(--line);padding:.85rem 1rem;transition:border-color .25s,background .25s;width:100%;border-radius:0}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--copper);background:var(--ink)}
.field textarea{min-height:150px;resize:vertical}
.field select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' stroke='%23C7C0B2' fill='none' stroke-width='1.4'/></svg>");
  background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.4rem}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:var(--oxblood)}
.field .err{font-family:var(--font-mono);font-size:.64rem;color:var(--copper-lt);display:none}
.field.invalid .err{display:block}

.form-toast{margin-top:1.6rem;padding:1.1rem 1.3rem;border:1px solid var(--line);font-family:var(--font-mono);
  font-size:.78rem;letter-spacing:.03em;line-height:1.6;display:none;align-items:flex-start;gap:.7rem}
.form-toast.show{display:flex}
.form-toast.ok{border-color:rgba(201,169,104,.5);background:rgba(201,169,104,.07);color:var(--brass)}
.form-toast.err{border-color:rgba(94,36,34,.7);background:rgba(94,36,34,.14);color:var(--copper-lt)}

/* ---------- LISTA DE TEMAS / TÓPICOS (palestras, atendimentos) ---------- */
.topic-list{border-top:1px solid var(--line)}
.topic{display:flex;gap:1.4rem;align-items:baseline;padding:1.3rem 0;border-bottom:1px solid var(--line)}
.topic .n{font-family:var(--font-mono);font-size:.72rem;color:var(--copper-lt);letter-spacing:.06em;min-width:2.4rem}
.topic .t{font-family:var(--font-display);font-size:1.25rem;font-weight:400;color:var(--bone);line-height:1.3}
.topic .t small{display:block;font-family:var(--font-body);font-size:.92rem;color:var(--bone-dim);font-weight:300;margin-top:.3rem}

/* ---------- CTA band ---------- */
.cta-band{border:1px solid var(--line);background:var(--ink-2);padding:clamp(2.4rem,5vw,3.6rem);display:flex;
  flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.6rem}
.cta-band h3{font-family:var(--font-display);font-size:clamp(1.6rem,3.5vw,2.4rem);font-weight:300;line-height:1.1;max-width:22ch}
.cta-band h3 em{font-style:italic;color:var(--copper-lt)}

/* ---------- Aviso de conformidade (Atendimentos) ---------- */
.compliance{border:1px solid rgba(201,169,104,.35);background:rgba(201,169,104,.05);padding:1.4rem 1.6rem;margin-top:2rem}
.compliance h5{font-family:var(--font-mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--brass);margin-bottom:.7rem}
.compliance p{font-size:.9rem;line-height:1.65;color:var(--bone-dim);font-weight:300}