/* ============================================================
   SEÇÃO · tempo (Passado / Futuro)
   Convertido de gloda-home.html. Escopo .lp-root.
   ============================================================ */
/* ============================================================
   6 · PASSADO / FUTURO
   ============================================================ */
.lp-root .tempo{background:var(--paper-2);border-radius:var(--radius-lg);padding:var(--space-56) var(--space-48);}
/* regra 7: grid com overflow usa minmax(0,…) */
.lp-root .tempo-grid{
  display:grid;
  grid-template-columns:minmax(0,340px) minmax(0,1fr);
  gap:var(--space-48);align-items:start;
}
.lp-root .cats{display:flex;flex-direction:column;min-width:0;}
.lp-root .cat{
  display:flex;align-items:center;gap:var(--space-16);width:100%;
  min-height:91px;                     /* passo 91 medido no layout */
  padding:0 var(--space-12);text-align:left;
  font-size:var(--fs-h2);font-weight:500;line-height:1.15;
  letter-spacing:var(--ls-titulo);color:var(--muted);
  border-radius:var(--radius-sm);
  transition:color .2s ease;
}
.lp-root .cat .dot{width:19px;height:19px;border-radius:50%;background:transparent;flex:0 0 auto;transition:all .25s ease;}
.lp-root .cat:hover{color:var(--ink-2);}
.lp-root .cat.is-on{color:var(--ink)!important;}
.lp-root .cat.is-on .dot{background:var(--blue)!important;box-shadow:0 0 0 4px rgba(1,90,255,.16);}
.lp-root .tempo-panel{min-width:0;}
.lp-root .pills{display:inline-flex;gap:var(--space-4);padding:var(--space-4);border-radius:var(--radius-full);background:var(--paper);border:1px solid var(--line);margin-bottom:var(--space-24);}
.lp-root .pill{
  min-height:56px;padding:0 var(--space-32);border-radius:var(--radius-full);
  font-size:var(--fs-h4);font-weight:600;line-height:1;letter-spacing:var(--ls-apoio);color:var(--muted);
  transition:background .22s ease,color .22s ease;
}
.lp-root .pill.is-on{background:var(--navy-900)!important;color:var(--paper)!important;}
.lp-root .pill:hover:not(.is-on){color:var(--blue);}
.lp-root .tempo-media{position:relative;width:100%;aspect-ratio:578 / 394;overflow:hidden;border-radius:var(--radius);background:var(--paper-3);}
.lp-root .tempo-media img{
  position:absolute!important;inset:0!important;
  width:100%!important;height:100%!important;max-width:none!important;
  object-fit:cover!important;transition:opacity .2s ease;
}
.lp-root .tempo-copy{margin-top:var(--space-24);max-width:60ch;}
.lp-root .tempo-copy h3{font-size:var(--fs-h3);font-weight:600;line-height:1.2;letter-spacing:var(--ls-apoio);}
.lp-root .tempo-copy p{margin-top:var(--space-12);font-size:var(--fs-base);line-height:1.65;color:var(--ink-2);}
.lp-root .fade-swap{animation:lpFade .45s ease;}
@keyframes lpFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (max-width:1200px){
  .lp-root .tempo{padding:var(--space-40) var(--space-32);}
  .lp-root .tempo-grid{grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:var(--space-32);}
  .lp-root .cat{min-height:72px;font-size:var(--fs-h3);}
}
@media (max-width:1024px){
  .lp-root .tempo-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-24);}
  .lp-root .cats{
    flex-direction:row;gap:var(--space-8);
    overflow-x:auto;overflow-y:hidden;
    scrollbar-width:none;padding-bottom:var(--space-4);
    -webkit-overflow-scrolling:touch;
    touch-action:pan-x pan-y;
    overscroll-behavior-x:contain;
    scroll-snap-type:x proximity;
  }
  .lp-root .cats::-webkit-scrollbar{display:none;}
  .lp-root .cat{
    width:auto;flex:0 0 auto;
    min-width:0;min-height:48px;scroll-snap-align:center;
    padding:0 var(--space-20);border-radius:var(--radius-full);
    background:var(--paper);border:1px solid var(--line);
    font-size:var(--fs-sm);font-weight:600;white-space:nowrap;
  }
  .lp-root .cat .dot{width:8px;height:8px;}
  .lp-root .cat.is-on{background-color:var(--navy-900)!important;color:var(--paper)!important;border-color:var(--navy-900)!important;}
  .lp-root .cat.is-on .dot{background:var(--accent)!important;box-shadow:none;}
}
@media (max-width:768px){
  .lp-root .tempo{padding:var(--space-24) var(--space-16);}
  .lp-root .tempo-media{aspect-ratio:4/3;}
  .lp-root .pills{width:100%;display:flex;}
  .lp-root .pill{flex:1 1 0;padding:0 var(--space-4);min-width:0;font-size:var(--fs-sm);}
}

