.elementor-316 .elementor-element.elementor-element-a77cb48{--display:flex;}.elementor-316 .elementor-element.elementor-element-a77cb48.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-316 .elementor-element.elementor-element-24129e2{width:100%;max-width:100%;}.eael-reading-progress-wrap .eael-reading-progress{height:5px !important;}.eael-reading-progress-wrap .eael-reading-progress .eael-reading-progress-fill{height:5px !important;background-color:#1fd18e;transition:width 50ms ease;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-316 .elementor-element.elementor-element-a77cb48{--width:98.295%;}}/* Start custom CSS for container, class: .elementor-element-a77cb48 */*{
      margin:0;
      padding:0;
      box-sizing:border-box;
      scroll-behavior:smooth;
    }

    body{
      font-family:'Poppins',sans-serif;
      background:#071C3D;
      color:white;
      overflow-x:hidden;
    }

    :root{
      --navy:#071C3D;
      --electric:#2D6BFF;
      --sky:#59C8FF;
      --yellow:#FFC107;
      --red:#FF3B30;
      --white:#ffffff;
      --light:#F4F7FB;
    }

    .container{
      width:90%;
      max-width:1300px;
      margin:auto;
    }

    section{
      padding:90px 0;
      position:relative;
    }

    h1,h2,h3{
      font-family:'Montserrat',sans-serif;
    }

    .hero{
      min-height:100vh;
      display:flex;
      align-items:center;
      background:linear-gradient(135deg,#071C3D,#0B2E63,#071C3D);
      position:relative;
      overflow:hidden;
    }

    .hero::before{
      content:'';
      position:absolute;
      width:500px;
      height:500px;
      background:rgba(45,107,255,0.15);
      border-radius:50%;
      top:-100px;
      right:-100px;
      filter:blur(40px);
    }

    .hero-content{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:60px;
      align-items:center;
    }

    .hero-text h1{
      font-size:70px;
      line-height:1.1;
      margin-bottom:25px;
    }

    .gradient-text{
      background:linear-gradient(90deg,var(--electric),var(--sky));
      -webkit-background-clip:text;
      -webkit-text-fill-color:transparent;
    }

    .hero-text p{
      font-size:20px;
      color:#d6e3ff;
      line-height:1.8;
      margin-bottom:35px;
    }

    .btn-group{
      display:flex;
      gap:20px;
      flex-wrap:wrap;
    }

    .btn{
      padding:16px 32px;
      border-radius:12px;
      text-decoration:none;
      font-weight:700;
      transition:0.3s;
      display:inline-block;
    }

    .btn-primary{
      background:var(--yellow);
      color:#000;
    }

    .btn-primary:hover{
      transform:translateY(-5px);
      box-shadow:0 15px 30px rgba(255,193,7,0.3);
    }

    .btn-secondary{
      border:2px solid var(--electric);
      color:white;
    }

    .btn-secondary:hover{
      background:var(--electric);
    }

    .hero-image{
      position:relative;
      text-align:center;
    }

    .hero-image img{
      width:100%;
      max-width:430px;
      border-radius:30px;
      border:4px solid rgba(255,255,255,0.1);
      box-shadow:0 30px 60px rgba(0,0,0,0.4);
    }

    .floating-card{
      position:absolute;
      background:rgba(255,255,255,0.08);
      backdrop-filter:blur(10px);
      padding:18px 22px;
      border-radius:18px;
      border:1px solid rgba(255,255,255,0.08);
      font-weight:600;
    }

    .card1{
      top:20px;
      left:-30px;
      color:var(--yellow);
    }

    .card2{
      bottom:30px;
      right:-20px;
      color:var(--sky);
    }

    .section-title{
      text-align:center;
      margin-bottom:60px;
    }

    .section-title h2{
      font-size:52px;
      margin-bottom:15px;
    }

    .section-title p{
      color:#b9c7e6;
      max-width:800px;
      margin:auto;
      line-height:1.8;
    }

    .about-grid{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:50px;
      align-items:center;
    }

    .about-grid img{
      width:100%;
      border-radius:25px;
      box-shadow:0 25px 50px rgba(0,0,0,0.3);
    }

    .about-text h3{
      font-size:42px;
      margin-bottom:25px;
    }

    .about-text p{
      color:#d6e3ff;
      line-height:1.9;
      margin-bottom:18px;
      font-size:17px;
    }

    .cards{
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
      gap:25px;
    }

    .card{
      background:rgba(255,255,255,0.05);
      padding:35px;
      border-radius:25px;
      border:1px solid rgba(255,255,255,0.08);
      transition:0.3s;
    }

    .card:hover{
      transform:translateY(-10px);
      background:rgba(255,255,255,0.08);
    }

    .card h3{
      font-size:28px;
      margin-bottom:18px;
      color:var(--yellow);
    }

    .card p{
      color:#d6e3ff;
      line-height:1.8;
    }

    .color-palette{
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
      gap:30px;
    }

    .color-box{
      border-radius:24px;
      overflow:hidden;
      background:#fff;
      color:#000;
      box-shadow:0 20px 40px rgba(0,0,0,0.2);
    }

    .color-preview{
      height:180px;
    }

    .color-info{
      padding:22px;
    }

    .color-info h4{
      font-size:24px;
      margin-bottom:10px;
    }

    .fonts-grid{
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
      gap:25px;
    }

    .font-card{
      background:white;
      color:#000;
      padding:35px;
      border-radius:24px;
    }

    .font1{
      font-family:'Poppins',sans-serif;
    }

    .font2{
      font-family:'Montserrat',sans-serif;
    }

    .font3{
      font-family:'Outfit',sans-serif;
    }

    .font-card h3{
      font-size:38px;
      margin-bottom:15px;
    }

    .social-grid{
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
      gap:25px;
    }

    .social-card{
      background:linear-gradient(145deg,#0B2E63,#071C3D);
      padding:35px;
      border-radius:24px;
      border:1px solid rgba(255,255,255,0.08);
    }

    .social-card h3{
      font-size:32px;
      margin-bottom:15px;
      color:var(--yellow);
    }

    .social-card a{
      color:#59C8FF;
      text-decoration:none;
      word-break:break-word;
    }

    .logo-section{
      text-align:center;
    }

    .logo-section img{
      width:280px;
      background:white;
      padding:20px;
      border-radius:30px;
      box-shadow:0 20px 50px rgba(0,0,0,0.3);
    }

    footer{
      background:#031124;
      padding:40px 0;
      text-align:center;
      color:#9fb2d8;
    }

    @media(max-width:900px){
      .hero-content,
      .about-grid{
        grid-template-columns:1fr;
      }

      .hero-text h1{
        font-size:48px;
      }

      .section-title h2{
        font-size:38px;
      }

      .about-text h3{
        font-size:34px;
      }

      .floating-card{
        display:none;
      }
    }/* End custom CSS */