/* ============================================================
   TechBurn — Sistema visual compartilhado · Quiet Luxury Wellness
   (mesma identidade do reuniao-semana1.html — ver memória
   [[identidade-visual-techburn]]). Reescrito jun/2026: de dark+laranja
   para base clara, paleta terrosa e tipografia serifada.
   Como todas as páginas do hub carregam este arquivo, ele remapeia os
   utilitários Tailwind antigos (ink/brand/slate) para o tema claro.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Marcellus&family=Cormorant+Garamond:ital,wght@0,500;0,600;1,500&family=Inter:wght@300;400;500;600;700;800&display=swap');

:root{
  --offwhite:#F6F4EF; --oat:#ECE7DD; --mushroom:#CBBFB2; --graphite:#23292B;
  --deep-green:#2F3F38; --sage:#5F705F; --clay:#8A6F5D;
  --line:#DDD6C9; --line-soft:#E7E1D6;
  --text:#2B2F2D; --text-2:#6B6F68; --text-3:#9A9B91; --white:#FDFCFA;
  --serif:'Marcellus',serif; --serif2:'Cormorant Garamond',serif; --sans:'Inter',system-ui,sans-serif;
}

/* ---------- base ---------- */
body{ background:var(--offwhite)!important; color:var(--text)!important; font-family:var(--sans); -webkit-font-smoothing:antialiased; }
::selection{ background:var(--deep-green); color:var(--offwhite); }
h1,h2,h3{ font-family:var(--serif)!important; font-weight:400!important; letter-spacing:.012em; color:var(--graphite)!important; }
.font-black,.font-extrabold,.font-bold{ font-weight:500!important; }

/* ---------- remap dos utilitários antigos (hub inteiro) ---------- */
/* fundos */
.bg-ink-bg{ background-color:var(--offwhite)!important; }
.bg-ink-card,.bg-ink-soft{ background-color:var(--white)!important; }
.bg-ink,.bg-ink-bg\/90,.bg-ink-bg\/95,.bg-ink\/90,.bg-ink\/95{ background-color:rgba(246,244,239,.92)!important; }
/* bordas */
.border-ink-border{ border-color:var(--line-soft)!important; }
/* texto */
.text-white{ color:var(--graphite)!important; }
.text-slate-100,.text-slate-200,.text-slate-300,.text-slate-400,.text-slate-500{ color:var(--text-2)!important; }
.text-ink-muted{ color:var(--text-3)!important; }
.text-brand-500{ color:var(--clay)!important; }
.hover\:text-brand-500:hover{ color:var(--deep-green)!important; }
/* acento (era laranja) → verde mineral */
.bg-brand-500{ background-color:var(--deep-green)!important; }
.bg-brand-600,.hover\:bg-brand-600:hover{ background-color:var(--graphite)!important; }
.border-brand-500\/40,.border-brand-500\/60,.hover\:border-brand-500\/60:hover,.hover\:border-brand-500\/40:hover{ border-color:rgba(47,63,56,.35)!important; }
.from-brand-500\/10,.from-brand-500\/5{ --tw-gradient-from:rgba(47,63,56,.07)!important; }
/* botões/badges com fundo de acento mantêm texto claro (vence o text-white) */
.bg-brand-500, a.bg-brand-500, button.bg-brand-500{ color:var(--offwhite)!important; }
.bg-brand-500 *{ color:var(--offwhite)!important; }
/* efeitos antigos */
.gradient-text{ background:none!important; -webkit-text-fill-color:var(--clay)!important; color:var(--clay)!important; font-family:var(--serif); }
.glow-orange{ box-shadow:none!important; }
.card-hover{ transition:transform .25s ease,border-color .25s ease,background .25s ease; }
.card-hover:hover{ transform:translateY(-2px); border-color:rgba(47,63,56,.35); background:var(--white); }

.dot{ width:.5rem; height:.5rem; border-radius:9999px; display:inline-block; }
.kbd{ font-family:ui-monospace,SFMono-Regular,Menlo,monospace; background:var(--oat); border:1px solid var(--line); padding:.05rem .35rem; border-radius:.25rem; font-size:.75rem; color:var(--text); }

/* ---------- tags ---------- */
.tag{ display:inline-flex; align-items:center; gap:.35rem; font-size:.66rem; font-weight:500; text-transform:uppercase; letter-spacing:.16em; padding:.25rem .6rem; border-radius:9999px; border:1px solid; }
.tag-live    { color:var(--deep-green); border-color:rgba(47,63,56,.3); background:rgba(47,63,56,.06); }
.tag-pending { color:var(--clay);       border-color:rgba(138,111,93,.3); background:rgba(138,111,93,.07); }
.tag-soon    { color:var(--text-3);      border-color:var(--line); background:var(--oat); }
.tag-doc     { color:var(--sage);        border-color:rgba(95,112,95,.3); background:rgba(95,112,95,.06); }
.tag-progress{ color:var(--sage);        border-color:rgba(95,112,95,.35); background:rgba(95,112,95,.07); font-variant-numeric:tabular-nums; }
.tag-done    { color:var(--offwhite);    border-color:var(--deep-green); background:var(--deep-green); }

