/* topxbr.org · layout F editorial · prefixo lo- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body.lo{margin:0;background:#090F1E;color:#fff;font:400 17px/1.7 Rubik,system-ui,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-wrap:break-word}
.lo img{display:block;max-width:100%;height:auto}
.lo a{color:inherit}
.lo .shell{width:100%;max-width:1160px;margin:0 auto;padding:0 20px}
.lo :focus-visible{outline:3px solid #FF2400;outline-offset:3px}
.lo-dark :focus-visible,.lo-hero :focus-visible,.lo-close :focus-visible,.foot :focus-visible,.top :focus-visible{outline-color:#fff}

/* ---------- cabeçalho ---------- */
.lo .top{background:#090F1E;border-bottom:3px solid #FF2400;position:relative;z-index:5}
.lo .top-in{display:flex;align-items:center;gap:8px 20px;padding-top:10px;padding-bottom:10px;flex-wrap:wrap}
.lo .top-in>a:first-child{display:block;line-height:0;margin-right:auto}
.lo .top nav{display:flex;flex-wrap:wrap;gap:0 4px;order:3;width:100%}
.lo .top nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;font:500 16px/1 Archivo,Rubik,sans-serif;letter-spacing:.02em;text-decoration:none;color:rgba(255,255,255,.88);border-bottom:2px solid transparent}
.lo .top nav a:hover{color:#fff;border-bottom-color:#FF2400}
.lo .top .btn-main{order:2;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 20px;background:#FF2400;color:#fff;font:800 14px/1 Archivo,Rubik,sans-serif;letter-spacing:.07em;text-transform:uppercase;text-decoration:none;border-radius:3px}
.lo .top .btn-main:hover{background:#fff;color:#C21B00}
@media (min-width:900px){
  .lo .top-in{flex-wrap:nowrap;padding-top:12px;padding-bottom:12px}
  .lo .top-in>a:first-child{margin-right:12px}
  .lo .top nav{order:2;width:auto;margin-right:auto}
  .lo .top .btn-main{order:3}
}

/* ---------- hero ---------- */
.lo-hero{position:relative;background:radial-gradient(900px 480px at 88% -10%,rgba(255,36,0,.28),transparent 62%),linear-gradient(180deg,#090F1E 0%,#0d1428 100%);padding:48px 0 64px;overflow:hidden}
.lo-hero-in{display:grid;gap:36px;align-items:center}
.lo-kicker{display:flex;align-items:center;gap:12px;margin:0 0 16px;font:700 13px/1.2 Archivo,Rubik,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#ff7a5c}
.lo-kicker::before{content:"";width:34px;height:3px;background:#FF2400;flex:none}
.lo-hero h1{margin:0 0 20px;font:900 clamp(2rem,6.4vw,3.7rem)/1.04 Archivo,Rubik,sans-serif;letter-spacing:-.025em;text-wrap:balance}
.lo-lead{margin:0 0 8px;font-size:1.1rem;line-height:1.65;color:rgba(255,255,255,.88);max-width:40rem}
.lo-date{margin:18px 0 0;font-size:13.5px;letter-spacing:.03em;color:rgba(255,255,255,.62)}
.lo-hero-fig{margin:0;position:relative}
.lo-hero-fig img{width:100%;border-radius:3px;box-shadow:0 28px 60px rgba(0,0,0,.5)}
.lo-fig-tall{max-width:360px;margin:0 auto;padding:12px 12px 0;background:radial-gradient(circle at 50% 38%,rgba(255,36,0,.42),transparent 66%)}
.lo-fig-tall img{box-shadow:none;border-radius:0;max-height:430px;width:auto;margin:0 auto}
.lo-fig-small{max-width:230px;margin:0 auto}
.lo-fig-small img{box-shadow:none;border-radius:0;filter:drop-shadow(0 18px 24px rgba(0,0,0,.5))}
.lo-hero-pg{padding:40px 0 52px}
.lo-hero-pg h1{font-size:clamp(1.85rem,5.4vw,3rem)}
.lo-hero-doc{padding:40px 0 44px}
.lo-hero-doc .lo-hero-in{gap:24px}
@media (min-width:900px){
  .lo-hero{padding:72px 0 88px}
  .lo-hero-in{grid-template-columns:1.12fr .88fr;gap:56px}
  .lo-hero-pg{padding:56px 0 68px}
  .lo-hero-doc .lo-hero-in{grid-template-columns:1fr auto}
  .lo-hero-doc:not(:has(.lo-hero-fig)) .lo-hero-in{grid-template-columns:1fr}
  .lo-hero-doc .lo-hero-tx{max-width:46rem}
  .lo-fig-tall{max-width:380px}
}

/* ---------- CTA ---------- */
.lo-cta{margin:28px 0 6px}
.lo-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:54px;padding:0 30px;background:#FF2400;color:#fff;text-decoration:none;font:800 16px/1 Archivo,Rubik,sans-serif;letter-spacing:.06em;text-transform:uppercase;border-radius:3px;box-shadow:5px 5px 0 #0E1526;transition:transform .15s,box-shadow .15s}
.lo-btn::after{content:"\2192";font-size:19px;line-height:1}
.lo-btn:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 #0E1526}
.lo-hero .lo-btn,.lo-dark .lo-btn{box-shadow:5px 5px 0 rgba(255,255,255,.88)}
.lo-hero .lo-btn:hover,.lo-dark .lo-btn:hover{box-shadow:7px 7px 0 rgba(255,255,255,.88)}
.lo-ad{margin:14px 0 0;font-size:13px;line-height:1.4;letter-spacing:.02em;color:rgba(255,255,255,.62)}
.lo-light .lo-ad{color:#5a6278}
@media (max-width:480px){.lo-btn{width:100%}}

/* ---------- faixas ---------- */
.lo-band{padding:56px 0}
.lo-light{background:#fff;color:#0E1526}
.lo-dark{background:#111A2B;color:#fff}
.lo .shell.lo-col{max-width:800px}
.lo-tag{display:flex;align-items:center;gap:12px;margin:0 0 12px;font:700 12.5px/1.2 Archivo,Rubik,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#C21B00}
.lo-tag::before{content:"";width:28px;height:3px;background:currentColor;flex:none}
.lo-dark .lo-tag{color:#ff7a5c}
.lo-band h2{margin:0 0 20px;font:800 clamp(1.55rem,4.6vw,2.35rem)/1.12 Archivo,Rubik,sans-serif;letter-spacing:-.02em;text-wrap:balance}
.lo-band p{margin:0 0 18px}
.lo-band p:last-child{margin-bottom:0}
.lo-light a:not(.lo-btn){color:#C21B00;text-decoration-thickness:1.5px;text-underline-offset:3px}
.lo-dark a:not(.lo-btn){color:#ff9a82;text-decoration-thickness:1.5px;text-underline-offset:3px}
.lo-dark p,.lo-dark li{color:rgba(255,255,255,.9)}
@media (min-width:900px){.lo-band{padding:84px 0}}

/* listas */
.lo-list{list-style:none;margin:6px 0 22px;padding:0}
.lo-list li{position:relative;padding:0 0 0 30px;margin:0 0 14px}
.lo-list li::before{content:"";position:absolute;left:2px;top:.62em;width:11px;height:11px;background:#FF2400;transform:rotate(45deg)}
.lo-steps{list-style:none;counter-reset:lo;margin:6px 0 22px;padding:0}
.lo-steps li{counter-increment:lo;position:relative;padding:0 0 0 62px;margin:0 0 20px;min-height:44px}
.lo-steps li::before{content:counter(lo);position:absolute;left:0;top:-2px;width:44px;height:44px;display:grid;place-items:center;background:#0E1526;color:#fff;font:900 22px/1 Archivo,sans-serif;border-radius:3px}
.lo-dark .lo-steps li::before{background:#FF2400}

/* citação */
.lo-quote{margin:34px 0;padding:6px 0 6px 24px;border-left:6px solid #FF2400}
.lo-quote p{margin:0!important;font:800 clamp(1.3rem,4.4vw,1.95rem)/1.22 Archivo,Rubik,sans-serif;letter-spacing:-.015em;color:inherit!important}
@media (min-width:1000px){.lo-quote{margin-left:-60px;margin-right:-60px;padding-left:30px}}

/* modelo de mensagem */
.lo-msg{position:relative;margin:22px 0;padding:46px 22px 22px;background:#F2F4F9;border:1px solid #d6dbe8;border-left:5px solid #0E1526;border-radius:0 3px 3px 0}
.lo-msg::before{content:"Modelo de mensagem";position:absolute;left:22px;top:14px;font:700 12px/1 Archivo,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#C21B00}
.lo-msg p{margin:0!important;font-size:16.5px;line-height:1.65}
.lo-dark .lo-msg{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.2);border-left-color:#FF2400}
.lo-dark .lo-msg::before{color:#ff9a82}

/* tabelas */
.lo-wide{margin:22px 0 24px}
.lo-table{width:100%;border-collapse:collapse;font-size:16px;line-height:1.5}
.lo-table th{padding:12px 14px;text-align:left;font:700 12.5px/1.3 Archivo,sans-serif;letter-spacing:.12em;text-transform:uppercase;background:#0E1526;color:#fff}
.lo-table td{padding:14px;vertical-align:top;border-bottom:1px solid #d6dbe8}
.lo-dark .lo-table th{background:#FF2400}
.lo-dark .lo-table td{border-bottom-color:rgba(255,255,255,.18);background:rgba(255,255,255,.03)}
@media (min-width:1000px){.lo-wide{margin-left:-110px;margin-right:-110px}}
@media (max-width:719px){
  .lo-table,.lo-table tbody,.lo-table tr,.lo-table td{display:block;width:100%}
  .lo-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .lo-table tr{margin:0 0 14px;border:1px solid #d6dbe8;border-top:4px solid #FF2400}
  .lo-dark .lo-table tr{border-color:rgba(255,255,255,.22);border-top-color:#FF2400}
  .lo-table td{border-bottom:0;padding:10px 14px}
  .lo-table td+td{padding-top:0}
  .lo-table td::before{content:attr(data-l);display:block;margin-bottom:2px;font:700 11.5px/1.3 Archivo,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#C21B00}
  .lo-dark .lo-table td::before{color:#ff9a82}
}

/* figuras no texto */
.lo-fig{margin:28px 0}
.lo-fig img{width:100%;border-radius:3px}
@media (min-width:1000px){.lo-fig{margin-left:-60px;margin-right:-60px}}

/* FAQ */
.lo-faq{margin-top:8px;border-top:1px solid rgba(127,135,160,.45)}
.lo-faq details{border-bottom:1px solid rgba(127,135,160,.45)}
.lo-faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:60px;padding:12px 0;cursor:pointer;list-style:none}
.lo-faq summary::-webkit-details-marker{display:none}
.lo-faq h3{margin:0;font:600 1.06rem/1.35 Rubik,sans-serif}
.lo-faq i{flex:none;width:34px;height:34px;display:grid;place-items:center;background:#FF2400;color:#fff;font:700 22px/1 Archivo,sans-serif;font-style:normal;border-radius:3px;transition:transform .2s}
.lo-faq details[open] i{transform:rotate(45deg)}
.lo-faq details p{margin:0 0 18px!important;padding-right:10px}

/* encerramento */
.lo-close{background:linear-gradient(135deg,#B41700 0%,#7d0f00 100%);color:#fff;padding:56px 0}
.lo-close-in{display:grid;gap:28px;align-items:center}
.lo-close-img{width:min(220px,60%);margin:0 auto;filter:drop-shadow(0 18px 24px rgba(0,0,0,.45))}
.lo-close h2{margin:0 0 12px;font:900 clamp(1.7rem,5.2vw,2.7rem)/1.08 Archivo,sans-serif;letter-spacing:-.02em;text-wrap:balance}
.lo-close p{margin:0;color:rgba(255,255,255,.92)}
.lo-close .lo-ad{color:rgba(255,255,255,.8)}
.lo-close .lo-btn{background:#fff;color:#090F1E;box-shadow:5px 5px 0 #090F1E}
.lo-close .lo-btn:hover{box-shadow:7px 7px 0 #090F1E}
.lo-close a:focus-visible{outline-color:#fff}
@media (min-width:800px){
  .lo-close{padding:84px 0}
  .lo-close-in{grid-template-columns:240px 1fr;gap:56px}
  .lo-close-img{width:100%;max-width:240px}
  .lo-close-in>div{max-width:40rem}
}

/* mais no guia */
.lo-related{background:#090F1E;padding:52px 0 60px}
.lo-related h2{margin:0 0 24px;font:800 1.6rem/1.2 Archivo,sans-serif}
.lo-related-list{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.lo-related-list a{display:block;height:100%;padding:18px 18px 20px;background:#111A2B;border-top:3px solid #FF2400;text-decoration:none;color:#fff;min-height:44px}
.lo-related-list b{display:block;font:800 1.1rem/1.2 Archivo,sans-serif;margin-bottom:6px}
.lo-related-list span{display:block;font-size:16px;line-height:1.45;color:rgba(255,255,255,.78)}
.lo-related-list a:hover{background:#18233a}
@media (min-width:640px){.lo-related-list{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.lo-related-list{grid-template-columns:repeat(5,1fr)}}

/* ---------- rodapé ---------- */
.lo .foot{background:#050912;padding:44px 0 52px;border-top:3px solid #FF2400}
.lo .foot-top{display:flex;flex-direction:column;gap:20px;margin-bottom:26px}
.lo .foot-top>a{line-height:0}
.lo .foot nav{display:flex;flex-wrap:wrap;gap:0 6px}
.lo .foot nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px 0 0;color:rgba(255,255,255,.85);text-decoration:none;font:500 16px/1.2 Rubik,sans-serif;border-bottom:1px solid transparent}
.lo .foot nav a:hover{color:#fff;text-decoration:underline}
.lo .foot p{max-width:62rem;margin:0 0 12px;font-size:16px;line-height:1.6;color:rgba(255,255,255,.7)}
.lo .foot p:last-child{color:rgba(255,255,255,.55);font-size:14.5px}
@media (min-width:900px){.lo .foot-top{flex-direction:row;align-items:center;justify-content:space-between}}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.lo-btn,.lo-faq i{transition:none}}