/* ============================================================
   Atividade Kids — estilos.css
   Design system compartilhado das páginas internas.
   Paleta + header/rodapé alinhados à landing (landing.html).
   Carregar nas páginas internas (substitui o <style> inline antigo).
   ============================================================ */

:root{
  --paper:      #FBF4E9;
  --paper-2:    #F5EADA;
  --paper-3:    #EFE1CC;
  --ink:        #33271E;
  --ink-soft:   #6C5B4D;
  --ink-faint:  #7D6B5B;   /* 4,66:1 no paper — serve para 13–14 px (era #9A8877, 3,1:1) */
  --ink-deco:   #9A8877;   /* só decoração/ícones, nunca texto */
  /* marca: decorativo, formas, adesivos, ícones, texto ≥ 24 px */
  --coral:      #F2603A;
  --coral-deep: #D9471F;
  --butter:     #F4C34E;
  --sage:       #7C9A5E;
  --clay:       #C9713F;
  --blue:       #4AA3DF;
  /* texto colorido (≥ 4,5:1 sobre paper, paper-2 e branco) */
  --coral-text: #BF3B16;
  --sage-text:  #527037;
  --butter-text:#8A6400;
  --blue-text:  #2A76A9;
  /* botões sólidos com texto branco (≥ 4,5:1) */
  --coral-btn:  #D14320;
  --coral-btn-hover:#BF3B16;
  --sage-btn:   #5B7A3E;
  --sage-btn-hover:#4E6B34;
  /* feedback */
  --ok:#527037;  --ok-bg:#EEF3E6;  --ok-line:#7C9A5E;
  --err:#B83814; --err-bg:#FDECE6; --err-line:#D14320;
  --info:#2A76A9; --info-bg:#DDF0FB;
  /* campos BNCC (texto ≥ 4,5:1 sobre o pastel; TS em mostarda, sem roxo) */
  --eo:#A33A6C; --eo-bg:#FCE1EC; --eo-line:#F0B8CF;
  --cg:#A8561A; --cg-bg:#FDE8D3; --cg-line:#F5C594;
  --ts:#8A6400; --ts-bg:#FBEFC9; --ts-line:#E8CF7A;
  --ef:#2A6F9E; --ef-bg:#DDF0FB; --ef-line:#A9D6EF;
  --et:#4E6B34; --et-bg:#E3F0D8; --et-line:#BBD4A3;
  --line:       rgba(51,39,30,.13);
  --line-soft:  rgba(51,39,30,.08);
  --line-strong:#9A8877;   /* borda de input, ghost, tabs: 3,1:1 no paper */
  --card:       #FFFFFF;
  --tap:48px; --tap-kid:64px;
  --focus:0 0 0 3px var(--paper), 0 0 0 6px var(--coral-btn);
  --head-h:64px;
  --motion:1; --dur:.18s;
  --shadow-sm:  0 1px 2px rgba(51,39,30,.06), 0 4px 14px rgba(51,39,30,.05);
  --shadow-lg:  0 2px 6px rgba(51,39,30,.06), 0 18px 40px rgba(51,39,30,.10);
  --radius:     20px;
  --radius-lg:  28px;
  --display:    "Fredoka", system-ui, sans-serif;
  --body:       "Nunito", system-ui, sans-serif;
  --maxw:       1140px;
}

*,*::before,*::after{ box-sizing:border-box; }
button,input,select,textarea{ font:inherit; color:inherit; }
html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--head-offset, 64px) + 16px); }
@media (prefers-reduced-motion: reduce){
  :root{ --motion:0; --dur:0s; }
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation:none !important; transition:none !important; }
  .celebrate{ display:none !important; }
}

body{
  margin:0;
  font-family:var(--body);
  color:var(--ink);
  background:var(--paper);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:clip;
}
img,svg,canvas,video{ max-width:100%; height:auto; }

/* grão de papel sutil */
body::after{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0; opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.wrap{ position:relative; z-index:1; width:100%; max-width:var(--maxw); margin:0 auto; padding:0 clamp(20px, 4vw, 40px); }

/* ---------- tipografia ---------- */
h1,h2,h3{ font-family:var(--display); line-height:1.14; letter-spacing:-.01em; margin:0; text-wrap:balance; }
h1{ font-size:clamp(1.8rem, 4.5vw, 2.5rem); font-weight:600; }
h2{ font-size:clamp(1.4rem, 3vw, 1.85rem); font-weight:600; }
h3{ font-size:clamp(1.08rem, 2vw, 1.3rem); font-weight:600; }
p{ margin:0; text-wrap:pretty; }
a{ color:var(--coral-text); text-decoration:none; }
a:hover{ color:var(--coral-btn-hover); text-decoration:underline; }
.nav a:hover, .btn:hover, .brand:hover, .site-foot a:hover, .burger__panel a:hover{ text-decoration:none; }
strong{ color:var(--ink); }
.muted{ color:var(--ink-soft); }

/* ---------- botões ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:var(--display); font-weight:600; font-size:1.02rem;
  padding:15px 26px; border-radius:999px; text-decoration:none; text-align:center; max-width:100%;
  border:2px solid transparent; cursor:pointer; line-height:1.25;
  min-height:52px; transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.btn:active{ transform:translateY(1px); }
.btn--coral, .btn--primary{ background:var(--coral-btn); color:#fff; box-shadow:0 8px 22px rgba(209,67,32,.28); }
.btn--coral:hover, .btn--primary:hover{ background:var(--coral-btn-hover); color:#fff; transform:translateY(-2px); box-shadow:0 12px 28px rgba(191,59,22,.32); }
.btn--secondary{ background:var(--paper-2); color:var(--ink); border-color:var(--line-strong); }
.btn--secondary:hover{ background:var(--paper-3); }
.btn--success{ background:var(--sage-btn); color:#fff; }
.btn--success:hover{ background:var(--sage-btn-hover); color:#fff; }
.btn--butter{ background:var(--butter); color:var(--ink); }
.btn--butter:hover{ background:#FFD46B; color:var(--ink); }
.btn[disabled], .btn.is-loading{ opacity:.6; cursor:not-allowed; transform:none; }
.btn--block{ width:100%; }
.btn--ink{ background:var(--ink); color:var(--paper); }
.btn--ink:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(51,39,30,.22); }
.btn--ghost{ background:transparent; color:var(--ink); border-color:var(--line-strong); }
.btn--ghost:hover{ border-color:var(--ink); background:rgba(51,39,30,.04); }
.btn--small{ padding:11px 20px; font-size:.95rem; min-height:44px; }
.btn--kid{ min-height:var(--tap-kid); font-size:1.15rem; padding:0 28px; }
.btn .arr{ transition:transform .18s ease; }
.btn:hover .arr{ transform:translateX(3px); }

/* ---------- navegação (header V2, igual à landing) ---------- */
header.wrap{ position:relative; z-index:100; }
/* cabeçalho único do site (sticky de largura total) */
.site-head{ position:sticky; top:0; z-index:100; background:var(--paper); border-bottom:1px solid var(--line-soft); }
.site-head .nav{ padding-block:8px; min-height:calc(var(--head-h) - 1px); }
.site-head .nav__links{ gap:0; }
.site-head .nav__links > a, .site-head .nav__drop summary{ padding:10px 12px; font-size:.92rem; white-space:nowrap; }
.site-head .nav__links a[aria-current="page"], .site-head .nav__drop[data-atual="1"] summary{ color:var(--ink); box-shadow:inset 0 -3px 0 var(--coral); background:var(--card); }
@media (max-height:700px){ .site-head{ position:static; } }
@media (max-width:1180px){ .site-head .nav__links > a, .site-head .nav__drop summary{ padding:10px 9px; font-size:.88rem; } }
.nav{
  position:relative; z-index:10;
  display:flex; align-items:center; justify-content:space-between;
  padding-block:18px; gap:16px;
}
.brand{ min-width:0; display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--ink); }
.brand__mark{
  width:38px; height:38px; border-radius:12px; background:var(--coral);
  display:grid; place-items:center; flex:none;
  box-shadow:0 4px 12px rgba(242,96,58,.28);
}
.brand__mark svg{ width:22px; height:22px; }
.brand__name{ font-family:var(--display); font-weight:700; font-size:1.22rem; letter-spacing:-.01em; }
.nav__links{ display:flex; gap:26px; align-items:center; }
.nav__links a{ text-decoration:none; color:var(--ink-soft); font-weight:700; font-size:.95rem; }
.nav__links a:hover{ color:var(--ink); }

/* adesivo + trilho pílula (V2) */
.v2 .brand__mark{ transform:rotate(-4deg); border-radius:14px; box-shadow:0 4px 12px rgba(242,96,58,.30), 0 0 0 3px var(--paper), 0 0 0 4px var(--line-soft); }
.v2 .nav__links{ background:var(--paper-2); border:1px solid var(--line-soft); border-radius:999px; padding:5px; gap:2px; }
.v2 .nav__links a{ padding:11px 14px; border-radius:999px; }
.v2 .nav__links a:hover{ background:var(--paper-3); color:var(--ink); }

/* hambúrguer sem JS */
.burger{ position:relative; display:none; flex:none; }
.burger > summary{ list-style:none; cursor:pointer; display:grid; place-items:center; width:48px; height:48px; border-radius:12px; border:1.5px solid var(--line); background:var(--butter); box-shadow:var(--shadow-sm); }
.burger > summary::-webkit-details-marker{ display:none; }
.burger > summary::marker{ content:""; }
.burger__bars{ display:flex; flex-direction:column; gap:5px; }
.burger__bars span{ display:block; width:20px; height:2.5px; background:var(--ink); border-radius:2px; }
.burger[open] .burger__bars span:nth-child(1){ transform:translateY(7.5px) rotate(45deg); }
.burger[open] .burger__bars span:nth-child(2){ opacity:0; }
.burger[open] .burger__bars span:nth-child(3){ transform:translateY(-7.5px) rotate(-45deg); }
.burger__panel{ max-height:calc(100dvh - 80px); overflow-y:auto; -webkit-overflow-scrolling:touch; position:absolute; right:0; top:calc(100% + 8px); width:min(300px, calc(100vw - 40px)); overscroll-behavior:contain; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-lg); padding:8px; z-index:50; }
.burger__panel a{ display:flex; align-items:center; min-height:48px; padding:10px 16px; border-radius:14px; text-decoration:none; color:var(--ink-soft); font-weight:700; font-size:.95rem; transition:background .15s ease, color .15s ease; }
.burger__panel a[aria-current="page"]{ color:var(--ink); background:var(--paper-2); box-shadow:inset 3px 0 0 var(--coral); }
.burger__panel a:hover{ background:var(--paper-2); color:var(--ink); }
.burger__panel .burger__cta{ margin-top:8px; width:100%; min-height:48px; justify-content:center; }
.burger__panel a.burger__cta{ color:#fff; }

.skip{ position:fixed; left:-9999px; }
.skip:focus{ left:16px; top:16px; background:var(--ink); color:var(--paper); padding:10px 16px; border-radius:8px; z-index:200; }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible{ outline:2px solid transparent; box-shadow:var(--focus); }
.burger__panel a:focus-visible, .nav__links a:focus-visible{ box-shadow:var(--focus); }

/* ---------- conteúdo (página de artigo) ---------- */
main.wrap{ padding-top:clamp(22px, 4vw, 40px); padding-bottom:72px; }
main > article{
  max-width:880px; margin:0 auto;
  background:var(--card); border:1px solid var(--line-soft);
  border-radius:var(--radius-lg); padding:clamp(24px, 5vw, 48px);
  box-shadow:var(--shadow-sm);
}
main > article > h1{ font-size:clamp(1.6rem, 4.2vw, 2.35rem); margin:0 0 .4em; }
main > article h2{ margin:2em 0 .6em; padding-top:1em; border-top:1px solid var(--line-soft); font-size:clamp(1.35rem, 2.8vw, 1.7rem); }
main > article h3{ margin:1.5em 0 .4em; }
main > article p{ margin:.7em 0; }
main > article ul, main > article ol{ margin:.7em 0; padding-left:1.4em; }
main > article li{ margin:.4em 0; }
main > article a{ font-weight:700; }
main > article code{ background:rgba(51,39,30,.06); padding:2px 6px; border-radius:6px; font-size:.92em; font-family:ui-monospace, SFMono-Regular, Menlo, monospace; }
blockquote{
  border-left:3px solid var(--butter); margin:16px 0; padding:6px 16px;
  color:var(--ink-soft); background:rgba(244,195,78,.10); border-radius:0 10px 10px 0;
}
.breadcrumb{ font-size:.85rem; color:var(--ink-soft); margin-bottom:14px; }
table{ border-collapse:collapse; width:100%; margin:1em 0; }
th, td{ border:1px solid var(--line-soft); padding:8px 12px; text-align:left; vertical-align:top; }
th{ background:var(--paper-2); font-family:var(--display); font-weight:600; }

/* call-to-action */
.cta{
  margin:2.2em 0 0; background:linear-gradient(135deg, var(--paper), var(--paper-2));
  border:1px solid var(--line-soft); border-radius:var(--radius); padding:22px 24px;
}
.cta strong{ color:var(--coral-text); }
.cta .btn{ margin-top:12px; }

/* ---------- índice (index.html) ---------- */
.idx{ max-width:880px; margin:0 auto; padding:clamp(22px, 4vw, 40px) 20px 72px; }
.idx h1{ font-size:clamp(1.9rem, 5vw, 2.6rem); margin-bottom:.25em; }
.idx > p{ color:var(--ink-soft); font-weight:600; margin-bottom:1.3em; }
.idx ul{ list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.idx li{ margin:0; }
.idx a{
  display:block; padding:14px 18px; background:var(--card); border:1px solid var(--line-soft);
  border-radius:var(--radius); text-decoration:none; color:var(--ink); font-weight:700;
  box-shadow:var(--shadow-sm); transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.idx a:hover{ border-color:var(--coral-btn); transform:translateY(-1px); box-shadow:var(--shadow-lg); color:var(--ink); }

/* ---------- rodapé ---------- */
footer{ border-top:1px solid var(--line); padding:32px 0; position:relative; z-index:1; }
.site-foot{ background:var(--paper-2); padding:44px 0 28px; margin-top:24px; }
.site-foot__grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:28px; }
.site-foot h2{ font-size:.8rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-faint); margin:0 0 10px; font-family:var(--body); }
.site-foot nav a, .site-foot__trust a{ display:block; padding:5px 0; color:var(--ink-soft); font-weight:700; font-size:.92rem; min-height:32px; }
.site-foot nav a:hover, .site-foot__trust a:hover{ color:var(--ink); text-decoration:underline; }
.site-foot__brand p{ color:var(--ink-soft); font-size:.92rem; margin:12px 0 0; max-width:34ch; }
.site-foot__who{ font-size:.85rem !important; color:var(--ink-faint) !important; }
.site-foot__trust ul{ list-style:none; margin:0 0 10px; padding:0; }
.site-foot__trust li{ font-size:.9rem; color:var(--ink-soft); font-weight:700; padding:4px 0; }
.site-foot__trust li::before{ content:"✓ "; color:var(--sage-text); }
.site-foot__legal{ margin-top:28px; padding-top:18px; border-top:1px solid var(--line); color:var(--ink-faint); font-size:.85rem; font-weight:600; display:flex; flex-wrap:wrap; gap:6px 18px; }
.site-foot__legal a{ color:var(--ink-soft); }
@media (max-width:900px){ .site-foot__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .site-foot__grid{ grid-template-columns:1fr; gap:22px; } }
.foot{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.foot p{ color:var(--ink-faint); font-size:.88rem; font-weight:600; }
.foot__links{ display:flex; gap:22px; flex-wrap:wrap; }
.foot__links a{ color:var(--ink-soft); text-decoration:none; font-weight:700; font-size:.88rem; }
.foot__links a:hover{ color:var(--ink); }

/* ---------- responsivo ---------- */
@media (max-width:1100px){
  .nav__links{ display:none; }
  .nav > .btn{ display:none; }
  .burger{ display:block; }
}
@media (max-width:900px){
  h1{ font-size:clamp(1.6rem, 8vw, 2.1rem); }
  h2{ font-size:clamp(1.35rem, 7vw, 1.65rem); }
  h3{ font-size:1.1rem; }
  main > article{ padding:22px 20px; }
}


/* ===== Dropdown 'Atividades' no nav (desktop) ===== */
.nav__drop{ position:relative; }
.nav__drop summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:7px; padding:11px 14px; border-radius:999px; font-family:var(--body); font-weight:700; font-size:.95rem; color:var(--ink-soft); transition:background .15s ease, color .15s ease; }
.nav__drop summary::-webkit-details-marker{ display:none; }
.nav__drop summary::after{ content:"▾"; font-size:.7rem; transition:transform .15s ease; }
.nav__drop[open] summary::after{ transform:rotate(180deg); }
.nav__drop summary:hover{ background:var(--paper-3); color:var(--ink); }
.nav__drop[open] summary{ background:var(--ink); color:var(--paper); }
.nav__drop-panel{ position:absolute; left:0; top:calc(100% + 8px); background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-lg); padding:8px; min-width:220px; max-width:min(340px, calc(100vw - 40px)); max-height:calc(100dvh - var(--head-offset, 64px) - 24px); overflow-y:auto; overscroll-behavior:contain; z-index:70; display:flex; flex-direction:column; }
.nav__links .nav__drop-panel a{ min-height:48px; display:flex; align-items:center; white-space:normal; padding:10px 14px; border-radius:14px; color:var(--ink-soft); text-decoration:none; font-weight:700; font-size:.95rem; }
.nav__links .nav__drop-panel a:hover{ background:var(--paper-2); color:var(--ink); }

