:root {
            --three-coral: #FF6B6B;
            --three-dark: #1a1a1a;
            --three-light-coral: #FFB5B5;
               --three-white: #FFFFFF;
        }
   
        body {
            font-family: HelveticaNeue, Helvetica, Arial, sans-serif;
            margin: 0;
            padding: 0;
        }
        h1{
        font-size: 61px;
        letter-spacing: -1px;
        line-height: 65px;
        font-weight:700;
        }
        .navbar {
   
    box-shadow: none;
  
}
        .top-banner {
            background: var(--three-white);
            color: white;
            text-align: center;
            padding: 10px;
            font-size: 14px;
        }
        
        .navbar {
               background: linear-gradient(rgb(255, 132, 116), rgb(255, 171, 169));
            box-shadow:none;
        }
        
        .navbar-brand {
            font-size: 32px;
            font-weight: bold;
            color: var(--three-dark) !important;
        }
        .bg-color{
                background: gradient(linear, left top, left bottom, from(#ff7b67), color-stop(26%, #ff8474), color-stop(66%, #ffaba9), to(#ffdced));
    background: linear-gradient(#ff7b67, #ff8474 26%, #ffaba9 66%, #ffdced);
}
        
        .hero-section {
          
            color: white;
            padding: 0px 0px 20px 0px;
            position: relative;
            overflow: hidden;
        }
        
        .hero-content h1 {
            font-size: 48px;
            font-weight: bold;
            margin-bottom: 20px;
        }
        .hero-section h3{
        font-size: 37px;
        line-height: 45px;
          margin-bottom: 10px;
          font-weight: 700;
          color: #000000;
        }
        
        .hero-box {
            background: rgba(255, 255, 255, 0.15);
               padding: 66px 25px;
        }
        
       
        .hero-box p {
          font-size: 24px;
        line-height: 30px;
            margin-bottom: 20px;
                color: #000000;
        }
        
        .btn-dark-custom {
            background: var(--three-dark);
            color: white;
            border: none;
            padding: 12px 30px;
            border-radius: 15px !important;
            font-weight: bold;
            text-decoration: none;
            display: inline-block;
            min-width: 226px;
                text-align: center;
        }
        
        .btn-dark-custom:hover {
            background: #333;
            color: white;
        }
        
      
        
     
        
        .phone-placeholder {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            width: 100px;
            height: 120px;
            border-radius: 15px;
            margin: 0 auto 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-size: 14px;
        }
        
        .black-banner {
             background: var(--three-dark);
    height: 80px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
        }
        
        .card-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 20px;
            margin: 40px 0;
        }
        
        .product-card {
          background: linear-gradient(rgb(255, 132, 116), rgb(255, 171, 169));
            border-radius: 15px;
            padding: 30px;
            color: white;
            text-align: center;
            transition: transform 0.3s;
        }
        
        .product-card:hover {
            transform: translateY(-5px);
        }
        
        .product-image {
            
            margin: 0 auto 20px;
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        .product-card h4 {
                 font-size: 24px;
        line-height: 30px;
        margin-bottom: 10px;
          color:#000000;
          font-weight: 700;
        }
        
        .product-card p {
            font-size: 14px;
            margin-bottom: 20px;
             color: #000000;
        }
        .sim-plan {
            text-align: left;
        }
        
        .network-section {
            background: linear-gradient(rgb(255, 132, 116), rgb(255, 171, 169));
            color: #000000;
                 border-radius: 15px;
           
        }
        
        .network-section h2 {
            font-size: 42px;
            font-weight: bold;
        }
        
        .section-title {
            font-size: 36px;
            font-weight: bold;
            margin: 60px 0 30px;
            color: var(--three-dark);
        }
        
        .icon-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
            gap: 30px;
            margin: 40px 0;
        }
        
        .icon-card {
            text-align: center;
            padding: 20px;
        }
        
        .icon-circle {
            width: 80px;
            height: 80px;
            background: #f5f5f5;
            border-radius: 50%;
            margin: 0 auto 15px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 32px;
        }
        
        .android-section {
            background: var(--three-coral);
            border-radius: 20px;
            padding: 50px;
            color: white;
            margin: 40px 0;
        }
        
        .android-logo {
            font-size: 72px;
            color: #a4c639;
        }
        
        .ai-glasses-section {
            background: white;
            border: 2px solid #e0e0e0;
            border-radius: 20px;
            padding: 40px;
            margin: 40px 0;
        }
        
        .partner-card {
            border-radius: 15px;
            overflow: hidden;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
            margin-bottom: 20px;
        }
        
        .partner-image {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            height: 180px;
        }
        
        .partner-content {
            padding: 20px;
        }
        
        .help-card {
            background: white;
            border-radius: 15px;
            padding: 30px;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
            text-align: center;
        }
        
        .help-icon {
            width: 80px;
            height: 80px;
            background: var(--three-coral);
            border-radius: 50%;
            margin: 0 auto 20px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-size: 36px;
        }
        
        .footer {
            background: #f5f5f5;
            padding: 50px 0 20px;
            margin-top: 60px;
        }
        
        .footer-links {
            list-style: none;
            padding: 0;
        }
        
        .footer-links li {
            margin-bottom: 10px;
        }
        
        .footer-links a {
            color: var(--three-dark);
            text-decoration: none;
        }
        
        .social-icons {
            display: flex;
            gap: 15px;
            margin-top: 20px;
        }
        
        .social-icons a {
            width: 40px;
            height: 40px;
            background: var(--three-dark);
            color: white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            text-decoration: none;
        }
        
        .logo-circle {
            width: 120px;
            height: 120px;
            background: white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 40px auto;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
        }
        
        .three-logo {
            font-size: 48px;
            font-weight: bold;
            color: var(--three-dark);
        }
        
        .why-section {
            margin: 60px 0;
        }
        
        .why-card {
            background: var(--three-coral);
            border-radius: 15px;
            padding: 40px;
            color: white;
            height: 100%;
        }
        
        .why-card h3 {
            font-size: 28px;
            margin-bottom: 20px;
        }