/* ============ khrono-one: regras próprias da one-page (por cima de site/polish/product/lean) ============ */
html{ scroll-behavior:smooth }
/* o cabeçalho não muda de altura ao rolar (mudar altura de um sticky faz a página tremer perto do topo) */
.hdr.scrolled .wrap{ height:76px } @media (max-width:480px){ .hdr.scrolled .wrap{ height:68px } } @media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto } }
section[id]{ scroll-margin-top:84px }
.nav.spy a{ transition:color .25s var(--ease), background .35s var(--ease) }
.nav.spy a.on{ color:var(--ink); background:var(--fossil) }

/* herói: segunda linha em verde, nota discreta */
.heroOne h1{ max-width:19ch } .heroOne h1 i{ font-style:normal; color:var(--acc) }
@media (max-width:640px){ .heroOne h1 br{ display:none } .heroOne h1{ max-width:12ch } }
.heroOne .fine{ margin-top:18px; font-size:13.5px; color:var(--dim) }
.eyebrow.dot{ display:inline-flex; align-items:center; gap:8px } .eyebrow.dot::before{ content:''; width:6px; height:6px; border-radius:50%; background:var(--acc); box-shadow:0 0 0 4px var(--acc-soft); animation:pulseDot 2.4s ease-in-out infinite }
@keyframes pulseDot{ 0%,100%{ box-shadow:0 0 0 3px var(--acc-soft) } 50%{ box-shadow:0 0 0 7px transparent } }

/* segmentos como cartões (sem link) — mantém foto viva no hover */
article.seg{ cursor:default } article.seg:hover .bg{ transform:scale(1.06) } article.seg:hover .in{ transform:none }

/* começar: banda discreta com os três passos */
.startSec{ padding-top:clamp(40px,5vw,64px); padding-bottom:clamp(40px,5vw,64px) }
.startHead{ display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap }
.startHead h2{ font-size:clamp(1.5rem,2.4vw,2.1rem); margin-top:6px }
.steps3{ list-style:none; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,32px); margin-top:clamp(22px,2.6vw,34px) }
.steps3 li{ padding-top:16px; border-top:1px solid var(--line) }
.steps3 b{ font-family:var(--mono); font-size:11px; letter-spacing:.14em; color:var(--acc); font-weight:500 }
.steps3 h3{ font-size:1.05rem; letter-spacing:-.015em; margin-top:8px } .steps3 p{ color:var(--mut); font-size:14px; margin-top:6px; max-width:38ch; line-height:1.55 }
@media (max-width:720px){ .steps3{ grid-template-columns:1fr; gap:14px } .startHead .btn{ width:100%; justify-content:center } }

/* palco das abas: a altura é a da aba ativa (as outras ficam absolutas, só para o fade de saída) */
.stage{ position:relative } .stage .view:not(.on){ position:absolute; left:0; top:0; width:100%; height:100%; overflow:hidden }

/* planos e FAQ na one-page */
.priceSec .secHead.center{ margin-bottom:clamp(20px,2.6vw,32px) } .priceSec .secHead .lead.center{ max-width:52ch; margin:12px auto 0 }
.faqGrid{ display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(24px,4vw,72px); align-items:start }
.faqGrid .secHead{ margin:0; position:sticky; top:96px } .faqGrid .faqs{ max-width:none; margin:0 }
@media (max-width:820px){ .faqGrid{ grid-template-columns:1fr } .faqGrid .secHead{ position:static } }