/* ---------- barra de progresso do hub ---------- */
.hub-progress{ height:4px; background:var(--line); border-radius:9999px; overflow:hidden; }
.hub-progress > i{ display:block; height:100%; width:0%; border-radius:9999px;
  background:linear-gradient(90deg,var(--deep-green),var(--sage)); transition:width .4s ease; }
.hub-progress.is-done > i{ background:var(--deep-green); }
.hub-meta{ font-size:.72rem; color:var(--text-3); font-variant-numeric:tabular-nums; }

/* ---------- prose ---------- */
.prose-tb h2{ font-family:var(--serif); font-size:1.7rem; font-weight:400; color:var(--graphite); margin-top:2.5rem; margin-bottom:.75rem; }
.prose-tb h3{ font-family:var(--serif); font-size:1.2rem; font-weight:400; color:var(--graphite); margin-top:1.75rem; margin-bottom:.5rem; }
.prose-tb p { color:var(--text-2); line-height:1.75; margin-bottom:.9rem; }
.prose-tb ul{ list-style:disc; padding-left:1.4rem; color:var(--text-2); margin-bottom:1rem; }
.prose-tb ul li{ margin-bottom:.35rem; }
.prose-tb ol{ list-style:decimal; padding-left:1.4rem; color:var(--text-2); margin-bottom:1rem; }
.prose-tb ol li{ margin-bottom:.35rem; }
.prose-tb strong{ color:var(--graphite); font-weight:600; }
.prose-tb code{ background:var(--oat); border:1px solid var(--line); padding:.05rem .35rem; border-radius:.25rem; font-size:.85em; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; color:var(--clay); }
.prose-tb table{ width:100%; border-collapse:collapse; margin:1rem 0; font-size:.9rem; }
.prose-tb th{ text-align:left; color:var(--graphite); font-weight:600; border-bottom:1px solid var(--line); padding:.6rem .4rem; }
.prose-tb td{ color:var(--text-2); border-bottom:1px solid var(--line-soft); padding:.6rem .4rem; vertical-align:top; }
.prose-tb tr:hover td{ background:var(--oat); }
.prose-tb a{ color:var(--clay); text-decoration:underline; text-underline-offset:3px; }
.prose-tb blockquote{ border-left:3px solid var(--deep-green); background:var(--oat); padding:.8rem 1rem; color:var(--text); margin:1rem 0; border-radius:0 .5rem .5rem 0; }

/* ---------- callout ---------- */
.callout{ border-radius:.75rem; border:1px solid; padding:1rem 1.1rem; margin:1rem 0; }
.callout-title{ font-weight:600; color:var(--graphite); display:flex; align-items:center; gap:.5rem; margin-bottom:.25rem; }
.callout-info   { border-color:rgba(95,112,95,.3); background:rgba(95,112,95,.06); }
.callout-warn   { border-color:rgba(138,111,93,.3); background:rgba(138,111,93,.07); }
.callout-success{ border-color:rgba(47,63,56,.3); background:rgba(47,63,56,.06); }
.callout-brand  { border-color:rgba(47,63,56,.35); background:rgba(47,63,56,.07); }

/* ---------- TOC ---------- */
.toc a{ display:block; padding:.35rem .6rem; border-radius:.4rem; color:var(--text-2); font-size:.85rem; line-height:1.4; }
.toc a:hover{ background:var(--oat); color:var(--graphite); }
.toc a.active{ background:rgba(47,63,56,.07); color:var(--deep-green); border-left:2px solid var(--deep-green); padding-left:calc(.6rem - 2px); }

