/* =========================================================
   PLAYOGA — template de artigo (post único)
   Tudo escopado em #pgArt (id) para vencer o CSS do tema Hello
   e o kit global do Elementor (.elementor-kit-X).
   ========================================================= */
#pgArt{
  --ink:#16224A;--navy:#1B3A93;--blue:#2B7FE8;--sky:#35B8E0;--teal:#2FBFA8;
  --green:#8CC63F;--yellow:#FBB040;--orange:#F5822C;--coral:#F0546A;--purple:#8B5CD6;
  --muted:#5A6785;--line:#E8EDF6;--soft:#F5F8FD;--cream:#FDFAF4;
  --r:18px;--pill:999px;--shadow:0 18px 44px rgba(22,34,74,.09);
  --rainbow:linear-gradient(90deg,var(--blue) 0%,var(--teal) 20%,var(--green) 38%,var(--yellow) 54%,var(--coral) 72%,var(--purple) 88%,var(--sky) 100%);
  font-family:'Nunito',-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--muted);line-height:1.7;font-size:17px;background:#fff;overflow-x:clip;
}
#pgArt *,#pgArt *::before,#pgArt *::after{box-sizing:border-box;}
#pgArt a{text-decoration:none;color:inherit;}
#pgArt h1,#pgArt h2,#pgArt h3,#pgArt h4{font-family:'Fredoka',sans-serif;font-weight:600;color:var(--ink);line-height:1.18;letter-spacing:-.015em;margin:0;}
#pgArt section{position:relative;overflow:hidden;}
#pgArt .pga-w{max-width:1200px;margin:0 auto;padding:0 24px;position:relative;z-index:2;}
#pgArt .pga-blob{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;z-index:0;}
#pgArt .pga-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:13.5px;font-weight:700;color:#8793AD;}
#pgArt .pga-meta i{width:4px;height:4px;border-radius:50%;background:#C5CCDB;}

/* barra de progresso de leitura */
#pgArt .pga-bar{position:fixed;top:0;left:0;height:4px;width:0;background:var(--rainbow);z-index:9999;}

/* ---------- topo ---------- */
#pgArt .pga-hero{
  background:radial-gradient(900px 460px at 14% -10%,rgba(53,184,224,.16),transparent 62%),
    radial-gradient(820px 420px at 88% 4%,rgba(139,92,214,.13),transparent 60%),var(--cream);
  padding:clamp(40px,5vw,64px) 0 clamp(36px,4.2vw,56px);
}
#pgArt .pga-hero .pga-blob{width:360px;height:360px;background:var(--sky);opacity:.15;top:-140px;right:10%;}
#pgArt .pga-hero-w{max-width:880px;}
#pgArt .pga-crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:14px;font-weight:700;color:#8793AD;margin-bottom:22px;}
#pgArt .pga-crumbs a:hover{color:var(--blue);}
#pgArt .pga-crumbs span{color:#C5CCDB;}
#pgArt .pga-pill{display:inline-block;padding:7px 15px;border-radius:var(--pill);background:rgba(43,127,232,.1);color:var(--blue);
  font-size:12.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;margin-bottom:18px;}
#pgArt .pga-hero h1{font-size:clamp(30px,4.2vw,50px);}
#pgArt .pga-lead{margin:18px 0 0;font-size:clamp(17px,1.5vw,20px);color:var(--muted);max-width:68ch;}
#pgArt .pga-by{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:28px;}
#pgArt .pga-av{width:48px;height:48px;border-radius:50%;background:var(--rainbow);display:flex;align-items:center;justify-content:center;
  color:#fff;font:600 18px 'Fredoka',sans-serif;flex:0 0 auto;}
#pgArt .pga-by b{display:block;color:var(--ink);font-size:15.5px;line-height:1.3;}

/* ---------- capa ---------- */
#pgArt .pga-coverwrap{background:linear-gradient(var(--cream) 50%,#fff 50%);padding:0 24px;}
#pgArt .pga-cover{max-width:1000px;margin:0 auto;border-radius:28px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:16/8;background:var(--soft);}
#pgArt .pga-cover img{width:100%;height:100%;object-fit:cover;display:block;max-width:none;border-radius:0;}

