/* Página principal (v3.6): faixa de atualidade, situação, NIS2 em linguagem simples, prazos, ferramentas, novidades, movimento */
/* faixa de atualidade */
.nbar{background:linear-gradient(90deg,#C99A3F,#E4B356);color:#1A1405;font-size:.88rem}
.nbar .wrap{display:flex;gap:.8rem;align-items:center;justify-content:center;flex-wrap:wrap;padding:.5rem 0;text-align:center}
.nbar b{font-weight:700}
.nbar a{font-weight:700;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.nbar .tag{font:700 .68rem var(--font-d);letter-spacing:.08em;text-transform:uppercase;background:#1A1405;color:#E4B356;border-radius:999px;padding:.2rem .55rem}

.nbar .sm{display:none}
@media (max-width:640px){.nbar{font-size:.8rem}.nbar .wrap{flex-wrap:nowrap;gap:.6rem;padding:.45rem 0}.nbar .lg{display:none}.nbar .sm{display:inline}.nbar .tag{display:none}}

/* onde está a sua entidade (dentro do hero) */
.sit{margin-top:3rem}
.sit h2{color:#fff;font-size:clamp(1.4rem,2.4vw,1.9rem)}
.sit .lead{color:#C9D5EE;margin-top:.5rem}
.sit-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-top:1.4rem}
@media (max-width:980px){.sit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.sit-grid{grid-template-columns:minmax(0,1fr)}}
.sit-c{display:grid;grid-template-rows:auto auto 1fr auto;gap:.5rem;text-decoration:none;color:#fff;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:16px;padding:1.2rem 1.25rem;transition:background .15s,border-color .15s,transform .15s}
.sit-c:hover{background:rgba(255,255,255,.11);border-color:#E4B356;transform:translateY(-2px)}
.sit-c .n{width:34px;height:34px;border-radius:50%;border:1.5px solid #E4B356;color:#E4B356;display:grid;place-items:center;font:700 .9rem var(--font-d)}
.sit-c h3{font-size:1.08rem;color:#fff}
.sit-c p{color:#C9D5EE;font-size:.9rem}
.sit-c .go{font-weight:700;font-size:.88rem;color:#E4B356}

/* datas que contam */
.dates{background:var(--bg-2)}
.tl2{position:relative;margin-top:.5rem}
/* Por omissão (sem JavaScript ou ecrã estreito): lista vertical */
.tl2 .axis,.tl2 .past,.tl2 .today{display:none}
.tl2 ol{list-style:none;margin:0 0 0 .6rem;padding:0 0 0 1.2rem;position:relative;display:grid;gap:.4rem;border-left:3px solid var(--line)}
.tl2 li{position:relative;padding:.6rem 0;display:block}
.tl2 li .dot{position:absolute;left:-1.95rem;top:.85rem;width:18px;height:18px;border-radius:50%;background:var(--bg);border:3px solid var(--royal)}
.tl2 li.done .dot{background:var(--royal)}
.tl2 li.next .dot{border-color:var(--gold);box-shadow:0 0 0 6px color-mix(in srgb,var(--gold) 25%,transparent)}
.tl2 li b{display:block;font:700 1rem var(--font-d)}
.tl2 li span{display:block;font-size:.85rem;color:var(--ink-2);margin-top:.2rem;line-height:1.35}
.tl2 li .cd{display:inline-block}
.tl2 li a{display:inline-block;margin-top:.4rem;font-size:.8rem;font-weight:700;color:var(--royal)}
.tl2 li.next b{color:var(--gold-ink)}
/* Linha horizontal: só quando o script posicionou as datas (classe .on) e há largura */
@media (min-width:861px){
  .tl2.on .axis,.tl2.on .past{display:block;position:absolute;left:0;top:10rem;height:4px;border-radius:4px}
  .tl2.on .axis{right:0;background:var(--line)}
  .tl2.on .past{background:linear-gradient(90deg,var(--royal),var(--gold))}
  .tl2.on .today{display:block;position:absolute;top:9.2rem;height:3.4rem;width:0;border-left:2px dashed var(--gold);z-index:1}
  .tl2.on .today span{position:absolute;bottom:-.1rem;left:.4rem;font:700 .72rem var(--font-d);letter-spacing:.08em;text-transform:uppercase;color:var(--gold-ink);white-space:nowrap}
  .tl2.on ol{height:20rem;display:block;border:0;margin:0;padding:0}
  .tl2.on li{position:absolute;left:var(--x);top:calc(10rem - 7px);transform:translateX(-50%);width:200px;text-align:center;display:flex;flex-direction:column;align-items:center;padding:0}
  .tl2.on li.alt{top:auto;bottom:calc(10rem - 11px);flex-direction:column-reverse}
  .tl2.on li .dot{position:static;flex:none;margin:0 0 .8rem}
  .tl2.on li.alt .dot{margin:.8rem 0 0}
  .tl2.on li.edge-l{transform:translateX(-9px);align-items:flex-start;text-align:left}
  .tl2.on li.edge-r{transform:translateX(calc(-100% + 9px));align-items:flex-end;text-align:right}
}
.dates .more{margin-top:1rem;font-weight:700;font-size:.92rem}
.dates .more a{color:var(--royal)}
.dates .src{font-size:.8rem;color:var(--ink-3);margin-top:1.4rem}

/* ferramentas gratuitas */
.tools-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem}
@media (max-width:1180px){.tools-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:820px){.tools-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.tools-grid{grid-template-columns:minmax(0,1fr)}}
.tool{display:grid;grid-template-rows:150px auto;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--card);text-decoration:none;color:var(--ink);transition:border-color .15s,transform .15s}
.tool:hover{border-color:var(--royal);transform:translateY(-2px)}
.tool .pv{background:linear-gradient(160deg,#0B2263,#163A86);padding:1rem;position:relative;overflow:hidden}
.tool .tx{padding:1rem 1.15rem 1.2rem;display:grid;gap:.35rem;align-content:start}
.tool .tx h3{font-size:1.02rem}.tool .tx p{color:var(--ink-2);font-size:.88rem}
.tool .tx .go{font-weight:700;font-size:.85rem;color:var(--royal)}
.tool .badge{position:absolute;top:.7rem;right:.7rem}
/* pré-visualizações */
.pv-chips{display:flex;flex-wrap:wrap;gap:.3rem}.pv-chips i{font-style:normal;font-size:.68rem;font-weight:700;color:#fff;background:rgba(255,255,255,.14);border-radius:999px;padding:.15rem .5rem}
.pv-cells{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;margin-top:.8rem}.pv-cells i{height:22px;border-radius:5px;background:rgba(255,255,255,.12)}.pv-cells i.on{background:#3FB37F}
.pv-sim{display:grid;gap:.6rem;color:#fff}.pv-sim .sb{height:10px;border-radius:99px;display:grid;grid-template-columns:99fr 100fr 1001fr;overflow:hidden}.pv-sim .sb i:nth-child(1){background:#6F98E6}.pv-sim .sb i:nth-child(2){background:#E4B356}.pv-sim .sb i:nth-child(3){background:#AFC3EE}
.pv-sim .big{font:700 2.2rem/1 var(--font-d)}.pv-sim small{color:#C9D5EE;font-size:.75rem}
.pv-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}.pv-cal i{height:16px;border-radius:4px;background:rgba(255,255,255,.12)}.pv-cal i.c{background:rgba(111,152,230,.55)}.pv-cal i.h{background:rgba(228,179,86,.35)}.pv-cal i.e{background:#E4B356}
.pv-list{display:grid;gap:5px}.pv-list div{display:flex;gap:.5rem;align-items:center;background:rgba(255,255,255,.08);border-radius:7px;padding:.35rem .5rem}.pv-list b{font:600 .62rem ui-monospace,monospace;color:#AFC3EE}.pv-list span{flex:1;height:6px;border-radius:4px;background:rgba(255,255,255,.18)}.pv-list em{display:flex;gap:3px}.pv-list em i{width:7px;height:7px;border-radius:2px;background:#6F98E6}.pv-list em i+i{background:#E4B356}.pv-list em i+i+i{background:#AFC3EE}
.nums{display:flex;flex-wrap:wrap;gap:.6rem 2rem;margin-top:1.4rem;color:var(--ink-2);font-size:.9rem}.nums b{font:700 1.5rem var(--font-d);color:var(--ink);margin-right:.35rem}

/* novidades */
.news{border-top:1px solid var(--line)}
.news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
@media (max-width:860px){.news-grid{grid-template-columns:minmax(0,1fr)}}
.nw{display:grid;gap:.45rem;align-content:start;border:1px solid var(--line);border-radius:14px;padding:1.1rem 1.2rem;text-decoration:none;color:var(--ink);background:var(--card)}
.nw:hover{border-color:var(--royal)}
.nw time{font:700 .72rem var(--font-d);letter-spacing:.06em;text-transform:uppercase;color:var(--gold-ink)}
.nw h3{font-size:1rem}.nw p{font-size:.88rem;color:var(--ink-2)}
.eyb{font:700 .76rem var(--font-d);letter-spacing:.1em;text-transform:uppercase;color:var(--gold-ink);display:block;margin-bottom:.5rem}
.sec-tight{padding:4.2rem 0}

/* ===== v3.6 iteração 2: iniciantes, teste, movimento ===== */
.eyebrow{display:block;font:700 .78rem/1.4 var(--font-d);letter-spacing:.1em;text-transform:uppercase;color:var(--gold-2);margin-bottom:1rem}
.hero h1 .eyebrow{max-width:none;width:max-content;max-width:calc(100vw - 40px);white-space:normal}

/* faixa rotativa */
.nbar .wrap{position:relative}
.nb-rot{position:relative;display:grid;min-height:1.6em}
.nb-rot p{grid-area:1/1;margin:0;opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s;pointer-events:none}
.nb-rot p.on{opacity:1;transform:none;pointer-events:auto}
.nb-rot a{margin-left:.5rem}
.nb-next{all:unset;cursor:pointer;font:700 1.1rem/1 var(--font-d);width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:rgba(26,20,5,.12)}
.nb-next:hover{background:rgba(26,20,5,.22)}
.nb-next:focus-visible{outline:2px solid #1A1405}

/* NIS2 em linguagem simples */
.beg{background:var(--bg)}
.beg-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:2.5rem;align-items:start}
@media (max-width:960px){.beg-grid{grid-template-columns:minmax(0,1fr)}}
.beg-txt{display:grid;gap:1.4rem}
.bq{display:grid;grid-template-columns:40px minmax(0,1fr);gap:1rem}
.bn{width:36px;height:36px;border-radius:10px;background:var(--navy);color:var(--gold-2);display:grid;place-items:center;font:700 .95rem var(--font-d)}
.bq h3{font-size:1.1rem;margin-bottom:.35rem}
.bq p,.bq li{color:var(--ink-2);font-size:.97rem}
.bq abbr{text-decoration:underline dotted;cursor:help}
.steps{margin:.2rem 0 0;padding-left:1.2rem;display:grid;gap:.3rem}
.steps li::marker{color:var(--gold-ink);font-weight:700}

/* contagem de dias */
.cd{display:inline-block;margin-top:.45rem;font:700 .72rem var(--font-d);letter-spacing:.04em;font-style:normal;background:color-mix(in srgb,var(--gold) 18%,transparent);color:var(--gold-ink);border-radius:999px;padding:.2rem .55rem}
.cd:empty{display:none}

/* ===== movimento (só sem preferência de movimento reduzido) ===== */
@media (prefers-reduced-motion:no-preference){
  .js .rv{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
  .js .rv.in{opacity:1;transform:none}
  .tl2 .past{transition:width 1.6s cubic-bezier(.2,.7,.2,1)}
  .tl2 li.next .dot{animation:pulse 2.2s ease-out infinite}
  @keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--gold) 45%,transparent)}100%{box-shadow:0 0 0 14px transparent}}
  .hero{background-size:140% 140%,100% 100%;animation:glow 18s ease-in-out infinite alternate}
  @keyframes glow{from{background-position:100% 0,0 0}to{background-position:60% 20%,0 0}}
  /* pré-visualizações animadas */
  .play .pv-chips i{animation:chip 6s infinite both}
  .play .pv-chips i:nth-child(2){animation-delay:.4s}.play .pv-chips i:nth-child(3){animation-delay:.8s}.play .pv-chips i:nth-child(4){animation-delay:1.2s}
  @keyframes chip{0%{opacity:0;transform:scale(.6)}8%,85%{opacity:1;transform:none}100%{opacity:0}}
  .play .pv-cells i.on{animation:cell 6s infinite both}
  .play .pv-cells i.on:nth-child(2){animation-delay:1.7s}.play .pv-cells i.on:nth-child(4){animation-delay:1.9s}.play .pv-cells i.on:nth-child(6){animation-delay:2.1s}.play .pv-cells i.on:nth-child(7){animation-delay:2.3s}.play .pv-cells i.on:nth-child(10){animation-delay:2.5s}
  .play .pv-cells i.on:nth-child(1){animation-delay:1.5s}
  @keyframes cell{0%,20%{background:rgba(255,255,255,.12)}28%,88%{background:#3FB37F}100%{background:rgba(255,255,255,.12)}}
  .play .pv-cal i.e{animation:blink 1.6s ease-in-out infinite}
  @keyframes blink{50%{box-shadow:0 0 0 4px rgba(228,179,86,.35)}}
  .play .pv-list div{animation:row 5s infinite both}
  .play .pv-list div:nth-child(2){animation-delay:.3s}.play .pv-list div:nth-child(3){animation-delay:.6s}.play .pv-list div:nth-child(4){animation-delay:.9s}
  @keyframes row{0%{opacity:0;transform:translateX(-10px)}10%,90%{opacity:1;transform:none}100%{opacity:0}}
  .sit-c .go{transition:transform .2s}.sit-c:hover .go{transform:translateX(4px)}
  .new{animation:shine 3s ease-in-out infinite}
  @keyframes shine{0%,80%,100%{filter:none}90%{filter:brightness(1.25)}}
}
.pv-sim .big{transition:opacity .25s}
.tool .pv-chips{padding-right:3.6rem}
.beg-more{font-weight:700}.beg-more a{color:var(--royal)}
.news-more{margin-top:1.2rem;font-weight:700}.news-more a{color:var(--royal)}

.pv-radar{width:118px;height:auto;display:block;margin:0 auto}
.tl2 li .cd:empty{display:none}
