/* ============================================================
   LANDING — camada de página (prefixo lp-). Só posicionamento no
   grid e ritmo; nenhum valor cru: tudo via tokens do design system.
   Abaixo de 720px todo filho de .grid ocupa 1/-1.
   ============================================================ */

/* ---- capa ---- */
.lp-capa{padding-block:var(--space-6) var(--section-pad);overflow-x:clip} /* a sangria da figura não vaza para o scrollWidth do documento */
.lp-dateline{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-5);border-top:var(--hairline);padding-top:var(--space-3);margin-bottom:var(--space-8)}
.lp-dateline .eyebrow{margin:0}
.lp-dateline-r{font-size:var(--small-size);letter-spacing:var(--caption-track);text-transform:uppercase;font-weight:600;color:var(--text-secondary)}
@media (max-width:479px){.lp-dateline-r{display:none}}
.lp-manchete,.lp-coluna,.lp-capa-figura,.lp-capa-legenda{grid-column:1/-1}
.lp-coluna .btn-primary{width:100%;margin-top:var(--space-5)}
.lp-ghost{padding-inline:0;margin-top:var(--space-3)}
.lp-capa-figura{margin-top:var(--space-6)}
@media (max-width:719px){.lp-capa-figura{margin-inline:calc(-1 * var(--page-margin))}}
.lp-capa-figura .ambient--frame{--ratio:4/5}
.lp-capa-legenda{margin-inline:var(--page-margin)}
@media (min-width:720px){
  .lp-manchete{grid-column:1/10}
  .lp-coluna{grid-column:10/-1;align-self:end}
  .lp-capa-figura{grid-column:3/-1;grid-row:2;margin-top:var(--space-8)}
  .lp-capa-figura .ambient--frame{--ratio:21/9}
  .lp-capa-legenda{grid-column:1/3;grid-row:2;align-self:start;margin:var(--space-8) 0 0;flex-direction:column;border:0;padding:0}
  .lp-capa-legenda p{max-width:16ch}
}

/* ---- 01 território ---- */
.lp-territorio{padding-block:calc(var(--section-pad) * 1.25)}
.lp-prosa,.lp-escada .numeral{grid-column:1/-1}
.lp-prosa h2{margin-bottom:var(--space-5)}
.lp-escada .numeral+.numeral{margin-top:var(--space-6)}
.lp-fonte{margin-top:var(--space-7);color:var(--text-secondary)}
@media (min-width:720px){
  .lp-prosa{grid-column:1/5;grid-row:1/4}
  .lp-escada .lp-num-1{grid-column:5/-1;grid-row:1}
  .lp-escada .lp-num-2{grid-column:5/-1;grid-row:2;margin-top:var(--space-7)}
  .lp-escada .lp-num-3{grid-column:9/-1;grid-row:3;margin-top:var(--space-7)}
}
@media (min-width:1024px){.lp-escada .lp-num-2{grid-column:7/-1}}

/* ---- páginas duplas ---- */
.lp-dupla{padding-block:var(--space-6)}

/* ---- 02 tese ---- */
.lp-tese{padding-block:calc(var(--section-pad) * 1.5)}
.lp-tese .masthead{grid-column:1/-1;max-width:none}
.lp-tese-corpo{margin-top:var(--space-8)}
.lp-verbete,.lp-luz{grid-column:1/-1}
.lp-verbete+.lp-verbete{border-top:1px solid var(--border-inverse);padding-top:var(--space-6)}
.lp-verbete h3{font-size:var(--h2-size);line-height:var(--h2-lh);margin-bottom:var(--space-3)}
.lp-tese-fecho{margin-top:var(--space-7);color:var(--text-inverse-secondary)}
@media (min-width:720px){
  .lp-tese .masthead{grid-column:1/11}
  .lp-verbete:nth-of-type(1){grid-column:1/5}
  .lp-verbete:nth-of-type(2){grid-column:6/10}
  .lp-verbete+.lp-verbete{border:0;padding:0}
  .lp-luz{grid-column:10/-1;align-self:start}
}
@media (max-width:719px){.lp-tese{padding-block:var(--section-pad)}}

