/* /central — #ct-soberania (por que ter o seu) e #ct-modelo (o modelo por dentro).

   Escala e ritmo herdados de css/sistema/*: rótulo em 8u, prosa em 12,5u, h3 em 20u,
   respiro de seção em 86vhu. Quem mexer aqui olha o irmão da /sistema antes. */

/* ================================================================= 02 · SOBERANIA */
.sob__pilares{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  column-gap:calc(16 * var(--u));
  margin-top:calc(86 * var(--vhu));
  border-top:1px solid #E8E8E8;
}
.sob__p{
  padding-top:calc(24 * var(--vhu));
  padding-right:calc(24 * var(--u));
}
.sob__p__n{
  display:block;
  font-size:calc(8 * var(--u));
  color:#B0B0B0;
  margin-bottom:calc(16 * var(--vhu));
}
.sob__p__nome{
  font-size:calc(20 * var(--u));
  line-height:calc(23 * var(--vhu));
  color:#0C0C0C;
  margin-bottom:calc(14 * var(--vhu));
}
.sob__p__texto{
  font-size:calc(12.5 * var(--u));
  line-height:calc(16.5 * var(--vhu));
  color:#3A3A3A;
}

/* ---------------------------------------------------------------- o contraponto
   MESMO peso visual dos pilares, de propósito. A seção argumenta os dois lados, e
   diminuir este bloco transformaria o argumento em concessão de rodapé — que é
   exatamente o que o texto da própria seção diz que não vai fazer. */
.sob__contra{
  margin-top:calc(74 * var(--vhu));
  padding:calc(34 * var(--vhu)) calc(30 * var(--u)) calc(38 * var(--vhu));
  background:#F5F5F5;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  column-gap:calc(16 * var(--u));
}
.sob__contra__t{
  grid-column:1; grid-row:1;
  font-size:calc(8 * var(--u));
  color:#6E6E6E;
}
.sob__contra__i{
  grid-column:2 / span 3; grid-row:1;
  font-size:calc(13 * var(--u));
  line-height:calc(17.4 * var(--vhu));
  color:#2E2E2E;
}
.sob__contra ul{
  grid-column:2 / span 3; grid-row:2;
  margin-top:calc(28 * var(--vhu));
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  column-gap:calc(16 * var(--u));
  row-gap:calc(20 * var(--vhu));
}
.sob__c__n{
  display:block;
  font-size:calc(8 * var(--u));
  color:#0C0C0C;
  margin-bottom:calc(7 * var(--vhu));
}
.sob__c__d{
  display:block;
  font-size:calc(11.5 * var(--u));
  line-height:calc(15 * var(--vhu));
  color:#5A5A5A;
}

/* ================================================================= 03 · O MODELO */
#ct-modelo .mod__ficha{
  margin-top:calc(86 * var(--vhu));
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  column-gap:calc(16 * var(--u));
}
.mod__nome{
  grid-column:1;
  font-size:calc(30 * var(--u));
  line-height:calc(32 * var(--vhu));
  color:#fff;
}
.mod__ficha ul{
  grid-column:2 / span 2;
  border-top:1px solid #222;
}
.mod__ficha li{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:calc(16 * var(--u));
  padding:calc(11 * var(--vhu)) 0;
  border-bottom:1px solid #222;
}
.mod__f__r{font-size:calc(8 * var(--u)); color:#8A8A8A}
.mod__f__v{font-size:calc(12.5 * var(--u)); color:#fff; text-align:right}

/* ---------------------------------------------------------------- os três blocos */
.mod__blocos{
  margin-top:calc(74 * var(--vhu));
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  column-gap:calc(16 * var(--u));
  border-top:1px solid #222;
}
.mod__b{padding:calc(24 * var(--vhu)) calc(24 * var(--u)) 0 0}
.mod__b__t{
  font-size:calc(8 * var(--u));
  line-height:calc(12 * var(--vhu));
  color:#fff;
  margin-bottom:calc(14 * var(--vhu));
}
.mod__b__d{
  font-size:calc(12.5 * var(--u));
  line-height:calc(16.5 * var(--vhu));
  color:#B0B0B0;
}

/* ---------------------------------------------------------------- o que não afirma
   Fio à esquerda, para ler como declaração e não como legenda. É capítulo da página,
   não ressalva: a recusa a prometer número sem medição É o argumento comercial. */
.mod__nao{
  margin-top:calc(74 * var(--vhu));
  padding-left:calc(24 * var(--u));
  border-left:2px solid #fff;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  column-gap:calc(16 * var(--u));
}
.mod__nao__t{
  grid-column:1;
  font-size:calc(8 * var(--u));
  color:#fff;
}
.mod__nao ul{grid-column:2 / span 3}
.mod__nao li{
  position:relative;
  padding:calc(9 * var(--vhu)) 0 calc(9 * var(--vhu)) calc(20 * var(--u));
  font-size:calc(11.5 * var(--u));
  line-height:calc(15 * var(--vhu));
  color:#B0B0B0;
  border-bottom:1px solid #222;
}
.mod__nao li:last-child{border-bottom:0}
.mod__nao li::before{
  content:''; position:absolute; left:calc(3 * var(--u)); top:calc(15 * var(--vhu));
  width:calc(4 * var(--u)); height:calc(4 * var(--u)); border-radius:50%;
  background:#fff;
}

/* ---------------------------------------------------------------- a frota
   Seis modelos numa tabela de quatro colunas. A coluna do papel é a única que precisa de
   largura, e por isso é a que leva o 1fr. */
.mod__frota{
  margin-top:calc(74 * var(--vhu));
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  column-gap:calc(16 * var(--u));
}
.mod__frota__t{grid-column:1; font-size:calc(8 * var(--u)); color:#fff}
.mod__frota__i{
  grid-column:2 / span 3;
  font-size:calc(13 * var(--u)); line-height:calc(17.4 * var(--vhu)); color:#C2C2C2;
}
.mod__frota__tab{grid-column:1 / span 4; margin-top:calc(30 * var(--vhu))}

.mod__fr__hd,
.mod__fr__l{
  display:grid;
  grid-template-columns:calc(220 * var(--u)) 1fr calc(160 * var(--u)) calc(220 * var(--u));
  column-gap:calc(16 * var(--u));
  align-items:baseline;
}
.mod__fr__hd{
  padding-bottom:calc(10 * var(--vhu));
  border-bottom:1px solid #fff;
  font-size:calc(8 * var(--u)); color:#8A8A8A;
}
.mod__fr__l{
  padding:calc(13 * var(--vhu)) 0;
  border-bottom:1px solid #222;
}
.mod__fr__m{font-size:calc(12.5 * var(--u)); line-height:calc(16 * var(--vhu)); color:#fff}
.mod__fr__p{font-size:calc(11.5 * var(--u)); line-height:calc(15 * var(--vhu)); color:#B0B0B0}
.mod__fr__o{font-size:calc(8 * var(--u)); color:#6E6E6E}
.mod__fr__q{font-size:calc(11.5 * var(--u)); line-height:calc(15 * var(--vhu)); color:#B0B0B0}

.mod__frota__r{
  grid-column:2 / span 3;
  margin-top:calc(26 * var(--vhu));
  font-size:calc(12.5 * var(--u)); line-height:calc(16.5 * var(--vhu)); color:#B0B0B0;
}