/* ============================================================
   DOSSIÊ ATAÍDES OLIVEIRA · TOCANTINS 2026
   Override do tema base — acento LARANJA (Partido Novo)
   sobre a base azul-marinho do estado. Carregar por último.
   ============================================================ */

:root {
  /* acento principal → LARANJA NOVO (antes era azul-bandeira) */
  --green:     oklch(0.685 0.185 47);
  --green-dim: oklch(0.685 0.185 47 / 0.17);
  /* secundário permanece ouro; âmbar reaproveitado para alertas */
}

/* marca/brand passa a usar o laranja */
.brand .mark { background: linear-gradient(150deg, var(--green), oklch(0.78 0.15 62)); box-shadow: 0 6px 16px -4px oklch(0.685 0.185 47 / 0.5); }
.brand .mark b { font-family: var(--disp); font-weight: 700; color: #fff; font-size: 17px; }
.brand .who span { color: var(--green); }

/* monograma textual dentro de marcas */
.mono-mark { font-family: var(--disp); font-weight: 700; color: #fff; letter-spacing: -0.02em; }

/* intro: nome em laranja (mantém a faixa tricolor do estado) */
#intro .imark { background: linear-gradient(150deg, var(--green), oklch(0.78 0.15 62)); box-shadow: 0 14px 40px -8px var(--green); }
#intro .iname .ln.l2 b { color: var(--green); }
#intro .isub { color: var(--green); }

/* ============================ DOSSIÊ: status pills ============================ */
.statline { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 0 26px; }
.pill {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.04em;
  padding: 6px 13px; border-radius: 20px; color: var(--ink-2);
  background: var(--surface); border: 1px solid var(--line);
  display: inline-flex; align-items: center; gap: 7px;
}
.pill b { color: var(--ink); font-weight: 600; }
.pill .pd { width: 7px; height: 7px; border-radius: 50%; background: var(--green); }
.pill.warn { background: var(--amber-dim); border-color: oklch(0.78 0.13 62 / 0.4); color: var(--amber); }
.pill.warn .pd { background: var(--amber); }
.pill.gold { background: var(--violet-dim); border-color: oklch(0.865 0.175 95 / 0.4); color: var(--violet); }
.pill.gold .pd { background: var(--violet); }

/* ============================ CRONOLOGIA estendida ============================ */
.chrono { position: relative; margin: 20px 0 12px; padding-left: 4px; }
.chrono::before { content: ""; position: absolute; left: 78px; top: 6px; bottom: 6px; width: 2px; background: var(--line); }
.cevent { position: relative; display: grid; grid-template-columns: 64px 1fr; gap: 28px; padding: 0 0 20px; }
.cevent .cyear {
  font-family: var(--disp); font-weight: 700; font-size: 19px; color: var(--green);
  text-align: right; letter-spacing: -0.01em; padding-top: 1px;
}
.cevent .cbody { position: relative; padding-left: 26px; }
.cevent .cbody::before {
  content: ""; position: absolute; left: -12px; top: 5px; width: 14px; height: 14px;
  border-radius: 50%; background: var(--bg); border: 3px solid var(--green); z-index: 1;
}
.cevent.gold .cyear { color: var(--violet); }
.cevent.gold .cbody::before { border-color: var(--violet); }
.cevent.alert .cyear { color: var(--amber); }
.cevent.alert .cbody::before { border-color: var(--amber); }
.cevent .ctitle { font-family: var(--disp); font-weight: 600; font-size: 15.5px; color: var(--ink); margin-bottom: 3px; line-height: 1.3; }
.cevent .cdesc { font-size: 13.5px; color: var(--ink-3); margin: 0; max-width: 62ch; }
.cevent .ctag { display: inline-block; font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-top: 5px; }
.cevent.gold .ctag { color: var(--violet); }
.cevent.alert .ctag { color: var(--amber); }

/* ============================ TABELA jurídica / fontes ============================ */
.dtable { width: 100%; border-collapse: collapse; margin: 10px 0 22px; font-size: 13.5px; }
.dtable th {
  text-align: left; font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--ink-4); padding: 11px 16px;
  border-bottom: 1px solid var(--line); vertical-align: bottom;
}
.dtable td { padding: 15px 16px; border-bottom: 1px solid var(--line-soft); color: var(--ink-2); vertical-align: top; line-height: 1.55; }
.dtable td.proc { font-family: var(--mono); font-size: 12px; color: var(--ink); white-space: nowrap; }
.dtable tr:hover td { background: var(--surface); }
.badge {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.04em; padding: 4px 10px;
  border-radius: 6px; white-space: nowrap; display: inline-block;
}
.badge.closed { background: var(--green-dim); color: var(--green); border: 1px solid oklch(0.685 0.185 47 / 0.4); }
.badge.open   { background: var(--amber-dim); color: var(--amber); border: 1px solid oklch(0.78 0.13 62 / 0.4); }
.badge.cite   { background: var(--surface-2); color: var(--ink-3); border: 1px solid var(--line); }
.weight { font-family: var(--mono); font-size: 11px; }
.weight.hi { color: var(--green); }
.weight.mid { color: var(--violet); }
.weight.lo { color: var(--ink-4); }

/* ============================ presença digital ============================ */
.channels { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 14px 0 22px; }
.channel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 16px 20px; }
.channel .chead { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.channel .cname { font-family: var(--disp); font-weight: 600; font-size: 15px; color: var(--ink); }
.channel .chandle { font-family: var(--mono); font-size: 11px; color: var(--green); }
.channel .cmetric { font-family: var(--disp); font-weight: 700; font-size: 20px; color: var(--ink); margin-bottom: 2px; letter-spacing: -0.01em; }
.channel .cnote { font-size: 12.5px; color: var(--ink-3); margin: 0; }

/* ============================ medidas / propostas ============================ */
.props { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 12px 0 22px; }
.prop { display: flex; gap: 13px; align-items: flex-start; background: var(--bg-2); border: 1px solid var(--line-soft); border-radius: var(--r); padding: 16px 18px; }
.prop .pi { width: 34px; height: 34px; flex: 0 0 34px; border-radius: 9px; background: var(--green-dim); display: grid; place-items: center; }
.prop .pi svg { width: 17px; height: 17px; }
.prop b { font-family: var(--disp); color: var(--ink); font-size: 14.5px; display: block; margin-bottom: 2px; }
.prop p { font-size: 13px; margin: 0; color: var(--ink-3); }

/* ============================ FASES DE EXECUÇÃO ============================ */
.phases { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 16px 0 22px; }
.phase { position: relative; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 20px 18px; overflow: hidden; }
.phase::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--green); }
.phase .pnum { font-family: var(--mono); font-size: 11px; letter-spacing: 0.12em; color: var(--green); }
.phase .ptime { font-family: var(--mono); font-size: 10px; letter-spacing: 0.06em; color: var(--ink-4); text-transform: uppercase; margin-top: 2px; }
.phase h4 { font-family: var(--disp); font-weight: 700; font-size: 17px; color: var(--ink); margin: 10px 0 7px; letter-spacing: -0.01em; }
.phase p { font-size: 13px; color: var(--ink-3); margin: 0; line-height: 1.55; }
.phase.p2::before { background: var(--violet); } .phase.p2 .pnum { color: var(--violet); }
.phase.p3::before { background: oklch(0.78 0.15 62); } .phase.p3 .pnum { color: oklch(0.82 0.15 62); }
.phase.p4::before { background: var(--amber); } .phase.p4 .pnum { color: var(--amber); }

