/* Portal de conteúdo (feebased.com.br/conteudo/) e, depois, as páginas de artigo.
   Mesmos tokens da página da plataforma (site/index.html): se mudar lá, mude aqui. */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --bg:        #FFFFFF;
  --bg-1:      #FAFBF7;
  --bg-2:      #F3F5EE;
  --bg-3:      #EAEEE1;
  --ink:       #12160F;
  --accent:    #5F7A24;
  --accent-2:  #9AAF50;
  --lime:      #C4D97A;
  --accent-dim:rgba(154,175,80,0.10);
  --text:      rgba(18,22,15,0.76);
  --text-dim:  rgba(18,22,15,0.58);
  --text-faint:rgba(18,22,15,0.40);
  --line:      rgba(18,22,15,0.10);
  --line-2:    rgba(18,22,15,0.20);
  --noite:     #0D130F;
  --r-md: 14px;  --r-lg: 22px;
  --ease: cubic-bezier(0.2,0.8,0.2,1);
  --max: 1180px;
  --grao: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}

html{scroll-behavior:smooth;scroll-padding-top:96px}
body{
  font-family:'Manrope',system-ui,sans-serif;
  background:var(--bg);color:var(--text);
  -webkit-font-smoothing:antialiased;overflow-x:clip;
  font-feature-settings:"ss01","cv11";line-height:1.55;
}
::selection{background:var(--lime);color:var(--ink)}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
ul,ol{list-style:none}
h1,h2,h3{color:var(--ink);font-weight:700;line-height:1.08;letter-spacing:-0.025em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 28px}
section{position:relative}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}

/* ── botões (iguais aos da plataforma) ── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:16px 28px;border-radius:999px;font-size:15px;font-weight:700;
  border:1px solid transparent;cursor:pointer;transition:.25s var(--ease);font-family:inherit;white-space:nowrap;
}
.btn-p{background:linear-gradient(90deg,#174A2A 0%,#2A6B40 100%) border-box;color:#FFF;
  box-shadow:0 0 0 1px rgba(23,74,42,0.22),0 12px 24px -8px rgba(23,74,42,0.45),0 28px 50px -16px rgba(23,74,42,0.35)}
.btn-p:hover{filter:brightness(1.1);transform:translateY(-1px)}
.btn-s{padding:12px 22px;font-size:14px;border-color:var(--line-2);color:var(--ink);background:#FFF}
.btn-s:hover{border-color:var(--accent);color:var(--accent)}
.btn-s.escuro{background:transparent;border-color:rgba(255,255,255,0.26);color:#FFF}
.btn-s.escuro:hover{border-color:var(--lime);color:var(--lime)}

/* ── navbar (mesma da plataforma) ── */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:40px;
  padding:22px 44px;background:transparent;border-bottom:1px solid transparent;
  transition:background .3s var(--ease),border-color .3s var(--ease),backdrop-filter .3s var(--ease)}
.nav.solid{background:rgba(255,255,255,0.82);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);border-bottom-color:var(--line)}
.nav-mark{display:flex;align-items:center;gap:12px}
.nav-mark .aawz-logo{display:block;height:18px;width:auto}
.nav-mark .sep{width:1px;height:14px;background:var(--line-2)}
.nav-mark .tag{white-space:nowrap;font-size:13px;font-weight:600;color:var(--text-dim);letter-spacing:-0.01em}
.nav-links{display:flex;gap:32px;justify-self:center}
.nav-links a{font-size:13px;font-weight:500;color:var(--text-dim);transition:color .2s var(--ease)}
.nav-links a::before{content:attr(data-n);font-size:10px;font-style:italic;color:var(--text-faint);margin-right:6px;font-weight:400}
.nav-links a:hover,.nav-links a[aria-current]{color:var(--ink)}
.nav-right{display:flex;align-items:center;gap:12px;justify-self:end}
.acc{position:relative}
.acc-btn{white-space:nowrap;display:inline-flex;align-items:center;gap:8px;padding:9px 12px;border:0;background:transparent;border-radius:10px;cursor:pointer;
  font-family:inherit;font-size:15px;font-weight:600;color:var(--ink);transition:background .2s var(--ease)}
.acc-btn:hover,.acc.open .acc-btn{background:rgba(18,22,15,0.05)}
.acc-btn svg{fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.acc-ic{width:18px;height:18px}
.acc-chev{width:15px;height:15px;transition:transform .25s var(--ease)}
.acc.open .acc-chev{transform:rotate(180deg)}
.acc-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:220px;padding:6px;border-radius:14px;border:1px solid var(--line);
  background:rgba(255,255,255,0.92);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 18px 40px -16px rgba(18,22,15,0.25);opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility 0s linear .2s}