/* ---------- leitura ---------- */
/* overflow visível: com overflow:hidden o índice e o compartilhar "sticky" não acompanham a rolagem */
#pgArt .pga-read{padding:clamp(40px,5vw,64px) 0 clamp(56px,6vw,88px);overflow:visible;}
#pgArt .pga-layout{display:grid;grid-template-columns:230px minmax(0,1fr) 56px;gap:clamp(24px,3.4vw,52px);max-width:1120px;margin:0 auto;align-items:start;}
#pgArt .pga-toc{position:sticky;top:110px;font-size:14.5px;}
#pgArt .pga-toc[hidden]{display:none;}
#pgArt .pga-toc h4{font:800 12px 'Nunito',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);margin-bottom:14px;}
#pgArt .pga-toc a{display:block;padding:8px 0 8px 16px;border-left:3px solid var(--line);font-weight:700;color:#7A86A3;line-height:1.4;transition:color .2s,border-color .2s;}
#pgArt .pga-toc a:hover{color:var(--blue);}
#pgArt .pga-toc a.on{border-left-color:var(--blue);color:var(--ink);}
#pgArt .pga-share{position:sticky;top:110px;display:flex;flex-direction:column;gap:10px;}
#pgArt .pga-share a{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line);display:flex;align-items:center;justify-content:center;
  color:var(--navy);background:#fff;transition:all .2s;}
#pgArt .pga-share a:hover{background:var(--blue);border-color:var(--blue);color:#fff;transform:translateY(-2px);}
#pgArt .pga-share a.ok{background:var(--green);border-color:var(--green);color:#fff;}
/* sem índice: o texto ocupa as duas primeiras colunas */
#pgArt .pga-layout.no-toc{grid-template-columns:minmax(0,1fr) 56px;max-width:900px;}

/* ---------- corpo do texto (blocos do Gutenberg) ---------- */
#pgArt .pga-prose{font-size:clamp(17px,1.3vw,18.5px);line-height:1.8;min-width:0;}
#pgArt .pga-prose > *:first-child{margin-top:0;}
#pgArt .pga-prose p{margin:0 0 22px;}
#pgArt .pga-prose h2{font-size:clamp(25px,2.7vw,32px);margin:52px 0 16px;scroll-margin-top:110px;}
#pgArt .pga-prose h3{font-size:clamp(20px,2vw,23px);margin:34px 0 10px;}
#pgArt .pga-prose h4{font-size:18.5px;margin:26px 0 8px;}
#pgArt .pga-prose strong,#pgArt .pga-prose b{color:var(--ink);font-weight:800;}
#pgArt .pga-prose a{color:var(--blue);font-weight:700;border-bottom:2px solid rgba(43,127,232,.25);transition:border-color .2s;word-break:break-word;}
#pgArt .pga-prose a:hover{border-bottom-color:var(--blue);}
/* listas */
#pgArt .pga-prose ul,#pgArt .pga-prose ol{margin:0 0 24px;padding:0;}
#pgArt .pga-prose ul{list-style:none;}
#pgArt .pga-prose ul > li{position:relative;padding-left:32px;margin-bottom:10px;}
#pgArt .pga-prose ul > li::before{content:"";position:absolute;left:6px;top:.68em;width:10px;height:10px;border-radius:50%;background:var(--blue);}
#pgArt .pga-prose ul > li:nth-child(5n+2)::before{background:var(--teal);}
#pgArt .pga-prose ul > li:nth-child(5n+3)::before{background:var(--yellow);}
#pgArt .pga-prose ul > li:nth-child(5n+4)::before{background:var(--coral);}
#pgArt .pga-prose ul > li:nth-child(5n+5)::before{background:var(--purple);}
#pgArt .pga-prose ol{list-style:none;counter-reset:pga;}
#pgArt .pga-prose ol > li{position:relative;padding-left:42px;margin-bottom:12px;counter-increment:pga;}
#pgArt .pga-prose ol > li::before{content:counter(pga);position:absolute;left:0;top:.15em;width:28px;height:28px;border-radius:9px;
  background:rgba(43,127,232,.1);color:var(--blue);font:600 15px/28px 'Fredoka',sans-serif;text-align:center;}
