/* ===== Página inicial v2 · o dia do corretor ===== */

/* abertura */
.hero-v .art{width:min(230px,60vw)}
.hero-v .sub{max-width:38ch}

/* bastidores */
.bast{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-direction:column}
.bast li{padding-block:18px;border-top:1px solid var(--fio);display:flex;flex-direction:column;gap:8px}
.bast li:first-child{border-top:none;padding-top:4px}
.bast .bc{display:grid;grid-template-columns:16px 1fr;align-items:baseline;color:var(--creme);font-size:var(--t-texto);line-height:1.5}
.bast .bc::before{content:"";width:7px;height:7px;border:1px solid var(--sombra);transform:translateY(-1px)}
.bast .bl{font-weight:400;display:grid;grid-template-columns:16px 1fr;align-items:baseline;color:var(--creme);font-size:var(--t-texto);line-height:1.4}
.bast .bl::before{content:"→";color:var(--chama);font-size:var(--t-texto)}
.vira{margin-top:22px;padding-top:20px;border-top:1px solid var(--fio);color:var(--creme);font-size:var(--t-texto)}
.vira2{font-weight:400;margin-top:8px;color:var(--creme);font-size:var(--t-texto);line-height:1.4;text-wrap:balance}

/* palco */
.vitrine{padding-bottom:48px;overflow:hidden}
.palco{position:relative;margin-top:26px;padding:0 22px;display:grid;justify-items:center;gap:18px;grid-template-areas:"topo" "fone" "regua" "ctrl" "fic"}
.ceu{position:absolute;left:0;right:0;top:40px;height:300px;pointer-events:none;z-index:0}
.ceu svg{position:absolute;inset:0;width:100%;height:100%}
.ceu::after{content:"";position:absolute;left:50%;top:60%;width:340px;height:340px;margin:-170px 0 0 -170px;border-radius:50%;background:var(--luz,#E9B872);opacity:.16;filter:blur(70px);transition:background-color 1.6s ease}
.sol{position:absolute;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:#C2441F;box-shadow:0 0 12px 3px #E0512F80;transition:left 1.6s cubic-bezier(.4,0,.2,1),top 1.6s cubic-bezier(.4,0,.2,1),opacity 1s,box-shadow 1.6s}

.cena-topo{grid-area:topo;position:relative;z-index:1;text-align:center;display:flex;flex-direction:column;align-items:center;gap:2px}
.hora{font-weight:500;font-size:var(--t-detalhe);letter-spacing:.24em;color:var(--chama);font-variant-numeric:tabular-nums}
.onde{min-height:2.6em;max-width:20ch;text-wrap:balance;font-size:var(--t-sub);color:var(--creme);line-height:1.3;transition:opacity .4s}
.onde.troca{opacity:0}

/* aparelho */
.aparelho{
  grid-area:fone;position:relative;z-index:1;
  width:min(290px,80vw);aspect-ratio:290/545;padding:7px;border-radius:38px;
  background:linear-gradient(160deg,#1A1C28,#14121A 60%);border:1px solid #FFFFFF26;
  box-shadow:0 0 0 1px #00000080,0 18px 50px #00000099
}
.tela-moldura{position:relative;width:100%;height:100%;border-radius:31px;overflow:hidden;background-color:var(--papel,#8C7A6B);transition:background-color 1.6s ease;color:#14121A;font-size:12.5px;line-height:1.4}
.tela-moldura::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 70% at 50% 0%,#FFFFFF2E,transparent 60%),linear-gradient(180deg,transparent 40%,#00000059)}
.bloqueio{position:relative;text-align:center;color:#fff;padding-top:34px}
.b-hora{font-size:58px;font-weight:400;letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums}
.b-dia{font-size:12.5px;opacity:.85;margin-top:6px}
.notifs{position:absolute;left:10px;right:10px;top:132px;display:flex;flex-direction:column;gap:8px}

.nt{background:#FFFFFFE6;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:16px;padding:10px 12px 11px;box-shadow:0 6px 20px #0000002E;transform-origin:top center;transition:opacity .5s,transform .5s}
.nt.nova{animation:cai .7s cubic-bezier(.2,1.25,.4,1) both}
@keyframes cai{from{opacity:0;transform:translateY(-26px) scale(.94)}to{opacity:1;transform:none}}
.nt.velha{opacity:.62;transform:scale(.96)}
.nt.velha .nt-corpo,.nt.velha .extra{display:none}
.nt-cab{display:flex;align-items:center;gap:7px;font-size:10.5px;color:#5B6170}
.nt-ic{width:18px;height:18px;border-radius:5px;display:flex;align-items:center;justify-content:center;flex:none}
.nt-ic.eli{background:#C2441F}.nt-ic.esp{background:#1C7254}.nt-ic.pai{background:#3F4EA6}
.nt-cab .ag{margin-left:auto}
.nt-tit{font-weight:500;font-size:13px;margin-top:5px;color:#14121A}
.nt-corpo{font-size:12px;color:#3C4150;margin-top:2px;line-height:1.42}

/* extras dentro das notificações */
.lotes{display:grid;grid-template-columns:repeat(8,1fr);gap:3px;margin-top:9px}
.lotes i{height:16px;border-radius:3px;border:1px solid}
.lotes .lv{background:#DDF0E8;border-color:#1C7254}
.lotes .vd{background:#E3E6EB;border-color:#C5CBD4}
.lotes .rs{background:#F6E7C8;border-color:#8A5F0F}
.nova .lotes .alvo{animation:reserva .5s 1.4s both}
@keyframes reserva{0%{background:#DDF0E8;border-color:#1C7254;transform:scale(1)}50%{transform:scale(1.25)}100%{background:#F6E7C8;border-color:#8A5F0F;transform:scale(1)}}
.ficha{margin:9px 0 0;display:grid;grid-template-columns:auto 1fr;gap:4px 10px;font-size:11.5px}
.ficha dt{color:#5B6170}.ficha dd{margin:0;color:#14121A}
.nova .ficha > *{animation:entra .4s both}
.nova .ficha > :nth-child(n+3){animation-delay:.5s}.nova .ficha > :nth-child(n+5){animation-delay:.8s}.nova .ficha > :nth-child(n+7){animation-delay:1.1s}
@keyframes entra{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.abrir{display:block;margin-top:10px;text-align:center;background:#C2441F;color:#fff;border-radius:9px;padding:7px;font-weight:500;font-size:12px}
.nova .abrir{animation:entra .4s 1.5s both}
.bolha{margin-top:8px;background:#DCE7F5;border-radius:10px 10px 10px 3px;padding:7px 9px;font-size:11.5px;color:#14121A}
.nova .bolha{animation:entra .4s .9s both}
.bolha.cli{background:#fff;border:1px solid #D5DBE3;border-radius:10px 10px 3px 10px;margin-left:24px}
.nova .bolha.cli{animation-delay:1.7s}

.toque{position:absolute;inset:0;z-index:4;border:0;background:transparent;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:31px}
.toque:focus-visible{outline:2px solid #E0512F;outline-offset:-4px}

/* legenda */
.legenda{grid-area:leg;position:relative;z-index:1;width:100%;max-width:400px;text-align:center;min-height:128px}
.legenda h3{font-size:var(--t-sub);line-height:1.3;transition:opacity .4s}
.legenda p{color:var(--nevoa);font-size:var(--t-texto);margin-top:8px;transition:opacity .4s}
.legenda.troca h3,.legenda.troca p{opacity:0}

/* régua do dia */
.regua-dia{grid-area:regua;width:100%;max-width:400px;display:grid;grid-template-columns:repeat(6,1fr);position:relative;padding-top:12px}
.regua-dia::before{content:"";position:absolute;top:15px;left:8.33%;right:8.33%;height:1px;background:var(--fio)}
.regua-dia .fill{position:absolute;top:15px;left:8.33%;height:1px;background:var(--chama);width:0;transition:width .6s ease}
.regua-dia button{position:relative;background:none;border:0;padding:0 0 4px;color:var(--nevoa);font:inherit;font-size:var(--t-detalhe);font-variant-numeric:tabular-nums;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:9px;min-height:44px}
.regua-dia button::before{content:"";width:7px;height:7px;background:var(--vazio);border:1px solid var(--sombra);transition:background .3s,border-color .3s}
.regua-dia button.passou{color:var(--nevoa)}
.regua-dia button.passou::before{border-color:var(--chama);background:#F08B5847}
.regua-dia button[aria-selected="true"]{color:var(--creme)}
.regua-dia button[aria-selected="true"]::before{background:var(--brasa);border-color:var(--brasa);box-shadow:0 0 8px #E0512F99}
.ctrl{grid-area:ctrl}
.ctrl button{height:36px;padding:0 16px;border-radius:9px;border:1px solid #14121A26;background:transparent;color:var(--nevoa);font:inherit;font-size:var(--t-detalhe);cursor:pointer}
.ctrl button:hover{border-color:#14121A55;color:var(--creme)}
.ficticio{grid-area:fic;font-size:var(--t-detalhe);color:var(--nevoa)}

/* o que você recebe */
.recebe{list-style:none;margin:24px 0 0;padding:0;display:flex;flex-direction:column}
.recebe li{display:grid;grid-template-columns:18px 1fr;gap:4px 10px;padding-block:16px;border-top:1px solid var(--fio)}
.recebe li:first-child{border-top:none;padding-top:4px}
.recebe li::before{content:"";width:7px;height:7px;background:var(--brasa);margin-top:8px;grid-row:1}
.recebe h3{font-size:var(--t-sub);line-height:1.35}
.recebe p{grid-column:2;color:var(--creme);font-size:var(--t-texto);line-height:1.55}
.oficial{color:var(--creme);font-size:var(--t-texto);margin-top:20px;padding-top:16px;border-top:1px solid var(--fio)}

@media (min-width:860px){
  .palco{max-width:920px;margin-inline:auto;grid-template-columns:auto 380px;column-gap:64px;row-gap:14px;justify-items:start;align-content:center;
    grid-template-areas:"fone topo" "fone regua" "fone ctrl" "fone fic"}
  .aparelho{width:290px}
  .cena-topo,.legenda{text-align:left;align-items:flex-start}
  .legenda{min-height:120px}
  .ceu{top:0;height:100%}
}
@media (prefers-reduced-motion:reduce){
  .nt.nova,.nova .ficha > *,.nova .abrir,.nova .bolha,.nova .lotes .alvo{animation:none!important}
  .sol,.tela-moldura,.ceu::after{transition:none}
}

/* o que o cliente não diz */
.dor-txt{display:flex;flex-direction:column;gap:16px;margin-top:20px}
.dor-txt p{color:var(--creme);font-size:var(--t-texto)}
.dor-txt .forte{font-weight:400;color:var(--creme);font-size:var(--t-texto);line-height:1.5;padding-left:16px;border-left:1px solid var(--brasa)}

/* a conversa que você não ouve */
.ouvido{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-direction:column;gap:26px}
.ouvido p{font-weight:400;margin-top:8px;color:var(--creme);font-size:var(--t-texto);line-height:1.42;text-wrap:pretty}
.dialogo{margin-top:40px;padding:26px 0;border-top:1px solid var(--fio);border-bottom:1px solid var(--fio);display:flex;flex-direction:column;gap:10px}
.dialogo p{color:var(--creme);font-size:var(--t-texto)}
.dialogo .resp{font-weight:400;color:var(--creme);font-size:var(--t-texto)}
.dialogo + .vira2{margin-top:26px}

/* v7 */
.hero-v h1{margin-top:12px;max-width:17ch}
.intervalo .forte{font-weight:400;color:var(--creme);font-size:var(--t-texto);line-height:1.45}
.fecho-demo{margin-top:34px}
.fecho-demo .vira2{margin-top:0}
.entrega{display:flex;flex-direction:column;margin-top:8px}
.entrega article{padding-block:30px;border-top:1px solid var(--fio)}
.entrega article:first-child{border-top:none;padding-top:10px}
.entrega h2{margin-top:0;font-size:var(--t-titulo)}
.entrega .txt{color:var(--creme);font-size:var(--t-texto);margin-top:12px}
.entrega .destaque{margin-top:18px}
.fecho .discreto{margin-top:20px;font-size:var(--t-texto);color:var(--creme);text-decoration:none;border-bottom:1px solid var(--brasa);padding-bottom:1px}
.fixo{position:fixed;z-index:30;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));bottom:calc(12px + env(safe-area-inset-bottom,0px));
  display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border-radius:10px;background:var(--brasa);color:#fff;font-weight:500;font-size:var(--t-texto);text-decoration:none;
  box-shadow:0 8px 24px #14121A40;opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .3s,transform .3s}
.fixo.on{opacity:1;transform:none;pointer-events:auto}
@media (min-width:760px){.fixo{display:none}}
.mini-mapa{display:block;width:100%;margin-top:9px}
.nova .alvo-m{animation:pisca 1.4s .6s 3 ease-in-out}
@keyframes pisca{50%{fill:#F6C9B2}}
.midia{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:9px}
.midia span{position:relative;height:44px;border-radius:7px;background:linear-gradient(135deg,#C9D3E0,#9FB0C4);color:#fff;font-size:10.5px;font-weight:500;display:flex;align-items:flex-end;padding:5px 6px}
.midia span:nth-child(2){background:linear-gradient(135deg,#B7C9A8,#7E9A6E)}
.midia span:nth-child(3){background:linear-gradient(135deg,#D9B79A,#A9785A)}
.midia i{position:absolute;top:12px;left:50%;margin-left:-6px;border-left:11px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent}
.nova .midia span{animation:entra .4s both}
.nova .midia span:nth-child(2){animation-delay:.35s}.nova .midia span:nth-child(3){animation-delay:.7s}
.parados{list-style:none;margin:9px 0 0;padding:0;display:flex;flex-direction:column;gap:5px}
.parados li{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 8px;border-radius:7px;background:#F2F4F7;border-left:3px solid #8A5F0F}
.parados b{display:block;height:7px;width:46%;border-radius:4px;background:#D5DBE3}
.parados span{font-size:10.5px;color:#8A5F0F}
.nova .parados li{animation:entra .4s both}
.nova .parados li:nth-child(2){animation-delay:.3s}.nova .parados li:nth-child(3){animation-delay:.6s}
.envio{display:flex;gap:6px;margin-top:9px}
.envio i{flex:1;height:6px;border-radius:3px;background:#E3E6EB;position:relative;overflow:hidden}
.envio i::after{content:"";position:absolute;inset:0;background:#1C7254;transform:scaleX(0);transform-origin:left}
.nova .envio i::after{animation:enche .6s forwards}
.nova .envio i:nth-child(1)::after{animation-delay:.5s}.nova .envio i:nth-child(2)::after{animation-delay:1s}.nova .envio i:nth-child(3)::after{animation-delay:1.5s}
@keyframes enche{to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.nova .midia span,.nova .parados li{animation:none}.envio i::after{transform:scaleX(1)}}

.hero-v .lua{width:min(230px,60vw);height:auto;display:block}
.lua .sobe{transform-box:fill-box;animation:lua-sobe 2.2s .3s cubic-bezier(.2,.6,.3,1) both}
@keyframes lua-sobe{from{transform:translateY(24px)}to{transform:none}}
@media (min-width:900px){.hero-v .lua{width:300px}}
@media (prefers-reduced-motion:reduce){.lua .sobe{animation:none}}