/* T-052: rolagem dentro das molduras existentes; sem aumentar o cartão do topo. */
.pro-hero-stage {padding:8px;gap:14px}
.pro-hero-stage .pro-google-window,.pro-hero-stage .pro-panel-window,.pro-hero-stage .pro-phone-frame {margin-top:0;min-width:0}
.pro-hero-stage .pro-phone-frame {width:100%;max-width:360px;height:432px;display:flex;flex-direction:column;justify-self:start}
.pro-phone-frame>.window-bar {flex:0 0 34px;min-width:0;gap:6px}
.pro-phone-frame>.window-bar>span:nth-child(2) {min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pro-phone-frame .badge-destaque {flex-shrink:0}
.pro-phone-frame .pro-mini-l1 {position:relative;flex:1;min-height:0}
.pro-mini-l1-viewport {position:relative;flex:1;min-height:0;overflow:hidden;contain:layout paint}
.pro-mini-l1-scroll,.pm-page-track {position:relative;display:flex;flex-direction:column;gap:9px;width:100%;min-width:0;transform:translateY(0);font-size:10px;line-height:1.35}
.pro-mini-l1-scroll>* {flex-shrink:0;min-width:0}
.pro-phone-cta {flex-shrink:0}
.mini-scroll-pause {position:absolute;right:18px;bottom:62px;z-index:1;display:grid;place-items:center;width:26px;height:26px;padding:0;border:1px solid #d1d7ec;border-radius:50%;background:#fff;color:#4558d8;font-size:12px;cursor:pointer}
.mini-scroll-pause:focus-visible,[data-mini-scroll]:focus-visible {outline:2px solid #4558d8;outline-offset:3px}
.is-mini-scrolling {will-change:transform}
.pro-mini-l1-block {padding:9px 10px;background:#fff;border:1px solid #d4daf7;border-radius:10px}
.pro-mini-l1-chips-row,.pro-mini-l1-slots-row,.pm-mini-chips,.pm-mini-slots {display:flex;flex-wrap:wrap;gap:4px;margin:5px 0}
.pro-mini-l1-chip,.pro-mini-l1-slot,.pm-mini-chips>span,.pm-mini-slots>span {padding:3px 5px;border:1px solid #d1d7ec;border-radius:5px;background:#f5f6fb;font-size:9px;line-height:1.3}
.pro-mini-l1-chip.is-selected,.pro-mini-l1-slot.is-selected,.pm-mini-chips>.is-on,.pm-mini-slots>.is-on {background:#4558d8;border-color:#4558d8;color:#fff}
.pro-mini-l1-wa-bar {margin-top:7px;padding:5px;text-align:center;border-radius:5px;background:#176c45;color:#fff;font-size:10px}
.pro-mini-l1-addr {margin:5px 0;font-size:10px;line-height:1.35}
.pro-mini-l1-foot,.pm-scroll-foot {display:flex;justify-content:space-between;gap:8px;padding:7px 2px;font-size:8px;color:#52587a}
/* A moldura recorta; os blocos internos nunca encolhem para caber nela. */
.pro-mini-canvas {display:block;position:relative;min-width:0;isolation:isolate}
.pm-page-track {gap:8px;font-size:9.5px}
.pm-page-track>* {flex-shrink:0;min-width:0}
.pm-stage {height:178px;min-height:178px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between;gap:6px;overflow:hidden}
.pm-stage:is(.pro-mini-canvas--l2,.pro-mini-canvas--l4,.pro-mini-canvas--l5,.pro-mini-canvas--c4,.pro-mini-canvas--c5) {display:grid}
.pm-scroll-sec {display:flex;flex-direction:column;gap:5px;padding:8px;background:#fff;border:1px solid #d4daf7;border-radius:8px;font-size:9.5px;line-height:1.35}
.pm-sec-head {display:block;font-family:Gloock,Georgia,serif;font-size:11px;font-weight:400;line-height:1.2;margin:0 0 3px}
.pro-mini-canvas :where(h1,h2,h3,h4,p) {font-size:inherit;line-height:inherit;margin:0}
.pro-models-group,.pro-models-track {min-width:0;max-width:100%}
.pro-models-tabs {max-width:100%;border-radius:18px}
.pro-models-tab {max-width:100%;overflow-wrap:anywhere}
@media(min-width:1280px) {
  /* Janelas em células diferentes: a busca nunca cobre o selo Destaque. */
  .pro-hero-stage {grid-template-columns:minmax(0,360px) minmax(0,1fr);align-items:start;column-gap:16px}
  .pro-hero-stage .pro-google-window {grid-column:1/-1;grid-row:1;justify-self:end}
  .pro-hero-stage .pro-phone-frame {grid-column:1;grid-row:2}
  .pro-hero-stage .pro-panel-window {grid-column:2;grid-row:2;align-self:center;max-width:100%;transform:none}
  .pro-panel-window .window-bar {gap:5px;overflow:hidden}
  .pro-panel-window .window-bar>span:nth-child(2) {min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media(max-width:1279px) {
  .pro-hero-stage .pro-google-window {max-width:300px;justify-self:end}
  .pro-hero-stage .pro-phone-frame {justify-self:start}
}
@media(max-width:760px) {
  .pro-hero-stage {padding:4px}
  .pro-hero-stage .pro-phone-frame {justify-self:center}
  .pro-models-track {grid-auto-columns:min(300px,calc(100vw - 72px))}
  .pro-mini-canvas {height:196px}
}
@media(prefers-reduced-motion:reduce) {
  .pro-mini-l1-scroll,.pm-page-track {transform:translateY(0)!important;animation:none!important;transition:none!important}
  .mini-scroll-pause {display:none}
}

.mini-scroll-pause[hidden] {display:none}