.mobile-hero{display:none}
@media(max-width:768px){
  /* New hero uses the responsive rules in styles.css. */
  .site-header{height:78px;position:relative}
  .header-inner{width:calc(100% - 24px);gap:8px}
  .brand{flex:1;min-width:0;width:auto}.brand img{width:100%;max-width:235px}
  .desktop-nav{display:none}
  .header-wa{flex:0 0 auto;width:104px;height:35px;padding:0 7px;font-size:10px;gap:4px;border-radius:9px}
  .header-wa svg{width:15px;height:15px}
  .menu-button{display:flex;flex:0 0 36px;width:36px;height:36px;padding:8px;border-radius:9px}
  .mobile-menu.open{display:block}
  .mobile-hero{display:block;position:relative;overflow:hidden;background:#02152c;color:white}
  .mobile-canvas{width:941px;height:1780px;position:absolute;top:0;left:0;transform-origin:top left;isolation:isolate}
  .mobile-background{position:absolute;inset:0 0 108px;background:url('assets/construction-background.png') center/100% 100% no-repeat;z-index:-2}
  .mobile-background:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,17,37,.22),transparent 42%,transparent 85%,#02152c),linear-gradient(90deg,rgba(1,17,37,.65),transparent 90%)}
  .mobile-canvas .hero-copy{top:46px;left:36px;width:850px;max-width:none}
  .mobile-canvas .eyebrow{font-size:27px;letter-spacing:.16em;margin:0 0 10px}
  .mobile-canvas h1{font-size:104px;line-height:.9;letter-spacing:-.045em;font-weight:950;margin:0 0 20px}
  .mobile-canvas h1 span,.mobile-canvas h1 strong{display:block}.mobile-canvas h1 strong{color:#35aeff}
  .mobile-canvas h2{font-size:38px;line-height:1.14;margin:0 0 20px;letter-spacing:-.02em}.mobile-canvas h2 em{color:#0ee678;font-style:normal}
  .mobile-canvas .hero-body{width:555px;max-width:none;font-size:29px;line-height:1.35;margin:0;padding:0;min-height:0}
  .mobile-canvas .hero-copy-cta,.mobile-canvas .benefits{display:none}
  /* Hand, casing and live WhatsApp content share this local coordinate system. */
  .mobile-phone-layer{position:absolute;left:0;top:0;width:941px;height:1672px;z-index:3}
  .hand-phone-art{position:absolute;inset:0;width:941px;height:1672px;max-width:none;pointer-events:none;user-select:none}
  .mobile-canvas .phone-live{top:0;left:0;right:auto;width:360px;height:780px;transform-origin:top left;border:0;border-radius:45px;grid-template-rows:35px 84px 1fr 58px;box-shadow:none;transform:matrix3d(1.0142998262244753,-0.043512161191886715,0,4.176105942720616e-05,0.07183390254667621,0.944429493964339,0,-4.274456533383612e-05,0,0,1,0,320,781,0,1)}
  .mobile-canvas .phone-live:before{top:12px;width:105px;height:21px}
  .mobile-canvas .phone-status{font-size:11px;padding:0 22px}
  .mobile-canvas .wa-header{gap:9px;padding:10px}.mobile-canvas .wa-back{font-size:34px}.mobile-canvas .wa-avatar{width:42px;height:42px;padding:5px}.mobile-canvas .wa-title b{font-size:14px}.mobile-canvas .wa-title small{font-size:10px}.mobile-canvas .wa-actions{font-size:27px}
  .mobile-canvas .tender-message{font-size:13px;line-height:1.24;margin:12px 10px 20px;padding:14px 12px 28px}.mobile-canvas .tender-message p{margin-bottom:11px}.mobile-canvas .message-brand b{font-size:12px}.mobile-canvas .message-brand img{width:43px;height:30px}.mobile-canvas .tender-message time{font-size:9px}
  .mobile-canvas .match-message{font-size:12px;padding:12px 12px 22px}.mobile-canvas .match-message time{font-size:9px}.mobile-canvas .wa-compose{font-size:20px;padding:8px 12px}.mobile-canvas .wa-compose div{height:38px;font-size:12px}
  .mobile-canvas .hero-orbit-benefits{display:block;position:absolute;inset:0;pointer-events:none}
  .mobile-canvas .orbit-benefit{position:absolute;width:160px;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;color:white;text-shadow:0 2px 8px #00152c}
  .mobile-canvas .orbit-benefit i{display:grid;place-items:center;width:102px;height:102px;max-width:none;max-height:none;border-radius:50%;background:linear-gradient(145deg,#08d66f,#05ad5a);border:3px solid #8affbd;box-shadow:0 0 36px #04cb78,inset 0 2px 10px #b6ffcb}
  .mobile-canvas .orbit-benefit svg{width:55px;height:55px;max-width:none;max-height:none;fill:currentColor}.mobile-canvas .orbit-benefit b{font-size:26px;line-height:1.15}
  .mobile-canvas .orbit-easy{left:35px;top:865px;bottom:auto}.mobile-canvas .orbit-fast{left:35px;top:1220px;bottom:auto}
  .mobile-canvas .orbit-relevant{right:2px;top:850px;bottom:auto}.mobile-canvas .orbit-direct{right:2px;top:1210px;bottom:auto}
  .mobile-canvas .hero-mobile-cta{position:absolute;display:flex;top:1640px;bottom:auto;left:36px;right:auto;width:869px;max-width:none;min-width:0;height:112px;padding:0 34px;margin:0;border-radius:25px;font-size:36px;gap:23px}
  .mobile-canvas .hero-mobile-cta svg{width:48px;height:48px}.mobile-canvas .hero-mobile-cta .arrow{margin-left:auto}
  .mobile-feature-band{display:block}
}
@media(min-width:769px){.mobile-hero{display:none}}


/* Match the approved portrait composition; keep the single parent scale. */
@media(max-width:768px){
 .mobile-canvas{height:1876px}
 .mobile-background{inset:0;background-size:100% 100%}
 .mobile-canvas .hero-body{width:470px;font-size:29px;line-height:1.35}
 .mobile-phone-layer{transform:matrix(1.0807048229844847,0.019661192627862437,-0.057856379360606315,1.079098241181615,-38.835603925760395,-154.5667087746574);transform-origin:0 0}
 .mobile-canvas .orbit-easy{left:28px;top:809px}
 .mobile-canvas .orbit-relevant{right:28px;top:809px}
 .mobile-canvas .orbit-fast{left:28px;top:1140px}
 .mobile-canvas .orbit-direct{right:28px;top:1140px}
 .mobile-canvas .hero-mobile-cta{top:1710px;left:30px;width:881px;height:116px}
}

@media(max-width:768px){
 .mobile-canvas h1{font-size:123px;margin-bottom:10px}
 .mobile-canvas h2{font-size:45px;margin-bottom:16px}
 .mobile-canvas .hero-body{width:450px}
 .mobile-phone-layer{margin-top:30px}
 .mobile-canvas .phone-live{grid-template-rows:40px 104px 1fr 64px}
 .mobile-canvas .phone-status{font-size:15px}
 .mobile-canvas .wa-avatar{width:57px;height:57px}
 .mobile-canvas .wa-title b{font-size:19px}.mobile-canvas .wa-title small{font-size:14px}
 .mobile-canvas .tender-message{font-size:17px;line-height:1.2}
 .mobile-canvas .message-brand b{font-size:16px}.mobile-canvas .message-brand img{width:49px;height:33px}
 .mobile-canvas .wa-compose div{font-size:17px}
 .mobile-canvas .orbit-benefit:after{content:'';position:absolute;top:99px;width:63px;height:2px;border-top:5px dotted #36e9a0;opacity:.85}
 .mobile-canvas .orbit-easy:after{left:135px;transform:rotate(35deg)}
 .mobile-canvas .orbit-fast:after{left:135px;transform:rotate(-30deg)}
 .mobile-canvas .orbit-relevant:after{right:135px;transform:rotate(-35deg)}
 .mobile-canvas .orbit-direct:after{right:135px;transform:rotate(30deg)}
}
