 *{
      margin:0;
      padding:0;
      box-sizing:border-box;
      font-family:Arial, Helvetica, sans-serif;
    }

     body{ 
    
       background:#050313;
       color:white;
       min-height:100vh;
       overflow-x:hidden;  
    } 

    /* ARKA PLAN IŞIK */
    body::before{
      content:"";
      position:fixed;
      left:-200px;
      bottom:-200px;
      width:500px;
      height:500px;
      background:radial-gradient(circle, rgba(255,80,0,0.25), transparent 70%);
      z-index:-1;
       
    }

    body::after{
      content:"";
      position:fixed;
      right:0;
      top:0;
      width:400px;
      height:400px;
      background:radial-gradient(circle, rgba(0,140,255,0.15), transparent 70%);
      z-index:-1;
    }

    /* HEADER */
    header{
      width:100%;
      padding:25px 8%;
      display:flex;
      align-items:center;
      justify-content:space-between; 
      
    }

    .logo{
      font-size:65px;
      color:#d49b54;
      font-weight:300;
    }

    .logo span{
      display:block;
      font-size:28px;
      margin-left:120px;
      margin-top:-10px;
    }

    nav{
      display:flex;
      align-items:center;
      gap:45px;
    }

    nav a{
      color:#ff8c00;
      text-decoration:none;
      font-weight:600;
      transition:0.3s;
    }

    nav a:hover{
      color:white;
    }

    .btn{
      background:#ff9800;
      color:white;
      padding:14px 35px;
      border-radius:40px;
      text-decoration:none;
      font-weight:bold;
      transition:0.3s;
    }

    .btn:hover{
      transform:scale(1.05);
    }

    /* CONTACT */
    .contact-container{
      width:100%;
      min-height:80vh;
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      padding:80px 8%;
      gap:80px;
    }

    .contact-left{
      width:40%;
    }

    .contact-left h1{
      font-size:55px;
      margin-bottom:30px;
    }

    .contact-info{
      list-style:none;
    }

    .contact-info li{
      margin-bottom:25px;
      font-size:22px;
      line-height:1.7;
    }

    .contact-right{
      width:50%;
    }

    .contact-form{
      width:100%;
    }

    .contact-form input,
    .contact-form textarea{
      width:100%;
      background:transparent;
      border:1px solid rgba(255,255,255,0.4);
      padding:20px;
      margin-bottom:25px;
      color:white;
      font-size:18px;
      outline:none;
    }

    .contact-form textarea{
      height:250px;
      resize:none;
    }

    .contact-form input::placeholder,
    .contact-form textarea::placeholder{
      color:#d0d0d0;
      font-style:italic;
    }

    .submit-btn{
      background:#4a4a4a;
      color:white;
      border:none;
      padding:18px 40px;
      font-size:18px;
      font-weight:bold;
      cursor:pointer;
      transition:0.3s;
    }

    .submit-btn:hover{
      background:#ff9800;
    }

    /* MOBİL */
    @media(max-width:950px){

      header{
        flex-direction:column;
        gap:25px;
      }

      nav{
        flex-wrap:wrap;
        justify-content:center;
      }

      .contact-container{
        flex-direction:column;
      }

      .contact-left,
      .contact-right{
        width:100%;
      }

      .logo{
        font-size:50px;
      }

      .contact-left h1{
        font-size:42px;
      }
    }
    .logo{
    display:left;
    flex-direction:column;
    line-height:1;
}

.logo .zara{
    font-size:72px;
    font-weight:700;
    letter-spacing:8px;
    background:linear-gradient(135deg,#ffb347,#ffcc70,#ff8c00);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    text-transform:uppercase;
    text-shadow:
      0 0 10px rgba(255,140,0,0.4),
      0 0 25px rgba(255,140,0,0.2);
      margin-left: auto;
}

  .logo .ai{
    font-size:37px;
    font-weight:300;
    letter-spacing:10px;
    color:#ffb347;
    margin-left: auto;
    margin-top:-8px;
    text-shadow:0 0 12px rgba(255,180,71,0.5);
  }

  .logo .zara:hover{
    transform:scale(1.03);
    transition:0.4s ease;
   margin-left: auto;
}

  

.logo{
    display:flex;
    align-items:flex-end;
    gap:10px;

    cursor:pointer;
}

/* ZARA */
.zara{

    font-size:58px;
    font-weight:900;

    letter-spacing:8px;

    background:linear-gradient(
    135deg,
    #ffffff,
    #7dc4ff,
    #7a5cff,
    #d86cff
    );

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;

    text-shadow:
    0 0 12px rgba(0,166,255,0.25),
    0 0 28px rgba(122,92,255,0.18);

    transition:0.4s ease;
}

/* AI */
.ai{

    font-size:26px;
    font-weight:700;

    letter-spacing:5px;

    color:#00a6ff;

    margin-bottom:8px;

    text-shadow:
    0 0 10px rgba(0,166,255,0.45);

    transition:0.4s ease;
}

/* HOVER */
.logo:hover .zara{

    transform:translateY(-2px);

    filter:brightness(1.2);

    text-shadow:
    0 0 20px rgba(0,166,255,0.45),
    0 0 40px rgba(122,92,255,0.25);
}

.logo:hover .ai{

    color:#d86cff;

    text-shadow:
    0 0 20px rgba(216,108,255,0.5);
}

.zara,
.ai{
    font-family:'Orbitron',sans-serif;
}