.entrada{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);min-height:100dvh;background:var(--paper)}
.arte{position:relative;overflow:hidden;background:#24292C;color:#fff;padding:clamp(28px,5vw,64px);display:flex;flex-direction:column;justify-content:space-between;
  clip-path:polygon(0 0,100% 0,calc(100% - 90px) 100%,0 100%);padding-right:calc(clamp(28px,5vw,64px) + 70px)}
.arte .marca{display:block;width:170px;height:auto;position:relative;z-index:2}
.arte-texto{position:relative;z-index:2;max-width:30ch;margin-bottom:36px}
.arte-texto h2{font-size:clamp(32px,4vw,56px);line-height:1;font-weight:800;letter-spacing:-.035em;margin-bottom:16px}
.arte-texto h2 em{font-style:normal;color:#F5A05A}
.arte-texto p{color:rgba(255,255,255,.78);font-size:clamp(16px,1.4vw,19px);max-width:32ch}
.arte-rodape{position:relative;z-index:2;font-size:14px;font-weight:600;color:rgba(255,255,255,.6)}
.form-lado{display:flex;align-items:center;justify-content:center;padding:clamp(24px,5vw,64px)}
.form-caixa{width:min(400px,100%);display:grid;gap:26px}
.form-caixa .cab{margin:0}
.form-caixa h1{font-size:clamp(32px,4vw,44px)}
.form-caixa .cartao{border:0;box-shadow:none;padding:0;background:transparent}
.form-caixa .b{width:100%}
.form-caixa .b.prim{min-height:56px}
.assina{font-size:14px;color:var(--muted)}
.assina strong{color:var(--ink)}
@media (max-width:820px){
  .entrada{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  .arte{clip-path:polygon(0 0,100% 0,100% calc(100% - 28px),0 100%);padding:24px 20px 56px}
  .arte-texto,.arte-rodape{display:none}
  .arte .marca{width:140px}
  .faixa-dia{display:none}
  .form-lado{align-items:flex-start;padding-top:28px}
}
.msg:empty{display:none}

.faixa-dia{position:relative;z-index:2;margin-block:auto 40px;max-width:440px}
.horas{display:grid;grid-template-columns:repeat(24,1fr);gap:4px;align-items:end;height:120px}
.horas i{display:block;height:34%;background:rgba(255,255,255,.14)}
.horas i.on{height:62%;background:rgba(255,255,255,.88)}
.horas i.ini,.horas i.fim{height:100%;background:#F5A05A}
.marcas{display:flex;justify-content:space-between;margin-top:12px;font-weight:700;font-size:14px;color:#F5A05A;font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:no-preference){
  .horas i{transform-origin:bottom;animation:sobe .7s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--n,0)*18ms)}
  @keyframes sobe{from{transform:scaleY(.2);opacity:0}}
}