.acc.open .acc-menu{opacity:1;visibility:visible;transform:none;transition:opacity .2s var(--ease),transform .2s var(--ease),visibility 0s}
.acc-menu a{display:block;padding:11px 14px;border-radius:9px;font-size:14px;font-weight:500;color:var(--ink);transition:background .15s}
.acc-menu a:hover{background:var(--accent-dim)}
.acc-fill .acc-btn{color:#FFF;padding:9px 14px;background:linear-gradient(90deg,#174A2A 0%,#2A6B40 100%);box-shadow:0 4px 12px -4px rgba(23,74,42,0.45);transition:filter .2s var(--ease)}
.acc-fill .acc-btn:hover,.acc-fill.open .acc-btn{background:linear-gradient(90deg,#174A2A 0%,#2A6B40 100%);filter:brightness(1.12)}

/* ── cabeçalho da página ── */
.pt{position:relative;padding:clamp(132px,13vw,176px) 0 clamp(28px,3.4vw,44px);overflow:clip}
.pt::before{content:'';position:absolute;left:-5%;right:-5%;top:0;height:52vw;max-height:620px;z-index:0;pointer-events:none;opacity:.2;
  background:url("/assets/plataforma-fee-fixo-hero-bg.webp") center top/100% auto no-repeat;
  -webkit-mask-image:linear-gradient(#000 45%,transparent);mask-image:linear-gradient(#000 45%,transparent)}
.pt .wrap{position:relative;z-index:1}
.pt h1{font-size:clamp(32px,4.2vw,56px);font-weight:300;max-width:17ch}
.pt h1 b{font-weight:700}
.pt-lead{margin-top:22px;max-width:54ch;font-size:clamp(16px,1.35vw,18px);color:var(--text)}

/* ── cabeçalho de seção ── */
.sec-h{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:clamp(28px,3.4vw,44px)}
.sec-h h2{font-size:clamp(26px,2.8vw,38px);font-weight:300}
.sec-h h2 b{font-weight:700}

.meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:13px;font-weight:500;color:var(--text-dim)}
.meta i{width:3px;height:3px;border-radius:50%;background:var(--text-faint)}

/* ── 1 · destaque (carrossel de foto inteira) ── */
.dq{padding:clamp(8px,1.6vw,20px) 0 clamp(64px,8vw,104px)}
.dq{container-type:inline-size}
/* O painel nunca passa da largura do grid: as bordas dele ficam na mesma linha do texto da página.
   --g = distância da borda da tela até a borda do conteúdo (igual à do .wrap); --p = respiro interno. */
.dq-car{--wp:28px;--g:max(var(--wp),calc((100cqw - var(--max))/2 + var(--wp)));--p:clamp(24px,4vw,56px);
  margin-inline:var(--g)}
.dq-car{position:relative;border-radius:28px;overflow:hidden;isolation:isolate;background:var(--noite);
  height:clamp(520px,44cqw,620px);
  box-shadow:0 40px 80px -44px rgba(13,19,15,0.55)}
.dq-slide{position:absolute;inset:0;display:flex;align-items:flex-end;opacity:0;visibility:hidden;
  transition:opacity .8s var(--ease),visibility 0s linear .8s}
.dq-slide.on{opacity:1;visibility:visible;transition:opacity .8s var(--ease),visibility 0s}
.dq-foto{position:absolute;inset:0;z-index:-3;width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%);
  transform:scale(1.04);transition:transform 8s linear}
.dq-slide.on .dq-foto{transform:none}
/* escurece a esquerda e a base, e puxa a foto para o verde da marca */
.dq-slide::before{content:'';position:absolute;inset:0;z-index:-2;
  background:linear-gradient(90deg,rgba(9,20,13,0.82) 0%,rgba(9,20,13,0.5) 38%,rgba(9,20,13,0) 68%),
             linear-gradient(180deg,rgba(9,20,13,0) 34%,rgba(9,20,13,0.86) 100%),
             linear-gradient(0deg,rgba(23,74,42,0.14),rgba(23,74,42,0.14))}
.dq-txt{position:relative;width:100%;max-width:calc(var(--p) + 780px);padding:clamp(24px,4vw,56px) var(--p) clamp(74px,7vw,96px);color:rgba(255,255,255,0.78);
  transform:translateY(10px);opacity:0;transition:transform .8s var(--ease) .12s,opacity .8s var(--ease) .12s}
.dq-slide.on .dq-txt{transform:none;opacity:1}
.dq-txt h2{font-size:clamp(24px,2.5vw,35px);font-weight:400;line-height:1.12;letter-spacing:-0.03em;color:#FFF;max-width:23ch;text-wrap:balance}
.dq-txt h2 a{transition:opacity .2s var(--ease)}
.dq-txt h2 a:hover{opacity:.86}
.dq-txt > p{margin-top:13px;font-size:clamp(14px,1.05vw,15px);max-width:62ch;text-wrap:balance}
.dq-txt .meta{margin-top:11px;font-size:12.5px;color:rgba(255,255,255,0.62)}
.dq-txt .meta i{background:rgba(255,255,255,0.4)}
.dq-txt .btn{margin-top:20px;padding:12px 20px;font-size:14px}
.dq .btn-p{background:linear-gradient(90deg,#9AAF50 0%,#C4D97A 100%) border-box;text-shadow:0 1px 1px rgba(60,80,20,0.22);
  box-shadow:0 0 0 1px rgba(154,175,80,0.25),0 12px 24px -8px rgba(154,175,80,0.45)}
.dq .btn-p:hover{filter:brightness(1.06)}
.dq-ctrl{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:0 var(--p) clamp(24px,2.6vw,34px);pointer-events:none}
.dq-ctrl > *{pointer-events:auto}
.dq-dots{display:flex;align-items:center;gap:8px}
.dq-dots button{position:relative;width:20px;height:36px;padding:0;border:0;background:none;cursor:pointer;transition:width .4s var(--ease)}
.dq-dots button::before{content:'';position:absolute;left:0;right:0;top:16px;height:4px;border-radius:4px;background:rgba(255,255,255,0.3);transition:background .2s var(--ease)}
.dq-dots button:hover::before{background:rgba(255,255,255,0.5)}
.dq-dots button.on{width:46px}
.dq-dots i{position:absolute;left:0;top:16px;height:4px;width:0;border-radius:4px;background:var(--lime)}
.dq-dots button.on i{width:100%}
.dq-car.rodando .dq-dots button.on i{animation:dqProg 7s linear forwards}
@keyframes dqProg{from{width:0}to{width:100%}}
.dq-setas{display:flex;gap:10px}
.dq-setas button{width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,0.3);background:rgba(13,19,15,0.25);color:#FFF;cursor:pointer;
  display:grid;place-items:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:border-color .2s var(--ease),background .2s var(--ease)}
.dq-setas button:hover{border-color:rgba(255,255,255,0.7);background:rgba(13,19,15,0.45)}
.dq-setas svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ── 2 · artigos (tabela editorial) ── */
.ar{padding:clamp(48px,5.4vw,76px) 0}
.ar-list{border-top:1px solid var(--line-2)}
.ar-row{display:grid;grid-template-columns:132px minmax(0,1fr) auto 40px;gap:28px;align-items:center;
  padding:26px 0;border-bottom:1px solid var(--line)}
.ar-row time{font-size:13px;font-weight:500;color:var(--text-dim);font-variant-numeric:tabular-nums}
.ar-t{display:block;font-size:clamp(17px,1.6vw,21px);font-weight:700;color:var(--ink);letter-spacing:-0.02em;line-height:1.25;transition:color .2s var(--ease)}
.ar-r{display:block;margin-top:6px;font-size:14.5px;color:var(--text-dim);max-width:68ch}
.ar-min{font-size:13px;font-weight:500;color:var(--text-dim);white-space:nowrap}
.ar-seta{width:40px;height:40px;border-radius:50%;border:1px solid var(--line-2);display:grid;place-items:center;color:var(--ink);
  transition:border-color .2s var(--ease),color .2s var(--ease),transform .25s var(--ease)}
.ar-seta svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ar-row:hover .ar-t{color:var(--accent)}
.ar-row:hover .ar-seta{border-color:var(--accent);color:var(--accent);transform:translateX(3px)}

/* ── 3 · materiais: palco escuro com foto desfocada; texto e controle à esquerda, trilho de cartões inteiros à direita ── */
.mt{padding:clamp(56px,6.4vw,88px) 0;background:#FFF}
.pv{--gp:clamp(14px,1.6vw,20px);position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,0.86fr) minmax(0,3fr);gap:clamp(20px,2.4vw,32px);
  padding:clamp(20px,2.4vw,32px);border-radius:28px;color:rgba(255,255,255,0.78);background:var(--noite);box-shadow:0 34px 60px -34px rgba(13,19,15,0.7)}
/* a foto fica maior que o painel para o desfoque não clarear as bordas */
.pv::before{content:'';position:absolute;inset:-16px;z-index:-2;background:url("/assets/conteudo-artigo-conversa.webp") 50% 42%/cover no-repeat;filter:blur(5px) saturate(0.95)}
.pv::after{content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(90deg,rgba(9,20,13,0.82) 0%,rgba(9,20,13,0.62) 32%,rgba(9,20,13,0.5) 100%),linear-gradient(0deg,rgba(23,74,42,0.2),rgba(23,74,42,0.2))}

/* bloco de texto: tudo junto e centralizado na altura do painel */
.pv-txt{display:flex;flex-direction:column;justify-content:center;padding:clamp(4px,0.8vw,10px) 0 clamp(4px,0.8vw,10px) clamp(4px,0.8vw,10px)}
.pv-txt h2{font-size:clamp(25px,2.5vw,34px);font-weight:300;color:#FFF}
.pv-txt h2 b{font-weight:700}
.pv-txt > p{margin-top:14px;font-size:14.5px;line-height:1.5}
.pv-txt .btn{margin-top:22px;align-self:flex-start;padding:13px 22px;font-size:14px;
  background:linear-gradient(90deg,#9AAF50 0%,#C4D97A 100%) border-box;text-shadow:0 1px 1px rgba(60,80,20,0.22);box-shadow:0 12px 24px -10px rgba(154,175,80,0.5)}
.mt-ctrl{display:flex;align-items:center;gap:8px;margin-top:26px}
.mt-ctrl.sem-rolagem{display:none}
.mt-prog{position:relative;flex:1;height:2px;margin-right:8px;border-radius:2px;background:rgba(255,255,255,0.22)}
.mt-prog i{position:absolute;left:0;top:0;bottom:0;width:75%;border-radius:2px;background:var(--lime);transition:width .35s var(--ease)}
.mc-seta{width:38px;height:38px;flex:none;border-radius:50%;border:1px solid rgba(255,255,255,0.34);background:none;color:#FFF;cursor:pointer;display:grid;place-items:center;
  transition:border-color .2s var(--ease),background .2s var(--ease),opacity .2s var(--ease)}
.mc-seta:hover:not(:disabled){border-color:var(--lime);background:rgba(196,217,122,0.12)}
.mc-seta:disabled{opacity:.34;cursor:default}
.mc-seta svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

/* trilho: sempre três cartões inteiros à vista, sem cartão cortado */
.mc-palco{min-width:0;display:flex;flex-direction:column}
.mc-lista{display:grid;gap:var(--gp)}
.mc-trilho{grid-auto-flow:column;grid-auto-columns:calc((100% - 2*var(--gp))/3);flex:1;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px 0;margin:-4px 0}
.mc-trilho::-webkit-scrollbar{display:none}
.mc-trilho li{scroll-snap-align:start}

/* cartão de vidro: placa translúcida que deixa a foto do fundo aparecer */
.mc{display:flex;flex-direction:column;min-width:0}
.mc-vidro{padding:8px;border-radius:var(--r-lg);background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.14);
  -webkit-backdrop-filter:blur(14px) saturate(120%);backdrop-filter:blur(14px) saturate(120%);transition:background .3s var(--ease),border-color .3s var(--ease)}
.mc-vidro:hover{background:rgba(255,255,255,0.12);border-color:rgba(255,255,255,0.24)}
.mc-capa{display:block;aspect-ratio:16/9;overflow:hidden;border-radius:14px}
.mc-capa img{width:100%;height:100%;object-fit:cover}
.mc-corpo{display:flex;flex-direction:column;flex:1;padding:16px 8px 8px}
.mc h3{font-size:16.5px;font-weight:700;letter-spacing:-0.015em;line-height:1.25;color:#FFF}
.mc h3 a{transition:color .2s var(--ease)}
.mc h3 a:hover{color:var(--lime)}
.mc-d{margin-top:8px;margin-bottom:12px;font-size:13.5px;line-height:1.5;color:rgba(255,255,255,0.68);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}
.mc .meta{margin-bottom:16px;font-size:12.5px;color:rgba(255,255,255,0.58);flex-wrap:nowrap;white-space:nowrap}
.mc .meta i{background:rgba(255,255,255,0.36)}
.mc .btn{margin-top:auto;width:100%;padding:12px 18px;font-size:14px;
  background:linear-gradient(90deg,#9AAF50 0%,#C4D97A 100%) border-box;text-shadow:0 1px 1px rgba(60,80,20,0.22);box-shadow:none}

/* arte de capa provisória, feita em código: entra a capa real de cada material no lugar */
.arte{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:6.5% 6%;isolation:isolate;color:#FFF;background:#0B100C}
.arte::before{content:'';position:absolute;inset:0;z-index:-2;
  background:
    linear-gradient(90deg,#0B100C 0%,#0B100C 34%,rgba(11,16,12,0) 78%),
    repeating-linear-gradient(90deg,rgba(196,217,122,0) 0 7px,rgba(196,217,122,0.5) 7px 9px,rgba(154,175,80,0.18) 9px 22px,rgba(196,217,122,0.72) 22px 23px,rgba(95,122,36,0.3) 23px 41px,rgba(214,231,160,0.6) 41px 44px,rgba(95,122,36,0.12) 44px 63px),
    linear-gradient(180deg,#2A3A1D,#12190F)}
.arte::after{content:'';position:absolute;inset:0;z-index:-1;background:var(--grao);opacity:.2;mix-blend-mode:overlay}
.arte{container-type:inline-size}
.arte-logo{height:clamp(8px,4.4cqw,15px);width:auto;align-self:flex-start;filter:brightness(0) invert(1);opacity:.9}
.arte-t{font-size:clamp(11px,6.6cqw,27px);font-weight:700;letter-spacing:-0.01em;line-height:1.06;text-transform:uppercase}
.arte-2{color:var(--ink);background:#DDE6BE}
.arte-2::before{background:
    linear-gradient(90deg,#DDE6BE 0%,#DDE6BE 34%,rgba(221,230,190,0) 78%),
    repeating-linear-gradient(90deg,rgba(23,74,42,0) 0 7px,rgba(23,74,42,0.34) 7px 9px,rgba(95,122,36,0.14) 9px 22px,rgba(23,74,42,0.5) 22px 23px,rgba(95,122,36,0.22) 23px 41px,rgba(23,74,42,0.42) 41px 44px,rgba(255,255,255,0.3) 44px 63px),
    linear-gradient(180deg,#C4D97A,#EEF3DC)}
.arte-2 .arte-logo{filter:none}
.arte-3{background:#174A2A}
.arte-3::before{background:
    linear-gradient(90deg,#174A2A 0%,#174A2A 30%,rgba(23,74,42,0) 80%),
    repeating-linear-gradient(90deg,rgba(196,217,122,0) 0 11px,rgba(196,217,122,0.55) 11px 12px,rgba(196,217,122,0.12) 12px 31px,rgba(214,231,160,0.7) 31px 34px,rgba(13,46,27,0.4) 34px 58px),
    linear-gradient(180deg,#2A6B40,#0F2E1B)}
.arte-4{background:#12160F}
.arte-4::before{background:
    linear-gradient(90deg,#12160F 0%,#12160F 40%,rgba(18,22,15,0) 86%),
    repeating-linear-gradient(90deg,rgba(255,255,255,0) 0 5px,rgba(255,255,255,0.3) 5px 6px,rgba(255,255,255,0.06) 6px 17px,rgba(196,217,122,0.5) 17px 19px,rgba(255,255,255,0.1) 19px 37px),
    linear-gradient(180deg,#3A4034,#1A1F17)}

/* ── 4 · vídeos (seção escura) ── */
.vd{padding:clamp(64px,8vw,112px) 0;background:var(--noite);color:rgba(255,255,255,0.72);overflow:hidden}
.vd::before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.5;
  background:url("/assets/curso-fee-based-loader-bg.webp") left top/cover no-repeat;
  -webkit-mask-image:linear-gradient(180deg,#000,transparent 85%);mask-image:linear-gradient(180deg,#000,transparent 85%)}
.vd .wrap{position:relative}
.vd h2,.vd h3{color:#FFF}
.vd-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(28px,4vw,56px);align-items:start}
.vd-main{position:relative;display:block;aspect-ratio:16/9;border-radius:var(--r-lg);overflow:hidden;background:#000;isolation:isolate;
  box-shadow:0 0 0 1px rgba(255,255,255,0.08),0 40px 70px -34px rgba(0,0,0,0.9)}
/* a capa é a própria thumb do YouTube, inteira e sem véu; o título fica na legenda embaixo */
.vd-main img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .9s var(--ease)}
.vd-main:hover img{transform:scale(1.02)}
.vd-play{position:absolute;left:clamp(14px,1.8vw,24px);bottom:clamp(14px,1.8vw,24px);width:56px;height:56px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,0.94);color:#174A2A;box-shadow:0 10px 30px -8px rgba(0,0,0,0.7);transition:transform .25s var(--ease)}
.vd-play svg{width:20px;height:20px;margin-left:3px;fill:currentColor}
.vd-main:hover .vd-play{transform:scale(1.05)}
.vd-leg{display:flex;justify-content:space-between;align-items:flex-start;gap:14px 28px;margin-top:18px}
.vd-leg > div{min-width:0}
.vd-leg h3{font-size:clamp(17px,1.5vw,20px);font-weight:600;letter-spacing:-0.015em;line-height:1.25}
.vd-leg .meta{margin-top:7px;color:rgba(255,255,255,0.58)}
.vd-leg .meta i{background:rgba(255,255,255,0.36)}
/* o vídeo toca no lugar do cartão; embaixo fica a saída para o YouTube */
.vd-tela{min-width:0}
.vd-palco.tocando .vd-main{display:none}
.vd-palco iframe{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:var(--r-lg);background:#000;
  box-shadow:0 0 0 1px rgba(255,255,255,0.08),0 40px 70px -34px rgba(0,0,0,0.9)}
.vd-fora{flex:none;display:inline-flex;align-items:center;gap:7px;margin-top:3px;font-size:13.5px;white-space:nowrap;font-weight:600;color:rgba(255,255,255,0.6);transition:color .2s var(--ease)}
.vd-fora:hover{color:var(--lime)}
.vd-fora svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.vd-list{border-top:1px solid rgba(255,255,255,0.2)}
.vd-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:16px;align-items:center;padding:21px 0;border-bottom:1px solid rgba(255,255,255,0.1)}
.vd-n{font-size:13px;font-weight:500;color:rgba(255,255,255,0.42);font-variant-numeric:tabular-nums}
.vd-row b{display:block;font-size:16px;font-weight:600;color:#FFF;letter-spacing:-0.015em;line-height:1.3;transition:color .2s var(--ease)}
.vd-row small{display:block;margin-top:3px;font-size:13px;color:rgba(255,255,255,0.54)}
.vd-d{font-size:13px;font-weight:500;color:rgba(255,255,255,0.54);white-space:nowrap}
.vd-row:hover b,.vd-row[aria-current="true"] b{color:var(--lime)}
.vd-row[aria-current="true"] .vd-n{color:var(--lime)}

/* ── rodapé ── */
.rp{border-top:1px solid var(--line);background:var(--bg-1);padding:44px 0 40px}
.rp-grid{display:flex;align-items:center;justify-content:space-between;gap:24px 40px;flex-wrap:wrap}
.rp-links{display:flex;flex-wrap:wrap;gap:8px 28px}
.rp-links a{font-size:14px;font-weight:500;color:var(--text-dim);transition:color .2s var(--ease)}
.rp-links a:hover{color:var(--ink)}
.rp-fim{margin-top:28px;padding-top:22px;border-top:1px solid var(--line);font-size:13px;color:var(--text-faint)}

/* ── barra fixa de seções (escura, embaixo) ── */
.dock{position:fixed;left:50%;bottom:max(16px,env(safe-area-inset-bottom));z-index:90;transform:translateX(-50%);
  display:flex;gap:2px;padding:4px;border-radius:12px;border:1px solid rgba(255,255,255,0.14);background:rgba(13,19,15,0.92);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  box-shadow:0 18px 36px -16px rgba(13,19,15,0.7),0 0 0 1px rgba(13,19,15,0.2);
  transition:opacity .3s var(--ease),transform .3s var(--ease),visibility 0s}
.dock.fora{opacity:0;visibility:hidden;transform:translate(-50%,12px);transition:opacity .3s var(--ease),transform .3s var(--ease),visibility 0s linear .3s}
.dock a,.dock button{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border:0;border-radius:8px;background:none;cursor:pointer;
  font-family:inherit;font-size:13px;font-weight:600;color:rgba(255,255,255,0.74);white-space:nowrap;transition:background .2s var(--ease),color .2s var(--ease)}
.dock svg{width:15px;height:15px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.dock a:hover,.dock button:hover{color:#FFF}
.dock a[aria-current]{background:rgba(196,217,122,0.14);color:#FFF}
.dock a[aria-current] svg{color:var(--lime)}
.rp{padding-bottom:40px}

/* ── assinatura: o botão da barra abre um bloquinho da mesma cor, logo acima dela ── */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.dock .dock-ass{margin-left:4px;background:linear-gradient(90deg,#9AAF50,#C4D97A);color:#FFF;text-shadow:0 1px 1px rgba(60,80,20,0.28);box-shadow:inset 0 0 0 1.5px transparent}
.dock .dock-ass:hover{color:#FFF;filter:brightness(1.06)}
.dock-ass .curto{display:none}
.dock .dock-ass[aria-expanded="true"]{background:none;color:var(--lime);text-shadow:none;box-shadow:inset 0 0 0 1.5px var(--lime);filter:none}
.dock-p{position:absolute;left:-1px;right:-1px;bottom:calc(100% + 6px);padding:8px;border-radius:12px;border:1px solid rgba(255,255,255,0.14);
  background:rgba(13,19,15,0.98);box-shadow:0 22px 44px -18px rgba(13,19,15,0.75);
  opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .28s var(--ease),transform .28s var(--ease),visibility 0s linear .28s}
.dock-p.on{opacity:1;visibility:visible;transform:none;transition:opacity .28s var(--ease),transform .28s var(--ease),visibility 0s}
.dock-p form{display:grid;grid-template-columns:1fr 1fr auto;gap:6px;align-items:center}
.dock-p input{min-width:0;width:100%;padding:7px 11px;border-radius:8px;border:1px solid rgba(255,255,255,0.2);background:rgba(255,255,255,0.08);
  color:#FFF;font:inherit;font-size:13.5px;transition:border-color .2s var(--ease)}
.dock-p input::placeholder{color:rgba(255,255,255,0.56)}
.dock-p input:focus{outline:none;border-color:var(--lime)}
.dock-p input[aria-invalid]{border-color:#FFB4A3}
.dock .dock-p button{padding:8px 18px;font-size:13.5px;font-weight:700;border-radius:8px;background:linear-gradient(90deg,#9AAF50,#C4D97A);color:var(--ink)}
.dock .dock-p button:hover{color:var(--ink);filter:brightness(1.06)}
.dock-p .ass-msg{grid-column:1 / -1;padding:2px 3px 3px;font-size:12.5px;color:var(--lime)}
.dock-p .ass-msg.err{color:#FFB4A3}

/* aviso de prévia: sai antes de publicar */
.previa{margin-top:14px;font-size:12.5px;font-weight:600;color:var(--accent)}

/* ── telas menores ── */
@media(max-width:980px){
  .pv{grid-template-columns:1fr}
  .pv-txt > p{max-width:52ch}
  .mc-trilho{grid-auto-columns:calc((100% - var(--gp))/2)}
  .nav{padding:16px 20px;grid-template-columns:auto auto;justify-content:space-between}
  .nav-links{display:none}
  .vd-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  .wrap{padding:0 20px}
  .acc .acc-ic{display:none}
  .acc-btn{font-size:14px;padding:8px 8px;gap:5px}
  .acc-fill .acc-btn{padding:8px 11px}
  .pt-lead{font-size:15px}
  .sec-h{align-items:center}
  .sec-h .btn-s{padding:10px 16px;font-size:13px}
  .dq-car{--wp:20px;--p:20px;height:min(600px,calc(100svh - 120px));border-radius:22px}
  /* no celular a foto ocupa só a parte de cima, para o texto não cobrir as pessoas */
  .dq-foto{bottom:auto;height:60%;object-position:var(--pos-m,50% 50%)}
  .dq-slide::before{background:linear-gradient(180deg,rgba(13,19,15,0) 30%,var(--noite) 60%),linear-gradient(0deg,rgba(23,74,42,0.14),rgba(23,74,42,0.14))}
  .dq-txt{padding:22px var(--p) 62px}
  .dq-txt h2{font-size:23px}
  .dq-txt > p{font-size:14.5px;margin-top:12px}
  .dq-txt .btn{margin-top:16px;padding:12px 20px}
  .dq-ctrl{padding:0 var(--p) 22px}
  .dq-setas{display:none}
  .ar-row{grid-template-columns:minmax(0,1fr) 36px;gap:6px 16px;padding:20px 0}
  .ar-row time{grid-column:1;grid-row:1}
  .ar-main{grid-column:1;grid-row:2}
  .ar-min{grid-column:1;grid-row:3}
  .ar-seta{grid-column:2;grid-row:1 / span 3;width:36px;height:36px}
  .ar-r{font-size:14px}
  .pv{border-radius:22px;padding:20px}
  .mc-trilho{grid-auto-columns:88%;margin:-4px -20px;padding:4px 20px;scroll-padding-inline:20px}
  .mt-ctrl{display:none}
  .vd-play{width:44px;height:44px}
  .vd-play svg{width:17px;height:17px}
  .vd-leg{flex-direction:column;margin-top:14px}
  .vd-fora{margin-top:0}
  .rp-grid{flex-direction:column;align-items:flex-start}
  .dock{left:12px;right:12px;transform:none;justify-content:space-between;bottom:max(12px,env(safe-area-inset-bottom))}
  .dock.fora{transform:translateY(12px)}
  .dock{justify-content:flex-start}
  .dock a{flex:1;justify-content:center;padding:8px 3px;font-size:12.5px}
  .dock a svg{display:none}
  .dock .dock-ass{flex:none;padding:8px 10px;font-size:12.5px;gap:6px}
  .dock-p form{grid-template-columns:1fr}
  .dock-p input{padding:10px 12px;font-size:16px}
  .dock .dock-p button{padding:10px;justify-content:center}
}
@media(max-width:400px){
  .dock-ass .longo{display:none}
  .dock-ass .curto{display:inline}
  .nav{gap:10px;padding:14px 14px}
  .nav-mark .sep,.nav-mark .tag{display:none}
  .acc-btn{padding:8px 6px;font-size:14px}
}
/* ── 2 · artigos: três publicações com foto ── */
.pb-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.6vw,36px)}
.pb{display:block}
.pb-img{display:block;aspect-ratio:16/9;border-radius:var(--r-md);overflow:hidden;background:var(--bg-3)}
.pb-img img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.pb:hover .pb-img img{transform:scale(1.02)}
.pb-linha{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding-bottom:12px;border-bottom:1px solid var(--line);
  font-size:12.5px;color:var(--text-dim)}
.pb-autor{display:inline-flex;align-items:center;gap:9px;font-weight:600;color:var(--ink);white-space:nowrap}
/* marca da AAWZ: círculo escuro com as listras verde-oliva da arte da marca e o W em branco (o PNG entra como máscara) */
.pb-av{position:relative;flex:none;width:26px;height:26px;border-radius:50%;overflow:hidden;background:
    linear-gradient(90deg,rgba(7,9,4,0) 0%,rgba(7,9,4,0.5) 46%,#070904 82%),
    repeating-linear-gradient(90deg,rgba(124,152,28,0.75) 0 1px,rgba(64,84,10,0.5) 1px 3px,rgba(96,122,18,0.62) 3px 4px,rgba(40,54,6,0.5) 4px 6px),
    linear-gradient(180deg,#46590E,#1B2405)}
.pb-av::before{content:'';position:absolute;inset:6.5px 5.5px;background:#FFF;
  -webkit-mask:url("/assets/favicon-192.png") center/contain no-repeat;mask:url("/assets/favicon-192.png") center/contain no-repeat}
.pb-data{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-variant-numeric:tabular-nums}
.pb-data i{width:3px;height:3px;border-radius:50%;background:var(--text-faint)}
.pb-t{display:block;margin-top:14px;font-size:clamp(17px,1.45vw,20px);font-weight:500;color:var(--ink);letter-spacing:-0.018em;line-height:1.28;text-wrap:balance;transition:color .2s var(--ease)}
.pb:hover .pb-t{color:var(--accent)}
.pb-tema{display:block;margin-top:10px;font-size:12.5px;font-weight:600;color:var(--accent)}

@media(max-width:980px){
  .pb-grid{grid-template-columns:1fr 1fr}
  .pb-grid li:last-child{display:none}
}
@media(max-width:760px){
  .pb-grid{grid-template-columns:1fr;gap:30px}
  .pb-grid li:last-child{display:block}
  .pb-t{font-size:18px}
}

/* ── páginas de lista (todos os artigos, todos os materiais) ── */
.pt-lista{padding-bottom:clamp(20px,2.4vw,32px)}
.pt-lista h1{max-width:none;font-size:clamp(30px,3.6vw,48px)}
.volta{display:inline-flex;align-items:center;gap:8px;margin-bottom:22px;font-size:14px;font-weight:600;color:var(--text-dim);transition:color .2s var(--ease)}
.volta:hover{color:var(--ink)}
.volta svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ft{display:flex;flex-wrap:wrap;gap:4px 26px;margin-top:clamp(24px,3vw,36px)}
.ft button{padding:8px 0;border:0;background:none;cursor:pointer;font:inherit;font-size:14.5px;font-weight:600;color:var(--text-dim);
  box-shadow:inset 0 -2px 0 transparent;transition:color .2s var(--ease),box-shadow .2s var(--ease)}
.ft button:hover{color:var(--ink)}
.ft button[aria-pressed="true"]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--accent)}
.ls{padding:clamp(20px,2.4vw,32px) 0 clamp(40px,5vw,64px)}
.ls-itens > li[hidden]{display:none}
.ls .pb-grid{row-gap:clamp(34px,4vw,52px)}
.ls-vazio{padding:28px 0;font-size:15px;color:var(--text-dim)}
/* listagem de materiais: cartões claros direto no branco da página (o painel com foto fica só na vitrine do portal) */
.ls-claro{display:block}
.ls-claro .mc-vidro{background:#FFF;border-color:rgba(18,22,15,0.12);-webkit-backdrop-filter:none;backdrop-filter:none;
  box-shadow:0 1px 2px rgba(18,22,15,0.04),0 18px 36px -28px rgba(18,22,15,0.5)}
.ls-claro .mc-vidro:hover{background:#FFF;border-color:rgba(18,22,15,0.22);box-shadow:0 1px 2px rgba(18,22,15,0.04),0 24px 46px -28px rgba(18,22,15,0.55)}
.ls-claro .mc h3{color:var(--ink)}
.ls-claro .mc h3 a:hover{color:var(--accent)}
.ls-claro .mc-d{color:rgba(18,22,15,0.64)}
.ls-claro .meta{color:rgba(18,22,15,0.52)}
.ls-claro .meta i{background:rgba(18,22,15,0.28)}
.ls-claro .ls-vazio{color:var(--text-dim)}
.mc-grade{--gp:clamp(12px,1.4vw,18px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gp)}
@media(max-width:1180px){
  .mc-grade{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:980px){
  .mc-grade{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ls .pb-grid li:last-child{display:block}
}
@media(max-width:760px){
  .mc-grade{grid-template-columns:1fr}
  /* filtro numa linha só, que rola para o lado */
  .ft{flex-wrap:nowrap;gap:0 22px;overflow-x:auto;scrollbar-width:none;margin-inline:-20px;padding-inline:20px}
  .ft::-webkit-scrollbar{display:none}
  .ft button{flex:none;padding:10px 0}
  /* áreas de toque maiores */
  .volta{margin-bottom:10px;padding:9px 0}
  .rp-links{flex-direction:column;gap:0}
  .rp-links a{display:block;padding:9px 0}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}

/* ── página de artigo: cabeçalho, capa, texto em coluna de leitura e índice que acompanha a rolagem ── */
/* cabeçalho contido: título e resumo na largura da coluna de leitura; a capa é baixa e fica dentro dessa coluna */
.pt-art{padding-top:clamp(108px,9.4vw,136px);padding-bottom:clamp(24px,3vw,40px)}
.pt-art h1{max-width:700px;font-size:clamp(25px,2.5vw,35px);text-wrap:balance}
.pt-art .pt-lead{max-width:64ch;margin-top:16px;font-size:clamp(15.5px,1.2vw,16.5px)}
.at-ass{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin-top:20px;font-size:13.5px}
.at-capa{width:100%;height:auto;aspect-ratio:2/1;object-fit:cover;object-position:50% 28%;border-radius:var(--r-md);margin-bottom:clamp(24px,2.8vw,36px);background:var(--bg-3)}
.at-grid{display:grid;grid-template-columns:minmax(0,1fr) 232px;gap:clamp(40px,7vw,104px);align-items:start;padding:clamp(28px,3.4vw,44px) 0 clamp(40px,5vw,72px)}
.at-txt{max-width:700px;font-size:17px;line-height:1.72;color:rgba(18,22,15,0.8)}
.at-txt > p{margin-top:20px}
.at-txt > h2{margin-top:clamp(44px,5vw,64px);font-size:clamp(23px,2.2vw,29px);line-height:1.18;letter-spacing:-0.02em;text-wrap:balance}
.at-txt > h3{margin-top:34px;font-size:19px;line-height:1.3;letter-spacing:-0.015em}
.at-txt > h2 + p,.at-txt > h3 + p{margin-top:14px}
.at-txt p a{color:var(--accent);font-weight:600;text-decoration:underline;text-decoration-color:rgba(95,122,36,0.35);text-underline-offset:3px;transition:text-decoration-color .2s var(--ease)}
.at-txt p a:hover{text-decoration-color:currentColor}
.at-txt > ul,.at-resumo ul{margin-top:16px;display:grid;gap:10px}
.at-txt > ul li,.at-resumo li{position:relative;padding-left:22px}
.at-txt > ul li::before,.at-resumo li::before{content:'';position:absolute;left:3px;top:.74em;width:6px;height:6px;border-radius:50%;background:var(--accent-2)}
.at-txt > ol{margin-top:16px;padding-left:22px;list-style:decimal;display:grid;gap:10px}
.at-txt strong{font-weight:700;color:var(--ink)}
.at-txt blockquote{margin-top:22px;padding:2px 0 2px 20px;border-left:2px solid var(--accent-2);font-size:16.5px;line-height:1.66;color:var(--ink)}
.at-fig{width:100%;height:auto;margin-top:26px;border-radius:var(--r-md)}
.at-tab{margin-top:22px;overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-md)}
.at-tab table{width:100%;border-collapse:collapse;font-size:15.5px;line-height:1.4}
.at-tab th,.at-tab td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
.at-tab th{font-weight:700;color:var(--ink);background:var(--bg-1)}
.at-tab tr:last-child td{border-bottom:0}
/* resposta curta logo no começo */
.at-resumo{padding:24px 26px;border:1px solid var(--line-2);border-radius:var(--r-md)}
.at-resumo h2{font-size:17px;letter-spacing:-0.01em;line-height:1.3}
.at-resumo ul{margin-top:14px;font-size:15.5px;line-height:1.6}
/* termos e passos em linhas, no mesmo desenho da lista de vídeos */
.at-def{margin-top:18px;border-top:1px solid var(--line-2)}
.at-def > div{display:grid;grid-template-columns:176px minmax(0,1fr);gap:6px 24px;padding:16px 0;border-bottom:1px solid var(--line)}
.at-def dt{font-weight:700;color:var(--ink)}
.at-def dd{font-size:16px;line-height:1.6}
.at-passos{margin-top:22px;counter-reset:passo;border-top:1px solid var(--line-2)}
.at-passos li{counter-increment:passo;display:grid;grid-template-columns:44px minmax(0,1fr);padding:20px 0;border-bottom:1px solid var(--line)}
.at-passos li::before{content:counter(passo,decimal-leading-zero);grid-row:1 / span 2;padding-top:4px;font-size:13px;font-weight:600;color:var(--accent);font-variant-numeric:tabular-nums}
.at-passos h3{font-size:18px;line-height:1.3;letter-spacing:-0.015em}
.at-passos p{grid-column:2;margin-top:6px;font-size:16px;line-height:1.62}
/* caixas no meio do texto: material relacionado e plataforma */
.at-cx{margin-top:clamp(36px,4vw,52px);border:1px solid var(--line);border-radius:var(--r-lg);background:#FFF;box-shadow:0 1px 2px rgba(18,22,15,0.04),0 18px 36px -28px rgba(18,22,15,0.5)}
.at-cx-txt h3{font-size:18px;line-height:1.25;letter-spacing:-0.015em}
.at-cx-txt h3 a{transition:color .2s var(--ease)}
.at-cx-txt h3 a:hover{color:var(--accent)}
.at-cx-txt p{margin-top:8px;font-size:14.5px;line-height:1.55;color:var(--text-dim)}
.at-cx .btn{padding:12px 22px;font-size:14px}
.at-mat{display:grid;grid-template-columns:minmax(0,0.92fr) minmax(0,1.08fr);gap:22px;align-items:center;padding:10px}
.at-cx-capa{display:block;aspect-ratio:16/9;border-radius:14px;overflow:hidden}
.at-cx-capa img{width:100%;height:100%;object-fit:cover}
.at-mat .at-cx-txt{padding:8px 14px 8px 0}
.at-mat .btn{margin-top:16px}
.at-plat{display:flex;align-items:center;justify-content:space-between;gap:18px 28px;padding:22px 26px}
.at-plat .btn{flex:none}
/* perguntas frequentes */
.at-faq{margin-top:20px;border-top:1px solid var(--line-2)}
.at-faq details{border-bottom:1px solid var(--line)}
.at-faq summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 0;cursor:pointer;list-style:none}
.at-faq summary::-webkit-details-marker{display:none}
.at-faq summary h3{font-size:17.5px;font-weight:600;line-height:1.3;letter-spacing:-0.012em;transition:color .2s var(--ease)}
.at-faq summary:hover h3{color:var(--accent)}
.at-faq summary svg{flex:none;width:18px;height:18px;fill:none;stroke:var(--accent);stroke-width:1.8;stroke-linecap:round;transition:transform .25s var(--ease)}
.at-faq details[open] summary svg{transform:rotate(45deg)}
.at-faq details p{padding:0 44px 20px 0;font-size:16px;line-height:1.65}
.at-fim{display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;margin-top:clamp(40px,5vw,60px);padding-top:20px;border-top:1px solid var(--line);font-size:14px}
.at-fim span{color:var(--text-dim);font-weight:500}
.at-fim a,.at-fim button{padding:0;border:0;background:none;cursor:pointer;font:inherit;font-weight:600;color:var(--ink);transition:color .2s var(--ease)}
.at-fim a:hover,.at-fim button:hover{color:var(--accent)}
/* índice */
.at-ind{position:sticky;top:112px;font-size:14px}
.at-ind b{display:block;font-weight:700;color:var(--ink)}
.at-ind ol{margin-top:14px;border-left:1px solid var(--line)}
.at-ind a{display:block;margin-left:-1px;padding:7px 0 7px 16px;border-left:1px solid transparent;font-weight:500;line-height:1.35;color:var(--text-dim);transition:color .2s var(--ease),border-color .2s var(--ease)}
.at-ind a:hover{color:var(--ink)}
.at-ind a[aria-current]{color:var(--ink);font-weight:600;border-left-color:var(--accent)}
.at-ind-m{display:none}
.at-mais{padding-top:clamp(40px,5vw,64px);border-top:1px solid var(--line)}
@media(max-width:980px){
  .at-grid{grid-template-columns:minmax(0,1fr)}
  .at-txt{max-width:none}
  .at-ind{display:none}
  .at-ind-m{display:block;margin-top:16px;border:1px solid var(--line-2);border-radius:var(--r-md)}
  .at-ind-m summary{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;cursor:pointer;list-style:none;font-size:15px;font-weight:700;color:var(--ink)}
  .at-ind-m summary::-webkit-details-marker{display:none}
  .at-ind-m summary svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s var(--ease)}
  .at-ind-m[open] summary svg{transform:rotate(180deg)}
  .at-ind-m ol{padding:0 18px 12px}
  .at-ind-m a{display:block;padding:8px 0;font-size:15px;font-weight:500;color:var(--text)}
}
@media(max-width:760px){
  .at-ass .meta{font-size:12.5px;gap:4px 8px}
  .at-txt{font-size:16.5px;line-height:1.68}
  .at-resumo{padding:20px}
  .at-def > div{grid-template-columns:minmax(0,1fr)}
  .at-passos li{grid-template-columns:36px minmax(0,1fr)}
  .at-mat{grid-template-columns:minmax(0,1fr);gap:6px}
  .at-mat .at-cx-txt{padding:10px 10px 12px}
  .at-plat{flex-direction:column;align-items:flex-start;padding:20px}
  .at-cx .btn{width:100%}
  .at-faq details p{padding-right:0}
}

/* destaque cuja foto tem o assunto no meio: o texto fica numa coluna mais estreita para não passar por cima dele */
@media(min-width:761px){.dq-estreito .dq-txt h2{max-width:17ch}.dq-estreito .dq-txt > p{max-width:40ch}}

/* ── 5 · chamada final: a tela inteira dividida em duas, curso (escuro, com o fundo da tela de carregamento dele) e plataforma (clara, como o topo da página dela).
   As duas ficam meio apagadas e acende só a que estiver sob o mouse; no toque, as duas ficam acesas. ── */
.cf{display:flex;overflow:hidden}
.cf-lado{flex:1 1 0;min-width:0;transition:flex-grow 1.2s var(--ease);position:relative;isolation:isolate;overflow:hidden;display:grid;place-items:center;min-height:clamp(460px,44vw,600px);padding:clamp(48px,6vw,88px) clamp(24px,5vw,72px);text-align:center}
.cf-lado::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;transition:opacity .5s var(--ease)}
.cf-lado:hover::after,.cf-lado:focus-within::after{opacity:0}
/* a metade acesa ganha um pouco de largura, bem de leve */
.cf-lado:hover,.cf-lado:focus-within{flex-grow:1.07}
.cf-in{width:min(500px,calc(50vw - 48px));justify-self:center}
.cf h2{font-size:clamp(25px,2.9vw,42px);line-height:1.1;letter-spacing:-0.035em;text-wrap:balance}
.cf p{max-width:46ch;margin:18px auto 0;font-size:15px;line-height:1.55;text-wrap:pretty}
.cf-btn{display:inline-flex;align-items:center;gap:10px;margin-top:28px;padding:15px 28px;font-size:14.5px;font-weight:700;color:#FFF;transition:filter .25s var(--ease),transform .25s var(--ease)}
.cf-btn::after{content:'';position:absolute;inset:0;z-index:2}
.cf-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.cf-lado:hover .cf-btn{filter:brightness(1.06);transform:translateY(-1px)}
.cf-curso{background:#050807 url("/assets/curso-fee-based-loader-bg.webp") center/cover no-repeat;color:rgba(245,241,234,0.76)}
.cf-curso::after{background:rgba(5,8,7,0.6)}
.cf-logo{height:clamp(30px,2.8vw,40px);width:auto;margin:0 auto 26px}
.cf-curso h2{font-weight:200;color:#F5F1EA}
.cf-curso h2 b{font-weight:600}
.cf-curso .cf-btn{border-radius:999px;background:linear-gradient(90deg,#9AAF50 0%,#C4D97A 100%);box-shadow:0 0 0 1px rgba(154,175,80,0.25),0 20px 30px -10px rgba(154,175,80,0.5)}
.cf-plat{background:#FFF;color:var(--text)}
.cf-plat::before{content:'';position:absolute;inset:0;z-index:-1;opacity:.22;background:url("/assets/plataforma-fee-fixo-hero-bg.webp") center top/cover no-repeat}
.cf-plat::after{background:rgba(255,255,255,0.66)}
.cf-plat h2{font-weight:300}
.cf-plat h2 b{font-weight:700}
.cf-plat .cf-btn{border-radius:999px;background:linear-gradient(90deg,#174A2A 0%,#2A6B40 100%);box-shadow:0 0 0 1px rgba(23,74,42,0.22),0 12px 24px -8px rgba(23,74,42,0.45)}
@media(hover:none){.cf-lado::after{opacity:0}.cf-lado:hover{flex-grow:1}}
@media(max-width:760px){
  .cf{flex-direction:column}
  .cf-in{width:min(500px,100%)}
  .cf-lado{flex:none;min-height:0;padding:56px 24px}
}

/* entrada da chamada final (a classe .js entra pelo script, só no computador e sem "reduzir movimento"; .vis = a seção chegou na tela):
   o curso começa ocupando a tela inteira e a plataforma entra pela direita, empurrando até o meio */
.cf.js .cf-lado{transition:flex-grow 1.25s var(--ease),padding 1.25s var(--ease)}
.cf.js .cf-plat .cf-in{transition:opacity .6s var(--ease) .7s}
.cf.js:not(.vis) .cf-plat{flex-grow:0.0001;padding-left:0;padding-right:0}
.cf.js:not(.vis) .cf-plat .cf-in{opacity:0}
.cf.js:not(.vis) .cf-lado,.cf.js:not(.vis) .cf-plat .cf-in{transition-duration:0s;transition-delay:0s}

/* ── página de material (LP dentro do portal): título e formulário lado a lado; capa, números e lista abaixo do título ── */
.pt-mat{padding-top:clamp(108px,9.4vw,136px);padding-bottom:clamp(36px,4.4vw,60px)}
.lm-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,408px);grid-template-areas:"txt form" "resto form";column-gap:clamp(36px,6.4vw,96px);align-items:start}
.lm-txt{grid-area:txt}
.lm-resto{grid-area:resto}
.pt-mat h1{max-width:19ch;font-size:clamp(27px,3vw,40px);text-wrap:balance}
.pt-mat .pt-lead{max-width:58ch;margin-top:16px;font-size:clamp(15.5px,1.2vw,16.5px);text-wrap:pretty}
.pt-mat .lm-txt .meta{margin-top:18px}
.lm-capa{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r-md);margin-top:clamp(22px,2.6vw,32px);background:var(--bg-3)}
.lm-num{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:clamp(22px,2.6vw,30px);border-top:1px solid var(--line-2);border-bottom:1px solid var(--line)}
.lm-num div{padding:16px 0}
.lm-num div + div{padding-left:24px;border-left:1px solid var(--line)}
.lm-num b{display:block;font-size:clamp(22px,2.2vw,28px);font-weight:700;letter-spacing:-0.02em;line-height:1.1;color:var(--ink)}
.lm-num span{display:block;margin-top:6px;font-size:13.5px;line-height:1.4;color:var(--text-dim)}
.lm-resto h2{margin-top:clamp(26px,3vw,36px);font-size:18px;letter-spacing:-0.015em;line-height:1.3}
.lm-itens{margin-top:14px;display:grid;gap:10px;max-width:60ch;font-size:15.5px;line-height:1.55}
.lm-itens li{position:relative;padding-left:22px}
.lm-itens li::before{content:'';position:absolute;left:3px;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--accent-2)}
.lm-prod{margin-top:22px;max-width:60ch;font-size:14px;line-height:1.6;color:var(--text-dim)}
/* formulário: cartão que acompanha a rolagem no computador */
.lm-form{grid-area:form;position:sticky;top:96px;padding:clamp(22px,2.3vw,28px);border:1px solid var(--line);border-radius:var(--r-lg);background:#FFF;
  box-shadow:0 1px 2px rgba(18,22,15,0.04),0 24px 48px -32px rgba(18,22,15,0.5)}
.lm-form h2{font-size:19px;line-height:1.24;letter-spacing:-0.02em;text-wrap:balance}
.lm-form > p{margin-top:8px;font-size:14.5px;line-height:1.55;color:var(--text-dim)}
.lm-f{margin-top:18px;display:grid;gap:12px}
.lm-dupla{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.lm-campo label{display:block;margin-bottom:6px;font-size:13px;font-weight:600;color:var(--ink)}
.lm-campo input,.lm-campo select{width:100%;height:46px;padding:0 14px;border-radius:10px;border:1px solid var(--line-2);background:#FFF;color:var(--ink);
  font:inherit;font-size:15px;transition:border-color .2s var(--ease),box-shadow .2s var(--ease);appearance:none;-webkit-appearance:none}
.lm-campo input::placeholder{color:var(--text-faint)}
.lm-campo select{padding-right:38px;background:#FFF url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2312160F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 12px center/16px no-repeat}
.lm-campo select:invalid{color:var(--text-faint)}
.lm-campo input:focus,.lm-campo select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}
.lm-campo [aria-invalid]{border-color:#B4432A}
.lm-f .btn{width:100%;margin-top:6px}
.lm-f .btn[disabled]{opacity:.7;cursor:default;transform:none}
.lm-nota{font-size:12.5px;text-align:center;color:var(--text-dim)}
.lm-msg{font-size:13.5px;font-weight:600;color:#A6341B}
.lm-avisos{margin-top:clamp(32px,4vw,52px);padding-top:18px;border-top:1px solid var(--line);font-size:12px;line-height:1.6;color:var(--text-dim)}
.lm-avisos p + p{margin-top:8px}
.lm-mais{padding-top:clamp(28px,3.4vw,44px)}
/* página de obrigado do material */
.lm-obg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,480px);gap:clamp(32px,6.4vw,96px);align-items:center}
.pt-mat .lm-obg h1{font-weight:700}
.lm-obg .btn{margin-top:24px}
.lm-obg .meta{margin-top:22px}
.lm-obg .lm-capa{margin-top:0}
/* tela baixa: o cartão não cabe inteiro preso no topo, então rola junto com a página */
@media(max-height:780px){.lm-form{position:static}}
@media(max-width:980px){
  .lm-grid{grid-template-columns:1fr;grid-template-areas:"txt" "form" "resto"}
  .lm-form{position:static;margin-top:26px}
  .lm-obg{grid-template-columns:1fr}
  .lm-obg .lm-capa{max-width:560px}
}
@media(max-width:760px){
  .lm-campo input,.lm-campo select{font-size:16px}   /* 16px evita o zoom automático do iPhone ao tocar no campo */
  .lm-num div + div{padding-left:16px}
}