/* Rango Group — phone-first layout revision, intentionally last stylesheet */
@media screen and (max-width: 767px) {
 html,body{width:100%;max-width:100%;overflow-x:clip}
 .topline{height:23px!important;padding:0 20px!important}.topline span:first-child{font-size:8px!important}
 .site-header{height:72px!important;min-height:72px!important;padding:0 19px!important;gap:10px!important}
 .site-header .identity{gap:9px!important;min-width:0!important;flex:1!important}
 .site-header .identity-mark{width:51px!important;height:51px!important;flex:0 0 51px!important;padding:0!important}
 .identity-name strong{font-size:22px!important;line-height:1!important;letter-spacing:.4px!important;white-space:nowrap}
 .identity-name small{font-size:8px!important;letter-spacing:1.1px!important;white-space:nowrap}
 .menu-toggle{display:grid!important;place-items:center!important;width:44px!important;height:44px!important;flex:0 0 44px!important;background:#172219!important;border:1px solid #455a3b!important;border-radius:10px!important;color:#c9f64a!important;font-size:24px!important}
 .site-header nav{top:72px!important;left:0!important;right:0!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important;z-index:1000!important}
 .hero{display:flex!important;flex-direction:column!important;grid-template-columns:none!important;min-height:0!important;height:auto!important;background:linear-gradient(160deg,#101b13 0%,#080d0a 65%,#0e1710 100%)!important}
 .hero-copy{order:1!important;width:100%!important;min-width:0!important;min-height:0!important;padding:35px 22px 12px!important;display:flex!important;flex-direction:column!important;align-items:stretch!important}
 .eyebrow{font-size:10px!important;letter-spacing:1.3px!important;line-height:1.5!important;gap:10px!important;max-width:100%!important}
 .eyebrow-rule{flex:0 0 22px!important;width:22px!important}
 .hero h1{font-size:clamp(56px,14.4vw,78px)!important;line-height:.86!important;letter-spacing:-1px!important;margin:28px 0 20px!important;max-width:100%!important;overflow-wrap:normal!important;word-break:normal!important}
 .hero h1 .outline{-webkit-text-stroke:1.2px #b7c3b6!important}
 .hero-intro{font-size:15px!important;line-height:1.6!important;max-width:36ch!important;margin:0!important;color:#c4cec4!important}
 .hero-actions{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:11px!important;margin:25px 0 18px!important;width:100%!important}
 .hero-actions .cta-lime{display:flex!important;align-items:center!important;justify-content:space-between!important;width:100%!important;min-height:55px!important;height:auto!important;padding:14px 18px!important;gap:12px!important;font-size:12px!important;line-height:1.3!important;letter-spacing:.6px!important;white-space:normal!important;border-radius:6px!important}
 .hero-actions .cta-lime span{font-size:21px!important;flex:0 0 auto!important}
 .hero-actions .text-action{display:inline-flex!important;align-self:flex-start!important;margin:0!important;padding:10px 0!important;font-size:10px!important;letter-spacing:.8px!important}
 .hero-caption{display:none!important}
 .hero-art{order:2!important;width:calc(100% - 44px)!important;max-width:none!important;min-width:0!important;height:270px!important;min-height:270px!important;max-height:270px!important;margin:8px 22px 29px!important;border:1px solid #344a36!important;border-radius:14px!important;overflow:hidden!important;background:radial-gradient(ellipse at 50% 48%,#31452c 0%,#142217 62%,#0a100c 100%)!important}
 .hero-art .hero-logo{position:absolute!important;left:50%!important;top:48%!important;width:79%!important;max-width:79%!important;max-height:70%!important;object-fit:contain!important;transform:translate(-50%,-50%)!important}
 .hero-art:hover .hero-logo{transform:translate(-50%,-50%)!important}
 .hero-art-kicker{left:16px!important;top:14px!important;font-size:9px!important;letter-spacing:1.2px!important;white-space:nowrap!important}
 .hero-art-kicker span,.hero-vertical,.art-corner{display:none!important}
 .hero-art-footer{left:0!important;right:0!important;bottom:0!important;padding:11px 14px!important;display:flex!important;flex-direction:row!important;justify-content:space-between!important;align-items:center!important;gap:8px!important;font-size:8px!important;line-height:1.3!important;letter-spacing:.3px!important}
 .hero-art-footer span{max-width:49%!important;white-space:normal!important}
 .hero-orbit{width:340px!important;height:340px!important}.hero-orbit.orbit-b{width:240px!important;height:240px!important}
 .marquee>div{font-size:22px!important}
 .intro-block,.home-services,.home-portal,.last-cta{padding:54px 22px!important}
 .intro-block{display:block!important}.intro-block h2,.home-services h2,.home-portal h2,.last-cta h2{font-size:clamp(43px,11vw,66px)!important;line-height:.98!important}
 .home-services-head{display:block!important}.home-services-head p{margin-top:16px!important}
 .service-strip{grid-template-columns:26px minmax(0,1fr) 20px!important;gap:8px!important}
 .service-strip strong{font-size:clamp(24px,7vw,32px)!important}
 .inner-page{padding:40px 22px 65px!important}.inner-head h1{font-size:clamp(48px,12vw,72px)!important;line-height:.93!important}
 .footer{padding-left:22px!important;padding-right:22px!important}
}
@media screen and (max-width: 380px){
 .identity-name strong{font-size:19px!important}.identity-name small{font-size:7px!important}
 .hero h1{font-size:clamp(50px,14vw,58px)!important}
 .hero-art{height:235px!important;min-height:235px!important;max-height:235px!important}
}