:root {
      --blue: #0EA5E9;
      --gold: #F59E0B;
      --dark: #0F172A;
      --darker: #020617;
      --gray: #1e293b;
    }
    * { margin:0; padding:0; box-sizing:border-box; }
    body { font-family: 'Poppins', sans-serif; background:var(--darker); color:white; line-height:1.8; }
    a { text-decoration: none !important; color: inherit; } /* No underline forever */

    /* Hero */
    .hero {
      min-height:100vh;
      background: linear-gradient(135deg, var(--blue) 0%, var(--dark) 70%);
      display:flex; align-items:center; justify-content:center;
      text-align:center; padding:2rem; position:relative;
    }
    .profile-img {
      width:220px; height:220px; border-radius:50%;
      border:10px solid var(--gold); overflow:hidden;
      margin:0 auto 30px; box-shadow:0 0 60px rgba(245,158,11,0.4);
    }
    .profile-img img { width:100%; height:100%; object-fit:cover; }
    h1 { font-size:4.5rem; font-weight:900;
      background: linear-gradient(to right, white, var(--gold));
      -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    }
    .title { font-size:2.3rem; color:var(--blue); margin:20px 0; }
    .hero p { font-size:1.3rem; max-width:700px; margin:0 auto 40px; color:#e2e8f0; }

    .btn {
      display:inline-flex; align-items:center; gap:15px;
      padding:18px 45px; border-radius:50px; font-weight:bold; font-size:1.3rem;
      margin:10px; transition:0.4s; box-shadow:0 15px 35px rgba(0,0,0,0.4);
    }
    .btn-whatsapp { background:#25D366; }
    .btn-whatsapp:hover { background:#1ebe57; transform:translateY(-8px); }
    .btn-mail { background:var(--blue); }
    .btn-mail:hover { background:#0284c7; transform:translateY(-8px); }

    section { padding:100px 20px; }
    .container { max-width:1200px; margin:0 auto; }
    h2 { font-size:3.5rem; text-align:center; margin-bottom:70px; position:relative; }
    h2::after { content:''; width:100px; height:5px; background:var(--gold);
      position:absolute; bottom:-20px; left:50%; transform:translateX(-50%); border-radius:3px; }

    /* Resume Section Styles (NEW) */
    .resume-cta {
        text-align: center;
        background: var(--dark);
        padding: 50px;
        border-radius: 20px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    }
    .resume-cta p {
        font-size: 1.5rem;
        margin-bottom: 30px;
        color: #94a3b8;
    }
    .resume-actions {
        display: flex;
        justify-content: center;
        gap: 20px;
    }
    .resume-btn {
        padding: 15px 35px;
        border-radius: 50px;
        font-size: 1.2rem;
        font-weight: 600;
        transition: 0.3s;
        display: inline-flex;
        align-items: center;
        gap: 10px;
    }
    .btn-view {
        background-color: var(--gold);
        color: var(--darker);
    }
    .btn-view:hover {
        background-color: #d9900a;
        transform: translateY(-5px);
    }
    .btn-download {
        background-color: var(--blue);
        color: white;
    }
    .btn-download:hover {
        background-color: #0284c7;
        transform: translateY(-5px);
    }


    /* Skills */
    .skills { background:var(--gray); }
    /* Updated grid to ensure digital marketing skills fit nicely */
    .skills-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(140px,1fr)); gap:20px; }
    .skill { text-align:center; padding:35px 20px; background:rgba(255,255,255,0.05);
      border-radius:20px; transition:0.4s; border:1px solid rgba(245,158,11,0.2); }
    .skill:hover { background:rgba(245,158,11,0.1); transform:translateY(-15px); }
    .skill i { font-size:3.5rem; color:var(--gold); margin-bottom:15px; }
    /* Adjusted font size for long skill names */
    .skill span { font-size: 0.9rem; font-weight: 600; }
    .skill br { display: none; } /* Remove existing line breaks from original code */


    /* Projects */
    .projects-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(340px,1fr)); gap:40px; }
    .project {
      background:var(--gray); border-radius:25px; overflow:hidden;
      box-shadow:0 20px 40px rgba(0,0,0,0.5); transition:0.5s;
    }
    .project:hover { transform:translateY(-20px); }
    .project-img {
      height:250px; background:linear-gradient(45deg,#334155,#1e293b);
      display:flex; align-items:center; justify-content:center;
      font-size:2rem; color:#94a3b8;
    }
    .project-info { padding:30px; }
    .project-info h3 { color:var(--gold); font-size:1.8rem; margin-bottom:15px; }
    .live-btn {
      display:inline-block; background:var(--blue); color:white;
      padding:12px 30px; border-radius:50px; margin-top:15px; font-weight:bold;
      transition:0.3s;
    }
    .live-btn:hover { background:var(--gold); transform:scale(1.05); }

    /* Contact */
    .contact { background:linear-gradient(to right,var(--blue),var(--dark)); text-align:center; }
    .social { display:flex; justify-content:center; gap:50px; margin-top:50px; font-size:3rem; }
    .social a:hover { color:var(--gold); transform:scale(1.3); transition:0.4s; }

    footer { background:black; padding:40px; text-align:center; }

    @media (max-width:768px) {
      h1 { font-size:3rem; }
      .title { font-size:1.8rem; }
      .btn { padding:15px 30px; font-size:1.1rem; }
      .resume-actions { flex-direction: column; gap: 15px; }
      .resume-btn { width: 100%; justify-content: center; }
    }
    
    .live-icon i,
    .github-btn i {
      font-size: 1.3rem;
      margin-right: 8px;
    }

    .github-btn i {
      font-size: 1.4rem !important;
      margin-right: 8px;
    }