/* ============================ PIPELINE FLOW ============================ */
.pipeflow { display: flex; align-items: stretch; gap: 0; margin: 18px 0 22px; flex-wrap: wrap; }
.pstep { flex: 1 1 0; min-width: 150px; background: var(--bg-2); border: 1px solid var(--line-soft); border-radius: var(--r); padding: 16px 16px 18px; position: relative; }
.pstep + .pstep { margin-left: 30px; }
.pstep + .pstep::before { content: "→"; position: absolute; left: -23px; top: 50%; transform: translateY(-50%); color: var(--green); font-size: 18px; font-family: var(--mono); }
.pstep .psn { width: 28px; height: 28px; border-radius: 8px; background: var(--green-dim); color: var(--green); display: grid; place-items: center; font-family: var(--mono); font-size: 12px; font-weight: 600; margin-bottom: 10px; }
.pstep b { font-family: var(--disp); color: var(--ink); font-size: 14px; display: block; margin-bottom: 4px; }
.pstep p { font-size: 12px; color: var(--ink-3); margin: 0; line-height: 1.5; }

/* ============================ FORMAT SPEC CARDS ============================ */
.specs { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 14px 0 22px; }
.spec { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 16px 18px; border-left: 3px solid var(--green); }
.spec .stop { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 6px; }
.spec .scode { font-family: var(--mono); font-size: 12px; color: var(--green); font-weight: 600; }
.spec .sdur { font-family: var(--mono); font-size: 11px; color: var(--ink-4); }
.spec h4 { font-family: var(--disp); font-weight: 600; font-size: 15px; color: var(--ink); margin: 0 0 5px; }
.spec p { font-size: 12.5px; color: var(--ink-3); margin: 0; line-height: 1.5; }

/* ============================ retrato na abertura ============================ */
#intro .iphoto {
  width: 168px; height: 168px; margin: 0 auto 24px; border-radius: 50%;
  overflow: hidden; position: relative;
  border: 3px solid oklch(0.685 0.185 47 / 0.55);
  box-shadow: 0 18px 50px -12px oklch(0.685 0.185 47 / 0.55), inset 0 0 0 6px var(--bg);
  opacity: 0; transform: scale(0.85);
  animation: introPhotoIn .8s cubic-bezier(.5,0,.1,1) 1.0s forwards;
}
#intro .iphoto img { width: 100%; height: 100%; object-fit: cover; object-position: center 18%; display: block; }
#intro .iphoto::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  background: linear-gradient(180deg, transparent 55%, oklch(0.685 0.185 47 / 0.22));
}
@keyframes introPhotoIn { to { opacity: 1; transform: scale(1); } }

