:root{
  --parch:#F4EEE1; --parch-deep:#ECE3D1; --surface:#FBF8F1;
  --ink:#2B2620; --ink-soft:#5A5247;
  --navy:#1C2C4C; --navy-soft:#33456B;
  --gold:#B0863A; --gold-deep:#8F6A26;
  --accent:#4A3F73; --accent-deep:#332B53;
  --brick:#9A2E20; --line:#D8CDB8; --line-soft:#E5DCCB;
  --shadow:0 1px 2px rgba(43,38,32,.06), 0 8px 24px rgba(43,38,32,.05);
  --serif:'Spectral', Georgia, 'Times New Roman', serif;
  --display:'Fraunces', Georgia, serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--parch);color:var(--ink);
  font-family:var(--serif);font-size:17px;line-height:1.62;letter-spacing:.002em}
.wrap{max-width:820px;margin:0 auto;padding:0 20px 96px}

/* HERO */
.hero{padding:40px 0 26px;border-bottom:2px solid var(--navy)}
.eyebrow{font-weight:600;text-transform:uppercase;letter-spacing:.16em;font-size:12px;
  color:var(--accent);margin:0 0 14px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.eyebrow .dot{width:6px;height:6px;background:var(--gold);border-radius:50%}
h1{font-family:var(--display);font-weight:600;font-size:clamp(30px,7vw,46px);
  line-height:1.05;margin:0 0 12px;color:var(--navy);letter-spacing:-.01em}
h1 .num{color:var(--gold-deep);font-style:italic;font-weight:500}
.lede{font-size:clamp(16px,2.6vw,18px);color:var(--ink-soft);max-width:62ch;margin:0}
.meta-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}
.tag{font-size:12px;font-weight:600;letter-spacing:.04em;padding:5px 11px;border-radius:999px;
  border:1px solid var(--line);background:var(--surface);color:var(--navy-soft)}
