/* PLAUTO · Atletas Embaixadores — estilos compartilhados entre index.html e renovacao.html.
   Tokens da marca (colors_and_type.css, igual ao plauto.run) + CSS das paginas.
   As @font-face ficam inline em cada pagina para o texto aparecer antes deste arquivo chegar. */

:root{--orange:#f7ad1c;--navy:#194c98;--cyan:#1498cc;--purple:#633a8d;--white:#f1f1f1;--ink:#000000;--gray-900:#4F5353;--gray-700:#686A6B;--gray-500:#7C8082;--gray-400:#929596;--gray-300:#A6AAAB;--gray-200:#C2C5C5;--gray-100:#E5E6E6;--gray-50:#F4F4F4;--bg:var(--white);--bg-elev:var(--gray-50);--bg-quiet:var(--gray-100);--bg-invert:var(--ink);--fg:var(--ink);--fg-soft:var(--gray-900);--fg-muted:var(--gray-700);--fg-on-dark:var(--white);--border:var(--gray-200);--border-strong:var(--gray-400);--accent:var(--orange);--accent-fg:var(--ink);--primary:var(--navy);--primary-fg:var(--white);--font-display:'Kit Rounded','Nunito',system-ui,-apple-system,sans-serif;--font-body:'Kit Rounded','Nunito',system-ui,-apple-system,sans-serif;--font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,monospace;--fs-xs:12px;--fs-sm:14px;--fs-md:16px;--fs-lg:18px;--fs-xl:22px;--fs-2xl:28px;--fs-3xl:36px;--fs-4xl:48px;--fs-5xl:64px;--fs-6xl:88px;--lh-tight:1.05;--lh-snug:1.2;--lh-normal:1.5;--lh-loose:1.65;--tr-tight:-0.02em;--tr-normal:0;--tr-wide:0.08em;--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;--sp-7:48px;--sp-8:64px;--sp-9:80px;--sp-10:96px;--sp-11:128px;--sp-12:160px;--r-sm:6px;--r-md:12px;--r-lg:20px;--r-xl:32px;--r-pill:999px;--shadow-soft:0 2px 6px -2px rgba(20,21,20,.08);--shadow-overlay:0 16px 48px -12px rgba(20,21,20,.22);--ease:cubic-bezier(0.32,0.72,0.24,1);--d-quick:200ms;--d-base:320ms;--d-slow:500ms;--max-w:1240px;--pad-page:24px}
  body,html{background:var(--bg);color:var(--fg);font-family:var(--font-body);font-size:var(--fs-md);line-height:var(--lh-normal);-webkit-font-smoothing:antialiased}
  .h1,h1{font-family:var(--font-display);font-size:var(--fs-4xl);font-weight:800;line-height:var(--lh-tight);letter-spacing:var(--tr-tight);margin:0}
  .h2,h2{font-family:var(--font-display);font-size:var(--fs-3xl);font-weight:800;line-height:var(--lh-snug);letter-spacing:var(--tr-tight);margin:0}
  .h3,h3{font-family:var(--font-display);font-size:var(--fs-2xl);font-weight:700;line-height:var(--lh-snug);margin:0}
  .h4,h4{font-family:var(--font-display);font-size:var(--fs-xl);font-weight:700;line-height:var(--lh-snug);margin:0}
  /* Sem text-wrap:pretty. No Chrome ele so evita palavra orfa na ultima linha,
   mas o Safari reflui o paragrafo inteiro em busca de linhas parecidas: o
   texto encolhe, sobra faixa vazia a direita e parece desalinhado com o resto
   do cartao. Titulo continua com balance, que e curto e se comporta. */
.p,p{font-size:var(--fs-md);line-height:var(--lh-loose);color:var(--fg-soft);margin:0}
  .lead{font-size:var(--fs-lg);line-height:var(--lh-loose);color:var(--fg-soft)}
  .caption,small{font-size:var(--fs-sm);color:var(--fg-muted);line-height:var(--lh-normal)}
  .label{font-size:var(--fs-xs);font-weight:700;letter-spacing:var(--tr-wide);text-transform:uppercase;color:var(--fg-muted)}
  .tag{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--r-pill);font-size:var(--fs-xs);font-weight:700;letter-spacing:var(--tr-wide);text-transform:uppercase;background:var(--gray-100);color:var(--gray-900);border:1px solid var(--border)}
  .tag--orange{background:var(--orange);color:var(--ink);border-color:transparent}
  .tag--navy{background:var(--navy);color:var(--white);border-color:transparent}
  .tag--cyan{background:var(--cyan);color:var(--white);border-color:transparent}
  .tag--purple{background:var(--purple);color:var(--white);border-color:transparent}
  .card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--sp-5);transition:border-color var(--d-quick) var(--ease),background var(--d-quick) var(--ease)}
  .card:hover{border-color:var(--border-strong)}
  .input{width:100%;padding:14px 16px;border-radius:var(--r-md);border:1px solid var(--border-strong);background:var(--white);font-family:var(--font-body);font-size:var(--fs-md);color:var(--fg);transition:border-color var(--d-quick) var(--ease)}
  .input:focus{outline:0;border-color:var(--navy)}

/* Texto pequeno sobre o navy: a transparencia derrubava o contraste para
   3,4-4,2:1, abaixo dos 4,5:1 da WCAG AA. Dois tons solidos resolvem sem
   mexer na paleta da marca (o laranja institucional segue em titulo, numero
   e botao, onde o tamanho ja dispensa 4,5:1). */
