/* Seção: onde fica e como marcar. A fachada na lateral direita (espelho da porta);
   a semana como prateleira de LED: pedra quente nos dias em que a casa abre. */
.onde{position:relative;z-index:7;isolation:isolate;overflow:clip;background:var(--creme);margin-top:-2.4rem;border-radius:2.4rem 2.4rem 0 0;padding:var(--respiro) var(--margem) calc(var(--respiro) + 2.4rem)}
.on-malha{position:absolute;inset:0;z-index:-2;overflow:hidden}
.on-malha i{position:absolute;border-radius:50%;filter:blur(90px)}
.on-malha i:nth-child(1){left:-10%;top:20%;width:60%;height:50%;background:radial-gradient(closest-side in oklch,var(--mel-1),transparent);animation:vai 33s ease-in-out infinite alternate}
.on-malha i:nth-child(2){left:20%;bottom:-12%;width:80%;height:50%;background:radial-gradient(closest-side in oklch,var(--ambar),transparent);animation:vem 28s ease-in-out infinite alternate}
.on-malha i:nth-child(3){right:-8%;top:-8%;width:44%;height:40%;background:radial-gradient(closest-side in oklch,var(--mel-2),transparent);opacity:.6}
.on-dentro{max-width:var(--largura);margin:0 auto}
.on-topo{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(2rem,5vw,5.5rem);align-items:center}
.on-texto h2{margin-top:1rem;font-size:clamp(1.7rem,3vw,2.8rem);line-height:1.06;max-width:16ch}
.on-end{margin-top:clamp(1.4rem,3vw,2.4rem);font-style:normal}
.on-end b{display:block;font-family:var(--display);font-weight:400;font-size:clamp(2.3rem,5vw,4.8rem);line-height:.98;letter-spacing:-.022em}
.on-end span{display:block;margin-top:.7rem;font-size:clamp(1.02rem,1.3vw,1.25rem);color:var(--tinta-2)}
.on-acoes{margin-top:clamp(1.4rem,2.8vw,2.2rem);display:flex;flex-wrap:wrap;gap:1rem 1.6rem;align-items:center}
.on-acoes button{appearance:none;background:none;border:0;padding:0;font:inherit;font-weight:700;font-size:.94rem;color:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:.3em;text-decoration-thickness:1.5px;text-decoration-color:var(--mel-2)}
.on-acoes button:hover{text-decoration-color:var(--pink)}
.on-end span{text-wrap:balance}
.on-end span i{font-style:normal;white-space:nowrap}
.on-fatos{margin-top:clamp(1.8rem,3.4vw,2.8rem);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem;border-top:1px solid var(--filete);padding-top:1.2rem}
.on-fatos dt{font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--madeira-texto)}
.on-fatos dd{margin:.45rem 0 0;font-size:.94rem;line-height:1.45;color:var(--tinta)}
.on-foto{position:relative;margin:0 calc(-1 * var(--margem)) 0 0}
.on-quadro{position:relative;aspect-ratio:1079/793;border-radius:2.4rem 0 0 2.4rem;overflow:hidden;box-shadow:0 44px 70px -32px rgba(74,40,16,.6),0 0 0 1px rgba(255,255,255,.35)}
.on-quadro img,.on-quadro iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0}
.on-pino{position:absolute;left:41.6%;top:60%;transform:translate(-50%,-100%);display:grid;justify-items:center;pointer-events:none;animation:pino 3.6s ease-in-out infinite}
.on-pino svg{width:clamp(2.4rem,4.4vw,3.6rem);filter:drop-shadow(0 10px 6px rgba(30,14,6,.55))}
.on-pino::after{content:"";width:2px;height:clamp(1.2rem,2.6vw,2.2rem);margin-top:-.2rem;background:linear-gradient(180deg,var(--led),rgba(255,243,210,.2));box-shadow:0 0 8px rgba(255,210,140,.9)}
.on-pino b{order:-1;margin-bottom:.35rem;font-size:.62rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--basalto);background:var(--led);padding:.25rem .6rem;border-radius:99px;white-space:nowrap}
@keyframes pino{50%{transform:translate(-50%,-106%)}}
.on-foto figcaption{margin-top:.9rem;font-size:.82rem;color:var(--tinta-2)}

