* { 
  margin: 0; 
  padding: 0; 
  box-sizing: border-box; 
  font-family: Arial, sans-serif; 
} 
.body { background-color: #ffffff; } 

/* ================= PRESENTACIÓN ================= */ 

.presentacion {
  display: flex;
  min-height: 100vh;
}

/* TEXTO */
.presentacion-texto {
  width: 50%;
  background-color: #f6d9dc;
  padding: 80px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.presentacion-texto h1 {
  font-size: 56px;
  color: #7a0f2b;
  margin-bottom: 30px;
}

/* ETIQUETAS */
.etiqueta {
  display: inline-block;
  border: 2px solid #7a0f2b;
  border-radius: 30px;
  padding: 10px 30px;
  margin-bottom: 15px;
  color: #7a0f2b;
  font-size: 16px;
}

/* FOTO */
.presentacion-foto {
  width: 50%;
  background-color: #d5a2a8;
  display: flex;
  justify-content: center;
  align-items: center;
}

.presentacion-foto img {
  width: 260px;
  border: 6px solid white;
}

/* ================= MOBILE ================= */
@media (max-width: 768px) {

  .presentacion {
    flex-direction: column;
  }

  .presentacion-texto {
    width: 100%;
    padding: 60px 30px;
    text-align: center;
    align-items: center;
  }

  .presentacion-texto h1 {
    font-size: 38px;
  }

  .presentacion-foto {
    width: 100%;
    padding: 40px 0;
  }

  .presentacion-foto img {
    width: 220px;
  }
}
        
        
        /* ================= SOBRE MI ================= */ 
        
        .sobre-mi { 
          background-color: #6f0f2b; 
          color: white; 
          padding: 70px 90px; 
          text-align: center; 
        } 
        
        .sobre-mi p { 
          max-width: 900px; 
          margin: 0 auto 35px; 
          font-size: 15px; 
          line-height: 1.6; 
        } 
        
        .btn-cv { 
          display: inline-block; 
          padding: 12px 30px; 
          background-color: #f3c4cd; 
          color: #6b0f24; 
          text-decoration: none; 
          border-radius: 25px; 
          font-weight: bold; 
          transition: all 0.3s ease; 
        } 
        
        .btn-cv:hover { 
          background-color: #6b0f24; 
          color: #ffffff; 
          transform: scale(1.05); 
        } 
        
        .proyectos { 
          display: flex; 
          flex-direction: column; 
          align-items: center; 
          gap: 25px; 
          padding: 80px 0; 
          background-color: #f2f2f2; } 
          
        .corazon { 
          color: #6b0f24; 
          font-size: 25px; 
        } 
        
        .titulo-proyectos { 
          background-color: #6b0f24; 
          color: white; 
          padding: 10px 40px; 
          border-radius: 30px; 
          font-weight: bold; 
          letter-spacing: 1px; } 
          
          .botones-proyectos { 
            display: flex; 
            flex-direction: column; 
            gap: 15px; 
          } 
            
          .proyecto-btn { 
            display: block; 
            width: 220px; 
            margin: 10px auto; 
            padding: 18px 0; 
            background: #f3c9cf; 
            text-align: center; 
            border-radius: 6px; 
            color: #5a0b1a; 
            font-weight: 600; 
            text-decoration: none; 
            transition: transform .25s ease, box-shadow .25s ease; 
          } 
          
          .proyecto-btn:hover { 
            transform: scale(1.05); 
            box-shadow: 0 4px 12px rgba(0,0,0,.15); } 
            
            
          .btn-proyecto:hover { 
            transform: scale(1.08); 
            background-color: #eab1bc; 
          } 
          
          .footer { 
            background-color: #d4a3a8; 
            padding: 80px 0; 
            text-align: center; }  
            
            
          .footer-titulo { 
            background-color: #6b0f24; 
            color: white; 
            display: inline-block; 
            padding: 10px 40px; /* largo del botón */ 
            border-radius: 30px; 
            font-weight: bold; 
            margin-bottom: 30px; 
            font-size: 17px; 
            letter-spacing: 1px; } /* Contenedor de íconos */ 

            
            
            .footer-iconos { 
              display: flex; 
              justify-content: center; 
              gap: 50px; } /* Círculos */ 
              
              
            .icono { 
              width: 60px; 
              height: 60px; 
              background-color: #6b0f24; 
              border-radius: 50%; 
              display: flex; 
              justify-content: center; 
              align-items: center; 
              transition: transform 0.3s ease;  } /* Íconos blancos */ 
            
            
            .icono img { 
              width: 32px; } /* Hover */ 
              

            .icono:hover { 
              transform: scale(1.15); 
            } 
            
            .sub-header { 
              text-align: center; 
              padding: 50px 0; 
              color: #5a0b1a; 
            } 
            
            .galeria { 
              width: 80%; 
              margin: auto; 
              display: grid; 
              grid-template-columns: 1fr 1fr; 
              gap: 25px; 
            } 
            
            .card { 
              background: #f8d7dd; 
              padding: 18px; 
              border-radius: 6px; 
              text-align: center; 
            } 
            
            .card img { 
              width: 100%; 
              border-radius: 6px; 
            } 
            
            .volver { 
              display: block; 
              width: fit-content; 
              margin: 40px auto; 
              color: #5a0b1a; 
              text-decoration: none; 
              font-weight: 600; 
            } 
            
            .badge-btn { 
              display: block; 
              margin: 10px auto 25px; 
              padding: 10px 25px; 
              border-radius: 20px; 
              border: none; 
              background-color: #f0cdd3; 
              color: #5b0a1a;  
              font-weight: 600; 
              font-size: 12px; 
              text-transform: uppercase; 
              letter-spacing: .5px; 
              cursor: pointer; 
              transition: transform .2s ease, box-shadow .2s ease; 
            } 
            
            .page-footer{ 
              background:#cf9ba2; 
              padding:25px 40px; 
              display:flex; 
              justify-content:space-between; 
              align-items:center; 
              margin-top:60px; 
            } 
            
            .footer-heart{ 
              font-size:32px; 
              color:#6A001C;
             } 
             
             .footer-firma{ 
              height:45px; 
              opacity:0.9; 
            } 
            
            .title-badge{ 
              display:inline-block; 
              border:3px solid #6A001C;
              color:#6A001C; 
              padding:10px 28px; 
              border-radius:40px; /* forma circular/oval */ 
              font-weight:700; 
              letter-spacing:.5px; 
            } 
            
            .title-badge{ 
              box-shadow:0 4px 10px rgba(0,0,0,.12); 
            } 
            
            .titulo-seccion { 
              display: flex; 
              justify-content: center; 
              margin: 60px 0; 
            } 
            
            .titulo-seccion h2 { 
              background-color: #6e0f2d; 
              color: #f2f2f2; 
              padding: 14px 60px; 
              border-radius: 40px; 
              font-weight: bold; 
              letter-spacing: 1px; 
              font-size: 1.6rem; 
            } 
            
            .galeria { 
              display: grid; 
              grid-template-columns: repeat(2, 1fr); 
              gap: 40px; padding: 60px 80px; 
            } 
            
            .card { 
              background-color: #f0cdd3; 
              border-radius: 25px; 
              padding: 20px; 
              box-shadow: 0 10px 25px rgba(0,0,0,0.08); 
              display: flex; 
              flex-direction: column; 
              gap: 15px; 
            } 
            
            .card video { 
              width: 100%; 
              border-radius: 18px; 
              object-fit: cover; 
            } 
            
            .card p { 
              font-size: 0.95rem; 
              line-height: 1.5; 
              color: #5a0f2a; 
            }