/* Chemical EXS v2.9.284 · refinamiento móvil público Android/iOS. */

@media (max-width:760px){
  .public-page{overflow-x:hidden!important}
  .public-page main,.public-page main>section,.public-page .shell{min-width:0!important;max-width:100%!important}
  .public-page main>section{overflow-wrap:break-word}

  /* Home hero: la insignia Taller real vuelve a vivir sobre la fotografía. */
  .page-home .cxr-hero-photo{
    position:relative!important;
    display:block!important;
    width:100%!important;
    min-height:0!important;
    overflow:hidden!important;
    border-radius:24px!important;
    background:#eaf1f8!important;
    box-shadow:0 18px 42px rgba(16,41,74,.12)!important;
  }
  .page-home .cxr-hero-photo>img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:4/3!important;
    object-fit:cover!important;
    border-radius:0!important;
    box-shadow:none!important;
  }
  .page-home .cxr-photo-sticker{
    position:absolute!important;
    z-index:4!important;
    top:12px!important;
    left:12px!important;
    right:auto!important;
    display:flex!important;
    width:auto!important;
    max-width:calc(100% - 80px)!important;
    margin:0!important;
    padding:8px 11px!important;
    align-items:center!important;
    gap:5px!important;
    border:1px solid rgba(255,255,255,.72)!important;
    border-radius:999px!important;
    background:rgba(248,252,255,.92)!important;
    color:#103963!important;
    box-shadow:0 8px 22px rgba(16,41,74,.14)!important;
    -webkit-backdrop-filter:blur(10px)!important;
    backdrop-filter:blur(10px)!important;
    font-size:11.5px!important;
    line-height:1.15!important;
    white-space:nowrap!important;
    animation:none!important;
  }
  .page-home .cxr-photo-sticker small{
    display:inline!important;
    margin:0!important;
    color:#5b7290!important;
    font-size:10.5px!important;
    line-height:1.15!important;
    font-weight:750!important;
  }
  .page-home .cxr-photo-spark{
    z-index:4!important;
    top:11px!important;
    right:11px!important;
    width:44px!important;
    height:44px!important;
    border-radius:14px!important;
    font-size:20px!important;
    animation:none!important;
  }
  .page-home .cxr-weather-card{
    z-index:5!important;
    left:10px!important;
    right:10px!important;
    bottom:10px!important;
    width:auto!important;
    max-width:none!important;
    border-radius:17px!important;
  }

  /* Conversión: separar idea, flujo y acciones. */
  .page-home .cxr-conversion-strip{padding:8px 0 42px!important}
  .page-home .cxr-conversion-card{
    display:block!important;
    padding:22px 18px 20px!important;
    border-radius:24px!important;
    box-shadow:0 18px 42px rgba(16,41,74,.17)!important;
  }
  .page-home .cxr-conversion-card .cxr-kicker{
    display:inline-flex!important;
    width:auto!important;
    max-width:100%!important;
    padding:8px 10px!important;
    margin:0 0 13px!important;
    border-radius:999px!important;
    font-size:10.5px!important;
    line-height:1.25!important;
    letter-spacing:0!important;
    text-transform:none!important;
    white-space:normal!important;
  }
  .page-home .cxr-conversion-card h2{
    margin:0!important;
    font-size:clamp(27px,7.5vw,34px)!important;
    line-height:1.08!important;
    letter-spacing:-.035em!important;
    text-wrap:balance!important;
  }
  .page-home .cxr-conversion-flow{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin:18px 0 0!important;
  }
  .page-home .cxr-conversion-flow>span{
    display:flex!important;
    min-height:42px!important;
    padding:9px 10px!important;
    align-items:center!important;
    border:1px solid rgba(255,255,255,.14)!important;
    border-radius:13px!important;
    background:rgba(255,255,255,.08)!important;
    color:#f4f8ff!important;
    font-size:11.5px!important;
    font-weight:800!important;
    line-height:1.25!important;
  }
  .page-home .cxr-conversion-area{
    display:block!important;
    margin-top:12px!important;
    color:#cbdced!important;
    font-size:11.5px!important;
    line-height:1.55!important;
  }
  .page-home .cxr-conversion-card .cxr-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:9px!important;
    width:100%!important;
    margin-top:19px!important;
  }
  .page-home .cxr-conversion-card .cxr-actions .btn{width:100%!important;min-height:48px!important}

  /* Encabezados de secciones: nada pegado. */
  .page-home .cxr-section-head{
    display:block!important;
    margin-bottom:24px!important;
  }
  .page-home .cxr-section-head h2{
    max-width:none!important;
    margin:9px 0 0!important;
    font-size:clamp(28px,7.7vw,36px)!important;
    line-height:1.08!important;
    text-wrap:balance!important;
  }
  .page-home .cxr-section-head>p{
    margin:12px 0 0!important;
    font-size:14px!important;
    line-height:1.6!important;
  }

  /* Nuestro espacio real: sin franja blanca debajo. */
  .page-home .cxr-place .cxr-photo-grid{grid-template-columns:1fr!important;gap:16px!important}
  .page-home .cxr-place .cxr-photo-grid figure{
    position:relative!important;
    display:block!important;
    min-height:0!important;
    margin:0!important;
    overflow:hidden!important;
    border:1px solid rgba(183,201,220,.5)!important;
    border-radius:22px!important;
    background:#dce6ef!important;
    box-shadow:0 14px 32px rgba(12,32,64,.11)!important;
  }
  .page-home .cxr-place .cxr-photo-grid figure::after{
    display:block!important;
    content:""!important;
    position:absolute!important;
    z-index:1!important;
    inset:auto 0 0!important;
    height:58%!important;
    background:linear-gradient(180deg,transparent,rgba(5,20,36,.18) 28%,rgba(5,20,36,.78) 100%)!important;
    pointer-events:none!important;
  }
  .page-home .cxr-place .cxr-photo-grid img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:4/3!important;
    object-fit:cover!important;
  }
  .page-home .cxr-place .cxr-photo-grid figcaption{
    position:absolute!important;
    z-index:2!important;
    right:12px!important;
    bottom:12px!important;
    left:12px!important;
    display:grid!important;
    gap:3px!important;
    padding:12px 13px!important;
    border:1px solid rgba(255,255,255,.18)!important;
    border-radius:15px!important;
    background:rgba(7,25,43,.73)!important;
    color:#fff!important;
    box-shadow:0 10px 26px rgba(3,15,27,.20)!important;
    -webkit-backdrop-filter:blur(8px)!important;
    backdrop-filter:blur(8px)!important;
  }
  .page-home .cxr-place .cxr-photo-grid figcaption b{color:#fff!important;font-size:16px!important;line-height:1.15!important}
  .page-home .cxr-place .cxr-photo-grid figcaption span{color:#dce9f5!important;font-size:12px!important;line-height:1.35!important}

  /* Seguimiento HP Smart Tank: movimiento visible y barato (transform/opacity). */
  .page-home .cxr-status-card{
    position:relative!important;
    isolation:isolate!important;
    overflow:hidden!important;
    border-radius:20px!important;
    transform:translateZ(0)!important;
    animation:cx284StatusBreath 4.6s ease-in-out infinite!important;
  }
  .page-home .cxr-status-card::after{
    content:""!important;
    position:absolute!important;
    z-index:3!important;
    top:-30%!important;
    bottom:-30%!important;
    left:-42%!important;
    width:24%!important;
    transform:skewX(-16deg)!important;
    background:linear-gradient(90deg,transparent,rgba(104,191,255,.18),transparent)!important;
    pointer-events:none!important;
    animation:cx284StatusScan 5s ease-in-out infinite!important;
  }
  .page-home .cxr-status-browser span{max-width:calc(100% - 50px)!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
  .page-home .cxr-status-device{padding:21px 20px 15px!important}
  .page-home .cxr-status-device strong{
    display:inline-block!important;
    font-size:23px!important;
    animation:cx284DevicePulse 3.2s ease-in-out infinite!important;
  }
  .page-home .cxr-status-card ol{padding:4px 20px 20px!important;gap:5px!important}
  .page-home .cxr-status-card ol li{font-size:9px!important;word-break:normal!important;overflow-wrap:anywhere!important}
  .page-home .cxr-status-card ol li.active{animation:cx284ActiveStep 1.6s ease-in-out infinite!important}
  .page-home .cxr-status-note{margin:0 20px 18px!important;padding:16px!important;border-radius:0 13px 13px 0!important;animation:cx284StatusNote 3.6s ease-in-out infinite!important}
  .page-home .cxr-status-evidence{grid-template-columns:1fr!important;padding:0 20px 20px!important;gap:7px!important}
  .page-home .cxr-status-evidence span{padding:9px 10px!important;font-size:10px!important}

  /* Soporte remoto: elimina cualquier contenedor blanco/residuo bajo la animación. */
  .page-remote .remote-hero-v29{padding:34px 0 42px!important;overflow:hidden!important}
  .page-remote .remote-hero-v29 .remote-hero-grid{min-height:0!important;gap:22px!important}
  .page-remote .remote-hero-v29 .remote-hero-art{
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    padding:0!important;
    margin:0 auto!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    overflow:visible!important;
    transform:none!important;
  }
  .page-remote .remote-hero-v29 .remote-hero-art::before,
  .page-remote .remote-hero-v29 .remote-hero-art::after{display:none!important;content:none!important}
  .page-remote .remote-workspace-2935{
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    margin:0!important;
    padding:13px!important;
    border-radius:22px!important;
    background:radial-gradient(circle at 50% -10%,rgba(74,225,203,.2),transparent 33%),linear-gradient(145deg,#061b24,#0b3440 56%,#0d6775)!important;
    box-shadow:0 18px 42px rgba(0,15,24,.28)!important;
  }
  .page-remote .remote-workspace-foot{margin:0!important;padding:0!important}
}

@media (max-width:420px){
  .page-home .cxr-conversion-flow{grid-template-columns:1fr!important}
  .page-home .cxr-photo-sticker{max-width:calc(100% - 68px)!important;font-size:10.5px!important;padding:7px 9px!important}
  .page-home .cxr-photo-sticker small{font-size:9.5px!important}
  .page-home .cxr-weather-card{left:8px!important;right:8px!important;bottom:8px!important}
  .page-home .cxr-status-card ol{grid-template-columns:repeat(5,minmax(0,1fr))!important;padding-inline:14px!important}
  .page-home .cxr-status-card ol li{font-size:8px!important}
  .page-home .cxr-status-note{margin-inline:14px!important}
  .page-home .cxr-status-evidence{padding-inline:14px!important}
}

@keyframes cx284StatusBreath{0%,100%{box-shadow:0 20px 54px rgba(0,0,0,.20)}50%{box-shadow:0 24px 62px rgba(7,109,211,.25)}}
@keyframes cx284StatusScan{0%,20%{left:-42%;opacity:0}32%{opacity:1}65%,100%{left:128%;opacity:0}}
@keyframes cx284DevicePulse{0%,100%{transform:translateY(0);color:inherit}50%{transform:translateY(-2px);color:#0b6fce}}
@keyframes cx284ActiveStep{0%,100%{border-color:#0c72dc;opacity:.76}50%{border-color:#39a5ff;opacity:1}}
@keyframes cx284StatusNote{0%,100%{transform:translateX(0)}50%{transform:translateX(3px)}}

@media (prefers-reduced-motion:reduce){
  .page-home .cxr-status-card,
  .page-home .cxr-status-card::after,
  .page-home .cxr-status-device strong,
  .page-home .cxr-status-card ol li.active,
  .page-home .cxr-status-note{animation:none!important;transform:none!important}
}