/* ===== Submenu 'Atividades' no burger (mobile) ===== */
.burger__sub summary{ list-style:none; display:flex; align-items:center; justify-content:space-between; min-height:48px; padding:10px 16px; border-radius:14px; cursor:pointer; font-family:var(--body); font-weight:700; font-size:.95rem; color:var(--ink-soft); transition:background .15s ease, color .15s ease; }
.burger__sub summary::-webkit-details-marker{ display:none; }
.burger__sub summary::after{ content:"▾"; font-size:.75rem; transition:transform .15s ease; }
.burger__sub[open] summary{ background:var(--paper-2); color:var(--ink); }
.burger__sub[open] summary::after{ transform:rotate(180deg); }
.burger__sub-links{ display:flex; flex-direction:column; margin:2px 0 6px 14px; padding-left:10px; border-left:2px solid var(--line-soft); }
.burger__sub-links a{ min-height:48px; }

/* ============================================================
   Cards de atividades (páginas de atividades por faixa etária)
   ============================================================ */
.ativs{
  display:grid; gap:20px; margin:1.5em 0;
  grid-template-columns:1fr;
}
@media (min-width:720px){ .ativs{ grid-template-columns:1fr 1fr; } }

.ativ{
  position:relative;
  background:var(--card); border:1px solid var(--line);
  border-radius:var(--radius); padding:24px 22px 20px;
  box-shadow:var(--shadow-sm);
  display:flex; flex-direction:column; gap:14px;
  transition:transform .16s ease, box-shadow .16s ease;
}
.ativ:hover{ transform:translateY(-3px); box-shadow:var(--shadow-lg); }
.ativ__tags{ display:flex; flex-wrap:wrap; gap:7px; }
.ativ__tag{
  font-family:var(--display); font-weight:700; font-size:.8rem; letter-spacing:.02em;
  padding:4px 11px; border-radius:999px; border:1px solid var(--line);
  background:var(--paper-2); color:var(--ink-soft); white-space:nowrap;
}
.ativ__tag--eo{ background:var(--eo-bg); color:var(--eo); border-color:var(--eo-line); }
.ativ__tag--cg{ background:var(--cg-bg); color:var(--cg); border-color:var(--cg-line); }
.ativ__tag--ts{ background:var(--ts-bg); color:var(--ts); border-color:var(--ts-line); }
.ativ__tag--ef{ background:var(--ef-bg); color:var(--ef); border-color:var(--ef-line); }
.ativ__tag--et{ background:var(--et-bg); color:var(--et); border-color:var(--et-line); }

.ativ h3{ font-size:1.18rem; margin:0; }
.ativ__mats{ margin:0; font-size:.96rem; }
.ativ__mats strong{ color:var(--ink-soft); }
.ativ__how{ display:flex; flex-direction:column; gap:6px; }
.ativ__lbl{
  font-family:var(--display); font-weight:700; font-size:.76rem;
  text-transform:uppercase; letter-spacing:.08em; color:var(--coral-text);
  margin:0;
}
.ativ ol{ margin:0; padding-left:1.25em; }
.ativ ol li{ margin:.28em 0; font-size:.95rem; }
.ativ__dev{
  margin-top:auto; padding-top:14px; border-top:1px dashed var(--line);
  display:flex; flex-direction:column; gap:6px;
}
.ativ__dev ul{ margin:0; padding-left:1.25em; }
.ativ__dev li{ margin:.22em 0; font-size:.95rem; }
.ativ__campos{ margin:0; font-size:.84rem; color:var(--ink-soft); font-weight:600; }
.ativ__nota{ margin:0; font-size:.88rem; color:var(--ink-soft); }
.ativ__nota a{ font-weight:700; }

/* ============================================================
   Página BNCC (didática: sumário, busca, cards por campo)
   ============================================================ */
.bncc-toc{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:18px 22px; margin:1.2em 0; box-shadow:var(--shadow-sm);
}
.bncc-toc h2{ margin:0 0 8px; font-size:1.02rem; }
.bncc-toc ol{ margin:0; padding-left:1.3em; display:grid; gap:4px; }
.bncc-toc li{ margin:0; }
.bncc-toc a{ color:var(--ink); font-weight:700; }
.bncc-toc a:hover{ color:var(--coral-text); }

.bncc-search{ position:relative; margin:1em 0 .4em; }
.bncc-search__icon{ position:absolute; left:18px; top:50%; transform:translateY(-50%); font-size:1.05rem; pointer-events:none; }
.bncc-search__input{
  width:100%; font-family:var(--body); font-size:1rem; font-weight:600; color:var(--ink);
  padding:15px 18px 15px 48px; border-radius:999px; border:2px solid var(--line-strong);
  background:var(--card); box-shadow:var(--shadow-sm); outline:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.bncc-search__input:focus{ border-color:var(--coral-btn); box-shadow:var(--focus); }
.bncc-search__hint{ color:var(--ink-faint); font-size:.82rem; font-weight:600; margin:8px 4px 0; }
.bncc-hit{
  display:flex; gap:12px; align-items:flex-start;
  background:var(--card); border:1px solid var(--line); border-radius:14px;
  padding:12px 16px; margin:8px 0; box-shadow:var(--shadow-sm);
}
.bncc-hit__code{ font-family:var(--display); font-weight:700; font-size:.95rem; white-space:nowrap; padding-top:1px; }
.bncc-hit__campo{ margin:0 0 2px; font-size:.8rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-faint); }
.bncc-hit__desc{ margin:0; font-size:.92rem; color:var(--ink); }
.bncc-hit__desc mark{ background:var(--butter); color:var(--ink); border-radius:4px; padding:0 2px; }
.bncc-empty{ color:var(--ink-soft); font-weight:600; padding:10px 4px; }

/* 6 direitos */
.direitos{ display:grid; gap:12px; grid-template-columns:1fr; margin:1em 0; padding:0; list-style:none; }
@media (min-width:560px){ .direitos{ grid-template-columns:1fr 1fr; } }
@media (min-width:900px){ .direitos{ grid-template-columns:1fr 1fr 1fr; } }
.direitos li{
  background:var(--paper-2); border:1px solid var(--line-soft); border-radius:16px;
  padding:14px 16px; margin:0;
}
.direitos strong{ font-family:var(--display); font-size:1.02rem; display:block; margin-bottom:2px; }
.direitos span{ color:var(--ink-soft); font-size:.9rem; }

/* 5 campos em cards coloridos */
.campos{ display:grid; gap:18px; margin:1.5em 0; grid-template-columns:1fr; }
@media (min-width:720px){ .campos{ grid-template-columns:1fr 1fr; } }
.campo{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:22px; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; gap:14px;
}
.campo__head{ display:flex; align-items:center; gap:12px; }
.campo__sigla{
  width:52px; height:52px; flex:none; border-radius:14px;
  display:grid; place-items:center; font-family:var(--display); font-weight:700; font-size:1.15rem;
  background:var(--paper-2); color:var(--ink-soft);
}
.campo--eo .campo__sigla{ background:var(--eo-bg); color:var(--eo); }
.campo--cg .campo__sigla{ background:var(--cg-bg); color:var(--cg); }
.campo--ts .campo__sigla{ background:var(--ts-bg); color:var(--ts); }
.campo--ef .campo__sigla{ background:var(--ef-bg); color:var(--ef); }
.campo--et .campo__sigla{ background:var(--et-bg); color:var(--et); }
.campo h3{ font-size:1.18rem; margin:0; }
.campo__what{ color:var(--ink-soft); font-size:.9rem; font-weight:600; margin:0; }
.campo table{ margin:0; font-size:.9rem; }
.campo td{ padding:9px 11px; }
.campo td:first-child{ font-family:var(--display); font-weight:700; white-space:nowrap; color:var(--coral-text); }
.campo .ex{ display:block; margin-top:5px; color:var(--ink-soft); font-size:.85rem; }

/* ==================================================================
   Atividade Kids — SEÇÃO JOGOS (consolidada no estilos.css)
   Classes específicas das 5 páginas de jogos (jogos-*-anos.html).
   Substitui o antigo jogos.css + os <style> inline de cada página.
   Paleta/fontes vêm do :root do estilos.css.
   ================================================================== */

/* coluna dos jogos (mais estreita que o .wrap base) */
.games{ max-width:820px; }
main.games{ padding-top:26px; padding-bottom:60px; }

