/* ============================================================
   LUGAR KALEMA · estilos do quadro (Kanban + check + arquivos)
   Estende base.css — mesma paleta navy + dourado
   ============================================================ */

/* ============================================================
   HEADER PROFISSIONAL (sobrescreve o hero ornamentado da base)
   ============================================================ */

/* HOME: logo transparente, menor, copy sóbria (sem itálico floreado) */
.hero.home{ background:#FBF8F1; padding:44px 0 38px; }
.hero.home .logo{ width:120px; }
.hero.home .kicker{ font-size:13px; letter-spacing:5px; color:var(--gold-deep); }
.hero.home .sub{ font-family:'Segoe UI',sans-serif; font-style:normal; color:var(--navy);
  font-size:16px; letter-spacing:.2px; max-width:600px; margin:10px auto 0; opacity:.85; }
.hero.home .meta{ color:#9aa6b0; }

/* TOP BAR das páginas internas: barra branca enxuta, cara de app */
.appbar{ background:#fff; border-bottom:1px solid var(--line); position:relative; }
.appbar::after{ content:''; position:absolute; left:0; right:0; bottom:0; height:3px; background:var(--gold); }
.appbar .wrap{ display:flex; align-items:center; gap:16px; padding:14px 28px; }
.appbar .lk{ display:flex; align-items:center; gap:14px; text-decoration:none; }
.appbar img{ width:50px; height:50px; object-fit:contain; }
.appbar .htitle{ font-family:'Playfair'; font-size:21px; color:var(--navy); line-height:1.05; }
.appbar .hsub{ color:var(--muted); font-size:12.5px; letter-spacing:.3px; }
.appbar .spacer{ flex:1; }
.appbar .vb{ font-family:'Cinzel'; letter-spacing:1px; font-size:11px; padding:5px 13px; border-radius:20px; text-transform:uppercase; }
.appbar .vb.intern{ background:var(--gold-bg); color:var(--gold-deep); }
.appbar .vb.extern{ background:#E7EEF5; color:#2E6CA4; }

/* faixa "BASE" — avisa que é esqueleto, sem dados reais ainda */
.ribbon{
  background:repeating-linear-gradient(45deg,var(--gold-bg),var(--gold-bg) 14px,#F0E2C2 14px,#F0E2C2 28px);
  border:1px solid var(--gold-deep); color:var(--gold-deep);
  font-family:'Cinzel'; letter-spacing:1px; font-size:13px; text-align:center;
  padding:10px 16px; border-radius:10px; margin:22px 0 4px;
}
.ribbon b{ color:var(--navy); }

/* ---------- PORTAS (escolha de visão) ---------- */
.doors{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:22px; padding:30px 0 56px; }
.door{ display:block; text-decoration:none; background:var(--card); border:1px solid var(--line);
  border-top:5px solid var(--gold); border-radius:16px; padding:32px 28px; transition:transform .12s, box-shadow .12s; }
.door:hover{ transform:translateY(-4px); box-shadow:0 14px 30px rgba(14,27,42,.14); }
.door .ico{ font-size:34px; line-height:1; }
.door .dname{ font-family:'Playfair'; font-size:27px; color:var(--navy); margin:14px 0 4px; }
.door .ddesc{ color:var(--muted); font-size:15px; }
.door .denter{ font-family:'Cinzel'; letter-spacing:2px; font-size:12px; color:var(--gold-deep); margin-top:16px; text-transform:uppercase; }
.door.client{ border-top-color:#2E6CA4; }
.door.client .denter{ color:#2E6CA4; }

/* ---------- BARRA DE CONTEXTO (quem está vendo) ---------- */
.viewbar{ display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  background:var(--navy2); color:var(--cream); padding:12px 20px; border-radius:10px; margin:22px 0; font-size:14px; }
.viewbar .tag{ font-family:'Cinzel'; letter-spacing:1px; font-size:11px; padding:4px 12px; border-radius:20px; text-transform:uppercase; }
.viewbar .tag.intern{ background:var(--gold); color:var(--navy); }
.viewbar .tag.extern{ background:#2E6CA4; color:#fff; }
.viewbar .sep{ opacity:.4; }

/* ---------- QUADRO KANBAN ---------- */
.frente{ margin:34px 0; }
.frente .ftit{ display:flex; align-items:center; gap:12px; margin-bottom:4px; }
.frente .ftit h3{ font-family:'Playfair'; font-size:24px; color:var(--navy); margin:0; }
.frente .fbrand{ color:var(--muted); font-size:14px; }

.board{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:16px; }
@media(max-width:820px){ .board{ grid-template-columns:1fr; } }

.col{ background:#EFEBE0; border:1px solid var(--line); border-radius:14px; padding:14px 14px 6px; }
.col-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; padding:0 4px; }
.col-head .ct{ font-family:'Cinzel'; letter-spacing:1.5px; font-size:12px; text-transform:uppercase; }
.col-head .cn{ background:#fff; border:1px solid var(--line); border-radius:20px; font-size:12px; padding:1px 9px; color:var(--muted); }
.col.todo  { border-top:4px solid #B9C2CC; }
.col.doing { border-top:4px solid var(--gold); }
.col.done  { border-top:4px solid #2E6B45; }
.col.todo  .ct{ color:#5B6B7A; }
.col.doing .ct{ color:var(--gold-deep); }
.col.done  .ct{ color:#2E6B45; }

/* ---------- CARTÃO DE TAREFA ---------- */
.card{ background:#fff; border:1px solid var(--line); border-left:4px solid var(--gold);
  border-radius:10px; padding:13px 14px; margin-bottom:12px; box-shadow:0 2px 6px rgba(14,27,42,.05); }
.card.placeholder{ opacity:.55; border-left-style:dashed; }
.card .ctitle{ font-size:15px; color:var(--navy); font-weight:600; line-height:1.35; }
.card .cmeta{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:10px; }

/* etiqueta de responsável */
.who{ font-size:11.5px; padding:2px 9px; border-radius:20px; font-weight:600; letter-spacing:.3px; }
.who.mari{ background:#F5E9CF; color:#A87A2E; }
.who.zoe{ background:#E7EEF5; color:#2E6CA4; }
.who.paula{ background:#EFE3F2; color:#7A3E8C; }
.who.manu{ background:#E3EFE6; color:#2E6B45; }
.who.rapha{ background:#FBE7DE; color:#B25A3A; }
.who.cliente{ background:#ECEAE3; color:#5B6B7A; }

/* check de feito */
.check{ display:flex; align-items:center; gap:9px; margin-top:11px; cursor:pointer; user-select:none;
  border-top:1px dashed var(--line); padding-top:10px; }
.check .box{ width:20px; height:20px; border:2px solid var(--gold-deep); border-radius:6px; flex:0 0 auto;
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:13px; transition:.12s; }
.check .lab{ font-size:13px; color:var(--muted); }
.card.checked{ border-left-color:#2E6B45; }
.card.checked .ctitle{ color:var(--muted); text-decoration:line-through; }
.card.checked .check .box{ background:#2E6B45; border-color:#2E6B45; }
.card.checked .check .lab{ color:#2E6B45; font-weight:600; }
.card.checked .check .lab::after{ content:' · feito ✓'; }

/* arquivos no Drive */
.files{ margin-top:10px; display:flex; flex-wrap:wrap; gap:7px; }
.files .file{ display:inline-flex; align-items:center; gap:5px; font-size:12.5px; text-decoration:none;
  background:#F4F1EA; border:1px solid var(--line); border-radius:7px; padding:3px 9px; color:var(--gold-deep); }
.files .file:hover{ background:var(--gold-bg); }
.files .file.empty{ color:#9aa6b0; border-style:dashed; }

/* ---------- INFORMAÇÕES / DÚVIDAS ---------- */
.infos{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px; margin-top:18px; }
.info{ background:var(--card); border:1px solid var(--line); border-radius:12px; padding:20px; }
.info h4{ font-family:'Playfair'; font-size:19px; color:var(--navy); margin-bottom:6px; }
.info p{ font-size:14.5px; color:var(--muted); margin:4px 0; }
.info a{ font-size:14px; }

/* botão voltar */
.topbar{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:18px; }

/* ---------- SUB-NAV DE ABAS (dentro do site do cliente) ---------- */
.tabs{ display:flex; flex-wrap:wrap; gap:6px; margin:22px 0 4px; border-bottom:1px solid var(--line);
  background:transparent; position:static; padding:0; }
.tabs a{ text-decoration:none; font-family:'Cinzel'; letter-spacing:1px; font-size:12px; text-transform:uppercase;
  color:var(--muted); opacity:1; padding:10px 16px; border-bottom:3px solid transparent; }
.tabs a:hover{ color:var(--gold-deep); opacity:1; }
.tabs a.active{ color:var(--navy); border-bottom-color:var(--gold); }
.tabs a.lock{ color:#B9C2CC; }
.tabs a.lock::after{ content:' 🔒'; font-size:10px; }

/* ---------- SEÇÃO TÍTULO ---------- */
.sec{ margin:38px 0; }
.sec > .label{ font-family:'Cinzel'; color:var(--gold-deep); letter-spacing:4px; font-size:13px; }
.sec > h3{ font-family:'Playfair'; font-size:26px; color:var(--navy); margin:6px 0 4px; }
.sec > .lead{ color:var(--muted); font-size:15px; max-width:760px; }

/* ---------- 6 PILARES ---------- */
.pillars{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px; margin-top:18px; }
.pillar{ background:var(--card); border:1px solid var(--line); border-radius:13px; padding:18px; display:flex; gap:14px; }
.pillar .pk{ flex:0 0 auto; width:44px; height:44px; border-radius:11px; background:var(--navy); color:var(--gold);
  font-family:'Playfair'; font-size:24px; display:flex; align-items:center; justify-content:center; }
.pillar .pname{ font-family:'Playfair'; font-size:18px; color:var(--navy); }
.pillar .pess{ font-size:13.5px; color:var(--muted); margin:3px 0 9px; }
.pillar .pstatus{ font-size:12px; color:#9aa6b0; font-style:italic; }

/* ---------- 4 FASES (stepper) ---------- */
.phases{ display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.phase{ flex:1 1 180px; background:var(--card); border:1px solid var(--line); border-top:4px solid var(--line);
  border-radius:12px; padding:16px; position:relative; }
.phase .pnum{ font-family:'Cinzel'; font-size:11px; letter-spacing:1px; color:var(--muted); }
.phase .ptit{ font-family:'Playfair'; font-size:19px; color:var(--navy); margin:4px 0; }
.phase .pdesc{ font-size:13px; color:var(--muted); }
.phase.now{ border-top-color:var(--gold); background:var(--gold-bg); }
.phase.now .pnum{ color:var(--gold-deep); }
.phase.now::after{ content:'você está aqui'; position:absolute; top:12px; right:12px;
  font-family:'Cinzel'; font-size:10px; letter-spacing:.5px; color:var(--gold-deep); }

/* ---------- ANÁLISES ---------- */
.analyses{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:14px; margin-top:18px; }
.analysis{ background:#fff; border:1px solid var(--line); border-left:4px solid var(--gold); border-radius:10px; padding:15px; }
.analysis .an{ font-family:'Playfair'; font-size:17px; color:var(--navy); }
.analysis .ad{ font-size:13px; color:var(--muted); margin:4px 0 9px; }
.analysis .ar{ font-size:12px; color:#9aa6b0; font-style:italic; border-top:1px dashed var(--line); padding-top:8px; }

/* ---------- DECK DE CARTÕES ORGANIZADOS (com cabeçalho) ---------- */
.deck{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:16px; margin-top:18px; }
.dcard{ background:var(--card); border:1px solid var(--line); border-radius:12px; overflow:hidden;
  display:flex; flex-direction:column; box-shadow:0 2px 8px rgba(14,27,42,.05); }
.dcard .dh{ background:var(--navy); color:var(--gold); font-family:'Cinzel'; letter-spacing:1px;
  font-size:11.5px; text-transform:uppercase; padding:11px 16px; }
.dcard .dh.ok{ background:#2E6B45; color:#fff; }
.dcard .dh.no{ background:#9C3B2E; color:#fff; }
.dcard .db{ padding:15px 16px; font-size:14px; color:var(--navy); line-height:1.65; flex:1; }
.dcard .db ul{ list-style:none; margin:0; padding:0; }
.dcard .db li{ padding:6px 0 6px 16px; position:relative; border-bottom:1px solid var(--line); font-size:13.5px; }
.dcard .db li:last-child{ border-bottom:none; }
.dcard .db li::before{ content:'·'; position:absolute; left:3px; color:var(--gold); font-weight:700; }

/* cartões clicáveis (pilares que abrem página) */
a.dcard{ text-decoration:none; transition:transform .12s, box-shadow .12s; }
a.dcard:hover{ transform:translateY(-3px); box-shadow:0 12px 26px rgba(14,27,42,.16); }
.dcard .pk2{ display:inline-flex; width:30px; height:30px; border-radius:8px; background:var(--gold); color:var(--navy);
  font-family:'Playfair'; font-size:18px; align-items:center; justify-content:center; margin-right:8px; vertical-align:middle; }
.dcard .more{ display:block; margin-top:12px; font-family:'Cinzel'; font-size:10.5px; letter-spacing:1px;
  color:var(--gold-deep); text-transform:uppercase; }
.dcard .est{ display:inline-block; font-size:11px; padding:2px 9px; border-radius:20px; margin-top:10px; font-weight:600; }
.est.forte{ background:#E3EFE6; color:#2E6B45; }
.est.medio{ background:#F5E9CF; color:#A87A2E; }
.est.construir{ background:#F3E2DE; color:#9C3B2E; }

/* ---------- BOTÃO GRANDE (CTA) ---------- */
.bigbtn{ display:inline-block; background:var(--navy); color:var(--cream); text-decoration:none;
  font-family:'Cinzel'; letter-spacing:1px; font-size:13px; text-transform:uppercase;
  padding:14px 26px; border-radius:10px; border-bottom:3px solid var(--gold); transition:.12s; }
.bigbtn:hover{ background:var(--navy2); color:#fff; }

/* ---------- CARTÃO DE APRESENTAÇÃO (hero do cliente) ---------- */
.herocard{ display:flex; gap:26px; align-items:center; flex-wrap:wrap; background:var(--card);
  border:1px solid var(--line); border-top:4px solid var(--gold); border-radius:16px; padding:24px; margin:6px 0 18px; }
.herocard img{ width:170px; height:170px; object-fit:cover; border-radius:14px; border:3px solid var(--gold);
  flex:0 0 auto; box-shadow:0 8px 22px rgba(14,27,42,.16); }
.herocard .hi{ flex:1; min-width:250px; }
.herocard .hname{ font-family:'Playfair'; font-size:30px; color:var(--navy); line-height:1.1; }
.herocard .hrole{ color:var(--gold-deep); font-family:'Cinzel'; letter-spacing:2px; font-size:12.5px; text-transform:uppercase; margin:5px 0 12px; }
.herocard .hbio{ color:var(--muted); font-size:15.5px; line-height:1.6; }

/* ---------- LINHA DO TEMPO (história) ---------- */
.timeline{ position:relative; margin:20px 0 4px 8px; padding-left:30px; border-left:2px solid var(--gold-soft); }
.tl{ position:relative; padding:0 0 22px 8px; }
.tl:last-child{ padding-bottom:4px; }
.tl::before{ content:''; position:absolute; left:-39px; top:3px; width:14px; height:14px; border-radius:50%;
  background:var(--gold); border:3px solid var(--cream); box-shadow:0 0 0 1px var(--gold-soft); }
.tl .ty{ font-family:'Cinzel'; color:var(--gold-deep); font-size:12px; letter-spacing:1.5px; text-transform:uppercase; }
.tl .tx{ color:var(--navy); font-size:15.5px; margin-top:3px; line-height:1.55; }

/* ---------- ALINHAMENTO HUMANO / ANTROPOSOFIA ---------- */
.anthro{ background:linear-gradient(180deg,#EFF3F5 0%, var(--card) 100%); border:1px solid var(--line);
  border-left:5px solid #2E6CA4; border-radius:13px; padding:24px; margin-top:18px; }
.anthro h4{ font-family:'Playfair'; font-size:20px; color:var(--navy); }
.anthro .seten{ display:inline-block; background:#fff; border:1px solid var(--line); border-radius:20px;
  padding:5px 14px; font-size:13px; color:#2E6CA4; margin:10px 0; font-weight:600; }
.anthro p{ font-size:14.5px; color:var(--muted); }
.anthro .mari{ font-size:12px; color:#2E6CA4; font-style:italic; margin-top:8px; }