:root{--on-navy:#ccd7ea;--orange-txt:#ffbb3d;--orange-txt-2:#ffcb69}
*{box-sizing:border-box}
/* O Safari do iPhone infla por conta propria a fonte de blocos que julga
   "muito texto", bloco a bloco. O resultado e uma pagina com paragrafos em
   tamanhos diferentes do que foi escrito, so no iOS. O Chrome do Android
   nao faz isso quando ha meta viewport, e por isso a diferenca. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html,body{margin:0;scroll-behavior:smooth}
/* Item de grid/flex tem min-width auto e nao encolhe abaixo do conteudo:
   uma palavra longa empurra a coluna e deforma a linha inteira. */
.wrap>*,.hero-inner>*,.etapas>*,.cta-meio>*,.acordo>*,.grid-3>*,.grid-4>*,.atletas>*,.fatos li,.decisao>*{min-width:0}
p,li,h1,h2,h3,h4,span,b{overflow-wrap:break-word}
h1,h2{font-family:'DM Sans','Nunito',system-ui,-apple-system,sans-serif}
a{color:inherit}
img{display:block;max-width:100%}
ul{margin:0;padding:0;list-style:none}

/* ---------- CTA ---------- */
.pular{position:absolute;left:-9999px;top:0;z-index:100;background:var(--navy);color:var(--white);padding:14px 20px;border-radius:0 0 var(--r-md) 0;font-weight:800;text-decoration:none}
.pular:focus{left:0}
.cta-btn{display:inline-flex;align-items:center;gap:10px;border-radius:999px;font-family:var(--font-display);font-weight:800;text-transform:uppercase;letter-spacing:.04em;text-decoration:none;line-height:1;border:none;cursor:pointer;transition:transform 200ms var(--ease),filter 200ms var(--ease),background 200ms var(--ease)}
.cta-btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
.cta-btn:active{transform:scale(.98)}
.cta-btn:disabled{opacity:.55;cursor:progress;transform:none;filter:none}
.cta-sm{padding:12px 20px;font-size:14px}
.cta-md{padding:16px 28px;font-size:15px}
.cta-lg{padding:20px 36px;font-size:16px}
.cta-navy{background:var(--navy);color:var(--white)}
.cta-orange{background:var(--orange);color:var(--ink)}
.cta-ink{background:var(--ink);color:var(--white)}
.hero-ghost{display:inline-flex;align-items:center;gap:10px;padding:20px 28px;border:1px solid rgba(255,255,255,.35);border-radius:999px;color:var(--white);text-decoration:none;font-family:var(--font-display);font-weight:800;font-size:15px;text-transform:uppercase;letter-spacing:.04em}
.coach-cta{display:inline-flex;align-items:center;gap:10px;padding:16px 26px;border-radius:999px;background:transparent;color:var(--orange);border:1.5px solid var(--orange);text-decoration:none;font-family:var(--font-display);font-weight:800;font-size:15px;text-transform:uppercase;letter-spacing:.04em;transition:background 200ms var(--ease),color 200ms var(--ease),transform 200ms var(--ease)}
.coach-cta:hover{background:var(--orange);color:var(--ink)}

/* ---------- Nav ---------- */
nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border);transform:translateY(0);transition:transform 280ms cubic-bezier(0.32,0.72,0.24,1)}
nav.is-hidden{transform:translateY(-100%)}
/* Medida do plauto.run no ar (components.compiled.js): 20px 40px em volta
   de um logo de 60px, ou seja 100px de barra. O components.jsx do repo
   ainda diz 5px 40px, mas quem roda no navegador e o compilado. */
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:20px 40px;max-width:1240px;margin:0 auto;min-height:100px}
.nav-logo{height:60px;width:auto;display:block}
.nav-links{display:flex;align-items:center;gap:28px}
.nav-links a.nav-link{color:var(--ink);text-decoration:none;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.nav-mobile-actions{display:none;align-items:center;gap:10px}
.nav-burger{display:none;align-items:center;justify-content:center;width:44px;height:44px;background:transparent;border:1px solid var(--border);border-radius:12px;cursor:pointer;padding:0;color:var(--ink)}
.nav-drawer{display:none;flex-direction:column;padding:8px 20px 24px;border-top:1px solid var(--border);background:var(--white);gap:4px}
.nav-drawer.open{display:flex}
.nav-drawer a.nav-link{padding:16px 4px;font-size:16px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--gray-100)}
.nav-drawer .drawer-cta{margin-top:16px;display:flex;justify-content:center}
.nav-drawer .drawer-cta .cta-btn{width:100%;justify-content:center;padding:14px 20px}

/* ---------- Hero ---------- */
#top{position:relative;background:var(--navy);color:var(--white);overflow:hidden}
.hero-inner{max-width:1240px;margin:0 auto;padding:96px 40px 112px;position:relative;display:grid;grid-template-columns:1.25fr 1fr;gap:48px;align-items:center}
.hero-inner h1{font-size:clamp(56px,8vw,104px);font-weight:900;line-height:.96;letter-spacing:-.03em;margin:0;text-wrap:balance}
.hero-inner h1 .destaque{color:var(--orange)}
.hero-sub{font-size:20px;line-height:1.55;color:rgba(255,255,255,.82);margin-top:32px;max-width:520px}
.hero-ctas{display:flex;gap:12px;margin-top:40px;flex-wrap:wrap}
.hero-rule{margin-top:56px;padding-top:28px;border-top:1px solid rgba(255,255,255,.14)}
.hero-rule .label{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--on-navy);margin-bottom:18px}
.hero-stats{display:flex;gap:28px;flex-wrap:wrap;margin-bottom:28px}
.hero-stats > div{min-width:180px;max-width:240px}
.hero-stats .n{font-size:22px;font-weight:900;color:var(--orange);letter-spacing:-.01em;line-height:1.1}
.hero-stats .l{font-size:13px;color:var(--on-navy);margin-top:6px;line-height:1.4}
.hero-aside{border:1px solid rgba(255,255,255,.22);border-radius:var(--r-lg);padding:28px;background:rgba(255,255,255,.05)}
.hero-aside .k{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--orange-txt);margin-bottom:14px}
.hero-aside h2{font-family:'DM Sans','Nunito',sans-serif;font-size:24px;font-weight:900;letter-spacing:-.02em;line-height:1.1;margin:0 0 12px}
.hero-aside p{font-size:15px;line-height:1.6;color:rgba(255,255,255,.82)}
@keyframes heroFlow{from{stroke-dashoffset:0}to{stroke-dashoffset:1200}}