/* ============================================================
   variante "apple" (Home V2, 23/09/2026) — mesma função, visual Apple.
   Trilho fino à esquerda das áreas, controle segmentado claro, cinzas da Apple.
   Seletores com .tempo--apple ganham dos !important de cor do base.css pela especificidade.
   ============================================================ */
.lp-root .tempo--apple{background:#f5f5f7;padding:var(--space-64) var(--space-56);}
.lp-root .tempo--apple .tempo-head{margin-bottom:var(--space-48);}
.lp-root .tempo--apple .tempo-grid{grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:var(--space-56);}
/* áreas: texto grande, cinza; a ativa em preto, marcada no trilho */
.lp-root .tempo--apple .cats{position:relative;padding-left:var(--space-20);}
.lp-root .tempo--apple .cats::before{content:"";position:absolute;left:0;top:var(--space-8);bottom:var(--space-8);width:2px;border-radius:2px;background:#d2d2d7;}
.lp-root .tempo--apple .cat{
  position:relative;min-height:64px;padding:0;gap:0;border-radius:0;
  font-size:var(--fs-h3);font-weight:600;letter-spacing:var(--ls-apoio);color:#86868b;
}
.lp-root .tempo--apple .cat .dot{display:none;}
.lp-root .tempo--apple .cat::before{
  content:"";position:absolute;left:calc(var(--space-20) * -1);top:20%;bottom:20%;width:2px;border-radius:2px;
  background:#1d1d1f;transform:scaleY(0);transition:transform .35s cubic-bezier(.2,.7,.2,1);
}
.lp-root .tempo--apple .cat:hover{color:#1d1d1f;}
.lp-root .tempo--apple .cat.is-on{color:#1d1d1f!important;background:transparent!important;}
.lp-root .tempo--apple .cat.is-on::before{transform:scaleY(1);}
/* Passado | Futuro: controle segmentado claro */
.lp-root .tempo--apple .pills{background:#e8e8ed;border:0;padding:3px;gap:0;margin-bottom:var(--space-24);}
.lp-root .tempo--apple .pill{
  min-height:40px;padding:0 var(--space-24);
  font-size:var(--fs-sm);font-weight:600;letter-spacing:0;color:#1d1d1f;opacity:.64;
  transition:background .25s ease,box-shadow .25s ease,opacity .25s ease;
}
.lp-root .tempo--apple .pill:hover:not(.is-on){color:#1d1d1f;opacity:1;}
.lp-root .tempo--apple .pill.is-on{background:#fff!important;color:#1d1d1f!important;opacity:1;box-shadow:0 1px 2px rgba(0,0,0,.06),0 3px 10px rgba(0,0,0,.10);}
.lp-root .tempo--apple .tempo-media{border-radius:var(--radius-lg);background:#e8e8ed;}
.lp-root .tempo--apple .tempo-media img{transition:opacity .35s ease;}
.lp-root .tempo--apple .tempo-copy{margin-top:var(--space-32);}
.lp-root .tempo--apple .tempo-copy h3{font-size:var(--fs-h3);color:#1d1d1f;}
.lp-root .tempo--apple .tempo-copy p{font-size:var(--fs-h4);font-weight:400;line-height:1.5;color:#6e6e73;}
@media (max-width:1200px){
  .lp-root .tempo--apple{padding:var(--space-48) var(--space-32);}
  .lp-root .tempo--apple .tempo-grid{grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:var(--space-40);}
  .lp-root .tempo--apple .cat{min-height:56px;}
}
@media (max-width:1024px){
  .lp-root .tempo--apple .tempo-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-24);}
  .lp-root .tempo--apple .cats{padding-left:0;gap:var(--space-8);}
  .lp-root .tempo--apple .cats::before,.lp-root .tempo--apple .cat::before{display:none;}
  .lp-root .tempo--apple .cat{
    min-height:40px;padding:0 var(--space-16);border-radius:var(--radius-full);
    background:#fff;border:0;font-size:var(--fs-sm);font-weight:600;letter-spacing:0;color:#1d1d1f;
  }
  .lp-root .tempo--apple .cat.is-on{background:#1d1d1f!important;color:#fff!important;}
}
@media (max-width:768px){
  .lp-root .tempo--apple{padding:var(--space-40) var(--space-20);}
  .lp-root .tempo--apple .tempo-head{margin-bottom:var(--space-32);}
  .lp-root .tempo--apple .pill{padding:0 var(--space-8);}
  .lp-root .tempo--apple .tempo-copy p{font-size:var(--fs-base);}
}

/* ============================================================
   OPÇÕES VISUAIS (Home V2, 23/09/2026) — mesma função do tempo, 5 caras para o Daniel escolher.
   Nenhuma muda o JS: só CSS sobre as mesmas classes (.cats .cat .pills .pill .tempo-media .tempo-copy).
   ============================================================ */
.lp-root .tempo-head{margin-bottom:var(--space-48);}

/* ── 1 · abas — abas de texto no topo, tudo centralizado, foto larga (Apple, páginas de produto) */
.lp-root .tempo--abas{background:#f5f5f7;padding:var(--space-64) var(--space-56);text-align:center;}
.lp-root .tempo--abas .tempo-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-32);}
.lp-root .tempo--abas .cats{flex-direction:row;justify-content:center;flex-wrap:wrap;gap:0 var(--space-32);border-bottom:1px solid #d2d2d7;}
.lp-root .tempo--abas .cat{
  position:relative;width:auto;min-height:48px;padding:0 0 var(--space-4);gap:0;border-radius:0;
  font-size:var(--fs-base);font-weight:600;letter-spacing:0;color:#6e6e73;
}
.lp-root .tempo--abas .cat .dot{display:none;}
.lp-root .tempo--abas .cat::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#1d1d1f;transform:scaleX(0);transition:transform .3s ease;}
.lp-root .tempo--abas .cat:hover{color:#1d1d1f;}
.lp-root .tempo--abas .cat.is-on{color:#1d1d1f!important;background:transparent!important;border-color:transparent!important;}
.lp-root .tempo--abas .cat.is-on::after{transform:scaleX(1);}
.lp-root .tempo--abas .tempo-panel{display:flex;flex-direction:column;align-items:center;}
.lp-root .tempo--abas .pills{background:#e8e8ed;border:0;padding:3px;gap:0;}
.lp-root .tempo--abas .pill{min-height:40px;padding:0 var(--space-24);font-size:var(--fs-sm);letter-spacing:0;color:#1d1d1f;opacity:.6;}
.lp-root .tempo--abas .pill.is-on{background:#fff!important;color:#1d1d1f!important;opacity:1;box-shadow:0 2px 8px rgba(0,0,0,.12);}
.lp-root .tempo--abas .tempo-media{aspect-ratio:16/9;border-radius:var(--radius-lg);}
.lp-root .tempo--abas .tempo-copy{margin:var(--space-32) auto 0;max-width:640px;}
.lp-root .tempo--abas .tempo-copy h3{font-size:var(--fs-h2);color:#1d1d1f;}
.lp-root .tempo--abas .tempo-copy p{font-size:var(--fs-h4);font-weight:400;line-height:1.5;color:#6e6e73;}

/* ── 2 · escuro — fundo preto, texto branco, controle de vidro (Insta360) */
.lp-root .tempo--escuro{background:#07090f;padding:var(--space-64) var(--space-56);color:#fff;}
.lp-root .tempo--escuro .lp-sec-tit{color:#fff;}
.lp-root .tempo--escuro .lp-eyebrow{color:#7fb0ff;}
.lp-root .tempo--escuro .tempo-grid{grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:var(--space-56);}
.lp-root .tempo--escuro .cat{min-height:64px;padding:0;gap:var(--space-12);font-size:var(--fs-h3);font-weight:600;letter-spacing:var(--ls-apoio);color:rgba(255,255,255,.38);}
.lp-root .tempo--escuro .cat .dot{width:8px;height:8px;}
.lp-root .tempo--escuro .cat:hover{color:rgba(255,255,255,.75);}
.lp-root .tempo--escuro .cat.is-on{color:#fff!important;background:transparent!important;border-color:transparent!important;}
.lp-root .tempo--escuro .cat.is-on .dot{background:#4d8dff!important;box-shadow:0 0 12px 2px rgba(77,141,255,.8)!important;}
.lp-root .tempo--escuro .pills{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);padding:3px;gap:0;}
.lp-root .tempo--escuro .pill{min-height:40px;padding:0 var(--space-24);font-size:var(--fs-sm);letter-spacing:0;color:rgba(255,255,255,.7);}
.lp-root .tempo--escuro .pill:hover:not(.is-on){color:#fff;}
.lp-root .tempo--escuro .pill.is-on{background:#fff!important;color:#07090f!important;}
.lp-root .tempo--escuro .tempo-media{border-radius:var(--radius-lg);background:#111;}
.lp-root .tempo--escuro .tempo-copy h3{color:#fff;}
.lp-root .tempo--escuro .tempo-copy p{color:rgba(255,255,255,.66);font-size:var(--fs-h4);font-weight:400;line-height:1.5;}

/* ── 3 · cartao — a foto ocupa o bloco inteiro; áreas, chave e texto flutuam por cima em vidro */
.lp-root .tempo--cartao{position:relative;overflow:hidden;padding:var(--space-48);color:#fff;background:#111;}
.lp-root .tempo--cartao .tempo-media{position:absolute;inset:0;z-index:0;aspect-ratio:auto;border-radius:0;}
.lp-root .tempo--cartao .tempo-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.6) 0%,rgba(0,0,0,.05) 38%,rgba(0,0,0,.05) 55%,rgba(0,0,0,.72) 100%);}
.lp-root .tempo--cartao .tempo-head,.lp-root .tempo--cartao .cats,.lp-root .tempo--cartao .pills,.lp-root .tempo--cartao .tempo-copy{position:relative;z-index:1;}
.lp-root .tempo--cartao .tempo-media{pointer-events:none;}
.lp-root .tempo--cartao .lp-sec-tit{color:#fff;}
.lp-root .tempo--cartao .lp-eyebrow{color:#cfe0ff;}
.lp-root .tempo--cartao .tempo-grid{display:flex;flex-direction:column;gap:var(--space-24);min-height:520px;min-width:0;}
.lp-root .tempo--cartao .tempo-grid > *{min-width:0;max-width:100%;}
.lp-root .tempo--cartao .cats{flex-direction:row;flex-wrap:wrap;gap:var(--space-8);}
.lp-root .tempo--cartao .cat{
  width:auto;min-height:40px;padding:0 var(--space-16);gap:0;border-radius:var(--radius-full);
  font-size:var(--fs-sm);font-weight:600;letter-spacing:0;color:#fff;
  background:rgba(255,255,255,.14)!important;border:1px solid rgba(255,255,255,.22);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
}
.lp-root .tempo--cartao .cat .dot{display:none;}
.lp-root .tempo--cartao .cat.is-on{background:#fff!important;color:#111!important;border-color:#fff!important;}
.lp-root .tempo--cartao .tempo-panel{margin-top:auto;display:flex;flex-direction:column;align-items:flex-start;}
.lp-root .tempo--cartao .pills{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);padding:3px;gap:0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);}
.lp-root .tempo--cartao .pill{min-height:40px;padding:0 var(--space-24);font-size:var(--fs-sm);letter-spacing:0;color:#fff;}
.lp-root .tempo--cartao .pill.is-on{background:#fff!important;color:#111!important;}
.lp-root .tempo--cartao .tempo-copy{max-width:560px;margin-top:var(--space-16);}
.lp-root .tempo--cartao .tempo-copy h3{font-size:var(--fs-h2);color:#fff;}
.lp-root .tempo--cartao .tempo-copy p{color:rgba(255,255,255,.82);font-size:var(--fs-h4);font-weight:400;line-height:1.5;}

/* ── 4 · lista — áreas numeradas 01–07 com fios, estilo ficha técnica; foto e texto à direita */
.lp-root .tempo--lista{background:#fff;border:1px solid #e5e5ea;padding:var(--space-64) var(--space-56);}
.lp-root .tempo--lista .tempo-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:var(--space-56);}
.lp-root .tempo--lista .cats{counter-reset:area;border-bottom:1px solid #e5e5ea;}
.lp-root .tempo--lista .cat{
  counter-increment:area;min-height:64px;padding:0;gap:var(--space-20);border-radius:0;border-top:1px solid #e5e5ea;
  font-size:var(--fs-h4);font-weight:600;letter-spacing:var(--ls-apoio);color:#86868b;
}
.lp-root .tempo--lista .cat::before{content:counter(area,decimal-leading-zero);font-size:var(--fs-xs);font-weight:600;letter-spacing:.08em;color:#b0b0b8;min-width:24px;}
.lp-root .tempo--lista .cat .dot{display:none;}
.lp-root .tempo--lista .cat::after{content:"";margin-left:auto;width:8px;height:8px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg);opacity:0;transition:opacity .2s ease;}
.lp-root .tempo--lista .cat:hover{color:#1d1d1f;}
.lp-root .tempo--lista .cat.is-on{color:#1d1d1f!important;background:transparent!important;}
.lp-root .tempo--lista .cat.is-on::before{color:var(--blue);}
.lp-root .tempo--lista .cat.is-on::after{opacity:1;}
.lp-root .tempo--lista .tempo-panel{display:flex;flex-direction:column;}
.lp-root .tempo--lista .tempo-media{order:1;aspect-ratio:4/3;border-radius:var(--radius-lg);}
.lp-root .tempo--lista .pills{order:2;align-self:flex-start;margin:var(--space-24) 0 0;background:#f5f5f7;border:0;padding:3px;gap:0;}
.lp-root .tempo--lista .pill{min-height:40px;padding:0 var(--space-24);font-size:var(--fs-sm);letter-spacing:0;color:#1d1d1f;opacity:.6;}
.lp-root .tempo--lista .pill.is-on{background:#1d1d1f!important;color:#fff!important;opacity:1;}
.lp-root .tempo--lista .tempo-copy{order:3;margin-top:var(--space-20);}
.lp-root .tempo--lista .tempo-copy h3{color:#1d1d1f;}
.lp-root .tempo--lista .tempo-copy p{color:#6e6e73;}

/* ── 5 · minimal — a chave Passado | Futuro é a estrela: grande, no centro, acima de tudo */
.lp-root .tempo--minimal{background:#f5f5f7;padding:var(--space-64) var(--space-56);text-align:center;}
.lp-root .tempo--minimal .tempo-head,.lp-root .tempo--abas .tempo-head{display:flex;flex-direction:column;align-items:center;}
.lp-root .tempo--minimal .tempo-grid{display:flex;flex-direction:column;align-items:center;gap:var(--space-24);}
.lp-root .tempo--minimal .tempo-panel{display:contents;}
.lp-root .tempo--minimal .pills{order:1;margin:0;background:#e3e3e8;border:0;padding:4px;gap:0;width:min(520px,100%);}
.lp-root .tempo--minimal .pill{flex:1 1 0;min-height:64px;padding:0;font-size:var(--fs-h3);letter-spacing:var(--ls-apoio);color:#1d1d1f;opacity:.5;}
.lp-root .tempo--minimal .pill.is-on{background:#fff!important;color:#1d1d1f!important;opacity:1;box-shadow:0 2px 10px rgba(0,0,0,.12);}
.lp-root .tempo--minimal .cats{order:2;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:var(--space-4) var(--space-8);}
.lp-root .tempo--minimal .cat{width:auto;min-height:36px;padding:0 var(--space-12);gap:var(--space-8);border-radius:var(--radius-full);font-size:var(--fs-sm);font-weight:600;letter-spacing:0;color:#6e6e73;}
.lp-root .tempo--minimal .cat .dot{width:6px;height:6px;}
.lp-root .tempo--minimal .cat:hover{color:#1d1d1f;}
.lp-root .tempo--minimal .cat.is-on{color:#1d1d1f!important;background:transparent!important;border-color:transparent!important;}
.lp-root .tempo--minimal .cat.is-on .dot{background:#1d1d1f!important;box-shadow:none!important;}
.lp-root .tempo--minimal .tempo-media{order:3;width:100%;aspect-ratio:16/9;border-radius:var(--radius-lg);}
.lp-root .tempo--minimal .tempo-copy{order:4;margin:var(--space-8) auto 0;max-width:640px;}
.lp-root .tempo--minimal .tempo-copy h3{font-size:var(--fs-h2);color:#1d1d1f;}
.lp-root .tempo--minimal .tempo-copy p{color:#6e6e73;font-size:var(--fs-h4);font-weight:400;line-height:1.5;}

/* ── celular e tablet das 5 opções */
@media (max-width:1024px){
  .lp-root .tempo--escuro .tempo-grid,.lp-root .tempo--lista .tempo-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-32);}
  /* abas e escuro: áreas numa linha que rola */
  .lp-root .tempo--abas .cats{justify-content:flex-start;flex-wrap:nowrap;gap:0 var(--space-24);}
  .lp-root .tempo--abas .cat{flex:0 0 auto;min-height:44px;background:transparent;border:0;font-size:var(--fs-sm);white-space:nowrap;}
  .lp-root .tempo--escuro .cat{min-height:40px;padding:0 var(--space-16);border-radius:var(--radius-full);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);font-size:var(--fs-sm);letter-spacing:0;color:rgba(255,255,255,.8);}
  .lp-root .tempo--escuro .cat .dot{display:none;}
  .lp-root .tempo--escuro .cat.is-on{background:#fff!important;color:#07090f!important;border-color:#fff!important;}
  .lp-root .tempo--cartao .cats{flex-wrap:nowrap;}
  .lp-root .tempo--cartao .cat{flex:0 0 auto;white-space:nowrap;}
  /* lista continua lista no celular */
  .lp-root .tempo--lista .cats{flex-direction:column;overflow:visible;gap:0;padding-bottom:0;}
  .lp-root .tempo--lista .cat{width:100%;min-height:52px;padding:0;border-radius:0;border:0;border-top:1px solid #e5e5ea;background:transparent;font-size:var(--fs-base);white-space:normal;}
  .lp-root .tempo--lista .cat.is-on{background:transparent!important;color:#1d1d1f!important;}
  .lp-root .tempo--minimal .cats{flex-wrap:nowrap;justify-content:flex-start;max-width:100%;}
  .lp-root .tempo--minimal .cat{flex:0 0 auto;background:transparent;border:0;white-space:nowrap;}
}
@media (max-width:768px){
  .lp-root .tempo--abas,.lp-root .tempo--escuro,.lp-root .tempo--lista,.lp-root .tempo--minimal{padding:var(--space-40) var(--space-20);}
  .lp-root .tempo--cartao{padding:var(--space-32) var(--space-20);}
  .lp-root .tempo--cartao .tempo-grid{min-height:560px;}
  .lp-root .tempo--abas .tempo-media,.lp-root .tempo--minimal .tempo-media{aspect-ratio:4/3;}
  .lp-root .tempo--abas .pills,.lp-root .tempo--escuro .pills,.lp-root .tempo--lista .pills,.lp-root .tempo--cartao .pills{width:auto;display:inline-flex;}
  .lp-root .tempo--abas .pill,.lp-root .tempo--escuro .pill,.lp-root .tempo--lista .pill,.lp-root .tempo--cartao .pill{flex:0 0 auto;padding:0 var(--space-20);}
  .lp-root .tempo--minimal .pill{min-height:52px;font-size:var(--fs-h4);}
  .lp-root .tempo--abas .tempo-copy p,.lp-root .tempo--escuro .tempo-copy p,.lp-root .tempo--cartao .tempo-copy p,.lp-root .tempo--minimal .tempo-copy p{font-size:var(--fs-base);}
}

/* ── arrastar para o lado (23/09/2026): dica + foto e chave arrastáveis. Só com "dica" no JSON. */
.lp-root .tempo-dica{
  display:inline-flex;align-items:center;gap:var(--space-8);
  font-size:var(--fs-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#6e6e73;
}
.lp-root .tempo-dica svg{color:var(--blue);flex:0 0 auto;}
.lp-root .tempo--arrasta .pills{cursor:grab;touch-action:pan-y;}
.lp-root .tempo--arrasta .tempo-media{cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none;}
.lp-root .tempo--arrasta.is-arrastando .tempo-media,.lp-root .tempo--arrasta.is-arrastando .pills{cursor:grabbing;}
.lp-root .tempo--arrasta .tempo-media img{-webkit-user-drag:none;transition:opacity .35s ease,transform .45s cubic-bezier(.2,.7,.2,1);}
.lp-root .tempo--arrasta.is-arrastando .tempo-media img{transition:opacity .35s ease;}
.lp-root .tempo--minimal .tempo-dica{order:2;margin-top:calc(var(--space-8) * -1);}
.lp-root .tempo--minimal .cats{order:3;}
.lp-root .tempo--minimal .tempo-media{order:4;}
.lp-root .tempo--minimal .tempo-copy{order:5;}

/* 24/09/2026: o aviso "arraste para o lado" só aparece no celular/tablet */
@media (min-width:1025px){ .lp-root .tempo-dica{display:none;} }
/* troca de foto em fade cruzado (a foto antiga some por cima da nova) */
.lp-root .tempo-media .tempo-fantasma{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;pointer-events:none;transition:opacity .6s ease;}
.lp-root .fade-swap{animation-duration:.6s;}

/* ── cabe numa dobra (Home, 08/10/2026 — doc "AJUSTE gloda.store 06/10", item 6).
   Prop "cabe" no JSON. A seção inteira (título, chave Passado|Futuro, áreas, foto, título e texto)
   ocupa 95% da altura da tela, já descontado o submenu fixo. A foto é quem cede: encolhe mantendo
   a proporção 4:3. 08/10/2026 (Daniel): SÓ no celular/tablet — no desktop voltou a versão anterior. */
@media (max-width:1024px){
  .lp-root .tempo--cabe{
    height:calc(95svh - var(--sub-h,56px));min-height:560px;
    display:flex;flex-direction:column;
    padding:var(--space-32) var(--space-40);
  }
  .lp-root .tempo--cabe .tempo-head{flex:0 0 auto;margin-bottom:var(--space-20);}
  .lp-root .tempo--cabe .tempo-head .lp-eyebrow{margin-bottom:var(--space-8);}
  .lp-root .tempo--cabe .lp-sec-tit{font-size:clamp(28px,3.4vw,var(--fs-display));}
  .lp-root .tempo--cabe .tempo-grid{flex:1 1 auto;min-height:0;gap:var(--space-16);}
  .lp-root .tempo--cabe .pills,.lp-root .tempo--cabe .cats,.lp-root .tempo--cabe .tempo-dica,.lp-root .tempo--cabe .tempo-copy{flex:0 0 auto;}
  .lp-root .tempo--cabe .pill{min-height:52px;font-size:var(--fs-h4);}
  .lp-root .tempo--cabe .tempo-media{
    flex:1 1 0;min-height:140px;width:100%;aspect-ratio:auto;margin:0;
    background:transparent;border-radius:0;overflow:visible;container-type:size;--ar:1.7778;
  }
  /* a foto (e o "fantasma" do fade) ocupa o maior retângulo --ar que cabe no espaço, centralizado */
  .lp-root .tempo--cabe .tempo-media img{
    inset:0!important;margin:auto;
    width:min(100cqw, calc(100cqh * var(--ar)))!important;height:min(100cqh, calc(100cqw / var(--ar)))!important;
    border-radius:var(--radius-lg);background:#e3e3e8;
  }
  .lp-root .tempo--cabe .tempo-copy{margin:0 auto;max-width:760px;}
  .lp-root .tempo--cabe .tempo-copy h3{font-size:var(--fs-h3);}
  .lp-root .tempo--cabe .tempo-copy p{font-size:var(--fs-base);margin-top:var(--space-4);}
}
@media (max-width:768px){
  .lp-root .tempo--cabe{padding:var(--space-24) var(--space-16);}
  .lp-root .tempo--cabe .tempo-head{margin-bottom:var(--space-12);}
  .lp-root .tempo--cabe .lp-sec-tit{font-size:clamp(24px,7vw,32px);}
  .lp-root .tempo--cabe .tempo-grid{gap:var(--space-12);}
  .lp-root .tempo--cabe .pill{min-height:44px;}
  .lp-root .tempo--cabe .tempo-grid{justify-content:center;}
  .lp-root .tempo--cabe .tempo-media{--ar:1.3333;min-height:160px;max-height:calc((100vw - 64px) * .75);}
  .lp-root .tempo--cabe .tempo-copy h3{font-size:var(--fs-h4);}
  .lp-root .tempo--cabe .tempo-copy p{font-size:var(--fs-sm);line-height:1.5;}
}

/* ============================================================
   variante "comparador" (19/10/2026, doc "Ajustes gloda.tech 18/10", item 03) — base Reveal2 (21st.dev)
   Fundo branco, sem contêiner; menu em linha entre dois fios; informações 40% · comparador 60%.
   Vermelho = Passado, azul = Futuro. Troca de conteúdo com fade + 8px, 320 ms.
   ============================================================ */
.lp-root .cmp{--cmp-cor:#e5372b;--cmp-cor-bg:#fdeceb;background:#fff;text-align:left;}
.lp-root .cmp[data-estado="futuro"]{--cmp-cor:var(--blue);--cmp-cor-bg:#e8f0ff;}
.lp-root .cmp-head{display:flex;flex-direction:column;align-items:center;text-align:center;}
.lp-root .cmp-head .lp-eyebrow{margin-bottom:var(--space-16);}
.lp-root .cmp-tit{font-size:var(--fs-display);font-weight:600;line-height:1.1;letter-spacing:var(--ls-apoio);color:#1d1d1f;max-width:22ch;}
.lp-root .cmp-menu{margin-top:var(--space-40);border-top:1px solid #e5e5ea;border-bottom:1px solid #e5e5ea;
  overflow-x:auto;scrollbar-width:none;touch-action:pan-x pan-y;overscroll-behavior-x:contain;}
.lp-root .cmp-menu::-webkit-scrollbar{display:none;}
.lp-root .cmp-menu-in{display:flex;justify-content:space-between;gap:var(--space-24);min-width:max-content;padding:0 var(--space-8);}
.lp-root .cmp-cat{display:inline-flex;align-items:center;gap:var(--space-8);min-height:56px;padding:0 var(--space-4);
  font-size:var(--fs-sm);font-weight:500;color:#86868b;white-space:nowrap;transition:color .25s ease;}
.lp-root .cmp-cat i{width:6px;height:6px;border-radius:50%;background:#1d1d1f;opacity:0;transform:scale(.4);transition:opacity .25s ease,transform .25s ease;}
.lp-root .cmp-cat:hover{color:#1d1d1f;}
.lp-root .cmp-cat.is-on{color:#1d1d1f;font-weight:600;}
.lp-root .cmp-cat.is-on i{opacity:1;transform:none;}
.lp-root .cmp-grid{margin-top:var(--space-48);display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:var(--space-48);align-items:center;}
.lp-root .cmp-info-in{transition:opacity .16s ease,transform .16s ease;}
.lp-root .cmp-info-in.is-sai{opacity:0;transform:translate3d(0,8px,0);}
.lp-root .cmp-label{display:inline-flex;align-items:center;min-height:28px;padding:0 var(--space-12);border-radius:var(--radius-full);
  background:var(--cmp-cor-bg);color:var(--cmp-cor);font-size:var(--fs-xs);font-weight:600;letter-spacing:.02em;
  transition:background-color .35s ease,color .35s ease;}
.lp-root .cmp-h{margin-top:var(--space-16);font-size:var(--fs-h2);font-weight:600;line-height:1.15;letter-spacing:var(--ls-apoio);color:#1d1d1f;}
.lp-root .cmp-p{margin-top:var(--space-12);font-size:var(--fs-base);line-height:1.55;color:#6e6e73;}
.lp-root .cmp-cards{margin-top:var(--space-24);display:grid;gap:var(--space-12);}
.lp-root .cmp-card{display:flex;align-items:flex-start;gap:var(--space-16);padding:var(--space-16) var(--space-20);border-radius:var(--radius);background:#f5f5f7;}
.lp-root .cmp-ic{flex:0 0 auto;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#fff;color:var(--cmp-cor);transition:color .35s ease;}
.lp-root .cmp-ic svg{width:20px;height:20px;}
.lp-root .cmp-card strong{display:block;font-size:var(--fs-sm);font-weight:600;line-height:1.3;color:#1d1d1f;}
.lp-root .cmp-card span{display:block;margin-top:2px;font-size:var(--fs-xs);font-weight:400;line-height:1.45;color:#6e6e73;}
/* comparador */
/* brilho atrás do card (23/10/2026, Ajustes 22/10 item 07): camada própria atrás do slider, fora do
   overflow:hidden, concentrada nas laterais e embaixo (topo recolhido). Intensidade = --cmp-r / --cmp-b,
   que o JS calcula da posição do divisor. Sem transição: acompanha o arrasto em tempo real. */
.lp-root .cmp-vis{position:relative;isolation:isolate;}
.lp-root .cmp-vis .cmp-slider{z-index:1;}
.lp-root .cmp-brilho{position:absolute;inset:14% -1.5% -3.5% -1.5%;z-index:0;pointer-events:none;border-radius:var(--radius-lg);}
.lp-root .cmp-brilho::before,.lp-root .cmp-brilho::after{content:"";position:absolute;inset:0;border-radius:inherit;filter:blur(34px);will-change:opacity;}
.lp-root .cmp-brilho::before{background:#FF4A3D;opacity:calc(var(--cmp-r,0) * .85);}
.lp-root .cmp-brilho::after{background:#2F6BFF;opacity:calc(var(--cmp-b,0) * .85);}
.lp-root .cmp-slider{--cmp-x:50%;position:relative;aspect-ratio:3/2;border-radius:var(--radius-lg);overflow:hidden;background:#f5f5f7;
  cursor:ew-resize;touch-action:pan-y;user-select:none;-webkit-user-select:none;outline:none;}
.lp-root .cmp-slider:focus-visible{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--blue);}
.lp-root .cmp-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;transition:opacity .3s ease;}
.lp-root .cmp-img.is-troca{opacity:0;}
.lp-root .cmp-antes{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--cmp-x)) 0 0);}
.lp-root .cmp-tag{position:absolute;top:var(--space-16);z-index:3;min-height:28px;display:inline-flex;align-items:center;padding:0 var(--space-12);
  border-radius:var(--radius-full);font-size:var(--fs-xs);font-weight:600;color:#fff;pointer-events:none;}
.lp-root .cmp-tag--passado{left:var(--space-16);background:#e5372b;}
.lp-root .cmp-tag--futuro{right:var(--space-16);background:var(--blue);}
.lp-root .cmp-div{position:absolute;top:0;bottom:0;left:var(--cmp-x);z-index:2;width:3px;margin-left:-1.5px;background:#fff;box-shadow:0 0 12px rgba(0,0,0,.25);pointer-events:none;}
.lp-root .cmp-alca{position:absolute;left:50%;top:50%;width:48px;height:48px;margin:-24px 0 0 -24px;border-radius:50%;background:#fff;color:#1d1d1f;
  display:grid;place-items:center;box-shadow:0 6px 20px rgba(0,0,0,.22);transition:transform .2s ease;}
.lp-root .cmp-alca svg{width:22px;height:22px;}
.lp-root .cmp-slider.is-arrasta .cmp-alca{transform:scale(1.1);}
@media (max-width:1024px){
  .lp-root .cmp-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:var(--space-32);}
  .lp-root .cmp-menu-in{justify-content:flex-start;gap:var(--space-24);}
}
@media (max-width:860px){
  .lp-root .cmp-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-24);}
  .lp-root .cmp-vis{order:1;}
  .lp-root .cmp-info{order:2;}
}
@media (max-width:768px){
  .lp-root .cmp-menu{margin-top:var(--space-32);margin-left:calc(var(--gutter) * -1);margin-right:calc(var(--gutter) * -1);}
  .lp-root .cmp-menu-in{padding:0 var(--gutter);gap:var(--space-20);}
  .lp-root .cmp-cat{min-height:52px;}
  .lp-root .cmp-grid{margin-top:var(--space-24);}
  .lp-root .cmp-slider{aspect-ratio:4/3;}
  .lp-root .cmp-alca{width:52px;height:52px;margin:-26px 0 0 -26px;}
  .lp-root .cmp-tag{top:var(--space-12);}
  .lp-root .cmp-tag--passado{left:var(--space-12);} .lp-root .cmp-tag--futuro{right:var(--space-12);}
}
@media (prefers-reduced-motion:reduce){ .lp-root .cmp-info-in,.lp-root .cmp-img{transition:none;} }