/* ==========================================================
   V99 · Refinements — 26/08/2026
   Desktop changes are intentionally limited to the wizard icons
   and requested content/image substitutions. Mobile refinements
   are scoped to <=760px.
   ========================================================== */

/* ---------- Viste tu mesa · desktop: restore option icons/checks ---------- */
@media (min-width:761px){
  .viste-page .wz-opt--visual{
    grid-template-columns:58px minmax(0,1fr) 22px!important;
    text-align:left!important;
    place-items:initial!important;
  }
  .viste-page .wz-opt-media{
    display:flex!important;
    width:58px!important;
    height:58px!important;
  }
  .viste-page .wz-check{
    display:inline-flex!important;
  }
}

/* ---------- Viste tu mesa · requested layer substitutions ---------- */
.viste-page .lab-auxiliar{
  width:25%!important;
  height:25%!important;
  left:28%!important;
  top:20%!important;
  z-index:7!important;
}
.viste-page .lab-auxiliar.on{
  transform:translate(-50%,-50%) rotate(-5deg) scale(1)!important;
}
.viste-page .lab-auxiliar img{
  object-fit:contain!important;
  filter:drop-shadow(0 12px 19px rgba(15,26,46,.15))!important;
}
.viste-page .lab-toggle[data-layer="auxiliar"] .lab-thumb img{transform:scale(1.08)!important}
.viste-page .lab-centro{
  width:40%!important;
  height:40%!important;
  top:7%!important;
}
.viste-page .lab-centro img{object-fit:contain!important}

