/* Synapse Controls - prueba aislada. Esta hoja no se carga en index.html.
   Solo telefono: <=767px. No se eliminan estilos de la web aprobada. */
@media only screen and (max-width: 767px) {
  /* Un logo visible. El boton original y el mismo UL siguen en el HTML. */
  #header.header_section,
  #header.header_section.navbar-fixed-top {
    position: fixed !important; inset: 0 0 auto 0 !important;
    width: 100% !important; height: 64px !important; min-height: 64px !important;
    padding: 0 !important; margin: 0 !important; overflow: visible !important;
    background: #fff !important; border: 0 !important;
    border-bottom: 1px solid #e1e6ea !important; z-index: 1050 !important;
    transition: none !important; transform: none !important;
  }
  #header.header_section > .navbar {
    height: 64px !important; min-height: 64px !important;
    padding: 0 !important; margin: 0 !important; border: 0 !important;
    background: #fff !important; overflow: visible !important;
  }
  #header.header_section .navbar > .container {
    display: block !important; position: static !important;
    width: 100% !important; max-width: none !important;
    height: 64px !important; padding: 0 16px !important; margin: 0 !important;
    box-sizing: border-box !important; overflow: visible !important;
  }
  #header.header_section .navbar-header {
    display: flex !important; align-items: center !important;
    justify-content: space-between !important; gap: 12px !important;
    position: static !important; float: none !important;
    width: 100% !important; min-width: 0 !important;
    height: 64px !important; min-height: 64px !important;
    margin: 0 !important; padding: 0 !important;
  }
  #header.header_section .navbar-header::before,
  #header.header_section .navbar-header::after { display: none !important; }
  #header.header_section .navbar-header > a.brand.logo-light {
    display: none !important;
  }
  #header.header_section .navbar-header > a.brand.logo-dark {
    display: flex !important; order: 1 !important; align-items: center !important;
    flex: 0 1 225px !important; min-width: 0 !important;
    max-width: calc(100% - 56px) !important; width: auto !important;
    height: 44px !important; padding: 0 !important; margin: 0 !important;
    position: static !important; float: none !important; transform: none !important;
  }
  #header.header_section .navbar-header > a.brand.logo-dark img {
    display: block !important; width: 100% !important; height: auto !important;
    max-width: 225px !important; max-height: 32px !important;
    object-fit: contain !important; object-position: left center !important;
    margin: 0 !important; padding: 0 !important; transform: none !important;
  }
  #header.header_section .navbar-header > button.navbar-toggle {
    display: flex !important; flex-direction: column !important;
    align-items: center !important; justify-content: center !important;
    gap: 5px !important; order: 2 !important; flex: 0 0 44px !important;
    position: static !important; float: none !important;
    width: 44px !important; height: 44px !important; min-height: 44px !important;
    margin: 0 !important; padding: 10px !important; transform: none !important;
    opacity: 1 !important; visibility: visible !important; pointer-events: auto !important;
    background: #fff !important; border: 1px solid #dce4ea !important;
    border-radius: 7px !important; transition: none !important; cursor: pointer;
  }
  #header.header_section .navbar-header > button.navbar-toggle .icon-bar {
    display: block !important; flex: 0 0 2px !important;
    width: 22px !important; height: 2px !important;
    padding: 0 !important; margin: 0 !important; border-radius: 1px !important;
    background: #26323b !important; opacity: 1 !important;
  }
  /* El panel, no el UL, tiene scroll. No hereda el limite de 340/200px. */
  #header.header_section #navbar.navbar-collapse {
    display: none !important; visibility: hidden !important;
    position: fixed !important; top: 64px !important; left: 0 !important; right: 0 !important;
    bottom: auto !important; float: none !important;
    width: 100% !important; min-width: 0 !important; height: auto !important;
    min-height: 0 !important; max-height: calc(100vh - 64px) !important;
    max-height: calc(100dvh - 64px) !important;
    box-sizing: border-box !important; padding: 8px 20px max(16px, env(safe-area-inset-bottom)) !important;
    margin: 0 !important; overflow-x: hidden !important; overflow-y: auto !important;
    overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch;
    background: #fff !important; border: 0 !important;
    border-bottom: 1px solid #dce4ea !important;
    box-shadow: 0 12px 24px rgba(24,43,60,.09) !important;
    transition: none !important; transform: none !important; z-index: 1051 !important;
  }
  #header.header_section[data-srm-open="true"] #navbar.navbar-collapse {
    display: block !important; visibility: visible !important;
  }
  #header.header_section #navbar .navbar-nav {
    display: block !important; float: none !important;
    width: 100% !important; max-width: 430px !important;
    height: auto !important; min-height: 0 !important; max-height: none !important;
    padding: 0 !important; margin: 0 auto !important;
    overflow: visible !important; text-align: center !important;
  }
  #header.header_section #navbar .navbar-nav > li {
    display: block !important; float: none !important;
    width: 100% !important; height: auto !important;
    padding: 0 !important; margin: 0 !important; text-align: center !important;
  }
  #header.header_section #navbar .navbar-nav > li > a {
    display: flex !important; align-items: center !important; justify-content: center !important;
    width: 100% !important; height: auto !important; min-height: 44px !important;
    padding: 11px 8px !important; margin: 0 !important; box-sizing: border-box !important;
    color: #303c47 !important; background: #fff !important;
    opacity: 1 !important; visibility: visible !important; pointer-events: auto !important;
    font-size: 12px !important; line-height: 1.65 !important; font-weight: 600 !important;
    letter-spacing: .7px !important; white-space: normal !important; text-align: center !important;
    border: 0 !important; border-bottom: 1px solid #edf1f4 !important;
    text-decoration: none !important; transition: none !important;
  }
  #header.header_section #navbar .navbar-nav > li:last-child > a { border-bottom: 0 !important; }
  #header.header_section #navbar .navbar-nav > li > a::before,
  #header.header_section #navbar .navbar-nav > li > a::after { display: none !important; }
  #header.header_section #navbar .navbar-nav > li.active > a {
    color: #087eaf !important; background: #f3f9fc !important;
  }
  #header.header_section a:focus-visible,
  #header.header_section button:focus-visible {
    outline: 2px solid #008fcc !important; outline-offset: -3px !important;
  }
  /* Portada: titulo arriba y fotografia completa abajo, sin cambiar su URL.
     La proporcion por defecto corresponde a 1920x821; el JS lee el archivo real. */
  section.hero_section {
    height: auto !important; min-height: 0 !important; max-height: none !important;
    padding: 88px 0 calc(var(--srm-hero-band, 42.7604vw) + 24px) !important;
    background-size: 100% auto !important; background-position: center bottom !important;
    background-repeat: no-repeat !important; background-attachment: scroll !important;
    background-color: #17242e !important;
  }
  section.hero_section > .display-table,
  section.hero_section > .display-table > .table-cell {
    display: block !important; height: auto !important;
  }
  section.hero_section .hero_content { width: 100% !important; padding: 0 18px !important; box-sizing: border-box !important; }
  section.hero_section .hero_content h1 {
    width: auto !important; max-width: 34ch !important; height: auto !important;
    padding: 0 !important; margin: 0 auto 14px !important;
    font-size: clamp(24px, 6.4vw, 30px) !important; line-height: 1.22 !important;
    letter-spacing: -.4px !important; color: #fff !important; text-align: center !important;
  }
  section.hero_section .hero_content p {
    max-width: 48ch !important; padding: 0 !important; margin: 0 auto 12px !important;
    font-size: 12px !important; line-height: 1.7 !important; color: #fff !important;
  }
  section.hero_section .hero_content p:last-child { margin-bottom: 0 !important; }
  section.testimonial_section {
    background-attachment: scroll !important; background-size: contain !important;
    background-position: center !important; background-repeat: no-repeat !important;
    background-color: #17242e !important;
  }
  /* Fotografias: lienzo acotado y contain, no imagen vertical ilimitada. */
  section.synapse-capabilities-v2 .synapse-capabilities-v2-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important; max-width: 430px !important; margin: 0 auto !important;
  }
  section.synapse-capabilities-v2 .synapse-capability-v2-media,
  section.synapse-news-section .synapse-news-media,
  section.deployments-section .deployment-thumb {
    position: relative !important; width: 100% !important;
    height: clamp(150px, 54vw, 216px) !important; min-height: 0 !important; max-height: 216px !important;
    aspect-ratio: auto !important; margin: 0 !important; padding: 0 !important;
    overflow: hidden !important; background: #f1f4f6 !important;
  }
  section.synapse-capabilities-v2 .synapse-capability-v2-media > img,
  section.synapse-news-section .synapse-news-media > img,
  section.deployments-section .deployment-thumb > img {
    position: absolute !important; inset: 0 !important;
    width: 100% !important; height: 100% !important;
    min-width: 0 !important; min-height: 0 !important;
    max-width: 100% !important; max-height: 100% !important;
    margin: 0 !important; padding: 0 !important;
    object-fit: contain !important; object-position: center !important;
    transform: none !important; transition: none !important;
  }
  section.synapse-capabilities-v2 .synapse-capability-v2-card,
  section.synapse-news-section .synapse-news-card,
  section.deployments-section .deployment-card {
    min-width: 0 !important; min-height: 0 !important; height: auto !important;
  }
  section.synapse-news-section .synapse-news-slider {
    width: calc(100% - 28px) !important; max-width: 430px !important;
    padding: 0 0 42px !important; margin: 0 auto !important;
  }
  section.synapse-news-section .news_carousel .swiper-slide { padding: 0 !important; }
  section.synapse-news-section .synapse-news-content,
  section.deployments-section .deployment-content {
    min-height: 0 !important; padding: 20px !important;
  }
  section.synapse-news-section .synapse-news-content h3,
  section.deployments-section .deployment-content h3,
  section.deployments-section .deployment-content p {
    height: auto !important; min-height: 0 !important;
  }
  section.deployments-section .deployments-carousel {
    width: calc(100% - 28px) !important; max-width: 430px !important;
    margin: 0 auto !important;
  }
  /* Logos: no se cambian archivos ni escalas opticas de Partners. */
  section.synapse-connectivity-section .synapse-connectivity-logo-media {
    height: 106px !important; min-height: 0 !important; max-height: 106px !important;
    padding: 16px !important; box-sizing: border-box !important;
  }
  section.synapse-connectivity-section .synapse-connectivity-logo-media > img {
    position: static !important; width: auto !important; height: auto !important;
    max-width: 82% !important; max-height: 70px !important; object-fit: contain !important;
  }
  section.synapse-customers-section .synapse-customers-grid {
    display: grid !important; grid-template-columns: minmax(0, 1fr) !important;
    width: calc(100% - 36px) !important; max-width: 430px !important;
    margin: 0 auto !important; padding: 0 !important; gap: 14px !important;
    justify-items: stretch !important; box-sizing: border-box !important;
  }
  section.synapse-customers-section .synapse-customers-grid > .synapse-customer-card {
    width: 100% !important; max-width: none !important; min-width: 0 !important;
    height: 124px !important; min-height: 124px !important; max-height: 124px !important;
    padding: 16px 20px !important; margin: 0 !important; box-sizing: border-box !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    grid-column: auto !important; grid-row: auto !important; float: none !important;
    transform: none !important; transition: none !important;
  }
  section.synapse-customers-section .synapse-customer-card > img {
    position: static !important; display: block !important;
    width: auto !important; height: auto !important; min-width: 0 !important; min-height: 0 !important;
    max-width: 88% !important; max-height: 88px !important;
    margin: 0 auto !important; object-fit: contain !important;
    transform: none !important; transition: none !important;
  }
}
@media only screen and (max-width: 767px) and (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
}