/* ---------- Hero + seletor de idade ---------- */
.hero{
  margin:0 0 8px; padding:30px 26px;
  background:
    radial-gradient(120% 150% at 100% 0%, #FDE7D8 0%, transparent 55%),
    radial-gradient(120% 150% at 0% 100%, #FDF0DC 0%, transparent 50%),
    var(--card);
  border:1px solid var(--line-soft); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm); position:relative; overflow:hidden;
}
.hero__eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-weight:800; font-size:.74rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--coral-text); margin:0 0 10px;
}
.hero__title{
  font-family:var(--display); font-size:clamp(1.9rem,5.5vw,2.7rem);
  line-height:1.1; letter-spacing:-.01em; margin:0 0 8px; color:var(--ink); font-weight:600;
}
.hero__sub{ color:var(--ink-soft); font-size:1.05rem; font-weight:600; margin:0; max-width:56ch; }
.agesel{
  display:inline-flex; flex-wrap:wrap; gap:6px; margin-top:20px;
  padding:6px; background:var(--paper-2); border:1px solid var(--line-soft);
  border-radius:18px; max-width:100%;
}
.agetab{
  font-family:var(--display); font-weight:600; font-size:1rem;
  color:var(--ink-soft); text-decoration:none;
  padding:10px 18px; border-radius:14px; transition:all .18s ease;
}
.agetab:hover{ color:var(--ink); background:rgba(255,255,255,.7); }
.agetab.on{ background:var(--coral-btn); color:#fff; box-shadow:0 6px 16px rgba(209,67,32,.28); }
@media (max-width:520px){
  .agesel{ width:100%; justify-content:stretch; }
  .agetab{ flex:1; text-align:center; padding:11px 6px; font-size:.95rem; }
}

/* ---------- título / subtítulo (páginas sem hero) ---------- */
.games > h1{ margin:0 0 6px; }
.games .sub{ color:var(--ink-soft); font-size:1.05rem; margin:0 0 26px; font-weight:600; }

/* ---------- Badges BNCC ---------- */
.bncc, .bncc-badge{
  display:inline-block; vertical-align:middle;
  font-family:var(--display); font-weight:700; font-size:.75rem; letter-spacing:.03em;
  padding:5px 13px; border-radius:999px; border:1px solid var(--line);
  background:var(--et-bg); color:var(--et);
}
.bncc.bncc--eo, .bncc-badge.bncc--eo{ background:var(--eo-bg); color:var(--eo); border-color:var(--eo-line); }
.bncc.bncc--cg, .bncc-badge.bncc--cg{ background:var(--cg-bg); color:var(--cg); border-color:var(--cg-line); }
.bncc.bncc--ts, .bncc-badge.bncc--ts{ background:var(--ts-bg); color:var(--ts); border-color:var(--ts-line); }
.bncc.bncc--ef, .bncc-badge.bncc--ef{ background:var(--ef-bg); color:var(--ef); border-color:var(--ef-line); }
.bncc.bncc--et, .bncc-badge.bncc--et{ background:var(--et-bg); color:var(--et); border-color:var(--et-line); }

/* ---------- Tabs de navegação dos jogos ---------- */
.tabs{ display:flex; gap:8px; flex-wrap:wrap; margin:0 0 20px; }
.tab{
  font-family:var(--display); font-weight:600; font-size:15px;
  padding:12px 18px; border-radius:999px; border:2px solid var(--line);
  background:var(--card); color:var(--ink-soft); cursor:pointer;
  transition:.15s; touch-action:manipulation;
}
.tab.active{ background:var(--coral-btn); color:#fff; border-color:var(--coral-btn); }

/* ---------- Card de jogo ---------- */
.game{
  background:var(--card); border:1px solid var(--line);
  padding:26px; box-shadow:var(--shadow-sm); transition:box-shadow .2s ease;
}
.game:hover{ box-shadow:var(--shadow-lg); }
.games-tabs .game{ display:none; border-radius:var(--radius); min-height:420px; }
.games-tabs .game.active{ display:block; }
.games-list .game{ border-radius:var(--radius-lg); margin:22px 0; border:2px solid var(--paper-3); }

.game h2{
  font-family:var(--display); font-size:1.5rem; margin:0 0 4px; line-height:1.2;
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
.games-list .game h2{ color:var(--coral-text); flex:1; min-width:150px; margin:0; }
.game-head, .ghead{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.game-emoji{ font-size:2.4rem; line-height:1; }
.inst{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  margin:0 0 16px; color:var(--ink-soft); font-weight:600;
}
.inst .txt{ flex:1; min-width:min(220px, 100%); font-weight:700; font-size:1.05rem; margin:0; }

/* ---------- Botões de ouvir / reiniciar ---------- */
.speaker{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  min-height:54px; padding:0 18px; border:none; border-radius:999px;
  background:var(--butter); color:var(--ink); font-size:1.2rem; font-weight:600;
  cursor:pointer; box-shadow:0 3px 0 #D8A33C; flex:none;
  touch-action:manipulation; transition:transform .1s, box-shadow .1s;
}
.speaker:active{ transform:translateY(2px); box-shadow:0 1px 0 #D8A33C; }
.voice{
  font-family:var(--display);
  flex:none; width:54px; height:54px; border-radius:50%; border:2px solid var(--line);
  background:var(--butter); font-size:1.4rem; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:transform .12s; box-shadow:0 2px 5px rgba(0,0,0,.08);
}
.voice:active{ transform:scale(.9); }
.btn-ouvir{
  font-family:var(--display); font-size:1rem; font-weight:600;
  background:var(--butter); color:var(--ink); border:none; border-radius:16px;
  padding:12px 16px; cursor:pointer; box-shadow:0 4px 0 #D8A33C; flex-shrink:0;
}
.btn-ouvir:active{ transform:translateY(2px); box-shadow:0 2px 0 #D8A33C; }
.restart{
  font-family:var(--display); font-weight:600; font-size:14px; min-height:var(--tap);
  padding:9px 16px; border-radius:999px; border:2px solid var(--line);
  background:#fff; color:var(--ink-soft); cursor:pointer; touch-action:manipulation;
}
.reset{
  font-family:var(--display); font-weight:600; font-size:15px;
  padding:12px 22px; border-radius:999px; border:2px solid var(--sage-btn);
  background:#fff; color:var(--sage-text); cursor:pointer; transition:.15s;
}
.reset:active{ background:var(--sage); color:#fff; }
.game-actions{ text-align:center; margin-top:18px; display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* ---------- Área de jogo (stage) ---------- */
.stage{
  position:relative; min-height:280px; border-radius:18px; background:var(--paper-2);
  border:2px dashed rgba(51,39,30,.18); padding:20px;
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:18px;
  touch-action:manipulation; user-select:none; -webkit-user-select:none;
}
.stage--col{ min-height:200px; flex-direction:column; flex-wrap:nowrap; gap:16px; padding:18px; }
.row{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; justify-content:center; }
.target{ font-family:var(--display); font-size:1.1rem; font-weight:600; color:var(--ink); text-align:center; width:100%; }
.target .big{ font-size:3.4rem; line-height:1.1; }

/* feedback / placar */
.feedback{ text-align:center; font-family:var(--display); font-size:1.15rem; font-weight:600; min-height:28px; margin:8px 0 4px; }
.feedback.ok{ color:var(--ok); }
.feedback.no{ color:var(--err); }
.score{ text-align:center; font-family:var(--display); font-weight:600; font-size:1.05rem; color:var(--ink-soft); margin:6px 0 0; }
.score .num{ font-family:var(--display); font-size:2rem; font-weight:700; color:var(--coral); line-height:1; }
.score .lbl{ color:var(--ink-soft); font-size:.8rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.score b{ color:var(--coral); font-size:1.3rem; }

/* confete */
.celebrate{ position:fixed; inset:0; pointer-events:none; z-index:99; display:none; }
.celebrate.show{ display:block; }
.confetti{ position:absolute; width:12px; height:12px; border-radius:3px; animation:fall 1.6s ease-out forwards; }

/* CTA interno (3-4 / 5-6 / extras) */
.games .cta{ text-align:center; }
.games .cta p{ margin:0 0 12px; font-weight:700; }
.games .cta .btn{ background:var(--coral-btn); color:#fff; box-shadow:0 8px 22px rgba(209,67,32,.28); }
.games .cta .btn:hover{ background:var(--coral-btn-hover); transform:translateY(-2px); }

/* keyframes compartilhados */
@keyframes pop{ 0%{transform:scale(1)} 45%{transform:scale(1.28)} 100%{transform:scale(1)} }
@keyframes shake{ 0%,100%{transform:translateX(0)} 25%{transform:translateX(-8px)} 75%{transform:translateX(8px)} }
@keyframes glow{ 0%,100%{box-shadow:0 0 0 0 rgba(242,96,58,.55)} 50%{box-shadow:0 0 0 16px rgba(242,96,58,0)} }
@keyframes fall{ 0%{transform:translateY(-10vh) rotate(0); opacity:1} 100%{transform:translateY(105vh) rotate(560deg); opacity:0} }
@keyframes spin{ to{transform:rotate(360deg)} }
@keyframes popIn{ 0%{transform:scale(.3)} 60%{transform:scale(1.15)} 100%{transform:scale(1)} }
.pop{ animation:pop .35s ease; }
.shake{ animation:shake .3s ease; }
.glow{ animation:glow .6s ease; }

/* ==================================================================
   JOGOS 2–3 ANOS
   ================================================================== */
.colorBox{ width:118px; height:118px; border-radius:26px; display:flex; align-items:center; justify-content:center; font-size:3.4rem; cursor:pointer; box-shadow:0 4px 10px rgba(51,39,30,.16); transition:transform .12s; touch-action:manipulation; }
.colorBox:active{ transform:scale(.94); }
.shapeOpt{ width:112px; height:112px; display:flex; align-items:center; justify-content:center; cursor:pointer; touch-action:manipulation; }
.shapeOpt svg{ width:88px; height:88px; filter:drop-shadow(0 3px 3px rgba(0,0,0,.12)); }
.shapeOpt:active{ transform:scale(.92); }
.countItem{ font-size:3.6rem; cursor:pointer; padding:8px; transition:transform .12s; filter:drop-shadow(0 3px 3px rgba(0,0,0,.12)); touch-action:manipulation; }
.countItem:active{ transform:scale(1.2); }
.countItem.done{ opacity:.3; transform:scale(.75); pointer-events:none; }
.counter{ text-align:center; width:100%; margin-top:4px; }
.counter .num{ font-family:var(--display); font-size:4.2rem; font-weight:700; color:var(--coral); line-height:1; display:block; }
.counter .lbl{ color:var(--ink-soft); font-weight:800; letter-spacing:.08em; text-transform:uppercase; font-size:.85rem; }
.dots{ display:flex; gap:10px; justify-content:center; margin:6px 0 0; }
.dots span{ width:18px; height:18px; border-radius:50%; background:rgba(51,39,30,.15); }
.dots span.on{ background:var(--sage); }
.animal{ width:132px; border-radius:22px; background:#fff; border:2px solid var(--line); padding:16px 8px; text-align:center; cursor:pointer; box-shadow:0 3px 8px rgba(51,39,30,.08); touch-action:manipulation; transition:transform .12s; }
.animal:active{ transform:scale(.94); }
.animal .emoji{ font-size:3.6rem; display:block; line-height:1.1; }
.animal .nome{ font-family:var(--display); font-weight:600; font-size:1rem; color:var(--ink); margin-top:6px; display:block; }
.animal.heard{ border-color:var(--sage); background:#F0F6E9; }
.animal.heard .check{ display:inline-block; }
svg.face{ width:100%; max-width:360px; height:auto; display:block; margin:0 auto; touch-action:manipulation; cursor:pointer; }
.face-part{ cursor:pointer; }
.ring{ fill:none; stroke:var(--butter); stroke-width:9; opacity:0; transition:opacity .25s; }
.ring.show{ opacity:1; animation:pop .4s ease; }

/* ==================================================================
   JOGOS 3–4 ANOS  (memória / mistura de cores / separe por tamanho)
   ================================================================== */
.grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; max-width:540px; margin:0 auto; }
@media (max-width:540px){ .grid{ grid-template-columns:repeat(3,1fr); } }
.grid .card{ aspect-ratio:1; perspective:800px; cursor:pointer; user-select:none; }   /* só a memória (era .card global e vazava para os guias) */
.card-inner{ position:relative; width:100%; height:100%; transition:transform .45s; transform-style:preserve-3d; }
.card.flipped .card-inner{ transform:rotateY(180deg); }
.card-face{ position:absolute; inset:0; backface-visibility:hidden; -webkit-backface-visibility:hidden; border-radius:16px; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 6px rgba(0,0,0,.08); }
.card-front{ background:linear-gradient(135deg,var(--butter),#F7D98B); font-size:2.1rem; color:#fff; font-family:var(--display); }
.card-back{ background:#fff; transform:rotateY(180deg); border:2px solid var(--line); font-size:2.6rem; }
.card.matched .card-back{ border-color:var(--sage); box-shadow:0 0 0 3px rgba(124,154,94,.35); }
.shape{ width:62%; aspect-ratio:1; background:var(--c); }
.shape.circulo{ border-radius:50%; }
.shape.quadrado{ border-radius:6%; }
.shape.triangulo{ clip-path:polygon(50% 0%,100% 100%,0% 100%); }
.shape.losango{ clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%); }
.shape.hexagono{ clip-path:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%); }
.shape.estrela{ clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%); }

/* mistura de cores */
.mix-stage{ text-align:center; padding:18px 10px 10px; margin:0 0 4px; }
.mix-result{ width:130px; height:130px; border-radius:50%; margin:0 auto; display:flex; align-items:center; justify-content:center; font-size:3.2rem; background:#F0E8DA; border:4px solid var(--line); transition:background .3s; box-shadow:0 4px 12px rgba(0,0,0,.08); }
.mix-result.spin{ animation:spin .7s linear; }
.mix-result.pop{ animation:popIn .4s; }
.mix-label{ font-family:var(--display); font-weight:600; font-size:1.15rem; margin:14px 0 6px; min-height:26px; }
.mix-palette{ display:flex; justify-content:center; gap:18px; flex-wrap:wrap; margin-top:6px; }
.mix-swatch{ width:96px; height:110px; border-radius:50%; border:4px solid var(--line); background:#fff; cursor:pointer; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; box-shadow:0 3px 8px rgba(0,0,0,.10); transition:transform .15s,border-color .15s; }
.mix-swatch:active{ transform:scale(.92); }
.mix-swatch.sel{ border-color:var(--ink); transform:scale(1.08); box-shadow:0 0 0 4px rgba(242,96,58,.25); }
.sw-emoji{ font-size:2.4rem; line-height:1; }
.sw-name{ font-family:var(--display); font-weight:600; font-size:.85rem; color:var(--ink-soft); }

/* separe por tamanho (arrastar) */
.zones{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:0 0 16px; }
@media (max-width:420px){ .zones{ grid-template-columns:1fr 1fr; gap:8px; } }
.zone{ border:3px dashed rgba(51,39,30,.2); border-radius:18px; padding:12px; background:var(--paper-2); min-height:140px; transition:.15s; }
.zone.drop{ border-color:var(--sage); background:#EDF2E4; }
.zone-hdr{ font-family:var(--display); font-weight:700; font-size:1.05rem; text-align:center; margin-bottom:8px; }
.zone-items{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; align-items:center; min-height:56px; }
.tray{ display:flex; flex-wrap:wrap; gap:16px; justify-content:center; align-items:center; padding:16px; background:#fff; border:2px solid var(--line); border-radius:16px; min-height:90px; touch-action:none; }
.item{ line-height:1; cursor:grab; filter:drop-shadow(0 3px 3px rgba(0,0,0,.12)); transition:transform .12s; touch-action:none; }
.item:active{ cursor:grabbing; }
.item.dragging{ opacity:.35; }
.item.sorted{ animation:popIn .3s; }
.drag-ghost{ position:fixed; pointer-events:none; z-index:60; transform:translate(-50%,-50%); line-height:1; filter:drop-shadow(0 6px 8px rgba(0,0,0,.25)); }

/* ==================================================================
   JOGOS 4–5 ANOS  (lista empilhada com nav de botões)
   ================================================================== */
.game-tabs{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; padding:6px 0 18px; }
.game-tabs button{
  font-family:var(--display); font-size:1rem; font-weight:600;
  background:var(--card); color:var(--ink);
  border:2px solid var(--butter); border-radius:999px;
  padding:12px 16px; cursor:pointer; box-shadow:0 3px 0 rgba(0,0,0,.06);
  transition:transform .1s;
}
.game-tabs button:active{ transform:scale(.95); }
.game-tabs button:first-child{ border-color:var(--coral); }
.instrucao{
  display:flex; align-items:center; gap:12px; background:rgba(244,195,78,.14);
  border-radius:18px; padding:12px 14px; margin:14px 0; border:2px dashed var(--butter);
}
.instrucao p{ flex:1; margin:0; font-weight:700; font-size:1.08rem; line-height:1.35; }
.options{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; margin-top:8px; }
.opt{
  font-family:var(--display); font-weight:600; min-width:88px; min-height:88px; padding:10px;
  border-radius:20px; border:3px solid var(--paper-3); background:#fff; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  box-shadow:0 5px 0 rgba(0,0,0,.07); transition:transform .12s; touch-action:manipulation;
}
.opt:active{ transform:scale(.93); }
.opt .big{ font-size:2.6rem; line-height:1; }
.opt .lbl{ font-size:.9rem; font-weight:700; color:var(--ink); }
.opt .e{ font-size:2.6rem; line-height:1.1; }
.opt .l{ font-size:.95rem; color:var(--ink-soft); }
.opt.correct, .opt.right{ border-color:var(--sage); background:#eef4e6; animation:pop .45s; }
.opt.wrong{ border-color:var(--err-line); background:var(--err-bg); animation:shake .4s; }
.stars-row{ display:flex; gap:4px; justify-content:center; font-size:1.4rem; margin-top:8px; }
.btn-replay{
  font-family:var(--display); font-weight:600; font-size:1rem;
  background:var(--coral-btn); color:#fff; border:none; border-radius:16px;
  padding:12px 20px; cursor:pointer; box-shadow:0 4px 0 var(--coral-btn-hover); margin-top:8px;
}
.btn-replay:active{ transform:translateY(2px); box-shadow:0 2px 0 var(--coral-deep); }
.letters{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; margin-top:8px; }
.letter{
  font-family:var(--display); font-weight:700; font-size:3.2rem; width:96px; height:96px;
  border-radius:24px; border:3px solid var(--paper-3); background:#fff; cursor:pointer;
  display:flex; align-items:center; justify-content:center; box-shadow:0 5px 0 rgba(0,0,0,.07);
  transition:transform .12s; color:var(--ink);
}
.letter:active{ transform:scale(.93); }
.letter.correct{ border-color:var(--sage); background:#eef4e6; animation:pop .45s; }
.letter.wrong{ border-color:var(--err-line); background:var(--err-bg); animation:shake .4s; }
.stars-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:12px; justify-items:center; margin-top:10px; }
.star{ font-size:2.6rem; cursor:pointer; transition:transform .15s,opacity .2s; filter:grayscale(1) opacity(.45); }
.star:active{ transform:scale(1.3); }
.star.lit{ filter:none; animation:pop .35s; }
.count-display{ text-align:center; font-family:var(--display); font-size:4rem; font-weight:700; color:var(--coral); min-height:4.6rem; line-height:1; }
.seq-row{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; align-items:center; font-size:2.6rem; }
.seq-cell{ width:64px; height:64px; border-radius:16px; background:#fff; border:3px solid var(--paper-3); display:flex; align-items:center; justify-content:center; }
.seq-missing{ width:64px; height:64px; border-radius:16px; border:3px dashed var(--coral); background:rgba(244,195,78,.14); display:flex; align-items:center; justify-content:center; font-size:1.6rem; color:var(--coral); font-family:var(--display); font-weight:700; }
.footer-note{ text-align:center; font-size:.82rem; color:var(--ink-faint); margin-top:26px; line-height:1.5; }

/* ==================================================================
   JOGOS 5–6 ANOS
   ================================================================== */
.wordemoji{ font-size:4rem; line-height:1; }
.slots{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.slot{ width:62px; height:72px; border-radius:14px; border:3px dashed rgba(51,39,30,.25); background:#fff; display:flex; align-items:center; justify-content:center; font-family:var(--display); font-size:2rem; font-weight:700; color:var(--coral); }
.slot.filled{ border-style:solid; border-color:var(--sage); background:#EFF5E6; color:var(--ink); }
.tile{ min-width:62px; height:72px; border-radius:14px; background:var(--coral-btn); color:#fff; font-family:var(--display); font-size:2rem; font-weight:700; display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 4px 0 #c9492a; border:none; touch-action:manipulation; padding:0 6px; }
.tile:active{ transform:translateY(2px); box-shadow:0 2px 0 #c9492a; }
.tile.used{ opacity:.25; pointer-events:none; }
.sumeq{ display:flex; align-items:center; justify-content:center; gap:10px; flex-wrap:wrap; font-family:var(--display); font-size:1.9rem; font-weight:700; }
.grp{ font-size:2.3rem; letter-spacing:1px; line-height:1.3; background:#fff; border-radius:14px; padding:10px 14px; border:2px solid var(--line); }
.seqslots{ display:flex; gap:8px; flex-wrap:wrap; min-height:84px; justify-content:center; }
.seqslot{ width:112px; min-height:80px; border:3px dashed rgba(51,39,30,.25); border-radius:16px; display:flex; flex-direction:column; align-items:center; justify-content:center; background:#fff; font-family:var(--display); gap:2px; padding:6px; }
.seqslot .e{ font-size:2rem; line-height:1; }
.seqslot .l{ font-size:.68rem; color:var(--ink-soft); text-align:center; line-height:1.2; }
.seqslot.filled{ border-style:solid; border-color:var(--sage); background:#EFF5E6; }
.steptile{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:10px 14px; border-radius:16px; background:var(--coral-btn); color:#fff; border:none; cursor:pointer; font-family:var(--display); min-width:120px; box-shadow:0 4px 0 #c9492a; touch-action:manipulation; }
.steptile .e{ font-size:2.2rem; line-height:1; }
.steptile .l{ font-size:.8rem; font-weight:600; line-height:1.2; text-align:center; }
.steptile:active{ transform:translateY(2px); box-shadow:0 2px 0 #c9492a; }
.steptile.used{ opacity:.25; pointer-events:none; }
.food{ font-size:4.2rem; line-height:1; }
.q{ font-family:var(--display); font-size:1.3rem; font-weight:600; text-align:center; margin:0; color:var(--ink); }
.nxt{ background:var(--sage-btn); color:#fff; font-family:var(--display); font-weight:600; padding:13px 24px; border-radius:999px; border:none; cursor:pointer; font-size:1rem; touch-action:manipulation; box-shadow:0 4px 0 #5f7d47; }
.nxt:active{ transform:translateY(2px); box-shadow:0 2px 0 #5f7d47; }
.nxt:disabled{ opacity:.4; cursor:default; box-shadow:none; transform:none; }

/* ==================================================================
   JOGOS EXTRAS 3–6 ANOS
   ================================================================== */
.diferentes{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; max-width:520px; margin:10px auto 0; }
@media (max-width:520px){ .diferentes{ grid-template-columns:repeat(2,1fr); } }
.fig{ aspect-ratio:1; border-radius:18px; border:2px solid var(--line); background:var(--paper); font-size:3.4rem; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:transform .13s,box-shadow .13s; box-shadow:0 2px 6px rgba(0,0,0,.06); }
.fig:active{ transform:scale(.93); }
.fig.win{ background:var(--sage-btn); border-color:var(--sage-btn); box-shadow:0 0 0 4px rgba(124,154,94,.3); }
.fig.err{ animation:shake .4s; }
.trace-stage{ position:relative; width:min(320px,100%); aspect-ratio:1; margin:4px auto 0; touch-action:none; }
.trace-stage canvas{ position:absolute; inset:0; width:100%; height:100%; touch-action:none; }
#traceGuide{ pointer-events:none; }
.trace-bar{ width:min(320px,100%); height:14px; background:var(--paper-2); border-radius:999px; margin:14px auto 0; overflow:hidden; }
.trace-fill{ height:100%; width:0%; background:var(--sage); border-radius:999px; transition:width .15s; }
.trace-info{ text-align:center; font-family:var(--display); font-weight:600; font-size:1.1rem; margin:10px 0 0; }
.cmp{ display:flex; gap:22px; justify-content:center; align-items:center; flex-wrap:wrap; margin:14px 0 4px; }
.cmp-btn{ border-radius:22px; border:2px solid var(--line); background:var(--paper); cursor:pointer; min-width:150px; min-height:190px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; padding:14px; transition:transform .13s,box-shadow .13s; }
.cmp-btn:active{ transform:scale(.95); }
.cmp-btn.win{ background:var(--sage-btn); border-color:var(--sage-btn); box-shadow:0 0 0 4px rgba(124,154,94,.3); }
.cmp-emoji{ line-height:1; }
.cmp-name{ font-family:var(--display); font-weight:600; color:var(--ink-soft); }
.pergunta{ text-align:center; font-family:var(--display); font-weight:700; font-size:1.35rem; margin:8px 0 0; }
.count-stage{ text-align:center; min-height:120px; display:flex; flex-wrap:wrap; gap:6px; align-items:center; justify-content:center; margin:10px 0; }
.count-stage .obj{ font-size:3rem; line-height:1; }
.num-row{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin:6px 0; }
.num-btn{ width:72px; height:72px; border-radius:50%; border:2px solid var(--line); background:var(--paper); font-family:var(--display); font-weight:700; font-size:1.7rem; cursor:pointer; transition:transform .13s; box-shadow:0 2px 6px rgba(0,0,0,.06); }
.num-btn:active{ transform:scale(.9); }
.num-btn.win{ background:var(--sage-btn); color:#fff; border-color:var(--sage-btn); }
.num-btn.err{ animation:shake .4s; }
.som-row{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin:10px 0; }
.som-btn{ width:104px; border-radius:20px; border:2px solid var(--line); background:var(--paper); cursor:pointer; padding:12px 8px; display:flex; flex-direction:column; align-items:center; gap:2px; transition:transform .13s; }
.som-btn:active{ transform:scale(.92); }
.som-btn.lit{ background:var(--butter); border-color:var(--butter); }
.som-emoji{ font-size:2.6rem; line-height:1; }
.som-name{ font-family:var(--display); font-weight:600; font-size:.9rem; color:var(--ink-soft); }
.som-status{ text-align:center; font-family:var(--display); font-weight:600; font-size:1.1rem; min-height:28px; margin:8px 0; }


/* ===== Hub de atividades por idade ===== */
.hub-head{ padding:40px 0 8px; }
.hub-head h1{ margin-bottom:10px; }
.hub-head p{ color:var(--ink-soft); max-width:60ch; }
.hub-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; padding:24px 0 8px; }
.faixa{ display:flex; flex-direction:column; gap:8px; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:22px 20px; text-decoration:none; color:var(--ink); transition:transform .15s ease, box-shadow .15s ease; }
.faixa:hover{ transform:translateY(-3px); box-shadow:var(--shadow-lg); }
.faixa__idade{ font-family:var(--display); font-weight:700; font-size:1.3rem; color:var(--coral-text); }
.faixa__desc{ color:var(--ink-soft); font-size:.95rem; line-height:1.5; }
.faixa__seta{ align-self:flex-end; color:var(--coral); font-weight:800; font-size:1.2rem; }
.hub-outros{ padding:24px 0 48px; }
.hub-outros h2{ margin-bottom:14px; }
.hub-links{ display:flex; flex-wrap:wrap; gap:10px; }
.hub-links a{ background:var(--paper-2); border:1px solid var(--line-soft); border-radius:999px; padding:11px 18px; text-decoration:none; color:var(--ink-soft); font-weight:700; font-size:.95rem; }
.hub-links a:hover{ background:var(--coral-btn); color:#fff; }
@media (max-width:720px){
  .hub-grid{ grid-template-columns:1fr; }
}


/* ==================================================================
   AJUSTES DE CONTRASTE / ALVO (fase 2 — integração)
   ================================================================== */
.tab, .restart, .game-tabs button{ border-color:var(--line-strong); }
.games .ak-bar{ top:var(--head-offset, var(--head-h)); }
@media (max-height:700px){ .games .ak-bar{ top:0; } }
.eyebrow{ display:inline-flex; align-items:center; gap:10px; font-weight:800; font-size:.76rem; letter-spacing:.12em; text-transform:uppercase; color:var(--coral-text); }
.eyebrow::before{ content:""; width:26px; height:2px; background:var(--coral); border-radius:2px; }
.lead{ font-size:clamp(1.05rem, 2vw, 1.2rem); color:var(--ink-soft); font-weight:600; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* ==================================================================
   HOME (index.html) e LANDING (landing.html)
   ================================================================== */
.sec{ padding:clamp(40px, 6vw, 72px) 0; }
.sec--alt{ background:var(--paper-2); border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); }
.sec--ink{ background:var(--ink); color:var(--paper); }
.sec--ink h2, .sec--ink h3{ color:var(--paper); }
.sec--ink p{ color:#E7DCCE; }
.sec--ink .eyebrow{ color:var(--butter); }
.sec--ink .eyebrow::before{ background:var(--butter); }
.sec-head{ max-width:640px; margin-bottom:clamp(24px, 4vw, 40px); }
.sec-head .eyebrow{ margin-bottom:14px; }
.sec-head h2{ margin-bottom:12px; }
.sec-head p{ color:var(--ink-soft); font-size:1.05rem; }

/* hero da home */
.home-hero{ padding-block:clamp(32px, 6vw, 72px) clamp(28px, 4vw, 48px); }
.home-hero__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(24px, 5vw, 56px); align-items:center; }
.home-hero h1{ font-size:clamp(2rem, 4.8vw, 3.3rem); line-height:1.08; margin:16px 0 18px; }
.home-hero h1 em{ font-style:normal; color:var(--coral-btn); }
.home-hero .lead{ max-width:38ch; margin-bottom:26px; }
.home-hero__ctas{ display:flex; flex-wrap:wrap; gap:12px; }
.home-hero__checks{ list-style:none; margin:20px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px 18px; color:var(--ink-soft); font-weight:700; font-size:.92rem; }
.home-hero__checks li::before{ content:"✓ "; color:var(--sage-text); }
.home-hero__art{ display:grid; gap:12px; grid-template-columns:1fr 1fr; align-items:stretch; }
.tile-link{ display:flex; flex-direction:column; gap:6px; padding:18px 16px; border-radius:var(--radius); background:var(--card); border:1px solid var(--line); box-shadow:var(--shadow-sm); color:var(--ink); text-decoration:none; min-height:118px; transition:transform var(--dur) ease, box-shadow var(--dur) ease; }
.tile-link:hover{ transform:translateY(-3px); box-shadow:var(--shadow-lg); color:var(--ink); text-decoration:none; }
.tile-link .emoji{ font-size:1.9rem; line-height:1; }
.tile-link b{ font-family:var(--display); font-size:1.08rem; font-weight:600; }
.tile-link span{ color:var(--ink-soft); font-size:.88rem; }
.tile-link--wide{ grid-column:1 / -1; flex-direction:row; align-items:center; gap:14px; min-height:0; border-color:var(--sage); }

/* 3 caminhos */
.paths{ display:grid; grid-template-columns:repeat(3, 1fr); gap:18px; }
.path{ display:flex; flex-direction:column; gap:10px; padding:26px 24px; border-radius:var(--radius-lg); background:var(--card); border:1px solid var(--line); box-shadow:var(--shadow-sm); color:var(--ink); text-decoration:none; transition:transform var(--dur) ease, box-shadow var(--dur) ease; }
.path:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); color:var(--ink); text-decoration:none; }
.path .emoji{ font-size:2.2rem; line-height:1; }
.path h3{ font-size:1.3rem; }
.path p{ color:var(--ink-soft); font-size:.97rem; flex:1; }
.path .arrow{ color:var(--coral-text); font-weight:800; }
.path--inclusao{ border-color:var(--sage); background:linear-gradient(160deg, #fff, var(--et-bg)); }

/* cartões de idade */
.age-cards{ display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; }
.age-card{ display:flex; flex-direction:column; gap:6px; min-height:96px; padding:18px 20px; border-radius:var(--radius); background:var(--card); border:1px solid var(--line); text-decoration:none; color:var(--ink); transition:transform var(--dur) ease, box-shadow var(--dur) ease; }
.age-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-lg); color:var(--ink); text-decoration:none; }
.age-card b{ font-family:var(--display); font-weight:700; font-size:1.35rem; color:var(--coral-text); }
.age-card span{ color:var(--ink-soft); font-size:.92rem; }
.age-card small{ color:var(--ink-faint); font-weight:700; font-size:.8rem; }

/* cards de jogos */
.game-cards{ display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; }
.game-card{ display:flex; gap:14px; align-items:center; padding:16px 18px; border-radius:var(--radius); background:var(--card); border:1px solid var(--line); color:var(--ink); text-decoration:none; transition:transform var(--dur) ease, box-shadow var(--dur) ease; }
.game-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-lg); color:var(--ink); text-decoration:none; }
.game-card .emoji{ font-size:2rem; line-height:1; width:56px; height:56px; display:grid; place-items:center; border-radius:16px; background:var(--paper-2); flex:none; }
.game-card b{ font-family:var(--display); font-weight:600; font-size:1.05rem; display:block; }
.game-card span{ color:var(--ink-soft); font-size:.88rem; }

/* bloco inclusão em destaque */
.incl{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(24px, 4vw, 48px); align-items:center; }
.incl__links{ display:grid; gap:10px; }
.incl__links a{ display:flex; align-items:center; gap:12px; padding:14px 16px; border-radius:16px; background:var(--card); border:1px solid var(--line); color:var(--ink); font-weight:700; min-height:56px; }
.incl__links a:hover{ border-color:var(--sage-btn); text-decoration:none; color:var(--ink); }
.incl__links .emoji{ font-size:1.4rem; line-height:1; }
.incl__links small{ display:block; font-weight:600; color:var(--ink-soft); font-size:.85rem; }

/* kit grátis (form) */
.kit-box{ display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(22px, 4vw, 44px); align-items:center; }
.kit-thumbs{ display:flex; gap:14px; justify-content:center; }
.kit-thumb{ flex:1; max-width:220px; text-align:center; text-decoration:none; color:var(--ink); }
.kit-thumb img{ width:100%; height:auto; border-radius:12px; border:1px solid var(--line); box-shadow:var(--shadow-lg); background:#fff; display:block; }
.kit-thumb b{ display:block; font-family:var(--display); font-weight:600; font-size:.98rem; margin-top:10px; }
.kit-thumb span{ display:block; color:var(--ink-faint); font-size:.8rem; font-weight:700; }
.kit-thumb:hover img{ transform:translateY(-3px); }
.kit-what{ list-style:none; margin:14px 0 0; padding:0; display:grid; gap:8px; }
.kit-what li{ padding-left:26px; position:relative; color:var(--ink-soft); font-size:.97rem; }
.kit-what li::before{ content:"✓"; position:absolute; left:0; color:var(--sage-text); font-weight:800; }
.kit-what li b{ color:var(--ink); }

.lead-form{ margin-top:22px; padding:22px; border-radius:var(--radius-lg); background:var(--card); border:1px solid var(--line); box-shadow:var(--shadow-sm); }
.lead-form__row{ display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); gap:12px; }
.lead-form__row > div{ min-width:0; }
.lead-form label{ display:block; font-weight:800; font-size:.82rem; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-soft); margin:0 0 6px; }
.lead-form input, .lead-form select{ width:100%; min-width:0; min-height:52px; padding:12px 16px; border-radius:14px; border:2px solid var(--line-strong); background:#fff; color:var(--ink); font-size:1rem; font-weight:600; }
.lead-form input::placeholder{ color:var(--ink-faint); }
.lead-form input:focus, .lead-form select:focus{ border-color:var(--coral-btn); outline:none; box-shadow:var(--focus); }
.lead-form input[aria-invalid="true"]{ border-color:var(--err-line); background:var(--err-bg); }
.lead-form .btn{ width:100%; margin-top:14px; }
.lead-form__msg{ margin-top:12px; font-weight:700; min-height:1.4em; }
.lead-form__msg.err{ color:var(--err); padding:10px 12px; border-radius:10px; background:var(--err-bg); border-left:3px solid var(--err-line); }
.lead-form__msg.err::before{ content:"⚠ "; }
.lead-form__msg.ok{ color:var(--ok); }
.lead-form__done{ margin-top:22px; padding:22px; border-radius:16px; background:var(--ok-bg); border:2px solid var(--ok-line); }
.lead-form__done h3{ color:var(--ok); margin:0 0 8px; }
.lead-form__done p{ margin:6px 0; }
.lead-form__done .btn{ margin-top:10px; }
.lead-form__note{ margin-top:12px; font-size:.84rem; color:var(--ink-faint); font-weight:600; }
.lead-form__note a{ color:var(--ink-soft); }

/* confiança */
.trust-row{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4, 1fr); gap:12px; }
.trust-row li{ padding:18px 16px; border-radius:16px; background:var(--card); border:1px solid var(--line); color:var(--ink-soft); font-size:.92rem; line-height:1.45; }
.trust-row li b{ display:block; font-family:var(--display); font-size:1.15rem; font-weight:600; color:var(--ink); margin-bottom:4px; }
.trust-row li .n{ font-size:1.9rem; color:var(--coral-text); font-weight:700; }
.trust-note{ margin-top:16px; color:var(--ink-soft); font-size:.92rem; max-width:70ch; }

/* lista de espera / preço */
.plans{ display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:stretch; }
.plan{ position:relative; display:flex; flex-direction:column; gap:12px; padding:28px 26px; border-radius:var(--radius-lg); background:var(--card); border:1px solid var(--line); box-shadow:var(--shadow-sm); }
.plan--ink{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.plan--ink h3, .plan--ink .plan__price{ color:var(--paper); }
.plan--ink p, .plan--ink li{ color:#E7DCCE; }
.plan__price{ font-family:var(--display); font-weight:600; line-height:1; }
.plan__price .big{ font-size:clamp(2rem, 4vw, 2.8rem); }
.plan__price .per{ font-size:1rem; color:var(--ink-faint); }
.plan--ink .plan__price .per{ color:#CDBFB2; }
.plan ul{ list-style:none; margin:0; padding:0; display:grid; gap:8px; flex:1; }
.plan li{ display:flex; gap:10px; font-size:.95rem; color:var(--ink-soft); }
.plan li::before{ content:""; flex:none; width:8px; height:8px; border-radius:50%; background:var(--butter); margin-top:9px; }
.plan .tag{ position:absolute; top:18px; right:18px; font-size:.72rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; padding:6px 10px; border-radius:999px; background:var(--butter); color:var(--ink); }
.plan .btn{ width:100%; }
.kits-table{ margin-top:18px; border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; background:var(--card); }
.kits-table__row{ display:grid; grid-template-columns:2fr 1fr auto; gap:14px; align-items:center; padding:18px 22px; border-top:1px solid var(--line-soft); }
.kits-table__row:first-child{ border-top:0; background:var(--paper-2); font-size:.8rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-faint); }
.kits-table__row b{ font-family:var(--display); font-weight:600; font-size:1.08rem; }
.kits-table__row .desc{ color:var(--ink-soft); font-size:.9rem; }
.kits-table__row .price{ font-family:var(--display); font-weight:600; font-size:1.15rem; }

/* FAQ */
.faq{ max-width:820px; }
.faq details{ background:var(--card); border:1px solid var(--line); border-radius:16px; padding:0 20px; margin-bottom:10px; }
.faq summary{ list-style:none; cursor:pointer; font-family:var(--display); font-weight:600; font-size:1.08rem; padding:16px 0; display:flex; justify-content:space-between; align-items:center; gap:16px; min-height:56px; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; font-size:1.4rem; color:var(--coral-text); flex:none; }
.faq details[open] summary::after{ content:"–"; }
.faq details p{ color:var(--ink-soft); padding:0 0 18px; }

/* CTA final */
.final{ text-align:center; padding-block:clamp(48px, 8vw, 96px); }
.final h2{ max-width:22ch; margin:14px auto 12px; }
.final p{ color:var(--ink-soft); max-width:48ch; margin:0 auto 26px; }
.final__ctas{ display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }

@media (max-width:900px){
  .home-hero__grid, .incl, .kit-box{ grid-template-columns:1fr; }
  .paths, .age-cards, .game-cards{ grid-template-columns:1fr 1fr; }
  .trust-row{ grid-template-columns:1fr 1fr; }
  .plans{ grid-template-columns:1fr; }
}
@media (max-width:600px){
  .paths, .game-cards, .trust-row{ grid-template-columns:1fr; }
  .age-cards{ grid-template-columns:1fr 1fr; }
  .age-card{ min-height:72px; padding:14px 16px; }
  .lead-form__row{ grid-template-columns:1fr; }
  .home-hero__ctas .btn, .final__ctas .btn{ width:100%; }
  .kits-table__row{ grid-template-columns:1fr; gap:6px; }
  .kits-table__row:first-child{ display:none; }
  .kit-thumbs{ flex-direction:row; }
}
@media (max-width:420px){ .age-cards{ grid-template-columns:1fr; } .home-hero__art{ grid-template-columns:1fr; } }

/* ==================================================================
   GUIAS 0–2 (classes próprias, sem colisão com .card/.faixa/.campo)
   ================================================================== */
.guias{ max-width:900px; }
.guias-hero{ background:linear-gradient(135deg, var(--paper), var(--paper-2)); border:1px solid var(--line); border-radius:var(--radius); padding:clamp(22px, 4vw, 34px); margin-bottom:28px; }
.guias-hero h1{ margin:0 0 12px; }
.guias-hero p{ margin:10px 0; color:var(--ink-soft); }
.guias-hero .destaque{ color:var(--ink); font-weight:700; }
.aviso-tela{ display:flex; gap:12px; align-items:flex-start; background:rgba(244,195,78,.16); border:1px solid rgba(244,195,78,.6); border-radius:14px; padding:14px 16px; margin-top:16px; font-weight:700; }
.aviso-tela .icone{ font-size:22px; line-height:1.3; }
.gfaixa{ margin:0 0 36px; }
.gfaixa__titulo{ display:flex; align-items:center; gap:12px; margin:0 0 16px; flex-wrap:wrap; }
.gfaixa__num{ font-family:var(--display); font-weight:700; font-size:1.15rem; color:#fff; border-radius:14px; padding:8px 18px; min-width:88px; text-align:center; background:var(--coral-btn); }
.gfaixa--02 .gfaixa__num{ background:var(--sage-btn); }
.gfaixa__titulo h2{ font-size:clamp(1.3rem, 3vw, 1.6rem); margin:0; }
.gfaixa__titulo .sub{ color:var(--ink-soft); font-size:.9rem; margin:0; }
.guias-grid{ display:grid; grid-template-columns:1fr; gap:18px; }
@media (min-width:640px){ .guias-grid{ grid-template-columns:1fr 1fr; } }
.guia{ background:var(--card); border:1px solid var(--line); border-radius:18px; padding:22px 22px 20px; display:flex; flex-direction:column; box-shadow:var(--shadow-sm); min-width:0; }
.guia__topo{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:10px; }
.guia__num{ font-family:var(--display); font-weight:700; font-size:.95rem; color:var(--ink); background:var(--butter); border-radius:10px; padding:4px 12px; flex-shrink:0; }
.guia h3{ font-size:1.25rem; margin:0; line-height:1.25; }
.guia .bncc{ margin:8px 0 4px; align-self:flex-start; }
.guia .bncc .bncc__campo{ font-weight:600; opacity:.9; }
.guia__rotulo{ font-weight:800; font-size:.8rem; text-transform:uppercase; letter-spacing:.06em; color:var(--coral-text); margin:12px 0 4px; }
.guia__rotulo--sage{ color:var(--sage-text); }
.guia p{ margin:4px 0; }
.guia ol{ margin:6px 0 4px; padding-left:20px; }
.guia li{ margin:4px 0; }
.guia .btn-ouvir{ margin-top:auto; display:inline-flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:var(--tap); background:var(--coral-btn); color:#fff; border:none; border-radius:14px; padding:12px 18px; box-shadow:none; font-family:var(--body); font-weight:800; font-size:.98rem; cursor:pointer; margin-top:16px; }
.guia .btn-ouvir:hover{ background:var(--coral-btn-hover); }
.guia .btn-ouvir:active{ transform:scale(.98); }
.guia .btn-ouvir.falando{ background:var(--sage-btn); }
.guia .onda{ display:inline-flex; align-items:flex-end; gap:2px; height:16px; }
.guia .onda i{ width:4px; background:#fff; border-radius:2px; height:6px; }
.guia .btn-ouvir.falando .onda i{ animation:pulso .5s ease-in-out infinite alternate; }
.guia .btn-ouvir.falando .onda i:nth-child(2){ animation-delay:.12s; }
.guia .btn-ouvir.falando .onda i:nth-child(3){ animation-delay:.24s; }
@keyframes pulso{ from{ height:4px; } to{ height:16px; } }
.guia .fala{ display:none; }
.guia .fala.is-visivel{ display:block; margin-top:10px; padding:12px; border-radius:12px; background:var(--paper-2); color:var(--ink-soft); font-size:.92rem; }
.guias-dica{ background:var(--card); border:1px solid var(--line); border-left:4px solid var(--butter); border-radius:14px; padding:16px 18px; margin-top:8px; color:var(--ink-soft); }

/* ==================================================================
   PÁGINAS LEGAIS (privacidade.html) e 404
   ================================================================== */
.legal{ max-width:760px; }
.legal h2{ margin:1.6em 0 .5em; }
.legal p, .legal li{ color:var(--ink-soft); }
.legal li{ margin:.35em 0; }
.legal .box{ background:var(--paper-2); border:1px solid var(--line); border-radius:16px; padding:16px 20px; margin:1em 0; }
.p404{ text-align:center; padding-block:clamp(48px, 10vw, 120px); }
.p404 .big{ font-family:var(--display); font-size:clamp(4rem, 14vw, 8rem); font-weight:700; color:var(--coral); line-height:1; }
.p404 h1{ margin:12px 0 10px; }
.p404 p{ color:var(--ink-soft); max-width:46ch; margin:0 auto 24px; }
.p404__links{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }

/* ==================================================================
   IMPRESSÃO — a professora imprime a atividade, não o menu
   ================================================================== */
@media print{
  @page{ margin:14mm; }
  body{ background:#fff; color:#000; font-size:11pt; line-height:1.4; }
  body::after, .site-head, .site-foot, .skip, .burger, .btn, .cta, .ak-bar, .ak-gate, .celebrate, .hub-cta, .lead-form, .nav, .agesel, .breadcrumb, .btn-ouvir, .tabs, .game-tabs{ display:none !important; }
  main.wrap, main > article{ max-width:none; padding:0; margin:0; box-shadow:none; border:0; background:#fff; }
  .ativ, .guia, .game, .campo{ break-inside:avoid; box-shadow:none; border:1px solid #999; }
  .ativs, .guias-grid{ grid-template-columns:1fr; }
  .ativ__tag, .bncc, .bncc-badge{ background:#fff !important; color:#000 !important; border:1px solid #000 !important; }
  a{ color:#000; text-decoration:underline; }
  main > article a[href^="http"]::after{ content:" (" attr(href) ")"; font-size:.85em; }
  h1, h2, h3{ break-after:avoid; }
}

/* ===== Marca (fase 4): logo, ícones SVG (assets/icones.svg) e mascote "Broto" (assets/mascote.svg) ===== */
.logo{ display:block; height:auto; width:224px; max-width:100%; }
.site-head .brand{ flex:0 1 224px; }
.logo--foot{ height:36px; width:auto; }
.icon{ display:inline-block; width:1em; height:1em; vertical-align:-.15em; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.icon--tile{ width:32px; height:32px; color:var(--coral-btn); }
.icon--path{ width:40px; height:40px; color:var(--coral-btn); }
.icon--box{ width:56px; height:56px; padding:14px; box-sizing:border-box; border-radius:16px; background:var(--paper-2); color:var(--coral-btn); }
.icon--row{ width:28px; height:28px; color:var(--sage-text); }
.icon--sage{ color:var(--sage-text); }
.icon--ink{ color:var(--ink); }
.mascote{ display:block; height:auto; }
.mascote--hero{ grid-column:1 / -1; justify-self:end; width:clamp(112px, 13vw, 150px); margin:0 8px -10px 0; }
.mascote--kit{ display:none; width:132px; margin:12px auto 0; }
.lead-form__done + .mascote--kit{ display:block; }
.mascote--404{ width:min(240px, 58vw); margin:0 auto 6px; }
.mascote-row{ display:flex; align-items:flex-end; gap:16px; margin:1.6em 0 .4em; }
.mascote-row h2{ margin:0 0 .2em; }
.mascote--incl{ width:112px; flex:none; }
@media (max-width:560px){ .mascote--incl{ width:88px; } .mascote--hero{ width:104px; } }

/* Índice clicável de atividades no topo dos hubs (gerar_atividades.py) */
.indice-ativ{ margin:28px 0 36px; }
.indice-ativ h2{ margin-bottom:6px; }
.tabela-rolavel{ overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--line); border-radius:var(--radius-lg, 14px); background:var(--card); }
.indice-ativ__tabela{ margin:0; min-width:560px; font-size:.95rem; }
.indice-ativ__tabela th{ text-align:left; background:var(--paper-2, #F5EADA); padding:12px 14px; font-size:.8rem; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-soft); }
.indice-ativ__tabela td{ padding:12px 14px; border-top:1px solid var(--line); vertical-align:top; }
.indice-ativ__tabela tr:hover td{ background:rgba(242,96,58,.05); }
.indice-ativ__tabela a{ text-decoration:none; color:var(--coral-text, #BF3B16); }
.indice-ativ__tabela a:hover{ text-decoration:underline; }
.bncc-mini{ font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:.8rem; background:rgba(51,39,30,.06); padding:2px 6px; border-radius:6px; }

/* Página de obrigado (entrega pós-compra Stripe) */
.obrigado{ text-align:center; padding-block:clamp(40px, 8vw, 96px); max-width:720px; }
.obrigado .lead{ color:var(--ink-soft); }
.obrigado__acao{ margin:28px 0; }
.btn--grande{ font-size:1.15rem; padding:18px 32px; }
.obrigado__nota{ font-size:.92rem; color:var(--ink-soft); margin-top:12px; }
.obrigado__erro{ background:rgba(244,195,78,.14); border:1px solid rgba(244,195,78,.5); border-radius:14px; padding:16px 20px; text-align:left; margin:20px 0; }
.obrigado__links{ margin-top:36px; }

/* Colunas e conteúdo longo continuam dentro da tela com zoom e em celulares. */
.home-hero__grid > *, .kit-box > *, .incl > *, .site-foot__grid > *{ min-width:0; }
.site-foot a, .trust-note a, .legal a, .lead-form__msg{ overflow-wrap:anywhere; }
@media (max-width:420px){
  .home-hero__grid{ gap:24px; }
  .lead-form{ padding:18px; }
  .bncc-hit{ flex-wrap:wrap; gap:6px; }
}
@media (forced-colors:active){
  a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible,
  select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible{
    outline:3px solid Highlight; outline-offset:3px;
  }
}

/* ===== Cartilhas grátis (integrar_site.py: CARTILHAS) — seletor, catálogo e CTA compacto ===== */
.kit-picker{ border:0; margin:0 0 16px; padding:0; min-width:0; }
.kit-picker > legend{ font-weight:800; font-size:.82rem; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-soft); padding:0; margin:0 0 8px; }
.kit-picker__grupo{ border:0; margin:0 0 12px; padding:0; min-width:0; }
.kit-picker__grupo > legend{ font-family:var(--display); font-weight:600; font-size:1rem; color:var(--ink); padding:0; margin:0 0 6px; }
.kit-picker__opcoes{ display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap:8px; }
.lead-form .kit-opt{ display:flex; align-items:flex-start; gap:10px; margin:0; padding:12px 14px; min-height:var(--tap); border-radius:14px; border:2px solid var(--line); background:#fff; cursor:pointer; text-transform:none; letter-spacing:0; font-size:1rem; font-weight:600; color:var(--ink); transition:border-color var(--dur) ease, background var(--dur) ease; }
.lead-form .kit-opt:hover{ border-color:var(--line-strong); }
.lead-form .kit-opt input{ width:22px; height:22px; min-height:0; margin:2px 0 0; padding:0; flex:none; accent-color:var(--coral-btn); cursor:pointer; }
.lead-form .kit-opt input:focus{ box-shadow:none; }
.lead-form .kit-opt:has(input:focus-visible){ box-shadow:var(--focus); }
.lead-form .kit-opt:has(input:checked){ border-color:var(--coral-btn); background:#FFF6F1; }
.kit-opt__ic{ width:26px; height:26px; color:var(--coral-btn); margin-top:1px; }
.kit-opt__txt{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.kit-opt__txt b{ font-family:var(--display); font-weight:600; font-size:1rem; line-height:1.25; }
.kit-opt__txt span{ color:var(--ink-soft); font-size:.88rem; line-height:1.35; }
.kit-opt__txt small{ color:var(--ink-faint); font-size:.8rem; font-weight:700; }
.kit-opt__txt em{ font-style:normal; color:var(--butter-text); }

.lead-form--compacta{ margin-top:14px; padding:0; border:0; box-shadow:none; background:transparent; }
.lead-form__inline{ display:flex; flex-direction:column; gap:10px; }
.lead-form--compacta .btn{ width:100%; margin-top:0; }
@media (min-width:560px){ .lead-form__inline{ flex-direction:row; } .lead-form__inline input{ flex:1; } .lead-form--compacta .btn{ width:auto; flex:none; } }

.cta-cartilha{ display:flex; gap:16px; align-items:flex-start; margin:2.4em 0 1em; padding:20px; border-radius:var(--radius-lg); background:var(--card); border:2px solid var(--butter); box-shadow:var(--shadow-sm); }
.cta-cartilha__ic{ width:48px; height:48px; padding:11px; border-radius:14px; background:var(--paper-2); color:var(--coral-btn); display:none; }
.cta-cartilha__corpo{ min-width:0; flex:1; }
.cta-cartilha h2{ margin:8px 0 4px; padding:0; border:0; font-size:clamp(1.2rem, 3vw, 1.45rem); }
.cta-cartilha p{ margin:0; color:var(--ink-soft); }
.cta-cartilha__idade{ display:inline-block; font-weight:800; font-size:.8rem; color:var(--sage-text); }
.cta-cartilha .lead-form__msg{ margin-top:8px; }
.cta-cartilha__mais{ margin-top:10px !important; font-size:.88rem; }
.cta-cartilha .lead-form__done{ margin-top:12px; }
@media (min-width:560px){ .cta-cartilha{ padding:24px; } .cta-cartilha__ic{ display:block; } }

.cartilhas-intro{ max-width:62ch; color:var(--ink-soft); }
.cartilhas-atalhos{ display:flex; flex-wrap:wrap; gap:8px; margin:18px 0 0; padding:0; list-style:none; }
.cartilhas-atalhos a{ display:inline-flex; align-items:center; min-height:44px; padding:8px 16px; border-radius:999px; border:2px solid var(--line-strong); color:var(--ink); font-weight:700; text-decoration:none; }
.cartilhas-atalhos a:hover{ border-color:var(--ink); }
.cartilhas__grupo{ margin:36px 0 14px; scroll-margin-top:calc(var(--head-h) + 12px); }
.cartilhas{ display:grid; grid-template-columns:1fr; gap:16px; }
.cartilha{ display:flex; gap:16px; padding:18px; border-radius:var(--radius); background:var(--card); border:1px solid var(--line); box-shadow:var(--shadow-sm); scroll-margin-top:calc(var(--head-h) + 12px); }
.cartilha__capa{ flex:none; width:72px; }
.cartilha__capa img{ width:100%; height:auto; border-radius:8px; border:1px solid var(--line); display:block; }
.cartilha__ic{ width:72px; height:72px; padding:18px; border-radius:18px; background:var(--paper-2); color:var(--coral-btn); }
.cartilha__corpo{ min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:6px; }
.cartilha__corpo h3{ margin:0; }
.cartilha__corpo p{ margin:0; color:var(--ink-soft); }
.cartilha__selo{ font-size:.74rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--ok); background:var(--ok-bg); padding:3px 10px; border-radius:999px; }
.cartilha__selo--breve{ color:var(--butter-text); background:#FBEFC9; }
.cartilha__meta{ list-style:none; margin:4px 0 8px; padding:0; font-size:.9rem; color:var(--ink-soft); }
.cartilha__meta li{ margin:2px 0; }
.cartilha__meta b{ color:var(--ink); }
.cartilhas-pedido{ scroll-margin-top:calc(var(--head-h) + 12px); max-width:760px; }
@media (min-width:860px){ .cartilhas{ grid-template-columns:1fr 1fr; } .cartilha__capa{ width:96px; } .cartilha__ic{ width:96px; height:96px; padding:26px; } }
@media (max-width:420px){ .cartilha{ flex-direction:column; } }
main > .cta-cartilha{ max-width:880px; margin-left:auto; margin-right:auto; }
.kit-box:has(.kit-picker){ align-items:start; }
@media (min-width:901px){ .home-hero > .kit-box:has(.kit-picker){ grid-template-columns:1.3fr .7fr; } .kit-box:has(.kit-picker) .kit-thumbs{ position:sticky; top:calc(var(--head-h) + 24px); } }

/* Catálogo: pedido dentro do card */
.cartilha__pedir{ width:100%; }
.cartilha__pedir > summary{ list-style:none; display:inline-flex; cursor:pointer; }
.cartilha__pedir > summary::-webkit-details-marker{ display:none; }
.cartilha__pedir[open] > summary{ display:none; }
.cartilha__pedir .lead-form--compacta{ margin-top:4px; }
.cartilha__pedir label{ font-weight:700; font-size:.9rem; }

/* Hub de inclusão: grupo aberto pelo menu (#autismo etc.) e lista de atividades prontas */
.cluster{ scroll-margin-top:calc(var(--head-h, 72px) + 16px); }
.cluster:target{ outline:3px solid var(--butter); outline-offset:4px; }
.cluster__ativ{ margin-top:10px; }
.cluster__ativ > summary{ cursor:pointer; font-weight:800; color:var(--coral-btn); min-height:44px; display:flex; align-items:center; }
.cluster__ativ ul{ margin-top:6px; }

/* Landing (passo 0.3): e-mail e botão antes da lista; a lista de cartilhas fica recolhida em "trocar" */
.kit-trocar{ margin-top:14px; border-top:1px solid var(--line-soft); padding-top:10px; }
.kit-trocar > summary{ cursor:pointer; list-style:none; display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; min-height:44px; font-weight:700; color:var(--ink-soft); }
.kit-trocar > summary::-webkit-details-marker{ display:none; }
.kit-trocar > summary b{ color:var(--ink); }
.kit-trocar__acao{ color:var(--coral-text, #BF3B16); text-decoration:underline; font-weight:800; }
.kit-trocar[open] .kit-trocar__acao{ display:none; }
.kit-trocar .kit-picker{ margin:10px 0 0; }
.lista-espera{ max-width:640px; margin:0 auto; }
.lista-espera h2{ margin:.2em 0 .3em; }
.lista-espera .lead{ margin:0 0 16px; }

/* Rodapé (passo 0.3): dados da empresa numa linha pequena; links com 44 px no celular */
.site-foot__empresa{ margin-top:10px; color:var(--ink-faint); font-size:.78rem; font-weight:600; }
@media (max-width:560px){
  .site-foot nav a, .site-foot__trust a{ min-height:44px; display:flex; align-items:center; padding:0; }
}

/* Sugestão de domínio do e-mail (site.js: "Você quis dizer gmail.com?") e aviso de privacidade nos cards */
.lead-form__msg.sugestao{ color:var(--ink); padding:10px 12px; border-radius:10px; background:#FFF6E0; border-left:3px solid var(--butter); font-weight:600; }
.lead-form__msg.sugestao button{ font:inherit; background:none; border:0; padding:6px 2px; min-height:44px; cursor:pointer; text-decoration:underline; }
.lead-form__msg.sugestao .lead-form__sugestao{ font-weight:800; color:var(--coral-text, #BF3B16); overflow-wrap:anywhere; }
.lead-form__msg.sugestao .lead-form__manter{ display:block; color:var(--ink-soft); font-weight:700; }
.cartilha__pedir .lead-form__note{ margin-top:8px; font-size:.8rem; }

/* Consentimento de novidades (R3: desmarcado, separado do pedido) e campo-armadilha "site" (1.7) */
.lead-form .lead-form__novidades{ display:flex; align-items:flex-start; gap:10px; margin:12px 0 0; min-height:44px; padding:6px 0; text-transform:none; letter-spacing:0; font-size:.92rem; font-weight:600; color:var(--ink-soft); cursor:pointer; }
.lead-form .lead-form__novidades input{ width:22px; height:22px; min-height:0; margin:1px 0 0; padding:0; flex:none; accent-color:var(--coral-btn); cursor:pointer; }
.lead-form .lead-form__novidades input:focus{ box-shadow:none; }
.lead-form .lead-form__novidades input:focus-visible{ outline:3px solid var(--coral-btn); outline-offset:2px; }
.lead-form__hp{ position:absolute !important; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden; }
/* Caixa de sucesso: "Enquanto baixa:" com 2 próximos passos */
.lead-form__done .lead-form__seguir{ margin:14px 0 0; font-weight:800; color:var(--ink); }
.lead-form__done .lead-form__proximos{ margin:4px 0 0; padding:0; list-style:none; }
.lead-form__done .lead-form__proximos li{ margin:0; }
.lead-form__done .lead-form__proximos a{ display:block; padding:8px 0; min-height:44px; font-weight:700; }
.lead-form__done .lead-form__proximos a::after{ content:" →"; }

/* === lote H: atividade === */
/* Página de atividade (equipe/scripts/gerar_atividades.py, passo 2.1): capa, ficha-resumo, ações,
   níveis com "Com mais apoio", BNCC copiável, próximo passo, autoria e folha de impressão. */
.ativ-page{ font-size:1.0625rem; line-height:1.6; }
.ativ-page > :where(p, ul, ol, h2, h3, .ativ-passos, .ativ-observar, .ativ-mais, .ativ-seguranca, .ativ-topo), .ativ-page > :where(.ativ-extra, .ativ-turma) > :where(p, ul, ol, details){ max-width:68ch; }
.ativ-page > .ativ__tags{ margin:0 0 10px; }
.ativ-page .jogar{ margin:0 0 1.5em; }
.ativ-page .em-breve{ color:var(--ink-soft); font-weight:700; border-bottom:1px dashed #7D6B5B; cursor:help; }
.ativ-page .em-breve::after{ content:" (em breve)"; font-weight:600; font-size:.85em; color:#7D6B5B; }
.ativ-topo h1{ font-size:clamp(1.7rem, 5vw, 2.4rem); margin:0; }
.ativ-sub{ margin:.35em 0 0 !important; font-size:1.05rem; color:var(--ink-soft); font-weight:600; }
.ativ-autor{ font-size:.85rem; color:var(--ink-faint); font-weight:600; margin:1.6em 0 .4em; }
.ativ-autor--topo{ margin:.5em 0 1em !important; }
.ativ-capa{ margin:0 0 16px; max-width:640px; }
.ativ-capa img{ display:block; width:100%; height:auto; aspect-ratio:1200/630; border-radius:16px; border:1px solid var(--line-soft); background:var(--paper); }
.ficha-resumo{ margin:0 0 14px; padding:14px 16px; border-radius:16px; background:var(--paper); border:1px solid var(--line-soft); }
.ficha-resumo dl{ margin:0; display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:10px 18px; }
.ficha-resumo__item{ display:grid; grid-template-columns:22px 1fr; column-gap:8px; align-items:start; }
.ficha-resumo__item .icon{ grid-row:span 2; width:22px; height:22px; color:var(--coral-text); margin-top:2px; }
.ficha-resumo__item--largo{ grid-column:1 / -1; }
.ficha-resumo dt{ font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-faint); line-height:1.3; }
.ficha-resumo dd{ margin:0; font-weight:700; line-height:1.4; }
.ativ-acoes{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 8px; }
.ativ-acoes .btn{ padding:10px 16px; font-size:.95rem; min-height:44px; }
.ativ-acoes .btn--primary .icon{ width:20px; height:20px; }
.ativ-seguranca{ display:flex; gap:10px; align-items:flex-start; margin:14px 0; padding:12px 14px; border-left:4px solid var(--coral); background:rgba(242,96,58,.08); border-radius:0 12px 12px 0; color:var(--ink); }
.ativ-seguranca__ic{ width:22px; height:22px; flex:none; color:var(--coral-text); margin-top:3px; }
.ativ-seguranca p{ margin:0 !important; }
.ativ-passos ol > li::marker{ font-family:var(--display); font-weight:600; color:var(--coral-text); }
.ativ-passos li{ padding-left:4px; margin:.6em 0; }
.niveis{ display:grid; gap:12px; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); }
.niveis__card{ position:relative; padding:16px 16px 10px; border-radius:16px; border:1px solid var(--line); background:var(--card); }
.niveis__card h3{ margin:0 0 .2em; font-size:1.08rem; }
.niveis__card p{ margin:.4em 0; }
.niveis__card--facil{ border:2px solid var(--sage); background:var(--et-bg); }
.niveis__selo{ display:inline-block; margin:0 0 8px; padding:3px 10px; border-radius:999px; background:var(--sage-btn); color:#fff; font-size:.8rem; font-weight:800; }
.bncc-copy{ margin:16px 0 0; padding:16px; border-radius:16px; border:1px solid var(--line); background:var(--paper); }
.bncc-copy h3{ margin:0 0 .4em; font-size:1.05rem; }
.bncc-copy ul{ list-style:none; padding:0 !important; margin:0 0 12px !important; }
.bncc-copy li{ margin:.5em 0; }
.bncc-copy li small{ display:block; color:var(--ink-faint); font-weight:700; }
.bncc-copy__msg{ min-height:1.4em; margin:.5em 0 0 !important; font-weight:700; font-size:.92rem; }
.bncc-copy__msg.is-ok{ color:var(--ok); }
.bncc-copy__msg.is-erro{ color:var(--err); }
.ativ-mais > summary{ cursor:pointer; font-weight:800; color:var(--coral-text); min-height:44px; display:flex; align-items:center; }
.proximos{ display:grid; gap:12px; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); }
.prox{ display:flex; flex-direction:column; gap:2px; padding:0 0 12px; border-radius:16px; border:1px solid var(--line); background:var(--card); text-decoration:none; color:var(--ink); overflow:hidden; }
.prox:hover{ border-color:var(--ink-deco); box-shadow:var(--shadow-sm); }
.prox img{ display:block; width:100%; height:auto; aspect-ratio:1200/630; margin:0 0 8px; }
.prox > span, .prox > strong{ padding:0 14px; }
.prox--sem-img{ padding-top:14px; justify-content:center; background:var(--paper); }
.prox__rot{ font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; color:var(--coral-text); }
.prox strong{ font-family:var(--display); font-weight:600; font-size:1.08rem; line-height:1.25; }
.prox__idade{ font-size:.88rem; color:var(--ink-soft); font-weight:600; }
.ativ-page__voltar{ margin-top:1em; font-size:.95rem; }
@media (max-width:560px){
  .ativ-page .breadcrumb{ margin-bottom:8px; }
  .ativ-sub{ font-size:.98rem; }
  .ativ-autor--topo{ font-size:.78rem; margin:.3em 0 .7em !important; }
  .ativ-capa{ margin-bottom:10px; }
  .ativ-acoes{ gap:6px; }
  .ativ-acoes .btn{ flex:1 1 0; padding:8px 10px; font-size:.9rem; }
  .ativ-acoes .btn--primary{ flex-basis:100%; }
  .ativ-acoes__extra{ display:none; }
  .ficha-resumo{ padding:10px 12px; font-size:.95rem; }
  .ficha-resumo dl{ grid-template-columns:1fr 1fr; gap:6px 12px; }
  .ficha-resumo__item{ grid-template-columns:1fr; }
  .ficha-resumo__item .icon{ display:none; }
  .ficha-resumo dt{ font-size:.7rem; }
  .ficha-resumo dd{ line-height:1.3; }
  .ficha-resumo__item--campo, .ficha-resumo__item--largo{ grid-column:1 / -1; }
}
@media print{
  @page{ size:A4; margin:12mm; }
  .ativ-page{ font-size:10pt; line-height:1.35; }
  .ativ-page > *{ max-width:none !important; }
  .ativ-acoes, .ativ-page .jogar, .proximos, .ativ-extra, .ativ-turma > p, .ativ-page__voltar, .cta-cartilha, .faq, .ativ-mais, .bncc-copy__btn, .bncc-copy__msg,
  .ativ-page h2:has(+ .proximos), .ativ-page h2:has(+ .faq), .ativ-autor--topo, .site-head, .site-foot, form{ display:none !important; }
  .ativ-capa img{ max-height:52mm; width:auto; border:1px solid #999; }
  .ficha-resumo, .bncc-copy, .niveis__card{ background:#fff !important; border:1px solid #777; }
  .niveis{ grid-template-columns:1fr 1fr; }
  .niveis__selo{ background:#fff; color:#000; border:1px solid #000; }
  .ativ-seguranca{ background:#fff; border-left:3px solid #000; }
  main > article h2{ margin:.9em 0 .3em; padding-top:.4em; font-size:13pt; }
  .ativ-topo h1{ font-size:18pt; }
  main > article p, main > article li{ margin:.25em 0; }
  .niveis__card, .ativ-seguranca, .bncc-copy, .ficha-resumo{ break-inside:avoid; }
}

/* === lote K === */
/* Promessa, home e confiança (passos 2.6–2.9): rodapé de 3 colunas, Sobre/Contato, menu de 4 itens,
   home nova, catálogo com capa, obrigado e pergunta de perfil (perfil.js). */
.site-foot__grid--k{ grid-template-columns:1.6fr 1fr 1fr; }
.site-foot__selo{ font-size:.86rem !important; font-weight:700; color:var(--ink-soft); }
.site-foot__selo a{ color:var(--ink-soft); text-decoration:underline; }
@media (max-width:900px){ .site-foot__grid--k{ grid-template-columns:1fr 1fr; } .site-foot__grid--k .site-foot__brand{ grid-column:1 / -1; } }
@media (max-width:560px){ .site-foot__grid--k{ grid-template-columns:1fr; } }

/* Sobre e Contato */
.sobre .lead, .contato .lead{ max-width:60ch; }
.sobre__indice{ list-style:none; padding:0; margin:18px 0 8px; display:flex; flex-wrap:wrap; gap:8px; }
.sobre__indice a{ display:inline-flex; align-items:center; min-height:44px; padding:8px 14px; border-radius:999px; border:2px solid var(--line-strong); color:var(--ink); font-weight:700; text-decoration:none; font-size:.92rem; }
.sobre__indice a:hover{ border-color:var(--ink); }
.sobre h2, .contato h2{ scroll-margin-top:calc(var(--head-h) + 16px); }
.sobre__fontes li{ margin:.6em 0; }
.sobre__dados{ display:grid; grid-template-columns:max-content 1fr; gap:8px 18px; margin:0; padding:16px 20px; border-radius:16px; background:var(--paper-2); border:1px solid var(--line); }
.sobre__dados dt{ font-weight:800; color:var(--ink); }
.sobre__dados dd{ margin:0; color:var(--ink-soft); overflow-wrap:anywhere; }
@media (max-width:560px){ .sobre__dados{ grid-template-columns:1fr; gap:2px; } .sobre__dados dd{ margin-bottom:10px; } }
.contato__email{ margin:18px 0 8px; }
.contato__email .btn{ overflow-wrap:anywhere; max-width:100%; }
.contato__casos li{ margin:.8em 0; }
.contato__casos a{ display:inline-block; margin-top:4px; font-weight:700; }

/* Menu de 4 itens (2.7): cabe no desktop a partir de 900 px; no celular "Por idade" vem aberto em 6 botões */
@media (min-width:901px) and (max-width:1100px){
  .nav__links{ display:flex; }
  .nav > .btn{ display:inline-flex; }
  .burger{ display:none; }
}
.burger__titulo{ margin:4px 0 6px; padding:6px 16px 0; font-size:.78rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-faint); }
.burger__idades{ display:grid; grid-template-columns:1fr 1fr; gap:6px; padding:0 4px 6px; }
.burger__panel .burger__idades a{ justify-content:center; min-height:48px; padding:8px 6px; border:1.5px solid var(--line); border-radius:12px; color:var(--ink); background:var(--paper); font-size:.92rem; }
.burger__panel .burger__idades a[aria-current="page"]{ background:var(--ink); color:var(--paper); box-shadow:none; }
.burger__panel{ width:min(320px, calc(100vw - 32px)); }

/* Catálogo de cartilhas com capa real (2.9) */
.cartilha__capa{ width:112px; }
.cartilha__capa img{ aspect-ratio:480/679; border-radius:6px; box-shadow:0 1px 0 var(--line), 0 8px 18px rgba(51,39,30,.12); background:#fff; }
@media (min-width:860px){ .cartilha__capa{ width:140px; } }
@media (max-width:420px){ .cartilha{ flex-direction:row; gap:14px; padding:14px; } .cartilha__capa{ width:96px; } }
.cartilha__dentro{ width:100%; margin-top:4px; }
.cartilha__dentro > summary{ cursor:pointer; display:inline-flex; align-items:center; min-height:44px; font-weight:800; color:var(--coral-text); }
.cartilha__paginas{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:6px; }
.cartilha__paginas img{ width:100%; height:auto; aspect-ratio:360/510; border-radius:6px; border:1px solid var(--line); background:#fff; }
.faq-cartilhas{ max-width:820px; scroll-margin-top:calc(var(--head-h) + 12px); margin-bottom:24px; }
.faq-cartilhas .faq details p a{ font-weight:700; }

/* obrigado.html (2.9): capa, 3 passos, continuações com imagem e pergunta de perfil */
.obrigado__capa{ display:block; width:min(200px, 52vw); height:auto; margin:0 auto 20px; border-radius:8px; box-shadow:0 10px 26px rgba(51,39,30,.16); background:#fff; }
.obrigado__h2{ font-size:clamp(1.25rem, 3vw, 1.5rem); margin:32px 0 12px; }
.obrigado__passos{ text-align:left; max-width:520px; margin:0 auto; padding-left:1.4em; }
.obrigado__passos li{ margin:.5em 0; color:var(--ink-soft); }
.obrigado__passos b{ color:var(--ink); }
.obrigado__seguir{ text-align:left; margin-top:28px; }
.obrigado__seguir .obrigado__h2{ text-align:center; }
.obrigado__perfil{ text-align:left; max-width:560px; margin:24px auto 0; padding:18px 20px; border-radius:16px; background:var(--card); border:1px solid var(--line); }

/* Pergunta de perfil e idade (perfil.js) dentro da caixa de sucesso */
.perfil-q{ margin-top:14px; padding-top:12px; border-top:1px solid var(--ok-line); }
.obrigado__perfil .perfil-q{ margin-top:0; padding-top:0; border-top:0; }
.perfil-q__intro{ margin:0 0 8px !important; font-weight:700; color:var(--ink); }
.perfil-q__grupo{ margin:8px 0 0; }
.perfil-q__rot{ margin:0 0 6px !important; font-size:.82rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-soft); }
.perfil-q__opcoes{ display:flex; flex-wrap:wrap; gap:8px; }
.perfil-q__btn{ min-height:44px; min-width:64px; padding:8px 14px; border-radius:999px; border:2px solid var(--line-strong); background:#fff; color:var(--ink); font-weight:700; font-size:.95rem; cursor:pointer; }
.perfil-q__btn:hover{ border-color:var(--ink); }
.perfil-q__btn[aria-pressed="true"]{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.perfil-q__msg{ min-height:1.4em; margin:8px 0 0 !important; font-weight:700; font-size:.92rem; color:var(--ok); }

/* Home nova (2.8): hero com seletor de idade e 6 blocos; alvo ≤ 5.500 px a 390 px */
.hk-hero{ display:grid; grid-template-columns:1fr; gap:12px; padding-block:clamp(20px, 5vw, 64px) clamp(28px, 5vw, 56px); position:relative; }
.hk-hero h1{ font-size:clamp(1.7rem, 5.6vw, 3.1rem); line-height:1.1; margin:12px 0 12px; max-width:19ch; }
.hk-hero .lead{ max-width:52ch; margin:0 0 18px; font-size:clamp(1rem, 2vw, 1.15rem); }
.hk-idades__rot{ margin:0 0 8px; font-family:var(--display); font-weight:600; font-size:1.1rem; color:var(--ink); }
.hk-idades ul{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; max-width:640px; }
.hk-idades a{ display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:64px; padding:8px 4px; border-radius:16px; background:var(--card); border:2px solid var(--line); box-shadow:var(--shadow-sm); text-decoration:none; color:var(--ink); transition:transform var(--dur) ease, border-color var(--dur) ease; }
.hk-idades a:hover{ border-color:var(--coral-btn); transform:translateY(-2px); color:var(--ink); text-decoration:none; }
.hk-idades b{ font-family:var(--display); font-weight:700; font-size:1.3rem; line-height:1.1; color:var(--coral-text); }
.hk-idades span{ font-size:.8rem; font-weight:700; color:var(--ink-soft); }
.hk-hero__prof{ margin:14px 0 0; }
.hk-hero__prof a{ display:inline-flex; align-items:center; min-height:44px; font-weight:800; color:var(--coral-text); }
.hk-apoio{ list-style:none; margin:6px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:6px 18px; color:var(--ink-soft); font-weight:700; font-size:.9rem; }
.hk-apoio li{ display:flex; align-items:center; gap:6px; }
.hk-apoio .icon{ width:18px; height:18px; color:var(--sage-text); }
.hk-hero__mascote{ display:none; }
@media (min-width:860px){
  .hk-hero{ grid-template-columns:1fr 220px; align-items:center; }
  .hk-hero__mascote{ display:block; width:200px; height:auto; justify-self:end; }
  .hk-idades ul{ grid-template-columns:repeat(6, 1fr); }
}
.home-k .sec{ padding:clamp(32px, 5vw, 64px) 0; }
.hk-cabeca{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:4px 16px; margin-bottom:16px; }
.hk-cabeca h2{ margin:0; font-size:clamp(1.35rem, 3.6vw, 2rem); max-width:30ch; }
.hk-cabeca--col{ flex-direction:column; align-items:flex-start; }
.hk-cabeca--col .eyebrow{ margin-bottom:4px; }
.hk-mais{ display:inline-flex; align-items:center; min-height:44px; font-weight:800; color:var(--coral-text); }
.hk-sub{ margin:-6px 0 16px; color:var(--ink-soft); max-width:60ch; }
.hk-ativs{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (min-width:760px){ .hk-ativs{ grid-template-columns:repeat(3, 1fr); gap:16px; } .hk-ativs--jogos{ grid-template-columns:repeat(4, 1fr); } }
.hk-ativs a{ display:flex; flex-direction:column; gap:2px; height:100%; padding:0 0 12px; border-radius:16px; overflow:hidden; background:var(--card); border:1px solid var(--line); text-decoration:none; color:var(--ink); transition:box-shadow var(--dur) ease, transform var(--dur) ease; }
.hk-ativs a:hover{ box-shadow:var(--shadow-lg); transform:translateY(-2px); color:var(--ink); text-decoration:none; }
.hk-ativs img{ display:block; width:100%; height:auto; aspect-ratio:1200/630; margin:0 0 8px; background:var(--paper); }
.hk-ativs b{ padding:0 12px; font-family:var(--display); font-weight:600; font-size:1rem; line-height:1.25; }
.hk-ativs span{ padding:0 12px; font-size:.85rem; color:var(--ink-soft); font-weight:600; }
.hk-versoes{ display:grid; grid-template-columns:1fr; gap:10px; margin:0 0 16px; }
@media (min-width:700px){ .hk-versoes{ grid-template-columns:1fr 1fr; } }
.hk-versao{ padding:14px 16px; border-radius:16px; border:1px solid var(--line); background:var(--card); }
.hk-versao p{ margin:0; }
.hk-versao__rot{ font-size:.8rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:6px !important; }
.hk-versao--apoio{ border:2px solid var(--sage); background:var(--et-bg); }
.hk-versao--apoio .niveis__selo{ margin:0; text-transform:none; letter-spacing:0; }
.hk-portas{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.hk-portas a{ display:inline-flex; align-items:center; gap:8px; min-height:48px; padding:8px 16px; border-radius:999px; border:2px solid var(--sage); background:var(--card); color:var(--ink); font-weight:700; text-decoration:none; }
.hk-portas a:hover{ background:var(--et-bg); color:var(--ink); text-decoration:none; }
.hk-portas .icon{ width:20px; height:20px; color:var(--sage-text); }
.hk-nota{ margin:12px 0 0; font-size:.9rem; color:var(--ink-soft); }
.hk-prof{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr; gap:10px; }
@media (min-width:600px){ .hk-prof{ grid-template-columns:1fr 1fr; } }
@media (min-width:1000px){ .hk-prof{ grid-template-columns:repeat(4, 1fr); } }
.hk-prof a{ display:grid; grid-template-columns:28px 1fr; column-gap:12px; align-items:start; height:100%; padding:14px 16px; border-radius:16px; background:rgba(251,244,233,.07); border:1px solid rgba(251,244,233,.18); color:var(--paper); text-decoration:none; }
.hk-prof a:hover{ background:rgba(251,244,233,.13); color:var(--paper); text-decoration:none; }
.hk-prof .icon{ grid-row:span 2; width:26px; height:26px; color:var(--butter); margin-top:2px; }
.hk-prof b{ font-family:var(--display); font-weight:600; font-size:1.05rem; }
.hk-prof span{ font-size:.88rem; color:#E7DCCE; }
.hk-capas{ list-style:none; margin:0 0 8px; padding:4px 2px 12px; display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain; }
.hk-capas li{ flex:0 0 116px; scroll-snap-align:start; }
@media (min-width:1000px){ .hk-capas{ overflow:visible; flex-wrap:nowrap; justify-content:space-between; } .hk-capas li{ flex:1 1 0; min-width:0; } }
.hk-capas a{ display:flex; flex-direction:column; gap:6px; text-decoration:none; color:var(--ink); }
.hk-capas img{ display:block; width:100%; height:auto; aspect-ratio:480/679; border-radius:6px; background:#fff; box-shadow:0 1px 0 var(--line), 0 6px 14px rgba(51,39,30,.12); transition:transform var(--dur) ease; }
.hk-capas a:hover img{ transform:translateY(-3px); }
.hk-capas span{ font-size:.82rem; font-weight:700; line-height:1.25; color:var(--ink-soft); }
.hk-form{ max-width:620px; margin-top:8px; padding:16px 18px !important; border:1px solid var(--line) !important; border-radius:var(--radius) !important; background:var(--card) !important; }
.hk-form > label{ text-transform:none; letter-spacing:0; font-size:1rem; color:var(--ink); }
.hk-quem{ display:grid; grid-template-columns:84px 1fr; gap:16px; align-items:start; max-width:820px; }
.hk-quem__mascote{ width:84px; height:auto; }
.hk-quem h2{ margin:0 0 6px; font-size:clamp(1.3rem, 3vw, 1.7rem); }
.hk-quem p{ margin:0 0 8px; color:var(--ink-soft); }
.hk-quem a{ font-weight:700; }
@media (min-width:700px){ .hk-quem{ grid-template-columns:120px 1fr; } .hk-quem__mascote{ width:120px; } }
.mascote--obrigado{ width:min(140px, 36vw); margin:0 auto 8px; }

/* === lote L === */
/* Descoberta (PLANO-MESTRE 2.10, 2.11, 2.13): busca do atividades.html (busca.js), catálogo dos hubs de idade,
   cartões de índice, sanfonas, sumário dos pilares de inclusão, hub de inclusão e tabela dos códigos em bncc.html. */

/* ---------- cartões do catálogo (hubs, índice e resultados da busca) ---------- */
.cat-grade{ list-style:none; margin:1em 0 !important; padding:0 !important; display:grid; gap:12px; grid-template-columns:1fr; }
@media (min-width:640px){ .cat-grade{ grid-template-columns:1fr 1fr; } }
@media (min-width:1000px){ .busca .cat-grade{ grid-template-columns:repeat(3,1fr); } }
.cat-grade > li{ margin:0 !important; }
.cat-card[hidden]{ display:none !important; }
.cat-card > a{
  display:grid; grid-template-columns:112px 1fr; gap:12px; align-items:center; height:100%;
  padding:8px 12px 8px 8px; background:var(--card); border:1px solid var(--line); border-radius:16px;
  color:var(--ink); text-decoration:none; font-weight:400 !important; box-shadow:var(--shadow-sm);
  transition:transform var(--dur) ease, box-shadow var(--dur) ease, border-color var(--dur) ease;
}
.cat-card > a:hover{ transform:translateY(-2px); box-shadow:var(--shadow-lg); border-color:var(--line-strong); color:var(--ink); }
.cat-card img, .cat-card__sem{ display:block; width:112px; height:59px; object-fit:cover; border-radius:10px; background:var(--paper-2); }
.cat-card__sem--eo{ background:var(--eo-bg); } .cat-card__sem--cg{ background:var(--cg-bg); } .cat-card__sem--ts{ background:var(--ts-bg); }
.cat-card__sem--ef{ background:var(--ef-bg); } .cat-card__sem--et{ background:var(--et-bg); }
.cat-card__txt{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.cat-card__nome{ font-family:var(--display); font-weight:600; font-size:1rem; line-height:1.25; color:var(--ink); }
.cat-card__meta{ font-size:.82rem; color:var(--ink-faint); font-weight:600; line-height:1.3; }
.cat-card__apoio{ align-self:flex-start; font-size:.72rem; font-weight:800; color:var(--sage-text); background:var(--ok-bg); border:1px solid var(--et-line); border-radius:999px; padding:2px 8px; }

/* ---------- catálogo do hub de idade ---------- */
.catalogo{ margin:1.2em 0 .5em; }
main > article .catalogo > h2{ margin-top:.6em; }
.catalogo__n{ color:var(--ink-faint); font-weight:500; font-size:.8em; }
.cat-filtros{ display:flex; flex-wrap:wrap; gap:8px; margin:.6em 0 .2em; }
.cat-filtros[hidden]{ display:none; }
.cat-pill{
  min-height:44px; padding:8px 14px; border-radius:999px; border:1.5px solid var(--line-strong); background:var(--card);
  font:700 .9rem/1.2 var(--body); color:var(--ink); cursor:pointer; display:inline-flex; align-items:center; gap:6px;
}
.cat-pill span{ font-weight:600; color:var(--ink-faint); font-size:.8rem; }
.cat-pill:hover{ border-color:var(--ink); }
.cat-pill[aria-pressed="true"]{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.cat-pill[aria-pressed="true"] span{ color:rgba(251,244,233,.75); }
.cat-pill--tempo{ border-style:dashed; }
.cat-status{ min-height:1.2em; margin:.3em 0 0 !important; font-size:.88rem; font-weight:700; color:var(--ink-soft); }
.cat-mais{ width:100%; margin-top:4px; }
.catalogo__busca{ font-size:.9rem; color:var(--ink-soft); }
.indice-ativ--cartoes > p{ color:var(--ink-soft); font-size:.95rem; }

/* ---------- sanfonas (marcos, perguntas, texto longo) ---------- */
.sanfona{ border:1px solid var(--line); border-radius:14px; background:var(--card); margin:.6em 0; }
.sanfona > summary{
  list-style:none; cursor:pointer; min-height:48px; padding:12px 44px 12px 16px; position:relative;
  font-family:var(--display); font-weight:600; font-size:1.02rem; color:var(--ink);
}
.sanfona > summary::-webkit-details-marker{ display:none; }
.sanfona > summary::after{ content:"+"; position:absolute; right:16px; top:50%; transform:translateY(-50%); font-size:1.3rem; color:var(--coral-text); }
.sanfona[open] > summary::after{ content:"−"; }
.sanfona[open] > summary{ border-bottom:1px solid var(--line-soft); }
.sanfona > :not(summary){ margin-left:16px !important; margin-right:16px !important; }
.sanfona > :last-child{ margin-bottom:14px !important; }
.sanfona--faq > summary{ font-family:var(--body); font-weight:800; font-size:.98rem; }

/* ---------- tabelas de índice no celular viram lista (ciências, temas) ---------- */
@media (max-width:600px){
  .indice-ativ__tabela, .indice-ativ__tabela tbody, .indice-ativ__tabela tr, .indice-ativ__tabela td{ display:block; width:100%; min-width:0; }
  .indice-ativ__tabela thead{ display:none; }
  .indice-ativ__tabela tr{ border:1px solid var(--line); border-radius:12px; padding:8px 10px; margin:0 0 8px; background:var(--card); }
  .indice-ativ__tabela td{ border:0 !important; padding:2px 0 !important; }
  .indice-ativ .tabela-rolavel{ overflow:visible; }
}

/* ---------- busca do atividades.html ---------- */
.busca{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius-lg); padding:clamp(16px, 3vw, 28px); box-shadow:var(--shadow-sm); margin:16px 0 8px; }
.busca__titulo{ font-size:clamp(1.15rem, 2.4vw, 1.4rem); margin:0 0 .6em; }
.busca__form{ display:grid; gap:12px; }
.busca__campo label, .busca__sel label{ display:block; font-weight:800; font-size:.88rem; margin-bottom:4px; color:var(--ink); }
.busca__campo input{
  width:100%; min-height:52px; padding:12px 18px; border-radius:999px; border:2px solid var(--line-strong);
  font:600 1.05rem var(--body); color:var(--ink); background:var(--paper);
}
.busca__campo input:focus{ border-color:var(--coral-btn); }
.busca__filtros{ display:grid; gap:10px; grid-template-columns:1fr 1fr; align-items:end; }
@media (min-width:900px){ .busca__filtros{ grid-template-columns:1fr 1.4fr 1fr auto; } }
.busca__sel select{
  width:100%; min-height:48px; padding:10px 12px; border-radius:12px; border:1.5px solid var(--line-strong);
  font:600 .95rem var(--body); color:var(--ink); background:var(--card);
}
.busca__check{ display:flex; align-items:center; gap:8px; min-height:48px; font-weight:700; font-size:.95rem; cursor:pointer; }
.busca__check input{ width:22px; height:22px; accent-color:var(--sage-btn); }
.busca__acoes{ display:flex; gap:10px; flex-wrap:wrap; }
.busca__acoes .btn{ min-height:48px; padding:10px 22px; }
.busca__status{ margin:.8em 0 0; font-weight:700; color:var(--ink-soft); min-height:1.2em; }
.busca__status:empty{ margin:0; min-height:0; }
.busca__resultados:empty{ display:none; }
.busca__mais{ width:100%; }
.busca__idades-titulo{ font-size:clamp(1.15rem, 2.4vw, 1.4rem); margin:24px 0 0; }
@media (max-width:600px){
  .busca__filtros{ grid-template-columns:1fr; }
  .busca__acoes .btn--primary{ flex:1; }
}

/* ---------- hub de inclusão ---------- */
.incl-situacoes{ list-style:none; margin:1em 0 !important; padding:0 !important; display:grid; gap:10px; }
@media (min-width:720px){ .incl-situacoes{ grid-template-columns:repeat(3,1fr); } }
.incl-situacoes li{ margin:0 !important; padding:0 !important; }
.incl-situacoes li::before{ content:none !important; }
.incl-situacoes a{
  display:flex; flex-direction:column; gap:4px; height:100%; padding:14px 16px; border-radius:16px;
  background:var(--paper-2); border:1px solid var(--line); color:var(--ink) !important; text-decoration:none;
}
.incl-situacoes a:hover{ border-color:var(--ink); background:var(--card); }
.incl-situacoes b{ font-family:var(--display); font-weight:600; font-size:1.05rem; }
.incl-situacoes span{ font-size:.88rem; color:var(--ink-soft); }
.hub-incl .disclaimer{ margin-top:2em; padding:12px 16px; border-radius:12px; border:1px dashed var(--sage); background:rgba(124,154,94,.07); font-size:.9rem; color:var(--ink-soft); }

/* ---------- pilares de inclusão: resumo e sumário ---------- */
.resumo-topo{ margin:1em 0; padding:14px 18px; border-radius:14px; background:var(--paper-2); border-left:4px solid var(--coral); }
.resumo-topo > p:first-child{ margin:0 0 .3em !important; font-weight:800; font-size:.85rem; letter-spacing:.06em; text-transform:uppercase; color:var(--coral-text); }
.resumo-topo ul{ margin:0 !important; }
.resumo-topo li{ margin:.25em 0 !important; }
.nesta-pagina{ margin:1em 0; padding:12px 16px; border:1px solid var(--line); border-radius:14px; background:var(--card); }
.nesta-pagina summary{ cursor:pointer; font-weight:800; min-height:44px; display:flex; align-items:center; }
.nesta-pagina ol{ margin:.3em 0 .4em !important; columns:2 220px; column-gap:24px; }
.nesta-pagina li{ margin:.2em 0 !important; break-inside:avoid; }
.voltar-topo{ font-size:.85rem; text-align:right; margin:.2em 0 0 !important; }

/* ---------- bncc.html: os 93 códigos com as atividades ---------- */
.campos--largo{ grid-template-columns:1fr !important; }
.bncc-tabela{ width:100%; border-collapse:collapse; }
.bncc-tabela th, .bncc-tabela td{ vertical-align:top; text-align:left; }
.bncc-tabela .bncc-faixa th{ background:var(--paper-2); font-size:.85rem; padding:8px 11px; }
.bncc-tabela tbody th[scope="row"]{ padding:9px 11px; white-space:nowrap; }
.bncc-cod{ font-family:var(--display); font-weight:700; color:var(--coral-text) !important; text-decoration:none; }
.bncc-tabela tr:target{ background:#FFF6D9; outline:2px solid var(--butter); }
.bncc-obj{ margin:0 !important; }
.bncc-decod{ margin:4px 0 0 !important; font-size:.78rem; color:var(--ink-faint); font-weight:600; }
.bncc-ativs{ list-style:none; margin:0 !important; padding:0 !important; }
.bncc-ativs li{ margin:0 0 3px !important; font-size:.86rem; line-height:1.3; }
.bncc-ativs__mais{ font-size:.82rem; }
.bncc-ativs__nada{ font-size:.82rem; color:var(--ink-faint); }
.bncc-col-ativ{ min-width:200px; }
.bncc-col-ativ__rot{ display:none; }
.bncc-uso ol{ counter-reset:none; }
.bncc-uso .exemplo-plano{ background:var(--paper-2); border-radius:12px; padding:12px 14px; font-size:.92rem; }
@media (max-width:700px){
  .bncc-tabela thead{ display:none; }
  .bncc-tabela, .bncc-tabela tbody, .bncc-tabela tr, .bncc-tabela th, .bncc-tabela td{ display:block; width:100%; }
  .bncc-tabela tr{ border-bottom:1px solid var(--line); padding:8px 0; }
  .bncc-tabela .bncc-faixa{ border:0; padding:0; }
  .bncc-tabela tbody th[scope="row"], .bncc-tabela td{ padding:2px 4px !important; border:0 !important; }
  .bncc-col-ativ{ min-width:0; margin-top:4px; }
  .bncc-col-ativ__rot{ display:inline; font-size:.78rem; font-weight:800; color:var(--ink-soft); }
  .bncc-ativs{ display:inline; }
  .bncc-ativs li{ display:inline; }
  .bncc-ativs li + li::before{ content:" · "; color:var(--ink-faint); }
}
@media print{
  .busca, .cat-filtros, .cat-mais, .nesta-pagina{ display:none !important; }
  .sanfona > :not(summary){ display:block !important; }
}
.fontes{ font-size:.9rem; color:var(--ink-soft); }
.fontes li{ margin:.3em 0 !important; }
.busca [hidden], .catalogo [hidden], .cat-card[hidden]{ display:none !important; }

/* ---------- cadastro para baixar (cadastro.js): link da conta, modal, Entrar e Minha área ---------- */
[data-conta][hidden]{ display:none !important; }
.nav__conta{ flex:none; display:inline-flex; align-items:center; min-height:44px; padding:8px 12px; border-radius:999px; color:var(--ink-soft); font-weight:700; font-size:.92rem; text-decoration:none; white-space:nowrap; }
.nav__conta:hover{ color:var(--ink); background:var(--paper-2); }
@media (max-width:1100px){ .nav__conta{ display:none; } }
dialog.cad{ width:min(440px, calc(100vw - 24px)); max-height:calc(100dvh - 24px); overflow-y:auto; overscroll-behavior:contain; padding:0; border:0; border-radius:20px; background:var(--card); color:var(--ink); box-shadow:0 24px 60px rgba(51,39,30,.35); }
dialog.cad::backdrop{ background:rgba(51,39,30,.55); }
.cad__form{ position:relative; padding:24px 22px 20px; }
.cad__form h2{ margin:0 44px 6px 0; font-size:1.3rem; line-height:1.2; }
.cad__form h2:focus{ outline:none; box-shadow:none; }
.cad__sub{ margin:0 0 14px; color:var(--ink-soft); font-weight:600; }
.cad__fechar{ position:absolute; top:8px; right:8px; width:44px; height:44px; border:0; border-radius:50%; background:transparent; color:var(--ink-soft); font-size:1.7rem; line-height:1; cursor:pointer; }
.cad__fechar:hover{ background:var(--paper-2); color:var(--ink); }
.cad__rotulo{ display:block; font-weight:700; margin-bottom:6px; }
.cad__form input[type="email"]{ width:100%; min-height:var(--tap); padding:12px 14px; font:inherit; font-size:1rem; color:var(--ink); background:#fff; border:1.5px solid var(--line-strong); border-radius:12px; }
.cad__form input[type="email"][aria-invalid="true"]{ border-color:var(--err-line); }
.cad__perfil{ border:0; margin:14px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.cad__perfil legend{ padding:0; margin-bottom:6px; font-weight:700; }
.cad__perfil label{ flex:1 1 130px; display:flex; align-items:center; gap:8px; min-height:var(--tap); padding:8px 14px; border:1.5px solid var(--line-strong); border-radius:12px; font-weight:700; cursor:pointer; }
.cad__perfil label:has(input:checked){ border-color:var(--coral-btn); background:var(--err-bg); }
.cad__perfil input, .cad__novidades input{ width:20px; height:20px; flex:none; margin:0; accent-color:var(--coral-btn); }
.cad__novidades{ display:flex; align-items:flex-start; gap:10px; margin:12px 0 0; padding:6px 0; min-height:44px; font-size:.92rem; font-weight:600; color:var(--ink-soft); cursor:pointer; }
.cad__hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.cad__msg{ margin:8px 0 0; min-height:1.3em; color:var(--err); font-weight:700; }
.cad__msg:empty{ min-height:0; margin:0; }
.cad__enviar{ width:100%; justify-content:center; margin-top:12px; }
.cad__lgpd{ margin:12px 0 0; font-size:.82rem; line-height:1.45; color:var(--ink-faint); }
.cad__lgpd a{ color:var(--ink-soft); }
.cad__pronto .btn{ width:100%; justify-content:center; margin-top:10px; }
.cad__form--pagina{ max-width:460px; padding:22px; background:var(--card); border:1px solid var(--line); border-radius:20px; }
.cad__alerta{ max-width:460px; padding:12px 14px; border-radius:12px; background:var(--err-bg); border-left:3px solid var(--err-line); color:var(--err); font-weight:700; }
.cad__outro{ max-width:460px; margin-top:26px; }
.cad__outro h2{ font-size:1.1rem; margin:0 0 6px; }
.cad__outro p{ color:var(--ink-soft); }
.cad__status{ min-height:1.3em; margin:10px 0 0; font-weight:700; color:var(--ok); }
.cad__status:empty{ min-height:0; margin:0; }
.area{ max-width:820px; }
.area__bloco{ margin-top:30px; }
.area__bloco > h2{ font-size:1.25rem; margin:0 0 12px; }
.area__lista, .area__sugestoes{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.area__lista li{ display:grid; grid-template-columns:1fr auto; gap:4px 12px; align-items:center; padding:14px 16px; background:var(--card); border:1px solid var(--line); border-radius:16px; }
.area__titulo{ font-weight:700; color:var(--ink); overflow-wrap:anywhere; }
.area__meta{ grid-column:1; font-size:.85rem; color:var(--ink-faint); font-weight:600; }
.area__lista .btn{ grid-column:2; grid-row:1 / span 2; }
.area__sugestoes{ grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); }
.area__sugestoes li{ display:flex; flex-direction:column; gap:4px; padding:14px 16px; background:var(--paper-2); border:1px solid var(--line-soft); border-radius:16px; }
.area__sugestoes a{ font-weight:800; color:var(--coral-text); }
.area__sugestoes span{ font-size:.9rem; }
.area__idade{ margin-bottom:14px; }
.area__idade p{ margin:0 0 8px; }
.area__chips{ display:flex; flex-wrap:wrap; gap:8px; }
.area__chip{ min-height:44px; min-width:64px; padding:8px 14px; border:1.5px solid var(--line-strong); border-radius:999px; background:var(--card); color:var(--ink); font:inherit; font-weight:700; cursor:pointer; }
.area__chip[aria-pressed="true"]{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.area__confirmar p{ margin:0 0 10px; }
.area__excluir{ margin-top:18px; }
.area__excluir summary{ cursor:pointer; min-height:44px; display:inline-flex; align-items:center; color:var(--ink-soft); font-weight:700; }
.area__excluir p{ color:var(--ink-soft); max-width:60ch; }
.area__apagar{ background:var(--card); color:var(--err); border-color:var(--err-line); }
@media (max-width:520px){
  .area__lista li{ grid-template-columns:1fr; }
  .area__lista .btn{ grid-column:1; grid-row:auto; justify-self:start; margin-top:6px; }
}
@media print{ dialog.cad{ display:none !important; } }