@media(max-width:760px){
  /* ========================================================
     HOME
     ======================================================== */
  .home-page .scene-copy,
  .home-page .scene-copy h2,
  .home-page .scene-copy p{
    text-align:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .home-page .scene-copy{padding-inline:8px!important}

  /* Keep the final historical scroll cinematic, but remove the excessive
     travel that was making the section feel broken/infinite on phones. */
  .home-page .history{
    height:190dvh!important;
    min-height:0!important;
    padding:0!important;
    overflow:clip!important;
  }
  .home-page .history-sticky{height:100dvh!important;min-height:0!important}
  .home-page .history-image{object-position:center center!important}
  .home-page .history-content{
    width:calc(100% - 36px)!important;
    max-width:430px!important;
    top:50%!important;
    text-align:center!important;
  }
  .home-page .history-content h2{
    font-size:clamp(32px,9vw,42px)!important;
    line-height:1.02!important;
    margin-bottom:18px!important;
  }
  .home-page .history-content p{
    font-size:12px!important;
    line-height:1.62!important;
    margin-bottom:24px!important;
  }
  .home-page .history-scroll-cue{display:none!important}
  .home-page .history-progress{bottom:20px!important;width:min(180px,48vw)!important}

  /* ========================================================
     NUESTRAS MESAS
     ======================================================== */
  .tables-page-body .table-filters{
    position:relative!important;
    z-index:4!important;
    scroll-behavior:smooth!important;
    scroll-snap-type:x proximity!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .tables-page-body .table-filter{
    cursor:pointer!important;
    touch-action:manipulation!important;
  }
  .tables-page-body .table-filter.active{
    box-shadow:0 8px 20px rgba(15,26,46,.12)!important;
  }

  /* ========================================================
     VISTE TU MESA
     ======================================================== */
  .viste-page .vt-hero{
    height:62dvh!important;
    min-height:430px!important;
    max-height:610px!important;
    align-items:flex-end!important;
  }
  .viste-page .vt-hero__media:after{
    background:linear-gradient(180deg,rgba(7,18,36,.38) 0%,rgba(7,18,36,.35) 36%,rgba(7,18,36,.82) 100%)!important;
  }
  .viste-page .vt-hero__media img{filter:saturate(.9) brightness(.78)!important}
  .viste-page .vt-hero__inner{
    width:calc(100% - 32px)!important;
    padding:0 0 4.2dvh!important;
    margin:0 auto!important;
  }
  .viste-page .vt-hero .eyebrow{font-size:7.5px!important;margin-bottom:8px!important}
  .viste-page .vt-hero h1{
    font-size:clamp(31px,8.7vw,40px)!important;
    line-height:.98!important;
    max-width:10.5ch!important;
    margin:8px 0 11px!important;
  }
  .viste-page .vt-hero p{
    font-size:10.5px!important;
    line-height:1.5!important;
    max-width:39ch!important;
    margin:0 0 14px!important;
  }
  .viste-page .vt-hero__ctas{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
  }
  .viste-page .vt-hero__ctas .ghost-btn{
    min-height:36px!important;
    padding:0 8px!important;
    font-size:6.8px!important;
    letter-spacing:.08em!important;
  }

  .viste-page .vt-section{padding-top:58px!important;padding-bottom:58px!important}
  .viste-page .section-head{margin-bottom:26px!important}
  .viste-page .section-head h2{margin-bottom:14px!important}
  .viste-page .guide-showcase{margin-top:16px!important}

  .viste-page .lab-auxiliar{
    width:24%!important;height:24%!important;left:27%!important;top:19%!important;
  }
  .viste-page .lab-centro{width:38%!important;height:38%!important;top:7%!important}

  /* The live preview stays visible; after choosing an answer the option grid
     disappears before moving on, preventing the form from becoming a long list. */
  .viste-page .wizard-grid--redesign{gap:16px!important}
  .viste-page .wz-builder{margin-top:2px!important}
  .viste-page .wz-step-card.is-mobile-current.is-complete .wz-options{display:none!important}
  .viste-page .wz-step-card.is-mobile-current.is-complete>p{margin-bottom:4px!important}
  .viste-page .wz-panel .wz-step-card.is-mobile-current{padding:17px 15px 18px!important}
  .viste-page .wz-preview--redesign{margin-bottom:4px!important}
  .viste-page .wz-preview--redesign .wz-stage{max-height:30dvh!important}
  .viste-page .result-cards{margin-top:20px!important}
  .viste-page .result-card--editorial{margin-bottom:18px!important}

  /* ========================================================
     ARTESANÍA
     ======================================================== */
  .artesania-page .hero{
    height:82dvh!important;
    min-height:560px!important;
    max-height:760px!important;
    overflow:hidden!important;
  }
  .artesania-page .hero-copy{
    width:100%!important;
    max-width:none!important;
    padding:0 18px 7dvh!important;
    margin:0!important;
    justify-content:flex-end!important;
    overflow:hidden!important;
  }
  .artesania-page .hero-copy .eyebrow{
    font-size:8px!important;
    line-height:1.45!important;
    max-width:100%!important;
    letter-spacing:.20em!important;
  }
  .artesania-page .hero-copy h1{
    width:100%!important;
    max-width:8.7ch!important;
    font-size:clamp(42px,12vw,56px)!important;
    line-height:1.02!important;
    letter-spacing:-.025em!important;
    margin:17px 0 18px!important;
    overflow-wrap:normal!important;
  }
  .artesania-page .hero-copy p{
    width:100%!important;
    max-width:36ch!important;
    font-size:12.5px!important;
    line-height:1.62!important;
    margin:0!important;
  }
  .artesania-page .hero-cue{display:none!important}

  /* Six phases in a much shorter, intentional scroll journey. */
  .artesania-page .process-track{
    height:280dvh!important;
    min-height:0!important;
  }
  .artesania-page .process-pin{height:100dvh!important;min-height:0!important}
  .artesania-page .process-copy{
    width:100%!important;
    padding:9dvh 16px 0!important;
    align-content:start!important;
  }
  .artesania-page .proc-side--r{max-width:100%!important;width:100%!important}
  .artesania-page .proc-title{font-size:clamp(30px,8.5vw,42px)!important;line-height:1.02!important}
  .artesania-page .phase p{font-size:12px!important;line-height:1.58!important}
  .artesania-page #plate-canvas{
    width:min(72vw,300px)!important;
    height:min(72vw,300px)!important;
  }
  .artesania-page .plate-fallback{width:min(68vw,280px)!important}
  .artesania-page .process-final{bottom:4.2dvh!important;width:calc(100% - 32px)!important}
  .artesania-page .process-final h2{font-size:clamp(27px,7.7vw,36px)!important}

  /* ========================================================
     SELLOS
     ======================================================== */
  .stamps-page-body .stamp-hero-premium{
    height:60dvh!important;
    min-height:440px!important;
    max-height:560px!important;
    display:flex!important;
    align-items:center!important;
  }
  .stamps-page-body .stamp-hero-premium .stamp-hero-copy{
    width:calc(100% - 36px)!important;
    max-width:420px!important;
    margin:0 auto!important;
    padding:var(--header-h,64px) 0 0!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    min-height:100%!important;
  }
  .stamps-page-body .stamp-hero-premium .stamp-hero-copy h1{
    width:100%!important;
    max-width:10.5ch!important;
    font-size:clamp(34px,9.8vw,44px)!important;
    line-height:1!important;
    margin:0 0 15px!important;
  }
  .stamps-page-body .stamp-hero-premium .stamp-hero-copy .stamp-intro{
    width:100%!important;
    max-width:32ch!important;
    font-size:12px!important;
    line-height:1.58!important;
  }

  /* Mobile archive becomes a direct horizontal, snap-based gallery instead
     of converting all 80 seals into thousands of pixels of vertical scroll. */
  .stamps-page-body .stamp-horizontal-story{
    height:auto!important;
    min-height:0!important;
    --seal-card-w:min(68vw,250px)!important;
  }
  .stamps-page-body .stamp-scroll-pin{
    position:relative!important;
    top:auto!important;
    height:auto!important;
    min-height:82dvh!important;
    overflow:hidden!important;
    padding:28px 0 24px!important;
  }
  .stamps-page-body .stamp-scroll-pin:before{inset:0!important}
  .stamps-page-body .stamp-scroll-pin:after{inset:0!important}
  .stamps-page-body .stamp-archive-head{
    position:relative!important;
    left:auto!important;right:auto!important;top:auto!important;
    transform:none!important;
    width:calc(100% - 32px)!important;
    margin:0 auto 8px!important;
  }
  .stamps-page-body .stamp-era-menu{
    display:flex!important;
    width:100%!important;
    overflow-x:auto!important;
    gap:7px!important;
    padding:2px 0 8px!important;
    scroll-snap-type:x proximity!important;
  }
  .stamps-page-body .stamp-era-menu button{scroll-snap-align:start!important}
  .stamps-page-body .stamp-coverflow-viewport{
    position:relative!important;
    left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
    width:100%!important;
    height:42dvh!important;
    min-height:330px!important;
    max-height:420px!important;
    margin:6px 0 0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    perspective:none!important;
    cursor:grab!important;
    touch-action:pan-x!important;
    scroll-snap-type:x mandatory!important;
    scroll-behavior:smooth!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }
  .stamps-page-body .stamp-coverflow-viewport::-webkit-scrollbar{display:none!important}
  .stamps-page-body .stamp-coverflow-track{
    position:relative!important;
    left:auto!important;right:auto!important;top:auto!important;
    width:max-content!important;
    height:100%!important;
    display:flex!important;
    align-items:center!important;
    gap:16px!important;
    padding:0 calc(50vw - (var(--seal-card-w) / 2))!important;
    transform:none!important;
    transform-style:flat!important;
  }
  .stamps-page-body .stamp-item{
    position:relative!important;
    left:auto!important;top:auto!important;
    flex:0 0 var(--seal-card-w)!important;
    width:var(--seal-card-w)!important;
    height:var(--seal-card-w)!important;
    transform:none!important;
    opacity:1!important;
    scroll-snap-align:center!important;
  }
  .stamps-page-body .stamp-item.is-active{transform:scale(1.02)!important}
  .stamps-page-body .stamp-active-caption{
    position:relative!important;
    left:auto!important;right:auto!important;top:auto!important;
    transform:none!important;
    width:calc(100% - 36px)!important;
    min-height:122px!important;
    margin:5px auto 52px!important;
    padding:0!important;
  }
  .stamps-page-body .stamp-caption-period{font-size:28px!important;text-align:center!important}
  .stamps-page-body .stamp-caption-desc{
    max-width:38ch!important;
    margin:12px auto 0!important;
    font-size:11.5px!important;
    line-height:1.55!important;
    text-align:center!important;
    -webkit-line-clamp:4!important;
  }
  .stamps-page-body .stamp-timeline-wrap{
    position:absolute!important;
    left:16px!important;right:16px!important;bottom:14px!important;
    transform:none!important;
    width:auto!important;
  }
  .stamps-page-body .stamp-scroll-cue{display:none!important}

  /* ========================================================
     HERITAGE 1841
     ======================================================== */
  .heritage-page-body .hero-history{
    height:78dvh!important;
    min-height:560px!important;
  }
  .heritage-page-body .hero-copy{
    inset:auto 16px 8dvh 16px!important;
    width:auto!important;
    padding:0!important;
    text-align:center!important;
    display:block!important;
  }
  .heritage-page-body .hero-copy>div{width:100%!important}
  .heritage-page-body .hero-copy .eyebrow{text-align:center!important}
  .heritage-page-body .hero-copy h1{
    font-size:clamp(50px,15vw,66px)!important;
    line-height:.88!important;
    text-align:center!important;
    margin:14px auto 18px!important;
  }
  .heritage-page-body .hero-copy p:not(.eyebrow){
    max-width:34ch!important;
    margin:0 auto!important;
    font-size:12px!important;
    line-height:1.6!important;
    text-align:center!important;
  }
  .heritage-page-body .scroll-hint{display:none!important}

  .heritage-page-body .era,
  .heritage-page-body .era.era-long{
    height:auto!important;
    min-height:0!important;
    padding:64px 16px 72px!important;
    overflow:hidden!important;
  }
  .heritage-page-body .era-stage{
    position:relative!important;
    top:auto!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    display:block!important;
  }
  .heritage-page-body .era-year{
    position:relative!important;
    left:auto!important;top:auto!important;
    width:100%!important;
    transform:none!important;
    opacity:.11!important;
    filter:none!important;
    font-size:clamp(54px,16vw,82px)!important;
    line-height:.9!important;
    letter-spacing:-.035em!important;
    text-align:center!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    margin:0 auto 26px!important;
  }
  .heritage-page-body .visual-block{
    position:relative!important;
    left:auto!important;top:auto!important;
    transform:none!important;
    opacity:1!important;
    filter:none!important;
    width:100%!important;
    max-width:520px!important;
    margin:0 auto!important;
  }
  .heritage-page-body .era-meta{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:16px!important;
    margin:0 auto 26px!important;
    text-align:center!important;
  }
  .heritage-page-body .era-meta>div{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:10px!important;
  }
  .heritage-page-body .era-meta .kicker{font-size:8px!important;text-align:center!important}
  .heritage-page-body .era-meta>div>p:last-child{
    font-size:9px!important;
    line-height:1.35!important;
    letter-spacing:.08em!important;
    text-align:center!important;
    max-width:28ch!important;
  }
  .heritage-page-body .era-meta h2{
    width:100%!important;
    max-width:14ch!important;
    margin:0 auto!important;
    font-size:clamp(31px,9.4vw,43px)!important;
    line-height:1.02!important;
    text-align:center!important;
  }
  .heritage-page-body .mobile-era-media{
    width:100%!important;
    display:block!important;
    transform:none!important;
  }
  .heritage-page-body .mobile-era-carousel{width:100%!important;margin:0 auto!important}
  .heritage-page-body .mobile-era-carousel .cframe{
    width:100%!important;
    height:min(62dvh,490px)!important;
    min-height:320px!important;
    background:transparent!important;
  }
  .heritage-page-body .mobile-era-carousel .cslide{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    opacity:0!important;
    pointer-events:none!important;
  }
  .heritage-page-body .mobile-era-carousel .cslide.active{opacity:1!important;pointer-events:auto!important}
  .heritage-page-body .mobile-era-carousel .cslide img{
    width:100%!important;
    height:100%!important;
    max-height:none!important;
    object-fit:contain!important;
    object-position:center!important;
  }
  .heritage-page-body .mobile-era-carousel .carousel-bar{
    margin:10px auto 0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:22px!important;
  }
  .heritage-page-body .mobile-era-carousel .ccount{font-size:8px!important}
  .heritage-page-body .mobile-era-carousel .carrows{display:flex!important;gap:8px!important}
  .heritage-page-body .mobile-era-carousel .cbtn{
    width:40px!important;height:40px!important;border:1px solid currentColor!important;border-radius:999px!important;
  }
  .heritage-page-body .mobile-era-note{
    margin:26px auto 0!important;
    max-width:40ch!important;
    text-align:center!important;
    font-size:12px!important;
    line-height:1.65!important;
  }
  .heritage-page-body .mobile-era-note .note-cap{
    margin-bottom:11px!important;
    font-size:8px!important;
    letter-spacing:.16em!important;
    text-transform:uppercase!important;
    opacity:.65!important;
  }
  .heritage-page-body .mobile-era-note p{margin:0 0 10px!important}
  .heritage-page-body .heritage-finale{padding:64px 16px!important;min-height:70dvh!important}
  .heritage-page-body .finale-panel{text-align:center!important;margin:0 auto!important}
}

@media(max-width:420px){
  .stamps-page-body .stamp-hero-premium{height:58dvh!important;min-height:420px!important}
  .stamps-page-body .stamp-hero-premium .stamp-hero-copy h1{font-size:clamp(32px,9.5vw,39px)!important}
  .artesania-page .hero-copy h1{font-size:clamp(39px,11.2vw,48px)!important}
}

/* V99.2 · final mobile polish */
@media(max-width:760px){
  /* More breathing room between the live preview and the active advisor card. */
  .viste-page .wizard-grid--redesign{gap:22px!important}
  .viste-page .wz-preview--redesign{margin-bottom:0!important}
  .viste-page .wz-builder{margin-top:0!important;padding:16px!important}
  .viste-page .wz-panel .wz-step-card.is-mobile-current{padding:19px 16px 20px!important}
  .viste-page .wz-step-card h3{margin-top:6px!important;margin-bottom:7px!important}
  .viste-page .wz-mobile-nav{margin-top:15px!important;padding-top:13px!important}

  /* Artesanía: prevent the hero copy from ever leaking beyond the phone viewport. */
  .artesania-page .hero{height:78dvh!important;min-height:520px!important;max-height:700px!important}
  .artesania-page .hero-copy{
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
    padding:0 20px 5.5dvh!important;
  }
  .artesania-page .hero-copy h1{
    max-width:100%!important;
    padding-right:3vw!important;
    text-wrap:balance!important;
  }
  .artesania-page .hero-copy p{
    max-width:100%!important;
    padding-right:5px!important;
    overflow-wrap:break-word!important;
  }

  /* Sellos: keep the archive as one finite viewport-size experience. */
  .stamps-page-body .stamp-scroll-pin{min-height:0!important;height:auto!important}
  .stamps-page-body .stamp-active-caption{margin-bottom:56px!important}
}