#pgArt .pga-prose li > ul,#pgArt .pga-prose li > ol{margin:10px 0 0;}
/* imagens */
#pgArt .pga-prose .wp-block-image,#pgArt .pga-prose figure{margin:36px 0;}
#pgArt .pga-prose .wp-block-image img{border-radius:var(--r);width:100%;height:auto;display:block;box-shadow:0 10px 30px rgba(22,34,74,.08);}
#pgArt .pga-prose figcaption{margin-top:10px;font-size:14px;line-height:1.5;color:#8793AD;text-align:center;}
/* citação */
#pgArt .pga-prose blockquote,#pgArt .pga-prose .wp-block-quote{margin:36px 0;padding:6px 0 6px 26px;border-left:5px solid var(--yellow);}
#pgArt .pga-prose blockquote p{font:500 clamp(20px,2.2vw,25px)/1.45 'Fredoka',sans-serif;color:var(--ink);margin:0 0 10px;}
#pgArt .pga-prose blockquote cite{font-size:14px;font-style:normal;font-weight:700;color:#8793AD;}
/* destaque (bloco "Destaque"/pullquote e grupos com fundo) */
#pgArt .pga-prose .wp-block-pullquote{margin:36px 0;padding:28px 30px;border-radius:var(--r);background:var(--soft);border:1px solid var(--line);border-left:5px solid var(--teal);text-align:left;}
#pgArt .pga-prose .wp-block-pullquote blockquote{margin:0;padding:0;border:0;}
/* separador */
#pgArt .pga-prose hr,#pgArt .pga-prose .wp-block-separator{border:0;height:4px;width:90px;border-radius:4px;background:var(--rainbow);margin:44px 0;opacity:1;}
/* vídeos e embeds */
#pgArt .pga-prose iframe{max-width:100%;}
#pgArt .pga-prose .wp-block-embed{margin:36px 0;}
#pgArt .pga-prose .wp-block-embed__wrapper{position:relative;}
#pgArt .pga-prose .wp-has-aspect-ratio .wp-block-embed__wrapper{aspect-ratio:16/9;}
#pgArt .pga-prose .wp-has-aspect-ratio iframe{position:absolute;inset:0;width:100%;height:100%;border-radius:var(--r);}
/* referências: parágrafos com fonte "pequena" no editor */
#pgArt .pga-prose .has-small-font-size{font-size:14.5px !important;line-height:1.6;color:#7A86A3;margin-bottom:10px;padding-left:16px;border-left:3px solid var(--line);}
#pgArt .pga-prose .has-small-font-size a{font-weight:800;}

/* tabela nativa do Gutenberg (bloco "Tabela") no mesmo visual das tabelas da Playoga */
#pgArt .pga-prose .wp-block-table{margin:32px 0;overflow-x:auto;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 14px 36px rgba(22,34,74,.07);}
#pgArt .pga-prose .wp-block-table::before{content:"";display:block;height:5px;background:var(--rainbow);}
#pgArt .pga-prose .wp-block-table table{width:100%;border-collapse:collapse;margin:0;font-size:15.5px;line-height:1.55;}
#pgArt .pga-prose .wp-block-table th,#pgArt .pga-prose .wp-block-table td{padding:15px 18px;text-align:left;vertical-align:top;border:0;border-bottom:1px solid var(--line);background:transparent;}
#pgArt .pga-prose .wp-block-table thead th,#pgArt .pga-prose .wp-block-table thead td{font-family:'Fredoka',sans-serif;font-weight:600;color:var(--ink);background:var(--soft);}
#pgArt .pga-prose .wp-block-table thead{border:0;}
#pgArt .pga-prose .wp-block-table tbody tr:last-child td{border-bottom:0;}
#pgArt .pga-prose .wp-block-table tbody tr:nth-child(even) td{background:#FBFCFF;}
#pgArt .pga-prose .wp-block-table tbody td:first-child{color:var(--ink);font-weight:800;}
#pgArt .pga-prose .wp-block-table figcaption{padding:0 18px 14px;}

/* tags e autor */
#pgArt .pga-tags{display:flex;flex-wrap:wrap;gap:8px;margin:40px 0 0;padding-top:24px;border-top:1px solid var(--line);}
#pgArt .pga-tags a{padding:7px 14px;border-radius:var(--pill);background:var(--soft);border:1px solid var(--line);font-size:13.5px;font-weight:800;color:var(--navy);}
#pgArt .pga-tags a:hover{border-color:var(--blue);color:var(--blue);}
#pgArt .pga-author{display:flex;gap:20px;align-items:center;margin-top:36px;padding:26px;border-radius:var(--r);background:var(--cream);border:1px solid var(--line);}
#pgArt .pga-author .pga-av{width:64px;height:64px;font-size:25px;}
#pgArt .pga-author b{display:block;color:var(--ink);font:600 19px 'Fredoka',sans-serif;}
#pgArt .pga-author p{font-size:15.5px;line-height:1.6;margin:4px 0 0;}