/* ============================ mosaico de abertura ============================ */
#intro { background: #060f1d; }
#intro .imosaic {
  position: absolute; inset: 0; z-index: 0;
  column-count: 5; column-gap: 7px; padding: 7px; overflow: hidden;
}
#intro .imosaic img {
  width: 100%; display: block; margin-bottom: 7px; border-radius: 7px;
  object-fit: cover; filter: saturate(1.03) contrast(1.02) brightness(0.96);
  opacity: 0; transform: scale(1.05);
  animation: mosFade 1s cubic-bezier(.4,0,.2,1) forwards;
}
@keyframes mosFade { to { opacity: 1; transform: scale(1); } }
#intro .imosaic img:nth-child(1){animation-delay:.02s} #intro .imosaic img:nth-child(2){animation-delay:.06s}
#intro .imosaic img:nth-child(3){animation-delay:.10s} #intro .imosaic img:nth-child(4){animation-delay:.14s}
#intro .imosaic img:nth-child(5){animation-delay:.18s} #intro .imosaic img:nth-child(6){animation-delay:.22s}
#intro .imosaic img:nth-child(7){animation-delay:.26s} #intro .imosaic img:nth-child(8){animation-delay:.30s}
#intro .imosaic img:nth-child(9){animation-delay:.34s} #intro .imosaic img:nth-child(10){animation-delay:.38s}
#intro .imosaic img:nth-child(11){animation-delay:.42s} #intro .imosaic img:nth-child(12){animation-delay:.46s}
#intro .imosaic img:nth-child(n+13){animation-delay:.5s}
#intro .iscrim {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    radial-gradient(ellipse 56% 62% at 50% 50%, rgba(6,15,29,0.52) 0%, rgba(6,15,29,0.80) 46%, rgba(6,15,29,0.96) 100%),
    linear-gradient(180deg, rgba(6,15,29,0.55) 0%, transparent 24% 76%, rgba(6,15,29,0.65) 100%);
}
#intro .center { z-index: 2; }
#intro .center .iphoto {
  box-shadow: 0 22px 60px -10px rgba(0,0,0,0.7), 0 18px 50px -12px oklch(0.685 0.185 47 / 0.5), inset 0 0 0 6px #060f1d;
}
@media (max-width: 1100px) { #intro .imosaic { column-count: 4; } }
@media (max-width: 760px)  { #intro .imosaic { column-count: 3; } }
@media (max-width: 480px)  { #intro .imosaic { column-count: 2; } }

@media (max-width: 860px) {
  #intro .iphoto { width: 132px; height: 132px; }
  .phases, .specs { grid-template-columns: 1fr; }
  .pstep + .pstep { margin-left: 0; margin-top: 26px; }
  .pstep + .pstep::before { content: "↓"; left: 50%; top: -22px; transform: translateX(-50%); }
  .channels, .props { grid-template-columns: 1fr; }
  .chrono::before { left: 54px; }
  .cevent { grid-template-columns: 48px 1fr; gap: 18px; }
  .cevent .cyear { font-size: 16px; }
  .dtable, .dtable thead, .dtable tbody, .dtable th, .dtable td, .dtable tr { display: block; }
  .dtable th { display: none; }
  .dtable td { border-bottom: none; padding: 4px 0; }
  .dtable tr { border-bottom: 1px solid var(--line); padding: 12px 0; display: block; }
}

@media print {
  #intro { display: none !important; }
  .channel, .prop, .cevent .cbody::before { background: #fff !important; }
  .cevent .cyear, .ctitle { color: #111 !important; }
}

/* ============================ CTA de fim de página ============================ */
.page-cta { display: flex; justify-content: center; margin: 46px 0 8px; }
.page-cta a {
  display: inline-flex; align-items: center; gap: 12px;
  font-family: var(--disp); font-weight: 600; font-size: 16px; letter-spacing: 0.01em;
  color: #1b1206; text-decoration: none; cursor: pointer;
  padding: 17px 34px; border-radius: 60px; border: none;
  background: linear-gradient(135deg, var(--green), oklch(0.64 0.17 40));
  box-shadow: 0 12px 32px -8px oklch(0.685 0.185 47 / 0.6), inset 0 1px 0 rgb(255 255 255 / 0.35);
  transition: transform .22s cubic-bezier(.34,1.56,.64,1), box-shadow .22s;
}
.page-cta a:hover { transform: translateY(-3px) scale(1.03); box-shadow: 0 18px 44px -8px oklch(0.685 0.185 47 / 0.7), inset 0 1px 0 rgb(255 255 255 / 0.45); }
.page-cta a:active { transform: translateY(-1px) scale(.99); }
.page-cta a svg { width: 19px; height: 19px; transition: transform .22s; }
.page-cta a:hover svg { transform: translateX(5px); }