/* a semana */
.on-semana{margin-top:clamp(3rem,7vw,5.5rem);display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(1.5rem,4vw,4rem);align-items:end}
.on-agora{font-family:var(--display);font-size:clamp(1.6rem,3vw,2.7rem);line-height:1.06;letter-spacing:-.012em;text-wrap:balance}
.on-agora+p{margin-top:.8rem;font-size:.86rem;line-height:1.5;color:var(--tinta-2);max-width:32ch}
.on-dias{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));position:relative}
.on-dias{--fita:clamp(5rem,8vw,7rem)}
.on-dias::after{content:"";position:absolute;left:0;right:14.3%;top:var(--fita);height:5px;border-radius:5px;background:var(--led);box-shadow:0 0 22px 8px rgba(255,210,140,.85),0 0 70px 26px rgba(247,190,110,.45)}
.on-dias li{display:grid;grid-template-rows:var(--fita,5.2rem) auto;justify-items:center;text-align:center;font-size:.84rem;color:var(--tinta-2);position:relative;z-index:1}
.on-dias svg{align-self:end;width:min(84%,8.4rem);margin-bottom:-.5rem;transition:transform .8s var(--pouso)}
.on-dias li.meio svg{width:min(60%,6rem)}
.on-dias abbr{text-decoration:none}
.on-dias li.fechado .calor{display:none}
.on-dias li.fechado svg{filter:grayscale(1) brightness(1.5) contrast(.7);opacity:.75;margin-bottom:-.2rem}
.on-dias b{display:block;margin-top:1.3rem;font-family:var(--display);font-weight:400;font-size:clamp(1.25rem,1.9vw,1.7rem);line-height:1.1;color:var(--tinta)}
.on-dias li.fechado b{color:var(--tinta-2)}
.on-dias li.hoje svg{transform:translateY(-.9rem)}
.on-dias li.hoje b::after{content:"hoje";display:block;width:max-content;margin:.3rem auto .25rem;padding:.2rem .55rem;border-radius:99px;background:var(--pink);color:#fff;font-family:var(--sans);font-size:.6rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;line-height:1.3}
@media (max-width:860px){
  .onde{border-radius:1.6rem 1.6rem 0 0;margin-top:-1.6rem;padding-bottom:calc(var(--respiro) + 1.6rem)}
  .on-topo{grid-template-columns:1fr;gap:2rem}
  .on-foto{order:-1;margin-left:2.2rem}
  .on-quadro{border-radius:1.6rem 0 0 1.6rem}
  .on-fatos{grid-template-columns:1fr;gap:.9rem}
  .on-fatos div{display:grid;grid-template-columns:7.2rem 1fr;gap:.8rem;align-items:baseline}
  .on-fatos dd{margin:0}
  .on-semana{grid-template-columns:1fr;gap:1.8rem}
  .on-dias{--fita:3.8rem}
  .on-dias li{font-size:.6rem}
  .on-dias svg{width:92%}
  .on-dias li.meio svg{width:66%}
  .on-dias b{font-size:1rem;margin-top:1rem}
  .on-pino b{font-size:.54rem}
}
/* no celular o horário de cada dia aparece curto ("8–18h"), em letra legível; o texto inteiro fica para leitores de tela */
.on-dias .h-c{display:none}
@media (max-width:860px){
  .on-dias li{font-size:.7rem}
  .on-dias .h-l{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .on-dias .h-c{display:inline}
}
@media (min-width:600px) and (max-width:860px){
  .on-foto{margin-left:0}
  .on-dias li{font-size:.84rem}
}