/* ---------- CTA ---------- */
#pgArt .pga-cta{background:linear-gradient(135deg,var(--cream),#EFF5FD);text-align:center;padding:clamp(56px,6.5vw,92px) 0;}
#pgArt .pga-cta::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--rainbow);z-index:3;}
#pgArt .pga-cta .pga-blob{width:390px;height:390px;background:var(--yellow);opacity:.18;top:-130px;right:12%;}
#pgArt .pga-cta-w{max-width:800px;}
#pgArt .pga-cta h2{font-size:clamp(26px,3.4vw,40px);}
#pgArt .pga-cta p{margin:16px auto 0;max-width:62ch;font-size:clamp(16px,1.3vw,18px);}
#pgArt .pga-cta-actions{display:flex;gap:14px;justify-content:center;margin-top:30px;flex-wrap:wrap;}
#pgArt a.pga-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 30px;border-radius:var(--pill);
  font-size:16.5px;font-weight:800;line-height:1.2;transition:transform .2s,box-shadow .2s,border-color .2s,color .2s;}
#pgArt a.pga-btn-warm{background:linear-gradient(120deg,var(--yellow),var(--orange));color:#3B2200;box-shadow:0 12px 28px rgba(245,130,44,.30);}
#pgArt a.pga-btn-warm:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(245,130,44,.42);color:#3B2200;}
#pgArt a.pga-btn-ghost{background:#fff;color:var(--ink);border:2px solid var(--line);}
#pgArt a.pga-btn-ghost:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-3px);}

/* ---------- continue lendo ---------- */
#pgArt .pga-rel{background:var(--soft);padding:clamp(56px,6.5vw,88px) 0;}
#pgArt .pga-rel h2{font-size:clamp(25px,3vw,36px);text-align:center;margin-bottom:34px;}
#pgArt .pga-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
#pgArt .pga-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff;transition:transform .25s,box-shadow .25s;}
#pgArt .pga-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);}
#pgArt .pga-thumb{position:relative;aspect-ratio:16/10;background:linear-gradient(135deg,var(--blue),var(--sky));overflow:hidden;}
#pgArt .pga-thumb img{width:100%;height:100%;object-fit:cover;display:block;max-width:none;transition:transform .5s;}
#pgArt .pga-card:hover .pga-thumb img{transform:scale(1.04);}
#pgArt .pga-thumb-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;}
#pgArt .pga-tag{position:absolute;left:14px;top:14px;padding:6px 13px;border-radius:var(--pill);background:#fff;color:var(--blue);
  font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;}
#pgArt .pga-cb{padding:20px 22px 22px;display:flex;flex-direction:column;gap:12px;flex:1;}
#pgArt .pga-card h3{font-size:19px;font-weight:500;line-height:1.3;}

/* ---------- responsivo ---------- */
@media (max-width:1020px){
  #pgArt .pga-layout,#pgArt .pga-layout.no-toc{grid-template-columns:minmax(0,1fr);max-width:760px;}
  #pgArt .pga-toc{position:static;padding:20px 22px;border:1px solid var(--line);border-radius:var(--r);background:var(--soft);}
  #pgArt .pga-share{position:static;flex-direction:row;}
  #pgArt .pga-grid{grid-template-columns:1fr;max-width:560px;margin:0 auto;}
}
@media (max-width:620px){
  #pgArt{font-size:16px;}
  #pgArt .pga-coverwrap{padding:0 16px;}
  #pgArt .pga-cover{border-radius:20px;aspect-ratio:4/3;}
  #pgArt .pga-w{padding:0 18px;}
  #pgArt .pga-author{flex-direction:column;text-align:center;}
  #pgArt a.pga-btn{width:100%;}
}
@media (prefers-reduced-motion:reduce){
  #pgArt *,#pgArt *::before,#pgArt *::after{transition:none !important;}
}