/* celulares com a área do cliente real dentro */
.phones.live .frame{ position:relative }
.phones.live .scr{ position:relative; flex:1; min-height:0; overflow:hidden; border-radius:0 0 calc(var(--fr) - var(--fp)) calc(var(--fr) - var(--fp)); background:#f1f3ef; color-scheme:light }
.phones.live .frame .bar{ background:#f1f3ef; color:#18201c } .phones.live .frame .bar i{ background:#0e0f0d }
.phones.live .skel{ position:absolute; inset:0; padding:18px 16px; display:flex; flex-direction:column; gap:12px } .phones.live .skel i{ display:block; border-radius:10px; background:#e2e7e1; animation:skel 1.6s ease-in-out infinite }
.phones.live .skel i:nth-child(1){ height:22px; width:55% } .phones.live .skel i:nth-child(2){ height:140px } .phones.live .skel i:nth-child(3){ height:16px; width:80% } .phones.live .skel i:nth-child(4){ height:44px; margin-top:auto; border-radius:99px; background:#cfe3d8 }
@keyframes skel{ 0%,100%{ opacity:.55 } 50%{ opacity:1 } }
.phones.one-phone{ padding-top:0 }
.phones.live .scr iframe{ position:absolute; left:0; top:0; width:390px; height:var(--ih,844px); border:0; transform:scale(var(--s,1)); transform-origin:0 0; opacity:0; transition:opacity .7s var(--ease); background:transparent; color-scheme:normal }
.phones.live .scr iframe.ready{ opacity:1 }

/* ============ agenda animada ("Sua operação") ============ */
.agd{ --h:clamp(60px,6.4vw,84px); --top:50px; max-width:1320px; margin:0 auto; border:1px solid var(--line2); border-radius:var(--r-lg); background:var(--paper); box-shadow:var(--shadow); overflow:hidden; font-family:var(--sans) }
.agh{ display:flex; justify-content:space-between; align-items:center; gap:16px; padding:14px clamp(14px,1.8vw,24px); border-bottom:1px solid var(--line2) }
.agt{ display:flex; align-items:center; gap:10px; font-size:14px } .agt svg{ width:18px; height:18px; fill:none; stroke:var(--acc); stroke-width:1.8; stroke-linecap:round } .agt b{ font-weight:500 } .agt span{ color:var(--mut); font-size:13px }
.agseg{ display:inline-flex; padding:3px; border:1px solid var(--line2); border-radius:99px; background:var(--bg); font-size:12px }
.agseg span{ padding:6px 12px; border-radius:99px; color:var(--mut) } .agseg span.on{ background:var(--paper); color:var(--ink); border:1px solid var(--line); box-shadow:0 6px 18px -12px rgba(0,0,0,.5) }
.agg{ position:relative; display:grid; grid-template-columns:56px repeat(3,minmax(0,1fr)); padding:0 clamp(10px,1.4vw,18px) clamp(10px,1.4vw,16px) 0 }
.agtimes{ display:grid; grid-template-rows:var(--top) repeat(3,var(--h)) auto } .agtimes span{ font-family:var(--mono); font-size:10.5px; color:var(--dim); text-align:right; padding-right:10px; transform:translateY(-7px) }
.agcol{ border-left:1px solid var(--line2); min-width:0 }
.agp{ height:var(--top); display:flex; align-items:center; gap:8px; padding:0 12px; font-size:13.5px; font-weight:500; border-bottom:1px solid var(--line2) }
.agp i{ width:24px; height:24px; border-radius:50%; background:var(--acc-soft); color:var(--acc); font-style:normal; font-size:11px; font-weight:600; display:grid; place-items:center; flex:none }
.agbody{ position:relative; height:calc(var(--h) * 3 + 14px); margin:0 6px; background-image:linear-gradient(to bottom, var(--line2) 0, var(--line2) 1px, transparent 1px); background-size:100% var(--h) }
.agc,.agfree{ position:absolute; left:4px; right:4px; top:calc(var(--s) / 60 * var(--h) + 3px); height:calc(var(--d) / 60 * var(--h) - 6px); border-radius:10px }
.agc{ padding:7px 9px 6px; display:flex; flex-direction:column; gap:0; font-size:12px; line-height:1.2; overflow:hidden; border-left:3px solid var(--acc); background:color-mix(in oklab, var(--acc) 13%, var(--paper)) }
.agc.c2{ border-left-color:#B8893A; background:color-mix(in oklab, #C9A04A 16%, var(--paper)) } .agc.c3{ border-left-color:#7E76C4; background:color-mix(in oklab, #8C85CF 16%, var(--paper)) } .agc.c4{ border-left-color:#3F8F9E; background:color-mix(in oklab, #4FA3B2 15%, var(--paper)) }
.agc > *{ flex:none; min-width:0 }
.agc b{ font-family:var(--mono); font-size:9.5px; font-weight:500; color:var(--dim); letter-spacing:.02em } .agc span{ font-weight:500; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis } .agc small{ color:var(--mut); font-size:11px }
.agc em{ font-style:normal; display:flex; align-items:center; gap:4px; font-size:10.5px; color:var(--acc); margin-top:auto } .agc em svg{ width:11px; height:11px; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round }
.agfree{ border:1px dashed var(--line); display:grid; place-items:center; font-size:11px; color:var(--dim) }
/* entrada escalonada quando o bloco aparece */
.agc:not(.new),.agfree{ transition:opacity .6s var(--ease), transform .6s var(--ease); transition-delay:calc(.15s + var(--k,0) * 90ms) }
html.js .agd:not(.in) .agc:not(.new), html.js .agd:not(.in) .agfree{ opacity:0; transform:translateY(8px) scale(.98) }
.agd.settled .agc:not(.new), .agd.settled .agfree{ transition-delay:0s }
/* novo agendamento: entra no horário livre, fica "aguardando", confirma, some — em loop */
.agc.new{ opacity:0; transform:translateX(14px); border-left-color:var(--acc); background:color-mix(in oklab, var(--acc) 18%, var(--paper)); box-shadow:0 12px 30px -16px rgba(0,0,0,.5); animation:agNew 14s var(--ease) infinite }
.agc.new .tag{ position:absolute; top:6px; right:8px; white-space:nowrap; font-style:normal; font-family:var(--mono); font-size:8.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--acc-on); background:var(--acc); padding:3px 6px; border-radius:99px; animation:agTag 14s var(--ease) infinite }
.agc.new em.w{ color:#B8893A; animation:agWait 14s var(--ease) infinite } .agc.new em.o{ position:absolute; left:9px; bottom:6px; opacity:0; animation:agOk 14s var(--ease) infinite }
.agfree.slot{ animation:agSlot 14s var(--ease) infinite; transition:none }
@keyframes agNew{ 0%,10%{ opacity:0; transform:translateX(14px) } 15%,93%{ opacity:1; transform:none } 98%,100%{ opacity:0; transform:translateY(-6px) } }
@keyframes agTag{ 0%,15%{ opacity:1 } 46%,100%{ opacity:0 } }
@keyframes agWait{ 0%,44%{ opacity:1 } 48%,100%{ opacity:0 } }
@keyframes agOk{ 0%,47%{ opacity:0; transform:translateY(4px) } 52%,100%{ opacity:1; transform:none } }
@keyframes agSlot{ 0%,8%{ opacity:1 } 14%,94%{ opacity:0 } 99%,100%{ opacity:1 } }
@media (max-width:640px){
  .agd{ --h:66px; --top:44px } .agg{ grid-template-columns:44px repeat(3,minmax(0,1fr)) } .agtimes span{ padding-right:6px; font-size:10px } 
  .agseg{ display:none } .agt span{ display:none } .agc{ padding:6px 7px 5px; font-size:11px } .agc small{ display:none } .agc:not(.new) em{ display:none } .agc.new .tag{ display:none } .agc b{ font-size:9px } .agp{ font-size:12.5px; padding:0 8px }
}
@media (max-width:420px){ .agg{ grid-template-columns:40px 1fr 1fr } .agcol:nth-child(4){ display:none } .agc.new .tag{ display:none } }
@media (prefers-reduced-motion:reduce){ .agc.new{ opacity:1; transform:none } .agc.new,.agc.new .tag,.agc.new em.w,.agc.new em.o,.agfree.slot,.eyebrow.dot::before{ animation:none } .agc.new em.o{ opacity:1 } .agc.new em.w{ display:none } .agfree.slot{ opacity:0 } }

/* rodapé em três colunas */
.ftr.foot3{ padding:clamp(44px,5.5vw,72px) 0 26px; border-top:1px solid var(--line2) }
.ftr.foot3 .cols{ display:grid; grid-template-columns:1.3fr .8fr 1fr; gap:clamp(24px,4vw,64px); align-items:start }
.ftr.foot3 .brand p{ color:var(--mut); font-size:14.5px; max-width:36ch; margin-top:10px; line-height:1.55 } .ftr.foot3 .brand p b{ color:var(--ink); font-weight:500 } .ftr.foot3 .brand .logo{ margin-bottom:8px } .ftr.foot3 .brand .logo .hz{ height:44px }
.ftr.foot3 .col{ display:flex; flex-direction:column; gap:12px } .ftr.foot3 .col .eyebrow{ margin-bottom:6px }
.ftr.foot3 .col a{ font-size:14.5px; color:var(--mut); width:max-content; transition:color .16s var(--ease) } .ftr.foot3 .col a:hover{ color:var(--ink) }
.ftr.foot3 .col p{ color:var(--ink); font-size:14.5px } .ftr.foot3 .col .mail{ color:var(--ink); border-bottom:1px solid var(--line); padding-bottom:1px } .ftr.foot3 .col .mail:hover{ border-color:var(--acc) }
.ftr.foot3 .tools{ display:flex; gap:8px; align-items:center; margin-top:6px }
.ftr.foot3 .base{ margin-top:clamp(28px,3.4vw,44px); padding-top:20px; border-top:1px solid var(--line2); display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; font-size:13px; color:var(--dim) } .ftr.foot3 .base b{ font-weight:500; color:var(--mut) }
@media (max-width:820px){ .ftr.foot3 .cols{ grid-template-columns:1fr 1fr } .ftr.foot3 .brand{ grid-column:1 / -1 } }
@media (max-width:480px){ .ftr.foot3 .cols{ grid-template-columns:1fr } }
.ftr.foot3 .legal{ display:flex; gap:14px; margin-top:4px } .ftr.foot3 .legal a{ font-size:13px; color:var(--dim) }

/* ============ painel (Visão geral) — sempre claro, como o produto ============ */
.pnl{ --pbg:#f1f3ef; --psurf:#fff; --pline:#e1e6e0; --pink:#18201c; --pmut:#667069; --pdim:#8a9390; --pacc:#1d6f53; --pacc2:#6fb596; --pside:#8fc5aa;
  max-width:1320px; margin:0 auto; border-radius:var(--r-lg); overflow:hidden; background:var(--pbg); color:var(--pink); font-family:var(--sans); box-shadow:var(--shadow); border:1px solid var(--line2); color-scheme:light; font-size:12px; line-height:1.35 }
.pbar{ display:flex; align-items:center; gap:6px; padding:10px 14px; background:#e6ebe6; border-bottom:1px solid var(--pline) } .pbar i{ width:9px; height:9px; border-radius:50%; background:#c9d2cb } .pbar span{ margin-left:auto; margin-right:auto; font-family:var(--mono); font-size:10px; color:var(--pdim) }
.pbody{ display:grid; grid-template-columns:184px 1fr; min-height:520px }
.pside{ background:var(--pside); padding:18px 12px; display:flex; flex-direction:column; gap:14px; color:#12261d }
.plogo{ height:22px; width:auto; margin:2px 4px 6px }
.puser{ display:flex; align-items:center; gap:9px; padding:9px 10px; border-radius:10px; background:rgba(255,255,255,.55) } .puser i{ width:26px; height:26px; border-radius:50%; background:#fff; font-style:normal; font-size:10px; font-weight:600; display:grid; place-items:center; color:var(--pacc) } .puser span{ display:flex; flex-direction:column; min-width:0 } .puser b{ font-weight:500; font-size:11.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis } .puser small{ font-family:var(--mono); font-size:8px; letter-spacing:.1em; text-transform:uppercase; opacity:.7 }
.pside ul{ list-style:none; display:grid; gap:2px } .pside li{ display:flex; align-items:center; gap:9px; padding:9px 10px; border-radius:9px; font-size:12px; opacity:.85 } .pside li.on{ background:rgba(255,255,255,.6); opacity:1; font-weight:500 } .pside li svg{ width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round }
.pver{ margin-top:auto; font-size:9.5px; opacity:.7 }
.pmain{ padding:16px clamp(14px,2vw,26px) 22px; display:flex; flex-direction:column; gap:12px; min-width:0 }
.ptop{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding-bottom:12px; border-bottom:1px solid var(--pline) } .ptop small{ display:block; font-family:var(--mono); font-size:8.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--pdim) } .ptop b{ font-family:var(--display); font-weight:500; font-size:18px; letter-spacing:-.02em }
.ptools{ display:flex; align-items:center; gap:8px; font-size:11px; color:var(--pmut) } .ptools .pill,.ptools span{ padding:6px 9px; border:1px solid var(--pline); border-radius:8px; background:var(--psurf) } .ptools i{ width:28px; height:28px; border:1px solid var(--pline); border-radius:8px; background:var(--psurf); position:relative } .ptools i.bell em{ position:absolute; top:6px; right:6px; width:6px; height:6px; border-radius:50%; background:var(--pacc2); animation:pulseDot 2.4s ease-in-out infinite }
.prow{ display:flex; justify-content:space-between; align-items:center; gap:10px } .prow > div{ display:flex; gap:8px }
.psel{ display:inline-flex; align-items:center; gap:8px; font-family:var(--display); font-size:15px; font-weight:500; padding:6px 10px; border:1px solid var(--pline); border-radius:8px; background:var(--psurf) } .psel svg{ width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2 }
.pbtn{ display:inline-flex; align-items:center; gap:7px; padding:8px 12px; border-radius:8px; border:1px solid var(--pline); background:var(--psurf); font-size:11.5px; font-weight:500 } .pbtn.acc{ background:var(--pacc2); border-color:var(--pacc2); color:#0f1a15 } .pbtn svg{ width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round } .pbtn .spin{ transform-origin:center } .pnl.tick .pbtn .spin{ animation:pspin .9s var(--ease) }
@keyframes pspin{ to{ transform:rotate(360deg) } }
.pper{ display:flex; justify-content:space-between; padding:10px 14px; border:1px solid var(--pline); border-radius:10px; background:var(--psurf); font-size:11.5px } .pper span:last-child{ color:var(--pmut) }
.pnote{ font-size:10.5px; color:var(--pdim); margin:-4px 0 0 }
.pkpis{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px }
.pk{ padding:16px 16px 14px; border:1px solid var(--pline); border-radius:12px; background:var(--psurf); display:flex; flex-direction:column; gap:6px; transition:opacity .6s var(--ease), transform .6s var(--ease); transition-delay:calc(.1s + var(--k,0) * 90ms) }
.pkh{ display:flex; align-items:center; gap:8px; font-size:12px; color:var(--pmut) } .pkh svg{ width:16px; height:16px; fill:none; stroke:var(--pacc); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round }
.pk .pv{ font-family:var(--display); font-weight:500; font-size:clamp(22px,2.3vw,30px); letter-spacing:-.035em; line-height:1.05; font-variant-numeric:tabular-nums } .pk small{ font-size:10.5px; color:var(--pmut) }
.pk .chip{ align-self:flex-start; margin-top:4px; font-size:9.5px; padding:4px 8px; border-radius:99px; border:1px solid var(--pline); color:var(--pmut) } .pk .chip.up{ color:var(--pacc); border-color:color-mix(in oklab, var(--pacc) 35%, #fff); background:color-mix(in oklab, var(--pacc) 8%, #fff) }
.pk em{ font-style:normal; font-size:9.5px; color:var(--pdim) }
.pgrid{ display:grid; grid-template-columns:1.5fr 1fr; gap:12px }
.pc{ padding:14px 16px 12px; border:1px solid var(--pline); border-radius:12px; background:var(--psurf); min-width:0; transition:opacity .6s var(--ease), transform .6s var(--ease); transition-delay:.4s }
.pntabs{ display:flex; gap:16px; border-bottom:1px solid var(--pline); margin-bottom:12px } .pntabs span{ padding:4px 0 8px; font-size:12px; color:var(--pmut) } .pntabs span.on{ color:var(--pink); font-weight:500; box-shadow:inset 0 -2px 0 var(--pacc) }
.pc h4{ display:flex; align-items:center; gap:7px; font-size:13px; font-weight:500 } .pc h4 svg{ width:15px; height:15px; fill:none; stroke:var(--pink); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round } .pc > small{ display:block; font-size:10px; color:var(--pdim); margin-top:3px }
.pnbars{ display:flex; align-items:flex-end; gap:4%; height:150px; margin-top:14px; padding-bottom:6px; border-bottom:1px solid var(--pline) }
.pnbars i{ flex:1; height:calc(var(--v) * 100%); min-height:3px; border-radius:4px 4px 2px 2px; background:var(--pacc2); transform-origin:bottom; transform:scaleY(0); transition:transform .9s var(--ease); transition-delay:calc(.35s + var(--k,0) * 45ms) }
.pnbars i[style*="--v:.0"],.pnbars i[style*="--v:.1"]{ background:color-mix(in oklab, var(--pacc2) 70%, #fff) }
.pnl.in .pnbars i{ transform:scaleY(1) } .pnl.tick .pnbars i{ transition-delay:0s }
.pnaxis{ display:flex; justify-content:space-between; font-family:var(--mono); font-size:9px; color:var(--pdim); margin-top:6px } .pnhint{ font-size:9.5px; color:var(--pdim); margin-top:10px }
.pnrank ul{ list-style:none; margin-top:12px; display:grid } .pnrank li{ display:flex; align-items:center; gap:10px; padding:9px 0; border-bottom:1px solid var(--pline); transition:opacity .5s var(--ease), transform .5s var(--ease); transition-delay:calc(.5s + var(--k,0) * 90ms) } .pnrank li:last-child{ border-bottom:0 }
.pnrank li i{ width:22px; height:22px; border-radius:50%; background:var(--pacc); color:#fff; font-style:normal; font-size:10px; font-weight:600; display:grid; place-items:center; flex:none } .pnrank li span{ display:flex; flex-direction:column; min-width:0 } .pnrank li span b{ font-weight:500; font-size:12px } .pnrank li span small{ font-size:10px; color:var(--pdim) } .pnrank li .n{ margin-left:auto; font-family:var(--display); font-weight:500; font-size:14px }
/* entrada */
html.js .pnl:not(.in) .pk, html.js .pnl:not(.in) .pc, html.js .pnl:not(.in) .pnrank li{ opacity:0; transform:translateY(10px) }
.pnl.settled .pk, .pnl.settled .pc, .pnl.settled .pnrank li{ transition-delay:0s }
@media (max-width:900px){ .pbody{ grid-template-columns:1fr } .pside{ display:none } .pgrid{ grid-template-columns:1fr } .ptools span:not(.pill){ display:none } }
@media (max-width:640px){ .pkpis{ grid-template-columns:1fr } .pk{ flex-direction:row; flex-wrap:wrap; align-items:center; gap:4px 10px } .pk .pkh{ width:100% } .pk small{ display:none } .prow{ flex-wrap:wrap } .pnote{ display:none } .pnbars{ height:110px } }
@media (prefers-reduced-motion:reduce){ .pk,.pc,.pnrank li,.pnbars i{ transition:none !important; opacity:1 !important; transform:none !important } .pnl.tick .pbtn .spin{ animation:none } }