.tag.oral{background:var(--accent);border-color:var(--accent);color:#FBF8F1}

/* ÍNDICE */
nav.toc{margin:26px 0 6px;display:flex;flex-wrap:wrap;gap:7px}
nav.toc a{font-size:13px;text-decoration:none;color:var(--navy-soft);padding:6px 12px;
  border-radius:8px;background:var(--parch-deep);border:1px solid var(--line-soft);transition:all .15s ease}
nav.toc a:hover{background:var(--navy);color:#FBF8F1;border-color:var(--navy)}
.toc-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;
  color:var(--ink-soft);width:100%;margin:8px 0 2px}

/* SEÇÕES */
section{padding-top:42px;scroll-margin-top:14px}
.s-head{display:flex;align-items:baseline;gap:14px;margin:0 0 18px}
.s-num{font-family:var(--display);font-style:italic;font-weight:500;font-size:22px;
  color:var(--gold-deep);flex:none;min-width:34px}
h2{font-family:var(--display);font-weight:600;font-size:clamp(22px,4vw,28px);line-height:1.15;
  margin:0;color:var(--navy);letter-spacing:-.005em}
h3{font-weight:700;font-size:18px;margin:26px 0 8px;color:var(--navy)}
p{margin:0 0 14px}
.art{font-family:var(--display);font-weight:600;font-style:italic;color:var(--accent-deep)}
strong{font-weight:700;color:var(--navy)}
em.k{font-style:normal;font-weight:600;color:var(--brick)}
ul.clean{list-style:none;margin:0 0 14px;padding:0}
ul.clean li{position:relative;padding:5px 0 5px 26px;border-bottom:1px solid var(--line-soft)}
ul.clean li:last-child{border-bottom:none}
ul.clean li::before{content:"";position:absolute;left:4px;top:14px;width:7px;height:7px;
  border:1.5px solid var(--gold);border-radius:50%}
.part-rule{margin:54px 0 0;padding:22px 0 0;border-top:2px solid var(--navy);
  font-family:var(--display);font-weight:600;font-size:15px;color:var(--navy);letter-spacing:.02em}

/* PRIORIDADE ◉ */
.prio{letter-spacing:-2px;margin-right:7px}
.p3{color:var(--brick)} .p2{color:var(--gold-deep)} .p1{color:var(--ink-soft)}

/* CARTÕES SEMÂNTICOS */
.card{background:var(--surface);border:1px solid var(--line);border-radius:12px;
  padding:12px 18px 15px;margin:0 0 18px 10px;position:relative;box-shadow:var(--shadow)}
.card .lbl{position:relative;left:-28px;display:inline-flex;align-items:center;
  max-width:calc(100% + 20px);font-size:10.5px;font-weight:700;text-transform:uppercase;
  letter-spacing:.13em;color:#FBF8F1;padding:6px 13px;border-radius:0 8px 8px 0;
  margin:0 0 10px;box-shadow:0 1px 2px rgba(43,38,32,.18)}
.card .lbl::after{content:"";position:absolute;left:0;bottom:-8px;width:0;height:0;
  border-style:solid;border-width:8px 0 0 10px;border-color:transparent}
.card.concept .lbl{background:var(--accent)} .card.concept .lbl::after{border-top-color:var(--accent-deep)}
.card.exc .lbl{background:var(--brick)} .card.exc .lbl::after{border-top-color:#6E1F15}
.card.pos .lbl{background:var(--gold)} .card.pos .lbl::after{border-top-color:var(--gold-deep)}
.card.div .lbl{background:var(--navy-soft)} .card.div .lbl::after{border-top-color:var(--navy)}
.card p:last-child,.card ul:last-child{margin-bottom:0}
.corrente{padding:8px 0;border-bottom:1px dashed var(--line)}
.corrente:last-child{border-bottom:none}
.corrente b{color:var(--navy)}

/* LINHA DO TEMPO / ASSINATURA */
.timeline{background:var(--navy);border-radius:14px;padding:24px 20px;margin:8px 0 4px;color:#EFE9DC}
.timeline .tt{font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold);margin-bottom:18px}
.tl-step{display:grid;grid-template-columns:84px 1fr;gap:22px;position:relative;padding-bottom:20px}
.tl-step:last-child{padding-bottom:0}
.tl-step::before{content:"";position:absolute;left:95px;top:24px;bottom:-4px;width:2px;
  background:linear-gradient(var(--gold),rgba(176,134,58,.25))}
.tl-step:last-child::before{display:none}
.tl-when{font-family:var(--display);font-weight:600;font-size:15px;color:var(--gold);
  text-align:right;padding-top:1px;padding-right:2px;line-height:1.25}
.tl-dot{position:relative}
.tl-dot::before{content:"";position:absolute;left:-16px;top:5px;width:11px;height:11px;
  background:var(--gold);border-radius:50%;border:2px solid var(--navy);z-index:2}
.tl-body{font-size:15px;line-height:1.5;color:#D9D1C2} .tl-body strong{color:#FBF8F1}
.tl-body .hl{color:var(--gold);font-weight:600}

/* TABELAS */
.jwrap{overflow-x:auto;margin:0 0 8px;border:1px solid var(--line);border-radius:12px}
table.j{border-collapse:collapse;width:100%;min-width:560px;font-size:14.5px}
table.j th{background:var(--navy);color:#EFE9DC;font-weight:600;text-align:left;padding:11px 14px;
  font-size:12px;letter-spacing:.05em;text-transform:uppercase}
table.j td{padding:11px 14px;border-top:1px solid var(--line-soft);vertical-align:top}
table.j tr:nth-child(even) td{background:var(--surface)}
table.j .inf{font-family:var(--display);font-weight:600;color:var(--accent-deep);white-space:nowrap}
table.j .disp{font-size:12.5px;color:var(--ink-soft);white-space:nowrap}

/* CLASSES UTILITÁRIAS */
.lead{font-size:15.5px;color:var(--ink-soft);font-style:italic;margin:0 0 22px;max-width:64ch}
h3.grp{font-family:var(--display);font-weight:600;font-size:15px;color:var(--accent-deep);
  margin:30px 0 12px;padding-bottom:6px;border-bottom:1px solid var(--accent);display:inline-block}

/* FICHA DE RITO / TIPO */
.tipo-ficha{background:var(--surface);border:1px solid var(--line);border-radius:12px;
  margin:0 0 16px;box-shadow:var(--shadow);overflow:hidden}
.tf-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 12px;
  background:var(--navy);padding:12px 18px}
.tf-nome{font-family:var(--display);font-weight:600;font-size:18px;color:#FBF8F1}
.tf-art{font-family:var(--display);font-style:italic;font-weight:500;font-size:15px;color:var(--gold)}
.tf-pena{font-size:12.5px;color:#D9D1C2;margin-left:auto}
.tf-chip{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;
  padding:3px 9px;border-radius:999px;background:var(--gold);color:var(--navy);align-self:center}
.tf-chip.alerta{background:var(--brick);color:#FBF3F0}
dl.tf-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:0 22px;margin:0;padding:8px 18px 14px}
dl.tf-grid>div{padding:8px 0;border-bottom:1px dashed var(--line-soft)}
dl.tf-grid dt{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;
  color:var(--accent-deep);margin:0 0 3px}
dl.tf-grid dd{margin:0;font-size:14.5px;line-height:1.5;color:var(--ink)}
dl.tf-grid dd b{color:var(--navy)}
dl.tf-grid .tf-full{grid-column:1/-1}

/* ARGUIÇÃO ORAL */
.oral-q{border:1px solid var(--line);border-radius:12px;margin:0 0 12px;overflow:hidden;background:var(--surface)}
.oral-q summary{cursor:pointer;list-style:none;padding:15px 18px;display:flex;gap:12px;
  align-items:flex-start;font-weight:600;color:var(--navy)}
.oral-q summary::-webkit-details-marker{display:none}
.oral-q summary .arrow{color:var(--accent);font-weight:700;flex:none;transition:transform .2s ease;font-size:18px}
.oral-q[open] summary .arrow{transform:rotate(90deg)}
.oral-q summary:hover{background:var(--parch-deep)}
.oral-a{padding:2px 18px 17px 42px;color:var(--ink-soft);font-size:15.5px;border-top:1px solid var(--line-soft)}
.oral-a strong{color:var(--navy)}
.oral-a .step{display:block;margin:0 0 7px}

/* PAINEL DE VÉSPERA */
.vespera{background:var(--navy);border-radius:14px;padding:24px 22px;margin:8px 0;color:#EFE9DC}
.vespera h3{color:var(--gold);font-size:12px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 10px}
.vespera ul{list-style:none;margin:0 0 18px;padding:0}
.vespera ul:last-child{margin-bottom:0}
.vespera li{padding:6px 0 6px 22px;position:relative;font-size:15px;color:#D9D1C2;border-bottom:1px solid rgba(255,255,255,.08)}
.vespera li::before{content:"▸";position:absolute;left:2px;color:var(--gold)}
.vespera li b{color:#FBF8F1}

/* PONTE */
.ponte{background:repeating-linear-gradient(135deg,var(--parch-deep),var(--parch-deep) 12px,var(--surface) 12px,var(--surface) 24px);
  border:1px dashed var(--gold);border-radius:12px;padding:18px 20px;margin:6px 0}
.ponte .lbl{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gold-deep);margin-bottom:8px;display:block}

/* RODAPÉ */
.site-footer{margin:48px 0 0;padding:26px 0 8px;border-top:1px solid var(--line);
  text-align:center;color:var(--ink-soft);font-size:13px;line-height:1.7}
.site-footer strong{color:var(--accent-deep);font-family:var(--display)}
.site-footer .fidel{margin-top:14px;font-size:12px;font-style:italic;color:var(--ink-soft);
  max-width:70ch;margin-left:auto;margin-right:auto}

@media (max-width:560px){
  body{font-size:16px} .wrap{padding:0 16px 80px}
  .tl-step{grid-template-columns:62px 1fr;gap:18px} .tl-step::before{left:71px} .tl-dot::before{left:-14px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}