/* ══ RESPONSIVE — max-width:900px ══ */
@media(max-width:900px){

  /* Layout */
  .stage{grid-template-columns:1fr}
  .code-box{
    position:fixed;inset:0;z-index:50;height:100%;
    border-radius:0;border:none;
    background:#060a0e!important;backdrop-filter:none!important;
    padding:24px 18px;
    transition:opacity 0.6s ease,visibility 0.6s ease
  }
  body.rendered .code-box{opacity:0;visibility:hidden;pointer-events:none}
  body.rendered.nav-transitioning .code-box{opacity:1;visibility:visible;pointer-events:none;padding-top:72px}
  .content-area{height:100dvh}

  /* Momentos */
  .moment{
    display:flex!important;flex-direction:column!important;
    align-items:center!important;justify-content:flex-start!important;
    padding:72px 24px 72px!important;gap:10px!important;overflow:hidden;
  }

  /* Logo */
  .logo-fixed{right:auto;left:50%;transform:translateX(-50%);top:12px}
  .svg-masked{width:90px;height:32px}
  .dev-text{font-size:20px}

  /* M1 hero */
  .bulb-col{width:100%;justify-content:center;position:relative;z-index:0;flex-shrink:0}
  .bulb-stack{width:312px!important;margin-top:0!important;margin-bottom:0}
  .bulb-halo{width:340px!important;height:340px!important}
  .m1-text{padding:0!important;align-items:center;width:100%;text-align:center;position:relative;z-index:1;padding-top:8px!important}
  .heading{font-size:clamp(20px,5.5vw,36px)}
  .heading .line3{justify-content:center}
  .sub{font-size:12px;margin-bottom:15px;line-height:1.7}
  .cta-btn{align-self:center;padding:10px 24px;font-size:10px}

  /* Section headings */
  .section-heading{font-size:clamp(20px,5.5vw,34px)}

  /* Section text blocks */
  .section-text{padding:0!important;display:flex;flex-direction:column;align-items:center;width:100%;text-align:center;position:relative;z-index:1;padding-top:12px!important}
  .service-list{gap:6px;margin-bottom:18px}
  .service-list li{text-align:left;font-size:13px;line-height:1.6}
  .step-list{text-align:left;gap:6px;margin-bottom:18px}
  .step-title{font-size:13px;font-weight:300;line-height:1.6;text-align:left}
  .step-desc{display:none}
  .section-cta{align-self:center;padding:9px 20px;font-size:10px}

  /* Mockup cols */
  .mockup-col{width:100%;justify-content:center;position:relative;z-index:0;flex-shrink:0}

.mockup-col{height:280px;max-height:280px;overflow:visible;align-items:center;justify-content:center}
.mockup-wrap{max-height:250px;overflow:visible;display:flex;align-items:center;justify-content:center}
.mockup-wrap > *{max-height:250px;object-fit:contain}

  /* ── Eyebrow ── */
  .section-eyebrow{
  padding-top:0px;
  }

  /* M2 browser */
  .live-browser{width:300px}

  /* M3 phone */
  .phone-device{width:160px}

  /* M4 app */
  .app-shell{width:160px}
  .app-kpis{gap:3px}
  .app-kpi{padding:4px}
  .app-chart{height:56px}

  /* M5 chat */
  .chat-shell{width:240px}

  /* M6 pipeline */
  .pipeline{width:180px}
  .pipeline-node{width:26px;height:26px;font-size:7px}
  .pipeline-vline{height:22px}
  .pipeline-content{padding-top:4px}
  .pipeline-label{margin-bottom:4px}

  /* M7 contact */
  .contact-visual{width:200px}
  .ct-dialog-body{min-height:90px}
  .social-links{gap:8px;margin-bottom:18px;width:100%;max-width:260px}
  .social-link{padding:9px 14px;justify-content:center}
  .social-handle{font-size:16px}
  .network-link{margin:0 auto;display:block}

  /* Nav dots */
  .nav-dots{display:none}

  /* Hide inline desktop actions */
  .btn-group{display:none!important}
  .section-cta{display:none!important}
  .cta-btn{display:none!important}
  .section-text .network-link{display:none!important}

  /* ── STICKY BAR ── */
  .sticky-bar{
    display:flex;align-items:center;
    position:fixed;bottom:0;left:0;right:0;height:62px;
    background:transparent;border-top:none;
    padding:0 16px;padding-right:90px;z-index:200;
  }
  body.on-m2 .sticky-bar,body.on-m3 .sticky-bar,body.on-m4 .sticky-bar,
  body.on-m5 .sticky-bar,body.on-m6 .sticky-bar,body.on-m7 .sticky-bar{
    background:rgba(6,10,14,0.96);
    border-top:1px solid rgba(5,200,216,0.12);
    backdrop-filter:blur(8px);
  }
  .sticky-bar-left{display:flex;gap:8px;align-items:center;flex:1}
  .sticky-arrows{display:flex;gap:6px;align-items:center;margin-right:10px;flex-shrink:0}
  .sticky-arrow{
    width:28px;height:28px;border-radius:50%;
    border:1.5px solid #05c8d8;
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;background:transparent;transition:background 0.2s;
    flex-shrink:0;font-size:12px;color:#05c8d8;line-height:1;user-select:none;
  }
  .sticky-arrow:hover{background:rgba(5,200,216,0.12)}
  .sticky-arrow.disabled{border-color:rgba(5,200,216,0.2);color:rgba(5,200,216,0.2);cursor:default;pointer-events:none}
  .sticky-btn-info{display:inline-block;font-family:'JetBrains Mono',monospace;font-size:10px;font-weight:300;color:#3dba8c;border:1px solid rgba(61,186,140,0.5);padding:8px 14px;letter-spacing:0.06em;cursor:pointer;transition:all 0.2s;text-decoration:none;background:transparent;white-space:nowrap}
  .sticky-btn-info:hover{background:rgba(61,186,140,0.1);border-color:#3dba8c}
  .sticky-btn-cotizar{display:inline-block;font-family:'JetBrains Mono',monospace;font-size:10px;font-weight:300;color:#05c8d8;border:1px solid rgba(5,200,216,0.4);padding:8px 14px;letter-spacing:0.06em;cursor:pointer;transition:all 0.2s;text-decoration:none;background:transparent;white-space:nowrap}
  .sticky-btn-cotizar:hover{background:rgba(5,200,216,0.1);border-color:#05c8d8;color:#fff}
  .sticky-btn-hero{display:inline-block;font-family:'JetBrains Mono',monospace;font-size:10px;font-weight:300;color:#fff;border:1.5px solid rgba(255,255,255,0.6);padding:8px 14px;letter-spacing:0.06em;cursor:pointer;transition:all 0.2s;text-decoration:none;background:transparent;white-space:nowrap}
  .sticky-btn-hero:hover{background:rgba(255,255,255,0.15);border-color:#fff}
  .sticky-net-link{display:inline-flex;align-items:center;text-decoration:none}
  .sticky-net-svg{fill:#05c8d8;transition:fill 0.2s;display:block}
  .sticky-net-link:hover .sticky-net-svg{fill:#ffffff}
  .moment{padding-bottom:72px!important}
}