/* ---------- formulários ---------- */
.field{ display:flex; flex-direction:column; gap:.35rem; }
.field label{ font-size:.85rem; color:var(--text); font-weight:500; }
.field label .req{ color:var(--clay); margin-left:.15rem; }
.field input[type="text"], .field input[type="email"], .field input[type="url"], .field input[type="tel"], .field input[type="number"], .field textarea, .field select{
  background:var(--white); border:1px solid var(--line); border-radius:.6rem; color:var(--text); padding:.65rem .8rem; font-size:.9rem;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.field input:focus, .field textarea:focus, .field select:focus{ outline:none; border-color:var(--deep-green); box-shadow:0 0 0 3px rgba(47,63,56,.08); }
.field textarea{ min-height:6rem; resize:vertical; }
.field .hint{ font-size:.75rem; color:var(--text-3); }
.checkbox-row{ display:flex; align-items:flex-start; gap:.6rem; padding:.6rem .8rem; background:var(--white); border:1px solid var(--line); border-radius:.6rem; cursor:pointer; transition:border-color .15s ease; }
.checkbox-row:hover{ border-color:rgba(47,63,56,.35); }
.checkbox-row input[type="checkbox"], .checkbox-row input[type="radio"]{ margin-top:.15rem; accent-color:var(--deep-green); }
.checkbox-row .lbl{ font-size:.9rem; color:var(--text); }
.checkbox-row .desc{ font-size:.8rem; color:var(--text-3); }

/* ===== Preenchimento compartilhado (_collab.js) ===== */
.collab-au{ font-size:.72rem; color:var(--clay); margin-top:.15rem; font-family:var(--serif2); font-style:italic; }
.collab-au:empty{ display:none; }

.collab-widget{
  position:fixed; right:16px; bottom:16px; z-index:60;
  display:flex; align-items:center; gap:10px;
  background:rgba(253,252,250,.92); backdrop-filter:blur(10px);
  border:1px solid var(--line); border-radius:9999px; padding:7px 10px 7px 13px;
  box-shadow:0 10px 34px -14px rgba(35,41,43,.35);
}
.collab-sync{ display:flex; align-items:center; gap:6px; font-size:.6rem; font-weight:500; letter-spacing:.18em; text-transform:uppercase; color:var(--text-3); white-space:nowrap; }
.collab-dot{ width:8px; height:8px; border-radius:9999px; background:var(--text-3); transition:.3s; }
.collab-sync.ok .collab-dot{ background:var(--deep-green); box-shadow:0 0 0 3px rgba(47,63,56,.15); }
.collab-sync.off .collab-dot{ background:var(--clay); box-shadow:0 0 0 3px rgba(138,111,93,.16); }
.collab-presence{ display:flex; align-items:center; }
.collab-av{ width:26px; height:26px; border-radius:9999px; background:var(--sage); color:var(--white); font-size:.6rem; font-weight:600;
  display:flex; align-items:center; justify-content:center; border:2px solid var(--offwhite); margin-left:-8px; text-transform:uppercase; }
.collab-av:first-child{ margin-left:0; }
.collab-av.me{ background:var(--deep-green); }
.collab-more{ font-size:.6rem; color:var(--text-3); margin-left:6px; }
.collab-me{ display:flex; align-items:center; gap:7px; font-size:.66rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  color:var(--graphite); background:var(--oat); border:1px solid var(--line); border-radius:9999px; padding:6px 12px; cursor:pointer; transition:.2s; }
.collab-me:hover{ border-color:var(--deep-green); }
.collab-me-dot{ width:7px; height:7px; border-radius:9999px; background:var(--deep-green); }

.collab-modal-bg{ position:fixed; inset:0; z-index:80; background:rgba(35,41,43,.45); backdrop-filter:blur(6px);
  display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:.25s; }
.collab-modal-bg.show{ opacity:1; pointer-events:auto; }
.collab-modal{ background:var(--white); border:1px solid var(--line-soft); border-radius:18px; padding:36px 32px; max-width:420px; width:92%;
  text-align:center; box-shadow:0 24px 70px -20px rgba(35,41,43,.3); transform:translateY(8px); transition:.25s; }
.collab-modal-bg.show .collab-modal{ transform:translateY(0); }
.collab-modal-mark{ width:46px; height:46px; border-radius:12px; background:var(--deep-green); display:flex; align-items:center; justify-content:center; margin:0 auto 16px; }
.collab-modal-mark i{ color:var(--offwhite); width:24px; height:24px; }
.collab-modal h3{ font-family:var(--serif); font-size:1.5rem; font-weight:400; color:var(--graphite); margin-bottom:8px; }
.collab-modal p{ font-size:.85rem; color:var(--text-2); line-height:1.6; margin-bottom:22px; }
.collab-modal input{ width:100%; background:var(--offwhite); border:1px solid var(--line); border-radius:10px; color:var(--text);
  padding:13px 15px; font-size:1rem; text-align:center; margin-bottom:16px; }
.collab-modal input:focus{ outline:none; border-color:var(--deep-green); box-shadow:0 0 0 3px rgba(47,63,56,.08); }
.collab-enter{ width:100%; background:var(--deep-green); color:var(--offwhite); font-weight:600; font-size:.8rem; letter-spacing:.04em; text-transform:uppercase; border:none; border-radius:10px; padding:13px; cursor:pointer; transition:.2s; }
.collab-enter:hover{ background:var(--graphite); }