/* MOTOR MACRO V15 — ajustes móviles incrementales.
   Sin cambios en el diseño de escritorio ni en los datos editoriales. */

/* A 1220px se activa el botón de menú; el panel también debe poder abrirse. */
@media screen and (max-width:1220px) {
  .site-header{isolation:isolate}
  .mobile-menu{
    display:grid!important;
    place-items:center;
    flex:0 0 auto;
    min-width:44px;
    min-height:44px;
    line-height:1;
  }
  .mobile-nav{
    position:absolute;
    top:100%;
    left:0;
    right:0;
    z-index:65;
    padding:12px 16px 16px;
    max-height:calc(100vh - 78px);
    max-height:calc(100dvh - 78px);
    overflow-y:auto;
    overscroll-behavior:contain;
    border-bottom:1px solid #35516b;
    background:#071827;
    box-shadow:0 18px 30px #010915d9;
  }
  .mobile-nav.open{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
  }
  .mobile-nav a{
    display:flex;
    min-width:0;
    min-height:44px;
    align-items:center;
    justify-content:center;
    padding:10px 8px;
    border:1px solid #334e68;
    border-radius:9px;
    background:#12283e;
    color:#e8f0f8;
    line-height:1.35;
    text-align:center;
    overflow-wrap:break-word;
  }
  .mobile-nav a:hover,
  .mobile-nav a.active,
  .mobile-nav a:focus-visible{
    border-color:#d7ae70;
    background:#22394d;
    color:#fff;
  }
}

@media screen and (max-width:800px) {
  .mobile-nav.open{grid-template-columns:repeat(2,minmax(0,1fr))}
  .head-inner .brand{min-width:0;flex:1 1 auto}
  .head-inner .brand-text{min-width:0}
  .head-inner .brand-text strong{white-space:nowrap}
  .page .hero,
  .page .panel,
  .page .market-pairs,
  .page .market-sidebar,
  .page .market-heatmap-panel,
  .page .edition-layout,
  .page .mm-ed-root{min-width:0;max-width:100%}
  .page .page-pad{padding-top:22px;padding-bottom:44px}
  .page .hero-nums{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page .hero-num:last-child:nth-child(odd){grid-column:1/-1}
  .page .table-wrap{
    max-width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
  }
  .page .table-wrap table{min-width:100%}
  .page .tv-host,
  .page .tradingview-widget-container{max-width:100%;min-width:0}
  .mm-ed-root .mm-ed-tabs{
    max-width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
  }
}

@media screen and (max-width:600px) {
  .mobile-nav{max-height:calc(100vh - 69px);max-height:calc(100dvh - 69px);padding:10px 12px 14px}
  .mobile-nav a{font-size:13px;min-height:46px}
  .page .hero-main{padding:24px 17px}
  .page .hero-main h1{overflow-wrap:break-word}
  .page .section-title h2,
  .page .panel-title h3,
  .page .mm-ed-root h2,
  .page .mm-ed-root h3{overflow-wrap:break-word}
  .page .panel-title{min-width:0;gap:8px}
  .page .market-asset-strip{grid-template-columns:1fr}
  .page .chart-market-links{flex-wrap:wrap}
  .page .mm-ed-card,
  .page .mm-ed-exec-card,
  .page .mm-ed-pair{min-width:0}
  .page .mm-ed-card a,
  .page .mm-ed-exec-card a{overflow-wrap:anywhere}
  .page input[type="search"],
  .page input[type="text"],
  .page input:not([type]),
  .page select,
  .page textarea{font-size:16px}
}

@media screen and (max-width:380px) {
  .head-inner{gap:7px}
  .head-inner .brand{gap:7px}
  .head-inner .brand-text strong{font-size:13px}
  .head-inner .brand-text small{font-size:6.5px;letter-spacing:0}
  .page .hero-nums{grid-template-columns:1fr}
  .page .hero-num:last-child:nth-child(odd){grid-column:auto}
  .page .pair-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}


/* Ticker TradingView: el widget ocupa más de 58px en algunos teléfonos.
   Reservamos la altura completa para evitar cortar precio y variación. */
@media screen and (max-width:650px){
  .ticker-shell{
    height:108px;
    min-height:108px;
    max-width:100%;
    align-items:stretch;
  }
  .ticker-label{
    display:flex;
    width:100px;
    flex:0 0 100px;
    align-items:center;
    justify-content:center;
    padding:0 10px;
    line-height:1.3;
  }
  .ticker-body{
    flex:1 1 0;
    min-width:0;
    height:108px;
    overflow:hidden;
  }
  .ticker-body .tv-host,
  .ticker-body .tradingview-widget-container,
  .ticker-body .tradingview-widget-container__widget{
    display:block;
    height:108px!important;
    min-height:108px!important;
  }
  .ticker-body iframe{
    display:block;
    height:108px!important;
    min-height:108px!important;
    max-width:100%;
  }
  .ticker-fallback{height:108px}
}


/* V15 móvil · ficha de divisa y artículos: el ancho de las tablas no
   debe convertirse en el ancho de la página completa. */
@media screen and (max-width:960px){
  .page[data-page="lectura"] .article-layout,
  .page[data-page="archivo-19oct"] .article-layout{
    width:100%;
    min-width:0;
    max-width:100%;
    grid-template-columns:minmax(0,1fr);
  }
  .page .article-layout > *,
  .page .article-page-body,
  .page .article-sidebar,
  .page .article-page-body .note-feature{
    box-sizing:border-box;
    min-width:0;
    max-width:100%;
  }
  .page .article-page-body{
    width:100%;
    overflow-wrap:break-word;
  }
  .page .article-page-body .table-wrap{
    display:block;
    width:100%;
    max-width:100%;
    min-width:0;
    overflow-x:auto;
    overflow-y:hidden;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
  }
  .page .article-page-body .table-wrap table{
    width:max-content;
    min-width:100%;
    max-width:none;
  }
}
@media screen and (max-width:650px){
  .page[data-page="lectura"] > .wrap,
  .page[data-page="archivo-19oct"] > .wrap{
    min-width:0;
    width:100%;
    box-sizing:border-box;
  }
  .page .article-page-body{padding:23px 18px}
  .page .article-page-body h1{overflow-wrap:anywhere;line-height:1.22}
  .page .article-page-body .lead,
  .page .article-page-body p{overflow-wrap:break-word}
  .page .article-page-body .pair-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  /* La franja de TradingView ocupa una fila propia: evita que la
     etiqueta lateral reste espacio al widget en teléfonos. */
  .ticker-shell{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    height:auto;
    min-height:0;
    overflow:visible;
  }
  .ticker-shell .ticker-label{
    width:100%;
    flex:0 0 auto;
    min-height:30px;
    justify-content:flex-start;
    padding:7px 14px;
    border-right:0;
    border-bottom:1px solid #263950;
  }
  .ticker-shell .ticker-body{
    width:100%;
    flex:0 0 auto;
    height:118px;
    min-height:118px;
    overflow:hidden;
  }
  .ticker-shell .ticker-body .tv-host,
  .ticker-shell .ticker-body .tradingview-widget-container,
  .ticker-shell .ticker-body .tradingview-widget-container__widget,
  .ticker-shell .ticker-body iframe{
    height:118px!important;
    min-height:118px!important;
  }
  .ticker-shell .ticker-fallback{height:118px}
}