/* escala.css — página interativa /fim-da-escala-6x1. Base: tecnologia.css e pag.css.
   Assinatura: a semana em sete peças que viram folga, o simulador da hora
   trabalhada e a régua dos 14 meses. */
:root { --folga: #CF9D68; --folga-vela: rgba(207,157,104,0.16); --trab: #1E2022; --vermelho: #B5463A; --verde: #3E7A5A; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Semana da abertura ---------- */
.e6-abertura .container > * { min-width: 0; }
.e6-abertura .tec-protocolo { overflow-wrap: anywhere; }
.e6-semana-box { background: #fff; border: 1px solid var(--fio); border-radius: 24px; padding: 24px; box-shadow: 0 30px 60px -40px rgba(30,32,34,.45); text-align: left; }
.e6-fases { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); background: var(--papel); border-radius: 999px; padding: 4px; margin-bottom: 20px; }
.e6-fases button { all: unset; box-sizing: border-box; position: relative; z-index: 1; cursor: pointer; min-height: 44px; text-align: center; font-weight: 600; font-size: .88rem; color: var(--nanquim-suave); border-radius: 999px; transition: color .25s ease; }
.e6-fases button[aria-selected="true"] { color: #fff; }
.e6-fases button:focus-visible { outline: 2px solid var(--latao); outline-offset: 2px; }
.e6-fases-marca { position: absolute; top: 4px; bottom: 4px; left: 4px; width: calc((100% - 8px) / 3); border-radius: 999px; background: var(--tinta); transition: transform .5s var(--curva); transform: translateX(calc(100% * var(--f, 0))); }
.e6-semana { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; perspective: 700px; }
.e6-dia { position: relative; aspect-ratio: 3 / 4.2; border-radius: 14px; background: var(--trab); color: #F4F1EC; display: flex; flex-direction: column; justify-content: space-between; padding: 10px 8px; transition: background .5s var(--curva), color .5s ease, transform .6s var(--curva), box-shadow .5s ease; transform-style: preserve-3d; }
.e6-dia .d { font-family: var(--protocolo); font-size: .64rem; letter-spacing: .1em; opacity: .75; }
.e6-dia .h { font-size: clamp(.9rem, .7rem + .6vw, 1.15rem); font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.e6-dia .f { display: none; font-size: .7rem; font-weight: 700; }
.e6-dia.folga { background: var(--folga-vela); color: #8A5E33; box-shadow: inset 0 0 0 1.5px var(--folga); }
.e6-dia.folga .h { display: none; }
.e6-dia.folga .f { display: block; }
.e6-dia.folga .f::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--folga); margin-right: 5px; }
.e6-dia.vira { animation: e6-vira .7s var(--curva); }
.e6-dia.nova::after { content: "+1"; position: absolute; top: -9px; right: -6px; background: var(--folga); color: var(--tinta); font-size: .66rem; font-weight: 800; padding: 2px 6px; border-radius: 6px; animation: e6-pop .5s var(--curva) both .35s; }
@keyframes e6-vira { 0% { transform: rotateY(0); } 50% { transform: rotateY(90deg); } 100% { transform: rotateY(0); } }
@keyframes e6-pop { from { transform: scale(0); } to { transform: scale(1); } }
.e6-contadores { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 18px; }
.e6-contadores > div { background: var(--papel-fundo); border-radius: 14px; padding: 12px; }
.e6-contadores b { display: block; font-size: 1.9rem; font-weight: 800; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }
.e6-contadores span { font-size: .76rem; color: var(--nanquim-suave); line-height: 1.35; display: block; margin-top: 4px; }
.e6-legenda { margin: 14px 0 0; font-size: .86rem; color: var(--grafite); min-height: 2.6em; }

/* ---------- Tramitação ---------- */
.e6-trilho { position: relative; padding-top: 34px; }
.e6-trilho ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; position: relative; }
.e6-trilho ol::before { content: ""; position: absolute; left: 22px; right: 22px; top: 22px; height: 2px; background: repeating-linear-gradient(90deg, var(--fio-forte) 0 4px, transparent 4px 8px); }
.e6-trilho ol::after { content: ""; position: absolute; left: 22px; top: 22px; height: 2px; width: 0; background: var(--latao); transition: width 1.6s var(--curva); }
.e6-trilho.vis ol::after { width: calc(50% - 22px); }
.e6-trilho li { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 4px; }
.e6-trilho .b { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: #fff; border: 2px solid var(--fio-forte); color: var(--nanquim-suave); margin-bottom: 8px; }
.e6-trilho .b svg { width: 20px; height: 20px; stroke: currentColor; }
.e6-trilho li.ok .b { background: var(--tinta); border-color: var(--tinta); color: var(--latao); }
.e6-trilho li.agora .b { border-color: var(--latao); color: #8A5E33; animation: e6-pulso 2.2s ease-out infinite; }
@keyframes e6-pulso { 0% { box-shadow: 0 0 0 0 rgba(207,157,104,.5); } 100% { box-shadow: 0 0 0 16px rgba(207,157,104,0); } }
.e6-trilho .q { font-family: var(--protocolo); font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: #8A5E33; }
.e6-trilho b { font-size: 1rem; }
.e6-trilho .t { font-size: .84rem; color: var(--grafite); }
.e6-aqui { position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: var(--latao); color: var(--tinta); font-family: var(--protocolo); font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; padding: 4px 10px; border-radius: 6px; white-space: nowrap; }
.e6-placar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 36px; }
.e6-placar > div { background: #fff; border: 1px solid var(--fio); border-radius: 18px; padding: 18px; }
.e6-placar span { font-weight: 700; font-size: .9rem; }
.e6-placar small { display: block; margin-top: 6px; font-size: .78rem; color: var(--nanquim-suave); }
.e6-placar .barra { display: flex; height: 12px; border-radius: 6px; overflow: hidden; background: #ECE6DD; margin-top: 10px; }
.e6-placar .barra i { display: block; width: 0; background: var(--tinta); transition: width 1.4s var(--curva); }
.e6-placar .barra em { display: block; width: 0; background: var(--vermelho); transition: width 1.4s var(--curva) .3s; }

/* ---------- Simulador ---------- */
.e6-sim { display: grid; grid-template-columns: .9fr 1.1fr; gap: 24px; align-items: stretch; }
.e6-sim-campos { background: #fff; border: 1px solid var(--fio); border-radius: 22px; padding: 26px; display: grid; gap: 22px; align-content: start; }
.e6-sim-campos fieldset { border: 0; padding: 0; margin: 0; }
.e6-sim-campos legend, .e6-faixa > span, .e6-dinheiro > span:first-child, .e6-emp-campos label > span, .e6-cal-in label > span { display: flex; justify-content: space-between; font-family: var(--protocolo); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: #8A5E33; margin-bottom: 10px; }
.e6-opts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.e6-opts label { cursor: pointer; }
.e6-opts input { position: absolute; opacity: 0; pointer-events: none; }
.e6-opts span { display: grid; place-items: center; min-height: 46px; border-radius: 12px; border: 1px solid var(--fio-forte); background: var(--papel-fundo); font-weight: 700; font-size: .9rem; transition: all .2s ease; }
.e6-opts input:checked + span { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.e6-opts input:focus-visible + span { outline: 2px solid var(--latao); outline-offset: 2px; }
.e6-faixa output { font-family: Montserrat, sans-serif; font-size: 1rem; font-weight: 800; letter-spacing: 0; text-transform: none; color: var(--tinta); }
.e6-faixa input[type=range] { width: 100%; accent-color: var(--tinta); height: 28px; }
.e6-dinheiro .campo { display: flex; align-items: center; border: 1px solid var(--fio-forte); border-radius: 12px; background: var(--papel-fundo); padding: 0 14px; min-height: 48px; }
.e6-dinheiro .campo i { font-style: normal; font-weight: 700; color: var(--nanquim-suave); margin-right: 8px; }
.e6-dinheiro input, .e6-emp-campos input, .e6-cal-in input { border: 0; background: transparent; font: inherit; font-size: 1rem; width: 100%; min-height: 46px; color: var(--tinta); }
.e6-dinheiro input:focus { outline: none; }
.e6-dinheiro .campo:focus-within, .e6-emp-campos input:focus, .e6-cal-in input:focus { box-shadow: 0 0 0 3px rgba(207,157,104,.3); border-color: var(--latao); }
.e6-dinheiro small { display: block; margin-top: 6px; font-size: .74rem; color: var(--nanquim-suave); }
.e6-sim-res { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; align-content: start; }
.e6-etapa { border-radius: 20px; padding: 20px 18px; display: flex; flex-direction: column; gap: 6px; background: var(--papel-fundo); border: 1px solid var(--fio); transition: transform .4s var(--curva); }
.e6-etapa[data-e="2"] { background: var(--tinta); color: #F4F1EC; border-color: var(--tinta); }
.e6-etapa .q { font-family: var(--protocolo); font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: #8A5E33; }
.e6-etapa[data-e="2"] .q { color: var(--latao); }
.e6-etapa .hh { white-space: nowrap; font-size: 2.2rem; font-weight: 800; letter-spacing: -.04em; line-height: 1; font-variant-numeric: tabular-nums; }
.e6-etapa .ff { font-size: .86rem; font-weight: 600; }
.e6-etapa .vh { font-size: .82rem; color: var(--grafite); min-height: 2.6em; }
.e6-etapa[data-e="2"] .vh { color: rgba(244,241,236,.8); }
.e6-etapa .vh b { color: inherit; font-size: 1.05rem; }
.e6-etapa.pula { animation: e6-pula .45s var(--curva); }
@keyframes e6-pula { 40% { transform: translateY(-4px) scale(1.02); } }
.e6-sim-msg { grid-column: 1 / -1; margin: 4px 0 0; padding: 16px 18px; border-radius: 16px; background: var(--folga-vela); color: var(--tinta); font-size: .92rem; line-height: 1.6; }

/* ---------- Calendário ---------- */
.e6-cal { display: grid; grid-template-columns: .8fr 1.2fr; gap: 24px; background: #fff; border: 1px solid var(--fio); border-radius: 22px; padding: 26px; }
.e6-cal-in { display: grid; gap: 14px; align-content: start; }
.e6-cal-in input { border: 1px solid var(--fio-forte); border-radius: 12px; padding: 0 14px; background: var(--papel-fundo); }
.e6-cal-in .tec-botao { justify-content: center; }
.e6-cal-status { margin: 0; font-size: .86rem; color: var(--grafite); min-height: 1.5em; }
.e6-regua { position: relative; display: grid; grid-template-columns: 2fr 12fr 3fr; height: 56px; border-radius: 14px; overflow: visible; }
.e6-regua > div { display: flex; align-items: center; padding: 0 12px; font-size: .78rem; font-weight: 700; overflow: hidden; white-space: nowrap; }
.e6-regua .s0 { background: repeating-linear-gradient(135deg, #EDE7DE 0 8px, #F6F2EC 8px 16px); color: var(--nanquim-suave); border-radius: 14px 0 0 14px; }
.e6-regua .s1 { background: #8A5E33; color: #fff; }
.e6-regua .s2 { background: var(--tinta); color: var(--latao); border-radius: 0 14px 14px 0; }
.e6-regua .hoje { position: absolute; top: -10px; bottom: -10px; width: 3px; background: var(--vermelho); border-radius: 2px; left: 0; transition: left .8s var(--curva); }
.e6-regua .hoje span { position: absolute; top: -22px; left: 50%; transform: translateX(-50%); font-family: var(--protocolo); font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; color: var(--vermelho); font-weight: 700; }
.e6-cal-datas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 22px; }
.e6-cal-datas > div { border-top: 2px solid var(--latao); padding-top: 10px; }
.e6-cal-datas .q { display: block; font-family: var(--protocolo); font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: #8A5E33; }
.e6-cal-datas b { display: block; margin-top: 6px; font-size: 1.15rem; font-variant-numeric: tabular-nums; }

/* ---------- Para quem ---------- */
.e6-quem { display: grid; grid-template-columns: .9fr 1.1fr; gap: 24px; align-items: start; }
.e6-perfis { display: grid; gap: 8px; }
.e6-perfil { all: unset; box-sizing: border-box; cursor: pointer; display: flex; align-items: center; gap: 14px; min-height: 54px; padding: 10px 16px; border-radius: 14px; border: 1px solid var(--fio); background: #fff; font-weight: 600; font-size: .92rem; color: var(--grafite); transition: all .25s var(--curva); }
.e6-perfil svg { width: 22px; height: 22px; stroke: #8A5E33; flex: none; }
.e6-perfil:hover { border-color: var(--latao); transform: translateX(3px); }
.e6-perfil[aria-selected="true"] { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.e6-perfil[aria-selected="true"] svg { stroke: var(--latao); }
.e6-perfil:focus-visible { outline: 2px solid var(--latao); outline-offset: 2px; }
.e6-resp { position: sticky; top: 110px; background: #fff; border: 1px solid var(--fio); border-radius: 22px; padding: 32px; min-height: 260px; }
.e6-resp h3 { font-size: 1.5rem; margin: 10px 0 12px; line-height: 1.25; }
.e6-resp p { color: var(--grafite); line-height: 1.75; margin: 0 0 18px; }
.e6-resp.troca > * { animation: pg-surge .4s var(--curva) both; }
.e6-selo { display: inline-flex; font-family: var(--protocolo); font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; font-weight: 700; padding: 6px 12px; border-radius: 999px; }
.e6-selo.s1 { background: var(--tinta); color: var(--latao); }
.e6-selo.s2 { background: var(--folga-vela); color: #8A5E33; }
.e6-selo.s3 { border: 1px solid var(--fio-forte); color: var(--nanquim-suave); }

/* ---------- Mito ou verdade ---------- */
.e6-placar-mitos { font-family: var(--protocolo); font-size: .8rem; letter-spacing: .08em; color: var(--nanquim-suave); margin: -20px 0 18px; }
.e6-placar-mitos b { font-family: Montserrat, sans-serif; font-size: 1.4rem; color: var(--tinta); }
.e6-mitos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.e6-mito { position: relative; background: #fff; border: 1px solid var(--fio); border-radius: 20px; padding: 22px; display: flex; flex-direction: column; gap: 14px; transition: border-color .3s ease, background .3s ease; }
.e6-mito .n { font-family: var(--protocolo); font-size: .72rem; color: #8A5E33; }
.e6-mito h3 { font-size: 1.02rem; line-height: 1.45; margin: 0; flex: 1; }
.e6-mito .bts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.e6-mito .bts button { all: unset; box-sizing: border-box; cursor: pointer; text-align: center; min-height: 44px; border-radius: 12px; border: 1px solid var(--fio-forte); font-weight: 700; font-size: .88rem; transition: all .2s ease; }
.e6-mito .bts button:hover { border-color: var(--latao); }
.e6-mito .bts button:focus-visible { outline: 2px solid var(--latao); outline-offset: 2px; }
.e6-mito .exp { margin: 0; font-size: .88rem; line-height: 1.6; color: var(--grafite); }
.e6-mito.acertou { border-color: var(--verde); }
.e6-mito.errou { border-color: var(--vermelho); }
.e6-mito.respondido .bts button { cursor: default; opacity: .45; }
.e6-mito.respondido .bts button.certa { opacity: 1; background: var(--tinta); color: #fff; border-color: var(--tinta); }
.e6-mito.acertou .exp b { color: var(--verde); }
.e6-mito.errou .exp b { color: var(--vermelho); }
.e6-mito.acertou::after, .e6-mito.errou::after { position: absolute; top: 16px; right: 16px; font-family: var(--protocolo); font-size: .66rem; letter-spacing: .1em; font-weight: 700; padding: 3px 8px; border-radius: 6px; }
.e6-mito.acertou::after { content: "ACERTOU"; background: rgba(62,122,90,.12); color: var(--verde); }
.e6-mito.errou::after { content: "QUASE"; background: rgba(181,70,58,.1); color: var(--vermelho); }

/* ---------- Empresas ---------- */
.e6-emp { display: grid; grid-template-columns: .8fr 1.2fr; gap: 24px; background: var(--tinta); color: #F4F1EC; border-radius: 24px; padding: 30px; }
.e6-emp-campos { display: grid; gap: 16px; align-content: start; }
.e6-emp-campos label > span { color: var(--latao); }
.e6-emp-campos input { border: 1px solid rgba(244,241,236,.2); border-radius: 12px; padding: 0 14px; background: rgba(255,255,255,.06); color: #fff; }
.e6-emp-res { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.e6-emp-res > div { border: 1px solid rgba(207,157,104,.3); border-radius: 18px; padding: 18px; }
.e6-emp-res b { display: block; font-size: 2rem; font-weight: 800; letter-spacing: -.03em; color: var(--latao); line-height: 1.05; font-variant-numeric: tabular-nums; }
.e6-emp-res span { font-size: .84rem; color: rgba(244,241,236,.78); line-height: 1.5; display: block; margin-top: 6px; }
.e6-emp-res span span { display: inline; margin: 0; color: #fff; font-weight: 700; }

/* ---------- Guia ---------- */
.e6-guia { display: grid; grid-template-columns: 240px 1fr; gap: 48px; align-items: center; }
.e6-guia h2 { font-size: clamp(1.8rem, 1.2rem + 1.8vw, 2.7rem); line-height: 1.12; font-weight: 300; letter-spacing: -.02em; margin: 14px 0 16px; }
.e6-guia h2 strong { font-weight: 700; }
.e6-guia p { color: var(--grafite); line-height: 1.75; max-width: 600px; }
.e6-guia .tec-botao svg { width: 18px; height: 18px; }
.e6-capa { aspect-ratio: 210 / 297; background: var(--tinta); color: #F4F1EC; border-radius: 10px 16px 16px 10px; padding: 22px; display: flex; flex-direction: column; gap: 10px; box-shadow: 0 40px 60px -36px rgba(30,32,34,.6); transform: rotate(-3deg); transition: transform .5s var(--curva); position: relative; overflow: hidden; }
.e6-capa::after { content: ""; position: absolute; right: -50%; top: -20%; width: 120%; aspect-ratio: 1; border-radius: 50%; border: 1px solid rgba(207,157,104,.35); }
.e6-guia:hover .e6-capa { transform: rotate(0) translateY(-6px); }
.e6-capa .m { font-size: .8rem; letter-spacing: .3em; font-weight: 600; }
.e6-capa .sem { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-top: 18px; }
.e6-capa .sem i { aspect-ratio: 3/4; border-radius: 4px; background: #3A3D40; }
.e6-capa .sem i.f { background: transparent; box-shadow: inset 0 0 0 1.5px var(--latao); }
.e6-capa small { margin-top: auto; font-size: .56rem; letter-spacing: .16em; text-transform: uppercase; color: var(--latao); }
.e6-capa b { font-size: 1.15rem; line-height: 1.2; color: #fff; }
.e6-fontes { margin-top: 44px; }
.e6-fontes h3 { font-size: 1rem; margin: 0 0 10px; }
.e6-fontes ol { margin: 0; padding-left: 20px; display: grid; gap: 6px; font-size: .86rem; }
.e6-fontes a { color: #8A5E33; }

/* ---------- Responsivo ---------- */
@media (max-width: 1024px) {
    .e6-sim, .e6-cal, .e6-quem, .e6-emp { grid-template-columns: 1fr; }
    .e6-mitos { grid-template-columns: repeat(2, 1fr); }
    .e6-resp { position: static; }
}
@media (max-width: 760px) {
    .e6-semana-box { padding: 16px; }
    .e6-semana { gap: 5px; }
    .e6-dia { padding: 7px 5px; border-radius: 10px; }
    .e6-dia .d { font-size: .56rem; }
    .e6-dia .h { font-size: .8rem; }
    .e6-dia .f { font-size: .6rem; }
    .e6-dia.folga .f::before { display: none; }
    .e6-contadores b { font-size: 1.5rem; }
    .e6-trilho ol { grid-template-columns: 1fr; gap: 16px; padding-left: 4px; }
    .e6-trilho ol::before, .e6-trilho ol::after { left: 22px; right: auto; top: 22px; bottom: 22px; width: 2px; height: auto; }
    .e6-trilho ol::before { background: repeating-linear-gradient(180deg, var(--fio-forte) 0 4px, transparent 4px 8px); }
    .e6-trilho.vis ol::after { width: 2px; height: 45%; }
    .e6-trilho li { display: grid; grid-template-columns: 56px 1fr; gap: 0 10px; align-items: center; }
    .e6-trilho li .b { grid-row: span 3; margin: 0; }
    .e6-aqui { left: 110px; transform: none; top: auto; bottom: calc(50% + 0px); display: none; }
    .e6-placar, .e6-sim-res, .e6-cal-datas, .e6-emp-res, .e6-mitos { grid-template-columns: 1fr; }
    .e6-opts { grid-template-columns: repeat(2, 1fr); }
    .e6-guia { grid-template-columns: 1fr; gap: 28px; }
    .e6-capa { max-width: 200px; margin: 0 auto; }
    .e6-regua > div { font-size: .66rem; padding: 0 6px; }
    .pg .e6-sim, .pg .e6-cal, .pg .e6-quem, .pg .e6-emp, .pg .e6-mitos, .pg .e6-placar, .pg .e6-trilho { text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
    .e6-dia, .e6-fases-marca, .e6-placar .barra i, .e6-placar .barra em, .e6-trilho ol::after, .e6-regua .hoje { transition: none !important; }
    .e6-dia.vira, .e6-dia.nova::after, .e6-trilho li.agora .b, .e6-etapa.pula { animation: none !important; }
}