/* Mobile 6.4: una sola capa responsive, estable y sin conflictos. */
@media (max-width:960px){
  html,body{width:100%;max-width:100%;overflow-x:clip}
  html.menu-open,body.menu-open{overflow:hidden!important;overscroll-behavior:none}
  body.menu-open main,body.menu-open footer{pointer-events:none}

  .elementor,.elementor-section,.elementor-container,.elementor-column,.elementor-widget-wrap,.elementor-widget,.elementor-widget-container{min-width:0;max-width:100%}
  .container{width:min(calc(100% - 36px),760px);max-width:100%;margin-inline:auto}

  .site-header{position:fixed;inset:0 0 auto;z-index:10001;padding:10px 0;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important}
  .site-header.scrolled{background:rgba(7,7,8,.9)!important;border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:none!important}
  .site-header.menu-is-open{background:transparent!important;border:0!important}
  .header-inner{position:relative;z-index:2;height:62px}
  .brand,.brand a,.custom-logo-link{display:block;line-height:0}
  .brand img,.custom-logo{display:block;width:124px;height:52px;object-fit:contain}
  .menu-toggle{position:relative;z-index:3;display:flex;flex:0 0 48px;width:48px;height:48px;background:var(--accent);border:0;border-radius:50%;box-shadow:0 10px 28px rgba(255,75,75,.24)}

  .mobile-menu{display:flex!important;position:fixed!important;inset:0!important;z-index:10000!important;width:100%!important;height:100dvh!important;min-height:100svh!important;padding:clamp(120px,17svh,155px) 28px max(38px,env(safe-area-inset-bottom))!important;overflow-y:auto!important;overflow-x:hidden!important;flex-direction:column!important;justify-content:flex-start!important;gap:34px;background:#070708!important;color:#fff!important;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-14px);transition:opacity .32s ease,transform .42s cubic-bezier(.22,1,.36,1),visibility .32s}
  .mobile-menu.open{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important}
  .mobile-menu .mobile-nav,.mobile-menu>.nav-list{display:flex!important;width:100%!important;margin:0!important;padding:0!important;flex-direction:column!important;align-items:flex-start!important;gap:10px!important;list-style:none!important}
  .mobile-menu li{display:block!important;width:100%!important;margin:0!important;padding:0!important;overflow:visible!important;opacity:0;transform:translateY(18px);transition:opacity .35s ease,transform .45s cubic-bezier(.22,1,.36,1)}
  .mobile-menu.open li{opacity:1;transform:none}
  .mobile-menu.open li:nth-child(2){transition-delay:.04s}.mobile-menu.open li:nth-child(3){transition-delay:.08s}.mobile-menu.open li:nth-child(4){transition-delay:.12s}.mobile-menu.open li:nth-child(5){transition-delay:.16s}
  .mobile-menu li a{display:block!important;width:100%!important;padding:4px 0!important;color:#fff!important;font:700 clamp(34px,10vw,48px)/1.08 "Manrope",sans-serif!important;letter-spacing:-.045em!important;text-decoration:none!important;overflow-wrap:anywhere}
  .mobile-menu li a:after{display:none!important}
  .mobile-menu-cta{display:inline-flex!important;width:max-content!important;max-width:100%;margin-top:auto;padding:14px 21px;border:1px solid rgba(255,255,255,.18);border-radius:99px;color:#fff!important;font-size:15px;font-weight:700;background:rgba(255,255,255,.06)}

  .hero{min-height:auto;padding-top:108px;overflow:hidden}
  .hero-grid{display:block;min-height:0}
  .hero-copy,.hero-stage{width:100%;min-width:0;max-width:100%}
  .eyebrow{max-width:100%;font-size:10px;line-height:1.45;letter-spacing:.13em}
  .hero-title{margin:25px 0 29px;font-size:clamp(42px,12.5vw,61px);line-height:.96;letter-spacing:-.065em;overflow:visible}
  .hero-title .line{display:block;overflow:hidden;padding:.04em .05em .08em 0}
  .hero-title .line>span{display:block;line-height:inherit}
  .hero-title .accent-line>span{font-size:.84em;white-space:nowrap;letter-spacing:-.075em}
  .hero-intro{position:relative;z-index:2;margin:0;max-width:100%;font-size:16px;line-height:1.58}
  .hero-actions{margin-top:31px;gap:20px}
  .hero-actions .button{min-height:56px;max-width:100%;padding-inline:22px;text-align:center}
  .hero-services{margin-top:31px;max-width:100%;font-size:9px;line-height:1.7;letter-spacing:.1em;overflow-wrap:anywhere}
  .hero-stage{height:370px;margin-top:36px;overflow:visible}
  .browser-card{inset:22px 0 38px;max-width:100%;transform:none!important}
  .browser-body{padding:27px}
  .browser-body strong{margin-top:35px;font-size:clamp(31px,9.5vw,39px)}
  .float-card{display:none!important}

  .hero-canvas,.ambient-pointer,.cursor-dot,.cursor-ring,.project-orbit{display:none!important}
  .hero-orbit{opacity:.32;animation:none!important}
  .hero-glow{opacity:.11!important;animation:none!important}
  .page-transition{display:none!important}
  .marquee div{animation-duration:42s!important}

  .reveal{opacity:0;transform:translateY(18px);filter:none;transition:opacity .55s ease,transform .65s cubic-bezier(.22,1,.36,1)}
  .reveal.visible{opacity:1;transform:none}
  .elementor-editor-active .reveal{opacity:1!important;transform:none!important}

  .intro-section,.services-section,.projects-section,.process-section,.quote-section,.contact-section{padding:82px 0}
  .display,.section-head h2,.process-sticky h2,.contact-section h2{max-width:100%;font-size:clamp(34px,10.5vw,44px);line-height:1;letter-spacing:-.055em;overflow-wrap:anywhere;text-wrap:balance}
  .section-head p,.intro-bottom p,.process-sticky p,.contact-section p{max-width:100%;overflow-wrap:anywhere}
  .section-head{margin-bottom:48px}
  .service-row{grid-template-columns:38px minmax(0,1fr);gap:11px;padding:29px 0;transform:none!important}
  .service-row>i{display:none!important}.service-row>div{grid-column:1/-1;padding-left:49px}.service-row h3{font-size:clamp(24px,7.6vw,30px);overflow-wrap:anywhere}

  .project-showcase{gap:68px}.project-browser{width:100%;border-radius:19px;transform:none!important}.project-browser-bar{height:48px;grid-template-columns:auto minmax(0,1fr);gap:12px;padding-inline:14px}.project-domain{justify-self:end;max-width:175px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.project-expand{display:none!important}
  .project-visual{width:100%;height:440px;min-height:0;padding:23px;transform:none!important}.project-brand{max-width:100%;margin-top:43px}.project-brand strong{max-width:100%;font-size:clamp(36px,10.7vw,52px);line-height:.92;letter-spacing:-.06em;overflow-wrap:anywhere}.project-preview-button{left:23px;right:auto;bottom:23px;max-width:calc(100% - 46px);transform:none!important}.project-preview-button i,.project-meta>a i{display:none!important}.project-meta{align-items:flex-start;flex-direction:column;gap:19px;padding-top:22px}.project-meta>div{grid-template-columns:36px minmax(0,1fr);width:100%}.project-meta h3{font-size:clamp(25px,7.8vw,34px);overflow-wrap:anywhere}.project-meta>a{margin-left:52px}

  .preview-window{width:100%;height:calc(100svh - 16px);max-height:none;border-radius:17px}.preview-toolbar{grid-template-columns:minmax(0,1fr) auto;padding:0 10px}.preview-toolbar>.browser-dots,.preview-toolbar a{display:none}.preview-toolbar strong{max-width:62vw;padding-left:7px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .contact-grid,.contact-form{width:100%;min-width:0}.contact-direct a{max-width:100%;overflow-wrap:anywhere}.contact-form{padding:23px}.contact-form input,.contact-form textarea,.contact-form select{width:100%;min-width:0}
  .footer-statement strong{max-width:100%;font-size:clamp(44px,13vw,65px);overflow-wrap:anywhere}.footer-top,.footer-bottom{width:100%}
}

@media (max-width:380px){
  .container{width:calc(100% - 24px)}
  .mobile-menu{padding-inline:20px!important}
  .hero-title{font-size:41px}
  .hero-title .accent-line>span{font-size:.78em}
  .project-visual{height:405px}
  .project-domain{max-width:142px}
}

@media (prefers-reduced-motion:reduce){
  .mobile-menu,.mobile-menu li,.reveal{transition:none!important}
  .reveal{opacity:1!important;transform:none!important}
}