/* ---- 03 faixas ---- */
.lp-faixa{padding-block:var(--space-8)}
.lp-faixa-abre h2{margin-bottom:var(--space-8);grid-column:1/-1}
.lp-faixa-rotulo,.lp-faixa-texto,.lp-faixa-lista{grid-column:1/-1}
.lp-faixa-texto h3{font-size:var(--h1-size);line-height:var(--h1-lh);margin-bottom:var(--space-4)}
.lp-faixa-lista{list-style:none;padding:var(--space-4) 0 0;margin:0;border-top:var(--hairline)}
.lp-faixa-lista li{margin-bottom:var(--space-2)}
.surface-dark .lp-faixa-lista{border-top-color:var(--border-inverse)}
@media (min-width:720px){
  .lp-faixa-abre h2{grid-column:1/8}
  .lp-faixa-rotulo{grid-column:1/4}.lp-faixa-texto{grid-column:4/9}.lp-faixa-lista{grid-column:10/-1}
}
@media (max-width:719px){.lp-faixa{padding-block:var(--space-7)}}

/* ---- 04 a casa ---- */
.lp-casa-figura,.lp-casa-texto,.lp-razao{grid-column:1/-1}
.lp-casa-figura .ambient--frame{--ratio:16/9}
.lp-casa-texto h2{margin-bottom:var(--space-5)}
.lp-razao{list-style:none;margin:var(--space-8) 0 0;padding:0}
.lp-razao li{border-top:var(--hairline);padding-block:var(--space-4);display:grid;gap:var(--space-1)}
.lp-razao li:last-child{border-bottom:var(--hairline)}
.lp-razao h4{margin:0}
@media (min-width:720px){
  .lp-casa-figura{grid-column:1/8}.lp-casa-figura .ambient--frame{--ratio:4/3}
  .lp-casa-texto{grid-column:9/-1}
  .lp-razao{grid-column:1/8}
  .lp-razao li{grid-template-columns:2fr 2fr 1fr;gap:var(--space-4);align-items:baseline}
}
@media (max-width:719px){.lp-casa-texto{order:-1}}

/* ---- 05 perguntas ---- */
.lp-faq-titulo,.lp-faq-lista{grid-column:1/-1}
.lp-faq-titulo h2{margin-bottom:var(--space-4)}
@media (min-width:720px){.lp-faq-titulo{grid-column:1/5}.lp-faq-lista{grid-column:6/-1}}
@media (min-width:1024px){.lp-faq-titulo{position:sticky;top:calc(var(--header-h) + var(--space-6));align-self:start}}

/* ---- contracapa ---- */
.lp-convite-titulo,.lp-convite-lead{grid-column:1/-1}
.lp-convite .btn{margin-top:var(--space-6)}
@media (min-width:720px){.lp-convite-titulo{grid-column:1/11}.lp-convite-lead{grid-column:1/7;margin-top:var(--space-6)}}
@media (max-width:719px){.lp-convite .btn{width:100%}}

/* ---- contato ---- */
.lp-contato-texto,.lp-contato-form{grid-column:1/-1}
.lp-contato-texto h2{margin-bottom:var(--space-5)}
.lp-contato-dados{list-style:none;margin:var(--space-6) 0 0;padding:0;font-size:var(--small-size);letter-spacing:var(--caption-track);text-transform:uppercase;font-weight:600}
.lp-contato-dados li{border-top:var(--hairline);padding-block:var(--space-3)}
.lp-contato-dados li:last-child{border-bottom:var(--hairline)}
@media (min-width:720px){.lp-contato-texto{grid-column:1/5}.lp-contato-form{grid-column:6/-1}}

/* ---- rodapé ---- */
.lp-rodape{border-top:1px solid var(--border-inverse)}

/* ---- reveal (movimento único, uma vez por elemento) ---- */
html.js .reveal{opacity:0;transform:translateY(12px);transition:opacity var(--dur-slow) var(--ease-out),transform var(--dur-slow) var(--ease-out);transition-delay:calc(var(--i,0) * 60ms)}
html.js .reveal.is-in{opacity:1;transform:none}
html.js .folio .rule-horizon{transform:scaleX(0);transform-origin:left;transition:transform calc(var(--dur-slow) * 3) var(--ease-out)}
html.js .folio.is-in .rule-horizon{transform:scaleX(1)}
html.js .folio .rule-horizon::before,html.js .folio .rule-horizon::after{opacity:0;transition:opacity var(--dur-base) var(--ease) calc(var(--dur-slow) * 3)}
html.js .folio.is-in .rule-horizon::before,html.js .folio.is-in .rule-horizon::after{opacity:1}
@media (prefers-reduced-motion:reduce){html.js .reveal,html.js .folio .rule-horizon{opacity:1;transform:none}}