/* ---------- Seções ---------- */
section.sec{padding:112px 40px 96px}
.wrap{max-width:1240px;margin:0 auto}
.sec h2{font-size:clamp(38px,5.5vw,64px);font-weight:900;line-height:.98;letter-spacing:-.02em;margin:0 0 16px;color:var(--ink);text-wrap:balance}
.sec h2 .azul{color:var(--navy)}
.sec .sub{font-size:18px;color:var(--gray-900);max-width:620px;margin-bottom:56px}
.sec--quiet{background:var(--gray-50)}

.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card h3{font-family:'Nunito',sans-serif;font-size:19px;font-weight:800;line-height:1.2;margin:0}
.card p{font-size:15px;line-height:1.55}
.ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;margin-bottom:16px}
.ic svg{width:24px;height:24px}
.bg-navy{background:var(--navy);color:#fff}.bg-orange{background:var(--orange);color:var(--ink)}
.bg-cyan{background:var(--cyan);color:#fff}.bg-purple{background:var(--purple);color:#fff}

/* ---------- Vídeo ---------- */
.video-bloco{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
/* Capa local: o iframe do YouTube so entra depois do clique. */
.video-quadro{position:relative;display:block;width:100%;padding:0;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--border);background:var(--ink);aspect-ratio:16/9;cursor:pointer}
.video-quadro img{width:100%;height:100%;object-fit:cover}
.video-quadro iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
/* O play fica no canto, e nao no centro: a capa tem o logo no meio e o
   botao cobria justamente a marca. A sombra garante contraste quando o
   canto da foto for claro. */
.video-play{position:absolute;right:20px;bottom:20px;width:72px;height:72px;border-radius:999px;background:var(--orange);color:var(--ink);display:grid;place-items:center;box-shadow:0 8px 24px -6px rgba(0,0,0,.45);transition:transform 200ms var(--ease)}
.video-play svg{width:32px;height:32px;margin-left:3px}
.video-quadro:hover .video-play{transform:scale(1.06)}
.video-quadro:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.video-texto h2{margin-bottom:20px}
.video-texto p{font-size:17px;line-height:1.65;margin-bottom:16px}

/* ---------- Acordo ---------- */
.acordo{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.col{border-radius:var(--r-lg);padding:40px;border:1px solid var(--border);background:var(--white)}
.col--recebe{background:var(--navy);color:var(--white);border-color:var(--navy)}
.col .k{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:16px}
.col--recebe .k{color:var(--orange-txt)}
.col--entrega .k{color:var(--navy)}
.col h3{font-family:'DM Sans','Nunito',sans-serif;font-size:clamp(26px,3.2vw,36px);font-weight:900;letter-spacing:-.02em;line-height:1;margin:0 0 12px}
.col .lead-col{font-size:15px;line-height:1.6;margin-bottom:32px}
.col--recebe .lead-col{color:var(--on-navy)}
.col--entrega .lead-col{color:var(--gray-700)}
.col ul{display:grid;gap:18px}
.col li{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:start}
.col li svg{width:24px;height:24px;margin-top:2px}
.col li b{display:block;font-size:16px;font-weight:800;line-height:1.3}
.col li span{display:block;font-size:14px;line-height:1.5;margin-top:4px}
.col--recebe li span{color:var(--on-navy)}
.col--entrega li span{color:var(--gray-900)}
/* O fecho de cada coluna e a frase que decide a leitura, entao sai do rodape
   discreto e vira caixa com barra na cor do lado. */
.col .pe{margin-top:32px;padding:20px 22px;border-radius:var(--r-md);font-size:16px;line-height:1.6}
.col .pe b{font-weight:900}
.col--recebe .pe{background:rgba(247,173,28,.12);border:1px solid rgba(247,173,28,.4);border-left:4px solid var(--orange);color:var(--white)}
.col--recebe .pe b{color:var(--orange-txt-2)}
.col--entrega .pe{background:var(--gray-50);border:1px solid var(--border);border-left:4px solid var(--navy);color:var(--gray-900)}
.col--entrega .pe b{color:var(--navy)}

/* ---------- Atletas ---------- */
.atletas{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.atleta{margin:0;display:flex;flex-direction:column;border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;background:var(--white);transition:border-color var(--d-quick) var(--ease)}
.atleta:hover{border-color:var(--border-strong)}
.atleta-foto{position:relative;aspect-ratio:4/5;background:var(--navy);overflow:hidden}
.atleta img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 500ms var(--ease)}
.atleta:hover img{transform:scale(1.03)}
/* O nome fica sobre a foto, num veu escuro so na base: legivel em foto
   clara ou escura sem precisar de moldura por baixo de cada retrato. */
.atleta-nome{position:absolute;left:0;right:0;bottom:0;padding:56px 20px 16px;color:var(--white);font-family:'DM Sans','Nunito',sans-serif;font-weight:800;font-size:20px;letter-spacing:-.01em;background:linear-gradient(to top,rgba(0,0,0,.72),rgba(0,0,0,0))}
/* A ficha vem abaixo da foto: sobre a imagem, tres linhas de texto brigariam
   com o rosto e sumiriam em foto clara. */
.atleta figcaption{padding:18px 20px 20px;display:flex;flex-direction:column;gap:12px;flex:1}
.atleta figcaption .atleta-bio{font-size:14px;line-height:1.5;color:var(--gray-900);margin:0}
.atleta figcaption .atleta-ig{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:800;color:var(--navy);text-decoration:none;letter-spacing:.01em}
.atleta figcaption .atleta-ig svg{width:15px;height:15px}
.atleta figcaption .atleta-ig:hover{color:var(--orange)}
.atletas-pe{margin-top:28px;font-size:17px;line-height:1.6;color:var(--gray-900);max-width:56ch;border-left:3px solid var(--orange);padding-left:18px}

/* ---------- Mês ---------- */
.mes .card{display:flex;flex-direction:column;gap:10px}
.mes .quando{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--navy)}
.mes .tag{margin-top:auto;align-self:flex-start}

/* ---------- Citação ---------- */
.quote{margin-top:56px;background:var(--navy);color:var(--white);border-radius:var(--r-lg);padding:48px 40px;display:grid;grid-template-columns:auto 1fr;gap:32px;align-items:center}
.quote .aspas{font-family:'DM Sans',sans-serif;font-weight:900;font-size:120px;line-height:.6;color:var(--orange);height:56px}
.quote blockquote{font-family:'DM Sans','Nunito',sans-serif;font-weight:800;letter-spacing:-.02em;font-size:clamp(22px,2.6vw,30px);line-height:1.18;margin:0;max-width:32ch}
.quote cite{display:block;margin-top:14px;font-style:normal;font-size:14px;color:var(--on-navy)}
.quote cite b{color:var(--orange-txt)}

/* ---------- Prazo ---------- */
.prazo{background:var(--ink);color:var(--white);border-radius:var(--r-xl);padding:56px 48px;display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.prazo .label{color:var(--orange);margin-bottom:16px}
.prazo h2{font-size:clamp(32px,4.4vw,52px);font-weight:900;line-height:1;letter-spacing:-.02em;color:var(--white);margin:0 0 16px}
.prazo h2 .destaque{color:var(--orange)}
.prazo p{font-size:17px;line-height:1.65;color:rgba(255,255,255,.78);max-width:52ch}
.prazo-caixa{border:1px solid rgba(255,255,255,.18);border-radius:var(--r-lg);padding:28px;background:rgba(255,255,255,.05)}
.prazo-caixa .data{font-family:'DM Sans',sans-serif;font-size:44px;font-weight:900;letter-spacing:-.03em;line-height:1;color:var(--orange)}
.prazo-caixa .dataleg{font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-top:10px}
.prazo-caixa ul{margin-top:22px;display:grid;gap:12px}
.prazo-caixa li{display:grid;grid-template-columns:22px 1fr;gap:10px;font-size:15px;line-height:1.5;color:rgba(255,255,255,.85)}
.prazo-caixa li svg{width:20px;height:20px;margin-top:2px}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:12px;max-width:860px}
.faq details{background:var(--white);border:1px solid var(--border);border-radius:var(--r-md);transition:border-color var(--d-quick) var(--ease)}
.faq details[open]{border-color:var(--border-strong)}
.faq summary{cursor:pointer;list-style:none;padding:20px 24px;font-weight:800;font-size:17px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:'DM Sans',sans-serif;font-weight:900;font-size:22px;color:var(--navy)}
.faq details[open] summary::after{content:"–"}
.faq .r{padding:0 24px 22px;font-size:15px;line-height:1.65;color:var(--gray-900);max-width:64ch}
.faq .r b{color:var(--ink)}
/* Treze perguntas entre o interesse e o formulario e caminho demais. Sete
   ficam a vista; as outras seis so aparecem para quem pedir. Sem JS o
   botao nao existe e todas continuam visiveis. */
.faq-extra{display:contents}
.faq-extra[hidden]{display:none}
.faq-mais{align-self:start;margin-top:4px;background:transparent;border:1.5px solid var(--navy);color:var(--navy);border-radius:var(--r-pill);padding:12px 22px;font-family:var(--font-display);font-weight:800;font-size:14px;text-transform:uppercase;letter-spacing:.04em;cursor:pointer;transition:background 200ms var(--ease),color 200ms var(--ease)}
.faq-mais:hover{background:var(--navy);color:var(--white)}

/* ---------- Formulário ---------- */
.form-bloco{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:start}
.form-lado h2{margin-bottom:16px}
.form-lado p{font-size:17px;line-height:1.65;margin-bottom:20px}
/* Sem moldura: ao lado do cartao do formulario e da barra do aviso, uma
   terceira caixa deixava a coluna inteira parecendo remendo. */
.resumo{margin:0 0 24px;padding:20px 0 0;border-top:1px solid var(--border);display:grid;gap:10px;list-style:none}
/* Marcador posicionado, e nao coluna de grid: cada <li> aqui tem o ::before,
   um <b> e um no de texto solto. Em grid de duas colunas esse texto vira um
   terceiro item e cai na coluna de 18px, saindo uma palavra por linha. */
.resumo li{position:relative;padding-left:26px;font-size:15px;line-height:1.55;color:var(--gray-900)}
.resumo li::before{content:"";position:absolute;left:0;top:8px;width:8px;height:8px;border-radius:999px;background:var(--orange)}
.resumo li b{color:var(--ink);font-weight:800}
.form-lado .aviso{border-left:3px solid var(--orange);padding-left:18px;font-size:15px;line-height:1.6;color:var(--gray-900)}
/* Branco puro: --white e o mesmo off-white do fundo, entao o cartao sumia
   sempre que a secao ficava clara. */
form.espera{background:#fff;border:1px solid var(--border-strong);border-radius:var(--r-lg);padding:32px;box-shadow:var(--shadow-soft)}
.form-tempo{font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--navy);margin:0 0 22px}
.campo{margin-bottom:18px}
.campo label{display:block;font-size:13px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--gray-900);margin-bottom:8px}
.campo label .op{text-transform:none;letter-spacing:0;font-weight:600;color:var(--gray-500);font-size:12px}
.campo textarea.input{min-height:120px;resize:vertical;line-height:1.6}
.campo select.input{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--gray-500) 50%),linear-gradient(135deg,var(--gray-500) 50%,transparent 50%);background-position:calc(100% - 20px) 22px,calc(100% - 14px) 22px;background-size:6px 6px,6px 6px;background-repeat:no-repeat}
.campo .conta{font-size:12px;color:var(--gray-900);margin-top:6px}
.campo .conta.ok{color:var(--navy);font-weight:700}
.dupla{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-rodape{margin-top:26px;display:flex;flex-direction:column;gap:14px}
/* Num flex column o botao estica e o texto fica encostado a esquerda. */
.form-rodape .cta-btn{justify-content:center;text-align:center}
.form-rodape .legal{font-size:13px;line-height:1.55;color:var(--gray-700)}
.form-status{display:none;margin-top:18px;padding:24px 26px;border-radius:var(--r-lg);font-size:16px;line-height:1.65}
.form-status.ok{display:block;background:rgba(25,76,152,.08);border:1px solid var(--navy);color:var(--navy)}
/* Enviado: o formulario sai, a coluna de argumento sai junto e a confirmacao
   deixa de ficar espremida na metade direita da tela. */
.form-bloco.enviado{grid-template-columns:1fr}
.form-bloco.enviado .form-lado{display:none}
.form-bloco.enviado .form-status{margin-top:0;padding:36px 40px;font-size:18px;line-height:1.7;max-width:68ch}
.form-status.erro{display:block;background:rgba(247,173,28,.14);border:1px solid var(--orange);color:var(--ink)}

/* ---------- Barra fixa do celular ----------
   A pagina e longa; sem isto, quem se convence no meio precisa rolar ate o
   fim. Fica escondida no desktop, onde o menu ja resolve. */
.cta-fixo{display:none}

/* ---------- Rodapé ---------- */
footer{background:var(--ink);color:var(--white)}
.footer-grid{padding:64px 40px 40px;max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1.3fr 1fr 1.4fr;gap:48px}
.footer-mark{height:71px;width:71px;filter:brightness(0) invert(1)}
.footer-blurb{font-size:14px;color:rgba(255,255,255,.65);margin-top:20px;max-width:340px;line-height:1.6}
.footer-grid .label{color:var(--orange);margin-bottom:16px}
.footer-nav{display:flex;flex-direction:column;gap:10px}
.footer-nav a{font-size:14px;color:var(--white);text-decoration:none;opacity:.85}
.footer-nav a:hover{opacity:1}
.footer-contatos{display:flex;flex-direction:column;gap:14px}
.footer-contatos a{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;text-decoration:none;color:var(--white);opacity:.9}
.footer-contatos a:hover{opacity:1}
.fc-ic{width:28px;height:28px;border-radius:999px;background:rgba(255,255,255,.08);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.fc-txt{display:flex;flex-direction:column;line-height:1.2}
.fc-txt .fc-l{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;opacity:.55}
.fc-txt .fc-v{font-size:14px;font-weight:700;margin-top:2px}
.footer-bar{border-top:1px solid rgba(255,255,255,.08);padding:20px 40px;max-width:1240px;margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:12px;color:rgba(255,255,255,.5)}

/* ---------- Responsivo ---------- */

/* ---------- Hero: faixa de vagas e ancora de valor ---------- */
/* A escassez e o argumento mais forte do topo: sai da pastilha discreta e
   vira a primeira coisa que se le, com a contagem de dias junto. */
.hero-vagas{display:inline-flex;align-items:center;gap:12px;padding:8px 20px 8px 8px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(247,173,28,.55);font-size:15px;font-weight:700;margin-bottom:28px;color:var(--white)}
.hero-vagas .pill{background:var(--orange);color:var(--ink);border-radius:999px;padding:8px 14px;font-family:'DM Sans','Nunito',sans-serif;font-weight:900;font-size:15px;letter-spacing:.02em;text-transform:uppercase;line-height:1}
.hero-vagas .txt b{color:var(--orange-txt);font-weight:800}
.hero-stats .n small{font-size:13px;font-weight:700;color:rgba(255,255,255,.7);margin-left:2px;letter-spacing:0}

/* ---------- Quem e a PLAUTO ----------
   Terceira tentativa, e desta vez tirando coisa em vez de arranjar melhor.
   A secao tinha abertura em duas colunas, tres pilares numerados e um cartao
   navy com seis credenciais: muita estrutura para um bloco cuja unica tarefa
   e convencer um desconhecido de que a assessoria e seria. Quanto mais
   blocos, mais jeitos de quebrar numa tela estreita. Agora e uma coluna de
   texto e uma lista. Nao tem o que entortar.
   Os tres pilares sairam tambem por repeticao: a mesma frase ja aparece em
   "voce recebe", na secao do acordo. */
.plauto{max-width:980px}
/* A foto entra ao lado do texto: a secao pede confianca numa pessoa e era a
   unica sem rosto. Coluna fixa de 340px para a imagem nao roubar a leitura. */
.plauto-topo{display:grid;grid-template-columns:340px minmax(0,1fr);gap:44px;align-items:start}
.plauto-foto{margin:0}
.plauto-foto img{width:100%;height:auto;border-radius:var(--r-lg);border:1px solid var(--border);display:block}
.plauto-foto figcaption{font-size:13px;line-height:1.5;color:var(--gray-700);margin-top:12px}
/* Nome que leva ao perfil: sublinhado discreto, para nao virar mais um botao. */
.link-perfil{color:var(--navy);font-weight:800;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px;text-decoration-color:rgba(25,76,152,.35);transition:text-decoration-color 200ms var(--ease)}
.link-perfil:hover{text-decoration-color:var(--navy)}
.plauto h2{margin-bottom:28px}
.plauto-lead{font-size:19px;line-height:1.65;color:var(--fg-soft);margin:0 0 18px}
.plauto-lead b{color:var(--ink);font-weight:800}
.fatos{margin:36px 0 0;padding:0;list-style:none;border-top:1px solid var(--border);columns:2;column-gap:40px}
.fatos li{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;padding:16px 0;border-bottom:1px solid var(--border);font-size:16px;line-height:1.5;color:var(--gray-900);break-inside:avoid}
.fatos li svg{width:18px;height:18px;margin-top:3px;color:var(--orange);flex-shrink:0}
.fatos li b{color:var(--ink);font-weight:800}
.plauto .cta-btn{margin-top:36px}

/* ---------- CTA no meio da pagina ----------
   So havia botao no hero e no formulario: quem se convencia no meio tinha de
   rolar ate o fim ou voltar ao menu. */
.cta-meio{margin-top:48px;padding-top:32px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.cta-meio p{font-size:17px;line-height:1.5;color:var(--gray-900);margin:0;max-width:52ch}
.cta-meio p span{color:var(--ink);font-weight:800}

/* ---------- Selecao: como funciona ---------- */
.etapas{margin-top:8px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:etapa}
.etapas .et{position:relative;padding-top:24px;border-top:2px solid var(--border)}
.etapas .et--vivo{border-top-color:var(--orange)}
.etapas .quando{display:block;font-family:'DM Sans','Nunito',sans-serif;font-size:20px;font-weight:900;letter-spacing:-.02em;color:var(--navy);line-height:1}
.etapas .et--vivo .quando{color:var(--navy)}
.etapas .et b{display:block;font-size:17px;font-weight:800;margin-top:10px;line-height:1.25;color:var(--ink)}
.etapas .et span.d{display:block;font-size:15px;line-height:1.55;color:var(--gray-900);margin-top:6px}

/* ---------- Acordo: caixa de valor ---------- */
.valor{margin-top:32px;border:1px solid rgba(255,255,255,.22);border-radius:var(--r-lg);padding:22px 24px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;background:rgba(255,255,255,.05)}
.valor .vk{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--on-navy)}
.valor .vv{font-family:'DM Sans','Nunito',sans-serif;font-size:26px;font-weight:900;letter-spacing:-.02em;color:var(--orange);margin-top:6px;line-height:1}
.valor .vv small{font-size:13px;font-weight:700;color:var(--on-navy);margin-left:2px;letter-spacing:0}
.valor .vl{font-size:13px;color:var(--on-navy);margin-top:8px;line-height:1.45}

/* ---------- Atletas ---------- */
.atletas-pe b{color:var(--ink)}

/* ---------- Formulario: caminho alternativo pelo WhatsApp ---------- */
.alt-whats{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 22px;border-radius:999px;border:1.5px solid var(--navy);color:var(--navy);text-decoration:none;font-family:var(--font-display);font-weight:800;font-size:14px;text-transform:uppercase;letter-spacing:.04em;background:transparent;transition:background 200ms var(--ease),color 200ms var(--ease)}
.alt-whats:hover{background:var(--navy);color:var(--white)}
.alt-whats svg{width:18px;height:18px}

/* ---------- Renovacao (/renovacao) ---------- */
.decisao{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.decisao .card{display:flex;flex-direction:column;gap:14px;padding:32px}
.decisao .card h3{font-family:'DM Sans','Nunito',sans-serif;font-size:26px;font-weight:900;letter-spacing:-.02em;line-height:1.05}
.decisao .card p{font-size:15px;line-height:1.6}
/* Os dois botoes do cartao ocupam a largura: com "prefiro sair" curto e o
   outro comprido, um pill apertado ao lado de um largo parecia erro. */
.decisao .card .cta-btn,.decisao .card .alt-whats{margin-top:auto;justify-content:center;width:100%;text-align:center}
.decisao .card--fica{background:var(--navy);color:var(--white);border-color:var(--navy)}
.decisao .card--fica p{color:var(--on-navy)}
.decisao .card--fica .k{color:var(--orange-txt)}
.decisao .k{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--navy)}

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

/* iOS 14 e anteriores nao entendem aspect-ratio: sem isto a foto colapsa e o
   cartao do atleta fica sem altura. */
@supports not (aspect-ratio: 4 / 5){
  .atleta-foto{height:0;padding-top:125%}
  .atleta-foto img{position:absolute;inset:0;height:100%}
  .video-quadro{height:0;padding-top:56.25%}
}

/* ---------- Selecao encerrada ----------
   Cartao no lugar do formulario (index) e dos botoes de decisao (renovacao).
   Mesmo branco puro e sombra do form.espera, para a coluna nao mudar de peso. */
form.espera[hidden]{display:none}
.encerrado{background:#fff;border:1px solid var(--border-strong);border-top:3px solid var(--orange);border-radius:var(--r-lg);padding:32px;box-shadow:var(--shadow-soft)}
/* Navy, nao --orange-txt: aquele tom e para texto sobre o azul e some no branco. */
.encerrado .k{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--navy);margin-bottom:12px}
.encerrado h3{font-size:22px;line-height:1.25;margin:0 0 14px;color:var(--ink)}
.encerrado p{font-size:16px;line-height:1.65;color:var(--gray-900);margin:0 0 14px}
.encerrado-ctas{display:flex;align-items:center;flex-wrap:wrap;gap:14px 24px;margin-top:22px}
.encerrado-link{display:inline-flex;align-items:center;gap:8px;color:var(--navy);font-weight:700;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}
.encerrado .legal{margin:22px 0 0;padding-top:18px;border-top:1px solid var(--border);font-size:13px;line-height:1.55;color:var(--gray-700)}
#decisao .encerrado{max-width:760px}

/* ============================================================
   RESPONSIVO
   Fica no fim do arquivo de proposito. Media query nao soma
   especificidade: se a regra de componente vier depois, e ela que
   vale, e o telefone recebe o layout de desktop. Foi o que acontecia
   com .valor, .fatos, .cta-meio e .etapas, escritas depois destes
   blocos. Regra da casa: componente primeiro, media query por ultimo.
   ============================================================ */

/* Revisão de marca da candidatura. Renovação mantém sua apresentação. */
.pagina-candidatura{--font-display:'kit-sans','DM Sans',sans-serif;--font-body:'kit-rounded','Nunito',sans-serif;--on-navy:var(--white);--orange-txt:var(--white);--orange-txt-2:var(--white)}
.pagina-candidatura h1,.pagina-candidatura h2,.pagina-candidatura h3,.pagina-candidatura h4{font-family:var(--font-display);text-transform:uppercase}
.pagina-candidatura .sec h2{line-height:1.12}
.pagina-candidatura .hero-inner{padding:48px 40px 56px;grid-template-columns:1.1fr 1fr;gap:40px;align-items:start}
.pagina-candidatura .hero-inner h1{font-size:clamp(46px,4.8vw,64px);font-weight:800;line-height:1.02;letter-spacing:-.025em;text-wrap:initial}
.pagina-candidatura .hero-manifesto{font-family:var(--font-display);font-size:25px;line-height:1.12;font-weight:700;color:var(--white);margin-top:18px}
.pagina-candidatura .hero-sub{font-size:17px;line-height:1.55;color:var(--white);margin-top:20px;max-width:none}
.pagina-candidatura .hero-ctas{margin-top:24px;gap:12px}
.pagina-candidatura .hero-ctas a{font-size:14px;padding:17px 20px;justify-content:center;letter-spacing:.01em}
.pagina-candidatura .hero-datas{color:var(--white);font-size:13px;line-height:1.5;margin-top:16px}
.pagina-candidatura .hero-troca{color:var(--white);font-size:15px;line-height:1.55;margin-top:22px;padding-top:20px;border-top:1px solid var(--white)}
.pagina-candidatura .hero-vagas{margin-bottom:22px;font-size:13px;background:none;border-color:var(--white);border-radius:var(--r-md)}
.pagina-candidatura .hero-vagas .pill{font-family:var(--font-body);font-size:13px;white-space:nowrap}
.pagina-candidatura .hero-vagas .txt b{color:var(--white)}
.hero-foto{margin:0;align-self:stretch;display:flex;flex-direction:column;min-height:0}
.hero-foto img{width:100%;height:100%;min-height:0;max-height:680px;object-fit:cover;object-position:center;border-radius:var(--r-md)}
.hero-foto figcaption{font-size:13px;line-height:1.5;color:var(--white);padding-top:12px}
.criterios .card{border-top:4px solid var(--navy)}
.criterios .card p{margin-top:12px}
.investimento{margin-top:32px;padding-top:24px;border-top:1px solid var(--white)}
.investimento h4{font-size:22px;line-height:1.15}
.investimento dl{margin:20px 0}
.investimento dl>div{margin-top:16px}
.investimento dt{font-weight:800}
.investimento dd{margin:4px 0 0;font-size:15px;line-height:1.5}
.investimento p{color:var(--white);font-size:14px;line-height:1.55}
.pagina-candidatura .cta-btn:focus-visible,.pagina-candidatura .hero-ghost:focus-visible{outline:3px solid currentColor;outline-offset:4px}
@media (max-width:1100px){
  .pagina-candidatura .hero-inner{grid-template-columns:1.1fr 1fr;gap:28px}
  .pagina-candidatura .hero-inner h1{font-size:46px}
}
@media (max-width:760px){
  .encerrado{padding:24px 20px}
  .encerrado-ctas .cta-btn{width:100%;justify-content:center;text-align:center}
  .pagina-candidatura .hero-inner{padding:28px 20px 40px;grid-template-columns:1fr;gap:28px}
  .pagina-candidatura .hero-inner h1{font-size:clamp(40px,10.5vw,58px)}
  .pagina-candidatura .hero-manifesto{font-size:23px;margin-top:14px}
  .pagina-candidatura .hero-sub{font-size:16px;margin-top:16px}
  .pagina-candidatura .hero-ctas{margin-top:20px}
  .pagina-candidatura .hero-ctas a{width:100%;padding:16px 18px}
  .pagina-candidatura .hero-vagas{font-size:12px;margin-bottom:18px}
  .hero-foto img{height:auto;max-height:none;aspect-ratio:4/5;object-fit:cover}
}

@media (max-width:1100px){
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .acordo{grid-template-columns:1fr}
  .video-bloco{grid-template-columns:1fr;gap:32px}
  .atletas{grid-template-columns:repeat(2,1fr)}
  .prazo{grid-template-columns:1fr;padding:48px 40px}
  .form-bloco{grid-template-columns:1fr;gap:32px}
  .footer-grid{grid-template-columns:1fr 1fr}
  .hero-inner{grid-template-columns:1fr}
  .decisao{grid-template-columns:1fr}
  .decisao .card .alt-whats{padding:14px 18px;letter-spacing:.02em}
}
@media (max-width:760px){
  nav{position:static;backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--white)}
  .nav-links{display:none}
  .nav-burger{display:inline-flex}
  .nav-mobile-actions{display:inline-flex}
  .nav-logo{height:44px}
  .nav-inner{padding:14px 20px;min-height:72px}
  .nav-drawer .nav-link{display:block}
  /* As linhas do hero continuam correndo enquanto a tela e medida e enquanto
     a pessoa le, e no celular isso pesa duas vezes: segura o Speed Index e
     gasta bateria por um efeito que quase nao se percebe numa tela estreita.
     O !important e necessario porque a animacao esta no atributo style de
     cada <line>. O desenho fica, parado. */
  #top line{animation:none !important}
  section.sec{padding-left:20px;padding-right:20px;padding-top:72px;padding-bottom:72px}
  .hero-inner{padding:64px 20px 80px;grid-template-columns:1fr;gap:32px}
  /* Em 380px a pastilha quebrava "7 VAGAS" em duas linhas e a faixa virava
     um bloco de tres linhas antes do titulo. */
  .hero-vagas{font-size:12.5px;gap:8px;padding:5px 12px 5px 5px;border-radius:999px;margin-bottom:22px;line-height:1.25}
  .hero-vagas .pill{font-size:12px;padding:6px 10px;white-space:nowrap}
  .hero-vagas .txt{min-width:0}
  .hero-vagas .txt b{display:none}
  .grid-3,.grid-4{grid-template-columns:1fr}
  .video-play{right:14px;bottom:14px;width:60px;height:60px}
  .video-play svg{width:26px;height:26px}
  /* Duas colunas em vez de faixa deslizante: rolagem horizontal esconde
     metade do time de quem nao percebe que da pra arrastar. */
  .atletas{grid-template-columns:repeat(2,1fr);gap:12px}
  .atleta-nome{font-size:16px;padding:44px 14px 12px}
  .atleta figcaption{padding:14px 14px 16px;gap:10px}
  .atleta figcaption .atleta-bio{font-size:13px}
  .atleta figcaption .atleta-ig{font-size:12px;gap:6px;overflow-wrap:anywhere}
  .atleta figcaption .atleta-ig svg{width:14px;height:14px}
  .atletas-pe{font-size:16px}
  .col{padding:28px 22px}
  .valor{grid-template-columns:1fr;gap:14px}
  .plauto-topo{grid-template-columns:1fr;gap:24px}
  .plauto-foto img{max-height:56vh;object-fit:cover;object-position:50% 22%}
  .plauto-foto figcaption{font-size:12.5px;margin-top:10px}
  .plauto-lead{font-size:17px;line-height:1.6}
  .fatos{columns:1;margin-top:28px}
  .fatos li{font-size:15px;padding:14px 0}
  .plauto .cta-btn{width:100%;justify-content:center;text-align:center;margin-top:28px}
  .cta-meio{margin-top:36px;padding-top:26px;flex-direction:column;align-items:stretch;gap:18px}
  .cta-meio p{font-size:16px}
  .form-bloco.enviado .form-status{padding:26px 22px;font-size:16px}
  .cta-meio .cta-btn{width:100%;justify-content:center;text-align:center}
  /* Terceira versao desta secao no celular. Cartoes empilhados viraram um
     monte de bloco solto; a linha do tempo com trilho e bolinhas trouxe
     enfeite que nenhuma outra secao da pagina tem. Agora e o mesmo padrao
     do resto: linhas separadas por filete, data e titulo na mesma linha,
     uma frase abaixo. Nao ha o que quebrar. */
  .etapas{grid-template-columns:1fr;gap:0;margin-top:8px;border-top:1px solid var(--border)}
  .etapas .et{padding:16px 0;border-top:0;border-bottom:1px solid var(--border)}
  .etapas .et:last-child{border-bottom:0}
  .etapas .quando{display:inline;font-family:'Nunito',system-ui,sans-serif;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--navy)}
  .etapas .quando::after{content:"·";margin:0 7px;color:var(--gray-400)}
  .etapas .et b{display:inline;font-size:16px;line-height:1.45;margin:0}
  .etapas .et span.d{display:block;font-size:14px;line-height:1.55;color:var(--gray-700);margin-top:6px}
  .quote{grid-template-columns:1fr;gap:8px;padding:40px 24px}
  .prazo{padding:40px 24px;border-radius:24px}
  form.espera{padding:24px 20px}
  .dupla{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr;padding:56px 20px 32px}
  .footer-bar{padding:20px}
  .cta-fixo{display:flex;align-items:center;gap:12px;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:8px 14px calc(8px + env(safe-area-inset-bottom));background:rgba(241,241,241,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--border);transform:translateY(130%);transition:transform 320ms var(--ease)}
  .cta-fixo.mostra{transform:translateY(0)}
  .cta-fixo .cf-txt{flex:1;min-width:0;font-size:12px;font-weight:700;line-height:1.3;color:var(--gray-900)}
  .cta-fixo .cf-txt b{display:block;font-size:13px;font-weight:800;color:var(--ink)}
  .cta-fixo .cta-btn{flex:0 0 auto;padding:12px 18px;font-size:13px}
}
@media (max-width:400px){
  section.sec{padding-left:16px;padding-right:16px}
  .atletas{gap:10px}
  .atleta figcaption{padding:12px 12px 14px}
  .atleta figcaption .atleta-ig{font-size:11px}
  .nav-inner{padding:14px 16px}
}

/* ============================================================
   AJUSTES DE DESKTOP
   No desktop sobra largura: estes paragrafos estavam presos numa
   coluna estreita e quebravam em linhas curtas sem necessidade.
   Tudo abaixo de 760px (mobile) fica exatamente como estava.
   ============================================================ */

@media (min-width:761px){
  #embaixadores>.wrap>.sub,
  #programa>.wrap>.sub{max-width:none}
  .atletas-pe{max-width:none}

  /* Bloco das perguntas frequentes centrado na pagina, do mesmo jeito
     que a secao "QUEM E A PLAUTO" (.plauto: 980px + margin:0 auto do .wrap). */
  #regras>.wrap,
  #selecao>.wrap{max-width:980px}
  #regras .faq{max-width:none}
}