*{margin:0;padding:0;box-sizing:border-box}
 @font-face {font-family:"rayhub1";font-display:swap;src:url("../font/raayhub.ttf") format("truetype")}
  @font-face {font-family:"rayhub2";font-display:swap;src:url("../font/rayhub-one.ttf") format("truetype")}
  @keyframes fadeIn {from {opacity:0;transform:translateY(20px);}
  to {opacity:1;transform:translateY(0);}
  }
  @keyframes pulse {0% {transform:scale(1);}
  50% {transform:scale(1.03);}
  100% {transform:scale(1);}
  }
h1,h2,h3,h4 {font-weight:900;line-height:1.2; letter-spacing:1px;font-family: "rayhub2"}
a,p,li{font-family: 'rayhub2';letter-spacing: 0.2px;font-size: 16px!important;}
body{    font-family: "rayhub2", sans-serif;color:white;overflow-x:hidden;height:100vh;}
.indexrayhub1 .video-background{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-12;overflow:hidden}
.indexrayhub1 .video-background video{width:100%;height:100%;object-fit:cover}
.indexrayhub1 .video-overlay{position:absolute;top:0;left:0;width:100%;height:100%;}
.indexrayhub1 .main-nav{display:flex;justify-content:center;gap:90px;z-index:10;border-bottom: 5px solid #F0F8FF;left:0%;width: 70%;margin: 40px auto;}
.indexrayhub1 .nav-button{color:white;font-weight:400;font-size:16px;letter-spacing:1px;padding:18px 35px;border-radius:2px;transition:all 0.3s ease;font-weight: 900;}
.indexrayhub1 .nav-button:hover{background:rgba(255,255,255,0.1);border-color:rgba(255,0,0,1)}
.indexrayhub1 .content-section{height:80vh;display:flex;align-items:center;justify-content:flex-end;padding-right:10%;}
.indexrayhub1 .product-info{text-align:left;max-width:500px;padding:40px;border:1px solid rgba(255,255,255,0.2);margin-top:10px;}
.indexrayhub1 .product-info h2{font-weight:300;font-size:25px;letter-spacing:3px;margin-bottom:45px;line-height: 40px;}
.indexrayhub1 .product-info .htitle{font-weight:600;font-size:80px;letter-spacing:2px;margin-bottom:30px;line-height:90px;}
.indexrayhub1 .cta-button{display:inline-block;color:white;text-decoration:none;font-weight:400;font-size:4px;letter-spacing:1px;padding:12px 30px;border-bottom:3px solid #fff;margin-top:20px;transition:all 0.3s ease}
.indexrayhub1 .cta-button:hover{background:rgba(255,255,255,0.1);border-color:rgba(255,0,0,1)}
.indexrayhub1 .scroll-indicator{display:block;color:white;margin-top:20px;text-decoration:none;animation:bounce 2s infinite;text-align:right;}
.indexrayhub1 .scroll-indicator i{display:block;color:white;font-size:100px;margin-top:20px;text-decoration:none;animation:bounce 2s infinite;text-align:right;}
@keyframes bounce{0%,20%,50%,80%,100%{transform:translateY(0)}
40%{transform:translateY(-10px)}
60%{transform:translateY(-5px)}
}
.indexrayhub1 .brand-footer{position:fixed;bottom:30px;left:50px;font-size:24px;font-weight:700;letter-spacing:2px}
@media (max-width:768px){
.indexrayhub1 .main-nav{flex-wrap:wrap;padding:0 20px;gap:10px}
.indexrayhub1 .content-section{padding-right:0;justify-content:center}
.indexrayhub1 .product-info{padding:30px;margin-top: 0px;width: 90%;}
.indexrayhub1 .brand-footer{left:20px;font-size:18px}
.index-logo{width: 45%!important;}
}@media (max-width:480px){
.indexrayhub1 .product-info h1{font-size:36px}
.indexrayhub1 .product-info h2{font-size:14px}
.indexrayhub1 .nav-button{font-size:12px;padding:5px 10px}
}
.index-logo{position:absolute;width: 25%;bottom: 10%;z-index: 99;left:15%;}
.index-logo img{width: 100%;}
.indexrayhub2 .video-background{position:absolute;top:100%;left:0;width:100%;height:100%;z-index:-12;overflow:hidden}
.indexrayhub2 .video-background video{width:100%;height:100%;object-fit:cover}
.indexrayhub2 .video-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6)}
.indexrayhub2 .container{display:flex;min-height:100vh;align-items:center;padding:0 10%;}
.indexrayhub2 .content{flex:1;max-width:50%;padding-right:50px}
.indexrayhub2 .main-title{font-size:3.5rem;font-weight:bold;text-transform:uppercase;line-height:1.2;margin-bottom:30px}
.indexrayhub2 .new-highlight{color:#00f0ff;font-family:'Brush Script MT',cursive;font-size:4.5rem;text-transform:none;display:inline-block;margin-left:10px}
.indexrayhub2 .description{font-size:1.1rem;line-height:1.6;margin-bottom:40px;max-width:80%}
.indexrayhub2 .product-image{flex:1;text-align:center;position:relative}
.indexrayhub2 .product-image img{max-width:80%;height:auto;filter:drop-shadow(0 0 20px rgba(0,240,255,0.3));margin-bottom: 30px;}
.indexrayhub2 .series-name{position:absolute;bottom:0;right:0;font-size:1.5rem;font-weight:bold;padding:5px 15px;border-bottom: 3px solid #666;color: #666;}
@media (max-width:1024px){
.indexrayhub2 .video-background{height:120%!important;}
.indexrayhub2 .container{flex-direction:column;height:120vh!important;padding: 20px!important;}
.indexrayhub2 .content{max-width:100%;margin-bottom:50px;text-align:center;padding-right: 0px;}
.indexrayhub2 .description{max-width:100%;margin-left:auto;margin-right:auto}
.indexrayhub2 .product-image{margin-top:-120px}
.indexrayhub2 .series-name{position:relative;bottom:auto;right:auto;margin-top:20px;display:inline-block}
.indexrayhub3 .handheld{gap: 0px!important;}
}@media (max-width:768px){
.indexrayhub2 .main-title{font-size:2.5rem}
.indexrayhub2 .new-highlight{font-size:3rem}
}

.indexrayhub3{background: rgb(229, 229, 239);padding: 0;margin-top: -20px;}
.indexrayhub3 .container {width:80%;margin:0 auto;padding:40px 20px;}
.indexrayhub3.header {text-align:center;margin-bottom:60px;}
.indexrayhub3 .main-title {font-size:4rem;font-weight:900;background:linear-gradient(90deg,#FF6B00,#FFA500);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:20px;font-style:italic;}
.indexrayhub3 .subtitle {font-size:1.5rem;color:#333;font-weight:300;}
.indexrayhub3 .product-showcase {display:flex;justify-content:space-between;align-items:center;margin-bottom:80px;}
.indexrayhub3 .main-device {flex:0 0 45%;position:relative;}
.indexrayhub3 .main-device img {width:100%;height:auto;box-shadow:0 20px 40px rgba(0,0,0,0.1);border-radius:10px;}
.indexrayhub3 .device-tag {position:absolute;bottom:-20px;right:20px;background-color:#333;color:white;padding:10px 20px;font-size:1.2rem;border-radius:5px;}
.indexrayhub3 .handheld-devices {flex:0 0 45%;display:flex;flex-direction:column;gap:40px;}
.indexrayhub3 .handheld {display:flex;align-items:center;gap:20px;}
.indexrayhub3 .handheld img{width: 60%;}
.indexrayhub3 .handheld-info{width: 100%;}
.indexrayhub3 .handheld-info h3 {font-size:1.3rem;margin-bottom:3px;color:#FF6B00;font-weight: 300;}
.indexrayhub3 .handheld-info p {font-size:1rem;color:#666;}
.indexrayhub3 .features {display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-bottom:80px;}
.indexrayhub3 .feature {text-align:center;padding:30px;border-radius:10px;background-color:#f9f9f9;transition:transform 0.3s,box-shadow 0.3s;}
.indexrayhub3 .feature:hover {transform:translateY(-10px);box-shadow:0 15px 30px rgba(0,0,0,0.1);}
.indexrayhub3 .feature-icon {font-size:2.5rem;margin-bottom:20px;color:#FF6B00;}
.indexrayhub3 .feature h3 {font-size:1.3rem;margin-bottom:15px;color: #000000;}
.indexrayhub3 .feature p {font-size:0.9rem;color:#666;}
@media (max-width:992px) {
.indexrayhub3 .product-showcase {flex-direction:column;gap:40px;}
.indexrayhub3 .features {grid-template-columns:repeat(2,1fr);}
}
@media (max-width:768px) {
.indexrayhub3 .main-title {font-size:3rem;}
.indexrayhub3 .subtitle {font-size:1.2rem;}
.indexrayhub3 .handheld {flex-direction:column;text-align:center;}
.indexrayhub3 .features {grid-template-columns:1fr;}
}
.indexrayhub4{background-color: rgb(43, 43, 43);padding: 80px;}
.indexrayhub4 .container {max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;width:100%;}
.indexrayhub4 .info-section {width:45%;}
.indexrayhub4 .feature {margin-bottom:40px;border-top:1px solid #fff;}
.indexrayhub4 .feature-title {padding-top:20px;font-size:1.8rem;font-weight:bold;margin-bottom:15px;position:relative;display:inline-block;}
.indexrayhub4 .feature-desc {font-size:1rem;line-height:1.6;color:#ccc;}
.indexrayhub4 .device-section {width:45%;text-align:center;position:relative;}
.indexrayhub4 .device-image {width:100%;filter:drop-shadow(0 0 20px rgba(0,0,0,0.3));}
.indexrayhub2 .indexrayhub2yis{width: 70%;}
 @media (max-width:992px) {
.indexrayhub4 .container {flex-direction:column;}
.indexrayhub4 .info-section,.device-section {width:100%;}
.indexrayhub4 .info-section {margin-bottom:60px;}
}
@media (max-width:768px) {
.indexrayhub4 .feature-title {font-size:1.5rem;}
.indexrayhub4 .device-section{width: 80%;margin: 0px auto;}
.indexrayhub4,.indexrayhub6,.indexrayhub7,.indexrayhub8{padding:10px!important;margin: 0px auto;width: 100%;}
.indexrayhub2 .indexrayhub2yis{width: 90%;}
.indexrayhub3 .handheld img{width: 90%!important;}
}
.indexrayhub3{background: rgb(229, 229, 239);}
.indexrayhub5 .accolades-section {text-align:left;padding:60px 20px;max-width:1200px;margin:0 auto;width:100%;}
.indexrayhub5 .accolades-title {font-size:48px;font-weight:bold;margin-bottom:50px;color: #000000;}
.indexrayhub5 .accolades-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:40px 30px;max-width:1200px;margin:0 auto;}
 .indexrayhub6{ background: rgb(189, 189, 189);padding: 100px;}
 .indexrayhub6 .container {max-width:1200px;margin:0 auto;display:flex;}
.indexrayhub6 .service-intro {flex:0 90%;padding:30px;}
.indexrayhub6 .service-title {font-size:3.5rem;font-weight:800;margin-bottom:30px;line-height:1.2;color: #000000;}
.indexrayhub6 .service-title1 {font-size:1.5rem;font-weight:500;line-height:1.2;color: #000000;}
.indexrayhub6 .service-description {font-size:1.24rem!important;color:#333;margin-bottom:30px;line-height:1.8;}
.indexrayhub6 .learn-more-btn {display:inline-block;padding:12px 30px;background: rgb(0, 153, 153);color:white;text-decoration:none;font-weight:600;border-radius:4px;transition:all 0.3s ease;te}
.indexrayhub6 .learn-more-btn:hover {background:#00c4d1;transform:translateY(-2px);}
.indexrayhub6 .features {flex:0 0 60%;padding:30px;display:grid;grid-template-columns:1fr;gap:30px;}
.indexrayhub6 .feature {border-bottom:1px solid #eee;padding-bottom:30px;}
.indexrayhub6 .feature:last-child {border-bottom:none;}
.indexrayhub6 .feature-title {font-size:1rem;font-weight:700;margin-bottom:15px;color:#333;}
.indexrayhub6 .feature-subtitle {font-size:1rem;font-weight:600;margin-bottom:15px;color:#555;}
.indexrayhub6 .feature-desc {font-size:0.95rem;color:#666;line-height:1.7;}
 @media (max-width:992px) {
.indexrayhub6 .container {flex-direction:column;}
.indexrayhub6 .service-intro,.features {flex:0 0 100%;padding:40px;}
.indexrayhub6 .service-intro {border-right:none;border-bottom:1px solid #eee;}
}
@media (max-width:768px) {
.indexrayhub6 .service-title {font-size:2rem;}
.indexrayhub6 .service-intro,.features {padding:30px;}
}
.indexrayhub7{background: rgb(96, 96, 96);padding: 140px;}
.indexrayhub8{background: rgb(43, 43, 43);padding: 150px;}
.indexrayhub7 .services-section {padding:60px 20px;}
.indexrayhub7 .section-title {text-align:left;font-size:2.5rem;font-weight:900;margin-bottom:50px;text-transform:uppercase;letter-spacing:3px;}
.indexrayhub7 .services-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:30px;}
.indexrayhub7 .service-card {background:rgba(255,255,255,0.05);border-radius:8px;overflow:hidden;transition:transform 0.3s ease;}
.indexrayhub7 .service-card:hover {transform:translateY(-10px);}
.indexrayhub7 .service-image {width:100%;height:300px;object-fit:cover;}
.indexrayhub7 .service-content {padding:25px;}
.indexrayhub7 .service-title {font-size:1.5rem;margin-bottom:10px;font-weight:600;}
.indexrayhub7 .service-desc-tag{font-size:1.1rem;color:#ccc;margin-bottom:10px;}
.indexrayhub7 .service-desc {font-size:1.1rem;color:#ccc;margin-bottom:40px;height: 30px;}
.indexrayhub7 .read-more-btn {display:inline-block;padding:10px 25px;background: rgb(0, 153, 153);color:white;text-decoration:none;font-weight:500;border-radius:4px;transition:all 0.3s ease;}
.indexrayhub7 .read-more-btn:hover {background:rgba(255,0,0,0.2);}
.indexrayhub8  .video-section {position:relative;height:500px;overflow:hidden;}
.indexrayhub8 .city-video {width:100%;height:100%;object-fit:cover;opacity:0.8;}
.indexrayhub8 footer {display:flex;justify-content:space-between;align-items:center;padding:40px 20px;border:1px solid #fff;margin-top:50px;}
.indexrayhub7 .brand-info {display:flex;align-items:center;}
.indexrayhub7 .brand-logo {font-size:2rem;font-weight:700;margin-right:20px;padding:10px;border:1px solid #009999;}
.indexrayhub7 .brand-address {font-size:0.9rem;color:#aaa;}
.indexrayhub7 .contact-info {text-align:right;}
.indexrayhub7 .contact-title {font-size:1.2rem;margin-bottom:10px;font-weight:500;}
.indexrayhub7 .contact-detail {font-size:0.9rem;color:#aaa;margin-bottom:5px;}
 @media (max-width:992px) {
.indexrayhub7  .services-grid {grid-template-columns:repeat(2,1fr);}
.indexrayhub7 .service-card:last-child {grid-column:1 / -1;}
}
@media (max-width:768px) {
.indexrayhub7 .services-grid {grid-template-columns:1fr;}
.indexrayhub7 .section-title {font-size:2rem;}
.indexrayhub8 footer {flex-direction:column;text-align:center;}
.indexrayhub7 .brand-info {flex-direction:column;margin-bottom:30px;}
.indexrayhub7 .brand-logo {margin-right:0;margin-bottom:15px;}
.indexrayhub7  .contact-info {text-align:center;}
}