/* =========================================================================
   Ezer Digital — blog, materiais gratuitos e ferramentas gratuitas
   Base: direção "Destaque + grade" (ref. Orionix) com a organização de portal de conteúdo
   (blog / materiais / ferramentas separados, como os blogs de SaaS).
   Depende de motion.css e site.css (tokens, header, rodapé, .bpill, .bmeta, .bthumb)
   ========================================================================= */
.bl-page{background:var(--paper)}
.wa-float.is-on{transform:none}
.nav a[aria-current="page"]{color:#fff;opacity:1}

/* header: no blog a barra escura fica sempre visível (como depois de rolar na home) */
.bl-page .header{padding-top:10px}
.bl-page .header__bar{height:60px;max-width:min(1120px,calc(100% - 20px));padding-inline:24px 10px}
.bl-page .header__bar::before{opacity:1;transform:none}

/* ---------- barra do blog: temas à esquerda, materiais e ferramentas à direita ---------- */
.bsub{padding-top:92px}
.bsub__bar{display:flex;align-items:center;gap:6px 22px;padding:10px 0;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.bsub__bar::-webkit-scrollbar{display:none}
.bsub__home{flex:none;display:inline-flex;align-items:center;gap:10px;font:600 15px/1 var(--font-display);letter-spacing:-.02em;color:var(--fg);text-decoration:none}
.bsub__home::before{content:"";width:14px;height:3px;border-radius:2px;background:var(--grad);transform:skewX(var(--skew))}
.bsub__temas{display:flex;gap:2px;flex:none}
.bsub__temas a,.bsub__res a{flex:none;padding:9px 12px;border-radius:999px;font:600 13.5px/1 var(--font-body);color:var(--muted);text-decoration:none;white-space:nowrap;transition:background .4s,color .4s}
.bsub__temas a:hover{color:var(--fg);background:color-mix(in oklab,var(--fg) 7%,transparent)}
.bsub__res{display:flex;gap:6px;margin-left:auto;flex:none}
.bsub__res a{display:inline-flex;align-items:center;gap:8px;color:var(--fg);background:color-mix(in oklab,var(--fg) 7%,transparent)}
.bsub__res a:hover{background:color-mix(in oklab,var(--fg) 13%,transparent)}
.bsub__res a[aria-current="page"],.bsub__temas a[aria-current="page"]{background:var(--brand);color:#fff}
.bsub__res svg{width:15px;height:15px}

/* ---------- títulos ---------- */
.bl-h1{margin:0;font:500 clamp(2.2rem,1.3rem + 2.8vw,3.9rem)/1.04 var(--font-display);letter-spacing:-.045em;max-width:20ch}
.bl-lead{margin:18px 0 0;font-size:clamp(1.02rem,.95rem + .35vw,1.18rem);line-height:1.6;color:var(--muted);max-width:52ch}
.bl-sechead{display:flex;align-items:end;justify-content:space-between;gap:16px 40px;flex-wrap:wrap;margin-bottom:clamp(26px,3vw,40px)}
.bl-sechead h2{margin:0;font:500 clamp(1.6rem,1.2rem + 1.4vw,2.5rem)/1.08 var(--font-display);letter-spacing:-.04em}
.bl-sechead p{margin:10px 0 0;color:var(--muted);max-width:52ch;line-height:1.55}
.bl-more{display:inline-flex;align-items:center;gap:8px;font:600 15px/1 var(--font-body);color:var(--hl);text-decoration:none;white-space:nowrap}
.bl-more .ico{width:16px;height:16px;transition:transform .5s var(--ease-out)}
.bl-more:hover .ico{transform:translateX(5px)}

/* ---------- filtro (pílulas) ---------- */
.bl-filter{display:flex;flex-wrap:wrap;gap:8px}
.bl-filter button{border:0;cursor:pointer;padding:.7em 1.1em;border-radius:999px;font:600 14px/1 var(--font-body);color:var(--fg);background:color-mix(in oklab,var(--fg) 6%,transparent);transition:background .4s,color .4s}
.bl-filter button:hover{background:color-mix(in oklab,var(--fg) 12%,transparent)}
.bl-filter button[aria-pressed="true"]{background:var(--night);color:#fff}
.theme-dark .bl-filter button[aria-pressed="true"]{background:#fff;color:var(--night)}
.bl-filter button small{margin-left:.4em;font:500 11px/1 var(--font-mono);opacity:.55}
[data-post].is-hidden{display:none!important}

/* ---------- capa do blog: destaque grande no escuro ---------- */
.blb-hero{padding-bottom:clamp(64px,8vw,100px)}
.blb-hero .bsub__bar{margin-bottom:clamp(40px,5vw,64px)}
.blb-hero__head{display:flex;align-items:end;justify-content:space-between;gap:16px 48px;flex-wrap:wrap;margin-bottom:clamp(30px,4vw,48px)}
.blb-hero__head .bl-lead{margin:0;max-width:40ch}
.blb-feat{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(12px,1.4vw,18px);border-radius:calc(var(--radius) + 10px);background:var(--surface);text-decoration:none;color:#fff}
.blb-feat .bthumb{border-radius:var(--radius)}
.blb-feat__txt{padding:12px clamp(4px,2vw,28px) 12px 0}
.blb-feat h2{margin:18px 0 0;font:500 clamp(1.6rem,1.2rem + 1.5vw,2.5rem)/1.08 var(--font-display);letter-spacing:-.04em;max-width:18ch}
.blb-feat p{margin:16px 0 0;color:var(--muted);line-height:1.65;max-width:44ch}
.blb-by{display:flex;align-items:center;gap:12px;margin-top:24px;font-size:14px;color:#C9D2EC}
.blb-by img{width:40px;height:40px;padding:8px;border-radius:50%;background:rgba(255,255,255,.08);object-fit:contain}
.blb-by small{display:block;font:500 12px/1.3 var(--font-mono);color:var(--faint)}

/* ---------- grade de posts ---------- */
.bl-sec{padding:clamp(64px,8vw,110px) 0}
.bl-sec--white{--bg:#fff}
.blb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(36px,4vw,52px) clamp(20px,2.4vw,32px)}
.blb-card{display:grid;align-content:start;gap:14px;text-decoration:none;color:inherit}
.blb-card h3{margin:0;font:500 1.28rem/1.22 var(--font-display);letter-spacing:-.025em;transition:color .4s}
.blb-card:hover h3{color:var(--hl)}
.blb-card p{margin:0;color:var(--muted);font-size:15px;line-height:1.6}
.blb-grid-sec .bl-filter{margin-bottom:clamp(30px,4vw,44px)}

/* ---------- materiais e ferramentas: capa, tipo, título e "Baixar grátis" ---------- */
.bmat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(32px,4vw,48px) clamp(20px,2.4vw,32px)}
.bmat-grid--4{grid-template-columns:repeat(4,1fr)}
.bmat{display:grid;align-content:start;gap:12px;text-decoration:none;color:inherit}
.bmat__type{justify-self:start;font:500 11.5px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--hl)}
.bmat h3{margin:0;font:500 1.2rem/1.25 var(--font-display);letter-spacing:-.02em;transition:color .4s}
.bmat p{margin:0;color:var(--muted);font-size:14.5px;line-height:1.55}
.bmat__go{display:inline-flex;align-items:center;gap:8px;margin-top:2px;font:600 14.5px/1 var(--font-body);color:var(--hl)}
.bmat__go .ico{width:15px;height:15px;transition:transform .5s var(--ease-out)}
.bmat:hover h3{color:var(--hl)}
.bmat:hover .bmat__go .ico{transform:translateX(5px)}
.bmat[data-post].is-hidden{display:none!important}

/* ---------- topo das páginas de materiais e ferramentas ---------- */
.bres-hero{padding-bottom:clamp(48px,6vw,72px)}
.bres-hero .bsub__bar{margin-bottom:clamp(40px,5vw,64px)}
.bres-hero__grid{display:grid;grid-template-columns:1.1fr 1fr;gap:28px 64px;align-items:end}
.bres-facts{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.bres-facts span{padding:.65em 1em;border-radius:999px;font:600 13.5px/1 var(--font-body);background:color-mix(in oklab,var(--fg) 7%,transparent)}

/* ---------- página do material (cadastro) ---------- */
.bm{padding-bottom:clamp(72px,9vw,120px)}
.bm .bsub__bar{margin-bottom:clamp(36px,4.5vw,56px)}
.bm__grid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(32px,5vw,72px);align-items:start}
.bm__type{display:inline-block;margin-bottom:16px}
.bm__learn{margin:30px 0 0;padding:0;list-style:none;display:grid;gap:12px}
.bm__learn li{display:flex;gap:12px;line-height:1.55}
.bm__learn li::before{content:"";flex:none;width:14px;height:3px;margin-top:.7em;border-radius:2px;background:var(--grad);transform:skewX(var(--skew))}
.bm__facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.bm__facts span{padding:.6em .95em;border-radius:999px;font:600 13px/1 var(--font-body);background:#fff}
.bm__side{position:sticky;top:96px;display:grid;gap:16px}
.bm__side .bthumb{border-radius:var(--radius)}
.bm-form{display:grid;gap:14px;padding:clamp(22px,2.6vw,30px);border-radius:var(--radius);background:#fff;box-shadow:0 30px 60px -40px rgba(10,14,30,.35)}
.bm-form h2{margin:0;font:500 1.35rem/1.2 var(--font-display);letter-spacing:-.025em}
.bm-form > p{margin:-6px 0 4px;color:var(--muted);font-size:14.5px;line-height:1.5}
.bm-form label{display:grid;gap:6px;font:600 13.5px/1.2 var(--font-body)}
.bm-form input{width:100%;padding:13px 14px;border:1.5px solid rgba(10,14,30,.12);border-radius:12px;font:500 15px/1.2 var(--font-body);background:var(--paper);color:var(--fg);transition:border-color .3s,background .3s}
.bm-form input:focus{outline:0;border-color:var(--brand);background:#fff}
.bm-form .is-bad input{border-color:#D64545}
.bm-form__err{display:none;margin:0;color:#C43B3B;font-size:13.5px}
.bm-form.has-error .bm-form__err{display:block}
.bm-form .btn{justify-self:stretch;justify-content:center;margin-top:4px}
.bm-form small{color:var(--faint);font-size:12.5px;line-height:1.45}
.bm-done{display:grid;gap:12px;padding:clamp(22px,2.6vw,30px);border-radius:var(--radius);background:#fff}
.bm-done[hidden]{display:none}
.bm-done b{font:500 1.35rem/1.2 var(--font-display);letter-spacing:-.025em}
.bm-done p{margin:0;color:var(--muted);line-height:1.55}
.bm-done a{color:var(--brand);font-weight:600}

/* ---------- material dentro do post (coluna do sumário) ---------- */
.bp-mat{display:grid;gap:10px;margin-top:28px;padding:14px;border-radius:18px;background:#fff;text-decoration:none;color:inherit}
.bp-mat .bthumb{border-radius:12px}
.bp-mat b{font:500 1rem/1.25 var(--font-display);letter-spacing:-.02em}
.bp-mat .bmat__go{font-size:13.5px}

@media (max-width:1100px){.bmat-grid--4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:1000px){
  .blb-feat{grid-template-columns:1fr}
  .blb-feat__txt{padding:4px 8px 12px}
  .blb-grid,.bmat-grid{grid-template-columns:1fr 1fr}
  .bres-hero__grid,.bm__grid{grid-template-columns:1fr}
  .bres-facts{justify-content:flex-start}
  .bm__side{position:static}
  .bsub__temas{display:none}
}
@media (max-width:640px){
  .blb-grid,.bmat-grid,.bmat-grid--4{grid-template-columns:1fr}
  .bsub__res a{padding:9px 11px;font-size:13px}
}

/* =========================================================================
   POST
   ========================================================================= */
.bp-top{padding:clamp(130px,14vw,170px) 0 clamp(36px,4vw,52px)}
.bp-crumb{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px;padding:0;list-style:none;font:500 12.5px/1.3 var(--font-mono);color:var(--faint)}
.bp-crumb li + li::before{content:"/";margin-right:8px;opacity:.6}
.bp-crumb a{color:var(--muted);text-decoration:none}
.bp-crumb a:hover{color:var(--brand)}
.bp-top .bl-h1{max-width:20ch;margin-top:18px}
.bp-by{display:flex;align-items:center;flex-wrap:wrap;gap:14px 28px;margin-top:30px;font-size:14px;color:var(--muted)}
.bp-by__who{display:flex;align-items:center;gap:12px;color:var(--fg)}
.bp-by__who img{width:42px;height:42px;padding:9px;border-radius:50%;background:#fff;object-fit:contain}
.bp-by__who b{display:block;font:600 15px/1.2 var(--font-body)}
.bp-by__who small{color:var(--muted);font-size:13px}
.bp-cover{margin:0 0 clamp(40px,5vw,64px)}
.bp-cover img{display:block;width:100%;height:auto;aspect-ratio:16/9;max-height:620px;object-fit:cover;border-radius:var(--radius)}
.bp-body{display:grid;grid-template-columns:240px minmax(0,1fr);gap:clamp(32px,6vw,88px);align-items:start;padding-bottom:clamp(72px,9vw,120px)}
.bp-toc{position:sticky;top:120px;display:grid;gap:4px}
.bp-toc p{margin:0 0 10px;font:500 12px/1 var(--font-mono);color:var(--faint)}
.bp-toc a{padding:8px 0 8px 14px;border-left:2px solid var(--line);color:var(--muted);text-decoration:none;font-size:14px;line-height:1.4;transition:color .3s,border-color .3s}
.bp-toc a:hover,.bp-toc a.is-on{color:var(--fg);border-color:var(--brand)}
.bp-art{max-width:70ch;font-size:clamp(1.02rem,.98rem + .2vw,1.12rem);line-height:1.75;color:#262B40}
.bp-art > * + *{margin-top:1.1em}
.bp-art h2{margin-top:2.2em;font:500 clamp(1.5rem,1.25rem + .9vw,2.05rem)/1.15 var(--font-display);letter-spacing:-.03em;color:var(--fg);scroll-margin-top:110px}
.bp-art h2 + p{margin-top:.8em}
.bp-art p{margin-bottom:0}
.bp-art ul,.bp-art ol{padding-left:1.2em}
.bp-art li + li{margin-top:.45em}
.bp-art li::marker{color:var(--brand)}
.bp-art strong{color:var(--fg)}
.bp-art a:not(.btn){color:var(--brand)}
.bp-short{margin:0;padding:24px 26px;border-radius:18px;background:#fff;box-shadow:inset 3px 0 0 var(--brand)}
.bp-short span{display:block;margin-bottom:8px;font:500 12px/1 var(--font-mono);color:var(--brand)}
.bp-short p{margin:0;color:var(--fg)}
.bp-table{width:100%;border-collapse:collapse;font-size:.95em;line-height:1.45}
.bp-table th,.bp-table td{padding:14px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.bp-table th{font:500 12px/1.3 var(--font-mono);color:var(--faint)}
.bp-table td:first-child{font-weight:600;color:var(--fg)}
.bp-table-wrap{overflow-x:auto}
.bp-real{padding:28px;border-radius:var(--radius);color:#fff;background:radial-gradient(ellipse 60% 120% at 0% 0%,rgba(42,111,219,.4),transparent 70%),var(--night)}
.bp-real span{display:block;margin-bottom:10px;font:500 12px/1 var(--font-mono);color:#9FC1FF}
.bp-real p{margin:0;color:#C9D2EC}
.bp-real p + p{margin-top:.8em}
.bp-real strong{color:#fff}
.bp-faq{display:grid;border-top:1px solid var(--line)}
.bp-faq details{border-bottom:1px solid var(--line)}
.bp-faq summary{display:flex;justify-content:space-between;gap:16px;padding:18px 0;cursor:pointer;list-style:none;font:600 1.02rem/1.35 var(--font-body);color:var(--fg)}
.bp-faq summary::-webkit-details-marker{display:none}
.bp-faq summary::after{content:"+";font:400 1.4rem/1 var(--font-display);color:var(--brand);transition:transform .4s var(--ease-out)}
.bp-faq details[open] summary::after{transform:rotate(45deg)}
.bp-faq details p{margin:0 0 18px;color:var(--muted)}
.bp-cta{display:grid;grid-template-columns:1fr auto;gap:20px 32px;align-items:center;margin-top:2.4em!important;padding:clamp(26px,3vw,36px);border-radius:var(--radius);background:#fff}
.bp-cta h3{margin:0;font:500 clamp(1.3rem,1.1rem + .6vw,1.7rem)/1.15 var(--font-display);letter-spacing:-.03em;color:var(--fg)}
.bp-cta p{margin:8px 0 0;color:var(--muted);font-size:.95em}
.bp-rel{padding:clamp(72px,9vw,120px) 0}
.bp-rel__head{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:clamp(32px,4vw,48px)}
.bp-rel__head .h2{margin:0}
@media (max-width:1000px){
  .bp-body{grid-template-columns:1fr}
  .bp-toc{position:static;padding:18px 20px;border-radius:18px;background:#fff}

  .bp-cta{grid-template-columns:1fr}
}

/* post: barra do blog no topo, coluna com sumário + material do tema */
.bp-top.bsub{padding:92px 0 clamp(32px,4vw,48px)}
.bp-top .bsub__bar,.bm .bp-crumb{margin-bottom:28px}
.bp-side{position:sticky;top:96px}
.bp-side .bp-toc{position:static}
@media (max-width:1000px){.bp-side{position:static}.bp-side .bp-mat{display:none}}
@media (max-width:640px){.bsub__x{display:none}}

/* =========================================================================
   Ferramentas gratuitas (gerador de link, diagnóstico, política de trocas, precificação)
   ========================================================================= */
.tl-hero{padding-bottom:clamp(64px,8vw,110px)}
.tl-hero .bsub__bar{margin-bottom:28px}
.tl-head{max-width:760px;margin-bottom:clamp(28px,3.5vw,44px)}
.tl-head .bpill{margin-bottom:16px}
.tl{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(18px,2.4vw,28px);align-items:start}
.tl-form{display:grid;gap:22px;padding:clamp(22px,2.8vw,34px);border-radius:var(--radius);background:#fff;box-shadow:0 30px 60px -44px rgba(10,14,30,.35);margin:0}
.tl-step{display:grid;gap:14px;margin:0;padding:0;border:0;min-width:0}
.tl-step + .tl-step{padding-top:22px;border-top:1px solid var(--line)}
.tl-step legend{display:flex;align-items:center;gap:10px;padding:0;margin-bottom:2px;font:500 1.12rem/1.25 var(--font-display);letter-spacing:-.02em;color:var(--fg)}
.tl-step legend b{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--brand);color:#fff;font:600 13px/1 var(--font-mono)}
.tl-step > p{margin:-4px 0 2px;color:var(--muted);font-size:14.5px;line-height:1.5}
.tl-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.tl-field{display:grid;gap:6px;font:600 13.5px/1.25 var(--font-body);color:var(--fg)}
.tl-field small{font-weight:500;color:var(--faint)}
.tl-in{display:flex;align-items:center;border:1.5px solid rgba(10,14,30,.12);border-radius:12px;background:var(--paper);transition:border-color .3s,background .3s}
.tl-in:focus-within{border-color:var(--brand);background:#fff}
.tl-in i{padding:0 0 0 13px;font:500 14px/1 var(--font-mono);font-style:normal;color:var(--faint)}
.tl-in i:last-child{padding:0 13px 0 0}
.tl-in input,.tl-in select,.tl-in textarea{flex:1;min-width:0;width:100%;padding:13px;border:0;background:transparent;font:500 15px/1.3 var(--font-body);color:var(--fg);outline:0}
.tl-in textarea{min-height:92px;resize:vertical;line-height:1.5}
.tl-in select{appearance:none;cursor:pointer;padding-right:36px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238189A5' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center/16px}
.tl-field.is-bad .tl-in{border-color:#D64545}
.tl-seg{display:flex;flex-wrap:wrap;gap:6px;padding:5px;border-radius:14px;background:var(--paper)}
.tl-seg button{flex:1 1 auto;padding:11px 14px;border:0;border-radius:10px;background:transparent;font:600 14px/1.2 var(--font-body);color:var(--muted);cursor:pointer;transition:background .4s var(--ease-out),color .4s}
.tl-seg button[aria-pressed="true"]{background:#fff;color:var(--fg);box-shadow:0 6px 16px -10px rgba(10,14,30,.4)}
.tl-chips{display:flex;flex-wrap:wrap;gap:8px}
.tl-chips button{padding:8px 12px;border:1.5px solid var(--line);border-radius:999px;background:#fff;font:500 13px/1.25 var(--font-body);color:var(--muted);cursor:pointer;text-align:left;transition:border-color .3s,color .3s}
.tl-chips button:hover{border-color:var(--brand);color:var(--brand)}
.tl-checks{display:grid;gap:8px}
.tl-checks label{display:flex;align-items:center;gap:10px;font:500 14.5px/1.35 var(--font-body);color:var(--fg);cursor:pointer}
.tl-checks input{width:18px;height:18px;accent-color:var(--brand)}
.tl-tip{margin:0;padding:14px 16px;border-radius:12px;background:#EEF3FF;color:var(--muted);font-size:13.5px;line-height:1.55}
.tl-tip b{color:var(--fg)}

.tl-out{position:sticky;top:110px;display:grid;gap:16px;padding:clamp(22px,2.8vw,34px);border-radius:var(--radius);color:#fff;
  background:radial-gradient(ellipse 70% 60% at 100% 0%,rgba(42,111,219,.38),transparent 70%),var(--night)}
.tl-out__lab{font:500 12.5px/1.2 var(--font-mono);color:#A8B1CC}
.tl-big{display:block;font:500 clamp(2.4rem,1.8rem + 2.4vw,3.6rem)/1 var(--font-display);letter-spacing:-.04em}
.tl-out p{margin:0;color:#A8B1CC;font-size:14.5px;line-height:1.55}
.tl-out p b{color:#fff}
.tl-out .is-warn{color:#FFB4A8}
.tl-bar{display:flex;height:14px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.08)}
.tl-bar span{height:100%;transition:width .7s var(--ease-out)}
.tl-leg{display:grid;gap:8px;margin:0;padding:0;list-style:none;font-size:14px}
.tl-leg li{display:flex;align-items:center;gap:10px;color:#C9D0E6}
.tl-leg li i{width:10px;height:10px;border-radius:3px;flex:none}
.tl-leg li b{margin-left:auto;color:#fff;font:500 14px/1 var(--font-mono)}
.tl-kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0}
.tl-kpis div{padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.06)}
.tl-kpis dt{font:500 12px/1.2 var(--font-mono);color:#A8B1CC}
.tl-kpis dd{margin:6px 0 0;font:500 1.3rem/1.1 var(--font-display);letter-spacing:-.02em}
.tl-out .tl-in{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}
.tl-out .tl-in:focus-within{background:rgba(255,255,255,.1);border-color:var(--bright)}
.tl-out .tl-in input{color:#fff}
.tl-out .tl-field{color:#fff}
.tl-out .btn{justify-content:center}
.tl-out small{color:#8189A5;font-size:12.5px;line-height:1.5}
.tl-actions{display:flex;flex-wrap:wrap;gap:10px}
.tl-actions > *{flex:1 1 auto}
.tl-link{padding:14px 16px;border-radius:12px;background:rgba(255,255,255,.06);font:500 14px/1.45 var(--font-mono);word-break:break-all;color:#fff}
.tl-copy{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 18px;border:1.5px solid rgba(255,255,255,.2);border-radius:999px;background:transparent;color:#fff;font:600 14px/1 var(--font-body);cursor:pointer;text-decoration:none;transition:background .4s var(--ease-out),border-color .4s,transform .2s}
.tl-copy:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.4)}
.tl-copy:active{transform:scale(.97)}
.tl-copy.is-done{border-color:#5BE3A8;color:#5BE3A8}
.tl-copy[aria-disabled="true"]{opacity:.4;pointer-events:none}

.tl-scores{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.tl-score{display:grid;justify-items:center;gap:8px;padding:14px 8px;border-radius:14px;background:rgba(255,255,255,.06);text-align:center;font-size:12.5px;line-height:1.25;color:#C9D0E6}
.tl-ring{--v:0;--c:#5BE3A8;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;position:relative;
  background:conic-gradient(var(--c) calc(var(--v) * 1%),rgba(255,255,255,.1) 0);font:600 1.05rem/1 var(--font-display);color:#fff}
.tl-ring::before{content:"";position:absolute;inset:6px;border-radius:50%;background:#0A0E1E}
.tl-ring span{position:relative}
.tl-metrics{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.tl-metrics li{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:12px 14px;border-radius:12px;background:rgba(255,255,255,.05);font-size:14px;color:#C9D0E6}
.tl-metrics li b{color:#fff;font:500 14px/1.3 var(--font-mono)}
.tl-metrics li small{grid-column:1/-1;color:#8189A5;font-size:12.5px}
.tl-metrics .ok b{color:#5BE3A8}.tl-metrics .mid b{color:#FFD27A}.tl-metrics .bad b{color:#FF8E7E}
.tl-loading{display:flex;align-items:center;gap:12px;color:#C9D0E6}
.tl-loading::before{content:"";width:18px;height:18px;flex:none;border-radius:50%;border:2px solid rgba(255,255,255,.2);border-top-color:var(--bright);animation:tlspin .9s linear infinite}
@keyframes tlspin{to{transform:rotate(360deg)}}
.tl-sub{margin:4px 0 0;font:500 12.5px/1.2 var(--font-mono);color:#A8B1CC}

.tl-doc{padding:clamp(20px,2.4vw,28px);border-radius:16px;background:#fff;color:var(--night);max-height:520px;overflow:auto;font-size:14.5px;line-height:1.65}
.tl-doc h3{margin:1.2em 0 .4em;font:500 1.05rem/1.3 var(--font-display);letter-spacing:-.02em;color:var(--night)}
.tl-doc h3:first-child{margin-top:0}
.tl-doc p,.tl-doc li{margin:0 0 .6em;color:#3A405E}
.tl-doc ul{padding-left:1.2em;margin:0 0 .6em}

.tl-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,22px);margin-top:clamp(28px,3.5vw,44px)}
.tl-notes > div{padding:22px 24px;border-radius:var(--radius);background:#fff}
.tl-notes h2{margin:0 0 8px;font:500 1.08rem/1.25 var(--font-display);letter-spacing:-.02em;color:var(--fg)}
.tl-notes p{margin:0;color:var(--muted);font-size:14.5px;line-height:1.6}
.tl-notes a{color:var(--brand)}
@media (max-width:1000px){.tl{grid-template-columns:1fr}.tl-out{position:static}.tl-notes{grid-template-columns:1fr}}
@media (max-width:560px){.tl-grid{grid-template-columns:1fr}.tl-scores{grid-template-columns:repeat(2,1fr)}}
@media (prefers-reduced-motion:reduce){.tl-bar span,.tl-seg button{transition:none}.tl-loading::before{animation:none}}

/* Página do autor */
.au__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,5vw,72px);align-items:center;padding-bottom:clamp(56px,7vw,96px)}
.au__photo{margin:0}
.au__photo img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius)}
.au__txt{display:grid;gap:16px;justify-items:start}
.au__txt .bl-h1{margin:0}
.au__role{margin:-6px 0 0;font:500 13px/1.3 var(--font-mono);color:var(--brand)}
.au__txt > p{margin:0;color:var(--muted);line-height:1.65;max-width:58ch}
.au__facts{display:grid;grid-template-columns:repeat(3,auto);gap:10px 28px;margin:6px 0;padding:0;list-style:none}
.au__facts li{display:grid;gap:2px}
.au__facts b{font:500 1.7rem/1 var(--font-display);letter-spacing:-.03em}
.au__facts span{color:var(--muted);font-size:13.5px}
.au__links{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:6px}
.bp-by__who{text-decoration:none;color:inherit}
.bp-note{padding:22px 24px;border-radius:18px;background:#EEF3FF}
.bp-note span{display:block;margin-bottom:8px;font:500 12px/1 var(--font-mono);color:var(--brand)}
@media (max-width:860px){.au__grid{grid-template-columns:1fr}.au__photo{max-width:360px}.au__facts{grid-template-columns:repeat(3,1fr)}}

/* Diagnóstico de site: quiz em passos */
.tl [hidden]{display:none!important}
.tl--quiz{display:block;max-width:780px;margin-inline:auto}
.qz{display:grid;gap:22px;padding:clamp(24px,3.6vw,44px);border-radius:var(--radius);background:#fff;box-shadow:0 30px 60px -44px rgba(10,14,30,.35)}
.qz__top{display:flex;justify-content:space-between;align-items:center;gap:12px;font:500 12.5px/1.2 var(--font-mono);color:var(--muted)}
.qz__area{padding:7px 12px;border-radius:999px;background:#EEF3FF;color:var(--brand)}
.qz .tl-bar{height:8px;background:var(--paper)}
.qz .tl-bar span{display:block;background:var(--grad)}
.qz .tl-q{gap:22px}
.qz.is-ready .tl-q{display:none}
.qz.is-ready .tl-q.is-on{display:grid;animation:qzIn .55s var(--ease-out)}
@keyframes qzIn{from{opacity:0;transform:translateY(14px)}}
.qz .tl-q > p{min-height:2.5em;margin:0;font:500 clamp(1.3rem,1.1rem + .8vw,1.7rem)/1.25 var(--font-display);letter-spacing:-.02em;color:var(--fg);outline:0}
.qz .tl-seg{flex-direction:column;gap:10px;padding:0;background:transparent}
.qz .tl-seg button{display:flex;align-items:center;gap:14px;flex:none;padding:17px 18px;border:1.5px solid var(--line);border-radius:14px;background:#fff;
  font:600 15.5px/1.2 var(--font-body);color:var(--fg);text-align:left;transition:border-color .4s var(--ease-out),background .4s var(--ease-out),transform .2s}
.qz .tl-seg button::before{content:"";width:18px;height:18px;flex:none;border-radius:50%;border:2px solid rgba(10,14,30,.22);transition:border-color .3s,box-shadow .3s}
.qz .tl-seg button:hover{border-color:var(--brand);box-shadow:none}
.qz .tl-seg button:active{transform:scale(.98)}
.qz .tl-seg button[aria-pressed="true"]{box-shadow:none}
.qz .tl-seg button[aria-pressed="true"]::before{border-color:currentColor;box-shadow:inset 0 0 0 4px #fff,inset 0 0 0 10px currentColor}
.qz .tl-seg button[data-v="2"][aria-pressed="true"]{background:#E6F8EF;border-color:#5BCB98;color:#0E7A4F}
.qz .tl-seg button[data-v="1"][aria-pressed="true"]{background:#FFF4DA;border-color:#E9B949;color:#8A5A00}
.qz .tl-seg button[data-v="0"][aria-pressed="true"]{background:#FDE8E6;border-color:#E58A80;color:#B2362B}
.qz__nav{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:4px}
.qz__nav small{color:var(--faint);font-size:13px;line-height:1.45;text-align:right}
.qz__back{display:inline-flex;align-items:center;gap:8px;padding:10px 4px;border:0;background:none;font:600 14px/1 var(--font-body);color:var(--muted);cursor:pointer;transition:color .3s}
.qz__back::before{content:"";width:8px;height:8px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}
.qz__back:hover{color:var(--brand)}
.qz-res{position:static;animation:qzIn .6s var(--ease-out)}
.qz-res .tl-big{outline:0}
.qz-res .tl-metrics a{color:var(--bright);white-space:nowrap}
.qz-res .tl-metrics li span{line-height:1.45}
.qz-res .tl-actions .btn{justify-content:center}
@media (max-width:560px){.qz__nav{flex-direction:column-reverse;align-items:flex-start}.qz__nav small{text-align:left}}
@media (prefers-reduced-motion:reduce){.qz.is-ready .tl-q.is-on,.qz-res{animation:none}}
